:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{width:100%;min-height:100%;height:auto}body{overflow-x:hidden;overflow-y:auto}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background:linear-gradient(135deg,#0a0a1a,#1a1a3a);color:#fff}.app{width:100%;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding:20px 0;position:relative}.audio-control{position:fixed;top:16px;left:16px;display:flex;align-items:center;gap:8px;z-index:1000;padding:8px 12px;background:#0009;border-radius:25px;border:1px solid rgba(255,255,255,.1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.audio-toggle{background:transparent;border:none;color:#0f8;cursor:pointer;padding:4px;display:flex;align-items:center;justify-content:center;transition:all .2s ease;border-radius:50%}.audio-toggle:hover{background:#0f83;transform:scale(1.1)}.audio-toggle.muted{color:#f46}.volume-slider{width:80px;height:4px;-webkit-appearance:none;appearance:none;background:#fff3;border-radius:2px;cursor:pointer}.volume-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:14px;height:14px;background:#0f8;border-radius:50%;cursor:pointer;transition:transform .2s ease}.volume-slider::-webkit-slider-thumb:hover{transform:scale(1.2)}.volume-slider::-moz-range-thumb{width:14px;height:14px;background:#0f8;border:none;border-radius:50%;cursor:pointer}.connect-screen{display:flex;flex-direction:column;align-items:center;gap:24px;padding:40px;background:#ffffff0d;border-radius:16px;border:1px solid rgba(255,255,255,.1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.connect-screen h1{font-size:48px;background:linear-gradient(90deg,#0f8,#0ff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:10px}.connect-screen .subtitle{color:#888;margin-bottom:20px}.connect-form{display:flex;flex-direction:column;gap:16px;width:300px}input[type=text],input[type=number]{padding:12px 16px;border:2px solid rgba(255,255,255,.2);border-radius:8px;background:#0000004d;color:#fff;font-size:16px;transition:all .3s ease}input[type=text]:focus,input[type=number]:focus{outline:none;border-color:#0f8;box-shadow:0 0 10px #00ff884d}button{padding:12px 24px;border:none;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;transition:all .3s ease}button.primary{background:linear-gradient(90deg,#0f8,#00cc6a);color:#000}button.primary:hover{transform:translateY(-2px);box-shadow:0 5px 20px #0f86}button.primary:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}button.secondary{background:#ffffff1a;color:#fff;border:1px solid rgba(255,255,255,.2)}button.secondary:hover{background:#fff3}button.danger{background:linear-gradient(90deg,#f46,#c35);color:#fff}button.danger:hover{transform:translateY(-2px);box-shadow:0 5px 20px #f466}button.warning{background:linear-gradient(90deg,#fa0,#f80);color:#000}button.warning:hover{transform:translateY(-2px);box-shadow:0 5px 20px #fa06}button.warning:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}.lobby{width:100%;max-width:900px;padding:24px;margin:auto 0}.lobby-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.lobby-header h2{font-size:28px}.lobby-actions{display:flex;gap:12px}.room-list{display:flex;flex-direction:column;gap:12px}.room-card{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;background:#ffffff0d;border-radius:12px;border:1px solid rgba(255,255,255,.1);transition:all .3s ease}.room-card:hover{background:#ffffff1a;border-color:#00ff884d}.room-card.in-game{border-color:#fa06;background:#ffaa000d}.room-card.in-game:hover{border-color:#fa09;background:#ffaa001a}.room-info h3{font-size:18px;margin-bottom:4px}.room-info .room-details{font-size:14px;color:#888}.room-info .room-details .status-waiting{color:#0f8}.room-info .room-details .status-playing{color:#fa0;font-weight:700}.room-players{display:flex;align-items:center;gap:8px;font-size:14px;color:#0f8}.no-rooms{text-align:center;padding:40px;color:#666}.modal-overlay{position:fixed;inset:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px;overflow-y:auto}.modal{background:#1a1a2e;border-radius:16px;padding:24px;min-width:400px;max-height:90vh;overflow-y:auto;border:1px solid rgba(255,255,255,.1)}.modal h2{margin-bottom:20px}.modal-form{display:flex;flex-direction:column;gap:16px}.form-group{display:flex;flex-direction:column;gap:6px}.form-group label{font-size:14px;color:#888}.modal-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:20px}.form-row{display:flex;gap:16px}.form-row .form-group{flex:1}.form-section{margin-top:8px}.form-section h4{margin:0 0 12px;font-size:14px;color:#888;font-weight:500}.form-info{background:#646cff1a;border:1px solid rgba(100,108,255,.3);border-radius:6px;padding:10px 14px;font-size:13px;color:#a8b0ff}.game-mode-selector{display:flex;gap:12px}.mode-option{flex:1;cursor:pointer;position:relative}.mode-option input[type=radio]{position:absolute;opacity:0;width:0;height:0}.mode-content{display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px 12px;background:#ffffff0d;border:2px solid rgba(255,255,255,.1);border-radius:10px;transition:all .2s ease}.mode-option:hover .mode-content{border-color:#646cff66;background:#646cff1a}.mode-option.selected .mode-content{border-color:#646cff;background:#646cff33;box-shadow:0 0 12px #646cff4d}.mode-icon{font-size:28px;font-weight:700;color:#888;width:44px;height:44px;display:flex;align-items:center;justify-content:center;background:#ffffff0d;border-radius:50%}.mode-option.selected .mode-icon{color:#646cff;background:#646cff33}.mode-name{font-size:14px;font-weight:600;color:#fff}.mode-desc{font-size:11px;color:#666;text-align:center;line-height:1.3}.mode-option.selected .mode-desc{color:#888}.modal.modal-large{min-width:500px;max-width:550px}.room-lobby{width:100%;max-width:700px;padding:24px;margin:auto 0}.room-lobby-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;padding-bottom:16px;border-bottom:1px solid rgba(255,255,255,.1)}.room-lobby-header h2{font-size:24px}.players-list{display:flex;flex-direction:column;gap:12px;margin-bottom:24px}.player-card{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:#ffffff0d;border-radius:8px;border:1px solid rgba(255,255,255,.1)}.player-card.is-you{border-color:#00ff8880;background:#00ff881a}.player-name{display:flex;align-items:center;gap:10px}.player-name .host-badge{background:#fc0;color:#000;padding:2px 8px;border-radius:4px;font-size:12px;font-weight:600}.player-name .you-badge{background:#0f8;color:#000;padding:2px 8px;border-radius:4px;font-size:12px;font-weight:600}.edit-name-btn{background:transparent;border:none;cursor:pointer;font-size:14px;padding:2px 6px;opacity:.6;transition:opacity .2s}.edit-name-btn:hover{opacity:1}.name-edit-input{padding:4px 8px;background:#ffffff1a;border:1px solid rgba(255,255,255,.3);border-radius:4px;color:#fff;font-size:14px;width:120px}.small-btn{padding:4px 8px;font-size:12px;border-radius:4px;background:#0f83;border:1px solid rgba(0,255,136,.4);color:#0f8;cursor:pointer}.small-btn.danger{background:#f463;border-color:#f466;color:#f46}.player-status{font-size:14px}.player-status.ready{color:#0f8}.player-status.not-ready{color:#f46}.room-actions{display:flex;justify-content:space-between;align-items:center;padding-top:16px;border-top:1px solid rgba(255,255,255,.1)}.room-share-info{background:#ffffff08;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:16px;margin-bottom:24px}.share-section{margin-bottom:16px}.share-section:last-child{margin-bottom:0}.share-section h4{margin:0 0 8px;font-size:14px;color:#888;font-weight:500}.config-details{display:flex;flex-wrap:wrap;gap:12px}.config-item{background:#646cff26;color:#a8b0ff;padding:6px 12px;border-radius:6px;font-size:14px}.code-display{display:flex;align-items:center;gap:12px}.room-code{font-family:Courier New,monospace;font-size:28px;font-weight:700;letter-spacing:4px;color:#fc0;background:#ffcc001a;padding:12px 20px;border-radius:8px;border:2px dashed rgba(255,204,0,.3)}.link-display{display:flex;gap:8px}.share-link-input{flex:1;padding:10px 12px;background:#ffffff0d;border:1px solid rgba(255,255,255,.15);border-radius:6px;color:#fff;font-size:13px;font-family:monospace}.share-link-input:focus{outline:none;border-color:#646cff80}.copy-btn{padding:8px 16px;background:#646cff33;border:1px solid rgba(100,108,255,.4);color:#a8b0ff;border-radius:6px;cursor:pointer;font-size:13px;white-space:nowrap;transition:all .2s}.copy-btn:hover{background:#646cff4d;border-color:#646cff99}.room-type-badge{padding:4px 10px;border-radius:4px;font-size:12px;font-weight:600}.room-type-badge.private{background:#ff646433;color:#f88}.room-type-badge.public{background:#0f83;color:#0f8}.game-container{width:100%;height:100%;position:relative}.game-canvas{width:100%;height:100%;display:block}.hud{position:absolute;top:0;left:0;right:0;padding:16px;display:flex;justify-content:space-between;pointer-events:none}.hud-left{display:flex;flex-direction:column;gap:8px}.hud-stat{display:flex;align-items:center;gap:8px;padding:8px 12px;background:#0009;border-radius:8px;font-size:14px}.hud-stat .label{color:#888}.hud-stat .value{color:#0f8;font-weight:600}.scoreboard{position:absolute;top:16px;right:170px;background:#000000b3;border-radius:8px;padding:12px;min-width:200px}.scoreboard h3{font-size:14px;color:#888;margin-bottom:8px;text-transform:uppercase}.scoreboard-list{display:flex;flex-direction:column;gap:6px}.scoreboard-item{display:flex;justify-content:space-between;font-size:13px;padding:4px 0}.scoreboard-item.is-you{color:#0f8}.scoreboard-item .name{max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.scoreboard-item .score{font-weight:600}.controls-help{position:absolute;bottom:16px;left:16px;background:#0009;border-radius:8px;padding:12px;font-size:12px;color:#888}.controls-help div{margin-bottom:4px}.controls-help kbd{background:#ffffff1a;padding:2px 6px;border-radius:4px;margin-right:8px}.exit-game-btn{position:absolute;top:16px;left:180px;background:#f46c;color:#fff;border:none;padding:8px 16px;border-radius:6px;cursor:pointer;font-size:14px;font-weight:500;z-index:100;transition:background .2s}.exit-game-btn:hover{background:#f46}.error-message{position:fixed;top:20px;left:50%;transform:translate(-50%);background:#ff4466e6;color:#fff;padding:12px 24px;border-radius:8px;z-index:2000;animation:slideDown .3s ease}@keyframes slideDown{0%{transform:translate(-50%) translateY(-20px);opacity:0}to{transform:translate(-50%) translateY(0);opacity:1}}.loading{display:flex;align-items:center;gap:12px;color:#888}.spinner{width:24px;height:24px;border:3px solid rgba(255,255,255,.1);border-top-color:#0f8;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.hud{position:absolute;inset:0;padding:16px;display:flex;flex-direction:column;pointer-events:none;z-index:100}.hud-panel{background:linear-gradient(135deg,#000c,#141428cc);border-radius:12px;border:1px solid rgba(0,255,136,.3);padding:16px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.hud-left{position:absolute;top:60px;left:16px;width:200px}.hud-title{font-size:18px;font-weight:700;color:#0f8;margin-bottom:12px;text-shadow:0 0 10px rgba(0,255,136,.5)}.hud-health{margin-bottom:16px}.health-bar-container{position:relative;height:24px;background:#00000080;border-radius:12px;border:2px solid rgba(255,255,255,.2);overflow:hidden}.health-bar-fill{height:100%;transition:width .3s ease,background-color .3s ease;border-radius:10px}.health-text{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:12px;font-weight:700;color:#fff;text-shadow:0 0 4px rgba(0,0,0,.8)}.hud-charge{margin-top:12px;margin-bottom:12px}.charge-label{display:flex;align-items:center;gap:6px;font-size:11px;color:#888;margin-bottom:6px;text-transform:uppercase;letter-spacing:.5px}.charge-icon{font-size:14px}.charge-ready{color:#0f8;font-weight:700;animation:pulse-glow .5s ease-in-out infinite alternate;margin-left:auto}@keyframes pulse-glow{0%{text-shadow:0 0 5px rgba(0,255,136,.5)}to{text-shadow:0 0 15px rgba(0,255,136,1)}}.charge-bar-container{position:relative;height:16px;background:#00000080;border-radius:8px;border:2px solid rgba(138,43,226,.3);overflow:hidden}.charge-bar-fill{height:100%;border-radius:6px;transition:width .1s linear;background:linear-gradient(90deg,indigo,#8a2be2,#9400d3)}.charge-bar-fill.charging{animation:charge-fill 2s linear forwards,charge-pulse .3s ease-in-out infinite;background:linear-gradient(90deg,indigo,#8a2be2,orchid)}.charge-bar-fill.ready{background:linear-gradient(90deg,#0f8,#0fc,#0f8);box-shadow:0 0 15px #0f8c;animation:ready-pulse .5s ease-in-out infinite alternate}@keyframes charge-fill{0%{width:0%}to{width:100%}}@keyframes charge-pulse{0%,to{opacity:.8}50%{opacity:1}}@keyframes ready-pulse{0%{box-shadow:0 0 10px #00ff8880}to{box-shadow:0 0 20px #0f8}}.charge-hint{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:9px;color:#ffffff80;white-space:nowrap}.hud-stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.hud-stat-box{display:flex;flex-direction:column;align-items:center;padding:8px;background:#0000004d;border-radius:8px;border:1px solid rgba(255,255,255,.1)}.hud-stat-box .stat-value{font-size:20px;font-weight:700;color:#0f8}.hud-stat-box .stat-label{font-size:10px;color:#888;text-transform:uppercase;margin-top:4px}.hud-buff{margin-top:12px;display:flex;align-items:center;justify-content:center;gap:8px;padding:8px 12px;background:#0ff3;border-radius:8px;border:1px solid #00ffff;animation:buffPulse 1s ease-in-out infinite}@keyframes buffPulse{0%,to{opacity:.8}50%{opacity:1}}.hud-buff .buff-text{font-size:12px;font-weight:700;color:#0ff}.hud-death{margin-top:12px;display:flex;flex-direction:column;align-items:center;padding:12px;background:#f443;border-radius:8px;border:1px solid #ff4444;color:#f44;font-weight:700;animation:deathPulse .5s ease-in-out infinite}@keyframes deathPulse{0%,to{opacity:.7}50%{opacity:1}}.hud-death .death-hint{font-size:12px;font-weight:400;margin-top:4px;color:#f88}.hud-top-center{position:absolute;top:16px;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:8px}.game-title{font-size:24px;font-weight:700;color:#fff;text-shadow:0 0 10px rgba(0,255,136,.5),0 0 20px rgba(0,255,136,.3);letter-spacing:4px;animation:titleGlow 2s ease-in-out infinite}.game-progress{background:linear-gradient(135deg,#000000d9,#141428d9);border-radius:10px;border:1px solid rgba(0,255,136,.3);padding:10px 20px;min-width:250px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);text-align:center}.progress-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;font-size:13px}.progress-header .leader-name{color:#fc0;font-weight:700;text-shadow:0 0 8px rgba(255,204,0,.4)}.progress-header .leader-kills{color:#0f8;font-size:12px}.progress-header .time-mode-label{color:#888;font-size:11px;text-transform:uppercase;letter-spacing:1px}.progress-header .leader-info{color:#fc0;font-weight:700}.progress-bar-container{background:#ffffff1a;border-radius:6px;height:8px;overflow:hidden}.progress-bar-fill{height:100%;border-radius:6px;transition:width .3s ease,background-color .3s ease}.team-scoreboard-inline{margin-top:12px;background:#0009;border-radius:10px;padding:12px;border:1px solid rgba(255,255,255,.1)}.team-scoreboard-inline .team-scoreboard-title{font-size:12px;color:#888;text-transform:uppercase;letter-spacing:1px;margin-bottom:10px;padding-bottom:6px;border-bottom:1px solid rgba(255,255,255,.1)}.hud-right{position:absolute;top:60px;right:16px;width:220px}.team-scoreboard{border-color:#fff3}.team-scores{display:flex;flex-direction:column;gap:8px}.team-score-row{display:flex;align-items:center;gap:10px;padding:10px 12px;background:#0006;border-radius:8px;border-left:4px solid;transition:all .2s ease}.team-score-row.leading{background:#ffd7001a;box-shadow:0 0 10px #ffd70033}.team-score-row.my-team{border-width:4px;background:#00ff881a}.team-color-dot{width:16px;height:16px;border-radius:50%;flex-shrink:0;box-shadow:0 0 8px currentColor}.team-score-info{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}.team-score-name{font-size:14px;font-weight:700;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.team-score-players{font-size:10px;color:#888}.team-score-kills{display:flex;flex-direction:column;align-items:center;padding:4px 8px;background:#0000004d;border-radius:6px;min-width:45px}.team-score-kills .kills-value{font-size:18px;font-weight:700;color:#0f8;line-height:1}.team-score-kills .kills-label{font-size:9px;color:#888;text-transform:uppercase}.team-progress .progress-header .leader-name{text-shadow:0 0 10px currentColor}.game-alerts{position:fixed;top:130px;left:50%;transform:translate(-50%);display:flex;flex-direction:column;gap:8px;z-index:1000;pointer-events:none}.game-alert{background:linear-gradient(135deg,#ff4466f2,#c83250f2);border:2px solid #ff4466;border-radius:10px;padding:12px 24px;font-size:16px;font-weight:700;color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.5);box-shadow:0 0 20px #ff446680,0 4px 15px #0000004d;animation:alertSlideIn .3s ease-out,alertPulse .5s ease-in-out infinite;white-space:nowrap}.game-alert.info{background:linear-gradient(135deg,#0096c8f2,#006496f2);border-color:#0cf;box-shadow:0 0 20px #00ccff80,0 4px 15px #0000004d}.game-alert.warning{background:linear-gradient(135deg,#ff4466f2,#c83250f2);border-color:#f46}@keyframes alertSlideIn{0%{opacity:0;transform:translateY(-20px) scale(.9)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes alertPulse{0%,to{box-shadow:0 0 20px #ff446680,0 4px 15px #0000004d}50%{box-shadow:0 0 30px #f46c,0 4px 20px #0006}}@keyframes titleGlow{0%,to{text-shadow:0 0 10px rgba(0,255,136,.5),0 0 20px rgba(0,255,136,.3)}50%{text-shadow:0 0 15px rgba(0,255,136,.8),0 0 30px rgba(0,255,136,.5)}}.scoreboard{position:absolute;top:16px;right:180px;background:linear-gradient(135deg,#000000d9,#141428d9);border-radius:12px;border:1px solid rgba(255,204,0,.3);min-width:280px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);overflow:hidden;pointer-events:auto}.scoreboard.collapsed{min-width:180px}.scoreboard-header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:#ffcc001a;border-bottom:1px solid rgba(255,204,0,.2);cursor:pointer;transition:background .3s ease}.scoreboard-header:hover{background:#fc03}.scoreboard-header h3{font-size:14px;color:#fc0;margin:0;text-shadow:0 0 10px rgba(255,204,0,.5)}.scoreboard-header .toggle-icon{color:#888;font-size:12px}.scoreboard-columns{display:grid;grid-template-columns:30px 1fr 60px 80px;padding:8px 16px;font-size:10px;color:#666;text-transform:uppercase;border-bottom:1px solid rgba(255,255,255,.1)}.scoreboard-list{padding:8px 0;max-height:200px;overflow-y:auto}.scoreboard-item{display:grid;grid-template-columns:30px 1fr 60px 80px;align-items:center;padding:8px 16px;font-size:13px;transition:background .2s ease}.scoreboard-item:hover{background:#ffffff0d}.scoreboard-item.is-you{background:#00ff8826;border-left:3px solid #00ff88}.scoreboard-item.is-dead{opacity:.5}.scoreboard-item .medal{font-size:14px;font-weight:700;text-align:center;color:#888}.scoreboard-item.is-leader .medal{color:#fc0;text-shadow:0 0 10px rgba(255,204,0,.5)}.scoreboard-item:nth-child(2) .medal{color:silver}.scoreboard-item:nth-child(3) .medal{color:#cd7f32}.scoreboard-item .name{display:flex;align-items:center;gap:6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.scoreboard-item .you-badge{background:#0f8;color:#000;padding:1px 6px;border-radius:4px;font-size:9px;font-weight:700}.scoreboard-item .dead-icon{margin-left:4px}.scoreboard-item .score{font-weight:700;color:#fc0;text-align:right}.scoreboard-item .kd{display:flex;align-items:center;justify-content:flex-end;gap:8px;font-size:12px;color:#888;min-width:60px}.scoreboard-item .kd .kills{color:#0f8}.scoreboard-item .kd .deaths{color:#f46}.scoreboard-item .kd .separator{color:#444}.scoreboard-empty{padding:20px;text-align:center;color:#666}.scoreboard-footer{padding:8px 16px;font-size:11px;color:#666;border-top:1px solid rgba(255,255,255,.1);text-align:center}.victory-screen{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#0a0a1a,#1a1a3a);overflow-y:auto;padding:20px}.victory-content{display:flex;flex-direction:column;align-items:center;gap:24px;padding:40px;max-width:600px;width:100%;z-index:10;margin:auto}.victory-effects{position:absolute;inset:0;pointer-events:none;overflow:hidden}.confetti{position:absolute;width:10px;height:10px;top:-20px;animation:confettiFall 3s ease-in-out infinite;opacity:.8;border-radius:2px}@keyframes confettiFall{0%{transform:translateY(-100px) rotate(0);opacity:1}to{transform:translateY(100vh) rotate(720deg);opacity:0}}.victory-header{text-align:center}.victory-title{font-size:64px;font-weight:700;color:#888;text-shadow:0 0 20px rgba(136,136,136,.5);animation:titlePulse 2s ease-in-out infinite}.victory-title.win{color:#fc0;text-shadow:0 0 20px rgba(255,204,0,.8),0 0 40px rgba(255,204,0,.4)}@keyframes titlePulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.victory-subtitle{font-size:18px;color:#aaa;margin-top:8px}.winner-showcase{display:flex;flex-direction:column;align-items:center;gap:12px;padding:30px 50px;background:linear-gradient(135deg,#ffcc001a,#ffaa000d);border:2px solid rgba(255,204,0,.3);border-radius:20px;animation:winnerGlow 2s ease-in-out infinite}@keyframes winnerGlow{0%,to{box-shadow:0 0 20px #fc03}50%{box-shadow:0 0 40px #fc06}}.winner-crown{font-size:48px;animation:crownBounce 1s ease-in-out infinite}@keyframes crownBounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.winner-name{font-size:32px;font-weight:700;color:#fc0;text-shadow:0 0 10px rgba(255,204,0,.5)}.winner-reason{font-size:14px;color:#aaa}.winner-stats{display:flex;gap:40px;margin-top:10px}.winner-stats .stat{display:flex;flex-direction:column;align-items:center}.winner-stats .stat-value{font-size:28px;font-weight:700;color:#0f8}.winner-stats .stat-label{font-size:12px;color:#888;text-transform:uppercase}.final-scores{width:100%;background:#0006;border-radius:12px;padding:20px;border:1px solid rgba(255,255,255,.1)}.final-scores h3{text-align:center;color:#888;font-size:14px;text-transform:uppercase;letter-spacing:2px;margin-bottom:16px}.scores-table{display:flex;flex-direction:column;gap:4px}.scores-header{display:grid;grid-template-columns:40px 1fr 80px 80px;padding:8px 12px;font-size:11px;color:#666;text-transform:uppercase;border-bottom:1px solid rgba(255,255,255,.1)}.scores-row{display:grid;grid-template-columns:40px 1fr 80px 80px;align-items:center;padding:10px 12px;background:#ffffff08;border-radius:8px;transition:all .2s ease}.scores-row:hover{background:#ffffff14}.scores-row.is-you{background:#00ff881a;border:1px solid rgba(0,255,136,.3)}.scores-row.is-winner{background:#ffcc001a;border:1px solid rgba(255,204,0,.3)}.scores-row .position{font-size:16px;text-align:center}.scores-row .name{display:flex;align-items:center;gap:8px;font-weight:500}.scores-row .you-badge{background:#0f8;color:#000;padding:2px 6px;border-radius:4px;font-size:10px;font-weight:700}.scores-row .score{text-align:center;font-weight:700;color:#fc0}.scores-row .kd{display:flex;justify-content:center;gap:4px;font-size:13px}.scores-row .kd .kills{color:#0f8}.scores-row .kd .deaths{color:#f46}.scores-row .kd .separator{color:#444}.return-btn{margin-top:20px;padding:14px 40px;font-size:18px}.credits-footer{position:absolute;bottom:12px;right:16px;font-size:12px;color:#6496c8b3;pointer-events:none}.connect-screen{text-align:center;max-width:600px;padding:30px;margin:auto 0;width:100%}.connect-screen h1{font-size:48px;margin-bottom:8px;animation:titleFloat 3s ease-in-out infinite}@keyframes titleFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.connect-screen .subtitle{font-size:16px;color:#666;margin-bottom:25px}.connect-screen .connect-form{margin-bottom:20px}.connect-info-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-top:25px}.info-box{background:#0006;border:1px solid rgba(255,255,255,.1);border-radius:10px;padding:15px;text-align:left}.info-box h4{color:#0f8;font-size:14px;margin-bottom:12px;text-align:center}.info-box .info-content{font-size:12px;color:#aaa}.info-box .info-content div{margin-bottom:6px}.info-box .info-content kbd{background:#ffffff26;padding:2px 6px;border-radius:4px;margin-right:5px;font-size:11px}.info-box .powerups-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;font-size:12px}.connect-screen .credits{margin-top:25px;color:#468}.connect-screen .credits strong{color:#0f8}.connect-screen .credits .tech-stack{font-size:11px;margin-top:5px;color:#356}.color-selector{margin:16px 0;padding:16px;background:#ffffff0d;border-radius:8px}.color-selector h4{margin:0 0 12px;color:#888;font-size:14px;text-transform:uppercase;letter-spacing:1px}.color-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-bottom:12px}.color-option{width:40px;height:40px;border:2px solid transparent;border-radius:8px;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:700;color:#00000080}.color-option:hover:not(:disabled){transform:scale(1.1);border-color:#fff}.color-option.selected{border-color:#fff;transform:scale(1.15)}.color-option.used{opacity:.3;cursor:not-allowed}.color-option .check-mark{color:#fff;text-shadow:0 0 3px black}.color-option .used-mark{color:red;text-shadow:0 0 3px black}.selected-color-name{text-align:center;color:#aaa;font-size:13px;font-style:italic}.team-selector{margin:16px 0;padding:16px;background:#ffffff0d;border-radius:8px}.team-selector h4{margin:0 0 12px;color:#888;font-size:14px;text-transform:uppercase;letter-spacing:1px}.team-options{display:flex;flex-direction:column;gap:8px}.team-option{display:flex;align-items:center;gap:12px;padding:12px 16px;border:2px solid;border-radius:8px;background:transparent;cursor:pointer;transition:all .2s ease;color:#fff}.team-option:hover:not(:disabled){transform:translate(4px)}.team-option.selected{transform:translate(4px)}.team-option:disabled{opacity:.5;cursor:not-allowed}.team-color-badge{width:24px;height:24px;border-radius:50%;flex-shrink:0}.team-info{display:flex;flex-direction:column;align-items:flex-start;flex:1}.team-name{font-size:16px;font-weight:700;color:#fff}.team-count{font-size:12px;color:#888}.selected-badge{font-size:20px;color:#0f8}.room-type-badge.team{color:#fff}.team-badge{font-size:10px;padding:2px 6px;border-radius:4px;font-weight:700;margin-left:8px}.team-badge-small{color:#fa0;font-size:12px;margin-left:8px}.player-info-row{display:flex;align-items:center;gap:12px}.player-color-indicator{width:16px;height:16px;border-radius:50%;flex-shrink:0}@media screen and (max-height:700px){.connect-screen h1{font-size:36px}.connect-screen{padding:20px}.connect-info-grid{gap:10px;margin-top:15px}.info-box{padding:10px}.lobby,.room-lobby{padding:16px}.modal{padding:16px;max-height:85vh}.victory-title{font-size:42px}}@media screen and (max-width:600px){.app{padding:10px 0}.connect-screen{padding:15px}.connect-screen h1{font-size:32px}.connect-info-grid{grid-template-columns:1fr;gap:10px}.lobby{padding:12px}.lobby-header{flex-direction:column;gap:12px;align-items:flex-start}.lobby-actions{width:100%;flex-wrap:wrap}.room-lobby{padding:12px}.room-lobby-header{flex-direction:column;gap:12px;align-items:flex-start}.modal{min-width:unset;width:calc(100% - 20px);max-height:85vh;padding:16px}.modal-large{min-width:unset;max-width:calc(100% - 20px)}.form-row{flex-direction:column;gap:12px}.game-mode-selector{flex-direction:column}.victory-title{font-size:36px}.final-scores-table th,.final-scores-table td{padding:8px 6px;font-size:12px}}
