primocode 11.0.0 → 11.2.0

package/kits/metal-liquido/receita.json

@@ -1,173 +0,0 @@
-{
-  "kit": "metal-liquido",
-  "fps": 30,
-  "batida_trilha_quadros": 15.789,
-  "duracao_video_s": [
-    6,
-    45
-  ],
-  "ordem_sugerida": [
-    "gancho",
-    "virada",
-    "prova",
-    "data",
-    "cta",
-    "marca"
-  ],
-  "batidas": [
-    {
-      "nome": "gancho",
-      "obrigatoria": true,
-      "duracao": [
-        38,
-        60
-      ],
-      "elementos": [
-        "BolhasCromadas",
-        "PilulaCromo"
-      ],
-      "entrada": [
-        "nenhuma"
-      ],
-      "sons": [
-        "subida",
-        "liquido"
-      ],
-      "nota": "herói: bolhas se fundindo; apoio: uma pílula com uma palavra."
-    },
-    {
-      "nome": "virada",
-      "obrigatoria": true,
-      "duracao": [
-        42,
-        66
-      ],
-      "elementos": [
-        "TituloCromo"
-      ],
-      "entrada": [
-        "zoom"
-      ],
-      "sons": [
-        "whoosh",
-        "cromo",
-        "varre"
-      ],
-      "nota": "o nome do produto em 2 linhas de cromo, sozinho no quadro."
-    },
-    {
-      "nome": "prova",
-      "obrigatoria": true,
-      "duracao": [
-        36,
-        54
-      ],
-      "elementos": [
-        "EsferaCromo",
-        "AnelCromo",
-        "PilulaCromo"
-      ],
-      "entrada": [
-        "subir",
-        "direita"
-      ],
-      "sons": [
-        "quique",
-        "varre",
-        "clique"
-      ],
-      "nota": "um objeto de cromo gigante + uma pílula com o benefício."
-    },
-    {
-      "nome": "data",
-      "obrigatoria": false,
-      "duracao": [
-        36,
-        54
-      ],
-      "elementos": [
-        "TituloCromo",
-        "PilulaCromo"
-      ],
-      "entrada": [
-        "zoom"
-      ],
-      "sons": [
-        "subida",
-        "cromo",
-        "clique"
-      ],
-      "nota": "data em cromo + pílula verde-ácido com o evento."
-    },
-    {
-      "nome": "cta",
-      "obrigatoria": false,
-      "duracao": [
-        30,
-        48
-      ],
-      "elementos": [
-        "PilulaCromo",
-        "BolhasCromadas"
-      ],
-      "entrada": [
-        "subir"
-      ],
-      "sons": [
-        "clique",
-        "liquido"
-      ],
-      "nota": "pílula verde-ácido grande com a ação."
-    },
-    {
-      "nome": "marca",
-      "obrigatoria": true,
-      "duracao": [
-        48,
-        90
-      ],
-      "elementos": [
-        "AssinaturaMarca"
-      ],
-      "entrada": [
-        "zoom"
-      ],
-      "sons": [
-        "assinatura",
-        "liquido"
-      ],
-      "nota": "sempre a última. As bolhas fundem no logo."
-    }
-  ],
-  "transicoes": [
-    {
-      "nome": "zoom",
-      "quadros": 14,
-      "como": "entra de 1,9x para 1 com desfoque 10 px; a anterior sai crescendo"
-    },
-    {
-      "nome": "subir",
-      "quadros": 14,
-      "como": "entra 300 px de baixo"
-    },
-    {
-      "nome": "direita",
-      "quadros": 14,
-      "como": "entra 800 px da direita"
-    },
-    {
-      "nome": "nenhuma",
-      "quadros": 0,
-      "como": "só a primeira cena"
-    }
-  ],
-  "camera": {
-    "deriva": "sempre, push lento de 4% no vídeo",
-    "socos": "fusão das bolhas, quique da esfera, impacto da data"
-  },
-  "trilha": {
-    "arquivo": "assets/trilha/sombrio-114bpm.mp3",
-    "volume": 0.55,
-    "com_narracao": 0.28
-  }
-}

package/kits/metal-liquido/regras/area-segura.md

