primocode 10.17.1 → 10.19.0

package/kits/campos-de-cor/SKILL.md

@@ -0,0 +1,55 @@
+---
+slug: campos-de-cor
+nome: Campos de cor
+descricao: campos de cor chapada que trocam na batida, palavras gigantes com ponto colorido, formas geométricas
+familia: SaaS e tecnologia
+versao: 2
+quando:
+  - "vídeo de evento, festival ou lançamento com muita energia"
+  - "abertura de canal ou showreel de motion design"
+  - "reels com palavras gigantes e cores fortes"
+  - "quero algo estilo Claude Design / motion de agência"
+  - "anúncio curto com troca de cor a cada batida"
+nao_serve:
+  - "vídeo calmo, premium ou institucional (use apple-tipografico ou luxo)"
+  - "interface de produto na tela (use saas-linear)"
+---
+
+# Campos de cor
+
+Campos de cor chapada que **trocam na batida** (tinta `#101010`, vermelho `#F0442A`, azul `#2B3BF0`, lima `#DDFF3A`, creme `#F1EDE4`), cada um com **uma palavra gigante em Archivo Black** com um ponto colorido que cai no fim, ou uma **forma geométrica que se transforma** (círculo → flor → quadrado) ou um **asterisco de 12 raios girando**. Toda cena leva a assinatura visual do estilo: cantos de mira e micro-legenda em mono com código de tempo correndo. Serifa itálica só para a frase de apoio. Cortes secos, cortinas de cor e whips.
+
+**Respiro (v2).** O campo de cor é o protagonista junto com a palavra, então ele precisa sobrar: **margem de 108 px (10%)** dos dois lados, herói com no máximo **760 px** de largura, **um motivo de forma por vez** (asterisco **ou** forma **ou** palavra, nunca dois) e **1 apoio** no máximo. Depois de cada golpe grande (palavra assentou, ponto caiu, forma abriu) a cena **segura 15–24 quadros (0,5–0,8 s)** antes de cortar. Cenas de 1,3–1,8 s.
+
+## Como montar um vídeo com este kit
+
+1. **Leia o pedido e o roteiro.** Corte cada fala em frases curtas. Uma frase = um plano.
+2. **Escolha as batidas** em `receita.json`. Cada batida diz quanto dura e quais elementos servem.
+3. **Escreva o plano de cenas** (`plano.json`, mesmo formato de `exemplos/plano.json`): `de`/`ate` em quadros, `entrada`, `camadas` (elemento + props) e `sons`. Os cortes seguem a voz ou a batida da trilha (1 batida = 14.29 quadros).
+4. **Renderize** com `<Montagem plano={...} arquivos={...} />`.
+5. **Confira** um quadro por cena contra `regras/`: área segura, herói grande, nada parado, nada cortado.
+
+## Elementos
+
+| elemento | o que faz | batidas |
+|---|---|---|
+| `CampoDeCor` | o campo chapado da cena com cantos de mira, micro-legenda e código de tempo; base de TODA cena | todas |
+| `PalavraGigante` | palavra enorme, letra a letra esticada/desfocada, ponto colorido que quica | nome, data |
+| `FormaGeometrica` | círculo→flor→quadrado girando (anel de 14 marcadores só com `anel: true`, sem legenda junto) | forma |
+| `Asterisco` | 12 raios girando + anel + texto em órbita | gancho |
+| `ListaRegua` | linhas com bolinhas que correm em réguas com curvas diferentes | lista |
+| `FitaDeTexto` | faixas de cor com palavra repetida correndo; sozinha na cena (ela sangra de propósito) | lugar |
+| `LegendaItalica` | frase de apoio em serifa itálica, revelada por máscara | apoio |
+| `AssinaturaMarca` | logo + nome + ponto colorido + endereço | marca (última) |
+| `Fundo`, `Camera`, `Cena` | o chão, a deriva da câmera e a janela de cada plano | todas |
+| `Efeito`, `Trilha` | sons e trilha do kit | todas |
+
+## Proibido
+
+- Degradê, textura, foto ou sombra: os campos são chapados.
+- Brilho/glow em letra, flash branco, degradê roxo-azul.
+- Mais de 2 cores de campo vizinhas iguais: toda cena troca de cor.
+- Quadro cheio: palavra encostando na borda (margem < 108 px), herói mais largo que 760 px, dois motivos de forma juntos, mais de 1 apoio, lista com mais de 3 linhas.
+- Corte logo depois do golpe: segure 15–24 quadros.
+- Texto fora da área segura (168–1330 px, 108 px nas laterais); só o HUD fica perto da margem.
+- Quadro parado: forma, asterisco, régua e faixas se mexem o tempo todo.

package/kits/campos-de-cor/assets/ASSETS.md

