:root{--wall:#ecebe8;--wall-lit:#f7f6f3;--stone:#f4f3ef;--stone-side:#e2e0db;--ink:#1d1d1b;--soft:#6b6a66;--line:#d3d1cb;--label:#f9f8f5;--btn:#202020}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--wall);color:var(--ink);font:19px/1.6 Newsreader,Georgia,serif}body:has(#player:not([hidden])){padding-bottom:88px}
a{color:inherit;text-decoration-color:var(--line);text-underline-offset:.18em}a:hover{text-decoration-color:var(--ink)}
h1,h2,h3{font-weight:400;line-height:1.1;margin:0}
:focus-visible{outline:2px solid var(--ink);outline-offset:4px}
img{display:block;max-width:100%}
button{font:inherit;color:inherit;cursor:pointer;background:none;border:0;padding:0}
.sans,.top nav,.kicker,.by,.len,.tag small,.tag span,.switch,.themes,.door+small,#player{font-family:"Instrument Sans",system-ui,sans-serif}

.top{position:sticky;top:0;z-index:4;height:68px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(18px,4vw,64px);gap:20px;background:color-mix(in srgb,var(--wall-lit) 92%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.mark{font-size:clamp(21px,2vw,25px);text-decoration:none;white-space:nowrap}
.top nav{display:flex;align-items:center;gap:clamp(14px,2.4vw,34px);font-size:15px}.top nav a{text-decoration:none}
.follow{background:var(--btn);color:#fff;border-radius:99px;padding:6px 16px}.follow:hover{background:#000}
#episodes,#about{scroll-margin-top:90px}

/* the room: a soft spotlight on the wall behind the masthead and the newest piece */
.mast,.roomhead,.themes{position:relative;z-index:2}
.mast{text-align:center;padding:clamp(40px,6vw,74px) 18px 0;background:radial-gradient(60% 120% at 50% 0,var(--wall-lit),transparent 70%)}
.mast h1{font-size:clamp(44px,6.4vw,84px);letter-spacing:-.01em;font-weight:400}
.by{font-size:13px;letter-spacing:.24em;text-transform:uppercase;margin:12px 0 0;color:var(--ink)}
.by::after{content:"";display:block;width:44px;height:1px;background:var(--ink);opacity:.5;margin:20px auto 0}
.line{font-style:italic;font-size:clamp(19px,1.7vw,23px);margin:18px auto 0;max-width:36em}

.plinth{display:flex;flex-direction:column;align-items:center;text-decoration:none;color:inherit;position:relative}
.plinth .obj{position:relative;z-index:1;display:flex;align-items:flex-end;justify-content:center;width:100%;height:var(--oh,150px);margin-bottom:-6px}
.plinth .obj img{max-height:100%;max-width:min(78%,var(--ow,230px));width:auto;height:auto;filter:drop-shadow(0 10px 8px rgba(40,36,30,.28));transition:transform .4s ease}
.plinth .obj::before{content:"";position:absolute;z-index:-1;left:50%;bottom:-20px;width:115%;aspect-ratio:1.1;transform:translateX(-50%);background:radial-gradient(closest-side,rgba(255,250,236,.95),rgba(255,250,236,0));pointer-events:none}
.plinth .block{width:100%;background:linear-gradient(var(--stone),#efede8);border-top:10px solid #fbfaf7;box-shadow:inset 0 1px 0 #fff,0 22px 34px -18px rgba(40,36,30,.22);padding:clamp(18px,2.4vw,30px) clamp(14px,2vw,24px) clamp(26px,4vw,52px);display:flex;justify-content:center}
.tag{background:var(--label);border:1px solid #d8d6d0;box-shadow:0 1px 2px rgba(0,0,0,.12);padding:12px 18px 11px;width:min(100%,250px);text-align:left;position:relative}
.tag::before,.tag::after{content:"";position:absolute;top:5px;width:3px;height:3px;border-radius:50%;background:#a9a6a0}
.tag::before{left:5px}.tag::after{right:5px}
.tag small{display:block;font-size:11px;letter-spacing:.04em;color:var(--soft)}
.tag b{display:block;font-weight:400;font-size:17px;line-height:1.2;margin:4px 0 8px;padding-bottom:7px;border-bottom:1px solid var(--line)}
.tag span{font-size:12px;color:var(--soft)}.tag i{font-style:normal;margin:0 6px;opacity:.6}
.tag.big{width:min(100%,290px)}.tag.big b{font-size:21px}
a.plinth:hover .obj img,a.plinth:focus-visible .obj img{transform:translateY(-4px)}
a.plinth:focus-visible{outline-offset:8px}
@media(prefers-reduced-motion:reduce){.plinth .obj img{transition:none}a.plinth:hover .obj img{transform:none}}

.feature{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:clamp(24px,5vw,80px);max-width:1180px;margin:0 auto;padding:clamp(28px,4vw,48px) clamp(18px,4vw,64px) clamp(40px,6vw,80px)}
.feature .plinth{--oh:clamp(200px,22vw,290px);--ow:380px;max-width:420px;justify-self:end;width:100%}
.feature .info{align-self:center;padding-bottom:clamp(40px,8vw,120px)}
.kicker{font-size:13px;letter-spacing:.16em;text-transform:uppercase;margin:0 0 12px}
.feature h1,.feature h2{font-size:clamp(34px,3.6vw,50px);line-height:1.05}.feature h2 a{text-decoration:none}
.sub{font-style:italic;font-size:21px;margin:8px 0 0}
.len{font-size:15px;color:var(--soft);margin:12px 0 0}
.feature .sum{margin:16px 0 0;max-width:26em;line-height:1.45}
.play{display:inline-flex;align-items:center;gap:12px;margin-top:24px;padding:12px 26px 12px 22px;border-radius:99px;background:var(--btn);color:#fff;font:500 16px/1.2 "Instrument Sans",system-ui,sans-serif;box-shadow:0 6px 16px -6px rgba(0,0,0,.45)}
.play:hover{background:#000}.play i{width:0;height:0;border-left:12px solid currentColor;border-top:7px solid transparent;border-bottom:7px solid transparent}
.play[aria-pressed=true] i{width:11px;height:14px;border:0;border-left:4px solid currentColor;border-right:4px solid currentColor}

.room{max-width:1240px;margin:0 auto;padding:0 clamp(18px,4vw,64px) clamp(50px,7vw,90px)}
.roomhead{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:12px 28px;padding:30px 0 34px;border-top:1px solid var(--line)}
.roomhead h2{font-size:clamp(28px,2.8vw,38px)}
.switch,.themes{display:flex;flex-wrap:wrap;gap:6px 20px;font-size:15px}
.switch button,.themes button{color:var(--soft);padding:2px 0;border-bottom:1px solid transparent}.switch button[aria-pressed=true],.themes button[aria-pressed=true]{color:var(--ink);border-color:var(--ink)}
.themes{margin:-14px 0 34px}
.wall{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(var(--cols,3),minmax(0,1fr));gap:clamp(44px,5vw,70px) clamp(24px,4vw,64px);align-items:end}
.room.few .wall{--cols:3}.room.few .plinth{--oh:clamp(130px,13vw,170px);--ow:230px}
.room.some .wall{--cols:4}.room.some .plinth{--oh:120px;--ow:180px}
.room.many .wall{--cols:6;row-gap:44px;column-gap:22px}.room.many .plinth{--oh:86px;--ow:120px}.room.many .tag{padding:9px 11px 8px}.room.many .tag b{font-size:15px}.room.many .plinth .block{padding:12px 8px 22px}
.list{display:none;list-style:none;margin:0;padding:0}
.hang.aslist .wall{display:none}.hang.aslist .list{display:block}
.list li{display:grid;grid-template-columns:3em minmax(0,1fr) auto 5em;gap:6px 14px;padding:13px 0;border-top:1px solid var(--line);align-items:baseline}
.list a{text-decoration:none;font-size:21px;line-height:1.2}.list span{color:var(--soft);font-size:15px;font-family:"Instrument Sans",system-ui,sans-serif}
[hidden]{display:none!important}

.welcome{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(30px,6vw,96px);padding:clamp(56px,8vw,110px) clamp(18px,5vw,72px);align-items:end;background:var(--wall-lit);border-top:1px solid var(--line)}
.welcome h2{font-size:clamp(32px,4.2vw,58px);line-height:1.08;max-width:17em}
.welcome p{margin:0 0 20px;max-width:32em}
.door{display:inline-block;padding:11px 24px;border:1px solid var(--ink);border-radius:99px;font:500 16px/1.2 "Instrument Sans",system-ui,sans-serif;text-decoration:none}.door:hover{background:var(--ink);color:#fff}
.door+small{display:block;margin-top:10px;font-size:14px;color:var(--soft)}

.ep .feature{padding-top:clamp(40px,6vw,80px)}
.read{max-width:38em;margin:0 auto;padding:0 clamp(18px,4vw,0px)}
.read section{margin:0 0 54px}.read h2{font-size:30px;margin:0 0 14px}
.read ul{padding-left:1.1em;margin:14px 0}.read li{margin:0 0 6px}
.chap{list-style:none;padding:0}.chap li{margin:0;border-top:1px solid var(--line)}.chap button{display:flex;gap:16px;width:100%;text-align:left;padding:9px 0}.chap button:hover{color:#000;text-decoration:underline}.chap span{color:var(--soft);min-width:3.2em;font-size:16px;padding-top:2px}
details summary{cursor:pointer;font-size:30px;line-height:1.1}
.transcript{margin-top:18px}.transcript p{margin:0 0 1em}.draft{color:var(--soft);font-size:16px}
.next{display:grid;justify-items:center;text-align:center;padding:10px 18px 80px;margin:0 auto;text-decoration:none;max-width:420px}
.next img{height:110px;width:auto;filter:drop-shadow(0 8px 6px rgba(40,36,30,.25));margin-bottom:6px}
.next span{display:block;margin-top:10px;color:var(--soft);font-size:14px;font-family:"Instrument Sans",system-ui,sans-serif}.next strong{font-weight:400;font-size:26px;line-height:1.15}

footer{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:30px clamp(30px,6vw,96px);padding:clamp(50px,7vw,90px) clamp(18px,5vw,72px);background:#1f1f1d;color:#efeee9}
footer h2{font-size:clamp(28px,2.8vw,38px);margin:0 0 10px}footer p{margin:0 0 14px;max-width:34em}footer ul{list-style:none;margin:0;padding:0}footer li{margin:0 0 5px}
footer .door{border-color:#efeee9}footer .door:hover{background:#efeee9;color:#1f1f1d}footer a{text-decoration-color:#6b6a66}

#player{position:fixed;left:0;right:0;bottom:0;z-index:5;background:var(--label);color:var(--ink);display:grid;grid-template-columns:auto auto minmax(0,1.1fr) minmax(0,2fr) auto auto;gap:14px;align-items:center;padding:10px clamp(12px,2vw,24px);border-top:1px solid var(--line);box-shadow:0 -8px 24px rgba(0,0,0,.08);font-size:15px}
#player[hidden]{display:none}#player img{width:52px;height:52px;object-fit:contain}
#player .t{line-height:1.2;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font:17px Newsreader,Georgia,serif}#player .t a{text-decoration:none}
#player .btns{display:flex;gap:10px;align-items:center}#pp{width:42px;height:42px;border-radius:50%;background:var(--btn);color:#fff;display:grid;place-items:center}
#pp i{width:0;height:0;border-left:13px solid currentColor;border-top:8px solid transparent;border-bottom:8px solid transparent;margin-left:3px}#pp.on i{width:12px;height:15px;border:0;border-left:4px solid currentColor;border-right:4px solid currentColor;margin:0}
.scrub{display:flex;gap:10px;align-items:center}.scrub input{flex:1;min-width:0;accent-color:var(--btn)}.scrub span{font-variant-numeric:tabular-nums;white-space:nowrap}
.speed{min-width:3em;border:1px solid var(--line);border-radius:99px;padding:3px 8px}

@media(max-width:860px){
 body{font-size:18px}.top nav a.opt{display:none}.top{gap:10px;height:60px}.mark{font-size:20px}
 .feature{grid-template-columns:1fr;gap:28px}.feature .plinth{justify-self:center;max-width:340px}.feature .info{padding-bottom:0;text-align:center}.feature .sum{margin-inline:auto}
 .room.few .wall,.room.some .wall{--cols:2}.room.many .wall{--cols:3}
 .welcome,footer{grid-template-columns:1fr}
 .list li{grid-template-columns:2.2em minmax(0,1fr) auto}.list .row-len{display:none}
 #player{grid-template-columns:auto auto minmax(0,1fr);row-gap:6px}#player img,.speed,#close{display:none}.scrub{grid-column:1/-1;order:9}
}
@media(max-width:520px){.room.few .wall,.room.some .wall{--cols:1}.room.few .plinth{max-width:300px;margin:auto}.room.many .wall{--cols:2}}
.tag span{white-space:nowrap}.room.many .tag span{font-size:11px}.room.many .tag i{margin:0 3px}.room.many .tag small{font-size:10px}
/* deeper shelf: a visible top face the object stands on */
.plinth{--depth:clamp(24px,3.2vw,40px)}
.plinth .obj{margin-bottom:calc(var(--depth) * -.55)}
.plinth .block{position:relative;border-top:0;margin-top:var(--depth)}
.plinth .block::before{content:"";position:absolute;left:0;right:0;bottom:100%;height:var(--depth);background:linear-gradient(#e6e4de,#f3f2ee 55%,#fbfaf7);clip-path:polygon(5% 0,95% 0,100% 100%,0 100%);box-shadow:inset 0 -1px 0 #fff}
.feature .plinth{--depth:clamp(30px,4vw,48px)}
.room.many .plinth{--depth:18px}
.plinth{--depth:clamp(32px,4vw,48px)}
.feature .plinth{--depth:clamp(40px,5vw,60px)}
.plinth .block::before{background:linear-gradient(#d9d6cf,#ebe9e4 45%,#f8f7f3);clip-path:polygon(7% 0,93% 0,100% 100%,0 100%);box-shadow:none}
.plinth .block{box-shadow:inset 0 2px 0 #fff,inset 0 3px 0 rgba(40,36,30,.06),0 22px 34px -18px rgba(40,36,30,.22)}
/* episode page: the object alone, no shelf or label (title and date are already beside it) */
.piece{position:relative;display:flex;align-items:flex-end;justify-content:center;height:clamp(220px,26vw,340px);max-width:420px;width:100%;justify-self:end}
.piece::before{content:"";position:absolute;z-index:0;left:50%;bottom:-30px;width:120%;aspect-ratio:1.1;transform:translateX(-50%);background:radial-gradient(closest-side,rgba(255,250,236,.95),rgba(255,250,236,0));pointer-events:none}
.piece::after{content:"";position:absolute;z-index:0;left:50%;bottom:-6px;width:62%;height:16px;transform:translateX(-50%);background:radial-gradient(closest-side,rgba(40,36,30,.22),rgba(40,36,30,0))}
.piece img{position:relative;z-index:1;max-height:100%;max-width:min(86%,380px);width:auto;height:auto;filter:drop-shadow(0 10px 8px rgba(40,36,30,.25))}
@media(max-width:860px){.piece{justify-self:center;max-width:340px;height:220px}}
/* hover: the object stays on the shelf; the spotlight brightens and the label lifts slightly */
a.plinth:hover .obj img,a.plinth:focus-visible .obj img{transform:none}
.plinth .obj::before{transition:opacity .35s ease;opacity:.85}
a.plinth:hover .obj::before,a.plinth:focus-visible .obj::before{opacity:1;filter:brightness(1.04)}
.plinth .tag{transition:transform .3s ease,box-shadow .3s ease}
a.plinth:hover .tag,a.plinth:focus-visible .tag{transform:translateY(-2px);box-shadow:0 8px 18px -8px rgba(40,36,30,.3)}
a.plinth:hover .tag b,a.plinth:focus-visible .tag b{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
@media(prefers-reduced-motion:reduce){a.plinth:hover .tag{transform:none}}
/* display face: Modern Antique 1889 (Font Revival, MIT) for the wordmark and headings; Newsreader stays for reading text and labels */
@font-face{font-family:"Modern Antique";src:url(assets/fonts/ModernAntique1889-Regular.woff2) format("woff2");font-display:swap}
.mark,.mast h1,.feature h1,.feature h2,.roomhead h2,.welcome h2,footer h2,.read h2,.next strong{font-family:"Modern Antique",Newsreader,Georgia,serif;font-weight:400;letter-spacing:.01em}