/* 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}}

/* draw calendar */
.p-cal-row{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}
.p-cal-row>li{display:grid;align-content:start;gap:10px;min-height:150px;padding:14px;background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow-1)}
.p-cal-row>li.none{background:transparent;box-shadow:inset 0 0 0 1px var(--line)}
.p-cal-row>li.today{background:var(--accent);color:var(--accent-ink)}
.p-cal-day b{display:block;font:var(--display-weight) 1.3rem/1 var(--font-display);text-transform:uppercase}
.p-cal-day span{font-size:.84rem;opacity:.75}
.p-cal-row ul{display:grid;gap:6px;font-size:.88rem;line-height:1.25}
.p-cal-row ul a{text-decoration:none;font-weight:650}
.p-cal-row ul a:hover{text-decoration:underline}
.p-cal-row .more,.p-cal-free{font-size:.82rem;opacity:.7}
@media (max-width:900px){.p-cal-row{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(150px,46%);overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px}.p-cal-row>li{scroll-snap-align:start}}

/* category tiles */
.p-cat-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.p-cat{position:relative;display:flex;align-items:flex-end;min-height:200px;padding:18px;overflow:hidden;text-align:left;color:#fff;background:var(--ink);border:0;border-radius:var(--radius)}
.p-cat img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease-out)}
.p-cat::after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 30%,rgba(0,0,0,.72))}
.p-cat span{position:relative;z-index:1}
.p-cat strong{display:block;font:var(--display-weight) clamp(1.5rem,2.2vw,2rem)/1 var(--font-display);text-transform:uppercase}
.p-cat em{font-style:normal;font-size:.9rem;opacity:.85}
@media (hover:hover){.p-cat:hover img{transform:scale(1.06)}}
@media (max-width:760px){.p-cat-row{grid-template-columns:repeat(2,minmax(0,1fr))}.p-cat{min-height:150px}}

/* cursor preview */
.cur-prev{position:fixed;left:0;top:0;z-index:150;width:240px;aspect-ratio:4/3;margin:0;overflow:hidden;border-radius:12px;pointer-events:none;opacity:0;box-shadow:0 30px 60px -24px rgba(0,0,0,.45);transition:opacity .18s var(--ease-in)}
.cur-prev.on{opacity:1;transition:opacity .24s var(--ease-out)}
.cur-prev img{width:100%;height:100%;object-fit:cover}
@media (prefers-reduced-motion:reduce){.p-cat img{transition:none}}