:root {
  color-scheme: light;
  --bg: #f5f6f8;
  --bg-card: #ffffff;
  --texto: #1a1d21;
  --texto-fraco: #5b6068;
  --borda: #e1e4e8;
  --acento: #e10600;
  --ok2: #1e9e5a;
  --ok2-bg: #d9f4e6;
  --ok1: #c99a00;
  --ok1-bg: #fbf0c8;
  --ok0-bg: #eceef1;
  --ok0-texto: #6b7078;
  --sombra: 0 1px 3px rgba(0, 0, 0, 0.08);
}

/* Tokens do tema escuro. `--tema-escuro` guarda os valores; são aplicados
   tanto pela preferência do sistema (a menos que o usuário force o claro com
   data-theme="light") quanto pela escolha explícita data-theme="dark". */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --bg: #14161a;
    --bg-card: #1f2227;
    --texto: #eceef1;
    --texto-fraco: #9aa0a8;
    --borda: #2c3036;
    --ok2: #3fd17f;
    --ok2-bg: #17352a;
    --ok1: #e6bf3c;
    --ok1-bg: #3a331a;
    --ok0-bg: #2a2d32;
    --ok0-texto: #8b9098;
    --sombra: 0 1px 3px rgba(0, 0, 0, 0.4);
  }
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #14161a;
  --bg-card: #1f2227;
  --texto: #eceef1;
  --texto-fraco: #9aa0a8;
  --borda: #2c3036;
  --ok2: #3fd17f;
  --ok2-bg: #17352a;
  --ok1: #e6bf3c;
  --ok1-bg: #3a331a;
  --ok0-bg: #2a2d32;
  --ok0-texto: #8b9098;
  --sombra: 0 1px 3px rgba(0, 0, 0, 0.4);
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  background: var(--bg);
  color: var(--texto);
}

header.topo {
  padding: 1rem 1rem 0;
  position: sticky;
  top: 0;
  background: var(--bg);
  z-index: 10;
  border-bottom: 1px solid var(--borda);
}

header.topo h1 {
  margin: 0;
  font-size: 1.3rem;
}

.topo__linha {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
  margin-bottom: 0.75rem;
}

/* Switch de tema — mesmo visual dos toggles do site (.temporada-modo). */
.tema-switch {
  display: flex;
  flex-shrink: 0;
  border: 1px solid var(--borda);
  border-radius: 999px;
  overflow: hidden;
}

.tema-switch__btn {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  border: none;
  background: var(--bg-card);
  color: var(--texto-fraco);
  font: inherit;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.32rem 0.7rem;
  cursor: pointer;
}

.tema-switch__btn + .tema-switch__btn {
  border-left: 1px solid var(--borda);
}

.tema-switch__btn--ativo {
  background: var(--acento);
  color: #fff;
}

/* Grupo da direita do topo: botão Menu + switch de tema. */
.topo__acoes {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  flex-shrink: 0;
  margin-left: auto;
}

.topo-menu {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  border: 1px solid var(--borda);
  border-radius: 999px;
  background: var(--bg-card);
  color: var(--texto);
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.32rem 0.7rem;
  text-decoration: none;
}
.topo-menu:hover { border-color: var(--acento); color: var(--acento); }
.topo-menu--ativo { background: var(--acento); border-color: var(--acento); color: #fff; }
.topo-menu--ativo:hover { color: #fff; }

@media (max-width: 480px) {
  .tema-switch__label, .topo-menu__label { display: none; }
  .topo-menu { padding: 0.32rem 0.6rem; font-size: 0.85rem; }
  .tema-switch__btn { padding: 0.32rem 0.6rem; font-size: 0.85rem; }
}

nav.abas {
  display: flex;
  gap: 0.25rem;
}

button.aba {
  flex: 1;
  padding: 0.6rem 0.5rem;
  border: none;
  background: transparent;
  color: var(--texto-fraco);
  font-size: 0.95rem;
  font-weight: 600;
  cursor: pointer;
  border-bottom: 3px solid transparent;
}

button.aba[aria-selected="true"] {
  color: var(--acento);
  border-bottom-color: var(--acento);
}

main {
  max-width: 900px;
  margin: 0 auto;
  padding: 1rem;
}

.status {
  color: var(--texto-fraco);
  padding: 1rem 0;
  text-align: center;
}

.status.erro {
  color: var(--acento);
}

.preferencia-legenda {
  color: var(--texto-fraco);
  font-size: 0.85rem;
  margin-top: 0.5rem;
}

/* Ranking */

.ranking-tabela {
  width: 100%;
  border-collapse: collapse;
  background: var(--bg-card);
  border-radius: 10px;
  overflow: hidden;
  box-shadow: var(--sombra);
}

.ranking-tabela th, .ranking-tabela td {
  padding: 0.6rem 0.7rem;
  text-align: left;
  border-bottom: 1px solid var(--borda);
  font-size: 0.9rem;
}

.ranking-tabela th {
  color: var(--texto-fraco);
  font-weight: 600;
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.ranking-tabela tbody tr:last-child td {
  border-bottom: none;
}

.ranking-tabela td.num, .ranking-tabela th.num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.pos-medalha {
  font-weight: 700;
}

.compensacao-nota {
  display: block;
  font-size: 0.72rem;
  color: var(--texto-fraco);
}

.ranking-card__header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0.6rem;
}

.ranking-card__header h2 {
  margin: 0;
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--texto);
}

.corrida-detalhe-card__acoes {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.btn-copiar {
  border: 1px solid var(--borda);
  background: var(--bg-card);
  color: var(--texto);
  border-radius: 6px;
  padding: 0.35rem 0.65rem;
  font-size: 0.78rem;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
}

.btn-copiar:hover {
  border-color: var(--acento);
  color: var(--acento);
}

.btn-copiar--copiado {
  border-color: var(--ok2);
  color: var(--ok2);
}

/* Corridas — cards informativos (última contabilizada + próxima) */

.corridas-cards {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  margin-bottom: 1rem;
}

/* Faixa fina de bandeiras do calendário (Ranking / Geral) — sempre 1 linha:
   os círculos encolhem para caber todas as corridas na largura disponível. */
.corridas-flags {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  gap: 2px;
  margin-bottom: 0.45rem;
  padding: 0 0.1rem;
}
.corridas-flags:empty { display: none; }
.corridas-flags__item {
  flex: 1 1 0;
  min-width: 0;
  max-width: 1.05rem;
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  border: 1px solid var(--borda);
  background: var(--bg-card);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  font-size: 0.7rem;
  line-height: 1;
  cursor: default;
  transition: transform 0.1s ease;
}
.corridas-flags__item > * { pointer-events: none; }
.corridas-flags__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.corridas-flags__item--passada { filter: grayscale(0.8); opacity: 0.72; }
.corridas-flags__item:hover,
.corridas-flags__item:focus-visible {
  transform: scale(1.35);
  outline: none;
  border-color: var(--acento);
}

.faixa-tooltip {
  position: absolute;
  z-index: 100;
  max-width: 15rem;
  padding: 0.4rem 0.6rem;
  border-radius: 8px;
  background: var(--texto);
  color: var(--bg);
  font-size: 0.76rem;
  line-height: 1.35;
  box-shadow: var(--sombra);
  pointer-events: none;
}
.faixa-tooltip__titulo { font-weight: 700; margin-bottom: 0.1rem; }
.faixa-tooltip__linha { opacity: 0.85; }

.corrida-card {
  flex: 1 1 200px;
  background: var(--bg-card);
  border-radius: 8px;
  box-shadow: var(--sombra);
  padding: 0.55rem 0.7rem;
}

.corrida-card__titulo {
  font-size: 0.68rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--texto-fraco);
  margin-bottom: 0.15rem;
}

.corrida-card__corrida {
  font-size: 0.92rem;
  font-weight: 700;
}

.corrida-card__extra {
  margin-top: 0.15rem;
  font-size: 0.78rem;
  color: var(--texto-fraco);
}

/* Corridas — tabela de pontuação por rodada */

#corridas-tabela-container {
  overflow-x: auto;
}

