:root{--ink:#1F2429;--soft:#3B4148;--grey:#50565C;--rule:#D3D6D4;--paper:#F7F7F5;--card:#EEEFEC;--accent:#7A2E2A;--sec:#7A2E2A}
@media (prefers-color-scheme:dark){:root{--ink:#ECEBE6;--soft:#C9C7C0;--grey:#A3A39C;--rule:#3A3F44;--paper:#16191C;--card:#202428;--accent:#D88A7E}}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:'Newsreader',Georgia,serif;font-size:19px;line-height:1.62;-webkit-text-size-adjust:100%}
a{color:inherit}img{max-width:100%;display:block}
.wrap{max-width:680px;margin:0 auto;padding:0 22px}
h1,h2,h3,h4{font-family:'Instrument Serif',Georgia,serif;font-weight:400;line-height:1.08;margin:0}
.label,.kind,.dl,.hint,.byline,.credit,.shows,.deck span,.bridge span,.fvq span,.dyk h4,.readnext h4,.topbar{font-family:'Instrument Sans',system-ui,sans-serif}
.label{font-size:.72rem;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--accent);margin:0 0 .5rem}
.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:12px;padding:10px 18px calc(10px);background:color-mix(in srgb,var(--paper) 86%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);font-size:.8rem;border-bottom:1px solid var(--rule)}
.tb-home{font-family:'Instrument Serif',serif;font-size:1.15rem;text-decoration:none}#now{flex:1;color:var(--grey);font-weight:600;letter-spacing:.04em}
.tb-sub{background:var(--ink);color:var(--paper);padding:6px 12px;border-radius:99px;text-decoration:none;font-weight:600}
#bar{position:absolute;left:0;bottom:-1px;height:2px;width:0;background:var(--accent);transition:width .1s linear}
.hero,.home-hero{position:relative;min-height:88vh;display:flex;align-items:flex-end;overflow:hidden;color:#fff}
.hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;animation:drift 22s ease-out forwards}
@keyframes drift{from{transform:scale(1.12)}to{transform:scale(1)}}
.hero-over,.ch-over{position:relative;padding:28px 22px 40px;width:100%;background:linear-gradient(transparent,rgba(10,12,14,.82) 45%)}
.hero h1{font-size:3.2rem;font-size:clamp(2.6rem,9vw,4.6rem);max-width:12ch}.hero .label,.ch-over .label{color:#F2D6CF}
.sub{font-size:1.05rem;max-width:34ch;opacity:.92}.scroll{display:inline-block;margin-top:14px;font-family:'Instrument Sans',sans-serif;font-weight:600;font-size:.85rem;text-decoration:none;border-bottom:1px solid}
.home-hero{min-height:52vh;background:var(--ink);color:var(--paper);padding:0 22px 36px}.home-hero h1{font-size:3.6rem;font-size:clamp(3rem,13vw,6rem)}
.lede{font-size:1.2rem;margin:2.2rem 0 1.4rem;color:var(--soft)}
.toc{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0 0 3rem}
.tc{position:relative;display:block;aspect-ratio:3/4;border-radius:10px;overflow:hidden;text-decoration:none;color:#fff}
.tc img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s}.tc:hover img{transform:scale(1.05)}
.tc span,.tc b{position:relative;display:block;padding:0 12px}.tc span{margin-top:auto;padding-top:60%;font:600 .7rem 'Instrument Sans',sans-serif;letter-spacing:.08em;text-transform:uppercase}
.tc b{font:400 1.15rem/1.15 'Instrument Serif',serif;padding-bottom:12px}.tc::after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 35%,rgba(0,0,0,.75));z-index:0}.tc span,.tc b{z-index:1}
.chapter{border-top:1px solid var(--rule)}.ch-hero{position:relative;min-height:78vh;display:flex;align-items:flex-end;overflow:hidden;color:#fff}
.ch-over h2{font-size:2.8rem;font-size:clamp(2.2rem,8vw,3.8rem);max-width:14ch}.ch-over .argcap{color:#F4F1EA}
.intro{font-size:1.15rem;margin:2rem 0 1rem}.wits{list-style:none;padding:0;margin:0 0 2rem;display:flex;flex-wrap:wrap;gap:8px}
.wits a{display:inline-block;font:600 .8rem 'Instrument Sans',sans-serif;padding:7px 12px;border:1px solid var(--rule);border-radius:99px;text-decoration:none}
.argcap{font-family:'Instrument Serif',serif;font-style:italic;font-size:1.3rem;line-height:1.25;margin:.6rem 0}
figure{margin:2.6rem -22px 1.2rem}figure img{width:100%;cursor:zoom-in}figure .argcap,figure details{padding:0 22px}
details{margin:.4rem 0}summary{cursor:pointer;font:600 .8rem 'Instrument Sans',sans-serif;color:var(--grey);letter-spacing:.04em}
details p{font-size:.95rem;color:var(--soft)}.credit{font-size:.75rem;color:var(--grey)}
.piece{padding-bottom:1.5rem;border-bottom:1px solid var(--rule)}.piece h2{font-size:2.3rem;font-size:clamp(2rem,7vw,2.8rem);margin:.2rem 0 .4rem}
.byline{font-size:.85rem;color:var(--grey);margin:0 0 1.2rem}
.deck{border-left:3px solid var(--sec);padding:.2rem 0 .2rem 1rem;margin:1.2rem 0;font-size:1.1rem}.deck span{display:block;font-size:.7rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--grey)}
.pq{font-family:'Instrument Serif',serif;font-style:italic;font-size:1.7rem;line-height:1.2;margin:2rem 0;padding:0}
.essay p{margin:0 0 1.05em}.orn{text-align:center;color:var(--grey)}
.dyk{background:var(--card);border-radius:10px;padding:16px 18px;margin:1.6rem 0}.dyk h4{font-size:.75rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}.dyk p{margin:.5rem 0 0;font-size:1rem}
.readnext{font-size:.92rem;color:var(--soft)}.readnext h4{font-size:.75rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;margin:1.4rem 0 .4rem}.rn{margin:.4rem 0}.rn-n{color:var(--grey);font-size:.85rem}
.fvq{margin:1.5rem 0;padding:1rem 1.1rem;background:var(--card);border-radius:10px;font-size:1rem}.fvq span{display:block;font-size:.7rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);margin-bottom:.4rem}
.out{display:block;margin-top:.6rem;font-family:'Instrument Sans',sans-serif;font-weight:600;font-size:.85rem}
.fg{margin:3rem 0}.fg h3{font-size:2.2rem}.hint{font-size:.75rem;color:var(--grey);margin:.2rem 0 .8rem}
.cards{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 22px 12px;margin:0 -22px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.card{flex:0 0 82%;scroll-snap-align:center;background:var(--card);border-radius:12px;padding:14px;font-size:.95rem}
.card img{width:100%;height:180px;object-fit:cover;border-radius:8px}.glyph{height:180px;display:grid;place-items:center;font:5rem 'Instrument Serif',serif;color:var(--accent);background:color-mix(in srgb,var(--card) 60%,var(--paper));border-radius:8px}
.card h4{font-size:1.5rem;margin:.2rem 0 .3rem}.kind{font-size:.7rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--grey);margin:.8rem 0 0}.bio{color:var(--soft);font-size:.88rem}.shows{font-size:.8rem;font-weight:600;color:var(--accent)}
.land h3,.debates h3,.numbers h3,.open h3{font-size:2.3rem;font-size:clamp(2rem,7vw,2.8rem);margin:3rem 0 1rem}
.takes{list-style:none;padding:0}.takes li{padding:.7rem 0;border-top:1px solid var(--rule)}.takes i{display:block;font-family:'Instrument Serif',serif;font-size:1.15rem}
.bridge{margin:2rem 0 3rem;padding:1.4rem 0 0;border-top:2px solid var(--ink)}.bridge span{font-size:.7rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--grey)}
.bridge p{font-family:'Instrument Serif',serif;font-style:italic;font-size:1.6rem;line-height:1.25;margin:.4rem 0 1rem}
.next{display:inline-block;background:var(--sec);color:#fff;padding:12px 20px;border-radius:99px;text-decoration:none;font:600 .9rem 'Instrument Sans',sans-serif}
.debate{background:var(--card);border-radius:12px;padding:18px;margin:1rem 0}.debate h4{font-size:1.45rem}.dl{font-size:.7rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--grey);margin:1rem 0 .2rem}.debate p{margin:.2rem 0;font-size:1rem}.now{font-family:'Instrument Serif',serif;font-style:italic;font-size:1.2rem!important}
.nb{padding:1.2rem 0;border-top:1px solid var(--rule)}.big{font-family:'Instrument Serif',serif;font-size:clamp(3rem,13vw,4.6rem);line-height:1;color:var(--accent);margin:0}.nb p{margin:.3rem 0 0}
.op{padding:1rem 0;border-top:1px solid var(--rule)}.op h4{font-size:1.4rem}.op p{font-style:italic;color:var(--soft)}
.subscribe{margin:3rem 0;padding:24px;border-radius:14px;background:var(--ink);color:var(--paper);text-align:center}.subscribe h3{font-size:2rem}.subscribe p{opacity:.85}
.btn{display:inline-block;margin-top:.6rem;background:var(--accent);color:#fff;padding:13px 22px;border-radius:99px;text-decoration:none;font:600 .95rem 'Instrument Sans',sans-serif}
.sources{font-size:.85rem}.sources li{margin:.4rem 0}.sources h4{font-size:1.2rem;margin:1rem 0 .3rem}
.colophon{font-size:.85rem;color:var(--grey);padding:2rem 0 4rem;border-top:1px solid var(--rule)}
.edition{display:block;margin:2.4rem 0;border-radius:14px;overflow:hidden;background:var(--card);text-decoration:none}.edition img{width:100%;height:240px;object-fit:cover}.edition div{padding:18px}.edition h2{font-size:2rem}.edition ul{padding-left:1.1rem;color:var(--soft)}.go{font:600 .9rem 'Instrument Sans',sans-serif;color:var(--accent)}.soon{color:var(--grey);text-align:center}
#lb{border:0;padding:0;background:transparent;max-width:100vw;max-height:100vh}#lb::backdrop{background:rgba(0,0,0,.92)}#lb img{max-width:96vw;max-height:92vh;object-fit:contain}
.js .reveal{opacity:0;transform:translateY(26px);transition:opacity .8s ease,transform .8s ease}.js .reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.hero-img{animation:none}.js .reveal{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}}
@media (min-width:900px){.card{flex-basis:46%}figure{margin-left:0;margin-right:0}figure .argcap,figure details{padding:0}}
/* ---------- device pass: iPhone, iPad, desktop ---------- */
html{-webkit-tap-highlight-color:transparent}
body{overflow-x:hidden;overflow-x:clip}
img{height:auto}
.hero-img,.tc img,.card img,.edition img{height:100%}
.card img{height:180px}.edition img{height:240px}
.topbar{background:rgba(247,247,245,.92);padding-top:max(10px,env(safe-area-inset-top));padding-left:max(18px,env(safe-area-inset-left));padding-right:max(18px,env(safe-area-inset-right))}
@supports (background:color-mix(in srgb,red 50%,blue)){.topbar{background:color-mix(in srgb,var(--paper) 86%,transparent)}}
@media (prefers-color-scheme:dark){.topbar{background:rgba(22,25,28,.92)}}
#now{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tb-home,.tb-sub{flex:none}
.hero{min-height:88vh;min-height:88svh}.ch-hero{min-height:78vh;min-height:78svh}
.hero-over,.ch-over{padding-left:max(22px,env(safe-area-inset-left),calc((100% - 680px)/2 + 22px));padding-right:max(22px,env(safe-area-inset-right))}
.hero-over>*,.ch-over>*{max-width:640px}
.colophon{padding-bottom:max(4rem,calc(2rem + env(safe-area-inset-bottom)))}
a:focus-visible,summary:focus-visible,.btn:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}
.cards{scroll-padding:0 22px}
@media (max-width:380px){body{font-size:18px}.tb-home{font-size:1rem}.tb-sub{padding:5px 10px}}
@media (min-width:600px) and (max-width:899px){.card{flex-basis:58%}figure{margin-left:0;margin-right:0}figure .argcap,figure details{padding:0}.toc{grid-template-columns:repeat(4,1fr)}.tc{aspect-ratio:2/3}}
@media (min-width:900px){body{font-size:20px}.toc{grid-template-columns:repeat(4,1fr)}.tc{aspect-ratio:2/3}.card{flex-basis:44%}.cards{margin:0;padding:0 0 12px}
 .hero h1{font-size:4.8rem}.ch-over h2{font-size:4rem}.ch-hero{min-height:82vh}}
@media (hover:hover){.tc:hover img{transform:scale(1.05)}.btn:hover,.next:hover,.tb-sub:hover{filter:brightness(1.08)}}
@media (hover:none){.tc:hover img{transform:none}}
.home-hero{flex-direction:column;justify-content:flex-end;align-items:flex-start}
.home-hero>*{max-width:640px}
