/* ============================================================================
   DIVONCI WORLD — DESIGN TOKENS  v1.0
   "Color is truth. State is communicated through light, not decoration."
   ----------------------------------------------------------------------------
   This file is the single source of truth. Every surface, glow, and state in
   the product must resolve to a token defined here. No raw hex in components.
   ========================================================================== */

:root {
  /* ---------- BASE / VOID (dark operational substrate, violet-tinted) ---- */
  --void:        #06060c;   /* deepest background, the "outside" */
  --obsidian:    #0b0a13;   /* app canvas */
  --graphite:    #100e19;   /* recessed wells */
  --panel:       #16131f;   /* base panel surface */
  --panel-2:     #1d1929;   /* raised panel */
  --panel-3:     #251f33;   /* overlay / popover / focused card */
  --panel-4:     #2e2740;   /* highest float (menus, tooltips) */

  /* ---------- HAIRLINES & SEPARATORS ------------------------------------ */
  --hairline:    rgba(176,148,255,0.09);
  --hairline-2:  rgba(176,148,255,0.16);
  --hairline-3:  rgba(176,148,255,0.26);
  --grid-line:   rgba(150,120,235,0.045);

  /* ---------- INK / TEXT ------------------------------------------------- */
  --ink:         #ECEAF6;   /* primary text */
  --ink-2:       #B6B1CC;   /* secondary text */
  --ink-3:       #807A95;   /* muted labels */
  --ink-4:       #57526A;   /* faint / disabled */
  --ink-on-gold: #1a1405;   /* text on gold authority surfaces */

  /* ---------- IDENTITY: PURPLE / VIOLET / ULTRAVIOLET ------------------- */
  --violet-deep:   #4F33B8;  /* deep structural violet */
  --violet:        #8B5CF6;  /* CORE Divonci identity */
  --violet-bright: #A855F7;  /* active / present */
  --ultraviolet:   #C084FC;  /* highlight, rings */
  --magenta:       #D946EF;  /* active intelligence telemetry glow */
  --violet-ink:    #CDB6FF;  /* violet text on dark */

  /* ---------- AUTHORITY: RESTRAINED GOLD / BRASS ----------------------- */
  --brass-deep:  #8A6E32;
  --gold:        #D4B062;    /* sovereign authority accent */
  --gold-bright: #ECD08A;    /* gilt edge / title gradient top */

  /* ---------- SEMANTIC STATE PALETTE (the Crown Gem) -------------------- */
  /* Shared chroma family, varied hue. Each color has ONE job. */
  --state-active:  #A855F7;  /* purple  — present, engaged */
  --state-crisis:  #FF4D5E;  /* red     — alert, urgent action */
  --state-caution: #F5B544;  /* amber   — pending decision, incomplete */
  --state-clear:   #2FE0A1;  /* green   — complete, optimal */
  --state-focus:   #4D9FFF;  /* blue    — deep focus, do not interrupt */
  --state-standby: #E4E4F0;  /* silver  — idle, awaiting command */

  /* Dim variants for fills / tracks */
  --active-dim:  rgba(168,85,247,0.16);
  --crisis-dim:  rgba(255,77,94,0.16);
  --caution-dim: rgba(245,181,68,0.16);
  --clear-dim:   rgba(47,224,161,0.16);
  --focus-dim:   rgba(77,159,255,0.16);
  --standby-dim: rgba(228,228,240,0.12);

  /* ---------- DATA-VIZ SERIES (telemetry charts) ----------------------- */
  --series-1: #C084FC;  /* ultraviolet */
  --series-2: #D946EF;  /* magenta */
  --series-3: #4D9FFF;  /* blue */
  --series-4: #2FE0A1;  /* green */
  --series-5: #F5B544;  /* amber */
  --series-6: #FF6B8A;  /* coral */

  /* ---------- TYPOGRAPHY ------------------------------------------------- */
  --font-display: 'Space Grotesk', system-ui, sans-serif;  /* identity/titles */
  --font-ui:      'IBM Plex Sans', system-ui, sans-serif;  /* headings/body */
  --font-mono:    'IBM Plex Mono', ui-monospace, monospace;/* telemetry/data */

  /* Type scale — dense command UI. px values, line-heights tuned for density */
  --t-display: 44px;   --lh-display: 1.02;
  --t-h1:      30px;   --lh-h1:      1.10;
  --t-h2:      22px;   --lh-h2:      1.18;
  --t-h3:      16px;   --lh-h3:      1.30;
  --t-body:    14px;   --lh-body:    1.55;
  --t-small:   12.5px; --lh-small:   1.45;
  --t-micro:   11px;   --lh-micro:   1.30;   /* telemetry labels */
  --t-nano:    9.5px;  --lh-nano:    1.20;   /* axis ticks */

  --tracking-label: 0.16em;   /* mono eyebrow labels */
  --tracking-title: -0.01em;

  /* ---------- SPACING (dense 4px base, compresses well) ----------------- */
  --s-1: 2px;  --s-2: 4px;  --s-3: 6px;  --s-4: 8px;  --s-5: 12px;
  --s-6: 16px; --s-7: 20px; --s-8: 24px; --s-9: 32px; --s-10: 40px;
  --s-11: 48px; --s-12: 64px; --s-13: 80px;

  /* ---------- RADII ----------------------------------------------------- */
  --r-xs: 3px; --r-sm: 5px; --r-md: 8px; --r-lg: 12px; --r-xl: 16px;
  --r-2xl: 22px; --r-pill: 999px;

  /* ---------- DEPTH: SHADOW + GLOW ------------------------------------- */
  --shadow-1: 0 1px 2px rgba(0,0,0,0.5);
  --shadow-2: 0 4px 14px rgba(0,0,0,0.45);
  --shadow-3: 0 18px 50px rgba(0,0,0,0.55);
  --shadow-inset: inset 0 1px 0 rgba(255,255,255,0.035);

  /* Glows are reserved for STATE and ACTIVE INTELLIGENCE only */
  --glow-violet:  0 0 0 1px rgba(168,85,247,0.35), 0 0 24px rgba(168,85,247,0.30);
  --glow-magenta: 0 0 22px rgba(217,70,239,0.40);
  --glow-gold:    0 0 0 1px rgba(212,176,98,0.40), 0 0 18px rgba(212,176,98,0.22);
  --glow-crisis:  0 0 0 1px rgba(255,77,94,0.45), 0 0 20px rgba(255,77,94,0.30);
  --glow-clear:   0 0 0 1px rgba(47,224,161,0.40), 0 0 16px rgba(47,224,161,0.22);
  --glow-soft:    0 0 30px rgba(139,92,246,0.10);

  /* ---------- MOTION ---------------------------------------------------- */
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-inout:  cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast:    120ms;
  --dur-base:    220ms;
  --dur-slow:    420ms;
  --dur-ambient: 4000ms;   /* breathing glows, idle pulses */

  /* ---------- LAYOUT ---------------------------------------------------- */
  --rail-left:   244px;    /* command nav rail */
  --rail-right:  300px;    /* telemetry rail */
  --max-canvas:  1320px;
  --header-h:    56px;
}