.corridas-tabela {
  width: 100%;
  border-collapse: collapse;
  background: var(--bg-card);
  border-radius: 10px;
  box-shadow: var(--sombra);
  font-size: 0.85rem;
}

.corridas-tabela th, .corridas-tabela td {
  padding: 0.5rem 0.6rem;
  text-align: left;
  border-bottom: 1px solid var(--borda);
  white-space: nowrap;
}

.corridas-tabela th {
  color: var(--texto-fraco);
  font-weight: 600;
  font-size: 0.72rem;
}

.corridas-tabela tbody tr:last-child td {
  border-bottom: none;
}

.corridas-tabela td.num, .corridas-tabela th.num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.corridas-tabela__rodada {
  display: block;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.corridas-tabela__corrida {
  display: block;
  font-weight: 400;
  text-transform: none;
  font-size: 0.68rem;
}

.corridas-tabela__compensado {
  color: var(--texto-fraco);
  font-style: italic;
}

.corridas-tabela__total {
  font-weight: 700;
  color: var(--texto);
}

/* Filtro jogador */

.filtro-jogador {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 1rem;
}

.filtro-jogador select {
  flex: 1;
  padding: 0.5rem;
  border-radius: 8px;
  border: 1px solid var(--borda);
  background: var(--bg-card);
  color: var(--texto);
  font-size: 1rem;
}

/* Cards de rodada */

.rodada-card {
  background: var(--bg-card);
  border-radius: 10px;
  box-shadow: var(--sombra);
  margin-bottom: 1rem;
  overflow: hidden;
}

.rodada-card__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.8rem 1rem;
  border-bottom: 1px solid var(--borda);
  gap: 0.5rem;
}

.rodada-card__titulo {
  font-weight: 700;
}

.rodada-card__data {
  font-size: 0.78rem;
  color: var(--texto-fraco);
  display: block;
  font-weight: 400;
}

.rodada-card__total {
  font-weight: 700;
  font-size: 1.1rem;
  white-space: nowrap;
}

.rodada-card__body {
  padding: 0.8rem 1rem;
}

.rodada-card--sem-palpite .rodada-card__body {
  color: var(--texto-fraco);
  font-size: 0.9rem;
}

.top6-tabela {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 0.8rem;
}

.top6-tabela th {
  font-size: 0.72rem;
  text-transform: uppercase;
  color: var(--texto-fraco);
  text-align: left;
  padding: 0.2rem 0.4rem;
}

.top6-tabela td {
  padding: 0.3rem 0.4rem;
  vertical-align: middle;
}

.top6-tabela td.pos-col {
  color: var(--texto-fraco);
  font-variant-numeric: tabular-nums;
  width: 1.6rem;
}

.piloto-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

.piloto-bolinha {
  width: 0.6rem;
  height: 0.6rem;
  border-radius: 50%;
  flex-shrink: 0;
  display: inline-block;
}

.piloto-bolinhas {
  display: inline-flex;
  align-items: center;
  gap: 0.15rem;
  flex-shrink: 0;
}

.ponto-badge {
  display: inline-block;
  padding: 0.1rem 0.5rem;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 700;
  text-align: center;
  min-width: 1.6rem;
}

.ponto-2 { background: var(--ok2-bg); color: var(--ok2); }
.ponto-1 { background: var(--ok1-bg); color: var(--ok1); }
.ponto-0 { background: var(--ok0-bg); color: var(--ok0-texto); }

.distancia-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.2rem;
  padding: 0.1rem 0.45rem;
  border-radius: 999px;
  background: var(--bg);
  border: 1px solid var(--borda);
  color: var(--texto-fraco);
  font-size: 0.78rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

.bonus-linha {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.88rem;
  padding-top: 0.6rem;
  border-top: 1px solid var(--borda);
}

.bonus-linha__label {
  color: var(--texto-fraco);
}

/* Histórico — matriz posição × corrida */

.hist-jogadores {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-bottom: 0.4rem;
}

.hist-jogador-chip,
.rendimento-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  border: 1px solid var(--borda);
  background: var(--bg-card);
  color: var(--texto);
  border-radius: 999px;
  padding: 0.3rem 0.7rem;
  font-size: 0.82rem;
  font-weight: 600;
  cursor: pointer;
}

.hist-jogador-chip__ponto {
  width: 0.7rem;
  height: 0.7rem;
  border-radius: 50%;
  background: var(--cor-jogador, var(--texto-fraco));
  flex-shrink: 0;
}

.rendimento-chip__ponto {
  width: 0.7rem;
  height: 0.7rem;
  border-radius: 50%;
  background: var(--cor-chip, var(--texto-fraco));
  flex-shrink: 0;
}

.hist-jogador-chip[aria-pressed="true"] {
  border-color: var(--cor-jogador);
  box-shadow: inset 0 0 0 1px var(--cor-jogador);
}

.rendimento-chip[aria-pressed="true"] {
  border-color: var(--cor-chip);
  box-shadow: inset 0 0 0 1px var(--cor-chip);
}

.rendimento-chip:not([aria-pressed="true"]) {
  opacity: 0.5;
}

.hist-jogadores__dica {
  margin: 0 0 1rem;
  font-size: 0.76rem;
  color: var(--texto-fraco);
}

.hist-matriz-wrap {
  overflow-x: auto;
  background: var(--bg-card);
  border-radius: 10px;
  box-shadow: var(--sombra);
}

.hist-matriz {
  border-collapse: collapse;
  width: 100%;
  font-size: 0.82rem;
}

.hist-matriz th, .hist-matriz td {
  padding: 0.4rem 0.5rem;
  text-align: center;
  border-bottom: 1px solid var(--borda);
  white-space: nowrap;
}

.hist-matriz thead th {
  position: sticky;
  top: 0;
  background: var(--bg-card);
  z-index: 2;
  color: var(--texto-fraco);
  font-weight: 600;
  font-size: 0.72rem;
}

