/* Read-only catalogue and analytics surfaces, using the Phoenix palette. */
body #page-models .catalog-toolbar { display:grid; grid-template-columns:minmax(220px,420px) max-content; justify-content:start; gap:12px; align-items:center; }
.catalog-search-label { grid-column:1/-1; color:var(--ink-2); font-size:13px; font-weight:600; }
body #page-models .model-search { width:100%; min-width:0; }
body #page-models .model-cats { grid-column:1/-1; display:flex; flex-wrap:wrap; gap:8px; }
body #page-models .cat-btn { min-height:44px; padding:8px 15px; font-size:13px; }
body #page-models .cat-btn span { margin-left:5px; font-variant-numeric:tabular-nums; }
.catalog-list-head { display:flex; justify-content:space-between; gap:16px; padding:8px 2px 14px; color:var(--ink-2); font-size:13px; line-height:1.6; }
#catalogResultCount { flex-shrink:0; font-variant-numeric:tabular-nums; }
body #page-models .catalog-list { display:flex; flex-direction:column; gap:0; border:1px solid var(--line-strong); border-radius:var(--radius-md); background:var(--surface-solid); overflow:hidden; }
body #page-models .model-catalog-row { min-height:0; min-width:0; padding:0; border:0; border-bottom:1px solid var(--line); border-radius:0; background:transparent; }
body #page-models .model-catalog-row:last-child { border-bottom:0; }
.catalog-row-summary { display:grid; grid-template-columns:minmax(0,1fr) minmax(270px,350px) 20px; gap:24px; align-items:center; padding:24px; list-style:none; cursor:pointer; transition:background .18s var(--ease); }
.catalog-row-summary::-webkit-details-marker { display:none; }
.catalog-row-summary:hover { background:var(--surface-soft); }
.catalog-row-summary:focus-visible { outline:2px solid var(--coral-deep); outline-offset:-3px; border-radius:4px; }
.catalog-model-identity { min-width:0; display:flex; align-items:center; gap:16px; }
.catalog-model-copy { min-width:0; display:grid; gap:9px; }
.catalog-brand { position:relative; flex:0 0 48px; width:48px; height:48px; display:grid; place-items:center; border-radius:12px; background:var(--surface-solid); color:var(--ink-2); font-size:13px; font-weight:600; }
.catalog-brand img { position:absolute; width:32px; height:32px; object-fit:contain; background:var(--surface-solid); }
body #page-models .model-card-name { color:var(--ink); font-size:17px; font-weight:650; line-height:1.45; overflow-wrap:anywhere; }
.catalog-model-meta { display:flex; flex-wrap:wrap; align-items:center; gap:6px 14px; font-size:12px; color:var(--ink-2); }
body #page-models .model-card-ctx { padding:0; background:none; color:var(--ink-2); }
.catalog-price-overview { display:grid; gap:7px; color:var(--ink); font-variant-numeric:tabular-nums; }
.catalog-price-overview > small { font-size:12px; color:var(--ink-2); }
.catalog-price-overview > strong { font-size:16px; font-weight:650; }
.catalog-price-overview > small:last-child { color:var(--coral-deep); }
.catalog-rate-triplet { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.catalog-rate-triplet > span { display:grid; gap:5px; min-width:0; }
.catalog-rate-triplet small { color:var(--ink-2); font-size:12px; }
.catalog-rate-triplet strong { font-size:16px; font-weight:650; overflow-wrap:anywhere; }
.catalog-period { color:var(--warning); font-size:12px; }
.catalog-expand { color:var(--coral-deep); transition:transform .18s var(--ease); }
.model-catalog-row[open] .catalog-expand { transform:rotate(90deg); }
.model-catalog-row[open] .catalog-row-summary { background:var(--surface-wash); }
.catalog-row-detail { padding:0 24px 24px; border-top:1px solid var(--line); }
body #page-models .model-card-desc { max-width:75ch; font-size:14px; line-height:1.8; margin:18px 0 8px; color:var(--ink-2); }
.catalog-model-id { display:block; margin-bottom:12px; font-size:12px; color:var(--ink-2); overflow-wrap:anywhere; }
body #page-models .model-card-tags { margin-bottom:16px; }
.catalog-price-scroll { max-width:100%; overflow-x:auto; overscroll-behavior-inline:contain; }
.catalog-price-scroll:focus-visible { outline:2px solid var(--coral-deep); outline-offset:-2px; }
.catalog-price-table { width:100%; border-collapse:collapse; font-size:14px; font-variant-numeric:tabular-nums; }
.catalog-price-table caption { text-align:left; padding:12px 0; color:var(--ink-2); font-size:12px; }
.catalog-price-table th, .catalog-price-table td { padding:13px 16px; text-align:right; border-bottom:1px solid var(--line); line-height:1.6; }
.catalog-price-table th { font-weight:500; }
.catalog-price-table thead { background:var(--surface-soft); color:var(--ink-2); font-size:12px; }
.catalog-price-table :is(th,td):first-child { text-align:left; padding-left:12px; }
.catalog-price-table td:nth-child(4) { color:var(--coral-deep); font-weight:650; }
.catalog-price-table tbody tr:last-child :is(th,td) { border-bottom:0; }
body #page-models .model-catalog-note { flex-wrap:wrap; gap:10px 24px; margin-bottom:16px; background:var(--surface-wash); }
body #page-usage .page-outline { margin-bottom:16px; padding:8px 0; border:0; background:transparent; }
body #page-usage .usage-filter-bar { grid-template-columns:repeat(4,minmax(0,1fr)) auto; align-items:end; gap:12px; }
body #page-usage .usage-source-strip { box-shadow:none; background:var(--surface-wash); font-size:13px; }
body #page-usage .usage-source-strip[data-source=local] { background:var(--surface-soft); }
#usageSourceStrip .usage-live-dot { background:var(--warning); box-shadow:none; }
#usageSourceStrip[data-source=server] .usage-live-dot { background:var(--success); }
.usage-scope-label { margin:22px 0 12px; font-size:13px; font-weight:600; color:var(--ink-2); }
body #page-usage .usage-kpi-grid .ops-metric { padding:20px 18px; }
body #page-usage .usage-kpi-grid .value { font-size:clamp(23px,2.1vw,30px); font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.usage-section-head { display:flex; align-items:baseline; justify-content:space-between; gap:16px 32px; margin:28px 0 16px; }
.usage-section-head h3 { margin:0; flex-shrink:0; font-size:18px; font-weight:650; color:var(--ink); }
.usage-section-head p { margin:0; max-width:75ch; font-size:13px; color:var(--ink-2); line-height:1.7; }
body #page-usage .usage-legend { display:flex; }
body #page-usage .legend-token { background:var(--warning); border-radius:0; width:17px; height:2px; }
body #page-usage .usage-chart-line { stroke:var(--warning); filter:none; stroke-dasharray:5 3; }
body #page-usage .usage-trend-chart { height:auto; min-height:0; }
body #page-usage .usage-trend-chart svg { display:block; width:100%; height:auto; }
body #page-usage .usage-trend-chart text { font-size:12px; }
.usage-chart-data { margin-top:12px; border-top:1px solid var(--line); }
.usage-chart-data > summary { padding:14px 0; cursor:pointer; color:var(--coral-deep); font-size:13px; }
.usage-filters { margin:20px 0; border:1px solid var(--line); border-radius:var(--radius-md); background:var(--surface-solid); }
.usage-filters > summary { padding:16px; cursor:pointer; font-size:14px; font-weight:600; color:var(--ink); }
.usage-filters > summary span:last-child { margin-left:16px; font-size:12px; font-weight:400; color:var(--ink-2); }
body #page-usage .usage-filters .usage-filter-bar { margin:0; border:0; padding-top:0; }
body #page-usage .usage-filters > summary:focus-visible { outline:2px solid var(--coral-deep); outline-offset:-3px; border-radius:var(--radius-md); }
body #page-usage .usage-kpi-grid .hint { text-wrap:pretty; }
body #page-usage .usage-share-title { flex-wrap:wrap; gap:6px; }
body #page-usage .usage-share-title strong, body #page-usage .usage-channel-row > div strong { max-width:100%; white-space:normal; overflow-wrap:anywhere; }
.usage-diagnostics { margin:4px 0 24px; border-block:1px solid var(--line-strong); }
.usage-diagnostics > summary { min-height:64px; padding:18px 4px; cursor:pointer; color:var(--ink); font-size:15px; font-weight:600; }
.usage-diagnostics > summary small { margin-left:16px; color:var(--ink-2); font-size:13px; font-weight:400; }
.usage-diagnostics > summary:focus-visible { outline:2px solid var(--coral-deep); outline-offset:-2px; }
.usage-diagnostics[open] > summary { margin-bottom:12px; }
body #page-usage .usage-latency-grid .value { font-variant-numeric:tabular-nums; }
body #page-usage [hidden] { display:none!important; }
@media (max-width:1100px) {
  body #page-usage .usage-filter-bar { grid-template-columns:repeat(2,minmax(0,1fr)); }
  #usageResetFilters { justify-self:start; }
  .catalog-row-summary { grid-template-columns:minmax(0,1fr) minmax(220px,290px) 20px; gap:16px; }
  .usage-section-head { flex-wrap:wrap; gap:8px; }
}
@media (max-width:640px) {
  body #page-models .catalog-toolbar { grid-template-columns:minmax(0,1fr) auto; }
  .catalog-list-head { flex-wrap:wrap; gap:6px; }
  .catalog-row-summary { grid-template-columns:minmax(0,1fr) 20px; gap:16px 12px; padding:20px 16px; }
  .catalog-model-identity { grid-column:1; }
  .catalog-price-overview { grid-column:1; grid-row:2; }
  .catalog-expand { grid-column:2; grid-row:1/3; }
  .catalog-row-detail { padding:0 16px 20px; }
  .catalog-price-table { font-size:13px; }
  .catalog-price-table :is(th,td) { padding:12px 7px; min-width:60px; }
  .catalog-price-table :is(th,td):first-child { min-width:120px; }
  body #page-models .model-catalog-note { padding:14px 16px; }
  body #page-usage .usage-filter-bar { grid-template-columns:minmax(0,1fr); }
  body #page-usage .usage-kpi-grid .ops-metric { padding:18px 14px; }
  body #page-usage .usage-kpi-grid .hint { overflow-wrap:anywhere; }
  body #page-usage .data-card-toolbar { flex-wrap:wrap; padding:18px; }
  .usage-diagnostics > summary small { display:block; margin:7px 0 0 20px; }
  body #page-usage .usage-latency-grid { grid-template-columns:minmax(0,1fr); }
}
@media (prefers-reduced-motion:reduce) {
  .catalog-row-summary, .catalog-expand { transition:none; }
}