/* GABA3 — sala privada como a conversa do WhatsApp (decisão do dono, 2026-10-09).
   Uma conversa só, em ordem de hora, no celular e no computador: acabou a tela
   dividida "palco de fotos em cima + conversa embaixo". Fotos e vídeos são
   quadrinhos na conversa; um toque abre o visor de tela cheia (mediaPanel.js).
   A camada de cima (câmera/chamada ao vivo, apresentação) só aparece em uso.
   Madeira escura da GABA3 em tudo; os temas da sala (chatAppearance) continuam
   pintando a conversa, as bolhas e a barra de baixo. Ícones só de linha. */

/* ───── 0. Escala de movimento da sala (bloco 5, 2026-10-10) ─────
   Uma régua só para tudo o que responde ao toque: rápida (botão, chave, reação) e média
   (menu que sobe, camada de cima, visor, zoom). Mesma curva em todos. O visor usa as mesmas
   variáveis no JavaScript (mediaPanel.js). Apresentações e festas têm o tempo delas. */
:root{
    --gaba3-dur-rapida:140ms;
    --gaba3-dur-media:220ms;
    --gaba3-curva:cubic-bezier(.2,.8,.2,1);
}

/* ───── 1. Uma coluna só: a conversa ocupa tudo entre a cabeçalho e a barra de escrever ───── */
html body.pagina-sala.sala-privada main.privada-aplicacion,
html body.pagina-sala.sala-privada main.privada-aplicacion.layout-una-pantalla{
    display:flex!important;
    flex-direction:column!important;
    grid-template-columns:none!important;
    grid-template-rows:none!important;
    gap:0!important;
    min-height:0!important;
    position:relative!important;
}
html body.pagina-sala.sala-privada main.privada-aplicacion > #privada-chat-sala{
    flex:1 1 auto!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    display:flex!important;
    flex-direction:column!important;
}
html body.pagina-sala.sala-privada main.privada-aplicacion > #privada-chat-sala[hidden]{display:none!important}
html body.pagina-sala.sala-privada #privada-chat-sala .semi-lista-mensagens{
    flex:1 1 auto!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior:contain;
    padding:8px 10px 12px!important;
}

/* ───── 2. Camada de cima: escondida; em uso, por cima do começo da conversa ───── */
html body.pagina-sala.sala-privada main.privada-aplicacion > .zona-principal-sala{display:none!important}
html body.pagina-sala.sala-privada.privada-palco-em-uso main.privada-aplicacion > .zona-principal-sala{
    display:flex!important;
    position:absolute!important;
    inset:0 0 auto 0!important;
    z-index:30!important;
    flex:none!important;
    height:min(52dvh,460px)!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    background:#050302;
    border-bottom:2px solid rgba(199,165,90,.55);
    box-shadow:0 12px 28px rgba(0,0,0,.55);
    animation:gaba3-camada-entra var(--gaba3-dur-media) var(--gaba3-curva) both;
}
html body.pagina-sala.sala-privada.privada-palco-em-uso.privada-teclado-aberto main.privada-aplicacion > .zona-principal-sala{
    height:clamp(120px,26dvh,200px)!important;
}
html body.pagina-sala.sala-privada.privada-palco-em-uso main.privada-aplicacion > .zona-principal-sala :is(.escenario-sala,.semi-escenario,.pantalla-directo,.pantalla-videollamada){
    flex:1 1 auto!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    max-height:none!important;
    block-size:100%!important;
    min-block-size:0!important;
    max-block-size:none!important;
    margin:0!important;
    border-radius:0!important;
}
@keyframes gaba3-camada-entra{from{transform:translateY(-14px);opacity:0}to{transform:none;opacity:1}}
.pagina-sala.sala-privada .privada-palco-fechar{
    position:absolute;
    top:8px;
    right:8px;
    z-index:70;
    display:grid;
    place-items:center;
    width:44px;
    height:44px;
    padding:0;
    border:0;
    background:transparent;
    color:#f4ead8;
    cursor:pointer;
    filter:drop-shadow(0 1px 3px #000) drop-shadow(0 0 8px rgba(0,0,0,.6));
}
.pagina-sala.sala-privada .privada-palco-fechar[hidden]{display:none}
.pagina-sala.sala-privada .privada-palco-fechar svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}

/* ───── 3. Computador: coluna central (até 860 px) com moldura de madeira ───── */
@media (min-width:821px){
    html body.pagina-sala.sala-privada main.privada-aplicacion,
    html body.pagina-sala.sala-privada main.privada-aplicacion.layout-una-pantalla{
        width:min(860px,calc(100% - 24px))!important;
        max-width:860px!important;
        margin:0 auto!important;
        padding:0 10px!important;
        box-sizing:border-box!important;
        background:
            linear-gradient(180deg,rgba(40,20,8,.35),rgba(14,7,3,.5)),
            url("../../../assets/brand/fondo-madera-oscura-gaba3.webp?v=real1") center/cover!important;
        border-left:1px solid rgba(199,165,90,.45)!important;
        border-right:1px solid rgba(199,165,90,.45)!important;
        box-shadow:0 0 0 1px rgba(0,0,0,.4),0 18px 48px rgba(0,0,0,.55)!important;
    }
    html body.pagina-sala.sala-privada main.privada-aplicacion > #privada-chat-sala{
        border:0!important;
        border-left:1px solid rgba(199,165,90,.28)!important;
        border-right:1px solid rgba(199,165,90,.28)!important;
        border-radius:0!important;
        box-shadow:none!important;
    }
    html body.pagina-sala.sala-privada.privada-palco-em-uso main.privada-aplicacion > .zona-principal-sala{
        left:10px!important;
        right:10px!important;
    }
}

