.catalog-notice { display:flex; gap:12px; margin-bottom:15px; padding:14px 17px; border:1px solid #bce1e5; border-radius:13px; color:#345d6c; background:#eaf7f8; font-size:.78rem; }
.catalog-notice strong { flex:none; color:#08798a; }
.catalog-metrics { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:15px; }
.catalog-metrics > div { padding:15px 17px; border:1px solid var(--line); border-radius:13px; background:#fff; }
.catalog-metrics strong, .catalog-metrics span { display:block; }
.catalog-metrics strong { font-size:1.5rem; }
.catalog-metrics span { margin-top:2px; color:var(--muted); font-size:.7rem; }
.catalog-toolbar { grid-template-columns:1fr 210px 100px; }
.catalog-result { align-self:center; color:var(--muted); font-size:.75rem; text-align:right; }
.catalog-layout { display:grid; grid-template-columns:minmax(350px,.8fr) minmax(420px,1.2fr); gap:17px; align-items:start; }
.catalog-list { max-height:680px; overflow:auto; border:1px solid var(--line); border-radius:14px; background:#fff; }
.catalog-row { display:grid; width:100%; grid-template-columns:68px 1fr 18px; gap:10px; align-items:center; padding:13px; border:0; border-bottom:1px solid #e9eef1; color:var(--ink); background:#fff; text-align:left; cursor:pointer; }
.catalog-row:hover, .catalog-row.selected { background:#edf8f9; }
.catalog-row.selected { box-shadow:inset 3px 0 var(--teal); }
.catalog-row strong, .catalog-row small { display:block; }
.catalog-row strong { font-size:.78rem; }
.catalog-row small { margin-top:4px; color:var(--muted); font-size:.67rem; }
.catalog-row i { color:var(--teal); font-size:1.25rem; font-style:normal; }
.catalog-ref { color:var(--teal); font-size:.75rem; font-weight:850; }
.catalog-detail { position:sticky; top:90px; }
.catalog-detail h3 { margin:23px 0 8px; font-size:.82rem; }
.catalog-detail p, .catalog-detail li { font-size:.78rem; line-height:1.55; }
.catalog-detail ol, .catalog-detail ul { padding-left:21px; color:#536c7b; }
.catalog-detail li { margin:7px 0; }
.catalog-action-note { margin-top:22px; padding:11px; border-radius:9px; color:#6c7f89; background:#f1f5f6; font-size:.69rem; }
.catalog-empty { padding:60px 30px; text-align:center; }
.catalog-empty .empty-icon { display:block; color:var(--teal); font-size:2rem; }
.catalog-empty p { margin-top:9px; }
@media(max-width:1000px) { .catalog-layout { grid-template-columns:1fr; } .catalog-detail { position:static; } .catalog-metrics { grid-template-columns:repeat(2,1fr); } }
@media(max-width:720px) { .catalog-metrics, .catalog-toolbar { grid-template-columns:1fr; } .catalog-result { text-align:left; } }