<!DOCTYPE html> <html lang="pt-BR"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>NeuroAvalia - Identificação de Neurodivergência</title> <script src="https://cdn.tailwindcss.com"></script> <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap" rel="stylesheet"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> <style> body { font-family: 'Poppins', sans-serif; background-color: #f8f9fa; } .progress-bar { transition: width 0.5s ease-in-out; } .option:hover { transform: translateY(-2px); box-shadow: 0 6px 12px rgba(0, 0, 0, 0.1); } .result-chart { height: 300px; } </style> </head> <body class="min-h-screen bg-gradient-to-b from-indigo-50 to-blue-50"> <div class="container mx-auto px-4 py-8 max-w-6xl"> <!-- Header Section --> <header class="text-center mb-10"> <h1 class="text-4xl md:text-5xl font-bold text-indigo-800 mb-4">NeuroAvalia</h1> <p class="text-lg md:text-xl text-gray-700 max-w-3xl mx-auto"> Ferramenta baseada em pesquisas científicas para identificar sinais de neurodivergência e altas habilidades </p> <div class="w-24 h-1.5 bg-indigo-500 mx-auto mt-4 rounded-full"></div> </header> <!-- Welcome Card --> <div id="welcome-card" class="bg-white rounded-xl shadow-lg p-6 mb-8 transition-all duration-300"> <div class="flex flex-col md:flex-row items-center gap-6"> <div class="flex-shrink-0 mb-4 md:mb-0"> <div class="w-24 h-24 md:w-32 md:h-32 rounded-full bg-indigo-100 flex items-center justify-center"> <i class="fas fa-brain text-4xl md:text-5xl text-indigo-600"></i> </div> </div> <div> <h2 class="text-2xl font-semibold text-gray-800 mb-3">Sobre esta avaliação</h2> <p class="text-gray-600 mb-4"> Este questionário foi desenvolvido com base nos principais estudos mundiais sobre neurodivergência e altas habilidades. As perguntas abrangem diversas áreas cognitivas, emocionais e sensoriais. </p> <p class="text-gray-600 mb-6"> Ao final, você receberá um relatório detalhado com sua pontuação e orientações sobre os próximos passos, caso sejam necessários. </p> <button onclick="startAssessment()" class="bg-indigo-600 hover:bg-indigo-700 text-white font-medium py-3 px-6 rounded-lg transition duration-300 transform hover:scale-105 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-opacity-50"> Iniciar Avaliação </button> </div> </div> </div> <!-- Assessment Container --> <div id="assessment-container" class="hidden bg-white rounded-xl shadow-lg p-6 mb-8"> <!-- Progress Bar --> <div class="mb-8"> <div class="flex justify-between mb-2"> <span class="text-sm font-medium text-indigo-700">Progresso</span> <span id="progress-percentage" class="text-sm font-medium text-indigo-700">0%</span> </div> <div class="w-full bg-gray-200 rounded-full h-2.5"> <div id="progress-bar" class="progress-bar bg-indigo-600 h-2.5 rounded-full" style="width: 0%"></div> </div> </div> <!-- Question Container --> <div id="question-container"> <!-- Questions will be inserted here dynamically --> </div> <!-- Navigation Buttons --> <div class="flex justify-between mt-10"> <button id="prev-btn" onclick="prevQuestion()" class="hidden bg-gray-200 hover:bg-gray-300 text-gray-800 font-medium py-2 px-6 rounded-lg transition duration-300 focus:outline-none focus:ring-2 focus:ring-gray-400 focus:ring-opacity-50"> <i class="fas fa-arrow-left mr-2"></i> Anterior </button> <button id="next-btn" onclick="nextQuestion()" class="ml-auto bg-indigo-600 hover:bg-indigo-700 text-white font-medium py-2 px-6 rounded-lg transition duration-300 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-opacity-50"> Próxima <i class="fas fa-arrow-right ml-2"></i> </button> <button id="submit-btn" onclick="submitAssessment()" class="hidden bg-green-600 hover:bg-green-700 text-white font-medium py-2 px-6 rounded-lg transition duration-300 focus:outline-none focus:ring-2 focus:ring-green-500 focus:ring-opacity-50"> Finalizar <i class="fas fa-check ml-2"></i> </button> </div> </div> <!-- Results Container --> <div id="results-container" class="hidden bg-white rounded-xl shadow-lg p-6"> <div class="text-center mb-8"> <div class="inline-block p-4 bg-indigo-100 rounded-full mb-4"> <i class="fas fa-chart-bar text-4xl text-indigo-600"></i> </div> <h2 class="text-3xl font-bold text-gray-800 mb-2">Seu Resultado</h2> <p class="text-gray-600 max-w-2xl mx-auto"> Veja abaixo sua pontuação e interpretação baseada em pesquisas científicas sobre neurodivergência. </p> </div> <!-- Score Summary --> <div class="grid grid-cols-1 md:grid-cols-3 gap-6 mb-10"> <div class="bg-blue-50 rounded-xl p-6 text-center"> <div class="text-4xl font-bold text-blue-700 mb-2" id="cognitive-score">0</div> <div class="text-lg font-medium text-blue-800 mb-2">Cognitivo</div> <div class="h-1.5 bg-blue-200 rounded-full mb-3"> <div class="h-1.5 bg-blue-600 rounded-full" id="cognitive-bar" style="width: 0%"></div> </div> <p class="text-sm text-blue-900 opacity-80">Processamento de informações e padrões de pensamento</p> </div> <div class="bg-purple-50 rounded-xl p-6 text-center"> <div class="text-4xl font-bold text-purple-700 mb-2" id="emotional-score">0</div> <div class="text-lg font-medium text-purple-800 mb-2">Emocional</div> <div class="h-1.5 bg-purple-200 rounded-full mb-3"> <div class="h-1.5 bg-purple-600 rounded-full" id="emotional-bar" style="width: 0%"></div> </div> <p class="text-sm text-purple-900 opacity-80">Regulação emocional e intensidade de sentimentos</p> </div> <div class="bg-green-50 rounded-xl p-6 text-center"> <div class="text-4xl font-bold text-green-700 mb-2" id="sensory-score">0</div> <div class="text-lg font-medium text-green-800 mb-2">Sensorial</div> <div class="h-1.5 bg-green-200 rounded-full mb-3"> <div class="h-1.5 bg-green-600 rounded-full" id="sensory-bar" style="width: 0%"></div> </div> <p class="text-sm text-green-900 opacity-80">Sensibilidade a estímulos do ambiente</p> </div> </div> <!-- Detailed Analysis --> <div class="bg-gray-50 rounded-xl p-6 mb-8"> <h3 class="text-xl font-semibold text-gray-800 mb-4">Análise Detalhada</h3> <p class="text-gray-700 mb-6" id="detailed-analysis"> <!-- Analysis will be inserted here --> </p> <h4 class="text-lg font-medium text-gray-800 mb-3">Áreas com maior pontuação:</h4> <div id="strengths-list" class="grid grid-cols-1 md:grid-cols-2 gap-3 mb-6"> <!-- Strengths will be inserted here --> </div> <div class="alert bg-indigo-50 border-l-4 border-indigo-500 p-4 rounded mb-6"> <div class="flex"> <div class="flex-shrink-0 text-indigo-500"> <i class="fas fa-info-circle"></i> </div> <div class="ml-3"> <p class="text-sm text-indigo-700"> <strong>Nota:</strong> Esta avaliação não substitui um diagnóstico profissional. Se os resultados indicarem alta probabilidade de neurodivergência, recomendamos consultar um especialista. </p> </div> </div> </div> </div> <!-- Resources Section --> <div class="mb-8"> <h3 class="text-xl font-semibold text-gray-800 mb-4">Recursos e Próximos Passos</h3> <div class="grid grid-cols-1 md:grid-cols-2 gap-4"> <div class="flex items-start p-4 bg-white border border-gray-200 rounded-lg shadow-sm hover:shadow-md transition"> <div class="flex-shrink-0 mt-1 mr-4 text-blue-500"> <i class="fas fa-book-open"></i> </div> <div> <h4 class="font-medium text-gray-800">Leituras recomendadas</h4> <p class="text-sm text-gray-600">Materiais científicos sobre neurodivergência e altas habilidades</p> </div> </div> <div class="flex items-start p-4 bg-white border border-gray-200 rounded-lg shadow-sm hover:shadow-md transition"> <div class="flex-shrink-0 mt-1 mr-4 text-purple-500"> <i class="fas fa-user-md"></i> </div> <div> <h4 class="font-medium text-gray-800">Profissionais especializados</h4> <p class="text-sm text-gray-600">Encontre especialistas em sua região para avaliação detalhada</p> </div> </div> </div> </div> <div class="text-center"> <button onclick="restartAssessment()" class="bg-indigo-600 hover:bg-indigo-700 text-white font-medium py-2 px-6 rounded-lg transition duration-300 transform hover:scale-105 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-opacity-50 inline-flex items-center"> <i class="fas fa-redo mr-2"></i> Refazer Teste </button> </div> </div> </div> <footer class="bg-white py-6 mt-12 border-t border-gray-200"> <div class="container mx-auto px-4 text-center text-gray-600 text-sm"> <p>© 2023 NeuroAvalia. Baseado em pesquisas científicas sobre neurodivergência e altas habilidades.</p> <p class="mt-2">Este instrumento não substitui avaliação profissional.</p> </div> </footer> <script> // Questions database const questions = [ { id: 1, category: 'cognitive', text: "Com que frequência você percebe padrões, conexões ou relações que outras pessoas não percebem?", options: [ { text: "Raramente ou nunca", score: 1 }, { text: "Ocasionalmente", score: 2 }, { text: "Frequentemente", score: 4 }, { text: "Quase sempre", score: 5 } ] }, { id: 16, category: 'cognitive', text: "Você tem facilidade para aprender conceitos complexos rapidamente?", options: [ { text: "Tenho dificuldade", score: 1 }, { text: "Às vezes", score: 3 }, { text: "Com frequência", score: 4 }, { text: "Sim, quase sempre", score: 5 } ] }, { id: 17, category: 'cognitive', text: "Você se frustra quando outros não acompanham seu raciocínio?", options: [ { text: "Nunca", score: 1 }, { text: "Raramente", score: 2 }, { text: "Às vezes", score: 4 }, { text: "Frequentemente", score: 5 } ] }, { id: 2, category: 'cognitive', text: "Você tem curiosidade intensa sobre vários tópicos diferentes?", options: [ { text: "Não especialmente", score: 1 }, { text: "Tenho algumas áreas de interesse", score: 3 }, { text: "Sim, sobre vários assuntos", score: 4 }, { text: "Sim, sobre muitos assuntos e com grande intensidade", score: 5 } ] }, { id: 3, category: 'emotional', text: "Você já foi descrito como muito intenso(a) emocionalmente?", options: [ { text: "Nunca", score: 1 }, { text: "Raramente", score: 2 }, { text: "Às vezes", score: 3 }, { text: "Frequentemente", score: 4 }, { text: "Sempre ou quase sempre", score: 5 } ] }, { id: 4, category: 'emotional', text: "Com que frequência você sente emoções com extrema intensidade (alegria, tristeza, raiva, etc.)?", options: [ { text: "Quase nunca", score: 1 }, { text: "De vez em quando", score: 2 }, { text: "Regularmente", score: 3 }, { text: "Frequentemente", score: 4 }, { text: "Quase sempre", score: 5 } ] }, { id: 5, category: 'sensory', text: "Você é particularmente sensível a sons, luzes, texturas ou cheiros que não parecem incomodar outras pessoas?", options: [ { text: "Nunca", score: 1 }, { text: "Raramente", score: 2 }, { text: "Às vezes", score: 3 }, { text: "Frequentemente", score: 4 }, { text: "Sempre ou quase sempre", score: 5 } ] }, { id: 6, category: 'sensory', text: "Você fica sobrecarregado(a) em ambientes com muita estimulação sensorial (como shoppings, festas, locais barulhentos)?", options: [ { text: "Nunca", score: 1 }, { text: "Raramente", score: 2 }, { text: "Às vezes", score: 3 }, { text: "Frequentemente", score: 4 }, { text: "Sempre ou quase sempre", score: 5 } ] }, { id: 7, category: 'cognitive', text: "Você pensa principalmente em imagens ou padrões em vez de palavras?", options: [ { text: "Quase nunca", score: 1 }, { text: "Ocasionalmente", score: 2 }, { text: "Regularmente", score: 3 }, { text: "Frequentemente", score: 4 }, { text: "Quase sempre", score: 5 } ] }, { id: 8, category: 'emotional', text: "Você tem forte empatia e pode sentir o que os outros estão sentindo?", options: [ { text: "Não especialmente", score: 1 }, { text: "Às vezes", score: 3 }, { text: "Frequentemente", score: 4 }, { text: "Muito intensamente, às vezes é avassalador", score: 5 } ] }, { id: 9, category: 'cognitive', text: "Você aprende melhor quando pode explorar um tópico profundamente em vez de seguir uma estrutura pré-definida?", options: [ { text: "Prefiro seguir a estrutura definida", score: 1 }, { text: "Às vezes gosto de explorar", score: 3 }, { text: "Geralmente prefiro explorar por conta própria", score: 4 }, { text: "Sempre aprendo melhor explorando profundamente", score: 5 } ] }, { id: 10, category: 'sensory', text: "Você tem reações físicas intensas (como náusea ou dor) a certos estímulos sensoriais?", options: [ { text: "Nunca", score: 1 }, { text: "Raramente", score: 2 }, { text: "Às vezes", score: 3 }, { text: "Frequentemente", score: 4 }, { text: "Sempre ou quase sempre", score: 5 } ] }, { id: 11, category: 'cognitive', text: "Com que frequência você se envolve em pensamento divergente (várias ideias ou soluções para um problema)?", options: [ { text: "Raramente", score: 1 }, { text: "Ocasionalmente", score: 2 }, { text: "Regularmente", score: 3 }, { text: "Frequentemente", score: 4 }, { text: "Quase sempre", score: 5 } ] }, { id: 12, category: 'emotional', text: "Você já sentiu que suas emoções são mais intensas do que as das pessoas ao seu redor?", options: [ { text: "Nunca", score: 1 }, { text: "Raramente", score: 2 }, { text: "Às vezes", score: 3 }, { text: "Frequentemente", score: 4 }, { text: "Sempre ou quase sempre", score: 5 } ] }, { id: 13, category: 'sensory', text: "Você tem preferências muito específicas por certos tipos de tecidos, sabores ou sons?", options: [ { text: "Nenhuma preferência especial", score: 1 }, { text: "Algumas pequenas preferências", score: 2 }, { text: "Algumas preferências marcantes", score: 3 }, { text: "Muitas preferências fortes", score: 4 }, { text: "Prefiroências muito específicas e intensas", score: 5 } ] }, { id: 14, category: 'cognitive', text: "Você tende a pensar de maneira não linear (saltando entre ideias em vez de seguir uma sequência lógica)?", options: [ { text: "Quase nunca", score: 1 }, { text: "Ocasionalmente", score: 2 }, { text: "Regularmente", score: 3 }, { text: "Frequentemente", score: 4 }, { text: "Quase sempre", score: 5 } ] }, { id: 15, category: 'emotional', text: "Você tem dificuldade em regular suas emoções (calmar-se quando está agitado ou animar-se quando está desanimado)?", options: [ { text: "Nunca", score: 1 }, { text: "Raramente", score: 2 }, { text: "Às vezes", score: 3 }, { text: "Frequentemente", score: 4 }, { text: "Sempre ou quase sempre", score: 5 } ] }, { id: 18, category: 'emotional', text: "Você se envolve emocionalmente com personagens de livros/filmes como se fossem reais?", options: [ { text: "Quase nunca", score: 1 }, { text: "Raramente", score: 2 }, { text: "Às vezes", score: 3 }, { text: "Frequentemente", score: 4 }, { text: "Quase sempre", score: 5 } ] }, { id: 19, category: 'sensory', text: "Você evita certas atividades devido à sensibilidade sensorial?", options: [ { text: "Nunca", score: 1 }, { text: "Raramente", score: 2 }, { text: "Às vezes", score: 4 }, { text: "Frequentemente", score: 5 } ] }, { id: 20, category: 'sensory', text: "Você tem reações físicas intensas a certos alimentos (textura, temperatura, sabor)?", options: [ { text: "Nunca", score: 1 }, { text: "1-2 alimentos", score: 2 }, { text: "3-5 alimentos", score: 3 }, { text: "6-10 alimentos", score: 4 }, { text: "Mais de 10 alimentos", score: 5 } ] } ]; // Comparative data for results (percentiles) const comparativeData = { cognitive: { 10: 20, 20: 30, 30: 45, 40: 55, 50: 65, 60: 72, 70: 79, 80: 85, 90: 90, 95: 95 }, emotional: { 10: 25, 20: 35, 30: 45, 40: 55, 50: 62, 60: 69, 70: 75, 80: 81, 90: 88, 95: 93 }, sensory: { 10: 15, 20: 30, 30: 42, 40: 52, 50: 60, 60: 68, 70: 74, 80: 80, 90: 87, 95: 94 } }; // Assessment state let currentQuestionIndex = 0; let answers = []; let scores = { cognitive: 0, emotional: 0, sensory: 0 }; // DOM elements const welcomeCard = document.getElementById('welcome-card'); const assessmentContainer = document.getElementById('assessment-container'); const questionContainer = document.getElementById('question-container'); const resultsContainer = document.getElementById('results-container'); const progressBar = document.getElementById('progress-bar'); const progressPercentage = document.getElementById('progress-percentage'); const prevBtn = document.getElementById('prev-btn'); const nextBtn = document.getElementById('next-btn'); const submitBtn = document.getElementById('submit-btn'); // Current position in assessment currentQuestionIndex = 0; // Start the assessment function startAssessment() { welcomeCard.classList.add('hidden'); assessmentContainer.classList.remove('hidden'); showQuestion(currentQuestionIndex); updateProgress(); } // Show a specific question function showQuestion(index) { // Reset question container questionContainer.innerHTML = ''; // Get current question const question = questions[index]; // Create question element const questionElement = document.createElement('div'); questionElement.className = 'question mb-8'; // Add question text const questionText = document.createElement('h3'); questionText.className = 'text-xl font-semibold text-gray-800 mb-6'; questionText.textContent = question.text; questionElement.appendChild(questionText); // Add options const optionsContainer = document.createElement('div'); optionsContainer.className = 'space-y-3'; question.options.forEach((option, optionIndex) => { const optionElement = document.createElement('div'); optionElement.className = 'option cursor-pointer bg-gray-50 hover:bg-indigo-50 border border-gray-200 rounded-lg p-4 transition duration-300'; optionElement.innerHTML = ` <div class="flex items-center"> <div class="w-5 h-5 rounded-full border border-gray-300 mr-3 flex-shrink-0 option-radio ${answers[index] === optionIndex ? 'bg-indigo-500 border-indigo-500' : ''}"></div> <div>${option.text}</div> </div> `; // Add click event to select option optionElement.addEventListener('click', () => { // Deselect all options document.querySelectorAll('.option-radio').forEach(radio => { radio.className = 'w-5 h-5 rounded-full border border-gray-300 mr-3 flex-shrink-0 option-radio'; }); // Select clicked option const radio = optionElement.querySelector('.option-radio'); radio.className = 'w-5 h-5 rounded-full border border-indigo-500 bg-indigo-500 mr-3 flex-shrink-0 option-radio'; // Store answer answers[index] = optionIndex; // Enable next/submit button if (index === questions.length - 1) { nextBtn.classList.add('hidden'); submitBtn.classList.remove('hidden'); } }); // If this option was previously selected, mark it if (answers[index] === optionIndex) { const radio = optionElement.querySelector('.option-radio'); radio.className = 'w-5 h-5 rounded-full border border-indigo-500 bg-indigo-500 mr-3 flex-shrink-0 option-radio'; // Make sure submit button is visible on last question if answered if (index === questions.length - 1) { nextBtn.classList.add('hidden'); submitBtn.classList.remove('hidden'); } } optionsContainer.appendChild(optionElement); }); questionElement.appendChild(optionsContainer); questionContainer.appendChild(questionElement); // Update navigation buttons prevBtn.classList.toggle('hidden', index === 0); } // Go to next question function nextQuestion() { if (answers[currentQuestionIndex] === undefined) { alert('Por favor, selecione uma resposta antes de continuar.'); return; } currentQuestionIndex++; showQuestion(currentQuestionIndex); updateProgress(); } // Go to previous question function prevQuestion() { currentQuestionIndex--; showQuestion(currentQuestionIndex); updateProgress(); } // Update progress bar function updateProgress() { const progress = ((currentQuestionIndex + 1) / questions.length) * 100; progressBar.style.width = `${progress}%`; progressPercentage.textContent = `${Math.round(progress)}%`; } // Submit assessment and show results function submitAssessment() { if (answers[currentQuestionIndex] === undefined) { alert('Por favor, selecione uma resposta antes de finalizar.'); return; } calculateScores(); showResults(); assessmentContainer.classList.add('hidden'); resultsContainer.classList.remove('hidden'); } // Calculate scores from answers function calculateScores() { // Reset scores scores = { cognitive: 0, emotional: 0, sensory: 0 }; // Count questions per category to calculate averages later const counts = { cognitive: 0, emotional: 0, sensory: 0 }; // Sum scores for each category questions.forEach((question, index) => { if (answers[index] !== undefined) { const selectedOption = question.options[answers[index]]; scores[question.category] += selectedOption.score; counts[question.category]++; } }); // Calculate average scores (percentage of max possible score) ['cognitive', 'emotional', 'sensory'].forEach(category => { if (counts[category] > 0) { const maxPossible = counts[category] * 5; scores[category] = Math.round((scores[category] / maxPossible) * 100); } }); } // Show results page function showResults() { // Update score displays document.getElementById('cognitive-score').textContent = scores.cognitive; document.getElementById('emotional-score').textContent = scores.emotional; document.getElementById('sensory-score').textContent = scores.sensory; // Update progress bars document.getElementById('cognitive-bar').style.width = `${scores.cognitive}%`; document.getElementById('emotional-bar').style.width = `${scores.emotional}%`; document.getElementById('sensory-bar').style.width = `${scores.sensory}%`; // Generate analysis text const analysis = generateAnalysis(); document.getElementById('detailed-analysis').innerHTML = analysis.text; // Add strengths const strengthsList = document.getElementById('strengths-list'); strengthsList.innerHTML = ''; analysis.strengths.forEach(strength => { const strengthItem = document.createElement('div'); strengthItem.className = 'flex items-start'; strengthItem.innerHTML = ` <div class="flex-shrink-0 mt-1 mr-3 text-green-500"> <i class="fas fa-check-circle"></i> </div> <div> <h5 class="font-medium text-gray-800">${strength.title}</h5> <p class="text-sm text-gray-600">${strength.description}</p> </div> `; strengthsList.appendChild(strengthItem); }); } // Generate analysis based on scores function generateAnalysis() { const cognitiveLevel = getLevel(scores.cognitive); const emotionalLevel = getLevel(scores.emotional); const sensoryLevel = getLevel(scores.sensory); // Calculate percentiles const cognitivePercentile = getPercentile('cognitive', scores.cognitive); const emotionalPercentile = getPercentile('emotional', scores.emotional); const sensoryPercentile = getPercentile('sensory', scores.sensory); // Determine overall assessment with comparison data let overallScore = Math.round((scores.cognitive + scores.emotional + scores.sensory) / 3); const overallPercentile = Math.round((cognitivePercentile + emotionalPercentile + sensoryPercentile) / 3); let overallAssessment = ''; if (overallPercentile <= 30) { overallAssessment = `Seus resultados (percentil ${overallPercentile}) sugerem padrões predominantemente neurotípicos, com poucos indícios de neurodivergência. Você está entre os ${100-overallPercentile}% menos neurodivergentes da população.`; } else if (overallPercentile <= 60) { overallAssessment = `Seus resultados (percentil ${overallPercentile}) mostram algumas características neurodivergentes em intensidade moderada. Você está entre os ${60-overallPercentile}% da população com traços leves ou mistos.`; } else if (overallPercentile <= 85) { overallAssessment = `Seus resultados (percentil ${overallPercentile}) indicam um perfil significativamente neurodivergente. Isso coloca você entre os ${100-overallPercentile}% mais neurodivergentes da população.`; } else { overallAssessment = `Seus resultados (percentil ${overallPercentile}) mostram um perfil altamente neurodivergente. Você está entre os ${100-overallPercentile}% mais neurodivergentes da população, com padrões intensos e marcantes.`; } // Create strengths list const strengths = []; if (scores.cognitive >= 70) { strengths.push({ title: 'Pensamento complexo', description: 'Você demonstra forte capacidade de perceber padrões, conexões e pensar de maneiras não convencionais.' }); } if (scores.emotional >= 70) { strengths.push({ title: 'Intensidade emocional', description: 'Sua profundidade emocional pode representar uma rica vida interior e alta empatia.' }); } if (scores.sensory >= 70) { strengths.push({ title: 'Percepção sensorial', description: 'Sua sensibilidade sensorial pode indicar uma percepção mais fina e detalhada do ambiente.' }); } return { text: ` <div class="mb-6 p-4 bg-blue-50 rounded-lg"> <h4 class="font-bold text-lg text-blue-800 mb-2">Resumo Geral</h4> <p class="mb-4">${overallAssessment}</p> <div class="flex flex-wrap gap-4"> <div class="bg-white p-3 rounded-lg shadow-sm w-full md:w-auto"> <div class="text-sm text-gray-600">Percentil Total</div> <div class="text-2xl font-bold text-blue-700">${overallPercentile}</div> <div class="text-xs text-gray-500">(maior = mais neurodivergente)</div> </div> </div> </div> <h4 class="font-bold text-lg text-gray-800 mb-3">Detalhes por Área</h4> <div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-6"> <div class="bg-white p-4 rounded-lg shadow-sm"> <h5 class="font-bold text-blue-800 mb-2">Cognitivo <span class="text-sm">(${scores.cognitive}%)</span></h5> <div class="h-2 bg-gray-200 rounded-full mb-2"> <div class="h-2 bg-blue-600 rounded-full" style="width: ${scores.cognitive}%"></div> </div> <div class="text-sm mb-1">Nível: <strong>${cognitiveLevel}</strong></div> <div class="text-xs text-gray-600">Percentil ${cognitivePercentile} - ${getPercentileInterpretation(cognitivePercentile)}</div> </div> <div class="bg-white p-4 rounded-lg shadow-sm"> <h5 class="font-bold text-purple-800 mb-2">Emocional <span class="text-sm">(${scores.emotional}%)</span></h5> <div class="h-2 bg-gray-200 rounded-full mb-2"> <div class="h-2 bg-purple-600 rounded-full" style="width: ${scores.emotional}%"></div> </div> <div class="text-sm mb-1">Nível: <strong>${emotionalLevel}</strong></div> <div class="text-xs text-gray-600">Percentil ${emotionalPercentile} - ${getPercentileInterpretation(emotionalPercentile)}</div> </div> <div class="bg-white p-4 rounded-lg shadow-sm"> <h5 class="font-bold text-green-800 mb-2">Sensorial <span class="text-sm">(${scores.sensory}%)</span></h5> <div class="h-2 bg-gray-200 rounded-full mb-2"> <div class="h-2 bg-green-600 rounded-full" style="width: ${scores.sensory}%"></div> </div> <div class="text-sm mb-1">Nível: <strong>${sensoryLevel}</strong></div> <div class="text-xs text-gray-600">Percentil ${sensoryPercentile} - ${getPercentileInterpretation(sensoryPercentile)}</div> </div> </div> `, strengths }; } // Get descriptive level based on score function getLevel(score) { if (score <= 25) return 'Muito Baixo'; if (score <= 40) return 'Baixo'; if (score <= 60) return 'Moderado'; if (score <= 75) return 'Alto'; return 'Muito Alto'; } // Get percentile based on comparative data function getPercentile(category, score) { const data = comparativeData[category]; for (let percentile = 95; percentile >= 10; percentile -= 5) { if (score >= data[percentile]) return percentile; } return 5; } // Get interpretation of percentile function getPercentileInterpretation(percentile) { if (percentile <= 15) return 'Baixa neurodivergência'; if (percentile <= 40) return 'Neurotípico com alguns traços'; if (percentile <= 60) return 'Perfil misto'; if (percentile <= 80) return 'Neurodivergente significativo'; if (percentile <= 90) return 'Altamente neurodivergente'; return 'Extremamente neurodivergente'; } // Restart assessment function restartAssessment() { currentQuestionIndex = 0; answers = []; resultsContainer.classList.add('hidden'); welcomeCard.classList.remove('hidden'); } </script> </body> </html> - Follow Up Deployment
verified 
