/* Rankings v2: a data-first Community page. */
.ranking-v2 .ranking-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, .55fr);
  gap: clamp(28px, 4vw, 52px);
  align-items: end;
  padding: clamp(28px, 4vw, 48px) 0 30px;
}
.ranking-v2 .ranking-header h1 { margin: 7px 0 12px; }
.ranking-v2 .ranking-header-copy > p { max-width: 68ch; }
.ranking-v2 .ranking-refresh-panel {
  display: grid;
  gap: 10px;
  justify-items: start;
  padding-left: 22px;
  border-left: 1px solid var(--color-border, rgba(25,24,29,.14));
}
.ranking-v2 .ranking-refresh-panel .status { width: 100%; }
.ranking-v2 .ranking-refresh-meta { margin: 0; }

.ranking-v2 .ranking-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  padding: 18px 0;
  border-top: 1px solid var(--color-border, rgba(25,24,29,.14));
  border-bottom: 1px solid var(--color-border, rgba(25,24,29,.14));
}
.ranking-v2 .ranking-summary .stat {
  padding: 2px 24px;
  border: 0;
  border-right: 1px solid var(--color-border, rgba(25,24,29,.14));
  border-radius: 0;
  background: transparent;
}
.ranking-v2 .ranking-summary .stat:first-child { padding-left: 0; }
.ranking-v2 .ranking-summary .stat:last-child { border-right: 0; }
.ranking-v2 .ranking-summary .stat-value { font-size: 1.55rem; }

.ranking-v2 .ranking-standings {
  padding: 36px 0 0;
}
.ranking-v2 .ranking-standings-head {
  display: flex;
  gap: 24px;
  align-items: end;
  justify-content: space-between;
  margin-bottom: 18px;
}
.ranking-v2 .ranking-standings-head h2 { margin: 5px 0 0; }
.ranking-v2 .ranking-toolbar {
  display: flex;
  gap: 18px;
  align-items: end;
  justify-content: space-between;
  margin-bottom: 12px;
}
.ranking-v2 .ranking-search {
  display: grid;
  gap: 6px;
  width: min(100%, 380px);
  color: var(--color-muted, #66636b);
  font-size: .78rem;
  font-weight: 700;
}
.ranking-v2 .ranking-result-count {
  min-width: 120px;
  text-align: right;
}
.ranking-v2 .ranking-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--color-border, rgba(25,24,29,.14));
  border-radius: var(--radius-lg, 16px);
  background: rgba(251,247,239,.76);
}
.ranking-v2 #leaderboard { min-width: 780px; }
.ranking-v2 #leaderboard thead { background: var(--color-ink, #19181d); }
.ranking-v2 #leaderboard th { padding: 0; }
.ranking-v2 .ranking-sort-button,
.ranking-v2 .ranking-column-label {
  width: 100%;
  min-height: 46px;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 11px 14px;
  border: 0;
  background: transparent;
  color: #fffaf2;
  font: inherit;
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .07em;
  text-transform: uppercase;
  text-align: left;
  white-space: nowrap;
}
.ranking-v2 .ranking-sort-button { cursor: pointer; }
.ranking-v2 .ranking-sort-button:hover,
.ranking-v2 .ranking-sort-button:focus-visible { background: rgba(255,255,255,.08); }
.ranking-v2 .ranking-sort-button::after {
  content: "↕";
  opacity: .38;
  font-size: .75rem;
}
.ranking-v2 th[aria-sort="ascending"] .ranking-sort-button::after { content: "↑"; opacity: 1; }
.ranking-v2 th[aria-sort="descending"] .ranking-sort-button::after { content: "↓"; opacity: 1; }
.ranking-v2 #leaderboard td { padding: 14px; vertical-align: middle; }
.ranking-v2 #leaderboard tbody tr { transition: background .12s ease; }
.ranking-v2 #leaderboard tbody tr:hover { background: rgba(23,106,107,.055); }
.ranking-v2 #leaderboard tbody tr.rank-1,
.ranking-v2 #leaderboard tbody tr.rank-2,
.ranking-v2 #leaderboard tbody tr.rank-3 { background: rgba(196,73,38,.035); }
.ranking-v2 .rank-cell {
  width: 58px;
  color: var(--color-muted, #66636b);
  font-weight: 800;
}
.ranking-v2 tr.rank-1 .rank-cell { color: #8b6508; }
.ranking-v2 tr.rank-2 .rank-cell { color: #66707a; }
.ranking-v2 tr.rank-3 .rank-cell { color: #9a5b36; }
.ranking-v2 .player-cell a {
  color: inherit;
  font-weight: 800;
  text-decoration-color: rgba(196,73,38,.34);
  text-underline-offset: 3px;
}
.ranking-v2 .player-cell a:hover { color: var(--color-action, #c44926); }
.ranking-v2 .ranking-score { font-weight: 800; }
.ranking-v2 .ranking-progression strong { display: block; }
.ranking-v2 .ranking-progression small {
  color: var(--color-muted, #66636b);
  font-size: .7rem;
  white-space: nowrap;
}
.ranking-v2 .ranking-empty {
  padding: 30px 18px !important;
  color: var(--color-muted, #66636b);
  text-align: center;
}

.ranking-v2 .ranking-methodology {
  margin: 28px 0 10px;
  border-top: 1px solid var(--color-border, rgba(25,24,29,.14));
  border-bottom: 1px solid var(--color-border, rgba(25,24,29,.14));
}
.ranking-v2 .ranking-methodology > summary {
  list-style: none;
  display: flex;
  justify-content: space-between;
  gap: 20px;
  padding: 18px 2px;
  cursor: pointer;
  font-weight: 800;
}
.ranking-v2 .ranking-methodology > summary::-webkit-details-marker { display: none; }
.ranking-v2 .ranking-methodology > summary::after { content: "+"; }
.ranking-v2 .ranking-methodology[open] > summary::after { content: "−"; }
.ranking-v2 .ranking-methodology-body {
  max-width: 850px;
  padding: 0 2px 22px;
}
.ranking-v2 .ranking-formula {
  padding: 14px 16px;
  border-left: 3px solid var(--color-progress, #176a6b);
  background: rgba(23,106,107,.06);
  font-weight: 700;
  overflow-wrap: anywhere;
}

@media (max-width: 800px) {
  .ranking-v2 .ranking-header { grid-template-columns: 1fr; }
  .ranking-v2 .ranking-refresh-panel { padding-left: 0; border-left: 0; }
  .ranking-v2 .ranking-standings-head,
  .ranking-v2 .ranking-toolbar { align-items: stretch; flex-direction: column; }
  .ranking-v2 .ranking-result-count { text-align: left; }
}
@media (max-width: 560px) {
  .ranking-v2 .ranking-summary { grid-template-columns: 1fr; padding: 4px 0; }
  .ranking-v2 .ranking-summary .stat,
  .ranking-v2 .ranking-summary .stat:first-child {
    padding: 13px 0;
    border-right: 0;
    border-bottom: 1px solid var(--color-border, rgba(25,24,29,.14));
  }
  .ranking-v2 .ranking-summary .stat:last-child { border-bottom: 0; }
}
