---
fonte: 01-canonicos/seed-componentes.md
versao_da_fonte: v2.00
secao: 94
titulo: "Mensageria de atendimento — **`estável`** (decidida em 9 de 10 perguntas em 2026-10-10; a Q10, veto geral, ficou sem observação de veto na folha de 2026-10-10 gravada às 11:22Z; marcador da sessão, exposto a veto, MANIFESTO §302) · MS1–MS40 · irmã do §55 (chat com assistente) · pedidos `PC-2026-0007` (LC-15, LC-16), `PC-2026-0010` (LC-19) e `PC-2026-0017` · tela de referência `tela-mensageria.html` e instrumento `suite-mensageria.mjs` (ver 94.12)"
status: vigente
vigente_desde: 2026-10-10
superseded_by: null
tipo_de_fatia: secao
historico: 94-historico.md
quando_consultar: "Mensageria de atendimento (MS1–MS40): lista de conversas, balão, estados de envio, painel do contato."
em_uma_frase: null
nao_cobre: null
conceitos: null
vocabulario: null
sequencia: 179 de 184
bytes_do_corpo: 27773
md5_do_corpo: 1486610ac54d0609ac13ad11c64a630b
gerado_por: 06-validacao/geradores/gen-camada-ia.py
nota: fatia GERADA — o corpo abaixo é byte a byte o trecho do canônico; edite o canônico, nunca esta fatia. Canônico inteiro em https://ds.seed.eng.br/01-canonicos/seed-componentes.md
---
## 94. Mensageria de atendimento — **`estável`** (decidida em 9 de 10 perguntas em 2026-10-10; a Q10, veto geral, ficou sem observação de veto na folha de 2026-10-10 gravada às 11:22Z; marcador da sessão, exposto a veto, MANIFESTO §302) · MS1–MS40 · irmã do §55 (chat com assistente) · pedidos `PC-2026-0007` (LC-15, LC-16), `PC-2026-0010` (LC-19) e `PC-2026-0017` · tela de referência `tela-mensageria.html` e instrumento `suite-mensageria.mjs` (ver 94.12)

> **Contexto para leitor novo.** O DS tem um chat com assistente (§55, CH1–CH14). O SEED Chat é outra coisa: uma conversa entre
> pessoas, com lista de conversas e atendente. O decisor mandou o DS seguir o produto, e não o contrário (MANIFESTO §241,
> verbatim: *"quando formos construir algum chat para o ERP, vamos usar o SEED Chat como modelo, não o contrario."*). Esta seção
> nasceu do estudo G9-11 (2026-09-24, base `767babd`), arquivado em `09-pesquisa/2026-09-24-grupo-9/lc-chat/` (proposta
> `PROPOSTA-CANON.md`, prancha `prancha.html`, fontes datadas em `PESQUISA.md`, pares de contraste em `pares-medidos.md`,
> relatório `relatorios/G9-11-RELATORIO.md`). Prefixo **MS** (medido em 2026-10-10: 0 ocorrências de `**MS<n>**` no
> `seed-componentes.md` antes desta seção). Siglas: **LC** linha de lacuna de cobertura do roadmap · **PC** pedido de cobertura ·
> **CH** decisões do §55 · **MA** do §93 (material) · **SH** do §46 (shell) · **CP** do `seed-composicao.md` · **SC** critério de
> sucesso do WCAG · **AX** árvore de acessibilidade · **RC** régua de contraste por pixel (§93).
>
> **Veredito dele, verbatim** (colado no chat em 2026-10-10 ~01:47Z, sobre a prancha de 2026-09-24): *"Q1 a, Q2 c, Q3 b, Q4 a, Q5 a, Q6 a, Q7 a, Q8 a, Q9 a, Q10 sem resposta"*.
> O que cada letra significa está na `prancha-fonte.html` da pasta do estudo (linhas 233–355); a tabela abaixo as traduz.
>
> | Q | pergunta | opção dele | o que ela diz |
> |---|---|---|---|
> | Q1 | o princípio entra como primeira regra | **a** | sim, com o limite: anatomia do WhatsApp, aparência do DS, acessibilidade vence |
> | Q2 | painel lateral direito | **c** | fixo em janela larga (≥ 1560 px), sobrepõe abaixo disso |
> | Q3 | lista de conversas | **b** | opaca, pelo MA3 |
> | Q4 | cabeçalho da conversa | **a** | vidro (barra superior do MA1) |
> | Q5 | tique de "lida" | **a** | só muda a cor (como o WhatsApp e o SEED Chat) |
> | Q6 | o que separa o balão do papel | **a** | sombra |
> | Q7 | divisor de data | **a** | pílula |
> | Q8 | transcrição do áudio | **a** | sempre visível sob o áudio |
> | Q9 | marca de posição do áudio | **a** | pino redondo na posição |
> | Q10 | veto geral | — | **sem resposta** |
>
> **Q10: sem veto (folha de 2026-10-10, gravada às 11:22Z, MANIFESTO §302).** Tudo o que a prancha mostrou sem pergunta própria (item da lista, cabeçalho, mídia, composer com
> sugestão da IA, celular) entrou aqui como **proposta exposta ao veto geral**; cada regra nessa situação leva a marca
> *(veto geral · Q10 sem veto)*. A folha dele não trouxe observação de veto sobre a Q10: as regras marcadas ficam como decisão da sessão, expostas a veto, e o título da seção passou a `estável` (o mesmo marcador do §95).

