/* v7.0 — stadium fight presentation: event words, damage pops. Loaded after design.css. */
.fight-callouts{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:6}
.fight-word{position:absolute;left:50%;top:30%;transform:translate(-50%,-50%);font-family:"Barlow Condensed",Barlow,sans-serif;font-weight:700;font-style:italic;letter-spacing:.01em;line-height:.9;white-space:nowrap;opacity:0;color:#fff;-webkit-text-stroke:2px rgba(8,12,16,.85);paint-order:stroke fill;text-shadow:0 0 18px currentColor,0 4px 0 rgba(0,0,0,.45)}
.fight-word.show{animation:fight-slam .95s cubic-bezier(.2,.9,.2,1) both}
.fight-word.hit{font-size:clamp(40px,7vw,92px)}
.fight-word.skill,.fight-word.launch{font-size:clamp(38px,6.4vw,84px);top:24%}
.fight-word.finish{font-size:clamp(56px,11vw,150px);top:40%;animation-duration:1.6s}
.fight-word.lime{color:#d5ed83}.fight-word.coral{color:#efa793}.fight-word.white{color:#ffffff}.fight-word.hot{color:#ffd36b}
@keyframes fight-slam{0%{opacity:0;transform:translate(-50%,-50%) scale(2.3) skewX(-14deg)}14%{opacity:1;transform:translate(-50%,-50%) scale(.94) skewX(-8deg)}24%{transform:translate(-50%,-50%) scale(1.04) skewX(-8deg)}72%{opacity:1;transform:translate(-50%,-52%) scale(1) skewX(-8deg)}100%{opacity:0;transform:translate(-50%,-62%) scale(.96) skewX(-8deg)}}
.dmg-pop{position:absolute;transform:translate(-50%,-50%);font-family:"Barlow Condensed",Barlow,sans-serif;font-weight:700;font-style:italic;font-size:calc(22px * var(--size,1));opacity:0;-webkit-text-stroke:1.5px rgba(8,12,16,.9);paint-order:stroke fill;text-shadow:0 2px 0 rgba(0,0,0,.5)}
.dmg-pop.show{animation:dmg-rise .8s ease-out both}
@keyframes dmg-rise{0%{opacity:0;transform:translate(-50%,-30%) scale(.6)}15%{opacity:1;transform:translate(-50%,-60%) scale(1.15)}100%{opacity:0;transform:translate(-50%,-190%) scale(1)}}
body[data-motion="reduced"] .fight-word.show{animation:fight-fade 1s both}
body[data-motion="reduced"] .dmg-pop{display:none}
@keyframes fight-fade{0%,100%{opacity:0}15%,70%{opacity:1}}

/* Fight HUD: slanted fighting-game bars instead of boxed cards (arena and Survival share it). */
body.playing #hud{align-items:flex-start}
body.playing .fighter{width:min(38%,400px)!important;max-width:none!important;padding:8px 14px 16px!important;border:0!important;border-radius:0!important;background:linear-gradient(180deg,rgba(7,10,14,.78) 0%,rgba(7,10,14,.45) 70%,rgba(7,10,14,0) 100%)!important}
body.playing .fighter>div:first-child{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:6px!important}
body.playing .fighter b{font:700 italic 21px/1 "Barlow Condensed",Barlow,sans-serif;letter-spacing:.03em;text-transform:uppercase}
body.playing .fighter strong{font:700 italic 34px/.9 "Barlow Condensed",Barlow,sans-serif;text-shadow:0 0 14px currentColor}
body.playing .fighter .status-meter{transform:skewX(-20deg);border-radius:0!important;background:rgba(6,9,12,.85)!important;box-shadow:inset 0 0 0 1px rgba(213,237,131,.35)}
body.playing .fighter.rival .status-meter{transform:skewX(20deg);box-shadow:inset 0 0 0 1px rgba(239,167,147,.4)}
body.playing .fighter .integrity.status-meter{height:18px!important;margin-top:0}
body.playing .fighter .meter.status-meter{height:9px!important;margin-top:5px;width:78%}
body.playing .fighter.rival .meter.status-meter{margin-left:auto}
body.playing .fighter .status-meter i{transition:width .28s cubic-bezier(.2,.8,.2,1)}
body.playing .fighter .integrity i{background:linear-gradient(90deg,#6f9a34,#d5ed83)!important;box-shadow:0 0 12px rgba(213,237,131,.55)}
body.playing .fighter.rival .integrity i{background:linear-gradient(270deg,#b8604f,#efa793)!important;box-shadow:0 0 12px rgba(239,167,147,.5)}
body.playing .fighter.rival .status-meter i{inset:0 0 0 auto!important;left:auto!important;right:0}
body.playing .fighter .meter i{background:linear-gradient(90deg,#2f6f96,#8fd8ff)!important}
body.playing .fighter.rival .meter i{background:linear-gradient(270deg,#2f6f96,#8fd8ff)!important}
body.playing .fighter .status-meter span{transform:skewX(20deg);font:700 italic 12px/18px "Barlow Condensed",Barlow,sans-serif;letter-spacing:.04em;text-transform:uppercase}
body.playing .fighter.rival .status-meter span{transform:skewX(-20deg);left:auto;right:9px}
body.playing .fighter .meter.status-meter span{display:none}
body.playing .fighter small{font:700 italic 12px/1 "Barlow Condensed",Barlow,sans-serif;letter-spacing:.06em;margin-top:6px}
body.playing .fighter.rival small{text-align:right}
body.playing .clock{background:rgba(7,10,14,.82)!important;border:0!important;border-radius:0!important;clip-path:polygon(0 0,100% 0,100% 70%,82% 100%,0 100%);padding:6px 14px 9px!important;min-width:78px}
body.playing .clock>span{font:700 italic 38px/1 "Barlow Condensed",Barlow,sans-serif}
body.playing .clock small{font:700 9px/1 Barlow,sans-serif;letter-spacing:.12em;color:#8f9ba5}
body.playing #viewport.critical .fighter:not(.rival) .integrity{animation:hud-danger .6s steps(2) infinite}
@keyframes hud-danger{50%{box-shadow:inset 0 0 0 2px #ff6b4a}}
@media(max-width:760px){body.playing .fighter{padding:6px 8px 12px!important}body.playing .fighter b{font-size:15px}body.playing .fighter strong{font-size:26px}body.playing .fighter .integrity.status-meter{height:14px!important}body.playing .fighter .status-meter span{font-size:10px;line-height:14px}body.playing .clock>span{font-size:30px}}
body[data-motion="reduced"] #viewport.critical .fighter .integrity{animation:none}

/* Survival overlays in the same glass + cut-corner language as the lobby and fight HUD. */
body.playing :is(#reserve-intro,#reserve-camp,#reserve-tools,#reserve-status){background:rgba(8,11,15,.74)!important;border:0!important;border-left:3px solid #d5ed83!important;border-radius:0!important;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
body.playing #reserve-intro{clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,0 100%)}
body.playing .reserve-eyebrow{font:700 italic 16px/1 "Barlow Condensed",Barlow,sans-serif;letter-spacing:.08em;color:#d5ed83}
body.playing #reserve-status{font:700 italic 14px/1.2 "Barlow Condensed",Barlow,sans-serif;letter-spacing:.05em;text-transform:uppercase;padding:8px 14px!important}
body.playing #minimap{border-radius:50%!important;border:2px solid rgba(213,237,131,.55)!important;box-shadow:0 0 18px rgba(213,237,131,.18),inset 0 0 20px rgba(0,0,0,.6);background:rgba(8,11,15,.6)!important}
body.playing.wilds .fighter.rival strong{color:#ffd36b!important}
body.playing #reserve-transition h2{font:700 italic clamp(40px,7vw,86px)/.95 "Barlow Condensed",Barlow,sans-serif;text-transform:uppercase}
body.playing :is(#reserve-panel,#reserve-intro).fading{opacity:0!important;transition:opacity .6s}

/* v7.3 phone pass: thumb-sized controls, no accidental zoom/selection, scrollable dialogs. */
@media (pointer:coarse){
 button,summary,select,.g-node{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
 body.playing #dash{width:86px!important;height:86px!important}
 body.playing #special{width:70px!important;height:70px!important}
 body.playing #guard{width:68px!important;height:68px!important}
 body.playing :is(#brake,#interact){width:54px!important;height:54px!important}
 body.playing #combat-actions{gap:10px 12px!important}
 body.playing #combat-actions button span{font-size:11px!important}
 body.playing #dash span{font-size:14px!important}
 body.playing #combat-actions button small{font-size:9px!important}
 body.playing #combat-actions button kbd{display:none!important}
 body.playing #steer-zone:not([hidden]){width:48%!important;max-width:320px!important;height:46%!important;max-height:340px}
}
@media (pointer:coarse) and (max-height:500px){
 body.playing #dash{width:76px!important;height:76px!important}
 body.playing #special{width:62px!important;height:62px!important}
 body.playing #guard{width:60px!important;height:60px!important}
 body.playing :is(#brake,#interact){width:50px!important;height:50px!important}
 body.playing #steer-zone:not([hidden]){width:36%!important;height:70%!important}
}
body.playing{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
#viewport canvas{touch-action:none}
dialog[open]{max-height:calc(100dvh - 16px);overflow-y:auto;overscroll-behavior:contain}

/* v7.4 · landscape phones: the arena owns the whole screen (browser or installed app). Loaded after
   design/upgrade.css, whose stacked header/safe-area height rules left the arena shifted and clipped. */
@media (orientation:landscape) and (max-height:520px){
 body.playing{padding:0!important;overflow:hidden;overscroll-behavior:none}
 body.playing header{display:none!important}
 body.playing #special #special-name{font-size:9px!important;letter-spacing:.2px;white-space:nowrap}
 body.playing #viewport{position:fixed!important;inset:0!important;width:100vw!important;max-width:none!important;height:100vh!important;height:100dvh!important;min-height:0!important;margin:0!important;border:0!important;border-radius:0!important;z-index:30}
}