/**
 * Restaurant Tic-Tac-Toe - Animations
 */

/* ========== KEYFRAMES ========== */

@keyframes rttgFadeIn {
	from { opacity: 0; transform: translateY(-6px); }
	to   { opacity: 1; transform: translateY(0); }
}

@keyframes rttgPopupIn {
	from { opacity: 0; transform: scale(.7) translateY(30px); }
	to   { opacity: 1; transform: scale(1) translateY(0); }
}

@keyframes rttgBounce {
	0%, 80%, 100% { transform: translateY(0); }
	40%            { transform: translateY(-10px); }
}

@keyframes rttgSpin {
	to { transform: rotate(360deg); }
}

@keyframes rttgConfettiFall {
	0%   { transform: translateY(-10px) rotate(0deg); opacity: 1; }
	100% { transform: translateY(400px) rotate(720deg); opacity: 0; }
}

@keyframes rttgCellPlace {
	0%   { transform: scale(0) rotate(-15deg); opacity: 0; }
	60%  { transform: scale(1.2) rotate(5deg); }
	100% { transform: scale(1) rotate(0deg); opacity: 1; }
}

@keyframes rttgWinnerPulse {
	0%, 100% { box-shadow: 0 0 0 0 rgba(249,202,36,.6); }
	50%       { box-shadow: 0 0 0 10px rgba(249,202,36,0); }
}

@keyframes rttgShake {
	0%, 100%       { transform: translateX(0); }
	10%, 50%, 90%  { transform: translateX(-6px); }
	30%, 70%       { transform: translateX(6px); }
}

@keyframes rttgGlow {
	0%, 100% { box-shadow: 0 0 8px rgba(108,99,255,.4); }
	50%       { box-shadow: 0 0 24px rgba(108,99,255,.8); }
}

@keyframes rttgSlideUp {
	from { opacity: 0; transform: translateY(20px); }
	to   { opacity: 1; transform: translateY(0); }
}

@keyframes rttgZoomIn {
	from { opacity: 0; transform: scale(0); }
	to   { opacity: 1; transform: scale(1); }
}

/* ========== APPLIED ANIMATIONS ========== */

/* Cell appears on place */
.rttg-cell .rttg-x-symbol.rttg-placed,
.rttg-cell .rttg-o-symbol.rttg-placed,
.rttg-cell .rttg-x-img.rttg-placed,
.rttg-cell .rttg-o-img.rttg-placed {
	animation: rttgCellPlace .35s cubic-bezier(.175,.885,.32,1.275) forwards;
}

/* Winner cells pulse */
.rttg-cell-winner {
	animation: rttgWinnerPulse 1s ease-in-out infinite;
}

/* Board shake on loss */
.rttg-board.rttg-shake {
	animation: rttgShake .5s ease;
}

/* Board glow on hover during player's turn */
.rttg-board.rttg-player-turn {
	animation: rttgGlow 2s ease-in-out infinite;
}

/* Score update flash */
.rttg-score-num.rttg-score-updated {
	animation: rttgZoomIn .4s cubic-bezier(.175,.885,.32,1.275);
}

/* Status bar slide in */
.rttg-status-text.rttg-status-change {
	animation: rttgSlideUp .25s ease;
}

/* Difficulty button press */
.rttg-diff-btn:active {
	transform: scale(.94) !important;
}

/* Popup overlay fade */
.rttg-overlay.rttg-overlay-show {
	animation: rttgFadeIn .25s ease;
}

/* Code reveal animation */
.rttg-code-box.rttg-code-appear {
	animation: rttgPopupIn .5s cubic-bezier(.175,.885,.32,1.275);
}

/* Copy button feedback */
.rttg-copy-btn.rttg-copied {
	background: #43E97B;
	animation: rttgZoomIn .2s ease;
}

/* ========== QR MODE ========== */
.rttg-qr-mode .rttg-board {
	animation: rttgGlow 3s ease-in-out infinite;
}

/* ========== REDUCED MOTION ========== */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
	}
}