/* GABA3 — Sala Privada — CSS próprio, independente do resto da
   plataforma. Cada seletor tem UMA única regra (revisado 2026-08-28 —
   antes tinha até 3 versões da mesma regra empilhadas com !important,
   herdadas de uma extração automática de estilo.css que nunca foi
   limpa depois). Editar aqui é seguro: não tem outra regra escondida
   mais embaixo pisando por cima. */

/* Mensagem de voz da sala privada: fina e discreta. O triângulo fica solto
   (sem bola — regra do dono: ícones independentes), onda e tempo ao lado. */
.pagina-sala.sala-privada .chat-voz-bubble{
    display:flex;
    align-items:center;
    gap:8px;
    width:min(100%,210px);
    margin-top:3px;
    padding:6px 12px 6px 8px;
    border-radius:18px 18px 18px 6px;
}
.pagina-sala.sala-privada article.msg-voz.is-self .chat-voz-bubble{border-radius:18px 18px 6px 18px}
.pagina-sala.sala-privada .chat-voz-play{
    flex:0 0 auto;
    width:24px;
    height:24px;
    padding:0;
    border:0;
    border-radius:0;
    background:transparent;
    color:#8fff67;
    font-size:15px;
}
.pagina-sala.sala-privada .chat-voz-play svg{width:22px;height:22px;display:block}
.pagina-sala.sala-privada .chat-voz-bubble.is-playing .chat-voz-play{background:transparent;color:#ffb36b}
.pagina-sala.sala-privada .chat-voz-meta{display:flex;align-items:center;gap:8px;flex:1 1 auto;min-width:0}
.pagina-sala.sala-privada .chat-voz-wave{flex:1 1 auto;height:14px;gap:3px}
.pagina-sala.sala-privada .chat-voz-wave i{width:2.5px}
.pagina-sala.sala-privada .chat-voz-dur{flex:0 0 auto;font-size:10.5px}
.pagina-sala.sala-privada .chat-voz-wave{cursor:pointer}
/* Velocidade do áudio (1× · 1,5× · 2×): pastilha discreta ao lado do tempo. */
.pagina-sala.sala-privada .chat-voz-vel{flex:0 0 auto;min-width:34px;height:22px;padding:0 6px;border:1px solid currentColor;border-radius:11px;background:transparent;color:inherit;font:800 11px/1 inherit;opacity:.8;cursor:pointer}
.pagina-sala.sala-privada .chat-voz-bubble.is-playing .chat-voz-vel{opacity:1}
/* Tela do diretor de câmera VAZIA (sem câmera, sem vídeo/foto ao vivo): fica
   transparente e não intercepta o toque — senão o fundo opaco dela cobria as
   fotos/vídeos compartilhados da sala (só aparecia a foto recém-enviada). */
.pagina-sala.sala-privada .director-main-stage:not(:has(> img:not(.is-hidden), > video:not(.is-hidden), .gaba3-external-preview)){
    background:transparent;
    pointer-events:none;
}
/* Emoji no meio do texto: fontes de emoji no fim da lista (sem elas alguns
   sistemas mostravam um quadradinho vazio no lugar do emoji). */
.pagina-sala.sala-privada .semi-lista-mensagens article p,
.pagina-sala.sala-privada .semi-lista-mensagens article b{
    font-family:Inter,Roboto,"SF Pro Display","SF Pro Text",system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji"!important;
}

/* A mídia é o próprio palco: sem filete/folga entre a imagem e a borda.
   As setas ficam em extremos independentes, não agrupadas no canto direito. */
.pagina-sala.sala-privada #pantalla-directo{
    border:0!important;
}
.pagina-sala.sala-privada .zona-principal-sala{
    margin-bottom:0;
}

/* Os painéis seguem rolando com mouse e dedo, só sem trilho/flechas nativas.
   Isso evita que o chat e o coração pareçam uma página técnica. */
.pagina-sala.sala-privada .semi-lista-mensagens,
.pagina-sala.sala-privada .privada-painel-convites,
.pagina-sala.sala-privada .invd-suggest-list,
.pagina-sala.sala-privada .invd-catalog{
    scrollbar-width:none;
    -ms-overflow-style:none;
}
.pagina-sala.sala-privada .semi-lista-mensagens::-webkit-scrollbar,
.pagina-sala.sala-privada .privada-painel-convites::-webkit-scrollbar,
.pagina-sala.sala-privada .invd-suggest-list::-webkit-scrollbar,
.pagina-sala.sala-privada .invd-catalog::-webkit-scrollbar{
    width:0;
    height:0;
    display:none;
}
/* Papel de parede do chat: fundo escuro com o nome GABA3 repetido em
   miniatura, como o padrão de "doodles" do WhatsApp atrás das mensagens.
   Fica no contêiner que envolve tanto a lista quanto o rodapé (ícones +
   campo de escrever), para não haver corte/linha entre as duas áreas —
   os ícones navegam sobre a mesma "sala" das burbujas, sem separação. */
.pagina-sala.sala-privada .semi-lista-mensagens{
    background:transparent;
    /*
     * Com poucas mensagens, o histórico começa no alto. Com muitas, o
     * próprio contêiner rola — nunca a página/sala inteira.
     */
    align-content:start;
    min-height:0;
    overflow-x:hidden;
    overflow-y:auto;
    overscroll-behavior:contain;
    touch-action:pan-y;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    -ms-overflow-style:none;
}
.pagina-sala.sala-privada .semi-lista-mensagens::-webkit-scrollbar{display:none}
/* Balões de chat reais (2026-08-20, mesmo estilo já aprovado na sala de
   comércio): antes cada mensagem era só texto flutuando no papel de
   parede, sem nenhum contêiner. Própria mensagem à direita, com o
   mesmo acento dourado; mensagem de outra pessoa à esquerda, balão
   neutro — linguagem visual consistente em toda a plataforma. */
.pagina-sala.sala-privada .semi-lista-mensagens article.is-self{
    display:flex;
    flex-direction:row-reverse;
    gap:8px;
}
.pagina-sala.sala-privada .semi-lista-mensagens article.is-self small{
    display:block;
    text-align:right;
}
.pagina-sala.sala-privada .director-main-caption{
    position:absolute;
    left:12px;
    bottom:12px;
    z-index:3;
    margin:0;
    padding:5px 12px;
    border-radius:999px;
    background:rgba(6,12,5,.72);
    border:1px solid rgba(85,201,0,.35);
    color:#fff;
    font-size:.82rem;
    font-weight:700;
    letter-spacing:.01em;
    pointer-events:none;
}
.pagina-sala.sala-privada .privada-mention{
    color:#ffd76a;
    background:rgba(255,183,3,.14);
    border-radius:4px;
    padding:0 3px;
    font-weight:800;
}

