/* Big Brain design tokens, shared by the landing page and the source viewer so they read as one
   product. Purple is hierarchy: the main action, selected states and the shared-memory visual. */
:root {
  --bg: #f7f6f3; --panel: #ffffff; --line: #e4e1da; --line-strong: #d3cec4;
  --text: #1f1d1a; --muted: #625d54;
  --link: #5b4bd6; --accent: #5b4bd6; --accent-soft: #ece9fb; --accent-glow: rgba(91, 75, 214, .14);
  --well: #f3f1ec;                         /* command blocks on the page */
  --code: #fbfaf8; --gutter: #f3f1ec;      /* the viewer's code area */
  --hl: #fff4c2; --hl-edge: #e8b100;
  --button: #5b4bd6; --button-hover: #4a3bc2; --button-text: #ffffff;
  --error: #b42318; --error-soft: #fdecea; --ok: #156b3e;
  --shadow: 0 1px 2px rgba(31, 29, 26, .04), 0 6px 24px rgba(31, 29, 26, .05);
  --sans: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --mono: ui-monospace, "SF Mono", "Cascadia Code", Menlo, Consolas, monospace;
  --radius: 12px;
  --fast: 140ms ease;
  /* The terminal in the hero is dark in both themes. */
  --term-bg: #16151b; --term-line: #2c2a33; --term-text: #ebe9e4; --term-dim: #aba69d;
  --term-green: #7fd6a4; --term-cyan: #67e8f9; --term-purple: #b3a8fa;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #131217; --panel: #1b1a20; --line: #2c2a33; --line-strong: #3b3944;
    --text: #ebe9e4; --muted: #b3aea5;
    --link: #b3a8fa; --accent: #a597f7; --accent-soft: #2a2640; --accent-glow: rgba(165, 151, 247, .12);
    --well: #222129;
    --code: #17161c; --gutter: #1b1a20;
    --hl: #3a3420; --hl-edge: #d4a514;
    --button: #5b4bd6; --button-hover: #6c5de0; --button-text: #ffffff;
    --error: #ffb4ab; --error-soft: #3a1d1b; --ok: #7fd6a4;
    --shadow: none;
    --term-bg: #0f0e13;
  }
}
/* Reduced motion: nothing moves and nothing scrolls smoothly, except inside an animated picture the
   reader explicitly started with its Play button (motion.js marks that picture .motion-ok). */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  :where(*:not(.motion-ok, .motion-ok *)),
  :where(*:not(.motion-ok, .motion-ok *))::before,
  :where(*:not(.motion-ok, .motion-ok *))::after { animation: none !important; transition: none !important; }
}