/* The set fills the window (Mike: "this whole set fills the whole screen and put the heroes in the screen"). Layout
   only: the cabinet, its speakers, knobs, stickers and antenna, and every control on and inside the set keep the
   set's own art (broadcast-lobby.css, lobby-tv.css, ui-art.css, lobby-kit.css). From 1024x600 the set is as wide as
   the window, with a fixed cabinet gutter so the speaker grilles always show (lobby-tv.css only had room for them
   past 1480 px). From 1600x1000 the screen also takes the whole height and the hero strip moves inside it, under the
   channel (broadcast-lobby.js moves it); below that the strip stays under the set as before, so nothing shrinks. */
@media (min-width:1024px) and (min-height:600px){
  html.broadcast body #menu#menu{--g:clamp(26px,2.4vw,42px)}
  html.broadcast body #menu#menu .bc-room{padding:10px calc(var(--g) + 20px) 4px}
  /* The channel takes a little more of the screen, to give back what the speaker gutters take. */
  html.broadcast body #menu#menu#menu .bc-channels{width:min(62%,800px)}
  html.broadcast body #menu#menu .bc-tv,html.broadcast body #menu#menu .bc-card-row{width:100%;max-width:none}
  /* The rabbit ears hang off the cabinet's right side, which is now the window edge; the coat-hanger antenna stays. */
  html.broadcast body #menu#menu .bc-cab :is(.bc-ears,.bc-tape){display:none}
  /* The logo now sits on the cabinet's corner: keep it above the corner sticker. */
  html.broadcast body #menu#menu .bc-logo{z-index:7}
  html.broadcast body #menu#menu .bc-cab .bc-grille-l,html.broadcast body #menu#menu .bc-cab .bc-grille-r{display:block}
  /* Under the set the hero strip runs under the gutters too, so the cards keep their width. */
  html.broadcast body #menu#menu .bc-room>.bc-card-row{width:calc(100% + 2 * var(--g) + 24px);margin-inline:calc(-1 * var(--g) - 12px)}
}
/* Big windows: the screen fills the cabinet top to bottom and the hero strip sits inside it, above the Bash Wire. */
@media (min-width:1600px) and (min-height:1000px){
  html.broadcast body #menu#menu .bc-room{grid-template-rows:minmax(0,1fr) auto}
  html.broadcast body #menu#menu .bc-feed{--strip:166px}
  html.broadcast body #menu#menu .bc-feed>.bc-card-row{position:absolute;left:2.5%;right:2.5%;bottom:calc(3% + 42px);z-index:4;width:auto;margin:0}
  html.broadcast body #menu#menu .bc-feed>.bc-card-row .bc-stand{display:none}
  html.broadcast body #menu#menu#menu .bc-channels{top:4%;bottom:calc(3% + 42px + var(--strip) + 12px);width:min(62%,1180px)}
  html.broadcast body #menu#menu .bc-stage{top:3%;height:auto;bottom:calc(3% + 42px + var(--strip))}
  html.broadcast body #menu#menu .bc-chyron{bottom:calc(3% + 42px + var(--strip) + 10px)}
  html.broadcast body #menu#menu .bc-crowd{bottom:calc(3% + 34px + var(--strip))}
}
/* Laptop heights: the control-hint line under GO LIVE would spill under the set. */
@media (min-width:1024px) and (min-height:600px) and (max-height:820px){
  html.broadcast body #menu#menu .bc-go-hint{display:none}
}