/* Buddy Rooms client-surface contract v1 — release 0.18.25.
   Runtime corrective: exact viewport ownership, explicit room chrome, reversible board stage/popout. */
:root {
  --buddy-vv-width: 100vw;
  --buddy-vv-height: 100dvh;
  --buddy-vv-top: 0px;
  --buddy-vv-left: 0px;
  --buddy-safe-top: env(safe-area-inset-top, 0px);
  --buddy-safe-right: env(safe-area-inset-right, 0px);
  --buddy-safe-bottom: env(safe-area-inset-bottom, 0px);
  --buddy-safe-left: env(safe-area-inset-left, 0px);
}

html.buddy-room-active,
html.buddy-room-active body {
  width:100%;
  height:100%;
  min-height:0;
  overflow: hidden !important;
  overscroll-behavior:none;
}
html.buddy-room-active body {
  position:fixed;
  inset:0 auto auto 0;
  width:var(--buddy-vv-width);
  height:var(--buddy-vv-height);
  max-width:var(--buddy-vv-width);
  max-height:var(--buddy-vv-height);
}
html.buddy-room-active #app {
  width:100%;
  height:100%;
  min-height:0;
  overflow:hidden;
  padding:0;
}
html.buddy-room-active #app > main,
html.buddy-room-active body:has(#roomView:not(.hidden)) main {
  box-sizing:border-box;
  width:100%!important;
  height:100%!important;
  min-height:0;
  max-width:none!important;
  margin:0!important;
  padding:0;
  overflow:hidden;
}
html.buddy-room-active [data-buddy-room-root="true"] {
  box-sizing:border-box;
  width:100%;
  height:100%;
  min-width:0;
  min-height:0;
  max-height:100%;
  overflow: hidden !important;
  padding:max(8px,var(--buddy-safe-top)) max(8px,var(--buddy-safe-right)) max(74px,calc(var(--buddy-safe-bottom) + 62px)) max(8px,var(--buddy-safe-left));
  display:flex;
  flex-direction:column;
  gap:8px;
}
html.buddy-room-active [data-buddy-hidden-global-header="true"] { display:none!important; }
html.buddy-room-active #roomShell { flex:1 1 auto; min-width:0; min-height:0; height:auto!important; max-height:none!important; overflow:hidden; }
html.buddy-room-active #roomShell :is(.room-main,.video-grid,.participant-panel,.chat-panel,.participants-pane) { min-width:0; min-height:0; }
html.buddy-room-active :is(.chat-messages,.participant-list,.admission-list,.board-toolbar,[data-scroll-owner="true"]) {
  min-height:0;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}

/* Visible video must fit the available surface. Hidden live tracks stay mounted and silent visually. */
html.buddy-room-active .participant-tile video[data-buddy-media-surface="true"] {
  width:100%;
  height:100%;
  object-fit: contain!important;
  object-position:center!important;
  background:rgb(var(--rooms-rgb-02060b,2,6,11));
}
html.buddy-room-active video[data-buddy-media-hidden="true"] {
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  opacity:0!important;
  pointer-events:none!important;
  clip-path:inset(50%)!important;
}

/* Connection hub owns account and theme actions. Keep it below modal dialogs. */
.buddy-room-status-cluster {
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:7px;
  flex:0 0 auto;
  z-index:30;
}
.buddy-room-status-cluster > .connection-indicator {
  box-sizing:border-box;
  width:38px;
  height:38px;
  min-width:38px;
  min-height:38px;
  border-radius:999px!important;
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  padding:0!important;
}
.buddy-room-status-cluster > .connection-indicator { cursor:pointer; }
.buddy-room-theme-circle {
  border:1px solid var(--line-strong);
  color:rgb(var(--rooms-rgb-cbd8ea,203,216,234));
  background:rgba(255,255,255,.035);
}
.buddy-room-theme-circle svg { width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.8; }
.buddy-room-status-popover {
  position:absolute;
  inset-inline-end:0;
  top:calc(100% + 9px);
  width:min(300px,calc(var(--buddy-vv-width) - 24px));
  max-height:min(360px,calc(var(--buddy-vv-height) - 86px));
  overflow:auto;
  padding:12px;
  border:1px solid var(--line-strong);
  border-radius:15px;
  color:var(--text);
  background:rgb(var(--rooms-rgb-09121e,9,18,30));
  box-shadow:0 18px 60px rgba(0,0,0,.42);
  z-index:2500;
}
.buddy-room-status-popover[hidden] { display:none!important; }
.buddy-room-status-popover__state { margin:0 0 10px; color:var(--muted); font-size:10px; line-height:1.45; }
.buddy-room-status-popover__actions { display:grid; gap:7px; }
.buddy-room-status-popover__actions button { width:100%; min-height:40px; border:1px solid var(--line); background:rgba(255,255,255,.035); }
html[data-theme="light"] .buddy-room-theme-circle { color:rgb(var(--rooms-rgb-314a6d,49,74,109)); background:rgba(var(--rooms-rgb-3a5882,58,88,130),0.045); }
html[data-theme="light"] .buddy-room-status-popover { color:rgb(var(--rooms-rgb-142033,20,32,51)); background:#f9fbfe; }

/* Home preferences: one permanent header/toggle, one bounded body. */
.home-preferences {
  box-sizing:border-box;
  width:min(860px,100%);
  margin:14px 0 0;
  padding:0!important;
  overflow:hidden;
}
.home-preferences-head { margin:0!important; display:block!important; }
.home-preferences-toggle {
  width:100%;
  min-height:54px;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.15fr) 24px;
  align-items:center;
  gap:12px;
  padding:11px 15px;
  border:0;
  border-radius:17px;
  color:inherit;
  background:transparent;
  text-align:left;
}
.home-preferences-toggle:hover { background:rgba(var(--rooms-rgb-7ca6ff,124,166,255),0.045); }
.home-preferences-heading { min-width:0; }
.home-preferences-heading h2 { margin:0; font-size:14px; }
.home-preferences-heading p { margin:3px 0 0; color:var(--muted); font-size:9px; line-height:1.35; }
.home-preferences-summary { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:rgb(var(--rooms-rgb-8393a9,131,147,169)); font-size:9px; text-align:right; }
.home-preferences-chevron { justify-self:end; color:rgb(var(--rooms-rgb-8494aa,132,148,170)); font-size:16px; transition:transform .18s ease; }
.home-preferences.is-open .home-preferences-chevron { transform:rotate(180deg); }
.home-preferences-body { padding:12px 15px 14px; border-top:1px solid var(--line); }
.home-preferences-body[hidden] { display:none!important; }
.home-preferences:not(.is-open) .home-preferences-heading p { display:none; }
.home-preferences:not(.is-open) .home-preferences-toggle { min-height:48px; padding-block:8px; }

