/* SOURCE OF TRUTH -- edit brand color here; propagates to all web surfaces on deploy; run scripts/sync-tokens.mjs to propagate primitives to mobile. */
/* Brand System v1.4 Wave 0: PRIMITIVES ONLY (the gold/slate/plum ramp). Per the layered model each web
   surface keeps its OWN thin semantic layer (--bg/--text/--bg-chrome/...) and its OWN dark block locally;
   only these primitives are shared. Values copied VERBATIM from index.html's :root. Linked BEFORE each
   surface's <style> so the local semantic/dark blocks still win the cascade. */
:root{
  /* Brand tokens (Goldenrod + cool blue-gray slate) */
  --gold-50:#FFFBED;--gold-100:#FFF3CC;--gold-200:#FFE899;--gold-300:#FFDC5C;
  --gold-400:#FFC424;--gold-500:#E5A800;--gold-600:#B88600;--gold-700:#8A6400;--gold-800:#5C4300;--gold-900:#2E2100;
  /* Brand v1.5 P1: cooler blue-gray neutral ramp (50-400). 500-900 unchanged (dark mode unaffected). */
  --slate-50:#F7F9FB;--slate-100:#EEF2F6;--slate-200:#E1E7EF;--slate-300:#CBD3DF;
  --slate-400:#96A1B1;--slate-500:#7A7A78;--slate-600:#5A5F6B;--slate-700:#3A3F4A;--slate-800:#20242E;--slate-900:#14181F;
  /* Brand v1.6.1: full plum ramp promoted into the source of truth (values verbatim from the
     guidelines palette, which had been carrying them as a hardcoded copy; -500 unchanged). */
  --plum-50:#F4ECF7;--plum-100:#E0CCEA;--plum-200:#C9A8D8;--plum-300:#A578BB;
  --plum-400:#6B3D7C;--plum-500:#4B2659;--plum-600:#321A3D;--plum-700:#231229;--plum-800:#150B19;--plum-900:#0A050D;
  /* Brand v1.4 Wave 4: teal accent primitive (light values). The dark flip (--teal:#14B8A6)
     lives in each surface's own [data-theme=dark] block, NOT here -- tokens.css stays :root-only
     so scripts/sync-tokens.mjs copies it verbatim into the offline mobile bundle. Teal is a
     sanctioned accent ONLY (one data-viz series, empty states, onboarding/highlight micro-moments);
     never core chrome, dense tables, primary buttons, or a semantic; footprint <= plum; and NEVER
     adjacent to --success green (they measure 1.09:1). */
  --teal:#0F766E;--teal-strong:#14B8A6;--teal-tint:#5EEAD4;
  /* Brand v1.8 P2: teal wash + ink stops so teal homes (empty states, tip toasts,
     onboarding micro-moments) can pair a tint background with an AA ink without
     reaching for raw hex. Ramp order light->dark: 50, 100, tint, strong, base, 700. */
  --teal-50:#F0FDFA;--teal-100:#CCFBF1;--teal-700:#115E59;
  /* Brand v1.8 P2: THE shared sequential heat ramp -- route-map heat, report
     intensity bars, and any future density viz resolve through these five stops.
     Plum sequential per the v1.8 decision (a slate sequential is the documented
     fallback wherever plum would collide with nearby plum UI). Aliased into the
     plum ramp so a live plum edit re-tunes heat everywhere. Dark mode softens the
     END STOPS ONLY (in each surface's dark block) so ramp ORDER survives both
     themes -- ink pairing rule: stops 1-3 take var(--plum-700) ink, 4-5 take #fff. */
  --heat-1:var(--plum-50);--heat-2:var(--plum-200);--heat-3:var(--plum-300);--heat-4:var(--plum-400);--heat-5:var(--plum-500);
  /* Brand FINAL B2: the INFO semantic family — the sanctioned home for informational
     blue (progress banners, radius/geo map overlays, forecast trend series, "now"
     markers). Five stops consolidate the ad-hoc Tailwind blues that grew in the app
     (1E3A8A/1E40AF -> ink, 2563EB/1D4ED8/3B82F6 -> base, 60A5FA/93C5FD -> soft,
     DBEAFE -> light wash, EFF6FF -> faint wash). Informational is FUNCTIONAL, not
     brand: never chrome, never a primary action, never adjacent to the teal accent. */
  --info-ink:#1E3A8A;--info:#2563EB;--info-soft:#93C5FD;--info-lt:#DBEAFE;--info-wash:#EFF6FF;
  /* Brand v1.6 P3: COMPONENT TOKENS — the knobs every .c-* component (components.css) resolves
     through; P4 makes these live-editable. Theme-invariant, so they live in this :root and ride
     the mobile build-time sync. Radius scale promoted from admin's local trio (already 6/8/12);
     50% (circles) and 0 stay literal. Focus: --focus-outline for opaque controls (the app's
     existing 9-rule gold convention), --focus-ring for text fields (box-shadow form). Accent:
     gold-400 control fill with dark indicator per the dark-ink-on-gold rule (supersedes the
     2026-05-26 slate-900-checkbox-accent rule — v1.6 changelog). */
  --radius-sm:6px;--radius-md:8px;--radius-lg:12px;--radius-pill:999px;
  --control-h:36px;--control-h-sm:28px;--control-h-lg:44px;
  --control-border-w:0.5px;--control-border-w-active:2px;
  --focus-ring:0 0 0 2px rgba(255,196,36,.45);
  --focus-outline:2px solid var(--gold-400);
  --ink-strong:#1A1D23; /* v1.9 P6: near-black chrome ink (admin selects, mobile toast) */
  --control-accent:var(--gold-400);
  --control-font-size:14px;
  /* Brand v1.8 P3: type primitives -- single source for the marketing dialect's font
     stacks. Each standalone page's local copy is deleted (tokens.css is linked first,
     so these cascade); marketing.css keeps a baseline copy ONLY for blog/compare,
     which don't link tokens.css until P5. --font-mono rides the sans (mono retired,
     G3). Live-editable via the guidelines control surface; rp-tokens.js maps
     overrides onto the app dialect (--font/--display/--mono) + injects Google Fonts. */
  --font-sans:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-serif:'Source Serif 4',Georgia,serif;
  --font-mono:var(--font-sans);
}