primocode 10.19.0 → 11.1.0

package/kits/terminal/regras/movimento.md

@@ -1,15 +0,0 @@
-# Movimento
-
-| movimento | quadros | valores |
-|---|---|---|
-| tubo liga | 2–9 | linha de 4 px abre em escala Y 0,004 → 1 (curva e5), brilho 2,2× |
-| tubo desliga | 0–4 + 4–8 | fecha em linha (Y → 0,004), depois em ponto (X → 0,01) |
-| entrada `varre` | 8 | a tela nova é revelada de cima a baixo com cabeça de escrita quente |
-| digitação | 1–3 por tecla | +4 antes de espaço e de opção "-" (cadência determinística) |
-| cursor | 8 on / 8 off | sólido enquanto digita |
-| contador de memória | 20 | 12 saltos irregulares |
-| barra de progresso | 26–34 | 9 degraus irregulares, para em 97% até completar |
-| letras de bloco | 2 por linha (7 linhas) | cada bloco nasce quente e esfria em 6; tremor de 0,6 célula enquanto quente |
-| painel | 8 + 12 | moldura desenha em 8, cada valor conta em 12 |
-| câmera | contínuo | giro Y ±2,5° (período 14,7 s), X ±1,2°; empurrão 1,0 → 1,16 em 12 quadros no herói |
-| barra que rola | 75 | de −20% a 120% do vidro |

package/kits/terminal/regras/ritmo.md

@@ -1,14 +0,0 @@
-# Ritmo
-
-110 bpm = 16,36 quadros por batida.
-
-| batida | duração s | quadros |
-|---|---|---|
-| gancho (boot) | 1,6–2,0 | 48–60 |
-| comando | 1,6–2,0 | 48–60 |
-| virada (letras de bloco) | 1,4–1,8 | 42–54 |
-| prova (painel) | 1,1–1,4 | 34–42 |
-| cta | 1,2–1,4 | 36–42 |
-
-- Leitura: a digitação termina ≥ 8 quadros antes do corte; cada [OK] fica ≥ 10 quadros.
-- O tubo desliga só nos últimos 6 quadros.

package/kits/terminal/regras/som.md

@@ -1,17 +0,0 @@
-# Som
-
-Trilha: `assets/trilha/trilha.mp3` (dark-minimal, 110 bpm), volume 0,45, fade de 20 quadros. Alvo −14 LUFS.
-
-| som | volume | quando |
-|---|---|---|
-| liga-crt | 0,9 | o tubo liga (quadro 0) |
-| digitar | 0,5–0,8 | cada digitação (rajada de 16 teclas com cadência humana) |
-| clique | 0,8 | Enter e [OK] da memória |
-| subida | 0,4–0,5 | contagem e barras enchendo |
-| impacto | 0,9 | as letras de bloco (1 por vídeo) |
-| tick / pop-palavra / pop-cartao | 0,5–0,6 | [OK] de cada barra e checagem, alternando os arquivos |
-| swoosh / whoosh-entra | 1 / 0,9 | troca de tela |
-| assinatura | 0,9 | a data final |
-| whoosh-sai | 0,6 | o tubo desliga |
-
-- Máx. 3 sons por segundo, nunca o mesmo arquivo duas vezes seguidas (a rajada de teclas conta como 1).

package/kits/terminal/regras/tipografia.md

@@ -1,15 +0,0 @@
-# Tipografia
-
-| papel | fonte | tamanho px | máx. caracteres | caixa |
-|---|---|---|---|---|
-| contador de memória | VT323 | 210 (unidade 96) | 6 dígitos | — |
-| texto grande / data | VT323 | 110–230 | 9 | livre |
-| comando | VT323 | 66 | 18 | baixa |
-| rótulo de barra | VT323 | 62 | 10 | alta |
-| valor do painel | VT323 | 64 | 12 | alta |
-| BIOS / checagens | VT323 | 44 | 24 | alta |
-| status | VT323 | 40 | 30 | alta |
-| placa do monitor | JetBrains Mono 700 | 22, tracking 0,24 em | 20 | alta |
-
-- Margem do texto dentro do vidro: 44 px. Linha da grade: 58 px.
-- Letras de bloco: fonte 5×7 desenhada, célula = largura ÷ (letras × 6 − 1), vão 12% da célula, até 760 px.

package/kits/tiktok-energia/assets/ASSETS.md