/* 0.21.16: the board is a first-class content stage, not a child of a video tile.
   The shared stage/video-rail geometry lives in presentations-0.19.0.css so board
   and slide presentation use the same room composition. */
html.buddy-room-active [data-buddy-board-root="true"][data-buddy-board-surface="stage"] {
  position:relative!important;
  inset:auto!important;
  grid-column:1!important;
  grid-row:1!important;
  align-self:stretch;
  justify-self:stretch;
  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;
  padding:0!important;
  transform:none!important;
  z-index:1;
  display:block!important;
  overflow:hidden;
  border:1px solid rgb(var(--rooms-rgb-20334d,32,51,77));
  border-radius:16px;
  background:rgb(var(--rooms-rgb-07101b,7,16,27));
  backdrop-filter:none;
}
html.buddy-room-active [data-buddy-board-root="true"][data-buddy-board-surface="stage"] .whiteboard-shell {
  position:relative!important;
  inset:auto!important;
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  min-height:0!important;
  max-width:none!important;
  max-height:none!important;
  display:grid!important;
  transform:none!important;
  resize:none!important;
  border:0!important;
  border-radius:inherit;
  box-shadow:none!important;
}
html.buddy-room-active [data-buddy-board-root="true"][data-buddy-board-surface="stage"] .board-window-head { cursor:default!important; }
html.buddy-room-active [data-buddy-board-root="true"][data-buddy-board-surface="stage"] .board-canvas-wrap { min-width:0; min-height:0; overflow:hidden; }
html.buddy-room-active [data-buddy-board-root="true"][data-buddy-board-surface="stage"] .board-stage { min-width:0!important; min-height:0!important; }

html.buddy-room-active [data-buddy-board-root="true"][data-buddy-board-surface="floating"] {
  touch-action:none;
  overscroll-behavior:none;
  max-width:calc(var(--buddy-vv-width) - 16px)!important;
  max-height:calc(var(--buddy-vv-height) - 16px)!important;
}

/* True same-origin browser/OS popout. */
html.buddy-board-popout,
html.buddy-board-popout body { margin:0; width:100%; height:100%; overflow:hidden; background:rgb(var(--rooms-rgb-07101b,7,16,27)); color:var(--text); }
.buddy-board-popout-shell { width:100%; height:100%; display:flex; flex-direction:column; min-width:0; min-height:0; }
.buddy-board-popout-bar { flex:0 0 auto; display:flex; align-items:center; justify-content:space-between; gap:10px; padding:8px 10px; border-bottom:1px solid var(--line); background:rgb(var(--rooms-rgb-09121e,9,18,30)); }
.buddy-board-popout-bar button { min-height:36px; padding:0 12px; }
.buddy-board-popout-content { position:relative; flex:1 1 auto; min-width:0; min-height:0; overflow:hidden; }
.buddy-board-popout-content > [data-buddy-board-root="true"] { position:absolute!important; inset:0!important; width:100%!important; height:100%!important; max-width:none!important; max-height:none!important; transform:none!important; }
.buddy-board-popout-content .whiteboard-shell { inset:0!important; width:100%!important; height:100%!important; max-width:none!important; max-height:none!important; transform:none!important; resize:none!important; }

