/* Logical 844 × 390: 18px outer margin; 16px gaps; three 258 2/3 × 56 panels. */
.battle-hud .battle-top{position:absolute;left:18px;right:18px;top:12px;height:56px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:stretch}
.battle-hud .battle-top>.hud-panel{position:relative;inset:auto;width:auto;height:56px;min-width:0;margin:0;border:1px solid #ffffff55;border-radius:9px;background:var(--hud-glass);box-shadow:inset 0 1px 0 #ffffff15;backdrop-filter:blur(3px);color:#fffdf4;text-shadow:0 1px 3px #173b45}
.battle-hud .battle-top .vitals{padding:5px 8px;display:flex;align-items:center;gap:8px}
.hud-avatar{position:relative;flex:0 0 40px;width:40px;height:44px;overflow:hidden;border-radius:6px;background:#f3edcd21;border:1px solid #ffffff35}
.hud-avatar img{position:absolute;width:112px;height:112px;max-width:none;object-fit:contain;left:calc(50% - 56px);top:-12px}
.hud-avatar #heroLevel{position:absolute;left:0;right:0;bottom:0;height:13px;line-height:13px;text-align:center;background:#173b4599;font-size:10px;font-weight:700;color:#fffdf4}
.hud-sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.hud-meters{display:flex;flex:1;min-width:0;flex-direction:column;justify-content:center;gap:3px}
.hud-meter-row{height:12px;min-width:0;display:flex;align-items:center;gap:5px}
.hud-meter-row .meter-name{width:22px;flex-shrink:0;font-size:10px;font-weight:600;line-height:12px;letter-spacing:0}
.battle-hud .vitals .hud-meter-row .bar{flex:1;min-width:0;height:11px;margin:0;background:#153c476e;border-radius:3px;box-shadow:inset 0 0 0 1px #ffffff16}
.battle-hud .vitals .hud-meter-row .bar span{font-size:10px;line-height:11px;color:#fffdf4;text-shadow:0 1px 2px #173b45;padding-right:4px;white-space:nowrap}
.battle-hud .vitals .bar i{opacity:.95}.battle-hud .vitals .bar.exp i{background:#caa650}
.battle-hud .battle-top .route-hud{padding:4px 8px;gap:1px;justify-content:center;text-align:center;font-size:13px;line-height:16px}
.battle-hud .route-hud strong{font-size:13px;line-height:16px;letter-spacing:.02em;font-weight:600}
.route-divider{padding:0 5px;opacity:.6}.battle-hud .route-hud small{font-size:10px;line-height:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.battle-hud .route-caption{font-size:10px;line-height:12px;white-space:nowrap;opacity:.9}
.battle-hud .battle-top .top-tools{padding:4px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;align-items:center}
.battle-hud .battle-top .top-tools button{width:100%;min-width:0;height:46px;min-height:44px;max-height:46px;padding:0;gap:0;background:transparent;border-color:transparent;border-radius:5px;box-shadow:none;backdrop-filter:none;display:flex;flex-direction:column;align-items:center;justify-content:center}
.battle-hud .battle-top .top-tools button+button{border-left:1px solid #ffffff2b;border-top-left-radius:0;border-bottom-left-radius:0}
.battle-hud .battle-top .top-tools button img{width:30px;height:30px;margin:0;object-fit:contain}
.battle-hud .battle-top .top-tools button svg{width:26px;height:26px;margin:2px 0}
.battle-hud .battle-top .top-tools button span{font-size:10px;line-height:12px;letter-spacing:.1em}
.battle-hud .battle-top .top-tools button:hover{background:#ffffff1c}
.battle-hud .status-icons{left:18px;top:74px;max-width:258px;display:flex;flex-direction:row;flex-wrap:wrap;gap:4px}
.battle-hud .status-icons:empty{display:none}.battle-hud .status-icons span{font-size:10px;line-height:13px;padding:2px 5px;min-width:0}
.battle-hud .warning{top:76px;left:292.6667px;right:auto;width:258.6667px;font-size:12px;line-height:16px;padding:4px 8px}
.battle-hud .battle-bottom{left:18px;right:18px;bottom:12px}
.battle-hud .battle-bottom .combat-slot{width:51px;min-width:51px;max-width:51px;height:51px;min-height:51px}
.battle-hud .battle-hint{max-width:470px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}