/* PixelRivo V1.1: friendly motion and game-card previews. */
.hero-copy>*{animation:pr-fade-up .72s cubic-bezier(.2,.75,.25,1) both}
.hero-copy>.eyebrow{animation-delay:.04s}
.hero-copy>h1{animation-delay:.12s}
.hero-copy>.hero-text{animation-delay:.2s}
.hero-copy>.hero-actions{animation-delay:.28s}
.hero-copy>.trust-list{animation-delay:.36s}
.orb-one{animation:pr-orb-one 8s ease-in-out infinite}
.orb-two{animation:pr-orb-two 7s ease-in-out infinite}
.game-window{animation:pr-window-float 5.5s ease-in-out infinite}
.pixel-controller{animation:pr-controller-bob 2.7s ease-in-out infinite}
.pixel-star{animation:pr-star-twinkle 1.7s ease-in-out infinite}
.pixel-heart{animation:pr-heart-pop 2s ease-in-out infinite}

.preview-hint{margin:8px 0 0;color:#727b96;font-size:13px;font-weight:700}
.game-card>a{display:block;height:100%;position:relative}
.game-card>a:after{content:'ANIMATED PREVIEW';position:absolute;top:10px;right:10px;padding:4px 7px;border-radius:99px;background:rgba(16,22,47,.8);color:#fff;font-size:9px;font-weight:900;letter-spacing:.6px;opacity:0;transform:translateY(-5px);transition:opacity .2s,transform .2s;pointer-events:none}
.game-card:focus-within{transform:translateY(-5px);box-shadow:var(--shadow)}
.game-card a:focus-visible{outline:3px solid var(--purple);outline-offset:3px;border-radius:18px}

@media (hover:hover){
  .game-card:is(:hover,:focus-within)>a:after{opacity:1;transform:translateY(0)}
  .game-card:is(:hover,:focus-within) .snake-art span{animation:pr-snake-head .65s ease-in-out infinite alternate}
  .game-card:is(:hover,:focus-within) .snake-art i{animation:pr-snake-middle .65s .08s ease-in-out infinite alternate}
  .game-card:is(:hover,:focus-within) .snake-art b{animation:pr-snake-tail .65s .16s ease-in-out infinite alternate}
  .game-card:is(:hover,:focus-within) .memory-art span{animation:pr-memory-flip 1.15s ease-in-out infinite}
  .game-card:is(:hover,:focus-within) .memory-art span:nth-child(2){animation-delay:.12s}
  .game-card:is(:hover,:focus-within) .memory-art span:nth-child(3){animation-delay:.24s}
  .game-card:is(:hover,:focus-within) .memory-art span:nth-child(4){animation-delay:.36s}
  .game-card:is(:hover,:focus-within) .reaction-art span{animation:pr-ready-fade .8s ease-in-out infinite alternate}
  .game-card:is(:hover,:focus-within) .reaction-art b{animation:pr-go-pop .75s ease-in-out infinite}
  .game-card:is(:hover,:focus-within) .number-art span{animation:pr-number-slide .9s ease-in-out infinite alternate}
  .game-card:is(:hover,:focus-within) .number-art b{animation:pr-answer-pop .9s .18s ease-in-out infinite alternate}
  .game-card:is(:hover,:focus-within) .color-art span{animation:pr-color-word 1.05s ease-in-out infinite}
  .game-card:is(:hover,:focus-within) .color-art i{animation:pr-blue-orbit 1.1s ease-in-out infinite}
  .game-card:is(:hover,:focus-within) .color-art b{animation:pr-pink-orbit 1.1s .18s ease-in-out infinite}
}

@keyframes pr-fade-up{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@keyframes pr-orb-one{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-14px,12px) scale(1.06)}}
@keyframes pr-orb-two{0%,100%{transform:translate(0,0)}50%{transform:translate(16px,-14px)}}
@keyframes pr-window-float{0%,100%{transform:rotate(6deg) translateY(0)}50%{transform:rotate(4deg) translateY(-12px)}}
@keyframes pr-controller-bob{0%,100%{transform:rotate(-7deg) translateY(0)}50%{transform:rotate(-3deg) translateY(-7px)}}
@keyframes pr-star-twinkle{0%,100%{transform:scale(.8) rotate(0);opacity:.65}50%{transform:scale(1.18) rotate(15deg);opacity:1}}
@keyframes pr-heart-pop{0%,100%{transform:scale(.9) rotate(-5deg)}50%{transform:scale(1.14) rotate(5deg)}}
@keyframes pr-snake-head{from{transform:translate(0,0)}to{transform:translate(18px,8px)}}
@keyframes pr-snake-middle{from{transform:translate(0,0)}to{transform:translate(17px,9px)}}
@keyframes pr-snake-tail{from{transform:translate(0,0)}to{transform:translate(15px,7px)}}
@keyframes pr-memory-flip{0%,100%{transform:rotateY(0) scale(1)}50%{transform:rotateY(180deg) scale(1.06);background:#fff}}
@keyframes pr-ready-fade{from{opacity:.45;transform:translateX(-4px)}to{opacity:1;transform:translateX(5px)}}
@keyframes pr-go-pop{0%,100%{transform:scale(.86)}50%{transform:scale(1.12);box-shadow:0 0 0 11px rgba(255,255,255,.32)}}
@keyframes pr-number-slide{from{transform:translateY(-5px) rotate(-2deg)}to{transform:translateY(5px) rotate(2deg)}}
@keyframes pr-answer-pop{from{transform:scale(.85);opacity:.55}to{transform:scale(1.12);opacity:1}}
@keyframes pr-color-word{0%,100%{transform:translateX(0);color:#f34868}50%{transform:translateX(11px);color:#366ef9}}
@keyframes pr-blue-orbit{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-22px,22px) scale(1.13)}}
@keyframes pr-pink-orbit{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(22px,-18px) scale(1.13)}}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}