chore: CSS audit — dark mode badge overrides and surface-hover variable

CHANGELOG.md

@@ -9,7 +9,11 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Added
 
-- Responsive layout — stats cards, gem grid, and tables adapt to narrow viewports; two-column grids (cache size, cache timeline) collapse to single column at 768px; tables scroll horizontally at 640px; split page headers stack vertically; main padding and header padding reduce on small screens
+- Responsive layout
+
+### Fixed
+
+- CSS audit — badge colours now respond to dark mode via `[data-theme="dark"]` overrides; table row hover uses `--surface-hover` CSS variable instead of a hardcoded hex value; `--surface-hover` added to `:root` and dark mode token set — stats cards, gem grid, and tables adapt to narrow viewports; two-column grids (cache size, cache timeline) collapse to single column at 768px; tables scroll horizontally at 640px; split page headers stack vertically; main padding and header padding reduce on small screens
 - Empty-state improvements — all list views now show a contextual title and an actionable hint; search result empty states include a "Clear search" link; history and stats link to active jobs; processes and recurring tasks explain what to do next
 - Inline notifications — bulk and single-job actions now surface a flash notice; Turbo Stream discard responses prepend the message to the page without a full reload; bulk discard/retry counts are shown ("3 jobs discarded")
 - Dark mode — toggle button in the header switches between light and dark palettes; preference persisted in `localStorage`; respects `prefers-color-scheme` on first visit; driven entirely by CSS custom properties on `[data-theme="dark"]`

ROADMAP.md

@@ -11,7 +11,6 @@ The path to v1.0.0 is staged: first achieve feature parity with `solid_queue_das
 > _Make the interface feel fast and operational, not just functional._
 
 ### Added
-- **CSS audit** — review all inline styles, consolidate utility classes, remove duplication, and enforce consistent use of CSS custom properties across all stylesheets
 
 ---
 

app/assets/stylesheets/solid_stack_web/_01_base.css

@@ -12,8 +12,9 @@
   --success: #198754;
   --info:    #0dcaf0;
   --purple:  #6f42c1;
-  --radius:  6px;
-  --shadow:  0 1px 3px rgba(0,0,0,.08);
+  --radius:        6px;
+  --shadow:        0 1px 3px rgba(0,0,0,.08);
+  --surface-hover: #f9fafb;
 }
 
 body {

app/assets/stylesheets/solid_stack_web/_04_table.css

@@ -25,7 +25,7 @@
 }
 
 .sqw-table tbody tr:last-child td { border-bottom: none; }
-.sqw-table tbody tr:hover { background: #f9fafb; }
+.sqw-table tbody tr:hover { background: var(--surface-hover); }
 
 .sqw-actions { text-align: right; white-space: nowrap; }
 .sqw-actions form { display: inline; }

app/assets/stylesheets/solid_stack_web/_12_dark_mode.css

@@ -1,18 +1,30 @@
 [data-theme="dark"] {
-  --bg:      #0d1117;
-  --surface: #161b22;
-  --border:  #30363d;
-  --text:    #e6edf3;
-  --muted:   #8b949e;
-  --primary: #58a6ff;
-  --danger:  #f85149;
-  --warning: #d29922;
-  --success: #3fb950;
-  --info:    #39c5cf;
-  --purple:  #bc8cff;
-  --shadow:  0 1px 3px rgba(0,0,0,.4);
+  --bg:            #0d1117;
+  --surface:       #161b22;
+  --border:        #30363d;
+  --text:          #e6edf3;
+  --muted:         #8b949e;
+  --primary:       #58a6ff;
+  --danger:        #f85149;
+  --warning:       #d29922;
+  --success:       #3fb950;
+  --info:          #39c5cf;
+  --purple:        #bc8cff;
+  --shadow:        0 1px 3px rgba(0,0,0,.4);
+  --surface-hover: #1c2128;
 }
 
+[data-theme="dark"] .sqw-badge--ready      { background: rgba(63,185,80,.15);   color: var(--success); }
+[data-theme="dark"] .sqw-badge--scheduled  { background: rgba(57,197,207,.15);  color: var(--info); }
+[data-theme="dark"] .sqw-badge--claimed    { background: rgba(88,166,255,.15);  color: var(--primary); }
+[data-theme="dark"] .sqw-badge--blocked    { background: rgba(210,153,34,.15);  color: var(--warning); }
+[data-theme="dark"] .sqw-badge--failed     { background: rgba(248,81,73,.15);   color: var(--danger); }
+[data-theme="dark"] .sqw-badge--paused     { background: rgba(139,148,158,.15); color: var(--muted); }
+[data-theme="dark"] .sqw-badge--queue      { background: rgba(139,148,158,.15); color: var(--muted); }
+[data-theme="dark"] .sqw-badge--worker     { background: rgba(88,166,255,.15);  color: var(--primary); }
+[data-theme="dark"] .sqw-badge--supervisor { background: rgba(63,185,80,.15);   color: var(--success); }
+[data-theme="dark"] .sqw-badge--dispatcher { background: rgba(210,153,34,.15);  color: var(--warning); }
+
 [data-theme="dark"] .sqw-flash--notice { background: #1b3a2b; color: #3fb950; border-color: #2d6a4f; }
 [data-theme="dark"] .sqw-flash--alert  { background: #3d1118; color: #f85149; border-color: #6a2030; }