# Segunda passada: clareza, acessibilidade e sistema

O crítico não usou os relatórios dos designers. Mediu de novo as oito telas, com o mesmo medidor e os mesmos cenários da primeira passada (Fer em 1440×900 e doutora em 390×844, no claro e no escuro forçado). Também testou 1366×768, 1280×800, 820, 390, 390×664 e 320, e o "depois": a tecla 1 na Fer e o toque em "Pode oferecer" na doutora.

**O que vale para as quatro:**
- nenhum estado guardado em `:has`, `:target`, `<details name>` ou no hash;
- nenhuma cor fora dos tokens, texto com 4,5:1 ou mais e contorno de controle com 3:1 ou mais;
- urgente com os botões à vista em 1366×768 e 1280×800, e a primeira decisão à vista em 390×664;
- nada rola na horizontal;
- depois de cada ação: aviso na região `aria-live`, foco na tarefa seguinte e "Desfazer" ainda presente aos 6 s.

| | Rodada 1 | Rodada 2 |
|---|---|---|
| Síntese | — | **8,5** |
| Calma | 7 | **8** |
| Uma coisa de cada vez | 6 | **7** |
| Linha do tempo | 4,5 | **6,5** |

## Síntese: 8,5
**O que melhorou:** é a única pronta para virar sistema. Tokens claros e escuros em par (conferidos), 5 tamanhos de fonte, estado em JavaScript com `render()`, ganchos `data-teste`, iPad em duas colunas e a doutora em 2,5 telas.

**Defeitos que sobraram**
1. **Vermelho demais na primeira tela da Fer:** 14 usos (a Calma tem 8) e 20 pontos de destaque (Calma 12, Linha 10). O vermelho perde a força de alarme.
   - Conserto: vermelho só no grupo "Urgente agora" e na etiqueta. "Venceu às 09:00" e a contagem da faixa ficam em marinho, com ícone de relógio.
2. **"Atenção" usa o mesmo dourado dos rótulos** ("Por que agora"), e estado se confunde com enfeite.
   - Conserto: rótulos em `--suave` e dourado só para atenção. Falta também pôr na tabela o token `--foco`, que o guia cita.
3. **São 22 Tabs até "Chegou"**, e o link "Ver" tem 22 px de largura.
   - Conserto: um link de pular que leve direto à tarefa aberta, e mais folga no "Ver".

**O guia diz e o print não confirma:** "44 px no iPad (`pointer: coarse`)". A emulação liga o `coarse` e `--h-controle` vira 44 px, mas `.filtro` tem `min-height: 40px` fixo. Conserto: incluir `.filtro` na regra de toque.

## Calma: 8
**O que melhorou:** escala de 6 tamanhos, estilos de texto de 26 para 13, contornos corrigidos, o defeito de 960 px corrigido e a doutora de 5.988 para 2.527 px.

**Defeitos que sobraram**
1. **Regressão nova:** em 960 px ou menos, `:root { --faixa: 0px }` zera a altura dos filtros, e ficam 9 alvos de 19 px no iPhone e no iPad.
   - Conserto: `.filtro { min-height: 44px }` dentro desse media query.
2. **Anel de foco invisível no botão cheio da barra de resposta da doutora:** `.respostas > :focus-visible` desenha o anel marinho para dentro, sobre o fundo marinho do `.cheio`.
   - Conserto: `outline-color: var(--sobre-tinta)` no `.cheio`.
3. **Texto de 12 px no iPhone** (15 casos, quando o piso pede 13), e em 320 px a página força 353 px de largura.
   - Conserto: o token de 12 px vira 13 abaixo de 640 px.

**O relatório diz e o print não confirma:** a meta de 2,5 telas no iPhone. São 3. A página de escolha também dizia que a Calma é "a única" com tema escuro, mas a Foco e a Síntese agora têm (corrigido na página).

## Uma coisa de cada vez: 7
**O que melhorou:** a lista fica sempre à vista, o DOM caiu de 2.453 para 616 elementos, as 237 regras de estado em CSS sumiram, entrou o tema escuro e os Tabs até a ação caíram de 24 para 14.

