EDUZZ-HS-TI-004 - Central de Ajuda 2026 Arquitetura

01 — Contexto

O que e a Central de Ajuda

A Central de Ajuda e o ponto de entrada principal para tickets de suporte da Eduzz. Usuarios (produtores, afiliados e compradores) acessam o formulario para reportar problemas, solicitar alteracoes cadastrais, consultas financeiras e suporte tecnico.

📨

Volume

1.300+

Tickets/mes estimados via Central de Ajuda, com pico em Alteracao de E-mail (1.111 tickets historicos).

🏗️

Pipeline

Principal

Tickets criados no Pipeline Principal (824265261) com tipo_ticket=requisicao.

🤖

AI-First

8 categorias

Keyword matching automatico sugere categoria, guided questions por tipo, QuickActions self-service.

ℹ️

Form Anterior: Central de Ajuda V2

O form V2 (ID: 5d7d805f) usava o form builder nativo do HubSpot. Campos condicionais (dependent fields) nao funcionaram corretamente, forçando strip para form generico. Este documento descreve a arquitetura do substituto custom.

02 — Problema

Limitacoes do Form Builder Nativo

O HubSpot form builder tem limitacoes significativas para formularios complexos com logica condicional avancada, branding custom e rastreamento de eventos.

❌

Dependent Fields

Quebrados

Campos condicionais com mais de 2 niveis de profundidade nao renderizam corretamente. A V2 teve que ser simplificada para form generico.

❌

Sem Eventos

0 tracking

Nao dispara custom behavioral events. Impossivel rastrear abandono, tempo por step, ou interacao com AI.

❌

Sem AI

Manual

Sem auto-categorizacao, sugestoes, detecçao de urgencia ou guided questions. Tudo depende do usuario escolher corretamente.

03 — Decisao ITIL

tipo_ticket = requisicao

Apos alinhamento ITIL em 09/02/2026, ficou definido que TUDO que entra pela Central de Ajuda e uma requisicao (Request Fulfillment). O time N1 faz triage manual para decidir se e incidente e escalonar para N2.

🚨

REGRA ITIL INVIOLAVEL

tipo_ticket = requisicao — SEMPRE. Em todas as rotas, em todos os cenarios. O form NUNCA define tipo_ticket como "incidente". Isso e responsabilidade exclusiva do N1 apos triage.

1

Central de Ajuda (Form)

Cria ticket com tipo_ticket = requisicao no Pipeline Principal

→

2

Time N1 (Triage)

Analisa ticket. Se for request, resolve. Se for incidente, escala para N2.

→

3

N2 Copy Workflow

Copia ticket para pipeline N2. Muda tipo_ticket = incidente. Associa ticket original.

→

4

N3 (Se necessario)

N2 escala para N3 via CRM Card. Cria ticket N3 + Problema. tipo_ticket = problema.

⚠️

Nomenclatura legado GLPI

O property incidente no HubSpot (objectTypeId 0-5) vem do GLPI e e usado para CATEGORIZACAO, nao para definir o tipo do ticket. No form, exibimos como "Assunto" ou "Qual o assunto?". O label voltado ao cliente NUNCA menciona "incidente".

04 — Arquitetura

Custom HTML/JS + Form Submissions API

Arquivo HTML unico, self-contained (CSS + JS inline), hospedado no HubSpot CMS (File Manager). Submete via Form Submissions API publica — sem autenticacao, sem CORS, workflows existentes continuam funcionando.

┌─────────────────────────────────────────────────────┐ │ HubSpot CMS (File Manager) │ │ suporte.eduzz.com/central-ajuda-2026 │ ├─────────────────────────────────────────────────────┤ │ central-ajuda-2026.html │ │ ┌──────────────┐ ┌─────────────────────────────┐ │ │ │ QuickActions │ │ Wizard (5 steps) │ │ │ │ (self-serve) │ │ 1. Identificacao │ │ │ ├──────────────┤ │ 2. Categoria + Quick │ │ │ │ AI Sidebar │ │ 3. Descricao (guided) │ │ │ │ (Eduzz brand) │ │ 4. Anexos │ │ │ │ - Sugestoes │ │ 5. Revisao + Envio │ │ │ │ - Urgencia │ │ │ │ │ │ - Tips │ │ + Tela Confirmacao │ │ │ └──────────────┘ └─────────────────────────────┘ │ ├─────────────────────────────────────────────────────┤ │ Submit → Form Submissions API (publico, s/ auth) │ │ POST hsforms.com/.../47558663/{formGuid} │ │ → Cria ticket Pipeline Principal (824265261) │ │ → tipo_ticket = requisicao (SEMPRE) │ │ → Workflows existentes funcionam normalmente │ ├─────────────────────────────────────────────────────┤ │ Custom Events → HubSpot Behavioral Events API │ │ Track: step_view, category_selected, quick_action, │ │ ai_suggestion, submit, abandon │ └─────────────────────────────────────────────────────┘

