/* Final create-match layout guard. Loaded after styles.css to beat legacy banner rules. */
#matchesOverlay.settings-overlay {
  position: fixed !important;
  inset: 0 !important;
  z-index: 50000 !important;
  width: 100vw !important;
  height: 100dvh !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #0f151d !important;
  backdrop-filter: none !important;
  overflow: hidden !important;
  pointer-events: auto !important;
}

#matchesOverlay.settings-overlay[aria-hidden="true"] {
  display: none !important;
}

#matchesOverlay.settings-overlay.open,
#matchesOverlay.settings-overlay[aria-hidden="false"] {
  display: block !important;
}

#matchesOverlay .players-panel.match-panel {
  position: relative !important;
  width: 100vw !important;
  height: 100dvh !important;
  max-width: none !important;
  max-height: none !important;
  min-height: 100dvh !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #111821 !important;
  box-shadow: none !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  padding: clamp(18px, 2.1vw, 34px) !important;
}

#matchesOverlay .players-panel.match-panel .players-head {
  position: sticky !important;
  top: 0 !important;
  z-index: 6 !important;
  margin: calc(clamp(18px, 2.1vw, 34px) * -1) calc(clamp(18px, 2.1vw, 34px) * -1) 18px !important;
  padding: clamp(16px, 1.8vw, 26px) clamp(18px, 2.1vw, 34px) !important;
  background: #111821 !important;
  border-bottom: 1px solid rgba(127, 199, 255, 0.11) !important;
}

#matchesOverlay .players-panel.match-panel .match-tabs,
#matchesOverlay .players-panel.match-panel .match-pane {
  max-width: 1680px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

#matchCreateForm.match-create-form .match-system-field,
#matchCreateForm.match-create-form label:has(#matchTypeSelect),
#matchCreateForm.match-create-form label:has(#matchModeSelect),
#matchCreateForm.match-create-form label:has(#matchMapSelect) {
  display: none !important;
}

#matchCreateForm #matchCreateModeCards.match-create-mode-cards {
  grid-column: 1 / -1 !important;
  display: grid !important;
  grid-template-columns: repeat(7, minmax(112px, 1fr)) !important;
  gap: 10px !important;
  align-items: stretch !important;
  padding: 12px !important;
  border: 1px solid rgba(127, 199, 255, 0.13) !important;
  border-radius: 8px !important;
  background: #141d28 !important;
}

#matchCreateForm #matchCreateModeCards.match-create-mode-cards > button.match-mode-card,
#matchCreateForm #matchCreateModeCards.match-create-mode-cards > .match-mode-card {
  grid-column: auto !important;
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  flex: 0 1 auto !important;
  display: grid !important;
  grid-template-rows: 74px auto !important;
  gap: 8px !important;
  min-height: 126px !important;
  padding: 8px !important;
  border-radius: 8px !important;
}

#matchCreateForm #matchCreateModeCards.match-create-mode-cards > .match-mode-card > img {
  width: 100% !important;
  height: 74px !important;
  max-height: 74px !important;
  object-fit: contain !important;
  object-position: center !important;
}

#matchCreateForm #matchCreateModeCards.match-create-mode-cards > .match-mode-card > .match-mode-card-body {
  align-self: end !important;
  min-width: 0 !important;
  padding: 0 2px !important;
}

#matchCreateForm.match-create-form label:first-child {
  grid-column: 1 / -1 !important;
}

#matchCreateForm.match-create-form label:has(#matchTeamSizeSelect),
#matchCreateForm.match-create-form label:has(#matchFragLimitInput),
#matchCreateForm.match-create-form label:has(#matchPasswordInput),
#matchCreateForm.match-create-form .match-bots-toggle,
#matchCreateForm.match-create-form .match-observer-toggle,
#matchCreateForm.match-create-form .match-paid-toggle,
#matchCreateForm.match-create-form .match-organizer-toggle {
  grid-column: span 4 !important;
}

@media (max-width: 980px) {
  #matchCreateForm #matchCreateModeCards.match-create-mode-cards {
    grid-template-columns: repeat(4, minmax(112px, 1fr)) !important;
  }

  #matchCreateForm.match-create-form label:has(#matchTeamSizeSelect),
  #matchCreateForm.match-create-form label:has(#matchFragLimitInput),
  #matchCreateForm.match-create-form label:has(#matchPasswordInput),
  #matchCreateForm.match-create-form .match-bots-toggle,
  #matchCreateForm.match-create-form .match-observer-toggle,
  #matchCreateForm.match-create-form .match-paid-toggle,
  #matchCreateForm.match-create-form .match-organizer-toggle {
    grid-column: span 6 !important;
  }
}

@media (max-width: 680px) {
  #matchCreateForm #matchCreateModeCards.match-create-mode-cards {
    grid-template-columns: repeat(2, minmax(112px, 1fr)) !important;
  }

  #matchCreateForm.match-create-form label:has(#matchTeamSizeSelect),
  #matchCreateForm.match-create-form label:has(#matchFragLimitInput),
  #matchCreateForm.match-create-form label:has(#matchPasswordInput),
  #matchCreateForm.match-create-form .match-bots-toggle,
  #matchCreateForm.match-create-form .match-observer-toggle,
  #matchCreateForm.match-create-form .match-paid-toggle,
  #matchCreateForm.match-create-form .match-organizer-toggle {
    grid-column: 1 / -1 !important;
  }
}
/* Play Game page: keep finder and creator at the same working width. */
#matchesOverlay .players-panel.match-panel {
  --match-surface-width: min(1120px, calc(100vw - 96px));
}

#matchesOverlay .players-panel.match-panel > .match-tabs {
  width: var(--match-surface-width) !important;
  max-width: var(--match-surface-width) !important;
  margin: 28px auto 18px !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 14px !important;
  align-items: center !important;
}

#matchesOverlay .players-panel.match-panel > .match-tabs > button {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 56px !important;
  padding: 0 24px !important;
  border-radius: 8px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

#matchesOverlay .players-panel.match-panel > #matchFindPane,
#matchesOverlay .players-panel.match-panel > #matchCreateForm {
  width: var(--match-surface-width) !important;
  max-width: var(--match-surface-width) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

#matchesOverlay .players-panel.match-panel > #matchFindPane .match-browser,
#matchesOverlay .players-panel.match-panel > #matchFindPane .match-browser-header,
#matchesOverlay .players-panel.match-panel > #matchFindPane .match-browser-tabs,
#matchesOverlay .players-panel.match-panel > #matchFindPane .match-browser-section,
#matchesOverlay .players-panel.match-panel > #matchFindPane .match-browser-content,
#matchesOverlay .players-panel.match-panel > #matchFindPane .matches-list,
#matchesOverlay .players-panel.match-panel > #matchFindPane .match-lobbies-list,
#matchesOverlay .players-panel.match-panel > #matchFindPane .match-queues-list {
  width: 100% !important;
  max-width: none !important;
  box-sizing: border-box !important;
}

#matchesOverlay .players-panel.match-panel > #matchFindPane .match-lobby-card,
#matchesOverlay .players-panel.match-panel > #matchFindPane .match-queue-card {
  width: 100% !important;
  max-width: none !important;
  box-sizing: border-box !important;
}

@media (max-width: 720px) {
  #matchesOverlay .players-panel.match-panel {
    --match-surface-width: calc(100vw - 24px);
  }

  #matchesOverlay .players-panel.match-panel > .match-tabs {
    margin-top: 18px !important;
    gap: 10px !important;
  }

  #matchesOverlay .players-panel.match-panel > .match-tabs > button {
    min-height: 52px !important;
    padding: 0 14px !important;
  }
}

