:root{--bg:#0a0a0b;--ink:#edeae4;--muted:#8b857b;--art:min(70vw, 44vh, 560px);--tilt-max:12;--tilt-perspective:calc(var(--art) * 1.5);--meta-gap:13px;--meta-h:66px;--date-h:24px;--below:calc(var(--meta-gap) + var(--meta-h));--anchor:calc(50% - var(--below) / 2)}*,:before,:after{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--ink);font-synthesis-weight:none;overscroll-behavior:none;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent;margin:0;padding:0;font-family:Inter Variable,system-ui,-apple-system,Segoe UI,sans-serif;overflow:hidden}body{position:relative}.stage{position:fixed;inset:0;overflow:hidden}.stage:before{content:"";pointer-events:none;background:radial-gradient(56% 44% at 50% 46%,#edeae40e,#edeae400 72%);position:absolute;inset:0}.heading{top:calc(max(env(safe-area-inset-top,0px), 46px) + 52px);z-index:5;text-align:center;letter-spacing:.01em;color:var(--ink);opacity:.92;pointer-events:none;margin:0;font-family:Instrument Serif,Georgia,Times New Roman,serif;font-size:27px;font-weight:400;line-height:1.2;position:fixed;left:0;right:0}.status{left:50%;top:var(--anchor);z-index:2;text-align:center;letter-spacing:.2em;text-transform:uppercase;width:min(72vw,320px);color:var(--muted);margin:0;font-size:10.5px;font-weight:450;transition:opacity .7s;position:absolute;transform:translate(-50%,-50%)}.status[hidden]{display:none}.ambient{z-index:0;pointer-events:none;position:absolute;inset:-80px}.ambient i{filter:blur(56px)saturate(1.8)brightness(.34);opacity:0;will-change:opacity;background-position:50%;background-repeat:no-repeat;background-size:cover;transition:opacity .9s;position:absolute;inset:0}.ambient i.on{opacity:.94}.rail{perspective:1500px;perspective-origin:50% var(--anchor);touch-action:pan-y pinch-zoom;-webkit-user-select:none;user-select:none;opacity:0;margin:0;padding:0;list-style:none;transition:opacity .9s;position:absolute;inset:0}.rail,.rail *{-webkit-touch-callout:none}.rail.is-ready{opacity:1}.item{left:50%;top:var(--anchor);width:var(--art);margin-left:calc(var(--art) / -2);margin-top:calc(var(--art) / -2);transform-origin:50% calc(var(--art) / 2);perspective:var(--tilt-perspective);perspective-origin:50% calc(var(--art) / 2);will-change:transform;position:absolute}.shadow{width:100%;height:var(--art);z-index:-1;pointer-events:none;opacity:var(--shadow,0);position:absolute;top:0;left:0;box-shadow:0 30px 64px -26px #000000f2,0 8px 22px -10px #000000bf}.shadow:after{content:"";background:radial-gradient(closest-side,#edeae400 24%,#edeae433 53%,#edeae414 74%,#edeae400 100%);position:absolute;inset:-45%}.art{aspect-ratio:1;isolation:isolate;will-change:transform;background:#131315;width:100%;position:relative;overflow:hidden}.art img{object-fit:cover;-webkit-user-drag:none;width:100%;height:100%;display:block}.dim{opacity:var(--dim,0);pointer-events:none;background:#050506;position:absolute;inset:0}.date{left:0;right:0;top:calc(-1 * var(--date-h));height:calc(var(--date-h) - 8px);line-height:calc(var(--date-h) - 8px);text-align:center;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);white-space:nowrap;text-overflow:ellipsis;pointer-events:none;font-size:10px;font-weight:450;position:absolute;overflow:hidden}.meta{height:var(--meta-h);margin-top:var(--meta-gap);text-align:center;opacity:var(--meta,1);flex-direction:column;justify-content:center;display:flex}.ch{display:inline-block}@keyframes pop-char{0%{opacity:0;transform:translateY(16px)scale(0)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes pop-artist{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes blur-in{0%{opacity:0;filter:blur(10px)}to{opacity:1;filter:blur()}}.is-pop .date{animation:.52s cubic-bezier(.34,1.3,.64,1) backwards pop-artist;animation-delay:calc(var(--i,0) * 35ms)}.is-pop .title .ch{animation:.48s cubic-bezier(.34,1.56,.64,1) backwards pop-char;animation-delay:calc(var(--i,0) * 35ms)}.is-pop .artist{animation:.52s cubic-bezier(.34,1.3,.64,1) backwards pop-artist;animation-delay:calc(var(--i,0) * 35ms)}.heading.is-pop .ch{animation:.65s ease-out backwards blur-in;animation-delay:calc(var(--i,0) * 35ms)}.title{letter-spacing:.006em;color:var(--ink);white-space:nowrap;text-overflow:ellipsis;margin:0;font-family:Instrument Serif,Georgia,Times New Roman,serif;font-size:30px;font-weight:400;line-height:1.3;overflow:hidden}.artist{letter-spacing:.16em;text-transform:uppercase;color:var(--muted);white-space:nowrap;text-overflow:ellipsis;margin:5px 0 0;font-size:11px;font-weight:450;line-height:1.4;overflow:hidden}.top-tint{height:calc(max(env(safe-area-inset-top,0px), 46px) + 140px);z-index:3;pointer-events:none;background:linear-gradient(180deg, var(--bg) 0, var(--bg) max(env(safe-area-inset-top,0px), 46px), #0a0a0b00 calc(max(env(safe-area-inset-top,0px), 46px) + 140px));position:fixed;top:0;left:0;right:0}.vignette{z-index:3;pointer-events:none;background:radial-gradient(at 50% 46%,#0000 36%,#00000094 100%);position:fixed;inset:0}.grain{z-index:4;pointer-events:none;opacity:.05;mix-blend-mode:overlay;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/></filter><rect width='160' height='160' filter='url(%23n)'/></svg>");background-size:160px 160px;position:fixed;inset:0}@media (prefers-reduced-motion:reduce){.grain{display:none}.status,.rail,.ambient i{transition:none}.is-pop .date,.is-pop .title .ch,.is-pop .artist,.heading.is-pop .ch{animation:none}}@media (width>=900px){:root{--art:min(30vw, 44vh, 460px);--tilt-max:7;--tilt-perspective:calc(var(--art) * 2)}.title{font-size:34px}.artist{font-size:11px}}
