Change theme to gruvbox

brittle-ui/style.css

@@ -3,18 +3,18 @@
 *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
 
 :root {
-  --bg:           #1e1e2e;
+  --bg:           #1d2021;
-  --bg-surface:   #24243a;
+  --bg-surface:   #282828;
-  --bg-overlay:   #2e2e44;
+  --bg-overlay:   #3c3836;
-  --border:       #3a3a55;
+  --border:       #504945;
-  --accent:       #7c6af7;
+  --accent:       #d79921;
-  --accent-dim:   #5a4dcc;
+  --accent-dim:   #b57614;
-  --text:         #cdd6f4;
+  --text:         #ebdbb2;
-  --text-muted:   #7f849c;
+  --text-muted:   #a89984;
-  --text-subtle:  #585b70;
+  --text-subtle:  #928374;
-  --cursor-bg:    #3a3a70;
+  --cursor-bg:    #504945;
-  --cursor-fg:    #ffffff;
+  --cursor-fg:    #ebdbb2;
-  --focused-ring: #7c6af7;
+  --focused-ring: #d79921;
   --font-mono:    "JetBrains Mono", "Fira Code", "Cascadia Code", monospace;
   --font-ui:      system-ui, -apple-system, "Segoe UI", sans-serif;
   --radius:       4px;
@@ -22,6 +22,21 @@
   --cmd-h:        28px;
 }
 
+[data-theme="dark"] {
+  --bg:           #1d2021;
+  --bg-surface:   #282828;
+  --bg-overlay:   #3c3836;
+  --border:       #504945;
+  --accent:       #d79921;
+  --accent-dim:   #b57614;
+  --text:         #ebdbb2;
+  --text-muted:   #a89984;
+  --text-subtle:  #928374;
+  --cursor-bg:    #504945;
+  --cursor-fg:    #ebdbb2;
+  --focused-ring: #d79921;
+}
+
 html, body {
   height: 100%;
   background: var(--bg);
@@ -218,8 +233,8 @@ ul { list-style: none; }
   color: var(--cursor-fg);
 }
 
-.pub-item.pub-cursor .pub-meta { color: rgba(255,255,255,0.6); }
+.pub-item.pub-cursor .pub-meta { color: var(--text-muted); opacity: 0.8; }
-.pub-item.pub-cursor .pub-type { color: rgba(255,255,255,0.7); }
+.pub-item.pub-cursor .pub-type { color: var(--accent); }
 
 .pub-type {
   font-size: 10px;
@@ -335,7 +350,7 @@ ul { list-style: none; }
 }
 
 .command-status {
-  color: #f38ba8;
+  color: #fb4934;
   font-size: 12px;
 }
 
@@ -368,21 +383,21 @@ ul { list-style: none; }
   outline-offset: -1px;
 }
 
-/* ── Light theme (Catppuccin Latte) ──────────────────────────────────────── */
+/* ── Light theme (Gruvbox Light) ─────────────────────────────────────────── */
 
 [data-theme="light"] {
-  --bg:           #eff1f5;
+  --bg:           #f9f5d7;
-  --bg-surface:   #e6e9ef;
+  --bg-surface:   #fbf1c7;
-  --bg-overlay:   #dce0e8;
+  --bg-overlay:   #ebdbb2;
-  --border:       #ccd0da;
+  --border:       #d5c4a1;
-  --accent:       #7287fd;
+  --accent:       #af3a03;
-  --accent-dim:   #5c6bc0;
+  --accent-dim:   #d65d0e;
-  --text:         #4c4f69;
+  --text:         #3c3836;
-  --text-muted:   #8c8fa1;
+  --text-muted:   #7c6f64;
-  --text-subtle:  #acb0be;
+  --text-subtle:  #928374;
-  --cursor-bg:    #7287fd;
+  --cursor-bg:    #d5c4a1;
-  --cursor-fg:    #eff1f5;
+  --cursor-fg:    #3c3836;
-  --focused-ring: #7287fd;
+  --focused-ring: #af3a03;
 }
 
 /* ── Scrollbar (WebKit) ───────────────────────────────────────────────────── */