.hist-matriz__rlabel {
  display: block;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.hist-matriz__rcorrida {
  display: block;
  font-weight: 400;
  font-size: 0.66rem;
  text-transform: none;
}

.hist-matriz__pos {
  position: sticky;
  left: 0;
  background: var(--bg-card);
  z-index: 1;
  color: var(--texto-fraco);
  font-weight: 700;
  min-width: 3rem;
  border-right: 1px solid var(--borda);
}

.hist-matriz thead .hist-matriz__pos {
  z-index: 3;
}

.hist-matriz tbody tr:last-child td,
.hist-matriz tbody tr:last-child th {
  border-bottom: none;
}

.hist-matriz__linha-extra th,
.hist-matriz__linha-extra td {
  border-top: 2px solid var(--borda);
}

.hist-matriz__linha-total th,
.hist-matriz__linha-total td {
  border-top: 2px solid var(--borda);
  font-weight: 700;
}

.hist-cel {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.hist-cel__linha {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.3rem;
}

.hist-cel__ponto {
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  flex-shrink: 0;
}

.hist-cel__chute {
  font-size: 0.72rem;
  color: var(--texto-fraco);
  font-variant-numeric: tabular-nums;
}

.hist-cel__vazio {
  color: var(--texto-fraco);
  opacity: 0.5;
}

.hist-cel__total {
  font-variant-numeric: tabular-nums;
}

.hist-cel__total--comp {
  color: var(--texto-fraco);
  font-style: italic;
  font-weight: 400;
}

.hist-legenda {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem 1rem;
  margin: 0.7rem 0 0;
  font-size: 0.76rem;
  color: var(--texto-fraco);
}

.hist-legenda span {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
}

.hist-porcorrida {
  margin-top: 1.4rem;
  background: var(--bg-card);
  border-radius: 10px;
  box-shadow: var(--sombra);
  overflow: hidden;
}

.hist-porcorrida__resumo {
  padding: 0.8rem 1rem;
  font-weight: 700;
  font-size: 0.9rem;
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.hist-porcorrida__resumo::-webkit-details-marker {
  display: none;
}

.hist-porcorrida__resumo::before {
  content: "\25B6";
  font-size: 0.7rem;
  color: var(--texto-fraco);
  transition: transform 0.15s;
}

.hist-porcorrida[open] .hist-porcorrida__resumo::before {
  transform: rotate(90deg);
}

.hist-porcorrida__corpo {
  padding: 0 1rem 1rem;
}

.hist-porcorrida__nota {
  font-size: 0.78rem;
  color: var(--texto-fraco);
  margin: 0 0 0.8rem;
}

/* Pontuação da corrida (Ranking / Geral) */

.corrida-detalhe-card {
  margin-top: 1rem;
  padding: 0.9rem 1rem 1rem;
  background: var(--bg-card);
  border-radius: 10px;
  box-shadow: var(--sombra);
}

.corrida-detalhe-card__header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0.7rem;
}

.corrida-detalhe-card__header h2 {
  margin: 0;
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--texto);
}

.corrida-detalhe-select {
  padding: 0.4rem 0.6rem;
  border-radius: 8px;
  border: 1px solid var(--borda);
  background: var(--bg);
  color: var(--texto);
  font-size: 0.85rem;
}

.corrida-detalhe-tabela-wrap {
  overflow-x: auto;
}

.corrida-detalhe-tabela {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.85rem;
}

.corrida-detalhe-tabela th, .corrida-detalhe-tabela td {
  padding: 0.4rem 0.55rem;
  text-align: left;
  border-bottom: 1px solid var(--borda);
  white-space: nowrap;
}

.corrida-detalhe-tabela th {
  color: var(--texto-fraco);
  font-weight: 600;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.corrida-detalhe-th__nome {
  display: block;
}

.corrida-detalhe-tabela th .corrida-detalhe-th__total {
  display: inline-block;
  margin-top: 0.35rem;
  padding: 0.1rem 0.5rem;
  border-radius: 999px;
  background: var(--bg);
  border: 1px solid var(--borda);
  font-weight: 700;
  font-size: 0.72rem;
  text-transform: none;
  letter-spacing: normal;
  color: var(--texto);
}

.corrida-detalhe-tabela tbody tr:last-child td {
  border-bottom: none;
}

.corrida-detalhe-tabela th:first-child,
.corrida-detalhe-tabela td:first-child,
.corrida-detalhe-tabela th:nth-child(2),
.corrida-detalhe-tabela td:nth-child(2) {
  position: sticky;
  background: var(--bg-card);
  z-index: 1;
}

.corrida-detalhe-tabela th:first-child,
.corrida-detalhe-tabela td:first-child {
  left: 0;
  width: 3.6rem;
  min-width: 3.6rem;
}

.corrida-detalhe-tabela th:nth-child(2),
.corrida-detalhe-tabela td:nth-child(2) {
  left: 3.6rem;
  min-width: 4.2rem;
  border-right: 1px solid var(--borda);
}

.corrida-detalhe-rotulo {
  display: table-cell;
  vertical-align: middle;
  color: var(--texto-fraco);
  font-weight: 600;
}

.corrida-detalhe-rotulo span {
  display: block;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.corrida-detalhe-rotulo .piloto-chip {
  margin-top: 0.15rem;
  font-weight: 600;
}

.corrida-detalhe-cel {
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

.corrida-detalhe-cel__pos {
  font-variant-numeric: tabular-nums;
  font-weight: 600;
}

.corrida-detalhe-vazio {
  color: var(--texto-fraco);
}

@media (max-width: 480px) {
  .corrida-detalhe-cel { flex-direction: column; align-items: flex-start; gap: 0.15rem; }
  .corrida-detalhe-tabela th, .corrida-detalhe-tabela td { padding: 0.35rem 0.4rem; font-size: 0.8rem; }
}

/* Ocultar/exibir o card "Pontuação da corrida" (Ranking / Geral) */

.card-recolhivel__titulo {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}

.btn-recolher {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.6rem;
  height: 1.6rem;
  padding: 0;
  border: 1px solid var(--borda);
  border-radius: 6px;
  background: var(--bg);
  color: var(--texto-fraco);
  font: inherit;
  cursor: pointer;
}

.btn-recolher:hover { color: var(--texto); }

.btn-recolher__icone {
  display: inline-block;
  font-size: 0.9rem;
  line-height: 1;
  transition: transform 0.15s ease;
}

.btn-recolher[aria-expanded="false"] .btn-recolher__icone { transform: rotate(-90deg); }

.corrida-detalhe-card--recolhido { padding-bottom: 0.9rem; }
.corrida-detalhe-card--recolhido .corrida-detalhe-card__header { margin-bottom: 0; }

/* Card "Explore a temporada" (Ranking / Geral) */

.chamadas-card {
  margin-top: 1rem;
  padding: 0.9rem 1rem 1rem;
  background: var(--bg-card);
  border-radius: 10px;
  box-shadow: var(--sombra);
}

.chamadas-card h2 {
  margin: 0 0 0.7rem;
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--texto);
}

.chamadas-lista {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 0.5rem;
}

.chamada {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  width: 100%;
  padding: 0.65rem 0.75rem;
  border: 1px solid var(--borda);
  border-radius: 8px;
  background: var(--bg);
  color: var(--texto);
  font: inherit;
  text-align: left;
  cursor: pointer;
}

a.chamada { text-decoration: none; }
.chamada:hover { border-color: var(--acento); }
.chamada:hover .chamada__seta { color: var(--acento); }

.chamada__icone { width: 1.6rem; text-align: center; font-size: 1.2rem; line-height: 1; flex-shrink: 0; }

.chamada__texto {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  min-width: 0;
  flex: 1;
}

.chamada__texto strong { font-size: 0.85rem; }
.chamada__texto span { font-size: 0.76rem; color: var(--texto-fraco); line-height: 1.3; }

.chamada__seta { font-size: 1.3rem; line-height: 1; color: var(--texto-fraco); flex-shrink: 0; }

/* Matriz posição/pontos acumulados (Ranking / Corridas) */

.temporada-matriz-container {
  margin-top: 1rem;
  padding: 1rem;
  background: var(--bg-card);
  border-radius: 10px;
  box-shadow: var(--sombra);
}
.temporada-matriz-container:empty { display: none; }
.temporada-matriz-container .temporada-grafico-titulo { margin-top: 0; }
.temporada-matriz-wrap { overflow-x: auto; }
.temporada-matriz td.num { white-space: nowrap; font-variant-numeric: tabular-nums; }
.temporada-matriz__jogador {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  white-space: nowrap;
}
.temporada-matriz__jogador .jogador-card__bolinha { flex-shrink: 0; }
.temporada-matriz__delta { margin-left: 0.25rem; font-size: 0.68rem; }
.temporada-matriz__delta--sobe { color: var(--ok2); }
.temporada-matriz__delta--desce { color: var(--acento); }

/* Título da sub-aba Ranking / Palpites */

.subsecao-titulo {
  margin: 0 0 0.7rem;
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--texto);
}

#subsecao-ranking-palpites .temporada-grafico-wrap { margin-top: 1.4rem; }

/* Ranking / Ponto extra — piloto da rodada na temporada */

.pe-tiles {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.5rem;
}

.pe-tile {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  padding: 0.75rem 0.85rem;
  background: var(--bg-card);
  border-radius: 10px;
  box-shadow: var(--sombra);
  border-top: 3px solid var(--acento);
  min-width: 0;
}

.pe-tile__valor {
  font-size: 1.55rem;
  font-weight: 800;
  line-height: 1.1;
  font-variant-numeric: tabular-nums;
}

.pe-tile__rotulo {
  font-size: 0.72rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--texto-fraco);
}

.pe-tile__extra {
  font-size: 0.75rem;
  color: var(--texto);
  font-weight: 600;
  overflow-wrap: anywhere;
}

.pe-card {
  margin-top: 1rem;
  padding: 1rem;
  background: var(--bg-card);
  border-radius: 10px;
  box-shadow: var(--sombra);
}

.pe-card .temporada-grafico-titulo { margin-bottom: 0.3rem; }

.pe-card__nota {
  margin: 0 0 0.7rem;
  font-size: 0.76rem;
  color: var(--texto-fraco);
  line-height: 1.4;
}
.pe-card__nota:last-child { margin: 0.8rem 0 0; }

.pe-pilotos { display: flex; flex-direction: column; }

.pe-piloto {
  display: grid;
  grid-template-columns: 6.5rem 2.2rem 1fr;
  align-items: center;
  gap: 0.6rem;
  padding: 0.55rem 0 0.55rem 0.65rem;
  border-left: 4px solid var(--cor-equipe);
  border-bottom: 1px solid var(--borda);
}
.pe-piloto:last-child { border-bottom: none; }

.pe-piloto__nome { display: flex; flex-direction: column; min-width: 0; }
.pe-piloto__cod { font-weight: 800; font-size: 0.95rem; letter-spacing: 0.02em; }
.pe-piloto__equipe {
  font-size: 0.7rem;
  color: var(--texto-fraco);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.pe-piloto__rodadas {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  padding: 0.35rem 0.4rem 0 0;
}

.pe-piloto__qtd {
  font-size: 1.15rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}

.pe-rodada {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  min-width: 4.3rem;
  padding: 0.25rem 0.55rem 0.25rem 0.3rem;
  border-radius: 7px;
  background: color-mix(in srgb, var(--cor-equipe) 14%, var(--bg-card));
  border: 1px solid color-mix(in srgb, var(--cor-equipe) 45%, transparent);
  cursor: help;
}

.pe-bandeira {
  width: 1.25rem;
  height: 1.25rem;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
  border: 1px solid var(--borda);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.7rem;
}

.pe-rodada__info {
  display: flex;
  flex-direction: column;
  line-height: 1.1;
  font-variant-numeric: tabular-nums;
}
.pe-rodada__info strong { font-size: 0.72rem; }
.pe-rodada__info span { font-size: 0.7rem; color: var(--texto-fraco); }

.pe-rodada__acertos,
.pe-legenda-acerto {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.1rem;
  height: 1.1rem;
  padding: 0 0.25rem;
  border-radius: 999px;
  background: var(--ok2-bg);
  color: var(--ok2);
  border: 1px solid var(--ok2);
  font-size: 0.66rem;
  font-weight: 800;
}

.pe-rodada__acertos {
  position: absolute;
  top: -0.45rem;
  right: -0.4rem;
}

.pe-texto p {
  margin: 0.25rem 0;
  font-size: 0.88rem;
  line-height: 1.45;
}

.pe-jogadores {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  gap: 0.5rem;
  margin-top: 0.8rem;
}

.pe-jogador {
  padding: 0.6rem 0.7rem;
  border: 1px solid var(--borda);
  border-radius: 8px;
  background: var(--bg);
}

.pe-jogador__topo {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}
.pe-jogador__nome { font-weight: 700; font-size: 0.9rem; }
.pe-jogador__meta { font-size: 0.74rem; color: var(--texto-fraco); margin-top: 0.1rem; }

.pe-jogador__acertos {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
  margin-top: 0.5rem;
}

.pe-acerto {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.15rem 0.5rem 0.15rem 0.2rem;
  border-radius: 999px;
  background: var(--bg-card);
  border: 1px solid color-mix(in srgb, var(--cor-equipe) 55%, var(--borda));
  font-size: 0.74rem;
  font-variant-numeric: tabular-nums;
}
.pe-acerto .pe-bandeira { width: 1.05rem; height: 1.05rem; }
.pe-acerto span { color: var(--texto-fraco); }

.pe-zerados {
  margin: 0.8rem 0 0;
  font-size: 0.8rem;
  color: var(--texto-fraco);
  line-height: 1.45;
}
.pe-zerados strong { color: var(--texto); }

@media (max-width: 600px) {
  .pe-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pe-piloto { grid-template-columns: 4.4rem 2rem 1fr; gap: 0.45rem; }
}
.temporada-cards--no-grafico { margin: 0.6rem 0 0.8rem; }

/* Regras de pontuação (Ranking) */

.regras-pontuacao {
  margin-top: 1rem;
  padding: 0.9rem 1rem;
  background: var(--bg-card);
  border-radius: 10px;
  box-shadow: var(--sombra);
  font-size: 0.85rem;
  color: var(--texto-fraco);
}

.regras-pontuacao h2 {
  margin: 0 0 0.5rem;
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--texto);
}

.regras-pontuacao ul {
  margin: 0;
  padding-left: 1.1rem;
}

.regras-pontuacao li {
  margin-bottom: 0.3rem;
}

.regras-pontuacao li:last-child {
  margin-bottom: 0;
}

.ir-para-bloco {
  margin-top: 1rem;
  padding-top: 0.9rem;
  border-top: 1px solid var(--borda);
  text-align: center;
}

.ir-para-bloco__texto {
  margin: 0 0 0.5rem;
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--texto-fraco);
}

