:root{color-scheme:dark;--bg:#101217;--surface:#191c23;--line:#2c3039;--muted:#878e9c;--text:#edf0f4;--lime:#baf573}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:14px system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:wait;opacity:.6}button:focus-visible,input:focus-visible,select:focus-visible,canvas:focus-visible{outline:2px solid var(--lime);outline-offset:3px}header{height:82px;padding:0 42px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}.brand{display:flex;gap:6px;align-items:center;color:var(--text);text-decoration:none;font-size:23px;font-weight:900;letter-spacing:-1px}.brand>span:not(.brand-icon){color:var(--lime)}.brand-icon{font-size:32px;margin-right:7px;color:var(--lime)}.brand small{font:10px monospace;color:var(--muted);letter-spacing:1px;margin-left:24px;border-left:1px solid var(--line);padding-left:24px}.header-right{display:flex;align-items:center;gap:9px;color:var(--muted);font:10px monospace;letter-spacing:1px}.status-dot{width:6px;height:6px;border-radius:50%;display:inline-block;background:var(--lime)}.icon-button{margin-left:20px;border:1px solid var(--line);background:none;color:var(--text);padding:9px 12px;font:10px monospace}main{max-width:1560px;margin:auto;padding:32px 42px}.topline{display:flex;justify-content:space-between;align-items:center;margin-bottom:26px}.eyebrow{font:10px monospace;letter-spacing:2px;color:var(--lime);margin:0 0 9px}h1{margin:0;font-size:40px;letter-spacing:-1.8px;font-weight:800}.topnote{font-size:12px;line-height:1.8;color:var(--muted);text-align:right}.topnote span{font:10px monospace;letter-spacing:1.2px;color:var(--text)}.layout{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:24px}.arena-toolbar{height:51px;border:1px solid var(--line);border-bottom:none;background:var(--surface);display:flex;align-items:center;justify-content:space-between;padding:0 18px;font:10px monospace;letter-spacing:1px}.arena-toolbar>div{display:flex;align-items:center;gap:17px}.live-badge{color:var(--lime);font-size:9px;border:1px solid #495a38;padding:5px 7px}.timer{font-size:17px;color:var(--text);font-weight:bold}#room-label{color:var(--muted)}#leave{border:0;color:var(--muted);background:none;font:10px monospace;padding:5px}.arena-shell{position:relative;aspect-ratio:1280/840;background:#242b36;border:1px solid var(--line);overflow:hidden}#arena{display:block;width:100%;height:100%;touch-action:none}.overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#11151a85;backdrop-filter:blur(3px)}.lobby-card{width:370px;max-width:90%;padding:28px 30px;background:#171b23f5;border:1px solid #454c57;box-shadow:0 20px 90px #0008}.lobby-card h2{margin:7px 0 10px;font-size:32px;letter-spacing:-1.3px}.lobby-card p{color:#9ba3b0;line-height:1.7;margin:8px 0 20px;font-size:12px}label{display:block;color:#9ba3b0;font:9px monospace;letter-spacing:1px;margin-bottom:7px}input,select{width:100%;min-width:0;background:#0f1319;border:1px solid #363e49;color:var(--text);padding:10px 11px;border-radius:0;font-size:12px}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px 0 18px}.primary,.secondary{display:flex;justify-content:space-between;align-items:center;width:100%;padding:13px 14px;font:11px monospace;font-weight:bold;letter-spacing:.5px;border:0}.primary{background:var(--lime);color:#1b2711}.primary:hover{background:#d2ffa0}.secondary{border:1px solid #3a424e;background:transparent;color:#c9d0db;margin-top:10px}.secondary:hover{background:#272e39}.lobby-card .lobby-note{font-size:10px;margin:18px 0 0}.lobby-card #error{color:#ff9b94;font-size:12px;margin:8px 0 0;min-height:0}.player-bar{display:grid;grid-template-columns:1.3fr 1fr 1fr .6fr;gap:20px;border:1px solid var(--line);border-top:0;background:var(--surface);padding:16px 19px}.mini-label{font:9px monospace;color:var(--muted);letter-spacing:1px;display:block;margin-bottom:6px}.health-row{display:flex;gap:12px;align-items:center}.health-row strong{color:var(--lime);font-size:21px}.health-track{height:5px;flex:1;background:#343a40}.health-track>div{height:100%;background:var(--lime);width:100%;transition:width .12s}.player-bar strong{font-size:16px;font-weight:650}.streak-display strong{font:16px monospace}.streak-display #best{font-size:10px}.muted{color:var(--muted)}.controls{display:flex;flex-wrap:wrap;gap:18px;color:var(--muted);font-size:10px;margin:16px 0 10px;align-items:center}kbd{display:inline-block;border:1px solid #343945;padding:3px 5px;font:9px monospace;color:#c3c9d2;min-width:20px;text-align:center;margin-right:2px}.pickup-hint{font-size:11px;color:var(--muted);min-height:18px}aside{display:flex;flex-direction:column;gap:18px}.panel{border:1px solid var(--line);background:var(--surface)}.panel-title{display:flex;align-items:center;justify-content:space-between;padding:17px 17px 14px}.panel-title h2{font-size:14px;margin:0;font-weight:650}.panel-title>span{font:9px monospace;letter-spacing:1px;color:var(--muted)}.score-head,.score-row{display:grid;grid-template-columns:minmax(0,1fr) 26px 26px 42px;gap:5px;align-items:center;padding:8px 16px}.score-head{font:8px monospace;color:var(--muted);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.score-row{font:11px monospace;height:35px}.score-row.self{background:#baf5730c;color:var(--lime)}.score-row>span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.score-row .rank{color:var(--muted);margin-right:9px;font-size:9px}.score-row .bot{font-size:8px;color:var(--muted);margin-left:6px}.score-row>span:not(:first-child){text-align:center}.empty{padding:24px 16px;color:var(--muted);font-size:11px;line-height:1.8}.panel-foot{border-top:1px solid var(--line);padding:11px 16px;font:8px monospace;color:var(--muted);letter-spacing:1px;display:flex;align-items:center;gap:7px}.map-card{margin:0 14px 12px;width:calc(100% - 28px);position:relative;background:#20242c;border:1px solid var(--line);padding:0;text-align:left;color:var(--text)}.map-card.selected{border-color:#677e4d}.map-card>canvas{width:100%;height:87px;display:block;background:#242b36}.map-card>div{padding:10px 11px}.map-card strong{font-size:11px;display:block}.map-card small{display:block;font-size:9px;color:var(--muted);margin-top:4px}.map-arrow{position:absolute;right:10px;bottom:19px;color:var(--lime)}.panel-note{font-size:10px;color:var(--muted);padding:0 16px 5px}.arsenal #weapon-list{padding:0 16px 13px;display:grid;grid-template-columns:1fr 1fr;gap:7px 5px}.weapon-item{font-size:10px;color:#b3bbc7;display:flex;align-items:center;gap:6px}.weapon-dot{width:5px;height:5px;background:var(--weapon-color)}.weapon-item small{display:none}footer{margin-top:38px;padding-top:20px;border-top:1px solid var(--line);display:flex;justify-content:space-between;font:9px monospace;letter-spacing:.4px;color:var(--muted)}footer>span:first-child{color:#d1d6de}.banner{position:absolute;top:18%;left:10%;width:80%;text-align:center;font-size:26px;font-weight:900;text-shadow:0 3px 10px #000;color:var(--lime);pointer-events:none;transition:opacity .3s}.kill-feed{position:absolute;right:12px;top:12px;pointer-events:none}.feed-item{background:#151a23dd;padding:7px 9px;margin-bottom:5px;font:10px monospace;color:#d1d8e3}.feed-item b{color:var(--lime)}.feed-item small{color:#949dab;font-size:9px}.death-overlay{position:absolute;inset:0;background:#13161b70;display:flex;flex-direction:column;justify-content:center;align-items:center;pointer-events:none}.death-overlay h2{font-size:28px}.death-overlay p{font:12px monospace;color:var(--lime)}[hidden]{display:none!important}.full-score{position:absolute;inset:10% 14%;padding:22px;background:#151922f2;border:1px solid #495262}.full-score h2{font-size:20px}.full-score>p{font:10px monospace;color:var(--muted)}.full-score .score-row{font-size:13px}.full-score .score-head{font-size:10px}@media(min-width:1500px){.lobby-card{width:400px;padding:35px}.lobby-card h2{font-size:36px}}@media(max-width:1050px){header{padding:0 22px}main{padding:26px 22px}.layout{grid-template-columns:minmax(0,1fr) 240px;gap:16px}.lobby-card{padding:18px 22px;width:325px}.lobby-card h2{font-size:26px}.lobby-card p{margin-bottom:12px}.lobby-card .lobby-note{margin-top:10px}.brand small{display:none}.player-bar{gap:10px;padding:14px}.topnote{font-size:10px}}@media(max-width:800px){.layout{grid-template-columns:1fr}.arena-shell{min-height:470px;aspect-ratio:auto}#arena{position:absolute;inset:0}aside{display:grid;grid-template-columns:1fr 1fr}.standings{grid-column:1/-1}.topnote{display:none}h1{font-size:32px}.header-right{font-size:8px}.icon-button{margin-left:4px;font-size:8px}.brand{font-size:18px}header{height:65px}.player-bar{grid-template-columns:1fr 1fr 1fr}.ping{display:none}.arsenal #weapon-list{grid-template-columns:1fr}footer{gap:15px;font-size:8px}}@media(max-width:450px){main{padding:20px 12px}header{padding:0 12px}.header-right .status-dot{display:none}#connection{max-width:70px;font-size:7px}.arena-toolbar{padding:0 10px}.arena-toolbar>div{gap:8px}.live-badge{font-size:8px}.arena-shell{min-height:485px}.controls{gap:10px}.streak-display #best{font-size:8px}.player-bar strong{font-size:13px}.panel-title{padding:12px}.panel-title h2{font-size:12px}}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.health-row strong{color:#ef4444}.health-track>div{background:#ef4444}

.weapon-item.unavailable{opacity:.3;text-decoration:line-through}

.field-row{grid-template-columns:1fr}

.kill-points{position:absolute;left:50%;top:32%;pointer-events:none;font-size:44px;font-weight:900;color:#ffcf67;text-shadow:0 3px 12px #000;animation:kill-points 1.6s ease-out forwards;z-index:6}@keyframes kill-points{0%{opacity:1;transform:translate(-50%,0) scale(.85)}20%{opacity:1;transform:translate(-50%,-12px) scale(1)}100%{opacity:0;transform:translate(-50%,-70px)}}

#lobby{overflow:auto;align-items:flex-start;padding:20px}.lobby-card{margin:auto;max-width:420px}.head-editor{border:1px solid #3e4555;border-radius:8px;margin:12px 0;padding:10px}.head-editor legend{font-size:10px;letter-spacing:1px;color:#b5bfcd}.head-editor-body{display:flex;align-items:center;gap:16px}#head-painter{width:112px;height:112px;flex-shrink:0;touch-action:none;cursor:crosshair;background:#242c37;border-radius:50%;image-rendering:pixelated}.head-tools{flex:1;min-width:0}.head-tools label{margin:5px 0;font-size:9px}.head-tools input[type=color]{height:30px;width:100%;padding:2px;cursor:pointer}.head-tools select{height:30px;padding:3px}.head-tools button{width:100%;margin-top:6px;padding:5px;font-size:9px}.lobby-card h2{margin:8px 0}.lobby-card>p{margin:8px 0}

.feed-item{display:flex;align-items:center;gap:7px}.feed-weapon{width:48px;height:24px;object-fit:contain}

#touch-controls{position:absolute;left:0;right:0;bottom:max(12px,env(safe-area-inset-bottom));display:flex;justify-content:space-between;align-items:center;padding:0 14px;pointer-events:none;z-index:4}.touch-pad{width:112px;height:112px;position:relative;border-radius:50%;border:2px solid #ffffff55;background:#151a2380;touch-action:none;user-select:none;pointer-events:auto}.touch-knob{position:absolute;left:calc(50% - 20px);top:calc(50% - 20px);width:40px;height:40px;border-radius:50%;background:#baf57377;border:2px solid #d9ffad;pointer-events:none}.touch-pad small{position:absolute;bottom:5px;left:0;right:0;text-align:center;font:bold 9px monospace;color:#fff;pointer-events:none}.touch-actions{display:flex;flex-direction:column;gap:8px;pointer-events:auto}.touch-actions button,#touch-score-close{min-height:42px;padding:8px 12px;border:1px solid #ffffff55;background:#18212ee8;color:#edf0f4;font:bold 10px monospace;touch-action:manipulation}#touch-score-close{display:none}.touch-device #touch-score-close{display:block;float:right}.touch-device .full-score{z-index:7;inset:5%;overflow:auto}.touch-device .arena-shell{min-height:0;height:clamp(400px,65dvh,650px);aspect-ratio:auto}.touch-device #arena{position:absolute;inset:0}.touch-device .controls{display:none}.touch-device .topnote{display:none}@media(max-width:800px){.touch-device main{padding:12px}.touch-device .topline{margin-bottom:12px}.touch-device h1{font-size:26px}.touch-device header{padding:0 12px}.touch-device input,.touch-device select{font-size:16px}.touch-device .lobby-card{padding:15px;max-width:94%}.touch-device .lobby-card h2{font-size:24px}.touch-device #lobby{padding:8px}.touch-device .player-bar{grid-template-columns:1fr 1fr;gap:12px}.touch-device .streak-display{grid-column:1/-1}.touch-device .streak-display strong{font-size:13px}.touch-device .header-right{letter-spacing:0}.touch-device .arena-toolbar>div{gap:7px}.touch-device #room-label{display:none}}@media(pointer:coarse) and (orientation:landscape) and (max-height:600px){.touch-device .topline{display:none}.touch-device header{height:45px}.touch-device .arena-shell{height:calc(100dvh - 100px);min-height:240px}.touch-device .layout{display:block}.touch-device main{padding:4px 10px}.touch-device .touch-pad{width:96px;height:96px}.touch-device aside{margin-top:20px}.touch-device .player-bar{padding:8px;grid-template-columns:1fr 1fr 1fr}.touch-device .streak-display{grid-column:auto}}

#touch-topbar{display:none}@media(orientation:landscape){body.touch-device.playing{overflow:hidden;overscroll-behavior:none}.touch-device.playing .arena-shell{position:fixed;inset:0;width:100vw;height:100dvh;min-height:0;max-height:none;border:0;z-index:20}.touch-device.playing #touch-topbar{position:absolute;display:flex;gap:6px;top:max(8px,env(safe-area-inset-top));left:max(8px,env(safe-area-inset-left));z-index:8}.touch-device.playing #touch-topbar button{min-height:36px;padding:6px 10px;background:#17212ed9;border:1px solid #ffffff55;color:#edf0f4;font:bold 9px monospace;touch-action:manipulation}.touch-device.playing #touch-controls{padding-left:max(14px,env(safe-area-inset-left));padding-right:max(14px,env(safe-area-inset-right))}.touch-device.playing .kill-feed{top:max(8px,env(safe-area-inset-top));max-width:45%;font-size:9px}}

.lobby-card{width:min(560px,100%);max-width:560px}.custom-preview{display:flex;flex-direction:column;align-items:center;gap:6px;margin:8px 0 14px}.custom-preview canvas{width:220px;height:152px;border:1px solid #3e4555;border-radius:8px}.custom-preview strong{font:12px monospace;color:#baf573}.custom-preview label{margin:2px}.custom-preview input[type=checkbox]{width:auto;min-height:0}.custom-preview select{width:180px}.appearance-controls{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}.appearance-controls label{margin:0}.appearance-controls input[type=color]{width:100%;height:35px;padding:2px}.appearance-controls select{width:100%;height:35px;padding:4px}.head-presets{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:12px}.head-presets span{font-size:9px;letter-spacing:1px;color:#b5bfcd}.head-presets button{font-size:10px;padding:7px 10px}.head-tools{display:grid;grid-template-columns:1fr 1fr;gap:4px 8px}.head-tools label,.head-tools select,.head-tools input{grid-column:1/-1}.head-tools button{margin:0}.head-tools #head-clear{grid-column:1/-1}@media(max-width:450px){.lobby-card{padding:16px;width:100%}#lobby{padding:12px}.head-editor-body{gap:10px}#head-painter{width:100px;height:100px}}

/* The join menu uses viewport space instead of the smaller gameplay canvas. */
#lobby{position:fixed;inset:12px;z-index:30;padding:12px;align-items:center;background:#11151ae8}
.lobby-card{width:min(1040px,100%);max-width:1040px;margin:auto;padding:20px 24px}
.lobby-card>.eyebrow,.lobby-card>p:not(#error){display:none}
.lobby-card h2{font-size:24px;margin:0 0 14px}
#join-form{display:grid;grid-template-columns:210px minmax(0,1fr);gap:20px;align-items:start}
.join-settings{padding-top:12px}.join-settings .field-row{grid-template-columns:1fr;margin:18px 0}.join-settings .primary,.join-settings .secondary{padding:12px}
.head-editor{margin:0;padding:12px;display:grid;grid-template-columns:180px minmax(0,1fr);gap:8px 16px}
.head-editor>.custom-preview{grid-column:1;grid-row:1/7;margin:0;justify-content:center}
.custom-preview canvas{width:180px;height:125px}.custom-preview select{width:160px}
.head-editor>.appearance-controls,.head-editor>label,.head-editor>select,.head-editor>.head-editor-body,.head-editor>.head-presets{grid-column:2}
.head-editor>.appearance-controls{margin:0}.head-editor>label{margin:2px 0 0}.head-editor>select{padding:6px}.head-editor-body{gap:12px}.head-presets{margin:0}
.head-tools label{margin:1px 0}.head-tools select{height:27px}.head-tools input[type=color]{height:27px}.head-tools button{padding:5px}
@media(min-width:700px) and (max-height:650px){
 #lobby{inset:5px;padding:5px}.lobby-card{padding:10px 14px}.lobby-card h2{font-size:18px;margin-bottom:6px}
 .head-editor{padding:8px;gap:4px 10px;grid-template-columns:150px minmax(0,1fr)}
 .custom-preview canvas{width:150px;height:104px}.custom-preview>label[for=preview-weapon],.custom-preview>#preview-weapon{display:none}
 .appearance-controls{gap:4px 8px}.appearance-controls input[type=color],.appearance-controls select{height:26px}.head-tools label{font-size:8px}.head-tools select,.head-tools input[type=color]{height:22px;font-size:11px;min-height:0}
 .head-tools button{padding:3px;font-size:8px}#head-painter{width:90px;height:90px}.head-presets button{padding:4px 7px}
}
@media(max-width:699px){
 #lobby{inset:0;padding:12px;align-items:flex-start}.lobby-card{padding:14px;width:100%;margin:auto}
 #join-form{grid-template-columns:1fr;gap:14px}.join-settings{padding:0;display:grid;grid-template-columns:1fr 1fr;gap:8px}
 .join-settings>label{grid-column:1/-1;margin:0}.join-settings>input{grid-column:1/-1}.join-settings .field-row{grid-column:1/-1;margin:0}.join-settings .secondary{margin:0}
 .head-editor{grid-template-columns:120px minmax(0,1fr);gap:6px 10px;padding:8px}.custom-preview canvas{width:120px;height:83px}.custom-preview select{width:110px}.custom-preview label{font-size:8px}.head-editor-body{flex-wrap:wrap}#head-painter{width:85px;height:85px}.head-tools{width:100%}
}
@media(min-width:700px) and (max-height:450px){
 .head-tools{grid-template-columns:1fr 1fr;gap:4px}.head-tools label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
 .head-tools select,.head-tools input{grid-column:auto}.head-tools button{padding:4px}.head-tools #head-clear{grid-column:1/-1}
 .head-editor-body{align-items:center}.custom-preview{gap:4px}.head-presets{gap:4px}
 .join-settings .field-row{margin:12px 0}
}