*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:PingFang SC,Microsoft YaHei,Noto Sans CJK SC,sans-serif;background:#f0f4f0;color:#1a2e1a;min-height:100vh}.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#0d2826,#1a4a3a,#0d2826)}.login-card{background:#fff;border-radius:20px;padding:48px 40px;width:360px;text-align:center;box-shadow:0 20px 60px #0000004d}.login-logo{width:72px;height:72px;background:linear-gradient(135deg,#0d2826,#2d6a50);border-radius:18px;margin:0 auto 20px;display:flex;align-items:center;justify-content:center;font-size:36px;color:#c9a84c;font-weight:900}.login-title{font-size:22px;font-weight:700;color:#0d2826;margin-bottom:6px}.login-sub{font-size:13px;color:#6b7280;margin-bottom:32px}.login-input{width:100%;padding:13px 16px;border:2px solid #e5e7eb;border-radius:10px;font-size:15px;outline:none;transition:border-color .2s;margin-bottom:12px}.login-input:focus{border-color:#2d6a50}.login-err{color:#dc2626;font-size:13px;margin-bottom:12px}.login-btn{width:100%;margin-top:8px}.btn-primary{background:linear-gradient(135deg,#0d2826,#2d6a50);color:#c9a84c;border:none;border-radius:10px;padding:13px 28px;font-size:16px;font-weight:600;cursor:pointer;transition:opacity .2s,transform .1s;display:inline-flex;align-items:center;gap:8px}.btn-primary:hover{opacity:.9;transform:translateY(-1px)}.btn-primary:active{transform:translateY(0)}.btn-primary:disabled{opacity:.6;cursor:not-allowed;transform:none}.btn-secondary{background:#f3f4f6;color:#374151;border:2px solid #e5e7eb;border-radius:10px;padding:11px 24px;font-size:14px;cursor:pointer;transition:background .2s}.btn-secondary:hover{background:#e5e7eb}.btn-retry{background:transparent;border:1px solid #dc2626;color:#dc2626;border-radius:6px;padding:6px 14px;font-size:13px;cursor:pointer;margin-left:12px}.header{background:linear-gradient(135deg,#0d2826,#1a3f3c);padding:0 24px;position:sticky;top:0;z-index:10;box-shadow:0 2px 12px #0000004d}.header-inner{max-width:800px;margin:0 auto;display:flex;align-items:center;gap:16px;padding:16px 0}.header-logo{width:48px;height:48px;background:#c9a84c;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:900;color:#0d2826;flex-shrink:0}.header-title{font-size:20px;font-weight:700;color:#fff}.header-sub{font-size:12px;color:#5aada8;margin-top:2px}.main{max-width:800px;margin:32px auto;padding:0 20px 48px}.card{background:#fff;border-radius:16px;padding:32px;box-shadow:0 4px 24px #00000014}.form-section{margin-bottom:28px}.section-heading{font-size:15px;font-weight:600;color:#0d2826;margin-bottom:12px;padding-left:10px;border-left:3px solid #c9a84c}.grade-btns{display:flex;gap:12px}.grade-btn{flex:1;padding:14px;border:2px solid #e5e7eb;border-radius:10px;font-size:18px;font-weight:700;color:#6b7280;background:#f9fafb;cursor:pointer;transition:all .2s}.grade-btn:hover{border-color:#2d6a50;color:#2d6a50}.grade-btn.active{border-color:#2d6a50;background:#2d6a50;color:#c9a84c;box-shadow:0 4px 12px #2d6a504d}.school-input{width:100%;padding:11px 14px;border:1.5px solid #e5e7eb;border-radius:8px;font-size:14px;outline:none;transition:border-color .2s}.school-input:focus{border-color:#2d6a50}.section-divider{display:flex;align-items:center;gap:12px;margin:16px 0 12px}.divider-label{font-size:13px;font-weight:600;color:#5aada8;background:#f0f9f6;padding:3px 10px;border-radius:20px;white-space:nowrap}.topic-row{display:flex;align-items:flex-start;gap:12px;margin-bottom:10px}.topic-label{font-size:13px;color:#6b7280;font-weight:500;min-width:110px;padding-top:10px;text-align:right}.topic-input-wrap{flex:1;position:relative}.topic-input{width:100%;padding:9px 13px;border:1.5px solid #e5e7eb;border-radius:8px;font-size:14px;outline:none;transition:border-color .2s}.topic-input:focus{border-color:#2d6a50}.suggestions{position:absolute;top:calc(100% + 4px);left:0;right:0;background:#fff;border:1.5px solid #e5e7eb;border-radius:10px;box-shadow:0 8px 24px #0000001f;z-index:20;overflow:hidden}.suggestion-item{padding:9px 14px;font-size:13px;cursor:pointer;transition:background .15s}.suggestion-item:hover{background:#f0f9f6;color:#2d6a50}.generate-btn{width:100%;padding:16px;font-size:17px;border-radius:12px;margin-top:8px;letter-spacing:1px}.progress-panel{margin-top:24px;background:#f8faf8;border:1.5px solid #c3e6cd;border-radius:12px;padding:24px}.progress-title{font-size:15px;font-weight:600;color:#0d2826;margin-bottom:16px;text-align:center}.progress-steps{display:flex;flex-direction:column;gap:10px}.step-item{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:8px;font-size:14px}.step-waiting{color:#9ca3af}.step-active{background:#e8f5e9;color:#2d6a50;font-weight:600}.step-done{color:#2d6a50}.step-icon{width:24px;height:24px;display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0}.step-active .step-icon{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.error-box{margin-top:20px;background:#fef2f2;border:1.5px solid #fecaca;border-radius:10px;padding:16px 20px;color:#dc2626;font-size:14px;display:flex;align-items:center;flex-wrap:wrap;gap:8px}.success-box{margin-top:24px;text-align:center;padding:32px 20px;background:linear-gradient(135deg,#f0faf4,#e8f5e9);border:2px solid #86efac;border-radius:16px}.success-icon{width:64px;height:64px;background:#2d6a50;color:#fff;border-radius:50%;font-size:30px;display:flex;align-items:center;justify-content:center;margin:0 auto 16px}.success-title{font-size:20px;font-weight:700;color:#0d2826;margin-bottom:6px}.success-sub{font-size:14px;color:#6b7280;margin-bottom:24px}.download-btn{margin-right:12px;margin-bottom:12px}.info-bar{margin-top:20px;background:#fff;border-radius:12px;padding:20px 24px;box-shadow:0 2px 12px #0000000d;display:flex;flex-direction:column;gap:10px}.info-item{display:flex;align-items:center;gap:10px;font-size:13px;color:#6b7280}.info-icon{font-size:16px}@media (max-width: 600px){.card{padding:20px}.topic-row{flex-direction:column}.topic-label{min-width:auto;padding-top:0;text-align:left}.main{padding:0 12px 48px}}