.ir-para-bloco__botoes {
  display: flex;
  justify-content: center;
  gap: 0.6rem;
  flex-wrap: wrap;
}

.ir-para-botao {
  border: 1px solid var(--borda);
  background: var(--bg);
  color: var(--texto);
  font: inherit;
  font-size: 0.85rem;
  font-weight: 600;
  padding: 0.45rem 1.1rem;
  border-radius: 999px;
  cursor: pointer;
}
.ir-para-botao:hover { border-color: var(--acento); color: var(--acento); }

.ir-para-modal__busca {
  width: 100%;
  box-sizing: border-box;
  margin-bottom: 0.6rem;
  padding: 0.45rem 0.6rem;
  border: 1px solid var(--borda);
  border-radius: 8px;
  background: var(--bg);
  color: var(--texto);
  font: inherit;
  font-size: 0.85rem;
}

.ir-para-modal__lista {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  max-height: 55vh;
  overflow-y: auto;
}

.ir-para-modal__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
  width: 100%;
  border: 1px solid var(--borda);
  background: var(--bg);
  color: var(--texto);
  font: inherit;
  text-align: left;
  padding: 0.5rem 0.7rem;
  border-radius: 8px;
  cursor: pointer;
}
.ir-para-modal__item:hover { border-color: var(--acento); }
.ir-para-modal__item small { color: var(--texto-fraco); font-weight: 400; white-space: nowrap; }

