docs(C190): plano + designs hi-fi do dossiê Solla por tema/área (Related #1143)

This commit is contained in:
Francisco Solla 2026-09-18 09:47:41 -03:00
parent 5644a9f947
commit d047db360d
3 changed files with 2569 additions and 0 deletions

View file

@ -0,0 +1,734 @@
<!doctype html>
<html lang="pt-BR">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script>
<title>Design — Boletim modelo do dossiê Solla por área</title>
<style type="text/tailwindcss">
@theme inline {
--font-sans: 'Fira Sans', 'DejaVu Sans', Arial, sans-serif;
--color-ink: #172033;
--color-ink-soft: #435264;
--color-paper: #fff;
--color-workspace: #d8dde1;
--color-line: #cbd5dc;
--color-wash: #f3f6f8;
--color-accent: #315c75;
--color-accent-soft: #e8f0f4;
--color-warning: #8a5a18;
--color-warning-soft: #fff7e8;
}
:root {
--ink: #172033;
--ink-soft: #435264;
--paper: #fff;
--workspace: #d8dde1;
--line: #cbd5dc;
--wash: #f3f6f8;
--accent: #315c75;
--accent-soft: #e8f0f4;
--warning: #8a5a18;
--warning-soft: #fff7e8;
}
* {
box-sizing: border-box;
}
html {
color-scheme: light;
}
body {
margin: 0;
color: var(--ink);
background: var(--workspace);
font-family: 'Fira Sans', 'DejaVu Sans', Arial, sans-serif;
-webkit-font-smoothing: antialiased;
}
.sheet {
position: relative;
width: 210mm;
height: 297mm;
padding: 8mm 10mm 7mm 12mm;
overflow: hidden;
display: flex;
flex-direction: column;
background: var(--paper);
box-shadow: 0 18px 44px rgb(23 32 51 / 18%);
font-size: 10.25pt;
line-height: 1.26;
}
.sheet::before {
content: '';
position: absolute;
inset: 0 auto 0 0;
width: 3.5mm;
background: var(--accent);
}
.sheet p,
.sheet h1,
.sheet h2,
.sheet h3,
.sheet ul {
margin-top: 0;
}
.tabular {
font-variant-numeric: tabular-nums;
}
.model-label {
display: inline-flex;
align-items: center;
min-height: 6mm;
padding: 1mm 2.5mm;
border: 0.35mm solid var(--warning);
border-radius: 99px;
color: #68420f;
background: var(--warning-soft);
font-size: 7.3pt;
font-weight: 800;
letter-spacing: 0.08em;
text-transform: uppercase;
white-space: nowrap;
}
.defeso-band {
margin-inline: -10mm;
padding: 1.4mm 10mm;
display: flex;
align-items: center;
justify-content: space-between;
gap: 5mm;
color: #68420f;
background: var(--warning-soft);
border-block: 0.25mm solid #e7cc9d;
font-size: 7.15pt;
font-weight: 700;
}
.kicker,
.section-label {
color: var(--accent);
font-size: 7.4pt;
line-height: 1.1;
font-weight: 800;
letter-spacing: 0.12em;
text-transform: uppercase;
}
.section-label {
margin-bottom: 1.2mm;
}
.identity-pill {
display: inline-flex;
align-items: center;
min-height: 5mm;
padding: 0.55mm 1.7mm;
border: 0.25mm solid var(--line);
border-radius: 99px;
color: var(--ink-soft);
background: var(--wash);
font-size: 6.9pt;
font-weight: 750;
text-transform: uppercase;
letter-spacing: 0.045em;
}
.asset-box {
border: 0.4mm dashed #748894;
color: #40535f;
background:
linear-gradient(135deg, transparent 49.6%, #cbd5dc 50%, transparent 50.4%),
linear-gradient(45deg, transparent 49.6%, #cbd5dc 50%, transparent 50.4%), #f7f9fa;
}
.highlight-card {
min-height: 30mm;
padding: 2.6mm 3mm 2.35mm;
border: 0.3mm solid var(--line);
border-top: 1.15mm solid var(--accent);
background: var(--paper);
}
.highlight-eyebrow {
margin-bottom: 1.4mm;
color: var(--ink-soft);
font-size: 6.65pt;
font-weight: 800;
letter-spacing: 0.075em;
text-transform: uppercase;
}
.highlight-number {
margin: 0;
color: var(--accent);
font-size: 18pt;
line-height: 0.96;
font-weight: 800;
letter-spacing: -0.035em;
}
.highlight-title {
margin: 1.4mm 0 0;
font-size: 10.5pt;
line-height: 1.08;
font-weight: 800;
letter-spacing: -0.01em;
}
.highlight-note {
margin: 1.2mm 0 0;
color: var(--ink-soft);
font-size: 7.9pt;
line-height: 1.2;
}
.timeline-step {
position: relative;
padding: 4.3mm 2.5mm 1.2mm;
border-top: 0.4mm solid #97aab6;
}
.timeline-step::before {
content: '';
position: absolute;
top: -1.6mm;
left: 2.5mm;
width: 3mm;
height: 3mm;
border: 0.65mm solid var(--accent-soft);
border-radius: 99px;
background: var(--accent);
box-shadow: 0 0 0 0.3mm var(--accent);
}
.more-item {
position: relative;
min-height: 10mm;
padding: 0 0 1.7mm 4.8mm;
border-bottom: 0.25mm solid var(--line);
font-size: 8.6pt;
line-height: 1.2;
}
.more-item::before {
content: '✓';
position: absolute;
left: 0;
top: 0;
color: var(--accent);
font-weight: 900;
}
.lacuna-panel {
border: 0.4mm dashed #b18549;
color: #684819;
background: var(--warning-soft);
}
@page {
size: A4;
margin: 0;
}
@media print {
body {
background: #fff;
}
.gate-header,
.scene-label {
display: none !important;
}
.pages {
display: block !important;
padding: 0 !important;
}
.scene {
width: 210mm;
height: 297mm;
margin: 0 !important;
break-after: page;
}
.scene:last-child {
break-after: auto;
}
.sheet {
box-shadow: none;
}
}
</style>
</head>
<body>
<header class="gate-header mx-auto max-w-[1100px] px-6 pt-8 text-ink">
<p class="text-xs font-bold uppercase tracking-[.14em] text-accent">
Gate visual · Impeccable C · variante por área
</p>
<h1 class="mt-1 text-2xl font-semibold tracking-tight">
Boletim modelo por área — uma página A4
</h1>
<p class="mt-2 max-w-3xl text-sm leading-6 text-ink-soft">
Duas alternativas imprimíveis: composição completa e variação honesta com poucos fatos.
Números abaixo são placeholders editoriais, não claims.
</p>
<div class="mt-4 flex flex-wrap gap-2 text-xs">
<span class="rounded-full border border-line bg-white px-3 py-1">Educação · educacao</span
><span class="rounded-full border border-line bg-white px-3 py-1">até 6 destaques</span
><span class="rounded-full border border-line bg-white px-3 py-1">até 14 em “E mais”</span
><span class="rounded-full border border-line bg-white px-3 py-1">sem fontes · sem CTA</span
><span class="rounded-full border border-line bg-white px-3 py-1"
>segmento/rede não somam</span
>
</div>
</header>
<main class="pages mx-auto flex max-w-[1100px] flex-col items-center gap-12 px-6 py-10">
<section class="scene" aria-labelledby="bulletin-title">
<p class="scene-label mb-2 text-xs font-bold uppercase tracking-[.12em] text-ink-soft">
Cena 01 · Boletim completo · densidade máxima permitida
</p>
<article class="sheet" aria-label="Modelo completo do boletim de Educação">
<header
class="flex items-center justify-between gap-[5mm] border-b-[.55mm] border-ink pb-[2.4mm]"
>
<div>
<p class="kicker mb-[1mm]">Boletim informativo · série temática</p>
<p class="m-0 text-[11pt] font-extrabold">Educação</p>
<div class="mt-[1.3mm] flex flex-wrap gap-[1.2mm]">
<span class="identity-pill">Área</span><span class="identity-pill">educacao</span
><span class="identity-pill">Taxonomia do acervo</span>
</div>
</div>
<span class="model-label">Modelo — insumo interno</span>
</header>
<div class="defeso-band mt-[2.2mm]" role="note">
<span
>DEFESO 2026 · material em preparação · revisão editorial e jurídica obrigatória</span
><span class="shrink-0 uppercase tracking-[.07em]">sem CTA · sem propaganda</span>
</div>
<section class="mt-[3mm] grid grid-cols-[1fr_45mm] gap-[5mm]">
<div>
<p class="section-label">Uma trajetória de trabalho pela área</p>
<h1
id="bulletin-title"
class="m-0 text-[22.5pt] font-semibold leading-[1] tracking-[-.038em]"
>
O que Jorge Solla fez pela <span class="text-accent">Educação</span>
</h1>
<p class="mb-0 mt-[2.3mm] max-w-[126mm] text-[10.2pt] leading-[1.3] text-ink-soft">
Ações, recursos e articulações explicados de forma direta — somente fatos já
documentados no dossiê da área.
</p>
</div>
<div
class="asset-box flex min-h-[35mm] flex-col items-center justify-center rounded-sm p-[3mm] text-center"
>
<svg
class="mb-[1.4mm] h-6 w-6 text-accent"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="1.8"
>
<rect x="3" y="5" width="18" height="14" rx="2" />
<circle cx="8.5" cy="10" r="1.5" />
<path d="m21 15-5-5L5 19" />
</svg>
<p class="m-0 text-[7.4pt] font-extrabold uppercase tracking-[.08em]">
NEEDS ASSET · foto real
</p>
<p class="mb-0 mt-[1mm] text-[6.9pt] leading-[1.22]">
Solla em ação ligada à Educação<br />origem, autoria e licença
</p>
</div>
</section>
<section class="mt-[3.3mm]" aria-labelledby="highlights-title">
<div
class="flex items-end justify-between gap-4 border-b-[.3mm] border-line pb-[1.3mm]"
>
<div>
<p class="section-label">Destaques</p>
<h2
id="highlights-title"
class="m-0 text-[13.5pt] font-semibold leading-none tracking-[-.015em]"
>
Resultados em leitura rápida
</h2>
</div>
<p
class="m-0 text-right text-[6.7pt] font-bold uppercase tracking-[.065em] text-ink-soft"
>
número + fase + alcance preservados
</p>
</div>
<div class="mt-[2.2mm] grid grid-cols-3 gap-[2mm]">
<article class="highlight-card rounded-sm">
<p class="highlight-eyebrow">Área · área</p>
<p class="highlight-number tabular">R$ —</p>
<h3 class="highlight-title">para uma entrega documentada</h3>
<p class="highlight-note">
Fase: [confirmar]. Não publicar até substituir o placeholder.
</p>
</article>
<article class="highlight-card rounded-sm">
<p class="highlight-eyebrow">Área · área</p>
<p class="highlight-number tabular">N ações</p>
<h3 class="highlight-title">com resultado comprovado</h3>
<p class="highlight-note">Usar só a contagem sustentada pelo dossiê.</p>
</article>
<article class="highlight-card rounded-sm">
<p class="highlight-eyebrow">Área · segmento</p>
<p class="highlight-number tabular">N pessoas</p>
<h3 class="highlight-title">alcançadas em um segmento</h3>
<p class="highlight-note">Segmento educacional separado da área.</p>
</article>
<article class="highlight-card rounded-sm">
<p class="highlight-eyebrow">Área · rede</p>
<p class="highlight-number tabular">N iniciativas</p>
<h3 class="highlight-title">junto à rede relacionada</h3>
<p class="highlight-note">Não atribuir alcance compartilhado à área inteira.</p>
</article>
<article class="highlight-card rounded-sm">
<p class="highlight-eyebrow">Área · segmento</p>
<p class="highlight-number tabular">N projetos</p>
<h3 class="highlight-title">com papel documentado</h3>
<p class="highlight-note">Dizer o papel exato, sem ampliar autoria.</p>
</article>
<article class="highlight-card rounded-sm">
<p class="highlight-eyebrow">Área · área</p>
<p class="highlight-number tabular">AAAA</p>
<h3 class="highlight-title">marco confirmado na trajetória</h3>
<p class="highlight-note">Ano e fato entram somente após conferência.</p>
</article>
</div>
</section>
<section
class="mt-[3mm] rounded-sm bg-accent-soft px-[3mm] pb-[2.3mm] pt-[2.5mm]"
aria-labelledby="timeline-title"
>
<div class="flex items-center justify-between gap-4">
<h2 id="timeline-title" class="m-0 text-[10.8pt] font-semibold">
Uma trajetória de compromisso com o serviço público
</h2>
<p class="m-0 text-[6.5pt] font-bold uppercase tracking-[.075em] text-accent">
quatro momentos · contexto de carreira
</p>
</div>
<div class="mt-[2.7mm] grid grid-cols-4">
<div class="timeline-step">
<p class="mb-[.7mm] text-[7.1pt] font-extrabold text-accent">1999–2002</p>
<p class="m-0 text-[8.1pt] font-semibold leading-[1.16]">
Gestão municipal da saúde
</p>
</div>
<div class="timeline-step">
<p class="mb-[.7mm] text-[7.1pt] font-extrabold text-accent">2003–2005</p>
<p class="m-0 text-[8.1pt] font-semibold leading-[1.16]">
Atenção à saúde no governo federal
</p>
</div>
<div class="timeline-step">
<p class="mb-[.7mm] text-[7.1pt] font-extrabold text-accent">2007–2014</p>
<p class="m-0 text-[8.1pt] font-semibold leading-[1.16]">
Secretaria da Saúde da Bahia
</p>
</div>
<div class="timeline-step">
<p class="mb-[.7mm] text-[7.1pt] font-extrabold text-accent">2015–2027</p>
<p class="m-0 text-[8.1pt] font-semibold leading-[1.16]">
Atuação na Câmara Federal
</p>
</div>
</div>
</section>
<section
class="mt-[3mm] grid grid-cols-[1fr_42mm] gap-[4mm]"
aria-labelledby="more-title"
>
<div>
<div
class="flex items-end justify-between gap-4 border-b-[.3mm] border-line pb-[1.2mm]"
>
<div>
<p class="section-label">E mais</p>
<h2 id="more-title" class="m-0 text-[12pt] font-semibold leading-none">
Outras ações confirmadas
</h2>
</div>
<p class="m-0 text-[6.5pt] font-bold uppercase tracking-[.065em] text-ink-soft">
até 14 · sem completar por inferência
</p>
</div>
<div class="mt-[2mm] grid grid-cols-2 gap-x-[4mm] gap-y-[1.25mm]">
<p class="more-item mb-0">
<strong>Programa:</strong> objeto e resultado documentados.
</p>
<p class="more-item mb-0">
<strong>Ensino básico:</strong> apoio e alcance confirmados.
</p>
<p class="more-item mb-0"><strong>Ensino superior:</strong> papel comprovado.</p>
<p class="more-item mb-0">
<strong>Educação profissional:</strong> ação registrada.
</p>
<p class="more-item mb-0"><strong>EJA:</strong> iniciativa e público conferidos.</p>
<p class="more-item mb-0">
<strong>Orçamento:</strong> valor com fase identificada.
</p>
<p class="more-item mb-0"><strong>Audiência:</strong> pauta e encaminhamento.</p>
<p class="more-item mb-0">
<strong>Articulação:</strong> resultado distinto do anúncio.
</p>
<p class="more-item mb-0"><strong>Rede:</strong> instituições envolvidas.</p>
<p class="more-item mb-0"><strong>Proposição:</strong> autoria e tramitação.</p>
<p class="more-item mb-0">
<strong>Relatoria:</strong> etapa e efeito documentados.
</p>
<p class="more-item mb-0"><strong>Fiscalização:</strong> ato e desdobramento.</p>
<p class="more-item mb-0"><strong>Direitos:</strong> defesa registrada.</p>
<p class="more-item mb-0"><strong>Reconhecimento:</strong> nome oficial e ano.</p>
</div>
</div>
<aside class="grid grid-rows-2 gap-[2.2mm]">
<div
class="asset-box flex min-h-[24mm] items-center justify-center rounded-sm p-[2.5mm] text-center"
>
<p class="m-0 text-[6.9pt] leading-[1.22]">
<strong class="uppercase tracking-[.06em]">NEEDS ASSET · selo</strong
><br />identidade autorizada<br />arquivo vetorial
</p>
</div>
<div
class="asset-box flex min-h-[24mm] items-center justify-center rounded-sm p-[2.5mm] text-center"
>
<p class="m-0 text-[6.9pt] leading-[1.22]">
<strong class="uppercase tracking-[.06em]">NEEDS ASSET · clipping</strong
><br />registro real da ação<br />origem e licença
</p>
</div>
</aside>
</section>
<footer class="mt-auto border-t-[.35mm] border-line pt-[2mm]">
<div class="flex items-end justify-between gap-[5mm]">
<div>
<p class="mb-[.7mm] text-[7pt] font-semibold leading-[1.22] text-accent">
Conteúdo selecionado do dossiê temático Educação.
</p>
<p class="m-0 max-w-[145mm] text-[7.1pt] leading-[1.25] text-ink-soft">
<strong class="text-warning">Controle editorial:</strong> fase acompanha cada
valor · segmento e rede não são somados à área · sem percentual estadual absoluto
· defeso 2026.
</p>
</div>
<p
class="m-0 shrink-0 text-right text-[7pt] font-semibold leading-[1.28] text-ink-soft"
>
MODELO · INSUMO INTERNO<br />A4 · página 1/1
</p>
</div>
</footer>
</article>
</section>
<section class="scene" aria-labelledby="sparse-title">
<p class="scene-label mb-2 text-xs font-bold uppercase tracking-[.12em] text-ink-soft">
Cena 02 · Variação de lacuna · poucos fatos documentados
</p>
<article class="sheet" aria-label="Variação do boletim de Educação com poucos fatos">
<header
class="flex items-center justify-between gap-[5mm] border-b-[.55mm] border-ink pb-[2.4mm]"
>
<div>
<p class="kicker mb-[1mm]">Boletim informativo · série temática</p>
<p class="m-0 text-[11pt] font-extrabold">Educação</p>
<div class="mt-[1.3mm] flex flex-wrap gap-[1.2mm]">
<span class="identity-pill">Área</span><span class="identity-pill">educacao</span
><span class="identity-pill">Taxonomia do acervo</span>
</div>
</div>
<span class="model-label">Modelo — insumo interno</span>
</header>
<div class="defeso-band mt-[2.2mm]">
<span
>DEFESO 2026 · material em preparação · revisão editorial e jurídica obrigatória</span
><span class="shrink-0 uppercase tracking-[.07em]">sem CTA · sem propaganda</span>
</div>
<section class="mt-[3.2mm] grid grid-cols-[1fr_55mm] gap-[5mm]">
<div>
<p class="section-label">Somente o que está documentado</p>
<h1
id="sparse-title"
class="m-0 text-[23pt] font-semibold leading-[1] tracking-[-.038em]"
>
O que Jorge Solla fez pela <span class="text-accent">Educação</span>
</h1>
<p class="mb-0 mt-[2.5mm] text-[10.4pt] leading-[1.32] text-ink-soft">
Esta versão encontrou poucos registros confirmados. Em vez de preencher espaço,
mostra só os fatos sustentados pelo dossiê.
</p>
</div>
<div
class="asset-box flex min-h-[39mm] flex-col items-center justify-center rounded-sm p-[3mm] text-center"
>
<svg
class="mb-[1.5mm] h-6 w-6 text-accent"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="1.8"
>
<rect x="3" y="5" width="18" height="14" rx="2" />
<circle cx="8.5" cy="10" r="1.5" />
<path d="m21 15-5-5L5 19" />
</svg>
<p class="m-0 text-[7.4pt] font-extrabold uppercase tracking-[.08em]">
NEEDS ASSET · foto ou clipping
</p>
<p class="mb-0 mt-[1mm] text-[6.9pt] leading-[1.22]">
registro ligado ao fato<br />origem, autoria e licença
</p>
</div>
</section>
<section class="mt-[5mm]" aria-labelledby="sparse-highlights">
<div
class="flex items-end justify-between gap-4 border-b-[.3mm] border-line pb-[1.5mm]"
>
<div>
<p class="section-label">Destaques</p>
<h2 id="sparse-highlights" class="m-0 text-[14pt] font-semibold leading-none">
Dois fatos, sem enchimento
</h2>
</div>
<p
class="m-0 text-right text-[6.8pt] font-bold uppercase tracking-[.07em] text-warning"
>
não criar cards vazios para chegar a seis
</p>
</div>
<div class="mt-[3mm] grid grid-cols-2 gap-[3mm]">
<article class="highlight-card min-h-[37mm] rounded-sm p-[4mm]">
<p class="highlight-eyebrow">Área · área</p>
<p class="highlight-number tabular">N ações</p>
<h3 class="highlight-title text-[12pt]">com resultado documentado</h3>
<p class="highlight-note text-[8.4pt]">
Substituir pela contagem confirmada e explicar o resultado em uma frase.
</p>
</article>
<article class="highlight-card min-h-[37mm] rounded-sm p-[4mm]">
<p class="highlight-eyebrow">Área · segmento</p>
<p class="highlight-number tabular">AAAA</p>
<h3 class="highlight-title text-[12pt]">marco de uma ação confirmada</h3>
<p class="highlight-note text-[8.4pt]">O segmento permanece separado da área.</p>
</article>
</div>
</section>
<section class="mt-[4.5mm] rounded-sm bg-accent-soft px-[3.5mm] pb-[3mm] pt-[3.2mm]">
<div class="flex items-center justify-between gap-4">
<h2 class="m-0 text-[11.5pt] font-semibold">
Uma trajetória de compromisso com o serviço público
</h2>
<p class="m-0 text-[6.7pt] font-bold uppercase tracking-[.08em] text-accent">
contexto de carreira · não substitui fato da área
</p>
</div>
<div class="mt-[3mm] grid grid-cols-4">
<div class="timeline-step">
<p class="mb-[.7mm] text-[7.2pt] font-extrabold text-accent">1999–2002</p>
<p class="m-0 text-[8.4pt] font-semibold leading-[1.18]">
Gestão municipal da saúde
</p>
</div>
<div class="timeline-step">
<p class="mb-[.7mm] text-[7.2pt] font-extrabold text-accent">2003–2005</p>
<p class="m-0 text-[8.4pt] font-semibold leading-[1.18]">
Atenção à saúde no governo federal
</p>
</div>
<div class="timeline-step">
<p class="mb-[.7mm] text-[7.2pt] font-extrabold text-accent">2007–2014</p>
<p class="m-0 text-[8.4pt] font-semibold leading-[1.18]">
Secretaria da Saúde da Bahia
</p>
</div>
<div class="timeline-step">
<p class="mb-[.7mm] text-[7.2pt] font-extrabold text-accent">2015–2027</p>
<p class="m-0 text-[8.4pt] font-semibold leading-[1.18]">
Atuação na Câmara Federal
</p>
</div>
</div>
</section>
<section class="mt-[4.5mm] grid grid-cols-[1.15fr_.85fr] gap-[4mm]">
<div>
<p class="section-label">E mais</p>
<h2
class="m-0 border-b-[.3mm] border-line pb-[1.5mm] text-[13pt] font-semibold leading-none"
>
Outros registros confirmados
</h2>
<div class="mt-[3mm] grid grid-cols-2 gap-x-[5mm] gap-y-[2.8mm]">
<p class="more-item mb-0">
<strong>Audiência:</strong> pauta e encaminhamento documentados.
</p>
<p class="more-item mb-0">
<strong>Articulação:</strong> participantes e resultado confirmado.
</p>
<p class="more-item mb-0">
<strong>Segmento:</strong> alcance compartilhado, sem somar.
</p>
<p class="more-item mb-0">
<strong>Registro:</strong> nome oficial e ano conferidos.
</p>
</div>
</div>
<aside class="lacuna-panel rounded-sm p-[4mm]">
<div class="flex items-start gap-[2.5mm]">
<svg
class="mt-[.4mm] h-5 w-5 shrink-0 text-warning"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
>
<path
d="M10.3 2.9 1.8 17a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 2.9a2 2 0 0 0-3.4 0Z"
/>
<path d="M12 9v4M12 17h.01" />
</svg>
<div>
<p class="m-0 text-[10.5pt] font-extrabold">
A página termina com espaço — de propósito.
</p>
<p class="mb-0 mt-[2mm] text-[8.7pt] leading-[1.35]">
Não repetir item, ampliar efeito nem preencher com ação de segmento ou rede como
se fosse entrega da área inteira.
</p>
</div>
</div>
<div
class="mt-[4mm] border-t border-[#d8bb8d] pt-[3mm] text-[7.5pt] font-bold uppercase leading-[1.35] tracking-[.055em]"
>
Poucos fatos com lastro &gt; página cheia sem lastro
</div>
</aside>
</section>
<section class="mt-[6mm] grid grid-cols-[1fr_48mm] gap-[4mm]">
<div class="rounded-sm border border-line bg-wash p-[4mm]">
<p class="section-label">Nota de produção</p>
<p class="m-0 text-[9.2pt] leading-[1.38] text-ink-soft">
Se surgirem novos fatos, entram por relevância — até seis destaques e até quatorze
itens. Ausência nunca vira zero, percentual ou afirmação genérica.
</p>
</div>
<div
class="asset-box flex min-h-[28mm] items-center justify-center rounded-sm p-[3mm] text-center"
>
<p class="m-0 text-[7.1pt] leading-[1.3]">
<strong class="uppercase tracking-[.06em]">NEEDS ASSET · selo</strong
><br />identidade autorizada<br />arquivo vetorial
</p>
</div>
</section>
<footer class="mt-auto border-t-[.35mm] border-line pt-[2.2mm]">
<div class="flex items-end justify-between gap-[5mm]">
<div>
<p class="mb-[.8mm] text-[7.2pt] font-semibold leading-[1.25] text-accent">
Conteúdo selecionado do dossiê temático Educação.
</p>
<p class="m-0 max-w-[144mm] text-[7.3pt] leading-[1.28] text-ink-soft">
<strong class="text-warning">Controle editorial:</strong> fase acompanha cada
valor · segmento e rede não são somados à área · sem percentual estadual absoluto
· defeso 2026.
</p>
</div>
<p
class="m-0 shrink-0 text-right text-[7.2pt] font-semibold leading-[1.3] text-ink-soft"
>
MODELO · INSUMO INTERNO<br />A4 · página 1/1
</p>
</div>
</footer>
</article>
</section>
</main>
</body>
</html>

File diff suppressed because it is too large Load diff

View file

@ -0,0 +1,116 @@
# Dossiê Solla por tema/área + Boletim modelo (skill → dossiê + boletim)
Status: rascunho
Atualizado em: 2026-09-18
Issue: #1143
Priority: P2
Impeccable: C — fluxo novo (dossiê por área + Boletim modelo; mesma família visual dos dossiês C186/C187, com identificação de área própria)
Design UI: `docs/plans/dossie-solla-tema-ui-design.html` + `docs/plans/dossie-solla-tema-boletim-ui-design.html` — variante de área da família C187, a produzir pelo `designer`; se o gate julgar o delta pequeno, documentar o delta no par do C187 em vez de novos arquivos (decisão a confirmar no gate)
Appetite: ~2–3 dias eng; um outcome verificável — rodar `/dossie-solla-tema Educação` e obter PDF A4 + companion `.md` (seções por era, números com fonte, lacunas) **e** o PDF do Boletim modelo (1 página A4)
Responsável: —
## Intenção
A comunicação/mandato precisa preparar fala, artigo ou agenda por **área de política** — "o que Solla fez pela Educação", "o que fez pela Saúde" — e hoje só existem os recortes por município (`/dossie-solla-cidade`, C186) e por instituição (`/dossie-solla-instituicao`, C187). Para uma área não há de onde partir: o material está espalhado em memória, notícia solta e acervo de falas sem recorte. Este item cria a **terceira variante** da família — mesmo pipeline, mesmo rigor de fonte — cujo recorte é a **área/tema do acervo** em vez do lugar ou da entidade. É o recorte que o acervo interno serve nativamente (falas já classificadas por tema desde C153/C154), então aqui o acervo é evidência de primeira classe, não ponte. Primeiro uso: **Educação**; reusável para as demais áreas da taxonomia, em lote de 1 ou N. Além do dossiê, entrega o **Boletim Informativo modelo** (1 página A4, linguagem de eleitor) para a comunicação partir dele na peça final.
## Persona e fluxo
- **Persona / contexto:** equipe de comunicação/mandato de Solla, na mesa, preparando material de uma área (ex.: pronunciamento sobre Educação, agenda com o setor); sem tempo de garimpo e obrigada a não afirmar sem lastro.
- **Job principal:** numa invocação, obter (1) um **dossiê datado e com fonte** de tudo o que Solla fez pela área ao longo da carreira — com números sempre que existirem e lacunas explícitas — e (2) um **boletim modelo de 1 página**, em linguagem de eleitor, sintetizando essas entregas.
- **Fluxo desejado:** pede `/dossie-solla-tema Educação` (ou lote) → o orquestrador resolve o token nas áreas canônicas do acervo, dispara pesquisadores (um por era da carreira) em paralelo, roda a extração read-only do acervo **por tema direto** e monta os PDFs (+ `.md`) no layout desenhado pelo `designer` → a comunicação lê a linha do tempo, escolhe o que entra na fala/o que vira boletim, confere as fontes; lacunas ficam explícitas; falha de uma área não cancela o lote.
- **Anti-goals de produto:** inventar área/slug fora da taxonomia; inferir área de emenda/proposição sem fonte; virar dashboard de área; substituir ou duplicar os recortes cidade/instituição; somar temas ou segmentos como se fossem a área; publicar/veicular peça pelo pipeline (defeso 2026); persistir dado novo na base; segundo pipeline irmão em vez de estender o dono; o boletim introduzir fato que o dossiê não tem com fonte.
### Esboço de fluxo (C)
```text
[pede: /dossie-solla-tema Educação, Saúde] → [orquestrador resolve o token nas áreas do acervo]
→ token desconhecido → fail-closed (mensagem acionável ou --slug/--name one-off)
→ [1 researcher por era (A/B/C) por área, em paralelo] ───────┐
→ [extração read-only do acervo por Speech.topics (serializada)] ─┼→ [build local: HTML do designer → PDF dossiê + .md + boletim]
→ [summary: ok|failed + recibo curto por área/era] ───────────┘
→ [comunicação escolhe o que entra na fala, confere fonte; lacunas explícitas]
```
### Design UI (C)
- Design UI (gate) — dossiê: `docs/plans/dossie-solla-tema-ui-design.html` (variante de área da família `dossie-solla-instituicao-ui-design.html`) — capa/identificação da área (label + valor canônico), resumo, seções por era, tabelas e lacunas; produzido pelo `designer` **antes** do build e portado pela implementação.
- Design UI (gate) — boletim modelo: `docs/plans/dossie-solla-tema-boletim-ui-design.html` — variante de área do boletim de instituição (o mais completo da família), 1 página A4, público eleitor.
## Objetivo e aceite
- Com uma área, sai um par **PDF A4 datado + companion `.md`** com: identificação da área (label `Educação` + valor canônico `educacao` + nota da taxonomia do acervo); vínculo histórico de Solla com a área por **era A** (até 2006), **B** (2007–2014) e **C** (2015–2027); resumo de uma olhada; o que Solla fez pela área (emendas e recursos, proposições/relatorias, programas/projetos, articulação/audiências, títulos) em tabelas **Objeto/Valor/Ano/Fase/Abrangência/Fonte**; painel de abrangência; **evidência direta do acervo por tema** (`Speech.topics`); fontes e limites; nota de defeso.
- Com a mesma área, sai também o **Boletim Informativo modelo**: **1 página A4**, linguagem de público eleitor, **≤6 destaques** + **"E mais" com ≤14 itens** (teto de lista ajustado ao comprimento do rótulo, como no dono), rótulo **"Modelo — insumo interno"**, **sem declaração de fontes**, **sem CTA/propaganda**; herda **apenas fatos já com fonte** do dossiê.
- **Primeiro uso real é o aceite de produto:** `/dossie-solla-tema Educação` produz dossiê + boletim utilizáveis pela comunicação.
- **Toda afirmação não trivial tem fonte visível** (URL + data); o que não foi achado vira **lacuna explícita** — nunca inferência. **Números sempre que a fonte informar**, sempre com a fase.
- Lote de 1+N áreas funciona; **falha de uma não cancela as demais** (sucesso parcial explícito). Token fora da taxonomia **falha fechado** com mensagem acionável, nunca slug inventado.
- Pesquisa roda em **sub-agente por era, por área, em paralelo**; o orquestrador agrega **apenas recibos curtos** e serializa a extração read-only.
- O layout vem do artefato hi-fi do `designer` (fonte de verdade do port), não inventado na implementação.
- **Nada some e nada é cortado** (regra do dono, entregue no C188): folhas correntes sem caps, lista capada declara "e mais N", sem descarte silencioso.
- Guardrails de produto: "sem fonte, não publica"; **empenho ≠ pagamento**; **abrangência explícita e nunca somada**; leitura relativa (nunca % estadual absoluto); acervo cobre **2011+** (pré-2011 = lacuna); PII mínima; artefato **gitignored**; defeso; **sem schema/migration/DB write**.
## Dados (intenção)
- **Vou apresentar dados?** Sim, superfície neste item — dossiê e boletim são documentos de dados (números com fonte, séries por era, painel do acervo, lacunas).
- **Decisões desbloqueadas:** a comunicação escolhe **o que entra na fala/agenda** da área; **qual entrega** priorizar; onde há **entrega documentada × só intenção**; **qual lacuna** buscar antes do compromisso.
- **Forma:** _adiada ao plano de implementação_ — aqui só restrições de produto: fase rotulada por valor; abrangência rotulada em cada linha; empenho nunca tratado como pago; sem % estadual absoluto; lacuna explícita em vez de silêncio; ruído eleitoral fora.
## Dados da decisão (literais)
- **Nome e artefatos (verbatim):** skill `.agents/skills/dossie-solla-tema/SKILL.md`; command `.opencode/commands/dossie-solla-tema.md`; subagentes `.opencode/agent/dossie-solla-tema.md` (researcher) + `dossie-solla-tema-redacao.md` (redator); build entry + libs reusando/estendendo o dono (`scripts/lib/dossieUnit.mjs`, `scripts/lib/dossie*.mjs`, `scripts/lib/reportText.mjs`).
- **Token canônico = área do acervo (verbatim, os 18 de `src/lib/speechFacets.ts:14`):** `saude`, `educacao`, `cultura`, `esporte`, `seguranca-publica`, `meio-ambiente`, `economia-trabalho`, `direitos-humanos`, `infraestrutura`, `ciencia-tecnologia`, `politica-instituicoes`, `agricultura`, `habitacao-cidades`, `comunicacao-midia`, `igualdade-racial`, `mulheres-genero`, `juventude`, `pessoa-deficiencia`; labels pt-BR correspondentes (ex.: **`educacao` → "Educação"**). Primeiro uso: **`educacao` / Educação**.
- **Recorte do acervo (verbatim):** por **`Speech.topics` direto** (filtro de acervo em `src/utilities/speech/speechListFilters.ts:43`) — **não** o mapa tema→instituição do C187; emendas/proposições por área: Câmara/Portal **não filtram por área** — atribuição **só com fonte**; sem atribuição → lacuna (nunca zero silencioso).
- **Eras (verbatim, reusar as do C186/C187):** **A** até 2006; **B** 2007–2014 (SESAB); **C** 2015–2027 (deputado federal). Acervo cobre 2011+; pré-2011 é lacuna explícita.
- **Fases de valor (verbatim):** `autorizado | empenhado | liquidado | pago | restos` (default `nao_informado`).
- **Abrangência (proposta — questão em aberto):** `area | segmento | rede` — `area` (a política como um todo), `segmento` (ex.: básica/superior/EJA/profissional), `rede` (entidades/escolas/universidades da área); default `area`; recortes **nunca somados**. Alternativa registrada: reusar `instituicao|setor|rede` do C187 (menos aderente).
- **Boletim modelo (literais):** **1 página A4**; **≤6 destaques** + **"E mais" ≤14 itens** (o dono ajusta o limite ao comprimento do rótulo: cidade 12, instituição 10); **sem fontes**; **sem CTA**; rótulo **"Modelo — insumo interno"**; nota de defeso; `NEEDS ASSET` para foto/selo/clipping.
- **Saídas (rotas):** `docs/research/dossie-solla-tema/<slug>-<YYYY-MM-DD>-dossie.pdf` + `-dossie.md` + `-boletim.pdf`; intermediários e JSONs de pesquisa em `data/dossie-solla-tema/`; **ambos gitignored** (blocos por recorte no `.gitignore`).
- **Lote (verbatim):** vírgula, `trim`, descarte de vazio, **dedup após resolução** preservando ordem; token inválido/ambíguo = falha isolada no summary; escape one-off `--slug=<x> --name="<Nome>"`; nunca slug inventado.
- **Guardrails (verbatim):** sem fonte não publica; empenho ≠ pagamento; abrangência explícita (nunca somar); leitura relativa; lacuna explícita; PII mínima; artefato gitignored; defeso 2026; sem schema/migration; falha isolada no lote.
## Direção no codebase (hipótese)
- **Áreas prováveis:** o seam de unidades `scripts/lib/dossieUnit.mjs` (terceira unidade, ao lado de município/instituição), `dossieResearch.mjs` (`CHECKLIST_BY_UNIT` por era orientada a área), dispatch em `dossieBlocks.mjs`, `dossieRender.mjs`/`dossieBulletin*.mjs` (identificação e copy da área), novo builder `scripts/build-dossie-solla-tema.mjs` reusando `buildPdf.mjs`/`dossiePack.mjs`; snapshot do acervo por tema reusando a receita read-only do dono (sem catálogo novo — o "catálogo" é `SPEECH_TOPICS`); `.agents/skills/`, `.opencode/commands|agent/`.
- **Precedente a olhar:** C186/C187 (`docs/plans/dossie-solla-instituicao.md` + `-impl.md`, skills/commands/agents irmãos, `scripts/lib/dossie*.mjs`); `src/lib/speechFacets.ts` + `src/utilities/speech/speechListFilters.ts` como resolução canônica do token.
- **Risco de acoplamento:** **"edite o dono, não gema um irmão"** — default município/instituição intactos, tudo unit-aware; registrar o command em `tests/unit/opencodeCommands.unit.spec.ts` e pinar os módulos novos em `scripts/lib/test-affected-core.mjs` (`SCRIPTS_SPEC_PINNED`); specs próprias espelhando `tests/unit/dossieInstitution*.spec.ts`; sem schema/migration; extração read-only à produção (guard).
## Dependências
- **Hard:** nenhuma — pipeline C186/C187 e infra Chromium/PDF já existem; o `designer` produz o layout.
- **Soft:** **C189 (#1139, OPEN/blocked)** — débitos de truncamento/paridade no **mesmo dono** que este item estende: se tocar o pipeline antes, não reintroduzir caps nem corte mecânico; a área nasce sob a regra do C188 ("nada some, nada é cortado").
- **Soft:** acesso read-only ao acervo Teqo (guard de confirmação); pesquisa web datada (sem `PORTAL_TRANSPARENCIA_API_KEY` — o Portal não filtra por área).
## Fora de escopo
- Redigir/aprovar/veicular a peça final — a skill entrega dossiê + **boletim modelo**.
- Dashboard/painel interativo de área; UI in-app de campanha; índice/PDF agregado de lote.
- Gerar as 18 áreas de uma vez; área composta (multi-tema num mesmo dossiê) — cada token é um dossiê.
- Substituir/alterar `/dossie-solla-cidade`, `/relatorio-cidade` ou `/dossie-solla-instituicao`.
- Persistir dado novo, schema ou migration; re-taxonomizar o acervo; inferir área de emendas/proposições sem fonte.
## Rabbit holes de produto
- **"Cobrir a área inteira vira escopo infinito."** Se alguém "só completar": Educação = tudo. **Corte neste item:** eras fixas A/B/C + checklist por era + foco em fonte verificável.
- **"Somar temas/segmentos como se fossem a área."** **Corte neste item:** abrangência explícita por linha, sem total combinado.
- **"IA plausível sem fonte."** **Corte neste item:** sem fonte não publica; lacuna explícita; número só com URL+data e fase.
- **"Emenda da área = zero silencioso."** **Corte neste item:** sem atribuição checada, vira lacuna — nunca zero nem soma estimada.
- **"Fan-out das 18 áreas."** **Corte neste item:** 1 token = 1 dossiê; lote só o pedido explicitamente.
- **"Vira recorte territorial/instituição."** **Corte neste item:** território e entidade não viram eixo de soma na área (menção fica na evidência/fonte).
## Questões em aberto (produto)
- **Nome da skill: `tema` ou `area`?** **Opções:** A) `dossie-solla-tema` | B) `dossie-solla-area`. **Recomendação:** A — alinha com a taxonomia existente do acervo (`SPEECH_TOPICS`/`Speech.topics`, "tema") e com o pedido do humano ("categoria/campo"). _(assumido — validar)_
- **Abrangência da área?** **Opções:** A) `area | segmento | rede` | B) reusar `instituicao | setor | rede` do C187 | C) só `area`. **Recomendação:** A — preserva o guardrail de não somar com vocabulário que faz sentido para área. _(assumido — validar)_
- **Incluir recorte territorial?** **Opções:** A) não como eixo (só menção na evidência) | B) painel por município. **Recomendação:** A — território é o recorte do `/dossie-solla-cidade`; evita eixo de soma duplicado.
- **Design: novo hi-fi ou delta documentado?** **Opções:** A) novo par `dossie-solla-tema-{ui,boletim-ui}-design.html`, variante da família instituição | B) delta documentado no par do C187. **Recomendação:** A — capa/identificação e boletim mudam; a variante evita arrastar labels de instituição; confirmar no gate se o delta for pequeno.
- **Área composta (ex.: Educação + Ciência e Tecnologia)?** **Opções:** A) fora (1 token = 1 dossiê; lote = vários) | B) permitir combinar. **Recomendação:** A — mantém o fail-closed e o recorte legível. _(assumido)_
## Referências
- GitHub Issue #1143
- Irmãos: `docs/plans/dossie-solla-instituicao.md` (C187, #1135) + `dossie-solla-instituicao-impl.md`; `docs/plans/dossie-solla-cidade.md` (C186, #1132); débitos `docs/plans/relatorios-sem-truncamento.md` (C188, #1136) e issue #1139 (C189, OPEN/blocked)
- Skills/commands/agents-modelo: `.agents/skills/dossie-solla-instituicao/SKILL.md`, `.opencode/commands/dossie-solla-instituicao.md`, `.opencode/agent/dossie-solla-instituicao.md` + `-redacao.md`
- Builder/libs donos: `scripts/build-dossie-solla-instituicao.mjs`, `scripts/lib/dossieUnit.mjs`, `scripts/lib/dossie{Research,Blocks,Render,Bulletin,BulletinRender,Pack}.mjs`, `scripts/lib/buildPdf.mjs`
- Taxonomia/recorte: `src/lib/speechFacets.ts` (18 temas), `src/utilities/speech/speechListFilters.ts` (`topics`), `src/utilities/speech/speechListUrl.ts`
- Designs hi-fi irmãos (fonte da variante): `docs/plans/dossie-solla-instituicao-ui-design.html` + `docs/plans/dossie-solla-instituicao-boletim-ui-design.html` — atualizados em `5644a9f9` (a nota "desatualizados" na SKILL do C187 está stale; não repetir o passe)
- Testes a espelhar: `tests/unit/dossieInstitution{,.unit,Research,BatchSkill}*.spec.ts`, `tests/unit/dossie*.unit.spec.ts`, `tests/unit/opencodeCommands.unit.spec.ts`; pino `scripts/lib/test-affected-core.mjs`
- `AGENTS.md` — defeso, PII mínima, artefato gitignored e "edite o dono, não gema um irmão"