/* StretchAI — design tokens
 * Dark, low-chroma "AI lab" palette. OpenAI-style restraint: near-black surfaces,
 * hairline borders, an off-white type ramp, and a single quiet accent used sparingly.
 */
:root {
  /* Surfaces — near-black, layered */
  --ai-bg:            #0a0a0b;   /* page */
  --ai-surface:       #0e0e10;   /* alternating bands */
  --ai-panel:         #131316;   /* cards, mega-menu */
  --ai-panel-alt:     #18181c;   /* chip fills, hovers */
  --ai-elevated:      #1c1c21;   /* raised surfaces */

  /* Borders — hairlines */
  --ai-border:        rgba(255, 255, 255, 0.08);
  --ai-border-strong: rgba(255, 255, 255, 0.14);
  --ai-border-hover:  rgba(255, 255, 255, 0.22);

  /* Ink — restrained ramp */
  --ai-ink:           #f5f5f7;   /* headings */
  --ai-body:          #c8c8cf;   /* body */
  --ai-muted:         #8a8a93;   /* secondary */
  --ai-subtle:        #5f5f68;   /* captions, mono ids */

  /* Accent — one quiet cyan, used sparingly for links/active states */
  --ai-accent:        #6ee7d2;
  --ai-accent-dim:    rgba(110, 231, 210, 0.14);
  --ai-link:          #9bdcff;

  /* Primary action = light on dark (OpenAI inversion) */
  --ai-cta:           #f5f5f7;
  --ai-cta-ink:       #0a0a0b;
  --ai-cta-hover:     #ffffff;

  /* Status chips — muted, low saturation */
  --ai-live-bg:     rgba(110, 231, 170, 0.12);  --ai-live-ink:     #7fe9a8;  /* Live */
  --ai-trained-bg:  rgba(155, 220, 255, 0.12);  --ai-trained-ink:  #9bdcff;  /* Trained */
  --ai-planned-bg:  rgba(255, 255, 255, 0.06);  --ai-planned-ink:  #9a9aa3;  /* Candidate / Planned */
  --ai-governed-bg: rgba(245, 191, 120, 0.12);  --ai-governed-ink: #e8b974;  /* Governed */

  /* Type */
  --ai-font: "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --ai-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
  --ai-h1: clamp(2.6rem, 5.2vw, 4.4rem);
  --ai-h2: clamp(1.8rem, 3.2vw, 2.7rem);
  --ai-h3: clamp(1.2rem, 1.8vw, 1.5rem);
  --ai-lede: clamp(1.05rem, 1.4vw, 1.25rem);
  --ai-tight: -0.022em;     /* heading tracking */

  /* Shape & depth — minimal */
  --ai-radius:       10px;
  --ai-radius-lg:    16px;
  --ai-chip-radius:  999px;
  --ai-shadow-menu:  0 24px 70px -28px rgba(0, 0, 0, 0.85);
  --ai-shadow-card:  0 1px 0 rgba(255, 255, 255, 0.03) inset;

  /* Layout */
  --ai-maxw:    1200px;
  --ai-gutter:  24px;
  --ai-nav-h:   60px;

  color-scheme: dark;
}