/* Sub-abas (Ranking e Palpites por jogador) */

nav.subabas {
  display: flex;
  gap: 0.25rem;
  margin-bottom: 1rem;
  border-bottom: 1px solid var(--borda);
}

button.subaba {
  flex: 1;
  padding: 0.5rem 0.4rem;
  border: none;
  background: transparent;
  color: var(--texto-fraco);
  font-size: 0.85rem;
  font-weight: 600;
  cursor: pointer;
  border-bottom: 3px solid transparent;
}

button.subaba[aria-selected="true"] {
  color: var(--acento);
  border-bottom-color: var(--acento);
}

/* Temporada */

.temporada-cards {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 1rem;
}

.jogador-card {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.4rem 0.7rem;
  border-radius: 999px;
  border: 1.5px solid var(--cor-jogador, var(--borda));
  background: var(--bg-card);
  color: var(--texto);
  font-size: 0.82rem;
  font-weight: 600;
  cursor: pointer;
}

.jogador-card__bolinha {
  width: 0.6rem;
  height: 0.6rem;
  border-radius: 50%;
  background: var(--cor-jogador, var(--texto-fraco));
  flex-shrink: 0;
}

.jogador-card--desligado {
  opacity: 0.4;
}

.jogador-card--desligado .jogador-card__bolinha {
  background: var(--texto-fraco);
}

.temporada-grafico-wrap {
  background: var(--bg-card);
  border-radius: 10px;
  box-shadow: var(--sombra);
  padding: 1rem;
  margin-bottom: 1rem;
}

.temporada-grafico-wrap:last-child {
  margin-bottom: 0;
}

.temporada-grafico-cabecalho {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
  margin-bottom: 0.6rem;
  flex-wrap: wrap;
}

.temporada-grafico-cabecalho .temporada-grafico-titulo {
  margin: 0;
}

.temporada-modo {
  display: flex;
  border: 1px solid var(--borda);
  border-radius: 999px;
  overflow: hidden;
}

.temporada-modo__btn {
  border: none;
  background: var(--bg);
  color: var(--texto-fraco);
  font: inherit;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.25rem 0.7rem;
  cursor: pointer;
}

.temporada-modo__btn--ativo {
  background: var(--acento);
  color: #fff;
}

.temporada-grafico-titulo {
  margin: 0 0 0.6rem;
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--texto-fraco);
}

.temporada-grafico-canvas {
  position: relative;
  height: 260px;
}

/* Simulador (Ranking) */

.simulador-topo {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

.simulador-topo .status {
  padding: 0;
  text-align: left;
  flex: 1;
}

.simulador-reset-geral {
  border: 1px solid var(--borda);
  background: var(--bg-card);
  color: var(--texto);
  border-radius: 6px;
  padding: 0.25rem 0.5rem;
  font-size: 0.72rem;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
}

.simulador-reset-geral:hover {
  border-color: var(--acento);
  color: var(--acento);
}

.simulador-cards {
  display: grid;
  grid-template-rows: repeat(2, auto);
  grid-auto-flow: row;
  gap: 0.4rem;
  margin-bottom: 1rem;
}

.simulador-card {
  background: var(--bg-card);
  border-radius: 8px;
  box-shadow: var(--sombra);
  padding: 0.45rem 0.55rem;
  border-top: 3px solid var(--cor-jogador, var(--borda));
}

.simulador-card__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.3rem;
  margin-bottom: 0.3rem;
}

.simulador-card__nome-linha {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.25rem;
  min-width: 0;
}