### 94.1 Princípio e fronteira

| # | Decisão | Porquê | Descartado |
|---|---|---|---|
| **MS1** *(Q1 a)* | **Anatomia e interação seguem o WhatsApp; a aparência é do DS; a acessibilidade vence onde os dois divergem.** Onde fica cada coisa, o que cada gesto faz e a ordem das informações vêm do WhatsApp; cor, fonte, raio, sombra, material e ícone vêm dos tokens. Nunca o logotipo, o verde de identidade nem o papel de parede do WhatsApp | Regra do decisor para o chat (PC-2026-0017, verbatim: *"a regra principal do chat é que seu layout deve parecer o maximo com o whatsapp, pois o proposito é evitar atrito com o usuário"*); a página de marca da Meta regula nome e logotipo, não a anatomia | copiar a aparência (fere a marca SEED e a da Meta) · ignorar o WhatsApp (custo de aprender para quem já opera o WhatsApp todo dia) |
| **MS2** *(veto geral · Q10 sem veto)* | **O DS dá a FORMA; o produto dá o conteúdo.** Abas do painel, ações do ERP, regras de fila e atribuição e o que a IA diz são do produto. O §55 continua valendo aqui no que cobre: CH4 (histórico `role="log"`), CH5, CH6, CH7 (estendido pela MS14), CH8, CH9, CH11 (com a exceção do celular, MS34) e CH13 | Mesma divisão da triagem (MANIFESTO §235.1: *"o conteúdo das abas Cliente/Ações/Íris fica fora do DS como decisão de produto"*) | seção nova que repete o §55 (duas verdades) |

### 94.2 A forma TELA

| # | Decisão | Porquê | Descartado |
|---|---|---|---|
| **MS3** *(veto geral · Q10 sem veto)* | **Três lugares, sempre nos mesmos lugares:** rail (§46) · lista de conversas (padrão 30 % da largura útil, redimensionável entre 22 % e 45 %, recolhível) · conversa com o resto. A conversa é a protagonista | WhatsApp Web e SEED Chat (`Conversas.tsx:175-199`) | três colunas sempre abertas (a conversa caía a 44 % da tela) |
| **MS4** *(veto geral · Q10 sem veto)* | **Uma casca, uma peça:** o rail flutua sobre o canvas; lista e conversa vivem na MESMA peça de conteúdo (CP1/CP17), separadas por borda | SEED Chat (CHAT-054) e o gate de 2026-08-15 do DS | lista e conversa como peças soltas sem motivo de material |
| **MS5** *(Q2 c)* | **Painel lateral direito do contato:** fechado por padrão; abre pelo ⓘ do cabeçalho (`aria-pressed`); 420 px; abas (§34) com a aba sem conteúdo desabilitada e o motivo no título; recolhe por `»` (CH2), nunca `×`; fechado = `inert`. ~~**Comportamento: FIXO quando a janela tem ≥ 1560 px** (a conversa mantém ≈ 640 px) **e SOBREPOSTO abaixo disso**; o limiar é por largura do contêiner (CP27), não por media query de janela.~~ **Supersede de 2026-10-18 (folha 11, `SH62b` = a; aplicado na leva 45):** o comportamento é a regra do **§31.4** — empurra a conversa enquanto ela fica ≥ 640 px e sobrepõe abaixo disso (medido em 2026-10-24: a 1700 px empurra; a 1440 e a 1100 px a conversa de 927 e 689 px não encolhe e o painel sobrepõe); e, quando cobre, **nasce abaixo do cabeçalho da conversa** (64 px), com o ⓘ ligado visível e clicável (`SH60` = a, PL9; antes o ⓘ ficava sob o painel nas 3 larguras medidas). **Fronteira com o §55:** ~~o CH3 ("o painel sobrepõe, não empurra") vale para a forma PAINEL do chat com assistente (peça lateral sobre a tela viva); o painel de contato desta regra é parte da forma TELA e, em janela larga, encolhe a conversa de propósito~~ *(histórico)* — desde a folha 11 (`SH62b` = a, `SH62d` = b) não há mais fronteira de comportamento: o painel do assistente (CH3) e o painel do contato seguem a MESMA regra do §31.4; a diferença entre as duas formas fica na peça (PAINEL sobre a tela viva × TELA de atendimento) | Pedido do decisor (*"uma tela sobreposta ou fixa abra na lateral direita"*, §235.1); Zendesk; WhatsApp Web encolhe a conversa; a conta da largura está na prancha | sempre sobreposto (Q2 a — esconde a conversa em tela larga sem necessidade) · sempre fixo (Q2 b — a conversa fica com ≈ 500 px numa tela de 1440) |

