:root{--primary-color:#262626;--base-color:#F4F4F4;--accent-color:#8A3FFC;--text-primary:#262626;--text-secondary:#666666;--text-light:#FFFFFF;--text-muted:#888888;--border-color:#E0E0E0;--background-light:#FAFAFA;--shadow:0 4px 12px rgba(0,0,0,0.1);--shadow-hover:0 8px 24px rgba(138,63,252,0.15);--hover-color:0 4px 16px rgba(138,63,252,0.12);--metal-dark:#2a2a2a;--metal-medium:#3a3a3a;--metal-light:#4a4a4a;--success-color:#10B981;--error-color:#EF4444;--warning-color:#F59E0B;--info-color:#3B82F6;--discount-color:#EF4444;--out-of-stock-color:#FF6B6B;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-full:9999px;--space-xs:4px;--space-sm:8px;--space-md:12px;--space-lg:20px;--space-xl:24px;--header-height:2/10;--banner-height:2/10;--catalog-height:5/10;--nav-height:1/10;--border-radius:12px;--border-radius-sm:8px}*{margin:0;padding:0;max-width:100%;box-sizing:border-box}body{font-family:Inter,SF Pro Display,-apple-system,BlinkMacSystemFont,sans-serif;background-color:var(--base-color);color:var(--text-primary);line-height:1.6;min-height:100vh;width:100%;position:relative}body.catalog-panel-open{overflow:hidden}body.catalog-panel-open .main-content{pointer-events:none;-webkit-user-select:none;user-select:none}.main-container{min-height:100vh;display:flex;flex-direction:column}.section-block{width:100%;padding:20px;display:flex;align-items:center;justify-content:center}.search-block{height:20vh;min-height:120px;background:var(--base-color)}.search-container{width:100%;max-width:600px;position:relative}.search-input{width:100%;padding:18px 24px 18px 56px;background:var(--text-light);border:2px solid var(--border-color);border-radius:var(--border-radius);font-size:16px;font-weight:400;color:var(--text-primary);transition:all .3s ease;box-shadow:var(--shadow)}.search-input:focus{outline:none;border-color:var(--accent-color);box-shadow:var(--shadow-hover)}.search-input::placeholder{color:var(--text-secondary);font-weight:300}.search-icon{position:absolute;left:24px;top:50%;transform:translateY(-50%);width:20px;height:20px;color:var(--text-secondary);pointer-events:none}.banner-block{height:20vh;min-height:120px;background:linear-gradient(135deg,var(--primary-color) 0,var(--accent-color) 100%);color:var(--text-light);position:relative;overflow:hidden}.banner-content{width:100%;max-width:800px;text-align:center;z-index:2;position:relative}.banner-title{font-size:24px;font-weight:700;margin-bottom:12px;text-shadow:0 2px 4px rgba(0,0,0,.3)}.banner-subtitle{font-size:16px;font-weight:300;margin-bottom:20px;opacity:.9}.details-button{background:rgba(255,255,255,.2);color:var(--text-light);border:2px solid rgba(255,255,255,.3);padding:12px 32px;border-radius:var(--border-radius);font-size:14px;font-weight:600;cursor:pointer;transition:all .3s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.details-button:hover{background:rgba(255,255,255,.3);border-color:rgba(255,255,255,.5);transform:translateY(-2px)}.catalog-block{height:50vh;min-height:300px;background:var(--base-color)}.catalog-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;width:100%;max-width:500px;margin:0 auto}.category-button{aspect-ratio:1;background:var(--text-light);border:none;border-radius:var(--border-radius);display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease;box-shadow:var(--shadow);padding:20px;text-decoration:none;color:inherit}.category-button:hover{transform:translateY(-4px);box-shadow:var(--shadow-hover);border:2px solid var(--accent-color)}.category-icon{width:48px;height:48px;margin-bottom:12px;color:var(--accent-color)}.category-name{font-size:14px;font-weight:600;color:var(--text-primary);text-align:center}.navigation-block{height:10vh;min-height:60px;background:var(--primary-color);border-top:1px solid var(--border-color)}.nav-container{display:grid;grid-template-columns:repeat(4,1fr);width:100%;max-width:500px;margin:0 auto}.nav-button{display:flex;flex-direction:column;align-items:center;justify-content:center;background:none;border:none;cursor:pointer;padding:8px 4px;color:var(--text-light);text-decoration:none;transition:all .3s ease}.nav-button:hover{transform:translateY(-2px)}.nav-button.active,.nav-button:hover{color:var(--accent-color)}.nav-icon{width:20px;height:20px;margin-bottom:4px}.nav-label{font-size:10px;font-weight:500;opacity:.9}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.fade-in{animation:fadeIn .6s ease-out}@media (max-width:768px){.section-block{padding:15px}.search-input{padding:16px 20px 16px 48px;font-size:14px}.banner-title{font-size:20px}.banner-subtitle{font-size:14px}.catalog-grid{gap:15px;max-width:400px}.category-icon{width:40px;height:40px}.category-name{font-size:12px}}@media (max-width:480px){.section-block{padding:10px}.catalog-grid{grid-template-columns:1fr;max-width:280px}.category-button{aspect-ratio:3/1;flex-direction:row;justify-content:flex-start;gap:15px}.category-icon{margin-bottom:0;width:32px;height:32px}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.text-center{text-align:center}.flex-center{display:flex;align-items:center;justify-content:center}.loading{opacity:.7}.disabled,.loading{pointer-events:none}.disabled{opacity:.5;cursor:not-allowed}.navbar-container{position:sticky;top:0;left:0;right:0;z-index:1000;background:#262626!important;border-bottom:1px solid #333333}.main-content{min-height:100vh;display:flex;flex-direction:column;padding-bottom:0}@media (max-width:768px){.navbar-container{position:fixed!important;top:auto!important;bottom:0!important;left:0!important;right:0!important;background:#262626!important;border-top:1px solid #333333!important;border-bottom:none!important;box-shadow:0 -2px 10px rgba(0,0,0,.1)!important}.main-content{padding-top:0!important;padding-bottom:0!important}}@media (min-width:769px){.navbar-container{position:sticky!important;top:0!important;bottom:auto!important;background:#262626!important;border-bottom:1px solid #333333!important;border-top:none!important}.main-content{padding-bottom:0!important}}body{margin:0;padding:0;overflow-x:hidden}.main-content{overflow-y:auto;-webkit-overflow-scrolling:touch}body.auth-modal-open{background-color:#0a0a0a!important;overflow:hidden!important}