:root {
  color-scheme: dark;
  --bg: oklch(0.155 0.018 295);
  --bg-raise: oklch(0.19 0.018 295);
  --bg-well: oklch(0.13 0.014 295);
  --ink: oklch(0.88 0.018 85);
  --ink-dim: oklch(0.69 0.018 85);
  --ink-faint: oklch(0.60 0.018 85);
  --gold: oklch(0.8 0.115 78);
  --gold-dim: oklch(0.62 0.08 78);
  --line: oklch(0.28 0.02 290);
  --testable: oklch(0.75 0.12 145);
  --unfalsifiable: oklch(0.68 0.025 290);
  --agrees: oklch(0.74 0.09 235);
  --shell: 1080px;
  --prose: 62ch;
  --prose-size: 1.25rem;
  --prose-leading: 1.72;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --space-16: 64px;
  --space-24: 96px;
  --page-inline: clamp(20px, 5vw, 72px);
  --fixed-ui-clearance: calc(180px + env(safe-area-inset-bottom));
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-block: 80px 32px; }
body {
  margin: 0;
  min-width: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: "Alegreya", Georgia, serif;
  overflow-wrap: anywhere;
  -webkit-font-smoothing: antialiased;
  text-rendering: auto;
}
button, input { font: inherit; }
button { color: inherit; }
img, svg, canvas { display: block; max-width: 100%; }
a { color: var(--gold); text-underline-offset: .18em; }
:focus-visible { outline: 2px solid var(--gold); outline-offset: 4px; }

.skip-link {
  position: fixed; inset: 12px auto auto 12px; z-index: 200;
  min-height: 44px; padding: 11px 16px; border-radius: 100px;
  background: var(--gold); color: var(--bg-well);
  font: 500 .8125rem/1.4 "Spline Sans Mono", monospace;
  transform: translateY(-160%); transition: transform .15s ease;
}
.skip-link:focus { transform: none; }
.home-mark, .page-switch {
  position: fixed; top: 14px; z-index: 71; min-height: 44px;
  display: inline-flex; align-items: center; padding: 0 16px;
  border: 1px solid var(--line); border-radius: 100px;
  background: color-mix(in oklch, var(--bg-well) 92%, transparent);
  backdrop-filter: blur(12px); color: var(--ink-dim); text-decoration: none;
  font: 500 .8125rem/1.4 "Spline Sans Mono", monospace;
}
.home-mark { left: 14px; }
.page-switch { right: 14px; color: var(--gold); border-color: var(--gold-dim); }

#tocRail {
  position: fixed; left: 14px; top: 70px; z-index: 70; width: 54px;
  max-height: calc(45vh - 70px); overflow: auto hidden; padding: 8px 0;
  border: 1px solid var(--line); border-radius: 14px;
  background: color-mix(in oklch, var(--bg-well) 92%, transparent);
  backdrop-filter: blur(12px); font-family: "Spline Sans Mono", monospace;
  scrollbar-width: none; transition: width .25s ease;
}
#tocRail:hover, #tocRail:focus-within { width: 270px; }
#tocRail::-webkit-scrollbar { display: none; }
#tocRail a, #tocPanel a {
  display: flex; align-items: center; gap: 8px; min-height: 44px;
  padding: 4px 8px 4px 12px; color: var(--ink-faint); text-decoration: none;
  font-size: .75rem; letter-spacing: .04em;
}
#tocRail a span { opacity: 0; white-space: nowrap; }
#tocRail:hover a span, #tocRail:focus-within a span { opacity: 1; }
#tocRail a b { min-width: 24px; font-weight: 500; }
#tocRail a:hover, #tocRail a.on, #tocPanel a:hover, #tocPanel a.on { color: var(--gold); }
#tocFab {
  display: none; position: fixed; left: 14px; top: 14px; z-index: 73;
  width: 44px; height: 44px; border: 1px solid var(--line); border-radius: 50%;
  background: color-mix(in oklch, var(--bg-well) 92%, transparent); color: var(--gold);
  cursor: pointer;
}
#tocPanel {
  display: none; position: fixed; left: 14px; top: 66px; z-index: 74;
  min-width: 280px; max-width: 82vw; max-height: 72vh; overflow: auto;
  padding: 10px; border: 1px solid var(--line); border-radius: 14px;
  background: color-mix(in oklch, var(--bg-well) 96%, transparent);
  backdrop-filter: blur(12px); box-shadow: 0 8px 30px oklch(0 0 0 / .5);
  font-family: "Spline Sans Mono", monospace;
}
#tocPanel.on { display: block; }

