/* Copyright Ayers Electronics Inc. All rights reserved. */
/* channel 0: the rolling guide. */

/* ---- channel 0: the guide as a channel. The head keeps the channel's lockup and the clock, no
   legend is drawn, and the grid's rows roll up beneath the ruler on their own, round without end
   (js/guide-broadcast.js). Nothing on it takes a press, a pointer or the focus, and the
   GUIDE row is never drawn: channel 0 never lists itself. ---- */
#guide.broadcast #guideCloseBtn,
#guide.broadcast #headSwitchProfile,
#guide.broadcast #headPickTogether,
#guide.broadcast #headSurpriseMe,
#guide.broadcast #headMusicMode,
#guide.broadcast #headSyncTvs,
#guide.broadcast #headAskMagpie,
#guide.broadcast #modeSettings,
#guide.broadcast #guideModes,
#guide.broadcast #previewCaption,
#guide.broadcast #guideLegend,
#guide.broadcast .g-row.zero {
  display: none;
}
/* The ruler's corner keeps its width, so the hours stay over the cells they name. */
#guide.broadcast #guideChanHeader {
  visibility: hidden;
}
/* No upper area: the band is not drawn, and the ruler sits straight under the head. */
#guide.broadcast:not(.tutorial) #guideDetail {
  display: none;
}
/* The tutorial channel, channels that leave no row to roll: the band's title and story carry its cards,
   and the band is as tall as those two rows rather than the upper area's fixed height. */
#guide.broadcast.tutorial #guideDetail {
  height: auto;
}
#guide.broadcast #guideDetail > :not(#guideDetailText),
#guide.broadcast #guideDetailText > :not(#guideDetailTitle):not(#guideDetailRow2) {
  display: none;
}
/* The strip moves by its transform alone: the scroller neither scrolls nor takes a pointer, and it
   does not snap, since a snapped scroller follows the row the ring moves to the strip's end. */
#guide.broadcast #guideScroll {
  overflow: hidden;
  pointer-events: none;
  scroll-snap-type: none;
}
#guide.broadcast #guideRows {
  will-change: transform;
}
#guide.broadcast .g-cell.focused {
  box-shadow: none;
}
#guide.broadcast *:focus {
  outline: none;
  box-shadow: none;
}
#broadcastLockup {
  display: flex;
  align-items: center;
  min-width: 0;
}
#broadcastLockup > * + * {
  margin-left: 12px;
}
#broadcastNum {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 46px;
  height: var(--plate-h);
  padding: 0 7px;
  border-radius: var(--radius);
  background: var(--elevated);
  border: 1px solid var(--border-soft);
  font-family: "Roboto Condensed", "Segoe UI Semibold", system-ui, sans-serif;
  font-size: var(--plate-type);
  font-weight: 700;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  font-stretch: 87.5%;
}
#broadcastName {
  font-size: var(--type-body);
  font-weight: 600;
  letter-spacing: 0.16em;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}