/* t1022u/t1023u interaction motion — transform/opacity only; pause when hidden */
@media (prefers-reduced-motion: reduce){
  .m-stagger > *,.m-press,.m-reveal,.m-toast,.sheet,.pic img,.ring,.flip-tile,.swipe-front,.m-pane,.timer.tick,.check-pop,.fav-burst i{
    animation:none!important;transition:none!important}
  .m-reveal{opacity:1;transform:none}
}
@media (prefers-reduced-motion: no-preference){
  .m-press{transition:transform .14s var(--m-spring)}
}
:root{--m-spring:cubic-bezier(.22,1.2,.36,1);--m-out:cubic-bezier(.2,.8,.2,1)}
.m-press{touch-action:manipulation}
.m-press:active,button.m-press:active,.rcard.m-press:active,.wcard.m-press:active,.slot.m-press:active,.chip.m-press:active,.gitem.m-press:active{transform:scale(.96)}
.m-reveal{opacity:0;transform:translate3d(0,14px,0)}
.m-reveal.in{opacity:1;transform:none;transition:opacity .42s var(--m-out),transform .42s var(--m-spring); transition-delay:calc(var(--i,0) * 40ms)}
.pic{background-color:color-mix(in srgb,var(--muted) 12%,var(--paper)); position:relative; overflow:hidden}
.pic img{opacity:0;transform:scale(1.02);transition:opacity .35s ease,transform .5s var(--m-out); width:100%; height:100%; object-fit:cover; display:block}
.pic img.ok{opacity:1;transform:none}
.pic.shimmer::before{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.18) 50%,transparent 70%);background-size:200% 100%;animation:mShim 1.1s linear infinite;z-index:1;pointer-events:none}
.pic:has(img.ok).shimmer::before,.pic.shimmer.is-paused::before{display:none}
@keyframes mShim{to{background-position:-200% 0}}
.fav-burst{position:absolute;inset:0;pointer-events:none;display:grid;place-items:center;z-index:5; overflow:visible}
.fav-burst i{position:absolute;width:6px;height:6px;border-radius:50%;background:var(--accent,#e85);animation:mBurst .55s var(--m-out) forwards}
@keyframes mBurst{to{transform:translate(var(--x),var(--y)) scale(0);opacity:0}}
.check-pop{animation:mCheck .45s var(--m-spring) both}
@keyframes mCheck{0%{transform:scale(.9)}40%{transform:scale(1.06)}100%{transform:scale(1)}}
.gitem.done .swipe-front, .swipe-front.done{opacity:.55}
.swipe-front.done span:first-of-type, .swipe-front.done span, .gitem.done span{text-decoration:line-through}
.sheet{transition:transform .45s var(--m-spring), opacity .3s ease}
.sheet-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.35);opacity:0;pointer-events:none;z-index:45;transition:opacity .3s ease; backdrop-filter:none!important}
.sheet-backdrop.on{opacity:1;pointer-events:auto}
.toast{transition:opacity .28s ease, transform .28s var(--m-spring)}
.tabs nav button{transition:transform .14s var(--m-spring), background .2s ease, color .2s ease}
.tabs nav button:active{transform:scale(.94)}
.h-scroll .rcard,.h-scroll .wcard{transition:transform .2s var(--m-out); transform-origin:center}
.flip-expand{position:fixed;z-index:70;border-radius:24px;overflow:hidden;pointer-events:none;box-shadow:0 18px 40px rgba(0,0,0,.28)}
.timer.tick,.tick{animation:mTick .18s var(--m-spring)}
@keyframes mTick{50%{transform:scale(1.04)}100%{transform:scale(1)}}
.list-bounce{overscroll-behavior-y:contain}
/* t1023u: pause CSS animations when tab hidden */
html.is-hidden *{animation-play-state:paused!important}
/* no always-on large-area blur */
.scrim,.hero .scrim,.detail-hero .scrim{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}