/* ════════════════════════════════════════════════════════════════
   Cabeçalho — selo de criptografia + bolinha de perfil reconhecível
   como configuração (2026-08-20): a bolinha só mostrava as iniciais,
   sem nenhuma pista visual de que é clicável/configurável. E a sala
   é ponta-a-ponta mas isso nunca aparecia em lugar nenhum.
   ════════════════════════════════════════════════════════════════ */
.pagina-sala.sala-privada .privada-e2e-badge{
    display:grid;
    place-items:center;
    width:26px;
    height:26px;
    flex:none;
    border-radius:50%;
    background:rgba(85,201,0,.14);
    border:1px solid rgba(143,255,103,.32);
    color:#8fff67;
}
/* "Abrir meu perfil" usava o azul genérico (.boton-secundario padrão da
   plataforma) — destoava da paleta verde daqui, mesmo tipo de ajuste já
   feito no campo de escrever e no rodapé do composer. */
.pagina-sala.sala-privada .privada-perfil-sheet .boton-secundario{
    background:rgba(255,255,255,.055);
    border:1px solid rgba(143,255,103,.28);
    color:#c8ffb0;
}
.pagina-sala.sala-privada .privada-perfil-sheet .boton-secundario:hover{
    background:rgba(143,255,103,.14);
    border-color:rgba(143,255,103,.5);
}
/* ════════════════════════════════════════════════════════════════
   Barra de madeira no rodapé — todo o grupo (2026-08-20): pedido do
   dono, mesma madeira do cabeçalho, bolitas do mesmo tamanho pra
   TODAS as pessoas do grupo (não só quem está online), com aro verde
   em quem está online agora. "Si son diez, veinte o cincuenta, igual
   las bolitas" — a barra quebra linha e cresce, nunca corta gente.
   ════════════════════════════════════════════════════════════════ */
.pagina-sala.sala-privada .sala-aplicacion{
    padding-bottom:0;
}
.pagina-sala.sala-privada .privada-roster-bar-lista{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    max-width:1200px;
    margin:0 auto;
}
.pagina-sala.sala-privada .privada-roster-ball{
    position:relative;
    width:42px;
    height:42px;
    flex:none;
    border-radius:50%;
}
.pagina-sala.sala-privada .privada-roster-ball.is-clickable{
    cursor:pointer;
    transition:transform var(--gaba3-dur-rapida) var(--gaba3-curva);
}
.pagina-sala.sala-privada .privada-roster-ball.is-clickable:hover,
.pagina-sala.sala-privada .privada-roster-ball.is-clickable:focus-visible{
    transform:translateY(-3px);
    outline:none;
}
.pagina-sala.sala-privada .privada-roster-ball.is-clickable:hover .av,
.pagina-sala.sala-privada .privada-roster-ball.is-clickable:focus-visible .av{
    box-shadow:0 0 0 3px rgba(85,201,0,.4);
    cursor:default;
}
.pagina-sala.sala-privada .privada-roster-ball.is-self .av{
    border-color:#ffb703;
}
.pagina-sala.sala-privada .privada-roster-ball .dot{
    position:absolute;
    right:-1px;
    bottom:-1px;
    width:11px;
    height:11px;
    border-radius:50%;
    background:#55c900;
    border:2px solid #140d06;
}
.pagina-sala.sala-privada .privada-menu-btn:hover{
    background:rgba(13,26,13,.95);
    border-color:#6dff4a;
}
/* Campo de escrever — mesma correção do azul-marinho genérico já feita
   na sala de comércio (#191e31 destoava da paleta verde daqui). */
/* Rodapé do composer — tira a linha de separação genérica e aperta os
   espaços: os ícones soltos e a bolha de escrever ficam colados, na
   mesma "área" visual, em vez de dois blocos afastados um do outro. */
/* Bug real encontrado ao investigar o vão gigante: a regra genérica
   compartilhada define grid-template-rows:auto minmax(190px,1fr) auto
   (assumindo 3 filhos — cabeçalho, mensagens, rodapé), mas
   #privada-chat-sala só TEM 2 filhos (mensagens + rodapé) — nunca
   existiu cabeçalho aqui. O grid encaixava a lista de mensagens na
   1ª fila (auto, encolhe pro conteúdo) e o rodapé sobrava pra 2ª fila
   (1fr, estica pra preencher tudo que sobra) — o oposto do que devia
   ser. Redefinindo pra 2 filas de verdade: mensagens crescem, rodapé
   fica do tamanho do conteúdo. */
.pagina-sala.sala-privada .privada-composer-tools{
    display:flex;
    align-items:center;
    gap:6px;
    flex-wrap:wrap;
}
.pagina-sala.sala-privada .privada-composer-tools[hidden]{display:none!important}
/* Ícones soltos, sem caixa: só o glifo, coloridos, sem fundo nem borda —
   ficam junto à linha onde se escreve, não como botões de barra de
   ferramentas separada. */
.pagina-sala.sala-privada .privada-icon-btn:hover,
.pagina-sala.sala-privada .privada-icon-btn:focus-visible{
    color:#e8ffb8;
    transform:scale(1.08);
    outline:none;
}
/* Só o ícone, sem legenda escrita — as legendas "Fora"/"Dentro" faziam
   esses dois botões ficarem mais largos que os outros, estourando a
   linha e empurrando tudo pra baixo (o motivo do vão gigante entre os
   ícones e a bolha de escrever). O título (tooltip) já explica o que
   cada um faz, então a legenda embutida é redundante mesmo.
   Achado real numa auditoria (2026-09-22): a vírgula antes deste
   comentário juntava `.privada-icon-btn.privada-env-fora` na MESMA
   lista de seletores de `.privada-env-tag` — o botão inteiro de
   "Convite para fora" (WhatsApp/Facebook/Instagram) ficava com
   `display:none`, não só a legenda de texto dele. O botão sumia por
   completo pra qualquer dono de sala privada, no desktop. */
