/* R109 animations.css — 12组关键帧 */
@keyframes slideInRight {
  from { transform: translateX(30px); opacity: 0; }
  to { transform: translateX(0); opacity: 1; }
}
@keyframes slideOutLeft {
  from { transform: translateX(0); opacity: 1; }
  to { transform: translateX(-30px); opacity: 0; }
}
@keyframes shake {
  0%, 100% { transform: translateX(0); }
  25% { transform: translateX(-6px); }
  75% { transform: translateX(6px); }
}
@keyframes checkBounce {
  0% { transform: scale(0); }
  50% { transform: scale(1.3); }
  100% { transform: scale(1); }
}
@keyframes spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}
@keyframes expandDown {
  from { max-height: 0; opacity: 0; }
  to { max-height: 400px; opacity: 1; }
}
@keyframes fadeInUp {
  from { transform: translateY(20px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}
@keyframes toastIn {
  from { transform: translateY(100%); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}
@keyframes toastOut {
  from { transform: translateY(0); opacity: 1; }
  to { transform: translateY(100%); opacity: 0; }
}
@keyframes cardPulse {
  0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--primary) 40%, transparent); }
  100% { box-shadow: 0 0 0 8px transparent; }
}
@keyframes progressPulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.7; }
}
@keyframes toggleSlide {
  from { transform: translateX(0); }
  to { transform: translateX(20px); }
}
@keyframes emojiScale {
  0% { transform: scale(1); }
  30% { transform: scale(1.3); }
  100% { transform: scale(1); }
}

.anim-slide-in { animation: slideInRight 0.3s ease; }
.anim-shake { animation: shake 0.2s ease; }
.anim-check { animation: checkBounce 0.5s ease; }
.anim-expand { animation: expandDown 0.3s ease; }
.anim-pulse { animation: cardPulse 0.4s ease; }
.anim-emoji { animation: emojiScale 0.3s ease; }
.anim-fade-up { animation: fadeInUp 0.4s ease; }

.spinner {
  display: inline-block;
  width: 16px; height: 16px;
  border: 2px solid rgba(255,255,255,0.4);
  border-top-color: #fff;
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
  vertical-align: middle;
}