@@ -0,0 +1,19 @@
+# Assets do kit campos-de-cor
+
+| arquivo | o que é | origem | licença |
+|---|---|---|---|
+| `fontes/archivo-black.woff2` | Archivo Black (subset latino) | Google Fonts, baixado em 26/10/2026 | SIL OFL 1.1 — texto em `fontes/OFL-Archivo-Black.txt` |
+| `fontes/dm-mono.woff2` | DM Mono (subset latino) | Google Fonts, baixado em 26/10/2026 | SIL OFL 1.1 — texto em `fontes/OFL-DM-Mono.txt` |
+| `fontes/playfair-italic.woff2` | Playfair Display (subset latino) | Google Fonts, baixado em 26/10/2026 | SIL OFL 1.1 — texto em `fontes/OFL-Playfair-Italic.txt` |
+| `sons/whoosh-entra.mp3` | efeito `whoosh_in` | sintetizado: MotionCraft `sfx make`, pacote do kit | sem samples; síntese própria (CC0) |
+| `sons/whoosh-sai.mp3` | efeito `whoosh_out` | sintetizado: MotionCraft `sfx make`, pacote do kit | sem samples; síntese própria (CC0) |
+| `sons/swoosh.mp3` | efeito `swoosh` | sintetizado: MotionCraft `sfx make`, pacote do kit | sem samples; síntese própria (CC0) |
+| `sons/pop-palavra.mp3` | efeito `word_pop` | sintetizado: MotionCraft `sfx make`, pacote do kit | sem samples; síntese própria (CC0) |
+| `sons/pop-cartao.mp3` | efeito `icon_pop` | sintetizado: MotionCraft `sfx make`, pacote do kit | sem samples; síntese própria (CC0) |
+| `sons/clique.mp3` | efeito `button` | sintetizado: MotionCraft `sfx make`, pacote do kit | sem samples; síntese própria (CC0) |
+| `sons/impacto.mp3` | efeito `impact` | sintetizado: MotionCraft `sfx make`, pacote do kit | sem samples; síntese própria (CC0) |
+| `sons/subida.mp3` | efeito `riser` | sintetizado: MotionCraft `sfx make`, pacote do kit | sem samples; síntese própria (CC0) |
+| `sons/assinatura.mp3` | efeito `logo_sting` | sintetizado: MotionCraft `sfx make`, pacote do kit | sem samples; síntese própria (CC0) |
+| `trilha/trilha.mp3` | 9 s de trilha | MotionCraft `music make` ({"preset": "tech-bright", "bpm": 126, "key": "F", "progression": "hopeful", "lead": "marimba", "drums": "tight", "comp": "offbeat", "brightness": 1.1}) | sem samples; síntese própria (CC0). MotionCraft é MIT |
+
+Conteúdo de demonstração (fica em `exemplos/`, não faz parte do estilo): desenhado no código ou SVG próprio, sem fotos de terceiros, a menos que listado abaixo.

package/kits/campos-de-cor/assets/fontes/OFL-Archivo-Black.txt

@@ -0,0 +1,93 @@
+Copyright The Archivo Black Project Authors (https://github.com/Omnibus-Type/ArchivoBlack)
+
+This Font Software is licensed under the SIL Open Font License, Version 1.1.
+This license is copied below, and is also available with a FAQ at:
+https://scripts.sil.org/OFL
+
+
+-----------------------------------------------------------
+SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
+-----------------------------------------------------------
+
+PREAMBLE
+The goals of the Open Font License (OFL) are to stimulate worldwide
+development of collaborative font projects, to support the font creation
+efforts of academic and linguistic communities, and to provide a free and
+open framework in which fonts may be shared and improved in partnership
+with others.
+
+The OFL allows the licensed fonts to be used, studied, modified and
+redistributed freely as long as they are not sold by themselves. The
+fonts, including any derivative works, can be bundled, embedded, 
+redistributed and/or sold with any software provided that any reserved
+names are not used by derivative works. The fonts and derivatives,
+however, cannot be released under any other type of license. The
+requirement for fonts to remain under this license does not apply
+to any document created using the fonts or their derivatives.
+
+DEFINITIONS
+"Font Software" refers to the set of files released by the Copyright
+Holder(s) under this license and clearly marked as such. This may
+include source files, build scripts and documentation.
+
+"Reserved Font Name" refers to any names specified as such after the
+copyright statement(s).
+
+"Original Version" refers to the collection of Font Software components as
+distributed by the Copyright Holder(s).
+
+"Modified Version" refers to any derivative made by adding to, deleting,
+or substituting -- in part or in whole -- any of the components of the
+Original Version, by changing formats or by porting the Font Software to a
+new environment.
+
+"Author" refers to any designer, engineer, programmer, technical
+writer or other person who contributed to the Font Software.
+
+PERMISSION & CONDITIONS
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of the Font Software, to use, study, copy, merge, embed, modify,
+redistribute, and sell modified and unmodified copies of the Font
+Software, subject to the following conditions:
+
+1) Neither the Font Software nor any of its individual components,
+in Original or Modified Versions, may be sold by itself.
+
+2) Original or Modified Versions of the Font Software may be bundled,
+redistributed and/or sold with any software, provided that each copy
+contains the above copyright notice and this license. These can be
+included either as stand-alone text files, human-readable headers or
+in the appropriate machine-readable metadata fields within text or
+binary files as long as those fields can be easily viewed by the user.
+
+3) No Modified Version of the Font Software may use the Reserved Font
+Name(s) unless explicit written permission is granted by the corresponding
+Copyright Holder. This restriction only applies to the primary font name as
+presented to the users.
+
+4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
+Software shall not be used to promote, endorse or advertise any
+Modified Version, except to acknowledge the contribution(s) of the
+Copyright Holder(s) and the Author(s) or with their explicit written
+permission.
+
+5) The Font Software, modified or unmodified, in part or in whole,
+must be distributed entirely under this license, and must not be
+distributed under any other license. The requirement for fonts to
+remain under this license does not apply to any document created
+using the Font Software.
+
+TERMINATION
+This license becomes null and void if any of the above conditions are
+not met.
+
+DISCLAIMER
+THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
+OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
+COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
+DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
+OTHER DEALINGS IN THE FONT SOFTWARE.

