Fundamentos de Gastroenterología

Etapas de Misión

INTRODUCCIÓN

Bienvenido, Médico en Formación

El Desafío Clínico del Tracto Gastrointestinal Superior.

El tubo digestivo es una sofisticada barrera selectiva y fábrica química. Como médico en formación de la Universidad Central del Ecuador, su misión es descifrar las bases fisiopatológicas que aquejan a nuestro **Paciente Cero (Sr. X)**.

A lo largo de este simulador interactivo, estudiará la anatomía espacial superior, el control de la secreción ácida y enzimática, y la ecología microbiana. Sus respuestas determinarán el éxito en la resolución de este caso clínico real.

Syllabus de la Semana

Anatomía quirúrgica y topográfica del TGI superior.
Fisiología de la motilidad y secreción estomacal.
Bioquímica de la digestión pancreático-biliar y absorción.
Ecología microbiana intestinal e impacto inmunológico.

Reglas de Progresión

Para acreditar su participación en este módulo gamificado, debe completar los desafíos interactivos en orden. Cada misión completada le otorgará una insignia. Al final del módulo, completará su autoevaluación reflexiva obligatoria.

MISIÓN 1

Laboratorio Anatómico Superior

INSIGNIA GANADA: EXPLORADOR ANATÓMICO

Anatomical Target Locator

Haga clic en las estructuras anatómicas en el escáner computarizado para identificar los órganos principales del tracto digestivo superior.

Localice la estructura:

Estómago

Estructuras Identificadas 0 / 5

BIO-SCANNER v1.0

Anatomical Association Challenge

Asocie cada órgano con su función específica haciendo clic en el órgano a la izquierda y luego en su rol funcional correspondiente a la derecha.

¡Felicidades! Ha descifrado el mapa anatómico digestivo y ganado la insignia "Explorador Anatómico".

MISIÓN 2

La Fábrica Química (Fisiología)

INSIGNIA GANADA: MAESTRO ENZIMÁTICO

Monitoree el paso del bolo alimenticio por el TGI superior. Debe responder las preguntas de control clínico-fisiológico en cada esfínter para abrir las válvulas y completar la absorción.

Visualizador de Motilidad

ESÓFAGO

EEI

ESTÓMAGO

PÍLORO

DUODENO

Simulador en Espera

Presione "Iniciar Simulación" para ingerir el bolo y comenzar a examinar los procesos celulares del estómago y duodeno.

Punto de Control PREGUNTA

¿Cuál de las capas digestivas realiza el movimiento peristáltico?

¡Simulación Completada!

Ha respondido correctamente las preguntas de control de motilidad, acidez y transporte de lípidos. La insignia de "Maestro Enzimático" ha sido cargada a su expediente.

MISIÓN 3

El Ecosistema Oculto (Microbiota)

INSIGNIA GANADA: GUARDIÁN DEL BIOMA

Administre la ecología bacteriana en el intestino de nuestro paciente. Sus decisiones terapéuticas y dietéticas cambiarán el balance microbiano y determinarán el riesgo de disbiosis.

Ecosistema Status

75% Diversidad General

Poblaciones Bacterianas

Bacteroidetes (Amantes de Fibra) 50%

Firmicutes (Amantes de Azúcar) 45%

C. difficile (Oportunista) 5%

Escenario 1 de 2

El Paciente Cero se encuentra bajo alto estrés laboral y solicita una recomendación dietética para su dolor epigástrico crónico. ¿Qué intervención nutricional propone?

Reporte Clínico Fisiológico

¡Misión de Microbiota Completada!

Ha demostrado comprender la regulación ecológica intestinal y el papel crucial de la microbiota. Su insignia "Guardián del Bioma" ha sido desbloqueada.

EVALUACIÓN FORMATIVA

Criterios de Evaluación y Syllabus UCE

El curso interactivo complementa los siguientes capítulos fundamentales del syllabus oficial de Gastroenterología:

