diff --git a/app/components/InfoPopover.module.css b/app/components/InfoPopover.module.css
index 4fcbea798..d56d2ad05 100644
--- a/app/components/InfoPopover.module.css
+++ b/app/components/InfoPopover.module.css
@@ -5,8 +5,8 @@
 	color: var(--color-text);
 	font-size: var(--font-md);
 	padding: var(--s-0-5);
-	width: calc(var(--field-size) * 0.7);
-	height: calc(var(--field-size) * 0.7);
+	width: var(--selector-size);
+	height: var(--selector-size);
 	display: flex;
 	align-items: center;
 	justify-content: center;
@@ -18,7 +18,7 @@
 }
 
 .triggerTiny {
-	width: var(--field-size-xs);
-	height: var(--field-size-xs);
+	width: var(--selector-size-sm);
+	height: var(--selector-size-sm);
 	font-size: var(--font-xs);
 }
diff --git a/app/components/SideNav.module.css b/app/components/SideNav.module.css
index b8cf44fd2..e873a5c01 100644
--- a/app/components/SideNav.module.css
+++ b/app/components/SideNav.module.css
@@ -46,7 +46,7 @@
 	display: flex;
 	align-items: center;
 	gap: var(--s-1);
-	padding: var(--s-1-5) var(--s-2-5);
+	padding: var(--s-1-5) var(--s-3);
 	background-color: var(--color-bg-high);
 	border-top: 1.5px solid var(--color-border);
 	flex-shrink: 0;
@@ -152,7 +152,7 @@
 	display: flex;
 	align-items: center;
 	gap: var(--s-2);
-	padding: var(--s-1-5) var(--s-2-5);
+	padding: var(--s-1-5) var(--s-3);
 	text-decoration: none;
 	color: var(--color-text);
 	border-top: 1.5px solid var(--color-border);