/* ───── 4. Foto e vídeo na conversa: quadrinho na bolha (meus à direita, dos outros à esquerda) ───── */
html body.pagina-sala.sala-privada .semi-lista-mensagens article.msg-midia > div{
    /* a coluna do ⋮ (--privada-msg-reserva) vale também na foto: antes ele ficava em cima dela. */
    padding:3px calc(3px + var(--privada-msg-reserva,0px)) 4px 3px!important;
    min-width:0;
}
html body.pagina-sala.sala-privada .semi-lista-mensagens article.msg-midia > div > b{padding:2px 6px 3px;display:block}
html body.pagina-sala.sala-privada .semi-lista-mensagens article.msg-midia > div > small{padding:0 6px}
.pagina-sala.sala-privada .privada-midia-botao{
    display:flex;
    flex-direction:column;
    gap:4px;
    width:min(64vw,260px);
    max-width:100%;
    padding:0;
    border:0;
    border-radius:10px;
    background:transparent;
    color:inherit;
    font:inherit;
    text-align:left;
    cursor:pointer;
    -webkit-touch-callout:none;
}
.pagina-sala.sala-privada .privada-midia-miniatura{
    position:relative;
    display:grid;
    place-items:center;
    width:100%;
    aspect-ratio:4/3;
    max-height:340px;
    border-radius:9px;
    overflow:hidden;
    background:
        linear-gradient(160deg,rgba(40,20,8,.55),rgba(14,7,3,.75)),
        url("../../../assets/brand/fondo-madera-oscura-gaba3.webp?v=real1") center/cover;
}
.pagina-sala.sala-privada .privada-midia-miniatura > :is(img,video){
    grid-area:1/1;
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    -webkit-user-drag:none;
    user-select:none;
}
/* Miniatura que veio na mensagem: borrada até a foto de verdade abrir (o vídeo fica nítido: é o primeiro quadro). */
.pagina-sala.sala-privada .privada-midia-miniatura .privada-midia-mini{filter:blur(6px);transform:scale(1.06)}
.pagina-sala.sala-privada article.msg-midia .privada-midia-miniatura:has(.privada-midia-play) .privada-midia-mini{filter:none;transform:none}
.pagina-sala.sala-privada .privada-midia-icone,
.pagina-sala.sala-privada .privada-midia-play,
.pagina-sala.sala-privada .privada-midia-falha{
    grid-area:1/1;
    z-index:1;
    display:grid;
    place-items:center;
    gap:6px;
    color:#f4ead8;
    filter:drop-shadow(0 1px 3px rgba(0,0,0,.9)) drop-shadow(0 0 10px rgba(0,0,0,.55));
    pointer-events:none;
}
.pagina-sala.sala-privada :is(.privada-midia-icone,.privada-midia-play,.privada-midia-falha) svg{
    width:46px;
    height:46px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.7;
    stroke-linecap:round;
    stroke-linejoin:round;
}
.pagina-sala.sala-privada .privada-midia-falha small{font:600 12px/1.3 Inter,system-ui,sans-serif;text-align:center;padding:0 10px}
.pagina-sala.sala-privada .privada-midia-duracao{
    position:absolute;
    left:8px;
    bottom:6px;
    z-index:1;
    color:#fff;
    font:700 12px/1 Inter,system-ui,sans-serif;
    text-shadow:0 1px 3px #000,0 0 8px rgba(0,0,0,.8);
    pointer-events:none;
}
.pagina-sala.sala-privada .privada-midia-miniatura.is-abrindo::after{
    content:'';
    grid-area:1/1;
    width:30px;
    height:30px;
    border:2px solid rgba(244,234,216,.35);
    border-top-color:#f4ead8;
    border-radius:50%;
    animation:gaba3-midia-gira .9s linear infinite;
}
@keyframes gaba3-midia-gira{to{transform:rotate(360deg)}}
.pagina-sala.sala-privada .privada-midia-legenda{
    display:block;
    padding:0 6px;
    font-size:var(--chat-letra,15px);
    line-height:1.35;
    overflow-wrap:anywhere;
    white-space:pre-wrap;
}
.pagina-sala.sala-privada article.msg-midia.is-enviando .privada-midia-miniatura{opacity:.7}
.pagina-sala.sala-privada article.msg-midia.is-enviando > div > small{display:block;text-align:right;padding:2px 6px 0}

/* Cartão da festa no começo da conversa: sem foto, o aviso "Ainda não há fotos" só enquanto não há. */
.pagina-sala.sala-privada #privada-lista-mensagens:has(article[data-media-id]) .momentos-hero-vazio{display:none}