### 94.3 O item da lista de conversas

| # | Decisão | Porquê | Descartado |
|---|---|---|---|
| **MS6** *(veto geral · Q10 sem veto)* | **Anatomia:** 76 px; avatar 40 px neutro (§32 AV2/AV3); linha 1 = nome (`titulo-secao` 16 px, peso 500) + hora (12 px mono: `HH:mm` hoje, "ontem", dia da semana na semana, `dd/MM` antes); linha 2 = prévia (14 px, 400) com o tique quando a última mensagem é nossa e ícone + rótulo quando é mídia ("Áudio · 0:13") + estado à direita (fila · encerrada · atendente) + contagem de não lidas | WhatsApp Web 76 px (avatar 48); SEED Chat `ItemDaLista.tsx:74-158` | avatar 48 (não é degrau do §32) · item de 96 px (2,5 conversas numa tela de 674 px) |
| **MS7** *(veto geral · Q10 sem veto)* | **Não lida por PESO + contagem + cor da hora, nunca só cor** (nome 600, prévia 500, hora `text-brand-strong` 700, contagem em pílula `action-primary` de 20 px, "99+" acima de 99) | §28 LS5 | só cor da hora (reprova a SC 1.4.1) |
| **MS8** *(veto geral · Q10 sem veto)* | **Selecionado:** `surface-subtle` + barra de 3 px em `text-brand` + `aria-current` | `surface-subtle` mede 1,11 contra o branco e some no cinza (medição do produto, 2026-09-24); a barra é a do SH5, por analogia | só o fundo |
| **MS9** *(veto geral · Q10 sem veto)* | O item é alvo acessível (Enter e Espaço abrem) e tem menu de contexto (§35) | SEED Chat `ItemDaLista.tsx:67-72` | `div` clicável sem teclado |

### 94.4 O cabeçalho da conversa

| # | Decisão | Porquê | Descartado |
|---|---|---|---|
| **MS10** *(veto geral · Q10 sem veto)* | **64 px:** [← no celular] · avatar 40 · nome (16 px, 500) · subtítulo de 12 px (código humano · telefone · número · "atendida por …") · ações como ícones de 40 px com `aria-label` (assumir ou atribuir, analisar, ⓘ, ⋮, fechar a conversa). **No celular só ⓘ e ⋮**; o resto vai para o menu | WhatsApp 64 px; SEED Chat `CabecalhoDaConversa.tsx:81-157`; a 390 px cinco botões espremem o contexto | 125 px com ações em botões de texto |

### 94.5 O fio

