/* Zinu reference pass: header, homepage, catalog cards and shared tokens matched to the
   approved desktop/mobile references. Loaded after app.css and zinu_ui_refresh.css. */
:root {
  --zr-ink: #16382b;
  --zr-green: #56b868;
  --zr-green-hover: #48a85a;
  --zr-green-text: #2f8f4e;
  --zr-green-soft: #eaf6ec;
  --zr-text: #1d2723;
  --zr-muted: #69746f;
  --zr-line: #e6e9e7;
  --zr-tile: #f3f4f5;
  --zr-bg: #f6f7f6;
  --zr-radius: 10px;
  --zr-font: "Noto Sans Georgian", "Noto Sans", FiraGO, system-ui, -apple-system, "Segoe UI", sans-serif;
  --z-brand: #2f8f4e;
  --z-brand-strong: #16382b;
  --z-brand-bright: #56b868;
  --z-brand-soft: #eaf6ec;
}

body { font-family: var(--zr-font); }
body, button, input, select, textarea { font-family: var(--zr-font); }

/* Wordmark: inline SVG, sized by the surrounding font-size. */
.zinu-wordmark { display: inline-flex; align-items: center; line-height: 1; letter-spacing: 0; }
/* Doubled class selectors keep generic sidebar "svg"/"path" icon rules from resizing or recolouring the logo. */
.zinu-wordmark .zinu-wordmark__svg { display: block; flex: 0 0 auto; width: auto; height: 1.3em; max-width: none; overflow: visible; fill: none; stroke: none; }
.zinu-wordmark .zinu-wordmark__ink { fill: none; stroke: var(--zinu-ink, var(--zr-ink)); }
.zinu-wordmark .zinu-wordmark__accent { fill: none; stroke: var(--zinu-accent, #4bae78); }
.zinu-wordmark .zinu-wordmark__leaf, .zinu-wordmark .zinu-wordmark__dot { fill: var(--zinu-accent, #4bae78); stroke: none; }
.dash-sidebar, .dash-brand, .control-sidebar, .control-brand-lockup { --zinu-ink: #fff; --zinu-accent: #9fe0b4; }

/* Header. */
.site-header { height: auto; min-height: 0; background: #fff; border-bottom: 1px solid #eceeed; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
.site-header .header-row { display: flex; align-items: center; gap: 28px; height: 68px; min-height: 0; padding: 0; }
.site-header .brand { flex: 0 0 auto; min-width: 0; }
.site-header .brand .zinu-wordmark { font-size: 31px; }
.site-header .main-nav, .site-header .header-actions { display: flex; align-items: center; gap: 22px; margin: 0; }
.site-header .main-nav { margin-left: auto; position: static; padding: 0; border: 0; background: none; box-shadow: none; }
.site-header .main-nav__extra { display: none !important; }
.site-header .main-nav a, .site-header .header-action { position: relative; display: inline-flex; align-items: center; gap: 7px; padding: 0; border: 0; background: none; color: #2b3631; font-size: 13.5px; font-weight: 600; line-height: 1; white-space: nowrap; cursor: pointer; }
.site-header .main-nav a:after { display: none; }
.site-header .main-nav a:hover, .site-header .header-action:hover { color: var(--zr-green-text); background: none; }
.site-header .main-nav svg, .site-header .header-action svg { width: 21px; height: 21px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.site-header .header-actions { flex: 0 0 auto; }
.site-header .header-actions .logout-inline { display: inline-flex; }
.site-header .header-logout span { display: none; }
.site-header .header-logout { color: #7a8580; }
.site-header .cart-count { position: absolute; top: -7px; left: 13px; display: grid; place-items: center; min-width: 17px; height: 17px; padding: 0 4px; border: 2px solid #fff; border-radius: 999px; background: var(--zr-green); color: #fff; font-size: 10px; font-weight: 700; line-height: 1; }
.site-header .mobile-menu-btn { display: none; width: 36px; height: 36px; margin: 0; padding: 0; place-items: center; border: 0; border-radius: 8px; background: none; color: #2b3631; }
.site-header .mobile-menu-btn svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }

/* Home: full-width hero with the floating search / RFQ panel. */
.zs-hero { position: relative; overflow: hidden; background: #10261d; isolation: isolate; }
.zs-hero__bg { position: absolute; z-index: -2; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 45%; }
.zs-hero:before { position: absolute; z-index: -1; inset: 0; content: ""; background: linear-gradient(180deg, rgba(9, 28, 20, .62) 0%, rgba(12, 36, 26, .46) 45%, rgba(9, 28, 20, .70) 100%), radial-gradient(ellipse at 50% 30%, rgba(22, 56, 43, 0) 0%, rgba(9, 24, 18, .35) 75%); }
.zs-hero__inner { display: flex; flex-direction: column; align-items: center; padding-top: 52px; padding-bottom: 46px; text-align: center; }
.zs-hero h1 { margin: 0; color: #fff; font-size: 42px; font-weight: 800; line-height: 1.2; letter-spacing: -.01em; text-shadow: 0 2px 18px rgba(0, 0, 0, .25); }
.zs-hero h1 span { color: #7fd88f; }
.zs-hero__sub { display: flex; flex-wrap: wrap; justify-content: center; gap: 2px 10px; margin: 12px 0 0; color: #e4eee8; font-size: 15.5px; font-weight: 600; line-height: 1.45; }
.zs-hero__sub i { color: #7fd88f; font-style: normal; }
.zs-panel { width: min(100%, 960px); margin-top: 28px; padding: 0 0 16px; overflow: hidden; border-radius: 16px; background: #fff; box-shadow: 0 18px 50px rgba(5, 20, 14, .35); text-align: left; }
.zs-tabs { display: flex; border-bottom: 1px solid #e8ece9; }
.zs-tab { position: relative; display: inline-flex; align-items: center; gap: 8px; padding: 14px 22px; color: #3c4943; font-size: 14px; font-weight: 700; line-height: 1.25; white-space: nowrap; transition: background .15s ease, color .15s ease; }
.zs-tab small { font-size: inherit; font-weight: 600; }
.zs-tab svg { width: 19px; height: 19px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.zs-tab:hover { color: var(--zr-green-text); background: #f6faf7; }
.zs-tab.is-active { color: var(--zr-green-text); background: var(--zr-green-soft); }
.zs-tab.is-active:after { position: absolute; right: 0; bottom: -1px; left: 0; height: 3px; content: ""; background: var(--zr-green); }
.zs-search { display: flex; gap: 10px; padding: 16px 16px 0; }
.zs-search__field { display: flex; flex: 1; align-items: center; gap: 10px; min-width: 0; height: 54px; padding: 0 16px; border: 1px solid #dfe6e1; border-radius: 12px; background: #fbfcfb; color: #7b8580; cursor: text; transition: border-color .15s ease, box-shadow .15s ease; }
.zs-search__field:focus-within { border-color: #8fd09c; background: #fff; box-shadow: 0 0 0 4px rgba(86, 184, 104, .15); }
.zs-search__field svg, .zs-search__btn svg { width: 20px; height: 20px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.zs-search__field input { flex: 1; min-width: 0; height: 100%; padding: 0; border: 0 !important; outline: none; background: transparent; box-shadow: none !important; color: var(--zr-text); font-size: 15px; }
.zs-search__field input::placeholder { color: #8b958f; opacity: 1; }
.zs-search__btn { display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; gap: 8px; height: 54px; padding: 0 26px; border: 0; border-radius: 12px; background: var(--zr-green); color: #fff; font-size: 15px; font-weight: 700; cursor: pointer; transition: background .15s ease; }
.zs-search__btn:hover { background: var(--zr-green-hover); }
.zs-chips { display: flex; align-items: flex-start; gap: 10px; padding: 14px 16px 0; }
.zs-chips__label { flex: 0 0 auto; padding-top: 6px; color: #33403a; font-size: 12.5px; font-weight: 700; }
.zs-chips__list { display: flex; flex-wrap: wrap; gap: 6px; min-width: 0; }
.zs-chips__list::-webkit-scrollbar { display: none; }
.zs-chip { flex: 0 0 auto; padding: 5px 11px; border: 1px solid #e3e9e5; border-radius: 999px; background: #f5f7f6; color: #3c4943; font-size: 12px; font-weight: 600; line-height: 1.3; white-space: nowrap; transition: border-color .15s ease, background .15s ease, color .15s ease; }
.zs-chip:hover { border-color: #bfe2c6; background: var(--zr-green-soft); color: var(--zr-green-text); }

/* Home: registration CTAs directly below the hero. */
.zh-cta { margin-top: 12px; }
.zh-cta__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.zh-cta__btn { display: flex; align-items: center; justify-content: center; gap: 14px; min-height: 62px; padding: 10px 18px; border-radius: var(--zr-radius); background: var(--zr-green); color: #fff; font-size: 17px; font-weight: 700; line-height: 1.25; transition: background .15s ease; }
.zh-cta__btn:hover { background: var(--zr-green-hover); color: #fff; }
.zh-cta__btn svg { width: 28px; height: 28px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

/* Home: launch countdown bar directly under the hero. */
.zl-launch { margin-top: 12px; }
.zl-launch__card { display: flex; align-items: center; gap: 14px; min-height: 72px; padding: 12px 14px 12px 16px; border: 1px solid #d6ecda; border-radius: var(--zr-radius); background: linear-gradient(90deg, #f1f9f3 0%, #fff 62%); }
.zl-launch__icon { display: grid; flex: 0 0 auto; place-items: center; width: 42px; height: 42px; border-radius: 10px; background: var(--zr-green-soft); color: var(--zr-green-text); }
.zl-launch__icon svg { width: 23px; height: 23px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.zl-launch__copy { min-width: 0; }
.zl-launch__copy h2 { margin: 0; color: var(--zr-text); font-size: 17px; font-weight: 800; line-height: 1.3; }
.zl-launch__copy p { margin: 2px 0 0; color: var(--zr-muted); font-size: 12.5px; font-weight: 600; line-height: 1.4; }
.zl-launch__timer { display: grid; grid-template-columns: repeat(4, minmax(64px, auto)); gap: 8px; margin-left: auto; }
.zl-launch__timer[hidden], .zl-launch__done[hidden] { display: none; }
.zl-launch__unit { display: grid; place-items: center; padding: 6px 10px 5px; border: 1px solid #dcefe0; border-radius: 9px; background: #fff; }
.zl-launch__unit b { color: var(--zr-ink); font-size: 22px; font-weight: 800; line-height: 1.1; font-variant-numeric: tabular-nums; }
.zl-launch__unit small { color: var(--zr-green-text); font-size: 11px; font-weight: 700; line-height: 1.3; }
.zl-launch__done { margin: 0; color: var(--zr-green-text); font-size: 17px; font-weight: 800; line-height: 1.3; }
.zl-launch__card.is-done .zl-launch__copy { display: none; }

/* Home: sections. */
.zh-section { margin-top: 26px; }
.zh-section__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.zh-section__head h2 { margin: 0; color: var(--zr-text); font-size: 21px; font-weight: 800; line-height: 1.3; }
.zh-section__head > a { color: var(--zr-green-text); font-size: 13.5px; font-weight: 700; white-space: nowrap; }
.zh-section__head > a:hover { color: var(--zr-ink); }

/* Home: compact category tiles with real product photos. */
.zh-cats { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 80px) / 9); gap: 10px; overflow-x: auto; padding-bottom: 2px; scroll-snap-type: x proximity; scrollbar-width: none; }
.zh-cats::-webkit-scrollbar { display: none; }
.zh-cat { display: flex; flex-direction: column; min-width: 0; overflow: hidden; border: 1px solid var(--zr-line); border-radius: var(--zr-radius); background: #fff; color: var(--zr-text); scroll-snap-align: start; transition: border-color .15s ease, box-shadow .15s ease; }
.zh-cat:hover { border-color: #cfe3d4; box-shadow: 0 4px 14px rgba(22, 56, 43, .07); color: var(--zr-text); }
/* Supplied square studio photos: shown whole (1:1, contain) on their own studio grey. */
.zh-cat__img { display: block; aspect-ratio: 1 / 1; overflow: hidden; background: #eceff3; }
.zh-cat__img img { display: block; width: 100%; height: 100%; object-fit: contain; }
.zh-cat__name { display: -webkit-box; min-height: calc(2 * 1.25em + 14px); padding: 7px 2px; overflow: hidden; font-size: 11.5px; font-weight: 600; line-height: 1.25; text-align: center; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }

/* Product cards (home, supplier and catalog grids). */
.zh-products { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.z-product-card { display: flex; flex-direction: column; min-width: 0; overflow: hidden; border: 1px solid var(--zr-line); border-radius: var(--zr-radius); background: #fff; box-shadow: none; }
.z-product-card:hover { transform: none; border-color: #cfe3d4; box-shadow: 0 6px 18px rgba(22, 56, 43, .08); }
.z-product-card__media { --z-card-media-pad: 14px; position: relative; display: grid; place-items: center; aspect-ratio: 5 / 3; border: 0; border-radius: 0; background: var(--zr-tile); }
.z-product-card__media img { width: 100%; height: 100%; object-fit: contain; }
.z-product-card__badge { position: absolute; top: 8px; left: 8px; right: auto; max-width: calc(100% - 16px); padding: 3px 8px; border-radius: 6px; background: #dcf1e1; color: #23703f; font-size: 11px; font-weight: 700; line-height: 1.3; box-shadow: none; }
.z-product-card__body, .z-product-card--offer .z-product-card__body { display: flex; flex: 1; flex-direction: column; gap: 4px; min-height: 0; padding: 10px 12px 12px; }
.z-product-card__category { color: var(--zr-muted); font-size: 11px; font-weight: 600; }
/* Title: bold, up to two full lines (fixed two-line box keeps cards in a row aligned). */
.z-product-card__title { display: -webkit-box; min-height: calc(2em * 1.35); overflow: hidden; color: var(--zr-text); font-size: 14px; font-weight: 700; line-height: 1.35; white-space: normal; overflow-wrap: anywhere; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; }
.z-product-card__title:hover { color: var(--zr-green-text); }
.z-product-card__buy { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.z-product-card__code { overflow: hidden; color: var(--zr-muted); font-size: 11.5px; font-weight: 500; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }
.z-product-card__price { color: var(--zr-text); font-size: 18px; font-weight: 800; line-height: 1.25; }
.z-product-card__from { color: var(--zr-muted); font-size: .72em; font-weight: 700; }
.z-product-card__price--empty { color: var(--zr-muted); font-size: 14px; font-weight: 700; }
.z-product-card__form { margin: 0; }
.z-product-card__cart { display: grid; place-items: center; width: 34px; height: 34px; padding: 0; border: 0; border-radius: 8px; background: var(--zr-green-soft); color: var(--zr-green-text); cursor: pointer; transition: background .15s ease, color .15s ease; }
.z-product-card__cart:hover { background: var(--zr-green); color: #fff; }
.z-product-card__cart svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.z-product-card__meta { display: flex; flex-wrap: wrap; gap: 2px 10px; color: var(--zr-muted); font-size: 12px; font-weight: 500; line-height: 1.35; }
.z-product-card__supplier { overflow: hidden; color: #8a948f; font-size: 11.5px; text-overflow: ellipsis; white-space: nowrap; }
.z-product-card .z-product-rating { font-size: 11px; }
.z-product-card__cta { min-height: 34px; margin-top: auto; padding: 6px 8px; border-radius: 8px; font-size: 12px; white-space: nowrap; }

/* Home: remaining marketplace content. */
.zh-more { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.zh-more__card { display: flex; flex-direction: column; gap: 6px; min-width: 0; padding: 16px; border: 1px solid var(--zr-line); border-radius: var(--zr-radius); background: #fff; }
.zh-more__card h3 { margin: 0; color: var(--zr-text); font-size: 15px; font-weight: 700; line-height: 1.35; }
.zh-more__card p { margin: 0; color: var(--zr-muted); font-size: 12.5px; line-height: 1.5; }
.zh-more__icon { display: grid; place-items: center; width: 34px; height: 34px; margin-bottom: 2px; border-radius: 8px; background: var(--zr-green-soft); color: var(--zr-green-text); }
.zh-more__icon svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.zh-more__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.zh-more__head a { color: var(--zr-green-text); font-size: 12px; font-weight: 700; }
.zh-more__btn { display: inline-flex; align-items: center; justify-content: center; align-self: flex-start; height: 38px; margin-top: auto; padding: 0 16px; border-radius: 8px; background: var(--zr-green); color: #fff; font-size: 13px; font-weight: 700; }
.zh-more__btn:hover { background: var(--zr-green-hover); color: #fff; }
.zh-rfq { background: #f4faf5; border-color: #dcefe0; }
.zh-rfq__sample { margin: 4px 0 8px; padding: 8px 10px; border: 1px solid #dcefe0; border-radius: 8px; background: #fff; color: #44514b; font-size: 12px; }
.zh-compare__product { color: #33403a; font-size: 12.5px; }
.zh-compare__rows { display: grid; gap: 5px; margin-top: 2px; }
.zh-compare__rows a { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 10px; align-items: center; padding: 7px 9px; border-radius: 7px; background: var(--zr-bg); color: #33403a; font-size: 12px; }
.zh-compare__rows a span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.zh-compare__rows b { color: var(--zr-text); }
.zh-compare__rows small { color: var(--zr-muted); font-size: 11px; }
.zh-verified__metrics { display: flex; gap: 18px; margin-top: auto; padding-top: 6px; }
.zh-verified__metrics span { display: grid; }
.zh-verified__metrics b { color: var(--zr-text); font-size: 15px; }
.zh-verified__metrics small { color: var(--zr-muted); font-size: 11px; }
.zh-stats { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 34px; margin-top: 14px; padding: 12px 18px; border-radius: var(--zr-radius); background: var(--zr-bg); }
.zh-stats div { display: flex; align-items: baseline; gap: 7px; }
.zh-stats b { color: var(--zr-green-text); font-size: 18px; font-weight: 800; }
.zh-stats span { color: var(--zr-muted); font-size: 12.5px; }
.zh-stats > a { margin-left: auto; color: var(--zr-green-text); font-size: 13px; font-weight: 700; }

/* Category thumbnails reused by catalog filters. */
.category-thumbnail { overflow: hidden; background: var(--zr-tile); }
.category-thumbnail img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* Footer: gray band plus dark-green bottom bar. */
.site-footer { margin-top: 34px; padding: 0; border-top: 0; background: #eef0ef; color: #3a4640; }
.site-footer .footer-grid { padding-top: 26px; padding-bottom: 22px; gap: 24px; }
.site-footer .footer-brand .zinu-wordmark { font-size: 22px; }
.site-footer .footer-grid p { max-width: 300px; color: var(--zr-muted); font-size: 12.5px; line-height: 1.55; }
.site-footer .footer-grid > div > strong { margin-bottom: 4px; color: var(--zr-text); font-size: 13.5px; font-weight: 700; }
.site-footer .footer-grid > div:not(:first-child) { gap: 6px; color: #4d5953; font-size: 12.5px; }
.site-footer .footer-grid a:hover { color: var(--zr-green-text); }
.footer-bar { background: var(--zr-ink); }
.site-footer .footer-bottom { margin: 0 auto; padding-top: 11px; padding-bottom: 11px; border: 0; color: #cfe0d6; font-size: 12px; }
.site-footer .footer-credit a { color: #9fe0b4; }

/* Mobile bottom navigation: flat, five equal items. */
.mobile-bottom-nav { border-top: 1px solid #e8ebe9; background: #fff; box-shadow: 0 -2px 12px rgba(22, 56, 43, .05); backdrop-filter: none; -webkit-backdrop-filter: none; }
.mobile-bottom-nav a { gap: 3px; border-radius: 0; background: none !important; color: #6f7a75; font-size: 10.5px; font-weight: 600; line-height: 1.2; }
.mobile-bottom-nav a.active { color: var(--zr-green-text); }
.mobile-bottom-nav .nav-icon, .mobile-bottom-nav .mobile-rfq .nav-icon { display: grid; place-items: center; width: auto; height: 23px; margin: 0; border-radius: 0; background: none; color: inherit; box-shadow: none; }
.mobile-bottom-nav .nav-icon svg, .mobile-bottom-nav .mobile-rfq .nav-icon svg { width: 22px; height: 22px; stroke-width: 1.8; }
.mobile-bottom-nav .mobile-rfq { color: #6f7a75; }
.mobile-bottom-nav .mobile-rfq.active { color: var(--zr-green-text); }

@media (max-width: 1180px) {
  .site-header .header-row { gap: 20px; }
  .site-header .main-nav, .site-header .header-actions { gap: 16px; }
  .zh-cats { grid-auto-columns: 118px; }
}

/* Tablet: nav moves into the menu, header keeps icons. */
@media (max-width: 1023px) {
  .site-header .main-nav { position: fixed; z-index: 95; top: 68px; right: 12px; left: auto; display: none; flex-direction: column; align-items: stretch; gap: 2px; width: min(280px, calc(100% - 24px)); padding: 8px; border: 1px solid var(--zr-line); border-radius: 12px; background: #fff; box-shadow: 0 14px 34px rgba(22, 56, 43, .14); }
  .site-header .main-nav.open { display: flex; }
  .site-header .main-nav .main-nav__extra { display: flex !important; }
  .site-header .main-nav a { padding: 11px 10px; border-radius: 8px; font-size: 14px; }
  .site-header .main-nav a:hover { background: var(--zr-bg); }
  .site-header .mobile-menu-btn { display: grid; }
  .site-header .header-action > span { display: none; }
  .site-header .header-actions { gap: 6px; margin-left: auto; }
  .site-header .header-action { justify-content: center; width: 36px; height: 36px; }
  .site-header .cart-count { left: 19px; top: 1px; }
  .zh-products { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .zh-more { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Phones. */
@media (max-width: 760px) {
  .site-header .header-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "brand actions"; gap: 8px; height: 58px; padding: 0; }
  .site-header .brand { grid-area: brand; }
  .site-header .brand .zinu-wordmark { font-size: 26px; }
  .site-header .header-actions { grid-area: actions; gap: 2px; margin: 0; }
  .site-header .main-nav { top: 58px; }
  .site-header .header-actions .logout-inline { display: none; }
  .zs-hero__inner { padding-top: 26px; padding-bottom: 22px; }
  .zs-hero h1 { font-size: 24px; line-height: 1.25; }
  .zs-hero__sub { gap: 0 6px; margin-top: 8px; font-size: 12px; }
  .zs-panel { margin-top: 18px; padding-bottom: 12px; border-radius: 14px; }
  .zs-tab { flex: 1 1 50%; justify-content: center; gap: 6px; padding: 11px 8px; font-size: 12.5px; white-space: normal; text-align: center; }
  .zs-tab svg { width: 17px; height: 17px; }
  .zs-search { gap: 8px; padding: 12px 12px 0; }
  .zs-search__field { gap: 8px; height: 48px; padding: 0 12px; border-radius: 10px; }
  .zs-search__field svg { display: none; }
  .zs-search__field input { font-size: 14px; }
  .zs-search__btn { width: 48px; height: 48px; padding: 0; border-radius: 10px; }
  .zs-search__btn span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
  .zs-chips { flex-direction: column; align-items: stretch; gap: 7px; padding: 11px 12px 0; }
  .zs-chips__label { padding-top: 0; font-size: 11.5px; }
  .zs-chips__list { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  .zs-chips__list::-webkit-scrollbar { display: none; }
  .zs-chip { padding: 5px 10px; font-size: 12px; }
  .zl-launch { margin-top: 10px; }
  .zl-launch__card { flex-wrap: wrap; gap: 10px 12px; padding: 12px; }
  .zl-launch__icon { width: 36px; height: 36px; border-radius: 9px; }
  .zl-launch__icon svg { width: 20px; height: 20px; }
  .zl-launch__copy { flex: 1 1 0; }
  .zl-launch__copy h2 { font-size: 15px; }
  .zl-launch__copy p { font-size: 12px; }
  .zl-launch__timer { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; width: 100%; margin-left: 0; }
  .zl-launch__unit { padding: 6px 4px 5px; }
  .zl-launch__unit b { font-size: 20px; }
  .zl-launch__done { flex: 1 1 0; font-size: 15px; }
  .zh-cta { margin-top: 10px; }
  .zh-cta__grid { gap: 8px; }
  .zh-cta__btn { justify-content: flex-start; gap: 10px; min-height: 58px; padding: 8px 12px; font-size: 13.5px; }
  .zh-cta__btn svg { width: 26px; height: 26px; }
  .zh-cta__label > span { display: block; }
  .zh-section { margin-top: 20px; }
  .zh-section__head { margin-bottom: 9px; }
  .zh-section__head h2 { min-width: 0; font-size: 16px; overflow-wrap: break-word; }
  .zh-section__head > a { font-size: 12.5px; }
  .zh-section__more-word { display: none; }
  .zh-cats { grid-auto-columns: 76px; gap: 8px; }
  .zh-cat { border-radius: 9px; }
  .zh-cat__name { min-height: calc(2 * 1.2em + 10px); padding: 5px 2px; font-size: 10.5px; line-height: 1.2; overflow-wrap: normal; }
  .zh-products { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .z-product-card__media { --z-card-media-pad: 10px; aspect-ratio: 4 / 3; }
  .z-product-card__badge { top: 6px; left: 6px; padding: 2px 6px; font-size: 10px; }
  .z-product-card__body, .z-product-card--offer .z-product-card__body { gap: 3px; padding: 8px 9px 10px; }
  .z-product-card__title { font-size: 13.5px; }
  .z-product-card__code { font-size: 11px; }
  .z-product-card__price { font-size: 17px; }
  .z-product-card__price--empty { font-size: 13px; }
  .z-product-card__cart { width: 30px; height: 30px; border-radius: 7px; }
  .z-product-card__cart svg { width: 17px; height: 17px; }
  .z-product-card__meta { font-size: 11px; }
  .z-product-card__meta span + span { display: none; }
  .z-product-card__supplier { font-size: 10.5px; }
  .z-product-card__cta { min-height: 32px; font-size: 11.5px; }
  .zh-more { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .zh-more__card { padding: 14px; }
  .zh-stats { gap: 8px 18px; padding: 12px 14px; }
  .zh-stats b { font-size: 16px; }
  .zh-stats span { font-size: 11.5px; }
  .zh-stats > a { flex-basis: 100%; margin-left: 0; }
  .site-footer { margin-top: 24px; }
  .site-footer .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 18px; padding-top: 20px; padding-bottom: 18px; }
  .site-footer .footer-grid > div:first-child { grid-column: 1 / -1; }
  .site-footer { padding-bottom: calc(62px + env(safe-area-inset-bottom)); }
  .site-footer .footer-bottom { flex-direction: column; align-items: flex-start; gap: 4px; }
}

@media (max-width: 360px) {
  .site-header .brand .zinu-wordmark { font-size: 23px; }
  .zs-hero h1 { font-size: 21px; }
  .zs-hero__sub { font-size: 11px; }
  .zs-tab { font-size: 11.5px; }
  .zs-tab small { display: none; }
  .zh-section__head { gap: 8px; }
  .zh-section__head h2 { font-size: 14.5px; }
  .mobile-bottom-nav a { font-size: 9.5px; }
  .zh-cat__name { font-size: 9.5px; }
  .zh-cta__btn { gap: 8px; padding: 8px 10px; font-size: 12.5px; }
  .zh-cta__btn svg { width: 22px; height: 22px; }
  .zh-cats { grid-auto-columns: 74px; gap: 7px; }
  .zh-products { gap: 8px; }
  .z-product-card__body, .z-product-card--offer .z-product-card__body { padding: 8px 8px 9px; }
  .z-product-card__title { font-size: 12.5px; }
  .z-product-card__price { font-size: 16px; }
  .z-product-card__price--empty { font-size: 12px; }
  .z-product-card__cta { font-size: 11px; }
}

/* Small desktop: the offer card keeps its three columns here (zinu_ui_refresh), so the
   order form stays stacked inside the narrow last column instead of overflowing it. */
@media (min-width: 821px) and (max-width: 1100px) {
  .z-offer-form { grid-template-columns: minmax(0, 1fr); align-items: stretch; }
}

/* Shared buttons and workspaces (buyer, supplier, partner, control): same greens, radii
   and type as the marketplace. Layout and navigation structure are unchanged. */
.btn:not(.btn-soft):not(.btn-light):not(.btn-link):not(.btn-danger) { border-color: var(--zr-green); background: var(--zr-green); color: #fff; }
.btn:not(.btn-soft):not(.btn-light):not(.btn-link):not(.btn-danger):hover { border-color: var(--zr-green-hover); background: var(--zr-green-hover); color: #fff; }
.btn { border-radius: 8px; font-weight: 700; box-shadow: none; }
.btn:hover { transform: none; box-shadow: none; }
.btn-soft { border-color: #d6ecda; background: var(--zr-green-soft); color: var(--zr-green-text); }
.btn-soft:hover { border-color: #c4e3ca; background: #dff1e3; color: var(--zr-ink); }
.dashboard-page, .dashboard-body { background: var(--zr-bg); }
.dash-sidebar { background: var(--zr-ink); }
body.dashboard-page .dash-sidebar .dash-nav a, body.dashboard-page .dash-sidebar .dash-logout button { border-radius: 8px; font-size: 13.5px; font-weight: 600; }
.dash-nav-label { font-size: 10px; font-weight: 600; letter-spacing: .02em; }
.dash-brand .zinu-wordmark { font-size: 22px; }
.dash-hero, .dash-kpi, .dash-panel, .dash-card, .form-card, .control-card, .control-kpi, .control-filterbar, .partner-link-card { border-color: var(--zr-line); border-radius: var(--zr-radius); box-shadow: none; }
.dash-hero h1 { color: var(--zr-text); font-weight: 800; }
.dash-panel h2, .dash-card h2 { color: var(--zr-text); font-weight: 700; }
.dash-eyebrow, .eyebrow { color: var(--zr-green-text); font-weight: 700; letter-spacing: .02em; text-transform: none; }
.dash-kpi strong { color: var(--zr-text); font-weight: 800; }
.status-pill, .stock-pill, .status { font-weight: 700; }

@media (max-width: 760px) {
  /* Mobile tables switch to label/value cards; a forced min-width pushed values off-screen. */
  body.dashboard-page .responsive-table table { min-width: 0; }
  .dashboard-page .dashboard-mobile-nav { height: calc(62px + env(safe-area-inset-bottom)); padding: 0 2px env(safe-area-inset-bottom); border-top: 1px solid #e8ebe9; background: #fff; box-shadow: 0 -2px 12px rgba(22, 56, 43, .05); backdrop-filter: none; }
  .dashboard-page .dashboard-mobile-nav a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; min-height: 0; padding: 0 1px; border-radius: 0; background: none; color: #6f7a75; font-size: 10.5px; font-weight: 600; line-height: 1.2; white-space: nowrap; }
  .dashboard-page .dashboard-mobile-nav a.active { background: none; color: var(--zr-green-text); }
  .dashboard-page .dashboard-mobile-nav a.active:before { display: none; }
  .dashboard-page .dashboard-mobile-nav .dmn-icon { display: grid; place-items: center; height: 23px; color: inherit; font-size: 0; }
  .dashboard-page .dashboard-mobile-nav .dmn-icon svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
  .dashboard-page .supplier-mobile-nav .supplier-orders-badge { top: 6px; right: calc(50% - 22px); border: 2px solid #fff; background: var(--zr-green); color: #fff; }
  .dashboard-mobile-header { border-bottom: 1px solid #eceeed; background: #fff; box-shadow: none; }
  .dashboard-mobile-brand .zinu-wordmark { font-size: 22px; }
}

@media (max-width: 360px) {
  .dashboard-page .dashboard-mobile-nav a { font-size: 9.5px; }
}

@media (min-width: 821px) {
  .control-sidebar.control-sidebar-v2 .control-brand-block { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
  .control-sidebar.control-sidebar-v2 .control-brand-lockup .zinu-wordmark { font-size: 22px; }
}
