/* webrtc.css — 1.99et: ⚡ Low latency on the stage players (stage-lowlat.js) + the WHIP go-live bits on /stage
   (stage-golive-rtc.js). Only on the page while the stage setting webrtc_enabled is on. */
.player .lowlat { position: absolute; top: 8px; right: 8px; z-index: 6; display: inline-flex; align-items: center; gap: 4px;
                  padding: 5px 10px; border-radius: 999px; border: 1px solid rgba(255,255,255,.25); background: rgba(0,0,0,.6);
                  color: #ddd; font: bold 12px/1.2 var(--ds-font); cursor: pointer; }
.player .lowlat:hover, .player .lowlat:focus-visible { border-color: var(--ds-green); color: #fff; outline: none; }
.player .lowlat[aria-pressed=true] { border-color: var(--ds-green); color: var(--ds-green-2); }
.player .lowlat.on { background: var(--ds-green); color: #111; border-color: var(--ds-green); }
.player .lowlat.hide { display: none; }
/* 1.99ey: auto-hide with the video controls (stage-lowlat.js sets .idle) - the same 1 s fade-out / quick fade-in as
   video.js's control bar; still focusable while hidden, and focus brings it back */
.player .lowlat { opacity: 1; transition: opacity .15s ease; }
.player .lowlat.idle { opacity: 0; pointer-events: none; transition-duration: 1s; }
.player .lowlat.idle:focus-visible { opacity: 1; pointer-events: auto; }
@media (prefers-reduced-motion: reduce) { .player .lowlat, .player .lowlat.idle { transition: none; } }
.player .rtc-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; background: #000; z-index: 1; display: block; }
.sb .whip { margin-top: 16px; padding-top: 12px; border-top: 1px dashed var(--ds-line-strong); }
.sb .whip h3 { margin: 0 0 6px; font-size: 15px; color: var(--ds-green-2); }
@media (max-width: 560px) { .player .lowlat { top: 6px; right: 6px; padding: 4px 8px; } }
/* 1.99zc: 🎬 a cam slot on the stage (stage-room.js camShow): the live cam over WHEP, a status line, tap-to-play */
.player .cam-stage { position: absolute; inset: 0; z-index: 1; background: #000; }
.player .cam-stage .cam-msg { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); max-width: 86%; text-align: center;
                              color: #ddd; background: rgba(0,0,0,.7); padding: 8px 12px; border-radius: 10px; font: 14px/1.35 var(--ds-font); z-index: 2; }
.player .cam-stage .cam-msg:empty, .player .cam-stage .cam-msg.hide { display: none; }
.player .cam-stage .cam-tap { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 3; min-height: 44px; padding: 0 18px;
                              border-radius: 999px; border: 1px solid rgba(255,255,255,.35); background: rgba(0,0,0,.7); color: #fff; font: bold 15px var(--ds-font); cursor: pointer; }
.player .cam-stage .cam-tap.hide { display: none; }