/* A recipe belongs to its own element/pseudo-element, never its descendants. */
@property --motion-recipe { syntax: '*'; inherits: false; initial-value: none; }
@property --motion-repeat { syntax: '*'; inherits: false; initial-value: once; }
@property --motion-delay { syntax: '*'; inherits: false; initial-value: 0s; }
@property --motion-play-state { syntax: '*'; inherits: false; initial-value: running; }
@layer utilities {
.animate-glow-pulse { --motion-recipe: glow-pulse; --motion-repeat: infinite; opacity: var(--spring-opacity, 1); transform: var(--spring-transform, none); }
.animate-float { --motion-recipe: float; --motion-repeat: infinite; opacity: var(--spring-opacity, 1); transform: var(--spring-transform, none); }
.animate-shimmer { --motion-recipe: shimmer; --motion-repeat: infinite; opacity: var(--spring-opacity, 1); transform: var(--spring-transform, none); }
.animate-slide-up { --motion-recipe: slide-up; --motion-repeat: once; opacity: var(--spring-opacity, 1); transform: var(--spring-transform, none); }
.animate-fade-in { --motion-recipe: fade-in; --motion-repeat: once; opacity: var(--spring-opacity, 1); transform: var(--spring-transform, none); }
.animate-progress-bar { --motion-recipe: progress-bar; --motion-repeat: once; opacity: var(--spring-opacity, 1); transform: var(--spring-transform, none); }
.animate-hero-reveal { --motion-recipe: heroReveal; --motion-repeat: once; opacity: var(--spring-opacity, 1); transform: var(--spring-transform, none); }
.animate-hero-reveal-delay-1 { --motion-recipe: heroReveal; --motion-repeat: once; opacity: var(--spring-opacity, 1); transform: var(--spring-transform, none); }
.animate-hero-reveal-delay-2 { --motion-recipe: heroReveal; --motion-repeat: once; opacity: var(--spring-opacity, 1); transform: var(--spring-transform, none); }
.animate-hero-reveal-delay-3 { --motion-recipe: heroReveal; --motion-repeat: once; opacity: var(--spring-opacity, 1); transform: var(--spring-transform, none); }
.animate-modal-backdrop { --motion-recipe: modalBackdrop; --motion-repeat: once; opacity: var(--spring-opacity, 1); transform: var(--spring-transform, none); }
.animate-modal-enter { --motion-recipe: modalEnter; --motion-repeat: once; opacity: var(--spring-opacity, 1); transform: var(--spring-transform, none); }
.animate-tab-switch { --motion-recipe: tabSwitch; --motion-repeat: once; opacity: var(--spring-opacity, 1); transform: var(--spring-transform, none); }
.animate-spin { --motion-recipe: spin; --motion-repeat: infinite; opacity: var(--spring-opacity, 1); transform: var(--spring-transform, none); }
.animate-pulse { --motion-recipe: pulse; --motion-repeat: infinite; opacity: var(--spring-opacity, 1); transform: var(--spring-transform, none); }
.animate-bounce { --motion-recipe: bounce; --motion-repeat: infinite; opacity: var(--spring-opacity, 1); transform: var(--spring-transform, none); }
.animate-ping { --motion-recipe: ping; --motion-repeat: infinite; opacity: var(--spring-opacity, 1); transform: var(--spring-transform, none); }
}