package/kits/campos-de-cor/assets/fontes/OFL-DM-Mono.txt

@@ -0,0 +1,93 @@
+Copyright The DM Mono Project Authors (https://www.github.com/googlefonts/dm-mono)
+
+This Font Software is licensed under the SIL Open Font License, Version 1.1.
+This license is copied below, and is also available with a FAQ at:
+https://scripts.sil.org/OFL
+
+
+-----------------------------------------------------------
+SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
+-----------------------------------------------------------
+
+PREAMBLE
+The goals of the Open Font License (OFL) are to stimulate worldwide
+development of collaborative font projects, to support the font creation
+efforts of academic and linguistic communities, and to provide a free and
+open framework in which fonts may be shared and improved in partnership
+with others.
+
+The OFL allows the licensed fonts to be used, studied, modified and
+redistributed freely as long as they are not sold by themselves. The
+fonts, including any derivative works, can be bundled, embedded, 
+redistributed and/or sold with any software provided that any reserved
+names are not used by derivative works. The fonts and derivatives,
+however, cannot be released under any other type of license. The
+requirement for fonts to remain under this license does not apply
+to any document created using the fonts or their derivatives.
+
+DEFINITIONS
+"Font Software" refers to the set of files released by the Copyright
+Holder(s) under this license and clearly marked as such. This may
+include source files, build scripts and documentation.
+
+"Reserved Font Name" refers to any names specified as such after the
+copyright statement(s).
+
+"Original Version" refers to the collection of Font Software components as
+distributed by the Copyright Holder(s).
+
+"Modified Version" refers to any derivative made by adding to, deleting,
+or substituting -- in part or in whole -- any of the components of the
+Original Version, by changing formats or by porting the Font Software to a
+new environment.
+
+"Author" refers to any designer, engineer, programmer, technical
+writer or other person who contributed to the Font Software.
+
+PERMISSION & CONDITIONS
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of the Font Software, to use, study, copy, merge, embed, modify,
+redistribute, and sell modified and unmodified copies of the Font
+Software, subject to the following conditions:
+
+1) Neither the Font Software nor any of its individual components,
+in Original or Modified Versions, may be sold by itself.
+
+2) Original or Modified Versions of the Font Software may be bundled,
+redistributed and/or sold with any software, provided that each copy
+contains the above copyright notice and this license. These can be
+included either as stand-alone text files, human-readable headers or
+in the appropriate machine-readable metadata fields within text or
+binary files as long as those fields can be easily viewed by the user.
+
+3) No Modified Version of the Font Software may use the Reserved Font
+Name(s) unless explicit written permission is granted by the corresponding
+Copyright Holder. This restriction only applies to the primary font name as
+presented to the users.
+
+4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
+Software shall not be used to promote, endorse or advertise any
+Modified Version, except to acknowledge the contribution(s) of the
+Copyright Holder(s) and the Author(s) or with their explicit written
+permission.
+
+5) The Font Software, modified or unmodified, in part or in whole,
+must be distributed entirely under this license, and must not be
+distributed under any other license. The requirement for fonts to
+remain under this license does not apply to any document created
+using the Font Software.
+
+TERMINATION
+This license becomes null and void if any of the above conditions are
+not met.
+
+DISCLAIMER
+THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
+OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
+COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
+DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
+OTHER DEALINGS IN THE FONT SOFTWARE.

