/* Aurora design tokens — deep-space base (HBO Max) with glassy, restrained
   chrome and big confident type (Apple TV). */
:root {
  /* Canvas */
  --bg: #0b0c14;
  --bg-raised: #131523;
  --bg-wash: radial-gradient(120% 90% at 70% -20%, rgba(93, 78, 214, 0.22), transparent 60%),
             radial-gradient(80% 60% at 0% 0%, rgba(43, 108, 176, 0.12), transparent 55%);

  /* Surfaces & lines */
  --surface: rgba(255, 255, 255, 0.06);
  --surface-hover: rgba(255, 255, 255, 0.11);
  --line: rgba(255, 255, 255, 0.09);
  --glass: rgba(13, 14, 24, 0.72);

  /* Text */
  --text: #f3f4f8;
  --text-dim: #9aa1b5;
  --text-faint: #616880;

  /* Accent — used sparingly */
  --accent: #8b7bff;
  --accent-strong: #6c58ff;
  --progress: #8b7bff;

  /* Focus (10-foot UI) */
  /* Tighter drop-shadow (smaller blur radius) — big blurs are costly to
     re-composite on every focus move on a TV GPU. The 3px ring is the cue. */
  --focus-ring: 0 0 0 3px rgba(255, 255, 255, 0.95), 0 10px 24px rgba(0, 0, 0, 0.5);

  /* Shape */
  --radius-s: 8px;
  --radius: 12px;
  --radius-l: 18px;

  /* Type scale */
  --font: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI Variable Display",
          "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --fs-hero: clamp(2.4rem, 4.5vw, 4.2rem);
  --fs-title: clamp(1.5rem, 2.4vw, 2.2rem);
  --fs-row: 1.25rem;
  --fs-body: 1rem;
  --fs-small: 0.85rem;

  /* Motion */
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --t-fast: 160ms;
  --t-med: 280ms;

  /* Layout */
  --page-x: clamp(24px, 4.5vw, 64px);
  --nav-h: 68px;
}