@@ -1,16 +0,0 @@
-# Área segura (9:16, 1080×1920)
-
-- Tudo que se lê fica entre **y = 168** e **y = 1330** e entre **x = 96** e **x = 984** (888 px úteis).
-- Embaixo de 1330 px ficam a legenda e os botões do Reels/TikTok: ali só fundo e o que sangra.
-- Respiro: 35–45% do quadro livre, 1 herói + no máximo 1 apoio por cena, nada encostando na borda, pausa de 15–24 quadros depois de cada impacto.
-- Posições de referência (centro da linha, em px):
-
-| uso | y |
-|---|---|
-| herói (centro) | 640–760 |
-| título de 2 linhas (centro) | 700 |
-| apoio em pílula | 1120–1180 |
-| logo na assinatura | 600 |
-| endereço | 1130 |
-
-- Só o brilho de estúdio do fundo sangra; o herói fica dentro das margens de 96 px.

package/kits/metal-liquido/regras/cor.md

@@ -1,23 +0,0 @@
-# Cor
-
-| token | hex | uso |
-|---|---|---|
-| `grafite` | #0C0D12 | chão |
-| `grafiteClaro` | #1A1D27 | luz de estúdio no fundo |
-| `cromo1` | #F4F7FC | cromo: céu claro e realce |
-| `cromo2` | #C9D0DE | cromo: meio-tom |
-| `cromo3` | #727A8E | cromo: sombra suave |
-| `cromo4` | #12141B | cromo: linha do horizonte |
-| `lima` | #C8FF3D | único acento (pílula, detalhe) |
-| `gelo` | #8FD3FF | reflexo azulado dentro do metal |
-
-## Degradês e sombras
-
-- Horizonte do cromo: `linear-gradient(180deg, #F4F7FC 0%, #C9D0DE 24%, #727A8E 46%, #12141B 50%, #8E96AA 64%, #F4F7FC 100%)`.
-- Brilho que varre a letra: `linear-gradient(105deg, transparent 42%, rgba(255,255,255,.95) 50%, transparent 58%)`, 40 quadros por passada.
-- Luz de estúdio: `radial-gradient(70% 40% at 25% 18%, rgba(120,140,190,.28), transparent)` e `radial-gradient(60% 30% at 80% 85%, rgba(200,255,61,.08), transparent)`.
-- Sombra: nenhuma em elemento; o chão tem um reflexo fraco (espelho a 12%).
-
-## O que o cliente pode trocar
-
-O verde-ácido pode virar a cor da marca (um acento só). O grafite pode ir a qualquer escuro neutro. O horizonte do cromo não muda.

package/kits/metal-liquido/regras/movimento.md

@@ -1,18 +0,0 @@
-# Movimento
-
-Curva padrão: `ob(t, 1,7)` (overshoot ~7%) para entradas e `e5(t) = 1 − (1 − t)^5` para fusão e saídas.
-
-| movimento | duração | valores |
-|---|---|---|
-| fusão das bolhas | 30 quadros | distância entre bolhas 420 → 70 px, com `e5`; depois orbitam ±14 px |
-| título de cromo entra | 18 quadros | sobe 140 px, desfoque 14 → 0, tracking 0,12 → −0,02 em |
-| brilho que varre | 40 quadros por passada | faixa de 16% cruza a letra da esquerda pra direita, a cada 56 quadros |
-| esfera quica | 3 batidas | cai de −900 px, bate, sobe 22% e 7%, achata Y −14% no impacto; o céu do espelho gira |
-| anel gira | contínuo | rotateX 68°, rotateZ 3,2°/quadro |
-| pílula | 14 quadros | cresce de 0 com overshoot, brilho cruza uma vez |
-| entrada de cena | 14 quadros | `zoom` 1,9× · `subir` 300 px · `direita` 800 px; desfoque 10 px |
-| saída de cena | 10 quadros | escala 1 → 1,9, desfoque 10 px |
-| câmera (sempre) | contínuo | zoom 1,02 + 0,00018/quadro ± 0,014, deriva ±14/±10 px; soco +0,03 |
-
-- Pausa de 15–24 quadros depois de cada impacto (fusão, quique, data): só a deriva e o brilho se mexem.
-- Uma coisa nova por vez: nada entra enquanto o herói ainda está assentando.

package/kits/metal-liquido/regras/ritmo.md

@@ -1,14 +0,0 @@
-# Ritmo
-
-- 30 fps. Uma batida da trilha = **15.789 quadros** (114 bpm). Cortes em múltiplos de 15,8 (arredonde): 0, 16, 32, 47, 63, 79, 95, 110, 126, 142, 158, 174, 190, 205, 221.
-
-| batida | duração (s) | quadros |
-|---|---|---|
-| gancho | 1,3–2,0 | 38–60 |
-| virada | 1,4–2,2 | 42–66 |
-| prova (cada) | 1,2–1,8 | 36–54 |
-| data / oferta | 1,2–1,8 | 36–54 |
-| marca | 1,6–3,0 | 48–90 |
-
-- Preview do kit: 8 s, 6 cenas.
-- Leitura: um título de cromo precisa de **≥ 30 quadros** parado na tela; uma pílula, **≥ 24**.