diff --git a/app/components/Table.module.css b/app/components/Table.module.css
index 840031117..d36329d2c 100644
--- a/app/components/Table.module.css
+++ b/app/components/Table.module.css
@@ -25,7 +25,7 @@
 	}
 
 	& > tbody > tr > td {
-		padding: var(--s-2) var(--s-2-5);
+		padding: var(--s-2) var(--s-3);
 	}
 
 	& tr:first-child td {
diff --git a/app/components/elements/Menu.module.css b/app/components/elements/Menu.module.css
index d3a899eba..e716c7ae4 100644
--- a/app/components/elements/Menu.module.css
+++ b/app/components/elements/Menu.module.css
@@ -36,7 +36,7 @@
 	white-space: nowrap;
 	gap: var(--s-2);
 	border-radius: var(--radius-field);
-	padding: var(--s-1-5) var(--s-2-5);
+	padding: var(--s-1-5) var(--s-3);
 	background-color: var(--color-bg-high);
 	width: 100%;
 	border: 0;
diff --git a/app/components/elements/Select.module.css b/app/components/elements/Select.module.css
index 2dc6bfbeb..a10ad5906 100644
--- a/app/components/elements/Select.module.css
+++ b/app/components/elements/Select.module.css
@@ -28,6 +28,7 @@
 }
 
 .selectValue {
+	font-size: var(--font-sm);
 	overflow: hidden;
 	text-overflow: ellipsis;
 	white-space: nowrap;
@@ -109,7 +110,7 @@
 
 .searchInput {
 	all: unset;
-	font-size: var(--font-2xs);
+	font-size: var(--font-xs);
 	font-weight: var(--weight-semi);
 	letter-spacing: 0.5px;
 	flex: 1;
@@ -172,7 +173,7 @@
 	color: var(--color-text-high);
 	text-transform: uppercase;
 	font-size: var(--font-2xs);
-	padding-block-start: var(--s-2-5);
+	padding-block-start: var(--s-3);
 	padding-block-end: var(--s-1);
 	padding-inline: var(--s-1-5);
 	white-space: nowrap;
diff --git a/app/components/layout/Footer.module.css b/app/components/layout/Footer.module.css
index 3e945a861..2a4d2fe90 100644
--- a/app/components/layout/Footer.module.css
+++ b/app/components/layout/Footer.module.css
@@ -1,7 +1,7 @@
 .footer {
 	display: flex;
 	flex-direction: column;
-	padding: var(--s-2-5);
+	padding: var(--s-3);
 	background-color: var(--color-bg-high);
 	gap: var(--s-6);
 	margin-block-start: auto;
diff --git a/app/features/badges/badges.module.css b/app/features/badges/badges.module.css
index 946684aaa..e2d850e82 100644
--- a/app/features/badges/badges.module.css
+++ b/app/features/badges/badges.module.css
@@ -79,7 +79,7 @@
 	font-size: var(--font-xs);
 	font-weight: var(--weight-semi);
 	gap: var(--s-2);
-	padding-block-end: var(--s-2-5);
+	padding-block-end: var(--s-3);
 }
 
 .editNumberInput {
diff --git a/app/features/badges/components/BadgeDisplay.module.css b/app/features/badges/components/BadgeDisplay.module.css
index 4a8f2de3c..d9e3fd3dc 100644
--- a/app/features/badges/components/BadgeDisplay.module.css
+++ b/app/features/badges/components/BadgeDisplay.module.css
@@ -48,7 +48,7 @@
 .pagination {
 	display: flex;
 	flex-wrap: wrap;
-	gap: var(--s-2-5);
+	gap: var(--s-3);
 	justify-content: center;
 	align-items: center;
 	max-width: 20rem;
diff --git a/app/features/builds/components/FilterSection.module.css b/app/features/builds/components/FilterSection.module.css
index 909921a77..99541ea6b 100644
--- a/app/features/builds/components/FilterSection.module.css
+++ b/app/features/builds/components/FilterSection.module.css
@@ -1,7 +1,7 @@
 .filter {
 	display: flex;
 	flex-direction: column;
-	padding: var(--s-2-5);
+	padding: var(--s-3);
 	border-radius: var(--radius-box);
 	background-color: var(--color-bg-high);
 	gap: var(--s-2);
diff --git a/app/features/builds/routes/builds.module.css b/app/features/builds/routes/builds.module.css
index 8ea428620..24743c802 100644
--- a/app/features/builds/routes/builds.module.css
+++ b/app/features/builds/routes/builds.module.css
@@ -20,7 +20,7 @@
 .categoryHeader {
 	display: flex;
 	align-items: center;
-	gap: var(--s-2-5);
+	gap: var(--s-3);
 }
 
 .categoryWeapons {
diff --git a/app/features/calendar/components/TournamentCard.module.css b/app/features/calendar/components/TournamentCard.module.css
index ad1d5ac4e..bd2bc80bd 100644
--- a/app/features/calendar/components/TournamentCard.module.css
+++ b/app/features/calendar/components/TournamentCard.module.css
@@ -74,9 +74,11 @@
 	font-weight: var(--weight-bold);
 	background-color: var(--color-bg-higher);
 	border-radius: var(--radius-selector);
+	height: var(--field-size-xs);
 	width: max-content;
-	padding: var(--s-0-5) var(--s-1-5);
+	padding: 0 var(--s-1-5);
 	display: flex;
+	align-items: center;
 	gap: var(--s-1);
 }
 
@@ -117,7 +119,8 @@
 	font-size: var(--font-2xs);
 	font-weight: var(--weight-bold);
 	border-radius: var(--radius-selector);
-	padding: var(--s-0-5) var(--s-1-5);
+	height: var(--field-size-xs);
+	padding: 0 var(--s-1-5);
 	display: grid;
 	place-items: center;
 }
@@ -157,5 +160,5 @@
 .badgePill {
 	background-color: var(--color-bg-higher);
 	border-radius: var(--radius-selector);
-	padding: var(--s-0-5) var(--s-1-5);
+	padding: 0 var(--s-1-5);
 }
diff --git a/app/features/calendar/routes/calendar.module.css b/app/features/calendar/routes/calendar.module.css
index 137e2a8c1..904912efd 100644
--- a/app/features/calendar/routes/calendar.module.css
+++ b/app/features/calendar/routes/calendar.module.css
@@ -57,7 +57,7 @@
 .columnsContainer {
 	display: grid;
 	grid-template-columns: repeat(var(--columns-count), 225px);
-	gap: var(--s-14);
+	gap: var(--s-12);
 	overflow-x: auto;
 }
 
diff --git a/app/features/chat/components/Chat.module.css b/app/features/chat/components/Chat.module.css
index 90ef12d52..44eaf25f8 100644
--- a/app/features/chat/components/Chat.module.css
+++ b/app/features/chat/components/Chat.module.css
@@ -4,7 +4,7 @@
 }
 
 .messages {
-	padding: var(--s-2-5) 0 0 0;
+	padding: var(--s-3) 0 0 0;
 	display: flex;
 	flex-direction: column;
 	gap: var(--s-2);
@@ -15,7 +15,7 @@
 .message {
 	list-style: none;
 	display: flex;
-	gap: var(--s-2-5);
+	gap: var(--s-3);
 }
 
 .messageInfo {
diff --git a/app/features/front-page/routes/index.module.css b/app/features/front-page/routes/index.module.css
index 8d5d346a7..c2e852b3f 100644
--- a/app/features/front-page/routes/index.module.css
+++ b/app/features/front-page/routes/index.module.css
@@ -7,7 +7,7 @@
 	gap: var(--s-3);
 	overflow-y: auto;
 	height: 100vh;
-	padding-block-end: var(--s-48);
+	padding-block-end: var(--s-32);
 	padding-inline-end: var(--s-4);
 }
 
diff --git a/app/features/lfg/components/LFGFiltersSideNav.module.css b/app/features/lfg/components/LFGFiltersSideNav.module.css
index f067aafd3..5135a2667 100644
--- a/app/features/lfg/components/LFGFiltersSideNav.module.css
+++ b/app/features/lfg/components/LFGFiltersSideNav.module.css
@@ -1,6 +1,6 @@
 .filterSection {
 	padding: var(--s-1) var(--s-2);
-	padding-block-end: var(--s-2-5);
+	padding-block-end: var(--s-3);
 }
 
 .filterSection select,
diff --git a/app/features/notifications/components/NotificationList.module.css b/app/features/notifications/components/NotificationList.module.css
index b79ec3b85..12a4bf358 100644
--- a/app/features/notifications/components/NotificationList.module.css
+++ b/app/features/notifications/components/NotificationList.module.css
@@ -1,16 +1,16 @@
 .itemDivider {
-	margin-inline: var(--s-2-5);
+	margin-inline: var(--s-3);
 	border-width: 0.5px;
 	border-color: var(--color-bg-high);
 }
 
 .item {
-	padding: var(--s-1) var(--s-2-5);
+	padding: var(--s-1) var(--s-3);
 	display: grid;
 	grid-template-areas: "image header" "image timestamp";
 	grid-template-columns: 30px 1fr;
 	column-gap: var(--s-2);
-	padding-block: var(--s-2-5);
+	padding-block: var(--s-3);
 	color: var(--color-text);
 }
 
diff --git a/app/features/notifications/routes/notifications.module.css b/app/features/notifications/routes/notifications.module.css
index 1490ffff9..d092e7017 100644
--- a/app/features/notifications/routes/notifications.module.css
+++ b/app/features/notifications/routes/notifications.module.css
@@ -1,7 +1,7 @@
 .header {
 	display: flex;
 	align-items: center;
-	gap: var(--s-2-5);
+	gap: var(--s-3);
 }
 
 .header svg {
diff --git a/app/features/scrims/routes/scrims.$id.module.css b/app/features/scrims/routes/scrims.$id.module.css
index 6a8d1ac9b..1cfa838a1 100644
--- a/app/features/scrims/routes/scrims.$id.module.css
+++ b/app/features/scrims/routes/scrims.$id.module.css
@@ -13,7 +13,7 @@
 .groupCard {
 	border-radius: var(--radius-box);
 	background-color: var(--color-bg-high);
-	padding: var(--s-2-5);
+	padding: var(--s-3);
 	display: flex;
 	gap: var(--s-4);
 	flex-direction: column;
@@ -27,7 +27,7 @@
 	border-radius: var(--radius-box);
 	font-size: var(--font-sm);
 	font-weight: var(--weight-semi);
-	padding-inline-end: var(--s-2-5);
+	padding-inline-end: var(--s-3);
 	color: var(--color-text);
 }
 
@@ -48,7 +48,7 @@
 .chatContainer {
 	border-radius: var(--radius-box);
 	background-color: var(--color-bg-high);
-	padding: var(--s-2-5);
+	padding: var(--s-3);
 }
 
 .screenBanIndicator {
diff --git a/app/features/sendouq-match/routes/q.match.$id.module.css b/app/features/sendouq-match/routes/q.match.$id.module.css
index 8c9bfc15a..6592de0ee 100644
--- a/app/features/sendouq-match/routes/q.match.$id.module.css
+++ b/app/features/sendouq-match/routes/q.match.$id.module.css
@@ -64,7 +64,7 @@
 	display: grid;
 	grid-template-columns: max-content 1fr;
 	row-gap: var(--s-2);
-	column-gap: var(--s-2-5);
+	column-gap: var(--s-3);
 	align-items: center;
 	font-size: var(--font-xs);
 }
diff --git a/app/features/sendouq-settings/components/ModeMapPoolPicker.module.css b/app/features/sendouq-settings/components/ModeMapPoolPicker.module.css
index 609074a15..7050261f6 100644
--- a/app/features/sendouq-settings/components/ModeMapPoolPicker.module.css
+++ b/app/features/sendouq-settings/components/ModeMapPoolPicker.module.css
@@ -18,6 +18,7 @@
 .slotIcon {
 	color: var(--color-success);
 	width: 16px;
+	height: 16px;
 }
 
 .slotPicked {
@@ -72,8 +73,9 @@
 .mapButtonIcon {
 	position: absolute;
 	top: 2px;
-	fill: var(--color-success);
+	color: var(--color-success);
 	width: 48px;
+	height: 48px;
 	cursor: pointer;
 }
 
diff --git a/app/features/sendouq-settings/routes/q.settings.tsx b/app/features/sendouq-settings/routes/q.settings.tsx
index f9bfcdd5b..048ee8bad 100644
--- a/app/features/sendouq-settings/routes/q.settings.tsx
+++ b/app/features/sendouq-settings/routes/q.settings.tsx
@@ -233,7 +233,6 @@ function MapPicker() {
 							_action="UPDATE_MAP_MODE_PREFERENCES"
 							state={fetcher.state}
 							className="mx-auto"
-							size="big"
 						>
 							{t("common:actions.save")}
 						</SubmitButton>
diff --git a/app/features/sendouq/components/GroupCard.module.css b/app/features/sendouq/components/GroupCard.module.css
index 908af6d86..b0179b496 100644
--- a/app/features/sendouq/components/GroupCard.module.css
+++ b/app/features/sendouq/components/GroupCard.module.css
@@ -2,7 +2,7 @@
 	background-color: var(--color-bg-high);
 	width: 100%;
 	border-radius: var(--radius-box);
-	padding: var(--s-2-5);
+	padding: var(--s-3);
 	display: flex;
 	flex-direction: column;
 	gap: var(--s-4);
@@ -28,7 +28,7 @@
 	border-radius: var(--radius-field);
 	font-size: var(--font-sm);
 	font-weight: var(--weight-semi);
-	padding-inline-end: var(--s-2-5);
+	padding-inline-end: var(--s-3);
 }
 
 .name {
@@ -153,7 +153,7 @@
 	position: absolute;
 	border-radius: var(--radius-box);
 	background-color: var(--color-bg);
-	padding: var(--s-0-5) var(--s-2-5);
+	padding: var(--s-0-5) var(--s-3);
 	font-size: var(--font-xs);
 	font-weight: var(--weight-semi);
 	bottom: -36px;
diff --git a/app/features/sendouq/routes/q.looking.module.css b/app/features/sendouq/routes/q.looking.module.css
index 2b52f4bb5..bde71adcb 100644
--- a/app/features/sendouq/routes/q.looking.module.css
+++ b/app/features/sendouq/routes/q.looking.module.css
@@ -6,7 +6,7 @@
 	display: grid;
 	justify-content: center;
 	grid-template-columns: repeat(3, minmax(0, 1fr));
-	gap: var(--s-7);
+	gap: var(--s-6);
 }
 
 .containerMobile {
diff --git a/app/features/sendouq/routes/q.module.css b/app/features/sendouq/routes/q.module.css
index 553b9a76a..c63a36878 100644
--- a/app/features/sendouq/routes/q.module.css
+++ b/app/features/sendouq/routes/q.module.css
@@ -30,7 +30,7 @@
 	font-weight: var(--weight-bold);
 	display: flex;
 	align-items: center;
-	gap: var(--s-2-5);
+	gap: var(--s-3);
 	transition: background-color 0.2s;
 }
 
diff --git a/app/features/team/team.module.css b/app/features/team/team.module.css
index b18bc59ad..6c7d287f2 100644
--- a/app/features/team/team.module.css
+++ b/app/features/team/team.module.css
@@ -238,7 +238,7 @@
 	margin-left: auto;
 	font-size: var(--font-sm);
 	color: var(--color-text-high);
-	margin-inline-end: var(--s-2-5);
+	margin-inline-end: var(--s-3);
 	font-weight: var(--weight-bold);
 }
 
@@ -293,7 +293,7 @@
 }
 
 .inviteContainer {
-	margin-block-start: var(--s-14);
+	margin-block-start: var(--s-16);
 	display: flex;
 	flex-direction: column;
 	gap: var(--s-12);
diff --git a/app/features/tier-list-maker/components/ItemPool.module.css b/app/features/tier-list-maker/components/ItemPool.module.css
index 4a8b44b6c..34f66af1b 100644
--- a/app/features/tier-list-maker/components/ItemPool.module.css
+++ b/app/features/tier-list-maker/components/ItemPool.module.css
@@ -1,5 +1,5 @@
 .pool {
 	display: flex;
 	flex-wrap: wrap;
-	gap: var(--s-2-5);
+	gap: var(--s-3);
 }
diff --git a/app/features/top-search/top-search.module.css b/app/features/top-search/top-search.module.css
index 241886ae0..addbdd6c4 100644
--- a/app/features/top-search/top-search.module.css
+++ b/app/features/top-search/top-search.module.css
@@ -85,7 +85,7 @@ a.tableRow:hover {
 .tableInnerRow {
 	display: flex;
 	align-items: center;
-	gap: var(--s-2-5);
+	gap: var(--s-3);
 	width: 100%;
 }
 
diff --git a/app/features/tournament-bracket/components/Bracket/bracket.module.css b/app/features/tournament-bracket/components/Bracket/bracket.module.css
index da05cc40b..64f0f30f8 100644
--- a/app/features/tournament-bracket/components/Bracket/bracket.module.css
+++ b/app/features/tournament-bracket/components/Bracket/bracket.module.css
@@ -135,7 +135,7 @@ a.match:hover {
 	display: flex;
 	flex-direction: column;
 	justify-content: space-around;
-	gap: var(--s-7);
+	gap: var(--s-6);
 	margin-top: var(--s-6);
 	flex: 1;
 	overflow: visible;
diff --git a/app/features/tournament-bracket/tournament-bracket.module.css b/app/features/tournament-bracket/tournament-bracket.module.css
index da7a8c757..2f4883577 100644
--- a/app/features/tournament-bracket/tournament-bracket.module.css
+++ b/app/features/tournament-bracket/tournament-bracket.module.css
@@ -378,7 +378,7 @@
 .modeProgressImage {
 	background-color: var(--color-bg-high);
 	border-radius: 100%;
-	padding: var(--s-2-5);
+	padding: var(--s-3);
 	outline: 2px solid var(--color-bg-higher);
 	min-width: 40px;
 }
@@ -435,7 +435,7 @@
 
 .pointsInput {
 	--field-width: 4.5rem;
-	padding: var(--s-3-5) var(--s-2) !important;
+	padding: var(--s-4) var(--s-2) !important;
 	font-size: var(--font-sm);
 }
 
@@ -452,7 +452,7 @@
 	border-radius: var(--radius-box);
 	border: 2px solid var(--color-bg-higher);
 	padding-block: var(--s-1-5);
-	padding-inline: var(--s-2-5);
+	padding-inline: var(--s-3);
 	font-weight: var(--weight-bold);
 	align-items: center;
 }
@@ -488,7 +488,7 @@
 }
 
 .castInfoContainerLabel {
-	padding: var(--s-2) var(--s-3-5);
+	padding: var(--s-2) var(--s-4);
 	text-transform: uppercase;
 	background-color: var(--color-bg-higher);
 	border-radius: var(--radius-box) 0 0 var(--radius-box);
@@ -516,5 +516,5 @@
 }
 
 .actionSectionWrapper [class*="tabPanel"]:has([class*="chatContainer"]) {
-	padding: var(--s-1) var(--s-3-5);
+	padding: var(--s-1) var(--s-4);
 }
diff --git a/app/features/tournament-organization/tournament-organization.module.css b/app/features/tournament-organization/tournament-organization.module.css
index 0bbe26666..4932b2e0b 100644
--- a/app/features/tournament-organization/tournament-organization.module.css
+++ b/app/features/tournament-organization/tournament-organization.module.css
@@ -159,7 +159,7 @@
 	display: flex;
 	flex-direction: column;
 	gap: var(--s-2);
-	padding-inline-start: var(--s-2-5);
+	padding-inline-start: var(--s-3);
 }
 
 .socialLink {
diff --git a/app/features/tournament-subs/routes/to.$id.subs.module.css b/app/features/tournament-subs/routes/to.$id.subs.module.css
index 018fa69dc..55023685d 100644
--- a/app/features/tournament-subs/routes/to.$id.subs.module.css
+++ b/app/features/tournament-subs/routes/to.$id.subs.module.css
@@ -19,7 +19,7 @@
 	border-radius: var(--radius-box);
 	background-color: var(--color-bg-high);
 	padding: var(--s-4);
-	column-gap: var(--s-2-5);
+	column-gap: var(--s-3);
 }
 
 .sectionAvatar {
diff --git a/app/features/tournament/tournament.module.css b/app/features/tournament/tournament.module.css
index 77565c767..8c0b04950 100644
--- a/app/features/tournament/tournament.module.css
+++ b/app/features/tournament/tournament.module.css
@@ -15,7 +15,7 @@
 }
 
 .selectContainer > label {
-	margin-left: var(--s-2-5);
+	margin-left: var(--s-3);
 }
 
 .teamWithRoster {
@@ -321,7 +321,7 @@
 .seedsTeamMember {
 	display: grid;
 	grid-template-columns: max-content max-content;
-	grid-column-gap: var(--s-2-5);
+	grid-column-gap: var(--s-3);
 	background-color: var(--color-bg-high);
 	border-radius: var(--radius-box);
 	padding: var(--s-1) var(--s-3);
@@ -418,7 +418,7 @@
 .teamSet {
 	display: flex;
 	flex-direction: column;
-	gap: var(--s-2-5);
+	gap: var(--s-3);
 	background-color: var(--color-bg-high);
 	border-radius: var(--radius-box);
 	padding: var(--s-3) var(--s-6);
diff --git a/app/features/user-page/user-page.module.css b/app/features/user-page/user-page.module.css
index fe238f0f8..f4918659c 100644
--- a/app/features/user-page/user-page.module.css
+++ b/app/features/user-page/user-page.module.css
@@ -7,7 +7,7 @@
 .avatarContainer {
 	display: grid;
 	justify-content: center;
-	column-gap: var(--s-2-5);
+	column-gap: var(--s-3);
 	grid-template-areas: "avatar name" "avatar team" "avatar ." "avatar ." "socials .";
 }
 
@@ -31,7 +31,7 @@
 	align-items: center;
 	grid-area: name;
 	overflow-wrap: anywhere;
-	gap: var(--s-2-5);
+	gap: var(--s-3);
 }
 
 .socials {
@@ -39,7 +39,7 @@
 	justify-content: center;
 	gap: var(--s-1-5);
 	grid-area: socials;
-	padding-block-start: var(--s-2-5);
+	padding-block-start: var(--s-3);
 }
 
 .socialLink {
@@ -98,7 +98,7 @@
 	display: flex;
 	max-width: 24rem;
 	flex-wrap: wrap;
-	gap: var(--s-2-5);
+	gap: var(--s-3);
 	margin-inline: auto;
 }
 
@@ -307,7 +307,7 @@
 .seasonMatch {
 	background-color: var(--color-bg-high);
 	border-radius: var(--radius-box);
-	padding: var(--s-2) var(--s-2-5);
+	padding: var(--s-2) var(--s-3);
 	color: var(--color-text);
 	transition: ease-in 0.2s background-color;
 	display: flex;
@@ -384,7 +384,7 @@
 
 .seasonInfoContainer {
 	background-color: var(--color-bg-high);
-	padding: var(--s-2-5) var(--s-2);
+	padding: var(--s-3) var(--s-2);
 	border-radius: var(--radius-box);
 }
 
@@ -407,7 +407,7 @@
 .seasonWeaponUsageWeaponsContainer {
 	display: flex;
 	flex-wrap: wrap;
-	gap: var(--s-2-5);
+	gap: var(--s-3);
 	justify-content: center;
 	max-height: 300px;
 	overflow-y: auto;
diff --git a/app/features/weapons/components/WeaponParamsTable.module.css b/app/features/weapons/components/WeaponParamsTable.module.css
index df5291018..9dd25ce2d 100644
--- a/app/features/weapons/components/WeaponParamsTable.module.css
+++ b/app/features/weapons/components/WeaponParamsTable.module.css
@@ -23,7 +23,7 @@
 }
 
 .table tbody td {
-	padding: var(--s-2) var(--s-2-5);
+	padding: var(--s-2) var(--s-3);
 	border-bottom: 1px solid var(--color-border);
 }
 
diff --git a/app/form/fields/WeaponPoolFormField.module.css b/app/form/fields/WeaponPoolFormField.module.css
index 81abc5f2b..e0fa8a83e 100644
--- a/app/form/fields/WeaponPoolFormField.module.css
+++ b/app/form/fields/WeaponPoolFormField.module.css
@@ -62,9 +62,9 @@
 }
 
 .starIconOutlined {
-	color: var(--color-second);
+	color: var(--color-text-accent);
 }
 
 .starIconFilled {
-	fill: var(--color-second);
+	fill: var(--color-text-accent);
 }
diff --git a/app/styles/common.css b/app/styles/common.css
index 34e191cc3..e1e847794 100644
--- a/app/styles/common.css
+++ b/app/styles/common.css
@@ -506,7 +506,7 @@ abbr[title] {
 }
 
 .article > p {
-	padding-block: var(--s-2-5);
+	padding-block: var(--s-3);
 }
 
 .article img {
diff --git a/app/styles/elements.css b/app/styles/elements.css
index 2e5d6360b..659ece3a4 100644
--- a/app/styles/elements.css
+++ b/app/styles/elements.css
@@ -150,7 +150,7 @@
 }
 
 .react-aria-Switch .indicator {
-	width: var(--s-11);
+	width: var(--s-10);
 	height: var(--s-6);
 	background: var(--theme-transparent);
 	border-radius: 1.143rem;
diff --git a/app/styles/utils.css b/app/styles/utils.css
index a53e40343..7c4219ba0 100644
--- a/app/styles/utils.css
+++ b/app/styles/utils.css
@@ -303,7 +303,7 @@
 }
 
 .ml-2-5 {
-	margin-inline-start: var(--s-2-5);
+	margin-inline-start: var(--s-3);
 }
 
 .ml-4 {
diff --git a/app/styles/vars.css b/app/styles/vars.css
index 11d024c78..771bc32b9 100644
--- a/app/styles/vars.css
+++ b/app/styles/vars.css
@@ -173,6 +173,21 @@ html {
 
 	--line-height: 1.4;
 
+	--s-0-5: 0.125rem;
+	--s-1: 0.25rem;
+	--s-1-5: 0.375rem;
+	--s-2: 0.5rem;
+	--s-3: 0.75rem;
+	--s-4: 1rem;
+	--s-5: 1.25rem;
+	--s-6: 1.5rem;
+	--s-8: 2rem;
+	--s-10: 2.5rem;
+	--s-12: 3rem;
+	--s-16: 4rem;
+	--s-24: 6rem;
+	--s-32: 8rem;
+
 	/*
 	Tokens used to define layout dimensions
 
@@ -209,10 +224,10 @@ html {
 	--field-size-icon: 18px;
 	--field-padding: 1rem;
 
-	--selector-size-xs: calc(var(--_size-selector) * 3 * 0.25rem);
-	--selector-size-sm: calc(var(--_size-selector) * 4 * 0.25rem);
-	--selector-size: calc(var(--_size-selector) * 5 * 0.25rem);
-	--selector-size-lg: calc(var(--_size-selector) * 6 * 0.25rem);
+	--selector-size-xs: calc(var(--_size-selector) * 4 * 0.25rem);
+	--selector-size-sm: calc(var(--_size-selector) * 5 * 0.25rem);
+	--selector-size: calc(var(--_size-selector) * 6 * 0.25rem);
+	--selector-size-lg: calc(var(--_size-selector) * 7 * 0.25rem);
 
 	--radius-box: calc(var(--_radius-box) * 4px);
 	--radius-field: calc(var(--_radius-field) * 4px);
@@ -221,31 +236,6 @@ html {
 }
 
 html {
-	--s-0-5: 0.125rem;
-	--s-1: 0.25rem;
-	--s-1-5: 0.375rem;
-	--s-2: 0.5rem;
-	--s-2-5: 0.625rem;
-	--s-3: 0.75rem;
-	--s-3-5: 0.875rem;
-	--s-4: 1rem;
-	--s-5: 1.25rem;
-	--s-6: 1.5rem;
-	--s-7: 1.75rem;
-	--s-8: 2rem;
-	--s-9: 2.25rem;
-	--s-10: 2.5rem;
-	--s-11: 2.75rem;
-	--s-12: 3rem;
-	--s-14: 3.5rem;
-	--s-16: 4rem;
-	--s-20: 5rem;
-	--s-24: 6rem;
-	--s-28: 7rem;
-	--s-32: 8rem;
-	--s-40: 10rem;
-	--s-48: 12rem;
-
 	--label-margin: var(--s-1);
 }