| # | Decisão | Porquê | Descartado |
|---|---|---|---|
| **MS11** *(veto geral · Q10 sem veto)* | **Papel de parede = `surface-subtle` liso** — sem rabiscos de terceiro | Canvas do CP1; o papel do WhatsApp não se copia (MS1) | rabiscos do WhatsApp · grafismo da marca (não pedido; exigiria o gerador `gen-detalhe.py`) |
| **MS12** *(Q6 a)* | **Balão:** enviado `surface-brand-subtle`, recebido `surface-raised`, os dois com `text-primary` 14 px / 1,5 / 400; raio `radius-4` com o canto do autor em `radius-1` no primeiro do grupo; largura máxima 60 % (janela larga) · 70 % (média) · 85 % (estreita). **O que separa o balão do papel é a SOMBRA** (`--seed-shadow-raised`), como o WhatsApp e o SEED Chat (`BalaoDeMensagem.tsx:347-357`) | §55.5; medido: balão × papel = 1,01 (enviado) e 1,09 (recebido) no claro — a cor não separa, e o anel (alternativa) mede 1,21 no recebido (`pares-medidos.md`) | anel, nunca sombra (Q6 b — o texto do `seed-composicao.md` até aqui) · balão turquesa cheio com texto branco (vira o elemento mais saturado da tela) |
| **MS13** *(veto geral · Q10 sem veto)* | **Agrupamento:** mensagens seguidas do mesmo autor a 2 px; troca de autor a `sp-2`; o nome de quem enviou (11 px, 600) só no primeiro balão do grupo — e o autor e a hora no texto acessível de TODOS (CH6). **Nota:** 2 px não tem token de espaço (`--seed-sp-*` começa em 4 px, com `sp-1-5` = 6 px) — ver 94.13 | SEED Chat; CH6 | `sp-2`/`sp-4` do `seed-composicao` (espaça o dobro do WhatsApp) |
| **MS14** *(Q5 a, cor trocada para azul em 2026-10-10; o azul `feedback-info-text` CONFIRMADO por ele na folha 3, G5 = ok, gravada 2026-10-10 14:45:59Z)* | **Meta no balão, canto inferior direito:** [Editada] · hora (11 px mono, `text-muted`) · estado. **Estado = CH7 estendido:** enviando (relógio) · enviada (um tique) · entregue (dois tiques) · **lida (dois tiques em AZUL: `feedback-info-text`; a forma é a mesma do entregue)** · falhou (alerta + "Tentar de novo", exceto quando o motivo é permanente: sem a ação e com o texto do que fazer, CH7); **dois rótulos de falha (folha de 2026-10-10, PC-2026-0044-ROTULOS = b):** "Não enviada" (não saiu do nosso lado) e "Não entregue" (saiu, mas não chegou ao cliente), cada um com a microcópia por código de erro (MC3, MC9, MC10, MC12); "Não entregue" só existe quando o retorno de entrega da Meta chega ao produto [não conferido]; rótulo em `title` e em texto só para leitor de tela. **Observação dele sobre a Q5, verbatim (folha de 2026-10-10, gravada às 11:22Z):** *"as mensagens lidas devem ser representadas igual o whatsapp, mude os 2 traços para a cor azul (escolha o tom de azul melhor na nossa DS)"*. **Escolha da sessão, confirmada por ele (folha 3, G5 = ok): o azul é `feedback-info-text`** (azul-700 `#006783` no claro, azul-200 `#96E0FD` no escuro) — a família de INFO é o único papel de azul na interface (`seed-tokens.json`, azul-300 "familia de INFO"). **A conta (razão de contraste WCAG, medida em 2026-10-10 por script sobre os valores do `seed-tokens.css` v1.35):** contra o balão enviado (`surface-brand-subtle` `#E8FBF7` / `#1A3833`) e o recebido (`surface-raised` `#FFFFFF` / `#1D272D`): claro **5,99** e **6,43**; escuro **8,67** e **10,42** — os quatro passam o 3,0 do SC 1.4.11 (ícone) e até o 4,5 de texto. O "entregue" (`text-muted`) mede 5,23 e 5,61 no claro, 5,66 e 6,80 no escuro. Candidatos medidos e descartados: `feedback-info-solid` (azul-500 `#0099C1` / azul-300 `#53C2E9`) mede 3,09 e 3,32 no claro (passa o 3,0 por 0,09, margem fina); azul-400 `#01B3E0` mede 2,30 e 2,46 no claro (reprova); `text-brand` (o verde do tique anterior) 4,28 e 4,60. **Exceção "só cor" — estreitou, NÃO sumiu:** a luminância relativa do tique lida × entregue é 0,113 × 0,137 no claro (razão 1,15:1) e 0,669 × 0,419 no escuro (1,50:1) — em escala de cinza o par continua quase igual no claro. O que mudou é que a diferença deixou de ser só de luminosidade e passou a ser de MATIZ (cinza-turquesa × azul, a distância de matiz que o DS tem), como no WhatsApp. Por isso a SC 1.4.1 segue atendida por outro meio para esse par: nome acessível distinto ("Lida" × "Entregue") e `title`; a distinção visual em escala de cinza [não conferido] em tela real (a conta é de luminância, não de captura). Nenhum azul do DS separa os dois em cinza e passa o 3,0 nos quatro fundos com folga; a opção que separaria mais no claro é `feedback-info-solid` (razão 1,69:1, margem fina) e exigiria um token semântico novo por tema (claro azul-500, escuro azul-200), que não existe e NÃO foi criado. Medido (antes, `text-brand`): 5,23 (entregue) × 4,28 (lida) no claro, 5,66 × 6,92 no escuro | WhatsApp; SC 1.4.1; `pares-medidos.md` | tique lida em `text-brand` (verde, a escolha Q5 a, trocada por pedido dele em 2026-10-10) · cor + forma, os dois tiques com pastilha cheia (Q5 b — custo: uma classe no SEED Chat; guardado como caminho de volta se a exceção incomodar) |
| **MS15** *(Q7 a)* | **Divisor de data = PÍLULA** de 24 px (`radius-3`, `surface-raised`, 12 px `text-muted`), como o produto e o WhatsApp. Rótulos "hoje", "ontem", dia da semana, data. **Divisor de não lidas** ("N mensagens não lidas") em faixa de largura inteira | `PainelDeMensagens.tsx:251-252`; contraste do rótulo 5,16 claro · 7,63 escuro | trilha horizontal com rótulo centrado (Q7 b — o texto do `seed-composicao.md` até aqui) |
| **MS16** *(veto geral · Q10 sem veto)* | **Ações por mensagem** no sobrevoo e no foco: reagir · editar (só texto nosso, até 15 min) · responder — botões redondos de 32 px (≥ 24 px, SC 2.5.8) do lado de fora do balão | SEED Chat `BalaoDeMensagem.tsx:316-345` | ações só no clique direito (invisíveis para teclado) |
| **MS17** *(veto geral · Q10 sem veto)* | **Reação:** pílula abaixo do balão, emoji + contagem quando > 1 | WhatsApp; SEED Chat `:114-133` | — |
| **MS18** *(veto geral · Q10 sem veto)* | **Resposta citada:** dentro do balão, faixa de 3 px em `text-brand` + autor + até 2 linhas do trecho | WhatsApp; `MensagemCitada.tsx` | — |
| **MS19** *(veto geral · Q10 sem veto)* | **Apagada:** texto em itálico `text-muted` com ícone do DS (não emoji); **editada:** "Editada" na meta abre o histórico | WhatsApp; SEED Chat mostra 🚫 (ajuste: ícone do set, §45) | esconder o balão apagado (perde o rastro) |
| **MS20** *(veto geral · Q10 sem veto)* | **Voltar ao fim:** botão flutuante de 40 px no canto inferior direito do fio, com a contagem de novas | SEED Chat `PainelDeMensagens.tsx:287-291` | — |

