/* Design tokens shared by every web module. Color MEANING is fixed across the app:
   input = cyan, excitatory = amber, inhibitory = magenta, descending (decision) = lime, motor = pale. */
:root {
  color-scheme: dark;
  --bg: #05070a;
  --panel: rgba(10, 14, 20, 0.85);        /* opaque enough for AA text over the glowing scene */
  --panel-solid: rgb(10, 14, 20);
  --scrim: rgba(5, 7, 10, 0.7);             /* behind unpanelled text, e.g. the title block */
  --shadow: rgba(0, 0, 0, 0.5);
  --hilite-1: rgba(230, 232, 235, 0.03);    /* hover / pressed surface tints */
  --hilite-2: rgba(230, 232, 235, 0.07);
  --hilite-3: rgba(230, 232, 235, 0.16);
  --panel-border: #1b2330;
  --ink-1: #e6e8eb;   /* primary text */
  --ink-2: #a3a9b3;   /* secondary text */
  --ink-3: #7d8490;   /* muted: rules, icons and ≥ 4.6:1 labels only */
  --grid: #1c2129;    /* hairline rules and dividers (decorative, never a UI control) */
  --track: #5a6270;   /* unfilled meter/progress track: 3.1:1 against --panel (WCAG non-text contrast) */

  /* glow colors for the 3D scene (bloom-friendly, not for text) */
  --glow-input: #38e1ff;
  --glow-excitatory: #ffb347;
  --glow-inhibitory: #ff3fa4;
  --glow-modulatory: #8a94a6;
  --glow-dn: #b6ff3b;
  --glow-mn: #e8f1ff;
  --glow-dust: #6b7a90;
  --glow-shell: #7fa7ff;

  /* decision classes (same order as manifest.classes). Dodges share violet — the one hue the brain scene never uses —
     and direction is carried by arrows/labels; takeoff shares lime with the descending neurons that drive it. */
  --class-none: #7d8490;
  --class-dodge-right: #a78bfa;
  --class-dodge-left: #a78bfa;
  --class-takeoff: #b6ff3b;

  --font-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --font-sans: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;

  /* One type scale for the whole app (~1.15 steps around the 14px body size). Every font-size in app.css
     comes from here, so --font-scale resizes the interface as a whole: ?present=1 sets 1.25 for a projector. */
  --font-scale: 1;
  --fs-display: calc(28px * var(--font-scale));  /* the verdict — the one piece of display type */
  --fs-title: calc(19px * var(--font-scale));
  --fs-lg: calc(16px * var(--font-scale));
  --fs-md: calc(14px * var(--font-scale));       /* body */
  --fs-sm: calc(13px * var(--font-scale));
  --fs-xs: calc(12px * var(--font-scale));
  --fs-2xs: calc(11px * var(--font-scale));      /* small labels, numbers */
  --fs-3xs: calc(10px * var(--font-scale));      /* keycaps, axis ticks */
  --radius: 10px;
  --gap: 16px;
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
}