*{margin:0;padding:0;box-sizing:border-box}body{font-family:Arial,sans-serif;background:#000;min-height:100vh;color:#fff;line-height:1.6;overflow-x:hidden}.app{min-height:100vh;width:100%;background:#000}.name-entry{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;background:linear-gradient(45deg,#000,#001a00)}.name-container{text-align:center;max-width:600px;width:100%}.name-title{font-size:4rem;font-weight:900;color:#0f8;margin-bottom:20px;text-transform:uppercase;letter-spacing:3px}.name-subtitle{font-size:1.5rem;color:#00d4ff;margin-bottom:50px;font-weight:300}.name-input-container{margin:40px 0}.name-input{width:100%;max-width:400px;padding:20px;font-size:1.5rem;text-align:center;border:3px solid #00ff88;border-radius:15px;background:#000;color:#fff;margin-bottom:30px;transition:all .3s ease}.name-input:focus{outline:none;border-color:#00d4ff;transform:scale(1.05)}.start-btn{background:#000;border:3px solid #00ff88;border-radius:15px;color:#0f8;padding:20px 60px;font-size:1.3rem;font-weight:700;cursor:pointer;transition:all .3s ease;text-transform:uppercase;letter-spacing:2px}.start-btn:hover:not(:disabled){background:#0f8;color:#000;transform:translateY(-5px)}.start-btn:disabled{opacity:.5;cursor:not-allowed}.quiz-container{min-height:100vh;width:100%;padding:20px;display:flex;flex-direction:column;align-items:center;justify-content:center}.header{text-align:center;margin-bottom:40px;width:100%}.header h1{font-size:3rem;font-weight:900;color:#0f8;margin-bottom:10px}.user-welcome{color:#00d4ff;font-size:1.2rem}.question-container{text-align:center;margin-bottom:40px;width:100%}.question{font-size:4rem;font-weight:900;color:#fff;margin-bottom:30px}.controls{display:flex;gap:20px;margin-bottom:30px;flex-wrap:wrap;justify-content:center;width:100%;max-width:500px}.btn{background:#000;border:2px solid #00ff88;border-radius:10px;color:#0f8;padding:15px 30px;font-size:1.1rem;font-weight:700;cursor:pointer;transition:all .3s ease;flex:1;min-width:180px}.btn:hover:not(:disabled){background:#0f8;color:#000;transform:translateY(-2px)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn.voice{border-color:#00d4ff;color:#00d4ff}.btn.voice:hover:not(:disabled){background:#00d4ff;color:#000}.btn.secondary{border-color:#ff6b6b;color:#ff6b6b}.btn.secondary:hover:not(:disabled){background:#ff6b6b;color:#000}.input-container{margin-bottom:30px;width:100%;max-width:400px}.answer-input{width:100%;padding:20px;font-size:1.8rem;text-align:center;border:3px solid #00ff88;border-radius:10px;background:#000;color:#fff;font-weight:700}.answer-input:focus{outline:none;border-color:#00d4ff}.voice-feedback{text-align:center;min-height:30px;margin:20px 0;font-size:1.1rem;color:#00d4ff;font-weight:600}.result{text-align:center;margin:30px 0;min-height:60px;font-size:1.3rem;font-weight:700;width:100%}.result.correct{color:#0f8}.result.wrong{color:#ff6b6b}.stats{display:flex;justify-content:space-around;margin:30px 0;padding:20px;width:100%;max-width:600px;border-top:2px solid #00ff88;border-bottom:2px solid #00ff88}.stat{text-align:center}.stat-value{font-size:2.5rem;font-weight:900;display:block;color:#0f8}.stat-label{font-size:.9rem;color:#666;text-transform:uppercase;letter-spacing:1px;margin-top:5px}.recognition-status{text-align:center;margin:20px 0;padding:15px;border-radius:10px;background:#00ff881a;color:#0f8;font-size:1rem;font-weight:600;border:1px solid #00ff88}.accessibility-notice{text-align:center;margin-top:30px;padding:15px;background:#00ff880d;border-radius:10px;font-size:.9rem;color:#666;border:1px solid rgba(0,255,136,.2);max-width:500px;width:100%}.gsap-fade-in{opacity:0}.gsap-slide-up{opacity:0;y:50}.gsap-scale-in{opacity:0;scale:.8}.gsap-bounce{opacity:0}@media (max-width: 768px){.name-title{font-size:2.5rem}.name-subtitle{font-size:1.2rem}.name-input{font-size:1.2rem;padding:15px}.header h1{font-size:2.2rem}.question{font-size:2.8rem}.controls{flex-direction:column;align-items:center}.btn{min-width:250px;width:100%}.answer-input{font-size:1.5rem;padding:15px}.stats{flex-direction:column;gap:20px}.stat-value{font-size:2rem}}@media (max-width: 480px){.quiz-container{padding:10px}.name-title{font-size:2rem}.question{font-size:2.2rem}.btn{padding:12px 20px;font-size:1rem}}.btn:focus-visible,.answer-input:focus-visible,.name-input:focus-visible,.start-btn:focus-visible{outline:3px solid #00d4ff;outline-offset:2px}