/* v3 combat motion perf (presentation only).
   Combat motion now runs through WAAPI transforms in combat-fx.js. These rules
   keep the remaining combat CSS on the compositor: no animated filter /
   box-shadow, no blur on moving bolts, will-change only on short-lived FX. */

/* flash ring replaces the box-shadow + filter flash keyframes */
.ktk-flash-ring{position:fixed;z-index:44;pointer-events:none;box-sizing:border-box;border-radius:8px;
  border:2px solid var(--ring);box-shadow:0 0 12px var(--ring);opacity:0;transform-origin:center;contain:strict}

/* heat shimmer: opacity only (was an infinite brightness filter) */
@keyframes trump-heat-pulse{0%,100%{opacity:.75}50%{opacity:1}}

/* winner/loser cue: static look, only transform/opacity transition */
.slot.combat-outcome-winner,.slot.combat-outcome-loser{transition:transform .22s cubic-bezier(.16,.84,.3,1),opacity .22s ease-out}

/* transient FX nodes get their own layer for their short life */
.element-particle{filter:none}
.ktk-bolt{contain:layout style}
.ktk-bolt-fire .ktk-bolt-streak,.ktk-bolt-wind .ktk-bolt-streak,.ktk-bolt-water .ktk-bolt-streak,.ktk-bolt-earth .ktk-bolt-streak{filter:none}
.ktk-bolt-fire .ktk-bolt-tail{filter:none;background:radial-gradient(closest-side,rgba(255,74,18,.75),rgba(255,74,18,0))}
.ktk-bolt-wind .ktk-bolt-tail{filter:none;background:radial-gradient(closest-side,rgba(244,214,122,.5),rgba(244,214,122,0))}
.ktk-bolt-water .ktk-bolt-tail{filter:none;background:radial-gradient(closest-side,rgba(74,174,224,.6),rgba(74,174,224,0))}
.ktk-bolt-earth .ktk-bolt-tail{filter:none;background:radial-gradient(closest-side,rgba(109,138,61,.55),rgba(109,138,61,0))}

/* WINS badge: sized from the card so it sits neatly on it on every phone */
.combat-outcome-badge,.gy-card-flight-wins{
  font-size:clamp(7px,calc(var(--card-w,58px) * .115),10.5px)!important;
  letter-spacing:.1em!important;padding:2px 6px 1px!important;line-height:1.05!important;
  max-width:calc(var(--card-w,58px) * .8)!important;white-space:nowrap;
  clip-path:polygon(4px 0,calc(100% - 4px) 0,100% 50%,calc(100% - 4px) 100%,4px 100%,0 50%)!important;
  filter:drop-shadow(0 0 4px rgba(255,180,70,.5))!important}
.combat-outcome-badge-gy{font-size:clamp(6.5px,calc(var(--card-w,58px) * .1),9.5px)!important}
@media (min-width:1100px) and (min-height:700px){
  .combat-outcome-badge,.gy-card-flight-wins{font-size:clamp(9px,calc(var(--card-w,58px) * .12),12px)!important;padding:3px 8px 2px!important}
}

@media (prefers-reduced-motion:reduce){
  .ktk-bolt.fly .ktk-ember{animation:none}
  .slot.combat-outcome-winner,.slot.combat-outcome-loser{transition:opacity .15s linear}
  .gy-card-flight.go{animation-duration:1ms!important}
}