Harrison: Principios de Medicina Interna, Cap. "Aproximación al paciente con enfermedad gastrointestinal".
Sleisenger and Fordtran: Enfermedades Gastrointestinales y Hepáticas, Cap. "Anatomía, Histología, Motilidad y Absorción".
Guías Clínicas: Documentos UCE sobre patología funcional e infecciones prevalentes.

La evaluación en el aula práctica se distribuye del siguiente modo:

1 Pto

Preparación Previa: Registro y estudio del caso "Paciente Cero" antes del laboratorio presencial.

2 Ptos

Intervenciones Clínicas: Respuestas argumentadas a los puntos de control del simulador de motilidad.

2 Ptos

Colaboración y Reflexión: Integración exitosa del ecosistema intestinal y autoevaluación final.

Guyton & Hall: Tratado de Fisiología Médica, 14ª Edición.
Lash & Mason: Fisiología Gastrointestinal y Endocrina, 5ª Edición.
Plataforma de Educación Médica UCE - Gastroenterología 2026.

Autoevaluación del Estudiante

Complete los siguientes enunciados para reflexionar sobre lo aprendido en el módulo y generar su reporte final.

Identifico correctamente el esófago, estómago, hígado, páncreas y duodeno y sus relaciones de contigüidad espacial. Comprendo el control hormonal de la acidez gástrica y las fases fisiológicas de la digestión. Distingo el impacto selectivo de los antibióticos y las conductas alimenticias sobre el microbioma intestinal.

Reflexiones de Aprendizaje y Compromiso de Mejora:

</button>
            </div>

<button onclick="submitStudentReflections()" class="w-full py-3 bg-indigo-600 hover:bg-indigo-500 text-white font-bold rounded-xl text-sm transition-all shadow-md hover:shadow-indigo-500/20">
              Generar Certificado de Completación
            </button>

<div id="eval-success-alert" class="hidden p-4 bg-emerald-950/40 border border-emerald-500/20 text-emerald-400 rounded-xl text-center text-xs font-semibold">
              <i class="fas fa-circle-check text-base mb-1 block"></i>
              ¡Certificado Académico Generado con Éxito! Sus insignias y reflexiones han sido registradas en su perfil estudiantil local.
            </div>
          </div>
        </div>

</section>
    </main>

<footer class="bg-slate-950 border-t border-slate-900 py-6 text-center text-xs text-slate-600">
      <p>© 2026 Powersemiotics. Todos los derechos reservados. Facultad de Medicina - Universidad Central del Ecuador.</p>
    </footer>

<script>
      // State Variables
      let identifiedOrgans = new Set();
      const scanOrder = ['estomago', 'higado', 'vesicula', 'pancreas', 'duodeno'];
      let currentScanIndex = 0;
      
      let matchedPairs = new Set();
      let currentSelectedLabel = null;

// Physiology simulation state
      let bolusState = 0; // 0: Idle, 1: LES check, 2: LES open/Stomach, 3: Pylorus check, 4: Pylorus open/Duodenum, 5: Duodenum check, 6: Completed
      const physQuestions = [
        {
          id: 'les',
          title: 'El bolo se detiene en el Esfínter Esofágico Inferior (EEI). Para permitir su paso, responda: ¿Qué músculo realiza la propulsión del bolo en el esófago?',
          options: [
            { text: 'A) Contracción coordinada del músculo circular interno detrás del bolo y relajación distal.', correct: true },
            { text: 'B) Contracción de la capa longitudinal externa únicamente.', correct: false },
            { text: 'C) Cierre pasivo de la mucosa de la submucosa.', correct: false }
          ]
        },
        {
          id: 'pylorus',
          title: 'El quimo se encuentra en el Estómago. Para abrir el Píloro, responda: ¿Qué mediador celular estimula la secreción de ácido clorhídrico por las células parietales?',
          options: [
            { text: 'A) Secretina y colecistocinina (CCK).', correct: false },
            { text: 'B) Gastrina, histamina y acetilcolina.', correct: true },
            { text: 'C) Somatostatina y péptido inhibidor gástrico (GIP).', correct: false }
          ]
        },
        {
          id: 'duodenum',
          title: 'El bolo ingresa al Duodeno. Para completar la absorción, responda: ¿A través de qué vía se absorben principalmente las grasas digeridas (ácidos grasos libres)?',
          options: [
            { text: 'A) Capilares linfáticos (quilíferos) de las vellosidades intestinales.', correct: true },
            { text: 'B) Sistema de la vena porta directo al hígado.', correct: false },
            { text: 'C) Transporte pasivo por uniones estrechas del colon.', correct: false }
          ]
        }
      ];