/* Surface controls stay available in the board header; old mobile rule hid every action except close. */
@media (max-width:900px) {
  html.buddy-room-active [data-buddy-room-root="true"] { padding:6px 6px max(68px,calc(var(--buddy-safe-bottom) + 58px)); }
  html.buddy-room-active .room-head { flex:0 0 auto; }
  html.buddy-room-active #roomShell { flex:1 1 auto; min-height:0!important; height:auto!important; max-height:none!important; }
  html.buddy-room-active .room-resize-handle { display:none!important; }
  html.buddy-room-active .toolbar-wrap { position:fixed!important; left:6px!important; right:6px!important; bottom:max(4px,var(--buddy-safe-bottom))!important; transform:none!important; width:auto!important; max-width:none!important; margin:0!important; }
  html.buddy-room-active #whiteboardModal .board-window-actions #boardStageBtn,
  html.buddy-room-active #whiteboardModal .board-window-actions #boardWindowToggleBtn,
  html.buddy-room-active #whiteboardModal .board-window-actions #whiteboardCloseBtn { display:grid!important; }
  .buddy-room-status-popover { position:fixed; top:calc(var(--buddy-safe-top) + 58px); right:10px; left:auto; }
  .home-preferences-toggle { grid-template-columns:minmax(0,1fr) 24px; }
  .home-preferences-summary { grid-column:1 / -1; grid-row:2; text-align:left; white-space:normal; line-height:1.35; }
  .home-preferences-chevron { grid-column:2; grid-row:1; }
  .home-preferences-form { grid-template-columns:1fr 1fr; }
}

@media (max-width:820px) {
  .home-preferences { max-width:540px; }
}

@media (max-width:560px) {
  .home-preferences-form { grid-template-columns:1fr; }
  .home-preferences-form #saveHomePreferencesBtn { grid-column:auto; }
  html.buddy-room-active [data-buddy-board-root="true"][data-buddy-board-surface="stage"] .whiteboard-shell {
    grid-template-columns:minmax(0,1fr) minmax(64px,86px)!important;
  }
}



/* 0.18.27 owner corrective: compact header, stable home disclosure, legacy room-height handle hidden. */
#roomResizeHandle.room-resize-handle {
  display:none!important;
  width:0!important;
  height:0!important;
  min-height:0!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
  pointer-events:none!important;
}

/* The disclosure is one strip when closed and the same bounded main-column width when open. */
.home-preferences { align-self:center; }
.home-preferences:not(.is-open) .home-preferences-body { display:none!important; }
.home-preferences:not(.is-open) .home-preferences-toggle { min-height:48px!important; }

@media (max-width:820px) {
  .home-preferences { width:min(540px,100%)!important; max-width:540px!important; }
}

/* 0.18.34 header compression: text gives way to icons before actions are allowed to wrap. */
html.buddy-room-active .br-room-header-responsive .room-head-actions { flex-wrap:nowrap!important; }
@media (max-width:1320px) and (min-width:761px) {
  html.buddy-room-active .br-room-header-responsive {
    display:grid!important;
    grid-template-columns:minmax(150px,1fr) max-content!important;
    column-gap:10px!important;
    align-items:center!important;
  }
  html.buddy-room-active .br-room-header-responsive .room-head-actions {
    width:max-content!important;
    max-width:none!important;
    flex:0 0 auto!important;
    flex-wrap:nowrap!important;
    gap:6px!important;
  }
  html.buddy-room-active .br-room-header-responsive .room-head-action,
  html.buddy-room-active .br-room-header-responsive .admission-notice {
    width:38px!important;
    min-width:38px!important;
    height:38px!important;
    min-height:38px!important;
    padding:0!important;
    justify-content:center!important;
    gap:0!important;
  }
  html.buddy-room-active .br-room-header-responsive .room-head-action > span,
  html.buddy-room-active .br-room-header-responsive .admission-notice > span { display:none!important; }
  html.buddy-room-active .br-room-header-responsive .transcription-action-state {
    position:absolute!important; right:4px!important; bottom:4px!important; width:7px!important; height:7px!important;
    border:2px solid rgb(var(--rooms-rgb-0d1725,13,23,37))!important; box-sizing:content-box!important;
  }
  html.buddy-room-active .br-room-header-responsive .buddy-room-status-cluster { gap:6px!important; }
}

/* Keep icon header actions on one physical row until the viewport truly cannot contain them. */
@media (max-width:760px) {
  html.buddy-room-active .br-room-header-responsive {
    grid-template-columns:minmax(58px,1fr) max-content!important;
    column-gap:6px!important;
    align-items:start!important;
  }
  html.buddy-room-active .br-room-header-responsive .room-title-group { min-width:0!important; }
  html.buddy-room-active .br-room-header-responsive .room-head-actions,
  html.buddy-room-active .br-room-header-responsive [class*="actions" i] {
    width:max-content!important;
    max-width:none!important;
    min-width:0!important;
    flex:0 0 auto!important;
    flex-wrap:nowrap!important;
    gap:4px!important;
  }
  html.buddy-room-active .br-room-header-responsive .buddy-room-status-cluster { gap:4px!important; }
  html.buddy-room-active .br-room-header-responsive .room-head-action,
  html.buddy-room-active .br-room-header-responsive .admission-notice { width:34px!important; min-width:34px!important; height:34px!important; min-height:34px!important; padding:0!important; justify-content:center!important; }
  html.buddy-room-active .br-room-header-responsive .transcription-action { position:relative!important; }
  html.buddy-room-active .br-room-header-responsive .transcription-action-state { position:absolute!important; right:2px!important; bottom:2px!important; width:6px!important; height:6px!important; border:2px solid rgb(var(--rooms-rgb-0d1725,13,23,37))!important; box-sizing:content-box!important; }
}

