/* ============================================================================
   PREVIOUSLY — DESERT GOLDEN HOUR THEME · DEFAULT SITE SKIN (James, 2026-10-06)
   ----------------------------------------------------------------------------
   Option 2 (James-approved palette):
     Background #FAF6EE · Cards #FFFFFF · Text #2A1C11
     Accent #C2410C (burnt orange) · Depth #92400E

   ACTIVATION: none needed — desert is the default. The variable remap below
   sits on plain `body`, so it applies from first paint with zero JS and zero
   flash. (Previously preview-gated behind body[data-theme="desert"]; flipped
   to default 2026-10-06 per James's approval.)

   ROLLBACK — two levels, both instant:
   1. In-browser: ?theme=classic (see js/theme-preview.js) sets
      body[data-theme="classic"], which restores the pre-flip noir values
      below. Zero deploy needed — for instant visual comparison.
   2. One-deploy revert: change the `body` selectors below back to
      body[data-theme="desert"]. The old theme values were never deleted
      from the base stylesheets; they are only superseded here.

   STABILITY CONTRACT:
   - --brand-* core tokens are never redefined here (James-confirmed, DO NOT
     CHANGE). Only the --pv-* accent family is remapped to burnt orange.
   - League/data-viz colors (--lg-green etc.) keep their meaning; only their
     light-surface legibility is adjusted.
   - Media wells stay dark (like YouTube in light mode). Wordmark keeps
     Rewind Red.
   ========================================================================== */

body {
  color-scheme: light;

  /* ---- Desert palette anchors (the default theme's foundation) ---- */
  --desert-bg: #FAF6EE;        /* warm cream — page background */
  --desert-card: #FFFFFF;      /* cards, sheets, modals */
  --desert-pressed: #F3EDE0;   /* pressed / deepest inset */
  --desert-ink: #2A1C11;        /* primary text */
  --desert-ink-dim: rgba(42, 28, 17, .68);   /* secondary text (~7:1) */
  --desert-ink-faint: rgba(42, 28, 17, .52); /* tertiary / hint text */
  --desert-rule: rgba(42, 28, 17, .14);      /* hairlines, idle borders */
  --desert-accent: #C2410C;    /* burnt orange — THE desert accent */
  --desert-accent-deep: #92400E;  /* depth — hover, pressed, gradients */
  --desert-accent-soft: rgba(194, 65, 12, .12);  /* soft wash (pills, active) */
  --desert-accent-faint: rgba(194, 65, 12, .07);
  --desert-accent-glow: rgba(194, 65, 12, .30);  /* focus rings, shadows */
  --desert-accent-glow-lg: rgba(194, 65, 12, .48);
  --desert-accent-ember: #E8762D;  /* luminous accent for dark wells inside desert */
  --desert-shadow: rgba(120, 84, 40, .14);  /* warm paper shadow base */

  /* ---- pv-* surfaces: noir cinematic -> desert daylight ---- */
  --pv-noir: var(--desert-bg);
  --pv-noir-2: var(--desert-card);
  --pv-noir-3: var(--desert-pressed);
  --pv-glass: rgba(250, 246, 238, .90);  /* sticky bars over content */

  /* ---- pv-* ink: bone -> espresso ---- */
  --pv-ivory: var(--desert-ink);
  --pv-ivory-dim: var(--desert-ink-dim);
  --pv-ivory-faint: var(--desert-ink-faint);
  --pv-rule: var(--desert-rule);

  /* ---- pv-* accent: Signal Red -> burnt orange ---- */
  --pv-red: var(--desert-accent);
  --pv-red-deep: var(--desert-accent-deep);
  --pv-red-ember: var(--desert-accent-ember);
  --pv-red-wine: var(--desert-accent-deep);
  --pv-red-glow: var(--desert-accent-glow);
  --pv-red-glow-lg: var(--desert-accent-glow-lg);
  --pv-red-ink: var(--desert-accent-deep);  /* accent as text — 7.2:1 on cream ✓ */
  --pv-live: var(--desert-accent);
  --pv-on-red: #FFFFFF;  /* text on burnt-orange fills (4.9:1 ✓) */

  /* ---- pv-* status: light-safe versions ---- */
  --pv-warn: #8A5A12;      /* 6.1:1 on cream */
  --pv-muted-ok: #3D6B4A;  /* 6.0:1 on cream */

  /* ---- pv-* shadows: black depth -> warm sand depth ---- */
  --pv-shadow-btn: 0 10px 34px var(--desert-accent-glow);
  --pv-shadow-btn-lg: 0 16px 44px var(--desert-accent-glow-lg);
  --pv-shadow-card: 0 18px 44px var(--desert-shadow);
  --pv-shadow-pop: 0 40px 120px rgba(120, 84, 40, .22), 0 0 0 1px rgba(194, 65, 12, .18);
  --pv-shadow-bar: 0 8px 28px var(--desert-shadow);
  --pv-shadow-card-hover: 0 14px 34px rgba(120, 84, 40, .20);
  --pv-shadow-chip-hover: 0 8px 20px rgba(120, 84, 40, .18);

  /* ---- pv-* focus: burnt-orange outline clears 3:1 on cream ---- */
  --pv-focus-outline: 2px solid var(--desert-accent-deep);
  --pv-focus-ring: 0 0 0 3px var(--desert-accent-glow);

  /* ---- brand surface/text tokens: remap to desert ---- */
  --surface-dark-deep: #2A1C11;      /* wells keep depth, warmed */
  --surface-dark: var(--desert-bg);
  --surface-dark-raised: var(--desert-card);
  --surface-dark-soft: var(--desert-pressed);
  --surface-paper: var(--desert-bg);
  --surface-cream: var(--desert-card);
  --surface-sand: var(--desert-pressed);
  --text-on-dark: var(--desert-ink);
  --text-on-dark-muted: var(--desert-ink-dim);
  --text-on-dark-faint: var(--desert-ink-faint);
  --brand-bg: var(--desert-bg);
  --brand-ink: var(--desert-ink);
  --brand-action: var(--desert-ink);       /* primary CTAs go espresso in desert */
  --brand-action-hi: #3E2A18;
  --brand-secondary: var(--desert-card);
  --brand-red-soft: var(--desert-accent-soft);
  --brand-red-faint: var(--desert-accent-faint);
  --brand-red-glow: var(--desert-accent-glow);
  --brand-ink-soft: var(--desert-rule);

  /* ---- livegrid (homepage dashboard) tokens ---- */
  --lg-bg: var(--desert-bg);
  --lg-surface: var(--desert-card);
  --lg-surface2: var(--desert-pressed);
  --lg-line: var(--desert-rule);
  --lg-mod-bg: #F7F1E3;
  --lg-red: var(--desert-accent);
  --lg-text: var(--desert-ink);
  --lg-muted: var(--desert-ink-dim);
  --lg-faint: var(--desert-ink-faint);
  --lg-green: #2E7D4F;   /* legible on cream, keeps meaning */
  --lg-gold: #8A5A12;
  --lg-blue: #1D5FBF;
  --lg-pink: #A83A6E;
}

