:root{--ink: #d7dbd3;--ink-dim: #7f8880;--line: rgba(215, 219, 211, .22);--panel: rgba(9, 12, 10, .72);--accent: #cdd8c9;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:#070907;color:var(--ink);font-family:Helvetica Neue,Arial Narrow,Helvetica,Arial,PingFang SC,sans-serif;-webkit-font-smoothing:antialiased}#scene{position:fixed;inset:0;width:100%;height:100%;display:block}.letterbox{position:fixed;inset:0;pointer-events:none;z-index:3}.letterbox i{position:absolute;left:0;right:0;height:12.05vh;background:#050705}.letterbox i:first-child{top:0}.letterbox i:last-child{bottom:0}body.no-bars .letterbox{display:none}.grain-overlay{position:fixed;inset:0;z-index:2;pointer-events:none;opacity:.16;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E");mix-blend-mode:screen}.credits{position:fixed;top:15.5vh;left:4.2vw;z-index:4;pointer-events:none;transition:opacity 1.2s ease}.eyebrow{margin:0 0 1.1rem;font-size:10px;letter-spacing:.34em;text-transform:uppercase;color:var(--ink-dim)}.credits h1{margin:0;font-size:clamp(30px,5.1vw,76px);line-height:.93;font-weight:300;letter-spacing:.16em;text-shadow:0 2px 24px #000}.scene-label{margin:1.35rem 0 0;font-size:10px;letter-spacing:.3em;color:var(--ink-dim);text-transform:uppercase}.beat{position:fixed;bottom:20vh;left:4.2vw;z-index:4;display:flex;align-items:center;gap:12px;pointer-events:none;font-size:10px;letter-spacing:.34em;text-transform:uppercase;color:var(--ink);text-shadow:0 1px 10px #000;transition:opacity .5s ease}.beat-rule{width:34px;height:1px;background:var(--accent)}.side-note{position:fixed;right:4.2vw;top:50%;z-index:4;writing-mode:vertical-rl;transform:translateY(-50%);font-size:9px;letter-spacing:.42em;color:#d7dbd359;pointer-events:none}.ui{position:fixed;left:0;right:0;bottom:0;z-index:5;padding:16px 4.2vw max(16px,env(safe-area-inset-bottom));background:linear-gradient(to top,rgba(4,6,5,.94),rgba(4,6,5,.66) 62%,transparent);transition:opacity .35s ease,transform .35s ease}body.ui-hidden .ui,body.ui-hidden .credits,body.ui-hidden .beat,body.ui-hidden .side-note{opacity:0;pointer-events:none}body.ui-hidden .credits{transform:translateY(-8px)}.transport{display:flex;align-items:center;gap:14px}.icon-btn{width:30px;height:30px;flex:none;padding:0;cursor:pointer;background:transparent;color:var(--ink);border:1px solid var(--line);border-radius:2px;font-size:12px;line-height:1}.icon-btn:hover{background:#d7dbd31f}.tc{font-variant-numeric:tabular-nums;font-size:11px;letter-spacing:.16em;min-width:44px}.tc.muted{color:var(--ink-dim)}#scrub{flex:1;min-width:60px;height:18px;appearance:none;background:transparent;cursor:pointer}#scrub::-webkit-slider-runnable-track{height:1px;background:var(--line)}#scrub::-moz-range-track{height:1px;background:var(--line)}#scrub::-webkit-slider-thumb{appearance:none;width:9px;height:9px;margin-top:-4px;border-radius:50%;background:var(--accent);border:0}#scrub::-moz-range-thumb{width:9px;height:9px;border-radius:50%;background:var(--accent);border:0}.options{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:14px}.opt,.opt-btn{display:inline-flex;align-items:baseline;gap:9px;padding:0;background:none;border:0;color:var(--ink);cursor:pointer;font-family:inherit;font-size:10px;letter-spacing:.22em;text-transform:uppercase}.opt>span,.opt-btn>span{color:var(--ink-dim)}.opt-btn>b,.opt select{font-weight:400;color:var(--ink);letter-spacing:.14em}.opt select{background:transparent;border:0;border-bottom:1px solid var(--line);padding:0 0 2px;font-family:inherit;font-size:10px;cursor:pointer}.opt select option{background:#0b0e0c;color:var(--ink)}.opt-btn:hover>b{text-decoration:underline;text-underline-offset:4px}.footnote{display:flex;justify-content:space-between;gap:16px;margin-top:13px;font-size:9px;letter-spacing:.16em;color:var(--ink-dim);text-transform:uppercase}.footnote details{text-align:right;max-width:58%}.footnote summary{cursor:pointer;list-style:none;color:var(--ink)}.footnote summary::-webkit-details-marker{display:none}.footnote details[open] span{display:block;margin-top:6px;line-height:1.7;letter-spacing:.1em}:focus-visible{outline:1px solid var(--accent);outline-offset:3px}@media(max-width:700px){.credits{top:14.5vh}.side-note{display:none}.beat{bottom:25vh}.options{gap:8px 14px}.footnote details{max-width:40%}}@media(prefers-reduced-motion:reduce){.credits,.ui,.beat{transition:none}}
