* feat(appearance): add theme, accent, contrast, and typography personalization
Expand Settings to Appearance into a full personalization surface and add a
quick switcher to the top bar (the palette button between search and
notifications). Choices are saved to the browser, sync across tabs, and apply
before first paint so there is no flash on reload.
- Themes: Dim (the default raised charcoal), OLED true black, Light, and Auto
(follows the OS and re-resolves live when it flips).
- Accent: an eight-hue wheel (cyan default) that drives the one data color
across charts, rails, focus rings, active states, and the ambient glow.
- Fine-tune sliders: a master Contrast that spreads page, ink, and borders
together, plus Border brightness and Ambient glow.
- Typography: swappable interface (Geist / IBM Plex Sans / Hanken Grotesk) and
data (Geist Mono / IBM Plex Mono / Fira Code) faces, and a text-size control
(continuous slider in Settings, S/M/L/XL presets in the popover, kept in
sync). The display serif stays locked as the signature face.
Surfaces, borders, and ink derive from per-theme lightness values so the live
knobs scale the whole UI through CSS, and the opaque directional borders read on
every panel including true black. A live preview reflects changes in real time.
Adds a documentation page under Features.
* fix(appearance): keep contrast-driven tokens in gamut and add picker keyboard nav
Clamp the contrast and knob driven surface, border, and ink lightness so the
full slider range stays a valid color. The page now always sits below the card
tone, so page/card separation no longer collapses at high contrast in Light; the
lit border edge never reaches white in Light at the low end of the knobs; and the
OLED and Dim extremes resolve to valid black/white instead of out-of-range values.
Add the radiogroup keyboard model (roving tabindex plus Arrow / Home / End) to the
accent and type pickers through a shared hook, matching the segmented control. One
item is tabbable and arrow keys move focus and selection together.
The previous `<link rel="icon">` pointed at `/sencho-logo.png`, which is
not present in `frontend/public/`, so every page load 404'd the favicon
and browser tabs fell back to the generic globe glyph.
Point the icon at the two PNGs that actually ship in `frontend/public/`
(`sencho-logo-dark.png` and `sencho-logo-light.png`) and let the browser
pick the right one via `prefers-color-scheme`. Add an `apple-touch-icon`
so iOS home-screen pinning gets a real asset instead of a screenshot.
- Repoint --chart-1..3 to brand/warning/destructive so cyan leads as the
primary data color, amber marks peaks, rose marks errors. --chart-4/5
fall back to neutral greyscale tones tuned per theme.
- Add --data-line-width (1.25px) and --data-peak tokens so sparklines
across dashboard, stack table, and readiness views share one source
of truth instead of re-deriving per component.
- Introduce five semantic label role aliases (env, role, owner, risk,
custom) mapped to existing hues. Raw ten-hue palette stays in place
for existing consumers; new labels should consume roles.
- Replace Georgia serif with Instrument Serif and add --font-display
alias in both :root and .dark; expose font-display via @theme inline
so Tailwind utility classes can use it. Load the family from Google
Fonts alongside Geist + Geist Mono.
The /envs endpoint now filters to only return env files that actually exist
on disk, and absolute env_file paths from compose files (e.g. shared
globals.env in a sibling directory) are no longer rejected. The inline
theme-detection script is moved to an external file to comply with CSP.
Install motion + animate-ui, overhaul design tokens with brand cyan accent,
and replace CSS keyframe animations in Dialog, Tabs, Switch, and Tooltip
with spring-physics and blur-fade transitions via animate-ui Radix primitives.