/* Overlay drawers share the existing battle controls, never a second UI copy. */
#battle-screen .table-layout{display:block}
#battle-screen .board-panel{width:100%}
#battle-screen .battle-hud-shell{
 position:absolute;inset:12px auto 12px 12px;z-index:5;
 display:flex;align-items:flex-start;gap:8px;width:min(422px,calc(100% - 24px));
 max-height:none;overflow:visible;border:0;border-radius:0;background:none;
 box-shadow:none;pointer-events:none;
}
.battle-hud-rail{display:flex;flex-direction:column;gap:6px;width:58px;flex-shrink:0;pointer-events:auto}
#battle-screen .battle-hud-tab{
 position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;
 gap:3px;width:58px;min-height:54px;padding:7px 3px;border:1px solid #397b8b88;
 border-radius:3px;background:#081923e8;color:#a8c8d2;font-family:Rajdhani,'Segoe UI',sans-serif;
 font-size:12px;letter-spacing:.035em;box-shadow:0 2px 8px #0004;
}
.battle-hud-tab svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
#battle-screen .battle-hud-tab[aria-expanded=true]{border-color:#63e5ef;color:#dffbff;background:#123541;box-shadow:inset 2px 0 #63e5ef,0 3px 10px #0006}
.hud-decision-dot{position:absolute;top:6px;right:6px;width:5px;height:5px;border-radius:50%;background:#f1d69a;box-shadow:0 0 5px #e9c36d77}
#battle-screen .battle-hud-drawer{
 display:flex;flex-direction:column;width:356px;max-width:calc(100% - 66px);max-height:100%;
 overflow:hidden;pointer-events:auto;border:1px solid #397b8b;border-radius:3px;
 background:#07151ef5;box-shadow:0 8px 26px #0008;
}
.battle-hud-drawer[hidden],.hud-decision-dot[hidden]{display:none!important}
.battle-hud-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 13px;border-bottom:1px solid #397b8b;background:linear-gradient(100deg,#12313c,#0a1c27)}
#battle-screen .battle-hud-header h2{margin:0;color:#b9f6fa;font-size:18px;letter-spacing:.06em}
#battle-screen .battle-hud-close{min-width:36px;min-height:36px;padding:5px;border:0;background:transparent;color:#adcbd3;font-size:23px;line-height:1}
.battle-hud-body{overflow:auto;overscroll-behavior:contain;min-height:0;scrollbar-width:thin;scrollbar-color:#397b8b #07131c}
#battle-screen .battle-hud-body #fleets{display:block}
.battle-hud-body [data-hud-panel][hidden]{display:none!important}
#battle-screen .battle-hud-body .log-panel{margin:0;border:0}
#battle-screen .battle-hud-body #battle-log{max-height:none}
#battle-screen .battle-hud-body .panel-heading{padding:12px}
#battle-screen .battle-hud-body .appearance-panel>h3{display:none}
.battle-hud-intro{padding:12px 14px;color:#91acba;font-size:13px;line-height:1.4}
@media(min-width:701px){
 #battle-screen{padding:16px 8px}
 #battle-screen #board{height:clamp(480px,calc(100dvh - 180px),1000px);max-height:none}
}
@media(max-width:700px){
 #battle-screen .battle-hud-shell{position:relative;inset:auto;width:100%;padding:8px;flex-direction:column;gap:6px}
 .battle-hud-rail{width:100%;flex-direction:row;gap:4px}
 #battle-screen .battle-hud-tab{width:calc((100% - 20px)/6);min-height:46px;font-size:11px;padding:4px 2px}
 .battle-hud-tab svg{width:17px;height:17px}
 #battle-screen .battle-hud-drawer{width:100%;max-width:100%;max-height:min(360px,50dvh)}
 #battle-screen .battle-title-hud{position:relative;top:auto;left:auto;transform:none;width:100%;max-width:100%}
 #battle-screen .battle-hud-close{min-height:44px;min-width:44px}
}