### 94.6 Mídia na conversa (LC-16 — revisão do CH14)

| # | Decisão | Porquê | Descartado |
|---|---|---|---|
| **MS21** *(veto geral · Q10 sem veto)* | **Imagem:** miniatura até `min(20rem, 100%)`, `radius-3`, carga preguiçosa; abre no visualizador ÚNICO do fio; texto alternativo "Imagem enviada/recebida"; legenda abaixo | SEED Chat (B4, B17, CHAT-051) | um visualizador por balão · largura fixa em px (vazava em tela estreita, CHAT-051) |
| **MS22** *(veto geral · Q10 sem veto)* | **Álbum:** grade 2 × 2, "+N" na quarta, rótulo "Álbum com N fotos" | PC-2026-0017 (sem canon no produto) — **proposta** | uma imagem por balão |
| **MS23** *(veto geral · Q10 sem veto)* | **Vídeo:** player nativo com controles, `preload="metadata"`, até `min(20rem, 100%)`; duração em etiqueta sobre a miniatura | SEED Chat | autoplay |
| **MS24** *(veto geral · Q10 sem veto)* | **Documento:** cartão de 256 px (ícone em círculo `surface-brand-subtle`, nome truncado, extensão); PDF abre a pré-visualização no visualizador único do fio; os demais em nova guia; **nunca visualizador de terceiro** | CHAT-052 (dado do cliente não sai sem autorização) | Google Docs Viewer e afins |
| **MS25** *(veto geral · Q10 sem veto)* | **Localização e contato:** o mesmo cartão; localização abre o mapa em nova guia | SEED Chat `:239-282` | mapa embutido (custo e rastreio de terceiro) |
| **MS26** *(veto geral · Q10 sem veto)* | **Figurinha:** imagem de até 150 px **sem balão**, meta fora | WhatsApp; SEED Chat `:162-167` | figurinha dentro de balão |
| **MS27** *(veto geral · Q10 sem veto)* | **Prévia de link:** cartão acima do texto (ordem do WhatsApp) | CHAT-053 | — |
| **MS28** *(veto geral · Q10 sem veto)* | **Menu de opções de fornecedor** (lista e botões do WhatsApp Business) mostrado como lista numerada de verdade (`<ol>`) | PC-2026-0017 | texto corrido com números digitados |
| **MS29** *(veto geral · Q10 sem veto)* | **Grupo:** autor acima de cada balão recebido (11 px, 600, `text-secondary`) — **proposta para o piloto de grupos do produto** | PC-2026-0017 | cor por autor (exige paleta categórica sem canon aqui) |
| **MS30** *(veto geral · Q10 sem veto)* | **Mídia que ainda não chegou é estado declarado** ("carregando…" ou "indisponível"), nunca balão vazio | Achado da rodada: o SEED Chat devolve `null` para documento sem URL (`BalaoDeMensagem.tsx:203`) | balão vazio silencioso |

