Adicionando campo de Idade e melhorando analise visual no Garatujas

public/app.js

@@ -4857,6 +4857,7 @@ const initApp = () => {
   const contentGaratujasHistorico = document.getElementById('contentGaratujasHistorico');
   
   const garatujasAlunoInput = document.getElementById('garatujasAlunoInput');
+  const garatujasIdadeInput = document.getElementById('garatujasIdadeInput');
   const garatujaFileInput = document.getElementById('garatujaFileInput');
   const btnUploadGaratuja = document.getElementById('btnUploadGaratuja');
   const garatujaFileStatus = document.getElementById('garatujaFileStatus');
@@ -4954,6 +4955,7 @@ const initApp = () => {
   if (btnGenerateGaratuja) {
     btnGenerateGaratuja.addEventListener('click', async () => {
       const alunoName = garatujasAlunoInput.value.trim();
+      const alunoIdade = garatujasIdadeInput ? garatujasIdadeInput.value.trim() : '';
       const file = garatujaFileInput.files[0];
 
       if (!alunoName) {
@@ -4972,6 +4974,7 @@ const initApp = () => {
 
       const formData = new FormData();
       formData.append('alunoName', alunoName);
+      if (alunoIdade) formData.append('alunoIdade', alunoIdade);
       formData.append('image', file);
 
       let statusMsgIdx = 0;

public/index.html

@@ -1105,9 +1105,16 @@
         <div id="contentGaratujasNova" class="tab-content-panel">
           <div style="display: flex; flex-direction: column; gap: 16px;">
             <!-- NOME DO ALUNO -->
-            <div class="settings-group">
+            <!-- NOME E IDADE DO ALUNO -->
-              <label style="color: var(--text-secondary); font-size: 0.82rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px;">Nome do Aluno</label>
+            <div style="display: flex; gap: 12px; align-items: flex-start;">
-              <input type="text" id="garatujasAlunoInput" placeholder="Ex: Joãozinho Silva" class="obs-input" style="width: 100%; margin-top: 4px; padding: 10px;">
+              <div class="settings-group" style="flex: 2;">
+                <label style="color: var(--text-secondary); font-size: 0.82rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px;">Nome do Aluno</label>
+                <input type="text" id="garatujasAlunoInput" placeholder="Ex: Joãozinho Silva" class="obs-input" style="width: 100%; margin-top: 4px; padding: 10px;">
+              </div>
+              <div class="settings-group" style="flex: 1;">
+                <label style="color: var(--text-secondary); font-size: 0.82rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px;">Idade (Ex: 2a 3m)</label>
+                <input type="text" id="garatujasIdadeInput" placeholder="Ex: 2 anos" class="obs-input" style="width: 100%; margin-top: 4px; padding: 10px;">
+              </div>
             </div>
 
             <!-- FOTO DO DESENHO -->

server.js

@@ -833,7 +833,7 @@ Retorne a resposta estruturada estritamente em Markdown. Separe as seções usan
 // ROTAS DO GARATUJAS (ANALISADOR DE TRAÇADO INFANTIL)
 // ============================================================
 app.post('/api/garatujas/analyze', requireAuth, multerUpload.single('image'), async (req, res) => {
-  const { alunoName } = req.body;
+  const { alunoName, alunoIdade } = req.body;
   const file = req.file;
   
   if (!alunoName) {
@@ -865,17 +865,19 @@ app.post('/api/garatujas/analyze', requireAuth, multerUpload.single('image'), as
       console.log('[Garatujas] Usando API direta do Google Gemini para análise de imagem...');
       const geminiUrl = `https://generativelanguage.googleapis.com/v1beta/models/${process.env.GOOGLE_AI_MODEL || 'gemini-2.5-flash'}:generateContent?key=${process.env.GOOGLE_AI_API_KEY}`;
       
-      const promptText = `Você é um psicopedagogo e especialista em desenvolvimento infantil no Brasil.
+      const idadeContexto = alunoIdade ? `de ${alunoIdade} de idade` : '(até 6 anos de idade)';
-Analise a imagem deste desenho/rabisco feito pelo aluno(a) "${alunoName}" (até 6 anos de idade).
 
-Identifique e descreva com base na literatura científica (como Piaget, Luquet, Lowenfeld):
+      const promptText = `Você é um psicopedagogo e especialista em desenvolvimento infantil no Brasil.
-1. O estágio do desenho infantil em que a criança se encontra (ex: Garatuja Desordenada, Garatuja Ordenada, Pré-Esquematismo, etc.) justificando com elementos visuais identificados no desenho.
+Analise a imagem anexada, que é um desenho/rabisco feito pelo aluno(a) "${alunoName}" ${idadeContexto}.
-2. A análise do desenvolvimento cognitivo e da coordenação motora fina expressa nos traços.
+
+Identifique visualmente os padrões dos traços, uso do espaço, pressão do lápis (se perceptível) e formas criadas. Descreva com base na literatura científica (como Piaget, Luquet, Lowenfeld):
+1. O estágio exato do desenho infantil em que a criança se encontra (ex: Garatuja Desordenada, Garatuja Ordenada, Pré-Esquematismo, etc.) justificando com os elementos visuais que você está vendo na imagem. Lembre-se que a criança tem ${idadeContexto}.
+2. A análise do desenvolvimento cognitivo e da coordenação motora fina expressa nos traços vistos na imagem.
 3. Propostas práticas de estimulação pedagógica personalizadas para o professor aplicar com o aluno "${alunoName}" em sala de aula para avançar para o próximo estágio.
 
 Retorne a resposta estruturada em Markdown, usando títulos claros:
 # Estágio do Desenho e Análise Psicomotora
-[Sua análise aqui]
+[Sua análise baseada na imagem aqui]
 
 # Diagnóstico de Desenvolvimento Cognitivo
 [Seu diagnóstico aqui]