:root{--pink:#ff2e88;--lime:#b6ff3b;--ink:#0b0612;--glass:rgba(255,255,255,.06)}
body{margin:0;font-family:'JetBrains Mono',monospace;color:#f3e9ff;background:
radial-gradient(circle at 15% 10%,rgba(255,46,136,.25),transparent 40%),
radial-gradient(circle at 85% 30%,rgba(182,255,59,.12),transparent 40%),
repeating-linear-gradient(90deg,rgba(255,255,255,.02) 0 1px,transparent 1px 40px),
linear-gradient(180deg,#140820,#07040c);min-height:100vh;background-attachment:fixed}
.disp{font-family:'Bungee',cursive}
.glass{background:var(--glass);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);border-radius:1rem}
.pink{color:var(--pink)}.lime{color:var(--lime)}
.btn{border-radius:999px;padding:.5rem 1rem;font-weight:800;transition:transform .15s,box-shadow .2s}
.btn:hover{transform:scale(1.05)}
.btn-pink{background:var(--pink);color:#fff;box-shadow:0 0 20px rgba(255,46,136,.5)}
.btn-lime{background:var(--lime);color:#111;box-shadow:0 0 20px rgba(182,255,59,.4)}
.btn-ghost{border:1px solid rgba(255,255,255,.2)}
.vinyl{width:44px;height:44px;border-radius:50%;background:repeating-radial-gradient(#111 0 2px,#222 2px 4px);position:relative;animation:spin 3s linear infinite}
.vinyl:after{content:'';position:absolute;inset:15px;border-radius:50%;background:var(--pink)}
.logo:hover .vinyl{background:radial-gradient(circle at 50% 60%,#ff2e88,#a0003f);animation-duration:.6s}
@keyframes spin{to{transform:rotate(360deg)}}
.drop{border:2px dashed var(--lime);border-radius:1rem;transition:all .2s}
.drop.over{border-color:var(--pink);animation:wob .4s infinite alternate;background:rgba(255,46,136,.08)}
@keyframes wob{from{transform:rotate(-1deg)}to{transform:rotate(1deg)}}
.rise{animation:rise .5s both}
@keyframes rise{from{opacity:0;transform:translateY(16px)}}
input[type=range]{accent-color:var(--pink);width:100%}
.conf{position:fixed;top:-10px;width:8px;height:14px;animation:fall 2.5s linear forwards;z-index:50}
@keyframes fall{to{transform:translateY(105vh) rotate(720deg)}}