### 94.7 Áudio

| # | Decisão | Porquê | Descartado |
|---|---|---|---|
| **MS31** *(veto geral · Q10 sem veto)* | **Player próprio:** play/pausa de 36 px (`action-primary`, rótulo "Ouvir áudio"/"Pausar áudio"); forma de onda **medida do arquivo** — se não der para medir, barra lisa com o motivo no título, nunca onda inventada; posição como `role="slider"` com setas de 5 %; tempo em 11 px mono; velocidade 1x → 1,5x → 2x num botão de 28 px com rótulo; avatar de quem enviou com microfone; o arquivo só baixa quando o balão entra na tela | SEED Chat `PlayerDeAudio.tsx` (V-CHAT-23, pedido de velocidade de 2026-09-15) | player nativo do navegador (muda por navegador, sem velocidade) |
| **MS32** *(Q9 a)* | **Marca de posição = PINO redondo de 12 px** em `action-primary` na posição, com anel da cor do balão. O estado (tocado × não tocado) deixa de depender do par de cores das barras | SC 1.4.11; medido: tocada × não tocada 3,09 claro · 3,58 escuro (passa por 0,09 no claro); não tocada × balão recebido 1,49; pino × balão 4,60 claro · 8,31 escuro | só a cor das barras (Q9 b — produto até aqui) |
| **MS33** *(Q8 a)* | **Transcrição SEMPRE VISÍVEL sob o áudio:** texto gravado, rotulado "Transcrição automática", em `text-secondary` (7,75 claro · 8,11 escuro); falhou → "Transcrição indisponível"; vazia = áudio sem fala. O atendente lê sem clicar | SC 1.2.1 aceita as duas formas; o produto mostra sempre | recolhida atrás de "Ver transcrição" (Q8 b — como o WhatsApp; custo: um botão e um estado) · nenhuma alternativa em texto (reprova a SC 1.2.1) |

### 94.8 A caixa de escrever na mensageria

