/* ==========================================================================
   Linea Design System — Tokens (single source of truth)
   Version 3 · June 2026
   --------------------------------------------------------------------------
   Three layers:
     1. FOUNDATION — shared and LOCKED across every Linea surface.
     2. DELIVERABLE — tokens for client-facing artifacts (AI Readiness lineage).
     3. APPLICATION — tokens for product UIs (Conduit lineage).
   Import this file first; then import the matching surface stylesheet.
   ========================================================================== */

:root {
  /* ====================================================================
     1. FOUNDATION — never override these per surface
     ==================================================================== */

  /* Brand blue — the single primary color */
  --blue:        #2e5dff;   /* CTAs, active states, links, accents */
  --blue-light:  #4a73ff;   /* Gradient partner, hover lightening */
  --blue-dark:   #1a3fb3;   /* Pressed / hover-darken on filled buttons */
  --blue-soft:   #eaeffe;   /* Chip / wash background */
  --blue-tint:   #f4f6fe;   /* Very subtle blue wash (callout backgrounds) */

  /* Brand neutrals */
  --near-black:  #0a0a0a;   /* Highest-contrast text, headings, numbers, icon-mark bg */
  --off-white:   #fafafa;   /* Default page background */
  --cream:       #f2f2f0;   /* Warm secondary surface */
  --blue-subtle: rgba(46,93,255,0.06);  /* Inline code bg, faint blue wash */

  /* Spacing scale — 4px base. Use these for gaps, padding, margins on both
     surfaces. (Deliverable layouts also use larger one-off values: 56px view
     padding, 64px hero gap — see the layout section of the spec.) */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  24px;
  --space-6:  32px;
  --space-7:  48px;
  --space-8:  56px;
  --space-9:  80px;

  /* Radius scale */
  --radius-xs: 4px;    /* chips, small controls */
  --radius-sm: 6px;    /* deliverable buttons/inputs, icon buttons */
  --radius-md: 8px;    /* ghost buttons, modals, overlays */
  --radius-lg: 12px;   /* brand cards, app inputs */
  --radius-xl: 16px;   /* app cards, tables */
  --radius-2xl: 24px;  /* empty-state icon wells */
  --radius-pill: 100px;
  --radius-full: 50%;  /* dots, circular buttons */

  /* Z-index scale — keep layering consistent across every artifact */
  --z-sticky:   5;     /* sticky topbar / table header */
  --z-panel:    50;    /* slide-in side panel + its backdrop */
  --z-overlay:  40;    /* full-screen drill-in overlays */
  --z-modal:    80;    /* modal + confirm dialog */
  --z-toast:    90;    /* toast notifications (always on top) */

  /* Type families — this pairing is LOCKED. Do not substitute. */
  --serif: 'DM Serif Display', 'Cormorant Garamond', Georgia, serif;
  --sans:  'Outfit', 'Inter', -apple-system, system-ui, sans-serif;

  /* Status — Linea-tuned hexes. Used on BOTH surfaces (do not fall back
     to raw Tailwind green/amber/red). */
  --good:        #1a8f59;   --good-soft:  #e7f3ec;   --good-text:  #146b43;
  --warn:        #a06d10;   --warn-soft:  #f6eed7;   --warn-text:  #7a5210;
  --bad:         #d4351c;   --bad-soft:   #fbeae7;   --bad-text:   #9c2714;
  --muted:       #737370;   --muted-soft: #ececea;

  /* Destructive action (buttons, not status) */
  --danger:      #ef4444;   --danger-dark: #dc2626;

  /* ====================================================================
     2. DELIVERABLE SURFACE — editorial client artifacts
     (assessments, one-pagers, proposals, screen-rendered deliverables)
     ==================================================================== */

  /* Ink scale — text & UI */
  --ink-0: #0a0a0a;   /* primary text, display numbers */
  --ink-1: #2a2c30;   /* body */
  --ink-2: #5e6068;   /* secondary, captions */
  --ink-3: #8b8d94;   /* kickers, labels, metadata */
  --ink-4: #b8bac0;   /* disabled, decorative separators */

  /* Warm paper backgrounds — NO pure white in deliverable context */
  --paper:   #fafafa; /* main content */
  --paper-2: #f5f4f0; /* sidebar, card backgrounds */
  --paper-3: #efeee9; /* recessed areas */

  /* Whisper-weight dividers (alpha, not solid gray) */
  --rule:      rgba(10,10,10,0.09);
  --rule-soft: rgba(10,10,10,0.05);

  /* Deliverable shadows */
  --shadow-1:    0 1px 0 rgba(10,10,10,0.04), 0 0 0 1px rgba(10,10,10,0.04);
  --shadow-side: -24px 0 60px -20px rgba(10,10,10,0.15), 0 0 0 1px rgba(10,10,10,0.06);

  /* Deliverable radii — small, document-like */
  --radius-deliverable: 6px;

  /* ====================================================================
     3. APPLICATION SURFACE — product UIs (Conduit and successors)
     ==================================================================== */

  /* Functional gray ramp (cool, opaque — works on white cards) */
  --gray-50:  #f2f2f0;
  --gray-100: #e8e8e6;   /* card & table borders */
  --gray-200: #d4d4d0;   /* input borders, scrollbar thumb */
  --gray-300: #a3a3a0;   /* placeholders, disabled text */
  --gray-400: #737370;   /* table header labels, icons */
  --gray-500: #52524f;   /* ghost-button text */

  /* App surfaces — white cards ARE allowed here */
  --surface:     #ffffff;     /* cards, panels, sidebar */
  --surface-bg:  #fafafa;     /* app body background */

  /* App radii */
  --radius-card:  16px;
  --radius-input: 12px;
  --radius-pill:  100px;

  /* App shadows */
  --shadow-card:       0 1px 3px rgba(10,10,10,0.04), 0 1px 2px rgba(10,10,10,0.02);
  --shadow-card-hover: 0 2px 8px rgba(10,10,10,0.06), 0 1px 3px rgba(10,10,10,0.04);
  --shadow-panel:      -4px 0 24px rgba(10,10,10,0.08);

  /* App focus ring */
  --focus-ring: 0 0 0 3px rgba(46,93,255,0.10);

  /* Functional wayfinding accents — APPLICATION SURFACE ONLY.
     These are navigation/section identifiers, NOT brand decoration, and
     never appear on the deliverable surface (which stays single-blue). */
  --accent-monitoring: #f59e0b;
  --accent-agents:     #0d9488;
  --accent-skills:     #7c3aed;
  --accent-connectors: #475569;
  --accent-members:    #e11d48;
}
