/* Opaque panels and vector accents keep the arena readable without live blur. */
#hud .health,#hud .timer{background:#0a1018ed;border:1px solid #ffffff38;padding:7px 10px;border-radius:4px}
#hud .health{min-width:0}
#pname,#ename{border-bottom:3px solid transparent;padding-bottom:2px;color:#fff}
#hud .health-track{border-color:#ffffffa0;background:#30101a}
#hud .run-track{height:5px;background:#ffffff26}
#hud .timer strong{color:#fff}
#combo,#enemyCombo{color:#fff6ba;text-shadow:0 2px 4px #000;background:#090e17e8;padding:8px 11px;border-left:3px solid #ffe779;border-radius:3px}
#combo:empty,#enemyCombo:empty{display:none}
#combo small,#enemyCombo small{color:#fff}
#linkFeedback{position:absolute;top:42%;left:6%;max-width:40%;padding:7px 10px;background:#080d15ef;border:1px solid currentColor;font:bold 12px Arial;pointer-events:none;z-index:3}
#linkFeedback[data-side="enemy"]{left:auto;right:6%}
#combatDebug{position:absolute;top:155px;left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));margin:0;padding:8px;background:#050b13ee;color:#e5f1ff;border:1px solid #8da8c780;font:10px/1.45 monospace;white-space:pre-wrap;overflow-wrap:anywhere;pointer-events:none;z-index:4;contain:layout paint}
#debugToggle{font:bold 10px Arial;width:38px}
#debugToggle[aria-pressed="true"]{color:#06121c;background:#79d9ff}
.debug-setting{display:flex;gap:10px;align-items:center;color:#eef6ff;font-size:14px;line-height:1.5}
#debugReport{width:100%;height:40vh;background:#07101a;color:#fff;font:12px monospace;user-select:text;-webkit-user-select:text;touch-action:pan-y}
#heroProfile{display:grid;gap:4px;margin-top:6px;font:12px/1.35 Arial;color:#c9d8dc}
#heroWeakness{color:#e9bc9b}
.card .label{border-left:3px solid var(--fighter-accent,#ffc354)}
.card.selected{border-color:var(--fighter-accent,#ffc354);box-shadow:0 0 0 2px var(--fighter-accent,#ffc354)}
@media(orientation:landscape) and (max-height:520px){
 #hud .health,#hud .timer{padding:4px 7px}
 #combatDebug{top:114px;font-size:9px;line-height:1.25;padding:5px}
 #linkFeedback{top:47%;font-size:10px;padding:4px 7px}
 #menu-hero .hero-info{display:block;padding:5px 0}
 #menu-hero .hero-info h2,#menu-hero .hero-info p{display:none}
 #heroProfile{grid-template-columns:1fr 1fr;gap:10px;margin:0;font-size:10px}
}
@media(max-width:650px) and (orientation:portrait){
 #hud .health,#hud .timer{padding:5px}
 #combatDebug{font-size:9px;top:166px}
 #linkFeedback{top:44%;font-size:10px}
}