@font-face{font-family:Stamp;src:url(stamp.560297e4bc.ttf) format("truetype");font-weight:700;font-display:swap}
@font-face{font-family:Prose;src:url(prose.382475f382.woff2) format("woff2");font-weight:200 900;font-display:swap}
@font-face{font-family:Mono;src:url(mono.48715a42ec.ttf) format("truetype");font-display:swap}
:root{--field:#1f3a34;--field2:#2b4f47;--card:#efe0b6;--card2:#e6d39d;--ink:#17201d;--mute:#4f4a35;--rule:#b39f66;--red:#b3201a;--blue:#1c3f7a;--chalk:#f6f1df;
 --stamp:Stamp,"Arial Narrow",Impact,sans-serif;--prose:Prose,Georgia,serif;--mono:Mono,ui-monospace,Menlo,monospace}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:64px}
body{margin:0;background:var(--field);color:var(--ink);font:400 1.09rem/1.62 var(--prose);padding-bottom:96px}
a{color:var(--blue)}
:focus-visible{outline:3px solid var(--red);outline-offset:2px}
.skip{position:absolute;left:-999px;top:8px;background:var(--chalk);padding:8px 12px;z-index:90}.skip:focus{left:8px}

.clock{position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:10px;background:#12231f;color:var(--chalk);padding:7px 12px;font:600 .82rem var(--mono)}
.clock-age{white-space:nowrap;min-width:5.6em}.clock-age b{color:#ffcf5c;font-size:1.05rem}
.clock-rail{position:relative;flex:1;height:6px;background:#39554e;border-radius:3px;overflow:hidden}
.clock-rail i{position:absolute;inset:0;background:#ffcf5c;transform-origin:left;transform:scaleX(0)}
.clock-rail u{position:absolute;left:50%;top:-2px;bottom:-2px;width:2px;background:var(--red)}
.clock-btn{font:700 .86rem var(--stamp);letter-spacing:.06em;text-transform:uppercase;background:var(--chalk);color:var(--ink);border:0;border-radius:4px;padding:7px 12px;min-height:34px;cursor:pointer}

.hero{max-width:760px;margin:0 auto;padding:14px 14px 8px;color:var(--chalk)}
.hero-art{position:relative;margin:0}
.hero-art img{display:block;width:100%;height:auto;border-radius:6px;box-shadow:0 8px 24px rgba(0,0,0,.4)}
.badge{position:absolute;right:10px;top:10px;background:var(--red);color:#fff;font:700 .85rem var(--stamp);letter-spacing:.06em;text-transform:uppercase;padding:5px 9px;border-radius:3px}
.listen{margin:12px 0 4px;min-height:74px}
.listen-btn{display:flex;gap:14px;align-items:center;width:100%;text-align:left;background:#ffcf5c;color:var(--ink);border:0;border-radius:6px;padding:12px 14px;cursor:pointer;font-family:var(--stamp);box-shadow:0 3px 0 #a9832a}
.listen-btn .ico{display:grid;place-items:center;flex:none;width:46px;height:46px;border-radius:50%;background:var(--ink);color:#ffcf5c;font-size:1.1rem}
.listen-btn b{display:block;font-size:1.3rem;line-height:1.1;letter-spacing:.02em}
.listen-btn small{display:block;font:500 .86rem var(--mono);margin-top:3px}
.kicker{font:600 .82rem var(--mono);letter-spacing:.08em;text-transform:uppercase;margin:18px 0 2px;color:#ffcf5c}
h1{font:700 clamp(2.7rem,14vw,5rem)/.95 var(--stamp);letter-spacing:.01em;text-transform:uppercase;margin:0}
.sub{font-size:1.15rem;margin:8px 0 14px}
.cast h2{font:700 1.05rem var(--stamp);letter-spacing:.06em;text-transform:uppercase;margin:0 0 6px;color:#ffcf5c}
.cast ul{list-style:none;margin:0;padding:0;font-size:1rem}
.cast li{padding:5px 0 5px 12px;border-left:4px solid}
.cast .v-l{border-color:#ffcf5c}.cast .v-e{border-color:var(--chalk)}.cast .v-r{border-color:#7fb6a6}.cast .v-m{border-color:#e4685f}
.contents{margin:14px 0 6px;background:var(--field2);border-radius:6px;padding:10px 12px}
.contents summary{cursor:pointer;font:700 1.02rem var(--stamp);letter-spacing:.04em;text-transform:uppercase}
.contents ol{margin:8px 0 0;padding-left:1.6em}.contents a{color:var(--chalk)}

main{max-width:760px;margin:0 auto;padding:0 10px}
.row{position:relative;background:var(--card);background-image:repeating-linear-gradient(transparent 0 31px,rgba(179,159,102,.28) 31px 32px);margin:18px 0;border-radius:6px;box-shadow:0 5px 14px rgba(0,0,0,.35);padding:0 0 18px;overflow:hidden}
.row-h{display:flex;gap:12px;align-items:center;background:var(--card2);border-bottom:2px solid var(--ink);padding:10px 14px}
.age{font:700 1.45rem var(--mono);color:var(--red);border:2px solid var(--red);border-radius:4px;padding:0 7px;transform:rotate(-3deg);flex:none}
.row h2{font:700 clamp(1.45rem,6vw,2.05rem)/1.05 var(--stamp);text-transform:uppercase;letter-spacing:.01em;margin:0}
.row-b{padding:12px 16px 0}
.row-b p{margin:0 0 .8em}
.row-b p.beat{font-weight:600}
.pull{font:700 clamp(1.5rem,7vw,2.15rem)/1.12 var(--stamp);text-transform:uppercase;color:var(--red);margin:1em 0!important}
.stamps{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin:0 0 1em;padding:0}
.stamps li{font:600 .92rem var(--mono);background:var(--chalk);border:1.5px solid var(--ink);border-radius:3px;padding:3px 8px}
.rows{margin:0 0 1em;padding-left:1.3em}.rows li{margin:.35em 0}
.kin{display:block;background:var(--field);color:var(--chalk);text-decoration:none;border-radius:5px;padding:10px 12px;margin:.4em 0 1em}
.kin b{display:block;font:700 1.15rem var(--stamp);letter-spacing:.03em;text-transform:uppercase;color:#ffcf5c}
.kin span{font-size:.98rem}

.tool{background:var(--chalk);border:2px solid var(--ink);border-radius:6px;padding:12px;margin:1em 0}
.tool h3{font:700 1.25rem/1.1 var(--stamp);text-transform:uppercase;letter-spacing:.02em;margin:0 0 6px}
.tool-note{font-size:.95rem;color:var(--mute);margin:.5em 0!important}
.tool label{display:flex;justify-content:space-between;font:600 .92rem var(--mono);margin-top:10px}
.tool output{color:var(--red);font-size:1.1rem}
input[type=range]{width:100%;height:32px;accent-color:var(--red);margin:0}
.ruler{position:relative;height:66px;margin:14px 10px 4px;border-top:2px solid var(--ink)}
.ruler i{position:absolute;top:0;width:1px;height:10px;background:var(--ink)}.ruler i.mj{height:18px;width:2px}
.ruler em{position:absolute;top:20px;transform:translateX(-50%);font:500 .74rem var(--mono);font-style:normal}
.ruler .mid{position:absolute;top:38px;transform:translateX(-50%);background:var(--red);color:#fff;font:700 .95rem var(--mono);padding:0 6px;border-radius:3px}
.ruler s{position:absolute;top:-7px;width:0;height:0;margin-left:-6px;border:6px solid transparent;border-top-color:var(--blue);text-decoration:none}
.readout{display:flex;align-items:baseline;gap:10px;margin:.3em 0!important;font-weight:600}
.readout .big{font:700 3rem/1 var(--stamp);color:var(--red)}
.readout-2{font-weight:600;margin:.3em 0!important}
.punch{display:grid;grid-template-columns:repeat(10,1fr);gap:4px;margin:10px 0}
.punch button{min-height:38px;padding:0;font:500 .8rem var(--mono);background:var(--card);color:var(--ink);border:1px solid var(--rule);border-radius:50%/40%;cursor:pointer}
.punch button[aria-pressed=true]{background:var(--ink);color:var(--chalk);border-color:var(--ink)}
.bar-l{display:flex;justify-content:space-between;font:600 .85rem var(--mono);margin:8px 0 3px!important}
.bar{height:14px;background:var(--card2);border-radius:3px;overflow:hidden}.bar i{display:block;height:100%;background:var(--ink);transition:width .25s}
#barMem{background:var(--red)}
.linkish{background:none;border:0;padding:6px 0;color:var(--blue);font:inherit;text-decoration:underline;cursor:pointer}

.two{display:grid;grid-template-columns:1fr;gap:8px;margin:1em 0}
.col{border:2px solid var(--ink);border-radius:5px;padding:10px 12px}
.col h3{font:700 1.2rem/1.05 var(--stamp);text-transform:uppercase;margin:0 0 6px}
.col ul{margin:0;padding-left:1.1em}
.exec{background:var(--card2)}.dir{background:var(--ink);color:var(--chalk)}
.loop{list-style:none;counter-reset:l;margin:1em 0;padding:0;display:grid;gap:6px}
.loop li{background:var(--chalk);border:2px solid var(--ink);border-radius:5px;padding:9px 12px}
.loop li::after{content:"↓";display:block;text-align:center;font-weight:700;color:var(--red)}
.loop li:last-child::after{content:"↺ back to prediction";font:600 .85rem var(--mono)}
.loop b{display:block;font:700 1.15rem var(--stamp);text-transform:uppercase}
.mech table{width:100%;border-collapse:collapse;background:var(--chalk);font-size:.98rem}
.mech thead{position:absolute;left:-999px}
.mech tr{display:block;border:2px solid var(--ink);border-radius:5px;padding:8px 10px;margin-bottom:6px;background:var(--chalk)}
.mech th,.mech td{display:block;text-align:left;padding:0}
.mech tbody th{font:700 1.08rem var(--stamp);text-transform:uppercase}
.st{display:inline-block;margin-top:5px;font:600 .8rem var(--mono);color:#fff;padding:1px 7px;border-radius:3px}
.st.m{background:#1c6b4a}.st.p{background:var(--blue)}.st.o{background:var(--red)}
.refs{padding-left:1.1em;font-size:.98rem}.refs li{margin:.45em 0}
.fine{font-size:.95rem}
@media(min-width:640px){.two{grid-template-columns:1fr 1fr}.punch button{min-height:42px}}

.sheet{border:0;border-radius:8px;padding:0;width:min(520px,94vw);max-height:90vh;background:var(--chalk);color:var(--ink)}
.sheet::backdrop{background:rgba(0,0,0,.6)}
.sheet-in{padding:12px}.sheet-bar{display:flex;justify-content:space-between;align-items:center}
.sheet-bar h2{font:700 1.3rem var(--stamp);text-transform:uppercase;margin:0}
.sheet-x{background:none;border:0;font-size:1.2rem;min-width:40px;min-height:40px;cursor:pointer}
.sh-card{width:100%;height:auto;border-radius:4px}.sh-post{margin:.6em 0;font-size:1rem}
.sh-acts{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.btn{display:flex;align-items:center;justify-content:center;gap:6px;min-height:42px;background:var(--ink);color:var(--chalk);border:0;border-radius:5px;font:700 .95rem var(--stamp);text-decoration:none;letter-spacing:.03em;cursor:pointer}
.btn svg{width:15px;height:15px}.btn.ghost{background:var(--card);color:var(--ink)}.btn.wide{grid-column:1/-1}
.sh-masto{display:none;grid-column:1/-1;gap:6px}.sh-masto.on{display:flex}.sh-masto input{flex:1;min-height:40px;padding:0 8px;font:inherit}
.sh-small{font-size:.86rem;color:var(--mute)}

body .narr{z-index:45}
body.at-listen .narr[data-state=collapsed]{display:none}
.now{background:rgba(255,207,92,.6);box-shadow:0 0 0 4px rgba(255,207,92,.6);border-radius:2px}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
