/* Live leaderboard only; other Network dialogs share the legacy modal classes. */
#rankModal { padding: 12px; }
#rankModal .rank-modal {
  width: min(760px, 100%);
  min-width: 0;
  max-height: calc(100vh - 24px);
  max-height: calc(100dvh - 24px);
  display: flex;
  flex-direction: column;
}
#rankModal .rank-modal-head { flex: 0 0 auto; padding: 12px 14px; }
#rankModal .rank-modal-head h2 { min-width: 0; font-size: 20px; line-height: 1.3; }
#rankModal .rank-modal-close { flex: 0 0 auto; }
#rankModalList {
  min-height: 0;
  min-width: 0;
  max-height: none;
  padding: 0 8px 8px;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
}
#rankModal .rank-compact-head,
#rankModal .rank-compact-row {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr) 64px 76px 32px 12px;
  gap: 8px;
  align-items: center;
  padding: 0 8px;
  min-width: 0;
  font-size: 14px;
  line-height: 1.3;
  font-weight: 750;
  font-variant-numeric: tabular-nums;
}
#rankModal .rank-compact-head {
  position: sticky;
  top: 0;
  z-index: 1;
  min-height: 30px;
  font-size: 11px;
  color: #b9c1cb;
  background: #101722;
  border-bottom: 1px solid #ffffff24;
}
#rankModal .rank-compact-head > :nth-child(n+3) { text-align: right; }
#rankModal .rank-entry { min-width: 0; border-bottom: 1px solid #ffffff12; }
#rankModal .rank-entry:last-child { border-bottom: 0; }
#rankModal .rank-entry.mine { background: rgba(223,166,74,.12); border-radius: 8px; }
#rankModal .rank-compact-row { min-height: 44px; cursor: pointer; list-style: none; }
#rankModal .rank-compact-row::-webkit-details-marker { display: none; }
#rankModal .rank-compact-row::marker { content: ''; }
#rankModal .rank-compact-row:hover { background: #ffffff08; border-radius: 8px; }
#rankModal .rank-compact-row:focus-visible { outline: 2px solid var(--gold); outline-offset: -2px; border-radius: 8px; }
#rankModal .rank-compact-row > * { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#rankModal .rank-compact-place { text-align: center; color: var(--gold); }
#rankModal .rank-summary-value { text-align: right; }
#rankModal .rank-compact-score { color: var(--gold); }
#rankModal .rank-compact-toggle { text-align: center; color: #b9c1cb; }
#rankModal .rank-entry[open] .rank-compact-toggle { transform: rotate(180deg); }
#rankModal .rank-detail { padding: 0 8px 10px; }
#rankModal .rank-detail-name { margin: 0 0 8px; font-size: 13px; overflow-wrap: anywhere; }
#rankModal .rank-detail-name span { color: #b9c1cb; font-weight: 500; }
#rankModal .rank-detail-stats { margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; }
#rankModal .rank-detail-stats > div { min-width: 0; padding: 6px 4px; background: #0000002b; border-radius: 6px; text-align: center; }
#rankModal .rank-detail-stats dt { font-size: 11px; color: #b9c1cb; }
#rankModal .rank-detail-stats dd { margin: 2px 0 0; font-size: 14px; font-weight: 750; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
#rankModal .rank-detail-stats .teamkill-stat dt { color: #ffb2ac; }
@media (max-width: 480px) {
  #rankModal .rank-compact-head,
  #rankModal .rank-compact-row {
    grid-template-columns: 22px minmax(0, 1fr) 46px 58px 24px 10px;
    gap: 4px;
    padding-inline: 4px;
  }
  #rankModal .rank-compact-row { font-size: 12px; }
}
