/* Rankings own comparison; discovery and detail stay in /models. Shared chrome is models.css. */
.rankings .catalog-head{margin-bottom:28px}
.rank-tabs{display:flex;flex-wrap:wrap;gap:8px}
.rank-tab{min-height:40px;padding:8px 14px;border:1px solid var(--line);border-radius:6px;background:var(--c-surface);color:var(--muted);font-size:13px;transition:background .15s,color .15s,border-color .15s}
.rank-tab:hover{color:var(--ink);border-color:var(--c-border-hover)}
.rank-tab[aria-selected=true]{color:var(--blue);background:var(--c-accent-soft);border-color:var(--c-border-hover)}
html[data-theme=dark] .rank-tab[aria-selected=true]{color:#e5efff}
.rank-meta{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px 16px;margin:18px 0 14px;font-size:12px;line-height:1.7;color:var(--muted)}
.rank-meta strong{color:var(--ink);font-weight:500;white-space:nowrap}
.rank-results{overflow-x:auto;border:1px solid var(--line);border-radius:10px;background:var(--c-surface)}
.rank-table{width:100%;border-collapse:collapse;font-size:13px;text-align:left;font-variant-numeric:tabular-nums}
.rank-table thead{background:var(--c-raised)}
.rank-table th,.rank-table td{padding:14px 20px;border-bottom:1px solid var(--line);font-weight:400}
.rank-table thead th{color:var(--muted);font-size:11px;line-height:1.5}
.rank-table tbody tr:last-child>*{border-bottom:0}
.rank-table tbody tr:hover{background:var(--c-raised)}
.rank-table .rank-position{width:66px;text-align:center;color:var(--muted)}
.rank-table tbody tr:nth-child(-n+3) .rank-position{color:var(--blue);font-weight:600}
.rank-table .rank-metric{text-align:right;white-space:nowrap}
.rank-table .rank-metric.is-active{color:var(--blue);font-weight:500;background:var(--c-accent-soft)}
.rank-identity{display:flex;align-items:center;gap:12px;min-height:40px;min-width:150px}
.rank-name{display:grid;gap:4px;min-width:0}
.rank-model-name{font-weight:500;line-height:1.5;overflow-wrap:anywhere;color:var(--ink)}
.rank-identity:hover .rank-model-name{color:var(--blue)}
.rank-vendor{font-size:11px;line-height:1.4;color:var(--muted)}
.rank-mark{flex:0 0 36px;width:36px;height:36px;display:grid;place-items:center;border-radius:7px;background:var(--c-raised)}
.rank-mark img{width:24px;height:24px;object-fit:contain}
.rank-mark.is-tile{background:#000}
html[data-theme=dark] .rank-mark.is-mono img{filter:invert(1)}
@media(max-width:720px){
 .rank-tabs{gap:6px}
 .rank-tab{font-size:12px;padding:8px 10px}
 .rank-meta{font-size:11px;display:grid;gap:4px}
 .rank-table th,.rank-table td{padding:12px}
 .rank-table .rank-position{width:36px;padding-inline:8px}
 .rank-table [data-metric]:not(.is-active){display:none}
 .rank-identity{min-width:0;gap:8px}
 .rank-mark{flex-basis:30px;width:30px;height:30px}
 .rank-mark img{width:22px;height:22px}
 .rank-model-name{font-size:12px}
}
