# War Room Dashboard — Prompt Master

Prompt único pra gerar o dashboard HTML do VIZNFR War Room (gestão visual de campanhas Meta Ads + GA4).

## Contexto que a IA deve assumir

- Stack: HTML estático único (inline CSS + JS vanilla), sem framework, sem build
- Fonte: Host Grotesk (Google Fonts) — ÚNICA fonte, nada mais
- Visual: PDF NULL Squad Design — tri-theme monocromático, fundo dark `#0A0A0A`, texto `#FFFFFF`, cinza `#2B2B2B` / `#555555`
- Título: UPPERCASE Medium 500 misturado com Regular 400 (ex: `CAMPANHAS ativas`)
- Régua horizontal `56×2px` em `#FFFFFF`
- Header fixo + footer fixo, labels de gutter laterais
- Zero logo Squad Film (é variante NULL)

## Dados que o dashboard exibe

1. **Campanhas ativas** (até 20) — nome, budget, spend, CPM, CPA, CTR, ROAS, status (ON/OFF)
2. **Criativos top 10** — thumb, nome, impressions, CTR, conversões, status
3. **Benchmarks BR** (do skill ads-ratos) — CPM típico, CTR típico, CPA típico por nicho
4. **Health score** 0-100 — agregação de 7 métricas
5. **Alertas** — criativos cansados (CTR decay > 20%), campanhas sem conversão 7d, orçamento em risco
6. **Flow SCRAPER → FORGE → PUBLISHER → LOOPER** — 4 cards com última execução, status, próxima run

## Estrutura HTML

```
<html>
  <head><Host Grotesk> <style inline></head>
  <body>
    <header fixed> WAR ROOM — MARKETING OS </header>
    <main grid 12 col>
      <section card> HEALTH SCORE (big number + 7 subscores) </section>
      <section card> CAMPANHAS ATIVAS (tabela) </section>
      <section card> CRIATIVOS TOP 10 (grid thumbs) </section>
      <section card> BENCHMARKS BR (tabela nicho x métrica) </section>
      <section card> ALERTAS (lista com severidade) </section>
      <section card> PIPELINE AGENTES (4 cards SCRAPER/FORGE/PUBLISHER/LOOPER) </section>
    </main>
    <footer fixed> página 1/1 · atualizado HH:MM · squadfilm.com · @squadfilme </footer>
  </body>
</html>
```

## Regras de design obrigatórias

- Margin top main: 96px (gutter do header fixo)
- Logo: NENHUM (variante NULL)
- Títulos de seção H2: `TEXTO em UPPERCASE 500 + regular 400` mesma linha
- Números grandes (health score, KPIs): peso 500, tamanho `clamp(48px, 6vw, 96px)`
- Tabelas: 1px rule superior/inferior em `#2B2B2B`, zebra sutil
- Thumbs: proporção 1:1, 96px, border 1px `#2B2B2B`
- Status pills: ON = branco em preto, OFF = preto em `#555555`

## Prompt pronto pra colar na IA

```
Gera um dashboard HTML estático chamado "War Room" pra gestão Meta Ads + GA4, seguindo o padrão PDF NULL Squad Design:

- fonte Host Grotesk única (Google Fonts weights 400, 500)
- fundo #0A0A0A, texto #FFFFFF, acentos #2B2B2B e #555555
- header fixo com título "WAR ROOM — MARKETING OS"
- footer fixo com paginação + squadfilm.com + @squadfilme
- 6 seções: HEALTH SCORE / CAMPANHAS ATIVAS / CRIATIVOS TOP 10 / BENCHMARKS BR / ALERTAS / PIPELINE AGENTES
- títulos H2 em UPPERCASE 500 + palavra regular 400 mixed ("CAMPANHAS ativas")
- régua horizontal 56×2px após cada título
- tabelas monocromáticas com 1px rule #2B2B2B
- nenhum logo

Dados devem ser carregados de um objeto JS `window.__DATA__ = {...}` no topo do arquivo — estrutura:
{
  healthScore: number,
  subscores: {spend: n, ctr: n, cpa: n, roas: n, alertas: n, criativos: n, conversao: n},
  campanhas: [{nome, budget, spend, cpm, cpa, ctr, roas, status}],
  criativos: [{thumb, nome, impressions, ctr, conversoes, status}],
  benchmarks: [{nicho, cpm, ctr, cpa}],
  alertas: [{tipo, severidade, msg}],
  agentes: [{nome, ultimaRun, status, proximaRun}]
}

Saída: ÚNICO arquivo index.html completo, zero dependências externas além de Google Fonts.
```