/* At genuinely constrained widths wrapping is allowed only below the supported 320px target. */
@media (max-width:319px) {
  html.buddy-room-active .br-room-header-responsive { grid-template-columns:minmax(0,1fr) auto!important; }
  html.buddy-room-active .br-room-header-responsive .room-head-actions,
  html.buddy-room-active .br-room-header-responsive [class*="actions" i] {
    max-width:230px!important;
    flex-wrap:wrap!important;
  }
}

/* v0.18.30 owner corrective: the board is a responsive canvas, never a scrollable mini-page. */
html.buddy-room-active [data-buddy-board-root="true"] .whiteboard-shell,
html.buddy-board-popout .whiteboard-shell {
  min-width:320px!important;
  min-height:260px!important;
  border-width:1px!important;
  overflow:hidden!important;
}
html.buddy-room-active [data-buddy-board-root="true"] .board-toolbar,
html.buddy-board-popout .board-toolbar {
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  overflow:visible!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  align-content:flex-start!important;
  flex-wrap:wrap!important;
  gap:6px!important;
  padding:7px 9px!important;
}
html.buddy-room-active [data-buddy-board-root="true"] .board-toolbar > *,
html.buddy-board-popout .board-toolbar > * { flex:0 0 auto!important; }
html.buddy-room-active [data-buddy-board-root="true"] .board-canvas-wrap,
html.buddy-board-popout .board-canvas-wrap {
  min-width:0!important;
  min-height:0!important;
  overflow:hidden!important;
  overscroll-behavior:none!important;
  display:grid!important;
  place-items:center!important;
  padding:10px!important;
  container-type:size;
}
html.buddy-room-active [data-buddy-board-root="true"] .board-stage,
html.buddy-board-popout .board-stage {
  position:relative!important;
  min-width:0!important;
  min-height:0!important;
  width:100%!important;
  width:min(100cqw,177.7778cqh)!important;
  height:auto!important;
  max-width:100%!important;
  max-height:100%!important;
  aspect-ratio:16/9!important;
  flex:none!important;
}
html.buddy-room-active [data-buddy-board-root="true"] #boardCanvas,
html.buddy-board-popout #boardCanvas { width:100%!important; height:100%!important; display:block!important; }

/* On-stage board: header, tools, then the largest possible 16:9 canvas. */
html.buddy-room-active [data-buddy-board-root="true"][data-buddy-board-surface="stage"] .whiteboard-shell {
  grid-template-columns:minmax(0,1fr)!important;
  grid-template-rows:auto auto minmax(0,1fr)!important;
}
html.buddy-room-active [data-buddy-board-root="true"][data-buddy-board-surface="stage"] .board-window-head {
  grid-column:1!important;
  grid-row:1!important;
}
html.buddy-room-active [data-buddy-board-root="true"][data-buddy-board-surface="stage"] .board-toolbar {
  grid-column:1!important;
  grid-row:2!important;
}
html.buddy-room-active [data-buddy-board-root="true"][data-buddy-board-surface="stage"] .board-canvas-wrap {
  grid-column:1!important;
  grid-row:3!important;
}
html.buddy-room-active [data-buddy-board-root="true"][data-buddy-board-surface="stage"] .board-divider {
  width:1px!important;
  height:28px!important;
  min-width:1px!important;
  min-height:28px!important;
}

/* Floating window may become genuinely small instead of growing scrollbars. */
html.buddy-room-active [data-buddy-board-root="true"][data-buddy-board-surface="floating"] .whiteboard-shell {
  min-width:320px!important;
  min-height:260px!important;
  box-shadow:0 16px 44px rgba(0,0,0,.48)!important;
}

.transcription-scope-card { width:min(620px,calc(100vw - 24px)); }
.transcription-scope-options { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:18px 0 12px; }
.transcription-scope-option { min-height:96px; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:7px; padding:14px 16px; text-align:left; }
.transcription-scope-option strong { font-size:14px; }
.transcription-scope-option span { color:var(--muted); font-size:11px; line-height:1.45; }
@media (max-width:520px) {
  .transcription-scope-options { grid-template-columns:1fr; }
  html.buddy-room-active [data-buddy-board-root="true"] .board-toolbar { gap:4px!important; padding:5px!important; }
  html.buddy-room-active [data-buddy-board-root="true"] .board-toolbar :is(button,select) { min-height:32px!important; }
}


/* 0.18.35 owner-approved transcription visual parity.
   One click target; stable document label; state lives inside the same control. */
