/* ==========================================================================
   Gamarium · the motion layer (Arcade Bright): press squash with a springy release, page slides, sheet springs,
   staggered pop-ins, breathing badges, tap ripples and sparkles, rolling digits, coin fly.
   Transform and opacity only; prefers-reduced-motion turns it into plain fades (arcade.css).
   ========================================================================== */

/* ---------- press: squash down, spring back with a slight overshoot ---------------- */
html :is(.cb, .rbtn, .ibtn, .cur, .backbtn, .gr, .et, .ps, .hl, .fx-tier, .rc-row, .bc, .fchip, .picks button, .plan, .nb, .eh, .medal, .tbtn, .mult,
  .sr-btn, .ph-holder, .sheet-x, .bt-btn, .dk-card, .tp-row, .ph-count, .amb-cardprev .kc, .bn) {
  transition: transform .34s cubic-bezier(.34, 1.7, .5, 1), box-shadow .22s ease, background-color .2s, filter .2s;
}
html :is(.cb, .rbtn, .ibtn, .cur, .backbtn, .gr, .et, .ps, .hl, .fx-tier, .rc-row, .bc, .fchip, .picks button, .plan, .nb, .eh, .mult, .sr-btn, .ph-holder,
  .sheet-x, .bt-btn, .tp-row):active:not([disabled]) {
  transform: translateY(2px) scale(.94); box-shadow: 0 1px 0 var(--ink); transition-duration: .07s, .07s;
}
html .sideb:active .medal, html .sideb:active .tbtn { transform: translateY(2px) scale(.92); box-shadow: 0 1px 0 var(--ink); transition-duration: .07s; }
html .bn:active { transform: scale(.97); transition-duration: .08s; }
/* cards lift on press */
html button.kc:active, html .dk-card:active .kc, html .amb-cardprev .kc:active { transform: translateY(-6px) scale(1.04) rotate(-1.5deg); transition: transform .12s ease-out; }
html button.kc { transition: transform .4s cubic-bezier(.34, 1.6, .5, 1); }

/* ---------- page transitions: a quick slide + fade in the direction of travel ---------- */
.view.is-active { animation: view-in .2s cubic-bezier(.2, .8, .2, 1) backwards; }
.view.is-active.in-r { animation-name: view-in-r; }
.view.is-active.in-l { animation-name: view-in-l; }
@keyframes view-in-r { from { opacity: 0; transform: translateX(22px); } }
@keyframes view-in-l { from { opacity: 0; transform: translateX(-22px); } }

/* ---------- sheets: spring up, drop down ------------------------------------------- */
.sheet { transition: transform .24s cubic-bezier(.55, 0, .8, .35); }
.sheet-wrap.is-open .sheet { transition: transform .5s cubic-bezier(.2, 1.22, .32, 1); }
.sheet::after { content: ""; position: absolute; left: calc(var(--bw) * -1); right: calc(var(--bw) * -1); top: 100%; height: 60px; background: #FFF7EC;
  border-left: var(--bw) solid var(--ink); border-right: var(--bw) solid var(--ink); }
.sheet-backdrop { transition: opacity .25s ease; }

/* ---------- staggered pop-in on first load ------------------------------------------ */
.pi { animation: pop-in .36s cubic-bezier(.2, 1.35, .4, 1) backwards; animation-delay: calc(var(--i, 0) * 35ms); }
@keyframes pop-in { from { opacity: 0; transform: translateY(14px) scale(.93); } }

/* ---------- idle life: breathing badges, the claimable counts ------------------------- */
.ibtn em, .et .bdg, .sr-badge, .tab-badge { animation: breathe 2.2s ease-in-out infinite; }
@keyframes breathe { 50% { transform: scale(1.16); } }
.pulse { animation: pulse .5s cubic-bezier(.2, 1.6, .4, 1); }
@keyframes pulse { 35% { transform: scale(1.14); } 70% { transform: scale(.97); } }

/* ---------- Daily Tap: tap ripple, sparkles, Turbo glow -------------------------------- */
.tap-ring { position: absolute; width: 70px; height: 70px; margin: -35px 0 0 -35px; border-radius: 50%; border: 4px solid #fff; pointer-events: none; will-change: transform, opacity; }
.stage.is-turbo .tap-ring { border-color: #FFE27A; }
.spk { position: absolute; width: 14px; height: 14px; margin: -7px 0 0 -7px; pointer-events: none; background: #FFF3B0; will-change: transform, opacity;
  clip-path: polygon(50% 0, 62% 38%, 100% 50%, 62% 62%, 50% 100%, 38% 62%, 0 50%, 38% 38%); }
.spk.w { background: #fff; }

/* ---------- rolling digits (the live rewards ticker) ----------------------------------- */
.dg { display: inline-block; }
.dg.roll { animation: dg-roll .24s cubic-bezier(.2, .9, .3, 1.2); }
@keyframes dg-roll { from { transform: translateY(70%); opacity: 0; } }

/* ---------- coin fly ------------------------------------------------------- */
/* the eclipse sparkle (.cft, .fx-flare) lives in fx.css */
.fly-coin { will-change: transform, opacity; }

@media (prefers-reduced-motion: reduce) {
  .pi, .view.is-active { animation: view-in .15s ease-out backwards !important; }
  .ibtn em, .et .bdg, .sr-badge, .tab-badge { animation: none; }
}
