@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes fadeOut { from { opacity: 1; } to { opacity: 0; } }
@keyframes slideInUp { from { transform: translateY(100%); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
@keyframes slideOutDown { from { transform: translateY(0); opacity: 1; } to { transform: translateY(100%); opacity: 0; } }
@keyframes slideInDown { from { transform: translateY(-100%); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
@keyframes slideOutUp { from { transform: translateY(0); opacity: 1; } to { transform: translateY(-100%); opacity: 0; } }
@keyframes slideInLeft { from { transform: translateX(-100%); opacity: 0; } to { transform: translateX(0); opacity: 1; } }
@keyframes slideOutLeft { from { transform: translateX(0); opacity: 1; } to { transform: translateX(-100%); opacity: 0; } }
@keyframes slideInRight { from { transform: translateX(100%); opacity: 0; } to { transform: translateX(0); opacity: 1; } }
@keyframes slideOutRight { from { transform: translateX(0); opacity: 1; } to { transform: translateX(100%); opacity: 0; } }
@keyframes scaleIn { from { transform: scale(0.8); opacity: 0; } to { transform: scale(1); opacity: 1; } }
@keyframes scaleOut { from { transform: scale(1); opacity: 1; } to { transform: scale(0.8); opacity: 0; } }
@keyframes pulse { 0%,100% { opacity: 1; } 50% { opacity: 0.5; } }
@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
@keyframes wave { 0%,100% { transform: scaleY(1); } 50% { transform: scaleY(2); } }
@keyframes messageAppear { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
@keyframes crownGlow { 0%,100% { filter: drop-shadow(0 0 2px var(--gold)); transform: scale(1); } 25% { filter: drop-shadow(0 0 6px var(--gold)); transform: scale(1.15); } 50% { filter: drop-shadow(0 0 3px var(--gold)); transform: scale(1); } 75% { filter: drop-shadow(0 0 8px var(--gold)); transform: scale(1.1); } }
@keyframes story-progress { from { width: 0%; } to { width: 100%; } }
@keyframes story-pulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(160, 85, 247, 0.4); } 50% { box-shadow: 0 0 0 5px rgba(160, 85, 247, 0); } }
@keyframes qrScanLine { 0% { top: 10%; } 50% { top: 90%; } 100% { top: 10%; } }

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
}