/* Native movement controls retain controller selectors and engine decisions. */
#battle-screen #battle-bottom-bar{border-top:1px solid #244855;background:#091923}
#battle-screen #battle-bottom-bar .board-caption{padding:8px 14px;border-top:0;font-size:11px}
#battle-screen #battle-bottom-bar .context-hint{padding:8px 14px;min-height:36px;font-size:12px;line-height:1.45}
#battle-screen[data-caption-hidden] #battle-bottom-bar{display:none}
#battle-screen #toggle-bottom-bar{min-height:36px;min-width:44px;padding:7px 10px;border-color:#397b8b88;background:#081923c9;color:#a8c8d2;font:600 11px/1.2 Rajdhani,'Segoe UI',sans-serif;letter-spacing:.025em;white-space:nowrap}
#battle-screen #toggle-bottom-bar:hover{border-color:#7de8f1;color:#e5fdff;background:#123541}
#battle-screen #toggle-bottom-bar:focus-visible{outline:2px solid #e5fdff;outline-offset:2px}
#battle-screen #toggle-bottom-bar svg{display:block;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.5;pointer-events:none}
@media(min-width:701px){#battle-screen #board{height:clamp(480px,calc(100vh - 146px),1400px);height:clamp(480px,calc(100dvh - 146px),1400px);max-height:none}#battle-screen[data-caption-hidden] #board{height:clamp(480px,calc(100vh - 86px),1460px);height:clamp(480px,calc(100dvh - 86px),1460px)}}
@media(max-width:700px){#battle-screen[data-caption-hidden] #board{min-height:400px;max-height:calc(75vh + 40px)}#battle-screen #toggle-bottom-bar{min-height:44px;font-size:10px;padding:7px 8px}}
/* Transparent range dial; all movement decisions retain the controller hooks. */
#battle-screen .movement-hud{--movement-cyan:#19b9df;right:14px;bottom:12px;width:300px;max-width:calc(100% - 24px);max-height:calc(100% - 90px);box-sizing:border-box;overflow:auto;overscroll-behavior:contain;padding:0;color:#e0f4f6;background:rgba(8,27,37,.24);border:0;border-radius:0;box-shadow:none;clip-path:none;scrollbar-width:thin;scrollbar-color:#397789 #081b25;text-shadow:0 1px 2px #000}
#battle-screen .movement-hud .movement-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 10px;border-bottom:1px solid #29455180;background:#081b2580;min-width:0}
#battle-screen .movement-hud .movement-group-title{min-width:0}
#battle-screen .movement-hud .movement-kicker{display:block;color:#9ab6c0;font:600 10px/1.3 Rajdhani,'Segoe UI',sans-serif;letter-spacing:.15em;margin-bottom:3px}
#battle-screen .movement-hud .movement-heading h3{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:600 16px/1.2 Rajdhani,'Segoe UI',sans-serif;letter-spacing:.025em;color:var(--movement-cyan);min-width:0;margin:0}
#battle-screen .movement-hud .movement-thrust{display:flex;flex-direction:column;align-items:flex-end;flex-shrink:0;gap:4px;color:#9ab6c0;font-size:11px;line-height:1.3}
#battle-screen .movement-hud .movement-thrust strong{color:#e0f4f6;font-weight:600;font-variant-numeric:tabular-nums}
#battle-screen .movement-hud .movement-thrust-pips{display:flex;gap:4px;align-items:center;min-height:4px}
#battle-screen .movement-hud .movement-thrust-pips>span{width:8px;height:3px;background:var(--movement-cyan)}
#battle-screen .movement-hud .movement-thrust-pips>small{font-size:11px;line-height:1;color:var(--movement-cyan)}
#battle-screen .movement-hud .movement-body{padding:7px 12px 9px}
#battle-screen .movement-hud .movement-compass{position:relative;display:block;aspect-ratio:300/210;height:auto;margin:0 0 7px;padding:0;isolation:isolate}
#battle-screen .movement-hud .movement-compass::before{content:none}
#battle-screen .movement-hud .movement-course{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;transform:none}
#battle-screen .movement-hud .movement-course svg{display:block;width:100%;height:100%;overflow:visible}
#battle-screen .movement-hud .movement-range-arc,#battle-screen .movement-hud .movement-range-boundary{fill:none;stroke:#69757d;stroke-opacity:.55;stroke-width:1.2}
#battle-screen .movement-hud .movement-ghost-arrow{fill:none;stroke:#09738d;stroke-width:1.6;opacity:.6}
#battle-screen .movement-hud .movement-ghost-shaft{fill:none;stroke:#09738d;stroke-width:12;stroke-dasharray:18 10;opacity:.5}
#battle-screen .movement-hud .movement-course-shaft{fill:none;stroke:var(--movement-cyan);stroke-width:12;stroke-dasharray:18 10;stroke-linecap:butt}
#battle-screen .movement-hud .movement-selected-arrow{fill:var(--movement-cyan);stroke:#07566d;stroke-width:1.6}
#battle-screen .movement-hud .movement-pivot-origin{fill:var(--movement-cyan)}
#battle-screen .movement-hud .movement-compass button{position:absolute;display:flex;align-items:center;justify-content:center;width:13%;max-width:36px;height:36px;min-width:0;min-height:36px;margin:0;padding:0;transform:translate(-50%,-50%);color:var(--movement-cyan);background:transparent;border:1px solid transparent;border-radius:2px;box-shadow:none;text-shadow:0 1px 2px #000;cursor:pointer;font:400 22px/1 Rajdhani,'Segoe UI',sans-serif;letter-spacing:0}
#battle-screen .movement-hud .movement-compass button[aria-pressed=true]{color:#8af1ff;font-weight:600;text-shadow:0 0 5px #19b9df66}
#battle-screen .movement-hud .movement-compass button:hover:not(:disabled){color:#dcfbff;background:#0a273d44;border-color:#2fb3cd77}
#battle-screen .movement-hud .movement-compass button:disabled{color:#78828a;opacity:.85;filter:none;cursor:not-allowed}
#battle-screen .movement-hud .movement-readouts{margin:0 0 4px}
#battle-screen .movement-hud .movement-readouts label{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0;color:#a8c8d2;font-size:11px;line-height:1.3}
#battle-screen .movement-hud .movement-readouts strong{color:#e0f4f6;font:600 18px/1 Rajdhani,'Segoe UI',sans-serif;font-variant-numeric:tabular-nums}
#battle-screen .movement-hud .movement-readouts strong small{font-size:14px;margin-left:1px}
#battle-screen .movement-hud #distance-select{display:block;width:100%;height:21px;margin:0;cursor:pointer;accent-color:var(--movement-cyan);touch-action:pan-y}
#battle-screen .movement-hud .movement-range-labels{display:flex;justify-content:space-between;font-size:10px;line-height:1.3;color:#a8c8d2}
#battle-screen .movement-hud .movement-pivot-note{margin:5px 0 0;padding:0;color:#a8c8d2;font-size:10px;line-height:1.35}
#battle-screen .movement-hud #move-validity{min-height:0;margin:5px 0 0;padding:0;color:#8ce7f6;font-size:11px;line-height:1.35}
#battle-screen .movement-hud #move-validity:empty{display:none}
#battle-screen .movement-hud .movement-buttons{display:flex;flex-direction:column;gap:5px;margin:7px 0 0}
#battle-screen .movement-hud .movement-confirm{display:flex;align-items:center;justify-content:center;gap:7px;width:100%;min-height:38px;margin:0;padding:6px 8px;font:700 12px/1.3 Rajdhani,'Segoe UI',sans-serif;letter-spacing:.01em;color:#051a22;background:#36c8e1e8;border:1px solid #45d2e8;border-radius:2px;box-shadow:none;text-shadow:none}
#battle-screen .movement-hud .movement-confirm:hover:not(:disabled){background:#83e7f5;border-color:#a7f5ff}
#battle-screen .movement-hud .movement-confirm svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
#battle-screen .movement-hud .movement-action-row{display:grid;grid-template-columns:1fr 1fr;gap:5px}
#battle-screen .movement-hud .movement-action-row button{display:flex;align-items:center;justify-content:center;gap:5px;min-width:0;min-height:36px;margin:0;padding:5px 3px;border-radius:2px;font:500 11px/1.25 Rajdhani,'Segoe UI',sans-serif;letter-spacing:0;box-shadow:none;text-transform:none}
#battle-screen .movement-hud .movement-lock{color:#e0f4f6;background:#102b3780;border:1px solid #29455199}
#battle-screen .movement-hud .movement-lock:hover:not(:disabled){background:#194452bb;border-color:var(--movement-cyan)}
#battle-screen .movement-hud .movement-finish{color:#bed4db;background:transparent;border:1px solid transparent}
#battle-screen .movement-hud .movement-finish:hover:not(:disabled){color:#e0f4f6;background:#102b3777}
#battle-screen .movement-hud .movement-finish>span{font-size:18px}
#battle-screen .movement-hud .movement-lock svg{width:16px;height:18px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
#battle-screen .movement-hud :is(button,input):focus-visible{outline:2px solid #e5fdff;outline-offset:2px}
#battle-screen .movement-hud .movement-buttons button:disabled,#battle-screen .movement-hud input:disabled{opacity:.36;cursor:not-allowed}
#battle-screen .movement-hud .movement-sail-note{margin:6px 0 0;padding:4px 6px;border-left:2px solid #4ca6b3;color:#b5d7df;background:#2b607022;font-size:11px;line-height:1.4}
#battle-screen .movement-hud .movement-formation-note{margin:0 0 8px;color:#adccd4;font-size:12px;line-height:1.4}
#battle-screen .movement-hud .movement-formation-status{margin:0 0 10px;font-size:12px;line-height:1.4}
#battle-screen .movement-hud .movement-back{display:block;width:100%;min-height:38px;margin:5px 0 0;padding:6px;background:none;border-color:transparent;font-size:11px;color:#b5d7df}
@media(max-width:700px){#battle-screen .movement-hud{right:8px;bottom:8px;width:320px;max-width:calc(100% - 16px);max-height:min(390px,calc(100dvh - 180px))}#battle-screen .movement-hud .movement-compass button{width:13%;max-width:40px;height:44px;min-width:0;min-height:44px}#battle-screen .movement-hud .movement-confirm,#battle-screen .movement-hud .movement-action-row button,#battle-screen .movement-hud .movement-back{min-height:44px}}
@media(max-height:550px) and (min-width:701px){#battle-screen .movement-hud{max-height:calc(100% - 72px)}}
