.bracket-modal {
  display: flex;
  flex-direction: column;
  width: min(1480px, calc(100vw - 24px));
  max-height: calc(100vh - 24px);
}

.bracket-columns {
  grid-template-columns: repeat(5, minmax(150px, 1fr));
  align-items: stretch;
  min-height: 0;
  overflow: auto;
  flex: 1 1 auto;
}

.bracket-columns > div {
  counter-reset: bracket-game;
  align-content: space-around;
  gap: 7px;
  min-width: 0;
  min-height: max-content;
}

.bracket-columns span {
  min-width: 0;
  padding: 8px 5px;
}

.bracket-match {
  counter-increment: bracket-game;
  grid-template-columns: minmax(0, 1fr) 14px minmax(0, 1fr);
  align-items: center;
  gap: 3px;
  display: grid;
  text-align: center;
  position: relative;
  padding-top: 22px !important;
}

.bracket-match::after {
  content: "JOGO " counter(bracket-game);
  position: absolute;
  top: 4px;
  left: 7px;
  color: #159d3c;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .3px;
}

.bracket-side {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}

.bracket-side img {
  width: 24px;
  height: 24px;
  object-fit: contain;
}

.bracket-side b {
  min-width: 0;
  font-size: 10px;
  text-align: center;
  overflow-wrap: anywhere;
}

.bracket-score {
  color: #087a36;
  font-size: 15px;
  line-height: 1;
  font-weight: 900;
}

body.theme-black .bracket-columns span {
  color: #dbeaf8;
  background: #132f4f;
  border-color: #426789;
}

body.theme-black .bracket-columns b {
  color: #e4f1fb;
}

body.theme-black .bracket-score {
  color: #6be58e;
}

body.theme-black .bracket-match::after {
  color: #65df8b;
}

@media (max-width: 1000px) {
  .bracket-columns {
    grid-template-columns: repeat(3, minmax(175px, 1fr));
  }
}

@media (max-width: 680px) {
  .bracket-modal {
    width: calc(100vw - 16px);
    max-height: calc(100vh - 16px);
  }

  .bracket-columns {
    grid-template-columns: repeat(2, minmax(165px, 1fr));
    gap: 8px;
    padding: 10px;
  }
}

@media (max-width: 390px) {
  .bracket-columns {
    grid-template-columns: minmax(0, 1fr);
  }
}