| # | Decisão | Porquê | Descartado |
|---|---|---|---|
| **MS34** *(veto geral · Q10 sem veto)* | **Composer = CH8** (contêiner `radius-6`, foco no contêiner) na ordem do WhatsApp: emoji · anexo · [IA] · campo · microfone que vira enviar quando há texto (redondo, 40 px, em metal — MA2). Desktop: Enter envia, Shift+Enter quebra (CH11); **celular: Enter quebra e só o botão envia** — exceção ao CH11, porque o teclado virtual não tem Shift+Enter | veredito do SEED Chat (Q6a, 2026-09-14); `CampoDeMensagem.tsx:58-225` | Enter enviando no celular |
| **MS35** *(veto geral · Q10 sem veto)* | **Sugestão da IA inline:** linha DENTRO do contêiner, acima do campo (CH13, forma linha), rótulo "Sugestões da IA" e chips; o que a IA sugere só o atendente vê | modo "sussurro" do estudo E1; `SugestoesDaIA.tsx` | bloco de três cartões acima do composer |
| **MS36** *(veto geral · Q10 sem veto)* | **Respostas rápidas por "/":** a lista é sugestão; Enter continua enviando o que foi digitado | `CampoDeMensagem.tsx:104` | "/" que bloqueia o envio |

### 94.9 No celular

| # | Decisão | Porquê | Descartado |
|---|---|---|---|
| **MS37** *(veto geral · Q10 sem veto)* | **Pilha:** lista → conversa (← volta) → painel em folha de tela inteira (← volta, porque é voltar e não descartar). A barra de abas do aplicativo é a do §95 | SEED Chat `Conversas.tsx:127-148`, `PainelDaConversa.tsx:47-58` | painel sobreposto parcial a 390 px |

### 94.10 Material da forma TELA (LC-19)

| # | Decisão | Porquê | Descartado |
|---|---|---|---|
| **MS38** *(veto geral · Q10 sem veto)* | Rail em metal, botão de enviar em metal, casca com luz (uma por tela), fio, diálogos e menus opacos — como o §93 já manda e o SEED Chat aplicou | CHAT-074 (itens expostos a veto, sem veto); MA2, MA3, MA4 | — |
| **MS39** *(Q3 b)* | **A lista de conversas é OPACA**, pelo MA3 (lista densa fica opaca) | Medido: sem vão, o vidro da lista muda de forma visível só 0,29 % dos pixels no claro e 1,45 % no escuro — é marcação de papel, não efeito | vidro sem vão, como o SEED Chat hoje (Q3 a) · vidro como peça própria, com vão sobre o canvas com luz (Q3 c — custo: mudança de layout no SEED Chat) |
| **MS40** *(Q4 a)* | **O cabeçalho da conversa é de VIDRO** (barra superior do MA1), como o SEED Chat. O vidro só se vê quando o fio rola por baixo dele (medido: 6,79 % dos pixels no claro e 8,40 % no escuro mudam de forma visível nessa condição); sem o fio por baixo ele é marcação de papel, como a lista da MS39 era | MA1 | opaco (Q4 b) |

### 94.11 Números medidos (com a origem)

| o quê | número | origem |
|---|---:|---|
| item da lista | 76 px | SEED Chat · WhatsApp Web |
| avatar do item e do cabeçalho | 40 px | §32 AV3 |
| cabeçalho da conversa · da lista · do painel | 64 px | SEED Chat · WhatsApp Web |
| painel lateral | 420 px | §55.5 · SEED Chat |
| limiar fixo × sobreposto do painel | ~~1560 px~~ *(histórico)* — desde a leva 45 não há limiar fixo: piso da conversa 640 px (`--seed-side-panel-content-min`) pela regra do §31.4 | Q2 c (prancha); supersede `SH62b` = a (folha 11) |
| busca | 40 px, pílula | SEED Chat · WhatsApp Web |
| divisor de data | 24 px | SEED Chat · WhatsApp Web |
| largura máxima do balão | 60 / 70 / 85 % | SEED Chat (WhatsApp Web: 56 %) |
| play do áudio · velocidade · ação por mensagem | 36 · 28 · 32 px | SEED Chat |
| pior pixel de texto na prancha | 4,60 claro · 5,33 escuro | régua RC, 2026-09-24 12:59 UTC |
| pares normativos de contraste que passam | 14 de 18 | `pares-medidos.md` — os 4 que reprovam são as barras do áudio SEM o pino (onda não tocada em `border-default`/`border-strong` sobre o balão); o pino (MS32) é o mecanismo que resolve |

### 94.12 Testes (nascem com a seção)

