/* Poké Ball send-out animation, using the draft's stage and rarity colors. */
.battle-summon-ball{
  --summon-ball-color:#f0525c;
  position:absolute;
  z-index:5;
  top:66%;
  left:50%;
  width:36px;
  height:36px;
  border:2px solid #20242a;
  border-radius:50%;
  background:linear-gradient(to bottom,var(--summon-ball-color) 0 43%,#101116 43% 57%,#f3f3f3 57% 100%);
  box-shadow:0 3px 8px #0008,inset 0 1px 2px #fff8;
  opacity:0;
  pointer-events:none;
}
.battle-stage-side[data-pokeball="stage-1"] .battle-summon-ball{--summon-ball-color:#f0525c}
.battle-stage-side[data-pokeball="stage-2"] .battle-summon-ball{--summon-ball-color:#2386e8}
.battle-stage-side[data-pokeball="stage-3"] .battle-summon-ball{--summon-ball-color:#f3c928}
.battle-stage-side[data-pokeball="master"] .battle-summon-ball{--summon-ball-color:#a64be0}
.battle-summon-ball::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:10px;
  height:10px;
  border:2px solid #20242a;
  border-radius:50%;
  background:radial-gradient(circle,#fff 0 35%,#d7dce0 40% 100%);
  transform:translate(-50%,-50%);
}
.battle-summon-ball::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:-7px;
  border:3px solid #fff;
  border-radius:50%;
  opacity:0;
  transform:scale(.45);
}
.battle-stage-player.is-entering .battle-summon-ball{animation:summon-ball-throw-player .72s cubic-bezier(.2,.75,.3,1) both}
.battle-stage-opponent.is-entering .battle-summon-ball{animation:summon-ball-throw-opponent .72s cubic-bezier(.2,.75,.3,1) both}
.battle-stage-side.is-entering .battle-summon-ball::before{animation:summon-ball-release .48s ease-out .43s both}
.battle-stage-side.is-entering .battle-stage-sprite{animation:battle-pokemon-release .46s cubic-bezier(.2,.8,.2,1) .52s both,summon-flash .46s ease-out .52s both}
@keyframes summon-ball-throw-player{
  0%{opacity:0;transform:translate(calc(-50% - 130px),calc(-50% - 34px)) scale(.52) rotate(-35deg)}
  18%{opacity:1}
  56%{transform:translate(calc(-50% + 8px),calc(-50% - 12px)) scale(1.08) rotate(12deg)}
  68%{transform:translate(-50%,-50%) scale(1) rotate(0)}
  80%{opacity:1;transform:translate(-50%,-50%) scale(1.12)}
  100%{opacity:0;transform:translate(-50%,-50%) scale(1.38)}
}
@keyframes summon-ball-throw-opponent{
  0%{opacity:0;transform:translate(calc(-50% + 130px),calc(-50% - 34px)) scale(.52) rotate(35deg)}
  18%{opacity:1}
  56%{transform:translate(calc(-50% - 8px),calc(-50% - 12px)) scale(1.08) rotate(-12deg)}
  68%{transform:translate(-50%,-50%) scale(1) rotate(0)}
  80%{opacity:1;transform:translate(-50%,-50%) scale(1.12)}
  100%{opacity:0;transform:translate(-50%,-50%) scale(1.38)}
}
@keyframes summon-ball-release{
  0%{opacity:0;transform:scale(.45)}
  25%{opacity:.9}
  100%{opacity:0;transform:scale(1.6);border-color:color-mix(in srgb,var(--summon-ball-color),white 35%)}
}
@keyframes battle-pokemon-release{
  0%{opacity:0;transform:translateY(12px) scale(.48)}
  62%{opacity:1;transform:translateY(-5px) scale(1.12)}
  100%{opacity:1;transform:translateY(0) scale(1)}
}
@media(prefers-reduced-motion:reduce){
  .battle-stage-side.is-entering .battle-summon-ball,
  .battle-stage-side.is-entering .battle-summon-ball::before,
  .battle-stage-side.is-entering .battle-stage-sprite{animation-duration:.01ms!important;animation-delay:0s!important}
}
