:root{
  --paper:#f6f0e6;--paper-2:#efe6d7;--card:#fbf8f2;--ink:#2a221d;--ink-2:#62544a;
  --rule:#dccfbb;--accent:#7b3328;--accent-ink:#fffaf3;--gold:#9a7436;
  --shadow:0 1px 2px rgba(60,40,20,.12),0 10px 24px -12px rgba(60,40,20,.35);
  --disp:"Cormorant Garamond","Cormorant",Garamond,"Times New Roman",serif;
  --text:"Newsreader",Georgia,"Times New Roman",serif;
  --wrap:72rem;--gut:clamp(1rem,4vw,2.5rem);
}
@media (prefers-color-scheme:dark){:root{
  --paper:#191512;--paper-2:#211c18;--card:#241e1a;--ink:#ece3d5;--ink-2:#b4a693;
  --rule:#3b332c;--accent:#e2917f;--accent-ink:#1d1512;--gold:#cfa865;
  --shadow:0 1px 2px rgba(0,0,0,.4),0 12px 28px -12px rgba(0,0,0,.7);
}}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--text);
  font-size:1.0625rem;line-height:1.65;font-optical-sizing:auto;
  -webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:var(--accent);text-decoration-thickness:1px;text-underline-offset:.18em}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:2px}
h1,h2,h3{font-family:var(--disp);font-weight:600;line-height:1.08;letter-spacing:-.005em;margin:0}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gut)}
.narrow{max-width:40rem}
.skip{position:absolute;left:-9999px;top:0;z-index:10;background:var(--paper-2);
  color:var(--ink);padding:.5rem 1rem}
.skip:focus{left:0}
.kicker{font-family:var(--text);font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--gold);margin:0 0 .9rem}
.muted{color:var(--ink-2)}

.site-head{border-bottom:1px solid var(--rule)}
.head-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;
  min-height:4.5rem}
.wordmark{font-family:var(--disp);font-weight:600;font-size:1.75rem;letter-spacing:.02em;
  color:var(--ink);text-decoration:none;white-space:nowrap}
.site-head nav,.site-foot nav{display:flex;gap:1.5rem}
.site-head nav a,.site-foot nav a{color:var(--ink-2);text-decoration:none;font-size:.95rem;
  letter-spacing:.04em}
.site-head nav a:hover,.site-foot nav a:hover{color:var(--accent)}

.orn{display:block;width:7.5rem;height:1rem;color:var(--gold);margin:1.75rem auto 0}
.hero{text-align:center;padding:clamp(3.5rem,10vw,7rem) 0 clamp(2.5rem,6vw,4rem)}
.hero h1{font-size:clamp(2.6rem,7vw,4.6rem);font-weight:500;max-width:16ch;margin:0 auto}
.lede{font-size:clamp(1.1rem,2.2vw,1.3rem);color:var(--ink-2);max-width:34rem;
  margin:1.25rem auto 0;line-height:1.55}

.shelf{padding:1rem 0 5rem}
.empty{text-align:center;max-width:34rem;margin:0 auto;padding:clamp(2.5rem,7vw,4rem) 1.5rem;
  border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.book-art{width:9rem;height:auto;color:var(--gold);margin:0 auto 1.75rem;display:block}
.empty h2{font-size:clamp(1.9rem,4.5vw,2.5rem);font-weight:500;font-style:italic}
.empty p{color:var(--ink-2);margin:1rem auto 0;max-width:28rem}

.series{padding-top:2.75rem}
.series+.series{border-top:1px solid var(--rule);margin-top:3rem}
.series-head{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;
  margin-bottom:1.75rem;flex-wrap:wrap}
.series-head h2,.more h2{font-size:clamp(1.8rem,3.6vw,2.4rem);font-weight:500;scroll-margin-top:1rem}
.count{margin:0;color:var(--ink-2);font-size:.9rem;font-style:italic}
.grid{list-style:none;margin:0;padding:0;display:grid;gap:2.25rem 1.5rem;
  grid-template-columns:repeat(auto-fill,minmax(10.5rem,1fr))}
@media (max-width:30rem){.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.75rem 1rem}}
.card a{display:flex;flex-direction:column;gap:.35rem;text-decoration:none;color:inherit}
.card-cover{margin-bottom:.6rem}
.cover{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:2px;box-shadow:var(--shadow);
  background:var(--paper-2);transition:transform .25s ease,box-shadow .25s ease}
.card a:hover .cover{transform:translateY(-3px)}
.cover-blank{display:flex;align-items:center;justify-content:center;padding:1rem;
  text-align:center;font-family:var(--disp);font-size:1.3rem;font-style:italic;
  color:var(--ink-2);border:1px solid var(--rule)}
