/* TOUCH-COMMAND-1 — iPad landscape first. Finger targets ≥44px, safe areas,
   no browser gestures over the game, windows sized for 1024–1366 × 768–1024. */
:root{--tc-bg:#2a2b29;--tc-bg2:#393a38;--tc-line:#a0987f;--tc-ink:#d6d0c1;--tc-dim:#bcb39a;--tc-gold:#e0c879;--tc-ok:#b2b0a8;--tc-warn:#d2c49a;--tc-bad:#e58b78;
 --tc-safe-l:env(safe-area-inset-left,0px);--tc-safe-r:env(safe-area-inset-right,0px);--tc-safe-b:env(safe-area-inset-bottom,0px);--tc-safe-t:env(safe-area-inset-top,0px);--tc-hit:48px}
html.touch-shell,html.touch-shell body{overscroll-behavior:none;-webkit-text-size-adjust:100%;height:100%;overflow:hidden}
html.touch-shell body{position:fixed;inset:0}
html.touch-shell .hoi-ui,html.touch-shell .touch-hud,html.touch-shell #map-wrap{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}
html.touch-shell #map-wrap{touch-action:none}
html.touch-shell .hoi-ui button,html.touch-shell .touch-hud button{touch-action:manipulation}
/* long lists and research trees scroll natively, one axis at a time, without chaining into the page */
html.touch-shell .ui-content,html.touch-shell .tc-scroll,html.touch-shell .rw-window [class*="scroll"],html.touch-shell .nf-canvas,html.touch-shell .tc-chips{-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
html.touch-shell .hoi-ui input,html.touch-shell .hoi-ui textarea,html.touch-shell .hoi-ui select{-webkit-user-select:text;user-select:text;font-size:16px}
/* Top bar respects the notch/status bar side insets in standalone mode */
html.touch-shell .hoi-ui .hoi-top{padding-left:var(--tc-safe-l);padding-right:var(--tc-safe-r)}
html.touch-first .hoi-ui .hoi-top button{min-height:44px;min-width:44px}

/* ---------- HUD shell ---------- */
html.touch-shell body .hoi-ui .touch-hud{position:fixed;inset:0;pointer-events:none;z-index:40;font:14px/1.3 system-ui,-apple-system,"PingFang SC","Noto Sans CJK SC",sans-serif;color:var(--tc-ink)}
html.touch-shell body .hoi-ui .touch-hud>*{pointer-events:auto}
html.touch-shell body .hoi-ui .touch-hud button{font:inherit;color:inherit;cursor:pointer}
html.touch-shell body .hoi-ui .touch-hud svg.hoi-icon,html.touch-shell body .hoi-ui .touch-hud .tc-opt svg,html.touch-shell body .hoi-ui .touch-hud nav svg{width:22px;height:22px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
html.touch-shell body .hoi-ui .tc-x{min-width:var(--tc-hit);min-height:var(--tc-hit);border:0;background:transparent;font-size:24px!important;line-height:1;color:var(--tc-dim)!important}
html.touch-shell body .hoi-ui .tc-x:active{color:var(--tc-ink)!important}
html.touch-shell body .hoi-ui .touch-hud :is(button):active{filter:brightness(1.25)}
html.touch-shell body .hoi-ui .touch-hud button:disabled{opacity:.42;filter:none}
html.touch-shell body .hoi-ui .tc-panel,html.touch-shell body .hoi-ui .tc-tray,html.touch-shell body .hoi-ui .tc-commands,html.touch-shell body .hoi-ui .tc-pop,html.touch-shell body .hoi-ui .tc-sheet,html.touch-shell body .hoi-ui .tc-inspect,html.touch-shell body .hoi-ui .tc-banner,html.touch-shell body .hoi-ui .tc-toast{background:var(--tc-bg) url('/assets/playable/art-reset/metal.svg');border:1px solid var(--tc-line);box-shadow:0 6px 18px #0d0d0b88;border-radius:10px}

/* ---------- selection tray (bottom-left) ---------- */
html.touch-shell body .hoi-ui .tc-tray{position:absolute;left:calc(12px + var(--tc-safe-l));bottom:calc(12px + var(--tc-safe-b));width:min(560px,calc(100vw - 420px));min-width:360px;padding:6px 8px;display:flex;flex-direction:column;gap:6px}
html.touch-shell body .hoi-ui .tc-tray.tc-empty{flex-direction:row;align-items:center;width:auto;min-width:0}
html.touch-shell body .hoi-ui .tc-tray.tc-empty p{margin:0 6px;color:var(--tc-dim);font-size:13px;max-width:220px}
html.touch-shell body .hoi-ui .tc-tray header{display:flex;align-items:center;gap:6px}
html.touch-shell body .hoi-ui .tc-tray header b{font-size:15px;white-space:nowrap}
html.touch-shell body .hoi-ui .tc-tray header small{color:var(--tc-dim);flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html.touch-shell body .hoi-ui .tc-tray header b+small{margin-right:auto}
html.touch-shell body .hoi-ui .tc-tray header b:only-of-type{margin-right:auto}
html.touch-shell body .hoi-ui .tc-tool{min-height:var(--tc-hit);min-width:var(--tc-hit);padding:0 10px;display:inline-flex;align-items:center;gap:6px;background:var(--tc-bg2);border:1px solid var(--tc-line);border-radius:8px}
html.touch-shell body .hoi-ui .tc-tool[aria-pressed="true"]{background:#5a5851;border-color:var(--tc-gold);color:#e5dfd0;box-shadow:inset 0 0 0 1px var(--tc-gold)}
html.touch-shell body .hoi-ui .tc-chips{display:flex;gap:6px;overflow-x:auto;overflow-y:hidden;touch-action:pan-x;scrollbar-width:none;padding-bottom:2px}
html.touch-shell body .hoi-ui .tc-chips::-webkit-scrollbar{display:none}
html.touch-shell body .hoi-ui .tc-chip{flex:none;display:flex;align-items:stretch;background:#232321;border:1px solid #6f6850;border-radius:8px}
html.touch-shell body .hoi-ui .tc-chip>button:first-child{display:grid;grid-template-columns:30px auto 12px;grid-template-rows:auto auto;column-gap:6px;align-items:center;min-height:56px;padding:4px 8px;border:0;background:transparent;text-align:left;max-width:200px}
html.touch-shell body .hoi-ui .tc-chip .tc-sym{grid-row:1/3;width:30px;height:30px;background:#c4bfb0;border-radius:4px;color:#272825}
html.touch-shell body .hoi-ui .tc-chip b{font-size:14px}
html.touch-shell body .hoi-ui .tc-chip small{grid-column:2/4;color:var(--tc-dim);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:150px}
html.touch-shell body .hoi-ui .tc-chip .tc-x{min-width:40px;border-left:1px solid #414140}
html.touch-shell body .hoi-ui .tc-more{align-self:center;color:var(--tc-dim);padding:0 8px;white-space:nowrap}
html.touch-shell body .hoi-ui .tc-bars{display:inline-flex;gap:2px;height:22px;align-items:flex-end}
html.touch-shell body .hoi-ui .tc-bars i{width:5px;height:100%;background:#191a18;position:relative;border-radius:1px;overflow:hidden}
html.touch-shell body .hoi-ui .tc-bars i::after{content:"";position:absolute;left:0;right:0;bottom:0;height:calc(var(--v)*100%);background:#7fbf7a}
html.touch-shell body .hoi-ui .tc-bars i.men::after{background:#c6b88f}

/* ---------- command bar (right edge, thumb reach) ---------- */
html.touch-shell body .hoi-ui .tc-commands{position:absolute;right:calc(10px + var(--tc-safe-r));top:calc(186px + var(--tc-safe-t));display:flex;flex-direction:column;gap:5px;padding:6px}
html.touch-shell body .hoi-ui .tc-commands button{width:76px;min-height:56px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;background:var(--tc-bg2);border:1px solid #7d755e;border-radius:8px;font-size:13px!important}
html.touch-shell body .hoi-ui .tc-commands button[aria-pressed="true"]{background:#746948;border-color:var(--tc-gold);color:#e6e1d1;box-shadow:0 0 0 2px #e0c87955}
html.touch-shell body .hoi-ui .tc-commands button[data-kind="ATTACK"] svg{color:#f1a08d}
html.touch-shell .hoi-ui:has(.ui-sidebar) .tc-commands{display:none}

/* ---------- order banner ---------- */
html.touch-shell body .hoi-ui .tc-banner{position:absolute;top:calc(88px + var(--tc-safe-t));left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:10px;padding:4px 4px 4px 14px;border-color:var(--tc-gold);background-color:#3b3c39;max-width:calc(100vw - 220px)}
html.touch-shell body .hoi-ui .tc-banner b{white-space:nowrap;color:#e2dccd}
html.touch-shell body .hoi-ui .tc-banner span{color:var(--tc-dim);font-size:13px}
html.touch-shell body .hoi-ui .tc-banner button{min-height:var(--tc-hit);padding:0 18px;border-radius:8px;border:1px solid var(--tc-line);background:#272826;font-weight:600}

/* ---------- popovers: spot card, stack picker ---------- */
html.touch-shell body .hoi-ui .tc-pop{position:absolute;width:300px;max-height:calc(100vh - 110px);display:flex;flex-direction:column;padding:4px 6px 6px;animation:tc-in .12s ease-out}
html.touch-shell body .hoi-ui .tc-stack{width:320px}
@keyframes tc-in{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.tc-pop{animation:none}}
html.touch-shell body .hoi-ui .tc-pop header,html.touch-shell body .hoi-ui .tc-sheet header,html.touch-shell body .hoi-ui .tc-inspect header{display:flex;align-items:center;gap:8px;min-height:var(--tc-hit)}
html.touch-shell body .hoi-ui .tc-pop header b{font-size:16px}
html.touch-shell body .hoi-ui .tc-pop header small{flex:1;color:var(--tc-dim);font-size:12px}
html.touch-shell body .hoi-ui .tc-who{margin:0 4px 4px;color:var(--tc-dim);font-size:12px}
html.touch-shell body .hoi-ui .tc-opt{display:flex;align-items:center;gap:10px;min-height:56px;margin-top:4px;padding:6px 12px;text-align:left;background:var(--tc-bg2);border:1px solid #7d755e;border-radius:8px}
html.touch-shell body .hoi-ui .tc-opt span{display:flex;flex-direction:column}
html.touch-shell body .hoi-ui .tc-opt b{font-size:15px}
html.touch-shell body .hoi-ui .tc-opt small{color:var(--tc-warn);font-size:12px}
html.touch-shell body .hoi-ui .tc-opt[data-kind="ATTACK"]:not(:disabled){border-color:#c4796a}
html.touch-shell body .hoi-ui .tc-opt.tc-quiet{background:transparent;min-height:48px}
html.touch-shell body .hoi-ui .tc-scroll{overflow-y:auto;touch-action:pan-y;flex:1;min-height:0}
html.touch-shell body .hoi-ui .tc-row{display:flex;align-items:center;gap:10px;width:100%;min-height:58px;margin-top:4px;padding:4px 10px;text-align:left;background:#232321;border:1px solid #4e4f4d;border-radius:8px}
html.touch-shell body .hoi-ui .tc-row span{flex:1;display:flex;flex-direction:column}
html.touch-shell body .hoi-ui .tc-row small{color:var(--tc-dim);font-size:12px}
html.touch-shell body .hoi-ui .tc-row[aria-pressed="true"]{border-color:var(--tc-gold);background:#3d3d3b}
html.touch-shell body .hoi-ui .tc-row .tc-sym{width:32px;height:32px;background:#c4bfb0;border-radius:4px;color:#272825;flex:none}
html.touch-shell body .hoi-ui .tc-pop footer,html.touch-shell body .hoi-ui .tc-sheet footer{display:flex;gap:6px;margin-top:6px}
html.touch-shell body .hoi-ui .tc-pop footer button,html.touch-shell body .hoi-ui .tc-sheet footer button{flex:1;min-height:var(--tc-hit);border-radius:8px;border:1px solid var(--tc-line);background:var(--tc-bg2)}
html.touch-shell body .hoi-ui .tc-primary{background:#626059!important;border-color:#c4c2ba!important;font-weight:600}

/* ---------- inspector (top-left, under the bar) ---------- */
html.touch-shell body .hoi-ui .tc-inspect{position:absolute;left:calc(12px + var(--tc-safe-l));top:calc(88px + var(--tc-safe-t));width:280px;padding:2px 8px 8px}
html.touch-shell body .hoi-ui .tc-inspect header b{flex:1;font-size:15px}
html.touch-shell body .hoi-ui .tc-inspect header svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2}
html.touch-shell body .hoi-ui .tc-inspect p{margin:2px 4px 6px;color:var(--tc-dim)}
html.touch-shell body .hoi-ui .tc-inspect .tc-enemy{color:var(--tc-bad);display:flex;gap:6px;align-items:center}
html.touch-shell body .hoi-ui .tc-inspect button{display:flex;align-items:center;gap:8px;width:100%;min-height:var(--tc-hit);margin-top:4px;padding:0 10px;background:var(--tc-bg2);border:1px solid #7d755e;border-radius:8px}
html.touch-shell body .hoi-ui .tc-inspect button svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2}

/* ---------- sheets (assign, help) ---------- */
html.touch-shell body .hoi-ui .tc-sheet{position:absolute;right:calc(12px + var(--tc-safe-r));top:calc(84px + var(--tc-safe-t));bottom:calc(12px + var(--tc-safe-b));width:min(460px,46vw);display:flex;flex-direction:column;padding:4px 10px 10px}
html.touch-shell body .hoi-ui .tc-sheet header b{flex:1;text-align:center;font-size:16px}
html.touch-shell body .hoi-ui .tc-sheet>p{color:var(--tc-dim);margin:4px 2px 8px;font-size:13px}
html.touch-shell body .hoi-ui .tc-back{min-height:var(--tc-hit);padding:0 12px;border-radius:8px;border:1px solid var(--tc-line);background:var(--tc-bg2)}
html.touch-shell body .hoi-ui .tc-grid{display:grid;grid-template-columns:1fr;gap:6px;align-content:start}
html.touch-shell body .hoi-ui .tc-card{display:flex;align-items:center;gap:10px;min-height:68px;padding:6px 10px;text-align:left;background:#232321;border:1px solid #6f6850;border-left:5px solid var(--corps,#8fb9c9);border-radius:8px}
html.touch-shell body .hoi-ui .tc-card span{display:flex;flex-direction:column}
html.touch-shell body .hoi-ui .tc-card small{color:var(--tc-dim)}
html.touch-shell body .hoi-ui .tc-help-sheet h3{margin:12px 2px 4px;font-size:14px;color:var(--tc-gold)}
html.touch-shell body .hoi-ui .tc-help-sheet p{margin:2px;color:var(--tc-dim);font-size:13px}
html.touch-shell body .hoi-ui .tc-help-row{display:flex;gap:12px;align-items:center;padding:6px 2px;border-bottom:1px solid #ede8d912}
html.touch-shell body .hoi-ui .tc-help-row>svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:2;flex:none}
html.touch-shell body .hoi-ui .tc-help-row span{display:flex;flex-direction:column}
html.touch-shell body .hoi-ui .tc-help-row small{color:var(--tc-dim)}
html.touch-shell body .hoi-ui .tc-gesture{min-width:52px;text-align:center;padding:3px 6px;border-radius:6px;background:#474845;font-size:12px;white-space:nowrap}

/* ---------- toasts + camera return ---------- */
html.touch-shell body .hoi-ui .tc-toasts{position:absolute;top:calc(140px + var(--tc-safe-t));left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:6px;width:min(520px,60vw);pointer-events:none}
html.touch-shell body .hoi-ui .tc-toasts>*{pointer-events:auto}
html.touch-shell body .hoi-ui .tc-toast{display:flex;align-items:center;gap:6px;width:100%;padding:2px 2px 2px 12px;border-left:5px solid var(--tc-dim);animation:tc-in .15s ease-out}
html.touch-shell body .hoi-ui .tc-toast span{flex:1;font-size:13px}
html.touch-shell body .hoi-ui .tc-toast[data-tone="ok"]{border-left-color:var(--tc-ok)}
html.touch-shell body .hoi-ui .tc-toast[data-tone="warn"]{border-left-color:var(--tc-warn)}
html.touch-shell body .hoi-ui .tc-toast[data-tone="error"]{border-left-color:var(--tc-bad);background-color:#3d2a26}
html.touch-shell body .hoi-ui .tc-toast [data-tc="toast-locate"]{min-height:40px;padding:0 12px;border-radius:6px;border:1px solid var(--tc-line);background:var(--tc-bg2)}
html.touch-shell body .hoi-ui .tc-toast:nth-child(n+5){display:none}
html.touch-shell body .hoi-ui .tc-camera{min-height:var(--tc-hit);padding:0 18px;border-radius:24px;border:1px solid var(--tc-gold);background:#3b3c39;color:#e2dccd!important;font-weight:600;box-shadow:0 4px 12px #00000088}

/* ---------- plan drawing: big finger controls, no HUD clutter ---------- */
html.touch-shell .hoi-ui .map-plan-strip{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(12px + var(--tc-safe-b));top:auto;display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:6px 8px;max-width:calc(100vw - 24px);border-radius:10px;z-index:41}
html.touch-shell .hoi-ui .map-plan-strip b{font-size:15px;margin:0 6px}
html.touch-shell .hoi-ui .map-plan-strip button{min-height:52px;min-width:88px;padding:0 14px;border-radius:8px;font-size:15px}
html.touch-shell .hoi-ui .map-plan-strip #plan-finish-draw{background:#626059;border-color:#c4c2ba;font-weight:600}
html.touch-shell .hoi-ui .map-plan-strip #plan-abort-draw{background:#4a2f2a;border-color:#c4796a}
html.touch-shell .hoi-ui .map-plan-strip small{flex-basis:100%;text-align:center;color:var(--tc-dim)}
html.touch-shell .hoi-ui .map-plan-strip #plan-draw-status{color:var(--tc-gold);min-width:150px}

/* ---------- windows: right-docked, iPad-sized, always ‹ back + × ---------- */
html.touch-shell body .hoi-ui .ui-sidebar{position:fixed;left:auto;right:calc(10px + var(--tc-safe-r));top:calc(84px + var(--tc-safe-t));bottom:calc(10px + var(--tc-safe-b));width:min(540px,48vw);max-height:none;display:flex;flex-direction:column;border-radius:10px;border-right-width:1px;z-index:42}
html.touch-shell body .hoi-ui .ui-sidebar[data-mode="economy"],html.touch-shell body .hoi-ui .ui-sidebar[data-mode="recruitment"],html.touch-shell body .hoi-ui .ui-sidebar[data-mode="division"],html.touch-shell body .hoi-ui .ui-sidebar[data-mode="events"],html.touch-shell body .hoi-ui .ui-sidebar[data-mode="war"],html.touch-shell body .hoi-ui .ui-sidebar[data-mode="commanders"]{width:min(520px,46vw)}
html.touch-shell body .hoi-ui .ui-sidebar>header{display:flex;align-items:center;gap:8px;min-height:56px;padding:0 4px 0 6px}
html.touch-shell body .hoi-ui .ui-sidebar>header .atlas-panel-title,html.touch-shell body .hoi-ui .ui-sidebar>header h2{order:2;flex:1;min-width:0}
html.touch-shell body .hoi-ui .ui-sidebar>header h2{font-size:18px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html.touch-shell body .hoi-ui .ui-sidebar>header .ui-back{order:1;min-height:var(--tc-hit);padding:0 12px;border-radius:8px;border:1px solid var(--tc-line);background:var(--tc-bg2);color:var(--tc-ink);white-space:nowrap;font-size:15px}
html.touch-shell body .hoi-ui .ui-sidebar>header #ui-close{order:3;min-width:var(--tc-hit);min-height:var(--tc-hit);font-size:24px}
html.touch-shell body .hoi-ui .ui-sidebar .ui-content{flex:1;min-height:0;overflow-y:auto;touch-action:pan-y;padding-bottom:calc(16px + var(--tc-safe-b))}
html.touch-first body .hoi-ui .ui-sidebar .ui-content button{min-height:44px}
/* map modes move to the top-right, under the zoom control; army bar stays bottom-centre */
html.touch-shell body .hoi-ui .hoi-map-modes{position:fixed;right:calc(10px + var(--tc-safe-r));left:auto;bottom:auto;top:calc(130px + var(--tc-safe-t));flex-direction:row;flex-wrap:nowrap;display:flex;gap:4px;width:auto;height:auto;padding:4px}
html.touch-shell body .hoi-ui .hoi-map-modes button{min-height:44px;padding:0 10px}
html.touch-shell body .hoi-ui:has(.ui-sidebar) .hoi-map-modes{display:none}
html.touch-shell body .hoi-ui .hoi-commanders{left:auto;right:calc(100px + var(--tc-safe-r));bottom:calc(10px + var(--tc-safe-b));transform:none;max-width:calc(100vw - 720px);overflow-x:auto;touch-action:pan-x}
html.touch-shell body .hoi-ui .hoi-commanders button{min-height:52px}
html.touch-shell body .hoi-ui .ui-corps-card [data-ui-locate]{min-width:44px}
html.touch-shell body .hoi-ui:has(.ui-sidebar) .hoi-commanders{right:auto;left:calc(10px + var(--tc-safe-l));max-width:calc(100vw - min(540px,48vw) - 40px)}
html.touch-shell body .hoi-ui:has(.ui-sidebar:is([data-mode="economy"],[data-mode="recruitment"],[data-mode="division"],[data-mode="events"],[data-mode="war"],[data-mode="commanders"])) .hoi-commanders{max-width:calc(100vw - min(520px,46vw) - 40px)}
html.touch-shell body .hoi-ui:has(.ui-sidebar) .tc-tray{display:none}
/* old desktop strips are gone from the dock; hide any leftovers */
html.touch-shell .map-selection-tools,html.touch-shell .map-command-strip,html.touch-shell #counter-choice{display:none!important}
/* top-bar management nav: visible labels on touch (no hover tooltips on iPad) */
html.touch-shell body .hoi-ui .hoi-management button{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-width:50px;min-height:46px}
html.touch-shell body .hoi-ui .hoi-management .icon-nav-label{display:block!important;position:static!important;width:auto!important;height:auto!important;clip:auto!important;overflow:visible!important;font-size:11px;line-height:1;white-space:nowrap}
@media (max-width:1100px){.tc-tray{width:calc(100vw - 140px - var(--tc-safe-l) - var(--tc-safe-r));min-width:0;bottom:calc(84px + var(--tc-safe-b))}html.touch-shell body .hoi-ui .hoi-commanders{right:auto;left:12px;max-width:calc(100vw - 120px)}}
html.touch-shell body .hoi-ui .ui-map-legend{display:none}
html.touch-shell body .hoi-ui .touch-hud button{height:auto;line-height:1.25;box-sizing:border-box;font-size:14px}
html.touch-shell body.has-overlay #map-joystick{display:none!important}
html.touch-shell body .hoi-ui:has(.ui-sidebar) .tc-toasts{left:calc((100vw - min(540px,48vw)) / 2);width:min(440px,44vw)}
/* choosing a construction site: the window narrows so the highlighted map stays reachable */
/* site selection collapses the economy window into a placement bar (theme/modules/99-windows.css) */
html.touch-shell body .hoi-ui .tc-inspect header b{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html.touch-shell body .hoi-ui .tc-inspect header button.tc-x,html.touch-shell body .hoi-ui .tc-pop header button.tc-x,html.touch-shell body .hoi-ui .tc-sheet header button.tc-x{width:48px;flex:none;margin:0;padding:0;background:transparent;border:0}
.tc-ping{position:fixed;width:90px;height:90px;margin:-45px 0 0 -45px;border:4px solid #f0d27a;border-radius:50%;pointer-events:none;z-index:39;box-shadow:0 0 0 3px #00000077;animation:tc-ping 1.7s ease-out forwards}
@keyframes tc-ping{0%{transform:scale(.4);opacity:1}60%{transform:scale(1);opacity:1}100%{transform:scale(1.25);opacity:0}}
@media (prefers-reduced-motion:reduce){.tc-ping{animation:none;opacity:.9}}
/* toasts never block the map: only their buttons take touches */
html.touch-shell body .hoi-ui .tc-toasts .tc-toast{pointer-events:none}
html.touch-shell body .hoi-ui .tc-toasts .tc-toast button{pointer-events:auto}
/* MAP-PERF-1: no blended full-screen overlay over the map on touch devices
   (Safari re-blends every composited layer beneath it on each frame). */
html.touch-shell .map-wrap::after{display:none}
html.touch-shell #map-stage{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
/* BATTLE-PLAN-1: plan bar (replaces the command bar while an army is selected) */
html.touch-shell body .hoi-ui .tc-planbar{border-left:5px solid var(--army,#5aa9e6);max-height:calc(100dvh - 204px);overflow-y:auto;overscroll-behavior:contain}
html.touch-shell body .hoi-ui .tc-planbar header{display:flex;flex-direction:column;align-items:center;gap:1px;padding:2px 2px 4px;max-width:76px}
html.touch-shell body .hoi-ui .tc-planbar header b{font-size:12px;text-align:center;line-height:1.15;color:var(--army,#5aa9e6)}
html.touch-shell body .hoi-ui .tc-planbar header small{font-size:12px;color:#d6d0c1;text-align:center}
html.touch-shell body .hoi-ui .tc-planbar button.tc-go{background:#3f6b3a;border-color:#a9dd8c;color:#e8e2d3;font-weight:700}
html.touch-shell body .hoi-ui .tc-planbar button.tc-go[data-blocked="1"]{background:#393a38;border-color:#7d755e;color:#bcb39a;font-weight:400}
html.touch-shell body .hoi-ui .tc-planbar button.tc-stop{background:#6b2f2a;border-color:#e58b78;color:#e2ddcf;font-weight:700}
html.touch-shell body .hoi-ui .tc-planbar button.tc-quiet{background:transparent}
html.touch-shell body .hoi-ui .tc-toast [data-tc="toast-undo"]{min-height:40px;padding:0 12px;border-radius:6px;border:1px solid #e0c879;background:#3b3c39;color:#e2dccd;font-weight:600}
html.touch-shell body .hoi-ui .ui-corps-card[style*="--corps"]{border-left:5px solid var(--corps)}
html.touch-shell body .hoi-ui .ui-corps-card[data-army-selected="true"]{outline:3px solid var(--corps);outline-offset:1px}
html.touch-shell body .hoi-ui .map-plan-strip[data-tool] b{color:#e2dccd}
/* MP-LATENCY-1: order receipt chip (where the order banner was): sent (local) → server verdict. Opacity and
   transform only, so showing it never restyles the map. */
.tc-verdict{position:fixed;left:50%;top:calc(92px + env(safe-area-inset-top,0px));z-index:8600;transform:translate(-50%,-6px);opacity:0;pointer-events:none;padding:6px 16px 7px;font:600 14px/1.3 var(--font-ui,system-ui);letter-spacing:.06em;color:#d4cfbf;background:linear-gradient(180deg,#181817f2,#0e0e0ef2);border:1px solid #000000;border-left:4px solid #8b836b;box-shadow:0 6px 18px #000000aa,inset 0 1px 0 #ede8d912;transition:opacity .14s,transform .14s;white-space:nowrap;max-width:calc(100vw - 40px);overflow:hidden;text-overflow:ellipsis}
.tc-verdict.in{opacity:1;transform:translate(-50%,0)}
.tc-verdict.out{opacity:0;transform:translate(-50%,-6px);transition-duration:.4s}
.tc-verdict[data-tone="ok"]{border-left-color:#c3b58c;color:#e0dbcb}
.tc-verdict[data-tone="bad"]{border-left-color:#c0392b;color:#d3cebe;background:linear-gradient(180deg,#2a120ef2,#170a08f2)}
@media (prefers-reduced-motion:reduce){.tc-verdict{transition:none}}

/* Europe Beta: explicit port-to-port army transport, shared touch sheet. */
.beta-sea-sheet{width:min(760px,calc(100vw - 24px));max-height:min(780px,calc(100dvh - 110px));display:flex;flex-direction:column}
.beta-sea-sheet>header b{display:flex;align-items:center;gap:8px}.beta-sea-sheet svg{width:24px;height:24px;flex:0 0 24px}
.beta-sea-summary{display:flex;justify-content:space-between;gap:16px;padding:12px 18px;background:#2a2a28;color:#c8c3b3}
.beta-sea-sheet>p{margin:12px 18px;line-height:1.6;font-size:14px}.beta-sea-sheet .tc-scroll{min-height:0;overflow:auto;overscroll-behavior:contain;padding:0 16px 16px}
.beta-sea-units article{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 4px;border-bottom:1px solid #6d6c6766}.beta-sea-units small{display:block;margin-top:5px;color:#bebdba}.beta-sea-units button{min-height:44px;flex-shrink:0}
.beta-sea-ports{display:grid;grid-template-columns:1fr 1fr;gap:8px}.beta-sea-ports article{display:flex;min-width:0;border:1px solid #5a5956;background:#21211f}.beta-sea-ports article>button:first-child{display:flex;align-items:center;gap:10px;flex:1;min-width:0;text-align:left;padding:12px;min-height:64px}.beta-sea-ports button[aria-pressed="true"]{background:#444542;border-color:#cfc4a4}.beta-sea-ports span{min-width:0}.beta-sea-ports b{display:block;overflow-wrap:anywhere}.beta-sea-ports small{display:block;margin-top:5px;color:#b3b2ae;font-size:12px}.beta-sea-ports article>button:last-child{flex:0 0 60px;font-size:12px;border-left:1px solid #484847}.beta-sea-sheet>footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border-top:1px solid #6a6963}.beta-sea-sheet>footer button{min-height:48px;flex-shrink:0}.beta-sea-sheet>footer small{line-height:1.5}.beta-sea-empty{grid-column:1/-1;line-height:1.7;padding:16px;color:#ccc3a6}
@media(max-width:640px){.beta-sea-ports{grid-template-columns:1fr}.beta-sea-sheet>footer{align-items:stretch;flex-direction:column}.beta-sea-summary{font-size:13px}}

/* Battle planning: one visible draft and reachable confirmation on desktop/iPad. */
html.touch-shell body .hoi-ui .plan-draft-strip{width:min(960px,calc(100vw - 32px));display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 20px;padding:12px 16px;border-left:4px solid var(--army,#d0c5a4)!important;border-radius:2px;background:linear-gradient(180deg,#20211f,#131311)!important;box-sizing:border-box}
html.touch-shell body .hoi-ui .plan-draft-copy{min-width:0;display:grid;gap:4px}
html.touch-shell body .hoi-ui .plan-draft-copy small{color:var(--army,#d0c5a4);text-align:left;font-size:12px;letter-spacing:.06em}
html.touch-shell body .hoi-ui .plan-draft-copy b{margin:0;font-size:18px}
html.touch-shell body .hoi-ui .plan-draft-copy #plan-draw-status{font-size:13px;line-height:1.5;min-width:0;overflow-wrap:anywhere;color:#c2bcad}
html.touch-shell body .hoi-ui .plan-draft-actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
html.touch-shell body .hoi-ui .plan-draft-actions button{min-width:64px;min-height:48px;padding:0 12px;border-radius:2px;font-size:14px}
html.touch-shell body .hoi-ui .plan-draft-actions #plan-finish-draw{min-width:124px;background:linear-gradient(180deg,#615f58,#3a3b38);border:1px solid #aba9a1;color:#ddd8c7}
html.touch-shell body .hoi-ui .plan-draft-actions button:disabled{opacity:.4;cursor:default}
html.touch-shell body .hoi-ui .plan-draft-hint{grid-column:1/-1;font-size:12px;border-top:1px solid #40403f;padding-top:7px;text-align:left;color:#979690}
html.touch-shell .hoi-ui:has(.plan-draft-strip) .hoi-map-modes{display:none}
html.touch-shell body .hoi-ui .tc-plan-card{border-left:3px solid var(--army,#d0c5a4);box-sizing:border-box;padding:6px 10px 10px}
html.touch-shell body .hoi-ui .tc-plan-card>header{flex-wrap:wrap;gap:4px}
html.touch-shell body .hoi-ui .tc-plan-card>header b{font-size:14px;max-width:180px;overflow-wrap:anywhere}
html.touch-shell body .hoi-ui .tc-plan-help{font-size:12px;line-height:1.5;color:#b8b6af;margin:4px 4px 10px}
html.touch-shell body .hoi-ui .tc-plan-line{display:flex;gap:4px;align-items:center;border-top:1px solid #474745;padding:6px 0}
html.touch-shell body .hoi-ui .tc-plan-line button{min-height:44px;min-width:44px;border:1px solid #55534d;background:#252524;color:#cfcaba;padding:5px 7px}
html.touch-shell body .hoi-ui .tc-plan-line>button[data-tc="plan-arrow-locate"]{min-width:0;flex:1;display:grid;gap:3px;text-align:left;background:transparent;border:0}
html.touch-shell body .hoi-ui .tc-plan-line b{font-size:13px}
html.touch-shell body .hoi-ui .tc-plan-line small{font-size:11px;color:#aba9a3}
html.touch-shell body .hoi-ui .plan-line-number{flex:0 0 22px;display:grid;place-items:center;width:22px;height:26px;border:1px solid var(--army,#aeaca4);color:var(--army,#aeaca4);font-size:13px;font-weight:700}
.hoi-ui .army-plan-summary{display:flex;justify-content:space-between;align-items:center;gap:12px;border-left:3px solid var(--army,#aeaca4);padding:10px 14px;background:#212120}
.hoi-ui .army-plan-summary small{color:#a8a69f;font-size:12px;letter-spacing:.1em}.hoi-ui .army-plan-summary h3{margin:4px 0 0}.hoi-ui .army-plan-summary>b{color:var(--army,#aeaca4);font-size:14px}
.hoi-ui .army-plan-reason{font-size:13px;color:#bfbdb8;line-height:1.6;margin:10px 0}
.hoi-ui .corps-plan-tools .plan-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.hoi-ui .corps-plan-tools .plan-steps button{display:grid;gap:7px;text-align:left;padding:14px;min-height:100px;background:linear-gradient(140deg,#2a2a29,#181917);border:1px solid #5b5953;min-width:0}
.hoi-ui .corps-plan-tools .plan-steps small{font-size:11px;color:#aeaba4}.hoi-ui .corps-plan-tools .plan-steps b{font-size:16px;color:#cfc9ba}.hoi-ui .corps-plan-tools .plan-steps span{font-size:12px;color:#b4b3ac;line-height:1.5}
.hoi-ui .army-plan-readiness{display:flex;gap:8px 16px;flex-wrap:wrap;padding:12px 4px;border-bottom:1px solid #4b4b49;font-size:13px}.hoi-ui .army-plan-readiness b{color:#c5c0b0;margin-left:4px}
.hoi-ui .corps-plan-tools .plan-lines article{display:flex;gap:10px;align-items:center;min-height:68px;padding:8px 0;border-bottom:1px solid #3f3f3d}
.hoi-ui .corps-plan-tools .plan-lines article>div{flex:1;min-width:0;display:grid;gap:4px}.hoi-ui .plan-lines small{font-size:12px;color:#adaca6}.hoi-ui .corps-plan-tools .plan-lines button{min-width:64px;min-height:44px;padding:6px 10px}
.hoi-ui .army-plan-secondary{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.hoi-ui .army-plan-secondary button{min-height:44px;flex:1}
.hoi-ui .army-plan-empty{color:#adaca6;line-height:1.7;padding:14px 10px;background:#161615;font-size:13px}.hoi-ui .army-plan-help{margin-top:14px}.hoi-ui .army-plan-help p{font-size:13px;line-height:1.7;color:#b8b6af}
@media(max-width:760px){html.touch-shell body .hoi-ui .plan-draft-strip{grid-template-columns:minmax(0,1fr);gap:8px;width:calc(100vw - 24px);padding:10px 12px}html.touch-shell body .hoi-ui .plan-draft-actions{justify-content:flex-end}html.touch-shell body .hoi-ui .plan-draft-actions button{flex:1;min-width:54px}.hoi-ui .corps-plan-tools .plan-steps{grid-template-columns:1fr}.hoi-ui .corps-plan-tools .plan-steps button{min-height:76px}}
