:root{--bg: #0a0a0f;--surface: #14141d;--surface-2: #1c1c28;--fg: #fafafa;--muted: #9a9ab0;--border: #2a2a3a;--blue: #3b82f6;--green: #22c55e;--red: #ef4444;--radius: 12px;--font-sans: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden}body{background:var(--bg);color:var(--fg);font-family:var(--font-sans);-webkit-font-smoothing:antialiased}.screen{display:none}.screen.active{display:block}#lobby-screen.active,#end-screen.active{display:grid;place-items:center;min-height:100vh;position:relative;background:radial-gradient(900px 500px at 50% -10%,rgba(59,130,246,.12),transparent),var(--bg)}.lobby-card{width:min(440px,92vw);background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:2rem 1.75rem;box-shadow:0 30px 80px #00000080;text-align:center}.game-title{font-size:clamp(2.4rem,8vw,3.4rem);font-weight:900;letter-spacing:.06em;margin:0 0 .4rem;background:linear-gradient(180deg,#fff,#9db8ff);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 40px rgba(120,160,255,.25)}.tagline{color:var(--muted);margin:0 0 1.5rem;font-size:.95rem;line-height:1.5}.join-box{display:flex;gap:.5rem}input[type=text]{flex:1;background:var(--surface-2);border:1px solid var(--border);color:var(--fg);border-radius:var(--radius);padding:.75rem .9rem;font-size:1rem;outline:none;font-family:inherit}input[type=text]:focus{border-color:var(--blue)}.btn{border:none;border-radius:var(--radius);padding:.75rem 1.2rem;font-size:1rem;font-weight:700;letter-spacing:.04em;color:#fff;cursor:pointer;transition:transform .08s ease,opacity .15s ease,box-shadow .15s ease}.btn:hover{transform:translateY(-1px)}.btn:active{transform:translateY(0)}.btn:disabled{opacity:.65;cursor:default;transform:none}.btn-blue{background:var(--blue);box-shadow:0 8px 24px #3b82f659}.btn-green{background:var(--green);box-shadow:0 8px 24px #22c55e4d;width:100%}.lobby-box{margin-top:.5rem;text-align:left}.lobby-head{display:flex;justify-content:space-between;font-size:.78rem;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);margin-bottom:.5rem}.player-list{list-style:none;margin:0 0 1rem;padding:0;max-height:240px;overflow-y:auto;display:flex;flex-direction:column;gap:.4rem}.player-row{display:flex;align-items:center;gap:.6rem;background:var(--surface-2);border:1px solid var(--border);border-radius:10px;padding:.55rem .7rem}.dot{width:14px;height:14px;border-radius:50%;flex-shrink:0;box-shadow:0 0 8px currentColor}.pname{flex:1;font-weight:600;font-size:.95rem}.pstatus{font-size:.7rem;font-weight:700;letter-spacing:.08em;color:var(--muted);text-transform:uppercase}.pstatus.is-ready{color:var(--green)}.waiting{margin:.75rem 0 0;text-align:center;font-size:.85rem}.muted{color:var(--muted)}.hidden{display:none!important}.conn-status{margin:1rem 0 0;font-size:.75rem;letter-spacing:.05em}.conn-status.ok{color:var(--green)}.countdown-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#05050ad9;display:grid;place-items:center;z-index:20}.countdown-inner{text-align:center}.countdown-label{display:block;color:var(--muted);letter-spacing:.3em;font-size:.9rem;margin-bottom:.5rem}.countdown-number{font-size:8rem;font-weight:900;color:#fff;text-shadow:0 0 60px rgba(120,160,255,.6)}#canvas{display:block;width:100vw;height:100vh;cursor:crosshair;background:var(--bg)}.hud{position:absolute;background:#0c0c14b3;border:1px solid var(--border);border-radius:12px;padding:.7rem .9rem;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:10;pointer-events:none}.hud-tl{top:16px;left:16px;width:220px}.hud-tr{top:16px;right:16px;text-align:center;min-width:90px}.hud-name{font-weight:700;font-size:.95rem;margin-bottom:.4rem}.hpbar{height:12px;background:#00000080;border-radius:6px;overflow:hidden;margin-bottom:.3rem}.hpbar-fill{height:100%;width:100%;background:var(--green);transition:width .1s linear}.hud-hp-text{font-size:.78rem;color:var(--muted)}.hud-sub{font-size:.72rem;color:var(--muted);letter-spacing:.06em;margin-top:.2rem}.hud-alive-num{font-size:2rem;font-weight:900;line-height:1}.zone-warning{position:absolute;top:80px;left:50%;transform:translate(-50%);color:#ff6b6b;font-weight:800;letter-spacing:.15em;font-size:1rem;z-index:10;text-shadow:0 0 20px rgba(255,60,60,.7);animation:pulse 1s infinite;pointer-events:none}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}.spectate-banner{position:absolute;bottom:18px;left:18px;background:#0c0c14cc;border:1px solid var(--border);border-radius:10px;padding:.6rem .9rem;font-size:.85rem;color:var(--muted);z-index:10}.minimap-wrap{position:absolute;bottom:16px;left:50%;transform:translate(-50%);border:1px solid var(--border);border-radius:10px;padding:4px;background:#0c0c14cc;z-index:10}#minimap{display:block;border-radius:6px}.end-card{text-align:center;background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:3rem 2.5rem;box-shadow:0 30px 80px #00000080}.end-title{font-size:clamp(2.5rem,9vw,4rem);font-weight:900;letter-spacing:.04em;margin:0 0 .75rem}.end-title.win{color:#ffd84d;text-shadow:0 0 40px rgba(255,216,77,.5)}.end-title.lose{color:#ff5c5c;text-shadow:0 0 40px rgba(255,60,60,.4)}.end-stats{color:var(--muted);font-size:1.1rem;margin:0 0 1.75rem}