primocode 10.12.0 → 10.14.0

package/lib/estudio/dados/projetos/clube-letra-seis-mundos.json

@@ -0,0 +1,100 @@
+{
+  "id": "clube-letra-seis-mundos",
+  "titulo": "Seis mundos num loop",
+  "categoria": "sound",
+  "resumo": "edit de música quadrado de 8,4 s tocado duas vezes (16,8 s), sem narração, em que cada frase ganha um mundo e uma fonte próprios: manuscrito numa folha de caderno, pixel 3D num túnel de papel rasgado, gótica com fogo atrás de um machado em chamas, texto em arco em volta de um olho 3D, uma frase que cai com rastro e uma lente preta que se abre de uma linha. As transições são objetos que atravessam a tela, e o fim some no preto de onde o começo nasce, então o loop não tem emenda. Tudo é montado por um script do After Effects (`cenas.jsx`), sem modelo 3D e sem imagem gerada por IA. Feito pelo Clube do Motion a partir de um reel de @illdari.",
+  "indicado": "edit de letra de música, reel curto em loop, vinheta de abertura, estudo de tipografia cinética para quem quer variedade de técnicas num vídeo só.",
+  "estilo": [
+    "tipografia cinética",
+    "um mundo e uma fonte por frase",
+    "objeto que atravessa como transição",
+    "flash invertido e vermelho",
+    "loop sem emenda"
+  ],
+  "ficha": {
+    "formato": "1080×1080, 30 qps, desfoque de movimento ligado (obturador 360°, 16 amostras)",
+    "duracao": "16,8 s (505 quadros): o ciclo de 8,4 s tocado duas vezes, sem narração",
+    "motor": "ae",
+    "voz": "ver o guia de estilo",
+    "musica": "ver o guia de estilo",
+    "fontes": "Segoe Print, Arial Black, Roboto Condensed Bold e SF Pro Display Bold e Heavy no AE; Pixelify Sans e UnifrakturMaguntia nos PNGs (os arquivos estão em `assets/fontes/`)"
+  },
+  "ferramentas": [
+    "Claude Code",
+    "After Effects"
+  ],
+  "ficha_tecnica": {
+    "Duração": "16,8 s (505 quadros): o ciclo de 8,4 s tocado duas vezes, sem narração",
+    "Formato": "1080×1080, 30 qps, desfoque de movimento ligado (obturador 360°, 16 amostras)",
+    "Ferramenta": "After Effects: um script ExtendScript (`cenas.jsx`) cria um projeto novo, monta 6 cenas, a comp `LOOP` e a `RECRIACAO`, salva o `.aep` e grava os eventos de som",
+    "Substituições": "machado em PNG 2.5D desenhado por código com brilho de fogo; olho com CC Sphere sobre uma textura feita por código; pixel 3D com 14 camadas de extrusão; fogo com Turbulent Displace e Glow",
+    "Assets": "folha pautada, três anéis de papel rasgado, textura do olho, machado e palavras em pixel e gótica, todos gerados pelo `fazer_assets.py`; glifo do X (Simple Icons)",
+    "Fontes": "Segoe Print, Arial Black, Roboto Condensed Bold e SF Pro Display Bold e Heavy no AE; Pixelify Sans e UnifrakturMaguntia nos PNGs (os arquivos estão em `assets/fontes/`)",
+    "Som": "música comercial em trecho de 8,4 s repetido (fica fora do pacote), efeitos por evento e tonais no tom da música, mixados pela Mesa a −14 LUFS",
+    "Referência": "reel de letra em loop, de @illdari (02/10/2026)",
+    "Arquivo final": "MP4 H.264 com áudio AAC"
+  },
+  "etapas": [
+    {
+      "titulo": "O roteiro",
+      "texto": "**Resumo:** o vídeo não tem narração; o roteiro é a ordem dos mundos e o tempo de cada frase num ciclo de 8,4 s, tirados do `cenas.jsx`. As frases são curtas, nossas e trocáveis no bloco de textos do gerador. Com outra música, mantenha a regra: um mundo e uma fonte por frase, e cada troca num tempo forte.\n\n## De onde veio a estrutura\n\nO reel estudado é um edit de 8,4 s postado duas vezes no mesmo arquivo. Cada frase tem o seu mundo, e objetos físicos fazem as transições. Este projeto mantém os seis mundos, os tempos e as transições, com frases sobre o ofício de motion e todos os objetos desenhados por código.\n\n## Mundos (um ciclo; o segundo é igual, 8,4 s depois)\n\n | \n\n | Tempo (s)\n | Mundo\n | Texto (bloco `TEXTOS`)\n | O que acontece\n\n | 0,00–1,05\n | escuro\n | —\n | lascas de papel cruzam; a folha de caderno vem girando para a luz do spot\n\n | 1,05–1,80\n | folha\n | `manuscrito` e `queima`\n | a frase é escrita à mão e a última palavra pega fogo; a câmera mergulha na folha\n\n | 1,73–2,82\n | túnel de papel\n | três palavras em pixel (`PIXEL`)\n | anéis de papel rasgado giram em sentidos opostos; cada palavra nasce do centro girando, a primeira com aberração cromática\n\n | 2,82–3,05\n | machado\n | —\n | o machado em chamas varre de baixo e estica o túnel\n\n | 3,03–3,87\n | fogo\n | duas frases góticas (`GOTICO`)\n | brasas sobem; o machado balança na frente das frases e as esconde\n\n | 3,87–4,10\n | clarões\n | —\n | dois quadros invertidos e dois quadros vermelhos\n\n | 4,10–4,75\n | letras soltas\n | seis letras góticas\n | o machado deita e as letras flutuam em volta; tudo voa para fora\n\n | 4,77–5,55\n | olho\n | `arco`\n | o olho recua até aparecer inteiro sobre branco; a frase nasce letra a letra no arco e a íris olha em volta\n\n | 5,55–6,15\n | X\n | —\n | o arco gira até virar rastro, o olho vira o círculo preto do X, que estica em pílula e borra para baixo\n\n | 6,12–6,53\n | queda\n | `queda`\n | a frase despenca do topo com rastro vertical e assenta com sombra longa\n\n | 6,53–7,12\n | lente\n | `lente1` e `lente2`\n | a lente preta abre de uma linha e curva a frase de cima; as duas palavras trocam dentro dela\n\n | 7,05–7,25\n | desmonte\n | `rola`\n | a palavra se desfaz em pedaços que caem\n\n | 7,25–8,40\n | final\n | `fecho` e `fundo`\n | o fecho entra com rastro horizontal, a palavra gigante desliza ao fundo e tudo encolhe até sumir no preto\n\n## Momentos para o som\n\nEventos gravados pelo `cenas.jsx` em `audio/eventos.json`, repetidos no segundo ciclo:\n\n- 0,40 s folha; 1,05 s caneta; 1,33 s fogo acendendo; 1,62 s mergulho.\n\n- 1,73 s golpe na primeira palavra do túnel; 2,03 e 2,37 s pops nas outras.\n\n- 2,84 s chicote do machado; 3,05 s fogo; 3,30 s troca de frase; 3,87 s flash; 4,00 s impacto; 4,10 s letras; 4,60 s saída.\n\n- 4,77 s recuo do olho; 5,00 s letras do arco; 5,55 s giro; 5,76 s morph no X; 5,92 s estica.\n\n- 6,13 s queda; 6,53 s lente abrindo; 6,84 s troca de palavra.\n\n- 7,05 s entrada; 7,26 s glitch no desmonte; 7,27 s fecho; 8,31 s encolhe."
+    },
+    {
+      "titulo": "A identidade visual",
+      "texto": "**Resumo:** papel creme (`#EAE3D6`) com spot no escuro, fogo laranja (`#FF6A12`) sobre preto quente (`#110600`), clarão vermelho (`#8D0405`), olho sobre branco puro e final em preto. Uma fonte por mundo e desfoque direcional forte nas entradas. Números tirados do `cenas.jsx`.\n\n## Palco\n\n | \n\n | Peça\n | Como é\n\n | Tela\n | 1080×1080, 30 qps, desfoque de movimento com obturador 360°, fase −180° e 16 amostras\n\n | Montagem\n | seis comps na `LOOP` (8,4 s): `FOLHA` 0–53 qd, `TUNEL` 52–91, `FOGO` 85–143, `OLHO` 143–186, `QUEDA` 183–214, `FINAL` 212–252; a `RECRIACAO` toca o `LOOP` em 0 e em 8,4 s\n\n | Câmera\n | só na folha (camada 3D que vem de z 3400 até 520 e mergulha a −1180)\n\n## Cores\n\n | \n\n | Peça\n | Valor\n\n | Fundo do túnel\n | `#EAE3D6`\n\n | Miolo do túnel\n | `#141210` a 85%, desfoque 160\n\n | Manuscrito\n | `#1C1A18`; a palavra que queima em `#E2551C`\n\n | Fundo do fogo\n | `#110600` com um calor `#3A1405`\n\n | Brasas\n | `#FF7A2A` e `#FFC36A`\n\n | Brilho do machado\n | `#FF6A12` em modo Add\n\n | Clarão vermelho\n | `#8D0405` em modo Add\n\n | Olho e queda\n | fundo `#FFFFFF`; texto `#111111` e `#0A0A0A`\n\n | Final\n | fundo `#000000`; palavra de fundo `#262626`\n\n## Fontes\n\n | \n\n | Fonte\n | Onde\n\n | Segoe Print e Segoe Print Bold\n | manuscrito na folha (64 px)\n\n | Pixelify Sans (em PNG)\n | palavras do túnel, brancas com extrusão preta de 14 camadas\n\n | UnifrakturMaguntia (em PNG)\n | frases e letras góticas do fogo\n\n | Arial Black\n | texto em arco no olho (70 px)\n\n | Roboto Condensed Bold\n | frase que cai (124 px, tracking −10)\n\n | SF Pro Display Bold e Heavy\n | palavras da lente (74 px), fecho (96 px) e palavra de fundo (330 px)\n\n## Cena a cena\n\n | \n\n | Cena\n | Números\n\n | Folha\n | 26 lascas de papel cruzam com rastro; a folha gira de Y 75°, X 35° e Z −45° para quase plana entre 0,35 e 1,10 s; manuscrito letra a letra de 1,05 a 1,33 s; a palavra que queima de 1,33 a 1,42 s, com Turbulent Displace e Glow; mergulho de 1,55 a 1,80 s; vinheta com máscara invertida e feather 420\n\n | Túnel\n | 4 anéis de papel a 44, 72, 118 e 210%, girando a 40, −28, 22 e −14°/s; o túnel cresce de 100 a 118%; palavras em pixel nascem em 1,73, 2,03 e 2,37 s, com escala e giro até assentar; a 1ª com cópias vermelha e ciano deslocadas 10 px\n\n | Machado\n | varre de (−80, 1300) a (600, 900) entre 2,82 e 3,03 s, com giro −70° › 18° e escala 130 › 92%; o túnel estica com desfoque direcional 0 › 140\n\n | Fogo\n | 40 brasas subindo com seno; frases góticas em 3,03–3,30 e 3,30–3,86 s, com Glow 26; machado balança (−9°, 12°, −8°) na frente delas\n\n | Clarões\n | quadros 116–118 invertidos com desfoque 22; quadros 120–122 em vermelho\n\n | Letras soltas\n | 6 letras góticas a 42% em volta do machado deitado (90°) de 4,10 a 4,60 s; tudo voa para fora com desfoque até 4,74 s\n\n | Olho\n | recua de 620% para 100% entre 4,77 e 4,90 s; CC Sphere com rotação em X e Y (a íris olha em volta) até 5,70 s; sombra suave embaixo\n\n | Arco\n | texto num caminho circular de raio 300, letra a letra de 5,00 a 5,30 s; gira 320° de 5,55 a 5,80 s com sombra longa\n\n | X em pílula\n | círculo preto de 260 px com o glifo do X cresce de 70 a 100% em 5,74–5,82 s; estica para 260×720 e desce de 5,90 a 6,07 s; desfoque vertical até 160\n\n | Queda\n | frase cai de y −420 a 590 entre 6,12 e 6,40 s, com escala vertical 320 › 100% e desfoque direcional 180 › 0; Bulge até −1,4 curva a frase em volta da lente\n\n | Lente\n | amêndoa preta abre de 60×1 para 2000×1500 entre 6,53 e 7,12 s, com Roughen Edges animado; duas palavras brancas trocam por dentro (a velha desce, a nova cai)\n\n | Final\n | palavra de 7,05 s se desfaz com CC Pixel Polly em 7,26 s; fecho entra com escala horizontal 170 › 100% e desfoque 200 › 0 em 7,25–7,36 s; palavra de fundo desliza de x 760 a 380; o fecho encolhe a 78% e some com desfoque em 8,30–8,40 s\n\n## Som\n\n | \n\n | Peça\n | Valor\n\n | Música\n | trecho de 8,40 s a partir de 49,245 s da faixa, desacelerado 0,6% para 129,2 BPM e repetido; tom de Mi maior\n\n | Efeitos\n | 52 eventos nos dois ciclos (papel, caneta, teclas, pops, whooshes, glitch, impacto) e tonais no tom\n\n | Impactos\n | nos clarões, em 4,0–4,3 s e 12,4–12,7 s\n\n | Mix\n | −14 LUFS, pico −1,3 dBFS\n\n## O que é \"humano\" neste vídeo\n\n- A folha chega girando e continua derivando antes do mergulho; os anéis do túnel nunca param.\n\n- O machado balança na frente das palavras como objeto com peso, e as letras soltas oscilam por seno.\n\n- As curvas de chave usam velocidade contínua (`'a'`) nos movimentos longos, sem degrau no meio."
+    },
+    {
+      "titulo": "A montagem no After Effects",
+      "texto": "| \n\n | Arquivo\n | O que faz\n\n | `ae/cenas.jsx`\n | cria um projeto novo e monta tudo. No topo, o bloco `TEXTOS` guarda as frases (`manuscrito`, `queima`, `arco`, `queda`, `lente1`, `lente2`, `rola`, `fecho`, `fundo`). Ajudantes: `K` (chaves com influência; `'a'` = curva contínua), `TX`, `digita` (letra por letra), `rgbSplit`, `dirBlur`, `sombraLonga`, `brilho`, `camera`. Cada cena é um bloco (`FOLHA`, `TUNEL`, `FOGO`, `OLHO`, `QUEDA`, `FINAL`); `LOOP` junta as seis em 8,4 s e `RECRIACAO` toca o `LOOP` duas vezes. No fim, salva `ae/loop-papel.aep` e grava `audio/eventos.json`\n\n | `assets/fazer_assets.py`\n | desenha a folha, os anéis, a textura do olho e o machado, e escreve as palavras em pixel e em gótica. As palavras ficam nos dicionários `PIXEL` e `GOTICO`\n\n | `audio/trilha.py`\n | põe o trecho da música duas vezes, soma os efeitos dos eventos e os impactos nos dois clarões\n\n- **Fontes:** Roboto Condensed (Google Fonts) e SF Pro Display (site de desenvolvedores da Apple) em `C:\\Program Files\\Common Files\\Adobe\\Fonts`; Segoe Print e Arial Black já vêm no Windows. Reinicie o After Effects.\n\n- **Abrir pronto:** `projeto/ae/loop-papel.aep`. Se o AE pedir arquivos, aponte para `projeto/assets/`.\n\n- **Adaptar:** troque as frases em `TEXTOS` e as palavras em `PIXEL` e `GOTICO` no `fazer_assets.py`; rode `python fazer_assets.py` e depois File › Scripts › Run Script File › `cenas.jsx`. O script cria o projeto sozinho e grava por cima de `ae/loop-papel.aep`; crie a pasta `projeto/audio/` antes, para ele gravar ali o `eventos.json`.\n\n- **Som:** ponha a sua música em `audio/musica.wav` (o fim do `trilha.py` tem os dois comandos do ffmpeg que cortam o trecho e repetem), aponte o `sys.path` para `audio/mesa/` e rode `python trilha.py`.\n\n- **Render:** fila do AE em H.264 com o `mix.wav`, ou render sem som e junte depois com o ffmpeg.\n\n**Pegadinhas:** o `fazer_assets.py` lê o SVG do X de outra pasta do estúdio; o PNG já vem pronto, então pule essa função ou aponte para o seu SVG. Com \"repetir pixels da borda\" ligado no Gaussian Blur, um PNG desfocado vira uma caixa: o ajudante `blur` desliga essa opção. Estilos de camada não ligam por script com o AE em segundo plano; o brilho do fogo usa Glow e Turbulent Displace."
+    },
+    {
+      "titulo": "As decisões de direção",
+      "texto": "- **Um mundo e uma fonte por frase.** Manuscrito, pixel, gótica, sans pesada em arco, condensada e sans bold: cada frase muda de material e de tipo.\n\n- **O objeto é a transição.** O machado varre o túnel, o anel de texto gira até virar rastro, o olho vira o círculo do X e a lente engole a tela. Não há corte seco entre mundos.\n\n- **Flash duplo como pontuação.** Dois quadros invertidos e dois quadros vermelhos marcam a virada do fogo para o olho.\n\n- **Cada mundo dura umas duas batidas.** As trocas caem nos tempos fortes de uma música a 129 BPM.\n\n- **Rastro longo e sombra longa.** As entradas vêm com desfoque direcional forte e o texto sobre branco tem sombra longa e suave: dá peso às palavras.\n\n- **Loop sem emenda.** O fim encolhe e some no preto e o começo nasce do preto, então a segunda volta parece continuação.\n\nDetalhes de cores, tempos e números: estilo.md. Cenas por tempo: roteiro.md. Para fazer o seu com outra música: PROMPT.md."
+    },
+    {
+      "titulo": "As versões até o final",
+      "texto": "| \n\n | Versão\n | O que mudou\n\n | **v1**\n | recriação da técnica cena a cena, conferida lado a lado com o original, com frases nossas e todos os assets feitos por código"
+    }
+  ],
+  "pacote": [
+    {
+      "pasta": "projeto/",
+      "conteudo": "`ae/cenas.jsx` (o gerador comentado), `ae/loop-papel.aep` (o projeto montado), `assets/` (imagens, fontes livres e `fazer_assets.py`)"
+    },
+    {
+      "pasta": "audio/",
+      "conteudo": "`trilha.py` (a mix), `eventos.json` (os efeitos dos dois ciclos), `mix.wav` (o som final), `mesa/` (o motor de mix) e `sfx/` (os efeitos usados)"
+    },
+    {
+      "pasta": "referencias/",
+      "conteudo": "`estudo-da-referencia.md` (decupagem quadro a quadro), `links.md` e `fora-do-pacote.md`"
+    },
+    {
+      "pasta": "render.mp4",
+      "conteudo": "o vídeo final"
+    },
+    {
+      "pasta": "ae/cenas.jsx",
+      "conteudo": "cria um projeto novo e monta tudo. No topo, o bloco `TEXTOS` guarda as frases (`manuscrito`, `queima`, `arco`, `queda`, `lente1`, `lente2`, `rola`, `fecho`, `fundo`). Ajudantes: `K` (chaves com influência; `'a'` = curva contínua), `TX`, `digita` (letra por letra), `rgbSplit`, `dirBlur`, `sombraLonga`, `brilho`, `camera`. Cada cena é um bloco (`FOLHA`, `TUNEL`, `FOGO`, `OLHO`, `QUEDA`, `FINAL`); `LOOP` junta as seis em 8,4 s e `RECRIACAO` toca o `LOOP` duas vezes. No fim, salva `ae/loop-papel.aep` e grava `audio/eventos.json`"
+    },
+    {
+      "pasta": "assets/fazer_assets.py",
+      "conteudo": "desenha a folha, os anéis, a textura do olho e o machado, e escreve as palavras em pixel e em gótica. As palavras ficam nos dicionários `PIXEL` e `GOTICO`"
+    },
+    {
+      "pasta": "audio/trilha.py",
+      "conteudo": "põe o trecho da música duas vezes, soma os efeitos dos eventos e os impactos nos dois clarões"
+    }
+  ],
+  "prompt": "Quero um loop de tipografia no mesmo método do projeto \"Seis mundos num loop\", que está em 07-videos/projetos/letra-seis-mundos/: cada frase ganha um mundo e uma fonte próprios, os objetos atravessam a tela como transição e o fim some no preto de onde o começo nasce.\n\nMúsica e trecho (arquivo e segundo de início; o trecho é repetido): {{MUSICA}}\nAs seis frases, na ordem (1 a 4 palavras cada): {{FRASES}}\nQuer trocar algum mundo ou objeto (folha, túnel, machado, olho, lente)? {{TROCAS}}\n(Se algum desses estiver vazio ou com as chaves, me pergunte antes de começar.)\n\n1. Estude o projeto antes de propor qualquer coisa. Leia LEIA-ME.md, estilo.md e roteiro.md e abra projeto/ae/cenas.jsx (o bloco TEXTOS, os ajudantes K, TX, digita, rgbSplit, dirBlur, sombraLonga e os blocos FOLHA a FINAL) e projeto/assets/fazer_assets.py (PIXEL e GOTICO). Me diga em poucas linhas o que muda com a minha música.\n\n2. Meça a música: andamento, tempos fortes e onde o trecho fecha para repetir sem tranco. Monte uma tabela mundo › tempo de entrada › tempo forte.\n\n3. Se eu pedi trocas de mundo ou de objeto, proponha como cada um entra e sai (o objeto que atravessa é a transição) e espere meu ok.\n\n4. Gere os assets por código antes de animar: rode o fazer_assets.py com as minhas palavras em PIXEL e GOTICO e qualquer objeto novo desenhado do mesmo jeito.\n\n5. Construa copiando o projeto, sem editar o original: troque TEXTOS, mova as chaves de cada mundo para os meus tempos fortes e mantenha o fim sumindo no preto. Rode o cenas.jsx (ele cria e salva o projeto) e me mostre uma folha de contato com 12 quadros, incluindo o meio das transições.\n\n6. Revise antes do render: troca de mundo fora do tempo forte, texto que some antes de ser lido, flash longo demais, quadro parado e emenda visível no loop.\n\n7. Faça o som: o trecho da música repetido em audio/musica.wav, efeitos pelos eventos que o cenas.jsx grava, mix pela Mesa a −14 LUFS. Renderize em H.264, junte o mix.wav e entregue o MP4 com uma anotação do que mudou em relação ao projeto.",
+  "campos": [
+    "FRASES",
+    "MUSICA",
+    "TROCAS"
+  ],
+  "fonte": {
+    "nome": "Clube do Motion",
+    "url": "https://clubedomotion.com/projeto/?id=letra-seis-mundos",
+    "uso": "liberado pelo dono do Clube do Motion em 18/10/2026 (docs/permissoes/clube-do-motion.md)"
+  }
+}

