diff --git a/res/css/structures/_RoomView.pcss b/res/css/structures/_RoomView.pcss
index b340c8d994..b70649029f 100644
--- a/res/css/structures/_RoomView.pcss
+++ b/res/css/structures/_RoomView.pcss
@@ -15,7 +15,7 @@ limitations under the License.
 */
 
 :root {
-    --RoomView_MessageList-padding: 18px; /* TODO: use a variable */
+    --RoomView_MessageList-padding: 18px;
 }
 
 .mx_RoomView_wrapper {
@@ -212,7 +212,7 @@ limitations under the License.
         margin-bottom: 4px;
 
         h2 {
-            margin-top: 6px; /* TODO: Use a spacing variable */
+            margin-top: 6px;
         }
     }
 
diff --git a/res/css/views/beta/_BetaCard.pcss b/res/css/views/beta/_BetaCard.pcss
index 62f7d7b93a..47ab7b005b 100644
--- a/res/css/views/beta/_BetaCard.pcss
+++ b/res/css/views/beta/_BetaCard.pcss
@@ -35,7 +35,7 @@ limitations under the License.
                 font-size: $font-18px;
                 line-height: $font-22px;
                 color: $primary-content;
-                margin: $spacing-4 0 14px; // TODO: use a spacing variable
+                margin: $spacing-4 0 14px;
 
                 display: flex;
                 align-items: center;
@@ -117,7 +117,7 @@ limitations under the License.
 
 .mx_BetaCard_betaPill {
     background-color: $accent-alt;
-    padding: $spacing-4 10px; // TODO: use a spacing variable
+    padding: $spacing-4 10px;
     border-radius: 8px;
     text-transform: uppercase;
     font-size: $font-12px;
diff --git a/res/css/views/dialogs/_InviteDialog.pcss b/res/css/views/dialogs/_InviteDialog.pcss
index a7c1346951..4ffdb5d6cf 100644
--- a/res/css/views/dialogs/_InviteDialog.pcss
+++ b/res/css/views/dialogs/_InviteDialog.pcss
@@ -28,7 +28,7 @@ limitations under the License.
     flex-direction: row;
     /* Right margin for the design. We could apply this to the whole dialog, but then the scrollbar */
     /* for the user section gets weird. */
-    margin: $spacing-8 45px 0 0; /* TODO: Use a spacing variable */
+    margin: $spacing-8 45px 0 0;
 
     .mx_InviteDialog_editor {
         flex: 1;
@@ -43,14 +43,14 @@ limitations under the License.
         flex-wrap: wrap;
 
         .mx_InviteDialog_userTile {
-            margin: 6px 6px 0 0; /* TODO: Use a spacing variable */
+            margin: 6px 6px 0 0;
             display: inline-block;
             min-width: max-content; /* prevent manipulation by flexbox */
         }
 
         /* overrides bunch of our default text input styles */
         > input[type="text"] {
-            margin: 6px 0 !important; /* TODO: Use a spacing variable */
+            margin: 6px 0 !important;
             height: 24px;
             line-height: $font-24px;
             font-size: $font-14px;
@@ -67,7 +67,7 @@ limitations under the License.
 
     .mx_InviteDialog_goButton {
         min-width: 48px;
-        margin-inline-start: 10px; /* TODO: Use a spacing variable */
+        margin-inline-start: 10px;
         height: 25px;
         line-height: $font-25px;
     }
@@ -77,7 +77,7 @@ limitations under the License.
             /* Width and height are required to trick the layout engine. */
             width: 20px;
             height: 20px;
-            margin-inline-start: 5px; /* TODO: Use a spacing variable */
+            margin-inline-start: 5px;
             display: inline-block;
             vertical-align: middle;
         }
@@ -103,7 +103,7 @@ limitations under the License.
     }
 
     .mx_InviteDialog_section_showMore {
-        margin: 7px 18px; /* TODO: Use a spacing variable */
+        margin: 7px 18px;
         display: block;
     }
 }
@@ -252,7 +252,7 @@ limitations under the License.
 .mx_InviteDialog_userSections {
     margin-top: $spacing-4;
     overflow-y: auto;
-    padding: 0 45px $spacing-4 0; /* TODO: Use a spacing variable */
+    padding: 0 45px $spacing-4 0;
 }
 
 .mx_InviteDialog_helpText {
@@ -289,7 +289,7 @@ limitations under the License.
 
     .mx_DialPad {
         row-gap: $spacing-16;
-        column-gap: 48px; /* TODO: Use a spacing variable */
+        column-gap: 48px;
         margin-inline: auto;
     }
 }
