/* ============================================================
   Altered.Works — Design tokens
   Swiss-editorial, modernized. Grotesk display + serif text.
   OKLCH throughout. See DESIGN.md.
   ============================================================ */

:root {
  /* ---- Neutrals (true off-white, NOT warm cream) ---- */
  --bg:            oklch(0.985 0.002 95);
  --surface:       oklch(0.965 0.003 95);
  --surface-sunk:  oklch(0.930 0.004 95);
  --ink:           oklch(0.18 0.012 250);
  --ink-2:         oklch(0.32 0.012 250);
  --muted:         oklch(0.46 0.010 250);
  --line:          oklch(0.18 0.012 250 / 0.16);
  --line-soft:     oklch(0.18 0.012 250 / 0.09);

  /* ---- Inverse (deliberate dark bands) ---- */
  --inverse-bg:    oklch(0.20 0.018 250);
  --inverse-bg-2:  oklch(0.24 0.018 250);
  --inverse-ink:   oklch(0.96 0.003 95);
  --inverse-muted: oklch(0.74 0.008 250);
  --inverse-line:  oklch(0.96 0.003 95 / 0.14);

  /* ---- Signal: deep forest green #31453A (the "altered" accent) ---- */
  --signal:        oklch(0.42 0.045 162);
  --signal-strong: oklch(0.32 0.032 162);
  --signal-tint:   oklch(0.42 0.045 162 / 0.12);
  --signal-on-dark:oklch(0.72 0.07 160);

  /* ---- Status (Monitor) — always paired with label + dot ---- */
  --st-live:       oklch(0.42 0.045 162);
  --st-live-bg:    oklch(0.42 0.045 162 / 0.12);
  --st-pending:    oklch(0.50 0.08 235);
  --st-pending-bg: oklch(0.50 0.08 235 / 0.12);
  --st-standing:   oklch(0.46 0.010 250);
  --st-standing-bg:oklch(0.46 0.010 250 / 0.12);
  --st-resolved:   oklch(0.55 0.045 200);
  --st-resolved-bg:oklch(0.55 0.045 200 / 0.12);

  /* ---- Type families ---- */
  --display: "Archivo Expanded", "Archivo", system-ui, sans-serif;
  --grotesk: "Archivo", system-ui, sans-serif;
  --serif:   "Spectral", Georgia, "Times New Roman", serif;
  --mono:    "Geist Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* ---- Fluid type scale (ratio >= 1.25) ---- */
  --fs-mono:   0.6875rem;  /* 11px labels */
  --fs-meta:   0.75rem;    /* 12px */
  --fs-small:  0.875rem;   /* 14px */
  --fs-body:   1.0625rem;  /* 17px */
  --fs-lead:   clamp(1.15rem, 1.6vw, 1.375rem);
  --fs-h3:     clamp(1.5rem, 2vw, 2rem);
  --fs-h2:     clamp(2rem, 3.5vw, 3.25rem);
  --fs-h1:     clamp(2.75rem, 6vw, 5.25rem);

  /* ---- Spacing rhythm ---- */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
  --space-9: 6rem;
  --space-10: 8rem;

  /* ---- Structure ---- */
  --col-max: 1280px;
  --measure: 68ch;
  --gutter:  clamp(1.5rem, 4vw, 2.5rem);
  --radius:  3px;
  --radius-pill: 999px;

  /* ---- Motion ---- */
  --ease-out-quart: cubic-bezier(0.165, 0.84, 0.44, 1);
  --ease-out-expo:  cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast: 160ms;
  --dur:      220ms;
  --dur-slow: 420ms;

  /* ---- Semantic z-index scale ---- */
  --z-base: 1;
  --z-sticky: 50;
  --z-gate: 100;
  --z-modal-backdrop: 200;
  --z-modal: 210;
  --z-toast: 300;
}