:root{color-scheme:dark;--bg:#07101c;--ink:#e5f8ff;--muted:#91acc0;--cyan:#8cdded;--violet:#ae80f9;--line:#35475c;--red:#fa8695;--gold:#ffca7d}*{box-sizing:border-box}html,body{margin:0;height:100%;background:#050a12;color:var(--ink);font-family:system-ui,-apple-system,Segoe UI,sans-serif}button,a{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid var(--gold);outline-offset:3px}.battle-app{position:relative;margin:auto;width:100%;max-width:1060px;height:100dvh;min-height:570px;display:grid;grid-template-rows:45px minmax(0,1fr) 29px;overflow:hidden;background:#08101d;box-shadow:0 0 60px #010408}.headbar{display:flex;align-items:center;gap:9px;border-bottom:1px solid #3d5269;background:#101a2b;padding:4px 11px;z-index:5}.headbar .back{font-size:30px;color:var(--cyan);text-decoration:none;width:23px;line-height:1}.headbrand{display:grid;gap:1px;flex:1;font-size:12px;letter-spacing:.08em}.headbrand em{font-style:normal;color:var(--cyan)}.headbrand small{font-size:8px;letter-spacing:.19em;color:#92a5bc}.round{font-size:10px;color:var(--gold);font-weight:750;white-space:nowrap}.flat{border:1px solid #394f65;color:#b0d4e5;border-radius:5px;background:#142439;padding:4px 8px}.arena{position:relative;min-height:0;display:flex;flex-direction:column;isolation:isolate;overflow:hidden;background:linear-gradient(#0b152a,#0c1630 44%,#141528)}.form-head{z-index:2;display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:52px;padding:8px 12px 6px;background:linear-gradient(#11132cfa,#151229ba);border-bottom:1px solid #5d4780}.boss-identity{display:flex;flex-direction:column;gap:1px;min-width:0}.boss-identity b{font-size:14px;letter-spacing:.04em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.boss-identity small{font-size:9px;color:#bba6e0;letter-spacing:.14em}.form-number{font-size:9px;color:var(--gold);font-weight:900}.boss-health{min-width:96px;width:25%;max-width:174px;color:#f7dfef;text-align:right;font-size:10px;font-weight:800}.meter{width:100%;height:7px;background:#1e2c3d;border:1px solid #3f5670;border-radius:10px;overflow:hidden}.meter i{display:block;width:50%;height:100%;background:linear-gradient(90deg,#63c4d4,#9aeeed);transition:width .32s ease}.boss-meter{margin-top:5px;height:10px;border-color:#85476f}.boss-meter i{background:linear-gradient(90deg,#9f4bed,#fd98d9)}.scene{min-height:115px;flex:1;position:relative;overflow:hidden;background:radial-gradient(ellipse at 50% 72%,#643a84aa,#161a39 45%,#030a17 93%)}.starfield{position:absolute;inset:0;background-image:radial-gradient(circle,#dbe4ff 0 1px,transparent 1.5px),radial-gradient(circle,#789deb 0 1px,transparent 1.5px);background-size:60px 61px,93px 79px;background-position:11px 20px,51px 7px;opacity:.5}.moon{position:absolute;width:54px;height:54px;border-radius:50%;background:#aebfe8;box-shadow:0 0 32px #a6c3fa;top:13%;right:16%;opacity:.6}.window-arch{position:absolute;inset:-12% 10% -22%;border:13px solid #27344e;border-top-width:19px;border-radius:50% 50% 0 0;box-shadow:inset 0 0 10px #d1c7fa44,0 0 15px #100b21;opacity:.98;transition:opacity .25s}.window-beam{position:absolute;top:0;bottom:0;width:8px;left:33%;background:#3b3953;transform:skew(4deg)}.window-beam.r{left:70%;transform:skew(-4deg)}.boss-art{position:absolute;width:min(94%,700px);height:108%;left:50%;top:0;transform:translateX(-50%);filter:drop-shadow(0 0 16px #a25bffa6);animation:hover 4s ease-in-out infinite}.rift-rings{transform-origin:230px 143px;animation:spin 19s linear infinite}.wing-pair{transform-origin:230px 160px;animation:wings 3.2s ease-in-out infinite}.battle-floor{height:15%;position:absolute;bottom:0;left:0;right:0;background:linear-gradient(transparent,#19263a 68%,#1a2034)}.shimmer{position:absolute;z-index:2;top:44%;left:14%;width:27px;height:27px;filter:drop-shadow(0 0 15px #61e8ff);animation:shimmer 5s ease-in-out infinite}.shimmer:before,.shimmer:after{content:'';position:absolute;background:#a9f5ff;clip-path:polygon(50% 0,68% 39%,100% 50%,68% 61%,50% 100%,32% 61%,0 50%,32% 39%);inset:0}.shimmer:after{background:#f9ffff;inset:7px}.broken-wall{opacity:0;position:absolute;top:-10%;bottom:0;width:23%;z-index:1;background:repeating-linear-gradient(177deg,#39415b 0 16px,#171d32 17px 24px);clip-path:polygon(0 0,100% 0,80% 7%,95% 17%,57% 33%,93% 55%,42% 70%,85% 82%,34% 100%,0 100%);transition:opacity .3s}.left-wall{left:0}.right-wall{right:0;transform:scaleX(-1)}.stone-debris{position:absolute;inset:0;z-index:3;pointer-events:none;opacity:0}.stone-debris i{position:absolute;width:16px;height:15px;background:#64708b;box-shadow:0 0 12px #c9b4ef}.stone-debris i:nth-child(1){top:30%;left:23%;transform:rotate(35deg)}.stone-debris i:nth-child(2){top:65%;left:30%;transform:rotate(-27deg)}.stone-debris i:nth-child(3){top:35%;right:22%;transform:rotate(41deg)}.stone-debris i:nth-child(4){top:72%;right:30%;transform:rotate(-22deg)}.arena[data-form='1'] .window-arch,.arena[data-form='2'] .window-arch{opacity:0}.arena[data-form='1'] .broken-wall,.arena[data-form='2'] .broken-wall{opacity:1}.arena[data-form='1'] .stone-debris,.arena[data-form='2'] .stone-debris{opacity:1}.arena[data-form='1'] .scene,.arena[data-form='2'] .scene{background:radial-gradient(ellipse at 50% 65%,#c550a16a,#321a56 46%,#020914 90%)}.arena[data-form='1'] .boss-art{filter:drop-shadow(0 0 25px #fa75d5)}.arena[data-form='1'] .wing-pair{transform:scale(1.18)}.arena[data-form='2'] .wing-pair{opacity:.30;transform:scale(.72)}.arena[data-form='2'] .phoenix-body{fill:#e586f0}.arena[data-form='2'] .rift-rings{stroke:#ffcfed;transform:scale(1.16)}.battle-bark{position:absolute;left:50%;bottom:15%;transform:translateX(-50%);width:max-content;max-width:80%;z-index:4;padding:6px 12px;border:1px solid #d5cbfa;background:#10142df0;color:#fff;border-radius:12px 12px 12px 2px;box-shadow:0 5px 30px #0009;display:flex;gap:8px;align-items:center;font-size:12px}.battle-bark strong{color:#98edff;font-size:10px;white-space:nowrap}.battle-bark[hidden]{display:none}.impact-text{position:absolute;top:34%;right:11%;color:#ffddad;font-size:24px;font-weight:1000;text-shadow:0 2px 16px #5c1208;z-index:5}.impact-text[hidden]{display:none}.world-alert{position:absolute;left:10%;right:10%;top:10%;z-index:5;text-align:center;font-weight:950;font-size:clamp(14px,3.5vw,21px);letter-spacing:.08em;padding:11px;background:#541f3be9;border:2px solid #f6a0ab;box-shadow:0 0 36px #e382cc77;animation:flash .8s ease-out}.world-alert[hidden]{display:none}.threat-line{min-height:41px;display:flex;align-items:center;gap:9px;padding:5px 12px;background:#1a1329;border-block:1px solid #54436b}.threat-light{width:8px;height:8px;border-radius:50%;background:#fa829a;box-shadow:0 0 13px #fa829a;flex-shrink:0}.threat-line>div{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.threat-line b{font-size:10px;letter-spacing:.06em}.threat-line small{font-size:10px;color:#cfbedc;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.seal-indicator{font-size:10px;border:1px solid #bfb7ff;color:#eee4ff;padding:3px 5px;white-space:nowrap}.meters{min-height:41px;display:flex;gap:12px;align-items:center;padding:6px 12px;background:#11182a;border-bottom:1px solid #425072}.stat{flex:1;min-width:0}.stat label{display:flex;justify-content:space-between;font-size:9px;letter-spacing:.05em;color:#b0c4d5;gap:4px;margin-bottom:4px}.stat b{color:#edf6ff}.stat:nth-child(2) .meter i{background:linear-gradient(90deg,#558ed7,#b6a6ff)}.meter.danger i{background:linear-gradient(90deg,#ad3777,#fa8494)}.party-zone{z-index:2;position:relative;flex-shrink:0;background:linear-gradient(#19263a,#101e2e);border-top:2px solid #6989a3;padding:7px 9px 8px}.party-topline{display:flex;justify-content:space-between;font-size:10px;font-weight:800;letter-spacing:.07em;color:#d1ecf8;margin-bottom:4px}.party-topline em{font-style:normal;color:#819cad;font-weight:500}.party{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px}.actor{position:relative;min-width:0;height:105px;background:linear-gradient(#192944,#11192b);border:1px solid #425d79;border-radius:6px;color:#e6f9ff;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding:2px 1px 5px;gap:2px}.actor:before{position:absolute;content:'';width:58%;height:8px;border-radius:50%;background:#56c3fa36;bottom:26px;filter:blur(5px)}.actor img{width:55px;height:66px;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 0 4px #92dcff40);margin:auto auto 0;position:relative}.actor .name{font-size:9px;font-weight:850;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;max-width:100%}.actor .life{height:4px;width:89%;background:#43334d;border-radius:9px;overflow:hidden}.actor .life>i{display:block;background:#7addb6;height:100%;width:100%}.actor .chosen{position:absolute;top:2px;right:3px;font-size:9px;background:#1e4255;color:#8ff1ff;border-radius:3px;min-width:13px}.actor.selected{border-color:#ffdc95;box-shadow:inset 0 0 0 1px #ffdc95,0 0 12px #d89a4b55}.actor.queued{border-color:#58baae}.actor.down{opacity:.46;filter:grayscale(1)}.turn-controls{display:grid;grid-template-columns:1fr 1.25fr;gap:6px;margin-top:8px}.turn-controls button{min-height:38px;font-size:11px;font-weight:900;letter-spacing:.04em;border-radius:5px}.primary{background:linear-gradient(#e3c57e,#b88f44);color:#152132;border:1px solid #ffe8ac;box-shadow:0 3px 0 #715b38}.secondary{background:#1b3148;border:1px solid #7191a5;color:#e3f5ff;border-radius:5px}.turn-controls kbd{font-size:9px;opacity:.7;margin-left:3px}.footnote{padding:5px 11px;color:#91acbf;font-size:10px;background:#090f1b;border-top:1px solid #233a4b;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ability-panel{position:absolute;z-index:7;bottom:152px;left:9px;right:9px;padding:9px;background:#101e32f8;border:1px solid #9ec9e1;border-radius:10px;box-shadow:0 -6px 38px #000b}.ability-panel[hidden]{display:none}.ability-heading{display:flex;justify-content:space-between;align-items:center;padding-bottom:8px}.ability-heading span{display:flex;align-items:baseline;gap:12px}.ability-heading b{color:#dcefff}.ability-heading small{font-size:10px;color:#76dce1}.ability-heading button,.log-head button{background:none;border:0;color:#c9e6f8;font-size:24px}.abilities{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.abilities button{background:#203951;border:1px solid #536d89;color:#ecf6ff;padding:8px;border-radius:5px;min-height:58px;text-align:left;display:flex;flex-direction:column;gap:3px}.abilities b{font-size:12px}.abilities small{font-size:10px;color:#aec9d5;line-height:1.2}.abilities button:hover{border-color:#ffcc7b}.actor-auto{width:100%;margin-top:6px;background:#393552;border:1px solid #a68dcf;color:#eee4ff;border-radius:5px;padding:7px;font-size:11px;font-weight:850}.outcome-overlay,.party-after{z-index:10;position:absolute;inset:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:26px;background:#0c1524f2;backdrop-filter:blur(9px);border:2px solid #8ac0ce;border-radius:12px;box-shadow:0 0 30px #080a20}.outcome-overlay[hidden],.party-after[hidden]{display:none}.outcome-overlay span{font-size:10px;letter-spacing:.16em;color:#f2c781}.outcome-overlay h1,.party-after h2{font-size:clamp(20px,5.5vw,36px);line-height:1.13;margin:12px 0}.outcome-overlay p,.party-after p{font-size:14px;line-height:1.5;max-width:480px;color:#b9d4e3}.outcome-buttons{display:grid;gap:8px;margin-top:15px;width:min(100%,320px)}.outcome-buttons button,.party-after button{min-height:40px;padding:8px;font-weight:800}.log-drawer{position:absolute;z-index:11;inset:45px 0 0;background:#0c1521fa;border-left:1px solid #6287a1;overflow:auto;padding:16px}.log-drawer[hidden]{display:none}.log-head{display:flex;align-items:center;justify-content:space-between}.log-head h2{font-size:14px;color:#bef2ff}.log-drawer>p{font-size:12px;color:#b4c8d5}.log-drawer ol{padding:0;list-style:none}.log-drawer li{border-bottom:1px solid #31455a;padding:8px 0;font-size:12px}.log-drawer li small{display:block;color:#79ccde;font-size:10px}.log-drawer>button{padding:12px;width:100%}.arena[data-anim='pulse'] .boss-art{animation:shake .45s linear}.arena[data-anim='blowout'] .scene{animation:flash .55s ease}.arena[data-anim='blowout'] .stone-debris i{animation:debris .8s ease-out}
@keyframes hover{50%{translate:0 -6px}}@keyframes spin{to{rotate:360deg}}@keyframes wings{50%{scale:1.06 .95}}@keyframes shimmer{50%{translate:45px -22px;scale:1.3}}@keyframes shake{20%{translate:-7px 0}40%{translate:9px 0}60%{translate:-4px 1px}80%{translate:5px 0}}@keyframes flash{0%{filter:brightness(4)}100%{filter:brightness(1)}}@keyframes debris{0%{translate:0 -80px;opacity:0}30%{opacity:1}100%{translate:0 90px}}
@media(min-width:720px){.battle-app{min-height:680px}.actor{height:118px}.actor img{width:70px;height:80px}.ability-panel{max-width:520px;left:50%;right:auto;transform:translateX(-50%);width:100%;bottom:178px}.headbar{height:55px}.form-head{min-height:63px}.party-zone{padding:9px 18px 13px}.party{gap:9px}.actor .name{font-size:11px}.battle-app{grid-template-rows:55px minmax(0,1fr) 29px}}
@media(max-height:700px){.battle-app{min-height:540px}.form-head{min-height:42px;padding:4px 10px}.boss-identity small{display:none}.scene{min-height:90px}.actor{height:85px}.actor img{width:47px;height:48px}.party-zone{padding:4px 7px}.turn-controls{margin-top:3px}.turn-controls button{min-height:32px}.ability-panel{bottom:124px}.meters{min-height:33px;padding:4px 9px}.threat-line{min-height:33px;padding:4px 9px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;transition:none!important}}

/* The damage is part of this Lab world state, not only a one-frame animation. */
.arena[data-scar="blown_out"] .window-arch{opacity:0}.arena[data-scar="blown_out"] .broken-wall,.arena[data-scar="blown_out"] .stone-debris{opacity:1}

/* LGU v0.1.6 · projected CyberScape arena: one persistent world-state field. */
.cyberscape-paths{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1;opacity:0;transform:perspective(450px) rotateX(28deg) scale(.8);transform-origin:50% 88%;transition:opacity .45s,transform .8s;filter:drop-shadow(0 0 7px #5ee6fa)}
.arena[data-cyberscape="active"] .cyberscape-paths{opacity:.8;transform:perspective(450px) rotateX(28deg) scale(1.2)}
.field-status{z-index:3;position:absolute;top:6px;left:8px;font-size:10px;font-weight:900;letter-spacing:.14em;padding:5px 7px;color:#a7bbd1;background:#0c1b2bbb;border:1px solid #53617a;border-radius:3px}
.arena[data-cyberscape="active"] .field-status{border-color:#79daef;color:#baf6ff;background:#122d41e8;box-shadow:0 0 12px #56d5ff62}
.actor.deploy-ready{border-color:#e4ba76;box-shadow:0 0 16px #f7d48a4b;animation:deployGlow 1.7s ease-in-out infinite}
.actor.deploy-muted{opacity:.70}
.ability-panel .abilities button.deploy-command{grid-column:span 2;min-height:74px;border:2px solid #c4a8fb;color:#fff2ff;background:linear-gradient(110deg,#39315d,#123c59);box-shadow:0 0 16px #946afc55}
.ability-panel .abilities button.ultimate-command{border-color:#d9b46c;background:linear-gradient(135deg,#3d264f,#463638)}
.ability-panel .abilities button[disabled]{opacity:.45;cursor:not-allowed}
.deployment-cutin{z-index:9;position:absolute;inset:9% 4% 23%;display:flex;flex-direction:column;justify-content:center;align-items:center;background:radial-gradient(ellipse,#223d5ceF,#0e1234f6 70%,#080d1af5);border:2px solid #9ee9ff;border-radius:9px;box-shadow:0 0 50px #7e78fc80,inset 0 0 90px #47d9f224;animation:cutinEnter .7s ease-out;pointer-events:none;text-align:center}
.deployment-cutin[hidden]{display:none}
.deployment-cutin strong{font-size:clamp(22px,6vw,44px);letter-spacing:.12em;color:#e5faff;text-shadow:0 0 24px #58dbff}
.deployment-cutin small{color:#c5adee;letter-spacing:.13em;font-size:10px;font-weight:800}
.deployment-cutin p{font-size:12px;color:#cae6f3;margin-top:13px}
.deployment-rune{font-size:88px;color:#7fdaf9;text-shadow:0 0 30px #91e6fa;line-height:1;position:relative;animation:runeSpin 3s linear infinite}
.deployment-rune span{position:absolute;font-size:36px;top:30px;left:50%;transform:translateX(-50%);color:#fff}
@keyframes cutinEnter{from{transform:translateX(-90%);opacity:0}to{transform:translateX(0);opacity:1}}
@keyframes runeSpin{50%{filter:hue-rotate(48deg);scale:1.15}}
@keyframes deployGlow{50%{box-shadow:0 0 22px #ffe7a06d}}
@media(prefers-reduced-motion:reduce){.deployment-rune,.actor.deploy-ready{animation:none}}

/* v0.1.7 // Arc Party Stage: a shared battlefield, NOT five framed portraits */
.party-zone{background:linear-gradient(180deg,#101d30 0%,#12273b 35%,#0b1727 100%);padding:4px 9px 6px;overflow:visible}
.party-stage{position:relative;height:133px;isolation:isolate;margin-top:0;overflow:visible;}
.party-stage:before{content:"";position:absolute;inset:18px -9px -4px;background:repeating-linear-gradient(90deg,transparent 0 20%,#36b9e81b calc(20% + 1px),transparent calc(20% + 2px)),repeating-linear-gradient(0deg,transparent 0 27px,#36b9e81b 28px,transparent 29px);transform:perspective(200px) rotateX(29deg);pointer-events:none;opacity:.65}
.party{height:100%;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;align-items:end;position:relative;z-index:2}
.actor{position:relative;height:128px;background:none;border:1px solid transparent;border-radius:8px;padding:0 0 3px;justify-content:flex-end;gap:0;overflow:visible;transition:transform .14s ease,filter .14s ease;border-color:transparent}
.actor:before{bottom:22px;width:70%;height:11px;background:#52e4f666;filter:blur(5px)}
.actor img{width:min(98%,83px);height:100px;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 3px 2px #020510) drop-shadow(0 0 3px #4d9bb855);margin:auto auto -4px}
.actor .name{font-size:10px;line-height:13px;text-shadow:0 1px #000,0 0 5px #000}
.actor .life{height:4px;width:75%;margin-bottom:1px;box-shadow:0 0 4px #83ddcf55}
.actor .chosen{top:8px;right:2px;border:1px solid #335d75;border-radius:9px;padding:1px 4px;background:#0b2734dd}
.actor:nth-child(1){transform:translateY(6px) scale(.92)}
.actor:nth-child(2){transform:translateY(-3px) scale(1.01)}
.actor:nth-child(3){transform:translateY(-11px) scale(1.09)}
.actor:nth-child(4){transform:translateY(-3px) scale(1.01)}
.actor:nth-child(5){transform:translateY(6px) scale(.92)}
.actor.selected{background:radial-gradient(ellipse at center,#6acddd26,transparent 65%);border-color:#75cbd7;filter:brightness(1.13)}
.actor:hover{filter:brightness(1.15)}
.actor.queued{border-color:#5abaaa88}.actor.deploy-ready{border-color:#e9c67caa}
.actor.deploy-muted{opacity:.84}
.party-topline{position:relative;z-index:3;margin-bottom:0}
.turn-controls{margin-top:2px}
.ability-panel{bottom:205px;max-height:min(55dvh,350px);overflow:auto}
.ability-panel[data-actor='archivist']{border-color:#badce8}.ability-panel[data-actor='rival']{border-color:#55e4e8}
.ability-panel[data-actor='cat']{border-color:#e7a866}.ability-panel[data-actor='gatekeeper']{border-color:#9da9b4}
.ability-panel[data-actor='you']{border-color:#5db8e3}
.scene{background:radial-gradient(ellipse at 50% 65%,#412664 0%,#131833 48%,#0b1325 100%)}
.arena[data-form='1'] .scene{background:radial-gradient(ellipse at 50% 58%,#65234c 0%,#282448 50%,#0b1225 100%)}
.arena[data-form='2'] .scene{background:radial-gradient(ellipse at 50% 55%,#512e83 0%,#181a45 55%,#0b1225 100%)}
.arena[data-form='1'] .boss-art{filter:drop-shadow(0 0 35px #da67ff) hue-rotate(24deg)}
.arena[data-form='2'] .boss-art{filter:drop-shadow(0 0 35px #a58dff) hue-rotate(-18deg) saturate(1.5)}
.arena[data-anim='space-cut'] .boss-art{animation:slashImpact .9s ease-out}
.arena[data-anim='guided-missiles'] .boss-art{animation:missileImpact .9s ease-out}
@keyframes slashImpact{0%,100%{filter:brightness(1)}20%{filter:brightness(7) drop-shadow(0 0 25px #73f9ff)}45%{translate:12px -8px}65%{translate:-10px 5px}}
@keyframes missileImpact{0%,100%{filter:brightness(1)}25%,52%,76%{filter:brightness(4) drop-shadow(0 0 25px #fcd6f9)}38%,64%{translate:6px -5px}}
/* Canonically grounded illustration slides in briefly; the world remains visible after it exits. */
.ultimate-cutin{position:absolute;z-index:12;inset:7% 2% 19%;background:linear-gradient(95deg,#080d1beF,#1b2c46f5);border:2px solid #7cdaed;border-radius:10px;display:flex;gap:12px;align-items:center;overflow:hidden;pointer-events:none;box-shadow:0 0 50px #06061cd9;animation:cutinEnter .35s ease-out}
.ultimate-cutin[hidden]{display:none}
.ultimate-art-wrap{width:48%;height:100%;overflow:hidden;mask-image:linear-gradient(90deg,black 75%,transparent);-webkit-mask-image:linear-gradient(90deg,black 75%,transparent)}
.ultimate-cutin img{width:100%;height:100%;object-fit:cover;object-position:center 30%;filter:brightness(1.09) saturate(1.08)}
.ultimate-credit{flex:1;display:flex;flex-direction:column;gap:10px;padding:12px 10px 12px 0;text-shadow:0 2px 6px #000}
.ultimate-credit small{color:#8ee7fa;letter-spacing:.17em;font-weight:900;font-size:11px}
.ultimate-credit strong{font-size:clamp(17px,4.7vw,37px);line-height:1.15;color:#fff1d3;letter-spacing:.04em}
.ultimate-credit span{color:#d7e8ff;font-size:13px}
.ultimate-cutin[data-hero='rival']{border-color:#5de5e6;background:linear-gradient(95deg,#10182bf5,#123c43f5)}
.deployment-cutin{gap:0;overflow:hidden}.deployment-portrait{position:absolute;inset:0 auto 0 0;width:44%;height:100%;object-fit:cover;object-position:center 32%;opacity:.33;mask-image:linear-gradient(to right,black,transparent)}
.deployment-rune,.deployment-cutin strong,.deployment-cutin small,.deployment-cutin p{z-index:1}
.resolving .turn-controls,.resolving .party{pointer-events:none}
@media (max-width:450px){.party-stage{height:114px}.actor{height:112px}.actor img{height:83px;width:min(99%,70px)}.actor .name{font-size:9px}.ability-panel{bottom:178px}.party-zone{padding-inline:5px}.turn-controls button{font-size:10px}}
@media(max-height:735px){.party-stage{height:98px}.actor{height:100px}.actor img{height:70px}.ability-panel{bottom:162px}.actor .name{font-size:8px}}
@media(prefers-reduced-motion:reduce){.ultimate-cutin,.arena[data-anim='guided-missiles'] .boss-art,.arena[data-anim='space-cut'] .boss-art{animation:none}}
/* LGU 0.1.8 — staged combat grammar, unobstructed pixel-art arc */
.tower-columns{position:absolute;inset:0;pointer-events:none;z-index:0}.tower-columns i{position:absolute;top:0;bottom:0;width:14%;background:repeating-linear-gradient(8deg,#30334d 0 17px,#1a2035 18px 21px);border-right:4px solid #484963;box-shadow:15px 0 35px #101223 inset}.tower-columns i:first-child{left:0}.tower-columns i:last-child{right:0;transform:scaleX(-1)}
.boss-art{transition:scale .65s cubic-bezier(.2,.8,.2,1),opacity .4s,filter .45s;transform-origin:50% 48%;scale:.69}
.arena[data-form='1'] .boss-art{scale:1.02}.arena[data-form='2'] .boss-art{scale:1.38}
.arena[data-boss-action='true'] .boss-art{animation:bossLunge .65s ease-in-out!important;filter:brightness(1.7) drop-shadow(0 0 25px #ff80da)}
.arena[data-anim='shatter'] .window-arch{animation:windowShatter .9s forwards}.arena[data-scar='window_broken_inward'] .window-beam{opacity:0}.arena[data-scar='window_broken_inward'] .stone-debris{opacity:1}
.arena[data-scar='blown_out'] .tower-columns{opacity:.28}
.arena[data-anim='impact'] .boss-art{animation:bossFlinch .42s steps(3,end)!important}
.arena[data-anim='transform'] .boss-art{animation:transformation 1.25s ease-in-out!important}
.arena[data-anim='escape'] .boss-art{animation:bossEscape 1.5s forwards!important}
.ghost-covenant{position:absolute;inset:0;z-index:4;pointer-events:none;opacity:0;transition:opacity .8s;display:flex;align-items:center;justify-content:space-around;filter:drop-shadow(0 0 18px #a9eefa)}.ghost-covenant span{font-size:clamp(35px,9vw,88px);color:#bdedfc;animation:ghostSwirl 2s ease-in-out infinite}.ghost-covenant span:nth-child(even){animation-delay:-.8s;color:#ffc8f2}.arena[data-ghosts='true'] .ghost-covenant{opacity:.95}
.attack-vfx{position:absolute;inset:0;z-index:6;pointer-events:none;overflow:hidden}.attack-vfx i{position:absolute;top:55%;left:30%;width:9px;height:9px;background:#fff;filter:drop-shadow(0 0 12px #62f3ff);border-radius:50%;animation:projectile .62s ease-in forwards}.attack-vfx.fx-slash:before,.attack-vfx.fx-spacecut:before{content:'';position:absolute;inset:20% 16%;border-top:9px solid #86f9ff;transform:skew(-22deg) rotate(-25deg);filter:drop-shadow(0 0 18px #46b8e6);animation:slashTrail .62s ease-out forwards}.attack-vfx.fx-spacecut:after{content:'';position:absolute;inset:17% 25%;border-top:5px solid #ffc9ff;transform:rotate(32deg);animation:slashTrail .75s ease-out forwards}.attack-vfx.fx-barrier:before,.attack-vfx.fx-protect:before,.attack-vfx.fx-defend:before{content:'';position:absolute;inset:17% 16%;border:4px solid #67f5ff;border-radius:50%;box-shadow:0 0 20px #66f1ff, inset 0 0 40px #62c0ff56;animation:barrierPulse .85s ease-out forwards}.attack-vfx.fx-scan:before,.attack-vfx.fx-acquire:before,.attack-vfx.fx-breach:before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 14px,#fa74d755 15px 17px,transparent 19px 36px);animation:scanField .8s ease-out forwards}.attack-vfx.fx-missiles i:nth-child(even){animation-delay:.19s}.attack-vfx.fx-missiles i:nth-child(3n){animation-delay:.32s}.attack-vfx.fx-heal:before{content:'✦ ✦ ✧ ✦';position:absolute;bottom:12%;left:20%;right:20%;text-align:center;font-size:35px;color:#89ffda;animation:healFloat .9s forwards}.attack-vfx.fx-ghosts:before{content:'THE LIBRARY REMEMBERS';position:absolute;inset:46% 0 auto;text-align:center;font-size:clamp(15px,5vw,37px);font-weight:900;letter-spacing:.12em;color:#ebf9ff;text-shadow:0 0 30px #9efaff;animation:healFloat 2s forwards}.attack-vfx.fx-escape:before{content:'◈';position:absolute;inset:30% 0 auto;text-align:center;color:#90edff;font-size:65px;animation:healFloat 1.4s forwards}
.actor.perform-dash{animation:allyDash .7s ease-in-out!important;z-index:6}.actor.perform-cast{animation:allyCast .9s ease-in-out!important;z-index:6}.actor.perform-protect{animation:allyProtect .95s ease-in-out!important;z-index:6}.actor.perform-hit{animation:allyHurt .56s ease-out!important;z-index:6}.actor.perform-dash img,.actor.perform-cast img{filter:brightness(1.5) drop-shadow(0 0 13px #92f7ff)}
.tactical-brief{color:#ffdeb7;font-size:10px;background:#351e41cf;border-left:2px solid #d18afb;padding:4px 7px;margin:2px 0;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}
.battle-announcement{position:absolute;z-index:11;top:18%;left:4%;right:4%;max-width:470px;pointer-events:none;background:linear-gradient(95deg,#081625fa,#2d2859ed 70%,#1e1d3000);border-left:4px solid #89ebff;box-shadow:0 0 25px #030610cc;padding:9px 11px;display:grid;gap:2px;animation:announceIn .28s ease-out}.battle-announcement[hidden]{display:none}.battle-announcement b{font-size:11px;letter-spacing:.14em;color:#83dff4}.battle-announcement strong{font-size:clamp(15px,4.7vw,26px);color:#fff0d7}.battle-announcement small{font-size:11px;color:#d9e5f0}
.story-stage{position:absolute;z-index:15;inset:7% 2% 18%;pointer-events:auto;display:flex;flex-direction:column;justify-content:flex-end;gap:10px;isolation:isolate}.story-stage[hidden]{display:none}.story-backdrop{position:relative;min-height:40%;padding:15px;background:linear-gradient(90deg,#060d1cfa,#101c36ed 72%,#151736a0);border:1px solid #7c9dbc;box-shadow:0 0 48px #02050fe3;display:flex;flex-direction:column;justify-content:flex-end;gap:7px;overflow:hidden}.story-chapter{color:#8cecff;letter-spacing:.17em;font-size:10px;font-weight:900;z-index:2}.story-backdrop strong{font-size:clamp(20px,6.5vw,40px);line-height:1.15;letter-spacing:.025em;color:#fff4e7;text-shadow:0 0 15px #444e98;z-index:2}.story-backdrop p{font-size:clamp(12px,3.2vw,17px);line-height:1.4;color:#dbe7ff;max-width:80%;margin:0;z-index:2}.story-portrait{position:absolute;right:-3%;bottom:0;top:0;width:50%;opacity:.50;mask-image:linear-gradient(to right,transparent,black 45%)}.story-portrait[hidden]{display:none}.story-portrait img{width:100%;height:100%;object-fit:cover;object-position:center 15%}.story-controls{display:flex;gap:9px;justify-content:flex-end}.story-controls button{min-height:44px;padding:8px 16px;border-radius:6px;font-weight:900;letter-spacing:.035em}.story-controls .secondary{background:#121e30ef}
.arena[data-story='quiet'] .boss-art{opacity:0}.arena[data-story='quiet'] .shimmer{opacity:.45}.arena[data-story='quiet'] .party{opacity:0}.arena[data-story='intro'] .party{opacity:.8}.arena[data-story='live'] .party{opacity:1}
.ghost-counter{border:1px solid #74c6ec;color:#afe8ff;font-size:9px;border-radius:4px;padding:2px 4px}
.music-load{display:inline-flex;align-items:center;justify-content:center;color:#ace5f5;cursor:pointer;border:1px solid #425974;border-radius:5px;background:#152b3d;padding:4px 6px;font-size:10px;position:relative}.music-load input{position:absolute;width:1px;height:1px;opacity:0}.music-load:focus-within{outline:2px solid #ffd49b}
.party-photo{position:relative;background:radial-gradient(ellipse at 50% 30%,#553d74,#141d42 70%,#0a1a33);border:7px solid #e3b974;padding:12px 7px 2px;margin:12px auto;max-width:540px;min-height:210px;box-shadow:0 0 28px #f5b86644,inset 0 0 35px #b67fc559;overflow:hidden}.party-photo-header{text-align:center;font-size:12px;color:#fff1c9;letter-spacing:.12em}.party-photo-header strong{font-size:clamp(17px,5vw,28px)}.photo-party{display:flex;align-items:end;justify-content:space-between;gap:4px;height:135px;position:relative;z-index:2}.photo-party img{width:20%;max-height:126px;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 2px 10px #50d9eebb)}.photo-party img:nth-child(3){transform:translateY(-6px)}.photo-ghosts{position:absolute;top:40%;left:0;right:0;text-align:center;font-size:34px;letter-spacing:.65em;color:#c2f8ff;text-shadow:0 0 16px #81e7ff}.photo-caption{text-align:center;background:#0f163caa;padding:7px;font-size:10px;letter-spacing:.12em;color:#ffe9c5}
@keyframes allyDash{0%{translate:0 0}30%{translate:0 -55px;scale:1.25}55%{translate:10px -73px;filter:brightness(2)}100%{translate:0 0;scale:1}}
@keyframes allyCast{0%{translate:0 0}35%{translate:0 -18px;scale:1.15}65%{filter:brightness(3)}100%{translate:0 0}}
@keyframes allyProtect{0%{translate:0 0}40%{translate:0 -12px;filter:brightness(2)}100%{translate:0 0}}
@keyframes allyHurt{0%{translate:0 0}25%{translate:-9px 4px;filter:brightness(3)}50%{translate:9px 2px}100%{translate:0 0}}
@keyframes projectile{0%{left:25%;top:78%;opacity:1;scale:.5}70%{opacity:1}100%{left:50%;top:30%;opacity:0;scale:3}}
@keyframes slashTrail{0%{opacity:0;scale:.4}40%{opacity:1;scale:1.1}100%{opacity:0;scale:1.4}}
@keyframes barrierPulse{0%{opacity:0;scale:.4}38%{opacity:1;scale:1}100%{opacity:0;scale:1.35}}
@keyframes scanField{0%{opacity:0;translate:0 -40%}50%{opacity:1}100%{opacity:0;translate:0 40%}}
@keyframes healFloat{0%{opacity:0;translate:0 35px}55%{opacity:1}100%{opacity:0;translate:0 -40px}}
@keyframes bossLunge{0%{translate:0 0}35%{translate:0 24px;scale:1.25}60%{filter:brightness(3)}100%{translate:0 0}}
@keyframes bossFlinch{0%,100%{translate:0 0}30%{translate:-14px 6px;filter:brightness(5)}70%{translate:12px -3px}}
@keyframes transformation{0%{scale:.6;filter:brightness(6);opacity:.7}55%{scale:1.5;filter:brightness(5)}100%{scale:1;opacity:1}}
@keyframes bossEscape{0%{opacity:1;scale:1}100%{opacity:0;translate:0 -190px;scale:.15}}
@keyframes ghostSwirl{0%,100%{translate:0 45px;opacity:.6}50%{translate:0 -30px;opacity:1;rotate:12deg}}
@keyframes windowShatter{0%{opacity:1}40%{filter:brightness(4)}100%{opacity:0}}
@keyframes announceIn{from{opacity:0;translate:-60px 0}to{opacity:1;translate:0 0}}
@media(max-width:420px){.story-stage{inset:8% 1.5% 21%}.story-backdrop{padding:11px;min-height:32%}.story-backdrop p{max-width:95%}.story-controls button{font-size:11px;padding:7px 10px}.headbrand b{font-size:10px}.music-load{font-size:9px;padding:3px}.headbar{gap:5px;padding:4px 6px}.tactical-brief{font-size:9px}.battle-announcement{top:13%}}
@media(prefers-reduced-motion:reduce){.actor.perform-dash,.actor.perform-cast,.actor.perform-protect,.actor.perform-hit,.arena[data-boss-action='true'] .boss-art,.arena[data-anim='transform'] .boss-art,.arena[data-anim='escape'] .boss-art,.attack-vfx:before,.attack-vfx:after,.attack-vfx i{animation-duration:.001ms!important}}
.executor-armor,.override-crown{opacity:0;transition:opacity .6s,transform .7s;transform-origin:230px 145px}
.arena[data-form='1'] .executor-armor{opacity:1}
.arena[data-form='2'] .executor-armor{opacity:.9;transform:scale(1.05)}
.arena[data-form='2'] .override-crown{opacity:1;animation:overrideBreathe 1.7s ease-in-out infinite}
@keyframes overrideBreathe{50%{stroke:#f9ffff;filter:drop-shadow(0 0 12px #9deeff)}}
.arena[data-story]:not([data-story='live']) .threat-line,.arena[data-story]:not([data-story='live']) .meters,.arena[data-story]:not([data-story='live']) .party-topline,.arena[data-story]:not([data-story='live']) .tactical-brief,.arena[data-story]:not([data-story='live']) .turn-controls{opacity:.24;pointer-events:none}
.arena[data-story='quiet'] .party-stage{opacity:0}

/* v0.2.0: the blue shimmer forms a protective lattice BEFORE the Phoenix impact.
   This deliberately shares the visual motif with the discovery journey. */
.shimmer-window-web{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none;stroke:#91f4ff;stroke-width:4;fill:none;filter:drop-shadow(0 0 9px #5bf2ff);opacity:0;stroke-dasharray:11 14}
.shimmer-window-web circle{fill:#e5ffff;stroke:#4cf1ff;stroke-width:3}
.arena[data-story-kind='reinforce'] .shimmer-window-web,.arena[data-story-kind='strain'] .shimmer-window-web{opacity:1;animation:protectiveLattice 2s linear infinite}
.arena[data-story-kind='strain'] .shimmer-window-web{stroke:#c5ffff;filter:drop-shadow(0 0 17px #71dffc);animation-duration:.65s}
.arena[data-story-kind='reinforce'] .boss-art,.arena[data-story-kind='strain'] .boss-art{opacity:.08}
.arena[data-story-kind='strain'] .boss-art{opacity:.22;filter:blur(12px) drop-shadow(0 0 35px #b12eda)}
.arena[data-story-kind='shatter'] .shimmer-window-web{opacity:.3;stroke:#fbffff;animation:shatterLight .55s linear forwards}
@keyframes protectiveLattice{to{stroke-dashoffset:-140}}
@keyframes shatterLight{0%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1.5)}}
@media(prefers-reduced-motion:reduce){.shimmer-window-web{animation:none!important}}

/* The small, bright cabinet ghost returns when the Halloween haunting answers. */
.ghost-covenant .ghost-from-cabinet{display:flex;align-items:center;justify-content:center;color:#15213e;background:#c4ffff;border-radius:48% 48% 24% 24%;width:30px;height:30px;border:2px solid #82fbff;box-shadow:0 0 22px #67edff;transform:translateY(-4px)}
.ghost-covenant .ghost-from-cabinet i{font-style:normal;font:900 12px monospace;color:#283555;white-space:nowrap}

/* v0.2.1 · theatrical dialogue and readable, achievable Halloween finale */
.dialogue-help{display:inline-flex;align-items:center;color:#c8e7f5;font-size:10px;font-weight:650;line-height:1.3;max-width:185px;text-align:right}
.story-backdrop[data-voice='archivist']{border-left:4px solid #b3e8ff}
.story-backdrop[data-voice='rival']{border-left:4px solid #51f3db}
.story-backdrop[data-voice='gatekeeper']{border-left:4px solid #b5a2ff}
.story-backdrop[data-voice='ailuros']{border-left:4px solid #e37dff}
.story-backdrop p{min-height:3.6em;white-space:pre-wrap}
.story-stage .story-controls{align-items:center;flex-wrap:wrap}
.story-stage .story-controls button{flex-shrink:0}
.arena[data-story-kind='command'] .cyberscape-grid{opacity:1;animation:cyberscapeCommand 2.8s cubic-bezier(.2,.76,.2,1) both!important}
.arena[data-story-kind='command'] .boss-art{filter:drop-shadow(0 0 25px #ae68ff)!important}
@keyframes cyberscapeCommand{0%{opacity:0;transform:scale(1.2);filter:brightness(4)}35%{opacity:1;transform:scale(.98);filter:brightness(2.3)}75%,100%{opacity:1;transform:scale(1);filter:brightness(1)}}
.deployment-cutin{background:radial-gradient(ellipse,#315572ed 0%,#0a1940fa 63%,#070d19f9);box-shadow:0 0 80px #92f7ff,inset 0 0 100px #58a6ff99;border:3px solid #d3faff}
.deployment-cutin strong{text-shadow:0 0 14px white,0 0 40px #24dfff;animation:commandPulse .75s ease-in-out 3}
@keyframes commandPulse{0%,100%{transform:scale(.97)}50%{transform:scale(1.06)}}
.finisher-guide{z-index:7;position:absolute;top:35%;right:2%;left:2%;border:2px solid #fbd48f;background:#241632f5;color:#fff7e7;padding:10px 12px;box-shadow:0 0 32px #ba55e866;display:grid;gap:5px;pointer-events:none;text-align:center;border-radius:8px}
.finisher-guide[hidden]{display:none}
.finisher-guide strong{font-size:clamp(11px,3.2vw,17px);letter-spacing:.06em;color:#ffe7a7}
.finisher-guide span{font-size:clamp(10px,2.8vw,14px);line-height:1.3}
.arena[data-ghost-gather='true']:not([data-ghosts='true']) .ghost-covenant{opacity:.12;filter:drop-shadow(0 0 5px #9cefff)}
@media(max-width:420px){.dialogue-help{font-size:9px;max-width:150px}.finisher-guide{top:34%;padding:6px 9px}}
@media(prefers-reduced-motion:reduce){.arena[data-story-kind='command'] .cyberscape-grid,.deployment-cutin strong{animation:none}}

/* Keep the story dialogue card out of the commanding field cinematic. */
.story-stage[data-command-active="true"] .story-backdrop{opacity:0;pointer-events:none}


/* v0.2.2 — WIDE LIVING STAGE / INVERTED ARC / DEPTH CAMERA
   Same deterministic combat and canonical sprite placeholders.
   The player avatar is intentionally anonymous until character creation. */
.battle-app{max-width:1100px;background:#060d1c}
.headbar{z-index:20;background:#07192c;border-bottom-color:#286b8a}
.arena{background:#070d1c}
.form-head{flex-shrink:0;min-height:44px;padding:5px 11px;border-bottom:1px solid #7f4db5;background:linear-gradient(90deg,#081325fa,#1f1535dc)}
.boss-identity b{font-size:clamp(12px,3.2vw,17px)}
.scene{min-height:190px;flex:1;isolation:isolate;background:radial-gradient(ellipse at 50% 45%,#32204c 0%,#0a1330 65%,#080c17 100%)}
.scenic-backdrop{position:absolute;inset:0;background-image:linear-gradient(180deg,#050c18aa 0%,#09122624 40%,#050c17a8 100%),url('../assets/scenes/observatory-depth.webp');background-size:100% 100%;background-position:center;filter:saturate(1.08);z-index:0;pointer-events:none}
/* Keep the real stage environment and moon visible, not a second overlaid window. */
.window-arch{opacity:.22;inset:-5% 8% -4%;border-color:#3a4668;pointer-events:none}
.window-beam{opacity:.2}
.starfield{z-index:0;opacity:.26}
.moon{display:none} /* already present in the scenic painting */
.tower-columns{opacity:.26}
.battle-floor{height:40%;z-index:1;pointer-events:none;background:linear-gradient(transparent 2%,#1b1a3329 30%,#060b19aa 100%)}
.battle-floor:before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 10%,#76c9ff22 calc(10% + 1px),transparent calc(10% + 2px)),repeating-linear-gradient(0deg,transparent 0 18%,#7adfff19 calc(18% + 1px),transparent calc(18% + 2px));transform:perspective(170px) rotateX(33deg) scale(1.2);transform-origin:center bottom;opacity:.65}
.boss-art{z-index:2;top:8%;height:61%;width:min(68%,460px);scale:.72;filter:drop-shadow(0 0 20px #d679ff9e)}
.arena[data-form='1'] .boss-art{scale:1.08}
.arena[data-form='2'] .boss-art{scale:1.36;top:3%}
.cyberscape-paths{z-index:2;transform-origin:50% 100%}
.arena[data-cyberscape='active'] .cyberscape-paths{opacity:.7;transform:perspective(400px) rotateX(25deg) scale(1.03)}
.shimmer{z-index:3}
/* Actor buttons occupy world coordinates, not a second flat strip. The arc has
   its CENTER closest to camera (lower) and the outer defenders farther back. */
.party-stage{position:absolute;z-index:5;inset:0;width:100%;height:100%;pointer-events:none;isolation:isolate;overflow:visible}
.party-stage:before{display:none}
.party{position:absolute;inset:0;display:block;height:100%;pointer-events:none;opacity:1}
.party .actor{position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:end;gap:0;bottom:7%;width:18%;height:clamp(75px,21%,132px);background:transparent;border:1px solid transparent;border-radius:42% 42% 12px 12px;padding:0 0 2px;pointer-events:auto;z-index:5;transform:none!important;transition:filter .18s,background .18s;touch-action:manipulation}
.party .actor:nth-child(1){left:3%;bottom:23%;width:17%;z-index:4;scale:.84}
.party .actor:nth-child(2){left:21%;bottom:12%;width:18%;z-index:5;scale:.93}
.party .actor:nth-child(3){left:41%;bottom:3%;width:18%;z-index:6;scale:1.08}
.party .actor:nth-child(4){left:61%;bottom:12%;width:18%;z-index:5;scale:.93}
.party .actor:nth-child(5){left:81%;bottom:23%;width:17%;z-index:4;scale:.84}
.party .actor img{width:100%;height:calc(100% - 16px);max-height:135px;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 4px 1px #010712) drop-shadow(0 0 5px #74c2ff62);margin:auto auto 0;position:relative;pointer-events:none}
.party .actor:before{position:absolute;bottom:14px;left:17%;width:66%;height:12px;background:#55d1fa55;filter:blur(6px)}
.party .actor .name{font-size:clamp(9px,2.3vw,11px);line-height:1.2;max-width:100%;text-shadow:0 1px 3px black,0 0 8px #05060c,0 0 8px black;z-index:2}
.party .actor .life{display:none}
.party .actor .chosen{z-index:3;top:0;right:2px;font-size:10px;line-height:14px;background:#0b2347ee}
.party .actor.selected{background:radial-gradient(ellipse at bottom,#4cdeff41,transparent 70%);border-color:#a8f0ff88;filter:brightness(1.22)}
.party .actor.queued{border-color:#65fad488}
.party .actor.deploy-ready{border-color:#ffd08399}
.party .actor.intro-focus{filter:brightness(1.8) drop-shadow(0 0 12px #dcf9ff)}
.party .actor.down{filter:grayscale(1);opacity:.4}
/* Five compact character-identity/status panels. Battlefield actors remain interactive. */
.party-zone{z-index:6;flex-shrink:0;padding:5px 8px 8px;display:grid;gap:5px;overflow:visible;background:linear-gradient(180deg,#0a1830f3,#071425);border-top:1px solid #4d7191}
.party-topline{margin-bottom:0;font-size:9px}
.tactical-brief{font-size:10px;line-height:1.3;padding:4px 7px;margin:0;color:#efdaec;background:#1c1a37dc;border-left-color:#b75dfb;white-space:normal;max-height:2.9em;overflow:auto}
.party-status{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px}
.status-card{position:relative;min-width:0;height:66px;padding:2px 3px 4px;border:1px solid #31516d;border-radius:5px;background:linear-gradient(#102645,#081729);color:#e7f9ff;text-align:center;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;align-items:stretch;gap:0}
.status-card .status-art{position:absolute;inset:0 0 19px;overflow:hidden;opacity:.79;pointer-events:none;mask-image:linear-gradient(#000 38%,transparent 100%)}
.status-card .status-art img{height:125%;width:100%;object-fit:cover;object-position:center 22%;pointer-events:none}
.status-card .status-art.neutral{font-size:35px;display:grid;place-items:center;color:#95d9ee;text-shadow:0 0 15px #62dfff}
.status-card .status-num{position:absolute;top:2px;left:3px;z-index:2;border:1px solid #85acda;padding:0 3px;background:#0a1528dd;border-radius:2px;font-size:9px}
.status-card .status-name{font-size:clamp(8px,2.4vw,11px);z-index:1;font-weight:850;text-shadow:0 1px 2px #000,0 0 6px #000;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.status-card .status-hp{position:absolute;right:3px;top:2px;z-index:1;font-size:8px;color:#e3fffd;text-shadow:0 1px 3px black}
.status-card .status-life{height:4px;background:#15354b;border:1px solid #45657d;border-radius:4px;overflow:hidden;z-index:1;margin-top:2px}
.status-card .status-life i{display:block;height:100%;background:linear-gradient(90deg,#53c4b7,#a1f1cb)}
.status-card.selected{border-color:#f6c877;box-shadow:0 0 9px #ffd77b5c}
.status-card.queued{border-color:#77f8bfaa}
.status-card.down{filter:grayscale(1);opacity:.5}
.turn-controls{display:grid;grid-template-columns:1fr 1.25fr;gap:8px;margin-top:0}
.turn-controls button{min-height:36px}
/* Announcements and dialogue never cover the lower formation / HP strip. */
.battle-announcement{top:20%;left:3%;max-width:61%;right:auto;padding:6px 9px}
.battle-bark{bottom:50%;max-width:78%;font-size:11px;z-index:8;pointer-events:none}
.field-status{top:8px;right:9px;left:auto;font-size:9px}
.threat-line{min-height:34px;padding:3px 9px}
.meters{min-height:35px;padding:3px 9px}
.finisher-guide{position:relative;top:auto;right:auto;left:auto;order:3;z-index:7;border:1px solid #af7acb;border-radius:4px;padding:4px 6px;box-shadow:none;background:#231b36f3;text-align:left;pointer-events:none;gap:2px}
.finisher-guide strong{font-size:10px}
.finisher-guide span{font-size:10px}
.ability-panel{bottom:clamp(160px,24dvh,250px);max-height:min(42dvh,350px);border-color:#79bedc;background:#09162cf7;z-index:18;overflow:auto}
.ultimate-cutin,.deployment-cutin{inset:10% 3% 29%;z-index:12}
.story-stage{inset:9% 2% 22%;z-index:15}
/* Actor-specific movements: each returns to their own ground coordinate. */
.party .actor.perform-dash{animation:actorStrike .8s cubic-bezier(.2,.7,.25,1)!important}
.party .actor[data-actor='cat'].perform-dash{animation:catPounce .7s cubic-bezier(.2,.7,.25,1)!important}
.party .actor[data-actor='rival'].perform-dash{animation:rivalBreach .9s cubic-bezier(.1,.6,.5,1)!important}
.party .actor[data-actor='archivist'].perform-cast{animation:archivistLock 1s ease-out!important}
.party .actor[data-actor='gatekeeper'].perform-protect{animation:gatekeeperWard .95s ease-out!important}
.party .actor[data-actor='you'].perform-cast{animation:playerLink .85s ease-out!important}
@keyframes actorStrike{0%,100%{translate:0 0}25%{translate:0 -28%;scale:1.08}57%{translate:0 -48%;scale:1.18;filter:brightness(2)}}
@keyframes catPounce{0%,100%{translate:0 0}24%{translate:10px -20%;rotate:-10deg}55%{translate:23px -66%;scale:1.2;rotate:8deg}75%{translate:8px -26%}}
@keyframes rivalBreach{0%,100%{translate:0 0}18%{translate:-12px 0;filter:brightness(1.5)}40%{translate:-45px -65%;scale:1.27;filter:brightness(3) drop-shadow(0 0 19px #75f5ff)}62%{translate:22px -58%;filter:brightness(2)}85%{translate:8px -12%}}
@keyframes archivistLock{0%,100%{translate:0 0}30%{translate:0 -12%;filter:drop-shadow(0 0 9px #75d6ff)}65%{translate:0 -12%;filter:brightness(1.9) drop-shadow(0 0 16px #9edbff)}}
@keyframes gatekeeperWard{0%,100%{translate:0 0}24%{translate:0 -9%;scale:1.06}58%{filter:brightness(2) drop-shadow(0 0 15px #c7a3fa)}}
@keyframes playerLink{0%,100%{translate:0 0}30%{translate:0 -20%;filter:brightness(2)}60%{filter:drop-shadow(0 0 16px #92ebfa)}}
@media(min-width:720px){.party .actor{height:clamp(110px,24%,170px);max-width:140px}.party-zone{padding:8px 18px 10px}.status-card{height:82px}.scene{min-height:250px}.party .actor img{max-height:190px}.party .actor .name{font-size:12px}.ability-panel{bottom:210px}}
@media(max-width:420px){.status-card{height:58px}.status-card .status-hp{font-size:7px}.status-card .status-name{font-size:8px}.party .actor{height:clamp(70px,21%,111px)}.party .actor .name{font-size:9px}.boss-art{width:76%}.finisher-guide{padding:4px}.finisher-guide span{font-size:9px}.story-stage{inset:7% 2% 22%}}
@media(max-height:710px){.party-zone{gap:2px;padding:3px 7px 4px}.party-topline{font-size:8px}.tactical-brief{max-height:18px;white-space:nowrap}.status-card{height:44px}.status-card .status-art{inset:0 0 15px}.turn-controls button{min-height:30px}.scene{min-height:155px}.form-head{min-height:38px}.threat-line{min-height:29px}.meters{min-height:30px}.party .actor{height:clamp(65px,20%,95px)}.ability-panel{bottom:130px}}
@media(prefers-reduced-motion:reduce){.party .actor.perform-dash,.party .actor.perform-cast,.party .actor.perform-protect,.party .actor.perform-hit{animation:none!important}}

/* v0.2.2 final contrast and no tooltip prompts */
.scenic-backdrop{filter:saturate(1.3) brightness(1.25)}
.omen-hit-hint{display:none}
.party-status .status-card:focus-visible,.party .actor:focus-visible{outline:2px solid #ffc883;outline-offset:1px}
.attack-vfx{--launch-x:50%;--launch-y:82%}
.attack-vfx.fx-missiles i,.attack-vfx.fx-beam i,.attack-vfx.fx-projectile i{animation-name:worldProjectile}
@keyframes worldProjectile{0%{left:var(--launch-x);top:var(--launch-y);opacity:1;scale:.6}62%{opacity:1}100%{left:50%;top:42%;opacity:0;scale:2.3}}
.party .actor[data-actor='cat'].perform-cast{animation:catPounce .7s ease-out!important}
.party .actor[data-actor='rival'].perform-cast{animation:rivalBreach .85s ease-out!important}
.party .actor[data-actor='gatekeeper'].perform-cast{animation:gatekeeperWard .95s ease-out!important}
/* Keep spoken intro unobstructed while stage remains visible. */
.story-backdrop{background:linear-gradient(90deg,#081124f5,#0a1839e8 70%,#07122b55)}

/* v0.2.3 — PHOENIX BREACH ART PASS: the actual battle matches the cinematic goal.
   Environment, painted Phoenix, world actors and interactive HUD are separate layers. */
.battle-app{max-width:1080px;grid-template-rows:45px minmax(0,1fr) 22px;background:#050b1d}
.headbar{background:linear-gradient(90deg,#07182bf7,#0b1836);border-bottom:1px solid #3d79a7}
.headbrand b{font-weight:950;letter-spacing:.12em}
.arena{background:#080d1f}
.form-head{min-height:47px;box-shadow:0 1px 0 #a553f5;background:linear-gradient(90deg,#08112af8,#21133cf6)}
.form-number{font-size:10px}
.boss-identity b{font-size:clamp(13px,3.5vw,19px);letter-spacing:.05em}
.scene{min-height:210px;flex:1;background:#090e25;isolation:isolate}
.scenic-backdrop{background-image:linear-gradient(180deg,#04091811 0%,#080a1910 45%,#080a1c42 100%),url('../assets/scenes/observatory-stage-v023.webp');background-size:100% 100%;filter:saturate(1.32) brightness(1.27) contrast(1.05)}
.window-arch,.tower-columns{opacity:.08}
.battle-floor{height:42%;z-index:2;background:linear-gradient(transparent,#070b1c12 40%,#050c1f60)}
.battle-floor:before{opacity:.28}
.boss-art{opacity:0;pointer-events:none}
.boss-paint{position:absolute;left:50%;top:3%;width:min(100%,640px);height:69%;transform:translateX(-50%);object-fit:contain;z-index:3;pointer-events:none;filter:drop-shadow(0 0 16px #b76ffd9f) saturate(1.2);animation:phoenixHover 4s ease-in-out infinite;transition:filter .3s,opacity .3s}
@keyframes phoenixHover{0%,100%{translate:0 -2px}50%{translate:0 7px}}
.arena[data-form='1'] .boss-paint{scale:1.11;filter:drop-shadow(0 0 32px #f177f9) hue-rotate(14deg) saturate(1.4)}
.arena[data-form='2'] .boss-paint{scale:1.33;top:0;filter:drop-shadow(0 0 43px #f88af9) hue-rotate(27deg) saturate(1.7) brightness(1.22)}
.arena[data-story='quiet'] .boss-paint{opacity:0}
.arena[data-story-kind='reinforce'] .boss-paint,.arena[data-story-kind='strain'] .boss-paint{opacity:.08}
.arena[data-boss-action='true'] .boss-paint{animation:bossLunge .65s ease-in-out!important;filter:brightness(2) drop-shadow(0 0 40px #f89dfc)}
.arena[data-anim='impact'] .boss-paint{animation:bossFlinch .42s steps(3,end)!important}
.arena[data-anim='transform'] .boss-paint{animation:transformation 1.25s ease-in-out!important}
.arena[data-anim='escape'] .boss-paint{animation:bossEscape 1.5s forwards!important}
/* The inverted world-space arc lives on the stage, not in the HUD. */
.party .actor{bottom:7%;max-height:160px}
.party .actor:nth-child(1){left:0%;bottom:18%;width:20%;scale:.85}
.party .actor:nth-child(2){left:19%;bottom:9%;width:20%;scale:.96}
.party .actor:nth-child(3){left:40%;bottom:2%;width:20%;scale:1.10}
.party .actor:nth-child(4){left:61%;bottom:9%;width:20%;scale:.96}
.party .actor:nth-child(5){left:81%;bottom:18%;width:19%;scale:.85}
.party .actor img{height:calc(100% - 12px);max-height:160px;filter:drop-shadow(0 6px 2px #040513) drop-shadow(0 0 8px #68e3fcaa)}
.party .actor .name{font-size:10px}
.party .actor.selected{border-color:#80d8ff66;background:radial-gradient(ellipse at bottom,#63e7ff4b,transparent 68%)}
.party-zone{padding:5px 8px 6px;background:linear-gradient(180deg,#091831,#08132d 60%,#071125);border-top:1px solid #4478af;gap:4px}
.party-topline{display:none}
.tactical-brief{display:none}
.party-status{gap:4px}
.status-card{height:clamp(78px,12dvh,116px);background:#07172d;border:1px solid #4984bd;box-shadow:inset 0 0 0 1px #090f25,inset 0 0 15px #1865aa40;border-radius:3px;padding:2px 3px 5px}
.status-card .status-art{inset:0 0 24px;opacity:1;mask-image:linear-gradient(#000 78%,transparent 100%)}
.status-card .status-art img{height:112%;object-fit:cover;object-position:center 14%}
.status-card .status-art.neutral{font-size:45px;background:radial-gradient(circle at center,#43519a88,transparent)}
.status-card .status-name{font-size:clamp(9px,2.4vw,12px);letter-spacing:.01em}
.status-card .status-hp{top:auto;bottom:12px;left:2px;right:2px;font-size:8px;text-align:center}
.status-card .status-num{font-size:10px;border-color:#97d4ff;padding:0 4px}
.status-card .status-life{height:5px;margin-top:3px}
.status-card.queued{border-color:#71f4c3}
.status-card.selected{border-color:#ffe1a3;box-shadow:0 0 12px #f6c9819c}
.turn-controls{grid-template-columns:1.05fr 1fr .83fr 1.25fr;gap:4px;margin-top:2px}
.turn-controls button{min-height:43px;padding:4px 2px;font-size:clamp(9px,2.25vw,13px);letter-spacing:.04em;background:#0b1c39;border:1px solid #487db2;color:#e6efff}
.turn-controls button.primary{background:linear-gradient(#ecd69c,#c19b60);border:1px solid #f3d7a5;color:#171f34}
.turn-controls button:disabled{opacity:.43}
.threat-line{order:0;background:#160f2b;border-top:1px solid #9d4fd4;border-bottom:1px solid #5b477b;min-height:33px}
.threat-line b{font-size:10px;letter-spacing:.08em}
.meters{order:2;min-height:40px;background:linear-gradient(180deg,#09162d,#06101f);border-top:1px solid #275681;border-bottom:1px solid #275681}
.stat label{font-size:9px}
.field-status{font-size:9px;letter-spacing:.16em;border-color:#80eeff}
.battle-bark{bottom:42%;max-width:70%}
.footnote{font-size:9px;line-height:20px;padding:0 6px}
.ability-panel{bottom:clamp(155px,23dvh,265px);z-index:24}
/* A field command is sequential: Archivist departs, then the environment builds. */
.arena[data-story-kind='command'] .cyberscape-paths{opacity:0!important}
.arena[data-story-kind='command'][data-command-stage='field'] .cyberscape-paths{opacity:.9!important;animation:cyberscapeCommand 2.1s ease-out forwards}
.arena[data-story-kind='command'][data-command-stage='field'] .scenic-backdrop{animation:fieldAwakens 1.9s ease-out}
@keyframes fieldAwakens{0%{filter:brightness(.4) saturate(.4)}40%{filter:brightness(2) saturate(2)}100%{filter:brightness(1.27) saturate(1.32)}}
.arena[data-story-kind='command'][data-command-stage='voice'] .deployment-cutin{opacity:1}
@media(max-width:420px){.boss-paint{width:115%;height:66%;top:5%}.scene{min-height:200px}.party .actor{height:clamp(76px,22%,133px)}.status-card{height:clamp(78px,12dvh,104px)}.form-head{min-height:44px}.ability-panel{bottom:clamp(165px,27dvh,242px)}.status-card .status-name{font-size:9px}}
@media(max-height:710px){.status-card{height:72px}.turn-controls button{min-height:34px}.party-zone{padding:3px 6px}.party .actor{height:clamp(70px,21%,115px)}}
@media(prefers-reduced-motion:reduce){.boss-paint{animation:none!important}}

/* v0.2.4 — true actor-local VFX and world-space animated frames. */
.party .actor img{image-rendering:pixelated;image-rendering:crisp-edges;object-fit:contain;object-position:center bottom}
.party .actor{transform-origin:center 90%}
.party .actor.perform-cast img,.party .actor.perform-dash img{filter:drop-shadow(0 0 12px #a1f6ff) drop-shadow(0 6px 2px #030d20)}
/* The intro shards never return as an artificial border after field activation. */
.arena[data-cyberscape='active'] .broken-wall,.arena[data-cyberscape='active'] .window-arch,.arena[data-cyberscape='active'] .tower-columns,.arena[data-cyberscape='active'] .stone-debris{opacity:0!important}
.attack-vfx{--source-x:50%;--source-y:78%;--target-x:50%;--target-y:36%;--fx-tilt:-35deg}
.attack-vfx i{left:var(--source-x);top:var(--source-y);width:8px;height:8px;animation:lguflight .71s cubic-bezier(.2,.65,.18,.98) forwards}
@keyframes lguflight{0%{left:var(--source-x);top:var(--source-y);scale:.4;opacity:0}18%{scale:1.3;opacity:1}65%{scale:1.1;opacity:1}100%{left:var(--target-x);top:var(--target-y);scale:.3;opacity:0}}
.attack-vfx.fx-missiles i{border-radius:2px;width:5px;height:16px;background:linear-gradient(#f5ffff,#63dcff,#4056d5);box-shadow:0 0 9px #86fcff;animation-duration:.83s;animation-name:lguflight}
.attack-vfx.fx-beam i{border-radius:1px;background:#b2f4ff;box-shadow:0 0 17px #46c4ff;animation-name:lguflight}
.attack-vfx.fx-dash i,.attack-vfx.fx-slash i,.attack-vfx.fx-spacecut i{width:16px;height:3px;border-radius:0;background:#d6ffff;box-shadow:0 0 12px 5px #35b4df;animation-duration:.7s}
.attack-vfx.fx-spacecut i{background:#caffff;box-shadow:0 0 14px 5px #92f5ff}
.attack-vfx.fx-barrier:before,.attack-vfx.fx-protect:before,.attack-vfx.fx-defend:before{inset:auto;left:var(--source-x);top:var(--source-y);width:clamp(32px,9%,82px);height:clamp(32px,9%,82px);transform:translate(-50%,-50%);border:3px double #9aebff;box-shadow:0 0 17px #5ceaff;animation:actorWard .9s ease-out forwards}
@keyframes actorWard{0%{opacity:0;scale:.4}30%{opacity:1;scale:1.15}100%{opacity:0;scale:1.7}}
.attack-vfx.fx-slash:before,.attack-vfx.fx-spacecut:before{inset:auto;left:var(--target-x);top:var(--target-y);width:clamp(65px,33%,280px);height:30px;border-top:6px solid #7ef8ff;transform:translate(-50%,-50%) rotate(-26deg);animation:actorSlash .8s ease-out forwards;pointer-events:none}
.attack-vfx.fx-spacecut:after{inset:auto;left:var(--target-x);top:var(--target-y);width:clamp(55px,28%,250px);height:30px;border-top:5px solid #f7caff;transform:translate(-50%,-50%) rotate(33deg);animation:actorSlash .8s ease-out forwards}
@keyframes actorSlash{0%{opacity:0;scale:.15}35%{opacity:1;scale:1}100%{opacity:0;scale:1.2}}
.attack-vfx.fx-heal:before{left:calc(var(--source-x) - 70px);right:auto;bottom:auto;top:var(--source-y);width:140px}
.attack-vfx.fx-seal:before{content:'⌁';position:absolute;left:var(--target-x);top:var(--target-y);transform:translate(-50%,-50%);color:#7effff;font-size:65px;text-shadow:0 0 16px #60e5ff;animation:actorWard 1s forwards}
/* Ailuros effects originate at the boss, then travel outward; distinct from hero projectiles. */
.attack-vfx[data-origin="ailuros"] i{background:#ed7af5;box-shadow:0 0 12px #e987ff}
@media(max-width:420px){.party .actor img{max-height:165px;max-width:100%}}

/* v0.2.4: status labels occupy reserved HUD rows, never the illustration. */
.status-card{height:clamp(84px,12dvh,110px)}
.status-card .status-art{inset:0 0 29px;mask-image:linear-gradient(#000 55%,transparent 100%)}
.status-card .status-name{position:absolute;left:2px;right:2px;bottom:18px;height:13px;line-height:13px;background:#041020df;font-size:clamp(8px,2.2vw,11px);z-index:3}
.status-card .status-hp{position:absolute;bottom:8px;left:2px;right:2px;top:auto;font-size:8px;line-height:9px;text-align:center;background:#041020df;z-index:3}
.status-card .status-life{position:absolute;bottom:2px;left:4px;right:4px;height:4px;margin:0;z-index:3}
@media(max-width:420px){.status-card{height:clamp(86px,12.5dvh,106px)}}

/* v0.2.5 — signature ultimate choreography, no longer a normal attack recolored */
.arena[data-ultimate="archivist"] .scene{filter:saturate(1.22)}
.arena[data-ultimate="archivist"] .boss-paint{filter:drop-shadow(0 0 42px #72c9ff) brightness(1.34)}
.attack-vfx.fx-missiles-grand i{--spread:calc((var(--fx-i) - 6) * 3.8%);width:5px;height:24px;border-radius:2px;background:linear-gradient(#ffffff,#9cf7ff,#657bff);box-shadow:0 0 10px #00e8ff,0 0 25px #2690ff;left:calc(var(--source-x) + var(--spread));top:var(--source-y);animation:grandMissileFlight 1.35s cubic-bezier(.09,.23,.18,.98) forwards}
.attack-vfx.fx-missiles-grand:before{content:'◉ LOCKED ◉';position:absolute;left:var(--target-x);top:calc(var(--target-y) - 12%);transform:translateX(-50%);border:2px solid #b5fcff;padding:6px 12px;border-radius:9px;color:#c9fbff;font:bold 12px monospace;box-shadow:0 0 22px #4abfff;background:#08152dbe;animation:grandLock 1.65s both}
@keyframes grandMissileFlight{0%{opacity:0;transform:translateY(0) scale(.5)}12%{opacity:1;transform:translateY(-65px) scale(1)}40%{opacity:1;transform:translateY(-110px) rotate(45deg)}100%{opacity:0;left:var(--target-x);top:var(--target-y);transform:scale(2) rotate(115deg)}}
@keyframes grandLock{0%,100%{opacity:0;scale:.5}25%,77%{opacity:1;scale:1}}
.arena[data-ultimate="rival"] .scenic-backdrop{filter:saturate(.7) hue-rotate(14deg) brightness(.7)}
.arena[data-ultimate="rival"] .boss-paint{filter:drop-shadow(0 0 50px cyan) contrast(1.3)}
.attack-vfx.fx-space-rift:before,.attack-vfx.fx-space-rift:after{content:'';position:absolute;left:var(--target-x);top:var(--target-y);width:clamp(140px,70%,470px);height:6px;background:linear-gradient(90deg,transparent,#d7ffff 35%,#52e4ff 60%,transparent);box-shadow:0 0 25px #52e8ff,0 0 45px #a4eaff;transform-origin:center;animation:spaceTear 1.45s cubic-bezier(.1,.7,.2,1) forwards}
.attack-vfx.fx-space-rift:after{transform:rotate(-60deg);animation-name:spaceTearCross;animation-delay:.17s;background:linear-gradient(90deg,transparent,#f6c9ff,#fff,transparent)}
.attack-vfx.fx-space-rift i{left:var(--source-x);top:var(--source-y);width:22px;height:3px;background:#afffff;box-shadow:0 0 18px #39f4ff;animation:lguflight .74s ease-out forwards}
@keyframes spaceTear{0%{opacity:0;width:0;transform:translate(-50%,-50%) rotate(-22deg)}40%{opacity:1;width:80%;transform:translate(-50%,-50%) rotate(-22deg)}100%{opacity:0;width:93%;transform:translate(-50%,-50%) rotate(-22deg) scaleY(5)}}
@keyframes spaceTearCross{0%{opacity:0;width:0;transform:translate(-50%,-50%) rotate(42deg)}40%{opacity:1;width:72%;transform:translate(-50%,-50%) rotate(42deg)}100%{opacity:0;width:90%;transform:translate(-50%,-50%) rotate(42deg) scaleY(5)}}
.headbar #fullReset{font-size:9px;color:#b9e4e9;border:1px solid #477794;white-space:nowrap}
@media(max-width:420px){.headbar #fullReset{font-size:8px;padding:5px 3px}.headbrand small{font-size:8px}}
@media(prefers-reduced-motion:reduce){.attack-vfx.fx-missiles-grand i,.attack-vfx.fx-space-rift:before,.attack-vfx.fx-space-rift:after{animation-duration:.01ms!important}}

/* v0.2.6 // Actual entrances during the Observatory breach; defenders are not pre-assembled. */
.arena[data-story='intro'] .party{opacity:1}
.arena[data-story='quiet'] .party .actor,.arena[data-story='intro'] .party .actor:not([data-arrived='true']){opacity:0;visibility:hidden}
.arena[data-story='intro'] .party .actor[data-arrived='true']{opacity:1;visibility:visible}
.arena[data-story='intro'] .party .actor.hero-arrives{animation:heroBreaksIntoRoom 1.4s cubic-bezier(.17,.72,.24,1) both}
@keyframes heroBreaksIntoRoom{0%{opacity:0;translate:90px 50px;filter:brightness(2) blur(3px)}34%{opacity:1}68%{translate:-8px -4px;filter:brightness(1.45)}100%{translate:0 0;filter:none}}
.arena[data-story-kind$='arrive'] .boss-paint{filter:drop-shadow(0 0 19px #d26bfa) brightness(1.26)}
@media(prefers-reduced-motion:reduce){.arena[data-story='intro'] .party .actor.hero-arrives{animation:none;opacity:1;translate:0}}

.arena[data-story="arrival"] .party{opacity:0}

/* v0.3.0 — NATIVE BATTLE PRESENTATION FOUNDATION
 * No painted full-stage asset. Canvas builds the world + party from primitives;
 * SVG renders the boss separately; DOM remains accessible, responsive game UI.
 * These overrides intentionally replace the accumulated 0.2.x photo approximation.
 */
:root{--ink:#edfaff;--cyan:#97e9ff;--gold:#f3cd98;--violet:#b872ff}
html,body{background:#020713}
.battle-app{max-width:920px;min-height:0;height:100dvh;grid-template-rows:clamp(48px,7dvh,64px) minmax(0,1fr) 20px;border-left:1px solid #15324f;border-right:1px solid #15324f}
.headbar{z-index:25;padding:5px clamp(7px,2vw,18px);gap:clamp(4px,1.4vw,13px);border-bottom:1px solid #39688a;background:#08142bea}
.headbar .back{font-size:clamp(23px,5vw,32px);width:clamp(23px,5vw,32px)}
.headbrand b{font-size:clamp(11px,2.55vw,21px);line-height:1.1;letter-spacing:.095em;color:#a8ecff}
.headbrand em{color:#c2eaff}.headbrand small{font-size:clamp(8px,1.6vw,11px);letter-spacing:.17em;color:#8baeca}
.headbar .round{font-size:clamp(10px,2.3vw,17px);color:#f5c68a;white-space:nowrap;font-weight:900}
.headbar .flat,.headbar .music-load{font-size:clamp(9px,1.7vw,11px);background:#0a2037e9;border:1px solid #4b7191;color:#b8dafa;border-radius:5px;min-height:31px;padding:4px 7px}
.headbar #fullReset{font-size:9px;max-width:68px;line-height:1.1}
.headbar #logToggle{font-size:22px;min-width:37px;color:#80f2ff}
.arena{display:flex;flex-direction:column;min-height:0;overflow:hidden;position:relative;background:#050c20}
.form-head{order:0;display:flex;align-items:center;justify-content:space-between;flex-shrink:0;min-height:clamp(59px,9dvh,80px);padding:5px clamp(10px,2.5vw,24px);gap:12px;background:linear-gradient(110deg,#0d1425f9,#1a1032f6);border-bottom:1px solid #a954d9;box-shadow:inset 0 -1px 0 #bc76f52e}
.boss-identity{display:grid;gap:2px;min-width:0}.form-number{font-size:clamp(10px,2.1vw,13px);font-weight:900;letter-spacing:.12em;color:#f7c18c}
.boss-identity b{font-size:clamp(14px,3.5vw,27px);font-weight:1000;letter-spacing:.055em;line-height:1.18;color:#f8f2ff}
.boss-identity small{font-size:clamp(8px,1.5vw,11px);letter-spacing:.1em;color:#aeacd7}
.boss-health{flex:0 0 37%;min-width:88px;max-width:345px;align-self:center}
.boss-health span{font-size:clamp(10px,2.6vw,16px);font-weight:900;color:#f6d7fa;display:block;text-align:right;margin-bottom:6px}
.boss-meter{height:clamp(9px,1.75vw,14px);border:1px solid #cf5dcb;background:#190e2f;border-radius:100px;overflow:hidden}
.boss-meter i{background:linear-gradient(90deg,#9031eb,#e275dc,#f792b5);box-shadow:0 0 18px #b23ffe}
.scene{order:1;flex:1 1 auto;min-height:clamp(180px,28dvh,420px);position:relative;isolation:isolate;overflow:hidden;background:#070e29}
.field-canvas{display:block;position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}
.scenic-backdrop,.starfield,.moon,.tower-columns,.window-arch,.broken-wall,.stone-debris,.battle-floor,.cyberscape-paths,.boss-paint{display:none!important}
.boss-art{display:block!important;position:absolute;z-index:4;left:50%;top:12%;width:clamp(180px,73%,590px);height:clamp(150px,50%,360px);object-fit:contain;transform:translateX(-50%);scale:1!important;opacity:1!important;filter:drop-shadow(0 0 17px #ca66ff) drop-shadow(0 0 48px #622de855);transition:filter .25s,opacity .35s}
.boss-art .wing-pair{transform-origin:230px 154px;animation:wingPulse 3.6s ease-in-out infinite alternate}
@keyframes wingPulse{0%{transform:scaleX(.95) rotate(-1deg)}100%{transform:scaleX(1.035) rotate(1deg)}}
.arena[data-form='1'] .boss-art{scale:1.12!important;top:9%;filter:drop-shadow(0 0 22px #f565ff) drop-shadow(0 0 55px #cf56d355)}
.arena[data-form='2'] .boss-art{scale:1.21!important;top:7%;filter:drop-shadow(0 0 28px #fba6ff) drop-shadow(0 0 65px #b549e855)}
.arena[data-story='quiet'] .boss-art{opacity:.0!important}
.arena[data-story-kind='reinforce'] .boss-art,.arena[data-story-kind='strain'] .boss-art{opacity:.09!important}
.arena[data-story-kind='shatter'] .boss-art{opacity:.15!important}
.party-stage{position:absolute;z-index:8;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.party{position:absolute;inset:0;height:100%;display:block;opacity:1!important;pointer-events:none}
.party .actor,.party .actor:nth-child(n){position:absolute;bottom:0;left:auto;top:auto;width:20%;height:35%;min-height:50px;max-height:none;transform:none!important;scale:1!important;box-shadow:none!important;outline:0;background:transparent!important;border:0!important;color:transparent!important;opacity:1;pointer-events:auto;z-index:9;touch-action:manipulation}
.party .actor:nth-child(1){left:0%;bottom:9%}.party .actor:nth-child(2){left:20%;bottom:6%}.party .actor:nth-child(3){left:40%;bottom:2%}.party .actor:nth-child(4){left:60%;bottom:6%}.party .actor:nth-child(5){left:80%;bottom:9%}
.party .actor img,.party .actor .name,.party .actor .life,.party .actor .chosen,.party .actor::before{display:none!important}
.party .actor:focus-visible{outline:2px solid #9eeeff!important;border-radius:20px!important}
.party .actor:disabled{pointer-events:none}
.party .actor.perform-dash,.party .actor.perform-cast,.party .actor.perform-protect,.party .actor.perform-hit{animation:none!important}
.ghost-covenant{z-index:10}.attack-vfx{z-index:11}.shimmer{z-index:10}
.field-status{position:absolute;z-index:12;right:8px;bottom:8px;left:auto;top:auto;background:#050e25b8;padding:4px 6px;font-size:clamp(8px,1.7vw,10px);border:1px solid #57b5d7;letter-spacing:.11em}
.impact-text,.battle-bark,.world-alert{z-index:13}
.threat-line{order:2;flex-shrink:0;min-height:clamp(34px,5dvh,43px);display:flex;align-items:center;background:#12102b;border-top:1px solid #b64ccd;border-bottom:1px solid #644984;padding:4px 10px}
.threat-line b{font-size:clamp(10px,2.2vw,14px);letter-spacing:.07em}.threat-line small{font-size:clamp(8px,1.5vw,11px)}
.party-zone{order:3;flex-shrink:0;padding:clamp(5px,1vw,9px);display:grid;gap:5px;background:linear-gradient(#07162cf7,#08132a);border-top:1px solid #384f84;z-index:13;overflow:visible}
.party-topline{display:flex;font-size:9px;letter-spacing:.1em;color:#8eaee0;margin:0}
.tactical-brief{display:block;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;max-height:20px;padding:3px 7px;border-left:2px solid #a677eb;font-size:10px;line-height:14px;color:#d6d3f6;background:#131a39}
.party-status{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(3px,1.1vw,9px)}
.status-card{position:relative;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-end;gap:2px;overflow:hidden;min-width:0;height:clamp(85px,14.3dvh,160px);padding:3px 4px 6px;background:#07162e;border:1px solid #5a87be;border-radius:6px;box-shadow:inset 0 0 0 1px #182e4b}
.status-card .status-art{position:absolute;inset:0 0 23px;opacity:1;mask-image:linear-gradient(black 72%,transparent)}
.status-card .status-art img{width:100%;height:108%;object-fit:cover;object-position:center 15%}
.status-card .status-art.neutral{display:grid;place-items:center;background:radial-gradient(circle at 50% 50%,#5d4bab,#151f3a);font-size:clamp(28px,7vw,60px)}
.status-card .status-name{z-index:1;font-size:clamp(8px,2.4vw,16px);font-weight:850;line-height:1.2;text-align:left;color:white;text-shadow:0 1px 5px black;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.status-card .status-num{top:3px;left:3px;z-index:2;background:#071529ee;border:1px solid #9be7ff;color:#aaf3ff;font-size:clamp(10px,2vw,14px);padding:0px 5px;border-radius:3px}
.status-card .status-hp{z-index:1;position:relative;bottom:auto;left:auto;right:auto;text-align:center;font-size:clamp(8px,1.7vw,12px);color:#d9f0ff;letter-spacing:.04em}
.status-card .status-life{position:relative;z-index:1;height:6px;left:auto;right:auto;bottom:auto;display:block;border-radius:8px;background:#13294d;border:1px solid #64afdf}
.status-card .status-life i{display:block;height:100%;background:linear-gradient(90deg,#4ccaaa,#a6fff4)}
.status-card.queued{border-color:#92f9cc;box-shadow:0 0 12px #5beac34b}
.status-card.selected{border-color:#fff5a8;box-shadow:0 0 12px #ffd67d8c}
.status-card.down{filter:grayscale(1);opacity:.65}
.turn-controls{display:grid;grid-template-columns:1.1fr 1fr 1fr 1.35fr;gap:clamp(3px,1vw,9px);margin:0}
.turn-controls button{min-height:clamp(41px,6dvh,61px);font-size:clamp(10px,2.3vw,14px);font-weight:850;letter-spacing:.07em;padding:4px 3px;color:#e3f5ff;background:#0a2042;border:1px solid #517db2;border-radius:7px}
.turn-controls button#actionQuick{background:#102c6a;border-color:#64acff;box-shadow:inset 0 0 17px #276dfd5c,0 0 5px #427dff55;color:#eaf9ff}
.turn-controls button#execute{background:linear-gradient(#efcb88,#b69463);color:#181e30;border-color:#ffe6b5;box-shadow:0 0 11px #ffcf6a42}
.turn-controls button:disabled{opacity:.47}
.meters{order:4;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(9px,2.5vw,22px);align-items:center;flex-shrink:0;padding:7px clamp(9px,2.5vw,26px);min-height:clamp(48px,7dvh,70px);background:#081427;border-top:1px solid #385779;border-bottom:1px solid #254d79}
.meters .stat{min-width:0}.meters label{display:flex;justify-content:space-between;gap:4px;font-size:clamp(8px,2vw,12px);letter-spacing:.1em;color:#cbeaff}
.meters .meter{height:clamp(8px,1.6vw,13px);border-radius:100px;border:1px solid #366aa0;margin-top:5px;background:#0a1834;overflow:hidden}
.meters .meter i{background:linear-gradient(90deg,#39a5cc,#84f4f5)}
.meters .stat:nth-child(2) .meter i{background:linear-gradient(90deg,#508ce9,#a29aff)}
.meters .stat:nth-child(3) .meter i{background:linear-gradient(90deg,#d061b0,#ec9f91)}
.ability-panel{z-index:30;bottom:clamp(175px,25dvh,305px);max-height:45dvh;max-width:min(95%,650px);left:50%;transform:translateX(-50%);box-shadow:0 8px 35px #000e}
.story-stage{z-index:27;inset:7% 2% 24%;pointer-events:none}.story-stage .story-backdrop,.story-stage .story-controls{pointer-events:auto}
.story-backdrop{min-height:37%;background:linear-gradient(95deg,#07152bed,#0c1b38dd 68%,#11162a9c);border:1px solid #8ccdf8;border-left:4px solid #6ceaff;box-shadow:0 0 40px #010717c9}
.story-stage .story-controls{justify-content:space-between;align-items:center}
.story-stage .story-controls button{min-height:44px}
.outcome-overlay,.party-after,.log-drawer{z-index:45}
.finisher-guide{z-index:23}
.footnote{background:#040e1e;border-top:1px solid #21486f;color:#94b0cb;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;font-size:9px;line-height:20px}
@media(max-width:460px){
 .headbar{gap:4px}.headbar #fullReset{display:none}.headbar .music-load{padding:4px}.headbar #soundToggle{font-size:9px;padding:4px}
 .boss-identity small{display:none}.form-head{gap:8px}.boss-health{flex-basis:34%}
 .party-topline{font-size:8px}.tactical-brief{font-size:8px}
 .status-card .status-name{letter-spacing:-.03em}.status-card{padding:2px 2px 4px}
 .threat-line small{max-height:16px;overflow:hidden}
 .story-backdrop p{max-width:94%}
 .story-controls .dialogue-help{display:none}
 .story-stage{inset:7% 1.5% 23%}
}
@media(max-height:690px){
 .headbar{padding-block:2px}.form-head{min-height:50px}.scene{min-height:150px}
 .status-card{height:75px}.party-zone{padding:3px;gap:3px}.party-topline,.tactical-brief{display:none}
 .turn-controls button{min-height:35px}.meters{min-height:41px;padding:4px 7px}
}
@media(prefers-reduced-motion:reduce){.boss-art .wing-pair{animation:none!important}}

/* Precise card label slots: do not allow older absolute-position rules to overlap. */
.status-card .status-name{position:absolute;left:3px;right:3px;top:auto;bottom:21px;height:auto;min-height:14px;line-height:14px;background:#06122bd9;z-index:3;font-size:clamp(8px,1.9vw,12px);padding:0 2px}
.status-card .status-hp{position:absolute;left:3px;right:3px;top:auto;bottom:9px;height:11px;line-height:11px;background:#06122bd9;z-index:3;margin:0;font-size:clamp(8px,1.5vw,11px)}
.status-card .status-life{position:absolute;left:4px;right:4px;bottom:3px;height:5px;z-index:3;margin:0;width:auto}
@media(max-width:460px){.status-card .status-name{font-size:9px;letter-spacing:-.045em;padding:0 1px}.status-card .status-hp{font-size:8px}}

@media(max-width:460px){.headbar #fullReset{display:inline-flex!important;align-items:center;justify-content:center;min-width:25px;width:25px;max-width:25px!important;font-size:0!important;padding:0!important}.headbar #fullReset::before{content:'↻';font-size:17px;color:#aee9ff}}
