.battle-presentation{position:absolute;inset:0;pointer-events:none;--hero-accent:#88ebbd}
.battle-identity{position:absolute;bottom:138px;left:50%;transform:translateX(-50%);text-align:center;text-shadow:0 2px 8px #001820;display:grid;gap:3px}.battle-identity strong{font:25px Georgia;color:var(--hero-accent)}.battle-identity span{font:10px system-ui;letter-spacing:.12em;color:#d2dfce}
.battle-moment{position:absolute;top:100px;left:50%;transform:translateX(-50%);text-align:center;min-width:340px;padding:16px 32px 19px;background:linear-gradient(90deg,transparent,#092e37ed 20%,#092e37ed 80%,transparent);border-top:1px solid #c8b77c80;border-bottom:1px solid #c8b77c40;color:#f9e5af;animation:battle-reveal .28s ease-out}.battle-moment.hostile{border-color:#e07b6588;background:linear-gradient(90deg,transparent,#442a31ed 20%,#442a31ed 80%,transparent)}.battle-moment small{display:block;font-size:11px;color:#c2d9c4}.battle-moment strong{display:block;font:600 27px/1.3 Georgia;letter-spacing:.05em;margin:5px 0}.battle-moment p{font:12px/1.5 system-ui;margin:4px 0 0;color:#cdd9c2}.battle-moment-faces{display:flex;align-items:center;justify-content:center;gap:12px;height:53px;margin-bottom:8px}.battle-moment-faces img{height:56px;width:46px;object-fit:contain;filter:drop-shadow(0 0 8px #c6ab4955)}.battle-moment-faces b{color:#f6d297;font-size:23px}
.battle-minimap{position:absolute;right:18px;bottom:30px;width:200px;height:127px;border:1px solid #9cae7d88;border-radius:9px;box-shadow:0 5px 25px #00182090}
.battle-target{position:absolute;top:90px;left:22px;display:grid;grid-template-columns:48px 145px;gap:4px 10px;background:#082630e8;padding:12px 15px;border:1px solid #d78f7166;border-radius:7px}.battle-target img{grid-row:1/5;object-fit:contain;width:48px;height:69px}.battle-target strong{font:17px Georgia;color:#f0dcc4}.battle-target small{font:11px system-ui;color:#b6c9bd}.battle-target span{font:10px system-ui;color:#d5ddc3}.battle-target-health{width:145px;height:6px;background:linear-gradient(90deg,#e88472 var(--hp),#263a3b var(--hp));border-radius:3px}
.battle-party{position:absolute;top:280px;left:20px;width:235px;padding:13px 15px;border:1px solid #d5ad7888;background:#183239f0;border-radius:8px;display:grid;gap:8px}.battle-party strong{font:16px Georgia;color:#f9d5a1}.battle-party span{font:12px/1.5 system-ui;color:#c5d5bf}.battle-party b{font:10px system-ui;color:#a8efc9}
.battle-hitmarker{position:absolute;top:calc(50% - 20px);left:50%;font:40px Georgia;color:#fff4bb;text-shadow:0 0 10px #d0f1af;transform:translate(-50%,-50%);opacity:.85}.battle-hitmarker.shield{color:#94eaff}
.battle-skill-tip{position:absolute;left:50%;bottom:172px;transform:translateX(-50%);width:320px;padding:19px 22px;background:#092933f5;border:1px solid #bcad7888;border-top:2px solid var(--hero-accent);border-radius:6px;box-shadow:0 8px 30px #0006}.battle-skill-tip h3{font:23px Georgia;color:#f2e6c6;margin:9px 0}.battle-skill-tip small{font:11px system-ui;color:#a9d4bd}.battle-skill-tip p{font:13px/1.6 system-ui;color:#c6d8c8;margin:0}
.battle-cast{position:absolute;left:50%;bottom:205px;transform:translateX(-50%);font:600 14px system-ui;color:var(--hero-accent);background:#092933d9;border-bottom:1px solid var(--hero-accent);padding:9px 18px;border-radius:4px;letter-spacing:.04em}
.game-ui .bottom-hud{bottom:23px;padding:14px 18px 34px;gap:22px;background:linear-gradient(135deg,#123739f5,#071f2bf5);border:1px solid #a7a97888;border-top:2px solid #b7b980;box-shadow:0 12px 60px #0009;border-radius:10px;max-width:calc(100vw - 460px);min-height:113px}
.game-ui .player-hud{min-width:240px}.game-ui .hud-portrait{width:67px;height:82px;border-color:#b7b98799;background:radial-gradient(ellipse,#307e6a55,#0a2631)}.game-ui .health-details{min-width:185px}.game-ui #hudChampion{font:20px Georgia;color:#f2e4be}.game-ui #healthText{font-size:11px;color:#e0ebcd}.game-ui .health-track{height:14px;margin:9px 0;box-shadow:inset 0 1px 4px #0008;border-radius:3px;background:repeating-linear-gradient(90deg,#15373b 0 24px,#0a2631 25px 26px)}.game-ui #healthFill{background:linear-gradient(#92f1ae,#39af83);transition:width .10s linear}.game-ui #shieldFill{background:#98e6ef99}.game-ui #statusText{font-size:10px;line-height:1.4;color:#c0d8c5}.game-ui .skill-bar{gap:10px;align-self:center}.game-ui .skill-button{width:58px;height:58px;background:linear-gradient(155deg,#28504c,#0b2632);border:1px solid #a6b78a99;border-radius:7px;box-shadow:inset 0 0 12px #001a28,0 3px 8px #0005;position:relative}.game-ui .skill-button:focus-visible{outline:2px solid #ffdda3;outline-offset:4px}.game-ui .skill-button:hover:not(:disabled){transform:translateY(-3px);border-color:#f1d391}.game-ui .skill-button:active{transform:translateY(1px);box-shadow:inset 0 0 20px #82e7ba55}.game-ui .skill-button kbd{font:700 10px system-ui;bottom:-5px;right:-3px;min-width:19px;padding:3px 5px;background:#e3ce98;color:#163132;border:0;z-index:3;border-radius:3px}.game-ui .skill-button .skill-icon{display:block;width:49px;height:49px;margin:auto}.skill-icon svg{width:100%;height:100%;filter:drop-shadow(0 1px 4px #0008)}.game-ui .skill-button .skill-name{top:calc(100% + 11px);font-size:9px;line-height:1.3;width:70px;color:#cadac4}.game-ui .cooldown-shade{inset:0;border-radius:6px;background:conic-gradient(#03151de8 var(--cooldown-progress),#09293233 0);display:grid;place-items:center;color:#fff1bd;font:700 20px system-ui;z-index:2}.game-ui .cooling .skill-icon{opacity:.5}.game-ui .skill-button.queued{box-shadow:0 0 0 2px #b4f1cc,0 0 22px #71e5b955}.skill-button.skill-ready{animation:ready-glint .55s ease-out}.skill-button.cast-confirmed{animation:skill-cast .38s ease-out}.game-ui .attack-hint{display:none}.game-hint{font-size:10px;max-width:calc(100% - 450px);bottom:4px;left:50%;transform:translateX(-50%);padding:0 8px;color:#c5d7bf;text-shadow:0 2px 4px #00151c}.game-ui .team-hud{width:205px;max-height:235px;overflow:auto;top:85px;font-size:11px}.game-ui .team-member{gap:7px}.game-ui .team-member img{width:25px;height:32px}.game-ui .team-member small{font-size:9px}.game-ui .combat-feed{right:20px;top:95px;font-size:11px;max-width:220px}.game-ui .combat-feed li{padding:9px 12px;margin-bottom:5px;background:#0b2a33dd;border:1px solid #b1b78744;border-radius:4px}
@keyframes battle-reveal{from{opacity:0;transform:translate(-50%,-8px) scale(.94)}to{opacity:1;transform:translate(-50%,0) scale(1)}}
@keyframes ready-glint{0%{box-shadow:0 0 0 2px #d8ffcb,0 0 25px #85eabc}100%{box-shadow:0 0 0 0 transparent}}
@keyframes skill-cast{0%{box-shadow:0 0 35px #f4d79c;transform:scale(.92)}100%{transform:scale(1)}}
@media(max-width:1150px){.game-ui .bottom-hud{max-width:calc(100vw - 250px);gap:15px}.game-ui .player-hud{min-width:190px}.game-ui .health-details{min-width:150px}.game-ui .skill-button{width:51px;height:51px}.game-ui .skill-button .skill-icon{width:45px;height:45px}.game-ui .hud-portrait{width:53px;height:69px}.battle-minimap{width:160px;height:102px;bottom:25px}.game-ui .bottom-hud{left:43%}.battle-identity{left:43%}.game-hint{max-width:calc(100% - 280px);left:43%;white-space:normal;line-height:1.3}}
@media(max-width:800px){.game-ui .bottom-hud{left:50%;max-width:96vw;gap:12px;padding:10px 12px 30px;bottom:29px}.game-ui .player-hud{min-width:130px}.game-ui .health-details{min-width:125px}.game-ui .hud-portrait{display:none}.game-ui .skill-bar{gap:6px}.game-ui .skill-button{width:45px;height:45px}.game-ui .skill-button .skill-icon{width:38px;height:38px}.game-ui .skill-button .skill-name{font-size:8px;width:55px}.battle-minimap{bottom:160px;right:10px;width:125px;height:80px}.battle-identity{left:30%;bottom:150px}.battle-identity strong{font-size:19px}.battle-identity span{font-size:8px}.game-hint{left:50%;max-width:96vw;bottom:2px}.battle-moment{top:85px;min-width:270px;padding:10px 15px}.battle-moment strong{font-size:21px}.battle-target{left:10px;top:165px;transform:scale(.8);transform-origin:left top}.battle-party{top:275px;width:180px}.battle-cast{bottom:190px}.battle-skill-tip{bottom:200px;max-width:85vw}.game-ui .team-hud{display:none}.game-ui .combat-feed{top:90px;font-size:9px;max-width:180px}}
@media(prefers-reduced-motion:reduce){.battle-presentation *,.game-ui .skill-button{animation:none!important;transition:none!important}}

.battle-recap{margin:18px 0;background:#0b2b33;border:1px solid #8da77e55;border-radius:7px;padding:18px}.battle-recap>strong{display:block;font:13px system-ui;letter-spacing:.1em;color:#efd49b;margin-bottom:15px}.battle-recap>div{display:grid;grid-template-columns:45px 1fr;gap:4px 13px;text-align:left;margin:12px 0}.battle-recap img{grid-row:1/4;width:45px;height:65px;object-fit:contain}.battle-recap small{font-size:9px;color:#a6c7b4}.battle-recap b{font:18px Georgia;color:#f0e3bf}.battle-recap span,.battle-recap p{font-size:12px;color:#c1d6bd}.battle-recap p{margin-bottom:0}

.screen-game{height:100dvh;overflow:hidden}
.battle-22 #hitConfirm{display:none}
.battle-target{left:auto;right:22px;top:250px}
body[data-game-mode=training] .battle-target{top:180px}
.battle-party{left:50%;top:112px;transform:translateX(-50%);width:370px;text-align:center}
.battle-moment:not([hidden])~.battle-party{display:none}
@media(max-width:800px){.battle-target{left:auto;right:10px;top:185px;transform-origin:right top}.battle-party{max-width:80vw;top:112px}}

.home-atmosphere{position:fixed;inset:0;pointer-events:none;z-index:1;overflow:hidden}
.home-atmosphere i{position:absolute;left:var(--x);top:var(--y);width:var(--size);height:var(--size);background:#e8d198;border-radius:50%;box-shadow:0 0 8px #d4e19b88;animation:home-firefly var(--duration) ease-in-out var(--delay) infinite alternate}
.screen-game .home-atmosphere,.screen-tavern .home-atmosphere{display:none}
@keyframes home-firefly{0%{transform:translate(0,20px);opacity:0}25%{opacity:.5}70%{opacity:.15}100%{transform:translate(var(--drift),-65px);opacity:0}}
@media(prefers-reduced-motion:reduce){.home-atmosphere{display:none}}

.battle-identity{display:none}.battle-cast{left:auto;right:24px;bottom:182px;transform:none;max-width:240px}.battle-skill-tip:not([hidden])~.battle-cast{display:none}

.announcer-choices{padding:15px;border:1px solid #a8b98b44;border-radius:7px;display:grid;grid-template-columns:1fr 160px;gap:12px;margin:12px 0}.announcer-choices label{display:grid;gap:8px;font:11px system-ui;color:#c1d4c2}.announcer-choices select{max-width:100%;font-size:12px}.announcer-choices small{grid-column:1/-1;color:#b2c5c3;font:11px/1.65 system-ui}.battle-channel{position:absolute;bottom:180px;left:50%;transform:translateX(-50%);padding:11px 22px 15px;background:linear-gradient(90deg,#a78c5c var(--charge),#243b46 var(--charge)) bottom/100% 4px no-repeat,#182b44ef;color:#ffdf9f;border:1px solid #ceb68088;border-radius:7px;font:800 12px system-ui;letter-spacing:.09em}.battle-channel:not([hidden])~.battle-cast{display:none}@media(max-width:600px){.announcer-choices{grid-template-columns:1fr}}

.audio-settings .announcer-choices{grid-column:1/-1;width:100%;box-sizing:border-box}.announcer-choices label{min-width:0}.announcer-choices label select{width:100%}
.game-ui .skill-button[aria-disabled="true"]:hover{cursor:default;transform:none;border-color:#a6b78a99}
.game-ui .skill-button.skill-unavailable .skill-icon{opacity:.45;filter:saturate(.45)}
.skill-button.skill-ready:not(.cooling)[aria-disabled="false"]::after{
 content:"BEREIT";position:absolute;bottom:calc(100% + 6px);left:50%;transform:translateX(-50%);
 padding:2px 5px;border-radius:3px;background:#d9f2bb;color:#163831;font:800 9px/1.25 system-ui;
 opacity:0;pointer-events:none;animation:battle-ready-tag .72s ease-out
}
@keyframes battle-ready-tag{0%,65%{opacity:1}100%{opacity:0}}
.battle-ready-notice{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
#gameUI .progress-hud:has(.battle-stats[open]){z-index:12;opacity:1}
.battle-stats{position:relative;margin-top:7px;font:600 11px/1.4 system-ui;color:#deebdd}
.battle-stats>summary{
 cursor:pointer;width:max-content;max-width:100%;padding:3px 8px;border:1px solid #9ab98c66;
 border-radius:4px;background:#092a35;color:#f0e4ba;letter-spacing:.035em
}
.battle-stats>summary:focus-visible{outline:2px solid #c0eaa2;outline-offset:2px}
.battle-stats-body{
 position:absolute;z-index:5;top:calc(100% + 5px);left:0;width:min(272px,calc(100vw - 26px));
 padding:12px 13px;border:1px solid #9ab98c80;border-radius:7px;background:#0a242ff5;box-shadow:0 6px 22px #0009
}
.battle-stats dl{display:grid;grid-template-columns:1fr auto;gap:5px 12px;margin:0}
.battle-stats dt{color:#b9cec7}.battle-stats dd{margin:0;text-align:right;color:#fff0c4;font-variant-numeric:tabular-nums}
.battle-attack-timing{margin:10px 0 4px;padding-top:7px;border-top:1px solid #95b49a4f;color:#d9f2bb}
.battle-damage-key{margin:4px 0 0;color:#bcc9d6;font-size:10px}
.shop-items .shop-stat-change{grid-column:2;color:#b5ebac;font-variant-numeric:tabular-nums}
.battle-number{
 position:absolute;pointer-events:none;white-space:nowrap;font:800 16px/1.05 system-ui;
 color:#fff0d1;text-shadow:0 2px 3px #07151d,0 0 3px #07151d;-webkit-text-stroke:.25px #10202a;
 font-variant-numeric:tabular-nums
}
.battle-number.outgoing{font-size:22px}.battle-number.incoming{text-shadow:0 2px 3px #301214,0 0 3px #301214}
.battle-number.magic,.battle-hitmarker.magic{color:#ddbbff}
.battle-number.critical,.battle-hitmarker.critical{color:#ffcd5e}.battle-number.critical{font-size:26px;font-weight:950}
.battle-number.shield,.battle-number small{color:#a5ebff}.battle-number.heal{color:#a6f1c7}
.battle-number small{margin-left:5px;font-size:.69em}
@media(min-width:900px){
 html[data-layout=dimensions] body.screen-game:has(#gameUI .battle-stats[open])>.comm-panel{left:318px}
}
@media(max-width:600px){
 .battle-stats-body{width:min(245px,calc(100vw - 22px));padding:9px 10px}
 .battle-number.outgoing{font-size:19px}.battle-number.critical{font-size:22px}
}
@media(prefers-reduced-motion:reduce){.skill-button.skill-ready:not(.cooling)[aria-disabled="false"]::after{animation-timing-function:steps(1,end)}}

.screen-game[data-game-mode="core-heist"] #gameUI:has(#roundBanner:not([hidden])) > :not(#roundBanner),
.screen-game[data-game-mode="core-heist"]:has(#roundBanner:not([hidden])) :is(.comm-panel,.ds-live-note){visibility:hidden}
.screen-game[data-game-mode="core-heist"] #gameUI #roundBanner:not([hidden]){
 top:50%;z-index:45;box-sizing:border-box;width:min(590px,calc(100% - 24px));max-height:calc(100% - 24px);
 padding:clamp(12px,3vh,26px);border:1px solid #dfc08b99;border-radius:10px;background:linear-gradient(145deg,#152039f7,#0b2736fa)
}
.screen-game[data-game-mode="core-heist"] #roundBanner h2{font-size:clamp(23px,4.5vh,42px);margin:6px 0}
.screen-game[data-game-mode="core-heist"] #roundBanner .match-summary{margin:10px 0;padding:9px 0;gap:5px}
.screen-game[data-game-mode="core-heist"] #roundBanner .battle-recap{margin:8px 0;padding:8px}
.screen-game[data-game-mode="core-heist"] #roundBanner .battle-recap>strong{margin-bottom:6px}
.screen-game[data-game-mode="core-heist"] #roundBanner .battle-recap>div{grid-template-columns:30px minmax(0,1fr);gap:2px 7px;margin:4px 0}
.screen-game[data-game-mode="core-heist"] #roundBanner .battle-recap img{width:30px;height:42px}
.screen-game[data-game-mode="core-heist"] #roundBanner #resultActions{margin-top:10px}
.screen-game[data-game-mode="core-heist"] .game-ui .team-hud{padding:10px}
.screen-game[data-game-mode="core-heist"] .game-ui .team-hud p{margin:5px 0}
.screen-game[data-game-mode="core-heist"] .game-ui .team-member{gap:2px 7px;padding:4px 0}
.screen-game[data-game-mode="core-heist"] .game-ui .team-member img{width:22px;height:29px}

/* The health readout, ability tiles and help each occupy their own grid area. */
#gameUI .combat-dock {
 display:grid;
 grid-template-columns:minmax(186px,230px) minmax(245px,320px) max-content;
 align-items:center;
 width:min(748px,calc(100% - 32px));
 max-width:none;
 min-height:0;
 left:50%;
 bottom:10px;
 gap:9px 14px;
 padding:10px 12px 0;
 box-sizing:border-box;
 background:linear-gradient(145deg,#193a3df7,#0b2533fa 58%,#122b3cfa);
 border:1px solid #9d9b767a;
 border-top:2px solid #d5bc82;
 border-radius:12px;
 box-shadow:0 12px 35px #04131ac9,inset 0 1px 0 #f2d49b29;
}
#gameUI .combat-dock .player-hud {
 display:grid;
 grid-template-columns:47px minmax(0,1fr);
 align-items:center;
 gap:10px;
 width:100%;
 min-width:0;
 max-width:none;
}
#gameUI .combat-dock .hud-portrait {
 display:block;
 width:100%;
 height:61px;
 border-radius:8px;
}
#gameUI .combat-dock .health-details {
 min-width:0;
}
#gameUI .combat-dock .health-details>div:first-child {
 flex-wrap:wrap;
 gap:3px 9px;
 margin-bottom:0;
}
#gameUI .combat-dock #hudChampion {
 min-width:0;
 font-size:18px;
 overflow-wrap:anywhere;
}
#gameUI .combat-dock #healthText {
 font:750 12px/1.15 system-ui;
 font-variant-numeric:tabular-nums;
 color:#e8ffd9;
}
#gameUI .combat-dock .health-track {
 height:10px;
 margin:6px 0 4px;
 border:1px solid #9adc9d62;
 border-radius:5px;
}
#gameUI .combat-dock #statusText {
 display:block;
 max-width:none;
 min-height:1.2em;
 margin:0;
 overflow:visible;
 white-space:normal;
 overflow-wrap:anywhere;
 color:#bdcdd2;
}
#gameUI .combat-dock .skill-bar {
 display:grid;
 grid-template-columns:repeat(4,minmax(0,1fr));
 min-width:0;
 gap:6px;
}
#gameUI .combat-dock .auxiliary-bar {
 position:static;
 display:grid;
 grid-template-columns:repeat(2,51px);
 gap:5px;
 padding:0 0 0 9px;
 border:0;
 border-left:1px solid #c5b68d55;
 border-radius:0;
 background:none;
 box-shadow:none;
}
#gameUI .combat-dock :is(.skill-button,.auxiliary-button) {
 display:grid;
 grid-template-rows:minmax(0,1fr) 23px;
 align-items:center;
 width:100%;
 height:69px;
 min-width:0;
 padding:3px 2px 1px;
}
#gameUI .combat-dock .skill-icon {
 width:min(100%,40px);
 height:38px;
 margin:auto;
}
#gameUI .combat-dock .auxiliary-glyph svg {
 width:29px;
 height:29px;
}
#gameUI .combat-dock :is(.skill-button,.auxiliary-button) kbd {
 inset:3px 3px auto auto;
 min-width:0;
 padding:2px 3px;
 transform:none;
 font-size:9px;
}
#gameUI .combat-dock :is(.skill-name,.auxiliary-name) {
 position:static;
 transform:none;
 align-self:end;
 display:block;
 width:auto;
 max-width:none;
 min-width:0;
 padding:0 2px 4px;
 border:0;
 background:none;
 opacity:1;
 white-space:nowrap;
 overflow:hidden;
 text-overflow:ellipsis;
 text-align:center;
 font:650 9px/1.1 system-ui;
 color:#e3ecea;
}
#gameUI .combat-dock :is(.cooldown-shade,.auxiliary-cooldown) {
 bottom:24px;
}
.combat-dock-meta {
 display:flex;
 align-items:center;
 justify-content:space-between;
 grid-column:1/-1;
 min-width:0;
 gap:8px;
 padding:2px 1px 4px;
 border-top:1px solid #a4b7aa48;
}
#gameUI .combat-dock #gameHint {
 position:static;
 flex:1;
 min-width:0;
 transform:none;
 max-width:none;
 margin:0;
 padding:2px 0;
 color:#cfddde;
 font:600 10px/1.4 system-ui;
 white-space:normal;
 text-align:left;
}
#gameUI .combat-dock #gameControlsQuick {
 flex:none;
 min-height:24px;
 padding:2px 7px;
 background:transparent;
 color:inherit;
 border:1px solid #c5ae7466;
 border-radius:5px;
 font:650 10px/1.2 system-ui;
}
#gameUI .combat-dock #gameControlsQuick:hover {border-color:#efc884}
html[data-device-layout=mobile] .combat-dock-meta {display:none}
#gameUI .battle-presentation > .battle-minimap {
 position:absolute;
 display:grid;
 grid-template-rows:minmax(0,1fr) auto;
 box-sizing:border-box;
 padding:3px;
 overflow:hidden;
 background:#15262c;
 color:#f2dec2;
 text-align:start;
 pointer-events:auto;
}
#gameUI .battle-minimap:disabled {pointer-events:none;opacity:1}
#gameUI .battle-minimap:focus-visible {outline:2px solid #ffe1a5;outline-offset:3px}
.battle-map-canvas {display:block;width:100%;height:100%;min-height:0;object-fit:contain;border-radius:4px}
.battle-map-label {padding:1px 4px;font:750 9px/1.2 system-ui}
html[data-device-layout=mobile] #gameUI .battle-map-label {font-size:8px}
}
@media(max-width:1100px) and (min-width:861px) {
 #gameUI .combat-dock {left:46%;width:min(700px,calc(100% - 200px))}
}
@media(max-width:860px) {
 #gameUI .combat-dock {
  grid-template-columns:minmax(0,1fr) max-content;
  width:min(500px,calc(100% - 26px));
  gap:7px 9px;
  padding:7px 9px 0;
 }
 #gameUI .combat-dock .player-hud {
  grid-column:1/-1;
  grid-template-columns:34px minmax(0,1fr);
 }
 #gameUI .combat-dock .hud-portrait {height:42px}
 #gameUI .combat-dock .auxiliary-bar {grid-template-columns:repeat(2,minmax(0,45px));padding-left:6px}
 #gameUI .combat-dock :is(.skill-button,.auxiliary-button) {height:60px}
}

.battle-rosters {display:none}
@media (min-width:801px) {
 html:not([data-device-layout=mobile]) #gameUI .battle-rosters:not([hidden]) {display:block}
 html:not([data-device-layout=mobile]) #gameUI.battle-rosters-active #teamMembers {display:none}
 html:not([data-device-layout=mobile]) #gameUI.battle-rosters-active :is(.progress-hud,.team-hud) {top:136px}
 html:not([data-device-layout=mobile]) #gameUI.battle-rosters-active .combat-feed {right:238px;top:135px}
 html:not([data-device-layout=mobile]) #gameUI.battle-rosters-active .upgrade-panel {
  top:244px;
  max-height:max(100px,calc(100% - 400px));
 }

 .battle-rosters {
  position:absolute;
  inset:0;
  pointer-events:none;
  --roster-portrait-size:clamp(30px,3.1vw,40px);
 }
 .battle-roster {
  position:absolute;
  top:68px;
  left:24px;
  display:grid;
  justify-items:start;
  gap:4px;
  color:#d3f4e7;
  --roster-border:#83bbae;
 }
 .battle-roster-enemy {
  right:24px;
  left:auto;
  justify-items:end;
  color:#ffe1d3;
  --roster-border:#d28a77;
 }
 .battle-roster-heading {
  padding:2px 6px;
  border-radius:3px;
  background:#101c24f5;
  font:750 10px/1.2 system-ui;
  letter-spacing:.045em;
 }
 .battle-roster ul {display:flex;gap:4px;margin:0;padding:0;list-style:none}
 .battle-roster-portrait {
  position:relative;
  width:var(--roster-portrait-size);
  height:var(--roster-portrait-size);
  box-sizing:border-box;
  overflow:hidden;
  border:1px solid var(--roster-border);
  border-radius:4px;
  background:linear-gradient(150deg,#294454,#101924);
  box-shadow:0 2px 7px #090c12b0;
 }
 .battle-roster-enemy .battle-roster-portrait {background:linear-gradient(150deg,#49333b,#231821)}
 .battle-roster-portrait img {display:block;width:100%;height:100%;object-fit:cover}
 .battle-roster-portrait.battle-roster-self {border-color:#ffe2a1}
 .battle-roster-fallen img {filter:grayscale(1) brightness(.53)}
 .battle-roster-health {
  position:absolute;
  inset:auto 0 0;
  height:4px;
  background:linear-gradient(90deg,#85e2ad var(--roster-hp,0%),#10212c var(--roster-hp,0%));
 }
 .battle-roster-status:not([hidden]) {
  position:absolute;
  inset:auto 1px 5px;
  text-align:center;
  padding:1px 0;
  border-radius:2px;
  background:#141c28f2;
  color:#fff2cf;
  font:750 9px/1.2 system-ui;
  white-space:nowrap;
 }
}

@media (min-width:801px) and (max-width:1000px) {
 .battle-roster {top:76px}
 .battle-roster-enemy {right:64px}
}

.skill-slot {
 position:relative;
 display:grid;
 align-self:end;
 min-width:0;
}
#gameUI .skill-slot > .skill-rank-plus {
 position:absolute;
 z-index:3;
 inset:0 0 auto;
 translate:0 calc(-100% - 4px);
 width:32px;
 height:30px;
 margin-inline:auto;
 padding:0;
 font:800 21px/1 system-ui;
}
.skill-slot > .skill-rank-plus,
.mobile-rank-strip > .skill-rank-plus {
 border:1px solid var(--arena-gold,#ead39a);
 border-radius:5px;
 background:#ffe29a;
 color:#322014;
 box-shadow:0 2px 10px #0009;
 animation:skill-rank-appear .24s ease-out both;
}
.skill-rank-plus[hidden] {display:none !important}
.skill-rank-plus:not(:disabled):hover {background:#fff2cb}
.skill-rank-plus:focus-visible {outline:2px solid #fff7dc;outline-offset:2px}
.skill-rank-plus:disabled {opacity:.65}
@keyframes skill-rank-appear {
 from {opacity:0;transform:translateY(4px)}
 to {opacity:1;transform:translateY(0)}
}
@media (prefers-reduced-motion:reduce) {
 .skill-rank-plus {animation:none !important}
}

html:not([data-device-layout=mobile]) body.screen-game #gameUI .battle-stats-body{
 left:var(--comm-stats-left,0px);top:var(--comm-stats-top,calc(100% + 5px));
 max-width:var(--comm-stats-width,none);max-height:var(--comm-stats-height,none);overflow:auto;
}