html.buddy-room-active .br-room-header-responsive .transcription-action {
  position:relative!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  min-height:40px;
  padding:0 9px!important;
  white-space:nowrap!important;
  overflow:visible!important;
}
html.buddy-room-active .br-room-header-responsive .transcription-action > .transcription-action-label {
  display:inline-block!important;
  white-space:nowrap!important;
  line-height:1!important;
}
html.buddy-room-active .br-room-header-responsive .transcription-action-state {
  position:relative!important;
  right:auto!important;
  bottom:auto!important;
  top:auto!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 auto!important;
  width:7px!important;
  min-width:7px!important;
  height:7px!important;
  padding:0!important;
  border:0!important;
  border-radius:999px!important;
  box-sizing:border-box!important;
  color:rgb(var(--rooms-rgb-dbe6f7,219,230,247))!important;
  background:rgb(var(--rooms-rgb-8697b4,134,151,180))!important;
  box-shadow:0 0 0 3px rgba(var(--rooms-rgb-8697b4,134,151,180),0.1)!important;
  font-style:normal!important;
}
html.buddy-room-active .br-room-header-responsive .transcription-action-state-text {
  display:none;
  white-space:nowrap!important;
  font:800 9px/1 "Segoe UI Variable","Segoe UI",sans-serif!important;
  letter-spacing:0!important;
}
html.buddy-room-active .br-room-header-responsive .transcription-action.is-active {
  color:rgb(var(--rooms-rgb-dbe8ff,219,232,255))!important;
  border-color:rgba(var(--rooms-rgb-5280ff,82,128,255),0.48)!important;
  background:rgba(var(--rooms-rgb-2a4fab,42,79,171),0.22)!important;
}
html.buddy-room-active .br-room-header-responsive .transcription-action.is-active .transcription-action-state,
html.buddy-room-active .br-room-header-responsive .transcription-action.is-ready .transcription-action-state {
  width:auto!important;
  min-width:54px!important;
  height:26px!important;
  padding:0 8px 0 6px!important;
  gap:5px!important;
  border:1px solid transparent!important;
  box-shadow:none!important;
}
html.buddy-room-active .br-room-header-responsive .transcription-action.is-active .transcription-action-state {
  color:rgb(var(--rooms-rgb-dce8ff,220,232,255))!important;
  border-color:rgba(var(--rooms-rgb-5280ff,82,128,255),0.46)!important;
  background:rgba(var(--rooms-rgb-2754c2,39,84,194),0.34)!important;
}
html.buddy-room-active .br-room-header-responsive .transcription-action.is-active .transcription-action-state::before {
  content:"";
  flex:0 0 14px;
  width:14px;
  height:14px;
  border-radius:50%;
  background:
    linear-gradient(rgb(var(--rooms-rgb-e7efff,231,239,255)),rgb(var(--rooms-rgb-e7efff,231,239,255))) 3px 5px/1.5px 4px no-repeat,
    linear-gradient(rgb(var(--rooms-rgb-e7efff,231,239,255)),rgb(var(--rooms-rgb-e7efff,231,239,255))) 6px 3px/1.5px 8px no-repeat,
    linear-gradient(rgb(var(--rooms-rgb-e7efff,231,239,255)),rgb(var(--rooms-rgb-e7efff,231,239,255))) 9px 4.5px/1.5px 5px no-repeat,
    rgb(var(--rooms-rgb-3569d8,53,105,216));
}
html.buddy-room-active .br-room-header-responsive .transcription-action.is-active .transcription-action-state-text,
html.buddy-room-active .br-room-header-responsive .transcription-action.is-ready .transcription-action-state-text { display:inline-block!important; }
html.buddy-room-active .br-room-header-responsive .transcription-action.is-stopping { opacity:.78; }
html.buddy-room-active .br-room-header-responsive .transcription-action.is-stopping .transcription-action-state-text { min-width:10px; text-align:center; }
html.buddy-room-active .br-room-header-responsive .transcription-action.is-ready {
  color:#d9f7e5!important;
  border-color:rgba(75,211,137,.42)!important;
  background:rgba(23,89,56,.22)!important;
}
html.buddy-room-active .br-room-header-responsive .transcription-action.is-ready .transcription-action-state {
  min-width:66px!important;
  color:#d9f7e5!important;
  border-color:rgba(75,211,137,.42)!important;
  background:rgba(24,118,72,.34)!important;
}
html.buddy-room-active .br-room-header-responsive .transcription-action.is-ready .transcription-action-state::before {
  content:"✓";
  flex:0 0 14px;
  width:14px;
  height:14px;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:#f5fff9;
  background:#24c979;
  font:900 10px/14px "Segoe UI Variable","Segoe UI",sans-serif;
}

/* Medium: other header controls are icons, transcription stays recognizable as icon + short label. */
@media (max-width:1320px) and (min-width:761px) {
  html.buddy-room-active .br-room-header-responsive .transcription-action {
    width:150px!important;
    min-width:150px!important;
    height:40px!important;
    min-height:40px!important;
    padding:0 8px!important;
    justify-content:flex-start!important;
    gap:7px!important;
  }
  html.buddy-room-active .br-room-header-responsive .transcription-action > .transcription-action-label {
    display:inline-block!important;
    min-width:0!important;
    font-size:10px!important;
  }
  html.buddy-room-active .br-room-header-responsive .transcription-action-state {
    margin-left:auto!important;
  }
  html.buddy-room-active .br-room-header-responsive .transcription-action.is-active .transcription-action-state,
  html.buddy-room-active .br-room-header-responsive .transcription-action.is-ready .transcription-action-state {
    width:16px!important;
    min-width:16px!important;
    height:16px!important;
    padding:0!important;
    gap:0!important;
    border-radius:50%!important;
  }
  html.buddy-room-active .br-room-header-responsive .transcription-action-state-text { display:none!important; }
  html.buddy-room-active .br-room-header-responsive .transcription-action.is-active .transcription-action-state::before,
  html.buddy-room-active .br-room-header-responsive .transcription-action.is-ready .transcription-action-state::before {
    flex-basis:14px;
    width:14px;
    height:14px;
  }
}