/* Final Play Game layout pass: the finder and creator share the same width. */
#matchesOverlay .players-panel.match-panel {
  --match-surface-width: min(1120px, calc(100vw - 96px));
}

#matchesOverlay .players-panel.match-panel > .match-tabs {
  width: var(--match-surface-width) !important;
  max-width: var(--match-surface-width) !important;
  margin: 28px auto 18px !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 14px !important;
  align-items: stretch !important;
}

#matchesOverlay .players-panel.match-panel > .match-tabs .match-tab,
#matchesOverlay .players-panel.match-panel > .match-tabs > button {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 56px !important;
  padding: 0 24px !important;
  border-radius: 8px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

#matchesOverlay .players-panel.match-panel > #matchFindPane,
#matchesOverlay .players-panel.match-panel > #matchCreateForm,
#matchesOverlay .players-panel.match-panel .match-create-form,
#matchesOverlay .players-panel.match-panel .match-browser-head,
#matchesOverlay .players-panel.match-panel .match-browser-section {
  width: var(--match-surface-width) !important;
  max-width: var(--match-surface-width) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

#matchesOverlay .players-panel.match-panel .match-browser-tabs,
#matchesOverlay .players-panel.match-panel .match-browser-content,
#matchesOverlay .players-panel.match-panel .matches-list,
#matchesOverlay .players-panel.match-panel .match-lobbies-list,
#matchesOverlay .players-panel.match-panel .match-queues-list,
#matchesOverlay .players-panel.match-panel .match-lobby-card,
#matchesOverlay .players-panel.match-panel .match-queue-card {
  width: 100% !important;
  max-width: none !important;
  box-sizing: border-box !important;
}

@media (max-width: 720px) {
  #matchesOverlay .players-panel.match-panel {
    --match-surface-width: calc(100vw - 24px);
  }

  #matchesOverlay .players-panel.match-panel > .match-tabs {
    margin-top: 18px !important;
    gap: 10px !important;
  }

  #matchesOverlay .players-panel.match-panel > .match-tabs .match-tab,
  #matchesOverlay .players-panel.match-panel > .match-tabs > button {
    min-height: 52px !important;
    padding: 0 14px !important;
  }
}

/* Play Game EOF guard: keep inner finder sections inside the shared surface. */
#matchesOverlay .players-panel.match-panel > #matchFindPane {
  padding: 0 !important;
}

#matchesOverlay .match-browser-head,
#matchesOverlay .match-lobby-head {
  min-width: 0 !important;
}

#matchesOverlay .match-browser-head > div,
#matchesOverlay .match-lobby-head > div {
  min-width: 0 !important;
}

#matchesOverlay .players-panel.match-panel .match-browser-head,
#matchesOverlay .players-panel.match-panel .match-lobby-head,
#matchesOverlay .players-panel.match-panel .match-filter-tabs,
#matchesOverlay .players-panel.match-panel .match-list-pane,
#matchesOverlay .players-panel.match-panel .match-lobby-list,
#matchesOverlay .players-panel.match-panel .matches-list {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  box-sizing: border-box !important;
}

#matchesOverlay .match-browser-actions {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  flex: 0 0 auto;
}

#matchesOverlay .match-server-count {
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  padding: 0 12px;
  border: 1px solid rgba(127, 199, 255, 0.16);
  border-radius: 8px;
  color: #c8d7e4;
  background: rgba(8, 18, 27, 0.55);
  font-size: 11px;
  font-weight: 900;
  white-space: nowrap;
}

#matchesOverlay #refreshLobbyButton {
  display: none !important;
}

@media (max-width: 720px) {
  #matchesOverlay .match-browser-head,
  #matchesOverlay .match-lobby-head {
    align-items: stretch !important;
    flex-direction: column !important;
  }

  #matchesOverlay .match-browser-actions {
    justify-content: stretch;
  }

  #matchesOverlay .match-browser-actions > button,
  #matchesOverlay .match-server-count {
    flex: 1 1 0;
  }
}

/* Play Game structure fix: no header band, one aligned working column. */
#matchesOverlay .players-panel.match-panel {
  --match-surface-width: min(1060px, calc(100vw - 96px));
  display: block !important;
  padding-top: clamp(24px, 4vh, 54px) !important;
}

#matchesOverlay .players-panel.match-panel .players-head {
  display: none !important;
}

#matchesOverlay .match-top-row,
#matchesOverlay .players-panel.match-panel > #matchFindPane,
#matchesOverlay .players-panel.match-panel > #matchCreateForm {
  width: var(--match-surface-width) !important;
  max-width: var(--match-surface-width) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

#matchesOverlay .match-top-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 14px !important;
  margin-top: 0 !important;
  margin-bottom: 14px !important;
}

#matchesOverlay .match-top-row #matchesTitle {
  display: none !important;
}

#matchesOverlay .match-top-row .match-tabs {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 14px !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

#matchesOverlay .match-top-row .match-tabs > button {
  min-width: 0 !important;
  min-height: 46px !important;
  width: 100% !important;
  padding: 0 20px !important;
  border-radius: 8px !important;
}

#matchesOverlay .match-top-row #closeMatchesButton {
  min-width: 86px !important;
  min-height: 46px !important;
  padding: 0 18px !important;
  border: 1px solid rgba(127, 199, 255, 0.2) !important;
  border-radius: 8px !important;
  color: #f3fbff !important;
  background: #1d2736 !important;
}

#matchesOverlay .players-panel.match-panel > .match-pane:not(.active) {
  display: none !important;
}

#matchesOverlay .players-panel.match-panel > #matchFindPane.active {
  display: grid !important;
  grid-template-rows: auto auto minmax(0, auto) !important;
  gap: 14px !important;
  padding: 0 !important;
}

#matchesOverlay .match-browser-head,
#matchesOverlay .match-filter-tabs,
#matchesOverlay .match-lobby-head,
#matchesOverlay .match-lobby-list,
#matchesOverlay .matches-list {
  margin: 0 !important;
}

#matchesOverlay .match-browser-head {
  min-height: 58px !important;
  padding: 12px 14px !important;
}

#matchesOverlay .match-filter-tabs {
  gap: 10px !important;
}

#matchesOverlay .match-lobby-head {
  min-height: 64px !important;
  padding: 14px !important;
}

@media (max-width: 720px) {
  #matchesOverlay .players-panel.match-panel {
    --match-surface-width: calc(100vw - 24px);
    padding-top: 18px !important;
  }

  #matchesOverlay .match-top-row {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  #matchesOverlay .match-top-row #closeMatchesButton {
    width: 100% !important;
  }
}

/* Play Game width contract: Find and Create must share one exact column. */
#matchesOverlay .players-panel.match-panel {
  --match-surface-width: min(1060px, calc(100vw - 96px));
  overflow-y: scroll !important;
  scrollbar-gutter: stable !important;
}

#matchesOverlay .match-top-row,
#matchesOverlay .players-panel.match-panel > #matchFindPane,
#matchesOverlay .players-panel.match-panel > #matchCreateForm.match-create-form {
  width: var(--match-surface-width) !important;
  min-width: 0 !important;
  max-width: var(--match-surface-width) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

#matchesOverlay .players-panel.match-panel > #matchCreateForm.match-create-form.match-pane.active {
  grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
  padding: 0 !important;
  overflow-x: hidden !important;
}

#matchesOverlay .players-panel.match-panel > #matchFindPane.active {
  padding: 0 !important;
}

