These were latent rendering bugs: --color-X holds raw HSL channels at
runtime (set by createThemeStore), so a bare var(--color-foreground) is
not a valid CSS color value — the browser falls back to inherited and
the affected elements render with the wrong color (often invisible
text on the same-colored background).
Mechanical wrap of every bare reference in the affected files:
var(--color-X) → hsl(var(--color-X))
var(--color-X, #fallback) → hsl(var(--color-X)) (fallback dropped)
color-mix(... var(--color-X) N%, transparent)
→ hsl(var(--color-X) / 0.NN)
Also re-mapped two long-removed token names:
--color-surface → --color-muted (subtle surface intent)
--color-destructive → --color-error (semantic alias)
190 refs across 19 files (habits, photos, notes, places, todo, cycles
helpers + their parent route shells). Brand-literal hex/rgba colors
left untouched (cycles pink, sport/category palettes, indigo→violet
gradients, photo placeholder gradients).
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
ea8ca13d37