package/kits/campos-de-cor/assets/fontes/OFL-Playfair-Italic.txt

@@ -0,0 +1,93 @@
+Copyright The Playfair Display Project Authors (https://github.com/clauseggers/Playfair)
+
+This Font Software is licensed under the SIL Open Font License, Version 1.1.
+This license is copied below, and is also available with a FAQ at:
+https://scripts.sil.org/OFL
+
+
+-----------------------------------------------------------
+SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
+-----------------------------------------------------------
+
+PREAMBLE
+The goals of the Open Font License (OFL) are to stimulate worldwide
+development of collaborative font projects, to support the font creation
+efforts of academic and linguistic communities, and to provide a free and
+open framework in which fonts may be shared and improved in partnership
+with others.
+
+The OFL allows the licensed fonts to be used, studied, modified and
+redistributed freely as long as they are not sold by themselves. The
+fonts, including any derivative works, can be bundled, embedded, 
+redistributed and/or sold with any software provided that any reserved
+names are not used by derivative works. The fonts and derivatives,
+however, cannot be released under any other type of license. The
+requirement for fonts to remain under this license does not apply
+to any document created using the fonts or their derivatives.
+
+DEFINITIONS
+"Font Software" refers to the set of files released by the Copyright
+Holder(s) under this license and clearly marked as such. This may
+include source files, build scripts and documentation.
+
+"Reserved Font Name" refers to any names specified as such after the
+copyright statement(s).
+
+"Original Version" refers to the collection of Font Software components as
+distributed by the Copyright Holder(s).
+
+"Modified Version" refers to any derivative made by adding to, deleting,
+or substituting -- in part or in whole -- any of the components of the
+Original Version, by changing formats or by porting the Font Software to a
+new environment.
+
+"Author" refers to any designer, engineer, programmer, technical
+writer or other person who contributed to the Font Software.
+
+PERMISSION & CONDITIONS
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of the Font Software, to use, study, copy, merge, embed, modify,
+redistribute, and sell modified and unmodified copies of the Font
+Software, subject to the following conditions:
+
+1) Neither the Font Software nor any of its individual components,
+in Original or Modified Versions, may be sold by itself.
+
+2) Original or Modified Versions of the Font Software may be bundled,
+redistributed and/or sold with any software, provided that each copy
+contains the above copyright notice and this license. These can be
+included either as stand-alone text files, human-readable headers or
+in the appropriate machine-readable metadata fields within text or
+binary files as long as those fields can be easily viewed by the user.
+
+3) No Modified Version of the Font Software may use the Reserved Font
+Name(s) unless explicit written permission is granted by the corresponding
+Copyright Holder. This restriction only applies to the primary font name as
+presented to the users.
+
+4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
+Software shall not be used to promote, endorse or advertise any
+Modified Version, except to acknowledge the contribution(s) of the
+Copyright Holder(s) and the Author(s) or with their explicit written
+permission.
+
+5) The Font Software, modified or unmodified, in part or in whole,
+must be distributed entirely under this license, and must not be
+distributed under any other license. The requirement for fonts to
+remain under this license does not apply to any document created
+using the Font Software.
+
+TERMINATION
+This license becomes null and void if any of the above conditions are
+not met.
+
+DISCLAIMER
+THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
+OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
+COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
+DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
+OTHER DEALINGS IN THE FONT SOFTWARE.

package/kits/campos-de-cor/elementos/AssinaturaMarca.tsx

@@ -0,0 +1,18 @@
+// AssinaturaMarca: logo, nome em Archivo Black com ponto colorido, linha de mono e endereço. Sempre a última cena.
+import React from 'react';
+import {useCurrentFrame} from 'remotion';
+import {COR, FONTE_D, FONTE_T, MAX_HEROI, c01, caber, e5, eb, seg} from './base';
+
+export type AssinaturaMarcaProps = {logo: string; nome: string; detalhe?: string; endereco?: string; cor?: string; ponto?: string; inicio?: number; y?: number};
+
+export const AssinaturaMarca: React.FC<AssinaturaMarcaProps> = ({logo, nome, detalhe, endereco, cor = COR.creme, ponto = COR.vermelho, inicio = 0, y = 700}) => {
+  const f = useCurrentFrame();
+  const lg = eb(seg(f, inicio, inicio + 18)), nm = e5(seg(f, inicio + 6, inicio + 20));
+  const tam = caber(nome, 220, MAX_HEROI, 400, -0.02);
+  return <div style={{position: 'absolute', inset: 0}}>
+    <img src={logo} style={{position: 'absolute', left: 540 - 110, top: y - 300, width: 220, height: 220, transform: `scale(${lg}) rotate(${(1 - lg) * 120}deg)`, opacity: c01(lg * 2)}} />
+    <div style={{position: 'absolute', left: 0, right: 0, top: y - 40, textAlign: 'center', fontFamily: FONTE_D, fontWeight: 400, fontSize: tam, letterSpacing: '-0.02em', lineHeight: 1.05, color: cor, transform: `scaleX(${0.6 + 0.4 * nm})`, opacity: c01(nm * 2)}}>{nome}<span style={{color: ponto}}>.</span></div>
+    {detalhe && <div style={{position: 'absolute', left: 0, right: 0, top: y + tam * 1.1, textAlign: 'center', fontFamily: FONTE_T, fontWeight: 500, fontSize: 28, letterSpacing: '0.14em', textTransform: 'uppercase', color: cor, opacity: c01((f - inicio - 20) / 8)}}>{detalhe}</div>}
+    {endereco && <div style={{position: 'absolute', left: 0, right: 0, top: y + tam * 1.1 + 70, textAlign: 'center', fontFamily: FONTE_T, fontWeight: 500, fontSize: 36, color: ponto, opacity: c01((f - inicio - 26) / 8)}}>{endereco}</div>}
+  </div>;
+};

