/* Cursive — a chalkboard in the terminal. The app's charcoal, cream ink, tan rail and sage
   cursor; Caveat for the handwritten voice, Manrope for reading. */

:root {
  --page-bg: #151a1b;
  --page-text: #e9e2d2;
  --page-muted: #a9a394;
  --page-line: #2a3133;
  --page-accent: #9cc79a;
  --page-ui: "Manrope", system-ui, sans-serif;
  --display: "Caveat", cursive;
  --mono: "JetBrains Mono", ui-monospace, monospace;
  --surface: #1a2022;
  --raise: #222a2c;
  --code-bg: #1a2022;
  --code-text: #efe6d2;
  --strong: #f6f0e2;
  --tan: #c9a26b;
  --k-ink: #e9e2d2; --k-accent: var(--page-accent); --k-a: #efe6d2; --k-b: #8fb3ff; --k-c: var(--tan);
  --k-d: #e58cc9; --k-ok: #9cc79a; --k-err: #ff8a7a; --k-muted: #7b8582; --k-file: #b3ab98;
  color-scheme: dark;
}

.hero h1 { font: 700 clamp(64px, 10vw, 140px)/0.86 var(--display); letter-spacing: 0; color: #efe6d2; transform: rotate(-2deg); transform-origin: left; }
.part > h2 { font: 700 clamp(40px, 5vw, 62px)/1 var(--display); color: #efe6d2; }
.part > h2::after { content: ""; display: block; width: 4.2em; height: 6px; margin-top: 2px; border-radius: 3px; background: var(--tan); transform: rotate(-1deg); }
.term { border-left: 3px solid var(--tan); }
.term .e { white-space: pre-wrap; }
.shot img { border: 0; border-radius: 8px; box-shadow: 0 20px 50px -25px #000; }
.board { max-width: 640px; }
.board img { image-rendering: pixelated; background: #fff; }
.fig { padding: 18px; background: var(--surface); border: 1px solid var(--page-line); border-radius: 8px; }
.dg .lab-bg { fill: var(--surface); }
.dg .halo { stroke: var(--surface); }
.facts li { border-left-color: var(--tan); }