.hero, main, .site-footer {
  width: min(100%, calc(var(--shell) + 2 * var(--page-inline)));
  margin-inline: auto; padding-inline: var(--page-inline);
}
.hero {
  min-height: min(680px, 88svh); display: grid; align-content: center;
  padding-block: var(--space-24); border-bottom: 1px solid var(--line);
}
.hero-kicker, .hero-meta, .sec-num, .eyebrow, .caption, .source-credit,
.draft-badge, .skim-label, .block-label {
  font-family: "Spline Sans Mono", monospace; font-size: .75rem; line-height: 1.55;
  letter-spacing: .09em; text-transform: uppercase;
}
.hero-kicker, .sec-num, .eyebrow, .skim-label { color: var(--gold-dim); }
.hero h1 {
  max-width: 12ch; margin: var(--space-4) 0 var(--space-6);
  font-family: "Young Serif", Georgia, serif; font-size: clamp(3.25rem, 8vw, 7rem);
  font-weight: 400; line-height: .94; letter-spacing: -.035em; text-wrap: balance;
}
.hero-summary {
  max-width: 52ch; margin: 0; color: var(--ink-dim);
  font: 400 var(--prose-size)/var(--prose-leading) "Alegreya", Georgia, serif;
}
.hero-meta { display: flex; flex-wrap: wrap; gap: 8px 24px; margin-top: 32px; color: var(--ink-faint); }
.draft-badge {
  width: fit-content; margin-top: 20px; padding: 8px 12px;
  border: 1px solid var(--line); border-radius: 100px; color: var(--ink-faint);
}

.section { padding-block: var(--space-24); border-top: 1px solid var(--line); scroll-margin-top: 72px; }
.section:first-child { border-top: 0; }
.section-head { max-width: 760px; margin-bottom: var(--space-12); }
.section h2 {
  max-width: 17ch; margin: 8px 0 0; font-family: "Young Serif", Georgia, serif;
  font-size: clamp(2.4rem, 5vw, 4.75rem); font-weight: 400; line-height: 1.02;
  letter-spacing: -.025em; text-wrap: balance;
}
.section h3 { margin: 0 0 12px; font: 500 1.45rem/1.25 "Alegreya", Georgia, serif; }
.prose-stack { display: grid; gap: 28px; }
.prose, .narrated, [data-narrated] {
  max-width: var(--prose); margin: 0; font-family: "Alegreya", Georgia, serif;
  font-size: var(--prose-size); font-weight: 400; line-height: var(--prose-leading);
}
.block { max-width: calc(var(--prose) + 48px); }
.block p { margin: 0; }
.block.lead p { color: var(--ink); }
.block.prose p { color: var(--ink-dim); }
.block.wheeler, .block.standard, .block.fork, .block.test {
  padding: 24px; border: 1px solid var(--line); border-radius: 14px; background: var(--bg-well);
}
.block.wheeler { border-left: 3px solid var(--gold); }
.block.standard { border-left: 3px solid var(--agrees); }
.block.fork, .block.test { border-left: 3px solid var(--testable); }
.block-label { display: block; margin-bottom: 10px; color: var(--gold); }
.block.standard .block-label { color: var(--agrees); }
.block.fork .block-label, .block.test .block-label { color: var(--testable); }
.block.quote {
  padding: 30px 0 30px 28px; border-left: 1px solid var(--gold-dim);
}
.block.quote[data-register="bridge"] { border-left-color: oklch(.76 .07 305); }
.block.quote[data-register="interpreter"] { border-left: 3px double oklch(.76 .07 305); }
.block.quote p { color: var(--ink); }
.block.quote cite { display: block; margin-top: 12px; color: var(--ink-faint); font: 400 .75rem/1.5 "Spline Sans Mono", monospace; }
.block.note { padding-left: 28px; position: relative; color: var(--ink-dim); }
.block.note::before { content: "↳"; position: absolute; left: 0; color: var(--gold-dim); font: 500 1rem/1.7 "Spline Sans Mono", monospace; }
.block.dinner { padding: 24px 28px; border-block: 1px solid var(--gold-dim); color: var(--ink); }
.block.dinner::before { content: "Dinner line"; display: block; margin-bottom: 8px; color: var(--gold-dim); font: 500 .75rem/1.5 "Spline Sans Mono", monospace; letter-spacing: .08em; text-transform: uppercase; }

