:root {
    --aena-green: #78B82A;
    --bg-color: #F4F6F8;
    --text-color: #333333;
    --correct-color: #4CAF50;
    --wrong-color: #F44336;
}

* { box-sizing: border-box; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; }

body { margin: 0; padding: 0; background-color: var(--bg-color); color: var(--text-color); }

.contenedor { display: none; padding: 20px; max-width: 600px; margin: 0 auto; min-height: 100vh; flex-direction: column; }
.contenedor.active { display: flex; }

/* INICIO */
.logo-aena { font-size: 24px; font-weight: bold; color: var(--aena-green); text-align: center; margin-top: 40px; }
h1 { text-align: center; font-size: 22px; margin-bottom: 5px; }
p { text-align: center; color: #666; margin-bottom: 40px; }
.info-examen { text-align: center; font-size: 13px; color: #888; margin-top: 30px; }

/* BOTONES */
button { border: none; border-radius: 12px; padding: 16px; font-size: 16px; font-weight: 600; cursor: pointer; transition: all 0.2s; width: 100%; margin-bottom: 15px; }
.btn-principal { background-color: var(--aena-green); color: white; box-shadow: 0 4px 6px rgba(120, 184, 42, 0.3); }
.btn-secundario { background-color: white; color: var(--text-color); border: 2px solid #ddd; }
.btn-blanco { background-color: transparent; color: #666; text-decoration: underline; font-weight: normal; margin-top: 15px; }

/* TEST */
.cabecera-test { display: flex; justify-content: space-between; font-weight: bold; font-size: 14px; margin-bottom: 20px; color: #555; }
.tarjeta-pregunta { background: white; padding: 20px; border-radius: 16px; box-shadow: 0 4px 10px rgba(0,0,0,0.05); }
#enunciado { font-size: 18px; margin-top: 0; margin-bottom: 25px; line-height: 1.4; }

.opcion-btn { background-color: #f9f9f9; border: 2px solid #eee; text-align: left; padding: 16px; margin-bottom: 10px; color: #444; }
.opcion-btn:disabled { cursor: not-allowed; }
.opcion-btn.correcta { background-color: var(--correct-color); color: white; border-color: var(--correct-color); }
.opcion-btn.incorrecta { background-color: var(--wrong-color); color: white; border-color: var(--wrong-color); }

/* RESULTADOS */
.estadisticas-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; margin: 30px 0; }
.stat-box { background: white; padding: 20px 10px; border-radius: 12px; text-align: center; font-weight: bold; font-size: 14px; box-shadow: 0 2px 5px rgba(0,0,0,0.05); }
.aciertos span { color: var(--correct-color); display: block; font-size: 24px; margin-top: 5px;}
.fallos span { color: var(--wrong-color); display: block; font-size: 24px; margin-top: 5px;}
.blancos span { color: #888; display: block; font-size: 24px; margin-top: 5px;}
.nota-final { font-size: 28px; text-align: center; font-weight: 800; color: var(--aena-green); margin-bottom: 40px; }
.mt-2 { margin-top: 20px; }

/* NUEVA NAVEGACIÓN TEST */
.navegacion-test { display: flex; gap: 10px; margin-top: 25px; width: 100%; }
.btn-nav { flex: 1; background-color: #e2e8f0; color: #333; border: none; border-radius: 10px; padding: 16px 10px; font-weight: 700; cursor: pointer; transition: 0.2s; font-size: 15px; margin-bottom: 0;}
.btn-nav:active { background-color: #cbd5e1; }
.btn-nav.primary { background-color: var(--aena-green); color: white; box-shadow: 0 4px 6px rgba(120, 184, 42, 0.3); }
.btn-nav.primary:active { background-color: #5c8d20; }