package/kits/metal-liquido/regras/som.md

@@ -1,20 +0,0 @@
-# Som
-
-- Trilha: `assets/trilha/sombrio-114bpm.mp3` (8,6 s, 114 bpm), volume **0.55**, fade de saída nos últimos **20 quadros**. Vídeo maior que 8,6 s: gere uma trilha nova no MotionCraft (`music make`, preset `dark-minimal`, 114 bpm, tom F), não faça loop deste trecho.
-- Com narração: trilha a **0.28** e efeitos a 70% do volume da tabela.
-- Efeitos (todos sintetizados) e volume padrão:
-
-| som | volume | quando |
-|---|---|---|
-| `liquido` | 0.9 | bolhas que se fundem |
-| `cromo` | 0.85 | letra ou pílula de cromo que entra |
-| `quique` | 0.85 | esfera que bate no chão |
-| `whoosh` | 0.85 | entrada de cena |
-| `varre` | 0.7 | brilho que varre / anel que gira |
-| `clique` | 0.8 | pílula que aparece |
-| `subida` | 0.6 | antes da fusão e da data |
-| `assinatura` | 0.9 | revelação da marca |
-
-- Um som por movimento que importa; no máximo **3 sons por segundo**; nunca o mesmo arquivo duas vezes seguidas.
-- Som entra **1 a 2 quadros antes** do visual.
-- O render nivela o mix em **−14 LUFS**, pico −1,5 dBTP.

package/kits/metal-liquido/regras/tipografia.md

@@ -1,15 +0,0 @@
-# Tipografia
-
-Duas fontes: **Unbounded 900** (larga, redonda) para tudo que é cromo e **Space Grotesk** para detalhe.
-
-| papel | fonte | peso | tamanho (px) | máx. caracteres |
-|---|---|---|---|---|
-| título de cromo (hero) | Unbounded | 900 | 130–200 | 9 |
-| número / data em pílula | Unbounded | 900 | 96–130 | 8 |
-| apoio em pílula | Unbounded | 700 | 48–60 | 20 |
-| detalhe / endereço | Space Grotesk | 700 | 44–52 | 36 |
-
-- Tracking: −0,02 em no título; 0,04 em na pílula.
-- Line-height: 1,0 no título; 1,2 no detalhe.
-- Caixa: caixa-alta em título e pílula; detalhe em frase normal.
-- Texto que cresce encolhe sozinho (`caber()` em `base.ts`) até caber em 920 px; nunca palavra cortada.

package/kits/minimal/assets/ASSETS.md

@@ -1,19 +0,0 @@
-# Assets do kit minimal
-
-| arquivo | o que é | origem | licença |
-|---|---|---|---|
-| `fontes/hanken.woff2` | Hanken Grotesk variável 200–700, subset latino | Google Fonts (`fonts.googleapis.com/css2?family=Hanken+Grotesk:wght@200..700`), baixado em 26/10/2026 | SIL OFL 1.1 — texto em `fontes/OFL-HankenGrotesk.txt` |
-| `fontes/splinemono.woff2` | Spline Sans Mono regular (400), subset latino | Google Fonts (`fonts.googleapis.com/css2?family=Spline+Sans+Mono:wght@400`), baixado em 26/10/2026 | SIL OFL 1.1 — texto em `fontes/OFL-SplineSansMono.txt` |
-| `sons/whoosh-entra.mp3` | whoosh de entrada | sintetizado: MotionCraft `sfx make`, tipo `whoosh_in`, pacote `paper` | sem samples; síntese própria, uso livre (CC0) |
-| `sons/whoosh-sai.mp3` | whoosh de saída | sintetizado: MotionCraft `sfx make`, tipo `whoosh_out`, pacote `paper` | sem samples; síntese própria, uso livre (CC0) |
-| `sons/swoosh.mp3` | swoosh lateral | sintetizado: MotionCraft `sfx make`, tipo `swoosh`, pacote `paper` | sem samples; síntese própria, uso livre (CC0) |
-| `sons/pop-palavra.mp3` | pop curto de palavra | sintetizado: MotionCraft `sfx make`, tipo `word_pop`, pacote `paper` | sem samples; síntese própria, uso livre (CC0) |
-| `sons/pop-cartao.mp3` | pop de cartão/selo que pousa | sintetizado: MotionCraft `sfx make`, tipo `icon_pop`, pacote `paper` | sem samples; síntese própria, uso livre (CC0) |
-| `sons/clique.mp3` | clique de botão | sintetizado: MotionCraft `sfx make`, tipo `button`, pacote `paper` | sem samples; síntese própria, uso livre (CC0) |
-| `sons/impacto.mp3` | impacto grave | sintetizado: MotionCraft `sfx make`, tipo `impact`, pacote `paper` | sem samples; síntese própria, uso livre (CC0) |
-| `sons/subida.mp3` | riser de 1,2 s | sintetizado: MotionCraft `sfx make`, tipo `riser`, pacote `paper` | sem samples; síntese própria, uso livre (CC0) |
-| `sons/assinatura.mp3` | acorde da marca | sintetizado: MotionCraft `sfx make`, tipo `logo_sting`, pacote `paper` | sem samples; síntese própria, uso livre (CC0) |
-| `sons/toque.mp3` | toque curto e seco de forma que muda | sintetizado: MotionCraft `sfx make`, tipo `icon_pop`, pacote `paper` | sem samples; síntese própria, uso livre (CC0) |
-| `trilha/vazio-90bpm.mp3` | 8.6 s de trilha, preset dark-minimal, 90 bpm, tom C | MotionCraft `music make --preset dark-minimal --bpm 90 --key C --duration 10 --force`, cortada em 8,6 s com fade | sem samples; síntese própria (CC0). MotionCraft é MIT |
-
-A demo não usa foto nem arquivo externo: tudo é desenhado pelos elementos do kit.

