diff --git a/resources/mixins.less b/resources/mixins.less
index cfb444bc..423f2f1d 100644
--- a/resources/mixins.less
+++ b/resources/mixins.less
@@ -6,11 +6,11 @@
 @import 'variables.less';
 
 .citizen-card( @border-radius: true ) {
-	background-color: var(--color-surface-1);
-	box-shadow: var(--box-shadow-dialog);
+	background-color: var( --color-surface-1 );
+	box-shadow: var( --box-shadow-dialog );
 
 	& when ( @border-radius ) {
-		border-radius: var(--border-radius--medium);
+		border-radius: var( --border-radius--medium );
 	}
 }
 
@@ -69,8 +69,8 @@
 	left: 0;
 	overflow: auto;
 	min-width: 16rem;
-	max-height: var(--header-card-maxheight);
-	margin: var(--space-xs);
+	max-height: var( --header-card-maxheight );
+	margin: var( --space-xs );
 	contain: content;
 	overscroll-behavior: contain;
 	-webkit-user-select: none;
@@ -78,7 +78,7 @@
 	.citizen-card();
 	.citizen-card-hide( top @position );
 
-	@media (min-width: @width-breakpoint-tablet) {
+	@media ( min-width: @width-breakpoint-tablet ) {
 		& when ( @position = left ) {
 			right: unset;
 		}
@@ -88,7 +88,7 @@
 		}
 	}
 
-	@media (min-width: @width-breakpoint-desktop) {
+	@media ( min-width: @width-breakpoint-desktop ) {
 		& when ( @position = left ) {
 			.citizen-card-hide( top left );
 		}
@@ -104,7 +104,7 @@
 	top: @topOffset;
 
 	& when ( @bottomBorder ) {
-		border-bottom: 1px solid var(--border-color-base);
+		border-bottom: 1px solid var( --border-color-base );
 	}
 
 	& when ( @zIndex ) {
@@ -120,9 +120,9 @@
 		right: ~'calc( var(--padding-page ) * -1 )';
 		left: ~'calc( var(--padding-page ) * -1 )';
 		height: 100%;
-		-webkit-backdrop-filter: saturate(50%) blur(16px);
-		backdrop-filter: saturate(50%) blur(16px);
-		background-color: var(--background-color-overlay);
+		-webkit-backdrop-filter: saturate( 50% ) blur( 16px );
+		backdrop-filter: saturate( 50% ) blur( 16px );
+		background-color: var( --background-color-overlay );
 		content: '';
 	}
 }
@@ -135,7 +135,7 @@
 
 // Set content to be at the center
 .content-center() {
-	max-width: var(--width-layout);
+	max-width: var( --width-layout );
 	margin-right: auto;
 	margin-left: auto;
 }
@@ -179,44 +179,44 @@
 .menu-item-link() {
 	display: flex;
 	align-items: center;
-	color: var(--color-base) !important;
-	font-weight: var(--font-weight-medium);
-	gap: var(--space-sm);
+	color: var( --color-base ) !important;
+	font-weight: var( --font-weight-medium );
+	gap: var( --space-sm );
 }
 
 .menu-item-link-hover() {
-	background-color: var(--background-color-primary--hover);
+	background-color: var( --background-color-primary--hover );
 }
 
 .menu-item-link-active() {
-	background-color: var(--background-color-primary--active);
+	background-color: var( --background-color-primary--active );
 }
 
 // Button Styles
 .button-blue() {
-	background-color: var(--color-primary);
+	background-color: var( --color-primary );
 	color: #fff !important;
 	transition: @transition-background, @transition-color;
 }
 
 .button-blue-hover() {
-	background-color: var(--color-primary--hover);
+	background-color: var( --color-primary--hover );
 }
 
 .button-blue-active() {
-	background-color: var(--color-primary--active);
+	background-color: var( --color-primary--active );
 }
 
 .button-red() {
-	background-color: var(--color-destructive);
+	background-color: var( --color-destructive );
 	color: #fff !important;
 	transition: @transition-background, @transition-color;
 }
 
 .button-red-hover() {
-	background-color: var(--color-destructive--hover);
+	background-color: var( --color-destructive--hover );
 }
 
 .button-red-active() {
-	background-color: var(--color-destructive--active);
+	background-color: var( --color-destructive--active );
 }
diff --git a/resources/skins.citizen.search/skins.citizen.search.less b/resources/skins.citizen.search/skins.citizen.search.less
index 72038e3b..18970b95 100644
--- a/resources/skins.citizen.search/skins.citizen.search.less
+++ b/resources/skins.citizen.search/skins.citizen.search.less
@@ -5,7 +5,7 @@
 	position: absolute;
 	overflow: auto;
 	width: 100%;
-	max-height: var(--header-card-maxheight);
+	max-height: var( --header-card-maxheight );
 	box-sizing: border-box;
 	padding: 0.75rem 0 0 0;
 	margin: -0.75rem 0 0 0; // Reset <ol> styles
@@ -19,7 +19,7 @@
 	&__item {
 		.citizen-typeahead {
 			&__thumbnail {
-				margin-right: var(--space-sm);
+				margin-right: var( --space-sm );
 
 				&.citizen-ui-icon {
 					width: 100%; // reset width
@@ -32,7 +32,7 @@
 		}
 
 		&--active {
-			background-color: var(--background-color-primary--hover);
+			background-color: var( --background-color-primary--hover );
 		}
 
 		&--hidden {
@@ -43,12 +43,12 @@
 			.citizen-typeahead {
 				&__content {
 					flex-direction: column;
-					padding: var(--space-xl) 0;
+					padding: var( --space-xl ) 0;
 					text-align: center;
 				}
 
 				&__thumbnail {
-					margin-bottom: var(--space-sm);
+					margin-bottom: var( --space-sm );
 				}
 			}
 		}
@@ -62,7 +62,7 @@
 
 					&.citizen-ui-icon {
 						height: 60px;
-						background-color: var(--color-surface-3);
+						background-color: var( --color-surface-3 );
 
 						&::before {
 							background-size: 20px;
@@ -75,17 +75,17 @@
 		&--tool {
 			.citizen-typeahead {
 				&__content {
-					padding: var(--space-sm) 0;
-					border-top: 1px solid var(--border-color-base);
+					padding: var( --space-sm ) 0;
+					border-top: 1px solid var( --border-color-base );
 				}
 
 				&__thumbnail {
-					height: var(--size-icon);
+					height: var( --size-icon );
 					background-color: transparent;
 				}
 
 				&__description {
-					color: var(--color-base);
+					color: var( --color-base );
 				}
 			}
 
@@ -100,9 +100,9 @@
 	&__content {
 		display: flex;
 		align-items: center;
-		padding: var(--space-xs) 0;
-		margin: 0 var(--space-sm);
-		color: var(--color-base);
+		padding: var( --space-xs ) 0;
+		margin: 0 var( --space-sm );
+		color: var( --color-base );
 	}
 
 	&__thumbnail {
@@ -111,7 +111,7 @@
 		max-width: 70px;
 		height: 60px;
 		flex-shrink: 0;
-		border-radius: var(--border-radius--medium);
+		border-radius: var( --border-radius--medium );
 
 		&.citizen-ui-icon::before {
 			background-size: contain;
@@ -130,31 +130,31 @@
 
 	&__title {
 		flex-shrink: 0;
-		color: var(--color-base--emphasized);
-		font-weight: var(--font-weight-semibold);
+		color: var( --color-base--emphasized );
+		font-weight: var( --font-weight-semibold );
 	}
 
 	&__highlight {
-		color: var(--color-base--subtle);
-		font-weight: var(--font-weight-medium);
+		color: var( --color-base--subtle );
+		font-weight: var( --font-weight-medium );
 	}
 
 	&__query {
-		color: var(--color-base--emphasized);
-		font-weight: var(--font-weight-semibold);
+		color: var( --color-base--emphasized );
+		font-weight: var( --font-weight-semibold );
 	}
 
 	&__label {
 		display: flex;
-		margin-left: var(--space-xs);
-		color: var(--color-base);
+		margin-left: var( --space-xs );
+		color: var( --color-base );
 		font-size: 0.8125rem;
-		gap: var(--space-xxs);
+		gap: var( --space-xxs );
 
 		.citizen-ui-icon {
 			width: 0.8125rem;
 			height: 0.8125rem;
-			margin-right: var(--space-xxs);
+			margin-right: var( --space-xxs );
 		}
 	}
 
@@ -165,7 +165,7 @@
 
 	&__description {
 		margin-top: 0.1rem;
-		color: var(--color-base--subtle);
+		color: var( --color-base--subtle );
 		font-size: 0.8125rem;
 	}
 
@@ -177,14 +177,14 @@
 
 	&__actions {
 		position: absolute;
-		right: var(--space-sm);
+		right: var( --space-sm );
 	}
 
 	&__keyboard {
 		display: none;
 		padding: 0 8px;
-		border-radius: var(--border-radius--small);
-		background-color: var(--color-surface-1);
+		border-radius: var( --border-radius--small );
+		background-color: var( --color-surface-1 );
 	}
 
 	&--expanded {
@@ -193,7 +193,7 @@
 }
 
 // HACK: This is as close as we can to detect whether there is a keyboard in CSS
-@media (hover: hover) and (pointer: fine) {
+@media ( hover: hover ) and ( pointer: fine ) {
 	.citizen-typeahead {
 		&__item--active {
 			.citizen-typeahead__keyboard {
diff --git a/resources/skins.citizen.styles/ContentFooter.less b/resources/skins.citizen.styles/ContentFooter.less
index bb757ce0..2083ed24 100644
--- a/resources/skins.citizen.styles/ContentFooter.less
+++ b/resources/skins.citizen.styles/ContentFooter.less
@@ -1,7 +1,7 @@
 .mw-body-footer {
 	display: flex;
 	flex-direction: column;
-	gap: var(--space-xl);
+	gap: var( --space-xl );
 	grid-area: footer;
-	line-height: var(--line-height-sm);
+	line-height: var( --line-height-sm );
 }
diff --git a/resources/skins.citizen.styles/Drawer.less b/resources/skins.citizen.styles/Drawer.less
index daa8824b..17ddf924 100644
--- a/resources/skins.citizen.styles/Drawer.less
+++ b/resources/skins.citizen.styles/Drawer.less
@@ -1,6 +1,6 @@
 .citizen-drawer {
 	&__card {
-		padding: var(--space-xs) 0;
+		padding: var( --space-xs ) 0;
 		.citizen-header-card( left );
 	}
 
@@ -8,25 +8,24 @@
 		display: flex;
 		align-items: center;
 		justify-content: center;
-		padding: var(--space-md);
-		border-bottom: 1px solid var(--border-color-base);
-		gap: var(--space-md);
+		padding: var( --space-md );
+		border-bottom: 1px solid var( --border-color-base );
+		gap: var( --space-md );
 	}
 
 	// Keep aspect ratio
 	&__logo {
 		display: flex;
-		flex-direction: row;
+		flex-flow: row nowrap;
 		align-items: center;
-		flex-wrap: nowrap;
-		
+
 		img {
 			width: auto;
 			max-height: 3rem;
 		}
 
 		.mw-logo-wordmark {
-			color: var(--color-base--emphasized);
+			color: var( --color-base--emphasized );
 			font-size: 1.5rem;
 			margin: 0 1rem;
 		}
@@ -43,15 +42,15 @@
 		display: grid;
 		max-width: 92.5vw;
 		justify-content: center;
-		padding: var(--space-xs) var(--space-md);
+		padding: var( --space-xs ) var( --space-md );
 		font-size: 0.875rem; // TODO: Make this a variable
-		gap: var(--space-xs);
-		grid-template-columns: repeat(auto-fit, 15rem);
+		gap: var( --space-xs );
+		grid-template-columns: repeat( auto-fit, 15rem );
 
 		a {
 			.menu-item-link;
-			padding: 0.625rem var(--space-md); // TODO: Make this a variable
-			border-radius: var(--border-radius--small);
+			padding: 0.625rem var( --space-md ); // TODO: Make this a variable
+			border-radius: var( --border-radius--small );
 
 			&:hover {
 				.menu-item-link-hover;
@@ -78,7 +77,7 @@
 	}
 }
 
-@media (min-width: @width-breakpoint-tablet) {
+@media ( min-width: @width-breakpoint-tablet ) {
 	.mw-logo-wordmark {
 		font-size: 2rem;
 		// Sometimes long wiki name will wrap when the menu is too small
diff --git a/resources/skins.citizen.styles/Drawer__button.less b/resources/skins.citizen.styles/Drawer__button.less
index 16fbe52e..7edda29e 100644
--- a/resources/skins.citizen.styles/Drawer__button.less
+++ b/resources/skins.citizen.styles/Drawer__button.less
@@ -8,7 +8,7 @@
 		&Icon {
 			> div {
 				&:first-child {
-					transform: translate3d(50%, 0, 0);
+					transform: translate3d( 50%, 0, 0 );
 				}
 			}
 		}
@@ -19,6 +19,6 @@
 #citizen-drawer__checkbox:checked {
 	// Transform all the slices of the button into a crossmark
 	~ .citizen-drawer__button {
-		background-color: var(--background-color-primary--active);
+		background-color: var( --background-color-primary--active );
 	}
 }
diff --git a/resources/skins.citizen.styles/Footer.less b/resources/skins.citizen.styles/Footer.less
index 9c93aed1..da96c4ac 100644
--- a/resources/skins.citizen.styles/Footer.less
+++ b/resources/skins.citizen.styles/Footer.less
@@ -1,13 +1,13 @@
 .citizen-footer {
-	padding: var(--space-xxl) var(--padding-page);
-	border-top: 1px solid var(--border-color-base);
-	background-color: var(--color-surface-2);
+	padding: var( --space-xxl ) var( --padding-page );
+	border-top: 1px solid var( --border-color-base );
+	background-color: var( --color-surface-2 );
 	clear: both;
 	direction: ltr;
 	font-size: 0.875rem;
 
 	&__container {
-		max-width: var(--width-layout--extended);
+		max-width: var( --width-layout--extended );
 		margin-right: auto;
 		margin-left: auto;
 	}
@@ -22,11 +22,11 @@
 		margin-left: auto;
 
 		.page-info {
-			padding: var(--space-xs) var(--space-md);
+			padding: var( --space-xs ) var( --space-md );
 			font-size: 0.875rem;
 
 			&__item {
-				padding: var(--space-xxs) 0;
+				padding: var( --space-xxs ) 0;
 
 				a {
 					text-decoration: underline dotted;
@@ -52,12 +52,12 @@
 
 #footer {
 	&-places {
-		padding: var(--space-xs);
+		padding: var( --space-xs );
 		font-size: 0.875rem;
 
 		ul {
-			padding: var(--space-xs);
-			gap: var(--space-sm) var(--space-md);
+			padding: var( --space-xs );
+			gap: var( --space-sm ) var( --space-md );
 		}
 
 		a {
@@ -67,16 +67,16 @@
 
 	&-icons {
 		display: flex;
-		padding: var(--space-xs);
+		padding: var( --space-xs );
 
 		ul {
-			padding: var(--space-xxs) var(--space-xs);
-			gap: var(--space-xs);
+			padding: var( --space-xxs ) var( --space-xs );
+			gap: var( --space-xs );
 		}
 
 		li {
 			display: flex; // Horizontally aligned with there are two icons in the same li
-			gap: var(--space-xs);
+			gap: var( --space-xs );
 		}
 
 		a {
@@ -86,7 +86,7 @@
 	}
 }
 
-@media (min-width: @width-breakpoint-desktop) {
+@media ( min-width: @width-breakpoint-desktop ) {
 	.citizen-footer {
 		margin-bottom: 0;
 	}
diff --git a/resources/skins.citizen.styles/Header.less b/resources/skins.citizen.styles/Header.less
index 00334b28..0021d913 100644
--- a/resources/skins.citizen.styles/Header.less
+++ b/resources/skins.citizen.styles/Header.less
@@ -8,11 +8,11 @@
 	right: 0;
 	left: 0;
 	display: flex;
-	flex-direction: var(--header-direction);
-	padding: var(--space-xs);
-	border-bottom: 1px solid var(--border-color-base);
-	background-color: var(--color-surface-0);
-	gap: var(--space-xxs);
+	flex-direction: var( --header-direction );
+	padding: var( --space-xs );
+	border-bottom: 1px solid var( --border-color-base );
+	background-color: var( --color-surface-0 );
+	gap: var( --space-xxs );
 	transition: @transition-transform; // Hide header when scroll down
 
 	&__item {
@@ -23,43 +23,43 @@
 	&__button {
 		display: flex;
 		justify-content: center;
-		width: var(--header-button-size);
-		height: var(--header-button-size);
-		border-radius: var(--border-radius--small);
+		width: var( --header-button-size );
+		height: var( --header-button-size );
+		border-radius: var( --border-radius--small );
 		contain: strict;
 		place-items: center;
 
 		// Used in checkbox hack
 		&Checkbox {
 			display: flex;
-			width: var(--header-button-size);
-			height: var(--header-button-size);
+			width: var( --header-button-size );
+			height: var( --header-button-size );
 			contain: strict;
 			align-items: center;
 			justify-content: center;
 		}
 
 		&:hover {
-			background-color: var(--background-color-quiet--hover);
+			background-color: var( --background-color-quiet--hover );
 
 			.citizen-ui-icon::before {
-				opacity: var(--opacity-icon-base--hover);
+				opacity: var( --opacity-icon-base--hover );
 			}
 		}
 
 		&:active {
-			background-color: var(--background-color-quiet--active);
+			background-color: var( --background-color-quiet--active );
 
 			.citizen-ui-icon::before {
-				opacity: var(--opacity-icon-base--active);
+				opacity: var( --opacity-icon-base--active );
 			}
 		}
 	}
 
 	&__logo {
-		padding: 0 var(--space-xs) 0 0;
-		border-right: 1px solid var(--border-color-base);
-		margin: 0 var(--space-xxs);
+		padding: 0 var( --space-xs ) 0 0;
+		border-right: 1px solid var( --border-color-base );
+		margin: 0 var( --space-xxs );
 
 		span {
 			text-indent: -9999px;
@@ -70,14 +70,14 @@
 		z-index: -1; // Inner element should be behind menu and search
 		display: flex;
 		min-width: 0;
-		flex-direction: var(--header-direction);
+		flex-direction: var( --header-direction );
 		flex-grow: 1;
 		justify-content: space-between;
-		gap: var(--space-xxs);
+		gap: var( --space-xxs );
 
 		.mw-checkbox-hack-checkbox:checked {
 			~ .citizen-header__button {
-				background-color: var(--background-color-primary--active);
+				background-color: var( --background-color-primary--active );
 			}
 		}
 	}
@@ -85,8 +85,8 @@
 	&__start,
 	&__end {
 		display: flex;
-		flex-direction: var(--header-direction);
-		gap: var(--space-xxs);
+		flex-direction: var( --header-direction );
+		gap: var( --space-xxs );
 	}
 
 	&__start {
@@ -105,15 +105,15 @@
 #p-notifications {
 	ul {
 		display: flex;
-		flex-direction: var(--header-direction);
+		flex-direction: var( --header-direction );
 		align-items: center;
-		gap: var(--space-xxs);
+		gap: var( --space-xxs );
 	}
 }
 
 // Reset hover styles if it is a touch device
 // This is dumb but hover:hover overrides active states
-@media (hover: none) {
+@media ( hover: none ) {
 	.citizen-header {
 		&__button {
 			&:hover {
diff --git a/resources/skins.citizen.styles/Menu.less b/resources/skins.citizen.styles/Menu.less
index 020d66c9..25ed6387 100644
--- a/resources/skins.citizen.styles/Menu.less
+++ b/resources/skins.citizen.styles/Menu.less
@@ -2,11 +2,11 @@
 	&__heading {
 		&-label {
 			display: block;
-			padding: 0.625rem var(--space-md);
+			padding: 0.625rem var( --space-md );
 			margin: 0;
-			color: var(--color-base--subtle);
+			color: var( --color-base--subtle );
 			font-size: inherit;
-			font-weight: var(--font-weight-normal);
+			font-weight: var( --font-weight-normal );
 			letter-spacing: 0.05em;
 		}
 	}
@@ -15,8 +15,8 @@
 // FIXME: This should not be here
 .citizen-ui-icon {
 	display: block;
-	width: var(--size-icon);
-	height: var(--size-icon);
+	width: var( --size-icon );
+	height: var( --size-icon );
 	contain: strict;
 
 	&::before {
@@ -27,7 +27,7 @@
 		background-repeat: no-repeat;
 		background-size: contain;
 		content: '';
-		opacity: var(--opacity-icon-base);
+		opacity: var( --opacity-icon-base );
 	}
 }
 
@@ -35,20 +35,20 @@
 #t-upload {
 	a::before {
 		display: block;
-		width: var(--size-icon);
-		height: var(--size-icon);
+		width: var( --size-icon );
+		height: var( --size-icon );
 		background-position: center;
 		background-repeat: no-repeat;
 		background-size: contain;
 		contain: strict;
 		content: '';
-		opacity: var(--opacity-icon-base);
+		opacity: var( --opacity-icon-base );
 	}
 }
 
 .mw-portlet {
 	// Hide selected item, except #ca-view
-	.selected:not(#ca-view) {
+	.selected:not( #ca-view ) {
 		.mixin-screen-reader-text;
 	}
 
diff --git a/resources/skins.citizen.styles/Pagetools.less b/resources/skins.citizen.styles/Pagetools.less
index 9828f3b8..88b8a743 100644
--- a/resources/skins.citizen.styles/Pagetools.less
+++ b/resources/skins.citizen.styles/Pagetools.less
@@ -5,8 +5,8 @@
 	justify-content: flex-end;
 	margin-left: -0.75rem; // Align to the margin
 	font-size: 0.875rem;
-	font-weight: var(--font-weight-medium);
-	gap: var(--space-xxs);
+	font-weight: var( --font-weight-medium );
+	gap: var( --space-xxs );
 
 	// TODO: Merge this with header__item
 	&__item {
@@ -23,22 +23,22 @@
 		display: grid;
 		width: 2.75rem; // Same width as other buttons
 		height: 2.25rem; // Same height as other buttons
-		border-radius: var(--border-radius--medium);
+		border-radius: var( --border-radius--medium );
 		place-items: center;
 
 		&:hover {
-			background-color: var(--background-color-quiet--hover);
+			background-color: var( --background-color-quiet--hover );
 
 			.citizen-ui-icon::before {
-				opacity: var(--opacity-icon-base--hover);
+				opacity: var( --opacity-icon-base--hover );
 			}
 		}
 
 		&:active {
-			background-color: var(--background-color-quiet--active);
+			background-color: var( --background-color-quiet--active );
 
 			.citizen-ui-icon::before {
-				opacity: var(--opacity-icon-base--active);
+				opacity: var( --opacity-icon-base--active );
 			}
 		}
 	}
@@ -51,13 +51,13 @@
 		overflow: auto;
 		max-height: 60vh;
 		padding: 0.5rem 0;
-		margin: var(--space-xs);
+		margin: var( --space-xs );
 		font-size: 0.875rem;
 		.citizen-card;
 		.citizen-card-hide( top right );
 
 		a {
-			padding: 0.625rem var(--space-md);
+			padding: 0.625rem var( --space-md );
 			.menu-item-link;
 
 			&:hover {
@@ -74,33 +74,33 @@
 	> .mw-portlet {
 		ul {
 			display: flex;
-			gap: var(--space-xxs);
+			gap: var( --space-xxs );
 		}
 
 		li > a {
 			display: flex;
 			align-items: center;
-			padding: var(--space-xs) var(--space-sm);
-			border-radius: var(--border-radius--medium);
-			color: var(--color-base);
+			padding: var( --space-xs ) var( --space-sm );
+			border-radius: var( --border-radius--medium );
+			color: var( --color-base );
 			font-size: 0;
 			transition: @transition-background, @transition-color;
 
 			&:hover {
-				background-color: var(--background-color-quiet--hover);
-				color: var(--color-base--emphasized);
+				background-color: var( --background-color-quiet--hover );
+				color: var( --color-base--emphasized );
 
 				&::before {
-					opacity: var(--opacity-icon-base--hover);
+					opacity: var( --opacity-icon-base--hover );
 				}
 			}
 
 			&:active {
-				background-color: var(--background-color-quiet--active);
-				color: var(--color-base--subtle);
+				background-color: var( --background-color-quiet--active );
+				color: var( --color-base--subtle );
 
 				&::before {
-					opacity: var(--opacity-icon-base--active);
+					opacity: var( --opacity-icon-base--active );
 				}
 			}
 		}
@@ -117,7 +117,7 @@
 
 	// TODO: Merge this with header styles
 	.mw-checkbox-hack-checkbox:checked ~ .page-actions__button {
-		background-color: var(--background-color-primary--active);
+		background-color: var( --background-color-primary--active );
 	}
 }
 
@@ -132,14 +132,14 @@
 		right: 0;
 		display: block;
 		padding: 0.1em 0.4em;
-		border-radius: var(--border-radius--pill);
-		background: var(--color-primary);
+		border-radius: var( --border-radius--pill );
+		background: var( --color-primary );
 		color: #fff;
-		content: attr(data-counter-text);
+		content: attr( data-counter-text );
 		font-size: 0.65rem;
 	}
 
-	&[data-counter-text='0']::after {
+	&[ data-counter-text='0' ]::after {
 		display: none;
 	}
 }
@@ -152,8 +152,8 @@
 		position: absolute;
 		z-index: 1;
 		display: block;
-		width: var(--size-button--page);
-		height: var(--size-button--page);
+		width: var( --size-button--page );
+		height: var( --size-button--page );
 		padding: 0;
 		margin: 0;
 		cursor: pointer;
@@ -162,20 +162,20 @@
 		// Hover state needs to be define because the checkbox now overlays the label
 		&:hover {
 			~ .page-actions__button {
-				background-color: var(--background-color-quiet--hover);
+				background-color: var( --background-color-quiet--hover );
 
 				.citizen-ui-icon::before {
-					opacity: var(--opacity-icon-base--hover);
+					opacity: var( --opacity-icon-base--hover );
 				}
 			}
 		}
 
 		&:active {
 			~ .page-actions__button {
-				background-color: var(--background-color-quiet--active);
+				background-color: var( --background-color-quiet--active );
 
 				.citizen-ui-icon::before {
-					opacity: var(--opacity-icon-base--active);
+					opacity: var( --opacity-icon-base--active );
 				}
 			}
 		}
@@ -191,22 +191,22 @@
 #ca-edit,
 #ca-ve-edit {
 	> a {
-		background-color: var(--color-primary);
+		background-color: var( --color-primary );
 		color: #fff;
 
 		&:hover {
-			background-color: var(--color-primary--hover);
+			background-color: var( --color-primary--hover );
 		}
 
 		&:active {
-			background-color: var(--color-primary--active);
+			background-color: var( --color-primary--active );
 		}
 	}
 
 	> a,
 	.citizen-ui-icon {
 		&::before {
-			filter: invert(1);
+			filter: invert( 1 );
 			// white icon
 			opacity: 1;
 		}
@@ -220,11 +220,11 @@
 	> a {
 		// See SkinHooks.php for why VE is here
 		&::before {
-			width: var(--size-icon);
-			height: var(--size-icon);
+			width: var( --size-icon );
+			height: var( --size-icon );
 			background-position: center;
 			background-repeat: no-repeat;
-			background-size: var(--size-icon);
+			background-size: var( --size-icon );
 			content: '';
 			transition: @transition-opacity;
 		}
@@ -245,7 +245,7 @@
 	}
 
 	&#ca-edit {
-		border-left: 1px solid var(--color-primary--hover);
+		border-left: 1px solid var( --color-primary--hover );
 		margin-left: ~'calc( var( --space-xxs ) * -1 )';
 
 		> a {
@@ -262,11 +262,11 @@
 #ca-redirect,
 #ca-masseditregex {
 	> a::before {
-		width: var(--size-icon);
-		height: var(--size-icon);
+		width: var( --size-icon );
+		height: var( --size-icon );
 		background-position: center;
 		background-repeat: no-repeat;
-		background-size: var(--size-icon);
+		background-size: var( --size-icon );
 		content: '';
 		transition: @transition-opacity;
 	}
@@ -290,7 +290,7 @@
 }
 
 // To avoid more menu from overflow in narrow screen
-@media (max-width: @width-breakpoint-tablet) {
+@media ( max-width: @width-breakpoint-tablet ) {
 	.page-actions {
 		&__item {
 			position: unset;
@@ -298,12 +298,12 @@
 	}
 }
 
-@media (min-width: @width-breakpoint-desktop) {
+@media ( min-width: @width-breakpoint-desktop ) {
 	.page-actions {
 		> .mw-portlet {
 			li > a {
 				font-size: 0.75rem;
-				gap: var(--space-xs);
+				gap: var( --space-xs );
 			}
 		}
 
@@ -316,14 +316,14 @@
 
 // Reset hover styles if it is a touch device
 // This is dumb but hover:hover overrides active states
-@media (hover: none) {
+@media ( hover: none ) {
 	.page-actions {
 		&__button {
 			&:hover {
 				background-color: none;
 
 				.citizen-ui-icon::before {
-					opacity: var(--opacity-icon-base);
+					opacity: var( --opacity-icon-base );
 				}
 			}
 		}
diff --git a/resources/skins.citizen.styles/Search.less b/resources/skins.citizen.styles/Search.less
index 37f10e1f..1cf08fe6 100644
--- a/resources/skins.citizen.styles/Search.less
+++ b/resources/skins.citizen.styles/Search.less
@@ -2,7 +2,7 @@
 
 .citizen-search {
 	--width-search-bar: @width-search-bar;
-	--height-search-bar: var(--header-button-size);
+	--height-search-bar: var( --header-button-size );
 
 	&__card {
 		position: fixed;
@@ -10,17 +10,17 @@
 		right: 0;
 		left: 0;
 		display: flex;
-		width: var(--width-search-bar);
+		width: var( --width-search-bar );
 		max-width: ~'calc(100vw - var( --padding-page ) )';
-		height: var(--height-search-bar);
+		height: var( --height-search-bar );
 		margin: ~'calc( var( --header-size ) + 1px ) var( --space-xs ) auto';
 		gap: 0.25rem;
 		.citizen-card();
 		.citizen-card-hide( top left, '', false );
 
 		.citizen-ui-icon {
-			width: var(--height-search-bar);
-			height: var(--height-search-bar);
+			width: var( --height-search-bar );
+			height: var( --height-search-bar );
 
 			&::before {
 				background-size: 1rem;
@@ -50,26 +50,26 @@
 
 	&__random {
 		right: 0;
-		border-radius: var(--border-radius--small);
+		border-radius: var( --border-radius--small );
 
 		.citizen-ui-icon::before {
 			transition: @transition-transform;
 		}
 
 		&:hover {
-			background-color: var(--background-color-quiet--hover);
+			background-color: var( --background-color-quiet--hover );
 
 			.citizen-ui-icon::before {
-				opacity: var(--opacity-icon-base--hover);
-				transform: rotate(30deg);
+				opacity: var( --opacity-icon-base--hover );
+				transform: rotate( 30deg );
 			}
 		}
 
 		&:active {
-			background-color: var(--background-color-quiet--active);
+			background-color: var( --background-color-quiet--active );
 
 			.citizen-ui-icon::before {
-				opacity: var(--opacity-icon-base--active);
+				opacity: var( --opacity-icon-base--active );
 			}
 		}
 	}
@@ -81,7 +81,7 @@
 	#searchInput {
 		width: 100%;
 		height: 100%;
-		padding: 0 var(--height-search-bar);
+		padding: 0 var( --height-search-bar );
 		border: 0; // Cancel default border
 		appearance: none;
 		background: transparent; // Cancel default background
@@ -109,7 +109,7 @@
 	}
 }
 
-@media (max-width: @width-breakpoint-desktop) {
+@media ( max-width: @width-breakpoint-desktop ) {
 	.citizen-search__card {
 		width: auto;
 		margin: ~'calc( var( --header-size ) + 1px ) var( --space-xs )';
diff --git a/resources/skins.citizen.styles/Search__button.less b/resources/skins.citizen.styles/Search__button.less
index 35977ee5..dae149c7 100644
--- a/resources/skins.citizen.styles/Search__button.less
+++ b/resources/skins.citizen.styles/Search__button.less
@@ -8,7 +8,7 @@
 
 		> div {
 			position: relative;
-			border-radius: var(--border-radius--small);
+			border-radius: var( --border-radius--small );
 			transition: inherit;
 
 			&:first-child {
@@ -16,10 +16,10 @@
 				/* @noflip */
 				left: 0.75rem;
 				height: 0.5rem;
-				transform: rotate(-45deg);
+				transform: rotate( -45deg );
 			}
 
-			&:nth-child(2) {
+			&:nth-child( 2 ) {
 				width: 0.625rem;
 				height: 0.625rem;
 				border: 0.125rem solid #000;
@@ -27,14 +27,14 @@
 				margin-top: -0.3125rem;
 				/* @noflip */
 				margin-left: -0.125rem;
-				transform: rotate(-45deg);
+				transform: rotate( -45deg );
 			}
 
 			&:last-child {
 				left: -0.4375rem;
 				height: 1rem;
 				opacity: 0;
-				transform: rotate(-135deg);
+				transform: rotate( -135deg );
 			}
 
 			&:first-child,
@@ -50,6 +50,6 @@
 #citizen-search__checkbox:checked {
 	// Transform the magnifying glass button into a crossmark
 	~ .citizen-search__button {
-		background-color: var(--background-color-primary--active);
+		background-color: var( --background-color-primary--active );
 	}
 }
diff --git a/resources/skins.citizen.styles/Sections.less b/resources/skins.citizen.styles/Sections.less
index 1c7dbd5e..ed5a362c 100644
--- a/resources/skins.citizen.styles/Sections.less
+++ b/resources/skins.citizen.styles/Sections.less
@@ -7,13 +7,13 @@
 
 			&--collapsed {
 				.section-indicator {
-					transform: rotate3d(1, 0, 0, 180deg);
+					transform: rotate3d( 1, 0, 0, 180deg );
 				}
 
 				.mw-headline,
 				.mw-heading h1,
 				.mw-heading h2 {
-					opacity: var(--opacity-icon-base);
+					opacity: var( --opacity-icon-base );
 				}
 			}
 
@@ -23,11 +23,11 @@
 				transition: @transition-opacity;
 
 				&:hover {
-					opacity: var(--opacity-icon-base--hover);
+					opacity: var( --opacity-icon-base--hover );
 				}
 
 				&:active {
-					opacity: var(--opacity-icon-base--active);
+					opacity: var( --opacity-icon-base--active );
 				}
 			}
 		}
@@ -35,7 +35,7 @@
 		&-indicator {
 			width: 1rem;
 			height: 1rem;
-			margin-right: var(--space-md);
+			margin-right: var( --space-md );
 			cursor: pointer;
 			transition: @transition-transform;
 		}
@@ -70,7 +70,7 @@
 }
 
 // Fix hover state on touch devices
-@media (hover: none) {
+@media ( hover: none ) {
 	.citizen-sections-enabled .section {
 		&-heading .mw-headline,
 		&-indicator {
@@ -83,7 +83,7 @@
 		&-heading--collapsed .mw-headline {
 			&:hover,
 			&:active {
-				opacity: var(--opacity-icon-base);
+				opacity: var( --opacity-icon-base );
 			}
 		}
 	}
diff --git a/resources/skins.citizen.styles/StickyHeader.less b/resources/skins.citizen.styles/StickyHeader.less
index 3cee5983..d37e5a87 100644
--- a/resources/skins.citizen.styles/StickyHeader.less
+++ b/resources/skins.citizen.styles/StickyHeader.less
@@ -14,12 +14,12 @@
 	}
 }
 
-html:not(.ve-activated) .citizen-body-header--sticky {
+html:not( .ve-activated ) .citizen-body-header--sticky {
 	.mw-body-header {
 		position: sticky;
 		top: ~'calc( var( --header-size ) - 1px )';
-		padding: var(--space-md) var(--padding-page) var(--space-sm);
-		border-bottom: 1px solid var(--border-color-base);
+		padding: var( --space-md ) var( --padding-page ) var( --space-sm );
+		border-bottom: 1px solid var( --border-color-base );
 		margin: ~'0 calc( var( --padding-page ) * -1 )';
 		transition: @transition-transform; // Hide sticky header on scroll down
 
@@ -32,9 +32,9 @@ html:not(.ve-activated) .citizen-body-header--sticky {
 			right: 0;
 			left: 0;
 			height: 100%;
-			-webkit-backdrop-filter: saturate(50%) blur(16px);
-			backdrop-filter: saturate(50%) blur(16px);
-			background-color: var(--background-color-overlay);
+			-webkit-backdrop-filter: saturate( 50% ) blur( 16px );
+			backdrop-filter: saturate( 50% ) blur( 16px );
+			background-color: var( --background-color-overlay );
 			content: '';
 		}
 
@@ -50,7 +50,7 @@ html:not(.ve-activated) .citizen-body-header--sticky {
 
 	.firstHeading {
 		overflow: hidden;
-		font-size: var(--font-size-h3);
+		font-size: var( --font-size-h3 );
 		text-overflow: ellipsis;
 		white-space: nowrap;
 	}
@@ -61,15 +61,15 @@ html:not(.ve-activated) .citizen-body-header--sticky {
 		right: 0;
 		bottom: 0;
 		left: 0;
-		border-radius: var(--border-radius--small);
+		border-radius: var( --border-radius--small );
 		margin: ~'calc( var(  --space-xs ) * -1 ) 0';
 
 		&:hover {
-			background-color: var(--background-color-quiet--hover);
+			background-color: var( --background-color-quiet--hover );
 		}
 
 		&:active {
-			background-color: var(--background-color-quiet--active);
+			background-color: var( --background-color-quiet--active );
 		}
 	}
 
@@ -82,7 +82,7 @@ html:not(.ve-activated) .citizen-body-header--sticky {
 }
 
 // Make sticky header more compact if there are less screen estate
-@media (max-width: @width-breakpoint-tablet), (max-height: 800px) {
+@media ( max-width: @width-breakpoint-tablet ), ( max-height: 800px ) {
 	.citizen-body-header--sticky {
 		#siteSub {
 			display: none;
diff --git a/resources/skins.citizen.styles/TableOfContents.less b/resources/skins.citizen.styles/TableOfContents.less
index 4e141696..dafcd439 100644
--- a/resources/skins.citizen.styles/TableOfContents.less
+++ b/resources/skins.citizen.styles/TableOfContents.less
@@ -1,13 +1,13 @@
 .citizen-toc {
 	font-size: 0.875rem;
-	line-height: var(--line-height-xs);
+	line-height: var( --line-height-xs );
 	transition: @transition-transform;
 	will-change: transform;
 
 	&__card {
 		display: flex;
 		flex-direction: column;
-		gap: var(--space-xs);
+		gap: var( --space-xs );
 	}
 
 	&__top {
@@ -15,20 +15,20 @@
 			width: 0.875rem;
 			height: 0.875rem;
 			content: '';
-			opacity: var(--opacity-icon-base);
+			opacity: var( --opacity-icon-base );
 		}
 
 		&:hover::before {
-			opacity: var(--opacity-icon-base--hover);
+			opacity: var( --opacity-icon-base--hover );
 		}
 
 		&:active::before {
-			opacity: var(--opacity-icon-base--hover);
+			opacity: var( --opacity-icon-base--hover );
 		}
 	}
 
 	&__header {
-		color: var(--color-base);
+		color: var( --color-base );
 		letter-spacing: 0.05em;
 	}
 
@@ -38,7 +38,7 @@
 
 	&__contents,
 	&__list {
-		border-left: 0.5px solid var(--border-color-base);
+		border-left: 0.5px solid var( --border-color-base );
 		margin: 0;
 		list-style: none;
 
@@ -49,17 +49,17 @@
 	}
 
 	&__list {
-		margin-left: var(--space-xs);
+		margin-left: var( --space-xs );
 	}
 
 	&__link {
 		display: flex;
-		padding-top: var(--space-xs);
-		padding-bottom: var(--space-xs);
-		border-radius: var(--border-radius--small);
-		color: var(--color-base);
-		font-weight: var(--font-weight-medium);
-		gap: var(--space-xs);
+		padding-top: var( --space-xs );
+		padding-bottom: var( --space-xs );
+		border-radius: var( --border-radius--small );
+		color: var( --color-base );
+		font-weight: var( --font-weight-medium );
+		gap: var( --space-xs );
 
 		&.citizen-toc__top {
 			height: 0;
@@ -71,38 +71,38 @@
 		}
 
 		&:hover {
-			background-color: var(--background-color-quiet--hover);
+			background-color: var( --background-color-quiet--hover );
 		}
 
 		&:active {
-			background-color: var(--background-color-quiet--active);
+			background-color: var( --background-color-quiet--active );
 		}
 	}
 
 	&__indicator {
 		width: 3px;
 		flex-shrink: 0;
-		border-radius: var(--border-radius--pill);
+		border-radius: var( --border-radius--pill );
 		margin-left: -2px;
 	}
 
 	&__text {
 		display: flex;
-		gap: var(--space-xs);
+		gap: var( --space-xs );
 	}
 
 	&__numb {
 		display: none;
-		color: var(--color-base--subtle);
+		color: var( --color-base--subtle );
 	}
 
 	&__listItem {
 		&--active {
 			> .citizen-toc__link {
-				color: var(--color-primary);
+				color: var( --color-primary );
 
 				.citizen-toc__indicator {
-					background-color: var(--color-primary);
+					background-color: var( --color-primary );
 				}
 			}
 		}
@@ -113,8 +113,8 @@
 .citizen-body-header--sticky {
 	.citizen-toc__top.citizen-toc__link {
 		height: 1.05rem; // ( 1rem text + 1rem padding ) * line height / 2
-		padding-top: var(--space-xs);
-		padding-bottom: var(--space-xs);
+		padding-top: var( --space-xs );
+		padding-bottom: var( --space-xs );
 		opacity: 1;
 		visibility: visible;
 	}
@@ -125,7 +125,7 @@
 // 	transform: translateY( var( --header-size ) );
 // }
 
-@media (max-width: (@width-breakpoint-desktop - 1px)) {
+@media ( max-width: ( @width-breakpoint-desktop - 1px ) ) {
 	.citizen-toc {
 		position: fixed;
 		z-index: @z-index-page-header;
@@ -139,8 +139,8 @@
 			// This is not bulletproof since it will get covered by page header
 			// in extremely short height. but it should be good for now
 			max-height: ~'calc( var( --header-card-maxheight ) - 8rem )';
-			padding: var(--space-md);
-			margin: var(--space-xs);
+			padding: var( --space-md );
+			margin: var( --space-xs );
 			overscroll-behavior: contain;
 			-webkit-user-select: none;
 			user-select: none;
@@ -163,10 +163,10 @@
 			display: grid;
 			width: 2.5rem;
 			height: 2.5rem;
-			border-radius: var(--border-radius--medium);
-			margin: var(--space-xs);
-			background-color: var(--color-surface-1);
-			box-shadow: var(--box-shadow-dialog);
+			border-radius: var( --border-radius--medium );
+			margin: var( --space-xs );
+			background-color: var( --color-surface-1 );
+			box-shadow: var( --box-shadow-dialog );
 			place-content: center;
 			pointer-events: auto;
 			transform: none;
@@ -180,11 +180,11 @@
 
 			// The hover state colors are not great but it will do for now
 			&:hover {
-				background-color: var(--color-surface-3);
+				background-color: var( --color-surface-3 );
 			}
 
 			&:active {
-				background-color: var(--color-surface-1);
+				background-color: var( --color-surface-1 );
 			}
 		}
 	}
@@ -199,7 +199,7 @@
 					background-color: transparent;
 					box-shadow: none;
 					pointer-events: none;
-					transform: scale(1.2);
+					transform: scale( 1.2 );
 
 					.citizen-ui-icon {
 						display: none;
@@ -217,7 +217,7 @@
 	}
 }
 
-@media (min-width: @width-breakpoint-desktop) {
+@media ( min-width: @width-breakpoint-desktop ) {
 	.citizen-toc {
 		grid-area: toc;
 
diff --git a/resources/skins.citizen.styles/Usermenu.less b/resources/skins.citizen.styles/Usermenu.less
index 83046275..58a5866e 100644
--- a/resources/skins.citizen.styles/Usermenu.less
+++ b/resources/skins.citizen.styles/Usermenu.less
@@ -5,15 +5,15 @@
 	}
 
 	&__header {
-		padding: var(--space-md) 0;
-		border-bottom: 1px solid var(--border-color-base);
+		padding: var( --space-md ) 0;
+		border-bottom: 1px solid var( --border-color-base );
 	}
 }
 
 .mw-portlet {
 	&-personal-header {
 		padding: 0.75rem 0 0.5rem;
-		border-bottom: 1px solid var(--border-color-base);
+		border-bottom: 1px solid var( --border-color-base );
 
 		li {
 			margin: 0 0.75rem;
@@ -26,13 +26,13 @@
 				.menu-item-link;
 				align-items: center;
 				// TODO: Need to revisit this spacing, maybe set a min-height instead?
-				padding: 0.625rem var(--space-md);
+				padding: 0.625rem var( --space-md );
 
 				&:hover {
 					.menu-item-link-hover;
 
 					.citizen-ui-icon::before {
-						opacity: var(--opacity-icon-base--hover);
+						opacity: var( --opacity-icon-base--hover );
 					}
 				}
 
@@ -40,7 +40,7 @@
 					.menu-item-link-active;
 
 					.citizen-ui-icon::before {
-						opacity: var(--opacity-icon-base--active);
+						opacity: var( --opacity-icon-base--active );
 					}
 				}
 			}
@@ -50,8 +50,8 @@
 
 #p-user-info {
 	> ul > li {
-		margin-right: var(--space-md);
-		margin-left: var(--space-md);
+		margin-right: var( --space-md );
+		margin-left: var( --space-md );
 	}
 }
 
@@ -59,25 +59,25 @@
 	&-anonuserpage span,
 	&-tmpuserpage-2,
 	&-userpage-2 a {
-		padding: var(--space-xxs) 0;
-		color: var(--color-base--emphasized);
+		padding: var( --space-xxs ) 0;
+		color: var( --color-base--emphasized );
 		font-size: 1rem;
-		font-weight: var(--font-weight-semibold);
+		font-weight: var( --font-weight-semibold );
 		word-break: break-word;
 	}
 
 	&-user {
 		&groups {
-			margin-bottom: var(--space-xs);
+			margin-bottom: var( --space-xs );
 
 			ul {
 				display: flex;
 				flex-wrap: wrap;
-				gap: var(--space-xxs);
+				gap: var( --space-xxs );
 			}
 
 			a {
-				color: var(--color-base--subtle);
+				color: var( --color-base--subtle );
 			}
 		}
 
@@ -88,17 +88,17 @@
 				transition: @transition-color;
 
 				&:hover {
-					color: var(--color-primary--hover);
+					color: var( --color-primary--hover );
 				}
 
 				&:active {
-					color: var(--color-primary--active);
+					color: var( --color-primary--active );
 				}
 			}
 		}
 
 		&contris {
-			font-weight: var(--font-weight-medium);
+			font-weight: var( --font-weight-medium );
 		}
 	}
 }
diff --git a/resources/skins.citizen.styles/common/common.less b/resources/skins.citizen.styles/common/common.less
index eeb209a3..836d476c 100644
--- a/resources/skins.citizen.styles/common/common.less
+++ b/resources/skins.citizen.styles/common/common.less
@@ -11,21 +11,21 @@ body {
 	min-height: 100vh;
 	padding: 0;
 	margin: 0;
-	accent-color: var(--color-primary);
-	background: var(--color-surface-0);
-	color: var(--color-base);
+	accent-color: var( --color-primary );
+	background: var( --color-surface-0 );
+	color: var( --color-base );
 }
 
 :focus {
-	outline-color: var(--color-primary);
+	outline-color: var( --color-primary );
 }
 
 input,
 select,
 textarea {
-	border: 1px solid var(--border-color-base);
-	background-color: var(--color-surface-1);
-	color: var(--color-base--emphasized);
+	border: 1px solid var( --border-color-base );
+	background-color: var( --color-surface-1 );
+	color: var( --color-base--emphasized );
 }
 
 textarea {
@@ -33,12 +33,12 @@ textarea {
 }
 
 blockquote {
-	margin: var(--space-md);
-	color: var(--color-base--subtle);
+	margin: var( --space-md );
+	color: var( --color-base--subtle );
 
 	cite {
 		display: block;
-		margin-top: var(--space-sm);
+		margin-top: var( --space-sm );
 
 		&::before {
 			content: '— ';
@@ -52,7 +52,7 @@ sub {
 }
 
 th {
-	font-weight: var(--font-weight-semibold);
+	font-weight: var( --font-weight-semibold );
 }
 
 td {
@@ -94,16 +94,16 @@ video {
 }
 
 :focus-visible {
-	outline: 1px solid var(--color-primary);
+	outline: 1px solid var( --color-primary );
 }
 
 .toc,
 #toc {
 	max-width: 20vw;
 	padding: 1rem;
-	border: 1px solid var(--color-surface-4);
+	border: 1px solid var( --color-surface-4 );
 	margin: 1rem auto 1rem 0;
-	background: var(--color-surface-2);
+	background: var( --color-surface-2 );
 
 	#mw-toc-heading {
 		font-size: 1.125rem;
@@ -121,7 +121,7 @@ video {
 	}
 }
 
-@media (hover: none) {
+@media ( hover: none ) {
 	a,
 	button,
 	label {
@@ -130,7 +130,7 @@ video {
 	}
 }
 
-@media (max-width: @width-breakpoint-tablet) {
+@media ( max-width: @width-breakpoint-tablet ) {
 	.mw-body,
 	.parsoid-body {
 		overflow-x: hidden; // fallback if clip is not supported
@@ -147,7 +147,7 @@ video {
 	}
 }
 
-@media (min-width: @width-breakpoint-tablet) {
+@media ( min-width: @width-breakpoint-tablet ) {
 	// Delay scroll animation won't happen on load
 	// Use it only for larger viewport as it is very costly
 	// on mobile devices
@@ -156,7 +156,7 @@ video {
 	}
 }
 
-@media (max-width: @width-breakpoint-mobile) {
+@media ( max-width: @width-breakpoint-mobile ) {
 	.toc,
 	#toc {
 		max-width: 95vw;
diff --git a/resources/skins.citizen.styles/common/content.less b/resources/skins.citizen.styles/common/content.less
index 2cb59971..2f09e1e7 100644
--- a/resources/skins.citizen.styles/common/content.less
+++ b/resources/skins.citizen.styles/common/content.less
@@ -5,17 +5,17 @@
 }
 
 .firstHeading-parenthesis {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .mw-page-title {
 	&-namespace {
-		color: var(--color-base);
+		color: var( --color-base );
 	}
 
 	&-separator {
-		margin-right: var(--space-xxs);
-		color: var(--color-base--subtle);
+		margin-right: var( --space-xxs );
+		color: var( --color-base--subtle );
 	}
 }
 
diff --git a/resources/skins.citizen.styles/common/cssvariables.less b/resources/skins.citizen.styles/common/cssvariables.less
index f5bef2fd..50ce6343 100644
--- a/resources/skins.citizen.styles/common/cssvariables.less
+++ b/resources/skins.citizen.styles/common/cssvariables.less
@@ -108,13 +108,13 @@ html {
 	--fonts-monospace: @fonts-monospace;
 }
 
-@media (min-width: @width-breakpoint-tablet) {
+@media ( min-width: @width-breakpoint-tablet ) {
 	html {
 		--padding-page: @padding-page * 1.5;
 	}
 }
 
-@media (min-width: @width-breakpoint-desktop) {
+@media ( min-width: @width-breakpoint-desktop ) {
 	html {
 		--padding-page: @padding-page * 2;
 		--header-card-maxheight: ~'calc( 100vh - var( --space-sm ) * 2 )';
diff --git a/resources/skins.citizen.styles/common/hacks.less b/resources/skins.citizen.styles/common/hacks.less
index c90bfef6..fc7bb213 100644
--- a/resources/skins.citizen.styles/common/hacks.less
+++ b/resources/skins.citizen.styles/common/hacks.less
@@ -14,7 +14,7 @@ a.feedlink {
 		cursor: pointer;
 
 		// Icons have to use span inside label elements
-		> span:not(.citizen-ui-icon) {
+		> span:not( .citizen-ui-icon ) {
 			.mixin-screen-reader-text;
 		}
 	}
@@ -35,6 +35,6 @@ a.feedlink {
  * Revisit this when T254055 is resolved
  */
 // add :not(.mw-body-content) to avoid small font size inside VE.
-.oo-ui-widget:not(.mw-body-content) {
+.oo-ui-widget:not( .mw-body-content ) {
 	font-size: 0.875rem;
 }
diff --git a/resources/skins.citizen.styles/common/print.less b/resources/skins.citizen.styles/common/print.less
index 73aa3dc4..92e3ba1e 100644
--- a/resources/skins.citizen.styles/common/print.less
+++ b/resources/skins.citizen.styles/common/print.less
@@ -25,7 +25,7 @@ a {
 }
 
 .mw-body-header {
-	margin-bottom: var(--space-md);
+	margin-bottom: var( --space-md );
 }
 
 .printfooter {
@@ -56,7 +56,7 @@ a {
 	display: table;
 	padding: 10px;
 	border: 1px solid;
-	margin-top: var(--space-md);
+	margin-top: var( --space-md );
 	font-size: 14px;
 
 	&title {
@@ -71,8 +71,8 @@ a {
 }
 
 .thumb {
-	margin-top: var(--space-md);
-	margin-bottom: var(--space-md);
+	margin-top: var( --space-md );
+	margin-bottom: var( --space-md );
 }
 
 // Float styles
diff --git a/resources/skins.citizen.styles/common/progressbar.less b/resources/skins.citizen.styles/common/progressbar.less
index ab1c5327..6bf0461a 100644
--- a/resources/skins.citizen.styles/common/progressbar.less
+++ b/resources/skins.citizen.styles/common/progressbar.less
@@ -19,28 +19,28 @@
 	overflow: hidden;
 	width: 100%;
 	// Hide text in case it extends beyond the input.
-	height: var(--height-progress-bar);
+	height: var( --height-progress-bar );
 	// Ensure it doesn't extend beyond the input.
 	box-sizing: border-box;
 	// Align style with the form
-	border-radius: 0 0 var(--border-radius--large) var(--border-radius--large);
+	border-radius: 0 0 var( --border-radius--large ) var( --border-radius--large );
 	// Animates the progress-bar.
-	animation:
+	animation:
  progress-bar
 		1200ms
 		linear
-		var(--delay-progress-bar)
+		var( --delay-progress-bar )
 		infinite
 		alternate;
 	// Add a progress-bar to the loading indicator
 	background: /*image*/
-		linear-gradient(90deg, var(--color-primary) 0%, var(--color-primary) 100%)
-		-10% 0 ~'/' 0 var(--height-progress-bar)
+		linear-gradient( 90deg, var( --color-primary ) 0%, var( --color-primary ) 100% )
+		-10% 0 ~'/' 0 var( --height-progress-bar )
 		no-repeat,transparent;
 	// Placeholder text
 	content: 'loading';
 	// Fancy shadow under progress
-	filter: drop-shadow(0 0 16px var(--color-primary));
+	filter: drop-shadow( 0 0 16px var( --color-primary ) );
 	text-overflow: ellipsis;
 	white-space: nowrap;
 }
@@ -48,22 +48,22 @@
 @keyframes progress-bar {
 	0% {
 		background-position: -10% 0;
-		background-size: 0 var(--height-progress-bar);
+		background-size: 0 var( --height-progress-bar );
 	}
 
 	30% {
 		background-position: -10% 0;
-		background-size: 30% var(--height-progress-bar);
+		background-size: 30% var( --height-progress-bar );
 	}
 
 	70% {
 		background-position: 110% 0;
-		background-size: 30% var(--height-progress-bar);
+		background-size: 30% var( --height-progress-bar );
 	}
 
 	100% {
 		background-position: 110% 0;
-		background-size: 0 var(--height-progress-bar);
+		background-size: 0 var( --height-progress-bar );
 	}
 }
 
@@ -74,7 +74,7 @@ html.citizen-loading::after {
 }
 
 /* stylelint-disable media-feature-name-no-unknown */
-@media (display-mode: standalone) {
+@media ( display-mode: standalone ) {
 	// Standalone PWA has no loading affordance
 	// So we provide one
 	html.citizen-loading::after {
diff --git a/resources/skins.citizen.styles/common/scrollbar.less b/resources/skins.citizen.styles/common/scrollbar.less
index 19758a34..c5404c10 100644
--- a/resources/skins.citizen.styles/common/scrollbar.less
+++ b/resources/skins.citizen.styles/common/scrollbar.less
@@ -1,7 +1,7 @@
 // Don't style scrollbar for touch device
 // Since the scrollbar will stay visible if styled
 // Besides scrollbar is subtle enough on touch devices
-@media (hover: hover) {
+@media ( hover: hover ) {
 	* {
 		scrollbar-width: thin;
 	}
@@ -11,22 +11,22 @@
 		transition: @transition-background;
 
 		&:hover {
-			background: var(--background-color-quiet--hover);
+			background: var( --background-color-quiet--hover );
 		}
 	}
 
 	::-webkit-scrollbar-thumb {
 		border: 2px solid transparent;
-		border-radius: var(--border-radius--large);
+		border-radius: var( --border-radius--large );
 		background-clip: content-box;
-		box-shadow: inset 0 0 0 10px var(--background-color-icon);
+		box-shadow: inset 0 0 0 10px var( --background-color-icon );
 
 		&:hover {
-			box-shadow: inset 0 0 0 10px var(--background-color-icon--hover);
+			box-shadow: inset 0 0 0 10px var( --background-color-icon--hover );
 		}
 
 		&:active {
-			box-shadow: inset 0 0 0 10px var(--background-color-icon--active);
+			box-shadow: inset 0 0 0 10px var( --background-color-icon--active );
 		}
 	}
 
diff --git a/resources/skins.citizen.styles/common/theme.less b/resources/skins.citizen.styles/common/theme.less
index ab0d0500..c18122eb 100644
--- a/resources/skins.citizen.styles/common/theme.less
+++ b/resources/skins.citizen.styles/common/theme.less
@@ -27,7 +27,7 @@
 	--box-shadow-card: @box-shadow-card;
 	--box-shadow-dialog: @box-shadow-dialog;
 
-	--surface-shadow: var(--color-primary__h) 10% 20%;
+	--surface-shadow: var( --color-primary__h ) 10% 20%;
 	--shadow-strength: 0.02;
 }
 
diff --git a/resources/skins.citizen.styles/common/typography.less b/resources/skins.citizen.styles/common/typography.less
index 51d637a2..5b520ac1 100644
--- a/resources/skins.citizen.styles/common/typography.less
+++ b/resources/skins.citizen.styles/common/typography.less
@@ -4,20 +4,20 @@ html {
 
 html,
 body {
-	font-family: var(--fonts-sans);
-	font-weight: var(--font-weight-normal);
+	font-family: var( --fonts-sans );
+	font-weight: var( --font-weight-normal );
 	// font-smoothing: antialiased;
 	// -webkit-font-smoothing: antialiased; /* Chrome, Safari */
 	// -moz-osx-font-smoothing: grayscale; /* Firefox */
 }
 
 input {
-	font-family: var(--fonts-sans); // Override browser's default
+	font-family: var( --fonts-sans ); // Override browser's default
 }
 
 b,
 strong {
-	font-weight: var(--font-weight-semibold);
+	font-weight: var( --font-weight-semibold );
 }
 
 cite {
@@ -25,11 +25,11 @@ cite {
 }
 
 blockquote {
-	font-family: var(--fonts-serif);
+	font-family: var( --fonts-serif );
 	font-style: italic;
 
 	cite {
-		font-family: var(--fonts-sans);
+		font-family: var( --fonts-sans );
 		font-size: 0.8125rem;
 		font-style: normal;
 	}
@@ -38,7 +38,7 @@ blockquote {
 blockquote,
 q,
 cite {
-	&:lang(zh) {
+	&:lang( zh ) {
 		font-style: normal;
 	}
 }
@@ -49,16 +49,16 @@ sup {
 }
 
 .mw-logo-wordmark {
-	font-weight: var(--font-weight-semibold);
+	font-weight: var( --font-weight-semibold );
 }
 
 .firstHeading {
 	&-parenthesis {
-		font-size: var(--font-size-h3);
+		font-size: var( --font-size-h3 );
 	}
 }
 
 .citizen-body,
 .mw-body-content {
-	line-height: var(--line-height);
+	line-height: var( --line-height );
 }
diff --git a/resources/skins.citizen.styles/layout.less b/resources/skins.citizen.styles/layout.less
index 3aef5a00..74e82387 100644
--- a/resources/skins.citizen.styles/layout.less
+++ b/resources/skins.citizen.styles/layout.less
@@ -5,7 +5,7 @@
 
 .citizen-page-container {
 	// Reserve space for header
-	margin-top: var(--header-size);
+	margin-top: var( --header-size );
 }
 
 .citizen-body-container {
@@ -16,14 +16,14 @@
 	/* stylelint-disable-next-line declaration-block-no-duplicate-properties */
 	display: grid;
 	justify-content: center;
-	padding: var(--space-xl) var(--padding-page);
-	gap: var(--space-md) var(--space-md);
+	padding: var( --space-xl ) var( --padding-page );
+	gap: var( --space-md ) var( --space-md );
 	grid-template-areas:
-		'header'
+ 'header'
 		'content'
 		'footer';
 	// Using auto as min value will cause overflow
-	grid-template-columns: minmax(0, var(--width-layout));
+	grid-template-columns: minmax( 0, var( --width-layout ) );
 }
 
 .mw-body-header {
@@ -33,8 +33,8 @@
 	flex-wrap: wrap;
 	align-items: center;
 	justify-content: flex-end;
-	padding-top: var(--space-md);
-	gap: var(--space-md);
+	padding-top: var( --space-md );
+	gap: var( --space-md );
 	grid-area: header;
 }
 
@@ -60,27 +60,27 @@ a.image {
 	}
 }
 
-@media (min-width: @width-breakpoint-desktop) {
+@media ( min-width: @width-breakpoint-desktop ) {
 	.citizen-toc-enabled {
 		.citizen-body-container {
 			display: grid;
 			grid-template-areas:
- 				'header header'
+ 'header header'
 				'content toc'
 				'footer .';
-			grid-template-columns: minmax(0, var(--width-layout)) var(--width-toc);
+			grid-template-columns: minmax( 0, var( --width-layout ) ) var( --width-toc );
 		}
 	}
 }
 
 /* Wider page width for certain namespaces */
-@media (min-width: @width-breakpoint-desktop-wide) {
+@media ( min-width: @width-breakpoint-desktop-wide ) {
 	.ns {
 		// 1 - Special, 6 - File, 14 - Category
 		&--1,
 		&-6,
 		&-14 {
-			--width-layout: var(--width-layout--extended);
+			--width-layout: var( --width-layout--extended );
 		}
 
 		// 2 - User, 4 - Project, 12 - Help
@@ -92,7 +92,7 @@ a.image {
 		&-12,
 		&-828,
 		&-talk {
-			--width-layout: var(--width-layout--wide);
+			--width-layout: var( --width-layout--wide );
 		}
 	}
 }
diff --git a/resources/skins.citizen.styles/skinning/content.body.less b/resources/skins.citizen.styles/skinning/content.body.less
index 27a030d9..6a8ae5f8 100644
--- a/resources/skins.citizen.styles/skinning/content.body.less
+++ b/resources/skins.citizen.styles/skinning/content.body.less
@@ -11,7 +11,7 @@
 .skin-citizen {
 	.mw-body-content {
 		.error {
-			color: var(--color-destructive);
+			color: var( --color-destructive );
 		}
 
 		h1,
@@ -29,7 +29,7 @@
 	}
 }
 
-@media (max-width: @width-breakpoint-mobile) {
+@media ( max-width: @width-breakpoint-mobile ) {
 	.skin-citizen .mw-body-content {
 		h1,
 		h2,
diff --git a/resources/skins.citizen.styles/skinning/content.externallinks.less b/resources/skins.citizen.styles/skinning/content.externallinks.less
index aa48829f..29da29ae 100644
--- a/resources/skins.citizen.styles/skinning/content.externallinks.less
+++ b/resources/skins.citizen.styles/skinning/content.externallinks.less
@@ -19,9 +19,9 @@
 				background-color: currentcolor;
 				content: '';
 				/* @embed */
-				-webkit-mask: url('images/linkExternal.svg') no-repeat 50% 50%;
+				-webkit-mask: url( images/linkExternal.svg ) no-repeat 50% 50%;
 				/* @embed */
-				mask: url('images/linkExternal.svg') no-repeat 50% 50%;
+				mask: url( images/linkExternal.svg ) no-repeat 50% 50%;
 				-webkit-mask-size: contain;
 				mask-size: contain;
 			}
@@ -29,7 +29,7 @@
 			// Somehow this get overriden from content.links
 			&:hover,
 			&:visited:hover {
-				color: var(--color-link--hover);
+				color: var( --color-link--hover );
 			}
 		}
 	}
@@ -50,7 +50,7 @@
 			&.extiw,
 			&.external {
 				&::after {
-					transform: scaleX(-1);
+					transform: scaleX( -1 );
 				}
 			}
 		}
diff --git a/resources/skins.citizen.styles/skinning/content.links.less b/resources/skins.citizen.styles/skinning/content.links.less
index 5550b616..e20540fb 100644
--- a/resources/skins.citizen.styles/skinning/content.links.less
+++ b/resources/skins.citizen.styles/skinning/content.links.less
@@ -10,7 +10,7 @@
 // Be more specific to replace default style
 .skin-citizen {
 	a.mw-selflink {
-		font-weight: var(--font-weight-semibold);
+		font-weight: var( --font-weight-semibold );
 	}
 }
 
@@ -19,11 +19,11 @@ a {
 	&.new,
 	&.new:visited {
 		&:hover {
-			color: var(--color-link-new--hover);
+			color: var( --color-link-new--hover );
 		}
 
 		&:active {
-			color: var(--color-link-new--active);
+			color: var( --color-link-new--active );
 		}
 	}
 }
diff --git a/resources/skins.citizen.styles/skinning/content.media-common.less b/resources/skins.citizen.styles/skinning/content.media-common.less
index 9e80df66..39ab5c1b 100644
--- a/resources/skins.citizen.styles/skinning/content.media-common.less
+++ b/resources/skins.citizen.styles/skinning/content.media-common.less
@@ -10,10 +10,10 @@
 /**
  * Block media items
  */
-figure[typeof~='mw:File'],
-figure[typeof~='mw:File/Frameless'],
-figure[typeof~='mw:File/Thumb'],
-figure[typeof~='mw:File/Frame'] {
+figure[ typeof~='mw:File' ],
+figure[ typeof~='mw:File/Frameless' ],
+figure[ typeof~='mw:File/Thumb' ],
+figure[ typeof~='mw:File/Frame' ] {
 	&.mw-halign-none {
 		clear: none;
 		float: none;
@@ -25,18 +25,18 @@ figure[typeof~='mw:File/Frame'] {
 	}
 }
 
-figure[typeof~='mw:File'],
-figure[typeof~='mw:File/Frameless'] {
+figure[ typeof~='mw:File' ],
+figure[ typeof~='mw:File/Frameless' ] {
 	/* Hide the caption for frameless and plain floated images */
 	> figcaption {
 		display: none;
 	}
 }
 
-figure[typeof~='mw:File/Thumb'],
-figure[typeof~='mw:File/Frame'] {
+figure[ typeof~='mw:File/Thumb' ],
+figure[ typeof~='mw:File/Frame' ] {
 	display: table;
-	margin: var(--space-xs) auto var(--space-md) auto;
+	margin: var( --space-xs ) auto var( --space-md ) auto;
 	font-size: 0.8125rem;
 	text-align: center;
 
@@ -55,26 +55,26 @@ figure[typeof~='mw:File/Frame'] {
 	> figcaption {
 		display: table-caption;
 		// Sync with rounded corner
-		padding-right: var(--border-radius--small);
+		padding-right: var( --border-radius--small );
 		// Sync with rounded corner
-		padding-left: var(--border-radius--small);
-		margin-top: var(--space-xs);
+		padding-left: var( --border-radius--small );
+		margin-top: var( --space-xs );
 		caption-side: bottom;
-		color: var(--color-base--subtle);
+		color: var( --color-base--subtle );
 		letter-spacing: 0.025em;
 	}
 }
 
 // Do not float content in mobile view
-@media (min-width: @width-breakpoint-tablet) {
-	figure[typeof~='mw:File/Thumb'],
-	figure[typeof~='mw:File/Frame'] {
+@media ( min-width: @width-breakpoint-tablet ) {
+	figure[ typeof~='mw:File/Thumb' ],
+	figure[ typeof~='mw:File/Frame' ] {
 		text-align: start;
 
 		// When float is not explicitly set
 		.mw-content-ltr & {
 			/* @noflip */
-			margin-left: var(--space-lg);
+			margin-left: var( --space-lg );
 			/* @noflip */
 			clear: right;
 			/* @noflip */
@@ -83,7 +83,7 @@ figure[typeof~='mw:File/Frame'] {
 
 		.mw-content-rtl & {
 			/* @noflip */
-			margin-right: var(--space-lg);
+			margin-right: var( --space-lg );
 			/* @noflip */
 			clear: left;
 			/* @noflip */
@@ -91,13 +91,13 @@ figure[typeof~='mw:File/Frame'] {
 		}
 	}
 
-	figure[typeof~='mw:File'],
-	figure[typeof~='mw:File/Frameless'],
-	figure[typeof~='mw:File/Thumb'],
-	figure[typeof~='mw:File/Frame'] {
+	figure[ typeof~='mw:File' ],
+	figure[ typeof~='mw:File/Frameless' ],
+	figure[ typeof~='mw:File/Thumb' ],
+	figure[ typeof~='mw:File/Frame' ] {
 		&.mw-halign-right {
 			/* @noflip */
-			margin-left: var(--space-lg);
+			margin-left: var( --space-lg );
 			/* @noflip */
 			clear: right;
 			/* @noflip */
@@ -106,7 +106,7 @@ figure[typeof~='mw:File/Frame'] {
 
 		&.mw-halign-left {
 			/* @noflip */
-			margin-right: var(--space-lg);
+			margin-right: var( --space-lg );
 			/* @noflip */
 			clear: left;
 			/* @noflip */
diff --git a/resources/skins.citizen.styles/skinning/content.media-screen.less b/resources/skins.citizen.styles/skinning/content.media-screen.less
index 7657abec..577e808b 100644
--- a/resources/skins.citizen.styles/skinning/content.media-screen.less
+++ b/resources/skins.citizen.styles/skinning/content.media-screen.less
@@ -6,10 +6,10 @@
  *
  * Date: 2022-11-18
 */
-figure[typeof~='mw:File'],
-figure[typeof~='mw:File/Frameless'],
-figure[typeof~='mw:File/Thumb'],
-figure[typeof~='mw:File/Frame'] {
+figure[ typeof~='mw:File' ],
+figure[ typeof~='mw:File/Frameless' ],
+figure[ typeof~='mw:File/Thumb' ],
+figure[ typeof~='mw:File/Frame' ] {
 	> a:first-child {
 		display: inline-block;
 		overflow: hidden;
@@ -21,26 +21,26 @@ figure[typeof~='mw:File/Frame'] {
 	}
 }
 
-figure[typeof~='mw:File/Thumb'],
-figure[typeof~='mw:File/Frame'] {
+figure[ typeof~='mw:File/Thumb' ],
+figure[ typeof~='mw:File/Frame' ] {
 	> a:first-child,
 	> span:first-child {
 		display: block;
-		border-radius: var(--border-radius--small);
+		border-radius: var( --border-radius--small );
 
 		// Broken file styles
 		&.new {
-			padding: var(--space-sm);
-			border: 1px dashed var(--border-color-base--darker);
+			padding: var( --space-sm );
+			border: 1px dashed var( --border-color-base--darker );
 			transition: @transition-background, @transition-color;
 
 			&:hover {
-				background-color: var(--color-destructive--hover);
+				background-color: var( --color-destructive--hover );
 				color: #fff;
 			}
 
 			&:active {
-				background-color: var(--color-destructive--active);
+				background-color: var( --color-destructive--active );
 				color: #fff;
 			}
 		}
diff --git a/resources/skins.citizen.styles/skinning/content.tables.less b/resources/skins.citizen.styles/skinning/content.tables.less
index 2cceb10f..bb012f55 100644
--- a/resources/skins.citizen.styles/skinning/content.tables.less
+++ b/resources/skins.citizen.styles/skinning/content.tables.less
@@ -10,26 +10,26 @@
 .mw_metadata,
 .mw-datatable,
 .wikitable {
-	margin: var(--space-md) auto;
+	margin: var( --space-md ) auto;
 	border-collapse: collapse;
 
 	tbody {
-		border: 0.5px solid var(--border-color-base);
+		border: 0.5px solid var( --border-color-base );
 		background-color: #f8f9fa;
 	}
 
 	caption {
-		padding-right: var(--space-sm);
-		padding-left: var(--space-sm);
-		color: var(--color-base--emphasized);
+		padding-right: var( --space-sm );
+		padding-left: var( --space-sm );
+		color: var( --color-base--emphasized );
 		font-size: 1.125rem;
-		font-weight: var(--font-weight-semibold);
+		font-weight: var( --font-weight-semibold );
 		text-align: center;
 	}
 
 	th {
-		color: var(--color-base);
-		font-weight: var(--font-weight-semibold);
+		color: var( --color-base );
+		font-weight: var( --font-weight-semibold );
 		letter-spacing: 0.05em;
 		text-align: start;
 	}
@@ -45,7 +45,7 @@
 	> * > tr > th,
 	> * > tr > td {
 		padding: 0.2em 0.4em;
-		border: 0.5px solid var(--border-color-base);
+		border: 0.5px solid var( --border-color-base );
 	}
 
 	td {
@@ -54,7 +54,7 @@
 
 	th,
 	td {
-		padding: var(--space-xs) var(--space-sm);
+		padding: var( --space-xs ) var( --space-sm );
 	}
 }
 
diff --git a/resources/skins.citizen.styles/skinning/content.thumbnails-common.less b/resources/skins.citizen.styles/skinning/content.thumbnails-common.less
index fe8ebdf6..d1a248ed 100644
--- a/resources/skins.citizen.styles/skinning/content.thumbnails-common.less
+++ b/resources/skins.citizen.styles/skinning/content.thumbnails-common.less
@@ -18,16 +18,16 @@ table.floatright {
 /* @noflip */
 div.tleft,
 div.tright {
-	margin: var(--space-xs) 0 var(--space-md) 0;
+	margin: var( --space-xs ) 0 var( --space-md ) 0;
 }
 
 .thumbcaption {
 	// Sync with rounded corner
-	padding-right: var(--border-radius--small);
+	padding-right: var( --border-radius--small );
 	// Sync with rounded corner
-	padding-left: var(--border-radius--small);
-	margin-top: var(--space-xs);
-	color: var(--color-base--subtle);
+	padding-left: var( --border-radius--small );
+	margin-top: var( --space-xs );
+	color: var( --color-base--subtle );
 	letter-spacing: 0.025em;
 	text-align: center;
 }
@@ -42,19 +42,19 @@ div.thumbinner {
 	// Center thumbnail without float
 	margin-left: auto;
 	// Add background
-	background-color: var(--background-color-overlay);
+	background-color: var( --background-color-overlay );
 	// We use the same font size for both caption and inner
 	font-size: 0.8125rem;
 	text-align: center;
 }
 
 // Do not float content in mobile view
-@media (min-width: @width-breakpoint-tablet) {
+@media ( min-width: @width-breakpoint-tablet ) {
 	/* @noflip */
 	div.tright,
 	div.floatright,
 	table.floatright {
-		margin-left: var(--space-lg);
+		margin-left: var( --space-lg );
 		clear: right;
 		float: right;
 	}
@@ -63,7 +63,7 @@ div.thumbinner {
 	div.tleft,
 	div.floatleft,
 	table.floatleft {
-		margin-right: var(--space-lg);
+		margin-right: var( --space-lg );
 		clear: left;
 		float: left;
 	}
diff --git a/resources/skins.citizen.styles/skinning/content.thumbnails-screen.less b/resources/skins.citizen.styles/skinning/content.thumbnails-screen.less
index 6f64f8e4..11a6b240 100644
--- a/resources/skins.citizen.styles/skinning/content.thumbnails-screen.less
+++ b/resources/skins.citizen.styles/skinning/content.thumbnails-screen.less
@@ -10,7 +10,7 @@
 .thumbinner {
 	> a {
 		display: block;
-		border-radius: var(--border-radius--small);
+		border-radius: var( --border-radius--small );
 
 		&.image {
 			max-width: inherit;
@@ -25,17 +25,17 @@
 
 		// Broken file styles
 		&.new {
-			padding: var(--space-sm);
-			border: 1px dashed var(--border-color-base--darker);
+			padding: var( --space-sm );
+			border: 1px dashed var( --border-color-base--darker );
 			transition: @transition-background, @transition-color;
 
 			&:hover {
-				background-color: var(--color-destructive--hover);
+				background-color: var( --color-destructive--hover );
 				color: #fff;
 			}
 
 			&:active {
-				background-color: var(--color-destructive--active);
+				background-color: var( --color-destructive--active );
 				color: #fff;
 			}
 		}
diff --git a/resources/skins.citizen.styles/skinning/elements.less b/resources/skins.citizen.styles/skinning/elements.less
index 1bfeda47..239de40f 100644
--- a/resources/skins.citizen.styles/skinning/elements.less
+++ b/resources/skins.citizen.styles/skinning/elements.less
@@ -10,33 +10,33 @@
 /* Links */
 // Some of the link styles are handled in content.links
 a {
-	color: var(--color-link);
+	color: var( --color-link );
 	text-decoration: none;
 
-	&:not([href]) {
+	&:not( [ href ] ) {
 		cursor: pointer; /* Always cursor:pointer even without href */
 	}
 
 	&:hover,
 	&:visited:hover {
-		color: var(--color-link--hover);
+		color: var( --color-link--hover );
 		text-decoration: underline;
 	}
 
 	&:active {
-		color: var(--color-link--active);
+		color: var( --color-link--active );
 	}
 
 	&:visited {
-		color: var(--color-link--visited);
+		color: var( --color-link--visited );
 	}
 }
 
-a:lang(ar),
-a:lang(kk-arab),
-a:lang(mzn),
-a:lang(ps),
-a:lang(ur) {
+a:lang( ar ),
+a:lang( kk-arab ),
+a:lang( mzn ),
+a:lang( ps ),
+a:lang( ur ) {
 	text-decoration: none;
 }
 
@@ -47,8 +47,8 @@ img {
 
 hr {
 	border: 0;
-	border-top: 1px solid var(--border-color-base);
-	margin: var(--space-xs) 0;
+	border-top: 1px solid var( --border-color-base );
+	margin: var( --space-xs ) 0;
 }
 
 /* Structural Elements */
@@ -61,22 +61,22 @@ h6 {
 	margin: 0;
 	// It seems that many wikis have the expectation that headers have a bottom margin
 	margin-bottom: 0.5em;
-	color: var(--color-base--emphasized);
-	font-family: var(--fonts-serif);
-	font-weight: var(--font-weight-semibold);
+	color: var( --color-base--emphasized );
+	font-family: var( --fonts-serif );
+	font-weight: var( --font-weight-semibold );
 }
 
 h1,
 h2 {
-	font-weight: var(--font-weight-bold);
+	font-weight: var( --font-weight-bold );
 }
 
 h3,
 h4,
 h5,
 h6 {
-	font-weight: var(--font-weight-semibold);
-	line-height: var(--line-height-xs);
+	font-weight: var( --font-weight-semibold );
+	line-height: var( --line-height-xs );
 }
 
 h3,
@@ -91,37 +91,37 @@ h6 {
 
 h1 {
 	margin-top: 2em;
-	font-size: var(--font-size-h1);
+	font-size: var( --font-size-h1 );
 }
 
-h1:not(.firstHeading) {
-	border-bottom: 1px solid var(--border-color-base);
+h1:not( .firstHeading ) {
+	border-bottom: 1px solid var( --border-color-base );
 }
 
 h2 {
-	border-bottom: 1px solid var(--border-color-base);
+	border-bottom: 1px solid var( --border-color-base );
 	margin-top: 0.5em;
-	font-size: var(--font-size-h2);
+	font-size: var( --font-size-h2 );
 }
 
 h3 {
-	font-size: var(--font-size-h3);
+	font-size: var( --font-size-h3 );
 }
 
 h4 {
-	font-size: var(--font-size-h4);
+	font-size: var( --font-size-h4 );
 }
 
 h5 {
-	font-size: var(--font-size-h5);
+	font-size: var( --font-size-h5 );
 }
 
 h6 {
-	font-size: var(--font-size-h6);
+	font-size: var( --font-size-h6 );
 }
 
 p {
-	margin: var(--space-xs) 0;
+	margin: var( --space-xs ) 0;
 	overflow-wrap: break-word; // Force wrap to preserve layout
 }
 
@@ -132,25 +132,25 @@ p img {
 ul {
 	// Will break a lot of styles if we use padding for horizontal spacing
 	padding: 0;
-	margin: var(--space-xs) 0 var(--space-xs) var(--space-lg);
+	margin: var( --space-xs ) 0 var( --space-xs ) var( --space-lg );
 }
 
 ol {
 	padding: 0;
-	margin: var(--space-xs) 0 var(--space-xs) var(--space-lg);
+	margin: var( --space-xs ) 0 var( --space-xs ) var( --space-lg );
 }
 
 dt {
-	color: var(--color-base--emphasized);
-	font-weight: var(--font-weight-semibold);
+	color: var( --color-base--emphasized );
+	font-weight: var( --font-weight-semibold );
 }
 
 dl {
-	margin: var(--space-xs) 0;
+	margin: var( --space-xs ) 0;
 }
 
 dd {
-	margin-left: var(--space-lg);
+	margin-left: var( --space-lg );
 }
 
 pre,
@@ -159,28 +159,28 @@ tt,
 kbd,
 samp,
 .mw-code {
-	font-family: var(--fonts-monospace);
+	font-family: var( --fonts-monospace );
 	font-size: 0.875rem;
 }
 
 pre,
 code,
 .mw-code {
-	border: 1px solid var(--border-color-base);
-	background-color: var(--color-surface-2);
-	color: var(--color-base--emphasized);
+	border: 1px solid var( --border-color-base );
+	background-color: var( --color-surface-2 );
+	color: var( --color-base--emphasized );
 }
 
 code {
 	padding: 2px 4px;
-	border-radius: var(--border-radius--small);
+	border-radius: var( --border-radius--small );
 }
 
 pre,
 .mw-code {
 	overflow: auto;
 	padding: 1rem;
-	border-radius: var(--border-radius--large);
+	border-radius: var( --border-radius--large );
 }
 
 /* Tables */
@@ -193,14 +193,14 @@ table {
 
 /* Forms */
 fieldset {
-	padding: var(--space-xs);
-	border: 1px solid var(--border-color-base);
-	margin: var(--space-xs) 0;
+	padding: var( --space-xs );
+	border: 1px solid var( --border-color-base );
+	margin: var( --space-xs ) 0;
 }
 
 legend {
-	padding: var(--space-xxs);
-	color: var(--color-base--subtle);
+	padding: var( --space-xxs );
+	color: var( --color-base--subtle );
 	letter-spacing: 0.05em;
 }
 
diff --git a/resources/skins.citizen.styles/skinning/i18n-all-lists-margins.less b/resources/skins.citizen.styles/skinning/i18n-all-lists-margins.less
index 7bece9f8..bb94f5d7 100644
--- a/resources/skins.citizen.styles/skinning/i18n-all-lists-margins.less
+++ b/resources/skins.citizen.styles/skinning/i18n-all-lists-margins.less
@@ -12,40 +12,40 @@
 .mw-content-rtl .mw-content-ltr ul {
 	padding: 0;
 	/* @noflip */
-	margin: var(--space-xs) 0 var(--space-xs) var(--space-lg);
+	margin: var( --space-xs ) 0 var( --space-xs ) var( --space-lg );
 }
 
 .mw-content-rtl ul,
 .mw-content-ltr .mw-content-rtl ul {
 	padding: 0;
 	/* @noflip */
-	margin: var(--space-xs) var(--space-lg) var(--space-xs) 0;
+	margin: var( --space-xs ) var( --space-lg ) var( --space-xs ) 0;
 }
 
 .mw-content-ltr ol,
 .mw-content-rtl .mw-content-ltr ol {
 	padding: 0;
 	/* @noflip */
-	margin: var(--space-xs) 0 var(--space-xs) var(--space-lg);
+	margin: var( --space-xs ) 0 var( --space-xs ) var( --space-lg );
 }
 
 .mw-content-rtl ol,
 .mw-content-ltr .mw-content-rtl ol {
 	padding: 0;
 	/* @noflip */
-	margin: var(--space-xs) var(--space-lg) var(--space-xs) 0;
+	margin: var( --space-xs ) var( --space-lg ) var( --space-xs ) 0;
 }
 
 /* @noflip */
 .mw-content-ltr dd,
 .mw-content-rtl .mw-content-ltr dd {
 	margin-right: 0;
-	margin-left: var(--space-lg);
+	margin-left: var( --space-lg );
 }
 
 /* @noflip */
 .mw-content-rtl dd,
 .mw-content-ltr .mw-content-rtl dd {
-	margin-right: var(--space-lg);
+	margin-right: var( --space-lg );
 	margin-left: 0;
 }
diff --git a/resources/skins.citizen.styles/skinning/interface-edit-section-links.less b/resources/skins.citizen.styles/skinning/interface-edit-section-links.less
index 4758de22..d8fd42d7 100644
--- a/resources/skins.citizen.styles/skinning/interface-edit-section-links.less
+++ b/resources/skins.citizen.styles/skinning/interface-edit-section-links.less
@@ -10,7 +10,7 @@
 .mw-editsection {
 	display: flex;
 	align-items: center;
-	margin-left: var(--space-sm);
+	margin-left: var( --space-sm );
 	float: right; // Can't target the container so have to use to float
 	user-select: none;
 
@@ -22,16 +22,16 @@
 
 	// Fallback text button if extensions register those
 	a {
-		padding: var(--space-xxs);
-		border-radius: var(--border-radius--small);
+		padding: var( --space-xxs );
+		border-radius: var( --border-radius--small );
 		font-size: 0.875rem;
 
 		&:hover {
-			background-color: var(--background-color-quiet--hover);
+			background-color: var( --background-color-quiet--hover );
 		}
 
 		&:active {
-			background-color: var(--background-color-quiet--hover);
+			background-color: var( --background-color-quiet--hover );
 		}
 	}
 }
@@ -39,7 +39,7 @@
 .citizen-editsection-icon,
 .Wikiplus-Edit-SectionBtn { // HACK: for Wikiplus
 	.resource-loader-icon-link-small;
-	opacity: var(--opacity-icon-base);
+	opacity: var( --opacity-icon-base );
 	text-indent: -9999px; // Hide text
 	transition: @transition-opacity;
 
@@ -50,11 +50,11 @@
 	}
 
 	&:hover {
-		opacity: var(--opacity-icon-base--hover);
+		opacity: var( --opacity-icon-base--hover );
 	}
 
 	&:active {
-		opacity: var(--opacity-icon-base--active);
+		opacity: var( --opacity-icon-base--active );
 	}
 }
 
@@ -64,13 +64,13 @@
 	/* @noflip */
 	margin-right: 0;
 	/* @noflip */
-	margin-left: var(--space-sm);
+	margin-left: var( --space-sm );
 }
 
 .mw-content-rtl .mw-editsection,
 .mw-content-ltr .mw-content-rtl .mw-editsection {
 	/* @noflip */
-	margin-right: var(--space-sm);
+	margin-right: var( --space-sm );
 	/* @noflip */
 	margin-left: 0;
 }
diff --git a/resources/skins.citizen.styles/skinning/interface-message-box.less b/resources/skins.citizen.styles/skinning/interface-message-box.less
index 5948bb24..94d784a4 100644
--- a/resources/skins.citizen.styles/skinning/interface-message-box.less
+++ b/resources/skins.citizen.styles/skinning/interface-message-box.less
@@ -9,10 +9,10 @@
 
 .mw-message-box {
 	overflow: hidden;
-	padding: var(--space-sm) var(--space-md);
-	border-radius: var(--border-radius--small);
-	background-color: var(--color-surface-2);
-	color: var(--color-base--emphasized);
+	padding: var( --space-sm ) var( --space-md );
+	border-radius: var( --border-radius--small );
+	background-color: var( --color-surface-2 );
+	color: var( --color-base--emphasized );
 	/* Standard property is `overflow-wrap` */
 	overflow-wrap: break-word;
 	word-wrap: break-word;
@@ -28,15 +28,15 @@
 	}
 
 	&-error {
-		background-color: var(--background-color-destructive);
+		background-color: var( --background-color-destructive );
 	}
 
 	&-warning {
-		background-color: var(--background-color-warning);
+		background-color: var( --background-color-warning );
 	}
 
 	&-success {
-		background-color: var(--background-color-success);
+		background-color: var( --background-color-success );
 	}
 }
 
diff --git a/resources/skins.citizen.styles/skinning/interface-subtitle.less b/resources/skins.citizen.styles/skinning/interface-subtitle.less
index 15ce1905..2ccd46d0 100644
--- a/resources/skins.citizen.styles/skinning/interface-subtitle.less
+++ b/resources/skins.citizen.styles/skinning/interface-subtitle.less
@@ -9,20 +9,20 @@
 
 #siteSub {
 	display: block;
-	margin-top: var(--space-xxs);
+	margin-top: var( --space-xxs );
 }
 
 #siteSub,
 #contentSub,
 #contentSub2 {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 	font-size: 0.8125rem;
-	line-height: var(--line-height-xs);
+	line-height: var( --line-height-xs );
 }
 
 #contentSub,
 #contentSub2 {
-	margin-bottom: var(--space-md);
+	margin-bottom: var( --space-md );
 }
 
 // Reduced spacing if both sub1 and 2 exists
diff --git a/resources/skins.citizen.styles/skinning/interface.category.less b/resources/skins.citizen.styles/skinning/interface.category.less
index bc53a733..3c0bf818 100644
--- a/resources/skins.citizen.styles/skinning/interface.category.less
+++ b/resources/skins.citizen.styles/skinning/interface.category.less
@@ -11,15 +11,15 @@
 	display: flex;
 	flex-wrap: wrap;
 	clear: both;
-	gap: var(--space-xl);
+	gap: var( --space-xl );
 
 	ul {
 		display: flex;
 		flex-wrap: wrap;
-		margin: var(--space-xs) 0 0 0;
+		margin: var( --space-xs ) 0 0 0;
 		/* Reset font */
 		font-size: 0.8125rem;
-		gap: var(--space-xs);
+		gap: var( --space-xs );
 		letter-spacing: 0; // hidden-catlink title does not have a selector
 	}
 
@@ -29,14 +29,14 @@
 		// Be more specific because gadgets like hotcat can attach links in category
 		> a {
 			display: inline-block;
-			padding: var(--space-xs) var(--space-md);
-			border: 1px solid var(--border-color-base--darker);
-			border-radius: var(--border-radius--pill);
-			color: var(--color-base--subtle);
+			padding: var( --space-xs ) var( --space-md );
+			border: 1px solid var( --border-color-base--darker );
+			border-radius: var( --border-radius--pill );
+			color: var( --color-base--subtle );
 			transition: @transition-background;
 
 			&:hover {
-				background-color: var(--color-primary--hover);
+				background-color: var( --color-primary--hover );
 				color: #fff;
 			}
 
@@ -45,7 +45,7 @@
 				border-style: dashed;
 
 				&:hover {
-					background-color: var(--color-destructive--hover);
+					background-color: var( --color-destructive--hover );
 				}
 			}
 		}
@@ -61,7 +61,7 @@
 .mw-normal-catlinks > a,
 .mw-hidden-catlinks {
 	display: block;
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 	font-size: 0.8125rem;
 	letter-spacing: 0.05em;
 }
diff --git a/skinStyles/codex/codex.styles.less b/skinStyles/codex/codex.styles.less
index d1900c5d..eb8397d0 100644
--- a/skinStyles/codex/codex.styles.less
+++ b/skinStyles/codex/codex.styles.less
@@ -9,333 +9,333 @@
 */
 
 .cdx-icon {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .cdx-button {
-	border-radius: var(--border-radius--small);
-	font-weight: var(--font-weight-medium);
+	border-radius: var( --border-radius--small );
+	font-weight: var( --font-weight-medium );
 }
 
 .cdx-button:enabled {
-	color: var(--color-base--emphasized);
+	color: var( --color-base--emphasized );
 }
 
-.cdx-button:enabled:focus:not(:active) {
-	border-color: var(--color-primary);
-	box-shadow: inset 0 0 0 1px var(--color-primary);
+.cdx-button:enabled:focus:not( :active ) {
+	border-color: var( --color-primary );
+	box-shadow: inset 0 0 0 1px var( --color-primary );
 }
 
 .cdx-button--framed:enabled {
-	border-color: var(--border-color-base);
-	background-color: var(--color-surface-2);
+	border-color: var( --border-color-base );
+	background-color: var( --color-surface-2 );
 }
 
 .cdx-button--framed:enabled:hover {
-	border-color: var(--border-color-base);
-	background-color: var(--color-surface-2--hover);
-	color: var(--color-base--emphasized);
+	border-color: var( --border-color-base );
+	background-color: var( --color-surface-2--hover );
+	color: var( --color-base--emphasized );
 }
 
 .cdx-button--framed:enabled:active {
-	border-color: var(--border-color-base);
-	background-color: var(--color-surface-2--active);
-	color: var(--color-base--subtle);
+	border-color: var( --border-color-base );
+	background-color: var( --color-surface-2--active );
+	color: var( --color-base--subtle );
 }
 
 .cdx-button--framed:disabled {
-	border-color: var(--color-surface-4);
-	background-color: var(--color-surface-4);
-	color: var(--color-base--subtle);
+	border-color: var( --color-surface-4 );
+	background-color: var( --color-surface-4 );
+	color: var( --color-base--subtle );
 }
 
 .cdx-button--type-primary.cdx-button--action-progressive:enabled {
-	border-color: var(--color-primary);
-	background-color: var(--color-primary);
+	border-color: var( --color-primary );
+	background-color: var( --color-primary );
 }
 
 .cdx-button--type-primary.cdx-button--action-progressive:enabled:hover {
-	border-color: var(--color-primary--hover);
-	background-color: var(--color-primary--hover);
+	border-color: var( --color-primary--hover );
+	background-color: var( --color-primary--hover );
 }
 
 .cdx-button--type-primary.cdx-button--action-progressive:enabled:active {
-	border-color: var(--color-primary--active);
-	background-color: var(--color-primary--active);
+	border-color: var( --color-primary--active );
+	background-color: var( --color-primary--active );
 }
 
-.cdx-button--type-primary.cdx-button--action-progressive:enabled:focus:not(:active) {
-	border-color: var(--color-primary);
-	box-shadow: inset 0 0 0 1px var(--color-primary), inset 0 0 0 2px #fff;
+.cdx-button--type-primary.cdx-button--action-progressive:enabled:focus:not( :active ) {
+	border-color: var( --color-primary );
+	box-shadow: inset 0 0 0 1px var( --color-primary ), inset 0 0 0 2px #fff;
 }
 
 .cdx-button--type-primary.cdx-button--action-destructive:enabled {
-	border-color: var(--color-destructive);
-	background-color: var(--color-destructive);
+	border-color: var( --color-destructive );
+	background-color: var( --color-destructive );
 }
 
 .cdx-button--type-primary.cdx-button--action-destructive:enabled:hover {
-	border-color: var(--color-destructive--hover);
-	background-color: var(--color-destructive--hover);
+	border-color: var( --color-destructive--hover );
+	background-color: var( --color-destructive--hover );
 }
 
 .cdx-button--type-primary.cdx-button--action-destructive:enabled:active {
-	border-color: var(--color-destructive--active);
-	background-color: var(--color-destructive--active);
+	border-color: var( --color-destructive--active );
+	background-color: var( --color-destructive--active );
 }
 
-.cdx-button--type-primary.cdx-button--action-destructive:enabled:focus:not(:active) {
-	border-color: var(--color-destructive);
-	box-shadow: inset 0 0 0 1px var(--color-destructive), inset 0 0 0 2px #fff;
+.cdx-button--type-primary.cdx-button--action-destructive:enabled:focus:not( :active ) {
+	border-color: var( --color-destructive );
+	box-shadow: inset 0 0 0 1px var( --color-destructive ), inset 0 0 0 2px #fff;
 }
 
 .cdx-button--type-normal.cdx-button--action-progressive:enabled {
-	color: var(--color-primary);
+	color: var( --color-primary );
 }
 
 .cdx-button--type-normal.cdx-button--action-progressive:enabled:hover {
-	border-color: var(--color-primary--hover);
-	color: var(--color-primary--hover);
+	border-color: var( --color-primary--hover );
+	color: var( --color-primary--hover );
 }
 
 .cdx-button--type-normal.cdx-button--action-progressive:enabled:active {
-	border-color: var(--color-primary--active);
-	background-color: var(--color-surface-2--active); // Use normal style for now
-	color: var(--color-primary--active);
+	border-color: var( --color-primary--active );
+	background-color: var( --color-surface-2--active ); // Use normal style for now
+	color: var( --color-primary--active );
 }
 
 .cdx-button--type-normal.cdx-button--action-destructive:enabled {
-	color: var(--color-destructive);
+	color: var( --color-destructive );
 }
 
 .cdx-button--type-normal.cdx-button--action-destructive:enabled:hover {
-	border-color: var(--color-destructive--hover);
-	color: var(--color-destructive--hover);
+	border-color: var( --color-destructive--hover );
+	color: var( --color-destructive--hover );
 }
 
 .cdx-button--type-normal.cdx-button--action-destructive:enabled:active {
-	border-color: var(--color-destructive--active);
-	background-color: var(--color-surface-2--active); // Use normal style for now
-	color: var(--color-destructive--active);
+	border-color: var( --color-destructive--active );
+	background-color: var( --color-surface-2--active ); // Use normal style for now
+	color: var( --color-destructive--active );
 }
 
-.cdx-button--type-normal.cdx-button--action-destructive:enabled:focus:not(:active) {
-	border-color: var(--color-destructive);
-	box-shadow: inset 0 0 0 1px var(--color-destructive);
+.cdx-button--type-normal.cdx-button--action-destructive:enabled:focus:not( :active ) {
+	border-color: var( --color-destructive );
+	box-shadow: inset 0 0 0 1px var( --color-destructive );
 }
 
 .cdx-button--type-quiet:enabled:hover {
-	background-color: var(--background-color-quiet--hover);
+	background-color: var( --background-color-quiet--hover );
 }
 
 .cdx-button--type-quiet:enabled:active {
-	border-color: var(--background-color-quiet--active);
-	background-color: var(--background-color-quiet--active);
-	color: var(--color-base--subtle);
+	border-color: var( --background-color-quiet--active );
+	background-color: var( --background-color-quiet--active );
+	color: var( --color-base--subtle );
 }
 
 .cdx-button--type-quiet.cdx-button--action-progressive:enabled {
-	color: var(--color-primary);
+	color: var( --color-primary );
 }
 
 .cdx-button--type-quiet.cdx-button--action-progressive:enabled:hover {
-	background-color: var(--background-color-primary--hover);
-	color: var(--color-primary--hover);
+	background-color: var( --background-color-primary--hover );
+	color: var( --color-primary--hover );
 }
 
 .cdx-button--type-quiet.cdx-button--action-progressive:enabled:active {
-	border-color: var(--color-primary--active);
-	background-color: var(--color-primary--active);
+	border-color: var( --color-primary--active );
+	background-color: var( --color-primary--active );
 }
 
 .cdx-button--type-quiet.cdx-button--action-destructive:enabled {
-	color: var(--color-destructive);
+	color: var( --color-destructive );
 }
 
 .cdx-button--type-quiet.cdx-button--action-destructive:enabled:hover {
-	background-color: var(--background-color-destructive);
-	color: var(--color-destructive--hover);
+	background-color: var( --background-color-destructive );
+	color: var( --color-destructive--hover );
 }
 
 .cdx-button--type-quiet.cdx-button--action-destructive:enabled:active {
-	border-color: var(--color-destructive--active);
-	background-color: var(--color-destructive--active);
+	border-color: var( --color-destructive--active );
+	background-color: var( --color-destructive--active );
 }
 
-.cdx-button--type-quiet.cdx-button--action-destructive:enabled:focus:not(:active) {
-	border-color: var(--color-destructive);
-	box-shadow: inset 0 0 0 1px var(--color-destructive);
+.cdx-button--type-quiet.cdx-button--action-destructive:enabled:focus:not( :active ) {
+	border-color: var( --color-destructive );
+	box-shadow: inset 0 0 0 1px var( --color-destructive );
 }
 
 .cdx-button--type-quiet:disabled {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .cdx-button-group {
-	border-radius: var(--border-radius--small);
+	border-radius: var( --border-radius--small );
 }
 
 .cdx-button-group .cdx-button:disabled {
-	box-shadow: 0 -1px var(--color-base--subtle), -1px 0 var(--color-base--subtle);
+	box-shadow: 0 -1px var( --color-base--subtle ), -1px 0 var( --color-base--subtle );
 }
 
 .cdx-thumbnail__placeholder,
 .cdx-thumbnail__image {
-	border-color: var(--border-color-base);
-	border-radius: var(--border-radius--small);
+	border-color: var( --border-color-base );
+	border-radius: var( --border-radius--small );
 }
 
 .cdx-thumbnail__placeholder {
-	background-color: var(--color-surface-2);
+	background-color: var( --color-surface-2 );
 }
 
 .cdx-thumbnail__placeholder__icon {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .cdx-card {
-	border-color: var(--border-color-base);
-	border-radius: var(--border-radius--medium);
-	background-color: var(--color-surface-1);
+	border-color: var( --border-color-base );
+	border-radius: var( --border-radius--medium );
+	background-color: var( --color-surface-1 );
 }
 
 .cdx-card--is-link:hover {
-	border-color: var(--color-primary--hover);
+	border-color: var( --color-primary--hover );
 }
 
 .cdx-card--is-link:focus {
-	border-color: var(--color-primary);
-	box-shadow: inset 0 0 0 1px var(--color-primary), inset 0 0 0 2px #fff;
+	border-color: var( --color-primary );
+	box-shadow: inset 0 0 0 1px var( --color-primary ), inset 0 0 0 2px #fff;
 }
 
 .cdx-card__text {
-	line-height: var(--line-height-sm);
+	line-height: var( --line-height-sm );
 }
 
 .cdx-card__text__title {
-	color: var(--color-base--emphasized);
-	font-weight: var(--font-weight-semibold);
-	line-height: var(--line-height-xs);
+	color: var( --color-base--emphasized );
+	font-weight: var( --font-weight-semibold );
+	line-height: var( --line-height-xs );
 }
 
 // Splitting description and supporting text into two colors
 .cdx-card__text__description,
 .cdx-card__text__description .cdx-icon {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .cdx-card__text__supporting-text,
 .cdx-card__text__supporting-text .cdx-icon {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .cdx-checkbox__icon {
-	border-color: var(--border-color-base--darker);
-	border-radius: var(--border-radius--small);
+	border-color: var( --border-color-base--darker );
+	border-radius: var( --border-radius--small );
 	// Show background when hovered
 	background-color: transparent;
 }
 
 .cdx-checkbox__input:enabled:hover + .cdx-checkbox__icon {
-	border-color: var(--color-primary--hover);
-	background-color: var(--color-surface-0);
+	border-color: var( --color-primary--hover );
+	background-color: var( --color-surface-0 );
 }
 
 .cdx-checkbox__input:enabled:active + .cdx-checkbox__icon {
-	border-color: var(--color-primary--active);
-	background-color: var(--color-primary--active);
+	border-color: var( --color-primary--active );
+	background-color: var( --color-primary--active );
 }
 
-.cdx-checkbox__input:enabled:focus:not(:active) + .cdx-checkbox__icon {
-	border-color: var(--color-primary);
-	background-color: var(--color-surface-0);
-	box-shadow: inset 0 0 0 1px var(--color-primary);
+.cdx-checkbox__input:enabled:focus:not( :active ) + .cdx-checkbox__icon {
+	border-color: var( --color-primary );
+	background-color: var( --color-surface-0 );
+	box-shadow: inset 0 0 0 1px var( --color-primary );
 }
 
 .cdx-checkbox__input:enabled:checked + .cdx-checkbox__icon,
 .cdx-checkbox__input:enabled:indeterminate + .cdx-checkbox__icon {
-	border-color: var(--color-primary);
-	background-color: var(--color-primary);
+	border-color: var( --color-primary );
+	background-color: var( --color-primary );
 }
 
 .cdx-checkbox__input:enabled:checked:hover + .cdx-checkbox__icon,
 .cdx-checkbox__input:enabled:indeterminate:hover + .cdx-checkbox__icon {
-	border-color: var(--color-primary--hover);
-	background-color: var(--color-primary--hover);
+	border-color: var( --color-primary--hover );
+	background-color: var( --color-primary--hover );
 }
 
 .cdx-checkbox__input:enabled:checked:active + .cdx-checkbox__icon,
 .cdx-checkbox__input:enabled:indeterminate:active + .cdx-checkbox__icon {
-	border-color: var(--color-primary--active);
-	background-color: var(--color-primary--active);
+	border-color: var( --color-primary--active );
+	background-color: var( --color-primary--active );
 }
 
-.cdx-checkbox__input:enabled:checked:focus:not(:active, :hover) + .cdx-checkbox__icon,
-.cdx-checkbox__input:enabled:indeterminate:focus:not(:active, :hover) + .cdx-checkbox__icon {
-	border-color: var(--color-primary);
-	background-color: var(--color-primary);
+.cdx-checkbox__input:enabled:checked:focus:not( :active, :hover ) + .cdx-checkbox__icon,
+.cdx-checkbox__input:enabled:indeterminate:focus:not( :active, :hover ) + .cdx-checkbox__icon {
+	border-color: var( --color-primary );
+	background-color: var( --color-primary );
 }
 
-.cdx-checkbox__input:enabled:checked:focus:not(:active) + .cdx-checkbox__icon,
-.cdx-checkbox__input:enabled:indeterminate:focus:not(:active) + .cdx-checkbox__icon {
-	box-shadow: inset 0 0 0 1px var(--color-primary), inset 0 0 0 2px #fff;
+.cdx-checkbox__input:enabled:checked:focus:not( :active ) + .cdx-checkbox__icon,
+.cdx-checkbox__input:enabled:indeterminate:focus:not( :active ) + .cdx-checkbox__icon {
+	box-shadow: inset 0 0 0 1px var( --color-primary ), inset 0 0 0 2px #fff;
 }
 
 .cdx-checkbox__input:disabled + .cdx-checkbox__icon {
-	border-color: var(--color-surface-4);
-	background-color: var(--color-surface-4);
+	border-color: var( --color-surface-4 );
+	background-color: var( --color-surface-4 );
 }
 
 .cdx-checkbox__input:disabled ~ .cdx-checkbox__label-content {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .cdx-search-result-title {
-	font-weight: var(--font-weight-semibold);
+	font-weight: var( --font-weight-semibold );
 }
 
 .cdx-menu-item {
-	line-height: var(--line-height);
+	line-height: var( --line-height );
 }
 
 .cdx-menu-item__content {
-	line-height: var(--line-height-sm);
+	line-height: var( --line-height-sm );
 }
 
 .cdx-menu-item--bold-label .cdx-menu-item__text__label {
-	font-weight: var(--font-weight-semibold);
+	font-weight: var( --font-weight-semibold );
 }
 
 .cdx-menu-item--enabled,
 .cdx-menu-item--enabled .cdx-menu-item__content {
-	color: var(--color-base--emphasized);
+	color: var( --color-base--emphasized );
 }
 
 .cdx-menu-item--enabled .cdx-menu-item__text__description {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .cdx-menu-item--enabled:hover,
 .cdx-menu-item--enabled.cdx-menu-item--highlighted {
-	background-color: var(--background-color-quiet--hover);
+	background-color: var( --background-color-quiet--hover );
 }
 
 .cdx-menu-item--enabled.cdx-menu-item--active,
 .cdx-menu-item--enabled.cdx-menu-item--active:hover {
-	background-color: var(--background-color-primary--hover);
-	color: var(--color-primary);
+	background-color: var( --background-color-primary--hover );
+	color: var( --color-primary );
 }
 
 .cdx-menu-item--enabled.cdx-menu-item--active .cdx-menu-item__content,
 .cdx-menu-item--enabled.cdx-menu-item--active:hover .cdx-menu-item__content,
 .cdx-menu-item--enabled.cdx-menu-item--active .cdx-menu-item__text__description,
 .cdx-menu-item--enabled.cdx-menu-item--active:hover .cdx-menu-item__text__description {
-	color: var(--color-primary);
+	color: var( --color-primary );
 }
 
 .cdx-menu-item--enabled.cdx-menu-item--selected,
 .cdx-menu-item--enabled.cdx-menu-item--selected:hover {
-	background-color: var(--background-color-primary--hover);
+	background-color: var( --background-color-primary--hover );
 }
 
 .cdx-menu-item--enabled.cdx-menu-item--selected:hover,
@@ -344,428 +344,428 @@
 .cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--highlighted .cdx-menu-item__content,
 .cdx-menu-item--enabled.cdx-menu-item--selected:hover .cdx-menu-item__text__description,
 .cdx-menu-item--enabled.cdx-menu-item--selected.cdx-menu-item--highlighted .cdx-menu-item__text__description {
-	color: var(--color-primary);
+	color: var( --color-primary );
 }
 
 .cdx-menu-item--disabled {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .cdx-menu-item--disabled .cdx-menu-item__text__description {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .cdx-progress-bar__bar {
-	background-color: var(--color-primary);
+	background-color: var( --color-primary );
 	// Fancy shadow
 	// TODO: Need to figure out a way to deal with the overflow issue
-	filter: drop-shadow(0 0 16px var(--color-primary));
+	filter: drop-shadow( 0 0 16px var( --color-primary ) );
 }
 
 .cdx-progress-bar--block {
-	border-color: var(--color-primary);
-	background-color: var(--color-surface-1);
+	border-color: var( --color-primary );
+	background-color: var( --color-surface-1 );
 }
 
 .cdx-menu {
-	border-color: var(--border-color-base--darker);
-	border-radius: 0 0 var(--border-radius--small) var(--border-radius--small);
-	background-color: var(--color-surface-1);
+	border-color: var( --border-color-base--darker );
+	border-radius: 0 0 var( --border-radius--small ) var( --border-radius--small );
+	background-color: var( --color-surface-1 );
 	// box-shadow: var( --box-shadow-dialog );
 }
 
 .cdx-text-input__input:enabled {
-	border-color: var(--border-color-base--darker);
+	border-color: var( --border-color-base--darker );
 	// Show background when hovered
 	background-color: transparent;
-	color: var(--color-base--emphasized);
+	color: var( --color-base--emphasized );
 }
 
 .cdx-text-input__input:enabled ~ .cdx-text-input__icon {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .cdx-text-input__input:enabled:focus ~ .cdx-text-input__icon,
 .cdx-text-input__input:enabled.cdx-text-input__input--has-value ~ .cdx-text-input__icon {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .cdx-text-input__input:enabled:hover {
-	border-color: var(--color-primary--hover);
-	background-color: var(--color-surface-0);
+	border-color: var( --color-primary--hover );
+	background-color: var( --color-surface-0 );
 }
 
 .cdx-text-input__input:enabled:focus {
-	border-color: var(--color-primary);
-	background-color: var(--color-surface-0);
-	box-shadow: inset 0 0 0 1px var(--color-primary);
+	border-color: var( --color-primary );
+	background-color: var( --color-surface-0 );
+	box-shadow: inset 0 0 0 1px var( --color-primary );
 }
 
 .cdx-text-input__input:disabled {
-	border-color: var(--color-surface-4);
-	background-color: var(--color-surface-4);
-	color: var(--color-base--subtle);
-	-webkit-text-fill-color: var(--color-base--subtle);
+	border-color: var( --color-surface-4 );
+	background-color: var( --color-surface-4 );
+	color: var( --color-base--subtle );
+	-webkit-text-fill-color: var( --color-base--subtle );
 }
 
 .cdx-text-input__input:disabled ~ .cdx-text-input__icon {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 /* stylelint-disable-next-line selector-pseudo-element-no-unknown */
 .cdxinput__input::input-placeholder {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .cdx-text-input__input::placeholder {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .cdx-lookup--pending .cdx-text-input__input {
-	background-color: var(--color-surface-2);
-	background-image: linear-gradient(135deg, var(--color-surface-1) 25%, rgba(255, 255, 255, 0) 25%, rgba(255, 255, 255, 0) 50%, var(--color-surface-1) 50%, var(--color-surface-1) 75%, rgba(255, 255, 255, 0) 75%, rgba(255, 255, 255, 0));
+	background-color: var( --color-surface-2 );
+	background-image: linear-gradient( 135deg, var( --color-surface-1 ) 25%, rgba( 255, 255, 255, 0 ) 25%, rgba( 255, 255, 255, 0 ) 50%, var( --color-surface-1 ) 50%, var( --color-surface-1 ) 75%, rgba( 255, 255, 255, 0 ) 75%, rgba( 255, 255, 255, 0 ) );
 }
 
 .cdx-message {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .cdx-message--warning .cdx-message__icon {
-	color: var(--color-warning);
+	color: var( --color-warning );
 }
 
 .cdx-message--error .cdx-message__icon {
-	color: var(--color-destructive);
+	color: var( --color-destructive );
 }
 
 .cdx-message--success .cdx-message__icon {
-	color: var(--color-success);
+	color: var( --color-success );
 }
 
 .cdx-message--inline {
-	font-weight: var(--font-weight-semibold);
+	font-weight: var( --font-weight-semibold );
 }
 
 .cdx-message--inline.cdx-message--error {
-	color: var(--color-destructive);
+	color: var( --color-destructive );
 }
 
 .cdx-message--inline.cdx-message--success {
-	color: var(--color-success);
+	color: var( --color-success );
 }
 
 .cdx-message--block.cdx-message--notice {
-	border-color: var(--color-surface-2);
-	background-color: var(--color-surface-2);
+	border-color: var( --color-surface-2 );
+	background-color: var( --color-surface-2 );
 }
 
 .cdx-message--block.cdx-message--error {
-	border-color: var(--background-color-destructive);
-	background-color: var(--background-color-destructive);
+	border-color: var( --background-color-destructive );
+	background-color: var( --background-color-destructive );
 }
 
 .cdx-message--block.cdx-message--warning {
-	border-color: var(--background-color-warning);
-	background-color: var(--background-color-warning);
+	border-color: var( --background-color-warning );
+	background-color: var( --background-color-warning );
 }
 
 .cdx-message--block.cdx-message--success {
-	border-color: var(--background-color-success);
-	background-color: var(--background-color-success);
+	border-color: var( --background-color-success );
+	background-color: var( --background-color-success );
 }
 
 .cdx-radio__icon {
-	border-color: var(--border-color-base--darker);
+	border-color: var( --border-color-base--darker );
 	// Show background when hovered
 	background-color: transparent;
 }
 
 .cdx-radio__input:enabled:hover + .cdx-radio__icon {
-	border-color: var(--color-primary--hover);
-	background-color: var(--color-surface-0);
+	border-color: var( --color-primary--hover );
+	background-color: var( --color-surface-0 );
 }
 
 .cdx-radio__input:enabled:active + .cdx-radio__icon {
-	border-color: var(--color-primary--active);
-	background-color: var(--color-primary--active);
+	border-color: var( --color-primary--active );
+	background-color: var( --color-primary--active );
 }
 
 .cdx-radio__input:enabled:checked + .cdx-radio__icon {
-	border-color: var(--color-primary);
+	border-color: var( --color-primary );
 	background-color: #fff;
 }
 
 .cdx-radio__input:enabled:checked:hover + .cdx-radio__icon {
-	border-color: var(--color-primary--hover);
+	border-color: var( --color-primary--hover );
 }
 
 .cdx-radio__input:enabled:checked:active + .cdx-radio__icon {
-	border-color: var(--color-primary--active);
+	border-color: var( --color-primary--active );
 }
 
 .cdx-radio__input:enabled:checked:active + .cdx-radio__icon::before {
-	border-color: var(--color-primary--active);
+	border-color: var( --color-primary--active );
 }
 
 .cdx-radio__input:disabled ~ .cdx-radio__label-content {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .cdx-radio__input:disabled + .cdx-radio__icon {
-	border-color: var(--color-surface-4);
-	background-color: var(--color-surface-4);
+	border-color: var( --color-surface-4 );
+	background-color: var( --color-surface-4 );
 }
 
 /* Styles are already handled by other components */
 .cdx-search-input--has-end-button {
 	border-color: transparent;
-	border-radius: var(--border-radius--small);
+	border-radius: var( --border-radius--small );
 	background-color: transparent;
 }
 
 .cdx-select__handle {
-	border-radius: var(--border-radius--small);
+	border-radius: var( --border-radius--small );
 }
 
 .cdx-select__indicator {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .cdx-select--enabled .cdx-select__handle {
-	border-color: var(--border-color-base--darker);
+	border-color: var( --border-color-base--darker );
 	// Show background when hovered
 	background-color: transparent;
-	color: var(--color-base--emphasized);
+	color: var( --color-base--emphasized );
 }
 
 .cdx-select--enabled .cdx-select__handle:hover {
-	border-color: var(--color-primary--hover);
-	background-color: var(--color-surface-1);
-	color: var(--color-base--emphasized);
+	border-color: var( --color-primary--hover );
+	background-color: var( --color-surface-1 );
+	color: var( --color-base--emphasized );
 }
 
 .cdx-select--enabled .cdx-select__handle:hover .cdx-select__indicator {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .cdx-select--enabled .cdx-select__handle:focus {
-	border-color: var(--color-primary);
-	background-color: var(--color-surface-1);
-	box-shadow: inset 0 0 0 1px var(--color-primary);
+	border-color: var( --color-primary );
+	background-color: var( --color-surface-1 );
+	box-shadow: inset 0 0 0 1px var( --color-primary );
 }
 
 .cdx-select--enabled .cdx-select__handle:active {
-	border-color: var(--border-color-base--darker);
-	background-color: var(--color-surface-1);
-	color: var(--color-base--subtle);
+	border-color: var( --border-color-base--darker );
+	background-color: var( --color-surface-1 );
+	color: var( --color-base--subtle );
 }
 
 .cdx-select--enabled.cdx-select--expanded .cdx-select__handle {
-	background-color: var(--color-surface-1);
+	background-color: var( --color-surface-1 );
 }
 
 .cdx-select--enabled.cdx-select--expanded .cdx-select__handle .cdx-select__indicator {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .cdx-select--disabled .cdx-select__handle {
-	border-color: var(--color-surface-4);
-	background-color: var(--color-surface-4);
-	color: var(--color-base--subtle);
+	border-color: var( --color-surface-4 );
+	background-color: var( --color-surface-4 );
+	color: var( --color-base--subtle );
 }
 
 .cdx-select--disabled .cdx-select__indicator,
 .cdx-select--disabled .cdx-select__start-icon {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
-.cdx-tabs > .cdx-tabs__header:focus .cdx-tabs__list__item--enabled.cdx-tabs__list__item--selected [role='tab'] {
-	box-shadow: inset 0 0 0 2px var(--color-primary);
+.cdx-tabs > .cdx-tabs__header:focus .cdx-tabs__list__item--enabled.cdx-tabs__list__item--selected [ role='tab' ] {
+	box-shadow: inset 0 0 0 2px var( --color-primary );
 }
 
-.cdx-tabs__list__item [role='tab'] {
-	border-top-left-radius: var(--border-radius--small);
-	border-top-right-radius: var(--border-radius--small);
-	font-weight: var(--font-weight-medium);
+.cdx-tabs__list__item [ role='tab' ] {
+	border-top-left-radius: var( --border-radius--small );
+	border-top-right-radius: var( --border-radius--small );
+	font-weight: var( --font-weight-medium );
 }
 
-.cdx-tabs__list__item [role='tab']:focus {
-	border-top-left-radius: var(--border-radius--small);
-	border-top-right-radius: var(--border-radius--small);
+.cdx-tabs__list__item [ role='tab' ]:focus {
+	border-top-left-radius: var( --border-radius--small );
+	border-top-right-radius: var( --border-radius--small );
 }
 
 .cdx-tabs--framed > .cdx-tabs__header {
-	background-color: var(--color-surface-2);
+	background-color: var( --color-surface-2 );
 }
 
 .cdx-tabs--framed > .cdx-tabs__header .cdx-tabs__prev-scroller::after {
-	background-image: linear-gradient(to right, var(--color-surface-2) 0, rgba(255, 255, 255, 0) 100%);
+	background-image: linear-gradient( to right, var( --color-surface-2 ) 0, rgba( 255, 255, 255, 0 ) 100% );
 }
 
 .cdx-tabs--framed > .cdx-tabs__header .cdx-tabs__next-scroller::before {
-	background-image: linear-gradient(to left, var(--color-surface-2) 0, rgba(255, 255, 255, 0) 100%);
+	background-image: linear-gradient( to left, var( --color-surface-2 ) 0, rgba( 255, 255, 255, 0 ) 100% );
 }
 
-.cdx-tabs--framed > .cdx-tabs__header .cdx-tabs__list__item--enabled [role='tab']:link,
-.cdx-tabs--framed > .cdx-tabs__header .cdx-tabs__list__item--enabled [role='tab']:visited {
-	color: var(--color-base--emphasized);
+.cdx-tabs--framed > .cdx-tabs__header .cdx-tabs__list__item--enabled [ role='tab' ]:link,
+.cdx-tabs--framed > .cdx-tabs__header .cdx-tabs__list__item--enabled [ role='tab' ]:visited {
+	color: var( --color-base--emphasized );
 }
 
-.cdx-tabs--framed > .cdx-tabs__header .cdx-tabs__list__item--enabled [role='tab']:hover {
-	background-color: var(--background-color-quiet--hover);
-	color: var(--color-base--emphasized);
+.cdx-tabs--framed > .cdx-tabs__header .cdx-tabs__list__item--enabled [ role='tab' ]:hover {
+	background-color: var( --background-color-quiet--hover );
+	color: var( --color-base--emphasized );
 }
 
-.cdx-tabs--framed > .cdx-tabs__header .cdx-tabs__list__item--enabled [role='tab']:active {
-	background-color: var(--background-color-quiet--active);
-	color: var(--color-base--emphasized);
+.cdx-tabs--framed > .cdx-tabs__header .cdx-tabs__list__item--enabled [ role='tab' ]:active {
+	background-color: var( --background-color-quiet--active );
+	color: var( --color-base--emphasized );
 }
 
-.cdx-tabs--framed > .cdx-tabs__header .cdx-tabs__list__item--enabled.cdx-tabs__list__item--selected [role='tab'],
-.cdx-tabs--framed > .cdx-tabs__header .cdx-tabs__list__item--enabled.cdx-tabs__list__item--selected [role='tab']:hover {
-	background-color: var(--color-surface-0);
+.cdx-tabs--framed > .cdx-tabs__header .cdx-tabs__list__item--enabled.cdx-tabs__list__item--selected [ role='tab' ],
+.cdx-tabs--framed > .cdx-tabs__header .cdx-tabs__list__item--enabled.cdx-tabs__list__item--selected [ role='tab' ]:hover {
+	background-color: var( --color-surface-0 );
 }
 
-.cdx-tabs--framed > .cdx-tabs__header .cdx-tabs__list__item--disabled [role='tab'] {
-	background-color: var(--color-surface-4);
-	color: var(--color-base--subtle);
+.cdx-tabs--framed > .cdx-tabs__header .cdx-tabs__list__item--disabled [ role='tab' ] {
+	background-color: var( --color-surface-4 );
+	color: var( --color-base--subtle );
 }
 
 .cdx-tabs--quiet > .cdx-tabs__header {
-	border-bottom-color: var(--border-color-base);
-	background-color: var(--color-surface-0);
+	border-bottom-color: var( --border-color-base );
+	background-color: var( --color-surface-0 );
 	// Shouldn't quiet tabs be transparent?
 	// background-color: transparent;
 }
 
 .cdx-tabs--quiet > .cdx-tabs__header .cdx-tabs__prev-scroller::after {
-	background-image: linear-gradient(to right, var(--color-surface-0) 0, rgba(255, 255, 255, 0) 100%);
+	background-image: linear-gradient( to right, var( --color-surface-0 ) 0, rgba( 255, 255, 255, 0 ) 100% );
 }
 
 .cdx-tabs--quiet > .cdx-tabs__header .cdx-tabs__next-scroller::before {
-	background-image: linear-gradient(to left, var(--color-surface-0) 0, rgba(255, 255, 255, 0) 100%);
+	background-image: linear-gradient( to left, var( --color-surface-0 ) 0, rgba( 255, 255, 255, 0 ) 100% );
 }
 
-.cdx-tabs--quiet > .cdx-tabs__header .cdx-tabs__list__item--enabled [role='tab'] {
-	color: var(--color-base);
+.cdx-tabs--quiet > .cdx-tabs__header .cdx-tabs__list__item--enabled [ role='tab' ] {
+	color: var( --color-base );
 }
 
-.cdx-tabs--quiet > .cdx-tabs__header .cdx-tabs__list__item--enabled [role='tab']:hover {
-	box-shadow: inset 0 -2px var(--color-primary--hover);
-	color: var(--color-primary--hover);
+.cdx-tabs--quiet > .cdx-tabs__header .cdx-tabs__list__item--enabled [ role='tab' ]:hover {
+	box-shadow: inset 0 -2px var( --color-primary--hover );
+	color: var( --color-primary--hover );
 }
 
-.cdx-tabs--quiet > .cdx-tabs__header .cdx-tabs__list__item--enabled [role='tab']:active {
-	box-shadow: inset 0 -2px var(--color-primary--active);
-	color: var(--color-primary--active);
+.cdx-tabs--quiet > .cdx-tabs__header .cdx-tabs__list__item--enabled [ role='tab' ]:active {
+	box-shadow: inset 0 -2px var( --color-primary--active );
+	color: var( --color-primary--active );
 }
 
-.cdx-tabs--quiet > .cdx-tabs__header .cdx-tabs__list__item--enabled.cdx-tabs__list__item--selected [role='tab'] {
-	box-shadow: inset 0 -2px var(--color-primary);
-	color: var(--color-primary);
+.cdx-tabs--quiet > .cdx-tabs__header .cdx-tabs__list__item--enabled.cdx-tabs__list__item--selected [ role='tab' ] {
+	box-shadow: inset 0 -2px var( --color-primary );
+	color: var( --color-primary );
 }
 
-.cdx-tabs--quiet > .cdx-tabs__header .cdx-tabs__list__item--disabled [role='tab'] {
-	color: var(--color-base--subtle);
+.cdx-tabs--quiet > .cdx-tabs__header .cdx-tabs__list__item--disabled [ role='tab' ] {
+	color: var( --color-base--subtle );
 }
 
 .cdx-toggle-button {
-	border-radius: var(--border-radius--small);
-	font-weight: var(--font-weight-medium);
+	border-radius: var( --border-radius--small );
+	font-weight: var( --font-weight-medium );
 }
 
 .cdx-toggle-button:enabled:focus {
-	border-color: var(--color-primary);
-	box-shadow: inset 0 0 0 1px var(--color-primary);
+	border-color: var( --color-primary );
+	box-shadow: inset 0 0 0 1px var( --color-primary );
 }
 
 .cdx-toggle-button:enabled:active {
-	border-color: var(--border-color-base);
-	color: var(--color-base--emphasized);
+	border-color: var( --border-color-base );
+	color: var( --color-base--emphasized );
 }
 
 .cdx-toggle-button--framed:enabled {
-	border-color: var(--border-color-base);
-	background-color: var(--color-surface-2);
+	border-color: var( --border-color-base );
+	background-color: var( --color-surface-2 );
 }
 
 .cdx-toggle-button--framed:enabled:hover {
-	background-color: var(--color-surface-2--hover);
-	color: var(--color-base--emphasized);
+	background-color: var( --color-surface-2--hover );
+	color: var( --color-base--emphasized );
 }
 
 .cdx-toggle-button--framed:enabled:active {
-	background-color: var(--color-surface-2--active);
-	color: var(--color-base--subtle);
+	background-color: var( --color-surface-2--active );
+	color: var( --color-base--subtle );
 }
 
 .cdx-toggle-button--framed:disabled {
-	border-color: var(--color-surface-4);
-	background-color: var(--color-surface-4);
-	color: var(--color-base--subtle);
+	border-color: var( --color-surface-4 );
+	background-color: var( --color-surface-4 );
+	color: var( --color-base--subtle );
 }
 
 .cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled {
-	border-color: var(--color-primary--active);
-	background-color: var(--color-primary--active);
+	border-color: var( --color-primary--active );
+	background-color: var( --color-primary--active );
 }
 
 .cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled:hover {
-	border-color: var(--color-primary--hover);
-	background-color: var(--color-primary--hover);
+	border-color: var( --color-primary--hover );
+	background-color: var( --color-primary--hover );
 }
 
 .cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled:focus {
-	border-color: var(--color-primary);
-	box-shadow: inset 0 0 0 1px var(--color-primary), inset 0 0 0 2px #fff;
+	border-color: var( --color-primary );
+	box-shadow: inset 0 0 0 1px var( --color-primary ), inset 0 0 0 2px #fff;
 }
 
 .cdx-toggle-button--framed.cdx-toggle-button--toggled-on:enabled:active {
-	border-color: var(--border-color-base);
-	background-color: var(--color-surface-2--active);
-	color: var(--color-base--emphasized);
+	border-color: var( --border-color-base );
+	background-color: var( --color-surface-2--active );
+	color: var( --color-base--emphasized );
 }
 
 .cdx-toggle-button--quiet:enabled.cdx-toggle-button--toggled-on {
-	background-color: var(--background-color-quiet--active);
+	background-color: var( --background-color-quiet--active );
 }
 
 .cdx-toggle-button--quiet:enabled:hover {
-	background-color: var(--background-color-quiet--hover);
+	background-color: var( --background-color-quiet--hover );
 }
 
 .cdx-toggle-button--quiet:enabled:focus {
-	background-color: var(--background-color-quiet--hover);
+	background-color: var( --background-color-quiet--hover );
 }
 
 .cdx-toggle-button--quiet:enabled:active {
-	background-color: var(--background-color-quiet--active);
+	background-color: var( --background-color-quiet--active );
 }
 
 .cdx-toggle-button--quiet:disabled {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .cdx-toggle-button-group {
-	border-radius: var(--border-radius--small);
+	border-radius: var( --border-radius--small );
 }
 
 .cdx-toggle-button-group .cdx-toggle-button:disabled {
-	box-shadow: 0 -1px var(--border-color-base), -1px 0 var(--border-color-base);
+	box-shadow: 0 -1px var( --border-color-base ), -1px 0 var( --border-color-base );
 }
 
 .cdx-toggle-button-group .cdx-toggle-button--toggled-on:enabled {
-	box-shadow: 0 -1px var(--border-color-base), -1px 0 var(--border-color-base);
+	box-shadow: 0 -1px var( --border-color-base ), -1px 0 var( --border-color-base );
 }
 
 .cdx-toggle-switch__switch {
-	border-color: var(--border-color-base--darker);
+	border-color: var( --border-color-base--darker );
 	// Show background when hovered
 	background-color: transparent;
 }
 
 .cdx-toggle-switch__switch__grip {
-	border-color: var(--border-color-base--darker);
+	border-color: var( --border-color-base--darker );
 }
 
 .cdx-toggle-switch__input:enabled ~ .cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip {
@@ -773,92 +773,92 @@
 }
 
 .cdx-toggle-switch__input:enabled:hover ~ .cdx-toggle-switch__switch {
-	border-color: var(--color-primary--hover);
-	background-color: var(--color-surface-0);
+	border-color: var( --color-primary--hover );
+	background-color: var( --color-surface-0 );
 }
 
 .cdx-toggle-switch__input:enabled:hover ~ .cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip {
-	border-color: var(--color-primary--hover);
+	border-color: var( --color-primary--hover );
 }
 
 .cdx-toggle-switch__input:enabled:active ~ .cdx-toggle-switch__switch {
-	border-color: var(--color-primary--active);
-	background-color: var(--color-primary--active);
+	border-color: var( --color-primary--active );
+	background-color: var( --color-primary--active );
 }
 
 .cdx-toggle-switch__input:enabled:active ~ .cdx-toggle-switch__switch::before {
-	border-color: var(--color-primary--active);
+	border-color: var( --color-primary--active );
 }
 
-.cdx-toggle-switch__input:enabled:focus:not(:active) ~ .cdx-toggle-switch__switch {
-	border-color: var(--color-primary);
-	box-shadow: inset 0 0 0 1px var(--color-primary);
+.cdx-toggle-switch__input:enabled:focus:not( :active ) ~ .cdx-toggle-switch__switch {
+	border-color: var( --color-primary );
+	box-shadow: inset 0 0 0 1px var( --color-primary );
 }
 
-.cdx-toggle-switch__input:enabled:focus:not(:active) ~ .cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip {
-	border-color: var(--color-primary);
+.cdx-toggle-switch__input:enabled:focus:not( :active ) ~ .cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip {
+	border-color: var( --color-primary );
 }
 
 .cdx-toggle-switch__input:enabled:checked ~ .cdx-toggle-switch__switch {
-	border-color: var(--color-primary);
-	background-color: var(--color-primary);
+	border-color: var( --color-primary );
+	background-color: var( --color-primary );
 }
 
 .cdx-toggle-switch__input:enabled:checked:hover ~ .cdx-toggle-switch__switch {
-	border-color: var(--color-primary--hover);
-	background-color: var(--color-primary--hover);
+	border-color: var( --color-primary--hover );
+	background-color: var( --color-primary--hover );
 }
 
 .cdx-toggle-switch__input:enabled:checked:active ~ .cdx-toggle-switch__switch {
-	border-color: var(--color-primary--active);
-	background-color: var(--color-primary--active);
-	box-shadow: inset 0 0 0 1px var(--color-primary--active);
+	border-color: var( --color-primary--active );
+	background-color: var( --color-primary--active );
+	box-shadow: inset 0 0 0 1px var( --color-primary--active );
 }
 
 .cdx-toggle-switch__input:enabled:checked:active ~ .cdx-toggle-switch__switch::before {
-	border-color: var(--color-primary--active);
+	border-color: var( --color-primary--active );
 }
 
-.cdx-toggle-switch__input:enabled:checked:focus:not(:active) ~ .cdx-toggle-switch__switch {
-	border-color: var(--color-primary);
+.cdx-toggle-switch__input:enabled:checked:focus:not( :active ) ~ .cdx-toggle-switch__switch {
+	border-color: var( --color-primary );
 }
 
 .cdx-toggle-switch__input:disabled ~ .cdx-toggle-switch__label {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .cdx-toggle-switch__input:disabled ~ .cdx-toggle-switch__switch {
-	border-color: var(--color-surface-4);
-	background-color: var(--color-surface-4);
+	border-color: var( --color-surface-4 );
+	background-color: var( --color-surface-4 );
 }
 
 .cdx-toggle-switch__input:disabled ~ .cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip {
-	border-color: var(--color-base--subtle);
-	box-shadow: inset 0 0 0 1px var(--color-base--subtle);
+	border-color: var( --color-base--subtle );
+	box-shadow: inset 0 0 0 1px var( --color-base--subtle );
 }
 
 .cdx-toggle-switch__input:disabled:checked ~ .cdx-toggle-switch__switch .cdx-toggle-switch__switch__grip {
-	background-color: var(--color-base--subtle);
+	background-color: var( --color-base--subtle );
 }
 
 .cdx-typeahead-search__menu-message,
 .cdx-typeahead-search__search-footer {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .cdx-typeahead-search__search-footer {
-	border-top-color: var(--border-color-base);
+	border-top-color: var( --border-color-base );
 }
 
 .cdx-typeahead-search__search-footer:visited {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .cdx-typeahead-search__search-footer__icon {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .cdx-typeahead-search__search-footer__active .cdx-typeahead-search__search-footer__icon,
 .cdx-typeahead-search__search-footer__active .cdx-typeahead-search__search-footer__text {
-	color: var(--color-primary);
+	color: var( --color-primary );
 }
diff --git a/skinStyles/extensions/AJAXPoll/ext.ajaxpoll.less b/skinStyles/extensions/AJAXPoll/ext.ajaxpoll.less
index 958571ad..4034266f 100644
--- a/skinStyles/extensions/AJAXPoll/ext.ajaxpoll.less
+++ b/skinStyles/extensions/AJAXPoll/ext.ajaxpoll.less
@@ -11,30 +11,30 @@
 .ajaxpoll {
 	/* Responsive to container */
 	width: auto;
-	padding: var(--space-xl);
+	padding: var( --space-xl );
 	border-color: transparent;
-	border-radius: var(--border-radius--medium);
+	border-radius: var( --border-radius--medium );
 	background-color: transparent;
 }
 
 .ajaxpoll .ajaxpoll-question {
-	color: var(--color-base--emphasized);
-	font-weight: var(--font-weight-semibold);
+	color: var( --color-base--emphasized );
+	font-weight: var( --font-weight-semibold );
 }
 
 .ajaxpoll .ajaxpoll-answer-name,
 .ajaxpoll-answer-name-revoke {
-	margin-top: var(--space-xs);
+	margin-top: var( --space-xs );
 	font-size: 0.875rem;
 }
 
 .ajaxpoll .ajaxpoll-hover-vote {
-	background: var(--color-destructive);
+	background: var( --color-destructive );
 	color: #fff;
 }
 
 .ajaxpoll .ajaxpoll-hover-revoke {
-	background-color: var(--color-surface-2--hover);
+	background-color: var( --color-surface-2--hover );
 }
 
 .ajaxpoll .ajaxpoll-answer-vote {
@@ -43,10 +43,10 @@
 	overflow: hidden;
 	height: 2rem;
 	border: 0;
-	border-top: 1px solid var(--border-color-base);
-	background-color: var(--color-surface-3);
-	border-bottom-left-radius: var(--border-radius--medium);
-	border-bottom-right-radius: var(--border-radius--medium);
+	border-top: 1px solid var( --border-color-base );
+	background-color: var( --color-surface-3 );
+	border-bottom-left-radius: var( --border-radius--medium );
+	border-bottom-right-radius: var( --border-radius--medium );
 	font-size: 0.8125rem;
 	place-content: center;
 }
@@ -56,35 +56,35 @@
 	height: auto;
 	box-sizing: border-box;
 	border-right: 0;
-	border-right: 2px solid var(--border-color-base);
-	background: var(--color-surface-2);
+	border-right: 2px solid var( --border-color-base );
+	background: var( --color-surface-2 );
 }
 
 .ajaxpoll .ajaxpoll-our-vote div {
 	top: 0;
 	left: 0;
 	border: 0;
-	border-right: 2px solid var(--color-primary);
-	background-color: var(--background-color-primary--active);
+	border-right: 2px solid var( --color-primary );
+	background-color: var( --background-color-primary--active );
 }
 
 .ajaxpoll .ajaxpoll-answer-vote span {
 	position: initial;
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .ajaxpoll label {
 	display: block;
-	padding: var(--space-xs);
-	background-color: var(--color-surface-2);
-	border-top-left-radius: var(--border-radius--medium);
-	border-top-right-radius: var(--border-radius--medium);
+	padding: var( --space-xs );
+	background-color: var( --color-surface-2 );
+	border-top-left-radius: var( --border-radius--medium );
+	border-top-right-radius: var( --border-radius--medium );
 	cursor: pointer;
-	font-weight: var(--font-weight-medium);
+	font-weight: var( --font-weight-medium );
 
 	// Added active state
 	&:active {
-		background-color: var(--color-surface-2--active);
+		background-color: var( --color-surface-2--active );
 	}
 }
 
@@ -93,20 +93,20 @@
 }
 
 .ajaxpoll .ajaxpoll-checkevent {
-	background: var(--color-success);
+	background: var( --color-success );
 	color: #fff;
 }
 
 .ajaxpoll .ajaxpoll-misc {
 	margin-bottom: 10px;
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .ajaxpoll .ajaxpoll-ajax {
-	padding: var(--space-xs) var(--space-md);
-	border-radius: var(--border-radius--small);
-	margin-bottom: var(--space-md);
-	background: var(--color-surface-2);
+	padding: var( --space-xs ) var( --space-md );
+	border-radius: var( --border-radius--small );
+	margin-bottom: var( --space-md );
+	background: var( --color-surface-2 );
 	font-size: 0.8125rem;
 }
 
@@ -114,12 +114,12 @@
 	display: flex;
 	flex-wrap: wrap;
 	justify-content: space-between;
-	margin-top: var(--space-md);
-	color: var(--color-base--subtle);
+	margin-top: var( --space-md );
+	color: var( --color-base--subtle );
 	font-size: 0.8125rem;
 }
 
 .ajaxpoll .ajaxpoll-id-info {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 	float: none;
 }
diff --git a/skinStyles/extensions/AdvancedSearch/ext.advancedSearch.initialstyles.less b/skinStyles/extensions/AdvancedSearch/ext.advancedSearch.initialstyles.less
index bfdaa314..33006331 100644
--- a/skinStyles/extensions/AdvancedSearch/ext.advancedSearch.initialstyles.less
+++ b/skinStyles/extensions/AdvancedSearch/ext.advancedSearch.initialstyles.less
@@ -21,7 +21,7 @@
 		&::before,
 		&::after,
 		& .mw-search-spinner-bounce {
-			background-color: var(--color-base--subtle);
+			background-color: var( --color-base--subtle );
 		}
 	}
 }
diff --git a/skinStyles/extensions/AdvancedSearch/ext.advancedSearch.styles.less b/skinStyles/extensions/AdvancedSearch/ext.advancedSearch.styles.less
index a62af97f..6c1056d6 100644
--- a/skinStyles/extensions/AdvancedSearch/ext.advancedSearch.styles.less
+++ b/skinStyles/extensions/AdvancedSearch/ext.advancedSearch.styles.less
@@ -9,37 +9,37 @@
 */
 
 .mw-advancedSearch-container {
-	border-bottom: 1px solid var(--border-color-base);
-	margin-top: var(--space-xs);
+	border-bottom: 1px solid var( --border-color-base );
+	margin-top: var( --space-xs );
 }
 
 // Align with Citizen label styles
 .mw-advancedSearch-searchPreview-label,
 .advancedsearch-namespacesPreview-label {
-	margin-right: var(--space-xs);
-	color: var(--color-base--subtle);
+	margin-right: var( --space-xs );
+	color: var( --color-base--subtle );
 	font-size: 0.875rem;
-	font-weight: var(--font-weight-normal);
+	font-weight: var( --font-weight-normal );
 	letter-spacing: 0.05em;
 }
 
 .mw-advancedSearch-fieldContainer {
 	max-width: none;
 	border: 0;
-	border-radius: var(--border-radius--small);
+	border-radius: var( --border-radius--small );
 	margin-top: 0;
-	background: var(--color-surface-2);
+	background: var( --color-surface-2 );
 
 	fieldset {
-		border-top-color: var(--border-color-base);
-		margin-top: var(--space-md);
+		border-top-color: var( --border-color-base );
+		margin-top: var( --space-md );
 	}
 
 	.oo-ui-labelElement > .oo-ui-fieldsetLayout-header > .oo-ui-labelElement-label {
-		background: var(--color-surface-2);
-		color: var(--color-base--subtle);
+		background: var( --color-surface-2 );
+		color: var( --color-base--subtle );
 		font-size: 0.875rem;
-		font-weight: var(--font-weight-normal);
+		font-weight: var( --font-weight-normal );
 		letter-spacing: 0.05em;
 	}
 }
@@ -58,13 +58,13 @@
 			background-color: transparent;
 
 			&:hover {
-				background-color: var(--background-color-quiet--hover);
+				background-color: var( --background-color-quiet--hover );
 				color: inherit;
 			}
 
 			// Added active state
 			&:active {
-				background-color: var(--background-color-quiet--active);
+				background-color: var( --background-color-quiet--active );
 			}
 
 			// HACK: Flip indicator when expanded
@@ -72,9 +72,9 @@
 				transition: opacity 100ms, transform 250ms ease;
 			}
 
-			&[aria-expanded='true'] {
+			&[ aria-expanded='true' ] {
 				.oo-ui-indicator-down {
-					transform: rotate3d(1, 0, 0, 180deg);
+					transform: rotate3d( 1, 0, 0, 180deg );
 				}
 			}
 		}
@@ -87,20 +87,20 @@
 
 .mw-advancedSearch-namespace-selection-header {
 	> .mw-advancedSearch-namespace-search-in-label {
-		font-weight: var(--font-weight-semibold);
+		font-weight: var( --font-weight-semibold );
 	}
 }
 
 .mw-advancedSearch-namespace-selection {
 	max-width: none;
 	border: 0;
-	border-radius: var(--border-radius--small);
+	border-radius: var( --border-radius--small );
 	margin-top: 0;
-	background: var(--color-surface-2);
+	background: var( --color-surface-2 );
 }
 
 .mw-advancedSearch-namespace-border {
-	border-top: 1px solid var(--border-color-base);
+	border-top: 1px solid var( --border-color-base );
 	border-bottom: 0;
 }
 
@@ -109,20 +109,20 @@
 }
 
 .mw-advancedSearch-namespaceFilter .oo-ui-tagMultiselectWidget-handle {
-	border-radius: 0 0 var(--border-radius--small) var(--border-radius--small);
+	border-radius: 0 0 var( --border-radius--small ) var( --border-radius--small );
 }
 
 .mw-advancedSearch-namespaceFilter .oo-ui-tagMultiselectWidget-input .oo-ui-inputWidget-input {
-	background-color: var(--color-surface-0);
+	background-color: var( --color-surface-0 );
 }
 
 .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined .oo-ui-tagItemWidget.oo-ui-widget-enabled {
 	&.selected {
-		border-color: var(--color-primary);
-		background-color: var(--background-color-primary--hover);
+		border-color: var( --color-primary );
+		background-color: var( --background-color-primary--hover );
 	}
 }
 
 .oo-ui-popupWidget-popup .mw-advancedSearch-tooltip-head {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
diff --git a/skinStyles/extensions/ApprovedRevs/ext.ApprovedRevs.less b/skinStyles/extensions/ApprovedRevs/ext.ApprovedRevs.less
index 41664cd1..8e5069f1 100644
--- a/skinStyles/extensions/ApprovedRevs/ext.ApprovedRevs.less
+++ b/skinStyles/extensions/ApprovedRevs/ext.ApprovedRevs.less
@@ -3,6 +3,6 @@
 	 * Highlight approved rev in revision history
 	 **/
 	.approved-revision {
-		background-color: var(--background-color-success) !important;
+		background-color: var( --background-color-success ) !important;
 	}
 }
diff --git a/skinStyles/extensions/Babel/ext.babel.less b/skinStyles/extensions/Babel/ext.babel.less
index 86ad3883..de8a25fc 100644
--- a/skinStyles/extensions/Babel/ext.babel.less
+++ b/skinStyles/extensions/Babel/ext.babel.less
@@ -9,7 +9,7 @@
 */
 
 .mw-babel-wrapper {
-	border-color: var(--border-color-base);
-	background-color: var(--color-surface-2);
+	border-color: var( --border-color-base );
+	background-color: var( --color-surface-2 );
 	color: #202122; // Easier to just hardcode it
 }
diff --git a/skinStyles/extensions/Capiunto/capiunto.infobox.main.less b/skinStyles/extensions/Capiunto/capiunto.infobox.main.less
index 7d13705e..eeb8d9b2 100644
--- a/skinStyles/extensions/Capiunto/capiunto.infobox.main.less
+++ b/skinStyles/extensions/Capiunto/capiunto.infobox.main.less
@@ -9,7 +9,7 @@
 */
 
 .mw-capiunto-infobox {
-	border-color: var(--border-color-base);
-	background-color: var(--color-surface-2);
-	color: var(--color-base);
+	border-color: var( --border-color-base );
+	background-color: var( --color-surface-2 );
+	color: var( --color-base );
 }
diff --git a/skinStyles/extensions/Cargo/ext.cargo.main.less b/skinStyles/extensions/Cargo/ext.cargo.main.less
index 0179d7b0..b6b2be73 100644
--- a/skinStyles/extensions/Cargo/ext.cargo.main.less
+++ b/skinStyles/extensions/Cargo/ext.cargo.main.less
@@ -9,15 +9,15 @@
 */
 
 span.cargoFieldName {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
-table.cargoTable.noMerge tr:nth-child(odd) {
+table.cargoTable.noMerge tr:nth-child( odd ) {
 	background: transparent;
 }
 
-table.cargoTable.noMerge tr:nth-child(even) {
-	background: var(--background-color-quiet--hover);
+table.cargoTable.noMerge tr:nth-child( even ) {
+	background: var( --background-color-quiet--hover );
 }
 
 table.cargoTable.mergeSimilarCells td.odd {
@@ -25,42 +25,42 @@ table.cargoTable.mergeSimilarCells td.odd {
 }
 
 table.cargoTable.mergeSimilarCells td.even {
-	background: var(--background-color-quiet--hover);
+	background: var( --background-color-quiet--hover );
 }
 
 table.cargoTable td {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 }
 
 div.cargoReplacementTableInfo {
-	border-color: var(--border-color-base);
-	background: var(--color-surface-3);
+	border-color: var( --border-color-base );
+	background: var( --color-surface-3 );
 }
 
 .addButton {
-	border-color: var(--border-color-base);
-	background-color: var(--color-surface-2);
+	border-color: var( --border-color-base );
+	background-color: var( --color-surface-2 );
 }
 
 .deleteButton {
-	border-color: var(--border-color-base);
-	background-color: var(--color-surface-2);
+	border-color: var( --border-color-base );
+	background-color: var( --color-surface-2 );
 }
 
 div.specialCargoQuery-extraPane {
-	border-color: var(--border-color-base);
-	background: linear-gradient(transparent, var(--color-surface-2) 0.5em);
+	border-color: var( --border-color-base );
+	background: linear-gradient( transparent, var( --color-surface-2 ) 0.5em );
 }
 
 .ui-state-focus {
-	background: var(--color-primary--active) !important;
+	background: var( --color-primary--active ) !important;
 }
 
 .ui-menu .ui-menu-item a {
-	color: var(--color-base--emphasized);
+	color: var( --color-base--emphasized );
 }
 
 table.cargo-tablelist.mw-datatable tr.cargo-tablelist-replacement-row:hover td,
 .cargo-tablelist-replacement-row > td {
-	background-color: var(--background-color-quiet--hover);
+	background-color: var( --background-color-quiet--hover );
 }
diff --git a/skinStyles/extensions/CategoryTree/ext.categoryTree.css.less b/skinStyles/extensions/CategoryTree/ext.categoryTree.css.less
index 2eaffca2..97eba6e5 100644
--- a/skinStyles/extensions/CategoryTree/ext.categoryTree.css.less
+++ b/skinStyles/extensions/CategoryTree/ext.categoryTree.css.less
@@ -7,5 +7,5 @@
 .CategoryTreeEmptyBullet,
 .CategoryTreeBullet {
 	/* Fix skewed toggle caused by Roboto */
-	font-family: var(--fonts-sans);
+	font-family: var( --fonts-sans );
 }
diff --git a/skinStyles/extensions/Cite/ext.cite.styles.less b/skinStyles/extensions/Cite/ext.cite.styles.less
index 86354e4c..66f2a2fe 100644
--- a/skinStyles/extensions/Cite/ext.cite.styles.less
+++ b/skinStyles/extensions/Cite/ext.cite.styles.less
@@ -6,17 +6,17 @@
 @import '../../../resources/variables.less';
 
 .mw-references-wrap {
-	margin-top: var(--space-md);
-	color: var(--color-base);
+	margin-top: var( --space-md );
+	color: var( --color-base );
 	font-size: 0.875rem;
 }
 
 .mw-body-content {
 	.references {
-		margin: 0 var(--space-xl);
+		margin: 0 var( --space-xl );
 
 		li {
-			margin-bottom: var(--space-xxs);
+			margin-bottom: var( --space-xxs );
 		}
 	}
 }
@@ -28,6 +28,6 @@ span.reference {
 .skin-citizen {
 	ol.references li:target,
 	sup.reference:target {
-		background-color: var(--background-color-primary--hover);
+		background-color: var( --background-color-primary--hover );
 	}
 }
diff --git a/skinStyles/extensions/CleanChanges/ext.cleanchanges.uls.less b/skinStyles/extensions/CleanChanges/ext.cleanchanges.uls.less
index c4827b2c..09fa495c 100644
--- a/skinStyles/extensions/CleanChanges/ext.cleanchanges.uls.less
+++ b/skinStyles/extensions/CleanChanges/ext.cleanchanges.uls.less
@@ -9,9 +9,9 @@
 */
 
 .ext-cc-language-selector__trigger {
-	color: var(--color-primary);
+	color: var( --color-primary );
 }
 
 .ext-cc-language-selector__trigger::after {
-	border-top-color: var(--color-primary);
+	border-top-color: var( --color-primary );
 }
diff --git a/skinStyles/extensions/CookieWarning/ext.CookieWarning.styles.less b/skinStyles/extensions/CookieWarning/ext.CookieWarning.styles.less
index c64a58df..3c67db02 100644
--- a/skinStyles/extensions/CookieWarning/ext.CookieWarning.styles.less
+++ b/skinStyles/extensions/CookieWarning/ext.CookieWarning.styles.less
@@ -16,19 +16,19 @@
 	max-width: @width-breakpoint-tablet;
 	align-items: center;
 	justify-content: space-between;
-	padding: 0 var(--padding-page);
-	border-radius: var(--border-radius--large);
+	padding: 0 var( --padding-page );
+	border-radius: var( --border-radius--large );
 	margin: 10px;
 	background-color: #343a40; // dark base 70
-	box-shadow: var(--box-shadow-dialog);
+	box-shadow: var( --box-shadow-dialog );
 	font-size: 0.875rem;
-	line-height: var(--line-height-sm);
+	line-height: var( --line-height-sm );
 
 	.mw-cookiewarning-text {
 		padding: 20px 0;
 		margin-bottom: 0; // Override media styles
 		font-size: inherit;
-		font-weight: var(--font-weight-medium);
+		font-weight: var( --font-weight-medium );
 	}
 
 	form {
@@ -37,7 +37,7 @@
 	}
 }
 
-@media only screen and (max-width: @width-breakpoint-tablet) {
+@media only screen and ( max-width: @width-breakpoint-tablet ) {
 	.mw-cookiewarning-container {
 		flex-wrap: wrap;
 
diff --git a/skinStyles/extensions/DiscussionTools/ext.discussionTools.ReplyWidget.less b/skinStyles/extensions/DiscussionTools/ext.discussionTools.ReplyWidget.less
index 9582803d..23d56076 100644
--- a/skinStyles/extensions/DiscussionTools/ext.discussionTools.ReplyWidget.less
+++ b/skinStyles/extensions/DiscussionTools/ext.discussionTools.ReplyWidget.less
@@ -12,16 +12,16 @@
 
 .dt-ui-replyWidget {
 	&-footer {
-		color: var(--color-base--subtle);
+		color: var( --color-base--subtle );
 	}
 
 	&-preview {
-		border-radius: 0 0 var(--border-radius--medium) var(--border-radius--medium);
-		background: var(--color-surface-2);
+		border-radius: 0 0 var( --border-radius--medium ) var( --border-radius--medium );
+		background: var( --color-surface-2 );
 	}
 }
 
-@media only screen and (max-width: @width-breakpoint-tablet) {
+@media only screen and ( max-width: @width-breakpoint-tablet ) {
 	.dt-ui-replyWidget {
 		// HACK: Make the toolbar two line on mobile
 		// So that they are not overlapping
diff --git a/skinStyles/extensions/DiscussionTools/ext.discussionTools.init.less b/skinStyles/extensions/DiscussionTools/ext.discussionTools.init.less
index 1e2ce5fb..d4b464cb 100644
--- a/skinStyles/extensions/DiscussionTools/ext.discussionTools.init.less
+++ b/skinStyles/extensions/DiscussionTools/ext.discussionTools.init.less
@@ -15,11 +15,11 @@
 	justify-content: space-between;
 
 	.mw-headline {
-		font-family: var(--fonts-serif);
+		font-family: var( --fonts-serif );
 	}
 }
 
-@media (max-width: @width-breakpoint-tablet) {
+@media ( max-width: @width-breakpoint-tablet ) {
 	.ext-discussiontools-init-section .mw-headline {
 		flex: 1 0 100% !important;
 	}
@@ -52,12 +52,12 @@
 	.dt-init-replylink {
 		// Similar to mw-editsection-bracket
 		&-bracket {
-			color: var(--color-base--subtle);
+			color: var( --color-base--subtle );
 		}
 	}
 
 	.dt-init-replylink-open & > a {
-		color: var(--color-base--subtle);
+		color: var( --color-base--subtle );
 	}
 }
 
diff --git a/skinStyles/extensions/DismissableSiteNotice/ext.dismissableSiteNotice.less b/skinStyles/extensions/DismissableSiteNotice/ext.dismissableSiteNotice.less
index 37a056dc..88375b07 100644
--- a/skinStyles/extensions/DismissableSiteNotice/ext.dismissableSiteNotice.less
+++ b/skinStyles/extensions/DismissableSiteNotice/ext.dismissableSiteNotice.less
@@ -12,7 +12,7 @@
 
 				&::before {
 					display: block;
-					color: var(--color-base);
+					color: var( --color-base );
 					content: '\00d7'; // close icon
 					font-size: 24px;
 					line-height: 1;
@@ -22,13 +22,13 @@
 
 				&:hover {
 					&::before {
-						color: var(--color-base--emphasized);
+						color: var( --color-base--emphasized );
 					}
 				}
 
 				&:active {
 					&::before {
-						color: var(--color-base--subtle);
+						color: var( --color-base--subtle );
 					}
 				}
 			}
@@ -37,7 +37,7 @@
 		&-body {
 			// Default has top and bottom margin
 			// So bottom margin is added to respect it
-			margin: 0 0 var(--space-md) 0;
+			margin: 0 0 var( --space-md ) 0;
 		}
 	}
 }
diff --git a/skinStyles/extensions/Echo/ext.echo.special.less b/skinStyles/extensions/Echo/ext.echo.special.less
index 1df8a1db..d059aedf 100644
--- a/skinStyles/extensions/Echo/ext.echo.special.less
+++ b/skinStyles/extensions/Echo/ext.echo.special.less
@@ -12,7 +12,7 @@
 .mw-echo-ui-datedSubGroupListWidget {
 	.mw-body-content &-title {
 		&-secondary {
-			color: var(--color-base--subtle);
+			color: var( --color-base--subtle );
 		}
 	}
 }
@@ -20,7 +20,7 @@
 /* mw.echo.ui.NotificationsInboxWidget.less */
 .mw-echo-ui-notificationsInboxWidget {
 	&-toolbarWrapper {
-		background: var(--color-surface-0);
+		background: var( --color-surface-0 );
 	}
 }
 
@@ -28,37 +28,37 @@
 .mw-echo-ui-pageNotificationsOptionWidget {
 	&.oo-ui-optionWidget {
 		&-highlighted {
-			background-color: var(--color-surface-3);
-			color: var(--color-base--emphasized);
+			background-color: var( --color-surface-3 );
+			color: var( --color-base--emphasized );
 		}
 
 		&-selected {
-			background-color: var(--background-color-primary);
-			color: var(--color-primary);
+			background-color: var( --background-color-primary );
+			color: var( --color-primary );
 		}
 
 		&-selected&-highlighted,
 		&-pressed&-highlighted {
-			background-color: var(--background-color-primary--hover);
-			color: var(--color-primary--hover);
+			background-color: var( --background-color-primary--hover );
+			color: var( --color-primary--hover );
 		}
 	}
 
 	&-label-count {
-		background-color: var(--color-surface-3);
-		color: var(--color-base--subtle);
+		background-color: var( --color-surface-3 );
+		color: var( --color-base--subtle );
 
 		.oo-ui-optionWidget-selected & {
-			color: var(--color-primary);
+			color: var( --color-primary );
 		}
 	}
 }
 
 /* mw.echo.ui.CrossWikiUnreadFilterWidget.less */
 .mw-echo-ui-crossWikiUnreadFilterWidget {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 
 	&-subtitle {
-		color: var(--color-base--subtle);
+		color: var( --color-base--subtle );
 	}
 }
diff --git a/skinStyles/extensions/Echo/ext.echo.styles.alert.less b/skinStyles/extensions/Echo/ext.echo.styles.alert.less
index 37741c12..1946b2b1 100644
--- a/skinStyles/extensions/Echo/ext.echo.styles.alert.less
+++ b/skinStyles/extensions/Echo/ext.echo.styles.alert.less
@@ -9,6 +9,6 @@
 */
 
 .mw-echo-alert {
-	background-color: var(--color-warning);
-	color: var(--color-base--emphasized);
+	background-color: var( --color-warning );
+	color: var( --color-base--emphasized );
 }
diff --git a/skinStyles/extensions/Echo/ext.echo.styles.badge.less b/skinStyles/extensions/Echo/ext.echo.styles.badge.less
index ca7b499b..1fa9bfdf 100644
--- a/skinStyles/extensions/Echo/ext.echo.styles.badge.less
+++ b/skinStyles/extensions/Echo/ext.echo.styles.badge.less
@@ -12,54 +12,54 @@
 	#pt-notifications-alert &,
 	#pt-notifications-notice & {
 		top: 0;
-		width: var(--header-button-size);
-		height: var(--header-button-size);
+		width: var( --header-button-size );
+		height: var( --header-button-size );
 		box-sizing: content-box;
-		border-radius: var(--border-radius--small);
+		border-radius: var( --border-radius--small );
 		margin: 0;
 		background-position: center;
 		background-repeat: no-repeat;
-		background-size: var(--header-icon-size);
-		opacity: var(--opacity-icon-base);
+		background-size: var( --header-icon-size );
+		opacity: var( --opacity-icon-base );
 
 		&:hover {
-			opacity: var(--opacity-icon-base--hover);
+			opacity: var( --opacity-icon-base--hover );
 		}
 
 		&:active {
-			opacity: var(--opacity-icon-base--active);
+			opacity: var( --opacity-icon-base--active );
 		}
 
 		&:focus {
-			box-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--color-primary);
-			opacity: var(--opacity-icon-base--active);
+			box-shadow: 0 0 0 1px #fff, 0 0 0 3px var( --color-primary );
+			opacity: var( --opacity-icon-base--active );
 
 			&::after {
-				border-color: var(--color-primary);
+				border-color: var( --color-primary );
 			}
 		}
 
 		&::after {
 			top: 0;
-			border-color: var(--color-destructive);
-			border-radius: var(--border-radius--pill);
-			background-color: var(--color-destructive);
+			border-color: var( --color-destructive );
+			border-radius: var( --border-radius--pill );
+			background-color: var( --color-destructive );
 			font-size: 0.65rem;
 		}
 
 		&-dimmed {
-			opacity: var(--opacity-icon-base--disabled);
+			opacity: var( --opacity-icon-base--disabled );
 		}
 
 		&.mw-echo-notifications-badge-all-read {
-			opacity: var(--opacity-icon-base);
+			opacity: var( --opacity-icon-base );
 
 			&:hover {
-				opacity: var(--opacity-icon-base--hover);
+				opacity: var( --opacity-icon-base--hover );
 			}
 
 			&:active {
-				opacity: var(--opacity-icon-base--active);
+				opacity: var( --opacity-icon-base--active );
 			}
 		}
 	}
@@ -67,11 +67,11 @@
 	&.oo-ui-flaggedElement-unseen,
 	&.mw-echo-unseen-notifications {
 		#pt-notifications-alert &::after {
-			background-color: var(--color-destructive);
+			background-color: var( --color-destructive );
 		}
 
 		#pt-notifications-notice &::after {
-			background-color: var(--color-destructive);
+			background-color: var( --color-destructive );
 		}
 	}
 }
@@ -80,13 +80,13 @@
 #pt-notifications-alert,
 #pt-notifications-notice {
 	z-index: 1; // fix background clipping
-	border-radius: var(--border-radius--small);
+	border-radius: var( --border-radius--small );
 
 	&:hover {
-		background-color: var(--background-color-quiet--hover);
+		background-color: var( --background-color-quiet--hover );
 	}
 
 	&:active {
-		background-color: var(--background-color-quiet--active);
+		background-color: var( --background-color-quiet--active );
 	}
 }
diff --git a/skinStyles/extensions/Echo/ext.echo.styles.notifications.less b/skinStyles/extensions/Echo/ext.echo.styles.notifications.less
index b48d77bc..8e659c5a 100644
--- a/skinStyles/extensions/Echo/ext.echo.styles.notifications.less
+++ b/skinStyles/extensions/Echo/ext.echo.styles.notifications.less
@@ -11,25 +11,25 @@
 /* mw.echo.notifications.less */
 .mw-echo-state {
 	.mw-echo-notification {
-		background-color: var(--color-surface-0);
-		color: var(--color-base--subtle);
+		background-color: var( --color-surface-0 );
+		color: var( --color-base--subtle );
 	}
 
 	.mw-echo-notifications {
-		background-color: var(--color-surface-1);
+		background-color: var( --color-surface-1 );
 	}
 
 	.mw-echo-content {
 		.mw-echo-title {
-			color: var(--color-base--emphasized);
+			color: var( --color-base--emphasized );
 		}
 
 		.mw-echo-payload {
-			color: var(--color-base--subtle);
+			color: var( --color-base--subtle );
 		}
 
 		.mw-echo-notification-footer {
-			color: var(--color-base--subtle);
+			color: var( --color-base--subtle );
 		}
 	}
 }
diff --git a/skinStyles/extensions/Echo/ext.echo.styles.special.less b/skinStyles/extensions/Echo/ext.echo.styles.special.less
index a064c8c7..131e1963 100644
--- a/skinStyles/extensions/Echo/ext.echo.styles.special.less
+++ b/skinStyles/extensions/Echo/ext.echo.styles.special.less
@@ -9,38 +9,38 @@
 */
 
 .mw-echo-date-section {
-	border-bottom-color: var(--border-color-base);
-	color: var(--color-base--subtle);
+	border-bottom-color: var( --border-color-base );
+	color: var( --color-base--subtle );
 }
 
 .mw-echo-special-navbar-bottom {
-	border-top-color: var(--border-color-base);
+	border-top-color: var( --border-color-base );
 }
 
 .mw-echo-special-notifications {
 	.mw-echo-notification {
-		background-color: var(--color-surface-2);
+		background-color: var( --color-surface-2 );
 
 		&:hover {
-			background-color: var(--color-surface-2--hover);
+			background-color: var( --color-surface-2--hover );
 		}
 
 		&:active {
-			background-color: var(--color-surface-2--active);
+			background-color: var( --color-surface-2--active );
 		}
 
 		&-unread {
-			color: var(--color-base);
+			color: var( --color-base );
 
 			.mw-echo-markAsReadButton {
-				opacity: var(--opacity-icon-base);
+				opacity: var( --opacity-icon-base );
 
 				&:hover {
-					opacity: var(--opacity-icon-base--hover);
+					opacity: var( --opacity-icon-base--hover );
 				}
 
 				&:active {
-					opacity: var(--opacity-icon-base--active);
+					opacity: var( --opacity-icon-base--active );
 				}
 			}
 		}
diff --git a/skinStyles/extensions/Echo/ext.echo.ui.desktop.less b/skinStyles/extensions/Echo/ext.echo.ui.desktop.less
index a7255b8e..396048de 100644
--- a/skinStyles/extensions/Echo/ext.echo.ui.desktop.less
+++ b/skinStyles/extensions/Echo/ext.echo.ui.desktop.less
@@ -17,14 +17,14 @@
 				&-head {
 					box-sizing: content-box; // fix overflow
 					padding-top: 8px; // align with other menus
-					border-bottom-color: var(--border-color-base);
+					border-bottom-color: var( --border-color-base );
 
 					> .oo-ui-iconWidget {
-						opacity: var(--opacity-icon-base);
+						opacity: var( --opacity-icon-base );
 					}
 
 					> .oo-ui-labelElement-label {
-						color: var(--color-base--emphasized);
+						color: var( --color-base--emphasized );
 					}
 				}
 
@@ -34,7 +34,7 @@
 				}
 
 				&-footer {
-					border-top-color: var(--border-color-base);
+					border-top-color: var( --border-color-base );
 
 					.mw-echo-ui-notificationBadgeButtonPopupWidget-footer-buttons {
 						display: flex;
@@ -44,7 +44,7 @@
 							width: 100%; // Buttons fill up the empty space
 
 							&:last-child {
-								border-left-color: var(--border-color-base);
+								border-left-color: var( --border-color-base );
 							}
 						}
 					}
diff --git a/skinStyles/extensions/Echo/ext.echo.ui.less b/skinStyles/extensions/Echo/ext.echo.ui.less
index b9872848..1f2820d7 100644
--- a/skinStyles/extensions/Echo/ext.echo.ui.less
+++ b/skinStyles/extensions/Echo/ext.echo.ui.less
@@ -12,12 +12,12 @@
 @import '../../../resources/mixins.less';
 
 .mw-echo-ui-notificationBadgeButtonPopupWidget-popup {
-	margin: var(--space-xs);
-	box-shadow: var(--box-shadow-dialog);
+	margin: var( --space-xs );
+	box-shadow: var( --box-shadow-dialog );
 }
 
 /* mw.echo.ui.mobile.less */
-@media all and (max-width: 720px) {
+@media all and ( max-width: 720px ) {
 	.mw-echo-ui-overlay {
 		.mw-echo-ui-notificationBadgeButtonPopupWidget-popup {
 			right: 0 !important;
@@ -38,32 +38,32 @@
 
 /* mw.echo.ui.NotificationItemWidget.less */
 .mw-echo-ui-notificationItemWidget {
-	border-color: var(--border-color-base);
-	background-color: var(--color-surface-3);
+	border-color: var( --border-color-base );
+	background-color: var( --color-surface-3 );
 
 	&:hover {
-		background-color: var(--color-surface-2--hover);
+		background-color: var( --color-surface-2--hover );
 	}
 
 	&:active {
-		background-color: var(--color-surface-2--active);
+		background-color: var( --color-surface-2--active );
 	}
 
 	&:last-child {
-		border-bottom-color: var(--border-color-base);
+		border-bottom-color: var( --border-color-base );
 	}
 
 	&-unread {
-		background-color: var(--color-surface-1);
+		background-color: var( --color-surface-1 );
 
 		&:hover {
-			background-color: var(--color-surface-2--hover);
+			background-color: var( --color-surface-2--hover );
 		}
 	}
 
 	&-notify {
 		&-description {
-			color: var(--color-base--subtle);
+			color: var( --color-base--subtle );
 		}
 	}
 
@@ -76,11 +76,11 @@
 	&-content {
 		&-message {
 			&-header {
-				color: var(--color-base--emphasized);
+				color: var( --color-base--emphasized );
 			}
 
 			&-body {
-				color: var(--color-base--subtle);
+				color: var( --color-base--subtle );
 			}
 		}
 
@@ -98,32 +98,32 @@
 			}
 
 			.mw-echo-ui-menuItemWidget-prioritized {
-				border-radius: var(--border-radius-small);
+				border-radius: var( --border-radius-small );
 
 				&:hover {
-					background-color: var(--background-color-quiet--hover);
+					background-color: var( --background-color-quiet--hover );
 				}
 
 				&:active {
-					background-color: var(--background-color-quiet--active);
+					background-color: var( --background-color-quiet--active );
 				}
 			}
 
 			&-menu {
-				opacity: var(--opacity-icon-base);
+				opacity: var( --opacity-icon-base );
 
 				&:hover {
-					opacity: var(--opacity-icon-base--hover);
+					opacity: var( --opacity-icon-base--hover );
 				}
 
 				&:active {
-					opacity: var(--opacity-icon-base--active);
+					opacity: var( --opacity-icon-base--active );
 				}
 			}
 
 			&-timestamp {
 				display: block;
-				color: var(--color-base--subtle);
+				color: var( --color-base--subtle );
 				opacity: 1;
 			}
 		}
@@ -135,7 +135,7 @@
 				&-content-message {
 					&-header {
 						em {
-							color: var(--color-base--subtle);
+							color: var( --color-base--subtle );
 						}
 					}
 				}
@@ -156,68 +156,68 @@
 
 @-webkit-keyframes unseen-fadeout-to-unread {
 	from {
-		background-color: var(--color-surface-2);
+		background-color: var( --color-surface-2 );
 	}
 
 	to {
-		background-color: var(--color-surface-1);
+		background-color: var( --color-surface-1 );
 	}
 }
 
 @keyframes unseen-fadeout-to-unread {
 	from {
-		background-color: var(--color-surface-2);
+		background-color: var( --color-surface-2 );
 	}
 
 	to {
-		background-color: var(--color-surface-1);
+		background-color: var( --color-surface-1 );
 	}
 }
 
 @-webkit-keyframes unseen-fadeout-to-read {
 	from {
-		background-color: var(--color-surface-2);
+		background-color: var( --color-surface-2 );
 	}
 
 	to {
-		background-color: var(--color-surface-3);
+		background-color: var( --color-surface-3 );
 	}
 }
 
 @keyframes unseen-fadeout-to-read {
 	from {
-		background-color: var(--color-surface-2);
+		background-color: var( --color-surface-2 );
 	}
 
 	to {
-		background-color: var(--color-surface-3);
+		background-color: var( --color-surface-3 );
 	}
 }
 
 /* mw.echo.ui.ToggleReadCircleButtonWidget.less */
 .mw-echo-ui-toggleReadCircleButtonWidget {
 	&-circle {
-		background-color: var(--color-primary);
+		background-color: var( --color-primary );
 
 		&-unread {
-			border-color: var(--border-color-base);
-			background-color: var(--color-surface-2);
+			border-color: var( --border-color-base );
+			background-color: var( --color-surface-2 );
 		}
 	}
 
 	&:hover .mw-echo-ui-toggleReadCircleButtonWidget-circle {
-		background-color: var(--color-primary--hover);
+		background-color: var( --color-primary--hover );
 
 		&-unread {
-			background-color: var(--color-surface-2--hover);
+			background-color: var( --color-surface-2--hover );
 		}
 	}
 
 	&:active .mw-echo-ui-toggleReadCircleButtonWidget-circle {
-		background-color: var(--color-primary--active);
+		background-color: var( --color-primary--active );
 
 		&-unread {
-			background-color: var(--color-surface-2--active);
+			background-color: var( --color-surface-2--active );
 		}
 	}
 }
@@ -226,16 +226,16 @@
 .mw-echo-ui-crossWikiNotificationItemWidget,
 .mw-echo-ui-bundleNotificationItemWidget {
 	&-separator {
-		border-bottom-color: var(--border-color-base);
+		border-bottom-color: var( --border-color-base );
 	}
 
 	&-group {
-		background-color: var(--color-surface-2);
+		background-color: var( --color-surface-2 );
 	}
 
 	.mw-echo-ui-subGroupListWidget-header {
 		&-row-title {
-			color: var(--color-base--subtle);
+			color: var( --color-base--subtle );
 		}
 	}
 }
@@ -244,18 +244,18 @@
 .mw-echo-ui-notificationsListWidget {
 	> a,
 	&:hover > a {
-		color: var(--color-base--subtle);
+		color: var( --color-base--subtle );
 	}
 
-	&:not(:hover) a,
-	#p-personal &:not(:hover) a.new {
-		color: var(--color-base--subtle);
+	&:not( :hover ) a,
+	#p-personal &:not( :hover ) a.new {
+		color: var( --color-base--subtle );
 	}
 }
 
 /* mw.echo.ui.PlaceholderItemWidget.less */
 .mw-echo-ui-placeholderItemWidget {
-	background-color: var(--color-surface-1);
+	background-color: var( --color-surface-1 );
 }
 
 /* mw.echo.ui.MenuItemWidget.less */
@@ -263,32 +263,32 @@
 	// First selector is polyfill for MW 1.35
 	> .oo-ui-labelElement-label,
 	> .oo-ui-buttonElement-button > .oo-ui-labelElement-label {
-		color: var(--color-base--emphasized);
+		color: var( --color-base--emphasized );
 	}
 
 	&-prioritized {
-		opacity: var(--opacity-icon-base);
+		opacity: var( --opacity-icon-base );
 
 		&:hover {
-			opacity: var(--opacity-icon-base--hover);
+			opacity: var( --opacity-icon-base--hover );
 		}
 
 		&:active {
-			opacity: var(--opacity-icon-base--active);
+			opacity: var( --opacity-icon-base--active );
 		}
 	}
 
 	&-dynamic-action {
 		&:hover {
-			background-color: var(--color-surface-1);
+			background-color: var( --color-surface-1 );
 		}
 
 		.mw-echo-ui-menuItemWidget-description {
-			color: var(--color-base--subtle);
+			color: var( --color-base--subtle );
 		}
 	}
 
 	.mw-echo-ui-actionMenuPopupWidget-menu:hover {
-		background-color: var(--color-surface-2--hover);
+		background-color: var( --color-surface-2--hover );
 	}
 }
diff --git a/skinStyles/extensions/Graph/ext.graph.styles.less b/skinStyles/extensions/Graph/ext.graph.styles.less
index 9b623e98..92634ae2 100644
--- a/skinStyles/extensions/Graph/ext.graph.styles.less
+++ b/skinStyles/extensions/Graph/ext.graph.styles.less
@@ -7,7 +7,7 @@
 
 .skin-citizen {
 	.vega {
-		background: var(--color-surface-0);
+		background: var( --color-surface-0 );
 	}
 
 	/* responsive layout */
@@ -20,7 +20,7 @@
 	/* dark mode */
 	&-dark {
 		.mw-graph canvas {
-			filter: invert(1) hue-rotate(180deg);
+			filter: invert( 1 ) hue-rotate( 180deg );
 		}
 	}
 }
@@ -29,56 +29,56 @@
 	.mw-graph-interactable {
 		&:hover {
 			.mw-graph-layover {
-				background-color: var(--background-color-overlay--lighter);
+				background-color: var( --background-color-overlay--lighter );
 			}
 
 			.mw-graph-switch {
 				&.mw-graph-loading {
-					background-color: var(--color-surface-0);
+					background-color: var( --color-surface-0 );
 				}
 
 				&:hover {
-					background-color: var(--color-surface-0);
+					background-color: var( --color-surface-0 );
 				}
 			}
 		}
 	}
 
 	.mw-graph-hover-title {
-		background-color: var(--color-surface-0);
+		background-color: var( --color-surface-0 );
 	}
 
 	/* common button style */
 	.mw-graph-switch {
-		border-color: var(--border-color-base);
-		background-color: var(--background-color-overlay--lighter);
-		color: var(--color-base);
+		border-color: var( --border-color-base );
+		background-color: var( --background-color-overlay--lighter );
+		color: var( --color-base );
 
 		&:hover {
-			border-color: var(--color-primary);
-			background-color: var(--color-surface-0);
-			color: var(--color-primary);
+			border-color: var( --color-primary );
+			background-color: var( --color-surface-0 );
+			color: var( --color-primary );
 		}
 
 		&:active {
-			border-color: var(--color-primary--active);
-			background-color: var(--color-surface-0);
-			color: var(--color-primary);
+			border-color: var( --color-primary--active );
+			background-color: var( --color-surface-0 );
+			color: var( --color-primary );
 		}
 
 		&:focus {
-			border-color: var(--color-primary);
-			box-shadow: inset 0 0 0 1px var(--color-surface-0);
+			border-color: var( --color-primary );
+			box-shadow: inset 0 0 0 1px var( --color-surface-0 );
 		}
 
 		/* Loading button style */
 		&.mw-graph-loading {
-			border-color: var(--color-primary--active);
-			background-color: var(--color-surface-0);
-			color: var(--color-base--subtle);
+			border-color: var( --color-primary--active );
+			background-color: var( --color-surface-0 );
+			color: var( --color-base--subtle );
 
 			&:hover {
-				border-color: var(--color-primary);
+				border-color: var( --color-primary );
 			}
 		}
 	}
diff --git a/skinStyles/extensions/Interwiki/ext.interwiki.specialpage.less b/skinStyles/extensions/Interwiki/ext.interwiki.specialpage.less
index 13b2e480..7811817d 100644
--- a/skinStyles/extensions/Interwiki/ext.interwiki.specialpage.less
+++ b/skinStyles/extensions/Interwiki/ext.interwiki.specialpage.less
@@ -9,5 +9,5 @@
 */
 
 table.mw-interwikitable.body td.mw-interwikitable-local-yes {
-	background: var(--background-color-success);
+	background: var( --background-color-success );
 }
diff --git a/skinStyles/extensions/Lingo/ext.Lingo.less b/skinStyles/extensions/Lingo/ext.Lingo.less
index eeeb7cb3..9dad3a94 100644
--- a/skinStyles/extensions/Lingo/ext.Lingo.less
+++ b/skinStyles/extensions/Lingo/ext.Lingo.less
@@ -9,18 +9,18 @@
 */
 @media screen {
 	span.mw-lingo-term {
-		border-bottom-color: var(--color-base--subtle);
+		border-bottom-color: var( --color-base--subtle );
 
 		&:hover {
-			background-color: var(--background-color-quiet--hover);
+			background-color: var( --background-color-quiet--hover );
 		}
 	}
 }
 
 .mw-lingo-tooltip {
 	border: 0;
-	border-radius: var(--border-radius--medium);
-	background-color: var(--color-surface-1);
-	box-shadow: var(--box-shadow--dialog);
-	color: var(--color-base);
+	border-radius: var( --border-radius--medium );
+	background-color: var( --color-surface-1 );
+	box-shadow: var( --box-shadow--dialog );
+	color: var( --color-base );
 }
diff --git a/skinStyles/extensions/ManageWiki/ext.managewiki.oouiform.styles.less b/skinStyles/extensions/ManageWiki/ext.managewiki.oouiform.styles.less
index e68deb3a..08604f60 100644
--- a/skinStyles/extensions/ManageWiki/ext.managewiki.oouiform.styles.less
+++ b/skinStyles/extensions/ManageWiki/ext.managewiki.oouiform.styles.less
@@ -10,15 +10,15 @@
 
 #managewiki {
 	.managewiki-submit-formfields {
-		border-top-color: var(--border-color-base);
-		background: var(--color-surface-0);
-		box-shadow: 0 -4px 4px -4px var(--border-color-base);
+		border-top-color: var( --border-color-base );
+		background: var( --color-surface-0 );
+		box-shadow: 0 -4px 4px -4px var( --border-color-base );
 	}
 }
 
 .managewiki-tabs-wrapper.oo-ui-panelLayout-framed,
 .managewiki-tabs > .oo-ui-menuLayout-content > .oo-ui-indexLayout-stackLayout > .oo-ui-tabPanelLayout {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 }
 
 /* JavaScript disabled */
@@ -26,7 +26,7 @@
 	.managewiki-tabs {
 		.managewiki-section-fieldset {
 			> .oo-ui-fieldsetLayout-group {
-				border-top-color: var(--border-color-base);
+				border-top-color: var( --border-color-base );
 			}
 		}
 	}
diff --git a/skinStyles/extensions/Math/ext.math.styles.less b/skinStyles/extensions/Math/ext.math.styles.less
index 0c1e4b4c..ea7e76a6 100644
--- a/skinStyles/extensions/Math/ext.math.styles.less
+++ b/skinStyles/extensions/Math/ext.math.styles.less
@@ -19,11 +19,11 @@
 
 	// grayscale fallback if SVG from data url is not supported
 	@lightness: lightness(@color);
-	filter: saturate(0%) brightness(0%) invert(@lightness) opacity(@a);
+	filter: saturate( 0% ) brightness( 0% ) invert( @lightness ) opacity( @a );
 
 	// color filter
 	@svg-filter-id: "recolor";
-	filter: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="@{svg-filter-id}" color-interpolation-filters="sRGB"><feColorMatrix type="matrix" values="0 0 0 0 @{r} 0 0 0 0 @{g} 0 0 0 0 @{b} 0 0 0 @{a} 0"/></filter></svg> #@{svg-filter-id}');
+	filter: url( 'data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="@{svg-filter-id}" color-interpolation-filters="sRGB"><feColorMatrix type="matrix" values="0 0 0 0 @{r} 0 0 0 0 @{g} 0 0 0 0 @{b} 0 0 0 @{a} 0"/></filter></svg> #@{svg-filter-id}' );
 }
 
 .mwe-math-fallback-image-display,
diff --git a/skinStyles/extensions/MediaSearch/mediasearch.styles.less b/skinStyles/extensions/MediaSearch/mediasearch.styles.less
index 4c497860..05995c02 100644
--- a/skinStyles/extensions/MediaSearch/mediasearch.styles.less
+++ b/skinStyles/extensions/MediaSearch/mediasearch.styles.less
@@ -27,195 +27,195 @@
 	.mw-indicators {
 		padding-left: 0;
 		border-left: 0;
-		margin-top: var(--space-xs);
+		margin-top: var( --space-xs );
 		margin-left: 0;
 	}
 }
 
 // Missing from the original stylesheet
 .searchmatch {
-	color: var(--color-base--emphasized);
-	font-weight: var(--font-weight-semibold);
+	color: var( --color-base--emphasized );
+	font-weight: var( --font-weight-semibold );
 }
 
 /* AutocompleteSearchInput.less */
 .sd-input {
 	&__icon {
-		opacity: var(--opacity-icon-base);
+		opacity: var( --opacity-icon-base );
 	}
 
 	&__indicator {
-		color: var(--color-base-subtle);
+		color: var( --color-base-subtle );
 	}
 
 	&__input {
-		border-color: var(--border-color-base--darker);
-		border-radius: var(--border-radius--small);
+		border-color: var( --border-color-base--darker );
+		border-radius: var( --border-radius--small );
 		background-color: transparent;
-		color: var(--color-base--emphasized);
+		color: var( --color-base--emphasized );
 
 		&::placeholder {
-			color: var(--color-base-subtle);
+			color: var( --color-base-subtle );
 		}
 
 		&:hover {
-			border-color: var(--color-primary--hover);
-			background-color: var(--color-surface-0);
+			border-color: var( --color-primary--hover );
+			background-color: var( --color-surface-0 );
 		}
 
 		&:focus {
-			border-color: var(--color-primary);
-			background-color: var(--color-surface-0);
-			box-shadow: inset 0 0 0 1px var(--color-primary);
+			border-color: var( --color-primary );
+			background-color: var( --color-surface-0 );
+			box-shadow: inset 0 0 0 1px var( --color-primary );
 		}
 	}
 
 	&--pending .sd-input__input {
-		background-color: var(--color-surface-2);
-		background-image: linear-gradient(135deg, var(--color-surface-1) 25%, rgba(255, 255, 255, 0) 25%, rgba(255, 255, 255, 0) 50%, var(--color-surface-1) 50%, var(--color-surface-1) 75%, rgba(255, 255, 255, 0) 75%, rgba(255, 255, 255, 0));
+		background-color: var( --color-surface-2 );
+		background-image: linear-gradient( 135deg, var( --color-surface-1 ) 25%, rgba( 255, 255, 255, 0 ) 25%, rgba( 255, 255, 255, 0 ) 50%, var( --color-surface-1 ) 50%, var( --color-surface-1 ) 75%, rgba( 255, 255, 255, 0 ) 75%, rgba( 255, 255, 255, 0 ) );
 	}
 }
 
 /* Button.less */
 .sd-button {
-	border-radius: var(--border-radius--small);
-	color: var(--color-base--emphasized);
-	font-family: var(--fonts-sans);
-	font-weight: var(--font-weight-semibold);
+	border-radius: var( --border-radius--small );
+	color: var( --color-base--emphasized );
+	font-family: var( --fonts-sans );
+	font-weight: var( --font-weight-semibold );
 
 	&:hover {
-		background-color: var(--background-color-quiet--hover);
-		color: var(--color-base--emphasized);
+		background-color: var( --background-color-quiet--hover );
+		color: var( --color-base--emphasized );
 	}
 
 	&:focus {
-		border-color: var(--color-primary);
-		box-shadow: inset 0 0 0 1px var(--color-primary);
+		border-color: var( --color-primary );
+		box-shadow: inset 0 0 0 1px var( --color-primary );
 	}
 
 	&--framed {
-		border-color: var(--border-color-base);
-		background-color: var(--color-surface-2);
+		border-color: var( --border-color-base );
+		background-color: var( --color-surface-2 );
 
 		&:hover {
-			background-color: var(--color-surface-2--hover);
-			color: var(--color-base--emphasized);
+			background-color: var( --color-surface-2--hover );
+			color: var( --color-base--emphasized );
 		}
 
 		// Add active state
 		&:active {
-			background-color: var(--color-surface-2--active);
-			color: var(--color-base--subtle);
+			background-color: var( --color-surface-2--active );
+			color: var( --color-base--subtle );
 		}
 	}
 
 	&--progressive {
-		color: var(--color-primary);
+		color: var( --color-primary );
 
 		&:hover {
-			color: var(--color-primary--hover);
+			color: var( --color-primary--hover );
 		}
 
 		// Add active state
 		&:active {
-			color: var(--color-primary--active);
+			color: var( --color-primary--active );
 		}
 
 		&.sd-button--framed {
 			color: #fff;
 
 			&:hover {
-				border-color: var(--color-primary--hover);
+				border-color: var( --color-primary--hover );
 			}
 
 			// Add active state
 			&:active {
-				color: var(--color-primary--active);
+				color: var( --color-primary--active );
 			}
 		}
 	}
 
 	&--destructive {
-		color: var(--color-destructive);
+		color: var( --color-destructive );
 
 		&:hover {
-			color: var(--color-destructive--hover);
+			color: var( --color-destructive--hover );
 		}
 
 		// Add active state
 		&:active {
-			color: var(--color-destructive--active);
+			color: var( --color-destructive--active );
 		}
 
 		&:focus {
-			border-color: var(--color-destructive);
-			box-shadow: inset 0 0 0 1px var(--color-destructive);
+			border-color: var( --color-destructive );
+			box-shadow: inset 0 0 0 1px var( --color-destructive );
 		}
 
 		&.sd-button--framed {
 			color: #fff;
 
 			&:hover {
-				border-color: var(--color-destructive--hover);
+				border-color: var( --color-destructive--hover );
 			}
 
 			// Add active state
 			&:active {
-				color: var(--color-destructive--active);
+				color: var( --color-destructive--active );
 			}
 
 			&:focus {
-				box-shadow: inset 0 0 0 1px var(--color-destructive);
+				box-shadow: inset 0 0 0 1px var( --color-destructive );
 			}
 		}
 	}
 
 	&--primary {
 		&.sd-button--framed {
-			border-color: var(--color-primary);
-			background-color: var(--color-primary);
+			border-color: var( --color-primary );
+			background-color: var( --color-primary );
 
 			&:hover {
-				border-color: var(--color-primary--hover);
-				background-color: var(--color-primary--hover);
+				border-color: var( --color-primary--hover );
+				background-color: var( --color-primary--hover );
 			}
 
 			// Add active state
 			&:active {
-				border-color: var(--color-primary--active);
-				background-color: var(--color-primary--active);
+				border-color: var( --color-primary--active );
+				background-color: var( --color-primary--active );
 			}
 
 			&:focus {
-				border-color: var(--color-primary);
-				box-shadow: inset 0 0 0 1px var(--color-primary), inset 0 0 0 2px #fff;
+				border-color: var( --color-primary );
+				box-shadow: inset 0 0 0 1px var( --color-primary ), inset 0 0 0 2px #fff;
 			}
 
 			&.sd-button--destructive {
-				border-color: var(--color-destructive);
-				background-color: var(--color-destructive);
+				border-color: var( --color-destructive );
+				background-color: var( --color-destructive );
 
 				&:hover {
-					border-color: var(--color-destructive--hover);
-					background-color: var(--color-destructive--hover);
+					border-color: var( --color-destructive--hover );
+					background-color: var( --color-destructive--hover );
 				}
 
 				// Add active state
 				&:active {
-					border-color: var(--color-destructive--active);
-					background-color: var(--color-destructive--active);
+					border-color: var( --color-destructive--active );
+					background-color: var( --color-destructive--active );
 				}
 
 				&:focus {
-					border-color: var(--color-destructive);
-					box-shadow: inset 0 0 0 1px var(--color-destructive), inset 0 0 0 2px #fff;
+					border-color: var( --color-destructive );
+					box-shadow: inset 0 0 0 1px var( --color-destructive ), inset 0 0 0 2px #fff;
 				}
 			}
 		}
 	}
 
 	&:disabled {
-		color: var(--color-base--subtle);
+		color: var( --color-base--subtle );
 
 		&:hover,
 		&:focus {
@@ -223,19 +223,19 @@
 		}
 
 		&.sd-button--framed {
-			border-color: var(--color-surface-4);
-			background-color: var(--color-surface-4);
-			color: var(--color-base--subtle);
+			border-color: var( --color-surface-4 );
+			background-color: var( --color-surface-4 );
+			color: var( --color-base--subtle );
 
 			&:hover,
 			&:focus {
-				border-color: var(--color-surface-4);
-				background-color: var(--color-surface-4);
+				border-color: var( --color-surface-4 );
+				background-color: var( --color-surface-4 );
 			}
 		}
 
-		&:not(.sd-button--framed) .sd-icon {
-			opacity: var(--opacity-base--disabled);
+		&:not( .sd-button--framed ) .sd-icon {
+			opacity: var( --opacity-base--disabled );
 		}
 	}
 }
@@ -243,61 +243,61 @@
 /* Checkbox.less */
 .sd-checkbox {
 	&__icon {
-		border-color: var(--border-color-base--darker);
-		border-radius: var(--border-radius--small);
+		border-color: var( --border-color-base--darker );
+		border-radius: var( --border-radius--small );
 		// Show background when hovered
 		background-color: transparent;
 	}
 
 	&__input {
 		&:focus + .sd-checkbox__icon {
-			border-color: var(--color-primary);
-			background-color: var(--color-surface-0);
-			box-shadow: inset 0 0 0 1px var(--color-primary);
+			border-color: var( --color-primary );
+			background-color: var( --color-surface-0 );
+			box-shadow: inset 0 0 0 1px var( --color-primary );
 		}
 
 		&:hover + .sd-checkbox__icon {
-			border-color: var(--color-primary--hover);
-			background-color: var(--color-surface-0);
+			border-color: var( --color-primary--hover );
+			background-color: var( --color-surface-0 );
 		}
 
 		&:active + .sd-checkbox__icon {
-			border-color: var(--color-primary--active);
-			background-color: var(--color-primary--active);
+			border-color: var( --color-primary--active );
+			background-color: var( --color-primary--active );
 			box-shadow: none;
 		}
 
 		// Set up check icon.
 		&:checked + .sd-checkbox__icon {
-			border-color: var(--color-primary);
-			background-color: var(--color-primary);
+			border-color: var( --color-primary );
+			background-color: var( --color-primary );
 		}
 
 		&:disabled {
 			& + .sd-checkbox__icon {
-				border-color: var(--color-surface-4);
-				background-color: var(--color-surface-4);
+				border-color: var( --color-surface-4 );
+				background-color: var( --color-surface-4 );
 			}
 
 			& ~ .sd-checkbox__label-text {
-				color: var(--color-base--subtle);
+				color: var( --color-base--subtle );
 			}
 		}
 
 		&:checked:enabled:focus + .sd-checkbox__icon {
-			border-color: var(--color-primary);
-			background-color: var(--color-primary);
-			box-shadow: inset 0 0 0 1px var(--color-primary), inset 0 0 0 2px #fff;
+			border-color: var( --color-primary );
+			background-color: var( --color-primary );
+			box-shadow: inset 0 0 0 1px var( --color-primary ), inset 0 0 0 2px #fff;
 		}
 
 		&:checked:enabled:hover + .sd-checkbox__icon {
-			border-color: var(--color-primary--hover);
-			background-color: var(--color-primary--hover);
+			border-color: var( --color-primary--hover );
+			background-color: var( --color-primary--hover );
 		}
 
 		&:checked:enabled:active + .sd-checkbox__icon {
-			border-color: var(--color-primary--active);
-			background-color: var(--color-primary--active);
+			border-color: var( --color-primary--active );
+			background-color: var( --color-primary--active );
 			box-shadow: none;
 		}
 	}
@@ -306,7 +306,7 @@
 /* CopyTextLayout.less */
 .sd-copy-text-layout {
 	&__text {
-		border-right-color: var(--border-color-base);
+		border-right-color: var( --border-color-base );
 	}
 }
 
@@ -316,67 +316,67 @@
 	z-index: @z-index-overlay;
 
 	&__overlay {
-		background-color: var(--background-color-overlay);
+		background-color: var( --background-color-overlay );
 	}
 
 	&__shell {
 		border-color: transparent;
-		border-radius: var(--border-radius--medium);
-		background-color: var(--color-surface-1);
-		box-shadow: var(--box-shadow-dialog);
+		border-radius: var( --border-radius--medium );
+		background-color: var( --color-surface-1 );
+		box-shadow: var( --box-shadow-dialog );
 	}
 
 	&__header {
-		border-bottom-color: var(--border-color-base);
+		border-bottom-color: var( --border-color-base );
 
 		.sd-dialog__header-title {
-			color: var(--color-base--emphasized);
-			font-weight: var(--font-weight-semibold);
+			color: var( --color-base--emphasized );
+			font-weight: var( --font-weight-semibold );
 		}
 	}
 
-	&__footer:not(:empty) {
-		border-top-color: var(--border-color-base);
+	&__footer:not( :empty ) {
+		border-top-color: var( --border-color-base );
 	}
 }
 
 /* Message.less */
 .sd-message {
-	color: var(--color-base--emphasized);
-	font-weight: var(--font-weight-semibold);
+	color: var( --color-base--emphasized );
+	font-weight: var( --font-weight-semibold );
 
 	&--error {
-		color: var(--color-destructive);
+		color: var( --color-destructive );
 	}
 
 	&--success {
-		color: var(--color-success);
+		color: var( --color-success );
 	}
 
 	// Sync with message box styles
 	&--block {
-		border-radius: var(--border-radius--small);
-		color: var(--color-base--emphasized);
-		font-weight: var(--font-weight-normal);
+		border-radius: var( --border-radius--small );
+		color: var( --color-base--emphasized );
+		font-weight: var( --font-weight-normal );
 
 		&.sd-message--notice {
-			border-color: var(--color-surface-2);
-			background-color: var(--color-surface-2);
+			border-color: var( --color-surface-2 );
+			background-color: var( --color-surface-2 );
 		}
 
 		&.sd-message--error {
-			border-color: var(--background-color-destructive);
-			background-color: var(--background-color-destructive);
+			border-color: var( --background-color-destructive );
+			background-color: var( --background-color-destructive );
 		}
 
 		&.sd-message--warning {
-			border-color: var(--background-color-warning);
-			background-color: var(--background-color-warning);
+			border-color: var( --background-color-warning );
+			background-color: var( --background-color-warning );
 		}
 
 		&.sd-message--success {
-			border-color: var(--background-color-success);
-			background-color: var(--background-color-success);
+			border-color: var( --background-color-success );
+			background-color: var( --background-color-success );
 		}
 	}
 
@@ -389,35 +389,35 @@
 /* Radio.less */
 .sd-radio {
 	&__icon {
-		border-color: var(--border-color-base--darker);
+		border-color: var( --border-color-base--darker );
 		// Show background when hovered
 		background-color: transparent;
 	}
 
 	&__input {
 		&:hover + .sd-radio__icon {
-			border-color: var(--color-primary--hover);
-			background-color: var(--color-surface-0);
+			border-color: var( --color-primary--hover );
+			background-color: var( --color-surface-0 );
 		}
 
 		&:active + .sd-radio__icon {
-			border-color: var(--color-primary--active);
-			background-color: var(--color-primary--active);
+			border-color: var( --color-primary--active );
+			background-color: var( --color-primary--active );
 		}
 
 		&:checked + .sd-radio__icon {
-			border-color: var(--color-primary);
+			border-color: var( --color-primary );
 			background-color: #fff;
 		}
 
 		&:disabled {
 			& + .sd-radio__icon {
-				border-color: var(--color-surface-4);
-				background-color: var(--color-surface-4);
+				border-color: var( --color-surface-4 );
+				background-color: var( --color-surface-4 );
 			}
 
 			& ~ .sd-radio__label-text {
-				color: var(--color-base--subtle);
+				color: var( --color-base--subtle );
 			}
 
 			&:checked + .sd-radio__icon {
@@ -428,20 +428,20 @@
 		&:checked:enabled {
 			&:focus + .sd-radio__icon {
 				&::before {
-					border-color: var(--color-primary--active);
+					border-color: var( --color-primary--active );
 				}
 			}
 
 			&:hover + .sd-radio__icon {
-				border-color: var(--color-primary--hover);
+				border-color: var( --color-primary--hover );
 			}
 
 			&:active + .sd-radio__icon {
-				border-color: var(--color-primary--active);
+				border-color: var( --color-primary--active );
 				box-shadow: none;
 
 				&::before {
-					border-color: var(--color-primary--active);
+					border-color: var( --color-primary--active );
 				}
 			}
 		}
@@ -451,92 +451,92 @@
 /* Select.less */
 .sd-select {
 	&__handle {
-		color: var(--color-base);
+		color: var( --color-base );
 	}
 
 	&__content {
-		border-color: var(--border-color-base--darker);
+		border-color: var( --border-color-base--darker );
 		// Show background when hovered
 		background-color: transparent;
-		color: var(--color-base--emphasized);
-		font-family: var(--fonts-sans); // Browser overrides button font
+		color: var( --color-base--emphasized );
+		font-family: var( --fonts-sans ); // Browser overrides button font
 
 		&:hover {
-			border-color: var(--color-primary--hover);
-			background-color: var(--color-surface-1);
-			color: var(--color-base--emphasized);
+			border-color: var( --color-primary--hover );
+			background-color: var( --color-surface-1 );
+			color: var( --color-base--emphasized );
 
 			.sd-select__handle {
-				color: var(--color-base);
+				color: var( --color-base );
 			}
 		}
 
 		&:focus {
-			border-color: var(--color-primary);
-			background-color: var(--color-surface-1);
-			box-shadow: inset 0 0 0 1px var(--color-primary);
+			border-color: var( --color-primary );
+			background-color: var( --color-surface-1 );
+			box-shadow: inset 0 0 0 1px var( --color-primary );
 		}
 
 		&:active {
-			border-color: var(--border-color-base--darker);
-			color: var(--color-base--subtle);
+			border-color: var( --border-color-base--darker );
+			color: var( --color-base--subtle );
 		}
 	}
 
 	&--open {
 		.sd-select__content {
-			background-color: var(--color-surface-1);
+			background-color: var( --color-surface-1 );
 		}
 
 		.sd-select__handle {
-			color: var(--color-base);
+			color: var( --color-base );
 		}
 	}
 
 	&--disabled {
 		.sd-select__content {
-			border-color: var(--color-surface-4);
-			background-color: var(--color-surface-4);
-			color: var(--color-base--subtle);
+			border-color: var( --color-surface-4 );
+			background-color: var( --color-surface-4 );
+			color: var( --color-base--subtle );
 
 			&:hover {
 				.sd-select__handle {
-					color: var(--color-base--subtle);
+					color: var( --color-base--subtle );
 				}
 			}
 
 			&:focus {
-				border-color: var(--color-surface-4);
+				border-color: var( --color-surface-4 );
 			}
 		}
 
 		.sd-select__handle {
-			color: var(--color-base--subtle);
+			color: var( --color-base--subtle );
 		}
 	}
 }
 
 /* SelectMenu.less */
 .sd-select-menu {
-	border-color: var(--border-color-base--darker);
-	border-radius: 0 0 var(--border-radius--small) var(--border-radius--small);
-	background-color: var(--color-surface-1);
+	border-color: var( --border-color-base--darker );
+	border-radius: 0 0 var( --border-radius--small ) var( --border-radius--small );
+	background-color: var( --color-surface-1 );
 	// box-shadow: var( --box-shadow-dialog );
 
 	&__list-item {
-		color: var(--color-base--emphasized);
+		color: var( --color-base--emphasized );
 
 		&--active {
-			background-color: var(--background-color-quiet--hover);
-			color: var(--color-base--emphasized);
+			background-color: var( --background-color-quiet--hover );
+			color: var( --color-base--emphasized );
 		}
 
 		&--selected {
-			background-color: var(--background-color-primary--hover);
+			background-color: var( --background-color-primary--hover );
 		}
 
 		&--active.sd-select-menu__list-item--selected {
-			color: var(--color-primary);
+			color: var( --color-primary );
 		}
 	}
 }
@@ -545,20 +545,20 @@
 .sd-tabs {
 	&__header {
 		// Use border instead of box-shadow to align with Citizen and Codex
-		border-bottom: 1px solid var(--border-color-base);
+		border-bottom: 1px solid var( --border-color-base );
 		box-shadow: none;
 
 		&--gradient {
 			&::after {
 				// TODO: Should really make this into a LESS variable or mixin since it is useful
-				background-image: linear-gradient(to right, rgba(255, 255, 255, 0) 85%, var(--color-surface-0) 100%);
+				background-image: linear-gradient( to right, rgba( 255, 255, 255, 0 ) 85%, var( --color-surface-0 ) 100% );
 			}
 		}
 	}
 
 	&__tabs-list {
 		// Should show a scroll bar on pointer device so user can scroll the tabs
-		@media (hover: hover) {
+		@media ( hover: hover ) {
 			scrollbar-width: thin;
 
 			&::-webkit-scrollbar {
@@ -568,39 +568,39 @@
 		}
 
 		&__item {
-			color: var(--color-base--emphasized);
-			font-weight: var(--font-weight-medium);
+			color: var( --color-base--emphasized );
+			font-weight: var( --font-weight-medium );
 
 			&--current {
-				box-shadow: inset 0 -2px var(--color-primary);
-				color: var(--color-primary);
+				box-shadow: inset 0 -2px var( --color-primary );
+				color: var( --color-primary );
 			}
 
 			&:hover {
-				box-shadow: inset 0 -2px var(--color-primary--hover);
-				color: var(--color-primary--hover);
+				box-shadow: inset 0 -2px var( --color-primary--hover );
+				color: var( --color-primary--hover );
 			}
 
 			&:active {
-				box-shadow: inset 0 -2px var(--color-primary--active);
-				color: var(--color-primary--active);
+				box-shadow: inset 0 -2px var( --color-primary--active );
+				color: var( --color-primary--active );
 			}
 
 			&--disabled {
-				color: var(--color-base--subtle);
+				color: var( --color-base--subtle );
 
 				&--current,
 				&:hover,
 				&:active {
-					color: var(--color-base--subtle);
+					color: var( --color-base--subtle );
 				}
 			}
 		}
 
 		&:focus {
 			.sd-tabs__tabs-list__item--current {
-				border-radius: var(--border-radius--small);
-				box-shadow: inset 0 0 0 2px var(--color-primary);
+				border-radius: var( --border-radius--small );
+				box-shadow: inset 0 0 0 2px var( --color-primary );
 			}
 		}
 	}
@@ -612,7 +612,7 @@
 	overflow: hidden; // needed for transition and rounded corners
 	// Keep original light background so that transparent images are more legible
 	// background-color: var( --color-surface-2 );
-	border-radius: var(--border-radius--small);
+	border-radius: var( --border-radius--small );
 
 	&:hover,
 	&:focus {
@@ -620,7 +620,7 @@
 	}
 
 	&:focus {
-		outline: solid 2px var(--color-primary);
+		outline: solid 2px var( --color-primary );
 		outline-offset: 0;
 	}
 
@@ -633,28 +633,28 @@
 .sdms-video-result {
 	overflow: hidden; // Hide transition overflow
 	border-color: transparent;
-	border-radius: var(--border-radius--small);
-	color: var(--color-primary);
+	border-radius: var( --border-radius--small );
+	color: var( --color-primary );
 
 	&__title {
-		color: var(--color-base--emphasized);
+		color: var( --color-base--emphasized );
 		transition: none;
 	}
 
 	&__body {
 		z-index: 1;
-		padding: var(--space-sm) 0 0 0;
+		padding: var( --space-sm ) 0 0 0;
 		// HACK: Hide thumbnail overflow
-		background-color: var(--color-surface-0);
+		background-color: var( --color-surface-0 );
 	}
 
 	&__meta {
-		margin-top: var(--space-xxs);
+		margin-top: var( --space-xxs );
 		font-size: 0.875rem;
 	}
 
 	&:hover &__title {
-		color: var(--color-base--emphasized);
+		color: var( --color-base--emphasized );
 	}
 
 	&:hover,
@@ -663,36 +663,36 @@
 	}
 
 	&:focus {
-		outline: solid 2px var(--color-primary);
+		outline: solid 2px var( --color-primary );
 		outline-offset: 0;
 	}
 
 	&__thumbnail {
-		border-radius: var(--border-radius--small);
+		border-radius: var( --border-radius--small );
 		transition: @transition-transform;
 	}
 
 	&__duration {
-		padding: var(--space-xxs) var(--space-xs);
-		border-radius: var(--border-radius--small);
-		background-color: var(--color-surface-2);
-		color: var(--color-base);
-		font-weight: var(--font-weight-medium);
+		padding: var( --space-xxs ) var( --space-xs );
+		border-radius: var( --border-radius--small );
+		background-color: var( --color-surface-2 );
+		color: var( --color-base );
+		font-weight: var( --font-weight-medium );
 	}
 
 	&__mime {
-		color: var(--color-base--subtle);
+		color: var( --color-base--subtle );
 	}
 }
 
 /* AudioResult.less */
 .sdms-audio-result {
-	padding: var(--space-md) 0;
+	padding: var( --space-md ) 0;
 	border-bottom: 0;
 	font-size: 0.875rem;
 
 	&__title + &__meta {
-		margin-top: var(--space-xxs);
+		margin-top: var( --space-xxs );
 	}
 
 	&__meta {
@@ -704,48 +704,48 @@
 	}
 
 	&__duration {
-		padding: var(--space-xxs) var(--space-xs);
-		border-radius: var(--border-radius--small);
-		background-color: var(--color-surface-2);
-		color: var(--color-base);
-		font-weight: var(--font-weight-medium);
+		padding: var( --space-xxs ) var( --space-xs );
+		border-radius: var( --border-radius--small );
+		background-color: var( --color-surface-2 );
+		color: var( --color-base );
+		font-weight: var( --font-weight-medium );
 	}
 
 	&__mime {
-		color: var(--color-base--subtle);
+		color: var( --color-base--subtle );
 	}
 }
 
 /* PageResult.less */
 .sdms-page-result {
-	padding: var(--space-md) 0;
+	padding: var( --space-md ) 0;
 	border-bottom: 0;
 	font-size: 0.875rem;
 
 	p {
-		color: var(--color-base--subtle);
+		color: var( --color-base--subtle );
 		font-size: 0.875rem;
 	}
 
 	// Sync with duration styles
 	&__namespace {
-		padding: var(--space-xxs) var(--space-xs);
-		border-radius: var(--border-radius--small);
-		background-color: var(--color-surface-2);
-		color: var(--color-base);
+		padding: var( --space-xxs ) var( --space-xs );
+		border-radius: var( --border-radius--small );
+		background-color: var( --color-surface-2 );
+		color: var( --color-base );
 		font-size: 0.875rem;
-		font-weight: var(--font-weight-medium);
+		font-weight: var( --font-weight-medium );
 	}
 }
 
 /* OtherResult.less */
 .sdms-other-result {
 	&__meta {
-		color: var(--color-base--subtle);
+		color: var( --color-base--subtle );
 	}
 
 	&__extension {
-		font-weight: var(--font-weight-semibold);
+		font-weight: var( --font-weight-semibold );
 	}
 }
 
@@ -753,20 +753,20 @@
 .sdms-search-results {
 	&__details {
 		&--expanded {
-			top: var(--space-md);
+			top: var( --space-md );
 			height: ~'calc( 100vh - var( --space-md ) * 2 )';
-			border-radius: var(--border-radius--large);
-			background-color: var(--color-surface-2);
+			border-radius: var( --border-radius--large );
+			background-color: var( --color-surface-2 );
 
 			// Responsive handling
-			@media screen and (max-width: @width-breakpoint-tablet) {
+			@media screen and ( max-width: @width-breakpoint-tablet ) {
 				position: fixed;
 				top: unset;
 				bottom: 0;
 				left: 0;
 				width: 100%;
 				max-height: 40vh;
-				padding-bottom: var(--header-size); // So that header won't hide the bottom
+				padding-bottom: var( --header-size ); // So that header won't hide the bottom
 				border-bottom-left-radius: 0;
 				border-bottom-right-radius: 0;
 			}
@@ -774,19 +774,19 @@
 	}
 
 	&__details-dialog {
-		background-color: var(--color-surface-1);
+		background-color: var( --color-surface-1 );
 	}
 
 	.sdms-search-result--highlighted {
 		&.sdms-image-result,
 		&.sdms-video-result {
-			border-color: var(--color-primary);
+			border-color: var( --color-primary );
 		}
 	}
 
 	&__list-wrapper--collapsed {
 		// Responsive handling
-		@media screen and (max-width: @width-breakpoint-tablet) {
+		@media screen and ( max-width: @width-breakpoint-tablet ) {
 			// Since the quickview card is a modal, we don't need the right margin anymore
 			margin-right: 0;
 		}
@@ -799,51 +799,51 @@
 
 	&__body {
 		.sd-icon {
-			color: var(--color-base--subtle);
+			color: var( --color-base--subtle );
 		}
 	}
 
 	&__cta {
-		border-color: var(--border-color-base);
-		border-radius: var(--border-radius--small);
-		background-color: var(--color-surface-2);
-		color: var(--color-primary);
-		font-weight: var(--font-weight-medium);
+		border-color: var( --border-color-base );
+		border-radius: var( --border-radius--small );
+		background-color: var( --color-surface-2 );
+		color: var( --color-primary );
+		font-weight: var( --font-weight-medium );
 
 		&:hover {
-			border-color: var(--color-primary--hover);
-			background-color: var(--color-surface-2--hover);
-			color: var(--color-primary--hover);
+			border-color: var( --color-primary--hover );
+			background-color: var( --color-surface-2--hover );
+			color: var( --color-primary--hover );
 		}
 
 		&:active {
-			border-color: var(--color-primary--active);
-			background-color: var(--color-surface-2--active);
-			color: var(--color-primary--active);
+			border-color: var( --color-primary--active );
+			background-color: var( --color-surface-2--active );
+			color: var( --color-primary--active );
 		}
 
 		&:focus {
-			border-color: var(--color-primary);
-			box-shadow: inset 0 0 0 1px var(--color-primary);
+			border-color: var( --color-primary );
+			box-shadow: inset 0 0 0 1px var( --color-primary );
 		}
 	}
 
 	&__button {
-		background-color: var(--color-surface-1);
+		background-color: var( --color-surface-1 );
 
 		.sd-icon {
-			color: var(--color-base);
+			color: var( --color-base );
 		}
 
 		&:hover,
 		&:focus {
 			.sd-icon {
-				color: var(--color-base--emphasized);
+				color: var( --color-base--emphasized );
 			}
 		}
 
 		&:focus {
-			border-color: var(--color-primary);
+			border-color: var( --color-primary );
 		}
 	}
 }
@@ -853,32 +853,32 @@
 	& .sdms-spinner-bounce,
 	&::before,
 	&::after {
-		background-color: var(--color-base--subtle);
+		background-color: var( --color-base--subtle );
 	}
 }
 
 /* EmptyState.less */
 .sdms-empty-state {
-	font-size: var(--font-size-h3);
+	font-size: var( --font-size-h3 );
 }
 
 /* NoResults.less */
 .sdms-no-results {
-	font-size: var(--font-size-h3);
-	font-weight: var(--font-weight-semibold);
+	font-size: var( --font-size-h3 );
+	font-weight: var( --font-weight-semibold );
 }
 
 /* EndOfResults.less */
 .sdms-end-of-results {
-	color: var(--color-base--emphasized);
-	font-size: var(--font-size-h6);
-	font-weight: var(--font-weight-semibold);
+	color: var( --color-base--emphasized );
+	font-size: var( --font-size-h6 );
+	font-weight: var( --font-weight-semibold );
 }
 
 /* SearchFilters.less */
 .sdms-search-filters {
 	// Should show a scroll bar on pointer device so user can scroll the tabs
-	@media screen and (hover: hover) {
+	@media screen and ( hover: hover ) {
 		scrollbar-width: thin;
 
 		&::-webkit-scrollbar {
@@ -889,81 +889,81 @@
 
 	.sd-select {
 		&__content {
-			border-radius: var(--border-radius--small);
-			color: var(--color-base--emphasized);
+			border-radius: var( --border-radius--small );
+			color: var( --color-base--emphasized );
 
-			@media screen and (min-width: @width-breakpoint-tablet) {
+			@media screen and ( min-width: @width-breakpoint-tablet ) {
 				font-size: 0.875rem;
 			}
 
 			&:hover {
 				border-color: transparent;
-				background-color: var(--background-color-quiet--hover);
+				background-color: var( --background-color-quiet--hover );
 			}
 
 			&:focus {
-				border-color: var(--color-primary);
-				box-shadow: inset 0 0 0 1px var(--color-primary);
+				border-color: var( --color-primary );
+				box-shadow: inset 0 0 0 1px var( --color-primary );
 			}
 
 			&:active {
-				border-color: var(--border-color-base--darker);
-				background-color: var(--color-surface-1);
+				border-color: var( --border-color-base--darker );
+				background-color: var( --color-surface-1 );
 			}
 		}
 
 		&.sdms-search-filter--selected {
 			.sd-select__content {
-				color: var(--color-primary);
-				font-weight: var(--font-weight-semibold);
+				color: var( --color-primary );
+				font-weight: var( --font-weight-semibold );
 
 				.sd-select__handle {
-					color: var(--color-primary);
+					color: var( --color-primary );
 				}
 			}
 		}
 	}
 
 	&__namespace {
-		border-radius: var(--border-radius--small);
+		border-radius: var( --border-radius--small );
 
-		@media screen and (min-width: @width-breakpoint-tablet) {
+		@media screen and ( min-width: @width-breakpoint-tablet ) {
 			font-size: 0.875rem;
 		}
 
 		&--selected {
-			color: var(--color-primary);
-			font-weight: var(--font-weight-semibold);
+			color: var( --color-primary );
+			font-weight: var( --font-weight-semibold );
 
 			&:hover {
-				color: var(--color-primary);
+				color: var( --color-primary );
 			}
 		}
 
 		&:hover {
-			background-color: var(--background-color-quiet--hover);
+			background-color: var( --background-color-quiet--hover );
 		}
 
 		&:focus {
-			border-color: var(--color-primary);
-			box-shadow: inset 0 0 0 1px var(--color-primary);
+			border-color: var( --color-primary );
+			box-shadow: inset 0 0 0 1px var( --color-primary );
 		}
 
 		&:active {
-			border-color: var(--border-color-base--darker);
-			background-color: var(--color-surface-1);
+			border-color: var( --border-color-base--darker );
+			background-color: var( --color-surface-1 );
 		}
 	}
 
 	.sdms-search-results-count {
-		@media screen and (min-width: @width-breakpoint-tablet) {
+		@media screen and ( min-width: @width-breakpoint-tablet ) {
 			font-size: 0.875rem;
 		}
 	}
 
 	&__clear {
 		&--no-js {
-			@media screen and (min-width: @width-breakpoint-tablet) {
+			@media screen and ( min-width: @width-breakpoint-tablet ) {
 				font-size: 0.875rem;
 			}
 		}
@@ -973,22 +973,22 @@
 .sdms-search-filters-wrapper--gradient {
 	&::after {
 		// TODO: Should really make this into a LESS variable or mixin since it is useful
-		background-image: linear-gradient(to right, rgba(255, 255, 255, 0) 85%, var(--color-surface-0) 100%);
+		background-image: linear-gradient( to right, rgba( 255, 255, 255, 0 ) 85%, var( --color-surface-0 ) 100% );
 	}
 }
 
 /* DidYouMean.less */
 .sdms-did-you-mean a {
-	font-weight: var(--font-weight-semibold);
+	font-weight: var( --font-weight-semibold );
 }
 
 /* UserNotice.less */
 .sdms-user-notice__title {
-	font-weight: var(--font-weight-semibold);
+	font-weight: var( --font-weight-semibold );
 }
 
 /* SearchError.less */
 .sdms-error {
-	font-size: var(--font-size-h3);
-	font-weight: var(--font-weight-semibold);
+	font-size: var( --font-size-h3 );
+	font-weight: var( --font-weight-semibold );
 }
diff --git a/skinStyles/extensions/MobileFrontend/mobile.init.styles.less b/skinStyles/extensions/MobileFrontend/mobile.init.styles.less
index 36ff0297..f4b4a4f2 100644
--- a/skinStyles/extensions/MobileFrontend/mobile.init.styles.less
+++ b/skinStyles/extensions/MobileFrontend/mobile.init.styles.less
@@ -10,6 +10,6 @@
 
 .client-js {
 	.section-heading .mw-ui-icon {
-		opacity: var(--opacity-icon-base);
+		opacity: var( --opacity-icon-base );
 	}
 }
diff --git a/skinStyles/extensions/MsUpload/ext.MsUpload.less b/skinStyles/extensions/MsUpload/ext.MsUpload.less
index b8b59160..590de8e0 100644
--- a/skinStyles/extensions/MsUpload/ext.MsUpload.less
+++ b/skinStyles/extensions/MsUpload/ext.MsUpload.less
@@ -11,10 +11,10 @@
 #msupload {
 	&-div {
 		border-top: 0;
-		background: var(--color-surface-1);
+		background: var( --color-surface-1 );
 
 		a {
-			color: var(--color-primary);
+			color: var( --color-primary );
 		}
 	}
 
@@ -24,50 +24,50 @@
 		align-items: center;
 		justify-content: center;
 		padding: 0;
-		border-color: var(--border-color-base--darker);
+		border-color: var( --border-color-base--darker );
 		margin: 8px;
-		color: var(--color-base);
+		color: var( --color-base );
 		font-size: 0.875rem;
-		font-weight: var(--font-weight-medium);
+		font-weight: var( --font-weight-medium );
 	}
 
 	&-list {
 		.file {
-			border-top-color: var(--border-color-base);
-			background: var(--color-surface-2);
+			border-top-color: var( --border-color-base );
+			background: var( --color-surface-2 );
 
 			.file-name {
-				color: var(--color-base--emphasized);
+				color: var( --color-base--emphasized );
 
 				&:hover {
-					background-color: var(--background-color-quiet--hover);
+					background-color: var( --background-color-quiet--hover );
 				}
 
 				&:active {
-					background-color: var(--background-color-quiet--active);
+					background-color: var( --background-color-quiet--active );
 				}
 			}
 
 			.file-size {
-				color: var(--color-base--subtle);
+				color: var( --color-base--subtle );
 			}
 
 			.file-warning,
 			.file-error {
-				color: var(--color-base);
+				color: var( --color-base );
 			}
 		}
 
 		.green {
-			background-color: var(--background-color-success);
+			background-color: var( --background-color-success );
 		}
 
 		.yellow {
-			background-color: var(--background-color-warning);
+			background-color: var( --background-color-warning );
 		}
 
 		.red {
-			background-color: var(--background-color-destructive);
+			background-color: var( --background-color-destructive );
 		}
 	}
 
@@ -77,7 +77,7 @@
 		height: auto;
 		align-items: center;
 		padding: 0;
-		border-top-color: var(--border-color-base);
+		border-top-color: var( --border-color-base );
 
 		#msupload-files {
 			height: auto;
@@ -94,26 +94,26 @@
 			font-size: 0.875rem;
 
 			&:hover {
-				background-color: var(--background-color-quiet--hover);
+				background-color: var( --background-color-quiet--hover );
 			}
 
 			&:active {
-				background-color: var(--background-color-quiet--active);
+				background-color: var( --background-color-quiet--active );
 			}
 		}
 
 		.spacer {
-			border-left-color: var(--border-color-base);
-			background-color: var(--border-color-base);
+			border-left-color: var( --border-color-base );
+			background-color: var( --border-color-base );
 		}
 	}
 
 	&-select,
 	&-bottom #msupload-files {
-		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3E upload %3C/title%3E%3Cpath d='M17 12v5H3v-5H1v5a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-5z'/%3E%3Cpath d='M10 1 5 7h4v8h2V7h4z'/%3E%3C/svg%3E%0A");
+		background-image: url( data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3E upload %3C/title%3E%3Cpath d='M17 12v5H3v-5H1v5a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-5z'/%3E%3Cpath d='M10 1 5 7h4v8h2V7h4z'/%3E%3C/svg%3E%0A );
 	}
 }
 
 .drop-over {
-	background-color: var(--background-color-success);
+	background-color: var( --background-color-success );
 }
diff --git a/skinStyles/extensions/MultimediaViewer/mmv.less b/skinStyles/extensions/MultimediaViewer/mmv.less
index a78157f0..fe8294a6 100644
--- a/skinStyles/extensions/MultimediaViewer/mmv.less
+++ b/skinStyles/extensions/MultimediaViewer/mmv.less
@@ -18,13 +18,13 @@
 /* mmv.ui.dialog.less */
 .mw-mmv-dialog {
 	right: @mmv-width-toolbar;
-	border-radius: var(--border-radius--medium);
-	margin: var(--space-xs);
-	background-color: var(--color-surface-1);
-	box-shadow: var(--box-shadow-dialog);
+	border-radius: var( --border-radius--medium );
+	margin: var( --space-xs );
+	background-color: var( --color-surface-1 );
+	box-shadow: var( --box-shadow-dialog );
 
 	// The dialog will always show above the metadata in mobile view
-	@media (max-width: @width-breakpoint-tablet) {
+	@media ( max-width: @width-breakpoint-tablet ) {
 		top: unset !important;
 		right: 0 !important;
 		bottom: @mmv-height-abovethefold !important;
@@ -37,16 +37,16 @@
 		right: @mmv-width-toolbar;
 		width: 16px;
 		height: 16px;
-		background-color: var(--color-surface-1);
+		background-color: var( --color-surface-1 );
 
 		// Hide arrow since the dialog is no longer relative
-		@media (max-width: @width-breakpoint-tablet) {
+		@media ( max-width: @width-breakpoint-tablet ) {
 			display: none;
 		}
 	}
 
 	.mw-mmv-dialog-warning {
-		background-color: var(--color-warning);
+		background-color: var( --color-warning );
 	}
 }
 
@@ -55,33 +55,33 @@
 	bottom: @mmv-height-abovethefold;
 
 	.mw-mmv-reuse-tabs {
-		border-radius: var(--border-radius--medium) var(--border-radius--medium) 0 0; // Sync with dialog
-		border-bottom-color: var(--border-color-base);
+		border-radius: var( --border-radius--medium ) var( --border-radius--medium ) 0 0; // Sync with dialog
+		border-bottom-color: var( --border-color-base );
 
 		.oo-ui-optionWidget {
-			padding: var(--space-xs) var(--space-sm);
+			padding: var( --space-xs ) var( --space-sm );
 			font-size: 1rem;
-			font-weight: var(--font-weight-semibold);
+			font-weight: var( --font-weight-semibold );
 
 			&.oo-ui-optionWidget-highlighted {
 				border-bottom: 0; // border will cause reflow
-				box-shadow: inset 0 -2px 0 0 var(--color-primary--hover);
+				box-shadow: inset 0 -2px 0 0 var( --color-primary--hover );
 			}
 
 			&.oo-ui-optionWidget-selected,
 			&.oo-ui-optionWidget-highlighted.oo-ui-optionWidget-selected {
 				border-bottom: 0; // border will cause reflow
-				box-shadow: inset 0 -2px 0 0 var(--color-primary);
+				box-shadow: inset 0 -2px 0 0 var( --color-primary );
 			}
 
 			&:first-child {
-				border-radius: var(--border-radius--medium) 0 0 0;
+				border-radius: var( --border-radius--medium ) 0 0 0;
 			}
 		}
 	}
 
 	.mw-mmv-reuse-pane {
-		padding: var(--space-md);
+		padding: var( --space-md );
 	}
 
 	.mw-mmv-dialog-down-arrow {
@@ -89,7 +89,7 @@
 	}
 
 	.mw-mmv-dialog-warning {
-		padding: var(--space-md) var(--space-xl);
+		padding: var( --space-md ) var( --space-xl );
 	}
 }
 
@@ -98,28 +98,28 @@
 	bottom: @mmv-height-abovethefold;
 
 	.mw-mmv-download-size .oo-ui-optionWidget {
-		padding: var(--space-sm) var(--space-md);
+		padding: var( --space-sm ) var( --space-md );
 		font-size: 1rem;
 	}
 
 	.mw-mmv-dialog-down-arrow {
 		bottom: @mmv-height-abovethefold + @mmv-button-size + @mmv-button-size / 2;
-		background-color: var(--color-surface-1);
+		background-color: var( --color-surface-1 );
 	}
 
 	.mw-mmv-dialog-warning {
-		padding: var(--space-md) var(--space-xl);
+		padding: var( --space-md ) var( --space-xl );
 	}
 }
 
 /* mmv.ui.viewingOptions.less */
 .mw-mmv-options-dialog {
 	top: 0;
-	padding: var(--space-md);
+	padding: var( --space-md );
 
 	&.mw-mmv-enable-confirmation-shown {
-		background-color: var(--background-color-success);
-		box-shadow: var(--box-shadow-dialog);
+		background-color: var( --background-color-success );
+		box-shadow: var( --box-shadow-dialog );
 
 		// Hide arrow since those are notifications
 		.mw-mmv-dialog-down-arrow {
@@ -128,7 +128,7 @@
 	}
 
 	&.mw-mmv-disable-confirmation-shown {
-		background-color: var(--color-surface-1);
+		background-color: var( --color-surface-1 );
 
 		// Hide arrow since those are notifications
 		.mw-mmv-dialog-down-arrow {
@@ -142,34 +142,34 @@
 
 	.mw-mmv-disable-confirmation {
 		.mw-mmv-options-dialog-header {
-			color: var(--color-base--emphasized);
+			color: var( --color-base--emphasized );
 		}
 
 		.mw-mmv-options-text-header {
-			color: var(--color-base--subtle);
+			color: var( --color-base--subtle );
 		}
 	}
 
 	.mw-mmv-enable-confirmation {
 		.mw-mmv-options-dialog-header {
-			color: var(--color-base--emphasized);
+			color: var( --color-base--emphasized );
 		}
 
 		.mw-mmv-options-text-header {
-			color: var(--color-base--subtle);
+			color: var( --color-base--subtle );
 		}
 	}
 }
 
 .mw-mmv-options-submit {
-	margin-top: var(--space-md);
+	margin-top: var( --space-md );
 }
 
 // Just use flex layout
 .mw-mmv-options-subcontainer {
 	display: flex;
-	margin-top: var(--space-md);
-	gap: var(--space-sm);
+	margin-top: var( --space-md );
+	gap: var( --space-sm );
 }
 
 .mw-mmv-options-subcontainer .mw-mmv-options-text {
@@ -177,37 +177,37 @@
 }
 
 .mw-mmv-options-dialog-header {
-	margin: 0 0 var(--space-xs) 0;
-	color: var(--color-base--emphasized);
+	margin: 0 0 var( --space-xs ) 0;
+	color: var( --color-base--emphasized );
 	font-size: 1rem;
-	font-weight: var(--font-weight-semibold);
+	font-weight: var( --font-weight-semibold );
 }
 
 .mw-mmv-options-text-header {
-	color: var(--color-base);
+	color: var( --color-base );
 	font-size: 0.875rem;
 }
 
 .mw-mmv-options-text-body {
-	margin-top: var(--space-xs);
-	color: var(--color-base--subtle);
+	margin-top: var( --space-xs );
+	color: var( --color-base--subtle );
 	font-size: 0.8125rem;
 }
 
 .mw-mmv-options-enable-alert {
 	position: unset;
-	padding: var(--space-sm) var(--space-md);
+	padding: var( --space-sm ) var( --space-md );
 	margin: ~'calc( var(--space-md ) * -1)';
-	margin-bottom: var(--space-md);
-	background-color: var(--color-warning);
-	border-top-left-radius: var(--border-radius--medium);
-	border-top-right-radius: var(--border-radius--medium);
-	font-weight: var(--font-weight-semibold);
+	margin-bottom: var( --space-md );
+	background-color: var( --color-warning );
+	border-top-left-radius: var( --border-radius--medium );
+	border-top-right-radius: var( --border-radius--medium );
+	font-weight: var( --font-weight-semibold );
 }
 
 /* mmv.ui.canvas.less */
 .mw-mmv-image img {
-	@media (max-width: @width-breakpoint-tablet) {
+	@media ( max-width: @width-breakpoint-tablet ) {
 		// It is frustrating to misclick the image on mobile
 		// So that the image is not clickable on mobile
 		cursor: auto;
@@ -225,19 +225,19 @@
 .mw-mmv-next-image,
 .mw-mmv-prev-image {
 	padding: 0;
-	border-radius: var(--border-radius--small);
-	background-size: var(--size-icon);
-	opacity: var(--opacity-icon-base);
+	border-radius: var( --border-radius--small );
+	background-size: var( --size-icon );
+	opacity: var( --opacity-icon-base );
 
 	&.mw-mmv-dialog-open,
 	&:hover {
-		background-color: var(--background-color-quiet--hover);
-		opacity: var(--opacity-icon-base--hover);
+		background-color: var( --background-color-quiet--hover );
+		opacity: var( --opacity-icon-base--hover );
 	}
 
 	&:active {
-		background-color: var(--background-color-quiet--active);
-		opacity: var(--opacity-icon-base--active);
+		background-color: var( --background-color-quiet--active );
+		opacity: var( --opacity-icon-base--active );
 	}
 }
 
@@ -306,8 +306,8 @@
 /* mmv.ui.permission.less */
 .mw-mmv-permission-box {
 	width: auto; // We use grid to align metadata so no need to hardcode
-	margin: var(--space-md) 0 0 0;
-	background-color: var(--color-surface-2) !important; // Somehow there is an inline style overriding it
+	margin: var( --space-md ) 0 0 0;
+	background-color: var( --color-surface-2 ) !important; // Somehow there is an inline style overriding it
 
 	&.empty {
 		display: none;
@@ -315,21 +315,21 @@
 
 	h3 {
 		margin: 0;
-		color: var(--color-base--subtle);
+		color: var( --color-base--subtle );
 		font-size: 0.8125rem;
-		font-weight: var(--font-weight-normal);
+		font-weight: var( --font-weight-normal );
 		letter-spacing: 0.05em;
 	}
 
 	// Make button bigger and aligned
 	.mw-mmv-permission-close {
-		top: var(--space-xs);
-		right: var(--space-xs);
+		top: var( --space-xs );
+		right: var( --space-xs );
 		width: 2rem;
 		height: 2rem;
-		padding: var(--space-xs);
+		padding: var( --space-xs );
 		border: 0;
-		border-radius: var(--border-radius--small);
+		border-radius: var( --border-radius--small );
 		background-color: transparent;
 		background-position: center;
 		background-repeat: no-repeat;
@@ -337,32 +337,32 @@
 
 		// Add hover state
 		&:hover {
-			background-color: var(--background-color-quiet--hover);
+			background-color: var( --background-color-quiet--hover );
 		}
 
 		&:active {
-			background-color: var(--background-color-quiet--active);
+			background-color: var( --background-color-quiet--active );
 		}
 	}
 
 	.mw-mmv-permission-text {
 		.mw-mmv-permission-text-fader {
 			top: 2.7em;
-			background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, var(--color-surface-1) 100%);
+			background-image: linear-gradient( to bottom, rgba( 255, 255, 255, 0 ) 0%, var( --color-surface-1 ) 100% );
 
 			a {
 				padding-top: 2px;
-				background-color: var(--color-surface-1);
+				background-color: var( --color-surface-1 );
 			}
 		}
 	}
 
 	.mw-mmv-permission-text,
 	.mw-mmv-permission-html {
-		margin: var(--space-xxs) 0 0 0;
-		color: var(--color-base);
+		margin: var( --space-xxs ) 0 0 0;
+		color: var( --color-base );
 		font-size: 0.8125rem;
-		line-height: var(--line-height-sm);
+		line-height: var( --line-height-sm );
 	}
 
 	.mw-mmv-permission-html {
@@ -386,10 +386,10 @@
 
 .mw-mmv-progress-percent {
 	height: 2px;
-	background: linear-gradient(-45deg, transparent 33%, rgba(0, 0, 0, 0.1) 33%, rgba(0, 0, 0, 0.1) 66%, transparent 66%), var(--color-primary);
-	border-bottom-right-radius: var(--border-radius--large);
-	border-top-right-radius: var(--border-radius--large);
-	filter: drop-shadow(0 0 16px var(--color-primary));
+	background: linear-gradient( -45deg, transparent 33%, rgba( 0, 0, 0, 0.1 ) 33%, rgba( 0, 0, 0, 0.1 ) 66%, transparent 66% ), var( --color-primary );
+	border-bottom-right-radius: var( --border-radius--large );
+	border-top-right-radius: var( --border-radius--large );
+	filter: drop-shadow( 0 0 16px var( --color-primary ) );
 }
 
 /* mmv.ui.stripeButtons.less */
@@ -397,7 +397,7 @@
 	font-size: 0.875rem;
 
 	// Icon only button for smaller screen size
-	@media (max-width: @width-breakpoint-tablet) {
+	@media ( max-width: @width-breakpoint-tablet ) {
 		text-indent: -9999px;
 
 		&::before {
@@ -413,8 +413,8 @@
 		max-width: none;
 		align-items: center;
 		justify-content: center;
-		padding: 0 var(--space-sm);
-		margin: var(--space-md);
+		padding: 0 var( --space-sm );
+		margin: var( --space-md );
 		float: none;
 		font-size: 0.875rem;
 		white-space: nowrap;
@@ -426,10 +426,10 @@
 
 /* mmv.ui.metadataPanel.less */
 .mw-mmv-info-box {
-	padding: var(--space-md);
+	padding: var( --space-md );
 	border: 0;
-	border-radius: var(--border-radius--medium);
-	background-color: var(--color-surface-2);
+	border-radius: var( --border-radius--medium );
+	background-color: var( --color-surface-2 );
 }
 
 .mw-mmv-title-para {
@@ -439,8 +439,8 @@
 	flex-grow: 1;
 	order: -1; // Reorder because we use flex in container
 	padding: 0;
-	margin: var(--space-xl) var(--space-md) var(--space-md) var(--space-md);
-	line-height: var(--line-height-sm);
+	margin: var( --space-xl ) var( --space-md ) var( --space-md ) var( --space-md );
+	line-height: var( --line-height-sm );
 	// Enforce single line
 	white-space: nowrap;
 
@@ -451,7 +451,7 @@
 
 	&.mw-mmv-title-smaller {
 		padding: 0;
-		margin: var(--space-md);
+		margin: var( --space-md );
 	}
 
 	// Enforce consistent sizing
@@ -460,7 +460,7 @@
 	&.mw-mmv-title-smaller {
 		font-size: 1rem;
 
-		@media (max-width: @width-breakpoint-tablet) {
+		@media ( max-width: @width-breakpoint-tablet ) {
 			font-size: 0.875rem;
 		}
 	}
@@ -475,10 +475,10 @@
 	height: auto !important;
 	padding: 0;
 	margin: 0;
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 	font-size: 0.875rem;
 
-	@media (max-width: @width-breakpoint-tablet) {
+	@media ( max-width: @width-breakpoint-tablet ) {
 		font-size: 0.8125rem;
 	}
 
@@ -489,12 +489,12 @@
 }
 
 .mw-mmv-source-author {
-	line-height: var(--line-height-xs);
+	line-height: var( --line-height-xs );
 }
 
 .mw-mmv-title {
 	.mw-mmv-untruncated & {
-		color: var(--color-base--emphasized);
+		color: var( --color-base--emphasized );
 	}
 }
 
@@ -507,22 +507,22 @@
 	/* stylelint-disable-next-line declaration-block-no-duplicate-properties */
 	display: grid;
 	width: auto;
-	padding: 0 var(--space-md) var(--space-md) var(--space-md);
+	padding: 0 var( --space-md ) var( --space-md ) var( --space-md );
 	border-top: 0;
 	margin-top: -4px;
 	// Sync with title
-	gap: var(--space-xs);
+	gap: var( --space-xs );
 	grid-template-areas:
- 		'desc links'
+ 'desc links'
 		'about about';
 	grid-template-columns: 2fr 1fr;
 	transition: @transition-background;
 
 	.mw-mmv-untruncated & {
 		background-color: transparent;
-		gap: var(--space-xl);
+		gap: var( --space-xl );
 
-		@media (max-width: @width-breakpoint-tablet) {
+		@media ( max-width: @width-breakpoint-tablet ) {
 			grid-template-areas:
  'desc desc'
 				'links links'
@@ -558,18 +558,18 @@
 	li {
 		font-size: 0.875rem;
 
-		@media (max-width: @width-breakpoint-tablet) {
+		@media ( max-width: @width-breakpoint-tablet ) {
 			font-size: 0.8125rem;
 		}
 
 		+ li {
-			margin-top: var(--space-xs);
+			margin-top: var( --space-xs );
 		}
 
 		// Reset hardcoded styles
 		.metadata-panel-is-closed &.mw-mmv-license-li {
 			height: auto;
-			line-height: var(--line-height-xs);
+			line-height: var( --line-height-xs );
 		}
 	}
 }
@@ -585,16 +585,16 @@
 }
 
 .mw-mmv-label {
-	background-color: var(--color-surface-3);
-	color: var(--color-base);
+	background-color: var( --color-surface-3 );
+	color: var( --color-base );
 	font-size: 0.8125rem;
 
 	&:hover {
-		background-color: var(--color-surface-2--hover);
+		background-color: var( --color-surface-2--hover );
 	}
 
 	&:active {
-		background-color: var(--color-surface-2--active);
+		background-color: var( --color-surface-2--active );
 	}
 }
 
@@ -608,28 +608,28 @@
 // Only apply background color when scroll up
 .mw-mmv-post-image {
 	min-height: @mmv-height-abovethefold;
-	border-top-left-radius: var(--border-radius--large);
-	border-top-right-radius: var(--border-radius--large);
+	border-top-left-radius: var( --border-radius--large );
+	border-top-right-radius: var( --border-radius--large );
 	transition: @transition-background, @transition-color;
 
 	&.mw-mmv-untruncated {
-		background-color: var(--color-surface-1);
+		background-color: var( --color-surface-1 );
 		box-shadow: none; // We already have top border
-		color: var(--color-base);
+		color: var( --color-base );
 	}
 
 	// Add scroll up affordance
 	// On touch device, when user drag/swipe the indicator, it will cause the
 	// page to scroll up and show the card below.
-	@media (hover: none) {
+	@media ( hover: none ) {
 		&::before {
 			position: absolute;
-			top: var(--space-xs);
+			top: var( --space-xs );
 			right: 0;
 			left: 0;
 			width: 40px;
 			height: 4px;
-			border-radius: var(--border-radius--pill);
+			border-radius: var( --border-radius--pill );
 			margin: 0 auto;
 			background-color: ~'rgba( 255, 255, 255, var( --opacity-icon-base ) )';
 			content: '';
@@ -638,7 +638,7 @@
 		&.mw-mmv-untruncated {
 			// Since background color is dependent on theme now
 			&::before {
-				background-color: var(--border-color-base--darker);
+				background-color: var( --border-color-base--darker );
 			}
 		}
 	}
@@ -648,5 +648,5 @@
 	display: flex; // let's use flex instead of float
 	height: auto; // avoid layout shift when scroll up
 	padding-bottom: 0; // let metadata handle the padding
-	gap: var(--space-xs);
+	gap: var( --space-xs );
 }
diff --git a/skinStyles/extensions/MultimediaViewer/mmv.ui.download.pane.less b/skinStyles/extensions/MultimediaViewer/mmv.ui.download.pane.less
index 60c829b4..9a7c48e6 100644
--- a/skinStyles/extensions/MultimediaViewer/mmv.ui.download.pane.less
+++ b/skinStyles/extensions/MultimediaViewer/mmv.ui.download.pane.less
@@ -16,7 +16,7 @@
 	.mw-mmv-download-area {
 		display: flex;
 		width: auto;
-		padding: var(--space-md);
+		padding: var( --space-md );
 
 		.mw-mmv-download-go-button {
 			border-bottom-right-radius: 0;
@@ -25,7 +25,7 @@
 
 		/* Selection size arrow element */
 		.mw-mmv-download-select-menu {
-			border-left-color: var(--border-color-base);
+			border-left-color: var( --border-color-base );
 
 			&:hover {
 				border-bottom: 0;
@@ -40,22 +40,22 @@
 			display: flex;
 			align-items: center;
 			margin: 0;
-			color: var(--color-base--subtle);
-			font-weight: var(--font-weight-semibold);
+			color: var( --color-base--subtle );
+			font-weight: var( --font-weight-semibold );
 
 			// Add hover state
 			&:hover {
-				color: var(--color-primary--hover);
+				color: var( --color-primary--hover );
 			}
 
 			&:active {
-				color: var(--color-primary--active);
+				color: var( --color-primary--active );
 			}
 		}
 
 		/* Pulldown size menu */
 		.mw-mmv-download-size {
-			margin-right: var(--space-md);
+			margin-right: var( --space-md );
 
 			.oo-ui-labelElement-label {
 				margin-left: 0; // There is no icon
@@ -64,28 +64,28 @@
 	}
 
 	.mw-mmv-download-attribution {
-		padding: var(--space-md);
-		border-top: 1px solid var(--border-color-base);
+		padding: var( --space-md );
+		border-top: 1px solid var( --border-color-base );
 		margin: 0;
-		background-color: var(--color-surface-2);
-		border-bottom-left-radius: var(--border-radius--medium);
-		border-bottom-right-radius: var(--border-radius--medium);
-		color: var(--color-base--emphasized);
+		background-color: var( --color-surface-2 );
+		border-bottom-left-radius: var( --border-radius--medium );
+		border-bottom-right-radius: var( --border-radius--medium );
+		color: var( --color-base--emphasized );
 
 		&:hover {
-			background-color: var(--color-surface-2--hover);
-			color: var(--color-base--emphasized);
+			background-color: var( --color-surface-2--hover );
+			color: var( --color-base--emphasized );
 		}
 
 		&:active {
-			background-color: var(--color-surface-2--active);
+			background-color: var( --color-surface-2--active );
 		}
 
 		&-how {
 			padding: 0;
 
 			.mw-mmv-download-attribution-close-button {
-				top: var(--space-xxs);
+				top: var( --space-xxs );
 				margin: 0;
 				background-size: contain;
 			}
@@ -94,11 +94,11 @@
 		&-how-header,
 		&-cta-header {
 			font-size: 1rem;
-			font-weight: var(--font-weight-semibold);
+			font-weight: var( --font-weight-semibold );
 		}
 
 		&-cta-invite {
-			color: var(--color-primary);
+			color: var( --color-primary );
 			font-size: 0.8125rem;
 		}
 
@@ -109,5 +109,5 @@
 }
 
 .mw-mmv-reuse-dialog.mw-mmv-reuse-download-active .mw-mmv-reuse-down-arrow {
-	background-color: var(--color-surface-2);
+	background-color: var( --color-surface-2 );
 }
diff --git a/skinStyles/extensions/MultimediaViewer/mmv.ui.reuse.shareembed.less b/skinStyles/extensions/MultimediaViewer/mmv.ui.reuse.shareembed.less
index c45cd9fa..62fd7a66 100644
--- a/skinStyles/extensions/MultimediaViewer/mmv.ui.reuse.shareembed.less
+++ b/skinStyles/extensions/MultimediaViewer/mmv.ui.reuse.shareembed.less
@@ -10,15 +10,15 @@
 
 /* mmv.ui.reuse.embed.less */
 .mw-mmv-reuse-dialog .mw-mmv-embed-pane {
-	padding: var(--space-md);
+	padding: var( --space-md );
 }
 
 .mw-mmv-embed-dimensions {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 	font-size: 0.8125rem;
 
 	.oo-ui-optionWidget-selected & {
-		color: var(--color-primary);
+		color: var( --color-primary );
 	}
 }
 
diff --git a/skinStyles/extensions/OAuth/ext.MWOAuth.styles.less b/skinStyles/extensions/OAuth/ext.MWOAuth.styles.less
index 62bfd795..7bf0bc57 100644
--- a/skinStyles/extensions/OAuth/ext.MWOAuth.styles.less
+++ b/skinStyles/extensions/OAuth/ext.MWOAuth.styles.less
@@ -11,44 +11,44 @@
 /* ext.MWOAuth.BasicStyles.css */
 .mw-mwoauthconsumerregistration-body,
 .mw-mwoauthmanageconsumers-body {
-	background-color: var(--color-surface-2);
+	background-color: var( --color-surface-2 );
 }
 
 .mw-mwoauthmanageconsumers-proposed,
 .mw-mwoauthmanagemygrants-proposed,
 .mw-mwoauthconsumerregistration-proposed {
-	background-color: var(--background-color-primary--hover);
+	background-color: var( --background-color-primary--hover );
 }
 
 .mw-mwoauthmanageconsumers-rejected,
 .mw-mwoauthmanagemygrants-rejected,
 .mw-mwoauthconsumerregistration-rejected {
-	background-color: var(--background-color-destructive);
+	background-color: var( --background-color-destructive );
 }
 
 .mw-mwoauthmanageconsumers-expired,
 .mw-mwoauthmanagemygrants-expired,
 .mw-mwoauthconsumerregistration-expired {
-	background-color: var(--background-color-warning);
+	background-color: var( --background-color-warning );
 }
 
 .mw-mwoauthmanageconsumers-approved,
 .mw-mwoauthmanagemygrants-approved,
 .mw-mwoauthconsumerregistration-approved {
-	background-color: var(--background-color-success);
+	background-color: var( --background-color-success );
 }
 
 .mw-mwoauthmanageconsumers-disabled,
 .mw-mwoauthmanagemygrants-disabled,
 .mw-mwoauthconsumerregistration-disabled {
-	background-color: var(--color-surface-3);
+	background-color: var( --color-surface-3 );
 }
 
 .mw-mwoautherror-details {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 /* ext.MWOAuth.AuthorizeForm.css */
 #mw-mwoauth-authorize-form {
-	color: var(--color-base);
+	color: var( --color-base );
 }
diff --git a/skinStyles/extensions/Popups/ext.popups.main.less b/skinStyles/extensions/Popups/ext.popups.main.less
index 59564e33..0d1aa598 100644
--- a/skinStyles/extensions/Popups/ext.popups.main.less
+++ b/skinStyles/extensions/Popups/ext.popups.main.less
@@ -14,135 +14,135 @@
 .mwe-popups {
 	// See FIXME below
 	// border-radius: var( --border-radius--medium );
-	background: var(--color-surface-1);
-	box-shadow: var(--box-shadow-dialog);
+	background: var( --color-surface-1 );
+	box-shadow: var( --box-shadow-dialog );
 
 	.mwe-popups-container {
-		color: var(--color-base);
+		color: var( --color-base );
 	}
 
 	.mwe-popups-settings-icon {
-		border-radius: var(--border-radius--small);
-		opacity: var(--opacity-icon-base);
+		border-radius: var( --border-radius--small );
+		opacity: var( --opacity-icon-base );
 
 		&:hover {
-			background-color: var(--background-color-quiet--hover);
-			opacity: var(--opacity-icon-base--hover);
+			background-color: var( --background-color-quiet--hover );
+			opacity: var( --opacity-icon-base--hover );
 		}
 
 		&:active {
-			background-color: var(--background-color-quiet--active);
-			opacity: var(--opacity-icon-base--active);
+			background-color: var( --background-color-quiet--active );
+			opacity: var( --opacity-icon-base--active );
 		}
 	}
 
 	.mwe-popups-extract {
-		color: var(--color-base);
+		color: var( --color-base );
 
-		&[dir='ltr']::after {
+		&[ dir='ltr' ]::after {
 			/* @noflip */
-			background-image: linear-gradient(to right, transparent, var(--color-surface-1) 50%);
+			background-image: linear-gradient( to right, transparent, var( --color-surface-1 ) 50% );
 		}
 
-		&[dir='rtl']::after {
+		&[ dir='rtl' ]::after {
 			/* @noflip */
-			background-image: linear-gradient(to left, transparent, var(--color-surface-1) 50%);
+			background-image: linear-gradient( to left, transparent, var( --color-surface-1 ) 50% );
 		}
 
 		blockquote::after {
 			/* @noflip */
-			background-image: linear-gradient(to bottom, transparent, var(--color-surface-1) 75%);
+			background-image: linear-gradient( to bottom, transparent, var( --color-surface-1 ) 75% );
 		}
 
 		&.mwe-popups-type-generic,
 		&.mwe-popups-type-disambiguation {
 			.mwe-popups-read-link {
-				font-weight: var(--font-weight-semibold);
+				font-weight: var( --font-weight-semibold );
 			}
 		}
 
 		&.mwe-popups-no-image-pointer {
 			&::before {
-				border-bottom-color: var(--border-color-base);
+				border-bottom-color: var( --border-color-base );
 			}
 
 			&::after {
-				border-bottom-color: var(--color-surface-1);
+				border-bottom-color: var( --color-surface-1 );
 			}
 		}
 
 		&.mwe-popups-image-pointer {
 			&::before {
-				border-bottom-color: var(--border-color-base);
+				border-bottom-color: var( --border-color-base );
 			}
 
 			&::after {
-				border-bottom-color: var(--color-surface-1);
+				border-bottom-color: var( --color-surface-1 );
 			}
 
 			&.flipped-x {
 				&::before {
-					border-bottom-color: var(--border-color-base);
+					border-bottom-color: var( --border-color-base );
 				}
 
 				&::after {
-					border-bottom-color: var(--color-surface-1);
+					border-bottom-color: var( --color-surface-1 );
 				}
 			}
 		}
 
 		&.flipped-x.mwe-popups-is-tall {
 			&::before {
-				border-bottom-color: var(--border-color-base);
+				border-bottom-color: var( --border-color-base );
 			}
 		}
 
 		&.flipped-x-y {
 			&::before {
-				border-top-color: var(--border-color-base);
+				border-top-color: var( --border-color-base );
 			}
 
 			&::after {
-				border-top-color: var(--color-surface-1);
+				border-top-color: var( --color-surface-1 );
 			}
 
 			&.mwe-popups-is-tall {
 				&::before {
-					border-top-color: var(--border-color-base);
+					border-top-color: var( --border-color-base );
 				}
 
 				&::after {
-					border-top-color: var(--color-surface-1);
+					border-top-color: var( --color-surface-1 );
 				}
 			}
 		}
 
 		&.flipped-y {
 			&::before {
-				border-top-color: var(--border-color-base);
+				border-top-color: var( --border-color-base );
 			}
 
 			&::after {
-				border-top-color: var(--color-surface-1);
+				border-top-color: var( --color-surface-1 );
 			}
 		}
 	}
 
 	/* preview.less */
 	.mwe-popups-title {
-		font-weight: var(--font-weight-semibold);
+		font-weight: var( --font-weight-semibold );
 	}
 
 	/* referencePreview.less */
 	&.mwe-popups-type-reference {
 		.mwe-popups-extract {
 			.mwe-popups-fade {
-				background-image: linear-gradient(transparent, var(--color-surface-1));
+				background-image: linear-gradient( transparent, var( --color-surface-1 ) );
 			}
 		}
 
 		.mwe-collapsible-placeholder {
-			font-weight: var(--font-weight-semibold);
+			font-weight: var( --font-weight-semibold );
 		}
 	}
 }
@@ -150,7 +150,7 @@
 @supports ( clip-path: polygon( 1px 1px ) ) {
 	.mwe-popups {
 		.mwe-popups-container {
-			background: var(--color-surface-1);
+			background: var( --color-surface-1 );
 			// FIXME: Come up with a clip path that works with increased border radius
 			// Popups is using polygon to clip the card
 			// So the thumbnail corner would look weird if we adjust the border radius
@@ -161,42 +161,42 @@
 
 /* settingsDialog.less */
 #mwe-popups-settings {
-	border-color: var(--border-color-base);
-	border-radius: var(--border-radius--medium);
-	background: var(--color-surface-1);
-	box-shadow: var(--box-shadow-dialog);
+	border-color: var( --border-color-base );
+	border-radius: var( --border-radius--medium );
+	background: var( --color-surface-1 );
+	box-shadow: var( --box-shadow-dialog );
 
 	header {
-		border-bottom-color: var(--border-color-base);
+		border-bottom-color: var( --border-color-base );
 
 		h1 {
-			font-family: var(--fonts-sans);
-			font-weight: var(--font-weight-semibold);
+			font-family: var( --fonts-sans );
+			font-weight: var( --font-weight-semibold );
 		}
 	}
 
 	.mwe-ui-icon-popups-close {
-		opacity: var(--opacity-icon-base);
+		opacity: var( --opacity-icon-base );
 
 		&:hover {
-			opacity: var(--opacity-icon-base--hover);
+			opacity: var( --opacity-icon-base--hover );
 		}
 
 		&:active {
-			opacity: var(--opacity-icon-base--active);
+			opacity: var( --opacity-icon-base--active );
 		}
 	}
 
 	main#mwe-popups-settings-form {
 		p {
-			color: var(--color-base--subtle);
+			color: var( --color-base--subtle );
 		}
 
 		form {
 			label {
 				> span {
-					color: var(--color-base--emphasized);
-					font-weight: var(--font-weight-semibold);
+					color: var( --color-base--emphasized );
+					font-weight: var( --font-weight-semibold );
 				}
 			}
 		}
@@ -205,11 +205,11 @@
 
 /* settingsDialogRenderer.less */
 .mwe-popups-overlay {
-	background-color: var(--background-color-overlay);
+	background-color: var( --background-color-overlay );
 }
 
 // Responsive support
-@media (max-width: @width-breakpoint-tablet) {
+@media ( max-width: @width-breakpoint-tablet ) {
 	.mwe-popups {
 		position: fixed;
 		top: auto !important;
@@ -218,14 +218,14 @@
 		left: 0 !important;
 		overflow: hidden; // Hide pointer and also rounded corners
 		width: auto !important;
-		border-radius: var(--border-radius--medium) var(--border-radius--medium) 0 0;
+		border-radius: var( --border-radius--medium ) var( --border-radius--medium ) 0 0;
 
 		// Top aligned cards
 		&.flipped-x-y,
 		&.flipped-y {
 			top: 0 !important;
 			bottom: auto !important;
-			border-radius: 0 0 var(--border-radius--medium) var(--border-radius--medium);
+			border-radius: 0 0 var( --border-radius--medium ) var( --border-radius--medium );
 		}
 
 		.mwe-popups-container {
@@ -246,7 +246,7 @@
 			.mwe-popups-extract {
 				min-height: auto;
 				max-height: 58px;
-				margin-bottom: var(--space-xl);
+				margin-bottom: var( --space-xl );
 			}
 		}
 	}
diff --git a/skinStyles/extensions/PortableInfobox/ext.PortableInfobox.styles.less b/skinStyles/extensions/PortableInfobox/ext.PortableInfobox.styles.less
index 44ef69c3..b8b2889e 100644
--- a/skinStyles/extensions/PortableInfobox/ext.PortableInfobox.styles.less
+++ b/skinStyles/extensions/PortableInfobox/ext.PortableInfobox.styles.less
@@ -9,9 +9,9 @@
 */
 
 :root {
-	--pi-background: var(--color-surface-2);
-	--pi-border-color: var(--border-color-base--darker);
-	--pi-secondary-background: var(--color-surface-3);
+	--pi-background: var( --color-surface-2 );
+	--pi-border-color: var( --border-color-base--darker );
+	--pi-secondary-background: var( --color-surface-3 );
 }
 
 .portable-infobox .pi-horizontal-group {
@@ -21,30 +21,30 @@
 .portable-infobox .pi-section-navigation,
 .portable-infobox .pi-media-collection-tabs {
 	padding-bottom: 0;
-	background-color: var(--color-surface-3);
+	background-color: var( --color-surface-3 );
 }
 
 .pi-section-navigation .pi-section-tab.pi-section-active,
 .pi-section-navigation .pi-section-tab.current,
 .pi-media-collection .pi-tab-link.current {
-	border-color: var(--color-primary);
+	border-color: var( --color-primary );
 	border-bottom-width: 0;
-	background: var(--color-surface-2);
+	background: var( --color-surface-2 );
 }
 
 .pi-section-navigation .pi-section-tab,
 .pi-media-collection .pi-tab-link {
 	border-width: 2px;
 	margin: 0 4px;
-	background: var(--color-surface-2);
-	border-top-left-radius: var(--border-radius--medium);
-	border-top-right-radius: var(--border-radius--medium);
+	background: var( --color-surface-2 );
+	border-top-left-radius: var( --border-radius--medium );
+	border-top-right-radius: var( --border-radius--medium );
 
 	&:hover {
-		border-color: var(--color-primary--hover);
+		border-color: var( --color-primary--hover );
 	}
 
 	&:active {
-		border-color: var(--color-primary--active);
+		border-color: var( --color-primary--active );
 	}
 }
diff --git a/skinStyles/extensions/RelatedArticles/ext.relatedArticles.readMore.less b/skinStyles/extensions/RelatedArticles/ext.relatedArticles.readMore.less
index 6d61e1d8..245065a3 100644
--- a/skinStyles/extensions/RelatedArticles/ext.relatedArticles.readMore.less
+++ b/skinStyles/extensions/RelatedArticles/ext.relatedArticles.readMore.less
@@ -11,70 +11,70 @@
 @import '../../../resources/variables.less';
 
 .ra-read-more {
-	max-width: var(--width-layout--extended);
-	padding: var(--space-md) 0 0;
+	max-width: var( --width-layout--extended );
+	padding: var( --space-md ) 0 0;
 	margin-right: auto;
 	margin-left: auto;
 
 	h2 {
 		padding-bottom: 0;
 		margin-top: 0;
-		color: var(--color-base--subtle);
+		color: var( --color-base--subtle );
 		font-size: 0.8125rem;
-		font-weight: var(--font-weight-normal);
+		font-weight: var( --font-weight-normal );
 		letter-spacing: 0.05em;
 		text-transform: none;
 	}
 }
 
 .ext-related-articles-card-list {
-	gap: var(--space-xs);
+	gap: var( --space-xs );
 
 	h3 {
-		font-weight: var(--font-weight-semibold);
-		line-height: var(--line-height-xs);
+		font-weight: var( --font-weight-semibold );
+		line-height: var( --line-height-xs );
 
 		a {
-			color: var(--color-base--emphasized);
+			color: var( --color-base--emphasized );
 		}
 
 		&::after {
-			background-image: linear-gradient(to right, rgba(255, 255, 255, 0), var(--color-surface-1) 50%);
+			background-image: linear-gradient( to right, rgba( 255, 255, 255, 0 ), var( --color-surface-1 ) 50% );
 		}
 	}
 
 	.ext-related-articles-card {
 		overflow: hidden; // Enforce rounded corner
 		border: 0 !important; // No border regardless
-		border-radius: var(--border-radius--medium) !important; // Same border-radius regardless
-		background-color: var(--color-surface-1);
+		border-radius: var( --border-radius--medium ) !important; // Same border-radius regardless
+		background-color: var( --color-surface-1 );
 	}
 
 	.ext-related-articles-card > a {
 		&:hover {
-			background-color: var(--background-color-quiet--hover);
-			box-shadow: var(--box-shadow-card); // reset
+			background-color: var( --background-color-quiet--hover );
+			box-shadow: var( --box-shadow-card ); // reset
 		}
 
 		&:active {
-			background-color: var(--background-color-quiet--active);
+			background-color: var( --background-color-quiet--active );
 		}
 	}
 
 	.ext-related-articles-card-extract {
-		margin-top: var(--space-xxs);
-		color: var(--color-base--subtle);
+		margin-top: var( --space-xxs );
+		color: var( --color-base--subtle );
 		font-size: 0.8125rem;
 	}
 
 	.ext-related-articles-card-thumb {
-		margin-right: var(--space-sm);
+		margin-right: var( --space-sm );
 	}
 }
 
-@media all and (min-width: @width-breakpoint-tablet) {
+@media all and ( min-width: @width-breakpoint-tablet ) {
 	.ext-related-articles-card-list {
-		gap: var(--space-sm);
+		gap: var( --space-sm );
 
 		.ext-related-articles-card {
 			// Magic
diff --git a/skinStyles/extensions/RelatedArticles/ext.relatedArticles.styles.less b/skinStyles/extensions/RelatedArticles/ext.relatedArticles.styles.less
index fb75332f..60bf02c9 100644
--- a/skinStyles/extensions/RelatedArticles/ext.relatedArticles.styles.less
+++ b/skinStyles/extensions/RelatedArticles/ext.relatedArticles.styles.less
@@ -13,9 +13,9 @@
 .client-js {
 	.read-more-container {
 		min-height: auto;
-		padding: 0 var(--padding-page);
+		padding: 0 var( --padding-page );
 
-		@media (min-width: @width-breakpoint-desktop) {
+		@media ( min-width: @width-breakpoint-desktop ) {
 			min-height: auto;
 		}
 	}
diff --git a/skinStyles/extensions/RevisionSlider/ext.RevisionSlider.init.less b/skinStyles/extensions/RevisionSlider/ext.RevisionSlider.init.less
index 77e30325..6e2e5b22 100644
--- a/skinStyles/extensions/RevisionSlider/ext.RevisionSlider.init.less
+++ b/skinStyles/extensions/RevisionSlider/ext.RevisionSlider.init.less
@@ -9,29 +9,29 @@
 */
 
 .mw-revslider-revision {
-	border-color: var(--color-surface-3);
-	background-color: var(--color-surface-3);
+	border-color: var( --color-surface-3 );
+	background-color: var( --color-surface-3 );
 }
 
 .mw-revslider-revision-new,
 .mw-revslider-revision-old,
 .mw-revslider-revision-intermediate {
 	.mw-revslider-revision {
-		border-color: var(--color-surface-0);
+		border-color: var( --color-surface-0 );
 	}
 }
 
 .mw-revslider-revision-border-box {
-	border-left-color: var(--color-surface-0);
+	border-left-color: var( --color-surface-0 );
 }
 
 .mw-revslider-revision-wrapper {
 	&:hover,
 	&-hovered {
-		background-color: var(--background-color-quiet--hover);
+		background-color: var( --background-color-quiet--hover );
 	}
 
 	&:active {
-		background-color: var(--background-color-quiet--active);
+		background-color: var( --background-color-quiet--active );
 	}
 }
diff --git a/skinStyles/extensions/RevisionSlider/ext.RevisionSlider.lazyCss.less b/skinStyles/extensions/RevisionSlider/ext.RevisionSlider.lazyCss.less
index 55380312..a5e42d49 100644
--- a/skinStyles/extensions/RevisionSlider/ext.RevisionSlider.lazyCss.less
+++ b/skinStyles/extensions/RevisionSlider/ext.RevisionSlider.lazyCss.less
@@ -9,17 +9,17 @@
 */
 
 .mw-revslider-container {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 }
 
 .mw-revslider-slider-wrapper {
-	border-top-color: var(--border-color-base);
+	border-top-color: var( --border-color-base );
 }
 
 .mw-revslider-spinner {
 	.mw-revslider-bounce,
 	&::before,
 	&::after {
-		background-color: var(--color-primary);
+		background-color: var( --color-primary );
 	}
 }
diff --git a/skinStyles/extensions/SemanticMediaWiki/ext.jquery.atwho.less b/skinStyles/extensions/SemanticMediaWiki/ext.jquery.atwho.less
index a75effbc..9fa28c6b 100644
--- a/skinStyles/extensions/SemanticMediaWiki/ext.jquery.atwho.less
+++ b/skinStyles/extensions/SemanticMediaWiki/ext.jquery.atwho.less
@@ -11,28 +11,28 @@
 /* jquery/jquery.atwho.css */
 .atwho-view {
 	border: 0;
-	border-radius: var(--border-radius--small);
-	background: var(--color-surface-1);
-	box-shadow: var(--box-shadow-dialog);
-	color: var(--color-base);
+	border-radius: var( --border-radius--small );
+	background: var( --color-surface-1 );
+	box-shadow: var( --box-shadow-dialog );
+	color: var( --color-base );
 }
 
 .atwho-view .atwho-header {
-	border-bottom-color: var(--border-color-base);
-	color: var(--color-base);
+	border-bottom-color: var( --border-color-base );
+	color: var( --color-base );
 }
 
 .atwho-view .atwho-header .small {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .atwho-view .cur {
-	background: var(--color-primary);
+	background: var( --color-primary );
 	color: #fff;
 }
 
 .atwho-view strong {
-	color: var(--color-base--emphasized);
+	color: var( --color-base--emphasized );
 }
 
 .atwho-view .cur strong {
@@ -44,5 +44,5 @@
 }
 
 .atwho-view small {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
diff --git a/skinStyles/extensions/SemanticMediaWiki/ext.libs.tippy.less b/skinStyles/extensions/SemanticMediaWiki/ext.libs.tippy.less
index 2c49f16a..f2589ac5 100644
--- a/skinStyles/extensions/SemanticMediaWiki/ext.libs.tippy.less
+++ b/skinStyles/extensions/SemanticMediaWiki/ext.libs.tippy.less
@@ -14,99 +14,99 @@
 /* libs/tippy/light-border.css */
 .tippy-tooltip.light-border-theme {
 	border: 0;
-	border-radius: var(--border-radius--small);
-	background-color: var(--color-surface-1);
-	box-shadow: var(--box-shadow-dialog);
-	color: var(--color-base);
+	border-radius: var( --border-radius--small );
+	background-color: var( --color-surface-1 );
+	box-shadow: var( --box-shadow-dialog );
+	color: var( --color-base );
 }
 
 .tippy-tooltip.light-border-theme .tippy-backdrop {
-	background-color: var(--color-surface-1);
+	background-color: var( --color-surface-1 );
 }
 
 .tippy-tooltip.light-border-theme .tippy-roundarrow {
-	fill: var(--color-surface-1);
+	fill: var( --color-surface-1 );
 }
 
 .tippy-tooltip.light-border-theme .tippy-roundarrow::after {
 	fill: transparent;
 }
 
-.tippy-tooltip.light-border-theme[x-placement^='top'] .tippy-arrow {
-	border-top-color: var(--color-surface-1);
+.tippy-tooltip.light-border-theme[ x-placement^='top' ] .tippy-arrow {
+	border-top-color: var( --color-surface-1 );
 }
 
-.tippy-tooltip.light-border-theme[x-placement^='top'] .tippy-arrow::after {
-	border-top-color: var(--color-surface-1);
+.tippy-tooltip.light-border-theme[ x-placement^='top' ] .tippy-arrow::after {
+	border-top-color: var( --color-surface-1 );
 }
 
-.tippy-tooltip.light-border-theme[x-placement^='top'] .tippy-arrow::before {
-	border-top-color: var(--color-surface-1);
+.tippy-tooltip.light-border-theme[ x-placement^='top' ] .tippy-arrow::before {
+	border-top-color: var( --color-surface-1 );
 }
 
-.tippy-tooltip.light-border-theme[x-placement^='bottom'] .tippy-arrow {
-	border-bottom-color: var(--color-surface-1);
+.tippy-tooltip.light-border-theme[ x-placement^='bottom' ] .tippy-arrow {
+	border-bottom-color: var( --color-surface-1 );
 }
 
-.tippy-tooltip.light-border-theme[x-placement^='bottom'] .tippy-arrow::after {
-	border-bottom-color: var(--color-surface-1);
+.tippy-tooltip.light-border-theme[ x-placement^='bottom' ] .tippy-arrow::after {
+	border-bottom-color: var( --color-surface-1 );
 }
 
-.tippy-tooltip.light-border-theme[x-placement^='bottom'] .tippy-arrow::before {
-	border-bottom-color: var(--color-surface-1);
+.tippy-tooltip.light-border-theme[ x-placement^='bottom' ] .tippy-arrow::before {
+	border-bottom-color: var( --color-surface-1 );
 }
 
-.tippy-tooltip.light-border-theme[x-placement^='left'] .tippy-arrow {
-	border-left-color: var(--color-surface-1);
+.tippy-tooltip.light-border-theme[ x-placement^='left' ] .tippy-arrow {
+	border-left-color: var( --color-surface-1 );
 }
 
-.tippy-tooltip.light-border-theme[x-placement^='left'] .tippy-arrow::after {
-	border-left-color: var(--color-surface-1);
+.tippy-tooltip.light-border-theme[ x-placement^='left' ] .tippy-arrow::after {
+	border-left-color: var( --color-surface-1 );
 }
 
-.tippy-tooltip.light-border-theme[x-placement^='left'] .tippy-arrow::before {
-	border-left-color: var(--color-surface-1);
+.tippy-tooltip.light-border-theme[ x-placement^='left' ] .tippy-arrow::before {
+	border-left-color: var( --color-surface-1 );
 }
 
-.tippy-tooltip.light-border-theme[x-placement^='right'] .tippy-arrow {
-	border-right-color: var(--color-surface-1);
+.tippy-tooltip.light-border-theme[ x-placement^='right' ] .tippy-arrow {
+	border-right-color: var( --color-surface-1 );
 }
 
-.tippy-tooltip.light-border-theme[x-placement^='right'] .tippy-arrow::after {
-	border-right-color: var(--color-surface-1);
+.tippy-tooltip.light-border-theme[ x-placement^='right' ] .tippy-arrow::after {
+	border-right-color: var( --color-surface-1 );
 }
 
-.tippy-tooltip.light-border-theme[x-placement^='right'] .tippy-arrow::before {
-	border-right-color: var(--color-surface-1);
+.tippy-tooltip.light-border-theme[ x-placement^='right' ] .tippy-arrow::before {
+	border-right-color: var( --color-surface-1 );
 }
 
 /* libs/tippy/light.css */
 .tippy-tooltip.light-theme {
-	background-color: var(--color-surface-1);
-	box-shadow: var(--box-shadow-dialog);
-	color: var(--color-base);
+	background-color: var( --color-surface-1 );
+	box-shadow: var( --box-shadow-dialog );
+	color: var( --color-base );
 }
 
-.tippy-tooltip.light-theme[x-placement^='top'] .tippy-arrow {
-	border-top-color: var(--color-surface-1);
+.tippy-tooltip.light-theme[ x-placement^='top' ] .tippy-arrow {
+	border-top-color: var( --color-surface-1 );
 }
 
-.tippy-tooltip.light-theme[x-placement^='bottom'] .tippy-arrow {
-	border-bottom-color: var(--color-surface-1);
+.tippy-tooltip.light-theme[ x-placement^='bottom' ] .tippy-arrow {
+	border-bottom-color: var( --color-surface-1 );
 }
 
-.tippy-tooltip.light-theme[x-placement^='left'] .tippy-arrow {
-	border-left-color: var(--color-surface-1);
+.tippy-tooltip.light-theme[ x-placement^='left' ] .tippy-arrow {
+	border-left-color: var( --color-surface-1 );
 }
 
-.tippy-tooltip.light-theme[x-placement^='right'] .tippy-arrow {
-	border-right-color: var(--color-surface-1);
+.tippy-tooltip.light-theme[ x-placement^='right' ] .tippy-arrow {
+	border-right-color: var( --color-surface-1 );
 }
 
 .tippy-tooltip.light-theme .tippy-backdrop {
-	background-color: var(--color-surface-1);
+	background-color: var( --color-surface-1 );
 }
 
 .tippy-tooltip.light-theme .tippy-roundarrow {
-	fill: var(--color-surface-1);
+	fill: var( --color-surface-1 );
 }
diff --git a/skinStyles/extensions/SemanticMediaWiki/ext.smw.ask.styles.less b/skinStyles/extensions/SemanticMediaWiki/ext.smw.ask.styles.less
index 9e36d990..cbffc6b7 100644
--- a/skinStyles/extensions/SemanticMediaWiki/ext.smw.ask.styles.less
+++ b/skinStyles/extensions/SemanticMediaWiki/ext.smw.ask.styles.less
@@ -16,39 +16,39 @@
 /* smw/special/ext.smw.special.ask.css */
 div#ask legend {
 	// Needed to hide fake box shadow line from focus state
-	background-color: var(--color-surface-0);
+	background-color: var( --color-surface-0 );
 }
 
 .smw-ask-toplinks {
-	border-radius: var(--border-radius--small);
-	background-color: var(--color-surface-2);
+	border-radius: var( --border-radius--small );
+	background-color: var( --color-surface-2 );
 	font-family: inherit;
 	font-size: 0.875rem;
 	line-height: inherit;
 }
 
 .smw-ask-toplinks-edit {
-	border-right-color: var(--color-surface-0);
+	border-right-color: var( --color-surface-0 );
 }
 
 .smw-ask-condition fieldset,
 .smw-ask-printhead fieldset {
-	border-color: var(--border-color-base);
-	border-radius: var(--border-radius--small);
+	border-color: var( --border-color-base );
+	border-radius: var( --border-radius--small );
 
 	// Add focus state
 	&:focus-within {
-		border-color: var(--color-primary);
-		box-shadow: inset 0 0 0 1px var(--color-primary);
+		border-color: var( --color-primary );
+		box-shadow: inset 0 0 0 1px var( --color-primary );
 
 		legend {
-			color: var(--color-primary);
+			color: var( --color-primary );
 		}
 	}
 }
 
 .smw-ask-query .smw-table-row .smw-table-cell {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 }
 
 .smw-ask-query textarea {
@@ -65,58 +65,58 @@ div#ask legend {
 }
 
 .smw-ask-button {
-	border-color: var(--border-color-base);
-	border-radius: var(--border-radius--small);
-	color: var(--color-base);
+	border-color: var( --border-color-base );
+	border-radius: var( --border-radius--small );
+	color: var( --color-base );
 	font-size: 0.875rem;
 }
 
 .smw-ask-button-submit input {
-	padding: var(--space-md);
-	border-color: var(--color-primary);
-	border-radius: var(--border-radius--medium);
-	background-color: var(--color-primary);
+	padding: var( --space-md );
+	border-color: var( --color-primary );
+	border-radius: var( --border-radius--medium );
+	background-color: var( --color-primary );
 	color: #fff;
 	font-size: 0.875rem;
-	font-weight: var(--font-weight-medium);
+	font-weight: var( --font-weight-medium );
 
 	&:hover {
-		border-color: var(--color-primary--hover);
-		background-color: var(--color-primary--hover);
+		border-color: var( --color-primary--hover );
+		background-color: var( --color-primary--hover );
 	}
 
 	&:active {
-		border-color: var(--color-primary--active);
-		background-color: var(--color-primary--active);
+		border-color: var( --color-primary--active );
+		background-color: var( --color-primary--active );
 	}
 }
 
 .smw-ask-button-right {
-	border-color: var(--border-color-base);
-	border-radius: var(--border-radius--small);
-	color: var(--color-base);
+	border-color: var( --border-color-base );
+	border-radius: var( --border-radius--small );
+	color: var( --color-base );
 }
 
 .smw-ask-button:hover {
-	background-color: var(--color-surface-2);
+	background-color: var( --color-surface-2 );
 }
 
 .smw-ask-button input {
-	color: var(--color-surface-1) !important;
+	color: var( --color-surface-1 ) !important;
 }
 
 .smw-ask-button-lgrey {
-	border-color: var(--border-color-base);
-	background-color: var(--color-surface-2);
+	border-color: var( --border-color-base );
+	background-color: var( --color-surface-2 );
 
 	&:hover {
-		border-color: var(--border-color-base);
-		background-color: var(--color-surface-2--hover);
+		border-color: var( --border-color-base );
+		background-color: var( --color-surface-2--hover );
 	}
 
 	// Added active state
 	&:active {
-		background-color: var(--color-surface-2--active);
+		background-color: var( --color-surface-2--active );
 	}
 }
 
@@ -125,53 +125,53 @@ div#ask legend {
 .smw-ask-button a:focus,
 .smw-ask-button a:active,
 .smw-ask-button a:visited {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .smw-ask-search fieldset,
 .smw-ask-format fieldset,
 .smw-ask-options fieldset {
-	border-color: var(--border-color-base);
-	border-radius: var(--border-radius--small);
+	border-color: var( --border-color-base );
+	border-radius: var( --border-radius--small );
 }
 
 .strike > span::before,
 .strike > span::after {
-	background: var(--border-color-base);
+	background: var( --border-color-base );
 }
 
 .smw-ask-sort-input input,
 .smw-propertysubject-input {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 }
 
-#options-toggle:not(:checked) + #options-list .options-parameter-list::after {
-	background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0), var(--color-surface-0) 90%);
+#options-toggle:not( :checked ) + #options-list .options-parameter-list::after {
+	background-image: linear-gradient( to bottom, rgba( 255, 255, 255, 0 ), var( --color-surface-0 ) 90% );
 }
 
 .slowfade textarea::placeholder {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .export-links li {
-	border-left-color: var(--color-base--subtle);
+	border-left-color: var( --color-base--subtle );
 }
 
 // Make delete button destructive
 .smw-ask-sort-delete-action {
-	color: var(--color-destructive);
+	color: var( --color-destructive );
 
 	&:hover {
-		color: var(--color-destructive--hover);
+		color: var( --color-destructive--hover );
 	}
 
 	&:active {
-		color: var(--color-destructive--active);
+		color: var( --color-destructive--active );
 	}
 }
 
 // Options parameter description text
 .smw-ask-parameter-description {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 	font-size: 0.8125rem;
 }
diff --git a/skinStyles/extensions/SemanticMediaWiki/ext.smw.browse.styles.less b/skinStyles/extensions/SemanticMediaWiki/ext.smw.browse.styles.less
index 96bec87a..089efe34 100644
--- a/skinStyles/extensions/SemanticMediaWiki/ext.smw.browse.styles.less
+++ b/skinStyles/extensions/SemanticMediaWiki/ext.smw.browse.styles.less
@@ -28,7 +28,7 @@
 
 .smwb-factbox .smwb-cell {
 	border: 0;
-	border-top: 1px solid var(--border-color-base);
+	border-top: 1px solid var( --border-color-base );
 }
 
 .smwb-cell-empty {
@@ -36,14 +36,14 @@
 }
 
 .smwb-prophead {
-	background-color: var(--color-surface-2);
+	background-color: var( --color-surface-2 );
 }
 
 .smwb-title {
 	background-color: transparent;
 	font-size: 1.5rem;
-	font-weight: var(--font-weight-semibold);
-	line-height: var(--line-height-xs);
+	font-weight: var( --font-weight-semibold );
+	line-height: var( --line-height-xs );
 }
 
 .smwb-title td {
@@ -56,13 +56,13 @@
 }
 
 .smwb-propvalue .smwb-prophead {
-	padding: var(--space-xs) var(--space-md);
+	padding: var( --space-xs ) var( --space-md );
 	font-size: 1rem;
-	font-weight: var(--font-weight-medium);
+	font-weight: var( --font-weight-medium );
 }
 
 .smwb-propvalue .smwb-propval {
-	padding: var(--space-xs) var(--space-md);
+	padding: var( --space-xs ) var( --space-md );
 	background-color: transparent;
 }
 
@@ -82,7 +82,7 @@
 }
 
 .smwb-bottom {
-	border-bottom: 1px solid var(--border-color-base);
+	border-bottom: 1px solid var( --border-color-base );
 }
 
 /**
@@ -95,14 +95,14 @@
 
 .smwb-ifactbox .smwb-cell {
 	border: 0;
-	border-top: 1px solid var(--border-color-base);
+	border-top: 1px solid var( --border-color-base );
 }
 
 .smwb-ititle {
 	background-color: transparent;
 	font-size: 1.5rem;
-	font-weight: var(--font-weight-semibold);
-	line-height: var(--line-height-xs);
+	font-weight: var( --font-weight-semibold );
+	line-height: var( --line-height-xs );
 }
 
 .smwb-ititle td {
@@ -115,13 +115,13 @@
 }
 
 .smwb-ipropvalue .smwb-prophead {
-	padding: var(--space-xs) var(--space-md);
+	padding: var( --space-xs ) var( --space-md );
 	font-size: 1rem;
-	font-weight: var(--font-weight-medium);
+	font-weight: var( --font-weight-medium );
 }
 
 .smwb-ipropvalue .smwb-propval {
-	padding: var(--space-xs) var(--space-md);
+	padding: var( --space-xs ) var( --space-md );
 	background-color: transparent;
 }
 
@@ -130,12 +130,12 @@
 }
 
 .smwb-input .mw-ui-input:focus {
-	border-color: var(--color-primary);
-	box-shadow: inset 0 0 0 1px var(--color-primary);
+	border-color: var( --color-primary );
+	box-shadow: inset 0 0 0 1px var( --color-primary );
 }
 
 .smwb-action-separator {
-	border-left-color: var(--border-color-base);
+	border-left-color: var( --border-color-base );
 }
 
 /**
@@ -155,18 +155,18 @@
 }
 
 .smwb-theme-light .smwb-prophead {
-	background-color: var(--color-surface-3);
+	background-color: var( --color-surface-3 );
 }
 
 .smwb-theme-light .smwb-center,
 .smwb-theme-light .smwb-propval {
-	background-color: var(--color-surface-2);
+	background-color: var( --color-surface-2 );
 }
 
 /**
  * Responsive settings (#see smw.table.css)
  */
-@media screen and (max-width: 800px) {
+@media screen and ( max-width: 800px ) {
 	.smwb-group .smwb-propval,
 	.smwb-group .smwb-theme-light .smwb-propval {
 		background-color: transparent;
@@ -175,8 +175,8 @@
 
 // Sticky header
 .smwb-datasheet > .smwb-factbox:first-child {
-	padding: var(--space-md) 0;
-	border-bottom: 1px solid var(--border-color-base);
+	padding: var( --space-md ) 0;
+	border-bottom: 1px solid var( --border-color-base );
 	background: transparent;
 	.citizen-sticky-header;
 }
diff --git a/skinStyles/extensions/SemanticMediaWiki/ext.smw.modal.styles.less b/skinStyles/extensions/SemanticMediaWiki/ext.smw.modal.styles.less
index 01dfcf83..1c4cb7cb 100644
--- a/skinStyles/extensions/SemanticMediaWiki/ext.smw.modal.styles.less
+++ b/skinStyles/extensions/SemanticMediaWiki/ext.smw.modal.styles.less
@@ -13,33 +13,33 @@
 /* smw/util/ext.smw.modal.css */
 .smw-modal {
 	z-index: @z-index-overlay;
-	background-color: var(--background-color-overlay--lighter);
+	background-color: var( --background-color-overlay--lighter );
 }
 
 .smw-modal-title {
 	margin-left: 0;
-	color: var(--color-base--emphasized);
+	color: var( --color-base--emphasized );
 	font-size: 1.25rem;
-	font-weight: var(--font-weight-semibold);
+	font-weight: var( --font-weight-semibold );
 	vertical-align: middle;
 }
 
 /* smw-modal Content */
 .smw-modal-content {
-	padding: var(--space-xl);
+	padding: var( --space-xl );
 	border: 0;
-	border-radius: var(--border-radius--medium);
-	background-color: var(--color-surface-1);
-	box-shadow: var(--box-shadow-dialog);
+	border-radius: var( --border-radius--medium );
+	background-color: var( --color-surface-1 );
+	box-shadow: var( --box-shadow-dialog );
 }
 
 .smw-modal-close:hover,
 .smw-modal-close:focus {
-	color: var(--background-color-icon--hover);
+	color: var( --background-color-icon--hover );
 }
 
 .smw-modal-close:active {
-	color: var(--background-color-icon--active);
+	color: var( --background-color-icon--active );
 }
 
 .smw-modal-header {
@@ -47,16 +47,16 @@
 	border-bottom: 0;
 	margin: 0;
 	background-color: transparent;
-	font-weight: var(--font-weight-normal);
+	font-weight: var( --font-weight-normal );
 }
 
 .smw-modal-header h2 {
 	border-bottom: 0;
-	color: var(--color-base--emphasized);
+	color: var( --color-base--emphasized );
 	font-size: 1.25rem;
 }
 
 .smw-modal-footer {
 	background-color: transparent;
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
diff --git a/skinStyles/extensions/SemanticMediaWiki/ext.smw.page.styles.less b/skinStyles/extensions/SemanticMediaWiki/ext.smw.page.styles.less
index 65516e58..21a54c55 100644
--- a/skinStyles/extensions/SemanticMediaWiki/ext.smw.page.styles.less
+++ b/skinStyles/extensions/SemanticMediaWiki/ext.smw.page.styles.less
@@ -18,7 +18,7 @@
 /* smw/ext.smw.page.css */
 /* Property page */
 .smw-property-page-content-line {
-	border-bottom-color: var(--border-color-base);
+	border-bottom-color: var( --border-color-base );
 }
 
 .smw-property-page-results .header-row {
@@ -27,92 +27,92 @@
 }
 
 .smw-property-page-results .value-row:hover {
-	background-color: var(--background-color-quiet--hover);
+	background-color: var( --background-color-quiet--hover );
 }
 
 .smw-property-page-results .header-row > .header-title {
-	border-bottom-color: var(--border-color-base);
+	border-bottom-color: var( --border-color-base );
 }
 
 .smw-ui-pagination .page-link {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 	background-color: transparent;
-	color: var(--color-primary);
+	color: var( --color-primary );
 }
 
 .smw-ui-pagination .page-link:first-child {
-	border-bottom-left-radius: var(--border-radius--small);
-	border-top-left-radius: var(--border-radius--small);
+	border-bottom-left-radius: var( --border-radius--small );
+	border-top-left-radius: var( --border-radius--small );
 }
 
 .smw-ui-pagination .page-link:last-child {
-	border-bottom-right-radius: var(--border-radius--small);
-	border-top-right-radius: var(--border-radius--small);
+	border-bottom-right-radius: var( --border-radius--small );
+	border-top-right-radius: var( --border-radius--small );
 }
 
 .smw-ui-pagination .page-link:hover {
-	border-color: var(--border-color-base);
-	background-color: var(--background-color-quiet--hover);
-	color: var(--color-primary);
+	border-color: var( --border-color-base );
+	background-color: var( --background-color-quiet--hover );
+	color: var( --color-primary );
 }
 
 // Added active state
 .smw-ui-pagination .page-link:active {
-	background-color: var(--background-color-quiet--active);
+	background-color: var( --background-color-quiet--active );
 }
 
 .smw-ui-pagination .page-link.link-disabled {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 	background-color: transparent;
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .smw-ui-pagination .page-link.link-active {
-	border-color: var(--color-primary);
-	background-color: var(--color-primary);
+	border-color: var( --color-primary );
+	background-color: var( --color-primary );
 	color: #fff;
 }
 
 .smw-property-page-results .header-title {
-	padding: var(--space-xs) 0;
-	border-bottom-color: var(--border-color-base);
+	padding: var( --space-xs ) 0;
+	border-bottom-color: var( --border-color-base );
 	background-color: transparent;
-	color: var(--color-base--emphasized);
+	color: var( --color-base--emphasized );
 	font-size: 1.25rem;
 }
 
 .list-pager-value-filter input {
-	border-color: var(--border-color-base);
-	border-radius: var(--border-radius--small);
-	background-color: var(--color-surface-1);
-	color: var(--color-base);
+	border-color: var( --border-color-base );
+	border-radius: var( --border-radius--small );
+	background-color: var( --color-surface-1 );
+	color: var( --color-base );
 }
 
 .smw-ui-input-filter {
-	border-color: var(--border-color-base);
-	border-radius: var(--border-radius--small);
-	background-color: var(--color-surface-1);
-	color: var(--color-primary);
+	border-color: var( --border-color-base );
+	border-radius: var( --border-radius--small );
+	background-color: var( --color-surface-1 );
+	color: var( --color-primary );
 }
 
 .smw-ui-input-filter input {
-	border-left-color: var(--border-color-base) !important;
-	color: var(--color-base) !important;
+	border-left-color: var( --border-color-base ) !important;
+	color: var( --color-base ) !important;
 }
 
 .smw-ui-input-filter-tooltip {
-	border-left-color: var(--border-color-base);
+	border-left-color: var( --border-color-base );
 }
 
 .smw-property-page-results.legacy .header-title {
-	border-bottom-color: var(--border-color-base);
+	border-bottom-color: var( --border-color-base );
 }
 
 .usage-count,
 .item-count {
-	border-radius: var(--border-radius--small);
-	background-color: var(--color-surface-3);
-	color: var(--color-base);
+	border-radius: var( --border-radius--small );
+	background-color: var( --color-surface-3 );
+	color: var( --color-base );
 }
 
 #tab-smw-property-value:checked + label.nav-label .usage-count,
@@ -122,20 +122,20 @@
 #tab-smw-property-redi:checked + label.nav-label .item-count,
 #tab-smw-type-list:checked + label.nav-label .item-count,
 #tab-smw-property-spec:checked + label.nav-label .item-count {
-	background-color: var(--color-surface-3);
-	color: var(--color-base);
+	background-color: var( --color-surface-3 );
+	color: var( --color-base );
 }
 
 #tab-smw-property-value:checked + label.nav-label .usage-count.moderate,
 #tab-smw-concept-list:checked + label.nav-label .usage-count.moderate {
-	background-color: var(--background-color-primary--hover);
-	color: var(--color-primary);
+	background-color: var( --background-color-primary--hover );
+	color: var( --color-primary );
 }
 
 #tab-smw-property-value:checked + label.nav-label .usage-count.high,
 #tab-smw-concept-list:checked + label.nav-label .usage-count.high {
-	background-color: var(--background-color-destructive);
-	color: var(--color-destructive);
+	background-color: var( --background-color-destructive );
+	color: var( --color-destructive );
 }
 
 /**
@@ -145,25 +145,25 @@
 .smw-concept input.nav-tab:checked + label.nav-label.smw-tab-warning,
 .smw-types input.nav-tab:checked + label.nav-label.smw-tab-warning {
 	border-top: 0;
-	border-bottom: 2px solid var(--color-destructive);
+	border-bottom: 2px solid var( --color-destructive );
 }
 
 .smw-property input.nav-tab:checked + label.nav-label.smw-tab-spec,
 .smw-concept input.nav-tab:checked + label.nav-label.smw-tab-spec {
 	border-top: 0;
-	border-bottom: 2px solid var(--color-warning);
+	border-bottom: 2px solid var( --color-warning );
 }
 
 .smw-property input.nav-tab:checked + label#tab-label-smw-property-constraint.nav-label {
-	border-bottom: 2px solid var(--color-primary);
+	border-bottom: 2px solid var( --color-primary );
 }
 
 /**
  * Responsive settings (@see ext.smw.table)
  */
-@media screen and (max-width: 800px) {
+@media screen and ( max-width: 800px ) {
 	.smw-property-page-results .header-title:first-child,
 	.smw-property-page-results .header-row > .header-title:first-child {
-		border-bottom-color: var(--border-color-base);
+		border-bottom-color: var( --border-color-base );
 	}
 }
diff --git a/skinStyles/extensions/SemanticMediaWiki/ext.smw.special.style.less b/skinStyles/extensions/SemanticMediaWiki/ext.smw.special.style.less
index 410999c6..afc71d42 100644
--- a/skinStyles/extensions/SemanticMediaWiki/ext.smw.special.style.less
+++ b/skinStyles/extensions/SemanticMediaWiki/ext.smw.special.style.less
@@ -13,68 +13,68 @@
  * Special:Admin
  */
 .smw-admin-deprecation-notice-docu-section {
-	border-color: var(--border-color-base);
-	background-color: var(--background-color-warning);
-	color: var(--color-warning);
+	border-color: var( --border-color-base );
+	background-color: var( --background-color-warning );
+	color: var( --color-warning );
 }
 
 .smw-admin-deprecation-notice-section-legend {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .smw-admin-deprecation fieldset,
 .smw-pending-task fieldset {
-	border-top-color: var(--border-color-base);
+	border-top-color: var( --border-color-base );
 }
 
 .smw-admin-deprecation fieldset.smw-admin-deprecation-notice-section-legend {
-	border-top-color: var(--border-color-base);
+	border-top-color: var( --border-color-base );
 }
 
 .smw-admin-alerts-section-legend {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .smw-admin-alerts-section-legend p {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .smw-admin-alerts fieldset {
-	border-top-color: var(--border-color-base);
+	border-top-color: var( --border-color-base );
 }
 
 .smw-admin-alerts fieldset.smw-admin-alerts-section-legend {
-	border-top-color: var(--border-color-base);
+	border-top-color: var( --border-color-base );
 }
 
 .smw-admin-alerts-section-legend-info {
-	color: var(--color-warning);
+	color: var( --color-warning );
 }
 
 .smw-admin-alerts-section-legend-info p {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .smw-admin-alerts fieldset.smw-admin-alerts-section-legend-info {
-	border-top-color: var(--color-warning);
+	border-top-color: var( --color-warning );
 }
 
 .smw-admin-hr {
-	background-color: var(--color-surface-2);
+	background-color: var( --color-surface-2 );
 }
 
 .smw-special-filter-button {
-	border-color: var(--border-color-base);
-	color: var(--color-base);
+	border-color: var( --border-color-base );
+	color: var( --color-base );
 }
 
 .smw-special-filter-button:hover {
-	background-color: var(--background-color-quiet--hover);
+	background-color: var( --background-color-quiet--hover );
 }
 
 // Added active state
 .smw-special-filter-button:active {
-	background-color: var(--background-color-quiet--active);
+	background-color: var( --background-color-quiet--active );
 }
 
 .smw-special-filter-button a,
@@ -82,44 +82,44 @@
 .smw-special-filter-button a:focus,
 .smw-special-filter-button a:active,
 .smw-special-filter-button a:visited {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 /**
  * Tabbed admin
  */
 .smw-admin section {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 }
 
 .smw-admin input.nav-tab:checked + label.nav-label {
-	border-color: var(--border-color-base);
-	border-top-color: var(--color-warning);
+	border-color: var( --border-color-base );
+	border-top-color: var( --color-warning );
 	border-bottom-color: transparent;
 }
 
 .smw-admin input.nav-tab:checked + label.nav-label.smw-tab-warning {
-	border-top-color: var(--color-destructive);
+	border-top-color: var( --color-destructive );
 }
 
 .smw-admin input.nav-tab:checked + label.nav-label.smw-tab-notice {
-	border-top-color: var(--color-warning);
+	border-top-color: var( --color-warning );
 }
 
 .client-nojs .smw-admin-supplementary-duplookup-content::after {
-	background-color: var(--color-surface-2);
-	color: var(--color-destructive);
+	background-color: var( --color-surface-2 );
+	color: var( --color-destructive );
 }
 
 .smw-admin h3,
 h3.smw-title,
 h4.smw-title,
 h3 .smw-title {
-	background: var(--color-surface-2);
+	background: var( --color-surface-2 );
 }
 
 .smw-admin h3,
 h3.smw-title {
-	border-bottom-color: var(--border-color-base);
-	color: var(--color-base--emphasized);
+	border-bottom-color: var( --border-color-base );
+	color: var( --color-base--emphasized );
 }
diff --git a/skinStyles/extensions/SemanticMediaWiki/ext.smw.special.styles.less b/skinStyles/extensions/SemanticMediaWiki/ext.smw.special.styles.less
index f1f1a527..cebc3fe1 100644
--- a/skinStyles/extensions/SemanticMediaWiki/ext.smw.special.styles.less
+++ b/skinStyles/extensions/SemanticMediaWiki/ext.smw.special.styles.less
@@ -16,10 +16,10 @@ fieldset#mw-prefsection-smw-general-options,
 fieldset#mw-prefsection-smw-extended-search-options,
 fieldset#mw-prefsection-smw-ask-options,
 fieldset#mw-prefsection-smw-srf {
-	border-color: var(--color-primary);
-	border-top-color: var(--border-color-base);
+	border-color: var( --color-primary );
+	border-top-color: var( --border-color-base );
 }
 
 #mw-prefsection-smw .oo-ui-fieldsetLayout-header .oo-ui-labelElement-label {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
diff --git a/skinStyles/extensions/SemanticMediaWiki/ext.smw.style.less b/skinStyles/extensions/SemanticMediaWiki/ext.smw.style.less
index 3fea1dfc..0340b05c 100644
--- a/skinStyles/extensions/SemanticMediaWiki/ext.smw.style.less
+++ b/skinStyles/extensions/SemanticMediaWiki/ext.smw.style.less
@@ -10,296 +10,296 @@
 
 /* smw/ext.smw.css */
 .smw-placeholder {
-	border-radius: var(--border-radius--small);
-	background-color: var(--color-surface-2);
+	border-radius: var( --border-radius--small );
+	background-color: var( --color-surface-2 );
 	font-family: inherit;
 	font-size: 0.875rem;
 	line-height: inherit;
 }
 
 .client-nojs .smw-placeholder::after {
-	color: var(--color-destructive);
+	color: var( --color-destructive );
 }
 
 .smw-personal-jobqueue-watchlist:hover,
 .smw-personal-jobqueue-watchlist:focus,
 .smw-personal-jobqueue-watchlist:active {
-	color: var(--color-primary);
+	color: var( --color-primary );
 }
 
 .item-count {
-	border-radius: var(--border-radius--small);
-	background-color: var(--color-surface-3);
-	color: var(--color-base);
+	border-radius: var( --border-radius--small );
+	background-color: var( --color-surface-3 );
+	color: var( --color-base );
 }
 
 .item-count.active {
-	background-color: var(--color-surface-3);
-	color: var(--color-base);
+	background-color: var( --color-surface-3 );
+	color: var( --color-base );
 }
 
 /* make divs look like <pre> */
 .smwpre {
-	border-color: var(--border-color-base);
-	background-color: var(--color-surface-2);
-	color: var(--color-base);
+	border-color: var( --border-color-base );
+	background-color: var( --color-surface-2 );
+	color: var( --color-base );
 }
 
 .smw-debug-box {
-	border-color: var(--color-warning);
-	background: var(--background-color-warning);
+	border-color: var( --color-warning );
+	background: var( --background-color-warning );
 }
 
 .smw-debug-box-header {
-	border-bottom-color: var(--color-warning);
-	font-family: var(--fonts-sans);
+	border-bottom-color: var( --color-warning );
+	font-family: var( --fonts-sans );
 }
 
 div.smwtimeline {
-	border-color: var(--border-color-base);
-	background-color: var(--color-surface-2);
+	border-color: var( --border-color-base );
+	background-color: var( --color-surface-2 );
 }
 
-.smwtable-striped tbody > tr:nth-child(even) {
-	background-color: var(--color-surface-2);
+.smwtable-striped tbody > tr:nth-child( even ) {
+	background-color: var( --color-surface-2 );
 }
 
-.smwtable-striped tbody > tr:nth-child(odd) {
-	background-color: var(--color-surface-0);
+.smwtable-striped tbody > tr:nth-child( odd ) {
+	background-color: var( --color-surface-0 );
 }
 
 .smwtable-striped tbody > tr:hover {
-	background-color: var(--background-color-quiet--hover);
+	background-color: var( --background-color-quiet--hover );
 }
 
 .smwtable-clean tr {
-	border-top-color: var(--border-color-base);
+	border-top-color: var( --border-color-base );
 }
 
 .smwtable-clean tr > th {
-	border-top-color: var(--border-color-base);
+	border-top-color: var( --border-color-base );
 }
 
 .smwtable-clean tr > td {
-	border-top-color: var(--border-color-base);
+	border-top-color: var( --border-color-base );
 }
 
-.smwtable-clean tbody > tr:nth-child(even) {
-	background-color: var(--color-surface-2);
+.smwtable-clean tbody > tr:nth-child( even ) {
+	background-color: var( --color-surface-2 );
 }
 
 div.smwhr hr {
-	background-color: var(--border-color-base);
-	color: var(--border-color-base);
+	background-color: var( --border-color-base );
+	color: var( --border-color-base );
 }
 
 span.smwwarning {
-	color: var(--background-color-icon);
+	color: var( --background-color-icon );
 }
 
 span.smwsearchicon {
-	color: var(--background-color-icon);
+	color: var( --background-color-icon );
 }
 
 span.smwsearch a {
-	color: var(--background-color-icon);
+	color: var( --background-color-icon );
 }
 
 span.smwsearch a:hover {
-	color: var(--background-color-icon--hover);
+	color: var( --background-color-icon--hover );
 }
 
 // Added active state
 span.smwsearch a:active {
-	color: var(--background-color-icon--hover);
+	color: var( --background-color-icon--hover );
 }
 
 span.smwbrowse a {
-	color: var(--background-color-icon);
+	color: var( --background-color-icon );
 }
 
 span.smwbrowse a:hover {
-	color: var(--background-color-icon--hover);
+	color: var( --background-color-icon--hover );
 }
 
 // Added active state
 span.smwbrowse a:active {
-	color: var(--background-color-icon--hover);
+	color: var( --background-color-icon--hover );
 }
 
 .concept-documenation {
-	border-top-color: var(--border-color-base);
+	border-top-color: var( --border-color-base );
 }
 
 hr.smw-form-horizontalrule {
-	background-color: var(--border-color-base);
+	background-color: var( --border-color-base );
 }
 
 .smw-horizontalrule {
-	border-bottom-color: var(--border-color-base);
+	border-bottom-color: var( --border-color-base );
 }
 
 .smw-editpage-help {
-	border-color: var(--border-color-base);
-	background-color: var(--color-surface-2);
+	border-color: var( --border-color-base );
+	background-color: var( --color-surface-2 );
 }
 
 .smw-column-header {
-	color: var(--color-base--emphasized);
+	color: var( --color-base--emphasized );
 }
 
 .smw-note {
-	border-radius: var(--border-radius--small);
-	background-color: var(--color-surface-2);
+	border-radius: var( --border-radius--small );
+	background-color: var( --color-surface-2 );
 	font-family: inherit;
 	font-size: 0.875rem;
 	line-height: inherit;
 }
 
 .smw-callout-info {
-	border-left-color: var(--color-primary);
-	background: var(-background-color-primary--hover);
+	border-left-color: var( --color-primary );
+	background: var( -background-color-primary--hover );
 }
 
 .smw-callout-info .title {
-	color: var(--color-primary);
+	color: var( --color-primary );
 }
 
 .smw-callout-info-light {
-	border-left-color: var(--border-color-base);
-	background: var(--color-surface-2);
+	border-left-color: var( --border-color-base );
+	background: var( --color-surface-2 );
 }
 
 .smw-callout-info-light .title {
-	color: var(--color-primary);
+	color: var( --color-primary );
 }
 
 .smw-callout-warning {
-	border-left-color: var(--color-warning);
-	background: var(--background-color-warning);
+	border-left-color: var( --color-warning );
+	background: var( --background-color-warning );
 }
 
 .smw-callout-warning .title {
-	color: var(--color-warning);
+	color: var( --color-warning );
 }
 
 .smw-callout-success {
-	border-left-color: var(--color-success);
-	background: var(--background-color-success);
+	border-left-color: var( --color-success );
+	background: var( --background-color-success );
 }
 
 .smw-callout-success .title {
-	color: var(--color-success);
+	color: var( --color-success );
 }
 
 .smw-callout-error {
-	border-left-color: var(--color-destructive);
-	background: var(--background-color-destructive);
+	border-left-color: var( --color-destructive );
+	background: var( --background-color-destructive );
 }
 
 .autocomplete-suggestions {
 	border: 0;
-	border-radius: var(--border-radius--small);
-	background: var(--color-surface-1);
-	box-shadow: var(--box-shadow-dialog);
-	color: var(--color-base);
+	border-radius: var( --border-radius--small );
+	background: var( --color-surface-1 );
+	box-shadow: var( --box-shadow-dialog );
+	color: var( --color-base );
 }
 
 .autocomplete-suggestion {
-	border-bottom-color: var(--border-color-base);
+	border-bottom-color: var( --border-color-base );
 }
 
 .autocomplete-selected {
-	background: var(--background-color-primary--active);
+	background: var( --background-color-primary--active );
 }
 
 .autocomplete-suggestions strong {
-	color: var(--color-primary);
+	color: var( --color-primary );
 }
 
 .autocomplete-group strong {
-	border-bottom-color: var(--border-color-base);
+	border-bottom-color: var( --border-color-base );
 }
 
 .smw-breadcrumb-arrow-right {
-	border-left-color: var(--color-base--subtle);
+	border-left-color: var( --color-base--subtle );
 }
 
 .smw-ask-action-btn,
 .smw-action-btn {
-	border-radius: var(--border-radius--small);
+	border-radius: var( --border-radius--small );
 }
 
 .smw-ask-action-btn-lgrey,
 a.smw-ask-action-btn-lgrey:visited,
 .smw-action-btn-lgrey,
 .smw-action-btn-lgrey:visited {
-	border-color: var(--color-surface-2);
-	background-color: var(--color-surface-2);
-	color: var(--color-base);
+	border-color: var( --color-surface-2 );
+	background-color: var( --color-surface-2 );
+	color: var( --color-base );
 	text-decoration: none;
 }
 
 a.smw-ask-action-btn-lgrey:hover,
 .smw-action-btn-lgrey:hover {
-	border-color: var(--color-surface-2--hover);
-	background-color: var(--color-surface-2--hover);
-	color: var(--color-base);
+	border-color: var( --color-surface-2--hover );
+	background-color: var( --color-surface-2--hover );
+	color: var( --color-base );
 }
 
 // Added active state
 a.smw-ask-action-btn-lgrey:active,
 .smw-action-btn-lgrey:active {
-	border-color: var(--color-surface-2--active);
-	background-color: var(--color-surface-2--active);
-	color: var(--color-base);
+	border-color: var( --color-surface-2--active );
+	background-color: var( --color-surface-2--active );
+	color: var( --color-base );
 }
 
 .smw-ask-action-btn-lblue,
 a.smw-ask-action-btn-lblue:visited {
-	border-color: var(--color-primary);
-	background-color: var(--color-primary);
+	border-color: var( --color-primary );
+	background-color: var( --color-primary );
 	color: #fff;
 }
 
 a.smw-ask-action-btn-lblue:hover {
-	border-color: var(--color-primary--hover);
-	background-color: var(--color-primary--hover);
+	border-color: var( --color-primary--hover );
+	background-color: var( --color-primary--hover );
 	color: #fff;
 }
 
 // Added active state
 a.smw-ask-action-btn-lblue:active {
-	border-color: var(--color-primary--active);
-	background-color: var(--color-primary--active);
+	border-color: var( --color-primary--active );
+	background-color: var( --color-primary--active );
 	color: #fff;
 }
 
 .smw-page-indicator {
-	border-color: var(--border-color-base);
-	border-radius: var(--border-radius--small);
-	color: var(--background-color-icon);
+	border-color: var( --border-color-base );
+	border-radius: var( --border-radius--small );
+	color: var( --background-color-icon );
 }
 
 .smw-protection-indicator {
-	border-radius: var(--border-radius--small);
-	color: var(--background-color-icon);
+	border-radius: var( --border-radius--small );
+	color: var( --background-color-icon );
 }
 
 .smw-protection-indicator.with-border {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 }
 
 .smw-page-indicator.usage-count.moderate {
-	border-color: var(--background-color-primary--hover);
-	background-color: var(--background-color-primary--hover);
-	color: var(--color-primary);
+	border-color: var( --background-color-primary--hover );
+	background-color: var( --background-color-primary--hover );
+	color: var( --color-primary );
 }
 
 .smw-page-indicator.usage-count.high {
-	border-color: var(--background-color-destructive);
-	background-color: var(--background-color-destructive);
-	color: var(--color-destructive);
+	border-color: var( --background-color-destructive );
+	background-color: var( --background-color-destructive );
+	color: var( --color-destructive );
 }
 
 .mw-json .value,
@@ -308,13 +308,13 @@ a.smw-ask-action-btn-lblue:active {
 }
 
 .ns-112.action-submit .error {
-	border-left-color: var(--color-destructive);
-	background: var(--background-color-destructive);
-	color: var(--color-destructive);
+	border-left-color: var( --color-destructive );
+	background: var( --background-color-destructive );
+	color: var( --color-destructive );
 }
 
 .ns-112.action-submit .error::before {
-	color: var(--color-destructive);
+	color: var( --color-destructive );
 }
 
 /* smw/ext.smw.dropdown.css */
@@ -324,238 +324,238 @@ a.smw-ask-action-btn-lblue:active {
 
 .smw-dropdown > a,
 .smw-dropdown > button {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 	background-color: transparent;
-	color: var(--color-base--emphasized);
+	color: var( --color-base--emphasized );
 	font-family: inherit;
 }
 
 .smw-dropdown > a::before,
 .smw-dropdown > button::before {
-	border-top-color: var(--color-base--emphasized);
+	border-top-color: var( --color-base--emphasized );
 }
 
 .smw-dropdown .smw-dropdown-menu {
-	border-color: var(--border-color-base);
-	border-radius: var(--border-radius--small);
-	background-color: var(--color-surface-1);
-	box-shadow: var(--box-shadow-dialog);
+	border-color: var( --border-color-base );
+	border-radius: var( --border-radius--small );
+	background-color: var( --color-surface-1 );
+	box-shadow: var( --box-shadow-dialog );
 }
 
 .smw-dropdown .smw-dropdown-menu li:hover {
-	background-color: var(--background-color-quiet--hover);
+	background-color: var( --background-color-quiet--hover );
 }
 
 .smw-dropdown .smw-dropdown-menu li a {
-	color: var(--color-base--emphasized);
+	color: var( --color-base--emphasized );
 }
 
 .smw-dropdown .smw-dropdown-menu .divider {
-	background-color: var(--border-color-base);
+	background-color: var( --border-color-base );
 }
 
 .smw-dropdown-menu::before {
-	border-bottom-color: var(--color-surface-1);
+	border-bottom-color: var( --color-surface-1 );
 }
 
 .smw-dropdown-menu::after {
-	border-bottom-color: var(--color-surface-1);
+	border-bottom-color: var( --color-surface-1 );
 }
 
 /* smw/ext.smw.tabs.css */
 .smw-tabs section,
 .smw-tabs .subtab-content {
-	border-top-color: var(--border-color-base);
+	border-top-color: var( --border-color-base );
 }
 
 // Similar to TabberNeue
 .smw-tabs label.nav-label {
-	color: var(--color-base--subtle);
-	font-weight: var(--font-weight-medium);
+	color: var( --color-base--subtle );
+	font-weight: var( --font-weight-medium );
 }
 
 .smw-tabs label.nav-label:hover {
-	border-bottom: 2px solid var(--color-primary--hover);
-	color: var(--color-primary--hover);
+	border-bottom: 2px solid var( --color-primary--hover );
+	color: var( --color-primary--hover );
 }
 
 // Added active state
 .smw-tabs label.nav-label:active {
-	border-bottom: 2px solid var(--color-primary--active);
-	color: var(--color-primary--active);
+	border-bottom: 2px solid var( --color-primary--active );
+	color: var( --color-primary--active );
 }
 
 .smw-tabs input.nav-tab:checked + label.nav-label {
 	border-color: transparent;
 	border-top: 1px solid transparent;
-	border-bottom: 2px solid var(--color-primary);
-	color: var(--color-primary);
+	border-bottom: 2px solid var( --color-primary );
+	color: var( --color-primary );
 }
 
 .smw-tabs input.nav-tab:checked + label.nav-label.cached {
 	border-top: 1px solid transparent;
-	border-bottom: 2px solid var(--color-warning);
+	border-bottom: 2px solid var( --color-warning );
 }
 
 .smw-tabs label.nav-label .smw-tab-icon {
-	opacity: var(--opacity-icon-base);
+	opacity: var( --opacity-icon-base );
 }
 
 .smw-tabs label.nav-label:hover .smw-tab-icon {
-	opacity: var(--opacity-icon-base--hover);
+	opacity: var( --opacity-icon-base--hover );
 }
 
 // Added active state
 .smw-tabs label.nav-label:active .smw-tab-icon,
 .smw-tabs input.nav-tab:checked + label.nav-label .smw-tab-icon {
-	opacity: var(--opacity-icon-base--active);
+	opacity: var( --opacity-icon-base--active );
 }
 
-@media screen and (max-width: 800px) {
+@media screen and ( max-width: 800px ) {
 	.smw-tabs input.nav-tab:checked + label.nav-label {
-		background-color: var(--background-color-primary--active);
+		background-color: var( --background-color-primary--active );
 	}
 }
 
 .smw-tabset > label {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .smw-tabset > label::after {
-	background: var(--color-base--subtle);
+	background: var( --color-base--subtle );
 }
 
 .smw-tabset > input:focus + label,
 .smw-tabset > input:checked + label {
-	color: var(--color-primary);
+	color: var( --color-primary );
 }
 
 .smw-tabset > input:focus + label::after,
 .smw-tabset > input:checked + label::after {
-	background: var(--color-primary);
+	background: var( --color-primary );
 }
 
 .smw-tabset > input:focus + label.smw-indicator-severity-error::after,
 .smw-tabset > input:checked + label.smw-indicator-severity-error::after {
-	background: var(--color-destructive);
+	background: var( --color-destructive );
 }
 
 .smw-tabset > input:focus + label.smw-indicator-severity-warning::after,
 .smw-tabset > input:checked + label.smw-indicator-severity-warning::after {
-	background: var(--color-warning);
+	background: var( --color-warning );
 }
 
 .smw-tabset > label:hover {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .smw-tabset > label:hover::after {
-	background: var(--color-base);
+	background: var( --color-base );
 }
 
 .smw-tabset > input:checked + label {
 	border-color: transparent;
 	border-top: 1px solid transparent;
-	border-bottom: 2px solid var(--color-primary);
+	border-bottom: 2px solid var( --color-primary );
 	margin-bottom: -2px;
 }
 
 .smw-tabset > input:checked + label.smw-indicator-severity-error {
 	border-top: 1px solid transparent;
-	border-bottom: 2px solid var(--color-destructive);
-	color: var(--color-destructive);
+	border-bottom: 2px solid var( --color-destructive );
+	color: var( --color-destructive );
 }
 
 .smw-tabset > input:checked + label.smw-indicator-severity-warning {
 	border-top: 1px solid transparent;
-	border-bottom: 2px solid var(--color-warning);
-	color: var(--color-warning);
+	border-bottom: 2px solid var( --color-warning );
+	color: var( --color-warning );
 }
 
 .tab-panel {
-	border-top-color: var(--border-color-base);
+	border-top-color: var( --border-color-base );
 }
 
 .smw-issue-panel > label::after {
-	background: var(--color-surface-2);
+	background: var( --color-surface-2 );
 }
 
 /* smw/factbox/smw.factbox.css */
 .smwfact {
-	border-color: var(--border-color-base);
-	background-color: var(--color-surface-2);
+	border-color: var( --border-color-base );
+	background-color: var( --color-surface-2 );
 }
 
 .smwfact td,
 .smwfact tr,
 .smwfact table {
-	background-color: var(--color-surface-2);
+	background-color: var( --color-surface-2 );
 }
 
 .smwfact .smwfacttable {
-	border-top-color: var(--border-color-base);
+	border-top-color: var( --border-color-base );
 }
 
-.smwfact .smw-table-row:nth-child(odd) {
-	background-color: var(--color-surface-2);
+.smwfact .smw-table-row:nth-child( odd ) {
+	background-color: var( --color-surface-2 );
 }
 
-.smwfact .smw-table-row:nth-child(even) {
-	background-color: var(--color-surface-0);
+.smwfact .smw-table-row:nth-child( even ) {
+	background-color: var( --color-surface-0 );
 }
 
 .rdflink a {
-	color: var(--background-color-icon);
+	color: var( --background-color-icon );
 }
 
 .rdflink a:hover {
-	color: var(--background-color-icon--hover);
+	color: var( --background-color-icon--hover );
 }
 
 // Added active state
 .rdflink a:active {
-	color: var(--background-color-icon--hover);
+	color: var( --background-color-icon--hover );
 }
 
 .smw-factbox section {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 }
 
 .smw-factbox input.nav-tab:checked + label.nav-label {
 	border-color: transparent;
 	border-top: 1px solid transparent;
-	border-bottom: 2px solid var(--color-primary);
+	border-bottom: 2px solid var( --color-primary );
 	background: transparent;
 }
 
 .smw-factbox input.nav-tab:checked + label#tab-label-facts-attachment.nav-label {
 	border-color: transparent;
 	border-top: 1px solid transparent;
-	border-bottom: 2px solid var(--color-primary);
+	border-bottom: 2px solid var( --color-primary );
 }
 
 .smw-factbox .smwfact {
-	background-color: var(--color-surface-0);
+	background-color: var( --color-surface-0 );
 }
 
 /* smw/smw.indicators.css */
 .smw-icon-indicator-placeholder {
-	background-color: var(--color-surface-2);
+	background-color: var( --color-surface-2 );
 }
 
 .smw-indicator-vertical-bar-loader,
 .smw-indicator-vertical-bar-loader::before,
 .smw-indicator-vertical-bar-loader::after {
-	background: var(--color-surface-3);
+	background: var( --color-surface-3 );
 }
 
 .smw-indicator-vertical-bar-loader {
-	color: var(--color-surface-3);
+	color: var( --color-surface-3 );
 }
 
 .smw-list-rule-title {
-	border-bottom-color: var(--border-color-base);
-	color: var(--color-base--emphasized);
+	border-bottom-color: var( --border-color-base );
+	color: var( --color-base--emphasized );
 }
 
 /*
diff --git a/skinStyles/extensions/SemanticMediaWiki/ext.smw.table.styles.less b/skinStyles/extensions/SemanticMediaWiki/ext.smw.table.styles.less
index d46948b7..10a1b416 100644
--- a/skinStyles/extensions/SemanticMediaWiki/ext.smw.table.styles.less
+++ b/skinStyles/extensions/SemanticMediaWiki/ext.smw.table.styles.less
@@ -10,22 +10,22 @@
 
 /* smw/ext.smw.table.css */
 .smw-table-header {
-	background-color: var(--color-surface-2);
+	background-color: var( --color-surface-2 );
 }
 
 .smw-table-cell,
 .smw-table-head {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 }
 
 .smw-table-footer {
-	background-color: var(--color-surface-2);
+	background-color: var( --color-surface-2 );
 }
 
 .smw-table-sort-asc::after {
-	color: var(--background-color-icon);
+	color: var( --background-color-icon );
 }
 
 .smw-table-sort-desc::after {
-	color: var(--background-color-icon);
+	color: var( --background-color-icon );
 }
diff --git a/skinStyles/extensions/SemanticMediaWiki/ext.smw.vtabs.styles.less b/skinStyles/extensions/SemanticMediaWiki/ext.smw.vtabs.styles.less
index 76315603..a333df4f 100644
--- a/skinStyles/extensions/SemanticMediaWiki/ext.smw.vtabs.styles.less
+++ b/skinStyles/extensions/SemanticMediaWiki/ext.smw.vtabs.styles.less
@@ -12,76 +12,76 @@
 /* Style the buttons inside the tab */
 div.smw-vtab-nav button {
 	background-color: transparent;
-	color: var(--color-primary);
+	color: var( --color-primary );
 }
 
 div.smw-vtab-nav button a {
-	color: var(--color-primary);
+	color: var( --color-primary );
 }
 
 div.smw-vtab-nav.nav-right button {
-	border-left-color: var(--border-color-base);
+	border-left-color: var( --border-color-base );
 }
 
 div.smw-vtab-nav.nav-left button {
-	border-right-color: var(--border-color-base);
+	border-right-color: var( --border-color-base );
 }
 
 /* Change background color of buttons on hover */
 div.smw-vtab-nav button:hover {
-	border-color: var(--border-color-base);
-	border-radius: 0 var(--border-radius--small) var(--border-radius--small) 0;
-	background-color: var(--background-color-quiet--hover);
+	border-color: var( --border-color-base );
+	border-radius: 0 var( --border-radius--small ) var( --border-radius--small ) 0;
+	background-color: var( --background-color-quiet--hover );
 }
 
 div.smw-vtab-nav.nav-right button:hover {
-	border-color: var(--border-color-base);
-	border-left-color: var(--border-color-base);
+	border-color: var( --border-color-base );
+	border-left-color: var( --border-color-base );
 }
 
 div.smw-vtab-nav.nav-left button:hover {
-	border-color: var(--border-color-base);
-	border-right-color: var(--border-color-base);
+	border-color: var( --border-color-base );
+	border-right-color: var( --border-color-base );
 }
 
 /* Create an active/current "tab button" class */
 div.smw-vtab-nav button.active {
-	border: var(--border-color-base);
+	border: var( --border-color-base );
 	background-color: transparent;
-	color: var(--color-base--emphasized);
+	color: var( --color-base--emphasized );
 }
 
 div.smw-vtab-nav.nav-right button.active {
-	border-radius: 0 var(--border-radius--small) var(--border-radius--small) 0;
+	border-radius: 0 var( --border-radius--small ) var( --border-radius--small ) 0;
 }
 
 div.smw-vtab-nav.nav-left button.active {
-	border-radius: var(--border-radius--small) 0 0 var(--border-radius--small);
+	border-radius: var( --border-radius--small ) 0 0 var( --border-radius--small );
 }
 
 div.smw-vtab-nav button.active a {
-	color: var(--color-base--emphasized);
+	color: var( --color-base--emphasized );
 }
 
 div.smw-vtab-nav.nav-right button.active,
 div.smw-vtab-nav.nav-right button.active a {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 }
 
 div.smw-vtab-nav.nav-left button.active,
 div.smw-vtab-nav.nav-left button.active a {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 }
 
 /* Style the tab content */
 .smw-vtab-content {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 }
 
 div.smw-vtab-nav .smw-vtab-warning a {
-	color: var(--color-warning);
+	color: var( --color-warning );
 }
 
 div.smw-vtab-nav .smw-vtab-warning.active a {
-	color: var(--color-warning--active);
+	color: var( --color-warning--active );
 }
diff --git a/skinStyles/extensions/SemanticMediaWiki/smw.content.schema.less b/skinStyles/extensions/SemanticMediaWiki/smw.content.schema.less
index 6e7383a8..ad160642 100644
--- a/skinStyles/extensions/SemanticMediaWiki/smw.content.schema.less
+++ b/skinStyles/extensions/SemanticMediaWiki/smw.content.schema.less
@@ -10,71 +10,71 @@
 
 /* smw/content/smw.schema.css */
 .content-highlight {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 }
 
 .content-no-highlight-o {
-	border-color: var(--border-color-base);
-	background-color: var(--color-surface-2);
+	border-color: var( --border-color-base );
+	background-color: var( --color-surface-2 );
 }
 
 .unknown-type .content-highlight {
-	border-top-color: var(--border-color-base);
+	border-top-color: var( --border-color-base );
 }
 
 .schema-tags {
-	border-right-color: var(--border-color-base);
-	border-bottom-color: var(--border-color-base);
-	border-left-color: var(--border-color-base);
-	background-color: var(--color-surface-2);
+	border-right-color: var( --border-color-base );
+	border-bottom-color: var( --border-color-base );
+	border-left-color: var( --border-color-base );
+	background-color: var( --color-surface-2 );
 }
 
 .schema-tags:first-child {
-	border-color: var(--border-color-base);
-	background-color: var(--color-surface-2);
+	border-color: var( --border-color-base );
+	background-color: var( --color-surface-2 );
 }
 
 .schema-tags li {
-	border-left-color: var(--border-color-base);
+	border-left-color: var( --border-color-base );
 }
 
 .smw-schema-description {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .schema-error {
-	color: var(--color-destructive);
+	color: var( --color-destructive );
 }
 
 h3.smw-title {
-	border-bottom-color: var(--color-base--subtle);
-	color: var(--color-base--emphasized);
+	border-bottom-color: var( --color-base--subtle );
+	color: var( --color-base--emphasized );
 }
 
 /**
  * Tabs
  */
 .smw-schema #tab-schema-usage:checked + label.nav-label .item-count {
-	background-color: var(--color-surface-3);
-	color: var(--color-base);
+	background-color: var( --color-surface-3 );
+	color: var( --color-base );
 }
 
 .smw-schema section {
-	border-top-color: var(--border-color-base);
-	border-right-color: var(--border-color-base);
-	border-left-color: var(--border-color-base);
+	border-top-color: var( --border-color-base );
+	border-right-color: var( --border-color-base );
+	border-left-color: var( --border-color-base );
 }
 
 .smw-schema input.nav-tab:checked + label.nav-label {
 	border: 0;
-	border-bottom: 2px solid var(--color-primary);
+	border-bottom: 2px solid var( --color-primary );
 }
 
 .smw-schema input.nav-tab:checked + label.nav-label.error-label {
-	border-bottom: 2px solid var(--color-destructive);
+	border-bottom: 2px solid var( --color-destructive );
 }
 
 .schema-summary .smw-table-cell,
 .smw-table-head {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 }
diff --git a/skinStyles/extensions/SemanticMediaWiki/smw.jsonview.less b/skinStyles/extensions/SemanticMediaWiki/smw.jsonview.less
index 937ed7ac..bd350729 100644
--- a/skinStyles/extensions/SemanticMediaWiki/smw.jsonview.less
+++ b/skinStyles/extensions/SemanticMediaWiki/smw.jsonview.less
@@ -19,65 +19,65 @@
 }
 
 .smw-jsonview-button-group-left input {
-	border-color: var(--border-color-base);
-	border-radius: var(--border-radius--small);
+	border-color: var( --border-color-base );
+	border-radius: var( --border-radius--small );
 }
 
 .smw-jsonview-button {
 	height: 40px;
-	background-color: var(--color-primary);
+	background-color: var( --color-primary );
 	transition-duration: 0ms;
 }
 
 .smw-jsonview-button:first-child {
-	border-radius: var(--border-radius--small) 0 0 var(--border-radius--small);
-	border-right-color: var(--border-color-base);
+	border-radius: var( --border-radius--small ) 0 0 var( --border-radius--small );
+	border-right-color: var( --border-color-base );
 }
 
 .smw-jsonview-button:last-child {
-	border-radius: 0 var(--border-radius--small) var(--border-radius--small) 0;
+	border-radius: 0 var( --border-radius--small ) var( --border-radius--small ) 0;
 }
 
 .smw-jsonview-button:hover {
-	background-color: var(--color-primary--hover);
+	background-color: var( --color-primary--hover );
 }
 
 // Added active state
 .smw-jsonview-button:active {
-	background-color: var(--color-primary--active);
+	background-color: var( --color-primary--active );
 }
 
 .jsonview ul {
-	border-left-color: var(--border-color-base);
+	border-left-color: var( --border-color-base );
 }
 
 .smw-jsonview-menu {
 	height: 40px;
-	padding: var(--space-xs) 0;
+	padding: var( --space-xs ) 0;
 	border: 0;
-	border-bottom: 1px solid var(--border-color-base);
-	background-color: var(--color-surface-0);
+	border-bottom: 1px solid var( --border-color-base );
+	background-color: var( --color-surface-0 );
 }
 
 .smw-jsonview-menu + pre {
-	background-color: var(--color-surface-2);
+	background-color: var( --color-surface-2 );
 	border-top-left-radius: 0;
 	border-top-right-radius: 0;
 }
 
 .smw-jsonview-menu .smw-jsonview-button {
-	border-radius: var(--border-radius--small);
+	border-radius: var( --border-radius--small );
 	background-color: transparent;
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .smw-jsonview-menu .smw-jsonview-button:hover {
-	background-color: var(--background-color-quiet--hover);
+	background-color: var( --background-color-quiet--hover );
 }
 
 // Added active state
 .smw-jsonview-menu .smw-jsonview-button:active {
-	background-color: var(--background-color-quiet--active);
+	background-color: var( --background-color-quiet--active );
 }
 
 .smw-jsonview-menu .smw-jsonview-button:first-child {
diff --git a/skinStyles/extensions/SemanticMediaWiki/smw.special.search.styles.less b/skinStyles/extensions/SemanticMediaWiki/smw.special.search.styles.less
index 5f49e4d6..a42803cd 100644
--- a/skinStyles/extensions/SemanticMediaWiki/smw.special.search.styles.less
+++ b/skinStyles/extensions/SemanticMediaWiki/smw.special.search.styles.less
@@ -10,41 +10,41 @@
 
 /* smw/special.search/search.css */
 .smw-search-results-prepend {
-	padding: var(--space-xs) var(--space-md);
+	padding: var( --space-xs ) var( --space-md );
 	border: 0;
-	border-radius: var(--border-radius--medium);
-	background-color: var(--color-surface-2);
+	border-radius: var( --border-radius--medium );
+	background-color: var( --color-surface-2 );
 	font-size: 0.875rem;
 }
 
 .smw-text-strike > span::before,
 .smw-text-strike > span::after {
-	background: var(--border-color-base);
+	background: var( --border-color-base );
 }
 
 .smw-input {
-	border-bottom-color: var(--border-color-base);
+	border-bottom-color: var( --border-color-base );
 }
 
 .smw-select-field {
-	border-bottom-color: var(--border-color-base);
+	border-bottom-color: var( --border-color-base );
 }
 
 .smw-button-field {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .smw-form-link-query {
-	border-right-color: var(--border-color-base);
+	border-right-color: var( --border-color-base );
 }
 
 #smw-searchoptions {
-	padding: var(--space-xs) var(--space-md);
+	padding: var( --space-xs ) var( --space-md );
 	border: 0;
-	border-radius: var(--border-radius--medium);
-	background-color: var(--color-surface-2);
+	border-radius: var( --border-radius--medium );
+	background-color: var( --color-surface-2 );
 }
 
 #smw-searchoptions .divider {
-	border-bottom-color: var(--border-color-base);
+	border-bottom-color: var( --border-color-base );
 }
diff --git a/skinStyles/extensions/SemanticMediaWiki/smw.summarytable.less b/skinStyles/extensions/SemanticMediaWiki/smw.summarytable.less
index d96844e0..bacb7e45 100644
--- a/skinStyles/extensions/SemanticMediaWiki/smw.summarytable.less
+++ b/skinStyles/extensions/SemanticMediaWiki/smw.summarytable.less
@@ -11,23 +11,23 @@
 /* smw/smw.summarytable.css */
 .smw-summarytable .smw-table-cell,
 .smw-table-head {
-	border-color: var(--border-color-base);
-	border-bottom-color: var(--border-color-base);
+	border-color: var( --border-color-base );
+	border-bottom-color: var( --border-color-base );
 }
 
 /**
  * Responsive settings (#see smw.table.css)
  */
-@media screen and (max-width: 800px) {
+@media screen and ( max-width: 800px ) {
 	.smw-summarytable .smw-table-row .smwpropname {
-		border-bottom-color: var(--border-color-base);
+		border-bottom-color: var( --border-color-base );
 	}
 
 	.smw-summarytable-imagecolumn .smw-summarytable-image {
-		border-top-color: var(--border-color-base);
+		border-top-color: var( --border-color-base );
 	}
 
 	.smw-summarytable-columns .smw-summarytable-columns-2:first-child {
-		border-bottom-color: var(--border-color-base);
+		border-bottom-color: var( --border-color-base );
 	}
 }
diff --git a/skinStyles/extensions/SemanticMediaWiki/smw.tippy.less b/skinStyles/extensions/SemanticMediaWiki/smw.tippy.less
index e42943d3..d705a5c9 100644
--- a/skinStyles/extensions/SemanticMediaWiki/smw.tippy.less
+++ b/skinStyles/extensions/SemanticMediaWiki/smw.tippy.less
@@ -10,60 +10,60 @@
 
 /* smw/util/smw.tippy.css */
 .tippy-header {
-	border-bottom-color: var(--border-color-base);
-	background-color: var(--color-surface-2);
-	border-top-left-radius: var(--border-radius--small);
-	border-top-right-radius: var(--border-radius--small);
+	border-bottom-color: var( --border-color-base );
+	background-color: var( --color-surface-2 );
+	border-top-left-radius: var( --border-radius--small );
+	border-top-right-radius: var( --border-radius--small );
 }
 
 .tippy-bottom {
-	border-top-color: var(--border-color-base);
-	background-color: var(--color-surface-1);
-	border-bottom-left-radius: var(--border-radius--small);
-	border-bottom-right-radius: var(--border-radius--small);
+	border-top-color: var( --border-color-base );
+	background-color: var( --color-surface-1 );
+	border-bottom-left-radius: var( --border-radius--small );
+	border-bottom-right-radius: var( --border-radius--small );
 }
 
-.tippy-tooltip.light-border-theme[x-placement^='bottom'] .tippy-arrow,
-.tippy-tooltip.light-theme[x-placement^='bottom'] .tippy-arrow,
-.tippy-tooltip.light-border-theme[x-placement^='bottom'] .tippy-arrow::after,
-.tippy-tooltip.light-theme[x-placement^='bottom'] .tippy-arrow::after {
-	border-bottom-color: var(--color-surface-2);
+.tippy-tooltip.light-border-theme[ x-placement^='bottom' ] .tippy-arrow,
+.tippy-tooltip.light-theme[ x-placement^='bottom' ] .tippy-arrow,
+.tippy-tooltip.light-border-theme[ x-placement^='bottom' ] .tippy-arrow::after,
+.tippy-tooltip.light-theme[ x-placement^='bottom' ] .tippy-arrow::after {
+	border-bottom-color: var( --color-surface-2 );
 }
 
-.tippy-tooltip.light-border-theme.square-border-transparent-arrow[x-placement^='bottom'] .tippy-arrow,
-.tippy-tooltip.light-border-theme.square-border-light[x-placement^='bottom'] .tippy-arrow,
-.tippy-tooltip.light-theme.square-border-transparent-arrow[x-placement^='bottom'] .tippy-arrow,
-.tippy-tooltip.light-theme.square-border-light[x-placement^='bottom'] .tippy-arrow,
-.tippy-tooltip.light-border-theme.square-border-transparent-arrow[x-placement^='bottom'] .tippy-arrow::after,
-.tippy-tooltip.light-border-theme.square-border-light[x-placement^='bottom'] .tippy-arrow::after,
-.tippy-tooltip.light-theme.square-border-transparent-arrow[x-placement^='bottom'] .tippy-arrow::after,
-.tippy-tooltip.light-theme.square-border-light[x-placement^='bottom'] .tippy-arrow::after {
-	border-bottom-color: var(--color-surface-1);
+.tippy-tooltip.light-border-theme.square-border-transparent-arrow[ x-placement^='bottom' ] .tippy-arrow,
+.tippy-tooltip.light-border-theme.square-border-light[ x-placement^='bottom' ] .tippy-arrow,
+.tippy-tooltip.light-theme.square-border-transparent-arrow[ x-placement^='bottom' ] .tippy-arrow,
+.tippy-tooltip.light-theme.square-border-light[ x-placement^='bottom' ] .tippy-arrow,
+.tippy-tooltip.light-border-theme.square-border-transparent-arrow[ x-placement^='bottom' ] .tippy-arrow::after,
+.tippy-tooltip.light-border-theme.square-border-light[ x-placement^='bottom' ] .tippy-arrow::after,
+.tippy-tooltip.light-theme.square-border-transparent-arrow[ x-placement^='bottom' ] .tippy-arrow::after,
+.tippy-tooltip.light-theme.square-border-light[ x-placement^='bottom' ] .tippy-arrow::after {
+	border-bottom-color: var( --color-surface-1 );
 }
 
 .square-border-light .tippy-header {
-	background-color: var(--color-surface-1);
+	background-color: var( --color-surface-1 );
 }
 
 .tippy-cancel {
-	color: var(--background-color-icon);
+	color: var( --background-color-icon );
 	opacity: 1;
 	text-shadow: none;
 }
 
 .tippy-cancel:hover {
-	color: var(--background-color-icon--hover);
+	color: var( --background-color-icon--hover );
 	opacity: 1;
 }
 
 .tippy-cancel:active {
-	color: var(--background-color-icon--active);
+	color: var( --background-color-icon--active );
 }
 
 .tippy-warning-circle {
-	background-color: var(--color-warning);
+	background-color: var( --color-warning );
 }
 
 .tippy-error-circle {
-	background-color: var(--color-destructive);
+	background-color: var( --color-destructive );
 }
diff --git a/skinStyles/extensions/SemanticMediaWiki/smw.ui.styles.less b/skinStyles/extensions/SemanticMediaWiki/smw.ui.styles.less
index aab0f281..e92309ea 100644
--- a/skinStyles/extensions/SemanticMediaWiki/smw.ui.styles.less
+++ b/skinStyles/extensions/SemanticMediaWiki/smw.ui.styles.less
@@ -11,11 +11,11 @@
 /* jquery/jquery.selectmenu.css */
 /* Sub menus */
 .sm_sub_header:hover {
-	color: var(--color-base--emphasized) !important;
+	color: var( --color-base--emphasized ) !important;
 }
 
 .sm_sub_header button {
-	color: var(--color-base--emphasized);
+	color: var( --color-base--emphasized );
 }
 
 /**
@@ -23,50 +23,50 @@
  */
 .sm_container {
 	border: 0;
-	background-color: var(--color-surface-1);
-	box-shadow: var(--box-shadow-dialog);
+	background-color: var( --color-surface-1 );
+	box-shadow: var( --box-shadow-dialog );
 }
 
 .sm_header > h3 {
-	margin: var(--space-md);
-	color: var(--color-base--emphasized);
+	margin: var( --space-md );
+	color: var( --color-base--emphasized );
 	font-family: inherit;
 }
 
 .sm_header button {
 	top: 12px;
-	color: var(--background-color-icon);
+	color: var( --background-color-icon );
 }
 
 .sm_header button:hover {
-	color: var(--background-color-icon--hover);
+	color: var( --background-color-icon--hover );
 }
 
 .sm_header button.sm_close_button {
-	right: var(--space-md);
+	right: var( --space-md );
 }
 
 .sm_input {
-	border-color: var(--border-color-base);
-	border-radius: var(--border-radius--small);
-	background-color: var(--color-surface-1);
+	border-color: var( --border-color-base );
+	border-radius: var( --border-radius--small );
+	background-color: var( --color-surface-1 );
 }
 
 .sm_input:focus {
-	border-color: var(--color-primary);
-	box-shadow: inset 0 0 0 1px var(--color-primary);
+	border-color: var( --color-primary );
+	box-shadow: inset 0 0 0 1px var( --color-primary );
 }
 
 /**
  * "Get all" button
  */
 div.sm_clear_btn {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 	font-family: inherit;
 }
 
 div.sm_clear_btn:hover {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 /**
@@ -77,130 +77,130 @@ div.sm_clear_btn:hover {
 }
 
 .sm_result_area.sm_list_mode {
-	border-top-color: var(--border-color-base);
+	border-top-color: var( --border-color-base );
 }
 
 .sm_result_tabs {
-	border-bottom-color: var(--border-color-base);
+	border-bottom-color: var( --border-color-base );
 }
 
 .sm_result_tabs ul li a {
-	border-radius: var(--border-radius--small) var(--border-radius--small) 0 0;
-	color: var(--color-base);
+	border-radius: var( --border-radius--small ) var( --border-radius--small ) 0 0;
+	color: var( --color-base );
 	font-family: inherit;
 }
 
 .sm_result_tabs ul li a.active {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 	border-bottom-color: transparent;
 	background-color: transparent;
-	color: var(--color-base--emphasized);
+	color: var( --color-base--emphasized );
 }
 
 /* menu arrow */
 .sm_arrow_bottom > .sm_arrow {
-	border-bottom-color: var(--color-surface-1);
+	border-bottom-color: var( --color-surface-1 );
 }
 
 .sm_arrow_bottom > .sm_arrow::after {
-	border-bottom-color: var(--color-surface-1);
+	border-bottom-color: var( --color-surface-1 );
 }
 
 .sm_arrow_bottom > .sm_arrow.sm_have_title::after {
-	border-bottom-color: var(--color-surface-1);
+	border-bottom-color: var( --color-surface-1 );
 }
 
 .sm_arrow_top > .sm_arrow {
-	border-top-color: var(--color-surface-1);
+	border-top-color: var( --color-surface-1 );
 }
 
 .sm_arrow_top > .sm_arrow::after {
-	border-top-color: var(--color-surface-1);
+	border-top-color: var( --color-surface-1 );
 }
 /* menu arrow */
 
 .sm_results {
-	background-color: var(--color-surface-1);
+	background-color: var( --color-surface-1 );
 }
 
 /* regular menu item style */
 .sm_regular .sm_results > li:hover {
-	background-color: var(--color-primary--hover);
+	background-color: var( --color-primary--hover );
 }
 
 .sm_regular .sm_results > li.sm_disabled,
 .sm_regular .sm_results > li.sm_disabled:hover,
 .sm_regular .sm_results > li.sm_disabled a {
-	background-color: var(--color-surface-1);
-	color: var(--color-base--subtle);
+	background-color: var( --color-surface-1 );
+	color: var( --color-base--subtle );
 }
 
 .sm_regular .sm_results > li.sm_header,
 .sm_regular .sm_results > li.sm_header:hover,
 .sm_regular .sm_results > li.sm_header a {
 	background-color: transparent;
-	color: var(--color-base--emphasized);
+	color: var( --color-base--emphasized );
 }
 
 /* regular menu item style */
 .sm_results > li {
-	color: var(--color-base);
+	color: var( --color-base );
 	font-family: inherit;
 }
 
 .sm_results > li > a {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .sm_results > li.sm_divider {
-	border-bottom-color: var(--border-color-base);
+	border-bottom-color: var( --border-color-base );
 }
 
 ul.sm_results > li.sm_over {
-	background-color: var(--color-primary--hover) !important;
+	background-color: var( --color-primary--hover ) !important;
 }
 
 .sm_control_box {
-	border-top-color: var(--border-color-base);
-	background-color: var(--color-surface-1);
+	border-top-color: var( --border-color-base );
+	background-color: var( --color-surface-1 );
 }
 
 .sm_control_box button {
-	background-color: var(--color-surface-2);
-	color: var(--background-color-icon);
+	background-color: var( --color-surface-2 );
+	color: var( --background-color-icon );
 }
 
 .sm_control_box button:hover {
-	background-color: var(--color-surface-2--hover);
-	color: var(--background-color-icon--hover);
+	background-color: var( --color-surface-2--hover );
+	color: var( --background-color-icon--hover );
 }
 
 div.sm_container_combo {
-	border-color: var(--border-color-base);
-	border-radius: var(--border-radius--small);
+	border-color: var( --border-color-base );
+	border-radius: var( --border-radius--small );
 }
 
 div.sm_container_combo.sm_disabled,
 div.sm_container_combo.sm_disabled ul.sm_element_box,
 div.sm_container_combo.sm_disabled .sm_input {
-	background-color: var(--color-surface-2);
+	background-color: var( --color-surface-2 );
 }
 
 div.sm_container_combo.sm_container_open {
-	border-color: var(--color-primary);
-	box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px var(--color-primary);
+	border-color: var( --color-primary );
+	box-shadow: inset 0 1px 1px rgba( 0, 0, 0, 0.075 ), 0 0 8px var( --color-primary );
 }
 
-input.sm_combo_input[readonly],
-input.sm_combo_input[disabled] {
-	background-color: var(--color-surface-2);
+input.sm_combo_input[ readonly ],
+input.sm_combo_input[ disabled ] {
+	background-color: var( --color-surface-2 );
 }
 
 ul.sm_element_box li.selected_tag {
-	border-color: var(--border-color-base);
-	border-radius: var(--border-radius--small);
-	background-color: var(--color-surface-2);
-	box-shadow: 0 0 2px var(--color-surface-1) inset, 0 1px 0 rgba(0, 0, 0, 0.05);
+	border-color: var( --border-color-base );
+	border-radius: var( --border-radius--small );
+	background-color: var( --color-surface-2 );
+	box-shadow: 0 0 2px var( --color-surface-1 ) inset, 0 1px 0 rgba( 0, 0, 0, 0.05 );
 }
 
 ul.sm_element_box li.selected_tag span.tag_close {
@@ -208,82 +208,82 @@ ul.sm_element_box li.selected_tag span.tag_close {
 }
 
 .sm_input_off {
-	background: var(--color-surface-2);
-	color: var(--color-base);
+	background: var( --color-surface-2 );
+	color: var( --color-base );
 }
 
 /**
  * Navi
  */
 .sm_navi {
-	border-bottom-color: var(--color-primary);
-	background: var(--color-surface-2);
+	border-bottom-color: var( --color-primary );
+	background: var( --color-surface-2 );
 }
 
 .sm_navi > p > a:link,
 .sm_navi > p > a:visited,
 .sm_navi > p > a:hover,
 .sm_navi > p > a:active {
-	color: var(--color-primary);
+	color: var( --color-primary );
 }
 
 .sm_navi > p {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .sm_navi > p > a > .current {
-	color: var(--color-primary--active);
+	color: var( --color-primary--active );
 }
 
 .sm_navi > p > .page_end {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .sm_container > .sm_select_ng {
-	background: var(--color-warning);
+	background: var( --color-warning );
 }
 
 div.sm_result_area div.pagination > ul > li > a {
 	background-color: transparent;
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 div.sm_result_area div.pagination > ul > li > a:hover {
-	background-color: var(--background-color-quiet--hover);
-	color: var(--color-base--emphasized);
+	background-color: var( --background-color-quiet--hover );
+	color: var( --color-base--emphasized );
 }
 
 div.sm_result_area div.pagination > ul > li.disabled > a {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 div.sm_result_area div.pagination > ul > li.disabled > a:hover {
 	background-color: transparent;
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 div.sm_result_area div.pagination > ul > li.pageInfoBox > a {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 div.sm_result_area div.pagination > ul > li.pageInfoBox > a:hover {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 /* smw/smw.selectmenu.css */
 .smw-selectmenu-button {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .smw-selectmenu-label {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .sm_result_area,
 .sm_results {
-	border-radius: 0 0 var(--border-radius--medium) var(--border-radius--medium);
+	border-radius: 0 0 var( --border-radius--medium ) var( --border-radius--medium );
 }
 
 ul.sm_results > li.sm_over:last-child {
-	border-radius: 0 0 var(--border-radius--medium) var(--border-radius--medium);
+	border-radius: 0 0 var( --border-radius--medium ) var( --border-radius--medium );
 }
diff --git a/skinStyles/extensions/Tabber/ext.Tabber.less b/skinStyles/extensions/Tabber/ext.Tabber.less
index be3a7a07..17e8d770 100644
--- a/skinStyles/extensions/Tabber/ext.Tabber.less
+++ b/skinStyles/extensions/Tabber/ext.Tabber.less
@@ -21,7 +21,7 @@
 			padding: 0;
 
 			&.tabberactive a {
-				color: var(--color-primary);
+				color: var( --color-primary );
 				pointer-events: none;
 			}
 
@@ -31,16 +31,16 @@
 				border: 0;
 				margin: 0 12px 0 0;
 				background: 0 !important; // To override hover styles
-				color: var(--color-base--subtle);
-				font-weight: var(--font-weight-medium);
+				color: var( --color-base--subtle );
+				font-weight: var( --font-weight-medium );
 
 				&:hover {
 					border: 0;
-					color: var(--color-base) !important;
+					color: var( --color-base ) !important;
 				}
 
 				&:active {
-					color: var(--color-base--subtle) !important;
+					color: var( --color-base--subtle ) !important;
 				}
 			}
 		}
@@ -52,7 +52,7 @@
 	}
 }
 
-@media (max-width: @width-breakpoint-tablet) {
+@media ( max-width: @width-breakpoint-tablet ) {
 	.tabber {
 		ul.tabbernav {
 			flex-wrap: nowrap;
diff --git a/skinStyles/extensions/TabberNeue/ext.tabberNeue.less b/skinStyles/extensions/TabberNeue/ext.tabberNeue.less
index 11075b4c..3feffb14 100644
--- a/skinStyles/extensions/TabberNeue/ext.tabberNeue.less
+++ b/skinStyles/extensions/TabberNeue/ext.tabberNeue.less
@@ -10,30 +10,30 @@
 
 .tabber {
 	&__tab {
-		color: var(--color-base);
-		font-weight: var(--font-weight-medium);
+		color: var( --color-base );
+		font-weight: var( --font-weight-medium );
 
 		&:visited {
-			color: var(--color-base);
+			color: var( --color-base );
 		}
 
-		&[aria-selected='true'],
-		&[aria-selected='true']:visited {
-			color: var(--color-primary);
+		&[ aria-selected='true' ],
+		&[ aria-selected='true' ]:visited {
+			color: var( --color-primary );
 		}
 	}
 
 	&__indicator {
-		background: var(--color-primary);
+		background: var( --color-primary );
 	}
 
 	&__header {
-		box-shadow: inset 0 -1px 0 0 var(--border-color-base--darker);
+		box-shadow: inset 0 -1px 0 0 var( --border-color-base--darker );
 
 		&__prev,
 		&__next {
 			&::after {
-				opacity: var(--opacity-icon-base);
+				opacity: var( --opacity-icon-base );
 			}
 		}
 	}
@@ -43,21 +43,21 @@
 			.tabber__loading-indicator,
 			&::before,
 			&::after {
-				background-color: var(--color-primary);
+				background-color: var( --color-primary );
 			}
 		}
 	}
 }
 
-@media (hover: hover) {
+@media ( hover: hover ) {
 	.tabber {
 		&__tab {
 			&:hover {
-				color: var(--color-primary--hover);
+				color: var( --color-primary--hover );
 			}
 
 			&:active {
-				color: var(--color-primary--active);
+				color: var( --color-primary--active );
 			}
 		}
 
@@ -65,18 +65,18 @@
 			&__prev,
 			&__next {
 				&:hover {
-					background-color: var(--background-color-quiet--hover);
+					background-color: var( --background-color-quiet--hover );
 
 					&::after {
-						opacity: var(--opacity-icon-base--hover);
+						opacity: var( --opacity-icon-base--hover );
 					}
 				}
 
 				&:active {
-					background-color: var(--background-color-quiet--active);
+					background-color: var( --background-color-quiet--active );
 
 					&::after {
-						opacity: var(--opacity-icon-base--active);
+						opacity: var( --opacity-icon-base--active );
 					}
 				}
 			}
diff --git a/skinStyles/extensions/TimedMediaHandler/ext.tmh.player.styles.less b/skinStyles/extensions/TimedMediaHandler/ext.tmh.player.styles.less
index ff6ecc4a..ce5fed7c 100644
--- a/skinStyles/extensions/TimedMediaHandler/ext.tmh.player.styles.less
+++ b/skinStyles/extensions/TimedMediaHandler/ext.tmh.player.styles.less
@@ -5,19 +5,19 @@
 		}
 
 		&-interstitial {
-			background-color: var(--background-color-overlay--lighter);
+			background-color: var( --background-color-overlay--lighter );
 		}
 
 		&-progress {
 			position: relative;
 			top: 50%;
-			border-color: var(--border-color-base--lighter);
-			border-radius: var(--border-radius--pill);
+			border-color: var( --border-color-base--lighter );
+			border-radius: var( --border-radius--pill );
 			margin: 0 auto;
-			background-color: var(--color-surface-1);
+			background-color: var( --color-surface-1 );
 
 			&-bar {
-				background-color: var(--color-primary);
+				background-color: var( --color-primary );
 			}
 		}
 	}
diff --git a/skinStyles/extensions/Translate/ext.translate.dropdownmenu.less b/skinStyles/extensions/Translate/ext.translate.dropdownmenu.less
index 9538bf16..49a38305 100644
--- a/skinStyles/extensions/Translate/ext.translate.dropdownmenu.less
+++ b/skinStyles/extensions/Translate/ext.translate.dropdownmenu.less
@@ -9,6 +9,6 @@
 */
 
 .tux-dropdown-menu {
-	border-color: var(--border-color-base);
-	background: var(--color-surface-1);
+	border-color: var( --border-color-base );
+	background: var( --color-surface-1 );
 }
diff --git a/skinStyles/extensions/Translate/ext.translate.editor.less b/skinStyles/extensions/Translate/ext.translate.editor.less
index aa9199b5..f0785644 100644
--- a/skinStyles/extensions/Translate/ext.translate.editor.less
+++ b/skinStyles/extensions/Translate/ext.translate.editor.less
@@ -10,231 +10,231 @@
 
 /* ext.translate.editor */
 .tux-message-editor {
-	border-color: var(--border-color-base);
-	background-color: var(--color-surface-1);
+	border-color: var( --border-color-base );
+	background-color: var( --color-surface-1 );
 }
 
 .tux-message-editor .editcolumn {
-	border-right-color: var(--border-color-base);
-	background-color: var(--color-surface-1);
+	border-right-color: var( --border-color-base );
+	background-color: var( --color-surface-1 );
 }
 
 .tux-message-editor textarea {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 }
 
 .tux-editor-editsummary-block input {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 }
 
 .tux-editor-editsummary-block input:disabled {
-	background-color: var(--color-surface-3);
+	background-color: var( --color-surface-3 );
 }
 
 .grid .tux-message-editor .messagekey {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .tux-message-editor .messagekey .caret {
-	border-top-color: var(--color-base);
+	border-top-color: var( --color-base );
 }
 
 .tux-message-editor .shortcutinfo {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .grid .tux-message-editor .infocolumn-block {
-	background: var(--color-surface-2);
+	background: var( --color-surface-2 );
 }
 
 .tux-message-editor__caret::before,
 .tux-message-editor__caret::after {
-	border-right-color: var(--border-color-base);
+	border-right-color: var( --border-color-base );
 }
 
 .tux-message-editor__caret::after {
-	border-right-color: var(--color-surface-2);
+	border-right-color: var( --color-surface-2 );
 }
 
 .infocolumn-block .infocolumn .message-desc.long {
-	border-bottom-color: var(--border-color-base);
+	border-bottom-color: var( --border-color-base );
 }
 
 .message-desc-control .read-more {
-	color: var(--color-primary);
+	color: var( --color-primary );
 }
 
 .tm-suggestion,
 .in-other-language {
-	border-color: var(--border-color-base);
-	border-left-color: var(--color-primary);
-	background-color: var(--color-surface-2);
+	border-color: var( --border-color-base );
+	border-left-color: var( --color-primary );
+	background-color: var( --color-surface-2 );
 }
 
 .in-other-language .language {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .tux-notice {
-	background-color: var(--background-color-warning);
+	background-color: var( --background-color-warning );
 }
 
 .tux-highlight {
-	background-color: var(--color-surface-4);
+	background-color: var( --color-surface-4 );
 }
 
 .editarea .tux-more-notices {
-	background-color: var(--background-color-warning);
+	background-color: var( --background-color-warning );
 }
 
 .tux-notice-message.error,
 .tux-notice-message.translation-saving {
-	background-color: var(--background-color-destructive);
-	color: var(--color-destructive);
+	background-color: var( --background-color-destructive );
+	color: var( --color-destructive );
 }
 
 .tux-notice-message .show-diff-link {
-	color: var(--color-primary);
+	color: var( --color-primary );
 }
 
 .editarea .tux-more-notices::before {
-	border-right-color: var(--background-color-warning);
-	border-bottom-color: var(--background-color-warning);
+	border-right-color: var( --background-color-warning );
+	border-bottom-color: var( --background-color-warning );
 }
 
 .editarea .tux-more-notices.tux-has-errors {
-	background-color: var(--background-color-destructive);
+	background-color: var( --background-color-destructive );
 }
 
 .editarea .tux-more-notices.tux-has-errors::before {
-	border-right-color: var(--background-color-destructive);
-	border-bottom-color: var(--background-color-destructive);
+	border-right-color: var( --background-color-destructive );
+	border-bottom-color: var( --background-color-destructive );
 }
 
 .tux-editor-request-right {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 // Added custom hover states and cursor
 .tux-editor-insert-buttons button {
-	border-color: var(--border-color-base);
-	background: var(--color-surface-2);
-	color: var(--color-base--emphasized);
+	border-color: var( --border-color-base );
+	background: var( --color-surface-2 );
+	color: var( --color-base--emphasized );
 	cursor: pointer;
 
 	&:hover {
-		background: var(--color-surface-2--hover);
+		background: var( --color-surface-2--hover );
 	}
 
 	&:active {
-		background: var(--color-surface-2--active);
+		background: var( --color-surface-2--active );
 	}
 }
 
 .tux-editor-insert-buttons .tux-editor-paste-original-button {
-	background: var(--color-surface-2) left center no-repeat;
+	background: var( --color-surface-2 ) left center no-repeat;
 }
 
 .infocolumn .loading {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .tux-message-tools-menu li a {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .tux-message-tools-menu li a:hover {
-	background-color: var(--background-color-quiet--hover);
-	color: var(--color-base);
+	background-color: var( --background-color-quiet--hover );
+	color: var( --color-base );
 	cursor: pointer;
 }
 
 .tux-message-tools-menu li.selected {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .shortcut-popup {
-	border-color: var(--color-base);
-	background-color: var(--color-surface-1);
+	border-color: var( --color-base );
+	background-color: var( --color-surface-1 );
 }
 
 /* ext.translate.pagemode.css */
 .ext-translate-container .tux-messagelist .tux-message-pagemode {
-	background: var(--color-surface-2);
+	background: var( --color-surface-2 );
 }
 
 .ext-translate-container .tux-messagelist .tux-message-pagemode .tux-message-item-compact {
-	border-right-color: var(--border-color-base);
-	border-bottom-color: var(--color-surface-2);
-	border-left-color: var(--border-color-base);
-	background: var(--color-surface-1);
+	border-right-color: var( --border-color-base );
+	border-bottom-color: var( --color-surface-2 );
+	border-left-color: var( --border-color-base );
+	background: var( --color-surface-1 );
 }
 
 .ext-translate-container .tux-messagelist .tux-message-pagemode .tux-message-item-compact:hover {
-	background: var(--color-surface-2--hover);
+	background: var( --color-surface-2--hover );
 }
 
 .ext-translate-container .tux-messagelist .tux-message-pagemode:first-child .tux-message-item-compact {
-	border-top-color: var(--border-color-base);
+	border-top-color: var( --border-color-base );
 }
 
 .ext-translate-container .tux-messagelist .tux-message-pagemode:last-child .tux-message-item-compact {
-	border-bottom-color: var(--border-color-base);
+	border-bottom-color: var( --border-color-base );
 }
 
 .tux-messagelist .tux-message-pagemode .tux-pagemode-source {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .tux-messagelist .tux-message-pagemode .tux-pagemode-translation {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 /* ext.translate.proofread */
 .ext-translate-container .tux-messagelist .tux-message-proofread {
-	background: var(--color-surface-2);
+	background: var( --color-surface-2 );
 }
 
 .ext-translate-container .tux-messagelist .tux-message-proofread .tux-message-item-compact {
-	border-right-color: var(--border-color-base);
-	border-bottom-color: var(--color-surface-2);
-	border-left-color: var(--border-color-base);
-	background: var(--color-surface-1);
+	border-right-color: var( --border-color-base );
+	border-bottom-color: var( --color-surface-2 );
+	border-left-color: var( --border-color-base );
+	background: var( --color-surface-1 );
 }
 
 .ext-translate-container .tux-messagelist .tux-message-proofread .tux-message-item-compact:hover {
-	background: var(--color-surface-2--hover);
+	background: var( --color-surface-2--hover );
 }
 
 .ext-translate-container .tux-messagelist .tux-message-proofread:first-child .tux-message-item-compact {
-	border-top-color: var(--border-color-base);
+	border-top-color: var( --border-color-base );
 }
 
 .ext-translate-container .tux-messagelist .tux-message-proofread:last-child .tux-message-item-compact {
-	border-bottom-color: var(--border-color-base);
+	border-bottom-color: var( --border-color-base );
 }
 
 .tux-messagelist .tux-message-proofread .tux-proofread-source {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .tux-messagelist .tux-message-proofread .tux-proofread-translation {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .ext-translate-container .tux-messagelist .tux-message-proofread.own-translation,
 .ext-translate-container .tux-messagelist .tux-message-proofread.own-translation:hover {
-	background: var(--color-surface-2--hover);
+	background: var( --color-surface-2--hover );
 }
 
 .translated-by-self {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .tux-proofread-edit-label {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .tux-proofread-count {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
diff --git a/skinStyles/extensions/Translate/ext.translate.groupselector.less b/skinStyles/extensions/Translate/ext.translate.groupselector.less
index 7b259230..6b901207 100644
--- a/skinStyles/extensions/Translate/ext.translate.groupselector.less
+++ b/skinStyles/extensions/Translate/ext.translate.groupselector.less
@@ -9,43 +9,43 @@
 */
 
 .tux-groupselector {
-	border-color: var(--border-color-base);
-	background-color: var(--color-surface-2);
+	border-color: var( --border-color-base );
+	background-color: var( --color-surface-2 );
 }
 
 /* The triangle shaped callout */
 .tux-groupselector::before {
-	border-bottom-color: var(--border-color-base);
+	border-bottom-color: var( --border-color-base );
 }
 
 .tux-groupselector::after {
-	border-bottom-color: var(--color-surface-2);
+	border-bottom-color: var( --color-surface-2 );
 }
 
 .tux-groupselector__filter__search__input {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 }
 
 .tux-grouptab {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .tux-grouptab--selected {
-	border-bottom-color: var(--color-primary);
+	border-bottom-color: var( --color-primary );
 }
 
 .tux-grouplist {
-	background-color: var(--color-surface-1);
+	background-color: var( --color-surface-1 );
 }
 
 .tux-grouplist__item {
-	border-bottom-color: var(--border-color-base);
+	border-bottom-color: var( --border-color-base );
 
 	&:hover {
-		background-color: var(--background-color-quiet--hover);
+		background-color: var( --background-color-quiet--hover );
 	}
 }
 
 .grid .row .tux-grouplist__item__subgroups {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
diff --git a/skinStyles/extensions/Translate/ext.translate.less b/skinStyles/extensions/Translate/ext.translate.less
index 847e86ac..4875543d 100644
--- a/skinStyles/extensions/Translate/ext.translate.less
+++ b/skinStyles/extensions/Translate/ext.translate.less
@@ -9,9 +9,9 @@
 */
 
 .mw-translate-fuzzy {
-	background-color: var(--background-color-destructive);
+	background-color: var( --background-color-destructive );
 }
 
 .mw-pt-translate-header {
-	border-bottom-color: var(--border-color-base);
+	border-bottom-color: var( --border-color-base );
 }
diff --git a/skinStyles/extensions/Translate/ext.translate.messagerenamedialog.less b/skinStyles/extensions/Translate/ext.translate.messagerenamedialog.less
index 3087b38e..52f4f047 100644
--- a/skinStyles/extensions/Translate/ext.translate.messagerenamedialog.less
+++ b/skinStyles/extensions/Translate/ext.translate.messagerenamedialog.less
@@ -10,10 +10,10 @@
 
 .smg-rename-dialog {
 	.smg-rename-list:hover {
-		background-color: var(--color-surface-2--hover);
+		background-color: var( --color-surface-2--hover );
 	}
 
 	.smg-rename-selected {
-		background-color: var(--color-surface-2--active);
+		background-color: var( --color-surface-2--active );
 	}
 }
diff --git a/skinStyles/extensions/Translate/ext.translate.messagetable.less b/skinStyles/extensions/Translate/ext.translate.messagetable.less
index fe0268b9..365f4d7b 100644
--- a/skinStyles/extensions/Translate/ext.translate.messagetable.less
+++ b/skinStyles/extensions/Translate/ext.translate.messagetable.less
@@ -9,78 +9,78 @@
 */
 
 .tux-messagelist {
-	background-color: var(--color-surface-2);
-	color: var(--color-base);
+	background-color: var( --color-surface-2 );
+	color: var( --color-base );
 }
 
 .tux-message-item {
-	border-bottom-color: var(--border-color-base);
-	background: var(--color-surface-0); // So that it is the same color as page base
+	border-bottom-color: var( --border-color-base );
+	background: var( --color-surface-0 ); // So that it is the same color as page base
 }
 
 .tux-message-item.translated,
 .tux-message-item.translated:hover,
 .tux-message-item.proofread,
 .tux-message-item.proofread:hover {
-	background-color: var(--color-surface-3);
+	background-color: var( --color-surface-3 );
 }
 
 .tux-message-item:hover {
-	background-color: var(--color-surface-2--hover);
+	background-color: var( --color-surface-2--hover );
 }
 
 .tux-info {
-	background-color: var(--color-surface-3);
+	background-color: var( --color-surface-3 );
 }
 
 .tux-list-translation {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .tux-messagetable-loader {
-	background: var(--color-surface-2);
+	background: var( --color-surface-2 );
 	box-shadow: none;
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .tux-action-bar {
-	background-color: var(--color-surface-1);
-	color: var(--color-base);
+	background-color: var( --color-surface-1 );
+	color: var( --color-base );
 }
 
-@media screen and (min-height: 500px) {
+@media screen and ( min-height: 500px ) {
 	.tux-action-bar.floating {
-		border-top-color: var(--border-color-base);
+		border-top-color: var( --border-color-base );
 	}
 }
 
 .tux-action-bar button {
-	border-color: var(--border-color-base);
-	background: var(--color-surface-2);
+	border-color: var( --border-color-base );
+	background: var( --color-surface-2 );
 }
 
 .tux-action-bar button:hover {
-	background: var(--color-surface-2--hover);
+	background: var( --color-surface-2--hover );
 }
 
 .tux-action-bar button:active,
 .tux-action-bar button.down {
-	background: var(--color-primary);
+	background: var( --color-primary );
 }
 
 .tux-action-bar button.disabled,
 .tux-action-bar button.disabled:hover {
-	border-color: var(--border-color-base);
-	background-color: var(--color-surface-4);
-	color: var(--color-base--subtle);
+	border-color: var( --border-color-base );
+	background-color: var( --color-surface-4 );
+	color: var( --color-base--subtle );
 }
 
 .tux-message-filter-result {
-	border-bottom-color: var(--border-color-base);
-	background: var(--background-color-warning);
-	color: var(--color-base);
+	border-bottom-color: var( --border-color-base );
+	background: var( --background-color-warning );
+	color: var( --color-base );
 }
 
 .tux-empty-list-guide {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
diff --git a/skinStyles/extensions/Translate/ext.translate.quickedit.less b/skinStyles/extensions/Translate/ext.translate.quickedit.less
index bd5f6348..5db99e3c 100644
--- a/skinStyles/extensions/Translate/ext.translate.quickedit.less
+++ b/skinStyles/extensions/Translate/ext.translate.quickedit.less
@@ -9,17 +9,17 @@
 */
 
 .mw-sp-translate-edit-fields a {
-	color: var(--color-primary);
+	color: var( --color-primary );
 }
 
 .mw-sp-translate-edit-fields fieldset {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 }
 
 .mw-sp-translate-message-documentation {
-	background-color: var(--border-color-base);
+	background-color: var( --border-color-base );
 }
 
 .mw-sp-translate-edit-definition {
-	background-color: var(--background-color-primary--hover);
+	background-color: var( --background-color-primary--hover );
 }
diff --git a/skinStyles/extensions/Translate/ext.translate.special.managetranslatorsandbox.less b/skinStyles/extensions/Translate/ext.translate.special.managetranslatorsandbox.less
index 6d899136..2927959a 100644
--- a/skinStyles/extensions/Translate/ext.translate.special.managetranslatorsandbox.less
+++ b/skinStyles/extensions/Translate/ext.translate.special.managetranslatorsandbox.less
@@ -10,105 +10,105 @@
 
 .filter.pane,
 .tsb-container .search.pane {
-	border-bottom-color: var(--border-color-base);
+	border-bottom-color: var( --border-color-base );
 }
 
 .request-filter-box {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 }
 
 .tsb-body {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 }
 
 .requests.pane,
 .details.pane {
-	border-top-color: var(--border-color-base);
+	border-top-color: var( --border-color-base );
 }
 
 .grid .details.pane {
-	border-left-color: var(--border-color-base);
+	border-left-color: var( --border-color-base );
 }
 
 .request {
-	border-right-color: var(--border-color-base);
-	border-bottom-color: var(--border-color-base);
+	border-right-color: var( --border-color-base );
+	border-bottom-color: var( --border-color-base );
 }
 
 .request:hover {
-	background-color: var(--background-color-quiet--hover);
+	background-color: var( --background-color-quiet--hover );
 }
 
 .request.selected {
-	background-color: var(--background-color-quiet--active);
+	background-color: var( --background-color-quiet--active );
 }
 
 .grid .request .amount {
-	background-color: var(--color-surface-2);
-	color: var(--color-base--subtle);
+	background-color: var( --color-surface-2 );
+	color: var( --color-base--subtle );
 }
 
 .request .email,
 .request .signup-age {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .tsb-details-no-translations {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .signup-comment-label {
-	color: var(--color-destructive);
+	color: var( --color-destructive );
 }
 
 .signup-comment-text {
-	color: var(--color-base--emphasized);
+	color: var( --color-base--emphasized );
 }
 
 .details.pane .reminder-email {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .details.pane .languages {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .request-header {
-	border-right-color: var(--border-color-base);
-	border-bottom-color: var(--border-color-base);
-	background-color: var(--color-surface-2);
-	color: var(--color-base--subtle);
+	border-right-color: var( --border-color-base );
+	border-bottom-color: var( --border-color-base );
+	background-color: var( --color-surface-2 );
+	color: var( --color-base--subtle );
 }
 
 .request-footer {
-	border-top-color: var(--border-color-base);
-	border-right-color: var(--border-color-base);
-	background-color: var(--color-surface-2);
-	color: var(--color-base--subtle);
+	border-top-color: var( --border-color-base );
+	border-right-color: var( --border-color-base );
+	background-color: var( --color-surface-2 );
+	color: var( --color-base--subtle );
 }
 
 .clear-language-selector,
 .language-selector {
-	border-color: var(--border-color-base);
-	background: var(--color-surface-2);
+	border-color: var( --border-color-base );
+	background: var( --color-surface-2 );
 }
 
 .language-selector:hover {
-	border-color: var(--border-color-base--darker);
+	border-color: var( --border-color-base--darker );
 }
 
 .language-selector.unselected::after {
-	border-top-color: var(--border-color-base--darker);
+	border-top-color: var( --border-color-base--darker );
 }
 
 .translations .row {
-	border-bottom-color: var(--border-color-base);
+	border-bottom-color: var( --border-color-base );
 }
 
 .translations .title {
-	background-color: var(--color-surface-2);
+	background-color: var( --color-surface-2 );
 }
 
 .translations .info {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
diff --git a/skinStyles/extensions/Translate/ext.translate.special.translate.less b/skinStyles/extensions/Translate/ext.translate.special.translate.less
index 9d13e225..27290fa9 100644
--- a/skinStyles/extensions/Translate/ext.translate.special.translate.less
+++ b/skinStyles/extensions/Translate/ext.translate.special.translate.less
@@ -9,28 +9,28 @@
 */
 
 .tux-workflow-status {
-	border-color: var(--border-color-base);
-	background: var(--color-surface-3);
-	color: var(--color-base);
+	border-color: var( --border-color-base );
+	background: var( --color-surface-3 );
+	color: var( --color-base );
 }
 
 .tux-workflow-status:hover {
-	border-color: var(--border-color-base--darker);
+	border-color: var( --border-color-base--darker );
 }
 
 .tux-workflow-status-triangle::after {
-	border-top-color: var(--color-base--subtle);
+	border-top-color: var( --color-base--subtle );
 }
 
 .tux-workflow-status-selector li {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .tux-workflow-status-selector li.changeable:hover {
-	background-color: var(--background-color-quiet--hover);
-	color: var(--color-base);
+	background-color: var( --background-color-quiet--hover );
+	color: var( --color-base );
 }
 
 .tux-workflow-status-selector li.selected {
-	color: var(--color-base);
+	color: var( --color-base );
 }
diff --git a/skinStyles/extensions/Translate/ext.translate.special.translate.styles.less b/skinStyles/extensions/Translate/ext.translate.special.translate.styles.less
index 9e44334a..d6baa5b7 100644
--- a/skinStyles/extensions/Translate/ext.translate.special.translate.styles.less
+++ b/skinStyles/extensions/Translate/ext.translate.special.translate.styles.less
@@ -9,68 +9,68 @@
 */
 
 .tux-breadcrumb {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .tux-breadcrumb .grouplink + .grouplink::before {
-	border-left-color: var(--color-base--subtle);
+	border-left-color: var( --color-base--subtle );
 }
 
 .tux-breadcrumb__item--aggregate {
-	color: var(--color-primary);
+	color: var( --color-primary );
 }
 
 .ext-translate-language-selector-label {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .ext-translate-language-selector .uls::after {
-	border-top-color: var(--color-primary);
+	border-top-color: var( --color-primary );
 }
 
 .ext-translate-language-selector .uls {
-	color: var(--color-primary);
+	color: var( --color-primary );
 }
 
 .tux-message-selector .more ul {
-	border-color: var(--border-color-base);
-	background: var(--color-surface-1);
+	border-color: var( --border-color-base );
+	background: var( --color-surface-1 );
 }
 
 .tux-message-selector li.selected {
-	border-bottom-color: var(--color-primary);
+	border-bottom-color: var( --color-primary );
 }
 
 .tux-message-selector li.selected a {
-	color: var(--color-primary);
+	color: var( --color-primary );
 }
 
 .tux-message-selector li a {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .tux-message-selector label {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .tux-editor-header {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .group-warning {
-	background: var(--background-color-warning);
+	background: var( --background-color-warning );
 }
 
 .tux-messagetable-header {
-	border-bottom-color: var(--border-color-base);
+	border-bottom-color: var( --border-color-base );
 }
 
-@media screen and (min-height: 600px) {
+@media screen and ( min-height: 600px ) {
 	.tux-messagetable-header.floating {
-		background: var(--color-surface-1);
+		background: var( --color-surface-1 );
 	}
 }
 
 .tux-message-filter-box {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 }
diff --git a/skinStyles/extensions/Translate/ext.translate.specialTranslationStash.less b/skinStyles/extensions/Translate/ext.translate.specialTranslationStash.less
index 22b3768e..6e988e3b 100644
--- a/skinStyles/extensions/Translate/ext.translate.specialTranslationStash.less
+++ b/skinStyles/extensions/Translate/ext.translate.specialTranslationStash.less
@@ -9,34 +9,34 @@
 */
 
 .translate-welcome-header > p {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .translate-welcome-header {
-	border-bottom-color: var(--border-color-base);
-	background-color: var(--color-surface-2);
+	border-bottom-color: var( --border-color-base );
+	background-color: var( --color-surface-2 );
 }
 
 .limit-reached > p {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .limit-reached {
-	background-color: var(--background-color-warning);
+	background-color: var( --background-color-warning );
 }
 
 .translate-stash-control {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .ext-translate-language-selector-label {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .ext-translate-language-selector::after {
-	border-top-color: var(--color-primary);
+	border-top-color: var( --color-primary );
 }
 
 .tux-message:first-child .tux-message-item {
-	border-top-color: var(--border-color-base);
+	border-top-color: var( --border-color-base );
 }
diff --git a/skinStyles/extensions/Translate/ext.translate.specialpages.styles.less b/skinStyles/extensions/Translate/ext.translate.specialpages.styles.less
index 4c63e6a4..53bf727a 100644
--- a/skinStyles/extensions/Translate/ext.translate.specialpages.styles.less
+++ b/skinStyles/extensions/Translate/ext.translate.specialpages.styles.less
@@ -10,109 +10,109 @@
 
 /* ext.translate.special.managegroups */
 .mw-translate-smg-change .mw-translate-smg-notice-important {
-	border-color: var(--border-color-base);
-	background: var(--background-color-destructive);
+	border-color: var( --border-color-base );
+	background: var( --background-color-destructive );
 }
 
 .smg-rename-dropdown-menu {
-	border-color: var(--border-color-base);
-	background: var(--color-surface-1);
+	border-color: var( --border-color-base );
+	background: var( --color-surface-1 );
 }
 
 /* Additional class to override CSS from skins */
 .smg-rename-dropdown-menu.smg-rename-dropdown-menu button {
-	color: var(--color-base--emphasized);
+	color: var( --color-base--emphasized );
 }
 
 .smg-rename-dropdown-menu.smg-rename-dropdown-menu button:hover {
-	background-color: var(--color-surface-2);
-	color: var(--color-base--emphasized);
+	background-color: var( --color-surface-2 );
+	color: var( --color-base--emphasized );
 }
 
 .smg-group-sync-cache-info {
-	background: var(--color-surface-2);
+	background: var( --color-surface-2 );
 }
 
 .smg-group-sync-cache-info__group-errors {
-	background-color: var(--color-surface-3);
+	background-color: var( --color-surface-3 );
 }
 
 /* ext.translate.special.pagemigration */
 .mw-tpm-sp-unit__source,
 .mw-tpm-sp-unit__target {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 }
 
 .mw-tpm-sp-error__message {
-	border-color: var(--border-color-base);
-	background-color: var(--background-color-destructive);
-	color: var(--color-destructive);
+	border-color: var( --border-color-base );
+	background-color: var( --background-color-destructive );
+	color: var( --color-destructive );
 }
 
 /* ext.translate.special.searchtranslations */
 .tux-searchpage .tux-selectedbox .facet-item {
-	background-color: var(--color-surface-3);
+	background-color: var( --color-surface-3 );
 }
 
 .tux-searchpage .facet {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .tux-searchpage .facet-item:hover {
-	background: var(--background-color-quiet--hover);
+	background: var( --background-color-quiet--hover );
 }
 
 .tux-searchpage .facet-item .facet-count {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .tux-searchpage .facet-item a:visited,
 .tux-searchpage .facet-item a:link {
-	color: var(--color-primary);
+	color: var( --color-primary );
 }
 
 .tux-searchpage .count {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .tux-searchpage .searchcontent .results {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .tux-searchpage .results .tux-title {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .tux-searchpage .results .tux-pagination-line {
-	color: var(--border-color-base);
+	color: var( --border-color-base );
 }
 
 .translate-search-more-groups,
 .translate-search-more-languages {
-	border-color: var(--border-color-base);
-	background-color: var(--color-surface-2);
+	border-color: var( --border-color-base );
+	background-color: var( --color-surface-2 );
 }
 
 .translate-search-more-groups:hover,
 .translate-search-more-languages:hover {
-	border-color: var(--border-color-base--darker);
+	border-color: var( --border-color-base--darker );
 }
 
 .translate-search-more-groups-info,
 .translate-search-more-languages-info {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .tux-search-highlight {
-	background-color: var(--color-surface-2--active);
+	background-color: var( --color-surface-2--active );
 }
 
 /* ext.translate.special.supportedlanguages */
 .mw-special-SupportedLanguages .tagcloud .tag {
-	color: var(--color-base--emphasized);
+	color: var( --color-base--emphasized );
 }
 
 /* ext.translate.special.translations */
 .mw-sp-translate-table .mw-sp-translate-fuzzy {
-	background-color: var(--background-color-destructive);
+	background-color: var( --background-color-destructive );
 }
diff --git a/skinStyles/extensions/Translate/ext.translate.statsbar.less b/skinStyles/extensions/Translate/ext.translate.statsbar.less
index d8de919f..4e52a0b7 100644
--- a/skinStyles/extensions/Translate/ext.translate.statsbar.less
+++ b/skinStyles/extensions/Translate/ext.translate.statsbar.less
@@ -9,21 +9,21 @@
 */
 
 .tux-statsbar {
-	background-color: var(--color-surface-4);
+	background-color: var( --color-surface-4 );
 }
 
 .tux-statsbar .tux-proofread {
-	background-color: var(--color-success);
+	background-color: var( --color-success );
 }
 
 .tux-statsbar .tux-translated {
-	background-color: var(--color-primary);
+	background-color: var( --color-primary );
 }
 
 .tux-statsbar .tux-fuzzy {
-	background-color: var(--color-warning);
+	background-color: var( --color-warning );
 }
 
 .tux-statsbar-info {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
diff --git a/skinStyles/extensions/Translate/ext.translate.statstable.less b/skinStyles/extensions/Translate/ext.translate.statstable.less
index 0909133d..e79fb23b 100644
--- a/skinStyles/extensions/Translate/ext.translate.statstable.less
+++ b/skinStyles/extensions/Translate/ext.translate.statstable.less
@@ -11,22 +11,22 @@
 .statstable {
 	> * > tr {
 		&.tux-statstable-even > td {
-			background-color: var(--color-surface-2);
+			background-color: var( --color-surface-2 );
 		}
 
 		> th {
-			border-color: var(--border-color-base);
-			background-color: var(--color-surface-3);
+			border-color: var( --border-color-base );
+			background-color: var( --color-surface-3 );
 		}
 
 		> td {
-			border-right-color: var(--border-color-base);
-			border-left-color: var(--border-color-base);
-			background-color: var(--color-surface-1);
+			border-right-color: var( --border-color-base );
+			border-left-color: var( --border-color-base );
+			background-color: var( --color-surface-1 );
 		}
 
-		> td:nth-child(6)[data-sort-value='0.00000'] {
-			color: var(--color-base--subtle);
+		> td:nth-child( 6 )[ data-sort-value='0.00000' ] {
+			color: var( --color-base--subtle );
 		}
 	}
 }
diff --git a/skinStyles/extensions/Translate/ext.translate.tag.languages.less b/skinStyles/extensions/Translate/ext.translate.tag.languages.less
index 80917197..5e93804d 100644
--- a/skinStyles/extensions/Translate/ext.translate.tag.languages.less
+++ b/skinStyles/extensions/Translate/ext.translate.tag.languages.less
@@ -9,10 +9,10 @@
 */
 
 .mw-pt-languages {
-	border-color: var(--border-color-base);
-	background-color: var(--color-surface-2);
+	border-color: var( --border-color-base );
+	background-color: var( --color-surface-2 );
 }
 
 .mw-pt-languages-label {
-	background-color: var(--color-surface-3);
+	background-color: var( --color-surface-3 );
 }
diff --git a/skinStyles/extensions/Translate/ext.translate.translationstats.graphbuilder.less b/skinStyles/extensions/Translate/ext.translate.translationstats.graphbuilder.less
index ac7980c6..60a73720 100644
--- a/skinStyles/extensions/Translate/ext.translate.translationstats.graphbuilder.less
+++ b/skinStyles/extensions/Translate/ext.translate.translationstats.graphbuilder.less
@@ -10,7 +10,7 @@
 
 .mw-translate-translationstats-container {
 	.mw-translate-error-container {
-		background-color: var(--background-color-destructive);
-		color: var(--color-destructive);
+		background-color: var( --background-color-destructive );
+		color: var( --color-destructive );
 	}
 }
diff --git a/skinStyles/extensions/UniversalLanguageSelector/ext.uls.common.less b/skinStyles/extensions/UniversalLanguageSelector/ext.uls.common.less
index fe20f93c..71b64964 100644
--- a/skinStyles/extensions/UniversalLanguageSelector/ext.uls.common.less
+++ b/skinStyles/extensions/UniversalLanguageSelector/ext.uls.common.less
@@ -12,18 +12,18 @@
 @import 'ext.uls.mixins.less';
 
 .uls-menu {
-	border-radius: var(--border-radius--medium);
+	border-radius: var( --border-radius--medium );
 }
 
 .uls-search,
 .uls-language-settings-close-block {
-	border-top-left-radius: var(--border-radius--medium);
-	border-top-right-radius: var(--border-radius--medium);
+	border-top-left-radius: var( --border-radius--medium );
+	border-top-right-radius: var( --border-radius--medium );
 }
 
 .uls-language-list {
-	border-bottom-left-radius: var(--border-radius--medium);
-	border-bottom-right-radius: var(--border-radius--medium);
+	border-bottom-left-radius: var( --border-radius--medium );
+	border-bottom-right-radius: var( --border-radius--medium );
 }
 
 .uls-menu.callout {
@@ -32,33 +32,33 @@
 
 .uls-icon-back {
 	border-right: 0; // filter invert does not like it
-	opacity: var(--opacity-icon-base);
+	opacity: var( --opacity-icon-base );
 
 	&:hover {
-		opacity: var(--opacity-icon-base--hover);
+		opacity: var( --opacity-icon-base--hover );
 	}
 
 	&:active {
-		opacity: var(--opacity-icon-base--active);
+		opacity: var( --opacity-icon-base--active );
 	}
 }
 
 .uls-menu .uls-no-results-view {
 	.uls-no-found-more {
-		background-color: var(--color-surface-1);
+		background-color: var( --color-surface-1 );
 	}
 
 	h3 {
-		color: var(--color-base--subtle);
+		color: var( --color-base--subtle );
 	}
 }
 
 // Responsive
-@media (max-width: @width-breakpoint-tablet) {
+@media ( max-width: @width-breakpoint-tablet ) {
 	.uls-menu {
-		top: var(--header-size) !important;
-		right: var(--padding-page) !important;
-		left: var(--padding-page) !important;
+		top: var( --header-size ) !important;
+		right: var( --padding-page ) !important;
+		left: var( --padding-page ) !important;
 		overflow: auto;
 		max-height: 60vh;
 	}
diff --git a/skinStyles/extensions/UniversalLanguageSelector/ext.uls.compactlinks.less b/skinStyles/extensions/UniversalLanguageSelector/ext.uls.compactlinks.less
index 3ab48bf8..f1fbd546 100644
--- a/skinStyles/extensions/UniversalLanguageSelector/ext.uls.compactlinks.less
+++ b/skinStyles/extensions/UniversalLanguageSelector/ext.uls.compactlinks.less
@@ -11,7 +11,7 @@
 @import 'ext.uls.mixins.less';
 
 .mw-interlanguage-selector.selector-open {
-	background-color: var(--color-surface-4);
+	background-color: var( --color-surface-4 );
 }
 
 .interlanguage-uls-menu {
diff --git a/skinStyles/extensions/UniversalLanguageSelector/ext.uls.displaysettings.less b/skinStyles/extensions/UniversalLanguageSelector/ext.uls.displaysettings.less
index b503a3eb..28a987c0 100644
--- a/skinStyles/extensions/UniversalLanguageSelector/ext.uls.displaysettings.less
+++ b/skinStyles/extensions/UniversalLanguageSelector/ext.uls.displaysettings.less
@@ -10,52 +10,52 @@
 
 /* ext.uls.inputsettings.less */
 .uls-ime-menu-settings-item {
-	border-radius: 0 0 var(--border-radius--medium) var(--border-radius--medium);
-	border-top-color: var(--border-color-base);
-	background-color: var(--color-surface-2);
-	color: var(--color-base);
+	border-radius: 0 0 var( --border-radius--medium ) var( --border-radius--medium );
+	border-top-color: var( --border-color-base );
+	background-color: var( --color-surface-2 );
+	color: var( --color-base );
 }
 
 .uls-ime-menu-settings-item > a:hover {
-	background-color: var(--color-surface-2);
-	color: var(--color-base--emphasized);
+	background-color: var( --color-surface-2 );
+	color: var( --color-base--emphasized );
 }
 
 .uls-input-settings-disable-info,
 .uls-input-settings-no-inputmethods {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .down + .uls-input-settings-caret {
-	border-bottom-color: var(--color-surface-2);
+	border-bottom-color: var( --color-surface-2 );
 }
 
 .uls-input-settings .uls-input-settings-inputmethods-list {
-	background: var(--color-surface-2);
+	background: var( --color-surface-2 );
 }
 
 .uls-ime-notification-bubble .link {
-	color: var(--color-primary);
+	color: var( --color-primary );
 }
 
 /* ext.uls.displaysettings.less */
 .ext-uls-sub-panel {
-	border-top-color: var(--border-color-base);
+	border-top-color: var( --border-color-base );
 }
 
 .uls-font-item {
-	border-bottom-color: var(--border-color-base);
-	background: var(--color-surface-2);
+	border-bottom-color: var( --border-color-base );
+	background: var( --color-surface-2 );
 
 	&:first-child {
-		border-top-color: var(--border-color-base);
+		border-top-color: var( --border-color-base );
 	}
 }
 
 .uls-font-label {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .uls-font-label strong {
-	color: var(--color-base);
+	color: var( --color-base );
 }
diff --git a/skinStyles/extensions/UniversalLanguageSelector/ext.uls.interface.less b/skinStyles/extensions/UniversalLanguageSelector/ext.uls.interface.less
index 8a2e8732..7c23630a 100644
--- a/skinStyles/extensions/UniversalLanguageSelector/ext.uls.interface.less
+++ b/skinStyles/extensions/UniversalLanguageSelector/ext.uls.interface.less
@@ -9,14 +9,14 @@
 */
 
 #uls-settings-block {
-	border-top-color: var(--border-color-base);
-	background-color: var(--color-surface-2);
+	border-top-color: var( --border-color-base );
+	background-color: var( --color-surface-2 );
 
 	> button {
-		color: var(--color-base--subtle);
+		color: var( --color-base--subtle );
 
 		&:hover {
-			color: var(--color-base);
+			color: var( --color-base );
 		}
 	}
 }
diff --git a/skinStyles/extensions/UniversalLanguageSelector/ext.uls.interlanguage.less b/skinStyles/extensions/UniversalLanguageSelector/ext.uls.interlanguage.less
index d9d02de3..f899a941 100644
--- a/skinStyles/extensions/UniversalLanguageSelector/ext.uls.interlanguage.less
+++ b/skinStyles/extensions/UniversalLanguageSelector/ext.uls.interlanguage.less
@@ -10,6 +10,6 @@
 
 #p-lang .uls-settings-trigger {
 	&:focus {
-		outline-color: var(--color-primary);
+		outline-color: var( --color-primary );
 	}
 }
diff --git a/skinStyles/extensions/UniversalLanguageSelector/ext.uls.languagesettings.less b/skinStyles/extensions/UniversalLanguageSelector/ext.uls.languagesettings.less
index 4222b8b4..406826bd 100644
--- a/skinStyles/extensions/UniversalLanguageSelector/ext.uls.languagesettings.less
+++ b/skinStyles/extensions/UniversalLanguageSelector/ext.uls.languagesettings.less
@@ -10,71 +10,71 @@
 
 .languagesettings-menu {
 	h1 {
-		color: var(--color-base--emphasized);
+		color: var( --color-base--emphasized );
 	}
 
 	.menu-section {
-		color: var(--color-base);
+		color: var( --color-base );
 
 		&.active {
-			border-left-color: var(--color-primary);
-			background-color: var(--color-surface-1);
-			color: var(--color-base--emphasized);
+			border-left-color: var( --color-primary );
+			background-color: var( --color-surface-1 );
+			color: var( --color-base--emphasized );
 		}
 
 		&:hover {
-			background-color: var(--color-surface-1);
+			background-color: var( --color-surface-1 );
 		}
 
 		&:focus {
-			border-color: var(--color-primary);
+			border-color: var( --color-primary );
 		}
 
 		.settings-text {
-			color: var(--color-base--subtle);
+			color: var( --color-base--subtle );
 		}
 
 		&:hover .settings-text {
-			color: var(--color-base);
+			color: var( --color-base );
 		}
 	}
 }
 
 #languagesettings-settings-panel {
-	background: var(--color-surface-1);
-	color: var(--color-base);
+	background: var( --color-surface-1 );
+	color: var( --color-base );
 }
 
 #languagesettings-settings-panel h3 {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 #languagesettings-settings-panel h4 {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .language-settings-dialog {
-	background: var(--color-surface-2);
+	background: var( --color-surface-2 );
 }
 
 .uls-language-settings-close-block {
-	background: var(--color-surface-1);
+	background: var( --color-surface-1 );
 }
 
 .language-settings-buttons {
-	border-top-color: var(--border-color-base);
+	border-top-color: var( --border-color-base );
 }
 
 .uls-ui-languages p,
 .checkbox {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 #languagesettings-panels .mw-ui-pressed {
-	border-color: var(--color-primary--active);
-	background-color: var(--color-primary--active);
+	border-color: var( --color-primary--active );
+	background-color: var( --color-primary--active );
 }
 
 .checkbox strong {
-	color: var(--color-base);
+	color: var( --color-base );
 }
diff --git a/skinStyles/extensions/UniversalLanguageSelector/ext.uls.mixins.less b/skinStyles/extensions/UniversalLanguageSelector/ext.uls.mixins.less
index 33db8b31..4344e98b 100644
--- a/skinStyles/extensions/UniversalLanguageSelector/ext.uls.mixins.less
+++ b/skinStyles/extensions/UniversalLanguageSelector/ext.uls.mixins.less
@@ -12,24 +12,24 @@
 	&.selector-right {
 		&::before {
 			/* @noflip */
-			border-left-color: var(--border-color-base);
+			border-left-color: var( --border-color-base );
 		}
 
 		&::after {
 			/* @noflip */
-			border-left-color: var(--color-surface-1);
+			border-left-color: var( --color-surface-1 );
 		}
 	}
 
 	&.selector-left {
 		&::before {
 			/* @noflip */
-			border-right-color: var(--border-color-base);
+			border-right-color: var( --border-color-base );
 		}
 
 		&::after {
 			/* @noflip */
-			border-right-color: var(--color-surface-1);
+			border-right-color: var( --color-surface-1 );
 		}
 	}
 }
diff --git a/skinStyles/extensions/UniversalLanguageSelector/ext.uls.pt.less b/skinStyles/extensions/UniversalLanguageSelector/ext.uls.pt.less
index f0a9d7cc..ae515f03 100644
--- a/skinStyles/extensions/UniversalLanguageSelector/ext.uls.pt.less
+++ b/skinStyles/extensions/UniversalLanguageSelector/ext.uls.pt.less
@@ -24,7 +24,7 @@
 		padding: 0;
 		background-position: center;
 		background-size: contain;
-		opacity: var(--opacity-icon-base);
+		opacity: var( --opacity-icon-base );
 	}
 
 	// Hide default icon
diff --git a/skinStyles/extensions/UniversalLanguageSelector/ext.uls.setlang.less b/skinStyles/extensions/UniversalLanguageSelector/ext.uls.setlang.less
index d9b34249..fd287645 100644
--- a/skinStyles/extensions/UniversalLanguageSelector/ext.uls.setlang.less
+++ b/skinStyles/extensions/UniversalLanguageSelector/ext.uls.setlang.less
@@ -11,11 +11,11 @@
 /* ext.uls.dialog */
 .uls-dialog {
 	border: 0;
-	background-color: var(--color-surface-1);
-	box-shadow: var(--box-shadow-dialog);
+	background-color: var( --color-surface-1 );
+	box-shadow: var( --box-shadow-dialog );
 }
 
 .uls-overlay {
-	background-color: var(--background-color-overlay);
+	background-color: var( --background-color-overlay );
 	opacity: 1;
 }
diff --git a/skinStyles/extensions/UniversalLanguageSelector/jquery.ime.less b/skinStyles/extensions/UniversalLanguageSelector/jquery.ime.less
index 599e4ace..1ee77794 100644
--- a/skinStyles/extensions/UniversalLanguageSelector/jquery.ime.less
+++ b/skinStyles/extensions/UniversalLanguageSelector/jquery.ime.less
@@ -10,62 +10,62 @@
 
 .imeselector a,
 .ime-disable {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .ime-setting-caret {
-	border-top-color: var(--border-color-base);
+	border-top-color: var( --border-color-base );
 }
 
 span.ime-disable-shortcut {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .ime-list-title,
 .ime-lang-title {
-	border-bottom-color: var(--color-primary);
-	color: var(--color-primary);
+	border-bottom-color: var( --color-primary );
+	color: var( --color-primary );
 }
 
 .imeselector-menu {
-	border-color: var(--border-color-base);
-	border-radius: var(--border-radius--medium);
-	background-color: var(--color-surface-1);
-	box-shadow: var(--box-shadow-dialog);
+	border-color: var( --border-color-base );
+	border-radius: var( --border-radius--medium );
+	background-color: var( --color-surface-1 );
+	box-shadow: var( --box-shadow-dialog );
 }
 
 /* The triangle shaped callout */
 .imeselector-menu::before {
-	border-bottom-color: var(--border-color-base);
+	border-bottom-color: var( --border-color-base );
 }
 
 .imeselector-menu::after {
-	border-bottom-color: var(--color-surface-1);
+	border-bottom-color: var( --color-surface-1 );
 }
 
 .imeselector-menu.ime-position-top::before {
-	border-top-color: var(--border-color-base);
+	border-top-color: var( --border-color-base );
 }
 
 .imeselector-menu.ime-position-top::after {
-	border-top-color: var(--color-surface-1);
+	border-top-color: var( --color-surface-1 );
 }
 
 .imeselector-menu .ime-help-link {
-	border-top-color: var(--border-color-base);
-	background-color: var(--color-surface-2);
-	color: var(--color-base);
+	border-top-color: var( --border-color-base );
+	background-color: var( --color-surface-2 );
+	color: var( --color-base );
 }
 
 .imeselector-menu .ime-help-link > a:hover {
-	background-color: var(--color-surface-2--hover);
-	color: var(--color-base);
+	background-color: var( --color-surface-2--hover );
+	color: var( --color-base );
 }
 
 .imeselector-menu .selectable-row-item {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .imeselector-menu .selectable-row:hover {
-	background-color: var(--background-color-quiet--hover);
+	background-color: var( --background-color-quiet--hover );
 }
diff --git a/skinStyles/extensions/UniversalLanguageSelector/jquery.uls.less b/skinStyles/extensions/UniversalLanguageSelector/jquery.uls.less
index e7720b36..3208f7c7 100644
--- a/skinStyles/extensions/UniversalLanguageSelector/jquery.uls.less
+++ b/skinStyles/extensions/UniversalLanguageSelector/jquery.uls.less
@@ -11,62 +11,62 @@
 /* jquery.uls.css */
 .uls-menu {
 	border: 0;
-	background-color: var(--color-surface-1);
-	box-shadow: var(--box-shadow-dialog);
+	background-color: var( --color-surface-1 );
+	box-shadow: var( --box-shadow-dialog );
 }
 
 .uls-search {
-	border-bottom-color: var(--border-color-base);
-	background-color: var(--color-surface-1);
+	border-bottom-color: var( --border-color-base );
+	background-color: var( --color-surface-1 );
 }
 
 .uls-search-label {
-	opacity: var(--opacity-icon-base);
+	opacity: var( --opacity-icon-base );
 }
 
 .uls-languagefilter {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .uls-filtersuggestion {
-	background-color: var(--color-surface-1);
-	color: var(--color-base--subtle);
+	background-color: var( --color-surface-1 );
+	color: var( --color-base--subtle );
 }
 
 .uls-languagefilter-clear {
-	opacity: var(--opacity-icon-base);
+	opacity: var( --opacity-icon-base );
 }
 
 /* jquery.uls.lcd.css */
 .uls-lcd {
-	background-color: var(--color-surface-2);
+	background-color: var( --color-surface-2 );
 }
 
 .uls-lcd-region-title {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .uls-language-block > ul > li {
-	border-radius: var(--border-radius--small);
+	border-radius: var( --border-radius--small );
 }
 
 .uls-language-block > ul > li:hover {
-	background-color: var(--background-color-primary--hover);
+	background-color: var( --background-color-primary--hover );
 }
 
 .uls-language-block > ul > li:active {
-	background-color: var(--background-color-primary--active);
+	background-color: var( --background-color-primary--active );
 }
 
 .uls-language-block a {
-	color: var(--color-primary);
+	color: var( --color-primary );
 }
 
 .uls-no-results-found-title {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .uls-no-found-more {
-	border-top-color: var(--border-color-base);
-	color: var(--color-base--subtle);
+	border-top-color: var( --border-color-base );
+	color: var( --color-base--subtle );
 }
diff --git a/skinStyles/extensions/UploadWizard/ext.uploadWizard.less b/skinStyles/extensions/UploadWizard/ext.uploadWizard.less
index 3a5265e5..51c29d2b 100644
--- a/skinStyles/extensions/UploadWizard/ext.uploadWizard.less
+++ b/skinStyles/extensions/UploadWizard/ext.uploadWizard.less
@@ -22,33 +22,33 @@
 }
 
 .filled + .filled {
-	border-top-color: var(--border-color-base);
+	border-top-color: var( --border-color-base );
 }
 
 .mwe-upwiz-file:hover .mwe-upwiz-visible-file {
-	background: var(--background-color-primary--hover) !important;
+	background: var( --background-color-primary--hover ) !important;
 }
 
 .mwe-upwiz-file.odd .mwe-upwiz-visible-file {
-	background: var(--color-surface-2);
+	background: var( --color-surface-2 );
 }
 
 #mwe-upwiz-deeds-thumbnails {
-	background-color: var(--color-surface-2);
+	background-color: var( --color-surface-2 );
 }
 
 .mwe-upwiz-thumbnail-link canvas,
 .mwe-upwiz-thumbnail-link img {
-	box-shadow: var(--box-shadow-card);
+	box-shadow: var( --box-shadow-card );
 }
 
 .mwe-upwiz-singleLanguageInputWidget {
-	border-color: var(--border-color-base);
-	background-color: var(--color-surface-2);
+	border-color: var( --border-color-base );
+	background-color: var( --color-surface-2 );
 }
 
 .mwe-upwiz-copyMetadataWidget {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 }
 
 #mwe-upwiz-stepdiv-details .mwe-upwiz-data {
@@ -60,27 +60,27 @@
  * resources/jquery.arrowSteps/jquery.arrowSteps.css
  */
 .arrowSteps {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 }
 
 .arrowSteps li {
-	background-color: var(--color-surface-2);
-	color: var(--color-base--subtle);
+	background-color: var( --color-surface-2 );
+	color: var( --color-base--subtle );
 }
 
 #mwe-upwiz-steps li.head {
-	background-color: var(--background-color-primary--hover);
-	color: var(--color-primary);
+	background-color: var( --background-color-primary--hover );
+	color: var( --color-primary );
 }
 
 .arrowSteps li.arrow::after {
-	border-left-color: var(--color-surface-2);
+	border-left-color: var( --color-surface-2 );
 }
 
 .arrowSteps li.arrow::before {
-	border-left-color: var(--color-surface-0);
+	border-left-color: var( --color-surface-0 );
 }
 
 #mwe-upwiz-steps li.head::after {
-	border-left-color: var(--background-color-primary--hover);
+	border-left-color: var( --background-color-primary--hover );
 }
diff --git a/skinStyles/extensions/VisualEditor/ext.visualEditor.less b/skinStyles/extensions/VisualEditor/ext.visualEditor.less
index 89c50e11..1e86ad01 100644
--- a/skinStyles/extensions/VisualEditor/ext.visualEditor.less
+++ b/skinStyles/extensions/VisualEditor/ext.visualEditor.less
@@ -52,7 +52,7 @@
 		}
 	}
 
-	&:not(.ve-loading) {
+	&:not( .ve-loading ) {
 		footer.ve-init-mw-desktopArticleTarget-uneditableContent {
 			opacity: 1 !important;
 			pointer-events: auto !important;
@@ -75,8 +75,8 @@
 
 			&-linkAnnotation {
 				&.ve-ce-annotation-active {
-					background-color: var(--background-color-primary--active);
-					box-shadow: 0 0 0 1px var(--border-color-base);
+					background-color: var( --background-color-primary--active );
+					box-shadow: 0 0 0 1px var( --border-color-base );
 				}
 			}
 		}
@@ -85,8 +85,8 @@
 			&-toolbar {
 				> .oo-ui-toolbar-bar {
 					z-index: 91; // @z-index-site-header - 1
-					border-color: var(--border-color-base--darker);
-					background-color: var(--color-surface-0);
+					border-color: var( --border-color-base--darker );
+					background-color: var( --color-surface-0 );
 
 					.oo-ui-toolbar-bar {
 						border: 0;
@@ -98,7 +98,7 @@
 					}
 
 					> .oo-ui-toolbar-actions {
-						border-left: 1px solid var(--border-color-base);
+						border-left: 1px solid var( --border-color-base );
 					}
 
 					.oo-ui-toolbar-tools {
@@ -123,15 +123,15 @@
 			}
 
 			&-targetWidget {
-				border-color: var(--border-color-input);
+				border-color: var( --border-color-input );
 
-				&:not(.oo-ui-pendingElement-pending) {
-					background: var(--color-surface-1);
+				&:not( .oo-ui-pendingElement-pending ) {
+					background: var( --color-surface-1 );
 				}
 			}
 
 			&-overlay {
-				font-family: var(--fonts-sans);
+				font-family: var( --fonts-sans );
 
 				&-global {
 					z-index: 100;
@@ -140,13 +140,13 @@
 
 			&-desktopContext {
 				.ve-ui-linkContextItem .ve-ui-linkContextItem-label {
-					border-color: var(--border-color-base);
+					border-color: var( --border-color-base );
 				}
 			}
 
 			&-expandableContent {
 				&-fade {
-					background: linear-gradient(to right, rgba(255, 255, 255, 0) 0, var(--color-surface-1) 90%);
+					background: linear-gradient( to right, rgba( 255, 255, 255, 0 ) 0, var( --color-surface-1 ) 90% );
 				}
 
 				&-toggle {
@@ -160,28 +160,28 @@
 				}
 
 				&-options {
-					border-color: var(--border-color-base);
-					background-color: var(--color-surface-2);
+					border-color: var( --border-color-base );
+					background-color: var( --color-surface-2 );
 				}
 
 				&--editSummary-count {
-					border-color: var(--border-color-base);
+					border-color: var( --border-color-base );
 				}
 
 				&-license {
-					color: var(--color-base--subtle);
+					color: var( --color-base--subtle );
 				}
 
 				// Preview and review change panels
 				&-savePanel {
 					~ .oo-ui-panelLayout {
-						background-color: var(--color-surface-0);
+						background-color: var( --color-surface-0 );
 					}
 				}
 
 				// Give preview content a max width
 				.mw-parser-output {
-					max-width: var(--width-layout);
+					max-width: var( --width-layout );
 					margin-right: auto;
 					margin-left: auto;
 				}
@@ -189,56 +189,56 @@
 
 			&-mwTransclusion {
 				&Dialog-addParameterFieldset .ve-ui-mwParameterSearchWidget {
-					border-color: var(--border-color-base);
+					border-color: var( --border-color-base );
 				}
 
 				&Outline {
 					&ButtonWidget {
 						&.oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover {
-							background-color: var(--background-color-quiet--hover);
-							color: var(--color-base--emphasized);
+							background-color: var( --background-color-quiet--hover );
+							color: var( --color-base--emphasized );
 						}
 
 						&.oo-ui-optionWidget-selected .oo-ui-buttonElement-button {
-							background-color: var(--background-color-primary--active);
+							background-color: var( --background-color-primary--active );
 						}
 					}
 
 					&TemplateWidget-sticky {
-						background-color: var(--color-surface-1);
+						background-color: var( --color-surface-1 );
 					}
 				}
 			}
 
 			&--mwParameterResultWidget {
 				&.oo-ui-optionWidget-highlighted {
-					background-color: var(--background-color-primary--hover);
+					background-color: var( --background-color-primary--hover );
 				}
 
 				&-description {
-					color: var(--color-base--subtle);
+					color: var( --color-base--subtle );
 				}
 			}
 
 			&-mwTemplatePage-description {
-				color: var(--color-base--subtle);
+				color: var( --color-base--subtle );
 			}
 		}
 	}
 
 	.oo-ui-toolbar-position-top .ve-ui-toolbarDialog-position-above {
-		border-color: var(--border-color-base--darker);
+		border-color: var( --border-color-base--darker );
 	}
 
-	*:not(.ext-discussiontools-ui-replyWidget-headerWrapper) {
+	*:not( .ext-discussiontools-ui-replyWidget-headerWrapper ) {
 		> .ve-init-mw-desktopArticleTarget-toolbar-open {
-			&:not(.ve-ui-toolbar-floating) {
+			&:not( .ve-ui-toolbar-floating ) {
 				& > .oo-ui-toolbar-bar {
 					position: fixed;
 					right: 0;
 					left: 0;
 
-					.oo-ui-toolbar-actions .ve-ui-toolbar:not(.ve-ui-toolbar-floating) > .oo-ui-toolbar-bar {
+					.oo-ui-toolbar-actions .ve-ui-toolbar:not( .ve-ui-toolbar-floating ) > .oo-ui-toolbar-bar {
 						position: unset;
 					}
 				}
@@ -253,7 +253,7 @@
 			&-toolbar {
 				&Placeholder {
 					height: 46px; // Correspond to VE toolbar height in Citizen
-					border-bottom: 1px solid var(--border-color-base);
+					border-bottom: 1px solid var( --border-color-base );
 					margin: 0;
 
 					&-bar {
@@ -263,7 +263,7 @@
 
 					&-floating {
 						.ve-init-mw-desktopArticleTarget-toolbarPlaceholder-bar {
-							background: var(--color-surface-0);
+							background: var( --color-surface-0 );
 						}
 					}
 				}
@@ -276,11 +276,11 @@
 		}
 
 		&-progressBarWidget {
-			border-color: var(--color-primary);
-			background-color: var(--color-surface-0);
+			border-color: var( --color-primary );
+			background-color: var( --color-surface-0 );
 
 			&-bar {
-				background-color: var(--color-primary);
+				background-color: var( --color-primary );
 			}
 		}
 
@@ -294,7 +294,7 @@
 
 // Make toolbar more smaller screen friendly
 // Well at least I did by best
-@media (max-width: 800px) {
+@media ( max-width: 800px ) {
 	// .ve-ui-toolbar-floating {
 	// 	z-index: 4;
 	// }
@@ -340,7 +340,7 @@
 				.ve-ui-toolbar-saveButton {
 					&::before,
 					&::after {
-						background: var(--color-base--emphasized);
+						background: var( --color-base--emphasized );
 					}
 				}
 			}
@@ -351,11 +351,11 @@
 		.ve-init-mw-desktopArticleTarget-toolbar {
 			.ve-ui-toolbar-saveButton {
 				&::before {
-					transform: rotate(45deg);
+					transform: rotate( 45deg );
 				}
 
 				&::after {
-					transform: rotate(-45deg);
+					transform: rotate( -45deg );
 				}
 			}
 		}
diff --git a/skinStyles/extensions/WSSearchFront/ext.WSSearchFront.module.less b/skinStyles/extensions/WSSearchFront/ext.WSSearchFront.module.less
index 1cca0772..934b0fc5 100644
--- a/skinStyles/extensions/WSSearchFront/ext.WSSearchFront.module.less
+++ b/skinStyles/extensions/WSSearchFront/ext.WSSearchFront.module.less
@@ -9,160 +9,160 @@
 */
 
 :root {
-	--tint-1: var(--color-surface-2);
-	--border-1: 1px solid var(--color-surface-2--active);
+	--tint-1: var( --color-surface-2 );
+	--border-1: 1px solid var( --color-surface-2--active );
 }
 
 .wssearch--filter-options-search,
 .wssearch--search-input {
-	border: 1px solid var(--border-color-base);
-	background-color: var(--color-surface-2);
-	color: var(--color-base);
+	border: 1px solid var( --border-color-base );
+	background-color: var( --color-surface-2 );
+	color: var( --color-base );
 
 	&:hover {
 		border-color: #72777d;
 	}
 
 	&:focus {
-		border-color: var(--color-base);
-		box-shadow: inset 0 0 0 1px var(--base-color);
+		border-color: var( --color-base );
+		box-shadow: inset 0 0 0 1px var( --base-color );
 	}
 }
 
 .wssearch--search-button {
-	border: 1px solid var(--border-color-input);
-	background-color: var(--base-color);
-	color: var(--color-base);
+	border: 1px solid var( --border-color-input );
+	background-color: var( --base-color );
+	color: var( --color-base );
 
 	&:hover {
-		border-color: var(--border-color-input--hover);
-		background-color: var(--base-color-lighter);
+		border-color: var( --border-color-input--hover );
+		background-color: var( --base-color-lighter );
 	}
 
 	&:focus {
-		border-color: var(--color-base);
-		box-shadow: inset 0 0 0 1px var(--base-color), inset 0 0 0 2px var(--color-surface-2);
+		border-color: var( --color-base );
+		box-shadow: inset 0 0 0 1px var( --base-color ), inset 0 0 0 2px var( --color-surface-2 );
 	}
 
 	&:active {
-		border-color: var(--base-color-darker);
-		background-color: var(--base-color-darker);
-		color: var(--color-base);
+		border-color: var( --base-color-darker );
+		background-color: var( --base-color-darker );
+		color: var( --color-base );
 	}
 }
 
 .wssearch--selected-filter {
-	background-color: var(--color-surface-2);
+	background-color: var( --color-surface-2 );
 	transition: background-color 0.1s, color 0.1s, border-color 0.1s, box-shadow 0.1s;
 
 	&:hover {
-		border-color: var(--base-color-lighter);
-		background-color: var(--color-surface-2--hover);
+		border-color: var( --base-color-lighter );
+		background-color: var( --color-surface-2--hover );
 	}
 
 	&::after {
-		color: var(--color-base);
+		color: var( --color-base );
 	}
 }
 
 .wssearch--checkbox-input-checkbox {
 	&:checked {
 		+ .wssearch--checkbox-input-icon {
-			border-color: var(--color-base);
-			background-color: var(--color-primary--active);
+			border-color: var( --color-base );
+			background-color: var( --color-primary--active );
 		}
 
 		&:hover {
-			border-color: var(--base-color-lighter);
-			background-color: var(--base-color-lighter);
+			border-color: var( --base-color-lighter );
+			background-color: var( --base-color-lighter );
 		}
 
 		&:focus {
-			border-color: var(--color-base);
-			background-color: var(--color-base);
-			box-shadow: inset 0 0 0 1px var(--base-color), inset 0 0 0 2px var(--color-surface-2);
+			border-color: var( --color-base );
+			background-color: var( --color-base );
+			box-shadow: inset 0 0 0 1px var( --base-color ), inset 0 0 0 2px var( --color-surface-2 );
 		}
 	}
 
 	&:hover {
 		+ .wssearch--checkbox-input-icon {
-			border-color: var(--base-color-lighter);
+			border-color: var( --base-color-lighter );
 		}
 	}
 
 	&:focus {
 		+ .wssearch--checkbox-input-icon {
-			border-color: var(--color-base);
-			box-shadow: inset 0 0 0 1px var(--base-color);
+			border-color: var( --color-base );
+			box-shadow: inset 0 0 0 1px var( --base-color );
 		}
 	}
 }
 
 .wssearch--checkbox-input-icon {
 	border-color: #72777d;
-	background-color: var(--color-surface-0);
+	background-color: var( --color-surface-0 );
 }
 
 .wssearch--selected-clear {
-	color: var(--color-link);
+	color: var( --color-link );
 
 	&:hover {
-		color: var(--color-link--hover);
+		color: var( --color-link--hover );
 	}
 }
 
 .wssearch--order__sortorder {
 	border: 1px solid #a2a9b1;
-	background-color: var(--color-surface-0);
-	color: var(--color-base);
+	background-color: var( --color-surface-0 );
+	color: var( --color-base );
 
 	&:active,
 	&:focus {
-		border-color: var(--color-base);
-		box-shadow: inset 0 0 0 1px var(--base-color), inset 0 0 0 2px var(--color-surface-2);
+		border-color: var( --color-base );
+		box-shadow: inset 0 0 0 1px var( --base-color ), inset 0 0 0 2px var( --color-surface-2 );
 	}
 }
 
 .wssearch--size__select,
 .wssearch--order__select {
 	border: 1px solid #a2a9b1;
-	background-color: var(--color-surface-0);
-	color: var(--color-base);
+	background-color: var( --color-surface-0 );
+	color: var( --color-base );
 
 	&:hover {
 		border-color: #72777d;
 	}
 
 	&:focus {
-		border-color: var(--color-base);
-		box-shadow: inset 0 0 0 1px var(--base-color);
+		border-color: var( --color-base );
+		box-shadow: inset 0 0 0 1px var( --base-color );
 	}
 }
 
 .wssearch--order__label,
 .wssearch--size__label {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .wssearch--order__option,
 .wssearch--size__option {
-	background-color: var(--color-surface-2);
-	color: var(--color-base--emphasized);
+	background-color: var( --color-surface-2 );
+	color: var( --color-base--emphasized );
 }
 
 .wssearch-hit-prop-loading-bg {
-	background: linear-gradient(135deg, var(--color-surface-2) 25%, transparent 0, transparent 50%, var(--color-surface-2) 0, var(--color-surface-2) 75%, transparent 0, transparent);
-	background-color: var(--color-surface-2--active);
+	background: linear-gradient( 135deg, var( --color-surface-2 ) 25%, transparent 0, transparent 50%, var( --color-surface-2 ) 0, var( --color-surface-2 ) 75%, transparent 0, transparent );
+	background-color: var( --color-surface-2--active );
 }
 
 .wssearch--hit-pill {
-	background-color: var(--color-surface-0);
+	background-color: var( --color-surface-0 );
 
 	a {
-		color: var(--color-link);
+		color: var( --color-link );
 
 		&:hover {
-			color: var(--base-color-lighter);
+			color: var( --base-color-lighter );
 		}
 	}
 }
@@ -170,43 +170,43 @@
 .wssearch--hit__date,
 .wssearch--hit__namespace,
 .wssearch--hit__pagetitle {
-	color: var(--color-success);
+	color: var( --color-success );
 }
 
 .wssearch--pagers {
 	.wssearch--pager {
 		&.active {
-			background-color: var(--color-primary);
-			color: var(--color-base);
+			background-color: var( --color-primary );
+			color: var( --color-base );
 		}
 
 		&:hover {
-			color: var(--color-base);
+			color: var( --color-base );
 		}
 	}
 
 	.wssearch--pager-back-icon {
-		background-image: var(--back-icon);
+		background-image: var( --back-icon );
 
 		&:hover {
-			background-color: var(--tint-1);
+			background-color: var( --tint-1 );
 		}
 	}
 
 	.wssearch--pager-forward-icon {
-		background-image: var(--next-icon);
+		background-image: var( --next-icon );
 
 		&:hover {
-			background-color: var(--tint-1);
+			background-color: var( --tint-1 );
 		}
 	}
 
 	.wssearch--pager-hide {
-		color: var(--color-base);
+		color: var( --color-base );
 
 		.wssearch--pager-back-icon,
 		.wssearch--pager-forward-icon {
-			color: var(--color-base);
+			color: var( --color-base );
 		}
 	}
 }
@@ -216,67 +216,67 @@
 }
 
 .wssearch--selected-filters__combobox {
-	&:not(:empty) {
-		border: var(--border-1);
-		background: var(--tint-1);
+	&:not( :empty ) {
+		border: var( --border-1 );
+		background: var( --tint-1 );
 	}
 
 	.wssearch--checkbox {
-		background-color: var(--color-surface-2);
-		color: var(--color-base--emphasized);
+		background-color: var( --color-surface-2 );
+		color: var( --color-base--emphasized );
 
 		&:hover {
-			background-color: var(--tint-1);
+			background-color: var( --tint-1 );
 		}
 
 		&-selected {
-			background-color: var(--color-surface-3);
+			background-color: var( --color-surface-3 );
 			color: #36c;
 		}
 
 		&.wssearch--checkbox-selected:hover {
-			background-color: var(--color-surface-2);
+			background-color: var( --color-surface-2 );
 		}
 
-		&:not(:last-child) {
-			border-bottom: 1px solid var(--color-surface-2--active);
+		&:not( :last-child ) {
+			border-bottom: 1px solid var( --color-surface-2--active );
 		}
 
 		&-count {
-			color: var(--color-base--subtle);
+			color: var( --color-base--subtle );
 		}
 	}
 }
 
 .wssearch--facetsearch-input {
 	border: 1px solid #a2a9b1;
-	background-color: var(--color-surface-0);
-	color: var(--color-base);
+	background-color: var( --color-surface-0 );
+	color: var( --color-base );
 
 	&:hover {
 		border-color: #72777d;
 	}
 
 	&:focus {
-		border-color: var(--color-base);
-		box-shadow: inset 0 0 0 1px var(--base-color);
+		border-color: var( --color-base );
+		box-shadow: inset 0 0 0 1px var( --base-color );
 	}
 }
 
 .wssearch--filter-showmore {
-	border: var(--border-1);
-	background-color: var(--tint-1);
+	border: var( --border-1 );
+	background-color: var( --tint-1 );
 
 	&:hover {
-		border-color: var(--color-base);
-		background-color: var(--color-surface-0);
-		color: var(--color-base);
+		border-color: var( --color-base );
+		background-color: var( --color-surface-0 );
+		color: var( --color-base );
 	}
 
 	&:active,
 	&:focus {
-		border-color: var(--color-base);
-		box-shadow: inset 0 0 0 1px var(--base-color), inset 0 0 0 2px var(--color-surface-2);
+		border-color: var( --color-base );
+		box-shadow: inset 0 0 0 1px var( --base-color ), inset 0 0 0 2px var( --color-surface-2 );
 	}
 }
 
@@ -286,22 +286,22 @@
 	}
 
 	.wssearch--hit > * {
-		background-color: var(--color-surface-0);
+		background-color: var( --color-surface-0 );
 	}
 
 	&__header > * {
-		background-color: var(--color-surface-2--active);
+		background-color: var( --color-surface-2--active );
 	}
 }
 
-@media (max-width: 500px) {
+@media ( max-width: 500px ) {
 	.wssearch--filters {
-		background: var(--color-surface-0);
+		background: var( --color-surface-0 );
 
 		&__open {
-			border: 1px solid var(--base-color);
-			background-color: var(--color-base);
-			color: var(--color-base);
+			border: 1px solid var( --base-color );
+			background-color: var( --color-base );
+			color: var( --color-base );
 		}
 	}
 }
diff --git a/skinStyles/extensions/WikiEditor/ext.wikiEditor.less b/skinStyles/extensions/WikiEditor/ext.wikiEditor.less
index ece2cd51..8ebe8324 100644
--- a/skinStyles/extensions/WikiEditor/ext.wikiEditor.less
+++ b/skinStyles/extensions/WikiEditor/ext.wikiEditor.less
@@ -17,11 +17,11 @@
 	}
 
 	.ace_editor {
-		font-family: var(--fonts-monospace) !important;
+		font-family: var( --fonts-monospace ) !important;
 	}
 
 	.wikiEditor-ui-right {
-		background: var(--color-surface-2);
+		background: var( --color-surface-2 );
 	}
 
 	.CodeMirror {
@@ -30,52 +30,52 @@
 }
 
 .wikiEditor-ui-controls {
-	background-color: var(--color-surface-0);
+	background-color: var( --color-surface-0 );
 }
 
 .wikiEditor-ui-tabs {
-	border-top-color: var(--border-color-base);
-	border-left-color: var(--border-color-base);
-	background-color: var(--color-surface-0);
+	border-top-color: var( --border-color-base );
+	border-left-color: var( --border-color-base );
+	background-color: var( --color-surface-0 );
 
 	div {
-		border-right-color: var(--border-color-base);
-		border-bottom-color: var(--border-color-base);
-		background-color: var(--color-surface-2);
+		border-right-color: var( --border-color-base );
+		border-bottom-color: var( --border-color-base );
+		background-color: var( --color-surface-2 );
 
 		a {
-			color: var(--color-primary);
+			color: var( --color-primary );
 		}
 
 		&.current {
-			border-bottom-color: var(--color-surface-0);
-			background-color: var(--color-surface-0);
+			border-bottom-color: var( --color-surface-0 );
+			background-color: var( --color-surface-0 );
 
 			a {
-				color: var(--color-base);
+				color: var( --color-base );
 			}
 		}
 	}
 }
 
 .wikiEditor-ui-buttons {
-	border-top-color: var(--border-color-base);
-	background-color: var(--color-surface-0);
+	border-top-color: var( --border-color-base );
+	background-color: var( --color-surface-0 );
 }
 
 /* jquery.wikiEditor.toolbar.less */
 .wikiEditor-ui-toolbar {
-	border: 1px solid var(--border-color-base--darker);
-	border-radius: var(--border-radius--small) var(--border-radius--small) 0 0;
+	border: 1px solid var( --border-color-base--darker );
+	border-radius: var( --border-radius--small ) var( --border-radius--small ) 0 0;
 	border-bottom: 0;
-	margin-top: var(--space-sm);
-	background-color: var(--color-surface-2);
+	margin-top: var( --space-sm );
+	background-color: var( --color-surface-2 );
 	box-shadow: none;
 
 	/* Expandable Sections */
 	.sections {
 		.section {
-			border-top-color: var(--border-color-base);
+			border-top-color: var( --border-color-base );
 		}
 	}
 
@@ -84,20 +84,20 @@
 	.tabs {
 		span.tab {
 			a {
-				color: var(--color-primary);
+				color: var( --color-primary );
 
 				&::before {
-					opacity: var(--opacity-icon-base);
+					opacity: var( --opacity-icon-base );
 				}
 			}
 
 			a:visited {
-				color: var(--color-primary);
+				color: var( --color-primary );
 			}
 
 			a.current,
 			a.current:visited {
-				color: var(--color-base);
+				color: var( --color-base );
 			}
 		}
 	}
@@ -106,46 +106,46 @@
 	.group {
 		/* Toolbar */
 		.label {
-			color: var(--color-base--subtle);
+			color: var( --color-base--subtle );
 		}
 
 		.tool-select {
-			border-color: var(--border-color-base);
-			background-color: var(--color-surface-0);
+			border-color: var( --border-color-base );
+			background-color: var( --color-surface-0 );
 
 			.label {
-				color: var(--color-base);
+				color: var( --color-base );
 			}
 
 			.options {
-				border-color: var(--border-color-base);
-				background-color: var(--color-surface-0);
+				border-color: var( --border-color-base );
+				background-color: var( --color-surface-0 );
 
 				.option {
-					color: var(--color-base--emphasized);
+					color: var( --color-base--emphasized );
 
 					&:hover {
-						background-color: var(--background-color-primary--hover);
+						background-color: var( --background-color-primary--hover );
 					}
 
-					&[rel='heading-2'] {
-						font-size: var(--font-size-h2);
-						font-weight: var(--font-weight-semibold);
+					&[ rel='heading-2' ] {
+						font-size: var( --font-size-h2 );
+						font-weight: var( --font-weight-semibold );
 					}
 
-					&[rel='heading-3'] {
-						font-size: var(--font-size-h3);
-						font-weight: var(--font-weight-semibold);
+					&[ rel='heading-3' ] {
+						font-size: var( --font-size-h3 );
+						font-weight: var( --font-weight-semibold );
 					}
 
-					&[rel='heading-4'] {
-						font-size: var(--font-size-h4);
-						font-weight: var(--font-weight-semibold);
+					&[ rel='heading-4' ] {
+						font-size: var( --font-size-h4 );
+						font-weight: var( --font-weight-semibold );
 					}
 
-					&[rel='heading-5'] {
-						font-size: var(--font-size-h5);
-						font-weight: var(--font-weight-semibold);
+					&[ rel='heading-5' ] {
+						font-size: var( --font-size-h5 );
+						font-weight: var( --font-weight-semibold );
 					}
 				}
 			}
@@ -153,7 +153,7 @@
 	}
 
 	.group-search {
-		border-left-color: var(--border-color-base);
+		border-left-color: var( --border-color-base );
 		margin: -1px;
 	}
 
@@ -161,17 +161,17 @@
 	.booklet {
 		> .index {
 			.wikiEditor-character-highlighted {
-				background-color: var(--background-color-quiet--hover);
-				color: var(--color-base--emphasized);
+				background-color: var( --background-color-quiet--hover );
+				color: var( --color-base--emphasized );
 			}
 
 			> :hover {
-				background-color: var(--background-color-quiet--hover);
+				background-color: var( --background-color-quiet--hover );
 			}
 
 			> .current {
-				background-color: var(--background-color-primary--hover);
-				color: var(--color-primary);
+				background-color: var( --background-color-primary--hover );
+				color: var( --color-primary );
 			}
 		}
 	}
@@ -179,12 +179,12 @@
 	/* Help Pages */
 	.page-table {
 		th {
-			color: var(--color-base--subtle);
+			color: var( --color-base--subtle );
 		}
 
 		td {
-			border-top-color: var(--border-color-base);
-			color: var(--color-base--emphasized);
+			border-top-color: var( --border-color-base );
+			color: var( --color-base--emphasized );
 		}
 	}
 
@@ -192,23 +192,23 @@
 	.page-characters {
 		div {
 			span {
-				border-color: var(--border-color-base);
-				color: var(--color-base);
+				border-color: var( --border-color-base );
+				color: var( --color-base );
 
 				&:hover {
-					border-color: var(--border-color-base);
-					background-color: var(--background-color-quiet--hover);
+					border-color: var( --border-color-base );
+					background-color: var( --background-color-quiet--hover );
 				}
 
 				// Added active state
 				&:active {
-					background-color: var(--background-color-quiet--active);
+					background-color: var( --background-color-quiet--active );
 				}
 			}
 
 			.wikiEditor-character-highlighted {
-				background-color: var(--background-color-primary--hover);
-				color: var(--color-primary);
+				background-color: var( --background-color-primary--hover );
+				color: var( --color-primary );
 			}
 		}
 	}
@@ -216,47 +216,47 @@
 
 .tool-button,
 .tool.oo-ui-buttonElement-frameless.oo-ui-iconElement > .oo-ui-buttonElement-button {
-	border-radius: var(--border-radius--small);
+	border-radius: var( --border-radius--small );
 
 	&:hover {
-		background-color: var(--background-color-quiet--hover);
+		background-color: var( --background-color-quiet--hover );
 
 		> .oo-ui-iconElement-icon {
-			opacity: var(--opacity-icon-base--hover);
+			opacity: var( --opacity-icon-base--hover );
 		}
 	}
 
 	// Added active state
 	&:active {
-		background-color: var(--background-color-quiet--active);
+		background-color: var( --background-color-quiet--active );
 
 		> .oo-ui-iconElement-icon {
-			opacity: var(--opacity-icon-base--active);
+			opacity: var( --opacity-icon-base--active );
 		}
 	}
 
 	&.tool-active {
-		background-color: var(--background-color-primary--hover);
+		background-color: var( --background-color-primary--hover );
 	}
 }
 
 .tool.oo-ui-buttonElement-frameless.oo-ui-iconElement > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon {
-	opacity: var(--opacity-icon-base);
+	opacity: var( --opacity-icon-base );
 }
 
 .ui-widget {
 	table {
 		td.wikieditor-toolbar-table-preview-wrapper {
-			background: var(--color-surface-2);
+			background: var( --color-surface-2 );
 		}
 
 		.wikieditor-toolbar-table-preview-frame {
-			background: var(--color-surface-0);
+			background: var( --color-surface-0 );
 		}
 	}
 }
 
 .wikiEditor-ui-text {
-	border: 1px solid var(--border-color-base--darker);
+	border: 1px solid var( --border-color-base--darker );
 	border-width: 0 1px;
 }
diff --git a/skinStyles/extensions/WikiEditor/ext.wikiEditor.realtimepreview.less b/skinStyles/extensions/WikiEditor/ext.wikiEditor.realtimepreview.less
index 671f27de..a9f288b5 100644
--- a/skinStyles/extensions/WikiEditor/ext.wikiEditor.realtimepreview.less
+++ b/skinStyles/extensions/WikiEditor/ext.wikiEditor.realtimepreview.less
@@ -10,19 +10,19 @@
 
 /* RealtimePreview.less */
 .ext-WikiEditor-realtimepreview-button:hover {
-	background-color: var(--background-color-quiet--hover);
+	background-color: var( --background-color-quiet--hover );
 }
 
 .ext-WikiEditor-realtimepreview-button.oo-ui-toggleWidget-on .oo-ui-labelElement-label {
-	color: var(--color-primary);
+	color: var( --color-primary );
 }
 
 .ext-WikiEditor-ResizingDragBar-ns {
-	border-top-color: var(--border-color-base);
+	border-top-color: var( --border-color-base );
 }
 
 .ext-WikiEditor-realtimepreview-loadingbar div {
-	background-color: var(--color-primary);
+	background-color: var( --color-primary );
 }
 
 // Cancel out padding added in action.edit to avoid textarea overflow
@@ -33,45 +33,45 @@
 
 /* ResizingDragBar.less */
 .ext-WikiEditor-ResizingDragBar {
-	background-color: var(--color-surface-2);
+	background-color: var( --color-surface-2 );
 }
 
 .ext-WikiEditor-ResizingDragBar-ew {
-	background-color: var(--color-surface-2);
+	background-color: var( --color-surface-2 );
 }
 
 .ext-WikiEditor-ResizingDragBar span {
-	background-color: var(--color-base--subtle);
+	background-color: var( --color-base--subtle );
 }
 
 .ext-WikiEditor-ResizingDragBar:hover span {
-	background-color: var(--color-base);
+	background-color: var( --color-base );
 }
 
 /* TwoPaneLayout.less */
 .ext-WikiEditor-twopanes-TwoPaneLayout {
 	.ext-WikiEditor-twopanes-pane1,
 	.ext-WikiEditor-twopanes-pane2 {
-		border-color: var(--border-color-base);
+		border-color: var( --border-color-base );
 	}
 }
 
 /* ErrorLayout.less */
 .ext-WikiEditor-realtimepreview-ErrorLayout {
-	background-color: var(--color-surface-2);
+	background-color: var( --color-surface-2 );
 }
 
 /* ManualWidget.less */
 .ext-WikiEditor-ManualWidget {
-	border-color: var(--border-color-base);
-	background-color: var(--color-surface-2);
+	border-color: var( --border-color-base );
+	background-color: var( --color-surface-2 );
 
 	.ext-WikiEditor-realtimepreview-manual-reload {
-		color: var(--color-primary);
+		color: var( --color-primary );
 	}
 
 	&.oo-ui-widget-disabled .ext-WikiEditor-realtimepreview-manual-reload {
-		color: var(--color-base--subtle);
+		color: var( --color-base--subtle );
 	}
 }
 
diff --git a/skinStyles/extensions/Wikibase/jquery.wikibase.entityselector.less b/skinStyles/extensions/Wikibase/jquery.wikibase.entityselector.less
index 1baf1dcf..7c89635e 100644
--- a/skinStyles/extensions/Wikibase/jquery.wikibase.entityselector.less
+++ b/skinStyles/extensions/Wikibase/jquery.wikibase.entityselector.less
@@ -10,34 +10,34 @@
 
 .ui-entityselector-list li,
 .ui-entityselector-list li.ui-state-hover {
-	border-top-color: var(--border-color-base);
+	border-top-color: var( --border-color-base );
 }
 
 .ui-entityselector-list .ui-entityselector-notfound,
 .ui-entityselector-list .ui-entityselector-error {
 	/* Common bright red .wb-error color */
-	background-color: var(--background-color-destructive);
+	background-color: var( --background-color-destructive );
 }
 
 .ui-entityselector-list .ui-entityselector-notfound.ui-state-hover a,
 .ui-entityselector-list .ui-entityselector-error.ui-state-hover a {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .ui-entityselector-list .ui-entityselector-more {
-	background-color: var(--color-surface-2);
+	background-color: var( --color-surface-2 );
 }
 
 .ui-entityselector-list .ui-entityselector-more.ui-state-hover {
-	background-color: var(--color-surface-2--hover);
+	background-color: var( --color-surface-2--hover );
 }
 
 .ui-suggester-input.ui-entityselector-input.ui-entityselector-input-recognized {
-	border-color: var(--border-color-base);
-	background-color: var(--background-color-success);
+	border-color: var( --border-color-base );
+	background-color: var( --background-color-success );
 }
 
 .ui-suggester-input.ui-entityselector-input.ui-entityselector-input-unrecognized {
-	border-color: var(--border-color-base);
-	background-color: var(--background-color-destructive);
+	border-color: var( --border-color-base );
+	background-color: var( --background-color-destructive );
 }
diff --git a/skinStyles/extensions/Wikibase/jquery.wikibase.linkitem.less b/skinStyles/extensions/Wikibase/jquery.wikibase.linkitem.less
index e84df73a..a80fd6f2 100644
--- a/skinStyles/extensions/Wikibase/jquery.wikibase.linkitem.less
+++ b/skinStyles/extensions/Wikibase/jquery.wikibase.linkitem.less
@@ -11,50 +11,50 @@
 /* jquery.wikibase.linkitem.css */
 .wbclient-linkItem-column-site,
 .wbclient-linkItem-column-page {
-	border-bottom-color: var(--border-color-base);
+	border-bottom-color: var( --border-color-base );
 }
 
 .wbclient-linkItem-column-site {
-	border-right-color: var(--border-color-base);
+	border-right-color: var( --border-color-base );
 }
 
 #wbclient-linkItem-dialog a,
 .wbclient-linkItem-not-loggedin-message a {
-	color: var(--color-link);
+	color: var( --color-link );
 }
 
 /* jquery.wikibase.wbtooltip.css */
 // Error icon
 .wikibase-wbtooltip-tip.wb-error .tipsy-inner {
-	border-color: var(--border-color-base);
-	background: var(--background-color-destructive);
+	border-color: var( --border-color-base );
+	background: var( --background-color-destructive );
 }
 
 /* jquery.ui.suggester.css */
 .ui-widget.ui-suggester-list {
-	font-family: var(--fonts-sans);
+	font-family: var( --fonts-sans );
 }
 
 .ui-suggester-list {
-	border-color: var(--border-color-base);
-	background: var(--color-surface-2);
+	border-color: var( --border-color-base );
+	background: var( --color-surface-2 );
 }
 
 .ui-suggester-list .ui-state-hover {
-	background: var(--color-surface-2--hover);
-	color: var(--color-base);
+	background: var( --color-surface-2--hover );
+	color: var( --color-base );
 }
 
 .ui-suggester-list .ui-state-hover a,
 .ui-suggester-list .ui-state-hover a:hover {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .ui-suggester-list a {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 /* jquery.ui.ooMenu.css */
 .ui-ooMenu {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 }
diff --git a/skinStyles/extensions/Wikibase/jquery.wikibase.toolbar.styles.less b/skinStyles/extensions/Wikibase/jquery.wikibase.toolbar.styles.less
index 9ef6f12b..08fa6877 100644
--- a/skinStyles/extensions/Wikibase/jquery.wikibase.toolbar.styles.less
+++ b/skinStyles/extensions/Wikibase/jquery.wikibase.toolbar.styles.less
@@ -13,21 +13,21 @@
 .wikibase-toolbarbutton-disabled a:hover,
 .wikibase-toolbarbutton-disabled a:active,
 .wikibase-toolbarbutton-disabled a:visited {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .wikibase-toolbarbutton.ui-state-disabled.oo-ui-buttonElement > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon {
-	opacity: var(--opacity-icon-base);
+	opacity: var( --opacity-icon-base );
 }
 
 .wikibase-toolbar-button .wb-icon {
-	opacity: var(--opacity-icon-base);
+	opacity: var( --opacity-icon-base );
 }
 
 .wikibase-toolbar-button a:hover .wb-icon {
-	opacity: var(--opacity-icon-base--hover);
+	opacity: var( --opacity-icon-base--hover );
 }
 
 .wikibase-toolbar-button.ui-state-disabled a:hover .wb-icon {
-	opacity: var(--opacity-base--disabled);
+	opacity: var( --opacity-base--disabled );
 }
diff --git a/skinStyles/extensions/Wikibase/wikibase.client.init.less b/skinStyles/extensions/Wikibase/wikibase.client.init.less
index 73ed6765..9292e685 100644
--- a/skinStyles/extensions/Wikibase/wikibase.client.init.less
+++ b/skinStyles/extensions/Wikibase/wikibase.client.init.less
@@ -15,11 +15,11 @@
 	.wb-langlinks-link > a {
 		&:link,
 		&:visited {
-			color: var(--color-base--subtle) !important;
+			color: var( --color-base--subtle ) !important;
 		}
 
 		&:hover {
-			color: var(--color-primary) !important;
+			color: var( --color-primary ) !important;
 		}
 	}
 }
diff --git a/skinStyles/extensions/Wikibase/wikibase.common.less b/skinStyles/extensions/Wikibase/wikibase.common.less
index b3699e85..e828c73d 100644
--- a/skinStyles/extensions/Wikibase/wikibase.common.less
+++ b/skinStyles/extensions/Wikibase/wikibase.common.less
@@ -10,88 +10,88 @@
 
 /* wikibase.less */
 h1 .wikibase-title-id {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .wb-entitypage .ui-state-disabled input,
 .wb-entitypage input.ui-state-disabled,
 .wb-entitypage .ui-state-disabled textarea {
-	background-color: var(--color-surface-4);
-	color: var(--color-base--subtle);
+	background-color: var( --color-surface-4 );
+	color: var( --color-base--subtle );
 }
 
-.wb-entitypage .ui-state-disabled .wb-edit input:not(.ui-state-disabled),
+.wb-entitypage .ui-state-disabled .wb-edit input:not( .ui-state-disabled ),
 .wb-entitypage .ui-state-disabled .wb-edit textarea {
-	background-color: var(--color-surface-1);
+	background-color: var( --color-surface-1 );
 }
 
 .ui-closeable {
-	border-top-color: var(--border-color-base);
-	border-bottom-color: var(--border-color-base);
-	background-color: var(--color-surface-1);
+	border-top-color: var( --border-color-base );
+	border-bottom-color: var( --border-color-base );
+	background-color: var( --color-surface-1 );
 }
 
 .ui-closeable.wb-edit {
-	background-color: var(--background-color-primary--hover);
+	background-color: var( --background-color-primary--hover );
 }
 
 .ui-closeable.wb-error {
-	background-color: var(--background-color-destructive);
+	background-color: var( --background-color-destructive );
 }
 
 .wikibase-entityview input {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 }
 
 .wb-empty {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .wb-entity-undefinedinfo {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .wikibase-statementgrouplistview .wikibase-statementlistview {
-	border-color: var(--border-color-base);
-	background-color: var(--color-surface-1);
+	border-color: var( --border-color-base );
+	background-color: var( --color-surface-1 );
 }
 
 .wikibase-statementgrouplistview :target .wikibase-statementlistview {
-	outline: 2px solid var(--color-primary);
+	outline: 2px solid var( --color-primary );
 }
 
 .wikibase-statementgrouplistview .wikibase-statementlistview .wikibase-statementview:target {
-	outline: 2px solid var(--color-primary);
+	outline: 2px solid var( --color-primary );
 }
 
 .wikibase-statementgrouplistview .wikibase-statementgroupview-property {
-	background: var(--color-surface-3);
+	background: var( --color-surface-3 );
 }
 
 div .wikibase-snakview-value span.error.wb-format-error {
-	color: var(--color-destructive);
+	color: var( --color-destructive );
 }
 
 .wikibase-statementlistview > .wikibase-toolbar-wrapper {
-	background-color: var(--color-surface-3);
+	background-color: var( --color-surface-3 );
 }
 
 .wikibase-statementgrouplistview .wikibase-statementgroupview-property.wb-edit,
 .wikibase-statementgroupview-property.wb-edit + .wikibase-statementlistview > .wikibase-toolbar-wrapper {
-	background-color: var(--background-color-primary--hover);
+	background-color: var( --background-color-primary--hover );
 }
 
 .wikibase-statementgrouplistview .wikibase-statementgroupview-property.wb-error {
-	background-color: var(--background-color-destructive);
+	background-color: var( --background-color-destructive );
 }
 
 .wikibase-statementgrouplistview .wikibase-statementview.wb-error,
 .wikibase-statementgrouplistview .wikibase-statementview.wb-error .wb-claim {
-	background-color: var(--background-color-destructive);
+	background-color: var( --background-color-destructive );
 }
 
 .wikibase-statementgrouplistview .wikibase-statementlistview.wb-new .wikibase-statementview {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 }
 
 .wikibase-snakview-unsupportedsnaktype,
@@ -100,182 +100,182 @@ div .wikibase-snakview-value span.error.wb-format-error {
 .wikibase-snakview-variation-valuesnak-nonewvaluefordeletedproperty,
 span.wikibase-snakview-variation-somevaluesnak,
 span.wikibase-snakview-variation-novaluesnak {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .wikibase-snakview-variation-valuesnak-datavaluetypemismatch,
 .wikibase-snakview-variation-valuesnak-nonewvaluefordeletedproperty {
-	color: var(--color-destructive);
+	color: var( --color-destructive );
 }
 
 .wikibase-statementview {
-	border-bottom-color: var(--border-color-base);
+	border-bottom-color: var( --border-color-base );
 }
 
 .wikibase-statementview div.thumb img,
 .wikibase-statementview div.thumb audio,
 .wikibase-statementview div.thumb video,
 .wikibase-statementview div a.mw-kartographer-map {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 }
 
 .wikibase-statementview-references-heading {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .wikibase-referenceview {
-	background: var(--color-surface-2);
+	background: var( --color-surface-2 );
 }
 
 .wikibase-referenceview .wikibase-referenceview-heading {
-	background-color: var(--color-surface-3);
+	background-color: var( --color-surface-3 );
 }
 
 .wikibase-referenceview.wb-edit {
-	background-color: var(--background-color-primary--hover);
+	background-color: var( --background-color-primary--hover );
 }
 
 .wikibase-referenceview.wb-edit > .wikibase-referenceview-heading {
-	background-color: var(--background-color-primary--hover);
+	background-color: var( --background-color-primary--hover );
 }
 
 .wikibase-referenceview.wb-error {
-	background-color: var(--background-color-destructive);
+	background-color: var( --background-color-destructive );
 }
 
 .wikibase-referenceview.wb-error > .wikibase-referenceview-heading {
-	background-color: var(--background-color-destructive);
+	background-color: var( --background-color-destructive );
 }
 
 .wikibase-referenceview-tabs {
 	/* Tab link style */
 	.ui-state-default > .ui-tabs-anchor {
-		color: var(--color-base);
+		color: var( --color-base );
 	}
 
 	/* Style for tabs */
 	li.ui-state-default {
-		background-color: var(--color-surface-3);
+		background-color: var( --color-surface-3 );
 
 		/* Style for active tab */
 		&.ui-tabs-active.ui-state-active {
-			background-color: var(--background-color-primary--hover);
+			background-color: var( --background-color-primary--hover );
 		}
 	}
 }
 
 .wb-propertypage .wikibase-propertyview-datatype {
-	border-color: var(--border-color-base);
-	background-color: var(--color-surface-2);
+	border-color: var( --border-color-base );
+	background-color: var( --color-surface-2 );
 }
 
 .wikibase-pageImage {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 }
 
 /* jquery.wikibase.aliasesview.css */
 .wikibase-aliasesview li {
-	border-color: var(--border-color-base);
-	background-color: var(--color-surface-2);
+	border-color: var( --border-color-base );
+	background-color: var( --color-surface-2 );
 }
 
 /* jquery.wikibase.descriptionview.css */
 .wikibase-descriptionview .wikibase-descriptionview-input:focus {
-	background-color: var(--background-color-primary--hover);
+	background-color: var( --background-color-primary--hover );
 }
 
 /* jquery.wikibase.entitytermsview.css */
 .wikibase-entitytermsview .wikibase-entitytermsview-heading .wikibase-entitytermsview-heading-aliases ul {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .wikibase-entitytermsview .wikibase-toolbar-container {
-	background-color: var(--color-surface-1);
+	background-color: var( --color-surface-1 );
 }
 
 /* jquery.wikibase.entitytermsforlanguagelistview.css */
 .wikibase-entitytermsforlanguagelistview {
-	border-color: var(--border-color-base);
-	background: var(--color-surface-1);
+	border-color: var( --border-color-base );
+	background: var( --color-surface-1 );
 }
 
 .wikibase-entitytermsforlanguagelistview.wb-edit {
-	border-color: var(--color-primary);
+	border-color: var( --color-primary );
 }
 
 .wikibase-entitytermsforlanguagelistview .wikibase-entitytermsforlanguagelistview-header .wikibase-entitytermsforlanguagelistview-header-row .wikibase-entitytermsforlanguagelistview-cell {
-	border-right-color: var(--color-surface-1);
-	background-color: var(--color-surface-3);
+	border-right-color: var( --color-surface-1 );
+	background-color: var( --color-surface-3 );
 }
 
 .wikibase-entitytermsforlanguagelistview.wb-edit .wikibase-entitytermsforlanguagelistview-header .wikibase-entitytermsforlanguagelistview-header-row .wikibase-entitytermsforlanguagelistview-cell {
-	background: var(--background-color-primary--hover);
+	background: var( --background-color-primary--hover );
 }
 
 .wikibase-entitytermsforlanguagelistview .wikibase-entitytermsforlanguagelistview-listview .wikibase-entitytermsforlanguageview .wikibase-entitytermsforlanguageview-label input,
 .wikibase-entitytermsforlanguagelistview .wikibase-entitytermsforlanguagelistview-listview .wikibase-entitytermsforlanguageview .wikibase-entitytermsforlanguageview-description input,
 .wikibase-entitytermsforlanguagelistview .wikibase-entitytermsforlanguagelistview-listview .wikibase-entitytermsforlanguageview .wikibase-entitytermsforlanguageview-label textarea,
 .wikibase-entitytermsforlanguagelistview .wikibase-entitytermsforlanguagelistview-listview .wikibase-entitytermsforlanguageview .wikibase-entitytermsforlanguageview-description textarea {
-	border-bottom-color: var(--border-color-base);
+	border-bottom-color: var( --border-color-base );
 }
 
 .wikibase-entitytermsforlanguagelistview .wikibase-entitytermsforlanguagelistview-listview .wikibase-entitytermsforlanguageview .wikibase-entitytermsforlanguageview-label input:focus,
 .wikibase-entitytermsforlanguagelistview .wikibase-entitytermsforlanguagelistview-listview .wikibase-entitytermsforlanguageview .wikibase-entitytermsforlanguageview-description input:focus,
 .wikibase-entitytermsforlanguagelistview .wikibase-entitytermsforlanguagelistview-listview .wikibase-entitytermsforlanguageview .wikibase-entitytermsforlanguageview-label textarea:focus,
 .wikibase-entitytermsforlanguagelistview .wikibase-entitytermsforlanguagelistview-listview .wikibase-entitytermsforlanguageview .wikibase-entitytermsforlanguageview-description textarea:focus {
-	border-color: var(--color-primary);
+	border-color: var( --color-primary );
 }
 
 .wikibase-entitytermsforlanguagelistview .wikibase-entitytermsforlanguagelistview-listview .wikibase-entitytermsforlanguageview .wikibase-entitytermsforlanguageview-aliases .ui-state-default {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .wikibase-entitytermsforlanguagelistview .wikibase-entitytermsforlanguagelistview-listview .wikibase-entitytermsforlanguageview .wikibase-entitytermsforlanguageview-aliases input {
-	border-bottom-color: var(--border-color-base);
+	border-bottom-color: var( --border-color-base );
 }
 
 .wikibase-entitytermsforlanguagelistview .wikibase-entitytermsforlanguagelistview-listview .wikibase-entitytermsforlanguageview .wikibase-entitytermsforlanguageview-aliases input:focus {
-	border-color: var(--color-primary);
+	border-color: var( --color-primary );
 }
 
 /* jquery.wikibase.entitytermsforlanguageview.css */
 .wikibase-entitytermsforlanguageview .wb-error {
-	background-color: var(--background-color-destructive);
+	background-color: var( --background-color-destructive );
 }
 
 /* jquery.wikibase.labelview.css */
 .wikibase-labelview .wikibase-labelview-input:focus {
-	background-color: var(--background-color-primary--hover);
+	background-color: var( --background-color-primary--hover );
 }
 
 /* jquery.wikibase.sitelinkgroupview.css */
 .wikibase-sitelinkgroupview {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 }
 
 .wikibase-sitelinkgroupview.wb-edit {
-	border-color: var(--color-primary);
+	border-color: var( --color-primary );
 }
 
 .wikibase-sitelinkgroupview .wikibase-sitelinkgroupview-heading-container {
-	background-color: var(--color-surface-1);
+	background-color: var( --color-surface-1 );
 }
 
 .wikibase-sitelinkgroupview.wb-edit .wikibase-sitelinkgroupview-heading-container {
-	background-color: var(--background-color-primary--hover);
+	background-color: var( --background-color-primary--hover );
 }
 
 /* jquery.wikibase.sitelinklistview.css */
 .wikibase-sitelinklistview .wikibase-sitelinkview .wikibase-sitelinkview-siteid-container {
-	border-color: var(--border-color-base);
-	background: var(--color-surface-3);
+	border-color: var( --border-color-base );
+	background: var( --color-surface-3 );
 }
 
 .wikibase-sitelinklistview .wikibase-sitelinkview .wikibase-removetoolbar-container {
-	background: var(--color-surface-1);
+	background: var( --color-surface-1 );
 }
 
 /* jquery.wikibase.statementgroupview.css */
 .wikibase-statementgroupview .wikibase-statementgroupview-property {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 }
diff --git a/skinStyles/extensions/Wikibase/wikibase.mobile.less b/skinStyles/extensions/Wikibase/wikibase.mobile.less
index b6b13976..908a5868 100644
--- a/skinStyles/extensions/Wikibase/wikibase.mobile.less
+++ b/skinStyles/extensions/Wikibase/wikibase.mobile.less
@@ -10,25 +10,25 @@
 
 /* wikibase.mobile.css */
 .wikibase-title-id {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .wikibase-entitytermsview-heading-aliases ul {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .wikibase-statementgroupview {
-	border-color: var(--border-color-base);
-	background-color: var(--color-surface-2);
+	border-color: var( --border-color-base );
+	background-color: var( --color-surface-2 );
 }
 
 .wikibase-statementgroupview-property-label a,
 .wikibase-snakview-property a {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .wikibase-statementview div.thumb img,
 .wikibase-statementview div.thumb audio,
 .wikibase-statementview div.thumb video {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 }
diff --git a/skinStyles/extensions/Wikibase/wikibase.view.ControllerViewFactory.less b/skinStyles/extensions/Wikibase/wikibase.view.ControllerViewFactory.less
index 2f670259..114d7719 100644
--- a/skinStyles/extensions/Wikibase/wikibase.view.ControllerViewFactory.less
+++ b/skinStyles/extensions/Wikibase/wikibase.view.ControllerViewFactory.less
@@ -10,122 +10,122 @@
 
 /* jquery.wikibase.sitelinkview.css */
 .wikibase-sitelinkview input:focus {
-	border-color: var(--color-primary);
-	background-color: var(--background-color-primary--hover);
+	border-color: var( --color-primary );
+	background-color: var( --background-color-primary--hover );
 }
 
 /* jquery.wikibase.sitelinklistview.css */
 .wikibase-sitelinklistview .wikibase-sitelinkview .wikibase-sitelinkview-siteid-container {
-	border-color: var(--border-color-base);
-	background: var(--color-surface-3);
+	border-color: var( --border-color-base );
+	background: var( --color-surface-3 );
 }
 
 .wikibase-sitelinklistview .wikibase-sitelinkview .wikibase-removetoolbar-container {
-	background: var(--color-surface-1);
+	background: var( --color-surface-1 );
 }
 
 /* jquery.wikibase.sitelinkgroupview.css */
 .wikibase-sitelinkgroupview {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 }
 
 .wikibase-sitelinkgroupview.wb-edit {
-	border-color: var(--color-primary);
+	border-color: var( --color-primary );
 }
 
 .wikibase-sitelinkgroupview .wikibase-sitelinkgroupview-heading-container {
-	background-color: var(--color-surface-1);
+	background-color: var( --color-surface-1 );
 }
 
 .wikibase-sitelinkgroupview.wb-edit .wikibase-sitelinkgroupview-heading-container {
-	background-color: var(--background-color-primary--hover);
+	background-color: var( --background-color-primary--hover );
 }
 
 /* jquery.wikibase.labelview.css */
 .wikibase-labelview .wikibase-labelview-input:focus {
-	background-color: var(--background-color-primary--hover);
+	background-color: var( --background-color-primary--hover );
 }
 
 /* jquery.wikibase.descriptionview.css */
 .wikibase-descriptionview .wikibase-descriptionview-input:focus {
-	background-color: var(--background-color-primary--hover);
+	background-color: var( --background-color-primary--hover );
 }
 
 /* jquery.ui.tagadata.css */
 ul.tagadata li.tagadata-choice-equal {
-	border-color: var(--color-destructive);
-	color: var(--color-destructive);
+	border-color: var( --color-destructive );
+	color: var( --color-destructive );
 }
 
 ul.tagadata {
-	background-color: var(--color-surface-2);
+	background-color: var( --color-surface-2 );
 }
 
 ul.tagadata li.tagadata-choice .tagadata-label input:focus {
-	background-color: var(--background-color-primary--hover);
+	background-color: var( --background-color-primary--hover );
 }
 
 /* jquery.wikibase.aliasesview.css */
 .wikibase-aliasesview li {
-	border-color: var(--border-color-base);
-	background-color: var(--color-surface-2);
+	border-color: var( --border-color-base );
+	background-color: var( --color-surface-2 );
 }
 
 /* jquery.wikibase.entitytermsforlanguageview.css */
 .wikibase-entitytermsforlanguageview .wb-error {
-	background-color: var(--background-color-destructive);
+	background-color: var( --background-color-destructive );
 }
 
 /* jquery.wikibase.entitytermsforlanguagelistview.css */
 .wikibase-entitytermsforlanguagelistview {
-	border-color: var(--border-color-base);
-	background: var(--color-surface-1);
+	border-color: var( --border-color-base );
+	background: var( --color-surface-1 );
 }
 
 .wikibase-entitytermsforlanguagelistview.wb-edit {
-	border-color: var(--color-primary);
+	border-color: var( --color-primary );
 }
 
 .wikibase-entitytermsforlanguagelistview .wikibase-entitytermsforlanguagelistview-header .wikibase-entitytermsforlanguagelistview-header-row .wikibase-entitytermsforlanguagelistview-cell {
-	border-right-color: var(--color-surface-1);
-	background-color: var(--color-surface-3);
+	border-right-color: var( --color-surface-1 );
+	background-color: var( --color-surface-3 );
 }
 
 .wikibase-entitytermsforlanguagelistview.wb-edit .wikibase-entitytermsforlanguagelistview-header .wikibase-entitytermsforlanguagelistview-header-row .wikibase-entitytermsforlanguagelistview-cell {
-	background: var(--background-color-primary--hover);
+	background: var( --background-color-primary--hover );
 }
 
 .wikibase-entitytermsforlanguagelistview .wikibase-entitytermsforlanguagelistview-listview .wikibase-entitytermsforlanguageview .wikibase-entitytermsforlanguageview-label input,
 .wikibase-entitytermsforlanguagelistview .wikibase-entitytermsforlanguagelistview-listview .wikibase-entitytermsforlanguageview .wikibase-entitytermsforlanguageview-description input,
 .wikibase-entitytermsforlanguagelistview .wikibase-entitytermsforlanguagelistview-listview .wikibase-entitytermsforlanguageview .wikibase-entitytermsforlanguageview-label textarea,
 .wikibase-entitytermsforlanguagelistview .wikibase-entitytermsforlanguagelistview-listview .wikibase-entitytermsforlanguageview .wikibase-entitytermsforlanguageview-description textarea {
-	border-bottom-color: var(--border-color-base);
+	border-bottom-color: var( --border-color-base );
 }
 
 .wikibase-entitytermsforlanguagelistview .wikibase-entitytermsforlanguagelistview-listview .wikibase-entitytermsforlanguageview .wikibase-entitytermsforlanguageview-label input:focus,
 .wikibase-entitytermsforlanguagelistview .wikibase-entitytermsforlanguagelistview-listview .wikibase-entitytermsforlanguageview .wikibase-entitytermsforlanguageview-description input:focus,
 .wikibase-entitytermsforlanguagelistview .wikibase-entitytermsforlanguagelistview-listview .wikibase-entitytermsforlanguageview .wikibase-entitytermsforlanguageview-label textarea:focus,
 .wikibase-entitytermsforlanguagelistview .wikibase-entitytermsforlanguagelistview-listview .wikibase-entitytermsforlanguageview .wikibase-entitytermsforlanguageview-description textarea:focus {
-	border-color: var(--color-primary);
+	border-color: var( --color-primary );
 }
 
 .wikibase-entitytermsforlanguagelistview .wikibase-entitytermsforlanguagelistview-listview .wikibase-entitytermsforlanguageview .wikibase-entitytermsforlanguageview-aliases .ui-state-default {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .wikibase-entitytermsforlanguagelistview .wikibase-entitytermsforlanguagelistview-listview .wikibase-entitytermsforlanguageview .wikibase-entitytermsforlanguageview-aliases input {
-	border-bottom-color: var(--border-color-base);
+	border-bottom-color: var( --border-color-base );
 }
 
 .wikibase-entitytermsforlanguagelistview .wikibase-entitytermsforlanguagelistview-listview .wikibase-entitytermsforlanguageview .wikibase-entitytermsforlanguageview-aliases input:focus {
-	border-color: var(--color-primary);
+	border-color: var( --color-primary );
 }
 
 /* jquery.wikibase.entitytermsview.css */
 .wikibase-entitytermsview .wikibase-entitytermsview-heading .wikibase-entitytermsview-heading-aliases ul {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .wikibase-entitytermsview .wikibase-toolbar-container {
-	background-color: var(--color-surface-1);
+	background-color: var( --color-surface-1 );
 }
diff --git a/skinStyles/mediawiki/action/mediawiki.action.edit.styles.less b/skinStyles/mediawiki/action/mediawiki.action.edit.styles.less
index 59900cdb..2c1656fa 100644
--- a/skinStyles/mediawiki/action/mediawiki.action.edit.styles.less
+++ b/skinStyles/mediawiki/action/mediawiki.action.edit.styles.less
@@ -13,7 +13,7 @@
 	.mw-editform {
 		#wpTextbox1 {
 			padding: 0;
-			padding-bottom: var(--space-lg);
+			padding-bottom: var( --space-lg );
 			border: 0;
 			background-color: transparent;
 
@@ -23,20 +23,20 @@
 		}
 
 		.editOptions {
-			padding: var(--space-lg);
-			border: 1px solid var(--border-color-base--darker);
-			border-radius: 0 0 var(--border-radius--large) var(--border-radius--large);
-			background-color: var(--color-surface-2);
-			color: var(--color-base);
+			padding: var( --space-lg );
+			border: 1px solid var( --border-color-base--darker );
+			border-radius: 0 0 var( --border-radius--large ) var( --border-radius--large );
+			background-color: var( --color-surface-2 );
+			color: var( --color-base );
 			font-size: 0.875rem;
 		}
 
 		#editpage-copywarn {
-			margin-top: var(--space-sm);
-			margin-bottom: var(--space-sm);
-			color: var(--color-base--subtle);
+			margin-top: var( --space-sm );
+			margin-bottom: var( --space-sm );
+			color: var( --color-base--subtle );
 			font-size: 0.8125rem;
-			line-height: var(--line-height-sm);
+			line-height: var( --line-height-sm );
 		}
 	}
 }
diff --git a/skinStyles/mediawiki/action/mediawiki.action.history.styles.less b/skinStyles/mediawiki/action/mediawiki.action.history.styles.less
index 44881271..3621ffcc 100644
--- a/skinStyles/mediawiki/action/mediawiki.action.history.styles.less
+++ b/skinStyles/mediawiki/action/mediawiki.action.history.styles.less
@@ -6,7 +6,7 @@
 @import '../../../resources/variables.less';
 
 #mw-history-compare {
-	margin: var(--space-md) 0;
+	margin: var( --space-md ) 0;
 }
 
 .mw-history-compareselectedversions {
@@ -14,7 +14,7 @@
 	flex-wrap: wrap;
 	align-items: center;
 	justify-content: space-between;
-	margin: var(--space-md) 0;
+	margin: var( --space-md ) 0;
 	font-size: 0.875rem;
 }
 
@@ -28,20 +28,20 @@
 		transition: background 0.2s ease;
 
 		&.selected {
-			color: var(--color-base);
+			color: var( --color-base );
 			outline: 0;
 
 			&.before {
-				background-color: var(--background-color-primary--active);
+				background-color: var( --background-color-primary--active );
 			}
 
 			&.after {
-				background-color: var(--background-color-primary--hover);
+				background-color: var( --background-color-primary--hover );
 			}
 		}
 
 		&:hover {
-			background-color: var(--background-color-quiet--hover);
+			background-color: var( --background-color-quiet--hover );
 		}
 	}
 }
diff --git a/skinStyles/mediawiki/action/mediawiki.action.view.filepage.less b/skinStyles/mediawiki/action/mediawiki.action.view.filepage.less
index f78299ac..4c8db399 100644
--- a/skinStyles/mediawiki/action/mediawiki.action.view.filepage.less
+++ b/skinStyles/mediawiki/action/mediawiki.action.view.filepage.less
@@ -22,7 +22,7 @@
 	border: 0;
 	margin: 0;
 	background-color: transparent; // sticky header will handle background
-	font-weight: var(--font-weight-medium);
+	font-weight: var( --font-weight-medium );
 	white-space: nowrap;
 
 	li {
@@ -31,23 +31,23 @@
 
 	a {
 		display: block;
-		padding: var(--space-xxs) var(--space-md);
-		border-radius: var(--border-radius--small);
-		margin-top: var(--space-xs);
-		margin-bottom: var(--space-xs);
+		padding: var( --space-xxs ) var( --space-md );
+		border-radius: var( --border-radius--small );
+		margin-top: var( --space-xs );
+		margin-bottom: var( --space-xs );
 
 		&:hover {
-			background-color: var(--background-color-quiet--hover);
+			background-color: var( --background-color-quiet--hover );
 		}
 
 		&:active {
-			background-color: var(--background-color-quiet--active);
+			background-color: var( --background-color-quiet--active );
 		}
 	}
 }
 
 .mw-filepage-resolutioninfo {
-	margin-top: var(--space-xs);
+	margin-top: var( --space-xs );
 	margin-right: ~'calc( var(  --space-xxs ) * -1 )';
 	// Compensate for margin in links, because we can't use flex gap
 	margin-left: ~'calc( var(  --space-xxs ) * -1 )';
@@ -56,28 +56,28 @@
 
 	.mw-thumbnail-link {
 		display: inline-block;
-		padding: var(--space-xxs) var(--space-md);
-		border: 1px solid var(--border-color-base);
-		border-radius: var(--border-radius--pill);
-		margin: var(--space-xxs);
-		background-color: var(--color-surface-0);
-		color: var(--color-base--subtle);
+		padding: var( --space-xxs ) var( --space-md );
+		border: 1px solid var( --border-color-base );
+		border-radius: var( --border-radius--pill );
+		margin: var( --space-xxs );
+		background-color: var( --color-surface-0 );
+		color: var( --color-base--subtle );
 		font-size: 0.875rem;
 
 		&:hover {
-			background-color: var(--color-primary--hover);
+			background-color: var( --color-primary--hover );
 			color: #fff;
 		}
 
 		&:active {
-			background-color: var(--color-primary--active);
+			background-color: var( --color-primary--active );
 			color: #fff;
 		}
 	}
 
 	// Current preview resolution
 	> .mw-thumbnail-link {
-		background-color: var(--color-primary) !important;
+		background-color: var( --color-primary ) !important;
 		color: #fff;
 	}
 }
@@ -86,14 +86,14 @@
 	display: flex;
 	flex-direction: column;
 	align-items: flex-start;
-	margin-top: var(--space-xl);
-	margin-bottom: var(--space-xl);
+	margin-top: var( --space-xl );
+	margin-bottom: var( --space-xl );
 
 	img {
 		// Large image can overflow
 		max-width: 100%;
 		height: auto;
-		background-color: var(--color-surface-2);
+		background-color: var( --color-surface-2 );
 		transition: @transition-transform;
 	}
 }
@@ -103,7 +103,7 @@
 		overflow: hidden;
 
 		> img {
-			margin: var(--space-md);
+			margin: var( --space-md );
 		}
 	}
 
@@ -115,11 +115,11 @@
 .filehistory a img,
 #file img:hover {
 	// Because this gets overriden by a default style
-	background-color: var(--color-surface-2);
+	background-color: var( --color-surface-2 );
 }
 
 .fileInfo {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .fullMedia {
diff --git a/skinStyles/mediawiki/debug/mediawiki.debug.less b/skinStyles/mediawiki/debug/mediawiki.debug.less
index fc826fbc..959c974b 100644
--- a/skinStyles/mediawiki/debug/mediawiki.debug.less
+++ b/skinStyles/mediawiki/debug/mediawiki.debug.less
@@ -15,9 +15,9 @@
 	// @see https://caniuse.com/mdn-css_properties_width_stretch
 	width: -webkit-fill-available;
 	width: -moz-available;
-	margin-bottom: var(--header-size);
+	margin-bottom: var( --header-size );
 
-	@media (min-width: @width-breakpoint-desktop) {
+	@media ( min-width: @width-breakpoint-desktop ) {
 		margin-bottom: 0;
 		// So that it is not hidden by header
 		margin-left: ~'calc( var( --header-size ) + 1px )'; // compensate border
@@ -25,15 +25,15 @@
 }
 
 .mw-debug {
-	border-top-color: var(--border-color-base);
-	background-color: var(--color-surface-0);
+	border-top-color: var( --border-color-base );
+	background-color: var( --color-surface-0 );
 
 	table {
 		tr {
-			background-color: var(--color-surface-1);
+			background-color: var( --color-surface-1 );
 
-			&:nth-child(even) {
-				background-color: var(--color-surface-2);
+			&:nth-child( even ) {
+				background-color: var( --color-surface-2 );
 			}
 		}
 
@@ -43,10 +43,10 @@
 		// }
 
 		td {
-			border-bottom-color: var(--border-color-base);
+			border-bottom-color: var( --border-color-base );
 
 			span.stats {
-				color: var(--color-base--subtle);
+				color: var( --color-base--subtle );
 			}
 		}
 	}
@@ -60,7 +60,7 @@
 }
 
 .mw-debug-bit {
-	padding: var(--space-sm);
+	padding: var( --space-sm );
 }
 
 #mw-debug-mwversion {
@@ -72,26 +72,26 @@
 	background-color: transparent;
 
 	&:hover {
-		background-color: var(--background-color-quiet--hover);
+		background-color: var( --background-color-quiet--hover );
 	}
 
 	&:active {
-		background-color: var(--background-color-quiet--active);
+		background-color: var( --background-color-quiet--active );
 	}
 
 	&.current {
 		background-color: transparent;
-		box-shadow: inset 0 -2px 0 0 var(--color-primary);
+		box-shadow: inset 0 -2px 0 0 var( --color-primary );
 	}
 }
 
 a.mw-debug-panelabel,
 a.mw-debug-panelabel:visited {
-	color: var(--color-base--emphasized);
+	color: var( --color-base--emphasized );
 }
 
 .mw-debug-pane {
-	background-color: var(--color-surface-2);
+	background-color: var( --color-surface-2 );
 }
 
 #mw-debug-pane-request {
@@ -99,64 +99,64 @@ a.mw-debug-panelabel:visited {
 	th,
 	td,
 	table {
-		border-color: var(--border-color-base);
+		border-color: var( --border-color-base );
 	}
 
 	th {
 		background-color: transparent;
-		font-weight: var(--font-weight-semibold);
+		font-weight: var( --font-weight-semibold );
 	}
 
 	td {
-		background-color: var(--background-color-success);
-		color: var(--color-base--emphasized);
+		background-color: var( --background-color-success );
+		color: var( --color-base--emphasized );
 	}
 }
 
 .mw-debug-backtrace {
-	background-color: var(--color-surface-3);
+	background-color: var( --color-surface-3 );
 
 	span {
-		color: var(--color-base--emphasized);
-		font-weight: var(--font-weight-semibold);
+		color: var( --color-base--emphasized );
+		font-weight: var( --font-weight-semibold );
 	}
 
 	li {
-		color: var(--color-base);
+		color: var( --color-base );
 	}
 }
 
 .mw-debug-console-log {
-	background-color: var(--background-color-primary--hover);
+	background-color: var( --background-color-primary--hover );
 }
 
 .mw-debug-console-warn {
-	background-color: var(--background-color-warning);
+	background-color: var( --background-color-warning );
 }
 
 .mw-debug-console-deprecated {
-	background-color: var(--background-color-destructive);
+	background-color: var( --background-color-destructive );
 }
 
 /* $wgShowDebug = true; */
 #mw-html-debug-log {
-	padding: 0 var(--padding-page);
+	padding: 0 var( --padding-page );
 
 	// Label text
 	> strong {
-		color: var(--color-base--subtle);
+		color: var( --color-base--subtle );
 		font-size: 0.875rem;
 		letter-spacing: 0.05em;
 	}
 
-	@media (min-width: @width-breakpoint-desktop) {
+	@media ( min-width: @width-breakpoint-desktop ) {
 		// So that it is not hidden by header
-		margin-left: var(--header-size);
+		margin-left: var( --header-size );
 	}
 }
 
 #mw-debug-html {
-	padding-left: var(--space-lg); // So that it is not clipped
+	padding-left: var( --space-lg ); // So that it is not clipped
 	margin-left: 0;
 	overflow-x: auto;
 }
diff --git a/skinStyles/mediawiki/mediawiki.diff.styles.less b/skinStyles/mediawiki/mediawiki.diff.styles.less
index 476f1280..18b7dcaa 100644
--- a/skinStyles/mediawiki/mediawiki.diff.styles.less
+++ b/skinStyles/mediawiki/mediawiki.diff.styles.less
@@ -9,34 +9,34 @@
 	display: table; // So that it does not break layout in mobile
 
 	&change {
-		color: var(--color-base--emphasized);
+		color: var( --color-base--emphasized );
 	}
 
 	&-lineno {
 		font-size: 0.875rem;
-		font-weight: var(--font-weight-normal);
+		font-weight: var( --font-weight-normal );
 		letter-spacing: 0.05em;
 	}
 
 	&-context {
-		border-color: var(--border-color-base);
+		border-color: var( --border-color-base );
 		background: transparent;
-		color: var(--color-base--subtle);
+		color: var( --color-base--subtle );
 	}
 
 	&-addedline {
-		border-color: var(--color-success);
+		border-color: var( --color-success );
 
 		.diffchange {
-			background: var(--background-color-success);
+			background: var( --background-color-success );
 		}
 	}
 
 	&-deletedline {
-		border-color: var(--color-destructive);
+		border-color: var( --color-destructive );
 
 		.diffchange {
-			background: var(--background-color-destructive);
+			background: var( --background-color-destructive );
 		}
 	}
 
@@ -49,5 +49,5 @@
 
 .mw-diff-movedpara-left::after,
 .mw-diff-movedpara-right::after {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
diff --git a/skinStyles/mediawiki/mediawiki.htmlform.ooui.styles.less b/skinStyles/mediawiki/mediawiki.htmlform.ooui.styles.less
index 1932c040..5e61f6f6 100644
--- a/skinStyles/mediawiki/mediawiki.htmlform.ooui.styles.less
+++ b/skinStyles/mediawiki/mediawiki.htmlform.ooui.styles.less
@@ -8,7 +8,7 @@
 .skin-citizen-dark {
 	.mw-htmlform-ooui {
 		.mw-htmlform-matrix {
-			tbody tr:nth-child(even) td {
+			tbody tr:nth-child( even ) td {
 				background-color: @dark-bg-10;
 			}
 
@@ -20,7 +20,7 @@
 		.oo-ui-fieldLayout-header {
 			.oo-ui-buttonElement-button {
 				.oo-ui-iconElement-icon {
-					filter: invert(1) hue-rotate(180deg);
+					filter: invert( 1 ) hue-rotate( 180deg );
 				}
 			}
 		}
diff --git a/skinStyles/mediawiki/mediawiki.htmlform.styles.less b/skinStyles/mediawiki/mediawiki.htmlform.styles.less
index 31a44890..aee7029f 100644
--- a/skinStyles/mediawiki/mediawiki.htmlform.styles.less
+++ b/skinStyles/mediawiki/mediawiki.htmlform.styles.less
@@ -20,37 +20,37 @@
 		&-HTMLCheckField {
 			// Horizontal label, like in upload form
 			input + label {
-				margin-left: var(--space-xs);
+				margin-left: var( --space-xs );
 			}
 		}
 
 		&-HTMLTextField {
 			// Vertical label, like in create account
 			> label {
-				margin-bottom: var(--space-xxs);
-				color: var(--color-base--subtle);
+				margin-bottom: var( --space-xxs );
+				color: var( --color-base--subtle );
 				font-size: 0.875rem;
 				letter-spacing: 0.05em;
 			}
 
 			// Horizontal label, like in upload form
 			td.mw-label > label {
-				margin-right: var(--space-xs);
+				margin-right: var( --space-xs );
 			}
 		}
 
 		&-HTMLInfoField {
-			color: var(--color-base--subtle);
+			color: var( --color-base--subtle );
 		}
 	}
 
 	&-invalid-input td.mw-input input {
-		border-color: var(--color-destructive);
+		border-color: var( --color-destructive );
 	}
 }
 
 .htmlform-tip {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 	font-size: 0.8125rem;
 	letter-spacing: 0.025em;
 }
diff --git a/skinStyles/mediawiki/mediawiki.notification.less b/skinStyles/mediawiki/mediawiki.notification.less
index e5ee36a6..3bf25b3a 100644
--- a/skinStyles/mediawiki/mediawiki.notification.less
+++ b/skinStyles/mediawiki/mediawiki.notification.less
@@ -1,11 +1,11 @@
 @import '../../resources/variables.less';
 
 .mw-notification {
-	border-color: var(--border-color-base);
-	border-radius: var(--border-radius--medium);
-	background-color: var(--color-surface-1);
-	box-shadow: var(--box-shadow-dialog);
-	color: var(--color-base);
+	border-color: var( --border-color-base );
+	border-radius: var( --border-radius--medium );
+	background-color: var( --color-surface-1 );
+	box-shadow: var( --box-shadow-dialog );
+	color: var( --color-base );
 	font-size: 0.875rem;
 
 	&-area {
@@ -16,7 +16,7 @@
 		&-warn,
 		&-error,
 		&-success {
-			color: var(--color-base);
+			color: var( --color-base );
 		}
 	}
 }
diff --git a/skinStyles/mediawiki/mediawiki.page.gallery.styles.less b/skinStyles/mediawiki/mediawiki.page.gallery.styles.less
index 09eea84f..d1de726e 100644
--- a/skinStyles/mediawiki/mediawiki.page.gallery.styles.less
+++ b/skinStyles/mediawiki/mediawiki.page.gallery.styles.less
@@ -6,40 +6,40 @@
 // Sync with caption styles
 div.gallerytext {
 	padding: 0;
-	padding-right: var(--border-radius--small);
-	padding-left: var(--border-radius--small);
-	color: var(--color-base--subtle);
+	padding-right: var( --border-radius--small );
+	padding-left: var( --border-radius--small );
+	color: var( --color-base--subtle );
 	font-size: 0.8125rem;
 	letter-spacing: 0.025em;
 
 	p {
-		margin: var(--space-xs) 0; // reset default style
+		margin: var( --space-xs ) 0; // reset default style
 	}
 }
 
 ul.mw-gallery-packed-hover li.gallerybox:hover div.gallerytextwrapper,
 ul.mw-gallery-packed-overlay li.gallerybox div.gallerytextwrapper,
 ul.mw-gallery-packed-hover li.gallerybox.mw-gallery-focused div.gallerytextwrapper {
-	background: var(--background-color-overlay);
-	font-weight: var(--font-weight-normal); // should use the same weight as caption
+	background: var( --background-color-overlay );
+	font-weight: var( --font-weight-normal ); // should use the same weight as caption
 }
 
 /* Slideshow */
 ul.gallery.mw-gallery-slideshow {
 	.gallerybox {
 		&.slideshow-current {
-			background: var(--color-surface-2);
+			background: var( --color-surface-2 );
 		}
 	}
 
 	.mw-gallery-slideshow {
 		&-buttons {
-			padding-top: var(--space-md);
-			padding-bottom: var(--space-sm);
+			padding-top: var( --space-md );
+			padding-bottom: var( --space-sm );
 		}
 
 		&-img-container {
-			border-radius: var(--border-radius--large);
+			border-radius: var( --border-radius--large );
 		}
 
 		&-caption {
@@ -52,7 +52,7 @@ ul.gallery.mw-gallery-slideshow {
 	li.gallerybox div.thumb {
 		overflow: hidden; // quick hack for rounded corner
 		border-color: transparent;
-		border-radius: var(--border-radius--small);
-		background-color: var(--color-surface-2);
+		border-radius: var( --border-radius--small );
+		background-color: var( --color-surface-2 );
 	}
 }
diff --git a/skinStyles/mediawiki/mediawiki.pager.styles.less b/skinStyles/mediawiki/mediawiki.pager.styles.less
index 74a2dc0d..91fa61a8 100644
--- a/skinStyles/mediawiki/mediawiki.pager.styles.less
+++ b/skinStyles/mediawiki/mediawiki.pager.styles.less
@@ -9,24 +9,24 @@
 */
 
 .mw-datatable {
-	border: 1px solid var(--border-color-base);
+	border: 1px solid var( --border-color-base );
 	border-collapse: collapse;
 
 	td,
 	th {
 		padding: 0.2em 0.4em;
-		border: 1px solid var(--border-color-base);
+		border: 1px solid var( --border-color-base );
 	}
 
 	th {
-		background-color: var(--color-surface-2);
+		background-color: var( --color-surface-2 );
 	}
 
 	td {
-		background-color: var(--color-surface-1);
+		background-color: var( --color-surface-1 );
 	}
 
 	tr:hover td {
-		background-color: var(--color-surface-2);
+		background-color: var( --color-surface-2 );
 	}
 }
diff --git a/skinStyles/mediawiki/mediawiki.rcfilters.filters.base.styles.less b/skinStyles/mediawiki/mediawiki.rcfilters.filters.base.styles.less
index bc83e173..75acfeef 100644
--- a/skinStyles/mediawiki/mediawiki.rcfilters.filters.base.styles.less
+++ b/skinStyles/mediawiki/mediawiki.rcfilters.filters.base.styles.less
@@ -10,8 +10,8 @@
 
 .client-js {
 	.mw-recentchanges-toplinks {
-		&:not(.mw-recentchanges-toplinks-collapsed) {
-			border-color: var(--border-color-base);
+		&:not( .mw-recentchanges-toplinks-collapsed ) {
+			border-color: var( --border-color-base );
 		}
 	}
 
@@ -19,7 +19,7 @@
 		& .mw-rcfilters-spinner-bounce,
 		&::before,
 		&::after {
-			background-color: var(--color-base--subtle);
+			background-color: var( --color-base--subtle );
 		}
 	}
 
@@ -29,5 +29,5 @@
 }
 
 .mw-rcfilters-staticfilters-selected {
-	font-weight: var(--font-weight-semibold);
+	font-weight: var( --font-weight-semibold );
 }
diff --git a/skinStyles/mediawiki/mediawiki.rcfilters.filters.ui.less b/skinStyles/mediawiki/mediawiki.rcfilters.filters.ui.less
index bccc2f6f..9e77080c 100644
--- a/skinStyles/mediawiki/mediawiki.rcfilters.filters.ui.less
+++ b/skinStyles/mediawiki/mediawiki.rcfilters.filters.ui.less
@@ -15,15 +15,15 @@
 	&.oo-ui-widget-enabled {
 		// Needed extra specificity
 		&.oo-ui-tagMultiselectWidget.oo-ui-tagMultiselectWidget-outlined {
-			border-radius: var(--border-radius--small);
-			background-color: var(--color-surface-1);
+			border-radius: var( --border-radius--small );
+			background-color: var( --color-surface-1 );
 		}
 
 		.oo-ui-tagMultiselectWidget-handle {
-			border-color: var(--border-color-base--darker);
-			border-radius: var(--border-radius--small) var(--border-radius--small) 0 0;
-			border-bottom: 1px solid var(--border-color-base); // Add divider
-			background-color: var(--color-surface-2);
+			border-color: var( --border-color-base--darker );
+			border-radius: var( --border-radius--small ) var( --border-radius--small ) 0 0;
+			border-bottom: 1px solid var( --border-color-base ); // Add divider
+			background-color: var( --color-surface-2 );
 		}
 	}
 
@@ -36,27 +36,27 @@
 	}
 
 	.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled &-emphasize.oo-ui-tagMultiselectWidget-handle {
-		background-color: var(--background-color-primary--hover);
+		background-color: var( --background-color-primary--hover );
 	}
 
 	.oo-ui-tagMultiselectWidget-input input {
 		border-top-color: transparent; // Avoid double border with oo-ui-tagMultiselectWidget-handle
-		background-color: var(--color-surface-0);
+		background-color: var( --color-surface-0 );
 	}
 
 	&-wrapper {
 		&-content {
 			&-title {
 				// Citizen label style
-				color: var(--color-base--subtle);
+				color: var( --color-base--subtle );
 				font-size: 0.8125rem;
-				font-weight: var(--font-weight-normal);
+				font-weight: var( --font-weight-normal );
 				letter-spacing: 0.05em;
 			}
 
 			&-savedQueryTitle {
-				color: var(--color-base--emphasized);
-				font-weight: var(--font-weight-semibold);
+				color: var( --color-base--emphasized );
+				font-weight: var( --font-weight-semibold );
 			}
 		}
 	}
@@ -64,8 +64,8 @@
 	&-views {
 		&-select {
 			&-widget.oo-ui-widget {
-				border-color: var(--border-color-base--darker);
-				border-radius: 0 0 var(--border-radius--small) 0;
+				border-color: var( --border-color-base--darker );
+				border-radius: 0 0 var( --border-radius--small ) 0;
 				border-top-width: 0;
 				border-left-width: 0;
 			}
@@ -73,66 +73,66 @@
 	}
 
 	&-emptyFilters {
-		color: var(--color-base--subtle);
+		color: var( --color-base--subtle );
 		vertical-align: sub; // fix incorrect top alignment
 	}
 }
 
 /* mw.rcfilters.ui.ItemMenuOptionWidget.less */
 .mw-rcfilters-ui-itemMenuOptionWidget {
-	&:not(:last-child, .mw-rcfilters-ui-itemMenuOptionWidget-identifier-talk) {
+	&:not( :last-child, .mw-rcfilters-ui-itemMenuOptionWidget-identifier-talk ) {
 		border-bottom: 0;
 	}
 
 	&-view-namespaces {
-		border-top-color: var(--border-color-base);
+		border-top-color: var( --border-color-base );
 	}
 
 	&:hover {
-		background-color: var(--background-color-quiet--hover);
+		background-color: var( --background-color-quiet--hover );
 	}
 
 	&.oo-ui-optionWidget-selected {
-		background-color: var(--background-color-primary--hover);
+		background-color: var( --background-color-primary--hover );
 	}
 
 	&-label {
 		&-title {
-			color: var(--color-base--emphasized);
-			font-weight: var(--font-weight-semibold);
+			color: var( --color-base--emphasized );
+			font-weight: var( --font-weight-semibold );
 		}
 
 		&-desc {
-			color: var(--color-base--subtle);
+			color: var( --color-base--subtle );
 		}
 	}
 
 	&-excludeLabel {
-		color: var(--color-base--subtle);
+		color: var( --color-base--subtle );
 	}
 
 	// Add margin between item and next header
 	+ .mw-rcfilters-ui-filterMenuSectionOptionWidget {
 		max-width: 81vw;
-		margin-top: var(--space-md);
+		margin-top: var( --space-md );
 	}
 }
 
 /* mw.rcfilters.ui.FilterMenuOptionWidget.less */
 .mw-rcfilters-ui-filterMenuOptionWidget {
 	&.oo-ui-flaggedElement-muted {
-		&:not(.oo-ui-optionWidget-selected) {
-			background-color: var(--color-surface-2);
+		&:not( .oo-ui-optionWidget-selected ) {
+			background-color: var( --color-surface-2 );
 		}
 
 		.mw-rcfilters-ui-itemMenuOptionWidget-label-title,
 		.mw-rcfilters-ui-itemMenuOptionWidget-label-desc {
-			color: var(--color-base--subtle);
+			color: var( --color-base--subtle );
 		}
 
 		&.oo-ui-optionWidget-highlighted {
-			background-color: var(--background-color-quiet--hover);
-			color: var(--color-base);
+			background-color: var( --background-color-quiet--hover );
+			color: var( --color-base );
 		}
 	}
 }
@@ -143,29 +143,29 @@
 	position: sticky;
 	z-index: 1; // Needed for sticky header
 	top: 0;
-	padding-top: var(--space-xs);
-	padding-bottom: var(--space-xs);
-	border-bottom: 1px solid var(--border-color-base);
-	background-color: var(--color-surface-1); // Sync with background
+	padding-top: var( --space-xs );
+	padding-bottom: var( --space-xs );
+	border-bottom: 1px solid var( --border-color-base );
+	background-color: var( --color-surface-1 ); // Sync with background
 
 	&-header-title.oo-ui-labelElement-label {
 		// Citizen label style
-		color: var(--color-base--subtle);
+		color: var( --color-base--subtle );
 		font-size: 0.8125rem;
-		font-weight: var(--font-weight-normal);
+		font-weight: var( --font-weight-normal );
 		letter-spacing: 0.05em;
 	}
 
 	&-whatsThisButton {
 		&-popup-content {
 			&-header {
-				font-weight: var(--font-weight-semibold);
+				font-weight: var( --font-weight-semibold );
 			}
 		}
 	}
 
 	&-active .mw-rcfilters-ui-filterMenuSectionOptionWidget-header-title {
-		font-weight: var(--font-weight-semibold);
+		font-weight: var( --font-weight-semibold );
 	}
 }
 
@@ -174,29 +174,29 @@
 	// Background and color of the capsule widget need a bit
 	// more specificity to override OOUI internals
 	&.oo-ui-flaggedElement-muted.oo-ui-tagItemWidget.oo-ui-widget-enabled {
-		border-color: var(--color-surface-4);
-		background-color: var(--color-surface-4);
+		border-color: var( --color-surface-4 );
+		background-color: var( --color-surface-4 );
 
 		.oo-ui-labelElement-label {
-			color: var(--color-base--subtle);
+			color: var( --color-base--subtle );
 		}
 	}
 
 	&.oo-ui-flaggedElement-invalid.oo-ui-tagItemWidget.oo-ui-widget-enabled {
 		.oo-ui-labelElement-label {
-			color: var(--color-destructive);
+			color: var( --color-destructive );
 			// color: var( --color-destructive--active );
 		}
 	}
 
 	.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined &-selected.oo-ui-tagItemWidget.oo-ui-widget-enabled {
-		border-color: var(--color-primary);
-		background-color: var(--color-primary);
+		border-color: var( --color-primary );
+		background-color: var( --color-primary );
 		color: #fff;
 	}
 
 	&-popup-content {
-		color: var(--color-base);
+		color: var( --color-base );
 	}
 }
 
@@ -209,9 +209,9 @@
 		// Left padding ~12px, sync with other padding
 		// Handle top padding in header instead so everything is aligned
 		padding: 0 0 0 0.75em;
-		color: var(--color-base--emphasized);
+		color: var( --color-base--emphasized );
 		font-size: 1rem;
-		font-weight: var(--font-weight-semibold);
+		font-weight: var( --font-weight-semibold );
 	}
 
 	&-header {
@@ -231,12 +231,12 @@
 	}
 
 	&-noresults {
-		color: var(--color-base--subtle);
+		color: var( --color-base--subtle );
 	}
 
 	&-footer {
-		border-top-color: var(--border-color-base);
-		margin-top: var(--space-md);
+		border-top-color: var( --border-color-base );
+		margin-top: var( --space-md );
 		background-color: transparent;
 	}
 }
@@ -245,9 +245,9 @@
 .mw-rcfilters-ui-viewSwitchWidget {
 	label.oo-ui-labelWidget {
 		// Citizen label styles
-		color: var(--color-base--subtle);
+		color: var( --color-base--subtle );
 		font-size: 0.8125rem;
-		font-weight: var(--font-weight-normal);
+		font-weight: var( --font-weight-normal );
 		letter-spacing: 0.05em;
 	}
 
@@ -260,62 +260,62 @@
 .mw-rcfilters-ui-valuePickerWidget {
 	&-title {
 		// Citizen label styles
-		color: var(--color-base--subtle);
+		color: var( --color-base--subtle );
 		font-size: 0.8125rem;
-		font-weight: var(--font-weight-normal);
+		font-weight: var( --font-weight-normal );
 		letter-spacing: 0.05em;
 	}
 }
 
 /* mw.rcfilters.ui.DatePopupWidget.less */
 .mw-rcfilters-ui-datePopupWidget {
-	border-top-color: var(--border-color-base);
+	border-top-color: var( --border-color-base );
 
 	&-title {
-		color: var(--color-base--emphasized);
-		font-weight: var(--font-weight-semibold);
+		color: var( --color-base--emphasized );
+		font-weight: var( --font-weight-semibold );
 	}
 
 	.mw-rcfilters-ui-valuePickerWidget-title {
-		color: var(--color-base--subtle);
+		color: var( --color-base--subtle );
 	}
 }
 
 /* mw.rcfilters.ui.ChangesListWrapperWidget.less */
 @keyframes fadeBlueCitizen {
 	60% {
-		border-top-color: var(--color-primary);
+		border-top-color: var( --color-primary );
 	}
 
 	100% {
-		border-top-color: var(--color-surface-4);
+		border-top-color: var( --color-surface-4 );
 	}
 }
 
 .mw-rcfilters-ui-changesListWrapperWidget {
 	&-previousChangesIndicator {
-		border-top-color: var(--color-surface-4);
+		border-top-color: var( --color-surface-4 );
 		animation: 1s ease fadeBlueCitizen;
 	}
 
 	&-results {
 		&-noresult,
 		&-conflict {
-			font-weight: var(--font-weight-semibold);
+			font-weight: var( --font-weight-semibold );
 		}
 	}
 
-	&-enhanced-grey td:not(:nth-child(-n+2)) {
-		background-color: var(--color-surface-3);
+	&-enhanced-grey td:not( :nth-child( -n+2 ) ) {
+		background-color: var( --color-surface-3 );
 	}
 
 	.mw-changeslist-legend {
-		border-color: var(--border-color-base);
-		background-color: var(--color-surface-1);
+		border-color: var( --border-color-base );
+		background-color: var( --color-surface-1 );
 	}
 }
 
-@media (max-width: @width-breakpoint-tablet) {
+@media ( max-width: @width-breakpoint-tablet ) {
 	.mw-rcfilters-ui-changesListWrapperWidget .mw-changeslist-legend {
 		min-width: 7rem;
 		margin-left: 100%;
@@ -327,9 +327,9 @@
 	&-label {
 		margin-top: 0.75em;
 		margin-bottom: 0.25em;
-		color: var(--color-base--emphasized);
+		color: var( --color-base--emphasized );
 		font-size: 0.875rem;
-		font-weight: var(--font-weight-semibold);
+		font-weight: var( --font-weight-semibold );
 	}
 }
 
@@ -337,11 +337,11 @@
 .mw-rcfilters-ui-savedLinksListWidget {
 	&-placeholder {
 		&-title {
-			font-weight: var(--font-weight-semibold);
+			font-weight: var( --font-weight-semibold );
 		}
 
 		&.oo-ui-optionWidget .oo-ui-labelElement-label {
-			color: var(--color-base--subtle);
+			color: var( --color-base--subtle );
 		}
 	}
 }
@@ -349,12 +349,12 @@
 /* mw.rcfilters.ui.SavedLinksListItemWidget.less */
 .mw-rcfilters-ui-savedLinksListItemWidget {
 	&:hover {
-		background-color: var(--background-color-quiet--hover);
-		color: var(--color-base);
+		background-color: var( --background-color-quiet--hover );
+		color: var( --color-base );
 	}
 
 	&-label {
-		color: var(--color-primary);
+		color: var( --color-primary );
 	}
 }
 
@@ -363,7 +363,7 @@
 	&-popup {
 		> .oo-ui-popupWidget-popup > .oo-ui-popupWidget-head {
 			> .oo-ui-labelElement-label {
-				font-weight: var(--font-weight-medium);
+				font-weight: var( --font-weight-medium );
 			}
 		}
 	}
@@ -373,7 +373,7 @@
 .mw-rcfilters-ui-liveUpdateButtonWidget {
 	&.oo-ui-toggleWidget-on {
 		&::after {
-			background: var(--background-color-primary--active);
+			background: var( --background-color-primary--active );
 		}
 	}
 }
@@ -382,7 +382,7 @@
 .mw-rcfilters-ui-rclToOrFromWidget {
 	&.oo-ui-dropdownWidget.oo-ui-widget-enabled {
 		.oo-ui-dropdownWidget-handle {
-			font-weight: var(--font-weight-medium);
+			font-weight: var( --font-weight-medium );
 		}
 	}
 }
@@ -390,6 +390,6 @@
 /* mw.rcfilters.ui.WatchlistTopSectionWidget.less */
 .mw-rcfilters-ui-watchlistTopSectionWidget {
 	&-separator {
-		border-top: 1px solid var(--border-color-base);
+		border-top: 1px solid var( --border-color-base );
 	}
 }
diff --git a/skinStyles/mediawiki/mediawiki.rcfilters.highlightCircles.seenunseen.styles.less b/skinStyles/mediawiki/mediawiki.rcfilters.highlightCircles.seenunseen.styles.less
index 8be021b0..b54277e0 100644
--- a/skinStyles/mediawiki/mediawiki.rcfilters.highlightCircles.seenunseen.styles.less
+++ b/skinStyles/mediawiki/mediawiki.rcfilters.highlightCircles.seenunseen.styles.less
@@ -14,11 +14,11 @@ div.mw-rcfilters-ui-highlights {
 		&-none {
 			.mw-changeslist-watchedseen & {
 				.mw-rcfilters-ui-changesListWrapperWidget.mw-rcfilters-ui-changesListWrapperWidget-highlighted & {
-					border-color: var(--border-color-base);
+					border-color: var( --border-color-base );
 				}
 
-				.mw-rcfilters-ui-changesListWrapperWidget:not(.mw-rcfilters-ui-changesListWrapperWidget-highlighted) & {
-					border-color: var(--border-color-base);
+				.mw-rcfilters-ui-changesListWrapperWidget:not( .mw-rcfilters-ui-changesListWrapperWidget-highlighted ) & {
+					border-color: var( --border-color-base );
 				}
 			}
 		}
diff --git a/skinStyles/mediawiki/special/mediawiki.special.changeslist.enhanced.less b/skinStyles/mediawiki/special/mediawiki.special.changeslist.enhanced.less
index 5a638895..e5d869e8 100644
--- a/skinStyles/mediawiki/special/mediawiki.special.changeslist.enhanced.less
+++ b/skinStyles/mediawiki/special/mediawiki.special.changeslist.enhanced.less
@@ -11,21 +11,21 @@
  */
 
 table.mw-enhanced-rc {
-	padding: var(--space-sm) 0;
+	padding: var( --space-sm ) 0;
 	margin: 0 !important;
 	font-size: 0.875rem;
 	transition: @transition-background;
 
 	&:hover {
-		background-color: var(--background-color-quiet--hover);
+		background-color: var( --background-color-quiet--hover );
 	}
 }
 
 .mw-enhanced-rc-nested {
 	display: block;
-	margin-top: var(--space-xxs);
+	margin-top: var( --space-xxs );
 
 	.mw-tag-markers {
-		margin: var(--space-xxs);
+		margin: var( --space-xxs );
 	}
 }
diff --git a/skinStyles/mediawiki/special/mediawiki.special.changeslist.less b/skinStyles/mediawiki/special/mediawiki.special.changeslist.less
index 84eb4f41..fe286ce7 100644
--- a/skinStyles/mediawiki/special/mediawiki.special.changeslist.less
+++ b/skinStyles/mediawiki/special/mediawiki.special.changeslist.less
@@ -14,48 +14,48 @@
 /* default.less */
 .mw-plusminus {
 	&-pos {
-		color: var(--color-success);
+		color: var( --color-success );
 	}
 
 	&-minus {
-		color: var(--color-destructive);
+		color: var( --color-destructive );
 	}
 
 	&-null {
-		color: var(--color-base--subtle);
+		color: var( --color-base--subtle );
 	}
 }
 
 .mw-changeslist {
 	.comment {
-		color: var(--color-base--subtle);
+		color: var( --color-base--subtle );
 	}
 
 	// Need additional parent to override
 	.mw-changeslist-legend {
 		z-index: @z-index-page-header + 1; // so that it won't be covered by sticky header
-		border-color: var(--border-color-base);
-		border-radius: var(--border-radius--small);
-		background-color: var(--color-surface-1);
+		border-color: var( --border-color-base );
+		border-radius: var( --border-radius--small );
+		background-color: var( --color-surface-1 );
 	}
 
 	.mw-tag-markers {
 		.mw-tag-marker {
-			color: var(--color-base--subtle);
+			color: var( --color-base--subtle );
 		}
 	}
 
 	h4 {
-		padding: var(--space-sm) 0;
+		padding: var( --space-sm ) 0;
 		margin-bottom: 0;
-		color: var(--color-base--subtle);
+		color: var( --color-base--subtle );
 		font-size: 0.8125rem;
-		font-weight: var(--font-weight-normal);
+		font-weight: var( --font-weight-normal );
 		letter-spacing: 0.05em;
 	}
 }
 
-@media (max-width: @width-breakpoint-tablet) {
+@media ( max-width: @width-breakpoint-tablet ) {
 	.mw-changeslist .mw-changeslist-legend {
 		margin-left: 100%;
 	}
@@ -64,19 +64,19 @@
 .rcoptions {
 	padding: 0;
 	border: 0;
-	margin: var(--space-xl) 0;
+	margin: var( --space-xl ) 0;
 
 	legend {
 		width: 100%;
-		padding: var(--space-xs) 0;
-		border-bottom: 1px solid var(--border-color-base);
-		margin-bottom: var(--space-xs);
+		padding: var( --space-xs ) 0;
+		border-bottom: 1px solid var( --border-color-base );
+		margin-bottom: var( --space-xs );
 		font-size: 0.8125rem;
 	}
 }
 
-.client-js .mw-recentchanges-toplinks:not(.mw-recentchanges-toplinks-collapsed) {
-	border-color: var(--border-color-base);
+.client-js .mw-recentchanges-toplinks:not( .mw-recentchanges-toplinks-collapsed ) {
+	border-color: var( --border-color-base );
 }
 
 // Disable sticky header
diff --git a/skinStyles/mediawiki/special/mediawiki.special.preferences.styles.ooui.less b/skinStyles/mediawiki/special/mediawiki.special.preferences.styles.ooui.less
index 285007c6..b9ed4a0e 100644
--- a/skinStyles/mediawiki/special/mediawiki.special.preferences.styles.ooui.less
+++ b/skinStyles/mediawiki/special/mediawiki.special.preferences.styles.ooui.less
@@ -9,12 +9,12 @@
 	&-tabs {
 		&-wrapper.oo-ui-panelLayout-framed,
 		> .oo-ui-menuLayout-content > .oo-ui-indexLayout-stackLayout > .oo-ui-tabPanelLayout {
-			border-color: var(--border-color-base);
+			border-color: var( --border-color-base );
 		}
 	}
 
 	&-buttons {
-		border-color: var(--border-color-base);
-		background-color: var(--color-surface-0);
+		border-color: var( --border-color-base );
+		background-color: var( --color-surface-0 );
 	}
 }
diff --git a/skinStyles/mediawiki/special/mediawiki.special.search.styles.less b/skinStyles/mediawiki/special/mediawiki.special.search.styles.less
index b97d7f23..e2284970 100644
--- a/skinStyles/mediawiki/special/mediawiki.special.search.styles.less
+++ b/skinStyles/mediawiki/special/mediawiki.special.search.styles.less
@@ -31,7 +31,7 @@
 #mw-search-top-table {
 	display: flex;
 	justify-content: space-between;
-	gap: var(--space-xl);
+	gap: var( --space-xl );
 
 	// Fix weird space between input field and button
 	.oo-ui-actionFieldLayout .oo-ui-textInputWidget {
@@ -45,8 +45,8 @@
 
 .mw-search-profile-tabs {
 	border: 0;
-	border-bottom: 1px solid var(--border-color-base);
-	margin-top: var(--space-xxs);
+	border-bottom: 1px solid var( --border-color-base );
+	margin-top: var( --space-xxs );
 	background-color: transparent;
 }
 
@@ -61,25 +61,25 @@
 	}
 
 	a {
-		padding: var(--space-xs) var(--space-sm);
+		padding: var( --space-xs ) var( --space-sm );
 		border-bottom: 2px solid transparent;
-		color: var(--color-base--emphasized);
-		font-weight: var(--font-weight-medium);
+		color: var( --color-base--emphasized );
+		font-weight: var( --font-weight-medium );
 
 		&:hover {
-			border-color: var(--color-primary--hover);
-			color: var(-color-primary--hover);
+			border-color: var( --color-primary--hover );
+			color: var( -color-primary--hover );
 		}
 	}
 
 	.current a {
-		border-color: var(--color-primary);
-		color: var(--color-primary);
+		border-color: var( --color-primary );
+		color: var( --color-primary );
 	}
 }
 
 .results-info {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 	font-size: 0.875rem;
 	white-space: nowrap;
 }
@@ -87,22 +87,22 @@
 #mw-searchoptions {
 	border-color: transparent;
 	border-radius: 0;
-	background-color: var(--color-surface-1);
+	background-color: var( --color-surface-1 );
 
 	h4 {
-		color: var(--color-base--subtle);
+		color: var( --color-base--subtle );
 		font-size: 0.875rem;
-		font-weight: var(--font-weight-normal);
+		font-weight: var( --font-weight-normal );
 		letter-spacing: 0.05em;
 	}
 
 	.divider {
-		border-color: var(--border-color-base);
+		border-color: var( --border-color-base );
 	}
 }
 
 #mw-search-interwiki {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 }
 
 .searchdidyoumean {
@@ -117,17 +117,17 @@
 	// background: var( --color-surface-2 );
 	// border-radius: var( --border-radius--small );
 	margin-top: 0 !important;
-	color: var(--color-base--emphasized);
+	color: var( --color-base--emphasized );
 }
 
 .mw-search-results {
 	max-width: 50em;
 
 	li {
-		padding: var(--space-md) 0;
+		padding: var( --space-md ) 0;
 
 		a {
-			font-size: var(--font-size-h3);
+			font-size: var( --font-size-h3 );
 		}
 	}
 }
@@ -139,19 +139,19 @@
 	&-heading {
 		a {
 			// font-size: var( --font-size-h3 );
-			font-weight: var(--font-weight-semibold);
+			font-weight: var( --font-weight-semibold );
 		}
 	}
 
 	&-data {
-		color: var(--color-base--subtle);
+		color: var( --color-base--subtle );
 		font-size: 0.875rem;
 	}
 }
 
 .searchmatch {
-	color: var(--color-base--emphasized);
-	font-weight: var(--font-weight-semibold);
+	color: var( --color-base--emphasized );
+	font-weight: var( --font-weight-semibold );
 
 	a & {
 		// If searchmatch is part of the link (usually title), use link color
@@ -161,12 +161,12 @@
 
 .searchresults {
 	h2 {
-		padding-bottom: var(--space-xs);
-		border-bottom: 1px solid var(--border-color-base);
+		padding-bottom: var( --space-xs );
+		border-bottom: 1px solid var( --border-color-base );
 		margin-bottom: 0;
-		color: var(--color-base--subtle);
+		color: var( --color-base--subtle );
 		font-size: 0.875rem;
-		font-weight: var(--font-weight-normal);
+		font-weight: var( --font-weight-normal );
 		letter-spacing: 0.05em;
 	}
 }
@@ -184,7 +184,7 @@
 	}
 }
 
-@media (max-width: @width-breakpoint-tablet) {
+@media ( max-width: @width-breakpoint-tablet ) {
 	.results-info {
 		display: none;
 	}
diff --git a/skinStyles/mediawiki/special/mediawiki.special.userlogin.login.styles.less b/skinStyles/mediawiki/special/mediawiki.special.userlogin.login.styles.less
index 5652c63e..789e23bc 100644
--- a/skinStyles/mediawiki/special/mediawiki.special.userlogin.login.styles.less
+++ b/skinStyles/mediawiki/special/mediawiki.special.userlogin.login.styles.less
@@ -17,7 +17,7 @@
 	// Message box
 	.mw-message-box {
 		order: -4;
-		margin-bottom: var(--space-md);
+		margin-bottom: var( --space-md );
 	}
 
 	// Username field
@@ -50,27 +50,27 @@
 
 #mw-createaccount-cta {
 	width: auto; // should align to the rest of the form
-	border-top: 1px solid var(--border-color-base);
-	margin-top: var(--space-md);
-	color: var(--color-base--emphasized);
+	border-top: 1px solid var( --border-color-base );
+	margin-top: var( --space-md );
+	color: var( --color-base--emphasized );
 }
 
 #mw-createaccount-join {
-	background-color: var(--color-surface-2);
-	color: var(--color-primary);
+	background-color: var( --color-surface-2 );
+	color: var( --color-primary );
 
 	&:hover {
-		background-color: var(--color-surface-2--hover);
+		background-color: var( --color-surface-2--hover );
 	}
 
 	&:active {
 		border-color: transparent;
-		background-color: var(--color-surface-2--active);
-		color: var(--color-primary);
+		background-color: var( --color-surface-2--active );
+		color: var( --color-primary );
 	}
 
 	&:focus {
-		border-color: var(--color-primary);
-		box-shadow: inset 0 0 0 1px var(--color-primary);
+		border-color: var( --color-primary );
+		box-shadow: inset 0 0 0 1px var( --color-primary );
 	}
 }
diff --git a/skinStyles/mediawiki/special/mediawiki.special.userlogin.signup.styles.less b/skinStyles/mediawiki/special/mediawiki.special.userlogin.signup.styles.less
index ffa1995b..7150026d 100644
--- a/skinStyles/mediawiki/special/mediawiki.special.userlogin.signup.styles.less
+++ b/skinStyles/mediawiki/special/mediawiki.special.userlogin.signup.styles.less
@@ -23,43 +23,43 @@
 
 .mw-createacct-benefits {
 	&-container {
-		padding-bottom: var(--space-lg);
-		border-bottom: 1px solid var(--border-color-base);
+		padding-bottom: var( --space-lg );
+		border-bottom: 1px solid var( --border-color-base );
 
 		h2 {
 			margin: 0;
 			font-size: 1rem;
-			font-weight: var(--font-weight-semibold);
+			font-weight: var( --font-weight-semibold );
 		}
 	}
 
 	&-list {
 		display: flex;
 		flex-wrap: wrap;
-		margin-top: var(--space-lg);
-		gap: var(--space-xl);
+		margin-top: var( --space-lg );
+		gap: var( --space-xl );
 
 		.mw-number-text {
 			min-height: auto;
 			padding-left: 3rem;
 			margin: 0;
 			background-size: 2.5rem;
-			color: var(--color-base--subtle);
+			color: var( --color-base--subtle );
 			font-size: 0.8125rem;
-			line-height: var(--line-height-xs);
+			line-height: var( --line-height-xs );
 			text-align: start;
 
 			h3 {
-				color: var(--color-base--emphasized);
-				font-family: var(--fonts-sans);
+				color: var( --color-base--emphasized );
+				font-family: var( --fonts-sans );
 				font-size: 1.125rem;
-				font-weight: var(--font-weight-semibold);
+				font-weight: var( --font-weight-semibold );
 				line-height: 1;
 				text-align: start;
 			}
 
 			p {
-				margin: var(--space-xxs) 0 0 0;
+				margin: var( --space-xxs ) 0 0 0;
 			}
 		}
 	}
@@ -69,36 +69,36 @@
 	margin-right: 0;
 }
 
-@media (min-width: @width-breakpoint-tablet) {
+@media ( min-width: @width-breakpoint-tablet ) {
 	.mw-ui-container {
 		flex-direction: row;
 	}
 
 	.mw-createacct-benefits {
 		&-container {
-			padding-top: var(--space-md);
+			padding-top: var( --space-md );
 			padding-bottom: 0;
-			padding-left: var(--space-xxl);
+			padding-left: var( --space-xxl );
 			border-bottom: 0;
-			border-left: 1px solid var(--border-color-base);
-			margin-left: var(--space-xxl);
+			border-left: 1px solid var( --border-color-base );
+			margin-left: var( --space-xxl );
 
 			h2 {
 				max-width: 20rem;
-				font-size: var(--font-size-h1);
+				font-size: var( --font-size-h1 );
 			}
 		}
 
 		&-list {
 			flex-direction: column;
-			margin-top: var(--space-xxl);
+			margin-top: var( --space-xxl );
 
 			.mw-number-text {
 				padding-left: 5rem;
 				background-size: 4rem;
 
 				h3 {
-					font-size: var(--font-size-h1);
+					font-size: var( --font-size-h1 );
 				}
 			}
 		}
diff --git a/skinStyles/mediawiki/ui/mediawiki.ui.anchor.less b/skinStyles/mediawiki/ui/mediawiki.ui.anchor.less
index 898b994f..031646c7 100644
--- a/skinStyles/mediawiki/ui/mediawiki.ui.anchor.less
+++ b/skinStyles/mediawiki/ui/mediawiki.ui.anchor.less
@@ -10,53 +10,53 @@
 
 .mw-ui-anchor {
 	&.mw-ui-progressive {
-		color: var(--color-primary);
+		color: var( --color-primary );
 
 		&:hover {
-			color: var(--color-primary--hover);
+			color: var( --color-primary--hover );
 		}
 
 		&:focus,
 		&:active {
-			color: var(--color-primary--active);
+			color: var( --color-primary--active );
 		}
 
 		&.mw-ui-quiet {
-			color: var(--color-base);
+			color: var( --color-base );
 
 			&:hover {
-				color: var(--color-primary);
+				color: var( --color-primary );
 			}
 
 			&:focus,
 			&:active {
-				color: var(--color-primary--active);
+				color: var( --color-primary--active );
 			}
 		}
 	}
 
 	&.mw-ui-destructive {
-		color: var(--color-destructive);
+		color: var( --color-destructive );
 
 		&:hover {
-			color: var(--color-destructive--hover);
+			color: var( --color-destructive--hover );
 		}
 
 		&:focus,
 		&:active {
-			color: var(--color-destructive--active);
+			color: var( --color-destructive--active );
 		}
 
 		&.mw-ui-quiet {
-			color: var(--color-base);
+			color: var( --color-base );
 
 			&:hover {
-				color: var(--color-destructive);
+				color: var( --color-destructive );
 			}
 
 			&:focus,
 			&:active {
-				color: var(--color-destructive--active);
+				color: var( --color-destructive--active );
 			}
 		}
 	}
diff --git a/skinStyles/mediawiki/ui/mediawiki.ui.button.less b/skinStyles/mediawiki/ui/mediawiki.ui.button.less
index 24d018cc..61eb3baf 100644
--- a/skinStyles/mediawiki/ui/mediawiki.ui.button.less
+++ b/skinStyles/mediawiki/ui/mediawiki.ui.button.less
@@ -9,179 +9,179 @@
 */
 
 .mw-ui-button {
-	border-color: var(--border-color-base);
-	border-radius: var(--border-radius--small);
-	background-color: var(--color-surface-2);
-	color: var(--color-base--emphasized);
-	font-weight: var(--font-weight-medium);
+	border-color: var( --border-color-base );
+	border-radius: var( --border-radius--small );
+	background-color: var( --color-surface-2 );
+	color: var( --color-base--emphasized );
+	font-weight: var( --font-weight-medium );
 
-	&:not(:disabled) {
+	&:not( :disabled ) {
 		&:visited {
-			color: var(--color-base--emphasized);
+			color: var( --color-base--emphasized );
 		}
 
 		// Simplify hover style to only change background color
 		&:hover {
-			border-color: var(--border-color-base);
-			background-color: var(--color-surface-2--hover);
-			color: var(--color-base--emphasized);
+			border-color: var( --border-color-base );
+			background-color: var( --color-surface-2--hover );
+			color: var( --color-base--emphasized );
 		}
 
 		&:focus {
-			border-color: var(--color-primary);
-			box-shadow: inset 0 0 0 1px var(--color-primary), inset 0 0 0 2px var(--color-surface-0);
-			color: var(--color-base--emphasized);
+			border-color: var( --color-primary );
+			box-shadow: inset 0 0 0 1px var( --color-primary ), inset 0 0 0 2px var( --color-surface-0 );
+			color: var( --color-base--emphasized );
 		}
 
 		&:active,
 		&.is-on {
-			border-color: var(--color-surface-2--active);
-			background-color: var(--color-surface-2--active);
-			color: var(--color-base--subtle);
+			border-color: var( --color-surface-2--active );
+			background-color: var( --color-surface-2--active );
+			color: var( --color-base--subtle );
 		}
 	}
 
 	&:disabled {
-		border-color: var(--color-surface-4);
-		background-color: var(--color-surface-4);
-		color: var(--color-base--subtle);
+		border-color: var( --color-surface-4 );
+		background-color: var( --color-surface-4 );
+		color: var( --color-base--subtle );
 	}
 
 	&.mw-ui-quiet,
 	&.mw-ui-quiet.mw-ui-progressive,
 	&.mw-ui-quiet.mw-ui-destructive {
-		color: var(--color-base--emphasized);
-		font-weight: var(--font-weight-medium);
+		color: var( --color-base--emphasized );
+		font-weight: var( --font-weight-medium );
 
-		input[type='checkbox']:hover + &,
+		input[ type='checkbox' ]:hover + &,
 		&:hover {
-			background-color: var(--background-color-quiet--hover);
-			color: var(--color-base--emphasized);
+			background-color: var( --background-color-quiet--hover );
+			color: var( --color-base--emphasized );
 		}
 
-		input[type='checkbox']:focus + &,
+		input[ type='checkbox' ]:focus + &,
 		&:focus {
-			border-color: var(--color-primary);
-			box-shadow: inset 0 0 0 1px var(--color-primary), inset 0 0 0 2px var(--color-surface-0);
-			color: var(--color-base--emphasized);
+			border-color: var( --color-primary );
+			box-shadow: inset 0 0 0 1px var( --color-primary ), inset 0 0 0 2px var( --color-surface-0 );
+			color: var( --color-base--emphasized );
 		}
 
-		input[type='checkbox']:active + &,
+		input[ type='checkbox' ]:active + &,
 		&:active {
 			border-color: transparent;
-			background-color: var(--background-color-quiet--active);
-			color: var(--color-base--subtle);
+			background-color: var( --background-color-quiet--active );
+			color: var( --color-base--subtle );
 		}
 
 		&:disabled,
 		&:disabled:hover,
 		&:disabled:active {
-			color: var(--color-base--subtle);
+			color: var( --color-base--subtle );
 		}
 	}
 
 	&.mw-ui-progressive {
-		&:not(:disabled) {
-			border-color: var(--color-primary);
-			background-color: var(--color-primary);
+		&:not( :disabled ) {
+			border-color: var( --color-primary );
+			background-color: var( --color-primary );
 
 			&:hover {
-				border-color: var(--color-primary--hover);
-				background-color: var(--color-primary--hover);
+				border-color: var( --color-primary--hover );
+				background-color: var( --color-primary--hover );
 				color: #fff;
 			}
 
 			&:focus {
-				box-shadow: inset 0 0 0 1px var(--color-primary), inset 0 0 0 2px #fff;
+				box-shadow: inset 0 0 0 1px var( --color-primary ), inset 0 0 0 2px #fff;
 			}
 
 			&:active,
 			&.is-on {
-				border-color: var(--color-primary--active);
-				background-color: var(--color-primary--active);
+				border-color: var( --color-primary--active );
+				background-color: var( --color-primary--active );
 				color: #fff;
 			}
 		}
 
 		&:disabled {
-			border-color: var(--color-surface-4);
-			background-color: var(--color-surface-4);
-			color: var(--color-base--subtle);
+			border-color: var( --color-surface-4 );
+			background-color: var( --color-surface-4 );
+			color: var( --color-base--subtle );
 		}
 
 		&.mw-ui-quiet {
-			color: var(--color-primary);
+			color: var( --color-primary );
 
-			input[type='checkbox']:hover + &,
+			input[ type='checkbox' ]:hover + &,
 			&:hover {
 				// Simplify quiet hover style
-				background-color: var(--background-color-quiet--hover);
-				color: var(--color-primary--hover);
+				background-color: var( --background-color-quiet--hover );
+				color: var( --color-primary--hover );
 			}
 
-			input[type='checkbox']:focus + &,
+			input[ type='checkbox' ]:focus + &,
 			&:focus {
-				border-color: var(--color-primary);
-				color: var(--color-primary);
+				border-color: var( --color-primary );
+				color: var( --color-primary );
 			}
 
-			input[type='checkbox']:active + &,
+			input[ type='checkbox' ]:active + &,
 			&:active {
-				border-color: var(--color-primary--active);
-				background-color: var(--color-primary--active);
+				border-color: var( --color-primary--active );
+				background-color: var( --color-primary--active );
 			}
 		}
 	}
 
 	&.mw-ui-destructive {
-		&:not(:disabled) {
-			border-color: var(--color-destructive);
-			background-color: var(--color-destructive);
+		&:not( :disabled ) {
+			border-color: var( --color-destructive );
+			background-color: var( --color-destructive );
 
 			&:hover {
-				border-color: var(--color-destructive--hover);
-				background-color: var(--color-destructive--hover);
+				border-color: var( --color-destructive--hover );
+				background-color: var( --color-destructive--hover );
 				color: #fff;
 			}
 
 			&:focus {
-				box-shadow: inset 0 0 0 1px var(--color-destructive), inset 0 0 0 2px #fff;
+				box-shadow: inset 0 0 0 1px var( --color-destructive ), inset 0 0 0 2px #fff;
 			}
 
 			&:active,
 			&.is-on {
-				border-color: var(--color-destructive--active);
-				background-color: var(--color-destructive--active);
+				border-color: var( --color-destructive--active );
+				background-color: var( --color-destructive--active );
 				color: #fff;
 			}
 		}
 
 		&:disabled {
-			border-color: var(--color-surface-4);
-			background-color: var(--color-surface-4);
-			color: var(--color-base--subtle);
+			border-color: var( --color-surface-4 );
+			background-color: var( --color-surface-4 );
+			color: var( --color-base--subtle );
 		}
 
 		&.mw-ui-quiet {
-			color: var(--color-destructive);
+			color: var( --color-destructive );
 
-			input[type='checkbox']:hover + &,
+			input[ type='checkbox' ]:hover + &,
 			&:hover {
 				// Simplify quiet hover style
-				background-color: var(--background-color-quiet--hover);
-				color: var(--color-destructive--hover);
+				background-color: var( --background-color-quiet--hover );
+				color: var( --color-destructive--hover );
 			}
 
-			input[type='checkbox']:focus + &,
+			input[ type='checkbox' ]:focus + &,
 			&:focus {
-				border-color: var(--color-destructive);
-				color: var(--color-destructive);
+				border-color: var( --color-destructive );
+				color: var( --color-destructive );
 			}
 
-			input[type='checkbox']:active + &,
+			input[ type='checkbox' ]:active + &,
 			&:active {
-				border-color: var(--color-destructive--active);
-				background-color: var(--color-destructive--active);
+				border-color: var( --color-destructive--active );
+				background-color: var( --color-destructive--active );
 			}
 		}
 	}
@@ -193,13 +193,13 @@
 
 	& > * {
 		&:first-child {
-			border-bottom-left-radius: var(--border-radius--small);
-			border-top-left-radius: var(--border-radius--small);
+			border-bottom-left-radius: var( --border-radius--small );
+			border-top-left-radius: var( --border-radius--small );
 		}
 
 		&:last-child {
-			border-bottom-right-radius: var(--border-radius--small);
-			border-top-right-radius: var(--border-radius--small);
+			border-bottom-right-radius: var( --border-radius--small );
+			border-top-right-radius: var( --border-radius--small );
 		}
 	}
 }
diff --git a/skinStyles/mediawiki/ui/mediawiki.ui.checkbox.less b/skinStyles/mediawiki/ui/mediawiki.ui.checkbox.less
index 6d9d8bab..f920b704 100644
--- a/skinStyles/mediawiki/ui/mediawiki.ui.checkbox.less
+++ b/skinStyles/mediawiki/ui/mediawiki.ui.checkbox.less
@@ -9,59 +9,59 @@
 */
 
 .mw-ui-checkbox {
-	[type='checkbox'] {
+	[ type='checkbox' ] {
 		& + label::before {
-			border-color: var(--border-color-base--darker);
-			border-radius: var(--border-radius--small);
+			border-color: var( --border-color-base--darker );
+			border-radius: var( --border-radius--small );
 			// Show background when hovered
 			background-color: transparent;
 		}
 
 		&:enabled {
 			&:focus + label::before {
-				border-color: var(--color-primary);
-				background-color: var(--color-surface-0);
-				box-shadow: inset 0 0 0 1px var(--color-primary);
+				border-color: var( --color-primary );
+				background-color: var( --color-surface-0 );
+				box-shadow: inset 0 0 0 1px var( --color-primary );
 			}
 
 			&:hover + label::before {
-				border-color: var(--color-primary--hover);
-				background-color: var(--color-surface-0);
+				border-color: var( --color-primary--hover );
+				background-color: var( --color-surface-0 );
 			}
 
 			&:active + label::before {
-				border-color: var(--color-primary--active);
-				background-color: var(--color-primary--active);
-				box-shadow: inset 0 0 0 1px var(--color-primary--active);
+				border-color: var( --color-primary--active );
+				background-color: var( --color-primary--active );
+				box-shadow: inset 0 0 0 1px var( --color-primary--active );
 			}
 
 			&:checked {
 				& + label::before {
-					border-color: var(--color-primary);
-					background-color: var(--color-primary);
+					border-color: var( --color-primary );
+					background-color: var( --color-primary );
 				}
 
 				&:focus + label::before {
-					border-color: var(--color-primary);
-					background-color: var(--color-primary);
-					box-shadow: inset 0 0 0 1px var(--color-primary), inset 0 0 0 2px #fff;
+					border-color: var( --color-primary );
+					background-color: var( --color-primary );
+					box-shadow: inset 0 0 0 1px var( --color-primary ), inset 0 0 0 2px #fff;
 				}
 
 				&:hover + label::before {
-					border-color: var(--color-primary--hover);
-					background-color: var(--color-primary--hover);
+					border-color: var( --color-primary--hover );
+					background-color: var( --color-primary--hover );
 				}
 
 				&:active + label::before {
-					border-color: var(--color-primary--active);
-					background-color: var(--color-primary--active);
+					border-color: var( --color-primary--active );
+					background-color: var( --color-primary--active );
 				}
 			}
 		}
 
 		&:disabled + label::before {
-			border-color: var(--color-surface-4);
-			background-color: var(--color-surface-4);
+			border-color: var( --color-surface-4 );
+			background-color: var( --color-surface-4 );
 		}
 	}
 }
diff --git a/skinStyles/mediawiki/ui/mediawiki.ui.icon.less b/skinStyles/mediawiki/ui/mediawiki.ui.icon.less
index 7eb1d94a..cc816f91 100644
--- a/skinStyles/mediawiki/ui/mediawiki.ui.icon.less
+++ b/skinStyles/mediawiki/ui/mediawiki.ui.icon.less
@@ -11,28 +11,28 @@
 @import '../../resources/variables.less';
 
 .mw-ui-icon-element {
-	border-radius: var(--border-radius--small);
+	border-radius: var( --border-radius--small );
 
 	&:active {
-		background-color: var(--background-color-quiet--active);
+		background-color: var( --background-color-quiet--active );
 	}
 }
 
-@media (hover: hover) {
-	.mw-ui-icon-element:not(.disabled):hover {
-		background-color: var(--background-color-quiet--hover);
+@media ( hover: hover ) {
+	.mw-ui-icon-element:not( .disabled ):hover {
+		background-color: var( --background-color-quiet--hover );
 	}
 }
 
-@media all and (min-width: @width-breakpoint-desktop) {
+@media all and ( min-width: @width-breakpoint-desktop ) {
 	.mw-ui-icon-with-label-desktop {
-		color: var(--color-base--subtle) !important;
+		color: var( --color-base--subtle ) !important;
 
 		&:hover,
 		&:focus,
 		&:active,
 		&:visited {
-			color: var(--color-base--subtle);
+			color: var( --color-base--subtle );
 		}
 	}
 }
diff --git a/skinStyles/mediawiki/ui/mediawiki.ui.input.less b/skinStyles/mediawiki/ui/mediawiki.ui.input.less
index 3226b8c5..9422138c 100644
--- a/skinStyles/mediawiki/ui/mediawiki.ui.input.less
+++ b/skinStyles/mediawiki/ui/mediawiki.ui.input.less
@@ -10,34 +10,34 @@
 
 .mw-ui-input {
 	padding: 6px 8px;
-	border-color: var(--border-color-base--darker);
-	border-radius: var(--border-radius--small);
+	border-color: var( --border-color-base--darker );
+	border-radius: var( --border-radius--small );
 	background-color: transparent;
-	color: var(--color-base--emphasized);
-	line-height: var(--line-height-xs);
+	color: var( --color-base--emphasized );
+	line-height: var( --line-height-xs );
 
 	&:hover {
 		// Sync with checkbox and radio
-		border-color: var(--color-primary--hover);
-		background-color: var(--color-surface-0);
+		border-color: var( --color-primary--hover );
+		background-color: var( --color-surface-0 );
 	}
 
 	&:focus {
-		border-color: var(--color-primary);
-		background-color: var(--color-surface-0);
-		box-shadow: inset 0 0 0 1px var(--color-primary);
+		border-color: var( --color-primary );
+		background-color: var( --color-surface-0 );
+		box-shadow: inset 0 0 0 1px var( --color-primary );
 	}
 
 	&:disabled {
-		border-color: var(--color-surface-4);
-		background-color: var(--color-surface-4);
-		color: var(--color-base--subtle);
+		border-color: var( --color-surface-4 );
+		background-color: var( --color-surface-4 );
+		color: var( --color-base--subtle );
 	}
 }
 
 input.mw-ui-input-large {
 	// Smaller font size since MW UI assume a 14px base font size
 	font-size: 1.5em;
-	font-weight: var(--font-weight-semibold);
-	line-height: var(--line-height-xs);
+	font-weight: var( --font-weight-semibold );
+	line-height: var( --line-height-xs );
 }
diff --git a/skinStyles/mediawiki/ui/mediawiki.ui.less b/skinStyles/mediawiki/ui/mediawiki.ui.less
index 46718f1b..62fb6f69 100644
--- a/skinStyles/mediawiki/ui/mediawiki.ui.less
+++ b/skinStyles/mediawiki/ui/mediawiki.ui.less
@@ -11,7 +11,7 @@
 /* form.less */
 .mw-ui-vform-field,
 .mw-ui-vform .htmlform-tip {
-	margin: 0 0 var(--space-md);
+	margin: 0 0 var( --space-md );
 }
 
 // Tip message after input field should have reduced spacing
diff --git a/skinStyles/mediawiki/ui/mediawiki.ui.radio.less b/skinStyles/mediawiki/ui/mediawiki.ui.radio.less
index 2d1e3b6a..15e69000 100644
--- a/skinStyles/mediawiki/ui/mediawiki.ui.radio.less
+++ b/skinStyles/mediawiki/ui/mediawiki.ui.radio.less
@@ -9,10 +9,10 @@
 */
 
 .client-js .mw-ui-radio {
-	[type='radio'] {
+	[ type='radio' ] {
 		& + label {
 			&::before {
-				border-color: var(--border-color-base--darker);
+				border-color: var( --border-color-base--darker );
 				// Show background when hovered
 				background-color: transparent;
 			}
@@ -20,33 +20,33 @@
 
 		&:enabled {
 			&:hover + label::before {
-				border-color: var(--color-primary--hover);
-				background-color: var(--color-surface-0);
+				border-color: var( --color-primary--hover );
+				background-color: var( --color-surface-0 );
 			}
 
 			&:active + label::before {
-				border-color: var(--color-primary--active);
-				background-color: var(--color-primary--active);
+				border-color: var( --color-primary--active );
+				background-color: var( --color-primary--active );
 			}
 
 			&:checked {
 				& + label::before {
-					border-color: var(--color-primary);
+					border-color: var( --color-primary );
 					background-color: #fff;
 				}
 
 				&:hover + label::before {
-					border-color: var(--color-primary--hover);
+					border-color: var( --color-primary--hover );
 				}
 
 				&:active {
 					& + label::before {
-						border-color: var(--color-primary--active);
-						box-shadow: inset 0 0 0 1px var(--color-primary--active);
+						border-color: var( --color-primary--active );
+						box-shadow: inset 0 0 0 1px var( --color-primary--active );
 					}
 
 					& + label::after {
-						border-color: var(--color-primary--active);
+						border-color: var( --color-primary--active );
 					}
 				}
 			}
@@ -54,12 +54,12 @@
 
 		&:disabled {
 			& + label::before {
-				border-color: var(--color-surface-4);
-				background-color: var(--color-surface-4);
+				border-color: var( --color-surface-4 );
+				background-color: var( --color-surface-4 );
 			}
 
 			&:checked + label::before {
-				background-color: var(--color-surface-0);
+				background-color: var( --color-surface-0 );
 			}
 		}
 	}
diff --git a/skinStyles/ooui/oojs-ui-core.less b/skinStyles/ooui/oojs-ui-core.less
index 0765776a..d90776f6 100644
--- a/skinStyles/ooui/oojs-ui-core.less
+++ b/skinStyles/ooui/oojs-ui-core.less
@@ -11,326 +11,326 @@
 @import '../../resources/variables.less';
 
 .oo-ui-buttonElement > .oo-ui-buttonElement-button {
-	border-radius: var(--border-radius--small);
-	font-weight: var(--font-weight-medium);
+	border-radius: var( --border-radius--small );
+	font-weight: var( --font-weight-medium );
 }
 
-.oo-ui-buttonElement.oo-ui-widget-enabled > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon:not(.oo-ui-image-invert),
-.oo-ui-buttonElement.oo-ui-widget-enabled > .oo-ui-buttonElement-button > .oo-ui-indicatorElement-indicator:not(.oo-ui-image-invert) {
-	opacity: var(--opacity-icon-base);
+.oo-ui-buttonElement.oo-ui-widget-enabled > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon:not( .oo-ui-image-invert ),
+.oo-ui-buttonElement.oo-ui-widget-enabled > .oo-ui-buttonElement-button > .oo-ui-indicatorElement-indicator:not( .oo-ui-image-invert ) {
+	opacity: var( --opacity-icon-base );
 }
 
 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button {
-	color: var(--color-base--emphasized);
+	color: var( --color-base--emphasized );
 }
 
 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover {
-	background-color: var(--background-color-quiet--hover);
-	color: var(--color-base--emphasized);
+	background-color: var( --background-color-quiet--hover );
+	color: var( --color-base--emphasized );
 }
 
 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button:focus {
-	border-color: var(--color-primary);
-	box-shadow: inset 0 0 0 1px var(--color-primary);
+	border-color: var( --color-primary );
+	box-shadow: inset 0 0 0 1px var( --color-primary );
 }
 
 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-buttonElement-pressed > input.oo-ui-buttonElement-button,
 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button:active {
-	border-color: var(--background-color-quiet--active);
-	background-color: var(--background-color-quiet--active);
-	color: var(--color-base--subtle);
+	border-color: var( --background-color-quiet--active );
+	background-color: var( --background-color-quiet--active );
+	color: var( --color-base--subtle );
 }
 
-.oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-indicatorElement:not(.oo-ui-iconElement, .oo-ui-labelElement) > .oo-ui-buttonElement-button:focus {
-	box-shadow: 0 0 0 2px var(--color-primary);
+.oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-indicatorElement:not( .oo-ui-iconElement, .oo-ui-labelElement ) > .oo-ui-buttonElement-button:focus {
+	box-shadow: 0 0 0 2px var( --color-primary );
 }
 
 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button {
-	color: var(--color-primary);
+	color: var( --color-primary );
 }
 
 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover {
-	color: var(--color-primary--hover);
+	color: var( --color-primary--hover );
 }
 
 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:active,
 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button {
-	border-color: var(--color-primary--active);
-	color: var(--color-primary--active);
+	border-color: var( --color-primary--active );
+	color: var( --color-primary--active );
 }
 
 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button {
-	color: var(--color-destructive);
+	color: var( --color-destructive );
 }
 
 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:hover {
-	color: var(--color-destructive--hover);
+	color: var( --color-destructive--hover );
 }
 
 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:active,
 .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button {
-	border-color: var(--color-destructive--active);
-	color: var(--color-destructive--active);
+	border-color: var( --color-destructive--active );
+	color: var( --color-destructive--active );
 }
 
 .oo-ui-buttonElement-frameless.oo-ui-widget-disabled > .oo-ui-buttonElement-button {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .oo-ui-buttonElement-frameless.oo-ui-widget-disabled > .oo-ui-buttonElement-button > .oo-ui-iconElement-icon,
 .oo-ui-buttonElement-frameless.oo-ui-widget-disabled > .oo-ui-buttonElement-button > .oo-ui-indicatorElement-indicator {
-	opacity: var(--opacity-base--disabled);
+	opacity: var( --opacity-base--disabled );
 }
 
 .oo-ui-buttonElement-framed > .oo-ui-buttonElement-button {
-	border-radius: var(--border-radius--small);
+	border-radius: var( --border-radius--small );
 }
 
 .oo-ui-buttonElement-framed.oo-ui-widget-disabled > .oo-ui-buttonElement-button {
-	border-color: var(--color-surface-4);
-	background-color: var(--color-surface-4);
-	color: var(--color-base--subtle);
+	border-color: var( --color-surface-4 );
+	background-color: var( --color-surface-4 );
+	color: var( --color-base--subtle );
 }
 
 .oo-ui-buttonElement-framed.oo-ui-widget-disabled.oo-ui-buttonElement-active > .oo-ui-buttonElement-button {
-	background-color: var(--color-surface-4);
+	background-color: var( --color-surface-4 );
 }
 
 .oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button {
-	border-color: var(--border-color-base);
-	background-color: var(--color-surface-2);
-	color: var(--color-base--emphasized);
+	border-color: var( --border-color-base );
+	background-color: var( --color-surface-2 );
+	color: var( --color-base--emphasized );
 }
 
 .oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover {
-	border-color: var(--border-color-base);
-	background-color: var(--color-surface-2--hover);
-	color: var(--color-base--emphasized);
+	border-color: var( --border-color-base );
+	background-color: var( --color-surface-2--hover );
+	color: var( --color-base--emphasized );
 }
 
-.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover > .oo-ui-iconElement-icon:not(.oo-ui-image-invert),
-.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover > .oo-ui-indicatorElement-indicator:not(.oo-ui-image-invert) {
-	opacity: var(--opacity-icon-base--hover);
+.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover > .oo-ui-iconElement-icon:not( .oo-ui-image-invert ),
+.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover > .oo-ui-indicatorElement-indicator:not( .oo-ui-image-invert ) {
+	opacity: var( --opacity-icon-base--hover );
 }
 
 .oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:focus {
-	border-color: var(--color-primary);
-	box-shadow: inset 0 0 0 1px var(--color-primary);
+	border-color: var( --color-primary );
+	box-shadow: inset 0 0 0 1px var( --color-primary );
 }
 
 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-active > .oo-ui-buttonElement-button {
-	border-color: var(--color-primary--active);
-	background-color: var(--color-primary--active);
+	border-color: var( --color-primary--active );
+	background-color: var( --color-primary--active );
 }
 
 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-active > .oo-ui-buttonElement-button:focus {
-	border-color: var(--color-primary);
-	box-shadow: inset 0 0 0 1px var(--color-primary), inset 0 0 0 2px #fff;
+	border-color: var( --color-primary );
+	box-shadow: inset 0 0 0 1px var( --color-primary ), inset 0 0 0 2px #fff;
 }
 
 .oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:active,
 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button {
-	border-color: var(--color-surface-2--active);
-	background-color: var(--color-surface-2--active);
-	color: var(--color-base--subtle);
+	border-color: var( --color-surface-2--active );
+	background-color: var( --color-surface-2--active );
+	color: var( --color-base--subtle );
 }
 
 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button {
-	color: var(--color-primary);
+	color: var( --color-primary );
 }
 
 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover {
-	border-color: var(--color-primary--hover);
-	background-color: var(--color-surface-2--hover);
+	border-color: var( --color-primary--hover );
+	background-color: var( --color-surface-2--hover );
 }
 
 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:focus {
-	border-color: var(--color-primary);
-	box-shadow: inset 0 0 0 1px var(--color-primary);
+	border-color: var( --color-primary );
+	box-shadow: inset 0 0 0 1px var( --color-primary );
 }
 
 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:active,
 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button,
 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive.oo-ui-buttonElement-active > .oo-ui-buttonElement-button,
 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive.oo-ui-popupToolGroup-active > .oo-ui-buttonElement-button {
-	border-color: var(--color-primary--active);
-	background-color: var(--color-surface-2--active);
-	color: var(--color-primary--active);
+	border-color: var( --color-primary--active );
+	background-color: var( --color-surface-2--active );
+	color: var( --color-primary--active );
 }
 
 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button {
-	color: var(--color-destructive);
+	color: var( --color-destructive );
 }
 
 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:hover {
-	border-color: var(--color-destructive--hover);
-	background-color: var(--color-surface-2--hover);
+	border-color: var( --color-destructive--hover );
+	background-color: var( --color-surface-2--hover );
 }
 
 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:focus {
-	border-color: var(--color-destructive);
-	box-shadow: inset 0 0 0 1px var(--color-destructive);
+	border-color: var( --color-destructive );
+	box-shadow: inset 0 0 0 1px var( --color-destructive );
 }
 
 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:active,
 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button,
 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive.oo-ui-buttonElement-active > .oo-ui-buttonElement-button,
 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive.oo-ui-popupToolGroup-active > .oo-ui-buttonElement-button {
-	border-color: var(--color-destructive--active);
-	background-color: var(--color-surface-2--active);
-	color: var(--color-destructive--active);
+	border-color: var( --color-destructive--active );
+	background-color: var( --color-surface-2--active );
+	color: var( --color-destructive--active );
 }
 
 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button {
-	border-color: var(--color-primary);
-	background-color: var(--color-primary);
+	border-color: var( --color-primary );
+	background-color: var( --color-primary );
 }
 
 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover {
-	border-color: var(--color-primary--hover);
-	background-color: var(--color-primary--hover);
+	border-color: var( --color-primary--hover );
+	background-color: var( --color-primary--hover );
 }
 
 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:focus {
-	border-color: var(--color-primary);
-	box-shadow: inset 0 0 0 1px var(--color-primary), inset 0 0 0 2px #fff;
+	border-color: var( --color-primary );
+	box-shadow: inset 0 0 0 1px var( --color-primary ), inset 0 0 0 2px #fff;
 }
 
 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:active,
 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button,
 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-buttonElement-active > .oo-ui-buttonElement-button,
 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-popupToolGroup-active > .oo-ui-buttonElement-button {
-	border-color: var(--color-primary--active);
-	background-color: var(--color-primary--active);
+	border-color: var( --color-primary--active );
+	background-color: var( --color-primary--active );
 }
 
 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button {
-	border-color: var(--color-destructive);
-	background-color: var(--color-destructive);
+	border-color: var( --color-destructive );
+	background-color: var( --color-destructive );
 }
 
 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:hover {
-	border-color: var(--color-destructive--hover);
-	background-color: var(--color-destructive--hover);
+	border-color: var( --color-destructive--hover );
+	background-color: var( --color-destructive--hover );
 }
 
 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:focus {
-	border-color: var(--color-destructive);
-	box-shadow: inset 0 0 0 1px var(--color-destructive), inset 0 0 0 2px #fff;
+	border-color: var( --color-destructive );
+	box-shadow: inset 0 0 0 1px var( --color-destructive ), inset 0 0 0 2px #fff;
 }
 
 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button:active,
 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button,
 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive.oo-ui-buttonElement-active > .oo-ui-buttonElement-button,
 .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive.oo-ui-popupToolGroup-active > .oo-ui-buttonElement-button {
-	border-color: var(--color-destructive--active);
-	background-color: var(--color-destructive--active);
+	border-color: var( --color-destructive--active );
+	background-color: var( --color-destructive--active );
 }
 
 .oo-ui-labelElement .oo-ui-labelElement-label-highlight {
-	font-weight: var(--font-weight-semibold);
+	font-weight: var( --font-weight-semibold );
 }
 
 .oo-ui-pendingElement-pending {
-	background-color: var(--color-surface-2);
-	background-image: -webkit-linear-gradient(135deg, var(--color-surface-1) 25%, transparent 25%, transparent 50%, var(--color-surface-1) 50%, var(--color-surface-1) 75%, transparent 75%, transparent);
-	background-image: -moz-linear-gradient(135deg, var(--color-surface-1) 25%, transparent 25%, transparent 50%, var(--color-surface-1) 50%, var(--color-surface-1) 75%, transparent 75%, transparent);
-	background-image: linear-gradient(135deg, var(--color-surface-1) 25%, transparent 25%, transparent 50%, var(--color-surface-1) 50%, var(--color-surface-1) 75%, transparent 75%, transparent);
+	background-color: var( --color-surface-2 );
+	background-image: -webkit-linear-gradient( 135deg, var( --color-surface-1 ) 25%, transparent 25%, transparent 50%, var( --color-surface-1 ) 50%, var( --color-surface-1 ) 75%, transparent 75%, transparent );
+	background-image: -moz-linear-gradient( 135deg, var( --color-surface-1 ) 25%, transparent 25%, transparent 50%, var( --color-surface-1 ) 50%, var( --color-surface-1 ) 75%, transparent 75%, transparent );
+	background-image: linear-gradient( 135deg, var( --color-surface-1 ) 25%, transparent 25%, transparent 50%, var( --color-surface-1 ) 50%, var( --color-surface-1 ) 75%, transparent 75%, transparent );
 }
 
 .oo-ui-fieldLayout-disabled > .oo-ui-fieldLayout-body > .oo-ui-fieldLayout-header > .oo-ui-labelElement-label {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .oo-ui-actionFieldLayout .oo-ui-actionFieldLayout-input > .oo-ui-widget.oo-ui-textInputWidget > .oo-ui-inputWidget-input,
 .oo-ui-actionFieldLayout .oo-ui-actionFieldLayout-input > .oo-ui-widget .oo-ui-dropdownWidget-handle,
 .oo-ui-actionFieldLayout .oo-ui-actionFieldLayout-input > .oo-ui-widget .oo-ui-tagMultiselectWidget-handle {
-	border-radius: var(--border-radius--small) 0 0 var(--border-radius--small);
+	border-radius: var( --border-radius--small ) 0 0 var( --border-radius--small );
 }
 
 .oo-ui-actionFieldLayout .oo-ui-actionFieldLayout-button .oo-ui-buttonElement-framed > .oo-ui-buttonElement-button {
-	border-radius: 0 var(--border-radius--small) var(--border-radius--small) 0;
+	border-radius: 0 var( --border-radius--small ) var( --border-radius--small ) 0;
 }
 
 .oo-ui-fieldsetLayout.oo-ui-labelElement > .oo-ui-fieldsetLayout-header > .oo-ui-labelElement-label {
-	color: var(--color-base--emphasized);
-	font-weight: var(--font-weight-semibold);
+	color: var( --color-base--emphasized );
+	font-weight: var( --font-weight-semibold );
 	letter-spacing: 0; // reset legend style in Citizen core
 }
 
 .oo-ui-panelLayout-framed {
-	border-color: var(--border-color-base);
-	border-radius: var(--border-radius--small);
+	border-color: var( --border-color-base );
+	border-radius: var( --border-radius--small );
 }
 
 .oo-ui-optionWidget.oo-ui-widget-disabled {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .oo-ui-decoratedOptionWidget.oo-ui-widget-enabled:hover .oo-ui-iconElement-icon,
 .oo-ui-decoratedOptionWidget.oo-ui-widget-enabled:hover .oo-ui-indicatorElement-indicator {
-	opacity: var(--opacity-icon-hover);
+	opacity: var( --opacity-icon-hover );
 }
 
 .oo-ui-decoratedOptionWidget.oo-ui-widget-enabled .oo-ui-iconElement-icon,
 .oo-ui-decoratedOptionWidget.oo-ui-widget-enabled .oo-ui-indicatorElement-indicator {
-	opacity: var(--opacity-icon-base);
+	opacity: var( --opacity-icon-base );
 }
 
 .oo-ui-decoratedOptionWidget.oo-ui-widget-disabled .oo-ui-iconElement-icon,
 .oo-ui-decoratedOptionWidget.oo-ui-widget-disabled .oo-ui-indicatorElement-indicator {
-	opacity: var(--opacity-base--disabled);
+	opacity: var( --opacity-base--disabled );
 }
 
 .oo-ui-labelWidget.oo-ui-inline-help {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .oo-ui-messageWidget {
-	border-radius: var(--border-radius--medium);
-	font-weight: var(--font-weight-semibold);
+	border-radius: var( --border-radius--medium );
+	font-weight: var( --font-weight-semibold );
 }
 
-.oo-ui-messageWidget.oo-ui-flaggedElement-error:not(.oo-ui-messageWidget-block) {
-	color: var(--color-destructive);
+.oo-ui-messageWidget.oo-ui-flaggedElement-error:not( .oo-ui-messageWidget-block ) {
+	color: var( --color-destructive );
 }
 
 .oo-ui-iconWidget.oo-ui-widget-disabled {
-	opacity: var(--opacity-base--disabled);
+	opacity: var( --opacity-base--disabled );
 }
 
 .oo-ui-indicatorWidget.oo-ui-widget-disabled {
-	opacity: var(--opacity-base--disabled);
+	opacity: var( --opacity-base--disabled );
 }
 
 .oo-ui-buttonGroupWidget {
-	border-radius: var(--border-radius--small);
+	border-radius: var( --border-radius--small );
 }
 
 .oo-ui-buttonGroupWidget .oo-ui-buttonElement-framed:first-child .oo-ui-buttonElement-button {
-	border-bottom-left-radius: var(--border-radius--small);
-	border-top-left-radius: var(--border-radius--small);
+	border-bottom-left-radius: var( --border-radius--small );
+	border-top-left-radius: var( --border-radius--small );
 }
 
 .oo-ui-buttonGroupWidget .oo-ui-buttonElement-framed:last-child .oo-ui-buttonElement-button {
-	border-bottom-right-radius: var(--border-radius--small);
-	border-top-right-radius: var(--border-radius--small);
+	border-bottom-right-radius: var( --border-radius--small );
+	border-top-right-radius: var( --border-radius--small );
 }
 
 .oo-ui-buttonGroupWidget .oo-ui-buttonElement-framed.oo-ui-widget-disabled + .oo-ui-widget-disabled > .oo-ui-buttonElement-button {
-	border-left-color: var(--border-color-base);
+	border-left-color: var( --border-color-base );
 }
 
 .oo-ui-buttonGroupWidget.oo-ui-widget-enabled .oo-ui-buttonElement.oo-ui-toggleWidget-on + .oo-ui-toggleWidget-on > .oo-ui-buttonElement-button,
 .oo-ui-buttonGroupWidget.oo-ui-widget-enabled .oo-ui-buttonElement.oo-ui-toggleWidget-on + .oo-ui-toggleWidget-on > .oo-ui-buttonElement-button:active {
-	border-left-color: var(--border-color-base);
+	border-left-color: var( --border-color-base );
 }
 
 .oo-ui-popupWidget-popup {
-	border-color: var(--border-color-base--darker);
-	border-radius: var(--border-radius--medium);
-	background-color: var(--color-surface-1);
-	box-shadow: var(--box-shadow-dialog);
+	border-color: var( --border-color-base--darker );
+	border-radius: var( --border-radius--medium );
+	background-color: var( --color-surface-1 );
+	box-shadow: var( --box-shadow-dialog );
 }
 
 /*
@@ -343,94 +343,94 @@ TODO: Need to refactor the current shadow for filter drop-shadow, see variables.
 */
 
 .oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor::before {
-	border-bottom-color: var(--border-color-base);
+	border-bottom-color: var( --border-color-base );
 }
 
 .oo-ui-popupWidget-anchored-top .oo-ui-popupWidget-anchor::after {
-	border-bottom-color: var(--color-surface-1);
+	border-bottom-color: var( --color-surface-1 );
 }
 
 .oo-ui-popupWidget-anchored-bottom .oo-ui-popupWidget-anchor::before {
-	border-top-color: var(--border-color-base);
+	border-top-color: var( --border-color-base );
 }
 
 .oo-ui-popupWidget-anchored-bottom .oo-ui-popupWidget-anchor::after {
-	border-top-color: var(--color-surface-1);
+	border-top-color: var( --color-surface-1 );
 }
 
 .oo-ui-popupWidget-anchored-start .oo-ui-popupWidget-anchor::before {
-	border-right-color: var(--border-color-base);
+	border-right-color: var( --border-color-base );
 }
 
 .oo-ui-popupWidget-anchored-start .oo-ui-popupWidget-anchor::after {
-	border-right-color: var(--color-surface-1);
+	border-right-color: var( --color-surface-1 );
 }
 
 .oo-ui-popupWidget-anchored-end .oo-ui-popupWidget-anchor::before {
-	border-left-color: var(--border-color-base);
+	border-left-color: var( --border-color-base );
 }
 
 .oo-ui-popupWidget-anchored-end .oo-ui-popupWidget-anchor::after {
-	border-left-color: var(--color-surface-1);
+	border-left-color: var( --color-surface-1 );
 }
 
-.oo-ui-checkboxInputWidget [type='checkbox'] + span {
-	border-color: var(--border-color-base--darker);
+.oo-ui-checkboxInputWidget [ type='checkbox' ] + span {
+	border-color: var( --border-color-base--darker );
 	// Show background when hovered
 	background-color: transparent;
 }
 
-.oo-ui-checkboxInputWidget [type='checkbox']:disabled + span {
-	border-color: var(--color-surface-4);
-	background-color: var(--color-surface-4);
+.oo-ui-checkboxInputWidget [ type='checkbox' ]:disabled + span {
+	border-color: var( --color-surface-4 );
+	background-color: var( --color-surface-4 );
 }
 
-.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:focus + span {
-	border-color: var(--color-primary);
-	background-color: var(--color-surface-0);
-	box-shadow: inset 0 0 0 1px var(--color-primary);
+.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [ type='checkbox' ]:focus + span {
+	border-color: var( --color-primary );
+	background-color: var( --color-surface-0 );
+	box-shadow: inset 0 0 0 1px var( --color-primary );
 }
 
-.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:hover + span {
-	border-color: var(--color-primary--hover);
-	background-color: var(--color-surface-0);
+.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [ type='checkbox' ]:hover + span {
+	border-color: var( --color-primary--hover );
+	background-color: var( --color-surface-0 );
 }
 
-.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:active + span {
-	border-color: var(--color-primary--active);
-	background-color: var(--color-primary--active);
-	box-shadow: inset 0 0 0 1px var(--color-primary--active);
+.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [ type='checkbox' ]:active + span {
+	border-color: var( --color-primary--active );
+	background-color: var( --color-primary--active );
+	box-shadow: inset 0 0 0 1px var( --color-primary--active );
 }
 
-.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:checked + span,
-.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:indeterminate + span {
-	border-color: var(--color-primary);
-	background-color: var(--color-primary);
+.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [ type='checkbox' ]:checked + span,
+.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [ type='checkbox' ]:indeterminate + span {
+	border-color: var( --color-primary );
+	background-color: var( --color-primary );
 }
 
-.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:checked:focus + span,
-.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:indeterminate:focus + span {
-	border-color: var(--color-primary);
-	background-color: var(--color-primary);
-	box-shadow: inset 0 0 0 1px var(--color-primary), inset 0 0 0 2px #fff;
+.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [ type='checkbox' ]:checked:focus + span,
+.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [ type='checkbox' ]:indeterminate:focus + span {
+	border-color: var( --color-primary );
+	background-color: var( --color-primary );
+	box-shadow: inset 0 0 0 1px var( --color-primary ), inset 0 0 0 2px #fff;
 }
 
-.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:checked:hover + span,
-.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:indeterminate:hover + span {
-	border-color: var(--color-primary--hover);
-	background-color: var(--color-primary--hover);
+.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [ type='checkbox' ]:checked:hover + span,
+.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [ type='checkbox' ]:indeterminate:hover + span {
+	border-color: var( --color-primary--hover );
+	background-color: var( --color-primary--hover );
 }
 
-.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:checked:active + span,
-.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [type='checkbox']:indeterminate:active + span {
-	border-color: var(--color-primary--active);
-	background-color: var(--color-primary--active);
-	box-shadow: inset 0 0 0 1px var(--color-primary--active);
+.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [ type='checkbox' ]:checked:active + span,
+.oo-ui-checkboxInputWidget.oo-ui-widget-enabled [ type='checkbox' ]:indeterminate:active + span {
+	border-color: var( --color-primary--active );
+	background-color: var( --color-primary--active );
+	box-shadow: inset 0 0 0 1px var( --color-primary--active );
 }
 
 .oo-ui-dropdownInputWidget select {
-	border-color: var(--border-color-base--darker);
-	border-radius: var(--border-radius--small);
+	border-color: var( --border-color-base--darker );
+	border-radius: var( --border-radius--small );
 }
 
 .oo-ui-dropdownInputWidget.oo-ui-widget-enabled {
@@ -439,281 +439,281 @@ TODO: Need to refactor the current shadow for filter drop-shadow, see variables.
 }
 
 .oo-ui-dropdownInputWidget.oo-ui-widget-enabled:hover {
-	background-color: var(--color-surface-0);
+	background-color: var( --color-surface-0 );
 }
 
 .oo-ui-dropdownInputWidget.oo-ui-widget-enabled select {
-	color: var(--color-base--emphasized);
+	color: var( --color-base--emphasized );
 }
 
 .oo-ui-dropdownInputWidget.oo-ui-widget-enabled select:hover {
-	border-color: var(--color-primary--hover);
-	color: var(--color-base);
+	border-color: var( --color-primary--hover );
+	color: var( --color-base );
 }
 
 .oo-ui-dropdownInputWidget.oo-ui-widget-enabled select:active {
-	border-color: var(--border-color-base--darker);
-	color: var(--color-base--emphasized);
+	border-color: var( --border-color-base--darker );
+	color: var( --color-base--emphasized );
 }
 
 .oo-ui-dropdownInputWidget.oo-ui-widget-enabled select:focus {
-	border-color: var(--color-primary);
-	box-shadow: inset 0 0 0 1px var(--color-primary);
+	border-color: var( --color-primary );
+	box-shadow: inset 0 0 0 1px var( --color-primary );
 }
 
 .oo-ui-dropdownInputWidget.oo-ui-widget-disabled {
-	background-color: var(--color-surface-4);
+	background-color: var( --color-surface-4 );
 }
 
 .oo-ui-dropdownInputWidget.oo-ui-widget-disabled select {
-	border-color: var(--color-surface-4);
-	color: var(--color-base--subtle);
+	border-color: var( --color-surface-4 );
+	color: var( --color-base--subtle );
 }
 
-.oo-ui-radioInputWidget [type='radio'] + span {
-	border-color: var(--border-color-base--darker);
+.oo-ui-radioInputWidget [ type='radio' ] + span {
+	border-color: var( --border-color-base--darker );
 	// Show background when hovered
 	background-color: transparent;
 }
 
-.oo-ui-radioInputWidget [type='radio']:disabled + span {
-	border-color: var(--color-surface-4);
-	background-color: var(--color-surface-4);
+.oo-ui-radioInputWidget [ type='radio' ]:disabled + span {
+	border-color: var( --color-surface-4 );
+	background-color: var( --color-surface-4 );
 }
 
-.oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio']:hover + span {
-	border-color: var(--color-primary--hover);
-	background-color: var(--color-surface-0);
+.oo-ui-radioInputWidget.oo-ui-widget-enabled [ type='radio' ]:hover + span {
+	border-color: var( --color-primary--hover );
+	background-color: var( --color-surface-0 );
 }
 
-.oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio']:active + span {
-	border-color: var(--color-primary--active);
-	background-color: var(--color-primary--active);
+.oo-ui-radioInputWidget.oo-ui-widget-enabled [ type='radio' ]:active + span {
+	border-color: var( --color-primary--active );
+	background-color: var( --color-primary--active );
 }
 
-.oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio']:checked + span {
-	border-color: var(--color-primary);
+.oo-ui-radioInputWidget.oo-ui-widget-enabled [ type='radio' ]:checked + span {
+	border-color: var( --color-primary );
 	background-color: #fff;
 }
 
-.oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio']:checked:hover + span {
-	border-color: var(--color-primary--hover);
+.oo-ui-radioInputWidget.oo-ui-widget-enabled [ type='radio' ]:checked:hover + span {
+	border-color: var( --color-primary--hover );
 }
 
-.oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio']:checked:active + span {
-	border-color: var(--color-primary--active);
-	box-shadow: inset 0 0 0 1px var(--color-primary--active);
+.oo-ui-radioInputWidget.oo-ui-widget-enabled [ type='radio' ]:checked:active + span {
+	border-color: var( --color-primary--active );
+	box-shadow: inset 0 0 0 1px var( --color-primary--active );
 }
 
-.oo-ui-radioInputWidget.oo-ui-widget-enabled [type='radio']:checked:active + span::before {
-	border-color: var(--color-primary--active);
+.oo-ui-radioInputWidget.oo-ui-widget-enabled [ type='radio' ]:checked:active + span::before {
+	border-color: var( --color-primary--active );
 }
 
 .oo-ui-textInputWidget .oo-ui-inputWidget-input {
-	border-color: var(--border-color-base--darker);
-	border-radius: var(--border-radius--small);
+	border-color: var( --border-color-base--darker );
+	border-radius: var( --border-radius--small );
 	// Show background when hovered
 	background-color: transparent;
-	color: var(--color-base--emphasized);
+	color: var( --color-base--emphasized );
 }
 
 .oo-ui-textInputWidget .oo-ui-pendingElement-pending {
-	background-color: var(--color-surface-3);
+	background-color: var( --color-surface-3 );
 }
 
 .oo-ui-textInputWidget > .oo-ui-labelElement-label {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .oo-ui-textInputWidget.oo-ui-widget-enabled .oo-ui-inputWidget-input::placeholder {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .oo-ui-textInputWidget.oo-ui-widget-enabled .oo-ui-inputWidget-input:focus {
-	border-color: var(--color-primary);
-	box-shadow: inset 0 0 0 1px var(--color-primary);
+	border-color: var( --color-primary );
+	box-shadow: inset 0 0 0 1px var( --color-primary );
 }
 
-.oo-ui-textInputWidget.oo-ui-widget-enabled .oo-ui-inputWidget-input[readonly]:not(.oo-ui-pendingElement-pending) {
-	background-color: var(--color-surface-2);
+.oo-ui-textInputWidget.oo-ui-widget-enabled .oo-ui-inputWidget-input[ readonly ]:not( .oo-ui-pendingElement-pending ) {
+	background-color: var( --color-surface-2 );
 }
 
 .oo-ui-textInputWidget.oo-ui-widget-enabled:hover .oo-ui-inputWidget-input {
-	border-color: var(--color-primary--hover);
-	background-color: var(--color-surface-0);
+	border-color: var( --color-primary--hover );
+	background-color: var( --color-surface-0 );
 }
 
 .oo-ui-textInputWidget.oo-ui-widget-enabled:hover .oo-ui-inputWidget-input:focus {
-	border-color: var(--color-primary);
+	border-color: var( --color-primary );
 }
 
-@media screen and (min-width: 0) {
+@media screen and ( min-width: 0 ) {
 	.oo-ui-textInputWidget.oo-ui-widget-enabled textarea.oo-ui-inputWidget-input:focus {
-		outline: 1px solid var(--color-primary);
+		outline: 1px solid var( --color-primary );
 	}
 
 	.oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid textarea.oo-ui-inputWidget-input:focus {
-		outline-color: var(--color-destructive);
+		outline-color: var( --color-destructive );
 	}
 }
 
 .oo-ui-textInputWidget.oo-ui-widget-enabled > .oo-ui-iconElement-icon {
-	opacity: var(--opacity-icon-base);
+	opacity: var( --opacity-icon-base );
 }
 
 .oo-ui-textInputWidget.oo-ui-widget-enabled > .oo-ui-indicatorElement-indicator {
-	opacity: var(--opacity-icon-base);
+	opacity: var( --opacity-icon-base );
 }
 
 .oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid .oo-ui-inputWidget-input {
-	border-color: var(--color-destructive);
+	border-color: var( --color-destructive );
 }
 
 .oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid .oo-ui-inputWidget-input:hover {
-	border-color: var(--color-destructive);
+	border-color: var( --color-destructive );
 }
 
 .oo-ui-textInputWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid .oo-ui-inputWidget-input:focus {
-	border-color: var(--color-destructive);
-	box-shadow: inset 0 0 0 1px var(--color-destructive);
+	border-color: var( --color-destructive );
+	box-shadow: inset 0 0 0 1px var( --color-destructive );
 }
 
 .oo-ui-textInputWidget.oo-ui-widget-disabled .oo-ui-inputWidget-input {
-	border-color: var(--border-color-base--darker);
-	background-color: var(--color-surface-4);
-	color: var(--color-base--subtle);
-	-webkit-text-fill-color: var(--color-base--subtle);
+	border-color: var( --border-color-base--darker );
+	background-color: var( --color-surface-4 );
+	color: var( --color-base--subtle );
+	-webkit-text-fill-color: var( --color-base--subtle );
 	text-shadow: none;
 }
 
 .oo-ui-textInputWidget.oo-ui-widget-disabled > .oo-ui-iconElement-icon,
 .oo-ui-textInputWidget.oo-ui-widget-disabled > .oo-ui-indicatorElement-indicator {
-	opacity: var(--opacity-base--disabled);
+	opacity: var( --opacity-base--disabled );
 }
 
 .oo-ui-textInputWidget.oo-ui-widget-disabled > .oo-ui-labelElement-label {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 	text-shadow: none;
 }
 
 .oo-ui-menuSelectWidget {
 	z-index: @z-index-overlay;
-	border-color: var(--border-color-base--darker);
-	border-radius: 0 0 var(--border-radius--small) var(--border-radius--small);
-	background-color: var(--color-surface-1);
-	box-shadow: var(--box-shadow-dialog);
+	border-color: var( --border-color-base--darker );
+	border-radius: 0 0 var( --border-radius--small ) var( --border-radius--small );
+	background-color: var( --color-surface-1 );
+	box-shadow: var( --box-shadow-dialog );
 }
 
 .oo-ui-menuOptionWidget.oo-ui-optionWidget-highlighted {
-	background-color: var(--background-color-quiet--hover);
-	color: var(--color-base--emphasized);
+	background-color: var( --background-color-quiet--hover );
+	color: var( --color-base--emphasized );
 }
 
 .oo-ui-menuOptionWidget.oo-ui-optionWidget-selected {
-	background-color: var(--background-color-primary--hover);
-	color: var(--color-primary);
+	background-color: var( --background-color-primary--hover );
+	color: var( --color-primary );
 }
 
 .oo-ui-menuOptionWidget.oo-ui-optionWidget-selected.oo-ui-menuOptionWidget.oo-ui-optionWidget-highlighted,
 .oo-ui-menuOptionWidget.oo-ui-optionWidget-pressed.oo-ui-menuOptionWidget.oo-ui-optionWidget-highlighted {
-	background-color: var(--background-color-primary--active);
-	color: var(--color-primary);
+	background-color: var( --background-color-primary--active );
+	color: var( --color-primary );
 }
 
 .oo-ui-menuOptionWidget.oo-ui-widget-enabled.oo-ui-optionWidget {
-	color: var(--color-base--emphasized);
+	color: var( --color-base--emphasized );
 }
 
 .oo-ui-menuSectionOptionWidget {
-	color: var(--color-base--subtle);
-	font-weight: var(--font-weight-medium);
+	color: var( --color-base--subtle );
+	font-weight: var( --font-weight-medium );
 }
 
 .oo-ui-dropdownWidget-handle {
-	border-color: var(--border-color-base--darker);
-	border-radius: var(--border-radius--small);
+	border-color: var( --border-color-base--darker );
+	border-radius: var( --border-radius--small );
 }
 
 .oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle {
 	// Show background when hovered
 	background-color: transparent;
-	color: var(--color-base--emphasized);
+	color: var( --color-base--emphasized );
 }
 
 .oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle:hover {
-	border-color: var(--color-primary--hover);
+	border-color: var( --color-primary--hover );
 	// Sync with oo-ui-menuSelectWidget
-	background-color: var(--color-surface-1);
-	color: var(--color-base--emphasized);
+	background-color: var( --color-surface-1 );
+	color: var( --color-base--emphasized );
 }
 
 .oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle:hover .oo-ui-iconElement-icon,
 .oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle:hover .oo-ui-indicatorElement-indicator {
-	opacity: var(--opacity-icon-base--hover);
+	opacity: var( --opacity-icon-base--hover );
 }
 
 .oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle:active {
-	border-color: var(--border-color-base--darker);
-	color: var(--color-base--emphasized);
+	border-color: var( --border-color-base--darker );
+	color: var( --color-base--emphasized );
 }
 
 .oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle:focus {
-	border-color: var(--color-primary);
-	box-shadow: inset 0 0 0 1px var(--color-primary);
+	border-color: var( --color-primary );
+	box-shadow: inset 0 0 0 1px var( --color-primary );
 }
 
 .oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle .oo-ui-iconElement-icon,
 .oo-ui-dropdownWidget.oo-ui-widget-enabled .oo-ui-dropdownWidget-handle .oo-ui-indicatorElement-indicator {
-	opacity: var(--opacity-icon-base);
+	opacity: var( --opacity-icon-base );
 }
 
 .oo-ui-dropdownWidget.oo-ui-widget-enabled.oo-ui-dropdownWidget-open .oo-ui-dropdownWidget-handle {
 	// Sync with oo-ui-menuSelectWidget
-	background-color: var(--color-surface-1);
+	background-color: var( --color-surface-1 );
 }
 
 .oo-ui-dropdownWidget.oo-ui-widget-disabled .oo-ui-dropdownWidget-handle {
-	border-color: var(--color-surface-4);
-	background-color: var(--color-surface-4);
-	color: var(--color-base--subtle);
+	border-color: var( --color-surface-4 );
+	background-color: var( --color-surface-4 );
+	color: var( --color-base--subtle );
 	text-shadow: none;
 }
 
 .oo-ui-dropdownWidget.oo-ui-widget-disabled .oo-ui-dropdownWidget-handle .oo-ui-indicatorElement-indicator {
-	opacity: var(--opacity-base--disabled);
+	opacity: var( --opacity-base--disabled );
 }
 
 .oo-ui-comboBoxInputWidget.oo-ui-comboBoxInputWidget-empty .oo-ui-inputWidget-input,
 .oo-ui-comboBoxInputWidget-php .oo-ui-inputWidget-input {
-	border-bottom-right-radius: var(--border-radius--small);
-	border-top-right-radius: var(--border-radius--small);
+	border-bottom-right-radius: var( --border-radius--small );
+	border-top-right-radius: var( --border-radius--small );
 }
 
 .oo-ui-comboBoxInputWidget-open .oo-ui-comboBoxInputWidget-dropdownButton > .oo-ui-buttonElement-button {
 	// Sync with oo-ui-menuSelectWidget
-	background-color: var(--color-surface-1);
+	background-color: var( --color-surface-1 );
 }
 
 .oo-ui-comboBoxInputWidget.oo-ui-widget-disabled .oo-ui-indicatorElement-indicator {
-	opacity: var(--opacity-base--disabled);
+	opacity: var( --opacity-base--disabled );
 }
 
 .oo-ui-multioptionWidget.oo-ui-widget-disabled {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .oo-ui-progressBarWidget {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 }
 
-.oo-ui-progressBarWidget:not(.oo-ui-pendingElement-pending) {
-	background-color: var(--color-surface-1);
+.oo-ui-progressBarWidget:not( .oo-ui-pendingElement-pending ) {
+	background-color: var( --color-surface-1 );
 }
 
 .oo-ui-progressBarWidget.oo-ui-widget-enabled .oo-ui-progressBarWidget-bar {
-	background-color: var(--color-primary);
+	background-color: var( --color-primary );
 }
 
 .oo-ui-progressBarWidget.oo-ui-widget-disabled .oo-ui-progressBarWidget-bar {
-	background-color: var(--color-surface-4);
+	background-color: var( --color-surface-4 );
 }
diff --git a/skinStyles/ooui/oojs-ui-toolbars.less b/skinStyles/ooui/oojs-ui-toolbars.less
index bf044a29..a2c0c689 100644
--- a/skinStyles/ooui/oojs-ui-toolbars.less
+++ b/skinStyles/ooui/oojs-ui-toolbars.less
@@ -18,384 +18,384 @@
 }
 
 .oo-ui-tool.oo-ui-widget-enabled .oo-ui-tool-link:focus {
-	box-shadow: inset 0 0 0 1px var(--color-primary);
-	outline: 1px solid var(--color-primary);
+	box-shadow: inset 0 0 0 1px var( --color-primary );
+	outline: 1px solid var( --color-primary );
 }
 
 .oo-ui-tool.oo-ui-widget-enabled .oo-ui-iconElement-icon {
-	opacity: var(--opacity-icon-base);
+	opacity: var( --opacity-icon-base );
 }
 
 .oo-ui-tool.oo-ui-widget-enabled > .oo-ui-tool-link:hover {
-	background-color: var(--background-color-quiet--hover);
+	background-color: var( --background-color-quiet--hover );
 }
 
 .oo-ui-tool.oo-ui-widget-enabled > .oo-ui-tool-link:focus {
-	box-shadow: inset 0 0 0 1px var(--color-primary);
-	outline: 1px solid var(--color-primary);
+	box-shadow: inset 0 0 0 1px var( --color-primary );
+	outline: 1px solid var( --color-primary );
 }
 
 .oo-ui-tool.oo-ui-widget-enabled > .oo-ui-tool-link:active,
 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-tool-active > .oo-ui-tool-link,
 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-popupToolGroup-active > .oo-ui-tool-link {
-	background-color: var(--background-color-primary--hover);
-	color: var(--color-primary);
+	background-color: var( --background-color-primary--hover );
+	color: var( --color-primary );
 }
 
 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-tool-link {
-	color: var(--color-primary);
+	color: var( --color-primary );
 }
 
 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-tool-link:hover {
-	background-color: var(--background-color-quiet--hover);
+	background-color: var( --background-color-quiet--hover );
 }
 
 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-tool-link:focus {
-	box-shadow: inset 0 0 0 1px var(--color-primary);
-	outline: 1px solid var(--color-primary);
+	box-shadow: inset 0 0 0 1px var( --color-primary );
+	outline: 1px solid var( --color-primary );
 }
 
 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive > .oo-ui-tool-link:active,
 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive.oo-ui-tool-active > .oo-ui-tool-link,
 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive.oo-ui-popupToolGroup-active > .oo-ui-tool-link {
-	background-color: var(--background-color-primary--hover);
-	color: var(--color-primary--active);
+	background-color: var( --background-color-primary--hover );
+	color: var( --color-primary--active );
 }
 
 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-tool-link {
-	color: var(--color-destructive);
+	color: var( --color-destructive );
 }
 
 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-tool-link:hover {
-	background-color: var(--background-color-quiet--hover);
+	background-color: var( --background-color-quiet--hover );
 }
 
 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-tool-link:focus {
-	box-shadow: inset 0 0 0 1px var(--color-destructive);
-	outline: 1px solid var(--color-destructive);
+	box-shadow: inset 0 0 0 1px var( --color-destructive );
+	outline: 1px solid var( --color-destructive );
 }
 
 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-tool-link:active,
 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive.oo-ui-tool-active > .oo-ui-tool-link,
 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive.oo-ui-popupToolGroup-active > .oo-ui-tool-link {
-	background-color: var(--color-surface-1);
-	color: var(--color-destructive);
+	background-color: var( --color-surface-1 );
+	color: var( --color-destructive );
 }
 
 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-tool-link {
-	background-color: var(--color-primary);
+	background-color: var( --color-primary );
 }
 
 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-tool-link:hover {
-	background-color: var(--color-primary--hover);
+	background-color: var( --color-primary--hover );
 }
 
 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-tool-link:focus {
-	box-shadow: inset 0 0 0 1px var(--color-primary), inset 0 0 0 2px #fff;
-	outline: 1px solid var(--color-primary);
+	box-shadow: inset 0 0 0 1px var( --color-primary ), inset 0 0 0 2px #fff;
+	outline: 1px solid var( --color-primary );
 }
 
 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-tool-link:active,
 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-tool-active > .oo-ui-tool-link {
-	background-color: var(--color-primary--active);
+	background-color: var( --color-primary--active );
 }
 
 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-widget-disabled > .oo-ui-tool-link,
 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-widget-disabled > .oo-ui-tool-link:active {
-	background-color: var(--color-surface-4);
-	color: var(--color-base--subtle);
+	background-color: var( --color-surface-4 );
+	color: var( --color-base--subtle );
 }
 
 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive > .oo-ui-tool-link {
-	background-color: var(--color-destructive);
+	background-color: var( --color-destructive );
 }
 
 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive > .oo-ui-tool-link:hover {
-	background-color: var(--color-destructive--hover);
+	background-color: var( --color-destructive--hover );
 }
 
 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive > .oo-ui-tool-link:focus {
-	box-shadow: inset 0 0 0 1px var(--color-destructive), inset 0 0 0 2px #fff;
-	outline: 1px solid var(--color-destructive);
+	box-shadow: inset 0 0 0 1px var( --color-destructive ), inset 0 0 0 2px #fff;
+	outline: 1px solid var( --color-destructive );
 }
 
 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive > .oo-ui-tool-link:active,
 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive.oo-ui-tool-active > .oo-ui-tool-link {
-	background-color: var(--color-destructive--active);
+	background-color: var( --color-destructive--active );
 }
 
 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive.oo-ui-widget-disabled > .oo-ui-tool-link,
 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive.oo-ui-widget-disabled > .oo-ui-tool-link:active {
-	background-color: var(--color-surface-4);
-	color: var(--color-base--subtle);
+	background-color: var( --color-surface-4 );
+	color: var( --color-base--subtle );
 }
 
 .oo-ui-tool.oo-ui-widget-enabled.oo-ui-flaggedElement-primary > .oo-ui-tool-link {
-	font-weight: var(--font-weight-medium);
+	font-weight: var( --font-weight-medium );
 }
 
-.oo-ui-toolGroup.oo-ui-widget-disabled:not(.oo-ui-flaggedElement-primary) .oo-ui-indicatorElement-indicator,
-.oo-ui-toolGroup.oo-ui-widget-disabled:not(.oo-ui-flaggedElement-primary) .oo-ui-iconElement-icon {
-	opacity: var(--opacity-base--disabled) !important;
+.oo-ui-toolGroup.oo-ui-widget-disabled:not( .oo-ui-flaggedElement-primary ) .oo-ui-indicatorElement-indicator,
+.oo-ui-toolGroup.oo-ui-widget-disabled:not( .oo-ui-flaggedElement-primary ) .oo-ui-iconElement-icon {
+	opacity: var( --opacity-base--disabled ) !important;
 }
 
 .oo-ui-barToolGroup-tools.oo-ui-toolGroup-enabled-tools .oo-ui-tool.oo-ui-widget-disabled .oo-ui-iconElement-icon,
 .oo-ui-barToolGroup-tools.oo-ui-toolGroup-disabled-tools .oo-ui-tool .oo-ui-iconElement-icon {
-	opacity: var(--opacity-base--disabled);
+	opacity: var( --opacity-base--disabled );
 }
 
 .oo-ui-barToolGroup-tools.oo-ui-toolGroup-enabled-tools .oo-ui-tool.oo-ui-widget-disabled.oo-ui-flaggedElement-primary > .oo-ui-tool-link,
 .oo-ui-barToolGroup-tools.oo-ui-toolGroup-disabled-tools .oo-ui-tool.oo-ui-flaggedElement-primary > .oo-ui-tool-link {
-	border-color: var(--color-surface-4);
-	background-color: var(--color-surface-4);
+	border-color: var( --color-surface-4 );
+	background-color: var( --color-surface-4 );
 }
 
 .oo-ui-barToolGroup-tools.oo-ui-toolGroup-enabled-tools .oo-ui-tool.oo-ui-widget-disabled.oo-ui-flaggedElement-primary > .oo-ui-tool-link .oo-ui-tool-title,
 .oo-ui-barToolGroup-tools.oo-ui-toolGroup-disabled-tools .oo-ui-tool.oo-ui-flaggedElement-primary > .oo-ui-tool-link .oo-ui-tool-title {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .oo-ui-barToolGroup-tools.oo-ui-toolGroup-enabled-tools .oo-ui-tool.oo-ui-widget-disabled.oo-ui-flaggedElement-primary.oo-ui-tool-active > .oo-ui-tool-link,
 .oo-ui-barToolGroup-tools.oo-ui-toolGroup-disabled-tools .oo-ui-tool.oo-ui-flaggedElement-primary.oo-ui-tool-active > .oo-ui-tool-link {
-	background-color: var(--background-color-quiet--hover);
+	background-color: var( --background-color-quiet--hover );
 }
 
 .oo-ui-barToolGroup-tools.oo-ui-toolGroup-enabled-tools .oo-ui-tool.oo-ui-widget-disabled > .oo-ui-tool-link .oo-ui-tool-title,
 .oo-ui-barToolGroup-tools.oo-ui-toolGroup-disabled-tools .oo-ui-tool > .oo-ui-tool-link .oo-ui-tool-title {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .oo-ui-popupToolGroup-header {
-	color: var(--color-base--subtle);
-	font-weight: var(--font-weight-semibold);
+	color: var( --color-base--subtle );
+	font-weight: var( --font-weight-semibold );
 }
 
 .oo-ui-popupToolGroup-tools {
-	border-color: var(--border-color-base);
-	background-color: var(--color-surface-1);
+	border-color: var( --border-color-base );
+	background-color: var( --color-surface-1 );
 	// box-shadow: var( --box-shadow--card );
 }
 
 .oo-ui-popupToolGroup-tools .oo-ui-tool-link .oo-ui-tool-accel {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle:hover {
-	background-color: var(--background-color-quiet--hover);
+	background-color: var( --background-color-quiet--hover );
 }
 
 .oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle:active {
-	background-color: var(--background-color-primary--active);
+	background-color: var( --background-color-primary--active );
 }
 
 .oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle .oo-ui-iconElement-icon,
 .oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle .oo-ui-indicatorElement-indicator {
-	opacity: var(--opacity-icon-base);
+	opacity: var( --opacity-icon-base );
 }
 
 .oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle:hover .oo-ui-iconElement-icon,
 .oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle:hover .oo-ui-indicatorElement-indicator {
-	opacity: var(--opacity-icon-base--hover);
+	opacity: var( --opacity-icon-base--hover );
 }
 
 .oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle:active .oo-ui-iconElement-icon,
 .oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle:active .oo-ui-indicatorElement-indicator {
-	opacity: var(--opacity-icon-base--active);
+	opacity: var( --opacity-icon-base--active );
 }
 
 .oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle:focus {
-	box-shadow: inset 0 0 0 1px var(--color-primary);
-	outline: 1px solid var(--color-primary);
+	box-shadow: inset 0 0 0 1px var( --color-primary );
+	outline: 1px solid var( --color-primary );
 }
 
 .oo-ui-toolbar-actions .oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle:hover {
-	border-right-color: var(--background-color-quiet--hover);
+	border-right-color: var( --background-color-quiet--hover );
 }
 
 .oo-ui-toolbar-actions .oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle:active {
-	border-right-color: var(--background-color-primary--hover);
+	border-right-color: var( --background-color-primary--hover );
 }
 
 .oo-ui-toolbar-actions .oo-ui-popupToolGroup.oo-ui-widget-enabled > .oo-ui-popupToolGroup-handle:focus {
-	border-right-color: var(--color-primary);
+	border-right-color: var( --color-primary );
 }
 
 .oo-ui-popupToolGroup.oo-ui-popupToolGroup-active > .oo-ui-popupToolGroup-handle {
-	background-color: var(--background-color-primary--hover);
-	color: var(--color-primary);
+	background-color: var( --background-color-primary--hover );
+	color: var( --color-primary );
 }
 
 .oo-ui-popupToolGroup.oo-ui-popupToolGroup-active > .oo-ui-popupToolGroup-handle:hover {
-	background-color: var(--background-color-primary--hover);
-	color: var(--color-primary);
+	background-color: var( --background-color-primary--hover );
+	color: var( --color-primary );
 }
 
 .oo-ui-popupToolGroup-tools .oo-ui-tool-active.oo-ui-widget-enabled .oo-ui-tool-link .oo-ui-tool-title {
-	color: var(--color-primary);
+	color: var( --color-primary );
 }
 
 .oo-ui-popupToolGroup-tools .oo-ui-tool.oo-ui-widget-enabled .oo-ui-tool-link:focus {
-	box-shadow: inset 0 0 0 2px var(--color-primary);
+	box-shadow: inset 0 0 0 2px var( --color-primary );
 }
 
 .oo-ui-popupToolGroup.oo-ui-flaggedElement-progressive > .oo-ui-popupToolGroup-handle {
-	color: var(--color-primary);
+	color: var( --color-primary );
 }
 
 .oo-ui-popupToolGroup.oo-ui-flaggedElement-progressive > .oo-ui-popupToolGroup-handle:hover {
-	background-color: var(--color-surface-2--hover);
+	background-color: var( --color-surface-2--hover );
 }
 
 .oo-ui-popupToolGroup.oo-ui-flaggedElement-progressive > .oo-ui-popupToolGroup-handle:focus {
-	box-shadow: inset 0 0 0 1px var(--color-primary);
-	outline: 1px solid var(--color-primary);
+	box-shadow: inset 0 0 0 1px var( --color-primary );
+	outline: 1px solid var( --color-primary );
 }
 
 .oo-ui-popupToolGroup.oo-ui-flaggedElement-progressive > .oo-ui-popupToolGroup-handle:active,
 .oo-ui-popupToolGroup.oo-ui-flaggedElement-progressive.oo-ui-tool-active > .oo-ui-popupToolGroup-handle,
 .oo-ui-popupToolGroup.oo-ui-flaggedElement-progressive.oo-ui-popupToolGroup-active > .oo-ui-popupToolGroup-handle {
-	background-color: var(--background-color-primary--hover);
-	color: var(--color-primary--active);
+	background-color: var( --background-color-primary--hover );
+	color: var( --color-primary--active );
 }
 
 .oo-ui-popupToolGroup.oo-ui-flaggedElement-destructive > .oo-ui-popupToolGroup-handle {
-	color: var(--color-destructive);
+	color: var( --color-destructive );
 }
 
 .oo-ui-popupToolGroup.oo-ui-flaggedElement-destructive > .oo-ui-popupToolGroup-handle:hover {
-	background-color: var(--background-color-quiet--hover);
+	background-color: var( --background-color-quiet--hover );
 }
 
 .oo-ui-popupToolGroup.oo-ui-flaggedElement-destructive > .oo-ui-popupToolGroup-handle:focus {
-	box-shadow: inset 0 0 0 1px var(--color-destructive);
-	outline: 1px solid var(--color-destructive);
+	box-shadow: inset 0 0 0 1px var( --color-destructive );
+	outline: 1px solid var( --color-destructive );
 }
 
 .oo-ui-popupToolGroup.oo-ui-flaggedElement-destructive > .oo-ui-popupToolGroup-handle:active,
 .oo-ui-popupToolGroup.oo-ui-flaggedElement-destructive.oo-ui-tool-active > .oo-ui-popupToolGroup-handle,
 .oo-ui-popupToolGroup.oo-ui-flaggedElement-destructive.oo-ui-popupToolGroup-active > .oo-ui-popupToolGroup-handle {
-	background-color: var(--background-color-quiet--active);
-	color: var(--color-destructive--active);
+	background-color: var( --background-color-quiet--active );
+	color: var( --color-destructive--active );
 }
 
 .oo-ui-popupToolGroup.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-popupToolGroup-handle {
-	background-color: var(--color-primary);
+	background-color: var( --color-primary );
 }
 
 .oo-ui-popupToolGroup.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-popupToolGroup-handle:hover {
-	background-color: var(--color-primary--hover);
+	background-color: var( --color-primary--hover );
 }
 
 .oo-ui-popupToolGroup.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-popupToolGroup-handle:focus {
-	box-shadow: inset 0 0 0 1px var(--color-primary), inset 0 0 0 2px #fff;
-	outline: 1px solid var(--color-primary);
+	box-shadow: inset 0 0 0 1px var( --color-primary ), inset 0 0 0 2px #fff;
+	outline: 1px solid var( --color-primary );
 }
 
 .oo-ui-popupToolGroup.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-popupToolGroup-handle:active,
 .oo-ui-popupToolGroup.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-tool-active > .oo-ui-popupToolGroup-handle {
-	background-color: var(--color-primary--active);
+	background-color: var( --color-primary--active );
 }
 
 .oo-ui-popupToolGroup.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-widget-disabled > .oo-ui-popupToolGroup-handle,
 .oo-ui-popupToolGroup.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive.oo-ui-widget-disabled > .oo-ui-popupToolGroup-handle:active {
-	background-color: var(--color-surface-4);
-	color: var(--color-base--subtle);
+	background-color: var( --color-surface-4 );
+	color: var( --color-base--subtle );
 }
 
 .oo-ui-popupToolGroup.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive > .oo-ui-popupToolGroup-handle {
-	background-color: var(--color-destructive);
+	background-color: var( --color-destructive );
 }
 
 .oo-ui-popupToolGroup.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive > .oo-ui-popupToolGroup-handle:hover {
-	background-color: var(--color-destructive--hover);
+	background-color: var( --color-destructive--hover );
 }
 
 .oo-ui-popupToolGroup.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive > .oo-ui-popupToolGroup-handle:focus {
-	box-shadow: inset 0 0 0 1px var(--color-destructive), inset 0 0 0 2px #fff;
-	outline: 1px solid var(--color-destructive);
+	box-shadow: inset 0 0 0 1px var( --color-destructive ), inset 0 0 0 2px #fff;
+	outline: 1px solid var( --color-destructive );
 }
 
 .oo-ui-popupToolGroup.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive > .oo-ui-popupToolGroup-handle:active,
 .oo-ui-popupToolGroup.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive.oo-ui-tool-active > .oo-ui-popupToolGroup-handle {
-	background-color: var(--color-destructive--active);
+	background-color: var( --color-destructive--active );
 }
 
 .oo-ui-popupToolGroup.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive.oo-ui-widget-disabled > .oo-ui-popupToolGroup-handle,
 .oo-ui-popupToolGroup.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-destructive.oo-ui-widget-disabled > .oo-ui-popupToolGroup-handle:active {
-	background-color: var(--color-surface-4);
-	color: var(--color-base--subtle);
+	background-color: var( --color-surface-4 );
+	color: var( --color-base--subtle );
 }
 
 .oo-ui-listToolGroup-tools .oo-ui-tool.oo-ui-widget-enabled:hover {
-	background-color: var(--background-color-quiet--hover);
-	color: var(--color-base--emphasized);
+	background-color: var( --background-color-quiet--hover );
+	color: var( --color-base--emphasized );
 }
 
 .oo-ui-listToolGroup-tools .oo-ui-tool-active.oo-ui-widget-enabled {
-	background-color: var(--background-color-primary--hover);
+	background-color: var( --background-color-primary--hover );
 }
 
 .oo-ui-listToolGroup-tools .oo-ui-tool-active.oo-ui-widget-enabled:hover {
-	background-color: var(--background-color-primary--hover);
+	background-color: var( --background-color-primary--hover );
 }
 
 .oo-ui-listToolGroup-tools .oo-ui-tool-active.oo-ui-widget-enabled .oo-ui-tool-link .oo-ui-tool-title {
-	color: var(--color-primary);
+	color: var( --color-primary );
 }
 
 .oo-ui-listToolGroup-tools .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-title {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .oo-ui-listToolGroup-tools .oo-ui-tool.oo-ui-widget-disabled .oo-ui-indicatorElement-indicator,
 .oo-ui-listToolGroup-tools .oo-ui-tool.oo-ui-widget-disabled .oo-ui-iconElement-icon {
-	opacity: var(--opacity-base--disabled);
+	opacity: var( --opacity-base--disabled );
 }
 
 .oo-ui-listToolGroup.oo-ui-widget-disabled {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .oo-ui-listToolGroup.oo-ui-widget-disabled .oo-ui-indicatorElement-indicator,
 .oo-ui-listToolGroup.oo-ui-widget-disabled .oo-ui-iconElement-icon {
-	opacity: var(--opacity-base--disabled);
+	opacity: var( --opacity-base--disabled );
 }
 
 .oo-ui-menuToolGroup {
-	border-right: 1px solid var(--border-color-base);
-	border-left: 1px solid var(--border-color-base);
+	border-right: 1px solid var( --border-color-base );
+	border-left: 1px solid var( --border-color-base );
 }
 
 .oo-ui-menuToolGroup-tools .oo-ui-tool.oo-ui-widget-enabled:hover {
-	background-color: var(--background-color-primary--hover);
+	background-color: var( --background-color-primary--hover );
 }
 
 .oo-ui-menuToolGroup-tools .oo-ui-tool.oo-ui-tool-active {
-	background-color: var(--background-color-primary--hover);
+	background-color: var( --background-color-primary--hover );
 }
 
 .oo-ui-menuToolGroup.oo-ui-widget-disabled,
 .oo-ui-menuToolGroup-tools .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-title {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .oo-ui-toolbar-bar {
-	background-color: var(--color-surface-1);
-	color: var(--color-base);
+	background-color: var( --color-surface-1 );
+	color: var( --color-base );
 }
 
 .oo-ui-toolbar-position-top > .oo-ui-toolbar-bar {
-	border-bottom: 1px solid var(--border-color-base);
+	border-bottom: 1px solid var( --border-color-base );
 }
 
 .oo-ui-toolbar-position-bottom > .oo-ui-toolbar-bar {
-	border-top: 1px solid var(--border-color-base);
+	border-top: 1px solid var( --border-color-base );
 }
 
 .oo-ui-toolbar-narrow.oo-ui-toolbar-position-top .oo-ui-toolbar-bar::after {
-	border-bottom: 1px solid var(--border-color-base);
+	border-bottom: 1px solid var( --border-color-base );
 }
 
 .oo-ui-toolbar-narrow.oo-ui-toolbar-position-bottom .oo-ui-toolbar-bar::after {
-	border-top: 1px solid var(--border-color-base);
+	border-top: 1px solid var( --border-color-base );
 }
diff --git a/skinStyles/ooui/oojs-ui-widgets.less b/skinStyles/ooui/oojs-ui-widgets.less
index 35a42bfc..7847f937 100644
--- a/skinStyles/ooui/oojs-ui-widgets.less
+++ b/skinStyles/ooui/oojs-ui-widgets.less
@@ -9,114 +9,114 @@
 */
 
 .oo-ui-bookletLayout-outlinePanel > .oo-ui-outlineControlsWidget {
-	border-top-color: var(--border-color-base);
+	border-top-color: var( --border-color-base );
 }
 
 .oo-ui-bookletLayout > .oo-ui-menuLayout-menu {
-	border-right-color: var(--border-color-base);
+	border-right-color: var( --border-color-base );
 }
 
 .oo-ui-buttonSelectWidget {
-	border-radius: var(--border-radius--small);
+	border-radius: var( --border-radius--small );
 }
 
 .oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget:first-child .oo-ui-buttonElement-button {
-	border-bottom-left-radius: var(--border-radius--small);
-	border-top-left-radius: var(--border-radius--small);
+	border-bottom-left-radius: var( --border-radius--small );
+	border-top-left-radius: var( --border-radius--small );
 }
 
 .oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget:last-child .oo-ui-buttonElement-button {
-	border-bottom-right-radius: var(--border-radius--small);
-	border-top-right-radius: var(--border-radius--small);
+	border-bottom-right-radius: var( --border-radius--small );
+	border-top-right-radius: var( --border-radius--small );
 }
 
 .oo-ui-buttonSelectWidget .oo-ui-buttonOptionWidget.oo-ui-widget-disabled + .oo-ui-widget-disabled > .oo-ui-buttonElement-button {
-	border-left-color: var(--border-color-base);
+	border-left-color: var( --border-color-base );
 }
 
 .oo-ui-buttonSelectWidget.oo-ui-widget-enabled:focus .oo-ui-buttonOptionWidget.oo-ui-optionWidget-selected .oo-ui-buttonElement-button {
-	border-color: var(--color-primary);
-	box-shadow: inset 0 0 0 1px var(--color-primary), inset 0 0 0 2px #fff;
+	border-color: var( --color-primary );
+	box-shadow: inset 0 0 0 1px var( --color-primary ), inset 0 0 0 2px #fff;
 }
 
 .oo-ui-toggleButtonWidget.oo-ui-widget-enabled.oo-ui-buttonElement-frameless.oo-ui-toggleWidget-on .oo-ui-buttonElement-button {
-	background-color: var(--background-color-primary--active);
-	color: var(--color-base--emphasized);
+	background-color: var( --background-color-primary--active );
+	color: var( --color-base--emphasized );
 }
 
 .oo-ui-toggleSwitchWidget {
-	border-color: var(--border-color-base--darker);
+	border-color: var( --border-color-base--darker );
 	// Show background when hovered
 	background-color: transparent;
 }
 
 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled .oo-ui-toggleSwitchWidget-grip {
-	border-color: var(--border-color-base--darker);
+	border-color: var( --border-color-base--darker );
 	// Show background when hovered
 	background-color: transparent;
 }
 
 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:hover {
-	border-color: var(--color-primary--hover);
-	background-color: var(--color-surface-0);
+	border-color: var( --color-primary--hover );
+	background-color: var( --color-surface-0 );
 }
 
 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:hover .oo-ui-toggleSwitchWidget-grip {
-	border-color: var(--color-primary--hover);
-	background-color: var(--color-surface-0);
+	border-color: var( --color-primary--hover );
+	background-color: var( --color-surface-0 );
 }
 
 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:active,
 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:active:hover,
 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:active:focus {
-	border-color: var(--color-primary--active);
-	background-color: var(--color-primary--active);
-	box-shadow: inset 0 0 0 1px var(--color-primary--active);
+	border-color: var( --color-primary--active );
+	background-color: var( --color-primary--active );
+	box-shadow: inset 0 0 0 1px var( --color-primary--active );
 }
 
 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:focus {
-	border-color: var(--color-primary);
-	box-shadow: inset 0 0 0 1px var(--color-primary);
+	border-color: var( --color-primary );
+	box-shadow: inset 0 0 0 1px var( --color-primary );
 }
 
 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled:focus .oo-ui-toggleSwitchWidget-grip {
-	border-color: var(--color-primary);
+	border-color: var( --color-primary );
 }
 
 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on {
-	border-color: var(--color-primary);
-	background-color: var(--color-primary);
+	border-color: var( --color-primary );
+	background-color: var( --color-primary );
 }
 
 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on:hover {
-	border-color: var(--color-primary--hover);
-	background-color: var(--color-primary--hover);
+	border-color: var( --color-primary--hover );
+	background-color: var( --color-primary--hover );
 }
 
 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on:active,
 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on:active:hover {
-	border-color: var(--color-primary--active);
-	background-color: var(--color-primary--active);
+	border-color: var( --color-primary--active );
+	background-color: var( --color-primary--active );
 }
 
 .oo-ui-toggleSwitchWidget.oo-ui-widget-enabled.oo-ui-toggleWidget-on:focus {
-	border-color: var(--color-primary);
+	border-color: var( --color-primary );
 }
 
 .oo-ui-toggleSwitchWidget.oo-ui-widget-disabled {
-	border-color: var(--color-surface-4);
-	background-color: var(--color-surface-4);
+	border-color: var( --color-surface-4 );
+	background-color: var( --color-surface-4 );
 }
 
 .oo-ui-toggleSwitchWidget.oo-ui-widget-disabled.oo-ui-toggleWidget-off .oo-ui-toggleSwitchWidget-grip {
-	border-color: var(--color-base--subtle);
-	box-shadow: inset 0 0 0 1px var(--color-base--subtle);
+	border-color: var( --color-base--subtle );
+	box-shadow: inset 0 0 0 1px var( --color-base--subtle );
 }
 
 .oo-ui-selectFileWidget-dropTarget {
-	border-color: var(--border-color-base);
-	border-radius: var(--border-radius--small);
-	background-color: var(--color-surface-1);
+	border-color: var( --border-color-base );
+	border-radius: var( --border-radius--small );
+	background-color: var( --color-surface-1 );
 }
 
 .oo-ui-selectFileWidget.oo-ui-widget-enabled.oo-ui-selectFileWidget-dropTarget {
@@ -125,221 +125,221 @@
 }
 
 .oo-ui-selectFileWidget.oo-ui-widget-enabled.oo-ui-selectFileWidget-dropTarget:hover {
-	border-color: var(--color-primary--hover);
-	background-color: var(--color-surface-1);
+	border-color: var( --color-primary--hover );
+	background-color: var( --color-surface-1 );
 }
 
 .oo-ui-selectFileWidget.oo-ui-widget-enabled.oo-ui-selectFileWidget-canDrop.oo-ui-selectFileWidget-dropTarget,
 .oo-ui-selectFileWidget.oo-ui-widget-enabled.oo-ui-selectFileWidget-canDrop .oo-ui-selectFileInputWidget-info > .oo-ui-inputWidget-input {
-	background-color: var(--background-color-primary--hover);
-	color: var(--color-primary--active);
+	background-color: var( --background-color-primary--hover );
+	color: var( --color-primary--active );
 }
 
 .oo-ui-selectFileWidget.oo-ui-widget-disabled.oo-ui-selectFileWidget-dropTarget,
 .oo-ui-selectFileWidget.oo-ui-selectFileInputWidget-empty.oo-ui-widget-disabled.oo-ui-selectFileWidget-dropTarget {
-	border-color: var(--color-surface-4);
-	background-color: var(--color-surface-4);
+	border-color: var( --color-surface-4 );
+	background-color: var( --color-surface-4 );
 }
 
 .oo-ui-outlineSelectWidget:focus {
-	box-shadow: inset 0 0 0 2px var(--color-primary);
+	box-shadow: inset 0 0 0 2px var( --color-primary );
 }
 
 .oo-ui-outlineOptionWidget.oo-ui-optionWidget-highlighted {
-	background-color: var(--color-surface-2--hover);
-	color: var(--color-base--emphasized);
+	background-color: var( --color-surface-2--hover );
+	color: var( --color-base--emphasized );
 }
 
 .oo-ui-outlineOptionWidget.oo-ui-optionWidget-selected {
-	background-color: var(--background-color-primary--hover);
-	color: var(--color-primary);
+	background-color: var( --background-color-primary--hover );
+	color: var( --color-primary );
 }
 
 .oo-ui-outlineOptionWidget.oo-ui-optionWidget-pressed {
-	background-color: var(--background-color-primary--active);
-	color: var(--color-primary);
+	background-color: var( --background-color-primary--active );
+	color: var( --color-primary );
 }
 
 .oo-ui-outlineControlsWidget {
-	background-color: var(--color-surface-1);
+	background-color: var( --color-surface-1 );
 }
 
 .oo-ui-tabSelectWidget-framed {
-	background-color: var(--color-surface-3);
+	background-color: var( --color-surface-3 );
 }
 
 .oo-ui-tabSelectWidget-frameless {
-	box-shadow: inset 0 -1px 0 0 var(--border-color-base);
+	box-shadow: inset 0 -1px 0 0 var( --border-color-base );
 }
 
 .oo-ui-tabOptionWidget {
-	color: var(--color-base);
-	font-weight: var(--font-weight-medium);
+	color: var( --color-base );
+	font-weight: var( --font-weight-medium );
 }
 
 .oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget {
-	border-top-left-radius: var(--border-radius--small);
-	border-top-right-radius: var(--border-radius--small);
+	border-top-left-radius: var( --border-radius--small );
+	border-top-right-radius: var( --border-radius--small );
 }
 
 .oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected {
-	background-color: var(--color-surface-0);
-	color: var(--color-base--emphasized);
+	background-color: var( --color-surface-0 );
+	color: var( --color-base--emphasized );
 }
 
 .oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected .oo-ui-labelElement-label {
-	border-bottom-color: var(--color-surface-0);
+	border-bottom-color: var( --color-surface-0 );
 }
 
 .oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-widget-enabled:hover {
-	background-color: var(--background-color-quiet--hover);
-	color: var(--color-base--emphasized);
+	background-color: var( --background-color-quiet--hover );
+	color: var( --color-base--emphasized );
 }
 
 .oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-widget-enabled:active {
-	background-color: var(--background-color-quiet--active);
-	color: var(--color-base--emphasized);
+	background-color: var( --background-color-quiet--active );
+	color: var( --color-base--emphasized );
 }
 
 .oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-widget-enabled.oo-ui-optionWidget-selected:hover {
-	background-color: var(--color-surface-0);
+	background-color: var( --color-surface-0 );
 }
 
 .oo-ui-tabSelectWidget-framed.oo-ui-widget-enabled:focus .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected .oo-ui-labelElement-label {
-	border-bottom-color: var(--color-primary);
+	border-bottom-color: var( --color-primary );
 }
 
 .oo-ui-tabSelectWidget-frameless .oo-ui-tabOptionWidget {
-	box-shadow: inset 0 0 0 0 var(--color-primary);
+	box-shadow: inset 0 0 0 0 var( --color-primary );
 }
 
 .oo-ui-tabSelectWidget-frameless .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected {
-	box-shadow: inset 0 -2px 0 0 var(--color-primary);
-	color: var(--color-primary);
+	box-shadow: inset 0 -2px 0 0 var( --color-primary );
+	color: var( --color-primary );
 }
 
 .oo-ui-tabSelectWidget-frameless .oo-ui-tabOptionWidget.oo-ui-widget-enabled:hover {
-	box-shadow: inset 0 -2px 0 0 var(--color-primary--hover);
-	color: var(--color-primary--hover);
+	box-shadow: inset 0 -2px 0 0 var( --color-primary--hover );
+	color: var( --color-primary--hover );
 }
 
 .oo-ui-tabSelectWidget-frameless .oo-ui-tabOptionWidget.oo-ui-widget-enabled:active {
-	box-shadow: inset 0 -2px 0 0 var(--color-primary--active);
-	color: var(--color-primary--active);
+	box-shadow: inset 0 -2px 0 0 var( --color-primary--active );
+	color: var( --color-primary--active );
 }
 
 .oo-ui-tabSelectWidget-frameless.oo-ui-widget-enabled:focus .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected {
-	border-radius: var(--border-radius--small);
-	box-shadow: inset 0 0 0 2px var(--color-primary);
+	border-radius: var( --border-radius--small );
+	box-shadow: inset 0 0 0 2px var( --color-primary );
 }
 
 .oo-ui-tagMultiselectWidget-handle {
-	border-color: var(--border-color-base);
-	border-radius: var(--border-radius--small);
+	border-color: var( --border-color-base );
+	border-radius: var( --border-radius--small );
 }
 
 .oo-ui-tagMultiselectWidget-handle > .oo-ui-tagMultiselectWidget-content > input {
-	color: var(--color-base--emphasized);
+	color: var( --color-base--emphasized );
 }
 
 .oo-ui-tagMultiselectWidget-handle > .oo-ui-tagMultiselectWidget-content > input::placeholder {
-	color: var(--color-base--subtle);
+	color: var( --color-base--subtle );
 }
 
 .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled {
-	background-color: var(--color-surface-1);
+	background-color: var( --color-surface-1 );
 }
 
 .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-inlined:hover .oo-ui-tagMultiselectWidget-handle {
-	border-color: var(--color-base--subtle);
+	border-color: var( --color-base--subtle );
 }
 
 .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-inlined.oo-ui-tagMultiselectWidget-focus .oo-ui-tagMultiselectWidget-handle {
-	border-color: var(--color-primary);
-	box-shadow: inset 0 0 0 1px var(--color-primary);
+	border-color: var( --color-primary );
+	box-shadow: inset 0 0 0 1px var( --color-primary );
 }
 
 .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-inlined.oo-ui-flaggedElement-invalid .oo-ui-tagMultiselectWidget-handle,
 .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-inlined.oo-ui-flaggedElement-invalid:hover .oo-ui-tagMultiselectWidget-handle {
-	border-color: var(--color-destructive);
+	border-color: var( --color-destructive );
 }
 
 .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined {
-	background-color: var(--color-surface-2);
+	background-color: var( --color-surface-2 );
 }
 
 .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined .oo-ui-tagItemWidget.oo-ui-widget-enabled {
-	background-color: var(--color-surface-2--hover);
+	background-color: var( --color-surface-2--hover );
 }
 
 .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined.oo-ui-flaggedElement-invalid .oo-ui-inputWidget-input {
-	border-color: var(--color-destructive);
+	border-color: var( --color-destructive );
 }
 
 .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid .oo-ui-inputWidget-input {
-	color: var(--color-destructive);
+	color: var( --color-destructive );
 }
 
 .oo-ui-tagMultiselectWidget.oo-ui-widget-disabled .oo-ui-tagMultiselectWidget-handle {
-	border-color: var(--color-surface-4);
-	background-color: var(--color-surface-3);
-	color: var(--color-base--subtle);
+	border-color: var( --color-surface-4 );
+	background-color: var( --color-surface-3 );
+	color: var( --color-base--subtle );
 	text-shadow: none;
 }
 
 .oo-ui-tagItemWidget {
-	border-color: var(--border-color-base);
+	border-color: var( --border-color-base );
 }
 
 .oo-ui-tagItemWidget.oo-ui-widget-enabled {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .oo-ui-tagItemWidget.oo-ui-widget-enabled:hover {
-	border-color: var(--border-color-base);
-	background-color: var(--color-surface-2--hover);
-	color: var(--color-base);
+	border-color: var( --border-color-base );
+	background-color: var( --color-surface-2--hover );
+	color: var( --color-base );
 }
 
 .oo-ui-tagItemWidget.oo-ui-widget-enabled:focus {
-	border-color: var(--color-primary);
-	box-shadow: inset 0 0 0 1px var(--color-primary);
+	border-color: var( --color-primary );
+	box-shadow: inset 0 0 0 1px var( --color-primary );
 }
 
-.oo-ui-tagItemWidget.oo-ui-widget-enabled:not(.oo-ui-tagItemWidget-fixed) {
-	background-color: var(--color-surface-2);
+.oo-ui-tagItemWidget.oo-ui-widget-enabled:not( .oo-ui-tagItemWidget-fixed ) {
+	background-color: var( --color-surface-2 );
 }
 
 .oo-ui-tagItemWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid {
-	border-color: var(--color-destructive);
+	border-color: var( --color-destructive );
 }
 
 .oo-ui-tagItemWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid:hover {
-	border-color: var(--color-destructive);
+	border-color: var( --color-destructive );
 }
 
 .oo-ui-tagItemWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-invalid:focus {
-	border-color: var(--color-destructive);
-	box-shadow: inset 0 0 0 1px var(--color-destructive);
+	border-color: var( --color-destructive );
+	box-shadow: inset 0 0 0 1px var( --color-destructive );
 }
 
 .oo-ui-tagItemWidget.oo-ui-widget-enabled .oo-ui-buttonElement-button:hover {
-	background-color: var(--color-surface-2--hover);
+	background-color: var( --color-surface-2--hover );
 }
 
 .oo-ui-tagItemWidget.oo-ui-widget-enabled .oo-ui-buttonElement-button:active {
-	background-color: var(--color-surface-2--active);
+	background-color: var( --color-surface-2--active );
 }
 
 .oo-ui-tagItemWidget.oo-ui-widget-disabled {
-	border-color: var(--color-surface-4);
-	background-color: var(--color-surface-3);
-	color: var(--color-base--subtle);
+	border-color: var( --color-surface-4 );
+	background-color: var( --color-surface-3 );
+	color: var( --color-base--subtle );
 	text-shadow: none;
 }
 
 .oo-ui-searchWidget-query {
-	border-bottom: 1px solid var(--border-color-base);
+	border-bottom: 1px solid var( --border-color-base );
 }
 
 // Fix Special:Contribs
diff --git a/skinStyles/ooui/oojs-ui-windows.less b/skinStyles/ooui/oojs-ui-windows.less
index e9c855f2..06831c62 100644
--- a/skinStyles/ooui/oojs-ui-windows.less
+++ b/skinStyles/ooui/oojs-ui-windows.less
@@ -20,119 +20,119 @@
 }
 
 .oo-ui-messageDialog-content > .oo-ui-window-foot {
-	outline: 1px solid var(--border-color-base);
+	outline: 1px solid var( --border-color-base );
 }
 
 .oo-ui-messageDialog-title {
-	color: var(--color-base--emphasized);
+	color: var( --color-base--emphasized );
 }
 
 .oo-ui-messageDialog-message {
-	color: var(--color-base);
+	color: var( --color-base );
 }
 
 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-progressive .oo-ui-buttonElement-button:active {
-	background-color: var(--background-color-primary--hover);
+	background-color: var( --background-color-primary--hover );
 }
 
 .oo-ui-messageDialog-actions .oo-ui-actionWidget.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive .oo-ui-buttonElement-button:active {
-	background-color: var(--background-color-destructive);
+	background-color: var( --background-color-destructive );
 }
 
 .oo-ui-messageDialog-actions-horizontal .oo-ui-actionWidget {
-	border-right-color: var(--border-color-base);
+	border-right-color: var( --border-color-base );
 }
 
 .oo-ui-messageDialog-actions-horizontal .oo-ui-actionWidget:first-child > .oo-ui-buttonElement-button {
-	border-radius: 0 0 0 var(--border-radius--small);
+	border-radius: 0 0 0 var( --border-radius--small );
 }
 
 .oo-ui-messageDialog-actions-horizontal .oo-ui-actionWidget:last-child > .oo-ui-buttonElement-button {
-	border-radius: 0 0 var(--border-radius--small) 0;
+	border-radius: 0 0 var( --border-radius--small ) 0;
 }
 
 .oo-ui-messageDialog-actions-horizontal .oo-ui-actionWidget:only-child > .oo-ui-buttonElement-button {
-	border-radius: 0 0 var(--border-radius--small) var(--border-radius--small);
+	border-radius: 0 0 var( --border-radius--small ) var( --border-radius--small );
 }
 
 .oo-ui-messageDialog-actions-vertical .oo-ui-actionWidget {
-	border-bottom-color: var(--border-color-base);
+	border-bottom-color: var( --border-color-base );
 }
 
 .oo-ui-messageDialog-actions-vertical .oo-ui-actionWidget:last-child > .oo-ui-buttonElement-button {
-	border-radius: 0 0 var(--border-radius--small) var(--border-radius--small);
+	border-radius: 0 0 var( --border-radius--small ) var( --border-radius--small );
 }
 
 .oo-ui-processDialog-content .oo-ui-window-head,
 .oo-ui-processDialog-content .oo-ui-window-foot {
-	outline: 1px solid var(--border-color-base);
+	outline: 1px solid var( --border-color-base );
 }
 
-.oo-ui-processDialog .oo-ui-actionWidget:not(.oo-ui-flaggedElement-progressive, .oo-ui-flaggedElement-destructive) > .oo-ui-buttonElement-button:hover,
-.oo-ui-processDialog .oo-ui-actionWidget:not(.oo-ui-flaggedElement-progressive, .oo-ui-flaggedElement-destructive) > .oo-ui-buttonElement-button:active {
-	border-right-color: var(--border-color-base);
+.oo-ui-processDialog .oo-ui-actionWidget:not( .oo-ui-flaggedElement-progressive, .oo-ui-flaggedElement-destructive ) > .oo-ui-buttonElement-button:hover,
+.oo-ui-processDialog .oo-ui-actionWidget:not( .oo-ui-flaggedElement-progressive, .oo-ui-flaggedElement-destructive ) > .oo-ui-buttonElement-button:active {
+	border-right-color: var( --border-color-base );
 }
 
-.oo-ui-processDialog .oo-ui-actionWidget:not(.oo-ui-flaggedElement-progressive, .oo-ui-flaggedElement-destructive) > .oo-ui-buttonElement-button:focus {
-	border-color: var(--color-primary);
+.oo-ui-processDialog .oo-ui-actionWidget:not( .oo-ui-flaggedElement-progressive, .oo-ui-flaggedElement-destructive ) > .oo-ui-buttonElement-button:focus {
+	border-color: var( --color-primary );
 }
 
 .oo-ui-processDialog-actions-primary .oo-ui-actionWidget > .oo-ui-buttonElement-button {
-	border-left-color: var(--border-color-base);
+	border-left-color: var( --border-color-base );
 }
 
-.oo-ui-processDialog-actions-primary .oo-ui-actionWidget:not(.oo-ui-flaggedElement-progressive, .oo-ui-flaggedElement-destructive) > .oo-ui-buttonElement-button:hover,
-.oo-ui-processDialog-actions-primary .oo-ui-actionWidget:not(.oo-ui-flaggedElement-progressive, .oo-ui-flaggedElement-destructive) > .oo-ui-buttonElement-button:active {
-	border-left-color: var(--border-color-base);
+.oo-ui-processDialog-actions-primary .oo-ui-actionWidget:not( .oo-ui-flaggedElement-progressive, .oo-ui-flaggedElement-destructive ) > .oo-ui-buttonElement-button:hover,
+.oo-ui-processDialog-actions-primary .oo-ui-actionWidget:not( .oo-ui-flaggedElement-progressive, .oo-ui-flaggedElement-destructive ) > .oo-ui-buttonElement-button:active {
+	border-left-color: var( --border-color-base );
 }
 
-.oo-ui-processDialog-actions-primary .oo-ui-actionWidget:not(.oo-ui-flaggedElement-progressive, .oo-ui-flaggedElement-destructive) > .oo-ui-buttonElement-button:focus {
-	border-color: var(--color-primary);
+.oo-ui-processDialog-actions-primary .oo-ui-actionWidget:not( .oo-ui-flaggedElement-progressive, .oo-ui-flaggedElement-destructive ) > .oo-ui-buttonElement-button:focus {
+	border-color: var( --color-primary );
 }
 
 .oo-ui-processDialog-actions-safe .oo-ui-actionWidget > .oo-ui-buttonElement-button,
 .oo-ui-processDialog-actions-other .oo-ui-actionWidget > .oo-ui-buttonElement-button {
-	border-right-color: var(--border-color-base);
+	border-right-color: var( --border-color-base );
 }
 
-.oo-ui-processDialog-actions-safe .oo-ui-widget-enabled.oo-ui-iconElement:not(.oo-ui-labelElement) > .oo-ui-buttonElement-button {
+.oo-ui-processDialog-actions-safe .oo-ui-widget-enabled.oo-ui-iconElement:not( .oo-ui-labelElement ) > .oo-ui-buttonElement-button {
 	border-right-color: transparent;
 	background-color: transparent;
 }
 
-.oo-ui-processDialog-actions-safe .oo-ui-widget-enabled.oo-ui-iconElement:not(.oo-ui-labelElement) > .oo-ui-buttonElement-button:hover {
-	border-right-color: var(--border-color-base);
-	background-color: var(--color-surface-2);
+.oo-ui-processDialog-actions-safe .oo-ui-widget-enabled.oo-ui-iconElement:not( .oo-ui-labelElement ) > .oo-ui-buttonElement-button:hover {
+	border-right-color: var( --border-color-base );
+	background-color: var( --color-surface-2 );
 }
 
-.oo-ui-processDialog-actions-safe .oo-ui-widget-enabled.oo-ui-iconElement:not(.oo-ui-labelElement) > .oo-ui-buttonElement-button:active {
-	border-right-color: var(--color-surface-2--active);
-	background-color: var(--color-surface-2--active);
+.oo-ui-processDialog-actions-safe .oo-ui-widget-enabled.oo-ui-iconElement:not( .oo-ui-labelElement ) > .oo-ui-buttonElement-button:active {
+	border-right-color: var( --color-surface-2--active );
+	background-color: var( --color-surface-2--active );
 }
 
-.oo-ui-processDialog-actions-safe .oo-ui-widget-enabled.oo-ui-iconElement:not(.oo-ui-labelElement) > .oo-ui-buttonElement-button:focus {
-	border-color: var(--color-primary);
+.oo-ui-processDialog-actions-safe .oo-ui-widget-enabled.oo-ui-iconElement:not( .oo-ui-labelElement ) > .oo-ui-buttonElement-button:focus {
+	border-color: var( --color-primary );
 }
 
 .oo-ui-processDialog-errors {
-	background-color: var(--background-color-overlay);
+	background-color: var( --background-color-overlay );
 }
 
 .oo-ui-processDialog-errors-title {
-	color: var(--color-base--emphasized);
+	color: var( --color-base--emphasized );
 }
 
 .oo-ui-windowManager-modal > .oo-ui-dialog {
 	z-index: @z-index-overlay;
-	background-color: var(--background-color-overlay--lighter);
+	background-color: var( --background-color-overlay--lighter );
 }
 
 .oo-ui-windowManager-modal > .oo-ui-dialog > .oo-ui-window-frame {
-	background-color: var(--color-surface-1);
+	background-color: var( --color-surface-1 );
 }
 
 .oo-ui-windowManager-modal.oo-ui-windowManager-floating > .oo-ui-dialog > .oo-ui-window-frame {
-	border-color: var(--border-color-base);
-	border-radius: var(--border-radius--medium);
-	box-shadow: var(--box-shadow-dialog);
+	border-color: var( --border-color-base );
+	border-radius: var( --border-radius--medium );
+	box-shadow: var( --box-shadow-dialog );
 }