/* =========================================================
   practice.css — 电脑端练习页（6 题型，对齐移动端观感）
   依赖 theme.css 的 token（--card-bg / --accent / --success / --error...）
   类名统一 pr- 前缀，避免与 style.css（文章模块）冲突。
   ========================================================= */

#practice-root{ max-width:980px; margin:0 auto; }

/* ---------- 题型选择 ---------- */
.pr-types-title{ font-size:22px; font-weight:800; margin:0 0 6px; }
.pr-types-sub{ color:var(--sub-text); font-size:14.5px; margin:0 0 22px; }
.pr-type-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:16px; }
.pr-type-card{
  background:var(--card-bg); border:1px solid var(--border); border-radius:var(--radius-lg);
  padding:22px; cursor:pointer; transition:all .2s ease; box-shadow:var(--shadow);
}
.pr-type-card:hover{ transform:translateY(-4px); border-color:var(--accent); box-shadow:var(--shadow-lg); }
/* 未开通的练习子模块：置灰 + 锁标 */
.pr-type-card.pt-locked{ opacity:.5; cursor:not-allowed; filter:grayscale(.6); }
.pr-type-card.pt-locked:hover{ transform:none; border-color:var(--border); box-shadow:var(--shadow); }
.pr-type-card .pt-lock{ position:absolute; top:12px; right:14px; font-size:20px; }
.pr-type-card{ position:relative; }
.pr-type-card .pt-ico{ font-size:34px; display:block; margin-bottom:10px; }
.pr-type-card .pt-name{ font-size:18px; font-weight:700; display:block; margin-bottom:6px; }
.pr-type-card .pt-desc{ color:var(--sub-text); font-size:13px; line-height:1.5; display:block; min-height:38px; }
.pr-type-card .pt-count{ display:inline-block; margin-top:12px; padding:3px 12px; border-radius:999px;
  background:var(--chip-bg); color:var(--accent); font-size:12px; font-weight:700; }
.pr-tip{ margin-top:22px; padding:12px 16px; border-radius:var(--radius-sm); background:rgba(102,126,234,.08);
  border:1px solid var(--border); color:var(--sub-text); font-size:13.5px; }
