/* Voice room surfaces use the active appearance palette. */
.voice-layout, .voice-room, .voice-channels, .voice-tile, .voice-room-chat { min-width: 0; }
.voice-channel strong, .voice-channel small, .voice-tile strong, .voice-room h2, .voice-room h3 { overflow-wrap: anywhere; }
.voice-room { gap: var(--sp-4); }
.voice-channels { align-self: start; }
.voice-channels > a { margin-bottom: var(--sp-3); }
.voice-camera { width: 100%; max-height: 200px; aspect-ratio: 16/9; object-fit: cover; border-radius: var(--radius); }
.voice-camera:not([hidden]) ~ .avatar { display: none; }
.voice-screen-stage video { width: 100%; max-height: 60vh; object-fit: contain; background: #111; border-radius: var(--radius); }
.voice-screen-stage h3 { margin-bottom: var(--sp-3); }
.voice-chat-head, .voice-chat-panel-title { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); }
.voice-chat-messages { max-height: 360px; min-height: 100px; overflow: auto; overscroll-behavior: contain; padding: var(--sp-2); }
.voice-chat-message { padding: var(--sp-3) 0; border-bottom: 1px solid var(--line); overflow-wrap: anywhere; }
.voice-chat-message .legacy-text img { max-width: 100%; }
.voice-chat-composer { display: flex; gap: var(--sp-2); align-items: end; }
.voice-chat-composer textarea { flex: 1; width: 100%; min-width: 0; resize: vertical; max-height: 150px; }
.voice-chat-panel { width: min(520px, calc(100vw - 24px)); max-height: calc(100dvh - 24px); margin: 12px 12px auto auto; padding: var(--sp-4); overflow: auto; color: var(--bone); background: var(--gunmetal); }
.voice-chat-panel::backdrop { background: rgb(0 0 0 / .38); }
.voice-chat-panel [data-header-chat-content] { min-width: 0; }
.voice-chat-panel .voice-chat-messages { max-height: min(360px, 45dvh); }
.voice-chat-panel h2 { font-size: 1.2rem; overflow-wrap: anywhere; }
.voice-dock { position: fixed; z-index: 70; right: 24px; left: auto; bottom: 20px; max-width: calc(100vw - 48px); display: flex; flex-wrap: wrap; gap: var(--sp-3); padding: var(--sp-3); border: 1px solid var(--line); border-radius: var(--radius); color: var(--bone); background: var(--gunmetal); box-shadow: var(--shadow-deep); }
.voice-dock[hidden], .voice-chat-panel:not([open]) { display: none; }
.voice-dock-channel { min-width: 0; max-width: 180px; overflow: hidden; }
.voice-dock-channel strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.voice-dock-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2); }
.has-voice-membership .app-shell { padding-bottom: 110px; }
@media (max-width: 800px) {
  .voice-layout { display: flex; flex-direction: column; }
  .voice-room { order: -1; width: 100%; }
  .voice-channels { width: 100%; }
  .voice-stage { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .voice-tile { padding: var(--sp-3); }
  .voice-controls { flex-wrap: wrap; }
  .voice-dock { left: 8px; right: 8px; bottom: calc(66px + env(safe-area-inset-bottom)); max-width: none; gap: var(--sp-2); }
  .voice-dock-channel { max-width: 100%; flex-basis: 100%; }
  .voice-dock-channel small { display: none; }
  .voice-dock-actions { width: 100%; justify-content: space-between; gap: 4px; }
  .voice-dock-actions .btn { padding: 7px 9px; }
  .has-voice-membership .app-shell { padding-bottom: 200px; }
}
@media (max-height: 500px) {
  .voice-chat-panel { margin-top: 4px; max-height: calc(100dvh - 8px); }
  .voice-chat-panel .voice-chat-messages { min-height: 40px; max-height: 28dvh; }
  .voice-chat-panel .voice-chat-head h3 { display: none; }
  .voice-chat-panel textarea { max-height: 60px; }
}

.voice-tile { width: 100%; max-width: 240px; }
.voice-tile strong { white-space: normal; }
.voice-dock { animation: none; }
.voice-member .identity { min-width: 0; overflow-wrap: anywhere; }
.voice-controls { position: static; }

/* Author/profile presence follows the shared public Voice source. */
.voice-presence { display: flex; align-items: center; flex-wrap: wrap; gap: var(--sp-2, 8px); margin-top: var(--sp-2, 8px); color: var(--muted); overflow-wrap: anywhere; }
.voice-presence[hidden] { display: none; }
.voice-presence .btn { max-width: 100%; }
.post-author .voice-presence { justify-content: center; }

.voice-screen-status { flex-basis: 100%; margin: 0; overflow-wrap: anywhere; }