package/kits/campos-de-cor/elementos/Asterisco.tsx

@@ -0,0 +1,26 @@
+// Asterisco: 12 raios grossos que crescem girando, com um anel fino que se abre e o texto girando em volta. Abre planos escuros.
+import React from 'react';
+import {useCurrentFrame} from 'remotion';
+import {COR, FONTE_T, c01, e5, eb, seg} from './base';
+
+export type AsteriscoProps = {cor?: string; corAnel?: string; texto?: string; inicio?: number; y?: number; raios?: number; /** v2: 0.8 = o anel de texto fica a ≥ 160 px da borda */ escala?: number};
+
+export const Asterisco: React.FC<AsteriscoProps> = ({cor = COR.vermelho, corAnel = COR.creme, texto = 'MOTION · MOTION · MOTION · ', inicio = 0, y = 740, raios = 12, escala = 0.8}) => {
+  const f = useCurrentFrame();
+  const en = eb(seg(f, inicio, inicio + 18)), rot = (f - inicio) * 3.2 * (1 + 2 * (1 - e5(seg(f, inicio, inicio + 24))));
+  const anel = e5(seg(f, inicio + 4, inicio + 26));
+  return <svg width={1080} height={1100} viewBox="-540 -550 1080 1100" style={{position: 'absolute', left: 0, top: y - 550, overflow: 'visible'}}>
+    <g transform={`scale(${escala})`}>
+    <circle r={430 * anel} fill="none" stroke={corAnel} strokeWidth="3" opacity={0.7} />
+    <defs><path id="ast-c" d="M0,-470 A470,470 0 1,1 -0.1,-470" /></defs>
+    <g transform={`rotate(${-rot * 0.4})`} opacity={c01(anel * 2)}><text fill={corAnel} fontFamily={FONTE_T} fontSize="30" letterSpacing="10" fontWeight="500"><textPath href="#ast-c">{texto.repeat(3)}</textPath></text></g>
+    <g transform={`rotate(${rot}) scale(${en})`}>
+      {Array.from({length: raios}, (_, k) => {
+        const a = (k / raios) * Math.PI * 2, L = (k % 2 ? 250 : 340) * (1 + 0.08 * Math.sin(f / 5 + k));
+        return <line key={k} x1={Math.cos(a) * 40} y1={Math.sin(a) * 40} x2={Math.cos(a) * L} y2={Math.sin(a) * L} stroke={cor} strokeWidth="30" strokeLinecap="round" />;
+      })}
+      <circle r="34" fill={cor} />
+    </g>
+    </g>
+  </svg>;
+};

package/kits/campos-de-cor/elementos/Camera.tsx

@@ -0,0 +1,23 @@
+// Camera: deriva constante por baixo de tudo e um soco em cada batida. O quadro nunca fica parado.
+// `batidas` são quadros absolutos do vídeo. Parâmetros do kit em base.ts (CAMERA).
+import React from 'react';
+import {AbsoluteFill, useCurrentFrame} from 'remotion';
+import {CAMERA} from './base';
+
+export type CameraProps = {batidas?: number[]; forca?: number; children: React.ReactNode};
+
+export const posCamera = (f: number, batidas: number[], forca = 1) => {
+  const C = CAMERA;
+  let z = C.z + C.zOsc * Math.sin(f / 90) + f * C.push, dx = Math.sin(f / 37) * C.dx, dy = Math.cos(f / 51) * C.dy;
+  const rot = Math.sin(f / 83) * C.rot;
+  for (const h of batidas) if (f >= h) {
+    const d = Math.exp(-(f - h) / 7) * forca;
+    z += C.soco * d; dx += C.dx * 0.8 * d * Math.sin((f - h) * 2.7 + h); dy += C.dy * 0.8 * d * Math.cos((f - h) * 3.3 + h);
+  }
+  return {z, dx, dy, rot};
+};
+
+export const Camera: React.FC<CameraProps> = ({batidas = [], forca = 1, children}) => {
+  const c = posCamera(useCurrentFrame(), batidas, forca);
+  return <AbsoluteFill style={{transform: `translate(${c.dx}px, ${c.dy}px) rotate(${c.rot}rad) scale(${c.z})`, transformOrigin: '50% 44%'}}>{children}</AbsoluteFill>;
+};