Classes JavaScript

Classe	Responsabilidade
`FormState`	Estado global do form (dados, step atual, validacao)
`Wizard`	Navegacao entre steps, progress indicator, animacoes
`Router`	Decision tree (8 rotas), campos condicionais por categoria
`AIAssistant`	Keyword matching (8 categorias), urgencia, guided questions
`QuickActions`	Self-service links por categoria (email, curso, pagamento)
`EventTracker`	Custom behavioral events (HubSpot _hsq + console)
`HubSpotSubmitter`	Payload builder + POST Form Submissions API
`FileUploader`	Drag & drop, preview, validacao (5 arquivos, 10MB cada)

Wizard: 5 Steps + Confirmacao

1

Step 1 — Identificacao

Nome completo, Email, Tipo de cliente (cards visuais: Produtor/Afiliado/Comprador), Natureza da conta (PF/PJ)

2

Step 2 — Categoria + QuickActions

Grid visual 2x4 com 8 categorias + icones Lucide. Para email/curso/pagamento: QuickActions self-service antes de prosseguir.

3

Step 3 — Descricao + Detalhes

Textarea (min 20 chars) + campos condicionais por rota + guided questions por categoria. AI sidebar ativa.

4

Step 4 — Anexos

Upload drag & drop. Preview por tipo (imagem/PDF/video). Max 5 arquivos, 10MB cada. Opcional.

5

Step 5 — Revisao + Envio

Resumo read-only com "Editar" por secao. SystemStatusBanner + QueueAlert. Botao Enviar → Form Submissions API.

✓

Confirmacao

Timeline visual (Recebido → Em Analise → Em Atendimento → Finalizado). Notificacoes por e-mail. Sem numero de protocolo (Form Submissions API nao retorna record ID do ticket).

Campos Hidden (sempre enviados)

Property	Valor	Motivo
`subject`	`[{assunto}] {50 chars desc}`	Auto-gerado para leitura rapida no CRM
`hs_pipeline`	`824265261`	Pipeline Principal
`hs_pipeline_stage`	`1`	Primeiro stage
`tipo_ticket`	`requisicao`	ITIL: N1 = Request Fulfillment
`fluxo_de_origem`	`Central de Ajuda (FAQ)`	Tracking de origem
`email_solicitante`	`{email do contato}`	Derivado do Step 1

05 — Alternativas Consideradas

Por que esta arquitetura

Opcao	Pro	Contra	Decisao
Form Builder Nativo	Zero dev, auto-cria tickets	Dependent fields quebrados, sem eventos, sem AI	Descartado
Custom HTML + Form Submissions API	Controle total UI/UX, sem auth, workflows continuam, hospedagem HubSpot	Dev manual, sem auto-create de contato (precisa existir ou API cria)	Escolhido
Serverless Function + Tickets API	Controle total server-side	Requer auth (private app token), CORS manual, mais complexo, latencia	Descartado
React SPA standalone	Melhor DX, componentizacao	Build step, hosting externo ou complexo, bundle size, overkill para form	Descartado

✅

Decisao: Custom HTML + Form Submissions API

Melhor custo-beneficio. Controle total da UI/UX, sem autenticacao necessaria, workflows existentes (Q&A Note, N1 Copy, Priorizacao) continuam funcionando sem alteracao. Hospedado no HubSpot File Manager (CDN nativo).

06 — Mapa de Rotas

Decision Tree (8 rotas)

Cada categoria do Step 2 define uma rota. Cada rota determina quais campos condicionais aparecem no Step 3, se QuickActions sao exibidas, e quais guided questions sao mostradas.

📋

tipo_ticket = requisicao (ITIL)