.pagina-sala.sala-privada .privada-icon-btn.activo{
    color:#f2ffd0;
}
.pagina-sala.sala-privada .privada-icon-btn svg{display:block}
.pagina-sala.sala-privada .form-chat-privada{
    grid-template-columns:minmax(0,1fr) 48px;
    gap:8px;
    /* Píldora al límite (regla del dueño): ningún espacio debajo del formulario. */
    padding-bottom:0!important;
    margin-bottom:0!important;
}
.pagina-sala.sala-privada .privada-figurinhas-panel{
    display:grid;
    gap:8px;
    padding:8px;
    border:1px solid rgba(85,201,0,.2);
    border-radius:12px;
    background:rgba(8,14,8,.96);
}
.pagina-sala.sala-privada .privada-figurinhas-panel:not([hidden]){
    /* Há 104 figurinhas: as abas ficam fixas e só a coleção ativa rola. */
    grid-template-rows:auto auto minmax(0,1fr);
    block-size:min(52dvh,400px);
    max-block-size:calc(100dvh - 190px);
    min-block-size:0;
    overflow:hidden;
}
.pagina-sala.sala-privada .privada-figurinhas-panel[hidden]{display:none!important}
.pagina-sala.sala-privada .privada-figurinhas-tabs{
    display:flex;
    gap:6px;
}
.pagina-sala.sala-privada .privada-figurinhas-tabs button{
    flex:1;
    min-height:30px;
    border:1px solid rgba(85,201,0,.2);
    border-radius:8px;
    background:transparent;
    color:#b8d8a0;
    font-size:11px;
    font-weight:700;
    cursor:pointer;
}
.pagina-sala.sala-privada .privada-figurinhas-tabs button.activo{
    background:rgba(85,201,0,.16);
    color:#dfffb0;
    border-color:rgba(85,201,0,.4);
}
.pagina-sala.sala-privada .privada-figurinhas-grid{
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    /* Con alto fijo y ~100 caritas, las filas "auto" se comprimían a ~16px y
       las caritas quedaban montadas unas sobre otras. Cada fila mide lo que
       mide su contenido y el resto se desplaza. */
    grid-auto-rows:max-content;
    align-content:start;
    gap:4px;
    min-block-size:0;
    overflow-x:hidden;
    overflow-y:auto;
    overscroll-behavior:contain;
    touch-action:pan-y;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    -ms-overflow-style:none;
    padding-inline-end:2px;
}
.pagina-sala.sala-privada .privada-figurinhas-grid::-webkit-scrollbar{display:none}
.pagina-sala.sala-privada .privada-figurinhas-grid[hidden]{display:none!important}
.pagina-sala.sala-privada .privada-figurinhas-grid button,
.pagina-sala.sala-privada .privada-criar-emojis button{
    min-height:38px;
    border:0;
    border-radius:9px;
    background:transparent;
    font-size:22px;
    line-height:1;
    cursor:pointer;
}
.pagina-sala.sala-privada .privada-figurinhas-grid button:hover,
.pagina-sala.sala-privada .privada-criar-emojis button:hover,
.pagina-sala.sala-privada .privada-criar-emojis button.activo{
    background:rgba(255,255,255,.08);
}
.pagina-sala.sala-privada .privada-figurinhas-grid .gaba3-fluent-emoji-choice{
    min-height:56px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:2px;
    padding:2px;
    color:#dfffb0;
    font-size:9px;
    font-weight:700;
}
.pagina-sala.sala-privada .privada-figurinhas-grid .gaba3-fluent-emoji-choice img{
    width:48px;
    height:48px;
    object-fit:contain;
    pointer-events:none;
}
.pagina-sala.sala-privada .privada-figurinhas-grid .gaba3-fluent-emoji-choice span{
    display:none;
}
.pagina-sala.sala-privada .gaba3-fluent-fig-chat .gaba3-fig-photo{
    object-fit:contain;
}
.pagina-sala.sala-privada .privada-figurinhas-criar{
    display:grid;
    gap:8px;
    min-block-size:0;
    overflow-y:auto;
    overscroll-behavior:contain;
    touch-action:pan-y;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    -ms-overflow-style:none;
}
.pagina-sala.sala-privada .privada-figurinhas-criar::-webkit-scrollbar{display:none}
.pagina-sala.sala-privada .privada-figurinhas-criar[hidden]{display:none!important}
.pagina-sala.sala-privada .privada-figurinhas-criar p{
    margin:0;
    color:#9a8060;
    font-size:11px;
    line-height:1.35;
}
.pagina-sala.sala-privada .privada-criar-emojis{
    display:grid;
    grid-template-columns:repeat(8,minmax(0,1fr));
    gap:4px;
}
.pagina-sala.sala-privada .privada-figurinhas-criar input{
    width:100%;
    min-height:38px;
    padding:0 12px;
    border:1px solid rgba(85,201,0,.25);
    border-radius:10px;
    background:rgba(255,255,255,.04);
    color:#e8d5b0;
    box-sizing:border-box;
    font-size:14px;
}
.pagina-sala.sala-privada .privada-figurinhas-criar .boton-principal{
    min-height:38px;
    border:0;
    border-radius:10px;
    background:linear-gradient(135deg,#3a8800,#55c900);
    color:#fff;
    font-weight:700;
    cursor:pointer;
}
@media (max-width:620px){.pagina-sala.sala-privada .privada-aplicacion{
        gap:8px!important;
        padding:8px 8px 0!important;
    }
.pagina-sala.sala-privada .semi-escenario,
.pagina-sala.sala-privada .pantalla-videollamada{
        /* Altura do palco no móvel: privada-mobile.css manda (evita min>max) */
        min-height:clamp(140px,24dvh,220px)!important;
        max-height:26dvh!important;
        border-radius:14px!important;
    }
.pagina-sala.sala-privada .privada-icon-btn{
        width:32px;
        height:32px;
        border-radius:9px;
    }
.pagina-sala.sala-privada .privada-figurinhas-grid{
        grid-template-columns:repeat(6,minmax(0,1fr));
    }
.pagina-sala.sala-privada .form-chat-privada :is(input,textarea){
        font-size:16px; /* evita zoom iOS */
    }
}
.pagina-sala.sala-privada .pantalla-videollamada,
.pagina-sala.sala-privada .semi-escenario{
    --thumb-w:88px;
    --thumb-h:66px;
    position:relative!important;
    box-sizing:border-box!important;
    padding:0!important;
    /* inferior y derecho rectos: la L pega a esa línea */
    border-radius:16px 16px 0 0!important;
    border-right:0!important;
    border-bottom:0!important;
    border-top:1px solid #ffffff17;
    border-left:1px solid #ffffff17;
    overflow:hidden!important;
}
.pagina-sala.sala-privada .thumbnails-overlay{
    position:absolute!important;
    inset:0!important;
    z-index:12;
    display:block;
    pointer-events:none;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important; /* L queda dentro, pegada al borde */
}
.pagina-sala.sala-privada .thumbs-columna-derecha{
    position:absolute!important;
    right:0!important;
    bottom:var(--thumb-h,66px)!important;
    left:auto!important;
    top:auto!important;
    width:var(--thumb-w,88px)!important;
    max-height:calc(100% - var(--thumb-h,66px))!important;
    display:flex!important;
    flex-direction:column-reverse!important;
    justify-content:flex-start!important;
    align-items:stretch!important;
    gap:0!important;
    padding:0!important;
    margin:0!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
}
.pagina-sala.sala-privada .thumbs-fila-abajo{
    position:absolute!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    top:auto!important;
    height:var(--thumb-h,66px)!important;
    display:flex!important;
    flex-direction:row-reverse!important;
    justify-content:flex-start!important;
    align-items:stretch!important;
    gap:0!important;
    padding:0!important;
    margin:0!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
}
.pagina-sala.sala-privada .thumbnail-participante{
    position:relative;
    box-sizing:border-box!important;
    width:var(--thumb-w,88px)!important;
    height:var(--thumb-h,66px)!important;
    flex:0 0 var(--thumb-w,88px)!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden;
    border:0!important;
    border-radius:0!important;
    background:#0d0f1c;
    pointer-events:auto;
    cursor:pointer;
    /* separador solo interno (no empuja ni abre hueco en la línea) */
    box-shadow:inset 1px 0 0 rgba(0,0,0,.45), inset 0 1px 0 rgba(0,0,0,.45);
    outline:none!important;
}
.pagina-sala.sala-privada .thumbs-columna-derecha .thumbnail-participante{
    flex:0 0 var(--thumb-h,66px)!important;
    width:var(--thumb-w,88px)!important;
    height:var(--thumb-h,66px)!important;
    box-shadow:inset 0 1px 0 rgba(0,0,0,.45);
}
.pagina-sala.sala-privada .thumbs-fila-abajo .thumbnail-participante:first-child{
    box-shadow:inset 1px 0 0 rgba(0,0,0,.45), inset 0 1px 0 rgba(0,0,0,.45);
}
.pagina-sala.sala-privada .thumbnail-participante:hover,
.pagina-sala.sala-privada .thumbnail-participante.thumbnail-speaking,
.pagina-sala.sala-privada .thumbnail-participante.thumbnail-active{
    z-index:3;
    /* inset: no desplaza la miniatura fuera de la línea */
    box-shadow:inset 0 0 0 2px rgba(85,201,0,.8)!important;
    outline:none!important;
}
@media(max-width:640px){.pagina-sala.sala-privada .pantalla-videollamada,
.pagina-sala.sala-privada .semi-escenario{
        --thumb-w:68px;
        --thumb-h:51px;
        border-radius:0!important;
    }
}
.pagina-sala.sala-privada .privada-aplicacion.layout-una-pantalla{display:grid}
.pagina-sala.sala-privada.privada-bloqueado #privada-composer-tools,
.pagina-sala.sala-privada.privada-bloqueado .sala-aplicacion{display:none!important}
.pagina-sala.sala-privada #privada-acesso-bloqueado[hidden]{display:none!important}
.pagina-sala.sala-privada #privada-acesso-bloqueado{
    display:grid;place-items:center;gap:8px;min-height:60vh;padding:32px 20px;
}
.pagina-sala.sala-privada #privada-acesso-bloqueado h2{margin:0;color:#fff;font-size:1.35rem}
.pagina-sala.sala-privada .sala-acesso-acoes{
    display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:8px;
}
.pagina-sala.sala-privada .sala-acesso-acoes .boton-secundario{
    display:inline-flex;align-items:center;justify-content:center;
    min-height:42px;padding:0 16px;border-radius:12px;text-decoration:none;
    border:1px solid rgba(255,255,255,.22);color:#e8f5e0;background:rgba(255,255,255,.06);
}
.pagina-sala.sala-privada .gaba3-header-back{
    border-color:rgba(85,201,0,.22);
    color:#c8f090;
}