.card-title{font-family:var(--disp);font-weight:600;font-size:1.3rem;line-height:1.15}
.card a:hover .card-title{color:var(--accent)}
.card-by{color:var(--ink-2);font-size:.92rem}
.badge{align-self:flex-start;display:inline-block;font-size:.72rem;letter-spacing:.14em;
  text-transform:uppercase;padding:.2rem .6rem;border-radius:999px;margin-top:.25rem;
  border:1px solid currentColor;line-height:1.4}
.badge.out{color:var(--accent)}
.badge.soon{color:var(--ink-2)}

.book{padding:1.5rem 0 3.5rem}
.crumbs{display:flex;gap:.5rem;font-size:.9rem;color:var(--ink-2);margin-bottom:2rem}
.crumbs a{color:var(--ink-2);text-decoration:none}
.crumbs a:hover{color:var(--accent)}
.book-grid{display:grid;gap:2.5rem}
@media (min-width:48rem){.book-grid{grid-template-columns:minmax(0,5fr) minmax(0,7fr);
  gap:clamp(2.5rem,6vw,5rem);align-items:start}}
.book-cover{max-width:24rem;width:100%;margin:0 auto}
@media (min-width:48rem){.book-cover{position:sticky;top:2rem}}
.book-text h1{font-size:clamp(2.3rem,5.5vw,3.6rem);font-weight:500;margin-top:.9rem}
.subtitle{font-family:var(--disp);font-style:italic;font-size:clamp(1.25rem,2.6vw,1.6rem);
  color:var(--ink-2);margin:.6rem 0 0;line-height:1.3}
.byline{margin:1rem 0 0;font-size:1.05rem}
.action{margin:1.75rem 0 2rem}
.btn{display:inline-block;background:var(--accent);color:var(--accent-ink);text-decoration:none;
  font-family:var(--text);font-weight:500;letter-spacing:.03em;padding:.8rem 1.6rem;
  border-radius:2px;transition:filter .2s ease}
.btn:hover{filter:brightness(1.08)}
.soon-note{font-style:italic;color:var(--ink-2);margin:0;padding-left:1rem;
  border-left:2px solid var(--gold)}
.blurb p{margin:0 0 1.1rem;max-width:36rem}
.facts{margin:2rem 0 0;padding-top:1.25rem;border-top:1px solid var(--rule);display:grid;
  gap:.5rem;max-width:36rem}
.facts div{display:flex;gap:1rem}
.facts dt{min-width:5.5rem;color:var(--ink-2);font-size:.9rem;letter-spacing:.06em;
  text-transform:uppercase;padding-top:.15rem}
.facts dd{margin:0}
.more{padding:3rem 0 5rem;border-top:1px solid var(--rule)}
.more h2{margin-bottom:1.75rem}

.prose-page{padding:clamp(3.5rem,9vw,6rem) 0 6rem}
.prose-page h1{font-size:clamp(2.4rem,6vw,3.6rem);font-weight:500}
.prose-page .orn{margin:1.5rem 0 2rem}
.prose-page p{font-size:1.12rem}
.prose-page.center{text-align:center;min-height:55vh}
.prose-page.center .orn{margin:1.5rem auto 2rem}

.site-foot{border-top:1px solid var(--rule);padding:2.25rem 0 2.75rem;color:var(--ink-2);
  font-size:.92rem}
.foot-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem 2rem}
.foot-mark{font-family:var(--disp);font-size:1.3rem;font-weight:600;color:var(--ink)}
@media (max-width:30rem){
  .foot-row{flex-direction:column;align-items:flex-start}
  .wordmark{font-size:1.5rem}
  .site-head nav{gap:1.1rem}
}
/* --- Two sections ------------------------------------------------------ */
.site-head nav a[aria-current="page"]{color:var(--ink);text-decoration:underline;
  text-decoration-color:var(--accent);text-underline-offset:.45em}
@media (max-width:40rem){.nav-long{display:none}}
.duo{display:grid;gap:1.5rem}
@media (min-width:52rem){.duo{grid-template-columns:1fr 1fr;gap:2rem}}
.panel{border:1px solid var(--rule);border-radius:3px;padding:clamp(1.5rem,4vw,2.5rem);
  background:var(--card);display:flex;flex-direction:column}
.panel h2{font-size:clamp(2rem,4vw,2.6rem);font-weight:500}
.panel h2 a{color:inherit;text-decoration:none}
.panel h2 a:hover{color:var(--accent)}
.panel-lede{color:var(--ink-2);margin:.6rem 0 1.5rem;max-width:30rem}
.panel .btn{align-self:flex-start;margin-top:auto}
.mini{list-style:none;margin:0 0 1.5rem;padding:0;display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem}
.mini .cover{box-shadow:0 1px 2px rgba(60,40,20,.15)}
.shelf-list{list-style:none;margin:0 0 1.75rem;padding:0;border-top:1px solid var(--rule)}
.shelf-list li{display:flex;justify-content:space-between;gap:1rem;padding:.55rem 0;
  border-bottom:1px solid var(--rule)}