@@ -450,7 +450,7 @@ limitations under the License.
 }
 
 .mx_InviteDialog_identityServer {
-    margin-top: 1em; /* TODO: Use a spacing variable */
+    margin-top: 1em;
 }
 
 .mx_InviteDialog_oneThreepid {
diff --git a/res/css/views/dialogs/_SpotlightDialog.pcss b/res/css/views/dialogs/_SpotlightDialog.pcss
index 9303e61a33..75b4f48ff5 100644
--- a/res/css/views/dialogs/_SpotlightDialog.pcss
+++ b/res/css/views/dialogs/_SpotlightDialog.pcss
@@ -36,7 +36,7 @@ limitations under the License.
 
         kbd {
             display: inline-block;
-            padding: 2px $spacing-4; /* TODO: Use a spacing variable */
+            padding: 2px $spacing-4;
             margin: 0 $spacing-4;
             border-radius: 6px;
             background-color: $quinary-content;
@@ -76,7 +76,7 @@ limitations under the License.
             vertical-align: middle;
             color: $primary-content;
             position: relative;
-            padding: $spacing-4 $spacing-8 $spacing-4 37px; /* TODO: Use a spacing variable */
+            padding: $spacing-4 $spacing-8 $spacing-4 37px;
 
             &::before {
                 background-color: $secondary-content;
@@ -234,7 +234,7 @@ limitations under the License.
         .mx_SpotlightDialog_otherSearches,
         .mx_SpotlightDialog_hiddenResults {
             .mx_SpotlightDialog_option {
-                padding: 6px $spacing-4; /* TODO: Use a spacing variable */
+                padding: 6px $spacing-4;
                 border-radius: 8px;
                 font-size: $font-15px;
                 line-height: $font-24px;
@@ -258,11 +258,11 @@ limitations under the License.
 
                     .mx_AccessibleButton {
                         padding: $spacing-4 $spacing-20;
-                        margin: 2px $spacing-4; /* TODO: Use a spacing variable */
+                        margin: 2px $spacing-4;
                     }
 
                     .mx_SpotlightDialog_enterPrompt {
-                        margin-top: 9px; /* TODO: Use a spacing variable */
+                        margin-top: 9px;
                         margin-right: $spacing-8;
                     }
                 }
@@ -379,7 +379,7 @@ limitations under the License.
             .mx_AccessibleButton {
                 position: relative;
                 margin: 0;
-                padding: 3px $spacing-8 3px $spacing-28; /* TODO: Use a spacing variable */
+                padding: 3px $spacing-8 3px $spacing-28;
 
                 &::before {
                     content: "";
@@ -480,7 +480,7 @@ limitations under the License.
         }
 
         .mx_SpotlightDialog_enterPrompt {
-            padding: 2px $spacing-4; /* TODO: Use a spacing variable */
+            padding: 2px $spacing-4;
             /* To avoid any styling inherent with <kbd> elements */
             font-family: inherit;
             font-weight: inherit;
diff --git a/res/css/views/dialogs/security/_AccessSecretStorageDialog.pcss b/res/css/views/dialogs/security/_AccessSecretStorageDialog.pcss
index 6b802197dc..85e5c08258 100644
--- a/res/css/views/dialogs/security/_AccessSecretStorageDialog.pcss
+++ b/res/css/views/dialogs/security/_AccessSecretStorageDialog.pcss
@@ -23,7 +23,7 @@ limitations under the License.
             height: 24px;
             margin-inline-end: $spacing-8;
             position: relative;
-            top: 5px; /* TODO: spacing variable */
+            top: 5px;
             background-color: $primary-content;
         }
 
@@ -81,7 +81,7 @@ limitations under the License.
                 mask-repeat: no-repeat;
                 mask-position: center;
                 mask-size: 20px;
-                margin-inline-end: 5px; /* TODO: spacing variable */
+                margin-inline-end: 5px;
             }
 
             &.mx_AccessSecretStorageDialog_recoveryKeyFeedback--valid {
@@ -109,7 +109,7 @@ limitations under the License.
             text-align: initial;
             display: flex;
             flex-flow: column;
-            gap: 14px; /* TODO: spacing variable */
+            gap: 14px;
 
             .mx_Dialog_buttons_additive {
                 float: none;
diff --git a/res/css/views/elements/_GenericEventListSummary.pcss b/res/css/views/elements/_GenericEventListSummary.pcss
index b7d1adb73e..a0f5a97c25 100644
--- a/res/css/views/elements/_GenericEventListSummary.pcss
+++ b/res/css/views/elements/_GenericEventListSummary.pcss
@@ -23,7 +23,7 @@ limitations under the License.
 
     .mx_GenericEventListSummary_spacer {
         border-bottom: 1px solid $primary-hairline-color;
-        margin-left: 63px; /* TODO: Use a variable */
+        margin-left: 63px;
         line-height: $font-30px; /* TODO: Use a variable */
 
         .mx_IRCLayout & {
diff --git a/res/css/views/elements/_ReplyChain.pcss b/res/css/views/elements/_ReplyChain.pcss
index 6de9d367a2..4f216322b4 100644
--- a/res/css/views/elements/_ReplyChain.pcss
+++ b/res/css/views/elements/_ReplyChain.pcss
@@ -16,9 +16,9 @@ limitations under the License.
 
 .mx_ReplyChain {
     margin: 0; // Reset default blockquote margin
-    padding-left: 10px; // TODO: Use a spacing variable
-    border-left: 2px solid var(--username-color); // TODO: Use a spacing variable
-    border-radius: 2px; // TODO: Use a spacing variable
+    padding-left: 10px;
+    border-left: 2px solid var(--username-color);
+    border-radius: 2px;
 
     .mx_ReplyChain_show {
         &.mx_AccessibleButton_kind_link_inline {
diff --git a/res/css/views/messages/_EventTileBubble.pcss b/res/css/views/messages/_EventTileBubble.pcss
index 7facf259a1..8fd3371401 100644
--- a/res/css/views/messages/_EventTileBubble.pcss
+++ b/res/css/views/messages/_EventTileBubble.pcss
@@ -15,10 +15,10 @@ limitations under the License.
 */
 
 .mx_EventTileBubble {
-    --EventTileBubble_margin-block: 10px; /* TODO: Use a spacing variable */
+    --EventTileBubble_margin-block: 10px;
 
     background-color: $dark-panel-bg-color;
-    padding: 10px; /* TODO: Use a spacing variable */
+    padding: 10px;
     border-radius: 8px;
     /* Reserve space for external timestamps, but also cap the width */
     max-width: min(calc(100% - 2 * var(--MessageTimestamp-width)), 600px);
diff --git a/res/css/views/messages/_ViewSourceEvent.pcss b/res/css/views/messages/_ViewSourceEvent.pcss
index 725c834188..0b76ed5953 100644
--- a/res/css/views/messages/_ViewSourceEvent.pcss
+++ b/res/css/views/messages/_ViewSourceEvent.pcss
@@ -29,7 +29,7 @@ limitations under the License.
 
     pre {
         line-height: 1.2;
-        margin: 3.5px 0; /* TODO: use a variable */
+        margin: 3.5px 0;
     }
 
     .mx_ViewSourceEvent_toggle {
@@ -56,7 +56,7 @@ limitations under the License.
         align-self: flex-end;
         height: var(--ViewSourceEvent_toggle-size);
         mask-position: 0 bottom;
-        margin-bottom: 5px; /* TODO: use a variable */
+        margin-bottom: 5px;
         mask-image: url("$(res)/img/element-icons/minimise-collapse.svg");
     }
 }
diff --git a/res/css/views/right_panel/_BaseCard.pcss b/res/css/views/right_panel/_BaseCard.pcss
index 39f55b052d..73454e6c17 100644
--- a/res/css/views/right_panel/_BaseCard.pcss
+++ b/res/css/views/right_panel/_BaseCard.pcss
@@ -17,7 +17,7 @@ limitations under the License.
 .mx_BaseCard {
     --BaseCard_padding-inline: $spacing-8;
     --BaseCard_EventTile_line-padding-block: 2px;
-    --BaseCard_EventTile-spacing-inline: 36px; /* TODO: Use a spacing variable */
+    --BaseCard_EventTile-spacing-inline: 36px;
     --BaseCard_header-button-size: 24px;
 
     padding: 0 var(--BaseCard_padding-inline);
@@ -32,7 +32,7 @@ limitations under the License.
         margin: $spacing-4 0 $spacing-12;
 
         > h2 {
-            margin: 0 44px; /* TODO: Use a spacing variable */
+            margin: 0 44px;
             font-size: $font-18px;
             font-weight: var(--font-semi-bold);
             overflow: hidden;
@@ -79,7 +79,7 @@ limitations under the License.
                 margin-inline-start: var(--BaseCard_header-button-size);
 
                 .mx_BaseCard_header_title_heading {
-                    margin-inline-start: 6px; /* TODO: Use a spacing variable */
+                    margin-inline-start: 6px;
                 }
             }
         }
@@ -159,7 +159,7 @@ limitations under the License.
         }
 
         .mx_BaseCard_Button {
-            padding: 10px; /* TODO: Use a spacing variable */
+            padding: 10px;
             padding-inline-start: $spacing-12;
             margin: 0;
             position: relative;
@@ -234,8 +234,8 @@ limitations under the License.
 
         font-size: $font-12px;
         color: $secondary-content;
-        padding-top: 10px; /* TODO: Use a spacing variable */
-        padding-bottom: 10px; /* TODO: Use a spacing variable */
+        padding-top: 10px;
+        padding-bottom: 10px;
 
         border: 1px solid $quinary-content;
         box-shadow: 0px 1px 3px rgba(23, 25, 28, 0.05);
@@ -243,7 +243,7 @@ limitations under the License.
 
     .mx_ContextualMenu_chevron_top {
         left: auto;
-        right: 22px; /* TODO: Use a spacing variable */
+        right: 22px;
         border-bottom-color: $quinary-content;
 
         &::after {
diff --git a/res/css/views/right_panel/_ThreadPanel.pcss b/res/css/views/right_panel/_ThreadPanel.pcss
index 470494df52..8435ee5b9f 100644
--- a/res/css/views/right_panel/_ThreadPanel.pcss
+++ b/res/css/views/right_panel/_ThreadPanel.pcss
@@ -26,7 +26,7 @@ limitations under the License.
             }
 
             .mx_ThreadPanel_dropdown {
-                padding: 3px $spacing-4 3px $spacing-8; /* TODO: Use a spacing variable */
+                padding: 3px $spacing-4 3px $spacing-8;
                 border-radius: 4px;
                 line-height: 1.5;
                 user-select: none;
diff --git a/res/css/views/right_panel/_UserInfo.pcss b/res/css/views/right_panel/_UserInfo.pcss
index 1287e74f06..d8ea74586c 100644
--- a/res/css/views/right_panel/_UserInfo.pcss
+++ b/res/css/views/right_panel/_UserInfo.pcss
@@ -27,7 +27,7 @@ limitations under the License.
         top: 0;
         border-radius: 4px;
         background-color: $dark-panel-bg-color;
-        margin: 9px; /* TODO: Use a variable */
+        margin: 9px;
         z-index: 1; /* render on top of the right panel */
 
         div {
@@ -44,7 +44,7 @@ limitations under the License.
     h2 {
         font-size: $font-18px;
         font-weight: var(--font-semi-bold);
-        margin: 18px 0 0 0; /* TODO: Use a variable */
+        margin: 18px 0 0 0;
     }
 
     .mx_UserInfo_container {
@@ -151,7 +151,7 @@ limitations under the License.
     }
 
     p {
-        margin: 5px 0; /* TODO: Use a variable */
+        margin: 5px 0;
     }
 
     .mx_UserInfo_profile {
@@ -179,7 +179,7 @@ limitations under the License.
             }
 
             .mx_E2EIcon {
-                margin-top: 3px; /* visual vertical centering to the top line of text. TODO: Use a variable */
+                margin-top: 3px; /* visual vertical centering to the top line of text. */
                 margin-inline-end: $spacing-4; /* margin from displayName */
                 min-width: 18px; /* convince flexbox to not collapse it */
             }
@@ -196,7 +196,7 @@ limitations under the License.
             justify-content: center;
             align-items: center;
 
-            margin: 6px 0; /* TODO: Use a variable */
+            margin: 6px 0;
 
             .mx_UserInfo_roleDescription {
                 display: flex;
diff --git a/res/css/views/rooms/_EventTile.pcss b/res/css/views/rooms/_EventTile.pcss
index fc871bbc35..849609acf9 100644
--- a/res/css/views/rooms/_EventTile.pcss
+++ b/res/css/views/rooms/_EventTile.pcss
@@ -18,7 +18,7 @@ limitations under the License.
 $left-gutter: 64px;
 
 .mx_EventTile {
-    --EventTile_content-margin-inline-end: 34px; /* TODO: Use a spacing variable */
+    --EventTile_content-margin-inline-end: 34px;
     --EventTile_group_line-spacing-block-start: 1px;
     --EventTile_group_line-spacing-block-end: 3px;
     --EventTile_group_line-spacing-inline-start: $left-gutter;
@@ -347,7 +347,7 @@ $left-gutter: 64px;
             > .mx_DisambiguatedProfile_mxid {
                 visibility: collapse;
                 margin-left: 0; /* Override the inherited margin. */
-                padding: 0 5px; /* TODO: Use a spacing variable */
+                padding: 0 5px;
             }
 
             &:hover {
@@ -537,7 +537,7 @@ $left-gutter: 64px;
         }
 
         .mx_RoomView_timeline_rr_enabled & {
-            $inline-end-margin: 80px; /* TODO: Use a spacing variable */
+            $inline-end-margin: 80px;
 
             .mx_ThreadSummary,
             .mx_ThreadSummary_icon,
diff --git a/res/css/views/rooms/_IRCLayout.pcss b/res/css/views/rooms/_IRCLayout.pcss
index 07400f2f49..6f4b7c280c 100644
--- a/res/css/views/rooms/_IRCLayout.pcss
+++ b/res/css/views/rooms/_IRCLayout.pcss
@@ -22,7 +22,7 @@ limitations under the License.
     --name-width: 80px; /* cf. ircDisplayNameWidth on Settings.tsx */
     --icon-width: 14px;
     --line-height: var(--irc-line-height);
-    --right-padding: 5px; /* TODO: Use a spacing variable */
+    --right-padding: 5px;
 
     line-height: var(--line-height) !important;
 
diff --git a/res/css/views/settings/_FontScalingPanel.pcss b/res/css/views/settings/_FontScalingPanel.pcss
index 06b248d729..87d92e4b0a 100644
--- a/res/css/views/settings/_FontScalingPanel.pcss
+++ b/res/css/views/settings/_FontScalingPanel.pcss
@@ -24,11 +24,11 @@ limitations under the License.
     display: flow-root;
 
     &.mx_IRCLayout {
-        padding-top: 9px; /* TODO: Use a spacing variable */
+        padding-top: 9px;
     }
 
     .mx_EventTile[data-layout="bubble"] {
-        margin-top: 30px; /* TODO: Use a spacing variable */
+        margin-top: 30px;
     }
 
     .mx_EventTile_msgOption {
@@ -39,7 +39,7 @@ limitations under the License.
 .mx_FontScalingPanel_fontSlider {
     display: flex;
     align-items: center;
-    padding: 15px $spacing-20 35px; /* TODO: Use spacing variables */
+    padding: 15px $spacing-20 35px;
     background: rgba($quinary-content, 0.2);
     border-radius: 10px;
     font-size: $font-10px;
diff --git a/res/css/views/settings/_ProfileSettings.pcss b/res/css/views/settings/_ProfileSettings.pcss
index 0b4c68120c..94b03eeabf 100644
--- a/res/css/views/settings/_ProfileSettings.pcss
+++ b/res/css/views/settings/_ProfileSettings.pcss
@@ -57,7 +57,7 @@ limitations under the License.
 
         > .mx_AccessibleButton_kind_link {
             font-size: $font-14px;
-            margin-inline-end: 10px; /* TODO: Use a spacing variable */
+            margin-inline-end: 10px;
         }
     }
 }
diff --git a/res/css/views/settings/tabs/_SettingsSection.pcss b/res/css/views/settings/tabs/_SettingsSection.pcss
index 5f4fd6f024..d3a35b7f47 100644
--- a/res/css/views/settings/tabs/_SettingsSection.pcss
+++ b/res/css/views/settings/tabs/_SettingsSection.pcss
@@ -16,7 +16,7 @@ limitations under the License.
 
 .mx_SettingsSection {
     --SettingsTab_section-margin-bottom-preferences-labs: 30px;
-    --SettingsTab_heading_nth_child-margin-top: 30px; /* TODO: Use a spacing variable */
+    --SettingsTab_heading_nth_child-margin-top: 30px;
     --SettingsTab_tooltip-max-width: 120px; /* So it fits in the space provided by the page */
 
     color: $primary-content;
diff --git a/res/css/views/settings/tabs/_SettingsTab.pcss b/res/css/views/settings/tabs/_SettingsTab.pcss
index 064bd457d9..17779783d4 100644
--- a/res/css/views/settings/tabs/_SettingsTab.pcss
+++ b/res/css/views/settings/tabs/_SettingsTab.pcss
@@ -50,9 +50,9 @@ limitations under the License.
     color: $secondary-content;
     font-size: $font-14px;
     display: block;
-    margin-top: 10px; /* TODO: Use a spacing variable */
+    margin-top: 10px;
     margin-inline-end: 80px; /* Align with the rest of the view */
-    margin-bottom: 10px; /* TODO: Use a spacing variable */
+    margin-bottom: 10px;
     margin-inline-start: 0;
 }
 
@@ -63,7 +63,7 @@ limitations under the License.
 
     .mx_SettingsFlag {
         margin-inline-end: $end-gutter;
-        margin-bottom: 10px; /* TODO: Use a spacing variable */
+        margin-bottom: 10px;
 
         .mx_SettingsFlag_label {
             vertical-align: middle;