body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;margin:0;padding:0;background-color:#000;color:#fff;overflow:hidden;height:100vh;width:100vw}#canvas-container{position:fixed;top:0;left:0;width:100%;height:100%;z-index:1}#container{position:absolute;top:0;width:100%;padding:20px;box-sizing:border-box;z-index:10;background:linear-gradient(180deg,rgba(0,0,0,.8) 0,rgba(0,0,0,.5) 50%,transparent);text-align:center}h1{margin:0 0 10px;font-size:28px;text-shadow:0 0 10px rgba(51,153,255,.8)}button,h1{color:#fff}button{padding:10px 20px;margin:5px;background:linear-gradient(45deg,#3498db,#9b59b6);border:none;border-radius:30px;cursor:pointer;font-weight:700;transition:all .2s ease;box-shadow:0 4px 15px rgba(0,0,0,.3)}button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,0,0,.4)}button:active:not(:disabled){transform:translateY(1px);box-shadow:0 2px 10px rgba(0,0,0,.2)}button:disabled{background:linear-gradient(45deg,#95a5a6,#7f8c8d);cursor:not-allowed;opacity:.7}#controls{display:flex;justify-content:center;flex-wrap:wrap;gap:10px}#status{margin:10px 0;padding:10px;background-color:rgba(0,0,0,.5);border-radius:20px;display:inline-block;font-size:14px;color:#ccc}#media{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);max-width:400px;border-radius:10px;overflow:hidden;background:rgba(0,0,0,.6);box-shadow:0 0 20px rgba(51,153,255,.3);z-index:100;transition:opacity .3s ease;opacity:.7}#media:hover{opacity:1}.song-selector-container{margin:10px 0;text-align:center}.song-selector-container label{margin-right:10px;color:#fff;font-weight:700}.song-select{padding:8px 15px;border-radius:20px;background:rgba(0,0,0,.6);color:#fff;border:2px solid #3498db;font-size:14px;min-width:250px;cursor:pointer;outline:none;transition:all .3s ease;box-shadow:0 0 10px rgba(52,152,219,.3)}.song-select:hover{border-color:#9b59b6;box-shadow:0 0 15px rgba(155,89,182,.5)}.song-select:focus{border-color:#e74c3c;box-shadow:0 0 15px rgba(231,76,60,.5)}.song-select option{background-color:#222;color:#fff;padding:8px}.song-info{margin-top:5px;font-size:14px;color:#ccc;max-width:350px;margin-left:auto;margin-right:auto;padding:5px}.song-info p{margin:3px 0}.song-info strong{color:#e67e22}.song-info em{color:#3498db;font-style:italic}.cors-note{margin-top:8px;color:#95a5a6;font-size:11px}.instructions-panel{position:fixed;bottom:20px;right:20px;background:rgba(0,0,0,.7);border:2px solid #3498db;border-radius:10px;padding:15px;color:#fff;max-width:300px;box-shadow:0 0 20px rgba(52,152,219,.5);z-index:100;transition:all .3s ease}.instructions-panel.hidden{opacity:0;visibility:hidden;transform:translateY(20px)}.instructions-content h2{margin-top:0;color:#3498db;font-size:18px}.instructions-content p{font-size:14px;line-height:1.4}.close-instructions{position:absolute;top:5px;right:5px;background:none;border:none;color:#fff;font-size:20px;cursor:pointer;padding:0;width:25px;height:25px;line-height:25px;text-align:center;border-radius:50%}.close-instructions:hover{background:hsla(0,0%,100%,.2)}.effect-button{padding:10px 20px;margin:5px;background:linear-gradient(45deg,#f0a,#a0f);color:#fff;border:none;border-radius:30px;cursor:pointer;font-weight:700;transition:all .2s ease;box-shadow:0 4px 15px rgba(255,0,170,.3);position:relative;overflow:hidden}.effect-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 20px rgba(255,0,170,.4)}.effect-button:active:not(:disabled){transform:translateY(1px);box-shadow:0 2px 10px rgba(255,0,170,.2)}.effect-button:disabled{background:linear-gradient(45deg,#f0a,#a0f);opacity:.7;cursor:not-allowed}@keyframes glitch-anim{0%{clip-path:inset(80% 0 0 0);transform:translate(-2px,2px)}10%{clip-path:inset(10% 0 60% 0);transform:translate(2px,-2px)}20%{clip-path:inset(30% 0 30% 0);transform:translate(-2px,2px)}30%{clip-path:inset(10% 0 70% 0);transform:translate(2px,-2px)}40%{clip-path:inset(50% 0 10% 0);transform:translate(-2px,2px)}50%{clip-path:inset(0 0 90% 0);transform:translate(2px,-2px)}60%{clip-path:inset(80% 0 0 0);transform:translate(-2px,2px)}70%{clip-path:inset(20% 0 50% 0);transform:translate(2px,-2px)}80%{clip-path:inset(40% 0 30% 0);transform:translate(-2px,2px)}90%{clip-path:inset(5% 0 75% 0);transform:translate(2px,-2px)}to{clip-path:inset(60% 0 10% 0);transform:translate(-2px,2px)}}.effect-button[data-cooldown=true]:before{content:"Activate Glitch (5s)";position:absolute;left:0;top:0;width:100%;height:100%;background:linear-gradient(45deg,#0fa,#0af);display:flex;align-items:center;justify-content:center;animation:glitch-anim .3s linear infinite alternate-reverse;mix-blend-mode:difference}.seekbar-container{position:fixed;bottom:75px;left:0;width:100%;padding:0 20px;box-sizing:border-box;z-index:100;display:flex;flex-direction:column;align-items:center}.seekbar-background{position:relative;width:100%;max-width:1000px;height:10px;background:rgba(50,50,50,.6);border-radius:5px;cursor:pointer;overflow:hidden;box-shadow:0 0 10px rgba(0,0,0,.3);transition:height .2s ease}.seekbar-background.active{height:14px}.seekbar-fill{position:absolute;top:0;left:0;width:0;height:100%;background:linear-gradient(90deg,#0fc,#3498db);border-radius:5px;box-shadow:0 0 8px rgba(0,255,204,.5)}.seekbar-handle{position:absolute;top:50%;left:0;width:16px;height:16px;background:#fff;border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 5px rgba(0,0,0,.5);pointer-events:none;opacity:0;transition:opacity .2s ease}.seekbar-background.active .seekbar-handle,.seekbar-background:hover .seekbar-handle{opacity:1}.seekbar-time{margin-top:5px;font-size:14px;color:#fff;text-shadow:0 0 3px rgba(0,0,0,.8)}@media (max-width:768px){.seekbar-container{bottom:60px;padding:0 10px}.seekbar-background{height:8px}.seekbar-background.active{height:12px}.seekbar-time{font-size:12px}}@keyframes pulse-glow{0%{box-shadow:0 0 5px rgba(0,255,204,.3)}50%{box-shadow:0 0 10px rgba(0,255,204,.6)}to{box-shadow:0 0 5px rgba(0,255,204,.3)}}.seekbar-fill{animation:pulse-glow 2s infinite}
/*# sourceMappingURL=/style.37874abc.css.map */