// Microbiota game state
      let scenarioIndex = 1;
      let diversity = 75;
      let bacteroidetes = 50;
      let firmicutes = 45;
      let cdiff = 5;
      let completedScenarios = 0;

// Main tab switcher
      function switchTab(tabId) {
        // Hide all contents
        ['intro', 'anatomy', 'physiology', 'microbiota', 'evaluation'].forEach(id => {
          document.getElementById(`tab-content-${id}`).classList.add('hidden');
          const btn = document.getElementById(`tab-btn-${id}`);
          btn.className = 'w-full text-left px-4 py-3 rounded-xl flex items-center justify-between text-slate-400 hover:text-slate-200 hover:bg-slate-800/50 font-medium transition-all';
        });

// Show active content
        document.getElementById(`tab-content-${tabId}`).classList.remove('hidden');
        const activeBtn = document.getElementById(`tab-btn-${tabId}`);
        activeBtn.className = 'w-full text-left px-4 py-3 rounded-xl flex items-center justify-between text-indigo-400 bg-slate-950 border border-indigo-500/20 font-semibold transition-all';
      }

// Toggle case file Details
      function toggleCaseDetails() {
        const panel = document.getElementById('case-details-panel');
        const icon = document.getElementById('toggle-case-icon');
        const text = document.getElementById('toggle-case-text');
        
        if (panel.classList.contains('hidden')) {
          panel.classList.remove('hidden');
          icon.className = 'fas fa-chevron-up';
          text.innerText = 'Ocultar Detalles Clínicos';
        } else {
          panel.classList.add('hidden');
          icon.className = 'fas fa-chevron-down';
          text.innerText = 'Ver Detalles Clínicos';
        }
      }

// ==================== MISSION 1: ANATOMY LOGIC ====================
      function toggleAnatomyStep(stepNum) {
        if (stepNum === 1) {
          document.getElementById('anatomy-phase-a').classList.remove('hidden');
          document.getElementById('anatomy-phase-b').classList.add('hidden');
          document.getElementById('anatomy-step1-btn').className = 'px-4 py-2 border-b-2 border-emerald-500 text-emerald-400 font-semibold text-sm';
          document.getElementById('anatomy-step2-btn').className = 'px-4 py-2 text-slate-400 hover:text-slate-200 font-medium text-sm transition-colors';
        } else {
          document.getElementById('anatomy-phase-a').classList.add('hidden');
          document.getElementById('anatomy-phase-b').classList.remove('hidden');
          document.getElementById('anatomy-step1-btn').className = 'px-4 py-2 text-slate-400 hover:text-slate-200 font-medium text-sm transition-colors';
          document.getElementById('anatomy-step2-btn').className = 'px-4 py-2 border-b-2 border-emerald-500 text-emerald-400 font-semibold text-sm';
        }
      }

