diff --git a/services/web-ui/src/css/app.css b/services/web-ui/src/css/app.css
index fa5497d..93a55de 100644
--- a/services/web-ui/src/css/app.css
+++ b/services/web-ui/src/css/app.css
@@ -2,11 +2,12 @@
  *
  * IMPORTANT: All @import must come first per CSS spec / postcss-import
  * requirements. Tailwind directives below; cascade order in the emitted
- * bundle is: tokens → primitives → tailwind base → tailwind components
- * → tailwind utilities. Utilities win on specificity, primitives win
- * over base where they share specificity.
+ * bundle is: tokens → shell → primitives → tailwind base → tailwind
+ * components → tailwind utilities. Utilities win on specificity,
+ * primitives win over base where they share specificity.
  */
 @import "./components/tokens.css";
+@import "./components/shell.css";
 @import "./components/sidebar.css";
 @import "./components/topbar.css";
 @import "./components/button.css";
@@ -29,42 +30,25 @@
 @font-face {
   font-family: 'Inter';
   src: url('/fonts/inter-400.woff2') format('woff2');
-  font-weight: 400;
-  font-style: normal;
-  font-display: swap;
+  font-weight: 400; font-style: normal; font-display: swap;
 }
 @font-face {
   font-family: 'Inter';
   src: url('/fonts/inter-500.woff2') format('woff2');
-  font-weight: 500;
-  font-style: normal;
-  font-display: swap;
+  font-weight: 500; font-style: normal; font-display: swap;
 }
 @font-face {
   font-family: 'Inter';
   src: url('/fonts/inter-600.woff2') format('woff2');
-  font-weight: 600;
-  font-style: normal;
-  font-display: swap;
+  font-weight: 600; font-style: normal; font-display: swap;
 }
 @font-face {
   font-family: 'JetBrains Mono';
   src: url('/fonts/jetbrains-mono-400.woff2') format('woff2');
-  font-weight: 400;
-  font-style: normal;
-  font-display: swap;
+  font-weight: 400; font-style: normal; font-display: swap;
 }
 @font-face {
   font-family: 'JetBrains Mono';
   src: url('/fonts/jetbrains-mono-600.woff2') format('woff2');
-  font-weight: 600;
-  font-style: normal;
-  font-display: swap;
-}
-
-html {
-  font-family: var(--font);
-  background: var(--bg-base);
-  color: var(--text-primary);
-  -webkit-font-smoothing: antialiased;
+  font-weight: 600; font-style: normal; font-display: swap;
 }