/* The stage permits a breakout; the battlefield keeps its existing clipped floor. */
.super-team{--profile-width:clamp(170px,18vw,260px);--battle-inset:max(0px,calc(var(--profile-width)*.6 + 28px - (100vw - 100%)*.5))}
.battle-stage{position:relative;isolation:isolate}
.battle-stage>.team-scene{width:calc(100% - var(--battle-inset)*2);min-height:calc(540px + var(--hud-content-space,0px));margin-inline:auto}
.battle-profiles{position:absolute;inset:0 var(--battle-inset);z-index:12;pointer-events:none;perspective:1500px}
.battle-profile{--profile-reveal:0;--profile-pop:0;--profile-float:0px;--profile-x:0px;--profile-y:0px;--member-color:#b7ddec;--profile-direction:1;position:absolute;top:23%;width:var(--profile-width);aspect-ratio:.82;opacity:var(--profile-reveal);visibility:hidden;transform-style:preserve-3d;transform:translate3d(calc((var(--profile-reveal) - 1)*var(--profile-direction)*40px + var(--profile-x)),calc((1 - var(--profile-reveal))*10px + var(--profile-y)),0) rotateY(calc(var(--profile-direction)*-5deg)) rotateZ(calc(var(--profile-direction)*1.5deg)) scale(calc(.9 + var(--profile-reveal)*.1));transform-origin:50% 60%}
.battle-profile[data-profile-state=visible]{visibility:visible}
.profile-hero{right:calc(var(--profile-width)*-.6)}
.profile-enemy{left:calc(var(--profile-width)*-.6);--profile-direction:-1;--member-color:#ff5a79;aspect-ratio:.87}
.profile-surface{position:absolute;inset:6% 3% 4%;border:1px solid color-mix(in srgb,var(--member-color) 70%,#302142);border-radius:12px 4px 13px 4px;background:radial-gradient(ellipse at 65% 28%,color-mix(in srgb,var(--member-color) 20%,#27133e),transparent 62%),linear-gradient(145deg,#29123df2,#0f1223f5);box-shadow:0 7px 0 #09091deb,0 9px 0 color-mix(in srgb,var(--member-color) 30%,#100c1a),0 24px 32px #0009,0 1px 0 #fff3 inset;overflow:hidden;transform:translateZ(0)}
.profile-surface:before{content:'';position:absolute;inset:7px;border:1px solid color-mix(in srgb,var(--member-color) 22%,transparent);border-radius:7px 2px 8px 2px}
.profile-surface:after{content:'';position:absolute;left:10%;right:10%;top:22%;height:34%;border-radius:50%;background:radial-gradient(ellipse,color-mix(in srgb,var(--member-color) 22%,transparent),transparent 70%)}
.profile-lines{position:absolute;inset:0;background:repeating-linear-gradient(-20deg,transparent 0 24px,#e2c9ff13 25px 26px,transparent 27px 46px);background-position:var(--profile-lines,0px) 0}
.profile-face{position:absolute;left:0;top:0;width:100%;aspect-ratio:1;background:var(--portrait-texture,var(--fallback-texture)) var(--portrait-position,0% 0%)/var(--portrait-size,200% 200%) no-repeat;transform:translate3d(calc(var(--profile-x)*.25),calc((1 - var(--profile-pop))*12px + var(--profile-float)),30px) scale(calc(.96 + var(--profile-pop)*.04));transform-origin:50% 70%}
.profile-face.has-profile-art{background-size:300% 100%}
.profile-enemy .profile-face{background-image:url('/assets/corruption-vector.webp');background-size:contain;background-position:center;top:3%;left:3%;width:94%}
.profile-enemy .profile-face.has-profile-art{background-image:url('/assets/battle-profile-corruption.webp');background-size:contain}
.profile-caption{position:absolute;left:7%;right:7%;bottom:0;display:flex;align-items:flex-start;flex-direction:column;gap:7px;padding:12px 14px 14px;border:1px solid color-mix(in srgb,var(--member-color) 60%,#40314f);border-radius:6px;background:linear-gradient(130deg,#442068f5,#1c1632fa);box-shadow:0 5px 0 #090b1e,0 14px 17px #0009,0 1px 0 #fff3 inset;transform:translate3d(0,calc((1 - var(--profile-pop))*16px - var(--profile-float)*.3),48px)}
.profile-kicker{font:8px/1.3 ui-monospace,SFMono-Regular,monospace;letter-spacing:.1em;color:var(--member-color);transform:translateZ(7px)}
.profile-badge{display:inline-flex;align-items:center;gap:6px;max-width:100%;padding:4px 8px 4px 5px;border:1px solid color-mix(in srgb,var(--member-color) 50%,#382447);border-radius:5px;background:#090f20;box-shadow:0 3px 0 #060719,0 7px 10px #0008;font-size:13px;font-weight:700;line-height:1.2;letter-spacing:.025em;color:#fff;transform:translateZ(14px)}
.profile-badge .team-brand-icon{width:20px;height:20px;border-radius:3px;box-shadow:none}
.profile-caption>strong{font-size:clamp(19px,2.1vw,27px);font-weight:850;line-height:1.08;letter-spacing:.025em;color:white;text-shadow:0 1px 0 #736185,0 2px 0 #463356,0 3px 0 #2c1b3f,0 6px 4px #070516b3,0 12px 12px #0009;transform:translateZ(22px);overflow-wrap:normal}
.profile-enemy .profile-caption{left:10%;right:10%;bottom:0;background:linear-gradient(130deg,#54215d,#21142cf7)}
.profile-enemy .profile-threat{font-size:clamp(25px,2.6vw,34px);font-style:italic;letter-spacing:.02em}
.profile-enemy[data-taunt-length=long] .profile-threat{font-size:clamp(22px,2vw,28px)}
/* Only decoded portraits replace the existing full-body fallback in the team super. */
.combo-card.has-profile-art .combo-portrait{background-image:var(--portrait-texture);background-size:300% 100%;background-position:var(--portrait-position);top:10%;left:-5%;width:130%;aspect-ratio:1;visibility:visible}
/* Leave room for ElevenLabs' forward-facing features inside the slanted card. */
.combo-card.team-elevenlabs.has-profile-art .combo-portrait{left:6%;width:118%}
@media(max-width:1050px){
  .battle-profile{top:max(25%,142px)}
  .profile-enemy{aspect-ratio:.74}
  .profile-caption{padding:9px 10px 11px;gap:5px}
  .profile-caption>strong{font-size:21px}
  .profile-badge{font-size:11px;padding-inline:5px}
  .profile-badge .team-brand-icon{width:17px;height:17px}
  .profile-enemy .profile-threat{font-size:27px}
  .profile-enemy[data-taunt-length=long] .profile-threat{font-size:20px}
}
@media(min-width:761px) and (max-width:860px){
  .profile-caption>strong{font-size:18px}
  .profile-enemy .profile-threat{font-size:24px}
  .profile-enemy[data-taunt-length=long] .profile-threat{font-size:20px}
}
@media(max-width:760px){
  /* An upward breakout leaves the phone battlefield at its full width. */
  .super-team{--profile-width:clamp(122px,30vw,170px);--battle-inset:0px}
  .battle-stage{--mobile-profile-space:calc(var(--profile-width)*1.08 + 24px);--mobile-hud-top:calc(var(--profile-width)*.72 + 22px);padding-top:var(--mobile-profile-space)}
  .battle-stage>.team-scene{min-height:calc(530px + var(--mobile-hud-top) + var(--hud-content-space,0px))}
  .battle-profiles{top:var(--mobile-profile-space)}
  .battle-stage .battle-hud{top:var(--mobile-hud-top)}
  .battle-stage .combo-cutscene{padding-top:calc(var(--hud-cutscene-top,128px) + var(--mobile-hud-top))}
  .battle-stage .combo-counter{top:calc(145px + var(--mobile-hud-top))}
  .battle-stage .team-tripo,.battle-stage .team-pixverse,.battle-stage .team-magnific{--bottom:49%}
  .battle-stage .team-reactor{--bottom:47%}
  .battle-profile{--profile-detachment-y:-60%;top:0;aspect-ratio:auto;transform:translate3d(0,calc(var(--profile-detachment-y) + (1 - var(--profile-reveal))*12px),0) rotateZ(calc(var(--profile-direction)*1deg)) scale(calc(.94 + var(--profile-reveal)*.06))}
  .profile-hero{right:1%}.profile-enemy{left:1%;aspect-ratio:auto}
  .profile-surface{inset:4% 2% 4%;border-radius:8px 3px}
  .profile-face{position:relative;display:block;transform:translate3d(0,calc((1 - var(--profile-pop))*8px + var(--profile-float)*.4),10px)}
  .profile-enemy .profile-face{top:0}
  .profile-caption{position:relative;left:auto;right:auto;bottom:auto;margin:-8px 4% 0;padding:8px 9px 10px;gap:5px;transform:translate3d(0,calc((1 - var(--profile-pop))*8px),15px);box-shadow:0 4px 0 #090b1e,0 7px 13px #0008}
  .profile-kicker{font-size:6px;letter-spacing:.035em}
  .profile-badge{gap:4px;font-size:11px;padding:3px 5px;letter-spacing:.01em}
  .profile-badge .team-brand-icon{width:17px;height:17px}
  .profile-caption>strong{font-size:clamp(15px,4vw,17px);letter-spacing:.015em;text-shadow:0 1px 0 #736185,0 2px 0 #463356,0 4px 3px #000c,0 7px 8px #0009;transform:translateZ(5px)}
  .profile-enemy .profile-caption{left:auto;right:auto;margin-inline:6%}
  .profile-enemy .profile-threat{font-size:clamp(18px,5vw,22px)}
  .profile-enemy[data-taunt-length=long] .profile-threat{font-size:18px}
  .profile-enemy[data-taunt-word=long] .profile-threat{font-size:16px}
  .combo-card.has-profile-art .combo-portrait{top:-65%;left:0;width:100%}
  .combo-card.team-elevenlabs.has-profile-art .combo-portrait{top:2%;left:8%;width:70%;transform:translateY(-30%)}
}
@media(prefers-reduced-motion:reduce){
  .battle-profile{transform:translateY(var(--profile-detachment-y,0%))}
  .profile-face,.profile-caption{transform:none}
}
