:root {
  color-scheme: light;
  --ground: #c8c2b2;
  --ink: #27291f;
  --blue: #253c91;
  --paper: #e6e0d2;
  --quiet: #494b3d;
  --cut: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 16px 100%, 0 calc(100% - 16px));
  font-family: Georgia, serif;
  font-size: 19px;
  line-height: 1.62;
  background: var(--ground);
  color: var(--ink);
}
* { box-sizing: border-box; }
html { scroll-padding-top: 24px; }
body { margin: 0; }
main { max-width: 1200px; margin: 0 auto; padding: 0 40px 72px; }
h1, h2, h3, p, ul, ol, figure, table { margin-top: 0; }
h1, h2, h3 { font-family: inherit; font-weight: 400; }
h1 { font-size: clamp(2.5rem, 5.6vw, 4.5rem); line-height: 1.08; max-width: 17ch; margin-bottom: 32px; overflow-wrap: break-word; }
h2 { font-size: clamp(1.65rem, 2.4vw, 2.15rem); line-height: 1.2; margin-bottom: 24px; max-width: 27ch; }
h3 { font-size: 1.35rem; line-height: 1.3; }
p { max-width: 68ch; margin-bottom: 24px; }
ul, ol { padding-left: 26px; }
li { margin-bottom: 12px; }
a { color: var(--blue); text-underline-offset: 5px; text-decoration-thickness: 1px; overflow-wrap: anywhere; }
a:hover { text-decoration-thickness: 2px; }
a:focus-visible, button:focus-visible, summary:focus-visible { outline: 3px solid var(--blue); outline-offset: 5px; }
a, button, summary { -webkit-tap-highlight-color: #253c9130; }
button, summary { font: inherit; }
button { cursor: pointer; }
button[hidden] { display: none; }
table { width: 100%; border-collapse: collapse; text-align: left; margin-bottom: 64px; }
caption { text-align: left; font-weight: 700; margin-bottom: 20px; }
th, td { vertical-align: top; padding: 20px; border-bottom: 1px solid #828273; }
thead { background: var(--blue); color: #fff; }
tbody th { width: 28%; font-weight: 700; }
tbody tr:nth-child(even) { background: #d5cfbf; }
strong { font-weight: 700; }
::selection { background: var(--blue); color: white; }
.skip-link { position: absolute; top: -100px; left: 20px; min-height: 48px; padding: 12px 20px; background: var(--paper); z-index: 10; }
.skip-link:focus { top: 12px; }
.split-head { display: grid; grid-template-columns: 1fr auto 1fr; gap: 30px; align-items: center; max-width: 1360px; padding: 32px 40px; margin: auto; }
.split-head nav { display: flex; align-items: center; gap: 24px; }
.split-head nav:last-child { justify-content: flex-end; }
.split-head nav a { display: inline-flex; align-items: center; min-height: 48px; text-decoration: none; font-size: 18px; }
.split-head nav a[aria-current] { text-decoration: underline; text-decoration-thickness: 2px; }
.guide-name { text-align: center; font-size: 29px; font-weight: 700; text-decoration: none; line-height: 1.12; padding: 10px 20px; min-height: 60px; }
.guide-name span { display: block; font-size: 17px; font-weight: 400; margin-top: 7px; }
.page-opening { padding: 64px 0 28px; }
.guide-label { color: var(--blue); font-size: 19px; margin-bottom: 26px; }
.scene { font-size: clamp(1.16rem, 1.8vw, 1.35rem); line-height: 1.5; max-width: 46ch; margin-bottom: 32px; }
.evidence-date { font-size: 17px; color: var(--quiet); max-width: 70ch; margin-bottom: 32px; }
.opening-spread { display: grid; grid-template-columns: minmax(0, 740px) minmax(160px, 1fr); gap: 70px; margin: 0 0 70px; }
.opening-spread > div > p:first-child { font-size: 21px; }
.reading-row { display: grid; grid-template-columns: minmax(0, 740px) minmax(160px, 1fr); gap: 70px; margin: 76px 0; }
.reading-row > div { min-width: 0; }
.chapter-group { margin: 76px 0; }
.chapter-group > h2 { max-width: 28ch; margin-bottom: 40px; }
.chapter-group .reading-row { margin: 42px 0; }
.margin-gloss { align-self: start; color: var(--blue); font-size: 18px; line-height: 1.5; padding-top: 8px; }
.margin-gloss::before { content: ''; display: block; width: 36px; height: 7px; background: var(--blue); margin-bottom: 20px; clip-path: polygon(0 0, 100% 0, calc(100% - 7px) 100%, 0 100%); }
.margin-gloss p { margin: 0; }
.ink-button { display: inline-flex; justify-content: center; align-items: center; gap: 12px; min-height: 58px; max-width: 100%; padding: 16px 26px; margin: 6px 0 10px; background: var(--blue); color: #fff; clip-path: var(--cut); text-decoration: none; line-height: 1.4; }
.ink-button:hover { background: #192e78; }
.ink-button:focus-visible { outline: none; box-shadow: inset 0 0 0 4px #fff; text-decoration: underline; }
.page-link { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 52px; max-width: 740px; padding: 12px 0; line-height: 1.45; }
.page-link span, .ink-button span { flex-shrink: 0; }
.care-map { margin: 0 0 80px; padding: 36px; background: var(--paper); clip-path: var(--cut); }
.care-map figcaption { font-size: 21px; margin-bottom: 30px; }
.care-map ol { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; list-style: none; padding: 0; margin: 0; }
.care-map li { margin: 0; position: relative; padding: 20px 0 0; border-top: 3px solid var(--blue); }
.care-map li::before { content: ''; position: absolute; top: -8px; left: 0; width: 13px; height: 13px; background: var(--blue); clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); }
.care-map strong, .care-map span { display: block; }
.care-map strong { font-size: 20px; margin-bottom: 8px; }
.care-map span { font-size: 18px; line-height: 1.5; }
.route-index { display: grid; grid-template-columns: 1fr 1fr; gap: 0 30px; }
.route-index a { border-top: 1px solid #919182; }
.source-slip { max-width: 820px; margin-top: 80px; padding: 36px 42px; background: #d9d3c5; clip-path: var(--cut); }
.source-slip h2 { font-size: 1.4rem; font-weight: 700; }
.source-slip p { font-size: 17px; }
.source-slip ul { padding: 0; margin-bottom: 0; list-style: none; }
.source-slip li { margin: 0; }
.source-slip a { display: flex; align-items: center; justify-content: space-between; min-height: 48px; gap: 20px; padding: 9px 0; font-size: 17px; line-height: 1.4; }
.source-slip a span { flex-shrink: 0; }
.continue-slip { display: flex; flex-wrap: wrap; align-items: center; gap: 30px; margin-top: 48px; max-width: 820px; }
.continue-slip a { font-size: 22px; }
.continue-slip > a { flex: 1 1 220px; }
.folio-end { padding: 58px max(40px, calc((100vw - 1120px) / 2)) 44px; background: #b6b19f; }
.folio-end > p { max-width: 44ch; font-size: 21px; margin-bottom: 34px; }
.folio-end nav ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px 40px; margin: 0; padding: 0; list-style: none; }
.folio-end li { margin: 0; }
.folio-end nav a { display: flex; align-items: center; min-height: 48px; padding: 10px 0; font-size: 17px; line-height: 1.4; }
.folio-end nav a[aria-current] { font-weight: 700; }
.back-link { display: inline-flex; align-items: center; min-height: 48px; padding: 12px 0; font-size: 17px; margin-top: 36px; }
.cost-map { max-width: 740px; background: var(--paper); clip-path: var(--cut); }
.cost-map td, .cost-map th { font-size: 18px; }
.question-stack { max-width: 820px; margin: 56px 0 80px; }
.reveal-switch { display: inline-flex; min-height: 52px; padding: 12px 24px; border: 0; margin: 0 0 28px; background: var(--blue); color: #fff; clip-path: var(--cut); }
.reveal-switch:focus-visible { box-shadow: inset 0 0 0 4px #fff; outline: none; text-decoration: underline; }
.myth-slip { background: var(--paper); margin: 0 0 18px; clip-path: var(--cut); }
.myth-slip summary { display: list-item; cursor: pointer; min-height: 64px; padding: 24px 32px; line-height: 1.5; color: var(--blue); font-weight: 700; }
.myth-slip summary h3 { display: inline; margin: 0; font-size: 1rem; line-height: 1.5; font-weight: 700; }
.myth-slip summary:focus-visible { outline-offset: -6px; }
.myth-slip > div { padding: 4px 32px 18px; }
.myth-slip > div p:last-child { margin-bottom: 14px; }
.notes-pocket { max-width: 740px; padding: 36px; background: var(--paper); clip-path: var(--cut); margin-top: 64px; }
.error-head { max-width: 1200px; margin: auto; padding: 32px 40px; }
.error-head a { min-height: 48px; display: inline-flex; align-items: center; }
@media (max-width: 1050px) {
  .split-head { gap: 14px; padding-right: 28px; padding-left: 28px; }
  .split-head nav { gap: 16px; }
  .split-head nav a { font-size: 17px; }
  .opening-spread, .reading-row { grid-template-columns: minmax(0, 1fr) 180px; gap: 36px; }
  .guide-name { padding: 10px; }
}
@media (max-width: 760px) {
  :root { font-size: 18px; }
  main { padding: 0 24px 48px; }
  h1 { font-size: clamp(2.4rem, 10vw, 3.6rem); max-width: 18ch; }
  h2 { font-size: 1.7rem; }
  .split-head { grid-template-columns: 1fr 1fr; gap: 12px 16px; padding: 20px 24px; }
  .guide-name { grid-row: 1; grid-column: 1 / -1; justify-self: start; padding: 6px 0; text-align: left; font-size: 27px; }
  .guide-name span { display: inline; margin-left: 12px; font-size: 18px; }
  .split-head nav { gap: 0; display: grid; grid-template-columns: 1fr; align-self: start; }
  .split-head nav:last-child { justify-content: stretch; }
  .split-head nav a { min-height: 46px; font-size: 17px; padding: 8px 0; }
  .page-opening { padding-top: 40px; padding-bottom: 12px; }
  .guide-label { font-size: 18px; margin-bottom: 24px; }
  .scene { font-size: 21px; }
  .opening-spread, .reading-row { display: block; }
  .reading-row { margin: 54px 0; }
  .chapter-group { margin: 54px 0; }
  .chapter-group .reading-row { margin: 34px 0; }
  .opening-spread { margin-bottom: 40px; }
  .margin-gloss { margin-top: 28px; padding: 18px 0 0; max-width: 42ch; }
  .margin-gloss::before { margin-bottom: 14px; }
  .care-map { padding: 28px; margin-bottom: 54px; }
  .care-map ol { grid-template-columns: 1fr 1fr; gap: 28px 22px; }
  .care-map strong { font-size: 19px; }
  .care-map span { font-size: 17px; }
  .route-index { grid-template-columns: 1fr; }
  .source-slip { padding: 28px; margin-top: 54px; }
  .source-slip h2 { font-size: 25px; }
  .folio-end { padding: 40px 24px; }
  .folio-end nav ul { grid-template-columns: 1fr; gap: 0; }
  .folio-end nav a { min-height: 46px; font-size: 17px; }
  .cost-map td, .cost-map th { padding: 16px 12px; font-size: 17px; }
  .cost-map tbody th { width: 35%; }
  .cost-map caption { line-height: 1.5; }
  .myth-slip summary { padding: 22px 26px; }
  .myth-slip > div { padding: 4px 26px 18px; }
  .notes-pocket { padding: 28px; }
  .continue-slip { margin-top: 32px; }
  .error-head { padding: 24px; }
}
@media (max-width: 360px) {
  main { padding-right: 18px; padding-left: 18px; }
  .care-map { padding: 24px; }
  .care-map ol { grid-template-columns: 1fr; }
  .guide-name span { display: block; margin-left: 0; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto; animation: none; transition: none; }
}
@media print {
  :root { font-size: 12pt; background: white; color: black; }
  .split-head, .skip-link, .folio-end nav, .back-link, .continue-slip, .reveal-switch { display: none; }
  main { max-width: none; padding: 0; }
  .page-opening { padding-top: 0; }
  h1 { font-size: 30pt; max-width: 22ch; }
  h2 { font-size: 20pt; break-after: avoid; }
  .reading-row, .opening-spread { display: block; margin: 30pt 0; }
  .margin-gloss { color: black; font-size: 11pt; margin: 12pt 0; }
  .source-slip, .notes-pocket, .care-map, .myth-slip { clip-path: none; background: #eee; break-inside: avoid; }
  .myth-slip > div { display: block; }
  .folio-end { background: white; padding: 24pt 0 0; }
}