#matchesOverlay .players-panel.match-panel > #matchFindPane.active > *,
#matchesOverlay .players-panel.match-panel > #matchCreateForm.match-create-form.match-pane.active > * {
  max-width: 100% !important;
  box-sizing: border-box !important;
}

#matchesOverlay .players-panel.match-panel > #matchCreateForm.match-create-form.match-pane.active > label,
#matchesOverlay .players-panel.match-panel > #matchCreateForm.match-create-form.match-pane.active > div,
#matchesOverlay .players-panel.match-panel > #matchCreateForm.match-create-form.match-pane.active > button {
  min-width: 0 !important;
}

#matchesOverlay #matchCreateModeCards.match-create-mode-cards,
#matchesOverlay #matchCreateForm button[type="submit"],
#matchesOverlay #matchFindPane .match-browser-head,
#matchesOverlay #matchFindPane .match-filter-tabs,
#matchesOverlay #matchFindPane .match-list-pane,
#matchesOverlay #matchFindPane .match-lobby-list,
#matchesOverlay #matchFindPane .matches-list {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

#matchesOverlay .paid-match-unavailable-hint {
  grid-column: 1 / -1 !important;
  margin: -2px 0 0 !important;
  padding: 10px 12px !important;
  border: 1px solid rgba(255, 190, 100, 0.26) !important;
  border-radius: 8px !important;
  color: #ffd199 !important;
  background: rgba(80, 47, 12, 0.28) !important;
  font-size: 12px !important;
  font-weight: 850 !important;
  line-height: 1.35 !important;
}

@media (max-width: 720px) {
  #matchesOverlay .players-panel.match-panel {
    --match-surface-width: calc(100vw - 24px);
  }
}

/* Tournament page: align header buttons with the wide tournament layout. */
#matchesOverlay .players-panel.match-panel:has(#tournamentPane.active) {
  --match-surface-width: min(1580px, calc(100vw - 96px));
}

#matchesOverlay .players-panel.match-panel:has(#tournamentPane.active) .match-top-row,
#matchesOverlay .players-panel.match-panel:has(#tournamentPane.active) > #tournamentPane.active {
  width: var(--match-surface-width) !important;
  max-width: var(--match-surface-width) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

#matchesOverlay .players-panel.match-panel:has(#tournamentPane.active) .match-top-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 92px !important;
  align-items: center !important;
  gap: 14px !important;
}

#matchesOverlay .players-panel.match-panel:has(#tournamentPane.active) .match-top-row .match-tabs {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
  min-width: 0 !important;
}

#matchesOverlay .players-panel.match-panel:has(#tournamentPane.active) .match-top-row #closeMatchesButton {
  width: 92px !important;
  min-width: 92px !important;
}

/* Tournament create form: avoid the native white select popup for player count. */
#tournamentPane .tournament-choice-field {
  display: grid;
  gap: 9px;
  min-height: 82px;
  padding: 10px 12px;
  border: 1px solid rgba(127, 199, 255, 0.12);
  border-radius: 8px;
  background: #182231;
  box-sizing: border-box;
}

#tournamentPane .tournament-size-field {
  grid-template-rows: auto auto auto;
  min-height: 142px;
  overflow: visible;
}

#tournamentPane .tournament-choice-field > span {
  color: #94a8b7;
  font-size: 11px;
  font-weight: 950;
  line-height: 1;
  text-transform: uppercase;
}

#tournamentPane .tournament-size-options {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  min-width: 0;
  position: static;
}

#tournamentPane .tournament-size-control {
  min-width: 0;
}

#tournamentPane .tournament-size-control input {
  width: 100%;
  min-width: 0;
  height: 42px;
  padding: 0 12px;
  border: 1px solid rgba(127, 199, 255, 0.16);
  border-radius: 8px;
  color: #eaf6ff;
  background: #101a26;
  box-sizing: border-box;
  font-size: 18px;
  font-weight: 950;
  outline: none;
}

#tournamentPane .tournament-size-control input:focus {
  border-color: rgba(68, 255, 110, 0.42);
  box-shadow: 0 0 0 3px rgba(68, 255, 110, 0.12);
}

#tournamentPane .tournament-size-options button {
  width: 100%;
  min-width: 0;
  height: 40px;
  padding: 0 8px;
  border: 1px solid rgba(127, 199, 255, 0.14);
  border-radius: 8px;
  color: #9fb0be;
  background: #121c28;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
  font-size: 11px;
  font-weight: 950;
  line-height: 1.05;
  text-align: center;
  white-space: normal;
  cursor: pointer;
}

#tournamentPane .tournament-size-options button:hover {
  border-color: rgba(127, 199, 255, 0.28);
  color: #eaf6ff;
  background: #172638;
}

#tournamentPane .tournament-size-options button.active {
  border-color: rgba(68, 255, 110, 0.42);
  color: #ffffff;
  background: linear-gradient(180deg, #11b62c, #078d18);
  box-shadow: 0 10px 24px rgba(0, 153, 24, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.16);
}

#tournamentPane .tournament-organizer-toggle {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  min-height: 58px !important;
  padding: 0 12px !important;
  border: 1px solid rgba(127, 199, 255, 0.12) !important;
  border-radius: 8px !important;
  background: #182231 !important;
}

#tournamentPane .tournament-organizer-toggle > span {
  color: #94a8b7 !important;
  font-size: 11px !important;
  font-weight: 950 !important;
  line-height: 1.15 !important;
  text-transform: uppercase !important;
}

#tournamentPane .tournament-organizer-toggle:has(input:checked) {
  border-color: rgba(68, 255, 110, 0.36) !important;
  background: linear-gradient(135deg, rgba(0, 117, 255, 0.12), rgba(66, 190, 91, 0.18)), #182231 !important;
}

#tournamentPane .tournament-participant-chips span {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
}

#tournamentPane .tournament-participant-chips span b {
  min-width: 0 !important;
  overflow: hidden !important;
  font: inherit !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#tournamentPane .tournament-kick-button {
  display: inline-grid !important;
  flex: 0 0 20px !important;
  place-items: center !important;
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  padding: 0 !important;
  border: 1px solid rgba(255, 105, 105, 0.34) !important;
  border-radius: 6px !important;
  color: #ffe4e4 !important;
  background: linear-gradient(180deg, rgba(180, 48, 48, 0.76), rgba(105, 25, 25, 0.76)) !important;
  font-size: 15px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  cursor: pointer !important;
}

#tournamentPane .tournament-kick-button:hover {
  border-color: rgba(255, 145, 145, 0.58) !important;
  background: linear-gradient(180deg, rgba(206, 60, 60, 0.9), rgba(128, 31, 31, 0.9)) !important;
}

@media (max-width: 520px) {
  #tournamentPane .tournament-size-options {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Tournament wallet: reuse the APE match copy button style. */
#tournamentPane .tournament-wallet-card .paid-wallet-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 44px !important;
  gap: 8px !important;
}

#tournamentPane .tournament-wallet-card .paid-wallet-row code {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 40px !important;
  padding: 0 8px !important;
  overflow: hidden !important;
  border: 1px solid rgba(0, 136, 255, 0.26) !important;
  border-radius: 8px !important;
  color: #dfffea !important;
  background: rgba(2, 9, 18, 0.78) !important;
  font-family: "Arial Narrow", Arial, "Helvetica Neue", sans-serif !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  font-stretch: condensed !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-overflow: clip !important;
  white-space: nowrap !important;
}

#tournamentPane .tournament-wallet-card .paid-wallet-row code .wallet-address-text {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  overflow: visible !important;
  color: inherit !important;
  font-family: inherit !important;
  font-size: 9px !important;
  font-weight: 850 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