package/kits/campos-de-cor/elementos/CampoDeCor.tsx

@@ -0,0 +1,39 @@
+// CampoDeCor: o campo de cor chapada de uma cena. Cobre a tela, leva os cantos de mira e uma micro-legenda em mono
+// (nome do plano + código de tempo que corre). É a camada de baixo de TODA cena; o resto entra por cima.
+import React from 'react';
+import {useCurrentFrame} from 'remotion';
+import {COR, FONTE_T, LARGURA, ALTURA, c01, e5, seg} from './base';
+
+/** preto ou creme, o que lê melhor sobre `cor` */
+export const tintaPara = (cor: string) => {
+  const n = parseInt(cor.replace('#', ''), 16), r = (n >> 16) & 255, g = (n >> 8) & 255, b = n & 255;
+  return (0.299 * r + 0.587 * g + 0.114 * b) / 255 > 0.5 ? COR.tinta : COR.creme;
+};
+
+export type CampoDeCorProps = {
+  cor?: string;
+  /** micro-legenda do canto: "PLANO 02 · PULSO" */
+  legenda?: string;
+  /** tira o HUD */
+  semMira?: boolean;
+  /** uma faixa diagonal mais clara cruza o campo (quadros); 0 = sem faixa */
+  faixa?: number;
+};
+
+const Canto: React.FC<{x: number; y: number; sx: number; sy: number; cor: string}> = ({x, y, sx, sy, cor}) =>
+  <div style={{position: 'absolute', left: x, top: y, width: 44, height: 44, borderTop: sy > 0 ? `3px solid ${cor}` : undefined, borderBottom: sy < 0 ? `3px solid ${cor}` : undefined, borderLeft: sx > 0 ? `3px solid ${cor}` : undefined, borderRight: sx < 0 ? `3px solid ${cor}` : undefined, transform: `translate(${sx < 0 ? -44 : 0}px, ${sy < 0 ? -44 : 0}px)`}} />;
+
+export const CampoDeCor: React.FC<CampoDeCorProps> = ({cor = COR.vermelho, legenda = '', semMira = false, faixa = 0}) => {
+  const f = useCurrentFrame();
+  const t = tintaPara(cor);
+  const seg2 = Math.floor(f / 30), q = String(f % 30).padStart(2, '0');
+  return <div style={{position: 'absolute', inset: 0, background: cor, overflow: 'hidden'}}>
+    {faixa > 0 && <div style={{position: 'absolute', left: -400 + e5(seg(f, 0, faixa)) * (LARGURA + 900), top: -200, width: 260, height: ALTURA + 400, background: 'rgba(255,255,255,0.18)', transform: 'rotate(18deg)'}} />}
+    {!semMira && <>
+      <Canto x={60} y={190} sx={1} sy={1} cor={t} /><Canto x={LARGURA - 60} y={190} sx={-1} sy={1} cor={t} />
+      <Canto x={60} y={1320} sx={1} sy={-1} cor={t} /><Canto x={LARGURA - 60} y={1320} sx={-1} sy={-1} cor={t} />
+      <div style={{position: 'absolute', left: 124, top: 196, fontFamily: FONTE_T, fontWeight: 500, fontSize: 26, letterSpacing: '0.12em', color: t, opacity: c01(f / 5), textTransform: 'uppercase'}}>{legenda}</div>
+      <div style={{position: 'absolute', right: 124, top: 196, fontFamily: FONTE_T, fontWeight: 500, fontSize: 26, letterSpacing: '0.08em', color: t}}>00:0{seg2}:{q}</div>
+    </>}
+  </div>;
+};

package/kits/campos-de-cor/elementos/Cena.tsx