package/lib/estudio/dados/projetos/clube-lula-3.json

@@ -0,0 +1,146 @@
+{
+  "id": "clube-lula-3",
+  "titulo": "Raio-X do Lula 3",
+  "categoria": "narrado",
+  "resumo": "mini documentário vertical de 2 min 9 s que condensa a parte econômica do documentário \"Raio-X Lula 3: como foi o governo?\" (Brasil Paralelo, 1h05) em motion graphic. O vídeo copia a identidade da fonte (vermelho gravado, cards de papel, carimbos e títulos condensados), usa narração em voz clonada da ElevenLabs e, quando o próprio presidente disse a frase, toca a fala real dele, isolada do documentário com o Demucs. Tudo é um HTML com o quadro calculado pelo tempo (`window.seek(t)`), renderizado no Chrome sem janela a 30 qps com desfoque de movimento. Feito pelo Clube do Motion; esta é a parte 1, publicada como Reel em 12/10/2026.",
+  "indicado": "canal de notícias, análise ou educação que quer transformar um documentário, uma entrevista longa ou um relatório em vídeo curto; criador que precisa mostrar que dá para fazer motion de qualquer assunto, com fatos e falas reais da fonte.",
+  "estilo": [
+    "mini documentário",
+    "identidade copiada da fonte",
+    "cards de notícia em papel",
+    "gravura",
+    "carimbos",
+    "falas reais",
+    "legenda palavra por palavra",
+    "gráficos animados",
+    "câmera viva"
+  ],
+  "ficha": {
+    "formato": "1080×1920, 30 qps, 9:16, cor BT.709",
+    "duracao": "2 min 9 s (129,6 s, 3.888 quadros)",
+    "motor": "html",
+    "voz": "voz clonada na ElevenLabs (Eleven v4), um parágrafo por arquivo, conferida no faster-whisper",
+    "musica": "ver o guia de estilo",
+    "fontes": "\"Raio-X Lula 3: como foi o governo?\", Brasil Paralelo, publicado em 10/10/2026 (1:05:26)"
+  },
+  "ferramentas": [
+    "Claude Code",
+    "ElevenLabs"
+  ],
+  "ficha_tecnica": {
+    "Duração": "2 min 9 s (129,6 s, 3.888 quadros)",
+    "Formato": "1080×1920, 30 qps, 9:16, cor BT.709",
+    "Ferramenta": "HTML + CSS + JavaScript num arquivo só, render com Playwright no Chrome sem janela, ProRes nos trechos de 4 s e H.264 no final",
+    "Desfoque de movimento": "4 subquadros por quadro, obturador de meio quadro, juntados no ffmpeg (`tmix`)",
+    "Voz": "voz clonada na ElevenLabs (Eleven v4), um parágrafo por arquivo, conferida no faster-whisper",
+    "Falas reais": "7 trechos do personagem, tirados do documentário com a voz isolada pelo Demucs: 5 na abertura e 2 no meio da narração",
+    "Trilha": "duas faixas da trilha de \"Peaky Blinders\" (Antony Genn), uma na abertura e outra do título ao fim, cerca de 15 dB abaixo da voz",
+    "Som": "139 eventos exportados do próprio HTML; mix final a −14,1 LUFS, pico de −1,4 dBTP",
+    "Fonte": "\"Raio-X Lula 3: como foi o governo?\", Brasil Paralelo, publicado em 10/10/2026 (1:05:26)",
+    "Arquivo final": "MP4 H.264 com áudio AAC, 95 MB",
+    "Publicado": "Reel de 12/10/2026: https://www.instagram.com/reel/DeZX0vRAEzc/"
+  },
+  "etapas": [
+    {
+      "titulo": "O roteiro e a voz",
+      "texto": "**Resumo:** a fala do vídeo exatamente como foi ao ar, com o texto enviado à voz clonada e as falas reais tiradas do documentário, como ela foi montada e as 7 cenas por tempo. Todos os números da fala vêm do documentário de origem; o vídeo cita a fonte no rodapé de cada gráfico.\n\n## Como a fala foi feita\n\n- **Estrutura:** abertura de trailer só com falas reais, título, quatro capítulos narrados (o bolso, o gasto, os impostos e a dívida) e um fecho que anuncia a parte 2. Duas falas reais entram no meio da narração, nos pontos em que o personagem disse a frase.\n\n- **Texto:** escrito só com fatos e números do documentário e aprovado antes da gravação. O vídeo não cita partido nem número de candidato.\n\n- **Voz:** ElevenLabs, Eleven v4, um parágrafo por arquivo, com os números por extenso no texto enviado; cada arquivo foi conferido no faster-whisper.\n\n- **Falas reais:** cortadas do documentário pelo tempo de cada palavra, com a voz isolada pelo Demucs. Na fala da dívida, um corte tira \"comparada da Itália, comparada da França\", que repetia a mesma comparação; na tela, o corte aparece como \"(…)\".\n\n- **Montagem:** `audio/montar.py parte1`, com 0,24 s de pausa depois de cada parágrafo. A parte 1 fechou em 2 min 8 s de fala, e o vídeo soma 1 s de saída.\n\n## A fala, verbatim\n\n[REAL] = voz do personagem tirada do documentário. Narração = texto enviado à voz, com os números por extenso.\n\n**Abertura (só falas reais)**\n\n- [REAL] posse, 1º de janeiro de 2023: \"O Brasil tem jeito e vamos reconstruir este país.\"\n\n- [REAL] entrevista no Planalto: \"E esse ano de 2024 é o ano da gente começar a colher aquilo tudo.\"\n\n- [REAL] entrevista: \"Agora, 2025 é o ano da colheita.\"\n\n- [REAL] idem: \"O ano de 2026 é o ano da colheita.\"\n\n- [REAL] palco: \"Só depende de vocês.\"\n\n**Os capítulos**\n\n- São doze anos como presidente e a promessa continua a mesma. Então bora ver o que o Lula três colheu de verdade.\n\n- O governo adora mostrar o desemprego no menor nível da história. Só que, em julho, quarenta e dois por cento dos brasileiros disseram que a vida financeira piorou. A inflação ficou acima da meta em todos os anos do governo, com carne, café, energia e combustível entre as maiores altas. E a resposta do presidente foi essa.\n\n- [REAL] 6 de fevereiro de 2025: \"e você desconfia que tal produto está caro, você não compra.\"\n\n- O preço sobe porque o governo gasta sem freio. Só de janeiro a maio deste ano, ano de eleição, foram cento e oitenta e cinco bilhões em medidas de alívio. No mesmo período do ano eleitoral do Bolsonaro, setenta e quatro.\n\n- E quem paga é você. Foram quarenta e três tentativas de aumentar a arrecadação, quase um imposto novo por mês, e a carga tributária bateu o recorde da história. Teve até a taxa das blusinhas, que o Lula criticou, sancionou e só às vésperas da eleição prometeu acabar.\n\n- Mesmo arrecadando recorde, a conta não fecha. Ele recebeu o país com superávit e entregou déficit nos três primeiros anos. A dívida chegou a dez trilhões e oitocentos bilhões de reais. E, para o presidente, isso é pouco.\n\n- [REAL] 27 de junho de 2024: \"A dívida pública brasileira, comparada à dos Estados Unidos, comparada à do Japão, (…) não é dívida, é troco.\"\n\n- Só que o Brasil paga o maior juro real do mundo, e essa conta cai no seu bolso. Até o aluguel subiu cinquenta e sete por cento desde o fim de dois mil e vinte e dois.\n\n**Fecho**\n\n- Essa é a colheita do Lula três, e quem paga a conta é você. Mas isso é só o dinheiro. Na parte dois, a gente abre os sigilos de cem anos, o escândalo do INSS, a Dama do Tráfico e a relação do governo com o Supremo. Quer ver a parte dois? Comenta aqui.\n\nNa tela, os números aparecem em algarismos (\"12 anos\", \"42%\", \"R$ 185 bi\", \"43 vezes\", \"32,4%\", \"R$ 10,8 trilhões\", \"+57%\").\n\n## Cenas por tempo\n\n | \n\n | #\n | Tempo (s)\n | Na tela\n | O que acontece\n\n | 0\n | 0,00–18,95\n | \"1º de janeiro de 2023\" · anos 2023, 2024, 2025 e 2026 · \"Três anos, a mesma promessa\"\n | a data é datilografada; a filmagem da posse abre de cima para baixo em 1,07 s com o rótulo \"Posse · 1º de janeiro de 2023\"; cada ano bate como carimbo vermelho na palavra; em 16,1 s o \"2026\" vira a série dos três anos; corte seco no palco de chapéu (\"Só depende de vocês\")\n\n | 1\n | 18,95–26,6\n | \"RAIO-X / LULA 3\" · \"12 anos como presidente\" · \"2003 – 2010 / Lula 1 e 2\" · \"2023 – 2026 / Lula 3\" · carimbo \"A mesma promessa\" · \"O que o Lula 3 colheu?\"\n | o título bate com flash depois de 0,08 s de preto; em 19,9 s ele sobe e vira etiqueta; o 12 conta do zero; a linha do tempo se desenha com os dois rostos e o vão \"2011 – 2022\" pontilhado; em 23,6 s o rosto do Lula 3 cresce até virar o fundo da pergunta\n\n | 2\n | 26,1–51,6\n | capítulo \"O bolso\" · gráfico \"Taxa de desemprego\" (5,1% em 2025) e carimbo \"A menor da história\" · \"42% disseram que piorou\" · \"Inflação × meta do Banco Central\" com 2023, 2024 e 2025 carimbados \"Acima da meta\" (2024 também \"Estourou o teto\") · fotos de carne, café, energia e combustível · \"A resposta do presidente\"\n | a linha do desemprego se desenha em 2,6 s; o card dos 42% (PoderData, julho de 2026) empurra o gráfico para fora em 30,5 s; os três anos chegam em pilha e são carimbados na palavra; os quatro produtos entram um por palavra e as setas pulsam em \"maiores\"; em 45,1 s a filmagem abre em círculo com a fala real e a legenda\n\n | 3\n | 51,2–64,6\n | capítulo \"O gasto\" · gráfico \"Quanto o gasto cresce por ano\" (Lula 1 e 2 +7,1%, Lula 3 +5,3%, Dilma +4,1%, Bolsonaro +1,4%, Temer \"o gasto caiu\") · carimbo \"Sem freio\" · \"Medidas de alívio janeiro a maio\" · colunas R$ 185 bi × R$ 74 bi · carimbo \"Ano de eleição\"\n | as barras crescem com mola, uma a cada 0,09 s; em 54,5 s o gráfico sobe e saem as duas colunas, com o rosto no topo de cada uma acompanhando a altura\n\n | 4\n | 64,5–80,9\n | capítulo \"Os impostos\" · \"Quem paga é você.\" · grade de 43 \"+R$\" e \"43 vezes\" · \"Quase um imposto novo por mês\" · \"32,4% do PIB em impostos\" · carimbo \"Recorde da história\" · card do UOL com o meme \"Taxadd\" · logos de Shein, Shopee e AliExpress · passos \"Criticou\", \"Sancionou 2024\", \"Prometeu acabar a 5 meses da eleição\"\n | o fundo escurece e cada palavra de \"Quem paga é você\" bate sozinha; as 43 células caem a cada 0,045 s com o contador ao lado; a carga sobe de 29% a 32,4%; o card do meme encolhe e os três passos entram da esquerda, um por palavra\n\n | 5\n | 80,7–112,6\n | capítulo \"A dívida\" · card da Veja (arrecadação de R$ 2,9 trilhões em 2025) e carimbo \"A conta não fecha\" · card do g1 (superávit de R$ 54,1 bilhões em 2022) e carimbo \"Ele recebeu assim\" · 2023, 2024 e 2025 carimbados \"Déficit\" · \"Dívida bruta R$ 10,8 trilhões\" (junho de 2026, 81,9% do PIB) · carimbo \"Isso é pouco\" · \"É troco\" · \"Ranking de juros reais\" (Brasil 9,30%) e carimbo \"Maior do mundo\" · \"+57% no aluguel\"\n | os cards se empurram de lado; a dívida conta até R$ 10,8; em 94,9 s a filmagem abre pelo meio com a fala real, e o corte para \"não é dívida, é troco\" (101,3 s) leva flash e tranco; o ranking cresce barra a barra e a foto da chave fecha com o +57%\n\n | 6\n | 112,4–129,6\n | \"Essa é a colheita do Lula 3\" · \"E quem paga a conta é você.\" · \"Isso é só o dinheiro.\" · \"Parte 2\" · cards de O Tempo (sigilo de 100 anos em 1.339 pedidos), Poder360 (ex-presidente do INSS preso), CNN Brasil (viagem paga da \"Dama do Tráfico\") e Congresso em Foco (indicado ao STF rejeitado em 132 anos) · balão \"Comenta aqui\"\n | as frases trocam no lugar, uma a uma; \"Parte 2\" chega com o boom; os quatro cards caem de baixo, inclinados, e cada um recua quando o próximo chega; o balão e a seta entram e a tela escurece nos últimos 0,45 s\n\n## Momentos para a trilha\n\n- 0,0–18,9 s: \"Luca In Tommy's Office\", baixa sob as falas; carimbo e impacto em cada ano, glitch e whoosh em cada troca de tomada.\n\n- **18,95 s: boom cinematográfico no título**, com a segunda faixa subindo 8 dB por 1 s.\n\n- 66,6 s: a contagem dos 43, com pops leves espaçados.\n\n- 101,3 s: glitch no corte para \"é troco\" e carimbo com impacto na palavra.\n\n- 118,6 s: boom na \"Parte 2\"; os cards caem com som de papel.\n\n- 128,6 s: a fala acaba e a música sobe 7 dB até o fim.\n\nA lista completa dos 139 eventos, com tempo, arquivo e volume, está em `audio/eventos.json`."
+    },
+    {
+      "titulo": "A identidade visual",
+      "texto": "**Resumo:** a identidade é a do documentário de origem, medida nos quadros: fundo vermelho-escuro em gravura, cards de papel cinza-creme com manchete negrita, gráficos no mesmo papel com o destaque em vermelho, carimbos de tinta falhada e títulos em caixa alta condensada. O movimento usa uma mola curta com leve passagem, câmera que nunca para e grão de filme; a filmagem do personagem entra numa janela quadrada com tinta vermelha. Números tirados do `index.html`, dos scripts de `gerar/` e do `trilha_v2.py`.\n\n## Fundo e palco\n\n | \n\n | Peça\n | Como é\n\n | Tela\n | 1080×1920, fundo `#0b0101`\n\n | Fundo em gravura\n | imagem de 1350×2400 em (−135, −240), com folga para a câmera. Retrato em linhas paralelas onduladas (espaço de 8 px, −14°) cuja espessura cresce onde a foto é clara; a estrela em hachura cruzada (38° e −52°, espaço de 6,5 px) cortada no canto inferior esquerdo; guilhochê fraco (11 px, 8°) a 14% no fundo todo\n\n | Cor do fundo\n | base `#3a0607` no centro descendo para `#0d0000` nas bordas, tinta `#9a1216` a 62% e vinheta\n\n | Véu preto\n | camada preta por cima do fundo: 100% na abertura, 25% depois do título, 30% nos capítulos e cerca de 75% no \"Quem paga é você\"\n\n | Movimento do fundo\n | desliza devagar (−0,4 px/s na horizontal e −0,9 px/s na vertical, mais senos de até 30 e 40 px) e respira em escala de 0,99 a 1,05\n\n | Vinheta\n | elipse de 75% × 62% centrada em 46% da altura, transparente até 55% e com preto a 62% nas bordas\n\n | Grão\n | 8 quadros de ruído de 540×960 ampliados, a 20% em `overlay`, um diferente a cada quadro\n\n## Cores\n\n | \n\n | Token\n | Valor\n | Papel\n\n | Papel medido na fonte\n | `#bbb0ac`\n | cards de notícia e gráficos (no vídeo, `#c9c0bb` com textura, clareado para o celular)\n\n | Manchete\n | `#342a2a`\n | texto dos cards\n\n | Resumo e apoio\n | `#5b504c` · fonte `#6d625e`\n | linha em itálico, subtítulo e fonte dos gráficos\n\n | Título de gráfico\n | `#141010`\n | títulos e números grandes no papel\n\n | Vermelho do carimbo\n | `#c3141b`\n | carimbos, barras e pontos de destaque no papel\n\n | Vermelho na tela escura\n | `#d0161d` · números `#ff2a2f`\n | títulos, valores grandes e palavra-chave da legenda\n\n | Cinza das barras\n | `#7d7270` · `#8a7f7b`\n | o que não é destaque\n\n | Rótulos\n | `#bdb3ae` · claro `#e8dfdb`\n | textos espaçados em Oswald\n\n## Fontes\n\n | \n\n | Fonte\n | Onde\n\n | Oswald (200 a 700, OFL)\n | títulos condensados em caixa alta: \"RAIO-X\" em 300 com tracking de 0,55 em, \"LULA 3\" em 250 px, anos de 250 px, números de 150 a 340 px, carimbos em 700, rótulos em 500 com tracking de 0,32 em\n\n | Nunito Sans (200 a 1000, OFL)\n | manchete dos cards em 850 (58 px), títulos de gráfico em 900 (56 px), legenda em 900 (64 px), resumo em itálico 500 (30 px)\n\nO documentário usa uma sans humanista negrita e uma condensada; Nunito Sans e Oswald são as livres mais próximas. As duas vêm em `.ttf` no `html/fonts/`, e o `ready` espera cada peso antes do primeiro quadro.\n\n## Componentes\n\n | \n\n | Componente\n | Números\n\n | Card de notícia\n | 960 px de largura em x = 60, margem interna de 70/70/64 px, logo do veículo com até 78 px de altura, manchete centralizada, linha da data em Oswald 500 (36 px) entre dois fios de 3 px `#1b1414`, resumo em itálico; sombra larga e borda interna clara\n\n | Gráfico no papel\n | título à esquerda, subtítulo, desenho em SVG e \"Fonte: …\" no rodapé; a linha do desemprego se desenha em 2,6 s e os pontos acendem junto\n\n | Carimbo\n | Oswald 700 em caixa alta, `#c3141b`, borda de 7 px, cantos de 6 px, fundo a 6% e máscara de tinta falhada (cerca de 12% de falha); bate de 1,9× para 1× numa mola de ζ 0,45 e ω 16, inclinado de −3° a −6°\n\n | Filmagem\n | janela de 960×960 em (60, 400), saturação 55%, contraste 112%, degradê vermelho em `multiply` embaixo e linhas de varredura de 2 px a 35%; abre de cima para baixo, em círculo ou pelo meio, conforme a cena\n\n | Legenda das falas reais\n | Nunito Sans 900, 64 px, branca com sombra, em y = 1400; cada palavra sobe 14 px em 0,12 s no tempo do faster-whisper, e a palavra-chave fica `#ff2a2f`\n\n | Círculo de rosto\n | recorte quadrado de 640 px feito pelo YuNet, aro de 6 px cor de papel; o rosto do governo em destaque leva aro vermelho\n\n | Capítulo\n | no topo, em (70, 140): \"Raio-X · Lula 3\" em Oswald 400 (30 px, tracking de 0,38 em) e o nome do capítulo em Oswald 700 vermelho (46 px), que entra deslizando 40 px\n\n | Contadores\n | 12 anos, 42%, R$ 185 bi, 43 vezes, 32,4%, R$ 10,8 tri e +57% sobem até o valor dito, em 0,6 a 1,3 s\n\n## Curvas e molas\n\n | \n\n | Nome no código\n | Curva\n | Uso\n\n | `mola(t, ζ, ω)`\n | mola em forma fechada; padrão ζ 0,56 e ω 12 (cerca de 112%, assenta em 0,6 s)\n | entradas, barras e colunas\n\n | `E.out`\n | cúbica de saída\n | contadores e rótulos\n\n | `E.inn`\n | cúbica de entrada\n | saídas\n\n | `E.io`\n | cúbica de entrada e saída\n | linha do tempo, zoom de foto e trocas de fundo\n\n | `E.outExpo` · `E.outQuint`\n | saída exponencial e quíntica\n | tracking do título e contador da dívida\n\n- **Entrada padrão (`pose`):** sobe 140 px, cresce de 92% a 100% com a mola e aparece em 0,16 s; pode chegar inclinada (2° a 4°) ou de lado.\n\n- **Saída padrão:** 0,32 s de cúbica de entrada, sobe 120 px, encolhe 5% e ganha até 14 px de desfoque.\n\n- **Cascatas:** barras a cada 0,09 s, as 43 células da contagem a cada 0,045 s (com mola de ω 16 e giro de 25°), cards da parte 2 empilhados um sobre o outro.\n\n## Câmera viva\n\n- O mundo inteiro soma três senos lentos: ±5 px na horizontal, ±7 px na vertical, ±0,18° de rotação e escala de 1,006 a 1,018.\n\n- Cada elemento deriva 14 px para cima nos primeiros 6 s em cena.\n\n- A filmagem leva um tranco de 4,5% no corte, que some em cerca de 0,3 s, e aproxima de 2% para 4,5% em 4 s.\n\n## Transições\n\n- **Abertura:** a data \"1º de janeiro de 2023\" é datilografada; a filmagem abre de cima para baixo e cada troca de tomada leva flash de 55% e tranco.\n\n- **Título:** corte seco no preto, 0,08 s de respiro e \"LULA 3\" bate de 125% para 100% com flash de 90% e aberração de cor (sombra vermelha e ciano de 14 px que some em 0,3 s). Em \"São doze anos\", o título sobe e encolhe para 42% até virar etiqueta.\n\n- **Foto que vira cena:** o rosto do Lula 3 cresce de 1 para 3,4× e escurece até o fim da cena da linha do tempo.\n\n- **Card que empurra card:** um gráfico sai pela esquerda enquanto o seguinte entra pela direita; o card do meme encolhe para 55% e abre espaço para os três passos numerados.\n\n- **Volta ao escuro:** antes de \"Quem paga é você\", o véu preto sobe; os itens com foto caem 900 px para a filmagem entrar.\n\n## Render\n\n30 qps. Cada quadro é a média de 4 capturas espalhadas em meio intervalo (`--sub 4 --shutter 0.5`): o ffmpeg recebe 120 qps, faz `tmix=frames=4` e fica com um quadro a cada quatro. Os 33 trechos de 4 s saem em ProRes 422 HQ 10 bits e o final em H.264 (`preset slow`, CRF 17, `yuv420p`, BT.709 gravado no fluxo) com AAC a 256 kb/s.\n\n## Voz\n\n | \n\n | Item\n | Valor\n\n | Modelo\n | ElevenLabs Eleven v4, voz clonada, português\n\n | Ajuste\n | estabilidade 0,52, similaridade 0,73, velocidade 1,10 e `atempo` de 1,05 na montagem\n\n | Montagem\n | silêncio aparado em cada parágrafo, 0,24 s de pausa (0,20 s antes de uma fala real), tudo a −16 LUFS\n\n | Falas reais\n | cortadas pelo tempo das palavras no documentário, com 0,04 s de entrada e 0,14 s de saída e −16 LUFS\n\n | Texto enviado\n | números por extenso (\"quarenta e dois por cento\", \"dez trilhões e oitocentos bilhões\")\n\n## Trilha\n\n | \n\n | Item\n | Valor\n\n | Abertura\n | \"Luca In Tommy's Office\" (Antony Genn) a −32 LUFS, entrando do silêncio no primeiro segundo e cortada em 18,87 s\n\n | Do título ao fim\n | \"Bonnie Shows 'em What He's Got\" (Antony Genn), a partir de 4,0 s da faixa, a −33 LUFS; sobe 8 dB no título por 1 s, desce em 0,8 s, sobe 7 dB quando a fala acaba (128,6 s) e sai em 0,6 s\n\n | Distância da voz\n | música cerca de 15 dB abaixo da narração\n\n## Sound design e mix\n\n | \n\n | Família\n | Quando\n\n | tecla\n | cada letra da data datilografada na abertura\n\n | carimbo + impacto\n | anos da abertura e todos os carimbos; na v2, o tom varia de −3 a +2,5 semitons, o volume alterna entre 85%, 100% e 92%, e metade ganha uma camada de colagem ou tinta a 70%\n\n | glitch + whoosh curto\n | cada troca de tomada da abertura\n\n | boom cinematográfico\n | o título e a entrada da \"Parte 2\"\n\n | contador\n | números que sobem\n\n | pop\n | rostos da linha do tempo, colunas e a contagem dos 43 (um a cada duas células, a 60%)\n\n | papel (deslizar, empilhar, cair)\n | cards e gráficos que entram e os cards da parte 2 que caem em pilha\n\n | obturador\n | as fotos dos quatro produtos\n\n | filme\n | a janela da filmagem abrindo\n\n | whoosh grave e longo\n | trocas de capítulo e de assunto\n\n | notificação\n | o balão \"Comenta aqui\"\n\n- Cada efeito entra em `evento − pico do arquivo`; efeitos com mais de 4 s são cortados com saída de 0,5 s.\n\n- **Final:** limitador em 0,72 e `loudnorm` em duas passagens para −14 LUFS; o arquivo publicado mede −14,1 LUFS e pico de −1,4 dBTP.\n\n## O que é \"humano\" neste vídeo\n\n- A filmagem nunca fica parada: tranco no corte, aproximação lenta e tremor de 3 px.\n\n- Os carimbos não batem iguais: cada um tem inclinação, tom e volume próprios.\n\n- O \"Comenta aqui\" chega com mola e a seta embaixo dele balança sem parar.\n\n- Nos últimos 0,45 s, a tela inteira escurece, em vez de cortar."
+    },
+    {
+      "titulo": "A montagem em HTML",
+      "texto": "| \n\n | Arquivo\n | O que faz\n\n | `html/index.html`\n | cada cena é uma função `cena(início, fim, monta, desenha)`. `W('palavra', depois)` devolve o instante em que a palavra é dita, e todo elemento entra por ele. `pose()` faz a entrada com mola, a deriva e a saída com desfoque; `carimbo()`, `cardNoticia()`, `tv()`, `quadro()` e `legenda()` montam os componentes. `window.seek(t)` desenha o quadro do instante t; `window.eventosSom()` devolve os eventos de som calculados com os mesmos tempos\n\n | `gerar/dados.py`\n | escreve `html/data.js` a partir de `tempos-parte1.json`, `palavras-parte1.json` e `footage.json`. Rode sempre que o áudio mudar\n\n | `gerar/eventos.mjs`\n | abre o HTML no Chrome e grava `audio/eventos.json` com os eventos e as marcas (título, fim da abertura, duração)\n\n | `gerar/fundo_gravura.py`\n | desenha o fundo vermelho em gravura: retrato em linhas onduladas cuja espessura segue a luz da foto, estrela com hachura cruzada e guilhochê fraco, com vinheta (1350×2400, folga para a câmera)\n\n | `gerar/texturas.py`\n | gera o papel dos cards (1024 px, repete), os 8 quadros de grão e o recorte do meme usado num card\n\n | `gerar/rostos.py`\n | acha o rosto em cada foto com o YuNet e recorta um quadrado de 640 px para os círculos\n\n | `gerar/rasterizar_svg.mjs` · `gerar/inspecionar.mjs`\n | passam um SVG para PNG pelo Chrome; mostram posição, opacidade e transformação de um texto num instante\n\n | `extrair_filmagem.py`\n | corta as tomadas do documentário em sequências JPG 1080×1080 a 30 qps, sem ampliar, e grava `footage.json`\n\n | `render.mjs`\n | `--stills 1.2,19.0,58 --dir nome` grava quadros parados; `--full --sub 4 --shutter 0.5 --from 0 --to 4` renderiza um trecho\n\n | `render-trechos.sh`\n | renderiza em trechos de 4 s (navegador novo a cada trecho, até 3 tentativas), junta sem recomprimir, põe o áudio e gera o MP4; trecho que já existe é pulado\n\n | `verificar.py` · `folha.py`\n | conferem o MP4 (quadros, intervalo, qps, cor, LUFS, pico) e montam folhas de contato\n\n | `audio/gerar_voz.py`\n | manda cada parágrafo à ElevenLabs pela CLI `elevenlabs` e guarda o pedido ao lado do MP3\n\n | `audio/montar.py`\n | intercala falas reais e narração na ordem da sequência `parte1`, com pausas fixas, e grava `completo-parte1.wav` e `tempos-parte1.json`\n\n | `audio/trilha_v2.py`\n | junta voz, as duas faixas e os efeitos dos eventos, varia tom e timbre dos carimbos e normaliza em duas passagens para −14 LUFS; grava também a voz, a música e os efeitos separados\n\n- **Junte as pastas:** copie `audio/` para dentro de `projeto/`. O `render-trechos.sh` lê `audio/eventos.json` para saber a duração.\n\n- **Caminhos:** troque os caminhos da máquina de origem no topo de `gerar/dados.py` (`AQ` = a pasta `audio/`), `gerar/fundo_gravura.py` (`A` = a pasta das suas fotos e logos), `extrair_filmagem.py` (`SRC` = o vídeo da fonte) e `audio/trilha_v2.py` (`EV`, `MUS`, `NIV` = `audio/sfx/nivelados/`, `PREM`).\n\n- **Ver no navegador:** abra `html/index.html?play` no Chrome com `--allow-file-access-from-files` (sem ele, a máscara dos carimbos não carrega) para tocar em tempo real, ou `html/index.html?t=19.0` para parar num instante.\n\n- **Preparar o render:** instale Node, ffmpeg e o `playwright-core` (`npm i playwright-core`). No topo de `render.mjs` e dos `.mjs` de `gerar/`, troque a linha do `createRequire` pelo caminho do seu `playwright-core` e o `executablePath` pelo Chrome da sua máquina.\n\n- **Material da fonte:** baixe o vídeo da fonte, ajuste `TOMADAS` no `extrair_filmagem.py` (nome, início, fim e x do recorte) e rode. Ponha as fotos em `html/img/pessoas/`, os logos em `html/img/logos/` e rode `python gerar/rostos.py` e `python gerar/texturas.py`.\n\n- **Quadros de conferência:** `node render.mjs --stills 1.2,19.0,32.5,58,67.5,92,124 --dir teste`, depois `python folha.py revisao/teste revisao/folha.jpg`.\n\n- **Som:** `node gerar/eventos.mjs` e depois `python audio/trilha_v2.py` (Python com numpy, soundfile e pyloudnorm). Gera `audio/mix-v2.wav` e os três stems.\n\n- **Vídeo:** `bash render-trechos.sh v3 audio/mix-v2.wav` gera `render/raio-x-lula3-parte1-v3.mp4`; confira com `python verificar.py render/raio-x-lula3-parte1-v3.mp4`.\n\n- **Corrigir só uma cena:** apague os `render/trechos-vN/t-XXX.mov` dos trechos afetados e rode de novo; os outros são reaproveitados.\n\n**Pegadinhas:** o `trilha_v2.py` lê `PREM/catalogo.csv` logo ao abrir; sem a biblioteca paga, troque os dois `p:avulsos/cinematic-boom-*` do `index.html` por efeitos `n:` e deixe `pico_prem = {}`. O `fundo_gravura.py` espera em `gerar/` o retrato já recortado com o rembg (`lula-recorte.png`) e o símbolo passado para PNG pelo `rasterizar_svg.mjs` (`pt-estrela.png`); troque os dois pelos do seu assunto. O `texturas.py` termina recortando o meme de `html/img/cards/`: sem esse arquivo, apague as duas últimas linhas. O YuNet perde rosto grande em foto de 3000 px, por isso o `rostos.py` detecta numa cópia reduzida. A janela de palavras do faster-whisper corta poucos milissegundos antes da fala, e a busca de `W()` já tolera 20 ms. O desfoque dos subquadros só aparece no arquivo final."
+    },
+    {
+      "titulo": "As decisões de direção",
+      "texto": "- **A identidade vem da fonte, medida nos quadros.** Fundo `#360508` a `#160000` com retrato e estrela em gravura, cards de papel `#bbb0ac`, manchete em sans humanista negrita `#342a2a`, linha fina com a data e títulos em caixa alta condensada. Quem viu o documentário reconhece o vídeo na hora.\n\n- **A abertura é um trailer só com falas reais.** A mesma frase aparece em quatro momentos (2023, 2024, 2025 e 2026), cada um com o ano carimbado em 250 px; no último, os três anos ficam lado a lado com \"Três anos, a mesma promessa\". Corte seco, respiro de 0,08 s e o título bate com flash.\n\n- **Fala real no lugar da narração.** Quando a frase existe na voz do personagem, ela entra isolada pelo Demucs, numa janela quadrada da filmagem com legenda palavra por palavra e a palavra-chave em vermelho.\n\n- **Nada aparece antes de ser dito.** Cada card, número e carimbo entra pelo tempo da palavra no faster-whisper (`W('palavra')`), e os 139 eventos de som saem das mesmas funções, então som e imagem não se desencontram.\n\n- **Tudo o que tem imagem real entra com imagem real:** foto de cada pessoa citada, logo de cada veículo, foto de cada produto e manchetes com data, recriadas em papel em vez de print.\n\n- **Gráficos redesenhados, não copiados.** Linha, barras, ranking e contadores são SVG e HTML com os números do documentário, cada um com a fonte no rodapé, e os valores sobem até o número dito.\n\n- **O carimbo pontua a fala.** Ele bate com escala de 1,9 para 1 numa mola curta, com textura de tinta falhada, e o som varia de tom e de timbre para não repetir.\n\n- **Capítulos no topo** (\"O bolso\", \"O gasto\", \"Os impostos\", \"A dívida\", \"Parte 2\") orientam quem entra no meio do vídeo.\n\n- **Nada para morto.** A câmera soma senos lentos, o fundo em gravura desliza devagar, o grão troca a cada quadro e cada elemento deriva alguns pixels enquanto espera.\n\n- **O fecho vende a parte 2:** os cards dos próximos assuntos caem em pilha e o balão \"Comenta aqui\" chama o comentário.\n\n- **Revisão em três frentes:** folhas a 2 qps, uma IA que ouve o mix e detectores de salto e de quadro vazio; a v2 saiu dessa revisão.\n\nDetalhes de cores, curvas e som: estilo.md. Fala e cenas por tempo: roteiro.md. Para fazer um vídeo no mesmo método com o seu assunto: PROMPT.md."
+    },
+    {
+      "titulo": "As versões até o final",
+      "texto": "| \n\n | Versão\n | O que mudou\n\n | Áudio v1\n | a fala inteira, com 2 min 59 s; dividida em parte 1 e parte 2 para caber num Reel\n\n | Áudio v2\n | a parte 1, com 2 min 8 s, abertura de trailer e fecho chamando a parte 2; aprovado antes da animação\n\n | v1\n | primeiro render completo, revisado em folhas a 2 qps, por uma IA que ouviu o mix e por detectores de salto e de vazio\n\n | **v2**\n | 10 correções visuais e o mix v2: carimbos com tom e timbre variados, contagem dos 43 mais leve e fade de 0,14 s nas falas; publicada"
+    }
+  ],
+  "pacote": [
+    {
+      "pasta": "projeto/",
+      "conteudo": "`html/index.html` (as 7 cenas), `html/data.js` (tempos do áudio, palavras e tomadas), `html/fonts/` (Nunito Sans e Oswald, licença OFL), `html/img/` (papel, 8 quadros de grão e a máscara dos carimbos), `html/footage/footage.json`, `gerar/` (scripts do fundo, das texturas, dos rostos, dos dados e dos eventos de som, mais o modelo YuNet), `render.mjs`, `render-trechos.sh`, `verificar.py`, `folha.py` e `extrair_filmagem.py`"
+    },
+    {
+      "pasta": "audio/",
+      "conteudo": "a narração (`p01` a `p05b` e `pf1`, cada uma com o pedido enviado à voz em `.json`), `gerar_voz.py`, `conferir.py`, `montar.py`, `trilha_v2.py`, a montagem da fala (`completo-parte1.wav`), os tempos (`tempos-parte1.json`), as palavras (`palavras-parte1.json`), os 139 eventos (`audio/eventos.json`), o mix final (`audio/mix-v2-tp.wav`) e `sfx/nivelados/` com os 44 efeitos usados"
+    },
+    {
+      "pasta": "referencias/",
+      "conteudo": "`estudo-do-documentario.md` (o documentário resumido capítulo a capítulo, com a identidade medida), `catalogo-de-assets.md` (fonte e crédito de cada foto e logo), `links.md` e `fora-do-pacote.md`"
+    },
+    {
+      "pasta": "render.mp4",
+      "conteudo": "o vídeo final (v2)"
+    },
+    {
+      "pasta": "html/index.html",
+      "conteudo": "cada cena é uma função `cena(início, fim, monta, desenha)`. `W('palavra', depois)` devolve o instante em que a palavra é dita, e todo elemento entra por ele. `pose()` faz a entrada com mola, a deriva e a saída com desfoque; `carimbo()`, `cardNoticia()`, `tv()`, `quadro()` e `legenda()` montam os componentes. `window.seek(t)` desenha o quadro do instante t; `window.eventosSom()` devolve os eventos de som calculados com os mesmos tempos"
+    },
+    {
+      "pasta": "gerar/dados.py",
+      "conteudo": "escreve `html/data.js` a partir de `tempos-parte1.json`, `palavras-parte1.json` e `footage.json`. Rode sempre que o áudio mudar"
+    },
+    {
+      "pasta": "gerar/eventos.mjs",
+      "conteudo": "abre o HTML no Chrome e grava `audio/eventos.json` com os eventos e as marcas (título, fim da abertura, duração)"
+    },
+    {
+      "pasta": "gerar/fundo_gravura.py",
+      "conteudo": "desenha o fundo vermelho em gravura: retrato em linhas onduladas cuja espessura segue a luz da foto, estrela com hachura cruzada e guilhochê fraco, com vinheta (1350×2400, folga para a câmera)"
+    },
+    {
+      "pasta": "gerar/texturas.py",
+      "conteudo": "gera o papel dos cards (1024 px, repete), os 8 quadros de grão e o recorte do meme usado num card"
+    },
+    {
+      "pasta": "gerar/rostos.py",
+      "conteudo": "acha o rosto em cada foto com o YuNet e recorta um quadrado de 640 px para os círculos"
+    },
+    {
+      "pasta": "extrair_filmagem.py",
+      "conteudo": "corta as tomadas do documentário em sequências JPG 1080×1080 a 30 qps, sem ampliar, e grava `footage.json`"
+    },
+    {
+      "pasta": "render.mjs",
+      "conteudo": "`--stills 1.2,19.0,58 --dir nome` grava quadros parados; `--full --sub 4 --shutter 0.5 --from 0 --to 4` renderiza um trecho"
+    },
+    {
+      "pasta": "render-trechos.sh",
+      "conteudo": "renderiza em trechos de 4 s (navegador novo a cada trecho, até 3 tentativas), junta sem recomprimir, põe o áudio e gera o MP4; trecho que já existe é pulado"
+    },
+    {
+      "pasta": "audio/gerar_voz.py",
+      "conteudo": "manda cada parágrafo à ElevenLabs pela CLI `elevenlabs` e guarda o pedido ao lado do MP3"
+    },
+    {
+      "pasta": "audio/montar.py",
+      "conteudo": "intercala falas reais e narração na ordem da sequência `parte1`, com pausas fixas, e grava `completo-parte1.wav` e `tempos-parte1.json`"
+    },
+    {
+      "pasta": "audio/trilha_v2.py",
+      "conteudo": "junta voz, as duas faixas e os efeitos dos eventos, varia tom e timbre dos carimbos e normaliza em duas passagens para −14 LUFS; grava também a voz, a música e os efeitos separados"
+    }
+  ],
+  "prompt": "Quero um mini documentário vertical no mesmo método do projeto \"Raio-X do Lula 3\", que está em 07-videos/projetos/lula-3/, com outra fonte e outro assunto.\n\nFonte (documentário, entrevista, palestra ou reportagem longa): {{FONTE}}\nRecorte que vira o vídeo (capítulos, tema ou minutos da fonte): {{RECORTE}}\nPersonagem cujas falas reais entram no vídeo: {{PERSONAGEM}}\nFrases da fonte que eu quero ouvir na voz original: {{FALAS}}\nChamada final (próximo episódio, comentário, link): {{CHAMADA}}\nDuração: {{DURACAO}} (a referência tem 2 min 9 s) · Formato: {{FORMATO}} (a referência é 1080×1920, 30 qps)\n(Se algum desses estiver vazio ou com as chaves, me pergunte antes de começar.)\n\n1. Estude o projeto antes de propor qualquer coisa. Leia, nesta ordem: LEIA-ME.md, estilo.md e roteiro.md. Depois abra projeto/html/index.html e veja como funcionam cena(), W('palavra'), pose(), carimbo(), cardNoticia(), tv() com quadro(), legenda(), a câmera viva e window.eventosSom(). Leia também gerar/dados.py, gerar/eventos.mjs, extrair_filmagem.py, render-trechos.sh e audio/montar.py. Me explique em poucas linhas o que você vai reaproveitar.\n\n2. Consuma a fonte inteira antes de escrever. Baixe o vídeo em 1080p com o yt-dlp, transcreva com o faster-whisper (com o tempo de cada palavra), faça folhas de contato a cada 12 s e salve os quadros-chave. Escreva um resumo por capítulo com os números e as datas que a fonte mostra, e diga de onde vem cada um.\n\n3. Meça a identidade da fonte nos quadros, sem inventar: cor do fundo, cor e textura dos cards, cor do texto, fontes (ou as livres mais próximas), como os títulos e os gráficos são desenhados. Me mostre os tokens com hex antes de animar.\n\n4. Roteiro: faça só a estrutura em roteiro.md, no molde do projeto: abertura de trailer só com falas reais (de preferência a mesma ideia repetida em momentos diferentes), título, de 3 a 5 capítulos curtos com um número forte cada, e o fecho com a chamada. Marque onde entra cada fala real e o que aparece na tela em cada frase. Use só fatos da fonte. Me mostre e espere eu escrever ou aprovar a fala.\n\n5. Voz: um parágrafo por arquivo na minha voz clonada (audio/gerar_voz.py, números por extenso no texto enviado), conferido com o faster-whisper. Isole a voz das falas reais com o Demucs, corte cada uma pelo tempo das palavras e monte tudo com audio/montar.py. Gere tempos-*.json e as palavras do áudio montado. Mande o áudio para eu aprovar e não anime antes disso.\n\n6. Assets reais antes de animar: foto real de cada pessoa citada, logo de cada veículo e instituição, foto de cada produto ou lugar, e as manchetes com data para recriar como cards. Registre fonte e crédito de cada arquivo num CATALOGO.md. Corte as tomadas da filmagem com extrair_filmagem.py (janela quadrada, sem ampliar) e recorte os rostos com gerar/rostos.py.\n\n7. Construa copiando o projeto, sem editar o original: troque o fundo (gerar/fundo_gravura.py ou o equivalente da sua fonte), as cores, as fontes, os cards, os gráficos e as cenas. Mantenha: cada elemento entrando na palavra em que é dito (W), a fala real com legenda palavra por palavra e a palavra-chave em destaque, os carimbos que pontuam a fala, os capítulos no topo, a câmera viva, o grão e o seek(t) sem transição CSS nem estado acumulado. Gráfico é redesenhado com os números da fonte e leva a fonte no rodapé; nada de print de gráfico.\n\n8. Som em paralelo, num subagente: exporte os eventos com gerar/eventos.mjs, uma família de som por ação (tecla, carimbo com impacto, papel, contador, glitch nos cortes, boom no título e na chamada), carimbos variando tom e timbre, efeito em evento − pico, trilha por momentos (uma faixa na abertura, outra do título ao fim, cerca de 15 dB abaixo da voz) e final a −14 LUFS com pico abaixo de −1 dBTP.\n\n9. Revise antes do render final: folhas de contato a 2 qps do vídeo inteiro, recortes em tamanho real dos cards, uma IA que ouça o mix e diga onde o som repete ou satura, e detectores de salto e de quadro vazio. Confira cada apontamento nos quadros antes de mexer.\n\n10. Render em trechos de 4 s com 4 subquadros (render-trechos.sh), confira com verificar.py (qps uniforme, duração, BT.709, −14 LUFS) e entregue o MP4, o HTML editável, a ficha do projeto e a lista de fontes. Para corrigir uma cena depois, refaça só os trechos dela.",
+  "campos": [
+    "CHAMADA",
+    "DURACAO",
+    "FALAS",
+    "FONTE",
+    "FORMATO",
+    "PERSONAGEM",
+    "RECORTE"
+  ],
+  "fonte": {
+    "nome": "Clube do Motion",
+    "url": "https://clubedomotion.com/projeto/?id=lula-3",
+    "uso": "liberado pelo dono do Clube do Motion em 18/10/2026 (docs/permissoes/clube-do-motion.md)"
+  }
+}