// Click organ on SVG
      function clickOrgan(organId) {
        const target = scanOrder[currentScanIndex];
        const feedback = document.getElementById('scanner-feedback');
        
        if (organId === target) {
          // Correct click
          identifiedOrgans.add(organId);
          document.getElementById(`svg-${organId}`).setAttribute('fill-opacity', '0.6');
          document.getElementById(`svg-${organId}`).classList.add('glow-active');
          
          feedback.innerText = "¡Correcto! Estructura localizada.";
          feedback.className = "p-3 rounded-lg text-sm font-bold text-center bg-emerald-950/40 text-emerald-400 border border-emerald-500/20";
          feedback.classList.remove('hidden');
          
          currentScanIndex++;
          
          // Update progress
          const progressPercent = (currentScanIndex / 5) * 100;
          document.getElementById('scanner-progress-bar').style.width = `${progressPercent}%`;
          document.getElementById('scanner-progress-text').innerText = `${currentScanIndex} / 5`;
          
          if (currentScanIndex < 5) {
            // Set next target
            const nextTarget = scanOrder[currentScanIndex];
            const displayNames = {
              'higado': 'Hígado',
              'vesicula': 'Vesícula Biliar',
              'pancreas': 'Páncreas',
              'duodeno': 'Duodeno (Segmento C)'
            };
            document.getElementById('scanner-target-name').innerText = displayNames[nextTarget];
          } else {
            // Finished Phase A
            document.getElementById('scanner-prompt-box').classList.add('hidden');
            document.getElementById('anatomy-step2-btn').disabled = false;
            
            // Auto route to phase b
            setTimeout(() => {
              toggleAnatomyStep(2);
            }, 1000);
          }
        } else {
          // Incorrect click
          feedback.innerText = "Localización errónea. Revise sus relaciones anatómicas e intente de nuevo.";
          feedback.className = "p-3 rounded-lg text-sm font-bold text-center bg-rose-950/40 text-rose-400 border border-rose-500/20";
          feedback.classList.remove('hidden');
        }
      }

// Match item select logic
      function selectMatchItem(id, type) {
        if (matchedPairs.has(id)) return; // Already matched

if (type === 'label') {
          // Select label
          if (currentSelectedLabel) {
            document.getElementById(`match-lbl-${currentSelectedLabel}`).classList.remove('border-indigo-500', 'bg-indigo-950/20');
          }
          currentSelectedLabel = id;
          document.getElementById(`match-lbl-${id}`).classList.add('border-indigo-500', 'bg-indigo-950/20');
        } else {
          // Select value
          if (!currentSelectedLabel) return; // Must select label first

if (currentSelectedLabel === id) {
            // Match success
            matchedPairs.add(id);
            document.getElementById(`match-lbl-${id}`).classList.remove('border-indigo-500', 'bg-indigo-950/20');
            document.getElementById(`match-lbl-${id}`).classList.add('border-emerald-500/40', 'bg-emerald-950/10', 'text-emerald-400');
            document.getElementById(`match-lbl-${id}`).querySelector('.status-icon').innerHTML = '<i class="fas fa-check-circle text-emerald-400"></i>';
            
            document.getElementById(`match-val-${id}`).classList.add('border-emerald-500/40', 'bg-emerald-950/10', 'text-emerald-400');
            document.getElementById(`match-val-${id}`).querySelector('.status-icon').innerHTML = '<i class="fas fa-check-circle text-emerald-400"></i>';
            
            currentSelectedLabel = null;
            
            // Check if all matched
            if (matchedPairs.size === 5) {
              document.getElementById('anatomy-complete-alert').classList.remove('hidden');
              unlockBadge('anatomy');
            }
          } else {
            // Match failure
            const originalClass = document.getElementById(`match-val-${id}`).className;
            document.getElementById(`match-val-${id}`).classList.add('border-rose-500', 'bg-rose-950/10');
            setTimeout(() => {
              document.getElementById(`match-val-${id}`).classList.remove('border-rose-500', 'bg-rose-950/10');
            }, 800);
          }
        }
      }

// Unlock badges helper
      function unlockBadge(badgeId) {
        const badge = document.getElementById(`badge-${badgeId}`);
        badge.classList.remove('opacity-40', 'grayscale');
        badge.classList.add('glow-active');
        
        // Unlock nav progress indicator
        const nav = document.getElementById(`nav-badge-${badgeId}`);
        nav.innerText = "COMP";
        nav.className = "text-[9px] bg-emerald-950 text-emerald-400 px-2 py-0.5 rounded font-mono font-bold";

// Enable next nav buttons
        if (badgeId === 'anatomy') {
          document.getElementById('tab-btn-physiology').disabled = false;
        } else if (badgeId === 'chemistry') {
          document.getElementById('tab-btn-microbiota').disabled = false;
        }
      }