Todos os tickets da Central de Ajuda sao requisicoes. A property incidente e legado GLPI e funciona como seletor de categoria da requisicao. Somente apos triagem N1, um ticket pode ser reclassificado como incidente (N2) ou problema (N3).

Step 1: Identificacao (fixo para todas as rotas) - nome_completo_razao_social, email, tipo_cliente, natureza_da_conta └─ Step 2: Categoria (grid visual 2x4) │ tipo_ticket = requisicao (hidden, todas as rotas) │ fluxo_de_origem = "Central de Ajuda (FAQ)" (hidden, todas as rotas) │ ├─ R01: Dados Cadastrais │ └─ tipo_ticket=requisicao | categoria='Dados Cadastrais' (property: incidente) │ └─ QuickActions: "Acessar Config de Perfil" / "Alterar E-mail nas Config" │ └─ Step 3: tipo_de_alteracao__dados_cadastrais + showWhen condicionais │ [e-mail] informe_o_novo_e_mail │ [nome] informe_o_novo_nome_completo │ [CPF/CNPJ] informe_o_cpf_cnpj_atual, informe_o_novo_cpf_cnpj, motivo_da_troca_de_documento │ [Razao Social] informe_a_nova_razao_social │ ├─ R02: Troca de Titularidade │ └─ tipo_ticket=requisicao | categoria='Conta', detalhe='Troca de Titularidade' (properties: incidente, incidente_de_contas) │ └─ Step 3: ownershipProof (contentAppend) + descricao │ ├─ R03: Cancelamento de Conta │ └─ tipo_ticket=requisicao | categoria='Conta', detalhe='Desativacao Imediata' (properties: incidente, incidente_de_contas) │ └─ Step 3: tipo_de_cancelamento + descricao │ ├─ R04: Unificacao de Contas │ └─ tipo_ticket=requisicao | categoria='Conta', detalhe='Unificacao' (properties: incidente, incidente_de_contas) │ └─ Step 3: accountIdA, accountIdB (contentAppend) + descricao │ ├─ R05: Sem Acesso ao Curso │ └─ tipo_ticket=requisicao | categoria='Acesso' (property: incidente) │ └─ QuickActions: "Reativar Acesso" / "Localizar Compra" │ └─ Step 3: courseUrl (contentAppend) + descricao │ ├─ R06: Pagamentos e Faturas │ └─ tipo_ticket=requisicao | categoria='Consultas Financeiras' (property: incidente) │ └─ QuickActions: "Reenviar Boleto" / "Localizar Compra" │ └─ Step 3: incidente_financeiro, numero_da_fatura, nome_do_curso │ [showWhen tipo_cliente] minhas_compras/vendas motivo │ ├─ R07: Problemas Tecnicos │ └─ tipo_ticket=requisicao | categoria='Bug' (property: incidente) │ └─ Step 3: tipo_incidente__tecnico + descricao │ └─ R08: Outros Assuntos └─ tipo_ticket=requisicao | categoria='Outros Assuntos' (property: incidente) └─ Step 3: descricao apenas Todas as rotas → Step 4 (Anexos) → Step 5 (Revisao + Envio)

Tabela de Rotas

ID	Categoria	Campos Step 3	QuickActions
R01	Dados Cadastrais	`tipo_de_alteracao__dados_cadastrais` + showWhen condicionais	Sim (2)
R02	Troca de Titularidade	`ownershipProof` (contentAppend)	Nao
R03	Cancelamento de Conta	`tipo_de_cancelamento`	Nao
R04	Unificacao de Contas	`accountIdA`, `accountIdB` (contentAppend)	Nao
R05	Sem Acesso ao Curso	`courseUrl` (contentAppend)	Sim (2)
R06	Pagamentos e Faturas	`incidente_financeiro`, `numero_da_fatura`, `nome_do_curso` + showWhen motivo	Sim (2)
R07	Problemas Tecnicos	`tipo_incidente__tecnico`	Nao
R08	Outros Assuntos	nenhum (so descricao)	Nao

QuickActions (Self-Service)

Para 3 categorias de alto volume, exibimos acoes rapidas ANTES de abrir ticket. O objetivo e reduzir volume N1 permitindo auto-resolucao.

📝

Dados Cadastrais

2 acoes

"Acessar Configuracoes de Perfil" (link para settings) + "Alterar E-mail nas Configuracoes" (link direto)

📚

Sem Acesso ao Curso

2 acoes

