*{box-sizing:border-box;margin:0;padding:0}html,body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;width:100%;height:100%;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,sans-serif}#root{width:100%;height:100%}h1,h2,h3{font-weight:600}.login-container{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);justify-content:center;align-items:center;min-height:100vh;padding:20px;display:flex}.login-card{text-align:center;background:#fff;border-radius:16px;width:100%;max-width:400px;padding:40px;box-shadow:0 20px 60px #0000004d}.login-card h1{color:#333;margin:0 0 10px;font-size:48px}.login-card .subtitle{color:#666;margin-bottom:30px;font-size:14px}.form-group{text-align:left;margin-bottom:20px}.form-group label{color:#333;margin-bottom:8px;font-size:14px;font-weight:600;display:block}.form-group input{text-align:center;letter-spacing:2px;text-transform:uppercase;border:2px solid #e0e0e0;border-radius:8px;width:100%;padding:12px 16px;font-size:16px;font-weight:600;transition:all .3s}.form-group input:focus{border-color:#667eea;outline:none;box-shadow:0 0 0 3px #667eea1a}.error-message{color:#c33;background:#fee;border-radius:6px;margin-bottom:16px;padding:12px;font-size:14px}.login-card .btn-primary{width:100%;margin-bottom:20px}.login-card .info{color:#999;margin:0;font-size:12px}.progress-bar-wrapper{width:100%}.progress-bar-background{background:#e0e0e0;border-radius:4px;width:100%;height:8px;overflow:hidden}.progress-bar-fill{border-radius:4px;height:100%;transition:width .6s;box-shadow:0 0 10px #4caf504d}.course-list-container{background:linear-gradient(135deg,#f5f7fa 0%,#c3cfe2 100%);flex-direction:column;flex:1;padding:20px;display:flex;overflow-y:auto}.course-list-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px;margin-bottom:30px;display:flex}.course-list-header h1{color:#333;margin:0;font-size:32px}.header-controls{flex-wrap:wrap;align-items:center;gap:16px;display:flex}.user-code{color:#667eea;background:#fff;border-radius:6px;padding:8px 16px;font-weight:600;box-shadow:0 2px 8px #0000001a}.courses-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px;max-height:70vh;display:grid;overflow-y:auto}.course-card{cursor:pointer;background:#fff;border-top:10px solid #58cc02;border-radius:12px;flex-direction:column;gap:8px;padding:16px;transition:all .3s;display:flex;box-shadow:0 4px 12px #00000014}.course-card:hover{transform:translateY(-4px);box-shadow:0 8px 20px #00000026}.course-icon{text-align:center;font-size:40px}.course-card h2{color:#333;margin:0;font-size:18px}.question-count{color:#999;margin:0;font-size:14px}.course-progress{margin-top:8px}.course-progress-empty{color:#999;text-align:center;padding:8px 0;font-size:13px}.progress-text{color:#666;text-align:center;margin-top:6px;font-size:12px}.streak-badge{color:#ff9800;text-align:center;margin-top:6px;font-size:12px;font-weight:600}@media (width<=768px){.course-list-header{flex-direction:column;align-items:flex-start}.header-controls{width:100%}.courses-grid{grid-template-columns:1fr}}.true-false-container{flex-direction:column;gap:20px;display:flex}.swipe-instructions{text-align:center;color:#999;text-transform:uppercase;letter-spacing:1px;font-size:12px}.buttons-row{grid-template-columns:1fr 1fr;gap:12px;display:grid}.btn-swipe{cursor:pointer;color:#fff;text-transform:uppercase;letter-spacing:1px;border:none;border-radius:8px;padding:16px 24px;font-size:16px;font-weight:600;transition:all .3s}.btn-false{background:linear-gradient(135deg,#f44336 0%,#e91e63 100%);box-shadow:0 4px 12px #f443364d}.btn-false:hover{transform:translateY(-2px);box-shadow:0 6px 16px #f4433666}.btn-false:active{transform:translateY(0)}.btn-true{background:linear-gradient(135deg,#4caf50 0%,#8bc34a 100%);box-shadow:0 4px 12px #4caf504d}.btn-true:hover{transform:translateY(-2px);box-shadow:0 6px 16px #4caf5066}.btn-true:active{transform:translateY(0)}.true-false-feedback{border-radius:8px;flex-direction:column;align-items:center;gap:16px;padding:24px;animation:.3s fadeIn;display:flex}.true-false-feedback.correct{background:#e8f5e9}.true-false-feedback.incorrect{background:#ffebee}.true-false-feedback.correct .feedback-text{color:#2e7d32}.true-false-feedback.incorrect .feedback-text{color:#c62828}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes bounce{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}@media (width<=768px){.btn-swipe{padding:12px 16px;font-size:14px}}.multiple-choice-container{flex-direction:column;gap:16px;display:flex}.options-list{flex-direction:column;gap:10px;display:flex}.option-btn{cursor:pointer;text-align:left;color:#333;background:#fff;border:2px solid #ddd;border-radius:8px;padding:16px;font-size:16px;font-weight:500;transition:all .3s}.option-btn:hover:not(:disabled){background:#f5f7ff;border-color:#667eea;transform:translate(4px)}.option-btn.selected{color:#fff;background:#404b7d;border-color:#404b7d;font-weight:600}.option-btn:disabled{cursor:not-allowed}.mc-feedback{border-radius:8px;flex-direction:column;align-items:center;gap:16px;padding:24px;animation:.3s fadeIn;display:flex}.mc-feedback.correct{background:#e8f5e9}.mc-feedback.incorrect{background:#ffebee}.mc-feedback.correct .feedback-text{color:#2e7d32}.mc-feedback.incorrect .feedback-text{color:#c62828}@media (width<=768px){.option-btn{padding:12px;font-size:14px}}.text-input-container{flex-direction:column;gap:16px;display:flex}.text-input-container input{text-align:center;border:2px solid #ddd;border-radius:8px;padding:14px 16px;font-size:16px;transition:all .3s}.text-input-container input:focus{border-color:#667eea;outline:none;box-shadow:0 0 0 3px #667eea1a}.text-input-container input:disabled{cursor:not-allowed;background:#f5f5f5}.text-feedback{border-radius:8px;flex-direction:column;align-items:center;gap:16px;padding:24px;animation:.3s fadeIn;display:flex}.text-feedback.correct{background:#e8f5e9}.text-feedback.incorrect{background:#ffebee}.feedback-icon{font-size:48px;animation:.6s bounce}.feedback-text{text-align:center;color:#333;margin:0;font-size:18px;line-height:1.5}.text-feedback.correct .feedback-text{color:#2e7d32}.text-feedback.incorrect .feedback-text{color:#c62828}.btn-submit{color:#fff;cursor:pointer;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border:none;border-radius:8px;padding:12px 24px;font-size:16px;font-weight:600;transition:all .3s;box-shadow:0 4px 12px #667eea4d}.btn-submit:hover{transform:translateY(-2px);box-shadow:0 6px 16px #667eea66}.btn-submit:active{transform:translateY(0)}.btn-skip{margin-top:12px}@media (width<=768px){.text-input-container input{padding:12px;font-size:14px}}.question-card{background:#fff;border-radius:16px;width:100%;max-width:500px;padding:40px;transition:all .3s;animation:.4s slideIn;box-shadow:0 20px 60px #0000004d}.question-card.animating{opacity:0;transform:translateY(20px)}@keyframes slideIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.question-text{color:#333;text-align:center;margin:0 0 30px;font-size:24px;font-weight:600;line-height:1.4}@media (width<=768px){.question-card{padding:24px}.question-text{font-size:20px}}.quiz-session{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);flex-direction:column;flex:1;padding:20px;display:flex;overflow-y:auto}.quiz-header{color:#fff;justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.quiz-header h2{margin:0;font-size:20px}.quiz-progress{background:#fff3;border-radius:6px;padding:8px 16px;font-weight:600}.quiz-progress-bar{background:#fff3;border-radius:2px;height:4px;margin-bottom:30px;overflow:hidden}.progress-fill{background:linear-gradient(90deg,#4caf50 0%,#8bc34a 100%);height:100%;transition:width .3s}.quiz-container{flex:1;justify-content:center;align-items:center;padding:20px 0;display:flex}@media (width<=768px){.quiz-session{padding:12px}.quiz-header{margin-bottom:16px}.quiz-container{padding:12px 0}}.result-container{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);flex:1;justify-content:center;align-items:center;padding:20px;display:flex;position:relative;overflow-y:auto}.confetti-burst{pointer-events:none;font-size:120px;animation:2s ease-out forwards confetti-pop;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}@keyframes confetti-pop{0%{opacity:1;transform:translate(-50%,-50%)scale(1)}to{opacity:0;transform:translate(-50%,-150%)scale(0)}}.result-card{text-align:center;background:#fff;border-radius:16px;width:100%;max-width:500px;padding:40px;animation:.5s slideUp;box-shadow:0 20px 60px #0000004d}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.result-icon{margin-bottom:20px;font-size:64px;animation:.6s bounce}.result-icon.perfect{animation:.8s spin}.result-icon.good{animation:.6s swing}@keyframes spin{0%{transform:rotate(0)scale(1)}50%{transform:rotate(180deg)scale(1.1)}to{transform:rotate(360deg)scale(1)}}@keyframes swing{0%,to{transform:rotate(0)}25%{transform:rotate(15deg)}75%{transform:rotate(-15deg)}}.result-title{color:#333;margin:0 0 20px;font-size:28px;font-weight:700}.result-score{margin:30px 0}.score-text{color:#666;margin:12px 0;font-size:18px;font-weight:600}.percentage-text{color:#667eea;margin:12px 0;font-size:36px;font-weight:700}.result-details{background:#f5f7fa;border-radius:8px;justify-content:space-around;gap:20px;margin:30px 0;padding:20px;display:flex}.detail-item{flex-direction:column;align-items:center;gap:8px;display:flex}.detail-label{color:#999;text-transform:uppercase;letter-spacing:1px;font-size:12px}.detail-value{color:#333;font-size:18px;font-weight:600}.result-card .btn-primary{width:100%;margin-top:20px}@media (width<=768px){.result-card{padding:24px}.result-icon{font-size:48px}.result-title{font-size:24px}.percentage-text{font-size:28px}.result-details{flex-direction:column;gap:12px}}*{box-sizing:border-box}html,body,#root{width:100%;height:100%;margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,sans-serif}body{background:linear-gradient(135deg,#f5f7fa 0%,#c3cfe2 100%);min-height:100vh}.app{flex-direction:column;width:100%;height:100vh;display:flex}.loading{color:#333;background:linear-gradient(135deg,#f5f7fa 0%,#c3cfe2 100%);justify-content:center;align-items:center;height:100vh;font-size:18px;display:flex}.btn-primary{color:#fff;cursor:pointer;background:linear-gradient(135deg,#58cc02 0%,#4caf50 100%);border:none;border-radius:8px;padding:12px 32px;font-size:16px;font-weight:600;transition:all .3s;box-shadow:0 4px 6px #58cc024d}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 12px #58cc0266}.btn-primary:active{transform:translateY(0)}.btn-skip{color:#666;cursor:pointer;background:0 0;border:2px solid #ddd;border-radius:8px;padding:10px 24px;font-size:14px;transition:all .3s}.btn-skip:hover{color:#333;border-color:#999}.btn-logout{cursor:pointer;background:#f5f5f5;border:1px solid #ddd;border-radius:6px;padding:8px 16px;font-size:14px;transition:all .3s}.btn-logout:hover{background:#efefef}