package/lib/estudio/dados/projetos/clube-morph.json

@@ -0,0 +1,119 @@
+{
+  "id": "clube-morph",
+  "titulo": "Uma forma, 28 batidas",
+  "categoria": "saas",
+  "resumo": "motion de interface de 14 s, quadrado, em que uma única forma nunca é cortada: ela vira botão, loader, check, Dynamic Island, player, slider de volume, toggle, abas, gráfico, barra ⌘K, paleta de comandos, toast e volta ao botão, uma mudança por batida, guiada por um cursor que clica e arrasta de verdade. O último quadro é igual ao primeiro, então o vídeo roda em loop sem emenda. É uma recriação: a referência é o \"Shape morphing through UI states\" de @twoclipping no prompt-motion.com (feito com o Claude Opus 5.5 em HTML + Playwright), que usava tela clara e componentes em preto e branco. A nossa versão seguiu o prompt dele inteiro e vestiu a identidade do Spotify: fundo escuro, verde como única cor de destaque e a música \"Maps\" tocando no próprio player. O autor aprovou a v2.1.",
+  "indicado": "app, SaaS ou produto digital mostrando os componentes da interface; designer de produto montando portfólio de UI motion; post em loop para redes.",
+  "estilo": [
+    "UI motion",
+    "morph contínuo",
+    "modo escuro",
+    "uma cor de destaque",
+    "cursor real",
+    "loop perfeito",
+    "sincronizado na batida"
+  ],
+  "ficha": {
+    "formato": "1440×1440, 60 qps, quadrado",
+    "duracao": "14,0 s (840 quadros), 7 compassos a 120 BPM, sem narração",
+    "motor": "html",
+    "voz": "ver o guia de estilo",
+    "musica": "ver o guia de estilo",
+    "fontes": "ver o guia de estilo"
+  },
+  "ferramentas": [
+    "Claude Code"
+  ],
+  "ficha_tecnica": {
+    "Duração": "14,0 s (840 quadros), 7 compassos a 120 BPM, sem narração",
+    "Formato": "1440×1440, 60 qps, quadrado",
+    "Ferramenta": "HTML num arquivo só com `seek(t)` puro, render com Playwright (Python) e junção no ffmpeg",
+    "Desfoque de movimento": "4 subquadros por quadro, obturador de 180°, `tmix` no ffmpeg",
+    "Trilha": "\"Maps\", Maroon 5, refrão de 40,42 s a 54,42 s (120,0 BPM medidos)",
+    "Som": "89 eventos de interface (cliques, pops, whooshes, teclas, tiques do arrasto), exportados do próprio HTML; −14,9 LUFS medido no final, pico −1,4 dB",
+    "Loop": "`seek(14)` e `seek(0)` dão o mesmo quadro, pixel a pixel",
+    "Referência": "\"Shape morphing through UI states\", @twoclipping, prompt-motion.com"
+  },
+  "etapas": [
+    {
+      "titulo": "O roteiro",
+      "texto": "**Resumo:** o vídeo não tem narração; o roteiro é a grade de batidas escrita antes do código, com o estado da forma e o texto da tela em cada batida. A 120 BPM, a batida k cai em 0,5·k s, e 7 compassos fecham os 14 s do loop.\n\n## De onde veio a estrutura\n\nO prompt de @twoclipping traz a sequência pronta: botão → loader → check → Dynamic Island → player com morph de play/pause → arrastar a barra de progresso → a barra vira slider de volume que estica além do máximo → toggle na batida → o knob vira indicador líquido de abas → as abas abrem num gráfico que se desenha, com tooltip no hover → recolhe em ⌘K → digitar para filtrar → enter → toast → volta ao botão. Ele pede para perguntar os estados, a cor e a música antes de começar e para mostrar a grade antes de escrever código. Aqui as respostas foram os estados do próprio prompt com conteúdo do Spotify, o verde da marca e \"Maps\".\n\n## Grade de batidas\n\n | \n\n | Compasso\n | Batida\n | t (s)\n | Estado e ação\n | Texto na tela\n\n | 1\n | 0\n | 0,0\n | botão verde em hover (cresce 3%)\n | \"Gerar playlist\"\n\n | 1\n | 1\n | 0,5\n | clique: encolhe em loader circular\n | —\n\n | 1\n | 2\n | 1,0\n | o arco fecha em check\n | —\n\n | 1\n | 3\n | 1,5\n | estica em Dynamic Island com capa e equalizador verde\n | —\n\n | 2\n | 4\n | 2,0\n | abre no player\n | \"Maps\" · \"Maroon 5\" · \"0:40\" / \"3:09\"\n\n | 2\n | 5\n | 2,5\n | clique no play: morph play → pausa\n | —\n\n | 2\n | 6\n | 3,0\n | agarra a barra de progresso e arrasta; o tempo acompanha\n | —\n\n | 2\n | 7\n | 3,5\n | solta\n | —\n\n | 3\n | 8\n | 4,0\n | a barra vira slider de volume\n | —\n\n | 3\n | 9\n | 4,5\n | arrasta o volume para baixo; o ícone perde as ondas\n | —\n\n | 3\n | 10\n | 5,0\n | arrasta além do máximo: a forma estica\n | —\n\n | 3\n | 11\n | 5,5\n | solta: volta com mola de onde estava\n | —\n\n | 4\n | 12\n | 6,0\n | o polegar vira o knob de um toggle\n | —\n\n | 4\n | 13\n | 6,5\n | clique: o toggle liga (verde) e o knob estica na frente\n | —\n\n | 4\n | 14\n | 7,0\n | o knob vira o indicador líquido das abas\n | \"7 dias · 28 dias · 12 meses\"\n\n | 4\n | 15\n | 7,5\n | clique em \"28 dias\"\n | —\n\n | 5\n | 16\n | 8,0\n | clique em \"12 meses\"\n | —\n\n | 5\n | 17\n | 8,5\n | as abas abrem no cartão de streams; a linha se desenha e o número conta\n | \"Streams\" · \"Maps · Maroon 5\"\n\n | 5\n | 18\n | 9,0\n | hover no gráfico: o tooltip segue a linha\n | —\n\n | 5\n | 19\n | 9,5\n | tooltip no pico\n | —\n\n | 6\n | 20\n | 10,0\n | clique em \"28 dias\": linha e número mudam\n | —\n\n | 6\n | 21\n | 10,5\n | o cartão recolhe na barra de busca\n | \"Buscar\" · \"⌘K\"\n\n | 6\n | 22\n | 11,0\n | ⌘K abre a paleta de comandos\n | \"O que você quer ouvir?\" · \"Adicionar à fila\" · \"Ir para o rádio da música\" · \"Salvar em Músicas Curtidas\" · \"Abrir Músicas Curtidas\" · \"Compartilhar música\"\n\n | 6\n | 23\n | 11,5\n | digita \"curt\": a lista filtra\n | \"curt\"\n\n | 7\n | 24\n | 12,0\n | clique em \"Salvar em Músicas Curtidas\"; a linha acende em verde\n | —\n\n | 7\n | 25\n | 12,5\n | vira o toast\n | \"Adicionada às Músicas Curtidas\"\n\n | 7\n | 26\n | 13,0\n | o toast volta a ser o botão\n | \"Gerar playlist\"\n\n | 7\n | 27\n | 13,5\n | o cursor volta ao botão; hover, e o loop fecha\n | —\n\n## Momentos para a trilha\n\n- O trecho da música começa num tempo forte (40,42 s de \"Maps\") e dura exatamente 7 compassos, por isso o loop não tem emenda na música.\n\n- Cada mudança de estado tem um som na batida; os arrastos ganham um tique por passo e a paleta, uma tecla por letra.\n\n- Os sons ficam no próprio HTML (`window.SFX`), são exportados para `audio/sfx.json` e entram no mix pelo pico de cada arquivo."
+    },
+    {
+      "titulo": "A identidade visual",
+      "texto": "**Resumo:** interface escura do Spotify num quadrado de 1440 px, uma forma que muda de estado a cada batida, molas em forma fechada com no máximo uma passagem pequena e um cursor que age de verdade. O verde `#1ED760` é a única cor de destaque. Números tirados do `index.html` e do `mixar.py`.\n\n## Cores e fonte\n\n | \n\n | Token\n | Valor\n | Papel\n\n | Fundo\n | `#121212`\n | tela inteira\n\n | Superfície\n | `#1F1F1F`\n | player, slider, abas, cartão do gráfico\n\n | Superfície alta\n | `#282828`\n | barra ⌘K e paleta de comandos\n\n | Toggle desligado\n | `#535353`\n | knob apagado\n\n | Verde\n | `#1ED760`\n | botão, toggle ligado, linha do gráfico, equalizador, cursor de digitação\n\n | Texto\n | `#FFFFFF`\n | títulos\n\n | Secundário\n | `#B3B3B3`\n | artista, tempos, ícones\n\n | Terciário\n | `#8A8A8A`\n | placeholder, atalhos\n\n | Trilho da barra\n | `#4D4D4D`\n | progresso e volume\n\n | Grade do gráfico\n | `#2E2E2E`\n | linhas tracejadas\n\n | Tecla\n | `#3E3E3E`\n | teclas do atalho ⌘K\n\n | Toast\n | `#FFFFFF`\n | o único estado claro\n\n- **Fonte: Figtree**, a geométrica aberta mais próxima da tipografia do Spotify, com números tabulares.\n\n- Ícones em SVG com traço de 2 px e pontas redondas. Área do gráfico em degradê do verde (28% → 0).\n\n## Os estados da forma\n\n`[largura, altura, raio]` em px, no código (`ST`):\n\n | \n\n | Estado\n | Tamanho\n | Cor\n\n | botão\n | 236 × 60, raio 30\n | verde\n\n | loader\n | 60 × 60, raio 30\n | verde\n\n | Dynamic Island\n | 300 × 70, raio 35\n | preto\n\n | player\n | 380 × 236, raio 22\n | superfície\n\n | slider de volume\n | 400 × 64, raio 32, estica além do máximo\n | superfície\n\n | toggle\n | 116 × 64, raio 32\n | cinza → verde\n\n | abas\n | 420 × 60, raio 30\n | superfície\n\n | gráfico\n | 440 × 330, raio 24\n | superfície\n\n | ⌘K\n | 230 × 56, raio 28\n | superfície alta\n\n | paleta\n | 420 × 312, raio 18 (filtrada: 420 × 164)\n | superfície alta\n\n | toast\n | 400 × 60, raio 30\n | branco\n\n## Molas\n\nRespostas ao degrau em forma fechada, `[ω, ζ]` (frequência e amortecimento):\n\n | \n\n | Nome\n | ω\n | ζ\n | Uso\n\n | shape\n | 13\n | 0,84\n | a forma entre estados\n\n | cam\n | 7,2\n | 1\n | câmera que enquadra cada estado\n\n | cur\n | 10,5\n | 0,93\n | cursor\n\n | fast / slow\n | 21 / 10,5\n | 0,86 / 0,97\n | borda da frente e borda de trás do knob e do indicador\n\n | pin / pout\n | 27 / 26\n | 1\n | conteúdo que entra e sai\n\n | press\n | 32\n | 0,82\n | aperto do clique (cursor a 84%, forma a 95–96%)\n\n | data\n | 8\n | 0,95\n | linha do gráfico e contador\n\n | soft\n | 9\n | 1\n | hover\n\n- Um valor com vários alvos é a soma de uma mola por mudança; cada mudança parte do valor anterior.\n\n- O conteúdo entra com desfoque de 7 px que some e sai antes de a forma mudar.\n\n- O arrasto além do máximo usa resistência exponencial (no máximo 58 px de esticada) e, ao soltar, uma mola livre (ω 16, ζ 0,8) a partir da posição e da velocidade daquele instante.\n\n## Cursor\n\n- Trajeto por pontos com a mola do cursor; durante os arrastos, um arco leve de 5 a 8 px (seno ao quadrado, zera nas pontas).\n\n- Nove apertos, cada um com a seta encolhendo para 84% e uma onda leve na tela.\n\n- O valor da barra e do volume é calculado a partir da posição do cursor enquanto ele segura.\n\n## Câmera\n\nEscala por estado para cada um ocupar o quadro: 3,05 no loader, 2,9 na ilha, 2,74 no player, 2,66 no volume, 3,85 no toggle, 2,76 nas abas, 2,62 no gráfico, 3,05 no ⌘K e 2,56–2,72 no resto.\n\n## Render\n\n60 qps; cada quadro é a média de 4 subquadros espalhados em meio quadro (obturador de 180°), juntados com `tmix=frames=4` e `select` de 1 em 4.\n\n## Som\n\n | \n\n | Item\n | Valor\n\n | Música\n | \"Maps\", Maroon 5, refrão de 40,42 s a 54,42 s (7 compassos), ganho 0,27\n\n | Efeitos\n | 14 arquivos nivelados: cliques, clique de mouse, pops, teclas, digitação, whooshes curtos e longo\n\n | Posição\n | cada som em `evento − pico`, com tom variando ±3%\n\n | Reforços\n | sons de interface ×1,35 (v2) e cliques e digitação de 1,4 a 2,2 vezes mais (v2.1)\n\n | Loop\n | caudas que passam de 14 s voltam no início\n\n | Final\n | `loudnorm` em duas passagens; medido −14,9 LUFS, pico −1,4 dB\n\n## O que é \"humano\" neste vídeo\n\n- A mão faz arco no arrasto, aperta no clique e respira entre as ações.\n\n- O knob estica na frente antes de a traseira alcançar.\n\n- O volume puxado além do máximo resiste e volta de onde estava, sem salto.\n\n- O contador e a linha do gráfico assentam com mola, e o número ganha um desfoque leve só enquanto corre."
+    },
+    {
+      "titulo": "A montagem em HTML",
+      "texto": "| \n\n | Arquivo\n | O que faz\n\n | `html/index.html`\n | `seek(t)` calcula cada estilo do zero. As molas são respostas ao degrau em forma fechada; um valor que muda de alvo várias vezes é a soma de uma mola por mudança (`track`), com cópias do loop anterior para o fim encaixar no começo. Também guarda a lista de sons em `window.SFX`\n\n | `render.py beats`\n | um quadro no meio de cada uma das 28 batidas e a folha de contato, para revisar antes do render\n\n | `render.py frames 3.0 3.25`\n | quadros avulsos\n\n | `render.py sfx`\n | exporta `window.SFX` para `audio/sfx.json`\n\n | `render.py full`\n | 840 quadros × 4 subquadros em JPEG numa pasta temporária, prontos para a junção\n\n | `audio/batidas.py`\n | mede batidas e tempos fortes com o beat_this\n\n | `audio/mixar.py`\n | corta o refrão, posiciona cada som pelo pico medido com variação de tom de ±3%, faz as caudas que passam de 14 s darem a volta no início e normaliza em duas passagens\n\n- **Junte as pastas:** copie `audio/` para dentro de `projeto/` (o `render.py` grava em `audio/sfx.json` e a junção usa `audio/mix.wav`).\n\n- **Ver:** abra `html/index.html` no Chrome e chame `seek(3.2)` no console para parar num instante.\n\n- **Preparar:** `pip install playwright` e `python -m playwright install chromium`; ffmpeg no PATH; numpy para o mix e beat_this para medir batidas.\n\n- **Revisar por batida:** `python render.py beats` gera `revisao/batidas/` e a folha.\n\n- **Som:** no `audio/mixar.py`, aponte `SFX_DIR` para `audio/sfx/nivelados`; rode `python render.py sfx` e depois `python audio/mixar.py`.\n\n- **Vídeo:** `python render.py full` grava os subquadros na pasta definida no fim do `render.py` (troque pelo caminho que quiser) e depois junte:\n\nffmpeg -framerate 240 -i <pasta>/s%05d.jpg -i audio/mix.wav -filter_complex \"[0:v]tmix=frames=4,select='eq(mod(n\\,4)\\,3)',setpts=N/60/TB,format=yuv420p[v]\" -map \"[v]\" -map 1:a -r 60 -c:v libx264 -crf 14 -c:a aac -b:a 320k render/spotify-morph-vN.mp4\n\n**Pegadinhas:** o primeiro screenshot depois de abrir sai diferente (o `render.py` aquece com quatro capturas antes); nada de `will-change` no que a câmera escala, ou o texto sai borrado; texto que troca dentro de um contêiner que se transforma precisa de entrada e saída próprias, senão um atravessa o outro; nas bordas do knob, \"indo para a direita\" quer dizer borda direita rápida."
+    },
+    {
+      "titulo": "As decisões de direção",
+      "texto": "- **Uma forma só, do começo ao fim.** Cada estado é o mesmo elemento mudando largura, altura, raio e cor; o conteúdo troca com um desfoque curto e entra depois da forma, sai antes dela.\n\n- **Algo acontece em toda batida.** A grade de 28 batidas foi escrita antes do código, e cada estado tem a sua.\n\n- **O cursor dirige tudo.** Cliques com aperto e onda, arrastos que leem a posição do cursor (o valor segue a mão e volta com mola de onde estava quando solta) e um arco leve na mão durante o arrasto, porque a mão real não anda em linha reta.\n\n- **Bordas em molas diferentes.** No toggle e nas abas, a borda da frente vai numa mola rápida e a de trás numa lenta: o knob estica como líquido.\n\n- **Arrastar além do máximo estica a forma** com resistência crescente e devolve com mola livre ao soltar.\n\n- **A câmera enquadra cada estado** para que ele ocupe o quadro, com mola criticamente amortecida.\n\n- **Identidade do assunto.** O prompt pedia preto e branco ou uma cor de acento; a cor virou o verde do Spotify, a fonte virou Figtree, a capa é a oficial e o player mostra a própria música que está tocando.\n\n- **Loop perfeito**, com cursor, posição e velocidade iguais no primeiro e no último quadro; até as caudas dos sons dão a volta.\n\n- **Um som por ação, pelo pico medido**, incluindo um tique por passo do arrasto e do contador.\n\nDetalhes de cores, molas e som: estilo.md. Batida por batida: roteiro.md. Para fazer um motion de interface no mesmo estilo com o seu produto: PROMPT.md."
+    },
+    {
+      "titulo": "As versões até o final",
+      "texto": "| \n\n | Versão\n | O que mudou\n\n | v1\n | estrutura completa; revisão por batida corrigiu molas das bordas trocadas (o knob sumia na batida 12), conteúdo entrando lento, indicador por cima dos rótulos e área do gráfico aparecendo antes da linha\n\n | v2\n | o Gemini ouviu a v1 e apontou sons de interface enterrados na música, arrasto em linha reta e contador borrado: música a 0,30, sons +2,6 dB, um tique por passo do arrasto e do contador, arco no cursor e menos desfoque no número\n\n | **v2.1**\n | só o áudio: os cliques, medidos empatados com a música no pico, subiram cerca de 4 dB, e a música foi para 0,27; aprovada"
+    }
+  ],
+  "pacote": [
+    {
+      "pasta": "projeto/",
+      "conteudo": "`html/index.html` (a forma, os estados, o cursor, a câmera e a lista de sons), `html/Figtree.ttf`, `html/cover.jpg` (capa oficial do single) e `render.py`"
+    },
+    {
+      "pasta": "audio/",
+      "conteudo": "`mixar.py`, `batidas.py`, as batidas medidas (`batidas.json`), a lista de sons exportada (`sfx.json`), a música, o mix final e `sfx/` com os 14 arquivos de efeito usados"
+    },
+    {
+      "pasta": "referencias/",
+      "conteudo": "o prompt original de @twoclipping, as folhas de contato do vídeo original e a comparação lado a lado (original × nossa v1)"
+    },
+    {
+      "pasta": "render.mp4",
+      "conteudo": "o vídeo final (v2.1)"
+    },
+    {
+      "pasta": "html/index.html",
+      "conteudo": "`seek(t)` calcula cada estilo do zero. As molas são respostas ao degrau em forma fechada; um valor que muda de alvo várias vezes é a soma de uma mola por mudança (`track`), com cópias do loop anterior para o fim encaixar no começo. Também guarda a lista de sons em `window.SFX`"
+    },
+    {
+      "pasta": "render.py beats",
+      "conteudo": "um quadro no meio de cada uma das 28 batidas e a folha de contato, para revisar antes do render"
+    },
+    {
+      "pasta": "render.py frames 3.0 3.25",
+      "conteudo": "quadros avulsos"
+    },
+    {
+      "pasta": "render.py sfx",
+      "conteudo": "exporta `window.SFX` para `audio/sfx.json`"
+    },
+    {
+      "pasta": "render.py full",
+      "conteudo": "840 quadros × 4 subquadros em JPEG numa pasta temporária, prontos para a junção"
+    },
+    {
+      "pasta": "audio/batidas.py",
+      "conteudo": "mede batidas e tempos fortes com o beat_this"
+    },
+    {
+      "pasta": "audio/mixar.py",
+      "conteudo": "corta o refrão, posiciona cada som pelo pico medido com variação de tom de ±3%, faz as caudas que passam de 14 s darem a volta no início e normaliza em duas passagens"
+    }
+  ],
+  "prompt": "Quero um motion de interface em loop no mesmo método do projeto \"Uma forma, 28 batidas\", que está em 07-videos/projetos/morph/, com o meu produto.\n\nProduto ou marca: {{PRODUTO}}\nSite oficial (cores, fonte, logo, telas reais): {{SITE}}\nEstados que a forma deve virar (8 a 12, na ordem): {{ESTADOS}}\nCor de destaque: {{COR}} (a referência usa só o verde do Spotify)\nDuração: {{DURACAO}} (a referência tem 14 s, 7 compassos a 120 BPM) · Formato: {{FORMATO}} (a referência é 1440×1440)\n(Se algum desses estiver vazio ou com as chaves, me pergunte antes de começar.)\n\n1. Estude o projeto antes de propor qualquer coisa. Leia LEIA-ME.md, estilo.md e roteiro.md e o prompt original em referencias/. Depois abra projeto/html/index.html e entenda S() (mola em forma fechada), track() (uma mola por mudança, com cópias do loop anterior), os estados em ST, a câmera em CAM, o cursor em CUR0/ARCS/PRESS e a lista window.SFX. Leia também render.py e audio/mixar.py. Me explique em poucas linhas o que você vai reaproveitar.\n\n2. Tire a identidade do assunto: cores do CSS do site, a fonte (ou a livre mais próxima), ícones no mesmo traço e um asset real do produto (capa, foto, logo). Uma cor de destaque só.\n\n3. Escolha a música nas minhas playlists, perto de 120 BPM, meça com audio/batidas.py e comece num tempo forte. Escreva a grade de batidas (compasso, batida, tempo, estado, ação do cursor, texto na tela) e me mostre antes de escrever código. Algo acontece em toda batida; nenhum estado fica sem ação.\n\n4. Construa copiando o projeto, sem editar o original. Mantenha: seek(t) sem transição CSS, timer nem estado entre quadros; molas fechadas somadas por mudança; o conteúdo que entra depois da forma e sai antes dela, com desfoque curto; as duas bordas do knob e do indicador em molas diferentes; arrasto que lê a posição do cursor e volta com mola livre de onde estava; arco leve na mão durante o arrasto; câmera que enquadra cada estado; nada de will-change no que a câmera escala. Troque: estados, textos, cores, ícones e asset.\n\n5. Faça o último quadro igual ao primeiro, com cursor, posição e velocidade iguais. Confira renderizando seek(0) e seek(duração) e comparando pixel a pixel.\n\n6. Rode render.py beats e me mostre a folha com um quadro por batida. Corrija o que estiver fora da grade, apertado ou difícil de ler antes do render completo.\n\n7. Som: um som por ação, declarado em window.SFX no próprio HTML, exportado com render.py sfx e posicionado pelo pico medido de cada arquivo, com caudas que passam do fim voltando ao começo. Música baixa o bastante para os cliques aparecerem; meça o pico de cada evento contra a música e suba o que estiver empatado. Final em −14 LUFS.\n\n8. Render com 4 subquadros por quadro, obturador de 180°, junção com tmix a 60 qps. Peça a uma IA que assista com áudio e confira cada apontamento nos quadros e na medição antes de mexer. Entregue o MP4, o HTML editável e uma anotação com a grade final.",
+  "campos": [
+    "COR",
+    "DURACAO",
+    "ESTADOS",
+    "FORMATO",
+    "PRODUTO",
+    "SITE"
+  ],
+  "fonte": {
+    "nome": "Clube do Motion",
+    "url": "https://clubedomotion.com/projeto/?id=morph",
+    "uso": "liberado pelo dono do Clube do Motion em 18/10/2026 (docs/permissoes/clube-do-motion.md)"
+  }
+}