@import"https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap";:root{--bg-color: #0f0f0f;--primary-color: #ff00ff;--accent-color: #00ffff;--text-color: #f5f5f5;--neon-glow: 0 0 5px #fff, 0 0 10px #f0f, 0 0 20px #f0f, 0 0 40px #f0f;--font-family: "Orbitron", "Segoe UI", sans-serif}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-family);background-color:var(--bg-color);color:var(--text-color);line-height:1.6;overflow-x:hidden}h1,h2,h3{font-weight:600;letter-spacing:.05em}a{color:var(--accent-color);text-decoration:none;transition:color .3s ease}a:hover{color:var(--primary-color)}.neon-text{color:var(--primary-color);text-shadow:var(--neon-glow);font-size:3rem;text-align:center;margin-top:1rem}.main-container{max-width:1100px;margin:0 auto;padding:2rem 1rem}.section-heading{font-size:2rem;text-align:center;margin-bottom:1.5rem;color:var(--accent-color);text-shadow:0 0 5px #00ffff}.background-logo{position:fixed;top:0;left:0;width:100%;opacity:.03;z-index:-1;pointer-events:none;-webkit-user-select:none;user-select:none}button{padding:.75em 1.5em;font-size:1rem;font-family:inherit;background:var(--primary-color);color:#000;border:none;border-radius:6px;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease}button:hover{transform:translateY(-2px);box-shadow:0 0 10px var(--primary-color)}input[type=text],input[type=file],input[type=number],select{background:#1c1c1c;color:var(--text-color);border:1px solid #333;padding:.5rem;border-radius:4px;font-family:inherit;width:100%;transition:border-color .3s ease,box-shadow .3s ease}input[type=text]:focus,input[type=file]:focus,input[type=number]:focus,select:focus{outline:none;border-color:var(--accent-color);box-shadow:0 0 5px var(--accent-color)}select{cursor:pointer}.input-group{margin-bottom:1rem}.input-group label{display:block;margin-bottom:.5rem;color:var(--accent-color);font-weight:500}.input-group small{display:block;margin-top:.25rem;color:#888;font-size:.875rem}.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1rem;margin-bottom:1.5rem}.form-actions{display:flex;gap:1rem;justify-content:flex-end;align-items:center}.btn-primary{background:var(--primary-color);color:#000}.btn-secondary{background:#333;color:var(--text-color)}.btn-secondary:hover{background:#444;box-shadow:0 0 10px #444}.metadata-form{background:#1a1a1a;border:1px solid #333;border-radius:8px;padding:1.5rem;margin:1.5rem 0;box-shadow:0 4px 6px #0000004d}.metadata-form h3{color:var(--accent-color);margin-bottom:.5rem;font-size:1.5rem}.metadata-form p{color:#ccc;margin-bottom:1.5rem;font-size:.95rem}.youtube-box{background:#1a1a1a;border:1px solid #333;border-radius:8px;padding:1.5rem;margin-bottom:1.5rem;box-shadow:0 4px 6px #0000004d}.youtube-box form{display:flex;flex-direction:column;gap:1rem}.youtube-box button{align-self:center;margin-top:.5rem}.upload-box{background:#1a1a1a;border:1px solid #333;border-radius:8px;padding:1.5rem;margin-bottom:1.5rem;box-shadow:0 4px 6px #0000004d}.logs{background:#1a1a1a;border:1px solid #333;border-radius:8px;padding:1rem;margin-top:1rem}.logs pre{color:var(--text-color);font-family:Courier New,monospace;white-space:pre-wrap;word-wrap:break-word}.spinner{display:inline-block;width:16px;height:16px;border:2px solid var(--accent-color);border-radius:50%;border-top-color:transparent;animation:spin 1s ease-in-out infinite;margin-left:.5rem}.footer{background:#111;padding:2rem;color:#aaa;text-align:center;font-size:.9rem;border-top:1px solid #333}.footer a{color:var(--accent-color);text-decoration:underline}.footer a:hover{color:var(--primary-color)}@media (max-width: 768px){.main-container{padding:1rem}.neon-text{font-size:2rem}button{width:100%;padding:1em}}.metadata-form-container{max-width:800px;margin:0 auto;padding:20px;background:#fff;border-radius:12px;box-shadow:0 4px 20px #0000001a}.metadata-form{width:100%}.metadata-form h2{color:#333;margin-bottom:10px;font-size:24px;text-align:center}.metadata-description{color:#666;text-align:center;margin-bottom:30px;font-size:16px;line-height:1.5}.form-section{margin-bottom:30px;padding:20px;background:#f8f9fa;border-radius:8px;border-left:4px solid #007bff}.form-section h3{color:#333;margin-bottom:20px;font-size:18px;font-weight:600}.form-group{margin-bottom:20px}.form-group label{display:block;margin-bottom:8px;font-weight:600;color:#333;font-size:14px}.form-group input,.form-group select,.form-group textarea{width:100%;padding:12px 16px;border:2px solid #e1e5e9;border-radius:6px;font-size:16px;transition:border-color .3s ease;background:#fff}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:#007bff;box-shadow:0 0 0 3px #007bff1a}.form-group textarea{resize:vertical;min-height:80px}.file-info{background:#e9ecef;padding:15px;border-radius:6px;font-size:14px}.file-info p{margin:8px 0;color:#495057}.file-info strong{color:#333}.form-actions{display:flex;gap:15px;justify-content:flex-end;margin-top:30px;padding-top:20px;border-top:1px solid #e1e5e9}.cancel-button,.confirm-button{padding:12px 24px;border:none;border-radius:6px;font-size:16px;font-weight:600;cursor:pointer;transition:all .3s ease;min-width:120px}.cancel-button{background:#6c757d;color:#fff}.cancel-button:hover:not(:disabled){background:#5a6268;transform:translateY(-1px)}.confirm-button{background:#007bff;color:#fff}.confirm-button:hover:not(:disabled){background:#0056b3;transform:translateY(-1px)}.cancel-button:disabled,.confirm-button:disabled{opacity:.6;cursor:not-allowed;transform:none}.metadata-loading,.metadata-error{text-align:center;padding:40px 20px}.loading-spinner{width:40px;height:40px;border:4px solid #f3f3f3;border-top:4px solid #007bff;border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 20px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.metadata-error p{color:#dc3545;font-size:16px;margin-bottom:20px}.retry-button{background:#dc3545;color:#fff;border:none;padding:10px 20px;border-radius:6px;cursor:pointer;font-size:14px;font-weight:600}.retry-button:hover{background:#c82333}@media (max-width: 768px){.metadata-form-container{margin:10px;padding:15px}.form-section{padding:15px}.form-actions{flex-direction:column}.cancel-button,.confirm-button{width:100%}}.upload-form{max-width:1600px;width:100%;margin:.5rem auto;padding:.5rem;background-color:#021223;border:none;border-radius:12px;box-shadow:0 0 12px #2edfff80}.section-heading{font-size:1.25rem;color:#ff2e63;text-shadow:0 0 5px #FF2E63,0 0 10px #2EDFFF;margin-bottom:2rem}.youtube-box,.upload-box{margin-bottom:1rem;padding:1rem;background-color:#001c33;border-radius:8px;border:none;width:100%}input[type=text],input[type=file]{width:100%;max-width:none;padding:.75rem;margin-bottom:1rem;border:2px solid #00ffff;border-radius:6px;font-family:inherit;background-color:#001c33;color:#0ff;font-size:.9rem;transition:border-color .3s ease}input[type=text]:focus,input[type=file]:focus{border-color:#ff2e63;outline:none}button{font-family:"Press Start 2P",cursive;padding:.75rem 1.5rem;background-color:#ff2e63;color:#fff;border:none;border-radius:5px;font-size:.8rem;cursor:pointer;box-shadow:0 0 8px #ff2e63;transition:background-color .3s,transform .2s ease}.logs{margin-top:.5rem;font-size:.8rem;color:#0ff;background-color:#000a1a;padding:.5rem 1rem;border-radius:6px;border:1px dashed #2EDFFF;white-space:pre-wrap}.upload-progress{margin-top:1rem;padding:1rem;background-color:#001c33;border-radius:8px;border:1px solid #2EDFFF}.progress-bar{width:100%;height:8px;background-color:#000a1a;border-radius:4px;overflow:hidden;margin-bottom:.5rem}.progress-fill{height:100%;background:linear-gradient(90deg,#ff2e63,#2edfff);border-radius:4px;animation:progress-animation 2s ease-in-out infinite;width:100%}@keyframes progress-animation{0%{transform:translate(-100%)}50%{transform:translate(0)}to{transform:translate(100%)}}.progress-status{text-align:center;color:#0ff;font-size:.9rem;font-weight:500}#output-container{margin-top:2rem;padding-top:1rem;border-top:1px solid #2EDFFF}#output-container h3{color:#0ff;margin-bottom:1rem}.spinner{display:inline-block;width:16px;height:16px;margin-left:8px;border:2px solid #00ffff;border-top-color:transparent;border-radius:50%;animation:spin .8s linear infinite;vertical-align:middle}@keyframes spin{to{transform:rotate(360deg)}}.drag-drop-zone{border:2px dashed #2EDFFF;border-radius:12px;padding:1.5rem;text-align:center;background-color:#001c33;transition:all .3s ease;margin-bottom:1rem;min-height:120px;display:flex;align-items:center;justify-content:center;width:100%;margin-left:auto;margin-right:auto}.drag-drop-zone.drag-over{border-color:#ff2e63;background-color:#024;transform:scale(1.02);box-shadow:0 0 20px #ff2e634d}.drag-drop-zone.uploading{border-color:#2edfff;background-color:#001c33;box-shadow:0 0 20px #2edfff4d}.drag-drop-icon.uploading{color:#2edfff;animation:pulse 1.5s ease-in-out infinite}.drag-drop-icon.success{color:#0f8;animation:success-pulse .5s ease-in-out}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes success-pulse{0%{transform:scale(1)}50%{transform:scale(1.2)}to{transform:scale(1)}}.drag-drop-content{display:flex;flex-direction:column;align-items:center;gap:.5rem}.drag-drop-icon{font-size:3rem;margin-bottom:1rem}.drag-drop-zone h3{color:#0ff;margin:0;font-size:1.1rem}.drag-drop-zone p{color:#888;margin:.5rem 0;font-size:.9rem}.file-input-label{display:inline-block;padding:.75rem 1.5rem;background-color:#ff2e63;color:#fff;border-radius:6px;cursor:pointer;font-family:"Press Start 2P",cursive;font-size:.8rem;transition:background-color .3s,transform .2s ease;margin:1rem 0}.file-input-label:hover{background-color:#ff5c8a;transform:scale(1.05)}.file-types{font-size:.8rem;color:#666;margin-top:.5rem}.upload-progress-mini{margin:1rem 0;width:100%}.progress-bar-mini{width:100%;height:4px;background-color:#000a1a;border-radius:2px;overflow:hidden}.progress-fill-mini{height:100%;background:linear-gradient(90deg,#2edfff,#ff2e63);border-radius:2px;animation:progress-animation 1.5s ease-in-out infinite;width:100%}.upload-status{font-size:.9rem;color:#0ff;margin-top:.5rem;text-align:center;font-weight:500}.selected-files{background-color:#001c33;border:1px solid #2EDFFF;border-radius:8px;padding:1.5rem;margin:1.5rem 0;width:100%}.selected-files h4{color:#0ff;margin:0 0 .5rem;font-size:1rem}.selected-files p{color:#fff;margin:.25rem 0;font-size:.9rem}.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(350px,1fr));gap:1.5rem;margin-bottom:2rem;width:100%}.form-actions{display:flex;gap:1.5rem;justify-content:center;margin-top:1.5rem;width:100%}.btn-secondary{background-color:#666;box-shadow:0 0 8px #666}.btn-secondary:hover{background-color:#888}.upload-box h3{color:#0ff;margin-bottom:1rem;font-size:1.1rem;text-align:center}.metadata-form{width:100%;padding:1rem;background-color:#001c33;border-radius:8px;border:1px solid #2EDFFF;margin-bottom:1rem}@media (max-width: 768px){.upload-form{width:100%;padding:.25rem}.form-grid{grid-template-columns:1fr;gap:.75rem}.youtube-box,.upload-box,.metadata-form{padding:.75rem}.drag-drop-zone{padding:1rem;min-height:100px}}.main-container{max-width:none!important;margin:0!important;padding:0!important}.karaoke-container{display:flex;flex-direction:column;min-height:100vh;background-color:#000;overflow:visible;color:#fff;position:relative;width:100%;margin:0;padding:0;border:none}.karaoke-grid{flex:1;display:flex;flex-direction:column;width:100%;min-height:100vh;overflow:visible;background-color:#000;border-radius:12px;margin:0;padding:0}.lyrics-area{width:100%;max-width:100%;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;padding:2rem;text-align:center;overflow-y:auto;overflow-x:hidden;flex:1;scroll-behavior:auto;margin:0;background-color:#000000e6;border-radius:12px;border:2px solid rgba(255,255,255,.1);position:relative;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.3) transparent;will-change:scroll-position;transform:translateZ(0);height:calc(100vh - 200px);min-height:calc(100vh - 200px);max-height:calc(100vh - 200px)}.lyrics-area::-webkit-scrollbar{width:8px}.lyrics-area::-webkit-scrollbar-track{background:transparent}.lyrics-area::-webkit-scrollbar-thumb{background:#ffffff4d;border-radius:4px}.lyrics-area::-webkit-scrollbar-thumb:hover{background:#ffffff80}.lyrics-area.fullscreen{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:9999;border-radius:0;border:none;padding:2rem;background-color:#000000f2;overflow-y:auto!important;overflow-x:hidden!important;display:flex!important;flex-direction:column!important;justify-content:flex-start!important;align-items:center!important;min-height:100vh!important;max-height:100vh!important;box-sizing:border-box!important}.lyrics-area.fullscreen .lyrics-line{display:block!important;visibility:visible!important;opacity:1!important;color:#fff!important;background:transparent!important;width:100%!important;max-width:100%!important;text-align:center!important;padding:0 2rem!important}.lyrics-area.fullscreen .lyrics-segment{display:block!important;visibility:visible!important;opacity:1!important;color:#fff!important;background:transparent!important;width:100%!important;max-width:100%!important;text-align:center!important;margin:0 auto!important}.lyrics-area.fullscreen .word{display:inline-block!important;visibility:visible!important;opacity:1!important;color:#fff!important;background:transparent!important}.lyrics-area.fullscreen .fullscreen-controls{position:fixed!important;top:20px!important;right:20px!important;z-index:999999!important;background:#000000e6!important;border:2px solid white!important;border-radius:8px!important;padding:10px 15px!important;transform:none!important;transition:none!important;pointer-events:auto!important;user-select:none!important;-webkit-user-select:none!important;-moz-user-select:none!important;-ms-user-select:none!important;left:auto!important;bottom:auto!important;margin:0!important;width:auto!important;height:auto!important}.lyrics-area.fullscreen .fullscreen-controls button{background:#000000e6!important;color:#fff!important;border:1px solid white!important;border-radius:6px!important;padding:8px 12px!important;cursor:pointer!important;font-size:14px!important;font-weight:700!important;z-index:999999!important;position:relative!important;pointer-events:auto!important;display:block!important;visibility:visible!important;opacity:1!important}.lyrics-area.fullscreen .fullscreen-controls button:hover{background:#ffffff1a!important;transform:scale(1.05)!important;transition:all .2s ease!important}.lyrics-area.fullscreen~*,.lyrics-area.fullscreen+*,.lyrics-area.fullscreen~footer,.lyrics-area.fullscreen~.karaoke-footer,.lyrics-area.fullscreen~.karaoke-controls,.lyrics-area.fullscreen~.karaoke-pun,body:has(.lyrics-area.fullscreen) footer,body:has(.lyrics-area.fullscreen) .karaoke-footer,body:has(.lyrics-area.fullscreen) .karaoke-controls,body:has(.lyrics-area.fullscreen) .karaoke-pun{display:none!important;visibility:hidden!important;opacity:0!important;height:0!important;overflow:hidden!important}body:has(.lyrics-area.fullscreen){overflow:hidden!important}.lyrics-area.fullscreen~.karaoke-controls,.lyrics-area.fullscreen~.karaoke-pun,.lyrics-area.fullscreen~footer,.lyrics-area.fullscreen~.karaoke-footer,body:has(.lyrics-area.fullscreen) .karaoke-controls,body:has(.lyrics-area.fullscreen) .karaoke-pun,body:has(.lyrics-area.fullscreen) footer,body:has(.lyrics-area.fullscreen) .karaoke-footer{display:none!important;visibility:hidden!important;opacity:0!important;height:0!important;overflow:hidden!important;position:absolute!important;left:-9999px!important;top:-9999px!important}.lyrics-line{font-size:24px;line-height:1.8;color:#fff;text-shadow:2px 2px 4px rgba(0,0,0,.8);padding:2rem;word-wrap:break-word;-webkit-hyphens:auto;hyphens:auto;text-align:left;letter-spacing:.5px;will-change:transform;transform:translateZ(0);transition:opacity .3s ease;width:100%;min-height:0;max-height:none;height:auto}.lyrics-segment{padding:15px 0;margin-bottom:30px;border-radius:8px;transition:all .3s ease;position:relative;will-change:opacity,transform;transform:translateZ(0)}.lyrics-segment.current{opacity:1;transform:scale(1.02);background:#ff40811a;border-left:3px solid #ff4081;padding-left:10px;border-radius:4px;box-shadow:0 0 20px #ff40814d}.lyrics-segment[data-verse-break=true]{margin-top:40px;padding-top:20px;border-top:2px solid rgba(255,255,255,.2)}.verse-break-indicator{text-align:center;margin-bottom:20px;color:#fff9;font-size:14px;font-style:italic;animation:fadeInOut 2s ease-in-out infinite}@keyframes fadeInOut{0%,to{opacity:.8}50%{opacity:1}}@keyframes highlightPulse{0%{text-shadow:0 0 15px rgba(255,20,147,1),0 0 25px rgba(255,20,147,.9),0 0 35px rgba(255,20,147,.7),2px 2px 4px rgba(0,0,0,1);box-shadow:0 0 10px #ff149399,inset 0 0 10px #fff3;transform:scale(1.05)}50%{text-shadow:0 0 20px rgba(255,20,147,1),0 0 30px rgba(255,20,147,.9),0 0 40px rgba(255,20,147,.8),2px 2px 4px rgba(0,0,0,1);box-shadow:0 0 15px #ff1493cc,inset 0 0 15px #ffffff4d;transform:scale(1.1)}to{text-shadow:0 0 15px rgba(255,20,147,1),0 0 25px rgba(255,20,147,.9),0 0 35px rgba(255,20,147,.7),2px 2px 4px rgba(0,0,0,1);box-shadow:0 0 10px #ff149399,inset 0 0 10px #fff3;transform:scale(1.05)}}@keyframes smoothHighlight{0%{transform:scale(1);opacity:.8;text-shadow:2px 2px 4px rgba(0,0,0,.8)}50%{transform:scale(1.05);opacity:1;text-shadow:0 0 15px rgba(255,20,147,.8),2px 2px 4px rgba(0,0,0,1)}to{transform:scale(1.1);opacity:1;text-shadow:0 0 20px rgba(255,20,147,1),0 0 30px rgba(255,20,147,.9),2px 2px 4px rgba(0,0,0,1)}}.word{opacity:.8;padding-right:12px;font-size:24px;transition:all .2s cubic-bezier(.4,0,.2,1);display:inline-block;vertical-align:top;word-break:keep-all;white-space:nowrap;text-shadow:2px 2px 4px rgba(0,0,0,.8);position:relative;will-change:transform,opacity,text-shadow;transform:translateZ(0)}.word-transition{transition:all .2s cubic-bezier(.4,0,.2,1)}.word-highlight{animation:smoothHighlight .3s ease-out forwards}.word.highlight{opacity:1;color:#ff1493;text-shadow:0 0 15px rgba(255,20,147,1),0 0 25px rgba(255,20,147,.9),0 0 35px rgba(255,20,147,.7),2px 2px 4px rgba(0,0,0,1);font-weight:700;transform:scale(1.1);transition:all .2s cubic-bezier(.4,0,.2,1);background:linear-gradient(45deg,#ff1493,#ff69b4);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:highlightPulse .8s ease-in-out infinite alternate;border-radius:4px;padding:2px 4px;margin:0 2px;box-shadow:0 0 10px #ff149399,inset 0 0 10px #fff3;-webkit-text-stroke:.5px rgba(255,255,255,.8);text-stroke:.5px rgba(255,255,255,.8);position:relative;z-index:1}.word.highlight:before{content:"";position:absolute;top:-2px;left:-2px;right:-2px;bottom:-2px;background:radial-gradient(circle,rgba(255,20,147,.3) 0%,transparent 70%);border-radius:6px;z-index:-1;animation:glowPulse 1s ease-in-out infinite alternate}@keyframes glowPulse{0%{opacity:.5;transform:scale(1)}to{opacity:1;transform:scale(1.1)}}.word.singer-lady-gaga{color:#ff69b4}.word.singer-ariana-grande{color:#87ceeb}.word[class*=singer-]{color:gold}.play-button{font-size:1rem;padding:.3rem 1rem;background-color:#ff4081;border:none;color:#fff;border-radius:12px;cursor:pointer;font-weight:700;text-shadow:0 0 10px #ff4081;box-shadow:0 0 20px #ff408180;transition:all .3s ease;width:100%;box-sizing:border-box;margin:.5rem 0;flex-shrink:0}.play-button:hover{transform:scale(1.05);box-shadow:0 0 30px #ff4081cc}.play-toggle-button{margin-top:1rem;padding:.5rem 1rem;font-size:1.1rem;background-color:#ff4081;color:#fff;border:none;border-radius:8px;cursor:pointer}.karaoke-controls{width:100%;margin:1rem 0;background:#000000e6;padding:1.5rem;border-radius:12px;display:flex;flex-direction:column;gap:1rem;border:2px solid rgba(255,255,255,.2);min-height:140px;flex-shrink:0;position:relative;bottom:auto;left:auto;right:auto;z-index:10;box-shadow:0 4px 20px #000c}.time-control-header{text-align:center;margin-bottom:.5rem}.time-control-header h3{color:#7fdbff;font-size:.9rem;font-weight:700;margin:0;text-shadow:0 0 8px rgba(127,219,255,.6)}.karaoke-controls input[type=range]{width:100%}.karaoke-controls label{color:#7fdbff;font-size:.9rem;font-weight:700;margin-bottom:.2rem}.karaoke-controls span{color:#7fdbff;font-size:.8rem;text-align:center;margin-top:.2rem}.karaoke-pun{text-align:center;padding:1.5rem;background-color:#000000e6;color:#ccc;margin:1rem 0;border-radius:12px;border:2px solid rgba(255,255,255,.2);width:100%;flex-shrink:0;box-shadow:0 4px 20px #000c}.karaoke-pun p{margin:0;font-size:1rem;font-style:italic}.video-background{position:fixed;top:0;left:0;min-width:100%;min-height:100%;z-index:-1;object-fit:cover;pointer-events:none;filter:brightness(.4)}.karaoke-controls-top{display:flex;justify-content:center;width:100%;margin-bottom:1.5rem}.session-code-box{background:#001f3f;color:#7fdbff;border:2px dashed #7FDBFF;padding:8px;margin:.5rem 0;text-align:center;border-radius:8px;font-family:Courier New,monospace;box-shadow:0 0 12px #7fdbff55;text-shadow:0 0 4px #7FDBFF;width:100%;box-sizing:border-box;flex-shrink:0}@keyframes flicker{0%,to{opacity:1}45%{opacity:.8}55%{opacity:.6}60%{opacity:.9}70%{opacity:.7}}.session-code-box h2{animation:flicker 2.5s infinite;font-size:2.2rem;letter-spacing:2px;margin:.5rem 0 0;color:#7fdbff}.rating-fix-row{display:flex;align-items:center;gap:2rem;margin-top:1rem;width:100%;justify-content:space-between}.rating-system{display:flex;flex-direction:column;gap:.5rem;flex:0 0 50%;min-width:0}.rating-system label{font-size:14px;color:#7fdbff;font-weight:700;text-align:center;white-space:nowrap;margin-bottom:.5rem}.rating-buttons{display:flex;justify-content:center;gap:.3rem;flex-shrink:0;flex-wrap:wrap}.rating-button{background:#ffffff1a;border:2px solid rgba(255,255,255,.3);border-radius:8px;padding:4px;cursor:pointer;transition:all .3s ease;width:80px;height:80px;display:flex;align-items:center;justify-content:center;flex-shrink:0;position:relative}.rating-button:hover{background:#fff3;border-color:#ffffff80;transform:translateY(-2px)}.rating-button.selected{background:#7fdbff4d;border-color:#7fdbff;box-shadow:0 0 15px #7fdbff80;transform:scale(1.1)}.rating-button img{width:120%;height:120%;object-fit:contain;margin:-10%}.fallback-text{font-size:14px;display:none;text-align:center;line-height:1;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.fix-song-button{background:#ff4081;color:#fff;border:none;border-radius:8px;padding:12px 24px;cursor:pointer;font-size:16px;font-weight:700;transition:all .3s ease;width:50%;max-width:none;flex-shrink:0;white-space:nowrap;flex:0 0 50%}.fix-song-button:hover{background:#e91e63;transform:translateY(-2px);box-shadow:0 4px 15px #ff408166}.fix-song-button:active{transform:translateY(0)!important}.fix-song-container{min-height:100vh;background:linear-gradient(135deg,#000428,#004e92);color:#fff;padding:2rem;display:flex;flex-direction:column;gap:2rem}.fix-song-header{display:flex;justify-content:space-between;align-items:center;padding:1rem;background:#000c;border-radius:12px;border:2px solid rgba(255,255,255,.1)}.back-button{background:#ffffff1a;color:#fff;border:1px solid rgba(255,255,255,.3);border-radius:6px;padding:8px 16px;cursor:pointer;font-size:14px;transition:all .3s ease}.back-button:hover{background:#fff3;border-color:#ffffff80}.fix-song-header h1{margin:0;font-size:2rem;text-align:center;flex:1}.timeline-controls{display:flex;align-items:center;gap:1rem}.timeline-controls label{font-size:14px;color:#7fdbff}.timeline-controls input[type=range]{width:100px}.timeline-controls span{font-size:12px;color:#ccc;min-width:60px}.timeline-container{background:#000000e6;border-radius:12px;border:2px solid rgba(255,255,255,.1);padding:2rem;overflow-x:auto;overflow-y:hidden;position:relative;min-height:300px}.timeline{position:relative;height:250px;background:#ffffff0d;border-radius:8px;border:1px solid rgba(255,255,255,.2)}.timeline-markers{position:absolute;top:0;left:0;right:0;height:30px;border-bottom:1px solid rgba(255,255,255,.2)}.timeline-marker{position:absolute;top:0;width:1px;height:30px;background:#ffffff4d}.marker-time{position:absolute;top:35px;left:-15px;font-size:10px;color:#ccc;white-space:nowrap}.current-time-indicator{position:absolute;top:30px;width:2px;height:220px;background:#ff4081;z-index:10;box-shadow:0 0 10px #ff4081cc}.timeline-lyric{position:absolute;top:50px;height:60px;background:#7fdbff1a;border:1px solid rgba(127,219,255,.3);border-radius:6px;padding:6px;cursor:grab;transition:all .2s ease;overflow:hidden;min-width:40px}.timeline-lyric:hover{background:#7fdbff33;border-color:#7fdbff80;transform:translateY(-2px)}.timeline-lyric.current{background:#ff408133;border-color:#ff408199;box-shadow:0 0 15px #ff408166}.timeline-lyric.dragging{cursor:grabbing;background:#ffc10733;border-color:#ffc10799;z-index:100;transform:scale(1.05)}.lyric-text{font-size:10px;line-height:1.2;margin-bottom:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#fff;font-weight:700}.lyric-time{font-size:8px;color:#ccc;text-align:center;margin-bottom:2px}.confidence-indicator{font-size:7px;color:#ff9800;text-align:center;background:#ff98001a;border-radius:3px;padding:1px 3px;border:1px solid rgba(255,152,0,.3)}.audio-controls{display:flex;flex-direction:column;gap:1.5rem;padding:1.5rem;background:#000c;border-radius:12px;border:2px solid rgba(255,255,255,.1)}.play-button{background:#ff4081;color:#fff;border:none;border-radius:8px;padding:12px 24px;cursor:pointer;font-size:16px;font-weight:700;transition:all .3s ease;width:100%}.play-button:hover{background:#e91e63;transform:translateY(-2px);box-shadow:0 4px 15px #ff408166}.seek-control,.vocals-control{display:flex;flex-direction:column;gap:.5rem;width:100%}.seek-control label,.vocals-control label{font-size:14px;color:#7fdbff;font-weight:700}.seek-control input[type=range],.vocals-control input[type=range]{width:100%}.seek-control span{font-size:12px;color:#ccc;text-align:center}.connection-line{pointer-events:none;transition:opacity .3s ease}.connection-line:hover{opacity:.8}.timeline-container{background:#000000e6;border-radius:12px;border:2px solid rgba(255,255,255,.1);padding:2rem;overflow-x:auto;overflow-y:auto;position:relative;min-height:400px}.save-control{display:flex;flex-direction:column;gap:.5rem;width:100%;align-items:center}.save-button{background:#22c55e;color:#fff;border:none;border-radius:8px;padding:12px 24px;cursor:pointer;font-size:16px;font-weight:700;transition:all .3s ease;width:100%;max-width:300px}.save-button:hover:not(:disabled){background:#16a34a;transform:translateY(-2px);box-shadow:0 4px 15px #22c55e66}.save-button:disabled{background:#6b7280;cursor:not-allowed;transform:none;box-shadow:none}.save-button.saving{background:#f59e0b;animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}.save-status{padding:8px 16px;border-radius:6px;font-size:14px;font-weight:700;text-align:center;min-height:20px;display:flex;align-items:center;justify-content:center}.save-status.success{background:#22c55e33;color:#22c55e;border:1px solid rgba(34,197,94,.3)}.save-status.error{background:#ef444433;color:#ef4444;border:1px solid rgba(239,68,68,.3)}.save-status.info{background:#3b82f633;color:#3b82f6;border:1px solid rgba(59,130,246,.3)}.timeline-lyric.resizing{border:2px solid #f59e0b!important;box-shadow:0 0 15px #f59e0b99!important;z-index:20!important}.resize-handle{transition:all .2s ease;opacity:.6}.resize-handle:hover{opacity:1;background:#7fdbff99!important}.timeline-lyric:hover .resize-handle{opacity:1}.timeline-lyric:hover .resize-handle.left{background:#7fdbff80!important;border-left-color:#7fdbff!important}.timeline-lyric:hover .resize-handle.right{background:#7fdbff80!important;border-right-color:#7fdbff!important}.home-container{display:flex;height:calc(100vh - 60px);color:#fff;background-color:#0d0d0d}.left-pane{flex:2;display:flex;flex-direction:column;padding:1rem;border-right:1px solid #333;width:66.67%}.right-pane{flex:1;padding:1rem;display:flex;align-items:center;justify-content:center;width:33.33%}.search-bar{padding:.4rem .75rem;margin-bottom:1rem;border:none;border-radius:4px;font-size:.9rem;outline:none;width:100%;box-sizing:border-box}.song-stream{flex:1;overflow-y:auto;display:flex;flex-direction:column-reverse;gap:.25rem}.song-item{padding:.5rem;background:#1a1a1a;border-radius:8px;text-decoration:none;color:#7fdbff;transition:all .2s ease;border:1px solid transparent;height:60px;display:flex;align-items:center;margin-bottom:.5rem}.song-item:hover{background:#333;border-color:#7fdbff;transform:translateY(-1px);box-shadow:0 4px 12px #7fdbff33}.song-info{display:flex;align-items:center;gap:.5rem;width:100%}.song-thumbnail{width:40px;height:40px;border-radius:4px;object-fit:cover;flex-shrink:0}.song-details{flex:1;min-width:0;display:flex;flex-direction:column;gap:.1rem;justify-content:center}.song-title{margin:0;font-size:.8rem;font-weight:700;color:#7fdbff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.song-duration{font-size:.65rem;color:#aaa;display:inline-block;margin:0}.song-uploader{font-size:.65rem;color:#888;margin:0}.auth-panel{background:#1a1a1a;padding:2rem;border-radius:8px;width:100%;max-width:350px;text-align:center}.auth-panel h2{margin-bottom:1rem}.auth-btn{width:100%;padding:.75rem 1rem;margin-bottom:.75rem;border:none;border-radius:4px;font-size:1rem;cursor:pointer;color:#fff}.auth-btn.google{background:#db4437}.auth-btn.facebook{background:#4267b2}.auth-btn.primary{background:#7fdbff;color:#001f3f;font-weight:700}.divider{margin:1rem 0;color:#aaa;position:relative}.divider:before,.divider:after{content:"";height:1px;background:#444;position:absolute;top:50%;width:40%}.divider:before{left:0}.divider:after{right:0}.auth-form input{width:100%;padding:.75rem 1rem;margin-bottom:.75rem;border:none;border-radius:4px;outline:none}.live-mic-status{background:#ffffff1a;border-radius:12px;padding:20px;margin-top:20px;border:1px solid rgba(255,255,255,.2)}.live-mic-status h3{margin:0 0 15px;color:#7fdbff;font-size:18px}.live-mic-status p{margin:8px 0;color:#fff;font-size:14px}.connect-mic-link{display:inline-block;background:linear-gradient(135deg,#4caf50,#45a049);color:#fff;text-decoration:none;padding:10px 20px;border-radius:8px;margin-top:15px;font-weight:600;transition:all .2s ease}.connect-mic-link:hover{transform:translateY(-2px);box-shadow:0 4px 15px #4caf504d;text-decoration:none;color:#fff}.connect-mic-container{min-height:100vh;background:linear-gradient(135deg,#000428,#004e92);padding:2rem;display:flex;justify-content:center;align-items:flex-start}.connect-mic-content{max-width:600px;width:100%;background:#021223f2;border:2px solid #2EDFFF;border-radius:15px;padding:2rem;box-shadow:0 0 20px #2edfff4d;color:#fff}.connect-mic-title{text-align:center;color:#ff2e63;text-shadow:0 0 10px #FF2E63;font-size:2rem;margin-bottom:2rem;font-family:"Press Start 2P",cursive}.session-section{margin-bottom:2rem;padding:1.5rem;background:#000d1acc;border-radius:10px;border:1px solid #2EDFFF}.session-section h3{color:#2edfff;margin-bottom:1rem;font-size:1.2rem}.session-code-display{display:flex;gap:1rem;margin-bottom:1rem}.session-input{flex:1;padding:.75rem;background:#000d1a;border:2px solid #2EDFFF;border-radius:8px;color:#0ff;font-family:"Press Start 2P",cursive;font-size:.9rem;text-align:center}.session-input:focus{outline:none;border-color:#ff2e63;box-shadow:0 0 10px #ff2e6380}.copy-btn{padding:.75rem 1rem;background:#ff2e63;color:#fff;border:none;border-radius:8px;cursor:pointer;font-family:"Press Start 2P",cursive;font-size:.8rem;transition:all .3s ease}.copy-btn:hover{background:#ff5c8a;transform:scale(1.05)}.session-instructions{color:#ccc;font-size:.9rem;line-height:1.4}.connection-section{margin-bottom:2rem;padding:1.5rem;background:#000d1acc;border-radius:10px;border:1px solid #2EDFFF}.connection-section h3{color:#2edfff;margin-bottom:1rem;font-size:1.2rem}.status-indicator{display:flex;align-items:center;gap:.5rem;padding:1rem;border-radius:8px;font-weight:700;font-size:1rem}.status-indicator.connected{background:#4caf5033;border:1px solid #4CAF50;color:#4caf50}.status-indicator.disconnected{background:#f4433633;border:1px solid #f44336;color:#f44336}.status-dot{width:12px;height:12px;border-radius:50%;animation:pulse 2s infinite}.status-indicator.connected .status-dot{background:#4caf50}.status-indicator.disconnected .status-dot{background:#f44336}.mic-indicator{font-size:1.2rem;animation:pulse 1s infinite}.mic-indicator.active{color:#f44}@keyframes pulse{0%{opacity:1}50%{opacity:.5}to{opacity:1}}.error-message{margin-top:1rem;padding:.75rem;background:#f4433633;border:1px solid #f44336;border-radius:8px;color:#f44336;font-size:.9rem}.controls-section{margin-bottom:2rem;display:flex;gap:1rem;justify-content:center}.connect-btn,.disconnect-btn{padding:1rem 2rem;border:none;border-radius:10px;font-family:"Press Start 2P",cursive;font-size:.9rem;cursor:pointer;transition:all .3s ease;min-width:150px}.connect-btn{background:#4caf50;color:#fff}.connect-btn:hover:not(:disabled){background:#45a049;transform:scale(1.05)}.connect-btn:disabled{background:#666;cursor:not-allowed;transform:none}.disconnect-btn{background:#f44336;color:#fff}.disconnect-btn:hover:not(:disabled){background:#d32f2f;transform:scale(1.05)}.disconnect-btn:disabled{background:#666;cursor:not-allowed;transform:none}.instructions-section,.tips-section{margin-bottom:2rem;padding:1.5rem;background:#000d1acc;border-radius:10px;border:1px solid #2EDFFF}.instructions-section h3,.tips-section h3{color:#2edfff;margin-bottom:1rem;font-size:1.2rem}.instructions-list,.tips-list{color:#ccc;line-height:1.6;padding-left:1.5rem}.instructions-list li,.tips-list li{margin-bottom:.5rem}.instructions-list li::marker,.tips-list li::marker{color:#ff2e63}@media (max-width: 768px){.connect-mic-container{padding:1rem}.connect-mic-content{padding:1.5rem}.connect-mic-title{font-size:1.5rem}.session-code-display{flex-direction:column}.controls-section{flex-direction:column;align-items:center}.connect-btn,.disconnect-btn{width:100%;max-width:250px}}.permission-popup-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.permission-popup{background:#fff;border-radius:16px;padding:30px;max-width:400px;width:90%;text-align:center;box-shadow:0 20px 40px #0000004d;animation:slideIn .3s ease-out}.permission-popup h3{margin:0 0 15px;color:#333;font-size:24px}.permission-popup p{margin:0 0 20px;color:#666;line-height:1.5}.permission-buttons{display:flex;gap:12px;justify-content:center;margin:25px 0}.permission-btn{padding:12px 24px;border:none;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s ease;min-width:120px}.permission-btn.allow{background:linear-gradient(135deg,#4caf50,#45a049);color:#fff;box-shadow:0 4px 15px #4caf504d}.permission-btn.allow:hover{transform:translateY(-2px);box-shadow:0 6px 20px #4caf5066}.permission-btn.deny{background:#f5f5f5;color:#666;border:2px solid #ddd}.permission-btn.deny:hover{background:#e8e8e8;color:#333}.permission-note{font-size:14px;color:#999;margin:15px 0 0;font-style:italic}@keyframes slideIn{0%{opacity:0;transform:translateY(-20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.audio-unlock-notice{background:linear-gradient(135deg,#ff6b6b,#ff8e8e);border:2px solid #ff4757;border-radius:12px;padding:20px;margin:20px 0;text-align:center;color:#fff;box-shadow:0 4px 15px #ff47574d;animation:pulse 2s infinite}.audio-unlock-notice p{margin:8px 0;font-size:16px}.audio-unlock-notice p:first-child{font-size:18px;font-weight:700}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.02)}to{transform:scale(1)}}.cli-upload{max-width:1200px;margin:0 auto;padding:20px;font-family:Courier New,monospace;background:#1a1a1a;color:#fff;border-radius:8px}.cli-upload h2{color:#0f0;border-bottom:2px solid #00ff00;padding-bottom:10px;margin-bottom:20px}.cli-upload h3{color:#0cf;margin-top:20px;margin-bottom:10px}.cli-status{background:#2a2a2a;padding:15px;border-radius:5px;margin-bottom:20px}.status-indicator{font-size:18px;font-weight:700}.status-indicator .processing{color:#fa0;animation:blink 1s infinite}.status-indicator .ready{color:#0f0}@keyframes blink{0%,50%{opacity:1}51%,to{opacity:.5}}.cli-logs{background:#2a2a2a;padding:15px;border-radius:5px;margin-bottom:20px;max-height:400px;overflow-y:auto}.log-container{font-family:Courier New,monospace;font-size:12px}.log-entry{padding:2px 0;border-bottom:1px solid #333}.log-entry:last-child{border-bottom:none}.log-timestamp{color:#888;margin-right:10px;font-size:10px}.log-message{color:#fff}.log-entry.log-info .log-message{color:#0cf}.log-entry.log-success .log-message{color:#0f0}.log-entry.log-error .log-message{color:#f44}.log-entry.log-warning .log-message{color:#fa0}.cli-results{background:#2a2a2a;padding:15px;border-radius:5px;margin-bottom:20px}.results-container{max-height:300px;overflow-y:auto}.result-entry{background:#333;padding:10px;margin-bottom:10px;border-radius:3px;border-left:4px solid #00ff00}.result-entry:last-child{margin-bottom:0}.result-session{font-weight:700;color:#0f0;margin-bottom:5px}.result-files{color:#ccc;font-size:12px;margin-bottom:5px}.result-job{color:#0cf;font-size:12px;margin-bottom:5px}.result-status{color:#fa0;font-size:12px}.cli-api{background:#2a2a2a;padding:15px;border-radius:5px}.api-info p{margin:5px 0;color:#ccc}.api-example{margin-top:15px}.api-example h4{color:#0cf;margin-bottom:10px}.api-example pre{background:#1a1a1a;padding:15px;border-radius:3px;overflow-x:auto;color:#0f0;font-size:11px;line-height:1.4;border:1px solid #333}.cli-logs::-webkit-scrollbar,.results-container::-webkit-scrollbar,.api-example pre::-webkit-scrollbar{width:8px}.cli-logs::-webkit-scrollbar-track,.results-container::-webkit-scrollbar-track,.api-example pre::-webkit-scrollbar-track{background:#1a1a1a}.cli-logs::-webkit-scrollbar-thumb,.results-container::-webkit-scrollbar-thumb,.api-example pre::-webkit-scrollbar-thumb{background:#555;border-radius:4px}.cli-logs::-webkit-scrollbar-thumb:hover,.results-container::-webkit-scrollbar-thumb:hover,.api-example pre::-webkit-scrollbar-thumb:hover{background:#777}body{font-family:"Press Start 2P",cursive;background:linear-gradient(to bottom right,#001f3f,#000814);margin:0;padding:0;color:#fff;text-align:center;overflow-x:hidden;min-height:100vh;display:flex;flex-direction:column}.background-logo img{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:90%;max-width:700px;opacity:.08;filter:blur(6px) brightness(.9);z-index:-1}.neon-text{font-size:2.5rem;color:#ff2e63;text-shadow:0px 0px 10px #FF2E63,0px 0px 20px #2EDFFF;animation:flicker 1.5s infinite alternate;margin-top:2rem}.sub-text{font-size:.8rem;margin-top:1rem;color:#ccc;padding:0 1rem}@keyframes flicker{0%{opacity:1}50%{opacity:.7}to{opacity:1}}.main-container{padding:2rem;z-index:1;max-width:1200px;margin:0 auto}.section-heading{color:#2edfff;font-size:1.2rem;text-shadow:0 0 5px #2EDFFF;margin-bottom:1.5rem}.upload-box,.youtube-box{margin:1.5rem auto;padding:1rem;max-width:600px;background-color:#021223;border:2px solid #2EDFFF;border-radius:12px;box-shadow:0 0 10px #2edfff}input[type=file],input[type=text]{width:80%;padding:.75rem;font-family:inherit;font-size:.75rem;border-radius:6px;border:1px solid #2EDFFF;background-color:#000d1a;color:#0ff;margin-bottom:1rem}button{font-family:inherit;padding:.75rem 1.5rem;background-color:#ff2e63;border:none;border-radius:6px;color:#fff;font-weight:700;cursor:pointer;font-size:.75rem;box-shadow:0 0 10px #ff2e63;transition:background-color .3s ease,transform .2s ease}button:hover{background-color:#ff5c8a;transform:scale(1.05)}.logs{margin-top:1rem;font-size:.7rem;color:#0ff;white-space:pre-wrap}.player-container{margin-top:2rem;padding:2rem;background-color:#0a1a2f;border-radius:10px;box-shadow:0 0 10px #0ff8}.audio-controls{display:flex;flex-direction:column;gap:1.5rem;margin-top:1rem}audio{width:100%;background-color:#012;border-radius:5px}#lyrics-container{margin-top:2rem;color:#ff33a8;background-color:#000814;padding:1.5rem;border-radius:10px;font-family:monospace;white-space:pre-wrap;box-shadow:0 0 10px #ff33a8}.navbar{display:flex;justify-content:space-between;align-items:center;background-color:#000c1a;padding:1rem 2rem;border-bottom:2px solid #2EDFFF;z-index:10}.navbar .logo img{height:100px}.navbar .nav-links{list-style:none;display:flex;gap:2rem}.navbar .nav-links li a{text-decoration:none;color:#0ff;font-size:.8rem;transition:color .3s ease}.navbar .nav-links li a:hover{color:#ff2e63}.footer{background-color:#000c1a;color:#aaa;padding:2rem 1rem;font-size:.75rem;margin-top:auto;border-top:2px solid #2EDFFF}.footer-content{display:flex;flex-wrap:wrap;justify-content:space-around;max-width:1200px;margin:0 auto;text-align:left;gap:2rem}.footer-section{flex:1 1 250px}.footer-section h4{color:#ff33a8;margin-bottom:.5rem}.footer-section p,.footer-section a{color:#ddd;text-decoration:none;font-size:.7rem}.footer-section a:hover{color:#0ff;text-decoration:underline}.footer-bottom{text-align:center;margin-top:1rem;padding-top:1rem;border-top:1px solid #444;font-size:.7rem}@media (max-width: 768px){.navbar{flex-direction:column;align-items:flex-start}.navbar .nav-links{flex-direction:column;gap:1rem}input[type=file],input[type=text],button{width:100%}.audio-controls{flex-direction:column}.main-container{padding:1rem}.upload-box,.youtube-box{width:90%}}