.simulador-card__nome {
  font-weight: 700;
  font-size: 0.78rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.simulador-card__badge {
  display: inline-block;
  padding: 0.05rem 0.35rem;
  border-radius: 999px;
  background: var(--cor-jogador, var(--acento));
  color: #fff;
  font-size: 0.6rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  white-space: nowrap;
}

.simulador-card__badge--oculto {
  display: none;
}

.simulador-card__reset {
  border: 1px solid var(--borda);
  background: var(--bg);
  color: var(--texto-fraco);
  border-radius: 999px;
  width: 1.3rem;
  height: 1.3rem;
  line-height: 1;
  cursor: pointer;
  font-size: 0.75rem;
  flex-shrink: 0;
  padding: 0;
}

.simulador-card__reset:hover {
  color: var(--texto);
  border-color: var(--cor-jogador, var(--borda));
}

.simulador-card__controle {
  display: flex;
  align-items: center;
  gap: 0.3rem;
}

.simulador-card__passo {
  border: 1px solid var(--borda);
  background: var(--bg);
  color: var(--texto);
  border-radius: 6px;
  width: 1.5rem;
  height: 1.5rem;
  line-height: 1;
  cursor: pointer;
  font-size: 0.9rem;
  font-weight: 700;
  flex-shrink: 0;
  padding: 0;
}

.simulador-card__passo:hover {
  border-color: var(--cor-jogador, var(--borda));
  color: var(--cor-jogador, var(--texto));
}

.simulador-card__input {
  flex: 1;
  min-width: 0;
  width: 100%;
  border: 1px solid var(--borda);
  border-radius: 6px;
  background: var(--bg);
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  font-size: 0.82rem;
  text-align: center;
  padding: 0.2rem 0.1rem;
}

.simulador-card__input:focus {
  outline: none;
  border-color: var(--cor-jogador, var(--acento));
}

.simulador-tabela__projecao {
  font-weight: 700;
  color: var(--acento);
}

.delta-posicao {
  display: inline-block;
  padding: 0.1rem 0.4rem;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.delta-posicao--sobe { background: var(--ok2-bg); color: var(--ok2); }
.delta-posicao--desce { background: var(--ok0-bg); color: var(--acento); }
.delta-posicao--igual { background: var(--ok0-bg); color: var(--ok0-texto); }

/* Preferência piloto e Rendimento (mesmo visual de tabela) */

.preferencia-tabela, .rendimento-tabela {
  width: 100%;
  border-collapse: collapse;
  background: var(--bg-card);
  border-radius: 10px;
  overflow: hidden;
  box-shadow: var(--sombra);
}

.preferencia-tabela th, .preferencia-tabela td,
.rendimento-tabela th, .rendimento-tabela td {
  padding: 0.55rem 0.7rem;
  text-align: left;
  border-bottom: 1px solid var(--borda);
  font-size: 0.88rem;
}

.preferencia-tabela th, .rendimento-tabela th {
  color: var(--texto-fraco);
  font-weight: 600;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.preferencia-tabela tbody tr:last-child td,
.rendimento-tabela tbody tr:last-child td {
  border-bottom: none;
}

.preferencia-tabela td.num, .preferencia-tabela th.num,
.rendimento-tabela td.num, .rendimento-tabela th.num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

/* Intro e legenda das sub-abas */

.secao-intro {
  background: var(--bg-card);
  border-radius: 10px;
  box-shadow: var(--sombra);
  padding: 0.9rem 1rem;
  margin-bottom: 1rem;
}

.secao-intro h3 {
  margin: 0 0 0.35rem;
  font-size: 0.95rem;
}

.secao-intro p {
  margin: 0;
  font-size: 0.85rem;
  color: var(--texto-fraco);
}

.legenda-bloco {
  margin-top: 1rem;
  padding: 0.9rem 1rem;
  background: var(--bg-card);
  border-radius: 10px;
  box-shadow: var(--sombra);
  font-size: 0.85rem;
  color: var(--texto-fraco);
}

.legenda-bloco h4 {
  margin: 0 0 0.5rem;
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--texto);
}

.legenda-bloco ul {
  margin: 0;
  padding-left: 1.1rem;
}

.legenda-bloco li {
  margin-bottom: 0.35rem;
}

.legenda-bloco li:last-child {
  margin-bottom: 0;
}

.legenda-bloco .distancia-badge {
  vertical-align: middle;
}

/* Rendimento — switch de modo + chips de filtro */

.rendimento-modo {
  display: flex;
  width: fit-content;
  margin: 0 auto 1rem;
  border: 1px solid var(--borda);
  border-radius: 999px;
  overflow: hidden;
  background: var(--bg-card);
}

.rendimento-modo__btn {
  border: none;
  background: transparent;
  color: var(--texto-fraco);
  font: inherit;
  font-size: 0.74rem;
  font-weight: 600;
  padding: 0.25rem 0.85rem;
  cursor: pointer;
}

.rendimento-modo__btn--ativo {
  background: color-mix(in srgb, var(--acento) 14%, transparent);
  color: var(--acento);
}

.rendimento-chips-dica {
  margin: 0 0 0.4rem;
  font-size: 0.76rem;
  color: var(--texto-fraco);
}

.rendimento-jogadores {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-bottom: 0.4rem;
}

.rendimento-jogadores-acoes {
  display: flex;
  gap: 0.5rem;
  margin-bottom: 1rem;
}

.rendimento-jogadores__acao {
  border: 1px solid var(--borda);
  background: var(--bg-card);
  color: var(--texto-fraco);
  border-radius: 999px;
  padding: 0.2rem 0.7rem;
  font-size: 0.76rem;
  font-weight: 600;
  cursor: pointer;
}

/* Rendimento por piloto */

.rendimento-grafico-wrap {
  background: var(--bg-card);
  border-radius: 10px;
  box-shadow: var(--sombra);
  padding: 1rem;
  margin-bottom: 1rem;
}

.rendimento-grafico-titulo {
  margin: 0 0 0.6rem;
  font-size: 0.95rem;
}

/* Altura só como fallback: renderGraficoRendimento ajusta conforme o nº de pilotos. */
.rendimento-grafico-canvas {
  position: relative;
  height: 420px;
}

/* Com o filtro de jogador a tabela ganha uma coluna a mais — rola lateralmente
   em telas pequenas, mesmo padrão das outras tabelas largas do site. */
.rendimento-tabela-wrap {
  overflow-x: auto;
}

.rendimento-tabela {
  min-width: 34rem;
}

.rendimento-pos {
  color: var(--texto-fraco);
  width: 2rem;
}

.rendimento-media {
  font-weight: 600;
  white-space: nowrap;
}

/* Pilotos (violino da posição real no quali) */

.pilotos-titulo {
  margin: 0 0 0.8rem;
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--texto-fraco);
}

.pilotos-container {
  position: relative;
  background: var(--bg-card);
  border-radius: 10px;
  box-shadow: var(--sombra);
  padding: 0.8rem;
}

.pilotos-scroll {
  overflow-x: auto;
}

.pilotos-svg {
  display: block;
}

/* Popup de contagem por posição — mesmo visual dos tooltips dos gráficos. */
.pilotos-tooltip {
  position: absolute;
  z-index: 20;
  pointer-events: none;
  background: rgba(0, 0, 0, 0.82);
  color: #fff;
  border-radius: 6px;
  padding: 0.5rem 0.6rem;
  font-size: 0.7rem;
  line-height: 1.35;
  min-width: 9rem;
  max-width: 14rem;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.35);
}

.pilotos-tooltip__titulo {
  font-weight: 700;
  font-size: 0.78rem;
}

.pilotos-tooltip__sub {
  color: rgba(255, 255, 255, 0.7);
  margin-bottom: 0.35rem;
}

.pilotos-tooltip__linha {
  display: flex;
  align-items: center;
  gap: 0.35rem;
}

.pilotos-tooltip__pos {
  width: 1.9rem;
  color: rgba(255, 255, 255, 0.85);
  font-variant-numeric: tabular-nums;
}

.pilotos-tooltip__barra-wrap {
  flex: 1;
  height: 0.5rem;
  background: rgba(255, 255, 255, 0.12);
  border-radius: 2px;
  overflow: hidden;
}

.pilotos-tooltip__barra {
  display: block;
  height: 100%;
  border-radius: 2px;
}

.pilotos-tooltip__n {
  width: 1rem;
  text-align: right;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

/* Hall of Fame */

.hall-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
}

.hall-coluna h2 {
  margin: 0 0 0.6rem;
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--texto-fraco);
}

.hall-ranking-tabela {
  width: 100%;
  border-collapse: collapse;
  background: var(--bg-card);
  border-radius: 10px;
  overflow: hidden;
  box-shadow: var(--sombra);
}

.hall-ranking-tabela th, .hall-ranking-tabela td {
  padding: 0.6rem 0.7rem;
  text-align: left;
  border-bottom: 1px solid var(--borda);
  font-size: 0.9rem;
}

