@import"https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800;900&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap";:root{--bg-dark: #040711;--bg-card: rgba(13, 19, 36, .75);--bg-card-hover: rgba(22, 30, 54, .85);--border-glow: rgba(168, 85, 247, .4);--primary: #9333ea;--primary-hover: #7e22ce;--primary-glow: rgba(168, 85, 247, .5);--accent-cyan: #06b6d4;--accent-pink: #ec4899;--accent-gold: #f59e0b;--accent-green: #10b981;--text-main: #f8fafc;--text-muted: #94a3b8;--text-dim: #64748b;--font-heading: "Outfit", sans-serif;--font-body: "Plus Jakarta Sans", sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-body);background-color:var(--bg-dark);color:var(--text-main);min-height:100vh;background-image:radial-gradient(circle at 10% 10%,rgba(147,51,234,.18) 0%,transparent 40%),radial-gradient(circle at 90% 20%,rgba(6,182,212,.18) 0%,transparent 40%),radial-gradient(circle at 50% 85%,rgba(236,72,153,.12) 0%,transparent 50%),radial-gradient(circle at 50% 50%,rgba(15,23,42,.9) 0%,transparent 100%);background-attachment:fixed;overflow-x:hidden;line-height:1.5}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);letter-spacing:-.02em}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(to right,rgba(255,255,255,.02) 1px,transparent 1px),linear-gradient(to bottom,rgba(255,255,255,.02) 1px,transparent 1px);background-size:40px 40px;pointer-events:none;z-index:0}#root{position:relative;z-index:1}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#040711cc}::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--primary) 0%,var(--accent-cyan) 100%);border-radius:4px}.glass-card{background:var(--bg-card);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border:1px solid rgba(255,255,255,.1);border-radius:22px;box-shadow:0 20px 50px #00000080,inset 0 1px #ffffff1a;transition:all .3s cubic-bezier(.16,1,.3,1)}.glass-card-hover{cursor:pointer}.glass-card-hover:hover{border-color:var(--border-glow);transform:translateY(-4px) scale(1.01);box-shadow:0 30px 60px #9333ea40,0 0 20px #a855f733,inset 0 1px #fff3}.glow-purple{box-shadow:0 0 25px #9333ea80}.glow-cyan{box-shadow:0 0 25px #06b6d480}.glow-gold{box-shadow:0 0 25px #f59e0b80}.btn-primary{position:relative;background:linear-gradient(135deg,#a855f7,#6366f1);color:#fff;font-family:var(--font-heading);font-weight:800;padding:.85rem 1.75rem;border-radius:14px;border:none;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:.6rem;transition:all .25s cubic-bezier(.16,1,.3,1);box-shadow:0 8px 25px #a855f766;overflow:hidden}.btn-primary:after{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:linear-gradient(45deg,transparent,rgba(255,255,255,.25),transparent);transform:rotate(30deg);transition:transform .6s ease}.btn-primary:hover:not(:disabled):after{transform:rotate(30deg) translate(50%,50%)}.btn-primary:hover:not(:disabled){transform:translateY(-2px) scale(1.02);box-shadow:0 12px 35px #a855f799;background:linear-gradient(135deg,#c084fc,#4f46e5)}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-secondary{background:#ffffff0f;color:var(--text-main);font-family:var(--font-heading);font-weight:700;padding:.85rem 1.5rem;border-radius:14px;border:1px solid rgba(255,255,255,.14);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;transition:all .25s ease}.btn-secondary:hover:not(:disabled){background:#ffffff26;border-color:#ffffff4d;transform:translateY(-2px)}.btn-cyan{background:linear-gradient(135deg,#06b6d4,#0284c7);color:#fff;font-family:var(--font-heading);font-weight:800;padding:.85rem 1.75rem;border-radius:14px;border:none;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;box-shadow:0 8px 25px #06b6d466;transition:all .25s ease}.btn-cyan:hover:not(:disabled){transform:translateY(-2px) scale(1.02);box-shadow:0 12px 35px #06b6d499;background:linear-gradient(135deg,#22d3ee,#0369a1)}.btn-gold{background:linear-gradient(135deg,#f59e0b,#d97706);color:#040711;font-family:var(--font-heading);font-weight:900;padding:.85rem 1.75rem;border-radius:14px;border:none;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;box-shadow:0 8px 25px #f59e0b66;transition:all .25s ease}.btn-gold:hover:not(:disabled){transform:translateY(-2px) scale(1.02);box-shadow:0 12px 35px #f59e0b99;background:linear-gradient(135deg,#fbbf24,#b45309)}.input-styled{background:#060b18cc;border:1px solid rgba(255,255,255,.14);color:var(--text-main);padding:.85rem 1.25rem;border-radius:12px;font-family:var(--font-body);font-size:.95rem;width:100%;outline:none;transition:all .25s ease}.input-styled:focus{border-color:#a855f7;box-shadow:0 0 0 4px #a855f740,0 0 15px #a855f74d;background:#0a1020f2}.select-styled{background:#060b18e6;border:1px solid rgba(255,255,255,.14);color:var(--text-main);padding:.85rem 1.25rem;border-radius:12px;font-family:var(--font-body);font-size:.95rem;outline:none;cursor:pointer;transition:border-color .2s ease}.select-styled:focus{border-color:#a855f7}.badge-neon{background:#a855f733;border:1px solid rgba(168,85,247,.5);color:#e9d5ff;padding:.3rem .75rem;border-radius:8px;font-size:.75rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.badge-cyan{background:#06b6d433;border:1px solid rgba(6,182,212,.5);color:#7dd3fc;padding:.3rem .75rem;border-radius:8px;font-size:.75rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.badge-gold{background:#f59e0b33;border:1px solid rgba(245,158,11,.5);color:#fef08a;padding:.3rem .75rem;border-radius:8px;font-size:.75rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.eq-container{display:inline-flex;align-items:flex-end;gap:3px;height:18px}.eq-bar{width:4px;background:linear-gradient(180deg,#38bdf8,#a855f7);border-radius:2px;animation:eqAnim 1s ease-in-out infinite alternate}.eq-bar:nth-child(1){height:40%;animation-delay:.1s}.eq-bar:nth-child(2){height:90%;animation-delay:.3s}.eq-bar:nth-child(3){height:60%;animation-delay:.2s}.eq-bar:nth-child(4){height:100%;animation-delay:.4s}@keyframes eqAnim{0%{transform:scaleY(.3)}to{transform:scaleY(1)}}.karaoke-subtitle{text-shadow:0 0 20px rgba(0,0,0,.95),0 4px 12px rgba(0,0,0,.95);background:linear-gradient(180deg,#fff,#fbbf24);-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:popIn .3s cubic-bezier(.175,.885,.32,1.275)}@keyframes popIn{0%{transform:scale(.85);opacity:0}to{transform:scale(1);opacity:1}}input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:10px;background:#ffffff1a;border-radius:6px;outline:none}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:22px;height:22px;border-radius:50%;background:linear-gradient(135deg,#c084fc,#06b6d4);cursor:pointer;box-shadow:0 0 15px #c084fccc;transition:transform .15s ease}input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.3)}.gr-timer{position:relative;width:52px;height:52px;display:flex;align-items:center;justify-content:center}.gr-timer-text{position:absolute;font-family:var(--font-heading);font-weight:900;font-size:13px;line-height:1;transition:color 1s ease}.gr-prompt-hint{background:#0a0a1eeb;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(168,85,247,.5);color:#e9d5ff;padding:.5rem 1.25rem;border-radius:100px;font-size:.8rem;font-weight:700;box-shadow:0 0 25px #9333ea4d}.gr-subtitle-box{background:#000000e6;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid rgba(245,158,11,.5);padding:.75rem 1.25rem;border-radius:18px;box-shadow:0 0 30px #f59e0b40;max-width:90%}.gr-subtitle-author{display:flex;align-items:center;gap:.5rem;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.1em;color:#f59e0b;margin-bottom:.35rem}.gr-player-card{display:flex;align-items:center;gap:.5rem;padding:.5rem .6rem;border-radius:14px;border:1px solid;transition:all .3s ease;border-color:#334155cc;background:#0f172a99;color:#94a3b8}.gr-player-card.done{border-color:#10b98180;background:#064e3b4d;color:#6ee7b7}.gr-player-card.me{border-color:#a855f780;background:#581c8740}.gr-player-card.done.me{border-color:#10b981b3;background:#064e3b80;box-shadow:0 0 12px #10b98133}.gr-textarea{width:100%;min-height:110px;resize:none;background:#060916d9;border:1.5px solid rgba(255,255,255,.1);color:#f8fafc;padding:1rem 1rem 2rem;border-radius:16px;font-family:var(--font-body);font-size:1.05rem;font-weight:600;outline:none;transition:all .25s ease;line-height:1.6}.gr-textarea:focus{border-color:#a855f7;box-shadow:0 0 0 3px #a855f733,0 0 20px #a855f726;background:#0a0e23f2}.gr-textarea::placeholder{color:#94a3b873}.gr-voice-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.3rem;padding:.6rem .4rem;border-radius:14px;border:1.5px solid rgba(51,65,85,.7);background:#0f172ab3;color:#94a3b8;cursor:pointer;transition:all .2s cubic-bezier(.16,1,.3,1);font-family:var(--font-heading)}.gr-voice-btn:hover{border-color:#a855f773;background:#581c8733;color:#e9d5ff;transform:translateY(-2px)}.gr-voice-btn.selected{border-color:#a855f7;background:#581c8773;color:#fff;box-shadow:0 0 20px #9333ea66,inset 0 1px #ffffff1a;transform:translateY(-2px)}.gr-lang-select-wrapper{display:flex;align-items:center;gap:.5rem;background:#060916d9;border:1.5px solid rgba(6,182,212,.3);border-radius:12px;padding:.5rem .75rem;flex:1;transition:border-color .2s ease}.gr-lang-select-wrapper:focus-within{border-color:#06b6d4b3;box-shadow:0 0 0 3px #06b6d41f}.gr-lang-select{background:transparent;border:none;color:#f8fafc;font-family:var(--font-body);font-size:.82rem;font-weight:600;outline:none;cursor:pointer;flex:1;-moz-appearance:none;appearance:none;-webkit-appearance:none}.gr-lang-select option{background:#0d1324;color:#f8fafc}.gr-test-voice-btn{display:flex;align-items:center;gap:.4rem;font-size:.75rem;font-weight:700;color:#22d3ee;transition:color .2s ease,opacity .2s ease;background:none;border:none;cursor:pointer;padding:.25rem .5rem;border-radius:8px}.gr-test-voice-btn:hover:not(:disabled){color:#67e8f9;background:#06b6d41a}.gr-test-voice-btn:disabled{opacity:.5;cursor:not-allowed}.eq-container.small{height:14px;gap:2px}.eq-container.small .eq-bar{width:3px}.gr-vote-card{padding:1.1rem;border-radius:18px;border:1.5px solid;transition:all .25s cubic-bezier(.16,1,.3,1)}.gr-vote-card.available{border-color:#334155cc;background:#0f172acc;cursor:pointer}.gr-vote-card.available:hover{border-color:#06b6d480;background:#08334466;transform:translateY(-2px);box-shadow:0 8px 25px #06b6d426}.gr-vote-card.selected{border-color:#06b6d4;background:#083344b3;box-shadow:0 0 30px #06b6d44d,inset 0 1px #ffffff14;cursor:default}.gr-vote-card.mine{border-color:#33415566;background:#0f172a66;opacity:.55;cursor:not-allowed}.gr-vote-card.voted-other{border-color:#33415599;background:#0f172a80;cursor:default;opacity:.8}.gr-result-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.85rem 1.1rem;border-radius:16px;border:1px solid rgba(51,65,85,.7);background:#0f172ab3;transition:all .3s ease}.gr-result-row.winner{border-color:#f59e0b99;background:#5c370559;box-shadow:0 0 30px #f59e0b26}.gr-rank-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 1.25rem;border-radius:18px;border:1.5px solid rgba(51,65,85,.6);background:#0f172ab3}.gr-rank-row.first{border-color:#f59e0bb3;background:linear-gradient(135deg,#5c370580,#36230380);box-shadow:0 0 40px #f59e0b33}.gr-rank-row.second{border-color:#94a3b880;background:#1e293b99}.gr-rank-row.third{border-color:#b4783c66;background:#1e140a66}.gr-trophy-icon{display:inline-flex;align-items:center;justify-content:center;font-size:3.5rem;padding:1.25rem;border-radius:30px;background:linear-gradient(135deg,#f59e0b40,#eab30826);border:1px solid rgba(245,158,11,.4);box-shadow:0 0 50px #f59e0b4d;animation:trophyPulse 2s ease-in-out infinite}@keyframes trophyPulse{0%,to{box-shadow:0 0 50px #f59e0b4d}50%{box-shadow:0 0 80px #f59e0b80,0 0 120px #f59e0b33}}.btn-3d{position:relative;border:none;font-family:var(--font-heading);font-weight:900;text-transform:uppercase;letter-spacing:.04em;border-radius:18px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:.6rem;transition:all .15s cubic-bezier(.16,1,.3,1);-webkit-user-select:none;user-select:none}.btn-3d:active:not(:disabled){transform:translateY(4px)}.btn-3d-purple{background:linear-gradient(180deg,#c084fc,#9333ea 60%,#7e22ce);color:#fff;box-shadow:0 6px #581c87,0 12px 25px #9333ea80;text-shadow:0 2px 4px rgba(0,0,0,.4)}.btn-3d-purple:hover:not(:disabled){background:linear-gradient(180deg,#d8b4fe,#a855f7 60%,#9333ea);box-shadow:0 6px #581c87,0 16px 30px #9333eaa6}.btn-3d-purple:active:not(:disabled){box-shadow:0 2px #581c87,0 6px 15px #9333ea66}.btn-3d-cyan{background:linear-gradient(180deg,#38bdf8,#06b6d4 60%,#0284c7);color:#fff;box-shadow:0 6px #0369a1,0 12px 25px #06b6d480;text-shadow:0 2px 4px rgba(0,0,0,.4)}.btn-3d-cyan:hover:not(:disabled){background:linear-gradient(180deg,#67e8f9,#22d3ee 60%,#06b6d4);box-shadow:0 6px #0369a1,0 16px 30px #06b6d4a6}.btn-3d-cyan:active:not(:disabled){box-shadow:0 2px #0369a1,0 6px 15px #06b6d466}.btn-3d-gold{background:linear-gradient(180deg,#fde047,#f59e0b 60%,#d97706);color:#1a0b02;box-shadow:0 6px #92400e,0 12px 25px #f59e0b80;text-shadow:0 1px 2px rgba(255,255,255,.4)}.btn-3d-gold:hover:not(:disabled){background:linear-gradient(180deg,#fef08a,#fbbf24 60%,#f59e0b);box-shadow:0 6px #92400e,0 16px 30px #f59e0ba6}.btn-3d-gold:active:not(:disabled){box-shadow:0 2px #92400e,0 6px 15px #f59e0b66}.btn-3d-pink{background:linear-gradient(180deg,#f472b6,#ec4899 60%,#db2777);color:#fff;box-shadow:0 6px #9d174d,0 12px 25px #ec489980;text-shadow:0 2px 4px rgba(0,0,0,.4)}.btn-3d-pink:hover:not(:disabled){background:linear-gradient(180deg,#f9a8d4,#f472b6 60%,#ec4899);box-shadow:0 6px #9d174d,0 16px 30px #ec4899a6}.btn-3d-pink:active:not(:disabled){box-shadow:0 2px #9d174d,0 6px 15px #ec489966}.party-mode-card{position:relative;background:#0d1326d9;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:2px solid rgba(255,255,255,.08);border-radius:26px;overflow:hidden;transition:all .3s cubic-bezier(.16,1,.3,1);box-shadow:0 15px 40px #00000080}.party-mode-card:hover{transform:translateY(-6px);border-color:#ffffff40}.party-mode-card.purple-theme:hover{border-color:#a855f7b3;box-shadow:0 20px 50px #9333ea59}.party-mode-card.cyan-theme:hover{border-color:#06b6d4b3;box-shadow:0 20px 50px #06b6d459}.party-mode-card.gold-theme:hover{border-color:#f59e0bb3;box-shadow:0 20px 50px #f59e0b59}.party-title-gradient{background:linear-gradient(180deg,#fff,#e0e7ff,#c084fc);-webkit-background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 4px 15px rgba(168,85,247,.6))}@keyframes floatAnim{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-8px) rotate(1deg)}}.animate-float{animation:floatAnim 4s ease-in-out infinite}@keyframes pulseGlow{0%,to{filter:drop-shadow(0 0 15px rgba(168,85,247,.4))}50%{filter:drop-shadow(0 0 30px rgba(236,72,153,.8))}}.animate-pulse-glow{animation:pulseGlow 3s ease-in-out infinite}.avatar-bounce{transition:transform .2s cubic-bezier(.175,.885,.32,1.275)}.avatar-bounce:hover{transform:scale(1.15) rotate(4deg)}