/* ========================================================= AUTH STYLES — shared across /auth/*.html Auth-specific components (hero, form-section, form-head, logo, card grids). Tokens come from core/ds-tokens.css which is loaded BEFORE this file in every auth HTML. Auth surfaces ship in the Mega Ride DS V3 "hero dark" treatment always — the cinematic Rolex / Aston Martin pattern on login pages. Each auth HTML declares `` to force the dark token set regardless of the app's default theme. Rebranding for a new company means editing: 1. core/ds-tokens.css (whole-brand re-theme) 2. core/config.js (company strings via APP_CONFIG) 3. assets/brand/* (logo, hero video, favicon) Page-specific styles stay inline in their respective .html. ========================================================= */ *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } html { height: 100%; } body { min-height: 100%; font-family: var(--font-sans); background: var(--surface-page); color: var(--text-primary); display: flex; flex-direction: column; font-size: 14px; line-height: 1.6; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; } /* Dark mode — Personnalité vertical drama gradient (royal navy → navy-black). Mirrors dispatch-styles.css and the public website. The hero stays dark regardless (always-dark hero rule), so its background sits on top of this. */ [data-theme="dark"] body, body.dark, body.theme-dark { background: linear-gradient(180deg, var(--surface-page) 0%, var(--surface-gradient-end) 100%) var(--surface-gradient-end) fixed; } /* ── HERO ── Supports either a background image OR a