.hall-ranking-tabela th {
  color: var(--texto-fraco);
  font-weight: 600;
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.hall-ranking-tabela tbody tr:last-child td {
  border-bottom: none;
}

/* Jogadores sem nenhuma medalha: fundo só um tom mais escuro, bem sutil. */
.hall-ranking-tabela tbody tr.hall-linha--sem-medalha {
  background: rgba(0, 0, 0, 0.03);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .hall-ranking-tabela tbody tr.hall-linha--sem-medalha {
    background: rgba(0, 0, 0, 0.14);
  }
}
:root[data-theme="dark"] .hall-ranking-tabela tbody tr.hall-linha--sem-medalha {
  background: rgba(0, 0, 0, 0.14);
}

.hall-ranking-tabela td.num, .hall-ranking-tabela th.num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

/* A tabela ganhou colunas; rola na horizontal em telas estreitas. */
.hall-ranking-wrap {
  overflow-x: auto;
  border-radius: 10px;
}
.hall-ranking-tabela th { white-space: nowrap; }
.hall-ranking-tabela td.hall-acessar-cel {
  text-align: right;
  white-space: nowrap;
}
.hall-ranking-tabela .hall-acessar { margin-left: 0; }

/* Pop-up do Hall of Fame — mesmo visual dos tooltips dos gráficos / da aba
   Pilotos (fundo escuro translúcido, texto claro). */
.hall-tem-dica { cursor: help; outline: none; }
.hall-tem-dica:focus-visible { box-shadow: inset 0 0 0 2px var(--acento); }
.hall-dica {
  position: absolute;
  z-index: 100;
  pointer-events: none;
  background: rgba(0, 0, 0, 0.85);
  color: #fff;
  border-radius: 6px;
  padding: 0.5rem 0.65rem;
  font-size: 0.72rem;
  line-height: 1.45;
  max-width: 16rem;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.35);
}
.hall-dica__titulo { font-weight: 700; font-size: 0.78rem; margin-bottom: 0.2rem; }
.hall-dica__linha {
  color: rgba(255, 255, 255, 0.82);
  font-variant-numeric: tabular-nums;
  white-space: pre;
}

/* Destaque das medalhas — "grifo": barrinha na cor da medalha embaixo do
   número, igual no cabeçalho e nas células de quem ganhou (valor > 0). Quem
   tem 0 fica esmaecido. */
