*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;overflow:hidden}body{color:#ccc8bc;background:#0e1118;flex-direction:column;font-family:system-ui,-apple-system,sans-serif;display:flex}#top-bar{background:#14171f;border-bottom:1px solid #222630;flex-wrap:wrap;flex-shrink:0;align-items:center;gap:8px;min-height:52px;padding:5px 12px;display:flex}#main{flex:1;grid-template-columns:1fr 270px;display:grid;overflow:hidden}#map-area{background:#0a0d12;position:relative;overflow:hidden}#side{background:#14171f;border-left:1px solid #222630;flex-direction:column;display:flex;overflow:hidden}#bottom{background:#14171f;border-top:1px solid #222630;flex-shrink:0;align-items:center;gap:16px;min-height:30px;padding:5px 12px;display:flex}@media (aspect-ratio<=1),(width<=720px){#top-bar{-webkit-overflow-scrolling:touch;flex-wrap:nowrap;overflow:auto hidden}#main{grid-template-rows:1fr minmax(34vh,42vh);grid-template-columns:1fr}#side{border-top:1px solid #222630;border-left:none}}canvas{touch-action:none;-webkit-user-select:none;user-select:none;display:block}.rg{background:#0e1118;border:.5px solid #222630;border-radius:6px;flex-shrink:0;align-items:center;gap:5px;padding:4px 9px;display:flex}.ri{font-size:13px}.rl{color:#555;text-transform:uppercase;letter-spacing:.05em;font-size:9px;line-height:1}.rv{color:#ccc8bc;min-width:32px;font-size:13px;font-weight:600;line-height:1}.rr{min-width:28px;font-size:10px;line-height:1}.rr.pos{color:#4a8a5a}.rr.neg{color:#9a4040}.rr.zer{color:#555}.timer-g{flex-shrink:0;align-items:center;gap:6px;margin-left:auto;display:flex}.day-lbl{color:#444;text-transform:uppercase;letter-spacing:.06em;font-size:9px}.day-val{color:#aaa;text-align:center;min-width:28px;font-size:16px;font-weight:700}.sb{color:#666;cursor:pointer;background:0 0;border:.5px solid #333;border-radius:5px;padding:3px 8px;font-size:11px;transition:background .1s,color .1s}.sb.on{color:#ccc8bc;background:#1e2230;border-color:#4a5070}.pb{color:#888;cursor:pointer;background:0 0;border:.5px solid #333;border-radius:5px;padding:3px 9px;font-size:12px}.menu-btn{color:#8a90a0;cursor:pointer;background:#0e1118;border:.5px solid #2a2d3a;border-radius:5px;padding:4px 9px;font-size:11px;transition:background .1s,color .1s,border-color .1s}.menu-btn:hover{color:#ccc;background:#161a26;border-color:#445}#side-hdr{text-transform:uppercase;letter-spacing:.08em;color:#444;border-bottom:1px solid #1e2230;flex-shrink:0;padding:8px 12px 5px;font-size:9px;font-weight:700}#side-body{flex:1;padding:8px 12px;overflow-y:auto}#side-body::-webkit-scrollbar{width:3px}#side-body::-webkit-scrollbar-thumb{background:#252535;border-radius:2px}#side-foot{border-top:1px solid #1e2230;flex-shrink:0;padding:6px 12px}.sn{color:#ccc8bc;margin-bottom:1px;font-size:14px;font-weight:700}.st{color:#555;text-transform:capitalize;margin-bottom:7px;font-size:11px}.sh{text-transform:uppercase;letter-spacing:.07em;color:#363a4a;border-bottom:.5px solid #1c2030;margin:8px 0 4px;padding-bottom:2px;font-size:9px;font-weight:700}.sr{color:#888;justify-content:space-between;margin:2px 0;font-size:11px;line-height:1.4;display:flex}.sr span:last-child{color:#b8b5aa;font-weight:500}.tag{letter-spacing:.04em;text-transform:uppercase;border-radius:3px;margin-right:3px;padding:1px 5px;font-size:9px;font-weight:700;display:inline-block}.tp{color:#5090d0;background:#1a2e50}.te{color:#c05050;background:#3a1515}.tn{color:#555;background:#1e2028}.bb{cursor:pointer;text-align:left;background:#0e1118;border:.5px solid #1e2230;border-radius:6px;align-items:flex-start;gap:7px;width:100%;margin:3px 0;padding:6px 8px;transition:border-color .12s,background .12s;display:flex}.bb:hover:not(:disabled){background:#121520;border-color:#363a4a}.bb:disabled{opacity:.38;cursor:default}.bb .bi{flex-shrink:0;margin-top:1px;font-size:14px}.bb .bn{color:#b8b5aa;font-size:11px;font-weight:600;line-height:1.2}.bb .bd{color:#444;margin-top:1px;font-size:10px;line-height:1.3}.bb .bc{color:#b09040;white-space:nowrap;flex-shrink:0;font-size:10px;font-weight:600}.bb .bi2{flex:1}.pbar{background:#1a1d28;border-radius:2px;height:4px;margin-top:2px;overflow:hidden}.pbf{border-radius:2px;height:100%;transition:width .3s}.ord-wrap{flex-wrap:wrap;gap:4px;display:flex}.ord-btn{color:#777;cursor:pointer;background:#0e1118;border:.5px solid #2a2d3a;border-radius:5px;padding:4px 8px;font-size:10px;transition:background .1s,color .1s,border-color .1s}.ord-btn:hover{color:#aaa;border-color:#445}.ord-btn.sel{color:#7aaaf0;background:#162040;border-color:#4a6090}.ord-btn.retreat-sel{color:#d07070;background:#200e0e;border-color:#603030}.ord-btn.push-sel{color:#70c050;background:#0e2010;border-color:#3a6020}.ord-btn.entrench-sel{color:#c0a040;background:#201a08;border-color:#605020}.no-sel{color:#333;text-align:center;margin-top:50px;font-size:12px;line-height:2}.log-e{white-space:nowrap;text-overflow:ellipsis;font-size:10px;overflow:hidden}.log-e.g{color:#4a7a5a}.log-e.b{color:#8a3838}.log-e.i{color:#4a6888}.log-e.n{color:#444}#tt{pointer-events:none;color:#999;z-index:200;background:#10131c;border:.5px solid #2a2d3a;border-radius:6px;max-width:190px;padding:6px 9px;font-size:10px;line-height:1.7;display:none;position:fixed}#tt strong{color:#ccc;font-size:11px}#infra-modal,.panel{z-index:300;background:#000000a6;justify-content:center;align-items:center;display:none;position:fixed;inset:0}#infra-modal.show,.panel.show{display:flex}#infra-box{background:#14171f;border:.5px solid #2a2d3a;border-radius:10px;min-width:260px;max-width:320px;padding:20px}#infra-box h3{color:#ccc;margin-bottom:12px;font-size:13px;font-weight:700}.ib{cursor:pointer;color:#aaa;text-align:left;background:#0e1118;border:.5px solid #1e2230;border-radius:6px;width:100%;margin:5px 0;padding:8px 12px;font-size:12px;transition:border-color .12s;display:block}.ib:hover:not(:disabled){color:#ccc;border-color:#3a4060}.ib:disabled{opacity:.35;cursor:default}.ib-cost{color:#b09040;margin-top:2px;font-size:10px}.ib-close{color:#555;cursor:pointer;background:0 0;border:none;margin-top:10px;font-size:11px;text-decoration:underline}.panel-box{background:#14171f;border:.5px solid #2a2d3a;border-radius:10px;flex-direction:column;width:min(900px,94vw);max-height:88vh;padding:0;display:flex;overflow:hidden}.panel-hd{border-bottom:1px solid #222630;justify-content:space-between;align-items:center;padding:12px 18px;display:flex}.panel-hd h2{color:#ccc8bc;letter-spacing:.04em;font-size:14px;font-weight:700}.panel-x{color:#667;cursor:pointer;background:0 0;border:none;padding:2px 6px;font-size:18px;line-height:1}.panel-x:hover{color:#ccc}.panel-bd{padding:16px 18px;overflow-y:auto}.panel-bd::-webkit-scrollbar{width:4px}.panel-bd::-webkit-scrollbar-thumb{background:#252535;border-radius:2px}