---

id: 42d42d07-1478-49ed-a458-528bff123eff title: Tokyo Night light theme (prefers-color-scheme) state: closed labels:

• area:render assignees: [] milestone: m6-polish created: 2026-09-10T05:33:13.658101794Z updated: 2026-09-10T05:49:54.144585820Z

---

Context: Owner review round. Light theme must respect OS setting, default dark. Tasks:

1. Refactor style.css to CSS variables: :root = Tokyo Night dark (current values); @media (prefers-color-scheme: light) = Tokyo Night Light palette (bg #d5d6db-ish storm? use official tokyonight-light: bg #d5d6db, fg #343b58, blue #34548a, cyan #0f4b6e, red #8c4351, green #33635c — verify sane contrast, adjust only if unreadable). All rules reference vars; NO duplicated rule bodies.
2. theme-color meta: two tags with media attrs (dark/light) — coordinate with #16 (if #16 merged first, extend it; else include both tags here and note the overlap to supervisor).
3. color-scheme: dark light on :root (already? verify) so form controls follow browser.
4. Tests: CSS var asserts (no hardcoded palette hex outside :root/light blocks — grep test on limited palette list), light media block present, theme-color tags present.
5. Budget: still <15KB total. Success rubric:

• Dark unchanged pixel-wise (eyeball index before/after); light readable (supervisor checks); OS switch respected with zero JS. Swarm: Owl. Branch m6/light-theme. Coordinate CSS with #18 owner (both touch style.css — merge #18 first, rebase this).