.battle-body{display:block;position:relative;isolation:isolate}.battle-body:after{content:'';position:absolute;left:17%;right:17%;bottom:-2px;height:10px;border-radius:50%;background:#694a3950;filter:blur(3px);z-index:-1}.battle-motion{display:block;position:relative;transform-origin:50% 85%;will-change:transform}.unit .sprite{animation:combat-idle 2.7s ease-in-out infinite;transform-origin:50% 90%;will-change:transform}.unit:nth-child(2) .sprite{animation-duration:3.2s;animation-delay:-1.1s}.unit:nth-child(3) .sprite{animation-duration:2.9s;animation-delay:-1.8s}.enemies .unit .sprite{animation-duration:3.6s}.acting .sprite{animation-play-state:paused}.unit.acting{z-index:15}.side{position:relative}.shield-dome{position:absolute;inset:-8% -7% -3%;border-radius:50% 50% 43% 43%;border:2px solid #a2efffa6;background:radial-gradient(ellipse at 30% 20%,#dbfaff33,transparent 55%,#71d9ff30);box-shadow:inset 0 -4px 15px #6fcded60,0 0 10px #88dcff55;opacity:0;transition:opacity .3s;pointer-events:none;z-index:4}.shielded .shield-dome{opacity:.8}.shield-casting .shield-dome{opacity:1;box-shadow:0 0 25px #9beaef,inset 0 0 18px #c3f9ff}.shield-readout{position:absolute;right:7px;top:40px;z-index:8;color:#eefcff;background:#257aa3;border:1px solid #a8eeff;border-radius:7px;font-size:10px;font-weight:bold;padding:3px 6px}.combat-fx{position:absolute;inset:0;z-index:25;pointer-events:none;width:100%;height:100%}.combat-number{position:absolute;z-index:40;left:50%;top:35%;pointer-events:none;font-size:27px;font-weight:1000;color:#fff1d3;text-shadow:2px 2px #78342c,-1px -1px #78342c,1px -1px #78342c,-1px 1px #78342c;white-space:nowrap}.combat-number.heal{color:#b8ffd2;text-shadow:2px 2px #266650,-1px -1px #266650}.combat-number.block{color:#d9f8ff;font-size:19px;text-shadow:2px 2px #235d86}.combat-number.status{font-size:11px;color:#f8eeff;top:22%;text-shadow:1px 1px #6f4381}.unit.healing .sprite{filter:drop-shadow(0 0 10px #a7ffb3)}.unit.support-casting .sprite{filter:drop-shadow(0 0 9px #a9e6ff)}.unit.burning .battle-body:before,.unit.poisoned .battle-body:before{content:'';position:absolute;inset:35% -5% -10%;background:radial-gradient(ellipse at 50% 100%,#ff9c3038,transparent 65%);z-index:-1}.unit.poisoned .battle-body:before{background:radial-gradient(ellipse at 50% 100%,#c986f742,transparent 65%)}.round-playing .phase{color:#fff9d7;background:#4b5363e8;box-shadow:0 2px 9px #22384035;font-size:11px;max-width:48%;text-align:center}.unit.defeated .sprite{animation:none}.battle-toolbar{display:flex;gap:8px;justify-content:center;margin:0 0 12px}.battle-toolbar button{border:1px solid #ccb58a;background:#fff7de;border-radius:10px;padding:7px 12px;color:#796143;font-size:11px;min-height:32px}.round-playing .unit{cursor:default}.round-playing .hp-track i{transition:width .25s ease-out}.round-playing .ability.queued-card{outline-color:#bfac71}.battle-toolbar button[aria-pressed=false]{opacity:.65}@keyframes combat-idle{0%,100%{transform:translateY(0) rotate(-1deg) scale(1.01,.99)}50%{transform:translateY(-4px) rotate(1deg) scale(.99,1.025)}}@media(max-width:600px){.combat-number{font-size:20px}.combat-number.block{font-size:13px}.combat-number.status{font-size:8px}.shield-readout{font-size:7px;padding:2px 4px;right:0;top:27px}.round-playing .phase{font-size:8px;max-width:45%;padding:6px}.battle-toolbar{margin-bottom:9px}.battle-toolbar button{font-size:10px;padding:6px 10px}.shield-dome{border-width:1px}.battle-body:after{height:5px}}@media(prefers-reduced-motion:reduce){.unit .sprite{animation:none!important}.battle-motion,.shield-dome{will-change:auto;transition:none}.combat-fx{display:none}}

/* Face the opposing team; keep motion and readable UI independent. */
.enemies .villain img{transform:scaleX(-1)}

/* Card previews keep play order visible without text-only chips. */
#plan{gap:10px;padding:8px 3px 2px;align-items:flex-start}.plan-wrap{min-width:0}.queued-thumbnail{position:relative;flex:0 0 78px;width:78px;display:flex;flex-direction:column;padding:0;border:2px solid #785238;border-bottom:4px solid #785238;border-radius:9px;background:#fff5d8;box-shadow:0 2px 0 #cfb68a;overflow:visible;isolation:isolate;transition:transform .15s}.queued-thumbnail:hover:not(:disabled){transform:translateY(-4px)}.queued-thumbnail:disabled{cursor:default}.queued-thumbnail span{margin:0}.queued-thumbnail .queue-order{position:absolute;left:-6px;top:-10px;width:22px;height:22px;border-radius:50%;border:2px solid #fff8df;background:#236e69;color:#fff8df;font-size:11px;font-weight:900;display:grid;place-items:center;z-index:5;box-shadow:0 1px 3px #593e3c50}.queued-thumbnail .mini-energy{position:absolute;left:3px;top:4px;background:#37a8d3;color:#fff8e2;border:1px solid #356783;border-radius:50%;width:16px;height:16px;font-size:10px;font-weight:900;display:grid;place-items:center;z-index:3}.mini-title{display:flex;align-items:center;justify-content:center;height:29px;padding:3px 4px 3px 19px;background:var(--hero-color);color:#523326;font-size:8px;font-weight:900;line-height:1.1;overflow:hidden;border-radius:6px 6px 0 0;width:100%}.mini-art{display:block;height:47px;background:linear-gradient(145deg,#fff4c8,var(--hero-color));overflow:hidden;padding:4px;width:100%}.mini-art .sprite{width:100%;height:auto;aspect-ratio:var(--ratio,1.6)}.mini-values{display:flex;width:100%;color:#fff5df;font-size:10px;font-weight:900;border-top:1px solid #785238}.mini-values span{width:50%;padding:2px 0}.mini-values span:first-child{background:#bf6454}.mini-values span:last-child{background:#4289b2}.mini-owner{display:block;width:100%;background:var(--hero-color);font-size:7px;font-weight:900;padding:3px;color:#513627;border-radius:0 0 5px 5px}.queued-thumbnail .mini-remove{position:absolute;right:-6px;top:-9px;width:18px;height:18px;display:grid;place-items:center;border:1px solid #a97d5b;border-radius:50%;background:#fff8e6;color:#855339;font-size:13px;z-index:5}.selection-notice{display:flex;align-items:center;gap:14px;margin:0 0 15px;padding:17px 20px;border:2px solid #b88e2f;border-bottom:5px solid #9a6d2f;border-radius:16px;background:linear-gradient(115deg,#ffe69c,#fff1c4);box-shadow:0 4px 14px #bb8f3420;animation:choose-notice .6s ease-out}.selection-icon{font-size:32px;color:#bc8826;line-height:1}.selection-notice strong{display:block;font-size:21px;letter-spacing:1px;color:#63411f}.selection-notice div>span{display:block;margin-top:5px;font-size:12px;color:#806235}.selection-notice.resolving{background:#e5efd9;border-color:#82a990;border-bottom-color:#59846e}.selection-notice.resolving strong{color:#386653}.selection-notice.resolving .selection-icon{color:#568d76}.selection-notice.resolving div>span{color:#557360}@keyframes choose-notice{0%{transform:translateY(8px);box-shadow:0 0 0 7px #ffdd7540}100%{transform:translateY(0);box-shadow:0 4px 14px #bb8f3420}}@media(max-width:600px){.queued-thumbnail{flex-basis:69px;width:69px}.mini-title{font-size:7px}.mini-art{height:41px}#plan{gap:9px}.selection-notice{padding:13px 14px;gap:10px;margin-bottom:12px}.selection-notice strong{font-size:17px;letter-spacing:.6px}.selection-notice div>span{font-size:11px;line-height:1.4}.selection-icon{font-size:25px}.battle-controls{align-items:flex-start}}@media(prefers-reduced-motion:reduce){.selection-notice{animation:none}}
.queued-thumbnail .mini-title{font-size:8px}.queued-thumbnail .mini-values,.queued-thumbnail .mini-values span{font-size:10px}.queued-thumbnail .mini-owner{font-size:7px}@media(max-width:600px){.queued-thumbnail .mini-title{font-size:7px}}