/* ================================================
   ANIMATIONS & KEYFRAMES
   ================================================ */

/* Swap Animation */
@keyframes swap-pop {
	0% { transform: translateY(0) scale(1); opacity: 1; }
	30% { transform: translateY(-6px) scale(1.06); opacity: 1; }
	60% { transform: translateY(6px) scale(0.98); opacity: 0.95; }
	100% { transform: translateY(0) scale(1); opacity: 1; }
}

.swap-animate {
	animation: swap-pop 420ms var(--transition-fast) both;
	box-shadow: 0 0 18px var(--glow);
	z-index: 10;
	position: relative;
}

/* Grid Background Animation */
@keyframes grid-pan {
	0%, 100% { transform: translate(0, 0); }
	50% { transform: translate(23px, 23px); }
}

@keyframes grid-flicker {
	0%, 100% { opacity: 0.68; }
	50% { opacity: 0.52; }
}

/* Pulse Wave Animation */
@keyframes pulse-wave {
	0%, 100% { transform: scale(1); opacity: 0.32; }
	50% { transform: scale(1.15); opacity: 0.48; }
}

/* Particle Glide Animation */
@keyframes particles-glide {
	0% { background-position: 0 0, 0 0; }
	100% { background-position: 240px 240px, -320px -320px; }
}

/* Frame Pulse Animation */
@keyframes frame-pulse {
	0%, 100% { opacity: 0.7; box-shadow: 0 0 26px rgba(255, 43, 69, 0.32); }
	50% { opacity: 1; box-shadow: 0 0 38px rgba(255, 43, 69, 0.48); }
}

/* Aurora Shift Animation */
@keyframes aurora-shift {
	0%, 100% { transform: translateY(0); opacity: 0.8; }
	50% { transform: translateY(-5%); opacity: 0.95; }
}

/* Logo Glow Animation */
@keyframes logo-glow {
	0%, 100% { text-shadow: 0 0 24px rgba(250, 34, 84, 0.35); }
	50% { text-shadow: 0 0 38px rgba(250, 34, 84, 0.55), 0 0 48px rgba(250, 34, 84, 0.28); }
}

/* Shimmer Effect */
@keyframes shimmer {
	0% { transform: translateX(-100%) skewX(-15deg); }
	100% { transform: translateX(200%) skewX(-15deg); }
}

/* Pulse Animation */
@keyframes pulse {
	0%, 100% { opacity: 0.55; }
	50% { opacity: 1; }
}

/* Fade In Animation */
@keyframes fadeIn {
	from { opacity: 0; }
	to { opacity: 1; }
}

/* Fade Out Animation */
@keyframes fadeOut {
	from { opacity: 1; }
	to { opacity: 0; }
}

/* Slide Up Animation */
@keyframes slideUp {
	from { transform: translateY(20px); opacity: 0; }
	to { transform: translateY(0); opacity: 1; }
}

/* Slide Down Animation */
@keyframes slideDown {
	from { transform: translateY(-20px); opacity: 0; }
	to { transform: translateY(0); opacity: 1; }
}

/* Scale In Animation */
@keyframes scaleIn {
	from { transform: scale(0.9); opacity: 0; }
	to { transform: scale(1); opacity: 1; }
}

/* Rotate In Animation */
@keyframes rotateIn {
	from { transform: rotate(-180deg) scale(0.5); opacity: 0; }
	to { transform: rotate(0) scale(1); opacity: 1; }
}

/* Glow Pulse Animation */
@keyframes glowPulse {
	0%, 100% { box-shadow: 0 0 10px var(--glow); }
	50% { box-shadow: 0 0 20px var(--glow), 0 0 30px var(--accent-soft); }
}