| name | mira-size-animator |
| description | Ajusta a percepção de tamanho das animações de um deck numa escala de 1 a 10, onde 3/10 é o tamanho que o mira-animator gera por padrão. Lê o marcador @MIRA:SIZE de cada animação, reporta o nível atual e escala a composição (raios, comprimentos, espaçamentos, fontes internas e glow dentro do SVG) para preencher mais o palco, sem mexer na altura do palco, sem quebrar o loop interno nem os gatilhos. Use SEMPRE que o usuário disser "/mira-size-animator", "aumentar o tamanho da animação", "as animações estão pequenas", "a animação ocupa pouco espaço", "deixa tudo em 6/10", "coloca as animações em 5/10", "qual o tamanho das animações", "percepção de tamanho", "escalar a animação", "diminuir a animação", "deixa esse slide maior", ou pedir para crescer ou encolher um slide específico ou o deck inteiro. |
Skill: Percepção de Tamanho das Animações
Esta skill regula o quanto cada animação D3 preenche o palco, numa escala de 1 a 10. Ela não cria animações novas e não muda a metáfora visual: ela apenas pega o que o mira-animator já gerou e ajusta a escala da composição para cima ou para baixo.
REGRA DE IDIOMA
Siga integralmente agents/_shared/idioma.md. Todo texto visível em português brasileiro com acentuação 100% correta. Proibido travessão (—): use vírgula ou dois-pontos.
Conceito: a escala 1 a 10
- O
mira-animator sempre gera a animação no nível 3/10 (pequena, com margem morta sobrando no palco). Esse é o ponto de partida.
- O número que o usuário passa é o nível-alvo absoluto, não um incremento. "Coloca em 6/10" significa subir de 3 para 6. "Deixa em 2/10" significa descer de 3 para 2.
- Nível alto (perto de 10) = composição enorme, ocupando quase todo o palco. Nível baixo (perto de 1) = composição tímida, com muita margem.
- Faixa válida: 1 a 10. Recuse 0 ou valores fora da faixa.
O marcador @MIRA:SIZE (fonte da verdade)
O nível atual de cada animação vive num comentário HTML, colado logo acima do palco da animação:
<div class="anim-stage" id="SLUG-stage">
<svg id="SLUG-svg" viewBox="0 0 1280 720" preserveAspectRatio="xMidYMid meet"></svg>
</div>
Regras do marcador:
- Um marcador por animação, sempre na linha imediatamente acima do
.anim-stage (ou do <div id="...-stage">) daquela animação.
- O número antes da barra é o nível atual. Esta skill lê esse número, escala a composição e reescreve o marcador com o novo nível.
- Animação sem marcador (deck antigo gerado antes desta convenção): trate como 3/10 e, ao tocá-la pela primeira vez, escreva o marcador.
- O marcador é a única memória do nível. É ele que garante que reexecutar a skill componha corretamente (3→6, depois 6→8) e seja reversível (8→3).
Onde estão as animações
O deck do tema fica em decks/<deck>/index.html ou slides/<tema>/index.html (o sistema usa os dois caminhos conforme o fluxo). Uma "animação" é todo card que tem um .anim-stage com <svg> D3. Se houver mais de um deck e o usuário não disser qual, pergunte qual deck antes de editar.
Dois modos de uso
Modo 1: Reportar (sem alvo)
Quando o usuário só aciona a skill ou pergunta o tamanho ("qual o tamanho das animações?", "/mira-size-animator"), sem dar um número:
- Localize o deck.
- Liste cada animação com seu nível atual (lendo o marcador, ou 3/10 se não houver).
- Apresente uma tabela curta: título do card → nível atual. Não edite nada.
Card 2 "O ciclo do agente" 4/10
Card 4 "SPEC no centro" 3/10
Card 7 "Escada da evolução" 3/10
Modo 2: Aplicar (com alvo)
Quando o usuário dá um nível-alvo ("deixa todas em 6/10", "esse slide em 7/10", "/mira-size-animator 5/10"):
O argumento aceita as duas formas: 5 ou 5/10 significam o mesmo nível-alvo 5. Parseie o número antes da barra. O alvo escala só o desenho dentro do SVG, partindo de 3/10. Nunca aumente o palco/canvas (.anim-stage), nem título, pílulas ou qualquer elemento fora do SVG.
- Resolva o escopo:
- Sem slide específico → todas as animações do deck.
- Com slide específico (número do card, título ou id do stage) → só aquela animação.
- Para cada animação no escopo, leia o nível atual no marcador (default 3).
- Calcule o fator de escala
k (ver fórmula abaixo) e aplique à composição.
- Reescreva o marcador com o nível-alvo.
- Reporte ao usuário: para cada card,
nível antigo → nível novo.
Da nível ao fator de escala
A escala é multiplicativa, com passo de +15% por nível e o nível 3 valendo 1,00 (o tamanho cru que o mira-animator gera). Use esta tabela de referência (escala absoluta em relação ao nível 3):
| Nível | Escala absoluta |
|---|
| 1 | 0,76 |
| 2 | 0,87 |
| 3 | 1,00 |
| 4 | 1,15 |
| 5 | 1,32 |
| 6 | 1,52 |
| 7 | 1,75 |
| 8 | 2,01 |
| 9 | 2,31 |
| 10 | 2,66 |
O fator que você realmente aplica parte sempre do nível atual, não do nível 3:
k = escala(alvo) / escala(atual)
Exemplos:
- Atual 3, alvo 6:
k = 1,52 / 1,00 = 1,52 (composição cresce 52%).
- Atual 5, alvo 6:
k = 1,52 / 1,32 = 1,15 (cresce só os 15% que faltavam).
- Atual 3, alvo 2:
k = 0,87 / 1,00 = 0,87 (encolhe 13%).
- Atual = alvo:
k = 1,00. Não edite a animação, só informe "já está no nível X".
Como escalar a composição
Você só mexe dentro do SVG. Nunca altere a altura do .anim-stage (o height: clamp(...)): o palco fica do mesmo tamanho, quem cresce é o desenho dentro dele. Escolha a técnica por animação:
Técnica A (preferida): zoom no viewBox
A maioria das animações do Mira desenha uma composição centralizada num <svg viewBox="minX minY W H" preserveAspectRatio="xMidYMid meet">. Apertar o viewBox em torno do centro faz todo o desenho (formas, traços, fontes, glow) renderizar k vezes maior, preenchendo mais o palco, com uma única edição de atributo:
cx = minX + W/2 cy = minY + H/2
novoW = W / k novoH = H / k
novoMinX = cx - novoW/2 novoMinY = cy - novoH/2
viewBox = "novoMinX novoMinY novoW novoH"
Exemplo, orbital viewBox="0 0 960 540" indo de 3 para 6 (k = 1,52):
cx=480, cy=270, novoW=631,6, novoH=355,3, novoMinX=164,2, novoMinY=92,4 → viewBox="164.2 92.4 631.6 355.3". Tudo renderiza 1,52× maior, centralizado. Para voltar a 3 (k=0,658) o cálculo recompõe exatamente o viewBox="0 0 960 540" original, então é reversível.
Use a Técnica A quando a composição estiver centralizada com margem visível em volta. Ela nunca distorce as proporções internas.
Técnica B (precisa): escalar as constantes de geometria
Quando o SVG não tem um viewBox limpo, ou a composição está ancorada numa borda (ex.: a escada usa baseY = H - 90 e gruda no rodapé), o zoom central cortaria o desenho. Nesse caso, multiplique por k as constantes nomeadas que definem o tamanho:
- raios (
r, R, rx, ry), comprimentos e larguras (stepW, stepH, len)
- espaçamentos e offsets entre elementos
font-size de textos dentro do SVG
- raio do glow no
drop-shadow(0 0 N px ...) (multiplique o N)
stroke-width quando ele define a grossura visual
Mantenha o ponto de ancoragem coerente (recentralize baseX/cx se necessário) para a composição continuar emoldurada.
Regra de verificação (obrigatória, vale para as duas técnicas)
Depois de escalar, confira mentalmente que nada vaza do viewBox: a composição maior precisa caber inteira no palco, sem cortar formas nem textos. Se crescer e estourar:
- recentralize, ou
- aumente o viewBox na mesma proporção para reacomodar, ou
- se a animação já preenche o palco e não cabe mais crescimento, não force: aplique o máximo que cabe e avise o usuário que aquela animação já está perto do tamanho máximo.
O que você NUNCA toca
- A altura do
.anim-stage (height: clamp(...)).
- A função de animação em si, o loop interno, os
setInterval/setTimeout, o contador de geração (window.__slugGen) e o registro em setupAnimationTriggers().
- A metáfora visual, as cores, os textos, os ícones.
- Qualquer card que não esteja no escopo pedido.
Esta skill é cirúrgica: cada linha alterada é só geometria ou viewBox, ou o marcador. Nada além disso.
Workflow de Execução
- Localizar o deck (
decks/<deck>/index.html ou slides/<tema>/index.html). Se ambíguo, perguntar qual.
- Enumerar as animações (cards com
.anim-stage + <svg>) e ler o marcador @MIRA:SIZE de cada uma (3/10 se faltar).
- Sem alvo → reportar a tabela de níveis e parar.
- Com alvo → resolver o escopo (deck inteiro ou slide específico).
- Para cada animação do escopo:
k = escala(alvo) / escala(atual). Se k ≈ 1,00, pular e informar.
- Escolher Técnica A ou B e aplicar a escala.
- Rodar a regra de verificação (nada vaza do viewBox).
- Reescrever o marcador para
@MIRA:SIZE <alvo>/10 (criar se não existia).
- Reportar card a card:
nível antigo → nível novo, marcando os que já estavam no máximo possível.
Checklist Antes de Entregar