/* UI 016.4 — Combat Outcome FX
   Additive presentation only. Does not alter server combat, layout, HP, AUTO, 016.1 motion or 016.2 impact timing. */

body.arena-battle014-active #battle014-root .b14-scene{isolation:isolate!important}

.b164-layer{
  position:absolute;
  z-index:29;
  inset:0;
  overflow:hidden;
  pointer-events:none;
}
.b164-fx{
  --b164-x:50%;
  --b164-y:50%;
  --b164-miss-start:-34px;
  --b164-miss-end:54px;
  --b164-counter-start:38px;
  --b164-counter-end:-58px;
  --b164-counter-angle:-24deg;
  position:absolute;
  left:var(--b164-x);
  top:var(--b164-y);
  width:1px;
  height:1px;
  pointer-events:none;
}

/* Make the existing floating result itself reinforce the outcome without changing its two-second trail. */
.b161-result.b164-tone-crit b{font-size:30px!important;color:#ffe27b!important;text-shadow:0 0 8px #fff4be,0 0 18px rgba(255,188,59,.86),0 2px 3px #000!important}
.b161-result.b164-tone-crit small{font-size:9px!important;color:#fff0a8!important;border-color:rgba(255,209,86,.78)!important;box-shadow:0 0 12px rgba(255,188,59,.36)}
.b161-result.b164-tone-block small{color:#a9ecff!important;border-color:rgba(105,211,255,.76)!important;box-shadow:0 0 12px rgba(86,198,255,.28)}
.b161-result.b164-tone-parry small{color:#e7f7ff!important;border-color:rgba(181,234,255,.86)!important;box-shadow:0 0 13px rgba(152,222,255,.42)}
.b161-result.b164-tone-dodge small{font-size:9px!important;letter-spacing:.11em!important;color:#b7f6ff!important;border-color:rgba(107,230,255,.62)!important}
.b161-result.b164-tone-miss small{font-size:9px!important;letter-spacing:.10em!important;color:#d7d0c7!important;border-color:rgba(215,208,199,.44)!important}
.b161-result.b164-tone-counter small{font-size:9px!important;color:#f1c1ff!important;border-color:rgba(213,128,255,.78)!important;box-shadow:0 0 13px rgba(183,74,255,.36)}
.b161-result.b164-tone-counter b{color:#ff7f9d!important;text-shadow:0 0 10px rgba(221,86,255,.65),0 0 16px rgba(255,85,95,.4),0 2px 3px #000!important}

/* CRIT — compact golden sunburst and expanding ring. */
.b164-fx.is-crit{color:#ffd85d}
.b164-fx.is-crit:before,
.b164-fx.is-crit:after{
  content:"";
  position:absolute;
  left:0;top:0;
  translate:-50% -50%;
  border-radius:50%;
}
.b164-fx.is-crit:before{
  width:24px;height:24px;
  background:radial-gradient(circle,#fff 0 15%,#fff0a1 28%,rgba(255,192,49,.76) 48%,transparent 72%);
  filter:drop-shadow(0 0 10px rgba(255,210,77,.95));
  animation:b164CritCore 430ms ease-out both;
}
.b164-fx.is-crit:after{
  width:54px;height:54px;
  border:2px solid rgba(255,222,107,.92);
  box-shadow:0 0 12px rgba(255,200,59,.8),inset 0 0 12px rgba(255,227,127,.35);
  animation:b164CritRing 520ms cubic-bezier(.12,.72,.2,1) both;
}
.b164-fx.is-crit i,
.b164-fx.is-crit b{
  position:absolute;left:0;top:0;
  width:106px;height:3px;
  translate:-50% -50%;
  border-radius:99px;
  background:linear-gradient(90deg,transparent,rgba(255,235,146,.9),#fff,rgba(255,203,72,.82),transparent);
  box-shadow:0 0 9px rgba(255,205,70,.8);
  animation:b164CritRay 420ms ease-out both;
}
.b164-fx.is-crit i{rotate:18deg}.b164-fx.is-crit b{rotate:-48deg;animation-delay:18ms}
@keyframes b164CritCore{0%{opacity:0;scale:.3}18%{opacity:1;scale:1.2}56%{opacity:.9;scale:.92}100%{opacity:0;scale:1.55}}
@keyframes b164CritRing{0%{opacity:0;scale:.35}22%{opacity:1;scale:.78}100%{opacity:0;scale:1.85}}
@keyframes b164CritRay{0%{opacity:0;scale:.25 1}24%{opacity:1;scale:1.05 1}100%{opacity:0;scale:1.38 .55}}

/* BLOCK — a readable shield face with cold ripples. */
.b164-fx.is-block:before{
  content:"";position:absolute;left:0;top:0;
  width:58px;height:70px;translate:-50% -50%;
  border:2px solid rgba(139,225,255,.9);
  border-radius:48% 48% 58% 58%/36% 36% 68% 68%;
  background:radial-gradient(circle at 50% 35%,rgba(213,248,255,.20),rgba(81,191,255,.08) 54%,transparent 70%);
  box-shadow:0 0 16px rgba(97,203,255,.64),inset 0 0 18px rgba(142,225,255,.18);
  animation:b164BlockShield 520ms ease-out both;
}
.b164-fx.is-block:after{
  content:"";position:absolute;left:0;top:0;
  width:82px;height:82px;translate:-50% -50%;border-radius:50%;
  border:1px solid rgba(137,224,255,.58);
  animation:b164BlockWave 560ms ease-out both;
}
@keyframes b164BlockShield{0%{opacity:0;scale:.68}18%{opacity:1;scale:1.04}62%{opacity:.84;scale:.98}100%{opacity:0;scale:1.12}}
@keyframes b164BlockWave{0%{opacity:0;scale:.45}26%{opacity:.78;scale:.8}100%{opacity:0;scale:1.5}}

/* PARRY — two blade streaks collide and throw a central spark. */
.b164-fx.is-parry i,
.b164-fx.is-parry b{
  position:absolute;left:0;top:0;width:112px;height:3px;translate:-50% -50%;
  border-radius:99px;background:linear-gradient(90deg,transparent,#b9ecff 27%,#fff 50%,#d9f5ff 68%,transparent);
  box-shadow:0 0 8px rgba(176,231,255,.86);
  animation:b164ParryBlade 460ms ease-out both;
}
.b164-fx.is-parry i{rotate:38deg}.b164-fx.is-parry b{rotate:-38deg}
.b164-fx.is-parry:before{
  content:"✦";position:absolute;left:0;top:0;translate:-50% -50%;
  color:#fff;font:900 28px/1 Georgia,serif;text-shadow:0 0 8px #c8f0ff,0 0 18px rgba(97,205,255,.9);
  animation:b164ParrySpark 520ms ease-out both;
}
@keyframes b164ParryBlade{0%{opacity:0;scale:.25 1}22%{opacity:1;scale:1.05 1}54%{opacity:.92}100%{opacity:0;scale:1.28 .7}}
@keyframes b164ParrySpark{0%{opacity:0;scale:.25;rotate:0deg}20%{opacity:1;scale:1.15}100%{opacity:0;scale:1.85;rotate:80deg}}

/* DODGE — afterimages are DOM clones of the current fighter art. */
.b164-afterimage{
  position:absolute!important;z-index:7!important;margin:0!important;padding:0!important;
  max-width:none!important;max-height:none!important;object-fit:contain!important;
  pointer-events:none!important;transform-origin:50% 80%!important;
  opacity:0;filter:brightness(1.25) saturate(.55) hue-rotate(145deg) drop-shadow(0 0 9px rgba(106,226,255,.72));
  animation:b164Ghost 620ms cubic-bezier(.14,.7,.2,1) both;
}
.b164-afterimage.is-second{animation-delay:55ms;opacity:0}
@keyframes b164Ghost{
  0%{opacity:.42;transform:translate3d(0,0,0) scale(1)}
  42%{opacity:.22;transform:translate3d(var(--b164-ghost-mid),-2px,0) scale(1.01)}
  100%{opacity:0;transform:translate3d(var(--b164-ghost-x),-5px,0) scale(1.025);filter:blur(2px) brightness(1.25) saturate(.4) hue-rotate(145deg)}
}

/* MISS — a pale blade path continues past the target; no impact ring or shake is added here. */
.b164-fx.is-miss i{
  position:absolute;left:0;top:0;width:132px;height:3px;translate:-50% -50%;
  border-radius:99px;
  background:linear-gradient(90deg,transparent,rgba(230,226,218,.32) 18%,rgba(255,255,255,.82) 51%,rgba(224,216,207,.34) 72%,transparent);
  filter:drop-shadow(0 0 5px rgba(255,255,255,.34));
  animation:b164Miss 520ms cubic-bezier(.18,.72,.22,1) both;
}
.b164-fx.is-miss[data-side="player"] i{rotate:-18deg}.b164-fx.is-miss[data-side="enemy"] i{rotate:198deg}
@keyframes b164Miss{0%{opacity:0;transform:translate3d(var(--b164-miss-start),0,0) scaleX(.45)}28%{opacity:.85;transform:translate3d(0,0,0) scaleX(1)}100%{opacity:0;transform:translate3d(var(--b164-miss-end),-7px,0) scaleX(1.25)}}

/* COUNTER — reversed magenta cut with a compact shock diamond. */
.b164-fx.is-counter i,
.b164-fx.is-counter b{
  position:absolute;left:0;top:0;translate:-50% -50%;pointer-events:none;
}
.b164-fx.is-counter i{
  width:122px;height:4px;border-radius:99px;
  background:linear-gradient(90deg,transparent,#ff7691 22%,#fff 47%,#d97aff 68%,transparent);
  box-shadow:0 0 10px rgba(218,88,255,.72),0 0 18px rgba(255,78,107,.38);
  rotate:var(--b164-counter-angle);
  animation:b164CounterCut 520ms cubic-bezier(.14,.76,.22,1) both;
}
.b164-fx.is-counter b{
  width:38px;height:38px;rotate:45deg;
  border:2px solid rgba(234,150,255,.86);
  box-shadow:0 0 13px rgba(199,93,255,.72),inset 0 0 10px rgba(255,100,126,.22);
  animation:b164CounterDiamond 560ms ease-out both;
}
@keyframes b164CounterCut{0%{opacity:0;transform:translate3d(var(--b164-counter-start),0,0) scaleX(.35)}24%{opacity:1;transform:translate3d(0,0,0) scaleX(1.05)}100%{opacity:0;transform:translate3d(var(--b164-counter-end),-6px,0) scaleX(1.35)}}
@keyframes b164CounterDiamond{0%{opacity:0;scale:.35}24%{opacity:1;scale:1.05}100%{opacity:0;scale:1.75}}

@media(max-width:430px){
  .b161-result.b164-tone-crit b{font-size:27px!important}
  .b164-fx.is-crit i,.b164-fx.is-crit b{width:92px}
  .b164-fx.is-parry i,.b164-fx.is-parry b{width:96px}
  .b164-fx.is-miss i{width:116px}
  .b164-fx.is-counter i{width:104px}
}

@media(prefers-reduced-motion:reduce){
  .b164-afterimage,.b164-fx.is-miss i,.b164-fx.is-counter i{display:none!important}
  .b164-fx.is-crit:before,.b164-fx.is-crit:after,.b164-fx.is-block:before,.b164-fx.is-block:after,.b164-fx.is-parry:before{
    animation-duration:180ms!important;
  }
}