Redesign das páginas internas no novo design system (AAA) (#2)

* feat(design): redesign das páginas internas no novo design system

Padroniza todas as páginas e componentes internos nos tokens e primitivos
de app/globals.css, com contraste AAA (7:1) nos dois temas e alvos de toque
de 44px.

- Páginas reescritas: glossário, séries, série, seletor, comparador,
  diagnóstico, catálogo, component registry, frameworks, framework, sobre
  e a nova 404.
- Componentes: PageHero e SectionHead novos; BoardCard, CodeExample,
  PinRestrictions, SeriesTabMenu e ConnectionsDiagram refeitos, com abas
  e diálogo acessíveis.
- Remove emojis, cores avulsas por série, caixa alta com tracking, texto
  menor que 12px e os pares slate-*/dark:*.
- Comparador: "mostrar só as diferenças" e leitura de ?chips=.
- Corrige overflow em 320/390px e ajusta accent/copper do tema claro
  para fechar 7:1.
- scripts/auditar-temas.mjs passa a travar paleta crua, dark:, texto
  pequeno, emoji e contraste dos tokens.

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_016W1xmizFcmXLrmabSvfSuc

* ci: roda lint, auditorias de design e build em cada PR

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_016W1xmizFcmXLrmabSvfSuc

---------

Co-authored-by: Claude Sonnet 5.5 <noreply@anthropic.com>

components/CodeSample.jsx

@@ -0,0 +1,25 @@
+export default function CodeSample({ label, language, code, note }) {
+	const lines = code.replace(/\n$/, "").split("\n");
+
+	return (
+		<figure className="min-w-0">
+			<figcaption className="mb-2.5 flex flex-wrap items-center justify-between gap-2 px-1">
+				<span className="text-xs font-semibold text-ink">{label}</span>
+				<span className="font-mono text-[0.6875rem] text-muted">{language}</span>
+			</figcaption>
+			<div className="code-panel rounded-2xl shadow-[0_18px_40px_-24px_rgba(0,0,0,0.5)]">
+				<pre>
+					<code>
+						{lines.map((line, index) => (
+							<span key={`${index}-${line}`} className="flex">
+								<span className="mr-4 w-6 shrink-0 select-none text-right text-[#7d8794]">{index + 1}</span>
+								<span className="min-w-0 whitespace-pre text-[#e9eef4]">{line || " "}</span>
+							</span>
+						))}
+					</code>
+				</pre>
+			</div>
+			{note && <p className="mt-2.5 px-1 text-xs leading-relaxed text-muted">{note}</p>}
+		</figure>
+	);
+}