body::before {
  display: none;
}

.brand {
  grid-template-columns: 50px minmax(0, 1fr) 68px;
  gap: 10px;
}

.brandMark {
  width: 50px;
  height: 50px;
  align-self: start;
}

.brandText h1,
.brandText p {
  max-width: 100%;
  overflow-wrap: anywhere;
}

.sidebarToggle {
  width: 68px;
  min-width: 68px;
  justify-self: end;
}

.appShell.sidebarCollapsed .sidebarToggle {
  width: 48px;
  min-width: 48px;
}

.videoWrap {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto auto auto;
  align-content: stretch;
  min-height: 0;
}

.videoWrap > video,
.videoWrap > .tournamentDashboard {
  grid-row: 1;
  grid-column: 1;
  min-height: 0;
}

.videoWrap > .tournamentDashboard {
  position: relative;
  inset: auto;
  height: auto;
}

.videoWrap > .numberBuffer,
.videoWrap > .playOverlayButton,
.videoWrap > .resizeHandle {
  grid-row: 1;
  grid-column: 1;
}

.videoWrap > .teeTicker,
.videoWrap > .adTicker,
.videoWrap > .tickerRestoreControls {
  position: static;
  grid-column: 1;
  left: auto;
  right: auto;
  top: auto;
  bottom: auto;
  width: 100%;
  margin: 0;
  border-left: 0;
  border-right: 0;
  border-radius: 0;
  box-shadow: none;
}

.videoWrap > .teeTicker {
  grid-row: 2;
  min-height: 38px;
}

.videoWrap > .adTicker {
  grid-row: 3;
  min-height: 38px;
}

.videoWrap > .tickerRestoreControls {
  grid-row: 4;
  display: flex;
  gap: 8px;
  padding: 6px 10px;
  background: rgba(5, 14, 29, .9);
}

.videoWrap > .tickerRestoreControls[hidden] {
  display: none;
}

.videoWrap > .tickerRestoreControls button {
  min-height: 38px;
}

.playerSection {
  min-width: 0;
}

.nowBar {
  grid-template-columns: 44px 56px minmax(220px, 1fr) minmax(360px, auto);
  overflow: hidden;
}

.nowText {
  min-width: 0;
}

.playerControls {
  min-width: 0;
  width: min(100%, 620px);
  grid-template-columns: repeat(3, minmax(100px, 1fr));
}

.playerControls button,
.castLauncher {
  min-width: 0;
  padding-inline: 10px;
}

.showNowBarButton,
.showGuideButton,
.tvModeControls {
  z-index: 20;
}

.showNowBarButton,
.showGuideButton {
  min-height: 38px;
  padding: 8px 11px;
  border-color: rgba(191, 219, 254, .22);
  background: rgba(5, 14, 29, .66);
  color: #dbeafe;
  font-size: 13px;
  font-weight: 800;
  box-shadow: 0 8px 22px rgba(0, 0, 0, .26);
  opacity: .72;
}

.showNowBarButton:hover,
.showNowBarButton:focus,
.showGuideButton:hover,
.showGuideButton:focus {
  opacity: 1;
}

.showNowBarButton:focus,
.showGuideButton:focus {
  outline: 2px solid rgba(147, 197, 253, .62);
  outline-offset: 2px;
  border-color: rgba(147, 197, 253, .54);
  box-shadow: 0 0 0 4px rgba(147, 197, 253, .12), 0 8px 22px rgba(0, 0, 0, .26);
}

.showNowBarButton {
  top: 12px;
  right: 12px;
  bottom: auto;
}

.showGuideButton {
  left: 12px;
  top: 12px;
  bottom: auto;
}

.appShell.guideHidden .showGuideButton {
  left: max(10px, env(safe-area-inset-left, 0px));
}

.tvModeControls {
  top: 12px;
  right: 12px;
  bottom: auto;
  grid-template-columns: auto 86px auto auto;
  max-width: calc(100% - 24px);
}

.tvModeControls input {
  width: 86px;
}

.appShell.tvMode .tvModeControls,
.appShell.guideHidden .tvModeControls {
  top: max(12px, env(safe-area-inset-top, 0px));
  right: max(12px, env(safe-area-inset-right, 0px));
}

