/* 阅读 / 听力题型 / 口语录音 模块样式 */

/* 通用板块标题 */
.ex-h { margin: 26px 0 12px; font-size: 16px; color: #1f2937; padding-left: 10px; border-left: 4px solid #4c8bf5; }
.ex-panel { padding: 20px; background: #fff; border: 1px solid #e6e8eb; border-radius: 14px; margin: 12px 0; }
.ex-setup { text-align: center; padding: 20px 10px; }
.ex-setup h3 { margin: 0 0 8px; font-size: 18px; color: #1f2937; }
.ex-setup p { margin: 0 0 18px; font-size: 13px; color: #6b7280; }
.ex-setup select { padding: 8px 12px; font-size: 14px; border: 1px solid #d7dbe0; border-radius: 8px; margin-right: 10px; }
.ex-bar { display: flex; justify-content: space-between; align-items: center; font-size: 13px; color: #6b7280; margin-bottom: 14px; }
.ex-timer { font-weight: 700; color: #dc2626; }

/* 阅读 */
.rd-passage { max-height: 340px; overflow-y: auto; padding: 16px 18px; background: #fbfcfd; border: 1px solid #eef0f2; border-radius: 12px; line-height: 1.85; font-size: 14.5px; color: #374151; }
.rd-passage p { margin: 0 0 12px; }
.rd-q { margin: 16px 0; padding: 14px 16px; background: #fff; border: 1px solid #e6e8eb; border-radius: 12px; }
.rd-q-text { font-size: 14px; color: #1f2937; margin-bottom: 10px; }
.rd-opts { display: flex; gap: 8px; flex-wrap: wrap; }
.rd-opt { padding: 8px 18px; font-size: 13.5px; border: 1.5px solid #d7dbe0; background: #fff; border-radius: 8px; cursor: pointer; transition: all .15s; }
.rd-opt:hover:not(.disabled) { border-color: #4c8bf5; }
.rd-opt.correct { border-color: #16a34a; background: #f0fdf4; color: #15803d; font-weight: 600; }
.rd-opt.wrong { border-color: #dc2626; background: #fef2f2; color: #b91c1c; }
.rd-opt.disabled { cursor: default; }
.rd-ex { margin-top: 10px; font-size: 12.5px; color: #6b7280; line-height: 1.6; display: none; }
.rd-ex.show { display: block; }

/* 听力题型填空 */
.lx-note { max-width: 620px; margin: 0 auto; padding: 18px 20px; background: #fbfcfd; border: 1px solid #eef0f2; border-radius: 12px; line-height: 2.1; font-size: 15px; color: #374151; }
.lx-blank { display: inline-block; min-width: 90px; padding: 2px 8px; border: none; border-bottom: 2px solid #4c8bf5; background: #fff; font-size: 15px; text-align: center; outline: none; }
.lx-blank.ok { border-color: #16a34a; background: #f0fdf4; }
.lx-blank.bad { border-color: #dc2626; background: #fef2f2; }
.lx-play { display: block; margin: 0 auto 16px; }
.lx-limit { text-align: center; font-size: 12px; color: #9ca3af; margin-bottom: 12px; }

/* 口语录音 */
.rec-stage { text-align: center; padding: 10px; }
.rec-cue { font-size: 17px; font-weight: 600; color: #1f2937; margin-bottom: 8px; }
.rec-points { font-size: 13px; color: #6b7280; margin-bottom: 18px; }
.rec-timer { font-size: 44px; font-weight: 800; color: #2563eb; font-variant-numeric: tabular-nums; margin: 8px 0; }
.rec-phase { font-size: 13px; color: #9ca3af; margin-bottom: 14px; }
.rec-btns { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.rec-audio { display: block; margin: 16px auto 0; width: 100%; max-width: 480px; }
.rec-self { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; max-width: 560px; margin: 18px auto 0; }
@media (max-width: 640px) { .rec-self { grid-template-columns: 1fr; } }
.rec-self-item { display: flex; justify-content: space-between; align-items: center; padding: 10px 14px; background: #fbfcfd; border: 1px solid #eef0f2; border-radius: 10px; font-size: 13.5px; color: #374151; }
.rec-stars span { font-size: 18px; color: #d1d5db; cursor: pointer; margin-left: 3px; }
.rec-stars span.on { color: #f59e0b; }
.rec-score { text-align: center; font-size: 15px; color: #2563eb; font-weight: 600; margin-top: 14px; }

/* ===== 阅读左右分栏（机考式）===== */
.rd-split { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; align-items: start; }
.rd-pane-text { position: sticky; top: 12px; min-width: 0; }
.rd-pane-text .rd-passage { max-height: calc(100vh - 230px); overflow-y: auto; }
.rd-pane-q { min-width: 0; }
.rd-pane-q .rd-q:first-child { margin-top: 0; }
@media (max-width: 900px) {
  .rd-split { grid-template-columns: 1fr; }
  .rd-pane-text { position: static; }
  .rd-pane-text .rd-passage { max-height: 300px; }
}
[data-theme="dark"] .rd-pane-text .rd-passage { border-right-color: #334155; }

/* ---------- 听力题型扩展：地图 / 配对 / 多选 ---------- */
.lt-map { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; max-width:360px; margin:0 auto 18px; }
.lt-map-cell { position:relative; aspect-ratio:1; display:flex; align-items:center; justify-content:center; border:1.5px solid #d7dbe0; border-radius:10px; background:#fbfcfd; }
.lt-map-cell.entrance { background:#eff6ff; border-color:#93c5fd; }
.lt-map-label { font-size:20px; font-weight:800; color:#2563eb; }
.lt-map-ent { position:absolute; bottom:6px; font-size:11px; color:#1d4ed8; }
.lt-options { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 16px; padding:12px; background:#f8fafc; border-radius:10px; }
.lt-opt { font-size:13px; padding:5px 12px; background:#fff; border:1px solid #e6e8eb; border-radius:8px; color:#374151; }
.lt-questions { display:flex; flex-direction:column; gap:14px; }
.lt-q { padding:12px 14px; background:#fbfcfd; border-radius:10px; }
.lt-q-title { font-size:14px; color:#1f2937; margin-bottom:9px; }
.lt-opts { display:flex; flex-wrap:wrap; gap:8px; }
.lt-opt-btn { font-size:13px; padding:7px 14px; border:1.5px solid #d7dbe0; background:#fff; border-radius:8px; cursor:pointer; transition:all .15s; }
.lt-opt-btn:hover { border-color:#4c8bf5; }
.lt-opt-btn.sel { border-color:#2563eb; background:#eff6ff; color:#1d4ed8; font-weight:600; }
.lt-input { width:120px; padding:8px 12px; font-size:14px; border:1.5px solid #d7dbe0; border-radius:8px; outline:none; text-transform:uppercase; }
.lt-input:focus { border-color:#4c8bf5; }
[data-theme="dark"] .lt-map-cell { background:#0f172a; border-color:#334155; }
[data-theme="dark"] .lt-map-cell.entrance { background:#1e293b; }
[data-theme="dark"] .lt-q { background:#0f172a; }
[data-theme="dark"] .lt-q-title { color:#e2e8f0; }
[data-theme="dark"] .lt-opt-btn { background:#1e293b; border-color:#334155; color:#cbd5e1; }
[data-theme="dark"] .lt-input { background:#0f172a; border-color:#334155; color:#e2e8f0; }