Prompt 0055 — Coloração de Páginas por Escopo (S/B)

Prompt refinado

Implementar colorização automática de páginas no site Starlight baseada no mapa de escopo (docs/site-itens-map.md): páginas com “S” recebem cor verde e badge “(S)” no título; páginas com “B” recebem cor âmbar. A colorização deve aparecer tanto nos links do sidebar quanto no título (H1) de cada página. Cores com contraste WCAG AA para modo claro e escuro. Site publicado no Firebase (output estático).

Resultado

scripts/gen-scope-styles.mjs criado: parseia o mapa, detecta 36 S e 75 B, gera scope-sidebar.css (seletores .sidebar-pane a[href="..."]) e scope-map.json (URL → escopo)
src/components/PageTitle.astro criado: override do componente Starlight, lê scope-map.json, aplica classes scope-s/scope-b no <h1> e adiciona <span class="scope-badge">(S)</span> para páginas S
src/styles/scope-sidebar.css gerado automaticamente (não editar manualmente)
src/data/scope-map.json gerado automaticamente (não editar manualmente)
astro.config.mjs atualizado: components.PageTitle + customCss com scope-sidebar.css
package.json atualizado: gen-scope-styles.mjs roda antes do build e do dev
Build: 182 páginas sem erros; HTML confirmado com classes corretas em /framework/sobre/ (S) e /framework/etica-ia/ (B)
Fluxo de manutenção: atualizar site-itens-map.md → npm run build → cores aplicadas automaticamente