:root{color-scheme:dark;--lime:#cce573;--ink:#e9e7d5;--line:#465043}*{box-sizing:border-box}body{margin:0;background:#171c16;color:var(--ink);font-family:'IBM Plex Mono',monospace;background-image:linear-gradient(#ffffff06 1px,transparent 1px),linear-gradient(90deg,#ffffff06 1px,transparent 1px);background-size:48px 48px}.shell,footer{max-width:1512px;margin:auto;padding:0 6.3%}header{height:72px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;font-size:10px;letter-spacing:.08em;font-weight:600;color:#a8b09c}header a{color:var(--ink);text-decoration:none;display:flex;align-items:center;gap:12px}header a span{font-size:28px;color:var(--lime)}.heading{display:flex;justify-content:space-between;align-items:end;padding:42px 0 28px}.eyebrow,.section-index{font-size:10px;letter-spacing:.12em;color:#a5b59b}.eyebrow b{background:var(--lime);color:#1a2015;padding:7px 9px}.heading h1,.overlay h2,.briefing h2{font-family:'Barlow Condensed',Impact,sans-serif;font-weight:900;letter-spacing:-.045em;line-height:.85}.heading h1{font-size:clamp(62px,9vw,130px);margin:22px 0 13px}.heading h1 em{color:var(--lime);font-style:normal}.heading h1 em span,.briefing h2 span{color:#f39953}.heading p,.briefing p{font-size:12px;color:#b6c0ac;line-height:1.8}.stamp{width:110px;height:110px;border:1px solid #768465;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;transform:rotate(12deg);color:#aabd93;font-size:8px;letter-spacing:.1em;line-height:1.2}.stamp strong{font:700 25px 'Barlow Condensed',sans-serif}.frame{border:1px solid #687461;background:#0d110d;box-shadow:0 24px 70px #0005}.framebar{min-height:45px;padding:0 18px;display:flex;justify-content:space-between;align-items:center;font-size:10px;letter-spacing:.08em;color:#9eaa92}.framebar strong,.bottom b{color:#e5e8d8}.bottom{min-height:38px;font-size:9px}.bottom span:first-child{color:var(--lime)}.game{position:relative;aspect-ratio:16/9;background:#121b11;overflow:hidden}.game canvas{display:block;width:100%;height:100%;touch-action:none}.overlay{position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:20px;background:radial-gradient(ellipse,#273622ed,#10170ff5)}.overlay[hidden],.hud[hidden]{display:none}.crosshair{font-size:34px;color:var(--lime)}.kicker{font-size:10px;letter-spacing:.2em;color:#b7c9a1;margin-top:15px}.overlay h2{font-size:clamp(55px,7vw,92px);margin:20px 0 15px}.overlay p{font-size:12px;color:#aab8a2}.overlay button{border:0;background:var(--lime);color:#172013;font:600 12px 'IBM Plex Mono',monospace;padding:17px 21px;margin-top:18px;cursor:pointer;min-width:242px}.overlay button:hover{background:#e0f39c}.overlay button span{float:right}.overlay small{font-size:9px;color:#8c9b83;letter-spacing:.08em;margin-top:17px}.hud{position:absolute;top:14px;left:14px;right:14px;display:flex;gap:4px;z-index:2;pointer-events:none}.hud div{background:#152015e8;border:1px solid #748766;padding:7px 12px;min-width:76px}.hud small,.hud strong{display:block}.hud small{font-size:8px;color:#a9b99c}.hud strong{font:700 22px 'Barlow Condensed',sans-serif;color:#e8efdc}.hud button{pointer-events:auto;margin-left:auto;border:1px solid #748766;background:#152015e8;color:#e8efdc;font-size:18px;width:42px;cursor:pointer}#message{position:absolute;top:22%;width:100%;text-align:center;color:#f4edc4;font:900 32px 'Barlow Condensed',sans-serif;text-shadow:2px 2px #182115;pointer-events:none}.briefing{display:grid;grid-template-columns:1fr 2fr;gap:8%;padding:75px 0}.section-index{color:var(--lime)}.briefing h2{font-size:55px;margin:20px 0}.instructions{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}.instructions article{border-top:1px solid #77856c;padding-top:15px}.instructions i{font-style:normal;font-size:10px;color:#899981}.instructions b{display:block;font-weight:400;font-size:27px;color:var(--lime);margin:25px 0 10px}.instructions h3{font:700 20px 'Barlow Condensed',sans-serif;margin:0}.instructions p{font-size:11px;color:#a4b09d}footer{border-top:1px solid var(--line);min-height:75px;display:flex;justify-content:space-between;align-items:center;color:#899782;font-size:9px;letter-spacing:.1em}button:focus-visible{outline:3px solid white;outline-offset:3px}@media(max-width:700px){.shell,footer{padding:0 4%}header div,.stamp{display:none}.heading{padding:35px 0 22px}.heading h1{font-size:clamp(53px,11vw,76px)}.game{aspect-ratio:4/3}.hud div{min-width:0;padding:5px 7px}.hud small{font-size:7px}.hud strong{font-size:18px}.overlay h2{font-size:50px}.overlay small{display:none}.briefing{grid-template-columns:1fr;gap:25px;padding:55px 0}.instructions{gap:14px}footer span:last-child{display:none}}@media(max-width:450px){.instructions{grid-template-columns:1fr}.instructions b{margin:10px 0}.overlay h2{font-size:42px;margin:12px 0}.overlay button{margin-top:6px;padding:12px}.framebar{font-size:8px}.eyebrow{font-size:8px}}
.map-picker{font-size:10px;color:#b7c9a1;letter-spacing:.12em;margin-top:8px}.map-picker select{margin-left:8px;background:#192218;color:#e9e7d5;border:1px solid #77856c;padding:5px 9px;font:inherit}.overlay button:disabled{opacity:.55;cursor:wait}
.hud .sound-button{margin-left:auto}.hud #pause{margin-left:0}
.mission-details{margin-top:7px;color:#c6d7b5;font-size:9px;line-height:1.5}.recruit-badge.waiting{opacity:.55}
.soldier-label.hit .soldier-name{color:#ff5b4d;background:#310800e8;outline:1px solid #ff7768;animation:hit-flash .18s steps(2,end) infinite}@keyframes hit-flash{50%{color:#fff;background:#a91c0b}}
.overlay{overflow-y:auto}.roster-panel{width:min(420px,95%);padding:10px 12px;margin:6px 0 2px;text-align:left;border:1px solid #829574;background:#182319dc}.roster-heading,.roster-actions{display:flex;align-items:center;gap:8px;justify-content:space-between;color:#d8e8cb;font-size:9px;letter-spacing:.08em}.roster-list{display:flex;flex-wrap:wrap;gap:5px;min-height:25px;margin:8px 0}.recruit-badge{padding:5px 7px;background:#3e5235;color:#eef2dc;font-size:9px}.roster-empty,.fallen-count{font-size:9px;color:#d1af9b}.fallen-count{margin-top:7px;line-height:1.5}.overlay .roster-actions button{min-width:0;padding:6px 8px;margin:0;font:600 9px "IBM Plex Mono",monospace}.overlay .roster-actions button:disabled{opacity:.4}.overlay .roster-actions .reset-roster{margin-left:auto;color:#c3cdb8;background:transparent;border:1px solid #718269}.overlay.victory .crosshair{animation:victory-spin 1.2s ease-out}.overlay.victory h2{animation:report-enter .65s both}.overlay.defeat{background:radial-gradient(ellipse,#422c25f2,#140f0df7)}.overlay.defeat .crosshair{color:#dc987a;animation:fall-in .8s both}.overlay.defeat h2{animation:report-enter 1s both}.overlay.victory .roster-panel,.overlay.defeat .roster-panel{animation:report-enter .9s .25s both}@keyframes victory-spin{from{transform:rotate(-110deg) scale(.25);opacity:0}to{transform:rotate(0) scale(1);opacity:1}}@keyframes fall-in{from{transform:translateY(-24px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes report-enter{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@media(prefers-reduced-motion:reduce){.overlay.victory *,.overlay.defeat *{animation:none!important}}@media(max-width:700px){.roster-panel{padding:6px 8px;margin:3px 0}.roster-list{margin:4px 0;min-height:18px}.recruit-badge{padding:3px 5px}.overlay .roster-actions button{padding:4px 6px;font-size:8px}.fallen-count{margin-top:3px}.overlay .kicker{margin-top:4px}.overlay .crosshair{font-size:22px}.overlay h2{margin:8px 0;font-size:38px}.overlay p{margin:5px 0}.overlay>button{margin-top:8px;padding:10px}}
@media(max-width:700px){.hud{flex-wrap:wrap}.hud div{padding:4px 6px}.hud button{height:35px;width:34px}.hud .sound-button{margin-left:auto}.hud #pause{margin-left:0}}
.objective-bar{position:absolute;z-index:1;bottom:12px;left:14px;right:14px;display:flex;gap:5px;flex-wrap:wrap;pointer-events:none}.objective-bar[hidden]{display:none}.objective{padding:6px 8px;background:#152015e8;border:1px solid #748766;color:#e3e8d7;font-size:9px;line-height:1.3}.objective.done{color:#cce573}.objective.unsupported{border-color:#b58b66;color:#ffbf8d}@media(max-width:700px){.objective-bar{bottom:7px;left:7px;right:7px}.objective{font-size:8px;padding:4px 5px}}
.game canvas{cursor:url("cursor.svg") 2 2, crosshair}
.overlay{justify-content:safe center}.overlay>*{flex-shrink:0}.heroes-hill{width:min(420px,95%);margin:6px 0 2px;text-align:left}.hill-title{display:flex;justify-content:space-between;background:#24321f;border:1px solid #819174;border-bottom:0;padding:5px 8px;color:#e4ead7;font-size:9px;letter-spacing:.08em}.hill-title span{color:#bdc9b1}.hill-scene{position:relative;height:92px;border:1px solid #819174;background:url("assets/hill.png") center 43% / cover no-repeat;image-rendering:pixelated;overflow:hidden}.hill-grave{position:absolute;width:4px;height:13px;background:#e2ddd0;box-shadow:1px 1px #41372b;animation:grave-appear .55s both}.hill-grave:before{content:"";position:absolute;top:3px;left:-3px;width:10px;height:3px;background:#e2ddd0;box-shadow:1px 1px #41372b}@keyframes grave-appear{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.overlay .music-toggle{min-width:0;padding:7px 12px;margin:5px 0 0;background:transparent;border:1px solid #879b76;color:#dce9d0;font-size:9px}.overlay .music-toggle:hover{background:#32452c}@media(max-width:700px){.hill-scene{height:65px}.heroes-hill{margin:3px 0}.hill-title{font-size:8px;padding:3px 7px}.overlay .music-toggle{font-size:8px;padding:5px 8px}}@media(prefers-reduced-motion:reduce){.hill-grave{animation:none}}
.overlay .crosshair{font-size:25px}.overlay .kicker{margin-top:6px}.overlay h2{font-size:clamp(42px,5.4vw,70px);margin:12px 0 8px}.overlay>p{margin:6px 0}.hill-scene{height:76px}.overlay>button:not(.music-toggle){padding:12px 20px;margin-top:8px}.overlay>small{margin-top:8px}@media(max-width:700px){.hill-scene{height:60px}.overlay h2{font-size:38px;margin:7px 0}.overlay>button:not(.music-toggle){padding:10px 16px}}
.game canvas{cursor:none}.field-cursor{position:absolute;width:32px;height:32px;z-index:4;pointer-events:none;image-rendering:pixelated;filter:drop-shadow(1px 1px 1px #000)}.field-cursor[hidden],.grenade-action[hidden]{display:none}.grenade-action{position:absolute;z-index:3;bottom:10px;right:12px;border:1px solid #cce573;background:#1d2b19eF;color:#e5f0d7;padding:9px 10px;font:600 10px "IBM Plex Mono",monospace;cursor:pointer}.grenade-action:hover{background:#405b32}.grenade-action:disabled{opacity:.5;cursor:default}.objective-bar{right:190px}#message{z-index:3}@media(max-width:700px){.grenade-action{bottom:7px;right:7px;padding:7px;font-size:8px}.objective-bar{right:140px}}
.squad-controls{position:absolute;top:76px;left:14px;z-index:3;display:flex;gap:4px;flex-wrap:wrap;max-width:calc(100% - 28px)}.squad-controls[hidden]{display:none}.squad-controls button{border:1px solid #819174;background:#182319e8;color:#e5ebd9;padding:7px 9px;font:600 10px "IBM Plex Mono",monospace;cursor:pointer}.squad-controls button.selected{background:#cce573;color:#172013;border-color:#cce573}.squad-controls button:disabled{opacity:.38;cursor:default}@media(max-width:700px){.squad-controls{top:86px;left:7px;gap:3px}.squad-controls button{padding:5px 6px;font-size:8px}}
.game-settings{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:7px 16px;margin-top:8px;max-width:95%}.game-settings .map-picker{margin-top:0}
.soldier-labels{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden}.soldier-labels[hidden],.soldier-label[hidden]{display:none}.soldier-label{position:absolute;top:0;left:0;width:54px;display:flex;flex-direction:column;align-items:center;gap:1px;color:#fffbe7;font:600 8px/9px "IBM Plex Mono",monospace;text-shadow:-1px -1px 2px #000,1px -1px 2px #000,-1px 1px 2px #000,1px 1px 2px #000;will-change:transform}.soldier-name{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.soldier-health{width:34px;height:6px;display:flex;gap:2px;padding:1px;background:#111a10;border:1px solid #080c07}.health-segment{flex:1;min-width:0;height:2px}.health-segment.remaining{background:#8be450}.health-segment.lost{background:#d34739}