.honesty-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.register-card { padding: 24px; border: 1px solid var(--line); border-radius: 14px; background: var(--bg-well); }
.register-card h3 { font: 500 .8125rem/1.4 "Spline Sans Mono", monospace; letter-spacing: .07em; text-transform: uppercase; }
.register-card p { margin: 0; color: var(--ink-dim); font: 400 var(--prose-size)/var(--prose-leading) "Alegreya", Georgia, serif; }
.register-card.subject h3 { color: var(--gold); }
.register-card.bridge h3 { color: oklch(.76 .07 305); }
.register-card.comparison h3 { color: var(--agrees); }
.spine-card, .skim-card {
  max-width: var(--prose); margin-top: 32px; padding: 24px;
  border: 1px solid var(--line); border-radius: 14px; background: var(--bg-raise);
}
.spine-card p, .skim-card p { margin: 8px 0 0; color: var(--ink); font: 400 var(--prose-size)/var(--prose-leading) "Alegreya", Georgia, serif; }

.source-plate { max-width: 920px; margin-block: 24px; padding: 24px; border: 1px solid var(--line); border-radius: 16px; background: linear-gradient(145deg, var(--bg-raise), var(--bg-well)); }
.source-plate h3 { margin: 8px 0 20px; font-family: "Young Serif", Georgia, serif; font-size: 2rem; font-weight: 400; }
.source-support, .source-limit { max-width: var(--prose); color: var(--ink-dim); font: 400 var(--prose-size)/var(--prose-leading) "Alegreya", Georgia, serif; }
.source-limit { margin-top: 10px; }
.source-limit b { color: var(--testable); font-family: "Spline Sans Mono", monospace; font-size: .75rem; text-transform: uppercase; }
.figure-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 24px; }
.source-figure { margin: 0; }
.source-open { width: 100%; min-height: 44px; padding: 0; border: 1px solid var(--line); border-radius: 12px; background: var(--bg-well); cursor: zoom-in; overflow: hidden; }
.source-open img { width: 100%; aspect-ratio: 4/3; object-fit: contain; background: #e8e1d3; }
.source-credit { margin-top: 10px; color: var(--ink-faint); text-transform: none; }
.source-recommendation { min-width: 0; padding: 20px; border: 1px dashed var(--gold-dim); border-radius: 12px; background: var(--bg-well); }
.source-recommendation > span { color: var(--gold-dim); font: 500 .66rem/1.4 "Spline Sans Mono", monospace; letter-spacing: .07em; text-transform: uppercase; }
.source-recommendation h4 { margin: 10px 0 8px; color: var(--ink); font: 500 1.1rem/1.3 "Alegreya", Georgia, serif; }
.source-recommendation p { margin: 0; color: var(--ink-dim); font: 400 1rem/1.55 "Alegreya", Georgia, serif; }
.source-recommendation a { display: inline-flex; align-items: center; min-height: 44px; margin-top: 12px; font: 500 .72rem/1.4 "Spline Sans Mono", monospace; }
.source-recommendation small { display: block; margin-top: 10px; color: var(--ink-faint); font: 400 .68rem/1.45 "Spline Sans Mono", monospace; }

.component { margin-block: 32px 48px; }
.engine-acts, .material-tabs, .condition-tabs {
  display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px;
}
.pill {
  min-height: 44px; padding: 8px 15px; border: 1px solid var(--line); border-radius: 100px;
  background: transparent; color: var(--ink-dim); cursor: pointer;
  font: 500 .8125rem/1.4 "Spline Sans Mono", monospace;
}
.pill:hover, .pill.on { border-color: var(--gold-dim); color: var(--gold); background: var(--bg-well); }
.engine-stage, .material-stage {
  display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(300px, .7fr); gap: 20px; align-items: stretch;
}
.engine-flow, .material-viz, .engine-detail, .material-passport {
  min-width: 0; padding: 24px; border: 1px solid var(--line); border-radius: 16px; background: var(--bg-well);
}
.engine-flow { display: grid; justify-items: center; gap: 10px; }
.flow-row { width: 100%; display: flex; justify-content: center; gap: 18px; position: relative; }
.flow-row.branch::before { content: "↙  two directions  ↘"; position: absolute; top: -23px; color: var(--gold-dim); font: 500 .7rem/1.3 "Spline Sans Mono", monospace; letter-spacing: .06em; }
.flow-arrow { color: var(--gold-dim); font: 500 1rem/1 "Spline Sans Mono", monospace; }
.engine-node {
  width: min(210px, 44%); min-height: 78px; padding: 12px 14px;
  border: 1px solid var(--line); border-radius: 12px; background: var(--bg-raise); cursor: pointer; text-align: left;
}
.engine-node b { display: block; color: var(--ink); font: 500 1.05rem/1.2 "Alegreya", Georgia, serif; }
.engine-node small { display: block; margin-top: 5px; color: var(--ink-faint); font: 400 .7rem/1.35 "Spline Sans Mono", monospace; }
.engine-node.on, .engine-node.active { border-color: var(--gold); background: color-mix(in oklch, var(--gold) 9%, var(--bg-raise)); }
.engine-node.dim { opacity: .42; }
.engine-detail { border-color: var(--gold-dim); background: linear-gradient(150deg, var(--bg-raise), var(--bg-well)); }
.detail-step { color: var(--gold-dim); font: 500 .75rem/1.4 "Spline Sans Mono", monospace; text-transform: uppercase; }
.engine-detail h3, .material-passport h3 { margin: 10px 0 18px; font-family: "Young Serif", Georgia, serif; font-size: 2rem; font-weight: 400; }
.detail-grid { display: grid; gap: 16px; }
.detail-grid dt { color: var(--gold-dim); font: 500 .7rem/1.4 "Spline Sans Mono", monospace; letter-spacing: .08em; text-transform: uppercase; }
.detail-grid dd { margin: 4px 0 0; color: var(--ink-dim); font: 400 1.03rem/1.5 "Alegreya", Georgia, serif; }
.detail-link { display: inline-flex; align-items: center; min-height: 44px; margin-top: 18px; padding: 8px 14px; border: 1px solid var(--gold-dim); border-radius: 100px; text-decoration: none; font: 500 .75rem/1.4 "Spline Sans Mono", monospace; }

.knob-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.knob { min-width: 0; padding: 20px; border: 1px solid var(--line); border-radius: 14px; background: var(--bg-well); }
.knob b { color: var(--gold); font: 500 .8125rem/1.4 "Spline Sans Mono", monospace; }
.knob p { margin: 12px 0; color: var(--ink); font: 400 var(--prose-size)/var(--prose-leading) "Alegreya", Georgia, serif; }
.knob small { color: var(--ink-faint); font: 400 .75rem/1.5 "Spline Sans Mono", monospace; }
.material-viz { min-height: 430px; display: grid; place-items: center; }
.material-viz svg { width: 100%; height: auto; }
.material-viz .field-line { fill: none; stroke: var(--gold-dim); stroke-width: 2.4; stroke-dasharray: 7 7; marker-end: url(#fieldArrow); }
.material-viz .sample { fill: var(--bg-raise); stroke: var(--ink-dim); stroke-width: 2; }
.material-viz .response { fill: none; stroke: var(--agrees); stroke-width: 3; }
.material-viz .motion { fill: none; stroke: var(--testable); stroke-width: 3; marker-end: url(#motionArrow); }
.material-viz text { fill: var(--ink-dim); font: 500 13px "Spline Sans Mono", monospace; }
.condition-label { margin: 16px 0 8px; color: var(--ink-faint); font: 500 .75rem/1.4 "Spline Sans Mono", monospace; text-transform: uppercase; }

.comparison-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 14px; }
.comparison-table { width: 100%; border-collapse: collapse; min-width: 820px; background: var(--bg-well); }
.comparison-table th, .comparison-table td { padding: 18px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.comparison-table th { color: var(--gold-dim); font: 500 .75rem/1.45 "Spline Sans Mono", monospace; letter-spacing: .05em; text-transform: uppercase; }
.comparison-table td { color: var(--ink-dim); font: 400 1rem/1.5 "Alegreya", Georgia, serif; }
.comparison-table tr:last-child td { border-bottom: 0; }

.component-title { margin-bottom: 12px; color: var(--gold-dim); font: 500 .72rem/1.5 "Spline Sans Mono", monospace; letter-spacing: .08em; text-transform: uppercase; }
.data-card-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.data-card { min-width: 0; padding: 20px; border: 1px solid var(--line); border-radius: 14px; background: var(--bg-well); }
.data-card-kicker { margin-bottom: 14px; color: var(--gold); font: 500 .72rem/1.45 "Spline Sans Mono", monospace; letter-spacing: .04em; text-transform: uppercase; }
.data-pair + .data-pair { margin-top: 13px; padding-top: 13px; border-top: 1px solid var(--line); }
.data-pair b { color: var(--gold-dim); font: 500 .66rem/1.4 "Spline Sans Mono", monospace; letter-spacing: .06em; text-transform: uppercase; }
.data-pair p { margin-top: 4px; color: var(--ink-dim); }
.simple-flow { display: flex; align-items: stretch; gap: 8px; overflow-x: auto; padding-bottom: 10px; }
.simple-flow i { align-self: center; color: var(--gold-dim); font: 500 .8rem/1 "Spline Sans Mono", monospace; font-style: normal; }
.simple-step { flex: 1 0 150px; min-height: 112px; padding: 16px; border: 1px solid var(--line); border-radius: 12px; background: var(--bg-well); }
.simple-step span { display: block; color: var(--gold-dim); font: 500 .66rem/1.4 "Spline Sans Mono", monospace; }
.simple-step b { display: block; margin-top: 13px; color: var(--ink); font: 500 1.05rem/1.3 "Alegreya", Georgia, serif; }

.series-map { display: grid; gap: 20px; }
.series-path {
  display: flex; align-items: stretch; gap: 8px; overflow-x: auto; padding: 4px 4px 16px;
  scrollbar-color: var(--gold-dim) var(--bg-well);
}
.series-arrow { align-self: center; flex: 0 0 auto; color: var(--gold-dim); font: 500 .8rem/1 "Spline Sans Mono", monospace; }
.series-node {
  flex: 0 0 190px; min-height: 150px; padding: 16px; border: 1px solid var(--line); border-radius: 14px;
  background: var(--bg-well); cursor: pointer; text-align: left;
}
.series-node > span { display: block; color: var(--gold-dim); font: 500 .7rem/1.4 "Spline Sans Mono", monospace; }
.series-node b { display: block; margin-top: 12px; color: var(--ink); font: 500 1.15rem/1.2 "Alegreya", Georgia, serif; }
.series-node small { display: block; margin-top: 10px; color: var(--ink-faint); font: 400 .72rem/1.5 "Spline Sans Mono", monospace; }
.series-node:hover, .series-node.on { border-color: var(--gold); background: color-mix(in oklch, var(--gold) 8%, var(--bg-well)); }
.series-detail {
  max-width: 760px; min-height: 280px; padding: 28px; border: 1px solid var(--gold-dim); border-radius: 16px;
  background: linear-gradient(145deg, var(--bg-raise), var(--bg-well));
}
.series-detail h3 { margin: 8px 0 16px; font-family: "Young Serif", Georgia, serif; font-size: clamp(2rem, 4vw, 3.4rem); font-weight: 400; }
.series-question, .series-outcome p { max-width: var(--prose); margin: 0; color: var(--ink); font: 400 var(--prose-size)/var(--prose-leading) "Alegreya", Georgia, serif; }
.series-outcome { margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--line); }
.series-outcome b { color: var(--gold-dim); font: 500 .72rem/1.4 "Spline Sans Mono", monospace; letter-spacing: .07em; text-transform: uppercase; }
.series-outcome p { margin-top: 6px; color: var(--ink-dim); }

.evidence-atlas { max-width: 980px; }
.atlas-toolbar {
  display: grid; grid-template-columns: minmax(280px, 2fr) repeat(3, minmax(150px, 1fr)); gap: 12px;
  padding: 18px; border: 1px solid var(--line); border-radius: 16px; background: var(--bg-well);
}
.atlas-toolbar label { min-width: 0; }
.atlas-toolbar label > span { display: block; margin-bottom: 7px; color: var(--gold-dim); font: 500 .68rem/1.4 "Spline Sans Mono", monospace; letter-spacing: .05em; text-transform: uppercase; }
.atlas-toolbar input, .atlas-toolbar select {
  width: 100%; min-height: 48px; height: 48px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 9px;
  background: var(--bg-raise); color: var(--ink); font: 400 .82rem/1.4 "Spline Sans Mono", monospace;
}
.atlas-toolbar select { appearance: none; -webkit-appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--gold-dim) 50%), linear-gradient(135deg, var(--gold-dim) 50%, transparent 50%); background-position: calc(100% - 16px) 20px, calc(100% - 11px) 20px; background-size: 5px 5px; background-repeat: no-repeat; padding-right: 30px; }
.atlas-summary { margin: 18px 0; color: var(--ink-faint); font: 400 .75rem/1.5 "Spline Sans Mono", monospace; }
.atlas-summary b { color: var(--gold); }
.atlas-results { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.atlas-card { min-width: 0; padding: 20px; border: 1px solid var(--line); border-radius: 14px; background: var(--bg-well); }
.atlas-card h3 { margin: 14px 0 10px; color: var(--ink); font: 500 1.18rem/1.28 "Alegreya", Georgia, serif; }
.atlas-card p { margin: 0; color: var(--ink-dim); font: 400 1rem/1.55 "Alegreya", Georgia, serif; }
.atlas-tags, .atlas-meta { display: flex; flex-wrap: wrap; gap: 6px; }
.atlas-tags span { padding: 4px 7px; border: 1px solid var(--line); border-radius: 100px; color: var(--gold-dim); font: 500 .62rem/1.3 "Spline Sans Mono", monospace; text-transform: uppercase; }
.atlas-meta { margin-top: 16px; color: var(--ink-faint); font: 400 .66rem/1.45 "Spline Sans Mono", monospace; }
.atlas-meta span + span::before { content: "·"; margin-right: 6px; }
.atlas-card a { display: inline-flex; align-items: center; min-height: 44px; margin-top: 12px; font: 500 .72rem/1.4 "Spline Sans Mono", monospace; }
.apparatus-card { margin-top: 16px; border-top: 1px solid var(--line); }
.apparatus-card summary { min-height: 44px; padding: 13px 0; color: var(--gold); cursor: pointer; font: 500 .72rem/1.4 "Spline Sans Mono", monospace; }
.apparatus-card > div { display: grid; gap: 10px; padding: 4px 0 14px; }
.apparatus-card section { padding: 11px 12px; border-left: 2px solid var(--line); background: var(--bg-raise); }
.apparatus-card section b { color: var(--gold-dim); font: 500 .62rem/1.4 "Spline Sans Mono", monospace; letter-spacing: .05em; text-transform: uppercase; }
.apparatus-card section p { margin-top: 4px; font-size: .92rem; line-height: 1.5; }
.atlas-more { min-height: 48px; margin-top: 18px; padding: 10px 18px; border: 1px solid var(--gold-dim); border-radius: 100px; background: var(--bg-well); color: var(--gold); cursor: pointer; font: 500 .78rem/1.4 "Spline Sans Mono", monospace; }
.atlas-more[hidden] { display: none; }
.atlas-empty { color: var(--ink-dim); font: 400 var(--prose-size)/var(--prose-leading) "Alegreya", Georgia, serif; }

.term { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; margin-block: -5px; padding: 0; border: 0; border-bottom: 1px dotted var(--gold-dim); background: transparent; color: inherit; cursor: help; font: inherit; }
.tooltip {
  position: fixed; z-index: 120; width: min(280px, calc(100vw - 28px)); padding: 12px 14px;
  border: 1px solid var(--gold-dim); border-radius: 10px; background: var(--bg-raise);
  color: var(--ink); box-shadow: 0 12px 35px oklch(0 0 0 / .45);
  font: 400 .8125rem/1.5 "Spline Sans Mono", monospace;
}
.tooltip[hidden] { display: none; }

.source-dialog { width: min(1100px, calc(100vw - 32px)); max-height: calc(100vh - 32px); padding: 0; border: 1px solid var(--line); border-radius: 16px; background: var(--bg-well); color: var(--ink); }
.source-dialog::backdrop { background: oklch(0 0 0 / .76); }
.source-dialog-bar { min-height: 60px; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 8px 12px 8px 20px; border-bottom: 1px solid var(--line); }
.source-dialog-title { font: 500 .75rem/1.4 "Spline Sans Mono", monospace; color: var(--ink-dim); }
.source-dialog-close { width: 44px; height: 44px; border: 1px solid var(--line); border-radius: 50%; background: transparent; cursor: pointer; }
.source-dialog img { width: 100%; max-height: calc(100vh - 94px); object-fit: contain; background: #e8e1d3; }

.site-footer { padding-block: 64px; border-top: 1px solid var(--line); color: var(--ink-faint); font: 400 .75rem/1.6 "Spline Sans Mono", monospace; }
.load-error { padding: 120px 24px; color: var(--ink); }

@media (max-width: 1239px) {
  #tocRail { display: none; }
  #tocFab { display: block; }
  .home-mark { left: 70px; }
}

@media (max-width: 900px) and (min-width: 761px) {
  .atlas-toolbar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .atlas-search { grid-column: 1 / -1; }
}

@media (max-width: 760px) {
  :root { --page-inline: 20px; }
  .home-mark { max-width: 130px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
  .page-switch { max-width: 130px; overflow: hidden; white-space: nowrap; }
  .hero { min-height: auto; padding-block: 112px 64px; }
  .hero h1 { font-size: clamp(3rem, 16vw, 5rem); }
  .hero-meta { display: grid; gap: 8px; }
  .section { padding-block: 64px; }
  .honesty-grid, .engine-stage, .material-stage, .figure-grid, .knob-grid, .atlas-results, .atlas-toolbar, .data-card-grid { grid-template-columns: 1fr; }
  .engine-detail { order: 2; }
  .engine-flow { padding: 18px 12px; }
  .flow-row { gap: 10px; }
  .engine-node { width: min(230px, 48%); min-height: 88px; padding: 10px; }
  .engine-node b { font-size: .98rem; }
  .engine-node small { font-size: .65rem; }
  .material-viz { min-height: 330px; padding: 14px; }
  .comparison-wrap { overflow: visible; border: 0; }
  .comparison-table, .comparison-table tbody, .comparison-table tr, .comparison-table td { display: block; min-width: 0; width: 100%; }
  .comparison-table thead { display: none; }
  .comparison-table tr { margin-bottom: 16px; border: 1px solid var(--line); border-radius: 14px; background: var(--bg-well); overflow: hidden; }
  .comparison-table td { padding: 15px 18px; border-bottom: 1px solid var(--line); }
  .comparison-table td::before { content: attr(data-label); display: block; margin-bottom: 6px; color: var(--gold-dim); font: 500 .7rem/1.4 "Spline Sans Mono", monospace; letter-spacing: .06em; text-transform: uppercase; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
}