/* Poppa — the seal. Slate dark with a warm orange wax seal; Bricolage Grotesque at its
   heaviest for display, Onest for reading. */

:root {
  --page-bg: #14161b;
  --page-text: #e4e6ec;
  --page-muted: #a2a8b6;
  --page-line: #272b34;
  --page-accent: #ff9a62;
  --page-ui: "Onest", system-ui, sans-serif;
  --display: "Bricolage Grotesque", "Onest", system-ui, sans-serif;
  --mono: "JetBrains Mono", ui-monospace, monospace;
  --surface: #191c22;
  --raise: #20242c;
  --code-bg: #191c22;
  --code-text: #ffd9c2;
  --strong: #f6f7fa;
  --k-ink: #dcdfe7; --k-accent: var(--page-accent); --k-a: #ffc56b; --k-b: #7ab8ff; --k-c: #b39cff;
  --k-d: #ff8fb0; --k-ok: #7fdc9a; --k-err: #ff7b72; --k-muted: #757c8c; --k-file: #a2a8b6;
  color-scheme: dark;
}

.hero h1 { font: 800 clamp(44px, 6.6vw, 88px)/0.98 var(--display); letter-spacing: -0.035em; }
.hero h1 span { color: var(--page-accent); }
.part > h2 { display: flex; align-items: center; gap: 14px; font: 800 clamp(26px, 3.2vw, 40px)/1.1 var(--display); letter-spacing: -0.02em; }
.part > h2::before {
  content: "✓"; flex: none; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%;
  font: 800 17px/1 var(--page-ui); color: #2a1408; background: radial-gradient(circle at 35% 30%, #ffc09a, var(--page-accent) 60%, #d86a32);
  box-shadow: 0 0 0 3px #ff9a6233;
}
.fig { padding: 18px; background: var(--surface); border: 1px solid var(--page-line); border-radius: 10px; }
.dg .lab-bg { fill: var(--surface); }
.dg .halo { stroke: var(--surface); }
.facts li { border-left-color: var(--page-accent); }