Spaces:

doctorlinux
/

cibertest

Sleeping

App Files Files Community

doctorlinux commited on Oct 14, 2025

Commit

6ff7c96

verified ·

1 Parent(s): 74dbd0b

Upload index.html

Browse files

Files changed (1) hide show

index.html +310 -430

index.html CHANGED Viewed

@@ -1,457 +1,337 @@
 <!DOCTYPE html>
 <html lang="es">
 <head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>DoctorLinux - Cuestionario de Seguridad</title>
-    <style>
-        * {
-            margin: 0;
-            padding: 0;
-            box-sizing: border-box;
-            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
-        }
-        body {
-            background: linear-gradient(135deg, #1a2a6c, #2a3a7c);
-            color: #fff;
-            min-height: 100vh;
-            padding: 20px;
-        }
-        .container {
-            max-width: 1000px;
-            margin: 0 auto;
-            background: rgba(255, 255, 255, 0.1);
-            backdrop-filter: blur(10px);
-            border-radius: 20px;
-            padding: 40px;
-            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
-            border: 1px solid rgba(255, 255, 255, 0.2);
-        }
-        header {
-            text-align: center;
-            margin-bottom: 40px;
-        }
-        .logo {
-            font-size: 2.5rem;
-            font-weight: 700;
-            margin-bottom: 10px;
-            color: #4fc3f7;
-        }
-        .subtitle {
-            font-size: 1.2rem;
-            opacity: 0.8;
-            margin-bottom: 10px;
-        }
-        .progress-bar {
-            width: 100%;
-            height: 8px;
-            background: rgba(255, 255, 255, 0.2);
-            border-radius: 4px;
-            margin: 20px 0;
-            overflow: hidden;
-        }
-        .progress {
-            height: 100%;
-            background: linear-gradient(to right, #4fc3f7, #2979ff);
-            width: 0%;
-            transition: width 0.3s ease;
-        }
-        .question-section {
-            display: none;
-        }
-        .question-section.active {
-            display: block;
-        }
-        .question {
-            background: rgba(255, 255, 255, 0.05);
-            padding: 25px;
-            border-radius: 15px;
-            margin-bottom: 25px;
-            border-left: 4px solid #4fc3f7;
-        }
-        .question h3 {
-            margin-bottom: 15px;
-            color: #4fc3f7;
-            font-size: 1.3rem;
-        }
-        .options {
-            display: flex;
-            flex-direction: column;
-            gap: 12px;
-        }
-        .option {
-            padding: 15px 20px;
-            background: rgba(255, 255, 255, 0.1);
-            border: 2px solid rgba(255, 255, 255, 0.2);
-            border-radius: 10px;
-            cursor: pointer;
-            transition: all 0.3s ease;
-        }
-        .option:hover {
-            background: rgba(255, 255, 255, 0.15);
-            border-color: #4fc3f7;
-        }
-        .option.selected {
-            background: rgba(79, 195, 247, 0.2);
-            border-color: #4fc3f7;
-        }
-        .text-input {
-            width: 100%;
-            padding: 15px;
-            background: rgba(255, 255, 255, 0.1);
-            border: 2px solid rgba(255, 255, 255, 0.2);
-            border-radius: 10px;
-            color: white;
-            font-size: 1rem;
-            margin-top: 10px;
-        }
-        .text-input::placeholder {
-            color: rgba(255, 255, 255, 0.6);
-        }
-        .navigation {
-            display: flex;
-            justify-content: space-between;
-            margin-top: 30px;
-        }
-        .btn {
-            padding: 15px 30px;
-            background: linear-gradient(to right, #4fc3f7, #2979ff);
-            color: white;
-            border: none;
-            border-radius: 50px;
-            font-size: 1rem;
-            font-weight: 600;
-            cursor: pointer;
-            transition: all 0.3s ease;
-        }
-        .btn:hover {
-            transform: translateY(-2px);
-            box-shadow: 0 5px 15px rgba(41, 121, 255, 0.4);
-        }
-        .btn-secondary {
-            background: rgba(255, 255, 255, 0.1);
-            border: 2px solid rgba(255, 255, 255, 0.3);
-        }
-        .btn:disabled {
-            opacity: 0.5;
-            cursor: not-allowed;
-            transform: none;
-        }
-        .results-section {
-            display: none;
-            text-align: center;
-        }
-        .results-section.active {
-            display: block;
-        }
-        .results-section h2 {
-            color: #4fc3f7;
-            margin-bottom: 20px;
-            font-size: 2rem;
-        }
-        .download-btn {
-            display: inline-block;
-            background: linear-gradient(to right, #4fc3f7, #2979ff);
-            color: white;
-            padding: 18px 50px;
-            font-size: 1.3rem;
-            font-weight: 600;
-            border: none;
-            border-radius: 50px;
-            cursor: pointer;
-            transition: all 0.3s ease;
-            text-decoration: none;
-            margin: 20px 0;
-            box-shadow: 0 5px 15px rgba(41, 121, 255, 0.4);
-        }
-        .download-btn:hover {
-            transform: translateY(-3px);
-            box-shadow: 0 8px 20px rgba(41, 121, 255, 0.6);
-        }
-        .features {
-            display: grid;
-            grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
-            gap: 20px;
-            margin-top: 30px;
-        }
-        .feature {
-            background: rgba(255, 255, 255, 0.05);
-            padding: 20px;
-            border-radius: 10px;
-            text-align: center;
-        }
-        .feature-icon {
-            font-size: 2.5rem;
-            margin-bottom: 10px;
-            color: #4fc3f7;
-        }
-    </style>
 </head>
-<body>
-    <div class="container">
-        <header>
-            <div class="logo">DoctorLinux</div>
-            <div class="subtitle">Cuestionario de Evaluación de Seguridad</div>
-            <div class="progress-bar">
-                <div class="progress" id="progress"></div>
-            </div>
-        </header>
-        <!-- SECCIÓN 1: INFRAESTRUCTURA -->
-        <div class="question-section active" id="section-1">
-            <div class="question">
-                <h3>1. ¿Qué tipo de infraestructura utilizas principalmente?</h3>
-                <div class="options">
-                    <div class="option" data-value="onprem">Servidores físicos on-premise</div>
-                    <div class="option" data-value="cloud">Infraestructura en la nube (AWS, Azure, GCP)</div>
-                    <div class="option" data-value="hybrid">Infraestructura híbrida</div>
-                    <div class="option" data-value="virtual">Servidores virtualizados</div>
-                </div>
-            </div>
-            <div class="question">
-                <h3>2. ¿Cuántos servidores gestionas actualmente?</h3>
-                <div class="options">
-                    <div class="option" data-value="1-5">1-5 servidores</div>
-                    <div class="option" data-value="6-20">6-20 servidores</div>
-                    <div class="option" data-value="21-50">21-50 servidores</div>
-                    <div class="option" data-value="50+">Más de 50 servidores</div>
-                </div>
-            </div>
-            <div class="navigation">
-                <button class="btn btn-secondary" disabled>Anterior</button>
-                <button class="btn" onclick="nextSection(1)">Siguiente</button>
-            </div>
-        </div>
-        <!-- SECCIÓN 2: SEGURIDAD DE RED -->
-        <div class="question-section" id="section-2">
-            <div class="question">
-                <h3>3. ¿Cómo gestionas los firewalls en tu infraestructura?</h3>
-                <div class="options">
-                    <div class="option" data-value="enterprise">Firewall empresarial dedicado</div>
-                    <div class="option" data-value="cloud">Firewalls cloud nativos</div>
-                    <div class="option" data-value="basic">Firewall básico del sistema</div>
-                    <div class="option" data-value="none">Sin firewall configurado</div>
-                </div>
-            </div>
-            <div class="question">
-                <h3>4. ¿Qué políticas de acceso tienes implementadas?</h3>
-                <div class="options">
-                    <div class="option" data-value="mfa">MFA (Autenticación de múltiples factores)</div>
-                    <div class="option" data-value="vpn">Acceso solo por VPN</div>
-                    <div class="option" data-value="ip">Restricción por IP</div>
-                    <div class="option" data-value="basic">Usuario y contraseña básicos</div>
-                </div>
-            </div>
-            <div class="navigation">
-                <button class="btn btn-secondary" onclick="prevSection(2)">Anterior</button>
-                <button class="btn" onclick="nextSection(2)">Siguiente</button>
-            </div>
-        </div>
-        <!-- SECCIÓN 3: BACKUP Y RECUPERACIÓN -->
-        <div class="question-section" id="section-3">
-            <div class="question">
-                <h3>5. ¿Qué estrategia de backup implementas?</h3>
-                <div class="options">
-                    <div class="option" data-value="321">Estrategia 3-2-1 (3 copias, 2 medios, 1 externa)</div>
-                    <div class="option" data-value="cloud">Backup en la nube</div>
-                    <div class="option" data-value="local">Backup local solamente</div>
-                    <div class="option" data-value="none">Sin estrategia definida</div>
-                </div>
-            </div>
-            <div class="question">
-                <h3>6. ¿Con qué frecuencia realizas backups?</h3>
-                <div class="options">
-                    <div class="option" data-value="daily">Diariamente</div>
-                    <div class="option" data-value="weekly">Semanalmente</div>
-                    <div class="option" data-value="monthly">Mensualmente</div>
-                    <div class="option" data-value="rarely">Ocasionalmente</div>
-                </div>
-            </div>
-            <div class="navigation">
-                <button class="btn btn-secondary" onclick="prevSection(3)">Anterior</button>
-                <button class="btn" onclick="nextSection(3)">Siguiente</button>
-            </div>
-        </div>
-        <!-- SECCIÓN 4: GESTIÓN DE PARCHES -->
-        <div class="question-section" id="section-4">
-            <div class="question">
-                <h3>7. ¿Cómo gestionas las actualizaciones de seguridad?</h3>
-                <div class="options">
-                    <div class="option" data-value="auto">Actualizaciones automáticas</div>
-                    <div class="option" data-value="manual">Actualizaciones manuales programadas</div>
-                    <div class="option" data-value="testing">Testing antes de implementar</div>
-                    <div class="option" data-value="rarely">Actualizaciones poco frecuentes</div>
-                </div>
-            </div>
-            <div class="question">
-                <h3>8. ¿Qué sistemas operativos utilizas principalmente?</h3>
-                <div class="options">
-                    <div class="option" data-value="linux">Distribuciones Linux</div>
-                    <div class="option" data-value="windows">Windows Server</div>
-                    <div class="option" data-value="mixed">Mixed (Linux y Windows)</div>
-                    <div class="option" data-value="other">Otros sistemas</div>
-                </div>
-            </div>
-            <div class="navigation">
-                <button class="btn btn-secondary" onclick="prevSection(4)">Anterior</button>
-                <button class="btn" onclick="nextSection(4)">Siguiente</button>
-            </div>
-        </div>
-        <!-- SECCIÓN 5: MONITOREO Y DETECCIÓN -->
-        <div class="question-section" id="section-5">
-            <div class="question">
-                <h3>9. ¿Qué sistema de monitoreo utilizas?</h3>
-                <div class="options">
-                    <div class="option" data-value="siem">SIEM empresarial</div>
-                    <div class="option" data-value="monitoring">Herramientas de monitoreo (Zabbix, Nagios)</div>
-                    <div class="option" data-value="basic">Monitoreo básico del sistema</div>
-                    <div class="option" data-value="none">Sin sistema de monitoreo</div>
-                </div>
-            </div>
-            <div class="question">
-                <h3>10. ¿Tienes políticas de respuesta a incidentes?</h3>
-                <div class="options">
-                    <div class="option" data-value="documented">Políticas documentadas y probadas</div>
-                    <div class="option" data-value="basic">Procedimientos básicos establecidos</div>
-                    <div class="option" data-value="informal">Procedimientos informales</div>
-                    <div class="option" data-value="none">Sin políticas definidas</div>
-                </div>
-            </div>
-            <div class="navigation">
-                <button class="btn btn-secondary" onclick="prevSection(5)">Anterior</button>
-                <button class="btn" onclick="showResults()">Generar Análisis</button>
-            </div>
-        </div>
-        <!-- SECCIÓN DE RESULTADOS -->
-        <div class="results-section" id="results-section">
-            <h2>Análisis de Seguridad Completado</h2>
-            <p>Hemos evaluado tu infraestructura basado en tus respuestas</p>
-            <a href="#" class="download-btn">Descargar Análisis IA Avanzado</a>
-            <div class="features">
-                <div class="feature">
-                    <div class="feature-icon">📊</div>
-                    <div>Evaluación Personalizada</div>
-                </div>
-                <div class="feature">
-                    <div class="feature-icon">🔒</div>
-                    <div>Recomendaciones de Seguridad</div>
-                </div>
-                <div class="feature">
-                    <div class="feature-icon">🤖</div>
-                    <div>Análisis con IA</div>
-                </div>
-                <div class="feature">
-                    <div class="feature-icon">⚡</div>
-                    <div>Plan de Acción</div>
-                </div>
-            </div>
-        </div>
-    </div>
-    <script>
-        let currentSection = 1;
-        const totalSections = 5;
-        const userAnswers = {};
-        // Inicializar opciones
-        document.querySelectorAll('.option').forEach(option => {
-            option.addEventListener('click', function() {
-                // Remover selección anterior en la misma pregunta
-                const question = this.closest('.question');
-                question.querySelectorAll('.option').forEach(opt => {
-                    opt.classList.remove('selected');
-                });
-                // Seleccionar nueva opción
-                this.classList.add('selected');
-                // Guardar respuesta
-                const questionText = question.querySelector('h3').textContent;
-                userAnswers[questionText] = this.getAttribute('data-value');
-            });
-        });
-        function updateProgress() {
-            const progress = (currentSection / totalSections) * 100;
-            document.getElementById('progress').style.width = `${progress}%`;
-        }
-        function nextSection(current) {
-            if (current === currentSection) {
-                document.getElementById(`section-${currentSection}`).classList.remove('active');
-                currentSection++;
-                document.getElementById(`section-${currentSection}`).classList.add('active');
-                updateProgress();
-            }
-        }
-        function prevSection(current) {
-            if (current === currentSection) {
-                document.getElementById(`section-${currentSection}`).classList.remove('active');
-                currentSection--;
-                document.getElementById(`section-${currentSection}`).classList.add('active');
-                updateProgress();
-            }
-        }
-        function showResults() {
-            document.getElementById(`section-${currentSection}`).classList.remove('active');
-            document.getElementById('results-section').classList.add('active');
-            document.getElementById('progress').style.width = '100%';
-            // Aquí procesaríamos las respuestas y generaríamos el análisis
-            console.log('Respuestas del usuario:', userAnswers);
-        }
-        // Inicializar progreso
-        updateProgress();
-    </script>
 </body>
 </html>

 <!DOCTYPE html>
 <html lang="es">
 <head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<title>Autoevaluación de Ciberseguridad Operativa - Doctor Linux</title>
+<style>
+  body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Inter,Arial,sans-serif;background:#f5f6f5;margin:0;padding:0}
+  .dlx-wrap{max-width:960px;margin:auto;padding:16px}
+  .dlx-card{background:#fff;border:1px solid #e6ebef;border-radius:16px;box-shadow:0 6px 24px rgba(0,0,0,.06);padding:22px;margin:14px 0}
+  .dlx-title{font-size:28px;margin:0 0 4px;color:#214424}
+  .dlx-sub{color:#5c6b5f;margin-bottom:16px}
+  .dlx-progress{height:10px;background:#eff4f0;border-radius:999px;overflow:hidden;margin:10px 0 18px}
+  .dlx-bar{height:100%;width:0;background:#7fbf7f;transition:width .3s}
+  .dlx-q h4{margin:0 0 6px;font-size:18px}
+  .dlx-options{display:flex;gap:10px;flex-wrap:wrap;margin:6px 0 12px}
+  .dlx-pill{border:1px solid #d7e1d9;padding:8px 12px;border-radius:999px;cursor:pointer}
+  .dlx-pill input{display:none}
+  .dlx-pill.active{background:#214424;color:#fff;border-color:#214424}
+  .dlx-nav{display:flex;gap:10px;justify-content:space-between;margin-top:8px}
+  .dlx-btn{background:#214424;color:#fff;border:none;border-radius:10px;padding:12px 16px;cursor:pointer;transition:all 0.3s}
+  .dlx-btn:hover{background:#1a361c}
+  .dlx-btn[disabled]{opacity:.5;cursor:not-allowed}
+  .dlx-meter{display:grid;grid-template-columns:1fr auto;gap:6px 10px;margin:8px 0}
+  .dlx-badge{font-weight:600}
+  .dlx-tag{display:inline-block;background:#eff4f0;border:1px solid #dfe9e2;border-radius:8px;padding:6px 10px;margin:6px 6px 0 0}
+  .dlx-note{color:#6a786d}
+  .dlx-score{font-size:40px;font-weight:800;color:#214424}
+  .dlx-muted{color:#7b8b7f}
+</style>
 </head>
+<body>
+<div class="dlx-wrap" id="dlxApp">
+  <div class="dlx-card">
+    <h2 class="dlx-title">Autoevaluación de Ciberseguridad Operativa</h2>
+    <div class="dlx-sub">Responde con honestidad. Obtendrás tu <b>puntaje</b>, los <b>riesgos clave</b> y un plan sugerido de mejora.</div>
+    <div class="dlx-progress"><div class="dlx-bar" id="dlxBar"></div></div>
+    <div class="dlx-note dlx-muted" id="dlxStepNote"></div>
+  </div>
+  <div id="dlxSteps"></div>
+  <div class="dlx-card" id="dlxNavBox">
+    <div class="dlx-nav">
+      <button class="dlx-btn" id="prevBtn">← Anterior</button>
+      <button class="dlx-btn" id="nextBtn">Siguiente →</button>
+    </div>
+  </div>
+  <div class="dlx-card" id="dlxResult" style="display:none">
+    <h3 class="dlx-title">Tu diagnóstico</h3>
+    <div class="dlx-sub">Este resultado es orientativo. Si quieres un informe firmado por ingeniería, solicita el <b>diagnóstico gratuito</b>.</div>
+    <div style="display:flex;gap:24px;align-items:center;flex-wrap:wrap">
+      <div>
+        <div class="dlx-muted">Puntaje global</div>
+        <div class="dlx-score" id="dlxScore">—%</div>
+        <div class="dlx-tag" id="dlxLabel">—</div>
+      </div>
+      <div style="flex:1;min-width:260px">
+        <div class="dlx-progress"><div class="dlx-bar" id="dlxBarFinal" style="background:#3aa655"></div></div>
+        <div class="dlx-note">≈ Mayor a 80%: postura sólida. 60–79%: revisar. Menor a 60%: riesgo elevado.</div>
+      </div>
+    </div>
+    <div class="dlx-card" style="margin-top:16px">
+      <h4 style="margin:0 0 8px">Detalle por dominio</h4>
+      <div id="dlxBreakdown" class="dlx-meter"></div>
+    </div>
+    <div class="dlx-card">
+      <h4 style="margin:0 0 8px">Recomendaciones inmediatas</h4>
+      <div id="dlxRecs"></div>
+      <div class="dlx-note" style="margin-top:8px">Tip: prioriza los dominios con menor puntaje. Podemos ayudarte a cerrar brechas con <b>hardening, firewalls, backups 3-2-1 y monitoreo 24/7</b>.</div>
+    </div>
+    <!-- BOTONES DE ACCIÓN SIMPLIFICADOS -->
+    <div class="dlx-nav" style="margin-top:25px">
+      <button class="dlx-btn" onclick="window.location.reload()">🔄 Nueva Evaluación</button>
+      <button class="dlx-btn" id="analyzeBtn">🤖 Análisis con IA</button>
+      <button class="dlx-btn" onclick="downloadPDF()" style="background:#3aa655">📄 Descargar PDF</button>
+    </div>
+    <div id="iaBox" class="dlx-card" style="display:none;margin-top:16px">
+      <h4>Análisis generado por IA</h4>
+      <pre id="iaOutput" style="white-space:pre-wrap;"></pre>
+    </div>
+  </div>
+</div>
+<script>
+/* === CONFIGURACIÓN INICIAL === */
+const DOMAINS = [
+  { id:'perimetro',  name:'Perímetro / Firewall', qs:[
+    '¿Usas un firewall dedicado (Mikrotik/OPNsense/etc.) con reglas mínimas por servicio?',
+    '¿Tienes listas de acceso/geo-bloqueo/IPS/DoS activas?',
+    '¿Los servicios expuestos están detrás de NAT o Port-Forward controlado?',
+    '¿Hay políticas VPN de acceso remoto con 2FA?'
+  ]},
+  { id:'servers', name:'Servidores / Hardening', qs:[
+    '¿Cuentas con hardening básico (SSH seguro, usuarios/roles, auditoría)?',
+    '¿Actualizaciones y parches aplicados regularmente?',
+    '¿Servicios innecesarios deshabilitados/controlados?'
+  ]},
+  { id:'backups', name:'Backups y Recuperación', qs:[
+    '¿Aplicas la regla 3-2-1 (3 copias, 2 medios, 1 offsite)?',
+    '¿Pruebas de restauración realizadas en los últimos 6 meses?',
+    '¿Backups protegidos contra ransomware (inmutables/air-gap)?'
+  ]},
+  { id:'monitor', name:'Monitoreo y Alertas', qs:[
+    '¿Monitoreo centralizado (Zabbix/PRTG/Grafana) con alertas 24/7?',
+    '¿Métricas revisadas mensualmente?',
+    '¿Alertas integradas con soporte?'
+  ]},
+  { id:'network', name:'Red y Conectividad', qs:[
+    '¿Segmentación VLANs para aislar servicios críticos?',
+    '¿Control de ancho de banda/Proxy/filtrado de contenidos?',
+    '¿Wi-Fi empresarial con WPA2-Enterprise?'
+  ]},
+  { id:'endpoints', name:'Usuarios / Estaciones', qs:[
+    '¿Antimalware/EDR y políticas de actualización?',
+    '¿Gestión de contraseñas y MFA?',
+    '¿Políticas de mínimo privilegio + bloqueo de USB?'
+  ]},
+  { id:'webmail', name:'Web y Correo', qs:[
+    '¿Sitios con HTTPS válido y cabeceras seguras?',
+    '¿Correo con SPF, DKIM y DMARC publicados?',
+    '¿WAF/antispam/antiphishing activos?'
+  ]}
+];
+const SCALE = [
+  {label:'No',score:0},
+  {label:'Parcial',score:50},
+  {label:'Sí',score:100},
+  {label:'No sé',score:null}
+];
+const RECS = {
+  perimetro:'Endurecer perímetro: reglas mínimo necesario, VPN 2FA, IDS/IPS y protección DoS.',
+  servers:'Aplicar hardening, cuentas/roles y mantener parches al día.',
+  backups:'Implementar 3-2-1 con pruebas de restauración y backups inmutables.',
+  monitor:'Centralizar monitoreo (Zabbix/PRTG) y definir umbrales.',
+  network:'Segregar VLANs, reforzar proxy y aislar Wi-Fi invitados.',
+  endpoints:'Mínimo privilegio, EDR/antimalware y MFA.',
+  webmail:'Forzar HTTPS, cabeceras OWASP, SPF+DKIM+DMARC y WAF.'
+};
+let current = 0, answers = {};
+const steps = document.getElementById('dlxSteps'),
+      bar = document.getElementById('dlxBar'),
+      note = document.getElementById('dlxStepNote'),
+      prev = document.getElementById('prevBtn'),
+      next = document.getElementById('nextBtn'),
+      result = document.getElementById('dlxResult'),
+      nav = document.getElementById('dlxNavBox');
+/* === FUNCIONES PRINCIPALES === */
+function render() {
+  steps.innerHTML = '';
+  const d = DOMAINS[current];
+  note.innerHTML = `<b>${current+1}/${DOMAINS.length}</b> · ${d.name}`;
+  const card = document.createElement('div');
+  card.className = 'dlx-card';
+  card.innerHTML = `<h3 class="dlx-title">${d.name}</h3>`;
+  d.qs.forEach((q, i) => {
+    const b = document.createElement('div');
+    b.className = 'dlx-q';
+    b.innerHTML = `<h4>${q}</h4>`;
+    const row = document.createElement('div');
+    row.className = 'dlx-options';
+    SCALE.forEach(opt => {
+      const lbl = document.createElement('label');
+      lbl.className = 'dlx-pill';
+      lbl.textContent = opt.label;
+      lbl.onclick = () => {
+        row.querySelectorAll('.dlx-pill').forEach(p => p.classList.remove('active'));
+        lbl.classList.add('active');
+        if (!answers[d.id]) answers[d.id] = [];
+        answers[d.id][i] = opt.score;
+        updateButtons();
+      };
+      if (answers[d.id] && answers[d.id][i] === opt.score) lbl.classList.add('active');
+      row.appendChild(lbl);
+    });
+    b.appendChild(row);
+    card.appendChild(b);
+  });
+  steps.appendChild(card);
+  bar.style.width = Math.round(current / DOMAINS.length * 100) + '%';
+  updateButtons();
+}
+function allAnswered(i) {
+  const d = DOMAINS[i];
+  return answers[d.id] && answers[d.id].length === d.qs.length && answers[d.id].every(v => v !== undefined);
+}
+function avg(a) {
+  const nums = a.filter(v => typeof v === 'number' && isFinite(v));
+  if (nums.length === 0) return 0;
+  return nums.reduce((x, y) => x + y, 0) / nums.length;
+}
+function updateButtons() {
+  prev.disabled = current === 0;
+  const last = current === DOMAINS.length - 1;
+  next.textContent = last ? 'Ver resultado →' : 'Siguiente →';
+  next.disabled = !allAnswered(current);
+}
+prev.onclick = () => { if (current > 0) { current--; render(); } };
+next.onclick = () => {
+  if (current < DOMAINS.length - 1) {
+    if (!allAnswered(current)) return;
+    current++; render();
+  } else {
+    if (!allAnswered(current)) return;
+    showResult();
+  }
+};
+function showResult() {
+  bar.style.width = '100%';
+  nav.style.display = 'none';
+  steps.style.display = 'none';
+  note.style.display = 'none';
+  result.style.display = 'block';
+  let weighted = 0, total = 0;
+  const breakdown = document.getElementById('dlxBreakdown'),
+        recs = document.getElementById('dlxRecs');
+  breakdown.innerHTML = '';
+  recs.innerHTML = '';
+  DOMAINS.forEach(d => {
+    const a = answers[d.id] ? avg(answers[d.id]) : 0;
+    weighted += a; total += 100;
+    const pct = Math.round(a);
+    breakdown.innerHTML += `<div>${d.name}</div><div><b>${pct}%</b></div>`;
+    if (pct < 75) { recs.innerHTML += `<div class="dlx-tag">• ${RECS[d.id]}</div>`; }
+  });
+  const global = Math.round(weighted / DOMAINS.length);
+  document.getElementById('dlxScore').textContent = global + '%';
+  document.getElementById('dlxBarFinal').style.width = global + '%';
+  const label = document.getElementById('dlxLabel');
+  if (global >= 80) { label.textContent = 'Nivel Sólido'; label.style.background = '#e7f7e7'; }
+  else if (global >= 60) { label.textContent = 'Nivel Medio (revisar)'; label.style.background = '#fff6e1'; }
+  else { label.textContent = 'Riesgo Alto'; label.style.background = '#ffe9e9'; }
+  // Guardar datos para el análisis IA
+  window.finalData = {
+    overall: global,
+    domains: DOMAINS.map(d => ({
+      name: d.name,
+      score: Math.round(avg(answers[d.id]))
+    }))
+  };
+}
+/* === DESCARGAR PDF SIMPLIFICADO === */
+function downloadPDF() {
+  const global = window.finalData.overall;
+  const date = new Date().toLocaleDateString('es-ES');
+  // Crear contenido simple para el PDF
+  const content = `
+    INFORME DE CIBERSEGURIDAD - DOCTOR LINUX
+    ========================================
+    Fecha: ${date}
+    Puntaje Global: ${global}%
+    RESUMEN:
+    ${global >= 80 ? '✅ POSTURA SÓLIDA' : global >= 60 ? '⚠️ MEJORAS NECESARIAS' : '🚨 RIESGO ELEVADO'}
+    DETALLE POR DOMINIO:
+    ${window.finalData.domains.map(d => `• ${d.name}: ${d.score}%`).join('\n')}
+    RECOMENDACIONES:
+    1. Revisar configuración de firewall y accesos
+    2. Implementar estrategia de backups 3-2-1
+    3. Establecer monitoreo continuo 24/7
+    4. Aplicar hardening en servidores
+    5. Implementar autenticación multifactor
+    ---
+    Generado por Doctor Linux - www.doctorlinux.com
+  `;
+  // Crear y descargar archivo de texto simple
+  const blob = new Blob([content], { type: 'text/plain' });
+  const url = URL.createObjectURL(blob);
+  const a = document.createElement('a');
+  a.href = url;
+  a.download = `informe-ciberseguridad-${date}.txt`;
+  document.body.appendChild(a);
+  a.click();
+  document.body.removeChild(a);
+  URL.revokeObjectURL(url);
+  alert('📄 Informe descargado como archivo de texto');
+}
+/* === ANÁLISIS CON IA === */
+document.getElementById('analyzeBtn').onclick = async function() {
+  const box = document.getElementById('iaBox');
+  const out = document.getElementById('iaOutput');
+  const btn = this;
+  box.style.display = 'block';
+  out.textContent = 'Generando análisis detallado...';
+  btn.disabled = true;
+  try {
+    const res = await fetch('/analyze', {
+      method: 'POST',
+      headers: {'Content-Type': 'application/json'},
+      body: JSON.stringify(window.finalData)
+    });
+    if (res.ok) {
+      const data = await res.json();
+      out.textContent = data.analysis || 'Análisis completado.';
+    } else {
+      throw new Error('Error del servidor');
+    }
+  } catch (error) {
+    out.textContent = 'El análisis detallado no está disponible en este momento.\n\nPuntaje: ' + window.finalData.overall + '%\n\nPara un diagnóstico completo, contacta a Doctor Linux.';
+  } finally {
+    btn.disabled = false;
+  }
+};
+// Inicializar aplicación
+render();
+</script>
 </body>
 </html>