**Defeitos que sobraram**
1. **O estado ainda é o HTML pronto, escondido e trocado** (guarda o `innerHTML` de cada linha para desfazer), e não dados redesenhados por `render()`. Levar aos protótipos continua sendo reescrever.
2. **É a Fer mais carregada das quatro:** 467 palavras e 17 pontos de destaque na primeira tela, com linhas cortadas por reticências.
   - Conserto: o motivo aparece só na tarefa aberta, e a nota longa sai do cartão.
3. **A paleta não casa com as outras:** um segundo vermelho (`#A23B2A`) e o verde como "ok".
   - Conserto: usar `#B42318` e "ok" em marinho com check.

**O relatório diz e o print não confirma:** nada. A faixa de contexto abaixo de 1366 px e o foco no título seguinte estão lá.

## Linha do tempo: 6,5
**O que melhorou:** a maior queda de poluição. Os pontos de destaque caíram de 25 para 10 na Fer e de 13 para 3 na doutora; ficaram 4 tamanhos de fonte; o anel dourado e os contornos foram corrigidos; os títulos dos blocos agora são calculados.

**Defeitos que sobraram**
1. **É a única sem tema escuro.**
2. **Não tem `h1`:** a doutora tem só 2 títulos na página inteira, e a Fer não tem link de pular.
   - Conserto: "Bom dia" como `h1` e cada intervalo como `h2`.
3. **Ainda mistura blocos com sombra (12 na Fer) e linha fina; o "Chegou" tem 36 px no toque; e a região `aria-live` lê "...ao Diego.Desfazer", com o botão colado.**
   - Conserto: linha fina nos blocos laterais, 44 px no toque e o botão fora da região `aria-live`.

**O relatório diz e o print não confirma:** nada relevante.

## Ordem final
1. **Síntese:** a única que já é sistema e passa em quase tudo o que foi medido.
2. **Calma:** é a base visual da síntese, mas regrediu nos alvos de toque.
3. **Uma coisa de cada vez:** melhorou, mas ainda precisa ser reescrita para os protótipos.
4. **Linha do tempo:** ficou calma, mas está sem tema escuro e sem estrutura de títulos.

## Recomendação: levar a Síntese aos quatro copilotos
O guia `sintese-sistema.md` aguenta virar a base: tem tokens em par, escala de fontes, espaçamentos, 11 componentes, teclado, regras de construção e as telas sem hora.

**Antes de levar:**
- aplicar os ajustes acima (vermelho, atenção separada do rótulo, `--foco` na tabela, filtro com 44 px no toque);
- incluir no guia quatro componentes que os quatro copilotos usam e que ainda não existem:
  - a agenda da semana e dos três meses, por profissional, com os estados de cada horário;
  - a captura das 6 fotos, com a foto anterior sobreposta;
  - a folha do copiloto (pergunta, resposta e aprovação);
  - a prévia da peça, com o carrossel;
- definir os estados de vazio, carregando, erro e "tudo feito".

**Os 3 maiores riscos**
1. **Testes:** são 702 asserções presas ao HTML de hoje, e pelo menos 60 delas a classes. A troca para `data-teste` precisa ser feita tela por tela, no mesmo commit, para não abrir um buraco na cobertura.
2. **Desfazer entre copilotos:** uma ação da Fer muda a agenda da Ana Carolina e a fila da doutora. Se cada ação não guardar o próprio inverso num modelo comum, o desfazer fica inconsistente.
3. **Telas sem componente:** agenda, fotos, Gestão e Instagram, se improvisadas em cada copiloto, trazem a poluição de volta e quebram o tema escuro. Cada componente novo entra primeiro no guia, com prints em cinco larguras, no claro e no escuro.

Prints e cenários desta passada: `var/prints/layouts/critica/rodada2/clareza/`, uma pasta por direção; auxiliares `sonda.js` e os `*.json`.