.battle-theater{--theater-accent:#d9bd72;position:fixed;inset:0;z-index:500;isolation:isolate;overflow:hidden;color:#f5ecd5;background:#122c30;font-family:inherit;min-width:280px}
.battle-theater *{box-sizing:border-box}.theater-open{overflow:hidden}
.theater-sky,.theater-mountains,.theater-floor{position:absolute;inset:0;z-index:-2;pointer-events:none}
.theater-sky{background:url('./assets/battle-valley-v431.png') center 60% / cover no-repeat}
.theater-mountains{display:none}
.theater-floor{display:none}
.battle-theater header{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:calc(20px + env(safe-area-inset-top)) max(24px,env(safe-area-inset-right)) 10px;font-size:14px;color:#eee3c9;position:relative;z-index:10}
.battle-theater header small{display:block;font-size:11px;letter-spacing:.16em;color:#bfcdbf;margin-top:5px}
.theater-skip{min-height:44px;min-width:104px;border:1px solid #d8cba46b;border-radius:4px;color:#f5ecd5;background:#102c30cc;cursor:pointer;font:inherit;touch-action:manipulation}
.theater-skip:focus-visible{outline:3px solid var(--theater-accent);outline-offset:3px}.theater-skip:hover{background:#365650}
.theater-title{position:absolute;top:17%;left:8%;right:8%;text-align:center;z-index:3;pointer-events:none;text-shadow:0 2px 15px #071f24}
.theater-title p{font-size:13px;letter-spacing:.22em;color:#ded7bc;margin:0 0 12px}.theater-title h2{font-family:"Songti SC","STSong",serif;font-size:clamp(32px,6vw,68px);font-weight:500;letter-spacing:.18em;margin:0;color:#fff2c8;overflow-wrap:anywhere;text-wrap:balance}
.theater-phase-label{display:inline-block;font-size:12px;letter-spacing:.14em;color:#d5e1d0;margin-top:17px}
.theater-formation{position:absolute;inset:35% 6% 15%;display:flex;align-items:center;gap:8%;z-index:2}
.theater-unit{position:relative;text-align:center;min-width:0}.theater-caster{width:42%;flex-shrink:0;align-self:end}
.theater-unit-motion{position:relative;height:clamp(130px,28vw,330px);display:flex;align-items:end;justify-content:center;transform-origin:50% 80%}
.theater-unit img{height:100%;width:100%;object-fit:contain;filter:drop-shadow(0 8px 14px #0a2526aa);position:relative;z-index:2}
.theater-ground{position:absolute;width:75%;height:16%;bottom:0;left:12.5%;background:#041a1dcc;filter:blur(7px);border-radius:50%}
.theater-recipients{width:50%;display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;align-self:center}
.theater-recipient{width:44%}.theater-recipients[data-count="1"] .theater-recipient{width:92%}.theater-recipients[data-count="2"] .theater-recipient{width:75%}
.theater-recipient .theater-unit-motion{height:clamp(88px,15vw,200px)}.theater-recipients[data-count="1"] .theater-unit-motion{height:clamp(130px,25vw,300px)}
.theater-unit-label{position:relative;z-index:3;width:min(150px,100%);margin:0 auto;color:#fff3d3;text-shadow:0 2px 3px #062020;font-size:14px}
.theater-unit-label small{font-size:11px;color:#d8e2d5}.theater-health{display:block;height:4px;margin:5px 10%;background:#081f24;border-radius:2px;overflow:hidden}.theater-health i{display:block;height:100%;background:#8dd2a2;transition:width .25s}.theater-unit[data-side="enemy"] .theater-health i{background:#eea28a}
.theater-solo{justify-content:center}.theater-solo .theater-caster{width:65%}.theater-solo .theater-recipients{display:none}
.theater-casting{position:absolute;width:min(48vw,460px);aspect-ratio:1;left:24%;top:65%;transform:translate(-50%,-50%);color:var(--theater-accent);opacity:.78;z-index:1;pointer-events:none}
.theater-casting i{position:absolute;inset:0;border:1px solid currentColor;border-radius:50%;box-shadow:0 0 22px color-mix(in srgb,var(--theater-accent) 25%,transparent);animation:theater-orbit calc(9s * var(--theater-speed)) linear infinite}
.theater-casting i:nth-child(2){inset:13%;border:2px dashed currentColor;animation-direction:reverse}.theater-casting i:nth-child(3){inset:26%;border-radius:12%;transform:rotate(45deg)}.theater-casting b{position:absolute;inset:0;display:grid;place-items:center;font-size:90px;opacity:.12;font-family:serif}
.battle-theater[data-phase="gather"] .theater-unit img{animation:theater-charge calc(.76s * var(--theater-speed)) ease-out both}.battle-theater[data-phase="release"] .theater-casting{animation:theater-bloom calc(.6s * var(--theater-speed)) ease-out both}.battle-theater[data-phase="return"] .theater-casting{opacity:0;transition:opacity .3s}
.battle-theater footer{position:absolute;bottom:calc(28px + env(safe-area-inset-bottom));left:20%;right:20%;display:flex;align-items:center;gap:12px;font-size:11px;color:#96aaa1;letter-spacing:.12em}.battle-theater footer i{flex:1;height:1px;background:#d9bd7238}
.battle-theater[data-phase="gather"] footer span:nth-child(1),.battle-theater[data-phase="release"] footer span:nth-child(3),.battle-theater[data-phase="return"] footer span:nth-child(5){color:#ffdda0}
.theater-effects{position:fixed;inset:0;z-index:5;pointer-events:none}.theater-effects .fx-float{font-size:38px}.theater-unit.is-defeated img{opacity:.45;filter:grayscale(1)}
.battle-theater[data-skipped="true"] *{animation:none!important;transition:none!important}.battle-theater[data-side="enemy"] .theater-title p{color:#ffc9aa}
@keyframes theater-orbit{to{transform:rotate(360deg)}}@keyframes theater-charge{0%{transform:scale(.8) translateY(20px);opacity:.15}60%{filter:brightness(1.4) drop-shadow(0 0 22px var(--theater-accent))}100%{transform:none;opacity:1}}@keyframes theater-bloom{from{opacity:1;scale:1}to{opacity:0;scale:1.8}}
@media(max-width:600px){.battle-theater header{padding:calc(12px + env(safe-area-inset-top)) 16px 0;font-size:12px}.theater-title{top:20%}.theater-title h2{font-size:36px}.theater-title p{font-size:12px}.theater-formation{inset:41% 3% 17%;gap:0;align-items:center}.theater-caster{width:47%;align-self:center;transform:translateY(38px)}.theater-caster .theater-unit-motion{height:190px}.theater-recipients{width:53%;gap:8px}.theater-recipient{width:80%}.theater-recipient .theater-unit-motion{height:88px}.theater-recipients[data-count="1"] .theater-unit-motion{height:175px}.theater-recipients[data-count="3"]{flex-wrap:wrap;gap:6px}.theater-recipients[data-count="3"] .theater-recipient{width:46%}.theater-unit-label{font-size:12px}.theater-unit-label small{font-size:10px}.theater-casting{top:64%;left:26%;width:68vw}.battle-theater footer{left:12%;right:12%}.theater-effects .fx-float{font-size:30px}}
@media(max-height:520px){.battle-theater header{padding-top:6px}.theater-title{top:16%;left:26%;right:26%}.theater-title h2{font-size:28px}.theater-title p{font-size:10px;margin-bottom:5px}.theater-phase-label{margin-top:6px;font-size:10px}.theater-formation{inset:25% 8% 11%;gap:12%}.theater-caster{width:38%}.theater-unit-motion,.theater-caster .theater-unit-motion{height:clamp(100px,36vh,200px)}.theater-recipients{width:50%}.theater-recipient .theater-unit-motion{height:80px}.theater-recipients[data-count="1"] .theater-unit-motion{height:150px}.theater-recipients[data-count="2"] .theater-recipient{width:45%}.battle-theater footer{bottom:8px;left:28%;right:28%}.theater-casting{width:220px;top:65%}}

.battle-theater[data-skill-style="authored"] .theater-casting{display:none}

/* Painted valley staging; no geometric floor or dark full-scene color wash. */
.battle-theater{background:#c6b389}
.battle-theater header{color:#ffefd0;background:linear-gradient(#22352ce6,#22352c00);text-shadow:0 1px 3px #33291d;padding-bottom:24px}
.battle-theater header small{color:#ecdfc2}
.theater-skip{background:#20392ddd;border-color:#e0c89299;border-radius:6px}
.theater-title{top:14%;text-shadow:0 2px 3px #332c1f,0 2px 16px #3e382eba}
.theater-title h2{color:#fff2ce;font-size:clamp(34px,5vw,64px)}
.theater-title p{color:#fff1d3}.theater-phase-label{color:#fff5db;background:#293d2fc9;border:1px solid #d7bc7e44;border-radius:99px;padding:4px 12px;font-size:11px}
.theater-formation{inset:37% 7% 12%;gap:10%;align-items:flex-end}
.theater-caster{width:42%;align-self:flex-end}
.theater-recipients{width:48%;align-self:center;gap:14px}
.theater-unit-motion{height:clamp(160px,25vw,330px)}
.theater-ground{background:radial-gradient(ellipse,#46332188,transparent 68%);width:65%;left:17.5%;height:10%;bottom:1%;filter:blur(3px)}
.theater-unit-label{padding:4px 6px;background:linear-gradient(90deg,transparent,#283e2ed9 20%,#283e2ed9 80%,transparent);font-size:14px;color:#fff0d0;text-shadow:0 1px 3px #332a20}
.theater-unit-label small{color:#f3ebd6}.theater-health{background:#3c302cb3;margin:4px 9%;box-shadow:0 0 0 1px #ebd8a344}
.battle-theater footer{color:#e9dab9;text-shadow:0 1px 3px #3c2d21;background:#283c2ec9;border:1px solid #ceb27055;border-radius:99px;padding:10px 18px;bottom:calc(20px + env(safe-area-inset-bottom));left:30%;right:30%}
.battle-theater footer i{background:#ddc69a66}
@media(min-width:900px) and (min-height:521px){.theater-recipients[data-count="3"] .theater-unit-motion{height:clamp(110px,12.5vw,170px)}}
@media(max-width:600px){
 .theater-title{top:15%;left:5%;right:5%}.theater-title h2{font-size:34px}.theater-title p{font-size:11px;margin-bottom:8px}.theater-phase-label{margin-top:12px}
 .theater-formation{inset:36% 3% 16%;gap:0}.theater-caster{width:49%;align-self:flex-end;transform:none}.theater-caster .theater-unit-motion{height:clamp(150px,26dvh,230px)}
 .theater-recipients{width:51%;align-self:center;gap:10px}.theater-recipient .theater-unit-motion{height:100px}.theater-recipients[data-count="1"] .theater-unit-motion{height:clamp(145px,24dvh,215px)}
 .theater-recipients[data-count="3"] .theater-recipient{width:46%}.theater-recipients[data-count="3"] .theater-recipient:first-child{margin-inline:25%}
 .theater-unit-label{font-size:12px}.theater-unit-label small{font-size:9px}.theater-solo .theater-caster{width:76%;align-self:center}.theater-solo .theater-unit-motion{height:clamp(210px,34dvh,320px)}
 .battle-theater footer{left:12%;right:12%;font-size:10px;bottom:calc(20px + env(safe-area-inset-bottom))}
}
@media(max-height:520px){
 .battle-theater header{padding-top:7px;padding-bottom:12px}.theater-title{top:12%;left:25%;right:25%}.theater-title h2{font-size:29px}.theater-title p{font-size:10px;margin-bottom:4px}.theater-phase-label{margin-top:5px;padding:2px 9px}
 .theater-formation{inset:29% 8% 13%;gap:12%}.theater-caster{width:39%;align-self:end}.theater-caster .theater-unit-motion{height:clamp(110px,40dvh,190px)}
 .theater-recipients{width:49%;align-self:end}.theater-recipient .theater-unit-motion{height:90px}.theater-recipients[data-count="1"] .theater-unit-motion{height:clamp(110px,38dvh,175px)}
 .theater-recipients[data-count="3"] .theater-recipient{width:30%}.theater-recipients[data-count="3"] .theater-recipient:first-child{margin-inline:0}
 .theater-solo .theater-unit-motion{height:clamp(135px,43dvh,190px)}.battle-theater footer{bottom:6px;padding:5px 12px;left:31%;right:31%;font-size:9px}
}