.shelf-list a{color:var(--ink);text-decoration:none}
.shelf-list a:hover{color:var(--accent)}
.shelf-list span{color:var(--ink-2);font-style:italic;font-size:.92rem}
.empty.small{border:0;padding:.5rem 0 1.5rem;margin:0;text-align:left;max-width:none}
.empty.small .book-art{width:5.5rem;margin:0 0 1rem}
.empty.small h3{font-family:var(--disp);font-size:1.55rem;font-weight:500;font-style:italic;margin:0}
.empty.small p{margin:.5rem 0 0}
.more-link{margin-top:auto;font-size:.95rem}
.jump{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem;margin:2rem auto 0;max-width:46rem}
.jump a{font-size:.88rem;text-decoration:none;color:var(--ink-2);border:1px solid var(--rule);
  border-radius:999px;padding:.3rem .85rem;background:var(--card)}
.jump a:hover{color:var(--accent);border-color:var(--accent)}
.section-hero{padding-bottom:1.5rem}
.series-head h2{scroll-margin-top:1rem}

/* Planned title cards: typeset like a plain cloth cover. */
.tcard{aspect-ratio:3/4;width:100%;border-radius:2px;box-shadow:var(--shadow);
  display:flex;flex-direction:column;padding:12% 10% 9%;gap:.45rem;overflow:hidden;
  color:#f8f1e4;background:var(--tc);position:relative;
  container-type:inline-size}
.tcard::before{content:"";position:absolute;inset:5%;border:1px solid rgba(255,248,235,.32);
  border-radius:1px;pointer-events:none}
.tone-0{--tc:#6f2f27}.tone-1{--tc:#24423f}.tone-2{--tc:#7a5a2a}.tone-3{--tc:#2c3553}.tone-4{--tc:#4b4a2a}
.tc-kind{font-size:clamp(.5rem,6.5cqi,.68rem);letter-spacing:.16em;text-transform:uppercase;opacity:.8}
.tc-mid{margin:auto 0;display:flex;flex-direction:column;gap:.5rem}
.tc-title{font-family:var(--disp);font-weight:600;font-size:clamp(.8rem,13.5cqi,1.9rem);
  line-height:1.08;display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
.tc-sub{font-family:var(--disp);font-style:italic;font-size:clamp(.6rem,8.5cqi,1.1rem);line-height:1.2;
  opacity:.88;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.tc-foot{margin-top:auto;font-family:var(--disp);font-size:clamp(.55rem,7cqi,.85rem);
  letter-spacing:.08em;opacity:.75}
.mini .tcard{padding:10% 9%;gap:.2rem}
.mini .tc-kind{display:none}
.mini .tc-title{font-size:clamp(.55rem,15cqi,1.1rem);-webkit-line-clamp:6}
.mini a{text-decoration:none}
.mini .cover-blank{font-size:clamp(.6rem,2.4vw,.95rem);padding:.4rem;line-height:1.15}
.card.planned{display:flex;flex-direction:column;gap:.35rem}
.card-kind{color:var(--ink-2);font-size:.92rem;font-style:italic}
.card-blurb{margin:.1rem 0 .15rem;font-size:.9rem;line-height:1.5;color:var(--ink)}
@media (max-width:30rem){.card-blurb{font-size:.85rem}}

/* Children's: same house, brighter and rounder. */
.kids,.panel.kids{--accent:#a64b0a;--accent-ink:#fffaf3;--gold:#276e5f;--card:#fbeedd;
  --rule:#ecd3b2}
@media (prefers-color-scheme:dark){
  .kids,.panel.kids{--accent:#f2a65a;--accent-ink:#1d1512;--gold:#6cc3b0;--card:#261d15;
    --rule:#46372a}
}
.panel.kids{border-radius:14px}
.kids .cover,.panel.kids .cover,.kids .tcard,.panel.kids .tcard{border-radius:8px}
.kids .tcard::before,.panel.kids .tcard::before{border-radius:5px;border-style:dashed}
.kids .tone-0,.panel.kids .tone-0{--tc:#b5531a}.kids .tone-1,.panel.kids .tone-1{--tc:#1f7a6a}
.kids .tone-2,.panel.kids .tone-2{--tc:#c0861c}.kids .tone-3,.panel.kids .tone-3{--tc:#3d5ea8}
.kids .tone-4,.panel.kids .tone-4{--tc:#8a3f78}
.kids .badge,.panel.kids .badge{border-radius:999px}
.kids .btn,.panel.kids .btn{border-radius:999px}
.kids .section-hero h1{font-style:italic}
.kids .jump a{background:var(--card)}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
