/*
 * Airbnb signature UI motion — cdn.databayt.org/airbnb/motion.css
 * Extracted verbatim from Airbnb's design-system @keyframes (v2026), cleanly
 * renamed for reuse. These are the hover / init-load / transition animations:
 * loaders, skeletons, reveals, sheet transitions, card flip, marker pulse.
 *
 * Usage:  <div class="ab-anim ab-skeleton-shimmer"></div>
 *         .my-loader { animation: dot-pulse 1.2s infinite; }
 */
:root {
  --ab-ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --ab-ease-emphasized: cubic-bezier(0.2, 0, 0, 1.2);
  --ab-dur-fast: 150ms;
  --ab-dur-base: 300ms;
  --ab-dur-slow: 500ms;
}
.ab-anim { animation-duration: var(--ab-dur-base); animation-timing-function: var(--ab-ease-standard); animation-fill-mode: both; }
.ab-fade-in { animation-name: fade-in; }
.ab-fade-in-slide-up { animation-name: fade-in-slide-up; }
.ab-slide-up { animation-name: slide-up; }
.ab-grow { animation-name: grow; }
.ab-scale-in { animation-name: scale-in; }
.ab-bloom { animation-name: bloom; }
.ab-zoom-in { animation-name: zoom-in; }
.ab-skeleton-shimmer { animation: skeleton-shimmer 1.5s linear infinite; }
.ab-dot-pulse { animation: dot-pulse 1.2s ease-in-out infinite; }
.ab-spin { animation: spin 900ms linear infinite; }
.ab-marker-pulse { animation: marker-pulse 1.8s var(--ab-ease-standard) infinite; }

@keyframes spin { 
  0% { transform: rotate(-90deg); }
  100% { transform: rotate(270deg); }
}

@keyframes dot-pulse { 
  100% { opacity: 0; }
  80% { opacity: 0; }
  0% { opacity: 0; }
  50% { opacity: 1; }
  30% { opacity: 1; }
}

@keyframes bouncy-dot { 
  100% { transform: translateY(3px); }
  0% { transform: translateY(3px); }
  50% { transform: translateY(-3px); }
}

@keyframes ai-dot-bounce { 
  0% { transform: translateY(0px) scaleY(1); animation-timing-function: cubic-bezier(0.8, 0, 1, 1); }
  50% { transform: translateY(10px) scaleY(1.5); animation-timing-function: cubic-bezier(0.1, 0.9, 0.4, 1); }
  100% { transform: translateY(0px) scaleY(1); }
}

@keyframes skeleton-shimmer { 
  0% { background-position: 200% 0px; }
  100% { background-position: -200% 0px; }
}

@keyframes shimmer-sweep { 
  0% { background-position: 100% 0px; }
  100% { background-position: -100% 0px; }
}

@keyframes wave { 
  0% { transform: translateY(0px); }
  25% { transform: translateY(3px); }
  75% { transform: translateY(-3px); }
  100% { transform: translateY(0px); }
}

@keyframes fade-in { 
  0% { opacity: 0; }
  18% { opacity: 1; }
}

@keyframes fade-in-slide-up { 
  0% { opacity: 0; transform: translateY(8px); }
  100% { opacity: 1; transform: translateY(0px); }
}

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

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

@keyframes grow { 
  0% { transform: scale(0.05, 1); }
  100% { transform: scale(1, 1); }
}

@keyframes scale-in { 
  0% { transform: scale(0.05); }
  100% { transform: scale(1); }
}

@keyframes bloom { 
  0% { opacity: 0; scale: 0; }
  100% { opacity: 1; scale: 1; }
}

@keyframes zoom-in { 
  0% { transform: scale(1); }
  100% { transform: scale(1.1); }
}

@keyframes bounce { 
  100% { transform: translateY(-5%); }
  50% { transform: none; }
}

@keyframes flip-card { 
  0% { transform: rotateY(0deg); }
  50% { transform: rotateY(90deg); }
  100% { transform: rotateY(180deg); }
}

@keyframes image-grow { 
  0% { transform: scale(0.5); }
  100% { transform: scale(1); }
}

@keyframes marker-pulse { 
  0% { transform: scale(1); }
  50% { transform: scale(1.35); }
  100% { transform: scale(1); }
}

@keyframes rise-up { 
  0% { transform: translateY(40px); }
  100% { transform: translateY(0px); }
}

@keyframes sheet-slide-up { 
  0% { transform: translate(0,var(--slide-up_amount,100px)); }
  100% { transform: translate(0px, 0px); }
}

@keyframes sheet-fade-in { 
  0% { opacity: 0; }
  100% { opacity: 1; }
}

@keyframes overlay-enter { 
  0% { opacity: 0; }
  100% { opacity: 1; }
}

@keyframes blink { 
  0% { opacity: 1; }
  30% { opacity: 0.5; }
  53% { opacity: 1; }
  76% { opacity: 0.5; }
  100% { opacity: 1; }
}