@@ -1,22 +0,0 @@
-# Assets do kit tiktok-energia
-
-| arquivo | o que é | origem | licença |
-|---|---|---|---|
-| `fontes/anton-latin.woff2` | Anton (400), subset latino | Google Fonts (`fonts.googleapis.com/css2?family=Anton`), baixado em 26/10/2026 | SIL OFL 1.1, texto em `fontes/OFL-Anton.txt` |
-| `fontes/rubik-latin.woff2` | Rubik (600 900), subset latino | Google Fonts (`fonts.googleapis.com/css2?family=Rubik`), baixado em 26/10/2026 | SIL OFL 1.1, texto em `fontes/OFL-Rubik.txt` |
-| `sons/soco.mp3` | cada palavra que bate | sintetizado: MotionCraft `sfx make`, tipo `impact`, pacote `digital-soft` | sem samples; síntese própria (CC0) |
-| `sons/corte.mp3` | cada bloco de cor que corta | sintetizado: MotionCraft `sfx make`, tipo `slot_tick`, pacote `digital-soft` | sem samples; síntese própria (CC0) |
-| `sons/whoosh.mp3` | foto ou caixa que entra | sintetizado: MotionCraft `sfx make`, tipo `whoosh_in`, pacote `digital-soft` | sem samples; síntese própria (CC0) |
-| `sons/pop.mp3` | emoji ou caixa de texto | sintetizado: MotionCraft `sfx make`, tipo `icon_pop`, pacote `soft-pop` | sem samples; síntese própria (CC0) |
-| `sons/zap.mp3` | botão / endereço | sintetizado: MotionCraft `sfx make`, tipo `button`, pacote `digital-soft` | sem samples; síntese própria (CC0) |
-| `sons/subida.mp3` | antes do número ou da data | sintetizado: MotionCraft `sfx make`, tipo `riser`, pacote `digital-soft` | sem samples; síntese própria (CC0) |
-| `sons/palavra.mp3` | segunda palavra da sequência | sintetizado: MotionCraft `sfx make`, tipo `word_pop`, pacote `soft-pop` | sem samples; síntese própria (CC0) |
-| `sons/assinatura.mp3` | revelação da marca | sintetizado: MotionCraft `sfx make`, tipo `logo_sting`, pacote `soft-pop` | sem samples; síntese própria (CC0) |
-| `trilha/tech-128bpm.mp3` | 8,6 s a partir de 1.875 s da trilha gerada | MotionCraft `music make` (preset `tech-bright`, 128 bpm, tom G) | sem samples; síntese própria (CC0). MotionCraft é MIT |
-
-Conteúdo de demonstração (não faz parte do estilo, fica em `exemplos/`):
-
-| arquivo | origem | licença |
-|---|---|---|
-| `exemplos/fotos/foto-03.jpg` | cópia de `kits/apple-tipografico/exemplos/fotos/` (Unsplash, picsum id 3), recorte 720×960 | Unsplash License |
-| `exemplos/logo-pulo.svg` | logo fictício desenhado para a demo | próprio |

package/kits/tiktok-energia/elementos/AssinaturaMarca.tsx

@@ -1,25 +0,0 @@
-// AssinaturaMarca: a última cena. Bloco lima corta, o logo bate de 3x, o nome bate em Anton 300 px e o endereço
-// entra numa caixa preta de adesivo.
-import React from 'react';
-import {useCurrentFrame} from 'remotion';
-import {COR, FAM_A, FONTE_A, caber, e5, seg} from './base';
-import {CorteDeCor} from './CorteDeCor';
-import {TextoCaixa} from './TextoCaixa';
-
-export type AssinaturaMarcaProps = {
-  logo: string;
-  nome: string;
-  endereco?: string;
-  inicio?: number;
-};
-
-export const AssinaturaMarca: React.FC<AssinaturaMarcaProps> = ({logo, nome, endereco, inicio = 0}) => {
-  const f = useCurrentFrame() - inicio;
-  const lg = 1 + 2 * (1 - e5(seg(f, 4, 9))), nm = 1 + 2.4 * (1 - e5(seg(f, 10, 14))), tn = caber(nome.toUpperCase(), 330, FAM_A, 800, 400, 0.01);
-  return <>
-    <CorteDeCor cor={COR.lima} de="baixo" />
-    {f >= 4 && <img src={logo} style={{position: 'absolute', left: 540 - 190, top: 520 - 190, width: 380, height: 380, transform: `scale(${lg}) rotate(${-4 * seg(f, 4, 12)}deg)`, boxShadow: '16px 16px 0 #0B0B0F'}} />}
-    {f >= 10 && <div style={{position: 'absolute', left: 0, width: 1080, top: 900 - tn * 0.55, height: tn * 1.1, display: 'flex', alignItems: 'center', justifyContent: 'center', fontFamily: FONTE_A, fontSize: tn, lineHeight: 1, letterSpacing: '0.01em', color: COR.preto, textShadow: `-6px 0 ${COR.magenta}, 6px 0 ${COR.azul}`, transform: `scale(${nm}) translateX(${Math.sin(f * 3) * Math.exp(-(f - 10) / 6) * 10}px)`}}>{nome.toUpperCase()}</div>}
-    {endereco && <TextoCaixa texto={endereco} y={1110} tamanho={64} estilo="preta" rot={-3} inicio={inicio + 16} />}
-  </>;
-};

package/kits/tiktok-energia/elementos/Cena.tsx