.appShell.tvMode .videoWrap,
.appShell.guideHidden .videoWrap,
.playerSection.nowBarHidden .videoWrap {
  grid-template-rows: minmax(0, 1fr) auto auto auto;
}

.teeTicker,
.adTicker {
  min-width: 0;
}

.teeTickerHide,
.adTickerHide {
  min-width: 64px;
  margin-right: 0;
  padding: 7px 10px;
}

@media (max-width: 1280px) {
  .nowBar {
    grid-template-columns: 44px 48px minmax(180px, 1fr);
    align-items: start;
  }

  .playerControls {
    grid-column: 1 / -1;
    width: 100%;
    grid-template-columns: repeat(5, minmax(92px, 1fr));
  }
}

@media (max-width: 900px) {
  .tvModeControls {
    left: 12px;
    right: 12px;
    grid-template-columns: minmax(0, 1fr) 78px minmax(0, 1fr) minmax(0, 1fr);
  }

  .tvModeControls input {
    width: 100%;
  }
}

@media (max-width: 760px) {
  .videoWrap {
    aspect-ratio: auto;
    min-height: 280px;
  }

  .showNowBarButton,
  .showGuideButton,
  .tvModeControls {
    position: sticky;
    margin: 8px;
  }

  .showNowBarButton,
  .showGuideButton {
    top: 8px;
    bottom: auto;
    justify-self: start;
  }

  .tvModeControls {
    top: 8px;
    left: auto;
    right: auto;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: calc(100% - 16px);
    max-width: none;
  }
}

@media (max-width: 520px) {
  .playerControls,
  .tvModeControls {
    grid-template-columns: 1fr;
  }

  .teeTicker,
  .adTicker {
    grid-template-columns: minmax(0, 1fr);
  }

  .teeTickerHide,
  .adTickerHide {
    justify-self: stretch;
  }
}

.teeTimeTvPlasteredRail {
  display: grid;
  gap: 10px;
  margin: 0 0 12px;
  padding: 12px;
  border: 1px solid rgba(241, 221, 179, .22);
  border-radius: 8px;
  background: rgba(5, 14, 29, .78);
}

.teeTimeTvPlasteredRailTop {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.teeTimeTvPlasteredRailTitle {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.teeTimeTvPlasteredRailTitle strong {
  color: var(--text);
  font-size: 14px;
}

.teeTimeTvPlasteredRailTitle span {
  color: var(--muted);
  font-size: 12px;
}

.teeTimeTvCycleToggle {
  flex: 0 0 auto;
  min-height: 38px;
  padding: 7px 11px;
  border-color: rgba(147, 197, 253, .36);
  background: rgba(8, 27, 54, .9);
}

.teeTimeTvCycleToggle[aria-pressed="true"] {
  border-color: rgba(125, 211, 252, .84);
  background: linear-gradient(135deg, rgba(37, 99, 235, .72), rgba(14, 116, 144, .62));
}

.teeTimeTvPlasteredButtons {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.teeTimeTvPlasteredButton {
  min-width: 0;
  display: grid;
  gap: 2px;
  padding: 9px 10px;
  border: 1px solid rgba(191, 219, 254, .25);
  border-radius: 6px;
  background: rgba(13, 43, 87, .78);
  color: #eff6ff;
  text-decoration: none;
}

.teeTimeTvPlasteredButton:hover,
.teeTimeTvPlasteredButton:focus {
  border-color: rgba(147, 197, 253, .82);
  background: rgba(37, 99, 235, .45);
}

.teeTimeTvPlasteredButton.isActive {
  border-color: rgba(255, 207, 100, .9);
  background: linear-gradient(135deg, rgba(203, 63, 51, .8), rgba(37, 99, 235, .5));
}

.teeTimeTvPlasteredButton strong,
.teeTimeTvPlasteredButton span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.teeTimeTvPlasteredButton strong {
  font-size: 13px;
}

.teeTimeTvPlasteredButton span {
  color: #bfdbfe;
  font-size: 11px;
  font-weight: 800;
}

@media (max-width: 1200px) {
  .teeTimeTvPlasteredButtons {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
