:root{
  color-scheme:light;
  --desktop:#4c6c6c;
  --face:#b9b9b9;
  --face2:#d4d4d4;
  --dark:#373737;
  --mid:#777;
  --light:#f5f5f5;
  --cyan:#34e6e6;
  --blue:#000080;
  --text:#111;
  font-family:"Courier New",Courier,monospace;
}
*{box-sizing:border-box}
html,body{min-height:100%;margin:0}
body{background:var(--desktop);color:var(--text);overflow-x:hidden;background-image:repeating-linear-gradient(0deg,rgba(255,255,255,.015) 0 1px,transparent 1px 4px)}
button,input,select{font:inherit}
button{color:#111}
.hidden{display:none!important}
.desktop-shell{min-height:100vh;padding:10px;display:grid;place-items:center}
.classic-window{background:var(--face);border:3px solid;border-color:var(--light) #222 #222 var(--light);box-shadow:0 0 0 2px #777,8px 8px 0 rgba(0,0,0,.25)}
.main-menu-window{width:min(1180px,98vw);padding:12px}
.menu-columns{display:grid;grid-template-columns:300px minmax(0,1fr);gap:34px}
.main-menu-buttons{display:flex;flex-direction:column;gap:8px}
.retro-button,.retro-counter{min-height:50px;background:var(--face);border:4px solid;border-color:#fff #333 #333 #fff;box-shadow:inset -1px -1px #777,inset 1px 1px #ddd;padding:6px 14px;text-align:left;cursor:pointer;touch-action:manipulation}
.retro-button:hover,.retro-counter:hover{background:#c8c8c8}
.retro-button:active,.retro-counter:active,.retro-button.active{border-color:#333 #fff #fff #333;box-shadow:inset 2px 2px #777;transform:translate(1px,1px)}
.retro-button:disabled{color:#777;cursor:not-allowed}
.menu-button{font-size:28px;letter-spacing:-1px}
.menu-button span,.status-key,.hotkey{color:var(--cyan);text-shadow:1px 1px #777}
.retro-counter{display:flex;gap:12px;align-items:center;background:transparent;border-color:transparent;box-shadow:none;padding:0 8px;min-height:52px}
.counter-arrows{font-size:18px;color:#222;transform:rotate(45deg)}
.disabled-look{color:#777;text-shadow:1px 1px #eee}
.title-display{position:relative;min-height:620px;overflow:hidden;background:linear-gradient(#3139b0 0,#6367e1 37%,#f05476 69%,#ff9d47 100%);padding:18px;text-align:center}
.bevel-inset{border:4px solid;border-color:#333 #fff #fff #333;box-shadow:inset 2px 2px #555}
.scanlines{position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(255,255,255,.08) 0 2px,rgba(0,0,0,.04) 2px 4px);pointer-events:none;z-index:6;mix-blend-mode:overlay}
.pixel-title{position:relative;z-index:4;margin-top:10px;font-family:Impact,"Arial Black",sans-serif;font-size:clamp(50px,7vw,100px);font-style:italic;letter-spacing:-5px;color:white;text-shadow:5px 5px #1b1b1b,-2px -2px #eee;transform:skewX(-6deg)}
.mother-line{position:relative;z-index:4;font-size:clamp(18px,3vw,35px);color:white;letter-spacing:2px;text-shadow:2px 2px #333}
.registered-line{position:relative;z-index:4;margin-top:50px;font-size:clamp(26px,4vw,48px);color:white;text-shadow:2px 2px #555}
.demo-landscape{position:absolute;inset:190px 0 46px;overflow:hidden}
.mountain{position:absolute;bottom:-60px;background:#8fa6a1;filter:contrast(1.2);clip-path:polygon(0 100%,0 36%,7% 13%,13% 40%,22% 8%,31% 34%,43% 20%,52% 60%,63% 45%,74% 76%,84% 53%,100% 30%,100% 100%)}
.mountain.far{left:-5%;right:-5%;height:75%;opacity:.63;background:#b7c7bd}
.mountain.near{left:-10%;right:-10%;height:63%;background:#637b73;clip-path:polygon(0 100%,0 35%,11% 5%,19% 48%,28% 13%,39% 58%,51% 35%,63% 80%,74% 66%,83% 88%,92% 57%,100% 45%,100% 100%)}
.demo-sun{position:absolute;width:470px;height:470px;border-radius:50%;background:#fff600;left:43%;top:27%;box-shadow:0 0 18px #fff600}
.demo-blast{position:absolute;width:88px;height:88px;border-radius:50%;background:#fff800;right:20%;bottom:14%;box-shadow:0 0 0 28px rgba(255,137,0,.75),0 0 0 52px rgba(255,55,55,.35)}
.version-line{position:absolute;bottom:10px;left:0;right:0;z-index:8;font-size:18px;color:#111;text-shadow:1px 1px rgba(255,255,255,.5)}
.copyright-line{text-align:center;font-size:18px;padding-top:12px}
.game-window{width:min(1500px,99vw);padding:8px}
.game-status{display:grid;grid-template-columns:auto auto 1fr auto auto auto;gap:14px;align-items:center;background:#111;color:#fff;padding:8px 12px;font-size:20px;min-height:48px}
.status-player{text-align:center;color:#fff}.battle-wrap{position:relative;background:#000;overflow:hidden}.battle-wrap canvas{display:block;width:100%;height:auto;aspect-ratio:16/9;image-rendering:pixelated;touch-action:none}
.message-overlay{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;font:700 clamp(26px,5vw,64px)/1 "Courier New",monospace;color:#fff;text-shadow:4px 4px #000;background:rgba(0,0,0,.14);text-align:center;padding:20px}.message-overlay.hidden{display:none}
.modern-controls{display:grid;grid-template-columns:1fr 1fr minmax(240px,.8fr) 150px;gap:10px;padding:10px 4px 6px;align-items:end}.control-stack{display:grid;gap:5px;font-size:18px}.control-stack label{display:flex;justify-content:space-between}.control-stack input[type=range]{width:100%;accent-color:#008080}.control-stack select{min-height:44px;background:#fff;border:3px solid;border-color:#444 #eee #eee #444;padding:4px}.fire-button{min-height:68px;font-size:30px;text-align:center;background:#d8d8d8}.utility-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.utility-row .retro-button{min-height:42px}.compact{min-width:105px}.round-readout{margin-left:auto;font-size:18px;padding:10px}.score-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(165px,1fr));gap:5px;margin-top:8px}.score-card{border:3px solid;border-color:#fff #444 #444 #fff;background:#aaa;padding:6px;font-size:14px;min-width:0}.score-card.active{outline:3px solid var(--cyan);background:#ccc}.score-card.dead{filter:grayscale(1);opacity:.65}.score-name{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.health-bar,.shield-bar{height:8px;background:#333;margin-top:4px;border:1px solid #111}.health-fill{height:100%;background:#31c65b}.shield-fill{height:100%;background:#4ee6ff}.score-meta{display:flex;justify-content:space-between;gap:6px;font-size:12px;margin-top:3px}.keyboard-hint{text-align:center;margin:8px 0 0;font-size:13px}
.classic-dialog{border:3px solid;border-color:#fff #222 #222 #fff;background:var(--face);padding:0;max-width:min(720px,96vw);max-height:92vh;box-shadow:10px 10px 0 rgba(0,0,0,.35)}.classic-dialog::backdrop{background:rgba(0,0,0,.55)}.wide-dialog{width:min(980px,96vw)}.shop-dialog{width:min(1060px,97vw)}.dialog-titlebar{display:flex;justify-content:space-between;align-items:center;background:var(--blue);color:#fff;padding:6px 8px;font-size:20px}.title-close{background:var(--face);border:2px solid;border-color:#fff #333 #333 #fff;width:30px;height:26px;line-height:18px;font-weight:700}.dialog-body{padding:16px;overflow:auto;max-height:70vh}.dialog-actions{display:flex;justify-content:flex-end;gap:8px;padding:10px;border-top:2px solid #777}.dialog-actions .retro-button{min-height:42px;min-width:100px;text-align:center}.option-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.option-grid label,.player-count-row label{display:grid;gap:5px}.option-grid input,.option-grid select,.player-count-row input,.player-config-list input,.player-config-list select{min-height:38px;border:3px solid;border-color:#444 #eee #eee #444;background:#fff;padding:4px}.option-note{grid-column:1/-1;background:#d2d2a8;border:2px solid #777;padding:10px}.player-count-row{display:flex;gap:20px;flex-wrap:wrap;margin-bottom:15px}.player-config-list{display:grid;gap:7px}.player-config-row{display:grid;grid-template-columns:50px 1fr 140px 180px;gap:8px;align-items:center}.color-chip{width:28px;height:20px;border:2px solid #222}.shop-summary{display:flex;justify-content:space-between;gap:10px;margin:10px;padding:9px;background:#ddd}.shop-tabs{display:flex;gap:5px;padding:0 10px}.shop-tabs .retro-button{min-height:42px}.shop-list{margin:8px 10px;height:min(45vh,420px);overflow:auto;background:#eee}.shop-row{display:grid;grid-template-columns:minmax(180px,1.4fr) 110px 90px 90px 70px;gap:8px;padding:7px 10px;border-bottom:1px dotted #777;cursor:pointer}.shop-row:hover,.shop-row.selected{background:#000080;color:#fff}.shop-row.unaffordable{color:#777}.shop-description{margin:8px 10px;padding:10px;min-height:70px;background:#eee}.inventory-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:8px}.inventory-item{border:2px solid #777;background:#ddd;padding:8px}.tank-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.tank-grid label{display:grid;gap:5px}.tank-grid select,.tank-grid input{min-height:40px;border:3px solid;border-color:#444 #eee #eee #444;background:#fff}.tank-status{grid-column:1/-1;padding:10px;background:#ddd;border:2px solid #777}.system-grid{display:grid;gap:10px}.system-grid .retro-button{text-align:center}.help-copy{line-height:1.45}.help-floating{position:fixed;right:12px;bottom:12px;z-index:10;min-height:38px;background:#c8c8c8}
@media(max-width:900px){.menu-columns{grid-template-columns:1fr}.main-menu-buttons{order:2;display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.title-display{min-height:420px}.menu-button{font-size:20px}.modern-controls{grid-template-columns:1fr 1fr}.fire-button{grid-column:1/-1}.game-status{grid-template-columns:repeat(3,1fr);font-size:15px}.status-player{order:-1;grid-column:1/-1}.player-config-row{grid-template-columns:40px 1fr 110px}.player-config-row .ai-field{grid-column:2/-1}.shop-row{grid-template-columns:1fr 90px 70px}.shop-row span:nth-child(4),.shop-row span:nth-child(5){display:none}}
@media(max-width:560px){.desktop-shell{padding:3px}.main-menu-buttons{grid-template-columns:1fr}.title-display{min-height:330px}.pixel-title{font-size:45px}.registered-line{margin-top:20px}.modern-controls{grid-template-columns:1fr}.select-stack{grid-column:auto}.utility-row .retro-button{flex:1 1 44%}.round-readout{margin-left:0}.option-grid,.tank-grid{grid-template-columns:1fr}.player-config-row{grid-template-columns:32px 1fr}.player-config-row select,.player-config-row .ai-field{grid-column:2}.game-status{grid-template-columns:1fr 1fr}.game-status>div{font-size:13px}.status-player{grid-column:1/-1}.help-floating{display:none}}

.scanlines-off .scanlines{display:none}

/* Mobile / installable app edition */
:root{
  --safe-top:env(safe-area-inset-top,0px);
  --safe-right:env(safe-area-inset-right,0px);
  --safe-bottom:env(safe-area-inset-bottom,0px);
  --safe-left:env(safe-area-inset-left,0px);
}
html{overscroll-behavior:none;-webkit-text-size-adjust:100%}
body{overscroll-behavior:none;-webkit-tap-highlight-color:transparent}
button,select,input{touch-action:manipulation}
.mobile-hud,.mobile-controls,.mobile-score-drawer,.orientation-overlay{display:none}
.precision-aim-badge{position:absolute;left:50%;top:12px;transform:translateX(-50%);z-index:9;background:#000080;color:#fff;border:2px solid #fff;padding:5px 10px;font-weight:700;letter-spacing:1px;pointer-events:none}
.install-app-button{margin-top:2px}
.install-copy{line-height:1.45}.install-copy ol{padding-left:25px}.install-platform-block h3{margin-top:0}.install-note{margin-top:18px;padding:9px;background:#d2d2a8;border:2px solid #777}
.mobile-weapon-list{display:grid;gap:7px}.mobile-weapon-choice{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px;align-items:center;min-height:54px;padding:8px 10px;text-align:left;background:#ddd;border:3px solid;border-color:#fff #333 #333 #fff}.mobile-weapon-choice.active{background:#000080;color:#fff}.mobile-weapon-choice small{grid-column:1/-1;opacity:.78}.mobile-weapon-count{font-weight:700}
.orientation-overlay{position:fixed;inset:0;z-index:1000;background:#4c6c6c;padding:calc(20px + var(--safe-top)) calc(20px + var(--safe-right)) calc(20px + var(--safe-bottom)) calc(20px + var(--safe-left));place-items:center}.orientation-card{max-width:380px;padding:22px;text-align:center}.orientation-card h2{margin:8px 0}.phone-rotate-icon{font-size:64px;line-height:1;color:#000080;text-shadow:2px 2px #fff}

html.standalone-mode .install-app-button{display:none}
html.precision-aim-active .precision-aim-badge{display:block!important}
html.precision-aim-active .battle-wrap{outline:3px solid #34e6e6;outline-offset:-3px}

@media (pointer:coarse){
  button,.retro-button,.title-close,select,input{min-height:44px}
  input[type=range]{min-height:34px}
  .shop-row{min-height:52px}
}

/* Phone/tablet menus work in either orientation. */
@media (max-width:900px), (pointer:coarse) and (max-width:1180px){
  .desktop-shell{display:block;min-height:100dvh;padding:max(4px,var(--safe-top)) max(4px,var(--safe-right)) max(4px,var(--safe-bottom)) max(4px,var(--safe-left))}
  .main-menu-window{width:100%;min-height:calc(100dvh - var(--safe-top) - var(--safe-bottom) - 8px);padding:6px}
  .menu-columns{gap:8px}
  .title-display{min-height:300px}
  .main-menu-buttons{gap:5px}
  .menu-button{min-height:48px;font-size:19px}
  .retro-counter{min-height:44px}
  .classic-dialog{width:calc(100vw - var(--safe-left) - var(--safe-right) - 8px);max-width:none;max-height:calc(100dvh - var(--safe-top) - var(--safe-bottom) - 8px);margin:auto}
  .classic-dialog[open]{display:flex;flex-direction:column}
  .classic-dialog form{display:flex;flex-direction:column;min-height:0;max-height:inherit}
  .dialog-titlebar{flex:none;padding-top:max(6px,var(--safe-top));font-size:17px}
  .dialog-body{flex:1;max-height:none;min-height:0;padding:10px;-webkit-overflow-scrolling:touch}
  .dialog-actions{flex:none;padding-bottom:max(8px,var(--safe-bottom));position:sticky;bottom:0;background:var(--face)}
  .dialog-actions .retro-button{min-height:48px}
  .option-grid{gap:9px}
  .option-grid label{font-size:14px}
  .shop-dialog{width:calc(100vw - 6px)}
  .shop-summary{margin:6px;display:grid;grid-template-columns:1fr 1fr;font-size:13px}.shop-summary span:last-child{grid-column:1/-1}
  .shop-tabs{padding:0 6px}.shop-tabs .retro-button{flex:1;text-align:center;padding:4px;font-size:13px}
  .shop-list{margin:6px;height:auto;flex:1;min-height:150px}
  .shop-row{grid-template-columns:minmax(0,1fr) auto auto;padding:8px}.shop-row span:nth-child(4),.shop-row span:nth-child(5){display:none}
  .shop-description{margin:6px;min-height:54px;font-size:13px}
  .inventory-grid{grid-template-columns:1fr 1fr}
  .player-config-row{gap:5px}
}

/* Dedicated landscape battlefield layout for phones and touch tablets. */
@media (orientation:landscape) and (max-height:650px) and (pointer:coarse),
       (orientation:landscape) and (max-width:1180px) and (pointer:coarse){
  html.game-active,html.game-active body{width:100%;height:100%;overflow:hidden;position:fixed;inset:0}
  html.game-active .desktop-shell{padding:0;width:100%;height:100dvh;min-height:0}
  html.game-active .game-window{width:100%;height:100dvh;min-height:0;padding:0;border-width:0;box-shadow:none;display:grid;grid-template-columns:minmax(0,1fr) clamp(250px,33vw,330px);grid-template-rows:calc(44px + var(--safe-top)) minmax(0,1fr);gap:0;background:#000;overflow:hidden}
  html.game-active .game-status,html.game-active .modern-controls,html.game-active .utility-row,html.game-active .score-strip,html.game-active .keyboard-hint,html.game-active .help-floating{display:none!important}
  html.game-active .mobile-hud{display:grid;grid-column:1/-1;grid-row:1;grid-template-columns:48px minmax(0,1fr) 70px 48px;align-items:center;gap:5px;padding:var(--safe-top) max(4px,var(--safe-right)) 0 max(4px,var(--safe-left));background:#111;color:#fff;border-bottom:2px solid #eee;z-index:30}
  .mobile-hud-button{height:38px;min-height:38px;background:#bbb;border:3px solid;border-color:#fff #333 #333 #fff;font-size:20px;font-weight:700;padding:0}
  .mobile-turn-block{min-width:0;text-align:center;line-height:1}.mobile-turn-block strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:14px}.mobile-turn-block small{font-size:10px;color:#ccc}.mobile-wind-block{text-align:center;line-height:1}.mobile-wind-block small{display:block;font-size:9px;color:#34e6e6}.mobile-wind-block strong{font-size:15px}
  html.game-active .battle-wrap{display:flex;grid-column:1;grid-row:2;min-width:0;min-height:0;border-width:0;align-items:center;justify-content:center;background:#000;overflow:hidden}
  html.game-active .battle-wrap canvas{display:block;width:100%;height:100%;max-width:100%;max-height:100%;aspect-ratio:auto;object-fit:contain;image-rendering:pixelated;touch-action:none}
  html.game-active .message-overlay{font-size:clamp(20px,5vw,45px)}
  html.game-active .mobile-controls{display:flex;grid-column:2;grid-row:2;min-width:0;min-height:0;flex-direction:column;gap:5px;padding:5px max(5px,var(--safe-right)) max(5px,var(--safe-bottom)) 5px;background:var(--face);border-left:3px solid;border-color:#fff;overflow:auto;-webkit-overflow-scrolling:touch}
  .mobile-weapon-row{display:grid;grid-template-columns:46px minmax(0,1fr) 46px;gap:4px;flex:none}.mobile-step-button,.mobile-weapon-button{min-height:50px;background:#d2d2d2;border:3px solid;border-color:#fff #333 #333 #fff}.mobile-step-button:active,.mobile-weapon-button:active{border-color:#333 #fff #fff #333}.mobile-weapon-button{display:grid;place-content:center;text-align:center;min-width:0;padding:2px}.mobile-weapon-button small{font-size:9px}.mobile-weapon-button strong{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .mobile-adjust-grid{display:grid;gap:4px;flex:1;min-height:0}.mobile-adjuster{display:grid;gap:2px;background:#aaa;border:2px solid;border-color:#444 #eee #eee #444;padding:3px;min-height:0}.mobile-adjust-heading{display:flex;justify-content:space-between;font-size:11px;font-weight:700}.mobile-adjust-heading output{color:#000080}.mobile-step-row{display:grid;grid-template-columns:38px 38px minmax(0,1fr) 38px 38px;gap:2px;align-items:center}.mobile-step-row button{min-width:0;min-height:38px;height:38px;padding:0;background:#d4d4d4;border:2px solid;border-color:#fff #333 #333 #fff;font-size:11px;font-weight:700}.mobile-step-row input{min-width:0;width:100%;height:32px;accent-color:#008080}
  .mobile-action-row{display:grid;grid-template-columns:repeat(5,1fr);gap:3px;flex:none}.mobile-action-button{min-width:0;min-height:38px;padding:2px;background:#ccc;border:3px solid;border-color:#fff #333 #333 #fff;font-size:10px;font-weight:700}.mobile-fire-button{grid-column:1/-1;min-height:52px;background:#ffdb45;border:4px solid;border-color:#fff #5c4300 #5c4300 #fff;font-size:25px;font-weight:900;letter-spacing:3px}.mobile-fire-button:active{border-color:#5c4300 #fff #fff #5c4300;transform:translate(1px,1px)}
  html.game-active .mobile-score-drawer{display:block;position:fixed;z-index:50;left:var(--safe-left);top:calc(44px + var(--safe-top));bottom:var(--safe-bottom);width:min(330px,78vw);background:var(--face);border:3px solid;border-color:#fff #333 #333 #fff;transform:translateX(calc(-100% - var(--safe-left) - 8px));transition:transform .16s ease;overflow:hidden}
  html.game-active .mobile-score-drawer.open{transform:translateX(0)}.mobile-drawer-title{height:42px;display:flex;align-items:center;justify-content:space-between;background:#000080;color:#fff;padding:5px 8px}.mobile-drawer-title button{width:36px;height:32px;min-height:32px;background:#bbb;border:2px solid;border-color:#fff #333 #333 #fff}.mobile-score-list{height:calc(100% - 42px);overflow:auto;padding:5px}.mobile-score-list .score-card{margin-bottom:4px;font-size:12px}
  .mobile-weapon-dialog{width:min(500px,96vw);height:min(92dvh,560px)}
}

/* In portrait, keep configuration usable but require rotation for live combat. */
@media (orientation:portrait) and (pointer:coarse){
  html.game-active .orientation-overlay{display:grid}
  html.game-active .game-window{visibility:hidden}
  .title-display{min-height:280px}.pixel-title{font-size:clamp(38px,12vw,60px);letter-spacing:-3px}.mother-line{font-size:clamp(14px,4vw,22px)}.registered-line{font-size:clamp(19px,6vw,30px);margin-top:25px}.demo-landscape{inset:150px 0 42px}.demo-sun{width:260px;height:260px}
}

@media (max-width:600px) and (orientation:portrait){
  .menu-columns{display:flex;flex-direction:column}.title-display{order:-1}.main-menu-buttons{display:grid;grid-template-columns:1fr 1fr}.menu-button{font-size:16px;padding:5px 8px}.retro-counter{font-size:16px}.copyright-line{font-size:11px}.inventory-grid{grid-template-columns:1fr}.player-config-row{grid-template-columns:32px minmax(0,1fr)}
}

@media (display-mode:standalone){
  body{background:#000}
}

html.game-active.dialog-open .orientation-overlay{display:none!important}