#tournamentPane .tournament-wallet-card .paid-wallet-row button {
  display: inline-grid !important;
  grid-template-columns: 1fr !important;
  align-items: center !important;
  justify-items: center !important;
  width: 44px !important;
  min-width: 44px !important;
  height: 40px !important;
  min-height: 40px !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 1px solid rgba(127, 199, 255, 0.2) !important;
  border-radius: 8px !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, rgba(127, 199, 255, 0.18), rgba(143, 220, 138, 0.12)) !important;
  box-shadow: 0 0 20px rgba(0, 110, 255, 0.16) !important;
  cursor: pointer !important;
}

#tournamentPane .tournament-wallet-card .paid-wallet-row button:hover {
  border-color: rgba(127, 199, 255, 0.32) !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, rgba(127, 199, 255, 0.24), rgba(143, 220, 138, 0.16)) !important;
  box-shadow: 0 0 22px rgba(0, 110, 255, 0.22) !important;
  transform: translateY(-1px);
}

#tournamentPane .tournament-wallet-card .paid-wallet-row button.copied {
  border-color: rgba(143, 220, 138, 0.74) !important;
  background: linear-gradient(180deg, rgba(55, 172, 84, 0.86), rgba(27, 113, 55, 0.82)) !important;
  box-shadow: 0 0 24px rgba(143, 220, 138, 0.24) !important;
}

#tournamentPane .tournament-wallet-card .paid-wallet-row .copy-icon {
  position: static !important;
  width: auto !important;
  height: auto !important;
  font-size: 17px !important;
  line-height: 1 !important;
}

#tournamentPane .tournament-wallet-card .paid-wallet-row .copy-icon::before,
#tournamentPane .tournament-wallet-card .paid-wallet-row .copy-icon::after {
  content: none !important;
}

/* Tournament bracket: football-style playoff grid with match connectors. */
#tournamentPane .tournament-bracket.football-bracket {
  display: grid !important;
  grid-auto-flow: column !important;
  grid-auto-columns: minmax(220px, 248px) !important;
  align-items: stretch !important;
  gap: 34px !important;
  min-height: 280px !important;
  padding: 4px 8px 14px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
}

#tournamentPane .tournament-bracket.football-bracket .tournament-round {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-around !important;
  gap: 16px !important;
  min-width: 0 !important;
}

#tournamentPane .tournament-bracket.football-bracket .tournament-round > strong {
  position: sticky !important;
  top: 0 !important;
  z-index: 2 !important;
  padding: 0 2px 4px !important;
  color: #dcecf8 !important;
  font-size: 11px !important;
  font-weight: 950 !important;
  text-transform: uppercase !important;
}

#tournamentPane .tournament-bracket.football-bracket .tournament-round.third-place {
  justify-content: flex-start !important;
  padding-top: 42px !important;
}

#tournamentPane .tournament-bracket.football-bracket .tournament-match {
  position: relative !important;
  display: grid !important;
  grid-template-rows: auto auto minmax(28px, auto) !important;
  gap: 0 !important;
  min-height: 116px !important;
  padding: 8px !important;
  border: 1px solid rgba(127, 199, 255, 0.16) !important;
  border-radius: 8px !important;
  background: linear-gradient(180deg, #142031 0%, #0e1723 100%) !important;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.035) !important;
}

#tournamentPane .tournament-bracket.football-bracket .tournament-round:not(.third-place):not(:last-child) .tournament-match::after {
  content: "" !important;
  position: absolute !important;
  right: -35px !important;
  top: 50% !important;
  width: 34px !important;
  height: 1px !important;
  background: linear-gradient(90deg, rgba(127, 199, 255, 0.36), rgba(68, 255, 110, 0.24)) !important;
}

#tournamentPane .tournament-bracket.football-bracket .tournament-round:not(:first-child):not(.third-place) .tournament-match::before {
  content: "" !important;
  position: absolute !important;
  left: -35px !important;
  top: 50% !important;
  width: 34px !important;
  height: 1px !important;
  background: linear-gradient(90deg, rgba(127, 199, 255, 0.18), rgba(127, 199, 255, 0.34)) !important;
}

#tournamentPane .tournament-bracket.football-bracket .tournament-match.active {
  border-color: rgba(245, 212, 96, 0.48) !important;
  background: linear-gradient(180deg, rgba(79, 62, 26, 0.72), #111b28 76%) !important;
}

#tournamentPane .tournament-bracket.football-bracket .tournament-match.completed,
#tournamentPane .tournament-bracket.football-bracket .tournament-match.bye {
  border-color: rgba(68, 255, 110, 0.3) !important;
}

#tournamentPane .tournament-player-slot {
  display: grid !important;
  grid-template-columns: 22px minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 7px !important;
  min-height: 32px !important;
  padding: 6px 7px !important;
  border: 1px solid rgba(127, 199, 255, 0.09) !important;
  background: rgba(7, 15, 24, 0.68) !important;
}

#tournamentPane .tournament-player-slot:first-child {
  border-radius: 7px 7px 0 0 !important;
}

#tournamentPane .tournament-player-slot:nth-child(2) {
  border-top: 0 !important;
  border-radius: 0 0 7px 7px !important;
}

#tournamentPane .tournament-player-slot i {
  display: inline-grid !important;
  place-items: center !important;
  width: 20px !important;
  height: 20px !important;
  border-radius: 5px !important;
  color: #9eb4c5 !important;
  background: rgba(127, 199, 255, 0.1) !important;
  font-size: 10px !important;
  font-style: normal !important;
  font-weight: 950 !important;
}

#tournamentPane .tournament-player-slot span {
  min-width: 0 !important;
  overflow: hidden !important;
  color: #d9e8f4 !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 1.1 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#tournamentPane .tournament-player-slot em {
  color: #708696 !important;
  font-size: 10px !important;
  font-style: normal !important;
  font-weight: 950 !important;
}

#tournamentPane .tournament-player-slot.empty span,
#tournamentPane .tournament-player-slot.empty em {
  color: #5d7180 !important;
}

#tournamentPane .tournament-player-slot.winner {
  border-color: rgba(68, 255, 110, 0.26) !important;
  background: rgba(18, 91, 42, 0.44) !important;
}

#tournamentPane .tournament-player-slot.winner span,
#tournamentPane .tournament-player-slot.winner em {
  color: #effff2 !important;
}

#tournamentPane .tournament-player-slot.winner i {
  color: #ffffff !important;
  background: #11962c !important;
}

#tournamentPane .tournament-match-footer {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  padding-top: 8px !important;
}

#tournamentPane .tournament-match-footer small {
  min-width: 0 !important;
  overflow: hidden !important;
  color: #7f94a3 !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  text-overflow: ellipsis !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}

#tournamentPane .tournament-match-footer button {
  min-width: 84px !important;
  height: 28px !important;
  padding: 0 10px !important;
  border: 1px solid rgba(127, 199, 255, 0.28) !important;
  border-radius: 7px !important;
  color: #f5fbff !important;
  background: linear-gradient(135deg, rgba(127, 199, 255, 0.18), rgba(143, 220, 138, 0.12)) !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  cursor: pointer !important;
}

#tournamentPane .tournament-match-footer button:hover {
  border-color: rgba(127, 199, 255, 0.42) !important;
  background: linear-gradient(135deg, rgba(127, 199, 255, 0.25), rgba(143, 220, 138, 0.16)) !important;
}