@@ -0,0 +1,46 @@
+// Cena: janela de tempo de um plano. Entra com movimento e sai com movimento (conforme a entrada).
+// Dentro dela, useCurrentFrame() começa em 0. A saída cruza SOBREPOE quadros com a próxima cena.
+import React, {createContext, useContext} from 'react';
+import {AbsoluteFill, Sequence, useCurrentFrame} from 'remotion';
+import {COR, e5, seg, LARGURA} from './base';
+
+export type Entrada = 'subir' | 'zoom' | 'direita' | 'esquerda' | 'whip' | 'cortina' | 'corte' | 'nenhuma';
+export const SOBREPOE = 10;
+const COM_SAIDA: Entrada[] = ['subir', 'zoom', 'direita', 'esquerda', 'whip'];
+
+const CenaCtx = createContext({duracao: 60});
+/** duração da cena atual em quadros (sem a sobreposição) */
+export const useDuracaoCena = () => useContext(CenaCtx).duracao;
+
+export type CenaProps = {de: number; ate: number; entrada?: Entrada; ultima?: boolean; children: React.ReactNode};
+
+const Janela: React.FC<{duracao: number; entrada: Entrada; ultima: boolean; children: React.ReactNode}> = ({duracao, entrada, ultima, children}) => {
+  const f = useCurrentFrame();
+  const dur = entrada === 'whip' ? 8 : 12;
+  const en = entrada === 'nenhuma' || entrada === 'corte' ? 0 : 1 - e5(seg(f, 0, dur));
+  const sai = !ultima && COM_SAIDA.includes(entrada);
+  const xo = sai ? e5(seg(f, duracao, duracao + SOBREPOE)) : 0;
+  let tf = '';
+  if (entrada === 'subir') tf += `translateY(${en * 260 - xo * 220}px) scale(${1 + xo * 0.06})`;
+  if (entrada === 'zoom') tf += `scale(${1 + en * 0.9 + xo * 0.5})`;
+  if (entrada === 'direita') tf += `translateX(${en * 760 - xo * 760}px)`;
+  if (entrada === 'esquerda') tf += `translateX(${-en * 760 + xo * 760}px)`;
+  if (entrada === 'whip') tf += `translateX(${en * 1500 - xo * 1500}px) skewX(${(en - xo) * -14}deg)`;
+  const blur = en * (entrada === 'whip' ? 34 : 16) + xo * (entrada === 'whip' ? 34 : 14);
+  const opac = entrada === 'whip' ? 1 : (1 - en * 0.85) * (1 - xo);
+  const corte = entrada === 'cortina' ? e5(seg(f, 0, 14)) : 1;
+  return <AbsoluteFill style={{transform: tf || undefined, opacity: opac, filter: blur > 0.3 ? `blur(${blur}px)` : undefined, clipPath: corte < 1 ? `inset(0 ${(1 - corte) * 100}% 0 0)` : undefined}}>
+    {children}
+    {entrada === 'cortina' && corte < 1 && <div style={{position: 'absolute', top: 0, bottom: 0, left: corte * LARGURA - 90, width: 90, background: COR.cortina}} />}
+  </AbsoluteFill>;
+};
+
+export const Cena: React.FC<CenaProps> = ({de, ate, entrada = 'subir', ultima = false, children}) => {
+  const duracao = ate - de;
+  const extra = !ultima && COM_SAIDA.includes(entrada) ? SOBREPOE : 0;
+  return <Sequence from={de} durationInFrames={duracao + extra} layout="none">
+    <CenaCtx.Provider value={{duracao}}>
+      <Janela duracao={duracao} entrada={entrada} ultima={ultima}>{children}</Janela>
+    </CenaCtx.Provider>
+  </Sequence>;
+};

package/kits/campos-de-cor/elementos/FitaDeTexto.tsx

@@ -0,0 +1,24 @@
+// FitaDeTexto: faixas horizontais de cor com uma palavra enorme repetida, cada faixa correndo para um lado.
+import React from 'react';
+import {useCurrentFrame} from 'remotion';
+import {COR, FONTE_D, c01, e5, seg} from './base';
+import {tintaPara} from './CampoDeCor';
+
+export type Faixa = {texto: string; cor?: string; tinta?: string; /** 1 = direita, -1 = esquerda */ dir?: number};
+export type FitaDeTextoProps = {faixas: Faixa[]; inicio?: number; y?: number; altura?: number; /** px por quadro */ velocidade?: number};
+
+export const FitaDeTexto: React.FC<FitaDeTextoProps> = ({faixas, inicio = 0, y = 760, altura = 230, velocidade = 22}) => {
+  const f = useCurrentFrame();
+  const topo = y - (faixas.length * altura) / 2;
+  return <div style={{position: 'absolute', inset: 0}}>
+    {faixas.map((fx, i) => {
+      const cor = fx.cor ?? COR.vermelho, tinta = fx.tinta ?? tintaPara(cor), dir = fx.dir ?? (i % 2 ? -1 : 1);
+      const e = e5(seg(f, inicio + i * 3, inicio + 14 + i * 3));
+      const unid = `${fx.texto}  ●  `, w = unid.length * altura * 0.62;
+      const off = ((f - inicio) * velocidade * dir) % w;
+      return <div key={i} style={{position: 'absolute', left: 0, width: 1080, top: topo + i * altura, height: altura, background: cor, overflow: 'hidden', transform: `translateX(${(1 - e) * dir * -1080}px)`, opacity: c01(e * 3)}}>
+        <div style={{position: 'absolute', left: off - w, top: 0, height: altura, display: 'flex', alignItems: 'center', fontFamily: FONTE_D, fontWeight: 400, fontSize: altura * 0.7, color: tinta, whiteSpace: 'pre', letterSpacing: '-0.01em'}}>{unid.repeat(4)}</div>
+      </div>;
+    })}
+  </div>;
+};

