@charset "UTF-8";

/* Históricos — alinhamento com a identidade visual dos rankings. */
body.body--logs #main-content .rankings-hero__tabs {
  display: grid;
  grid-template-columns: repeat(4, minmax(11rem, 16rem));
  justify-content: center;
  gap: .8rem;
  width: min(100%, 72rem);
  max-width: 72rem;
  padding: .7rem 0;
}

/* Mantém o conteúdo interno proporcional à moldura, inclusive nos rótulos longos. */
body.body--logs #main-content .rankings-hero__tab {
  gap: .55rem !important;
  padding-inline: 1rem !important;
  font-size: clamp(.78rem, .88vw, .92rem) !important;
  letter-spacing: .045em !important;
  white-space: nowrap !important;
}

body.body--logs #main-content .rankings-hero__tab .rankings-hero__tab-icon {
  width: 2.05rem !important;
  height: 2.05rem !important;
  flex-basis: 2.05rem !important;
}

body.body--logs .rankings-table-panel {
  border-color: rgba(211, 153, 43, .4) !important;
  background: rgba(6, 7, 8, .94) !important;
}

body.body--logs .rankings-table .rb-thead th {
  color: #ebc264 !important;
  background: linear-gradient(180deg, rgba(79,48,18,.82), rgba(39,27,15,.86)) !important;
}

body.body--logs .rankings-table tbody tr:nth-child(even) td {
  background: rgba(20, 21, 22, .95) !important;
}

body.body--logs .rankings-table tbody tr:hover td {
  background: linear-gradient(90deg, rgba(73,47,18,.58), rgba(19,18,16,.98)) !important;
}

@media (max-width: 900px) {
  body.body--logs #main-content .rankings-hero__tabs {
    display: flex;
    justify-content: flex-start;
    width: 100%;
    overflow-x: auto;
    padding: .5rem 0;
    scrollbar-width: thin;
    -webkit-overflow-scrolling: touch;
  }
}