Replace raw checkboxes + stacked-label dropdowns with pill toggle chips
(.chip, accent when checked via :has) and a single aligned toolbar row;
result count as a badge. Adds reusable .toolbar/.chip/.field components.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Phase A+dashboard of the UI redesign:
- variables.css: light-default tokens + [data-theme=dark] overrides; old var
names aliased to theme tokens so existing markup adapts to both themes
- style.css: refined components (card/btn/nav/badge/bar/table/forms), tokenized
the dark-assuming rgba colors
- theme toggle: pre-paint init in base.html <head> + toggleTheme() in common.js,
persisted to localStorage; toggle button in sidebar
- sidebar.html: labeled nav with sections (분석/파이프라인/제작), active state,
account; Korean labels
- dashboard.html: tokenized inline colors; verified light & dark with real data
Spec: docs/superpowers/specs/2026-06-12-ui-redesign-design.md
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
- publish.html: status column uses shared .badge (badge-muted/warning/
success) instead of its own .st-badge inline-color span
- collection.html / discover.html: drop .filter-sel rules now that the
shared `select` styling covers them (row-sel kept for compact inline)
- style.css: .gap-2 uses var(--space-2) for token consistency
No behavior change; follow-up cleanup from the design-uplift review.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