.hall-ranking-tabela th.hall-med,
.hall-ranking-tabela td.hall-med {
  position: relative;
  font-weight: 700;
}
.hall-ranking-tabela th.hall-med { color: var(--texto); }
.hall-ranking-tabela td.hall-med0 { color: var(--texto-fraco); }
.hall-ranking-tabela .hall-med::after {
  content: "";
  position: absolute;
  left: 0.5rem;
  right: 0.5rem;
  bottom: 5px;
  height: 3px;
  border-radius: 2px;
  pointer-events: none;
}
.hall-ranking-tabela .hall-med--ouro::after { background: #d8b24a; }
.hall-ranking-tabela .hall-med--prata::after { background: #aab0bb; }
.hall-ranking-tabela .hall-med--bronze::after { background: #c8824a; }

/* Switch Jogadores / Temporadas (mesmo estilo do switch de Rendimento). */
.hall-switch { margin-top: 0.2rem; }

.hall-ano-item__jogadores {
  white-space: nowrap;
  color: var(--texto-fraco);
  font-size: 0.8rem;
  margin-left: auto;
}
.hall-ano-item__jogadores + .hall-acessar { margin-left: 0.6rem; }

.hall-ano-item__andamento { color: var(--texto-fraco); font-style: italic; }

.hall-ano-item__progresso {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  margin-left: auto;
  white-space: nowrap;
  color: var(--texto-fraco);
  font-size: 0.8rem;
  font-variant-numeric: tabular-nums;
}
.hall-ano-item__progresso + .hall-ano-item__jogadores { margin-left: 0.6rem; }

.hall-progresso-barra {
  display: inline-block;
  width: 3.2rem;
  height: 6px;
  border-radius: 3px;
  background: var(--ok0-bg);
  overflow: hidden;
}
.hall-progresso-barra__cheio {
  display: block;
  height: 100%;
  background: var(--acento);
}

.hall-anos-lista {
  list-style: none;
  margin: 0;
  padding: 0;
  background: var(--bg-card);
  border-radius: 10px;
  box-shadow: var(--sombra);
  overflow: hidden;
}

.hall-ano-item {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.6rem;
  padding: 0.6rem 0.8rem;
  border-bottom: 1px solid var(--borda);
  font-size: 0.88rem;
}

.hall-ano-item:last-child {
  border-bottom: none;
}

.hall-ano-item__ano {
  font-weight: 700;
  min-width: 3rem;
}

.hall-ano-item__medalha {
  white-space: nowrap;
}

@media (max-width: 480px) {
  .hall-grid { grid-template-columns: 1fr; gap: 0.8rem; }
}

@media (max-width: 480px) {
  main { padding: 0.6rem; }
  .top6-tabela th, .top6-tabela td { padding: 0.25rem 0.3rem; font-size: 0.85rem; }
  .hist-matriz th, .hist-matriz td { padding: 0.35rem 0.4rem; }
  .hist-cel__linha { flex-wrap: wrap; }
}

/* ---------- Modo histórico (temporadas anteriores) ---------- */
[hidden] { display: none !important; }

.hist-badge {
  display: inline-block;
  margin-left: 0.5rem;
  padding: 0.12rem 0.5rem;
  border-radius: 999px;
  background: var(--acento);
  color: #fff;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  vertical-align: middle;
}

.hist-voltar {
  flex-shrink: 0;
  text-decoration: none;
  border: 1px solid var(--borda);
  border-radius: 999px;
  background: var(--bg-card);
  color: var(--texto);
  font: inherit;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.32rem 0.7rem;
  cursor: pointer;
}
.hist-voltar:hover { border-color: var(--acento); color: var(--acento); }

.hist-avisos {
  margin: 0.6rem;
  padding: 0.6rem 0.8rem;
  border: 1px solid var(--borda);
  border-left: 3px solid var(--acento);
  border-radius: 6px;
  background: var(--bg-card);
  font-size: 0.85rem;
  color: var(--texto-fraco);
}
.hist-avisos strong { color: var(--texto); }
.hist-avisos ul { margin: 0.3rem 0 0; padding-left: 1.1rem; }

.hall-acessar {
  margin-left: auto;
  align-self: center;
  padding: 0.2rem 0.7rem;
  border: 1px solid var(--acento);
  border-radius: 999px;
  color: var(--acento);
  text-decoration: none;
  font-size: 0.75rem;
  font-weight: 600;
  white-space: nowrap;
}
.hall-acessar:hover { background: var(--acento); color: #fff; }
.hall-acessar--ativa {
  border-color: var(--borda);
  color: var(--texto-fraco);
  cursor: default;
}
.hall-acessar--ativa:hover { background: transparent; color: var(--texto-fraco); }


/* ---------- Página do jogador (histórico entre temporadas) ---------- */
.jogador-hist-card { flex: 1 1 220px; }
.jogador-hist-card__valor {
  font-size: 1.8rem;
  font-weight: 800;
  line-height: 1.1;
  margin-top: 0.1rem;
}
.jogador-hist-card .corrida-card__extra { font-size: 0.85rem; margin-top: 0.15rem; }

.jogador-hist-card--linha {
  display: flex;
  align-items: center;
  gap: 0.7rem;
}
.jogador-hist-card--linha .jogador-hist-card__valor { margin-top: 0; }
.jogador-hist-card--linha .jogador-medalhas {
  flex: 1;
  justify-content: space-around;
}
.jogador-medalhas {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}
.jogador-medalhas__item {
  display: inline-flex;
  align-items: center;
  gap: 0.2rem;
  font-size: 1.05rem;
  white-space: nowrap;
}
.jogador-medalhas__item strong {
  font-size: 1.1rem;
  font-variant-numeric: tabular-nums;
}

.jogador-destaque { border-left: 3px solid var(--borda); }
.jogador-destaque--trunfo { border-left-color: var(--ok2, #1e9e5a); }
.jogador-destaque--decepcao { border-left-color: var(--acento); }
.jogador-destaque .jogador-hist-card__valor { font-size: 1.35rem; }
.jogador-destaques { margin-top: 0.9rem; }

#jogador-container .temporada-grafico-wrap { margin-top: 1.2rem; }
#jogador-container .secao-intro { margin-top: 1.6rem; }

#piloto-container .temporada-grafico-wrap { margin-top: 1.2rem; }
#piloto-container .secao-intro { margin-top: 1.6rem; }
#piloto-container .rendimento-grafico-wrap { margin-top: 1.2rem; }
#piloto-container .rendimento-tabela-wrap { margin-top: 0.8rem; }

.jogador-pilotos-tabela__linha { cursor: pointer; }
.jogador-pilotos-tabela__linha:hover td { background: var(--bg); }
.jogador-pilotos-tabela__linha:focus-visible { outline: 2px solid var(--acento); outline-offset: -2px; }
.jogador-pilotos-tabela__ver { color: var(--acento); font-size: 0.78rem; font-weight: 600; white-space: nowrap; }

.jogador-modal {
  border: 1px solid var(--borda);
  border-radius: 12px;
  padding: 0;
  background: var(--bg-card);
  color: var(--texto);
  max-width: 440px;
  width: calc(100% - 2rem);
  box-shadow: var(--sombra);
}
.jogador-modal::backdrop { background: rgba(0, 0, 0, 0.45); }
.jogador-modal__corpo { padding: 1rem 1.1rem 1.2rem; }
.jogador-modal__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.6rem;
  margin-bottom: 0.8rem;
}
.jogador-modal__header h3 {
  margin: 0;
  font-size: 1rem;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.3rem;
}
.jogador-modal__fechar {
  flex-shrink: 0;
  border: 1px solid var(--borda);
  border-radius: 999px;
  background: var(--bg);
  color: var(--texto);
  font: inherit;
  line-height: 1;
  padding: 0.25rem 0.5rem;
  cursor: pointer;
}
.jogador-modal__fechar:hover { border-color: var(--acento); color: var(--acento); }

.ranking-dif { color: var(--texto-fraco); font-size: 0.82em; }

/* Sub-aba Regras (temporadas passadas) */
.regras-conteudo { max-width: 760px; }
.regras-bloco {
  margin: 0 0 1.1rem;
  padding: 0.9rem 1rem;
  background: var(--bg-card);
  border: 1px solid var(--borda);
  border-radius: 10px;
}
.regras-bloco h3 { margin: 0 0 0.5rem; font-size: 1rem; }
.regras-bloco ul { margin: 0.3rem 0 0; padding-left: 1.1rem; }
.regras-bloco li { margin: 0.25rem 0; }
.regras-bloco p { margin: 0.3rem 0; }

.regras-esquema {
  margin-top: 0.8rem;
  padding: 0.7rem 0.8rem;
  background: var(--bg);
  border: 1px solid var(--borda);
  border-radius: 8px;
}
.regras-esquema__intro { margin: 0.5rem 0 0.4rem; font-size: 0.9rem; }
.regras-esquema__intro:first-child { margin-top: 0; }
.regras-esquema__linha {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.28rem 0;
  font-size: 0.9rem;
}
.regras-esquema__texto { flex: 1; color: var(--texto-fraco); }

.hist-jogadores-acoes {
  display: flex;
  gap: 0.5rem;
  margin: 0.5rem 0 0.2rem;
}
.hist-jogadores-acoes button {
  border: 1px solid var(--borda);
  background: var(--bg-card);
  color: var(--texto-fraco);
  border-radius: 999px;
  padding: 0.2rem 0.7rem;
  font-size: 0.76rem;
  font-weight: 600;
  cursor: pointer;
}
.hist-jogadores-acoes button:hover { border-color: var(--acento); color: var(--acento); }

.hist-matriz__vazio-aviso {
  padding: 1rem;
  color: var(--texto-fraco);
  font-size: 0.9rem;
}
.ranking-nota-calculada {
  margin: 0.5rem 0 0;
  font-size: 0.8rem;
  color: var(--texto-fraco);
}

.hist-matriz__sem-registro { opacity: 0.55; }
.hist-matriz__rnota {
  display: block;
  font-size: 0.62rem;
  font-weight: 400;
  color: var(--texto-fraco);
  font-style: italic;
}

/* ---------- Menu (?menu) ---------- */
.menu-busca {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.7rem;
}
.menu-busca .ir-para-botao { flex: 1; }

/* ---------- Páginas de análise (?jogadores, ?pilotos) ---------- */
.analise-filtros {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.6rem;
  margin-bottom: 1rem;
}
.analise-anos { flex-wrap: wrap; }
.analise-filtro-select { margin-bottom: 0; flex: 1; min-width: 10rem; }
.analise-grafico { height: 340px; }

.analise-tabela { min-width: 46rem; }
.analise-tabela td { white-space: nowrap; }
.analise-th { cursor: pointer; user-select: none; white-space: nowrap; }
.analise-th:hover, .analise-th--ativa { color: var(--acento); }
.analise-linha { cursor: pointer; }
.analise-linha:hover td { background: var(--bg); }

.analise-comparar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.6rem;
  height: 1.6rem;
  border: 1px solid var(--borda);
  border-radius: 50%;
  background: var(--bg-card);
  cursor: pointer;
  padding: 0;
}
.analise-comparar[aria-pressed="true"] {
  border-color: var(--cor-chip);
  box-shadow: inset 0 0 0 1px var(--cor-chip);
}
.analise-comparar:not([aria-pressed="true"]) .rendimento-chip__ponto { opacity: 0.25; }
.analise-nota { margin: 0.6rem 0 0; font-size: 0.74rem; color: var(--texto-fraco); line-height: 1.4; }
.analise-jogador {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  color: var(--texto);
  font-weight: 600;
  text-decoration: none;
}
a.analise-jogador:hover { color: var(--acento); }
.analise-matriz { min-width: 36rem; }
.analise-matriz__cel { background: color-mix(in srgb, var(--acento) var(--intensidade), transparent); }
.analise-piloto-link { color: inherit; text-decoration: none; }
.analise-piloto-link:hover { color: var(--acento); text-decoration: underline; }
/* Links das tabelas da temporada para os perfis (?jogador / ?piloto). */
.link-perfil { color: inherit; text-decoration: none; }
.link-perfil:hover, .link-perfil:focus-visible { color: var(--acento); text-decoration: underline; }
.link-perfil-svg { cursor: pointer; }
.link-perfil-svg:hover text, .link-perfil-svg:focus-visible text { fill: var(--acento); text-decoration: underline; }