/* 淡入缩放动画 */
.animate__fadeInScale {
  -webkit-animation: fadeInScale 0.3s ease forwards;
  animation: fadeInScale 0.3s ease forwards;
}

/* 淡出缩放动画 */
.animate__fadeOutScale {
  -webkit-animation: fadeOutScale 0.3s ease forwards;
  animation: fadeOutScale 0.3s ease forwards;
}

/* 头部摇晃动画 */
.animate__headShake {
  -webkit-animation-name: headShake;
  animation-name: headShake;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
}

/* 淡入动画 */
.animate__fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

/* 淡出动画 */
.animate__fadeOut {
  -webkit-animation-name: fadeOut;
  animation-name: fadeOut;
}

/* 放大动画 */
.animate__zoomIn {
  -webkit-animation-name: zoomIn;
  animation-name: zoomIn;
}

/* 缩小动画 */
.animate__zoomOut {
  -webkit-animation-name: zoomOut;
  animation-name: zoomOut;
}

.animate__slideTop {
  -webkit-animation: slideTop 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s both;
  animation: slideTop 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s both;
}

.animate__slideTopMini {
  -webkit-animation: slideTopMini 0.8s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s both;
  animation: slideTopMini 0.8s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s both;
}

.animate__slideInLeft {
  animation: slideInLeft 1s forwards; /* 动画持续1秒 */
}

.animate__slideInRight  {
  animation: slideInRight 1s forwards; /* 动画持续1秒 */
}

.animate__popUp {
  -webkit-animation: pop-up 0.5s ease forwards;
  animation: pop-up 0.5s ease forwards;
}

/* 头部摇晃动画 */
@-webkit-keyframes headShake {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  6.5% {
    -webkit-transform: translateX(-8px);
    transform: translateX(-8px);
  }
  18.5% {
    -webkit-transform: translateX(6px);
    transform: translateX(6px);
  }
  31.5% {
    -webkit-transform: translateX(-4px);
    transform: translateX(-4px);
  }
  43.5% {
    -webkit-transform: translateX(2px);
    transform: translateX(2px);
  }
  50% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes headShake {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  6.5% {
    -webkit-transform: translateX(-8px);
    transform: translateX(-8px);
  }
  18.5% {
    -webkit-transform: translateX(6px);
    transform: translateX(6px);
  }
  31.5% {
    -webkit-transform: translateX(-4px);
    transform: translateX(-4px);
  }
  43.5% {
    -webkit-transform: translateX(2px);
    transform: translateX(2px);
  }
  50% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

/* 淡入动画 */
@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* 淡出动画 */
@-webkit-keyframes fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

@keyframes fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

/* 放大动画 */
@-webkit-keyframes zoomIn {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
  50% {
    opacity: 1;
  }
}

@keyframes zoomIn {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
  50% {
    opacity: 1;
  }
}

/* 缩小动画 */
@-webkit-keyframes zoomOut {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
  to {
    opacity: 0;
  }
}

@keyframes zoomOut {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
  to {
    opacity: 0;
  }
}

/* 向上滑动并淡入动画 */
@-webkit-keyframes slideUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes slideUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

/* 淡入缩放动画 */
@-webkit-keyframes fadeInScale {
  0% {
    opacity: 0;
    -webkit-transform: translate(-50%, -50%) scale(0.9);
    transform: translate(-50%, -50%) scale(0.9);
  }
  100% {
    opacity: 1;
    -webkit-transform: translate(-50%, -50%) scale(1);
    transform: translate(-50%, -50%) scale(1);
  }
}

@keyframes fadeInScale {
  0% {
    opacity: 0;
    -webkit-transform: translate(-50%, -50%) scale(0.9);
    transform: translate(-50%, -50%) scale(0.9);
  }
  100% {
    opacity: 1;
    -webkit-transform: translate(-50%, -50%) scale(1);
    transform: translate(-50%, -50%) scale(1);
  }
}

/* 淡出缩放动画 */
@-webkit-keyframes fadeOutScale {
  0% {
    opacity: 1;
    -webkit-transform: translate(-50%, -50%) scale(1);
    transform: translate(-50%, -50%) scale(1);
  }
  100% {
    opacity: 0;
    -webkit-transform: translate(-50%, -50%) scale(0.9);
    transform: translate(-50%, -50%) scale(0.9);
  }
}

@keyframes fadeOutScale {
  0% {
    opacity: 1;
    -webkit-transform: translate(-50%, -50%) scale(1);
    transform: translate(-50%, -50%) scale(1);
  }
  100% {
    opacity: 0;
    -webkit-transform: translate(-50%, -50%) scale(0.9);
    transform: translate(-50%, -50%) scale(0.9);
  }
}

@-webkit-keyframes dots {
  0% {
    content: '.';
  }
  30% {
    content: '..';
  }
  60% {
    content: '...';
  }
  100% {
    content: '.';
  }
}

@keyframes dots {
  0% {
    content: '.';
  }
  30% {
    content: '..';
  }
  60% {
    content: '...';
  }
  100% {
    content: '.';
  }
}

/* 模块向上滑动动画 */
@-webkit-keyframes slideTop {
  0% {
      -webkit-transform: translateY(300px);
      transform: translateY(300px);
      opacity: 0;
  }
  100% {
      -webkit-transform: translateY(0);
      transform: translateY(0);
      opacity: 1;
  }
}
@keyframes slideTop {
  0% {
      -webkit-transform: translateY(300px);
      transform: translateY(300px);
      opacity: 0;
  }
  100% {
      -webkit-transform: translateY(0);
      transform: translateY(0);
      opacity: 1;
  }
}


@-webkit-keyframes slideTopMini {
  0% {
      -webkit-transform: translateY(100px);
      transform: translateY(100px);
      opacity: 0;
  }
  100% {
      -webkit-transform: translateY(0);
      transform: translateY(0);
      opacity: 1;
  }
}
@keyframes slideTopMini {
  0% {
      -webkit-transform: translateY(100px);
      transform: translateY(100px);
      opacity: 0;
  }
  100% {
      -webkit-transform: translateY(0);
      transform: translateY(0);
      opacity: 1;
  }
}

@keyframes slideInLeft {
  0% {
      transform: translateX(-100%); /* 从屏幕左侧外部开始 */
      opacity: 0;
  }
  100% {
      transform: translateX(0); /* 结束时在正常位置 */
      opacity: 1;
  }
}

@keyframes slideInRight {
  0% {
      transform: translateX(100%); /* 从屏幕右侧外部开始 */
      opacity: 0;
  }
  100% {
      transform: translateX(0); /* 结束时在正常位置 */
      opacity: 1;
  }
}

@-webkit-keyframes pop-up {
0% {
  opacity: 0;
  transform: scale(0.1);
}
100% {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes pop-up {
  0% {
    opacity: 0;
    transform: scale(0.1);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}