/* Broadcast OS v1.7.4 — Preset Room SCMA module */
.preset-watch-root{width:100%;background:#000;border-radius:22px;overflow:hidden;border:1px solid rgba(255,255,255,.13)}
.preset-watch-root video,.watch-audience-monitor video{width:100%;height:100%;object-fit:contain!important;background:#000;display:block}
.watch-audience-monitor.monitor{aspect-ratio:auto!important;height:auto!important;max-height:none!important;overflow:visible!important;display:block!important;padding:0!important;background:#000!important}
.watch-audience-monitor .watch-program{max-height:none!important;border:0!important;border-radius:22px;overflow:hidden;background:#000}
.watch-audience-monitor .watch-program-grid{height:auto!important;min-height:0!important;align-items:start;background:#000;gap:6px;padding:6px}
.watch-audience-monitor .watch-cell{border-radius:14px;background:#000;overflow:hidden;min-width:0;aspect-ratio:16/9}
.watch-audience-monitor .watch-cell-umd{display:none!important}
.watch-audience-monitor .watch-layout-1{grid-template-columns:minmax(0,1fr)}
.watch-audience-monitor .watch-layout-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.watch-audience-monitor .watch-layout-3,.watch-audience-monitor .watch-layout-4{grid-template-columns:repeat(2,minmax(0,1fr))}
.watch-audience-monitor .watch-layout-many{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));grid-auto-rows:auto}
.preset-host-layout{display:grid;grid-template-columns:minmax(0,7fr) minmax(210px,3fr);gap:8px;padding:8px;align-items:start}
.preset-spotlight{aspect-ratio:16/9;border-radius:18px;background:#000;overflow:hidden;min-width:0}.preset-side-row{display:grid;gap:8px;align-content:start;max-height:min(68vh,640px);overflow:auto}.preset-side-cell{aspect-ratio:16/9;border-radius:14px;background:#000;overflow:hidden}.preset-meeting-layout{display:grid;gap:10px;padding:8px}.preset-meeting-spotlight{width:min(100%,960px);margin-inline:auto;aspect-ratio:16/9;border-radius:18px;overflow:hidden;background:#000}.preset-meeting-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:8px}.preset-meeting-cell{aspect-ratio:16/9;border-radius:14px;overflow:hidden;background:#000}.preset-consent-card{max-width:560px}.pbc-show-format-panel{margin:14px 0;padding:14px;border-radius:18px;border:1px solid rgba(122,220,255,.25);background:linear-gradient(180deg,rgba(26,36,56,.78),rgba(8,12,20,.82))}.pbc-show-format-panel h3{margin:0 0 6px;font-size:12px;letter-spacing:.16em;color:#7adcff}.pbc-show-format-panel .field{margin:8px 0}.pbc-show-format-status{font-family:var(--pbc-mono);font-size:11px;color:#cfeeff;margin-top:8px}.pbc-viewer-row{display:flex;justify-content:space-between;gap:8px;align-items:center;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:8px;margin:6px 0;background:rgba(255,255,255,.04)}.pbc-source-pin{margin-top:7px;display:flex;gap:6px;flex-wrap:wrap}
@media(max-width:900px){.preset-host-layout{grid-template-columns:1fr}.preset-side-row{grid-auto-flow:column;grid-auto-columns:minmax(150px,42vw);overflow-x:auto;overflow-y:hidden}.watch-audience-monitor .watch-layout-2,.watch-audience-monitor .watch-layout-3,.watch-audience-monitor .watch-layout-4,.watch-audience-monitor .watch-layout-many{grid-template-columns:1fr}}

/* v1.7.7 — live-room integrity: one visible card per source + unmistakable live state. */
.watch-cell,.preset-spotlight,.preset-side-cell,.preset-meeting-spotlight,.preset-meeting-cell{position:relative}
.watch-live-dot{position:absolute;top:10px;left:10px;width:13px;height:13px;border-radius:999px;z-index:5;border:2px solid rgba(0,0,0,.72);box-shadow:0 0 0 1px rgba(255,255,255,.35),0 0 16px rgba(0,0,0,.4)}
.watch-live-dot.is-live{background:#21e66f;box-shadow:0 0 0 1px rgba(255,255,255,.35),0 0 18px rgba(33,230,111,.9)}
.watch-live-dot.is-offair{background:#ff9f1a;box-shadow:0 0 0 1px rgba(255,255,255,.35),0 0 18px rgba(255,159,26,.75)}
.preset-meeting-layout.is-single-source .preset-meeting-grid{display:none}

/* v1.7.20 — Meeting default Spotlight Overlay view.
   The spotlight owns the live-room real estate; participant cams sit as compact
   overlays that can be tapped to become the spotlight. */
.preset-meeting-overlay-layout{position:relative;display:block;padding:0;min-height:min(76vh,760px);height:min(76vh,760px);height:min(76dvh,760px);border-radius:22px;overflow:hidden;background:#000;isolation:isolate}
.preset-meeting-overlay-layout .preset-meeting-spotlight{position:absolute;inset:0;width:100%;height:100%;margin:0;aspect-ratio:auto;border-radius:0;background:#000}
.preset-meeting-overlay-layout .preset-meeting-spotlight video{object-fit:contain!important;transform:none!important;filter:none!important}
.preset-meeting-overlay-layout .preset-meeting-grid{position:absolute;left:10px;right:10px;bottom:72px;z-index:7;display:flex;gap:8px;align-items:flex-end;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;padding:6px;pointer-events:auto}
.preset-meeting-overlay-layout .preset-meeting-cell{flex:0 0 clamp(86px,18vw,156px);height:auto;aspect-ratio:16/10;border:1px solid rgba(255,255,255,.22);border-radius:16px;box-shadow:0 12px 34px rgba(0,0,0,.45);background:#000;overflow:hidden;cursor:pointer;padding:0;color:inherit}
.preset-meeting-overlay-layout .preset-meeting-cell video{object-fit:contain!important;transform:none!important;filter:none!important}
.preset-meeting-overlay-layout .preset-meeting-label{display:block!important;position:absolute;left:8px;right:8px;bottom:7px;z-index:8;padding:4px 7px;border-radius:999px;background:rgba(0,0,0,.56);color:#fff;font-size:.64rem;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none}
.preset-meeting-overlay-layout.is-single-source .preset-meeting-grid{display:none}
.preset-meeting-classic-layout .preset-meeting-label{display:block!important;position:absolute;left:8px;right:8px;bottom:7px;z-index:8;padding:4px 7px;border-radius:999px;background:rgba(0,0,0,.56);color:#fff;font-size:.64rem;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none}
@media(max-width:760px){.preset-meeting-overlay-layout{min-height:72vh;height:72vh;height:72dvh;border-radius:16px}.preset-meeting-overlay-layout .preset-meeting-grid{left:6px;right:6px;bottom:58px;gap:6px;padding:4px}.preset-meeting-overlay-layout .preset-meeting-cell{flex-basis:clamp(76px,28vw,118px);border-radius:12px}.preset-meeting-overlay-layout .preset-meeting-label{font-size:.58rem;padding:3px 6px;left:5px;right:5px;bottom:5px}}


/* v1.7.21 — cross-device Meeting Overlay and no-default-zoom safety.
   The overlay view must behave the same on iPhone, iPad, Android, Chromebook,
   laptop, desktop, and tablet browsers. Camera video is never cropped/zoomed by
   default; contain is mandatory for the live meeting view. */
.watch-audience-monitor .watch-program{min-height:min(76vh,760px);min-height:min(76dvh,760px)}
.bos-meet-spotlight-overlay-active .preset-meeting-overlay-layout{width:100%;max-width:100%;min-width:0;touch-action:manipulation}
.bos-meet-spotlight-overlay-active .preset-meeting-spotlight,
.bos-meet-spotlight-overlay-active .preset-meeting-cell{display:block;min-width:0;min-height:0}
.bos-meet-spotlight-overlay-active video{object-fit:contain!important;object-position:center center!important;transform:none!important;scale:1!important;max-width:100%;max-height:100%}
@supports (-webkit-touch-callout:none){.preset-meeting-overlay-layout{height:76svh}.watch-audience-monitor .watch-program{min-height:76svh}}


/* ===================================================================
   Broadcast OS v1.7.22 — Meeting Overlay Cross-Device Contract
   Scope: preset_room Meeting renderer only.
   Requirement: Meeting Spotlight Overlay must render the same structural
   overlay on iPhone, iPad, Android, Chromebook, tablet, laptop, and desktop.
   No camera frame may be cropped/zoomed by CSS default.
   =================================================================== */
.bos-meeting-render-host.watch-program,
.watch-audience-monitor .bos-meeting-render-host.watch-program{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  margin:0 auto !important;
  display:block !important;
  overflow:visible !important;
  background:#000 !important;
}
.watch-audience-monitor.monitor:has(.bos-meeting-render-host),
#watchMon.watch-audience-monitor.monitor{
  width:100% !important;
  max-width:1180px !important;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  aspect-ratio:auto !important;
  display:block !important;
  overflow:visible !important;
  padding:0 !important;
  background:#000 !important;
}
.bos-meeting-overlay-host .preset-meeting-overlay-layout{
  position:relative !important;
  display:block !important;
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  height:clamp(360px, 76vh, 760px) !important;
  height:clamp(360px, 76svh, 760px) !important;
  height:clamp(360px, 76dvh, 760px) !important;
  min-height:360px !important;
  max-height:760px !important;
  padding:0 !important;
  border-radius:22px !important;
  overflow:hidden !important;
  background:#000 !important;
  isolation:isolate !important;
  contain:layout paint !important;
  touch-action:manipulation !important;
}
.bos-meeting-overlay-host .preset-meeting-primary-surface,
.bos-meeting-overlay-host .preset-meeting-spotlight{
  position:absolute !important;
  inset:0 !important;
  z-index:1 !important;
  display:block !important;
  width:100% !important;
  height:100% !important;
  min-width:0 !important;
  min-height:0 !important;
  max-width:none !important;
  max-height:none !important;
  margin:0 !important;
  aspect-ratio:auto !important;
  border-radius:0 !important;
  overflow:hidden !important;
  background:#000 !important;
}
.bos-meeting-overlay-host .preset-meeting-grid{
  position:absolute !important;
  left:max(10px, env(safe-area-inset-left)) !important;
  right:max(10px, env(safe-area-inset-right)) !important;
  bottom:max(14px, env(safe-area-inset-bottom)) !important;
  z-index:8 !important;
  display:flex !important;
  flex-flow:row nowrap !important;
  align-items:flex-end !important;
  justify-content:flex-start !important;
  gap:8px !important;
  width:auto !important;
  max-width:none !important;
  min-width:0 !important;
  max-height:clamp(92px, 21vh, 176px) !important;
  padding:6px !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  overscroll-behavior-x:contain !important;
  -webkit-overflow-scrolling:touch !important;
  scrollbar-width:thin !important;
  pointer-events:auto !important;
}
.bos-meeting-overlay-host .preset-meeting-cell{
  position:relative !important;
  z-index:9 !important;
  display:block !important;
  flex:0 0 clamp(92px, 16vw, 162px) !important;
  width:clamp(92px, 16vw, 162px) !important;
  max-width:42vw !important;
  min-width:92px !important;
  height:auto !important;
  min-height:0 !important;
  aspect-ratio:16/10 !important;
  padding:0 !important;
  border-radius:16px !important;
  border:1px solid rgba(255,255,255,.25) !important;
  background:#000 !important;
  overflow:hidden !important;
  box-shadow:0 14px 36px rgba(0,0,0,.52) !important;
  cursor:pointer !important;
  touch-action:manipulation !important;
  -webkit-tap-highlight-color:transparent !important;
}
.bos-meeting-overlay-host video,
.bos-meeting-overlay-host .preset-meeting-spotlight video,
.bos-meeting-overlay-host .preset-meeting-cell video{
  display:block !important;
  width:100% !important;
  height:100% !important;
  max-width:100% !important;
  max-height:100% !important;
  min-width:0 !important;
  min-height:0 !important;
  object-fit:contain !important;
  object-position:center center !important;
  transform:none !important;
  translate:none !important;
  rotate:none !important;
  scale:1 !important;
  filter:none !important;
  background:#000 !important;
}
.bos-meeting-overlay-host .preset-meeting-label{
  display:block !important;
  position:absolute !important;
  left:8px !important;
  right:8px !important;
  bottom:7px !important;
  z-index:12 !important;
  padding:4px 7px !important;
  border-radius:999px !important;
  background:rgba(0,0,0,.62) !important;
  border:1px solid rgba(255,255,255,.14) !important;
  color:#fff !important;
  font-size:.64rem !important;
  font-weight:900 !important;
  line-height:1.05 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  pointer-events:none !important;
}
.bos-meeting-overlay-host .watch-live-dot{
  z-index:13 !important;
}
.bos-meeting-overlay-host .preset-meeting-overlay-layout.is-single-source .preset-meeting-grid,
.bos-meeting-overlay-host .preset-meeting-layout.is-single-source .preset-meeting-grid{
  display:none !important;
}
@media (max-width:900px){
  .watch-grid:has(.bos-meeting-render-host){display:block !important;}
  #watchMon.watch-audience-monitor.monitor{max-width:100% !important;border-radius:18px !important;}
  .bos-meeting-overlay-host .preset-meeting-overlay-layout{
    height:clamp(340px, 72vh, 720px) !important;
    height:clamp(340px, 72svh, 720px) !important;
    height:clamp(340px, 72dvh, 720px) !important;
    min-height:340px !important;
    border-radius:16px !important;
  }
  .bos-meeting-overlay-host .preset-meeting-grid{
    left:max(6px, env(safe-area-inset-left)) !important;
    right:max(6px, env(safe-area-inset-right)) !important;
    bottom:max(10px, env(safe-area-inset-bottom)) !important;
    gap:6px !important;
    padding:4px !important;
    max-height:clamp(82px, 19vh, 132px) !important;
  }
  .bos-meeting-overlay-host .preset-meeting-cell{
    flex-basis:clamp(78px, 28vw, 124px) !important;
    width:clamp(78px, 28vw, 124px) !important;
    min-width:78px !important;
    max-width:38vw !important;
    border-radius:12px !important;
  }
  .bos-meeting-overlay-host .preset-meeting-label{font-size:.58rem !important;padding:3px 6px !important;left:5px !important;right:5px !important;bottom:5px !important;}
}
@media (min-width:1200px){
  .bos-meeting-overlay-host .preset-meeting-overlay-layout{
    height:clamp(520px, 72vh, 760px) !important;
    height:clamp(520px, 72dvh, 760px) !important;
  }
}

/* v1.7.33 — Meeting enterprise A/V: audio-only participants remain visible
   as communication participants instead of disappearing from the meeting UI. */
.bos-meeting-overlay-host .watch-cell.is-audio-only,
.bos-meeting-render-host .watch-cell.is-audio-only{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:radial-gradient(circle at 50% 35%, rgba(65,105,225,.34), rgba(0,0,0,.94) 62%) !important;
}
.bos-meeting-overlay-host .preset-audio-only-avatar,
.bos-meeting-render-host .preset-audio-only-avatar{
  width:100% !important;
  height:100% !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  color:#fff !important;
  text-align:center !important;
  padding:16px !important;
  box-sizing:border-box !important;
}
.bos-meeting-overlay-host .preset-audio-only-avatar strong,
.bos-meeting-render-host .preset-audio-only-avatar strong{
  display:grid !important;
  place-items:center !important;
  width:74px !important;
  height:74px !important;
  max-width:42% !important;
  max-height:42% !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.14) !important;
  border:1px solid rgba(255,255,255,.28) !important;
  font-size:1.3rem !important;
  letter-spacing:.08em !important;
}
.bos-meeting-overlay-host .preset-audio-only-avatar span,
.bos-meeting-render-host .preset-audio-only-avatar span{
  font-size:.72rem !important;
  font-weight:900 !important;
  text-transform:uppercase !important;
  letter-spacing:.08em !important;
  opacity:.86 !important;
}
