html{scroll-behavior:smooth;background:#fff}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}body{margin:0;padding:0;overflow-x:hidden;touch-action:manipulation;background:#fff}#root{background:#fff;min-height:100vh}:root{--font-size-xs: 12px;--font-size-sm: 14px;--font-size-base: 16px;--font-size-lg: 18px;--font-size-xl: 20px;--font-size-2xl: 24px;--font-size-3xl: 28px;--font-size-4xl: 32px;--line-height-tight: 1.25;--line-height-normal: 1.5;--line-height-relaxed: 1.75;--color-text-primary: #0f172a;--color-text-secondary: #475569;--color-text-muted: #64748b;--color-text-light: #94a3b8;--color-bg-primary: #ffffff;--color-bg-secondary: #f8fafc;--color-bg-tertiary: #f1f5f9;--color-border-light: #e2e8f0;--color-border-medium: #cbd5e0;--color-border-dark: #94a3b8;--color-primary: #374151;--color-primary-hover: #1f2937;--color-primary-light: #f3f4f6;--color-success: #38a169;--color-success-light: #c6f6d5;--color-warning: #d69e2e;--color-warning-light: #faf089;--color-error: #e53e3e;--color-error-light: #fed7d7;--space-xs: 4px;--space-sm: 8px;--space-md: 12px;--space-lg: 16px;--space-xl: 20px;--space-2xl: 24px;--space-3xl: 32px;--space-4xl: 40px;--space-5xl: 48px;--radius-sm: 4px;--radius-md: 6px;--radius-lg: 8px;--radius-xl: 12px;--radius-2xl: 16px;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04);--shadow-card: 0 2px 8px rgba(0, 0, 0, .08), 0 1px 3px rgba(0, 0, 0, .12)}html,body,#root{height:100%}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol;font-size:var(--font-size-base);line-height:var(--line-height-normal);color:var(--color-text-primary);background:var(--color-bg-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1,h2,h3,h4,h5,h6{line-height:var(--line-height-tight);margin:0 0 var(--space-lg) 0;font-weight:500;color:var(--color-text-primary)}h1{font-size:var(--font-size-4xl);margin-bottom:var(--space-2xl);font-weight:600}h2{font-size:var(--font-size-3xl);margin-bottom:var(--space-xl)}h3{font-size:var(--font-size-2xl);margin-bottom:var(--space-lg)}h4{font-size:var(--font-size-xl);margin-bottom:var(--space-md)}h5{font-size:var(--font-size-lg);margin-bottom:var(--space-sm)}h6{font-size:var(--font-size-base);margin-bottom:var(--space-sm)}p,ul,ol{margin:var(--space-md) 0;line-height:var(--line-height-relaxed)}ul,ol{padding-left:var(--space-xl)}li{margin-bottom:var(--space-xs)}button,input,select{font-size:var(--font-size-lg)}button{padding:var(--space-md) var(--space-lg);border:1px solid var(--color-border-medium);border-radius:var(--radius-md);background:var(--color-bg-primary);color:var(--color-text-primary);font-size:var(--font-size-base);font-weight:400;cursor:pointer;transition:all .15s ease;box-shadow:var(--shadow-sm);position:relative;overflow:hidden}.btn-primary{background:var(--color-primary);color:#fff;border-color:var(--color-primary)}.btn-primary:hover{background:var(--color-primary-hover);border-color:var(--color-primary-hover)}.btn-success{background:var(--color-success);color:#fff;border-color:var(--color-success)}.btn-success:hover{background:#2f855a;border-color:#2f855a}.btn-danger{background:var(--color-error);color:#fff;border-color:var(--color-error)}.btn-danger:hover{background:#c53030;border-color:#c53030}input,select,textarea{padding:var(--space-md) var(--space-lg);border:1px solid var(--color-border-medium);border-radius:var(--radius-md);font-size:var(--font-size-base);background:var(--color-bg-primary);color:var(--color-text-primary);transition:border-color .2s ease,box-shadow .2s ease}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light)}input:disabled,select:disabled,textarea:disabled{background:var(--color-bg-tertiary);color:var(--color-text-muted);cursor:not-allowed}.container{max-width:1200px;margin:0 auto;padding:0 var(--space-lg)}.btn-secondary{background:var(--color-bg-secondary);color:var(--color-text-primary);border-color:var(--color-border-medium)}.btn-secondary:hover{background:var(--color-bg-tertiary);border-color:var(--color-border-dark)}.card{border:1px solid var(--color-border-light);border-radius:var(--radius-lg);padding:var(--space-xl);background:var(--color-bg-primary);box-shadow:var(--shadow-sm);transition:box-shadow .2s ease}.card:hover{box-shadow:var(--shadow-md)}button{padding:var(--space-md) var(--space-lg);border:1px solid var(--color-border-medium);border-radius:var(--radius-md);background:var(--color-bg-primary);color:var(--color-text-primary);font-size:var(--font-size-base);font-weight:500;cursor:pointer;transition:all .15s ease;box-shadow:var(--shadow-sm);position:relative;overflow:hidden}button:hover{background:var(--color-bg-secondary);border-color:var(--color-border-dark);box-shadow:var(--shadow-md)}button:active{box-shadow:var(--shadow-sm)}button:disabled{opacity:.6;cursor:not-allowed}button:disabled:hover{background:var(--color-bg-primary);border-color:var(--color-border-medium);box-shadow:var(--shadow-sm)}.grid{display:grid;gap:var(--space-lg)}.grid-2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}.grid-3{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.grid-4{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.text-muted{color:var(--color-text-muted)}.text-secondary{color:var(--color-text-secondary)}.text-success{color:var(--color-success)}.text-warning{color:var(--color-warning)}.text-error{color:var(--color-error)}.bg-secondary{background:var(--color-bg-secondary)}.bg-tertiary{background:var(--color-bg-tertiary)}.shadow-sm{box-shadow:var(--shadow-sm)}.shadow-md{box-shadow:var(--shadow-md)}.shadow-lg{box-shadow:var(--shadow-lg)}.rounded-sm{border-radius:var(--radius-sm)}.rounded-md{border-radius:var(--radius-md)}.rounded-lg{border-radius:var(--radius-lg)}.rounded-xl{border-radius:var(--radius-xl)}.loading{opacity:.6;pointer-events:none}.skeleton{background:linear-gradient(90deg,var(--color-bg-tertiary) 25%,var(--color-bg-secondary) 50%,var(--color-bg-tertiary) 75%);background-size:200% 100%;animation:loading 1.5s infinite}@keyframes loading{0%{background-position:200% 0}to{background-position:-200% 0}}.custom-scrollbar{scrollbar-width:thin;scrollbar-color:var(--color-border-medium) transparent}.custom-scrollbar::-webkit-scrollbar{width:6px}.custom-scrollbar::-webkit-scrollbar-track{background:transparent}.custom-scrollbar::-webkit-scrollbar-thumb{background:var(--color-border-medium);border-radius:3px}.custom-scrollbar::-webkit-scrollbar-thumb:hover{background:var(--color-border-dark)}.product-card{transition:all .3s cubic-bezier(.4,0,.2,1);border:2px solid var(--color-border-light);border-radius:var(--radius-xl);background:var(--color-bg-primary);box-shadow:var(--shadow-card);margin-bottom:var(--space-lg)}.product-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-xl);border-color:var(--color-primary)}.product-image{transition:transform .3s ease}.product-image:hover{transform:scale(1.05)}.product-card-modern{backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.product-card-modern:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,#ffffff1a,#ffffff0d);border-radius:20px;pointer-events:none;z-index:0}.product-card-modern>*{position:relative;z-index:1}.product-card .btn-primary{background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-primary-hover) 100%);border:none;position:relative;overflow:hidden}.product-card .btn-primary:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s}.product-card .btn-primary:hover:before{left:100%}.product-card .btn-primary:hover{background:linear-gradient(135deg,var(--color-primary-hover) 0%,var(--color-primary) 100%);transform:translateY(-1px);box-shadow:0 4px 12px #00000026}.stock-indicator{animation:pulse 2s infinite}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}.text-truncate-2{display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.text-truncate-3{display:-webkit-box;-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}@media (max-width: 768px){.container{padding:0 var(--space-md)}.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}.product-card{margin-bottom:var(--space-lg)}.products-grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr))!important;gap:var(--space-2xl)!important}h1{font-size:var(--font-size-3xl)}h2{font-size:var(--font-size-2xl)}h3{font-size:var(--font-size-xl)}}@media (max-width: 480px){.products-grid{grid-template-columns:1fr!important;gap:var(--space-lg)!important}.product-card{margin-bottom:var(--space-md)}}.catalog-layout{display:flex;gap:var(--space-xl);align-items:flex-start}@media (max-width: 768px){.catalog-layout{flex-direction:column;gap:var(--space-lg)}.filters-sidebar{width:100%!important;position:relative!important;top:auto!important}.filters-sidebar.collapsed{width:100%!important}.category-clear-btn{right:8px!important;top:8px!important;transform:none!important;width:28px!important;height:28px!important}}.btn-touch,button,.btn{min-height:44px;min-width:44px}input[type=text],input[type=email],input[type=password],input[type=number],input[type=tel],select,textarea{font-size:16px;min-height:44px}.container-responsive{width:100%;margin:0 auto;padding:0 16px}@media (min-width: 768px){.container-responsive{max-width:768px;padding:0 24px}}@media (min-width: 1024px){.container-responsive{max-width:1024px;padding:0 32px}}@media (min-width: 1280px){.container-responsive{max-width:1280px}}.grid-responsive-1,.grid-responsive-2{display:grid;grid-template-columns:1fr;gap:var(--space-lg)}@media (min-width: 768px){.grid-responsive-2{grid-template-columns:repeat(2,1fr)}}.grid-responsive-3{display:grid;grid-template-columns:1fr;gap:var(--space-lg)}@media (min-width: 768px){.grid-responsive-3{grid-template-columns:repeat(2,1fr)}}@media (min-width: 1024px){.grid-responsive-3{grid-template-columns:repeat(3,1fr)}}.grid-responsive-4{display:grid;grid-template-columns:1fr;gap:var(--space-lg)}@media (min-width: 768px){.grid-responsive-4{grid-template-columns:repeat(2,1fr)}}@media (min-width: 1024px){.grid-responsive-4{grid-template-columns:repeat(4,1fr)}}.mobile-only{display:block}.tablet-only,.desktop-only{display:none}@media (min-width: 768px){.mobile-only{display:none}.tablet-only{display:block}}@media (min-width: 1024px){.tablet-only{display:none}.desktop-only{display:block}}.text-responsive-sm{font-size:14px}@media (min-width: 768px){.text-responsive-sm{font-size:15px}}@media (min-width: 1024px){.text-responsive-sm{font-size:16px}}.text-responsive-base{font-size:16px}@media (min-width: 768px){.text-responsive-base{font-size:17px}}@media (min-width: 1024px){.text-responsive-base{font-size:18px}}.text-responsive-lg{font-size:18px}@media (min-width: 768px){.text-responsive-lg{font-size:20px}}@media (min-width: 1024px){.text-responsive-lg{font-size:22px}}.text-responsive-xl{font-size:24px}@media (min-width: 768px){.text-responsive-xl{font-size:28px}}@media (min-width: 1024px){.text-responsive-xl{font-size:32px}}.spacing-responsive-sm{padding:var(--space-sm)}@media (min-width: 768px){.spacing-responsive-sm{padding:var(--space-md)}}@media (min-width: 1024px){.spacing-responsive-sm{padding:var(--space-lg)}}.spacing-responsive-md{padding:var(--space-md)}@media (min-width: 768px){.spacing-responsive-md{padding:var(--space-lg)}}@media (min-width: 1024px){.spacing-responsive-md{padding:var(--space-xl)}}.flex-responsive{display:flex;flex-direction:column;gap:var(--space-md)}@media (min-width: 768px){.flex-responsive{flex-direction:row;gap:var(--space-lg)}}.card-responsive{background:var(--color-bg-primary);border:1px solid var(--color-border-light);border-radius:8px;padding:16px;transition:all .3s ease}@media (min-width: 768px){.card-responsive{padding:20px;border-radius:12px}}@media (min-width: 1024px){.card-responsive{padding:24px}}.card-responsive:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.mobile-menu-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;z-index:998;display:none}.mobile-menu-overlay.active{display:block}.mobile-drawer{position:fixed;top:0;left:-100%;width:85%;max-width:320px;height:100vh;background:var(--color-bg-primary);z-index:999;transition:left .3s ease;overflow-y:auto;box-shadow:var(--shadow-lg)}.mobile-drawer.active{left:0}body.mobile-menu-open{overflow:hidden}.img-responsive{max-width:100%;height:auto;display:block}.scrollbar-hidden{-ms-overflow-style:none;scrollbar-width:none}.scrollbar-hidden::-webkit-scrollbar{display:none}.safe-area-top{padding-top:env(safe-area-inset-top)}.safe-area-bottom{padding-bottom:env(safe-area-inset-bottom)}.safe-area-left{padding-left:env(safe-area-inset-left)}.safe-area-right{padding-right:env(safe-area-inset-right)}