Refactor code structure for improved readability and maintainability

DESIGN.md

@@ -1,4 +1,4 @@
-# Diretrizes de tema — claro e escuro
+# Diretrizes de tema: claro e escuro
 
 Regras para manter os dois temas consistentes. Não tratam da identidade visual
 (degradê da marca, arredondamentos, hierarquia): essas decisões já estão tomadas
@@ -10,7 +10,7 @@ e não mudam.
 
 A escala do Tailwind anda de 100 em 100: `50, 100, 200, 300 … 900, 950`.
 Os meios-tons (`150, 250, 350, 450, 550, 650, 750, 850`) **não existem por
-padrão** — uma classe como `text-slate-350` não gera CSS nenhum, e o elemento
+padrão**. Uma classe como `text-slate-350` não gera CSS nenhum, e o elemento
 herda silenciosamente a cor do pai. Era a causa da maior parte das
 inconsistências: o mesmo texto ficava certo num tema e lavado no outro.
 
@@ -38,9 +38,9 @@ classe com um valor que não está na escala.
 No tema escuro o fundo é escuro, então o texto precisa **clarear**.
 
 - **Texto:** o número do `dark:` é sempre **menor** que o do claro.
-  `text-slate-800 dark:text-slate-200` ✅ — `text-slate-400 dark:text-slate-500` ❌
+  `text-slate-800 dark:text-slate-200` ✅ · `text-slate-400 dark:text-slate-500` ❌
 - **Fundo e borda:** o número do `dark:` é sempre **maior**.
-  `bg-white dark:bg-slate-900` ✅ — `border-slate-200 dark:border-slate-800` ✅
+  `bg-white dark:bg-slate-900` ✅ · `border-slate-200 dark:border-slate-800` ✅
 
 Um par invertido não quebra o build e não aparece em revisão de código: só
 enfraquece o contraste justamente onde ele deveria aumentar. Havia 71 deles.
@@ -63,7 +63,7 @@ elemento gráfico, **3:1**.
 | Menor ênfase | `text-slate-500 dark:text-slate-450` | 4.8 | 5.2 |
 
 `text-slate-500 dark:text-slate-400` é o par mais usado do projeto (100
-ocorrências) — é o rótulo em caixa alta, a legenda, o texto de apoio.
+ocorrências): é o rótulo em caixa alta, a legenda, o texto de apoio.
 
 **Não use** `slate-400` como cor de texto no tema claro: sobre branco dá 2.56:1.
 Era o erro mais repetido.
@@ -72,7 +72,7 @@ Era o erro mais repetido.
 
 ## 4. Exceção: superfícies escuras nos dois temas
 
-Alguns blocos são escuros independente do tema — painéis de CTA com degradê,
+Alguns blocos são escuros independente do tema: painéis de CTA com degradê,
 bloco de código, tooltip do diagrama de pinos. Dentro deles:
 
 - **Não use variante `dark:`.** O fundo não muda, então o texto também não deve.
@@ -101,11 +101,11 @@ aparência entre os temas. Botão carrega a **própria cor**, igual nos dois tem
 
 | Papel | Classe | Contraste com texto branco |
 |-------|--------|---------------------------|
-| Ação principal | `bg-gradient-to-r from-purple-600 to-indigo-600 text-white` | 5.4 – 6.3 |
+| Ação principal | `bg-gradient-to-r from-purple-600 to-indigo-600 text-white` | 5.4 a 6.3 |
 | Ação secundária | `bg-blue-600 hover:bg-blue-700 text-white` | 5.2 |
-| Ação terciária | `bg-white dark:bg-slate-900` + borda + texto neutro | — |
+| Ação terciária | `bg-white dark:bg-slate-900` + borda + texto neutro | · |
 
-Como a cor é a mesma nos dois temas, o texto branco também é — sem variante
+Como a cor é a mesma nos dois temas, o texto branco também é, sem variante
 `dark:`. Isso vale inclusive dentro de painel escuro: o botão de gradiente
 funciona sobre fundo claro e escuro.
 
@@ -130,17 +130,17 @@ Com o conteúdo pareado: título `text-slate-900 dark:text-white`, corpo
 
 ## 4.3. Separação de superfície no tema claro
 
-Entre near-whites o contraste é sempre baixo — quem separa o card do fundo é a
+Entre near-whites o contraste é sempre baixo. Quem separa o card do fundo é a
 **borda**, não o fundo. Por isso:
 
 | Camada | Valor | Contraste |
 |--------|-------|-----------|
-| Fundo da página | `from-slate-100 via-slate-50 to-purple-100/40` | — |
+| Fundo da página | `from-slate-100 via-slate-50 to-purple-100/40` | · |
 | Card | `bg-white` (sólido, sem `/70` ou `/80`) | 1.10 vs fundo |
 | Borda do card | `border-slate-300` | 1.48 vs card |
 | Divisória interna | `border-slate-200` | mais sutil |
 
-`border-slate-200/60` sobre card branco dava 1.14 — imperceptível. Não use borda
+`border-slate-200/60` sobre card branco dava 1.14, praticamente imperceptível. Não use borda
 com opacidade para delimitar card.
 
 ---