package/kits/minimal/elementos/Cena.tsx

@@ -1,39 +0,0 @@
-// Cena: janela de tempo de um plano (troca "revelar"). Dentro dela, useCurrentFrame() começa em 0.
-// A saída da cena cruza 14 quadros com a entrada da próxima.
-import React, {createContext, useContext} from 'react';
-import {AbsoluteFill, Sequence, useCurrentFrame} from 'remotion';
-import {e5, seg} from './base';
-
-export type Entrada = 'cortina' | 'baixo' | 'circulo' | 'flip' | 'nenhuma';
-export const SOBREPOE = 14; // quadros em que a saída desta cena cruza a entrada da próxima
-
-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 estilo = (f: number, duracao: number, entrada: Entrada, ultima: boolean): React.CSSProperties => {
-  const p = entrada === 'nenhuma' ? 1 : e5(seg(f, 0, 14));
-  const xo = ultima ? 0 : e5(seg(f, duracao, duracao + SOBREPOE));
-  const base = {transform: `scale(${1 - xo * 0.05})`, opacity: 1 - xo * 0.6} as React.CSSProperties;
-  if (p >= 1) return base;
-  if (entrada === 'cortina') return {...base, clipPath: `polygon(0 0, ${p * 140 - 20}% 0, ${p * 140 - 40}% 100%, 0 100%)`};
-  if (entrada === 'baixo') return {...base, clipPath: `inset(${(1 - p) * 100}% 0 0 0)`};
-  if (entrada === 'circulo') return {...base, clipPath: `circle(${p * 150}% at 50% 55%)`};
-  return {...base, transform: `perspective(1800px) rotateX(${(1 - p) * -80}deg) scale(${1 - xo * 0.05})`, transformOrigin: '50% 0%', opacity: 0.3 + 0.7 * p};
-};
-
-const Janela: React.FC<{duracao: number; entrada: Entrada; ultima: boolean; children: React.ReactNode}> = ({duracao, entrada, ultima, children}) => {
-  const f = useCurrentFrame();
-  return <AbsoluteFill style={estilo(f, duracao, entrada, ultima)}>{children}</AbsoluteFill>;
-};
-
-export const Cena: React.FC<CenaProps> = ({de, ate, entrada = 'cortina', ultima = false, children}) => {
-  const duracao = ate - de;
-  return <Sequence from={de} durationInFrames={duracao + (ultima ? 0 : SOBREPOE)} layout="none">
-    <CenaCtx.Provider value={{duracao}}>
-      <Janela duracao={duracao} entrada={entrada} ultima={ultima}>{children}</Janela>
-    </CenaCtx.Provider>
-  </Sequence>;
-};

package/kits/minimal/elementos/FormaMorph.tsx

