:root{--dur: .42s;--ease: cubic-bezier(.22, .8, .24, 1);--fg: #f6f3ee;--glass: rgba(0, 0, 0, .38);--glass-line: rgba(255, 255, 255, .16);color-scheme:dark}*{box-sizing:border-box}html,body{height:100%;margin:0;overflow:hidden;overscroll-behavior:none;background:#000;color:var(--fg)}body{font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}.stage{position:fixed;inset:0;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}.slide{position:absolute;inset:0;background:#000;will-change:transform;transition:transform var(--dur) var(--ease)}.stage.no-anim .slide{transition:none}.slide video{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none}.hud{position:fixed;inset:0;z-index:2;pointer-events:none}@font-face{font-family:VT323;src:url(fonts/VT323.woff2) format("woff2");font-display:swap}.hud__brand{position:absolute;top:max(12px,env(safe-area-inset-top));left:max(12px,env(safe-area-inset-left));display:flex;align-items:center;gap:5px;padding:2px 4px;color:#fff;font-family:VT323,monospace;font-size:16px;line-height:1;letter-spacing:.1em;text-decoration:none;text-shadow:0 0 8px rgba(0,0,0,.8);pointer-events:auto}.hud__brand:hover{background:#fff;color:#000;text-shadow:none}.hud__brand:focus-visible{outline:1px solid #fff;outline-offset:2px}.hud__brand svg{flex:none;width:9px;height:9px;fill:currentColor;shape-rendering:crispEdges;filter:drop-shadow(0 0 4px rgba(0,0,0,.8))}.hud__brand:hover svg{filter:none}.hud__btn{display:grid;place-items:center;width:26px;height:26px;padding:0;border:1px solid #fff;border-radius:0;background:#000;color:#fff;cursor:pointer;pointer-events:auto;transition:background .15s,color .15s,opacity .15s}.hud__btn:hover{background:#fff;color:#000}.hud__btn:disabled{opacity:.35;cursor:default}.hud__btn:disabled:hover{background:#000;color:#fff}.hud__btn:focus-visible{outline:1px solid #fff;outline-offset:3px}.hud__btn svg{width:18px;height:18px;fill:currentColor;shape-rendering:crispEdges}.hud__sound{position:absolute;top:max(12px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right));display:flex;flex-direction:column-reverse;align-items:center;gap:4px}.hud__mute .icon-slash,.hud__mute[aria-pressed=true] .icon-waves{display:none}.hud__mute[aria-pressed=true] .icon-slash{display:inline}.hud__mute[aria-expanded=true]{background:#fff;color:#000}.hud__vol{position:relative;box-sizing:border-box;width:30px;height:124px;border:1px solid #fff;background:#000;pointer-events:auto}.hud__vol[hidden]{display:none}.hud__vol input{position:absolute;left:50%;top:50%;width:104px;height:28px;margin:0;background:transparent;cursor:pointer;touch-action:none;transform:translate(-50%,-50%) rotate(-90deg);-webkit-appearance:none;appearance:none}.hud__vol input:focus-visible{outline:none}.hud__vol:has(input:focus-visible){outline:1px solid #fff;outline-offset:2px}.hud__vol input::-webkit-slider-runnable-track{height:2px;background:#fff;border:0}.hud__vol input::-moz-range-track{height:2px;background:#fff;border:0}.hud__vol input::-webkit-slider-thumb{width:10px;height:20px;margin-top:-9px;border:0;border-radius:0;background:#fff;-webkit-appearance:none;appearance:none}.hud__vol input::-moz-range-thumb{width:10px;height:20px;border:0;border-radius:0;background:#fff}.hud__nav{display:none}@media(hover:hover)and (pointer:fine){.hud__nav{position:absolute;top:50%;right:max(12px,env(safe-area-inset-right));display:flex;flex-direction:column;gap:6px;transform:translateY(-50%)}}.hud__msg{position:absolute;left:50%;bottom:56px;margin:0;max-width:min(90vw,420px);padding:10px 16px;border-radius:999px;background:var(--glass);font-size:14px;text-align:center;transform:translate(-50%);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.hud__msg[hidden]{display:none}.now{position:absolute;left:max(12px,env(safe-area-inset-left));bottom:calc(max(12px,env(safe-area-inset-bottom)) + var(--dbg-h, 0px));box-sizing:border-box;display:grid;grid-template-columns:1fr auto;gap:3px;width:max-content;min-width:140px;max-width:min(240px,calc(100vw - 24px));padding:5px;border:1px solid #fff;background:#000;color:#fff;font-family:VT323,monospace;font-size:13px;line-height:1;text-decoration:none;pointer-events:none;opacity:0;visibility:hidden;transition:opacity .8s ease,visibility 0s .8s}.now.show{opacity:1;visibility:visible;pointer-events:auto;transition-delay:0s}.now.is-link{cursor:pointer}.now:focus-visible{outline:1px solid #fff;outline-offset:3px}.now__title{grid-column:1 / -1;padding:1px 0 2px;letter-spacing:.15em;text-align:center}.now__field{min-width:0;overflow:hidden;padding:3px 5px;border:1px solid #000;background:#fff;color:#000;white-space:nowrap;text-overflow:ellipsis}#nowArtist{grid-column:1 / -1}.now__box{display:grid;place-items:center;padding:3px 6px;border:1px solid #fff;background:#000;color:#fff;transition:background .15s,color .15s}.now__listen{display:none}.now.is-link .now__listen{display:grid}.now.is-link:hover .now__listen{background:#fff;color:#000}.now:not(.is-link) #nowTitle{grid-column:1 / -1}.now.no-artist #nowArtist{display:none}.hud__full{position:absolute;right:max(12px,env(safe-area-inset-right));bottom:calc(max(12px,env(safe-area-inset-bottom)) + var(--dbg-h, 0px))}.hud__full[hidden],.hud__full .icon-exit,.hud__full[aria-pressed=true] .icon-enter{display:none}.hud__full[aria-pressed=true] .icon-exit{display:inline}.hud__track{position:absolute;left:0;right:0;bottom:env(safe-area-inset-bottom,0px);height:3px;background:#ffffff2e}.hud__bar{height:100%;background:#fff;transform:scaleX(0);transform-origin:left;will-change:transform}.hud__start{position:absolute;left:50%;top:50%;width:40px;height:40px;transform:translate(-50%,-50%);transition:background .15s,color .15s,opacity .6s ease,visibility 0s}.hud__start svg{width:27px;height:27px}.hud__start.gone{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .6s ease,visibility 0s .6s}.hud__dim{position:absolute;inset:0;background:#000000a6;pointer-events:none;transition:opacity .6s ease}.hud__dim.gone{opacity:0}@media(prefers-reduced-motion:reduce){.hud__btn{transition:none}}