1. **Estados de envio** — cinco estados, cada um com nome acessível distinto; "lida" difere de "entregue" por MATIZ (azul × cinza-turquesa, MS14), com luminância quase igual no claro — o teste confere o nome acessível e o contraste do azul (≥ 3,0 nos quatro fundos), não a escala de cinza.
2. **Não lida** difere de lida em escala de cinza (peso + contagem).
3. **Histórico** é `role="log"`, `aria-atomic="false"`, sem `aria-live` explícito (CH4); campo com `aria-controls`.
4. **Cada balão** tem autor e hora no texto acessível, também os agrupados (CH6).
5. **Painel** fechado é `inert` e fora da ordem de Tab; recolher por `»` no desktop e ← no celular; ~~fixo a ≥ 1560 px e sobreposto abaixo~~ *(histórico)* — empurra a conversa enquanto ela fica ≥ 640 px e sobrepõe abaixo disso, nascendo abaixo do cabeçalho (MS5 e §31.4, leva 45).
6. **Áudio:** slider responde às setas; sem onda medida, barra lisa com motivo (nunca onda inventada); pino presente; transcrição presente no DOM e visível (MS33).
7. **Alvos** das ações por mensagem, velocidade e play ≥ 24 × 24 px (SC 2.5.8).
8. **Régua RC** nos dois temas na tela de referência da forma TELA, com o tema no `<html>`.
9. **Mídia sem URL** mostra estado declarado (MS30).

**Estes testes têm instrumento:** `06-validacao/suites/suite-mensageria.mjs` (T1–T9 e F1–F6, 29 de 29 na tela de referência; o teste 8 é a `guarda-material.py`). O que a prancha mediu segue em 94.11.

### 94.13 O que falta ao DS para esta seção ter instrumento (pendências a nascer, sem código)

- **Token de 2 px de espaço** (o ritmo do agrupamento, MS13): o SEED Chat usa `mt-0.5` do Tailwind, sem token; a prancha usou 2 px literal.
- **Derivados de material não refazem em tema por contêiner:** `--seed-mat-glass` é declarado só no `:root` (`10-publicacao/r/seed-tokens.css`, medido em 2026-09-24 na linha 914); num contêiner com `data-theme="dark"` o vidro continua claro. A tela de referência da forma TELA tem de pôr o tema no `<html>`.
- **Tela de referência da forma TELA** (`tela-mensageria.html` ou variante do `gen-tela-chat.py`) com gerador — é onde a régua RC e os testes 94.12 passam a morar. **Cumprido na leva 36:** nasceu `tela-mensageria.html` (gerador `gen-tela-mensageria.py`), variante própria; a `tela-chat` (forma PAINEL, §55) segue intocada.

### 94.14 O que a seção NÃO cobre, e o que ela muda em outros textos

**`nao_cobre`:** menção a pessoa (@), thread, **a gravação do áudio no composer** (o `GravadorDeAudio.tsx` do produto não foi lido no estudo — [não conferido]), chamada de voz e vídeo, enquete, pagamento, catálogo, status; o conteúdo das abas do painel.

**Supersede parcial do CH14 (§55.1).** O CH14 dizia: anexo, gravação de áudio, menção a pessoa, thread e reação "não entram nesta versão". **A partir desta seção:** anexo (mídia), áudio (player e transcrição) e reação passam à §94 (MS17, MS21–MS33); **menção, thread e gravação de áudio continuam fora.** Motivo: o "caso real" que o CH14 esperava existe — o SEED Chat em produção.

**Supersedes pedidos ao `seed-composicao.md`** (linha "Chat / mensageria"; **o texto daquele arquivo foi editado na leva 36 (LC-37) e já segue esta tabela**):

| ponto | hoje no `seed-composicao.md` | passa a |
|---|---|---|
| raio do balão | `radius-lg` na mensagem | `radius-4`, com o canto do autor em `radius-1` — contradição interna medida: o §55.5 mediu 8 px (`radius-4`); `radius-lg` = `radius-6` = 12 px |
| separação do balão (Q6 a) | "mensagem alheia: `surface-raised` com anel — nunca sombra" | sombra (`--seed-shadow-raised`), MS12 |
| agrupador por dia (Q7 a) | "TRILHA horizontal com rótulo centrado" | pílula, MS15 |
| ritmo | `sp-2` entre mensagens do mesmo autor · `sp-4` entre blocos | 2 px · `sp-2`, MS13 (falta o token de 2 px) |