*{margin:0;padding:0;box-sizing:border-box}html{--font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--ease: cubic-bezier(.4, 0, .2, 1);--spring: cubic-bezier(.34, 1.56, .64, 1);--shadow-xs: 0 1px 2px oklch(0 0 0 / .04);--shadow-sm: 0 1px 3px oklch(0 0 0 / .06), 0 1px 2px oklch(0 0 0 / .04);--shadow-md: 0 4px 16px oklch(0 0 0 / .08), 0 2px 4px oklch(0 0 0 / .04);--shadow-lg: 0 20px 40px oklch(0 0 0 / .12), 0 8px 16px oklch(0 0 0 / .06);--shadow-xl: 0 32px 64px oklch(0 0 0 / .16), 0 16px 32px oklch(0 0 0 / .08);--shadow-primary: 0 4px 20px oklch(.55 .17 152 / .38);--shadow-primary-lg: 0 8px 32px oklch(.55 .17 152 / .45);--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 20px;--radius-full: 999px;--bg: oklch(.98 0 0);--surface: oklch(1 0 0);--surface-2: oklch(.96 .001 215);--bg-sunken: oklch(.93 .002 215);--line: oklch(.88 .003 215);--line-strong: oklch(.8 .005 215);--text: oklch(.2 .004 215);--text-2: oklch(.5 .005 215);--text-3: oklch(.65 .004 215);--primary: oklch(.55 .17 152);--primary-ink: oklch(1 0 0);--primary-hover: oklch(.48 .18 152);--primary-soft: oklch(.96 .04 152);--green-100: oklch(.97 .04 152);--green-300: oklch(.9 .08 152);--green-500: oklch(.68 .13 152);--green-600: oklch(.55 .17 152);--green-700: oklch(.42 .14 152);--red-100: oklch(.97 .04 25);--red-300: oklch(.9 .08 25);--red-500: oklch(.65 .15 25);--red-700: oklch(.42 .14 25);--amber-100: oklch(.98 .03 78);--amber-500: oklch(.75 .13 78);--blue-100: oklch(.97 .04 245);--blue-500: oklch(.6 .15 245);--warm-100: oklch(.98 .03 45);--warm-500: oklch(.75 .13 45);--warm-600: oklch(.65 .15 45)}body{background:var(--bg);color:var(--text);font-family:var(--font-sans);font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body.theme-dark{--bg: oklch(.12 .018 215);--surface: oklch(.17 .018 215);--surface-2: oklch(.22 .018 215);--bg-sunken: oklch(.1 .018 215);--line: oklch(.28 .016 215);--line-strong: oklch(.38 .016 215);--text: oklch(.95 .01 215);--text-2: oklch(.68 .018 215);--text-3: oklch(.48 .016 215);--primary-soft: oklch(.22 .05 152);--shadow-xs: 0 1px 2px oklch(0 0 0 / .2);--shadow-sm: 0 1px 3px oklch(0 0 0 / .25), 0 1px 2px oklch(0 0 0 / .15);--shadow-md: 0 4px 16px oklch(0 0 0 / .35), 0 2px 4px oklch(0 0 0 / .2);--shadow-lg: 0 20px 40px oklch(0 0 0 / .5), 0 8px 16px oklch(0 0 0 / .3)}@keyframes gg-scale-in{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideInUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInDown{0%{opacity:0;transform:translateY(-16px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.93)}to{opacity:1;transform:scale(1)}}@keyframes slideInRight{0%{opacity:0;transform:translate(100%)}to{opacity:1;transform:translate(0)}}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.65}}@keyframes cartBounce{0%,to{transform:scale(1)}50%{transform:scale(1.2)}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}@keyframes fadeScaleIn{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:none}}@keyframes shrink{0%{width:100%}to{width:0%}}@keyframes floatIn{0%{opacity:0;transform:scale(.6) translateY(6px)}to{opacity:1;transform:scale(1) translateY(0)}}main{animation:fadeIn .35s var(--ease)}a:focus-visible,[role=button]:focus-visible{outline:2px solid var(--primary);outline-offset:2px;border-radius:6px}button{outline:none;transition:all .18s var(--ease)}button:focus-visible{outline:2px solid var(--primary);outline-offset:2px;border-radius:8px}button:active:not(:disabled){transform:scale(.97)}input,textarea,select{transition:all .18s var(--ease)}input:focus,select:focus,textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px #0088441f;box-shadow:0 0 0 3px oklch(.55 .17 152 / .12);outline:none}::selection{background-color:#0843;background-color:oklch(.55 .17 152 / .2);color:inherit}:focus-visible{outline:2px solid var(--primary);outline-offset:2px;border-radius:4px}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--line);border-radius:999px}::-webkit-scrollbar-thumb:hover{background:var(--text-3)}.glass{background:#ffffffd9;backdrop-filter:blur(24px) saturate(1.4);-webkit-backdrop-filter:blur(24px) saturate(1.4)}body.theme-dark .glass{background:#061114e0}.app-header{background:#ffffffe6;backdrop-filter:blur(24px) saturate(1.4);-webkit-backdrop-filter:blur(24px) saturate(1.4);border-bottom:1px solid var(--line);box-shadow:0 1px #0000000a;position:sticky;top:0;z-index:40}body.theme-dark .app-header{background:#061114e6}.app-header:after{content:"";position:absolute;bottom:-1px;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent 0%,oklch(.55 .17 152 / .3) 30%,oklch(.55 .17 152 / .3) 70%,transparent 100%);pointer-events:none}.skeleton{background:linear-gradient(90deg,var(--surface-2) 25%,var(--surface) 50%,var(--surface-2) 75%);background-size:1000px 100%;animation:shimmer 2s infinite;border-radius:8px}.prod-card{position:relative;background:var(--surface);border-radius:18px;overflow:hidden;transition:transform .22s var(--ease),box-shadow .22s var(--ease);box-shadow:var(--shadow-sm);cursor:pointer;display:flex;flex-direction:column}.prod-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-md)}.prod-card:active{transform:translateY(-2px);box-shadow:var(--shadow-sm)}.prod-card.out-of-stock{opacity:.58;cursor:not-allowed;pointer-events:none}.prod-card .prod-img-area{position:relative;width:100%;padding-bottom:68%;overflow:hidden;flex-shrink:0}.prod-card .prod-img-area img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;transition:transform .4s var(--ease)}.prod-card:hover .prod-img-area img{transform:scale(1.04)}.prod-card .prod-img-placeholder{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center}.prod-add-btn{position:absolute;bottom:10px;right:10px;width:38px;height:38px;border-radius:50%;background:var(--primary);color:var(--primary-ink);border:none;cursor:pointer;display:grid;place-items:center;box-shadow:var(--shadow-primary);opacity:0;transform:scale(.55) translateY(6px);transition:opacity .18s var(--ease),transform .22s var(--spring);z-index:5;font-size:22px;font-weight:300;line-height:1;font-family:var(--font-sans)}.prod-card:hover .prod-add-btn{opacity:1;transform:scale(1) translateY(0)}.prod-add-btn:hover{background:var(--primary-hover);box-shadow:var(--shadow-primary-lg);transform:scale(1.1)!important}.prod-add-btn:active{transform:scale(.94)!important}.prod-card .prod-body{flex:1;display:flex;flex-direction:column;padding:12px 13px 13px;gap:4px}.prod-card .prod-name{font-size:13px;font-weight:700;color:var(--text);line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.prod-card .prod-unit{font-size:11px;color:var(--text-3);font-weight:500}.prod-card .prod-price-row{display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:8px}.prod-card .prod-price{font-size:16px;font-weight:800;color:var(--text);letter-spacing:-.02em}.prod-stepper{display:flex;align-items:center;gap:0;background:var(--primary);border-radius:10px;overflow:hidden;box-shadow:var(--shadow-primary)}.prod-stepper-btn{width:30px;height:30px;border:none;background:transparent;color:var(--primary-ink);font-weight:700;font-size:17px;cursor:pointer;display:grid;place-items:center;font-family:var(--font-sans);transition:background .12s;flex-shrink:0}.prod-stepper-btn:hover{background:#0000001f}.prod-stepper-count{min-width:24px;text-align:center;font-weight:800;font-size:13px;color:var(--primary-ink)}.cat-pill{padding:7px 14px;border-radius:var(--radius-full);border:1.5px solid var(--line);background:transparent;color:var(--text-2);font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap;font-family:var(--font-sans);transition:all .16s var(--ease);display:inline-flex;align-items:center;gap:5px;flex-shrink:0;line-height:1}.cat-pill:hover{border-color:var(--primary);color:var(--primary);background:var(--primary-soft)}.cat-pill.active{background:var(--primary);border-color:var(--primary);color:var(--primary-ink);box-shadow:var(--shadow-primary)}.cat-pill.active:hover{background:var(--primary-hover);border-color:var(--primary-hover)}.card-hover{transition:transform .22s var(--ease),box-shadow .22s var(--ease)}.card-hover:hover{transform:translateY(-4px);box-shadow:var(--shadow-md)}.card-hover:active{transform:translateY(-2px)}.shadow-hover:hover{box-shadow:var(--shadow-md)}.shadow-hover-lg:hover{box-shadow:var(--shadow-lg)}.badge-new{animation:pulse 2.5s var(--ease) infinite}.cart-badge-new{animation:cartBounce .4s var(--spring)}.modal-backdrop{backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}.tooltip{animation:slideInUp .18s var(--ease) forwards}.text-transition{transition:color .18s var(--ease)}.background-transition{transition:background-color .18s var(--ease)}.progress-step-active{animation:scaleIn .3s var(--ease)}.progress-line-fill{transition:width .55s var(--ease)}.footer-newsletter{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}.footer-links{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr 1.3fr;gap:32px}.footer-links>*{min-width:0;overflow:hidden}.footer-newsletter>*{min-width:0}.header-nav{display:flex;align-items:center;gap:2px;margin-left:8px}@media(max-width:640px){.header-nav{display:none!important}}@media(max-width:640px){.hideOnMobile{display:none!important}}@media(min-width:641px){.showOnMobile{display:none!important}}@media(max-width:640px){.mobile-bottom-nav{display:flex}}@media(max-width:640px){.app-main{padding-bottom:calc(72px + env(safe-area-inset-bottom,0px))}}@media(max-width:768px){.sidebar-desktop{display:none!important}}@media(max-width:1024px){.footer-links{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:768px){.footer-newsletter{grid-template-columns:1fr;gap:24px}.footer-links{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}}@media(max-width:640px){.footer-newsletter{padding:36px 20px!important}.footer-links-wrap{padding:36px 20px 28px!important}.footer-bottom-bar{padding:16px 20px!important}}@media(max-width:480px){.footer-links{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}}@media(max-width:640px){.cart-grid{grid-template-columns:1fr!important}}@media(max-width:900px){.sidebar-desktop{display:none}.mobile-filter-btn,.mobile-filter-modal{display:flex!important}}@media(min-width:901px){.sidebar-desktop{display:block}.mobile-filter-btn,.mobile-filter-modal{display:none!important}}@media(hover:none)and (pointer:coarse){button,a,input,select,textarea{min-height:44px;min-width:44px}.prod-add-btn{opacity:1;transform:scale(1) translateY(0)}}@media print{header,footer,.no-print{display:none}body{background:#fff;color:#000}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@keyframes toastIn{0%{opacity:0;transform:translateY(-10px) scale(.96)}to{opacity:1;transform:none}}.cat-strip{scrollbar-width:none;-ms-overflow-style:none}.cat-strip::-webkit-scrollbar{display:none}.prod-browse-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(148px,1fr));gap:14px}@media(max-width:360px){.prod-browse-grid{grid-template-columns:repeat(2,1fr);gap:10px}}.checkout-cols{display:grid;grid-template-columns:1fr 300px;gap:28px;align-items:start}@media(max-width:720px){.checkout-cols{grid-template-columns:1fr}.checkout-sticky{position:static!important}.checkout-summary-first{order:-1}}@media(max-width:480px){.auth-card-responsive{padding:28px 22px!important;border-radius:20px!important}}.auth-row2{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}@media(max-width:500px){.auth-row2{grid-template-columns:1fr}}.progress-inner{display:flex;align-items:center;gap:16px;justify-content:center}.progress-step-item{display:flex;align-items:center;gap:16px}@media(max-width:580px){.progress-inner,.progress-step-item{gap:4px}.progress-step-label{display:none!important}.progress-connector{min-width:16px!important;margin:0!important}.progress-step-circle{width:32px!important;height:32px!important;font-size:12px!important}}.confirm-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}@media(max-width:480px){.confirm-detail-grid{grid-template-columns:1fr;gap:14px}}.header-btn-mobile{display:none!important}@media(max-width:640px){.header-btn-mobile{display:grid!important}}@media(max-width:640px){.hero-slide-inner{padding:48px 20px 68px!important;min-height:52vh!important}}@media(max-width:640px){.promo-banner-body{padding:28px 20px!important;flex-direction:column!important}.promo-banner-body button{width:100%}}@media(max-width:400px){.browse-toolbar{padding:8px 12px!important;gap:8px!important}}@media(max-width:380px){.cart-item-row{gap:8px!important;padding:10px 12px!important}.cart-item-img{width:54px!important;height:54px!important}}@media(max-width:480px){.wishlist-panel{max-width:100%!important}}@media(hover:none)and (pointer:coarse){.prod-add-btn{opacity:1!important;transform:scale(1) translateY(0)!important}}