@@ -1,44 +0,0 @@
-// FormaMorph: a única forma do vídeo, sempre em cobalto, de 560 px, que nasce de um ponto e vira outra forma a cada chave
-// (círculo, quadrado, pílula, anel, meia-lua), mudando largura, altura, raio, contorno e giro ao mesmo tempo. É o herói.
-import React from 'react';
-import {useCurrentFrame} from 'remotion';
-import {COR, e5, lerp, ov, seg} from './base';
-
-export type TipoForma = 'circulo' | 'quadrado' | 'pilula' | 'anel' | 'meia';
-
-export type FormaMorphProps = {
-  /** cada item vale a partir do quadro `de` (na cena): a forma se transforma em 18 quadros */
-  formas: {de: number; tipo: TipoForma; rot?: number}[];
-  /** centro vertical, px */
-  y: number;
-  /** tamanho de referência, px (herói: 520–600) */
-  tamanho?: number;
-  cor?: string;
-  inicio?: number;
-  fim?: number;
-};
-
-// [largura, altura, raio, contorno, preenchido (1) ou só contorno (0)] em múltiplos de T
-const GEO = (t: TipoForma, T: number): number[] => {
-  switch (t) {
-    case 'circulo': return [T, T, T / 2, 0, 1];
-    case 'quadrado': return [T * 0.88, T * 0.88, T * 0.1, 0, 1];
-    case 'pilula': return [T * 1.5, T * 0.52, T * 0.26, 0, 1];
-    case 'anel': return [T, T, T / 2, T * 0.17, 0];
-    case 'meia': return [T * 1.1, T * 0.55, T * 0.55, 0, 1];
-  }
-};
-
-export const FormaMorph: React.FC<FormaMorphProps> = ({formas, y, tamanho = 560, cor = COR.cobalto, inicio = 0, fim = 1e9}) => {
-  const f = useCurrentFrame();
-  if (f < inicio - 1 || f > fim + 12) return null;
-  const nasce = ov(seg(f, inicio, inicio + 20)), sai = e5(seg(f, fim, fim + 10));
-  let atual = 0;
-  formas.forEach((s, i) => { if (f >= s.de) atual = i; });
-  const ant = Math.max(0, atual - 1), p = atual === 0 ? 1 : ov(seg(f, formas[atual].de, formas[atual].de + 18));
-  const a = GEO(formas[ant].tipo, tamanho), b = GEO(formas[atual].tipo, tamanho);
-  const g = a.map((v, i) => lerp(v, b[i], p));
-  const rot = lerp(formas[ant].rot ?? 0, formas[atual].rot ?? 0, p) + Math.sin(f / 40) * 2;
-  const escala = Math.max(0, nasce) * (1 - sai * 0.3);
-  return <div style={{position: 'absolute', left: 540 - g[0] / 2, top: y - g[1] / 2 + Math.sin(f / 22) * 8, width: g[0], height: g[1], borderRadius: Math.max(0, g[2]), background: g[4] > 0.5 ? cor : 'transparent', border: g[3] > 1 ? `${g[3]}px solid ${cor}` : 'none', boxSizing: 'border-box', transform: `rotate(${rot}deg) scale(${escala})`, opacity: 1 - sai}} />;
-};

package/kits/minimal/elementos/FraseUnica.tsx

@@ -1,33 +0,0 @@
-// FraseUnica: uma frase só, em Hanken Grotesk leve (300), 130 px, alinhada à margem esquerda de 120 px, uma linha por vez
-// subindo de uma máscara com overshoot curto. `*palavra*` em cobalto. Herói quando a cena é só texto.
-import React from 'react';
-import {useCurrentFrame} from 'remotion';
-import {COR, FONTE, MARGEM, caber, e5, ov, partes, seg, textoLimpo} from './base';
-
-export type FraseUnicaProps = {
-  linhas: string[];
-  inicio?: number;
-  /** quadros entre linhas */
-  intervalo?: number;
-  /** centro vertical do bloco, px */
-  y: number;
-  tamanho?: number;
-  fim?: number;
-};
-
-export const FraseUnica: React.FC<FraseUnicaProps> = ({linhas, inicio = 0, intervalo = 8, y, tamanho = 150, fim = 1e9}) => {
-  const f = useCurrentFrame();
-  if (f < inicio - 1 || f > fim + 12) return null;
-  const tam = Math.min(...linhas.map((l) => caber(textoLimpo(l), tamanho, 840, 300, -0.03, 'MN Hanken')));
-  const alt = tam * 1.18, topo = y - (linhas.length * alt) / 2, sai = e5(seg(f, fim, fim + 10));
-  return <div style={{position: 'absolute', inset: 0, opacity: 1 - sai, transform: `translateX(${-sai * 160}px)`}}>
-    {linhas.map((l, i) => {
-      const p = ov(seg(f, inicio + i * intervalo, inicio + i * intervalo + 16));
-      return <div key={i} style={{position: 'absolute', left: MARGEM, width: 840, top: topo + i * alt, height: alt, overflow: 'hidden'}}>
-        <div style={{transform: `translateY(${(1 - p) * 115}%)`, fontFamily: FONTE, fontWeight: 300, fontSize: tam, lineHeight: `${alt}px`, color: COR.tinta, letterSpacing: '-0.03em', whiteSpace: 'nowrap'}}>
-          {partes(l).map((s, k) => <span key={k} style={{color: s.d ? COR.cobalto : COR.tinta, fontWeight: s.d ? 500 : 300}}>{s.t}</span>)}
-        </div>
-      </div>;
-    })}
-  </div>;
-};

