wizz-method 1.12.0 → 1.14.0

package/package.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://json.schemastore.org/package.json",
   "name": "wizz-method",
-  "version": "1.12.0",
+  "version": "1.14.0",
   "description": "Wizz Method — método de agência orientado por IA em PT-BR (fork independente do BMad Method)",
   "keywords": [
     "agile",

package/skills-registry.yaml

@@ -121,7 +121,7 @@ areas:
         when: "Auditor de movimento: revisa animação existente e aponta scale(0) no início, easing cru, reduced-motion faltando; pesa contenção/polimento/diversão pelo contexto."
       - id: remotion-best-practices
         door: motion
-        when: "Vídeo programático em React (Remotion) especificamente."
+        when: "MONTAR o filme: vídeo em React (Remotion) com áudio, SFX, legenda e timing com precisão de frame. No pipeline de vídeo é o Remotion que faz a montagem final; o hyperframes só desenha as telas mudas (regra: HyperFrames desenha, Remotion monta — ver _shared/video-pipeline.md do módulo wizz)."
       - id: canvas-design
         door: motion
         when: "Gerar PNG/PDF editável por código (carrossel, quote card, infográfico) com fonte/cor/logo sempre certos. Traz canvas-fonts."
@@ -143,7 +143,7 @@ areas:
         check: "command -v 21st"
         install: "npm i -g @21st-dev/cli && npx @21st-dev/cli install-skill"
       - id: hyperframes
-        when: "Renderizar vídeo a partir de HTML/CSS/animação (HTML→MP4, agent-native, 20+ skills). Alternativa HTML-nativa ao Remotion (que é React). Precisa ffmpeg + Node 22 + Chrome headless."
+        when: "DESENHAR telas de vídeo em HTML/CSS (HTML→MP4, agent-native, 20+ skills): cena isolada e MUDA — maqueta de WhatsApp/ChatGPT, gráfico animado, título, loop. NÃO usar para montagem com áudio/SFX/legenda sincronizada (posicionador de áudio falhou em produção, ~2,76s de drift; CSS vaza entre telas): a montagem final é do Remotion (regra: HyperFrames desenha, Remotion monta — ver _shared/video-pipeline.md do módulo wizz). Precisa ffmpeg + Node 22 + Chrome headless."
         # Gate de plataforma (2026-07-08): o `install` virou clone+checkout
         # POSIX (mktemp/rm), então macOS/Linux/WSL — mesma regra das
         # clone-and-run abaixo. (Antes ficava sem gate porque check/install
@@ -198,6 +198,12 @@ areas:
         # sistema específica (é um app desktop autocontido que expõe um
         # endpoint MCP local) — nada de concreto pra checar sem inventar um
         # requisito que o registry não afirma.
+      - id: ctc-align
+        when: "Timestamps palavra a palavra CONFIÁVEIS de narração TTS (texto conhecido): sincronizar legenda, corte de cena, animação e elemento gráfico com a fala. Fonte única de timing em vídeo — substitui timestamps do Whisper e estimativa manual. Skill da lib: ctc-align (instalação + helper align.py + regras de âncora monotônica e duração mínima). Roda em CPU, sem CUDA."
+        platform: [darwin, linux]
+        check: "test -x ./tools/ctc-align/.venv/bin/ctc-forced-aligner"
+        install: 'mkdir -p tools/ctc-align && uv venv --python 3.12 tools/ctc-align/.venv && uv pip install --python tools/ctc-align/.venv/bin/python "git+https://github.com/MahmoudAshraf97/ctc-forced-aligner.git"'
+        verify: "command -v ffmpeg >/dev/null 2>&1 && command -v uv >/dev/null 2>&1"
     references:
       - "references/premium-agency-rules.md (regras $150k-tier, importadas por impeccable/huashu no modo high-end)"
 
@@ -319,12 +325,15 @@ areas:
     # Roteiro viral em si (hook, corpo, CTA) é conhecimento do próprio agente
     # wizz-social (Blueprint de Roteiro Viral em knowledge/), não uma skill global.
     #
-    # CLIs de vídeo: o roteiro é o começo do pipeline (roteiro → voz → render →
-    # corte → publicação). As tools de vídeo VIVEM na área `designer` (fonte única,
-    # não duplicar aqui). O wizz-social ROTEIA para elas pelo `when:`; a construção
-    # pesada de vídeo é com o wizz-designer:
+    # CLIs de vídeo: o roteiro é o começo do pipeline (roteiro → voz → timing →
+    # telas → montagem → corte → publicação). As tools de vídeo VIVEM na área
+    # `designer` (fonte única, não duplicar aqui). O wizz-social ROTEIA para elas
+    # pelo `when:`; a construção pesada de vídeo é com o wizz-designer. Cadeia e
+    # regra completa em src/modules/wizz/_shared/video-pipeline.md:
     #   voicebox     → narração/voz/TTS do roteiro
-    #   hyperframes  → renderizar vídeo de HTML/CSS (HTML→MP4)
+    #   ctc-align    → timestamps palavra a palavra da narração (fonte de timing)
+    #   hyperframes  → desenhar as TELAS (visual mudo, HTML→MP4)
+    #   remotion     → MONTAR o filme (áudio, SFX, legenda, timing de frame)
     #   buttercut    → editar/cortar o vídeo gravado (só darwin-arm64)
     #   claude-video → analisar um vídeo de referência (frames + transcrição)
 

package/src/modules/wizz/_shared/video-pipeline.md

@@ -0,0 +1,48 @@
+# Pipeline de Vídeo — quem faz o quê
+
+> Regra central (aprendida em produção, 2026-08-19): **HyperFrames desenha as telas
+> (visual mudo), Remotion monta o filme (áudio, SFX, legendas, timing de frame).**
+> Nunca entregar a montagem final com áudio ao HyperFrames.
+
+## Por que a divisão existe (falhas reais observadas)
+
+- **HyperFrames com áudio:** o posicionador de áudio falhou em produção (áudio ~2,76s
+  adiantado). Sem precisão de frame para narração, SFX e legenda.
+- **HyperFrames multi-tela:** CSS de uma tela vaza na outra. Ótimo para criar UMA cena
+  rápido (maqueta de WhatsApp/ChatGPT, gráfico animado); frágil para compor o filme.
+- **Remotion:** componentes React viram vídeo com precisão de frame em áudio, legenda e
+  timing. Mais trabalho para desenhar cena do zero; montagem confiável.
+
+## Decisão rápida
+
+| O pedido é... | Ferramenta |
+|---|---|
+| Desenhar/animar UMA tela ou cena (maqueta de app, gráfico, título) — visual mudo | `hyperframes` (skills + CLI) |
+| Vídeo curto SEM áudio sincronizado (loop, overlay, motion graphic mudo) | `hyperframes` |
+| Montar o filme: sequência de cenas + narração + SFX + legenda + timing de frame | **Remotion** (skill `remotion-best-practices`) |
+| Timestamps palavra a palavra da narração TTS (sincronizar legenda/corte/animação) | `ctc-align` |
+| Narração / voz / TTS / clonagem de voz | `voicebox` |
+| Editar/cortar footage gravado (cortes, selects, roughcut) | `buttercut` (só darwin-arm64) |
+| Analisar vídeo de referência existente (frames + transcrição) | `claude-video` |
+| Vídeo-ad gerado por IA (Sora/Veo/Kling) + publicar Meta | `arcads` (área ads) |
+
+## Cadeia completa (roteiro → publicação)
+
+1. **Roteiro** — wizz-social (blueprint viral) ou brief da área.
+2. **Voz** — `voicebox` gera a narração do roteiro.
+3. **Timing** — `ctc-align` extrai timestamps palavra a palavra da narração
+   (fonte única de timing; substitui Whisper e estimativa manual).
+4. **Telas** — `hyperframes` desenha cada cena visual, MUDA, isolada
+   (uma composição por cena evita o vazamento de CSS entre telas).
+5. **Montagem** — **Remotion** junta as cenas exportadas, coloca áudio, SFX e
+   legendas nos timestamps do ctc-align, com precisão de frame.
+6. **Corte fino** (se houver footage gravado) — `buttercut`.
+7. **Publicação/distribuição** — área social/ads.
+
+## Anti-padrões (não fazer)
+
+- Não usar HyperFrames para posicionar áudio, SFX ou legenda sincronizada.
+- Não compor várias telas num único projeto HyperFrames contando com isolamento
+  de CSS entre elas.
+- Não migrar composição Remotion funcional para HyperFrames "para padronizar":
+  a direção do pipeline é telas no HyperFrames, filme no Remotion.

package/src/modules/wizz/agents/wizz-designer/SKILL.md

@@ -25,7 +25,7 @@ Você é o Designer do Wizz. Cria interfaces e landing pages de alto nível, mos
 
 ## Como trabalho (ponte para skills globais)
 
-> **Fonte única (registry) — leia SEMPRE antes dos exemplos abaixo:** a lista real da sua área (`designer`) vive no `skills-registry.yaml`. Resolva primeiro a **fatia leve da sua área**, `{project-root}/_wizz/_config/registry/designer.yaml` (já vem como o bloco `areas.designer` completo — skills/mcps/clis/references); se faltar (install antigo), caia pro monólito na ordem `{project-root}/_wizz/_config/skills-registry.yaml` → `{project-root}/_wizz/skills-registry.yaml` → `{project-root}/skills-registry.yaml` e ache o bloco `areas.designer` lá dentro. Se precisar de algo cross-cutting (utility/mcp_utility/cli_utility/squads), leia também `{project-root}/_wizz/_config/registry/_shared.yaml`. Roteie pelo campo `when:` — `skills:` (invoque via `Skill`), `clis:` (rode o `check:`; se faltar, mostre o `install:`, opt-in; respeite `platform:` — ex. `buttercut` é só `darwin-arm64`) e `mcps:` (proponha `claude mcp add <id>` com o bloco `server`). **Portas de entrada (skills):** ofereça só as 3 skills com `entry: true` (direção → decision-maker, construção → ui-ux-pro-max, motion/assets → animate); as demais têm campo `door:` e só entram puxadas pela porta da camada delas ou por pedido explícito do usuário — nunca ofereça a lista inteira. Os exemplos abaixo são só um atalho legível; o registry é a verdade e pega o que for adicionado depois (ex. tools de vídeo: hyperframes, claude-video, buttercut, voicebox).
+> **Fonte única (registry) — leia SEMPRE antes dos exemplos abaixo:** a lista real da sua área (`designer`) vive no `skills-registry.yaml`. Resolva primeiro a **fatia leve da sua área**, `{project-root}/_wizz/_config/registry/designer.yaml` (já vem como o bloco `areas.designer` completo — skills/mcps/clis/references); se faltar (install antigo), caia pro monólito na ordem `{project-root}/_wizz/_config/skills-registry.yaml` → `{project-root}/_wizz/skills-registry.yaml` → `{project-root}/skills-registry.yaml` e ache o bloco `areas.designer` lá dentro. Se precisar de algo cross-cutting (utility/mcp_utility/cli_utility/squads), leia também `{project-root}/_wizz/_config/registry/_shared.yaml`. Roteie pelo campo `when:` — `skills:` (invoque via `Skill`), `clis:` (rode o `check:`; se faltar, mostre o `install:`, opt-in; respeite `platform:` — ex. `buttercut` é só `darwin-arm64`) e `mcps:` (proponha `claude mcp add <id>` com o bloco `server`). **Portas de entrada (skills):** ofereça só as 3 skills com `entry: true` (direção → decision-maker, construção → ui-ux-pro-max, motion/assets → animate); as demais têm campo `door:` e só entram puxadas pela porta da camada delas ou por pedido explícito do usuário — nunca ofereça a lista inteira. Os exemplos abaixo são só um atalho legível; o registry é a verdade e pega o que for adicionado depois (ex. tools de vídeo: hyperframes, claude-video, buttercut, voicebox, ctc-align). **Vídeo:** antes de escolher ferramenta, aplique `_shared/video-pipeline.md` — HyperFrames desenha as telas (visual mudo, uma cena por composição), Remotion monta o filme (áudio, SFX, legenda, timing de frame via ctc-align); nunca posicione áudio/legenda no HyperFrames.
 
 Para cada tarefa, **entre pela porta certa via a ferramenta `Skill`** e traga o resultado em linguagem fácil:
 - Decidir ANTES de construir (brief, direção visual, caminho de motion/3D) → `decision-maker` (puxa taste-skill, motion-3d-director)

package/src/modules/wizz/agents/wizz-maestro/SKILL.md

@@ -1,6 +1,6 @@
 ---
 name: wizz-maestro
-description: Wizz Method Orchestrator (Gerente). Use for complex/multi-area work inside a Wizz project — the Diretor (wizz-router) hands these to you. It coordinates the area agents, sequences the work across areas, and keeps the memory duty. Not for 1-area light tasks (those go straight to the area agent).
+description: Wizz Method Orchestrator (Gerente). Use for complex/multi-area work inside a Wizz project — the Diretor (wizz-router) hands these to you. It coordinates the area agents, sequences the work across areas, and keeps the memory duty. Not for 1-area light tasks (those go straight to the area agent). Use when a request spans 2+ areas, or touches 1 area with multi-step execution, upfront planning, or a deliverable worth recording in memory.
 ---
 
 # Maestro — Gerente / Orquestrador do Wizz Method

package/src/modules/wizz/agents/wizz-social/SKILL.md

@@ -1,6 +1,6 @@
 ---
 name: wizz-social
-description: Wizz Method Social e Roteiros Virais (persona Rafa). Use para roteiros de Reels/TikTok/Shorts, hooks virais, calendário de conteúdo e estratégia de social. Roteia para as skills globais social-content e content-strategy, e para as CLIs de vídeo (buttercut, hyperframes, voicebox, claude-video) quando o roteiro vira vídeo.
+description: Wizz Method Social e Roteiros Virais (persona Rafa). Use para roteiros de Reels/TikTok/Shorts, hooks virais, calendário de conteúdo e estratégia de social. Roteia para as skills globais social-content e content-strategy, e para o pipeline de vídeo (voicebox, ctc-align, hyperframes desenha as telas, Remotion monta o filme, buttercut, claude-video) quando o roteiro vira vídeo.
 ---
 
 # Social · Roteiros Virais e Conteúdo (persona Rafa)
@@ -59,13 +59,15 @@ Desambiguação: já tem roteiro aprovado da esteira 3D e quer os prompts por ce
 
 Esteira 3D completa (fim a fim): tema → roteiro (blueprint Seção 12) → prompts de imagem+animação (`prompts-imagem-video.md`) → geração nas CLIs de vídeo → legenda (`legenda-instagram.md`). A imagem de referência entra no início para fixar o estilo visual.
 
-Quando o roteiro vira vídeo (você roteia, não executa a edição):
-- **Editar/cortar** o vídeo gravado (cortes, selects, roughcut) → CLI `buttercut` (só Apple Silicon)
-- **Renderizar** vídeo de HTML/CSS/animação (HTML→MP4) → CLI `hyperframes`
+Quando o roteiro vira vídeo (você roteia, não executa a edição; cadeia completa em `_shared/video-pipeline.md`):
 - **Narração / voz / TTS** → CLI `voicebox`
+- **Timing** da narração (timestamps palavra a palavra p/ legenda e corte) → `ctc-align`
+- **Desenhar as telas** (cena visual muda em HTML/CSS, HTML→MP4) → CLI `hyperframes`
+- **Montar o filme** (áudio, SFX, legenda, timing de frame) → **Remotion** (skill `remotion-best-practices`); nunca posicionar áudio/legenda no hyperframes
+- **Editar/cortar** o vídeo gravado (cortes, selects, roughcut) → CLI `buttercut` (só Apple Silicon)
 - **Analisar** um vídeo de referência (frames + transcrição) → CLI `claude-video`
 
-Essas CLIs pertencem à área `designer` no registry. Você aponta a etapa certa do pipeline (roteiro → voz → render → corte); a construção pesada de vídeo é com o **wizz-designer**.
+Essas tools pertencem à área `designer` no registry. Você aponta a etapa certa do pipeline (roteiro → voz → timing → telas → montagem → corte); a construção pesada de vídeo é com o **wizz-designer**.
 
 ## Formato de entrega do roteiro
 ```

package/src/skills-lib/ai-product-design/SKILL.md

@@ -6,7 +6,9 @@ description: >
   agente/assistente/chatbot, escrever ou revisar system prompt, definir persona/tom/voz, montar few-shot,
   chain-of-thought, guardrails, recusas, escalonamento pra humano, handoff entre agentes, detecção de
   frustração, generative UI, ou medir qualidade de saída de IA. Base: Owl-Listener/ai-design-skills (MIT).
-  44 padrões em 6 categorias, cada um detalhado em references/.
+  44 padrões em 6 categorias, cada um detalhado em references/. Use quando o pedido mencionar system
+  prompt, persona de agente, guardrails, orquestração multi-agente, handoff entre agentes ou avaliação
+  de qualidade de IA.
 ---
 
 # AI Product Design — 44 padrões

package/src/skills-lib/algorithmic-art/SKILL.md

@@ -1,6 +1,6 @@
 ---
 name: algorithmic-art
-description: Creating algorithmic art using p5.js with seeded randomness and interactive parameter exploration. Use this when users request creating art using code, generative art, algorithmic art, flow fields, or particle systems. Create original algorithmic art rather than copying existing artists' work to avoid copyright violations.
+description: Creating algorithmic art using p5.js with seeded randomness and interactive parameter exploration. Use this when users request creating art using code, generative art, algorithmic art, flow fields, or particle systems. Create original algorithmic art rather than copying existing artists' work to avoid copyright violations. Use when the user asks for generative art, code art, p5.js sketches, flow fields, particle systems, or an interactive algorithmic-art artifact.
 license: Complete terms in LICENSE.txt
 ---
 

package/src/skills-lib/animate/SKILL.md

@@ -1,6 +1,6 @@
 ---
 name: animate
-description: Animation patterns and best practices for Next.js/React applications. Use this skill when implementing animations, transitions, hover effects, page transitions, modals, or any motion in React components. Based on Emil Kowalski's "Animations on the Web" course.
+description: Animation patterns and best practices for Next.js/React applications. Use this skill when implementing animations, transitions, hover effects, page transitions, modals, or any motion in React components. Based on Emil Kowalski's "Animations on the Web" course. Use when the user asks to add hover effects, transitions, page transitions, modals, or any motion to a Next.js or React component.
 ---
 
 # Next.js Animations

package/src/skills-lib/auth-and-secrets/SKILL.md

@@ -4,7 +4,8 @@ description: >
   Segurança de autenticação e gestão de secrets. Usar quando: implementar auth, lidar com JWT/OAuth/SSO,
   token no header vs URL, revogação de token no logout, enumeração de usuário/mensagem genérica,
   guardar API keys ou credenciais, configurar Clerk/Supabase auth, revisar onde secrets estão armazenados,
-  rotação de credenciais, checar se .env está seguro.
+  rotação de credenciais, checar se .env está seguro. Use quando o usuário mencionar login, cadastro,
+  senha, JWT, OAuth, SSO, 2FA, sessão, logout, API key ou variável de ambiente/.env.
 ---
 
 # Auth and Secrets

package/src/skills-lib/canvas-design/SKILL.md

@@ -1,6 +1,6 @@
 ---
 name: canvas-design
-description: Create beautiful visual art in .png and .pdf documents using design philosophy. You should use this skill when the user asks to create a poster, piece of art, design, or other static piece. Create original visual designs, never copying existing artists' work to avoid copyright violations.
+description: Create beautiful visual art in .png and .pdf documents using design philosophy. You should use this skill when the user asks to create a poster, piece of art, design, or other static piece. Create original visual designs, never copying existing artists' work to avoid copyright violations. Use when the user asks for a poster, art piece, print design, or other static visual output as a .png or .pdf.
 license: Complete terms in LICENSE.txt
 ---
 

package/src/skills-lib/cerebro/SKILL.md

@@ -9,6 +9,8 @@ description: >
   usuário entre Claude Code, Codex e qualquer outro agente.
   CONTEXT.md no repo é o espelho do vault para agentes cloud (Codex). Fluxo: Codex atualiza
   CONTEXT.md → usuário roda /sync no Claude Code → vault atualizado.
+  Use quando o usuário digitar um desses comandos de barra ou mencionar memória, sessão,
+  decisão, ideia de conteúdo, prospect ou sincronização do cérebro.
 ---
 
 # Cérebro — Sistema de Memória Persistente

package/src/skills-lib/copywriting/references/copy-frameworks.md

@@ -326,9 +326,12 @@ Each step should be:
 - **Outcome-oriented**: What they get from this step
 
 Example:
+
+```text
 1. Connect your tools (takes 2 minutes)
 2. Set your preferences
 3. Get automated reports every Monday
+```
 
 ### Testimonial Selection
 

package/src/skills-lib/ctc-align/SKILL.md

@@ -0,0 +1,60 @@
+---
+name: ctc-align
+description: Timestamps palavra a palavra confiáveis para narração TTS via alinhamento forçado (ctc-forced-aligner + âncora nos silêncios reais). Usar SEMPRE antes de definir tempo de legenda, corte de cena, animação ou elemento sincronizado com fala em qualquer vídeo (HyperFrames ou outro editor). Substitui o Whisper como fonte de timing quando o texto do roteiro é conhecido. Gatilhos - sincronizar legenda, timing de cena, alinhar áudio e texto, palavra a palavra, forced alignment, legenda karaokê, corrigir sync de vídeo. Use quando o roteiro exato da narração for conhecido e for preciso decidir timing de legenda, corte de cena ou animação sincronizada com a fala.
+---
+
+# ctc-align — timing de fala como fonte única de verdade
+
+## Quando usar
+
+Sempre que um vídeo tiver narração cujo TEXTO é conhecido (roteiro de TTS, VSL,
+explainer) e for preciso decidir QUANDO algo aparece: legenda, corte de cena,
+animação, texto na tela.
+
+**Regra do método: nunca estimar tempo à mão e nunca confiar no timestamp do Whisper.**
+O Whisper adivinha as palavras e deriva (medido: até 6s); interpolação proporcional
+entre silêncios desloca palavras para o bloco vizinho. O alinhamento CTC recebe o texto
+exato e só procura onde cada palavra está: precisão de dezenas de ms.
+
+## Instalação (uma vez por projeto)
+
+    mkdir -p tools/ctc-align && cd tools/ctc-align
+    uv venv --python 3.12 .venv
+    uv pip install --python .venv/bin/python "git+https://github.com/MahmoudAshraf97/ctc-forced-aligner.git"
+
+Copiar o `scripts/align.py` desta skill para `tools/ctc-align/align.py`.
+Roda em CPU (Mac ARM ok, sem CUDA). Primeiro uso baixa o modelo MMS (~1GB).
+
+## Uso
+
+1. Gerar um .txt com o roteiro EXATO que o TTS falou (texto corrido; se o TTS falou
+   diferente do escrito, usar o que foi FALADO).
+2. Rodar:
+
+    tools/ctc-align/.venv/bin/python tools/ctc-align/align.py narracao.mp3 roteiro.txt transcript.json
+
+Saída: JSON [{"text","start","end","score"}] por palavra, bordas já encostadas nos
+silêncios reais (silencedetect embutido). Score perto de 0 = confiável; o helper avisa
+palavras com score < -1.0 (conferir de ouvido).
+
+## Como converter em tempos de cena/legenda
+
+- Legenda: usar start/end da palavra direto.
+- Corte de cena/elemento: âncora = start da PRIMEIRA palavra da frase que o elemento
+  ilustra. Buscar a palavra de forma MONOTÔNICA (cada âncora procurada a partir da
+  anterior), nunca busca global — palavra repetida ("10", "bónus") pega ocorrência errada.
+- Duração mínima de cena: 1,2s; se a frase for mais curta, empurrar a próxima cena
+  dentro da própria frase dela.
+- Nada aparece antes de ser mencionado; nada continua depois que o assunto mudou.
+
+## QA obrigatório antes do render
+
+Nenhuma palavra pode sobrepor o miolo de um silêncio real, e cada fim de frase do
+roteiro deve terminar num silêncio. Medir isso, não o desvio de âncoras que o próprio
+método criou. Áudio concatenado de blocos: alinhar bloco a bloco ou conferir fronteiras.
+
+## Limitações honestas
+
+- Precisa do texto exato; não transcreve. Áudio sem roteiro: transcrever com Whisper,
+  revisar o texto à mão e SÓ ENTÃO alinhar com este fluxo.
+- Acentos exigem a flag --romanize (o helper já passa).

package/src/skills-lib/ctc-align/scripts/align.py

@@ -0,0 +1,65 @@
+# -*- coding: utf-8 -*-
+"""align.py — timestamps palavra a palavra CONFIÁVEIS para narração TTS.
+
+Uso:
+    .venv/bin/python align.py <audio.mp3> <texto.txt> [saida.json]
+
+1. Roda o ctc-forced-aligner (MMS/CTC) com o TEXTO EXATO do roteiro.
+2. Encosta as bordas das palavras nos silêncios reais (ffmpeg silencedetect):
+   palavra que termina dentro de um silêncio termina onde o silêncio começa;
+   palavra que começa dentro de um silêncio começa onde o silêncio termina.
+3. Grava JSON [{"text","start","end","score"}].
+"""
+import json, re, subprocess, sys, os
+
+def silencios(audio, noise="-35dB", dur=0.30):
+    out = subprocess.run(["ffmpeg","-hide_banner","-i",audio,
+        "-af",f"silencedetect=noise={noise}:d={dur}","-f","null","-"],
+        capture_output=True, text=True).stderr
+    starts = [float(x) for x in re.findall(r"silence_start: ([\d.]+)", out)]
+    ends   = [float(x) for x in re.findall(r"silence_end: ([\d.]+)", out)]
+    return list(zip(starts, ends))
+
+def alinhar(audio, texto_path):
+    here = os.path.dirname(os.path.abspath(__file__))
+    cli = os.path.join(here, ".venv", "bin", "ctc-forced-aligner")
+    r = subprocess.run([cli, "--audio_path", audio, "--text_path", texto_path,
+        "--language", "por", "--split_size", "word", "--romanize",
+        "--device", "cpu"], capture_output=True, text=True)
+    saida = os.path.splitext(audio)[0] + ".json"
+    if not os.path.exists(saida):
+        sys.exit(f"aligner falhou:\n{r.stderr[-1500:]}")
+    d = json.load(open(saida))
+    segs = d if isinstance(d, list) else d["segments"]
+    for ext in (".json", ".txt"):
+        p = os.path.splitext(audio)[0] + ext
+        if os.path.exists(p): os.remove(p)
+    return segs
+
+def encostar(segs, sils):
+    novo = []
+    for w in segs:
+        s, e = w["start"], w["end"]
+        for ss, se in sils:
+            if ss <= s <= se: s = se
+            if ss <= e <= se: e = ss
+            if s < ss and e > se: e = ss
+        if e <= s: e = s + 0.05
+        novo.append({"text": w["text"], "start": round(s,3), "end": round(e,3),
+                     "score": round(w.get("score",0),4)})
+    return novo
+
+if __name__ == "__main__":
+    if len(sys.argv) < 3:
+        sys.exit(__doc__)
+    audio, texto = sys.argv[1], sys.argv[2]
+    destino = sys.argv[3] if len(sys.argv) > 3 else os.path.splitext(audio)[0] + ".alinhado.json"
+    segs = alinhar(audio, texto)
+    sils = silencios(audio)
+    novo = encostar(segs, sils)
+    json.dump(novo, open(destino,"w",encoding="utf-8"), ensure_ascii=False, indent=1)
+    ruins = [w for w in novo if w["score"] < -1.0]
+    print(f"{len(novo)} palavras -> {destino} | {len(sils)} silencios usados como ancora")
+    if ruins:
+        print(f"atencao: {len(ruins)} palavras com score baixo (conferir): " +
+              ", ".join(f"{w['text']}@{w['start']:.1f}" for w in ruins[:8]))

package/src/skills-lib/database-and-deps/SKILL.md

@@ -3,7 +3,8 @@ name: database-and-deps
 description: >
   Segurança de banco de dados e dependências. Usar quando: revisar queries de banco, checar SQL injection,
   auditar permissões de banco, criptografar PII, revisar pacotes vulneráveis, configurar Dependabot/Renovate,
-  auditar RPCs Supabase, verificar menor privilégio no banco.
+  auditar RPCs Supabase, verificar menor privilégio no banco. Use quando o usuário mencionar SQL,
+  query builder, RPC do Supabase, npm/pnpm audit, Dependabot, pacotes vulneráveis, PII no banco ou lock file.
 ---
 
 # Database and Dependencies Security

package/src/skills-lib/decision-maker/SKILL.md

@@ -1,6 +1,6 @@
 ---
 name: decision-maker
-description: Walk a founder or designer through building a sharp visual brief for a website project, then output four ready-to-use prompts for downstream AI tools (Copywriter, 3D/Illustration, Design, Developer) plus GitHub + Vercel launch instructions. Use this skill whenever a user wants to brief a website, build a landing page with AI, create a visual direction, define a brand brief, or says anything like "I want to build a site with Claude," "help me write a brief," "I want to make a premium website," "guide me through a website project," or starts a slash command like `/start`, `/decision`, `/references`, `/extract`, or `/output`. Trigger even when the user just describes a project they want to build without explicitly asking for a brief — the skill turns vague intent into a structured, executable visual direction.
+description: Walk a founder or designer through building a sharp visual brief for a website project, then output four ready-to-use prompts for downstream AI tools (Copywriter, 3D/Illustration, Design, Developer) plus GitHub + Vercel launch instructions. Use this skill whenever a user wants to brief a website, build a landing page with AI, create a visual direction, define a brand brief, or says anything like "I want to build a site with Claude," "help me write a brief," "I want to make a premium website," "guide me through a website project," or starts a slash command like `/start`, `/decision`, `/references`, `/extract`, or `/output`. Trigger even when the user just describes a project they want to build without explicitly asking for a brief — the skill turns vague intent into a structured, executable visual direction. Use when the user wants to brief a website, define a visual direction, or plan a landing page before building it with AI.
 ---
 
 # Decision Maker

package/src/skills-lib/desktop-security/SKILL.md

@@ -3,7 +3,8 @@ name: desktop-security
 description: >
   Segurança para apps desktop e Electron. Usar quando: desenvolver app Electron, configurar contextIsolation/IPC,
   implementar code signing, armazenar tokens/credenciais localmente, configurar auto-update seguro,
-  distribuir app para macOS/Windows.
+  distribuir app para macOS/Windows. Use quando o usuário mencionar Electron, IPC, contextBridge,
+  preload script, safeStorage, code signing, notarização ou auto-update.
 ---
 
 # Desktop Security

package/src/skills-lib/enhance-prompt/SKILL.md

@@ -1,6 +1,6 @@
 ---
 name: enhance-prompt
-description: Transforms vague UI ideas into polished, Stitch-optimized prompts. Enhances specificity, adds UI/UX keywords, injects design system context, and structures output for better generation results.
+description: Transforms vague UI ideas into polished, Stitch-optimized prompts. Enhances specificity, adds UI/UX keywords, injects design system context, and structures output for better generation results. Use when the user wants to polish a UI prompt before sending it to Stitch, improve a prompt that produced poor results, or turn a vague UI idea into a structured, design-system-aware prompt.
 allowed-tools:
   - "Read"
   - "Write"

package/src/skills-lib/graphify/SKILL.md

@@ -1,6 +1,6 @@
 ---
 name: graphify
-description: any input (code, docs, papers, images) → knowledge graph → clustered communities → HTML + JSON + audit report
+description: any input (code, docs, papers, images) → knowledge graph → clustered communities → HTML + JSON + audit report. Use when the user runs /graphify, wants to turn a codebase or folder into a knowledge graph, or needs to query, explore, or visualize relationships across files.
 trigger: /graphify
 ---
 

package/src/skills-lib/huashu-design/SKILL.md

@@ -1,6 +1,6 @@
 ---
 name: huashu-design
-description: 花叔Design——用HTML做高保真原型、交互Demo、幻灯片、动画、设计变体探索+设计方向顾问+专家评审。根据任务embody对应专家（UX/动画师/幻灯片设计师/原型师），避免web design tropes。触发词：做原型、交互原型、HTML演示、动画Demo、设计变体、hi-fi设计、UI mockup、prototype、做个HTML页面、做个可视化、app原型、iOS原型、导出MP4/GIF、60fps视频、设计风格、设计方向、配色方案、推荐风格、选个风格、做个好看的、评审、好不好看、review this design、带解说的动画、解说视频、长视频科普、voiceover、narration、5分钟讲清楚什么是XX。需求模糊时进设计方向顾问（三套逻辑并行出3版真实视觉，HTML原生40种风格库网页20+PPT20为弹药）；另含品牌资产协议、反AI slop、Junior工作流、Tweaks变体、动画→MP4/GIF导出、带解说长视频pipeline、5维评审。
+description: 花叔Design——用HTML做高保真原型、交互Demo、幻灯片、动画、设计变体探索+设计方向顾问+专家评审。根据任务embody对应专家（UX/动画师/幻灯片设计师/原型师），避免web design tropes。触发词：做原型、交互原型、HTML演示、动画Demo、设计变体、hi-fi设计、UI mockup、prototype、做个HTML页面、做个可视化、app原型、iOS原型、导出MP4/GIF、60fps视频、设计风格、设计方向、配色方案、推荐风格、选个风格、做个好看的、评审、好不好看、review this design、带解说的动画、解说视频、长视频科普、voiceover、narration、5分钟讲清楚什么是XX。需求模糊时进设计方向顾问（三套逻辑并行出3版真实视觉，HTML原生40种风格库网页20+PPT20为弹药）；另含品牌资产协议、反AI slop、Junior工作流、Tweaks变体、动画→MP4/GIF导出、带解说长视频pipeline、5维评审。Use when 用户提到做HTML原型、交互Demo、幻灯片设计、动画Demo、设计变体探索或设计评审。
 ---
 
 # 花叔Design · Huashu-Design

package/src/skills-lib/inicio-de-projeto/SKILL.md

@@ -5,6 +5,8 @@ description: >
   precisar de padrões de arquitetura, definir estrutura de pastas, estabelecer regras de código, começar um app SaaS/produto,
   onboarding de desenvolvedor no projeto. Contém princípios de produto, padrões arquiteturais P0-P3, regras de código,
   stack (Next.js + Supabase + Clerk + Zod), estrutura de pastas e checklist de início.
+  Use quando o pedido for começar um projeto novo, criar um módulo/feature do zero, ou definir
+  arquitetura, stack e estrutura de pastas antes de codar.
 ---
 
 # Início de Projeto — Padrões de Engenharia

package/src/skills-lib/premium-landing-ui-researcher/SKILL.md

@@ -1,6 +1,6 @@
 ---
 name: premium-landing-ui-researcher
-description: Pesquisar animações, componentes, referências visuais e padrões de conversão para criar landing pages premium em React, Next.js, Tailwind, shadcn/ui, Framer Motion, Three.js e React Three Fiber. Use esta skill quando o usuário pedir para analisar um projeto existente, classificar o nível de complexidade do site (básico, intermediário, avançado, 3D high-end com modo Signature), escolher componentes ou animações adequados, melhorar uma UI genérica, criar uma landing page completa, transformar uma oferta em página estratégica, projetar também um dashboard SaaS junto da landing, criar um site de autoridade/portfolio para agência, estúdio, consultoria, marca pessoal ou lead passivo, criar case studies e selected work editoriais, criar uma experiência 3D cinematográfica para marcas premium, buscar referências em React Bits, Cult UI, Componentry, Animmaster Lib, Ali Imam, Watermelon UI, StyleUI, Bklit UI, Refero, Impeccable, Taste Skill, Design Motion Principles, MotionSites, Vibe Code Components, Landing Love, Godly, Design Spells, Mobbin, ScreensDesign, DesignVault, Spline, Unicorn Studio, Skiper UI, 21st.dev (Magic MCP ou 21st CLI), escolher entre GSAP, anime.js e Framer Motion para animações e scroll storytelling, ou implementar uma experiência visual sofisticada orientada à conversão ou à autoridade.
+description: Pesquisar animações, componentes, referências visuais e padrões de conversão para criar landing pages premium em React, Next.js, Tailwind, shadcn/ui, Framer Motion, Three.js e React Three Fiber. Use quando o pedido envolver analisar projeto existente; classificar nível de complexidade do site (básico a 3D high-end/Signature); escolher componentes/animações; melhorar UI genérica; criar landing page completa, transformar oferta em página estratégica, dashboard SaaS, site de autoridade/portfolio (agência, estúdio, consultoria, marca pessoal, lead passivo), case studies/selected work editoriais, ou experiência 3D cinematográfica para marcas premium; buscar referências em fontes premium (React Bits, Cult UI, Watermelon UI, Skiper UI, 21st.dev via Magic MCP/CLI, outras em references/component-sources.md); ou escolher motion engine (GSAP, anime.js, Framer Motion, Three.js/R3F) para scroll storytelling.
 ---
 
 # Premium Landing UI Researcher

package/src/skills-lib/react-components/SKILL.md

@@ -1,6 +1,6 @@
 ---
 name: react-components
-description: Converts Stitch designs into modular Vite and React components using system-level networking and AST-based validation.
+description: Converts Stitch designs into modular Vite and React components using system-level networking and AST-based validation. Use when the user wants to turn a Stitch design/screen into React components, or mentions the Stitch MCP, Vite scaffolding, or AST-based component validation.
 allowed-tools:
   - "stitch*:*"
   - "Bash"

package/src/skills-lib/remotion-best-practices/SKILL.md

@@ -1,6 +1,6 @@
 ---
 name: remotion-best-practices
-description: Best practices for Remotion - Video creation in React
+description: Best practices for Remotion - Video creation in React. Use when assembling the final video with audio, SFX, captions, or frame-accurate timing, or for any Remotion (React) code.
 metadata:
   tags: remotion, video, react, animation, composition
 ---

package/src/skills-lib/supabase-postgres-best-practices/SKILL.md

@@ -1,6 +1,6 @@
 ---
 name: supabase-postgres-best-practices
-description: Postgres performance optimization and best practices from Supabase. Use this skill when writing, reviewing, or optimizing Postgres queries, schema designs, or database configurations.
+description: Postgres performance optimization and best practices from Supabase. Use this skill when writing, reviewing, or optimizing Postgres queries, schema designs, or database configurations. Use when the user asks about missing indexes, connection pooling, RLS performance, N+1 queries, or Postgres/Supabase schema design.
 license: MIT
 metadata:
   author: supabase

package/src/skills-lib/taste-redesign/SKILL.md

@@ -1,6 +1,6 @@
 ---
 name: taste-redesign
-description: Upgrades existing websites and apps to premium quality. Audits current design, identifies generic AI patterns, and applies high-end design standards without breaking functionality. Works with any CSS framework or vanilla CSS.
+description: Upgrades existing websites and apps to premium quality. Audits current design, identifies generic AI patterns, and applies high-end design standards without breaking functionality. Works with any CSS framework or vanilla CSS. Use when the user asks to redesign, upgrade, or audit an existing site or app that looks generic or AI-generated, without rewriting it from scratch.
 ---
 
 # Redesign Skill

package/src/skills-lib/ui-ux-pro-max/SKILL.md

@@ -1,6 +1,6 @@
 ---
 name: ui-ux-pro-max
-description: "UI/UX design intelligence. 67 styles, 96 palettes, 57 font pairings, 25 charts, 13 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui). Actions: plan, build, create, design, implement, review, fix, improve, optimize, enhance, refactor, check UI/UX code. Projects: website, landing page, dashboard, admin panel, e-commerce, SaaS, portfolio, blog, mobile app, .html, .tsx, .vue, .svelte. Elements: button, modal, navbar, sidebar, card, table, form, chart. Styles: glassmorphism, claymorphism, minimalism, brutalism, neumorphism, bento grid, dark mode, responsive, skeuomorphism, flat design. Topics: color palette, accessibility, animation, layout, typography, font pairing, spacing, hover, shadow, gradient. Integrations: shadcn/ui MCP for component search and examples."
+description: "UI/UX design intelligence. 67 styles, 96 palettes, 57 font pairings, 25 charts, 13 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui). Actions: plan, build, create, design, implement, review, fix, improve, optimize, enhance, refactor, check UI/UX code. Projects: website, landing page, dashboard, admin panel, e-commerce, SaaS, portfolio, blog, mobile app, .html, .tsx, .vue, .svelte. Elements: button, modal, navbar, sidebar, card, table, form, chart. Styles: glassmorphism, claymorphism, minimalism, brutalism, neumorphism, bento grid, dark mode, responsive, skeuomorphism, flat design. Topics: color palette, accessibility, animation, layout, typography, font pairing, spacing, hover, shadow, gradient. Integrations: shadcn/ui MCP for component search and examples. Use when the user asks to design, build, or review UI/UX, pick a color palette or font pairing, or style a component like a button, modal, navbar, or card."
 ---
 # UI/UX Pro Max - Design Intelligence
 

package/src/skills-lib/web-security/SKILL.md

@@ -5,6 +5,7 @@ description: >
   adicionar endpoint de API, lidar com input de usuário, configurar headers, CSP, rate limiting, CORS, clickjacking,
   IDOR, SQL injection, vazamento de PII/dados na resposta, enumeração de usuário, OWASP Top 10.
   Inclui triagem de falhas recorrentes de pentest + checklist das 8 vulnerabilidades e exemplos para Next.js + Supabase + Clerk.
+  Use quando o usuário pedir auditoria de segurança ou revisão pré-deploy, ou mencionar CORS, CSP, rate limiting, IDOR ou OWASP.
 ---
 
 # Web Security (OWASP Top 10)

package/src/skills-lib/wizz-router/references/routing-table-flat.md

@@ -44,7 +44,9 @@ Use esta tabela **só fora de projeto Wizz** (sem `_wizz/`), quando o router map
 | Animação, motion, vídeo programático em código, Remotion, Three.js, 3D, WebGL | `motion-3d-director` + `remotion-best-practices` | 1 |
 | Craft de animação/micro-interação, easing, timing, reduced-motion, "essa animação travou/tá ruim" | `animate` + `design-motion-principles` | 2 |
 | Gerar imagem por código: carrossel, quote card, infográfico (PNG/PDF editável), fundo/textura generativa de hero | `canvas-design` + `algorithmic-art` | 2 |
-| Renderizar vídeo de HTML/CSS (HTML→MP4, agent-native) | CLI `hyperframes` (registry designer; `npx skills add heygen-com/hyperframes`) | 2 |
+| **Vídeo com áudio, narração, SFX ou legenda sincronizada** (montagem do filme) | `remotion-best-practices` (Remotion monta; timing de frame). Regra do pipeline: HyperFrames desenha as telas mudas, Remotion monta o filme — não usar hyperframes para posicionar áudio/legenda (drift de ~2,76s e CSS vazando entre telas em produção) | 1 |
+| Desenhar TELA/cena de vídeo em HTML/CSS, visual mudo (maqueta de app, gráfico animado, título, loop; HTML→MP4) | CLI `hyperframes` (registry designer; `npx skills add heygen-com/hyperframes`) — só telas mudas; montagem com áudio vai pro Remotion (linha acima) | 2 |
+| Timestamps palavra a palavra de narração TTS (sincronizar legenda/corte/animação com a fala) | `ctc-align` (registry designer; fonte única de timing, substitui Whisper) | 2 |
 | **Editar/cortar vídeo** (cortes, selects, roughcut) | CLI `buttercut` (registry designer; **só Apple Silicon**, clone-and-run no projeto, deps pesadas) | 1 |
 | Gerar vídeo-ad/imagem por IA (Sora/Veo/Kling) + publicar Meta | CLI `arcads` (registry `ads`; git clone + Arcads API key) | 1 |
 | Analisar/entender vídeo existente (frames + transcrição) | CLI `claude-video` (registry designer; `npx skills add bradautomates/claude-video`) | 2 |