primocode 8.38.1 → 8.40.0

package/lib/remotion.js

@@ -214,51 +214,141 @@ export function cenaNoQuadro(doc, q, fps = FPS) {
 `;
 }
 
-const FILME_JSX = `import { useCurrentFrame, useVideoConfig, AbsoluteFill, Audio, staticFile } from "remotion";
-import { useEffect, useRef } from "react";
+const FILME_JSX = `import { useCurrentFrame, useVideoConfig, AbsoluteFill, Audio, Sequence, staticFile, delayRender, continueRender } from "remotion";
+import { useLayoutEffect, useRef } from "react";
 import { cenaNoQuadro, quadrosDaCena } from "./tempo.js";
 import "./render.css";
 import "./fontes.css";
 import { renderCena } from "./render.js";
 
-/* O desenho de uma cena é do ESTÚDIO — render.js é o mesmo arquivo que o
-   navegador carrega. Aqui só se decide qual cena está no ar e como ela entra.
-   Inventar um segundo desenhista daria duas gramáticas para manter, e uma
-   ficaria velha. */
-function Cena({ cena, doc, dentro, dur }) {
+/* ── POR QUE ESTE ARQUIVO MUDOU ──────────────────────────────────────────
+   O primeiro vídeo que saiu daqui estava MUDO e PARADO: \`animar: false\`
+   congelava toda animação (o número não contava, a lista não revelava, o
+   vidro não brilhava), e o único áudio era \`trilha.src\` — sem narração, sem
+   trilha gerada, sem efeitos. Tecnicamente perfeito, visualmente morto.
+
+   Agora a cena é desenhada COM as animações ligadas (a mesma classe
+   \`animar\` do player) e, a cada quadro, TODAS elas são levadas ao instante
+   certo pela Web Animations API (\`getAnimations().currentTime\`). É o que
+   torna o render determinístico: o mesmo quadro em qualquer máquina, sem
+   depender de relógio. A contagem dos números e o instante dos clipes seguem
+   a mesma conta do player. A narração de cada cena, a trilha em arquivo, o
+   áudio dos clipes e os sons por arquivo entram como <Audio> do Remotion.
+
+   O que o Remotion NÃO faz sozinho: a trilha GERADA e os sons SINTETIZADOS
+   (são WebAudio ao vivo). Por isso o studio_exportar do PrimoCode renderiza
+   este projeto sem áudio e MISTURA o áudio do Studio — é a mescla dos dois.
+   Aqui dentro, \`doc.__semAudio\` é como o PrimoCode pede esse silêncio. */
+
+const src = (u) => (/^(https?:|data:|blob:)/.test(u) ? u : staticFile(String(u).replace(/^\\//, "")));
+
+function inicioDaCena(cenas, k, fps) {
+  let q = 0;
+  for (let i = 0; i < k; i++) q += quadrosDaCena(cenas[i], fps);
+  return q;
+}
+
+/* A contagem dos números, determinística: a MESMA curva do player
+   (1,1 s, easeOutCubic), só que em função do tempo da cena e não do relógio. */
+function contarEm(el, t) {
+  el.querySelectorAll("b[data-contar]").forEach((b) => {
+    const alvo = parseFloat(b.getAttribute("data-contar"));
+    const molde = b.getAttribute("data-molde") || String(alvo);
+    const casas = (String(alvo).split(".")[1] || "").length;
+    const trecho = molde.match(/-?[\\d.,]+/);
+    if (!trecho) return;
+    const p = Math.min(1, t / 1.1);
+    const suave = 1 - Math.pow(1 - p, 3);
+    const v = (alvo * suave).toFixed(casas);
+    b.textContent = p >= 1 ? molde : molde.replace(trecho[0], String(v).replace(".", casas ? "," : ""));
+  });
+}
+
+function Cena({ cena, doc, dentro, fps }) {
   const caixa = useRef(null);
+  const no = useRef(null);
 
-  useEffect(() => {
+  useLayoutEffect(() => {
     if (!caixa.current) return;
     caixa.current.innerHTML = "";
-    // \`animar: false\`: quem anima aqui é o Remotion, quadro a quadro. Com as
-    // animações CSS ligadas, cada quadro renderizado recomeçaria a animação
-    // do zero — o vídeo sairia com o primeiro instante repetido do começo ao
-    // fim, tecnicamente perfeito e visualmente parado.
-    caixa.current.appendChild(renderCena(cena, doc, { animar: false }));
+    no.current = renderCena(cena, doc, { animar: true });
+    caixa.current.appendChild(no.current);
   }, [cena, doc]);
 
+  useLayoutEffect(() => {
+    const el = no.current;
+    if (!el) return;
+    const t = dentro / fps;
+    // 1. Toda animação CSS — entrada, chaves, transição da cena, brilho do
+    //    vidro, cubo girando — no instante t. Pausada: quem avança é o quadro.
+    let anims = [];
+    try { anims = el.getAnimations({ subtree: true }); } catch (e) { anims = []; }
+    for (const a of anims) {
+      try { a.pause(); a.currentTime = t * 1000; } catch (e) { /* animação já encerrada */ }
+    }
+    // 2. Os números que contam.
+    contarEm(el, t);
+    // 3. Os clipes do usuário: o quadro certo do arquivo, esperado de verdade.
+    el.querySelectorAll("video").forEach((v) => {
+      const de = Number(v.dataset.de || 0);
+      const alvo = de + t;
+      v.pause();
+      const buscar = () => {
+        if (Math.abs(v.currentTime - alvo) < 1 / (fps * 2)) return;
+        const h = delayRender("clipe em " + alvo.toFixed(2) + "s");
+        const fim = () => { v.removeEventListener("seeked", fim); continueRender(h); };
+        v.addEventListener("seeked", fim);
+        v.currentTime = alvo;
+      };
+      if (v.readyState >= 1) buscar();
+      else {
+        const h = delayRender("carregando clipe");
+        v.addEventListener("loadedmetadata", () => { buscar(); continueRender(h); }, { once: true });
+      }
+    });
+  }, [dentro, fps, cena, doc]);
+
   return <div ref={caixa} style={{ width: "100%", height: "100%" }} />;
 }
 
-/* Entrada e transição vindas do quadro, não do CSS.
-
-   \`t\` vai de 0 a 1 nos primeiros 18 quadros da cena. A curva é a mesma do
-   estúdio (cubic-bezier .22 1 .36 1, aproximada por um easeOutCubic): sem
-   isso a peça exportada por Remotion teria outro tempo de entrada que a
-   mesma peça vista no navegador. */
-function entrada(transicao, t) {
-  const s = 1 - Math.pow(1 - t, 3);
-  switch (transicao) {
-    case "corte":     return {};
-    case "deslizar":  return { opacity: s, transform: \`translateX(\${(1 - s) * 8}%)\` };
-    case "subir":     return { opacity: s, transform: \`translateY(\${(1 - s) * 8}%)\` };
-    case "zoom":      return { opacity: s, transform: \`scale(\${0.92 + s * 0.08})\` };
-    case "flash":     return { opacity: s, filter: \`brightness(\${1 + (1 - s) * 2.2})\` };
-    case "limpar":    return { opacity: 1, clipPath: \`inset(0 \${(1 - s) * 100}% 0 0)\` };
-    case "persiana":  return { opacity: 1, clipPath: \`inset(\${(1 - s) * 50}% 0 \${(1 - s) * 50}% 0)\` };
-    default:          return { opacity: s };            // fade
+/* O som da peça, fora o que é sintetizado. */
+function Sons({ doc, fps }) {
+  if (doc.__semAudio) return null;
+  const cenas = doc.cenas || [];
+  const pecas = [];
+  const trilha = doc.trilha || {};
+  if (trilha.src && trilha.tipo !== "gerada") {
+    pecas.push(<Audio key="trilha" src={src(trilha.src)} loop={trilha.repetir !== false}
+      volume={trilha.volume == null ? 0.7 : trilha.volume}
+      startFrom={Math.round((Number(trilha.inicio) || 0) * fps)} />);
   }
+  cenas.forEach((c, k) => {
+    const de = inicioDaCena(cenas, k, fps);
+    const dur = quadrosDaCena(c, fps);
+    if (c.narracaoAudio) {
+      pecas.push(<Sequence key={"n" + k} from={de} durationInFrames={dur}>
+        <Audio src={src(c.narracaoAudio)} volume={doc.voz && doc.voz.volume != null ? doc.voz.volume : 1} />
+      </Sequence>);
+    }
+    (c.elementos || []).forEach((e, i) => {
+      if (!e) return;
+      if (e.tipo === "clipe" && e.src && !e.mudo) {
+        pecas.push(<Sequence key={"c" + k + "-" + i} from={de} durationInFrames={dur}>
+          <Audio src={src(e.src)} startFrom={Math.round((Number(e.de) || 0) * fps)}
+            volume={e.volume == null ? 1 : e.volume} />
+        </Sequence>);
+      }
+      if (e.som && typeof e.som === "object" && e.som.arquivo) {
+        const atraso = e.som.em != null ? Number(e.som.em)
+          : (e.anim && typeof e.anim === "object" && e.anim.atraso != null) ? Number(e.anim.atraso)
+          : (e.chaves && e.chaves.length > 1 ? 0 : i * 0.09 + 0.1);
+        pecas.push(<Sequence key={"s" + k + "-" + i} from={de + Math.round(atraso * fps)}>
+          <Audio src={src(e.som.arquivo)} volume={e.som.volume == null ? 0.7 : e.som.volume} />
+        </Sequence>);
+      }
+    });
+  });
+  return <>{pecas}</>;
 }
 
 export const Filme = ({ doc }) => {
@@ -267,20 +357,11 @@ export const Filme = ({ doc }) => {
   const { i, dentro } = cenaNoQuadro(doc, quadro, fps);
   const cenas = doc.cenas || [];
   const cena = cenas[i] || {};
-  const dur = quadrosDaCena(cena, fps);
-
-  const QUADROS_ENTRADA = Math.max(1, Math.round(0.62 * fps));
-  const t = Math.min(1, dentro / QUADROS_ENTRADA);
 
   return (
     <AbsoluteFill style={{ backgroundColor: "#000" }}>
-      <AbsoluteFill style={entrada(cena.transicao, t)}>
-        <Cena cena={cena} doc={doc} dentro={dentro} dur={dur} />
-      </AbsoluteFill>
-      {doc.trilha && doc.trilha.src ? (
-        <Audio src={doc.trilha.src.startsWith("http") ? doc.trilha.src : staticFile(doc.trilha.src)}
-               volume={doc.trilha.volume == null ? 0.7 : doc.trilha.volume} />
-      ) : null}
+      <Cena cena={cena} doc={doc} dentro={dentro} fps={fps} />
+      <Sons doc={doc} fps={fps} />
     </AbsoluteFill>
   );
 };
@@ -373,7 +454,7 @@ const GITIGNORE = 'node_modules/\nsaida/\n.remotion/\n';
  * @param {object} op.doc      o documento da peça (cenas, tema, trilha…)
  * @param {number} [op.fps]
  */
-function montar({ destino, titulo, doc, fps }) {
+function montar({ destino, titulo, doc, fps, midiaDir, semAudio }) {
     if (!destino) return { ok: false, error: 'diga em que pasta o projeto vai nascer' };
     if (!doc || !Array.isArray(doc.cenas) || !doc.cenas.length) {
         return { ok: false, error: 'esta peça não tem cenas — Remotion renderiza cenas, como o Studio' };
@@ -383,6 +464,29 @@ function montar({ destino, titulo, doc, fps }) {
     const src = path.join(destino, 'src');
     fs.mkdirSync(src, { recursive: true });
 
+    // A MÍDIA vai junto: "/midia/x.mp3" no doc vira public/midia/x.mp3 no
+    // projeto, que o Remotion serve por staticFile(). Sem isto a narração, a
+    // trilha e os clipes apontavam para o servidor do Studio — que não existe
+    // na hora do render, e o projeto nascia mudo sem dizer por quê.
+    const midia = [];
+    if (midiaDir) {
+        const andar = (o) => {
+            if (!o) return;
+            if (typeof o === 'string') { if (o.startsWith('/midia/')) midia.push(o); return; }
+            if (Array.isArray(o)) return o.forEach(andar);
+            if (typeof o === 'object') Object.values(o).forEach(andar);
+        };
+        andar(doc);
+        for (const u of new Set(midia)) {
+            const origem = path.join(midiaDir, path.basename(u));
+            if (!fs.existsSync(origem)) continue;
+            const alvo = path.join(destino, 'public', 'midia', path.basename(u));
+            fs.mkdirSync(path.dirname(alvo), { recursive: true });
+            try { fs.copyFileSync(origem, alvo); } catch { /* fica sem essa */ }
+        }
+    }
+    const docFinal = semAudio ? Object.assign({}, doc, { __semAudio: true }) : doc;
+
     // Os arquivos do estúdio, sem reescrever conteúdo.
     for (const [de, para] of DO_ESTUDIO) {
         const origem = path.join(ORIGEM_ESTUDIO, de);
@@ -402,14 +506,15 @@ function montar({ destino, titulo, doc, fps }) {
     escrever(path.join(destino, 'README.md'), readme(titulo, doc));
     escrever(path.join(destino, '.gitignore'), GITIGNORE);
     escrever(path.join(src, 'index.jsx'), INDEX_JSX);
-    escrever(path.join(src, 'Raiz.jsx'), raizJsx(doc, taxa));
+    escrever(path.join(src, 'Raiz.jsx'), raizJsx(docFinal, taxa));
     escrever(path.join(src, 'Filme.jsx'), FILME_JSX);
     escrever(path.join(src, 'tempo.js'), tempoJs(taxa));
-    escrever(path.join(src, 'doc.json'), JSON.stringify(doc, null, 2) + '\n');
+    escrever(path.join(src, 'doc.json'), JSON.stringify(docFinal, null, 2) + '\n');
 
     return {
         ok: true,
         pasta: destino,
+        midia: [...new Set(midia)].length,
         fps: taxa,
         segundos: +totalSegundos(doc).toFixed(2),
         quadros: Math.round(totalSegundos(doc) * taxa),
@@ -460,4 +565,99 @@ function renderizar({ pasta, saida, minutos = 20 }) {
     });
 }
 
-module.exports = { montar, renderizar, segundosDaCena, totalSegundos, VERSAO_REMOTION };
+/* ── A MESCLA: o Remotion como motor de render do studio_exportar ─────────
+ *
+ * O dono: "ele deve usar o Remotion e o Studio, deve mesclar os 2". O Studio
+ * é o autor — a cena, o motion, a narração, a trilha gerada, os efeitos — e
+ * grava o MP4 em tempo real, com o risco de quadro perdido quando a máquina
+ * está ocupada. O Remotion desenha a MESMA cena quadro a quadro, sem relógio,
+ * mas não tem WebAudio. Então: o vídeo vem do Remotion, o áudio vem do
+ * Studio, e o ffmpeg junta os dois. Quem chama é o lib/studio.js.
+ *
+ * Uma instalação só, em ~/.primocode/remotion — 250 MB uma vez, para todos
+ * os projetos —, e nunca dentro do PrimoCode (zero dependências continua
+ * valendo). Os projetos renderizados nascem em projetos/<slug>/ e resolvem
+ * `remotion` e `react` subindo a árvore até o node_modules compartilhado. */
+const os = require('os');
+const CASA_REMOTION = process.env.PRIMOCODE_REMOTION_CASA || path.join(os.homedir(), '.primocode', 'remotion');
+
+function instalado() {
+    return fs.existsSync(path.join(CASA_REMOTION, 'node_modules', '@remotion', 'cli', 'package.json'))
+        && fs.existsSync(path.join(CASA_REMOTION, 'node_modules', 'react'));
+}
+
+function cliRemotion() {
+    const pasta = path.join(CASA_REMOTION, 'node_modules', '@remotion', 'cli');
+    try {
+        const pkg = JSON.parse(fs.readFileSync(path.join(pasta, 'package.json'), 'utf-8'));
+        const bin = typeof pkg.bin === 'string' ? pkg.bin : (pkg.bin && (pkg.bin.remotion || Object.values(pkg.bin)[0]));
+        if (bin) return path.join(pasta, bin);
+    } catch { /* cai no nome conhecido */ }
+    return path.join(pasta, 'remotion-cli.js');
+}
+
+let instalando = null;
+/** Traz o Remotion uma vez. `avisar(texto)` recebe o que dizer na tela. */
+function garantirInstalado({ minutos = 15, avisar } = {}) {
+    if (instalado()) return Promise.resolve({ ok: true, jaEstava: true });
+    if (instalando) return instalando;
+    instalando = new Promise((resolve) => {
+        fs.mkdirSync(CASA_REMOTION, { recursive: true });
+        escrever(path.join(CASA_REMOTION, 'package.json'), pkgJson('primocode-remotion'));
+        if (avisar) avisar('instalando o Remotion (uma vez, ~250 MB — alguns minutos)…');
+        const npm = process.platform === 'win32' ? 'npm.cmd' : 'npm';
+        const proc = spawn(npm, ['install', '--no-audit', '--no-fund', '--loglevel=error'],
+            { cwd: CASA_REMOTION, stdio: ['ignore', 'pipe', 'pipe'], shell: process.platform === 'win32' });
+        let fora = '';
+        proc.stdout.on('data', (d) => { fora += d; });
+        proc.stderr.on('data', (d) => { fora += d; });
+        const prazo = setTimeout(() => { try { proc.kill(); } catch {} }, minutos * 60000);
+        proc.on('close', (codigo) => {
+            clearTimeout(prazo);
+            instalando = null;
+            if (codigo === 0 && instalado()) return resolve({ ok: true });
+            resolve({ ok: false, error: (fora || `npm saiu com ${codigo}`).slice(-600) });
+        });
+        proc.on('error', (e) => { clearTimeout(prazo); instalando = null; resolve({ ok: false, error: e.message }); });
+    });
+    return instalando;
+}
+
+/**
+ * Renderiza UMA peça do Studio pelo Remotion e devolve o mp4 (só vídeo quando
+ * `semAudio`). Monta o projeto em CASA_REMOTION/projetos/<slug>, com a mídia.
+ */
+async function renderizarPeca({ doc, titulo, fps, midiaDir, semAudio = true, minutos = 30, avisar }) {
+    const pronto = await garantirInstalado({ avisar });
+    if (!pronto.ok) return { ok: false, error: `Remotion não instalou: ${pronto.error}` };
+    const slug = String(titulo || 'video').normalize('NFD').replace(/[̀-ͯ]/g, '')
+        .replace(/[^\w-]+/g, '-').replace(/^-+|-+$/g, '').toLowerCase().slice(0, 40) || 'video';
+    const destino = path.join(CASA_REMOTION, 'projetos', slug);
+    const m = montar({ destino, titulo, doc, fps, midiaDir, semAudio });
+    if (!m.ok) return m;
+    if (avisar) avisar(`renderizando ${m.quadros} quadros pelo Remotion…`);
+    const arquivo = path.join('saida', 'video.mp4');
+    fs.mkdirSync(path.join(destino, 'saida'), { recursive: true });
+    const args = [cliRemotion(), 'render', 'src/index.jsx', 'Video', arquivo,
+        '--codec=h264', '--crf=18', '--log=error', '--concurrency=50%'];
+    if (semAudio) args.push('--muted');
+    return new Promise((resolve) => {
+        const proc = spawn(process.execPath, args, { cwd: destino, stdio: ['ignore', 'pipe', 'pipe'] });
+        let fora = '';
+        proc.stdout.on('data', (d) => { fora += d; });
+        proc.stderr.on('data', (d) => { fora += d; });
+        const prazo = setTimeout(() => { try { proc.kill(); } catch {} }, minutos * 60000);
+        proc.on('close', (codigo) => {
+            clearTimeout(prazo);
+            const alvo = path.join(destino, arquivo);
+            if (codigo === 0 && fs.existsSync(alvo)) {
+                return resolve({ ok: true, arquivo: alvo, bytes: fs.statSync(alvo).size, quadros: m.quadros, segundos: m.segundos, pasta: destino });
+            }
+            resolve({ ok: false, error: (fora || `remotion saiu com ${codigo}`).slice(-1200) });
+        });
+        proc.on('error', (e) => { clearTimeout(prazo); resolve({ ok: false, error: e.message }); });
+    });
+}
+
+module.exports = { montar, renderizar, renderizarPeca, garantirInstalado, instalado, cliRemotion,
+    segundosDaCena, totalSegundos, VERSAO_REMOTION, CASA_REMOTION };

package/lib/studio.js

@@ -313,7 +313,28 @@ async function avisoDaVoz(doc) {
     if (!temNarracao) return null;
     try {
         const s = await pedir('GET', '/api/voz/status', null, 3000);
-        if (s && s.piper && !s.piper.pronta && s.piper.suportado) {
+        if (!s) return null;
+        // Voz de gente garantida: ElevenLabs com chave, ou o Edge (Python,
+        // neural, grátis) já instalado. Nada a avisar.
+        if (s.elevenlabs && (s.elevenlabs.configurado || s.elevenlabs.ativo)) return null;
+        if (s.edge && s.edge.disponivel) return null;
+        if (s.piper && s.piper.pronta) return null;
+        // "A narração tá pegando do Google, tem que ser do Python" — o dono
+        // ouviu a reserva sem saber que era reserva. Quando o Edge ainda não
+        // está na máquina, o agente fica sabendo e conta: o pip está rodando
+        // (as cenas esperam por ele), ou falhou, e aí a pessoa pode instalar
+        // à mão em vez de achar que a voz do produto é aquela.
+        if (s.edge && s.edge.instalando) {
+            return 'A voz neural (edge-tts, Python) está sendo instalada agora — leva segundos, uma vez só; '
+                + 'a narração das cenas espera por ela. Se o vídeo tocar antes, a primeira reprodução pode sair '
+                + 'com a voz de reserva. Diga isso ao usuário em uma frase.';
+        }
+        if (s.edge && s.edge.erro) {
+            return `A voz neural (edge-tts) não instalou sozinha (${String(s.edge.erro).slice(0, 120)}). `
+                + 'Até instalar, a narração sai pela voz de reserva do Google. AVISE o usuário e dê o comando: '
+                + 'python3 -m pip install --user edge-tts (ou com --break-system-packages).';
+        }
+        if (s.piper && !s.piper.pronta && s.piper.suportado) {
             return 'A voz neural (offline, ilimitada) está sendo baixada agora — ~90 MB, uma vez só. '
                 + 'Até terminar a narração sai por uma voz de reserva, mais simples. Diga isso ao usuário.';
         }
@@ -770,7 +791,7 @@ function errosDoNavegador(r) {
     return erros.length ? ' O navegador reclamou: ' + erros.slice(0, 3).map((e) => e.texto).join(' · ') : '';
 }
 
-const exportarVideo = ({ id, destino, fps, escondido, pasta }) => comStudio(() => comIdReal(id, async () => {
+const exportarVideo = ({ id, destino, fps, escondido, pasta, remotion }) => comStudio(() => comIdReal(id, async () => {
     if (!id) return { ok: false, error: 'Falta o id do vídeo.' };
     if (typeof escondido !== 'function') return { ok: false, error: 'Sem navegador escondido para gerar o vídeo.' };
     const a = await pedir('GET', `/api/arquivos/${encodeURIComponent(id)}`);
@@ -829,8 +850,59 @@ const exportarVideo = ({ id, destino, fps, escondido, pasta }) => comStudio(() =
     if (!r.valor.ok) return { ok: false, error: `O navegador não conseguiu gerar o vídeo: ${r.valor.erro}.` + errosDoNavegador(r) };
 
     // 3. Do estúdio para a pasta do projeto, em mp4 quando dá.
-    const origem = noDisco(r.valor.url);
+    let origem = noDisco(r.valor.url);
     if (!origem || !fs.existsSync(origem)) return { ok: false, error: 'O navegador gerou o vídeo mas o estúdio não o guardou.' };
+
+    /* A MESCLA COM O REMOTION. O Studio acabou de gravar a peça em tempo real:
+       o ÁUDIO dele é completo (narração, trilha gerada, efeitos sintetizados),
+       mas o vídeo gravado depende do relógio — máquina ocupada perde quadro.
+       O Remotion desenha a MESMA cena quadro a quadro, determinístico, com o
+       motion inteiro (Filme.jsx leva as animações ao instante certo pela Web
+       Animations API). Então o vídeo vem do Remotion, o áudio do Studio, e o
+       ffmpeg junta. Pedido do dono: "deve usar o Remotion e o Studio, deve
+       mesclar os 2". Sem ffmpeg ou com o Remotion indisponível, fica o
+       arquivo do Studio — e o aviso diz por quê. */
+    let motor = 'studio';
+    if (remotion && temFfmpeg()) {
+        const rem = require('./remotion.js');
+        const c = require('./ui').c;
+        const avisar = (t) => console.log(c.dim('    ' + t));
+        // O doc que o Remotion desenha é o MESMO que o navegador escondido
+        // desenhou: com as cópias compatíveis dos clipes, se houve.
+        const docRemotion = JSON.parse(JSON.stringify(doc));
+        const trocar = (o) => {
+            if (!o || typeof o !== 'object') return;
+            if (Array.isArray(o)) return o.forEach(trocar);
+            for (const k of Object.keys(o)) {
+                if (typeof o[k] === 'string' && mapa[o[k]]) o[k] = mapa[o[k]]; else trocar(o[k]);
+            }
+        };
+        trocar(docRemotion);
+        const rr = await rem.renderizarPeca({
+            doc: docRemotion, titulo: a.titulo, fps: Number(fps) > 0 ? Number(fps) : 30,
+            midiaDir: MIDIA_DIR, semAudio: true, avisar,
+        });
+        if (rr.ok) {
+            // Vídeo do Remotion + áudio do Studio. `-shortest` porque as duas
+            // durações podem diferir por um quadro.
+            const mesclado = origem.replace(/\.[^.]+$/, '') + '.remotion.mp4';
+            try {
+                await ffmpeg(['-i', rr.arquivo, '-i', origem, '-map', '0:v:0', '-map', '1:a:0?',
+                    '-c:v', 'copy', '-c:a', 'aac', '-b:a', '160k', '-shortest', '-movflags', '+faststart', mesclado]);
+                if (fs.existsSync(mesclado) && fs.statSync(mesclado).size > 10000) {
+                    try { fs.unlinkSync(origem); } catch { /* fica */ }
+                    origem = mesclado;
+                    motor = 'remotion+studio';
+                    r.valor.tipo = 'video/mp4; codecs="avc1"';
+                    r.valor.formato = '.mp4';
+                }
+            } catch (e) {
+                avisos.push(`O Remotion renderizou mas a mistura com o áudio falhou (${String(e.message || e).slice(0, 120)}); ficou o arquivo do Studio.`);
+            }
+        } else {
+            avisos.push(`O Remotion não renderizou desta vez (${String(rr.error || '').slice(0, 160)}); ficou o arquivo do Studio, gravado em tempo real.`);
+        }
+    }
     const base = pasta || process.cwd();
     const slug = String(a.titulo || 'video').normalize('NFD').replace(/[̀-ͯ]/g, '')
         .replace(/[^\w-]+/g, '-').replace(/^-+|-+$/g, '').toLowerCase() || 'video';
@@ -870,6 +942,7 @@ const exportarVideo = ({ id, destino, fps, escondido, pasta }) => comStudio(() =
         ok: true,
         arquivo: saida,
         formato: formato.slice(1),
+        motor,
         bytes,
         segundos: r.valor.segundos,
         avisos: avisos.length ? avisos : undefined,

package/lib/tools.js

@@ -440,6 +440,16 @@ async function despachar(name, args, ctx) {
                     paginas: Math.max(1, Math.min(5, Number(args.paginas) || 3)),
                 });
 
+            // Música e efeito sonoro da internet, com licença e crédito. O
+            // arquivo vem para a pasta do projeto e sobe para o estúdio;
+            // volta a URL "/midia/…" pronta para trilha.src ou som.arquivo.
+            case 'buscar_audio':
+                return require('./audio-livre.js').buscarAudio(args, { projectDir, studio });
+
+            // A logo e a identidade visual da empresa, lidas do site dela.
+            case 'marca_da_empresa':
+                return require('./marca.js').marcaDaEmpresa(args, { projectDir, studio });
+
             // memory-geral.md fica FORA da pasta do projeto — write_file/edit_file
             // não alcançam por design (resolveInProject bloqueia ../ de propósito).
             // Esta é a única porta para lá, sem reabrir a sandbox.
@@ -589,9 +599,12 @@ async function despachar(name, args, ctx) {
             case 'studio_exportar':
                 // O mp4 sem clique: a página do player roda escondida e gera
                 // pelo mesmo caminho do botão. Ver lib/studio.js.
+                // Com o Remotion mesclado: o vídeo quadro a quadro dele, o
+                // áudio do Studio. PRIMOCODE_SEM_REMOTION=1 desliga.
                 return studio.exportarVideo({
                     id: args.id, destino: args.destino, fps: args.fps,
                     escondido: browser.rodarEscondido, pasta: projectDir || process.cwd(),
+                    remotion: process.env.PRIMOCODE_SEM_REMOTION !== '1',
                 });
 
             /* A MESMA peça, virando projeto Remotion.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "primocode",
-  "version": "8.38.1",
+  "version": "8.40.0",
   "description": "PrimoCode — agente de engenharia com IA e cursor próprio. Requer conta Conecta Primo AI (Premium ou Super). Cria arquivos, roda comandos, controla navegador e desktop: abre apps, clica em botões e ícones pelo nome, digita e usa atalhos.",
   "main": "bin/primocode.js",
   "bin": {
@@ -8,7 +8,7 @@
   },
   "scripts": {
     "start": "node bin/primocode.js",
-    "test": "node test/tools.test.js && node test/ui.test.js && node test/modo.test.js && node test/pasta.test.js && node test/catalogo.test.js && node test/desktop.test.js && node test/effort.test.js && node test/claude-engine.test.js && node test/regressao.test.js && node test/memoria-conversa.test.js && node test/repeticao.test.js && node test/referencia.test.js && node test/parar.test.js && node test/continuar.test.js && node test/studio-spec.test.js && node test/studio-versoes.test.js && node test/voz.test.js && node test/editor.test.js && node test/estudio-projeto.test.js && node test/vocabulario.test.js && node test/video-export.test.js && node test/monotonia.test.js && node test/clipe.test.js && node test/midia-envio.test.js && node test/pausas.test.js && node test/fala-repetida.test.js && node test/trilha.test.js && node test/anuncio.test.js && node test/pipeline.test.js && node test/app.test.js && node test/elementos.test.js && node test/remotion.test.js && node test/aplicativo.test.js && node test/conta.test.mjs && node test/nuvem.test.js && node test/codex.test.js && node test/chaves.test.js && node test/prazo.test.js && node test/primeira-vez.test.js && node test/janela.test.js && node test/pareamento.test.js && node test/fala.test.js && node test/especialistas.test.js && node test/icone.test.js && node test/exportar.test.js"
+    "test": "node test/tools.test.js && node test/ui.test.js && node test/modo.test.js && node test/pasta.test.js && node test/catalogo.test.js && node test/desktop.test.js && node test/effort.test.js && node test/claude-engine.test.js && node test/regressao.test.js && node test/memoria-conversa.test.js && node test/repeticao.test.js && node test/referencia.test.js && node test/parar.test.js && node test/continuar.test.js && node test/studio-spec.test.js && node test/studio-versoes.test.js && node test/voz.test.js && node test/editor.test.js && node test/estudio-projeto.test.js && node test/vocabulario.test.js && node test/video-export.test.js && node test/monotonia.test.js && node test/clipe.test.js && node test/midia-envio.test.js && node test/pausas.test.js && node test/fala-repetida.test.js && node test/trilha.test.js && node test/anuncio.test.js && node test/pipeline.test.js && node test/app.test.js && node test/elementos.test.js && node test/remotion.test.js && node test/aplicativo.test.js && node test/conta.test.mjs && node test/nuvem.test.js && node test/codex.test.js && node test/chaves.test.js && node test/prazo.test.js && node test/primeira-vez.test.js && node test/janela.test.js && node test/pareamento.test.js && node test/fala.test.js && node test/especialistas.test.js && node test/icone.test.js && node test/exportar.test.js && node test/ate-o-fim.test.js && node test/motion.test.js && node test/audio-marca.test.js"
   },
   "engines": {
     "node": ">=18.17.0"

package/studio/arquivos/tela-motion-3ecaa.json

@@ -0,0 +1,135 @@
+{
+  "id": "tela-motion-3ecaa",
+  "ferramenta": "tela",
+  "titulo": "motion",
+  "doc": {
+    "tema": "meia-noite",
+    "largura": 1920,
+    "altura": 1080,
+    "cenas": [
+      {
+        "layout": "livre",
+        "duracao": 6,
+        "fundo": "aurora",
+        "elementos": [
+          {
+            "tipo": "forma",
+            "forma": "circulo",
+            "x": 1250,
+            "y": 120,
+            "l": 520,
+            "a": 520,
+            "preenchimento": "#ff5a36",
+            "opacidade": 0.9
+          },
+          {
+            "tipo": "forma",
+            "forma": "retangulo",
+            "material": "vidro",
+            "x": 120,
+            "y": 140,
+            "l": 860,
+            "a": 420,
+            "raio": 36,
+            "preenchimento": "#22d3ee"
+          },
+          {
+            "tipo": "texto",
+            "x": 170,
+            "y": 190,
+            "l": 760,
+            "a": 120,
+            "texto": "Liquid glass de verdade",
+            "tamanho": 74,
+            "peso": 750
+          },
+          {
+            "tipo": "texto",
+            "x": 170,
+            "y": 330,
+            "l": 760,
+            "a": 60,
+            "texto": "desfoca o que está atrás, bisel em cima",
+            "tamanho": 34,
+            "cor": "#bfe9f4"
+          },
+          {
+            "tipo": "texto",
+            "material": "vidro",
+            "x": 170,
+            "y": 430,
+            "l": 420,
+            "a": 70,
+            "texto": "pílula de vidro",
+            "tamanho": 32
+          },
+          {
+            "tipo": "icone",
+            "nome": "foguete",
+            "estilo": "app",
+            "x": 1130,
+            "y": 640,
+            "tamanho": 220,
+            "fundo": "#8b5cf6",
+            "som": "pop"
+          },
+          {
+            "tipo": "icone",
+            "nome": "raio",
+            "estilo": "vidro",
+            "x": 1400,
+            "y": 640,
+            "tamanho": 220,
+            "cor": "#ffb03a"
+          },
+          {
+            "tipo": "objeto3d",
+            "forma": "cubo",
+            "x": 620,
+            "y": 620,
+            "tamanho": 260,
+            "girar": 0,
+            "faces": [
+              "IA",
+              "3D",
+              "Motion",
+              "Vidro",
+              "Som",
+              "Marca"
+            ]
+          },
+          {
+            "tipo": "texto",
+            "x": 120,
+            "y": 700,
+            "l": 400,
+            "a": 100,
+            "texto": "chaves 3D",
+            "tamanho": 60,
+            "peso": 700,
+            "chaves": [
+              {
+                "t": 0,
+                "giroY": -60,
+                "opacidade": 0,
+                "x": -200
+              },
+              {
+                "t": 0.4,
+                "giroY": 0,
+                "opacidade": 1,
+                "x": 0
+              },
+              {
+                "t": 1,
+                "giroY": 20
+              }
+            ],
+            "suavizar": "elastico"
+          }
+        ]
+      }
+    ]
+  },
+  "atualizado": "2026-09-09T12:28:40+00:00"
+}