*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;scroll-behavior:smooth}body{font-family:Segoe UI,Meiryo,Hiragino Kaku Gothic ProN,sans-serif;background:#f8fafc;color:#1e293b;min-height:100vh;line-height:1.6}.app-header{background:#0f172a;color:#fff;padding:0 24px}.app-header-inner{max-width:800px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;height:56px}.header-logo{font-family:Segoe UI,sans-serif;font-size:1.2rem;font-weight:700;color:#fff;text-decoration:none}.logo-dot{color:#60a5fa}.header-brand{font-size:.85rem;color:#60a5fa;font-weight:600}.header-title{font-size:.9rem;font-weight:500;color:#94a3b8}.header-link{color:#ffffffb3;text-decoration:none;font-size:.85rem;transition:color .2s}.header-link:hover{color:#fff}.app-main{max-width:800px;margin:0 auto;padding:32px 24px 64px;min-height:calc(100vh - 116px)}.app-footer{text-align:center;padding:20px 16px;color:#94a3b8;font-size:.8rem;border-top:1px solid #e2e8f0}.loading{text-align:center;padding:48px;color:#64748b;font-size:.95rem}.error-msg{text-align:center;padding:48px;color:#dc2626;background:#fef2f2;border-radius:12px}.section-heading{font-size:1.2rem;font-weight:700;color:#1e293b;margin:32px 0 16px}.btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 28px;background:#2563eb;color:#fff;border:none;border-radius:8px;font-size:.95rem;font-weight:600;cursor:pointer;transition:background .2s,transform .1s}.btn-primary:hover{background:#1d4ed8;transform:translateY(-1px)}.btn-primary:disabled{background:#94a3b8;cursor:not-allowed;transform:none}.btn-secondary{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 28px;background:transparent;color:#475569;border:1px solid #cbd5e1;border-radius:8px;font-size:.95rem;font-weight:500;cursor:pointer;transition:background .2s}.btn-secondary:hover{background:#f1f5f9}.back-btn{background:none;border:none;color:#2563eb;font-size:.9rem;cursor:pointer;padding:8px 0;margin-bottom:16px}.back-btn:hover{text-decoration:underline}.progress-bar-container{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:24px}.progress-bar-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.progress-label{font-weight:600;font-size:.95rem;color:#1e293b}.progress-count{font-size:.85rem;color:#64748b}.progress-bar-track{height:10px;background:#e2e8f0;border-radius:5px;overflow:hidden}.progress-bar-fill{height:100%;background:linear-gradient(90deg,#2563eb,#60a5fa);border-radius:5px;transition:width .5s ease}.progress-complete-msg{margin-top:12px;color:#16a34a;font-weight:600;font-size:.9rem;text-align:center}.module-cards{display:flex;flex-direction:column;gap:12px}.module-card{display:flex;align-items:flex-start;gap:16px;background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:20px;cursor:pointer;text-align:left;width:100%;transition:border-color .2s,box-shadow .2s;position:relative}.module-card:hover:not(.locked){border-color:#2563eb;box-shadow:0 4px 16px #2563eb1a}.module-card.locked{opacity:.5;cursor:not-allowed}.module-card.completed{border-left:4px solid #16a34a}.module-card-number{width:40px;height:40px;background:#eff6ff;color:#2563eb;border-radius:10px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.1rem;flex-shrink:0}.module-card.completed .module-card-number{background:#dcfce7;color:#16a34a}.module-card.locked .module-card-number{background:#f1f5f9;color:#94a3b8}.module-card-body{flex:1;min-width:0}.module-card-title{font-size:1rem;font-weight:600;color:#1e293b;margin-bottom:4px}.module-card-desc{font-size:.85rem;color:#64748b;margin-bottom:8px}.module-card-status{display:flex;gap:8px}.module-card-loading{position:absolute;right:20px;top:50%;transform:translateY(-50%);color:#64748b;font-size:.8rem}.badge{display:inline-block;padding:2px 10px;border-radius:100px;font-size:.75rem;font-weight:600}.badge-locked{background:#f1f5f9;color:#94a3b8}.badge-new{background:#eff6ff;color:#2563eb}.badge-progress{background:#fef9c3;color:#a16207}.badge-done{background:#dcfce7;color:#16a34a}.module-content{max-width:700px}.content-header{margin-bottom:32px}.content-title{font-size:1.5rem;font-weight:700;color:#1e293b;margin-bottom:8px}.content-desc{color:#64748b;font-size:.95rem}.content-body{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:32px;line-height:1.9;font-size:.95rem}.content-body h2{font-size:1.3rem;margin:32px 0 12px;color:#1e293b}.content-body h3{font-size:1.1rem;margin:24px 0 8px;color:#334155}.content-body h4{font-size:1rem;margin:20px 0 8px;color:#475569}.content-body ul{margin:8px 0 16px 20px}.content-body li{margin-bottom:4px}.content-body strong{color:#1e40af}.content-body p{margin-bottom:12px}.content-actions{margin-top:32px;text-align:center;padding:24px;background:#eff6ff;border-radius:12px}.quiz-info{color:#475569;font-size:.9rem;margin-bottom:16px}.quiz-screen{max-width:700px}.quiz-progress{font-size:.85rem;color:#64748b;margin-bottom:16px;font-weight:500}.quiz-question{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:24px;margin-bottom:20px}.question-text{font-size:1.05rem;font-weight:600;line-height:1.7;color:#1e293b}.quiz-choices{display:flex;flex-direction:column;gap:10px;margin-bottom:20px}.choice-btn{display:flex;align-items:center;gap:14px;padding:16px 20px;background:#fff;border:2px solid #e2e8f0;border-radius:10px;cursor:pointer;text-align:left;font-size:.95rem;transition:border-color .15s,background .15s;width:100%}.choice-btn:hover:not(:disabled){border-color:#93c5fd;background:#f0f9ff}.choice-btn.selected{border-color:#2563eb;background:#eff6ff}.choice-btn.correct{border-color:#16a34a;background:#dcfce7}.choice-btn.incorrect{border-color:#dc2626;background:#fef2f2}.choice-btn:disabled{cursor:default}.choice-key{width:32px;height:32px;background:#f1f5f9;border-radius:8px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.85rem;color:#475569;flex-shrink:0}.choice-btn.selected .choice-key{background:#dbeafe;color:#1d4ed8}.choice-btn.correct .choice-key{background:#bbf7d0;color:#166534}.choice-btn.incorrect .choice-key{background:#fecaca;color:#991b1b}.choice-text{flex:1}.explanation{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:24px;margin-top:16px}.explanation-result{font-size:1.1rem;font-weight:700;margin-bottom:12px}.explanation-result.correct{color:#16a34a}.explanation-result.incorrect{color:#dc2626}.explanation-text{color:#475569;font-size:.9rem;line-height:1.8;margin-bottom:20px}.quiz-results{display:flex;justify-content:center;padding-top:24px}.results-card{background:#fff;border:1px solid #e2e8f0;border-radius:16px;padding:48px 40px;text-align:center;max-width:480px;width:100%}.results-card.passed{border-top:4px solid #16a34a}.results-card.failed{border-top:4px solid #f59e0b}.results-icon{font-size:3rem;margin-bottom:12px}.results-title{font-size:1.5rem;font-weight:700;color:#1e293b;margin-bottom:4px}.results-subtitle{color:#64748b;font-size:.9rem;margin-bottom:24px}.results-score{margin-bottom:8px}.score-number{font-size:3.5rem;font-weight:800;color:#1e293b}.score-percent{font-size:1.5rem;font-weight:600;color:#64748b}.results-detail{color:#64748b;font-size:.9rem;margin-bottom:16px}.results-msg{color:#475569;font-size:.9rem;line-height:1.7;margin-bottom:24px}.results-actions{display:flex;flex-direction:column;gap:10px;align-items:center}@media(max-width:640px){.app-main{padding:20px 16px 48px}.module-card{flex-direction:column;gap:12px}.content-body{padding:20px}.results-card{padding:32px 20px}.score-number{font-size:2.5rem}}