86. TELA A18 — CONFIGURAÇÕES / PREFERÊNCIAS

Em uma frase: Configurações é ROTA própria dentro do shell, com a navegação de seções na sidebar e "Sair" isolado no rodapé.

Casca (SH17, §46.4, 2026-09-14): no produto esta tela vive DENTRO do shell §46 — configurações é rota do app (CF-01) e a navegação lateral das seções ocupa a região sidebar do shell (papel de contexto, SH14). A tela de referência tela-configuracoes.html é publicada SEM a casca (raiz tela, CP28) para medir o conteúdo isolado; foi lida como "sem shell" pela sessão do ERP em 2026-09-14, e esta nota existe por isso.

O que é: a quarta tela da F7.6 — era um dos DOIS arquétipos sem NENHUMA leitura de referência, fechada pela volta dirigida de 2026-08-22 (leitura-f76-bordas.md §3). Gabarito F7.1: navegação lateral de seções (peça) + cartão por grupo (peça); <600px a lateral vira ABAS — nunca some.

86.1 Contratos#

• CF-01/02 — settings é ROTA própria: nav lateral nomeada, grupos com micro-rótulo, item ativo em pastilha (aria-current=page), e "Sair" isolado no rodapé da navegação (destrutiva isolada — leitura CU + convergência com o popover de conta do VdIA §3.16).
• CF-03 — duas colunas por grupo (nome+descrição × campos); rótulo visível em todo campo (§2).
• CF-04 — DOIS REGIMES DE GRAVAÇÃO (a decisão que o consolidado deixou em aberto, tomada aqui): formulário = salvar EXPLÍCITO — editar cria a barra de dirty (Salvar · Descartar), salvar CONFIRMA no próprio lugar ("Salvo.", lido no CU) e a barra se recolhe; descartar REVERTE; o salvar NUNCA nasce desabilitado (§2.6). Switch de preferência = aplicação IMEDIATA + anúncio na live region ("Aplicado") — o §8 já dizia "configuração é Switch", e switch com botão de salvar cria o estado enganoso ligado-mas-não-salvo.
• CF-06 — grupo com CHIP DE ESTADO que ESPELHA os controles (2FA "Habilitada" ↔ "Desativada", medido pela suíte nos dois sentidos).
• CF-07 — preferência de detalhe grande por PRESET (select restrito Padrão/Personalizado); a engrenagem de detalhe só existe no Personalizado.
• CF-08 — recurso indisponível declara o estado + correção inline.
• CF-09 — <600px: a lateral vira ABAS com AS MESMAS seções (comparação 1:1 na suíte); provado em navegador real (lateral none, abas flex, grupo em 1 coluna, zero overflow a 390px).
• CF-10 — HV1 (§71) desde o nascimento — a primeira tela da F7.6 que já nasce conforme (hover degrau/véu 8% · pressionado véu 12%).
• CF-11 — check de LGPD NA SUÍTE: a persona da demo é fictícia e a régua reprova se dado real entrar.

86.2 Fronteiras (produto)#

Persistência (PC6: declarada POR GABARITO) · guard de rota ao sair com dirty · o conjunto real de seções · 2FA de verdade (Supabase).

86.3 Registro de instrumento#

A régua CF-09a saiu confusa na 1ª versão (a && b || c — precedência traiçoeira que passava pelo fallback) e foi REESCRITA como comparação 1:1 das seções antes da promoção. Régua que passa por acaso é régua que mente.

86.4 A vista Configurações → Status (H5 = b, folha 4, 2026-10-11 02:44:10Z · leva 33)#

Ele respondeu b ao "onde o produto edita a cor do status": o DS desenha a tela. Ela mora no gabarito tela-configuracoes (gerador gen-tela-configuracoes.py, v0.4) como um grupo novo, "Status", na navegação lateral (e nas abas do colapso <600 px — CF-09: as mesmas seções), com um item por TIPO de registro (W10): Obras e ordens de serviço · Notas fiscais · Propostas. Estado só de referência (sem back-end), como o resto do gabarito.

• SC-01 — a lista. Cada status do tipo é uma linha: o chip na cor escolhida (texto, §22), as etapas a que corresponde ("Etapas: Projeto, Execução, Comissionamento" ou "Nenhuma etapa ligada"; tipos sem etapas não mostram o campo) e as ações Editar e Apagar — o nome acessível leva o nome do status ("Editar o status Pendente"). Abaixo, "+ Novo status".
• SC-02 — o editor (inline, não modal): Nome do status (rótulo visível; recusa vazio e nome repetido no tipo, sem diferenciar caixa, com a mensagem ao lado do campo, role=alert e aria-invalid) · o controle de cor da QD-P18 / §22.4.4, o do módulo cor_status_bloco.py, sem copiar CSS (onze rádios nativos, o valor atual marcado — um status novo nasce em Cinza, a sugestão do Pendente) · as etapas: caixas de marcar, uma por etapa do tipo, cada uma dizendo a que status pertence hoje ("hoje: Pendente"). A relação é N etapas : 1 status (QD23): marcar uma etapa a tira do status que ela tinha; desmarcar uma que ficaria sem status é recusado com a explicação (para tirá-la daqui, marque-a no status que deve recebê-la). O botão Salvar status nunca nasce desabilitado (§2.6). Ao salvar, o foco vai para o Editar do status e o leitor de tela ouve "Status … criado/salvo, cor …".
• SC-03 — apagar. Apagar abre uma confirmação inline. Se o status tem etapas ligadas, ela pede o status de destino (a lista exclui o próprio) antes — confirmar sem escolher mostra o erro e não apaga; escolhido, as etapas passam ao destino e nenhuma se perde nem se duplica. Sem etapas, só a confirmação. O único status de um tipo não se apaga (a tela diz por quê e não oferece o botão).
• SC-04 — a permissão. A permissão é do produto; o DS dá a forma. O gabarito a sinaliza com data-perm="edita"|"leitura" na seção (o botão Permissão da barra de provas, ou #perm=leitura, simula). Sem "edita" as ações não existem no DOM (não ficam desabilitadas): somem Editar, Apagar e "+ Novo status", a lista continua visível e uma nota diz que criar ou editar pede quem administra o espaço de trabalho.
• SC-05 — teclado, foco e largura. Enter no Editar/Apagar abre; o foco vai ao nome (ou ao destino); Esc cancela e devolve o foco ao botão que abriu; o grupo de cores é um tab stop (as setas movem a escolha, a pré-visualização acompanha e a mudança é anunciada); foco visível de 2 px. A 390 px não há rolagem lateral e todo alvo tem ≥ 44 px.

Provas (suite-config-status.mjs, navegador real, CS-01 a CS-43): navegação e abas · lista e mapa das etapas · criar, nome vazio e repetido · renomear · trocar cor · controle sem hex · N:1 · apagar com e sem etapas e o único · teclado e foco · tipos independentes · permissão · 390 px · contraste de todos os chips nos dois temas. Fronteiras (produto): quem tem a permissão, a persistência, o guard de rota ao sair com edição aberta, e as demais seções do grupo (hoje só os três tipos do gabarito).

---