.progress-fill width: 0%; height: 100%; background: #4d9eff; box-shadow: 0 0 5px #3e8eff; transition: width 0.3s ease;
text: "En una situación de emergencia en Circus Baby's, tú...", options: [ "Analizo el problema fríamente y busco la salida lógica.", "Intento manipular a otros para que resuelvan el problema por mí.", "Me lanzo a ayudar aunque me ponga en riesgo.", "Oculto mis errores y finjo que todo está bien." ] ,
/* Resultado final */ .result-container padding: 20px 30px 35px; text-align: center;
/* Header */ .header background: #03060c; padding: 20px 25px; text-align: center; border-bottom: 3px solid #6bc2ff; test de que personaje de fnaf sister location eres
/* Panel de preguntas */ .question-panel padding: 25px 30px 20px;
text: "¿Qué es lo que más valoras?", options: [ "La lealtad y la familia (aunque sea disfuncional).", "La inteligencia y la supervivencia ante todo.", "El espectáculo y el cariño del público.", "El control y mantener los secretos a salvo." ] ,
.option-prefix font-weight: bold; background: #1f2e3f; width: 32px; height: 32px; display: inline-flex; align-items: center; justify-content: center; border-radius: 30px; color: #8db5e3; .progress-fill width: 0%
.header h1 margin: 0; font-size: 1.8rem; letter-spacing: 2px; color: #e0f2fe; text-shadow: 0 0 6px #00a6ff; font-weight: 700;
// Mapeo de respuestas a personajes (cada opción suma puntos a un personaje) // Orden de personajes: [Baby, Ballora, FuntimeFreddy, FuntimeFoxy, Ennard, Michael] const POINTS_MATRIX = [ // Pregunta 0 [ baby:2, ennard:1, michael:1 , // analizo fríamente baby:1, funtime_foxy:2 , // manipulo michael:2, funtime_freddy:1 , // ayudar arriesgándome ennard:2, ballora:1 ], // oculto errores // Pregunta 1 - roles [ funtime_freddy:2, baby:1 , // líder rudo ballora:2, ennard:1 , // observa sombras funtime_foxy:2, baby:1 , // entretener michael:2, ennard:1 ], // técnico meticuloso // Pregunta 2 - defectos [ funtime_freddy:2, ennard:1 , // controlador baby:2, funtime_foxy:1 , // orgulloso aprobación ennard:2, funtime_foxy:1 , // mentiroso michael:2, ballora:1 ], // inocente confiado // Pregunta 3 - herramienta [ funtime_freddy:2, michael:1 , // garra fuerza baby:2, funtime_foxy:1 , // voz persuasiva funtime_foxy:2, ennard:1 , // gancho desaparecer ennard:2, michael:1 ], // diseño modular // Pregunta 4 - valores [ michael:2, ballora:1 , // lealtad familia baby:2, ennard:2 , // inteligencia y supervivencia funtime_freddy:2, funtime_foxy:1 , // espectáculo ennard:2, ballora:1 ], // control y secretos // Pregunta 5 - final favorito SL [ ballora:1, ennard:2 , // final privado (observar) funtime_freddy:1, michael:1 , // electrocutado ennard:2, baby:1 , // scooping room baby:2, funtime_foxy:1 ] // helado para Elizabeth ];
<!DOCTYPE html> <html lang="es"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes"> <title>Test: ¿Qué personaje de FNaF Sister Location eres?</title> <style> * box-sizing: border-box; font-family: 'Segoe UI', 'Courier New', monospace; body background: linear-gradient(145deg, #0a0f1e 0%, #0c1222 100%); min-height: 100vh; display: flex; justify-content: center; align-items: center; padding: 20px; margin: 0; box-shadow: 0 0 5px #3e8eff
<script> // ----- DEFINICIÓN DEL TEST ----- const QUESTIONS = [
.restart-btn background: #4d2f5e; border: none; padding: 14px 30px; border-radius: 60px; font-size: 1rem; font-weight: bold; color: #f2e9ff; margin-top: 20px; cursor: pointer; transition: 0.2s;
text: "¿Qué rol prefieres en un equipo?", options: [ "El líder que da órdenes (aunque a veces parezca rudo).", "El que observa desde las sombras y sabe secretos.", "El que entretiene y hace reír a los demás.", "El técnico meticuloso que arregla todo." ] ,