/* Phantom Arcades — shared site motion. Compositor-safe (transform+opacity), mobile-first, reduced-motion aware.
   Tuned 2026-08-17 after measuring on a real phone viewport: reveals were too subtle and too sparse (0-2 elements
   animating at a time) so the site read as static. Now: more travel + a slight scale so the movement is felt,
   and groups sweep in together. */

.mv{opacity:0;transform:translateY(26px) scale(.985);transition:opacity .62s cubic-bezier(.16,1,.3,1),transform .62s cubic-bezier(.16,1,.3,1);will-change:opacity,transform}
.mv.in{opacity:1;transform:none;will-change:auto}
@media(min-width:768px){.mv{transform:translateY(32px) scale(.99)}}

/* images inside a revealing card get a gentle counter-zoom so the card feels alive, not just faded */
.mv img{transition:transform .9s cubic-bezier(.16,1,.3,1)}
.mv:not(.in) img{transform:scale(1.05)}

/* hover / tap lift — works on touch (active) and mouse (hover) */
.sc-card,.a101-card,.sys-card,.m-card,.featcard,.cab,.pkg,.tier-card,.btn-coin,.btn-ghost,.m-more{transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
@media(hover:hover){
  .sc-card:hover,.a101-card:hover,.sys-card:hover,.m-card:hover,.featcard:hover,.cab:hover,.pkg:hover,.tier-card:hover{transform:translateY(-4px);box-shadow:0 12px 26px rgba(0,0,0,.35)}
  .btn-coin:hover,.btn-ghost:hover{transform:translateY(-2px)}
  /* chips floating over the 3D stage keep their own transform (the open-chip is centred with translateX(-50%) — the lift replaced it and the button jumped sideways on hover: Dennis, bug sheet row 39) */
  .stage-chips .btn-coin:hover,.stage-chips .btn-ghost:hover{transform:none}
}
.sc-card:active,.sys-card:active,.m-card:active,.a101-card:active{transform:translateY(-2px)}
.btn-coin:active,.btn-ghost:active{transform:translateY(-1px)}

.mv-rule{display:block;height:2px;width:44px;background:var(--blue-lit,#29a9e4);transform:scaleX(0);transform-origin:left;transition:transform .7s cubic-bezier(.16,1,.3,1);border-radius:2px;margin:6px 0}
.mv-rule.in{transform:scaleX(1)}

@media(prefers-reduced-motion:reduce){
  .mv,.mv-rule{opacity:1!important;transform:none!important;transition:none!important}
  .mv img{transform:none!important;transition:none!important}
  .sc-card:hover,.a101-card:hover,.sys-card:hover,.m-card:hover,.featcard:hover,.cab:hover,.pkg:hover,.tier-card:hover,.btn-coin:hover,.btn-ghost:hover,.btn-coin:active,.btn-ghost:active{transform:none!important;box-shadow:none!important}
}
html[data-motion="final"] .mv,html[data-motion="final"] .mv-rule{opacity:1!important;transform:none!important;transition:none!important}
html[data-motion="final"] .mv img{transform:none!important}
@media(hover:hover) and (min-width:901px){.stage-chips .open-chip:hover{transform:translateX(-50%)}}   /* desktop: the open-chip is centred by its own transform */