@import "https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Space+Grotesk:wght@400;500;600;700&display=swap";:root{color:#e9fbff;font-synthesis:none;background:#02070c;font-family:Space Grotesk,system-ui,sans-serif}*{box-sizing:border-box}html,body,#root{width:100%;min-width:320px;min-height:100%;margin:0}body{min-height:100vh;overflow:hidden}button,input,select{font:inherit}button{color:inherit}.player{isolation:isolate;background:#02070c;min-height:100svh;position:relative;overflow:hidden}.display,.display canvas,.pepper-grid,.pepper-face{position:absolute;inset:0}.display{z-index:0}.display-bloom{pointer-events:none;background:radial-gradient(circle at 50% 47%,#0000 15%,#00040740 62%,#0000009e 100%);position:absolute;inset:0}.hud{z-index:2;pointer-events:none;text-shadow:0 3px 24px #000000e6;position:absolute}.hud--top{top:clamp(1.2rem,4vw,3.25rem);left:clamp(1.2rem,5vw,4.75rem)}.eyebrow,.hud--moment span,.guide>span{color:#82eaf7;letter-spacing:.18em;font:500 .62rem/1.25 DM Mono,monospace}h1{letter-spacing:-.055em;margin:.45rem 0 .1rem;font-size:clamp(1.75rem,4vw,3.6rem);line-height:.92}.hud--top p{color:#bcd0d5;letter-spacing:.15em;margin:0;font:.72rem DM Mono,monospace}.hud--moment{text-align:right;top:clamp(1.3rem,4vw,3.35rem);right:clamp(1.2rem,5vw,4.75rem)}.hud--moment strong{letter-spacing:.13em;margin-top:.38rem;font-size:clamp(.76rem,1.4vw,1rem);display:block}.subtitle{z-index:4;color:#f0feff;text-align:center;text-shadow:0 3px 14px #000,0 0 28px #000;width:min(43rem,100% - 3rem);margin:0;font-size:clamp(.95rem,2vw,1.35rem);font-weight:500;line-height:1.35;position:absolute;bottom:clamp(8rem,15vw,10.5rem);left:50%;transform:translate(-50%)}.controls{z-index:3;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#020c12b8;border:1px solid #a8f5ff33;border-radius:1rem;max-width:760px;padding:.7rem .8rem;position:absolute;bottom:clamp(1rem,3vw,2.1rem);left:clamp(1rem,4vw,3.25rem);right:clamp(1rem,4vw,3.25rem);box-shadow:0 12px 60px #00000073}.control-row{align-items:center;gap:.65rem;display:flex}.control-row--secondary{justify-content:space-between;padding:.45rem .1rem .05rem}.round-button{color:#071317;cursor:pointer;background:#bdfeff;border:1px solid #8ff5ff;border-radius:999px;width:2.2rem;height:2.2rem;padding:0 0 .1rem .04rem;font-weight:700}.scrubber{flex:1;align-items:center;height:1.5rem;display:grid;position:relative}.scrubber input{z-index:2;accent-color:#b9fbff;cursor:pointer;width:100%;margin:0;position:relative}.scrubber i{pointer-events:none;background:#b9fbff;height:2px;position:absolute}output{color:#b9c9cd;white-space:nowrap;font:.65rem DM Mono,monospace}.chapter-list{scrollbar-width:thin;gap:.18rem;margin:.2rem 0 .25rem;padding:.34rem 0 .15rem;display:flex;overflow-x:auto}.chapter-list button{color:#8faeb3;cursor:pointer;letter-spacing:.04em;text-align:left;text-transform:uppercase;background:0 0;border:0;border-left:1px solid #7edae533;flex:none;font:600 .54rem/1.35 DM Mono,monospace}.chapter-list button span{color:#507078;font-size:.5rem;display:block}.chapter-list button.is-active{color:#d9fdff}.chapter-list button.is-active span{color:#7eeaf5}.mode-switch{background:#88e0ee1f;border-radius:.5rem;padding:2px;display:flex}.mode-switch button,.text-button{cursor:pointer;letter-spacing:.04em;background:0 0;border:0;border-radius:.36rem;padding:.38rem .55rem;font-size:.68rem}.mode-switch button.is-active{color:#041114;background:#c6fbff;font-weight:700}.text-button{color:#b9f7ff}.scene-select{color:#adc5ca;align-items:center;gap:.4rem;font-size:.65rem;display:flex}.scene-select select{color:#defdff;background:#0a161b;border:1px solid #315a61;border-radius:.35rem;max-width:11rem;padding:.26rem .45rem}.pepper-grid{background:#000;width:min(100vw,100vh);height:min(100vw,100vh);inset:50% auto auto 50%;transform:translate(-50%,-50%)}.pepper-face{background:#000;position:absolute;inset:auto;overflow:hidden}.pepper-face canvas{width:100%!important;height:100%!important}.pepper-face--north,.pepper-face--south{width:60%;height:42%;left:20%}.pepper-face--north{clip-path:polygon(0 0,100% 0,68% 100%,32% 100%);top:0}.pepper-face--south{clip-path:polygon(32% 0,68% 0,100% 100%,0 100%);bottom:0}.pepper-face--east,.pepper-face--west{width:42%;height:60%;top:20%}.pepper-face--east{clip-path:polygon(32% 0,100% 0,100% 100%,32% 100%,0 68%,0 32%);right:0}.pepper-face--west{clip-path:polygon(0 0,68% 0,100% 32%,100% 68%,68% 100%,0 100%);left:0}.pepper-face--north canvas{transform:rotate(0)}.pepper-face--south canvas{transform:rotate(180deg)}.pepper-face--east canvas{transform:rotate(90deg)}.pepper-face--west canvas{transform:rotate(-90deg)}.pepper-grid:after{content:"";z-index:5;pointer-events:none;background:#000;position:absolute;inset:38%}.player--pepper .hud,.player--pepper .subtitle{display:none}.player--pepper .hud,.player--pepper .controls{opacity:.82}.player--clean .hud,.player--clean .controls,.player--clean .subtitle{display:none}.reveal-controls{z-index:6;color:#d3fdff47;cursor:pointer;background:#00000026;border:1px solid #b9fbff4d;border-radius:.35rem;padding:.32rem .48rem;font:.56rem DM Mono,monospace;display:none;position:absolute;bottom:.65rem;right:.65rem}.player--clean .reveal-controls{display:block}.asset-error,.app-loading{text-align:center;color:#bfeff4;background:radial-gradient(circle,#0b2730,#02070c 70%);place-items:center;width:100%;height:100%;padding:2rem;display:grid}.asset-error{border:1px dashed #449ba5;font:.85rem DM Mono,monospace}.app-loading>div{background:#071319;border:1px solid #1c4650;border-radius:1rem;max-width:32rem;padding:1.5rem}.app-loading p{color:#9bb6ba;font-size:.88rem}code{color:#a4f5ff}.guide{z-index:8;background:#030e13f0;border:1px solid #4d9ca7;border-radius:1rem;width:min(27rem,100% - 2rem);padding:1.25rem;position:absolute;bottom:7rem;right:clamp(1rem,4vw,3.25rem);box-shadow:0 20px 80px #0009}.guide h2{margin:.45rem 2rem .8rem 0;font-size:1.12rem;line-height:1.05}.guide ol{color:#c0d5d8;margin:0;padding-left:1.25rem;font-size:.8rem;line-height:1.5}.guide-close{color:#dffcff;cursor:pointer;background:0 0;border:0;font-size:1.5rem;position:absolute;top:.6rem;right:.7rem}@media (width<=620px){.hud--moment{display:none}.controls{max-width:none}.control-row--secondary{flex-wrap:wrap;gap:.35rem}.scene-select,.player--pepper .hud--top{display:none}}