.catalog-category-navigation { display: grid; gap: 14px; margin-bottom: 20px; min-width: 0; }
.category-breadcrumbs ol { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 0; list-style: none; margin: 0; padding: 0; font-size: 13px; line-height: 1.5; color: var(--muted); }
.category-breadcrumbs li { min-width: 0; max-width: 100%; overflow-wrap: anywhere; }
.category-breadcrumbs li + li::before { content: "›"; display: inline-block; padding: 0 9px; color: var(--muted); }
.category-breadcrumbs a:hover { color: var(--accent); }
.category-breadcrumbs [aria-current] { color: var(--text); font-weight: 700; }
.category-parent-link { display: inline-flex; align-items: center; gap: 9px; justify-self: start; max-width: 100%; min-height: 44px; padding: 10px 14px; border: 1px solid var(--line); border-radius: 12px; background: var(--card); color: var(--text); font-size: 14px; font-weight: 800; line-height: 1.4; transition: border-color .15s, background .15s; }
.category-parent-link svg { width: 21px; height: 21px; flex: 0 0 21px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.category-parent-link span { min-width: 0; overflow-wrap: anywhere; }
.category-parent-link:hover { border-color: var(--accent); background: var(--soft); }
.category-parent-link:focus-visible, .category-breadcrumbs a:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.filter-tree .tree-link[aria-current="page"] { background: var(--soft); color: var(--accent); font-weight: 850; border-radius: 9px; }
.filter-tree .filter-node-row { min-width: 0; }
.filter-tree .tree-link { min-width: 0; overflow-wrap: anywhere; }
@media (max-width: 760px) { .catalog-category-navigation { gap: 12px; margin-bottom: 16px; } .category-parent-link { font-size: 13px; } .category-breadcrumbs ol { font-size: 12px; } }

.catalog-category-button { display: none; }
.catalog-filter-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.catalog-filter-dismiss { display: none; }

/* Visually group category levels while keeping the existing lazy tree. */
.filter-tree { --category-root-bg: #edf7f6; --category-root-border: #bddbd6; --category-group-bg: #f0f3f6; --category-branch-line: #d3dedf; --category-selected-bg: #d4f2ec; --category-selected-text: #075c53; gap: 10px; }
[data-theme="dark"] .filter-tree { --category-root-bg: #172f33; --category-root-border: #36585a; --category-group-bg: #202b39; --category-branch-line: #3b4c57; --category-selected-bg: #174b45; --category-selected-text: #b5f8e9; }
.filter-tree > .filter-node { border: 1px solid var(--category-root-border); border-radius: 14px; background: var(--card); overflow: hidden; }
.filter-tree > .filter-node:focus-within, .filter-tree > .filter-node.is-current-branch { border-color: var(--accent); }
.filter-tree .filter-node-row { grid-template-columns: 32px minmax(0, 1fr); gap: 2px; min-height: 44px; padding: 2px 4px 2px 0; border-radius: 9px; }
.filter-tree > .filter-node > .filter-node-row { padding: 5px 6px; border-radius: 0; background: var(--category-root-bg); }
.filter-tree .tree-link { padding: 10px 6px; border: 1px solid transparent; border-radius: 9px; font-size: 14px; line-height: 1.4; }
.filter-tree > .filter-node > .filter-node-row > .tree-link { font-size: 15px; font-weight: 850; }
.filter-tree .filter-node-toggle, .filter-tree .filter-node-spacer { width: 32px; height: 40px; border-radius: 8px; }
.filter-tree .filter-node-toggle[aria-expanded="true"] { background: var(--category-selected-bg); color: var(--category-selected-text); }
.filter-tree .filter-children { margin: 4px 6px 8px 12px; padding: 4px 0 0 7px; border-left: 2px solid var(--category-branch-line); }
.filter-tree > .filter-node > .filter-children > .filter-node > .filter-node-row { background: var(--category-group-bg); font-weight: 750; }
.filter-tree .filter-children > .filter-node + .filter-node { margin-top: 4px; padding-top: 4px; border-top: 1px solid var(--line); }
.filter-tree .tree-link[aria-current="page"] { border-color: var(--category-root-border); border-left: 3px solid var(--accent); background: var(--category-selected-bg); color: var(--category-selected-text); font-weight: 850; }
.filter-tree .tree-link:focus-visible, .filter-tree .filter-node-toggle:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }

@media (max-width: 760px) {
  .catalog-layout .filters { right: 0; width: 100%; max-width: none; height: 100vh; height: 100dvh; max-height: 100vh; max-height: 100dvh; padding: 0 16px calc(16px + env(safe-area-inset-bottom)); border: 0; border-radius: 0; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
  .filters .catalog-filter-head { position: sticky; top: 0; z-index: 4; margin-bottom: 8px; padding: max(12px, env(safe-area-inset-top)) 0 12px; border-bottom: 1px solid var(--line); background: var(--card); }
  .catalog-filter-head h3 { margin: 0; font-size: 21px; }
  .catalog-filter-dismiss { display: grid; place-items: center; flex: 0 0 44px; width: 44px; height: 44px; padding: 0; border: 1px solid var(--line); border-radius: 12px; background: var(--bg); color: var(--text); cursor: pointer; }
  .catalog-filter-dismiss svg { width: 23px; height: 23px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
  .catalog-filter-dismiss:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
  .filters .filter-close { display: none; }
  .filter-tree { gap: 8px; }
  .filter-tree > .filter-node > .filter-node-row { padding: 2px 6px; }
  .filter-tree .tree-link { padding-top: 8px; padding-bottom: 8px; }
  .filter-tree .filter-children { margin-top: 2px; margin-bottom: 4px; margin-left: 10px; padding-left: 6px; }
  .filter-tree .filter-children > .filter-node + .filter-node { margin-top: 2px; padding-top: 2px; }
  .mobile-category-sheet { bottom: 0; height: 100vh; height: 100dvh; max-height: none; padding: 0 16px calc(16px + env(safe-area-inset-bottom)); border-radius: 0; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
  .mobile-category-head { position: sticky; top: 0; z-index: 4; padding: max(12px, env(safe-area-inset-top)) 0 12px; background: var(--card); }
  .mobile-category-head button { flex: 0 0 44px; width: 44px; height: 44px; }
  .catalog-main .catalog-category-button { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 46px; margin: 0 0 14px; padding: 11px 14px; border: 1px solid var(--accent); border-radius: 14px; background: var(--card); color: var(--text); font: inherit; font-size: 15px; font-weight: 800; text-align: left; cursor: pointer; }
  .catalog-toolbar .catalog-category-button { grid-column: 1 / -1; margin: 0; }
  .catalog-category-button svg { width: 20px; height: 20px; flex: 0 0 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
  .catalog-category-button .category-button-arrow { margin-left: auto; }
  .catalog-category-button:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
}