"Reativar Acesso" (link direto) + "Localizar Compra" (link para historico)

💳

Pagamentos

2 acoes

"Reenviar Boleto" (link para faturas) + "Localizar Compra" (link para historico)

07 — Custom Events

HubSpot Behavioral Events

13 custom events rastreados via _hsq.push(['trackCustomBehavioralEvent', ...]). Permitem analytics de abandono, eficacia da AI, uso de QuickActions e tempo por step.

Event	Trigger	Dados
`ca2026_form_started`	Step 1 carregado	source, timestamp
`ca2026_step_viewed`	Cada step renderizado	step, step_name
`ca2026_step_completed`	Proximo + validacao OK	step, duration_ms
`ca2026_category_selected`	Assunto escolhido	category, ai_suggested, ai_accepted
`ca2026_ai_suggestion`	AI sugere categoria	suggested_category, confidence
`ca2026_urgency_detected`	Urgencia no texto	level (low/med/high), signals
`ca2026_quick_action_shown`	QuickActions exibido	category, actions_count
`ca2026_quick_action_clicked`	QuickAction clicada	category, action_id, resolved
`ca2026_quick_action_skipped`	"Problema nao resolvido"	category
`ca2026_field_changed`	Campo alterado	field_name, step
`ca2026_submit_success`	Form enviado	route_id, total_fields, duration_ms
`ca2026_submit_error`	Erro na submissao	error_code, error_message
`ca2026_abandoned`	Saiu sem enviar	last_step, duration_ms, fields_filled

⚠️

Pre-requisito: Criar Events no Portal

Os 13 custom behavioral events precisam ser criados manualmente em Settings → Custom Events no portal Eduzz (47558663). Requer autorizacao para criar no portal.

Implementacao

