/* All fonts and graphics are local: no CDN, web fonts or external assets. */
:root{color-scheme:dark;--bg:#101a17;--panel:#17231f;--line:#354237;--text:#e9e6d6;--muted:#98a294;--gold:#dfbf79;--blue:#80c5d8;--red:#e78b79}
.selection-types{position:absolute;left:12px;top:55px;width:128px;padding:12px 8px;background:#17231ff5;border:1px solid var(--line);z-index:2}.selection-types>.eyebrow{display:block;font-size:9px;margin-bottom:10px}.selection-types button{display:flex;gap:7px;align-items:center;width:100%;margin:7px 0;padding:9px 5px;border:1px solid #4b5946;background:#243328;color:var(--text);text-align:left;font-size:11px}.selection-types button:hover{border-color:var(--gold);background:#34452f}.selection-types strong{display:block;font:23px Consolas,monospace;color:var(--gold);margin-top:3px}.selection-types small{display:block;font-size:9px;line-height:1.5;color:var(--muted);margin-top:10px}.unit-type-icon{font-size:27px;color:var(--blue);width:31px;text-align:center}.archer-icon{color:#acc27d}.playing .battlefield{max-width:calc(100% - 280px)}
@media(max-width:800px){.selection-types{position:relative;left:0;top:0;width:max-content;max-width:100%;display:flex;align-items:center;gap:8px;padding:5px 8px;margin-bottom:8px}.selection-types button{width:108px;margin:0}.selection-types small{display:none}.selection-types>.eyebrow{font-size:8px;margin:0}.playing .battlefield{max-width:100%}}
*{box-sizing:border-box} [hidden]{display:none!important}
body{margin:0;background:var(--bg);color:var(--text);font-family:Segoe UI,Arial,sans-serif;font-size:14px;min-height:100vh}
button,textarea,input{font:inherit}button,a,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{opacity:.45;cursor:wait}button:focus-visible,a:focus-visible,textarea:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid var(--gold);outline-offset:4px}button{transition:background .15s,border-color .15s,transform .15s}button:not(:disabled):active{transform:translateY(1px)}
.topbar{height:84px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 40px;background:#101a17;position:relative;z-index:3}.brand{display:flex;gap:13px;align-items:center;text-decoration:none;color:var(--text);font-weight:750;letter-spacing:3px;font-size:18px}.brand small{display:block;font:9px Consolas,monospace;letter-spacing:2.2px;color:var(--muted);margin-top:5px}.brand-icon{font-size:39px;color:var(--gold);line-height:1}.header-center{display:flex;align-items:center;gap:12px;font:11px Consolas,monospace;letter-spacing:1.5px;color:#a9b4a7}.separator{color:#4e5e50;margin:0 10px}.live-dot{display:inline-block;width:6px;height:6px;background:#aed18d;box-shadow:0 0 9px #a3cb6540;margin-right:4px}
main{max-width:1700px;margin:0 auto;position:relative;padding:23px 32px 0}.battlefield{position:relative;margin:auto;max-width:1200px;transition:opacity .3s}.map-topline,.map-bottomline{display:flex;justify-content:space-between;font:10px Consolas,monospace;letter-spacing:1.5px;color:#98a48f;padding:10px 0}.map-bottomline{font-size:9px}.legend-dot{display:inline-block;width:6px;height:6px;margin-right:6px}.blue{background:var(--blue)}.red{background:var(--red)}
canvas{display:block;width:100%;aspect-ratio:3/2;background:#354630;image-rendering:pixelated;border:1px solid #526044;touch-action:none;cursor:crosshair;outline:none}body:not(.playing) .battlefield{opacity:.38;max-width:1200px}body:not(.playing) canvas{filter:saturate(.6)}body:not(.playing) .battlefield:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#101a17ef 0%,#101a1770 50%,#101a1740 100%);pointer-events:none}
.lobby{position:absolute;inset:25px 6% 50px;display:flex;justify-content:space-between;align-items:center;gap:60px;max-width:1280px;margin:auto}.intro{max-width:600px;padding-bottom:30px}.eyebrow{font:10px Consolas,monospace;letter-spacing:1.6px;color:#a7b49d}.intro .eyebrow{display:flex;align-items:center;gap:10px}.intro .eyebrow span{width:21px;height:2px;background:var(--gold)}h1{font-family:Georgia,'Times New Roman',serif;font-weight:normal;font-size:clamp(44px,5.3vw,83px);line-height:1.06;letter-spacing:-3px;margin:28px 0}h1 em{font-style:normal;color:var(--gold)}.intro-text{font-size:16px;line-height:1.85;color:#b4bcaa}.feature-row{display:flex;gap:0;margin:30px 0;font:11px Consolas,monospace;color:#c4c9b4}.feature-row span{border-right:1px solid #47533e;padding:0 17px}.feature-row span:first-child{padding-left:0}.feature-row span:last-child{border:0}.field-note{margin-top:70px;display:flex;gap:12px;align-items:center;font:10px Consolas,monospace;letter-spacing:1.5px;color:#c5cbb7}.field-note small{display:block;margin-top:8px;letter-spacing:0;color:#8f9c87}.note-line{height:32px;width:2px;background:#718063}
.lobby-card{background:#17231ff5;border:1px solid #42503f;box-shadow:0 18px 80px #0005;padding:28px;width:412px;flex-shrink:0;max-height:calc(100vh - 135px);overflow:auto}.card-top{display:flex;justify-content:space-between;gap:10px;padding-bottom:23px;border-bottom:1px solid var(--line)}.version{font:9px Consolas,monospace;color:#7d8b7c}h2{font-family:Georgia,'Times New Roman',serif;font-weight:normal;font-size:29px;letter-spacing:-.6px;margin:25px 0 12px}.muted{color:var(--muted);line-height:1.6;font-size:13px}.role-button{display:flex;align-items:center;gap:15px;width:100%;background:#202f26;border:1px solid #49523d;text-align:left;color:var(--text);padding:19px 16px;margin-top:15px}.role-button:hover{background:#2e3c2d;border-color:var(--gold)}.role-icon{font-size:29px;color:var(--gold);width:31px;text-align:center}.role-button strong{font-size:15px;display:block;font-weight:600}.role-button strong small{display:inline;font:10px Consolas,monospace;color:var(--gold);margin-left:4px}.role-button small{display:block;margin-top:7px;font-size:11px;color:var(--muted)}.role-button b{margin-left:auto;font-size:19px;color:var(--gold);font-weight:normal}.or-divider{display:flex;align-items:center;gap:12px;margin:24px 0 17px;font:8px Consolas,monospace;letter-spacing:1px;color:#899780;white-space:nowrap}.or-divider:before,.or-divider:after{content:'';height:1px;background:var(--line);flex:1}.button{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:12px 18px;border:1px solid var(--line);font-size:13px;font-weight:600;background:none;color:var(--text)}.button:hover{background:#2c382b;border-color:#7e8867}.button.primary{background:var(--gold);color:#202a20;border-color:var(--gold);width:100%;justify-content:space-between}.button.primary:hover{background:#ecd39c}.button.secondary{background:#233127}.button.subtle{border-color:transparent;color:#b8c0ad}.button.small{padding:9px 12px;font-size:12px}.practice{width:100%;justify-content:space-between;background:#1c2a22}.card-footnote{font:10px Consolas,monospace;color:#84947d;text-align:center;margin:21px 0 0}.card-footnote .live-dot{width:4px;height:4px}
.signal-panel h2{font-size:27px;margin-top:15px}.back-button{border:0;color:var(--muted);background:none;font-size:11px;margin-top:15px;padding:3px 0}.signal-panel label{display:block;margin:20px 0 8px;font-size:12px;color:#c1c9b8}.signal-panel label b{font:10px Consolas,monospace;color:var(--gold);margin-right:10px}textarea{width:100%;resize:vertical;min-height:65px;max-height:140px;background:#101a15;color:#b4c5a8;border:1px solid #3e4d3c;padding:10px;font:10px/1.5 Consolas,monospace;overflow-wrap:anywhere}textarea::placeholder{color:#72836e}.signal-panel .button{width:100%;margin-top:9px}.network-status{font-size:12px;line-height:1.5;color:var(--gold);margin-bottom:0}.network-status.error{color:#ffad9b}details{margin-top:14px;color:var(--muted);font-size:11px}summary{cursor:pointer}pre{white-space:pre-wrap;overflow-wrap:anywhere;max-height:120px;overflow:auto;font:10px/1.6 Consolas,monospace;color:#a1b196}
.lan-options{font-size:10px;border-top:1px solid var(--line);padding-top:14px}.lan-options label{display:block;margin:14px 0 8px;color:#bdc8b5}.lan-options input{width:100%;padding:10px;color:var(--text);background:#101a15;border:1px solid var(--line);font:12px Consolas,monospace}.lan-options p{line-height:1.6;margin-bottom:0}
.playing main{padding-top:10px}.playing .battlefield{width:min(100%,calc((100vh - 325px)*1.5))}.game-hud{max-width:1200px;margin:12px auto 0;display:flex;gap:26px;align-items:center;border:1px solid var(--line);background:var(--panel);padding:15px 21px;min-height:99px}.faction-block{display:flex;align-items:center;gap:13px;min-width:198px}.faction-icon{font-size:35px;color:var(--blue);width:42px;height:50px;background:#213a3c;text-align:center;border:1px solid #39616a}.faction-block small,.stat small{display:block;font:9px Consolas,monospace;letter-spacing:1.2px;color:var(--muted);margin-bottom:7px}.faction-block strong{font-size:14px;font-weight:600;display:block}.faction-block div>span{font:9px Consolas,monospace;color:#90a48b;display:block;margin-top:6px}.stat{border-left:1px solid var(--line);padding-left:22px;white-space:nowrap}.stat strong{font:23px Consolas,monospace}.stat strong span{font-size:12px;color:#8b9b82}.orders{margin-left:auto}.selection-title{color:#bac6ad;font-size:11px;margin-bottom:9px}.order-buttons{display:flex;gap:6px}.order-buttons button.active{border-color:var(--gold);color:var(--gold)}kbd{font:10px Consolas,monospace;color:var(--gold)}footer{display:flex;justify-content:space-between;gap:20px;max-width:1200px;margin:17px auto;font:9px Consolas,monospace;color:#87947e;letter-spacing:1.2px}footer i{font-style:normal;margin:0 12px;color:#4c5e43}.command-hint,.pause-banner{position:absolute;top:55px;left:50%;transform:translateX(-50%);background:#152219ef;border:1px solid var(--gold);color:var(--gold);padding:14px 22px;font-size:13px;text-align:center;max-width:90%;width:max-content;pointer-events:none}.pause-banner{top:110px;border-color:var(--red);color:var(--red)}
dialog{background:#19271f;color:var(--text);border:1px solid #677254;max-width:550px;width:calc(100% - 32px);padding:30px;box-shadow:0 20px 90px #0008}dialog::backdrop{background:#07100ccd;backdrop-filter:blur(4px)}dialog h2{margin-top:12px;font-size:33px}dialog p{font-size:13px;color:#b8c5ad;line-height:1.7}.controls{display:grid;grid-template-columns:140px 1fr;font-size:12px;gap:13px 10px;margin:25px 0}.controls dt{color:var(--gold);font-family:Consolas,monospace}.controls dd{margin:0;color:#c2cbb8}.victory-note{border-left:2px solid var(--gold);padding-left:14px}.dialog-actions{display:flex;gap:12px}.dialog-actions .button{flex:1}#result-dialog{text-align:center;padding:40px}.result-emblem{font-size:56px;color:var(--gold)}#result-dialog .primary{margin-top:20px}.toast{position:fixed;bottom:28px;left:50%;transform:translateX(-50%);padding:13px 22px;background:#2b3929;border:1px solid #819269;color:var(--text);font-size:13px;z-index:10;box-shadow:0 8px 25px #0005}
@media(min-width:1500px){.lobby{left:9%;right:9%}.lobby-card{width:450px;padding:32px}}
@media(max-width:1100px){.topbar{padding:0 24px}.lobby{gap:25px;inset:25px 5% 45px}.lobby-card{width:365px;padding:22px}.intro .eyebrow{font-size:8px}h1{font-size:58px}.game-hud{gap:14px;padding:12px}.stat{padding-left:12px}.faction-block{min-width:170px}.enemy-stat{display:none}.field-note{margin-top:40px}}
@media(max-width:800px){.topbar{height:70px;padding:0 17px}.brand{font-size:14px;letter-spacing:2px}.brand-icon{font-size:30px}.header-center{font-size:9px;gap:5px}.separator{margin:0 4px}.topbar .button span{display:none}main{padding:15px}.lobby{position:relative;inset:auto;display:block;padding:14px 0 30px}.intro{padding:0 12px}.intro .eyebrow{font-size:8px}.intro h1{font-size:52px;margin:24px 0 16px}.intro-text{font-size:14px}.feature-row{margin:20px 0}.field-note{display:none}.lobby-card{width:100%;max-width:470px;margin:30px auto 0;max-height:none}body:not(.playing) .battlefield{position:absolute;inset:0 0 auto;overflow:hidden;height:450px;pointer-events:none}body:not(.playing) canvas{height:450px;width:auto;max-width:none}body:not(.playing) .map-topline,body:not(.playing) .map-bottomline{visibility:hidden}.playing .battlefield{width:100%}.game-hud{flex-wrap:wrap;gap:15px}.orders{margin-left:0;flex:1}.stat strong{font-size:20px}.map-topline,.map-bottomline{font-size:8px;letter-spacing:.5px}footer{font-size:8px;line-height:1.7}footer>span:last-child{display:none}.playing main{padding:10px}.faction-block{min-width:160px}.controls{grid-template-columns:115px 1fr;gap:13px 6px}.command-hint,.pause-banner{font-size:11px;padding:10px;top:45px}.pause-banner{top:90px}}