@@ -155,12 +155,12 @@ Cada série tem sua cor em [`public/series.json`](public/series.json) (campo
 ```
 
 Esses valores são iguais nos dois temas. Ao usá-los como **fundo**, mantenha o
-alfa baixo (`18`–`30` em hex) para que funcione sobre superfície clara e escura.
+alfa baixo (de `18` a `30` em hex) para que funcione sobre superfície clara e escura.
-Como **texto**, só sobre superfície neutra — nunca sobre outra cor de série.
+Como **texto**, só sobre superfície neutra, nunca sobre outra cor de série.
 
 ### Nunca escreva cor fixa em `style` inline
 
-`style` inline vence qualquer classe — inclusive as variantes `dark:` e
+`style` inline vence qualquer classe, inclusive as variantes `dark:` e
 `hover:`, que deixam de existir para aquele elemento. Só cor **vinda do dado**
 pode ir no inline.
 
@@ -178,7 +178,7 @@ style={{ borderColor: isSelected ? serie.cor : undefined }}
 
 Esse bug é traiçoeiro porque **some depois do primeiro hover**: o
 `onMouseLeave` faz `style.borderColor = ''`, que apaga o inline e devolve o
-controle à classe. A borda passa a aparecer e nunca mais some — dando a
+controle à classe. A borda passa a aparecer e nunca mais some, dando a
 impressão de que só falha "antes de passar o mouse".
 
 ---

app/comparacao/page.jsx

@@ -154,7 +154,7 @@ export default function Comparacao() {
 
 	const renderValue = (value) => {
 		if (!value || value === "Não") {
-			return <span className="text-slate-500 dark:text-slate-400 font-medium select-none">—</span>;
+			return <span className="text-slate-500 dark:text-slate-400 font-medium select-none">Não</span>;
 		}
 		if (value === "Sim") {
 			return (

app/globals.css

@@ -13,8 +13,8 @@
 	   Meios-tons de slate.
 
 	   A escala do Tailwind anda de 100 em 100 (50, 100, 200 ... 950), então
-	   classes como text-slate-350 ou border-slate-850 — usadas em ~190 pontos
+	   classes como text-slate-350 ou border-slate-850, usadas em cerca de 190
-	   do projeto — não geravam CSS nenhum: o elemento herdava a cor do pai e
+	   pontos do projeto, não geravam CSS nenhum: o elemento herdava a cor do pai e
 	   ficava diferente em cada tema, sem padrão.
 
 	   Cada valor abaixo é o ponto médio exato entre os dois degraus oficiais

app/glossario/page.jsx

@@ -41,7 +41,7 @@ export default function Glossario() {
                 },
                 {
                     termo: "Aceleradores Criptográficos",
-                    definicao: "Blocos de hardware dedicados que executam algoritmos de criptografia muito mais rápido e com menor consumo do que a CPU. Praticamente toda série tem algum, mas o conjunto varia bastante — por isso vale olhar item por item.",
+                    definicao: "Blocos de hardware dedicados que executam algoritmos de criptografia muito mais rápido e com menor consumo do que a CPU. Praticamente toda série tem algum, mas o conjunto varia bastante, por isso vale olhar item por item.",
                     exemplo: "ESP32-C2 e ESP32-C61 não têm acelerador AES: só SHA e curvas elípticas.",
                 },
                 {
@@ -51,7 +51,7 @@ export default function Glossario() {
                 },
                 {
                     termo: "ECDSA",
-                    definicao: "Algoritmo de assinatura digital baseado em curvas elípticas. Ter o periférico ECDSA no silício significa assinar e verificar sem carregar a CPU — é o que o Matter exige para o atestado de dispositivo.",
+                    definicao: "Algoritmo de assinatura digital baseado em curvas elípticas. Ter o periférico ECDSA no silício significa assinar e verificar sem carregar a CPU. É o que o Matter exige para o atestado de dispositivo.",
                     exemplo: "Só ESP32-S31, C5, C61, P4, H2 e H4 têm ECDSA em hardware.",
                 },
                 {

app/seletor/page.jsx

@@ -386,7 +386,7 @@ export default function Seletor() {
 			if (answers.security === "matter") {
 				if (temECDSA) {
 					scores[key] += 30;
-					reasons[key].push(`ECDSA em hardware (${seg.ecc}) — atestado de dispositivo Matter assinado sem custo de CPU`);
+					reasons[key].push(`ECDSA em hardware (${seg.ecc}): atestado de dispositivo Matter assinado sem custo de CPU`);
 				} else if (temECC) {
 					scores[key] += 10;
 					reasons[key].push(`Tem ECC (${seg.ecc}) mas não o periférico ECDSA: a assinatura roda parcialmente em software`);

app/series/[key]/page.jsx

@@ -100,11 +100,11 @@ export default async function SerieDetail({ params }) {
 	];
 
 	const ferramentasSpecs = [
-		{ label: "ESP-IDF mínimo", value: serie.esp_idf_minimo || "—", icon: <Code className="w-5 h-5 text-amber-500" /> },
+		{ label: "ESP-IDF mínimo", value: serie.esp_idf_minimo || "Não informado", icon: <Code className="w-5 h-5 text-amber-500" /> },
-		{ label: "Core Arduino", value: serie.arduino_core || "—", icon: <Terminal className="w-5 h-5 text-amber-500" /> },
+		{ label: "Core Arduino", value: serie.arduino_core || "Não informado", icon: <Terminal className="w-5 h-5 text-amber-500" /> },
-		{ label: "Depuração", value: serie.depuracao || "—", icon: <Bug className="w-5 h-5 text-amber-500" /> },
+		{ label: "Depuração", value: serie.depuracao || "Não informado", icon: <Bug className="w-5 h-5 text-amber-500" /> },
-		{ label: "Encapsulamento", value: serie.encapsulamento || "—", icon: <Box className="w-5 h-5 text-amber-500" /> },
+		{ label: "Encapsulamento", value: serie.encapsulamento || "Não informado", icon: <Box className="w-5 h-5 text-amber-500" /> },
-		{ label: "Módulos disponíveis", value: serie.modulos || "—", icon: <Package className="w-5 h-5 text-amber-500" /> },
+		{ label: "Módulos disponíveis", value: serie.modulos || "Não informado", icon: <Package className="w-5 h-5 text-amber-500" /> },
 	];
 
 	const conectividadeSpecs = [

app/series/page.jsx

@@ -126,7 +126,7 @@ export default function Series() {
 												</div>
 												<span className="font-bold text-slate-800 dark:text-slate-200">
 													{String(serie.wifi).includes("Não") ? (
-														<span className="text-slate-500 dark:text-slate-400">—</span>
+														<span className="text-slate-500 dark:text-slate-400">Não</span>
 													) : (
 														<span className="text-emerald-500 dark:text-emerald-400 font-extrabold">Sim</span>
 													)}
@@ -140,7 +140,7 @@ export default function Series() {
 												</div>
 												<span className="font-bold text-slate-800 dark:text-slate-200">
 													{serie.bluetooth === "Não" ? (
-														<span className="text-slate-500 dark:text-slate-400">—</span>
+														<span className="text-slate-500 dark:text-slate-400">Não</span>
 													) : (
 														<span className="text-indigo-500 dark:text-indigo-400 font-extrabold">Sim</span>
 													)}

app/sobre/page.jsx

@@ -100,7 +100,7 @@ export default function Sobre() {
 							</div>
 							<p className="text-slate-650 dark:text-slate-350 leading-relaxed mb-6 font-semibold text-sm">
 								As informações sobre os microcontroladores ESP32 muitas vezes estão dispersas em datasheets densos, 
-								manuais de referência (TRM), repositórios secundários e documentação técnica — tudo inteiramente em inglês. 
+								manuais de referência (TRM), repositórios secundários e documentação técnica, tudo inteiramente em inglês. 
 								O ESPDocs condensa e estrutura esses dados, auxiliando na triagem rápida antes de aprofundar na engenharia oficial.
 							</p>
 

components/CodeExample.jsx

@@ -77,7 +77,7 @@ export default function CodeExample({ framework }) {
 						<Code className="w-5 h-5" style={{ color }} />
 						<span>Demonstração de Código</span>
 					</h3>
-					<p className="text-xs text-slate-500 dark:text-slate-400 font-semibold">Trecho de inicialização rápida — copie e personalize em seu projeto.</p>
+					<p className="text-xs text-slate-500 dark:text-slate-400 font-semibold">Trecho de inicialização rápida. Copie e personalize em seu projeto.</p>
 				</div>
 
 				<div className="flex flex-wrap items-center gap-2.5 mt-4 md:mt-0 select-none">

components/PinRestrictions.jsx

@@ -13,7 +13,7 @@ import {
 /**
  * Restrições de pinos por série.
  *
- * Os grupos são DERIVADOS de public/conexoes/<serie>.json — o mesmo arquivo que
+ * Os grupos são DERIVADOS de public/conexoes/<serie>.json, o mesmo arquivo que
  * alimenta o diagrama de conexões. Nada aqui é escrito à mão, então a seção e o
  * diagrama nunca divergem: corrigir um pino no JSON corrige os dois.
  */
@@ -25,7 +25,7 @@ const GRUPOS = [
 		icone: ArrowDownToLine,
 		cor: "text-sky-500",
 		explicacao:
-			"Aceitam apenas leitura. Não podem ser configurados como saída e não possuem resistores de pull-up ou pull-down internos — se precisar de um, coloque no circuito.",
+			"Aceitam apenas leitura. Não podem ser configurados como saída e não possuem resistores de pull-up ou pull-down internos. Se precisar de um, coloque no circuito.",
 		combina: (avisos) => /apenas de entrada|input only/.test(avisos),
 	},
 	{
@@ -45,7 +45,7 @@ const GRUPOS = [
 		icone: Power,
 		cor: "text-amber-500",
 		explicacao:
-			"O chip lê o nível destes pinos no instante do reset para decidir como inicializar. Dá para usá-los depois do boot, mas o circuito externo não pode forçar o nível errado durante o reset — senão a placa não inicia ou entra em modo de gravação sozinha.",
+			"O chip lê o nível destes pinos no instante do reset para decidir como inicializar. Dá para usá-los depois do boot, mas o circuito externo não pode forçar o nível errado durante o reset, senão a placa não inicia ou entra em modo de gravação sozinha.",
 		combina: (avisos, cats) =>
 			cats.includes("Strapping") ||
 			/strapping|modo de boot|modo de inicialização/.test(avisos),
@@ -65,7 +65,7 @@ const GRUPOS = [
 		icone: Usb,
 		cor: "text-teal-500",
 		explicacao:
-			"Saem de fábrica ligados ao USB Serial/JTAG interno. Para usá-los como GPIO é preciso desativar essa função — o que também remove a gravação por USB direto.",
+			"Saem de fábrica ligados ao USB Serial/JTAG interno. Para usá-los como GPIO é preciso desativar essa função, o que também remove a gravação por USB direto.",
 		combina: (avisos) => /usb serial\/jtag|usb_d[+-]/.test(avisos),
 	},
 	{
@@ -118,7 +118,7 @@ export default function PinRestrictions({ conexoes, serieKey, cor }) {
 
 			<p className="text-sm text-slate-650 dark:text-slate-350 leading-relaxed mb-8">
 				Nem todo pino do {serieKey} está livre para uso geral. {totalPinos} deles têm alguma
-				condição — já estão ocupados por memória, são lidos durante o boot ou só funcionam
+				condição: já estão ocupados por memória, são lidos durante o boot ou só funcionam
 				como entrada. Vale conferir antes de fechar o esquemático.
 			</p>
 

components/SeriesTabMenu.jsx

@@ -9,7 +9,7 @@ export default function SeriesTabMenu({ tabs, color }) {
 
 	// Troca manual limpa o hash. Sem isso, depois de abrir o diagrama pelo link e
 	// mudar de aba na mão, o hash continuaria em #connections e um novo clique no
-	// link não dispararia hashchange — o botão pareceria quebrado.
+	// link não dispararia hashchange e o botão pareceria quebrado.
 	const trocarAba = (id) => {
 		setActiveTab(id);
 		if (window.location.hash) {

public/apostilas/1/.next/trace

@@ -0,0 +1 @@
+[{"name":"generate-buildid","duration":224,"timestamp":13103889101,"id":4,"parentId":1,"tags":{},"startTime":1787229898989,"traceId":"aad4d6d36b5e5e6b"},{"name":"load-custom-routes","duration":309,"timestamp":13103889458,"id":5,"parentId":1,"tags":{},"startTime":1787229898989,"traceId":"aad4d6d36b5e5e6b"},{"name":"next-build","duration":129948,"timestamp":13103762107,"id":1,"tags":{"buildMode":"default","isTurboBuild":"false","version":"15.5.9"},"startTime":1787229898862,"traceId":"aad4d6d36b5e5e6b"}]

public/apostilas/assets/apostila.css

@@ -0,0 +1,670 @@
+/* =========================================================================
+   Sistema visual das apostilas da LASER, compartilhado por todas as edições.
+   Paginação A4 via Paged.js. Identidade da liga: prussiano, âmbar, laranja e
+   vermelho, tirados da logo oficial (laser.cin.ufpe.br).
+
+   Uma apostila nova só precisa de:
+     <link rel="stylesheet" href="../assets/apostila.css">
+     <script src="../assets/paged.polyfill.js"></script>
+   e usar as classes documentadas aqui.
+   ========================================================================= */
+
+:root {
+	/* Paleta da LASER, extraída da logo oficial (laser.cin.ufpe.br).
+	   O gradiente é o próprio "feixe" da marca. */
+	--prussiano: #003049;
+	--vermelho: #D62828;
+	--laranja: #F77F00;
+	--ambar: #FCBF49;
+	--creme: #EAE2B7;
+	/* O laranja da marca é vibrante demais para texto: 2,63:1 sobre branco.
+	   Esta versão queimada mantém a matiz e passa em AA (4,74:1). */
+	--laranja-texto: #B85800;
+
+	--tinta: #062639;
+	--tinta-2: #33566a;
+	--tinta-3: #557080;   /* 5,23:1 no branco e 4,94:1 na linha zebrada */
+	--linha: #c2d2db;
+	--linha-suave: #dde7ed;
+	--fundo-suave: #f5f9fb;
+
+	/* O feixe da marca. Use APENAS em superfície grande e decorativa: uma faixa,
+	   um traço largo, o desenho da capa. Nunca recortado em texto: cinco paradas
+	   de cor num glifo viram arco-íris e ainda quebram o contraste. */
+	--marca: linear-gradient(90deg, var(--prussiano), var(--creme), var(--ambar), var(--laranja), var(--vermelho));
+}
+
+/* -------------------------------------------------------------------------
+   1. Página A4
+   ------------------------------------------------------------------------- */
+
+@page {
+	size: A4;
+	margin: 20mm 18mm 18mm 18mm;
+
+	@bottom-left {
+		content: string(titulo-corrente);
+		font-family: "Inter", sans-serif;
+		font-size: 7.5pt;
+		color: #94a3b8;
+		padding-bottom: 4mm;
+	}
+
+	@bottom-right {
+		content: counter(page);
+		font-family: "Outfit", sans-serif;
+		font-size: 9pt;
+		font-weight: 700;
+		color: #64748b;
+		padding-bottom: 4mm;
+	}
+}
+
+/* Capa e contracapa sem cabeçalho, rodapé ou margem. */
+@page capa {
+	margin: 0;
+	@bottom-left { content: none; }
+	@bottom-right { content: none; }
+}
+
+.pagina-capa {
+	page: capa;
+	/* Sem break-after: todo .capitulo já traz break-before, e as duas juntas
+	   podem gerar uma página em branco depois da capa. */
+}
+
+/* Capa: clara e minimalista. O desenho é o feixe da LASER atravessando
+   a página. Conceitual, não decorativo. */
+.capa {
+	width: 210mm;
+	height: 297mm;
+	background: #fdfdfb;
+	color: var(--tinta);
+	display: flex;
+	flex-direction: column;
+	padding: 30mm 24mm 24mm;
+	position: relative;
+	overflow: hidden;
+}
+
+.capa-curvas {
+	position: absolute;
+	inset: 0;
+	width: 210mm;
+	height: 297mm;
+	pointer-events: none;
+}
+
+/* O desenho fica no fundo; todo o resto sobe acima dele.
+   Precisa excluir .capa-curvas: mesma especificidade sobrescreveria o absolute. */
+.capa > *:not(.capa-curvas) { position: relative; z-index: 1; }
+
+.capa-marca {
+	display: flex;
+	align-items: center;
+	gap: 4mm;
+	margin-bottom: 26mm;
+}
+
+.capa-marca img { height: 9mm; width: auto; }
+
+.capa-marca span {
+	font-size: 8pt;
+	line-height: 1.35;
+	color: var(--tinta-3);
+	border-left: 0.6pt solid var(--linha);
+	padding-left: 4mm;
+}
+
+.capa-selo {
+	font-family: "Outfit", sans-serif;
+	font-size: 8pt;
+	font-weight: 600;
+	letter-spacing: 0.22em;
+	text-transform: uppercase;
+	color: var(--laranja-texto);
+	margin-bottom: 5mm;
+}
+
+.capa-titulo {
+	font-family: "Outfit", sans-serif;
+	font-size: 42pt;
+	font-weight: 300;
+	line-height: 1.02;
+	letter-spacing: -0.025em;
+	margin: 0 0 6mm;
+	color: var(--prussiano);
+	max-width: 140mm;
+}
+
+.capa-titulo strong { font-weight: 700; }
+
+.capa-sub {
+	font-size: 11pt;
+	font-weight: 300;
+	line-height: 1.55;
+	color: var(--tinta-2);
+	max-width: 116mm;
+	text-align: left;
+	margin-bottom: 0;
+}
+
+.capa-rodape {
+	margin-top: auto;
+	display: flex;
+	justify-content: space-between;
+	align-items: flex-end;
+	gap: 8mm;
+	font-size: 8pt;
+	color: var(--tinta-3);
+	line-height: 1.6;
+	border-top: 0.6pt solid var(--linha);
+	padding-top: 5mm;
+}
+
+.capa-rodape strong {
+	color: var(--tinta);
+	font-weight: 600;
+	display: block;
+	font-size: 9pt;
+	margin-bottom: 0.8mm;
+}
+
+/* -------------------------------------------------------------------------
+   2. Base tipográfica
+   ------------------------------------------------------------------------- */
+
+* { box-sizing: border-box; }
+
+html {
+	/* Faz fundos e cores chegarem ao PDF em vez de imprimirem em branco. */
+	-webkit-print-color-adjust: exact;
+	print-color-adjust: exact;
+}
+
+body {
+	margin: 0;
+	font-family: "Inter", system-ui, -apple-system, sans-serif;
+	font-size: 10pt;
+	line-height: 1.62;
+	color: var(--tinta-2);
+	hyphens: auto;
+}
+
+p {
+	margin: 0 0 3.2mm;
+	text-align: justify;
+	/* Nunca deixa uma ou duas linhas soltas no pé nem no topo da página. */
+	orphans: 3;
+	widows: 3;
+}
+strong { color: var(--tinta); font-weight: 600; }
+
+a { color: #b34700; text-decoration: none; border-bottom: 0.6pt solid #f7c9a0; }
+
+ul, ol { margin: 0 0 3.5mm; padding-left: 5.5mm; }
+li { margin-bottom: 1.4mm; orphans: 2; widows: 2; }
+li::marker { color: var(--laranja-texto); }
+
+/* -------------------------------------------------------------------------
+   3. Capítulos e títulos
+   ------------------------------------------------------------------------- */
+
+.capitulo { break-before: page; }
+
+.capitulo-abertura {
+	display: flex;
+	align-items: flex-start;
+	gap: 5mm;
+	margin-bottom: 7mm;
+	padding-bottom: 4mm;
+	border-bottom: 2.2pt solid var(--tinta);
+}
+
+.capitulo-numero {
+	font-family: "Outfit", sans-serif;
+	font-size: 44pt;
+	font-weight: 300;          /* leve, para não competir com o título em 800 */
+	line-height: 0.8;
+	letter-spacing: -0.03em;
+	color: var(--laranja-texto);
+	flex-shrink: 0;
+	font-variant-numeric: lining-nums;
+}
+
+h1, h2, h3, h4 {
+	font-family: "Outfit", sans-serif;
+	color: var(--tinta);
+	margin: 0;
+	break-after: avoid;
+	text-align: left;
+}
+
+h2 {
+	font-size: 19pt;
+	font-weight: 800;
+	line-height: 1.1;
+	letter-spacing: -0.01em;
+	/* Alimenta o rodapé com o capítulo corrente. */
+	string-set: titulo-corrente content();
+}
+
+.capitulo-abertura .subtitulo {
+	font-family: "Inter", sans-serif;
+	font-size: 9pt;
+	font-weight: 400;
+	color: var(--tinta-3);
+	margin-top: 1.5mm;
+	line-height: 1.45;
+}
+
+h3 {
+	font-size: 12.5pt;
+	break-before: auto;
+	font-weight: 700;
+	margin: 7mm 0 2.5mm;
+	padding-left: 3mm;
+	border-left: 2.5pt solid var(--laranja);
+}
+
+h4 {
+	font-size: 10pt;
+	font-weight: 700;
+	margin: 5mm 0 2mm;
+	text-transform: uppercase;
+	letter-spacing: 0.06em;
+	color: var(--tinta-3);
+}
+
+/* -------------------------------------------------------------------------
+   3.1. Coesão entre blocos
+
+   O fragmentador quebra onde couber, e o resultado padrão separa coisas que
+   pertencem juntas: a frase que apresenta uma tabela numa página e a tabela na
+   seguinte. Estas duas classes resolvem, e devem ser usadas sempre que um
+   trecho só faz sentido lido de uma vez.
+   ------------------------------------------------------------------------- */
+
+/* Na frase que apresenta o que vem logo abaixo. Proíbe quebra logo depois dela. */
+.junto { break-after: avoid; }
+
+/* NÃO declare break-before:avoid de forma genérica (h3 + *, .junto + *).
+   Testado: o Paged.js encadeia as recusas e produz páginas com 2% de conteúdo,
+   além de partir palavras entre páginas. Para manter um título junto do que ele
+   apresenta, envolva os dois em .grupo, que usa break-inside:avoid, o único
+   controle que o fragmentador aplica de forma previsível. */
+
+/* No wrapper de um conjunto curto que precisa caber inteiro na mesma página
+   (uma introdução mais os itens que ela apresenta, por exemplo). */
+.grupo { break-inside: avoid; }
+
+/* -------------------------------------------------------------------------
+   4. Caixas de destaque
+   Cada tipo tem um papel didático fixo. Não misture.
+   ------------------------------------------------------------------------- */
+
+.caixa {
+	break-inside: avoid;
+	margin: 4.5mm 0;
+	padding: 3.5mm 4mm;
+	border-radius: 2mm;
+	border-left: 2.5pt solid var(--cor-caixa, var(--laranja));
+	background: var(--fundo-caixa, #fff8ec);
+	font-size: 9pt;
+	line-height: 1.55;
+}
+
+.caixa p { margin-bottom: 2mm; text-align: left; }
+.caixa p:last-child { margin-bottom: 0; }
+
+.caixa-titulo {
+	font-family: "Outfit", sans-serif;
+	font-weight: 800;
+	font-size: 8.5pt;
+	text-transform: uppercase;
+	letter-spacing: 0.07em;
+	color: var(--cor-caixa, var(--laranja));
+	margin-bottom: 1.5mm;
+}
+
+.caixa.atencao   { --cor-caixa: #a35a00; --fundo-caixa: #fff8ea; }
+.caixa.erro      { --cor-caixa: #b01f1f; --fundo-caixa: #fdf1f1; }
+.caixa.dica      { --cor-caixa: #0b6b52; --fundo-caixa: #eefaf5; }
+.caixa.curiosidade { --cor-caixa: #003049; --fundo-caixa: #eff6fa; }
+
+/* -------------------------------------------------------------------------
+   5. Tabelas
+   ------------------------------------------------------------------------- */
+
+table {
+	width: 100%;
+	border-collapse: collapse;
+	font-size: 8.5pt;
+	margin: 4mm 0 5mm;
+	break-inside: avoid;
+}
+
+caption {
+	caption-side: bottom;
+	font-size: 7.5pt;
+	color: var(--tinta-3);
+	text-align: left;
+	padding-top: 1.8mm;
+}
+
+thead {
+	break-inside: avoid;
+	break-after: avoid;
+	/* Repete o cabeçalho quando a tabela atravessa a página. */
+	display: table-header-group;
+}
+
+tbody tr { break-inside: avoid; }
+
+/* As tabelas de 12 linhas (uma por série) podem dividir: mantê-las inteiras
+   empurrava a tabela toda e deixava quase metade da página em branco. */
+table.compacta { break-inside: auto; }
+
+th {
+	font-family: "Outfit", sans-serif;
+	font-weight: 700;
+	font-size: 7.5pt;
+	text-transform: uppercase;
+	letter-spacing: 0.05em;
+	text-align: left;
+	color: #fff;
+	background: var(--tinta);
+	padding: 2.2mm 2.5mm;
+}
+
+td {
+	padding: 2.2mm 2.5mm;
+	border-bottom: 0.5pt solid var(--linha-suave);
+	vertical-align: top;
+}
+
+tbody tr:nth-child(even) { background: var(--fundo-suave); }
+td.destaque { font-weight: 600; color: var(--tinta); }
+td.sim { color: #0b6b52; font-weight: 600; }
+td.nao { color: var(--tinta-3); }
+
+/* -------------------------------------------------------------------------
+   6. Código
+   ------------------------------------------------------------------------- */
+
+pre {
+	break-inside: avoid;
+	margin: 4mm 0;
+	padding: 4mm 4.5mm;
+	background: #062639;
+	border-radius: 2mm;
+	color: #e2e8f0;
+	font-family: "JetBrains Mono", ui-monospace, "Courier New", monospace;
+	font-size: 8pt;
+	line-height: 1.6;
+	white-space: pre-wrap;
+	overflow-wrap: break-word;
+}
+
+code {
+	font-family: "JetBrains Mono", ui-monospace, "Courier New", monospace;
+	font-size: 8.6pt;
+	background: #f2f6f8;
+	color: #b34700;
+	padding: 0.4mm 1.2mm;
+	border-radius: 1mm;
+}
+
+pre code { background: none; color: inherit; padding: 0; font-size: inherit; }
+
+.c-com { color: #94a3b8; font-style: italic; }  /* comentário */
+.c-key { color: #c4b5fd; }                       /* palavra-chave */
+.c-fun { color: #7dd3fc; }                       /* função */
+.c-str { color: #86efac; }                       /* string */
+.c-num { color: #fdba74; }                       /* número */
+.c-pre { color: #f9a8d4; }                       /* diretiva */
+
+.legenda-codigo {
+	font-size: 7.5pt;
+	color: var(--tinta-3);
+	margin: -2.5mm 0 4mm;
+}
+
+/* -------------------------------------------------------------------------
+   7. Figuras
+   ------------------------------------------------------------------------- */
+
+figure {
+	break-inside: avoid;
+	margin: 5mm 0;
+	text-align: center;
+}
+
+figure img {
+	max-width: 100%;
+	height: auto;
+	border-radius: 1.5mm;
+}
+
+/* Diagramas desenhados em SVG dentro do próprio documento, para herdarem a
+   paleta da liga. Traço fino e sem preenchimento pesado: imprimem bem. */
+.diagrama {
+	width: 100%;
+	height: auto;
+	display: block;
+}
+
+.diagrama text {
+	font-family: "Inter", system-ui, sans-serif;
+	fill: var(--tinta-2);
+}
+
+.diagrama .rotulo {
+	font-family: "Outfit", sans-serif;
+	font-weight: 700;
+	fill: var(--tinta);
+}
+
+.diagrama .miudo { fill: var(--tinta-3); }
+.diagrama .caixa { fill: #ffffff; stroke: var(--linha); stroke-width: 1.2; }
+.diagrama .caixa-destaque { fill: #fff6ea; stroke: var(--laranja); stroke-width: 1.4; }
+.diagrama .traco { stroke: var(--tinta-3); stroke-width: 1.2; fill: none; }
+.diagrama .onda { stroke: var(--prussiano); stroke-width: 1.8; fill: none; stroke-linejoin: round; }
+
+figcaption {
+	font-size: 7.5pt;
+	color: var(--tinta-3);
+	margin-top: 2mm;
+	text-align: left;
+	line-height: 1.5;
+}
+
+/* -------------------------------------------------------------------------
+   8. Grade de séries: cada chip com a cor que o site usa
+   ------------------------------------------------------------------------- */
+
+.grade-series {
+	display: grid;
+	grid-template-columns: 1fr 1fr;
+	gap: 3mm;
+	margin: 4mm 0;
+}
+
+.chip {
+	break-inside: avoid;
+	border: 0.8pt solid var(--linha);
+	border-top: 2.5pt solid var(--cor-chip, var(--laranja));
+	border-radius: 1.5mm;
+	padding: 3mm 3.5mm;
+}
+
+.chip-nome {
+	font-family: "Outfit", sans-serif;
+	font-weight: 800;
+	font-size: 11pt;
+	line-height: 1.1;
+	/* A cor da série fica na faixa superior do card, que é decoração e não
+	   precisa de contraste. Dez das doze cores reprovam em AA como texto
+	   (o amarelo do P4 dá 1,63:1 sobre branco), então o nome vai em tinta. */
+	color: var(--tinta);
+}
+
+.chip-papel {
+	font-size: 7.5pt;
+	font-weight: 600;
+	color: var(--tinta-3);
+	text-transform: uppercase;
+	letter-spacing: 0.05em;
+	margin-bottom: 2mm;
+}
+
+.chip p { font-size: 8.2pt; line-height: 1.5; margin-bottom: 2mm; text-align: left; }
+
+.chip dl {
+	margin: 0;
+	font-size: 7.6pt;
+	display: grid;
+	grid-template-columns: auto 1fr;
+	gap: 0.6mm 2mm;
+	border-top: 0.5pt solid var(--linha-suave);
+	padding-top: 1.8mm;
+}
+
+.chip dt { color: var(--tinta-3); font-weight: 500; }
+.chip dd { margin: 0; color: var(--tinta); font-weight: 600; }
+
+/* -------------------------------------------------------------------------
+   9. Sumário: numeração de página resolvida pelo Paged.js
+   ------------------------------------------------------------------------- */
+
+.sumario { margin-top: 6mm; }
+
+.sumario a {
+	display: flex;
+	align-items: baseline;
+	gap: 2mm;
+	border: none;
+	color: var(--tinta);
+	text-decoration: none;
+	padding: 1.8mm 0;
+	border-bottom: 0.5pt solid var(--linha-suave);
+	font-size: 10pt;
+}
+
+.sumario .num {
+	font-family: "Outfit", sans-serif;
+	font-weight: 700;
+	color: var(--laranja-texto);
+	min-width: 7mm;
+}
+
+.sumario .txt { font-weight: 600; }
+
+.sumario .pontos {
+	flex: 1;
+	border-bottom: 0.5pt dotted var(--linha);
+	transform: translateY(-1mm);
+}
+
+.sumario a::after {
+	content: target-counter(attr(href url), page);
+	font-family: "Outfit", sans-serif;
+	font-weight: 700;
+	color: var(--tinta-3);
+}
+
+/* -------------------------------------------------------------------------
+   10. Passos numerados da prática
+   ------------------------------------------------------------------------- */
+
+.passo {
+	/* Indivisível: testado com break-inside:auto, o círculo com o número do
+	   passo ficava sozinho no pé da página, separado do próprio conteúdo. */
+	break-inside: avoid;
+	display: grid;
+	grid-template-columns: 8mm 1fr;
+	gap: 3mm;
+	margin-bottom: 5mm;
+}
+
+.passo-num {
+	font-family: "Outfit", sans-serif;
+	font-weight: 800;
+	font-size: 12pt;
+	color: #fff;
+	background: var(--prussiano);
+	width: 8mm;
+	height: 8mm;
+	border-radius: 50%;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	line-height: 1;
+}
+
+.passo h3 { margin-top: 0.5mm; border: none; padding: 0; }
+
+/* -------------------------------------------------------------------------
+   11. Visual só de tela (Paged.js desenha as folhas)
+   ------------------------------------------------------------------------- */
+
+@media screen {
+	body {
+		background:
+			radial-gradient(60rem 40rem at 50% -10rem, #eaf1f5 0%, transparent 70%),
+			#dfe7ec;
+		padding: 10mm 0 16mm;
+	}
+
+	/* Pilha de folhas centralizada na janela, com respiro entre elas. */
+	.pagedjs_pages {
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		gap: 9mm;
+		width: 100%;
+		max-width: none;
+	}
+
+	.pagedjs_page {
+		background: #fff;
+		box-shadow:
+			0 0 0 1px rgba(6, 38, 57, 0.07),
+			0 6px 22px -6px rgba(6, 38, 57, 0.22);
+		border-radius: 1.5mm;
+		margin: 0;
+		transition: box-shadow 0.2s ease;
+	}
+
+	.pagedjs_page:hover {
+		box-shadow:
+			0 0 0 1px rgba(6, 38, 57, 0.12),
+			0 10px 30px -8px rgba(6, 38, 57, 0.3);
+	}
+
+	/* A capa é sangria total: sem cantos arredondados brigando com o desenho. */
+	.pagedjs_page:first-child { border-radius: 0; }
+
+	.aviso-carregando {
+		font-family: "Inter", sans-serif;
+		text-align: center;
+		padding: 40mm 20mm;
+		color: #5b7688;
+		font-size: 11pt;
+	}
+
+	/* Leitura confortável: um pouco mais de corpo do que no papel. */
+	.pagedjs_page_content { font-size: 10.2pt; }
+}
+
+/* Telas estreitas: encolhe a folha inteira em vez de estourar a largura. */
+@media screen and (max-width: 230mm) {
+	.pagedjs_pages {
+		transform: scale(calc(100vw / 232mm));
+		transform-origin: top center;
+	}
+}
+
+@media print {
+	.aviso-carregando { display: none; }
+}

public/apostilas/assets/capa-curvas.svg

@@ -0,0 +1,33 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 210 297" width="210mm" height="297mm" aria-hidden="true">
+<defs>
+  <linearGradient id="feixe" x1="0" y1="260" x2="210" y2="80" gradientUnits="userSpaceOnUse">
+    <stop offset="0" stop-color="#003049"/>
+    <stop offset="0.45" stop-color="#EAE2B7"/>
+    <stop offset="0.68" stop-color="#FCBF49"/>
+    <stop offset="0.85" stop-color="#F77F00"/>
+    <stop offset="1" stop-color="#D62828"/>
+  </linearGradient>
+  <radialGradient id="brilho" cx="0.72" cy="0.24" r="0.62">
+    <stop offset="0" stop-color="#FCBF49" stop-opacity="0.20"/>
+    <stop offset="0.55" stop-color="#F77F00" stop-opacity="0.06"/>
+    <stop offset="1" stop-color="#F77F00" stop-opacity="0"/>
+  </radialGradient>
+  <radialGradient id="frio" cx="0.12" cy="0.86" r="0.6">
+    <stop offset="0" stop-color="#003049" stop-opacity="0.13"/>
+    <stop offset="1" stop-color="#003049" stop-opacity="0"/>
+  </radialGradient>
+</defs>
+<rect width="210" height="297" fill="url(#frio)"/>
+<rect width="210" height="297" fill="url(#brilho)"/>
+<g fill="none" stroke="url(#feixe)" stroke-linecap="round">
+  <path d="M -14 232.0 C 62.0 214.0, 132.0 128.0, 224 96.0" stroke-width="0.35" opacity="0.16"/>
+  <path d="M -14 239.8 C 65.2 210.8, 129.2 133.8, 224 91.0" stroke-width="0.61" opacity="0.27"/>
+  <path d="M -14 247.5 C 68.5 207.5, 126.5 139.5, 224 86.0" stroke-width="0.88" opacity="0.37"/>
+  <path d="M -14 255.2 C 71.8 204.2, 123.8 145.2, 224 81.0" stroke-width="1.14" opacity="0.47"/>
+  <path d="M -14 263.0 C 75.0 201.0, 121.0 151.0, 224 76.0" stroke-width="1.40" opacity="0.58"/>
+  <path d="M -14 270.8 C 78.2 197.8, 118.2 156.8, 224 71.0" stroke-width="1.14" opacity="0.47"/>
+  <path d="M -14 278.5 C 81.5 194.5, 115.5 162.5, 224 66.0" stroke-width="0.88" opacity="0.37"/>
+  <path d="M -14 286.2 C 84.8 191.2, 112.8 168.2, 224 61.0" stroke-width="0.61" opacity="0.27"/>
+  <path d="M -14 294.0 C 88.0 188.0, 110.0 174.0, 224 56.0" stroke-width="0.35" opacity="0.16"/>
+</g>
+</svg>

public/apostilas/assets/laser-escuro.svg

@@ -0,0 +1,17 @@
+<svg width="65" height="18" viewBox="0 0 65 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M55.4889 4.21252L57.8 8.19685L60.1111 4.21252L62.5609 5.62035L60.2498 9.60469H64.872V12.4203H60.2498L62.5609 16.4047L60.1111 17.8125L57.8 13.8282L55.4889 17.8125L53.0391 16.4047L55.3502 12.4203H0V9.60469H55.3502L53.0391 5.62035L55.4889 4.21252Z" fill="url(#paint0_linear_71_12)"/>
+<path d="M51 5.12224V4.21252H47.6V11.0125V17.8125H51V11.0125C51 9.13475 52.5222 7.61252 54.4 7.61252H57.8V4.21252H54.4C53.1614 4.21252 52.0002 4.54366 51 5.12224Z" fill="#003049"/>
+<path d="M40.8 4.21252C37.0445 4.21252 34 7.25699 34 11.0125C34 14.7681 37.0445 17.8125 40.8 17.8125H47.6V14.4125H40.8C39.5137 14.4125 38.3941 13.6982 37.8166 12.6445H44.2H47.6V11.0125C47.6 7.25699 44.5555 4.21252 40.8 4.21252ZM40.8 7.61252C42.0302 7.61252 43.1078 8.26588 43.7047 9.24452H37.8953C38.4922 8.26588 39.5698 7.61252 40.8 7.61252Z" fill="#003049"/>
+<path d="M27.2 4.21252C23.4445 4.21252 20.4 7.25699 20.4 11.0125H23.8C23.8 12.8903 25.3222 14.4125 27.2 14.4125H20.4V17.8125H30.6C32.4778 17.8125 34 16.2903 34 14.4125V11.0125H23.8C23.8 9.13475 25.3222 7.61252 27.2 7.61252H34V4.21252H27.2Z" fill="#003049"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M13.6 4.21252C9.84448 4.21252 6.80002 7.25699 6.80002 11.0125C6.80002 14.7681 9.84448 17.8125 13.6 17.8125H17H20.4V11.0125V4.21252H17V5.12224C15.9998 4.54366 14.8386 4.21252 13.6 4.21252ZM17 11.0125C17 12.8903 15.4778 14.4125 13.6 14.4125C11.7222 14.4125 10.2 12.8903 10.2 11.0125C10.2 9.13475 11.7222 7.61252 13.6 7.61252C15.4778 7.61252 17 9.13475 17 11.0125Z" fill="#003049"/>
+<path d="M3.4 0.8125H0V17.8125H3.4H6.8V14.4125H3.4V0.8125Z" fill="#003049"/>
+<defs>
+<linearGradient id="paint0_linear_71_12" x1="0" y1="11.0125" x2="64.872" y2="11.0125" gradientUnits="userSpaceOnUse">
+<stop stop-color="#003049"/>
+<stop offset="0.5" stop-color="#EAE2B7"/>
+<stop offset="0.75" stop-color="#FCBF49"/>
+<stop offset="0.875" stop-color="#F77F00"/>
+<stop offset="1" stop-color="#D62828"/>
+</linearGradient>
+</defs>
+</svg>

public/apostilas/assets/laser.svg

@@ -0,0 +1,17 @@
+<svg width="65" height="18" viewBox="0 0 65 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M55.4889 4.21252L57.8 8.19685L60.1111 4.21252L62.5609 5.62035L60.2498 9.60469H64.872V12.4203H60.2498L62.5609 16.4047L60.1111 17.8125L57.8 13.8282L55.4889 17.8125L53.0391 16.4047L55.3502 12.4203H0V9.60469H55.3502L53.0391 5.62035L55.4889 4.21252Z" fill="url(#paint0_linear_71_12)"/>
+<path d="M51 5.12224V4.21252H47.6V11.0125V17.8125H51V11.0125C51 9.13475 52.5222 7.61252 54.4 7.61252H57.8V4.21252H54.4C53.1614 4.21252 52.0002 4.54366 51 5.12224Z" fill="white"/>
+<path d="M40.8 4.21252C37.0445 4.21252 34 7.25699 34 11.0125C34 14.7681 37.0445 17.8125 40.8 17.8125H47.6V14.4125H40.8C39.5137 14.4125 38.3941 13.6982 37.8166 12.6445H44.2H47.6V11.0125C47.6 7.25699 44.5555 4.21252 40.8 4.21252ZM40.8 7.61252C42.0302 7.61252 43.1078 8.26588 43.7047 9.24452H37.8953C38.4922 8.26588 39.5698 7.61252 40.8 7.61252Z" fill="white"/>
+<path d="M27.2 4.21252C23.4445 4.21252 20.4 7.25699 20.4 11.0125H23.8C23.8 12.8903 25.3222 14.4125 27.2 14.4125H20.4V17.8125H30.6C32.4778 17.8125 34 16.2903 34 14.4125V11.0125H23.8C23.8 9.13475 25.3222 7.61252 27.2 7.61252H34V4.21252H27.2Z" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M13.6 4.21252C9.84448 4.21252 6.80002 7.25699 6.80002 11.0125C6.80002 14.7681 9.84448 17.8125 13.6 17.8125H17H20.4V11.0125V4.21252H17V5.12224C15.9998 4.54366 14.8386 4.21252 13.6 4.21252ZM17 11.0125C17 12.8903 15.4778 14.4125 13.6 14.4125C11.7222 14.4125 10.2 12.8903 10.2 11.0125C10.2 9.13475 11.7222 7.61252 13.6 7.61252C15.4778 7.61252 17 9.13475 17 11.0125Z" fill="white"/>
+<path d="M3.4 0.8125H0V17.8125H3.4H6.8V14.4125H3.4V0.8125Z" fill="white"/>
+<defs>
+<linearGradient id="paint0_linear_71_12" x1="0" y1="11.0125" x2="64.872" y2="11.0125" gradientUnits="userSpaceOnUse">
+<stop stop-color="#003049"/>
+<stop offset="0.5" stop-color="#EAE2B7"/>
+<stop offset="0.75" stop-color="#FCBF49"/>
+<stop offset="0.875" stop-color="#F77F00"/>
+<stop offset="1" stop-color="#D62828"/>
+</linearGradient>
+</defs>
+</svg>

scripts/auditar-temas.mjs

@@ -4,15 +4,15 @@
  *
  * Verifica quatro coisas nos arquivos .jsx do projeto:
  *
- *   1. TOM INEXISTENTE  — classe usando um valor fora da escala declarada.
+ *   1. TOM INEXISTENTE: classe usando um valor fora da escala declarada.
  *                         Não gera CSS: o elemento herda a cor do pai.
- *   2. PAR INVERTIDO    — no tema escuro o texto deveria clarear (número menor)
+ *   2. PAR INVERTIDO: no tema escuro o texto deveria clarear (número menor)
  *                         e o fundo/borda deveria escurecer (número maior).
- *   3. CONTRASTE BAIXO  — par abaixo de 4.5:1 (AA para texto).
+ *   3. CONTRASTE BAIXO: par abaixo de 4.5:1 (AA para texto).
- *   4. COR FIXA INLINE  — style={{ borderColor: 'rgba(...)' }} com valor literal.
+ *   4. COR FIXA INLINE: style={{ borderColor: 'rgba(...)' }} com valor literal.
  *                         Style inline vence classe, então anula a cor do tema
  *                         (inclusive as variantes dark: e hover:). Cor vinda do
- *                         dado (serie.cor) é permitida — ver DESIGN.md seção 5.
+ *                         dado (serie.cor) é permitida, ver DESIGN.md seção 5.
  *
  * Uso:  npm run auditar-temas
  * Sai com código 1 se encontrar problema. Ver DESIGN.md.
@@ -74,7 +74,7 @@ const RX_TEXTO = /\btext-slate-(\d+) dark:text-slate-(\d+)\b/g;
 const RX_SUPERFICIE = /\b(bg|border)-slate-(\d+)(?:\/\d+)? dark:\1-slate-(\d+)(?:\/\d+)?\b/g;
 // texto que acompanha um componente invertido: claro -> escuro (sem /g: usado com .test)
 const RX_TEXTO_INVERTIDO = /\btext-white dark:text-slate-(?:[5-9]\d0|950)\b/;
-// Blocos style={{ ... }} — só dentro deles uma cor literal é problema.
+// Blocos style={{ ... }}: só dentro deles uma cor literal é problema.
 // Fora disso, `color: "#6366f1"` costuma ser tabela de dados (categorias de pino).
 const RX_BLOCO_STYLE = /style=\{\{([\s\S]*?)\}\}/g;
 // Cor literal: aspas seguidas de #, rgb(), hsl() ou nome de cor.
@@ -132,16 +132,16 @@ function main() {
 				if (!(claro in ESCALA) || !(escuro in ESCALA)) continue;
 				if (Number(escuro) > Number(claro)) continue;
 				// Inversão deliberada (DESIGN.md seção 4): superfície escura nos DOIS
-				// temas — tooltip, bloco de código, botão escuro secundário.
+				// temas: tooltip, bloco de código, botão escuro secundário.
 				if (Number(claro) >= 800 && Number(escuro) >= 800) continue;
 				// Botão que inverte preto<->branco NÃO é exceção: é bug.
-				// Ver DESIGN.md 4.1 — botão carrega a própria cor.
+				// Ver DESIGN.md 4.1: botão carrega a própria cor.
 				const textoInverte =
 					RX_TEXTO_INVERTIDO.test(linha) ||
 					[...linha.matchAll(RX_TEXTO)].some((t) => Number(t[2]) > Number(t[1]));
 				if (textoInverte) {
 					invertidos.push([arq, n, m[0],
-						"botão invertendo preto/branco — use cor própria (DESIGN.md 4.1)"]);
+						"botão invertendo preto/branco, use cor própria (DESIGN.md 4.1)"]);
 					continue;
 				}
 				invertidos.push([arq, n, m[0], "fundo/borda não escurece no tema escuro"]);
@@ -157,7 +157,7 @@ function main() {
 	if (inexistentes.size) {
 		const total = [...inexistentes.values()].reduce((a, b) => a + b, 0);
 		console.log(`\nTONS FORA DA ESCALA: ${total}`);
-		console.log("   (não geram CSS — declare em globals.css ou troque por um tom válido)");
+		console.log("   (não geram CSS: declare em globals.css ou troque por um tom válido)");
 		for (const [k, v] of [...inexistentes].sort((a, b) => b[1] - a[1])) {
 			console.log(`    ${v}x  ${k}`);
 		}
@@ -170,7 +170,7 @@ function main() {
 	const total =
 		[...inexistentes.values()].reduce((a, b) => a + b, 0) +
 		invertidos.length + fracos.length + fixas.length;
-	console.log(`\n${total === 0 ? "OK — nenhum problema." : `${total} problema(s).`}`);
+	console.log(`\n${total === 0 ? "OK, nenhum problema." : `${total} problema(s).`}`);
 	console.log("Exceção legítima: painel escuro nos DOIS temas (tooltip, bloco de código).");
 	console.log("Nesses casos não use variante dark:. Ver DESIGN.md seção 4.");
 	return total ? 1 : 0;