/* rankings.css — A realm's rankings: the categories as tabs, a class filter
   and one table. */

.ranking-panel { border-top: none; }
.ranking-filter { display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap; margin-bottom: 1.25rem; color: var(--text-muted); font-size: 0.9rem; }

.table-wrap { overflow-x: auto; border: 1px solid var(--line); }
.ranking-name { display: inline-flex; align-items: center; gap: 0.6rem; }
.ranking-portrait { width: 32px; height: 32px; flex: none; border-width: 1px; }
.ranking-portrait img { object-position: 50% 70%; }
.ranking-table td strong { color: var(--text-bright); }
.ranking-table .level { color: var(--gold); font-weight: 700; }
.ranking-table .rank { min-width: 1.8rem; height: 1.8rem; font-size: 0.88rem; }
.ranking-note { margin-top: 1rem; color: var(--text-dim); font-size: 0.84rem; }