@@ -1,48 +0,0 @@
-// Cena: janela de tempo de um plano. Entra com movimento (nunca corte seco) e a saída cruza 4 quadros
-// com a entrada da próxima. Dentro dela, useCurrentFrame() começa em 0.
-import React, {createContext, useContext} from 'react';
-import {AbsoluteFill, Sequence, useCurrentFrame} from 'remotion';
-import {c01, e5, ob, seg} from './base';
-
-export type Entrada = 'subir' | 'zoom' | 'direita' | 'esquerda' | 'giro' | 'queda' | 'circulo' | 'nenhuma';
-export type Saida = 'sobe' | 'esquerda' | 'zoom' | 'gira' | 'encolhe';
-export const SOBREPOE = 4; // quadros em que a saída desta cena cruza a entrada da próxima
-export const QUADROS_ENTRADA = 6;
-
-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; saida?: Saida; ultima?: boolean; children: React.ReactNode};
-
-const Janela: React.FC<{duracao: number; entrada: Entrada; saida: Saida; ultima: boolean; children: React.ReactNode}> = ({duracao, entrada, saida, ultima, children}) => {
-  const f = useCurrentFrame();
-  const p = seg(f, 0, QUADROS_ENTRADA);
-  const en = entrada === 'nenhuma' ? 0 : 1 - ob(p, 1.2);
-  const xo = ultima ? 0 : e5(seg(f, duracao, duracao + SOBREPOE));
-  let tf = '';
-  let clip: string | undefined;
-  if (entrada === 'subir') tf += `translateY(${en * 300}px) `;
-  if (entrada === 'queda') tf += `translateY(${-en * 520}px) `;
-  if (entrada === 'zoom') tf += `scale(${1 + en * 0.9}) `;
-  if (entrada === 'direita') tf += `translateX(${en * 800}px) `;
-  if (entrada === 'esquerda') tf += `translateX(${-en * 800}px) `;
-  if (entrada === 'giro') tf += `rotate(${-en * 16}deg) scale(${1 + en * 0.6}) `;
-  if (entrada === 'circulo') clip = `circle(${e5(p) * 1700 + 4}px at 50% 52%)`;
-  if (saida === 'sobe') tf += `translateY(${-xo * 240}px) scale(${1 + xo * 0.08})`;
-  if (saida === 'esquerda') tf += `translateX(${-xo * 820}px) rotate(${-xo * 4}deg)`;
-  if (saida === 'zoom') tf += `scale(${1 + xo * 0.9})`;
-  if (saida === 'gira') tf += `rotate(${xo * 12}deg) scale(${1 - xo * 0.25}) translateY(${xo * 300}px)`;
-  if (saida === 'encolhe') tf += `scale(${1 - xo * 0.35})`;
-  const blur = c01(en) * 0 + xo * 0;
-  return <AbsoluteFill style={{transform: tf, clipPath: clip, opacity: (1 - c01(en) * 0.85) * (1 - xo), filter: blur > 0.3 ? `blur(${blur}px)` : undefined}}>{children}</AbsoluteFill>;
-};
-
-export const Cena: React.FC<CenaProps> = ({de, ate, entrada = 'subir', saida = 'encolhe', 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} saida={saida} ultima={ultima}>{children}</Janela>
-    </CenaCtx.Provider>
-  </Sequence>;
-};

package/kits/tiktok-energia/elementos/CorteDeCor.tsx

@@ -1,22 +0,0 @@
-// CorteDeCor: um bloco de cor chapada que corta a tela em diagonal em 6 quadros e fica como fundo da cena.
-// É a primeira camada de toda cena. `de` escolhe o lado de onde o corte varre.
-import React from 'react';
-import {AbsoluteFill, useCurrentFrame} from 'remotion';
-import {COR, e5, seg} from './base';
-
-export type CorteDeCorProps = {
-  cor?: string;
-  de?: 'esquerda' | 'direita' | 'baixo' | 'cima';
-  /** quadros do corte */
-  quadros?: number;
-};
-
-export const CorteDeCor: React.FC<CorteDeCorProps> = ({cor = COR.lima, de = 'esquerda', quadros = 6}) => {
-  const f = useCurrentFrame();
-  const p = e5(seg(f, 0, quadros)), t = p * 160 - 30; // -30..130 (%) com 30% de inclinação
-  const clip = de === 'esquerda' ? `polygon(0 0, ${t + 30}% 0, ${t}% 100%, 0 100%)`
-    : de === 'direita' ? `polygon(${100 - t - 30}% 0, 100% 0, 100% 100%, ${100 - t}% 100%)`
-    : de === 'baixo' ? `polygon(0 ${100 - t}%, 100% ${100 - t - 30}%, 100% 100%, 0 100%)`
-    : `polygon(0 0, 100% 0, 100% ${t}%, 0 ${t + 30}%)`;
-  return <AbsoluteFill style={{background: cor, clipPath: p >= 1 ? undefined : clip}} />;
-};

package/kits/tiktok-energia/elementos/EmojiSticker.tsx

@@ -1,21 +0,0 @@
-// EmojiSticker: emoji de 240 px com contorno branco (4 drop-shadows de 8 px). Bate de 2,5x em 5 quadros, gira e depois
-// quica ±12 px (período 14 quadros).
-import React from 'react';
-import {useCurrentFrame} from 'remotion';
-import {e5, seg} from './base';
-
-export type EmojiStickerProps = {
-  emoji: string;
-  x?: number;
-  y?: number;
-  tamanho?: number;
-  rot?: number;
-  inicio?: number;
-};
-
-export const EmojiSticker: React.FC<EmojiStickerProps> = ({emoji, x = 540, y = 1090, tamanho = 240, rot = 8, inicio = 0}) => {
-  const f = useCurrentFrame() - inicio;
-  if (f < -1) return null;
-  const esc = 1 + 1.5 * (1 - e5(seg(f, 0, 5)));
-  return <div style={{position: 'absolute', left: x - tamanho / 2, top: y - tamanho / 2 + Math.sin(f / 2.2) * 12 * seg(f, 6, 10), width: tamanho, height: tamanho, display: 'flex', alignItems: 'center', justifyContent: 'center', fontSize: tamanho * 0.8, lineHeight: 1, transform: `rotate(${rot + (1 - e5(seg(f, 0, 8))) * -40}deg) scale(${esc})`, filter: 'drop-shadow(8px 0 0 #fff) drop-shadow(-8px 0 0 #fff) drop-shadow(0 8px 0 #fff) drop-shadow(0 -8px 0 #fff)'}}>{emoji}</div>;
-};

package/kits/tiktok-energia/elementos/FotoSoco.tsx

