/* Motion: card flips, bust shake, win glow. Everything here is off under prefers-reduced-motion. */

@media (prefers-reduced-motion:no-preference){
  @keyframes flipin{
    0%{transform:translateY(-12px) rotateY(85deg) scale(.72);opacity:0;filter:brightness(1.16)}
    60%{transform:translateY(1px) rotateY(-8deg) scale(1.03);opacity:1}
    100%{transform:none;opacity:1}}
  @keyframes shake{10%,90%{transform:translateX(-3px) rotate(-.4deg)}
                   30%,70%{transform:translateX(4px) rotate(.5deg)}
                   50%{transform:translateX(-5px)}}
  @keyframes pop{from{transform:scale(.94);opacity:.4}to{transform:none;opacity:1}}
  @keyframes beatpop{from{transform:translateY(-4px);opacity:.3}to{transform:none;opacity:1}}
  @keyframes flash{from{box-shadow:inset 0 0 0 999px rgba(217,83,79,.35)}
                   to{box-shadow:inset 0 0 0 999px rgba(217,83,79,0)}}
  @keyframes glow{0%{box-shadow:0 0 0 0 rgba(233,180,76,.55),0 6px 18px rgba(0,0,0,.28)}
                  60%{box-shadow:0 0 0 10px rgba(233,180,76,0),0 6px 18px rgba(0,0,0,.28)}
                  100%{box-shadow:0 0 0 0 rgba(233,180,76,0),0 6px 18px rgba(0,0,0,.28)}}
  @keyframes deckdrop{from{transform:translateY(-6px) scale(.9);opacity:.5}
                      to{transform:none;opacity:1}}
  @keyframes pulseglow{0%,100%{box-shadow:0 0 0 2px rgba(233,180,76,.9),
      0 2px 3px var(--shade),0 1px 0 rgba(255,255,255,.5) inset,inset 0 0 0 1px rgba(0,0,0,.07)}
    50%{box-shadow:0 0 0 4px rgba(233,180,76,.5),
      0 2px 3px var(--shade),0 1px 0 rgba(255,255,255,.5) inset,inset 0 0 0 1px rgba(0,0,0,.07)}}
  .c.fresh{animation:flipin .36s var(--ease) backwards}
  .me.bang{animation:shake .5s ease}
  .me.bang .live{animation:flash .6s ease}
  .me.win{animation:glow 1.1s ease}
  .big{animation:pop .35s ease-out}
  .beat.pop{animation:beatpop .32s ease-out}
  .deck.fresh i{animation:deckdrop .3s var(--ease)}
  .c.pickable{animation:pulseglow 1.6s ease-in-out infinite}
  @keyframes reactionrise{
    0%{transform:translateY(0) scale(.6);opacity:0}
    15%{transform:translateY(-10vh) scale(1);opacity:1}
    80%{opacity:1}
    100%{transform:translateY(-58vh) scale(1.05);opacity:0}}
  .reactionpop{animation:reactionrise 2s ease-out forwards}
}
@media (prefers-reduced-motion:reduce){
  .c.fresh,.me.bang,.me.bang .live,.me.win,.big,.beat.pop,.deck.fresh i,.reactionpop{animation:none}
}
/* The in-app "Reduce motion" setting (public/js/prefs.js) forces the same
   result regardless of the OS-level media query. */
:root.rm .c.fresh,:root.rm .me.bang,:root.rm .me.bang .live,:root.rm .me.win,
:root.rm .big,:root.rm .beat.pop,:root.rm .deck.fresh i,:root.rm .c.pickable,:root.rm .reactionpop{
  animation:none!important}

/* The floating-reaction overlay: fixed above everything, never intercepts
   taps. With no animation (reduced motion, above) a reaction still holds on
   screen at full opacity until popReaction()'s timeout removes it. */
#reactions{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:40}
.reactionpop{position:absolute;bottom:4rem;font-size:2rem;
  filter:drop-shadow(0 3px 6px rgba(0,0,0,.4))}