#tournamentPane .tournament-action-button.danger {
  border-color: rgba(255, 99, 99, 0.42) !important;
  color: #fff7f7 !important;
  background: linear-gradient(180deg, #a72a2a 0%, #761919 100%) !important;
  box-shadow: 0 10px 22px rgba(160, 42, 42, 0.18) !important;
}

#tournamentPane .tournament-action-button.danger:hover {
  border-color: rgba(255, 142, 142, 0.58) !important;
  background: linear-gradient(180deg, #bd3434 0%, #842020 100%) !important;
}

/* Tournament history: finalists, payouts and transaction hashes. */
#tournamentPane .tournament-browser {
  grid-template-rows: auto auto minmax(0, 1fr) !important;
}

#tournamentPane .tournament-view-tabs {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  padding: 4px !important;
  border: 1px solid rgba(127, 199, 255, 0.12) !important;
  border-radius: 8px !important;
  background: rgba(7, 15, 24, 0.62) !important;
}

#tournamentPane .tournament-view-tabs button {
  height: 38px !important;
  min-width: 0 !important;
  border: 1px solid transparent !important;
  border-radius: 7px !important;
  color: #95a8b8 !important;
  background: transparent !important;
  font-size: 11px !important;
  font-weight: 950 !important;
  line-height: 1.05 !important;
  cursor: pointer !important;
}

#tournamentPane .tournament-view-tabs button:hover {
  border-color: rgba(127, 199, 255, 0.22) !important;
  color: #eaf6ff !important;
  background: rgba(127, 199, 255, 0.08) !important;
}

#tournamentPane .tournament-view-tabs button.active {
  border-color: rgba(68, 255, 110, 0.38) !important;
  color: #ffffff !important;
  background: linear-gradient(180deg, #10aa29, #078918) !important;
  box-shadow: 0 10px 22px rgba(0, 153, 24, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.14) !important;
}

#tournamentPane .tournament-view-panel {
  display: none !important;
  min-height: 0 !important;
}

#tournamentPane .tournament-view-panel.active {
  display: grid !important;
}

#tournamentPane .tournament-history-shell {
  display: grid !important;
  grid-template-rows: auto minmax(0, auto) !important;
  gap: 10px !important;
  min-height: 0 !important;
  padding: 12px !important;
  border: 1px solid rgba(127, 199, 255, 0.11) !important;
  border-radius: 8px !important;
  background: #0d1722 !important;
}

#tournamentPane .tournament-history-grid {
  display: grid !important;
  grid-template-columns: minmax(220px, 340px) minmax(0, 1fr) !important;
  gap: 12px !important;
  min-height: 560px !important;
  min-width: 0 !important;
}

#tournamentPane .tournament-history-list-shell {
  min-height: 0 !important;
}

#tournamentPane .tournament-view-panel:not(.active) {
  display: none !important;
}

#tournamentPane .tournament-view-panel.active {
  display: grid !important;
}

#tournamentPane .tournament-history-list {
  display: grid !important;
  grid-auto-flow: row !important;
  grid-auto-rows: max-content !important;
  gap: 10px !important;
  min-height: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  padding-bottom: 2px !important;
  scrollbar-color: rgba(127, 199, 255, 0.32) rgba(8, 18, 27, 0.82) !important;
  scrollbar-width: thin !important;
}

#tournamentPane .tournament-history-row {
  min-height: 118px !important;
}

#tournamentPane .tournament-history-row .tournament-badge {
  min-width: 0 !important;
}

#tournamentPane .tournament-history-row .tournament-badge:first-child {
  flex-basis: 100% !important;
}

#tournamentPane .tournament-history-details {
  min-height: 0 !important;
  overflow: hidden auto !important;
}

#tournamentPane .tournament-history-card {
  display: grid !important;
  align-content: start !important;
  gap: 10px !important;
  min-width: 0 !important;
  padding: 12px !important;
  border: 1px solid rgba(127, 199, 255, 0.13) !important;
  border-radius: 8px !important;
  background: linear-gradient(180deg, #142031 0%, #0e1723 100%) !important;
}

#tournamentPane .tournament-history-details .tournament-history-card {
  min-height: 100% !important;
}

#tournamentPane .tournament-history-card.history-detail-card {
  gap: 12px !important;
  width: 100% !important;
  padding: 14px !important;
  overflow-x: hidden !important;
}

#tournamentPane .tournament-history-head {
  display: grid !important;
  gap: 4px !important;
  min-width: 0 !important;
}

#tournamentPane .tournament-history-head strong {
  overflow: hidden !important;
  color: #f4fbff !important;
  font-size: 13px !important;
  font-weight: 950 !important;
  line-height: 1.1 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#tournamentPane .tournament-history-head span {
  overflow: hidden !important;
  color: #8ea2b2 !important;
  font-size: 10px !important;
  font-weight: 850 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#tournamentPane .tournament-history-card .tournament-bracket.history-bracket {
  grid-auto-columns: minmax(170px, 1fr) !important;
  gap: 14px !important;
  min-height: 0 !important;
  max-width: 100% !important;
  padding: 8px !important;
  border: 1px solid rgba(127, 199, 255, 0.08) !important;
  border-radius: 8px !important;
  background: rgba(7, 15, 24, 0.42) !important;
}

#tournamentPane .tournament-history-card.history-detail-card .tournament-bracket.history-bracket {
  grid-auto-columns: minmax(156px, 1fr) !important;
  grid-template-columns: repeat(auto-fit, minmax(156px, 1fr)) !important;
  grid-auto-flow: row !important;
  gap: 14px !important;
  min-height: 250px !important;
  padding: 8px !important;
  overflow-x: hidden !important;
}

#tournamentPane .tournament-history-card.history-detail-card .tournament-bracket.history-bracket .tournament-match {
  min-height: 104px !important;
}

#tournamentPane .tournament-history-card.history-detail-card .tournament-bracket.history-bracket .tournament-round.third-place {
  padding-top: 0 !important;
}

#tournamentPane .tournament-history-card .tournament-bracket.history-bracket .tournament-round {
  gap: 8px !important;
}

#tournamentPane .tournament-history-card .tournament-bracket.history-bracket .tournament-round > strong {
  font-size: 9px !important;
}

#tournamentPane .tournament-history-card .tournament-bracket.history-bracket .tournament-round.third-place {
  padding-top: 26px !important;
}

#tournamentPane .tournament-history-card .tournament-bracket.history-bracket .tournament-match {
  grid-template-rows: auto auto auto !important;
  min-height: 92px !important;
  padding: 6px !important;
}

#tournamentPane .tournament-history-card .tournament-bracket.history-bracket .tournament-match::before,
#tournamentPane .tournament-history-card .tournament-bracket.history-bracket .tournament-match::after {
  content: none !important;
}

#tournamentPane .tournament-history-card .tournament-bracket.history-bracket .tournament-player-slot {
  grid-template-columns: 18px minmax(0, 1fr) auto !important;
  min-height: 26px !important;
  padding: 5px 6px !important;
}

#tournamentPane .tournament-history-card .tournament-bracket.history-bracket .tournament-player-slot i {
  width: 17px !important;
  height: 17px !important;
  font-size: 9px !important;
}

#tournamentPane .tournament-history-card .tournament-bracket.history-bracket .tournament-player-slot span {
  font-size: 10px !important;
}

#tournamentPane .tournament-history-card .tournament-bracket.history-bracket .tournament-player-slot em,
#tournamentPane .tournament-history-card .tournament-bracket.history-bracket .tournament-match-footer small {
  font-size: 9px !important;
}

#tournamentPane .tournament-history-payouts {
  display: grid !important;
  gap: 6px !important;
}

