[MODO] Actúa como un desarrollador de juegos HTML5 experto en gamificación educativa y diseño UI/UX (Neumorphism).
[AUDIENCIA] Docente de Ciencias Naturales (grado 6°) sobre "El Universo".
[TAREA] Crea un juego del "Ahorcado" en un único archivo HTML que sea educativo y evaluativo.
[TECNOLOGÍAS]
1. **Archivo Único**: HTML + CSS + JavaScript.
2. **Estilos**: **Neumorphism** (fondo #E0E5EC, sombras claras/oscuras).
3. **SVG**: Usa SVG para dibujar las 5 partes del ahorcado (5 vidas).
4. **Tailwind CSS**: Desde CDN.
[BANCO DE PALABRAS (Niveles)]
El banco debe ser un objeto JS con 3 niveles (facil, medio, dificil).
**IMPORTANTE**: El docente debe poblar estas listas con 10 (fácil), 15 (medio) y 20 (difícil) palabras.
const wordBank = {
"facil": [
// ... (El docente debe añadir 10 preguntas aquí)
{ "palabra": "SOL", "pista": "Es la estrella en el centro de nuestro Sistema Solar." },
{ "palabra": "LUNA", "pista": "Es el satélite natural de la Tierra." }
],
"medio": [
// ... (El docente debe añadir 15 preguntas aquí)
{ "palabra": "PLANETA", "pista": "Cuerpo celeste que orbita una estrella (ej. Tierra)." },
{ "palabra": "GALAXIA", "pista": "Enorme conjunto de estrellas, gas y polvo (ej. Vía Láctea)." }
],
"dificil": [
// ... (El docente debe añadir 20 preguntas aquí)
{ "palabra": "NEBULOSA", "pista": "Nube de gas y polvo donde nacen las estrellas." },
{ "palabra": "BIGBANG", "pista": "La teoría de la gran explosión que originó el universo." }
]
};
[MECÁNICA DEL JUEGO (EVALUATIVA)]
1. **Panel de Estadísticas (Visible siempre)**:
- **Vidas**: 5 Vidas iniciales (mostrar 5 iconos de corazón ❤️).
- **Puntaje**: Acumulativo (ej. +100 por acierto).
- **Conteo**: Preguntas (ej. "Pregunta 3 / 10").
2. **Panel de Pista/Pregunta (Visible siempre)**:
- Debe haber un panel visible en todo momento que muestre la `pista` (la pregunta) de la palabra actual.
3. **Niveles de Dificultad**:
- 3 botones (Fácil, Medio, Difícil).
- Al elegir, se carga el banco de palabras correspondiente.
4. **Botones de Control (Visibles siempre)**:
- "Reiniciar Juego": Resetea el nivel actual.
- "Abandonar": Termina el juego inmediatamente y muestra el modal de calificación final.
5. **Flujo de Adivinar**:
- Vidas (errores) permitidos: 5.
6. **Modal de Retroalimentación (Por Ronda)**:
- Al ganar o perder una palabra, mostrar un modal.
- **Contenido**: Título ("¡Correcto!" o "¡Fallaste!"), La palabra correcta, y la `pista` (retroalimentación).
- **Acción**: Botón "Siguiente Pregunta".
7. **Modal de Fin de Juego (Final)**:
- Mostrar cuando se completen TODAS las palabras o al "Abandonar".
- **Contenido**: Mensaje de felicitación, Puntaje final, Calificación (0.0 a 5.0), Mensaje motivacional.
- **Acción**: Botón "Jugar de Nuevo" (resetea todo el juego).