:root{
  --stone:#EDEAE3; --stone-deep:#E2DDD2; --carbon:#22201C; --carbon-soft:#57534A;
  --imperial:#8C2B2B; --bronze:#8E7440; --bronze-bright:#B29455; --line:#C9C2B2;
  --page:#F8F3E7; --page-shade:#EDE5D2;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--stone);color:var(--carbon);font-family:"Crimson Pro",Georgia,serif;line-height:1.65}
.inscr{font-family:"Marcellus",serif;text-transform:uppercase;letter-spacing:.2em}
a{color:inherit}
header.site{border-bottom:1px solid var(--line);background:var(--stone)}
.mast{max-width:1200px;margin:0 auto;padding:22px 32px;display:flex;justify-content:space-between;align-items:baseline;gap:20px;flex-wrap:wrap}
.mast .name{font-family:"Marcellus",serif;font-size:20px;letter-spacing:.12em;text-transform:uppercase;text-decoration:none}
.mast .name span{color:var(--imperial)}
nav.top{display:flex;gap:24px;align-items:baseline;flex-wrap:wrap}
nav.top a{color:var(--carbon-soft);text-decoration:none;font-size:11.5px;font-family:"Marcellus",serif;letter-spacing:.16em;text-transform:uppercase}
nav.top a:hover,nav.top a.here{color:var(--imperial)}
nav.top a.support{border:1px solid var(--imperial);color:var(--imperial);padding:6px 13px}
nav.top a.support:hover{background:var(--imperial);color:var(--stone)}
.crumb{max-width:1200px;margin:0 auto;padding:18px 32px 0;font-family:"Marcellus",serif;font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--bronze)}
.crumb a{text-decoration:none;color:var(--bronze)}
.crumb a:hover{color:var(--imperial)}
footer.site{padding:36px 32px 46px;text-align:center;font-size:13px;color:var(--carbon-soft);border-top:1px solid var(--line);margin-top:70px}
footer.site .motto{font-family:"Marcellus",serif;font-size:10.5px;letter-spacing:.26em;text-transform:uppercase;color:var(--bronze);margin-bottom:10px}
.redirect-note{background:var(--carbon);color:var(--stone);text-align:center;font-size:13.5px;padding:9px 16px}
.redirect-note b{color:var(--bronze-bright);font-weight:600}

/* ---- volume spread (windowed) ---- */
.volume-shell{max-width:1240px;margin:26px auto 0;padding:0 28px}
.vol-head{text-align:center;margin:26px 0 22px}
.vol-head h1{font-family:"Marcellus",serif;font-weight:400;font-size:clamp(26px,3.4vw,40px);letter-spacing:.04em;text-transform:uppercase}
.vol-head h1 span{color:var(--imperial)}
.vol-head .meta{font-style:italic;color:var(--carbon-soft);margin-top:6px}
.spread{
  display:grid;grid-template-columns:2fr 3fr;position:relative;
  background:var(--page);border-radius:6px;overflow:hidden;
  box-shadow:0 40px 70px -40px rgba(34,32,28,.55), 0 0 0 1px rgba(34,32,28,.07);
  min-height:70vh;
}
.spread::after{content:"";position:absolute;left:40%;top:0;bottom:0;width:1px;
  background:linear-gradient(rgba(0,0,0,.16),rgba(0,0,0,.05),rgba(0,0,0,.16));pointer-events:none}
.pg{padding:44px 44px 40px;overflow-y:auto;max-height:86vh}
.pg.toc{background:linear-gradient(83deg,var(--page-shade),var(--page) 45%);box-shadow:inset -20px 0 26px -20px rgba(0,0,0,.25)}
.pg.reader{background:linear-gradient(277deg,var(--page-shade),var(--page) 45%);box-shadow:inset 20px 0 26px -20px rgba(0,0,0,.2)}
.ribbon{position:absolute;top:0;right:7%;width:20px;height:86px;z-index:3;background:linear-gradient(#7A252C,#5E1B21);
  clip-path:polygon(0 0,100% 0,100% 100%,50% 88%,0 100%);box-shadow:0 8px 12px -6px rgba(0,0,0,.35);pointer-events:none}
.toc h2{font-family:"Marcellus",serif;font-weight:400;font-size:21px;margin-bottom:4px}
.toc .vmeta{font-style:italic;color:var(--carbon-soft);font-size:13.5px;margin-bottom:14px}
.toc .vrule{width:54px;height:2px;background:var(--bronze);margin:0 0 20px}
.toc-group{margin-bottom:20px}
.toc-group h6{font-family:"Marcellus",serif;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--bronze);margin-bottom:8px;font-weight:600;cursor:pointer}
.toc-group h6 .n{color:var(--carbon-soft);letter-spacing:0}
.toc-item{display:flex;gap:9px;align-items:baseline;width:100%;text-align:left;background:none;border:none;cursor:pointer;
  padding:5px 0;font-family:"Crimson Pro",serif;font-size:14.5px;color:var(--carbon);text-decoration:none;line-height:1.35}
.toc-item:hover .tt{color:var(--imperial)}
.toc-item.active .tt{color:var(--imperial);font-weight:600}
.toc-item .d{font-family:"Marcellus",serif;font-size:9.5px;color:var(--carbon-soft);min-width:52px}
.leaf{transform-origin:left center;backface-visibility:hidden;transition:transform .24s cubic-bezier(.55,0,.85,.5)}
.leaf.turning{transform:rotateY(-88deg)}
.leaf.returning{transition:transform .28s cubic-bezier(.15,.5,.3,1)}
.reader .chap{font-family:"Marcellus",serif;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--bronze);margin-bottom:14px}
.reader h1.at{font-family:"Marcellus",serif;font-weight:400;font-size:25px;line-height:1.25;margin-bottom:6px}
.reader .ameta{font-style:italic;color:var(--carbon-soft);font-size:13.5px;margin-bottom:20px}
.reader .body{font-size:16px;max-width:66ch}
.reader .body p{margin-bottom:14px}
.reader .body img{max-width:100%;height:auto;margin:10px 0}
.reader .body h1,.reader .body h2,.reader .body h3{font-family:"Marcellus",serif;font-weight:400;margin:20px 0 10px;font-size:19px}
.reader .body blockquote{font-style:italic;color:var(--carbon-soft);border-left:2px solid var(--bronze);padding-left:14px;margin:14px 0}
.reader .body>p:first-of-type::first-letter{font-family:"Marcellus",serif;font-size:46px;float:left;line-height:.88;padding:4px 8px 0 0;color:var(--imperial)}
.reader .origlink{margin-top:22px;font-size:12.5px}
.reader .origlink a{color:var(--imperial)}
@media(max-width:880px){
  .spread{grid-template-columns:1fr}
  .spread::after{display:none}
  .pg{max-height:none}
  .pg.toc{border-bottom:1px solid var(--line)}
}
@media (prefers-reduced-motion: reduce){*{transition:none!important}}