#v-player.on{display:flex}
.deck{display:grid;grid-template-columns:minmax(300px,clamp(380px,28vw,500px)) minmax(280px,clamp(380px,27vw,480px));gap:clamp(28px,4vw,72px);align-items:center;justify-content:center;width:100%;margin:auto}
.card{position:relative;will-change:transform;display:grid;gap:16px;padding:22px;border-radius:30px;border:1px solid var(--line);background:linear-gradient(180deg,rgb(var(--accent-rgb)/.24),var(--panel) 64%);box-shadow:0 40px 100px -40px rgb(var(--accent-rgb)/.55);transition:transform .25s ease-out,padding .6s var(--ease),background .6s,box-shadow .6s}
.top{display:flex;align-items:center;justify-content:space-between}
.round{width:38px;height:38px;border-radius:50%;font-size:19px;color:var(--mute);background:rgb(0 0 0/.3);transition:all .3s var(--ease)}
.round:hover{color:#fff;transform:scale(1.12) rotate(-6deg)}
.sleeve{position:relative;width:clamp(150px,calc(100dvh - 470px),100%);justify-self:center;aspect-ratio:1;margin-top:clamp(40px,7dvh,66px);perspective:900px}
.tilt{position:absolute;inset:0;transition:transform .45s var(--ease)}
.art{position:absolute;inset:0;border-radius:22px;z-index:1;background:var(--cover,linear-gradient(135deg,var(--accent-lo),#0b0b0b));display:grid;place-items:center;font-size:84px;color:rgb(255 255 255/.18);box-shadow:0 30px 70px -20px rgb(var(--accent-rgb)/.6),0 0 0 1px rgb(255 255 255/.06);overflow:hidden}
.art::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 35%,rgb(255 255 255/.14) 48%,transparent 60%);transform:translateX(-120%);animation:sheen 5s var(--ease) infinite}
@keyframes sheen{60%,100%{transform:translateX(120%)}}
.art .mark{width:46%;height:auto;opacity:.92;transition:opacity .4s}
.has-track .art .mark{opacity:0}
.disc{position:absolute;inset:0 6%;transition:transform 1s var(--ease)}
.playing .disc{transform:translateY(-15%)}
.vinyl{position:absolute;inset:0;border-radius:50%;background:repeating-radial-gradient(circle,#121212 0 2px,#080808 2px 4px);box-shadow:0 0 0 1px #222,0 0 calc(24px + var(--pulse,0)*80px) rgb(var(--accent-rgb)/.45)}
.vinyl::before{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 20deg,transparent 0 20%,rgb(255 255 255/.08) 25%,transparent 32% 70%,rgb(255 255 255/.06) 76%,transparent 84%)}
.label{position:absolute;inset:34%;border-radius:50%;background:var(--cover,linear-gradient(135deg,var(--accent),#0b0b0b));display:grid;place-items:center}
.label::after{content:"";width:12%;aspect-ratio:1;border-radius:50%;background:var(--ink)}
.info{display:grid;gap:2px;min-width:0}
.side{display:grid;gap:18px;min-width:0}
#fxBtn{display:none}
.tbtns{display:flex;gap:10px}
.artist{color:var(--mute);margin-top:-4px}
.seek{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;font:12px 'DM Mono',monospace;color:var(--mute)}
.ctrl{display:flex;align-items:center;justify-content:space-between}
.ctrl button{width:46px;height:46px;border-radius:50%;font-size:22px;color:var(--mute);transition:color .2s,background .2s}
.ctrl button:hover{color:#fff;background:#181818}
.ctrl button.on{color:var(--accent-hi)}
.ctrl .big{width:72px;height:72px;font-size:32px;background:var(--accent);color:#fff;margin:0 6px;box-shadow:0 12px 40px rgb(var(--accent-rgb)/.45)}
.ctrl .big:hover{background:var(--accent-hi)}
.fx{border:1px solid var(--line);background:var(--panel);border-radius:20px;padding:20px;display:grid;gap:16px}
.fx h2{font:500 12px 'DM Mono',monospace;letter-spacing:.14em;text-transform:uppercase;display:flex;gap:8px;align-items:center;color:var(--mute)}
.knob{display:grid;grid-template-columns:78px 1fr 52px;gap:12px;align-items:center;font-size:13px}
.knob output{font:12px 'DM Mono',monospace;color:var(--accent-hi);text-align:right}
.quick{display:flex;gap:8px;flex-wrap:wrap}
.foot{font:12px 'DM Mono',monospace;color:#5a5d68}
.foot b{color:var(--accent-hi);font-weight:500}
.kicker{font:500 12px 'DM Mono',monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-hi);display:flex;align-items:center;gap:10px}
.kicker::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--mute)}
.playing .kicker::before{background:var(--accent-hi);animation:blink 1s infinite}
@keyframes blink{50%{opacity:.2}}