:root{--color-primary:#ff6b35;--font-sans:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-display:"Outfit", sans-serif;--transition-normal:all .3s cubic-bezier(.4, 0, .2, 1);--transition-fast:all .15s ease-in-out}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);background-color:var(--color-background);color:var(--color-text-primary);-webkit-font-smoothing:antialiased;min-height:100vh;line-height:1.5;transition:background-color .3s,color .3s;overflow-x:hidden}h1,h2,h3,h4,h5,h6{font-family:var(--font-display);color:var(--color-text-primary);font-weight:700}button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}button{cursor:pointer;transition:var(--transition-fast);background:0 0;border:none}a{color:inherit;text-decoration:none}.app-container{flex-direction:column;width:100%;max-width:100%;min-height:100vh;margin:0 auto;padding:0 16px;display:flex}@media (width>=768px){.app-container{padding:0 40px}}@media (width>=1400px){.app-container{padding:0 64px}}.main-content{flex:1;padding-bottom:80px}.product-grid{grid-template-columns:repeat(2,1fr);gap:12px;display:grid}@media (width>=600px){.product-grid{grid-template-columns:repeat(3,1fr);gap:16px}}@media (width>=900px){.product-grid{grid-template-columns:repeat(4,1fr)}}@media (width>=1200px){.product-grid{grid-template-columns:repeat(6,1fr)}}.premium-card{background-color:var(--color-card);border:1px solid var(--color-border);box-shadow:0 4px 20px var(--color-shadow);transition:var(--transition-normal);border-radius:16px;padding:16px;position:relative;overflow:hidden}.premium-card:hover{box-shadow:0 8px 30px var(--color-shadow);border-color:var(--color-primary-light);transform:translateY(-4px)}.discount-badge{background-color:var(--color-primary);color:var(--color-text-on-primary);font-family:var(--font-display);text-transform:uppercase;border-radius:8px;padding:4px 8px;font-size:11px;font-weight:800}.btn-primary{background-color:var(--color-primary);color:var(--color-text-on-primary);font-family:var(--font-display);box-shadow:0 4px 14px var(--color-shadow);transition:var(--transition-normal);border-radius:12px;justify-content:center;align-items:center;gap:8px;padding:12px 24px;font-weight:700;display:inline-flex}.btn-primary:hover{background-color:var(--color-primary-dark);box-shadow:0 6px 20px var(--color-shadow);transform:translateY(-1px)}.btn-primary:active{transform:translateY(1px)}.btn-primary:disabled{background-color:var(--color-border);color:var(--color-text-muted);box-shadow:none;cursor:not-allowed}.btn-secondary{background-color:var(--color-surface-secondary);color:var(--color-primary);border:1px solid var(--color-border);font-family:var(--font-display);transition:var(--transition-normal);border-radius:12px;justify-content:center;align-items:center;gap:8px;padding:12px 24px;font-weight:700;display:inline-flex}.btn-secondary:hover{background-color:var(--color-divider);border-color:var(--color-primary)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}.animate-fade{animation:.4s ease-out forwards fadeIn}.animate-slide-up{animation:.5s cubic-bezier(.16,1,.3,1) forwards slideUp}.animate-scale{animation:.4s cubic-bezier(.34,1.56,.64,1) forwards scaleIn}.animate-pulse{animation:2s ease-in-out infinite pulse}@keyframes bounceX{0%,to{transform:translate(0)}50%{transform:translate(4px)}}@keyframes cartBounce{0%,to{transform:scale(1)}25%{transform:scale(1.25)rotate(-8deg)}50%{transform:scale(1.25)rotate(8deg)}75%{transform:scale(1.25)rotate(-5deg)}}.cart-bounce-animate{animation:.4s ease-in-out cartBounce}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--color-background)}::-webkit-scrollbar-thumb{background:var(--color-border);transition:var(--transition-normal);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--color-primary)}.hide-scrollbar::-webkit-scrollbar{display:none}.hide-scrollbar{-ms-overflow-style:none;scrollbar-width:none}.bottom-nav{background-color:var(--color-tab-bar);border-top:1px solid var(--color-border);z-index:100;justify-content:space-around;align-items:center;height:64px;display:flex;position:fixed;bottom:0;left:0;right:0;box-shadow:0 -4px 16px #0000000d}@media (width>=768px){.bottom-nav{display:none}}.bottom-nav-item{color:var(--color-tab-inactive);transition:var(--transition-fast);flex-direction:column;align-items:center;gap:4px;font-size:11px;font-weight:500;display:flex}.bottom-nav-item.active{color:var(--color-tab-active)}.desktop-banners-grid{grid-template-columns:repeat(3,1fr);gap:20px;width:100%;margin-top:16px;margin-bottom:8px;display:grid}.mobile-banners-carousel{display:none}@media (width<=768px){.desktop-banners-grid{display:none}.mobile-banners-carousel{width:100%;box-shadow:0 4px 15px var(--color-shadow);border-radius:16px;margin-top:16px;margin-bottom:8px;display:block;position:relative;overflow:hidden}.banner-container{aspect-ratio:16/9}}.banner-slide{background-position:top;background-repeat:no-repeat;background-size:cover;align-items:flex-end;width:100%;height:100%;transition:transform .5s;display:flex;position:relative}.banner-overlay{z-index:1;background:linear-gradient(#0000001a 0%,#0003 40%,#000c 100%);position:absolute;inset:0}.banner-content{z-index:2;color:#fff;position:relative}.banner-content h2{font-family:var(--font-display);white-space:pre-line;margin-bottom:8px;font-size:2.2rem;font-weight:900;line-height:1.2}@media (width<=600px){.banner-content h2{font-size:1.4rem}}.banner-content p{opacity:.9;font-size:1rem}.no-scrollbar::-webkit-scrollbar{display:none}.no-scrollbar{-ms-overflow-style:none;scrollbar-width:none}@media (width<=768px){.desktop-only{display:none!important}}.premium-card img{transition:transform .3s cubic-bezier(.16,1,.3,1)!important}.premium-card:hover img{transform:scale(1.05)}@keyframes pulse-skeleton{0%,to{opacity:.6}50%{opacity:1}}.pulse-skeleton{background-color:var(--color-border);border-radius:4px;animation:1.5s ease-in-out infinite pulse-skeleton}.trending-chip:hover{background-color:var(--color-primary-light)!important;color:var(--color-primary)!important;border-color:var(--color-primary)!important}@keyframes shake{0%,to{transform:translate(0)}20%,60%{transform:translate(-4px)}40%,80%{transform:translate(4px)}}.shake-error{animation:.4s ease-in-out shake}