class EventTracker { constructor() { this.sessionId = crypto.randomUUID(); this.startTime = Date.now(); } track(eventName, properties = {}) { const payload = { name: eventName, properties: { ...properties, session_id: this.sessionId, timestamp: new Date().toISOString(), elapsed_ms: Date.now() - this.startTime } }; // Console (dev) console.log('[CA-2026]', eventName, payload.properties); // HubSpot custom event if (window._hsq) { window._hsq.push([ 'trackCustomBehavioralEvent', payload ]); } } }

08 — Design System

Brand Eduzz (Customer-Facing)

O form e 100% branding Eduzz. Zero referencias a EPIC. O design e baseado no export Figma (09/02/2026) com adaptacoes para HTML estatico.

:root { --eduzz-yellow: #ffbc00; --eduzz-blue: #0050bd; --eduzz-dark: #333333; --eduzz-text: #666666; --eduzz-btn-text: #654605; --eduzz-bg: #ffffff; --eduzz-bg-light: #f0f0f0; --radius: 8px; --radius-lg: 20px; --font: 'Open Sans', sans-serif; }

Theme

Light

Fundo branco, padrao Eduzz. Sem dark mode.

Font

Open Sans

Google Fonts. Tom conversacional, amigavel.

Botoes primarios

Gradient

from-blue-600 to-purple-600 (inspirado Figma). Hover: scale + shadow.

Cards

rounded-2xl

bg-white, shadow-sm, border gray-200, padding 24px.

Icons

Lucide

Via CDN. Biblioteca completa, lightweight, consistente.

Progress

Circles

Connector lines. Green=done, gradient=current, gray=pending.

09 — Testes

Estrategia de Testes Automatizados

Arquivo central-ajuda-2026.test.js executavel via node. 10 categorias de teste, 84 testes cobrindo rotas, payload, categoryMapping, AI, validacao, QuickActions, eventos, ITIL, showWhen, contentAppend e compatibilidade Q&A.

🗺️

Rotas

13 testes

R01-R08: campos visiveis corretos, R01 expandido com 7 sub-campos condicionais.

📦

Payload + Mapping

15 testes

categoryMapping, incidente enum valido, incidente_de_contas, email_solicitante, subject correto.

🤖

AI Keywords

10 testes

Keyword matching para 8 categorias + teste generico + novos termos (cpf, razao social).

✅

Validacao

9 testes

5 steps, showWhen skip, email invalido, descricao curta, arquivo grande.

⚡

QuickActions

6 testes

3 categorias com QA + 2 sem QA + skip behavior.

📊

Events

4 testes

Step transitions, category selection, submit success, session_id presence.

🚨

ITIL Critico

6 testes

tipo_ticket=requisicao em todas as rotas, fluxo_de_origem correto, pipeline/stage.

👁️

showWhen

9 testes

Campos condicionais R01 (5 opcoes) + R06 cross-step (tipo_cliente).

📎

contentAppend

7 testes

Campos sem property HubSpot (ownershipProof, accountIdA/B, courseUrl) no content.

🔗

Q&A Compat

5 testes

Nomes de properties identicos ao workflow nota-qa-central-ajuda.js (25 campos).

🚨

Teste ITIL Critico

Um teste dedicado verifica que tipo_ticket = requisicao em TODOS os 8 payloads de rota. Se este teste falhar, o deploy e BLOQUEADO.

// Execucao cd /epic/reporting/clientes/eduzz/hubspot-implementation/forms node central-ajuda-2026.test.js // Output: 84/84 PASS (10 categorias de teste)

10 — Auditoria de Compatibilidade

Fase 3: Prototipo vs HubSpot Real

O form custom foi construido com base no prototipo Figma (8 categorias flat). A auditoria comparou com os dados reais do portal HubSpot (1080 properties, 62 forms). 8 GAPs identificados e corrigidos.

#	Gap	Severidade	Correcao Aplicada
1	`incidente` values incompativeis	BREAKING	categoryMapping: 8 cats UI → 6 valores enum HubSpot + incidente_de_contas
2	`fluxo_de_origem` valor invalido	BREAKING	“formulario” → “Central de Ajuda (FAQ)”
3	`tipo_cliente` valor incorreto	WRONG	“Comprador” → “Cliente final” + adicionada “Agencia”
4	Campos inventados (6 nomes)	WRONG	Renomeados para nomes reais do HubSpot (informe_o_novo_e_mail, etc.)
5	Campos V2 ausentes (11)	MISSING	R01 expandido para “Dados Cadastrais” + R06 com motivos compras/vendas
6	`acao_reembolso` opcoes erradas	WRONG	Removido — opcoes HubSpot sao de resolucao de ticket, nao tipo
7	`hs_ticket_category`	INFO	Nao enviar — deixar automacao externa da Eduzz
8	Q&A Workflow compatibilidade	COMPAT	Nomes de properties identicos ao workflow + email_solicitante derivado

Category Mapping (UI → HubSpot)

Rota	UI Category	`incidente`	`incidente_de_contas`
R01	Dados Cadastrais	Dados Cadastrais	—
R02	Troca de Titularidade	Conta	Troca de Titularidade
R03	Cancelamento de Conta	Conta	Desativacao Imediata
R04	Unificacao de Contas	Conta	Unificacao
R05	Sem Acesso ao Curso	Acesso	—
R06	Pagamentos e Faturas	Consultas Financeiras	—
R07	Problemas Tecnicos	Bug	—
R08	Outros Assuntos	Outros Assuntos	—

Novos Mecanismos (Fase 3)

👁️

showWhen

Campos condicionais

R01: 5 sub-campos controlados por tipo_de_alteracao. R06: motivos por tipo_cliente (cross-step).

📎

contentAppend

Campos sem property

ownershipProof (R02), accountIdA/B (R04), courseUrl (R05) — valores anexados ao content.

🗺️

categoryMapping

UI → HubSpot

Traduz 8 categorias UI para 6 valores validos do enum incidente no HubSpot.

11 — Variante Interna

Formulario Interno Eduzz

Arquivo formulario-interno-2026.html — mesmo engine, config diferente. Para uso do time interno Eduzz (TI, RH, Facilities).

Aspecto	Central de Ajuda (externo)	Formulario Interno
Publico	Clientes Eduzz	Time interno Eduzz
Step 1	nome, email, tipo_cliente, natureza	nome, email_corporativo, departamento, ramal
Step 2	8 categorias clientes	7 categorias internas (Infra, SW, Acessos, RH, Financeiro, Facilities, Outros)
fluxo_de_origem	Central de Ajuda (FAQ)	formulario_interno
tipo_ticket	requisicao	requisicao (mantem ITIL)
QuickActions	Self-service clientes	Links internos (reset senha, reserva sala)
AI Keywords	Vocabulario de clientes	Vocabulario tecnico interno

Rotas Internas (7)

Rota	Categoria	Campos Step 3
RI01	Infraestrutura	tipo_equipamento, patrimonio
RI02	Software Interno	software_nome, tipo_problema_sw
RI03	Acessos e Permissoes	sistema_acesso, tipo_acesso, colaborador_alvo
RI04	RH e Beneficios	tipo_rh
RI05	Financeiro Interno	tipo_financeiro_int, valor_estimado
RI06	Facilities	local_facilities, tipo_facilities
RI07	Outros Internos	(apenas descricao)

12 — Referencias

IDs e Recursos

Portal & Account

Recurso	ID	Nota
Portal Eduzz	`47558663`	Portal do cliente
Form V2 (legado)	`5d7d805f`	Form nativo — sendo substituido

Pipelines

Pipeline	ID	tipo_ticket
Principal (destino do form)	`824265261`	`requisicao`
N2	`824265268`	`incidente`
N1 Humano	`824388612`	`requisicao`
JIRA Problemas	`866500651`	`problema`

Workflows Relacionados

Workflow	Funcao
Q&A Note	Gera nota de qualidade no ticket apos criacao
N1 Copy	Copia 116 propriedades para ticket N1
N2 Copy	Copia para pipeline N2 com associacao (typeId 260)
Priorizacao	Calcula prioridade baseada em urgencia e tipo
WF-010 Spam	Detecta e marca tickets de spam

Deploy

# Deploy via HubSpot CMS Page # URL final: # https://suporte.eduzz.com/central-ajuda-2026

Documentos Relacionados

Documento	Codigo	Descricao
HubSpot API	TI-002	Documentacao geral da API HubSpot para Eduzz
API de Formularios	TI-003	Form Submissions API — referencia principal
Central de Ajuda Arquitetura	TI-004	Este documento

13 — Test Runner

Teste de Submissao (Web)

Gera dados aleatorios para qualquer rota, mostra preview completo dos campos e submete via Form Submissions API. Equivalente ao CLI central-ajuda-2026-runner.js.

⚠️

Cria tickets reais

Submeter cria um ticket real no HubSpot (portal 47558663, pipeline Principal). Use apenas para QA/teste.

Selecionar Rota

14 — Debug Mode

Modo Debug no Form Publicado

Painel de debug integrado ao formulario em producao. Ativado via URL param ?debug=1. Testa no ambiente real: mesma UI, mesmo JS, mesmos workflows.

⚠️

Cria tickets reais

Auto-Submit cria um ticket real no HubSpot. O debug mode usa a mesma pipeline e workflows de producao.

Ativacao

https://suporte.eduzz.com/central-ajuda-2026?debug=1

Sem ?debug=1 o formulario e exibido normalmente. O painel de debug nao interfere com a experiencia do usuario final.

Funcionalidades

Recurso	Descricao
Seletor de Rotas	8 botoes (R01–R08). Selecionar uma rota configura o auto-fill para aquela categoria.
Auto-Fill	Gera dados aleatorios (nome, email, tipo_cliente, natureza) e preenche todos os campos da rota selecionada, incluindo condicionais (`showWhen`) e `contentAppend`.
Preview	Mostra todos os dados gerados no painel lateral antes de submeter.
Show Payload	Exibe o JSON exato que sera enviado para a Form Submissions API.
Auto-Submit	Auto-Fill + submit automatico. Cria ticket real no HubSpot em 1 clique.
Toggle	Botao para mostrar/esconder o painel sem recarregar a pagina.

Implementacao

O debug mode reutiliza as mesmas estruturas do form (FORM_CONFIG, state, submitForm()). Componentes adicionais:

Funcao	Responsabilidade
`initDebugMode()`	Verifica `URLSearchParams`. Se `debug=1`, adiciona classe `debug-active` ao body e renderiza botoes de rota.
`debugAutoFill(routeId)`	Gera dados aleatorios, popula `state.formData`, simula selecao de categoria, preenche campos condicionais, navega para Step 5 (Revisao).
`debugBuildPayload()`	Monta o payload usando a mesma logica de `submitForm()` sem submeter.
`debugAutoSubmit(routeId)`	`debugAutoFill()` + `submitForm()` com delay de 300ms.

UI — Painel Lateral

Sidebar fixa (380px, lado direito), fundo escuro semi-transparente (rgba(0,0,0,0.95)), z-index 9999. O form principal recebe margin-right: 390px quando debug ativo para evitar sobreposicao.