html{scroll-behavior:smooth}
body{animation:sitePageIn .32s cubic-bezier(.2,.8,.2,1) both}
a,button,.btn,.btn-primary,.btn-cancel,input,select,textarea,.sidebar-link,.nav-link,.pay-tab,.pay-icon-btn{transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background-color .18s ease,color .18s ease,opacity .18s ease}
button:active,.btn:active,.btn-primary:active,.btn-cancel:active{transform:translateY(1px) scale(.985)}
input:focus,select:focus,textarea:focus{box-shadow:0 0 0 4px rgba(47,109,255,.10);border-color:#8fb4ff!important}
.motion-item{opacity:0;transform:translateY(14px) scale(.992);filter:saturate(.96);will-change:transform,opacity;transition:opacity .52s cubic-bezier(.2,.8,.2,1),transform .52s cubic-bezier(.2,.8,.2,1),filter .52s ease;transition-delay:calc(min(var(--motion-index,0),12) * 38ms)}
.motion-item.is-visible{opacity:1;transform:translateY(0) scale(1);filter:saturate(1)}
.motion-ready .modal:not(.hidden),.motion-ready [role="dialog"]:not(.hidden){animation:siteOverlayIn .18s ease both}
.motion-ready .modal:not(.hidden) .modal-box,.motion-ready [role="dialog"]:not(.hidden)>div{animation:siteModalIn .24s cubic-bezier(.2,.8,.2,1) both}
.motion-ready table tbody tr{transition:background-color .18s ease,transform .18s ease}
.motion-ready table tbody tr:hover{background:#f8fbff}
.motion-ready .node-toast,.motion-ready .toast,.motion-ready .notification{animation:siteToastIn .22s cubic-bezier(.2,.8,.2,1) both}
@media (hover:hover){
  .motion-ready button:hover,.motion-ready .btn:hover,.motion-ready .btn-primary:hover,.motion-ready .btn-cancel:hover{transform:translateY(-1px)}
  .motion-ready .card:hover,.motion-ready .product-card:hover,.motion-ready .category-card:hover,.motion-ready .pay-panel:hover,.motion-ready .panel:hover,.motion-ready .glass-card:hover,.motion-ready .stat-card:hover{transform:translateY(-2px);box-shadow:0 18px 40px rgba(15,23,42,.08)}
}
@keyframes sitePageIn{from{opacity:0}to{opacity:1}}
@keyframes siteOverlayIn{from{opacity:0}to{opacity:1}}
@keyframes siteModalIn{from{opacity:0;transform:translateY(14px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes siteToastIn{from{opacity:0;transform:translateY(-8px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  body,.motion-item,.motion-ready .modal:not(.hidden),.motion-ready [role="dialog"]:not(.hidden),.motion-ready .modal:not(.hidden) .modal-box,.motion-ready [role="dialog"]:not(.hidden)>div,.motion-ready .node-toast,.motion-ready .toast,.motion-ready .notification{animation:none!important;transition:none!important;opacity:1!important;transform:none!important;filter:none!important}
}
