.shake-enter {
  animation: shake 0.5s;
}

.shake-enter-active {
  animation: shake 0.5s;
}

@keyframes shake {
  0% {
    transform: translate(0, 0);
  }
  20% {
    transform: translate(-5px, 0);
  }
  40% {
    transform: translate(5px, 0);
  }
  60% {
    transform: translate(-5px, 0);
  }
  80% {
    transform: translate(5px, 0);
  }
  100% {
    transform: translate(0, 0);
  }
}

.slide-enter-active {
  animation: slide-in 500ms forwards;
}

.slide-exit-active {
  animation: slide-out 500ms forwards;
}

@keyframes slide-in {
  0% {
    opacity: 0;
    transform: translateX(-150px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes slide-out {
  0% {
    opacity: 1;
    transform: translateX(0);
  }
  100% {
    opacity: 0;
    transform: translateX(150px);
  }
}

.fade500-enter {
  opacity: 0;
}
.fade500-enter-active {
  opacity: 1;
  transition: opacity 300ms linear;
}
.fade500-exit {
  opacity: 1;
}
.fade500-exit-active {
  opacity: 0;
  transition: opacity 300ms linear;
}

.page {
  position: absolute;
  left: 15px;
  right: 15px;
}

.page-enter {
  opacity: 0;
  transform: scale(1.1);
}

.page-enter-active {
  opacity: 1;
  transform: scale(1);
  transition: opacity 300ms, transform 300ms;
}

.page-exit {
  opacity: 1;
  transform: scale(1);
}

.page-exit-active {
  opacity: 0;
  transform: scale(0.9);
  transition: opacity 300ms, transform 300ms;
}

.scale-enter {
  opacity: 0;
  transform: scale(0.9);
}
.scale-enter-active {
  opacity: 1;
  transform: translateX(0);
  transition: opacity 300ms, transform 300ms;
}
.scale-exit {
  opacity: 1;
}
.scale-exit-active {
  opacity: 0;
  transform: scale(0.9);
  transition: opacity 300ms, transform 300ms;
}

.fade-enter {
  opacity: 0;
}
.fade-enter-active {
  opacity: 1;
  transition: opacity 300ms;
}
.fade-exit {
  opacity: 1;
}
.fade-exit-active {
  opacity: 0;
  transition: opacity 300ms;
}

*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  text-rendering: optimizeSpeed;
  overflow-x: hidden;
}

@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/87e349443efb37919940.woff2?v=3.12) format('woff2'),
  url(/276570fcb041be89f11d.woff?v=3.12) format('woff');
}

@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/a9e12a1785306cbe72c3.woff2?v=3.12) format('woff2'),
  url(/d682e82639c663c1ad7f.woff?v=3.12) format('woff');
}

@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/c1f85525241a86ebc086.woff2?v=3.12) format('woff2'),
  url(/c69d1ddb37446ff21254.woff?v=3.12) format('woff');
}