:root{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,sans-serif;line-height:1.6;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--font-display: "Space Grotesk", "Inter", sans-serif;--font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--surface-darkest: #0a0a12;--surface-dark: #121220;--surface-mid: #1a1a2e;--surface-card: rgba(26, 26, 46, .85);--surface-elevated: rgba(30, 30, 52, .95);--neon-violet: #7c3aed;--neon-magenta: #e040fb;--neon-cyan: #00e5ff;--neon-amber: #fbbf24;--neon-red: #ef4444;--neon-green: #10b981;--glow-violet: 0 0 20px rgba(124, 58, 237, .4), 0 0 40px rgba(124, 58, 237, .2);--glow-magenta: 0 0 20px rgba(224, 64, 251, .4), 0 0 40px rgba(224, 64, 251, .2);--glow-cyan: 0 0 20px rgba(0, 229, 255, .4), 0 0 40px rgba(0, 229, 255, .2);--glow-amber: 0 0 20px rgba(251, 191, 36, .4), 0 0 40px rgba(251, 191, 36, .2);--glow-red: 0 0 20px rgba(239, 68, 68, .4), 0 0 40px rgba(239, 68, 68, .2);--glow-green: 0 0 20px rgba(16, 185, 129, .4), 0 0 40px rgba(16, 185, 129, .2);--text-primary: #f0f0f5;--text-secondary: #a0a0b8;--text-muted: #6b6b82;--gradient-game: linear-gradient(135deg, #7c3aed 0%, #e040fb 100%);--gradient-danger: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);--gradient-success: linear-gradient(135deg, #10b981 0%, #34d399 100%);--gradient-surface: linear-gradient(135deg, #0a0a12 0%, #1a1a2e 100%);--gradient-card: linear-gradient(135deg, rgba(26, 26, 46, .9) 0%, rgba(18, 18, 32, .95) 100%);--primary-50: #eef2ff;--primary-100: rgba(124, 58, 237, .15);--primary-200: rgba(124, 58, 237, .25);--primary-300: #a5b4fc;--primary-400: #818cf8;--primary-500: #7c3aed;--primary-600: #7c3aed;--primary-700: #6d28d9;--primary-800: #5b21b6;--primary-900: #4c1d95;--secondary-50: rgba(224, 64, 251, .08);--secondary-100: rgba(224, 64, 251, .12);--secondary-200: rgba(224, 64, 251, .2);--secondary-300: #f9a8d4;--secondary-400: #f472b6;--secondary-500: #e040fb;--secondary-600: #c026d3;--secondary-700: #a21caf;--success-50: rgba(16, 185, 129, .1);--success-100: rgba(16, 185, 129, .15);--success-200: rgba(16, 185, 129, .25);--success-500: #10b981;--success-600: #059669;--warning-50: rgba(251, 191, 36, .1);--warning-100: rgba(251, 191, 36, .15);--warning-200: rgba(251, 191, 36, .25);--warning-500: #fbbf24;--warning-600: #d97706;--danger-50: rgba(239, 68, 68, .1);--danger-100: rgba(239, 68, 68, .15);--danger-500: #ef4444;--danger-600: #dc2626;--gray-50: rgba(240, 240, 245, .06);--gray-100: rgba(240, 240, 245, .08);--gray-200: rgba(240, 240, 245, .12);--gray-300: rgba(240, 240, 245, .18);--gray-400: #6b6b82;--gray-500: #a0a0b8;--gray-600: #a0a0b8;--gray-700: #c8c8d8;--gray-800: #e0e0ea;--gray-900: #f0f0f5;--primary-gradient: var(--gradient-game);--secondary-gradient: linear-gradient(135deg, #e040fb 0%, #f472b6 100%);--dark-gradient: var(--gradient-surface);--success-gradient: var(--gradient-success);--warning-gradient: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);--glass-gradient: linear-gradient(135deg, rgba(124, 58, 237, .08) 0%, rgba(224, 64, 251, .04) 100%);--card-bg: var(--surface-card);--card-bg-dark: var(--surface-elevated);--glass-bg: rgba(124, 58, 237, .06);--glass-border: rgba(124, 58, 237, .2);--shadow-xs: 0 1px 2px rgba(0, 0, 0, .3);--shadow-sm: 0 1px 3px rgba(0, 0, 0, .4), 0 1px 2px rgba(0, 0, 0, .3);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .4), 0 2px 4px -1px rgba(0, 0, 0, .3);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .4), 0 4px 6px -2px rgba(0, 0, 0, .3);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .4), 0 10px 10px -5px rgba(0, 0, 0, .3);--shadow-2xl: 0 25px 50px -12px rgba(0, 0, 0, .6);--shadow-glow: var(--glow-violet);--shadow-glow-pink: var(--glow-magenta);--glow-primary: var(--glow-violet);--border-radius: 16px;--border-radius-sm: 8px;--border-radius-lg: 24px;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 16px;--radius-xl: 20px;--radius-2xl: 24px;--radius-full: 9999px;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--space-10: 40px;--space-12: 48px;--space-16: 64px;--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-base: .2s cubic-bezier(.4, 0, .2, 1);--transition-slow: .3s cubic-bezier(.4, 0, .2, 1);--transition-spring: .5s cubic-bezier(.34, 1.56, .64, 1);--z-dropdown: 100;--z-sticky: 200;--z-fixed: 300;--z-modal-backdrop: 900;--z-modal: 1000;--z-popover: 600;--z-tooltip: 1100}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html{width:100%;height:100%;overflow-x:hidden;scroll-behavior:smooth;-webkit-tap-highlight-color:transparent}body{margin:0;padding:0;width:100%;min-height:100vh;overflow-x:hidden;background:var(--surface-darkest);color:var(--text-primary);font-size:16px}#root{width:100%;min-height:100vh;display:flex;flex-direction:column;position:relative}a{font-weight:500;color:var(--neon-cyan);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--neon-violet)}h1,h2,h3,h4,h5,h6{font-family:var(--font-display);font-weight:700;line-height:1.3;color:var(--text-primary)}h1{font-size:clamp(1.75rem,4vw,2.5rem)}h2{font-size:clamp(1.5rem,3.5vw,2rem)}h3{font-size:clamp(1.25rem,3vw,1.5rem)}h4{font-size:clamp(1.125rem,2.5vw,1.25rem)}button{font-family:var(--font-display);border-radius:var(--radius-md);border:none;padding:var(--space-3) var(--space-5);font-size:1rem;font-weight:600;cursor:pointer;transition:all var(--transition-base);display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);text-transform:uppercase;letter-spacing:.5px}button:focus-visible{outline:2px solid var(--neon-violet);outline-offset:2px}button:disabled{opacity:.5;cursor:not-allowed}input,textarea,select{font-family:var(--font-body);font-size:1rem;width:100%;box-sizing:border-box;border:2px solid rgba(124,58,237,.25);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);background:#0a0a1299;color:var(--text-primary);transition:all var(--transition-fast)}input:focus,textarea:focus,select:focus{outline:none;border-color:var(--neon-violet);box-shadow:0 0 0 3px #7c3aed33,var(--glow-violet)}input::placeholder,textarea::placeholder{color:var(--text-muted)}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes neonPulse{0%,to{box-shadow:0 0 5px #7c3aed4d,0 0 15px #7c3aed26}50%{box-shadow:0 0 15px #7c3aed80,0 0 30px #7c3aed4d}}@keyframes glitchFlicker{0%,to{opacity:1}92%{opacity:1}93%{opacity:.8;transform:translate(-2px)}94%{opacity:1;transform:translate(0)}96%{opacity:.9;transform:translate(1px)}97%{opacity:1;transform:translate(0)}}@keyframes floatParticle{0%{transform:translateY(100vh) scale(0);opacity:0}10%{opacity:1}90%{opacity:1}to{transform:translateY(-10vh) scale(1);opacity:0}}@keyframes borderGlow{0%,to{opacity:.5}50%{opacity:1}}@keyframes textGlow{0%,to{text-shadow:0 0 10px rgba(124,58,237,.3),0 0 20px rgba(124,58,237,.15)}50%{text-shadow:0 0 20px rgba(124,58,237,.5),0 0 40px rgba(124,58,237,.3)}}@keyframes slideInFromBottom{0%{opacity:0;transform:translateY(40px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes scaleInBounce{0%{opacity:0;transform:scale(.85)}60%{opacity:1;transform:scale(1.03)}to{transform:scale(1)}}@keyframes revealSecret{0%{filter:blur(12px);opacity:0;transform:scale(.95)}30%{filter:blur(6px);opacity:.7}to{filter:blur(0);opacity:1;transform:scale(1)}}@keyframes shakeIntense{0%,to{transform:translate(0)}10%{transform:translate(-6px) rotate(-1deg)}20%{transform:translate(6px) rotate(1deg)}30%{transform:translate(-4px) rotate(-.5deg)}40%{transform:translate(4px) rotate(.5deg)}50%{transform:translate(-2px)}60%{transform:translate(2px)}70%{transform:translate(-1px)}80%{transform:translate(1px)}}.room-content{flex-direction:column;padding:var(--space-3);gap:var(--space-3)}.sidebar{width:100%;order:2}.main-area{width:100%;order:1;min-height:auto;padding:var(--space-4)}.landing-container{padding:var(--space-5);width:95%;max-width:100%;border-radius:var(--radius-xl)}.landing h1{font-size:1.75rem}.subtitle{font-size:.9375rem}.room-header{flex-direction:column;gap:var(--space-3);padding:var(--space-3) var(--space-4)}.room-info{flex-direction:column;gap:var(--space-2);width:100%;align-items:flex-start}.room-header h1{font-size:1.25rem}.room-info span{font-size:.875rem}.leave-btn,.settings-btn{padding:var(--space-2) var(--space-4);font-size:.875rem;width:100%}.players-list{padding:var(--space-3);border-radius:var(--radius-md)}.players-list h3{font-size:1rem}.game-board,.waiting-area{padding:var(--space-4)}.waiting-area h2{font-size:1.25rem}.play-btn{padding:var(--space-3) var(--space-6);font-size:1rem;width:100%}.room-options{grid-template-columns:1fr}.input{padding:var(--space-3) var(--space-4);font-size:1rem}.submit-btn{padding:var(--space-3) var(--space-5);font-size:1rem}.ready-status-bar{margin:var(--space-3);padding:var(--space-3)}.status-content{flex-direction:column;gap:var(--space-3)}.ready-info,.pool-status-inline{width:100%;justify-content:center}@media (min-width: 640px){.landing-container{padding:var(--space-8);width:90%;max-width:480px}.landing h1{font-size:2rem}.subtitle{font-size:1rem}.room-header{flex-direction:row;padding:var(--space-4) var(--space-5)}.room-info{flex-direction:row;gap:var(--space-4);width:auto;align-items:center}.leave-btn,.settings-btn{width:auto}.room-content{padding:var(--space-4);gap:var(--space-4)}.main-area{padding:var(--space-5)}.room-options{grid-template-columns:repeat(2,1fr)}.status-content{flex-direction:row}.ready-info,.pool-status-inline{width:auto}}@media (min-width: 768px){.landing-container{padding:var(--space-10);max-width:520px}.landing h1{font-size:2.5rem}.subtitle{font-size:1.1rem;margin-bottom:var(--space-8)}.room-header h1{font-size:1.5rem}.room-info span{font-size:1rem}.players-list{padding:var(--space-5)}.players-list h3{font-size:1.125rem}.main-area{padding:var(--space-6);min-height:400px}.waiting-area h2{font-size:1.75rem}.play-btn{width:auto;padding:var(--space-4) var(--space-8);font-size:1.125rem}.input{padding:var(--space-4) var(--space-5);font-size:1.05rem}.submit-btn{padding:var(--space-4) var(--space-8);font-size:1.1rem}}@media (min-width: 1024px){.room-content{flex-direction:row;padding:var(--space-5);gap:var(--space-5)}.sidebar{width:320px;order:2;flex-shrink:0}.main-area{flex:1;order:1;min-height:500px}.room-header{padding:var(--space-5) var(--space-6)}.room-header h1{font-size:1.75rem}.ready-status-bar{margin:var(--space-5);padding:var(--space-4) var(--space-6)}}@media (min-width: 1280px){.room-content{max-width:1400px;margin:0 auto;gap:var(--space-6)}.sidebar{width:360px}.landing-container{max-width:560px;padding:var(--space-12)}.landing h1{font-size:2.75rem}}@media (max-width: 480px){.drawing-guess-container .game-area{flex-direction:column}.drawing-guess-container .sidebar{width:100%}.drawing-guess-container .game-info{flex-direction:column;gap:8px;text-align:center}.drawing-tools{flex-wrap:wrap;justify-content:center}.word-battle-container .letters-grid{gap:4px}.word-battle-container .letter-btn{width:36px;height:36px;font-size:.9rem}.tod-spinner-container{width:200px;height:200px;margin:20px auto}.truth-or-dare .game-header h1{font-size:1.4em}.truth-or-dare .task-container{padding:15px}.truth-or-dare .choice-buttons,.truth-or-dare .vote-buttons,.truth-or-dare .action-buttons{flex-direction:column;gap:10px}.rock-paper-scissors{padding:20px}.rock-paper-scissors .choices-area{flex-direction:column;gap:20px}.rock-paper-scissors .choices{justify-content:center}.rock-paper-scissors .choice-btn{min-width:80px;padding:12px}.rock-paper-scissors .choice-emoji{font-size:2rem}.rock-paper-scissors .choice-emoji.large{font-size:3.5rem}.rock-paper-scissors .vs{font-size:1.5rem}}@media (min-width: 1536px){.room-content{max-width:1600px}.landing-container{max-width:600px;padding:56px}}@media (hover: none) and (pointer: coarse){button,.option-btn,.choice-btn,.game-card{min-height:44px}.input,.confession-textarea{font-size:16px}button:hover,.option-btn:hover,.game-card:hover{transform:none}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@media (max-height: 500px) and (orientation: landscape){.landing{padding:var(--space-3);min-height:auto}.landing-container{padding:var(--space-4);max-height:95vh;overflow-y:auto}.landing h1{font-size:1.5rem;margin-bottom:var(--space-2)}.subtitle{margin-bottom:var(--space-3)}.landing-form{gap:var(--space-3)}.landing:after{opacity:.4}}@media print{.room-header,.sidebar,button,.chat{display:none!important}.main-area{box-shadow:none;border:1px solid #ccc}}.landing{width:100%;min-height:100vh;min-height:100dvh;display:flex;justify-content:center;align-items:center;padding:var(--space-4);background:var(--surface-darkest);position:relative;overflow:hidden;box-sizing:border-box}.landing:before{content:"";position:absolute;top:-50%;right:-50%;width:200%;height:200%;background:radial-gradient(circle at 30% 40%,rgba(124,58,237,.15) 0%,transparent 50%),radial-gradient(circle at 70% 60%,rgba(224,64,251,.1) 0%,transparent 45%),radial-gradient(circle at 50% 80%,rgba(0,229,255,.08) 0%,transparent 40%);animation:rotate 40s linear infinite;pointer-events:none}.landing:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:transparent;box-shadow:120px 80px 0 1px #7c3aed4d,350px 150px 0 1.5px #00e5ff40,60px 300px 0 1px #e040fb59,500px 50px 0 1px #7c3aed33,250px 400px 0 1.5px #00e5ff4d,400px 350px 0 1px #e040fb33,80px 500px 0 1px #7c3aed40,600px 250px 0 1.5px #00e5ff33,180px 180px 0 1px #e040fb4d,450px 480px 0 1px #7c3aed33;animation:floatParticle 20s linear infinite;pointer-events:none}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.game-logo{text-align:center;font-size:clamp(3rem,8vw,4.5rem);line-height:1;margin-bottom:var(--space-3);animation:bounce 3s ease-in-out infinite;filter:drop-shadow(0 0 12px rgba(124,58,237,.5)) drop-shadow(0 0 24px rgba(224,64,251,.3))}.landing-container{background:var(--gradient-card);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-radius:var(--radius-2xl);padding:var(--space-6);width:100%;max-width:480px;box-shadow:var(--shadow-2xl),var(--glow-violet);border:1px solid rgba(124,58,237,.25);position:relative;z-index:1;animation:slideInFromBottom .6s var(--transition-spring)}.landing-container:before{content:"";position:absolute;top:-1px;right:-1px;bottom:-1px;left:-1px;border-radius:var(--radius-2xl);border:1px solid rgba(124,58,237,.3);animation:borderGlow 3s ease-in-out infinite;pointer-events:none}.landing h1{font-family:var(--font-display);background:var(--gradient-game);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:var(--space-3);font-size:clamp(1.75rem,6vw,2.75rem);text-align:center;font-weight:800;letter-spacing:-.5px;filter:drop-shadow(0 0 10px rgba(124,58,237,.4));animation:fadeIn .8s ease-out .2s both}.subtitle{color:var(--text-secondary);text-align:center;margin-bottom:var(--space-6);font-size:clamp(.9375rem,2.5vw,1.1rem);line-height:1.5}.landing-form{display:flex;flex-direction:column;gap:var(--space-4)}.input{padding:var(--space-4);font-size:1rem;border:2px solid rgba(124,58,237,.25);border-radius:var(--radius-md);transition:all var(--transition-base);background:#0a0a1299;width:100%;box-sizing:border-box;color:var(--text-primary)}.input::placeholder{color:var(--text-muted)}.input:focus{outline:none;border-color:var(--neon-violet);box-shadow:0 0 0 3px #7c3aed33,var(--glow-violet)}.room-options{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3)}.option-btn{padding:var(--space-4);background:var(--surface-dark);border:2px solid rgba(124,58,237,.15);border-radius:var(--radius-md);font-size:.9375rem;font-weight:600;color:var(--text-secondary);transition:all var(--transition-base);cursor:pointer;width:100%;min-height:48px}.option-btn:hover{border-color:var(--neon-violet);background:#7c3aed1a;color:var(--text-primary);box-shadow:var(--glow-violet)}.option-btn.active{background:var(--gradient-game);color:#fff;border-color:transparent;box-shadow:var(--shadow-md),var(--glow-violet)}.submit-btn{padding:var(--space-4);background:var(--gradient-game);color:#fff;border:none;border-radius:var(--radius-md);font-family:var(--font-display);font-size:1.0625rem;font-weight:600;text-transform:uppercase;letter-spacing:1px;box-shadow:var(--shadow-md),var(--glow-violet);position:relative;overflow:hidden;transition:all var(--transition-base);width:100%;min-height:52px}.submit-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.15),transparent);transition:left .5s}.submit-btn:hover:not(:disabled):before{left:100%}.submit-btn:hover:not(:disabled){box-shadow:var(--shadow-lg),0 0 30px #7c3aed80,0 0 60px #e040fb40}.submit-btn:disabled{opacity:.6;cursor:not-allowed}.error{color:var(--neon-red);background:#ef44441a;border:1px solid rgba(239,68,68,.25);padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);text-align:center;font-weight:500;font-size:.9375rem}.game-info{margin-top:var(--space-6);padding-top:var(--space-6);border-top:2px solid rgba(124,58,237,.15)}.game-info h3{color:var(--neon-cyan);margin-bottom:var(--space-4);font-size:1rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.game-info ol{color:var(--text-secondary);padding-left:var(--space-5);font-size:.9375rem;line-height:1.6}.game-info ol li::marker{color:var(--neon-violet);font-weight:700}.game-info li{margin-bottom:var(--space-2)}@media (prefers-reduced-motion: reduce){.landing:before,.landing:after{animation:none}.landing-container{animation:none}.landing-container:before{animation:none}.game-logo,.landing h1{animation:none}}@media (max-width: 480px){.landing{padding:var(--space-3);align-items:flex-start;padding-top:var(--space-8)}.landing-container{padding:var(--space-5);border-radius:var(--radius-xl)}.room-options{grid-template-columns:1fr;gap:var(--space-2)}.option-btn{padding:var(--space-3)}}@media (min-width: 640px){.landing-container{padding:var(--space-8)}.input{padding:var(--space-4) var(--space-5);font-size:1.05rem}.submit-btn{padding:var(--space-4) var(--space-6);font-size:1.125rem}}@media (min-width: 768px){.landing-container{padding:var(--space-10);max-width:520px}}@media (min-width: 1280px){.landing-container{max-width:560px;padding:var(--space-12)}}.chat{background:var(--surface-card);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg),0 0 15px #7c3aed1a;border:1px solid rgba(124,58,237,.2);display:flex;flex-direction:column;height:400px;max-height:60vh;transition:height var(--transition-slow);overflow:hidden}.chat.collapsed{height:56px}.chat-header{background:linear-gradient(135deg,#7c3aed40,#e040fb26);color:var(--neon-cyan);padding:var(--space-3) var(--space-4);border-radius:var(--radius-lg) var(--radius-lg) 0 0;display:flex;justify-content:space-between;align-items:center;cursor:pointer;-webkit-user-select:none;user-select:none;transition:all var(--transition-base);min-height:56px;flex-shrink:0;border-bottom:1px solid rgba(124,58,237,.2)}.chat-header:hover{background:linear-gradient(135deg,#7c3aed4d,#e040fb33)}.chat-header h3{font-family:var(--font-display);font-size:1rem;font-weight:600;margin:0;color:var(--neon-cyan);display:flex;align-items:center;gap:var(--space-2);text-transform:uppercase;letter-spacing:1px}.toggle-icon{font-size:.875rem;transition:transform var(--transition-base);color:var(--neon-cyan)}.chat.collapsed .toggle-icon{transform:rotate(180deg)}.chat-messages{flex:1;overflow-y:auto;padding:var(--space-3);display:flex;flex-direction:column;gap:var(--space-2);scroll-behavior:smooth;background:#0a0a124d}.chat-messages::-webkit-scrollbar{width:6px}.chat-messages::-webkit-scrollbar-track{background:#7c3aed1a;border-radius:var(--radius-full)}.chat-messages::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--neon-violet),var(--neon-magenta));border-radius:var(--radius-full)}.chat-messages::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,var(--neon-magenta),var(--neon-violet))}.message{padding:var(--space-3);border-radius:var(--radius-md);background:var(--surface-dark);word-wrap:break-word;word-break:break-word;border:1px solid rgba(124,58,237,.1);animation:slideUp .2s ease-out;max-width:100%}.message.system{background:#7c3aed1a;font-style:italic;text-align:center;color:var(--neon-violet);font-weight:500;border-color:#7c3aed33;font-size:.875rem}.message.confession-reveal{background:linear-gradient(135deg,#ef444433,#e040fb26);border:2px solid var(--neon-red);font-weight:600;color:var(--text-primary);padding:var(--space-4);box-shadow:var(--shadow-md),var(--glow-red);animation:revealSecret .8s ease-out,shakeIntense .6s ease-out .2s,pulseGlow 2s infinite 1s}@keyframes pulseGlow{0%,to{box-shadow:var(--shadow-md),0 0 10px #ef444433}50%{box-shadow:var(--shadow-lg),0 0 25px #ef444459,0 0 50px #e040fb26}}.message-author{font-weight:600;color:var(--neon-cyan);margin-right:var(--space-2);font-size:.9375rem}.message-text{color:var(--text-primary);font-size:.9375rem;line-height:1.5}.chat-input{display:flex;padding:var(--space-3);border-top:1px solid rgba(124,58,237,.15);gap:var(--space-2);background:var(--surface-dark);flex-shrink:0}.chat-input input{flex:1;padding:var(--space-3);border:2px solid rgba(124,58,237,.2);border-radius:var(--radius-md);font-size:.9375rem;transition:all var(--transition-fast);background:#0a0a1299;color:var(--text-primary);min-width:0}.chat-input input:focus{outline:none;border-color:var(--neon-violet);box-shadow:0 0 0 3px #7c3aed26,var(--glow-violet)}.chat-input input::placeholder{color:var(--text-muted)}.chat-input button{padding:var(--space-3) var(--space-4);background:var(--gradient-game);color:#fff;border:none;border-radius:var(--radius-md);font-family:var(--font-display);font-weight:600;cursor:pointer;transition:all var(--transition-base);white-space:nowrap;min-height:44px;text-transform:uppercase;letter-spacing:.5px}.chat-input button:hover:not(:disabled){box-shadow:var(--shadow-md),var(--glow-violet)}.chat-input button:disabled{opacity:.5;cursor:not-allowed}@media (prefers-reduced-motion: reduce){.message,.message.confession-reveal{animation:none}}@media (max-width: 640px){.chat{height:350px;max-height:50vh;border-radius:var(--radius-md)}.chat-header{padding:var(--space-3);border-radius:var(--radius-md) var(--radius-md) 0 0;min-height:48px}.chat-header h3{font-size:.9375rem}.chat-messages{padding:var(--space-2);gap:var(--space-2)}.message{padding:var(--space-2) var(--space-3);font-size:.875rem}.message-author,.message-text{font-size:.875rem}.chat-input{padding:var(--space-2);gap:var(--space-2)}.chat-input input{padding:var(--space-2) var(--space-3);font-size:16px}.chat-input button{padding:var(--space-2) var(--space-3);font-size:.875rem}}@media (min-width: 768px){.chat{height:450px;max-height:70vh}}@media (min-width: 1024px){.chat{height:500px}.chat-messages{padding:var(--space-4);gap:var(--space-3)}.message{padding:var(--space-3) var(--space-4)}.chat-input{padding:var(--space-4);gap:var(--space-3)}.chat-input input{padding:var(--space-3) var(--space-4)}.chat-input button{padding:var(--space-3) var(--space-5)}}@keyframes textGlow{0%,to{text-shadow:0 0 10px rgba(124,58,237,.6),0 0 20px rgba(124,58,237,.4),0 0 40px rgba(224,64,251,.2)}50%{text-shadow:0 0 15px rgba(124,58,237,.8),0 0 30px rgba(124,58,237,.5),0 0 60px rgba(224,64,251,.3)}}@keyframes neonPulse{0%,to{opacity:1;filter:brightness(1)}50%{opacity:.85;filter:brightness(1.2)}}@keyframes slideInFromBottom{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes confessionFadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes confessionSlideDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.confession-form-container{width:100%;max-width:600px;margin:0 auto;padding:var(--space-6);animation:slideInFromBottom .5s ease-out}.confession-form-container h2{font-family:var(--font-display);background:linear-gradient(135deg,var(--neon-violet),var(--neon-magenta),var(--neon-cyan));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin:0 0 var(--space-3) 0;text-align:center;font-size:clamp(1.75rem,5vw,2.25rem);font-weight:800;letter-spacing:-.02em;animation:confessionFadeIn .5s cubic-bezier(.34,1.56,.64,1),textGlow 3s ease-in-out infinite}.confession-info{color:var(--text-secondary);text-align:center;margin-bottom:var(--space-6);font-size:clamp(.9375rem,2vw,1.0625rem);font-family:var(--font-body);line-height:1.6}.confession-form{display:flex;flex-direction:column;gap:var(--space-5)}.confession-textarea{padding:var(--space-4);font-size:1rem;font-family:var(--font-body);border:2px solid rgba(224,64,251,.25);border-radius:var(--radius-lg);resize:vertical;min-height:180px;transition:all var(--transition-base);background:#0a0a1299;color:var(--text-primary);line-height:1.7}.confession-textarea::placeholder{color:var(--text-muted)}.confession-textarea:hover{border-color:#e040fb66}.confession-textarea:focus{outline:none;border-color:var(--neon-magenta);box-shadow:0 0 0 4px #e040fb26,var(--glow-magenta);background:#0a0a12cc}.char-count{text-align:right;color:var(--text-muted);font-size:.8125rem;font-weight:500;font-family:var(--font-body);margin-top:calc(-1 * var(--space-3));transition:color var(--transition-fast)}.char-count.warning{color:var(--neon-amber)}.char-count.error{color:var(--neon-red)}.confession-form .submit-btn{padding:var(--space-4);background:var(--gradient-danger);color:#fff;border:none;border-radius:var(--radius-lg);font-size:1.0625rem;font-weight:700;font-family:var(--font-display);text-transform:uppercase;letter-spacing:.08em;cursor:pointer;transition:all var(--transition-base);box-shadow:0 4px 15px #0000004d,var(--glow-red);min-height:52px;position:relative;overflow:hidden}.confession-form .submit-btn:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(135deg,rgba(255,255,255,.15),transparent);opacity:0;transition:opacity var(--transition-fast)}.confession-form .submit-btn:hover:not(:disabled){transform:translateY(-3px);box-shadow:0 6px 25px #0006,0 0 20px #ef444466,var(--glow-red)}.confession-form .submit-btn:hover:not(:disabled):before{opacity:1}.confession-form .submit-btn:active:not(:disabled){transform:translateY(-1px)}.confession-form .submit-btn:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}.confession-form .warning{background:#f59e0b1a;border:1px solid rgba(245,158,11,.25);color:var(--neon-amber);padding:var(--space-4) var(--space-5);border-radius:var(--radius-lg);text-align:center;font-size:.9375rem;font-weight:600;font-family:var(--font-body);box-shadow:0 4px 15px #0003,var(--glow-amber);animation:confessionSlideDown .4s cubic-bezier(.34,1.56,.64,1),neonPulse 2s ease-in-out infinite;display:flex;align-items:center;justify-content:center;gap:var(--space-3)}.confession-form .warning:before{content:"";flex-shrink:0}.success{background:#10b9811a;border:1px solid rgba(16,185,129,.25);color:var(--neon-green);padding:var(--space-4) var(--space-5);border-radius:var(--radius-lg);text-align:center;font-size:.9375rem;font-weight:600;font-family:var(--font-body);box-shadow:0 4px 15px #0003,var(--glow-green);animation:confessionSlideDown .4s cubic-bezier(.34,1.56,.64,1)}@media (max-width: 640px){.confession-form-container{padding:var(--space-4)}.confession-textarea{min-height:150px;padding:var(--space-3);font-size:1rem}.confession-form .submit-btn{min-height:48px;font-size:1rem;padding:var(--space-3)}.confession-form .warning,.success{padding:var(--space-3) var(--space-4);font-size:.875rem}}@media (max-width: 480px){.confession-form-container{padding:var(--space-3)}.confession-form-container h2{font-size:1.5rem}.confession-info{font-size:.875rem;margin-bottom:var(--space-5)}.confession-form{gap:var(--space-4)}.confession-textarea{min-height:130px;border-radius:var(--radius-md)}.confession-form .submit-btn{border-radius:var(--radius-md)}}@media (min-width: 1024px){.confession-form-container{padding:var(--space-8)}.confession-textarea{min-height:200px;font-size:1.0625rem;padding:var(--space-5)}.confession-form .submit-btn{min-height:56px;font-size:1.125rem}}@media (hover: none) and (pointer: coarse){.confession-textarea{font-size:16px}.confession-form .submit-btn{min-height:52px}.confession-form .submit-btn:hover:not(:disabled){transform:none;box-shadow:0 4px 15px #0000004d,var(--glow-red)}.confession-form .submit-btn:active:not(:disabled){transform:scale(.98)}}@media (prefers-reduced-motion: reduce){.confession-form-container,.confession-form .warning,.success,.confession-form-container h2{animation:none}.confession-form .submit-btn:hover:not(:disabled){transform:none}}.rock-paper-scissors{height:100%;min-height:400px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--space-6);gap:var(--space-8)}.game-status{text-align:center}.game-status p{font-size:clamp(1.125rem,3vw,1.5rem);color:var(--text-secondary);font-weight:500}.result-win{color:var(--neon-green)!important;font-size:clamp(1.5rem,4vw,2rem)!important;font-weight:700!important;text-shadow:0 0 10px var(--glow-green),0 0 20px var(--glow-green);animation:celebrate .5s ease}.result-lose{color:var(--neon-red)!important;font-size:clamp(1.5rem,4vw,2rem)!important;font-weight:700!important;text-shadow:0 0 10px var(--glow-red),0 0 20px var(--glow-red);animation:shake .5s ease}.result-tie{color:var(--neon-amber)!important;font-size:clamp(1.5rem,4vw,2rem)!important;font-weight:700!important;text-shadow:0 0 10px var(--glow-amber),0 0 20px var(--glow-amber)}@keyframes celebrate{0%,to{transform:scale(1)}50%{transform:scale(1.2)}}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-10px)}75%{transform:translate(10px)}}.choices-area{display:flex;align-items:center;justify-content:center;gap:var(--space-8);flex-wrap:wrap}.player-section{text-align:center}.player-section h3{color:var(--neon-cyan);margin-bottom:var(--space-6);font-size:clamp(1rem,2.5vw,1.25rem);font-weight:600;text-shadow:0 0 8px var(--glow-cyan)}.choices{display:flex;gap:var(--space-4);flex-wrap:wrap;justify-content:center}.rock-paper-scissors .choice-btn{background:var(--surface-mid);border:3px solid rgba(240,240,245,.1);border-radius:var(--radius-lg);padding:var(--space-4);display:flex;flex-direction:column;align-items:center;gap:var(--space-2);transition:all var(--transition-base);min-width:90px;cursor:pointer}.rock-paper-scissors .choice-btn:hover{border-color:var(--neon-violet);background:#7c3aed1a;transform:translateY(-4px);box-shadow:0 0 15px var(--glow-violet),0 4px 15px #0000004d}.rock-paper-scissors .choice-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.rock-paper-scissors .choice-btn:disabled:hover{border-color:#f0f0f51a;background:var(--surface-mid);box-shadow:none}.choice-emoji{font-size:clamp(2.5rem,6vw,3.5rem);line-height:1}.choice-emoji.large{font-size:clamp(3.5rem,8vw,5rem)}.choice-name{font-size:clamp(.875rem,2vw,1rem);color:var(--text-secondary);text-transform:capitalize;font-weight:500}.selected-choice,.waiting-choice{display:flex;flex-direction:column;align-items:center;gap:var(--space-2);padding:var(--space-5);background:var(--surface-dark);border-radius:var(--radius-lg);box-shadow:0 8px 25px #0006;min-width:120px}.selected-choice{border:3px solid var(--neon-green);box-shadow:0 0 15px var(--glow-green),0 0 30px var(--glow-green),0 8px 25px #0006;animation:scaleIn .3s ease}.waiting-choice{border:3px solid var(--neon-amber);animation:rpsPulse 1.5s infinite}.waiting-choice.ready{border-color:var(--neon-green);background:#10b98114;box-shadow:0 0 15px var(--glow-green),0 8px 25px #0006;animation:none}@keyframes rpsPulse{0%{opacity:1}50%{opacity:.5}to{opacity:1}}.vs{font-size:clamp(1.5rem,4vw,2rem);font-weight:800;color:var(--neon-amber);text-shadow:0 0 10px var(--glow-amber),0 0 20px var(--glow-amber),0 2px 10px rgba(0,0,0,.4)}@media (max-width: 768px){.rock-paper-scissors{padding:var(--space-4);gap:var(--space-6)}.choices-area{flex-direction:column;gap:var(--space-5)}.vs{transform:rotate(90deg);margin:var(--space-2) 0}.choices{gap:var(--space-3)}.rock-paper-scissors .choice-btn{min-width:80px;padding:var(--space-3)}.selected-choice,.waiting-choice{padding:var(--space-4);min-width:100px}}@media (max-width: 480px){.rock-paper-scissors{padding:var(--space-3);gap:var(--space-5);justify-content:flex-start;padding-top:var(--space-6)}.player-section h3{margin-bottom:var(--space-4)}.choices{gap:var(--space-2)}.rock-paper-scissors .choice-btn{min-width:70px;padding:var(--space-2)}}@media (min-width: 1024px){.rock-paper-scissors{padding:var(--space-8)}.choices-area{gap:var(--space-12)}.rock-paper-scissors .choice-btn{min-width:110px;padding:var(--space-5)}}@media (hover: none) and (pointer: coarse){.rock-paper-scissors .choice-btn{min-height:80px;min-width:80px}.rock-paper-scissors .choice-btn:hover{transform:none;box-shadow:none}.rock-paper-scissors .choice-btn:active{transform:scale(.95);border-color:var(--neon-violet);background:#7c3aed1a}}.drawing-guess-container{display:flex;flex-direction:column;height:100%;min-height:400px;gap:var(--space-4)}.drawing-guess-container .game-info{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--space-3);padding:var(--space-4);background:linear-gradient(135deg,#7c3aed26,#e040fb1a,#00e5ff0d);color:var(--text-primary);border-radius:var(--radius-lg);border:1px solid rgba(124,58,237,.2);box-shadow:0 4px 15px #0000004d}.drawing-guess-container .round-info{font-size:clamp(1rem,2.5vw,1.125rem);font-weight:600;color:var(--text-primary)}.drawing-guess-container .timer{font-size:clamp(1.25rem,3vw,1.5rem);font-weight:700;padding:var(--space-2) var(--space-4);background:#0a0a1266;border-radius:var(--radius-md);min-width:70px;text-align:center;color:var(--text-primary)}.drawing-guess-container .timer.warning{color:var(--neon-red);text-shadow:0 0 10px var(--glow-red);animation:timerPulse 1s infinite}@keyframes timerPulse{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1)}}.word-hint{font-size:clamp(1rem,2.5vw,1.125rem);font-weight:500;color:var(--text-primary)}.drawer-word{background:#7c3aed26;padding:var(--space-2) var(--space-4);border-radius:var(--radius-md);font-weight:600;color:var(--neon-violet);border:1px solid rgba(124,58,237,.2)}.guesser-hint{letter-spacing:4px;font-family:Courier New,monospace;font-size:clamp(1.125rem,3vw,1.375rem);background:#0a0a1266;padding:var(--space-2) var(--space-4);border-radius:var(--radius-md);color:var(--text-primary)}.drawing-guess-container .game-area{display:flex;gap:var(--space-4);flex:1;min-height:0}.drawing-section{flex:1;display:flex;flex-direction:column;gap:var(--space-3);position:relative;min-width:0}.drawing-canvas{background:#fff;border:3px solid rgba(124,58,237,.4);border-radius:var(--radius-lg);cursor:crosshair;box-shadow:0 0 15px var(--glow-violet),0 4px 20px #0000004d;width:100%;max-width:800px;height:auto;aspect-ratio:4 / 3;display:block;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;touch-action:none}.drawing-canvas:not(.drawable){cursor:not-allowed}.drawing-tools{display:flex;gap:var(--space-3);padding:var(--space-3);background:var(--surface-dark);border-radius:var(--radius-lg);align-items:center;flex-wrap:wrap;border:1px solid rgba(124,58,237,.1)}.color-palette{display:flex;gap:var(--space-2);flex-wrap:wrap}.color-btn{width:32px;height:32px;border:2px solid transparent;border-radius:50%;cursor:pointer;transition:all var(--transition-fast);flex-shrink:0}.color-btn:hover{transform:scale(1.1)}.color-btn.active{border-color:var(--neon-violet);box-shadow:0 0 8px var(--glow-violet),0 0 16px var(--glow-violet)}.line-widths{display:flex;gap:var(--space-2);align-items:center}.width-btn{width:40px;height:40px;background:var(--surface-mid);border:2px solid rgba(240,240,245,.1);border-radius:var(--radius-md);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--transition-fast)}.width-btn:hover{border-color:var(--neon-violet)}.width-btn.active{border-color:var(--neon-violet);background:#7c3aed26;box-shadow:0 0 8px var(--glow-violet)}.width-preview{width:20px;border-radius:2px}.drawing-guess-container .clear-btn{margin-left:auto;padding:var(--space-2) var(--space-4);background:var(--neon-red);color:#fff;border:none;border-radius:var(--radius-md);cursor:pointer;font-weight:600;transition:all var(--transition-fast);min-height:40px}.drawing-guess-container .clear-btn:hover{background:#dc2626;box-shadow:0 0 15px var(--glow-red)}.drawing-guess-container .sidebar{width:280px;display:flex;flex-direction:column;gap:var(--space-4);flex-shrink:0}.scores{background:var(--surface-card, rgba(18, 18, 32, .9));border-radius:var(--radius-lg);padding:var(--space-4);box-shadow:0 4px 15px #0000004d;border:1px solid rgba(124,58,237,.1)}.scores h3{margin:0 0 var(--space-4) 0;color:var(--text-primary);font-size:1rem}.drawing-guess-container .score-item{display:flex;justify-content:space-between;padding:var(--space-2) var(--space-3);margin-bottom:var(--space-2);border-radius:var(--radius-md);transition:all var(--transition-fast)}.drawing-guess-container .score-item:hover{background:#f0f0f50d}.drawing-guess-container .score-item.current{background:#7c3aed26;font-weight:600;border:1px solid rgba(124,58,237,.2)}.drawing-guess-container .player-name{flex:1;font-size:.9375rem;color:var(--text-primary)}.drawing-guess-container .player-score{font-weight:700;color:var(--neon-violet);font-size:1rem;text-shadow:0 0 8px var(--glow-violet)}.chat-section{flex:1;background:var(--surface-card, rgba(18, 18, 32, .9));border-radius:var(--radius-lg);padding:var(--space-4);box-shadow:0 4px 15px #0000004d;display:flex;flex-direction:column;min-height:200px;border:1px solid rgba(124,58,237,.1)}.drawing-guess-container .chat-messages{flex:1;overflow-y:auto;margin-bottom:var(--space-3);padding:var(--space-3);background:#0a0a1266;border-radius:var(--radius-md)}.chat-message{margin-bottom:var(--space-2);padding:var(--space-2);font-size:.875rem;color:var(--text-primary)}.chat-message.system{text-align:center;font-style:italic;color:var(--text-muted)}.chat-message.success{color:var(--neon-green);font-weight:600;background:#10b98126;border-radius:var(--radius-md)}.guess-msg{color:var(--text-secondary)}.guess-input{display:flex;gap:var(--space-2)}.guess-input input{flex:1;padding:var(--space-3);border:2px solid rgba(240,240,245,.1);border-radius:var(--radius-md);font-size:.9375rem;background:var(--surface-dark);color:var(--text-primary)}.guess-input input:focus{outline:none;border-color:var(--neon-violet);box-shadow:0 0 10px var(--glow-violet),0 0 20px var(--glow-violet)}.guess-input button{padding:var(--space-3) var(--space-4);background:var(--gradient-game);color:#fff;border:none;border-radius:var(--radius-md);cursor:pointer;font-weight:600;transition:all var(--transition-fast);min-height:44px}.guess-input button:hover:not(:disabled){box-shadow:0 0 15px var(--glow-violet),0 4px 15px #0000004d}.guess-input button:disabled{opacity:.5;cursor:not-allowed}@media (max-width: 900px){.drawing-guess-container .game-area{flex-direction:column}.drawing-guess-container .sidebar{width:100%;flex-direction:row;flex-wrap:wrap}.scores,.chat-section{flex:1;min-width:220px}.chat-section{min-height:180px}}@media (max-width: 640px){.drawing-guess-container .game-info{flex-direction:column;text-align:center;padding:var(--space-3)}.drawing-tools{padding:var(--space-2);gap:var(--space-2)}.color-btn{width:28px;height:28px}.width-btn{width:36px;height:36px}.drawing-guess-container .sidebar{flex-direction:column}.scores,.chat-section{min-width:100%}.guesser-hint{letter-spacing:3px}}@media (max-width: 480px){.drawing-guess-container{gap:var(--space-3)}.scores,.chat-section{padding:var(--space-3)}.drawing-guess-container .chat-messages{padding:var(--space-2)}.guess-input{flex-direction:column}.guess-input button{width:100%}}@media (min-width: 1024px){.drawing-guess-container .sidebar{width:320px}.drawing-guess-container .game-area{gap:var(--space-5)}}@media (hover: none) and (pointer: coarse){.drawing-canvas{touch-action:none}.color-btn,.width-btn{min-width:44px;min-height:44px}}.word-battle-container{display:flex;flex-direction:column;height:100%;min-height:400px;gap:var(--space-4)}.word-battle-container .game-header{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--space-3);padding:var(--space-4);background:linear-gradient(135deg,#e040fb26,#7c3aed1a,#00e5ff0d);color:var(--text-primary);border-radius:var(--radius-lg);border:1px solid rgba(224,64,251,.2);box-shadow:0 4px 15px #0000004d}.round-info{font-size:clamp(1rem,2.5vw,1.125rem);font-weight:600;color:var(--text-primary)}.word-battle-container .timer{font-size:clamp(1.25rem,3vw,1.5rem);font-weight:700;padding:var(--space-2) var(--space-4);background:#0a0a1266;border-radius:var(--radius-md);min-width:70px;text-align:center;color:var(--text-primary)}.word-battle-container .timer.warning{color:var(--neon-amber);text-shadow:0 0 10px var(--glow-amber);animation:wordBattlePulse 1s infinite}.timer[data-time="10"],.timer[data-time="9"],.timer[data-time="8"],.timer[data-time="7"],.timer[data-time="6"],.timer[data-time="5"],.timer[data-time="4"],.timer[data-time="3"],.timer[data-time="2"],.timer[data-time="1"]{color:var(--neon-amber);text-shadow:0 0 10px var(--glow-amber),0 0 20px var(--glow-amber);animation:wordBattlePulse 1s infinite}@keyframes wordBattlePulse{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1)}}.word-battle-container .player-score{font-size:clamp(1rem,2.5vw,1.125rem);font-weight:600;color:var(--text-primary)}.score-value{font-size:clamp(1.25rem,3vw,1.5rem);color:var(--neon-amber);text-shadow:0 0 10px var(--glow-amber),2px 2px 4px rgba(0,0,0,.4)}.word-battle-container .game-area{display:flex;gap:var(--space-4);flex:1;min-height:0}.main-section{flex:1;display:flex;flex-direction:column;gap:var(--space-4);min-width:0}.letters-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-3);padding:var(--space-4);background:var(--surface-dark);border-radius:var(--radius-lg);box-shadow:0 4px 20px #0000004d;border:1px solid rgba(224,64,251,.1)}.letter-btn{aspect-ratio:1;font-size:clamp(1.5rem,4vw,2rem);font-weight:700;background:var(--surface-mid);border:3px solid rgba(240,240,245,.1);border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-fast);color:var(--text-primary);min-height:50px}.letter-btn:hover:not(:disabled){border-color:var(--neon-magenta);box-shadow:0 0 15px var(--glow-magenta)}.letter-btn.selected{background:linear-gradient(135deg,var(--neon-magenta),var(--neon-violet));color:#fff;border-color:var(--neon-magenta);transform:scale(.95);box-shadow:0 0 20px var(--glow-magenta)}.letter-btn:disabled{opacity:.5;cursor:not-allowed}.word-input-section{background:var(--surface-dark);padding:var(--space-4);border-radius:var(--radius-lg);box-shadow:0 4px 15px #0000004d;border:1px solid rgba(224,64,251,.1)}.word-display{width:100%;padding:var(--space-4);font-size:clamp(1.25rem,3vw,1.5rem);font-weight:700;text-align:center;border:3px solid rgba(240,240,245,.1);border-radius:var(--radius-md);background:#0a0a1299;letter-spacing:4px;margin-bottom:var(--space-3);color:var(--text-primary);text-transform:uppercase}.word-controls{display:flex;gap:var(--space-3)}.word-battle-container .clear-btn,.word-battle-container .submit-btn{flex:1;padding:var(--space-3) var(--space-4);font-size:1rem;font-weight:600;border:none;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);min-height:44px}.word-battle-container .clear-btn{background:var(--surface-mid);color:var(--text-secondary);border:1px solid rgba(240,240,245,.1)}.word-battle-container .clear-btn:hover:not(:disabled){background:#f0f0f51a;border-color:#f0f0f533}.word-battle-container .submit-btn{background:linear-gradient(135deg,var(--neon-violet),var(--neon-magenta));color:#fff;box-shadow:0 0 10px var(--glow-violet)}.word-battle-container .submit-btn:hover:not(:disabled){box-shadow:0 0 20px var(--glow-violet),0 0 30px var(--glow-magenta)}.word-battle-container .clear-btn:disabled,.word-battle-container .submit-btn:disabled{opacity:.5;cursor:not-allowed}.points-info{background:var(--surface-card, rgba(18, 18, 32, .9));padding:var(--space-4);border-radius:var(--radius-lg);box-shadow:0 4px 15px #0000004d;border:1px solid rgba(224,64,251,.1)}.points-info h4{margin:0 0 var(--space-3) 0;color:var(--text-primary);font-size:.9375rem}.points-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-2);font-size:.8125rem}.points-grid span{padding:var(--space-2);background:#f0f0f50f;border-radius:var(--radius-sm);text-align:center;font-weight:500;color:var(--text-secondary)}.word-battle-container .sidebar{width:300px;display:flex;flex-direction:column;gap:var(--space-4);flex-shrink:0}.word-battle-container .scoreboard{background:var(--surface-card, rgba(18, 18, 32, .9));padding:var(--space-4);border-radius:var(--radius-lg);box-shadow:0 4px 15px #0000004d;border:1px solid rgba(224,64,251,.1)}.word-battle-container .scoreboard h3{margin:0 0 var(--space-4) 0;color:var(--text-primary);font-size:1rem}.word-battle-container .score-item{display:flex;justify-content:space-between;align-items:center;padding:var(--space-2) var(--space-3);margin-bottom:var(--space-2);border-radius:var(--radius-md);transition:all var(--transition-fast)}.word-battle-container .score-item:hover{background:#f0f0f50d}.word-battle-container .score-item.current{background:#fbbf241a;border:1px solid rgba(251,191,36,.3);font-weight:600;box-shadow:0 0 15px var(--glow-amber)}.word-battle-container .player-name{flex:1;font-size:.9375rem;color:var(--text-primary)}.word-battle-container .player-stats{color:var(--text-muted);font-size:.75rem;margin-right:var(--space-2)}.word-battle-container .player-score{font-weight:700;color:var(--neon-magenta);font-size:1.0625rem;text-shadow:0 0 8px var(--glow-magenta)}.submissions-section{background:var(--surface-card, rgba(18, 18, 32, .9));padding:var(--space-4);border-radius:var(--radius-lg);box-shadow:0 4px 15px #0000004d;max-height:220px;display:flex;flex-direction:column;border:1px solid rgba(224,64,251,.1)}.submissions-section h3{margin:0 0 var(--space-3) 0;color:var(--text-primary);font-size:.9375rem;flex-shrink:0}.submissions-list{flex:1;overflow-y:auto}.submission-item{padding:var(--space-2);margin-bottom:var(--space-2);border-radius:var(--radius-md);font-size:.8125rem;display:flex;gap:var(--space-2);align-items:center}.submission-item.success{background:#10b98126}.submission-item.error{background:#ef444426}.submission-item.roundEnd{background:#7c3aed26;justify-content:center;font-weight:600;color:var(--text-primary)}.submission-player{font-weight:600;color:var(--text-secondary)}.submission-word{font-weight:500;color:var(--text-primary);text-transform:uppercase}.submission-result{margin-left:auto;font-weight:600}.submission-result.success{color:var(--neon-green);text-shadow:0 0 6px var(--glow-green)}.submission-result.error{color:var(--neon-red);text-shadow:0 0 6px var(--glow-red)}.used-words{background:var(--surface-card, rgba(18, 18, 32, .9));padding:var(--space-4);border-radius:var(--radius-lg);box-shadow:0 4px 15px #0000004d;flex:1;min-height:120px;display:flex;flex-direction:column;border:1px solid rgba(224,64,251,.1)}.used-words h3{margin:0 0 var(--space-3) 0;color:var(--text-primary);font-size:.9375rem;flex-shrink:0}.words-list{flex:1;overflow-y:auto;display:flex;flex-wrap:wrap;gap:var(--space-2);align-content:flex-start}.used-word{padding:var(--space-1) var(--space-2);background:#f0f0f514;border-radius:var(--radius-sm);font-size:.75rem;color:var(--text-muted);text-transform:uppercase}.my-words{background:var(--surface-card, rgba(18, 18, 32, .9));padding:var(--space-4);border-radius:var(--radius-lg);box-shadow:0 4px 15px #0000004d;border:1px solid rgba(224,64,251,.1)}.my-words h4{margin:0 0 var(--space-3) 0;color:var(--text-primary);font-size:.9375rem}.my-words-list{display:flex;flex-wrap:wrap;gap:var(--space-2);max-height:80px;overflow-y:auto}.my-word{padding:var(--space-1) var(--space-3);background:var(--gradient-success);border-radius:var(--radius-full);font-size:.8125rem;font-weight:500;color:#fff}.word-points{color:#fffc;font-weight:600;margin-left:var(--space-1)}@media (max-width: 900px){.word-battle-container .game-area{flex-direction:column}.word-battle-container .sidebar{width:100%;flex-direction:row;flex-wrap:wrap}.word-battle-container .scoreboard,.submissions-section,.used-words{flex:1;min-width:200px}.submissions-section{max-height:180px}}@media (max-width: 640px){.word-battle-container .game-header{flex-direction:column;text-align:center;padding:var(--space-3)}.letters-grid{gap:var(--space-2);padding:var(--space-3)}.letter-btn{font-size:clamp(1.25rem,5vw,1.5rem);min-height:44px}.word-display{font-size:1.25rem;padding:var(--space-3);letter-spacing:3px}.word-controls{flex-direction:column;gap:var(--space-2)}.word-battle-container .sidebar{flex-direction:column}.word-battle-container .scoreboard,.submissions-section,.used-words{min-width:100%}.points-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width: 480px){.word-battle-container{gap:var(--space-3)}.word-input-section,.points-info,.word-battle-container .scoreboard,.submissions-section,.used-words,.my-words{padding:var(--space-3)}}@media (min-width: 1024px){.word-battle-container .sidebar{width:340px}.word-battle-container .game-area{gap:var(--space-5)}}.truth-or-dare{width:100%;height:100%;min-height:400px;display:flex;flex-direction:column;background:linear-gradient(135deg,var(--surface-darkest) 0%,#16103a 50%,var(--surface-mid) 100%);border-radius:var(--radius-xl);overflow:hidden;position:relative;box-shadow:0 10px 40px #00000080}.truth-or-dare:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at 20% 20%,rgba(124,58,237,.2) 0%,transparent 50%),radial-gradient(circle at 80% 80%,rgba(224,64,251,.15) 0%,transparent 50%),radial-gradient(circle at 50% 50%,rgba(0,229,255,.05) 0%,transparent 60%);pointer-events:none}.truth-or-dare .game-header{padding:var(--space-4) var(--space-5);background:linear-gradient(135deg,#0a0a1299,#0a0a1266);text-align:center;color:var(--text-primary);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid rgba(124,58,237,.2);position:relative;z-index:1}.truth-or-dare .game-header h1{margin:0 0 var(--space-3) 0;font-size:clamp(1.5rem,5vw,2.25rem);font-weight:800;background:linear-gradient(135deg,var(--neon-amber),#f59e0b,var(--neon-magenta));background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;letter-spacing:1px}.current-turn{font-size:clamp(1rem,3vw,1.25rem);color:var(--neon-amber);font-weight:600;text-shadow:0 0 10px var(--glow-amber),0 2px 10px rgba(251,191,36,.3);padding:var(--space-2) var(--space-4);background:#fbbf2414;border-radius:var(--radius-full);display:inline-block;border:1px solid rgba(251,191,36,.2)}.truth-or-dare .game-content{flex:1;display:flex;padding:var(--space-4);gap:var(--space-4);overflow:auto;position:relative;z-index:1}.truth-or-dare .main-area{flex:1;display:flex;align-items:center;justify-content:center;padding:0;background:transparent;border:none;box-shadow:none;min-height:auto}.truth-or-dare .sidebar{width:280px;background:#0a0a1280;border-radius:var(--radius-xl);padding:var(--space-5);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(124,58,237,.15);box-shadow:0 8px 25px #0000004d}.phase-content{text-align:center;color:var(--text-primary);width:100%;max-width:600px}.phase-content h2{font-size:clamp(1.5rem,4vw,2rem);margin-bottom:var(--space-5);background:linear-gradient(135deg,var(--neon-amber),#f59e0b);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;font-weight:700;letter-spacing:.5px}.phase-content p{font-size:clamp(1rem,2.5vw,1.25rem);margin-bottom:var(--space-5);opacity:.9;line-height:1.6;color:var(--text-primary)}.spinner-container,.tod-spinner-container{position:relative;width:clamp(240px,50vw,320px);height:clamp(240px,50vw,320px);margin:var(--space-6) auto}.truth-or-dare .spinner,.tod-spinner{width:100%;height:100%;border-radius:50%;position:relative;overflow:hidden;box-shadow:0 0 0 6px #7c3aed4d,0 0 30px #7c3aed33,0 15px 35px #0006,inset 0 0 20px #0003;transition:transform var(--transition-slow);background:conic-gradient(from 0deg,#ef4444,#ef4444 90deg,#3b82f6 90deg,#3b82f6 180deg,#10b981 180deg,#10b981 270deg,#f59e0b 270deg,#f59e0b 360deg);animation:none;border:none}.truth-or-dare .spinner.spinning,.tod-spinner.spinning{animation:todSpin 3s cubic-bezier(.17,.67,.83,.67)}@keyframes todSpin{0%{transform:rotate(0)}to{transform:rotate(2160deg)}}.tod-spinner-segment{position:absolute;width:50%;height:50%;transform-origin:right bottom;display:flex;align-items:center;justify-content:center}.spinner-segment:nth-child(1),.tod-spinner-segment:nth-child(1){top:0;left:0;background:linear-gradient(135deg,#ef4444,#dc2626)}.spinner-segment:nth-child(2),.tod-spinner-segment:nth-child(2){top:0;right:0;background:linear-gradient(135deg,#3b82f6,#2563eb)}.spinner-segment:nth-child(3),.tod-spinner-segment:nth-child(3){bottom:0;right:0;background:linear-gradient(135deg,#10b981,#059669)}.spinner-segment:nth-child(4),.tod-spinner-segment:nth-child(4){bottom:0;left:0;background:linear-gradient(135deg,#f59e0b,#d97706)}.segment-text,.tod-segment-text{font-weight:700;font-size:clamp(1rem,2vw,1.25rem);color:#fff;text-shadow:0 2px 8px rgba(0,0,0,.4);transform:rotate(-45deg);letter-spacing:.5px}.tod-spinner-arrow{position:absolute;top:-20px;left:50%;transform:translate(-50%);font-size:clamp(1.75rem,4vw,2.25rem);color:var(--neon-amber);text-shadow:0 0 15px var(--glow-amber),0 3px 15px rgba(251,191,36,.5);z-index:10;filter:drop-shadow(0 0 10px rgba(251,191,36,.3))}.spin-result{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:clamp(1.5rem,4vw,2rem);font-weight:800;color:#fff;text-shadow:0 4px 20px rgba(0,0,0,.6);animation:bounceIn .6s ease;background:#0a0a1299;padding:var(--space-3) var(--space-5);border-radius:var(--radius-lg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(124,58,237,.3)}@keyframes bounceIn{0%,to{transform:translate(-50%,-50%) scale(1)}50%{transform:translate(-50%,-50%) scale(1.15)}}.spin-button{padding:var(--space-4) var(--space-8);font-size:clamp(1rem,3vw,1.25rem);font-weight:700;background:linear-gradient(135deg,#fbbf24,#f59e0b,#ef4444);color:#fff;border:none;border-radius:var(--radius-full);cursor:pointer;transition:all var(--transition-base);box-shadow:0 4px 15px #0000004d,0 0 20px #fbbf244d,inset 0 1px #fff3;margin-bottom:var(--space-5);position:relative;overflow:hidden;letter-spacing:.5px;min-height:52px}.spin-button:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s}.spin-button:hover:not(:disabled){box-shadow:0 6px 20px #0006,0 0 40px #fbbf2466,0 0 60px #ef444433}.spin-button:hover:not(:disabled):before{left:100%}.spin-button:disabled{opacity:.5;cursor:not-allowed}.choice-buttons{display:flex;gap:var(--space-4);justify-content:center;margin-top:var(--space-6);flex-wrap:wrap}.choice-btn{padding:var(--space-5) var(--space-8);font-size:clamp(1rem,3vw,1.25rem);font-weight:700;color:#fff;border:none;border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-base);box-shadow:0 4px 15px #0000004d;position:relative;overflow:hidden;letter-spacing:.5px;min-width:140px;min-height:56px}.choice-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s}.choice-btn.truth{background:linear-gradient(135deg,#ef4444,#dc2626,#b91c1c);box-shadow:0 4px 15px #0000004d,0 0 20px #ef44444d}.choice-btn.dare{background:linear-gradient(135deg,#10b981,#059669,#047857);box-shadow:0 4px 15px #0000004d,0 0 20px #10b9814d}.choice-btn:hover{transform:translateY(-3px) scale(1.02)}.choice-btn:hover:before{left:100%}.choice-btn.truth:hover{box-shadow:0 6px 20px #0006,0 0 40px #ef444480,0 0 60px #ef444433}.choice-btn.dare:hover{box-shadow:0 6px 20px #0006,0 0 40px #10b98180,0 0 60px #10b98133}.task-container{background:#0a0a1280;border-radius:var(--radius-xl);padding:var(--space-6);backdrop-filter:blur(30px);-webkit-backdrop-filter:blur(30px);max-width:600px;margin:0 auto;border:1px solid rgba(124,58,237,.2);box-shadow:0 10px 40px #0006;width:100%}.task-container.spectator{opacity:.9;border:1px solid rgba(251,191,36,.3)}.task-type{font-size:clamp(1.125rem,3vw,1.375rem);font-weight:800;margin-bottom:var(--space-5);padding:var(--space-3) var(--space-6);border-radius:var(--radius-full);display:inline-block;color:#fff;text-shadow:0 2px 10px rgba(0,0,0,.3);letter-spacing:.5px}.task-type.truth{background:linear-gradient(135deg,#ef4444,#dc2626);box-shadow:0 4px 15px #0000004d,0 0 20px #ef44444d}.task-type.dare{background:linear-gradient(135deg,#10b981,#059669);box-shadow:0 4px 15px #0000004d,0 0 20px #10b9814d}.task-text{font-size:clamp(1rem,2.5vw,1.25rem);line-height:1.6;margin:var(--space-5) 0;font-weight:500;color:var(--text-primary)}.timer{font-size:clamp(1.25rem,3vw,1.5rem);color:var(--neon-amber);font-weight:800;margin:var(--space-5) 0;text-shadow:0 0 15px var(--glow-amber),0 0 30px var(--glow-amber),0 3px 15px rgba(251,191,36,.4);background:#fbbf2414;padding:var(--space-3) var(--space-5);border-radius:var(--radius-lg);border:1px solid rgba(251,191,36,.2);display:inline-block}.action-buttons{display:flex;gap:var(--space-4);justify-content:center;margin-top:var(--space-6);flex-wrap:wrap}.complete-btn,.pass-btn{padding:var(--space-4) var(--space-6);font-size:clamp(1rem,2.5vw,1.125rem);font-weight:600;border:none;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-base);letter-spacing:.3px;position:relative;overflow:hidden;min-height:48px}.complete-btn:before,.pass-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s}.complete-btn{background:var(--gradient-success);color:#fff;box-shadow:0 4px 15px #0000004d,0 0 15px #10b98133}.complete-btn:hover:not(:disabled){box-shadow:0 6px 20px #0006,0 0 30px #10b98166}.complete-btn:hover:not(:disabled):before{left:100%}.pass-btn{background:linear-gradient(135deg,var(--neon-red),#dc2626);color:#fff;box-shadow:0 4px 15px #0000004d,0 0 15px #ef444433}.pass-btn:hover:not(:disabled){box-shadow:0 6px 20px #0006,0 0 30px #ef444466}.pass-btn:hover:not(:disabled):before{left:100%}.pass-btn:disabled{opacity:.5;cursor:not-allowed}.vote-buttons{display:flex;gap:var(--space-4);justify-content:center;margin-top:var(--space-6);flex-wrap:wrap}.vote-yes,.vote-no{padding:var(--space-4) var(--space-8);font-size:clamp(1rem,3vw,1.25rem);font-weight:700;border:none;border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-base);color:#fff;letter-spacing:.5px;position:relative;overflow:hidden;min-width:120px;min-height:52px}.vote-yes:before,.vote-no:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s}.vote-yes{background:var(--gradient-success);box-shadow:0 4px 15px #0000004d,0 0 20px #10b9814d}.vote-no{background:linear-gradient(135deg,var(--neon-red),#dc2626);box-shadow:0 4px 15px #0000004d,0 0 20px #ef44444d}.vote-yes:hover,.vote-no:hover{transform:translateY(-2px) scale(1.02)}.vote-yes:hover:before,.vote-no:hover:before{left:100%}.vote-yes:hover{box-shadow:0 6px 20px #0006,0 0 40px #10b98180}.vote-no:hover{box-shadow:0 6px 20px #0006,0 0 40px #ef444480}.voted-message{font-size:clamp(1rem,2.5vw,1.125rem);color:var(--neon-green);margin-top:var(--space-5);font-weight:600;text-shadow:0 0 10px var(--glow-green),0 2px 10px rgba(16,185,129,.3)}.voting-progress{font-size:clamp(1rem,2.5vw,1.25rem);color:var(--neon-amber);margin-top:var(--space-5);font-weight:600;text-shadow:0 0 10px var(--glow-amber),0 2px 10px rgba(251,191,36,.3)}.task-reminder{background:#0a0a1280;border-radius:var(--radius-lg);padding:var(--space-5);margin:var(--space-5) 0;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(124,58,237,.15)}.vote-results{background:#0a0a1280;border-radius:var(--radius-lg);padding:var(--space-5);margin:var(--space-5) 0;animation:slideIn .6s ease;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(124,58,237,.2)}@keyframes slideIn{0%{opacity:0;transform:translateY(-30px)}to{opacity:1;transform:translateY(0)}}.vote-results h2{color:var(--neon-amber);margin-bottom:var(--space-4);font-weight:700;font-size:clamp(1.125rem,3vw,1.375rem);text-shadow:0 0 10px var(--glow-amber),0 2px 10px rgba(251,191,36,.3)}.vote-results p{font-size:clamp(1rem,2.5vw,1.125rem);margin:var(--space-3) 0;font-weight:500;color:var(--text-primary)}.truth-or-dare .scoreboard{color:var(--text-primary)}.truth-or-dare .scoreboard h3{font-size:clamp(1.125rem,3vw,1.375rem);margin-bottom:var(--space-4);text-align:center;font-weight:700;color:var(--neon-amber);text-shadow:0 0 10px var(--glow-amber),0 2px 10px rgba(251,191,36,.3)}.score-list{display:flex;flex-direction:column;gap:var(--space-3);margin-bottom:var(--space-5)}.truth-or-dare .score-item{background:#0a0a1266;border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);display:flex;justify-content:space-between;align-items:center;transition:all var(--transition-fast);-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);border:1px solid rgba(124,58,237,.1)}.truth-or-dare .score-item:hover{background:#7c3aed1a}.truth-or-dare .score-item.current-player{background:#fbbf241a;border:2px solid var(--neon-amber);box-shadow:0 0 20px var(--glow-amber)}.truth-or-dare .player-name{font-weight:600;font-size:1rem;color:var(--text-primary)}.player-stats{display:flex;gap:var(--space-4);align-items:center}.truth-or-dare .score{font-weight:700;color:var(--neon-green);font-size:1rem;text-shadow:0 0 8px var(--glow-green)}.passes{font-size:.875rem;opacity:.8;font-weight:500;color:var(--text-secondary)}.truth-or-dare .game-info{padding-top:var(--space-4);border-top:1px solid rgba(124,58,237,.15);display:flex;justify-content:space-between;flex-wrap:wrap;gap:var(--space-2);font-size:.9375rem;opacity:.9;font-weight:500;color:var(--text-secondary)}@media (max-width: 768px){.truth-or-dare .game-content{flex-direction:column;padding:var(--space-3);gap:var(--space-3)}.truth-or-dare .sidebar{width:100%;order:2;padding:var(--space-4)}.truth-or-dare .main-area{order:1}.spinner-container,.tod-spinner-container{width:clamp(200px,60vw,260px);height:clamp(200px,60vw,260px);margin:var(--space-4) auto}.choice-buttons,.vote-buttons,.action-buttons{flex-direction:column;gap:var(--space-3)}.choice-btn,.vote-yes,.vote-no{width:100%;padding:var(--space-4);min-width:auto}.complete-btn,.pass-btn{width:100%}.truth-or-dare .game-header{padding:var(--space-3) var(--space-4)}.task-container{padding:var(--space-4)}.truth-or-dare .game-info{flex-direction:column;text-align:center}}@media (max-width: 480px){.truth-or-dare{border-radius:var(--radius-lg)}.spinner-container{width:clamp(180px,65vw,220px);height:clamp(180px,65vw,220px)}.spin-button{width:100%;padding:var(--space-3) var(--space-5)}}@media (min-width: 1024px){.truth-or-dare .sidebar{width:320px}.truth-or-dare .game-content{padding:var(--space-6);gap:var(--space-6)}}@keyframes scaleInBounce{0%{opacity:0;transform:scale(.9)}60%{opacity:1;transform:scale(1.02)}to{opacity:1;transform:scale(1)}}.game-container{width:100%;height:100%;display:flex;flex-direction:column;animation:scaleInBounce .5s cubic-bezier(.34,1.56,.64,1);border-radius:var(--radius-lg);overflow:hidden;background:var(--surface-mid);border:1px solid rgba(124,58,237,.2);box-shadow:0 4px 25px #00000080,0 0 15px #7c3aed14}.game-header{background:linear-gradient(135deg,#7c3aed26,#e040fb1a);color:#fff;padding:var(--space-4) var(--space-5);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--space-3);flex-shrink:0;border-bottom:1px solid rgba(124,58,237,.15);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.game-header h2{font-family:var(--font-display);font-size:clamp(1.125rem,3vw,1.375rem);font-weight:700;margin:0;display:flex;align-items:center;gap:var(--space-2);color:#fff}.game-players{display:flex;gap:var(--space-3);font-size:.9375rem;flex-wrap:wrap}.game-players span{padding:var(--space-2) var(--space-3);background:#0a0a1266;border:1px solid rgba(124,58,237,.3);border-radius:var(--radius-full);transition:all var(--transition-fast);font-weight:500;font-family:var(--font-body);color:var(--text-secondary);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.game-players .current-player{background:#7c3aed33;border-color:var(--neon-violet);color:#fff;font-weight:700;transform:scale(1.02);box-shadow:0 2px 12px #7c3aed4d,var(--glow-violet)}.game-content{flex:1;background:#0a0a124d;padding:var(--space-5);overflow:hidden;display:flex;flex-direction:column;min-height:0}@media (max-width: 768px){.game-container{border-radius:var(--radius-md)}.game-header{padding:var(--space-3) var(--space-4);flex-direction:column;text-align:center}.game-header h2{font-size:1.125rem;justify-content:center}.game-players{justify-content:center;gap:var(--space-2)}.game-players span{padding:var(--space-1) var(--space-3);font-size:.875rem}.game-content{padding:var(--space-4)}}@media (max-width: 480px){.game-container{border-radius:var(--radius-sm);box-shadow:0 4px 15px #00000080}.game-header{padding:var(--space-3);gap:var(--space-2)}.game-header h2{font-size:1rem}.game-players{width:100%;gap:var(--space-2)}.game-players span{flex:1;text-align:center;padding:var(--space-1) var(--space-2);font-size:.8125rem}.game-content{padding:var(--space-3)}}@media (min-width: 1024px){.game-header{padding:var(--space-5) var(--space-6)}.game-players{gap:var(--space-4)}.game-players span{padding:var(--space-2) var(--space-4);font-size:1rem}.game-content{padding:var(--space-6)}}@media (min-width: 1280px){.game-header{padding:var(--space-5) var(--space-8)}.game-content{padding:var(--space-8)}}@media (prefers-reduced-motion: reduce){.game-container{animation:none}.game-players .current-player{transform:none}}.game-selector{padding:var(--space-4);max-width:1200px;margin:0 auto}.selector-header{margin-bottom:var(--space-5)}.selector-header h2{font-size:clamp(1.125rem,3vw,1.375rem);font-weight:600;color:var(--text-primary);font-family:var(--font-display);margin:0}.game-pool-selector .selector-info{font-size:.8125rem;color:var(--text-muted);margin:var(--space-2) 0;line-height:1.5}.games-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:var(--space-4)}.game-card{background:var(--surface-dark);border:2px solid rgba(124,58,237,.15);border-radius:var(--radius-lg);padding:var(--space-5);cursor:pointer;transition:all var(--transition-base);position:relative;display:flex;flex-direction:column;min-height:140px}.game-card:hover{border-color:var(--neon-violet);background:#7c3aed14;box-shadow:0 0 15px var(--glow-violet),0 4px 15px #0000004d}.game-card.selected{border-color:var(--neon-violet);background:#7c3aed1f;box-shadow:0 0 20px var(--glow-violet),0 0 40px #7c3aed26}.game-card.non-interactive{cursor:default}.game-card.non-interactive:hover{transform:none;border-color:#7c3aed26;box-shadow:none;background:var(--surface-dark)}.game-icon{font-size:2.25rem;margin-bottom:var(--space-3);display:block;line-height:1}.game-name{font-size:1.0625rem;font-weight:600;margin:0 0 var(--space-2) 0;color:var(--text-primary)}.game-description{font-size:.875rem;color:var(--text-secondary);margin:0;line-height:1.5;flex:1}.selected-indicator{position:absolute;top:var(--space-3);right:var(--space-3);width:24px;height:24px;background:var(--gradient-game);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:700;box-shadow:0 0 10px var(--glow-violet)}.game-pool-selector{padding:var(--space-4)}.pool-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--space-4);margin:var(--space-5) 0}.pool-card{display:flex;align-items:flex-start;padding:var(--space-4);background:var(--surface-dark);border:2px solid rgba(124,58,237,.15);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-base);gap:var(--space-3)}.pool-card:hover{border-color:var(--neon-violet);background:#7c3aed14;box-shadow:0 0 12px var(--glow-violet)}.pool-card.non-interactive{cursor:default}.pool-card.non-interactive:hover{border-color:#7c3aed26;background:var(--surface-dark);box-shadow:none}.checkbox-area{margin-top:2px;flex-shrink:0}.custom-checkbox{width:22px;height:22px;border:2px solid var(--neon-violet);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;transition:all var(--transition-fast);background:var(--surface-dark)}.custom-checkbox.checked{background:var(--gradient-game);border-color:transparent;box-shadow:0 0 8px var(--glow-violet)}.checkmark{color:#fff;font-size:.875rem;font-weight:700}.game-content{flex:1;min-width:0}.pool-card .game-icon{font-size:1.5rem;margin-bottom:var(--space-2)}.pool-card .game-name{font-size:.9375rem;font-weight:600;margin:0 0 var(--space-2) 0;color:var(--text-primary)}.pool-card .game-description{font-size:.8125rem;color:var(--text-secondary);line-height:1.4;margin:0}.selected-count{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:#7c3aed1f;border:1px solid rgba(124,58,237,.2);border-radius:var(--radius-md);margin:var(--space-4) 0;font-size:.9375rem;color:var(--neon-violet);font-weight:500}.pool-actions{display:flex;gap:var(--space-2);flex-wrap:wrap}.select-all-btn,.clear-all-btn{padding:var(--space-2) var(--space-3);border:2px solid rgba(124,58,237,.4);background:var(--surface-dark);color:var(--neon-violet);border-radius:var(--radius-md);font-size:.875rem;font-weight:500;cursor:pointer;transition:all var(--transition-fast)}.select-all-btn:hover,.clear-all-btn:hover{background:var(--gradient-game);color:#fff;border-color:transparent;box-shadow:0 0 12px var(--glow-violet)}.update-pool-btn{display:flex;align-items:center;justify-content:center;gap:var(--space-2);width:100%;max-width:400px;margin:var(--space-6) auto;padding:var(--space-4);background:var(--gradient-game);color:#fff;border:none;border-radius:var(--radius-md);font-size:1rem;font-weight:600;cursor:pointer;transition:all var(--transition-base);min-height:52px}.update-pool-btn:hover:not(:disabled){box-shadow:0 0 25px var(--glow-violet),0 4px 20px #0000004d;transform:translateY(-2px)}.update-pool-btn:disabled{opacity:.5;cursor:not-allowed}.loading-indicator{display:flex;align-items:center;justify-content:center;gap:var(--space-3);padding:var(--space-4);margin:var(--space-5) 0;background:#7c3aed1f;border:1px solid rgba(124,58,237,.2);border-radius:var(--radius-md);font-size:.9375rem;color:var(--neon-violet);font-weight:500}.spinner-small{width:20px;height:20px;border:2px solid rgba(124,58,237,.3);border-top-color:var(--neon-violet);border-radius:50%;animation:gameSelectorSpin .8s linear infinite}@keyframes gameSelectorSpin{to{transform:rotate(360deg)}}@media (max-width: 480px){.game-selector{padding:var(--space-3)}.games-grid{grid-template-columns:1fr;gap:var(--space-3)}.game-card{padding:var(--space-4);min-height:120px}.game-icon{font-size:2rem}.pool-grid{grid-template-columns:1fr;gap:var(--space-3)}.pool-card{padding:var(--space-3)}.selected-count{flex-direction:column;text-align:center}.pool-actions{justify-content:center;width:100%}.select-all-btn,.clear-all-btn{flex:1;justify-content:center}.update-pool-btn{max-width:100%}}@media (min-width: 481px) and (max-width: 768px){.games-grid,.pool-grid{grid-template-columns:repeat(2,1fr)}}@media (min-width: 769px){.game-selector{padding:var(--space-5)}.games-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--space-5)}.game-card{padding:var(--space-5)}.pool-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}}.settings-modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#000c;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);display:flex;justify-content:center;align-items:center;z-index:var(--z-modal);padding:var(--space-4);animation:modalFadeIn .2s ease-out}@keyframes modalFadeIn{0%{opacity:0}to{opacity:1}}.settings-modal{background:var(--surface-mid);border-radius:var(--radius-xl);width:100%;max-width:800px;max-height:calc(100vh - var(--space-8));max-height:calc(100dvh - var(--space-8));display:flex;flex-direction:column;border:1px solid rgba(124,58,237,.2);box-shadow:0 0 30px var(--glow-violet),0 25px 50px #00000080;animation:modalSlideUp .3s ease-out;overflow:hidden}@keyframes modalSlideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.settings-modal-header{padding:var(--space-5) var(--space-6);border-bottom:1px solid rgba(124,58,237,.2);display:flex;justify-content:space-between;align-items:center;background:linear-gradient(135deg,#7c3aed26,#e040fb1a);flex-shrink:0}.settings-modal-header h2{margin:0;color:var(--text-primary);font-size:clamp(1.25rem,3vw,1.5rem);font-weight:700;font-family:var(--font-display);display:flex;align-items:center;gap:var(--space-3)}.close-btn{background:var(--surface-dark);border:1px solid rgba(124,58,237,.15);font-size:1.25rem;color:var(--text-secondary);cursor:pointer;padding:0;width:36px;height:36px;min-width:36px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-full);transition:all var(--transition-fast)}.close-btn:hover{background:#ef444426;color:var(--neon-red);border-color:#ef44444d;transform:scale(1.05)}.close-btn:active{transform:scale(.95)}.settings-tabs{display:flex;gap:var(--space-2);padding:var(--space-4) var(--space-6);border-bottom:1px solid rgba(124,58,237,.15);background:var(--surface-dark);overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;flex-shrink:0}.settings-tabs::-webkit-scrollbar{display:none}.tab{padding:var(--space-3) var(--space-4);background:var(--surface-mid);border:2px solid rgba(124,58,237,.15);border-radius:var(--radius-md);font-size:.9375rem;font-weight:500;color:var(--text-muted);cursor:pointer;transition:all var(--transition-fast);display:flex;align-items:center;gap:var(--space-2);white-space:nowrap;flex-shrink:0;min-height:44px}.tab:hover{border-color:var(--neon-violet);color:var(--text-secondary);background:#7c3aed1a}.tab.active{background:var(--gradient-game);color:#fff;border-color:transparent;box-shadow:0 0 15px var(--glow-violet)}.settings-modal-content{flex:1;padding:var(--space-6);overflow-y:auto;-webkit-overflow-scrolling:touch;background:var(--surface-mid)}.settings-section{animation:modalFadeIn .3s ease-out}.section-description{margin-bottom:var(--space-6)}.section-description p{color:var(--text-secondary);line-height:1.6;margin:0 0 var(--space-4) 0;font-size:.9375rem}.permission-notice{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:#fbbf241a;border:1px solid rgba(251,191,36,.2);border-radius:var(--radius-md);color:var(--neon-amber);font-weight:500;font-size:.875rem}.notice-icon{font-size:1.125rem;flex-shrink:0}.current-pool-info{margin-top:var(--space-6);padding:var(--space-5);background:#10b9811a;border:1px solid rgba(16,185,129,.2);border-radius:var(--radius-lg)}.current-pool-info h4{margin:0 0 var(--space-4) 0;color:var(--neon-green);font-size:1rem;font-weight:600}.selected-games-preview{display:flex;flex-wrap:wrap;gap:var(--space-2)}.game-badge{padding:var(--space-2) var(--space-3);background:var(--surface-dark);border:1px solid rgba(124,58,237,.25);border-radius:var(--radius-full);color:var(--text-primary);font-size:.8125rem;font-weight:500;display:flex;align-items:center;gap:var(--space-2)}.room-info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:var(--space-4);margin-top:var(--space-5)}.info-item{padding:var(--space-4);background:var(--surface-dark);border-radius:var(--radius-md);display:flex;flex-direction:column;gap:var(--space-1);border:1px solid rgba(124,58,237,.15)}.info-label{color:var(--text-muted);font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.info-value{color:var(--text-primary);font-size:1.0625rem;font-weight:600}.status-active{color:var(--neon-green)}.settings-modal-footer{padding:var(--space-4) var(--space-6);border-top:1px solid rgba(124,58,237,.15);display:flex;justify-content:flex-end;gap:var(--space-3);background:var(--surface-dark);flex-shrink:0}.btn-close{padding:var(--space-3) var(--space-6);background:var(--gradient-game);color:#fff;border:none;border-radius:var(--radius-md);font-size:.9375rem;font-weight:600;cursor:pointer;transition:all var(--transition-base);min-height:44px}.btn-close:hover{box-shadow:0 0 20px var(--glow-violet),0 4px 15px #0000004d;transform:translateY(-2px)}.btn-close:active{transform:translateY(0)}@media (max-width: 768px){.settings-modal-backdrop{padding:var(--space-3);align-items:flex-end}.settings-modal{max-height:calc(100vh - var(--space-6));max-height:calc(100dvh - var(--space-6));border-radius:var(--radius-xl) var(--radius-xl) 0 0;animation:slideUp .3s ease-out}.settings-modal-header{padding:var(--space-4)}.settings-modal-header h2{font-size:1.125rem}.settings-tabs{padding:var(--space-3) var(--space-4);gap:var(--space-2)}.tab{padding:var(--space-2) var(--space-3);font-size:.875rem;min-height:40px}.settings-modal-content{padding:var(--space-4)}.room-info-grid{grid-template-columns:repeat(2,1fr);gap:var(--space-3)}.info-item{padding:var(--space-3)}.settings-modal-footer{padding:var(--space-4)}}@media (max-width: 480px){.settings-modal-backdrop{padding:0}.settings-modal{max-height:100vh;max-height:100dvh;border-radius:0}.settings-tabs{flex-direction:column;gap:var(--space-2)}.tab{width:100%;justify-content:center}.room-info-grid{grid-template-columns:1fr}.permission-notice{flex-direction:column;text-align:center;gap:var(--space-2)}.selected-games-preview{justify-content:center}.settings-modal-footer{flex-direction:column}.btn-close{width:100%}}@media (min-width: 1024px){.settings-modal{max-width:900px}.settings-modal-header{padding:var(--space-6) var(--space-8)}.settings-tabs{padding:var(--space-4) var(--space-8)}.settings-modal-content{padding:var(--space-8)}.settings-modal-footer{padding:var(--space-5) var(--space-8)}}@media (hover: none) and (pointer: coarse){.tab{min-height:48px}.close-btn{width:44px;height:44px;min-width:44px}.btn-close{min-height:48px}}.room{width:100%;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;background:var(--gradient-surface);box-sizing:border-box;overflow-x:hidden}.reconnecting-container{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;color:var(--text-primary);text-align:center;padding:var(--space-5);gap:var(--space-4)}.reconnecting-container .spinner{width:60px;height:60px;border:4px solid rgba(124,58,237,.2);border-top-color:var(--neon-violet);border-radius:50%;animation:spin .8s linear infinite;box-shadow:var(--glow-violet)}.reconnecting-container h2{font-family:var(--font-display);font-size:clamp(1.5rem,4vw,2rem);font-weight:600;color:var(--text-primary)}.reconnecting-container p{font-size:clamp(1rem,2.5vw,1.2rem);color:var(--text-secondary)}.room-header{background:#12121ff2;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);padding:var(--space-4) var(--space-5);box-shadow:var(--shadow-md);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--space-3);border-bottom:1px solid rgba(124,58,237,.3);width:100%;box-sizing:border-box;position:sticky;top:0;z-index:var(--z-sticky)}.room-header h1{font-family:var(--font-display);background:var(--gradient-game);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;font-size:clamp(1.25rem,3vw,1.75rem);font-weight:700;margin:0}.room-info{display:flex;align-items:center;gap:var(--space-4);flex-wrap:wrap}.room-info span{color:var(--text-secondary);font-size:clamp(.875rem,2vw,1rem);display:flex;align-items:center;gap:var(--space-2)}.header-buttons{display:flex;gap:var(--space-2);flex-wrap:wrap}.settings-btn{padding:var(--space-2) var(--space-4);background:#7c3aed26;color:var(--text-primary);border:1px solid rgba(124,58,237,.4);border-radius:var(--radius-md);font-size:.9375rem;font-weight:600;transition:all var(--transition-base);cursor:pointer;display:flex;align-items:center;gap:var(--space-2);min-height:40px}.settings-btn:hover{background:#7c3aed40;border-color:var(--neon-violet);box-shadow:var(--glow-violet)}.leave-btn{padding:var(--space-2) var(--space-4);background:#ef444426;color:var(--neon-red);border:1px solid rgba(239,68,68,.4);border-radius:var(--radius-md);font-size:.9375rem;font-weight:600;transition:all var(--transition-base);cursor:pointer;min-height:40px}.leave-btn:hover{background:#ef444440;border-color:var(--neon-red);box-shadow:var(--glow-red)}.ready-status-bar{background:var(--surface-card);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);padding:var(--space-3) var(--space-4);margin:var(--space-4);border-radius:var(--radius-lg);box-shadow:var(--shadow-md),0 0 15px #7c3aed1a;border:1px solid rgba(124,58,237,.2);max-width:1400px;margin-left:auto;margin-right:auto;width:calc(100% - var(--space-8))}.status-content{display:flex;justify-content:space-between;align-items:center;gap:var(--space-4);flex-wrap:wrap}.ready-info{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);background:#10b9811a;border:1px solid rgba(16,185,129,.25);border-radius:var(--radius-full);color:var(--neon-green)}.ready-icon{font-size:1.125rem}.ready-text{color:var(--neon-green);font-weight:500;font-size:.9375rem}.pool-status-inline{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);background:#7c3aed1a;border:1px solid rgba(124,58,237,.25);border-radius:var(--radius-full);color:var(--neon-violet);font-weight:500;font-size:.9375rem}.pool-status-inline.warning{background:#fbbf241a;border-color:#fbbf2440;color:var(--neon-amber)}.pool-icon{font-size:1.125rem}.room-content{flex:1;display:flex;padding:var(--space-4);gap:var(--space-4);width:100%;box-sizing:border-box;max-width:1400px;margin:0 auto}.main-area{flex:1;background:var(--surface-card);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-radius:var(--radius-xl);padding:var(--space-5);box-shadow:var(--shadow-xl);border:1px solid rgba(124,58,237,.2);min-height:400px;display:flex;flex-direction:column}.sidebar{width:320px;display:flex;flex-direction:column;gap:var(--space-4);flex-shrink:0}.players-list{background:var(--surface-card);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-radius:var(--radius-lg);padding:var(--space-4);box-shadow:var(--shadow-lg);border:1px solid rgba(124,58,237,.2)}.players-list h3{color:var(--neon-cyan);margin-bottom:var(--space-4);font-weight:600;font-size:1.0625rem;display:flex;align-items:center;gap:var(--space-2);text-transform:uppercase;letter-spacing:1px}.players-list ul{list-style:none;display:flex;flex-direction:column;gap:var(--space-2)}.players-list li{display:flex;justify-content:space-between;align-items:center;padding:var(--space-3);border-radius:var(--radius-md);background:var(--surface-dark);border:1px solid transparent;transition:all var(--transition-fast)}.players-list li:hover{background:#7c3aed1a;border-color:var(--neon-violet)}.players-list li.playing{background:#7c3aed1f;border:1px solid rgba(124,58,237,.35);animation:neonPulse 2s ease-in-out infinite}.player-name{color:var(--text-primary);font-weight:500;font-size:.9375rem}.player-status{font-size:1.125rem}.waiting-area{text-align:center;padding:var(--space-8);display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1}.waiting-area h2{font-family:var(--font-display);background:var(--gradient-game);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:var(--space-4);font-size:clamp(1.5rem,4vw,2rem);font-weight:700;animation:textGlow 3s ease-in-out infinite}.waiting-area p{color:var(--text-secondary);margin-bottom:var(--space-5);font-size:clamp(.9375rem,2vw,1.0625rem)}.play-btn{padding:var(--space-4) var(--space-8);background:var(--gradient-game);color:#fff;border:none;border-radius:var(--radius-md);font-size:clamp(1rem,2.5vw,1.125rem);font-weight:600;transition:all var(--transition-base);box-shadow:var(--shadow-md),var(--glow-violet);min-height:52px}.play-btn:hover:not(:disabled){box-shadow:var(--shadow-xl),0 0 30px #7c3aed80,0 0 60px #e040fb33}.play-btn.secondary{background:linear-gradient(135deg,#a0a0b84d,#6b6b824d);font-size:clamp(.9375rem,2vw,1rem);padding:var(--space-3) var(--space-6);border:1px solid rgba(160,160,184,.3);box-shadow:none}.play-btn.secondary:hover{background:linear-gradient(135deg,#a0a0b866,#6b6b8266);border-color:#a0a0b880}.waiting-message{display:flex;flex-direction:column;align-items:center;gap:var(--space-5)}.spectator-area{text-align:center;padding:var(--space-8);background:var(--surface-dark);border-radius:var(--radius-lg);border:2px dashed rgba(124,58,237,.3)}.spectator-area h3{color:var(--text-primary);margin-bottom:var(--space-3)}.spectator-area p{color:var(--text-secondary)}.game-start-section{display:flex;flex-direction:column;gap:var(--space-5);align-items:center;width:100%}.ready-status{background:#10b98114;border:2px solid rgba(16,185,129,.25);border-radius:var(--radius-lg);padding:var(--space-5);text-align:center;width:100%;max-width:400px}.ready-status h3{margin:0 0 var(--space-4) 0;color:var(--neon-green);font-size:1.125rem}.ready-counter{display:flex;align-items:center;justify-content:center;gap:var(--space-2);margin:var(--space-4) 0;font-size:clamp(1.5rem,4vw,2rem);font-weight:700}.ready-count{color:var(--neon-green)}.separator,.total-count{color:var(--text-muted)}.ready-counter .label{font-size:clamp(.9375rem,2vw,1.0625rem);font-weight:500;color:var(--text-secondary);margin-left:var(--space-2)}.start-game-btn{padding:var(--space-4) var(--space-8);font-size:clamp(1rem,2.5vw,1.25rem);font-family:var(--font-display);font-weight:700;background:var(--gradient-success);color:var(--surface-darkest);border:none;border-radius:var(--radius-full);cursor:pointer;transition:all var(--transition-base);box-shadow:var(--shadow-md),var(--glow-green);margin-top:var(--space-4);display:inline-flex;align-items:center;gap:var(--space-2);min-height:52px;text-transform:uppercase;letter-spacing:1px;animation:neonPulse 2s ease-in-out infinite}.start-game-btn:hover:not(:disabled){box-shadow:var(--shadow-lg),0 0 30px #10b98180,0 0 60px #34d39940}.start-game-btn:disabled{opacity:.5;cursor:not-allowed;animation:none}.start-game-btn .spinner{width:20px;height:20px;border:3px solid rgba(10,10,18,.3);border-top-color:var(--surface-darkest);border-radius:50%}.game-pool-section{background:var(--surface-dark);border:2px solid rgba(124,58,237,.15);border-radius:var(--radius-lg);padding:var(--space-5);width:100%}.game-pool-section h3{margin:0 0 var(--space-5) 0;color:var(--text-primary);font-size:1.125rem;text-align:center}.waiting-info{margin-top:var(--space-5);padding:var(--space-5);background:var(--surface-dark);border-radius:var(--radius-lg);border:1px solid rgba(124,58,237,.1)}.ready-counter-small{display:flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-4);background:#10b98114;border-radius:var(--radius-md);margin-bottom:var(--space-4);font-size:1.0625rem;font-weight:500;color:var(--text-primary)}.ready-counter-small .icon{font-size:1.5rem}.selected-pool-info{text-align:center;padding:var(--space-4);background:#7c3aed14;border-radius:var(--radius-md)}.pool-status{color:var(--neon-green);font-size:1rem;margin:0 0 var(--space-2) 0;font-weight:500}.waiting-host{color:var(--text-secondary);font-size:.875rem;margin:0;animation:waitingPulse 2s infinite}@keyframes waitingPulse{0%,to{opacity:.6}50%{opacity:1}}.warning{color:var(--neon-amber);background:#fbbf2414;border:1px solid rgba(251,191,36,.25);padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);margin:var(--space-3) 0;text-align:center;font-weight:500}.info-message{color:var(--neon-violet);background:#7c3aed14;border:1px solid rgba(124,58,237,.25);padding:var(--space-3) var(--space-5);border-radius:var(--radius-md);margin:var(--space-4) 0;text-align:center;font-weight:500;font-size:.9375rem}.warning-box{margin:var(--space-3) 0}.settings-prompt{display:flex;flex-direction:column;align-items:center;gap:var(--space-4)}.open-settings-btn{padding:var(--space-3) var(--space-6);background:var(--gradient-game);color:#fff;border:none;border-radius:var(--radius-md);font-size:1.0625rem;font-weight:600;cursor:pointer;transition:all var(--transition-base);display:flex;align-items:center;gap:var(--space-2)}.open-settings-btn:hover{box-shadow:var(--shadow-lg),var(--glow-violet)}@media (prefers-reduced-motion: reduce){.waiting-area h2,.start-game-btn,.players-list li.playing,.reconnecting-container .spinner,.waiting-host{animation:none}}@media (max-width: 640px){.room-header{padding:var(--space-3);flex-direction:column;align-items:stretch}.room-info{justify-content:center}.header-buttons{justify-content:center;width:100%}.settings-btn,.leave-btn{flex:1;justify-content:center}.ready-status-bar{margin:var(--space-3);width:calc(100% - var(--space-6))}.status-content{flex-direction:column}.ready-info,.pool-status-inline{width:100%;justify-content:center}.room-content{flex-direction:column;padding:var(--space-3)}.sidebar{width:100%;order:2}.main-area{width:100%;order:1;min-height:auto;padding:var(--space-4)}.waiting-area{padding:var(--space-5)}.play-btn,.start-game-btn{width:100%}}@media (min-width: 640px) and (max-width: 1023px){.room-content{flex-direction:column}.sidebar{width:100%;max-width:600px;margin:0 auto}}@media (min-width: 1024px){.room-content{flex-direction:row}.sidebar{width:340px}.main-area{min-height:500px}}@media (min-width: 1280px){.sidebar{width:380px}.room-content{gap:var(--space-6)}}.app{width:100%;min-height:100vh;display:flex;flex-direction:column;background:var(--gradient-surface);position:relative;overflow-x:hidden}.loading{display:flex;justify-content:center;align-items:center;min-height:100vh;flex-direction:column;gap:var(--space-5);color:var(--text-primary);padding:var(--space-5);text-align:center}.loading h2{color:var(--text-primary);font-size:clamp(1.25rem,3vw,1.5rem);font-weight:600}.loading p{color:var(--text-secondary);font-size:clamp(.875rem,2vw,1rem)}.spinner{width:48px;height:48px;border:4px solid rgba(124,58,237,.2);border-top-color:var(--neon-violet);border-radius:50%;animation:spin .8s linear infinite;filter:drop-shadow(0 0 8px rgba(124,58,237,.4))}.spinner.sm{width:20px;height:20px;border-width:2px}.spinner.md{width:32px;height:32px;border-width:3px}.spinner.lg{width:48px;height:48px}.error,.warning,.success,.info{padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);margin:var(--space-3) 0;text-align:center;font-weight:500;font-size:.9375rem;animation:slideDown .3s ease-out}.error{background:#ef44441f;color:var(--neon-red);border:1px solid rgba(239,68,68,.3)}.warning{background:#fbbf241f;color:var(--neon-amber);border:1px solid rgba(251,191,36,.3)}.success{background:#10b9811f;color:var(--neon-green);border:1px solid rgba(16,185,129,.3)}.info{background:#7c3aed1f;color:var(--neon-violet);border:1px solid rgba(124,58,237,.3)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-3) var(--space-5);font-size:1rem;font-weight:600;font-family:var(--font-display);border-radius:var(--radius-md);border:none;cursor:pointer;transition:all var(--transition-base);white-space:nowrap;text-decoration:none;text-transform:uppercase;letter-spacing:.5px}.btn:hover:not(:disabled){transform:translateY(-2px)}.btn:active:not(:disabled){transform:translateY(0)}.btn-primary{background:var(--gradient-game);color:#fff;box-shadow:var(--shadow-md),var(--glow-violet)}.btn-primary:hover:not(:disabled){box-shadow:var(--shadow-lg),0 0 30px #7c3aed80}.btn-secondary{background:var(--surface-mid);color:var(--text-secondary);border:2px solid rgba(124,58,237,.25)}.btn-secondary:hover:not(:disabled){background:#7c3aed26;border-color:var(--neon-violet);color:var(--text-primary)}.btn-success{background:var(--gradient-success);color:#fff;box-shadow:var(--shadow-md),var(--glow-green)}.btn-success:hover:not(:disabled){box-shadow:var(--shadow-lg),0 0 30px #10b98180}.btn-danger{background:var(--gradient-danger);color:#fff;box-shadow:var(--shadow-md),var(--glow-red)}.btn-danger:hover:not(:disabled){box-shadow:var(--shadow-lg),0 0 30px #ef444480}.btn-ghost{background:transparent;color:var(--text-secondary)}.btn-ghost:hover:not(:disabled){background:#7c3aed1a;transform:none}.btn-sm{padding:var(--space-2) var(--space-3);font-size:.875rem}.btn-lg{padding:var(--space-4) var(--space-6);font-size:1.125rem}.btn-xl{padding:var(--space-5) var(--space-8);font-size:1.25rem}.card{background:var(--surface-card);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg),0 0 20px #7c3aed14;border:1px solid rgba(124,58,237,.15);overflow:hidden}.card-glass{background:#7c3aed0f;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(124,58,237,.2)}.container{width:100%;max-width:1400px;margin:0 auto;padding:0 var(--space-4)}@media (min-width: 640px){.container{padding:0 var(--space-6)}}@media (min-width: 1024px){.container{padding:0 var(--space-8)}}@supports not (backdrop-filter: blur(20px)){.card-glass{background:var(--surface-elevated)}}.focus-ring:focus-visible{outline:2px solid var(--neon-violet);outline-offset:2px}.text-gradient{background:var(--gradient-game);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.text-gradient-pink{background:var(--secondary-gradient);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@supports (padding: max(0px)){.safe-area-bottom{padding-bottom:max(var(--space-4),env(safe-area-inset-bottom))}.safe-area-top{padding-top:max(var(--space-4),env(safe-area-inset-top))}}