/* In-game desktop console. The engine minimap keeps its native coordinates. */
#tactical-console, #radar-frame { display: none; }
#unit-monitor, #hud-minimap { display: none; }
.sc-icon { display: block; width: 36px; height: 34px; flex: 0 0 auto; background-image: url('hud-cmdicons.png'); background-repeat: no-repeat; image-rendering: pixelated; }
.sel-wire { display: none; }
#hud-tooltip { position: fixed; z-index: 120; max-width: 300px; padding: 10px 14px; white-space: pre-line; pointer-events: none; color: #dedcc2; background: #070a08f5; border: 1px solid #9c9863; box-shadow: 0 3px 10px #000; font: 12px/1.6 'Segoe UI',sans-serif; }
@media (min-width: 760px) and (min-height: 480px) {
 body.in-game { --hud-height: 196px; --orders-width: clamp(230px, 23vw, 310px); --radar-width: 144px; --metal: #202729; --signal: #a8d793; }
 body.in-game #tactical-console {
  display: flex; position: fixed; z-index: 99; bottom: 0; left: var(--radar-width); right: 0; height: var(--hud-height);
  border: 2px solid #515b5a; border-bottom: 0; box-shadow: 0 -5px 18px #0009, inset 0 2px #87908a44;
  background: repeating-linear-gradient(0deg, #ffffff02 0 1px, transparent 1px 4px), linear-gradient(120deg,#343b3b,#161c1e 45%,#293031);
  padding: 13px 20px; pointer-events: auto;
 }
 #tactical-console::before { content: ''; position: absolute; top: -5px; left: 22px; width: 70px; height: 4px; background: #bc9b50; box-shadow: 0 0 12px #bc9b5033; }
 .console-heading { color: #a2aea2; font: 10px 'Segoe UI',sans-serif; letter-spacing: 2px; }
 .console-heading b { color: #d6ddcc; font-weight: 500; }
 #console-status { position: absolute; bottom: 13px; left: 20px; color: #82958b; font: 11px Consolas,monospace; }
 #console-status::before { content: '●'; color: #88c779; margin-right: 8px; }
 #console-empty { position: absolute; top: 62px; left: 22px; color: #819288; font-size: 13px; line-height: 1.9; }
 #console-empty strong { display: block; color: #c2d2bf; font-size: 18px; font-weight: 400; }
 body.in-game #radar-frame { display: block; position: fixed; bottom: 0; left: 0; width: var(--radar-width); height: var(--hud-height); z-index: 99; pointer-events: none; border-top: 2px solid #515b5a; box-shadow: inset -3px 0 #151b1a; background: linear-gradient(#2d3535,#161c1e) top / 100% calc(100% - 136px) no-repeat; }
 #radar-frame span { display: block; margin: 14px 12px; color: #a2aea2; font-size: 10px; letter-spacing: 2px; }
 #radar-frame small { position: absolute; bottom: 140px; left: 12px; font: 9px Consolas,monospace; color: #759786; }
 body.in-game #selection-panel { position: fixed; left: calc(var(--radar-width) + 22px) !important; right: calc(var(--orders-width) + 28px) !important; bottom: 39px; top: auto; height: calc(var(--hud-height) - 76px); max-width: none; transform: none; overflow: auto; flex-wrap: wrap; align-content: flex-start; gap: 5px 22px; font-size: 16px; text-shadow: none; pointer-events: auto; }
 body.in-game #selection-panel .sel-name { font-size: 20px; color: #d5e4c9; letter-spacing: .5px; }
 body.in-game #selection-panel .sel-hp-bar { width: 170px; height: 7px; border: 1px solid #4c6850; border-radius: 0; background: #070e0b; }
 body.in-game #selection-panel .sel-hp-fill { border-radius: 0; background-image: repeating-linear-gradient(90deg,transparent 0 7px,#0005 7px 9px) !important; }
 body.in-game #selection-panel .sel-multi { display: grid; grid-template-columns: repeat(4,minmax(65px,1fr)); gap: 5px; }
 body.in-game #selection-panel .sel-mini { border: 1px solid #405b48; color: #9fd58e; background: #0c1712; border-radius: 1px; padding: 7px; font: 11px Consolas,monospace; }
 body.in-game #bottom-panel { left: auto !important; right: 12px !important; bottom: 12px; width: var(--orders-width); height: calc(var(--hud-height) - 39px); pointer-events: auto; }
 body.in-game #bottom-panel::before { content: 'COMMAND / 指令'; position: absolute; top: -20px; color: #a2aea2; font-size: 10px; letter-spacing: 2px; }
 body.in-game #command-panel { max-width: none; padding: 0; gap: 5px; background: repeating-linear-gradient(90deg,#0a111477 0 calc(33.33% - 3px),transparent calc(33.33% - 3px) 33.33%); }
 body.in-game #command-panel .cmd-btn { position: relative; border: 1px solid #647162; border-radius: 2px; box-shadow: inset 0 0 0 2px #141d19, inset 0 3px 5px #ffffff0b, 0 2px 2px #0008; background: linear-gradient(145deg,#36433c,#16261d); color: #b8e49c; font-size: 12px; text-shadow: 0 0 9px #8fbd7744; }
 body.in-game #command-panel .cmd-btn:hover { border-color: #d5c183; background: linear-gradient(145deg,#596047,#283524); color: #fff0b5; }
 body.in-game #command-panel .cmd-btn.disabled { opacity: .34; filter: saturate(.3); }
 body.in-game #command-panel .cmd-key { position: absolute; top: 3px; right: 5px; margin: 0; font: 10px Consolas,monospace; color: #d0ba79; }
 body.in-game #command-panel .cmd-cost { font: 10px Consolas,monospace; color: #91b8aa; }
 body.in-game #resource-bar { justify-content: flex-end; left: auto; right: 16px; top: 9px; gap: 22px; padding: 10px 17px; border: 1px solid #53615a; background: linear-gradient(110deg,#141d1deb,#29342eeb); box-shadow: 0 3px 15px #0008,inset 0 1px #acb8a522; font: 15px Consolas,monospace; }
 body.in-game #resource-bar .res-val { color: #d1e5c1; }
 body.in-game #resource-bar .res-icon { font-size: 0; }
 body.in-game #resource-bar .res-icon::after { font-size: 11px; color: #7fc8e1; content: '◆ MIN'; }
 body.in-game #resource-bar .res-item:nth-child(2) .res-icon::after { content: '◈ GAS'; color: #94cf83; }
 body.in-game #resource-bar .res-item:nth-child(3) .res-icon::after { content: '▣ SUP'; color: #ddc381; }
 body.in-game #resource-bar .res-item:nth-child(4) .res-icon::after { content: '◷'; color: #a0b4a9; }
 body.in-game #back-link { top: 10px; left: 12px; border: 1px solid #657065; border-radius: 1px; padding: 10px 16px; background: #202b26ed; color: #c0cbae; font-size: 12px; }
 body.in-game #game-controls { top: 58px; right: 16px; }
 body.in-game #game-controls button { border-radius: 1px; background: #17231fe6; border-color: #485b4c; color: #b6c6ad; min-width: 40px; height: 28px; }
 body.in-game #btn-deselect { left: auto !important; right: calc(var(--orders-width) + 30px) !important; bottom: 12px; border-radius: 1px; border-color: #5b6c5c; background: #18221c; color: #a4b69c; font-size: 10px; }
 body.in-game #btn-toggle-side { display: none !important; }
 body.in-game #toast-container { bottom: calc(var(--hud-height) + 18px); }
}
@media (min-width: 1100px) and (min-height: 480px) {
 body.in-game #unit-monitor { display: block; position: absolute; right: calc(var(--orders-width) + 28px); top: 13px; width: 144px; text-align: center; color: #8caa94; font: 9px Consolas,monospace; letter-spacing: 2px; }
 #unit-feed { width: 128px; height: 112px; margin: 7px auto; border: 1px solid #506551; background: #0c1511; box-shadow: 0 0 0 4px #111a17,0 0 0 5px #3f4942; image-rendering: pixelated; }
 #unit-feed-label { letter-spacing: 1px; font-size: 9px; }
 body.in-game #selection-panel { right: calc(var(--orders-width) + 205px) !important; }
}
@media (min-width: 1100px) and (min-height: 780px) {
 body.in-game { --hud-height: 218px; --orders-width: 310px; }
 body.in-game #command-panel .cmd-btn { font-size: 14px; }
}

/* Original MPQ console edge art, with an expandable center for browser widths. */
@media (min-width: 760px) and (min-height: 480px) {
 body.in-game { --hud-scale: 1; --hud-height: 180px; --radar-width: 166px; --orders-width: 144px; --console-left: url('hud-t-left.png'); --console-middle: url('hud-t-middle.png'); --console-right: url('hud-t-right.png'); }
 body.in-game[data-race="0"] { --console-left: url('hud-z-left.png'); --console-middle: url('hud-z-middle.png'); --console-right: url('hud-z-right.png'); }
 body.in-game[data-race="2"] { --console-left: url('hud-p-left.png'); --console-middle: url('hud-p-middle.png'); --console-right: url('hud-p-right.png'); }
 body.in-game #tactical-console { height: var(--hud-height); left: var(--radar-width); border: 0; padding: 0; box-shadow: none; background: var(--console-right) right bottom / calc(234px * var(--hud-scale)) 100% no-repeat; image-rendering: pixelated; pointer-events: none; }
 #tactical-console::before { left: 0; right: calc(234px * var(--hud-scale)); bottom: 0; top: auto; width: auto; height: calc(105px * var(--hud-scale)); background: url('hud-metal-generated.png') center / 100% 100%; box-shadow: none; }
 #tactical-console::after { content: ''; position: absolute; left: 0; right: calc(234px * var(--hud-scale)); bottom: 0; height: calc(100px * var(--hud-scale)); border: calc(8px * var(--hud-scale)) solid transparent; border-image: var(--console-middle) 82 8 8 8 / calc(13px * var(--hud-scale)) calc(8px * var(--hud-scale)) calc(8px * var(--hud-scale)) / 0 stretch; background: linear-gradient(#000b,#000d),url('hud-metal-generated.png') center/cover; z-index: 0; }
 .console-heading { display: none; }
 #console-empty { z-index: 1; top: auto; bottom: 22px; left: 25px; font: 12px/1.8 'Segoe UI',sans-serif; color: #868c7c; }
 #console-empty strong { color: #c4c9ac; font-size: 16px; }
 #console-status { z-index: 1; bottom: calc(112px * var(--hud-scale)); left: 16px; font: 10px Consolas,monospace; color: #a6afa0; text-shadow: 1px 2px #000; }
 body.in-game #radar-frame { width: var(--radar-width); height: var(--hud-height); background: var(--console-left) left bottom / 100% 100% no-repeat; border: 0; box-shadow: none; image-rendering: pixelated; }
 body.in-game #hud-minimap { display: block; position: absolute; left: calc(6px * var(--hud-scale)); bottom: calc(5px * var(--hud-scale)); width: calc(128px * var(--hud-scale)); height: calc(128px * var(--hud-scale)); pointer-events: auto; cursor: crosshair; }
 body.in-game #selection-panel { left: calc(var(--radar-width) + 20px) !important; right: calc(244px * var(--hud-scale)) !important; bottom: calc(12px * var(--hud-scale)); height: calc(77px * var(--hud-scale)); font: 14px/1.15 'Segoe UI',sans-serif; gap: 3px 20px; z-index: 100; }
 body.in-game #selection-panel .sel-name { font-size: 16px; color: #d7d6bb; }
 body.in-game #selection-panel .sel-wire { display: block; width: 64px; height: 64px; flex: 0 0 64px; background-image: url('hud-wireframes.png'); background-repeat: no-repeat; image-rendering: pixelated; transform: scale(var(--hud-scale)); transform-origin: left top; margin-right: calc(64px * (var(--hud-scale) - 1) + 15px); }
 body.in-game #selection-panel { flex-direction: row; flex-wrap: nowrap; align-items: flex-start; }
 .sel-data { display: flex; flex-direction: column; gap: 4px; flex-wrap: wrap; height: 100%; min-width: 0; }
 body.in-game #selection-panel .sel-hp-bar { width: 100px; height: 5px; }
 body.in-game #selection-panel .sel-multi { grid-template-columns: repeat(6,minmax(45px,1fr)); }
 body.in-game #bottom-panel { right: calc(8px * var(--hud-scale)) !important; bottom: calc(5px * var(--hud-scale)); width: calc(136px * var(--hud-scale)); height: calc(120px * var(--hud-scale)); }
 body.in-game #bottom-panel::before { display: none; }
 body.in-game #command-panel { gap: calc(4px * var(--hud-scale)); background: none; }
 body.in-game #command-panel .cmd-btn { padding: 0; border: 1px solid #525a65; border-radius: 0; background: #070907; box-shadow: inset 1px 1px #70736a66,inset -2px -2px #000; text-shadow: none; }
 body.in-game #command-panel .cmd-btn:hover { border-color: #c6ac57; background: #182113; box-shadow: inset 0 0 8px #799b2b44; }
 body.in-game #command-panel .sc-icon { transform: scale(var(--hud-scale)); }
 body.in-game #command-panel .cmd-label, body.in-game #command-panel .cmd-cost { display: none; }
 body.in-game #command-panel .cmd-key { z-index: 1; top: auto; bottom: 0; right: 2px; color: #e3c967; font-size: 9px; text-shadow: 1px 1px #000; }
 body.in-game #command-panel .cmd-btn.disabled { opacity: .42; pointer-events: auto; cursor: not-allowed; }
 body.in-game #unit-monitor { display: block; right: calc(164px * var(--hud-scale)); top: auto; bottom: calc(15px * var(--hud-scale)); width: calc(60px * var(--hud-scale)); z-index: 1; }
 #unit-monitor > div, #unit-feed-label { display: none; }
 body.in-game #unit-feed { width: calc(60px * var(--hud-scale)); height: calc(43px * var(--hud-scale)); margin: 0; border: 0; box-shadow: none; }
 body.in-game #btn-deselect { right: calc(244px * var(--hud-scale)) !important; bottom: calc(112px * var(--hud-scale)); background: #101313; border-color: #4d5156; color: #b5b49d; }
 body.in-game #resource-bar { top: 3px; right: 8px; padding: 3px 8px; background: #0009; border: 0; box-shadow: none; font: bold 14px Consolas,monospace; }
 body.in-game #resource-bar .res-val { color: #d3d6a1; }
 body.in-game #back-link, body.in-game #game-controls button { background: #161b20; border: 2px ridge #515660; color: #c6c4a0; }
 body.in-game #game-controls { top: 34px; }
}
@media (min-width: 1100px) and (min-height: 700px) {
 body.in-game { --hud-scale: 1.5; --hud-height: 270px; --radar-width: 249px; --orders-width: 204px; }
 body.in-game #selection-panel { font-size: 17px; }
 body.in-game #selection-panel .sel-name { font-size: 21px; }
 body.in-game #selection-panel .sel-hp-bar { width: 150px; height: 7px; }
}
@media (max-width: 759px), (max-height: 479px) {
 #command-panel .sc-icon { position: absolute; left: 3px; transform: scale(.7); transform-origin: left center; }
 #command-panel .cmd-btn { position: relative; padding-left: 23px; }
}
/* Mouse-only original game pointer; touch keeps its existing feedback. */
body.in-game.sc-mouse, body.in-game.sc-mouse * { cursor: none !important; }
#sc-pointer, .sc-order-marker { position: fixed; pointer-events: none; background-image: url('hud-pointer.png?v=2'); background-repeat: no-repeat; image-rendering: pixelated; }
#sc-pointer { z-index: 10000; }
#sc-pointer[hidden] { display: none; }