/* ───── 5. Segurar o dedo / ⋮ : menu da mensagem ───── */
/* No celular, segurar não seleciona o texto nem abre o menu do sistema (o "Copiar" está no menu). */
@media (pointer:coarse){
    .pagina-sala.sala-privada #privada-lista-mensagens article{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
}
.pagina-sala.sala-privada #privada-lista-mensagens article > div{position:relative}
.pagina-sala.sala-privada .privada-msg-mais{
    position:absolute;
    top:2px;
    right:2px;
    z-index:2;
    display:none;
    place-items:center;
    width:28px;
    height:28px;
    padding:0;
    border:0;
    background:transparent;
    color:currentColor;
    opacity:.8;
    cursor:pointer;
    filter:drop-shadow(0 1px 2px rgba(0,0,0,.6));
}
.pagina-sala.sala-privada .privada-msg-mais svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round}
@media (hover:hover) and (pointer:fine){
    .pagina-sala.sala-privada #privada-lista-mensagens article:is(:hover,:focus-within) .privada-msg-mais{display:grid}
}
.pagina-sala.sala-privada #privada-lista-mensagens article.is-com-menu > div{outline:2px solid rgba(217,191,127,.75);outline-offset:2px}

.privada-acoes-fundo{position:fixed;inset:0;z-index:2147483050;background:rgba(8,4,2,.55)}
.privada-acoes-fundo[hidden],.privada-acoes-folha[hidden]{display:none}
.privada-acoes-folha{
    position:fixed;
    left:50%;
    bottom:0;
    z-index:2147483100;
    transform:translateX(-50%);
    width:min(520px,100vw);
    max-height:min(78dvh,620px);
    overflow-y:auto;
    overscroll-behavior:contain;
    box-sizing:border-box;
    padding:10px 10px calc(env(safe-area-inset-bottom,0px) + 12px);
    border:1px solid rgba(199,165,90,.5);
    border-bottom:0;
    border-radius:18px 18px 0 0;
    background:
        linear-gradient(160deg,rgba(40,20,8,.40),rgba(14,7,3,.58)),
        url("../../../assets/brand/fondo-madera-oscura-gaba3.webp?v=real1") center/cover;
    color:#f4ead8;
    font:500 15px/1.3 Inter,system-ui,sans-serif;
    box-shadow:0 -12px 36px rgba(0,0,0,.55);
    animation:gaba3-folha-sobe var(--gaba3-dur-media) var(--gaba3-curva) both;
}
@keyframes gaba3-folha-sobe{from{transform:translate(-50%,24px);opacity:.4}to{transform:translate(-50%,0);opacity:1}}
.privada-acoes-titulo{margin:2px 6px 8px;font-size:13px;opacity:.78;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.privada-acoes-folha .privada-reacoes-rapidas{display:flex;gap:2px;justify-content:space-between;margin:0 0 8px;padding:2px 4px;border-radius:999px;background:rgba(14,7,3,.6);border:1px solid rgba(199,165,90,.35)}
.privada-acoes-folha .privada-reacoes-rapidas[hidden]{display:none}
.privada-acoes-folha .privada-reacoes-rapidas button{min-width:44px;min-height:44px;padding:0;border:0;border-radius:999px;background:transparent;font-size:24px;line-height:1;cursor:pointer;transition:transform var(--gaba3-dur-rapida) var(--gaba3-curva)}
.privada-acoes-folha .privada-reacoes-rapidas button:focus-visible{outline:2px solid #ffd77a;outline-offset:1px}
.privada-acoes-folha .privada-reacoes-rapidas button:active{transform:scale(1.25)}
.privada-acoes-folha .privada-reacoes-rapidas button[aria-pressed="true"]{background:rgba(217,191,127,.3)}
.privada-acoes-lista{display:grid;gap:2px}
.privada-acoes-lista[hidden]{display:none}
.privada-acoes-lista button{
    display:flex;
    align-items:center;
    gap:14px;
    width:100%;
    min-height:48px;
    padding:8px 12px;
    border:0;
    border-radius:10px;
    background:transparent;
    color:inherit;
    font:inherit;
    text-align:left;
    cursor:pointer;
}
.privada-acoes-lista button:hover,.privada-acoes-lista button:focus-visible{background:rgba(217,191,127,.14);outline:none}
.privada-acoes-lista svg{flex:0 0 22px;width:22px;height:22px;fill:none;stroke:#d9bf7f;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.privada-acoes-lista button.is-perigo{color:#ffb4a6}
.privada-acoes-lista button.is-perigo svg{stroke:#ff9d8a}
.privada-acoes-confirma{padding:6px 6px 2px}
.privada-acoes-confirma p{margin:0 0 12px;line-height:1.4;overflow-wrap:anywhere}
.privada-acoes-confirma-botoes{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}
.privada-acoes-confirma-botoes button{min-height:44px;padding:0 16px;border-radius:10px;font:700 15px/1 Inter,system-ui,sans-serif;cursor:pointer}
.privada-acoes-cancelar{border:1px solid rgba(199,165,90,.5);background:transparent;color:#f4ead8}
.privada-acoes-perigo{border:0;background:linear-gradient(180deg,#a8321f,#7f2414);color:#fff}
.privada-acoes-perigo:disabled{opacity:.6}
.privada-acoes-erro{margin:8px 6px 0;padding:10px 12px;border-radius:10px;background:linear-gradient(180deg,#5a2d12,#45220e);border:1px solid rgba(255,214,150,.35);color:#fbeed6;line-height:1.4;overflow-wrap:anywhere}
.privada-acoes-erro[hidden]{display:none}

/* "Eliminado para você · Desfazer": plaquinha de madeira logo acima da barra de escrever. */
.privada-desfazer{
    position:absolute;
    left:50%;
    bottom:calc(100% - 4px);
    transform:translateX(-50%);
    z-index:40;
    display:flex;
    align-items:center;
    gap:14px;
    max-width:calc(100% - 24px);
    padding:8px 10px 8px 14px;
    border-radius:12px;
    background:linear-gradient(180deg,#5a2d12,#45220e);
    border:1px solid rgba(255,214,150,.4);
    color:#fbeed6;
    font:500 14px/1.3 Inter,system-ui,sans-serif;
    box-shadow:0 6px 18px rgba(0,0,0,.5);
}
#privada-chat-sala > .privada-desfazer{position:absolute;bottom:84px}
.privada-desfazer[hidden]{display:none}
.privada-desfazer button{min-height:44px;padding:0 10px;border:0;background:transparent;color:#ffd77a;font:800 14px/1 Inter,system-ui,sans-serif;text-transform:uppercase;letter-spacing:.04em;cursor:pointer}
html body.pagina-sala.sala-privada #privada-chat-sala{position:relative}
/* Aviso rápido ("Mensagem copiada.", "Não foi possível…"): a mesma plaquinha, por cima da conversa.
   Fora da coluna, a conversa e a barra de escrever não pulam quando ele aparece e some (bloco 5). */
html body.pagina-sala.sala-privada #privada-estado-msg.is-aviso-rapido{
    position:absolute;
    left:50%;
    bottom:calc(env(safe-area-inset-bottom,0px) + 84px);
    z-index:40;
    box-sizing:border-box;
    width:max-content;
    max-width:calc(100% - 32px);
    min-height:0;
    margin:0;
    padding:8px 14px;
    border-radius:12px;
    background:linear-gradient(180deg,#5a2d12,#45220e);
    border:1px solid rgba(255,214,150,.4);
    color:#fbeed6;
    font:500 14px/1.3 Inter,system-ui,sans-serif;
    text-align:center;
    overflow-wrap:anywhere;
    box-shadow:0 6px 18px rgba(0,0,0,.5);
    pointer-events:none;
    transform:translateX(-50%);
    animation:gaba3-aviso-entra var(--gaba3-dur-media) var(--gaba3-curva) both;
}
@keyframes gaba3-aviso-entra{from{opacity:0;transform:translate(-50%,8px)}to{opacity:1;transform:translate(-50%,0)}}

/* ───── 6. Visor de tela cheia ───── */
.gaba3-visor{
    --visor-fundo:1;
    position:fixed;
    inset:0;
    z-index:2147483000;
    display:flex;
    flex-direction:column;
    background:rgba(0,0,0,var(--visor-fundo));
    touch-action:none;
    overscroll-behavior:contain;
    user-select:none;
    -webkit-user-select:none;
    -webkit-touch-callout:none;
}
.gaba3-visor[hidden]{display:none}
body.gaba3-visor-aberto{overflow:hidden!important;overscroll-behavior:none}
.gaba3-visor-topo{
    position:absolute;
    inset:0 0 auto;
    z-index:3;
    display:flex;
    align-items:center;
    gap:10px;
    padding:calc(env(safe-area-inset-top,0px) + 6px) 8px 14px;
    background:linear-gradient(180deg,rgba(0,0,0,.72),transparent);
    color:#f4ead8;
    transition:opacity var(--gaba3-dur-media) var(--gaba3-curva);
}
.gaba3-visor-quem{flex:1 1 auto;min-width:0;display:grid}
.gaba3-visor-quem b{font:700 15px/1.25 Inter,system-ui,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gaba3-visor-quem small{font:500 12px/1.3 Inter,system-ui,sans-serif;opacity:.8}
.gaba3-visor-fechar,.gaba3-visor-mais,.gaba3-visor-seta,.gaba3-visor-envio button{
    display:grid;
    place-items:center;
    width:46px;
    height:46px;
    flex:0 0 auto;
    padding:0;
    border:0;
    background:transparent;
    color:#fff;
    cursor:pointer;
    filter:drop-shadow(0 1px 3px rgba(0,0,0,.9));
}
.gaba3-visor :is(.gaba3-visor-fechar,.gaba3-visor-mais,.gaba3-visor-seta,.gaba3-visor-envio button) svg{
    width:25px;
    height:25px;
    fill:none;
    stroke:currentColor;
    stroke-width:2.1;
    stroke-linecap:round;
    stroke-linejoin:round;
}
.gaba3-visor-mais svg{stroke-width:3}
.gaba3-visor-envio button:disabled{opacity:.5}
.gaba3-visor-palco{
    position:relative;
    flex:1 1 auto;
    min-height:0;
    overflow:hidden;
    touch-action:none;
}
.gaba3-visor.is-ampliada .gaba3-visor-palco{cursor:grab}
.gaba3-visor-slide{
    position:absolute;
    inset:0;
    display:grid;
    grid-template-rows:100%;
    grid-template-columns:100%;
    place-items:center;
    will-change:transform;
}
.gaba3-visor-slide > :is(img,video){
    grid-area:1/1;
    max-width:100%;
    max-height:100%;
    width:auto;
    height:auto;
    object-fit:contain;
    display:block;
    transform-origin:center center;
    will-change:transform;
    -webkit-user-drag:none;
}
.gaba3-visor-slide > .gaba3-visor-previa{width:min(100%,72vh);height:auto;filter:blur(10px);opacity:.75}
.gaba3-visor-espera{grid-area:1/1;z-index:1;display:grid;justify-items:center;gap:8px;margin:0;padding:0 24px;color:#d9c9ac;font:500 14px/1.4 Inter,system-ui,sans-serif;text-align:center}
.gaba3-visor-espera svg{width:34px;height:34px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.gaba3-visor-denovo{grid-area:2/1;align-self:start;margin-top:64px;min-height:44px;padding:0 18px;border:1px solid rgba(199,165,90,.6);border-radius:10px;background:rgba(40,20,8,.7);color:#f4ead8;font:700 14px/1 Inter,system-ui,sans-serif;cursor:pointer}
.gaba3-visor-rodape{
    position:absolute;
    inset:auto 0 0;
    z-index:3;
    display:grid;
    gap:4px;
    justify-items:center;
    padding:22px 12px calc(env(safe-area-inset-bottom,0px) + 10px);
    background:linear-gradient(0deg,rgba(0,0,0,.72),transparent);
    transition:opacity var(--gaba3-dur-media) var(--gaba3-curva);
}
.gaba3-visor-legenda{margin:0;max-width:min(680px,100%);max-height:28dvh;overflow-y:auto;color:#f4ead8;font:500 15px/1.4 Inter,system-ui,sans-serif;text-align:center;overflow-wrap:anywhere;white-space:pre-wrap}
.gaba3-visor-legenda[hidden]{display:none}
.gaba3-visor-acoes,.gaba3-visor-envio{display:flex;justify-content:center;gap:22px}
.gaba3-visor-seta{position:absolute;top:50%;z-index:3;width:52px;height:72px;transform:translateY(-50%);transition:opacity var(--gaba3-dur-media) var(--gaba3-curva)}
.gaba3-visor-seta[hidden]{display:none}
.gaba3-visor-seta.is-anterior{left:4px}
.gaba3-visor-seta.is-proxima{right:4px}
@media (pointer:coarse){.gaba3-visor-seta{display:none!important}}
/* Um toque esconde os botões (ver só a foto); outro toque traz de volta. Ampliada, também somem. */
.gaba3-visor.sem-botoes :is(.gaba3-visor-topo,.gaba3-visor-rodape,.gaba3-visor-seta),
.gaba3-visor.is-ampliada :is(.gaba3-visor-rodape,.gaba3-visor-seta){opacity:0;pointer-events:none}
/* Menos movimento pedido no aparelho (bloco 5): TODA a sala privada para de se mexer — menus,
   visor, camada de cima, apresentações e festas ficam no quadro final, sem atraso nem repetição.
   Duração de 1 ms (e não "none") para os avisos de fim de animação continuarem chegando ao JS.
   html body.pagina-sala.sala-privada * ganha das regras com atraso marcado das apresentações. */
@media (prefers-reduced-motion:reduce){
    html body.pagina-sala.sala-privada *,
    html body.pagina-sala.sala-privada *::before,
    html body.pagina-sala.sala-privada *::after{
        animation-duration:1ms!important;
        animation-delay:0s!important;
        animation-iteration-count:1!important;
        transition-duration:1ms!important;
    }
    /* Balões e serpentinas da festa em tela cheia: a versão parada não tem enfeite caindo. */
    .gaba3-celebration-root .gaba3-celebration-fx{display:none}
}

/* ───── 7. Participantes: o dono deixa um administrador mudar nome e foto ───── */
.privada-membros-permissao{display:flex;align-items:center;gap:10px;flex:1 1 100%;min-height:44px;font-size:14px;cursor:pointer;overflow-wrap:anywhere}
.privada-membros-permissao input{appearance:none;-webkit-appearance:none;flex:0 0 42px;width:42px;height:24px;margin:0;border-radius:12px;background:rgba(14,7,3,.8);border:1px solid rgba(199,165,90,.55);position:relative;cursor:pointer;transition:background var(--gaba3-dur-rapida) var(--gaba3-curva)}
.privada-membros-permissao input::after{content:'';position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:#d9c9ac;transition:transform var(--gaba3-dur-rapida) var(--gaba3-curva)}
.privada-membros-permissao input:checked{background:#5c8f2a}
.privada-membros-permissao input:checked::after{transform:translateX(18px);background:#f4ead8}
.privada-membros-permissao input:focus-visible{outline:2px solid #d9bf7f;outline-offset:2px}
.privada-membros-permissao input:disabled{opacity:.6}

/* ───── 8. Fora do grupo (QA 2026-10-09): saiu noutro aparelho ou foi removido ───── */
#privada-lista-mensagens .privada-fora-do-grupo{display:flex;flex-direction:column;align-items:center;gap:8px;padding:10px 14px;font-size:13px}
#privada-lista-mensagens .privada-fora-voltar{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 18px;border-radius:10px;background:linear-gradient(180deg,#5a2d12,#45220e);border:1px solid rgba(255,214,150,.4);color:#fbeed6;font-weight:700;text-decoration:none}
#privada-lista-mensagens .privada-fora-voltar:focus-visible{outline:2px solid #d9bf7f;outline-offset:2px}
body.privada-fora-do-grupo #privada-form-chat{opacity:.55;pointer-events:none}
#privada-lista-mensagens article.is-recusada{opacity:.75}
#privada-lista-mensagens article.is-recusada .privada-msg-hora{color:#e9a08a;font-style:italic}

/* ───── 9. Bloco 2 (2026-10-10): mensagem que não saiu fica na tela, com Reenviar e Descartar ───── */
#privada-lista-mensagens article.is-recusada small{color:#e9a08a;font-style:italic;white-space:normal;overflow-wrap:anywhere}
#privada-lista-mensagens .privada-fila-acoes{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
#privada-lista-mensagens .privada-fila-acoes button{min-height:44px;padding:0 14px;border-radius:10px;background:linear-gradient(180deg,#5a2d12,#45220e);border:1px solid rgba(255,214,150,.4);color:#fbeed6;font-weight:700;font-size:13px;cursor:pointer}
#privada-lista-mensagens .privada-fila-acoes button + button{background:transparent;color:#f1dcb4}
#privada-lista-mensagens .privada-fila-acoes button:focus-visible{outline:2px solid #d9bf7f;outline-offset:2px}

/* ───── 9. Bloco 3 (2026-10-10): busca em toda a conversa, recibos de grupo, seleção ───── */
/* ⋮ de cada bolha: no computador aparece ao passar o mouse E com o teclado (Tab); área de toque de 44 px. */
@media (hover:hover) and (pointer:fine){
    .pagina-sala.sala-privada #privada-lista-mensagens article .privada-msg-mais{display:grid;opacity:0}
    .pagina-sala.sala-privada #privada-lista-mensagens article:is(:hover,:focus-within) .privada-msg-mais{opacity:.8}
    /* V5 (2026-10-12): o ⋮ tem a sua própria coluna dentro da bolha. Antes ficava invisível
       POR CIMA da hora (um clique na hora abria o menu) e, ao aparecer, tapava a hora. */
    .pagina-sala.sala-privada #privada-lista-mensagens article > div:has(> .privada-msg-mais){--privada-msg-reserva:32px}
}
.pagina-sala.sala-privada .privada-msg-mais::before{content:"";position:absolute;inset:-8px}
.pagina-sala.sala-privada .privada-msg-mais:focus-visible{opacity:1;outline:2px solid #ffd77a;outline-offset:1px}

/* Busca: linha do progresso ("Buscando em mensagens anteriores…" + Parar) e lista de resultados. */
.pagina-sala.sala-privada .privada-busca{flex-wrap:wrap}
.pagina-sala.sala-privada .privada-busca .privada-busca-contador{min-width:44px;padding:0 6px;font:600 12px/1 Inter,system-ui,sans-serif;white-space:nowrap}
.pagina-sala.sala-privada .privada-busca .privada-busca-contador:disabled{cursor:default}
.pagina-sala.sala-privada .privada-busca .privada-busca-contador:not(:disabled){text-decoration:underline;text-underline-offset:3px}
.privada-busca-progresso{flex:1 0 100%;display:flex;align-items:center;gap:10px;margin:4px 0 0;font-size:13px;line-height:1.3}
.privada-busca-progresso[hidden]{display:none}
.privada-busca-progresso span{flex:1 1 auto;min-width:0;overflow-wrap:anywhere}
.pagina-sala.sala-privada .privada-busca .privada-busca-progresso button{min-width:44px;height:44px;padding:0 12px;border:1px solid rgba(199,165,90,.6);border-radius:10px;color:#ffd77a;font:700 13px/1 Inter,system-ui,sans-serif}
.pagina-sala.sala-privada .privada-busca .privada-busca-progresso button[hidden]{display:none}
.privada-busca-resultados{flex:1 0 100%;max-height:min(42dvh,360px);margin:6px 0 0;padding:0;overflow-y:auto;overscroll-behavior:contain;list-style:none;border-top:1px solid rgba(199,165,90,.3)}
.privada-busca-resultados[hidden]{display:none}
.pagina-sala.sala-privada .privada-busca .privada-busca-resultado{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 10px;width:100%;height:auto;min-height:48px;padding:8px 6px;border-radius:8px;text-align:left;font:500 14px/1.3 Inter,system-ui,sans-serif}
.privada-busca-resultado b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.privada-busca-resultado small{font-size:12px;opacity:.72;white-space:nowrap}
.privada-busca-resultado span{grid-column:1 / -1;opacity:.9;overflow-wrap:anywhere}
.pagina-sala.sala-privada .privada-busca .privada-busca-resultado[aria-current="true"],
.pagina-sala.sala-privada .privada-busca .privada-busca-resultado:focus-visible{background:rgba(217,191,127,.16);outline:none}

/* Marca da mensagem: dois ✓ separados (lida só por alguns = o primeiro na cor de destaque). */
.privada-visto-marca span + span{margin-left:-.42em}
.privada-visto-marca span:empty{display:none}
.privada-visto-marca.parcial span:first-child{color:#59c1ff}
.privada-visto-marca::before{content:"";position:absolute;inset:-10px -6px}

/* "Informações da mensagem" (grupo). */
.privada-info-msg header button{min-width:44px;min-height:44px}
.privada-info-msg-trecho{margin:12px 16px 4px;padding:8px 10px;border-radius:10px;background:rgba(0,0,0,.25);overflow-wrap:anywhere}
.privada-info-msg-listas{padding:0 16px 14px}
.privada-info-msg h3{margin:14px 0 6px;font:700 12px/1.2 Inter,system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase;opacity:.8}
.privada-info-msg ul{margin:0;padding:0;list-style:none}
.privada-info-msg li{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:40px;border-bottom:1px solid rgba(255,255,255,.08)}
.privada-info-msg li b{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.privada-info-msg li small{flex:0 0 auto;opacity:.75;white-space:nowrap}

/* Seleção de várias mensagens: barra de madeira no alto com a contagem e as ações. */
.privada-selecao{
    position:fixed;
    top:0;
    left:0;
    right:0;
    z-index:2147483000;
    display:flex;
    align-items:center;
    gap:6px;
    min-height:56px;
    box-sizing:border-box;
    padding:calc(env(safe-area-inset-top,0px) + 6px) 8px 6px;
    border-bottom:1px solid rgba(199,165,90,.5);
    background:
        linear-gradient(160deg,rgba(40,20,8,.40),rgba(14,7,3,.58)),
        url("../../../assets/brand/fondo-madera-oscura-gaba3.webp?v=real1") center/cover;
    color:#f4ead8;
    font:600 16px/1.2 Inter,system-ui,sans-serif;
    box-shadow:0 6px 18px rgba(0,0,0,.45);
}
.privada-selecao[hidden]{display:none}
.privada-selecao button{display:grid;place-items:center;min-width:44px;min-height:44px;padding:0;border:0;border-radius:10px;background:transparent;color:inherit;cursor:pointer}
.privada-selecao button[hidden]{display:none}
.privada-selecao button:hover,.privada-selecao button:focus-visible{background:rgba(217,191,127,.14);outline:none}
.privada-selecao svg{width:24px;height:24px;fill:none;stroke:#d9bf7f;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.privada-selecao .is-perigo svg{stroke:#ff9d8a}
.privada-selecao-contagem{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.privada-selecao-acoes{display:flex;gap:2px}
.privada-selecao-acoes[hidden]{display:none}
.privada-selecao-confirma{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:8px}
.privada-selecao-confirma[hidden]{display:none}
.privada-selecao-confirma span{font-size:14px;overflow-wrap:anywhere}
.privada-selecao .privada-selecao-confirma button{padding:0 14px;font:700 14px/1 Inter,system-ui,sans-serif}
.privada-selecao .privada-selecao-confirma .privada-acoes-cancelar{border:1px solid rgba(199,165,90,.5)}
.privada-selecao .privada-selecao-confirma .privada-acoes-perigo{background:linear-gradient(180deg,#a8321f,#7f2414);color:#fff}
.privada-selecao .privada-selecao-confirma .privada-acoes-perigo:disabled{opacity:.6}
body.privada-selecionando #privada-lista-mensagens article[data-message-id]{cursor:pointer}
body.privada-selecionando #privada-lista-mensagens article.is-selecionada{background:rgba(255,215,122,.12)}
body.privada-selecionando #privada-lista-mensagens article.is-selecionada > div{outline:2px solid #ffd77a;outline-offset:2px}
body.privada-selecionando.pagina-sala.sala-privada #privada-lista-mensagens article .privada-msg-mais{display:none}

/* ───── 9. Bloco 4: campo de várias linhas, contador e prévia antes de enviar ───── */
/* O campo é um textarea: no computador fica do mesmo tamanho do campo de antes (42 px) e cresce
   até 6 linhas; no celular as medidas vêm de privada-mobile-final.css (mesma variável). */
html body.pagina-sala.sala-privada #privada-mensaje-chat{
    box-sizing:border-box;
    display:block;
    width:100%;
    min-width:0;
    height:var(--altura-campo,42px);
    margin:0;
    padding:10px 12px;
    font:inherit;
    font-size:15px;
    line-height:22px;
    color:#fff;
    resize:none;
    overflow-y:auto;
    overscroll-behavior:contain;
    scrollbar-width:none;
    white-space:pre-wrap;
    overflow-wrap:anywhere;
}
html body.pagina-sala.sala-privada #privada-mensaje-chat::-webkit-scrollbar{display:none}
html body.pagina-sala.sala-privada #privada-form-chat{position:relative}
.privada-contador-letras{
    position:absolute;
    right:12px;
    bottom:calc(100% + 4px);
    z-index:2;
    padding:2px 8px;
    border-radius:8px;
    background:rgba(6,12,6,.92);
    color:#e9cf8c;
    font:700 12px/1.3 Inter,system-ui,sans-serif;
    pointer-events:none;
}
.privada-contador-letras.is-cheio{color:#ffb4a0}
.privada-contador-letras[hidden]{display:none}

/* Prévia: fotos, vídeos e documentos escolhidos, antes de enviar (como no WhatsApp). */
.privada-previa{
    position:fixed;
    inset:0;
    z-index:2147482900;
    display:flex;
    flex-direction:column;
    background:#050805;
    color:#f4ead8;
    overscroll-behavior:contain;
}
.privada-previa[hidden]{display:none}
.privada-previa-topo{
    display:flex;
    align-items:center;
    gap:6px;
    padding:calc(env(safe-area-inset-top,0px) + 6px) 8px 6px;
    background:linear-gradient(180deg,#2a170b,#1a0f07);
    border-bottom:1px solid rgba(199,165,90,.35);
}
.privada-previa-topo b{flex:1 1 auto;min-width:0;font:700 15px/1.3 Inter,system-ui,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.privada-previa button{cursor:pointer}
.privada-previa-icone{
    display:grid;
    place-items:center;
    width:44px;
    height:44px;
    flex:0 0 auto;
    padding:0;
    border:0;
    background:transparent;
    color:#f4ead8;
}
.privada-previa-icone svg,.privada-previa-enviar svg,.privada-previa-doc svg{
    width:24px;
    height:24px;
    fill:none;
    stroke:currentColor;
    stroke-width:2;
    stroke-linecap:round;
    stroke-linejoin:round;
}
.privada-previa-palco{
    position:relative;
    flex:1 1 auto;
    min-height:0;
    display:grid;
    place-items:center;
    padding:8px;
    overflow:hidden;
}
.privada-previa-palco > :is(img,video){max-width:100%;max-height:100%;object-fit:contain;display:block}
.privada-previa-doc{display:grid;justify-items:center;gap:10px;max-width:100%;padding:0 16px;text-align:center;font:600 15px/1.4 Inter,system-ui,sans-serif;overflow-wrap:anywhere}
.privada-previa-doc svg{width:56px;height:56px;stroke-width:1.5;color:#e9cf8c}
.privada-previa-doc small{color:#cdbb98;font-weight:500}
.privada-previa-rodape{
    display:grid;
    gap:8px;
    padding:8px 10px calc(env(safe-area-inset-bottom,0px) + 8px);
    background:#0d0a06;
    border-top:1px solid rgba(199,165,90,.3);
}
.privada-previa-miniaturas{
    display:flex;
    gap:6px;
    overflow-x:auto;
    scrollbar-width:none;
    padding-bottom:2px;
}
.privada-previa-miniaturas::-webkit-scrollbar{display:none}
.privada-previa-mini{
    position:relative;
    flex:0 0 auto;
    width:52px;
    height:52px;
    padding:0;
    border:2px solid transparent;
    border-radius:8px;
    overflow:hidden;
    background:#1c140c;
    color:#e9cf8c;
}
.privada-previa-mini[aria-current="true"]{border-color:#8cff5a}
.privada-previa-mini :is(img,video){width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}
.privada-previa-mini svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.privada-previa-mini.is-adicionar{border:1px dashed rgba(199,165,90,.6);background:transparent;display:grid;place-items:center}
.privada-previa-linha{display:flex;align-items:flex-end;gap:8px}
.privada-previa-legenda{
    flex:1 1 auto;
    min-width:0;
    box-sizing:border-box;
    min-height:46px;
    max-height:120px;
    margin:0;
    padding:12px 16px;
    border:1px solid rgba(199,165,90,.6);
    border-radius:23px;
    background:rgba(3,12,7,.92);
    color:#f4fffc;
    font:inherit;
    font-size:16px;
    line-height:20px;
    resize:none;
    overflow-y:auto;
    scrollbar-width:none;
}
.privada-previa-legenda::placeholder{color:rgba(244,255,252,.6)}
.privada-previa-legenda:disabled{opacity:.45}
.privada-previa-enviar{
    position:relative;
    display:grid;
    place-items:center;
    flex:0 0 auto;
    width:48px;
    height:48px;
    padding:0;
    border:0;
    border-radius:50%;
    background:linear-gradient(145deg,#79dc45,#3f9e22);
    color:#081208;
}
.privada-previa-enviar small{position:absolute;top:-4px;right:-4px;min-width:18px;padding:1px 4px;border-radius:9px;background:#f4ead8;color:#1a0f07;font:800 11px/16px Inter,system-ui,sans-serif}
.privada-previa-aviso{margin:0;color:#ffcf9a;font:600 13px/1.35 Inter,system-ui,sans-serif}
.privada-previa-aviso[hidden]{display:none}

/* Visor: enquanto o arquivo decifra, a miniatura borrada fica com "Abrindo…" em cima. */
.gaba3-visor-slide > .gaba3-visor-espera.is-sobre-previa{align-self:end;margin-bottom:96px}
/* Mensagem com várias linhas: as quebras de linha aparecem na bolha como foram escritas. */
.pagina-sala.sala-privada .semi-lista-mensagens article > div > p{white-space:pre-wrap;overflow-wrap:anywhere}

/* Fila do clipe (apresentação, câmera ao vivo, foto/vídeo/documento, chamada, localização,
   contato): ícones de 32 px com área de toque de 44 px, sem mudar o desenho (2026-10-11). */
#privada-composer-tools > .privada-icon-btn,
#privada-composer-tools > label{position:relative}
#privada-composer-tools > .privada-icon-btn::before,
#privada-composer-tools > label::before{content:"";position:absolute;inset:-6px}

/* Painel de apresentações: fechar (30 px), "Voltar à lista" e "Outras frases" (32 px) com área
   de toque de 44 px, sem mudar o desenho (2026-10-11). */
#invd-fechar, #invd-voltar-lista, #invd-sugerir{position:relative}
#invd-fechar::before{content:"";position:absolute;inset:-7px}
#invd-voltar-lista::before, #invd-sugerir::before{content:"";position:absolute;inset:-6px 0}