:root{--paper: rgba(240, 238, 232, .92);--paper-dim: rgba(240, 238, 232, .45);--gold: rgba(255, 196, 120, .95);--cyan: rgba(140, 220, 240, .9);--display: "Didot", "Bodoni MT", "Playfair Display", "Georgia", serif;--body: "Optima", "Avenir Next", "Segoe UI", system-ui, sans-serif;font-family:var(--body)}*{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;height:100%;overflow:hidden;background:#000;color:var(--paper);overscroll-behavior:none}#view{position:fixed;inset:0;width:100%;height:100%;display:block}#hud{position:fixed;inset:0;pointer-events:none;user-select:none}.chapter{position:absolute;left:5vw;bottom:9vh;max-width:44ch;opacity:0;transition:opacity 1.4s ease;text-shadow:0 0 3px rgba(0,0,0,.85),0 1px 6px rgba(0,0,0,.8),0 2px 18px rgba(0,0,0,.9)}.chapter.visible{opacity:1}.chapter .numeral{font-family:var(--display);font-size:.72rem;letter-spacing:.5em;color:var(--gold);margin-bottom:.55rem}.chapter .name{font-family:var(--display);font-size:clamp(1.15rem,2.3vw,1.75rem);font-weight:400;font-style:italic;letter-spacing:.14em}.chapter .line{margin-top:.7rem;font-size:.78rem;font-weight:400;line-height:1.7;letter-spacing:.06em;color:var(--paper-dim)}.clocks{position:absolute;top:6vh;right:5vw;text-align:right;font-variant-numeric:tabular-nums;opacity:0;transition:opacity 1.4s ease;text-shadow:0 0 3px rgba(0,0,0,.85),0 1px 5px rgba(0,0,0,.8),0 1px 12px rgba(0,0,0,.95)}.clocks.visible{opacity:1}.clocks .row{display:flex;justify-content:flex-end;align-items:baseline;gap:.9em;margin-bottom:.45rem}.clocks .label{font-size:.58rem;letter-spacing:.38em;text-transform:uppercase;color:var(--paper-dim)}.clocks .value{font-size:.95rem;font-weight:300;letter-spacing:.08em;min-width:11ch}.clocks .value.core{color:var(--cyan)}.clocks .value.sky{color:var(--gold)}.clocks .compression,.clocks .shock{font-size:.62rem;letter-spacing:.22em;opacity:0;transition:opacity .8s ease;margin-top:.2rem}.clocks .compression{color:var(--cyan)}.clocks .shock{color:var(--gold)}.clocks .compression.hot,.clocks .shock.hot{opacity:1}.track{position:absolute;left:5vw;right:5vw;bottom:5vh;height:1px;background:#f0eee824}.track .fill{position:absolute;left:0;top:0;bottom:0;width:100%;transform:scaleX(0);transform-origin:left center;background:linear-gradient(90deg,#ffc478d9,#ffecd2f2);transition:transform 80ms linear;will-change:transform}.track .tick{position:absolute;top:-3px;width:1px;height:7px;background:#f0eee84d}.prompt{position:absolute;bottom:12vh;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:1.1rem;text-align:center;white-space:nowrap}.prompt .how{font-size:.62rem;letter-spacing:.5em;text-transform:uppercase;color:var(--paper-dim);animation:prompt-pulse 3.2s ease-in-out infinite;transition:opacity 1.2s ease}.prompt.gone .how{opacity:0}.prompt .sound{pointer-events:auto;background:#00000059;border:1px solid rgba(240,238,232,.25);color:var(--paper);font:inherit;font-size:.62rem;letter-spacing:.3em;text-transform:uppercase;padding:.7em 1.6em;cursor:pointer;transition:border-color .4s ease,background .4s ease,opacity .9s ease}.prompt .sound:hover{border-color:var(--gold);background:#ffc47814}.prompt .sound:focus-visible,.finale button:focus-visible{outline:2px solid rgba(255,214,155,.95);outline-offset:4px;border-color:var(--gold);background:#ffc4781f}.prompt .sound.gone{opacity:0;pointer-events:none}@keyframes prompt-pulse{0%,to{opacity:.35}50%{opacity:.85}}.card{position:absolute;inset:0;display:grid;place-items:center;text-align:center;opacity:0;transition:opacity 2s ease;padding:7vw;pointer-events:none;text-shadow:0 2px 24px rgba(0,0,0,.95)}.card.visible{opacity:1}.card h2{font-family:var(--display);font-size:clamp(1.7rem,4.6vw,3.5rem);font-weight:400;font-style:italic;letter-spacing:.18em}.card p{margin:1.1rem auto 0;max-width:52ch;font-size:.82rem;font-weight:400;letter-spacing:.14em;color:var(--paper-dim)}.finale{position:absolute;inset:0;display:grid;place-items:center;text-align:center;opacity:0;pointer-events:none;transition:opacity 2.4s ease;padding:max(6vw,1.5rem);text-shadow:0 2px 22px rgba(0,0,0,.95);background:radial-gradient(ellipse 70% 60% at 50% 47%,#000000a8,#00000061 55%,#0000)}#hud.finale-mode .chapter,#hud.finale-mode .clocks,#hud.finale-mode .prompt{opacity:0;transition:opacity 1.2s ease}#hud.finale-mode .prompt .sound{pointer-events:none}.finale.visible{opacity:1;pointer-events:auto}.finale .over{font-size:.6rem;letter-spacing:.5em;text-transform:uppercase;color:var(--paper-dim);margin-bottom:1.1rem}.finale h2{font-family:var(--display);font-size:clamp(1.9rem,5vw,3.9rem);font-weight:400;font-style:italic;letter-spacing:.14em}.finale .tag{margin-top:1.2rem;font-size:.85rem;font-weight:400;letter-spacing:.12em;color:var(--paper-dim)}.finale .actions{margin-top:3rem;display:flex;gap:2.2rem;justify-content:center}.finale button{background:none;border:1px solid rgba(240,238,232,.25);color:var(--paper);font:inherit;font-size:.68rem;letter-spacing:.32em;text-transform:uppercase;padding:.85em 1.9em;cursor:pointer;transition:border-color .4s ease,background .4s ease}.finale button:hover{border-color:var(--gold);background:#ffc47814}.finale .seed{margin-top:2.2rem;font-size:.58rem;letter-spacing:.28em;color:#f0eee847}@media (max-width: 640px){.chapter{left:1.25rem;right:1.25rem;bottom:calc(8.6rem + env(safe-area-inset-bottom,0px));max-width:34ch}.chapter .numeral{margin-bottom:.32rem}.chapter .name{font-size:1.06rem;line-height:1.2;letter-spacing:.1em}.chapter .line{margin-top:.44rem;font-size:.68rem;line-height:1.48;letter-spacing:.035em}.clocks{top:calc(1.15rem + env(safe-area-inset-top,0px));right:1.15rem}.clocks .row{gap:.65em;margin-bottom:.32rem}.clocks .label{font-size:.5rem}.clocks .value{font-size:.75rem;min-width:8.4ch}.clocks .compression,.clocks .shock{font-size:.53rem;letter-spacing:.14em}.prompt{left:1rem;right:1rem;bottom:calc(3.25rem + env(safe-area-inset-bottom,0px));transform:none;gap:.62rem;white-space:normal}.prompt .how{max-width:90vw;font-size:.53rem;line-height:1.5;letter-spacing:.22em}.prompt .sound{font-size:.56rem;padding:.72em 1.35em}.track{left:1.25rem;right:1.25rem;bottom:calc(1.45rem + env(safe-area-inset-bottom,0px))}.card h2{font-size:clamp(1.45rem,9vw,2.35rem);line-height:1.15;letter-spacing:.11em}.card p{margin-top:.8rem;font-size:.7rem;line-height:1.55;letter-spacing:.075em}.finale h2{font-size:clamp(1.65rem,10vw,2.7rem);line-height:1.1;letter-spacing:.09em}.finale .tag{font-size:.72rem;line-height:1.55}.finale .actions{margin-top:2rem;flex-direction:column;align-items:stretch;gap:.75rem}.finale button{width:min(100%,18rem)}}@media (max-height: 620px) and (max-width: 900px){.chapter{bottom:5.4rem}.chapter .line{display:none}.prompt{bottom:2.75rem}.track{bottom:1.1rem}.clocks .compression,.clocks .shock{display:none}}@media (prefers-reduced-motion: reduce){.prompt .how{animation:none}}
