/* Keep standings anchored while the selected fixture expands. */
@media (min-width: 1051px) {
  .viewer-match-centre-page > .viewer-main-grid > .viewer-matches-card {
    grid-area: 1 / 1;
  }

  .viewer-match-centre-page > .viewer-main-grid > .viewer-side-column {
    grid-area: 1 / 2;
  }

  .viewer-match-centre-page > .viewer-main-grid > [data-viewer-match-detail-host] {
    grid-column: 1;
  }
}

html.viewer-public-shell .viewer-match-centre-page > .viewer-round-navigation {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
}

html.viewer-public-shell .viewer-match-centre-page .viewer-panel-head {
  min-height: 0;
  padding: 0;
  margin-block: 0 10px;
}

html.viewer-public-shell .viewer-match-centre-page .viewer-match-list {
  grid-template-columns: minmax(0, 1fr);
}

html.viewer-public-shell .viewer-match-centre-page :is(.viewer-panel-head, .viewer-slot-match) > .player-viewer-link {
  min-height: 44px;
  text-decoration: none;
}

.viewer-match-centre-page [data-viewer-match-detail-host] {
  min-width: 0;
  border-radius: 10px;
  scroll-margin-block: 12px;
}

html.viewer-public-shell .viewer-match-centre-page .viewer-match-detail-card {
  margin: 0;
  scroll-margin-block: 12px;
}

.viewer-match-centre-page .viewer-detail-close {
  min-height: 44px;
  color: var(--mc-text);
  background: var(--mc-inset);
  border-color: var(--mc-border);
}

.viewer-match-centre-page :is([data-viewer-match-detail-host], .viewer-detail-close):focus-visible {
  outline: 2px solid var(--mc-accent);
  outline-offset: -2px;
}

.viewer-match-centre-page .viewer-time-slot:has([aria-current="true"]) {
  box-shadow: inset 0 0 0 1px var(--mc-accent);
}

.viewer-match-centre-page .viewer-match-detail-card :is(strong, small, p, .viewer-lineup-player > span) {
  overflow-wrap: anywhere;
}

.viewer-match-centre-page .viewer-replay-empty {
  color: var(--mc-muted);
}

.viewer-match-centre-page .viewer-detail-scoreline {
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  gap: 8px;
}

.viewer-match-centre-page .viewer-detail-scoreline strong:last-child {
  text-align: end;
}

html.viewer-public-shell .viewer-match-centre-page .viewer-info-strip {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  padding: 14px;
}

html.viewer-public-shell .viewer-match-centre-page .viewer-info-strip > div {
  display: grid;
  align-content: start;
  gap: 4px;
  padding: 0;
  border: 0;
}

@media (max-width: 760px) {
  html.viewer-public-shell .viewer-match-centre-page > .viewer-round-navigation {
    grid-template-columns: minmax(0, 1fr);
  }

  html.viewer-public-shell .viewer-match-centre-page .viewer-round-navigation .viewer-round-controls {
    box-sizing: border-box;
    margin-inline: auto;
  }

  html.viewer-public-shell .viewer-match-centre-page .viewer-matches-card .viewer-time-slot {
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
  }

  html.viewer-public-shell .viewer-match-centre-page .viewer-slot-time {
    border-inline-end: 0;
    border-block-end: 1px solid var(--mc-border);
    padding: 0 0 8px;
  }

  html.viewer-public-shell .viewer-match-centre-page .viewer-slot-versus {
    grid-template-columns: minmax(0, 1fr);
  }

  html.viewer-public-shell .viewer-match-centre-page .viewer-info-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Keep the round summary cards together in the standings column. */
html.viewer-public-shell .viewer-match-centre-page .viewer-side-column {
  display: grid;
  align-content: start;
  gap: var(--viewer-shell-gap, 12px);
}

html.viewer-public-shell .viewer-match-centre-page .viewer-side-column > .viewer-stat-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: inherit;
}

html.viewer-public-shell .viewer-match-centre-page .viewer-side-column > .viewer-info-strip {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
  border-color: var(--mc-border);
  background: var(--mc-surface);
  overflow-wrap: anywhere;
}

/* Compact public viewer language control. */
html.viewer-public-shell .viewer-site-nav.public-site-nav > .public-language-selector {
  position: relative;
  justify-self: end;
  width: 76px;
  max-width: 100%;
  color: var(--viewer-shell-ink);
}

html.viewer-public-shell .viewer-site-nav .public-language-selector::after {
  content: attr(data-language-code) " ⌄";
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  font-size: .8rem;
  font-weight: 700;
  pointer-events: none;
}

html.viewer-public-shell .viewer-site-nav.public-site-nav .public-language-selector select {
  appearance: none;
  width: 100%;
  min-height: 40px;
  padding: 0;
  background-image: none;
  color: transparent !important;
  font-size: 0;
  cursor: pointer;
}

html.viewer-public-shell .viewer-site-nav .public-language-selector select > button {
  display: none;
}

html.viewer-public-shell .viewer-site-nav .public-language-selector select::picker-icon {
  display: none;
}

html.viewer-public-shell .viewer-site-nav .public-language-selector select option {
  color: var(--viewer-shell-ink);
  background: var(--viewer-shell-raised);
  font-size: .875rem;
}

@supports (appearance: base-select) {
  html.viewer-public-shell .viewer-site-nav .public-language-selector select.brk-language-flags-rich {
    appearance: base-select;
  }
}