style(dm): redesign dashboard with purple-gold theme

Redesign DM Dashboard (/dm/, /ru/dm/) with purple-gold theme (#534AB7 + #c8a84b):

Design System:
- Update dm-theme.css with 49 purple-gold tokens (transitions, shadows, hover states)
- Create DmTabs.astro with ARIA, keyboard nav, URL hash sync, localStorage persistence
- Create DmSidebar.astro for desktop navigation
- Redesign DmHeader with gold accent
- Update DmButton, DmCard, DmInput primitives
- Expand i18n to 47 strings

Layout:
- Redesign DmLayout with 3-column dashboard grid (sidebar|main|context)
- Update /dm/index.astro and /ru/dm/index.astro with named slots

Feature Components:
- DiceRoller: empty state, ARIA live, color-coded history, storage key fallback
- InitiativeTracker: HP editing, active highlighting, storage key fallback
- Open5eReference: skeletons, debounce, error retry, gold tabs
- NotesPanel: cross-tab sync, copy-to-clipboard, auto-save
- AuthPanel: VK/Yandex brand colors, pill buttons

Tests:
- Add 50 Playwright E2E tests (smoke, dice, initiative, reference, notes, data-migration)

Fixes:
- Document Open5e client.ts URL bugfix
- Add backward-compatible storage key fallback for dice/initiative
- Preserve legacy sessionStorage data on load

.sisyphus/evidence/visual-qa/mobile-ux-notes.md

@@ -0,0 +1,47 @@
+# Mobile UX Observations
+
+## Viewport Tested
+375x812 (iPhone X) and 390x844 (iPhone 12/13/14)
+
+## Tab Navigation
+- Mobile tabs are sticky below the header (`sticky top-[64px]`) and use `overflow-x-auto`
+- All 4 tabs (Кубики, Инициатива, Справочник, Заметки) are reachable via horizontal swipe
+- Tab pill buttons have `min-h-[44px] min-w-[80px]` which satisfies touch target intent, though quick-dice buttons fall slightly short (38px height)
+
+## Thumb Reachability
+- **Top tabs**: On 375px width, tabs span full width and sit near top of screen. The rightmost tab (Заметки) may be harder to reach with right-thumb one-handed use.
+- **Suggestion**: Consider moving primary navigation to bottom sheet or bottom tab bar for mobile. This would place controls within natural thumb reach zone (lower 2/3 of screen).
+
+## Content Density
+- Dice roller quick-buttons (d4–d100) are horizontally scrollable on mobile
+- Initiative tracker list items are tall enough for comfortable tapping
+- Open5e reference search + filter stack vertically; cards use 1-column grid on mobile which is appropriate
+- Notes textarea fills available width; comfortable for typing
+
+## Touch Target Gaps
+- 9 elements measured below 44px on mobile (see `touch-targets.md`):
+  - Quick-dice buttons (d4–d100) are 66x38px — width is good, height is 6px short
+  - Clear history button (Очистить) is 100x34px — needs height increase
+  - One input field is 163x42px — 2px short on height
+- **Recommendation**: Increase `py-2` to `py-2.5` or `min-h-[44px]` on quick-dice buttons and ghost buttons
+
+## Swipe Gestures / Bottom Sheet
+- Current tab switching requires precise tap on top tabs
+- **Bottom sheet opportunity**: A swipe-up bottom sheet for dice roll history or initiative details could reduce top-screen interaction
+- **Swipe-between-tabs**: Horizontal swipe on content area to switch tabs would feel native on mobile
+
+## Scroll Behavior
+- No horizontal overflow detected on mobile (body scrollWidth 360px within 375px viewport)
+- Vertical scrolling is smooth; sticky tabs remain accessible while scrolling
+
+## Visual Hierarchy
+- Purple accent (#534AB7) on dark background is highly visible
+- Gold headings (#c8a84b) stand out well against dark surfaces
+- Cards have adequate padding and border contrast on mobile
+
+## Keyboard UX
+- No on-screen keyboard overlap issues detected in screenshots
+- Input fields have visible focus rings (gold) on mobile
+
+## Overall Assessment
+Mobile layout is functional and readable. Primary UX improvement would be bottom-navigation or swipe gestures to reduce thumb travel to top tabs.