sagadeck 1.8.0 → 1.9.0

package/docs/REFERENCIA.md

@@ -15,7 +15,7 @@ Mídia paga não é proibida por padrão. Quando for apropriada, proponha seu us
 ```yaml
 title: Nome da palestra          # obrigatório (vira rodapé e título da janela)
 author: Seu Nome · Cargo
-theme: sinal                     # sinal | editorial | noite | bauhaus | terminal | jornal | rabisco | oceano | pop | aurora | prata | aluminio | arcade | relevo (ou customizado, ver fim)
+theme: sinal                     # sinal | editorial | noite | bauhaus | terminal | jornal | rabisco | oceano | pop | aurora | prata | aluminio | arcade | relevo | musgo | wine | caderno | lousa | cartaz | infografico (ou customizado, ver fim)
 palette: floresta                # opcional: só as cores, vale em qualquer tema (ver "Temas e paletas"); sem ela, as cores do tema
 duration: 50                     # minutos — o modo apresentador mostra se você está adiantado/atrasado
 event: Summit de Dados 2026       # opcional — para {evento} no rodapé/cabeçalho
@@ -60,7 +60,8 @@ slides:
 | `background` | figura de fundo atrás do conteúdo |
 | `bg` / `fg` | cor de fundo / texto (hex) só neste slide |
 | `transition` | `fade` (padrão), `cut` (seca), `saida` (o anterior recua e dissolve, o próximo entra de baixo) ou `morph` (crossfade longo com respiro de escala; combine com `continuity:` nos elementos que continuam) — só no HTML; PPTX/PDF usam o quadro final |
-| `ambient` | eco ambiente nos slides estáticos: `pontos` (poeira de luz à deriva) ou `grade` (grade em perspectiva deslizando) — lembra a capa sem repeti-la; parado com movimento reduzido ou na exportação |
+| `ambient` | eco ambiente nos slides estáticos: `pontos` (poeira de luz à deriva), `grade` (grade em perspectiva deslizando) ou `rede` (nós à deriva que se ligam por linhas finas quando se aproximam, na cor de destaque; no tema `musgo` ela já vem atrás da capa, e `ambient: false` tira) — lembra a capa sem repeti-la; parado com movimento reduzido ou na exportação |
+| `ticker` | só na capa: faixa que corre devagar no pé, com os itens separados por losangos (`ticker: [Pesquisa, Arquitetura, Plano]`). No tema `musgo` ela vem sozinha, com os títulos das seções; `ticker: false` tira. Para no mouse; parada com movimento reduzido, `motion: none` e na exportação (só no HTML) |
 | `footer: false` | esconde o rodapé neste slide |
 | `id` | nome curto do slide, destino dos links (`goto`, `back`, `next`, `[texto](#id)`); ver [Navegação por caminhos](#navegação-por-caminhos-hub-goto-back-next) |
 | `back` | id (ou número) do slide para onde o botão **Voltar** do canto leva; o botão mostra o título do destino |
@@ -81,19 +82,19 @@ Tabela em markdown no meio de um texto (`problem`, `body`, `text`, passo do `sol
 | `cover` | `kicker, title, subtitle, author, role, figure` | capa |
 | `section` | `number, kicker, title, subtitle, figure` | abertura de ato/capítulo (tom `accent` por padrão) |
 | `statement` | `text` **ou** `lines: [ {text, as, color, step} ]`, `by`, `center` | uma frase de impacto; `lines` + `build` revelam linha a linha |
-| `calendar` | `kicker, title, events: [{date, title, text, tag, color}], undated: [{title, text}], undatedTitle, cols, build` | datas num **calendário** (agenda, lançamentos, cronograma, "infográfico em forma de calendário"): um cartão por mês que tem evento, com o mini calendário do mês (os dias marcados na cor do tipo) e a lista; `date`: `2026-12-18`, `18/12/2026` ou só o mês `2026-12`; cada `tag` (Filme, Série…) ganha uma cor e entra na legenda; o que não tem data vai no cartão "sem data" (`undated`). Para "calendário", este; `timeline` é para uma sequência de marcos sem a grade dos dias |
+| `calendar` | `kicker, title, events: [{date, time, title, text, tag, color}], undated: [{title, text}], undatedTitle, view, month, week, cols, build` | datas num **calendário** (agenda, lançamentos, cronograma, programação, "infográfico em forma de calendário"). `view`: `meses` (um cartão por mês com o mini calendário e a lista; poucos eventos por mês), `mes` (um mês grande, como calendário de parede, com os eventos escritos nos dias; muitos eventos num mês só), `semana` (uma coluna por dia com o horário; programação de um evento; fim de semana vazio some), `lista` (agenda compacta em colunas, agrupada por mês; muitos meses cheios). Sem `view`, o sagadeck escolhe pelo que cabe; muitos eventos em vários meses ficam melhores em **um slide por mês** (`view: mes` + `month: 2026-11` em cada slide, só com os eventos daquele mês). `week: 2026-11-16` escolhe a semana. `date`: `2026-12-18`, `18/12/2026`, `2026-12-18 14:00` ou só o mês `2026-12`; `time` ("14:00") também dá a hora; cada `tag` (Filme, Série…) ganha uma cor e entra na legenda; o que não tem data vai em "sem data" (`undated`). Para "calendário", este; `timeline` é para uma sequência de marcos sem a grade dos dias |
 | `poster` | `kicker, title, subtitle, hero` (ilustração principal: `{ image_prompt }`, imagem, gráfico…), `panels: [{label, title, text, icon` ou `figure` ou `image_prompt, facts: [{value, label}]}], flow, cols, key, build` | infográfico de UMA página no estilo de figura de revista científica (Nature, Scientific American): a ilustração principal e painéis com letra (a, b, c…), cada um com um desenho, título, texto curto e números com unidade; `flow: true` põe setas na ordem (receita, processo, protocolo); `key` é a nota de rodapé (fonte, condições). Para "infográfico de uma página", "pôster" ou "como fazer X numa página", este e não o `onepage` (que é jornada, problema e solução de um projeto). Ilustre os painéis com `image_prompt` no mesmo estilo (ex.: "clean scientific illustration, flat, white background") |
 | `definition` | `kicker, term, origin, parts: [{word, meaning}], text, icon` (ou `figure`), `build`, `termSize` (px do termo) | definição de um termo, como verbete: o termo em destaque, a origem da palavra em partes (`origin: do grego`, `parts: [{word: hydor, meaning: água}, {word: logos, meaning: ciência}]`) e a definição; para "o que é X", use este e não um `statement` com o parágrafo inteiro |
 | `quote` | `quote, by, role, after, afterStep` | citação; `after` aparece num clique |
 | `number` | `value, prefix, suffix, decimals, from, label, context, side, valueColor` | número gigante animado (conta de `from` até `value`) |
 | `split` | `title, body, bullets, content, figure, ratio: "1.2:1", reverse, build` | texto + figura |
-| `cards` | `title, items: [{icon, picto, number, title, text, foot, hl, goto}], cols, build` | 2–4 cartões |
+| `cards` | `title, items: [{icon, picto, number, title, text, foot, hl, goto, flip}], cols, build` | 2–4 cartões; com `flip` o cartão **vira** no clique (ver abaixo) |
 | `list` | `title, items: [texto ou {text, sub, goto}], numbered, size, build` | lista numerada grande |
 | `hub` | `kicker, title, question, options: [{icon, title, text, meta, goto}], cols, build` | mapa de caminhos: cada opção leva (`goto`) à parte da apresentação daquele caminho; ver [Navegação por caminhos](#navegação-por-caminhos-hub-goto-back-next) |
 | `onepage` | `kicker, title, subtitle, journey: [texto ou {icon, title, text, goto}], journeyTitle, problem: {title, text, numbers: [{value, label}], items}, solution: {…}, dashboard: {numbers: [{value, label, trend, title}], figures: [gráfico ou ufmap, com title]}` | tudo numa página (jornada, problema, solução, painel); ver [One-page](#one-page-onepage) |
 | `status` | `kicker, title, health: ok\|risco\|atrasado, healthLabel, progress (0–100), highlight, done, doing, blocked, risks, upcoming: [texto ou {text, owner, due}], shots: [{image, caption}]` | status semanal; ver [Status semanal](#status-semanal-status) |
 | `stats` | `title, stats: [{value, label, text, icon, trend, trendUp, color}], cols, build` | indicadores (KPIs) em cartões, com tendência (`trend: "+12%"`) |
-| `timeline` | `title, events: [{when, title, text, tag}], highlight, after, build` | linha do tempo |
+| `timeline` | `title, events: [{when, title, text, tag, more}], highlight, after, build` | linha do tempo; `more` põe um botão + no marco que abre um balão (ver abaixo) |
 | `chart` | `title, chart: {…}, side (texto ou elemento), chartHeight` | gráfico + comentário |
 | `table` | `title, head, rows, style, color, highlight, total, side, caption, source` | tabela de verdade nas cores do tema |
 | `map` | `kicker, title, basemap, layers: [{name, points \| geojson \| gpx \| kml \| areas, color, size, label, colors, popup, step, view}], build, view, caption` | **mapa ao vivo** com pontos, linhas e áreas (sensores, medidores, unidades de atendimento, cinemas, trajetos, regiões…): os dados vêm da planilha do projeto ou de arquivos GeoJSON/GPX/KML; ver [Mapa](#mapa-map) |
@@ -113,7 +114,6 @@ Tabela em markdown no meio de um texto (`problem`, `body`, `text`, passo do `sol
 | `references` | `title, items` | fontes (2 colunas) |
 | `headline` | `kicker, text, as, size, caption` | manchete: uma frase CURTA (até ~12 palavras) enorme ocupando o slide; frase longa sai menor (como no `statement`) e conta como slide de frase única (no máximo 2 por deck) |
 | `full` | `figure` (ou `image`/`image_prompt`), `kicker, title, caption, overlay: bottom\|left\|center\|none, fit, titleSize` | figura/imagem de página inteira com texto por cima; com `image_prompt` a IA gera a página toda. Figura do documento (`contexto/visuais/…`) ou `fit: contain` com texto não leva véu: sai com o título no alto, a figura inteira e a legenda embaixo (como `image`) |
-| `kinetic` | `figure, beats: [{text, style, position, color, size, tag}], autoplay, interval` | frases curtas em sequência sobre uma cena; avanço manual ou automático |
 | `bento` | `title, tiles: [{title, text, value, icon, figure, size: big\|wide\|tall, hl}], cols, build` | mosaico de blocos de tamanhos diferentes |
 | `funnel` | `title, stages: [{title, value, text, hl}], build` | funil que afunila etapa a etapa |
 | `pyramid` | `title, levels: [{title, text, hl}], build` | pirâmide (topo → base) |
@@ -194,37 +194,6 @@ paginação automática de apostila ainda não fazem parte deste editor.
 No YAML, um ponto usa `kind: point`, `x` e `y` em porcentagens. Áreas usam `kind: area` (ou omitem `kind`)
 e acrescentam `width` e `height`. Ambos aceitam `title` e `text` dentro de `hotspots` do layout `spotlight`.
 
-## Slide `kinetic`: tipografia em cena
-
-O layout `kinetic` combina uma figura de fundo com frases curtas que entram em sequência, podendo variar
-estilo, posição, cor e escala em cada batida. No Studio, adicione a cena e edite cada frase; a sequência
-interativa roda em **Apresentar** e avança pelos botões ou automaticamente. A prévia no editor mostra
-apenas o primeiro quadro. Ao trocar outro layout para `kinetic`, o SagaDeck reaproveita o título ou os
-itens existentes como frases e mantém a figura do slide. Sem título, frase ou itens, começa com
-“Uma ideia em movimento”.
-
-`autoplay` é `true` por padrão para duas ou mais frases e `interval` define o tempo em milissegundos
-(450–5000, padrão 1000). Movimento automático começa ao entrar no slide, para ao sair ou ao chegar à
-última frase, e respeita a preferência do sistema por movimento reduzido; o botão ainda permite iniciar
-manualmente. Para uma frase estática, use `autoplay: false`.
-
-Os estilos disponíveis são `clean`, `poster`, `editorial`, `outline` e `marker`; o estilo limpo é o padrão,
-sem brilho ou sombra exagerada. Posições: `left`, `center`,
-`right`, `top` e `bottom`; cores: `white`, `gold`, `pink` e `cyan`; escalas: `small`, `medium` e `large`.
-Campos omitidos variam com a batida para criar ritmo visual. Em impressão/exportação estática, os controles
-e a animação são substituídos por uma lista das frases.
-
-```yaml
-- layout: kinetic
-  figure: { image: palco.jpg }
-  autoplay: true
-  interval: 1100
-  beats:
-    - { text: "A IDEIA", style: poster, position: left, color: white, size: large, tag: "COMEÇA PEQUENA" }
-    - { text: "ACENDE", style: clean, position: right, color: white, size: large }
-    - { text: "E MUDA", style: editorial, position: bottom, color: gold, size: medium }
-```
-
 ## Slide `api`: requisição ao vivo
 
 Um slide tipo Postman: mostra o pedido (URL, corpo, cabeçalhos) e o código equivalente (curl, JavaScript,
@@ -235,8 +204,9 @@ Os pedidos saem do **Studio** (Node, na sua máquina), nunca do navegador: sem p
 certificado da empresa e com o token fora da página. Sem o Studio (HTML exportado, PDF, servidor
 multiusuário), o slide mostra a **última resposta gravada** e o botão vira *Reproduzir gravação*.
 
-No Studio: **Biblioteca → Nova → Exemplo: aula de APIs ao vivo** cria um deck com um slide de cada tipo;
-no editor, **Inserir → Slide de API** insere um deles e **Inserir → Ambientes** edita os ambientes. Os
+No Studio: a demo **APIs com curl** (Demos oficiais, ou Nova → Modelo pronto) mostra as chamadas mais comuns com o curl;
+o ensaio completo, com um slide de cada tipo (upload, OCR, embeddings, voz, tempo real), sai pelo comando
+`sagadeck ensaio-api`. No editor, **Inserir → Slide de API** insere um deles e **Inserir → Ambientes** edita os ambientes. Os
 exemplos rodam no ambiente embutido **ENSAIO**, uma API de mentira que o Studio local sobe sozinho (não vai
 para o seu arquivo de ambientes; o seu ambiente com o mesmo nome, se existir, vence).
 
@@ -386,7 +356,7 @@ Executar só funciona no Studio **local**: escutando em `127.0.0.1`, chamado pel
 
 ## Navegação por caminhos (`hub`, `goto`, `back`, `next`)
 
-Para processo com vários caminhos ("é experimento ou projeto? DEV, HOM ou PROD?", "o que muda conforme o
+Para conteúdo com vários caminhos ("é a primeira vez ou já usa?", "o que muda conforme o
 front-end?"), em vez de uma sequência única: um **mapa** (`layout: hub`) com as opções, cada uma levando à sua
 seção; cada seção termina voltando ao mapa. Funciona ao apresentar (clique), no PDF (links entre páginas) e no
 PowerPoint (clique pula para o slide).
@@ -404,24 +374,24 @@ PowerPoint (clique pula para o slide).
 - layout: hub
   id: mapa
   title: Qual é o seu caso?
-  question: Cada caminho tem prazos e responsáveis diferentes
+  question: Cada caminho tem passos diferentes
   options:
-    - { icon: flask-conical, title: Experimento, text: Dados fictícios, meta: 30 dias, goto: experimento }
-    - { icon: rocket, title: Projeto, text: DEV, HOM e PROD, goto: projeto }
+    - { icon: user, title: Primeira vez, text: Do zero ao primeiro resultado, meta: 4 passos, goto: inicio }
+    - { icon: rocket, title: Já uso, text: Atalhos e automação, goto: atalhos }
 - layout: steps
-  id: experimento
+  id: inicio
   back: mapa
-  title: Experimento
-  steps: [{ title: Pedido }, { title: 30 dias }, { title: Renovar ou virar projeto, goto: projeto }]
+  title: Primeira vez
+  steps: [{ title: Instalar }, { title: Primeiro projeto }, { title: Pronto? Veja os atalhos, goto: atalhos }]
 - layout: statement
-  text: Passou de 30 dias? Renove ou [vire projeto](#projeto).
+  text: Já fez o primeiro? Conheça os [atalhos](#atalhos).
   next: mapa            # fim do caminho: volta ao mapa
 - layout: cards
-  id: projeto
+  id: atalhos
   back: mapa
   next: mapa
-  title: Projeto
-  items: [{ title: DEV, text: 30 dias }, { title: HOM, text: 30 dias }, { title: PROD, text: sem prazo }]
+  title: Já uso
+  items: [{ title: Teclado, text: sem o mouse }, { title: Modelos, text: reaproveite }, { title: Automação, text: sem cliques }]
 ```
 
 ## One-page (`onepage`)
@@ -437,23 +407,23 @@ aparece como frase curta em destaque. É denso de propósito: o limite de palavr
 ```yaml
 - layout: onepage
   kicker: Proposta
-  title: Cadastro digital de clientes
-  subtitle: Menos papel, menos fila, menos retrabalho
+  title: Agendamento online de consultas
+  subtitle: Menos telefone, menos espera, menos falta
   journey:
-    - { icon: user, title: Cliente chega, text: Fila de 40 min }
-    - { icon: file-text, title: Preenche papel, text: 3 formulários }
-    - { icon: check, title: Conta aberta, text: Até 5 dias }
+    - { icon: user, title: Paciente liga, text: Espera de 15 min }
+    - { icon: file-text, title: Preenche a ficha, text: 3 formulários }
+    - { icon: check, title: Consulta marcada, text: Até 5 dias }
   problem:
-    text: O cadastro em papel atrasa a abertura de contas.
-    numbers: [{ value: 5 dias, label: para abrir uma conta }, { value: 20%, label: dos cadastros refeitos }]
+    text: Marcar por telefone atrasa as consultas.
+    numbers: [{ value: 5 dias, label: para marcar uma consulta }, { value: 20%, label: de faltas }]
   solution:
-    text: Cadastro no tablet, com validação na hora e assinatura digital.
-    items: [Conta aberta no mesmo dia, Zero papel na agência]
+    text: Agendamento pelo celular, com confirmação automática e lembrete.
+    items: [Consulta marcada no mesmo dia, Zero ligação para remarcar]
   dashboard:
-    numbers: [{ value: 1,2 mi, label: cadastros por ano, trend: +8% }]
+    numbers: [{ value: 1,2 mi, label: consultas por ano, trend: +8% }]
     figures:
-      - { title: Tempo por etapa (min), chart: bar, data: [{ label: Fila, value: 40 }, { label: Papel, value: 25 }] }
-      - { title: Cadastros por UF (mil), ufmap: { SP: 320, RJ: 140, MG: 150, BA: 90 }, highlight: [SP] }
+      - { title: Tempo por etapa (min), chart: bar, data: [{ label: Telefone, value: 15 }, { label: Ficha, value: 10 }] }
+      - { title: Consultas por UF (mil), ufmap: { SP: 320, RJ: 140, MG: 150, BA: 90 }, highlight: [SP] }
 ```
 
 ## Status semanal (`status`)
@@ -471,15 +441,29 @@ status por projeto, um slide `status` para cada.
   title: Portal do cliente
   health: risco
   progress: 65
-  highlight: Login novo em homologação
+  highlight: Login novo em teste com usuários
   done: [Tela de login, { text: Integração com o cadastro, owner: Ana }]
   doing: [Recuperação de senha]
-  blocked: [{ text: Liberação de firewall, owner: Infra, due: 30/09 }]
-  risks: [Prazo de HOM apertado]
-  upcoming: [Homologar com o negócio]
+  blocked: [{ text: Aprovação do texto de privacidade, owner: Jurídico, due: 30/09 }]
+  risks: [Prazo do teste apertado]
+  upcoming: [Teste com 20 usuários]
   shots: [{ image: imagens/login.png, caption: Nova tela de login }]
 ```
 
+### Cartão que vira e botão + (interatividade de infográfico)
+
+Cartão com `flip` gira no clique e mostra o verso: `flip: "texto"` ou `flip: { title: "Clique, descubra", text: "…" }` (ou `flipTitle`). (Não confunda com `back`, o botão Voltar da navegação.) Um ícone de girar no canto avisa que vira; Enter/Espaço também viram; sair do slide desvira. Use para a ideia principal na frente e o detalhe, o exemplo ou a pista no verso — a plateia descobre explorando. No PDF e no PPTX sai a frente (ponha o verso nas notas se ele precisar aparecer impresso).
+
+```yaml
+- layout: cards
+  title: Três movimentos
+  items:
+    - { icon: clock, title: Visualizar ideias, flip: "Desenhe antes de escrever." }
+    - { icon: bar-chart-3, title: Ativar a experiência, flip: { title: "Clique, descubra", text: "Os detalhes ficam para quem explora." } }
+```
+
+O botão + (`more` no marco da linha do tempo, ou o elemento `pop` em qualquer lugar) faz o mesmo papel para pontos soltos: o detalhe fica guardado até alguém clicar.
+
 ## Elementos (dentro de `content`, `side`, `add`, `figure`, `elements`…)
 
 Todo elemento aceita: `step` (clique em que aparece), `exit` (clique em que some), `anim` (`up` padrão, `fade`, `pop`, `left`, `right`, `down`, `zoom`, `none`), `w`, `h`, `flex`, `color`, `bg`, `align`, `pad`, `card: true|hi`, `class`, `style` e, no `canvas`, `x`, `y`.
@@ -498,6 +482,7 @@ Todo elemento aceita: `step` (clique em que aparece), `exit` (clique em que some
 | pontos | `{ points: fone }` ou `{ points: { de: fone, para: mic, legenda: "Ouvindo", legendaPara: "Agindo" } }` — ícone desenhado com luzinhas que viajam de uma forma a outra no clique (só no HTML; PPTX/PDF usam a inicial). Formas: `fone`, `mic`, `doc`, `planilha`, `busca`, `chat` |
 | forma | `{ shape: rect|rounded|circle|pill|line|triangle|diamond|hexagon|star|arrow|chevron|bubble, fill: hi, stroke: fg, strokeWidth, w, h, content }` (circle vira elipse se w ≠ h; triangle…bubble são desenhos com preenchimento e contorno) |
 | selo | `{ badge: "NOVO" }` |
+| botão + com balão | `{ pop: { title: "Planejar", text: "Estruture antes de desenhar.", side: above }, x: 1400, y: 300 }` (atalho: `{ pop: "texto" }`) — botão redondo com +; o clique abre um balãozinho com título e texto e escurece o resto do slide; clicar de novo, fora ou trocar de slide fecha. `side`: `above` (padrão), `below`, `left`, `right`. Bom em cima de mapa, foto ou diagrama (ponto a explorar); fechado no PDF e no PPTX |
 | aviso | `{ aviso: { tipo: dica, titulo: "Dica", texto: "…" } }` — tipos: `importante`, `atencao`, `dica`, `perigo` (atalho: `{ aviso: "texto" }` vira dica). Caixa com ícone e cor do tema para o que não pode passar batido; slide denso fecha com 1 takeaway em ==destaque== mais um aviso quando couber |
 | vídeo | `{ video: "https://…", label: "Assistir" }` · loop silencioso de fundo/detalhe: `{ video: cena.mp4, loop: true, poster: capa.jpg }` (repete sozinho, sem controles; PPTX/PDF usam o `poster` ou o primeiro quadro) |
 | HTML livre | `{ html: "<div>…</div>" }` |
@@ -564,8 +549,8 @@ Linhas que começam com PALAVRAS EM MAIÚSCULAS seguidas de `:` viram etiquetas
 
 Como no PowerPoint, são duas escolhas independentes:
 
-- **Tema** (`theme`): fontes, raio das bordas, textura e uma **pele** própria que rearruma capa, seção e encerramento, muda o jeito dos slides de conteúdo (título, cartões, marcadores da lista, citação, número grande, frase) e põe ornamentos (`sinal`: faixa zebrada e selo no chapéu; `editorial`: fios e capa centralizada; `noite`: moldura fina; `bauhaus`: círculo, quadrado e triângulo; `terminal`: janela com barra e prompt; `jornal`: fios de jornal e manchete sublinhada; `rabisco`: fitas adesivas e títulos inclinados; `oceano`: ondas e chapéu em pílula; `pop`: adesivos e sombra chapada; `aurora`: brilhos e traço em gradiente; `prata`: limpo e centralizado; `relevo`: ficção científica sóbria (sala de controle de filme, sem néon): grafite profundo, curvas de nível ao fundo, cantoneiras de mira, título leve embaixo à esquerda, rótulos técnicos em monoespaçada; combina com ilustração 3D realista (terreno, cidade, água) e gráfico 3D (`science` com superfície); `arcade`: videogame e fliperama, tela de tubo com linhas de varredura, neon, título em pixel no meio e chão de tijolos de jogo de plataforma; `aluminio`: prata metálico de lançamento de aparelho premium, título cromado embaixo à esquerda e um disco de metal polido; `manual` e `manual-noite`: documentação técnica, sem ornamento, código e texto corrido legíveis — o par claro/escuro do mesmo arranjo, para material de consulta, tutorial e apostila: `manual` imprime bem, `manual-noite` descansa a vista). Nos slides de conteúdo: `sinal` barra de aviso e placas; `editorial` fios finos e citação centralizada; `noite` tudo centralizado e cartões vazados; `bauhaus` faixas de cor primária e círculos; `terminal` título como comando e cartões-janela; `jornal` fios duplos e colunas; `oceano` cartões flutuando e balões; `pop` contorno grosso e sombra dura; `prata` centralizado e sem caixa; `aluminio` cartões de alumínio com chanfro de luz; `relevo` painéis de vidro fosco com traço gelo; `arcade` cartões de 8 bits com borda de pixel e sombra dura; `rabisco` tracejados e números circulados; `aurora` vidro com brilho. Trocar o tema já muda o arranjo: não reescreva slides só para "combinar" com o tema.
-- **Paleta** (`palette`): só as cores, em qualquer tema. `tinta`, `floresta`, `mar`, `entardecer`, `lavanda`, `grafite`, `neon`, `areia`, `cereja`, `corporativo`, `luzquente`, ou as suas: `palette: { paper: "F4F1EA", ink: "161616", accent: "D7263D", alert: "1B998B" }`. Os quatro tons saem dessas quatro cores, com contraste garantido. A paleta troca também o fundo: em tema escuro por natureza (`relevo`, `arcade`, `aurora`, `noite`, `terminal`), uma paleta de papel claro (`safira`, `corporativo`, `tinta`…) deixa o tema claro; para manter o visual escuro que o pedido quer, não ponha paleta (ou use uma de papel escuro, como `neon`).
+- **Tema** (`theme`): fontes, raio das bordas, textura e uma **pele** própria que rearruma capa, seção e encerramento, muda o jeito dos slides de conteúdo (título, cartões, marcadores da lista, citação, número grande, frase) e põe ornamentos (`sinal`: faixa zebrada e selo no chapéu; `editorial`: fios e capa centralizada; `noite`: moldura fina; `bauhaus`: círculo, quadrado e triângulo; `terminal`: janela com barra e prompt; `jornal`: fios de jornal e manchete sublinhada; `rabisco`: fitas adesivas e títulos inclinados; `oceano`: ondas e chapéu em pílula; `pop`: adesivos e sombra chapada; `aurora`: brilhos e traço em gradiente; `prata`: limpo e centralizado; `relevo`: ficção científica sóbria (sala de controle de filme, sem néon): grafite profundo, curvas de nível ao fundo, cantoneiras de mira, título leve embaixo à esquerda, rótulos técnicos em monoespaçada; combina com ilustração 3D realista (terreno, cidade, água) e gráfico 3D (`science` com superfície); `arcade`: videogame e fliperama, tela de tubo com linhas de varredura, neon, título em pixel no meio e chão de tijolos de jogo de plataforma; `aluminio`: prata metálico de lançamento de aparelho premium, título cromado embaixo à esquerda e um disco de metal polido; `wine`: o `musgo` em vinho (mesmo arranjo, fontes, faixa e rede na capa): fundo vinho quase preto, vermelho-rosado e rosé, com o vermelho forte só no detalhe; `caderno`: visual thinking em papel claro — título em letra de mão alta (Amatic SC) com traço de lápis, chapéu coral em serifada (Gelasio), frase em lilás, rabiscos de ícones em pastel nos cantos (lupa, ampulheta, engrenagem, lápis, chave, lâmpada); `lousa`: quadro-negro verde com giz — título em giz amarelo (Cabin Sketch) com traço laranja, linha de giz sob o título, poeira e marcas de giz apagado, lâmpada e lápis de giz na capa; `cartaz`: cartaz de protesto em papel cinza com grão — condensada pesada (Bebas Neue) em faixa vermelha torta, chapéu como etiqueta amarela, moldura preta grossa na capa, número da seção num disco amarelo; `infografico`: dados chapados — capa azul com chão verde e nuvem, títulos em maiúsculas, chapéu numa tarja verde, números enormes em condensada; `musgo`: laboratório noturno de bom gosto (verde-musgo quase preto, âmbar e sálvia, serifada Fraunces com o destaque do título em âmbar itálico, rótulos em IBM Plex Mono com fio âmbar, texto em Space Grotesk): grade de pontos que some nas bordas e luz âmbar na capa, seção como separador com o número entre fios na linha do chapéu e o título grande embaixo, e a faixa que corre no pé da capa com os títulos das seções (`ticker`); combina com o terminal de cenas (`motion: {type: console}`) na figura da capa ou num `canvas`; `manual` e `manual-noite`: documentação técnica, sem ornamento, código e texto corrido legíveis — o par claro/escuro do mesmo arranjo, para material de consulta, tutorial e apostila: `manual` imprime bem, `manual-noite` descansa a vista). Nos slides de conteúdo: `sinal` barra de aviso e placas; `editorial` fios finos e citação centralizada; `noite` tudo centralizado e cartões vazados; `bauhaus` faixas de cor primária e círculos; `terminal` título como comando e cartões-janela; `jornal` fios duplos e colunas; `oceano` cartões flutuando e balões; `pop` contorno grosso e sombra dura; `prata` centralizado e sem caixa; `aluminio` cartões de alumínio com chanfro de luz; `relevo` painéis de vidro fosco com traço gelo; `arcade` cartões de 8 bits com borda de pixel e sombra dura; `rabisco` tracejados e números circulados; `aurora` vidro com brilho; `caderno` cartões brancos com moldura grossa pastel (menta, lilás, amarelo, coral) e marcador amarelo contornado; `lousa` cartões contornados a giz com borda torta e marcadores em pingo de giz; `cartaz` cartões brancos girados como fotos coladas, números de lista em etiqueta e destaque em vermelho; `infografico` cartões com a faixa da cor do grupo, números em cartões coloridos e números de lista em círculos coloridos; `musgo`/`wine` cartões vazados que sobem no mouse, números em monoespaçada âmbar, marcador em losango, código em janela com três bolinhas e botões âmbar. Trocar o tema já muda o arranjo: não reescreva slides só para "combinar" com o tema.
+- **Paleta** (`palette`): só as cores, em qualquer tema. `tinta`, `floresta`, `mar`, `entardecer`, `lavanda`, `grafite`, `neon`, `areia`, `cereja`, `corporativo`, `luzquente`, ou as suas: `palette: { paper: "F4F1EA", ink: "161616", accent: "D7263D", alert: "1B998B" }`. Os quatro tons saem dessas quatro cores, com contraste garantido. A paleta troca também o fundo: em tema escuro por natureza (`relevo`, `arcade`, `aurora`, `noite`, `terminal`, `musgo`, `wine`, `lousa`), uma paleta de papel claro (`safira`, `corporativo`, `tinta`…) deixa o tema claro; para manter o visual escuro que o pedido quer, não ponha paleta (ou use uma de papel escuro, como `neon`).
 - **Paletas de família** (para identidade de marca sem cansar a vista): a cor forte da marca fica só no detalhe (`alert`, a ênfase pontual) e a página trabalha com os parentes mais agradáveis dela (`accent` e `family`). `rubi` (rosas, magenta e vinho; vermelho só no detalhe), `ametista` (roxos e lilases), `tangerina` (laranja com azul-marinho), `safira` (azuis com um toque âmbar), `esmeralda` (verdes). Na sua: `palette: { paper: "FFFFFF", ink: "3B2B33", accent: "B83A6E", alert: "CC092F", family: ["F9DCE5", "EFA3BC", "D9668F", "7E2349"] }` (de 2 a 8 parentes). `family` pinta as séries extras dos gráficos e os grupos e ramos dos diagramas. Pedido de "cores da empresa X": monte uma paleta de família assim, com a cor forte em `alert`. Para clima futurista de bom gosto (luz quente de prédios e shows de drones, nunca neon barato): `luzquente` — brancos quentes e âmbar que funcionam no claro e, no `tone: dark`, viram HUD âmbar sobre carvão quente.
 
 - **Identidade** (`identity: trabalho`, no deck): as fontes da empresa da pessoa (e a paleta preferida), configuradas só no computador dela (`~/.sagadeck/identidades.yaml`; no Studio, aba Design, grupo Identidade). Corpo, rótulos e código sempre na fonte da empresa; títulos também, menos nos temas com personalidade (`rabisco`, `pop`, `terminal`, `jornal`, `bauhaus`), que mantêm o título deles. A paleta da identidade vale quando o deck não escolheu outra. Nunca invente o nome de uma identidade: use só a que a pessoa pedir ou a que o deck já tem; numa máquina sem ela, a apresentação sai com as fontes do tema.
@@ -626,25 +611,20 @@ Sagadeck.widget("contador", {
 ```
 No YAML: `widgets: [widgets/contador.js]` e `{ widget: contador, rotulo: "Votos" }`. No PowerPoint o widget vira uma imagem do estado final.
 
-## Texto no cenário (`scenography`)
-
-Composição estática: o texto permanece editável, integrado a planos, luz e profundidade. `scene`: `stage` (letras monumentais atrás de uma escultura), `floor` (texto no chão), `signs` (placa em perspectiva), `terminal` (terminal hacker), `cafe` (lousa de café com letreiro neon), `travel` (cartão de embarque), `ticker` (pregão com cotações e candles), `marquee` (letreiro de cinema com lâmpadas), `blueprint` (planta técnica), `magazine` (capa de revista), `orbit` (planeta e estrelas), `synthwave` (neon anos 80) ou `gallery` (parede de galeria). Cada uma tem um tamanho de título padrão; `titleSize` vence. Campos: `title` (frase curta, quebra de linha permitida), `kicker`, `subtitle`, `caption`, `titleSize`, `image` (fundo opcional), `imageOpacity` (transparência do fundo, de 0 a 1; padrão 0.85), `foreground` (recorte PNG transparente colocado à frente das letras). Um fundo arbitrário não é segmentado automaticamente: para oclusão de uma pessoa, forneça o recorte em `foreground`.
-
-Demonstração com todas: biblioteca, Nova, "Exemplo: texto no cenário".
-
-```yaml
-- layout: scenography
-  scene: floor
-  title: "NOVOS\nCAMINHOS"
-  kicker: APRENDER PARA TRANSFORMAR
-  caption: WORKSHOP / BRIDGE
-  deco: none
-```
-
 ## Projeto: a pasta da apresentação
 
 No Studio, a pasta do deck é um projeto (aba **Arquivos**, à esquerda): o `.yaml`, `imagens/`, `contexto/` (anexos, prints colados, planilhas, anotações `.md`) e `.sagadeck/` (a conversa do chat, o cache e a lixeira do projeto, do próprio Studio). O texto do que está em `contexto/` chega a você junto do pedido, como material anexado (com o caminho, ex.: `contexto/vendas.csv`): use os números e fatos de lá. Uma planilha de `contexto/` pode alimentar um gráfico com `csv: contexto/vendas.csv` (CSV) ou pela sugestão de gráficos da planilha no Studio (que grava `from:`).
 
+## Exportação pelo Studio
+
+Arquivo › Baixar PowerPoint, PDF, roteiro, material de estudo ou Baixar tudo inicia a geração **no servidor do
+Studio** (na própria máquina no modo local). O painel **Exportações** mostra a etapa, o slide atual, o tempo
+decorrido e **Pronto para baixar**, ou a falha. Ele também acompanha os downloads pelo menu do cartão da biblioteca.
+A geração continua ao fechar/recarregar a aba; ao voltar ao editor ou à biblioteca, o arquivo pode ser baixado
+pela mesma lista. Guarda as dez exportações mais recentes da pessoa, por até 24 h enquanto o Studio estiver ligado.
+Exportar a demo em prévia não cria uma cópia pessoal. Não há aviso por email. Ao orientar a pessoa a obter o PPTX,
+indique o menu e o painel; só afirme que o arquivo foi gerado quando houver resultado real de exportação.
+
 ## Apresentação importada de PowerPoint
 
 Um `.pptx` importado (Biblioteca › Importar apresentação, ou `sagadeck importar arquivo.pptx`) chega **fiel ao original**: cada slide é um `canvas` com os elementos na mesma posição, e o deck tem `import: { from, slides, fonts, snapshots }` e `footer: false` (o original tem o próprio rodapé). Cada slide traz `original: { slide: 7, image: original/slide-07.png }` (a foto do slide original, quando o PowerPoint ou o LibreOffice estavam disponíveis) e a pasta `original/` guarda a cópia do arquivo. Elementos que só aparecem em slides importados:
@@ -696,28 +676,36 @@ escola, cinema…) e qualquer traçado ou área (rede, trajeto, bairro, área de
       legend: mil m³
 ```
 
+- `geojson:` também aceita o GeoJSON escrito no próprio slide (FeatureCollection, Feature ou só a geometria), para um
+  desenho pequeno; dados de verdade ficam num arquivo do projeto. Nunca invente o traçado de algo real.
 - `points:` também aceita a lista no próprio slide: `[{ nome: Centro, lat: -23.55, lon: -46.63, status: ativo }]`.
   Uma coluna só com "lat, lon" vale (`coordenadas`, `posicao`). Use ponto ou vírgula decimal; nunca invente
   coordenadas: elas vêm da planilha, do arquivo ou de uma busca. Linha sem posição válida fica de fora (o fiscal avisa).
 - `color:` aceita também uma cor fixa (`s1`, `em`, `hi`, `alert`, `#1F6FB2`). `step` (número) diz em que clique a
   camada aparece; `view` da camada (`fit` ou `{ center: [lat, lon], zoom }`) leva a câmera até ela nesse clique.
 - `view:` do slide fixa o enquadramento (`{ center: [-23.55, -46.63], zoom: 13 }`); sem ele, o mapa enquadra os dados.
+- `basemap: claro` e `escuro` usam fundos vetoriais do OpenFreeMap, sem chave: o mar tem cor própria e a fronteira
+  marítima não aparece, preservando o litoral e as divisas terrestres. `ruas` continua no OpenStreetMap. Em
+  **Configurar mapa**, os fundos claro e escuro podem usar outro estilo vetorial (JSON) ou tiles com `{z}/{x}/{y}`.
 - Planilha só com endereço (sem latitude e longitude): no Studio, a planilha aberta (aba Arquivos) tem **Achar
   coordenadas**, que pergunta antes de mandar os endereços para o serviço de fora e grava as colunas `latitude` e
   `longitude`; **Pôr no mapa** cria o slide a partir dela. Sugira esses botões em vez de inventar coordenadas.
   Com um slide de mapa selecionado, a planilha fica ao lado dele: clicar num ponto seleciona a linha e selecionar
   uma linha abre o cartão do ponto. O enquadramento automático deixa os pontos livres da legenda.
-- **Editar no mapa** (botão na prévia do slide, no Studio): a pessoa clica para criar pontos (vão para a planilha da
-  camada, com o endereço preenchido), desenha linhas e áreas (vão para o GeoJSON da camada; "Seguir as ruas" liga os
-  cliques pelo serviço de rotas), arrasta pontos e vértices, divide e junta linhas, mede com a régua e grava o
-  enquadramento ("Usar esta vista"). Quando a pessoa quiser marcar algo à mão no mapa, indique esse botão.
+- **Editar mapa** (botão na prévia do slide, ou dois cliques no mapa, no Studio): abre uma tela só do mapa. À esquerda
+  as camadas; no meio o mapa grande com Selecionar, Ponto, Linha, Área e Régua; à direita as propriedades do que está
+  selecionado (os campos de um ponto, linha, área ou região, com o que cada um faz no mapa) ou, sem seleção, da camada
+  (cor, tamanho, rótulo, cartão, quando aparece) e do mapa (fundo, enquadramento). Pontos novos vão para a planilha da
+  camada, com o endereço preenchido, ou para a lista do slide; linhas e áreas para o GeoJSON da camada ou para o slide
+  ("Seguir as ruas" liga os cliques pelo serviço de rotas). Arrasta pontos e vértices, divide e junta linhas e grava o
+  enquadramento ("Usar a vista de agora"). Quando a pessoa quiser marcar ou corrigir algo à mão no mapa, indique esse botão.
 - **Dados de fora** (lugares de um tipo, linhas como ciclovias, o contorno de um lugar com nome, uma lista da web,
   coordenadas da planilha da pessoa): peça com o bloco `mapa:` (as regras vêm no prompt); o Studio busca, grava os
   arquivos em `contexto/` com a fonte de cada linha e te devolve o que gravou. Nunca invente coordenada nem contorno.
 - **Análises** (o mais próximo e a distância, quantos num raio ou numa área, faixa em volta de uma linha, onde
   instalar o próximo, rota com tempo, área alcançável em X minutos, rastro de GPS encaixado nas ruas): também pelo
   bloco `mapa:`; o Studio calcula e devolve os números. Nunca calcule distância, contagem ou tempo de cabeça.
-- Serviços (Configurar mapa, opcional): sem chave, tudo funciona com os serviços públicos do OpenStreetMap; a chave
+- Serviços (Configurar mapa, opcional): sem chave, os fundos usam OpenStreetMap/OpenFreeMap e os dados vêm dos serviços públicos do OpenStreetMap; a chave
   gratuita do OpenRouteService só acrescenta rotas a pé/de carro/de bicicleta confiáveis e área alcançável.
 - Ao apresentar: clicar num ponto, linha ou área abre o cartão com os dados; clicar na legenda liga e desliga uma
   categoria ou a camada inteira. O fundo vem da internet; sem rede, aparece um aviso e as camadas continuam. No PDF e
@@ -875,9 +863,9 @@ Os três aceitam `kicker`, `title` e `items: [{title, text, value, icon, code, f
 - `ribbon`: os mesmos campos em cápsulas arredondadas, centralizadas. Para serviços, etapas ou pilares.
 - `dossier`: página de consulta, compacta: letra menor e blocos de código (`code`) com quebra de linha. Para material de referência (documentação, payloads, instruções); não imponha a ela o limite de palavras de uma palestra quando a pessoa pede material denso.
 
-No Studio, todo tipo de slide (página de consulta, grade adaptável, diagrama, tipografia cinética, status semanal…) sai da galeria **Novo slide** (Início › Escolher tipo ou Inserir › Novo slide), com busca e categorias; **Layout** troca o formato do slide atual e leva o conteúdo junto. A aba **Avançado** muda a densidade do slide atual: **Padrão**, **Compacta** ou **Mais conteúdo**. A densidade reduz espaçamentos e tamanhos sem apagar o conteúdo; para explicações longas com seções, prefira `dossier`.
+No Studio, todo tipo de slide (página de consulta, grade adaptável, diagrama, status semanal…) sai da galeria **Novo slide** (Início › Escolher tipo ou Inserir › Novo slide), com busca e categorias; **Layout** troca o formato do slide atual e leva o conteúdo junto. A aba **Avançado** muda a densidade do slide atual: **Padrão**, **Compacta** ou **Mais conteúdo**. A densidade reduz espaçamentos e tamanhos sem apagar o conteúdo; para explicações longas com seções, prefira `dossier`.
 
-Para apresentações completas de exemplo, abra **Abrir demos completos** na aba Avançado (ou **Nova → Modelo pronto → Recursos avançados** na biblioteca). Esse demo reúne código denso, página de consulta, grade com oito itens, aviso de segurança, diagrama e tipografia cinética.
+Para apresentações completas de exemplo, abra **Abrir demos completos** na aba Avançado (ou **Demos oficiais** na biblioteca): uma demo por assunto — mapas, programação (código denso, página de consulta, Git a dois, diagramas), APIs com curl, aula de hidráulica, aula de algoritmos e diagramas vivos.
 
 Modelos, estilos, demos e exemplos de **Modelo pronto** (na vitrine, "Visuais para começar" e "Recursos do SagaDeck", com a capa de cada um) abrem em **prévia**: dá para navegar, apresentar e experimentar sem criar arquivo. A primeira mudança (ou o botão **Usar como base**) cria uma cópia na biblioteca, no tópico de onde veio (padrão `Modelos`), com as imagens; o modelo de fábrica nunca muda.
 
@@ -901,13 +889,13 @@ As formas clássicas de slide de consultoria, desenhadas na hora para a quantida
 ```yaml
 - layout: infographic
   shape: metro
-  title: Os caminhos de um projeto na Bridge
-  center: { title: Bridge, text: Um pedido, vários caminhos }
+  title: Os canais de uma loja
+  center: { title: Loja, text: Um pedido, vários caminhos }
   items:
-    - { title: Lote, text: Databricks chama a Bridge de madrugada, icon: moon }
-    - { title: Teams, text: Copilot Studio + Power Automate, icon: message-square }
-    - { title: App próprio, text: Wave, arquitetura, infra e rede, icon: app-window }
-    - { title: SaaS externo, text: Túnel mTLS e serviço extra, icon: globe }
+    - { title: Balcão, text: Atendimento na hora, icon: store }
+    - { title: App, text: Pede e retira na loja, icon: smartphone }
+    - { title: Site, text: Entrega em casa, icon: truck }
+    - { title: Parceiros, text: Vitrine em outros sites, icon: globe }
 ```
 
 Infográfico × diagrama: infográfico é para itens paralelos em volta de uma ideia (sem fluxo entre eles, ou com o fluxo simples de `trilhas`) e para **ciclos** (`ciclo`: num fluxograma, a volta ao começo vira setas longas cruzando o desenho); `diagram` (Mermaid) é para processo com decisões, sequência entre sistemas, arquitetura e UML.
@@ -918,7 +906,7 @@ Para processo, fluxo, arquitetura, UML, sequência entre sistemas, ciclo de vida
 
 Direção automática: em fluxogramas o sagadeck desenha deitado (`LR`) e em pé (`TB`) e usa o que deixa a letra maior na área do slide. Escreva a direção que fizer sentido; `autoDirection: false` no slide mantém a do código (use só se a pessoa pedir uma direção).
 
-Tipos (primeira linha do código): `flowchart LR` / `flowchart TB` (fluxo, processo, arquitetura), `sequenceDiagram` (quem chama quem, pedido e resposta), `stateDiagram-v2` (ciclo de vida: DEV → HOM → PROD), `classDiagram` e `erDiagram` (UML e modelo de dados), `journey` (jornada com notas), `mindmap` (mapa de ideias, sopa de letrinhas organizada), `timeline`, `block-beta` (blocos de arquitetura), `gantt`, `quadrantChart`, `gitGraph` (branches e commits do Git: `commit`, `branch nome`, `checkout nome`, `merge nome`, `cherry-pick id: "…"`; é o diagrama certo para "linhas de commits", rebase × merge e fluxo de branches).
+Tipos (primeira linha do código): `flowchart LR` / `flowchart TB` (fluxo, processo, arquitetura), `sequenceDiagram` (quem chama quem, pedido e resposta), `stateDiagram-v2` (ciclo de vida: rascunho → revisão → publicado), `classDiagram` e `erDiagram` (UML e modelo de dados), `journey` (jornada com notas), `mindmap` (mapa de ideias, sopa de letrinhas organizada), `timeline`, `block-beta` (blocos de arquitetura), `gantt`, `quadrantChart`, `gitGraph` (branches e commits do Git: `commit`, `branch nome`, `checkout nome`, `merge nome`, `cherry-pick id: "…"`; é o diagrama certo para "linhas de commits", rebase × merge e fluxo de branches).
 
 ```yaml
 - layout: diagram
@@ -943,26 +931,26 @@ Setas no `flowchart`: `-->` normal, `-.->` pontilhada (opcional, eventual), `==>
 
 ```yaml
 - layout: diagram
-  kicker: Governança
-  title: Do pedido de acesso à ==produção==
-  caption: Experimento é prorrogável; em HOM e PROD as chaves ficam no Key Vault
+  kicker: Processo
+  title: Do pedido à ==entrega==
+  caption: Sob medida leva mais tempo; o fornecedor entrega o material da montagem
   mermaid: |
     flowchart LR
-      A([:key-round: Pedido de acesso]):::hi --> B{Experimento ou projeto?}
-      subgraph EXP[Experimento]
-        C[:flask-conical: 30 dias, dados fictícios]
+      A([:shopping-cart: Pedido]):::hi --> B{Tem em estoque?}
+      subgraph EST[Estoque]
+        C[:package: Separar e embalar]
       end
-      subgraph PRJ[Projeto]
-        D[DEV 30 dias] ==> E[HOM 30 dias] ==> F[:rocket: PROD]:::em
+      subgraph PRD[Sob medida]
+        D[Cortar] ==> E[Montar] ==> F[:truck: Enviar]:::em
       end
-      B -->|experimento| C
-      B -->|projeto| D
-      C -.->|deu certo| D
-      K[(Key Vault via RITM)]:::suave -.- E
+      B -->|sim| C
+      B -->|não| D
+      C -.->|pronto| F
+      K[(Fornecedor)]:::suave -.- E
 ```
 
 Regras de bom desenho (siga sempre):
-- Agrupe com `subgraph` o que é da mesma área, time, camada ou fase (Front-end, Bridge, Segurança; DEV, HOM, PROD): é o que dá cor e organização ao desenho. 2 a 5 grupos por slide.
+- Agrupe com `subgraph` o que é da mesma área, time, camada ou fase (Front-end, Back-end, Segurança; rascunho, revisão, publicado): é o que dá cor e organização ao desenho. 2 a 5 grupos por slide.
 - Coisas de fora (usuário, sistema externo, banco de terceiros) com `:::suave`, fora dos grupos.
 - Rótulos curtos: 1 a 4 palavras por nó (detalhe vai em `caption`, nas `notes` ou em outro slide). Rótulo de seta com 1 a 3 palavras.
 - No máximo ~12 nós por slide. Processo maior: divida em slides (visão geral primeiro, depois um slide por fase) em vez de encolher tudo.
@@ -992,6 +980,8 @@ ficam na pasta `imagens/` da apresentação.
 
 ## Ajustes diretos no Studio
 
+No editor, **Assistente** fica por último à direita no cabeçalho do painel, separado de Formatar, Propriedades e Variáveis. Seu nome permanece visível ao usar qualquer opção. O editor abre no Assistente, respeitando quem fechou o painel; nesse caso, o atalho flutuante reabre o chat. Trocar de opção mantém a conversa e o rascunho.
+
 Em **Inserir → Neste slide**: Texto, Formas (menu com 12 desenhos: retângulo, arredondado, elipse, pílula, linha, triângulo, losango, hexágono, estrela, seta, chevron, balão), Imagem e Ícone adicionam elementos sem trocar o layout. Um clique em qualquer ponto de um objeto (texto, forma, imagem) o seleciona; clicar de novo no texto selecionado (ou duplo clique) escreve. Arrastar numa área vazia desenha um retângulo que seleciona vários; Shift+clique soma. Selecionados, dá para arrastar juntos, mover com as setas, redimensionar pela alça (um só) e usar a barra que flutua acima da seleção: tamanho e cor do texto, preenchimento da forma (`visualEdits.fill`), trazer para frente, enviar para trás (fica atrás dos outros objetos, nunca do fundo), excluir, alinhar (esquerda, centro, direita, em cima, meio, embaixo: vários entre si; um só, no slide), distribuir (3 ou mais, mesmo espaço), copiar e colar estilo (Ctrl+Alt+C / Ctrl+Alt+V), travar (o clique atravessa) e, numa imagem, trocar a imagem (`visualEdits.image`, com `fit: cover|contain` e `focus`: center, top, bottom, left, right, top left…). Ao arrastar, guias grudam nas bordas e no centro do slide e dos outros objetos (Alt solta). Na aba Propriedades, **Objetos do slide** lista tudo o que está no slide: seleciona até o travado, oculta/mostra e trava/destrava (`locked`; a decoração que veio do PowerPoint, `deco: true`, já vem travada). Tab/Shift+Tab passam de um objeto para outro; Escape solta. A aba **Propriedades** do painel lateral é o inspetor (como o Object Inspector): mostra só as categorias que fazem sentido para o que está selecionado (Posição e tamanho; Texto; Preenchimento e contorno; Aparência; Animação; Avançado) e, sempre, as do Slide e da Apresentação. Os ajustes de objeto ficam em `visualEdits` (`dx, dy, w, h, rotate, z, size, color, weight, italic, align, lineHeight, letterSpacing, uppercase, fill, stroke, strokeWidth, radius, opacity, shadow: suave|forte, step, anim, hidden, locked, image, fit, focus`); não os invente ao criar um deck. Delete/Backspace excluem o objeto selecionado (fica em `visualEdits` como `hidden`, recuperável); Ctrl+Z / Ctrl+Y desfazem e refazem qualquer mudança da apresentação (a da tela, a do formulário, a do assistente), com os botões ao lado do título. Duplo clique permite voltar a escrever. Os ajustes são persistidos em `visualEdits`, com chaves geradas pelo renderizador; não invente essas chaves ao criar um deck. Prefira alterar os campos semânticos. A exclusão visual usa `hidden` para preservar conteúdo recuperável. Mudanças estruturais grandes podem invalidar ajustes: remova `visualEdits` ao reconstruir um slide.
 
 `Arrumar layout` (aba Revisar) é local e baseado em regras: corrige sobreposição, margem, título comprido e texto que não coube, diz o que fez e se desfaz. `Revisar com IA` envia a imagem renderizada do slide ao modelo configurado e solicita melhorias; usa tokens. O status de IA abre Configurar IA (provedor, chave e modelos desta máquina). Um modelo sem visão é identificado na resposta; conectividade com `/models` não comprova que uma geração será aceita pelo provedor.
@@ -1124,6 +1114,20 @@ elements:
 
 Integre o movimento à direção de arte: geometria ligada a uma figura, pulsos numa linha de processo, detalhe que acompanha uma moldura ou tipografia, cores e escala da mesma composição. Não traduza “eco animado” em retângulos opacos soltos e repetidos no canto. Uma identidade tecnológica deve existir também nas cores, formas e hierarquia do slide; um widget não resolve uma página genérica. Use elementos `motion` posicionados em `add`/`canvas` quando uma integração específica pedir outro lugar/tamanho, mantendo conteúdo e controles livres. Estas são escolhas pelo briefing e assunto, não uma receita obrigatória para toda apresentação.
 
+`type: console` é a janela de terminal em cenas: barra com três bolinhas, legenda (`caption`) e contador (01/03); em cada cena o comando (`cmd`) é digitado letra a letra depois do prompt, e a saída (`out`, lista de linhas; a primeira em destaque, como o status de uma resposta) aparece linha a linha; segura a leitura (`hold`, segundos, padrão 3.2) e passa para a próxima cena, em ciclo. Bom para mostrar chamadas de API (`curl`) e suas respostas, ou comandos e resultados. Parado (movimento reduzido, `motion: none`, exportação), mostra a primeira cena completa. Aceita `typing` (segundos por letra, padrão 0.016), `speed`, `fontSize` (padrão 20) e as cores de sempre (fundo, texto, `accent` no prompt e no cursor, `secondary` na primeira linha da saída). É ilustração, não execução: para chamar a API de verdade, use o slide `api`.
+
+```yaml
+figure:
+  motion:
+    type: console
+    caption: contrato do agente — ao vivo
+    scenes:
+      - cmd: "curl -X POST /api/memorias -d '{\"texto\":\"usar pnpm\"}'"
+        out: ["201 Created", "{ \"id\": \"9f3a\" }"]
+      - cmd: "curl '/api/memorias?q=pnpm'"
+        out: ["200 OK · 4 ms", "{ \"total\": 0.74 }"]
+```
+
 `type: terminal` digita lentamente um roteiro fornecido em `lines: [linha, linha]` ou `code: texto`, com cursor e rolagem, sem executar o código. Aceita `typing` (segundos por caractere), `speed` e `fontSize` (10–40). Repete após uma pausa de leitura e pausa fora do slide. Para um painel legível de código ao lado de logs rápidos, combine terminal com requests, reservando área suficiente para ambos. O roteiro é do conteúdo solicitado, nunca uma API real inventada sem identificação de exemplo.
 
 ### Abertura com chat preciso e filme separado
@@ -1169,6 +1173,23 @@ No chat, `run.language: web` recebe `code` como JSON: `{"action":"search","query
 
 ## Diagnósticos e suporte
 
+**O que de IA funciona nesta máquina:** `sagadeck ia-check` (também `POST /api/ia/check` no Studio local e a ferramenta
+`sagadeck_ia_check` do MCP). Cada recurso com uma chamada de verdade ao provedor configurado, todos ao mesmo tempo, e
+cada resultado sai assim que chega:
+- **texto**: pergunta curta com resposta conhecida;
+- **visão**: uma imagem com duas faixas de cor sorteadas; o modelo precisa dizer as cores na ordem (modelo que não
+  aceita imagem falha, em vez de responder sem ver);
+- **imagem**: gera uma imagem pequena e confere que voltou PNG, JPEG, WebP ou GIF (grava o arquivo e diz onde);
+- **pesquisa**: o modelo de pesquisa precisa dizer a data de hoje;
+- **vídeo**: sem `--video-real`, só confere o modelo no catálogo, de graça, e sai `SEM PROVA`; com `--video-real`,
+  gera o clipe mais curto e leve que o modelo aceita, acompanha, baixa e confere o MP4 (cobrado; leva minutos).
+
+`--rapido` pula imagem e vídeo; `--so=texto,visao` escolhe; `--json` para máquina (o andamento vai para o stderr); sai
+com código 1 se algo falhou. O vídeo usa a mesma camada da IA quando há um **modelo de vídeo** em Configurar IA
+(endereço, chave e adaptador de lá); sem ele, o OpenRouter com `SAGADECK_VIDEO_KEY` ou `OPENROUTER_API_KEY`.
+`SAGADECK_VIDEO_URL` e `SAGADECK_VIDEO_MODEL` trocam endereço e modelo. Sem catálogo no provedor, o vídeo é gerado
+assim mesmo (o catálogo só valida quando existe).
+
 Falhas do Studio e da IA devem explicar a operação, distinguir causa comprovada de causa desconhecida e informar código + referência para suporte. Motivos informados pelo provedor são preservados, inclusive em streaming: limite de tokens não é timeout. Nunca atribua uma falha a tokens sem finish_reason: length. Visão de documentos usa SAGADECK_DOCUMENT_VISION_TOKENS (padrão 5000 por página, entre 256 e 32000); quando o provedor informa limite, tenta uma vez com o dobro, até 32000. SAGADECK_LLM_TIMEOUT controla espera sem resposta (padrão 180 s); SAGADECK_LLM_FIRST_TIMEOUT controla primeira resposta em streaming (padrão 600 s). Nenhuma resposta parcial é apresentada como extração completa. Cancelamento é uma ação normal, sem aviso de erro de suporte.
 
 ### Prioridade das figuras e Word legado

package/package.json

@@ -1,15 +1,32 @@
 {
   "name": "sagadeck",
-  "version": "1.8.0",
+  "version": "1.9.0",
   "description": "Gerador de apresentações: YAML -> HTML animado + PowerPoint editável, com temas e figuras geradas na hora.",
   "type": "module",
   "bin": {
     "sagadeck": "bin/sagadeck.js"
   },
   "engines": {
-    "node": ">=18"
+    "node": ">=22.13.0"
   },
   "license": "MIT",
+  "homepage": "https://github.com/naruminho/sagadeck#readme",
+  "bugs": {
+    "url": "https://github.com/naruminho/sagadeck/issues"
+  },
+  "keywords": [
+    "apresentacoes",
+    "slides",
+    "presentation",
+    "pptx",
+    "powerpoint",
+    "pdf",
+    "yaml",
+    "llm",
+    "ai",
+    "generator",
+    "cli"
+  ],
   "dependencies": {
     "jszip": "^3.10.2",
     "katex": "^0.18.9",
@@ -21,19 +38,33 @@
     "qrcode-generator": "^2.0.4",
     "yaml": "^2.9.1"
   },
+  "overrides": {
+    "image-size": "^2.0.4"
+  },
   "devDependencies": {
     "@fontsource-variable/caveat": "^5.3.0",
+    "@fontsource-variable/fraunces": "^5.3.0",
     "@fontsource-variable/fredoka": "^5.3.0",
+    "@fontsource-variable/gelasio": "^5.3.0",
     "@fontsource-variable/inter": "^5.3.0",
+    "@fontsource-variable/montserrat": "^5.3.0",
     "@fontsource-variable/plus-jakarta-sans": "^5.3.0",
+    "@fontsource-variable/space-grotesk": "^5.3.0",
+    "@fontsource/amatic-sc": "^5.3.0",
+    "@fontsource/bebas-neue": "^5.3.0",
+    "@fontsource/cabin-sketch": "^5.3.0",
     "@fontsource/comic-neue": "^5.3.0",
+    "@fontsource/ibm-plex-mono": "^5.3.0",
+    "@fontsource/itim": "^5.3.0",
     "@fontsource/patrick-hand": "^5.3.0",
     "@fontsource/press-start-2p": "^5.3.0",
     "@fontsource/vt323": "^5.3.0",
+    "@maplibre/maplibre-gl-leaflet": "0.1.4",
     "@material-symbols/svg-400": "^0.47.5",
     "esbuild": "^0.28.2",
     "jsqr": "^1.4.0",
     "leaflet": "1.9.4",
+    "maplibre-gl": "6.13.0",
     "mermaid": "^11.17.2"
   },
   "scripts": {

package/src/ai/commands.js

@@ -11,7 +11,7 @@ import { spawn } from "node:child_process";
 import fs from "node:fs";
 import path from "node:path";
 import os from "node:os";
-import { videoOperation } from './video-generation.js';
+import { videoOperation, videoSetup } from './video-generation.js';
 import { webOperation } from './web-operation.js';
 
 // Registro de auditoria: cada comando pedido pela IA (aprovado, recusado ou executado), uma linha JSON em
@@ -69,7 +69,7 @@ export async function runCommand(request, { cwd, env = {}, mask = (s) => s, time
   }
   if(language==='video'){
     let args; try { args = typeof code === 'object' && code !== null ? code : JSON.parse(code); } catch(e) { return {language,exitCode:1,stdout:'',stderr:mask(`run.code precisa de JSON válido: ${e.message}`),timedOut:false}; }
-    try{return{language,exitCode:0,stdout:mask(JSON.stringify(await videoOperation(args,{cwd,key:env.SAGADECK_VIDEO_KEY||env.OPENROUTER_API_KEY||process.env.SAGADECK_VIDEO_KEY||process.env.OPENROUTER_API_KEY}))),stderr:'',timedOut:false};}
+    try{return{language,exitCode:0,stdout:mask(JSON.stringify(await videoOperation(args,{cwd,setup:videoSetup({env:{...process.env,...env}})}))),stderr:'',timedOut:false};}
     catch(e){return{language,exitCode:1,stdout:'',stderr:mask(e.message),timedOut:false};}
   }
   const win = process.platform === "win32";

package/src/ai/deck-ai.js

@@ -69,7 +69,7 @@ Siga ESTRITAMENTE a referência abaixo: use só layouts, elementos, campos e fig
 - ANTI-FEIJÃO-COM-ARROZ: varie os layouts de verdade; capa (cover) no início e encerramento (end) no fim quando fizer sentido. Regras duras: nunca 2 slides seguidos com o mesmo layout (salvo série intencional); em 6+ slides use 5+ layouts diferentes com 1 slide de impacto (headline, number, statement, full, image, question); no máximo 45% do deck em listas/cartões (cards, list, steps, stats, bento, agenda). Conteúdo manda no layout, não o contrário (ver o mapa em "Layouts válidos").
 - Slide denso (documentação, referência, números): feche com 1 takeaway em ==destaque== e use o elemento \`aviso\` (tipos: \`importante\`, \`atencao\`, \`dica\`, \`perigo\`) para o que não pode passar batido; grife ==palavras-chave== no texto corrido em vez de encher de negrito.
 - Escreva no idioma do pedido do usuário.
-- Layouts válidos (\`layout:\`): ${Object.keys(LAYOUTS).join(", ")}. Conteúdo → layout (use o que comunica, não o mais fácil): processo/fluxo/arquitetura/UML: layout \`diagram\` (Mermaid); itens em volta de uma ideia: layout \`infographic\`; gráfico: \`chart\` (fórmula/curva/3D: \`science\`); datas: \`calendar\` (grade) ou \`timeline\` (marcos); página densa estilo revista: \`poster\`; jornada+problema+solução+painel: \`onepage\`; status semanal: \`status\`; definição: \`definition\`; citação: \`quote\`; número gigante: \`number\`; KPIs: \`stats\`; A×B: \`compare\`; 2×2: \`matrix\`; pergunta à plateia: \`question\`/\`poll\`; código: \`code\`, guiado: \`codewalk\`; screenshot com foco: \`spotlight\`; API ao vivo: \`api\`; conta/calculadora: \`solution\`/\`calc\`; algoritmo animado: \`algo\`; redes/rotas: \`graphlab\`; código executável pelo aluno: \`codelab\`; experimento: \`playground\`; decisão: \`decisionlab\`; duelo/terminais/turnos: \`duel\`/\`terminals\`/\`turns\`; carrossel: \`carousel\`; funil/pirâmide/agenda: \`funnel\`/\`pyramid\`/\`agenda\`; grade/consulta: \`bento\`/\`mosaic\`/\`ribbon\`/\`dossier\`; tipografia em cena: \`kinetic\`; texto no cenário: \`scenography\`; caminhos com volta ao mapa: \`hub\`+\`goto\`/\`back\`/\`next\`; manchete: \`headline\`; imagem total: \`full\`/\`image\`. Diagramas simples (\`diagram: loop/flow/venn…\`) e gráficos também existem como ELEMENTOS, dentro de figure/content/side.
+- Layouts válidos (\`layout:\`): ${Object.keys(LAYOUTS).join(", ")}. Conteúdo → layout (use o que comunica, não o mais fácil): processo/fluxo/arquitetura/UML: layout \`diagram\` (Mermaid); itens em volta de uma ideia: layout \`infographic\`; gráfico: \`chart\` (fórmula/curva/3D: \`science\`); datas: \`calendar\` (grade) ou \`timeline\` (marcos); página densa estilo revista: \`poster\`; jornada+problema+solução+painel: \`onepage\`; status semanal: \`status\`; definição: \`definition\`; citação: \`quote\`; número gigante: \`number\`; KPIs: \`stats\`; A×B: \`compare\`; 2×2: \`matrix\`; pergunta à plateia: \`question\`/\`poll\`; código: \`code\`, guiado: \`codewalk\`; screenshot com foco: \`spotlight\`; API ao vivo: \`api\`; conta/calculadora: \`solution\`/\`calc\`; algoritmo animado: \`algo\`; redes/rotas: \`graphlab\`; código executável pelo aluno: \`codelab\`; experimento: \`playground\`; decisão: \`decisionlab\`; duelo/terminais/turnos: \`duel\`/\`terminals\`/\`turns\`; carrossel: \`carousel\`; funil/pirâmide/agenda: \`funnel\`/\`pyramid\`/\`agenda\`; grade/consulta: \`bento\`/\`mosaic\`/\`ribbon\`/\`dossier\`; caminhos com volta ao mapa: \`hub\`+\`goto\`/\`back\`/\`next\`; manchete: \`headline\`; imagem total: \`full\`/\`image\`. Diagramas simples (\`diagram: loop/flow/venn…\`) e gráficos também existem como ELEMENTOS, dentro de figure/content/side.
 - Temas disponíveis: ${themes}.
 - YAML: coloque entre aspas duplas todo texto que comece com marcação (\`**\`, \`*\`, \`==\`, \`^^\`, \`~~\`, \`[\`) ou que contenha ": ".
 - Em sequências inline ([{...}]): coloque entre aspas todo valor de texto com vírgula ("3,5 peixes por m³"). Sem aspas a vírgula parte o objeto e o dado sai truncado.