/* ============================================================
   RAMSAROOP PROFESSIONAL — 2100+ DESIGN-TOKEN SUBSTRATE
   ------------------------------------------------------------
   css/tokens-2100.css  ·  version 2100.1.0  ·  Phase A (P0)

   PURPOSE (additive — MUST NOT change the 44 legacy pages):
     (a) Re-declare the canonical style.css :root tokens EXACTLY, so
         every existing page keeps rendering identically even if this
         stylesheet loads site-wide.
     (b) Add the 2100 semantic tokens (design-system §1.3/§1.4, §6.2 P0)
         as NEW variables. They are inert until a surface opts in via
         [data-theme="2100"] / [data-command-surface] — legacy pages
         carry neither, so they see no visual change.

   All values derive from the sanctioned palette (navy/gold/ivory/
   teal/charcoal) + the near-black obsidian family in
   /home/team/shared/2100-design-system.md §1. No hue outside that
   family. Contrast pairs are the sanctioned §1.3/§1.4 table.

   Source of truth for this file: 2100-design-system.md.
   ============================================================ */

:root {
  /* ---- (a) Canonical tokens — re-declared EXACTLY as style.css ----- */
  --color-navy: #0B1F33;
  --color-navy-light: #122A42;
  --color-ivory: #F7F3EA;
  --color-ivory-dark: #EBE6DA;
  --color-gold: #C6A15B;
  --color-gold-ivory: #8B6914;
  --color-gold-light: #D4B572;
  --color-teal: #2F6B62;
  --color-teal-light: #3D8278;
  --color-charcoal: #202A33;
  --color-white: #FFFFFF;
  --color-muted: #9CA3AF;
  --color-silver: #9CA3AF;
  --color-base: var(--color-navy);
  --color-base-light: var(--color-navy-light);
  --color-base-lighter: #1A3854;
  --color-surface: rgba(255,255,255,0.05);
  --color-surface-hover: rgba(255,255,255,0.09);
  --color-gold-glow: rgba(198,161,91,0.20);
  --color-gold-dim: rgba(198,161,91,0.08);
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-heading: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --max-width: 1100px;
  --nav-height: 68px;
  --transition: 0.18s ease;
  --transition-slow: 0.35s ease;

  /* ---- 2100 identity aliases (map onto existing hues) ----- */
  --c-navy-legacy: #0B1F33;      /* kept canonical name for legacy consumers */
  --c-black: #04070B;            /* deepest canvas / elev-0 */
  --c-obsidian: #0A0F16;         /* default dark command-surface canvas */
  --c-graphite: #121A24;         /* secondary dark surface / surface-1 */
  --c-graphite-2: #1A2430;       /* surface-2 (elevated) */
  --c-charcoal: #202A33;         /* tertiary dark surface (existing) */
  --c-mineral: #8A94A0;          /* mono metadata / data text on dark */
  --c-ivory: #F7F3EA;            /* light canvas */
  --c-white: #FFFFFF;            /* cards / surfaces on light */
  --c-gold: #C6A15B;             /* primary accent on dark */
  --c-gold-light: #D4B572;       /* hovered/active gold on dark */
  --c-gold-ivory: #8B6914;       /* the ONLY gold text on ivory (AA) */
  --c-gold-ivory-strong: #7A5410;/* AAA gold text on ivory */
  --c-platinum: #C9D2DC;         /* secondary heading/lede text on dark */
  --c-silver: #9CA3AF;           /* muted secondary on dark */
  --c-teal-light: #3D8278;       /* luminous accent (status/data) on dark */
  --c-teal: #2F6B62;             /* accent/status on light */
  --c-sand: #D7CDB4;             /* tertiary "supplementary" confidence tone */
  --c-danger: #E8A48C;           /* ONLY for Ask refusals (>7:1 on obsidian) */

  /* ---- Typography (design-system §2) ---- */
  --font-mono: 'IBM Plex Mono', 'SFMono-Regular', 'Menlo', 'Consolas', monospace;
  --fs-display: clamp(2.0rem, 4vw, 3.4rem);
  --fs-h1: clamp(1.6rem, 3vw, 2.4rem);
  --fs-h2: clamp(1.3rem, 2.2vw, 1.8rem);
  --fs-h3: 1.15rem;
  --fs-lead: 1.13rem;
  --fs-body: 1.02rem;
  --fs-sm: 0.88rem;
  --fs-caption: 0.78rem;
  --fs-meta: 0.72rem;
  --fs-data: clamp(0.95rem, 1.6vw, 1.15rem);
  --fs-data-sm: 0.78rem;

  /* ---- Extended surface tints (design-system §1.2) ---- */
  --t-gold: rgba(198,161,91,0.16);
  --t-teal: rgba(47,107,98,0.26);
  --t-teal-d: rgba(61,130,120,0.22);
  --t-sand: rgba(215,205,180,0.22);
  --t-black: rgba(4,7,11,0.55);
  --t-white: rgba(247,243,234,0.05);

  /* ---- Spacing / radii / elevation (design-system §4) ---- */
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px;
  --sp-5: 24px; --sp-6: 32px; --sp-7: 48px; --sp-8: 64px; --sp-9: 96px;
  --r-0: 0; --r-1: 4px; --r-2: 8px; --r-3: 12px;
  --prose-max: 780px;
  --data-max: 1200px;
}

/* ---- Semantic roles — DARK MODE (default command environment) ----
   Scoped to opt-in command surfaces ONLY. Legacy pages never receive
   [data-theme="2100"], so this block cannot change their rendering. */
[data-theme="2100"]{
  --bg-canvas: var(--c-obsidian);
  --bg-surface1: var(--c-graphite);
  --bg-surface2: var(--c-graphite-2);
  --text-primary: var(--c-ivory);
  --text-secondary: var(--c-platinum);
  --text-muted: var(--c-silver);
  --text-data: var(--c-mineral);
  --accent-gold: var(--c-gold);
  --accent-gold-active: var(--c-gold-light);
  --accent-teal: var(--c-teal-light);
  --line-fact: rgba(198,161,91,0.55);
  --line-forecast: var(--c-gold);
  --line-hair: rgba(201,210,220,0.22);
  --focus: var(--c-gold-light);
  --sel-bg: var(--t-gold);
  --sel-border: var(--c-gold);
  --danger: var(--c-danger);
  --surface-canvas: var(--bg-canvas);
  --surface-1: var(--bg-surface1);
  --surface-2: var(--bg-surface2);
}

/* ---- Semantic roles — LIGHT / READING mode ---- */
[data-theme="2100"][data-surface-mode="light"],
[data-theme="2100"] [data-surface-mode="light"]{
  --bg-canvas: var(--c-ivory);
  --bg-surface1: var(--c-white);
  --bg-surface2: #FFFFFF;
  --text-primary: var(--c-charcoal);
  --text-secondary: var(--c-navy-legacy);
  --text-muted: #4B5563;
  --text-data: #4B5563;
  --accent-gold: var(--c-gold-ivory);
  --accent-gold-active: var(--c-gold-ivory-strong);
  --accent-teal: var(--c-teal);
  --line-fact: var(--c-gold);
  --line-hair: #E3DDCF;
  --focus: var(--c-gold-ivory);
  --danger: #B4543A;
  --surface-canvas: var(--bg-canvas);
  --surface-1: var(--bg-surface1);
  --surface-2: var(--bg-surface2);
}