@theme inline {
    --animation-delay-0: 0s;
    --animation-delay-75: 75ms;
    --animation-delay-100: 0.1s;
    --animation-delay-150: 0.15s;
    --animation-delay-200: 0.2s;
    --animation-delay-300: 0.3s;
    --animation-delay-500: 0.5s;
    --animation-delay-700: 0.7s;
    --animation-delay-1000: 1s;
  
    --animation-repeat-0: 0;
    --animation-repeat-1: 1;
    --animation-repeat-infinite: infinite;
  
    --animation-direction-normal: normal;
    --animation-direction-reverse: reverse;
    --animation-direction-alternate: alternate;
    --animation-direction-alternate-reverse: alternate-reverse;
  
    --animation-fill-mode-none: none;
    --animation-fill-mode-forwards: forwards;
    --animation-fill-mode-backwards: backwards;
    --animation-fill-mode-both: both;
  
    --animate-in: var(--tw-duration, 150ms) var(--tw-ease, ease) enter;
    --animate-out: var(--tw-duration, 150ms) var(--tw-ease, ease) exit;
  
    --percentage-0: 0;
    --percentage-5: 0.05;
    --percentage-10: 0.1;
    --percentage-15: 0.15;
    --percentage-20: 0.2;
    --percentage-25: 0.25;
    --percentage-30: 0.3;
    --percentage-35: 0.35;
    --percentage-40: 0.4;
    --percentage-45: 0.45;
    --percentage-50: 0.5;
    --percentage-55: 0.55;
    --percentage-60: 0.6;
    --percentage-65: 0.65;
    --percentage-70: 0.7;
    --percentage-75: 0.75;
    --percentage-80: 0.8;
    --percentage-85: 0.85;
    --percentage-90: 0.9;
    --percentage-95: 0.95;
    --percentage-100: 1;
  
    @keyframes enter {
      from {
        opacity: var(--tw-enter-opacity, 1);
        transform: translate3d(
            var(--tw-enter-translate-x, 0),
            var(--tw-enter-translate-y, 0),
            0
          )
          scale3d(
            var(--tw-enter-scale, 1),
            var(--tw-enter-scale, 1),
            var(--tw-enter-scale, 1)
          )
          rotate(var(--tw-enter-rotate, 0));
      }
    }
  
    @keyframes exit {
      to {
        opacity: var(--tw-exit-opacity, 1);
        transform: translate3d(
            var(--tw-exit-translate-x, 0),
            var(--tw-exit-translate-y, 0),
            0
          )
          scale3d(
            var(--tw-exit-scale, 1),
            var(--tw-exit-scale, 1),
            var(--tw-exit-scale, 1)
          )
          rotate(var(--tw-exit-rotate, 0));
      }
    }
  }
  
  @utility delay-* {
    animation-delay: calc(--value(number) * 1ms);
    animation-delay: --value(--animation-delay-*, [duration], [*]);
  }
  
  @utility repeat-* {
    animation-iteration-count: --value(--animation-repeat-*, integer);
  }
  
  @utility direction-* {
    animation-direction: --value(--animation-direction-*);
  }
  
  @utility fill-mode-* {
    animation-fill-mode: --value(--animation-fill-mode-*);
  }
  
  @utility running {
    animation-play-state: running;
  }
  @utility paused {
    animation-play-state: paused;
  }
  
  @utility fade-in {
    --tw-enter-opacity: 0;
  }
  @utility fade-in-* {
    --tw-enter-opacity: --value(--percentage-*, [*]);
  }
  
  @utility fade-out {
    --tw-exit-opacity: 0;
  }
  @utility fade-out-* {
    --tw-exit-opacity: --value(--percentage-*, [*]);
  }
  
  @utility zoom-in {
    --tw-enter-scale: 0;
  }
  @utility zoom-in-* {
    --tw-enter-scale: calc(--value([percentage]) / 100%);
    --tw-enter-scale: calc(--value([ratio], [number]));
    --tw-enter-scale: --value(--percentage-*);
  }
  
  @utility zoom-out {
    --tw-exit-scale: 0;
  }
  @utility zoom-out-* {
    --tw-exit-scale: calc(--value([percentage]) / 100%);
    --tw-exit-scale: calc(--value([ratio], [number]));
    --tw-exit-scale: --value(--percentage-*);
  }
  
  @utility spin-in {
    --tw-enter-rotate: 30deg;
  }
  @utility spin-in-* {
    --tw-enter-rotate: calc(--value(number) * 1deg);
    --tw-enter-rotate: --value(--rotate-*, [angle]);
  }
  
  @utility spin-out {
    --tw-exit-rotate: 30deg;
  }
  @utility spin-out-* {
    --tw-exit-rotate: calc(--value(number) * 1deg);
    --tw-exit-rotate: --value(--rotate-*, [angle]);
  }
  
  @utility slide-in-from-top {
    --tw-enter-translate-y: -100%;
  }
  @utility slide-in-from-top-* {
    --tw-enter-translate-y: calc(--value(integer) * var(--spacing) * -1);
    --tw-enter-translate-y: calc(--value(--translate-*, [percentage], ratio, [length]) * -1);
  }
  
  @utility slide-in-from-bottom {
    --tw-enter-translate-y: 100%;
  }
  @utility slide-in-from-bottom-* {
    --tw-enter-translate-y: calc(--value(integer) * var(--spacing));
    --tw-enter-translate-y: --value(--translate-*, [percentage], ratio, [length]);
  }
  @utility slide-in-from-left {
    --tw-enter-translate-x: -100%;
  }
  @utility slide-in-from-left-* {
    --tw-enter-translate-x: calc(--value(integer) * var(--spacing) * -1);
    --tw-enter-translate-x: calc(--value(--translate-*, [percentage], ratio, [length]) * -1);
  }
  @utility slide-in-from-right {
    --tw-enter-translate-x: 100%;
  }
  @utility slide-in-from-right-* {
    --tw-enter-translate-x: calc(--value(integer) * var(--spacing));
    --tw-enter-translate-x: --value(--translate-*, [percentage], ratio, [length]);
  }
  
  @utility slide-out-to-top {
    --tw-exit-translate-y: -100%;
  }
  @utility slide-out-to-top-* {
    --tw-exit-translate-y: calc(--value(integer) * var(--spacing) * -1);
    --tw-exit-translate-y: calc(--value(--translate-*, [percentage], ratio, [length]) * -1);
  }
  @utility slide-out-to-bottom {
    --tw-exit-translate-y: 100%;
  }
  @utility slide-out-to-bottom-* {
    --tw-exit-translate-y: calc(--value(integer) * var(--spacing));
    --tw-exit-translate-y: --value(--translate-*, [percentage], ratio, [length]);
  }
  @utility slide-out-to-left {
    --tw-exit-translate-x: -100%;
  }
  @utility slide-out-to-left-* {
    --tw-exit-translate-x: calc(--value(integer) * var(--spacing) * -1);
    --tw-exit-translate-x: calc(--value(--translate-*, [percentage], ratio, [length]) * -1);
  }
  @utility slide-out-to-right {
    --tw-exit-translate-x: 100%;
  }
  @utility slide-out-to-right-* {
    --tw-exit-translate-x: calc(--value(integer) * var(--spacing));
    --tw-exit-translate-x: --value(--translate-*, [percentage], ratio, [length]);
  }