@import "https://fonts.googleapis.com/css2?family=Press+Start+2P&family=Space+Mono:wght@400;700&display=swap";:root{--bg:#090b10;--panel:#11151b;--line:#313940;--red:#ee4549;--blue:#3f86ed;--text:#e7ecec;--muted:#7d888d}*{box-sizing:border-box}html,body{background:var(--bg);min-height:100%;color:var(--text);margin:0}body{background:radial-gradient(circle at 50% 25%,#1b2227,#090c10 60%);font-family:Space Mono,monospace}main{flex-direction:column;max-width:1300px;min-height:100vh;margin:auto;padding:0 28px;display:flex}header{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;height:108px;display:flex}header span{letter-spacing:.24em;color:#869399;font-size:8px}h1{letter-spacing:.03em;margin:10px 0 5px;font:400 27px "Press Start 2P"}h1:first-letter{color:var(--red)}h1 i{color:#818b90;margin:0 11px;font:400 12px Space Mono}header p{letter-spacing:.2em;color:#69757b;margin:0;font-size:8px}.seed{letter-spacing:.15em;color:#77838a;font-size:9px}.score{border-inline:1px solid var(--line);border-bottom:1px solid var(--line);background:#0f1318;grid-template-columns:1fr 220px 1fr;height:86px;display:grid}.score>div{justify-content:center;align-items:center;gap:20px;display:flex}.score small{letter-spacing:.15em;font-size:8px}.score strong{font:400 29px "Press Start 2P"}.score em{color:#7e898f;font-size:8px;font-style:normal}.score .red{border-right:1px solid var(--line);color:#ff6062}.score .blue{border-left:1px solid var(--line);color:#61a4ff}.score .clock{flex-direction:column;gap:7px}.score .clock small{color:#69757b}.score .clock strong{color:#d9dedf;font-size:14px}.field{border-inline:1px solid var(--line);background:#12171b;flex:1;min-height:0;position:relative;box-shadow:0 24px 70px #0009}canvas{cursor:crosshair;object-fit:contain;width:100%;height:auto;min-height:440px;max-height:calc(100vh - 370px);image-rendering:pixelated;image-rendering:crisp-edges;display:block}.tag{color:#a8b1b5;letter-spacing:.14em;background:#090c10d9;border:1px solid #3d474d;padding:7px 9px;font-size:7px;position:absolute;top:13px;left:13px}.tag,.classes,.orders{pointer-events:none}.orders{color:#89969a;letter-spacing:.08em;background:#090c10e8;border:1px solid #3d474d;max-width:520px;padding:7px 9px;font-size:6px;position:absolute;bottom:13px;left:13px}.orders b{color:#f0c15b;margin-right:4px}.orders b+span{margin-left:8px}.tag:before{content:"";background:#ee4549;width:6px;height:6px;margin-right:7px;animation:1s step-end infinite blink;display:inline-block}.classes{background:#090c10e8;border:1px solid #3d474d;display:flex;position:absolute;top:13px;right:13px}.classes span{color:#c8d0d2;border-left:1px solid #303940;align-items:center;gap:7px;padding:6px 9px;display:flex}.classes span:first-child{border-left:0}.classes b{color:#080b0e;place-items:center;width:17px;height:17px;font:700 8px "Press Start 2P";display:grid;box-shadow:0 0 12px}.classes i{letter-spacing:.1em;flex-direction:column;gap:2px;font-size:7px;font-style:normal;line-height:1;display:flex}.classes small{letter-spacing:.04em;color:#7f8b90;font-size:5px}.class-light b{background:#53ddff}.class-medium b{background:#ffe06a}.class-heavy b{background:#ff955a}.class-infantry b{background:#a9b7ad}.class-artillery b{background:#e4c46b}.commandbar{border-inline:1px solid var(--line);border-bottom:1px solid var(--line);background:#0b1014;grid-template-columns:1fr minmax(270px,420px) 1fr;align-items:center;height:54px;display:grid}.commandbar>div{align-items:center;gap:7px;padding:0 12px;display:flex}.commandbar .red-command{justify-content:flex-end}.commandbar span{letter-spacing:.12em;color:#7f8a8f;font-size:7px}.commandbar button{min-width:174px;padding:7px 11px;font-size:8px}.blue-command button.ready{color:#9ccaff;background:#14263d;border-color:#3f86ed;box-shadow:0 0 14px #3f86ed55}.red-command button.ready{color:#ff9c9b;background:#35191c;border-color:#ee4549;box-shadow:0 0 14px #ee454955}.commandbar button.in-flight{color:#f4d878;background:#312b18;border-color:#b49643;box-shadow:0 0 14px #c7a85044}.commandbar button:disabled{cursor:not-allowed;opacity:.62}.commandbar button.ready:disabled,.commandbar button.in-flight:disabled{opacity:1}.commandbar p{text-align:center;letter-spacing:.08em;color:#8e9a9e;margin:0;font-size:7px}@keyframes blink{50%{opacity:.2}}footer{border-top:1px solid var(--line);align-items:center;gap:10px;height:72px;display:flex}button{color:#c3cccf;cursor:pointer;background:#151b20;border:1px solid #3d474d;padding:9px 13px;font:700 9px Space Mono}button:hover{border-color:#87949a}.new{color:#eef2f2;border-color:#6d7a80}footer p{letter-spacing:.08em;color:#6d787d;margin-left:auto;font-size:8px}.playerhud,.control-help{z-index:4;pointer-events:none;background:#070b0dea;border:1px solid #58656a;position:absolute;box-shadow:0 8px 24px #0009}.playerhud{color:#d7e0e2;letter-spacing:.06em;grid-template-columns:repeat(3,auto);gap:5px 13px;min-width:245px;padding:9px 11px;font-size:7px;display:grid;top:48px;left:13px}.playerhud b{color:#8fc4ff;grid-column:1/-1;font:400 8px "Press Start 2P"}.playerhud.red b{color:#ff8887}.playerhud span{color:#d9e0e0}.playerhud small{color:#8d999d;grid-column:1/-1;font-size:6px}.control-help{color:#98a5a9;letter-spacing:.06em;max-width:455px;padding:7px 9px;font-size:6px;bottom:13px;right:13px}.control-help b{color:#78caff;margin-right:5px}canvas:focus{outline-offset:-2px;outline:1px solid #6ea9c5}@media (width<=700px){.commandbar{grid-template-columns:1fr 1fr;height:78px}.commandbar p{grid-area:2/1/auto/-1;padding-bottom:5px;font-size:5px}.commandbar>div{justify-content:center;padding:5px}.commandbar span{display:none}.commandbar button{padding:6px 8px}.orders{max-width:none;font-size:5px;bottom:60px;left:8px;right:8px}.control-help{max-width:none;font-size:5px;bottom:32px;left:8px;right:8px}.playerhud{min-width:220px;padding:7px;font-size:6px;top:38px;left:8px}.classes{top:auto;bottom:8px;right:8px}.classes span{gap:4px;padding:5px}.classes small{display:none}.classes b{width:14px;height:14px;font-size:6px}main{padding:0 8px}header{height:84px}.seed,header span,header p{display:none}h1{font-size:20px}.score{grid-template-columns:1fr 130px 1fr;height:70px}.score>div{gap:8px}.score em{display:none}.score strong{font-size:20px}.score .clock strong{font-size:10px}canvas{min-height:380px;max-height:none}footer p{display:none}footer{justify-content:center}}.deploy-zone{z-index:3;pointer-events:none;letter-spacing:.08em;text-align:center;background:#070b0de8;border:1px solid #4c585d;flex-direction:column;gap:3px;min-width:78px;padding:6px 7px;font-size:6px;display:flex;position:absolute;top:50%;transform:translateY(-50%);box-shadow:0 5px 16px #0008}.deploy-zone b{font-size:6px}.deploy-zone span{font:400 7px "Press Start 2P"}.blue-deploy{color:#8fc6ff;border-color:#3f86ed;left:6px}.red-deploy{color:#ff9291;border-color:#ee4549;right:6px}.help-backdrop{z-index:100;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#030608db;place-items:center;padding:24px;display:grid;position:fixed;inset:0}.help-modal{background:linear-gradient(145deg,#11181d,#090d11);border:1px solid #647077;width:min(980px,100%);max-height:90vh;padding:24px;overflow:auto;box-shadow:0 28px 90px #000}.help-heading{border-bottom:1px solid #354047;justify-content:space-between;align-items:flex-start;gap:24px;padding-bottom:17px;display:flex}.help-heading small{letter-spacing:.28em;color:#e4bd57;font-size:7px}.help-heading h2{margin:9px 0 0;font:400 17px/1.4 "Press Start 2P"}.help-close{border-color:#68767c;flex:none}.help-grid{background:#344047;border:1px solid #344047;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:18px;display:grid}.help-grid article{background:#0e1418;min-height:175px;padding:17px}.help-grid h3{color:#f0c860;margin:0 0 12px;font:400 9px/1.5 "Press Start 2P"}.help-grid p{color:#aeb9bd;margin:0;font-size:9px;line-height:1.75}.help-strip{color:#9ba8ad;background:#080d11;border:1px solid #38464d;margin-top:18px;padding:12px 14px;font-size:8px;line-height:1.65}.help-strip b{color:#73b6ff;margin-right:9px}@media (width<=800px){.help-grid{grid-template-columns:1fr 1fr}.help-modal{padding:17px}.help-heading h2{font-size:13px}.help-grid article{min-height:0}.deploy-zone{min-width:64px;padding:5px;font-size:5px;top:43%}.deploy-zone b{font-size:5px}.deploy-zone span{font-size:6px}}@media (width<=520px){footer{flex-wrap:wrap;justify-content:center;height:auto;min-height:72px;padding:8px 0}footer button{padding:7px 9px;font-size:7px}.help-backdrop{padding:8px}.help-modal{max-height:95vh;padding:12px}.help-heading{gap:9px}.help-heading h2{font-size:10px}.help-close{font-size:7px}.help-grid{grid-template-columns:1fr}.help-grid article{padding:13px}.deploy-zone{min-width:52px;top:50%}.deploy-zone b{display:none}}.hall-of-fame{border-inline:1px solid var(--line);border-bottom:1px solid var(--line);color:#929ea2;letter-spacing:.08em;white-space:nowrap;background:#0a0f13;align-items:center;gap:18px;min-height:46px;padding:8px 14px;font-size:7px;display:flex}.hall-of-fame strong{color:#edc45e;font:400 8px "Press Start 2P"}.hall-of-fame span.red{color:#ff7772}.hall-of-fame span.blue{color:#7bb9ff}.hall-of-fame .rematch-countdown{color:#f3d772;background:#2b2515;border:1px solid #b99d4c;margin-left:auto;padding:6px 9px;font:400 7px "Press Start 2P";animation:1s steps(2,end) infinite countdownPulse}.fullscreen{color:#9bdcff;border-color:#4f7e96}@keyframes countdownPulse{50%{border-color:#f3d772;box-shadow:0 0 12px #e8bf4d55}}:-webkit-any(main:fullscreen,main:-webkit-full-screen){background:#090b10;width:100vw;max-width:none;height:100vh;min-height:100vh;margin:0;padding:0;overflow:hidden}:is(main:fullscreen,main:fullscreen){background:#090b10;width:100vw;max-width:none;height:100vh;min-height:100vh;margin:0;padding:0;overflow:hidden}:-webkit-any(main:fullscreen header,main:-webkit-full-screen header){height:60px;padding:0 18px}:is(main:fullscreen header,main:fullscreen header){height:60px;padding:0 18px}:-webkit-any(main:fullscreen h1,main:-webkit-full-screen h1){margin:6px 0 3px;font-size:18px}:is(main:fullscreen h1,main:fullscreen h1){margin:6px 0 3px;font-size:18px}:-webkit-any(main:fullscreen .score,main:-webkit-full-screen .score){height:58px}:is(main:fullscreen .score,main:fullscreen .score){height:58px}:-webkit-any(main:fullscreen .score strong,main:-webkit-full-screen .score strong){font-size:21px}:is(main:fullscreen .score strong,main:fullscreen .score strong){font-size:21px}:-webkit-any(main:fullscreen .commandbar,main:-webkit-full-screen .commandbar){height:44px}:is(main:fullscreen .commandbar,main:fullscreen .commandbar){height:44px}:-webkit-any(main:fullscreen .field,main:-webkit-full-screen .field){flex:1;min-height:0;display:flex;overflow:hidden}:is(main:fullscreen .field,main:fullscreen .field){flex:1;min-height:0;display:flex;overflow:hidden}:-webkit-any(main:fullscreen canvas,main:-webkit-full-screen canvas){object-fit:fill;flex:1;width:100%;height:100%;min-height:0;max-height:none}:is(main:fullscreen canvas,main:fullscreen canvas){object-fit:fill;flex:1;width:100%;height:100%;min-height:0;max-height:none}:-webkit-any(main:fullscreen .hall-of-fame,main:-webkit-full-screen .hall-of-fame){min-height:40px;padding-block:5px}:is(main:fullscreen .hall-of-fame,main:fullscreen .hall-of-fame){min-height:40px;padding-block:5px}:-webkit-any(main:fullscreen footer,main:-webkit-full-screen footer){height:48px;min-height:48px;padding:0 12px}:is(main:fullscreen footer,main:fullscreen footer){height:48px;min-height:48px;padding:0 12px}:-webkit-any(main:fullscreen footer button,main:-webkit-full-screen footer button){padding:7px 10px;font-size:8px}:is(main:fullscreen footer button,main:fullscreen footer button){padding:7px 10px;font-size:8px}@media (width<=900px){.hall-of-fame{gap:9px;font-size:6px;overflow-x:auto}.hall-of-fame strong{font-size:7px}.hall-of-fame .rematch-countdown{font-size:6px}footer{flex-wrap:wrap;height:auto;min-height:72px;padding:7px 0}}