@@ -1,27 +0,0 @@
-// FotoSoco: foto em retângulo de quina viva com sombra sólida de 24 px (lima). Bate de 2,2x em 5 quadros e treme;
-// a foto dentro dá zoom de 1,0 a 1,25 em 30 quadros (nada fica parado).
-import React from 'react';
-import {useCurrentFrame} from 'remotion';
-import {COR, e5, seg} from './base';
-
-export type FotoSocoProps = {
-  src: string;
-  x?: number;
-  y?: number;
-  largura?: number;
-  altura?: number;
-  rot?: number;
-  /** cor da sombra sólida */
-  sombra?: string;
-  inicio?: number;
-  foco?: string;
-};
-
-export const FotoSoco: React.FC<FotoSocoProps> = ({src, x = 540, y = 700, largura = 760, altura = 940, rot = -3, sombra = COR.lima, inicio = 0, foco = '50% 50%'}) => {
-  const f = useCurrentFrame() - inicio;
-  if (f < -1) return null;
-  const esc = 1 + 1.2 * (1 - e5(seg(f, 0, 5))), tr = Math.exp(-Math.max(0, f) / 6) * 12, zoom = 1 + 0.25 * e5(seg(f, 0, 30));
-  return <div style={{position: 'absolute', left: x - largura / 2 + Math.sin(f * 3.1) * tr, top: y - altura / 2 + Math.cos(f * 2.7) * tr, width: largura, height: altura, transform: `rotate(${rot}deg) scale(${esc})`, boxShadow: `24px 24px 0 ${sombra}`, overflow: 'hidden', background: COR.preto}}>
-    <img src={src} style={{width: '100%', height: '100%', objectFit: 'cover', objectPosition: foco, transform: `scale(${zoom})`}} />
-  </div>;
-};

package/kits/tiktok-energia/elementos/Fundo.tsx

@@ -1,8 +0,0 @@
-// Fundo: preto chapado. Só aparece antes do primeiro bloco de cor; as cenas trazem o próprio fundo (CorteDeCor).
-import React from 'react';
-import {AbsoluteFill} from 'remotion';
-import {COR} from './base';
-
-export type FundoProps = {cor?: string};
-
-export const Fundo: React.FC<FundoProps> = ({cor = COR.preto}) => <AbsoluteFill style={{background: cor}} />;

package/kits/tiktok-energia/elementos/Montagem.tsx

