.rankings-panel{border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);overflow:hidden}
.rankings-tabs{display:flex;gap:8px;flex-wrap:wrap;padding-bottom:20px;margin-bottom:24px;border-bottom:1px solid var(--line)}
.rankings-tabs [role=tab]{min-height:44px;padding:10px 20px;border:1px solid var(--line);border-radius:7px;background:var(--surface);color:var(--muted);font-weight:600;font-size:13px}
.rankings-tabs [role=tab]:hover{color:var(--text);border-color:var(--cyan)}
.rankings-tabs [role=tab][aria-selected=true]{background:var(--cyan);color:var(--light-button-ink,#071419);border-color:var(--cyan)}
.leaderboards-page [role=tabpanel]:focus-visible{outline:2px solid var(--cyan);outline-offset:5px;border-radius:var(--radius)}
.rankings-heading{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:28px 30px;border-bottom:1px solid var(--line)}
.rankings-label{display:block;margin-bottom:9px;color:var(--cyan);font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.rankings-heading h2{font-size:34px}
.rankings-heading p{margin-top:10px;font-size:13px}
.rankings-heading .button{flex-shrink:0}
.rankings-table-wrap{overflow-x:auto}
.rankings-table{width:100%;border-collapse:collapse;text-align:left;font-variant-numeric:tabular-nums}
.rankings-table th,.rankings-table td{padding:20px 18px;border-bottom:1px solid var(--line);vertical-align:middle}
.rankings-table th:first-child,.rankings-table td:first-child{padding-left:30px;width:80px}
.rankings-table th:last-child,.rankings-table td:last-child{padding-right:30px}
.rankings-table thead th{background:var(--raised);color:var(--muted);font-size:10px;font-weight:600;letter-spacing:.07em;text-transform:uppercase}
.rankings-table tbody th{font-weight:600;overflow-wrap:anywhere}
.rankings-table tbody td{font-size:13px;color:var(--muted)}
.rankings-table tbody tr:last-child>*{border-bottom:0}
.rankings-table .ranking-score{text-align:right}
.rankings-table tbody .ranking-score{font-size:22px;font-weight:600;color:var(--text);font-family:var(--font-display)}
.ranking-number{color:var(--muted);font-weight:600;white-space:nowrap}
.ranking-first .ranking-number,.rankings-table .ranking-first .ranking-score{color:var(--cyan)}
.ranking-player{display:inline-flex;align-items:center;gap:10px;max-width:100%}
.ranking-player .icon{width:13px;height:13px;color:var(--muted)}
.ranking-player:hover{color:var(--cyan);text-decoration:underline}
.rankings-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 30px;border-top:1px solid var(--line)}
.rankings-footer:has(.rankings-range:empty):has(nav[hidden]){display:none}
.rankings-footer nav{display:flex;gap:10px}
.rankings-message{padding:38px 30px}
.rankings-message p{margin-top:12px}
.rankings-note{margin-top:20px;font-size:12px}
@media(max-width:720px){
  .rankings-tabs{gap:6px;margin-bottom:20px}
  .rankings-tabs [role=tab]{padding:9px 12px;font-size:12px}
  .rankings-heading{padding:22px 18px;gap:14px;align-items:flex-start}
  .rankings-heading h2{font-size:27px}
  .rankings-heading p{font-size:12px}
  .rankings-table .ranking-detail{display:none}
  .rankings-table th,.rankings-table td{padding:17px 8px}
  .rankings-table th:first-child,.rankings-table td:first-child{padding-left:16px;width:46px}
  .rankings-table th:last-child,.rankings-table td:last-child{padding-right:8px}
  .rankings-table tbody th,.rankings-table tbody td{font-size:12px}
  .rankings-table tbody .ranking-score{font-size:20px;white-space:nowrap}
  .ranking-player .icon{display:none}
  .rankings-footer{padding:16px;flex-wrap:wrap;gap:12px}
  .rankings-message{padding:28px 18px}
}