package/kits/minimal/elementos/Fundo.tsx

@@ -1,20 +0,0 @@
-// Fundo: osso liso, sem textura, com quatro cruzes de registro (como marcas de impressão) a 96 px das bordas. Só isso.
-// Fica FORA da Camera. O vazio é o estilo: nada mais mora aqui.
-import React from 'react';
-import {AbsoluteFill} from 'remotion';
-import {COR} from './base';
-
-export type FundoProps = {
-  /** cor do chão */
-  cor?: string;
-  /** desliga as cruzes de registro */
-  semMarcas?: boolean;
-};
-
-export const Fundo: React.FC<FundoProps> = ({cor = COR.osso, semMarcas = false}) =>
-  <AbsoluteFill style={{background: cor}}>
-    {!semMarcas && <svg width={1080} height={1920} style={{position: 'absolute', inset: 0}}>
-      {[[96, 96], [984, 96], [96, 1824], [984, 1824]].map(([x, y], i) =>
-        <path key={i} d={`M${x - 16} ${y} H${x + 16} M${x} ${y - 16} V${y + 16}`} stroke={COR.tinta} strokeOpacity={0.35} strokeWidth={3} strokeLinecap="round" />)}
-    </svg>}
-  </AbsoluteFill>;

package/kits/minimal/elementos/LinhaFina.tsx

@@ -1,24 +0,0 @@
-// LinhaFina: um traço de 3 px de ponta a ponta da margem (120 → 960 px) que se desenha da esquerda para a direita, com
-// um ponto cobalto de 22 px que estoura no fim. Serve de trilha, divisor ou régua. Em tinta a 40%.
-import React from 'react';
-import {useCurrentFrame} from 'remotion';
-import {COR, e5, ov, seg} from './base';
-
-export type LinhaFinaProps = {
-  /** centro vertical, px */
-  y: number;
-  /** quadros para se desenhar */
-  duracao?: number;
-  inicio?: number;
-  fim?: number;
-};
-
-export const LinhaFina: React.FC<LinhaFinaProps> = ({y, duracao = 22, inicio = 0, fim = 1e9}) => {
-  const f = useCurrentFrame();
-  if (f < inicio - 1 || f > fim + 12) return null;
-  const p = e5(seg(f, inicio, inicio + duracao)), ponto = ov(seg(f, inicio + duracao - 2, inicio + duracao + 12)), sai = e5(seg(f, fim, fim + 10));
-  return <div style={{position: 'absolute', inset: 0, opacity: 1 - sai}}>
-    <div style={{position: 'absolute', left: 120, top: y - 1.5, width: 840 * p, height: 3, background: COR.tinta, opacity: 0.4}} />
-    <div style={{position: 'absolute', left: 120 + 840 * p - 11, top: y - 11, width: 22, height: 22, borderRadius: '50%', background: COR.cobalto, transform: `scale(${Math.max(0, ponto)})`}} />
-  </div>;
-};

package/kits/minimal/elementos/Montagem.tsx