@@ -1,67 +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, {useEffect, useState} from 'react';
-import {AbsoluteFill, continueRender, delayRender} from 'remotion';
-import {COR, esperarFontes, fontesProntas} from './base';
-import {Fundo} from './Fundo';
-import {Camera} from './Camera';
-import {Cena, Entrada, Saida} from './Cena';
-import {Efeito, NomeSom, Trilha} from './Som';
-import {CorteDeCor} from './CorteDeCor';
-import {PalavraSoco} from './PalavraSoco';
-import {TextoCaixa} from './TextoCaixa';
-import {FotoSoco} from './FotoSoco';
-import {EmojiSticker} from './EmojiSticker';
-import {AssinaturaMarca} from './AssinaturaMarca';
-
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-export const ELEMENTOS: Record<string, React.FC<any>> = {
-  CorteDeCor, PalavraSoco, TextoCaixa, FotoSoco, EmojiSticker, AssinaturaMarca,
-};
-
-export type Camada = {elemento: string; props: Record<string, unknown>};
-export type CenaPlano = {
-  batida: string; de: number; ate: number; entrada?: Entrada; saida?: Saida;
-  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 = {}}) => {
-  // não desenha nada antes das fontes: as medidas de texto (caber) precisam delas
-  const [ok, setOk] = useState(fontesProntas());
-  useEffect(() => {
-    if (ok) return;
-    const h = delayRender('tiktok-energia: aguardando fontes');
-    esperarFontes().then(() => {setOk(true); setTimeout(() => continueRender(h), 40);});
-  }, [ok]);
-  if (!ok) return <AbsoluteFill style={{background: COR.preto}} />;
-  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.preto}}>
-    <Fundo {...(plano.fundo ?? {})} />
-    <Camera batidas={socos} forca={1}>
-      {plano.cenas.map((c, i) => <Cena key={i} de={c.de} ate={c.ate} entrada={c.entrada} saida={c.saida} ultima={i === ultima}>
-        {c.camadas.map((k, j) => {
-          const El = ELEMENTOS[k.elemento];
-          if (!El) throw new Error(`tiktok-energia: 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/tiktok-energia/elementos/PalavraSoco.tsx

@@ -1,29 +0,0 @@
-// PalavraSoco: uma palavra (ou sequência, uma a cada `intervalo` quadros) em Anton gigante. Cada palavra nasce a 3,4x,
-// assenta em 4 quadros e treme (14 px decaindo em ~6 quadros) com divisão de cor RGB (magenta e azul, ±16 px → ±3 px).
-import React from 'react';
-import {useCurrentFrame} from 'remotion';
-import {COR, FAM_A, FONTE_A, LARGURA_UTIL, caber, e5, rnd, seg} from './base';
-
-export type PalavraSocoProps = {
-  palavras: string[];
-  /** quadros entre uma palavra e a próxima */
-  intervalo?: number;
-  y?: number;
-  tamanho?: number;
-  /** cor da letra */
-  cor?: string;
-  /** cores da divisão RGB (esq., dir.) */
-  divisao?: [string, string];
-  inicio?: number;
-};
-
-export const PalavraSoco: React.FC<PalavraSocoProps> = ({palavras, intervalo = 15, y = 730, tamanho = 400, cor = COR.preto, divisao = [COR.magenta, COR.azul], inicio = 0}) => {
-  const f = useCurrentFrame();
-  if (f < inicio) return null;
-  const i = Math.min(palavras.length - 1, Math.floor((f - inicio) / intervalo)), q = f - inicio - i * intervalo, p = palavras[i];
-  const tam = caber(p, tamanho, FAM_A, LARGURA_UTIL, 400, 0.01);
-  const esc = 1 + 2.4 * (1 - e5(seg(q, 0, 4))), tr = Math.exp(-q / 6) * 14, dv = 3 + 13 * Math.exp(-q / 4);
-  const dx = Math.sin(q * 3.1 + i) * tr, dy = Math.cos(q * 2.7 + i * 2) * tr * 0.7;
-  return <div style={{position: 'absolute', left: 0, width: 1080, top: y - tam * 0.55, height: tam * 1.1, display: 'flex', alignItems: 'center', justifyContent: 'center', transform: `translate(${dx}px, ${dy}px) scale(${esc}) rotate(${(i % 2 ? 3 : -3) * (1 - 0.5 * e5(seg(q, 0, 6)))}deg)`, fontFamily: FONTE_A, fontSize: tam, lineHeight: 1, letterSpacing: '0.01em', color: cor, textShadow: `${-dv}px 0 ${divisao[0]}, ${dv}px 0 ${divisao[1]}`, whiteSpace: 'nowrap', opacity: q < 0 ? 0 : 1}}>{p}</div>;
-};
-void rnd;

package/kits/tiktok-energia/elementos/Som.tsx

@@ -1,33 +0,0 @@
-// Som: os efeitos e a trilha do kit. Efeitos sintetizados (MotionCraft `sfx make`), trilha de `music make`.
-// Ver assets/ASSETS.md. Regra: um som por movimento que importa, 1 a 2 quadros ANTES do visual.
-import React from 'react';
-import {Audio, Sequence, interpolate, useVideoConfig} from 'remotion';
-import soco from '../assets/sons/soco.mp3';
-import corte from '../assets/sons/corte.mp3';
-import whoosh from '../assets/sons/whoosh.mp3';
-import pop from '../assets/sons/pop.mp3';
-import zap from '../assets/sons/zap.mp3';
-import subida from '../assets/sons/subida.mp3';
-import palavra from '../assets/sons/palavra.mp3';
-import assinatura from '../assets/sons/assinatura.mp3';
-import trilha from '../assets/trilha/tech-128bpm.mp3';
-
-export const SONS = {'soco': soco, 'corte': corte, 'whoosh': whoosh, 'pop': pop, 'zap': zap, 'subida': subida, 'palavra': palavra, 'assinatura': assinatura} as const;
-export type NomeSom = keyof typeof SONS;
-
-// volume de cada efeito (0..1) já calibrado contra a trilha
-const VOLUME: Record<NomeSom, number> = {'soco': 1.0, 'corte': 0.8, 'whoosh': 0.8, 'pop': 0.85, 'zap': 0.8, 'subida': 0.6, 'palavra': 0.85, 'assinatura': 0.9};
-
-export type EfeitoProps = {som: NomeSom; em: number; volume?: number};
-/** um efeito no quadro `em` (absoluto, ou relativo à Cena se estiver dentro de uma) */
-export const Efeito: React.FC<EfeitoProps> = ({som, em, volume}) =>
-  <Sequence from={Math.max(0, Math.round(em))} durationInFrames={90} layout="none">
-    <Audio src={SONS[som]} volume={volume ?? VOLUME[som]} />
-  </Sequence>;
-
-export type TrilhaProps = {volume?: number; /** quadros de fade no fim */ saida?: number};
-/** a trilha do kit, do quadro 0 ao fim, com fade de saída */
-export const Trilha: React.FC<TrilhaProps> = ({volume = 0.6, saida = 20}) => {
-  const {durationInFrames} = useVideoConfig();
-  return <Audio src={trilha} volume={(f) => volume * interpolate(f, [durationInFrames - saida, durationInFrames], [1, 0], {extrapolateLeft: 'clamp', extrapolateRight: 'clamp'})} />;
-};

package/kits/tiktok-energia/elementos/TextoCaixa.tsx

@@ -1,25 +0,0 @@
-// TextoCaixa: frase curta em caixa de texto de adesivo (Rubik 800), girada 3–6°. Entra com overshoot 1,9 (escala 0,3 → 1)
-// e depois balança ±1°. Estilos: branca, preta, lima ou magenta.
-import React from 'react';
-import {useCurrentFrame} from 'remotion';
-import {COR, FAM_B, FONTE_B, caber, larguraTexto, ob, seg} from './base';
-
-export type TextoCaixaProps = {
-  texto: string;
-  x?: number;
-  y?: number;
-  tamanho?: number;
-  rot?: number;
-  estilo?: 'branca' | 'preta' | 'lima' | 'magenta';
-  inicio?: number;
-};
-
-const ESTILOS = {branca: [COR.branco, COR.preto], preta: [COR.preto, COR.branco], lima: [COR.lima, COR.preto], magenta: [COR.magenta, COR.branco]} as const;
-
-export const TextoCaixa: React.FC<TextoCaixaProps> = ({texto, x = 540, y = 1140, tamanho = 80, rot = -4, estilo = 'branca', inicio = 0}) => {
-  const f = useCurrentFrame() - inicio;
-  if (f < -1) return null;
-  const t = caber(texto, tamanho, FAM_B, 800 - tamanho * 0.9, 800, 0), w = larguraTexto(texto, t, FAM_B, 800, 0) + t * 0.9, h = t * 1.6;
-  const p = ob(seg(f, 0, 10), 1.9), [bg, fg] = ESTILOS[estilo];
-  return <div style={{position: 'absolute', left: x - w / 2, top: y - h / 2, width: w, height: h, borderRadius: 22, background: bg, color: fg, display: 'flex', alignItems: 'center', justifyContent: 'center', fontFamily: FONTE_B, fontWeight: 800, fontSize: t, whiteSpace: 'nowrap', boxShadow: estilo === 'branca' ? '8px 8px 0 #0B0B0F' : '8px 8px 0 rgba(0,0,0,0.55)', transform: `rotate(${rot + Math.sin(f / 9) * 1}deg) scale(${0.3 + 0.7 * p})`, opacity: Math.min(1, p * 3)}}>{texto}</div>;
-};

package/kits/tiktok-energia/elementos/base.ts

@@ -1,92 +0,0 @@
-// Base do kit tiktok-energia: cores, fontes, curvas e medidas. Todo número visual sai daqui.
-// Os elementos importam só este arquivo, 'react' e 'remotion'. Nada de fora da pasta do kit.
-import {continueRender, delayRender} from 'remotion';
-import fonteA from '../assets/fontes/anton-latin.woff2';
-import fonteB from '../assets/fontes/rubik-latin.woff2';
-
-// ---------- tela ----------
-export const LARGURA = 1080, ALTURA = 1920, FPS = 30;
-// área segura (Reels/TikTok): o que se lê fica entre estas linhas
-export const SEGURA = {topo: 168, base: 1330, lado: 96};
-export const LARGURA_UTIL = LARGURA - SEGURA.lado * 2; // 888 px
-
-// ---------- cor ----------
-export const COR = {
-  preto: '#0B0B0F',
-  branco: '#FFFFFF',
-  lima: '#D4FF1F',
-  magenta: '#FF2D75',
-  azul: '#2E5BFF',
-};
-
-export const BLOCOS = [COR.lima, COR.preto, COR.magenta, COR.azul];
-/** cor do texto que lê bem sobre o bloco */
-export const sobre = (bloco: string) => (bloco === COR.lima || bloco === COR.branco ? COR.preto : COR.branco);
-
-// ---------- fonte ----------
-// Famílias com o prefixo do kit, pra não colidir com outro kit no mesmo estúdio.
-export const FAM_A = 'TK Anton';
-export const FONTE_A = '"TK Anton", Impact, sans-serif';
-export const FAM_B = 'TK Rubik';
-export const FONTE_B = '"TK Rubik", system-ui, sans-serif';
-
-// As medidas de texto (caber) só valem depois das fontes: a Montagem espera `esperarFontes()` antes de desenhar.
-const TOTAL_FONTES = 2;
-let nProntas = 0;
-const aguardando: (() => void)[] = [];
-const marcarFonte = () => {nProntas++; if (nProntas >= TOTAL_FONTES) aguardando.splice(0).forEach((r) => r());};
-export const fontesProntas = () => nProntas >= TOTAL_FONTES || typeof document === 'undefined';
-export const esperarFontes = () => new Promise<void>((res) => {if (fontesProntas()) res(); else aguardando.push(res);});
-if (typeof document !== 'undefined' && !(globalThis as Record<string, unknown>).__tkA) {
-  (globalThis as Record<string, unknown>).__tkA = true;
-  const hA = delayRender('tiktok-energia: TK Anton');
-  new FontFace('TK Anton', `url(${fonteA}) format('woff2')`, {weight: '400', style: 'normal'}).load()
-    .then((ff) => {document.fonts.add(ff); marcarFonte(); continueRender(hA);})
-    .catch(() => {marcarFonte(); continueRender(hA);});
-}
-if (typeof document !== 'undefined' && !(globalThis as Record<string, unknown>).__tkB) {
-  (globalThis as Record<string, unknown>).__tkB = true;
-  const hB = delayRender('tiktok-energia: TK Rubik');
-  new FontFace('TK Rubik', `url(${fonteB}) format('woff2')`, {weight: '600 900', style: 'normal'}).load()
-    .then((ff) => {document.fonts.add(ff); marcarFonte(); continueRender(hB);})
-    .catch(() => {marcarFonte(); continueRender(hB);});
-}
-
-// ---------- tempo e curva ----------
-export const c01 = (t: number) => Math.max(0, Math.min(1, t));
-/** progresso 0..1 de f entre a e b */
-export const seg = (f: number, a: number, b: number) => c01((f - a) / (b - a));
-/** saída rápida e pouso longo, ≈ cubic-bezier(.2,.8,.2,1) */
-export const e5 = (t: number) => 1 - Math.pow(1 - c01(t), 5);
-/** saída com overshoot (passa de 1 e volta): toda entrada do kit usa esta ou a e5 */
-export const ob = (t: number, s = 1.9) => {const x = c01(t) - 1; return 1 + (s + 1) * x * x * x + s * x * x;};
-export const lerp = (a: number, b: number, t: number) => a + (b - a) * t;
-/** pseudo-aleatório estável (0..1) a partir de um inteiro */
-export const rnd = (n: number) => {const x = Math.sin(n * 127.1 + 311.7) * 43758.5453; return x - Math.floor(x);};
-/** uma batida da trilha do kit em quadros */
-export const BATIDA = 14.0625;
-
-// ---------- medida de texto ----------
-let canvas: HTMLCanvasElement | null = null;
-const cache = new Map<string, number>();
-export const larguraTexto = (texto: string, tamanho: number, fam: string, peso = 800, trackingEm = 0): number => {
-  const chave = `${texto}|${tamanho}|${fam}|${peso}|${trackingEm}`;
-  const c = cache.get(chave); if (c !== undefined) return c;
-  if (typeof document === 'undefined') return texto.length * tamanho * 0.58;
-  canvas = canvas || document.createElement('canvas');
-  const ctx = canvas.getContext('2d'); if (!ctx) return texto.length * tamanho * 0.58;
-  const fonte = `${peso} ${tamanho}px "${fam}"`;
-  ctx.font = fonte;
-  const w = ctx.measureText(texto).width + texto.length * trackingEm * tamanho;
-  if (fontesProntas() && document.fonts.check(fonte)) cache.set(chave, w);
-  return w;
-};
-/** o maior tamanho até `tamanho` em que o texto cabe em `largura` (nunca palavra cortada) */
-export const caber = (texto: string, tamanho: number, fam: string, largura = LARGURA_UTIL, peso = 800, trackingEm = 0) => {
-  const w = larguraTexto(texto, tamanho, fam, peso, trackingEm);
-  return w > largura ? Math.floor(tamanho * (largura / w)) : tamanho;
-};
-/** tira os asteriscos de destaque: "Usar *IA*" -> "Usar IA" */
-export const textoLimpo = (t: string) => t.replace(/\*/g, '');
-/** corta "a *b* c" em [{t:'a ', d:false}, {t:'b', d:true}, {t:' c', d:false}] */
-export const partes = (t: string) => t.split('*').map((p, i) => ({t: p, d: i % 2 === 1})).filter((p) => p.t.length > 0);

package/kits/tiktok-energia/elementos/index.ts

@@ -1,15 +0,0 @@
-// Tudo que o kit tiktok-energia oferece. A IA monta o vídeo combinando isto (ou escrevendo um plano pra Montagem).
-export * from './base';
-export {Fundo} from './Fundo';
-export {Camera, posCamera} from './Camera';
-export {Cena, useDuracaoCena, SOBREPOE} from './Cena';
-export {CorteDeCor} from './CorteDeCor';
-export {PalavraSoco} from './PalavraSoco';
-export {TextoCaixa} from './TextoCaixa';
-export {FotoSoco} from './FotoSoco';
-export {EmojiSticker} from './EmojiSticker';
-export {AssinaturaMarca} from './AssinaturaMarca';
-export {Efeito, Trilha, SONS} from './Som';
-export type {NomeSom} from './Som';
-export {Montagem, ELEMENTOS} from './Montagem';
-export type {Plano, CenaPlano, Camada} from './Montagem';

package/kits/tiktok-energia/exemplos/logo-pulo.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200"><rect width="200" height="200" fill="#0B0B0F"/><path d="M40 150L100 40l60 110z" fill="#D4FF1F"/><path d="M70 150l30-56 30 56z" fill="#FF2D75"/></svg>

package/kits/tiktok-energia/exemplos/plano.json

@@ -1,66 +0,0 @@
-{
-  "kit": "tiktok-energia",
-  "roteiro": "exemplos/roteiro.md",
-  "duracao": 240,
-  "trilha": {"volume": 0.6},
-  "cenas": [
-    {"batida": "gancho", "de": 0, "ate": 30, "entrada": "nenhuma",
-     "camadas": [
-       {"elemento": "CorteDeCor", "props": {"cor": "#D4FF1F", "de": "esquerda"}},
-       {"elemento": "PalavraSoco", "props": {"palavras": ["PARA!"], "y": 700, "tamanho": 420, "cor": "#0B0B0F", "inicio": 3}},
-       {"elemento": "EmojiSticker", "props": {"emoji": "👀", "x": 540, "y": 1090, "tamanho": 250, "inicio": 14}}
-     ],
-     "socos": [3, 14],
-     "sons": [{"som": "corte", "em": 0}, {"som": "soco", "em": 3}, {"som": "pop", "em": 14}]},
-    {"batida": "virada", "de": 30, "ate": 62, "entrada": "nenhuma",
-     "camadas": [
-       {"elemento": "CorteDeCor", "props": {"cor": "#0B0B0F", "de": "direita"}},
-       {"elemento": "PalavraSoco", "props": {"palavras": ["TEM", "DROP"], "intervalo": 15, "y": 720, "tamanho": 460, "cor": "#D4FF1F", "divisao": ["#FF2D75", "#2E5BFF"], "inicio": 3}}
-     ],
-     "socos": [3, 18],
-     "sons": [{"som": "corte", "em": 0}, {"som": "soco", "em": 3}, {"som": "palavra", "em": 17}, {"som": "soco", "em": 18}]},
-    {"batida": "prova", "de": 62, "ate": 98, "entrada": "nenhuma",
-     "camadas": [
-       {"elemento": "CorteDeCor", "props": {"cor": "#2E5BFF", "de": "baixo"}},
-       {"elemento": "FotoSoco", "props": {"src": "fotos/foto-03.jpg", "x": 540, "y": 640, "largura": 700, "altura": 860, "rot": -3, "inicio": 4}},
-       {"elemento": "TextoCaixa", "props": {"texto": "tênis Pulo", "x": 540, "y": 1150, "tamanho": 96, "rot": 4, "estilo": "lima", "inicio": 14}}
-     ],
-     "socos": [4, 14],
-     "sons": [{"som": "corte", "em": 0}, {"som": "whoosh", "em": 3}, {"som": "pop", "em": 14}]},
-    {"batida": "prova", "de": 98, "ate": 128, "entrada": "nenhuma",
-     "camadas": [
-       {"elemento": "CorteDeCor", "props": {"cor": "#FF2D75", "de": "cima"}},
-       {"elemento": "PalavraSoco", "props": {"palavras": ["50%"], "y": 720, "tamanho": 520, "cor": "#FFFFFF", "divisao": ["#0B0B0F", "#2E5BFF"], "inicio": 3}}
-     ],
-     "socos": [3],
-     "sons": [{"som": "corte", "em": 0}, {"som": "subida", "em": -2}, {"som": "soco", "em": 3}]},
-    {"batida": "prova", "de": 128, "ate": 158, "entrada": "nenhuma",
-     "camadas": [
-       {"elemento": "CorteDeCor", "props": {"cor": "#0B0B0F", "de": "esquerda"}},
-       {"elemento": "PalavraSoco", "props": {"palavras": ["SÓ 100"], "y": 720, "tamanho": 440, "cor": "#FFFFFF", "divisao": ["#D4FF1F", "#FF2D75"], "inicio": 3}}
-     ],
-     "socos": [3],
-     "sons": [{"som": "corte", "em": 0}, {"som": "soco", "em": 3}]},
-    {"batida": "data", "de": 158, "ate": 190, "entrada": "nenhuma",
-     "camadas": [
-       {"elemento": "CorteDeCor", "props": {"cor": "#D4FF1F", "de": "direita"}},
-       {"elemento": "PalavraSoco", "props": {"palavras": ["DIA 20"], "y": 700, "tamanho": 430, "cor": "#0B0B0F", "inicio": 3}},
-       {"elemento": "EmojiSticker", "props": {"emoji": "⏰", "x": 540, "y": 1090, "tamanho": 250, "rot": -8, "inicio": 14}}
-     ],
-     "socos": [3, 14],
-     "sons": [{"som": "corte", "em": 0}, {"som": "soco", "em": 3}, {"som": "pop", "em": 14}]},
-    {"batida": "cta", "de": 190, "ate": 212, "entrada": "nenhuma",
-     "camadas": [
-       {"elemento": "CorteDeCor", "props": {"cor": "#2E5BFF", "de": "baixo"}},
-       {"elemento": "PalavraSoco", "props": {"palavras": ["CORRE!"], "y": 720, "tamanho": 420, "cor": "#FFFFFF", "divisao": ["#FF2D75", "#0B0B0F"], "inicio": 3}}
-     ],
-     "socos": [3],
-     "sons": [{"som": "corte", "em": 0}, {"som": "soco", "em": 3}]},
-    {"batida": "marca", "de": 212, "ate": 240, "entrada": "nenhuma",
-     "camadas": [
-       {"elemento": "AssinaturaMarca", "props": {"logo": "logo-pulo.svg", "nome": "pulo", "endereco": "pulo.exemplo", "inicio": 0}}
-     ],
-     "socos": [4, 10],
-     "sons": [{"som": "corte", "em": 0}, {"som": "assinatura", "em": 4}, {"som": "zap", "em": 16}]}
-  ]
-}

package/kits/tiktok-energia/exemplos/roteiro.md

@@ -1,22 +0,0 @@
-# Roteiro de demonstração · "Pulo" (tênis fictício)
-
-Pedido: *"um reels de 8 s anunciando o drop do tênis Pulo, 50% off para as 100 primeiras pessoas, dia 20. Estilo TikTok com muita energia."*
-
-Sem narração: os cortes seguem a trilha (1 batida = 14.0625 quadros).
-
-| # | batida | tempo (quadros) | na tela | elemento | som |
-|---|---|---|---|---|---|
-| 1 | gancho | 0–30 | "PARA!" no lima + 👀 | CorteDeCor + PalavraSoco + EmojiSticker | corte, soco, pop |
-| 2 | virada | 30–60 | "TEM / DROP" no preto | CorteDeCor + PalavraSoco | corte, soco, palavra, soco |
-| 3 | prova | 60–96 | foto do tênis bate + caixa "tênis Pulo" | CorteDeCor + FotoSoco + TextoCaixa | corte, whoosh, pop |
-| 4 | prova | 96–126 | "50%" no azul | CorteDeCor + PalavraSoco | corte, subida, soco |
-| 5 | prova | 126–156 | "SÓ 100" no magenta | CorteDeCor + PalavraSoco | corte, soco |
-| 6 | data | 156–188 | "DIA 20" no lima + ⏰ | CorteDeCor + PalavraSoco + EmojiSticker | corte, soco, pop |
-| 7 | cta | 188–210 | "CORRE!" no preto | CorteDeCor + PalavraSoco | corte, soco |
-| 8 | marca | 210–240 | logo + "pulo" + "pulo.exemplo" | AssinaturaMarca | corte, assinatura, zap |
-
-Como a IA chegou nisso:
-1. Cortou o pedido em palavras de 1–2 sílabas: ordem, nome, foto, número, quantidade, data, ação.
-2. Pegou as batidas obrigatórias e deu a cada cena um bloco de cor diferente, sem repetir a cor do vizinho.
-3. Deixou só um apoio por cena e uma pausa de 15 quadros depois de cada soco.
-4. Escreveu `plano.json`; o `preview.tsx` passa o plano para `Montagem`.