// ==================== MISSION 2: PHYSIOLOGY LOGIC ====================
      function startPhysiologySim() {
        // Reset simulation
        bolusState = 0;
        document.getElementById('btn-start-phys').disabled = true;
        document.getElementById('btn-start-phys').innerText = "Simulador en Marcha";
        document.getElementById('phys-instruction-box').classList.add('hidden');
        document.getElementById('phys-success-box').classList.add('hidden');
        
        // Animate bolus to esophagus
        resetBolusUI();
        document.getElementById('bolus-pos-esophagus').className = 'w-6 h-6 rounded-full bg-amber-400 border-2 border-white z-10 transition-all duration-500 shadow-[0_0_10px_rgba(245,158,11,0.8)]';
        
        setTimeout(() => {
          triggerPhysQuestion('les');
        }, 1000);
      }

function resetBolusUI() {
        document.getElementById('bolus-pos-esophagus').className = 'w-5 h-5 rounded-full bg-slate-800 border border-slate-700 z-10 transition-all duration-500';
        document.getElementById('bolus-pos-stomach').className = 'w-5 h-5 rounded-full bg-slate-800 border border-slate-700 z-10 transition-all duration-500';
        document.getElementById('bolus-pos-duodenum').className = 'w-5 h-5 rounded-full bg-slate-800 border border-slate-700 z-10 transition-all duration-500';
        document.getElementById('sphincter-les').className = 'w-full h-1 bg-rose-500/30 border-y border-rose-500/50 flex justify-center items-center';
        document.getElementById('sphincter-pylorus').className = 'w-full h-1 bg-rose-500/30 border-y border-rose-500/50 flex justify-center items-center';
      }

function triggerPhysQuestion(checkpointId) {
        const qBox = document.getElementById('phys-question-box');
        const qTitle = document.getElementById('phys-question-title');
        const optionsCont = document.getElementById('phys-options-container');
        const feedback = document.getElementById('phys-feedback');
        
        feedback.classList.add('hidden');
        qBox.classList.remove('hidden');

qTitle.innerText = activeQ.title;
        optionsCont.innerHTML = '';
        
        activeQ.options.forEach((opt, idx) => {
          const btn = document.createElement('button');
          btn.className = 'w-full p-3 bg-slate-900 border border-slate-850 rounded-xl text-left hover:border-slate-700 transition-all text-xs font-semibold leading-relaxed';
          btn.innerText = opt.text;
          btn.onclick = () => checkPhysAnswer(opt.correct, checkpointId, btn);
          optionsCont.appendChild(btn);
        });
      }

function checkPhysAnswer(isCorrect, checkpointId, buttonEl) {
        const feedback = document.getElementById('phys-feedback');
        
        if (isCorrect) {
          buttonEl.className = 'w-full p-3 bg-emerald-950 border border-emerald-500/50 rounded-xl text-left text-emerald-400 text-xs font-bold leading-relaxed';
          feedback.innerText = "¡Respuesta correcta! Esfínter desbloqueado.";
          feedback.className = "p-3 rounded-lg text-xs font-semibold text-center mt-3 bg-emerald-950/40 text-emerald-400 border border-emerald-500/20";
          feedback.classList.remove('hidden');

setTimeout(() => {
            document.getElementById('phys-question-box').classList.add('hidden');
            advanceBolus(checkpointId);
          }, 1200);
        } else {
          buttonEl.className = 'w-full p-3 bg-rose-950 border border-rose-500/50 rounded-xl text-left text-rose-400 text-xs font-semibold leading-relaxed';
          feedback.innerText = "Incorrecto. Repase las células diana y los mecanismos hormonales.";
          feedback.className = "p-3 rounded-lg text-xs font-semibold text-center mt-3 bg-rose-950/40 text-rose-400 border border-rose-500/20";
          feedback.classList.remove('hidden');
        }
      }

