feat(ui): big bundle — settings (theme/master/auto), purple default, mobile fit, master extraction

Settings expansion: 4 new keys (theme auto/light/dark, masterMode,
autoCallEnabled, autoCallSpeed 1-10) with per-key validators that
preserve old saved data. Default empty-cell color flipped from Tân
Tân blue to Excel Standard Purple #7030A0; preset palette swapped
to Office's 10 standard colors (5x2 grid). 15 new tests, 53 total.

Theme system: Tailwind v4 @variant dark (.dark *); applyTheme()
toggles <html class="dark"> based on settings.theme; auto mode
mirrors prefers-color-scheme via matchMedia listener (cleanly torn
down when switching modes). Existing dark-mode CSS converted from
@media to :where(.dark) selectors.

Mobile fit: PlayerBoard cells aspect-square on mobile, sm:aspect-[3/5]
desktop. Number text scales text-base sm:text-2xl md:text-3xl. Page
padding tightened (px-2 py-4 sm:px-3 sm:py-12). Container bumped
max-w-lg to max-w-2xl.

Header / footer: removed instructions toggle and "Trang quản trò"
link from player page. New PageFooter.svelte (tagline + Made by
miti99 with [SVG heart] link); also duplicated in PlayerBoard's
closing section-label band per request. Heart is inline SVG (red),
not emoji.

Master mode: extracted everything from /master route into reusable
MasterPanel.svelte. /master route slimmed to header + MasterPanel
+ footer. / mounts MasterPanel conditionally when settings.masterMode.
Storage prefixes unchanged.

Master tracking grid removed: per request, the 11x9 ones-digit
master board is gone. Host still gets controls, "Số vừa xổ" hero,
draw history list, and their own player card. Player card is enough.

Auto-call: single $effect lifecycle keyed on (autoRunning,
settings.autoCallSpeed, settings.autoCallEnabled). Setup / clear
setInterval cleanly across speed changes, master-mode toggle off,
component unmount, and "user disabled auto" mid-run. Button toggles
"Xổ số" -> "Bắt đầu / Dừng". Speed slider in Settings (only visible
when master mode is on). aria-label / aria-valuetext on slider.

Code-review nice-to-fixes applied: folded the two MasterPanel $effects
into one, removed muddled onkeydown on the SettingsButton modal
backdrop, added slider a11y attrs.

Docs: PDR / codebase-summary / system-architecture / development-roadmap
/ code-standards all synced to the new state.

web/docs/development-roadmap.md

@@ -15,15 +15,21 @@ The app is fully functional for core gameplay (Lô tô hội chợ Tân Tân var
   Kinh verification
 - Player card rendered as 3 stacked Tân Tân mini-cards
   (Minh Tân / Loại đặc biệt / Tấn tài tấn lộc) with cross-hatch dividers
-- Settings modal: empty-cell color picker (color picker + 8 presets +
-  reset), applies to player + master grids, persisted to `loto_settings`
+- Settings modal: 4 fieldsets (theme auto/light/dark, master mode toggle,
+  auto-call speed 1–10s, 10 color presets), persisted to `loto_settings`
+- Theme switcher (auto detects OS pref, explicit light/dark modes)
+- Master mode toggle (shows MasterPanel on `/`)
+- Auto-call timer with speed slider
+- Mobile-responsive cells (aspect-ratio + text scaling)
+- MasterPanel extracted component (reused on `/` and `/master`)
+- PageFooter with tagline + creator link
 - Host's own player card (isolated instance)
 - localStorage persistence
 - Dark mode
 - Mobile responsive
 - Offline capable
-- Unit tests (Vitest: 26 game-logic tests + 12 settings-store tests, 38 total passing)
-  covering constraint validation, persistence, and error handling
+- Unit tests (Vitest: 26 game-logic tests + 27 settings-store tests, 53 total passing)
+  covering constraint validation, persistence, theme/master-mode/auto-call logic, and error handling
 
 ## Idea Phase
 
@@ -33,8 +39,6 @@ Play celebratory chime or "Kinh!" voice snippet when row completes. Could use We
 ### Undo Last Cell
 Allow player to undo the most recent cross/uncross action. Requires change history or state snapshot. **Status**: Idea (low priority)
 
-### Theme Switcher
-Explicit light/dark toggle button instead of relying on OS preference. **Status**: Idea (Tailwind already supports OS toggle)
 
 ### PWA Install
 Add service worker and manifest for "Install App" prompt on Android/iOS. **Status**: Idea (would require server-side components)
@@ -104,3 +108,4 @@ All decisions follow **YAGNI** (You Aren't Gonna Need It), **KISS** (Keep It Sim
 Future work gates on **real user demand**, not speculation.
 
 Last reviewed: 2026-04-27
+Last synced: 2026-04-27 (6-phase refactor)