/* Desktop stage: the server rail follows the full height of the featured stream. */
.broadcast-live {
  grid-template-columns: minmax(0, 1fr) clamp(330px, 20vw, 410px);
  align-items: stretch;
}

.broadcast-channels {
  display: flex;
  min-height: 0;
  max-height: none;
  flex-direction: column;
}

.broadcast-channels > div {
  min-height: 0;
  max-height: none;
  flex: 1 1 auto;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-color: rgba(239, 84, 47, .68) rgba(255, 255, 255, .06);
  scrollbar-width: thin;
}

.broadcast-channel {
  min-height: 86px;
}

@media (max-width: 900px) {
  .broadcast-live {
    grid-template-columns: 1fr;
  }

  .broadcast-channels {
    display: block;
  }

  .broadcast-channels > div {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    overflow: visible;
  }
}

@media (max-width: 640px) {
  .broadcast-channels > div {
    display: block;
  }
}