.catalog-ref{position:relative;display:inline-flex;align-items:center}
.catalog-ref__trigger{appearance:none;border:0;border-radius:10px;background:#2563eb;color:#fff;font:inherit;font-weight:700;padding:10px 16px;cursor:pointer;display:inline-flex;gap:8px;align-items:center;white-space:nowrap}
.catalog-ref__trigger:hover,.catalog-ref__trigger:focus-visible{background:#1d4ed8}
.catalog-ref__chevron{font-size:12px;transition:transform .18s ease}.catalog-ref.is-open .catalog-ref__chevron{transform:rotate(180deg)}
.catalog-ref__overlay{display:none;position:fixed;inset:0;background:rgba(15,23,42,.32);z-index:1080}.catalog-ref.is-open .catalog-ref__overlay{display:block}
.catalog-ref__panel{display:none;position:fixed;z-index:1090;top:72px;left:50%;transform:translateX(-50%);width:min(1240px,calc(100vw - 32px));max-height:calc(100vh - 96px);overflow:auto;background:#fff;border:1px solid #e2e8f0;border-radius:18px;box-shadow:0 24px 70px rgba(15,23,42,.22);padding:24px}
.catalog-ref.is-open .catalog-ref__panel{display:block}
.catalog-ref__head{display:flex;justify-content:space-between;gap:20px;align-items:center;padding-bottom:18px;border-bottom:1px solid #e2e8f0;margin-bottom:18px}
.catalog-ref__title{font-size:24px;font-weight:800;color:#0f172a}.catalog-ref__all{display:inline-block;color:#2563eb;font-weight:700;text-decoration:none;margin-bottom:14px}.catalog-ref__close{display:none}
.catalog-ref__roots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;list-style:none;margin:0;padding:0}
.catalog-ref__tree-item{list-style:none;min-width:0}.catalog-ref__tree-row{display:flex;align-items:center;gap:6px}
.catalog-ref__roots>.catalog-ref__tree-item{border:1px solid #e2e8f0;border-radius:14px;padding:14px;background:#f8fafc}
.catalog-ref__roots>.catalog-ref__tree-item>.catalog-ref__tree-row>.catalog-ref__tree-link{font-size:16px;font-weight:800;color:#0f172a}
.catalog-ref__tree-link{display:block;flex:1;min-width:0;color:#334155;text-decoration:none;padding:5px 0;line-height:1.25;overflow-wrap:break-word}.catalog-ref__tree-link:hover{color:#2563eb}
.catalog-ref__tree-toggle{appearance:none;border:0;background:transparent;color:#64748b;font-size:20px;line-height:1;cursor:pointer;padding:5px 8px;border-radius:8px}.catalog-ref__tree-toggle:hover{background:#e2e8f0}
.catalog-ref__tree-children{list-style:none;margin:8px 0 0;padding:0 0 0 12px;border-left:2px solid #e2e8f0}.catalog-ref__tree-children .catalog-ref__tree-children{margin-top:2px}
body.catalog-ref-lock{overflow:hidden}
@media (max-width:900px){
 .catalog-ref__trigger{padding:9px 12px}
 .catalog-ref__panel{inset:0 0 0 auto;top:0;left:auto;transform:none;width:min(94vw,440px);max-height:none;height:100dvh;border-radius:0;padding:0;display:block;visibility:hidden;opacity:0;pointer-events:none;transition:opacity .18s ease,visibility .18s ease}
 .catalog-ref.is-open .catalog-ref__panel{visibility:visible;opacity:1;pointer-events:auto}
 .catalog-ref__head{position:sticky;top:0;background:#fff;z-index:2;padding:18px 16px;margin:0}.catalog-ref__title{font-size:20px}
 .catalog-ref__close{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border:0;border-radius:10px;background:#f1f5f9;font-size:24px;cursor:pointer}
 .catalog-ref__all{display:block;margin:14px 16px 6px;padding:12px 14px;border-radius:10px;background:#eff6ff}
 .catalog-ref__roots{display:block;padding:8px 16px 24px}
 .catalog-ref__roots>.catalog-ref__tree-item{padding:0;border:0;border-bottom:1px solid #e2e8f0;border-radius:0;background:#fff}
 .catalog-ref__roots>.catalog-ref__tree-item>.catalog-ref__tree-row>.catalog-ref__tree-link{padding:14px 0;font-size:16px}
 .catalog-ref__tree-children{display:none;margin:0 0 8px;padding-left:14px}
 .catalog-ref__tree-item.is-expanded>.catalog-ref__tree-children{display:block}
 .catalog-ref__tree-item.is-expanded>.catalog-ref__tree-row>.catalog-ref__tree-toggle{transform:rotate(90deg)}
}

/* STEP164: deterministic desktop closed/open state.
   Existing header/nav cascade can otherwise force the nested catalog <nav> visible
   even when .catalog-ref has no .is-open class. */
@media (min-width: 901px) {
  .catalog-ref:not(.is-open) > .catalog-ref__panel {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }

  .catalog-ref.is-open > .catalog-ref__panel {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }
}