# LedGrab TODO ## WebUI Redesign — "Lumenworks" Studio-Console Aesthetic Full-app UI/UX refresh. Design direction committed to by user 2026-04-24. Mockup lives at [server/docs/ui-redesign-mockup.html](server/docs/ui-redesign-mockup.html). Phases are independent and CSS-only where possible — backend untouched. ### Phase 1 — Design tokens & font embed - [x] Embed variable fonts (`server/src/ledgrab/static/fonts/`): Manrope (latin + latin-ext + cyrillic + cyrillic-ext), JetBrains Mono (same 4 subsets), Big Shoulders Display (latin + latin-ext). Total +201 KB gzipped, served via `unicode-range` so only latin paints on first load. - [x] `fonts.css` — declare `@font-face` entries for all new families with proper `unicode-range` subsetting; keep DM Sans + Orbitron registered for legacy-token callers during migration. - [x] `base.css` — add additive Lumenworks tokens: `--font-display/--font-brand/--font-body`, `--lux-r-*`, `--lux-hairline`, `--lux-rule`. Both `[data-theme="dark"]` and `[data-theme="light"]` define `--lux-bg-0…3`, `--lux-line/-bold`, `--lux-ink/-dim/-mute/-faint`, `--ch-signal/-cyan/-magenta/-amber/-coral/-violet`, `--lux-signal-glow`, `--lux-shadow-rack`. Existing tokens untouched — no visual regression. ### Phase 2 — Shell (header → transport bar + channel-strip sidebar) - [x] `index.html` — `.tab-bar` moved out of `
` into a new `