@keyframes bounce {
  0% {
    transform: scale(85%) translateY(0);
  }

  50% {
    transform: scale(110%) translateY(-1rem);
  }

  100% {
    transform: scale(100%) translateY(0);
  }
}

@keyframes act {
  0% {
    transform: scale(85%) translateY(0);
  }

  50% {
    transform: scale(50%) translateY(1rem);
  }

  100% {
    transform: scale(100%) translateY(0);
  }
}

@keyframes bounceSmall {
  0% {
    transform: scale(100%) translateY(0);
  }

  50% {
    transform: scale(105%) translateY(-0.125rem);
  }

  100% {
    transform: scale(100%) translateY(0);
  }
}

@keyframes actSmall {
  0% {
    transform: scale(105%) translateY(0);
  }

  50% {
    transform: scale(95%) translateY(0.125rem);
  }

  100% {
    transform: scale(100%) translateY(0);
  }

}


:root {
  --animation-act: act 250ms var(--elastic-easing) both;
  --animation-act-small: actSmall 250ms var(--elastic-easing) both;
  --animation-bounce-small: bounceSmall 250ms var(--elastic-easing) both;
}
@media (prefers-reduced-motion) {
  :root {
    --animation-act: none;
    --animation-act-small: none;
    --animation-bounce-small: none;
  }
}