:root{--bg: #05060c;--ink: #e9e6dc;--ink-dim: rgba(233, 230, 220, .62);--ink-faint: rgba(233, 230, 220, .32);--panel: rgba(10, 12, 22, .62);--panel-border: rgba(233, 230, 220, .12);--accent: #ff5a36;--lcd: #9dff7f;--font-mono: "JetBrains Mono", ui-monospace, "Cascadia Mono", "SF Mono", Menlo, Consolas, monospace;--font-sans: "Outfit", "Segoe UI", system-ui, -apple-system, sans-serif;--ease-spring: cubic-bezier(.34, 1.56, .64, 1);--ease-out: cubic-bezier(.22, 1, .36, 1);--gutter: clamp(16px, 2.4vw, 32px);--scroll-progress: 0}*,*:before,*:after{box-sizing:border-box}html{scrollbar-width:none}html::-webkit-scrollbar{display:none}html,body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font-sans);overflow-x:hidden;-webkit-font-smoothing:antialiased}canvas#scene{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:pan-y}video#player-video{position:fixed;width:2px;height:2px;opacity:0;pointer-events:none;left:-10px;top:-10px}#scroll-spacer{width:1px;pointer-events:none}.page{position:fixed;top:0;left:0;right:0;pointer-events:none;opacity:0;will-change:transform;transition:opacity 1.2s ease .3s}.page.is-visible{opacity:1}.stage{position:relative;height:100vh;height:100dvh}.stage>*,.details__inner{pointer-events:auto}.stage__bottom{position:absolute;left:50%;bottom:max(var(--gutter),env(safe-area-inset-bottom));transform:translate(-50%);width:min(620px,calc(100% - 2 * var(--gutter)));display:flex;flex-direction:column;align-items:center;gap:10px}.title-bar{position:relative;width:100%;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;padding:12px 18px;background:var(--panel);border:1px solid var(--panel-border);border-radius:999px;backdrop-filter:blur(14px);box-shadow:0 24px 50px -28px #000000f2;font-family:var(--font-mono);overflow:hidden}.title-bar:after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(to bottom,rgba(255,255,255,.025) 0 1px,transparent 1px 3px);mix-blend-mode:overlay}.title-bar__title{grid-column:2;font-size:clamp(14px,1.5vw,18px);letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ink);text-shadow:0 0 14px color-mix(in srgb,var(--accent) 55%,transparent)}.title-bar__time{grid-column:3;justify-self:end;font-size:11px;letter-spacing:.08em;color:var(--ink-dim);white-space:nowrap}.scroll-cue{display:grid;place-items:center;width:40px;height:32px;padding:0;border:0;background:transparent;color:var(--ink-dim);cursor:pointer;opacity:calc(1 - var(--scroll-progress));visibility:visible}.scroll-cue svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;animation:cue-pulse 1.8s ease-in-out infinite}.scroll-cue:hover,.scroll-cue:focus-visible{color:var(--ink);outline:none}@keyframes cue-pulse{0%,to{transform:translateY(-3px);opacity:.35}50%{transform:translateY(4px);opacity:1}}.details{position:relative;padding:clamp(48px,9vh,96px) var(--gutter) clamp(64px,12vh,120px);background:linear-gradient(to bottom,#05060c00,#05060cd1 120px,#05060ceb)}.details__inner{max-width:720px;margin:0 auto;display:flex;flex-direction:column;gap:clamp(48px,8vh,80px)}.metadata{transition:opacity .22s ease,transform .22s ease}.metadata.is-fading{opacity:0;transform:translateY(6px)}.metadata__empty{margin:0;color:var(--ink-dim);font-size:15px;line-height:1.6}.metadata__index{margin:0 0 10px;font-family:var(--font-mono);font-size:11px;letter-spacing:.22em;color:var(--ink-faint)}.metadata__title{margin:0 0 20px;font-family:var(--font-sans);font-size:clamp(24px,3.4vw,38px);letter-spacing:.06em;text-transform:uppercase;line-height:1.15;padding-left:16px;border-left:4px solid var(--accent)}.metadata__description{margin:0 0 28px;font-size:clamp(15px,1.25vw,17px);line-height:1.75;color:var(--ink)}.metadata__rows{margin:0 0 20px;display:grid;gap:10px;padding-top:20px;border-top:1px solid var(--panel-border)}.metadata__row{display:grid;grid-template-columns:80px 1fr;gap:16px;font-size:14px}.metadata__row dt{font-family:var(--font-mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-faint);padding-top:3px}.metadata__row dd{margin:0;color:var(--ink-dim)}.metadata__link{display:inline-block;margin:0 0 8px;font-family:var(--font-mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink);text-decoration:none;padding:8px 14px;border:1px solid var(--panel-border);border-radius:999px;background:var(--panel);transition:border-color .25s ease,background .25s ease,transform .25s var(--ease-out)}.metadata__link:hover,.metadata__link:focus-visible{color:#fff;border-color:#1db954;background:#1db95429;transform:translateY(-1px);outline:none}.start-profile,.site-profile{display:flex;flex-direction:column;align-items:center;text-align:center}.start-profile{margin-bottom:18px;padding:0 var(--gutter)}.site-profile{padding-top:clamp(40px,6vh,64px);border-top:1px solid var(--panel-border)}.profile__name{margin:0;font-family:var(--font-sans);font-size:clamp(26px,4vw,40px);font-weight:600;letter-spacing:.08em;text-transform:uppercase}.profile__title{margin:8px 0 0;color:var(--ink-dim);font-size:15px;letter-spacing:.06em}.profile__sep{color:var(--ink-faint);margin:0 4px}.profile__tagline{margin:16px 0 0;max-width:44ch;color:var(--ink-dim);font-size:14px;line-height:1.6}.profile__links{position:absolute;top:var(--gutter);right:var(--gutter);display:flex;gap:8px;flex-wrap:wrap}.profile__link{cursor:pointer;font-family:var(--font-mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink);text-decoration:none;padding:7px 12px;border:1px solid var(--panel-border);border-radius:999px;background:var(--panel);backdrop-filter:blur(8px);transition:border-color .25s ease,background .25s ease,transform .25s var(--ease-out)}.profile__link:hover,.profile__link:focus-visible{border-color:var(--ink-dim);background:#e9e6dc14;transform:translateY(-1px);outline:none}.library{position:absolute;left:var(--gutter);top:50%;transform:translateY(-50%);width:max-content;max-height:calc(100% - 160px)}.library__list{list-style:none;margin:0;padding:16px 0;display:flex;flex-direction:column;overflow:visible}.library__item{position:relative;margin-top:-12px}.library__item:first-child{margin-top:0}.library__item:hover,.library__item:focus-within{z-index:4}.disc{--size: 52px;position:relative;display:block;width:var(--size);height:var(--size);padding:0;border:0;background:transparent;color:var(--ink);cursor:pointer}.disc:focus-visible{outline:1px solid var(--accent);outline-offset:2px}.disc__icon{position:relative;display:block;width:var(--size);height:var(--size);border-radius:50%;background:radial-gradient(circle at 50% 50%,transparent 0 17%,var(--accent) 17.5% 22%,#f3efe6 22.5% 42%,transparent 42.5%),conic-gradient(from 200deg,#c7c9d6,#f2d5ff 12%,#b7f0ff,#d4ffd2,#ffe3b5,#ffb8c8,#c7c9d6 72%,#d9e6ff 86%,#c7c9d6);box-shadow:0 0 0 1px #ffffff40 inset,0 10px 24px -10px #000000e6;transform:scale(1);transform-origin:center;transition:transform .4s var(--ease-spring),box-shadow .3s ease,filter .3s ease;filter:saturate(.85) brightness(.95)}.disc__sheen{position:absolute;inset:0;border-radius:50%;background:linear-gradient(135deg,rgba(255,255,255,.55),transparent 45%,transparent 60%,rgba(255,255,255,.2));mix-blend-mode:screen}.disc__hole{position:absolute;inset:0;margin:auto;width:16%;height:16%;border-radius:50%;background:var(--bg);box-shadow:0 0 0 2px #ffffff40}.disc:hover .disc__icon,.disc:focus-visible .disc__icon,.disc.is-active:hover .disc__icon,.disc.is-active:focus-visible .disc__icon{transform:scale(1.55);filter:saturate(1.1) brightness(1.08);box-shadow:0 0 0 1px #ffffff80 inset,0 0 28px -2px var(--accent),0 16px 28px -8px #000000f2}.disc.is-active .disc__icon{transform:scale(1.05);filter:saturate(1) brightness(1);box-shadow:0 0 0 1px #fff6 inset,0 0 18px -6px var(--accent),0 10px 24px -10px #000000e6}.library.is-playing .disc.is-active:not(:hover):not(:focus-visible) .disc__icon{animation:disc-spin 3s linear infinite}@keyframes disc-spin{to{transform:scale(1.05) rotate(360deg)}}.start{position:fixed;inset:0;z-index:10;display:grid;place-items:center;align-content:center;gap:20px;background:radial-gradient(ellipse at 50% 40%,#27204a8c,#05060cf5 70%);backdrop-filter:blur(6px);transition:opacity .8s ease,visibility .8s}.start.is-hidden{opacity:0;visibility:hidden;pointer-events:none}.start-button{display:flex;align-items:center;gap:16px;padding:16px 28px 16px 18px;border:1px solid rgba(233,230,220,.25);border-radius:999px;background:#0a0c16b3;color:var(--ink);font-family:var(--font-mono);font-size:15px;letter-spacing:.18em;text-transform:uppercase;cursor:pointer;transition:transform .4s var(--ease-spring),border-color .3s ease,box-shadow .3s ease,opacity .3s ease}.start-button:disabled{opacity:.45;cursor:progress}.start-button:not(:disabled):hover,.start-button:not(:disabled):focus-visible{transform:scale(1.04);border-color:var(--ink);box-shadow:0 0 40px -10px var(--accent);outline:none}.start-icon{width:44px;height:44px;border-radius:50%;background:radial-gradient(circle at 50% 50%,var(--bg) 0 15%,transparent 16%),conic-gradient(#c7c9d6,#f2d5ff,#b7f0ff,#d4ffd2,#ffe3b5,#ffb8c8,#c7c9d6);box-shadow:0 0 0 1px #ffffff4d inset;animation:disc-spin 6s linear infinite}.start-status{margin:0;font-family:var(--font-mono);font-size:12px;letter-spacing:.1em;color:var(--ink-dim)}@media (max-width: 820px){.library{max-height:calc(100% - 140px)}.disc{--size: 44px}}@media (max-width: 520px){.title-bar{border-radius:18px}.title-bar__title{text-align:center}}@media (prefers-reduced-motion: reduce){.library.is-playing .disc.is-active:not(:hover):not(:focus-visible) .disc__icon,.start-icon,.scroll-cue svg{animation:none}.disc__icon,.metadata,.start-button{transition-duration:.01ms}}