/* Public leaderboard readability and no-clipping overrides.
   Kept separate from the main game stylesheet so leaderboard iteration cannot
   accidentally affect the canvas/gameplay layout. */

.leaderboard-name-form label {
  font-size: clamp(0.62rem, 0.8vw, 0.72rem);
}

.leaderboard-name-form input {
  min-height: 44px;
  font-size: clamp(0.78rem, 1vw, 0.9rem);
}

.leaderboard-name-form .secondary-button {
  min-height: 44px;
}

.leaderboard-name-form small {
  font-size: clamp(0.58rem, 0.72vw, 0.64rem);
}

.leaderboard-mode-tab,
.leaderboard-period-tabs button {
  min-height: 44px;
  font-size: clamp(0.62rem, 0.8vw, 0.72rem);
}

.leaderboard-card-header p {
  font-size: clamp(0.58rem, 0.72vw, 0.66rem);
}

.leaderboard-card thead th {
  font-size: clamp(0.56rem, 0.74vw, 0.66rem);
}

.leaderboard-card tbody th,
.leaderboard-card tbody td {
  font-size: clamp(0.72rem, 0.96vw, 0.88rem);
  line-height: 1.2;
}

.leaderboard-message td {
  font-size: 0.62rem !important;
  line-height: 1.35;
}

.leaderboard-card th,
.leaderboard-card td {
  text-overflow: clip;
}

.leaderboard-card .leaderboard-player-name {
  overflow: visible;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: normal;
}

.leaderboard-card .leaderboard-score,
.leaderboard-card thead th:last-child,
.leaderboard-card tbody th {
  white-space: nowrap;
}

/* Give names a little more room while retaining enough width for 7+ digit scores. */
.leaderboard-card thead th:first-child,
.leaderboard-card tbody th {
  width: 12%;
}

.leaderboard-card thead th:nth-child(2) {
  width: 50%;
}

.leaderboard-card thead th:last-child,
.leaderboard-score {
  width: 38%;
}

@media (max-width: 760px) {
  .leaderboard-card tbody th,
  .leaderboard-card tbody td {
    font-size: clamp(0.7rem, 2.7vw, 0.84rem);
  }

  .leaderboard-card thead th {
    font-size: clamp(0.56rem, 2.1vw, 0.66rem);
  }

  .leaderboard-name-form input {
    font-size: 0.78rem;
  }
}