package/kits/campos-de-cor/elementos/FormaGeometrica.tsx

@@ -0,0 +1,37 @@
+// FormaGeometrica: o herói de formas. Um corpo de 500 px que vira círculo → flor → quadrado sem parar, girando,
+// cercado por um anel de 14 marcadores que trocam de forma junto. Tudo em um SVG, sem imagem.
+import React from 'react';
+import {useCurrentFrame} from 'remotion';
+import {COR, c01, e3, eb, seg} from './base';
+
+const raio = (fase: number, ang: number, R: number) => {
+  // fase 0 círculo, 1 flor de 5 pétalas, 2 quadrado arredondado, 3 volta ao círculo
+  const circ = R, flor = R * (0.7 + 0.3 * Math.cos(5 * ang)), q = R * 0.86 / Math.max(Math.abs(Math.cos(ang)), Math.abs(Math.sin(ang)));
+  const i = Math.floor(fase) % 3, t = e3(fase - Math.floor(fase));
+  const A = [circ, flor, q][i], B = [flor, q, circ][i];
+  return A + (B - A) * t;
+};
+const caminho = (fase: number, R: number, rot: number) => {
+  const pts = Array.from({length: 96}, (_, k) => {const a = (k / 96) * Math.PI * 2, r = raio(fase, a, R); return `${(Math.cos(a + rot) * r).toFixed(1)},${(Math.sin(a + rot) * r).toFixed(1)}`;});
+  return `M${pts.join('L')}Z`;
+};
+
+export type FormaGeometricaProps = {cor?: string; corAnel?: string; inicio?: number; y?: number; /** quadros por troca de forma */ periodo?: number;
+  /** v2: um motivo por vez. O anel de marcadores e o contorno extra só entram com `anel: true` (e aí sem legenda junto). */ anel?: boolean; raio?: number};
+
+export const FormaGeometrica: React.FC<FormaGeometricaProps> = ({cor = COR.creme, corAnel = COR.vermelho, inicio = 0, y = 740, periodo = 24, anel = false, raio: R0 = 250}) => {
+  const f = useCurrentFrame();
+  const en = eb(seg(f, inicio, inicio + 16)), fase = Math.max(0, f - inicio) / periodo;
+  const rot = (f - inicio) * 0.035;
+  return <svg width={1080} height={1000} viewBox="-540 -500 1080 1000" style={{position: 'absolute', left: 0, top: y - 500, overflow: 'visible'}}>
+    <g transform={`scale(${en})`} opacity={c01(en * 2)}>
+      {anel && <circle r={470} fill="none" stroke={corAnel} strokeWidth="3" strokeDasharray="6 14" transform={`rotate(${-rot * 30})`} />}
+      <path d={caminho(fase, R0, rot)} fill={cor} stroke={corAnel} strokeWidth="6" transform={`scale(${1 + 0.04 * Math.sin(f / 4)})`} />
+      {anel && <path d={caminho(fase + 0.15, R0 * 1.16, -rot)} fill="none" stroke={corAnel} strokeWidth="3" opacity="0.8" />}
+      {anel && Array.from({length: 14}, (_, k) => {
+        const a = (k / 14) * Math.PI * 2 + rot * 1.3, x = Math.cos(a) * 400, yy = Math.sin(a) * 400;
+        return <path key={k} d={caminho(fase + k * 0.07, 24, a)} fill={cor} transform={`translate(${x},${yy})`} />;
+      })}
+    </g>
+  </svg>;
+};

package/kits/campos-de-cor/elementos/Fundo.tsx

@@ -0,0 +1,11 @@
+// Fundo: o preto-tinta por baixo de tudo, com uma retícula de pontos que corre devagar. Os campos de cor das cenas cobrem isto.
+import React from 'react';
+import {AbsoluteFill, useCurrentFrame} from 'remotion';
+import {COR} from './base';
+
+export const Fundo: React.FC<{velocidade?: number}> = ({velocidade = 1}) => {
+  const f = useCurrentFrame() * velocidade;
+  return <AbsoluteFill style={{background: COR.tinta, backgroundImage: `radial-gradient(${COR.creme} 2px, transparent 2.5px)`, backgroundSize: '90px 90px', backgroundPosition: `${f * 2}px ${f}px`, opacity: 1}}>
+    <AbsoluteFill style={{background: COR.tinta, opacity: 0.88}} />
+  </AbsoluteFill>;
+};