html,body{background:#111;height:100%;margin:0;font-family:system-ui,sans-serif}#login-screen{z-index:100;background:#111;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}#login-screen.hidden{display:none}.login-card{text-align:center;color:#eee;background:#1c1c1c;border-radius:12px;width:90%;max-width:360px;padding:40px}.login-card h1{color:#2ee6a6;margin:0 0 8px;font-size:28px}.login-card>p{color:#aaa;margin:0 0 24px;font-size:14px}#login-form{flex-direction:column;gap:12px;display:flex}#username-input{color:#eee;background:#111;border:1px solid #333;border-radius:6px;outline:none;padding:10px 14px;font-size:15px}#username-input:focus{border-color:#2ee6a6}#login-form button[type=submit]{color:#111;cursor:pointer;background:#2ee6a6;border:none;border-radius:6px;padding:10px;font-size:15px;font-weight:700}#login-form button[type=submit]:disabled{opacity:.5;cursor:not-allowed}.login-error{color:#ff6b6b;margin:0;font-size:13px}.login-error.hidden{display:none}#room-screen{z-index:100;background:#111;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}#room-screen.hidden{display:none}.room-card{text-align:center;color:#eee;background:#1c1c1c;border-radius:12px;width:90%;max-width:360px;padding:40px}.room-card h1{color:#2ee6a6;margin:0 0 24px;font-size:28px}.room-actions{flex-direction:column;gap:12px;display:flex}.room-btn{color:#eee;cursor:pointer;background:#333;border:none;border-radius:6px;width:100%;padding:10px;font-size:15px;font-weight:700}.room-btn:hover:not(:disabled){background:#444}.room-btn:disabled{opacity:.5;cursor:not-allowed}.room-btn-primary{color:#111;background:#2ee6a6}.room-btn-primary:hover:not(:disabled){background:#26c98e}.room-divider{color:#555;padding:2px 0;font-size:13px;line-height:1;position:relative}.room-divider:before,.room-divider:after{content:"";background:#333;width:42%;height:1px;position:absolute;top:50%}.room-divider:before{left:0}.room-divider:after{right:0}.room-join-row{gap:8px;display:flex}.room-join-row input{color:#eee;text-transform:uppercase;letter-spacing:.1em;background:#111;border:1px solid #333;border-radius:6px;outline:none;flex:1;padding:10px 14px;font-family:monospace;font-size:16px}.room-join-row input:focus{border-color:#2ee6a6}.room-join-row .room-btn{width:auto;padding:10px 18px}.room-error{color:#ff6b6b;margin:10px 0 0;font-size:13px}.room-error.hidden{display:none}#layout{width:100%;height:100%;display:flex}#layout.hidden{display:none}#left-panel{background:#1c1c1c;flex-direction:column;flex-shrink:0;width:200px;display:flex;overflow-y:auto}#shortcuts-panel{border-bottom:1px solid #252525;padding:14px 14px 10px}.panel-heading{text-transform:uppercase;letter-spacing:.08em;color:#555;margin:0 0 10px;font-size:11px;font-weight:700}.shortcut-item{color:#888;align-items:center;gap:6px;margin-bottom:7px;font-size:12px;display:flex}.shortcut-item span{color:#666}kbd{color:#bbb;white-space:nowrap;background:#2a2a2a;border:1px solid #444;border-bottom-width:2px;border-radius:3px;padding:1px 5px;font-family:system-ui,sans-serif;font-size:10px;line-height:1.5;display:inline-block}#brush-panel{color:#eee;box-sizing:border-box;flex:1;padding:14px}#brush-panel .brush-title{text-transform:uppercase;letter-spacing:.08em;color:#555;margin-bottom:12px;font-size:11px;font-weight:700;display:block}#brush-panel label{color:#aaa;margin-bottom:14px;font-size:13px;display:block}#brush-panel input[type=range]{accent-color:#2ee6a6;width:100%;margin-top:4px;display:block}#brush-panel input[type=color]{cursor:pointer;background:0 0;border:none;width:100%;height:32px;margin-top:4px;padding:0;display:block}#app{flex:auto;position:relative;overflow:hidden}.hud-bar{color:#eee;text-transform:uppercase;letter-spacing:.04em;pointer-events:none;background:#00000080;justify-content:center;gap:24px;padding:8px 16px;font-size:13px;font-weight:600;display:flex;position:absolute;top:0;left:0;right:0}#hud-ammo{letter-spacing:.15em}#hud-ammo.ammo-empty{color:#e55}.event-log-panel{box-sizing:border-box;color:#eee;background:#141414b3;border-radius:6px;flex-direction:column;width:220px;max-height:40%;padding:10px;display:flex;position:absolute;top:44px;right:8px}.event-log-panel h3{color:#999;text-transform:uppercase;letter-spacing:.04em;margin:0 0 6px;font-size:12px}.event-log-list{margin:0;padding:0;font-size:12px;line-height:1.5;list-style:none;overflow-y:auto}.event-log-list li{border-top:1px solid #ffffff14;padding:4px 0}.event-log-list li:first-child{border-top:none}.ad-slot{color:#666;background:#ffffff0d;border:1px dashed #fff3;border-radius:4px;justify-content:center;align-items:center;height:60px;margin-top:8px;font-size:11px;display:flex}.ad-slot-bottom-left{width:200px;margin-top:0;position:absolute;bottom:8px;left:8px}.overlay{color:#eee;text-align:center;background:#000000d9;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.overlay.hidden{display:none}#fog-overlay{z-index:50;background:#111;position:fixed;inset:0}#phase-transition-overlay{z-index:100;pointer-events:none;opacity:0;background:#000;transition:opacity .35s;position:fixed;inset:0}#phase-transition-overlay.visible{opacity:1}.overlay-content h2{margin:0 0 8px}.overlay-content p{color:#aaa;margin:0}.lobby-content{min-width:300px}.lobby-player-list{flex-direction:column;gap:8px;min-height:48px;margin:16px 0;display:flex}.lobby-player-row{background:#ffffff0f;border:1px solid #0000;border-radius:6px;justify-content:space-between;align-items:center;padding:6px 10px;font-size:14px;display:flex}.lobby-player-row.is-self{border-color:#2ee6a6}.lobby-player-name{color:#eee}.lobby-player-status{text-transform:uppercase;letter-spacing:.04em;font-size:12px;font-weight:600}.lobby-player-status.is-leader{color:#f5c518}.lobby-player-status.is-ready{color:#2ee6a6}.lobby-player-status.is-waiting{color:#888}.lobby-actions{justify-content:center;gap:10px;margin-top:4px;display:flex}.lobby-btn{cursor:pointer;color:#eee;background:#333;border:none;border-radius:6px;padding:10px 24px;font-size:14px;font-weight:700}.lobby-btn:hover:not(:disabled){background:#444}.lobby-btn:disabled{opacity:.4;cursor:not-allowed}.lobby-btn-start{color:#111;background:#2ee6a6}.lobby-btn-start:hover:not(:disabled){background:#26c98e}.lobby-btn.is-ready{color:#111;background:#2ee6a6}.lobby-mode-selector{align-items:center;gap:12px;margin-bottom:12px;display:flex}.lobby-mode-label{color:#999;text-transform:uppercase;letter-spacing:.04em;flex-shrink:0;font-size:12px}.lobby-mode-buttons{gap:6px;display:flex}.lobby-mode-btn{color:#888;cursor:pointer;background:#222;border:1px solid #444;border-radius:6px;padding:5px 16px;font-size:13px;font-weight:600;transition:background .1s,color .1s}.lobby-mode-btn.active{color:#111;background:#2ee6a6;border-color:#2ee6a6}.lobby-mode-btn:disabled{cursor:default;opacity:.7}.lobby-mode-btn.active:disabled{opacity:1}.lobby-time-sliders{flex-direction:column;gap:8px;margin-bottom:12px;display:flex}.lobby-time-row{align-items:center;gap:10px;display:flex}.lobby-time-label{color:#999;text-transform:uppercase;letter-spacing:.04em;flex-shrink:0;width:40px;font-size:12px}.lobby-time-slider{accent-color:#2ee6a6;flex:1}.lobby-time-slider:disabled{opacity:.5;cursor:default}.lobby-time-value{color:#eee;text-align:right;flex-shrink:0;width:34px;font-size:13px;font-weight:600}.lobby-player-count{color:#888;margin:0 0 12px;font-size:13px}.lobby-room-info{align-items:center;gap:8px;margin-bottom:14px;display:flex}.lobby-code-label{color:#999;text-transform:uppercase;letter-spacing:.04em;flex-shrink:0;font-size:12px}.lobby-code-value{color:#2ee6a6;letter-spacing:.12em;text-align:left;flex:1;font-family:monospace;font-size:15px;font-weight:700}.lobby-visibility-btn{color:#888;cursor:pointer;background:#222;border:1px solid #444;border-radius:6px;padding:4px 12px;font-size:12px;font-weight:600}.lobby-visibility-btn:hover{background:#2a2a2a}.lobby-visibility-btn.is-public{color:#111;background:#2ee6a6;border-color:#2ee6a6}