/* Trading Floor motion system (p10-motion, 2026-11-01). Shared by the site and the app; see docs/MOTION.md.
   Rules: animate transform and opacity only (never width/height/top/left/margin); every effect is wrapped so
   prefers-reduced-motion turns it off; no effect may add latency to an action (feedback runs on the same
   frame as the click, handlers are never deferred). */
:root{
  --m-fast:120ms;  --m-base:240ms;  --m-slow:600ms;
  --m-ease:cubic-bezier(.2,.8,.2,1);          /* settle: fast out, soft landing */
  --m-ease-in:cubic-bezier(.4,0,1,1);
  --m-spring:cubic-bezier(.34,1.3,.64,1);     /* gentle overshoot for lifts and chips */
  --m-lift:translateY(-2px);  --m-press:scale(.98);
}
/* .m-reveal: hidden until motion.js adds .is-in when it scrolls into view (once); style="--m-i: N" staggers, 6 steps at most */
.m-reveal{opacity:0;transform:translateY(12px);transition:opacity var(--m-base) var(--m-ease),transform var(--m-base) var(--m-ease);transition-delay:calc(min(var(--m-i,0),6) * 60ms)}
.m-reveal.is-in{opacity:1;transform:none}
/* .m-lift: a hover lift with a softer, larger shadow (pointer devices only) */
.m-lift{transition:transform var(--m-base) var(--m-ease),box-shadow var(--m-base) var(--m-ease)}
@media (hover:hover){.m-lift:hover{transform:var(--m-lift);box-shadow:0 18px 40px -22px rgba(0,0,0,.45)}}
/* .m-press: press feedback on the same frame as the pointer goes down */
.m-press{transition:transform var(--m-fast) var(--m-ease)}
.m-press:active{transform:var(--m-press)}
/* .m-fade-in: a plain opacity fade on arrival */
.m-fade-in{animation:m-fade var(--m-base) var(--m-ease) both}
@keyframes m-fade{from{opacity:0}to{opacity:1}}
/* .m-count: motion.js counts the number up from 0 to data-count over var(--m-slow) when it enters view */
.m-count{font-variant-numeric:tabular-nums}
/* .m-skeleton: a shimmering placeholder block, replaced in place by the real content */
.m-skeleton{position:relative;overflow:hidden;border-radius:8px;color:transparent;background:linear-gradient(90deg,rgba(128,128,128,.10) 0%,rgba(128,128,128,.20) 50%,rgba(128,128,128,.10) 100%);background-size:200% 100%;animation:m-shimmer 1.2s linear infinite}
@keyframes m-shimmer{from{background-position:200% 0}to{background-position:-200% 0}}
@media (prefers-reduced-motion:reduce){
  .m-reveal{opacity:1;transform:none;transition:none}
  .m-lift,.m-press{transition-duration:1ms}
  .m-lift:hover,.m-press:active{transform:none}
  .m-fade-in{animation:none}
  .m-skeleton{animation:none;background-position:0 0}
}