*{margin:0;padding:0;box-sizing:border-box}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background:linear-gradient(135deg,#667eea,#764ba2);min-height:100vh;padding:20px}.loading{display:flex;justify-content:center;align-items:center;height:100vh;font-size:24px;color:#fff;font-weight:600}.quiz-container{max-width:900px;margin:0 auto;background:#fff;border-radius:20px;box-shadow:0 20px 40px #0000001a;overflow:hidden;animation:slideIn .5s ease-out}@keyframes slideIn{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.quiz-header{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:30px;text-align:center}.quiz-header h1{font-size:2.5rem;margin-bottom:20px;font-weight:700}.quiz-info{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;font-size:1.1rem;font-weight:500}.progress-bar{width:100%;height:8px;background:#ffffff4d;border-radius:4px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,#4caf50,#45a049);border-radius:4px;transition:width .3s ease}.question-section{padding:40px}.question-text{font-size:1.4rem;line-height:1.6;margin-bottom:30px;color:#333;font-weight:600}.options-container{display:flex;flex-direction:column;gap:15px;margin-bottom:30px}.option-btn{display:flex;align-items:center;padding:20px;border:2px solid #e0e0e0;border-radius:12px;background:#fff;cursor:pointer;transition:all .3s ease;font-size:1rem;text-align:left;position:relative;overflow:hidden}.option-btn:hover{border-color:#667eea;transform:translateY(-2px);box-shadow:0 8px 25px #667eea26}.option-btn.selected{border-color:#667eea;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.option-btn.correct{border-color:#4caf50;background:linear-gradient(135deg,#4caf50,#45a049);color:#fff}.option-btn.incorrect{border-color:#f44336;background:linear-gradient(135deg,#f44336,#d32f2f);color:#fff}.option-btn:disabled{cursor:not-allowed}.option-letter{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background:#0000001a;font-weight:700;margin-right:15px;flex-shrink:0}.option-btn.selected .option-letter,.option-btn.correct .option-letter,.option-btn.incorrect .option-letter{background:#fff3}.option-text{flex:1;line-height:1.5}.result-feedback{padding:20px;border-radius:12px;margin-bottom:20px;animation:fadeIn .5s ease}.result-feedback.correct{background:linear-gradient(135deg,#4caf50,#45a049);color:#fff}.result-feedback.incorrect{background:linear-gradient(135deg,#f44336,#d32f2f);color:#fff}.feedback-content{display:flex;align-items:center;gap:10px}.feedback-icon{font-size:1.5rem}.feedback-text{font-size:1.1rem;font-weight:500}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.quiz-actions{display:flex;justify-content:center;gap:20px}.navigation-buttons{display:flex;gap:15px;flex-wrap:wrap;justify-content:center;align-items:center}.nav-btn,.next-btn,.restart-btn,.show-answer-btn,.skip-btn{padding:12px 25px;font-size:1rem;font-weight:600;border:none;border-radius:12px;cursor:pointer;transition:all .3s ease;min-width:120px}.nav-btn{background:linear-gradient(135deg,#6c757d,#5a6268);color:#fff}.nav-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 25px #6c757d4d}.nav-btn:disabled{background:#ccc;cursor:not-allowed;transform:none;box-shadow:none;opacity:.6}.next-btn,.restart-btn{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.next-btn:hover,.restart-btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px #667eea4d}.next-btn:disabled{background:#ccc;cursor:not-allowed;transform:none;box-shadow:none}.show-answer-btn{background:linear-gradient(135deg,#ffc107,#e0a800);color:#333}.show-answer-btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px #ffc1074d}.skip-btn{background:linear-gradient(135deg,#6c757d,#5a6268);color:#fff}.skip-btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px #6c757d4d}.score-summary{text-align:center;margin-bottom:30px}.score-summary h2{font-size:2rem;margin-bottom:20px}.final-score{display:flex;flex-direction:column;align-items:center;gap:10px;margin-bottom:20px}.score-text{font-size:1.5rem;font-weight:600}.percentage{font-size:1.2rem;opacity:.9}.grade{padding:15px 30px;border-radius:12px;font-size:1.3rem;font-weight:700;margin-top:10px}.grade.pass{background:linear-gradient(135deg,#4caf50,#45a049);color:#fff}.grade.fail{background:linear-gradient(135deg,#f44336,#d32f2f);color:#fff}.results-section{padding:0 40px 20px;max-height:500px;overflow-y:auto}.results-section h3{font-size:1.3rem;margin-bottom:20px;color:#333;text-align:center}.answers-review{display:flex;flex-direction:column;gap:15px}.answer-item{padding:20px;border-radius:12px;border-left:5px solid}.answer-item.correct{background:#f8fff8;border-left-color:#4caf50}.answer-item.incorrect{background:#fff8f8;border-left-color:#f44336}.question-number{font-weight:700;color:#667eea;margin-bottom:8px}.question-text{font-size:1rem;margin-bottom:10px;color:#333;line-height:1.4}.answer-details{display:flex;flex-direction:column;gap:5px;font-size:.9rem}.your-answer,.correct-answer{display:flex;gap:8px}.correct-text{color:#4caf50;font-weight:500}.incorrect-text{color:#f44336;font-weight:500}@media (max-width: 768px){body{padding:10px}.quiz-container{border-radius:15px}.quiz-header{padding:20px}.quiz-header h1{font-size:2rem}.quiz-info{flex-direction:column;gap:10px;text-align:center}.question-section{padding:20px}.question-text{font-size:1.2rem}.option-btn{padding:15px;font-size:.9rem}.option-letter{width:35px;height:35px;margin-right:10px}.navigation-buttons{flex-direction:column;gap:10px}.nav-btn,.next-btn,.restart-btn,.show-answer-btn,.skip-btn{padding:12px 20px;font-size:.9rem;min-width:100px}.results-section{padding:0 20px 20px}.answer-item{padding:15px}}@media (max-width: 480px){.quiz-header h1{font-size:1.5rem}.question-text{font-size:1.1rem}.option-btn{padding:12px;font-size:.85rem}.option-letter{width:30px;height:30px;font-size:.8rem}.navigation-buttons{gap:8px}.nav-btn,.next-btn,.restart-btn,.show-answer-btn,.skip-btn{padding:10px 15px;font-size:.85rem;min-width:90px}}