#combat-hud{position:absolute;left:5%;right:5%;bottom:1.2%;pointer-events:none;color:#f2f7ff;font-family:system-ui,sans-serif}
.combat-dock{display:grid;grid-template-columns:minmax(0,1fr) 58px minmax(0,1fr);gap:6px;align-items:end;padding:6px 7px 3px;background:linear-gradient(180deg,#0b1529dd,#060c19f5);border:1px solid #677b9855;border-radius:12px 12px 6px 6px;box-shadow:0 3px 14px #0007}
.combat-team{display:grid;grid-auto-columns:minmax(0,1fr);grid-auto-flow:column;gap:6px;--team:#28bfff}
.combat-team[data-hud-team="1"]{--team:#ff9b4a}
.combat-card{position:relative;min-width:0;min-height:44px;padding:3px 5px 3px 42px;border-bottom:2px solid var(--team);background:linear-gradient(110deg,#19283b,#0b1522);border-radius:9px 4px 4px 4px}
.combat-portrait{position:absolute;left:1px;top:-9px;width:36px;height:36px;border:2px solid var(--team);border-radius:50%;background:radial-gradient(circle,#375171,#0a1324);box-shadow:0 0 8px color-mix(in srgb,var(--team) 25%,transparent);overflow:visible}
.combat-portrait img{width:100%;height:100%;object-fit:cover;object-position:center 20%;border-radius:50%}
.combat-player{position:absolute;bottom:-7px;left:50%;transform:translateX(-50%);font-size:8px;font-weight:800;white-space:nowrap;background:#071020;border:1px solid var(--team);border-radius:3px;padding:0 3px;color:var(--team)}
.combat-vitals strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;line-height:14px}
.combat-life,.combat-energy{overflow:hidden;background:#050a13;border-radius:3px;height:9px;margin:2px 0;box-shadow:inset 0 0 0 1px #ffffff15}
.combat-life i,.combat-energy i{display:block;width:100%;height:100%;transform-origin:left;transition:transform 90ms linear}
.combat-life i{background:linear-gradient(180deg,#fcfff5,var(--team) 28%,color-mix(in srgb,var(--team) 65%,#071020))}
.combat-energy{height:4px}.combat-energy i{background:linear-gradient(90deg,#8761ef,#e4c7ff)}
.combat-vitals small{font-size:8px;line-height:10px;color:#b4c4df;white-space:nowrap;display:block}
.combat-card[data-danger="true"] .combat-life i{background:linear-gradient(#ffb7a7,#ef4959)}
.combat-card[data-ko="true"]{opacity:.45;filter:grayscale(.8)}.combat-card[data-standby="true"]{opacity:.6}
.combat-center{text-align:center;align-self:center}.combat-clock{font-size:22px;font-weight:800;font-variant-numeric:tabular-nums;line-height:24px}.combat-round{font-size:8px;letter-spacing:.05em;color:#a6b9d4}
.combat-rounds{display:flex;gap:4px;min-height:7px;margin-top:3px}.combat-rounds[data-round-team="1"]{justify-content:flex-end}
.round-crystal{display:block;width:5px;height:5px;transform:rotate(45deg);border:1px solid #8a9cb5;background:#142034}.round-crystal[data-won="true"]{background:#ffe5a0;border-color:#fff0be;box-shadow:0 0 5px #ffdc79}
.team-energy-row{display:flex;align-items:center;gap:6px;margin:0 6px 4px}.team-energy-title{font-size:8px;letter-spacing:.08em;color:#aabdde;white-space:nowrap}
.team-energy-meter{display:flex;flex:1;height:5px;border:1px solid #d3e4ff66;background:#111c2f;overflow:hidden;border-radius:3px}
.team-energy-left{background:linear-gradient(90deg,#157fa9,#69eaff)}.team-energy-right{background:linear-gradient(90deg,#ffd190,#dc6a21)}
#combat-hud .team-energy-row[hidden],#combat-hud .combat-dock>div[hidden]{display:none}
#combat-hud[data-solo="true"] .combat-dock{grid-template-columns:minmax(0,1fr) 58px}#combat-hud[data-solo="true"] .combat-center{order:1}
#combat-hud[data-size="1"] .combat-portrait{width:42px;height:42px;top:-10px}#combat-hud[data-size="1"] .combat-card{padding-left:50px}
@media(max-width:700px){#combat-hud{left:2%;right:2%}.combat-dock{gap:3px;padding:5px 3px 2px;grid-template-columns:minmax(0,1fr) 34px minmax(0,1fr)}.combat-team{gap:3px}.combat-card{padding:2px;min-height:33px}.combat-portrait{position:relative;width:20px!important;height:20px!important;top:-4px!important;left:0;float:left;margin-right:3px}.combat-player{font-size:6px;bottom:-4px}.combat-vitals strong{font-size:8px;line-height:12px}.combat-life{height:6px;clear:both}.combat-energy{height:3px}.combat-vitals small{display:none}.combat-clock{font-size:17px}.combat-round{font-size:6px}.team-energy-title{font-size:6px}#combat-hud[data-size="1"] .combat-card{padding-left:3px}}
@media(prefers-reduced-motion:reduce){.combat-life i,.combat-energy i{transition:none}}
.game-shell{container-type:size}
@container(max-width:1000px){
 #combat-hud{left:5%;right:5%}.combat-dock{padding:3px 4px 2px;gap:3px;grid-template-columns:minmax(0,1fr) 34px minmax(0,1fr)}.combat-team{gap:3px}
 #combat-hud .combat-card{min-height:28px;padding:2px;box-sizing:border-box}
 #combat-hud .combat-portrait{width:20px!important;height:20px!important;position:absolute;top:-13px!important;left:0;float:none;margin:0}
 .combat-vitals strong{font-size:8px;line-height:11px;padding-left:25px}.combat-vitals small{display:none}.combat-life{height:6px}.combat-energy{height:3px}.combat-player{font-size:6px;bottom:-4px}
 .combat-clock{font-size:17px;line-height:20px}.combat-round{font-size:6px}.combat-rounds{min-height:5px;margin-top:2px}.round-crystal{width:4px;height:4px}
 .team-energy-row{margin-bottom:3px;line-height:8px}.team-energy-title{font-size:6px}.team-energy-meter{height:3px}
}