.pr-tip strong{ color:var(--text); }
.pr-filter-bar{ background:var(--card-bg); border:1px solid var(--border); border-radius:var(--radius); padding:14px 16px; margin-bottom:18px; box-shadow:var(--shadow); }
.pr-filter-row{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:10px; }
.pr-filter-row:last-child{ margin-bottom:0; }
.pr-filter-label{ color:var(--sub-text); font-size:13.5px; font-weight:600; }
.pr-filter-chip{ padding:5px 12px; border-radius:999px; border:1px solid var(--border); font-size:13px; color:var(--text); cursor:pointer; background:var(--chip-bg); }
.pr-filter-chip:hover{ border-color:var(--accent); }
.pr-filter-chip.pr-filter-active{ background:var(--accent); color:#fff; border-color:var(--accent); }
.pr-filter-select{ padding:6px 12px; border-radius:var(--radius-sm); border:1px solid var(--border); background:var(--card-bg); color:var(--text); font-size:13px; }

/* ---------- 进度条 ---------- */
.pr-bar{ display:flex; align-items:center; gap:14px; margin-bottom:20px; }
.pr-bar .pr-title{ font-size:18px; font-weight:700; }
.pr-bar .pr-progress{ color:var(--sub-text); font-size:14px; }
.pr-bar .pr-score{ color:var(--success); font-weight:700; font-size:14px; }
.pr-bar .pr-sound-toggle{ cursor:pointer; color:var(--sub-text); font-size:18px; width:34px; height:34px;
  display:inline-flex; align-items:center; justify-content:center; border-radius:10px; transition:all .16s;
  margin-left:auto; }
.pr-bar .pr-sound-toggle:hover{ background:rgba(102,126,234,.14); color:var(--accent); }
.pr-bar .pr-exit{ cursor:pointer; color:var(--sub-text); font-size:13px; font-weight:600; padding:6px 12px;
  display:inline-flex; align-items:center; justify-content:center; border-radius:10px; transition:all .16s;
  background:transparent; border:1px solid var(--border); white-space:nowrap; }
.pr-bar .pr-exit:hover{ background:rgba(102,126,234,.14); color:var(--accent); border-color:var(--accent); }

/* ---------- 题干卡片 ---------- */
.pr-q-box{ background:var(--card-bg); border:1px solid var(--border); border-radius:var(--radius);
  padding:20px 22px; margin-bottom:16px; box-shadow:var(--shadow); }
.pr-q-text{ font-size:17px; line-height:1.7; font-weight:600; }
.pr-q-fill{ font-size:16px; line-height:1.8; white-space:pre-wrap; }
.pr-q-hint{ color:var(--sub-text); font-size:14px; margin-top:8px; }
.pr-q-trans{ color:var(--sub-text); font-size:13.5px; margin-top:8px; font-style:italic; }
.pr-tag{ display:inline-block; margin-top:10px; padding:3px 12px; border-radius:999px;
  background:var(--chip-bg); color:var(--accent); font-size:12.5px; font-weight:700; }

/* ---------- 题库整理题目图文 + 查看原文 ---------- */
.pr-qbank-imgs{ display:flex; gap:10px; flex-wrap:wrap; margin:12px 0 4px; }
.pr-qbank-img{ display:block; max-width:260px; border:1px solid var(--border); border-radius:10px; overflow:hidden; background:#fff; }
.pr-qbank-img img{ display:block; width:100%; height:auto; cursor:zoom-in; }
.pr-btn-original{ margin:10px 12px 0 0; padding:7px 14px; border:1px solid var(--accent); background:rgba(102,126,234,.12);
  color:var(--accent); border-radius:999px; font-size:13px; font-weight:700; cursor:pointer; }
.pr-btn-original:hover{ background:rgba(102,126,234,.22); }
.pr-qbank-original{ margin-top:10px; padding:14px 16px; border:1px dashed var(--border); border-radius:10px;
  background:var(--card-bg); color:var(--text); font-size:15px; line-height:1.8; white-space:normal; word-break:break-word; }

/* ---------- 选项（语法/填空） ---------- */
.pr-choice-list{ display:flex; flex-direction:column; gap:10px; margin-bottom:16px; }
.pr-choice-item{
  display:flex; align-items:center; gap:12px; padding:13px 16px; cursor:pointer;
  background:var(--card-bg); border:1px solid var(--border); border-radius:var(--radius-sm);
  transition:all .15s ease; font-size:15.5px;
}
.pr-choice-item:hover{ border-color:var(--accent); }
.pr-choice-item.pr-sel{ border-color:var(--accent); background:var(--chip-bg); box-shadow:0 0 0 2px rgba(102,126,234,.25); }
.pr-choice-item.pr-correct{ border-color:var(--success); background:rgba(76,175,114,.16); }
.pr-choice-item.pr-wrong{ border-color:var(--error); background:rgba(224,80,80,.14); }
.pr-choice-label{ flex:0 0 26px; width:26px; height:26px; border-radius:50%;
  background:rgba(255,255,255,.06); color:var(--sub-text); font-weight:700; font-size:13px;
  display:inline-flex; align-items:center; justify-content:center; }
.pr-choice-item.pr-correct .pr-choice-label{ background:var(--success); color:#06140c; }
.pr-choice-item.pr-wrong .pr-choice-label{ background:var(--error); color:#fff; }
.pr-choice-text{ flex:1; }
.pr-tick{ color:var(--success); font-weight:800; font-size:16px; }
.pr-cross{ color:var(--error); font-weight:800; font-size:16px; }

/* ---- 选项两列栅格：AB 横排一行、CD 横排一行 ----
   适用：语法单选 / 填空变形 / 语法选择(短文) / 完形填空 / 阅读理解 */
.pr-choice-list.pr-choice-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:10px 12px;
  align-items:stretch;
}
/* 允许卡片在栅格内正常收缩，长选项自动换行不撑破布局 */
.pr-choice-list.pr-choice-grid .pr-choice-item{ min-width:0; }
.pr-choice-list.pr-choice-grid .pr-choice-text{
  min-width:0; word-break:break-word; overflow-wrap:anywhere;
}
/* 窄屏回退单列，避免两列过挤 */
@media (max-width: 560px){
  .pr-choice-list.pr-choice-grid{ grid-template-columns:1fr; }
}

/* ---------- 填空输入 ---------- */
.pr-input-row{ margin:4px 0 16px; }
.pr-fill-input{ width:100%; padding:12px 14px; font-size:15px; color:var(--text);
  background:rgba(255,255,255,.04); border:1px solid var(--border-strong); border-radius:var(--radius-sm);
  outline:none; font-family:var(--font); }
.pr-fill-input:focus{ border-color:var(--accent); }

/* ---------- 连词成句 ---------- */
.pr-word-pool{ background:var(--card-bg); border:1px solid var(--border); border-radius:var(--radius); padding:16px; margin-bottom:14px; }
.pr-pool-label{ color:var(--sub-text); font-size:13.5px; font-weight:600; display:block; margin-bottom:10px; }
.pr-pool-chips{ display:flex; flex-wrap:wrap; gap:10px; min-height:20px; }
.pr-word-chip{ padding:9px 16px; border-radius:12px; background:rgba(255,255,255,.06);
  border:1px solid var(--border-strong); cursor:pointer; font-size:15px; transition:all .15s; user-select:none; }
.pr-word-chip:hover{ background:rgba(255,255,255,.12); border-color:var(--accent); }
.pr-answer-area{ background:var(--card-bg); border:1px solid var(--border); border-radius:var(--radius); padding:16px; margin-bottom:14px; }
.pr-answer-line{ display:flex; flex-wrap:wrap; gap:10px; min-height:24px; align-items:center; }
.pr-ans-chip{ padding:9px 16px; border-radius:12px; background:var(--chip-bg); color:var(--accent);
  border:1px solid transparent; cursor:pointer; font-size:15px; font-weight:600; transition:all .15s; user-select:none; }
.pr-ans-chip:hover{ filter:brightness(1.12); }
.pr-ans-placeholder{ color:var(--faint-text); font-size:14px; }

/* ---------- 句子成分/长难句/时态 标注 ---------- */
.pr-analysis-area{ background:var(--card-bg); border:1px solid var(--border); border-radius:var(--radius); padding:20px; margin-bottom:14px; }
.pr-ana-sentence{ display:flex; flex-wrap:wrap; gap:6px; line-height:2.2; font-size:16px; }
.pr-ana-word{ position:relative; display:inline-flex; flex-direction:column; align-items:center; padding:4px 10px;
  border-radius:10px; background:rgba(255,255,255,.04); border:1px solid var(--border-strong);
  cursor:pointer; user-select:none; transition:all .15s; vertical-align:top; }
.pr-ana-word:hover{ border-color:var(--accent); }
.pr-ana-word .pr-ana-text{ font-weight:600; }
.pr-ana-word .pr-ana-label{ font-size:10.5px; margin-top:2px; opacity:.9; font-weight:700; }
.pr-ana-word .pr-ana-role{ font-size:10.5px; margin-top:2px; opacity:.85; font-weight:700; color:var(--sub-text); }
/* 单词词性（中间行）：透明底 + 黑色字体，独立浅色小药丸确保彩色块上也清晰 */
.pr-ana-word .pr-ana-pos{ font-size:10.5px; margin-top:2px; color:#222; font-weight:700; background:rgba(255,255,255,.82); border-radius:4px; padding:0 5px; }
.pr-ana-word.pr-clause-word{ min-width:46px; min-height:62px; justify-content:center; padding:5px 8px; }
.pr-ana-word.pr-labeled{ box-shadow:0 2px 10px rgba(0,0,0,.25); }
.pr-ana-word.pr-active{ outline:2px solid var(--warning); outline-offset:2px; }
.pr-ana-word.pr-hover{ outline:2px solid #fff; outline-offset:2px; }
.pr-ana-word.pr-wrong{ outline:2px solid var(--error); outline-offset:2px; }
.pr-label-bar{ margin-top:6px; }
.pr-label-tip{ color:var(--sub-text); font-size:13px; margin-bottom:10px; }
.pr-label-subtip{ color:var(--sub-text); font-size:13px; font-weight:600; margin:8px 0 8px; }
.pr-label-chips{ display:flex; flex-wrap:wrap; gap:8px; }
.pr-label-divider{ height:1px; background:var(--border); margin:10px 0; opacity:.6; }
.pr-label-chip{ padding:7px 13px; border-radius:999px; color:#fff; font-size:13px; font-weight:700;
  cursor:pointer; user-select:none; box-shadow:0 2px 8px rgba(0,0,0,.2); transition:all .15s; touch-action:none; }
.pr-label-chip:hover{ filter:brightness(1.1); transform:translateY(-1px); }
.pr-label-chip.pr-chip-active{ outline:2px solid var(--warning); outline-offset:2px; }
.pr-label-chip.pr-chip-dragging{ opacity:.5; }
.pr-label-chip.pr-chip-answer{ outline:2px solid var(--success); outline-offset:2px; }
.pr-label-chip.pr-chip-wrong{ outline:2px solid var(--error); outline-offset:2px; }
/* 透明底 + 黑字（非核心成分 & 所有从句类型） */
.pr-label-chip.pr-label-chip-transparent{ background:transparent !important; color:#222 !important; border:1px solid #ccc; box-shadow:none !important; text-shadow:none !important; }
.pr-label-chip.pr-label-chip-transparent:hover{ background:rgba(0,0,0,.04) !important; filter:none; transform:translateY(-1px); }
.pr-label-chip.pr-label-chip-transparent.pr-chip-active{ border-color:#3498db; color:#3498db !important; background:rgba(52,152,219,.08) !important; outline:none; }
.pr-label-chip.pr-label-chip-transparent.pr-chip-dragging{ opacity:.6; }
.pr-drag-ghost{ position:fixed; z-index:9999; pointer-events:none; padding:7px 13px; border-radius:999px;
  color:#fff; font-size:13px; font-weight:700; box-shadow:0 6px 20px rgba(0,0,0,.4); transform:translate(-50%,-50%); }
.pr-drag-ghost-light{ color:#222 !important; border:1px solid #ccc; box-shadow:0 4px 14px rgba(0,0,0,.15) !important; }

/* ---------- 时态语态：两步作答 ---------- */
.pr-ana-word.pr-pred{ background:rgba(230,126,34,.28); border-color:rgba(230,126,34,.7); box-shadow:0 0 12px rgba(230,126,34,.25); min-width:46px; min-height:62px; justify-content:center; }
.pr-q-subhint{ color:var(--sub-text); font-size:12.5px; margin-top:8px; font-style:italic; }
.pr-step-label{ color:var(--sub-text); font-size:13.5px; font-weight:700; margin-bottom:10px; }
.pr-voice-bar{ display:flex; flex-wrap:wrap; gap:12px; align-items:center; margin:6px 0 14px; }
.pr-voice-btn{ flex:1; min-width:120px; padding:14px 22px; border-radius:var(--radius); border:1px solid var(--border-strong);
  background:rgba(255,255,255,.05); color:var(--text); font-size:15.5px; font-weight:700; cursor:pointer;
  transition:all .16s; }
.pr-voice-btn:hover{ background:rgba(255,255,255,.1); border-color:var(--accent); }
.pr-voice-btn.pr-voice-sel{ background:var(--accent-grad); color:#fff; border-color:transparent; box-shadow:0 4px 14px rgba(102,126,234,.32); }
.pr-voice-btn.pr-voice-answer{ outline:2px solid var(--success); outline-offset:2px; }
.pr-voice-btn.pr-voice-wrong{ background:rgba(224,80,80,.18); border-color:var(--error); color:var(--error); }
.pr-tense-bar{ margin:6px 0 14px; }
.pr-tense-disabled{ opacity:.45; pointer-events:none; }
.pr-tense-pick{ background:var(--card-bg); border:1px solid var(--border); border-radius:var(--radius); padding:12px 16px;
  margin-bottom:14px; font-size:14.5px; color:var(--sub-text); }
.pr-tense-pick .pr-pick-voice{ font-weight:700; color:var(--text); }
.pr-tense-pick .pr-pick-tense{ font-weight:700; color:var(--accent); }
.pr-tense-pick .pr-pick-plus{ margin:0 6px; }

/* ---------- 时态语态：多谓语（同一道题作答多个谓语） ---------- */
/* 句中谓语序号角标 */
.pr-ana-word.pr-pred{ position:relative; }
.pr-ana-word .pr-pred-badge{ position:absolute; top:-9px; left:-7px; min-width:16px; height:16px; line-height:16px;
  padding:0 3px; border-radius:999px; background:var(--accent); color:#fff; font-size:10px; font-weight:800;
  box-shadow:0 1px 3px rgba(0,0,0,.3); }
.pr-ana-word.pr-ok .pr-pred-badge{ background:var(--success); }
.pr-ana-word.pr-wrong .pr-pred-badge{ background:var(--error); }
/* 谓语图例面板 */
.pr-pred-legend{ background:var(--card-bg); border:1px solid var(--border); border-radius:var(--radius);
  padding:12px 14px; margin:4px 0 14px; }
.pr-legend-title{ font-size:13px; font-weight:700; color:var(--sub-text); margin-bottom:8px; }
.pr-legend-list{ display:flex; flex-wrap:wrap; gap:8px; }
.pr-pred-item{ display:flex; align-items:center; gap:8px; padding:7px 12px; border-radius:999px; cursor:pointer;
  border:1px solid var(--border-strong); background:rgba(255,255,255,.05); color:var(--text); transition:all .15s; }
.pr-pred-item:hover{ border-color:var(--accent); }
.pr-pred-item.pr-pred-active{ background:var(--accent-grad); color:#fff; border-color:transparent; box-shadow:0 4px 14px rgba(102,126,234,.32); }
.pr-pred-item.pr-pred-ok{ border-color:rgba(76,175,114,.6); background:rgba(76,175,114,.14); }
.pr-pred-item.pr-pred-wrong{ border-color:rgba(224,80,80,.6); background:rgba(224,80,80,.12); }
.pr-pred-badge{ display:inline-flex; align-items:center; justify-content:center; min-width:20px; height:20px; padding:0 5px;
  border-radius:999px; background:var(--accent); color:#fff; font-size:11px; font-weight:800; }
.pr-pred-item.pr-pred-active .pr-pred-badge{ background:rgba(255,255,255,.25); }
.pr-pred-item.pr-pred-ok .pr-pred-badge{ background:var(--success); }
.pr-pred-item.pr-pred-wrong .pr-pred-badge{ background:var(--error); }
.pr-pred-txt{ font-size:13.5px; font-weight:600; }
.pr-pred-status{ font-size:11.5px; opacity:.8; }
.pr-pred-item.pr-pred-ok .pr-pred-status{ color:var(--success); }
.pr-pred-item.pr-pred-wrong .pr-pred-status{ color:var(--error-soft); }
/* 结果列表（每个谓语一行） */
.pr-ana-key-item.pr-k-ok{ background:rgba(76,175,114,.14); border:1px solid rgba(76,175,114,.4); }
.pr-ana-key-item.pr-k-bad{ background:rgba(224,80,80,.12); border:1px solid rgba(224,80,80,.38); }
.pr-ana-key-item .pr-k-no{ font-weight:800; color:var(--accent); margin-right:3px; }

/* ---------- 译 / 英音 / 美音 操作行 ---------- */
.pr-ana-actions{ display:flex; gap:10px; margin:6px 0 12px; }
.pr-act-btn{ padding:8px 18px; border-radius:999px; background:var(--accent-grad); color:#fff; font-weight:600;
  font-size:14px; cursor:pointer; box-shadow:0 4px 14px rgba(102,126,234,.3); transition:all .16s; user-select:none; }
.pr-act-btn:hover{ filter:brightness(1.08); }
.pr-trans{ background:rgba(102,126,234,.1); border-left:3px solid var(--accent); border-radius:8px;
  padding:12px 14px; font-size:14.5px; line-height:1.7; margin-bottom:14px; color:var(--text); white-space:pre-wrap; }

/* ---------- 结果框 ---------- */
.pr-result-box{ padding:16px 18px; border-radius:var(--radius); margin-bottom:14px; }
.pr-result-box.pr-ok{ background:rgba(76,175,114,.14); border:1px solid rgba(76,175,114,.4); }
.pr-result-box.pr-bad{ background:rgba(224,80,80,.12); border:1px solid rgba(224,80,80,.38); }
.pr-result-title{ font-size:16px; font-weight:800; display:block; margin-bottom:6px; }
.pr-result-box.pr-ok .pr-result-title{ color:var(--success); }
.pr-result-box.pr-bad .pr-result-title{ color:var(--error-soft); }
.pr-result-answer{ display:block; font-size:14px; margin-bottom:6px; color:var(--text); }
.pr-result-exp{ display:block; font-size:14px; line-height:1.7; color:var(--sub-text); white-space:pre-wrap; }
.pr-ana-key{ display:flex; flex-wrap:wrap; gap:8px; margin:8px 0; }
.pr-ana-key-item{ font-size:13.5px; background:rgba(255,255,255,.05); padding:5px 10px; border-radius:8px; }
.pr-ana-key-item .pr-k-w{ font-weight:700; color:var(--text); }
.pr-ana-key-item .pr-k-tense{ color:var(--accent); font-weight:700; }

/* 长难句：主干 + 参考译文面板（《万能公式》三段式） */
.pr-clause-extra{ margin:6px 0 2px; display:flex; flex-direction:column; gap:10px; }
.pr-trunk-box, .pr-trans-box{ background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08); border-radius:10px; padding:10px 12px; }
.pr-trunk-title, .pr-trans-title{ font-size:12.5px; color:var(--accent); font-weight:700; margin-bottom:5px; letter-spacing:.3px; }
.pr-trunk-text{ font-size:15px; line-height:1.6; color:var(--text); font-weight:600; word-break:break-word; }
.pr-trans-text{ font-size:14px; line-height:1.7; color:var(--sub-text); white-space:pre-wrap; }
.pr-clauses-box{ background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08); border-radius:10px; padding:10px 12px; }
.pr-clauses-title{ font-size:12.5px; color:var(--accent); font-weight:700; margin-bottom:8px; letter-spacing:.3px; }
.pr-clause-item{ margin-bottom:8px; padding:8px 10px; background:rgba(255,255,255,.04); border-radius:8px; }
.pr-clause-item:last-child{ margin-bottom:0; }
.pr-clause-head{ font-size:13px; font-weight:700; color:var(--text); margin-bottom:4px; }
.pr-clause-trunk{ font-size:13px; color:var(--text); margin-bottom:4px; }
.pr-clause-comps{ font-size:12.5px; line-height:1.7; color:var(--sub-text); }
.pr-comp-role{ color:var(--accent); font-weight:700; }
.pr-comp-text{ color:var(--text); }

/* ---------- 操作按钮行 ---------- */
.pr-prac-actions{ display:flex; gap:12px; margin-top:6px; }
.pr-btn{ flex:1; max-width:200px; padding:11px 18px; border:none; border-radius:999px; font-size:14.5px; font-weight:700;
  cursor:pointer; transition:all .16s; }
.pr-btn-retry{ background:rgba(255,255,255,.08); color:var(--text); }
.pr-btn-retry:hover{ background:rgba(255,255,255,.14); }
.pr-btn-answer{ background:rgba(102,126,234,.18); color:var(--accent); border:1px solid var(--accent); }
.pr-btn-answer:hover{ background:rgba(102,126,234,.28); }
.pr-btn-next{ background:var(--accent-grad); color:#fff; box-shadow:0 4px 14px rgba(102,126,234,.32); }
.pr-btn-next:hover{ filter:brightness(1.08); }

/* 提交大按钮（语法/填空/连词/成分） */
.pr-submit-btn{ margin-top:6px; padding:12px 26px; border:none; border-radius:999px; font-size:15px; font-weight:700;
  background:var(--accent-grad); color:#fff; cursor:pointer; box-shadow:0 4px 14px rgba(102,126,234,.32); transition:all .16s; }
.pr-submit-btn:hover{ filter:brightness(1.08); }

/* 连词成句 重置/确认 */
.pr-order-actions{ display:flex; gap:12px; margin-top:4px; }
.pr-sp-btn{ padding:10px 22px; border-radius:999px; font-size:14px; font-weight:700; cursor:pointer; transition:all .16s; border:1px solid var(--border-strong); }
.pr-sp-clear{ background:rgba(255,255,255,.06); color:var(--sub-text); }
.pr-sp-clear:hover{ color:var(--text); border-color:var(--accent); }
.pr-sp-confirm{ background:var(--accent-grad); color:#fff; border:none; box-shadow:0 4px 14px rgba(102,126,234,.32); }
.pr-sp-confirm:hover{ filter:brightness(1.08); }

/* ---------- 完成总结 ---------- */
.pr-finish-box{ max-width:460px; margin:50px auto; text-align:center; background:var(--card-bg);
  border:1px solid var(--border); border-radius:var(--radius-lg); padding:40px 30px; box-shadow:var(--shadow); }
.pr-finish-emoji{ font-size:60px; display:block; margin-bottom:12px; }
.pr-finish-title{ font-size:24px; font-weight:800; display:block; margin-bottom:14px; }
.pr-finish-stat{ display:flex; justify-content:center; gap:8px; font-size:18px; margin-bottom:14px; }
.pr-finish-stat .fs-known{ color:var(--success); font-weight:800; }
.pr-finish-stat .fs-total{ color:var(--sub-text); }
.pr-finish-tip{ color:var(--sub-text); font-size:14.5px; display:block; margin-bottom:22px; }
.pr-finish-replay{ background:var(--accent-grad); color:#fff; border:none; padding:11px 24px; border-radius:999px;
  font-weight:700; cursor:pointer; box-shadow:0 4px 14px rgba(102,126,234,.32); margin-right:10px; }
.pr-finish-back{ background:rgba(255,255,255,.08); color:var(--text); border:1px solid var(--border-strong);
  padding:11px 24px; border-radius:999px; font-weight:700; cursor:pointer; }
.pr-finish-replay:hover,.pr-finish-back:hover{ filter:brightness(1.1); }

/* loading 提示 */
.pr-loading{ color:var(--sub-text); font-size:14px; padding:30px; text-align:center; }
.pr-error{ color:var(--error-soft); font-size:14px; padding:20px; text-align:center; }

/* 登录提示 */
.pr-login-tip{ max-width:420px; margin:50px auto; text-align:center; background:var(--card-bg);
  border:1px solid var(--border); border-radius:var(--radius-lg); padding:40px 30px; box-shadow:var(--shadow); }
.pr-login-emoji{ font-size:54px; display:block; margin-bottom:12px; }
.pr-login-title{ font-size:22px; font-weight:800; display:block; margin-bottom:12px; }
.pr-login-desc{ color:var(--sub-text); font-size:14.5px; display:block; margin-bottom:22px; }
.pr-login-btn{ display:inline-block; padding:11px 26px; border-radius:999px; background:var(--accent-grad);
  color:#fff; font-weight:700; text-decoration:none; box-shadow:0 4px 14px rgba(102,126,234,.32); }
.pr-login-btn:hover{ filter:brightness(1.08); }
.pr-login-actions{ display:flex; flex-wrap:wrap; gap:12px; justify-content:center; }
.pr-login-btn-secondary{ background:rgba(255,255,255,.08); color:var(--text); border:1px solid var(--border-strong);
  box-shadow:none; }
.pr-login-btn-secondary:hover{ filter:brightness(1.1); background:rgba(255,255,255,.14); }

/* ---------- 短文填空（选词）练习 ---------- */
.cp-word-bank{ margin:6px 0 16px; }
.cp-word-bank-in-original{ margin-top:12px; margin-bottom:8px; padding:12px 14px; background:rgba(59,130,246,.06); border:1px dashed var(--border); border-radius:10px; }
.cp-tip{ color:var(--warning,#f59e0b); font-size:13px; margin-top:10px; line-height:1.5; }
.cp-progress{ margin:8px 0 4px; font-size:13px; color:var(--muted,#6b7280); }
.cp-blanks{ display:flex; flex-direction:column; gap:16px; }
.cp-blank-card{ background:var(--card-bg); border:1px solid var(--border); border-radius:var(--radius); padding:16px 18px; border-left:4px solid #3b82f6; }
.cp-no{ display:inline-flex; align-items:center; justify-content:center; width:24px; height:24px; background:#3b82f6; color:#fff; border-radius:50%; font-size:12px; font-weight:700; margin-right:10px; vertical-align:middle; }
.cp-sentence{ font-size:16px; line-height:1.9; color:var(--text); word-break:break-word; display:inline; }
.cp-blank-input{ display:inline-block; min-width:70px; padding:4px 10px; margin:0 4px; border:none; border-bottom:2px dashed var(--accent,#3b82f6); background:rgba(59,130,246,.08); border-radius:4px; font-weight:600; color:var(--text); text-align:center; font-size:15px; outline:none; transition:all .15s; }
.cp-blank-input:focus{ background:rgba(59,130,246,.16); border-bottom-style:solid; }
.cp-blank-input.cp-focus{ background:rgba(59,130,246,.2); box-shadow:0 0 0 2px rgba(59,130,246,.25); }
.cp-used{ opacity:.55; text-decoration:line-through; }
.cp-actions{ display:flex; gap:12px; margin-top:4px; align-items:center; }
.cp-hint-form{ color:var(--warning,#f59e0b); font-weight:600; margin-left:6px; }

/* ---------- 单词查词气泡 + 一键生词本 ---------- */
.pr-word{ cursor:pointer; border-bottom:1px dashed var(--accent,#667eea); border-radius:2px; padding:0 1px;
  transition:background .12s,color .12s; }
.pr-word:hover{ background:rgba(102,126,234,.16); color:var(--accent,#667eea); }
.pr-word:active{ background:rgba(102,126,234,.3); }

.pr-word-bubble{ position:fixed; z-index:9999; max-width:330px; min-width:210px;
  background:var(--card-bg,#fff); color:var(--text,#222); border:1px solid var(--border,#e3e6ef);
  border-radius:12px; box-shadow:0 12px 40px rgba(20,24,40,.22); padding:12px 14px;
  font-size:14px; line-height:1.55; display:none; }
.pr-bub-loading{ color:var(--sub-text,#888); padding:4px 2px; }
.pr-bub-head{ display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; margin-bottom:6px; }
.pr-bub-word{ font-size:18px; font-weight:800; color:var(--text,#222); }
.pr-bub-ph{ color:var(--accent,#667eea); font-size:13px; }
.pr-bub-dict{ margin-left:auto; font-size:11px; color:var(--sub-text,#888); background:var(--chip-bg,#eef0f6);
  padding:1px 8px; border-radius:999px; }
.pr-bub-pos{ color:var(--sub-text,#888); font-size:12.5px; margin-bottom:4px; }
.pr-bub-meaning{ font-size:14px; color:var(--text,#222); word-break:break-word; }
.pr-bub-ex{ margin-top:8px; border-top:1px dashed var(--border,#e3e6ef); padding-top:8px; }
.pr-bub-ex-title{ font-size:12px; color:var(--sub-text,#888); margin-bottom:4px; }
.pr-bub-ex-item{ margin-bottom:6px; }
.pr-bub-ex-en{ color:var(--text,#222); }
.pr-bub-ex-zh{ color:var(--sub-text,#888); font-size:12.5px; }
.pr-bub-empty{ color:var(--sub-text,#888); padding:2px 0 8px; }
.pr-bub-actions{ display:flex; gap:8px; margin-top:10px; flex-wrap:wrap; }
.pr-bub-btn{ cursor:pointer; user-select:none; padding:5px 12px; border-radius:999px; font-size:13px; font-weight:700;
  background:var(--chip-bg,#eef0f6); color:var(--accent,#667eea); border:1px solid var(--border,#e3e6ef);
  transition:all .14s; }
.pr-bub-btn:hover{ border-color:var(--accent,#667eea); filter:brightness(.97); }
.pr-bub-add{ background:rgba(102,126,234,.14); color:var(--accent,#667eea); }
.pr-bub-add:hover{ background:rgba(102,126,234,.26); }
.pr-bub-added{ background:var(--success,#22c55e); color:#fff; border-color:var(--success,#22c55e); }
.pr-bub-adding{ opacity:.7; }

/* ===== 句子分析（专家/新手）双页面 ===== */
/* 新手模式：预切分语块 */
.pr-ana-chunk{ position:relative; display:inline-flex; flex-direction:column; align-items:center; padding:6px 12px; border:1px solid var(--border,#e3e6ef); border-radius:10px; background:#eef0f3; cursor:pointer; transition:all .14s; }
.pr-ana-chunk:hover{ border-color:var(--accent,#667eea); }
.pr-ana-chunk .pr-ana-text{ font-weight:600; }
.pr-ana-chunk .pr-ana-label{ font-size:11px; margin-top:3px; font-weight:700; color:var(--accent,#667eea); }
.pr-ana-chunk.pr-labeled{ box-shadow:0 2px 10px rgba(0,0,0,.25); }
.pr-ana-chunk.pr-active{ outline:2px solid var(--warning,#f39c12); outline-offset:2px; }
.pr-ana-chunk.pr-wrong{ outline:2px solid var(--error,#e74c3c); outline-offset:2px; }
.pr-ana-chunk.pr-chunk-punct{ background:transparent; border-color:transparent; cursor:default; box-shadow:none; }
.pr-ana-chunk.pr-chunk-punct .pr-ana-text{ font-weight:600; color:#333; }
.pr-easy-sentence{ display:flex; flex-wrap:wrap; gap:8px; line-height:2.2; font-size:16px; align-items:flex-end; }
/* 句子分析子页签 + 难度徽标 */
.pr-sa-tabs{ display:flex; align-items:center; gap:8px; margin:0 0 14px; flex-wrap:wrap; }
.pr-sa-tab{ padding:6px 14px; border-radius:999px; font-size:14px; font-weight:700; cursor:pointer; border:1px solid var(--border,#e3e6ef); color:var(--sub-text,#888); background:#fff; transition:all .14s; }
.pr-sa-tab:hover{ border-color:var(--accent,#667eea); color:var(--accent,#667eea); }
.pr-sa-tab.pr-sa-active{ background:var(--accent,#667eea); color:#fff; border-color:var(--accent,#667eea); }
.pr-sa-badge{ margin-left:auto; padding:4px 12px; border-radius:999px; font-size:13px; font-weight:700; background:rgba(102,126,234,.12); color:var(--accent,#667eea); }
.pr-sa-tab.pr-sa-locked{ opacity:.45; cursor:not-allowed; filter:grayscale(.6); }
.pr-sa-tab.pr-sa-locked:hover{ border-color:var(--border,#e3e6ef); color:var(--sub-text,#888); }