diff --git a/.agents/snapshots/built-css-values.json b/.agents/snapshots/built-css-values.json new file mode 100644 index 0000000..2a0c2d4 --- /dev/null +++ b/.agents/snapshots/built-css-values.json @@ -0,0 +1,292 @@ +{ + "colors": [ + "#081621", + "#0b1b27", + "#0c1a25", + "#0f2230", + "#102536", + "#102837", + "#102b3a", + "#112a3b", + "#122534", + "#123042", + "#132b3b", + "#172f42", + "#173046", + "#173245", + "#173b4f", + "#18364a", + "#19364a", + "#1a4b42", + "#1c425a", + "#1d455b", + "#1f3a4b", + "#215675", + "#244760", + "#29455a", + "#2a4150", + "#315f80", + "#344c5d", + "#41596b", + "#426070", + "#466274", + "#486175", + "#496274", + "#527085", + "#527f9f", + "#557080", + "#572f32", + "#596f9a", + "#5b7098", + "#65717a", + "#697b89", + "#6b668f", + "#6c6898", + "#7c78a8", + "#80c69a", + "#80c69a20", + "#80c69a22", + "#8ca1af", + "#91aab7", + "#9ba7a5", + "#9bcba7", + "#9eabb4", + "#9eb0bb", + "#a7483f", + "#a9b6be", + "#a9bcc8", + "#a9e3ae", + "#aebbc3", + "#aebfc7", + "#aebfc9", + "#afbec7", + "#b0bac1", + "#b5c0c7", + "#b7c7d1", + "#b8c8d2", + "#b9c8d0", + "#b9c8d1", + "#bed0dc", + "#bfccd4", + "#c1d1d8", + "#c4cdd3", + "#c6d2d7", + "#c9d5dc", + "#cbd9e1", + "#d0d5d2", + "#d4dfe3", + "#d5dde2", + "#d5f1d6", + "#d6e1e4", + "#d8dee2", + "#e5e3ef", + "#e5eeeb", + "#e89a8e", + "#e8ecee", + "#e9ecee", + "#e9eeed", + "#ebbf58", + "#eceaf5", + "#eceff0", + "#edf0f1", + "#eeedf6", + "#efc76b", + "#efc76b18", + "#f0eef8", + "#f1f0f7", + "#f5f4f1", + "#f6f3ed", + "#ffb5a8", + "#ffd7d0", + "#fff", + "#ffffff05", + "#ffffff06", + "#ffffff1f", + "#ffffff2b", + "#ffffff2d", + "#ffffff30", + "#ffffff32", + "#ffffff40", + "#ffffff42", + "#ffffff50", + "#ffffff66", + "rgb(255 255 255 / 14.1176%)", + "rgb(255 255 255 / 22.7451%)", + "rgb(255 255 255 / 25.098%)", + "rgb(255 255 255 / 31.3725%)" + ], + "sizes": [ + "01em", + "1em", + "1px", + "1.2em", + "1.45em", + "1.5em", + "1.8em", + "02em", + "2px", + "2.4vw", + "2.5vw", + "2.6vw", + "3em", + "3px", + "3vw", + "3.3vw", + "3.4vw", + "04em", + "4px", + "4vw", + "05em", + "5em", + "5px", + "5vw", + "5.6vw", + "06em", + "6px", + "6vw", + "07em", + "7px", + "7vw", + "08em", + "8px", + "8vw", + "8.3vw", + "09em", + "9em", + "9px", + "9vw", + "10px", + "10.5px", + "11px", + "12em", + "12px", + "12vh", + "13px", + "14px", + "15px", + "16px", + "17px", + "17vw", + "18px", + "19px", + "20px", + "22px", + "23px", + "24px", + "25px", + "26px", + "27px", + "28px", + "30px", + "32px", + "34px", + "35em", + "35px", + "36px", + "38px", + "40px", + "42px", + "44px", + "045em", + "45px", + "46px", + "48px", + "50px", + "52px", + "54px", + "55px", + "56px", + "58px", + "60px", + "62px", + "64px", + "65px", + "70px", + "72px", + "075em", + "75px", + "76px", + "78px", + "80px", + "82px", + "85px", + "90px", + "92px", + "95px", + "96px", + "100px", + "105px", + "108px", + "110px", + "112px", + "120px", + "126px", + "130px", + "135px", + "140px", + "145px", + "148px", + "150px", + "160px", + "164px", + "170px", + "175px", + "180px", + "190px", + "200px", + "210px", + "220px", + "230px", + "240px", + "255px", + "260px", + "270px", + "280px", + "290px", + "300px", + "305px", + "320px", + "330px", + "340px", + "360px", + "380px", + "390px", + "410px", + "420px", + "440px", + "460px", + "500px", + "520px", + "530px", + "540px", + "560px", + "570px", + "600px", + "620px", + "650px", + "680px", + "700px", + "720px", + "730px", + "750px", + "780px", + "800px", + "850px", + "880px", + "900px", + "950px", + "1000px", + "1040px", + "1050px", + "1100px", + "1400px", + "1420px", + "1500px", + "1600px", + "1840px", + "1920px", + "1960px", + "2200px", + "2880px" + ] +} diff --git a/.agents/snapshots/full-guide.txt b/.agents/snapshots/full-guide.txt index cc39ee7..41e6fb2 100644 --- a/.agents/snapshots/full-guide.txt +++ b/.agents/snapshots/full-guide.txt @@ -28,8 +28,11 @@ A presentation for humans who ship Uma apresentação para quem entrega software AI for dummies. -You do not need an army of models. You need a system: one mind to frame the work, several hands to execute it, and a clean boundary between every task. -Você não precisa de um exército de modelos. Precisa de um sistema: uma mente para enquadrar o trabalho, várias mãos para executá-lo e uma fronteira clara entre cada tarefa. +You do not need an army of models. You need a system: one mind to frame the work, +several hands to execute it, and a clean boundary between every task. +Você não precisa de um exército de modelos. Precisa de um sistema: uma mente para +enquadrar o trabalho, várias mãos para executá-lo e uma fronteira clara entre cada +tarefa. FIELD NOTE / 001 NOTA DE CAMPO / 001 Ship the @@ -114,8 +117,10 @@ agent/docs Interface worker Receives: component contract + visual states Returns: focused diff + viewport evidence -The orchestrator preserves intent, writes small contracts, and gathers results that can be -verified. It does not need to type every line. +The orchestrator preserves intent, writes small contracts, and gathers results that can +be verified. It does not need to type every line. +O orquestrador preserva a intenção, escreve pequenos contratos e reúne resultados +verificáveis. Ele não precisa digitar cada linha. Why the boundary matters Por que a fronteira importa one vague task / three predictable failures @@ -129,7 +134,8 @@ Cada worker lê tudo. Ninguém sabe quais fatos são essenciais. Branch collision Colisão de branches Two agents touch the same checkout. The fastest path becomes conflict resolution. -Dois agentes usam o mesmo checkout. O caminho mais rápido vira resolução de conflitos. +Dois agentes usam o mesmo checkout. O caminho mais rápido vira resolução de +conflitos. 03 Confident drift Desvio confiante @@ -143,6 +149,8 @@ Clique em uma fase. Veja a passagem. Delegation means moving one bounded task into a smaller context—not giving away responsibility. +Delegar é mover uma tarefa delimitada para um contexto menor — não abrir mão da +responsabilidade. 01 PLAN 02 @@ -186,6 +194,8 @@ por mão. A worktree is another directory linked to the same repository. Each agent gets its own checkout and index; history remains shared. +Um worktree é outro diretório ligado ao mesmo repositório. Cada agente recebe seu +próprio checkout e índice; o histórico continua compartilhado. Select a node to inspect its checkout, owner, and next action. Selecione um nó para inspecionar checkout, responsável e próxima ação. repository topology @@ -193,8 +203,10 @@ topologia do repositório 4 checkouts 4 checkouts ROOT +RAIZ main ● clean +● limpo UI AGENT AGENTE DE UI agent/ui @@ -229,8 +241,11 @@ ritmo. Choose a job to see why the model profile changes. Escolha um trabalho para entender por que o perfil do modelo muda. Work +Trabalho Profile +Perfil Prompt shape +Formato do prompt Plan Planejar strong / broad @@ -262,8 +277,12 @@ gear. Escolha o motor. Depois escolha a marcha. -A stronger model changes the capability ceiling. Higher reasoning effort gives that model more room to work. Start with the lightest combination that passes your real checks, then move one knob at a time. -Um modelo mais forte muda o teto de capacidade. Mais esforço de raciocínio dá mais espaço para esse modelo trabalhar. Comece com a combinação mais leve que passa seus checks e mova um controle por vez. +A stronger model changes the capability ceiling. Higher reasoning effort gives that +model more room to work. Start with the lightest combination that passes your real +checks, then move one knob at a time. +Um modelo mais forte muda o teto de capacidade. Mais esforço de raciocínio dá mais +espaço para esse modelo trabalhar. Comece com a combinação mais leve que passa seus +checks e mova um controle por vez. OPENAI CLAUDE GEMINI @@ -287,17 +306,28 @@ Balanced starting point for normal implementation, tests, and review. Measure be reasoning: { effort: "medium" } ROUTING RULE REGRA DE ROTEAMENTO -Use strong models for ambiguity and judgment. Use lighter models for bounded execution. Raise effort only when evaluation shows a gain. -Use modelos fortes para ambiguidade e julgamento. Use modelos leves para execução delimitada. Aumente o esforço apenas quando a avaliação mostrar ganho. +Use strong models for ambiguity and judgment. Use lighter models for bounded execution. +Raise effort only when evaluation shows a gain. +Use modelos fortes para ambiguidade e julgamento. Use modelos leves para execução +delimitada. Aumente o esforço apenas quando a avaliação mostrar ganho. Skills Skills Write the right way once. Escreva do jeito certo uma vez. -A skill is a reusable procedure. It can carry instructions, references, scripts, and assets. It is not magical memory, and it does not replace acceptance criteria. -Uma skill é um procedimento reutilizável. Ela pode carregar instruções, referências, scripts e assets. Não é memória mágica e não substitui critérios de aceitação. +A skill is a reusable procedure. It can carry instructions, references, scripts, and +assets. It is not magical memory, and it does not replace acceptance criteria. +Uma skill é um procedimento reutilizável. Ela pode carregar instruções, referências, +scripts e assets. Não é memória mágica e não substitui critérios de aceitação. +01 / trigger clearly +01 / defina o gatilho +02 / load detail on demand +02 / carregue detalhes sob demanda +03 / return evidence +03 / devolva evidências SKILL PACKAGE +PACOTE DE SKILL SKILL.md procedure and limits references/ @@ -312,10 +342,10 @@ Trigger, procedure, constraints, and the exact evidence the agent must return. select another file to explore Create a skill repeatable pain → reusable judgment -03 -Choose only useful anatomy 01 Start from repeated friction +03 +Choose only useful anatomy 05 Test behavior, then sharpen 02 @@ -336,27 +366,55 @@ Common skills Skills comuns choose behavior before model escolha o comportamento antes do modelo -COMMUNICATION STYLE -caveman -Use for routine status, handoffs, and technical summaries where speed matters. Short fragments make actions and evidence easy to scan. -DIAGNOSTIC LOOP +The field kit +O kit de campo +Different jobs. +Different +instincts. +Trabalhos diferentes. +Instintos +diferentes. +A skill changes how an agent approaches work. Some shape communication. Others enforce +research, debugging, review, or completion discipline. Select one to inspect its +operating rule and verified source. +Uma skill muda como o agente aborda o trabalho. Algumas moldam a comunicação. Outras +impõem pesquisa, diagnóstico, revisão ou disciplina de conclusão. Selecione uma para +inspecionar sua regra operacional. +DIAGNOSE +DIAGNOSTICAR diagnosing-bugs -Use for hard bugs, flakes, and regressions. First build a fast deterministic reproduction, then minimize, rank hypotheses, instrument, and fix the root cause. -SIMPLIFICATION INSTINCT +tight feedback loop +ciclo curto de feedback +SIMPLIFY +SIMPLIFICAR ponytail-lite -Use when a request invites frameworks, dependencies, abstractions, or speculative scaffolding. It checks reuse, standard library, and native platform features before adding code. -CONTEXT ECONOMY -token-saver -Use around verbose tests, builds, Git output, and logs. Filtering preserves context for reasoning while retaining full failure output for recovery. -SOURCE DISCIPLINE +minimum code that holds +código mínimo que funciona +COMMUNICATE +COMUNICAR +caveman +signal without filler +sinal sem excesso +INVESTIGATE +INVESTIGAR research -Use when APIs, standards, architecture facts, or current behavior must be verified. Capture findings in a cited note, prioritizing primary sources. -COMPLETION DISCIPLINE -unlazy -Use for substantial autonomous builds, audits, and parallel work where quiet omissions are expensive. It turns “done” into runnable acceptance checks. -INDEPENDENT REVIEW +primary sources first +fontes primárias primeiro +REVIEW +REVISAR code-review -Use on a branch or PR. One axis checks repository standards; another checks whether the change actually satisfies its originating specification. +standards × spec +padrões × especificação +COMPLETE +CONCLUIR +unlazy +gates and evidence +gates e evidências +ECONOMIZE +ECONOMIZAR +token-saver +compress noisy output +comprima saídas ruidosas 01 SIMPLIFICATION INSTINCT ponytail-lite @@ -368,6 +426,30 @@ Date picker? Start with . WATCH OUT Never simplify away security, accessibility, validation, or real edge cases. GITHUB SOURCE ↗ +ONE PRACTICAL LOADOUT +UM LOADOUT PRÁTICO +PLAN +unlazy +→ +BUILD +ponytail-lite +→ +DEBUG +diagnosing-bugs +→ +REPORT +caveman +PLANEJAR +unlazy +→ +CONSTRUIR +ponytail-lite +→ +DIAGNOSTICAR +diagnosing-bugs +→ +REPORTAR +caveman INSTALL PACK Ask your coding agent to verify, install, and validate the skills. COPY @@ -427,7 +509,14 @@ Same contract · explicit working methods · stronger proof THE HUMAN JOB O PAPEL HUMANO The agent may be autonomous in execution. Intent, boundaries, and evidence remain yours. -O agente pode ser autônomo na execução. Intenção, limites e evidências continuam sendo seus. +O agente pode ser autônomo na execução. Intenção, limites e evidências continuam sendo +seus. +START HERE +COMECE AQUI +Begin with one agent and one skill. Add parallelism only when the tasks are truly +independent. +Comece com um agente e uma skill. Adicione paralelismo apenas quando as tarefas forem +realmente independentes. Verification run each gate separately 01 · STATIC @@ -450,8 +539,9 @@ Go deeper with official documentation, production case studies, Medium, and prac workflows. Rules and enforcement case study → Skills review desk → +Primary references → 12-part reading path → Aprofunde com documentação oficial, casos de produção, Medium e fluxos de praticantes. Estudo de caso sobre regras e enforcement → -Skills review desk → +Referências primárias → Trilha com 12 leituras → diff --git a/scripts/audit-ui.mjs b/scripts/audit-ui.mjs index 9d61d49..d609d8f 100644 --- a/scripts/audit-ui.mjs +++ b/scripts/audit-ui.mjs @@ -1,4 +1,5 @@ -import { readFileSync } from 'node:fs'; +import { readFileSync, readdirSync, statSync } from 'node:fs'; +import { dirname, join } from 'node:path'; const read = (path) => readFileSync(new URL(`../${path}`, import.meta.url), 'utf8'); const pages = [ @@ -13,27 +14,57 @@ const pages = [ 'hands-on/starter/index.html', 'hands-on/rules/index.html', ]; +const walk = (path) => + readdirSync(path).flatMap((name) => { + const child = join(path, name); + return statSync(child).isDirectory() ? walk(child) : [child]; + }); +const definitions = (css) => new Set([...css.matchAll(/(--[\w-]+)\s*:/g)].map(([, name]) => name)); +const uses = (css) => new Set([...css.matchAll(/var\((--[\w-]+)/g)].map(([, name]) => name)); +const builtCss = walk('dist/_astro') + .filter((path) => path.endsWith('.css')) + .map((path) => readFileSync(path, 'utf8')) + .join('\n'); +const builtValues = { + colors: new Set(builtCss.match(/#[0-9a-fA-F]{3,8}\b|(?:rgba?|hsla?)\([^)]*\)/g) || []), + sizes: new Set(builtCss.match(/\b\d+(?:\.\d+)?(?:px|rem|em|vw|vh)\b/g) || []), +}; +// Captured from origin/main after its Astro build. This catches a value that is +// silently changed to a nearby token: source token checks cannot see that drift. +const baselineValues = JSON.parse(read('.agents/snapshots/built-css-values.json')); + for (const page of pages) { const html = read(page); if (!html.includes('name="viewport"')) throw new Error(`${page} lacks a viewport declaration`); if (html.match(/<(script|link)[^>]+(src|href)="https?:[^\"]+"/i)) throw new Error(`${page} has an external runtime dependency`); } -const shared = read('chapters.css'); -const skills = read('skills/styles.css'); -const guide = read('full-guide/index.html'); -const guideAudit = read('full-guide/audit.css'); -for (const token of ['@media(max-width:800px)', '@media(max-width:520px)']) - if (!shared.includes(token)) throw new Error(`shared chapter CSS lacks ${token}`); -for (const token of [ - 'minmax(0,1.3fr)', - 'overflow-wrap:anywhere', - '@media(max-width:800px)', - 'prefers-reduced-motion', -]) - if (!skills.includes(token)) throw new Error(`skills package CSS lacks ${token}`); -if (!guide.includes('href="audit.css"')) - throw new Error('full guide does not load its responsive audit overrides'); -for (const token of ['.handoff table', '.route-table button', 'overflow-wrap:anywhere']) - if (!guideAudit.includes(token)) throw new Error(`full guide audit CSS lacks ${token}`); +for (const file of walk('dist').filter((path) => path.endsWith('.css'))) { + const css = readFileSync(file, 'utf8').replace(/\/\*[\s\S]*?\*\//g, ''); + if (/@import|src:\s*url\(['"]?https?:|url\(['"]?https?:/i.test(css)) + throw new Error(`${file} has an external CSS dependency`); +} +for (const [kind, values] of Object.entries(baselineValues)) { + const missing = values.filter((value) => !builtValues[kind].has(value)); + if (missing.length) throw new Error(`built CSS lost ${kind}: ${missing.join(', ')}`); +} +// Legacy fixtures still ship directly. Resolve every var() from the stylesheets +// that page actually links; Astro's tokens cannot mask a broken standalone page. +for (const page of pages) { + const html = read(page); + const linked = [...html.matchAll(/]+rel="stylesheet"[^>]+href="([^"]+)"/gi)].map( + ([, href]) => href, + ); + const styles = linked + .filter((href) => !/^https?:/i.test(href)) + .map((href) => read(join(dirname(page), href))); + const defined = new Set(styles.flatMap((css) => [...definitions(css)])); + const unresolved = new Set( + styles.flatMap((css) => + [...uses(css)].filter((name) => name !== '--score' && !defined.has(name)), + ), + ); + if (unresolved.size) + throw new Error(`${page} has unresolved CSS variables: ${[...unresolved].join(', ')}`); +} console.log('responsive UI audit passed'); diff --git a/scripts/verify.mjs b/scripts/verify.mjs index faee2ae..b5b3dbf 100644 --- a/scripts/verify.mjs +++ b/scripts/verify.mjs @@ -1,397 +1,263 @@ import { readFileSync } from 'node:fs'; + const read = (path) => readFileSync(new URL(`../${path}`, import.meta.url), 'utf8'); -const landingHtml = read('index.html'); -const html = read('full-guide/index.html'); -const js = read('app.js'); -const refs = read('docs/references/README.md'); -const additional = read('docs/references/additional-reading.md'); -const starterHtml = read('hands-on/starter/index.html'); -const starterJs = read('hands-on/starter/app.js'); -const skillSources = read('docs/references/skill-sources.md'); -const modelRouting = read('docs/references/model-routing.md'); -const rulesHtml = read('rules/index.html'); -const rulesJs = read('rules/app.js'); -const rulesCss = read('rules/styles.css'); -const reviewHtml = read('skills-review/index.html'); -const reviewJs = read('skills-review/app.js'); -const reviewFiles = read('skills-review/files.js'); -const reviewLensCss = read('skills-review/change-lens.css'); -const chaptersCss = read('chapters.css'); -const summaryHtml = read('summary/index.html'); -const modelsHtml = read('models/index.html'); -const agentsHtml = read('agents/index.html'); -const skillsHtml = read('skills/index.html'); -const reviewCatalog = read('skills-review/catalog.js'); -const reviewVoteJs = read('skills-review/vote.js'); -const voteService = read('vote-service/main.go'); -for (const url of [ - 'https://code.claude.com/docs/en/sub-agents', - 'https://code.claude.com/docs/en/skills', - 'https://code.claude.com/docs/en/worktrees', - 'https://git-scm.com/docs/git-worktree.html', - 'https://developers.openai.com/codex/skills', -]) - if (!refs.includes(url)) throw new Error(`missing reference ${url}`); -console.log('content verification passed'); -for (const token of [ - 'data-phase="plan"', - 'data-phase="build"', - 'data-phase="review"', - 'data-tree="main"', - 'data-tree="ui"', - 'data-worker="ui"', - 'data-route="plan"', - 'data-model-provider="openai"', - 'data-model-provider="claude"', - 'data-model-provider="gemini"', - 'data-effort="low"', - 'data-effort="medium"', - 'data-effort="high"', - 'data-skill-file="skill"', - 'data-skill-step="observe"', - 'data-skill-step="validate"', - 'data-common-skill="ponytail"', - 'data-common-skill="caveman"', - 'data-common-skill="unlazy"', - 'id="hands-on"', - 'data-copy-target="prompt-install-skills"', - 'data-copy-target="prompt-basic"', - 'data-copy-target="prompt-skills"', - 'hands-on/starter/', - 'additional-reading.md', - 'role="tablist"', - '