Redesign to dark-mode-only with navy palette and accent colors (#13)
Removes light mode entirely in favour of a permanent dark theme with a
navy-tinted background and three signature accents (electric blue,
amber/gold, coral) exposed as CSS custom properties and Tailwind
utilities (bg-electric, text-amber-accent, text-coral-accent).
- Set class="dark" on <html> and apply Clerk dark base theme
- Rewrite app.css: single :root palette (oklch navy values), custom
--electric / --amber-accent / --coral-accent variables, remove
duplicate .dark block and light-mode bg-white/bg-gray-950 rule
- Install @clerk/themes for Clerk dark modal support
- Replace hardcoded Tailwind colors across 30+ files:
- Draft grid cells: blue-50/blue-950 → electric/15, green-50/950 → emerald/10
- Timer: green-600/yellow-600/red-600 → emerald-400/amber-accent/coral-accent
- Status badges: blue-50/green-50/gray-50 → electric/emerald/muted variants
- Success messages: green-500/15 text-green-700 dark:text-green-400 → emerald-500/15 text-emerald-400
- Info cards: blue-50 dark:bg-blue-950 → electric/10
- Warning cards: yellow-500 → amber-accent variants
- Medal/placement badges: yellow-500/orange-600 → amber-accent/coral-accent
- Movement indicators: green-600/red-600 → emerald-400/coral-accent
- Connection dots: green-500/red-500 → emerald-500/coral-accent
- Remove dark:hidden/dark:block logo toggle in welcome.tsx (always dark)
- Update DraftGrid test assertions to match new class names
Co-authored-by: Claude Sonnet 4.6 <noreply@anthropic.com>
1584d34b89