.perseed-call-scroll-locked {
  overflow: hidden !important;
  overscroll-behavior: none !important;
}

.livekit-room-overlay {
  position: fixed;
  inset: 0;
  z-index: 1060;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(3, 12, 8, 0.9);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  padding: 0.45rem;
  overflow: hidden;
  overscroll-behavior: none;
}

.livekit-room-panel {
  width: min(calc(100vw - 0.9rem), 1800px);
  height: calc(100vh - 0.9rem);
  height: calc(100dvh - 0.9rem);
  max-height: none;
  background: #07130e;
  border: 1px solid rgba(153, 230, 187, 0.3);
  border-radius: 24px;
  box-shadow: 0 32px 90px rgba(0, 0, 0, 0.55);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  overscroll-behavior: contain;
}

.livekit-room-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.9rem 1.15rem;
  border-bottom: 1px solid rgba(169, 232, 196, 0.2);
  background: linear-gradient(135deg, #0b2b1e 0%, #15583b 100%);
}

.livekit-room-header-copy h3 {
  margin: 0;
  font-size: 1rem;
  color: #ffffff;
  font-size: 1.08rem;
  font-weight: 800;
}

.livekit-room-header-copy {
  min-width: 0;
  flex: 1;
}

.livekit-room-header-copy p {
  margin: 0.2rem 0 0;
  color: #d9f3e4;
  font-size: 0.85rem;
}

.livekit-room-close {
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
  width:38px;
  height:38px;
  border-radius:999px;
  border:1px solid rgba(255, 255, 255, 0.35);
  font-size: 1.6rem;
  line-height: 1;
  cursor: pointer;
}

.livekit-room-body {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  position: relative;
  background: #07130e;
}

.livekit-room-notice {
  display: none;
  margin: 0.75rem 0.75rem 0;
  padding: 0.7rem 0.85rem;
  border-radius: 12px;
  background: #102f23;
  border: 1px solid #2e7655;
  color: #e4f8ec;
  font-size: 0.82rem;
  line-height: 1.45;
}

.livekit-room-notice.is-visible {
  display: block;
}

