Dark mode: verify all pages render correctly in both themes

[Dandiggas]

Problem

Some components may still have hardcoded colors from the UI overhaul. Need a full sweep of both light and dark mode rendering.

Expected behaviour

All pages look correct in both themes. Grep for remaining hex values in component files and replace with theme tokens.

[Dandiggas]

Parked while design direction is decided. Explored on branch feature/dark-mode-verification (local, not pushed).

What was tried:

• Token sweep: replaced hardcoded slate-* / bg-white / hex values across StatsCard, TakeRecorder, CalendarHeatmap, PracticeChart, MobileNav, LoginPage with theme tokens (bg-card, border-border, text-foreground, etc.).
• Chart.js theme awareness via next-themes.useTheme for tick/grid colors.
• Palette tune: --card: #ffffff → #fbfbfa, --border: #e9e9e7 → #d8d7d4 to lift cards off pure-white light background (original issue: --card = --background in light mode, so bg-card was invisible).

Why it's parked:
Visual result was still unsatisfactory — cards/hero definition in light mode wasn't convincing even after the palette tune. The tokens are correct in principle but the values need design direction (shadow? stronger surface lift? different card treatment entirely?).

Pick-up notes:

• Branch commits: https://github.com/Dandiggas/MusiciansPracticeApp/commits/feature/dark-mode-verification (not pushed) — cherry-pick individually if any of it is useful.
• The unambiguous-bug subset (LoginPage focus:bg-white inverts dark mode; CalendarHeatmap text #a3aac4) could ship independently as a small PR.
• Hardcoded TW classes to keep as-is: text-white on destructive buttons, bg-black video letterboxes, bg-red-500 recording indicator, TagSelector 9-color palette, bg-yellow-400 on tuner.