:root{--bg-primary: #0f1117;--bg-secondary: #181b24;--bg-card: #1e2130;--bg-card-hover: #252839;--bg-glass: rgba(30, 33, 48, .7);--surface-border: rgba(255, 255, 255, .06);--surface-border-hover: rgba(255, 255, 255, .12);--text-primary: #f0f0f5;--text-secondary: #9a9bb0;--text-muted: #62647a;--accent: #f5a623;--accent-glow: rgba(245, 166, 35, .15);--accent-hover: #ffba4a;--price-color: #4ade80;--price-request: #f59e0b;--danger: #ef4444;--badge-vegetable: #22c55e;--badge-beef: #ef4444;--badge-chicken: #f97316;--badge-seafood: #3b82f6;--badge-pork: #ec4899;--badge-sauce: #a855f7;--badge-supplies: #64748b;--badge-beverage: #06b6d4;--badge-other: #8b5cf6;--space-xs: 4px;--space-sm: 8px;--space-md: 16px;--space-lg: 24px;--space-xl: 32px;--space-2xl: 48px;--space-3xl: 64px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 24px;--radius-pill: 9999px;--shadow-sm: 0 1px 3px rgba(0,0,0,.3);--shadow-md: 0 4px 12px rgba(0,0,0,.4);--shadow-lg: 0 8px 32px rgba(0,0,0,.5);--shadow-glow: 0 0 40px var(--accent-glow);--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-base: .25s cubic-bezier(.4, 0, .2, 1);--transition-slow: .4s cubic-bezier(.4, 0, .2, 1);--font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-family);background:var(--bg-primary);color:var(--text-primary);line-height:1.6;min-height:100vh}button,input,select{font-family:inherit;border:none;outline:none}.hero{position:relative;background:linear-gradient(165deg,#1a1d2e,#0f1117 40%,#1a120a);overflow:hidden;padding:var(--space-3xl) var(--space-lg) var(--space-2xl)}.hero:before{content:"";position:absolute;top:-50%;left:-20%;width:80%;height:200%;background:radial-gradient(circle,var(--accent-glow) 0%,transparent 60%);pointer-events:none;opacity:.5}.hero:after{content:"";position:absolute;bottom:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--accent),transparent);opacity:.3}.hero__inner{position:relative;max-width:720px;margin:0 auto;text-align:center;z-index:1}.hero__brand{margin-bottom:var(--space-xl)}.hero__title{font-size:clamp(2rem,5vw,3.2rem);font-weight:700;letter-spacing:-.03em;background:linear-gradient(135deg,var(--text-primary) 0%,var(--accent) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1.15}.hero__subtitle{font-size:clamp(.95rem,2vw,1.15rem);color:var(--text-secondary);font-weight:400;letter-spacing:.12em;text-transform:uppercase;margin-top:var(--space-xs)}.search-container{margin-bottom:var(--space-lg)}.search-box{position:relative;max-width:600px;margin:0 auto}.search-box__icon{position:absolute;left:20px;top:50%;transform:translateY(-50%);width:22px;height:22px;color:var(--text-muted);transition:color var(--transition-base);pointer-events:none}.search-box__input{width:100%;padding:18px 52px 18px 56px;font-size:1rem;background:var(--bg-secondary);color:var(--text-primary);border:1px solid var(--surface-border);border-radius:var(--radius-xl);transition:all var(--transition-base);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.search-box__input::placeholder{color:var(--text-muted)}.search-box__input:focus{border-color:var(--accent);box-shadow:var(--shadow-glow);background:var(--bg-card)}.search-box__input:focus~.search-box__icon,.search-box__input:focus+.search-box__icon{color:var(--accent)}.search-box__clear{position:absolute;right:16px;top:50%;transform:translateY(-50%);width:28px;height:28px;padding:4px;background:var(--bg-card);border-radius:50%;color:var(--text-secondary);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--transition-fast)}.search-box__clear:hover{background:var(--danger);color:#fff}.search-box__clear svg{width:16px;height:16px}.hero__stats{display:flex;align-items:center;justify-content:center;gap:var(--space-sm);font-size:.875rem;color:var(--text-muted)}.hero__stat strong{color:var(--accent);font-weight:600}.hero__stat-divider{opacity:.3}.category-bar{position:sticky;top:0;z-index:100;background:#0f1117d9;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--surface-border);padding:var(--space-md) 0}.category-bar__inner{display:flex;gap:var(--space-sm);overflow-x:auto;padding:0 var(--space-lg);scrollbar-width:none;-ms-overflow-style:none;scroll-snap-type:x mandatory}.category-bar__inner::-webkit-scrollbar{display:none}.category-chip{flex-shrink:0;padding:8px 18px;font-size:.82rem;font-weight:500;color:var(--text-secondary);background:var(--bg-secondary);border:1px solid var(--surface-border);border-radius:var(--radius-pill);cursor:pointer;transition:all var(--transition-fast);white-space:nowrap;scroll-snap-align:start}.category-chip:hover{color:var(--text-primary);border-color:var(--surface-border-hover);background:var(--bg-card);transform:translateY(-1px)}.category-chip--active{background:var(--accent);color:#000;border-color:var(--accent);font-weight:600}.category-chip--active:hover{background:var(--accent-hover);color:#000;border-color:var(--accent-hover)}.category-chip__count{display:inline-block;margin-left:6px;padding:1px 7px;font-size:.72rem;font-weight:600;background:#00000026;border-radius:var(--radius-pill)}.category-chip--active .category-chip__count{background:#0003}.toolbar{padding:var(--space-md) var(--space-lg)}.toolbar__inner{max-width:1400px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:var(--space-md)}.toolbar__results{font-size:.875rem;color:var(--text-secondary)}.toolbar__results strong{color:var(--text-primary);font-weight:600}.toolbar__sort{padding:8px 36px 8px 16px;font-size:.82rem;background:var(--bg-secondary);color:var(--text-secondary);border:1px solid var(--surface-border);border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast);-moz-appearance:none;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%239a9bb0' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center}.toolbar__sort:hover,.toolbar__sort:focus{border-color:var(--accent);color:var(--text-primary)}.catalogue{padding:0 var(--space-lg) var(--space-2xl)}.product-grid{max-width:1400px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--space-md)}.product-card{background:var(--bg-card);border:1px solid var(--surface-border);border-radius:var(--radius-md);padding:var(--space-lg);transition:all var(--transition-base);display:flex;flex-direction:column;gap:var(--space-sm);position:relative;overflow:hidden}.product-card:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--card-accent, var(--accent));opacity:0;transition:opacity var(--transition-base)}.product-card:hover{transform:translateY(-4px);border-color:var(--surface-border-hover);box-shadow:var(--shadow-lg)}.product-card:hover:before{opacity:1}.product-card__header{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-sm)}.product-card__badge{display:inline-flex;align-items:center;padding:3px 10px;font-size:.68rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;border-radius:var(--radius-pill);background:var(--badge-bg, rgba(245, 166, 35, .15));color:var(--badge-color, var(--accent));flex-shrink:0}.product-card__name-en{font-size:1rem;font-weight:600;color:var(--text-primary);line-height:1.35}.product-card__name-jp{font-size:.82rem;color:var(--text-muted);line-height:1.4}.product-card__details{display:flex;align-items:center;gap:var(--space-sm);margin-top:auto;padding-top:var(--space-sm);border-top:1px solid var(--surface-border)}.product-card__volume{font-size:.78rem;color:var(--text-secondary);background:var(--bg-secondary);padding:3px 10px;border-radius:var(--radius-sm)}.product-card__unit{font-size:.75rem;color:var(--text-muted)}.product-card__price{margin-left:auto;font-size:1.15rem;font-weight:700;color:var(--price-color)}.product-card__price--request{font-size:.78rem;font-weight:600;color:var(--price-request);background:#f59e0b1a;padding:4px 12px;border-radius:var(--radius-pill)}.product-card[data-category=vegetable],.product-card[data-category=processed-vegetable]{--card-accent: var(--badge-vegetable);--badge-bg: rgba(34,197,94,.12);--badge-color: #4ade80}.product-card[data-category=beef]{--card-accent: var(--badge-beef);--badge-bg: rgba(239,68,68,.12);--badge-color: #f87171}.product-card[data-category=chicken]{--card-accent: var(--badge-chicken);--badge-bg: rgba(249,115,22,.12);--badge-color: #fb923c}.product-card[data-category=seafood]{--card-accent: var(--badge-seafood);--badge-bg: rgba(59,130,246,.12);--badge-color: #60a5fa}.product-card[data-category=pork]{--card-accent: var(--badge-pork);--badge-bg: rgba(236,72,153,.12);--badge-color: #f472b6}.product-card[data-category=sauce]{--card-accent: var(--badge-sauce);--badge-bg: rgba(168,85,247,.12);--badge-color: #c084fc}.product-card[data-category=supplies],.product-card[data-category=supply]{--card-accent: var(--badge-supplies);--badge-bg: rgba(100,116,139,.12);--badge-color: #94a3b8}.product-card[data-category=beverage]{--card-accent: var(--badge-beverage);--badge-bg: rgba(6,182,212,.12);--badge-color: #22d3ee}.product-card[data-category=other],.product-card[data-category=original]{--card-accent: var(--badge-other);--badge-bg: rgba(139,92,246,.12);--badge-color: #a78bfa}.product-card[data-category=rice]{--card-accent: #eab308;--badge-bg: rgba(234,179,8,.12);--badge-color: #facc15}.product-card[data-category=fruit]{--card-accent: #f43f5e;--badge-bg: rgba(244,63,94,.12);--badge-color: #fb7185}.product-card[data-category=dairy],.product-card[data-category=milk],.product-card[data-category=butter],.product-card[data-category=cheese],.product-card[data-category=egg]{--card-accent: #fbbf24;--badge-bg: rgba(251,191,36,.12);--badge-color: #fcd34d}.product-card[data-category=liquor]{--card-accent: #e879f9;--badge-bg: rgba(232,121,249,.12);--badge-color: #e879f9}.product-card[data-category=oil]{--card-accent: #84cc16;--badge-bg: rgba(132,204,22,.12);--badge-color: #a3e635}.product-card[data-category=salt],.product-card[data-category=spice],.product-card[data-category=sugar]{--card-accent: #f472b6;--badge-bg: rgba(244,114,182,.12);--badge-color: #f9a8d4}.product-card[data-category=hygiene]{--card-accent: #2dd4bf;--badge-bg: rgba(45,212,191,.12);--badge-color: #5eead4}.product-card[data-category=lamb],.product-card[data-category=duck],.product-card[data-category=ham],.product-card[data-category=meat]{--card-accent: #fb923c;--badge-bg: rgba(251,146,60,.12);--badge-color: #fdba74}.product-card[data-category=tofu],.product-card[data-category=natto],.product-card[data-category=vegan]{--card-accent: #34d399;--badge-bg: rgba(52,211,153,.12);--badge-color: #6ee7b7}.skeleton-grid{max-width:1400px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--space-md)}.skeleton-card{background:var(--bg-card);border:1px solid var(--surface-border);border-radius:var(--radius-md);padding:var(--space-lg);display:flex;flex-direction:column;gap:var(--space-md)}.skeleton-line{height:14px;border-radius:var(--radius-sm);background:linear-gradient(90deg,var(--bg-secondary) 25%,var(--bg-card-hover) 50%,var(--bg-secondary) 75%);background-size:200% 100%;animation:shimmer 1.5s ease-in-out infinite}.skeleton-line--badge{width:70px;height:20px;border-radius:var(--radius-pill)}.skeleton-line--title{width:85%;height:18px}.skeleton-line--subtitle{width:60%}.skeleton-line--footer{width:100%;height:36px;margin-top:auto}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.empty-state{max-width:400px;margin:var(--space-3xl) auto;text-align:center;padding:var(--space-2xl)}.empty-state__icon{margin-bottom:var(--space-lg);color:var(--text-muted)}.empty-state__icon svg{width:80px;height:80px}.empty-state__title{font-size:1.3rem;font-weight:600;color:var(--text-secondary);margin-bottom:var(--space-sm)}.empty-state__text{font-size:.9rem;color:var(--text-muted)}.pagination{padding:var(--space-lg) var(--space-lg) var(--space-3xl)}.pagination__inner{max-width:1400px;margin:0 auto;display:flex;align-items:center;justify-content:center;gap:var(--space-sm)}.pagination__btn{display:inline-flex;align-items:center;gap:var(--space-xs);padding:10px 20px;font-size:.85rem;font-weight:500;color:var(--text-secondary);background:var(--bg-secondary);border:1px solid var(--surface-border);border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast)}.pagination__btn:hover:not(:disabled){color:var(--text-primary);border-color:var(--accent);background:var(--bg-card)}.pagination__btn:disabled{opacity:.3;cursor:not-allowed}.pagination__btn svg{width:16px;height:16px}.pagination__pages{display:flex;gap:4px}.pagination__page{width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;font-size:.82rem;font-weight:500;color:var(--text-secondary);background:transparent;border:1px solid transparent;border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast)}.pagination__page:hover{background:var(--bg-card);border-color:var(--surface-border)}.pagination__page--active{background:var(--accent);color:#000;font-weight:700;border-color:var(--accent)}.pagination__page--active:hover{background:var(--accent-hover)}.pagination__ellipsis{width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;font-size:.82rem;color:var(--text-muted)}.footer{padding:var(--space-xl) var(--space-lg);text-align:center;font-size:.8rem;color:var(--text-muted);border-top:1px solid var(--surface-border)}.back-to-top{position:fixed;bottom:28px;right:28px;width:48px;height:48px;background:var(--accent);color:#000;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:var(--shadow-md);opacity:0;visibility:hidden;transform:translateY(12px);transition:all var(--transition-base);z-index:50}.back-to-top.visible{opacity:1;visibility:visible;transform:translateY(0)}.back-to-top:hover{background:var(--accent-hover);transform:translateY(-2px);box-shadow:var(--shadow-lg)}.back-to-top svg{width:22px;height:22px}@keyframes fadeInUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.product-card{animation:fadeInUp var(--transition-slow) both}.product-card:nth-child(1){animation-delay:0ms}.product-card:nth-child(2){animation-delay:30ms}.product-card:nth-child(3){animation-delay:60ms}.product-card:nth-child(4){animation-delay:90ms}.product-card:nth-child(5){animation-delay:.12s}.product-card:nth-child(6){animation-delay:.15s}.product-card:nth-child(7){animation-delay:.18s}.product-card:nth-child(8){animation-delay:.21s}.product-card:nth-child(9){animation-delay:.24s}.product-card:nth-child(10){animation-delay:.27s}.product-card:nth-child(11){animation-delay:.3s}.product-card:nth-child(12){animation-delay:.33s}.product-card:nth-child(n+13){animation-delay:.36s}@media(max-width:768px){.hero{padding:var(--space-2xl) var(--space-md) var(--space-xl)}.search-box__input{padding:15px 46px 15px 48px;font-size:.9rem}.search-box__icon{left:16px;width:20px;height:20px}.category-bar__inner{padding:0 var(--space-md)}.toolbar__inner{flex-direction:column;align-items:flex-start;gap:var(--space-sm)}.catalogue{padding:0 var(--space-md) var(--space-xl)}.product-grid,.skeleton-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:var(--space-sm)}.product-card{padding:var(--space-md)}.pagination__inner{flex-wrap:wrap;gap:var(--space-xs)}}@media(max-width:480px){.product-grid,.skeleton-grid{grid-template-columns:1fr}.hero__title{font-size:1.8rem}.pagination__pages{overflow-x:auto;max-width:200px}}@media(min-width:1600px){.product-grid,.skeleton-grid{grid-template-columns:repeat(5,1fr)}}