/* Motion is feedback, not a second layout system. All dimensions live elsewhere. */
:root { --motion-press:90ms; --motion-fast:140ms; --motion-normal:200ms; --motion-sheet:240ms; --motion-out:170ms; --ease-out:cubic-bezier(.2,.7,.2,1); }
.button { transition:background-color var(--motion-fast),color var(--motion-fast); }
.button:not(:disabled):active { filter:brightness(.94); }
.quantity > button { transition:background-color var(--motion-press); }
.quantity > button:not([aria-disabled=true]):active { background:#ccddbf; }
.quantity > button .icon,.ic-btn > .icon { transition:transform var(--motion-press) var(--ease-out); }
.quantity > button:not([aria-disabled=true]):active > .icon,.ic-btn:not(:disabled):active > .icon { transform:scale(.88); }
.bottom-nav button > span { position:relative; isolation:isolate; }
.bottom-nav button.active > span { background:none; }
.bottom-nav button.active > span::before { content:''; position:absolute; inset:0; border-radius:inherit; background:#e8efdf; z-index:-1; }
.bottom-nav button.active > span[data-nav-enter]::before { animation:navSelected var(--motion-normal) var(--ease-out); }
@keyframes navSelected { from { opacity:.45; } to { opacity:1; } }
/* Sheet transitions are orchestrated only on real open/close, never on typing. */
.sheet,.scrim { animation:none; }
.motion-exit-layer { position:fixed; inset:0; z-index:80; pointer-events:none!important; }
.motion-exit-layer * { pointer-events:none!important; }
#toast { transition:opacity var(--motion-fast),transform var(--motion-normal) var(--ease-out); transform:translateY(8px); }
#toast.show { transform:translateY(0); }
#toast { visibility:hidden; }
#toast.show { visibility:visible; }
/* A focused action must remain available; only its icon/value animates. */
.product-action { overflow:clip; }
.product-action:focus-within { overflow:visible; }
.toggle-row input:after { transition:transform var(--motion-fast) var(--ease-out); }
.promo-dots i { transition:none; }
.skeleton { position:relative; overflow:hidden; animation:none; background:#e9eee1; }
.skeleton::after { content:''; position:absolute; inset:0; background:linear-gradient(90deg,transparent,#ffffff70,transparent); transform:translateX(-100%); animation:loadingSweep 1400ms linear 3; }
@keyframes loadingSweep { to { transform:translateX(100%); } }
@media(prefers-reduced-motion:reduce) {
 *,*::before,*::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
 .quantity > button:active > .icon,.ic-btn:active > .icon { transform:none!important; }
 #toast,#toast.show { transform:none; }
 .skeleton::after { display:none; }
}
.preview *, .preview *::before,.preview *::after { animation:none!important; transition:none!important; }