/* ════════════════════════════════════════════════════════════════
   Acabamento premium da sala privada
   Apenas acabamento visual: não altera o grid, alturas, teclado,
   rolagem, permissões nem as ações da sala.
   ════════════════════════════════════════════════════════════════ */
.pagina-sala.sala-privada .identidad-sala .avatar-sala,
.pagina-sala.sala-privada .perfil-miniatura.is-profile-ball{
    position:relative;
    /* Pedido do dono 2026-09-22: nenhum anel de outra cor ao redor da
       foto — o anel dourado que existia aqui (outline-color + box-shadow
       em anel) escondia parte da imagem atrás de uma cor que não era
       dela. Só a imagem, sem moldura nenhuma. */
    outline:0!important;
    box-shadow:none!important;
}
.pagina-sala.sala-privada .titulo-en-vivo h1,
.pagina-sala.sala-privada .identidad-sala-texto h1{
    color:var(--privada-marfin)!important;
    text-shadow:0 2px 9px rgba(0,0,0,.52);
}
.pagina-sala.sala-privada .privada-e2e-badge,
.pagina-sala.sala-privada .privada-menu-btn{
    display:grid;
    place-items:center;
    width:30px;
    height:30px;
    border-radius:50%;
    background:transparent!important;
    border:1.5px solid rgba(109,255,74,.4);
    color:var(--privada-ouro-claro)!important;
    cursor:pointer;
    flex:none;
    border-color:transparent!important;
    box-shadow:none!important;
}
.pagina-sala.sala-privada .semi-escenario{
    position:absolute;
    inset:0;
    z-index:0;
    overflow:hidden;
    display:grid;
    place-items:stretch;
    background:linear-gradient(145deg,#0c100e,#040605)!important;
}
.pagina-sala.sala-privada .semi-lista-mensagens article > div{
    background:linear-gradient(145deg,rgba(255,250,231,.075),rgba(255,250,231,.032))!important;
    border:1px solid rgba(255,255,255,.08);
    border-radius:4px 14px 14px 14px;
    padding:7px 12px 8px;
    border-color:rgba(241,217,154,.18)!important;
    box-shadow:0 5px 12px rgba(0,0,0,.16);
}
.pagina-sala.sala-privada .semi-lista-mensagens b,
.pagina-sala.sala-privada .semi-chat-sala>footer.semi-chat-footer-convidado{
    border-top:none;
    padding:6px 10px 0;
    gap:6px;
    background:linear-gradient(180deg,rgba(3,10,6,.08),rgba(5,16,9,.5));
    box-shadow:inset 0 1px rgba(199,165,90,.18);
}
.pagina-sala.sala-privada .privada-icon-btn{
    display:inline-grid;
    place-items:center;
    width:30px;
    height:30px;
    padding:0;
    border:none;
    background:transparent;
    color:var(--privada-ouro-claro)!important;
    cursor:pointer;
    transition:color var(--gaba3-dur-rapida) var(--gaba3-curva),transform var(--gaba3-dur-rapida) var(--gaba3-curva);
    text-shadow:0 2px 8px rgba(0,0,0,.45);
}
.pagina-sala.sala-privada .form-chat :is(input,textarea):focus{
    border-color:var(--privada-ouro-claro)!important;
    outline:none;
    box-shadow:0 0 0 2px rgba(199,165,90,.15),inset 0 1px 4px rgba(0,0,0,.38)!important;
}
.pagina-sala.sala-privada .form-chat-privada .boton-principal{
    min-width:48px;
    width:48px;
    padding:0;
    border-radius:50%;
    background:linear-gradient(145deg,#79dc45,#3f9e22)!important;
    color:#081208!important;
    box-shadow:0 8px 18px rgba(39,130,21,.28),inset 0 1px rgba(255,255,255,.3)!important;
}
.pagina-sala.sala-privada .privada-roster-ball.is-online .av{
    border-color:#90ed58!important;
    box-shadow:0 0 0 2px rgba(113,220,75,.22),0 0 16px rgba(113,220,75,.12)!important;
}
.pagina-sala.sala-privada .privada-menu-btn:hover,
.pagina-sala.sala-privada .privada-e2e-badge:hover{
    border-color:var(--privada-ouro-claro)!important;
    transform:translateY(-1px);
}
@media (prefers-reduced-motion:no-preference){
    .pagina-sala.sala-privada .privada-menu-btn,
    .pagina-sala.sala-privada .privada-e2e-badge,
    .pagina-sala.sala-privada .form-chat :is(input,textarea),
    .pagina-sala.sala-privada .semi-lista-mensagens article > div{
        transition:border-color var(--gaba3-dur-rapida) var(--gaba3-curva),background var(--gaba3-dur-rapida) var(--gaba3-curva),box-shadow var(--gaba3-dur-rapida) var(--gaba3-curva),transform var(--gaba3-dur-rapida) var(--gaba3-curva);
    }
}
@media (max-width:720px){.pagina-sala.sala-privada .sala-aplicacion,
.pagina-sala.sala-privada .privada-aplicacion,
.pagina-sala.sala-privada .privada-aplicacion.layout-una-pantalla{
        padding-bottom:0!important;
    }
.pagina-sala.sala-privada .pantalla-videollamada,
.pagina-sala.sala-privada .semi-escenario{
        border-radius:0!important;
    }
.sala-privada .privada-aplicacion.layout-una-pantalla{
        display:grid!important;
        grid-template-columns:1fr!important;
        width:100%!important;
        max-width:none!important;
        padding:10px!important;
        padding-bottom:0!important;
        gap:10px!important;
        box-sizing:border-box!important;
    }
.sala-privada .semi-chat-sala{
        min-height:240px!important;
    }
}

/* Acabamento unificado: a madeira é uma única base contínua. Os painéis
   de mídia, chat e pessoas ficam acima dela como peças flutuantes.
   Esta é a ÚNICA regra de fundo da sala e da cabeceira — antes existiam
   3 versões espalhadas pelo arquivo (extraídas de estilo.css sem limpar
   depois), cada uma pisando a anterior com !important; quem fosse editar
   a cor/textura não sabia qual delas realmente valia. */
.pagina-sala.sala-privada{
    --privada-marrom-profundo:#1b0d05;
    --privada-madeira:#45220e;
    --privada-ouro:#c7a55a;
    --privada-ouro-claro:#f1d99a;
    --privada-marfin:#f8f0dc;
    --privada-verde-profundo:#08150d;
    --privada-verde-painel:#102417;
    color:var(--privada-marfin);
    background-image:
        radial-gradient(circle at 15% 0%,rgba(220,176,86,.12),transparent 28%),
        linear-gradient(180deg,rgba(7,3,1,.28),rgba(8,4,1,.14)),
        url("../../../assets/brand/fondo-piedra-gaba3.webp?v=1");
    background-attachment:fixed;
    background:
        linear-gradient(180deg,rgba(11,4,1,.16),rgba(38,16,4,.07)),
        url("../../../assets/brand/fondo-piedra-gaba3.webp?v=1") center/cover fixed!important;
}
.pagina-sala.sala-privada .cabecera-sala{
    /* A cabeceira é uma faixa bem fina (larga x baixa) — "cover" esticava
       a textura mais de 10x além do tamanho real da imagem e virava um
       borrão sem veio nenhum. Repete a imagem no tamanho quase original
       em vez de esticá-la, pra madeira aparecer de verdade. Mesma madeira
       escura do painel de chat (fondo-madera-oscura), pedido do dono —
       veio bem visível, sem gradiente escurecendo em cima. */
    background-image:
        linear-gradient(180deg,rgba(0,0,0,.08),rgba(0,0,0,.04)),
        url("../../../assets/brand/fondo-madera-oscura-gaba3.webp")!important;
    background-position:center,center!important;
    background-size:cover,auto 220px!important;
    background-repeat:no-repeat,repeat-x!important;
    border-bottom:1px solid rgba(199,165,90,.58)!important;
    box-shadow:0 10px 28px rgba(0,0,0,.46),inset 0 -1px rgba(255,235,181,.11)!important;
}
.pagina-sala.sala-privada .sala-aplicacion,
.pagina-sala.sala-privada .privada-aplicacion{
    background:transparent!important;
}
.pagina-sala.sala-privada .semi-escenario,
.pagina-sala.sala-privada .pantalla-videollamada{
    border-color:rgba(199,165,90,.62)!important;
    background:linear-gradient(145deg,#0c100e,#040605)!important;
    box-shadow:0 18px 34px rgba(19,7,1,.42),inset 0 0 0 1px rgba(255,235,181,.05)!important;
    position:relative;
    border:1px solid rgba(199,165,90,.62)!important;
    border-radius:22px!important;
    border-right:1px solid rgba(199,165,90,.62)!important;
    border-bottom:1px solid rgba(199,165,90,.62)!important;
}
.pagina-sala.sala-privada .semi-chat-sala{
    border-color:rgba(199,165,90,.52)!important;
    background-color:#1b0f06!important;
    background-image:
        url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='220'%20height='220'%3E%3Ctext%20x='10'%20y='44'%20transform='rotate(-16%2010%2044)'%20font-family='Segoe%20UI,Arial,sans-serif'%20font-size='20'%20font-weight='800'%20fill='%23f1d99a'%20fill-opacity='.04'%3EGABA3%3C/text%3E%3Ctext%20x='110'%20y='116'%20transform='rotate(-16%20110%20116)'%20font-family='Segoe%20UI,Arial,sans-serif'%20font-size='20'%20font-weight='800'%20fill='%23f1d99a'%20fill-opacity='.04'%3EGABA3%3C/text%3E%3Ctext%20x='24'%20y='191'%20transform='rotate(-16%2024%20191)'%20font-family='Segoe%20UI,Arial,sans-serif'%20font-size='20'%20font-weight='800'%20fill='%23f1d99a'%20fill-opacity='.04'%3EGABA3%3C/text%3E%3C/svg%3E"),
        linear-gradient(150deg,rgba(10,5,2,.32),rgba(6,3,1,.42)),
        url("../../../assets/brand/fondo-madera-oscura-gaba3.webp");
    background-repeat:repeat,no-repeat,no-repeat!important;
    background-size:220px 220px,auto,cover!important;
    grid-template-rows:minmax(120px,1fr) auto;
    background-position:0 0,center,center!important;
    box-shadow:0 18px 34px rgba(19,7,1,.42),inset 0 1px rgba(255,235,181,.06)!important;
    border-radius:22px!important;
}
/* Legibilidade acima da marca decorativa: mensagens claras, nome com um
   toque aqua discreto e horários ainda perceptíveis no fundo escuro. */
.pagina-sala.sala-privada .semi-lista-mensagens p{
    color:#ffffff!important;
    font-weight:500;
    text-shadow:0 2px 8px rgba(0,0,0,.76)!important;
    overflow-wrap:break-word;
    word-break:break-word;
}
.pagina-sala.sala-privada .semi-lista-mensagens b,
.pagina-sala.sala-privada .semi-lista-mensagens article.is-self b{
    color:#dffef9!important;
    text-shadow:0 2px 8px rgba(0,0,0,.76)!important;
}
.pagina-sala.sala-privada .semi-lista-mensagens small{
    color:rgba(232,255,251,.78)!important;
}
.pagina-sala.sala-privada .form-chat :is(input,textarea){
    background:rgba(3,12,7,.72)!important;
    border:1px solid rgba(143,255,103,.18);
    color:#ffffff!important;
    border-color:rgba(199,165,90,.6)!important;
    box-shadow:inset 0 1px 4px rgba(0,0,0,.38)!important;
}
.pagina-sala.sala-privada .form-chat :is(input,textarea)::placeholder{
    color:rgba(244,255,252,.72)!important;
}
/* o dono (2026-09-09): emoji e coração (o convite "de dentro") entram na
   própria píldora, junto do campo de escrever — mesmo padrão já aprovado
   na Sala de Criadores (".creator-message-pill"). Antes o coração vivia
   na fileira de ferramentas com uma cor marfim (quase branca) diferente
   do dourado dos outros ícones — "duas caixas de cor diferente" que o dono
   viu. A píldora agora é a caixa única (borda dourada), o campo de texto
   fica sem borda própria dentro dela, e os dois ícones usam a MESMA cor
   dourada de sempre — nunca mais uma cor "especial" destoando. */
.pagina-sala.sala-privada .privada-message-pill{
    display:flex;
    align-items:center;
    gap:2px;
    min-width:0;
    background:rgba(3,12,7,.72)!important;
    border:1px solid rgba(199,165,90,.6)!important;
    border-radius:14px;
    box-shadow:inset 0 1px 4px rgba(0,0,0,.38)!important;
    padding:0 2px;
}
.pagina-sala.sala-privada .privada-message-pill :is(input,textarea){
    flex:1 1 auto;
    min-width:0;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
}
.pagina-sala.sala-privada .privada-message-pill .privada-icon-btn{
    flex:0 0 auto;
    width:30px;
    height:30px;
    color:var(--privada-ouro-claro)!important;
}
.pagina-sala.sala-privada .privada-roster-bar{
    position:relative;
    z-index:5;
    padding:12px 16px;
    background:
        linear-gradient(180deg,rgba(19,7,1,.25),rgba(54,25,8,.10)),
        url("../../../assets/brand/fondo-madera-oscura-gaba3.webp") center/cover no-repeat!important;
    border-top:1px solid rgba(0,0,0,.35);
    box-shadow:0 -9px 24px rgba(0,0,0,.38),inset 0 1px rgba(255,235,181,.08)!important;
    border-top-color:rgba(199,165,90,.42)!important;
}
.pagina-sala.sala-privada .privada-roster-ball .av{
    display:grid;
    place-items:center;
    width:100%;
    height:100%;
    border-radius:50%;
    background:linear-gradient(150deg,#294726,#122615)!important;
    color:var(--privada-marfin)!important;
    font-size:13px;
    font-weight:800;
    border:2px solid rgba(255,255,255,.14);
    overflow:hidden;
    box-sizing:border-box;
    border-color:rgba(241,217,154,.48)!important;
    box-shadow:0 8px 16px rgba(21,7,1,.38),inset 0 1px rgba(255,248,221,.11)!important;
}

/* Desktop: a sala privada é uma única superfície de trabalho. A rolagem
   pertence somente ao histórico do chat; a página nunca deve fugir da tela
   ao usar a roda do mouse. */
@media (min-width:721px){
    body.pagina-sala.sala-privada{
        height:100vh;
        height:100dvh;
        min-height:0;
        overflow:hidden;
        display:grid;
        grid-template-rows:auto minmax(0,1fr) auto;
    }
    .pagina-sala.sala-privada .cabecera-sala{
        min-height:0;
    }
    .pagina-sala.sala-privada .sala-aplicacion.privada-aplicacion.layout-una-pantalla{
        width:min(1480px,100%);
        height:100%;
        min-height:0;
        min-width:0;
        margin:0 auto;
        padding:12px 22px 0;
        overflow:hidden;
        box-sizing:border-box;
        align-items:stretch;
    }
    .pagina-sala.sala-privada .zona-principal-sala,
    .pagina-sala.sala-privada .escenario-sala,
    .pagina-sala.sala-privada .pantalla-videollamada,
    .pagina-sala.sala-privada .semi-chat-sala{
        height:100%;
        min-height:0;
    }
    .pagina-sala.sala-privada .semi-lista-mensagens{
        min-height:0;
        overflow-y:auto;
        overscroll-behavior:contain;
    }
    .pagina-sala.sala-privada .privada-roster-bar{
        min-height:0;
        max-height:72px;
        padding:8px 16px;
        overflow:hidden;
        box-sizing:border-box;
    }
    .pagina-sala.sala-privada .privada-roster-bar-lista{
        flex-wrap:nowrap;
        max-width:none;
        overflow-x:auto;
        overflow-y:hidden;
        padding-bottom:2px;
        scrollbar-width:thin;
    }
}

/* V1/V2 (2026-10-12): a barra de pessoas no rodapé só existe com tela alta e larga.
   - Até 860 px de largura vale o layout do celular (private-event.css fixa a altura da sala
     em 100dvh - 72px); entre 821 e 860 px a barra ficava POR CIMA do campo de escrever e das
     figurinhas (celular deitado 844×390).
   - Tela baixa (celular deitado, teclado aberto): cada linha vai para as mensagens.
   As pessoas continuam no botão "Pessoas" da cabeça da sala. */
@media (max-width:860px), (max-height:500px){
    body.pagina-sala.sala-privada .privada-roster-bar{
        display:none;
    }
}

/* Figurinhas: o palco pode celebrar em tamanho grande, mas no histórico elas
   são um único item pequeno — nunca uma imagem que empurra ou desordena o chat. */
.pagina-sala.sala-privada .semi-lista-mensagens article.msg-figurinha{
    align-items:center;
    min-height:64px;
}
.pagina-sala.sala-privada .semi-lista-mensagens article.msg-figurinha > div{
    display:grid;
    grid-template-columns:1fr;
    justify-items:start;
    gap:1px;
    width:auto;
    min-width:0;
    max-width:min(100%,220px);
    padding:0;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
}
.pagina-sala.sala-privada .semi-lista-mensagens article.msg-figurinha.is-self > div{
    justify-items:end;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
}
.pagina-sala.sala-privada .semi-lista-mensagens article.msg-figurinha b{
    max-width:92px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:10px;
    line-height:1.15;
}
.pagina-sala.sala-privada .semi-lista-mensagens article.msg-figurinha small{
    font-size:9px;
    line-height:1.1;
}
/* Vários emojis na mesma mensagem ("😂😂👍") ficam numa fila, como no WhatsApp: antes a
   caixa de 52 px os empilhava e a figurinha invadia a mensagem de baixo (2026-10-14). */
.pagina-sala.sala-privada .msg-figurinha .gaba3-fig-chat-wrap{
    display:grid;
    width:auto;
    min-width:52px;
    margin:0;
}
.pagina-sala.sala-privada .msg-figurinha .gaba3-fig-face{
    font-size:28px;
    white-space:nowrap;
}
.pagina-sala.sala-privada .msg-figurinha .gaba3-fig-caption{
    display:none;
}
/* Caritas do chat ficam livres: sem disco, aro ou brilho externo. A animação
   continua sendo a própria figurinha, sem virar uma cápsula visual. */
.pagina-sala.sala-privada .msg-figurinha .gaba3-figurinha-chat{
    width:auto;
    min-width:50px;
    min-height:50px;
    padding:0!important;
    overflow:visible!important;
    background:transparent!important;
    border-radius:0!important;
    filter:none!important;
}
.pagina-sala.sala-privada .msg-figurinha .gaba3-fig-aura,
.pagina-sala.sala-privada .msg-figurinha .gaba3-fig-ring,
.pagina-sala.sala-privada .msg-figurinha .gaba3-fig-ornaments{
    display:none!important;
}
.pagina-sala.sala-privada .msg-figurinha .gaba3-fig-photo{
    width:32px;
    height:32px;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    background:transparent!important;
}
.pagina-sala.sala-privada .semi-lista-mensagens article{
    margin:2px 0 8px;
}
/* O chat é uma parede da sala, não uma sequência de cartões. Cada pessoa
   fala livremente sobre o fundo GABA3; a posição e o avatar identificam quem
   enviou a mensagem, sem cápsulas ou retângulos. */
.pagina-sala.sala-privada .semi-lista-mensagens article > div,
.pagina-sala.sala-privada .semi-lista-mensagens article.is-self > div{
    text-align:right;
    background:transparent!important;
    border-color:rgba(241,217,154,.36)!important;
    border-radius:0!important;
    border:0!important;
    box-shadow:none!important;
    /* --privada-msg-reserva: coluna do ⋮ (conversa-unica.css, só com mouse). */
    padding:2px var(--privada-msg-reserva,0px) 2px 0!important;
    text-shadow:0 2px 8px rgba(0,0,0,.58);
}
.pagina-sala.sala-privada .semi-lista-mensagens article > div p{
    margin:2px 0!important;
}
.pagina-sala.sala-privada .semi-lista-mensagens article.is-self > div p,
.pagina-sala.sala-privada .semi-lista-mensagens article.is-self > div small{
    text-align:right;
}
.pagina-sala.sala-privada #gaba3-invite-stage-host .gaba3-figurinha-stage{
    animation:gaba3FigurinhaStageEnter .42s cubic-bezier(.18,.84,.26,1) both;
}
@keyframes gaba3FigurinhaStageEnter{
    from{opacity:0;transform:translateY(34px) scale(.86)}
    72%{opacity:1;transform:translateY(-5px) scale(1.035)}
    to{opacity:1;transform:translateY(0) scale(1)}
}
/* Adicionar pessoa: foto + nome + @usuário + botão, sem estourar em celular */
.pagina-sala.sala-privada .privada-adicionar-item{display:flex;align-items:center;gap:10px;min-width:0}
.pagina-sala.sala-privada .privada-adicionar-foto{flex:0 0 44px!important;width:44px!important;min-width:44px!important;max-width:44px!important;height:44px!important;aspect-ratio:1/1;border-radius:50%!important;object-fit:cover;background:#1b2a1b;display:grid;place-items:center;font-weight:800;color:#9ef060;overflow:hidden}
.pagina-sala.sala-privada .privada-adicionar-info{flex:1 1 auto;min-width:0;display:flex;flex-direction:column}
.pagina-sala.sala-privada .privada-adicionar-info b,.pagina-sala.sala-privada .privada-adicionar-info small{overflow-wrap:anywhere}
.pagina-sala.sala-privada .privada-adicionar-botao{flex:0 0 auto;white-space:nowrap}
.pagina-sala.sala-privada .privada-adicionar-titulo{list-style:none;font-size:12px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:#9fbfa0;margin:4px 0}
.pagina-sala.sala-privada .privada-convite-pendente{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:12px;padding:14px;border:1px solid rgba(85,201,0,.45);border-radius:14px;background:rgba(10,30,14,.85);color:#e8ffd0}
.pagina-sala.sala-privada .privada-convite-pendente p{flex:1 1 100%;margin:0;font-weight:700;overflow-wrap:anywhere}
.pagina-sala.sala-privada .privada-convite-pendente button{flex:1 1 120px;min-height:44px;border-radius:12px;font-weight:800}
.pagina-sala.sala-privada .privada-convite-pendente button:not(.boton-principal){background:transparent!important;color:#ff9a9a!important;border:1px solid rgba(255,120,120,.65)!important}
.pagina-sala.sala-privada .privada-convite-pendente button.boton-principal{color:#06280a!important}
/* Los botones marcados hidden dentro de la pantalla de acceso deben desaparecer de verdad (antes una cuenta ya logueada seguía viendo "Já tenho conta" / "Quero criar minha conta"). */
#privada-acesso-bloqueado [hidden]{display:none!important}

/* Menu ☰ da sala: botão escondido fica escondido. `.boton-secundario` (display:
   inline-flex) ganhava do [hidden] do navegador e quem não é dono via "Nome e
   foto da sala", "Publicar em Vídeos Curtos" e "Gerenciar participantes". */
.pagina-sala.sala-privada .privada-perfil-sheet [hidden]{
    display:none!important;
}

/* Figurinha do teclado do celular (Gboard e outros): grande e inteira, fundo
   transparente, sem círculo nem borda — como chega no WhatsApp. */
.pagina-sala.sala-privada .msg-figurinha .gaba3-fig-teclado .gaba3-figurinha-chat{width:auto!important;min-height:0!important;animation:none!important}
.pagina-sala.sala-privada .msg-figurinha .gaba3-fig-teclado .gaba3-fig-photo{width:auto!important;height:auto!important;max-width:140px!important;max-height:140px!important;object-fit:contain!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;animation:none!important}
/* Foto de perfil de quem escreve: um pouco maior, para reconhecer a pessoa (como no WhatsApp). */
.pagina-sala.sala-privada #privada-lista-mensagens .avatar-chat{width:32px!important;height:32px!important;min-width:32px!important;flex:0 0 32px!important;font-size:11px!important}

/* Importar figurinhas (WhatsApp e outras): botão no topo de "Minhas" e as importadas inteiras, sem círculo. */
.privada-fig-importar{grid-column:1/-1;display:grid;gap:6px;margin:0 0 8px}
.privada-fig-importar-btn{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:8px 12px;border:1px dashed #c9a24a;background:rgba(20,10,3,.55);color:#f1d99a;font-weight:800;font-size:14px;cursor:pointer;text-align:center}
.privada-fig-importar-btn [data-morph-icone]{width:20px;height:20px}
.privada-fig-importar-ajuda{margin:0;font-size:12px;line-height:1.4;color:#d8cbb4;overflow-wrap:anywhere}
.privada-fig-mine.privada-fig-mine-sticker img{border-radius:0!important;border:0!important;object-fit:contain!important;background:transparent!important;box-shadow:none!important}

/* Mensagem fixada no alto e busca na conversa (2026-10-06). Seguem o tema do chat
   (--t-pill / --t-pill-txt); sem tema, a madeira escura. */
.pagina-sala.sala-privada .privada-fixada,.pagina-sala.sala-privada .privada-busca{position:sticky;top:0;z-index:3;display:flex;align-items:center;gap:6px;margin:0;padding:6px 8px;background:var(--t-pill,rgba(27,16,9,.94));color:var(--t-pill-txt,#f3ead8);border-bottom:1px solid rgba(0,0,0,.18);box-shadow:0 2px 8px rgba(0,0,0,.18)}
.pagina-sala.sala-privada .privada-fixada[hidden],.pagina-sala.sala-privada .privada-busca[hidden]{display:none!important}
.pagina-sala.sala-privada .privada-fixada-ir{flex:1 1 auto;min-width:0;display:flex;align-items:center;gap:8px;padding:2px 0;border:0;background:none;color:inherit;text-align:left;cursor:pointer}
.pagina-sala.sala-privada .privada-fixada-ir span{display:grid;min-width:0}
.pagina-sala.sala-privada .privada-fixada-ir b{font-size:12px;opacity:.85;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pagina-sala.sala-privada .privada-fixada-ir small{font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pagina-sala.sala-privada :is(.privada-fixada-tirar,.privada-busca button){flex:0 0 auto;min-width:34px;height:34px;border:0;border-radius:8px;background:transparent;color:inherit;font:700 18px/1 inherit;cursor:pointer}
.pagina-sala.sala-privada .privada-busca input{flex:1 1 auto;min-width:0;height:36px;padding:0 10px;border:1px solid rgba(127,127,127,.35);border-radius:18px;background:rgba(255,255,255,.92);color:#1d1d1d;font:inherit;font-size:15px}
.pagina-sala.sala-privada .privada-busca-contador{flex:0 0 auto;font-size:12px;opacity:.85;white-space:nowrap}
.pagina-sala.sala-privada #privada-lista-mensagens article.privada-busca-achado > div{outline:2px solid rgba(255,196,0,.45);outline-offset:2px}
.pagina-sala.sala-privada #privada-lista-mensagens article.privada-busca-atual > div{outline:3px solid #ffc400;outline-offset:2px}


/* Abrir a conversa sem "rodar" (2026-10-14): as bolhas são montadas escondidas e a lista
   aparece de uma vez, já no fim (privateRoom.js · montarSemRolar). */
#privada-lista-mensagens.privada-montando{visibility:hidden}