@@ -1,59 +0,0 @@
-// Montagem: transforma um plano de cenas (JSON escrito pela IA) em vídeo, usando só os elementos do kit.
-// Ela NÃO decide nada de estética: só põe Fundo + Camera + Cenas + sons onde o plano mandou.
-// Formato do plano: ver exemplos/plano.json e KITS.md (seção "plano de cenas").
-import React from 'react';
-import {AbsoluteFill} from 'remotion';
-import {COR} from './base';
-import {Fundo} from './Fundo';
-import {Camera} from './Camera';
-import {Cena, Entrada} from './Cena';
-import {Efeito, NomeSom, Trilha} from './Som';
-import {FormaMorph} from './FormaMorph';
-import {FraseUnica} from './FraseUnica';
-import {NumeroSolo} from './NumeroSolo';
-import {PontoMovel} from './PontoMovel';
-import {LinhaFina} from './LinhaFina';
-import {RodapeMinimal} from './RodapeMinimal';
-
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-export const ELEMENTOS: Record<string, React.FC<any>> = {
-  FormaMorph, FraseUnica, NumeroSolo, PontoMovel, LinhaFina, RodapeMinimal,
-};
-
-export type Camada = {elemento: string; props: Record<string, unknown>};
-export type CenaPlano = {
-  batida: string; de: number; ate: number; entrada?: Entrada;
-  camadas: Camada[];
-  /** sons relativos ao início da cena */
-  sons?: {som: NomeSom; em: number; volume?: number}[];
-  /** socos de câmera extras, relativos ao início da cena (o início já é um soco) */
-  socos?: number[];
-};
-export type Plano = {kit: string; duracao: number; fundo?: Record<string, unknown>; trilha?: {volume?: number} | false; cenas: CenaPlano[]};
-
-/** troca "fotos/foto-01.jpg" pela URL importada, em qualquer prop (texto, lista ou objeto) */
-const resolver = (v: unknown, arquivos: Record<string, string>): unknown => {
-  if (typeof v === 'string') return arquivos[v] ?? v;
-  if (Array.isArray(v)) return v.map((x) => resolver(x, arquivos));
-  if (v && typeof v === 'object') return Object.fromEntries(Object.entries(v).map(([k, x]) => [k, resolver(x, arquivos)]));
-  return v;
-};
-
-export const Montagem: React.FC<{plano: Plano; arquivos?: Record<string, string>}> = ({plano, arquivos = {}}) => {
-  const socos = plano.cenas.flatMap((c) => [c.de, ...(c.socos ?? []).map((s) => c.de + s)]);
-  const ultima = plano.cenas.length - 1;
-  return <AbsoluteFill style={{background: COR.osso}}>
-    <Fundo {...(plano.fundo as object)} />
-    <Camera batidas={socos}>
-      {plano.cenas.map((c, i) => <Cena key={i} de={c.de} ate={c.ate} entrada={c.entrada} ultima={i === ultima}>
-        {c.camadas.map((k, j) => {
-          const El = ELEMENTOS[k.elemento];
-          if (!El) throw new Error(`minimal: elemento "${k.elemento}" não existe no kit`);
-          return <El key={j} {...(resolver(k.props, arquivos) as object)} />;
-        })}
-      </Cena>)}
-    </Camera>
-    {plano.cenas.flatMap((c, i) => (c.sons ?? []).map((s, j) => <Efeito key={`${i}-${j}`} som={s.som} em={c.de + s.em} volume={s.volume} />))}
-    {plano.trilha !== false && <Trilha volume={plano.trilha?.volume} />}
-  </AbsoluteFill>;
-};

package/kits/minimal/elementos/NumeroSolo.tsx

@@ -1,33 +0,0 @@
-// NumeroSolo: um número só, finíssimo (Hanken 200) de 640 px em tinta, que sobe de uma máscara dígito a dígito, com um
-// quadradinho cobalto e um rótulo em mono embaixo, na margem de 120 px. O vazio em volta faz o trabalho.
-import React from 'react';
-import {useCurrentFrame} from 'remotion';
-import {COR, FONTE, MARGEM, MONO, caber, e5, ov, seg} from './base';
-
-export type NumeroSoloProps = {
-  numero: string;
-  rotulo: string;
-  inicio?: number;
-  /** centro vertical do número, px */
-  y: number;
-  tamanho?: number;
-  fim?: number;
-};
-
-export const NumeroSolo: React.FC<NumeroSoloProps> = ({numero, rotulo, inicio = 0, y, tamanho = 640, fim = 1e9}) => {
-  const f = useCurrentFrame();
-  if (f < inicio - 1 || f > fim + 12) return null;
-  const tam = caber(numero, tamanho, 840, 200, -0.05, 'MN Hanken'), alt = tam * 0.86, sai = e5(seg(f, fim, fim + 10));
-  return <div style={{position: 'absolute', inset: 0, opacity: 1 - sai, transform: `translateX(${-sai * 160}px)`}}>
-    <div style={{position: 'absolute', left: MARGEM - tam * 0.04, top: y - alt / 2, height: alt, display: 'flex', overflow: 'hidden'}}>
-      {numero.split('').map((c, i) => {
-        const p = ov(seg(f, inicio + i * 5, inicio + i * 5 + 18));
-        return <div key={i} style={{fontFamily: FONTE, fontWeight: 200, fontSize: tam, lineHeight: `${alt}px`, color: COR.tinta, letterSpacing: '-0.05em', transform: `translateY(${(1 - p) * 110}%)`}}>{c}</div>;
-      })}
-    </div>
-    <div style={{position: 'absolute', left: MARGEM, top: y + alt / 2 + 34, display: 'flex', alignItems: 'center', gap: 22, opacity: seg(f, inicio + 14, inicio + 24), transform: `translateX(${(1 - ov(seg(f, inicio + 14, inicio + 28))) * -60}px)`}}>
-      <div style={{width: 36, height: 36, background: COR.cobalto}} />
-      <div style={{fontFamily: MONO, fontWeight: 400, fontSize: 40, color: COR.tinta, letterSpacing: '0.04em'}}>{rotulo}</div>
-    </div>
-  </div>;
-};

