/* Shared motion language: short, consistent, and respectful of reduced motion. */
:root{--motion-fast:140ms;--motion-normal:220ms;--motion-slow:300ms;--motion-ease:cubic-bezier(.2,.7,.25,1)}
html{scroll-behavior:smooth;scroll-padding-top:100px}
button,.button,.text-link,.category-chip,.account-nav-item,.seller-sidebar nav a,.seller-sidebar nav button,.top-nav a,.footer-links a,.concierge-purchase{transition:background-color var(--motion-fast) ease,color var(--motion-fast) ease,border-color var(--motion-fast) ease,box-shadow var(--motion-normal) ease,transform var(--motion-fast) var(--motion-ease)}
input,textarea,select{transition:border-color var(--motion-fast) ease,box-shadow var(--motion-fast) ease,background-color var(--motion-fast) ease}
input:focus-visible,textarea:focus-visible,select:focus-visible{box-shadow:0 0 0 3px #fdb52325}
button:active:not(:disabled),.button:active{transform:translateY(1px)}
.product-card,.department-card,.quick-link{transition:transform var(--motion-normal) var(--motion-ease),box-shadow var(--motion-normal) ease,border-color var(--motion-fast) ease}
@media(hover:hover) and (pointer:fine){.button:hover:not(:disabled){transform:translateY(-1px)}.product-card:hover{transform:translateY(-3px)}.department-card:hover,.quick-link:hover{transform:translateY(-2px)}}
@keyframes ui-fade-in{from{opacity:0}to{opacity:1}}
@keyframes ui-rise-in{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
@keyframes ui-pop-in{from{opacity:0;transform:translateY(6px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}
.account-dropdown-panel:not([hidden]){animation:ui-pop-in var(--motion-fast) var(--motion-ease);transform-origin:top right}
.messages-panel:not([hidden]){animation:ui-pop-in var(--motion-normal) var(--motion-ease);transform-origin:bottom right}
.dashboard-view:not([hidden]),.seller-view:not([hidden]),.concierge-purchases-panel:not([hidden]){animation:ui-rise-in var(--motion-normal) var(--motion-ease)}
dialog:modal:not(.cart-drawer){animation:ui-pop-in var(--motion-normal) var(--motion-ease)}
dialog:modal::backdrop{animation:ui-fade-in var(--motion-normal) ease}
.cart-drawer{transition:transform var(--motion-normal) var(--motion-ease)}
.toast{transition:opacity var(--motion-normal) ease,transform var(--motion-normal) var(--motion-ease)}
.product-grid{overflow-anchor:none}.seller-catalog-photo{aspect-ratio:1;object-fit:contain}.detail-photo{overflow:hidden}.detail-photo img{animation:ui-fade-in var(--motion-fast) ease}.purchase-photo,.cart-row-image,.order-photo{contain:layout paint}
.messages-log,.cart-drawer-items,.concierge-chat-log{overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#bac9db transparent}
@view-transition{navigation:auto}
::view-transition-old(root){animation:ui-fade-in 120ms ease reverse}
::view-transition-new(root){animation:ui-fade-in 160ms ease}
@media(prefers-reduced-motion:reduce){html,html:focus-within,*{scroll-behavior:auto!important}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;animation-delay:0ms!important;transition-delay:0ms!important}::view-transition-old(root),::view-transition-new(root){animation:none!important}}