/* Narrow: icon-only button, but completed/active state is a badge on that document icon — never a second loose green dot. */
@media (max-width:760px) {
  html.buddy-room-active .br-room-header-responsive .transcription-action {
    width:34px!important;
    min-width:34px!important;
    height:34px!important;
    min-height:34px!important;
    padding:0!important;
    gap:0!important;
    overflow:visible!important;
  }
  html.buddy-room-active .br-room-header-responsive .transcription-action > .transcription-action-label { display:none!important; }
  html.buddy-room-active .br-room-header-responsive .transcription-action-state {
    position:absolute!important;
    right:2px!important;
    top:2px!important;
    bottom:auto!important;
    margin:0!important;
  }
  html.buddy-room-active .br-room-header-responsive .transcription-action.is-active .transcription-action-state,
  html.buddy-room-active .br-room-header-responsive .transcription-action.is-ready .transcription-action-state {
    right:-3px!important;
    top:-3px!important;
    width:16px!important;
    min-width:16px!important;
    height:16px!important;
    padding:0!important;
    gap:0!important;
    border:2px solid rgb(var(--rooms-rgb-0d1725,13,23,37))!important;
    border-radius:50%!important;
  }
  html.buddy-room-active .br-room-header-responsive .transcription-action-state-text { display:none!important; }
  html.buddy-room-active .br-room-header-responsive .transcription-action.is-active .transcription-action-state::before,
  html.buddy-room-active .br-room-header-responsive .transcription-action.is-ready .transcription-action-state::before {
    flex-basis:12px;
    width:12px;
    height:12px;
    font-size:8px;
    line-height:12px;
  }
}

