/* Decorative combat layer: below HUD/panels, no pointer/focus interception. */
.combat-effects { position:absolute; inset:0; z-index:13; overflow:hidden; pointer-events:none; contain:layout style paint; }
.combat-effects * { pointer-events:none !important; }
.combat-effects .combat-impact{width:110px;height:110px;opacity:.9;animation:combat-local-impact .36s ease-out both}
.combat-impact .combat-drawing{stroke-width:5}
.combat-impact-label{position:absolute;left:0;right:0;bottom:-5px;text-align:center;font:700 12px/1.4 var(--sans);text-shadow:0 2px 3px #000;color:var(--combat-color)}
@keyframes combat-local-impact{from{opacity:1;scale:.9}to{opacity:0;scale:1.05}}
.combat-effects[data-reduced-motion=true] .combat-impact{animation:none}
#screen-ar.ar-v47 #ghost-wrap.hit #ghost-img{animation:combat-local-flash .16s ease-out}
@keyframes combat-local-flash{from{filter:brightness(1.4) drop-shadow(0 0 5px #fff1c8)}to{filter:brightness(1)}}
.reduced-motion #screen-ar.ar-v47 #ghost-wrap.hit #ghost-img{animation:none}
@media(prefers-reduced-motion:reduce){#screen-ar.ar-v47 #ghost-wrap.hit #ghost-img{animation:none}}
.combat-effect { position:absolute; width:clamp(156px, 42vw, 264px); aspect-ratio:1; transform:translate(-50%,-50%); color:var(--combat-color); opacity:.95; }
.combat-drawing { display:block; width:100%; height:100%; overflow:visible; }
.combat-outline { stroke-width:2.5; opacity:.86; }
.combat-mark { fill:var(--combat-color); fill-opacity:.12; stroke-width:2; }
.combat-telegraph .combat-drawing { animation:combat-gather var(--combat-duration) linear both; opacity:.72; }
.combat-warning-ring { opacity:.64; stroke-width:2; }
.combat-warning-progress { stroke-width:3; opacity:.9; animation:combat-warning-countdown var(--combat-duration) linear both; }
.combat-telegraph .combat-layer-enemy-form { opacity:.5; }
.combat-layer-enemy-ground { transform-box:view-box; transform-origin:50% 86%; }
.combat-attack .combat-layer-enemy-ground { animation:combat-enemy-ground var(--combat-duration) ease-out both; }
.combat-attack .combat-layer-enemy-impact { animation:combat-enemy-impact var(--combat-duration) ease-out both; }
.combat-attack .combat-layer-enemy-form { filter:drop-shadow(0 0 1.5px var(--combat-color)); }
.combat-attack[data-variant="1"] .combat-layer-enemy-form { animation:combat-form-cross var(--combat-duration) ease-out both; }
.combat-attack[data-variant="2"] .combat-layer-enemy-form { animation:combat-form-bloom var(--combat-duration) ease-out both; }
.combat-attack .combat-drawing { animation:combat-impact var(--combat-duration) ease-out both; }
.combat-attack[data-pattern="wave"] .combat-drawing { animation-name:combat-wave; }
.combat-attack[data-pattern="root"] .combat-drawing { transform-origin:50% 100%; animation-name:combat-root; }
.combat-attack[data-pattern="slash"] .combat-drawing { animation-name:combat-slash; }
.combat-attack[data-pattern="orbit"] .combat-drawing, .combat-attack[data-pattern="sigil"] .combat-drawing { animation-name:combat-orbit; }
.combat-attack[data-pattern="charge"] .combat-drawing { animation-name:combat-charge; }
.combat-attack[data-pattern="veil"] .combat-drawing, .combat-attack[data-pattern="cloud"] .combat-drawing { animation-name:combat-mist; }
.combat-attack[data-pattern="flame"] .combat-drawing { animation-name:combat-flame; }
.combat-attack[data-pattern="trail"] .combat-drawing { animation-name:combat-trail; }
.combat-attack[data-pattern="mirror"] .combat-drawing { animation-name:combat-mirror; }
.combat-counter .combat-drawing { animation:combat-ward var(--combat-duration) ease-out both; }
.combat-tool .combat-drawing { animation:combat-tool-impact var(--combat-duration) ease-out both; }
.combat-tool .combat-drawing, .combat-skill .combat-drawing { filter:drop-shadow(0 0 3px var(--combat-color)); }
.combat-tool[data-pattern="resonate"] .combat-drawing { animation-name:combat-impact; }
.combat-tool[data-pattern="sweep"] .combat-drawing, .combat-tool[data-pattern="cut"] .combat-drawing { animation-name:combat-slash; }
.combat-tool[data-pattern="heal"] .combat-drawing { animation-name:combat-wave; }
.combat-tool[data-pattern="ward"] .combat-drawing { animation-name:combat-ward; }
.combat-tool[data-pattern="chains"] .combat-drawing { animation:combat-skill-reveal var(--combat-duration) ease-out both; }
.combat-skill { width:clamp(216px, 64vw, 338px); }
.combat-skill .combat-drawing { animation:combat-skill-reveal var(--combat-duration) ease-out both; }
.combat-scene-layer { transform-box:view-box; transform-origin:50% 50%; }
.combat-layer-ground { animation:combat-ground-spread var(--combat-duration) ease-out both; }
.combat-layer-rings { animation:combat-binding-turn var(--combat-duration) ease-out both; }
.combat-layer-threads, .combat-layer-charms { animation:combat-binding-close var(--combat-duration) cubic-bezier(.2,.75,.3,1) both; }
.combat-layer-fan, .combat-layer-trails { animation:combat-strike-fan var(--combat-duration) cubic-bezier(.15,.7,.2,1) both; }
.combat-layer-impact, .combat-layer-pulse { animation:combat-sigil-pulse var(--combat-duration) ease-out both; }
.combat-layer-shield, .combat-layer-lattice { animation:combat-shield-rise var(--combat-duration) ease-out both; }
.combat-layer-chains { animation:combat-chain-close var(--combat-duration) ease-out both; }
.combat-layer-frost-charm { animation:combat-charm-settle var(--combat-duration) ease-out both; }
.combat-tool-image { position:absolute; width:62px; height:62px; object-fit:contain; left:calc(50% - 31px); top:calc(50% - 31px); border-radius:16px; animation:combat-tool-throw var(--combat-duration) ease-out both; }
.combat-tool[data-pattern="ward"] .combat-tool-image, .combat-tool[data-pattern="heal"] .combat-tool-image { animation-name:combat-tool-hold; }
@keyframes combat-gather { from { transform:scale(1.16); opacity:.25; } to { transform:scale(.95); opacity:.83; } }
@keyframes combat-warning-countdown { from { stroke-dashoffset:0; } to { stroke-dashoffset:100; } }
@keyframes combat-enemy-ground { from { transform:scaleX(.55); opacity:.2; } 35% { opacity:.65; } to { transform:scaleX(1.12); opacity:0; } }
@keyframes combat-enemy-impact { 0%,18% { transform:scale(.6); opacity:0; } 36% { opacity:.8; } to { transform:scale(1.1); opacity:0; } }
@keyframes combat-form-cross { from { transform:rotate(-12deg); } to { transform:rotate(8deg); } }
@keyframes combat-form-bloom { from { transform:scale(.85); } 40% { transform:scale(1.04); } to { transform:scale(1.12); } }
@keyframes combat-impact { 0% { transform:scale(.56); opacity:0; } 22% { opacity:1; } 100% { transform:scale(1.38); opacity:0; } }
@keyframes combat-wave { 0% { transform:translateY(-25px) scaleX(.65); opacity:0; } 25% { opacity:.95; } 100% { transform:translateY(72px) scaleX(1.3); opacity:0; } }
@keyframes combat-root { 0% { transform:scaleY(.08); opacity:0; } 38% { transform:scaleY(1); opacity:1; } 100% { transform:scaleY(1.09); opacity:0; } }
@keyframes combat-slash { 0% { transform:translate(32px,-30px) rotate(-20deg) scale(.7); opacity:0; } 28% { opacity:1; } 100% { transform:translate(-24px,24px) rotate(12deg) scale(1.12); opacity:0; } }
@keyframes combat-orbit { 0% { transform:rotate(-40deg) scale(.65); opacity:0; } 25% { opacity:1; } 100% { transform:rotate(45deg) scale(1.12); opacity:0; } }
@keyframes combat-charge { 0% { transform:translateY(-55px) scale(.4); opacity:0; } 28% { opacity:1; } 100% { transform:translateY(90px) scale(1.6); opacity:0; } }
@keyframes combat-mist { 0% { transform:scale(.7); opacity:0; } 35% { opacity:.6; } 100% { transform:scale(1.45); opacity:0; } }
@keyframes combat-flame { 0% { transform:translateY(25px) scaleY(.35); opacity:0; } 30% { opacity:1; } 100% { transform:translateY(-30px) scaleY(1.3); opacity:0; } }
@keyframes combat-trail { 0% { transform:translateY(-45px); opacity:0; } 30% { opacity:1; } 100% { transform:translateY(55px); opacity:0; } }
@keyframes combat-mirror { 0% { transform:scale(.8); opacity:0; } 30% { transform:scale(1); opacity:1; } 100% { transform:scale(1.3) rotate(12deg); opacity:0; } }
@keyframes combat-ward { 0% { transform:scale(.8); opacity:0; } 25%,65% { transform:scale(1); opacity:1; } 100% { transform:scale(1.12); opacity:0; } }
@keyframes combat-tool-impact { 0%,20% { transform:scale(.4); opacity:0; } 45% { opacity:1; } 100% { transform:scale(1.18); opacity:0; } }
@keyframes combat-tool-throw { 0% { transform:translate(var(--tool-dx),var(--tool-dy)) rotate(-24deg) scale(1.12); opacity:0; } 15% { opacity:1; } 42% { transform:translate(0,0) rotate(12deg) scale(.8); opacity:1; } 100% { transform:translate(0,-20px) scale(.6); opacity:0; } }
@keyframes combat-tool-hold { 0% { transform:translateY(25px) scale(.8); opacity:0; } 25%,65% { transform:translateY(0) scale(1); opacity:1; } 100% { transform:translateY(-8px); opacity:0; } }
/* One continuous reveal per action; no repeated flash or screen-sized filled plane. */
@keyframes combat-skill-reveal { 0% { opacity:0; } 16%,72% { opacity:1; } 100% { opacity:0; } }
@keyframes combat-ground-spread { from { transform:translateY(14px) scaleX(.55); opacity:.15; } 35%,78% { opacity:.65; } to { transform:scaleX(1.08); opacity:0; } }
@keyframes combat-binding-turn { from { transform:rotate(-32deg) scale(1.15); } to { transform:rotate(18deg) scale(.94); } }
@keyframes combat-binding-close { from { transform:scale(1.24); opacity:0; } 38%,80% { transform:scale(1); opacity:1; } to { transform:scale(.96); opacity:0; } }
@keyframes combat-strike-fan { from { transform:translate(25px,-28px) rotate(-18deg) scale(.72); opacity:0; } 28% { opacity:1; } to { transform:translate(-14px,20px) rotate(8deg) scale(1.07); opacity:0; } }
@keyframes combat-sigil-pulse { 0%,16% { transform:scale(.55); opacity:0; } 42% { opacity:1; } 100% { transform:scale(1.13); opacity:0; } }
@keyframes combat-shield-rise { from { transform:translateY(28px) scale(.7); opacity:0; } 32%,80% { transform:translateY(0) scale(1); opacity:1; } to { transform:scale(1.04); opacity:0; } }
@keyframes combat-chain-close { from { transform:scaleX(1.3) rotate(-12deg); opacity:0; } 42%,82% { transform:scaleX(1) rotate(0); opacity:1; } to { transform:scaleX(.94); opacity:0; } }
@keyframes combat-charm-settle { from { transform:translateY(-35px) rotate(8deg); opacity:0; } 34%,85% { transform:translateY(0) rotate(0); opacity:1; } to { transform:translateY(4px); opacity:0; } }
/* Motion reduction still shows the attack mark and item, so timing is readable. */
.combat-effects[data-reduced-motion="true"] .combat-warning-progress,
.reduced-motion .combat-effects .combat-warning-progress { animation:none !important; stroke-dashoffset:0; }
.combat-effects[data-reduced-motion="true"] .combat-drawing,
.combat-effects[data-reduced-motion="true"] .combat-tool-image,
.combat-effects[data-reduced-motion="true"] .combat-scene-layer,
.reduced-motion .combat-effects .combat-drawing,
.reduced-motion .combat-effects .combat-tool-image,
.reduced-motion .combat-effects .combat-scene-layer { animation:none !important; transform:none !important; opacity:.8; }
@media (prefers-reduced-motion:reduce) {
  .combat-effects .combat-warning-progress { animation:none !important; stroke-dashoffset:0; }
  .combat-effects .combat-drawing, .combat-effects .combat-tool-image, .combat-effects .combat-scene-layer { animation:none !important; transform:none !important; opacity:.8; }
}