.side-battle{padding:18px;background:linear-gradient(160deg,#202b48,#11172d 65%)}
.battle-layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:16px;align-items:start}.battle-layout .combat-arena{grid-column:1;grid-row:1;min-width:0}
.battle-supplement{margin-top:16px}
.battle-console{grid-column:2;grid-row:1;position:sticky;top:14px;z-index:25;min-width:0;padding:14px;border:1px solid var(--line);border-radius:10px;background:#141c33;box-shadow:0 6px 20px #0004}
.battle-party-heading{font-size:.8rem;color:var(--cyan);margin-bottom:8px}
.battle-party{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.actor-choice{min-width:0;min-height:54px;padding:7px 3px;border:1px solid var(--line);border-radius:6px;background:#24334d;color:var(--ink);font:inherit;cursor:pointer}
.actor-choice strong,.actor-choice span{display:block;font-size:.8rem;overflow-wrap:anywhere}
.actor-choice span{font-size:.7rem;color:var(--muted);margin-top:4px}
.actor-choice[aria-pressed=true]{border-color:var(--gold);background:#4b402b}
.actor-choice[aria-pressed=true] span{color:var(--gold)}
.actor-choice:disabled{opacity:.48;cursor:default}
.actor-choice:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.party-picker-hint{font-size:.72rem;color:var(--muted);line-height:1.5;margin:7px 0 14px}
.stage-fighter.hero-side:not(:disabled){cursor:pointer}
.stage-fighter.has-acted:not(.performing):not(.supporting):not(.taking-hit):not(.receiving-heal) .sprite-motion{opacity:.48;filter:grayscale(.65)}
.fighter-action-state{position:absolute;bottom:-14px;font-size:.7rem;line-height:14px;color:#c0cce1;background:#101a2be6;border-radius:3px;padding:0 7px}
.current .fighter-action-state{color:var(--gold)}
.enemy-intent-panel{margin:0 0 14px;padding:12px;border:1px solid #b7688266;border-radius:8px;background:#271f32}
.enemy-intent-panel h3{display:flex;justify-content:space-between;gap:10px;margin:0 0 8px;font-size:.875rem;color:#ffacc5}
.enemy-intent-panel h3 small{color:var(--muted);font-size:.75rem;font-weight:400}
.enemy-intent-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.enemy-intent{display:grid;gap:4px;align-content:start;padding:8px;border-radius:5px;background:#15182b;overflow-wrap:anywhere}
.enemy-intent strong{font-size:.78rem;color:#d6dced}.enemy-intent>span{font-size:.875rem;color:#ffb4c9;font-weight:700}
.enemy-intent small{font-size:.72rem;color:var(--cyan)}.enemy-intent.intent-done{opacity:.55}
.enemy-intent-panel>p{margin:8px 0 0;color:var(--muted);font-size:.72rem;line-height:1.5}
.incoming-mark{position:absolute;top:5px;right:0;padding:3px 6px;border:1px solid #ff9eb5;border-radius:5px;background:#482236f2;color:#ffe0e9;font-size:.72rem;line-height:1.4;pointer-events:none}
.enemy-aim{color:#ffb4c9;white-space:nowrap}
@media(max-width:540px){.enemy-intent-panel{padding:9px}.enemy-intent-list{gap:5px}.enemy-intent{padding:6px}.enemy-intent>span{font-size:.78rem}}
.battle-targets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-top:12px}.target-choice{min-width:0;min-height:58px;padding:7px 4px;border:1px solid var(--line);border-radius:6px;background:#23304a;color:var(--ink);cursor:pointer}.target-choice strong{display:block;font-size:.875rem;overflow-wrap:anywhere}.target-choice small{display:block;font-size:.75rem;color:#d1d8e8;margin-top:4px}.target-choice[aria-pressed=true]{border-color:var(--pink);background:#502c47;box-shadow:inset 0 0 0 1px var(--pink)}.target-choice:disabled{cursor:default;opacity:.55}.target-choice:focus-visible,.action-buttons button:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.battle-heading{display:flex;justify-content:space-between;align-items:center;gap:12px}.battle-heading h2{font-size:1.25rem;margin:4px 0 12px}
.command-picker{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-top:14px}.command-picker button{min-height:44px;padding:8px;border:1px solid #7585a366;border-radius:7px;background:#222e48;color:#dce4f5;font:inherit;cursor:pointer}.command-picker button[aria-pressed=true]{background:#364764;border-color:var(--gold);color:#fff3cf;box-shadow:inset 0 -2px var(--gold)}.command-picker button:focus-visible,.execute-action:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.target-section{margin-top:20px}.target-section h3{font-size:.875rem;font-weight:500;color:var(--muted);margin:0 0 7px}.target-section .battle-targets{margin-top:0}.action-preview{margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}.action-preview-heading h3{font-size:1.05rem;line-height:1.5;margin:0 0 5px;color:var(--ink)}.action-preview-heading>span{font-size:.875rem;color:var(--muted)}.action-preview .action-recipient{margin:14px 0 6px;color:var(--cyan);font-size:.875rem;line-height:1.5}.action-effect{font-size:1rem;line-height:1.65;margin:0}.action-details{font-size:.875rem;line-height:1.6;color:var(--muted);margin-top:10px}.action-details summary{cursor:pointer;padding:4px 0}.action-details p{margin:4px 0 0}.execute-action{width:100%;min-height:48px;margin-top:18px;padding:10px 14px;border:1px solid #ffbbd399;border-radius:8px;background:#933b61;color:white;font:inherit;font-weight:800;cursor:pointer}.execute-action:disabled{opacity:.45;cursor:default}.skill-empty{color:#ffd18b;font-size:.875rem;line-height:1.6}.action-pending{margin:18px 0 4px;color:var(--muted);line-height:1.6}
.battle-history{display:flex;align-items:baseline;gap:12px;margin:0 0 16px;padding:10px 12px;background:#0f1729;border-radius:7px}.battle-history>span{flex-shrink:0;font-size:.75rem;color:var(--muted)}.battle-history .battle-announcement{margin:0;padding:0;min-height:0;border:0;background:none;font-size:.875rem;line-height:1.6}
.combat-arena{--sprite-height:180px;--fighter-height:236px;--lane-step:245px;height:785px;position:relative;isolation:isolate;container-type:inline-size;overflow:hidden;border-radius:12px;border:1px solid #63718d55;background:radial-gradient(ellipse at 50% 80%,#58547755,transparent 68%),linear-gradient(#111829 0%,#293451 48%,#242e40 49%,#182335 100%)}
.combat-arena:is(.battlefield-seventh-street,.battlefield-seventh-hq,.battlefield-canal-quay,.battlefield-canal-gate,.battlefield-garden,.battlefield-village,.battlefield-rescue,.battlefield-capital,.battlefield-castle){background-color:#202b3c;background-image:linear-gradient(180deg,#111b2c26,#111b2c45 38%,#101a2a66),var(--battlefield-image,url('./assets/seventh-street.png'));background-size:100% 100%,cover;background-position:center,center top;background-repeat:no-repeat}
.battlefield-seventh-hq{--battlefield-image:url('./assets/seventh-hq.png')}
.battlefield-canal-quay{--battlefield-image:url('./assets/canal-quay.png')}
.battlefield-canal-gate{--battlefield-image:url('./assets/canal-gate.png')}
:is(.battlefield-seventh-street,.battlefield-seventh-hq,.battlefield-canal-quay,.battlefield-canal-gate,.battlefield-garden,.battlefield-village,.battlefield-rescue,.battlefield-capital,.battlefield-castle) .arena-caption{background:#0f192cbd;color:#e0e9f5}
.arena-caption{display:flex;justify-content:space-between;padding:12px 18px;color:#b5c7e6;font-size:.875rem;letter-spacing:.14em;border-bottom:1px solid #8295b222}
.stage-fighter{position:absolute;top:calc(44px + var(--lane)*var(--lane-step));width:30%;height:var(--fighter-height);display:flex;flex-direction:column;align-items:center;justify-content:end;padding:0;border:0;background:transparent;color:var(--ink);transition:top calc(.18s / var(--battle-speed,1)),left calc(.18s / var(--battle-speed,1)),right calc(.18s / var(--battle-speed,1));z-index:calc(2 + var(--lane));font:inherit}
.stage-fighter.hero-side{left:calc(6% + var(--depth)*3%)}.stage-fighter.enemy-side{right:calc(6% + var(--depth)*3%);cursor:pointer}
.stage-fighter:disabled{opacity:1;filter:none}.stage-fighter:focus-visible{outline:2px solid var(--gold);outline-offset:2px;border-radius:8px}
.sprite-motion{display:flex;width:100%;height:var(--sprite-height);flex-shrink:0;justify-content:center;transform-origin:50% 95%;animation:sprite-breathe calc(2.8s / var(--battle-speed,1)) ease-in-out infinite;animation-delay:calc(var(--depth)*-.7s)}
.sprite-window{display:block;position:relative;height:100%;overflow:hidden;flex-shrink:0;filter:drop-shadow(0 6px 3px #0006)}.sprite-window img{position:absolute;top:0;height:auto;max-width:none;image-rendering:pixelated;pointer-events:none;user-select:none}
.sprite-window.boss-sprite{aspect-ratio:2/3}/* Rose has almost no outer padding; align her visible height and feet with the atlas sprites. */
.sprite-window.boss-sprite img{width:100%;height:80%;top:10%;left:0;object-fit:contain}
.enemy-side .sprite-window.garden-character img{transform:scaleX(-1)}
.lizette-pose{aspect-ratio:672/560;image-rendering:pixelated;transform-origin:37.2% 96.4%;pointer-events:none}.pose-crop{position:absolute;display:block;overflow:hidden}
.has-poses.performing .sprite-motion,.has-poses.fallen .sprite-motion{animation:none;transform:none}
.has-poses.pose-windup .sprite-window{animation:lizette-windup calc(.38s / var(--battle-speed,1)) ease-out both}
.has-poses.pose-strike .sprite-window{animation:lizette-swing calc(.14s / var(--battle-speed,1)) ease-in both}
.has-poses.pose-strike.action-impact .sprite-window{animation:none;transform:translateX(18px)}
.has-poses.pose-hurt .sprite-motion,.has-poses.pose-collapse .sprite-motion,.has-poses.pose-down .sprite-motion{animation:none;translate:0}
.stage-fighter.has-poses.fallen{opacity:.8;filter:saturate(.65)}
.has-poses.pose-collapse .sprite-window{animation:lizette-collapse calc(.42s / var(--battle-speed,1)) ease-out both}
.has-poses.pose-down .sprite-window{filter:drop-shadow(0 3px 3px #0007)}
.unit-plate{display:block;width:100%;max-width:175px;padding:5px 9px;background:#0a102bd9;border:1px solid #8795b74d;border-radius:6px;text-align:center;box-shadow:0 4px 8px #0004}
.unit-plate strong{font-size:.875rem;display:block}.unit-plate small{font-size:12px;color:#c7d2e6;display:block;white-space:nowrap}
.stage-hp{height:5px;display:block;background:#0006;margin:3px 0;border-radius:5px;overflow:hidden}.stage-hp i{display:block;height:100%;background:linear-gradient(90deg,#52bda7,#96f1c4);transition:width calc(.25s / var(--battle-speed,1))}.enemy-side .stage-hp i{background:linear-gradient(90deg,#e05274,#ffa091)}
.current .unit-plate{border-color:var(--gold);box-shadow:0 0 15px #ffce6644}.current .sprite-motion{translate:10px 0}
.chosen .unit-plate{border-color:var(--pink);box-shadow:0 0 0 2px #ff74a633}.chosen .unit-plate strong::before{content:'▸ ';color:var(--pink)}
.performing .sprite-motion{animation:hero-strike calc(.65s / var(--battle-speed,1)) ease-in-out both}.enemy-side.performing .sprite-motion{animation:enemy-strike calc(.65s / var(--battle-speed,1)) ease-in-out both}
.supporting .sprite-motion{animation:heal-glow calc(.65s / var(--battle-speed,1)) ease-out both}
.stage-fighter.intercepting{left:31%;z-index:10}.intercepting .sprite-motion{animation:guard-step calc(.4s / var(--battle-speed,1)) ease-out both}
.shielded .sprite-window{filter:drop-shadow(0 0 6px #72dff9)}.taking-hit .sprite-window{animation:impact calc(.45s / var(--battle-speed,1)) ease-in-out}.receiving-heal .sprite-window{animation:heal-glow calc(.65s / var(--battle-speed,1)) ease-out}
.stage-fighter.fallen{opacity:.38;filter:grayscale(.8)}.fallen .sprite-motion{animation:none;transform:translateY(12px) rotate(-12deg)}
.floating-number{position:absolute;top:22px;left:48%;z-index:20;color:#fff1bf;font-size:1.8rem;font-weight:1000;text-shadow:2px 2px #351424,-2px -2px #351424;animation:damage-rise calc(.75s / var(--battle-speed,1)) ease-out both;pointer-events:none}.heal-number{color:#8effb3}
.cover-label{position:absolute;top:10px;color:#a4edff;background:#16334c;border:1px solid #6fdef6;padding:4px 8px;font-size:.875rem;border-radius:4px;z-index:11}
.brave-title{position:absolute;left:15%;right:15%;top:42%;z-index:15;padding:13px;text-align:center;font-size:1.75rem;color:#fff3c5;font-weight:900;background:linear-gradient(90deg,transparent,#293568f0,transparent);pointer-events:none;animation:brave-reveal calc(.5s / var(--battle-speed,1)) both}.brave-title small{display:block;font-size:.875rem;margin-top:6px}.brave-scene .combat-arena{box-shadow:inset 0 0 50px #91b8ff44}
.battle-announcement{min-height:60px;padding:12px 14px;display:flex;align-items:center;font-size:1rem;background:#080d20;border-left:3px solid var(--gold);margin-top:12px;line-height:1.5}
.battle-controls{margin-top:12px}.turn-speaker strong{color:var(--cyan)}.turn-speaker p{margin:5px 0;font-size:.875rem;line-height:1.6;color:#ccd5e9}
.action-buttons{display:grid;grid-template-columns:1fr 1.5fr 1fr;gap:8px}.action-buttons button{border:1px solid #9ab4d533;border-radius:8px;background:#31415e;color:#fff;padding:10px 5px;cursor:pointer;font-size:.95rem;font-weight:800;min-height:65px}.action-buttons .special-action{background:#7e3657;border-color:#ff9dbc55}.action-buttons button small{display:block;font-size:12px;color:#d0d9ea;margin-top:5px}.action-buttons button:hover:not(:disabled){filter:brightness(1.18)}
.target-help{color:var(--muted);font-size:.875rem;margin:12px 0 0}
.skill-help{margin-top:10px;padding:10px;border:1px solid #ff9dbc66;border-radius:8px;background:#2d213b}.skill-help-title{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline}.skill-help-title strong{font-size:1rem;color:#ffbbd3}.skill-help-title span{font-size:.875rem;color:#f7da93}.skill-help p{font-size:.875rem;line-height:1.55;margin:5px 0}.skill-help .skill-target{color:#9eeaf0}.skill-help small{display:block;font-size:.875rem;line-height:1.5;color:#c5cbe0}.skill-help .skill-empty{color:#ffcf85;font-weight:700}.guard-help{margin:8px 0 0;font-size:.875rem;line-height:1.5;color:#c5cbe0}.unit-plate{position:relative}.unit-buffs{position:absolute;bottom:calc(100% + 4px);left:50%;transform:translateX(-50%);white-space:nowrap;font-size:.75rem;color:#bdf2ff;background:#113b50;border:1px solid #79cadd88;border-radius:4px;padding:3px 5px}
@media(max-width:899px){.battle-console{max-height:calc(100svh - 160px);overflow-y:auto}.skill-help{margin-top:7px;padding:7px 9px}.skill-help p{margin:3px 0}}
.victory-stage{max-width:950px;margin:20px auto;padding:28px;text-align:center}.victory-stage h2{font-size:clamp(1.5rem,4vw,2.5rem);margin:8px 0}.victory-quote{color:#c5d3e8;line-height:1.65}.victory-lineup{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:22px 0}.victory-member{min-width:0;background:#111a2a;border:1px solid #58708a66;border-radius:10px;padding:15px 8px}.victory-member.leveled{border-color:var(--gold);background:linear-gradient(#34425a,#161e2f)}.victory-sprite{height:210px;display:flex;justify-content:center;animation:victory-bounce calc(1.8s / var(--battle-speed,1)) infinite;animation-delay:calc(var(--depth)*.2s)}.victory-member h3{margin:8px 0}.victory-member p{margin:8px 0}.level-gain,.next-level{display:block;font-size:.875rem;line-height:1.6}.level-gain{color:var(--gold);font-weight:800}.next-level{color:var(--muted)}.victory-money{color:var(--gold);font-weight:800}
@keyframes sprite-breathe{50%{transform:translateY(-3px) rotate(.5deg)}}
@keyframes lizette-windup{from{transform:translateX(0) rotate(0)}to{transform:translateX(-7px) rotate(-3deg)}}
@keyframes lizette-swing{from{transform:translateX(-7px)}to{transform:translateX(18px)}}
@keyframes lizette-collapse{from{transform:translateY(-5px)}to{transform:translateY(0)}}
@keyframes hero-strike{0%{transform:translateX(0) rotate(-4deg)}45%,65%{transform:translateX(45px) rotate(8deg)}100%{transform:translateX(15px)}}
@keyframes enemy-strike{45%,65%{transform:translateX(-40px) rotate(-7deg)}}
@keyframes guard-step{from{transform:translateX(-35px)}to{transform:translateX(0)}}
@keyframes impact{0%,60%{filter:brightness(2) drop-shadow(0 0 6px #ff5a79);transform:translateX(5px)}30%,80%{transform:translateX(-4px)}}
@keyframes heal-glow{50%{filter:brightness(1.35) drop-shadow(0 0 10px #7dffb1)}}
@keyframes damage-rise{from{opacity:0;transform:translateY(12px)}20%{opacity:1}to{opacity:1;transform:translateY(-25px)}}
@keyframes brave-reveal{from{opacity:0;translate:-20px 0}to{opacity:1;translate:0}}
@keyframes victory-bounce{50%{transform:translateY(-7px)}}
@media(min-width:900px){.combat-arena{--sprite-height:210px;--fighter-height:266px;--lane-step:275px;height:875px}}
@media(max-width:899px){.battle-layout{display:flex;flex-direction:column;gap:12px}.battle-console{width:100%;top:0;padding:10px}.battle-layout .combat-arena{width:100%}.battle-console .turn-speaker p,.battle-console .target-help{display:none}.battle-targets{margin-top:7px}.battle-controls{margin-top:7px}.battle-console .battle-announcement{font-size:.875rem;min-height:44px;margin-top:7px;padding:7px 9px}.battle-console .action-buttons button{min-height:52px;padding:6px 4px}}
@media(max-width:899px){.battle-console.is-playing{display:none}}
@media(max-height:600px){.battle-console{position:static}}
@media(max-width:540px){.side-battle{padding:10px}.combat-arena{--sprite-height:155px;--fighter-height:211px;--lane-step:220px;height:710px}.stage-fighter{width:40%}.stage-fighter.hero-side{left:calc(1% + var(--depth)*2%)}.stage-fighter.enemy-side{right:calc(1% + var(--depth)*2%)}.unit-plate{padding:4px}.unit-plate strong{font-size:.8rem}.battle-controls{grid-template-columns:1fr}.brave-title{left:0;right:0;font-size:1.4rem}.stage-fighter.intercepting{left:22%}.victory-stage{padding:18px 10px}.victory-lineup{gap:5px}.victory-member{padding:10px 3px}.victory-sprite{height:120px}.victory-member h3{font-size:.875rem}.level-gain,.next-level{font-size:12px}.battle-heading h2{font-size:1.05rem}.action-buttons button{font-size:.875rem}}
@media(prefers-reduced-motion:reduce){.side-battle *,.victory-stage *{animation:none!important;transition:none!important}.floating-number{opacity:1}.current .sprite-motion{translate:0}}

/* Action sheets own the gesture; keep the body anchor stable between cells. */
.party-pose{aspect-ratio:672/560;pointer-events:none}
.has-party-poses .sprite-motion{animation:none;transform:none}
.has-party-poses.pose-windup .party-pose{animation:party-ready calc(.38s / var(--battle-speed,1)) ease-out both}
.has-party-poses.pose-strike .party-pose{animation:party-release calc(.14s / var(--battle-speed,1)) ease-out both}
.has-party-poses.pose-supportRelease .party-pose{filter:drop-shadow(0 0 8px #82dccb66)}
.has-party-poses.pose-recover .party-pose{animation:party-recover calc(.3s / var(--battle-speed,1)) ease-out both}
.stage-boss-motion .party-pose{transform:scaleX(-1);overflow:visible}
.stage-boss-motion.pose-windup .party-pose{animation:stage-boss-ready calc(.42s / var(--battle-speed,1)) ease-out both}
.stage-boss-motion.pose-strike .party-pose{animation:stage-boss-attack calc(.14s / var(--battle-speed,1)) ease-out both}
.stage-boss-motion.pose-strike.action-impact .party-pose{animation:none;translate:-6px 0}
.stage-boss-motion.pose-recover .party-pose{animation:stage-boss-return calc(.35s / var(--battle-speed,1)) ease-out both}
@keyframes stage-boss-ready{from{translate:0}to{translate:4px 0}}
@keyframes stage-boss-attack{from{translate:4px 0}to{translate:-6px 0}}
@keyframes stage-boss-return{from{translate:-6px 0}to{translate:0}}
@media(prefers-reduced-motion:reduce){.stage-boss-motion .party-pose{translate:0!important}}
@keyframes party-ready{from{translate:0}to{translate:-4px 0}}
@keyframes party-release{from{translate:-4px 0}to{translate:6px 0}}
@keyframes party-recover{from{translate:6px 0}to{translate:0}}
@media(prefers-reduced-motion:reduce){.has-party-poses *{animation:none!important;transition:none!important}}

/* Sion: a grounded crouch, a short knife dash, then a quiet landing. */
.assassin-motion{--sion-direction:1;--sion-reach:34px;z-index:12}
.assassin-motion.enemy-side{--sion-direction:-1}
.assassin-motion.assassin-skill{--sion-reach:52px}
.assassin-motion.performing .sprite-motion{position:relative;animation:none;transform:none}
.assassin-motion.enemy-side .party-pose{transform:scaleX(-1)}
.assassin-motion.pose-windup .party-pose{animation:sion-ready calc(.32s / var(--battle-speed,1)) ease-out both}
.assassin-motion.assassin-skill.pose-windup .party-pose{animation:sion-vanish calc(.32s / var(--battle-speed,1)) ease-in both}
.assassin-motion.pose-strike .party-pose{animation:sion-dash calc(.14s / var(--battle-speed,1)) cubic-bezier(.1,.7,.2,1) both}
.assassin-motion.pose-strike.action-impact .party-pose{animation:none;translate:calc(var(--sion-direction)*var(--sion-reach)) 0}
.assassin-motion.pose-recover .party-pose{animation:sion-return calc(.3s / var(--battle-speed,1)) ease-out both}
.sion-echo{position:absolute;inset:0;display:flex;justify-content:center;pointer-events:none;opacity:.3;filter:sepia(.7) saturate(2) hue-rotate(190deg)}
.sion-echo.echo-1{margin-left:-24px;margin-right:24px;opacity:.22}
.sion-echo.echo-2{margin-left:-48px;margin-right:48px;opacity:.1}
.action-impact .sion-echo{animation:sion-echo-fade calc(.3s / var(--battle-speed,1)) ease-out both}
.sion-cut{position:absolute;top:33%;left:12%;width:85%;height:3px;background:linear-gradient(90deg,transparent,#f6eaff 25%,#fff 60%,transparent);box-shadow:0 0 8px #b99aff;rotate:-28deg;pointer-events:none;animation:sion-cut calc(.3s / var(--battle-speed,1)) ease-out both}
.assassin-skill-hit .sion-cut::after{content:'';position:absolute;inset:0;background:inherit;box-shadow:inherit;rotate:58deg}
@keyframes sion-ready{from{translate:0 0}to{translate:calc(var(--sion-direction)*-7px) 2px}}
@keyframes sion-vanish{0%,55%{opacity:1;translate:0 0}100%{opacity:0;translate:calc(var(--sion-direction)*-12px) 2px}}
@keyframes sion-dash{from{opacity:.25;translate:calc(var(--sion-direction)*-10px) 2px}to{opacity:1;translate:calc(var(--sion-direction)*var(--sion-reach)) 0}}
@keyframes sion-return{from{translate:calc(var(--sion-direction)*var(--sion-reach)) 0}to{translate:0 0}}
@keyframes sion-echo-fade{to{opacity:0}}
@keyframes sion-cut{from{opacity:1;scale:.4 1}45%{opacity:1;scale:1 1}to{opacity:0;scale:1.12 1}}
@media(max-width:540px){.assassin-motion{--sion-reach:24px}.assassin-motion.assassin-skill{--sion-reach:34px}}
@media(prefers-reduced-motion:reduce){.assassin-motion .party-pose{translate:0 0!important;opacity:1}.sion-echo,.sion-cut{display:none}}

.battlefield-garden{--battlefield-image:url('./assets/garden-battle.png')}
.battlefield-rescue{--battlefield-image:url('./assets/prison-battle.png')}
.battlefield-rescue .arena-caption{background:#0f192cbd;color:#e0e9f5}
.commander-objective{padding:12px 16px;border:1px solid #d9c08388;border-radius:7px;background:#352e25;color:#ffe3a0;line-height:1.7;font-size:1rem}

.auto-battle-badge{flex-shrink:0;border:1px solid #ff96b5;border-radius:6px;padding:6px 10px;color:#ffd1df;background:#49233c;font-size:.875rem}.ambush-status{font-size:1rem;line-height:1.7}.ambush-status strong{color:var(--pink)}.ambush-status span{color:var(--gold)}.ambush-status p{color:var(--muted);margin:10px 0}

.battlefield-village{--battlefield-image:url('./assets/village-battle.png')}

.enemy-intent .enemy-role-hint{color:#c4cce0;line-height:1.55;font-weight:400}
.enemy-intent.intent-danger{box-shadow:inset 0 0 0 1px #ffb06e;background:#332331}
@media(max-width:540px){.enemy-intent-list:has(.enemy-role-hint){grid-template-columns:1fr}.enemy-intent:has(.enemy-role-hint){padding:9px}}

.battlefield-capital{--battlefield-image:url('./assets/capital-battle.png')}
.battlefield-castle{--battlefield-image:url('./assets/castle-battle.png')}
.enemy-side .sprite-window.general-character img{transform:scaleX(-1)}

/* Graus: planted charge, heavy cut, then a deliberate return. */
.stage-fighter.general-boss{--general-reach:42px;--general-scale:1.4;right:18%;width:32%}.general-boss:not(.graus-unleashed){top:calc(44px + var(--lane-step) + var(--sprite-height)*.3)}.stage-fighter.graus-escort{right:2%;width:28%}
.general-boss .party-pose{transform:scaleX(-1);overflow:visible}
/* Match the shared enemy attack selector specificity: it otherwise restores a -7deg tilt. */
.stage-fighter.general-boss .sprite-motion{animation:none;transform:none;translate:0 0;rotate:none;scale:var(--general-scale);transform-origin:50% 90%;pointer-events:none}
.general-boss.performing{z-index:14}
/* Keep facing transforms intact: the shared impact keyframes overwrite transform. */
.stage-fighter.general-boss .sprite-window{animation:none;translate:0 0;rotate:none}
.stage-fighter.general-boss.taking-hit .sprite-window{animation:graus-damage-flash calc(.45s / var(--battle-speed,1)) ease-in-out}
.general-boss.general-charged:not(.performing) .party-pose{animation:none;filter:drop-shadow(0 0 7px #dc7e4277)}
.general-boss.general-charging .party-pose{animation:none;translate:0 0;filter:brightness(1.1) drop-shadow(0 0 7px #dc7e4266)}
.general-technique{position:absolute;left:30%;right:34%;top:12px;z-index:16;text-align:center;pointer-events:none;padding:8px 12px;color:#ffe0a1;font-size:1.3rem;letter-spacing:.08em;font-weight:800;background:linear-gradient(90deg,transparent,#2e1726ed 20%,#2e1726ed 80%,transparent);border-block:1px solid #da936655}
.general-technique small{display:block;font-size:.875rem;color:#e5b99f;letter-spacing:.12em;margin-bottom:3px}
.general-scene{box-shadow:inset 0 0 65px #a5482633}
.general-impact{animation:none;translate:0 0}
.general-cut{position:absolute;pointer-events:none;top:32%;left:8%;width:88%;height:7px;background:linear-gradient(90deg,transparent,#fff0cd 28%,#efb671 70%,transparent);box-shadow:0 0 10px #e78649;rotate:58deg;z-index:17;animation:general-cut calc(.3s / var(--battle-speed,1)) ease-out both}
.general-hit .sprite-window{animation:general-recoil calc(.3s / var(--battle-speed,1)) ease-out both}
@keyframes general-cut{from{opacity:1;scale:.3 1}45%{opacity:1;scale:1 1}to{opacity:0;scale:1.15 1}}
@keyframes general-recoil{30%{filter:brightness(1.25)}100%{filter:brightness(1)}}
@keyframes graus-damage-flash{0%,60%{filter:brightness(1.7) drop-shadow(0 0 6px #ff5a79)}30%,80%{filter:brightness(1)}}
@media(max-width:540px){.stage-fighter.general-boss{--general-reach:24px}.stage-fighter.graus-escort{right:1%;width:36%}.general-technique{left:30%;right:30%;font-size:1rem;padding:6px 2px}.general-technique small{font-size:.75rem}}
@media(prefers-reduced-motion:reduce){.general-boss .party-pose,.general-hit .sprite-window,.general-impact{animation:none!important;translate:0!important}.general-cut{display:none}}

/* Boss escorts use the existing shield soldier artwork and explicit status labels. */
.boss-guard-status{margin:12px 20px;padding:12px 16px;border:1px solid #a6bbd259;border-radius:10px;background:#21364c;color:#e8f2ff;font-size:1rem;line-height:1.65}
.boss-guard-status strong{color:#ffd36e}.boss-guard-status.guard-broken{background:#133f38;border-color:#70dbc277}.guard-broken strong{color:#8fffe0}
.boss-guard-note{color:#ffd36e;line-height:1.6;font-size:.9375rem}.enemy-guard-badge{display:block;color:#ffd36e;font-size:.875rem;line-height:1.4}
.boss-shield .unit-plate{border-color:#9bbed5}.enemy-covering .unit-plate{outline:3px solid #ffd36e;outline-offset:3px}

.enemy-side .sprite-window.chapter-boss-canal img,.enemy-side .sprite-window.chapter-boss-village img,.enemy-side .sprite-window.chapter-boss-rescue img{transform:scaleX(-1)}

.cooperation-cutin{position:absolute;inset:60px 8px auto;z-index:20;padding:14px 10px;border:1px solid #e9ce89;border-radius:12px;color:#fff5da;background:linear-gradient(135deg,#252c4ff2,#40273bf2);box-shadow:0 15px 60px #0009;pointer-events:none;animation:cooperation-enter calc(.28s / var(--battle-speed,1)) ease-out both}
.cooperation-cutin>h3{margin:5px 0 8px;text-align:center;font-size:clamp(1.15rem,3vw,1.75rem);color:#ffe4a6}
.cooperation-cutin>.eyebrow{display:block;text-align:center}
.cooperation-cutin>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.cooperation-cutin figure{margin:0;min-width:0;text-align:center}
.cooperation-cutin img{width:100%;height:clamp(150px,20vw,235px);object-fit:contain;object-position:center bottom;filter:drop-shadow(0 6px 12px #0008)}
.cooperation-cutin figcaption{padding:8px;background:#0c102a99;border-radius:6px;font-size:.8rem;line-height:1.5}
.cooperation-cutin figcaption strong,.cooperation-cutin figcaption span{display:block}
.cooperation-cutin figcaption strong{color:#ffdc83;margin-bottom:3px}
@keyframes cooperation-enter{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:none}}
@media(max-width:540px){.cooperation-cutin{inset:62px 6px auto;padding:10px 6px}.cooperation-cutin img{height:160px}.cooperation-cutin figcaption{padding:6px;font-size:.75rem}}
@media(prefers-reduced-motion:reduce){.cooperation-cutin{animation:none}}

/* Static victory art uses common body coordinates, not battle-frame scaling. */
.victory-character{display:block;width:100%;height:100%;filter:drop-shadow(0 5px 3px #0005)}
.victory-sprite>.victory-character{min-width:0}

/* Skill effects stay inside each fighter's sprite area and never capture input. */
.skill-fx{position:absolute;left:-30%;top:0;width:160%;height:var(--sprite-height);z-index:12;pointer-events:none;contain:layout style}
.skill-fx svg{display:block;width:100%;height:100%;overflow:visible;fill:none;stroke:var(--fx-a);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 4px var(--fx-a))}
.skill-fx .fx-secondary{stroke:var(--fx-b)}.skill-fx .fx-core{stroke:#fff8e9;stroke-width:2;opacity:.9}.skill-fx .fx-wide{stroke-width:9}.skill-fx .fx-beam{stroke-width:5}.skill-fx .fx-reticle{stroke-width:2;opacity:.85}.skill-fx .fx-petals{fill:var(--fx-a);stroke:var(--fx-b);stroke-width:1}.skill-fx .fx-flames{fill:var(--fx-a);fill-opacity:.24}.skill-fx .fx-shield,.skill-fx .fx-crown{fill:var(--fx-a);fill-opacity:.13}.skill-fx .fx-crown{stroke:var(--fx-a);stroke-width:4}.skill-fx .fx-shadows{stroke:var(--fx-b);stroke-width:9;opacity:.3}.skill-fx .fx-cross{stroke-width:6}
.skill-fx svg g,.skill-fx svg path,.skill-fx svg ellipse,.skill-fx svg circle{transform-box:view-box;transform-origin:100px 118px}
.fx-charge{animation:skill-charge calc(.38s / var(--battle-speed,1)) ease-out both}.fx-charge .fx-orbit{stroke-dasharray:12 8;opacity:.55}.fx-release{animation:skill-release calc(.15s / var(--battle-speed,1)) ease-out both}
.fx-impact{animation:skill-impact calc(.3s / var(--battle-speed,1)) ease-out both}.fx-impact .fx-slash,.fx-impact .fx-beam{stroke-dasharray:350;animation:skill-trace calc(.22s / var(--battle-speed,1)) ease-out both}.fx-impact .fx-sparks{animation:skill-sparks calc(.3s / var(--battle-speed,1)) ease-out both}.fx-impact .fx-motes{animation:skill-motes calc(.3s / var(--battle-speed,1)) ease-out both}.fx-impact .fx-shield{animation:skill-shield calc(.3s / var(--battle-speed,1)) ease-out both}.fx-impact .fx-flames{animation:skill-flame calc(.3s / var(--battle-speed,1)) ease-out both}.fx-impact .fx-petals{animation:skill-sparks calc(.3s / var(--battle-speed,1)) ease-out both}.fx-impact .fx-drone-two{animation:skill-drone calc(.3s / var(--battle-speed,1)) steps(1,end) both}.fx-impact .fx-drone-three{animation:skill-drone-last calc(.3s / var(--battle-speed,1)) steps(1,end) both}
.fx-afterglow{animation:skill-afterglow calc(.42s / var(--battle-speed,1)) ease-out both}.fx-afterglow svg{stroke-width:2;filter:none}
.skill-nameplate{position:absolute;top:54px;left:10%;right:10%;z-index:16;pointer-events:none;display:flex;align-items:center;justify-content:center;gap:10px;padding:9px 12px;border-block:1px solid color-mix(in srgb,var(--fx-a) 65%,transparent);background:linear-gradient(90deg,transparent,#10182aeb 15%,#10182aeb 85%,transparent);color:#fff5dc;text-align:center;animation:skill-name calc(.38s / var(--battle-speed,1)) ease-out both}
.skill-nameplate>span{font-size:.7rem;color:var(--fx-a);white-space:nowrap}.skill-nameplate>strong{font-size:clamp(.85rem,2.5vw,1.15rem);line-height:1.4;text-shadow:0 0 10px var(--fx-b)}
@keyframes skill-charge{from{opacity:0;transform:scale(.72) translateY(8px)}to{opacity:.8;transform:scale(1) translateY(0)}}
@keyframes skill-release{from{opacity:.8;transform:scale(.94)}to{opacity:.15;transform:scale(1.12)}}
@keyframes skill-impact{0%{opacity:.15;transform:scale(.86)}28%{opacity:1;transform:scale(1)}75%{opacity:.9}100%{opacity:.25;transform:scale(1.05)}}
@keyframes skill-trace{from{stroke-dashoffset:350}to{stroke-dashoffset:0}}
@keyframes skill-sparks{from{opacity:0;transform:scale(.65)}25%{opacity:1}to{opacity:0;transform:scale(1.2)}}
@keyframes skill-motes{from{opacity:.3;transform:translateY(15px)}40%{opacity:1}to{opacity:.3;transform:translateY(-13px)}}
@keyframes skill-shield{from{opacity:.3;transform:scaleX(.5)}45%{opacity:1;transform:scaleX(1.05)}to{opacity:.8;transform:scaleX(1)}}
@keyframes skill-flame{from{opacity:.4;transform:translateY(15px) scaleY(.7)}45%{opacity:1}to{opacity:.6;transform:translateY(-5px) scaleY(1.07)}}
@keyframes skill-drone{0%,20%{opacity:0}21%,100%{opacity:1}}
@keyframes skill-drone-last{0%,45%{opacity:0}46%,100%{opacity:1}}
@keyframes skill-afterglow{from{opacity:.45;transform:translateY(0)}to{opacity:0;transform:translateY(-12px)}}
@keyframes skill-name{from{opacity:0;transform:translateY(5px)}35%,100%{opacity:1;transform:translateY(0)}}
@media(max-width:540px){.skill-fx{left:-25%;width:150%}.skill-fx svg{filter:drop-shadow(0 0 2px var(--fx-a))}.skill-nameplate{top:49px;left:2%;right:2%;padding:7px 6px;gap:6px}}
@media(prefers-reduced-motion:reduce){.skill-fx,.skill-fx *,.skill-nameplate{animation:none!important;transition:none!important}.skill-fx{opacity:.6}.skill-fx svg{filter:none}.fx-afterglow{opacity:.2}.fx-charge,.fx-release{opacity:.3}.skill-fx .fx-slash,.skill-fx .fx-beam{stroke-dasharray:none}}

/* Graus' last stand occupies the center enemy lane; the frame supplies the aura. */
.stage-fighter.graus-unleashed{--general-scale:1.5;right:26%;width:38%}.graus-unleashed .sprite-motion{position:relative;isolation:isolate}.graus-unleashed .sprite-motion::before{content:'';position:absolute;inset:10% 8% 0;z-index:-1;background:radial-gradient(ellipse at 50% 70%,#ed653444,transparent 70%);border-radius:50%;pointer-events:none;animation:graus-aura calc(1.8s / var(--battle-speed,1)) ease-in-out infinite alternate}.graus-unleashed .unit-plate{translate:30% 0;border-color:#e9aa69;box-shadow:0 0 13px #dc563b44}.graus-unleashed .fighter-action-state{translate:30% 0}.graus-unleashed .stage-hp i{background:linear-gradient(90deg,#d95339,#ffcf7d)}.graus-last-objective{border-color:#e9aa69;color:#ffdda7}
@keyframes graus-aura{from{opacity:.55;transform:scale(.96)}to{opacity:.9;transform:scale(1.06)}}
/* Use the actual arena width, including desktop layouts with the command sidebar. */
.graus-battle .hero-side{z-index:6}
@container(max-width:600px){.stage-fighter.general-boss:not(.graus-unleashed){width:38%}.stage-fighter.graus-unleashed{--general-scale:1.5;width:43%}}
/* A narrow arena needs both separation from the party and room for the cape. */
@container(max-width:400px){.stage-fighter.general-boss{--general-scale:1.25}.stage-fighter.graus-unleashed{--general-scale:1.25;right:20%}}
@container(max-width:320px){.stage-fighter.general-boss{--general-scale:1.15}.stage-fighter.graus-unleashed{--general-scale:1.1}}
@container(max-width:280px){.stage-fighter.general-boss{--general-scale:1.05}.stage-fighter.graus-unleashed{--general-scale:.98}}
@media(prefers-reduced-motion:reduce){.graus-unleashed .sprite-motion::before{animation:none!important;opacity:.55}}
