:root{color-scheme:dark;font-family:Arial,Helvetica,sans-serif;color:#e8ede9;background:#101918}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 80% 0,#263c31,transparent 55%),#101918}main{max-width:1170px;margin:auto;padding:28px 40px}header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #ffffff23;padding-bottom:24px}header a{color:#eff4ec;text-decoration:none;font-weight:900;font-size:26px}header a span,.tag{font-size:10px;letter-spacing:2px;color:#adbbb1}h1{font-size:clamp(38px,5vw,66px);letter-spacing:-3px;line-height:.95;margin:16px 0}h1 span{display:block;font-size:13px;letter-spacing:6px;color:#c4d798;margin-top:14px}.heading{display:flex;justify-content:space-between;align-items:center;padding:22px 0 28px}.heading>p{color:#9fafa5;font-size:14px;line-height:1.7}.eyebrow,label{font-size:10px;letter-spacing:2px;color:#acb8ac}.layout{display:grid;grid-template-columns:minmax(0,720px) 260px;gap:30px}.game{position:relative;overflow:hidden;background:#223d34;border:1px solid #ffffff24;border-radius:3px}canvas{width:100%;display:block}aside{padding:12px 0}.status{display:flex;justify-content:space-between}.dot{width:7px;height:7px;background:#c9f381;border-radius:100%;box-shadow:0 0 12px #c9f381}.metric{padding:29px 0;border-bottom:1px solid #ffffff20}label{display:block;margin-bottom:10px}strong{font-size:27px;font-family:monospace;font-weight:400}.metric strong{font-size:44px;color:#d7efa5}.stats{display:flex;justify-content:space-between;padding:25px 0}small{font-size:10px;color:#a5b0aa}.equipment,.brief,.controls{padding:15px 0;border-top:1px solid #ffffff20}.equipment p:not(.eyebrow){font-size:13px;display:flex;justify-content:space-between}.equipment b{color:#d7efa5}.brief p,.controls p{font-size:12px;color:#b4c1b8}.swatch{display:inline-block;width:8px;height:8px;margin-right:10px}.enemy{background:#e46950}.civilian{background:#eac75d}.supply{background:#9bda9b}kbd{font:10px monospace;border:1px solid #7c8d7c;padding:3px 5px;display:inline-block;color:#eef3e9}button{cursor:pointer;background:#d8eea5;color:#18241c;border:0;font-size:12px;font-weight:bold;letter-spacing:1px;padding:18px 22px}button:hover{filter:brightness(1.12)}button:focus-visible{outline:3px solid white;outline-offset:3px}button span{margin-left:35px}button.secondary{background:transparent;border:1px solid #647563;color:#d7e1d1;padding:10px;font-size:10px;margin:5px 6px 0 0}#overlay{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;background:linear-gradient(#0d191b55,#0d191be8);padding:25px}#overlay h2{font-size:clamp(26px,4vw,46px);letter-spacing:-1.5px;margin:20px 0}#overlay p{line-height:1.8;font-size:13px;color:#c0cfc4}#overlay button{margin-top:20px}#overlay.hidden{display:none}#message{font-size:12px;line-height:1.7;color:#d7efa5;min-height:40px}footer{display:flex;justify-content:space-between;color:#7f9486;font-size:9px;letter-spacing:1px;padding:23px 0}.touch{display:none}@media(pointer:coarse){.touch{position:absolute;bottom:12px;left:10px;right:10px;display:flex;justify-content:space-between;gap:6px}.touch button{touch-action:none;padding:18px 12px;opacity:.8}}@media(max-width:760px){main{padding:18px}.heading>p,.tag{display:none}.layout{grid-template-columns:1fr;gap:5px}aside{display:grid;grid-template-columns:1fr 1fr;gap:16px}.status{grid-column:1/-1}.metric{padding:5px 0}.stats{padding:5px 0}.metric strong{font-size:34px}.brief{display:none}footer{gap:20px;font-size:8px}h1{letter-spacing:-2px}}

select{background:#203328;color:#e3edcd;border:1px solid #78906c;padding:10px 30px;font:12px monospace;margin:5px}.touch{flex-wrap:wrap}.touch button{font-size:10px;padding:13px 10px}
.game{align-self:start}#overlay{z-index:2}#overlay:not(.hidden)~.touch{visibility:hidden}@media(max-width:480px){#overlay{padding:14px}#overlay h2{font-size:25px;margin:8px 0}#overlay p{font-size:11px;margin:6px 0}#overlay button{margin-top:8px;padding:14px}#overlay .eyebrow{font-size:9px}.heading{padding:18px 0}}

canvas{image-rendering:pixelated}.game{border-color:#6b6883}#overlay{overflow:auto}@media(pointer:coarse){.touch{position:static;padding:10px;background:#101918;gap:5px}.touch button{flex:1;min-width:50px}}@media(max-width:480px){#overlay{justify-content:flex-start}#overlay .eyebrow{display:none}#overlay h2{font-size:21px}#overlay p{font-size:10px;line-height:1.4}.heading{padding:12px 0}h1{font-size:34px}}

.swatch.enemy,.swatch.supply{background:#c46c71}.swatch.civilian{background:#75cec8}