package/kits/minimal/elementos/PontoMovel.tsx

@@ -1,27 +0,0 @@
-// PontoMovel: uma bola cobalto de 220 px que vai e volta ao longo de uma trilha, esticando na velocidade e achatando na
-// chegada (squash e stretch). Chaves `posicoes`: [quadro, x]. A trilha é a LinhaFina, que fica por baixo. É o herói.
-import React from 'react';
-import {useCurrentFrame} from 'remotion';
-import {COR, chavesN, e5, ov, seg} from './base';
-
-export type PontoMovelProps = {
-  /** chaves da posição horizontal: [quadro (na cena), x do centro, px] */
-  posicoes: number[][];
-  /** centro vertical, px */
-  y: number;
-  diametro?: number;
-  cor?: string;
-  inicio?: number;
-  fim?: number;
-};
-
-export const PontoMovel: React.FC<PontoMovelProps> = ({posicoes, y, diametro = 220, cor = COR.cobalto, inicio = 0, fim = 1e9}) => {
-  const f = useCurrentFrame();
-  if (f < inicio - 1 || f > fim + 12) return null;
-  const [x] = chavesN(f, posicoes), [x1] = chavesN(f + 1, posicoes);
-  const v = Math.abs(x1 - x), nasce = ov(seg(f, inicio, inicio + 16)), sai = e5(seg(f, fim, fim + 10));
-  const esticar = 1 + Math.min(0.5, v * 0.012);
-  let chega = 0;
-  for (let i = 1; i < posicoes.length; i++) if (f >= posicoes[i][0] && f < posicoes[i][0] + 8) chega = Math.sin(((f - posicoes[i][0]) / 8) * Math.PI);
-  return <div style={{position: 'absolute', left: x - diametro / 2, top: y - diametro / 2 + chega * diametro * 0.06, width: diametro, height: diametro, borderRadius: '50%', background: cor, transform: `scale(${Math.max(0, nasce) * (1 - sai)}) scale(${esticar - chega * 0.2}, ${1 / esticar + chega * 0.18})`}} />;
-};

package/kits/minimal/elementos/RodapeMinimal.tsx

@@ -1,26 +0,0 @@
-// RodapeMinimal: a assinatura. Um fio de 3 px e, embaixo, o nome da marca à esquerda e o endereço à direita em Spline Sans Mono,
-// tamanho 36, tinta a 70%. Entra por último, sem movimento grande: só sobe 30 px. Dentro das margens de 120 px.
-import React from 'react';
-import {useCurrentFrame} from 'remotion';
-import {COR, MARGEM, MONO, e5, seg} from './base';
-
-export type RodapeMinimalProps = {
-  nome: string;
-  url: string;
-  inicio?: number;
-  /** centro vertical do texto, px */
-  y?: number;
-  fim?: number;
-};
-
-export const RodapeMinimal: React.FC<RodapeMinimalProps> = ({nome, url, inicio = 0, y = 1260, fim = 1e9}) => {
-  const f = useCurrentFrame();
-  if (f < inicio - 1 || f > fim + 12) return null;
-  const p = e5(seg(f, inicio, inicio + 16)), sai = e5(seg(f, fim, fim + 10));
-  return <div style={{position: 'absolute', left: MARGEM, width: 840, top: y - 60, opacity: (1 - sai) * p, transform: `translateY(${(1 - p) * 30}px)`}}>
-    <div style={{height: 3, width: 840 * p, background: COR.tinta, opacity: 0.4}} />
-    <div style={{display: 'flex', justifyContent: 'space-between', marginTop: 28, fontFamily: MONO, fontWeight: 400, fontSize: 36, letterSpacing: '0.06em', color: COR.tinta, opacity: 0.8}}>
-      <span>{nome.toUpperCase()}</span><span>{url}</span>
-    </div>
-  </div>;
-};