:root{
  --bg:#f4f6fb; --card:#fff; --ink:#1f2937; --muted:#6b7280;
  --primary:#2563eb; --primary-d:#1d4ed8; --ok:#16a34a; --bad:#dc2626;
  --line:#e5e7eb; --chip:#eef2ff;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
  background:var(--bg); color:var(--ink); line-height:1.6;
  -webkit-text-size-adjust:100%; overflow-x:hidden;
}
.q-header{
  background:linear-gradient(135deg,#2563eb,#7c3aed); color:#fff;
  padding:18px 16px 16px; position:relative;
}
.q-brand{font-size:22px; font-weight:700; display:flex; align-items:center; gap:8px;}
.q-sub{font-size:13px; opacity:.9; margin-top:4px;}
.q-back{
  position:absolute; top:18px; right:16px; color:#fff; text-decoration:none;
  font-size:13px; background:rgba(255,255,255,.18); padding:6px 12px; border-radius:999px;
}
.q-main{max-width:760px; margin:0 auto; padding:16px 14px 48px;}

/* 控制面板 */
.q-panel{
  background:var(--card); border-radius:16px; padding:18px 16px;
  box-shadow:0 4px 16px rgba(30,41,59,.06); display:flex; flex-wrap:wrap; gap:14px; align-items:flex-end;
}
.q-field{display:flex; flex-direction:column; gap:6px; flex:1 1 140px; min-width:130px;}
.q-field label{font-size:13px; color:var(--muted); font-weight:600;}
.q-field select{
  font-size:16px; padding:10px 12px; border:1px solid var(--line); border-radius:10px;
  background:#fff; color:var(--ink); width:100%;
}
.q-checks{display:flex; flex-wrap:wrap; gap:10px;}
.q-check{display:flex; align-items:center; gap:5px; font-size:14px; background:var(--chip);
  padding:8px 12px; border-radius:10px; cursor:pointer; user-select:none;}
.q-check input{width:16px; height:16px;}
.q-btn{
  border:none; border-radius:10px; padding:12px 18px; font-size:15px; font-weight:600;
  cursor:pointer; transition:.15s; white-space:nowrap;
}
.q-btn-primary{background:var(--primary); color:#fff; flex:1 1 120px;}
.q-btn-primary:active{background:var(--primary-d);}
.q-btn-ghost{background:#fff; color:var(--primary); border:1px solid var(--primary);}
.q-btn-small{padding:8px 14px; font-size:14px;}

/* 题目区 */
.q-quiz{margin-top:16px;}
.q-quiz-bar{
  display:flex; justify-content:space-between; align-items:center;
  background:var(--card); border-radius:12px; padding:12px 14px; margin-bottom:12px;
  box-shadow:0 2px 8px rgba(30,41,59,.05); font-size:14px; color:var(--muted);
}
.q-question{
  background:var(--card); border-radius:14px; padding:16px; margin-bottom:12px;
  box-shadow:0 2px 10px rgba(30,41,59,.05);
}
.q-qhead{display:flex; align-items:center; gap:8px; margin-bottom:10px;}
.q-qno{background:var(--primary); color:#fff; font-size:13px; font-weight:700;
  min-width:24px; height:24px; border-radius:999px; display:flex; align-items:center; justify-content:center; padding:0 6px;}
.q-qtype{font-size:12px; color:var(--muted); background:var(--chip); padding:3px 9px; border-radius:999px;}
.q-stem{font-size:16px; font-weight:600; margin-bottom:12px;}
.q-opts{display:flex; flex-direction:column; gap:8px;}
.q-opt{
  display:flex; align-items:center; gap:10px; padding:11px 13px; border:1px solid var(--line);
  border-radius:10px; cursor:pointer; font-size:15px; transition:.12s;
}
.q-opt:hover{border-color:var(--primary);}
.q-opt input{width:18px; height:18px;}
.q-opt.correct{background:#ecfdf5; border-color:var(--ok);}
.q-opt.wrong{background:#fef2f2; border-color:var(--bad);}
.q-fill{width:100%; font-size:16px; padding:11px 13px; border:1px solid var(--line);
  border-radius:10px; margin-top:4px;}
.q-fill:focus{outline:none; border-color:var(--primary);}

/* 结果 */
.q-result{
  margin-top:14px; padding:16px; border-radius:14px; background:var(--card);
  box-shadow:0 2px 10px rgba(30,41,59,.05);
}
.q-score{font-size:20px; font-weight:700; margin-bottom:10px;}
.q-score .big{font-size:34px; color:var(--primary);}
.q-explain{font-size:14px; color:var(--muted); margin-top:6px; padding-left:10px; border-left:3px solid var(--line);}
.q-explain b{color:var(--ink);}

/* 空状态 */
.q-empty{margin-top:24px; text-align:center; color:var(--muted); background:var(--card);
  border-radius:14px; padding:26px 18px; box-shadow:0 2px 10px rgba(30,41,59,.05);}
.q-empty .q-hint{font-size:13px; margin-top:8px;}

/* AI 智能出题面板 */
.q-panel-ai{margin-top:16px; border:1px solid #ede9fe; background:linear-gradient(180deg,#faf5ff,#fff);}
.q-ai-head{font-size:16px; font-weight:700; color:#6d28d9; display:flex; align-items:center; gap:8px; width:100%;
  flex:1 1 100%;}
.q-ai-tag{font-size:11px; font-weight:600; color:#7c3aed; background:#ede9fe; padding:2px 8px; border-radius:999px;}
.q-ai-desc{font-size:13px; color:var(--muted); flex:1 1 100%; margin:-4px 0 2px;}
.q-row3{display:flex; gap:8px;}
.q-row3 select{flex:1; min-width:0;}
.q-btn-ai{background:linear-gradient(135deg,#7c3aed,#a855f7); color:#fff; flex:1 1 120px; font-size:15px;}
.q-btn-ai:active{filter:brightness(.95);}
.q-btn-ai:disabled{opacity:.6; cursor:default;}
.q-ai-loading{width:100%; flex:1 1 100%; text-align:center; font-size:14px; color:#7c3aed;
  padding:10px; background:#f5f3ff; border-radius:10px;}

/* 阅读篇章 */
.q-passage-card{background:#fffbeb; border:1px solid #fde68a;}
.q-passage{font-size:15px; line-height:1.8; color:#3f3f46; white-space:pre-wrap;}
.q-passage-card .q-stem{color:#92400e;}

/* 主观题 */
.q-area{width:100%; font-size:15px; padding:11px 13px; border:1px solid var(--line); border-radius:10px;
  resize:vertical; font-family:inherit; line-height:1.6;}
.q-area:focus{outline:none; border-color:#a855f7;}
.q-ref-btn{margin-top:8px; background:#f5f3ff; color:#7c3aed; border:1px solid #ddd6fe;}
.q-ref{margin-top:8px; padding:12px 14px; background:#faf5ff; border-radius:10px; font-size:14px;
  line-height:1.7; color:#374151; border-left:3px solid #a855f7; white-space:pre-wrap;}

@media(max-width:520px){
  .q-panel{flex-direction:column; align-items:stretch;}
  .q-field{flex:1 1 auto;}
  .q-btn-primary{flex:1 1 auto;}
  .q-brand{font-size:19px;}
}