#tournamentPane .tournament-history-payout {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto minmax(92px, auto) !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 28px !important;
  padding: 6px 7px !important;
  border: 1px solid rgba(127, 199, 255, 0.09) !important;
  border-radius: 7px !important;
  background: rgba(7, 15, 24, 0.68) !important;
}

#tournamentPane .tournament-history-payout.empty {
  opacity: 0.68 !important;
}

#tournamentPane .tournament-history-payout.error {
  border-color: rgba(255, 113, 113, 0.18) !important;
}

#tournamentPane .tournament-history-payout span,
#tournamentPane .tournament-history-payout b,
#tournamentPane .tournament-history-payout em,
#tournamentPane .tournament-history-payout a {
  min-width: 0 !important;
  overflow: hidden !important;
  font-size: 10px !important;
  font-style: normal !important;
  font-weight: 950 !important;
  line-height: 1.1 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#tournamentPane .tournament-history-payout span {
  color: #dcebf6 !important;
}

#tournamentPane .tournament-history-payout b {
  color: #dfffea !important;
}

#tournamentPane .tournament-history-payout em {
  justify-self: end !important;
  color: #7f94a3 !important;
}

#tournamentPane .tournament-history-payout a {
  color: #98d7ff !important;
  text-decoration: none !important;
}

@media (max-width: 760px) {
  #tournamentPane .tournament-bracket.football-bracket {
    grid-auto-columns: minmax(210px, 80vw) !important;
    gap: 24px !important;
  }

  #tournamentPane .tournament-bracket.football-bracket .tournament-match::before,
  #tournamentPane .tournament-bracket.football-bracket .tournament-match::after {
    content: none !important;
  }

  #tournamentPane .tournament-history-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    min-height: 0 !important;
  }

  #tournamentPane .tournament-history-list {
    max-height: 360px !important;
  }
}

/* Completed tournaments use the full browser width: selector on the left, details on the right. */
#tournamentPane .tournament-history-shell.active {
  align-content: stretch !important;
}

#tournamentPane .tournament-history-grid {
  grid-template-columns: minmax(260px, 320px) minmax(520px, 1fr) !important;
  align-items: stretch !important;
  width: 100% !important;
  min-height: 560px !important;
}

#tournamentPane .tournament-history-list-shell {
  width: 100% !important;
  max-width: 320px !important;
}

#tournamentPane .tournament-history-details {
  display: grid !important;
  grid-template-rows: minmax(0, 1fr) !important;
  align-content: stretch !important;
  min-width: 0 !important;
  overflow: hidden !important;
}

#tournamentPane .tournament-history-card.history-detail-card {
  width: 100% !important;
  height: 100% !important;
  min-height: 100% !important;
  overflow: hidden auto !important;
}

#tournamentPane .tournament-history-card.history-detail-card .tournament-history-head strong {
  font-size: 16px !important;
}

#tournamentPane .tournament-history-card.history-detail-card .tournament-history-head span {
  font-size: 11px !important;
}

#tournamentPane .tournament-history-card.history-detail-card .tournament-bracket.history-bracket {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
  grid-auto-columns: minmax(220px, 1fr) !important;
  min-height: 330px !important;
  align-items: stretch !important;
}

#tournamentPane .tournament-history-card.history-detail-card .tournament-bracket.history-bracket .tournament-round {
  min-width: 0 !important;
}

#tournamentPane .tournament-history-card.history-detail-card .tournament-bracket.history-bracket .tournament-match {
  min-height: 128px !important;
}

#tournamentPane .tournament-history-card.history-detail-card .tournament-history-payout {
  grid-template-columns: minmax(160px, 1fr) minmax(70px, auto) minmax(150px, auto) !important;
  min-height: 34px !important;
  padding: 8px 10px !important;
}

#tournamentPane .tournament-history-card.history-detail-card .tournament-history-payout span,
#tournamentPane .tournament-history-card.history-detail-card .tournament-history-payout b,
#tournamentPane .tournament-history-card.history-detail-card .tournament-history-payout em,
#tournamentPane .tournament-history-card.history-detail-card .tournament-history-payout a {
  font-size: 11px !important;
}

#tournamentPane.no-tournaments #tournamentHistoryPanel .tournament-history-list-shell {
  display: grid !important;
}

#tournamentPane.no-tournaments #tournamentHistoryPanel .tournament-history-details {
  display: grid !important;
  align-content: stretch !important;
  justify-content: stretch !important;
  overflow: hidden !important;
}

#tournamentPane.no-tournaments #tournamentHistoryPanel .tournament-history-grid {
  grid-template-columns: minmax(260px, 320px) minmax(520px, 1fr) !important;
}

@media (max-width: 1120px) {
  #tournamentPane .tournament-history-grid {
    grid-template-columns: minmax(230px, 300px) minmax(0, 1fr) !important;
  }

  #tournamentPane .tournament-history-list-shell {
    max-width: 300px !important;
  }
}

@media (max-width: 860px) {
  #tournamentPane .tournament-history-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    min-height: 0 !important;
  }

  #tournamentPane .tournament-history-list-shell {
    max-width: none !important;
  }

  #tournamentPane.no-tournaments #tournamentHistoryPanel .tournament-history-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  #tournamentPane .tournament-history-card.history-detail-card {
    min-height: 0 !important;
  }
}

/* Completed tournaments must scroll even when there are no current tournaments. */
#tournamentPane .tournament-browser {
  grid-template-rows: auto auto minmax(0, 1fr) !important;
}

#tournamentPane .tournament-view-panel {
  display: none !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

#tournamentPane .tournament-view-panel.active {
  display: block !important;
  height: 100% !important;
  min-height: 0 !important;
}

#tournamentPane #tournamentHistoryPanel.active {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  gap: 12px !important;
  overflow: hidden !important;
}

#tournamentPane .tournament-history-grid,
#tournamentPane.no-tournaments #tournamentHistoryPanel .tournament-history-grid {
  display: grid !important;
  grid-template-columns: minmax(280px, 340px) minmax(0, 1fr) !important;
  gap: 14px !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

#tournamentPane .tournament-history-list-shell,
#tournamentPane.no-tournaments #tournamentHistoryPanel .tournament-history-list-shell {
  display: grid !important;
  min-height: 0 !important;
  max-width: none !important;
}

#tournamentPane .tournament-history-list {
  min-height: 0 !important;
  overflow: auto !important;
  padding-bottom: 20px !important;
}

#tournamentPane .tournament-history-details,
#tournamentPane.no-tournaments #tournamentHistoryPanel .tournament-history-details {
  display: block !important;
  align-content: start !important;
  justify-content: stretch !important;
  min-height: 0 !important;
  overflow: auto !important;
  padding: 14px 14px 30px !important;
}

#tournamentPane .tournament-history-card.history-detail-card {
  min-height: 0 !important;
  max-height: none !important;
}

#tournamentPane .tournament-history-card.history-detail-card .tournament-bracket.history-bracket {
  max-width: 100% !important;
  overflow: auto !important;
  padding-bottom: 16px !important;
}

@media (max-width: 1180px) {
  #tournamentPane .tournament-history-grid,
  #tournamentPane.no-tournaments #tournamentHistoryPanel .tournament-history-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    overflow: visible !important;
  }

  #tournamentPane #tournamentHistoryPanel.active {
    overflow: auto !important;
  }

  #tournamentPane .tournament-history-details,
  #tournamentPane.no-tournaments #tournamentHistoryPanel .tournament-history-details {
    min-height: 420px !important;
  }
}

