:root{color-scheme:dark;--beat-ms: .5s;--flash-opacity: .55;--bg-thump-scale: 1.018;--hue-base: 260;--sat: 70%;--light-a: 14%;--light-b: 48%;--pulse-scale: 1.04;--glow: 24px;--font: "SF Pro Display", "Segoe UI", system-ui, sans-serif}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;min-height:100%;min-height:100dvh;font-family:var(--font);-webkit-tap-highlight-color:transparent}body{overflow-x:hidden;background:#0a0a12;color:#f4f2ff}.shell{position:relative;min-height:100dvh;padding:max(16px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));display:flex;align-items:center;justify-content:center}.bg-layer{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none;background:radial-gradient(ellipse 120% 80% at 50% 20%,hsla(var(--hue-base),var(--sat),var(--light-b),.55),transparent 55%),radial-gradient(ellipse 90% 70% at 80% 90%,hsla(calc(var(--hue-base) + 40),var(--sat),var(--light-a),.45),transparent 50%),linear-gradient(165deg,hsl(var(--hue-base),var(--sat),var(--light-a)),hsl(calc(var(--hue-base) + 55),calc(var(--sat) - 10%),calc(var(--light-b) - 8%)));filter:saturate(1.15);transform-origin:50% 45%;animation:hue-drift calc(var(--beat-ms) * 32) ease-in-out infinite alternate;will-change:transform,filter}.shell.shell--playing:not(.shell--mute-bg):not(.shell--realtime) .bg-layer{animation:hue-drift calc(var(--beat-ms) * 32) ease-in-out infinite alternate,bg-thump var(--beat-ms) cubic-bezier(.25,.9,.35,1) infinite}.shell.shell--realtime.shell--playing:not(.shell--mute-bg) .bg-layer{animation:hue-drift calc(var(--beat-ms) * 32) ease-in-out infinite alternate}.shell.shell--mute-bg .bg-layer{animation:hue-drift calc(var(--beat-ms) * 32) ease-in-out infinite alternate}@keyframes bg-thump{0%,to{transform:scale(1) translateZ(0)}11%{transform:scale(var(--bg-thump-scale)) translate3d(.35%,-.25%,0)}22%{transform:scale(1.008) translate3d(-.2%,.15%,0)}}@keyframes hue-drift{0%{filter:saturate(1.1) hue-rotate(-8deg)}to{filter:saturate(1.28) hue-rotate(8deg)}}.pulse-ring{position:fixed;left:50%;top:42%;width:min(120vw,520px);height:min(120vw,520px);translate:-50% -50%;border-radius:50%;z-index:40;pointer-events:none;background:radial-gradient(circle,hsla(var(--hue-base),var(--sat),55%,.22) 0%,transparent 62%);animation:none;opacity:.38}.shell.shell--playing:not(.shell--mute-bg):not(.shell--realtime) .pulse-ring{animation:pulse-beat var(--beat-ms) cubic-bezier(.45,0,.55,1) infinite;opacity:.88}.shell.shell--realtime.shell--playing:not(.shell--mute-bg) .pulse-ring{animation:none;opacity:.78}@keyframes pulse-beat{0%,to{transform:scale(1);opacity:.65}45%{transform:scale(var(--pulse-scale));opacity:1}}.flash-veil{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;pointer-events:none;background:radial-gradient(circle at 50% 38%,rgba(255,255,255,.95) 0%,rgba(255,255,255,.35) 38%,transparent 68%);opacity:0;mix-blend-mode:overlay;animation:none}.shell.shell--playing:not(.shell--mute-flash):not(.shell--realtime) .flash-veil{animation:flash-beat var(--beat-ms) cubic-bezier(.2,.85,.4,1) infinite}.shell.shell--realtime.shell--playing:not(.shell--mute-flash) .flash-veil{animation:none;opacity:0}.shell.shell--mute-flash .flash-veil{animation:none!important;opacity:0!important}@keyframes flash-beat{0%,to{opacity:0;transform:scale(1)}4%{opacity:var(--flash-opacity);transform:scale(1.02)}11%{opacity:0;transform:scale(1)}}.card{position:relative;z-index:60;width:min(100%,420px);padding:22px 20px 18px;border-radius:22px;background:#0c0a166b;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border:1px solid rgba(255,255,255,.12);box-shadow:0 0 var(--glow) hsla(var(--hue-base),var(--sat),50%,.28),0 18px 48px #00000059}.title-row{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:6px}h1{margin:0;font-size:clamp(1.35rem,4.5vw,1.55rem);font-weight:700;letter-spacing:-.02em}.badge{font-size:.68rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;padding:4px 8px;border-radius:999px;background:#ffffff1a;border:1px solid rgba(255,255,255,.14)}.sub{margin:0 0 18px;font-size:.88rem;opacity:.78;line-height:1.45}.search-row{display:flex;gap:10px}input[type=search]{flex:1;min-width:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:14px;border:1px solid rgba(255,255,255,.16);background:#00000047;color:inherit;font-size:1rem;padding:14px;outline:none}input[type=search]:focus{border-color:hsla(var(--hue-base),var(--sat),70%,.55);box-shadow:0 0 0 3px hsla(var(--hue-base),var(--sat),55%,.22)}.btn{touch-action:manipulation;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;border-radius:14px;font-weight:600;font-size:.95rem;padding:14px 18px;cursor:pointer;background:linear-gradient(135deg,hsl(var(--hue-base),var(--sat),52%),hsl(calc(var(--hue-base) + 35),var(--sat),44%));color:#0c0818;white-space:nowrap}.btn:active{transform:scale(.98)}.btn-ghost{background:#ffffff1a;color:#f4f2ff;border:1px solid rgba(255,255,255,.14)}.btn-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}.btn-small{padding:10px 14px;font-size:.82rem;border-radius:12px}.meta-strip{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 12px;margin-top:18px;padding-top:14px;border-top:1px solid rgba(255,255,255,.1);font-size:.78rem;opacity:.92}.meta-strip strong{font-variant-numeric:tabular-nums}.track-list{margin-top:14px;display:flex;flex-direction:column;gap:8px;max-height:min(42vh,320px);overflow-y:auto;-webkit-overflow-scrolling:touch}.track-item{touch-action:manipulation;text-align:left;width:100%;padding:12px 14px;border-radius:14px;border:1px solid rgba(255,255,255,.1);background:#00000038;color:inherit;cursor:pointer;font:inherit}.track-item:active{transform:scale(.99)}.track-item strong{display:block;font-size:.95rem}.track-item span{display:block;margin-top:4px;font-size:.8rem;opacity:.75}.hint{margin-top:14px;font-size:.78rem;line-height:1.5;opacity:.65}footer.setup{margin-top:16px;font-size:.76rem;opacity:.55;line-height:1.45}@media (prefers-reduced-motion: reduce){.bg-layer,.pulse-ring,.flash-veil{animation:none!important}.flash-veil{opacity:0!important}.shell.shell--playing:not(.shell--mute-bg) .bg-layer{animation:hue-drift calc(var(--beat-ms) * 32) ease-in-out infinite alternate!important}}.fx-row{display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px;margin-top:12px;padding-top:12px;border-top:1px solid rgba(255,255,255,.08);font-size:.8rem}.fx-row label{display:inline-flex;align-items:center;gap:8px;cursor:pointer;opacity:.92}.fx-row input[type=checkbox]{width:1.05rem;height:1.05rem;accent-color:hsl(var(--hue-base),var(--sat),58%)}.player-bar{display:none;align-items:center;justify-content:space-between;gap:12px;margin-top:14px;padding:10px 12px;border-radius:14px;background:#00000047;border:1px solid rgba(255,255,255,.1);font-size:.82rem}.player-bar.visible{display:flex}.player-bar span{opacity:.88;line-height:1.35;min-width:0}.player-bar .btn-tiny{flex-shrink:0;touch-action:manipulation;border-radius:12px;border:1px solid rgba(255,255,255,.18);background:#ffffff1f;color:inherit;font:inherit;font-weight:600;font-size:.8rem;padding:8px 12px;cursor:pointer}