:root {
  color-scheme: light dark;
  --paper: #f6f0e4;
  --ink: #2b2118;
  --muted: #675744;
  --rule: #9b8970;
  --link: #513d29;
  --measure: 34em;
}
@media (prefers-color-scheme: dark) {
  :root { --paper: #141c26; --ink: #e8dfcc; --muted: #c7b99f; --rule: #77808a; --link: #e8d3ae; }
}
* { box-sizing: border-box; }
html { min-width: 320px; background: var(--paper); scroll-behavior: smooth; }
body { min-height: 100vh; margin: 0; background: var(--paper); color: var(--ink); font: 400 19px/1.7 "Libre Caslon Text", Georgia, serif; text-wrap: pretty; -webkit-font-smoothing: antialiased; }
a { color: var(--link); text-underline-offset: .2em; }
a:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
::selection { color: var(--paper); background: var(--ink); }
.frontispiece { position: relative; display: flex; min-height: min(88svh, 820px); flex-direction: column; align-items: center; justify-content: center; overflow: hidden; padding: max(4rem, env(safe-area-inset-top)) max(1.5rem, env(safe-area-inset-right)) 3rem max(1.5rem, env(safe-area-inset-left)); text-align: center; }
.compass-rose { position: absolute; top: 50%; left: 50%; width: min(76vw, 34rem); color: var(--rule); opacity: .085; transform: translate(-50%, -50%); pointer-events: none; }
.frontispiece > :not(.compass-rose) { position: relative; }
.overline, .chapter-number { margin: 0; color: var(--muted); font: small-caps .82rem "IM Fell English", Georgia, serif; letter-spacing: .14em; text-transform: uppercase; }
.frontispiece h1 { max-width: 17ch; margin: 1.2rem 0; font: 400 clamp(2.35rem, 10vw, 5rem)/1.08 "IM Fell English", Georgia, serif; font-variant: small-caps; text-wrap: balance; }
.ornament { color: var(--muted); font-size: .8rem; }
.ornament::before, .ornament::after { display: inline-block; width: 3.5rem; height: 1px; margin: 0 .75rem .28rem; background: var(--rule); content: ""; }
.frontispiece-note { margin: .8rem 0 0; color: var(--muted); font-style: italic; }
.frontispiece-date { margin: 1rem 0 0; color: var(--ink); font-size: clamp(1rem, 4vw, 1.2rem); letter-spacing: .16em; }
.contents { max-width: 47rem; margin: 0 auto; padding: 2.5rem max(1.5rem, env(safe-area-inset-right)) max(5rem, env(safe-area-inset-bottom)) max(1.5rem, env(safe-area-inset-left)); text-align: center; }
.contents h2 { margin: .35rem 0 2rem; font: 400 clamp(2rem, 8vw, 3rem)/1.15 "IM Fell English", Georgia, serif; }
.chapter-list { margin: 0; padding: 0; border-top: 1px solid var(--rule); list-style: none; text-align: left; }
.chapter-list li { border-bottom: 1px solid var(--rule); }
.chapter-list a { display: grid; min-height: 4rem; grid-template-columns: 2.5rem 1fr; align-items: baseline; gap: .8rem; padding: .8rem .25rem; color: var(--ink); text-decoration: none; }
.roman { color: var(--muted); font: small-caps 1rem "IM Fell English", Georgia, serif; letter-spacing: .08em; }
.reading-progress { position: fixed; z-index: 2; inset: 0 0 auto; height: 2px; pointer-events: none; }
.reading-progress span { display: block; width: 100%; height: 100%; background: var(--ink); transform: scaleX(0); transform-origin: left center; }
.chapter-heading { max-width: var(--measure); margin: 0 auto; padding: max(2.75rem, env(safe-area-inset-top)) max(1.5rem, env(safe-area-inset-right)) 1.5rem max(1.5rem, env(safe-area-inset-left)); text-align: center; }
.index-link { display: inline-block; margin-bottom: 2.8rem; color: var(--muted); font: small-caps .8rem "IM Fell English", Georgia, serif; letter-spacing: .08em; text-decoration: none; }
.chapter-number { margin-bottom: .7rem; }
.chapter-heading h1 { margin: 0; font: 400 clamp(2.2rem, 9vw, 3.5rem)/1.15 "IM Fell English", Georgia, serif; text-wrap: balance; }
.chapter-summary { margin: 1rem auto 0; color: var(--muted); font-size: 1rem; font-style: italic; line-height: 1.55; }
.epigraph { max-width: 27em; margin: 1.8rem auto 0; color: var(--muted); font-size: .92rem; font-style: italic; text-align: right; }
.epigraph p { margin: 0 0 .25rem; }
.epigraph cite { font-size: .82rem; font-style: normal; font-variant: small-caps; letter-spacing: .08em; }
.rule { display: block; width: 4rem; height: 1px; margin: 1.8rem auto 0; background: var(--rule); }
.reading-column { max-width: calc(var(--measure) + 3rem); margin: 0 auto; padding: 0 max(1.5rem, env(safe-area-inset-right)) max(4rem, env(safe-area-inset-bottom)) max(1.5rem); }
.chapter-text p { margin: 0 0 1.2em; text-align: left; text-wrap: pretty; hyphens: none; }
.chapter-text > p:first-of-type::first-letter { float: left; margin: .09em .1em 0 0; font: 3.5em/.78 "IM Fell English", Georgia, serif; }
.chapter-text em { font-style: italic; }
.scene-break { margin: 2rem 0; color: var(--muted); font: 1.5rem/1 "IM Fell English", Georgia, serif; text-align: center !important; }
.chapter-navigation { display: flex; justify-content: space-between; gap: 1rem; margin-top: 3rem; padding-top: 1rem; border-top: 1px solid var(--rule); font-size: .85rem; }
.chapter-navigation a { color: var(--muted); text-decoration: none; }
@media (min-width: 700px) { body { font-size: 20px; } .chapter-heading { padding-top: 4rem; } .index-link { margin-bottom: 3.5rem; } }
@media (max-width: 380px) { .compass-rose { width: 92vw; opacity: .06; } .frontispiece { min-height: 78svh; } .chapter-heading { padding-top: max(2rem, env(safe-area-inset-top)); } .index-link { margin-bottom: 2rem; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