/* ---- Hardcoded dark washes that variables can't reach ----
   These selectors carry literal dark values in the base stylesheets.
   Desert overrides live here so the noir foundation is superseded. */

/* Homepage hero: dark broadcast gradient -> desert sunrise wash */
body .lg-hero {
  background:
    radial-gradient(120% 90% at 50% 0%, #FFFDF8 0%, #FAF6EE 45%, #F3EDE0 100%);
}
body .lg-hero::after {
  background: repeating-linear-gradient(115deg, transparent 0 46px, rgba(194, 65, 12, .05) 46px 47px);
}

/* Breaking zone: keep urgency, warm the surround */
body .breaking-zone {
  --pv-breaking-bg: var(--desert-accent);
}

/* Night-mode hero blocks: translucent white -> warm sand */
body .nm-block {
  background: rgba(255, 255, 255, .72);
  border-color: var(--desert-rule);
}
body .nm-kicker {
  color: var(--desert-accent-deep);
}

/* Ticker: dark bar -> cream bar with espresso text */
body .lg-ticker {
  background: var(--desert-card);
  border-bottom-color: var(--desert-rule);
}
body .lg-ticker-label {
  background: var(--desert-accent);
  color: #FFFFFF;
}

/* Media wells (video players, image scrims) stay dark in every theme —
   a player is black in daylight too, like YouTube in light mode. */
body .pv-player,
body .pv-media-well,
body video {
  --pv-noir: #0A0A0B;
  --pv-ivory: #F4EFE6;
}

/* Wordmark: keep the Rewind Red glyph — the brand mark never changes hue.
   Only the surrounding page warms up. */
body .pv-wordmark .pv-rewind-glyph {
  color: var(--brand-red);
}

/* ============================================================================
   CLASSIC ROLLBACK SCOPE — pre-flip noir theme, preserved verbatim
   ----------------------------------------------------------------------------
   body[data-theme="classic"] restores every value the desert default
   supersedes above. Specificity (0,1,1) beats the desert `body` rules (0,0,1),
   so ?theme=classic (see js/theme-preview.js) shows the exact pre-flip look
   with zero deploy. Values transcribed from css/tokens.css :root,
   brand-tokens.css, and css/livegrid.css on 2026-10-06 — the old theme was
   never deleted from those files, only superseded here.
   ========================================================================== */
body[data-theme="classic"] {
  color-scheme: dark;

  /* ---- pv-* surfaces: back to noir cinematic ---- */
  --pv-noir: #0a0a0b;
  --pv-noir-2: #111113;
  --pv-noir-3: #17171a;
  --pv-glass: rgba(16,17,20,.82);

  /* ---- pv-* ink: back to bone ---- */
  --pv-ivory: #f4efe6;
  --pv-ivory-dim: rgba(244,239,230,.62);
  --pv-ivory-faint: rgba(244,239,230,.38);
  --pv-rule: rgba(244,239,230,.14);

  /* ---- pv-* accent: back to Signal Red family ---- */
  --pv-red: var(--brand-red);
  --pv-red-deep: var(--brand-red-deep);
  --pv-red-ember: var(--brand-red-ember);
  --pv-red-wine: var(--brand-red-deep);
  --pv-red-glow: rgba(var(--brand-red-rgb),.35);
  --pv-red-glow-lg: rgba(var(--brand-red-rgb),.55);
  --pv-red-ink: var(--brand-red-deep);  /* unread in dark default; mirrors light-query */
  --pv-live: var(--brand-red);
  --pv-on-red: #0a0a0b;

  /* ---- pv-* status: dark-surface hues ---- */
  --pv-warn: #d8a03c;
  --pv-muted-ok: #7ba889;

  /* ---- pv-* shadows: back to black depth ---- */
  --pv-shadow-btn: 0 10px 34px var(--pv-red-glow);
  --pv-shadow-btn-lg: 0 16px 44px var(--pv-red-glow-lg);
  --pv-shadow-card: 0 18px 44px rgba(0,0,0,.5);
  --pv-shadow-pop: 0 40px 120px rgba(0,0,0,.6), 0 0 0 1px rgba(var(--brand-red-rgb),.28);
  --pv-shadow-bar: 0 8px 28px rgba(0,0,0,.45);
  --pv-shadow-card-hover: 0 14px 34px rgba(0,0,0,.5);
  --pv-shadow-chip-hover: 0 8px 20px rgba(0,0,0,.4);

  /* ---- pv-* focus: back to red outline ---- */
  --pv-focus-outline: 2px solid var(--pv-red);
  --pv-focus-ring: 0 0 0 3px var(--pv-red-glow);

  /* ---- brand surface/text tokens: back to dark-first brand ---- */
  --surface-dark-deep: #0a0a0b;
  --surface-dark: var(--brand-bg);
  --surface-dark-raised: #141416;
  --surface-dark-soft: #1c1a17;
  --surface-paper: var(--brand-secondary);
  --surface-cream: #faf8f2;
  --surface-sand: #ece7da;
  --text-on-dark: #f4efe6;
  --text-on-dark-muted: #cfc9bb;
  --text-on-dark-faint: rgba(244,239,230,.55);
  --brand-bg: #101114;
  --brand-ink: #EDE6D6;
  --brand-action: #2B2B30;
  --brand-action-hi: #3d3d46;
  --brand-secondary: #F4F1EA;
  --brand-red-soft: rgba(232,50,30,.14);
  --brand-red-faint: rgba(232,50,30,.08);
  --brand-red-glow: rgba(232,50,30,.55);
  --brand-ink-soft: rgba(237,230,214,.14);

  /* ---- livegrid tokens: back to dark dashboard ---- */
  --lg-bg: #0b0b0f;
  --lg-surface: #141419;
  --lg-surface2: #1c1c24;
  --lg-line: #26262f;
  --lg-mod-bg: #111a2e;
  --lg-red: var(--brand-red);
  --lg-text: #f4f2ec;
  --lg-muted: #a7a3b8;
  --lg-faint: #6b6878;
  --lg-green: #35d07f;
  --lg-gold: #e8b64c;
  --lg-blue: #5aa9ff;
  --lg-pink: #e08bd0;
}

/* ---- Classic component restores (hardcoded dark washes) ---- */
body[data-theme="classic"] .lg-hero {
  background: radial-gradient(120% 90% at 50% 0%, #1a2340 0%, #101a33 45%, #0a1226 100%);
}
body[data-theme="classic"] .lg-hero::after {
  background: repeating-linear-gradient(115deg, transparent 0 46px, rgba(var(--brand-red-rgb), .05) 46px 47px);
}
body[data-theme="classic"] .nm-block {
  background: rgba(255,255,255,.045);
  border-color: rgba(255,255,255,.09);
}
body[data-theme="classic"] .nm-kicker {
  color: #ffb3ab;
}
body[data-theme="classic"] .lg-ticker {
  background: var(--surface-black);
  border-bottom-color: var(--lg-line);
}
body[data-theme="classic"] .lg-ticker-label {
  background: var(--lg-red);
  color: var(--text-on-dark);
}
/* .pv-player / .pv-media-well / video: desert keeps the dark base values
   (#0A0A0B / #F4EFE6) verbatim, so classic needs no restore there.
   .pv-wordmark .pv-rewind-glyph stays Rewind Red in every theme. */
