{"id":21,"date":"2026-10-09T20:33:05","date_gmt":"2026-10-09T20:33:05","guid":{"rendered":"https:\/\/algoritmodelalma.com\/?page_id=21"},"modified":"2026-10-09T20:33:05","modified_gmt":"2026-10-09T20:33:05","slug":"evalua-tu-inteligencia-emocional","status":"publish","type":"page","link":"https:\/\/algoritmodelalma.com\/?page_id=21","title":{"rendered":"Eval\u00faa tu inteligencia emocional"},"content":{"rendered":"\n<!DOCTYPE html>\n<html lang=\"es\">\n<head>\n    <meta charset=\"UTF-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n    <title>Test de Inteligencia Emocional<\/title>\n    <style>\n        :root {\n            --bg-cream: #F7F1EA;\n            --bg-white: #FFFFFF;\n            --text-dark: #1F1B16;\n            --brown-soft: #5C4033;\n            --beige: #E8DED2;\n            --old-rose: #C88A8A;\n            --soft-lilac: #C4B5FD;\n            --terracotta: #B86B4B;\n            --gray-text: #6B7280;\n            --gray-light: #F3F4F6;\n            --shadow-sm: 0 2px 8px rgba(31, 27, 22, 0.05);\n            --shadow-md: 0 4px 16px rgba(31, 27, 22, 0.08);\n            --shadow-lg: 0 10px 25px rgba(31, 27, 22, 0.12);\n            --radius-sm: 8px;\n            --radius-md: 16px;\n            --radius-lg: 24px;\n            --transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);\n        }\n\n        * {\n            box-sizing: border-box;\n            margin: 0;\n            padding: 0;\n            font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\n            -webkit-tap-highlight-color: transparent;\n        }\n\n        body {\n            background-color: var(--bg-cream);\n            color: var(--text-dark);\n            line-height: 1.6;\n            min-height: 100vh;\n            display: flex;\n            flex-direction: column;\n            padding-bottom: 40px;\n        }\n\n        header {\n            background: var(--bg-white);\n            border-bottom: 1px solid var(--beige);\n            position: sticky;\n            top: 0;\n            z-index: 100;\n            box-shadow: var(--shadow-sm);\n        }\n\n        .header-container {\n            max-width: 900px;\n            margin: 0 auto;\n            padding: 16px 20px;\n            display: flex;\n            justify-content: space-between;\n            align-items: center;\n        }\n\n        .brand {\n            display: flex;\n            align-items: center;\n            gap: 12px;\n        }\n\n        .brand-icon {\n            width: 40px;\n            height: 40px;\n            background: linear-gradient(135deg, var(--old-rose), var(--terracotta));\n            border-radius: 50%;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            color: white;\n            font-weight: bold;\n            font-size: 20px;\n            box-shadow: 0 2px 8px rgba(184, 107, 75, 0.3);\n        }\n\n        .brand-title {\n            font-size: 1.25rem;\n            font-weight: 700;\n            color: var(--brown-soft);\n            letter-spacing: -0.3px;\n        }\n\n        .brand-subtitle {\n            font-size: 0.8rem;\n            color: var(--gray-text);\n        }\n\n        nav {\n            display: flex;\n            gap: 8px;\n        }\n\n        .nav-btn {\n            background: transparent;\n            border: none;\n            padding: 8px 14px;\n            border-radius: 20px;\n            color: var(--gray-text);\n            font-weight: 600;\n            font-size: 0.9rem;\n            cursor: pointer;\n            transition: var(--transition);\n        }\n\n        .nav-btn:hover, .nav-btn.active {\n            background: var(--beige);\n            color: var(--brown-soft);\n        }\n\n        main {\n            max-width: 800px;\n            width: 100%;\n            margin: 24px auto 0;\n            padding: 0 16px;\n            flex: 1;\n        }\n\n        .disclaimer-card {\n            background: #FFF8F6;\n            border-left: 4px solid var(--terracotta);\n            padding: 16px 20px;\n            border-radius: var(--radius-sm);\n            margin-bottom: 24px;\n            box-shadow: var(--shadow-sm);\n            display: flex;\n            gap: 14px;\n            align-items: flex-start;\n        }\n\n        .disclaimer-icon {\n            font-size: 20px;\n            color: var(--terracotta);\n            flex-shrink: 0;\n            margin-top: 2px;\n        }\n\n        .disclaimer-text {\n            font-size: 0.88rem;\n            color: #7A4330;\n            line-height: 1.5;\n        }\n\n        .disclaimer-text strong {\n            display: block;\n            margin-bottom: 4px;\n            color: var(--brown-soft);\n        }\n\n        .card {\n            background: var(--bg-white);\n            border-radius: var(--radius-md);\n            padding: 28px;\n            box-shadow: var(--shadow-md);\n            margin-bottom: 24px;\n            border: 1px solid rgba(232, 222, 210, 0.5);\n        }\n\n        .view-section {\n            display: none;\n            animation: fadeIn 0.3s ease-out;\n        }\n\n        .view-section.active {\n            display: block;\n        }\n\n        @keyframes fadeIn {\n            from { opacity: 0; transform: translateY(8px); }\n            to { opacity: 1; transform: translateY(0); }\n        }\n\n        h1, h2, h3 {\n            color: var(--brown-soft);\n            line-height: 1.3;\n        }\n\n        .welcome-hero {\n            text-align: center;\n            padding: 20px 10px;\n        }\n\n        .welcome-hero h1 {\n            font-size: 2.1rem;\n            margin-bottom: 10px;\n        }\n\n        .welcome-hero p {\n            color: var(--gray-text);\n            font-size: 1.05rem;\n            max-width: 600px;\n            margin: 0 auto 24px;\n        }\n\n        .form-group {\n            margin-bottom: 24px;\n        }\n\n        .form-label {\n            display: block;\n            font-weight: 600;\n            margin-bottom: 10px;\n            color: var(--brown-soft);\n            font-size: 1rem;\n        }\n\n        .gender-grid {\n            display: grid;\n            grid-template-columns: 1fr 1fr;\n            gap: 16px;\n        }\n\n        .gender-option {\n            border: 2px solid var(--beige);\n            border-radius: var(--radius-sm);\n            padding: 16px;\n            text-align: center;\n            cursor: pointer;\n            transition: var(--transition);\n            background: var(--bg-cream);\n        }\n\n        .gender-option:hover {\n            border-color: var(--old-rose);\n        }\n\n        .gender-option.selected {\n            border-color: var(--terracotta);\n            background: #FFF5F0;\n            font-weight: bold;\n        }\n\n        .gender-option input {\n            display: none;\n        }\n\n        .gender-title {\n            font-size: 1.1rem;\n            color: var(--brown-soft);\n            display: block;\n            margin-bottom: 4px;\n        }\n\n        .gender-desc {\n            font-size: 0.8rem;\n            color: var(--gray-text);\n        }\n\n        .btn {\n            display: inline-flex;\n            align-items: center;\n            justify-content: center;\n            padding: 14px 28px;\n            border-radius: 30px;\n            font-size: 1rem;\n            font-weight: 600;\n            border: none;\n            cursor: pointer;\n            transition: var(--transition);\n            gap: 8px;\n            width: 100%;\n            text-decoration: none;\n        }\n\n        .btn-primary {\n            background: linear-gradient(135deg, var(--terracotta), #9E563B);\n            color: white;\n            box-shadow: 0 4px 12px rgba(184, 107, 75, 0.3);\n        }\n\n        .btn-primary:hover {\n            transform: translateY(-2px);\n            box-shadow: 0 6px 16px rgba(184, 107, 75, 0.4);\n        }\n\n        .btn-secondary {\n            background: var(--beige);\n            color: var(--brown-soft);\n        }\n\n        .btn-secondary:hover {\n            background: #DDD1C3;\n        }\n\n        .btn-outline {\n            background: transparent;\n            border: 2px solid var(--beige);\n            color: var(--brown-soft);\n        }\n\n        .btn-outline:hover {\n            border-color: var(--brown-soft);\n        }\n\n        .btn-group {\n            display: flex;\n            gap: 12px;\n            margin-top: 20px;\n        }\n\n        .quiz-header {\n            margin-bottom: 24px;\n        }\n\n        .progress-container {\n            background: var(--beige);\n            height: 10px;\n            border-radius: 5px;\n            overflow: hidden;\n            margin-bottom: 16px;\n        }\n\n        .progress-bar {\n            height: 100%;\n            background: linear-gradient(90deg, var(--old-rose), var(--terracotta));\n            width: 0%;\n            transition: width 0.3s ease;\n        }\n\n        .quiz-meta {\n            display: flex;\n            justify-content: space-between;\n            align-items: center;\n            font-size: 0.88rem;\n            color: var(--gray-text);\n        }\n\n        .dimension-badge {\n            background: var(--soft-lilac);\n            color: #4C1D95;\n            padding: 4px 12px;\n            border-radius: 12px;\n            font-weight: 600;\n            font-size: 0.8rem;\n        }\n\n        .question-box {\n            min-height: 100px;\n            display: flex;\n            align-items: center;\n            margin-bottom: 28px;\n        }\n\n        .question-text {\n            font-size: 1.3rem;\n            font-weight: 600;\n            color: var(--brown-soft);\n            line-height: 1.4;\n        }\n\n        .options-list {\n            display: flex;\n            flex-direction: column;\n            gap: 12px;\n            margin-bottom: 28px;\n        }\n\n        .option-btn {\n            background: var(--bg-cream);\n            border: 2px solid transparent;\n            padding: 16px 20px;\n            border-radius: var(--radius-sm);\n            text-align: left;\n            cursor: pointer;\n            font-size: 0.98rem;\n            color: var(--text-dark);\n            display: flex;\n            align-items: center;\n            justify-content: space-between;\n            transition: var(--transition);\n        }\n\n        .option-btn:hover {\n            border-color: var(--soft-lilac);\n            background: #FAF8F5;\n        }\n\n        .option-btn.selected {\n            background: #F3E8FF;\n            border-color: #8B5CF6;\n            color: #4C1D95;\n            font-weight: 600;\n        }\n\n        .option-number {\n            width: 28px;\n            height: 28px;\n            border-radius: 50%;\n            background: rgba(0,0,0,0.05);\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            font-size: 0.85rem;\n            font-weight: 600;\n        }\n\n        .option-btn.selected .option-number {\n            background: #8B5CF6;\n            color: white;\n        }\n\n        .results-summary {\n            display: grid;\n            gap: 20px;\n            margin-bottom: 28px;\n        }\n\n        .dimension-card {\n            background: var(--bg-cream);\n            border-radius: var(--radius-md);\n            padding: 24px;\n            border-top: 4px solid var(--terracotta);\n            box-shadow: var(--shadow-sm);\n        }\n\n        .dimension-card.atencion { border-top-color: var(--old-rose); }\n        .dimension-card.claridad { border-top-color: #8B5CF6; }\n        .dimension-card.reparacion { border-top-color: var(--terracotta); }\n\n        .dim-header {\n            display: flex;\n            justify-content: space-between;\n            align-items: flex-start;\n            margin-bottom: 12px;\n            flex-wrap: wrap;\n            gap: 8px;\n        }\n\n        .dim-title {\n            font-size: 1.2rem;\n            font-weight: 700;\n            color: var(--brown-soft);\n        }\n\n        .dim-score {\n            font-size: 1.3rem;\n            font-weight: 800;\n            color: var(--brown-soft);\n            background: var(--bg-white);\n            padding: 4px 12px;\n            border-radius: 12px;\n            box-shadow: var(--shadow-sm);\n        }\n\n        .status-pill {\n            display: inline-block;\n            padding: 6px 14px;\n            border-radius: 20px;\n            font-weight: 700;\n            font-size: 0.85rem;\n            margin-bottom: 14px;\n        }\n\n        .status-pill.adequate {\n            background: #D1FAE5;\n            color: #065F46;\n        }\n\n        .status-pill.attention-needed {\n            background: #FEF3C7;\n            color: #92400E;\n        }\n\n        .status-pill.excellent {\n            background: #E0E7FF;\n            color: #3730A3;\n        }\n\n        .dim-desc {\n            font-size: 0.95rem;\n            color: var(--text-dark);\n            margin-bottom: 16px;\n        }\n\n        .tips-box {\n            background: var(--bg-white);\n            border-radius: var(--radius-sm);\n            padding: 16px;\n            border-left: 3px solid var(--brown-soft);\n        }\n\n        .tips-title {\n            font-size: 0.9rem;\n            font-weight: 700;\n            color: var(--brown-soft);\n            margin-bottom: 8px;\n            display: flex;\n            align-items: center;\n            gap: 6px;\n        }\n\n        .tips-list {\n            padding-left: 20px;\n            font-size: 0.9rem;\n            color: var(--gray-text);\n        }\n\n        .tips-list li {\n            margin-bottom: 6px;\n        }\n\n        .edu-section {\n            margin-bottom: 24px;\n        }\n\n        .edu-card {\n            background: var(--bg-white);\n            border-radius: var(--radius-md);\n            padding: 20px;\n            margin-bottom: 16px;\n            box-shadow: var(--shadow-sm);\n            border: 1px solid var(--beige);\n        }\n\n        .history-list {\n            display: flex;\n            flex-direction: column;\n            gap: 16px;\n        }\n\n        .history-item {\n            background: var(--bg-cream);\n            padding: 20px;\n            border-radius: var(--radius-sm);\n            display: flex;\n            justify-content: space-between;\n            align-items: center;\n            flex-wrap: wrap;\n            gap: 12px;\n        }\n\n        .history-date {\n            font-size: 0.85rem;\n            color: var(--gray-text);\n        }\n\n        .history-scores {\n            display: flex;\n            gap: 12px;\n            font-size: 0.85rem;\n            font-weight: 600;\n        }\n\n        .modal-overlay {\n            position: fixed;\n            top: 0;\n            left: 0;\n            width: 100%;\n            height: 100%;\n            background: rgba(31, 27, 22, 0.5);\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            z-index: 1000;\n            opacity: 0;\n            pointer-events: none;\n            transition: opacity 0.25s ease;\n            padding: 16px;\n        }\n\n        .modal-overlay.active {\n            opacity: 1;\n            pointer-events: auto;\n        }\n\n        .modal-card {\n            background: var(--bg-white);\n            border-radius: var(--radius-md);\n            padding: 28px;\n            max-width: 440px;\n            width: 100%;\n            box-shadow: var(--shadow-lg);\n            text-align: center;\n        }\n\n        .modal-title {\n            font-size: 1.25rem;\n            margin-bottom: 12px;\n            color: var(--brown-soft);\n        }\n\n        .modal-text {\n            color: var(--gray-text);\n            font-size: 0.95rem;\n            margin-bottom: 24px;\n        }\n\n        @media (max-width: 600px) {\n            .header-container {\n                padding: 12px 16px;\n            }\n            .brand-title {\n                font-size: 1.1rem;\n            }\n            .card {\n                padding: 20px 16px;\n            }\n            .welcome-hero h1 {\n                font-size: 1.6rem;\n            }\n            .btn-group {\n                flex-direction: column;\n            }\n            .gender-grid {\n                grid-template-columns: 1fr;\n            }\n            .option-btn {\n                padding: 14px 16px;\n                font-size: 0.92rem;\n            }\n            .question-text {\n                font-size: 1.1rem;\n            }\n        }\n\n        @media print {\n            header, nav, .btn-group, .disclaimer-card, .no-print {\n                display: none !important;\n            }\n            body {\n                background: white;\n                padding: 0;\n            }\n            .card {\n                box-shadow: none;\n                border: none;\n                padding: 0;\n            }\n        }\n    <\/style>\n<\/head>\n<body>\n\n    <header>\n        <div class=\"header-container\">\n            <div class=\"brand\">\n                <div class=\"brand-icon\">IE<\/div>\n                <div>\n                    <div class=\"brand-title\">Test de Inteligencia Emocional<\/div>\n                    <div class=\"brand-subtitle\">Eval\u00faa tu inteligencia emocional<\/div>\n                <\/div>\n            <\/div>\n            <nav>\n                <button class=\"nav-btn active\" onclick=\"switchView('welcome-view')\" id=\"nav-home\">Inicio<\/button>\n                <button class=\"nav-btn\" onclick=\"switchView('edu-view')\" id=\"nav-edu\">Aprender<\/button>\n                <button class=\"nav-btn\" onclick=\"switchView('history-view')\" id=\"nav-history\">Historial<\/button>\n            <\/nav>\n        <\/div>\n    <\/header>\n\n    <main>\n        <div class=\"disclaimer-card\">\n            <div class=\"disclaimer-icon\">\u26a0\ufe0f<\/div>\n            <div class=\"disclaimer-text\">\n                <strong>Aviso importante:<\/strong>\n                Esta app es una herramienta de bienestar y autocuidado. No reemplaza atenci\u00f3n psicol\u00f3gica, m\u00e9dica ni tratamiento profesional. Si sientes que puedes hacerte da\u00f1o o est\u00e1s en peligro, busca ayuda inmediata.\n            <\/div>\n        <\/div>\n\n        <div id=\"welcome-view\" class=\"view-section active\">\n            <div class=\"card welcome-hero\">\n                <h1>Descubre tu Perfil Emocional<\/h1>\n                <p>Basado en la escala validada TMMS-24 (Trait Meta-Mood Scale), este test eval\u00faa tres destrezas esenciales: Atenci\u00f3n, Claridad y Reparaci\u00f3n Emocional.<\/p>\n                \n                <div class=\"form-group\" style=\"text-align: left; max-width: 480px; margin: 0 auto 24px;\">\n                    <label class=\"form-label\">Selecciona tu sexo biol\u00f3gico:<\/label>\n                    <p style=\"font-size: 0.82rem; color: var(--gray-text); margin-bottom: 12px;\">\n                        *Requerido para aplicar los baremos normativos de correcci\u00f3n del test TMMS-24.\n                    <\/p>\n                    <div class=\"gender-grid\">\n                        <label class=\"gender-option selected\" id=\"gender-female-label\">\n                            <input type=\"radio\" name=\"gender\" value=\"female\" checked onchange=\"updateGenderSelection('female')\">\n                            <span class=\"gender-title\">Mujer<\/span>\n                            <span class=\"gender-desc\">Baremos femeninos<\/span>\n                        <\/label>\n                        <label class=\"gender-option\" id=\"gender-male-label\">\n                            <input type=\"radio\" name=\"gender\" value=\"male\" onchange=\"updateGenderSelection('male')\">\n                            <span class=\"gender-title\">Hombre<\/span>\n                            <span class=\"gender-desc\">Baremos masculinos<\/span>\n                        <\/label>\n                    <\/div>\n                <\/div>\n\n                <div style=\"max-width: 480px; margin: 0 auto;\">\n                    <button class=\"btn btn-primary\" onclick=\"startTest()\">\n                        Comenzar Test (24 preguntas) \u2192\n                    <\/button>\n                    <div id=\"resume-banner\" style=\"display: none; margin-top: 12px;\">\n                        <button class=\"btn btn-secondary\" onclick=\"resumeTest()\">\n                            Continuar test guardado\n                        <\/button>\n                    <\/div>\n                <\/div>\n            <\/div>\n        <\/div>\n\n        <div id=\"quiz-view\" class=\"view-section\">\n            <div class=\"card\">\n                <div class=\"quiz-header\">\n                    <div class=\"progress-container\">\n                        <div class=\"progress-bar\" id=\"quiz-progress\"><\/div>\n                    <\/div>\n                    <div class=\"quiz-meta\">\n                        <span id=\"question-counter\">Pregunta 1 de 24<\/span>\n                        <span class=\"dimension-badge\" id=\"dimension-badge\">Atenci\u00f3n Emocional<\/span>\n                    <\/div>\n                <\/div>\n\n                <div class=\"question-box\">\n                    <div class=\"question-text\" id=\"question-text\">\n                        Cargando pregunta&#8230;\n                    <\/div>\n                <\/div>\n\n                <div class=\"options-list\">\n                    <button class=\"option-btn\" onclick=\"selectOption(1)\">\n                        <span>1. Nada de acuerdo<\/span>\n                        <span class=\"option-number\">1<\/span>\n                    <\/button>\n                    <button class=\"option-btn\" onclick=\"selectOption(2)\">\n                        <span>2. Algo de acuerdo<\/span>\n                        <span class=\"option-number\">2<\/span>\n                    <\/button>\n                    <button class=\"option-btn\" onclick=\"selectOption(3)\">\n                        <span>3. Bastante de acuerdo<\/span>\n                        <span class=\"option-number\">3<\/span>\n                    <\/button>\n                    <button class=\"option-btn\" onclick=\"selectOption(4)\">\n                        <span>4. Muy de acuerdo<\/span>\n                        <span class=\"option-number\">4<\/span>\n                    <\/button>\n                    <button class=\"option-btn\" onclick=\"selectOption(5)\">\n                        <span>5. Totalmente de acuerdo<\/span>\n                        <span class=\"option-number\">5<\/span>\n                    <\/button>\n                <\/div>\n\n                <div class=\"btn-group\">\n                    <button class=\"btn btn-outline\" id=\"btn-prev\" onclick=\"previousQuestion()\" style=\"width: 30%;\">\n                        \u2190 Anterior\n                    <\/button>\n                    <button class=\"btn btn-secondary\" onclick=\"showCancelModal()\" style=\"width: 70%;\">\n                        Guardar y Salir\n                    <\/button>\n                <\/div>\n            <\/div>\n        <\/div>\n\n        <div id=\"results-view\" class=\"view-section\">\n            <div class=\"card\">\n                <div style=\"text-align: center; margin-bottom: 24px;\">\n                    <h2 style=\"font-size: 1.8rem; margin-bottom: 6px;\">Tus Resultados<\/h2>\n                    <p style=\"color: var(--gray-text); font-size: 0.95rem;\">\n                        Evaluaci\u00f3n seg\u00fan el test TMMS-24 (<span id=\"result-gender-tag\">Mujer<\/span>)\n                    <\/p>\n                <\/div>\n\n                <div class=\"results-summary\" id=\"results-cards-container\">\n                    <!-- Dynamic Dimension Cards injected via JS -->\n                <\/div>\n\n                <div class=\"btn-group no-print\">\n                    <button class=\"btn btn-primary\" onclick=\"restartTest()\">\n                        Realizar el test nuevamente\n                    <\/button>\n                    <button class=\"btn btn-secondary\" onclick=\"window.print()\">\n                        Imprimir \/ Guardar en PDF\n                    <\/button>\n                <\/div>\n            <\/div>\n        <\/div>\n\n        <div id=\"edu-view\" class=\"view-section\">\n            <div class=\"card\">\n                <h2 style=\"margin-bottom: 16px;\">Comprendiendo las 3 Dimensiones<\/h2>\n                <p style=\"color: var(--gray-text); margin-bottom: 24px;\">\n                    La inteligencia emocional intraps\u00edquica seg\u00fan el modelo TMMS-24 se fundamenta en c\u00f3mo procesamos y regulamos nuestros estados de \u00e1nimo.\n                <\/p>\n\n                <div class=\"edu-card\">\n                    <h3 style=\"color: var(--old-rose); margin-bottom: 8px;\">1. Atenci\u00f3n Emocional<\/h3>\n                    <p style=\"font-size: 0.95rem; color: var(--text-dark); margin-bottom: 12px;\">\n                        Es la capacidad de sentir y expresar los sentimientos de forma adecuada. Implica tomar conciencia de nuestros estados afectivos.\n                    <\/p>\n                    <div style=\"background: var(--bg-cream); padding: 12px; border-radius: var(--radius-sm); font-size: 0.88rem;\">\n                        <strong>\ud83d\udca1 Clave del equilibrio:<\/strong> Tanto prestar poca atenci\u00f3n (desconexi\u00f3n) como prestar demasiada atenci\u00f3n (rumiaci\u00f3n) pueden ser perjudiciales. Lo ideal es una observaci\u00f3n serena sin juzgar.\n                    <\/div>\n                <\/div>\n\n                <div class=\"edu-card\">\n                    <h3 style=\"color: #8B5CF6; margin-bottom: 8px;\">2. Claridad Emocional<\/h3>\n                    <p style=\"font-size: 0.95rem; color: var(--text-dark); margin-bottom: 12px;\">\n                        Comprender bien los propios estados emocionales. Significa saber poner nombre a lo que se siente y diferenciar emociones complejas.\n                    <\/p>\n                    <div style=\"background: var(--bg-cream); padding: 12px; border-radius: var(--radius-sm); font-size: 0.88rem;\">\n                        <strong>\ud83d\udca1 Clave del equilibrio:<\/strong> Una alta claridad permite tomar mejores decisiones alineadas con tus valores y comunicar tus necesidades con asertividad.\n                    <\/div>\n                <\/div>\n\n                <div class=\"edu-card\">\n                    <h3 style=\"color: var(--terracotta); margin-bottom: 8px;\">3. Reparaci\u00f3n Emocional<\/h3>\n                    <p style=\"font-size: 0.95rem; color: var(--text-dark); margin-bottom: 12px;\">\n                        Capacidad para regular los estados emocionales correctamente, moderar los estados negativos y potenciar los positivos.\n                    <\/p>\n                    <div style=\"background: var(--bg-cream); padding: 12px; border-radius: var(--radius-sm); font-size: 0.88rem;\">\n                        <strong>\ud83d\udca1 Clave del equilibrio:<\/strong> Reparar no significa reprimir la tristeza o el enfado, sino evitar que nos paralicen y cultivar activamente el pensamiento positivo constructivo.\n                    <\/div>\n                <\/div>\n            <\/div>\n        <\/div>\n\n        <div id=\"history-view\" class=\"view-section\">\n            <div class=\"card\">\n                <div style=\"display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px;\">\n                    <h2>Historial de Evaluaciones<\/h2>\n                    <button class=\"btn btn-outline\" style=\"width: auto; padding: 6px 14px; font-size: 0.85rem;\" onclick=\"confirmClearHistory()\">\n                        Borrar historial\n                    <\/button>\n                <\/div>\n\n                <div id=\"history-container\">\n                    <p style=\"color: var(--gray-text); text-align: center; padding: 30px 0;\">\n                        A\u00fan no has completado ninguna evaluaci\u00f3n.\n                    <\/p>\n                <\/div>\n            <\/div>\n        <\/div>\n    <\/main>\n\n    <div class=\"modal-overlay\" id=\"confirm-modal\">\n        <div class=\"modal-card\">\n            <h3 class=\"modal-title\" id=\"modal-title\">\u00bfEst\u00e1s seguro?<\/h3>\n            <p class=\"modal-text\" id=\"modal-text\">Tu progreso actual del test quedar\u00e1 guardado para cuando regreses.<\/p>\n            <div class=\"btn-group\">\n                <button class=\"btn btn-secondary\" onclick=\"closeModal()\">Cancelar<\/button>\n                <button class=\"btn btn-primary\" id=\"modal-action-btn\" onclick=\"executeModalAction()\">Aceptar<\/button>\n            <\/div>\n        <\/div>\n    <\/div>\n\n    <script>\n        const QUESTIONS = [\n            \/\/ Atenci\u00f3n (1 - 8)\n            { id: 1, text: \"Presto mucha atenci\u00f3n a los sentimientos.\", dim: \"atencion\" },\n            { id: 2, text: \"Normalmente me preocupo por lo que siento.\", dim: \"atencion\" },\n            { id: 3, text: \"Normalmente dedico tiempo a pensar en mis emociones.\", dim: \"atencion\" },\n            { id: 4, text: \"Pienso que merece la pena prestar atenci\u00f3n a mis emociones.\", dim: \"atencion\" },\n            { id: 5, text: \"Dejo que mis sentimientos afecten a mis pensamientos.\", dim: \"atencion\" },\n            { id: 6, text: \"Pienso en mi estado de \u00e1nimo constantemente.\", dim: \"atencion\" },\n            { id: 7, text: \"A menudo pienso en mis sentimientos.\", dim: \"atencion\" },\n            { id: 8, text: \"Presto mucha atenci\u00f3n a c\u00f3mo me siento.\", dim: \"atencion\" },\n\n            \/\/ Claridad (9 - 16)\n            { id: 9, text: \"Tengo claros mis sentimientos.\", dim: \"claridad\" },\n            { id: 10, text: \"Frecuentemente puedo definir mis sentimientos.\", dim: \"claridad\" },\n            { id: 11, text: \"Casi siempre s\u00e9 c\u00f3mo me siento.\", dim: \"claridad\" },\n            { id: 12, text: \"Normalmente conozco mis sentimientos sobre las personas.\", dim: \"claridad\" },\n            { id: 13, text: \"A menudo me doy cuenta de mis sentimientos en diferentes situaciones.\", dim: \"claridad\" },\n            { id: 14, text: \"Siempre puedo decir c\u00f3mo me siento.\", dim: \"claridad\" },\n            { id: 15, text: \"A veces puedo decir cu\u00e1les son mis emociones.\", dim: \"claridad\" },\n            { id: 16, text: \"Puedo llegar a comprender mis sentimientos.\", dim: \"claridad\" },\n\n            \/\/ Reparaci\u00f3n (17 - 24)\n            { id: 17, text: \"Aunque a veces me siento triste, suelo tener una visi\u00f3n positiva.\", dim: \"reparacion\" },\n            { id: 18, text: \"Aunque me sienta mal, procuro pensar en cosas agradables.\", dim: \"reparacion\" },\n            { id: 19, text: \"Cuando estoy triste, pienso en todos los placeres de la vida.\", dim: \"reparacion\" },\n            { id: 20, text: \"Intento tener pensamientos positivos aunque me sienta mal.\", dim: \"reparacion\" },\n            { id: 21, text: \"Si doy demasiadas vueltas a las cosas, complic\u00e1ndolas, trato de calmarme.\", dim: \"reparacion\" },\n            { id: 22, text: \"Me preocupo por tener un buen estado de \u00e1nimo.\", dim: \"reparacion\" },\n            { id: 23, text: \"Tengo mucha energ\u00eda cuando me siento feliz.\", dim: \"reparacion\" },\n            { id: 24, text: \"Cuando estoy enfadado intento cambiar mi estado de \u00e1nimo.\", dim: \"reparacion\" }\n        ];\n\n        let currentQuestionIndex = 0;\n        let answers = {};\n        let selectedGender = \"female\";\n        let modalCallback = null;\n\n        const STORAGE_KEY_PROGRESS = \"tmms24_current_progress\";\n        const STORAGE_KEY_HISTORY = \"tmms24_test_history\";\n\n        window.addEventListener(\"DOMContentLoaded\", () => {\n            checkSavedProgress();\n            renderHistory();\n        });\n\n        function switchView(viewId) {\n            document.querySelectorAll(\".view-section\").forEach(el => el.classList.remove(\"active\"));\n            document.querySelectorAll(\".nav-btn\").forEach(el => el.classList.remove(\"active\"));\n\n            document.getElementById(viewId).classList.add(\"active\");\n\n            if (viewId === \"welcome-view\") document.getElementById(\"nav-home\").classList.add(\"active\");\n            if (viewId === \"edu-view\") document.getElementById(\"nav-edu\").classList.add(\"active\");\n            if (viewId === \"history-view\") {\n                document.getElementById(\"nav-history\").classList.add(\"active\");\n                renderHistory();\n            }\n\n            window.scrollTo({ top: 0, behavior: \"smooth\" });\n        }\n\n        function updateGenderSelection(gender) {\n            selectedGender = gender;\n            document.getElementById(\"gender-female-label\").classList.toggle(\"selected\", gender === \"female\");\n            document.getElementById(\"gender-male-label\").classList.toggle(\"selected\", gender === \"male\");\n        }\n\n        function checkSavedProgress() {\n            try {\n                const saved = localStorage.getItem(STORAGE_KEY_PROGRESS);\n                if (saved) {\n                    const data = JSON.parse(saved);\n                    if (data && data.answers && Object.keys(data.answers).length > 0) {\n                        document.getElementById(\"resume-banner\").style.display = \"block\";\n                    }\n                }\n            } catch (e) {\n                console.error(\"Error reading localStorage progress\", e);\n            }\n        }\n\n        function startTest() {\n            currentQuestionIndex = 0;\n            answers = {};\n            saveProgressLocally();\n            switchView(\"quiz-view\");\n            renderQuestion();\n        }\n\n        function resumeTest() {\n            try {\n                const saved = localStorage.getItem(STORAGE_KEY_PROGRESS);\n                if (saved) {\n                    const data = JSON.parse(saved);\n                    answers = data.answers || {};\n                    selectedGender = data.gender || \"female\";\n                    updateGenderSelection(selectedGender);\n                    \n                    \/\/ Find first unanswered question\n                    currentQuestionIndex = 0;\n                    for (let i = 0; i < QUESTIONS.length; i++) {\n                        if (!answers[QUESTIONS[i].id]) {\n                            currentQuestionIndex = i;\n                            break;\n                        }\n                    }\n                }\n            } catch (e) {\n                currentQuestionIndex = 0;\n            }\n            switchView(\"quiz-view\");\n            renderQuestion();\n        }\n\n        function saveProgressLocally() {\n            try {\n                const data = {\n                    gender: selectedGender,\n                    answers: answers,\n                    updatedAt: new Date().toISOString()\n                };\n                localStorage.setItem(STORAGE_KEY_PROGRESS, JSON.stringify(data));\n            } catch (e) {\n                console.error(\"Error saving progress\", e);\n            }\n        }\n\n        function renderQuestion() {\n            const q = QUESTIONS[currentQuestionIndex];\n            \n            \/\/ Update counter and progress bar\n            const percent = ((currentQuestionIndex + 1) \/ QUESTIONS.length) * 100;\n            document.getElementById(\"quiz-progress\").style.width = percent + \"%\";\n            document.getElementById(\"question-counter\").innerText = `Pregunta ${currentQuestionIndex + 1} de ${QUESTIONS.length}`;\n\n            \/\/ Update dimension label\n            const dimNames = {\n                atencion: \"Atenci\u00f3n Emocional\",\n                claridad: \"Claridad Emocional\",\n                reparacion: \"Reparaci\u00f3n Emocional\"\n            };\n            document.getElementById(\"dimension-badge\").innerText = dimNames[q.dim];\n\n            \/\/ Update text\n            document.getElementById(\"question-text\").innerText = `${q.id}. ${q.text}`;\n\n            \/\/ Highlight selected option if exists\n            const currentVal = answers[q.id];\n            const optionBtns = document.querySelectorAll(\".option-btn\");\n            optionBtns.forEach((btn, index) => {\n                if (currentVal === (index + 1)) {\n                    btn.classList.add(\"selected\");\n                } else {\n                    btn.classList.remove(\"selected\");\n                }\n            });\n\n            \/\/ Toggle prev button\n            document.getElementById(\"btn-prev\").style.visibility = (currentQuestionIndex === 0) ? \"hidden\" : \"visible\";\n        }\n\n        function selectOption(val) {\n            const q = QUESTIONS[currentQuestionIndex];\n            answers[q.id] = val;\n            saveProgressLocally();\n\n            \/\/ Next question or finish\n            if (currentQuestionIndex < QUESTIONS.length - 1) {\n                currentQuestionIndex++;\n                renderQuestion();\n            } else {\n                calculateAndShowResults();\n            }\n        }\n\n        function previousQuestion() {\n            if (currentQuestionIndex > 0) {\n                currentQuestionIndex--;\n                renderQuestion();\n            }\n        }\n\n        function calculateAndShowResults() {\n            \/\/ Calculate sum per dimension\n            let sumAtencion = 0;\n            let sumClaridad = 0;\n            let sumReparacion = 0;\n\n            QUESTIONS.forEach(q => {\n                const val = answers[q.id] || 0;\n                if (q.dim === \"atencion\") sumAtencion += val;\n                if (q.dim === \"claridad\") sumClaridad += val;\n                if (q.dim === \"reparacion\") sumReparacion += val;\n            });\n\n            const evalAtencion = getAtencionStatus(sumAtencion, selectedGender);\n            const evalClaridad = getClaridadStatus(sumClaridad, selectedGender);\n            const evalReparacion = getReparacionStatus(sumReparacion, selectedGender);\n\n            \/\/ Render Results UI\n            document.getElementById(\"result-gender-tag\").innerText = selectedGender === \"female\" ? \"Baremos Mujeres\" : \"Baremos Hombres\";\n\n            const container = document.getElementById(\"results-cards-container\");\n            container.innerHTML = `\n                ${renderDimensionResultCard(\"Atenci\u00f3n Emocional\", \"atencion\", sumAtencion, evalAtencion)}\n                ${renderDimensionResultCard(\"Claridad Emocional\", \"claridad\", sumClaridad, evalClaridad)}\n                ${renderDimensionResultCard(\"Reparaci\u00f3n Emocional\", \"reparacion\", sumReparacion, evalReparacion)}\n            `;\n\n            \/\/ Save to history\n            saveResultToHistory({\n                date: new Date().toLocaleDateString('es-ES', { day: '2-digit', month: 'short', year: 'numeric' }),\n                gender: selectedGender,\n                scores: {\n                    atencion: sumAtencion,\n                    claridad: sumClaridad,\n                    reparacion: sumReparacion\n                },\n                status: {\n                    atencion: evalAtencion.statusText,\n                    claridad: evalClaridad.statusText,\n                    reparacion: evalReparacion.statusText\n                }\n            });\n\n            \/\/ Clear active draft progress\n            localStorage.removeItem(STORAGE_KEY_PROGRESS);\n            document.getElementById(\"resume-banner\").style.display = \"none\";\n\n            switchView(\"results-view\");\n        }\n\n        function getAtencionStatus(score, gender) {\n            if (gender === \"male\") {\n                if (score < 21) {\n                    return {\n                        statusText: \"Debe mejorar su atenci\u00f3n (poca atenci\u00f3n)\",\n                        pillClass: \"attention-needed\",\n                        desc: \"Prestas poca atenci\u00f3n a tus emociones. Tiendes a ignorar o minimizar lo que sientes.\",\n                        tips: [\n                            \"Realiza pausas de autochequeo diario: Preg\u00fantate '\u00bfQu\u00e9 estoy sintiendo en este instante?'\",\n                            \"Conecta con tus sensaciones corporales (tensi\u00f3n, respiraci\u00f3n, presi\u00f3n).\",\n                            \"Lleva un diario emocional breve para registrar tus estados de \u00e1nimo.\"\n                        ]\n                    };\n                } else if (score <= 32) {\n                    return {\n                        statusText: \"Adecuada atenci\u00f3n\",\n                        pillClass: \"adequate\",\n                        desc: \"Sientes y reconoces tus emociones con un nivel \u00f3ptimo de atenci\u00f3n y equilibrio.\",\n                        tips: [\n                            \"Mant\u00e9n la costumbre de validar lo que sientes sin juzgarte.\",\n                            \"Escucha tus emociones como se\u00f1ales informativas \u00fatiles para tu vida cotidiana.\"\n                        ]\n                    };\n                } else {\n                    return {\n                        statusText: \"Debe mejorar su atenci\u00f3n (demasiada atenci\u00f3n)\",\n                        pillClass: \"attention-needed\",\n                        desc: \"Prestas excesiva atenci\u00f3n a tus sentimientos. Esto puede llevarte a la rumiaci\u00f3n o sobrean\u00e1lisis.\",\n                        tips: [\n                            \"Practica ejercicios de grounding (desconexi\u00f3n del bucle mental mediante actividades f\u00edsicas).\",\n                            \"Evita sobreanalizar cada variaci\u00f3n de tu estado de \u00e1nimo.\",\n                            \"Enfoca tu atenci\u00f3n en tareas pr\u00e1cticas concretas fuera de tus pensamientos.\"\n                        ]\n                    };\n                }\n            } else {\n                \/\/ female\n                if (score < 24) {\n                    return {\n                        statusText: \"Debe mejorar su atenci\u00f3n (poca atenci\u00f3n)\",\n                        pillClass: \"attention-needed\",\n                        desc: \"Prestas poca atenci\u00f3n a tus emociones. Tiendes a ignorar o minimizar lo que sientes.\",\n                        tips: [\n                            \"Realiza pausas de autochequeo diario: Preg\u00fantate '\u00bfQu\u00e9 estoy sintiendo en este instante?'\",\n                            \"Conecta con tus sensaciones corporales (tensi\u00f3n, respiraci\u00f3n, presi\u00f3n).\",\n                            \"Lleva un diario emocional breve para registrar tus estados de \u00e1nimo.\"\n                        ]\n                    };\n                } else if (score <= 35) {\n                    return {\n                        statusText: \"Adecuada atenci\u00f3n\",\n                        pillClass: \"adequate\",\n                        desc: \"Sientes y reconoces tus emociones con un nivel \u00f3ptimo de atenci\u00f3n y equilibrio.\",\n                        tips: [\n                            \"Mant\u00e9n la costumbre de validar lo que sientes sin juzgarte.\",\n                            \"Escucha tus emociones como se\u00f1ales informativas \u00fatiles para tu vida cotidiana.\"\n                        ]\n                    };\n                } else {\n                    return {\n                        statusText: \"Debe mejorar su atenci\u00f3n (demasiada atenci\u00f3n)\",\n                        pillClass: \"attention-needed\",\n                        desc: \"Prestas excesiva atenci\u00f3n a tus sentimientos. Esto puede llevarte a la rumiaci\u00f3n o sobrean\u00e1lisis.\",\n                        tips: [\n                            \"Practica ejercicios de grounding (desconexi\u00f3n del bucle mental mediante actividades f\u00edsicas).\",\n                            \"Evita sobreanalizar cada variaci\u00f3n de tu estado de \u00e1nimo.\",\n                            \"Enfoca tu atenci\u00f3n en tareas pr\u00e1cticas concretas fuera de tus pensamientos.\"\n                        ]\n                    };\n                }\n            }\n        }\n\n        function getClaridadStatus(score, gender) {\n            const isMale = gender === \"male\";\n            const lowThreshold = isMale ? 25 : 23;\n            const highThreshold = isMale ? 35 : 34;\n\n            if (score < lowThreshold) {\n                return {\n                    statusText: \"Debe mejorar su claridad\",\n                    pillClass: \"attention-needed\",\n                    desc: \"Te cuesta comprender e identificar con precisi\u00f3n cu\u00e1les son tus estados emocionales.\",\n                    tips: [\n                        \"Ampl\u00eda tu vocabulario emocional utilizando una rueda de emociones.\",\n                        \"Intenta ponerle un nombre espec\u00edfico a lo que sientes (ej. 'me siento decepcionado' en lugar de 'me siento mal').\",\n                        \"Preg\u00fantate qu\u00e9 situaci\u00f3n desencaden\u00f3 el estado emocional.\"\n                    ]\n                };\n            } else if (score <= highThreshold) {\n                return {\n                    statusText: \"Adecuada claridad\",\n                    pillClass: \"adequate\",\n                    desc: \"Comprendes bien tus estados emocionales y sabes identificar lo que sientes en la mayor\u00eda de situaciones.\",\n                    tips: [\n                        \"Utiliza tu claridad emocional para comunicar tus l\u00edmites de forma asertiva.\",\n                        \"Reflexiona sobre los valores que hay detr\u00e1s de las emociones que identificas.\"\n                    ]\n                };\n            } else {\n                return {\n                    statusText: \"Excelente claridad\",\n                    pillClass: \"excellent\",\n                    desc: \"Tienes una comprensi\u00f3n sobresaliente de tus emociones y las de las personas a tu alrededor.\",\n                    tips: [\n                        \"Aprovecha este conocimiento para la toma de decisiones conscientes.\",\n                        \"Apoya a personas cercanas ayud\u00e1ndolas a clarificar c\u00f3mo se sienten.\"\n                    ]\n                };\n            }\n        }\n\n        function getReparacionStatus(score, gender) {\n            const isMale = gender === \"male\";\n            const lowThreshold = 23; \/\/ both 23\n            const highThreshold = isMale ? 35 : 34;\n\n            if (score < lowThreshold) {\n                return {\n                    statusText: \"Debe mejorar su reparaci\u00f3n\",\n                    pillClass: \"attention-needed\",\n                    desc: \"Te cuesta regular tus emociones negativas o recuperar un estado de \u00e1nimo positivo cuando est\u00e1s desanimado\/a.\",\n                    tips: [\n                        \"Crea tu 'botiqu\u00edn emocional' con actividades simples que te reconforten (pasear, escuchar m\u00fasica, respirar).\",\n                        \"Practica la reestructuraci\u00f3n cognitiva: \u00bfHay otra forma m\u00e1s amable de ver esta situaci\u00f3n?\",\n                        \"No reprimas la emoci\u00f3n, pero proponte una acci\u00f3n peque\u00f1a para cambiar el enfoque.\"\n                    ]\n                };\n            } else if (score <= highThreshold) {\n                return {\n                    statusText: \"Adecuada reparaci\u00f3n\",\n                    pillClass: \"adequate\",\n                    desc: \"Eres capaz de regular tus estados emocionales correctamente y mantener una actitud constructiva.\",\n                    tips: [\n                        \"Sigue cultivando h\u00e1bitos de autocompasi\u00f3n y descanso adecuado.\",\n                        \"Mant\u00e9n tus estrategias efectivas para sobrellevar momentos de estr\u00e9s.\"\n                    ]\n                };\n            } else {\n                return {\n                    statusText: \"Excelente reparaci\u00f3n\",\n                    pillClass: \"excellent\",\n                    desc: \"Posees una gran capacidad para regular tus emociones y recuperarte de los contratiempos con resiliencia.\",\n                    tips: [\n                        \"Comparte tus t\u00e9cnicas de autorregulaci\u00f3n con otros.\",\n                        \"Aseg\u00farate de permitirte sentir tristeza o enfado cuando sea natural, sin forzar siempre el positivismo.\"\n                    ]\n                };\n            }\n        }\n\n        function renderDimensionResultCard(title, className, score, evalData) {\n            const tipsHtml = evalData.tips.map(t => `<li>${t}<\/li>`).join(\"\");\n            return `\n                <div class=\"dimension-card ${className}\">\n                    <div class=\"dim-header\">\n                        <div>\n                            <div class=\"dim-title\">${title}<\/div>\n                            <span class=\"status-pill ${evalData.pillClass}\">${evalData.statusText}<\/span>\n                        <\/div>\n                        <div class=\"dim-score\">${score} \/ 40<\/div>\n                    <\/div>\n                    <p class=\"dim-desc\">${evalData.desc}<\/p>\n                    <div class=\"tips-box\">\n                        <div class=\"tips-title\">\ud83d\udca1 Consejos y Recomendaciones Educativas:<\/div>\n                        <ul class=\"tips-list\">\n                            ${tipsHtml}\n                        <\/ul>\n                    <\/div>\n                <\/div>\n            `;\n        }\n\n        function saveResultToHistory(resultObj) {\n            try {\n                let history = [];\n                const saved = localStorage.getItem(STORAGE_KEY_HISTORY);\n                if (saved) {\n                    history = JSON.parse(saved);\n                }\n                history.unshift(resultObj); \/\/ Add to start\n                localStorage.setItem(STORAGE_KEY_HISTORY, JSON.stringify(history));\n            } catch (e) {\n                console.error(\"Error saving history\", e);\n            }\n        }\n\n        function renderHistory() {\n            const container = document.getElementById(\"history-container\");\n            try {\n                const saved = localStorage.getItem(STORAGE_KEY_HISTORY);\n                if (!saved) {\n                    container.innerHTML = `<p style=\"color: var(--gray-text); text-align: center; padding: 30px 0;\">A\u00fan no has completado ninguna evaluaci\u00f3n.<\/p>`;\n                    return;\n                }\n\n                const history = JSON.parse(saved);\n                if (history.length === 0) {\n                    container.innerHTML = `<p style=\"color: var(--gray-text); text-align: center; padding: 30px 0;\">A\u00fan no has completado ninguna evaluaci\u00f3n.<\/p>`;\n                    return;\n                }\n\n                let html = '<div class=\"history-list\">';\n                history.forEach((item, index) => {\n                    const g = item.gender === \"female\" ? \"Mujer\" : \"Hombre\";\n                    html += `\n                        <div class=\"history-item\">\n                            <div>\n                                <strong>Evaluaci\u00f3n #${history.length - index}<\/strong> (${g})\n                                <div class=\"history-date\">${item.date}<\/div>\n                            <\/div>\n                            <div class=\"history-scores\">\n                                <span>Atenci\u00f3n: ${item.scores.atencion}<\/span> |\n                                <span>Claridad: ${item.scores.claridad}<\/span> |\n                                <span>Reparaci\u00f3n: ${item.scores.reparacion}<\/span>\n                            <\/div>\n                        <\/div>\n                    `;\n                });\n                html += '<\/div>';\n                container.innerHTML = html;\n            } catch (e) {\n                container.innerHTML = `<p style=\"color: var(--gray-text); text-align: center; padding: 30px 0;\">Error al cargar historial.<\/p>`;\n            }\n        }\n\n        function confirmClearHistory() {\n            showModal(\n                \"\u00bfBorrar historial?\",\n                \"Se eliminar\u00e1n permanentemente todas tus evaluaciones guardadas de la memoria local.\",\n                () => {\n                    localStorage.removeItem(STORAGE_KEY_HISTORY);\n                    renderHistory();\n                }\n            );\n        }\n\n        function restartTest() {\n            startTest();\n        }\n\n        function showCancelModal() {\n            showModal(\n                \"\u00bfGuardar y salir?\",\n                \"Tu avance quedar\u00e1 guardado para cuando quieras volver a continuar.\",\n                () => {\n                    switchView(\"welcome-view\");\n                    checkSavedProgress();\n                }\n            );\n        }\n\n        function showModal(title, text, action) {\n            document.getElementById(\"modal-title\").innerText = title;\n            document.getElementById(\"modal-text\").innerText = text;\n            modalCallback = action;\n            document.getElementById(\"confirm-modal\").classList.add(\"active\");\n        }\n\n        function closeModal() {\n            document.getElementById(\"confirm-modal\").classList.remove(\"active\");\n            modalCallback = null;\n        }\n\n        function executeModalAction() {\n            if (modalCallback) modalCallback();\n            closeModal();\n        }\n    <\/script>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Test de Inteligencia Emocional IE Test de Inteligencia Emocional Eval\u00faa tu inteligencia emocional Inicio Aprender Historial \u26a0\ufe0f Aviso importante: Esta [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-21","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/algoritmodelalma.com\/index.php?rest_route=\/wp\/v2\/pages\/21","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/algoritmodelalma.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/algoritmodelalma.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/algoritmodelalma.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/algoritmodelalma.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=21"}],"version-history":[{"count":1,"href":"https:\/\/algoritmodelalma.com\/index.php?rest_route=\/wp\/v2\/pages\/21\/revisions"}],"predecessor-version":[{"id":22,"href":"https:\/\/algoritmodelalma.com\/index.php?rest_route=\/wp\/v2\/pages\/21\/revisions\/22"}],"wp:attachment":[{"href":"https:\/\/algoritmodelalma.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=21"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}