.quiz-page{padding:8rem 0 6rem;min-height:100vh;background:linear-gradient(135deg,#f2efe9,#fff)}.container{padding:0 1.5rem}.quiz-header{text-align:center;margin-bottom:3rem}.badge{background:#c5a0651a;color:var(--color-primary);padding:.5rem 1rem;border-radius:50px;font-weight:600;font-size:.9rem;display:inline-block;margin-bottom:1rem}.quiz-header h1{font-size:2.5rem;color:var(--color-dark);margin-bottom:1rem;line-height:1.2}@media(min-width:768px){.quiz-header h1{font-size:3rem}}.quiz-header p{color:var(--color-text-muted);font-size:1.1rem;max-width:600px;margin:0 auto;line-height:1.6}.quiz-container{max-width:700px;margin:0 auto;position:relative;min-height:600px}.quiz-card{background:#fff;border-radius:24px;padding:2rem;text-align:center;box-shadow:0 20px 40px #00000014;border:1px solid rgba(255,255,255,.8);transition:all .5s ease;opacity:0;transform:translateY(20px);pointer-events:none;position:absolute;width:100%;top:0;left:0}@media(min-width:768px){.quiz-card{padding:3rem}}.quiz-card.active{opacity:1;transform:translateY(0);pointer-events:all;position:relative}.hidden{display:none}.icon-box{width:80px;height:80px;background:var(--color-dark);color:var(--color-primary);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:2.5rem;margin:0 auto 2rem;box-shadow:0 10px 20px #1c253233}.quiz-info{display:flex;justify-content:center;flex-wrap:wrap;gap:1.5rem;margin:2rem 0;color:var(--color-text-muted);font-weight:500}.quiz-info span{display:flex;align-items:center;gap:.5rem;white-space:nowrap}.question-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;color:var(--color-text-muted);font-weight:600;font-size:.9rem}.difficulty-badge{background:#eee;padding:.3rem .8rem;border-radius:6px;font-size:.75rem;text-transform:uppercase;font-weight:700;letter-spacing:.5px}.difficulty-badge.nivel-3{background:#fff3e0;color:#e65100}.progress-bar{width:100%;height:8px;background:#f0f0f0;border-radius:4px;margin-bottom:2rem;overflow:hidden}.progress-fill{height:100%;background:var(--color-primary);width:0%;transition:width .3s ease;border-radius:4px}.quiz-card h3{font-size:1.3rem;color:var(--color-dark);margin-bottom:2rem;line-height:1.5;font-family:var(--font-serif)}@media(min-width:768px){.quiz-card h3{font-size:1.6rem}}.options-grid{display:grid;gap:1rem;margin-bottom:2rem}.option-btn{background:#fff;border:1px solid rgba(0,0,0,.1);padding:1.2rem 1.5rem;border-radius:16px;text-align:left;font-size:1.05rem;color:var(--color-text);cursor:pointer;transition:all .2s ease;font-family:var(--font-main);box-shadow:0 4px 6px #00000005;position:relative;overflow:hidden}.option-btn:hover:not(:disabled){background:#f8fafc;border-color:var(--color-primary);transform:translateY(-2px);box-shadow:0 8px 15px #c5a06526}.option-btn:active:not(:disabled){transform:translateY(0)}.option-btn.correct{background:#e8f5e9;border-color:#4caf50;color:#2e7d32;font-weight:600}.option-btn.wrong{background:#ffebee;border-color:#ef5350;color:#c62828;opacity:.8}.feedback{background:#f8f9fa;padding:1.5rem;border-radius:16px;margin-top:1rem;text-align:left;border-left:5px solid #ccc;opacity:0;transform:translateY(10px);transition:all .3s ease;box-shadow:0 4px 12px #0000000d}.feedback.visible{opacity:1;transform:translateY(0)}.feedback.correct{border-color:#4caf50;background:#f1f8e9}.feedback.wrong{border-color:#ef5350;background:#ffebee}.feedback p{margin-bottom:1.5rem;color:var(--color-text);line-height:1.6}.score-circle{width:140px;height:140px;border-radius:50%;border:6px solid var(--color-primary);background:#fff;display:flex;align-items:center;justify-content:center;margin:0 auto 2.5rem;font-size:3.5rem;font-weight:700;color:var(--color-dark);flex-direction:column;line-height:1;box-shadow:0 10px 30px #c5a06533}.score-circle .total{font-size:1.1rem;color:var(--color-text-muted);font-weight:400;margin-top:.5rem;opacity:.7}.app-cta{margin-top:3rem;padding-top:2rem;border-top:1px solid rgba(0,0,0,.05)}.app-cta h3{font-size:1.4rem;margin-bottom:.5rem;color:var(--color-dark)}.app-buttons{display:flex;justify-content:center;gap:1rem;flex-wrap:wrap;margin-top:1.5rem}.restart-link{background:none;border:none;color:var(--color-text-muted);text-decoration:underline;margin-top:2rem;cursor:pointer;font-size:1rem;padding:.5rem;transition:color .3s}.restart-link:hover{color:var(--color-primary)}.fade-in-up{animation:fadeInUp .6s ease-out forwards}.delay-1{animation-delay:.1s}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}