function advanceBolus(checkpointId) {
        if (checkpointId === 'les') {
          // Open LES, move to stomach
          document.getElementById('sphincter-les').className = 'w-full h-1 bg-emerald-500/30 border-y border-emerald-500/50 flex justify-center items-center';
          document.getElementById('bolus-pos-esophagus').className = 'w-5 h-5 rounded-full bg-slate-800 border border-slate-700 z-10 transition-all duration-500';
          
          setTimeout(() => {
            document.getElementById('bolus-pos-stomach').className = 'w-6 h-6 rounded-full bg-amber-400 border-2 border-white z-10 transition-all duration-500 shadow-[0_0_10px_rgba(245,158,11,0.8)]';
          }, 400);

setTimeout(() => {
            triggerPhysQuestion('pylorus');
          }, 1500);

} else if (checkpointId === 'pylorus') {
          // Open pylorus, move to duodenum
          document.getElementById('sphincter-pylorus').className = 'w-full h-1 bg-emerald-500/30 border-y border-emerald-500/50 flex justify-center items-center';
          document.getElementById('bolus-pos-stomach').className = 'w-5 h-5 rounded-full bg-slate-800 border border-slate-700 z-10 transition-all duration-500';
          
          setTimeout(() => {
            document.getElementById('bolus-pos-duodenum').className = 'w-6 h-6 rounded-full bg-amber-400 border-2 border-white z-10 transition-all duration-500 shadow-[0_0_10px_rgba(245,158,11,0.8)]';
          }, 400);

setTimeout(() => {
            triggerPhysQuestion('duodenum');
          }, 1500);

} else if (checkpointId === 'duodenum') {
          // Completed simulation
          document.getElementById('bolus-pos-duodenum').className = 'w-5 h-5 rounded-full bg-slate-800 border border-slate-700 z-10 transition-all duration-500';
          document.getElementById('phys-success-box').classList.remove('hidden');
          
          document.getElementById('btn-start-phys').disabled = false;
          document.getElementById('btn-start-phys').innerText = "Reiniciar Simulación";
          
          unlockBadge('chemistry');
        }
      }

// ==================== MISSION 3: MICROBIOTA LOGIC ====================
      function chooseScenarioOption(optionNum) {
        const feedbackBox = document.getElementById('scenario-feedback-box');
        const feedbackText = document.getElementById('scenario-feedback-text');
        const choicesDiv = document.getElementById('scenario-choices');
        
        choicesDiv.classList.add('pointer-events-none', 'opacity-50');

if (scenarioIndex === 1) {
          if (optionNum === 1) {
            // Process Refined Sugar choice
            diversity = 50;
            firmicutes = 70;
            bacteroidetes = 20;
            cdiff = 10;
            feedbackText.innerText = "La dieta alta en azúcares refinados y grasas causó una proliferación rápida de Firmicutes. La diversidad bacteriana global bajó considerablemente, facilitando el estado proinflamatorio crónico que caracteriza al síndrome de intestino irritable.";
          } else {
            // Process fiber choice
            diversity = 85;
            bacteroidetes = 65;
            firmicutes = 30;
            cdiff = 5;
            feedbackText.innerText = "La fibra soluble y prebióticos aumentaron la diversidad bacteriana general. La fermentación de estas fibras por parte de Bacteroidetes genera ácidos grasos de cadena corta (AGCC) como el butirato, modulando la inflamación y mejorando el cuadro epigástrico del paciente.";
          }
        } else {
          // Scenario 2
          if (optionNum === 1) {
            // Correct therapeutic compliance
            diversity = 25;
            bacteroidetes = 15;
            firmicutes = 15;
            cdiff = 65; // C diff bloom
            feedbackText.innerText = "Completar el antibiótico eliminó el patógeno primario, pero arrasó con las poblaciones bacterianas benéficas. La pérdida de resistencia a la colonización permitió la germinación y proliferación oportunista de Clostridioides difficile, aumentando el riesgo de diarrea asociada a antibióticos. Se indica reposición inmediata con probióticos.";
          } else {
            // Incorrect early stop
            diversity = 40;
            bacteroidetes = 30;
            firmicutes = 30;
            cdiff = 10;
            feedbackText.innerHTML = '<span class="text-rose-500 font-bold">¡ALERTA DE RESISTENCIA MUTACIONAL!</span><br>Suspender el tratamiento de forma incompleta antes de la erradicación biológica permite que las bacterias supervivientes adquieran resistencia selectiva. Esto inutiliza el fármaco para futuras infecciones, un grave problema de salud pública.';
          }
        }

updateMicrobiomeUI();
        feedbackBox.classList.remove('hidden');
      }

