diff --git a/apps/client/src/features/cuesheet/CuesheetWrapper.module.scss b/apps/client/src/features/cuesheet/CuesheetWrapper.module.scss
index 61f9a47fe..b179cf178 100644
--- a/apps/client/src/features/cuesheet/CuesheetWrapper.module.scss
+++ b/apps/client/src/features/cuesheet/CuesheetWrapper.module.scss
@@ -1,4 +1,5 @@
 .tableWrapper {
+  background-color: $ui-black;
   width: 100%;
   height: 100vh;
   padding: 1rem 0.5rem;
diff --git a/apps/client/src/features/editors/Editor.module.scss b/apps/client/src/features/editors/Editor.module.scss
index 9b15b6473..7ce5946ec 100644
--- a/apps/client/src/features/editors/Editor.module.scss
+++ b/apps/client/src/features/editors/Editor.module.scss
@@ -9,7 +9,7 @@ $panel-gap: 0.5rem;
 }
 
 .mainContainer {
-  background: $ui-black;
+  background-color: $ui-black;
   width: 100%;
   height: 100%;
   color: $ui-white;
diff --git a/apps/client/src/features/operator/Operator.module.scss b/apps/client/src/features/operator/Operator.module.scss
index 95a82915a..325e370db 100644
--- a/apps/client/src/features/operator/Operator.module.scss
+++ b/apps/client/src/features/operator/Operator.module.scss
@@ -2,6 +2,7 @@
   width: 100vw;
   height: 100vh;
 
+  background-color: $ui-black;
   color: $ui-white;
 }
 
diff --git a/apps/client/src/index.scss b/apps/client/src/index.scss
index 26a8a3b58..06ec7002e 100644
--- a/apps/client/src/index.scss
+++ b/apps/client/src/index.scss
@@ -6,8 +6,11 @@
   font-style: normal;
   font-display: swap;
   font-weight: 300;
-  src: url(@fontsource/open-sans/files/open-sans-latin-300-normal.woff2) format('woff2'), url(@fontsource/open-sans/files/open-sans-latin-300-normal.woff) format('woff');
-  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
+  src:
+    url(@fontsource/open-sans/files/open-sans-latin-300-normal.woff2) format('woff2'),
+    url(@fontsource/open-sans/files/open-sans-latin-300-normal.woff) format('woff');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329,
+    U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
 }
 
 /* open-sans-latin-400-normal */
@@ -16,8 +19,11 @@
   font-style: normal;
   font-display: swap;
   font-weight: 400;
-  src: url(@fontsource/open-sans/files/open-sans-latin-400-normal.woff2) format('woff2'), url(@fontsource/open-sans/files/open-sans-latin-400-normal.woff) format('woff');
-  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
+  src:
+    url(@fontsource/open-sans/files/open-sans-latin-400-normal.woff2) format('woff2'),
+    url(@fontsource/open-sans/files/open-sans-latin-400-normal.woff) format('woff');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329,
+    U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
 }
 
 /* open-sans-latin-600-normal */
@@ -26,11 +32,13 @@
   font-style: normal;
   font-display: swap;
   font-weight: 600;
-  src: url(@fontsource/open-sans/files/open-sans-latin-600-normal.woff2) format('woff2'), url(@fontsource/open-sans/files/open-sans-latin-600-normal.woff) format('woff');
-  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
+  src:
+    url(@fontsource/open-sans/files/open-sans-latin-600-normal.woff2) format('woff2'),
+    url(@fontsource/open-sans/files/open-sans-latin-600-normal.woff) format('woff');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329,
+    U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
 }
 
-
 $track-color: $white-1;
 $thumb-color: $gray-1100;
 $thumb-color-hover: $gray-900;
@@ -49,11 +57,15 @@ $thumb-color-hover: $gray-900;
   box-sizing: inherit;
 }
 
+body {
+  font-size: 15px;
+  font-family: $ontime-font-family;
+  background-color: var(--background-color-override, $ui-black);
+}
+
 body,
 html,
 .App {
-  font-size: 15px;
-  font-family: $ontime-font-family;
   margin: 0 auto;
   overflow: hidden;
   overflow: clip;
@@ -61,7 +73,6 @@ html,
   -webkit-user-select: none;
   user-select: none;
   -webkit-app-region: drag;
-  background-color: $bg-container-l1;
 }
 
 /* smaller root size for MacOS laptops */