/* Tournament bracket flow: keep the final in the main horizontal bracket and place 3rd place below. */
#tournamentPane .tournament-bracket-shell {
  display: grid !important;
  gap: 14px !important;
  min-width: 0 !important;
}

#tournamentPane .tournament-bracket-shell > .tournament-bracket.football-bracket {
  width: 100% !important;
  grid-auto-flow: column !important;
  grid-template-columns: none !important;
  grid-template-rows: none !important;
  justify-content: start !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
}

#tournamentPane .tournament-history-card .tournament-bracket-shell > .tournament-bracket.history-bracket,
#tournamentPane .tournament-history-card.history-detail-card .tournament-bracket-shell > .tournament-bracket.history-bracket {
  grid-auto-flow: column !important;
  grid-template-columns: none !important;
  grid-template-rows: none !important;
  grid-auto-columns: minmax(220px, 248px) !important;
  justify-content: start !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
}

#tournamentPane .tournament-bracket-third-place {
  display: grid !important;
  justify-content: start !important;
  min-width: 0 !important;
  padding: 0 8px 4px !important;
}

#tournamentPane .tournament-bracket-third-place .tournament-round.third-place {
  display: grid !important;
  gap: 8px !important;
  width: min(420px, 100%) !important;
  max-width: 100% !important;
  padding-top: 0 !important;
}

#tournamentPane .tournament-bracket-third-place .tournament-round.third-place > strong {
  color: #dcecf8 !important;
  font-size: 11px !important;
  font-weight: 950 !important;
  text-transform: uppercase !important;
}

#tournamentPane .tournament-bracket-third-place .tournament-match {
  display: grid !important;
  grid-template-rows: auto auto minmax(28px, auto) !important;
  min-height: 116px !important;
  padding: 8px !important;
  border: 1px solid rgba(68, 255, 110, 0.3) !important;
  border-radius: 8px !important;
  background: linear-gradient(180deg, #142031 0%, #0e1723 100%) !important;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.035) !important;
}

#tournamentPane .tournament-bracket-third-place .tournament-match::before,
#tournamentPane .tournament-bracket-third-place .tournament-match::after {
  content: none !important;
}

/* Tournament bracket alignment: headers stay fixed, match cards fill even vertical slots. */
#tournamentPane .tournament-bracket.football-bracket .tournament-round {
  display: grid !important;
  grid-template-rows: 22px minmax(0, 1fr) !important;
  align-content: stretch !important;
  justify-content: stretch !important;
  gap: 12px !important;
  height: 100% !important;
  min-height: 0 !important;
}

#tournamentPane .tournament-bracket.football-bracket .tournament-round > strong {
  position: static !important;
  display: flex !important;
  align-items: center !important;
  min-height: 22px !important;
  padding: 0 2px !important;
}

#tournamentPane .tournament-bracket.football-bracket .tournament-round-matches {
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-around !important;
  gap: 16px !important;
  min-height: 0 !important;
}

#tournamentPane .tournament-bracket.football-bracket .tournament-round-matches > .tournament-match {
  flex: 0 0 auto !important;
}

#tournamentPane .tournament-bracket.football-bracket .tournament-round:not(.third-place):not(:last-child) .tournament-match::after {
  right: -35px !important;
}

#tournamentPane .tournament-bracket.football-bracket .tournament-round:not(:first-child):not(.third-place) .tournament-match::before {
  left: -35px !important;
}

#tournamentPane .tournament-bracket-third-place .tournament-round.third-place {
  grid-template-rows: 22px auto !important;
  height: auto !important;
}

#tournamentPane .tournament-bracket-third-place .tournament-round-matches {
  display: grid !important;
  gap: 8px !important;
}

/* Tournament bracket connectors: SVG draws proper merge brackets between rounds. */
#tournamentPane .tournament-bracket.football-bracket {
  position: relative !important;
}

#tournamentPane .tournament-bracket.football-bracket .tournament-round {
  position: relative !important;
  z-index: 1 !important;
}

#tournamentPane .tournament-bracket.football-bracket .tournament-match::before,
#tournamentPane .tournament-bracket.football-bracket .tournament-match::after {
  content: none !important;
}

#tournamentPane .tournament-bracket-connectors {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  overflow: visible !important;
}

#tournamentPane .tournament-bracket.football-bracket .tournament-round:not(.third-place):not(:last-child) .tournament-match::after,
#tournamentPane .tournament-bracket.football-bracket .tournament-round:not(:first-child):not(.third-place) .tournament-match::before,
#tournamentPane .tournament-history-card .tournament-bracket.history-bracket .tournament-match::before,
#tournamentPane .tournament-history-card .tournament-bracket.history-bracket .tournament-match::after {
  content: none !important;
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  background: none !important;
  border: 0 !important;
}

#tournamentPane .tournament-history-controls {
  display: flex !important;
  grid-column: 2 !important;
  grid-row: 1 / span 2 !important;
  align-self: center !important;
  justify-content: flex-end !important;
  min-width: 0 !important;
}

#tournamentPane .tournament-history-head {
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
}

#tournamentPane .tournament-bracket-mode-toggle,
#tournamentPane .tournament-history-pager button {
  min-height: 32px !important;
  padding: 0 12px !important;
  border: 1px solid rgba(127, 199, 255, 0.24) !important;
  border-radius: 7px !important;
  color: #ecf8ff !important;
  background: rgba(18, 32, 45, 0.88) !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
}

#tournamentPane .tournament-bracket-mode-toggle:hover,
#tournamentPane .tournament-history-pager button:not(:disabled):hover {
  border-color: rgba(127, 199, 255, 0.42) !important;
  background: rgba(32, 56, 78, 0.92) !important;
}

#tournamentPane .tournament-history-pager {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 8px !important;
  border: 1px solid rgba(127, 199, 255, 0.10) !important;
  border-radius: 8px !important;
  background: rgba(7, 15, 24, 0.62) !important;
}

#tournamentPane .tournament-history-pager span {
  min-width: 0 !important;
  color: #93aabd !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  text-align: center !important;
  text-transform: uppercase !important;
}

#tournamentPane .tournament-history-pager button:disabled {
  cursor: default !important;
  opacity: 0.45 !important;
}

@media (max-width: 760px) {
  #tournamentPane .tournament-history-pager {
    grid-template-columns: 1fr !important;
  }
}

/* Live tournament bracket viewport: keep the original grid, scroll the whole bracket. */
#tournamentPane .tournament-bracket-shell:not(.history-bracket-shell) {
  display: grid !important;
  gap: 8px !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-width: 0 !important;
  overflow: visible !important;
  padding: 8px !important;
  border: 1px solid rgba(127, 199, 255, 0.12) !important;
  border-radius: 8px !important;
  background: #0b141f !important;
  overscroll-behavior: contain !important;
  scrollbar-color: rgba(127, 199, 255, 0.42) rgba(8, 18, 27, 0.82) !important;
  scrollbar-gutter: stable both-edges !important;
  scrollbar-width: auto !important;
}

#tournamentPane .tournament-bracket-shell:not(.history-bracket-shell)::-webkit-scrollbar {
  width: 14px !important;
  height: 14px !important;
}

#tournamentPane .tournament-bracket-shell:not(.history-bracket-shell)::-webkit-scrollbar-track {
  border-radius: 999px !important;
  background: rgba(8, 18, 27, 0.82) !important;
}

#tournamentPane .tournament-bracket-shell:not(.history-bracket-shell)::-webkit-scrollbar-thumb {
  border: 2px solid rgba(8, 18, 27, 0.82) !important;
  border-radius: 999px !important;
  background: rgba(127, 199, 255, 0.46) !important;
}