document.getElementById('microbiome-firm-num').innerText = `${firmicutes}%`;
        document.getElementById('microbiome-firm-bar').style.width = `${firmicutes}%`;

document.getElementById('microbiome-diff-num').innerText = `${cdiff}%`;
        document.getElementById('microbiome-diff-bar').style.width = `${cdiff}%`;
      }

function nextScenario() {
        const feedbackBox = document.getElementById('scenario-feedback-box');
        const choicesDiv = document.getElementById('scenario-choices');
        
        feedbackBox.classList.add('hidden');
        choicesDiv.classList.remove('pointer-events-none', 'opacity-50');

if (scenarioIndex === 1) {
          scenarioIndex = 2;
          document.getElementById('scenario-number').innerText = "Escenario 2 de 2";
          document.getElementById('scenario-question').innerText = "Meses después, el paciente adquiere una infección de amígdalas y se le prescribe amoxicilina con ácido clavulánico por 7 días. Ante la mejoría sintomática al tercer día, ¿qué conducta terapéutica sugiere?";
          
          // Re-populate choices
          choicesDiv.innerHTML = `
            <button onclick="chooseScenarioOption(1)" class="p-4 bg-slate-900 hover:bg-slate-800/80 border border-slate-800 rounded-xl text-left transition-all">
              <h5 class="font-bold text-white mb-1">Opción A</h5>
              <p class="text-xs text-slate-400 leading-relaxed">Completar los 7 días de tratamiento farmacológico según indicación prescrita.</p>
            </button>
            <button onclick="chooseScenarioOption(2)" class="p-4 bg-slate-900 hover:bg-slate-800/80 border border-slate-800 rounded-xl text-left transition-all">
              <h5 class="font-bold text-white mb-1">Opción B</h5>
              <p class="text-xs text-slate-400 leading-relaxed">Suspender la toma de antibióticos de inmediato para evitar la disbiosis por barrido bacteriano.</p>
            </button>
          `;
        } else {
          // Finished microbiota
          document.getElementById('micro-scenario-box').classList.add('hidden');
          document.getElementById('micro-success-box').classList.remove('hidden');
          unlockBadge('eco');
        }
      }

// ==================== TAB 4: ACCORDIONS & REFLECTIONS ====================
      function toggleAccordion(id) {
        const panel = document.getElementById(id);
        const icon = document.getElementById(`${id}-icon`);
        
        if (panel.classList.contains('hidden')) {
          panel.classList.remove('hidden');
          icon.className = 'fas fa-chevron-up text-slate-400';
        } else {
          panel.classList.add('hidden');
          icon.className = 'fas fa-chevron-down text-slate-500';
        }
      }

function submitStudentReflections() {
        const chk1 = document.getElementById('chk-eval-1').checked;
        const chk2 = document.getElementById('chk-eval-2').checked;
        const chk3 = document.getElementById('chk-eval-3').checked;
        const reflectionsText = document.getElementById('eval-reflections').value;

if (!reflectionsText.trim()) {
          alert("Por favor, escriba sus observaciones en la caja de reflexiones antes de continuar.");
          return;
        }

// Save progress mock
        const progressReport = {
          anatomyBadge: matchedPairs.size === 5,
          physiologyBadge: document.getElementById('phys-success-box').classList.contains('hidden') === false,
          microbiomeBadge: document.getElementById('micro-success-box').classList.contains('hidden') === false,
          reflections: reflectionsText,
          checkedSkills: [chk1, chk2, chk3]
        };

localStorage.setItem('gastro_foundations_progress', JSON.stringify(progressReport));
        
        // Show success
        document.getElementById('eval-success-alert').classList.remove('hidden');
      }

// Initialize defaults
      document.addEventListener('DOMContentLoaded', () => {
        // Initially disable locked tabs
        document.getElementById('tab-btn-physiology').disabled = true;
        document.getElementById('tab-btn-microbiota').disabled = true;
      });
    </script>
  </body>
</html>