*{margin:0;padding:0;box-sizing:border-box}body{font-family:Segoe UI,system-ui,sans-serif;background:#0a0e17;color:#e8ecf4;overflow:hidden}#app{width:100vw;height:100vh}.screen{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(135deg,#0a0e17,#1a1f35,#0d1528);z-index:10}.screen.hidden{display:none}.panel{background:#0f1628eb;border:1px solid rgba(100,140,255,.25);border-radius:12px;padding:2rem;min-width:360px;box-shadow:0 8px 32px #00000080}h1{font-size:2rem;margin-bottom:.25rem;background:linear-gradient(90deg,#6af,#f6a);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.subtitle{color:#89b;margin-bottom:1.5rem;font-size:.9rem}.form-group{margin-bottom:1rem}label{display:block;font-size:.8rem;color:#89b;margin-bottom:.35rem}input{width:100%;padding:.65rem .85rem;background:#0d1220;border:1px solid #2a3555;border-radius:6px;color:#e8ecf4;font-size:.95rem}input:focus{outline:none;border-color:#48f}.btn{width:100%;padding:.75rem;border:none;border-radius:6px;font-size:.95rem;font-weight:600;cursor:pointer;transition:transform .1s,opacity .2s}.btn:hover{transform:translateY(-1px)}.btn-primary{background:linear-gradient(135deg,#36f,#64f);color:#fff}.btn-secondary{background:#1e2840;color:#abd;margin-top:.5rem}.btn-accent{background:linear-gradient(135deg,#f46,#f64);color:#fff;margin-top:1rem}.error{color:#f68;font-size:.85rem;margin-top:.75rem;min-height:1.2rem}.profile-bar{display:flex;gap:1.5rem;margin-bottom:1.5rem;padding:.75rem 1rem;background:#0d1220;border-radius:8px;font-size:.85rem}.profile-bar span{color:#89b}.profile-bar strong{color:#6af}.server-table{width:100%;border-collapse:collapse;font-size:.85rem;margin-top:1rem}.server-table th{text-align:left;padding:.5rem;color:#679;border-bottom:1px solid #2a3555}.server-table td{padding:.5rem;border-bottom:1px solid #1a2035}.server-table tr:hover{background:#32509626}.server-table .join-btn{padding:.3rem .75rem;background:#36f;border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:.8rem}#game-canvas{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1}#hud{position:absolute;top:0;right:0;bottom:0;left:0;z-index:5;pointer-events:none}.hud-top{position:absolute;top:1rem;left:50%;transform:translate(-50%);display:flex;gap:2rem;font-size:.9rem;color:#2a3548;text-shadow:0 1px 2px rgba(255,255,255,.5)}.hud-tickets .red{color:#f56}.hud-tickets .blue{color:#5af}.hud-bottom{position:absolute;bottom:1.5rem;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:.5rem}.health-bar{width:200px;height:8px;background:#1a2035;border-radius:4px;overflow:hidden}.health-fill{height:100%;background:linear-gradient(90deg,#f46,#f86);transition:width .15s}.stamina-bar{width:160px;height:4px;background:#1a2035;border-radius:2px;overflow:hidden}.stamina-fill{height:100%;background:#4c8;transition:width .15s}.ammo-display{font-size:1.4rem;font-weight:700;color:#2a3548;text-shadow:0 1px 2px rgba(255,255,255,.6)}.ammo-display.reloading{color:#fa4;opacity:.7}.reload-indicator{font-size:.85rem;font-weight:700;color:#fa4;letter-spacing:.08em;animation:pulseReload .8s ease-in-out infinite}.reload-indicator.hidden{display:none}@keyframes pulseReload{0%,to{opacity:1}50%{opacity:.45}}#hitmarker{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:28px;height:28px;pointer-events:none;opacity:0}#hitmarker:before,#hitmarker:after{content:"";position:absolute;background:#fffffff2}#hitmarker:before{top:50%;left:4px;right:4px;height:2px;transform:translateY(-50%)}#hitmarker:after{left:50%;top:4px;bottom:4px;width:2px;transform:translate(-50%)}#hitmarker.flash{opacity:1;animation:hitPop .14s ease-out}#hitmarker.headshot:before,#hitmarker.headshot:after{background:#f46}@keyframes hitPop{0%{transform:translate(-50%,-50%) scale(1.6)}to{transform:translate(-50%,-50%) scale(1)}}#damage-flash{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:radial-gradient(ellipse at center,transparent 40%,rgba(255,40,60,.55) 100%);opacity:0}#damage-flash.flash{animation:damageFlash .18s ease-out}@keyframes damageFlash{0%{opacity:1}to{opacity:0}}.hud-zones{position:absolute;top:3rem;left:50%;transform:translate(-50%);display:flex;gap:1rem}.zone-pill{padding:.25rem .75rem;border-radius:12px;font-size:.75rem;font-weight:600;background:#1a2035;border:1px solid #334}.zone-pill.red{border-color:#f55;color:#f88}.zone-pill.blue{border-color:#58f;color:#8af}.zone-pill.neutral{border-color:#556;color:#99a}#kill-feed{position:absolute;top:5rem;right:1rem;display:flex;flex-direction:column;gap:.25rem;font-size:.8rem}.kill-entry{background:#00000080;padding:.25rem .5rem;border-radius:4px;animation:fadeOut 5s forwards}@keyframes fadeOut{0%,70%{opacity:1}to{opacity:0}}#crosshair{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:20px;height:20px;border:2px solid rgba(40,50,70,.75);border-radius:50%}#scoreboard{position:absolute;top:0;right:0;bottom:0;left:0;background:#000000b3;display:none;align-items:center;justify-content:center;pointer-events:none;z-index:20}#scoreboard.visible{display:flex}.scoreboard-panel{background:#0f1628;border:1px solid #334;border-radius:8px;padding:1.5rem;min-width:720px;max-width:95vw}.scoreboard-hint{font-size:.75rem;color:#667;font-weight:400}.scoreboard-grid{display:flex;gap:1.5rem;margin-top:1rem}.scoreboard-team{flex:1;min-width:0}.scoreboard-team h4{margin-bottom:.5rem;font-size:.95rem}.red-team h4{color:#f55}.blue-team h4{color:#58f}.score-table{width:100%;border-collapse:collapse;font-size:.78rem}.score-table th{text-align:left;padding:.35rem .4rem;color:#89b;border-bottom:1px solid #2a3555;font-weight:600}.score-table td{padding:.3rem .4rem;border-bottom:1px solid #1a2035}.score-table td.name{max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.score-table th:not(:first-child),.score-table td:not(:first-child){text-align:center}.bot-tag{font-size:.65rem;color:#778;font-weight:600}.scoreboard-empty{color:#667;font-size:.85rem;padding:.5rem 0}.phase-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#0006;font-size:2rem;font-weight:700;z-index:15;pointer-events:none}.phase-overlay.hidden{display:none}.match-end{text-align:center}.match-end h2{font-size:2.5rem;margin-bottom:1rem}.xp-gain{color:#6cf;font-size:1.2rem;margin:.5rem 0}.controls-hint{position:absolute;bottom:1rem;left:1rem;font-size:.7rem;color:#556;z-index:5}