:root, [data-theme="dark"] {
  --bg-canvas: #171612;
  --bg-surface: #1e1d18;
  --bg-raised: #27231d;
  --bg-sunken: #100f0c;
  --bg-hover: #2e2a22;
  --bg-selected: #363025;
  --bg-scrim: #12110ecc;
  --ink-strong: #f3ede1;
  --ink: #ddd4c0;
  --ink-muted: #b3a993;
  --ink-faint: #9e9786;
  --ink-inverse: #171612;
  --line-hairline: #3d382f;
  --line: #797159;
  --line-strong: #a89f8a;
  --accent: #eab54e;
  --on-accent: #241c09;
  --accent-soft: #3b2f15;
  --accent-line: #94762d;
  --accent-ink: #f0c470;
  --select-solid: #e8e0cd;
  --focus-ring: #eab54e;
  --text-selection: #514526;
  --paper: #ffffff;
  --paper-ink: #0f0e0a;
  --paper-muted: #55503f;
  --paper-rule: #0f0e0a;
  --paper-hairline: #b9b19d;
  --paper-tint: #f1ece0;
  --success: #8fbb74;
  --success-soft: #26301b;
  --warning: #e2914a;
  --warning-soft: #3a2712;
  --danger: #e57f73;
  --danger-soft: #3d201c;
  --info: #8db0cb;
  --info-soft: #1f2b34;
  --shadow-card: 0 1px 2px #00000059;
  --shadow-raised: 0 12px 32px -8px #00000073;
}
[data-theme="light"] {
  --bg-canvas: #f3f0e8;
  --bg-surface: #fffdf7;
  --bg-raised: #ffffff;
  --bg-sunken: #e9e4d7;
  --bg-hover: #ebe6d9;
  --bg-selected: #e2dcca;
  --bg-scrim: #2b2418b3;
  --ink-strong: #14120d;
  --ink: #262219;
  --ink-muted: #5a5442;
  --ink-faint: #726c59;
  --ink-inverse: #fffdf7;
  --line-hairline: #ddd6c4;
  --line: #8c8165;
  --line-strong: #14120d;
  --accent: #b0770c;
  --on-accent: #1e1600;
  --accent-soft: #f7e8c4;
  --accent-line: #9c7409;
  --accent-ink: #7d5400;
  --select-solid: #14120d;
  --focus-ring: #8a5f00;
  --text-selection: #f3dfa6;
  --success: #3f6d2b;
  --success-soft: #e2eed7;
  --warning: #8f4e08;
  --warning-soft: #fae7cf;
  --danger: #a52e22;
  --danger-soft: #fadfda;
  --info: #2b5c7f;
  --info-soft: #ddeaf2;
  --shadow-card: 0 1px 2px #1d180d14;
  --shadow-raised: 0 12px 32px -12px #2b241833;
}
:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --radius-0: 0;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --radius-xl: 20px;
  --radius-pill: 999px;
  --stroke-hairline: 1px;
  --stroke-rule: 2px;
  --stroke-heavy: 3px;
  --font-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  --font-sans: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-serif: "IBM Plex Serif", Georgia, "Times New Roman", serif;
}
.doc-title {
  font-family: var(--font-mono);
  font-size: 24px;
  line-height: 32px;
  font-weight: 600;
}
.doc-h1 {
  font-family: var(--font-mono);
  font-size: 20px;
  line-height: 30px;
  font-weight: 600;
}
.doc-h2 {
  font-family: var(--font-mono);
  font-size: 17px;
  line-height: 26px;
  font-weight: 600;
}
.doc-h3 {
  font-family: var(--font-mono);
  font-size: 15px;
  line-height: 24px;
  font-weight: 600;
}
.doc-body {
  font-family: var(--font-mono);
  font-size: 15px;
  line-height: 26px;
  font-weight: 400;
}
.doc-quote {
  font-family: var(--font-mono);
  font-size: 15px;
  line-height: 26px;
  font-weight: 400;
  font-style: italic;
}
.doc-code {
  font-family: var(--font-mono);
  font-size: 13px;
  line-height: 22px;
  font-weight: 400;
}
.doc-small {
  font-family: var(--font-mono);
  font-size: 13px;
  line-height: 22px;
  font-weight: 400;
}
.ui-title {
  font-family: var(--font-sans);
  font-size: 20px;
  line-height: 28px;
  font-weight: 600;
}
.ui-heading {
  font-family: var(--font-sans);
  font-size: 16px;
  line-height: 24px;
  font-weight: 600;
}
.ui-body {
  font-family: var(--font-sans);
  font-size: 14px;
  line-height: 21px;
  font-weight: 400;
}
.ui-body-strong {
  font-family: var(--font-sans);
  font-size: 14px;
  line-height: 21px;
  font-weight: 500;
}
.ui-small {
  font-family: var(--font-sans);
  font-size: 13px;
  line-height: 19px;
  font-weight: 400;
}
.ui-caption {
  font-family: var(--font-sans);
  font-size: 12px;
  line-height: 16px;
  font-weight: 400;
}
.masthead {
  font-family: var(--font-sans);
  font-size: 28px;
  line-height: 30px;
  font-weight: 700;
  letter-spacing: -0.01em;
}
.label {
  font-family: var(--font-sans);
  font-size: 11px;
  line-height: 14px;
  font-weight: 600;
  letter-spacing: 0.12em;
}
.byline {
  font-family: var(--font-sans);
  font-size: 11px;
  line-height: 14px;
  font-weight: 500;
  letter-spacing: 0.08em;
}
.numeral {
  font-family: var(--font-sans);
  font-size: 32px;
  line-height: 34px;
  font-weight: 600;
}
.print-title {
  font-family: var(--font-serif);
  font-size: 24px;
  line-height: 30px;
  font-weight: 600;
}
.print-label {
  font-family: var(--font-sans);
  font-size: 11px;
  line-height: 14px;
  font-weight: 600;
  letter-spacing: 0.12em;
}
.print-question {
  font-family: var(--font-serif);
  font-size: 14px;
  line-height: 22px;
  font-weight: 600;
}
.print-body {
  font-family: var(--font-serif);
  font-size: 13px;
  line-height: 21px;
  font-weight: 400;
}
.print-meta {
  font-family: var(--font-sans);
  font-size: 11px;
  line-height: 15px;
  font-weight: 400;
}
