/* Keyframes (baseadas nas animações do layout de referência) */
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes fadeOpacity { from { opacity: 0; } to { opacity: 1; } }
@keyframes fadeIn { from { opacity: 0; transform: translate3d(0, 15px, 0); } to { opacity: 1; transform: none; } }
@keyframes fadeScale { from { opacity: 0; transform: scale(0.94); } to { opacity: 1; transform: scale(1); } }
@keyframes fadeScaleOut { from { opacity: 1; transform: scale(1); } to { opacity: 0; transform: scale(0.94); } }
@keyframes cardReveal { from { opacity: 0; filter: blur(4px); } to { opacity: 1; filter: blur(0); } }
@keyframes skeletonSweep { to { transform: translateX(100%); } }
@keyframes livePing { 0% { box-shadow: 0 0 0 0 currentColor; } 70% { box-shadow: 0 0 0 5px transparent; } 100% { box-shadow: 0 0 0 0 transparent; } }
@keyframes ping { 75%, 100% { transform: scale(2); opacity: 0; } }
@keyframes pulse { 50% { opacity: 0.5; } }
@keyframes marquee { to { transform: translateX(-50%); } }
@keyframes toastIn { from { opacity: 0; transform: translate3d(40px, 0, 0); } to { opacity: 1; transform: none; } }
@keyframes toastOut { to { opacity: 0; transform: translate3d(40px, 0, 0); } }
@keyframes toastLife { from { transform: scaleX(1); } to { transform: scaleX(0); } }
@keyframes popIn { from { opacity: 0; transform: translateY(-6px) scale(0.98); } to { opacity: 1; transform: none; } }
@keyframes sheetUp { from { transform: translateY(100%); } to { transform: none; } }
@keyframes drawerIn { from { transform: translateX(-100%); } to { transform: none; } }
@keyframes drawerOut { to { transform: translateX(-100%); } }
@keyframes slideDownRow { from { opacity: 0; transform: translateY(-100%); } to { opacity: 1; transform: none; } }
@keyframes slideRightIn { from { opacity: 0; transform: translateX(-24px); } to { opacity: 1; transform: none; } }
@keyframes flashUp { 0% { color: var(--win); } 100% { color: inherit; } }
@keyframes flashDown { 0% { color: var(--loss); } 100% { color: inherit; } }
@keyframes raceRing { from { stroke-dashoffset: var(--ring-start); } to { stroke-dashoffset: var(--ring-end); } }
@keyframes floatY { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
@keyframes shine { 0%, 40% { left: -70%; opacity: 0; } 50% { opacity: 0.8; } 70%, 100% { left: 125%; opacity: 0; } }
@keyframes oddsUp { 0% { background: rgba(94, 228, 60, 0.28); } 100% { background: var(--surface); } }
@keyframes oddsDown { 0% { background: rgba(255, 90, 106, 0.28); } 100% { background: var(--surface); } }
@keyframes shake { 10%, 90% { transform: translateX(-1px); } 20%, 80% { transform: translateX(2px); } 30%, 50%, 70% { transform: translateX(-4px); } 40%, 60% { transform: translateX(4px); } }
@keyframes pop { 0% { transform: scale(0.6); opacity: 0; } 60% { transform: scale(1.08); opacity: 1; } 100% { transform: scale(1); } }
@keyframes flipIn { from { transform: rotateY(90deg); } to { transform: rotateY(0); } }

/* Revelação por rolagem */
[data-reveal] { opacity: 0; transform: translate3d(0, 18px, 0); transition: opacity 600ms var(--ease), transform 600ms var(--ease); }
[data-reveal].is-visible { opacity: 1; transform: none; }
body.reduce-anim [data-reveal] { opacity: 1; transform: none; transition: none; }
body.reduce-anim *, body.reduce-anim *::before, body.reduce-anim *::after { animation-duration: 0.001ms !important; transition-duration: 0.001ms !important; }

/* ============ vida (animações sutis, sem custo) — GrenGren ============ */
@keyframes kenBurns { 0% { transform: scale(1.02) translate(0,0); } 100% { transform: scale(1.12) translate(-1.5%, -1%); } }
@keyframes floatArt { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
@keyframes sheenSweep { 0% { transform: translateX(-160%) skewX(-18deg); } 100% { transform: translateX(320%) skewX(-18deg); } }
@keyframes glowPulse { 0%,100% { opacity: .55; } 50% { opacity: .9; } }

.promo-bg { animation: kenBurns 18s ease-in-out infinite alternate; will-change: transform; }
.hero-slide.is-active .promo-img { animation: floatArt 5s ease-in-out infinite; }
.hero-slide.is-active .promo-games .pg-1 { animation: floatArt 5.5s ease-in-out infinite; }

/* brilho que cruza o card do jogo no hover */
.game-card { position: relative; overflow: hidden; }
.game-card::after { content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 45%; pointer-events: none;
  background: linear-gradient(100deg, transparent, rgba(255,255,255,0.28), transparent); opacity: 0; z-index: 3; }
.game-card:hover::after { opacity: 1; animation: sheenSweep 0.75s ease; }
.game-card img { transition: transform 0.4s var(--ease, cubic-bezier(.22,1,.36,1)); }
.game-card:hover img { transform: scale(1.06); }

/* arte lateral do login com respiração leve */
.auth2-art { animation: kenBurns 22s ease-in-out infinite alternate; }

@media (prefers-reduced-motion: reduce) {
  .promo-bg, .hero-slide .promo-img, .hero-slide .promo-games .pg-1, .auth2-art { animation: none !important; }
  .game-card:hover::after { animation: none; }
}