/* Wagercue design tokens (token contract v3, redesign wave R1: unified
   template - docs/design/UNIFIED-TEMPLATE-SPEC.md section 2/3). Chassis-owned
   contract: every theme defines exactly this variable set, tailwind.config.js
   maps utilities onto the variables, scripts/build_css.sh compiles one bundle
   per theme. Semantic var() colors trade away Tailwind opacity modifiers
   (bg-brand/50) by design; --rgb-* triplets carry the opacity-modifier path
   instead (decision 117), --color-* hex stays the single source of truth the
   contrast invariant parses.
   No AA nudge needed: the spec table's hex values clear the contrast
   invariant unmodified.
*/
:root {
  /* Declare the theme's rendering scheme so native form controls,
     scrollbars, and the browser's own surfaces match the palette
     instead of falling back to a light default under a dark ground. */
  color-scheme: dark;
  /* Brand (spec section 3 per-site expression table; ramp stops sourced from
     the live site's own tailwind.config.js brand ramp, see the ramp block
     below). */
  --color-brand: #ffa31a;
  --color-brand-strong: #f08a00;
  --color-brand-soft: #3d2200;
  /* Brand ink (R5 a11y fix): paired text color for bg-brand buttons/bands,
     same reasoning as --color-cta-ink above (white-on-amber measures
     2.0:1). Reuses the existing --color-brand-soft dark ink (7.36:1). */
  --color-brand-ink: #3d2200;
  /* Amber Terminal restoration (kb-ratified platforms/wagercue.md): the
     accent role carries the gold seal used for trust/verification badges,
     kept off the electric-amber brand register so a seal never reads as
     another brand button. */
  --color-accent: #f5b544;
  /* Ink on an accent surface (token contract v3.3, see tailwind.config.js):
     white-on-gold fails WCAG AA, so the ink is the existing dark
     --color-brand-soft value instead (8.11:1 against --color-accent above,
     computed via the WCAG relative-luminance formula). */
  --color-accent-ink: #3d2200;

  /* Clickout CTA (token contract v3.1, craft round R3, owner review):
     this site's Visit CTA reads --color-cta/--color-cta-strong instead of
     --color-brand, one register hotter (brighter) than the brand amber so
     the money action reads as distinct from the brand chrome elsewhere on
     the page. */
  --color-cta: #ffb13c;
  --color-cta-strong: #ffbc58;
  /* CTA ink (token contract v3.2, R5 a11y fix): the paired text color for
     bg-cta buttons. White-on-amber measures well under WCAG AA's 4.5:1
     floor for normal text, so this theme's ink is the existing
     --color-brand-soft dark ink instead of white (8.13:1 against
     --color-cta, computed via the WCAG relative-luminance formula). Every
     other theme's --color-cta-ink stays white since white already clears
     4.5:1 against their own cta color. */
  --color-cta-ink: #3d2200;

  /* Surfaces (kb-ratified Amber Terminal ground, restored exactly). */
  --color-page: #0b0e14;
  --color-surface: #12161d;
  --color-border: #594b36;
  --control-border: #78684e;

  /* Text (kb-ratified Amber Terminal ink, restored exactly). */
  --color-ink: #f3f6fb;
  --color-ink-muted: #9aa6bd;

  /* Danger (decision R2.1-A). Doubles as the ticker "loss" red - reserved
     for that semantic and real error/invalid-state text, never decorative. */
  --color-danger: #f43f5e;

  /* Canonical semantic roles. The shared logo tile stays explicitly light. */
  --page-ground: var(--color-page);
  --surface: var(--color-surface);
  --surface-raised: #181c24;
  --border: var(--color-border);
  --ink: var(--color-ink);
  --ink-muted: var(--color-ink-muted);
  --brand: var(--color-brand);
  --brand-strong: var(--color-brand-strong);
  --brand-soft: var(--color-brand-soft);
  --accent: var(--color-accent);
  --focus-ring: #ffa31a;
  --cta-primary: var(--color-cta);
  --cta-primary-hover: var(--color-cta-strong);
  --cta-secondary: var(--color-brand-soft);
  /* Ticker "win" green - reserved for that semantic, kept out of brand/CTA. */
  --success: #22c55e;
  --warning: #ffd166;
  --danger: var(--color-danger);
  --shadow-card: 0 1px 2px rgb(24 24 27 / 0.05), 0 10px 28px -14px rgb(24 24 27 / 0.16);
  --shadow-overlay: 0 20px 40px -18px rgb(24 24 27 / 0.32);

  --font-sans: system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-body: system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: system-ui, -apple-system, "Segoe UI", sans-serif;
  --radius-card: 0.625rem;
  --radius-control: 0.5rem;
  --radius-pill: 9999px;

  --texture: none;

  /* --- Token contract v2 (decision 117): RGB-triplet mirrors of the
     semantic hex tokens above, for Tailwind's rgb(var(--x) / <alpha-value>)
     opacity-modifier classes (bg-brand/50, border-ink/10, etc). Named
     --rgb-* (not --color-*) so tests/invariants/test_theme_contrast.py's
     hex-only parser over every --color-* declaration keeps passing
     unedited; the --color-* hex tokens above remain the single source
     of truth the contrast gate checks, resolved colors are identical. */
  --rgb-brand: 255 163 26; /* #ffa31a */
  --rgb-brand-strong: 240 138 0; /* #f08a00 */
  --rgb-brand-soft: 61 34 0; /* #3d2200 */
  --rgb-brand-ink: 61 34 0; /* #3d2200 */
  --rgb-accent: 245 181 68; /* #f5b544 */
  --rgb-accent-ink: 61 34 0; /* #3d2200 */
  --rgb-cta: 255 177 60; /* #ffb13c */
  --rgb-cta-strong: 255 188 88; /* #ffbc58 */
  --rgb-cta-ink: 61 34 0; /* #3d2200 */
  --rgb-page: 11 14 20; /* #0b0e14 */
  --rgb-surface: 18 22 29; /* #12161d */
  --rgb-border: 89 75 54; /* #594b36 */
  --rgb-control-border: 120 104 78; /* #78684e */
  --rgb-ink: 243 246 251; /* #f3f6fb */
  --rgb-ink-muted: 154 166 189; /* #9aa6bd */
  --rgb-danger: 244 63 94; /* #f43f5e */
  --rgb-page-ground: 11 14 20;
  --rgb-surface-raised: 24 28 36;
  --rgb-focus-ring: 255 163 26;
  --rgb-cta-primary: 255 177 60;
  --rgb-cta-primary-hover: 255 188 88;
  --rgb-cta-secondary: 61 34 0;
  --rgb-success: 34 197 94;
  --rgb-warning: 255 209 102;

  /* Generic brand ramp (decision 117), regenerated from this site's real
     legacy ramp (read-only source: wager-comparison-platform/tailwind.config.js).
     Read by tailwind.config.js as brand.50..950 utility colors. */
  --rgb-brand-50: 255 246 232;
  --rgb-brand-100: 255 233 194;
  --rgb-brand-200: 255 214 138;
  --rgb-brand-300: 255 174 56;
  --rgb-brand-400: 255 176 31;
  --rgb-brand-500: 255 163 26;
  --rgb-brand-600: 240 138 0;
  --rgb-brand-700: 231 126 0;
  --rgb-brand-800: 216 120 0;
  --rgb-brand-900: 107 60 0;
  --rgb-brand-950: 61 34 0;
  /* Generic neutral ramp: same lightness stops as the shared zinc scale,
     hue-biased toward this theme's brand hue (spec section 3: "neutrals get
     a slight hue bias toward the brand"). */
  --rgb-neutral-50: 250 250 250;
  --rgb-neutral-100: 245 245 244;
  --rgb-neutral-200: 231 230 228;
  --rgb-neutral-300: 216 214 212;
  --rgb-neutral-400: 170 166 161;
  --rgb-neutral-500: 123 119 112;
  --rgb-neutral-600: 90 87 83;
  --rgb-neutral-700: 69 67 64;
  --rgb-neutral-800: 42 41 39;
  --rgb-neutral-900: 27 26 24;
  --rgb-neutral-950: 10 10 10;
  --font-display: 'Space Grotesk', 'Avenir Next', 'Segoe UI', system-ui, sans-serif;
}