.livekit-room-status {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 1.5rem;
  background: radial-gradient(circle at 50% 20%, #173d2c 0%, #07130e 68%);
  color: #eefaf3;
  font-weight: 600;
}

.livekit-room-status p {
  margin: 0 0 0.75rem;
}

.livekit-room-retry,
.livekit-room-leave {
  border: 1px solid #4f8c6d;
  background: #143d2a;
  color: #fff;
  border-radius: 999px;
  padding: 0.45rem 0.9rem;
  cursor: pointer;
  font-weight: 600;
}

.livekit-room-retry {
  background: #21a466;
  border-color: #21a466;
  color: #fff;
}

.livekit-room-grid {
  flex: 1;
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-auto-rows: minmax(180px, 1fr);
  gap: 0.75rem;
  padding: 0.75rem;
  overflow: auto;
  background:
    radial-gradient(circle at 50% -10%, rgba(64, 176, 112, 0.22), transparent 48%),
    linear-gradient(160deg,#06100b 0%,#102d20 100%);
  align-content: stretch;
}

.livekit-room-grid--pair,
.livekit-room-grid--quad {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.livekit-room-grid--trio {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.livekit-room-grid--trio .livekit-room-tile:first-child {
  grid-column: 1 / -1;
}

.livekit-room-grid--many {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-auto-rows: minmax(140px, 1fr);
}

.livekit-room-grid--many .livekit-room-tile {
  min-height: 140px;
  aspect-ratio: auto;
}

.livekit-room-grid--single {
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: minmax(0, 1fr);
}

.livekit-room-grid--single .livekit-room-tile {
  width: 100%;
  height: 100%;
  min-height: 0;
  aspect-ratio: auto;
}

.livekit-room-grid--voice {
  grid-template-columns: repeat(2, minmax(0, 220px));
  justify-content: center;
  align-content: center;
}

.livekit-room-tile {
  position: relative;
  background: #0f172a;
  border-radius: 14px;
  overflow: hidden;
  min-height: 180px;
  aspect-ratio: auto;
  border: 1px solid rgba(255, 255, 255, 0.18);
  box-shadow:0 8px 24px rgba(0,0,0,.22);
}

.livekit-room-tile--voice {
  display: flex;
  align-items: center;
  justify-content: center;
  background: radial-gradient(circle at top, rgba(52, 211, 153, 0.28), rgba(15, 23, 42, 0.96));
}

.livekit-room-avatar {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 88px;
  height: 88px;
  transform: translate(-50%, -50%);
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
  font-weight: 700;
  font-size: 1.3rem;
  border: 2px solid #49c77e;
  overflow: hidden;
  box-shadow: 0 12px 34px rgba(0,0,0,.34);
}

.livekit-room-avatar img { width:100%; height:100%; object-fit:cover; display:block; }

.livekit-room-tile video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  min-height: 0;
  background: #111827;
}

.livekit-room-tile-label {
  position: absolute;
  left: 0.5rem;
  bottom: 0.5rem;
  background: rgba(15, 23, 42, 0.72);
  color: #fff;
  font-size: 0.75rem;
  padding: 0.2rem 0.45rem;
  border-radius: 999px;
}

.livekit-room-toolbar {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;
  padding: 0.8rem;
  border-top: 1px solid rgba(169, 232, 196, 0.2);
  background: #0b2117;
  flex-wrap: wrap;
}

.livekit-room-overflow,
.livekit-room-overflow-menu {
  display: contents;
}

.livekit-room-more {
  display: none;
}

.livekit-room-tool {
  border: 1px solid #3e7f5e;
  background: #17442f;
  color: #fff;
  border-radius: 999px;
  padding: 0.5rem 0.9rem;
  cursor: pointer;
  font-weight: 600;
  min-height:40px;
  box-shadow:0 3px 10px rgba(0,0,0,.22);
}
.livekit-room-tool:hover:not(:disabled) { background:#205b40; border-color:#68c58f; }
.livekit-room-tool:focus-visible { outline:3px solid rgba(31,109,73,.25); outline-offset:2px; }
.livekit-room-tool:disabled { opacity:.52; cursor:not-allowed; }

.livekit-room-tool.is-active {
  background: #5ad18d;
  border-color: #79e5a8;
  color: #062014;
}

.livekit-room-tool.is-danger {
  background: #b91c1c;
  border-color: #b91c1c;
  color: #fff;
}

.livekit-room-tool.is-host-locked {
  background: #4b5563;
  border-color: #6b7280;
  color: #fff;
  opacity: 1;
}

.livekit-room-camera-switch {
  position: absolute;
  top: 0.7rem;
  left: 0.7rem;
  z-index: 6;
  width: 42px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255,255,255,.5);
  border-radius: 50%;
  background: rgba(5, 24, 16, 0.82);
  color: #fff;
  font-size: 1.45rem;
  line-height: 1;
  box-shadow: 0 6px 18px rgba(0,0,0,.32);
  cursor: pointer;
}

.livekit-room-camera-switch:hover:not(:disabled) {
  background: rgba(24, 91, 59, 0.95);
}

.livekit-room-camera-switch:disabled {
  display: none;
}

body.perseed-call-active #help-widget-icon,
body.perseed-call-active .help-widget-icon,
body.perseed-call-active #help-widget-popup,
body.perseed-call-active .help-widget-popup,
body.perseed-call-active .help-widget,
body.perseed-call-active [data-help-widget],
body.perseed-call-active .floating-help-button { display:none !important; visibility:hidden !important; opacity:0 !important; pointer-events:none !important; }

.livekit-room-sidepanel {
  position: absolute;
  z-index: 12;
  top: 0;
  right: 0;
  bottom: 0;
  width: min(390px, 92%);
  display: flex;
  flex-direction: column;
  background: #fff;
  border-left: 1px solid #e2e8f0;
  box-shadow: -18px 0 38px rgba(15,23,42,0.2);
}
.livekit-room-sidepanel[hidden] { display:none; }
.livekit-room-sidepanel__head { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:0.9rem 1rem; border-bottom:1px solid #e2e8f0; }
.livekit-room-sidepanel__head h4 { margin:0; font-size:1rem; color:#0f172a; }
.livekit-room-sidepanel__head button { border:0; background:transparent; font-size:1.55rem; color:#64748b; cursor:pointer; }
.livekit-room-sidepanel__content { flex:1; min-height:0; overflow:auto; padding:0.9rem; }
.livekit-room-sidepanel--chat .livekit-room-sidepanel__content {
  display:flex;
  flex-direction:column;
  min-height:0;
  overflow:hidden;
  padding:0;
}
.livekit-room-panel-note { margin:0 0 0.8rem; padding:0.7rem; border-radius:10px; background:#f8fafc; color:#475569; font-size:0.82rem; }
.livekit-room-host-powers { display:flex; flex-direction:column; gap:0.3rem; margin-bottom:0.8rem; padding:0.75rem; border:1px solid #bbf7d0; border-radius:12px; background:#f0fdf4; color:#14532d; }
.livekit-room-host-powers span { font-size:0.78rem; line-height:1.45; }
.livekit-room-participants-list { display:flex; flex-direction:column; gap:0.55rem; }
.livekit-room-participant-row { display:flex; align-items:center; gap:0.65rem; padding:0.65rem; border:1px solid #e2e8f0; border-radius:12px; background:#fff; }
.livekit-room-participant-avatar { width:42px; height:42px; flex:0 0 42px; display:inline-flex; align-items:center; justify-content:center; border-radius:50%; background:#dcfce7; color:#166534; font-weight:800; overflow:hidden; border:2px solid #a7dfbf; }
.livekit-room-participant-avatar img { width:100%; height:100%; object-fit:cover; display:block; }
.livekit-room-participant-copy { min-width:0; flex:1; display:flex; flex-direction:column; }
.livekit-room-participant-copy strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#0f172a; }
.livekit-room-participant-copy small { color:#64748b; }
.livekit-room-participant-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:0.3rem; }
.livekit-room-participant-actions button, .livekit-room-banned-row button { border:0; border-radius:8px; padding:0.36rem 0.5rem; background:#ecfdf5; color:#166534; font-size:0.72rem; font-weight:700; cursor:pointer; }
.livekit-room-participant-actions button.is-danger { background:#fff1f2; color:#be123c; }
.livekit-room-participant-actions button.is-complete { background:#e2e8f0; color:#334155; }
.livekit-room-media-state { display:inline-flex; align-items:center; border-radius:8px; padding:.36rem .5rem; background:#f1f5f9; color:#475569; font-size:.72rem; font-weight:700; }
.livekit-room-banned-list h5 { margin:1rem 0 0.5rem; color:#475569; }
.livekit-room-banned-row { display:flex; align-items:center; justify-content:space-between; gap:0.7rem; padding:0.55rem 0; border-top:1px solid #eef2f7; }
.livekit-room-banned-person { display:flex; align-items:center; gap:.5rem; min-width:0; }
.livekit-room-banned-person img { width:32px; height:32px; border-radius:50%; object-fit:cover; }
.livekit-room-chat-list { flex:1; min-height:0; max-height:none; overflow:auto; overscroll-behavior:contain; display:flex; flex-direction:column; gap:0.55rem; padding:0.9rem; background:linear-gradient(180deg,#f8fbf9 0%,#fff 100%); }
.livekit-room-chat-empty { margin:auto; padding:1rem; color:#64748b; text-align:center; }
.livekit-room-chat-message { display:flex; align-items:flex-end; gap:.55rem; max-width:92%; color:#334155; }
.livekit-room-chat-message.is-me { align-self:flex-end; flex-direction:row-reverse; }
.livekit-room-chat-avatar { width:30px; height:30px; flex:0 0 30px; border-radius:999px; overflow:hidden; display:grid; place-items:center; background:linear-gradient(135deg,#dff5e8,#bbebcf); border:1px solid #a7d9bc; color:#17613f; font-size:.72rem; font-weight:900; }
.livekit-room-chat-avatar img { width:100%; height:100%; object-fit:cover; }
.livekit-room-chat-bubble { min-width:0; display:flex; flex-direction:column; gap:.36rem; padding:.58rem .68rem; border:1px solid #e2ebe6; border-radius:13px 13px 13px 4px; background:#fff; box-shadow:0 4px 12px rgba(15,23,42,.04); }
.livekit-room-chat-message.is-me .livekit-room-chat-bubble { border-color:#b9e0c8; border-radius:13px 13px 4px 13px; background:#eaf8f0; }
.livekit-room-chat-meta { display:flex; align-items:center; gap:.5rem; }
.livekit-room-chat-meta strong { font-size:0.75rem; color:#166534; }
.livekit-room-chat-meta time { color:#91a097; font-size:.65rem; font-variant-numeric:tabular-nums; }
.livekit-room-chat-bubble>span { font-size:.82rem; line-height:1.45; overflow-wrap:anywhere; }
.livekit-room-chat-media { display:block; width:100%; max-height:260px; object-fit:contain; border-radius:10px; background:#0f172a; }
.livekit-room-chat-voice-card { display:flex; align-items:center; gap:.55rem; min-width:min(270px,68vw); margin-top:.15rem; padding:.5rem; border:1px solid #cce4d6; border-radius:12px; background:linear-gradient(135deg,#f7fcf9,#eef8f2); }
.livekit-room-chat-voice-icon { display:grid; place-items:center; width:34px; height:34px; flex:0 0 34px; border-radius:999px; background:#1d7a50; color:#fff; box-shadow:0 5px 12px rgba(29,122,80,.18); }
.livekit-room-chat-voice-main { min-width:0; flex:1; }
.livekit-room-chat-voice-main>strong { display:block; margin-bottom:.25rem; color:#315d48; font-size:.7rem; }
.livekit-room-chat-audio { display:block; width:100%; height:34px; }
.livekit-room-chat-file { color:#166534; font-weight:700; }
.livekit-room-chat-form { flex:0 0 auto; display:flex; flex-direction:column; gap:0.45rem; margin:0; padding:0.72rem 0.8rem max(0.78rem,env(safe-area-inset-bottom)); border-top:1px solid #dce7e1; background:#fff; box-shadow:0 -10px 28px rgba(15,23,42,.06); }
.livekit-room-chat-tools { display:flex; align-items:center; gap:.35rem; overflow-x:auto; }
.livekit-room-chat-tools label, .livekit-room-chat-tools button { display:inline-flex; align-items:center; min-height:34px; border:1px solid #bbf7d0; border-radius:999px; padding:.35rem .55rem; background:#f0fdf4; color:#166534; font:inherit; font-size:.74rem; font-weight:700; cursor:pointer; white-space:nowrap; }
.livekit-room-chat-tools button.is-recording { border-color:#fecaca; background:#fff1f2; color:#be123c; }
.livekit-room-chat-recording-time { flex:0 0 auto; color:#be123c; font-size:.78rem; font-weight:800; font-variant-numeric:tabular-nums; }
.livekit-room-chat-recording-time[hidden] { display:none; }
.livekit-room-chat-pending { display:grid; gap:.5rem; max-height:210px; overflow:auto; padding:.55rem .6rem; border:1px solid #bbd8c7; border-radius:12px; background:#f4faf6; color:#475569; font-size:.76rem; }
.livekit-room-chat-pending[hidden] { display:none; }
.livekit-room-chat-pending-row { min-width:0; display:flex; align-items:flex-start; justify-content:space-between; gap:.5rem; padding-bottom:.5rem; border-bottom:1px solid #dbe9e1; }
.livekit-room-chat-pending-row:last-child { padding-bottom:0; border-bottom:0; }
.livekit-room-chat-preview { min-width:0; flex:1; display:grid; grid-template-columns:52px minmax(0,1fr); gap:.55rem; align-items:center; }
.livekit-room-chat-preview-media { width:52px; height:52px; display:block; object-fit:cover; border-radius:9px; background:#0f172a; }
.livekit-room-chat-preview-audio { grid-column:1 / -1; display:block; width:100%; min-width:0; }
.livekit-room-chat-preview-file { width:52px; height:52px; display:flex; align-items:center; justify-content:center; border-radius:9px; background:#e8f5ed; font-size:1.25rem; }
.livekit-room-chat-preview-copy { min-width:0; display:flex; flex-direction:column; gap:.15rem; }
.livekit-room-chat-preview-copy strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#163c29; }
.livekit-room-chat-preview-copy small { color:#64748b; }
.livekit-room-chat-preview-remove { flex:0 0 auto; border:0; background:transparent; color:#be123c; font-size:1.2rem; cursor:pointer; }
.livekit-room-chat-compose { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:.45rem; }
.livekit-room-chat-compose input { min-width:0; width:100%; border:1px solid #cbd5e1; border-radius:10px; padding:0.65rem; }
.livekit-room-chat-compose button { display:inline-flex; align-items:center; justify-content:center; min-width:74px; border:0; border-radius:10px; padding:0.55rem 0.8rem; background:#166534; color:#fff; font-weight:700; }
.livekit-room-chat-feedback { min-height:0; margin:0; color:#8b3a25; font-size:0.75rem; line-height:1.35; }
.livekit-room-chat-feedback:empty { display:none; }

@media (max-width: 768px) {
  .livekit-room-overlay {
    padding: 0;
  }

  .livekit-room-panel {
    width: 100vw;
    height: 100vh;
    height: 100dvh;
    min-height: 100svh;
    max-height: none;
    border-radius: 0;
  }

  .livekit-room-header {
    align-items: center;
    padding: 0.65rem 0.75rem;
    gap: 0.45rem;
  }

  .livekit-room-header-copy h3 {
    font-size: 0.92rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .livekit-room-meta {
    flex-wrap: nowrap !important;
    gap: 0.28rem !important;
    margin-top: 0.35rem !important;
    overflow-x: auto;
    max-width: calc(100vw - 4.5rem);
  }

  .livekit-room-chip {
    flex: 0 0 auto;
    padding: 0.28rem 0.48rem !important;
    font-size: 0.66rem !important;
    white-space: nowrap;
  }

  .livekit-room-close {
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
  }

  .livekit-room-grid {
    grid-template-columns: minmax(0, 1fr);
    grid-auto-rows: minmax(180px, 1fr);
    gap: 0.65rem;
    padding: 0.65rem;
    overscroll-behavior: contain;
  }

  .livekit-room-grid--pair,
  .livekit-room-grid--quad,
  .livekit-room-grid--trio,
  .livekit-room-grid--many {
    grid-template-columns: minmax(0, 1fr);
  }

  .livekit-room-grid--trio .livekit-room-tile:first-child {
    grid-column: auto;
  }

  .livekit-room-grid--voice {
    grid-template-columns: minmax(0, 1fr);
  }

  .livekit-room-tile {
    min-height: 230px;
    aspect-ratio: 16 / 10;
  }

  .livekit-room-tile video {
    min-height: 0;
  }

  .livekit-room-toolbar {
    display: flex !important;
    align-items: center;
    justify-content: stretch;
    flex-wrap: nowrap;
    gap: 0.32rem;
    overflow: visible;
    padding:0.5rem 0.45rem max(0.65rem, env(safe-area-inset-bottom));
    background:#0b2117;
    position:sticky;
    bottom:0;
    z-index:10;
  }

  .livekit-room-tool {
    width:auto;
    min-width:0;
    flex: 1 1 0;
    min-height: 38px;
    padding: 0.44rem 0.34rem;
    font-size: 0.68rem;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  .livekit-room-overflow {
    position: relative;
    display: block;
    flex: 0 0 40px;
  }

  .livekit-room-more {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    min-width: 40px;
    padding: 0;
    font-size: 1.45rem;
    line-height: 1;
  }

  .livekit-room-overflow-menu {
    position: absolute;
    left: 0;
    bottom: calc(100% + 0.55rem);
    z-index: 25;
    width: min(240px, calc(100vw - 1rem));
    display: none;
    flex-direction: column;
    gap: 0.35rem;
    padding: 0.55rem;
    border: 1px solid rgba(144, 224, 177, 0.32);
    border-radius: 14px;
    background: #0b2117;
    box-shadow: 0 18px 45px rgba(0,0,0,.48);
  }

  .livekit-room-overflow.is-open .livekit-room-overflow-menu {
    display: flex;
  }

  .livekit-room-overflow-menu .livekit-room-tool {
    width: 100%;
    flex: 0 0 auto;
    justify-content: flex-start;
    padding: 0.58rem 0.75rem;
    font-size: 0.8rem;
    text-align: left;
  }

  .livekit-room-camera-switch {
    top: 0.55rem;
    left: 0.55rem;
    width: 38px;
    height: 38px;
    font-size: 1.3rem;
  }
}

@media (max-width: 430px) {
  .livekit-room-grid {
    grid-auto-rows: minmax(245px, auto);
  }

  .livekit-room-header-copy p {
    display: none;
  }

  .livekit-room-sidepanel { width:100%; }

  .livekit-room-sidepanel__content {
    display:flex;
    flex-direction:column;
    min-height:0;
  }

  .livekit-room-chat-list {
    flex:1;
    min-height:0;
    max-height:none;
  }

  .livekit-room-chat-compose {
    grid-template-columns:minmax(0,1fr) 46px;
  }

  .livekit-room-chat-compose button {
    min-width:46px;
    width:46px;
    padding:.55rem;
  }

  .livekit-room-chat-compose button span {
    position:absolute;
    width:1px;
    height:1px;
    overflow:hidden;
    clip:rect(0 0 0 0);
  }
}
