/* The buzzer's own styling: the press target and the order list. Loaded by the plugin's
   three bodies only — nothing else in the app knows these classes. */
.buzz-button {
  width: min(100%, 22rem);
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  /* ONE line, always. The label is the most important control at the event and a wrapped
     "SIGNALA/S" reads as broken; the vw factor keeps it inside the circle at 320-414 px
     and the rem ceiling stops it outgrowing the 22rem circle on a wide screen. */
  white-space: nowrap;
  font-size: clamp(1.5rem, 10vw, 3.25rem);
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1;
}
.buzz-button:disabled { opacity: 0.5; }

/* Bounded, so the gap stays NEXT TO the name it belongs to. `.buzz-name` grows to fill the
   row, which on a 1920 wall pushed "+424 ms" about 1400px away from "2. Viktorina T." — two
   columns so far apart that the room has to pair them up by eye. The cap keeps the tidy
   rank/name/gap table and puts the number back within reading distance; it is in ch so it
   tracks the font rather than a fixed pixel width. */
.buzz-order { margin: 0; padding: 0; list-style: none; max-width: 34ch; }
.buzz-row { display: flex; align-items: baseline; gap: 0.75rem; padding: 0.25rem 0; }
.buzz-rank { min-width: 2.5rem; font-weight: 700; }
.buzz-name { flex: 1 1 auto; }
/* The millisecond gap is what makes a disputed result explicable — never hide it. */
.buzz-gap { opacity: 0.7; font-variant-numeric: tabular-nums; white-space: nowrap; }
.buzz-verdict { min-width: 1.5rem; text-align: right; }
.buzz-answering { font-weight: 700; }
.buzz-first { font-size: clamp(2.5rem, 8vw, 6rem); line-height: 1.1; }

/* The authored prompt on the projector, above the buzz order. */
.buzz-prompt { text-align: center; }
.buzz-prompt-text { font-size: clamp(1.4rem, 3.4vw, 3rem); margin: 0 0 1.5vh; }

/* --- the projector, with no question on it ------------------------------------------- */
/* The buzzer wall shows ONE thing now — who pressed — so it gets the whole panel. Before
   this it sat at the top and left two thirds of a 1080p screen black, which from the back of
   a room reads as a dead feed rather than as a round waiting to start (the same reason the
   quiz has `.quiz-wait`). Fills the body and centres; `min-height: 0` so a long order list
   can still shrink inside it rather than pushing itself off the bottom edge, because the
   projector does not scroll (quirk 40). */
.buzz-stage {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  /* TOP, not centred. Centring looked calmer with nobody on the list, but the list GROWS as
     people press — so a centred block shifts every name downward on every press, and the
     room is trying to read exactly those names. Anchored at the top, row one stays where the
     eye already is and new rows appear below it. `overflow: hidden` still bounds a long
     round, because the projector does not scroll (quirk 40). */
  justify-content: flex-start;
  overflow: hidden;
}
.buzz-label { font-size: clamp(1rem, 1.8vw, 1.75rem); letter-spacing: .04em; }
.buzz-empty { font-size: clamp(1.1rem, 2vw, 2rem); margin: 0; }