/* 0.18.38 owner-approved UX implementation: transcription lifecycle, compact rail, More menu, My Rooms 10. */
.section-collapse-control { min-height:36px; display:inline-flex; align-items:center; justify-content:center; gap:7px; padding:0 11px; border:1px solid var(--line-strong); border-radius:11px; color:rgb(var(--rooms-rgb-dbe6f7,219,230,247)); background:rgba(255,255,255,.03); font-size:9px; font-weight:800; white-space:nowrap; }
.section-collapse-control:hover,.section-collapse-control:focus-visible { border-color:rgba(var(--rooms-rgb-7ca6ff,124,166,255),0.48); background:rgba(var(--rooms-rgb-7ca6ff,124,166,255),0.1); }
.my-rooms-head-controls { display:flex; align-items:center; gap:8px; }
.home-preferences-collapse { display:inline-flex; align-items:center; gap:5px; white-space:nowrap; color:rgb(var(--rooms-rgb-aebbd0,174,187,208)); font-size:9px; font-weight:800; }
.my-rooms:not(.is-collapsed) .my-rooms-list { max-height:266px; overflow-y:auto; padding-right:4px; scrollbar-gutter:stable; }
.my-rooms.is-collapsed { padding-block:14px; }
.my-rooms.is-collapsed .my-rooms-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px 8px; max-height:none; overflow:visible; }
.my-room-quick { min-width:0; min-height:32px; display:grid; grid-template-columns:8px minmax(0,1fr) auto; align-items:center; gap:8px; padding:0 10px; border:1px solid var(--line); border-radius:9px; color:rgb(var(--rooms-rgb-e7eef9,231,238,249)); background:rgba(255,255,255,.024); text-align:left; cursor:pointer; transition:background .14s,border-color .14s,transform .08s,box-shadow .14s; }
.my-room-quick b { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:9px; }
.my-room-quick-dot { width:7px; height:7px; border-radius:50%; background:#4bd389; box-shadow:0 0 0 3px rgba(75,211,137,.08); }
.my-room-quick-enter { color:rgb(var(--rooms-rgb-a9c2f4,169,194,244)); font-size:8px; font-weight:850; white-space:nowrap; }
.my-room-quick:hover,.my-room-quick:focus-visible { border-color:rgba(var(--rooms-rgb-7ca6ff,124,166,255),0.48); background:rgba(var(--rooms-rgb-7ca6ff,124,166,255),0.11); box-shadow:0 0 0 2px rgba(var(--rooms-rgb-7ca6ff,124,166,255),0.07); outline:none; }
.my-room-quick:active { transform:translateY(1px); background:rgba(var(--rooms-rgb-567cdc,86,124,220),0.2); }
.transcription-run-action { width:40px!important; min-width:40px!important; padding:0!important; justify-content:center!important; }
.transcription-run-action > span { display:none!important; }
.transcription-run-action.is-stop { color:#ffd9dd!important; border-color:rgba(255,91,111,.42)!important; background:rgba(118,24,37,.24)!important; }
.mobile-more-separator { height:1px; margin:5px 5px 1px; background:var(--line); }
.mobile-more-section-label { padding:4px 8px 2px; color:rgb(var(--rooms-rgb-718198,113,129,152)); font-size:8px; font-weight:850; letter-spacing:.08em; }
.br-surface-action.mobile-more-action { width:100%!important; min-height:44px!important; justify-content:initial!important; background:transparent!important; color:rgb(var(--rooms-rgb-c6d3e6,198,211,230))!important; }
.br-surface-glyph { width:18px; display:grid; place-items:center; justify-self:center; color:rgb(var(--rooms-rgb-a9bbd7,169,187,215)); font-size:15px; }
.transcript-card .modal-form-actions svg { width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:1.9; }

@media (max-width:900px) {
  .my-rooms.is-collapsed .my-rooms-list { grid-template-columns:1fr; max-height:184px; overflow-y:auto; padding-right:3px; scrollbar-gutter:stable; }
  .my-room-quick { min-height:30px; }
  .video-grid.primary-rail-mode { display:grid!important; grid-template-columns:minmax(0,1fr)!important; grid-template-rows:minmax(0,1fr) auto!important; gap:8px!important; overflow:hidden!important; align-content:stretch!important; }
  .video-grid.primary-rail-mode > .participant-tile.is-focused { grid-column:1!important; grid-row:1!important; width:100%!important; height:100%!important; min-height:0!important; flex:none!important; order:0!important; }
  .focus-thumbnail-rail { grid-column:1; grid-row:2; min-width:0; display:grid; grid-auto-flow:column; grid-template-rows:repeat(2,70px); grid-auto-columns:minmax(108px,28vw); gap:7px; overflow-x:auto; overflow-y:hidden; padding:0 2px 3px; scroll-snap-type:x proximity; }
  .focus-thumbnail-rail.one-row { grid-template-rows:70px; }
  .focus-thumbnail-rail .participant-tile { width:auto!important; min-width:0!important; height:70px!important; min-height:70px!important; grid-column:auto!important; grid-row:auto!important; flex:none!important; scroll-snap-align:start; }
  .focus-thumbnail-rail .participant-role,.focus-thumbnail-rail .media-state,.focus-thumbnail-rail .tile-actions { display:none!important; }
  .focus-thumbnail-rail .participant-name { padding:4px 6px!important; font-size:8px!important; }
  .focus-thumbnail-rail .participant-meta { left:5px!important; bottom:5px!important; }
  .focus-thumbnail-rail .tile-focus-btn { width:26px!important; height:26px!important; right:5px!important; top:5px!important; }
}

/* Approved medium behavior: transcription status becomes icon-only before it can collide. */
@media (max-width:1180px) and (min-width:761px) {
  html.buddy-room-active .br-room-header-responsive .transcription-action { width:40px!important; min-width:40px!important; padding:0!important; justify-content:center!important; overflow:visible!important; }
  html.buddy-room-active .br-room-header-responsive .transcription-action > .transcription-action-label { display:none!important; }
  html.buddy-room-active .br-room-header-responsive .transcription-action-state { position:absolute!important; right:-3px!important; top:-3px!important; margin:0!important; }
  html.buddy-room-active .br-room-header-responsive .transcription-action.is-active .transcription-action-state,
  html.buddy-room-active .br-room-header-responsive .transcription-action.is-ready .transcription-action-state { width:16px!important; min-width:16px!important; height:16px!important; padding:0!important; border:2px solid rgb(var(--rooms-rgb-0d1725,13,23,37))!important; border-radius:50%!important; }
  html.buddy-room-active .br-room-header-responsive .transcription-action-state-text { display:none!important; }
}


/* 0.18.39 owner-approved transcript session history + account timezone preference. */
.home-pref-timezone { display:grid; gap:5px; min-width:220px; }
.home-pref-timezone > span { color:var(--muted); font-size:10px; font-weight:800; }
.home-pref-timezone > small { color:rgb(var(--rooms-rgb-718198,113,129,152)); font-size:8px; line-height:1.35; }
.home-pref-timezone select { min-width:220px; }
.settings-card #roomTimezoneSelect { min-width:0; }
.transcript-card { width:min(1160px,calc(100vw - 24px)); }
.transcript-modal-head { align-items:flex-start; gap:16px; }
.transcript-head-copy { min-width:0; flex:1 1 auto; }
.transcript-head-actions { display:flex; align-items:center; justify-content:flex-end; gap:8px; flex-wrap:wrap; }
.transcript-head-actions svg { width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:1.9; }
.transcript-sessions { min-height:220px; max-height:68vh; padding:0; border:0; background:transparent!important; white-space:normal; overflow:auto; display:grid; gap:9px; }
.transcript-session { border:1px solid var(--line); border-radius:13px; background:rgba(var(--rooms-rgb-0a1523,10,21,35),0.82); overflow:hidden; }
.transcript-session-toggle { width:100%; min-height:58px; display:flex; align-items:center; justify-content:space-between; gap:14px; padding:11px 13px; border:0; color:var(--text); background:transparent; text-align:left; }
.transcript-session-toggle:hover,.transcript-session-toggle:focus-visible { background:rgba(var(--rooms-rgb-7ca6ff,124,166,255),0.07); outline:none; }
.transcript-session-heading { display:grid; gap:3px; min-width:0; }
.transcript-session-heading b { font-size:12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.transcript-session-heading small { color:var(--muted); font-size:9px; }
.transcript-session-right { display:flex; align-items:center; gap:12px; flex:0 0 auto; }
.transcript-session-status { min-width:86px; min-height:24px; display:inline-flex; align-items:center; justify-content:center; padding:0 10px; border-radius:999px; font-size:8px; font-style:normal; font-weight:850; }
.transcript-session-status.ready { color:#9ff2c4; border:1px solid rgba(75,211,137,.48); background:rgba(23,89,56,.35); }
.transcript-session-status.active { color:rgb(var(--rooms-rgb-bcd3ff,188,211,255)); border:1px solid rgba(var(--rooms-rgb-5e8fff,94,143,255),0.55); background:rgba(var(--rooms-rgb-204b96,32,75,150),0.3); }
.transcript-session-status.pending { color:#ffe0a6; border:1px solid rgba(245,181,63,.42); background:rgba(120,81,19,.25); }
.transcript-session-status.failed { color:#ffd0d6; border:1px solid rgba(255,91,111,.42); background:rgba(118,24,37,.25); }
.transcript-session-chevron { width:18px; text-align:center; color:rgb(var(--rooms-rgb-9fb0c8,159,176,200)); font-size:14px; }
.transcript-session-body { padding:0 13px 13px; }
.transcript-session-text { min-height:118px; max-height:38vh; overflow:auto; padding:13px; border:1px solid rgba(var(--rooms-rgb-5c779b,92,119,155),0.24); border-radius:11px; color:var(--text); background:rgba(var(--rooms-rgb-03080f,3,8,15),0.42); white-space:pre-wrap; overflow-wrap:anywhere; font:500 12px/1.65 "Segoe UI",sans-serif; }
.transcript-session-footer { margin-top:9px; display:flex; align-items:center; justify-content:space-between; gap:12px; }
.transcript-session-footer small { color:rgb(var(--rooms-rgb-718198,113,129,152)); font-size:8px; }
html[data-theme="light"] .transcript-session { background:rgba(255,255,255,.78); }
html[data-theme="light"] .transcript-session-text { background:rgba(var(--rooms-rgb-f7faff,247,250,255),0.92); }
@media (max-width:900px) {
  .transcript-card { width:100%; }
  .transcript-modal-head { display:grid; grid-template-columns:1fr auto; }
  .transcript-head-actions { grid-column:1 / -1; justify-content:flex-start; }
  .transcript-head-actions #transcriptCloseBtn { position:absolute; right:12px; top:12px; }
  .transcript-sessions { max-height:64vh; }
  .transcript-session-toggle { min-height:62px; padding:10px 11px; }
  .transcript-session-right { gap:7px; }
  .transcript-session-status { min-width:74px; padding:0 8px; }
  .transcript-session-text { min-height:150px; font-size:14px; }
  .transcript-session-footer { align-items:flex-start; flex-direction:column; }
  .transcript-session-copy { width:100%; }
  .home-pref-timezone { min-width:0; grid-column:1 / -1; }
  .home-pref-timezone select,.settings-card #roomTimezoneSelect { min-width:0; width:100%; }
}

/* Room account rows: one hit target, descriptive copy, decorative theme indicator. */
.buddy-room-status-popover .buddy-room-menu-row {
  display:flex; align-items:center; gap:12px; padding:12px 10px;
  text-align:left; color:var(--text); border:1px solid transparent;
  border-radius:12px; background:transparent; min-width:0;
}
.buddy-room-menu-row > svg { width:20px; height:20px; flex:0 0 20px; }
.buddy-room-menu-row svg { fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.buddy-room-menu-copy { display:grid; gap:4px; min-width:0; flex:1; }
.buddy-room-menu-copy b { font-size:13px; line-height:1.3; }
.buddy-room-menu-copy small { font-size:11px; line-height:1.4; font-weight:400; color:var(--muted); }
.buddy-room-status-popover .buddy-room-menu-row:hover { background:var(--accent-soft,rgba(255,166,72,.09)); border-color:var(--line); }
.buddy-room-status-popover .buddy-room-menu-row:focus-visible { outline:2px solid var(--accent); outline-offset:1px; }
.buddy-room-menu-row.is-signout > svg,.buddy-room-menu-row.is-signout b { color:var(--danger,#fb7185); }
.buddy-room-theme-preview { display:flex; gap:3px; padding:3px; border:1px solid var(--line); border-radius:10px; flex:none; }
.buddy-room-theme-preview > span { width:26px; height:26px; display:grid; place-items:center; border-radius:7px; color:var(--muted); }
.buddy-room-theme-preview svg { width:18px; height:18px; }
.buddy-room-menu-row[data-theme="light"] [data-theme-option="light"],
.buddy-room-menu-row[data-theme="dark"] [data-theme-option="dark"] { color:var(--accent-ink,rgb(var(--rooms-rgb-101720,16,23,32))); background:var(--accent); }

/* Constrain settings by their card, not by the viewport or intrinsic SVG size. */
#roomSettingsModal .settings-card { width:min(460px,100%); }
#roomSettingsModal .settings-card > *,#roomSettingsModal .settings-section > * { min-width:0; }
#roomSettingsModal .settings-card :is(input,select) { min-width:0; max-width:100%; }
#roomSettingsModal .inline-field button { display:flex; align-items:center; justify-content:center; gap:7px; }
#roomSettingsModal .inline-field button svg { width:17px; height:17px; flex:0 0 17px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
#roomSettingsModal .meme-pack-field { grid-template-columns:minmax(0,1fr); }
#roomSettingsModal .meme-settings-head { flex-wrap:wrap; }
#roomSettingsModal .meme-settings-head > div { min-width:0; flex:1 1 180px; }
#roomSettingsModal .meme-guide-list { grid-template-columns:minmax(0,1fr); }
#roomSettingsModal .microphone-route-status { overflow-wrap:anywhere; }
#roomSettingsModal .settings-head > div { min-width:0; }
#roomSettingsModal .settings-head .icon-button { flex:none; }
#aiAssistantPanel > .room-ai-status-chip { align-self:flex-start; margin:8px 16px 0; max-width:calc(100% - 32px); }