/* ===== 408 智能刷题：题目区 + AI 助教 =====
   与 style.css 的蓝白教育科技风格同一套变量，只新增本页需要的组件。 */

.study-grid{display:grid;grid-template-columns:minmax(0,1.32fr) minmax(360px,.92fr);gap:20px;align-items:start}

/* ---------- 左：题目卡 ---------- */
.question-col{min-width:0}
.qcard{background:#fff;border:1px solid var(--line);border-radius:20px;padding:26px 28px 22px;box-shadow:var(--shadow)}
.qcard-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-bottom:16px;border-bottom:1px solid #f1f5fb}
.qcard-brand{display:flex;align-items:center;gap:10px}
.qcard-logo{width:34px;height:34px;border-radius:11px;background:linear-gradient(145deg,#4385ff,#1d4ed8);color:#fff;display:grid;place-items:center;font-size:16px;font-weight:800;box-shadow:0 6px 14px #2563eb30}
.qcard-brand b{display:block;font-size:14px;letter-spacing:.2px}
.qcard-brand small{display:block;font-size:11px;color:var(--muted);margin-top:2px}
.qcard-head-right{display:flex;align-items:center;gap:10px}
.qcard-source{font-size:11px;padding:5px 10px;border-radius:20px;background:#eef4ff;color:#3b62b8;font-weight:700;letter-spacing:.2px}
.qcard-source[data-ai="1"]{background:linear-gradient(120deg,#eef2ff,#e8f4ff);color:#3b4fbf;border:1px solid #dfe6ff}
.qcard-user{width:30px;height:30px;border-radius:50%;border:1px solid var(--line);background:#f7faff;color:#5a6b88;font-size:12px;font-weight:700}
.qcard-label{font-size:11px;color:#9aa6b8;letter-spacing:1.2px;margin:16px 0 12px}
.qcard .question-meta{margin-bottom:14px}
.qcard .question-title{font-size:19px;line-height:1.85;margin:0 0 18px;letter-spacing:-.2px}
.qcard-submit{width:100%;padding:14px;font-size:14px;border-radius:12px;background:linear-gradient(120deg,#2f6bff,#1d4ed8);box-shadow:0 10px 22px #2563eb33}
.qcard-submit:hover{filter:brightness(1.03)}
.qcard-actions{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px}
.qcard-actions .text-btn{padding:6px 4px;font-size:12px}
.qcard-hint{font-size:11px;color:#9aa6b8}
.qcard-note{margin-top:14px;font-size:11px;line-height:1.8;color:#93a0b4;padding:0 4px}

/* 选项：比原版更轻、更有反馈 */
.qcard .option{padding:15px 16px;border-radius:13px;font-size:13.5px;line-height:1.6;transition:.16s}
.qcard .option:hover{transform:translateX(2px)}
.qcard .option.correct{border-color:#57c79a;background:#effaf5;color:#0f6f4f}
.qcard .option.correct .option-key{background:#16a578;color:#fff}
.qcard .option.wrong{border-color:#f0a58f;background:#fff5f1;color:#a63d21}
.qcard .option.wrong .option-key{background:#e2643f;color:#fff}
.qcard .option[disabled]{cursor:default}
.qcard .option[disabled]:hover{transform:none}
.qcard .feedback{margin-top:16px;border-radius:13px}

@media(max-width:1080px){
  .study-grid{grid-template-columns:1fr}
  .ai-card{position:static;max-height:none}
  .ai-thread{max-height:56vh}
}

/* ---------- 右：AI 助教 ---------- */
.ai-col{min-width:0}
.ai-card{position:sticky;top:96px;background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow);display:flex;flex-direction:column;max-height:calc(100vh - 130px);overflow:hidden}
.ai-head{display:flex;align-items:center;gap:11px;padding:16px 18px;border-bottom:1px solid #f1f5fb;background:linear-gradient(180deg,#fbfdff,#fff)}
.ai-avatar{width:36px;height:36px;border-radius:12px;background:linear-gradient(145deg,#7c9dff,#4f6ef7);color:#fff;display:grid;place-items:center;font-size:16px;box-shadow:0 6px 14px #4f6ef72e}
.ai-head-text b{display:block;font-size:13.5px}
.ai-head-text small{display:block;font-size:11px;color:var(--muted);margin-top:2px}
.ai-status{margin-left:auto;display:flex;align-items:center;gap:6px;font-size:11px;color:#6b7a92;background:#f6f9fd;border:1px solid var(--line);padding:5px 9px;border-radius:20px}
.ai-status i{width:6px;height:6px;border-radius:50%;background:#c3ccda;display:block}
.ai-status[data-state="online"]{color:#0f7a58;background:#eefaf4;border-color:#d3f0e4}
.ai-status[data-state="online"] i{background:#16a578;box-shadow:0 0 0 3px #16a57822}
.ai-status[data-state="offline"]{color:#a8562d;background:#fff6ef;border-color:#ffe0c9}
.ai-status[data-state="offline"] i{background:#e2884a}

/* 快捷卡片 */
.ai-suggest{margin:14px 16px 0;padding:16px;border-radius:16px;background:linear-gradient(160deg,#f5f7ff,#eef3ff);border:1px solid #e5ebff}
.ai-suggest-icon{width:24px;height:24px;border-radius:8px;background:#fff;color:#4f6ef7;display:grid;place-items:center;font-size:12px;box-shadow:0 4px 10px #4f6ef71f;margin-bottom:10px}
.ai-suggest h3{margin:0 0 6px;font-size:14px}
.ai-suggest p{margin:0 0 12px;font-size:12px;color:#6b7a92;line-height:1.7}
.ai-quick{display:grid;gap:8px}
.ai-quick button{display:flex;flex-direction:column;align-items:flex-start;gap:2px;width:100%;text-align:left;background:#fff;border:1px solid #e3e9f7;border-radius:11px;padding:10px 13px;transition:.16s}
.ai-quick button:hover{border-color:#b9caff;box-shadow:0 6px 16px #4f6ef71a;transform:translateY(-1px)}
.ai-quick button:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}
.ai-quick-title{font-size:12.5px;font-weight:700;color:#26324a}
.ai-quick-sub{font-size:10.5px;color:#8694ab}

/* 对话开始后，快捷卡片收成紧凑两列 */
.ai-card.has-msgs .ai-suggest{padding:11px 12px;margin:12px 14px 0}
.ai-card.has-msgs .ai-suggest-icon,
.ai-card.has-msgs .ai-suggest p,
.ai-card.has-msgs .ai-quick-sub{display:none}
.ai-card.has-msgs .ai-suggest h3{font-size:12px;margin:0 0 8px;color:#5b6b86}
.ai-card.has-msgs .ai-quick{grid-template-columns:1fr 1fr;gap:6px}
.ai-card.has-msgs .ai-quick button{align-items:center;padding:8px 6px;border-radius:9px}
.ai-card.has-msgs .ai-quick-title{font-size:11.5px}

/* 对话流 */
.ai-thread{flex:1;min-height:0;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:12px;scroll-behavior:smooth}
.ai-thread::-webkit-scrollbar{width:6px}
.ai-thread::-webkit-scrollbar-thumb{background:#e2e8f3;border-radius:6px}
.ai-thread:empty{display:none}
.ai-msg{display:flex;gap:9px;max-width:100%;animation:aiIn .22s ease-out}
@keyframes aiIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.ai-msg.user{flex-direction:row-reverse}
.ai-msg-avatar{width:26px;height:26px;border-radius:9px;flex-shrink:0;display:grid;place-items:center;font-size:11px;font-weight:700}
.ai-msg.bot .ai-msg-avatar{background:#eef3ff;color:#4f6ef7}
.ai-msg.user .ai-msg-avatar{background:#2563eb;color:#fff}
.ai-msg-body{min-width:0;max-width:calc(100% - 40px);display:flex;flex-direction:column;gap:6px}
.ai-bubble{font-size:12.5px;line-height:1.8;color:#2b3a53;background:#f7f9fd;border:1px solid #edf1f8;border-radius:12px;padding:11px 13px;word-break:break-word}
.ai-msg.user .ai-bubble{background:#2563eb;border-color:#2563eb;color:#fff}
.ai-bubble p{margin:0 0 8px}
.ai-bubble p:last-child{margin-bottom:0}

/* 结构化结果卡 */
.ai-card-answer{background:#fff;border:1px solid #e8eef8;border-radius:14px;padding:13px 14px;box-shadow:0 4px 14px rgba(32,65,120,.05)}
.ai-card-top{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin-bottom:9px}
.ai-tag{font-size:10px;padding:3px 8px;border-radius:20px;background:#f2f5fa;color:#6c7c95;font-weight:700}
.ai-tag.ok{background:#e9faf3;color:#0f7a58}
.ai-tag.bad{background:#fff2ec;color:#b04a24}
.ai-tag.ai{background:#eef2ff;color:#4a5bd6}
.ai-card-title{font-size:13px;font-weight:800;margin:0 0 8px;line-height:1.6}
.ai-section{margin-top:10px}
.ai-section-label{font-size:10.5px;font-weight:800;color:#8c9ab0;letter-spacing:.6px;margin-bottom:5px}
.ai-text{font-size:12.5px;line-height:1.85;color:#33425c;margin:0}
.ai-list{margin:0;padding-left:16px;font-size:12.5px;line-height:1.8;color:#33425c}
.ai-list li{margin-bottom:4px}
.ai-chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px}
.ai-chip{font-size:10.5px;padding:3px 8px;border-radius:20px;background:#f3f6fc;color:#5f708c;border:1px solid #eaf0f9}
.ai-answer-badge{display:inline-flex;align-items:center;gap:6px;background:#eef4ff;border:1px solid #dce7ff;color:#24479c;border-radius:10px;padding:6px 10px;font-size:11.5px;font-weight:700;margin-bottom:8px}
.ai-answer-badge b{font-size:15px;color:#1d4ed8}

/* 换题卡 */
.ai-qcard{border:1px solid #e5ebf7;border-radius:14px;padding:12px 13px;background:#fff}
.ai-qcard .ai-qstem{font-size:12.5px;line-height:1.75;color:#22314a;margin:0 0 9px}
.ai-qopts{display:grid;gap:5px;margin-bottom:10px}
.ai-qopt{display:flex;gap:8px;font-size:11.5px;color:#4a5a75;background:#f8faff;border:1px solid #eef2f9;border-radius:8px;padding:7px 9px;line-height:1.55}
.ai-qopt b{color:#2563eb;flex-shrink:0}
.ai-btn{width:100%;border:0;border-radius:10px;padding:9px;font-size:12px;font-weight:700;background:#2563eb;color:#fff}
.ai-btn:hover{background:#1d4ed8}
.ai-btn.ghost{background:#eef4ff;color:#2563eb}

/* 规划 / 分析 */
.ai-stage{border-left:2px solid #dbe6ff;padding:0 0 12px 12px;position:relative}
.ai-stage:last-child{padding-bottom:0}
.ai-stage::before{content:"";position:absolute;left:-5px;top:3px;width:8px;height:8px;border-radius:50%;background:#4f6ef7;box-shadow:0 0 0 3px #eef2ff}
.ai-stage-name{font-size:12.5px;font-weight:800;color:#22314a;margin-bottom:2px}
.ai-stage-week{font-size:10.5px;color:#4f6ef7;font-weight:700;margin-bottom:4px}

/* 思考态 */
.ai-thinking{display:flex;align-items:center;gap:8px;font-size:12px;color:#7b8aa1;padding:9px 12px;background:#f7f9fd;border:1px dashed #e4eaf5;border-radius:12px}
.ai-dots{display:inline-flex;gap:3px}
.ai-dots i{width:5px;height:5px;border-radius:50%;background:#a9b8d0;animation:aiBlink 1.2s infinite}
.ai-dots i:nth-child(2){animation-delay:.15s}
.ai-dots i:nth-child(3){animation-delay:.3s}
@keyframes aiBlink{0%,80%,100%{opacity:.35;transform:translateY(0)}40%{opacity:1;transform:translateY(-2px)}}

/* 错误 / 空态 */
.ai-error{font-size:12px;line-height:1.7;background:#fff6f2;border:1px solid #ffe1d2;color:#9a4a24;border-radius:12px;padding:10px 12px}
.ai-error code{background:#fff;padding:1px 5px;border-radius:4px;font-size:11px}
.ai-error .ai-retry{margin-top:8px;border:0;background:#e2643f;color:#fff;border-radius:8px;padding:6px 11px;font-size:11.5px;font-weight:700}

/* 输入区 */
.ai-composer{display:flex;align-items:flex-end;gap:8px;padding:12px 14px;border-top:1px solid #f1f5fb;background:#fff}
.ai-composer textarea{flex:1;resize:none;border:1px solid #e3e9f4;border-radius:12px;padding:10px 12px;font-size:12.5px;line-height:1.6;max-height:110px;outline:none;color:#22314a;background:#fbfcfe;transition:.16s}
.ai-composer textarea:focus{border-color:#9dbcff;background:#fff;box-shadow:0 0 0 3px #eef3ff}
.ai-send{width:34px;height:34px;border-radius:11px;border:0;background:#2563eb;color:#fff;font-size:15px;font-weight:800;transition:.16s;flex-shrink:0}
.ai-send:hover{background:#1d4ed8}
.ai-send:disabled{background:#c8d5ea;cursor:not-allowed}
.ai-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 16px 12px;font-size:10.5px;color:#9aa6b8;line-height:1.6}
.ai-reset{border:0;background:transparent;color:#7b8aa1;font-size:10.5px;text-decoration:underline;padding:0}
.ai-reset:hover{color:#2563eb}

/* 提问建议 */
.ai-prompt-row{display:flex;flex-wrap:wrap;gap:6px;padding:0 16px 10px}
.ai-prompt{font-size:11px;border:1px dashed #d9e2f2;background:#fbfcff;color:#5f708c;border-radius:20px;padding:5px 10px}
.ai-prompt:hover{border-color:#a9c0f5;color:#2563eb;background:#f5f9ff}

/* ---------- 双解析：知识库原文 与 AI 补充 分块显示 ---------- */
.ai-split{border-radius:14px;padding:12px 14px;margin-top:10px;border:1px solid transparent}
.ai-split.kb{background:#f7faff;border-color:#e4ecfa}
.ai-split.ai{background:linear-gradient(160deg,#fbf9ff,#f6f4ff);border-color:#e9e3fb}
.ai-split.empty{background:#fafbfd;border-color:#eef1f6}
.ai-split-label{display:flex;align-items:center;gap:6px;font-size:11px;font-weight:800;letter-spacing:.3px;margin-bottom:8px}
.ai-split.kb .ai-split-label{color:#2f5fae}
.ai-split.ai .ai-split-label{color:#6b45c8}
.ai-split.empty .ai-split-label{color:#8a97ab}
.ai-split-dot{width:6px;height:6px;border-radius:50%;background:currentColor;flex-shrink:0}
.ai-split-src{margin-left:auto;font-size:9.5px;font-weight:600;color:#93a1b6;background:rgba(255,255,255,.85);border:1px solid rgba(0,0,0,.04);padding:2px 7px;border-radius:20px;letter-spacing:0}
.ai-split-body{font-size:12.5px;line-height:1.85;color:#31405c;white-space:pre-wrap;word-break:break-word}
.ai-split-body.dim{color:#95a2b5;font-size:12px}
.ai-split.ai .ai-split-body{color:#3c3556}

/* 左卡反馈里的知识库解析 */
.fb-kb{margin-top:10px;padding:10px 12px;background:rgba(255,255,255,.72);border:1px solid rgba(37,99,235,.14);border-radius:10px;font-size:13px;line-height:1.8;white-space:pre-wrap;color:#2c3a52}
.fb-kb-label{font-size:10.5px;font-weight:800;color:#2f5fae;letter-spacing:.4px;margin-bottom:5px}

/* ---------- AI 生成题卡片 ---------- */
.ai-tag.warn{background:#fff4e6;color:#a45a12;border:1px solid #ffe0bd}
.ai-qcard.gen{border-color:#f0e2cc;background:linear-gradient(180deg,#fffdf9,#fff)}
.ai-qwhy{margin:8px 0 0;font-size:11.5px;color:#7c6a4e;line-height:1.7}
.ai-qnote{margin:8px 0 0;font-size:10.5px;color:#a08b6a;line-height:1.65;background:#fffaf1;border-radius:8px;padding:7px 9px}