#tournamentPane .tournament-bracket-tools {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 6px !important;
  min-width: 0 !important;
}

#tournamentPane .tournament-bracket-zoom-button {
  display: grid !important;
  place-items: center !important;
  width: 32px !important;
  min-width: 32px !important;
  height: 30px !important;
  min-height: 30px !important;
  padding: 0 !important;
  border: 1px solid rgba(127, 199, 255, 0.24) !important;
  border-radius: 7px !important;
  color: #eff8ff !important;
  background: rgba(18, 32, 45, 0.92) !important;
  font-size: 18px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  cursor: pointer !important;
}

#tournamentPane .tournament-bracket-zoom-button:not(:disabled):hover {
  border-color: rgba(127, 199, 255, 0.46) !important;
  background: rgba(32, 56, 78, 0.94) !important;
}

#tournamentPane .tournament-bracket-zoom-button:disabled {
  cursor: default !important;
  opacity: 0.42 !important;
}

#tournamentPane .tournament-bracket-zoom-value {
  min-width: 46px !important;
  color: #9fb6c8 !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  text-align: center !important;
}

#tournamentPane .tournament-bracket-shell:not(.history-bracket-shell) > .tournament-bracket-scroll-frame {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: clamp(300px, 44vh, 460px) !important;
  min-width: 0 !important;
  overflow-x: scroll !important;
  overflow-y: scroll !important;
  padding: 0 0 56px !important;
  border-radius: 6px !important;
  background: #0b141f !important;
  overscroll-behavior: contain !important;
  scrollbar-color: rgba(127, 199, 255, 0.42) rgba(8, 18, 27, 0.82) !important;
  scrollbar-gutter: stable both-edges !important;
  scrollbar-width: auto !important;
}

#tournamentPane .tournament-bracket-shell:not(.history-bracket-shell) > .tournament-bracket-scroll-frame::-webkit-scrollbar {
  width: 14px !important;
  height: 14px !important;
}

#tournamentPane .tournament-bracket-shell:not(.history-bracket-shell) > .tournament-bracket-scroll-frame::-webkit-scrollbar-track {
  border-radius: 999px !important;
  background: rgba(8, 18, 27, 0.82) !important;
}

#tournamentPane .tournament-bracket-shell:not(.history-bracket-shell) > .tournament-bracket-scroll-frame::-webkit-scrollbar-thumb {
  border: 2px solid rgba(8, 18, 27, 0.82) !important;
  border-radius: 999px !important;
  background: rgba(127, 199, 255, 0.46) !important;
}

#tournamentPane .tournament-bracket-shell:not(.history-bracket-shell) > .tournament-bracket.football-bracket {
  display: grid !important;
  grid-auto-flow: column !important;
  grid-auto-columns: minmax(220px, 248px) !important;
  grid-template-columns: none !important;
  grid-template-rows: none !important;
  justify-content: start !important;
  align-items: stretch !important;
  gap: 34px !important;
  width: var(--tournament-bracket-width, max-content) !important;
  min-width: var(--tournament-bracket-width, max-content) !important;
  max-width: none !important;
  height: var(--tournament-bracket-height, auto) !important;
  min-height: var(--tournament-bracket-height, 280px) !important;
  overflow: visible !important;
  padding: 4px 56px 32px 8px !important;
}

#tournamentPane .tournament-bracket-shell:not(.history-bracket-shell) > .tournament-bracket-third-place {
  width: max-content !important;
  min-width: 420px !important;
  max-width: none !important;
  margin-top: 22px !important;
  padding: 0 8px 80px !important;
}

#tournamentPane .tournament-bracket-shell:not(.history-bracket-shell) > .tournament-bracket-canvas {
  display: block !important;
  position: relative !important;
  width: var(--tournament-bracket-canvas-width, max-content) !important;
  min-width: var(--tournament-bracket-canvas-width, max-content) !important;
  max-width: none !important;
  height: var(--tournament-bracket-canvas-height, auto) !important;
  min-height: var(--tournament-bracket-canvas-height, 420px) !important;
  padding: 0 96px 120px 0 !important;
  overflow: visible !important;
  zoom: var(--tournament-bracket-zoom, 1) !important;
}

#tournamentPane .tournament-bracket-shell:not(.history-bracket-shell) > .tournament-bracket-scroll-frame > .tournament-bracket-canvas {
  display: block !important;
  position: relative !important;
  width: var(--tournament-bracket-canvas-width, max-content) !important;
  min-width: var(--tournament-bracket-canvas-width, max-content) !important;
  max-width: none !important;
  height: var(--tournament-bracket-canvas-height, auto) !important;
  min-height: var(--tournament-bracket-canvas-height, 420px) !important;
  padding: 0 96px 120px 0 !important;
  overflow: visible !important;
  zoom: var(--tournament-bracket-zoom, 1) !important;
}

#tournamentPane .tournament-bracket-shell:not(.history-bracket-shell) > .tournament-bracket-canvas > .tournament-bracket.football-bracket {
  display: grid !important;
  grid-auto-flow: column !important;
  grid-auto-columns: minmax(220px, 248px) !important;
  grid-template-columns: none !important;
  grid-template-rows: none !important;
  justify-content: start !important;
  align-items: stretch !important;
  gap: 34px !important;
  width: var(--tournament-bracket-width, max-content) !important;
  min-width: var(--tournament-bracket-width, max-content) !important;
  max-width: none !important;
  height: var(--tournament-bracket-height, auto) !important;
  min-height: var(--tournament-bracket-height, 280px) !important;
  overflow: visible !important;
  padding: 4px 56px 32px 8px !important;
}

#tournamentPane .tournament-bracket-shell:not(.history-bracket-shell) > .tournament-bracket-scroll-frame > .tournament-bracket-canvas > .tournament-bracket.football-bracket {
  display: grid !important;
  grid-auto-flow: column !important;
  grid-auto-columns: minmax(220px, 248px) !important;
  grid-template-columns: none !important;
  grid-template-rows: none !important;
  justify-content: start !important;
  align-items: stretch !important;
  gap: 34px !important;
  width: var(--tournament-bracket-width, max-content) !important;
  min-width: var(--tournament-bracket-width, max-content) !important;
  max-width: none !important;
  height: var(--tournament-bracket-height, auto) !important;
  min-height: var(--tournament-bracket-height, 280px) !important;
  overflow: visible !important;
  padding: 4px 56px 32px 8px !important;
}

#tournamentPane .tournament-bracket-shell:not(.history-bracket-shell) > .tournament-bracket-canvas > .tournament-bracket-third-place {
  width: max-content !important;
  min-width: 420px !important;
  max-width: none !important;
  margin-top: 28px !important;
  padding: 0 8px 120px !important;
}

#tournamentPane .tournament-bracket-shell:not(.history-bracket-shell) > .tournament-bracket-scroll-frame > .tournament-bracket-canvas > .tournament-bracket-third-place {
  width: max-content !important;
  min-width: 420px !important;
  max-width: none !important;
  margin-top: 28px !important;
  padding: 0 8px 120px !important;
}

@media (max-width: 1180px) {
  #tournamentPane .tournament-bracket-shell:not(.history-bracket-shell) > .tournament-bracket-scroll-frame {
    height: clamp(300px, 50vh, 520px) !important;
  }
}

@media (max-width: 760px) {
  #tournamentPane .tournament-bracket-shell:not(.history-bracket-shell) > .tournament-bracket-scroll-frame {
    height: 360px !important;
  }
}