/* Live layer styles. Designs restyle these through tokens; timings follow one scale. */
:root{--ease-out:cubic-bezier(.16,1,.3,1);--ease-in:cubic-bezier(.55,0,1,.45);--ease-move:cubic-bezier(.65,0,.35,1);--ease-pop:cubic-bezier(.22,1,.36,1);--t-press:160ms;--t-state:240ms}
.btn:active{transform:scale(.96)}

/* endless strip */
.mq-on{display:flex;overflow:hidden!important;mask-image:linear-gradient(90deg,transparent,#000 4%,#000 94%,transparent)}
.mq-on>*{flex:none;animation:mq var(--mq-dur,40s) linear infinite}
.mq-on:hover>*,.mq-on:focus-within>*{animation-play-state:paused}
@keyframes mq{to{transform:translateX(-100%)}}
.mq-static{overflow-x:auto}

/* rolling digits */
.cd-part b{display:inline-block}
.cd-part b.is-tick{animation:roll .42s var(--ease-out)}
@keyframes roll{from{transform:translateY(-55%);opacity:0;filter:blur(2px)}to{transform:none;opacity:1;filter:none}}

/* sliding filter marker */
.has-mark{position:relative}
.rail-mark{position:absolute;left:0;top:10px;height:42px;border-radius:999px;background:var(--accent);transition:transform var(--t-state) var(--ease-out),width var(--t-state) var(--ease-out);pointer-events:none}
.rail-mark.no-anim{transition:none}
.has-mark button{position:relative;z-index:1}
.has-mark button[aria-pressed=true]{background:transparent!important;box-shadow:none!important}

/* scroll progress on the pill */
.o-pill{position:relative}
.scroll-prog{position:absolute;left:22px;right:22px;bottom:3px;height:2px;border-radius:2px;background:var(--pill-dot,var(--accent));transform:scaleX(0);transform-origin:left;pointer-events:none;opacity:.9}

/* basket toast */
.play-toast{position:fixed;right:16px;top:92px;z-index:120;max-width:min(92vw,360px);pointer-events:none;opacity:0;transform:translateY(-8px) scale(.98);transition:opacity 180ms var(--ease-in),transform 180ms var(--ease-in)}
.play-toast.on{opacity:1;transform:none;transition:opacity 260ms var(--ease-out),transform 320ms var(--ease-pop)}
.cart-btn.bump{animation:bump .5s var(--ease-pop)}
@keyframes bump{30%{transform:scale(1.18)}}

/* sticky Enter bar on prize pages, phones only */
.enter-bar{position:fixed;left:10px;right:10px;bottom:10px;z-index:80;display:none;align-items:center;justify-content:space-between;gap:12px;padding:10px 10px 10px 16px;color:var(--ink);background:var(--surface);border-radius:16px;box-shadow:0 18px 40px -16px rgba(0,0,0,.35),0 0 0 1px var(--line);transform:translateY(130%);transition:transform 220ms var(--ease-in)}
.enter-bar.on{transform:none;transition:transform 340ms var(--ease-out)}
.enter-bar em{display:block;font-size:.84rem;font-style:normal;color:var(--muted)}.enter-bar strong{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:.95rem}
.enter-bar span{min-width:0}
.enter-bar .btn{flex:none;min-height:46px}
@media (max-width:860px){.enter-bar{display:flex}}

@media (prefers-reduced-motion:reduce){.mq-on>*{animation:none}.cd-part b.is-tick{animation:none}.rail-mark,.play-toast,.enter-bar{transition:none}.cart-btn.bump{animation:none}}