/* ========================================================================= Throw — Mobile Polish v5.7 ------------------------------------------------------------------------- Build marker (in case of cache surprises): To verify the new file is loaded, open the page in DevTools and search for the string "MOBILE-V5_7-LOADED" — it appears as a CSS variable declaration on :root below. ------------------------------------------------------------------------- v5.7 changes vs v5.6: - MOBILE APP READINESS PASS (2026-05). Whole-app additions for phone-as-app form (Android WebView wrap + iOS Safari Add-to- Home-Screen). New section appended at end of file: • Safe-area insets honored on all fixed/floating UI (toasts, FABs, bottom action rows). Stops the gesture bar / home indicator eating tap targets. • 100dvh swaps applied defensively to common patterns (min-height: 100vh, min-height: calc(100vh - Npx)) so the layout sizes to the *visible* viewport, not the URL-bar- collapsed phantom viewport. Falls back to 100vh on browsers without dvh support. • touch-action: manipulation on every button/link to remove the 300ms tap delay on Android Chrome / WebView. • Action-row defensiveness: .ctrl-actions, .action-row, .over-actions, .modal-actions, #setupActionBtns all guaranteed to wrap rather than overflow on 360px phones. min-width: 0 enforced so labels can shrink/ellipsis instead of clipping. • Tap-target floor: every button, link, .btn, input gets min-height: 44px (Apple HIG / Android Material 48dp ish). • iOS Safari zoom-on-focus killed by enforcing 16px font on every text input field-wide (defensive — many pages already do this per-input). • Pull-to-refresh containment via overscroll-behavior so the WebView doesn't bounce-load on accidental top-edge pulls. • Tap-highlight color removed — the grey flash on Android Chrome looks like a bug, not a feature, in app form. ------------------------------------------------------------------------- v5.6 changes vs v5.5: - Auth polish: compact floating lang pill, translucent in light theme. - Auth forms vertically centred in the viewport (no more dead zone). - Crisper input chrome and a brand focus ring. - Helper links tightened and given real 44px tap targets. - reset_password.html: card chrome dropped, footer hidden, label spacing fixed — now matches the login/register feel. - Topbar sign-out demoted to a quiet text link on signed-in pages. - WELCOME [name] hero: solid white + purple glow instead of low- contrast gradient (gradient stops merged into dark bg). - Marketing footer collapsed to legal-only on signed-in pages. - Notification bell icon SVG restored (was empty button). - Topbar-nav variant (game.html, dartbot.html) now hides tier badge, username, and inline page-label on mobile so the right side doesn't overflow off-screen. Matches .topbar-right behaviour. - Lobby (.lb-wrap) edge padding restored — headings, filter labels, and the search input were clipping at the viewport edge. - League Manager stat chips switched from flex-wrap to explicit 3-column grid so the 5 tiles read as 3 + 2 rather than 4 + 1 orphan. - Player-card stat tiles flattened on mobile (no more bordered boxes-within-boxes). - teams.html / profile.html: page edge gutters restored, page header stacked vertically, "+ New Team" promoted to full-width primary gradient CTA, Join a League card restructured to a clean stacked flow. Empty state's duplicate button removed (top button is enough). - profile.html: QR section centered + condensed; FREEPLAY plan card's locked features moved into a soft "Pro adds" sub-section (replaces the red-X "rejected" treatment); section spacing opened up. - my-moderation.html: top-bar stacks vertically on mobile and reserves right-padding so the heading doesn't run under the floating lang pill. - admin-disputes.html / admin-misconduct.html: same top-bar fix, plus toasts moved to bottom so they don't collide with the floating pill. - Darts-used selector (dartbot/icon-match): label promoted to a clear section header, segment buttons flex to fill the row for proper tap targets. - index.html (marketing landing): hero stats restored to 3-up grid on mobile (was wasteful 1-up stack), steps section grid layout fixed (was cramped 3-col flex), game-modes pill grid and chip styling added (production CSS was missing entirely), final CTA buttons full-width, section padding eased from 100px to 56px on mobile. - autoscorer.html: secondary "AUTOSCORER" title in topbar hidden on mobile (was clipping behind floating pill); live-chip promoted to small pill background so "No camera" / "Live" reads as a status. - Legal pages (privacy / terms / refund): horizontal gutters restored. The shared .legal-body padding rule was overriding .page-container's horizontal padding, causing body text to run to the viewport edge. - match-view.html: header (.hdr) stacks vertically on mobile so the back button doesn't wrap; flex-whitespace bug in the camera placeholder text fixed via wrapping span. - Light-theme regression fix: the v5.6 `:root` color override and body-bg override were bleeding into light theme (because :root matches html regardless of data-theme). Re-scoped both to dark theme only. - Dashboard light-theme gaps filled: .mt-wide and .mt-slim tiles (Online Lobby, Online Match, Statistics, Dartbot, Icons rows) had hardcoded dark-navy backgrounds with no light-theme overrides. Added theme-aware fills directly in dashboard.html. Sign-out link color also given a dark muted variant for light topbar contrast. - profile.html theme bootstrap: now reads localStorage / system preference (was hardcoded to "dark"). Removed an IIFE near the end of the page that was clobbering localStorage.treblo-theme back to "dark" on every page load — that bug was breaking theme preference for ALL pages (any visit to profile reset light theme to dark). - .field label / input / select / textarea / placeholder color overrides scoped to dark theme only. They had been forcing white text/translucent-white-on-bg regardless of theme, making the "Game Mode" / "Best Of" labels and other form labels invisible in light theme. - profile.html: added a working theme toggle in a new "Appearance" section between Account Info and Subscription. Tappable DARK/LIGHT labels and pill with sliding knob; persists to localStorage so every page's bootstrap script picks it up. "Match system theme" link clears the saved preference to revert to OS-follow. The previously hidden .theme-toggle-wrap markup (lines 560-564) was removed from the topbar — the new section uses a body-level layout that's more discoverable and doesn't compete with the bell/lang/ sign-out cluster on mobile. ------------------------------------------------------------------------- v5.5 changes vs v5.4: - Gap below Sign-in button halved (60px → 30px). - "← Back to homepage" link hidden on mobile auth screens. ------------------------------------------------------------------------- Full mobile design pass. Drop-in stylesheet, loaded LAST in . Scoped to <= 720px so desktop is never affected. Sections 0. Mobile dark-theme lift (token overrides — lifts whole app) 1. Global mobile foundations (overflow, tap targets, inputs) 2. Homepage top nav (