:root {

  --primary: #2e6b4f;

  --primary-light: #e5f1ea;

  --primary-dark: #22513a;

  --success: #00b96b;

  --success-light: #e6f9f0;

  --danger: #ff4d4f;

  --danger-light: #fff1f0;

  --warning: #faad14;

  --bg: #f0f2f5;

  --card-bg: #ffffff;

  --text: #1a1a1a;
  --text-primary: #1a1a1a;

  --text-secondary: #666666;

  --text-tertiary: #999999;

  --border: #e8e8e8;

  --cat-bg: #e0e0e0;

  --radius: 12px;

  --radius-sm: 8px;

  --radius-lg: 16px;

  --safe-bottom: env(safe-area-inset-bottom, 0px);

  --shadow: 0 2px 8px rgba(0,0,0,0.06);

  --shadow-lg: 0 8px 24px rgba(0,0,0,0.12);
  --success-bg: #e7f2e9;
  --success-text: #2e7d32;
  --success-border: #6fbf7f;
  --success-icon: #6fbf7f;
  --error-bg: #fbeae8;
  --error-text: #c0392b;
  --error-border: #e08d8d;
  --error-icon: #e08d8d;
  --due-bg: #fff7e6;
  --due-text: #d48806;
  --due-border: #ffd591;
  --info-bg: #e6f4ff;
  --info-text: #1677ff;
  --info-border: #91caff;
}

/* ===== 字体档位（小/中/大/特大）===== */
html[data-font="sm"] { zoom: 0.92; }
html[data-font="md"] { zoom: 1; }
html[data-font="lg"] { zoom: 1.08; }
html[data-font="xl"] { zoom: 1.16; }
@supports not (zoom: 1) {
  html[data-font="sm"] { font-size: 14px; }
  html[data-font="md"] { font-size: 16px; }
  html[data-font="lg"] { font-size: 18px; }
  html[data-font="xl"] { font-size: 20px; }
}

/* ===== Dark Mode ===== */

[data-theme="dark"] {

  --primary: #63ab85;

  --primary-dark: #79ba98;

  --bg: #14171e;

  --card-bg: #1e2128;

  --text: #d0d3d8;
  --text-primary: #e8e8ea;

  --text-secondary: #9ca0a6;

  --text-tertiary: #6b6f75;

  --border: #2d3038;

  --cat-bg: #2e333d;

  --shadow: 0 2px 8px rgba(0,0,0,0.4);

  --shadow-lg: 0 8px 24px rgba(0,0,0,0.6);

}

[data-theme="dark"] body {

  background: var(--bg);

  color: var(--text);

}

[data-theme="dark"] .guide-table-card {

  background: var(--card-bg);

  border-color: var(--border);

  border-left: 3px solid rgba(46,107,79,0.5);

}

[data-theme="dark"] .guide-table-card th {

  background: #2a2d35;

  color: #b0b4bb;

}

[data-theme="dark"] .guide-table-card td {

  color: #c8ccd2;

  border-bottom-color: var(--border);

  background: transparent;

}

[data-theme="dark"] .guide-table-card table {

  background: transparent;

}

[data-theme="dark"] .guide-content > .guide-table-card:nth-child(even) { background: #1e2128; }

[data-theme="dark"] .guide-content > .guide-table-card:nth-child(odd)  { background: #242730; }

[data-theme="dark"] .guide-tip-card {

  background: var(--card-bg);

  border-color: var(--border);

}

[data-theme="dark"] .guide-tip-card:hover {

  background: #292c35;

}

[data-theme="dark"] .guide-tip-title { color: #d0d3d8; }

[data-theme="dark"] .guide-tip-desc { color: #9ca0a6; }

[data-theme="dark"] .guide-chapter {

  background: var(--card-bg);

  border-color: var(--border);

}

[data-theme="dark"] .guide-chapter-header {

  background: #262930;

  color: #d0d3d8;

  border-bottom-color: var(--border);

}

[data-theme="dark"] .guide-chapter-header:hover { background: #2d3038; }

[data-theme="dark"] .guide-chapter-title { color: #d0d3d8; }

[data-theme="dark"] .guide-node-title { color: #b0b4bb; }

[data-theme="dark"] .guide-leaf { color: #9ca0a6; }

[data-theme="dark"] .guide-leaf::before { background: rgba(255,255,255,0.12); }

[data-theme="dark"] .guide-leaf:hover { background: #292c35; font-weight: 600; }

[data-theme="dark"] .guide-search {

  background: #2a2d35;

  color: #d0d3d8;

  border-color: var(--border);

}

[data-theme="dark"] .guide-search::placeholder { color: #6b6f75; }

[data-theme="dark"] .guide-count { color: #6b6f75; }

[data-theme="dark"] .guide-no-result { color: #9ca0a6; }

[data-theme="dark"] .guide-tabs {

  background: var(--bg);

  border-bottom-color: var(--border);

}

[data-theme="dark"] .guide-tab {

  background: #2a2d35;

  border-color: var(--border);

  color: #9ca0a6;

}

[data-theme="dark"] .guide-tab.active {

  background: var(--primary);

  color: #fff;

  border-color: var(--primary);

}

[data-theme="dark"] #guide-back-top {

  background: rgba(255,255,255,0.08);

  border-color: var(--border);

  color: #9ca0a6;

}

/* Dark mode: card title gradient */

[data-theme="dark"] .guide-table-card .card-title {

  background: linear-gradient(135deg, #356b51, #1f3f30);

}

/* Dark mode: scrollbar */

[data-theme="dark"] ::-webkit-scrollbar { width: 8px; }

[data-theme="dark"] ::-webkit-scrollbar-track { background: #1a1d24; }

[data-theme="dark"] ::-webkit-scrollbar-thumb { background: #3a3d45; border-radius: 4px; }

[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: #4a4d55; }

/* Dark mode: table row hover */

[data-theme="dark"] .guide-table-card tbody tr:hover {

  background: #292c35;

  box-shadow: 0 2px 8px rgba(0,0,0,0.4);

  font-weight: 600;

}

/* Dark mode: guide section label */

[data-theme="dark"] .guide-section-label { color: #9ca0a6; }

/* Dark mode: guide content */

[data-theme="dark"] .guide-content { background: var(--bg); }

/* Dark mode: Homepage */
[data-theme="dark"] .hero-banner { background: #1e2128; border-color: #2d3038; }
[data-theme="dark"] .hero-banner .hero-icon { background: rgba(255,255,255,0.05); }
[data-theme="dark"] .hero-banner h3 { color: #d0d3d8; }
[data-theme="dark"] .hero-banner p { color: #9ca0a6; }
[data-theme="dark"] .hero-history-btn { background: #292c35; border-color: #3a3f4a; color: #a8c6ff; }

[data-theme="dark"] .hero-due-btn { background: #292c35; border-color: #3a3f4a; color: #9ca0a6; }

[data-theme="dark"] .hero-due-btn:hover { color: #d0d3d8; }

[data-theme="dark"] .hero-due-btn .hero-due-num { background: rgba(255,255,255,0.12); color: #9ca0a6; }

[data-theme="dark"] .hero-due-btn.has-due { border-color: rgba(201,79,79,0.6); color: #e07979; }

[data-theme="dark"] .hero-due-btn.has-due .hero-due-num { background: #c94f4f; color: #fff; }
[data-theme="dark"] .section-title { color: #d0d3d8; }
[data-theme="dark"] .feature-item { background: #1e2128; border-color: #33373f; box-shadow: 0 1px 3px rgba(0,0,0,0.25); }
[data-theme="dark"] .feature-item:hover { background: #292c35; }
[data-theme="dark"] .feature-icon[style] { background: rgba(46,107,79,0.12); }
[data-theme="dark"] .feature-label { color: #c8ccd2; }
[data-theme="dark"] .data-grid .stat-card { background: #1e2128; border-color: #2d3038; }
[data-theme="dark"] .data-grid .stat-card .stat-num { color: #d0d3d8; }
[data-theme="dark"] .data-grid .stat-card .stat-label { color: #9ca0a6; }
[data-theme="dark"] .quick-entry .entry-card { background: #1e2128; }
[data-theme="dark"] .activity-card { background: #1e2128; border-color: #2d3038; }
[data-theme="dark"] .trend-chart { background: #1e2128; border-color: #2d3038; }
[data-theme="dark"] .home-search { background: #1e2128; border-color: #2d3038; }
[data-theme="dark"] .home-search input { background: #2a2d35; color: #d0d3d8; }

/* Dark mode: Practice page */
[data-theme="dark"] #page-practice .practice-header { background: #1a1d24; border-bottom-color: #2d3038; }
[data-theme="dark"] #page-practice .practice-title { color: #d0d3d8; }
[data-theme="dark"] #page-practice .progress-bar { background: #2d3038; }
[data-theme="dark"] #page-practice .progress-text { color: #9ca0a6; }
[data-theme="dark"] #page-practice .question-card { background: #1e2128; border-color: #2d3038; }
[data-theme="dark"] #page-practice .q-content { color: #d0d3d8; }
[data-theme="dark"] #page-practice .q-option { background: #242730; border-color: #2d3038; color: #c8ccd2; }
[data-theme="dark"] #page-practice .q-option:hover { background: #2a2d35; }
[data-theme="dark"] #page-practice .practice-controls { background: #1a1d24; border-top-color: #2d3038; }
[data-theme="dark"] #page-practice .ctrl-btn { background: #242730; border-color: #2d3038; color: #c8ccd2; }
[data-theme="dark"] #page-practice .ctrl-btn:hover { background: #2d3038; }
[data-theme="dark"] #page-practice .analysis-card { background: #1e2128; border-color: #2d3038; }
[data-theme="dark"] #page-practice .analysis-title { color: #d0d3d8; }
[data-theme="dark"] #page-practice .analysis-text { color: #b0b4bb; }
[data-theme="dark"] #page-practice .breadcrumb-nav { color: #9ca0a6; }
[data-theme="dark"] #page-practice .practice-stats { background: #1e2128; border-color: #2d3038; }
[data-theme="dark"] #page-practice .keyboard-hint { color: #6b6f75; }
[data-theme="dark"] #page-practice.memorize-mode .q-option { background: #1e2128; }

/* Dark mode: Wrong/Review/Learned/Collect pages */
[data-theme="dark"] .wrong-item,
[data-theme="dark"] .review-item,
[data-theme="dark"] .learned-item,
[data-theme="dark"] .collect-item { background: #1e2128; border-color: #2d3038; }
[data-theme="dark"] .wrong-info,
[data-theme="dark"] .review-info,
[data-theme="dark"] .learned-info,
[data-theme="dark"] .collect-info { color: #c8ccd2; }
[data-theme="dark"] .wrong-type,
[data-theme="dark"] .review-type,
[data-theme="dark"] .learned-type,
[data-theme="dark"] .collect-type { color: #9ca0a6; }
[data-theme="dark"] .filter-bar { background: #1e2128; border-color: #2d3038; }
[data-theme="dark"] .filter-btn { background: #242730; border-color: #2d3038; color: #9ca0a6; }
[data-theme="dark"] .wrong-practice-btn,
[data-theme="dark"] .review-practice-btn { background: var(--primary); color: #fff; }

/* Dark mode: Stats page */
[data-theme="dark"] .stat-card { background: #1e2128; border-color: #2d3038; }

/* Dark mode: Modals & Toasts */
[data-theme="dark"] .modal,
[data-theme="dark"] .modal-content { background: #1e2128; border-color: #2d3038; color: #d0d3d8; }
[data-theme="dark"] .modal-header { border-bottom-color: #2d3038; }
[data-theme="dark"] .toast { background: #2a2d35; color: #d0d3d8; }

/* Dark mode: Page containers */
[data-theme="dark"] .page { background: var(--bg); }

/* Dark mode: fix hardcoded light backgrounds */
[data-theme="dark"] #app { background: var(--bg); }
[data-theme="dark"] html,
[data-theme="dark"] body { background: var(--bg); }
[data-theme="dark"] #page-practice.active { background: var(--bg); }
[data-theme="dark"] .scope-switcher { background: #242730; border-color: #2d3038; color: #9ca0a6; }
[data-theme="dark"] .scope-switcher:hover { background: #2a2d35; border-color: #2d3038; }
[data-theme="dark"] .practice-sheet-panel { background: #1e2128; border-color: #2d3038; }
[data-theme="dark"] .exam-sheet-num:hover,
[data-theme="dark"] #practice-sheet-grid .exam-sheet-num:hover { background: #2a2d35; }
[data-theme="dark"] .ctrl-btn-prev { background: #242730; color: #c8ccd2; border-color: #2d3038; }
[data-theme="dark"] .ctrl-btn-prev:hover:not(.disabled) { background: #2d3038; }
[data-theme="dark"] .ctrl-btn-outline { background: #242730; color: #c8ccd2; border-color: #2d3038; }
[data-theme="dark"] .ctrl-btn-sheet-mobile { background: #242730; color: #c8ccd2; border-color: #2d3038; }
[data-theme="dark"] .keyboard-hint { background: #1a1d24; border-top-color: #2d3038; }
[data-theme="dark"] .analysis-area { background: #1e2128; }
[data-theme="dark"] .exam-sheet-num.marked { background: rgba(250,173,20,0.15); border-color: var(--warning); color: var(--warning); }
[data-theme="dark"] .btn-remove-review { background: #242730; color: #9ca0a6; }
[data-theme="dark"] .btn-remove-review:hover { background: #2d3038; color: #c8ccd2; }
[data-theme="dark"] .review-progress-badge.todo { background: #242730; color: #6b6f75; }
[data-theme="dark"] .accuracy-track { background: #2d3038; }
[data-theme="dark"] .guide-content > .guide-table-card:nth-child(even) { background: #1e2128; }
[data-theme="dark"] .guide-content > .guide-table-card:nth-child(odd) { background: #242730; }
[data-theme="dark"] .q-option::before { background: #1e2128; border-color: #2d3038; }

/* Dark mode toggle button */

/* Settings modal */  /* Settings modal */
  .settings-body{padding:14px 2px 2px;}
  .setting-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 2px;border-bottom:1px solid var(--border);}
  .setting-row:last-child{border-bottom:none;}
  .setting-info{min-width:0;}
  .setting-title{font-size:14px;font-weight:600;color:var(--text-primary, #1f2329);}
  .setting-desc{font-size:12px;color:var(--text-tertiary);margin-top:2px;}
  .switch{position:relative;display:inline-block;width:44px;height:24px;flex:none;}
  .switch input{opacity:0;width:0;height:0;position:absolute;}
  .switch .slider{position:absolute;cursor:pointer;inset:0;background:#c9c9cf;border-radius:24px;transition:.2s;}
  .switch .slider:before{content:"";position:absolute;height:18px;width:18px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.2s;}
  .switch input:checked + .slider{background:var(--primary, #e0562f);}
  .switch input:checked + .slider:before{transform:translateX(20px);}






* { margin: 0; padding: 0; box-sizing: border-box; -webkit-tap-highlight-color: transparent; }



html, body {

  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;

  font-size: 16px;

  line-height: 1.6;

  color: var(--text);

  background: var(--bg);

  -webkit-font-smoothing: antialiased;

  overflow-x: clip;

  -webkit-overflow-scrolling: touch;

}



/* ===== App Layout ===== */

#app {

  max-width: 500px;

  margin: 0 auto;

  min-height: 100vh;
  min-height: 100dvh; /* 动态视口：手机浏览器工具栏压缩可视高度时正确贴合 */

  background: var(--bg);

  padding-bottom: calc(88px + var(--safe-bottom));

  position: relative;

}



.page {

  display: none;

  min-height: 100vh;
  min-height: 100dvh; /* 动态视口：手机浏览器工具栏压缩可视高度时正确贴合 */

  animation: fadeIn 0.3s ease;

}

.page.active { display: block; }

/* ===== 二级页面（Sub Page）===== */
.subpage-header { padding: 14px 16px; align-items: center; gap: 8px; }
.subpage-header .header-text { flex: 1 1 0%; min-width: 0; overflow: visible; }
.subpage-header .header-title { white-space: normal; overflow-wrap: anywhere; word-break: break-all; line-height: 1.4; }
.subpage-back { flex: none; width: 40px; height: 40px; border-radius: 50%; border: none; background: rgba(255,255,255,0.18); color: #fff; font-size: 20px; cursor: pointer; line-height: 1; transition: background 0.2s; }
.subpage-back:hover { background: rgba(255,255,255,0.3); }
.subpage-body { max-width: 880px; margin: 0 auto; padding: 16px 16px calc(28px + var(--safe-bottom)); }
@media (min-width: 768px) {
  .subpage-header { padding: 20px 32px; max-width: none !important; margin: 0 !important; }
  .subpage-body { padding: 20px 32px 40px; }
}
/* 编辑试题详解页：大屏加宽内容区，减少两侧留白 */
@media (min-width: 1024px) {
  #page-explain-editor .subpage-body { max-width: 1120px; }
}
/* 试题详解管理页：头部与功能区间距收紧 */
#page-explain-manager .subpage-header { padding-bottom: 12px; }
@media (min-width: 768px) {
  #page-explain-manager .subpage-body { max-width: none; padding-top: 16px; }
}
/* 二级页面进入时隐藏底部导航（手机端沉浸） */
body.subpage-open .bottom-nav { display: none !important; }
body.subpage-open #app { padding-bottom: calc(20px + var(--safe-bottom)); }

/* ===== 底部抽屉（手机端：数字题/陷阱/高频等选择型弹窗）===== */
@media (max-width: 767px) {
  .modal-overlay, #num-modal-overlay, #trap-modal-overlay, #mix-modal-overlay, #memorize-modal-overlay, #scope-modal-overlay {
    align-items: flex-end;
  }
  .modal-overlay.show .modal-content, .modal-content,
  #num-modal-content, #trap-modal-content, #mix-modal-content, #memorize-modal-content, #scope-modal-content {
    width: 100%;
    max-width: 100%;
    max-height: 88vh;
    border-radius: 20px 20px 0 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    margin: 0;
  }
}

/* 抽屉 grabber 与滑入动画 */
.modal-grabber { width: 40px; height: 4px; border-radius: 999px; background: var(--border, #d0d5da); margin: 0 auto 14px; flex: none; }
@media (max-width: 767px) {
  .modal-overlay.show .modal-content,
  .modal-overlay.show #num-modal-content,
  .modal-overlay.show #trap-modal-content,
  .modal-overlay.show #mix-modal-content,
  .modal-overlay.show #memorize-modal-content,
  .modal-overlay.show #scope-modal-content {
    animation: modalSlideUp 0.32s cubic-bezier(0.16, 1, 0.3, 1);
  }
  @keyframes modalSlideUp {
    from { transform: translateY(100%); }
    to { transform: translateY(0); }
  }
}






@keyframes fadeIn {

  from { opacity: 0; transform: translateY(8px); }

  to { opacity: 1; transform: translateY(0); }

}



/* ===== Header ===== */

.header {

  background: linear-gradient(135deg, var(--primary) 0%, #4f8f6a 100%);

  color: #fff;

  padding: 24px 20px 22px;

  position: relative;

  overflow: hidden;

  display: flex;

  align-items: center;

  justify-content: space-between;

  flex-wrap: wrap;

  gap: 12px 16px;

}

.header::after {

  content: '';

  position: absolute;

  bottom: -1px;

  left: 0;

  right: 0;

  height: 24px;

  background: var(--bg);

  border-radius: 24px 24px 0 0;

}

.header-text {

  flex: 1;

  min-width: 0;

}

.header-title {

  font-size: 22px;

  font-weight: 700;

  margin-bottom: 4px;

}

.header-subtitle {

  font-size: 13px;

  opacity: 0.85;

}

.header-stats {

  display: flex;

  gap: 16px;

  margin-top: 0;

  flex-shrink: 0;

}

.header-stat {

  background: rgba(255,255,255,0.15);

  border-radius: var(--radius-sm);

  padding: 8px 14px;

  backdrop-filter: blur(10px);

}

.header-stat-num {

  font-size: 20px;

  font-weight: 700;

}

.header-stat-label {

  font-size: 11px;

  opacity: 0.8;

}



/* ===== Home Page ===== */

.hero-banner {

  margin: -8px 16px 0;

  background: linear-gradient(135deg, #e5f1ea 0%, #eef6ef 100%);

  border-radius: var(--radius-lg);

  padding: 20px;

  display: flex;

  align-items: center;

  gap: 16px;

  position: relative;

  overflow: hidden;

}

.hero-banner::after {

  content: '';

  position: absolute;

  right: -20px;

  top: -20px;

  width: 100px;

  height: 100px;

  background: rgba(46,107,79,0.08);

  border-radius: 50%;

}

.hero-icon {

  width: 52px;

  height: 52px;

  background: var(--primary);

  border-radius: var(--radius);

  display: flex;

  align-items: center;

  justify-content: center;

  font-size: 28px;

  flex-shrink: 0;

}

.hero-text h3 { font-size: 16px; font-weight: 600; }
.hero-text h3 .goal-adj { display:inline-flex; align-items:center; gap:4px; margin-left:8px; vertical-align:middle; }
.hero-text h3 .goal-adj-btn { width:22px; height:22px; border-radius:6px; border:1px solid rgba(0,0,0,0.14); background:#fff; color:var(--text-secondary); font-size:14px; line-height:1; font-weight:700; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; padding:0; transition:all .15s ease; }
.hero-text h3 .goal-adj-btn:hover { border-color:#b9975b; color:#8a6420; background:#fff8ec; }
[data-theme="dark"] .hero-text h3 .goal-adj-btn { background:#2a2d35; border-color:#3a3f4a; color:#c8ccd2; }
[data-theme="dark"] .hero-text h3 .goal-adj-btn:hover { border-color:#d4a94e; color:#ffd87a; }

.hero-text p { font-size: 13px; color: var(--text-secondary); margin-top: 2px; }

.hero-actions { order: 2; margin-left:0; display:flex; align-items:center; gap:8px; flex-shrink:0; }

.hero-due-btn { display:flex; align-items:center; gap:5px; flex-shrink:0; background:#ffffff; border:1px solid rgba(0,0,0,0.12); color:var(--text-secondary); font-size:12px; font-weight:600; padding:8px 12px; border-radius:999px; cursor:pointer; transition:all .15s ease; }

.hero-due-btn:hover { border-color:var(--text-tertiary); color:var(--text); }

.hero-due-btn .hero-due-num { min-width:16px; height:16px; line-height:16px; text-align:center; font-size:11px; font-weight:700; border-radius:999px; background:rgba(0,0,0,0.08); color:var(--text-secondary); padding:0 4px; }

.hero-due-btn.has-due { border-color:rgba(201,79,79,0.45); color:#c94f4f; }

.hero-due-btn.has-due .hero-due-num { background:#c94f4f; color:#fff; }

/* ===== 到期复习提醒条（第二轮·复习提醒） ===== */
.review-remind-bar { display:none; align-items:center; gap:10px; flex-wrap:wrap; margin:0 16px 14px; padding:12px 14px; background:linear-gradient(135deg,rgba(250,140,22,.12) 0%,rgba(250,140,22,.05) 100%); border:1px solid rgba(250,140,22,.38); border-radius:12px; color:var(--text); font-size:14px; line-height:1.6; box-shadow:0 2px 8px rgba(180,95,10,.08); }
.review-remind-bar.show { display:flex; }
.review-remind-bar .rrb-icon { flex:none; font-size:18px; line-height:1; }
.review-remind-bar .rrb-text { flex:1; min-width:0; text-align:left; }
.review-remind-bar .rrb-text b { color:#d97706; font-weight:700; }
.review-remind-bar .rrb-actions { display:flex; align-items:center; gap:6px; flex:none; }
.review-remind-bar .rrb-go { padding:6px 14px; border:none; border-radius:8px; background:linear-gradient(135deg,#f97316 0%,#ea580c 100%); color:#ffffff; font-size:13px; font-weight:600; cursor:pointer; transition:opacity .15s ease; }
.review-remind-bar .rrb-go:hover { opacity:.88; }
.review-remind-bar .rrb-dismiss { padding:6px 8px; border:none; background:transparent; color:var(--text-tertiary); font-size:13px; cursor:pointer; }
.review-remind-bar .rrb-dismiss:hover { color:var(--text); }
[data-theme="dark"] .review-remind-bar { background:rgba(250,140,22,.18); border-color:rgba(250,140,22,.50); box-shadow:none; }

/* ===== Review Plan Modal ===== */
.plan-summary { padding: 14px 20px 4px; font-size: 13px; color: var(--text-secondary); }
.plan-summary b { color: var(--text); }
.plan-summary .plan-due-num { color: #c94f4f; }
.plan-range { display: flex; gap: 6px; padding: 12px 20px 0; }
.plan-range-btn { flex: 1; padding: 7px 0 6px; border-radius: 999px; font-size: 11px; font-weight: 700; color: var(--text-secondary); background: rgba(0,0,0,0.04); border: 1px solid transparent; cursor: pointer; line-height: 1.3; transition: all .15s ease; }
.plan-range-btn b { display: block; font-size: 14px; font-weight: 700; color: var(--text); margin-bottom: 1px; }
.plan-range-btn.active { background: var(--text); border-color: var(--text); color: var(--card-bg); }
.plan-range-btn.active b { color: var(--card-bg); }
.plan-empty { padding: 30px 20px; font-size: 12px; color: var(--text-tertiary); text-align: center; }
[data-theme="dark"] .plan-range-btn { background: rgba(255,255,255,0.07); color: #9ca0a6; }
[data-theme="dark"] .plan-range-btn b { color: #d0d3d8; }
[data-theme="dark"] .plan-range-btn.active { background: #d0d3d8; border-color: #d0d3d8; color: #1c1e24; }
[data-theme="dark"] .plan-range-btn.active b { color: #1c1e24; }
/* 考点速记 */
.kd-stats{display:flex;gap:8px;padding:14px 20px 0;}
.kd-stat{flex:1;text-align:center;padding:9px 0 8px;border-radius:10px;font-size:12px;color:var(--text-secondary);background:rgba(0,0,0,0.06);}
.kd-stat b{display:block;font-size:22px;line-height:1.1;margin-bottom:3px;font-weight:800;color:var(--text);}
.kd-stat.hl{background:#fff4ec;color:#c06a2e;}
.kd-stat.hl b{color:#c06a2e;}
[data-theme="dark"] .kd-stat{background:rgba(255,255,255,0.07);}
[data-theme="dark"] .kd-stat.hl{background:rgba(224,122,58,0.16);color:#e79a6b;}
[data-theme="dark"] .kd-stat.hl b{color:#f0b287;}
.kd-filter{display:flex;flex-wrap:wrap;gap:8px;margin:12px 20px 2px;}
.kd-filter-tag{padding:5px 12px;border-radius:999px;border:1px solid var(--border);background:var(--card-bg);color:var(--text-secondary);font-size:12px;cursor:pointer;transition:all .15s ease;}
.kd-filter-tag:hover{border-color:var(--text-tertiary);color:var(--text);}
.kd-filter-tag.active{background:color-mix(in srgb, var(--primary) 12%, transparent);border-color:var(--primary);color:var(--primary);font-weight:600;}
[data-theme="dark"] .kd-filter-tag{background:rgba(255,255,255,0.06);}
[data-theme="dark"] .kd-filter-tag.active{background:color-mix(in srgb, var(--primary) 16%, transparent);color:var(--primary);}
.kd-tip{padding:6px 20px 2px;font-size:12px;color:var(--text-tertiary);line-height:1.6;}
.kd-list{padding:10px 20px 16px;}
.kd-item{border:1px solid var(--border);border-radius:12px;padding:12px 14px;margin-bottom:10px;background:var(--card-bg);}
[data-theme="dark"] .kd-item{background:#1e2128;border-color:#2d3038;}
.kd-head{display:flex;align-items:flex-start;gap:8px;}
.kd-title{flex:1;font-size:14px;font-weight:700;color:var(--text);line-height:1.5;}
.kd-tag{flex:none;font-size:11px;font-weight:700;padding:2px 8px;border-radius:999px;background:rgba(0,0,0,0.05);color:var(--text-secondary);}
.kd-tag.trap{background:#fff1f0;color:#c94f4f;border:1px solid rgba(201,79,79,0.3);}
.kd-tag.num{background:#fff4ec;color:#c06a2e;border:1px solid rgba(192,106,46,0.3);}
[data-theme="dark"] .kd-tag{background:rgba(255,255,255,0.08);color:#9ca0a6;}
[data-theme="dark"] .kd-tag.trap{background:rgba(201,79,79,0.15);color:#e07979;border-color:rgba(201,79,79,0.35);}
[data-theme="dark"] .kd-tag.num{background:rgba(224,122,58,0.15);color:#e79a6b;border-color:rgba(224,122,58,0.3);}
.kd-cat{font-size:11px;color:var(--text-tertiary);margin-top:5px;}
.kd-content{margin-top:8px;font-size:13px;color:var(--text-secondary);line-height:1.8;}
.kd-mn-wrap{display:none;margin-top:10px;padding:9px 12px;border-radius:10px;background:rgba(0,0,0,0.04);border:1px dashed var(--border);}
[data-theme="dark"] .kd-mn-wrap{background:rgba(255,255,255,0.05);}
.kd-mn-label{font-size:11px;font-weight:700;color:var(--primary);margin-bottom:4px;}
.kd-mn-text{font-size:13px;color:var(--text);line-height:1.7;}
.kd-mn-btn{margin-top:10px;font-size:12px;font-weight:600;color:var(--primary);background:none;border:1px solid var(--border);padding:5px 14px;border-radius:999px;cursor:pointer;transition:all .15s ease;}
.kd-mn-btn:hover{border-color:var(--primary);}
.kd-search-wrap{position:relative;margin:12px 20px 0;}
.kd-search{width:100%;padding:9px 14px;border-radius:10px;border:1px solid var(--border);background:var(--card-bg);color:var(--text);font-size:13px;outline:none;transition:border-color .15s ease;box-sizing:border-box;}
.kd-search:focus{border-color:var(--primary);}
[data-theme="dark"] .kd-search{background:rgba(255,255,255,0.06);}
.kd-search-clear{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--text-tertiary);font-size:14px;cursor:pointer;display:none;padding:2px 6px;}
.kd-learn-toolbar{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:12px 20px 0;}
.kd-learn-count{font-size:12px;color:var(--text-secondary);}
.kd-learn-count b{color:var(--primary);font-weight:700;}
.kd-learn-filter{display:flex;gap:6px;}
.kd-learn-btn{padding:4px 12px;border-radius:999px;border:1px solid var(--border);background:var(--card-bg);color:var(--text-secondary);font-size:12px;cursor:pointer;transition:all .15s ease;}
.kd-learn-btn:hover{border-color:var(--text-tertiary);color:var(--text);}
.kd-learn-btn.active{background:color-mix(in srgb, var(--primary) 12%, transparent);border-color:var(--primary);color:var(--primary);font-weight:600;}
[data-theme="dark"] .kd-learn-btn{background:rgba(255,255,255,0.06);}
[data-theme="dark"] .kd-learn-btn.active{background:color-mix(in srgb, var(--primary) 16%, transparent);color:var(--primary);}
.kd-quiz{padding:4px 0;}
.kd-quiz-top{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:var(--text-secondary);margin-bottom:10px;}
.kd-quiz-count{color:var(--text);font-weight:600;}
.kd-quiz-rec{color:var(--text-tertiary);}
.kd-quiz-bar{height:4px;background:var(--border);border-radius:999px;overflow:hidden;margin-bottom:16px;}
.kd-quiz-bar-fill{height:100%;background:var(--primary);border-radius:999px;transition:width .3s;}
.kd-quiz-card{border:1px solid var(--border);border-radius:12px;padding:20px 18px;background:color-mix(in srgb, var(--primary) 2%, transparent);}
.kd-quiz-cat{display:inline-block;font-size:11px;font-weight:600;color:var(--primary);border:1px solid color-mix(in srgb, var(--primary) 40%, transparent);border-radius:999px;padding:2px 9px;margin-bottom:12px;}
.kd-quiz-title{font-size:16px;font-weight:700;line-height:1.5;color:var(--text);}
.kd-quiz-ans{margin-top:14px;padding-top:14px;border-top:1px dashed var(--border);}
.kd-quiz-label{font-size:11px;font-weight:600;color:var(--text-tertiary);margin:10px 0 4px;}
.kd-quiz-content{font-size:13px;line-height:1.7;color:var(--text);}
.kd-quiz-mn{font-size:13px;line-height:1.7;color:var(--primary);}
#kd-quiz-show{margin-top:16px;}
#kd-quiz-rate{display:none;gap:10px;margin-top:16px;}
.kd-quiz-btn{flex:1;padding:10px 0;border-radius:10px;border:1px solid var(--border);background:none;color:var(--text);font-size:13px;font-weight:600;cursor:pointer;transition:all .1s;}
.kd-quiz-btn.main{background:var(--primary);border-color:var(--primary);color:#fff;}
.kd-quiz-btn.ok{background:color-mix(in srgb, var(--primary) 14%, transparent);border-color:color-mix(in srgb, var(--primary) 50%, transparent);color:var(--primary);}
.kd-quiz-btn.retry{background:color-mix(in srgb, #d97706 12%, transparent);border-color:#d97706;color:#d97706;}
.kd-quiz-btn.exit{background:none;border-color:var(--border);color:var(--text-secondary);}
.kd-quiz-btn.main:active,.kd-quiz-btn.ok:active,.kd-quiz-btn.retry:active{transform:scale(.97);}
.kd-quiz-btn:disabled{opacity:.55;cursor:default;transform:none !important;}
.kd-quiz-foot .kd-quiz-exit{margin:0 6px;}
.kd-quiz-foot{margin-top:14px;text-align:center;}
.kd-quiz-exit{background:none;border:none;color:var(--text-tertiary);font-size:12px;cursor:pointer;text-decoration:underline;padding:4px 8px;}
.kd-quiz-done{text-align:center;padding:28px 10px 14px;}
.kd-quiz-done-icon{width:46px;height:46px;margin:0 auto 14px;border-radius:50%;background:color-mix(in srgb, var(--primary) 12%, transparent);color:var(--primary);font-size:22px;display:flex;align-items:center;justify-content:center;}
.kd-quiz-done-title{font-size:16px;font-weight:700;color:var(--text);margin-bottom:8px;}
.kd-quiz-done-stats{font-size:13px;color:var(--text-secondary);margin-bottom:4px;}
.kd-quiz-done-stats b{color:var(--text);font-weight:700;}
.kd-quiz-done-rate{font-size:13px;color:var(--text-secondary);margin-bottom:20px;}
.kd-quiz-done-rate b{font-size:20px;color:var(--primary);font-weight:800;}
.kd-quiz-done-btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;}
.kd-quiz-done-btns .kd-quiz-btn{flex:none;padding:10px 18px;}
.kd-learn-mark{flex:none;font-size:11px;font-weight:600;padding:4px 10px;border-radius:999px;border:1px solid var(--border);background:none;color:var(--text-secondary);cursor:pointer;transition:all .15s ease;}
.kd-learn-mark:hover{border-color:var(--primary);color:var(--primary);}
.kd-learn-mark.on{background:#e8f5e9;color:#2e7d32;border-color:#66bb6a;}
[data-theme="dark"] .kd-learn-mark.on{background:rgba(46,125,50,0.22);color:#81c784;border-color:#388e3c;}
.plan-tip { padding: 4px 20px 12px; font-size: 12px; color: var(--text-tertiary); line-height: 1.6; }
.plan-item { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 13px 20px; cursor: pointer; border-bottom: 1px solid var(--bg); }
.plan-item:active { background: var(--bg); }
.plan-item-main { min-width: 0; flex: 1; }
.plan-item-q { font-size: 14px; color: var(--text); line-height: 1.5; }
.plan-item-meta { margin-top: 4px; font-size: 11px; color: var(--text-tertiary); }
.plan-item-side { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; flex-shrink: 0; }
.plan-badge { font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 999px; }
.plan-badge.due { background: #fff1f0; color: #c94f4f; border: 1px solid rgba(201,79,79,0.35); }
.plan-badge.soon { background: rgba(0,0,0,0.05); color: var(--text-secondary); }
.plan-item-date { font-size: 11px; color: var(--text-tertiary); }
.plan-select-enter{flex:none;padding:4px 12px;border-radius:999px;font-size:12px;font-weight:600;color:var(--text-secondary);background:rgba(0,0,0,0.05);cursor:pointer;}
[data-theme="dark"] .plan-select-enter{background:rgba(255,255,255,0.08);color:#9ca0a6;}
.plan-select-cancel{flex:none;padding:4px 12px;border-radius:999px;font-size:12px;font-weight:600;color:var(--danger);background:rgba(201,79,79,0.1);cursor:pointer;}
.plan-check{flex:none;width:18px;height:18px;border-radius:5px;border:1.5px solid var(--text-tertiary);display:inline-flex;align-items:center;justify-content:center;font-size:12px;color:#fff;background:transparent;}
.plan-check.checked{background:var(--primary);border-color:var(--primary);}
.plan-skip-bar{display:flex;gap:10px;padding:12px 20px 0;}
.plan-btn-skip{background:var(--primary);border-color:var(--primary);color:#fff;}
.plan-btn-skip.disabled{opacity:.4;pointer-events:none;}
.plan-btn-cancel{background:transparent;border-color:var(--border);color:var(--text-secondary);}
.plan-actions { display: flex; gap: 10px; padding: 14px 20px calc(18px + var(--safe-bottom)); border-top: 1px solid var(--bg); }
.plan-group-header { display: flex; justify-content: space-between; align-items: center; padding: 12px 20px 6px; font-size: 12px; font-weight: 700; color: var(--text-secondary); }
.plan-group-due { color: #c94f4f; font-weight: 700; }
.plan-group + .plan-group { border-top: 1px dashed var(--border); }
.plan-note { padding: 10px 20px 12px; font-size: 11px; color: var(--text-tertiary); line-height: 1.6; border-bottom: 1px solid var(--bg); }
[data-theme="dark"] .plan-group-header { color: #9ca0a6; }
.plan-btn { flex: 1; padding: 11px 0; border-radius: 999px; font-size: 13px; font-weight: 700; cursor: pointer; border: 1px solid; transition: all .15s ease; }
.plan-btn-due { background: #c94f4f; border-color: #c94f4f; color: #fff; }
.plan-btn-due:hover { opacity: 0.9; }
.plan-btn-due.disabled { background: #e8e8e8; border-color: #e8e8e8; color: #999; cursor: not-allowed; }
.plan-btn-all { background: var(--card-bg); border-color: var(--border); color: var(--text-secondary); }
.plan-btn-all:hover { border-color: var(--text-tertiary); color: var(--text); }
[data-theme="dark"] .plan-summary b { color: #d0d3d8; }
[data-theme="dark"] .plan-badge.soon { background: rgba(255,255,255,0.08); color: #9ca0a6; }
[data-theme="dark"] .plan-badge.due { background: rgba(201,79,79,0.15); color: #e07979; border-color: rgba(201,79,79,0.4); }
[data-theme="dark"] .plan-btn-all { background: #292c35; border-color: #3a3f4a; color: #9ca0a6; }
[data-theme="dark"] .plan-btn-all:hover { color: #d0d3d8; }
[data-theme="dark"] .plan-btn-due.disabled { background: #2a2d35; border-color: #3a3f4a; color: #6b6f75; }

.hero-history-btn {

  display: flex;

  align-items: center;

  gap: 5px;

  flex-shrink: 0;

  background: #ffffff;

  border: 1px solid rgba(46,107,79,0.25);

  color: var(--primary);

  font-size: 12px;

  font-weight: 600;

  padding: 8px 12px;

  border-radius: 999px;

  cursor: pointer;

  transition: all 0.2s;

  position: relative;

  z-index: 1;

}

.hero-history-btn:active { transform: scale(0.96); }



/* Feature Grid */

.section-title {

  font-size: 17px;

  font-weight: 700;

  padding: 24px 20px 12px;

  display: flex;

  align-items: center;

  justify-content: space-between;

}

.section-title span { font-size: 13px; color: var(--text-tertiary); font-weight: 400; }



.feature-grid {

  display: grid;

  grid-template-columns: repeat(4, 1fr);

  gap: 12px;

  padding: 0 16px;

}

.feature-item {

  background: var(--card-bg);

  border-radius: var(--radius);

  border: 1px solid var(--border);

  padding: 14px 4px;

  text-align: center;

  cursor: pointer;

  transition: all 0.2s;

  box-shadow: 0 3px 10px rgba(36,52,44,0.08);

}

.feature-item:hover { box-shadow: 0 6px 18px rgba(36,52,44,0.14); transform: translateY(-1px); }

.feature-item:active { transform: scale(0.95); }

.feature-icon {

  width: 44px;

  height: 44px;

  border-radius: 12px;

  display: flex;

  align-items: center;

  justify-content: center;

  font-size: 24px;

  margin: 0 auto 8px;

}

.feature-label {

  font-size: 12px;

  font-weight: 500;

  color: var(--text);

}

.feature-group { margin-bottom: 4px; }

.group-title {

  display: flex;

  align-items: center;

  gap: 8px;

  padding: 18px 20px 10px;

  font-size: 14px;

  font-weight: 600;

  color: var(--text);

}

.group-title-dot {

  width: 8px;

  height: 8px;

  border-radius: 50%;

  flex-shrink: 0;

}

.feature-group .feature-grid { padding-top: 0; }



/* Home Search */

.home-search { padding: 0 16px 16px; position: relative; max-width: 832px; margin: 0 auto; }

.search-icon {

  position: absolute; left: 28px; top: 12px; font-size: 16px; pointer-events: none; z-index: 1;

}

.home-search input {

  width: 100%; padding: 12px 14px 12px 40px; border: 1.5px solid var(--primary); border-radius: 12px;

  font-size: 15px; background: var(--card-bg); color: var(--text); outline: none; box-sizing: border-box;

  box-shadow: 0 2px 8px rgba(0,0,0,0.06);

}

.home-search input:focus { border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-light); }



/* Search Results */

.search-results {

  display: none; position: absolute; top: 100%; left: 16px; right: 16px; z-index: 100;

  background: var(--card-bg); border: 1px solid var(--border); border-radius: 10px;

  box-shadow: var(--shadow-lg); max-height: 420px; overflow-y: auto;

}

.search-results.show { display: block; }

.search-result-group { padding: 8px 0; }

.search-result-group-title {

  padding: 6px 14px; font-size: 12px; font-weight: 600; color: var(--primary); background: var(--primary-light);

}

.search-result-item {

  padding: 10px 14px; cursor: pointer; display: flex; align-items: center; gap: 8px;

  border-bottom: 1px solid var(--border); font-size: 14px;

}

.search-result-item:last-child { border-bottom: none; }

.search-result-item:hover { background: var(--primary-light); }

.search-result-item .sr-type {

  font-size: 11px; padding: 2px 6px; border-radius: 4px; flex-shrink: 0;

  background: #e8f0fe; color: #1a73e8; border: 1px solid #cdd9f2;

}

.search-result-item .sr-type.pd { background: #fce8e6; color: #d93025; border-color: #f0cfcb; }

.search-result-item .sr-text { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.search-result-empty { padding: 16px 14px; text-align: center; color: var(--text-tertiary); font-size: 14px; }



/* Chapter List */

.chapter-list { padding: 0 16px; display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: repeat(6, auto); gap: 12px; grid-auto-flow: column; }

.chapter-card {

  background: var(--card-bg);

  border-radius: var(--radius);

  overflow: hidden;

  box-shadow: var(--shadow);

  transition: all 0.2s;

}

.chapter-card:active { transform: scale(0.98); }

.chapter-header {

  padding: 16px 20px;

  display: flex;

  align-items: center;

  justify-content: space-between;

  cursor: pointer;

}

.chapter-info { flex: 1; }

.chapter-name {

  font-size: 16px;

  font-weight: 600;

}

.chapter-meta {

  font-size: 12px;

  color: var(--text-tertiary);

  margin-top: 2px;

}

.chapter-arrow {

  width: 20px;

  height: 20px;

  display: flex;

  align-items: center;

  justify-content: center;

  transition: transform 0.3s;

  color: var(--text-tertiary);

}

.chapter-card.expanded .chapter-arrow { transform: rotate(90deg); }

.section-list {

  display: none;

  padding: 0 12px 12px;

}

.chapter-card.expanded .section-list { display: block; }

.section-item {

  display: flex;

  align-items: center;

  justify-content: space-between;

  padding: 12px 12px;

  border-top: 1px solid var(--border);

  cursor: pointer;

  transition: background 0.2s;

  border-radius: var(--radius-sm);

  margin-top: 4px;

}

.section-item:active { background: var(--bg); }

.section-item-name {

  font-size: 14px;

  color: var(--text);

}

.section-item-meta {

  display: flex;

  align-items: center;

  gap: 8px;

}

.section-count {

  font-size: 12px;

  color: var(--text-tertiary);

  background: var(--bg);

  padding: 2px 8px;

  border-radius: 10px;

}

.section-progress-badge {

  font-size: 11px;

  padding: 2px 8px;

  border-radius: 10px;

  font-weight: 600;

}

.section-progress-badge.done { background: var(--success-light); color: var(--success); }

.section-progress-badge.partial { background: var(--primary-light); color: var(--primary); }

.section-progress-badge.todo { display: none; }



/* ===== Practice Page (驾考宝典风格) ===== */

#page-practice {

  background: #f5f5f5;

}

.practice-header {

  background: #fff;

  padding: 12px 20px 8px;

  box-shadow: 0 1px 4px rgba(0,0,0,0.06);

  position: sticky;

  top: 0;

  z-index: 40;

}

.practice-top {

  display: flex;

  align-items: center;

  justify-content: space-between;

  margin-bottom: 4px;

}

.practice-back {

  width: 28px;

  height: 28px;

  display: flex;

  align-items: center;

  justify-content: center;

  cursor: pointer;

  font-size: 18px;

  color: #333;

  flex-shrink: 0;

}

.practice-title {

  font-size: 15px;

  font-weight: 600;

  color: #333;

  flex: 1;

  text-align: center;

}



/* Breadcrumb */

.breadcrumb-nav {

  font-size: 13px;

  color: #666;

  padding: 4px 0 8px;

}

.breadcrumb-nav .breadcrumb-current {

  color: #333;

  font-weight: 500;

}



/* Scope switcher */

.scope-switcher {

  display: inline-flex;

  align-items: center;

  gap: 4px;

  font-size: 12px;

  color: #666;

  background: #f5f5f5;

  border: 1px solid #e9e9e9;

  border-radius: 4px;

  padding: 2px 8px;

  cursor: pointer;

  white-space: nowrap;

}

.scope-switcher:hover {

  background: #eef3ff;

  border-color: #91d5ff;

}

.scope-switcher-label {

  max-width: 120px;

  overflow: hidden;

  text-overflow: ellipsis;

}

.scope-switcher-arrow {

  font-size: 10px;

  color: #999;

}



/* Progress */

.progress-bar {

  height: 4px;

  background: #e9e9e9;

  border-radius: 2px;

  overflow: hidden;

}

.progress-fill {

  height: 100%;

  background: #4e9b73;

  border-radius: 2px;

  transition: width 0.3s ease;

}

.progress-text {

  font-size: 11px;

  color: #999;

  text-align: right;

  margin-top: 2px;

}



/* Question Card */

.question-container {

  padding: 0 16px;

}

.question-card {

  background: #fff;

  border-radius: 8px;

  padding: 24px 20px 16px;

  margin: 0 0 16px;

}

.q-type-badge {

  display: inline-block;

  padding: 3px 14px;

  border-radius: 12px;

  font-size: 14px;

  font-weight: 600;

  margin-bottom: 14px;

  color: #fff;

}

.q-type-badge.单选题 { background: #2e6b4f; }

.q-type-badge.多选题 { background: #4f7a63; }

.q-type-badge.判断题 { background: #8a6d3b; }

.q-learned-badge {

  display: inline-block;

  padding: 3px 10px;

  border-radius: 12px;

  font-size: 12px;

  font-weight: 600;

  margin-bottom: 14px;

  margin-left: 8px;

  color: #fff;

  background: #b8860b;

  vertical-align: 2px;

}

.q-content {

  font-size: 18px;

  color: #333;

  line-height: 1.7;

  margin-bottom: 20px;

}



/* Collect button */

.btn-collect {

  display: inline-flex;

  align-items: center;

  gap: 4px;

  padding: 4px 12px 4px 28px;

  border: 0.8px solid #E9E9E9;

  border-radius: 4px;

  font-size: 13px;

  color: #333;

  background: transparent;

  cursor: pointer;

  white-space: nowrap;

  position: relative;

  flex-shrink: 0;

  min-width: 82px;

}

.btn-collect::before {

  content: "☆";

  position: absolute;

  left: 10px;

  top: 50%;

  transform: translateY(-50%);

  font-size: 14px;

}

.btn-collect.collected {

  color: #1890ff;

  border-color: #91d5ff;

  background: #e6f4ff;

}

.btn-collect.collected::before {

  content: "★";

  color: #faad14;

}



/* Options - 驾考宝典 inline style */

#q-options {

  width: 700px;

}

.q-option {

  display: block;

  margin: 8px 0;

  padding: 12px 16px 12px 40px;

  font-size: 18px;

  color: #555;

  line-height: 24px;

  cursor: pointer;

  border-radius: 6px;

  position: relative;

  min-height: 24px;

  background: #F5F5F5;

}

.q-option:hover:not(.disabled):not(.correct):not(.wrong) {

  background-color: #F1F1F1;

}

.q-option::before {

  content: "";

  position: absolute;

  left: 8px;

  top: 50%;

  transform: translateY(-50%);

  width: 16px;

  height: 16px;

  border-radius: 50%;

  border: 1px solid #d9d9d9;

  background: #fff;

}

.q-option.selected::before {

  border-color: #4e9b73;

  background: #4e9b73;

}

.q-option.correct::before {

  content: "";

  border-color: var(--success-icon);

  background: var(--success-icon);

  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M13.3 3.3L6 10.6 2.7 7.3 4 6l2 2 6-6 1.3 1.3z' fill='%23fff'/%3E%3C/svg%3E");

  background-size: 12px;

  background-position: center;

  background-repeat: no-repeat;

}

.q-option.correct {

  color: var(--success-text);

  font-weight: 500;

  background: var(--success-bg);

}

.q-option.wrong::before {

  content: "";

  border-color: var(--error-icon);

  background: var(--error-icon);

  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 4.5l7 7M11.5 4.5l-7 7' stroke='%23fff' stroke-width='2'/%3E%3C/svg%3E");

  background-size: 12px;

  background-position: center;

  background-repeat: no-repeat;

}

.q-option.wrong {

  color: var(--error-text);

  font-weight: 400;

}

.q-option .q-option-label {

  display: inline;

}

.q-option .q-option-text {

  display: inline;

}

.q-option.disabled {

  pointer-events: none;

}



/* Type hint */

.q-type-hint {

  display: none;

}



/* Analysis card */

.analysis-card {

  background: #fff;

  border-radius: 8px;

  padding: 16px 20px;

  margin: 0 0 16px;

  min-height: 40px;

  border: 1px solid #e9e9e9;

}

.analysis-card.show {

  /* always visible - kept for JS compatibility */

}

.analysis-correct {

  font-size: 16px;

  color: #3DA600;

  margin-bottom: 8px;

  padding-bottom: 8px;

  border-bottom: 1px solid #e9e9e9;

}

.analysis-correct.wrong {

  color: #EE4653;

}

.analysis-title {

  font-size: 20px;

  color: #333;

  margin-bottom: 12px;

  display: flex;

  align-items: center;

  justify-content: space-between;

}

.analysis-text {

  font-size: 14px;

  color: #6B4C00;

  line-height: 1.8;

}

.analysis-edit-btn {

  margin-left: 10px;

  font-size: 12px;

  padding: 3px 10px;

  border-radius: 999px;

  border: 1px solid var(--primary, #2e7d4f);

  background: rgba(46,125,79,.08);

  color: var(--primary, #2e7d4f);

  cursor: pointer;

  font-weight: 600;

  white-space: nowrap;

}

.analysis-edit-btn:hover { background: rgba(46,125,79,.16); }

.analysis-custom-badge {

  margin-left: 8px;

  font-size: 11px;

  padding: 1px 8px;

  border-radius: 999px;

  background: var(--primary, #2e7d4f);

  color: #fff;

  font-weight: 700;

  vertical-align: 2px;

}

.pp-custom-tag {

  display: inline-block;

  margin-left: 6px;

  font-size: 11px;

  padding: 0 6px;

  border-radius: 999px;

  background: #2e7d4f;

  color: #fff;

  font-weight: 700;

}

/* ===== 学习报告 ===== */

#report-overlay { position: fixed; inset: 0; z-index: 9998; background: var(--bg, #f5f6f8); overflow-y: auto; }

#report-overlay .rp-toolbar { position: sticky; top: 0; z-index: 10; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 12px 16px; background: var(--card-bg); border-bottom: 1px solid var(--border); }

#report-overlay .rp-title { font-size: 17px; font-weight: 700; color: var(--text-primary); }

#report-overlay .rp-body { max-width: 860px; margin: 0 auto; padding: 16px 16px 40px; }

.rp-head { text-align: center; padding: 18px 10px 6px; }

.rp-head h1 { font-size: 22px; margin: 0 0 6px; color: var(--text-primary); }

.rp-head .rp-date { font-size: 13px; color: var(--text-tertiary); }

.rp-summary { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 16px 0; }

.rp-summary .hstat-cell b { font-size: 20px; }

.rp-block { margin: 18px 0; }

.rp-block .rp-block-title { font-size: 15px; font-weight: 700; color: var(--text); margin-bottom: 10px; display: flex; align-items: center; gap: 6px; }

.rp-mode-table { width: 100%; border-collapse: collapse; background: var(--card-bg); border-radius: 10px; overflow: hidden; font-size: 13px; }

.rp-mode-table th, .rp-mode-table td { border-bottom: 1px solid var(--border); padding: 8px 10px; text-align: left; }

.rp-mode-table th { background: var(--card-bg); color: var(--text-secondary); font-size: 12px; font-weight: 700; }

.rp-empty { text-align: center; color: var(--text-secondary); padding: 24px 4px; line-height: 1.8; }

@media print {

  body.printing-report > *:not(#report-overlay) { display: none !important; }

  body.printing-report #report-overlay { position: static; inset: auto; overflow: visible !important; display: block !important; }

  body.printing-report #report-overlay .rp-toolbar { display: none !important; }

  body.printing-report #report-overlay .rp-body { max-width: none; padding: 0; }

}

/* ===== Two-column practice layout ===== */

.practice-body {

  display: flex;

  gap: 20px;

  align-items: flex-start;

}

.practice-left {

  flex: 1;

  min-width: 0;

}

.practice-right {

  width: 320px;

  flex-shrink: 0;

}

.practice-sheet-panel {

  background: #fff;

  border-radius: 8px;

  padding: 16px;

  border: 1px solid #e9e9e9;

  position: sticky;

  top: 16px;

  max-height: calc(100vh - 150px);

  overflow-y: auto;

  overflow-x: hidden;

}

.sheet-header {

  font-size: 16px;

  font-weight: 600;

  color: #333;

  margin-bottom: 12px;

  padding-bottom: 8px;

  border-bottom: 1px solid #e9e9e9;

}

#practice-sheet-grid {

  display: grid;

  grid-template-columns: repeat(auto-fill, minmax(38px, 1fr));

  gap: 6px;

  max-width: 100%;

}

#practice-sheet-grid .exam-sheet-num {

  display: flex;

  align-items: center;

  justify-content: center;

  height: 36px;

  font-size: 12px;

  color: #333;

  border: 1px solid #E9E9E9;

  border-radius: 4px;

  cursor: pointer;

  transition: all 0.15s;

  font-weight: 500;

}

#practice-sheet-grid .exam-sheet-num:hover {

  background: #f5f5f5;

}

#practice-sheet-grid .exam-sheet-num.sheet-correct {

  background: #3DA600;

  color: #fff;

  border-color: #3DA600;

}

#practice-sheet-grid .exam-sheet-num.sheet-wrong {

  background: #EE4653;

  color: #fff;

  border-color: #EE4653;

}

#practice-sheet-grid .exam-sheet-num.sheet-current {

  border-color: #4e9b73;

  border-width: 2px;

  box-shadow: 0 0 0 1px #4e9b73;

}

.practice-stats .stats-links {

  display: none;

}

/* Controls */

.practice-controls {
  position: sticky;
  bottom: 12px;
  z-index: 30;
  display: flex;
  align-items: center;
  justify-content: space-evenly;
  gap: 12px;
  padding: 10px 16px;
  background: #fff;
  border: 1px solid #e9e9e9;
  border-radius: 12px;
  box-shadow: 0 4px 18px rgba(0,0,0,0.08);
  margin-top: 14px;
}
[data-theme="dark"] .practice-controls { background: #1a1d23; border-color: #2d3038; box-shadow: 0 4px 18px rgba(0,0,0,0.45); }
.q-attempt-badge {
  display: inline-block;
  font-size: 12px;
  color: var(--text-tertiary);
  margin-left: 8px;
  font-weight: 400;
}.ctrl-btn {

  flex: 1;

  max-width: 180px;

  height: 40px;

  padding: 0 16px;

  border-radius: 6px;

  font-size: 15px;

  cursor: pointer;

  border: 1px solid transparent;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  white-space: nowrap;

  transition: all 0.2s;

  font-weight: 500;

}

.ctrl-btn-prev {

  background: #f5f5f5;

  color: #333;

  border-color: #d9d9d9;

}

.ctrl-btn-prev:hover:not(.disabled) {

  background: #e8e8e8;

}

.ctrl-btn-next {

  background: #2e6b4f;

  color: #fff;

  border-color: #2e6b4f;

}

.ctrl-btn-next:hover:not(.disabled) {

  background: #22513a;

}

.ctrl-btn-submit {

  background: var(--primary);

  color: #fff;

  border-color: var(--primary);

}

.ctrl-btn-submit:hover:not(.disabled) {

  background: #389e0d;

}

.ctrl-btn-submit.disabled {

  opacity: 0.4;

  pointer-events: none;

}

.ctrl-btn.disabled {

  opacity: 0.35;

  pointer-events: none;

}



/* Keyboard hint */

.keyboard-hint {

  font-size: 12px;

  color: #bbb;

  text-align: center;

  padding: 6px 0 4px;

  background: #fff;

  border-top: 1px solid #f0f0f0;

}

.ctrl-btn-outline {

  background: #fff;

  color: #333;

  border: 0.8px solid #E9E9E9;

  width: 100px;

  height: 36px;

  border-radius: 5px;

  font-size: 14px;

  cursor: pointer;

}

.ctrl-btn-sheet-mobile {

  display: none;

  background: #fff;

  color: #333;

  border: 0.8px solid #E9E9E9;

  width: auto;

  padding: 0 12px;

}



/* Stats row */

.practice-stats {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 16px;

  padding: 10px 20px;

  font-size: 14px;

  color: #999;

  background: #fff;

  border-top: 1px solid #f0f0f0;

}

.practice-stats .stat-val {

  color: #333;

}

.practice-stats label {

  display: flex;

  align-items: center;

  gap: 4px;

  cursor: pointer;

}

.stats-left {

  display: flex;

  align-items: center;

  gap: 16px;

  flex-wrap: wrap;

}

.stats-links {

  display: flex;

  align-items: center;

  gap: 16px;

}

.stats-link {

  font-size: 13px;

  color: #2e6b4f;

  cursor: pointer;

  text-decoration: none;

}

.stats-link:hover {

  color: #22513a;

  text-decoration: underline;

}



/* Answer sheet inline */

.practice-sheet-inline {

  display: none;

  background: #fff;

  padding: 16px 20px;

  margin: 0;

  border-top: 1px solid #e9e9e9;

}

.practice-sheet-inline.show {

  display: block;

}

.exam-sheet-grid {

  display: grid;

  grid-template-columns: repeat(auto-fill, minmax(38px, 1fr));

  gap: 6px;

  max-width: 860px;

}

.exam-sheet-num {

  display: flex;

  align-items: center;

  justify-content: center;

  height: 32px;

  font-size: 13px;

  color: #333;

  cursor: pointer;

  border-radius: 4px;

  border: 1px solid #e9e9e9;

  transition: all 0.15s;

}

.exam-sheet-num:hover {

  border-color: #4e9b73;

}

.exam-sheet-num.sheet-correct {

  background: #3DA600;

  color: #fff;

  border-color: #3DA600;

}

.exam-sheet-num.sheet-wrong {

  background: #EE4653;

  color: #fff;

  border-color: #EE4653;

}

.exam-sheet-num.sheet-current {

  border-color: #4e9b73;

  box-shadow: 0 0 0 2px rgba(55,181,248,0.3);

}



/* Analysis area */

.analysis-area {

  background: #fff;

  padding: 16px 20px;

  display: none;

}

.analysis-area.show {

  display: block;

}



/* Swipe / keyboard hints */

.swipe-hint, .keyboard-hint {

  font-size: 12px;

  color: #ccc;

  text-align: center;

  padding: 4px 0;

}

.keyboard-hint { display: none; }



/* ===== Exam Page ===== */

.exam-timer {

  display: flex;

  align-items: center;

  gap: 6px;

  font-size: 14px;

  font-weight: 600;

  color: var(--danger);

}

.exam-auto-tip {

  margin-top: 10px;

  font-size: 12px;

  color: var(--text-secondary);

  text-align: center;

}

.exam-sheet {

  background: var(--card-bg);

  border-radius: var(--radius-lg);

  padding: 20px;

  margin: 16px;

  box-shadow: var(--shadow);

}

.exam-sheet-title {

  font-size: 15px;

  font-weight: 600;

  margin-bottom: 12px;

}

.exam-sheet-grid {

  display: grid;

  grid-template-columns: repeat(6, 1fr);

  gap: 8px;

}

.exam-sheet-num {

  aspect-ratio: 1;

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: var(--radius-sm);

  font-size: 14px;

  font-weight: 600;

  cursor: pointer;

  border: 2px solid var(--border);

  transition: all 0.2s;

}

.exam-sheet-num.answered { background: var(--primary); color: #fff; border-color: var(--primary); }

.exam-sheet-num.marked { background: #fff7e6; border-color: var(--warning); color: var(--warning); }

.exam-sheet-num:active { transform: scale(0.9); }

/* Practice sheet: correct/wrong/unanswered */

.exam-sheet-num.sheet-correct { background: var(--success); color: #fff; border-color: var(--success); }

.exam-sheet-num.sheet-wrong { background: var(--danger); color: #fff; border-color: var(--danger); }

.exam-sheet-num.sheet-current { border-color: var(--primary); box-shadow: 0 0 0 2px var(--primary-light); }



.sheet-panel-card {

  background: var(--card-bg);

  border-radius: var(--radius-lg);

  padding: 16px 20px 20px;

  box-shadow: var(--shadow);

  position: sticky;

  top: 16px;

  max-height: 80vh;

  overflow-y: auto;

  scrollbar-width: thin;

  scrollbar-color: rgba(128,128,128,0.3) transparent;

  transform: translateZ(0);

  -webkit-backface-visibility: hidden;

  will-change: transform;

}

.sheet-panel-title {

  font-size: 15px;

  font-weight: 600;

  margin-bottom: 8px;

}

.sheet-panel-stats {

  display: flex;

  justify-content: center;

  gap: 12px;

  margin-bottom: 12px;

  font-size: 12px;

}

.sheet-panel-stats span { display: flex; align-items: center; gap: 4px; }

.sheet-panel-card::-webkit-scrollbar { width: 4px; }

.sheet-panel-card::-webkit-scrollbar-track { background: transparent; }

.sheet-panel-card::-webkit-scrollbar-thumb { background: rgba(128,128,128,0.3); border-radius: 4px; }



/* ===== Wrong/Collect Page ===== */

.empty-state {

  text-align: center;

  padding: 80px 20px;

}

.empty-icon {

  font-size: 64px;

  margin-bottom: 16px;

  opacity: 0.3;

}

.empty-text {

  font-size: 15px;

  color: var(--text-tertiary);

}



.list-item {

  background: var(--card-bg);

  border-radius: var(--radius-lg);

  padding: 16px 20px;

  margin: 0 16px 12px;

  box-shadow: var(--shadow);

  cursor: pointer;

  transition: all 0.2s;

}

.list-item:active { transform: scale(0.98); }

.list-item-q {

  font-size: 15px;

  font-weight: 500;

  margin-bottom: 6px;

  display: -webkit-box;

  -webkit-line-clamp: 2;

  -webkit-box-orient: vertical;

  overflow: hidden;

}

.list-item-meta {

  display: flex;

  align-items: center;

  gap: 8px;

  flex-wrap: wrap;

}

.list-item-actions {

  display: flex;

  gap: 8px;

  margin-top: 10px;

}

.btn-learned {

  font-size: 12px;

  padding: 5px 14px;

  border-radius: 14px;

  background: var(--success);

  color: #fff;

  cursor: pointer;

  font-weight: 600;

  border: none;

  transition: all 0.2s;

  white-space: nowrap;

}

.btn-learned:hover { background: var(--success-dark); }

.btn-learned:active { transform: scale(0.95); }

.btn-back-wrong {

  font-size: 12px;

  padding: 5px 14px;

  border-radius: 14px;

  background: var(--success);

  color: #fff;

  cursor: pointer;

  font-weight: 600;

  border: none;

  transition: all 0.2s;

  white-space: nowrap;

}

.btn-back-wrong:hover { background: var(--success-dark); color: #fff; }

.btn-back-wrong:active { transform: scale(0.95); }

.btn-remove-review {

  font-size: 12px;

  padding: 5px 14px;

  border-radius: 14px;

  background: #f5f5f5;

  color: var(--text-tertiary);

  cursor: pointer;

  font-weight: 600;

  border: none;

  transition: all 0.2s;

  white-space: nowrap;

}

.btn-remove-review:hover { background: #e8e8e8; color: var(--text-secondary); }

.btn-remove-review:active { transform: scale(0.95); }

.btn-uncollect {

  font-size: 12px;

  padding: 5px 14px;

  border-radius: 14px;

  border: 1px solid var(--success);

  background: transparent;

  color: var(--success);

  cursor: pointer;

  transition: all 0.2s;

  white-space: nowrap;

}

.btn-uncollect:hover { background: var(--success); color: #fff; }

.btn-uncollect:active { transform: scale(0.95); }

.list-item-highlight {

  background: var(--danger-light) !important;

  border-left: 3px solid var(--danger);

}

.wrong-count-badge {

  display: inline-block;

  font-size: 11px;

  font-weight: 700;

  padding: 1px 6px;

  border-radius: 8px;

  background: #c94f4f;

  color: #fff;

  margin-right: 4px;

  vertical-align: middle;

}

.review-progress-badge {

  display: inline-block;

  font-size: 11px;

  font-weight: 600;

  padding: 1px 6px;

  border-radius: 8px;

  margin-right: 4px;

  vertical-align: middle;

}

.review-progress-badge.todo {

  background: #f5f5f5;

  color: var(--text-tertiary);

}

.review-progress-badge.partial {

  background: var(--success-light);

  color: var(--success);

}

.list-item-tag {

  font-size: 11px;

  padding: 2px 8px;

  border-radius: 8px;

  font-weight: 600;

}



/* ===== Stats Page ===== */

/* —— 顶部核心指标条（瘦身版：横向紧凑卡片） —— */
.stats-grid {

  display: grid;

  grid-template-columns: repeat(3, 1fr);

  gap: 10px;

  padding: 0 16px;

  margin-bottom: 14px;

}

.stat-card {

  display: flex;

  align-items: center;

  gap: 10px;

  background: var(--card-bg);

  border-radius: 12px;

  padding: 11px 12px;

  box-shadow: var(--shadow);

  min-width: 0;

}

.stat-icon {

  width: 34px;

  height: 34px;

  border-radius: 9px;

  display: flex;

  align-items: center;

  justify-content: center;

  font-size: 15px;

  flex-shrink: 0;

}

.stat-body {

  min-width: 0;

  flex: 1;

}

.stat-num {

  font-size: 21px;

  font-weight: 700;

  line-height: 1.15;

  color: var(--primary);

  white-space: nowrap;

}

.stat-num.is-warn { color: var(--danger); }

.stat-label {

  font-size: 11.5px;

  color: var(--text-tertiary);

  margin-top: 1px;

  white-space: nowrap;

  overflow: hidden;

  text-overflow: ellipsis;

}

/* —— 各章节掌握度：2 列紧凑卡片网格 —— */
.chapter-grid {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 10px;

  padding: 0 16px;

}

@media (max-width: 640px) {

  .chapter-grid { grid-template-columns: 1fr; }

}

.cp-card {

  cursor: pointer;

  background: var(--card-bg);

  border: 1px solid var(--border);

  border-radius: 12px;

  padding: 11px 13px;

  transition: transform .12s ease, box-shadow .12s ease;

}

.cp-card:hover { box-shadow: var(--shadow-lg); transform: translateY(-1px); }

.cp-card-unstarted { opacity: .55; }

.cp-card-unstarted:hover { opacity: .82; }

.cp-top {

  display: flex;

  justify-content: space-between;

  align-items: center;

  gap: 8px;

  margin-bottom: 7px;

}

.cp-name {

  font-size: 13.5px;

  font-weight: 600;

  flex: 1;

  min-width: 0;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;

}

.cp-tag { font-size: 11px; font-weight: 600; flex-shrink: 0; }

.cp-foot {

  display: flex;

  justify-content: space-between;

  align-items: flex-end;

  gap: 8px;

  margin-top: 7px;

}

.cp-meta {

  font-size: 11.5px;

  color: var(--text-secondary);

  min-width: 0;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;

}

.cp-mastery {

  font-size: 17px;

  font-weight: 700;

  line-height: 1;

  flex-shrink: 0;

  display: flex;

  align-items: baseline;

  gap: 3px;

}

.cp-mastery em {

  font-size: 10px;

  font-style: normal;

  color: var(--text-tertiary);

  font-weight: 400;

}

/* Accuracy Bar（各题型正确率） */
.accuracy-bar-wrap {

  background: var(--card-bg);

  border-radius: var(--radius-lg);

  padding: 18px 18px 14px;

  margin: 0 16px 16px;

  box-shadow: var(--shadow);

}

.accuracy-bar-title {

  font-size: 15px;

  font-weight: 600;

  margin-bottom: 14px;

  display: flex;

  align-items: baseline;

  justify-content: space-between;

}

.accuracy-bar-title .sub {

  font-size: 11.5px;

  color: var(--text-tertiary);

  font-weight: 400;

}

.accuracy-row {

  display: flex;

  align-items: center;

  gap: 10px;

  margin-bottom: 13px;

}

.accuracy-label {

  width: 52px;

  flex-shrink: 0;

  font-size: 13px;

  color: var(--text);

  font-weight: 500;

}

.accuracy-track {

  flex: 1;

  height: 10px;

  background: #f0f0f0;

  border-radius: 5px;

  overflow: hidden;

  position: relative;

}

[data-theme="dark"] .accuracy-track { background: rgba(255,255,255,.09); }

.accuracy-fill {

  height: 100%;

  border-radius: 5px;

  transition: width 0.5s ease;

}

.accuracy-fill.none { background: rgba(128,128,128,.25) !important; }

.accuracy-goal {

  position: absolute;

  top: -2px;

  bottom: -2px;

  width: 2px;

  border-radius: 1px;

  background: rgba(128,128,128,.45);

}

.accuracy-value {

  width: 44px;

  text-align: right;

  font-size: 13.5px;

  font-weight: 700;

  color: var(--primary);

  flex-shrink: 0;

}

.accuracy-value.none { color: var(--text-tertiary); font-weight: 500; }

.accuracy-sub {

  width: 46px;

  text-align: right;

  font-size: 11px;

  color: var(--text-tertiary);

  flex-shrink: 0;

  white-space: nowrap;

}

/* 每日学习明细：行 hover + 周末浅底色 */
.trend-table tbody tr { transition: background .12s; }

.trend-table tbody tr:hover { background: rgba(0,0,0,.035); }

[data-theme="dark"] .trend-table tbody tr:hover { background: rgba(255,255,255,.05); }

.trend-table tr.wkend td { background: rgba(0,0,0,.018); }

[data-theme="dark"] .trend-table tr.wkend td { background: rgba(255,255,255,.025); }



/* ===== Bottom Nav ===== */

/* 首页“继续上次练习”横幅：置于底栏之上，避免滚到底部时被遮挡 (2026-09-07) */
.resume-banner { position: relative; z-index: 300; }

.bottom-nav {

  position: fixed;

  bottom: 0;

  left: 50%;

  transform: translateX(-50%);

  width: 100%;

  max-width: 500px;

  background: var(--card-bg);

  display: flex;

  justify-content: space-around;

  align-items: center;

  padding: 8px 0 calc(8px + var(--safe-bottom));

  box-shadow: 0 -2px 12px rgba(0,0,0,0.06);

  z-index: 200;

}

.nav-item {

  display: flex;

  flex-direction: column;

  align-items: center;

  gap: 2px;

  cursor: pointer;

  padding: 4px 8px;

  border-radius: var(--radius-sm);

  transition: all 0.2s;

}

.nav-icon { font-size: 22px; }

.nav-label { font-size: 11px; color: var(--text-tertiary); }

.nav-item.active .nav-label { color: var(--primary); font-weight: 600; }

.nav-item.active .nav-icon { transform: scale(1.1); }



/* ===== Toast ===== */

.toast {

  position: fixed;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

  background: rgba(0,0,0,0.8);

  color: #fff;

  padding: 12px 24px;

  border-radius: var(--radius);

  font-size: 14px;

  z-index: 9999;

  opacity: 0;

  transition: opacity 0.3s;

  pointer-events: none;

  white-space: nowrap;

}

.toast.show { opacity: 1; }



/* ===== Modal ===== */

.modal-overlay {

  position: fixed;

  top: 0; left: 0;

  width: 100%; height: 100%;

  background: rgba(0,0,0,0.5);

  z-index: 1000;

  display: none;

  align-items: flex-end;

  justify-content: center;

}

.modal-overlay.show { display: flex; }

.modal-content {

  background: var(--card-bg);

  width: 100%;

  max-width: 500px;

  border-radius: 24px 24px 0 0;

  padding: 24px 20px calc(24px + var(--safe-bottom));

  animation: slideUp 0.3s ease;

  max-height: 80vh;

  overflow-y: auto;

}

@keyframes slideUp {

  from { transform: translateY(100%); }

  to { transform: translateY(0); }

}

.modal-title {

  font-size: 18px;

  font-weight: 700;

  text-align: center;

  margin-bottom: 20px;

}

.modal-close {

  width: 100%;

  height: 48px;

  background: var(--bg);

  border: none;

  border-radius: 24px;

  font-size: 16px;

  font-weight: 600;

  cursor: pointer;

  margin-top: 20px;

  color: var(--text-secondary);

}



/* ===== Scope Switcher (切换章节) ===== */

.scope-switcher {

  display: flex;

  align-items: center;

  gap: 4px;

  padding: 6px 12px;

  background: var(--bg);

  border-radius: 16px;

  font-size: 13px;

  color: var(--text-secondary);

  cursor: pointer;

  max-width: 140px;

  white-space: nowrap;

  overflow: hidden;

  text-overflow: ellipsis;

  flex-shrink: 0;

  transition: background 0.2s;

}

.scope-switcher:active { background: var(--primary-light); }

.scope-switcher-label {

  overflow: hidden;

  text-overflow: ellipsis;

}

.scope-switcher-arrow {

  font-size: 10px;

  color: var(--text-tertiary);

  flex-shrink: 0;

}



/* Scope Modal */

.scope-modal {

  padding: 16px 0 0;

}

.scope-modal-header {

  display: flex;

  justify-content: space-between;

  align-items: center;

  padding: 0 20px 12px;

  border-bottom: 1px solid var(--bg);

}

.scope-modal-title {

  font-size: 16px;

  font-weight: 700;

  color: var(--text-primary);

}

.scope-modal-close {

  width: 28px;

  height: 28px;

  border-radius: 50%;

  background: var(--bg);

  display: flex;

  align-items: center;

  justify-content: center;

  font-size: 14px;

  color: var(--text-secondary);

  cursor: pointer;

}

.scope-modal-list {

  max-height: 60vh;

  overflow-y: auto;

  padding: 0 0 calc(20px + var(--safe-bottom));

}

.scope-modal-item {

  display: flex;

  justify-content: space-between;

  align-items: center;

  padding: 14px 20px;

  cursor: pointer;

  border-bottom: 1px solid var(--bg);

}

.scope-modal-item:active { background: var(--bg); }

#scope-modal-content .scope-modal-item {
  background: var(--bg);
  padding-left: 44px;
  transition: transform 0.15s ease, background-color 0.15s ease;
}
#scope-modal-content .scope-modal-item:hover {
  background: var(--card-bg);
}
#scope-modal-content .scope-modal-item-name {
  border-bottom: 2px solid var(--text-tertiary);
}
#scope-modal-content .scope-modal-item.active {
  background: #d6e4ff;
}
[data-theme="dark"] #scope-modal-content .scope-modal-item {
  background: var(--bg);
}
[data-theme="dark"] #scope-modal-content .scope-modal-item:hover {
  background: #2a2d35;
}
[data-theme="dark"] #scope-modal-content .scope-modal-item.active {
  background: #2a2d35;
}

.scope-modal-item.active { background: var(--primary-light); }

.scope-modal-item-name {

  font-size: 15px;

  color: var(--text-primary);

  font-weight: 400;

  flex: 1;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;

  margin-right: 12px;

}

.scope-modal-item-count {

  font-size: 13px;

  color: var(--text-tertiary);

  flex-shrink: 0;

}

.scope-modal-item-check {

  color: var(--primary);

  font-size: 16px;

  margin-right: 6px;

}

.scope-modal-chapter {

  padding: 10px 20px 6px;

  font-size: 17px;

  color: var(--text-primary);

  font-weight: 500;

  background: var(--bg);

  border-bottom: 1px solid var(--bg);

  display: flex;

  align-items: center;

  cursor: pointer;

  user-select: none;

}

#scope-modal-content .scope-modal-chapter {

  background: var(--card-bg);

  margin-top: 8px;

  color: var(--text-primary);

  font-weight: 600;

  padding-left: 20px;

  transition: transform 0.15s ease, background-color 0.15s ease;

}

#scope-modal-content .scope-modal-chapter:hover {

  background: var(--bg);

}

[data-theme="dark"] #scope-modal-content .scope-modal-chapter:hover {

  background: #2a2d35;

}

#scope-modal-content .scope-modal-all + .scope-modal-chapter {

  margin-top: 0;

}

#scope-modal-content .scope-modal-chapter.expanded {

  color: var(--text-primary);

  background: rgba(46,107,79,0.06);

}

[data-theme="dark"] #scope-modal-content .scope-modal-chapter.expanded {

  background: rgba(46,107,79,0.12);

}

.scope-modal-chapter-indicator {

  margin-left: auto;

  font-size: 16px;

  color: var(--text-secondary);

  flex-shrink: 0;

  transition: transform 0.2s;

  padding: 8px 10px;

  margin: -8px -10px 0 auto;

  cursor: pointer;

}

.scope-modal-chapter.expanded .scope-modal-chapter-indicator {

  color: var(--primary);

}

.scope-modal-item-hidden {

  display: none;

}

.scope-modal-chapter-check {

  width: 20px; height: 20px;

  border-radius: 50%;

  border: 2px solid var(--border);

  display: inline-flex; align-items: center; justify-content: center;

  font-size: 10px; color: #fff; margin-right: 10px;

  transition: all 0.2s; flex-shrink: 0; cursor: pointer;

}

.scope-modal-chapter-check.checked {

  background: var(--primary); border-color: var(--primary);

}

.scope-modal-chapter-check:hover {

  border-color: var(--primary);

  background: rgba(46,107,79,0.1);

}

.scope-modal-chapter-check.partial {

  background: var(--primary-light);

  border-color: var(--primary);

  color: var(--primary);

}

.scope-modal-chapter-status {

  font-size: 12px;

  color: var(--text-secondary);

  margin-left: 8px;

  font-weight: 400;

  flex-shrink: 0;

}

.scope-modal-item-checkbox {

  width: 18px; height: 18px;

  border-radius: 50%;

  border: 2px solid var(--border);

  display: inline-flex; align-items: center; justify-content: center;

  font-size: 10px; color: #fff; margin-right: 10px;

  transition: all 0.2s; flex-shrink: 0;

}

.scope-modal-item-checkbox.checked {

  background: var(--primary); border-color: var(--primary);

}

.scope-modal-footer {

  padding: 12px 20px;

  border-top: 1px solid var(--bg);

  display: flex; justify-content: space-between; align-items: center;

}

.scope-modal-footer-info {

  font-size: 13px; color: var(--text-secondary);

}

.scope-modal-footer-btn {

  padding: 10px 24px; border-radius: 20px;

  background: var(--primary); color: #fff;

  font-size: 15px; font-weight: 600;

  cursor: pointer; border: none;

}

.scope-modal-resume {
  margin: 10px 12px 0;
  padding: 8px 12px;
  font-size: 12px;
  color: var(--text-secondary);
  background: var(--bg);
  border-radius: 6px;
  line-height: 1.5;
}

.scope-modal-all {

  padding: 16px 20px;

  font-size: 15px;

  color: var(--text-primary);

  font-weight: 600;

  cursor: pointer;

  display: flex;

  justify-content: space-between;

  align-items: center;

  border-bottom: 1px solid var(--bg);

}

.scope-modal-all:active { background: var(--bg); }

.scope-modal-all-count {

  font-size: 13px;

  color: var(--text-tertiary);

  font-weight: 400;

}

/* Scope Modal visual polish */
#scope-modal-overlay {
  align-items: center;
  background: rgba(0,0,0,0.45);
}
#scope-modal-content {
  max-width: 880px;
  box-shadow: 0 8px 32px rgba(0,0,0,0.35);
}
.scope-modal-close {
  width: 36px;
  height: 36px;
  transition: all 0.2s;
}
.scope-modal-close:hover {
  background: var(--primary-light);
  color: var(--primary);
}
.scope-modal-item.active {
  background: #d6e4ff;
}
.scope-modal-item.active .scope-modal-item-name {
  font-weight: 500;
}
.scope-modal-list::-webkit-scrollbar { width: 6px; }
.scope-modal-list::-webkit-scrollbar-track { background: transparent; }
.scope-modal-list::-webkit-scrollbar-thumb { background: rgba(128,128,128,0.4); border-radius: 3px; }
.scope-modal-list::-webkit-scrollbar-thumb:hover { background: rgba(128,128,128,0.6); }
.scope-modal-footer {
  padding: 16px 20px;
  gap: 12px;
}
.scope-modal-footer-info {
  flex: 1;
}
[data-theme="dark"] .scope-modal-item.active { background: #2a2d35; }
[data-theme="dark"] .scope-modal-item.active .scope-modal-item-name { color: #fff; }

/* ===== 桌面优化批次1 · 通用增强 ===== */
#collect-list .list-item { border: 1px solid var(--border); box-shadow: 0 2px 10px rgba(0,0,0,0.06); }
.list-item-path { display:inline-block; min-width:0; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; vertical-align:bottom; }
.backup-btn { padding: 8px 16px; display:inline-flex; align-items:center; gap:5px; }
.wrong-filter-select { height:36px; padding:0 10px; border-radius:var(--radius-md); border:1px solid var(--border); background:var(--bg); color:var(--text-primary); font-size:13px; cursor:pointer; }
.wrong-filter-bar { flex-wrap: wrap; }
/* ===== 桌面优化批次1 · 宽屏列表双列 ===== */
@media (min-width:768px){
  #wrong-list, #collect-list, #review-list, #learned-list { display:grid; grid-template-columns:repeat(auto-fill,minmax(430px,1fr)); gap:12px 16px; align-items:start; padding:0 32px; }
  #wrong-list .list-item, #collect-list .list-item, #review-list .list-item, #learned-list .list-item { margin:0; max-width:none; min-width:0; }
  #wrong-list .empty-state, #collect-list .empty-state, #review-list .empty-state, #learned-list .empty-state { grid-column:1/-1; width:100%; margin:0; max-width:none; }
  .kd-list { display:grid; grid-template-columns:repeat(auto-fill,minmax(420px,1fr)); gap:10px 14px; align-items:start; }
  .kd-list .kd-item { margin-bottom:0; }
}

/* Wrong filter bar */

.wrong-filter-bar {

  display: flex;

  align-items: center;

  gap: 8px;

  padding: 8px 20px;

  background: var(--card-bg);

  border-bottom: 1px solid var(--border);

}

.filter-info {

  flex: 1;

  height: 36px;

  padding: 0 12px;

  border-radius: var(--radius-md);

  border: 1px solid var(--border);

  background: var(--bg);

  font-size: 14px;

  color: var(--text-primary);

  display: flex;

  align-items: center;

  cursor: pointer;

  white-space: nowrap;

  overflow: hidden;

  text-overflow: ellipsis;

  transition: background 0.2s;

}

.filter-info:active { background: var(--primary-light); }

.wrong-practice-btn {

  height: 36px;

  padding: 0 16px;

  border-radius: var(--radius-md);

  background: var(--primary);

  color: #fff;

  font-size: 14px;

  font-weight: 600;

  border: none;

  cursor: pointer;

  white-space: nowrap;

}



.mem-level-badge { display:inline-block; font-size:11px; padding:1px 6px; border-radius:3px; margin-right:6px; vertical-align:middle; }
.mem-level-badge.lv0, .mem-level-badge.lv1 { background:#f5e6e0; color:#a0522d; }
.mem-level-badge.lv2 { background:#f5ecd9; color:#b8860b; }
.mem-level-badge.lv3 { background:#e6f0e0; color:#4a7c3f; }
.mem-level-badge.lv4 { background:#dce8d4; color:#2f5d27; }
.stubborn-badge { display:inline-block; font-size:11px; padding:1px 6px; border-radius:3px; margin-right:6px; background:#f0e0e0; color:#8b3a3a; vertical-align:middle; }
.wrong-stubborn-btn { padding:6px 12px; border:1px solid var(--border-color, #ddd); border-radius:6px; background:transparent; color:var(--text-secondary, #666); font-size:13px; cursor:pointer; }
.wrong-stubborn-btn.active { background:#f0e0e0; color:#8b3a3a; border-color:#d8b8b8; }
[data-theme="dark"] .mem-level-badge.lv0, [data-theme="dark"] .mem-level-badge.lv1 { background:#3a2e2a; color:#d8a08a; }
[data-theme="dark"] .mem-level-badge.lv2 { background:#3a3426; color:#c9a94e; }
[data-theme="dark"] .mem-level-badge.lv3 { background:#2e3a2a; color:#8fbf7e; }
[data-theme="dark"] .mem-level-badge.lv4 { background:#26342a; color:#7fae6e; }
[data-theme="dark"] .stubborn-badge { background:#3a2a2a; color:#d88a8a; }
[data-theme="dark"] .wrong-stubborn-btn { border-color:#3a3d45; color:#9ca0a6; }
[data-theme="dark"] .wrong-stubborn-btn.active { background:#3a2a2a; color:#d88a8a; border-color:#5a4040; }



/* Exam result */

.exam-result {

  text-align: center;

  padding: 20px 0;

}

.exam-result-score {

  font-size: 56px;

  font-weight: 800;

  color: var(--success);

  margin: 8px 0;

}

.exam-result-score.fail { color: var(--danger); }

.exam-result-label { font-size: 16px; color: var(--text-secondary); }

.exam-result-crosstab {

  margin: 18px 0 4px;

  padding: 12px 14px;

  background: var(--bg);

  border-radius: 12px;

  border: 1px solid var(--border);

}

.exam-result-crosstab table th { color: var(--text-tertiary); font-weight: 600; }

.exam-result-crosstab table td { color: var(--text); }

.wrong-reason-badge {

  display: inline-block;

  margin-left: 6px;

  padding: 1px 8px;

  border-radius: 999px;

  background: #fff3e0;

  color: #b26a00;

  font-size: 11px;

  font-weight: 600;

}

.exam-result-detail {

  display: flex;

  justify-content: center;

  gap: 24px;

  margin: 20px 0;

}

.exam-result-item { text-align: center; }

.exam-result-item-num { font-size: 24px; font-weight: 700; }

.exam-result-item-label { font-size: 12px; color: var(--text-tertiary); }



.btn-primary {

  width: 100%;

  height: 44px;

  background: var(--primary);

  color: #fff;

  border: none;

  border-radius: 22px;

  font-size: 15px;

  font-weight: 600;

  cursor: pointer;

  margin-top: 8px;

}

.btn-secondary {

  width: 100%;

  height: 42px;

  background: var(--bg);

  color: var(--text);

  border: none;

  border-radius: 21px;

  font-size: 15px;

  font-weight: 600;

  cursor: pointer;

  margin-top: 8px;

}

button.btn-primary[style*="padding"], button.btn-secondary[style*="padding"] { height: auto; width: auto; margin-top: 0; }

.btn-nav {

  width: 100%;

  height: auto;

  min-height: 50px;

  padding: 8px 12px;

  background: var(--card-bg);

  color: var(--primary);

  border: 2px solid var(--primary);

  border-radius: 25px;

  font-size: 15px;

  font-weight: 600;

  cursor: pointer;

  margin-top: 8px;

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;

  gap: 2px;

  line-height: 1.4;

}

.btn-nav-action {

  font-size: 14px;

  font-weight: 600;

}

.btn-nav-target {

  font-size: 11px;

  font-weight: 400;

  color: var(--text-secondary);

}

.btn-nav:disabled .btn-nav-target {

  color: var(--text-tertiary);

}

.btn-nav:disabled {

  opacity: 0.35;

  cursor: not-allowed;

  border-color: var(--border);

  color: var(--text-tertiary);

}

.result-nav-row {

  display: flex;

  gap: 8px;

  margin-top: 8px;

}

.result-nav-row .btn-nav {

  flex: 1;

  margin-top: 0;

}



/* Swipe hint - hidden on all devices */

.swipe-hint {

  display: none;

}



/* Keyboard hint - hidden by default on mobile */

.keyboard-hint {

  display: none;

}



/* ===== Stats Overview (整体掌握度总览) ===== */
.stats-overview{display:flex;align-items:center;gap:16px;background:var(--card-bg);border-radius:var(--radius-lg);padding:16px;margin:0 16px 12px;box-shadow:var(--shadow);}
.overview-ring{position:relative;width:88px;height:88px;flex-shrink:0;}
.overview-ring svg{width:100%;height:100%;transform:rotate(-90deg);}
.ring-bg{fill:none;stroke:var(--bg);stroke-width:8;}
.ring-fg{fill:none;stroke:var(--primary);stroke-width:8;stroke-linecap:round;stroke-dasharray:213.6;stroke-dashoffset:213.6;transition:stroke-dashoffset .6s ease;}
.ring-center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;}
.ring-pct{font-size:19px;font-weight:700;color:var(--text);line-height:1;}
.ring-label{font-size:10px;color:var(--text-tertiary);margin-top:3px;}
.overview-info{flex:1;min-width:0;}
.overview-row{display:flex;justify-content:space-between;align-items:center;padding:5px 0;font-size:13px;color:var(--text-secondary);min-width:0;}
.overview-row + .overview-row{border-top:1px dashed var(--border);}
.overview-row b{color:var(--text);font-size:14px;}
[data-theme="dark"] .stats-overview{background:#1e2128;border-color:#2d3038;}
[data-theme="dark"] .ring-bg{stroke:#2d3038;}
[data-theme="dark"] .overview-row{color:#9ca0a6;}
[data-theme="dark"] .overview-row b{color:#d0d3d8;}
[data-theme="dark"] .overview-row + .overview-row{border-top-color:#2d3038;}

/* ===== Settings Groups (设置中心卡片化) ===== */
.settings-group-title{font-size:13px;color:var(--text-tertiary);font-weight:600;padding:18px 16px 8px;}
.settings-group-title:first-child{padding-top:14px;}
.settings-group{background:var(--card-bg);border-radius:var(--radius-lg);margin:0 16px 14px;box-shadow:var(--shadow);overflow:hidden;}
.settings-item{display:flex;align-items:center;gap:12px;padding:14px 16px;border-top:1px solid var(--border);}
.settings-item:first-child{border-top:none;}
.settings-item + .settings-item{border-top:1px solid var(--border);}
.settings-item-icon{width:38px;height:38px;border-radius:11px;background:var(--bg);display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0;}
.settings-item-icon.danger{background:var(--danger-light);}
.settings-item-text{flex:1;min-width:0;}
.settings-item-name{font-size:15px;font-weight:500;color:var(--text);}
.settings-item-name.danger{color:var(--danger);}
.settings-item-desc{font-size:12px;color:var(--text-tertiary);margin-top:2px;}
.settings-item-actions{display:flex;gap:8px;flex-shrink:0;}
.settings-item-actions .backup-btn{padding:6px 12px;font-size:12px;border-radius:14px;}
.settings-item .settings-value{color:var(--text-tertiary);font-size:18px;flex-shrink:0;}
[data-theme="dark"] .settings-group{background:#1e2128;border-color:#2d3038;}
[data-theme="dark"] .settings-item{border-top-color:#2d3038;}
[data-theme="dark"] .settings-item-icon{background:#2a2d35;}
[data-theme="dark"] .settings-item-name{color:#d0d3d8;}
[data-theme="dark"] .settings-item-desc{color:#9ca0a6;}

/* ===== Stat Card 图标 ===== */
.stat-icon{width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:17px;margin:0 auto 8px;}

/* Settings panel */

.settings-row {

  display: flex;

  align-items: center;

  justify-content: space-between;

  padding: 16px 0;

  border-bottom: 1px solid var(--border);

}

.settings-row:last-child { border-bottom: none; }

.settings-label { font-size: 15px; }

.settings-value { font-size: 14px; color: var(--text-tertiary); }



/* Data backup */
.backup-actions { display: flex; gap: 8px; align-items: center; }
.backup-btn {
  padding: 6px 14px;
  font-size: 13px;
  border-radius: 15px;
  border: 1px solid var(--border);
  background: var(--card-bg);
  color: var(--text-primary);
  cursor: pointer;
  transition: border-color 0.15s ease, color 0.15s ease;
}
.backup-btn:hover { border-color: var(--primary); color: var(--primary); }

/* Selectable mode indicator */

.mode-indicator {

  display: inline-flex;

  align-items: center;

  gap: 4px;

  font-size: 12px;

  color: var(--primary);

  background: var(--primary-light);

  padding: 3px 10px;

  border-radius: 10px;

  font-weight: 600;

}



/* ===== Desktop Sidebar ===== */

.desktop-sidebar {

  display: none;

  width: 220px;

  background: linear-gradient(180deg, var(--primary-dark) 0%, var(--primary) 40%, #4f8f6a 100%);

  color: #fff;

  position: fixed;

  left: 0; top: 0; bottom: 0;

  z-index: 300;

  flex-direction: column;

  overflow-y: auto;

}

.sidebar-header {

  padding: 36px 20px 24px;

  border-bottom: 1px solid rgba(255,255,255,0.15);

}

.sidebar-logo {

  font-size: 24px;

  font-weight: 800;

  margin-bottom: 4px;

}

.sidebar-sub {

  font-size: 12px;

  opacity: 0.7;

}

.sidebar-nav {

  flex: 1;

  padding: 16px 0;

}

.sidebar-item {

  display: flex;

  align-items: center;

  gap: 12px;

  padding: 14px 20px;

  cursor: pointer;

  transition: all 0.2s;

  font-size: 15px;

  font-weight: 500;

  opacity: 0.75;

  border-left: 3px solid transparent;

}

.sidebar-item:hover {

  opacity: 1;

  background: rgba(255,255,255,0.1);

}

.sidebar-item.active {

  opacity: 1;

  background: rgba(255,255,255,0.15);

  border-left-color: #fff;

  font-weight: 700;

}

.sidebar-item-icon {

  font-size: 20px;

  width: 28px;

  text-align: center;

}

.sidebar-stats {

  padding: 20px 20px 30px;

  border-top: 1px solid rgba(255,255,255,0.15);

  display: flex;

  gap: 8px;

}

.sidebar-stat-box {

  flex: 1;

  background: rgba(255,255,255,0.1);

  border-radius: var(--radius-sm);

  padding: 6px 4px;

  text-align: center;

}

.sidebar-stat-num {

  font-size: 18px;

  font-weight: 700;

}

.sidebar-stat-label {

  font-size: 10px;

  opacity: 0.7;

  white-space: normal;

}




/* ===== Guide Page ===== */
.guide-tabs {
  display: flex;
  gap: 0;
  padding: 0 16px;
  margin: 16px 0 0;
  flex-wrap: wrap;
  position: sticky;
  top: 0;
  z-index: 10;
  background: var(--bg);
  border-bottom: 1px solid rgba(255,255,255,0.06);
  padding-bottom: 12px;
}
.guide-tab {
  flex: 1;
  min-width: 100px;
  padding: 12px 18px;
  border: 1px solid rgba(0,0,0,0.12);
  background: rgba(0,0,0,0.03);
  color: #666;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
  text-align: center;
  white-space: nowrap;
}
.guide-tab:first-child { border-radius: var(--radius-sm) 0 0 var(--radius-sm); }
.guide-tab:last-child { border-radius: 0 var(--radius-sm) var(--radius-sm) 0; }
.guide-tab.active {
  background: var(--primary);
  color: #fff;
  border-color: var(--primary);
}
.guide-search-wrap {
  padding: 12px 16px 0;
}
.guide-search {
  width: 100%;
  padding: 10px 14px;
  border: 1px solid rgba(0,0,0,0.15);
  border-radius: var(--radius-sm);
  background: #f1f5f9;
  color: #333;
  font-size: 15px;
  outline: none;
  transition: border-color 0.2s;
}
.guide-search:focus { border-color: var(--primary); }
.guide-search::placeholder { color: #666; }
.guide-content {
  padding: 16px 16px 24px;
}
.guide-count {
  font-size: 14px;
  color: #888;
  margin-bottom: 12px;
}
.guide-section-label {
  font-size: 14px;
  font-weight: 700;
  color: #555;
  margin: 16px 0 10px;
  padding-left: 4px;
}
.guide-section-label:first-child { margin-top: 0; }
/* Table cards */
.guide-table-card {
  background: #fff;
  border: 1px solid rgba(0,0,0,0.08);
  border-left: 3px solid var(--primary);
  border-radius: 12px;
  margin-bottom: 20px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}
.guide-table-card .card-title {
  padding: 14px 16px;
  font-size: 16px;
  font-weight: 700;
  color: #fff;
  background: linear-gradient(135deg, #2e6b4f, #22513a);
  border-bottom: 1px solid rgba(255,255,255,0.1);
}
.guide-table-card table {
  width: 100%;
  border-collapse: collapse;
}
.guide-table-card th {
  background: #edf3ee;
  padding: 10px 12px;
  font-size: 14px;
  font-weight: 700;
  color: #2c4238;
  text-align: left;
  white-space: nowrap;
}
.guide-table-card td {
  padding: 10px 12px;
  font-size: 15px;
  color: #2c4238;
  border-bottom: 1px solid #eef2ee;
  vertical-align: top;
}
.guide-table-card td b {
  color: var(--primary);
}
.guide-table-card tbody tr { transition: all 0.2s; }
@media (hover: hover) {
  .guide-table-card tbody tr:hover {
    background: #e6efe9;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    position: relative;
    z-index: 1;
    font-weight: 600;
  }
}
.guide-content > .guide-table-card:nth-child(even) { background: #fafbff; }
.guide-content > .guide-table-card:nth-child(odd)  { background: #fffbfa; }

/* Tip cards */
.guide-tip-card {
  display: flex;
  gap: 14px;
  background: #fff;
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 12px;
  padding: 14px;
  margin-bottom: 12px;
  transition: all 0.2s;
  box-shadow: 0 1px 4px rgba(0,0,0,0.04);
}
.guide-tip-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(0,0,0,0.1);
  background: #f0f4ff;
}
.guide-tip-koujue {
  flex-shrink: 0;
  min-width: 80px;
  min-height: 60px;
  border-radius: 10px;
  background: linear-gradient(135deg, var(--primary), var(--primary-dark, #1a6fd4));
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  font-weight: 700;
  color: #fff;
  padding: 8px 10px;
  white-space: nowrap;
}
.guide-tip-body { flex: 1; min-width: 0; }
.guide-tip-title {
  font-size: 16px;
  font-weight: 700;
  color: #1a1a2e;
  margin-bottom: 6px;
  line-height: 1.4;
}
.guide-tip-desc {
  font-size: 15px;
  color: #475569;
  line-height: 1.6;
}
@media (hover: hover) {
  .guide-tip-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0,0,0,0.3);
    border-color: rgba(255,255,255,0.15);
  }
  .guide-tip-card:hover .guide-tip-koujue { filter: saturate(1.3); }
}
/* Mind chapter cards */
.guide-chapter {
  background: #fff;
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 12px;
  margin-bottom: 12px;
  overflow: hidden;
  box-shadow: 0 1px 4px rgba(0,0,0,0.06);
}
.guide-chapter-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 16px;
  cursor: pointer;
  user-select: none;
  transition: background 0.2s;
  color: #1a1a2e;
  background: #f8f9fa;
  border-bottom: 1px solid rgba(0,0,0,0.06);
}
.guide-chapter-header:hover { background: #e9ecef; }
.guide-chapter-title {
  font-size: 16px;
  font-weight: 700;
  color: #1a1a2e;
  display: flex;
  align-items: center;
  gap: 8px;
}
.guide-chapter-badge {
  font-size: 13px;
  padding: 2px 8px;
  border-radius: 10px;
  background: var(--primary);
  color: #fff;
  font-weight: 600;
}
.guide-chapter-arrow {
  font-size: 14px;
  color: #888;
  transition: transform 0.25s;
}
.guide-chapter.open .guide-chapter-arrow { transform: rotate(180deg); }
.guide-chapter-body {
  display: none;
  padding: 0 16px 16px;
  border-top: 1px solid rgba(255,255,255,0.06);
}
.guide-chapter.open .guide-chapter-body { display: block; }
.guide-node { margin-top: 14px; }
.guide-node-title {
  font-size: 15px;
  font-weight: 700;
  color: #1a1a2e;
  padding-left: 12px;
  border-left: 3px solid var(--primary);
  margin-bottom: 8px;
}
.guide-leaf {
  font-size: 14px;
  color: #555;
  line-height: 1.7;
  padding: 2px 0 2px 16px;
  position: relative;
}
.guide-leaf::before {
  content: '';
  position: absolute;
  left: 4px;
  top: 10px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: rgba(255,255,255,0.2);
}
.guide-leaf b { color: var(--primary); }
.guide-leaf:hover { background: #f0f4ff; font-weight: 600; }
.guide-no-result {
  text-align: center;
  color: #666;
  padding: 40px 0;
  font-size: 15px;
}
/* Back to top */
#guide-back-top {
  position: fixed;
  bottom: 80px;
  right: 20px;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: rgba(0,0,0,0.06);
  border: 1px solid rgba(0,0,0,0.12);
  color: #666;
  font-size: 18px;
  cursor: pointer;
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 100;
  transition: all 0.2s;
  backdrop-filter: blur(10px);
}
#guide-back-top:hover { background: var(--primary); color: #fff; border-color: var(--primary); }
/* Mobile */
@media (max-width: 767px) {
  .guide-tabs { gap: 4px; padding: 0 10px 10px; }
  .guide-tab { font-size: 13px; padding: 8px 10px; min-width: auto; }
  .guide-tip-koujue { width: 48px; height: 48px; font-size: 20px; }
  .guide-table-card th, .guide-table-card td { padding: 8px; font-size: 12px; }
  #guide-back-top { bottom: 100px; right: 12px; }
}

@media (max-width: 767px) {

  .feature-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; padding: 0 14px; }

  .group-title { padding: 16px 16px 8px; font-size: 13px; }

}

/* 首页「我的题库」3 入口：桌面 3 列一行，窄屏 2+1 且末项居中 */
.feature-grid-3 { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 767px) {
  .feature-grid-3 { grid-template-columns: repeat(2, 1fr); }
  .feature-grid-3 .feature-item:nth-child(3) { grid-column: 1 / -1; width: 150px; justify-self: center; margin: 0; }
}

/* ===== Mobile Zero-Scroll Practice Layout (max 767px) ===== */

@media (max-width: 767px) {

  /* Ensure non-practice pages scroll normally */

  #app {

    overflow-y: auto;

    -webkit-overflow-scrolling: touch;

  }



  /* Fix 1: Force hide desktop sidebar on mobile */

  .desktop-sidebar {

    display: none !important;

  }



  /* Fix 2: Ensure bottom-nav stays visible */

  .bottom-nav {

    display: flex !important;

  }



  /* Prevent background scrolling when practice page is active */

  body:has(#page-practice.active) {

    overflow: hidden;

  }



  #page-practice.active {

    position: fixed;

    top: 0;

    left: 0;

    width: 100%;

    max-width: 100%;

    height: 100vh;

    height: 100dvh;

    box-sizing: border-box;

    z-index: 50;

    display: flex !important;

    flex-direction: column;

    overflow-y: auto;

    overflow-x: hidden;

    background: #f5f5f5;

  }



  #page-practice .practice-header {

    padding: calc(env(safe-area-inset-top, 20px) + 6px) 16px 4px;

    flex-shrink: 0;

    border-bottom: 1px solid #E9E9E9;

    background: #fff;

  }



  #page-practice .practice-top {

    display: flex;

    align-items: center;

    gap: 8px;

  }



  #page-practice .practice-title {

    font-size: 15px;

    flex: 1;

    text-align: center;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

  }



  #page-practice .progress-bar {

    height: 4px;

    margin: 6px 0 2px;

  }



  #page-practice .progress-text {

    font-size: 11px;

    color: #999;

    text-align: right;

  }



  #page-practice .question-card {

    margin: 12px 0;

    padding: 16px 14px;

  }



  #page-practice .q-content {

    font-size: 20px;

    margin-bottom: 12px;

  }



  #page-practice #q-options {

    width: 100%;

  }



  #page-practice .q-option {

    font-size: 19px;

    padding: 0 0 0 28px;

    margin: 8px 0;

  }



  /* Mobile: controls at bottom */

  #page-practice .practice-controls {

    position: fixed;

    bottom: 0;

    left: 0;

    right: 0;

    padding: 8px 10px calc(6px + env(safe-area-inset-bottom, 20px));

    background: #fff;

    border-top: 1px solid #E9E9E9;

    z-index: 100;

    gap: 8px;

    justify-content: space-evenly;

  }



  #page-practice .ctrl-btn {

    flex: 1;

    max-width: 160px;

    height: 38px;

    font-size: 14px;

    padding: 0 10px;

  }



  #page-practice .keyboard-hint {

    display: none;

  }



  #page-practice .practice-stats {

    font-size: 12px;

    gap: 12px;

    flex-wrap: wrap;

    padding: 8px 16px;

  }



  #page-practice .analysis-card {

    margin: 0 0 0;

    padding: 14px;

  }

  #page-practice .analysis-card.show {

    margin: 0 0 16px;

    padding: 16px 20px;

  }



  #page-practice .analysis-title {

    font-size: 17px;

  }



  #page-practice .analysis-text {

    font-size: 13px;

  }



  #page-practice .breadcrumb-nav {

    font-size: 11px;

    padding: 4px 0;

  }



  #page-practice .btn-collect {

    font-size: 13px;

    height: 28px;

    padding: 0 10px 0 26px;

    color: #666;

  }



  /* Hide keyboard and swipe hints on mobile */

  #page-practice .keyboard-hint,

  #page-practice .swipe-hint {

    display: none !important;

  }



  /* Memorize mode: larger font */

  #page-practice.memorize-mode .q-content {

    font-size: 1.25em;

    line-height: 1.8;

  }

  #page-practice.memorize-mode .q-option {

    font-size: 1.15em;

    padding: 14px 16px;

  }

  #page-practice.memorize-mode .q-option-label {

    font-size: 1.1em;

  }

  #page-practice.memorize-mode .analysis-card .analysis-text {

    font-size: 1.05em;

  }

  #page-practice.memorize-mode .practice-stats,

  #page-practice.memorize-mode .btn-collect,

  #page-practice.memorize-mode .scope-switcher,

  #page-practice.memorize-mode .q-type-hint {

    display: none !important;

  }



  /* Fix 1: Ensure #app doesn't overflow horizontally */

  #app {

    overflow-x: hidden;

  }



  /* Fix 2: Remove sticky from sheet-panel-card inside modal on mobile */

  .modal-content .sheet-panel-card {

    position: relative;

    top: auto;

    max-height: none;

    overflow-y: visible;

  }



  /* Fix 6: Touch-friendly answer sheet grid in mobile modal */

  #modal-overlay .exam-sheet-grid {

    grid-template-columns: repeat(4, 1fr);

    gap: 10px;

  }

  #modal-overlay .exam-sheet-num {

    font-size: 15px;

    min-height: 44px;

    min-width: 44px;

  }



  /* ===== Homepage mobile fix: hero & header no longer squeezed ===== */

  .header { flex-wrap: wrap; }

  .header-text { flex: 1 1 auto; min-width: 0; }

  .header-stats { width: 100%; justify-content: space-between; gap: 8px; margin-top: 4px; }

  .header-stat { flex: 1; text-align: center; padding: 6px 8px; }

  .hero-banner { flex-wrap: wrap; gap: 12px; }

  .hero-text { order: 1; flex: 1 1 0; min-width: 0; }

  .hero-text h3 { white-space: nowrap; }

  .hero-actions { width: 100%; margin-left: 0; flex-wrap: wrap; gap: 8px; }

  .hero-actions .hero-due-btn,

  .hero-actions .hero-history-btn { flex: 1 1 auto; justify-content: center; }

}@media (min-width: 768px) {

  html, body {

    background: #f0f0f0;

  }

  .desktop-sidebar {

    display: flex;

  }

  #app {

    max-width: none;

    margin-left: 220px;

    padding-bottom: 0;

    background: #f5f5f5;

    min-height: 100vh;
  min-height: 100dvh; /* 动态视口：手机浏览器工具栏压缩可视高度时正确贴合 */

  }

  .bottom-nav {

    display: none !important;

  }

  .page {

    min-height: auto;

    padding-bottom: 24px;

  }

  .header {

    padding: 24px 32px 22px;

    max-width: 1000px;

    margin: 0 auto;

  }

  .section-title {

    max-width: 1000px;

    margin: 0 auto;

    padding-left: 32px;

    padding-right: 32px;

  }

  .home-search {

    max-width: 1000px;

    padding-left: 32px;

    padding-right: 32px;

  }

  .home-search .search-icon { left: 44px; }

  .hero-banner {

    margin: -8px 32px 0;

    max-width: 1000px;

  }

  .feature-grid {

    max-width: 1000px;

    margin: 0 auto;

    grid-template-columns: repeat(4, 1fr);

    gap: 16px;

    padding: 0 32px;

  }

  .feature-item:hover {

    transform: translateY(-2px);

    box-shadow: var(--shadow-lg);

  }

  .chapter-list {

    max-width: 1000px;

    margin: 0 auto;

    padding: 0 32px;

    display: grid;

    grid-template-columns: 1fr 1fr;

    grid-template-rows: repeat(6, auto);

    gap: 12px;

    grid-auto-flow: column;

  }

  .chapter-card:hover { box-shadow: var(--shadow-lg); }

  .chapter-card:active { transform: scale(1); }

  .section-item:hover { background: var(--primary-light); }



  /* Practice page - desktop: two-column flex layout */

  #page-practice {

    max-width: 1400px;

    margin: 0 auto;

    padding: 0 20px;

  }

  #page-practice .practice-header {

    padding: 12px 0;

    border-bottom: none;

  }

  #page-practice .practice-title {

    font-size: 18px;

  }

  #page-practice .progress-bar {

    width: 100%;

    max-width: none;

    height: 6px;

  }

  #page-practice .practice-body {

    display: flex;

    flex-direction: row;

    gap: 20px;

    align-items: flex-start;

  }

  #page-practice .practice-left {

    flex: 1;

    min-width: 0;

  }

  #page-practice .practice-right {

    width: 320px;

    flex-shrink: 0;

    display: block;

  }

  #page-practice .practice-sheet-panel {

    position: sticky;

    top: 104px;

    max-height: calc(100vh - 130px);

  }

  #page-practice .question-card {

    width: 100%;

    margin: 0 0 16px;

    box-sizing: border-box;

  }

  #page-practice .q-content {

    font-size: 20px;

  }

  #page-practice .q-option {

    width: 100%;

    max-width: none;

  }

  #page-practice .q-option:hover:not(.disabled):not(.correct):not(.wrong) {

    background-color: #F1F1F1;

  }

  #page-practice .practice-controls {

    width: 100%;

    max-width: 640px;

    margin: 16px 0 0;

    position: fixed;

    bottom: 12px;

    left: 50%;

    transform: translateX(-50%);

    z-index: 100;

    padding: 10px 20px;

    background: #fff;

    border: 1px solid #E9E9E9;

    border-radius: 12px;

    box-shadow: 0 4px 18px rgba(0,0,0,0.08);

    box-sizing: border-box;

  }

  #page-exam .practice-controls {

    width: 100%;

    max-width: 640px;

    margin: 16px 0 0;

    position: fixed;

    bottom: 12px;

    left: 50%;

    transform: translateX(-50%);

    z-index: 100;

    padding: 10px 20px;

    background: #fff;

    border: 1px solid #E9E9E9;

    border-radius: 12px;

    box-shadow: 0 4px 18px rgba(0,0,0,0.08);

    box-sizing: border-box;

  }

  #page-practice .practice-stats {

    width: 100%;

    margin: 0;

    box-sizing: border-box;

    border-radius: 8px;

  }

  #page-practice .analysis-card {

    width: 100%;

    margin: 0 0 16px;

    box-sizing: border-box;

  }

  #page-practice .practice-sheet-inline {

    display: none;

  }



  /* Keyboard hint visible on desktop */

  .keyboard-hint {

    display: block;

    text-align: center;

    font-size: 12px;

    color: #999;

    padding: 8px 0;

    margin-top: 12px;

  }

  .swipe-hint {

    display: none;

  }



  /* Answer sheet grid */

  .exam-sheet-grid {

    display: grid;

    grid-template-columns: repeat(auto-fill, minmax(38px, 1fr));

    gap: 6px;

    padding: 12px 0;

  }

  .exam-sheet-num {

    display: flex;

    align-items: center;

    justify-content: center;

    height: 38px;

    font-size: 13px;

    color: #333;

    border: 1px solid #E9E9E9;

    border-radius: 3px;

    cursor: pointer;

    transition: all 0.15s;

    font-weight: 500;

  }

  .exam-sheet-num:hover {

    background: #f5f5f5;

  }

  .exam-sheet-num.sheet-correct {

    background: #3DA600;

    color: #fff;

    border-color: #3DA600;

  }

  .exam-sheet-num.sheet-wrong {

    background: #EE4653;

    color: #fff;

    border-color: #EE4653;

  }

  .exam-sheet-num.sheet-current {

    border-color: #4e9b73;

    border-width: 2px;

  }

  /* Exam page */

  .exam-sheet {

    max-width: 800px;

    margin: 16px 32px;

  }

  .exam-sheet-grid {

    grid-template-columns: repeat(auto-fill, minmax(38px, 1fr));

  }

  /* Wrong/Collect pages */

  .list-item {

    max-width: 800px;

    margin: 0 32px 12px;

  }

  .list-item:hover { transform: scale(1); box-shadow: var(--shadow-lg); }

  /* Stats */

  .stats-grid {

    max-width: 800px;

    margin: 0 auto;

    grid-template-columns: repeat(3, 1fr);

    padding: 0 32px;

  }

  .accuracy-bar-wrap {

    max-width: 800px;

    margin: 0 32px 12px;

  }

  /* Modal centered on desktop */

  .modal-overlay {

    align-items: center;

  }

  .modal-content {

    max-width: 760px;

    border-radius: var(--radius-lg);

    padding: 32px;

    animation: fadeInDesktop 0.3s ease;

    max-height: 88vh;

  }

  @keyframes fadeInDesktop {

    from { opacity: 0; transform: scale(0.95); }

    to { opacity: 1; transform: scale(1); }

  }

  /* Section grid wider */

  .section-grid {

    grid-template-columns: repeat(2, 1fr);

  }

  /* 改口诀弹窗桌面适配：内容限宽居中，按钮横排 */

  .mnem-editor { max-width: 640px; margin: 0 auto; }

  .mnem-editor .mnem-actions { position: static; margin: 16px 0 0; padding: 0; background: transparent; border-top: none; }

  .mnem-editor .mnem-actions .btn-primary,

  .mnem-editor .mnem-actions .btn-secondary { width: auto; flex: 1 1 0; min-width: 110px; margin-top: 0; height: 44px; }

}@media (min-width: 1024px) {

  .feature-grid {

    max-width: 1100px;

  }

  .stats-grid {

    grid-template-columns: repeat(4, 1fr);

    max-width: 1100px;

  }

  #page-practice .practice-body {

    max-width: 1360px;

  }

  #page-practice .practice-right {

    width: 340px;

  }

  .exam-sheet-grid {

    grid-template-columns: repeat(10, 1fr);

  }

}

@media (min-width: 1440px) {

  #page-practice .practice-body {

    max-width: 1600px;

  }

  #page-practice .practice-right {

    width: 380px;

  }

  .exam-sheet-grid {

    grid-template-columns: repeat(12, 1fr);

  }

}



/* Practice mobile layout */

@media (max-width: 768px) {

  #page-practice .practice-body {

    flex-direction: column;

    gap: 12px;

  }

  #page-practice .practice-left {

    width: 100%;

  }

  #page-practice .practice-right {

    width: 100%;

    display: block;

  }

  #page-practice .practice-sheet-panel {

    position: static;

    top: auto;

  }

  #practice-sheet-grid {

    grid-template-columns: repeat(6, 1fr);

    gap: 4px;

  }

  #practice-sheet-grid .exam-sheet-num {

    height: 32px;

    font-size: 11px;

  }

  #page-practice .q-option {

    font-size: 16px;

    padding: 10px 12px 10px 36px;

  }



  /* Memorize mode: larger font (desktop) */

  #page-practice.memorize-mode .q-content {

    font-size: 26px;

    line-height: 1.8;

  }

  #page-practice.memorize-mode .q-option {

    font-size: 20px;

    padding: 16px 20px 16px 48px;

  }

  #page-practice.memorize-mode .analysis-card .analysis-text {

    font-size: 1.1em;

  }

  #page-practice.memorize-mode .practice-stats,

  #page-practice.memorize-mode .btn-collect,

  #page-practice.memorize-mode .scope-switcher,

  #page-practice.memorize-mode .q-type-hint {

    display: none !important;

  }

}

/* ===== Exam page two-column layout (mirrors practice) ===== */
#page-exam .practice-body {
  display: flex;
  gap: 20px;
  align-items: flex-start;
}
#page-exam .practice-left {
  flex: 1;
  min-width: 0;
}
#page-exam .practice-right {
  width: 320px;
  flex-shrink: 0;
}
#page-exam .practice-sheet-panel {
  position: sticky;
  top: 104px;
  max-height: calc(100vh - 130px);
  overflow-x: hidden;
}
#page-exam #exam-sheet-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(36px, 1fr));
  gap: 6px;
  max-width: 100%;
}
#page-exam #exam-sheet-grid .exam-sheet-num {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 36px;
  font-size: 12px;
  color: #333;
  border: 1px solid #E9E9E9;
  border-radius: 4px;
  cursor: pointer;
  transition: all 0.15s;
  font-weight: 500;
}
#page-exam #exam-sheet-grid .exam-sheet-seg-title {
  grid-column: 1 / -1;
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-top: 14px;
  padding-top: 8px;
  font-size: 13px;
  font-weight: 700;
  color: var(--text);
  border-top: 1px solid var(--border);
}
#page-exam #exam-sheet-grid .exam-sheet-seg-title:first-child {
  margin-top: 0;
  padding-top: 0;
  border-top: none;
}
#page-exam #exam-sheet-grid .exam-sheet-seg-count {
  font-size: 11px;
  font-weight: 400;
  color: #999;
}
#page-exam #exam-sheet-grid .exam-sheet-num:hover {
  background: #f5f5f5;
}
#page-exam #exam-sheet-grid .exam-sheet-num.answered {
  background: #4e9b73;
  color: #fff;
  border-color: #4e9b73;
}
#page-exam #exam-sheet-grid .exam-sheet-num.sheet-current {
  border-color: #EE4653;
  border-width: 2px;
  box-shadow: 0 0 0 1px #EE4653;
}
/* 不确定标记：琥珀/橙色，区别于已答绿、当前题红；置于 sheet-current 之后，与 .answered 同特异性后定义优先 */
#page-exam #exam-sheet-grid .exam-sheet-num.marked {
  background: #fff1c6;
  color: #9a6b00;
  border-color: #f0a500;
  font-weight: 700;
}
#page-exam #exam-sheet-grid .exam-sheet-num.marked.sheet-current,
#page-exam #exam-sheet-grid .exam-sheet-num.marked.answered {
  background: #fff1c6;
  color: #9a6b00;
  border-color: #f0a500;
  font-weight: 700;
}
#page-exam #exam-sheet-grid .exam-sheet-num.marked.sheet-current {
  border-color: #EE4653;
  border-width: 2px;
  box-shadow: 0 0 0 1px #EE4653;
}
[data-theme="dark"] #page-exam #exam-sheet-grid .exam-sheet-num.marked {
  background: #4a3a12;
  color: #ffd666;
  border-color: #f5b942;
  font-weight: 700;
}
[data-theme="dark"] #page-exam #exam-sheet-grid .exam-sheet-num.marked.sheet-current {
  background: #4a3a12;
  color: #ffd666;
  border-color: #EE4653;
  border-width: 2px;
  box-shadow: 0 0 0 1px #EE4653;
  font-weight: 700;
}
/* 考试页右侧答题卡面板的交卷按钮与底栏重复，统一隐藏（仅保留底栏交卷） */
#page-exam .btn-exam-submit {
  display: none !important;
  width: 100%;
  margin-top: 16px;
}
[data-theme="dark"] #page-exam .exam-sheet-num {
  color: #d0d3d8;
  border-color: #2d3038;
}
[data-theme="dark"] #page-exam .exam-sheet-num:hover {
  background: #2a2d35;
}
@media (min-width: 1280px) {
  #page-exam .practice-body {
    max-width: 1360px;
  }
  #page-exam .practice-right {
    width: 340px;
  }
}
@media (min-width: 1440px) {
  #page-exam .practice-body {
    max-width: 1600px;
  }
  #page-exam .practice-right {
    width: 380px;
  }
}
@media (max-width: 768px) {
  #page-exam .practice-body {
    flex-direction: column;
    gap: 12px;
  }
  #page-exam .practice-left {
    width: 100%;
  }
  #page-exam .practice-right {
    width: 100%;
    display: block;
  }
  #page-exam .practice-sheet-panel {
    position: static;
    top: auto;
  }
  #page-exam #exam-sheet-grid {
    grid-template-columns: repeat(6, 1fr);
    gap: 4px;
  }
  #page-exam #exam-sheet-grid .exam-sheet-num {
    height: 32px;
    font-size: 11px;
  }
}

/* ===== 顶部统计行（答题页 答题进度 与作答统计 并排） ===== */
.practice-topline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 20px 6px;
  font-size: 13px;
  color: #999;
}
.practice-topline-stats {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  min-width: 0;
}
.practice-topline-stats span {
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
}
.practice-topline-stats b {
  color: var(--text-primary);
  font-weight: 600;
  margin: 0 2px;
}
.practice-topline .progress-text {
  padding: 0;
  margin: 0;
  color: var(--text-secondary);
  font-size: 13px;
}
.practice-topline .practice-remain {
  margin-left: 8px;
  font-size: 11px;
  color: var(--primary);
  background: var(--primary-light);
  padding: 1px 8px;
  border-radius: 10px;
  font-weight: 600;
  white-space: nowrap;
}

/* ===== 移动端做题页：头部固定 + 内容独立滚动 + 控制栏贴底不悬浮 (2026-08-22) ===== */
@media (max-width: 768px) {
  #page-exam.active {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    max-width: 100%;
    height: 100vh;
    height: 100dvh;
    box-sizing: border-box;
    z-index: 50;
    display: flex !important;
    flex-direction: column;
    overflow: hidden;
    background: var(--bg);
  }
  body:has(#page-exam.active) {
    overflow: hidden;
  }
  /* 练习页同样改为三段式：整页不滚，滚动交给 body；底部仅给底栏让位 */
  #page-practice.active,
  #page-exam.active {
    overflow: hidden;
    background: var(--bg);
    padding-bottom: calc(76px + var(--safe-bottom));
  }
  /* 头部固定不滚 */
  #page-practice.active .practice-header,
  #page-exam.active .practice-header {
    flex-shrink: 0;
    position: relative;
    z-index: 60;
  }
  /* 内容区成为唯一滚动容器（控件已改悬浮，底部留出让位防止被遮） */
  #page-practice.active .practice-body,
  #page-exam.active .practice-body {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 120px;
  }
  /* 控制栏固定悬浮在底部导航上方：不依赖视口高度，任何屏幕大小都可见 */
  #page-practice.active .practice-controls,
  #page-exam.active .practice-controls {
    position: fixed;
    left: 50%;
    transform: translateX(-50%);
    width: calc(100% - 24px);
    max-width: 500px;
    bottom: calc(84px + var(--safe-bottom));
    z-index: 150;
    margin: 0;
    padding: 10px 12px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: var(--card-bg);
    box-shadow: 0 6px 20px rgba(0,0,0,0.18);
    box-sizing: border-box;
  }
  #page-practice.active .ctrl-btn,
  #page-exam.active .ctrl-btn {
    height: 46px;
    max-width: none;
    font-size: 16px;
    border-radius: 10px;
  }
  /* 手机端按钮栏：flex 等分，按钮无论几个都单行铺满（练习3个/考试4个自适应）(2026-09-09) */
  #page-practice.active .practice-controls,
  #page-exam.active .practice-controls {
    display: flex;
    gap: 6px;
    padding: 10px 8px;
  }
  #page-practice.active .ctrl-btn,
  #page-exam.active .ctrl-btn {
    flex: 1 1 0;
    height: 46px;
    min-width: 0;
    padding: 0 4px;
    font-size: 14px;
    white-space: nowrap;
  }
  /* 精简：手机端隐藏答题统计行（保留 进度/剩余/连击） */
  #page-practice .practice-topline-stats {
    display: none !important;
  }
  /* 底部导航：下滚隐藏、上滚显示（仅做题页内，由 JS 添加 nav-hidden） */
  .bottom-nav {
    transition: transform .28s ease;
  }
  body.nav-hidden .bottom-nav {
    transform: translateY(100%);
  }
  body.nav-hidden #page-practice.active .practice-controls,
  body.nav-hidden #page-exam.active .practice-controls {
    bottom: calc(12px + var(--safe-bottom));
  }
  /* 练习页做题时默认隐藏底部导航，模拟考试同样默认隐藏 (2026-09-09) */
  body:has(#page-practice.active) .bottom-nav,
  body:has(#page-exam.active) .bottom-nav {
    transform: translateY(100%);
  }
  body:has(#page-practice.active) #page-practice.active,
  body:has(#page-exam.active) #page-exam.active {
    padding-bottom: 0;
  }
  body:has(#page-practice.active) #page-practice.active .practice-controls,
  body:has(#page-exam.active) #page-exam.active .practice-controls {
    bottom: calc(12px + var(--safe-bottom));
  }
  /* 手机端精简：练习页顶部只留 进度X/Y，隐藏“剩 N 题”，剩余可由答题卡“未答K”得出 (2026-09-07) */
  #page-practice .practice-remain {
    display: none !important;
  }
  /* 手机端精简：隐藏顶部进度条与 X/Y 文本，进度信息已由答题卡“已答X/Y”呈现 (2026-09-07) */
  #page-practice .progress-bar,
  #page-practice #practice-progress-text {
    display: none !important;
  }
}

/* ===== 数字题记忆强化 ===== */
.hl-num { font-weight: 700; text-decoration: underline; text-underline-offset: 2px; text-decoration-color: var(--text-tertiary); text-decoration-thickness: 1.5px; }
.num-badge { display:inline-block; font-size:11px; padding:1px 6px; border-radius:8px; background:var(--bg); color:var(--text-secondary); margin-right:6px; border:1px solid var(--border); }
.num-tip { margin-top:10px; padding:8px 12px; background:var(--bg); border-radius:8px; font-size:13px; line-height:1.6; color:var(--text-secondary); border-left:3px solid var(--text-tertiary); }
.num-tip-label { font-weight:700; color:var(--text-primary); margin-right:6px; }
.num-tip-src { display:inline-block; font-size:11px; padding:1px 6px; border-radius:8px; background:var(--accent-light,#e8f5ee); color:var(--accent,#2d6a4f); margin-right:6px; }
.num-tip-edit { margin-left:8px; font-size:12px; padding:2px 10px; border:1px solid var(--border); border-radius:8px; background:var(--card-bg,#fff); color:var(--text-secondary); cursor:pointer; vertical-align:middle; }
.num-tip-edit:hover { border-color:var(--accent,#2d6a4f); color:var(--accent,#2d6a4f); background:var(--accent-light,#e8f5ee); }

/* ===== 陷阱判断题专练 ===== */
.trap-word { color: #e53935; font-weight: 700; background: rgba(229,57,53,0.12); border-radius: 3px; padding: 0 2px; }
[data-theme="dark"] .trap-word { color: #ff7875; background: rgba(255,77,79,0.16); }
.trap-tags { padding: 10px 20px 4px; display: flex; flex-wrap: wrap; gap: 6px; }
.trap-tag { font-size: 12px; color: var(--text-secondary); background: var(--bg); border: 1px solid var(--border); border-radius: 10px; padding: 2px 8px; }

/* ===== 易混概念对比 ===== */
.mix-list { max-height: 60vh; overflow-y: auto; padding: 4px 0 calc(20px + var(--safe-bottom)); }
.mix-group { margin: 10px 12px 0; border: 1px solid var(--border); border-radius: 12px; overflow: hidden; background: var(--card-bg); }
.mix-group-header { padding: 12px 14px; background: var(--bg); border-bottom: 1px solid var(--border); }
.mix-group-title { font-size: 15px; font-weight: 600; color: var(--text-primary); }
.mix-group-mnemonic { margin-top: 4px; font-size: 12px; color: var(--text-secondary); line-height: 1.5; }
.mix-row { display: flex; align-items: flex-start; padding: 10px 14px; border-bottom: 1px solid var(--bg); }
.mix-row:last-child { border-bottom: none; }
.mix-row-concept { flex: 1; font-size: 14px; color: var(--text-primary); padding-right: 10px; line-height: 1.5; }
.mix-row-answer { flex: 1; font-size: 14px; color: var(--text-secondary); line-height: 1.5; }
[data-theme="dark"] .mix-group-header { background: #2a2d35; }
[data-theme="dark"] .mix-row { border-bottom-color: var(--border); }
.num-sheet-cat { margin-bottom:14px; background:var(--card-bg); border-radius:10px; overflow:hidden; }
.num-sheet-cat-title { font-size:15px; font-weight:700; color:var(--text-primary); padding:10px 14px; background:var(--cat-bg); display:flex; justify-content:space-between; align-items:center; }
.num-sheet-cat-mnemonic { font-size:12px; color:var(--text-secondary); font-weight:400; margin-top:4px; line-height:1.5; padding:0 14px 10px; background:var(--cat-bg); }
.num-sheet-q { padding:10px 14px; background:var(--card-bg); border-top:1px solid var(--border); font-size:14px; color:var(--text-primary); line-height:1.6; cursor:pointer; }
.num-sheet-q:hover { background:var(--bg); }
.num-sheet-q-meta { font-size:11px; color:var(--text-tertiary); margin-top:4px; }
<style>
.history-list { background:rgba(0,0,0,0.06); border-radius:16px; padding:8px; margin-top:12px; }
.history-list::-webkit-scrollbar { width:6px; }
.history-list::-webkit-scrollbar-thumb { background:rgba(0,0,0,0.18); border-radius:99px; }
.history-list::-webkit-scrollbar-thumb:hover { background:rgba(0,0,0,0.3); }
.history-list .history-item:last-child { margin-bottom:0; }
[data-theme="dark"] .history-list::-webkit-scrollbar-thumb { background:rgba(255,255,255,0.18); }
[data-theme="dark"] .history-list::-webkit-scrollbar-thumb:hover { background:rgba(255,255,255,0.3); }
.history-item { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:16px 14px; background:var(--card-bg); border:1px solid var(--border); border-radius:14px; margin-bottom:10px; cursor:pointer; box-shadow:0 1px 3px rgba(0,0,0,0.04); transition:border-color .15s ease, box-shadow .15s ease, transform .1s ease; }
.history-item:last-child { margin-bottom:0; }
.history-item:hover { border-color:var(--text-tertiary); box-shadow:var(--shadow); }
.history-item:active { transform:scale(.98); }
.history-item-info { min-width:0; flex:1; }
.history-item-head { display:flex; align-items:center; gap:8px; margin-bottom:8px; }
.history-item-no { font-size:13px; font-weight:700; color:var(--text); background:rgba(0,0,0,0.06); padding:3px 10px; border-radius:999px; flex-shrink:0; }
.history-item-mode { font-size:12px; font-weight:600; color:var(--text-secondary); background:rgba(0,0,0,0.04); border:1px solid var(--border); padding:2px 10px; border-radius:999px; flex-shrink:0; }
.history-item-time { font-size:12px; color:var(--text-tertiary); margin-left:auto; flex-shrink:0; }
.history-item-meta { display:flex; gap:12px; font-size:13px; color:var(--text-secondary); font-variant-numeric:tabular-nums; }
.history-item-meta .h-ok { color:#2e9e63; }
.history-item-meta .h-bad { color:#c94f4f; }
.history-item-meta .h-gray { color:var(--text-tertiary); }
.history-item-score { font-size:20px; font-weight:700; flex-shrink:0; text-align:center; line-height:1.15; min-width:60px; }
.history-item-score small { display:block; font-size:10px; font-weight:600; color:var(--text-tertiary); margin-top:3px; letter-spacing:.5px; white-space:nowrap; }
.hscore-ok { color:#2e9e63; }
.hscore-mid { color:#a8741c; }
.hscore-low { color:#c94f4f; }
.history-footer-btn { width:100%; height:50px; background:var(--card-bg); color:var(--text); border:1px solid var(--border); border-radius:14px; font-size:15px; font-weight:600; cursor:pointer; margin-top:14px; transition:background .15s ease, border-color .15s ease, transform .1s ease; }
.history-footer-btn:hover { background:var(--bg); border-color:var(--text-tertiary); }

.history-btn-danger { background:color-mix(in srgb, #c94f4f 8%, transparent); border-color:rgba(201,79,79,0.4); color:#c94f4f; }

.history-btn-danger:hover { background:color-mix(in srgb, #c94f4f 14%, transparent); border-color:#c94f4f; color:#c94f4f; }

[data-theme="dark"] .history-btn-danger { background:color-mix(in srgb, #c94f4f 16%, transparent); border-color:rgba(201,79,79,0.5); color:#e07979; }

[data-theme="dark"] .history-btn-danger:hover { background:color-mix(in srgb, #c94f4f 24%, transparent); color:#f08d8d; }
.history-footer-btn:active { transform:scale(.98); }
.history-detail { background:var(--bg); border-radius:14px; padding:6px 14px; margin:8px 0; }
.history-detail > div { display:flex; justify-content:space-between; padding:10px 0; border-bottom:1px solid rgba(0,0,0,.06); font-size:14px; }
.history-detail > div:last-child { border-bottom:none; }
.history-detail span { color:var(--text-secondary); }
.history-detail b { color:var(--text-primary); font-weight:600; }
[data-theme="dark"] .history-detail > div { border-bottom-color:rgba(255,255,255,.08); }
.history-day { font-size:13px; font-weight:700; color:var(--text-secondary); margin:6px 4px 8px; }
.history-tip { font-size:12px; color:var(--text-tertiary); background:var(--bg); border-radius:10px; padding:8px 12px; margin-top:10px; line-height:1.6; }
[data-theme="dark"] .history-list { background:rgba(255,255,255,0.06); }
[data-theme="dark"] .history-item { box-shadow:0 1px 3px rgba(0,0,0,0.3); }
[data-theme="dark"] .history-item-no { background:rgba(255,255,255,0.14); }
[data-theme="dark"] .history-item-mode { background:rgba(255,255,255,0.08); }
[data-theme="dark"] .history-day,
[data-theme="dark"] .history-tip,
[data-theme="dark"] .history-item-time,
[data-theme="dark"] .history-item-meta .h-gray,
[data-theme="dark"] .history-item-score small { color:#8f949c; }

.history-filter { display:flex; flex-wrap:wrap; gap:8px; margin:12px 0 2px; }

.history-filter-tag { padding:5px 12px; border-radius:999px; border:1px solid var(--border); background:var(--card-bg); color:var(--text-secondary); font-size:12px; cursor:pointer; transition:all .15s ease; }

.history-filter-tag:hover { border-color:var(--text-tertiary); color:var(--text); }

.history-filter-tag.active { background:color-mix(in srgb, var(--primary) 12%, transparent); border-color:var(--primary); color:var(--primary); font-weight:600; }

[data-theme="dark"] .history-filter-tag { background:rgba(255,255,255,0.06); }

[data-theme="dark"] .history-filter-tag.active { background:color-mix(in srgb, var(--primary) 16%, transparent); color:var(--primary); }

.history-item-scope { font-size:11px; color:var(--text-tertiary); margin-top:4px; line-height:1.5; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }

.weak-list { display:flex; flex-direction:column; gap:10px; max-height:48vh; overflow-y:auto; }

.weak-item { background:var(--bg); border:1px solid var(--border); border-radius:12px; padding:10px 12px; }

.weak-item-head { display:flex; justify-content:space-between; align-items:center; font-size:13px; margin-bottom:6px; }

.weak-item-head b { color:var(--text); font-weight:600; }

.weak-bar { height:8px; border-radius:99px; background:rgba(0,0,0,0.08); overflow:hidden; }

.weak-bar-fill { height:100%; border-radius:99px; background:var(--primary); }

[data-theme="dark"] .weak-bar { background:rgba(255,255,255,0.1); }

[data-theme="dark"] .weak-item { border-color:rgba(255,255,255,0.1); }


/* 复习计划 - 统计条 / 等级分布 / 练本组 / 到期高亮 / 练习提示 */
.plan-stats{display:flex;gap:8px;padding:14px 20px 0;}
.plan-stat{flex:1;text-align:center;padding:9px 0 8px;border-radius:10px;font-size:12px;color:var(--text-secondary);background:rgba(0,0,0,0.04);}
.plan-stat b{display:block;font-size:20px;line-height:1.1;margin-bottom:3px;font-weight:700;}
.plan-stat-due{background:#fff1f0;color:#c94f4f;}
.plan-stat-due b{color:#c94f4f;}
.plan-stat-week b,.plan-stat-total b{color:var(--text);}
[data-theme="dark"] .plan-stat{background:rgba(255,255,255,0.07);}
[data-theme="dark"] .plan-stat-due{background:rgba(201,79,79,0.16);color:#e08a8a;}
[data-theme="dark"] .plan-stat-due b{color:#f0a3a3;}
.plan-levels{padding:8px 20px 0;font-size:11px;color:var(--text-tertiary);}
.plan-group-header{display:flex;align-items:center;justify-content:space-between;gap:8px;}
.plan-group-right{display:inline-flex;align-items:center;gap:8px;}
.plan-group-action{font-size:11px;font-weight:600;padding:3px 10px;border-radius:999px;background:var(--bg);border:1px solid var(--border);color:var(--text-secondary);cursor:pointer;transition:all .15s;}
.plan-group-action:hover{color:var(--text);border-color:var(--text-secondary);}
.plan-group-header{cursor:pointer;user-select:none;}
.plan-group-left{display:inline-flex;align-items:center;gap:2px;min-width:0;}
.plan-group-arrow{display:inline-block;font-size:10px;color:var(--text-secondary);transition:transform .15s;}
.plan-group.collapsed .plan-group-arrow{transform:rotate(-90deg);}
.plan-group.collapsed .plan-group-body{display:none;}
.plan-item.due-row{background:#fffbfa;}
.plan-item.due-row:active{background:#fff1f0;}
[data-theme="dark"] .plan-item.due-row{background:rgba(201,79,79,0.07);}
[data-theme="dark"] .plan-item.due-row:active{background:rgba(201,79,79,0.14);}
.plan-item-practice{font-size:11px;color:var(--text-tertiary);}

/* 结束页立即练习错题按钮 */
.btn-danger{width:100%;height:50px;background:#fff1f0;color:#c94f4f;border:1.5px solid #c94f4f;border-radius:25px;font-size:17px;font-weight:600;cursor:pointer;margin-top:8px;transition:background .2s;}
.btn-danger:hover{background:#ffe3e0;}
[data-theme="dark"] .btn-danger{background:rgba(201,79,79,0.14);color:#f0a3a3;border-color:#e07979;}
[data-theme="dark"] .btn-danger:hover{background:rgba(201,79,79,0.22);}
/* 章节列表视觉整理 */
.chapter-card{border:1px solid var(--border);}
.chapter-header:hover{background:var(--bg);}
.chapter-info{min-width:0;}
.chapter-meta{display:flex;align-items:center;gap:6px;margin-top:3px;}
.meta-chip{font-size:11px;color:var(--text-tertiary);background:var(--bg);padding:1px 8px;border-radius:10px;}
.chapter-right{display:flex;align-items:center;gap:8px;}
.chapter-progress-wrap{width:64px;height:6px;border-radius:3px;background:var(--bg);overflow:hidden;flex:none;}
.chapter-progress{height:100%;border-radius:3px;background:var(--primary);transition:width .3s;}
.chapter-pct{font-size:11px;color:var(--text-secondary);font-weight:600;min-width:28px;text-align:right;}
.section-item{border-radius:10px;}
@media (max-width:560px){.chapter-list{grid-template-columns:1fr;grid-auto-flow:row;}}

/* 学习趋势 */
.trend-modal{max-width:560px;width:min(560px,92vw);}
.trend-stats{display:flex;gap:8px;padding:14px 20px 0;}
.trend-stat{flex:1;text-align:center;padding:10px 0 8px;border-radius:10px;background:rgba(0,0,0,0.04);}
.trend-stat b{display:block;font-size:18px;line-height:1.2;margin-bottom:2px;color:var(--text);}
[data-theme="dark"] .trend-stat{background:rgba(255,255,255,0.07);}
.trend-block{padding:16px 20px 0;}
.trend-block-title{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.trend-chart{display:flex;align-items:flex-end;gap:2px;height:130px;}
.trend-col{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:4px;min-width:0;}
.trend-bar-wrap{width:100%;flex:1;display:flex;align-items:flex-end;justify-content:center;min-height:0;}
.trend-bar{width:62%;min-height:0;border-radius:3px 3px 0 0;background:var(--primary);opacity:.85;transition:height .3s;}
.trend-bar.empty{background:rgba(0,0,0,0.07);}
[data-theme="dark"] .trend-bar.empty{background:rgba(255,255,255,0.07);}
.trend-day{font-size:9px;color:var(--text-tertiary);white-space:nowrap;}
.trend-line-wrap{position:relative;height:96px;margin-bottom:14px;}
.trend-line{position:absolute;inset:0;width:100%;height:76px;}
.trend-line-axis{position:absolute;top:80px;left:0;right:0;display:flex;justify-content:space-between;font-size:9px;color:var(--text-tertiary);}
.trend-legend{margin-left:auto;display:inline-flex;gap:8px;font-weight:400;font-size:13px;color:var(--text-tertiary);}
.trend-legend .a80{color:#1d7a4f;}
.trend-legend .a60{color:#3f9e68;}
.trend-legend .a0{color:#93bdab;}
.trend-table-wrap{overflow-x:auto;margin-top:2px;}
.trend-table{width:100%;border-collapse:collapse;font-size:12.5px;}
.trend-table th{font-size:11.5px;color:var(--text-secondary);font-weight:600;text-align:left;padding:6px 8px;border-bottom:1px solid var(--border);white-space:nowrap;}
.trend-table td{padding:7px 8px;border-bottom:1px solid rgba(128,128,128,.12);vertical-align:middle;}
.trend-table tr:last-child td{border-bottom:none;}
[data-theme="dark"] .trend-table td{border-color:rgba(255,255,255,.08);}
.trend-day-cell{color:var(--text-secondary);white-space:nowrap;}
.trend-qty{font-weight:700;color:var(--text);font-size:13px;}
.trend-qty-track{height:5px;border-radius:3px;background:rgba(0,0,0,.06);margin-top:4px;max-width:140px;overflow:hidden;}
[data-theme="dark"] .trend-qty-track{background:rgba(255,255,255,.08);}
.trend-qty-bar{height:100%;border-radius:3px;background:var(--primary);}
.trend-qty-empty{color:var(--text-tertiary);}
.trend-acc{font-weight:700;font-size:12.5px;}
.trend-acc.a80{color:#1d7a4f;}
.trend-acc.a60{color:#3f9e68;}
.trend-acc.a0{color:#93bdab;}
.trend-csv-btn{font-size:12px;padding:6px 12px;border-radius:8px;border:1px solid var(--border);background:transparent;color:var(--primary);cursor:pointer;}
.trend-csv-btn:hover{border-color:var(--primary);}
.trend-seg{display:flex;gap:6px;margin:6px 0 12px;}
.trend-seg button{flex:1;padding:7px 0;border-radius:8px;border:1px solid var(--border);background:transparent;color:var(--text-secondary);font-size:12.5px;cursor:pointer;font-family:inherit;}
.trend-seg button.on{background:var(--primary);border-color:var(--primary);color:#fff;font-weight:600;}
.board-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:4px 16px 0;}
.board-stat{background:rgba(0,0,0,.04);border-radius:10px;padding:10px 4px;text-align:center;min-width:0;}
[data-theme="dark"] .board-stat{background:rgba(255,255,255,.07);}
.board-stat b{display:block;font-size:17px;line-height:1.25;color:var(--text);}
.board-stat b.ok{color:var(--success);}
.board-stat span{display:block;font-size:10.5px;color:var(--text-secondary);margin-top:2px;white-space:nowrap;}
.trend-delta{font-size:11.5px;color:var(--text-secondary);padding:8px 16px 0;text-align:right;}
.trend-delta .up{color:var(--success);font-weight:700;}
.trend-delta .down{color:var(--danger);font-weight:700;}
.trend-week{font-size:10px;color:var(--text-tertiary);margin-left:6px;}
.trend-day-cell .weekend{color:var(--danger);font-weight:600;}
.trend-table tr.today{background:rgba(46,107,79,.08);}
[data-theme="dark"] .trend-table tr.today{background:rgba(99,171,133,.14);}
.trend-table tr.today td:first-child{border-left:3px solid var(--primary);padding-left:5px;}
.trend-qty{font-weight:700;color:var(--text);font-size:14px;}
.trend-qty.goal{color:var(--success);}
.today-badge{font-size:9px;background:var(--primary);color:#fff;border-radius:3px;padding:1px 4px;margin-left:6px;vertical-align:1px;}
.trend-qty-track{height:8px;border-radius:4px;background:rgba(0,0,0,.06);margin-top:5px;max-width:150px;overflow:hidden;}
[data-theme="dark"] .trend-qty-track{background:rgba(255,255,255,.08);}
.trend-qty-bar{height:100%;border-radius:4px;background:var(--primary);}
.tchart{width:100%;box-sizing:border-box;}
.tchart-body{position:relative;display:flex;height:156px;padding:6px 2px 0;background:repeating-linear-gradient(to bottom,transparent 0,transparent 23px,rgba(128,128,128,.08) 24px);border-bottom:2px solid rgba(128,128,128,.25);border-radius:8px;overflow:hidden;}
.tc{flex:1;min-width:0;position:relative;}
.tb{position:absolute;left:1px;right:1px;bottom:14px;height:108px;}
.tb .bar{position:absolute;left:18%;right:18%;bottom:0;border-radius:3px 3px 1px 1px;min-height:2px;background:#c4ccc7;}
.tb .bar.ok{background:#1d7a4f;}
.tb .bar.mid{background:#3f9e68;}
.tb .bar.weak{background:#93bdab;}
.tb .bar.na{background:var(--primary);}
.tb .bar.empty{background:rgba(128,128,128,.28);}
.tc.today .tb .bar{box-shadow:0 0 0 1.5px var(--primary);}
.tv{position:absolute;left:0;right:0;text-align:center;font-size:13px;line-height:16px;height:16px;color:var(--text-secondary);font-weight:700;pointer-events:none;}
.tl{position:absolute;left:0;right:0;bottom:0;height:18px;line-height:18px;font-size:13px;text-align:center;color:var(--text-tertiary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.tc.wk .tl{color:var(--danger);font-weight:600;}
.tc.today .tl{color:var(--primary);font-weight:700;}
.goal-line{position:absolute;left:0;right:0;height:0;border-top:1px dashed rgba(224,69,59,.75);z-index:2;}
.goal-line span{position:absolute;right:0;top:-18px;font-size:13px;line-height:16px;color:var(--danger);font-weight:600;background:var(--bg);padding:0 4px;border-radius:3px;}
.tchart-legend{display:flex;flex-wrap:wrap;gap:6px 12px;justify-content:center;align-items:center;font-size:13px;color:var(--text-secondary);padding:8px 2px 0;}
.tchart-legend .d{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:3px;vertical-align:-1px;}
.tchart-legend .d.ok{background:#1d7a4f;}
.tchart-legend .d.mid{background:#3f9e68;}
.tchart-legend .d.weak{background:#93bdab;}
.tchart-legend .d.today{box-shadow:0 0 0 1.5px var(--primary);background:#fff;}
.tchart-legend .d.none{background:rgba(128,128,128,.35);}
.tchart-legend .avg{color:var(--text-secondary);}
.tchart-legend .avg b{color:var(--primary);}
.trend-qty-bar.goal{background:var(--success);}
.trend-qty-empty{color:var(--text-tertiary);}
.acc-chip{display:inline-block;min-width:46px;text-align:center;font-weight:700;font-size:12.5px;padding:3px 8px;border-radius:6px;}
.acc-chip.a80{color:#1d7a4f;background:rgba(63,178,127,.15);}
.acc-chip.a60{color:#3f9e68;background:rgba(63,158,104,.18);}
.acc-chip.a0{color:#6e9a86;background:rgba(147,189,171,.18);}
.trend-table td{padding:9px 6px;}
.trend-day-cell .weekend{font-weight:700;}
.trend-table tr.today{background:rgba(46,107,79,.12);}
[data-theme="dark"] .trend-table tr.today{background:rgba(99,171,133,.18);}
.board-stat b{letter-spacing:.5px;}
.hero-text{min-width:0;}
/* Desktop large: widen modals further */
@media (min-width: 1024px) {
  .modal-content { max-width: 880px; }
}

/* ===== Home Page Redesign (2026-08) ===== */
.home-hero { background: linear-gradient(140deg, #2e6b4f 0%, #3d8461 55%, #2a5f47 100%); border: 1px solid rgba(255,255,255,0.14); }
.home-hero::before { content: ''; position: absolute; right: -46px; top: -70px; width: 210px; height: 210px; border-radius: 50%; background: radial-gradient(circle, rgba(255,255,255,0.16) 0%, transparent 70%); pointer-events: none; }
.home-hero::after { content: ''; position: absolute; left: 26%; bottom: -80px; width: 190px; height: 190px; border-radius: 50%; background: radial-gradient(circle, rgba(16,52,36,0.38) 0%, transparent 70%); pointer-events: none; }
#page-home .home-hero h3 { color: #ffffff; font-weight: 800; font-size: 17px; letter-spacing: 0.3px; }
#page-home .home-hero p { color: #f2faf5; font-weight: 500; font-size: 13.5px; }
#page-home .home-hero .hero-due-btn, #page-home .home-hero .hero-history-btn { background: linear-gradient(135deg, #2E7D32 0%, #1F5E26 100%); border-color: rgba(255,255,255,0.22); box-shadow: 0 3px 10px rgba(0,0,0,0.18); }
#page-home .home-hero .hero-due-btn { color: #ffffff; }
#page-home .home-hero .hero-due-btn:hover { color: #e8f5e9; border-color: rgba(255,255,255,0.4); }
#page-home .home-hero .hero-history-btn { color: #ffffff; border-color: rgba(255,255,255,0.22); }
#page-home .home-hero .hero-due-btn.has-due { color: #ffffff; border-color: rgba(255,150,150,0.55); }
#page-home .home-hero .hero-due-btn .hero-due-num { background: rgba(255,255,255,0.18); color: #ffffff; }
#page-home .home-hero .hero-due-btn.has-due .hero-due-num { background: #c94f4f; color: #ffffff; }
[data-theme="dark"] .home-hero { background: linear-gradient(140deg, #29614a 0%, #3d8461 58%, #22492f 100%); border-color: rgba(255,255,255,0.10); }
.hero-ring { position: relative; width: 64px; height: 64px; flex-shrink: 0; }
.hero-ring-fill { position: absolute; inset: 0; border-radius: 50%; background: conic-gradient(#ffffff 0%, rgba(255,255,255,0.22) 0%); }
.hero-ring-inner { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; }
.hero-ring-pct { width: 52px; height: 52px; border-radius: 50%; background: rgba(255,255,255,0.16); display: flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 700; color: #ffffff; }
.feature-item { position: relative; overflow: hidden; }
.feature-badge {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 2;
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  padding: 4px 8px;
  border-radius: 999px;
  background: var(--due-bg);
  color: var(--due-text);
  border: 1px solid var(--due-border);
  pointer-events: none;
  white-space: nowrap;
}
.feature-badge.has-due { animation: duePulse 2s ease-in-out infinite; }
@keyframes duePulse { 0%,100% { transform: scale(1); } 50% { transform: scale(1.06); } }
.q-status-badge {
  display: inline-block;
  margin-left: 8px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  padding: 3px 8px;
  border-radius: 999px;
  vertical-align: middle;
}
.q-status-badge.new { background: var(--info-bg); color: var(--info-text); border: 1px solid var(--info-border); }
.q-status-badge.due { background: var(--due-bg); color: var(--due-text); border: 1px solid var(--due-border); }
.q-status-badge.wrong { background: var(--error-bg); color: var(--error-text); border: 1px solid var(--error-border); }
.feature-item::after { content: ''; position: absolute; inset: 0; border-radius: inherit; box-shadow: inset 0 1px 0 rgba(255,255,255,0.6); pointer-events: none; }
[data-theme="dark"] .feature-item::after { box-shadow: inset 0 1px 0 rgba(255,255,255,0.05); }
.feature-icon[style] { background: rgba(46,107,79,0.12) !important; }
[data-theme="dark"] .feature-icon[style] { background: rgba(99,171,133,0.20) !important; }
/* ===== Continue Polish (2026-08) ===== */
/* ===== 贴底全宽底部导航 (2026-08) ===== */
.bottom-nav {
  bottom: 0;
  width: 100%;
  min-width: 0;
  max-width: 500px;
  background: var(--card-bg);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  border: none;
  border-top: 1px solid var(--border);
  border-radius: 0;
  padding: 6px 0 calc(6px + var(--safe-bottom));
  box-shadow: 0 -2px 12px rgba(0,0,0,0.06);
}
[data-theme="dark"] .bottom-nav {
  background: #171a1f;
  border-top-color: #2d3038;
  box-shadow: 0 -2px 12px rgba(0,0,0,0.4);
}
/* 搜索框：常态中性边框 + 聚焦蓝色光晕 */
.home-search input {
  border: 1.5px solid var(--border);
  border-radius: 14px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.05), inset 0 1px 2px rgba(0,0,0,0.03);
  transition: border-color .2s, box-shadow .2s;
}
.home-search input:focus {
  border-color: #2e6b4f;
  box-shadow: 0 0 0 3px rgba(46,107,79,0.12), 0 2px 10px rgba(0,0,0,0.05);
}
/* 首页区块标题：左侧蓝色小色条 */
#page-home .section-title { position: relative; padding-left: 26px; }
#page-home .section-title::before {
  content:''; position:absolute; left:12px; top:50%; transform:translateY(-50%);
  width:4px; height:17px; border-radius:2px;
  background: linear-gradient(180deg,#2e6b4f,#4f8f6a);
}
[data-theme="dark"] #page-home .section-title::before { background: linear-gradient(180deg,#57a67c,#7cc096); }
/* 首页背景轻微加深，突出卡片层次 */
#page-home { background:#edeff0; }
[data-theme="dark"] #page-home { background: var(--bg); }
/* ===== End Continue Polish ===== */
/* ===== Project-wide Polish (2026-08) ===== */
/* 1. 全局亮色背景统一加深（全站卡片更立体；暗色保持 #14171e） */
:root { --bg: #edeff0; }
html[data-theme="dark"] { --bg: #14171e; }
/* 2. 答题选项卡片化（对/错状态色保留不动） */
#page-practice .q-option:not(.correct):not(.wrong) {
  background: #f4f6fa;
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 12px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.04);
  transition: all .15s ease;
}
#page-practice .q-option:not(.correct):not(.wrong):hover {
  background: #eef2f8;
  border-color: rgba(46,107,79,0.4);
}
[data-theme="dark"] #page-practice .q-option:not(.correct):not(.wrong) {
  background: #242730;
  border-color: #2d3038;
  box-shadow: 0 2px 8px rgba(0,0,0,0.2);
}
[data-theme="dark"] #page-practice .q-option.selected:not(.correct):not(.wrong) {
  background: rgba(59,130,246,0.14);
  border-color: #57a67c;
}
/* 3. 统计卡片微调 */
.stat-card { border-radius: 14px; border: 1px solid var(--border); box-shadow: 0 2px 10px rgba(0,0,0,0.05); }
[data-theme="dark"] .stat-card { border-color: rgba(255,255,255,0.07); box-shadow: 0 4px 14px rgba(0,0,0,0.3); }
/* 4. 筛选控件胶囊化 */
.filter-info { border-radius: 999px; }
/* 5. 弹窗遮罩更柔和 + 弹窗圆角 */
.modal-overlay { background: rgba(20,24,32,0.5); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.modal-content { border-radius: 18px; }
/* ===== End Project-wide Polish ===== */
/* ===== End Home Page Redesign ===== */
/* ===== 搜索历史 ===== */
.search-history-head{display:flex;align-items:center;justify-content:space-between;padding:10px 14px 4px;font-size:12px;color:var(--text-secondary);}
.search-history-clear{background:none;border:none;color:var(--text-tertiary);font-size:12px;cursor:pointer;text-decoration:underline;}
.search-history-clear:hover{color:var(--primary);}
.search-history-list{display:flex;flex-wrap:wrap;gap:8px;padding:10px 14px 14px;}
.search-history-chip{padding:6px 12px;border-radius:999px;background:color-mix(in srgb,var(--primary) 9%,var(--card-bg));border:1px solid var(--border);color:var(--text);font-size:13px;cursor:pointer;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.search-history-chip:hover{border-color:var(--primary);color:var(--primary);}
[data-theme="dark"] .search-history-chip{background:rgba(255,255,255,0.07);border-color:#2d3038;}

/* Mobile: 等效浏览器85%缩放（手机端紧凑观感，等效手动缩放至85%） */
@media (max-width:767px){ html { zoom: 0.85; } }

@media (max-width:767px){ .exam-sheet-num { font-size: 15px; } }

/* ===== 游戏化 v5：学员卡 / 成就墙 / 日历带 ===== */
.hero-banner.home-hero { position: relative; }
.master-card { flex: 1 1 100%; background: linear-gradient(160deg, #d9e8dc 0%, #c6dbcd 100%); border: 1px solid rgba(46,107,79,0.25); border-radius: 14px; padding: 12px 14px; margin: 0 0 10px; box-shadow: 0 4px 14px rgba(46,80,60,0.12), inset 0 1px 0 rgba(255,255,255,0.65); }
.master-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.master-title { font-size: 16px; font-weight: 800; color: var(--text-primary); }
.master-lv { font-size: 12px; font-weight: 700; color: #fff; background: var(--primary); padding: 2px 10px; border-radius: 999px; }
.master-mastery { display: flex; align-items: center; gap: 8px; margin-top: 9px; }
.master-mastery-label { font-size: 11px; color: #4a5a50; flex-shrink: 0; }
.master-mastery-bar { flex: 1; height: 8px; background: rgba(0,60,40,0.16); border-radius: 99px; overflow: hidden; }
[data-theme="dark"] .master-mastery-bar { background: rgba(255,255,255,0.12); }
.master-mastery-fill { height: 100%; width: 0; background: linear-gradient(90deg, #2e6b4f, #3d8b68); border-radius: 99px; transition: width .5s ease; }
[data-theme="dark"] .master-card { background: linear-gradient(160deg, rgba(70,140,100,0.32), rgba(38,76,56,0.18)); border-color: rgba(90,160,120,0.34); box-shadow: 0 4px 14px rgba(0,0,0,0.35), inset 0 1px 0 rgba(255,255,255,0.06); }
.master-mastery-fill.master-full { background: linear-gradient(90deg, #f5b73c, #ffd87a); }
.master-mastery-val { font-size: 12px; font-weight: 800; color: var(--primary-dark); min-width: 38px; text-align: right; }
.master-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 10px; }
.master-streak { font-size: 11px; color: #46564c; }
.master-streak.streak-hot { color: #e67e22; font-weight: 700; }
.master-ach { font-size: 12px; color: #46564c; cursor: pointer; user-select: none; }
.master-ach b { color: #22513a; font-size: 14px; }
.hero-ring-wrap { position: static; order: 3; margin-left: auto; width: 74px; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 6px; }
.hero-ring { position: relative; width: 74px; height: 74px; border-radius: 50%; background: rgba(255,255,255,0.18); }
.hero-ring-fill { position: absolute; inset: 0; border-radius: 50%; transition: background .4s ease; }
.hero-ring-fill.ring-gold { filter: drop-shadow(0 0 6px rgba(245,183,60,0.7)); }
.hero-ring-inner { position: absolute; inset: 7px; border-radius: 50%; background: linear-gradient(150deg, #1f5c40, #2e6b4f); display: flex; align-items: center; justify-content: center; }
[data-theme="dark"] .hero-ring-inner { background: linear-gradient(150deg, #173f2c, #1f5138); }
.hero-ring-pct { font-size: 15px; font-weight: 800; background: transparent; color: #ffffff; }
.hero-over-tag { position: static; font-size: 11px; font-weight: 800; color: #7a5200; background: linear-gradient(135deg, #ffe9a8, #ffd66e); border: 1px solid #f0b429; padding: 3px 8px; border-radius: 999px; align-items: center; white-space: nowrap; width: max-content; }
[data-theme="dark"] .hero-over-tag { color: #3d2b00; }
.hero-over-banner { margin: 0 0 14px; padding: 14px 14px 16px; border-radius: 12px; background: linear-gradient(135deg, #fff3cd, #ffe08a); color: #6b4e00; font-size: 13px; font-weight: 700; cursor: pointer; box-shadow: 0 2px 12px rgba(200,150,30,0.28), inset 0 1px 0 rgba(255,255,255,0.55); position: relative; overflow: hidden; }
.hero-over-banner b { color: #d48806; }
.hero-over-bn-bar { position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: rgba(180,120,10,0.18); }
.hero-over-bn-bar i { display: block; height: 100%; width: 0; background: linear-gradient(90deg, #f5b73c, #ff9f1a); border-radius: 0 99px 99px 0; transition: width .5s ease; }
/* 超额里程碑彩蛋：金色脉冲 + 星火粒子 */
.hero-ring.ring-epic { animation: hero-gold-pulse 1.1s ease-in-out 2; }
@keyframes hero-gold-pulse { 0%,100% { box-shadow: 0 0 0 0 rgba(245,183,60,0); } 40% { box-shadow: 0 0 0 8px rgba(245,183,60,0.35); transform: scale(1.05); } }
.ring-spark { position: absolute; left: 37px; top: 37px; width: 6px; height: 6px; border-radius: 50%; background: radial-gradient(circle, #fff3c4, #f5b73c); pointer-events: none; opacity: 0; animation: ring-spark .95s cubic-bezier(.2,.7,.3,1) forwards; animation-delay: calc(var(--i, 0) * 0.05s); }
@keyframes ring-spark { 0% { opacity: 0; transform: translate(0, 0) scale(.3); } 18% { opacity: 1; transform: translate(calc(var(--dx, 0px) * .4), calc(var(--dy, 0px) * .4)) scale(1); } 100% { opacity: 0; transform: translate(var(--dx, 0px), var(--dy, 0px)) scale(.85); } }
/* 成就墙 */
.ach-tip { font-size: 12px; color: var(--text-tertiary); margin: 2px 0 10px; }
.ach-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; max-height: 52vh; overflow-y: auto; padding-right: 2px; }
.ach-item { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border: 1px solid var(--border); border-radius: 12px; background: rgba(0,0,0,0.02); box-shadow: 0 1px 2px rgba(0,0,0,0.04); }
[data-theme="dark"] .ach-item { background: rgba(255,255,255,0.04); border-color: rgba(255,255,255,0.12); }
.ach-item.ach-done { border-color: rgba(46,107,79,0.42); background: linear-gradient(135deg, rgba(46,107,79,0.08), rgba(46,107,79,0.02)); box-shadow: inset 0 0 0 1px rgba(255,255,255,0.5); }
.ach-icon { font-size: 26px; line-height: 1.1; }
.ach-item.ach-lock .ach-icon, .ach-body .ach-bar { filter: opacity(.55); }
.ach-item:not(.ach-done) { opacity: .62; }
.ach-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.ach-title { font-size: 14px; font-weight: 800; color: var(--text-primary); }
.ach-badge { font-size: 10px; font-weight: 700; color: #0a7a48; background: rgba(0,185,107,0.14); padding: 2px 8px; border-radius: 999px; }
.ach-badge.ach-lock { color: var(--text-tertiary); background: rgba(0,0,0,0.06); }
[data-theme="dark"] .ach-badge.ach-lock { background: rgba(255,255,255,0.08); }
.ach-cond { font-size: 12px; color: var(--text-secondary); margin-top: 5px; line-height: 1.55; }
.ach-bar { height: 5px; background: rgba(0,0,0,0.08); border-radius: 99px; overflow: hidden; margin-top: 7px; }
[data-theme="dark"] .ach-bar { background: rgba(255,255,255,0.1); }
.ach-fill { height: 100%; background: linear-gradient(90deg, #00b96b, #24d98a); border-radius: 99px; }
.ach-num { font-size: 13px; font-weight: 800; color: var(--text-secondary); margin-top: 4px; text-align: right; }
[data-theme="dark"] .ach-num { color: #e8eaed; }
[data-theme="dark"] .ach-bar { background: rgba(255,255,255,0.14); }
/* 历史：日历带 / 月筛选 / 折叠 */
.history-cal { border: 1px solid var(--border); border-radius: 12px; padding: 10px 12px; margin: 12px 0 2px; background: var(--card-bg); }
.history-cal-head { display: flex; align-items: center; justify-content: space-between; font-size: 12px; font-weight: 700; color: var(--text-secondary); margin-bottom: 8px; }
.history-cal-legend { font-size: 10px; font-weight: 400; color: var(--text-tertiary); display: flex; align-items: center; gap: 4px; }
.history-cal-legend .dot { width: 6px; height: 6px; border-radius: 2px; display: inline-block; background: rgba(0,0,0,0.14); margin: 0 2px; }
[data-theme="dark"] .history-cal-legend .dot { background: rgba(255,255,255,0.16); }
.history-cal-legend .dot.lit { background: #2e6b4f; }
.history-cal-grid { display: grid; grid-template-columns: repeat(10, 1fr); gap: 4px; }
/* ===== 真月历（histcal）===== */
.histcal-monthbar { display: flex; align-items: center; justify-content: space-between; margin: 2px 0 6px; }
.histcal-monthbar b { font-size: 13px; color: var(--text-primary); }
.histcal-nav-btn { background: var(--card-bg); border: 1px solid var(--border); color: var(--text-secondary); border-radius: 8px; min-width: 26px; height: 26px; font-size: 14px; line-height: 1; cursor: pointer; }
.histcal-nav-btn:active { transform: scale(0.94); }
.histcal-weekrow { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; margin-bottom: 3px; }
.histcal-dow { text-align: center; font-size: 10px; font-weight: 700; color: var(--text-tertiary); }
.histcal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.histcal-cell { position: relative; height: 34px; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 600; color: var(--text-primary); border: 2px solid transparent; box-sizing: border-box; user-select: none; }
.histcal-cell.level1 { background: rgba(0,0,0,0.05); color: var(--text-secondary); }
.histcal-cell.level2 { background: #b7e4c7; }
.histcal-cell.level3 { background: #74c69d; }
.histcal-cell.level4 { background: #2d9e5f; color: #fff; }
.histcal-cell.today { border-color: var(--primary); }
.histcal-cell.sel { outline: 2px solid var(--primary); outline-offset: 1px; background: var(--primary) !important; color: #fff !important; }
.histcal-cell.dim { color: transparent; background: transparent; }
.histcal-cell.future { color: var(--text-tertiary); opacity: 0.45; cursor: default; }
.histcal-cell:not(.future):not(.dim) { cursor: pointer; }
.histcal-legend { display: flex; align-items: center; justify-content: flex-end; gap: 4px; font-size: 10px; color: var(--text-tertiary); margin: 5px 0 2px; }
.histcal-legend i { display: inline-block; width: 8px; height: 8px; border-radius: 2px; }
.hist-daybar { display: flex; align-items: center; justify-content: space-between; background: var(--card-bg); border: 1px solid var(--border); border-radius: 10px; padding: 6px 10px; margin: 8px 0 6px; font-size: 12px; color: var(--text-secondary); }
[data-theme="dark"] .histcal-cell.level1 { background: rgba(255,255,255,0.09); color: var(--text-secondary); }
.cal-cell { aspect-ratio: 1 / 1; border-radius: 4px; background: rgba(0,0,0,0.07); }
[data-theme="dark"] .cal-cell { background: rgba(255,255,255,0.09); }
.cal-cell.lit { background: #2e6b4f; box-shadow: 0 0 4px rgba(46,107,79,0.45); }
.history-monthbar { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 10px 0 4px; }
.history-monthbar-label { font-size: 12px; font-weight: 600; color: var(--text-secondary); margin-right: 2px; }
.history-month { padding: 4px 10px; border-radius: 999px; border: 1px solid var(--border); background: var(--card-bg); color: var(--text-secondary); font-size: 12px; font-weight: 600; cursor: pointer; }
.history-month.active { background: var(--primary); border-color: var(--primary); color: #fff; font-weight: 700; }
.history-expand { display: block; width: 100%; margin: 10px 0 4px; padding: 9px; border-radius: 10px; border: 1px dashed var(--border); background: var(--card-bg); color: var(--primary); font-size: 13px; font-weight: 700; cursor: pointer; }
/* ===== 6项优化：历史记录增强样式（B汇总卡 / C搜索筛选 / D成绩单 / F分页 / G日明细）===== */
.hstat-card { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; margin: 10px 0 4px; }
.hstat-cell { background: var(--card-bg); border: 1px solid var(--border); border-radius: 12px; padding: 10px 6px; text-align: center; }
.hstat-cell b { display: block; font-size: 18px; color: var(--primary-dark); line-height: 1.3; }
.hstat-cell span { font-size: 11px; color: var(--text-secondary); }
.hstat-bar { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 6px 0 2px; }
.hstat-bar-label { font-size: 12px; font-weight: 600; color: var(--text-secondary); }
.hstat-day-group { display: flex; gap: 6px; }
.hstat-day-btn { padding: 4px 12px; border-radius: 999px; border: 1px solid var(--border); background: var(--card-bg); color: var(--text-secondary); font-size: 12px; font-weight: 600; cursor: pointer; }
.hstat-day-btn.active { background: var(--primary); border-color: var(--primary); color: #fff; font-weight: 700; }
.history-search-wrap { margin: 10px 0 0; }
.history-search-input { width: 100%; box-sizing: border-box; padding: 9px 12px; border-radius: 10px; border: 1px solid var(--border); background: var(--card-bg); color: var(--text-primary); font-size: 13px; outline: none; }
.history-search-input:focus { border-color: var(--primary); }
.history-adv { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 8px 0 2px; }
.history-adv input[type="date"], .history-adv input[type="number"], .history-adv select {
  padding: 5px 8px; border-radius: 8px; border: 1px solid var(--border); background: var(--card-bg); color: var(--text-primary); font-size: 12px; outline: none;
}
.history-adv label { font-size: 12px; color: var(--text-secondary); }
.history-empty { text-align: center; color: var(--text-secondary); padding: 22px 4px; line-height: 1.8; }
/* D: 完整成绩单 overlay */
#scoreboard-overlay { position: fixed; inset: 0; z-index: 9999; background: var(--bg, #f5f6f8); overflow-y: auto; }
#scoreboard-overlay .sb-toolbar { position: sticky; top: 0; z-index: 10; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 10px 14px; background: var(--card-bg); border-bottom: 1px solid var(--border); }
#scoreboard-overlay .sb-title { font-size: 16px; font-weight: 700; color: var(--text-primary); }
#scoreboard-overlay .sb-body { padding: 14px; max-width: 860px; margin: 0 auto; }
.sb-summary { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin: 12px 0; }
.sb-summary .hstat-cell b { font-size: 20px; }
.sb-table { width: 100%; border-collapse: collapse; background: var(--card-bg); border-radius: 12px; overflow: hidden; font-size: 13px; }
.sb-table th, .sb-table td { border-bottom: 1px solid var(--border); padding: 9px 8px; text-align: left; }
.sb-table th { background: var(--card-bg); color: var(--text-secondary); font-size: 12px; font-weight: 700; position: sticky; top: 46px; }
.sb-table tr.sb-row { cursor: pointer; }
.sb-table tr.sb-row:hover { background: rgba(46,125,79,.06); }
.sb-table tr.sb-detail td { background: var(--card-bg); }
.sb-wrong-list { max-height: 240px; overflow-y: auto; padding: 4px 2px; }
.sb-wrong-item { padding: 6px 8px; border-radius: 8px; background: rgba(0,0,0,.03); margin: 4px 0; font-size: 12px; line-height: 1.6; color: var(--text-primary); }
[data-theme="dark"] .sb-wrong-item { background: rgba(255,255,255,.05); }
.sb-chap { font-size: 11px; color: var(--text-secondary); white-space: nowrap; }
.sb-btn { padding: 7px 14px; border-radius: 999px; border: 1px solid var(--border); background: var(--card-bg); color: var(--primary); font-size: 13px; font-weight: 700; cursor: pointer; }
.sb-btn:hover { background: rgba(46,125,79,.08); }
/* G: 热力图当日明细 */
.dayd-item { background: var(--card-bg); border: 1px solid var(--border); border-radius: 12px; padding: 10px 12px; margin: 8px 0; }
.dayd-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 13px; }
.dayd-head b { color: var(--text-primary); }
.dayd-meta { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; font-size: 12px; color: var(--text-secondary); }
.dayd-wrong { margin-top: 6px; font-size: 12px; line-height: 1.7; color: var(--danger, #d9534f); }
.dayd-tip { text-align: center; color: var(--text-tertiary); font-size: 12px; margin-top: 10px; line-height: 1.7; }
@media print {
  body.printing-sb > *:not(#scoreboard-overlay) { display: none !important; }
  body.printing-sb #scoreboard-overlay { position: static; inset: auto; overflow: visible !important; }
  body.printing-sb #scoreboard-overlay .sb-toolbar { display: none !important; }
  body.printing-sb #scoreboard-overlay .sb-body { max-width: none; padding: 0; }
  body.printing-sb .sb-table th { position: static; }
}
.hero-ring-fill { z-index: 1; }
.hero-ring-inner { z-index: 2; }


/* ===== Lv.100 等级体系：目标感 / 生涯面板 / 升级庆祝 ===== */
.master-title { font-size: 17px; }
.master-lv { font-size: 13px; padding: 2px 12px; }
.master-mastery { align-items: center; }
.master-mastery-val { font-size: 13px; }
.master-next { margin-top: 7px; font-size: 13px; font-weight: 800; color: var(--primary-dark); line-height: 1.5; }
[data-theme="dark"] .master-next { color: #7fbf9c; }
.master-milestone { margin-top: 3px; font-size: 12px; font-weight: 600; color: var(--text-secondary); line-height: 1.5; }
.master-milestone.milestone-near { color: #b06a12; font-weight: 700; }
[data-theme="dark"] .master-milestone.milestone-near { color: #e0a24a; }
.master-career { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin-top: 10px; padding-top: 10px; border-top: 1px dashed rgba(46,80,60,0.25); }
[data-theme="dark"] .master-career { border-top-color: rgba(255,255,255,0.14); }
.mc-item { background: rgba(255,255,255,0.5); border: 1px solid rgba(46,80,60,0.12); border-radius: 10px; padding: 6px 2px; text-align: center; }
[data-theme="dark"] .mc-item { background: rgba(255,255,255,0.06); border-color: rgba(255,255,255,0.1); }
.mc-item b { display: block; font-size: 14px; font-weight: 800; color: var(--text-primary); }
.mc-item span { display: block; font-size: 10px; color: var(--text-tertiary); margin-top: 2px; }
.lvup-dim { position: fixed; inset: 0; background: rgba(0,0,0,0.55); opacity: 0; transition: opacity .35s ease; z-index: 9998; }
#lvup-celebration { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 9999; pointer-events: none; }
#lvup-celebration .lvup-card { pointer-events: auto; text-align: center; background: var(--card-bg); border: 1px solid var(--border); border-radius: 18px; padding: 26px 40px; box-shadow: 0 18px 50px rgba(0,0,0,0.35); transform: scale(0.8) translateY(10px); opacity: 0; transition: all .4s cubic-bezier(.2,1.4,.4,1); }
#lvup-celebration.show .lvup-card { transform: scale(1) translateY(0); opacity: 1; }
#lvup-celebration.show .lvup-dim { opacity: 1; }
.lvup-emoji { font-size: 56px; line-height: 1.1; }
.lvup-title { font-size: 24px; font-weight: 900; color: var(--primary-dark); margin-top: 10px; }
[data-theme="dark"] .lvup-title { color: #7fbf9c; }
.lvup-sub { font-size: 15px; font-weight: 600; color: var(--text-secondary); margin-top: 6px; }
/* ===== 等级总览（增强版B·网格平铺） ===== */
body.lvov-lock { overflow: hidden; }
.lvov-overlay { position: fixed; inset: 0; z-index: 10000; width: 100%; background: rgba(10,18,14,0.68); display: flex; align-items: center; justify-content: center; padding: 16px; opacity: 0; pointer-events: none; transition: opacity .25s ease; }
.lvov-overlay.show { opacity: 1; pointer-events: auto; }
.lvov-panel { width: 100%; max-width: 1060px; min-width: 0; max-height: 92vh; overflow-y: auto; overflow-x: hidden; background: var(--card-bg); border: 1px solid var(--border); border-radius: 18px; box-shadow: var(--shadow-lg); padding: 20px 22px 18px; transform: translateY(10px); transition: transform .25s ease; }
.lvov-overlay.show .lvov-panel { transform: translateY(0); }
.lvov-head { display: flex; align-items: center; justify-content: space-between; font-size: 18px; font-weight: 800; color: var(--primary-dark); }
[data-theme="dark"] .lvov-head { color: #7fbf9c; }
.lvov-x { width: 30px; height: 30px; border-radius: 999px; border: 1px solid var(--border); background: transparent; color: var(--text-secondary); font-size: 14px; cursor: pointer; }
.lvov-x:hover { background: rgba(46,107,79,0.1); color: var(--text); }
.lvov-status { display: flex; align-items: center; gap: 6px 14px; flex-wrap: wrap; margin-top: 14px; padding: 12px 14px; background: rgba(46,107,79,0.08); border: 1px solid rgba(46,107,79,0.22); border-radius: 12px; font-size: 13px; color: var(--text-secondary); }
[data-theme="dark"] .lvov-status { background: rgba(99,171,133,0.1); border-color: rgba(99,171,133,0.3); }
.lvov-status b { color: var(--primary-dark); }
[data-theme="dark"] .lvov-status b { color: #7fbf9c; }
.lvov-status-bar { flex: 1 1 100%; height: 8px; background: rgba(0,60,40,0.14); border-radius: 999px; overflow: hidden; }
[data-theme="dark"] .lvov-status-bar { background: rgba(255,255,255,0.12); }
.lvov-status-fill { height: 100%; width: 0; background: linear-gradient(90deg, #2e6b4f, #3d8b68); border-radius: 999px; transition: width .5s ease; }
[data-theme="dark"] .lvov-status-fill { background: linear-gradient(90deg, #63ab85, #8fd0ae); }
.lvov-tierband { display: flex; gap: 5px; margin-top: 14px; width: 100%; }
.lvov-tier { flex: 1; min-width: 0; overflow: hidden; text-align: center; padding: 7px 3px; border-radius: 10px; background: var(--bg); border: 1px solid var(--border); }
.lvov-tier .t-lv { font-size: 10px; color: var(--text-tertiary); }
.lvov-tier .t-name { font-size: 11px; font-weight: 700; color: var(--text-secondary); margin-top: 2px; white-space: nowrap; }
.lvov-tier.pass { background: rgba(46,107,79,0.12); border-color: rgba(46,107,79,0.35); }
.lvov-tier.cur { background: linear-gradient(180deg, rgba(185,151,91,0.18), rgba(185,151,91,0.3)); border-color: #b9975b; }
.lvov-tier.cur .t-name { color: #8a6420; }
[data-theme="dark"] .lvov-tier.cur .t-name { color: #e0b46f; }
.lvov-grid { display: grid; grid-template-columns: repeat(10, minmax(0, 1fr)); gap: 6px; margin-top: 14px; width: 100%; }
.lvov-cell { position: relative; aspect-ratio: 1; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 3px; border-radius: 9px; background: var(--bg); border: 1px solid var(--border); font-weight: 700; color: var(--text-tertiary); cursor: pointer; transition: transform .12s ease, box-shadow .12s ease; user-select: none; }
.lvov-cell b { font-size: 12px; line-height: 1; }
.lvov-cell .cell-ico { font-size: 11px; line-height: 1; }
.lvov-cell:hover { transform: translateY(-2px); box-shadow: 0 4px 10px rgba(0,0,0,0.16); z-index: 2; }
.lvov-cell.done { background: linear-gradient(180deg, #e8f5ee, #d5ecdf); border-color: #2e6b4f; color: #255a41; }
[data-theme="dark"] .lvov-cell.done { background: linear-gradient(180deg, rgba(99,171,133,0.22), rgba(99,171,133,0.12)); border-color: #63ab85; color: #9fd6b6; }
.lvov-cell.done b { color: #255a41; }
[data-theme="dark"] .lvov-cell.done b { color: #b6e5c8; }
.lvov-cell.tier { border-color: #b9975b; background: linear-gradient(180deg, #faf3e3, #f1e2c3); }
[data-theme="dark"] .lvov-cell.tier { background: linear-gradient(180deg, rgba(185,151,91,0.25), rgba(185,151,91,0.14)); }
.lvov-cell.crown { background: radial-gradient(circle at 50% 30%, #ffe9b8, #f0c56a); border-color: #b9975b; color: #7a5718; }
[data-theme="dark"] .lvov-cell.crown { background: radial-gradient(circle at 50% 30%, #8a6a35, #5f4a22); color: #ffe9b8; }
.lvov-cell.cur { border-color: #b9975b; background: linear-gradient(180deg, rgba(185,151,91,0.22), rgba(185,151,91,0.34)); color: #7a5718; box-shadow: 0 0 0 2px rgba(185,151,91,0.35); animation: lvovPulse 1.4s ease-in-out infinite; }
[data-theme="dark"] .lvov-cell.cur { color: #f0cf93; }
@keyframes lvovPulse { 0%,100% { box-shadow: 0 0 0 2px rgba(185,151,91,0.25); } 50% { box-shadow: 0 0 0 6px rgba(185,151,91,0.5); } }
.lvov-cell .lvov-chk { position: absolute; top: 3px; right: 5px; font-size: 10px; color: #2e9e5b; }
[data-theme="dark"] .lvov-cell .lvov-chk { color: #8fd0ae; }
.lvov-cell.cur .lvov-chk { display: none; }
.lvov-detail { margin-top: 13px; min-height: 26px; font-size: 13px; color: var(--text-secondary); text-align: center; background: var(--bg); border: 1px dashed var(--border); border-radius: 10px; padding: 8px 10px; }
.lvov-detail b { color: var(--primary-dark); }
[data-theme="dark"] .lvov-detail b { color: #7fbf9c; }
.lvov-actions { display: flex; justify-content: center; gap: 10px; margin-top: 14px; flex-wrap: wrap; }
.lvov-act { background: var(--primary); color: #fff; border: none; border-radius: 999px; padding: 9px 18px; font-size: 13px; font-weight: 700; cursor: pointer; transition: filter .15s ease; }
.lvov-act:hover { filter: brightness(1.08); }
.lvov-act:disabled { opacity: 0.45; cursor: not-allowed; }
.lvov-act.ghost { background: transparent; border: 1px solid var(--border); color: var(--text-secondary); }
.lvov-act.ghost:hover { color: var(--text); }
.hero-overview-btn { display:flex; align-items:center; gap:5px; flex-shrink:0; background:#ffffff; border:1px solid rgba(0,0,0,0.12); color:var(--text-secondary); font-size:12px; font-weight:600; padding:8px 12px; border-radius:999px; cursor:pointer; transition:all .15s ease; }
.hero-overview-btn:hover { border-color: #b9975b; color: #8a6420; }
[data-theme="dark"] .hero-overview-btn { background:#292c35; border-color:#3a3f4a; color:#9ca0a6; }
[data-theme="dark"] .hero-overview-btn:hover { border-color:#b9975b; color:#e0b46f; }
@media (max-width: 600px) {
  .lvov-overlay { padding: 10px; }
  .lvov-panel { padding: 14px 12px; border-radius: 14px; }
  .lvov-grid { gap: 3px; }
  .lvov-cell { border-radius: 6px; }
  .lvov-cell b { font-size: 10px; }
  .lvov-cell .cell-ico { font-size: 9px; }
  .lvov-tier .t-lv { font-size: 8px; }
  .lvov-tier .t-name { font-size: 9px; }
  .lvov-tierband { flex-wrap: wrap; }
  .lvov-tier { flex: 1 1 calc(20% - 6px); min-width: 0; }
}


/* ===== 第一批迭代：答题体验 + 复习增强（本地增强） ===== */
.combo-pill {
  display: inline-flex; align-items: center; gap: 3px;
  font-size: 12px; font-weight: 700; color: #b9975b;
  background: rgba(185,149,91,0.12);
  border: 1px solid rgba(185,149,91,0.35);
  padding: 2px 10px; border-radius: 999px;
  margin-left: 8px;
  animation: comboPop .25s ease;
}
.combo-pill.hot { color: #fff; background: #e08628; border-color: #e08628; animation: comboPulse .7s ease infinite; }
@keyframes comboPop { 0% { transform: scale(.6); opacity: 0; } 100% { transform: scale(1); opacity: 1; } }
@keyframes comboPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(224,134,40,.5); }
  50% { box-shadow: 0 0 0 6px rgba(224,134,40,0); }
}
#question-card { position: relative; }
.float-text {
  position: absolute; top: 16%; left: 50%;
  transform: translateX(-50%);
  pointer-events: none; z-index: 30;
  font-size: 20px; font-weight: 800; white-space: nowrap;
  opacity: 0; text-shadow: 0 1px 3px rgba(0,0,0,.12);
}
.float-text.ok { color: #2e9e63; }
.float-text.no { color: #e0503f; }
.float-text.mega { font-size: 30px; }
.float-text.rise { animation: floatRise .95s ease forwards; }
@keyframes floatRise {
  0% { opacity: 0; transform: translateX(-50%) translateY(14px) scale(.9); }
  18% { opacity: 1; transform: translateX(-50%) translateY(0) scale(1.08); }
  32% { transform: translateX(-50%) translateY(-3px) scale(1); }
  72% { opacity: 1; }
  100% { opacity: 0; transform: translateX(-50%) translateY(-56px) scale(.98); }
}
.plan-today {
  margin: 10px 16px 2px;
  padding: 10px 14px;
  border-radius: 10px;
  background: linear-gradient(135deg, rgba(224,134,40,.14), rgba(224,134,40,.04));
  border: 1px solid rgba(224,134,40,.4);
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
}
.plan-today-txt { font-size: 13px; }
.plan-today-txt b { color: #e08628; font-size: 17px; }
.plan-today-btn {
  border: none; cursor: pointer;
  background: #e08628; color: #fff;
  font-size: 12px; font-weight: 700;
  padding: 6px 14px; border-radius: 999px;
  flex-shrink: 0;
}
.plan-today-btn:active { transform: scale(.96); }
.plan-item.mastered { opacity: .45; }
.plan-mastered-tag {
  font-size: 11px; color: #a0803a; margin-left: 6px;
  border: 1px solid rgba(185,149,91,.45); border-radius: 4px; padding: 0 5px;
  vertical-align: middle;
}

    .master-lv-row { display: inline-flex; align-items: center; gap: 6px; flex-shrink: 0; }
    .hero-lv-overview-btn { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; font-weight: 600; color: #2e6b4f; background: #fff; border: 1px solid rgba(46,107,79,0.28); padding: 3px 8px; border-radius: 999px; cursor: pointer; transition: all .15s ease; flex-shrink: 0; }
    .hero-lv-overview-btn:hover { border-color: #b9975b; color: #8a6420; }
    [data-theme="dark"] .hero-lv-overview-btn { background: #292c35; border-color: #3a3f4a; color: #9ca0a6; }
    [data-theme="dark"] .hero-lv-overview-btn:hover { border-color: #b9975b; color: #e0b46a; }
/* ===== 游戏感动画 v6：升级层 / 称号晋升 / 成就浮层 ===== */
#lvup-celebration { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 9999; pointer-events: none; }
#lvup-celebration .lvup-dim { position: fixed; inset: 0; background: rgba(0,0,0,0.55); opacity: 0; transition: opacity .35s ease; z-index: 0; pointer-events: auto; cursor: pointer; }
#lvup-celebration.show .lvup-dim { opacity: 1; }
#lvup-celebration .lvup-card { position: relative; z-index: 1; pointer-events: auto; text-align: center; background: var(--card-bg,#ffffff); border: 1px solid var(--border,#e6e2d8); border-radius: 20px; padding: 28px 44px 24px; min-width: 252px; box-shadow: 0 18px 60px rgba(0,0,0,0.28); transform: scale(.82) translateY(16px); opacity: 0; transition: transform .5s cubic-bezier(.2,.9,.25,1.18), opacity .35s ease; overflow: hidden; }
#lvup-celebration.show .lvup-card { transform: scale(1) translateY(0); opacity: 1; }
#lvup-celebration.tier .lvup-card { border-color: rgba(185,151,91,0.65); background: linear-gradient(160deg,#fffdf6,#fff6e3); }
[data-theme="dark"] #lvup-celebration .lvup-card { background: #23262c; border-color: #3a3f48; }
[data-theme="dark"] #lvup-celebration.tier .lvup-card { background: linear-gradient(160deg,#2a2419,#221d12); border-color: rgba(185,151,91,0.55); }
.lvup-emoji { font-size: 58px; line-height: 1.1; }
.lvup-tag { display: inline-block; font-size: 11px; font-weight: 800; letter-spacing: 2px; color: #b9975b; background: rgba(185,151,91,0.14); padding: 3px 12px; border-radius: 999px; margin-top: 10px; }
.lvup-lv { font-size: 44px; font-weight: 900; line-height: 1.1; color: var(--primary-dark,#2e6b4f); margin-top: 6px; }
[data-theme="dark"] .lvup-lv { color: #7fbf9c; }
.lvup-title { font-size: 24px; font-weight: 900; color: var(--primary-dark,#2e6b4f); margin-top: 4px; }
[data-theme="dark"] .lvup-title { color: #7fbf9c; }
.lvup-sub { font-size: 14px; font-weight: 600; color: var(--text-secondary,#5a6b60); margin-top: 6px; }
.lvup-hint { font-size: 11px; color: var(--text-tertiary,#8a968c); margin-top: 14px; letter-spacing: 1px; }
/* 金色扩散圆 */
.lvup-ring { position: fixed; left: 50%; top: 50%; width: 120px; height: 120px; margin: -60px 0 0 -60px; border-radius: 50%; border: 3px solid rgba(185,151,91,0.85); opacity: 0; z-index: 1; pointer-events: none; }
#lvup-celebration.show .lvup-ring { animation: lvup-ring 1s ease-out .1s 2; }
@keyframes lvup-ring { 0% { transform: scale(.2); opacity: .9; } 100% { transform: scale(9); opacity: 0; } }
/* 称号晋升：金色飘带粒子 */
.lvup-fp { position: fixed; width: 10px; height: 12px; border-radius: 3px; background: linear-gradient(135deg,#ffd87a,#b9975b); opacity: 0; z-index: 2; pointer-events: none; }
#lvup-celebration.tier.show .lvup-fp { animation: lvup-fp 1.5s ease-out forwards; }
@keyframes lvup-fp { 0% { transform: translate(0,0) rotate(0) scale(1); opacity: 1; } 100% { transform: translate(var(--pa),0) translateY(120px) rotate(340deg) scale(.4); opacity: 0; } }
/* 成就解锁浮层（右下角，不遮挡答题区） */
#ach-badge { position: fixed; right: 16px; bottom: 18px; z-index: 9996; opacity: 0; transform: translateX(26px) scale(.92); pointer-events: none; }
#ach-badge.show { animation: ach-pop .5s cubic-bezier(.2,.9,.3,1.25) forwards, ach-wob .7s ease .4s 1, ach-out .4s ease 2.3s forwards; }
#ach-badge .ab-card { display: flex; gap: 11px; align-items: center; background: #fff; border: 1px solid rgba(185,151,91,0.55); border-radius: 14px; padding: 10px 14px; box-shadow: 0 10px 30px rgba(0,0,0,0.18); }
[data-theme="dark"] #ach-badge .ab-card { background: #262a31; border-color: rgba(185,151,91,0.5); }
#ach-badge .ab-icon { font-size: 30px; line-height: 1.1; }
#ach-badge .ab-body { min-width: 148px; text-align: left; }
#ach-badge .ab-tag { font-size: 10px; font-weight: 800; letter-spacing: 1px; color: #b9975b; }
#ach-badge .ab-title { font-size: 15px; font-weight: 800; color: #2b2b23; margin-top: 2px; }
#ach-badge .ab-cond { font-size: 11px; color: #5a6b60; margin-top: 1px; }
[data-theme="dark"] #ach-badge .ab-title { color: #d8dcdf; }
[data-theme="dark"] #ach-badge .ab-cond { color: #9aa0a6; }
@keyframes ach-pop { 0% { opacity: 0; transform: translateX(26px) scale(.92); } 100% { opacity: 1; transform: translateX(0) scale(1); } }
@keyframes ach-wob { 0%,100% { transform: rotate(0); } 25% { transform: rotate(-2.5deg); } 50% { transform: rotate(2.5deg); } 75% { transform: rotate(-1.5deg); } }
@keyframes ach-out { to { opacity: 0; transform: translateY(10px); } }
/* reduce-motion 降级 */
@media (prefers-reduced-motion: reduce) {
  #lvup-celebration.show .lvup-ring, #lvup-celebration.tier.show .lvup-fp { animation: none; opacity: 0; }
  #lvup-celebration .lvup-card { transition: opacity .15s ease; }
  #ach-badge.show { animation: none; opacity: 1; transform: none; }
  .hero-ring.ring-epic { animation: none; box-shadow: 0 0 0 6px rgba(245,183,60,0.25); }
  .ring-spark { display: none; }
}
/* 移动端适配 */
@media (max-width: 480px) {
  #lvup-celebration .lvup-card { padding: 22px 26px 20px; min-width: 0; width: 84vw; }
  .lvup-lv { font-size: 38px; }
  #ach-badge { right: 10px; bottom: 12px; left: 10px; }
  #ach-badge .ab-card { justify-content: flex-start; }
}

/* ===== 六功能迭代：统计面板 / 热力图 / 雷达图 / 补漏卷 / 易混练习 ===== */
.stats-panel { background: var(--card-bg); border: 1px solid var(--border); border-radius: 14px; padding: 16px; margin-top: 14px; }
.stats-panel-title { font-size: 15px; font-weight: 700; color: var(--text); margin-bottom: 12px; display: flex; align-items: center; justify-content: space-between; gap: 8px; line-height: 1.5; }
.stats-panel-title .sp-sub { font-size: 12px; color: var(--text-tertiary); font-weight: 400; }
.heatmap-wrap { overflow-x: auto; padding-bottom: 4px; }
.hm-cell { width: 12px; height: 12px; border-radius: 3px; }
.hm-level0 { background: #e9ecef; }
.hm-level1 { background: #b7e4c7; }
.hm-level2 { background: #74c69d; }
.hm-level3 { background: #2d9e5f; }
.hm-level4 { background: #176b3c; }
[data-theme="dark"] .hm-level0 { background: #2a2d35; }
.hm-today { outline: 2px solid var(--primary); outline-offset: 1px; }
.radar-wrap { display: flex; justify-content: center; overflow-x: auto; }
.mix-practice-btn { margin-left: 8px; flex: none; padding: 6px 14px; border: none; border-radius: 999px; background: var(--primary); color: #fff; font-size: 12.5px; font-weight: 700; cursor: pointer; }
.mix-practice-btn:hover { filter: brightness(1.08); }
/* 补漏卷打印预览 */
#patch-paper { position: fixed; left: 0; top: 0; right: 0; bottom: 0; z-index: 99999; background: #fff; color: #222; overflow: auto; padding: 20px; box-sizing: border-box; font-size: 14px; line-height: 1.7; }
#patch-paper .pp-toolbar { position: sticky; top: 0; z-index: 3; display: flex; align-items: center; gap: 10px; padding: 10px 14px; background: #f4f5f7; border: 1px solid #e2e4e8; border-radius: 10px; margin-bottom: 18px; }
#patch-paper .pp-toolbar .pp-title { flex: 1; font-weight: 800; font-size: 15px; color: #222; }
#patch-paper .pp-toolbar button { border: none; border-radius: 8px; padding: 8px 16px; font-size: 13px; font-weight: 700; cursor: pointer; }
#patch-paper .pp-print-btn { background: #2e7d4f; color: #fff; }
#patch-paper .pp-close-btn { background: #ececec; color: #333; }
#patch-paper h1 { font-size: 20px; text-align: center; margin: 6px 0 4px; color: #111; }
#patch-paper .pp-sub { text-align: center; color: #666; font-size: 12.5px; margin-bottom: 18px; }
#patch-paper .pp-body { max-width: 760px; margin: 0 auto; }
#patch-paper .pp-q { page-break-inside: avoid; margin-bottom: 16px; }
#patch-paper .pp-q-no { font-weight: 700; color: #111; }
#patch-paper .pp-q-type { color: #2e7d4f; font-weight: 600; }
#patch-paper .pp-opts { margin: 6px 0 0 22px; padding: 0; list-style: none; }
#patch-paper .pp-opts li { padding: 2px 0; color: #333; }
#patch-paper .pp-sep { text-align: center; color: #999; font-size: 12px; margin: 26px 0; letter-spacing: 2px; }
#patch-paper .pp-ans { width: 100%; border-collapse: collapse; margin-top: 10px; }
#patch-paper .pp-ans th, #patch-paper .pp-ans td { border: 1px solid #ccc; padding: 6px 10px; text-align: center; font-size: 13px; }
#patch-paper .pp-ans th { background: #f0f1f3; font-weight: 700; }
#patch-paper .pp-ana { page-break-inside: avoid; margin-bottom: 12px; padding-bottom: 8px; border-bottom: 1px dashed #ddd; }
#patch-paper .pp-ana-head { font-weight: 700; color: #111; }
#patch-paper .pp-ana-text { color: #555; margin-top: 4px; }
@media print {
  body * { visibility: hidden !important; }
  #patch-paper, #patch-paper * { visibility: visible !important; }
  #patch-paper { position: absolute; left: 0; top: 0; width: 100%; height: auto; overflow: visible; padding: 0 40px; }
  #patch-paper .pp-toolbar { display: none !important; }
  #patch-paper .pp-sep { page-break-before: always; }
}

/* === 整体视觉升级 v1 === */
/* 按钮交互反馈 */
.btn-primary,.btn-secondary,.btn-danger,.btn-nav,.btn-nav-action,.btn-nav-target,.btn-collect,.btn-learned,.btn-uncollect,.btn-back-wrong,.btn-remove-review{transition:filter .12s ease,transform .12s ease,box-shadow .12s ease;}
.btn-primary:hover,.btn-secondary:hover,.btn-danger:hover,.btn-nav:hover,.btn-nav-action:hover{filter:brightness(1.07);}
.btn-primary:active,.btn-secondary:active,.btn-danger:active,.btn-nav:active,.btn-nav-action:active{transform:scale(.97);}
.btn-primary:disabled,.btn-primary.disabled{opacity:.45;pointer-events:none;}
/* 答题卡（电脑端已回退旧版紧凑布局，保留字号与加粗） */
.exam-sheet-num,#practice-sheet-grid .exam-sheet-num{height:38px;font-size:13px;font-weight:600;border-radius:6px;}
/* 统计/图表标签字号归齐 */
.board-stat span{font-size:12px;margin-top:3px;}
.trend-delta{font-size:12px;}
.ring-label{font-size:11px;margin-top:4px;}
.history-item-score small{font-size:11px;}
.plan-group-arrow{font-size:11px;}
.trend-week{font-size:11px;}
.trend-day{font-size:10px;}
.today-badge{font-size:10px;padding:2px 6px;border-radius:4px;}
/* 首页图标底统一为浅绿 */
.feature-icon{background:var(--primary-light);}
[data-theme="dark"] .feature-icon{background:rgba(46,107,79,0.12)!important;}
/* 分组标题层次 */
.group-title{font-size:15px;letter-spacing:.3px;}
.settings-item-name{font-weight:600;}
/* 弹窗统一圆角与留白 */
.modal-overlay .modal-content{border-radius:20px;max-width:min(92vw,400px);}
.modal-title{font-weight:700;}

/* ===== 第二轮移动端体验修复 (2026-10-12) ===== */
/* --- 1. 首页：精简非核心、按钮醒目、文字加深 --- */
@media (max-width:767px){
  .hero-lv-overview-btn { display: none; }
  .goal-adj-btn { width: 26px; height: 26px; font-size: 13px; opacity: .7; }
  .hero-text p { opacity: .92; color: var(--text); }
  .hero-actions { gap: 10px; margin-top: 12px; }
  .hero-due-btn, .hero-history-btn { flex: 1; justify-content: center; padding: 12px 10px; font-size: 14px; border-radius: 12px; }
  .header-stats { gap: 8px; }
  .header-stat { padding: 6px 10px; }
  .header-stat-num { font-size: 18px; }
  .header-stat-label { font-size: 10px; opacity: .88; }
}
.hero-text h3 { color: var(--text); }
.hero-text p { color: var(--text); opacity: .9; }
[data-theme="dark"] .hero-text p { color: #c8ccd2; opacity: .92; }
@media (min-width:768px){
  .hero-due-btn, .hero-history-btn { font-size: 15px; padding: 10px 18px; border-radius: 12px; }
  .feature-group:first-of-type .feature-item { border-color: color-mix(in srgb, var(--primary) 50%, transparent); box-shadow: 0 4px 14px rgba(45,106,79,.14); background: color-mix(in srgb, var(--primary) 4%, #fff); }
  [data-theme="dark"] .feature-group:first-of-type .feature-item { background: color-mix(in srgb, var(--primary) 10%, #1a1d23); }
  .feature-group:first-of-type .feature-icon { width: 52px; height: 52px; font-size: 24px; }
}
/* --- 2. 做题页：答题卡收起 --- */
.practice-sheet-panel.sheet-collapsed .exam-sheet-grid { display: none; }
.sheet-toggle { margin-left: 10px; cursor: pointer; font-size: 12px; font-weight: 600; color: var(--primary); background: var(--primary-light); border-radius: 999px; padding: 4px 10px; user-select: none; white-space: nowrap; }
[data-theme="dark"] .sheet-toggle { color: #8fd0ae; background: color-mix(in srgb, var(--primary) 22%, #242730); }
@media (min-width:768px){ .sheet-toggle { display: none; } }
/* --- 3. 模拟考试：交卷高亮、下一题降级、倒计时加大 --- */
#page-exam .ctrl-btn-submit { background: linear-gradient(135deg, var(--primary), var(--primary-dark)) !important; border-color: var(--primary-dark) !important; box-shadow: 0 4px 14px rgba(45,106,79,.35) !important; font-size: 16px; }
#page-exam .ctrl-btn-next { background: #fff !important; border: 1px solid var(--border) !important; color: var(--text-secondary) !important; box-shadow: none !important; }
[data-theme="dark"] #page-exam .ctrl-btn-next { background: #242730 !important; border-color: #3a3f4a !important; color: #c8ccd2 !important; }
#page-exam .practice-top { gap: 10px; }
#page-exam .exam-timer { font-size: 26px; font-weight: 800; letter-spacing: .5px; }
@media (max-width:767px){ #page-exam .exam-timer { font-size: 24px; } }
#page-exam .progress-text, #page-exam .practice-remain { font-size: 13px; }
/* --- 4. 统计页：色条与空状态引导 --- */
.accuracy-row { margin-bottom: 10px; }
.accuracy-label { font-weight: 700; }
.accuracy-track { height: 10px; border-radius: 6px; }
.accuracy-fill { border-radius: 6px; }
.accuracy-value { font-weight: 700; font-size: 15px; }
.stats-empty-guide { background: color-mix(in srgb, var(--primary) 8%, #fff); border: 1px dashed color-mix(in srgb, var(--primary) 45%, transparent); border-radius: 12px; padding: 16px; margin-bottom: 12px; text-align: center; font-size: 14px; color: var(--text); line-height: 1.8; }
.stats-empty-guide span { font-size: 12px; color: var(--text-secondary); }
[data-theme="dark"] .stats-empty-guide { background: color-mix(in srgb, var(--primary) 10%, #1a1d23); }
/* --- 5. 错题本：折叠次要筛选 --- */
.wrong-more-btn { height: 32px; padding: 0 12px; font-size: 12px; border: 1px solid var(--border); border-radius: 999px; background: var(--bg); color: var(--text-secondary); cursor: pointer; white-space: nowrap; }
.wrong-more-btn.on { color: var(--primary); border-color: color-mix(in srgb, var(--primary) 55%, transparent); background: var(--primary-light); }
.wrong-more-row { display: none; flex-wrap: wrap; gap: 8px; padding: 10px 16px; background: var(--bg-card); border-bottom: 1px solid var(--border); }
.wrong-more-row.open { display: flex; }
.wrong-more-row .wrong-filter-select { flex: 1; min-width: 0; }
/* --- 6. 编辑详解页：隐藏 Ctrl 提示（仅桌面）、危险按钮样式 --- */
.danger-confirm-btn { display: inline-flex; align-items: center; gap: 4px; padding: 4px 10px; border: 1px solid color-mix(in srgb, var(--danger) 55%, transparent); background: color-mix(in srgb, var(--danger) 8%, #fff); color: var(--danger); border-radius: 8px; font-weight: 600; cursor: pointer; }
[data-theme="dark"] .danger-confirm-btn { background: color-mix(in srgb, var(--danger) 14%, #1a1d23); }
/* --- 7. 管理详解页：数据概览 --- */
.em-overview { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-bottom: 12px; }
.em-ov-item { background: color-mix(in srgb, var(--primary) 7%, #fff); border: 1px solid color-mix(in srgb, var(--primary) 28%, transparent); border-radius: 10px; padding: 10px 6px; text-align: center; }
[data-theme="dark"] .em-ov-item { background: color-mix(in srgb, var(--primary) 12%, #1a1d23); }
.em-ov-item b { display: block; font-size: 18px; color: var(--primary-dark); }
[data-theme="dark"] .em-ov-item b { color: #8fd0ae; }
.em-ov-item span { font-size: 11px; color: var(--text-secondary); }
/* --- 8. 数字题抽屉：X 缩小、截断修复、选中态主色 --- */
#num-modal-content .scope-modal-close { width: 24px; height: 24px; font-size: 11px; line-height: 24px; }
#num-modal-content .scope-modal-list { max-height: calc(78vh - 190px); }
#num-modal-content .scope-modal-item { padding: 10px 12px; }
#scope-modal-content .scope-modal-item.active { background: var(--primary-light); box-shadow: inset 3px 0 0 var(--primary); }
#scope-modal-content .scope-modal-item.active .scope-modal-item-name { color: var(--primary-dark); }
[data-theme="dark"] #scope-modal-content .scope-modal-item.active { background: #2a2d35; }
[data-theme="dark"] #scope-modal-content .scope-modal-item.active .scope-modal-item-name { color: #8fd0ae; }
/* --- 9. 桌面端做题/模考：间距收窄、题目区留白、按钮层级 --- */
@media (min-width:768px){
  #page-practice .practice-body, #page-exam .practice-body { gap: 16px; padding: 0 20px 20px; }
  #page-practice .practice-left, #page-exam .practice-left { flex: 2.1; }
  #page-practice .practice-right { flex: 0 0 380px; max-width: 380px; }
  #page-practice .question-card, #page-exam .question-card { padding: 24px 28px; }
  #page-practice .analysis-card, #page-exam .analysis-card { border-left: 3px solid var(--primary); padding: 14px 18px; }
  #page-practice .analysis-card .analysis-title, #page-exam .analysis-card .analysis-title { font-size: 15px; font-weight: 800; }
}
/* --- 10. 修复：做题页底部导航隐藏（transform 动画插值会残留可见，改用 display 彻底隐藏） --- */
@media (max-width:768px){
  body:has(#page-practice.active) .bottom-nav,
  body:has(#page-exam.active) .bottom-nav { display: none !important; }
}

/* ===== 第三轮移动端布局修复（答题卡 / 编辑详解页 / 管理详解页） ===== */
/* 1) 二级页返回按钮：恢复圆形半透明+白字（覆盖文本按钮弱化误伤） */
.subpage-back { background: rgba(255,255,255,.22) !important; border: 1px solid rgba(255,255,255,.4) !important; color: #fff !important; box-shadow: none !important; }
.subpage-back:hover { background: rgba(255,255,255,.34) !important; }
[data-theme="dark"] .subpage-back { background: rgba(255,255,255,.16) !important; border-color: rgba(255,255,255,.3) !important; color: #fff !important; }
/* 2) 顺序练习页：移动端答题卡独立占满整行、数字格不挤、高度自适应、不与题目重叠 */
@media (max-width:767px){
  #page-practice .practice-body { flex-direction: column !important; }
  #page-practice .practice-right { width: 100% !important; flex: none !important; display: block !important; }
  #page-practice .practice-sheet-panel { position: static !important; top: auto !important; }
  #page-practice .practice-sheet-panel:not(.sheet-collapsed) { max-height: 44vh; overflow-y: auto; }
  #practice-sheet-grid { grid-template-columns: repeat(6, 1fr) !important; gap: 4px; }
  #practice-sheet-grid .exam-sheet-num { height: 34px; font-size: 11px; }
  .practice-sheet-panel.sheet-collapsed { padding: 10px 12px; }
  .practice-sheet-panel.sheet-collapsed .sheet-header { margin-bottom: 0; padding-bottom: 0; border-bottom: none; }
}
/* 3) 编辑详解页：工具栏放大、底部操作区固定吸底、footer 分行 */
@media (max-width:767px){
  #page-explain-editor .ed-tb { min-width: 40px; height: 36px; font-size: 15px; padding: 0 12px; border-radius: 8px; }
  #page-explain-editor .ed-tb-sep { height: 24px; }
  #page-explain-editor .ed-action-bar { position: fixed; bottom: 0; left: 0; right: 0; z-index: 30; margin: 0; padding: 10px 14px calc(10px + env(safe-area-inset-bottom, 0px)); background: var(--bg, #f5f5f5); border-top: 1px solid var(--border); box-shadow: 0 -4px 14px rgba(0,0,0,.06); }
  #page-explain-editor .ed-action-bar ~ div { padding-bottom: 84px; }
  #page-explain-editor .ed-action-bar .btn-primary { flex: 1; height: 42px; padding: 0 12px; font-size: 15px; }
  #page-explain-editor .ed-action-bar .btn-secondary { height: 42px; padding: 0 14px; font-size: 14px; }
  #page-explain-editor .ed-action-bar .ed-btn-cancel { height: 42px; padding: 0 12px; font-size: 14px; }
  #page-explain-editor .ed-footer { align-items: flex-start; }
  #page-explain-editor .ed-footer-right { margin-left: 0; width: 100%; justify-content: space-between; }
}
/* 4) 管理详解页：统计卡2列、搜索行自适应、题干截断、按钮明显、统一间距 */
.em-item { border: 1px solid #ccd3db; border-left: 4px solid var(--primary, #2d6a4f); border-radius: 10px; padding: 10px 12px; background: var(--bg-card); box-shadow: 0 1px 3px rgba(0,0,0,.05); }
[data-theme="dark"] .em-item { border-color: #3a4150; border-left-color: #57a67c; }
.em-q-content { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.em-q-preview { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.em-view-full { background: var(--primary) !important; border-color: var(--primary) !important; color: #fff !important; padding: 7px 14px !important; font-size: 13px !important; border-radius: 8px; font-weight: 600; }
@media (max-width:767px){
  #page-explain-manager .em-overview { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  #page-explain-manager .em-ov-item { padding: 12px 8px; }
  #page-explain-manager .em-ov-item b { font-size: 20px; }
  #page-explain-manager .em-ov-item span { font-size: 12px; }
  #page-explain-manager .em-search-row { gap: 8px; }
  #page-explain-manager .em-search { flex: 1 1 100%; min-width: 0; }
  #page-explain-manager .em-count { flex: 1 1 100%; white-space: normal; }
  #page-explain-manager .em-actions .btn-primary { flex: 1 1 calc(50% - 5px); height: 42px; padding: 0 10px; font-size: 14px; }
  #page-explain-manager #em-list { gap: 8px; }
  #page-explain-manager .em-view-full { flex: 1; }
}

/* ===== 第四轮 桌面端人性化专项修复（1280px 视口优化；移动端≤767px 布局不回退）(2026-10-12) ===== */

/* --- A. 做题/模考页答题卡：桌面端已回退旧版紧凑布局（网格 38px auto-fill / 格高36px / 面板 sticky+calc(100vh-130px)），42px 覆盖已移除 --- */

/* --- B. 编辑试题详解页：返回按钮 / 工具栏 / 底部按钮 --- */
@media (min-width: 768px) {
  #page-explain-editor .subpage-back,
  #page-explain-manager .subpage-back {
    width: 44px;
    height: 44px;
    font-size: 22px;
    border-radius: 50%;
    background: rgba(255,255,255,0.24);
    border: 1px solid rgba(255,255,255,0.45);
  }
  #page-explain-editor .ed-tb {
    min-width: 30px;
    height: 28px;
    font-size: 13px;
    padding: 0 7px;
    border-radius: 6px;
  }
  #page-explain-editor .ed-tb-sep { height: 18px; margin: 0 4px; }
  #page-explain-editor .ed-action-bar {
    margin-top: 18px !important;
    gap: 12px !important;
    padding: 14px 16px !important;
    background: var(--card-bg) !important;
    border: 1px solid var(--border) !important;
    border-radius: 12px !important;
  }
  #page-explain-editor .ed-action-bar .btn-primary { height: 42px; padding: 0 22px; font-size: 15px; }
  #page-explain-editor .ed-action-bar .btn-secondary { height: 42px; padding: 0 18px; font-size: 14px; }
  #page-explain-editor .ed-action-bar .ed-btn-cancel { height: 42px; padding: 0 14px; font-size: 14px; }
  #page-explain-editor .danger-confirm-btn { padding: 8px 14px; font-size: 13px; }
}

/* --- C. 试题详解管理页：统计卡 / 搜索行 / 列表 / 留白 --- */
@media (min-width: 768px) {
  #page-explain-manager .em-overview { grid-template-columns: repeat(4, 1fr); gap: 8px; margin-bottom: 10px; }
  #page-explain-manager .em-ov-item { padding: 8px 6px; border-radius: 10px; }
  #page-explain-manager .em-ov-item b { font-size: 18px; margin-bottom: 0; }
  #page-explain-manager .em-ov-item span { font-size: 11px; }
  #page-explain-manager .em-ov-hot { background: color-mix(in srgb, var(--primary) 14%, #fff); border-color: var(--primary); }
  #page-explain-manager .em-search-row { gap: 12px !important; }
  #page-explain-manager .em-search { flex: 1 1 280px; min-width: 220px; padding: 10px 14px; font-size: 14px; }
  #page-explain-manager .em-count { font-size: 14px; }
  #page-explain-manager .em-actions { gap: 12px; margin-top: 14px; }
  #page-explain-manager .em-actions .btn-primary { width: auto; height: 40px; flex: 0 1 auto; min-width: 150px; padding: 0 24px; font-size: 14px; }
  #page-explain-manager #em-list { gap: 8px !important; padding-right: 4px; }
  #page-explain-manager .em-item { padding: 9px 14px; border-radius: 10px; }
  #page-explain-manager .em-q-content { font-size: 13px; line-height: 1.55; -webkit-line-clamp: 2; }
  #page-explain-manager .em-q-preview { font-size: 12px; line-height: 1.5; -webkit-line-clamp: 2; }
  #page-explain-manager .em-view-full { padding: 6px 14px !important; font-size: 12px !important; }
  #page-explain-manager .btn-secondary { padding: 6px 12px; font-size: 12px; }
#page-explain-manager .em-item .btn-secondary, #page-explain-manager .em-item .em-view-full { width: auto; height: 28px; padding: 0 12px; border-radius: 14px; margin-top: 0; display: inline-flex; align-items: center; }
}

/* --- 全站桌面端巡检增强：留白 / 卡片 / 弹窗宽度 / hover 反馈 --- */
@media (min-width: 768px) {
  .header { padding: 28px 32px 26px; }
  .hero-banner { padding: 26px 30px; }
  .feature-grid { gap: 14px; }
  .feature-item { padding: 18px 16px; border-radius: 14px; }
  .feature-item:hover { box-shadow: var(--shadow); transform: translateY(-1px); }
  .weak-item:hover,
  .history-item:hover,
  .kd-item:hover { border-color: color-mix(in srgb, var(--primary) 40%, var(--border)); box-shadow: var(--shadow); }
  #num-modal-content, #trap-modal-content, #mix-modal-content,
  #memorize-modal-content, #scope-modal-content { max-width: 680px; }
  .modal-overlay .modal-content { max-width: min(92vw, 560px); }
}
/* ===== 2026-10 做题页桌面端上下同屏：题干+选项在上，解析在下方，视口内同时可见 ===== */
@media (min-width:768px) {
#page-practice.active .practice-body {
  height: calc(100vh - 150px);
  max-height: calc(100vh - 150px);
  overflow: hidden;
}
#page-practice.active .practice-left {
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
#page-practice.active .question-card {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
}
#page-practice.active .analysis-card {
  flex: 0 0 auto;
  max-height: 48%;
  min-height: 96px;
  overflow-y: auto;
  overflow-x: hidden;
  margin-top: 12px;
}
#page-practice.active .keyboard-hint {
  flex: none;
  margin-top: 8px;
}
#page-practice.active .practice-right {
  height: 100%;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
}
#page-practice.active .practice-sheet-panel {
  position: static;
  max-height: none;
  min-height: 150px;
}
}

/* ===== 2026-10 做题页桌面端顶部+解析区精简：顶部高度-30%、解析区-25% ===== */
@media (min-width:768px) {
  /* --- 顶部区域精简：路径一行短、统计一行、标题按钮收紧 --- */
  #page-practice.active .practice-header { padding: 6px 20px 4px; }
  #page-practice.active .breadcrumb-nav {
    font-size: 11px;
    padding: 1px 0 3px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
  }
  #page-practice.active .practice-top { margin-bottom: 2px; }
  #page-practice.active .practice-title { font-size: 15px; }
  #page-practice.active .scope-switcher { font-size: 12px; padding: 2px 8px; }
  #page-practice.active .btn-collect { font-size: 12px; padding: 3px 10px 3px 26px; min-width: 74px; }
  #page-practice.active .progress-bar { height: 3px; margin: 2px 0; }
  /* 统计信息条合并为一行：4/963 · 答对4 · 答错0 · 100% */
  #page-practice.active .practice-topline {
    gap: 8px;
    padding: 3px 20px 2px;
    font-size: 12px;
    flex-wrap: nowrap;
  }
  #page-practice.active .practice-topline .practice-topline-stats { order: 2; gap: 0; flex-wrap: nowrap; }
  #page-practice.active .practice-topline-stats span { font-size: 12px; }
  #page-practice.active .practice-topline-stats span + span::before { content: "·"; margin: 0 6px; color: #bbb; }
  #page-practice.active .practice-topline .progress-text { order: 1; font-size: 12px; font-weight: 700; margin: 0; }
  #page-practice.active .practice-remain { display: none; }
  /* 同屏 body 高度随顶部收矮同步减小 */
  #page-practice.active .practice-body { height: calc(100vh - 108px); max-height: calc(100vh - 108px); }

  /* --- 答案+解析区域精简：正确行与标题合并一行、按钮移至正文末尾、行高内边距收紧 --- */
  #page-practice.active .analysis-card {
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: 10px;
    padding: 10px 16px;
    margin-top: 8px;
  }
  #page-practice.active .analysis-card > .analysis-correct {
    display: inline;
    font-size: 14px;
    margin: 0;
    padding: 0;
    border-bottom: none;
    align-self: center;
  }
  #page-practice.active .analysis-card > .analysis-title {
    display: inline;
    font-size: 14px;
    font-weight: 700;
    margin: 0;
    justify-content: flex-start;
    align-self: center;
  }
  #page-practice.active .analysis-card > .analysis-text {
    grid-column: 1 / -1;
    font-size: 17px;
    line-height: 1.7;
    margin-top: 6px;
  }
  #page-practice.active .analysis-card > .analysis-actions {
    grid-column: 1 / -1;
    display: flex;
    justify-content: flex-end;
    gap: 6px;
    margin-top: 6px;
  }
  #page-practice.active .analysis-actions .analysis-edit-btn {
    margin-left: 0;
    font-size: 11px;
    padding: 2px 10px;
  }
}


/* Mobile practice font tuning: question smaller, analysis larger (768px below only) */
@media (max-width:767px) {
  #page-practice .q-content { font-size: 18px; }
  #page-practice .q-option { font-size: 17px; }
  #page-practice .analysis-text { font-size: 17px; line-height: 1.7; }
}
/* ===== 2026-11 答题页按钮栏：模拟考试样式统一（右对齐 + 上一题→下一题→不确定 + 交卷置顶） ===== */
/* 顶部交卷按钮（倒计时旁，桌面 40px / 移动 32px） */
#page-exam .practice-top .btn-exam-top-submit {
  flex: 0 0 auto;
  height: 40px;
  padding: 0 16px;
  border-radius: 12px;
  background: var(--primary);
  color: #fff;
  border: 1px solid var(--primary);
  font-size: 15px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  cursor: pointer;
  transition: all .2s;
}
#page-exam .practice-top .btn-exam-top-submit:hover { background: var(--primary-dark); }
[data-theme="dark"] #page-exam .practice-top .btn-exam-top-submit { background: linear-gradient(135deg, #ffd37b, #f2b33d); color: #3a2404; border-color: transparent; }
@media (max-width: 768px) {
  #page-exam .practice-top .btn-exam-top-submit { height: 32px; padding: 0 10px; font-size: 13px; border-radius: 9px; }
}
/* 底部按钮栏右对齐 + 按钮加宽（仅桌面端，移动端维持 flex 等分） */
@media (min-width: 769px) {
  #page-practice.active .practice-controls,
  #page-exam.active .practice-controls { justify-content: flex-end; }
  #page-practice.active .practice-controls .ctrl-btn,
  #page-exam.active .practice-controls .ctrl-btn {
    flex: 0 0 auto;
    max-width: none;
    min-width: 150px;
    height: 46px;
    padding: 0 20px;
    border-radius: 12px;
    font-size: 16px;
  }
}
/* 不确定按钮（次级按钮样式 + 激活态） */
.ctrl-btn-mark { background: #f5f5f5; color: #333; border-color: #d9d9d9; }
.ctrl-btn-mark:hover:not(.disabled) { background: #e8e8e8; }
.ctrl-btn-mark.mark-on { background: var(--primary-light); color: var(--primary-dark); border-color: var(--primary); font-weight: 700; }
[data-theme="dark"] .ctrl-btn-mark { background: #242730; color: #c8ccd2; border-color: #2d3038; }
[data-theme="dark"] .ctrl-btn-mark:hover:not(.disabled) { background: #2d3038; }
[data-theme="dark"] .ctrl-btn-mark.mark-on { background: color-mix(in srgb, var(--primary) 18%, #1a1d23); color: #8fd0ae; border-color: #57a67c; }
/* 考试页下一题恢复主色（覆盖旧"交卷高亮、下一题降级"规则） */
#page-exam .ctrl-btn-next { background: var(--primary) !important; border-color: var(--primary) !important; color: #fff !important; box-shadow: none !important; }
[data-theme="dark"] #page-exam .ctrl-btn-next { background: #35c98f !important; border-color: #35c98f !important; color: #1a1d23 !important; }

/* ===== 多选题交互与选中态改版（2026-11-02，参考测试版选中态与对错反馈） ===== */
/* 选项卡片统一：圆角描边，保持主站偏大字号 */
#page-practice .q-option,
#page-exam .q-option {
  border-radius: 12px !important;
  border: 1.5px solid rgba(0, 0, 0, 0.07) !important;
  transition: all .16s ease !important;
}
[data-theme="dark"] #page-practice .q-option,
[data-theme="dark"] #page-exam .q-option {
  border-color: #2d3038 !important;
}
/* hover 主色提示 */
#page-practice .q-option:hover:not(.disabled):not(.correct):not(.wrong),
#page-exam .q-option:hover:not(.disabled):not(.correct):not(.wrong) {
  border-color: color-mix(in srgb, var(--primary) 55%, transparent) !important;
  background: color-mix(in srgb, var(--primary) 5%, #ffffff) !important;
}
/* 选中态：更饱和主色底 + 2px 加粗主色边框 + 外圈光晕 + 圆点内嵌白色对勾 */
#page-practice .q-option.selected:not(.correct):not(.wrong),
#page-exam .q-option.selected:not(.correct):not(.wrong) {
  background: color-mix(in srgb, var(--primary) 17%, #ffffff) !important;
  border: 2px solid var(--primary) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 22%, transparent) !important;
}
#page-practice .q-option.selected:not(.correct):not(.wrong)::before,
#page-exam .q-option.selected:not(.correct):not(.wrong)::before {
  width: 18px !important;
  height: 18px !important;
  border: 2px solid var(--primary) !important;
  background: var(--primary) !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M13.3 3.3L6 10.6 2.7 7.3 4 6l2 2 6-6 1.3 1.3z' fill='%23fff'/%3E%3C/svg%3E") !important;
  background-size: 13px !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}
[data-theme="dark"] #page-practice .q-option.selected:not(.correct):not(.wrong),
[data-theme="dark"] #page-exam .q-option.selected:not(.correct):not(.wrong) {
  background: color-mix(in srgb, var(--primary) 20%, #242730) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 22%, transparent) !important;
}
/* 确认答案后：温和对错反馈（浅绿底深绿字+勾 / 浅红底深红字+叉，保留勾叉图标，克制不刺眼，桌面+移动端同效） */
html:not([data-theme="dark"]) #page-practice .q-option.correct,
html:not([data-theme="dark"]) #page-exam .q-option.correct {
  background: var(--success-bg) !important;
  border-color: var(--success-border) !important;
  color: var(--success-text) !important;
  font-weight: 500 !important;
}
html:not([data-theme="dark"]) #page-practice .q-option.correct::before,
html:not([data-theme="dark"]) #page-exam .q-option.correct::before {
  width: 18px !important;
  height: 18px !important;
  border-color: var(--success-icon) !important;
  background-color: var(--success-icon) !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M13.3 3.3L6 10.6 2.7 7.3 4 6l2 2 6-6 1.3 1.3z' fill='%23fff'/%3E%3C/svg%3E") !important;
  background-size: 12px !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}
html:not([data-theme="dark"]) #page-practice .q-option.correct .q-option-label,
html:not([data-theme="dark"]) #page-practice .q-option.correct .q-option-text,
html:not([data-theme="dark"]) #page-exam .q-option.correct .q-option-label,
html:not([data-theme="dark"]) #page-exam .q-option.correct .q-option-text {
  color: var(--success-text) !important;
}
html:not([data-theme="dark"]) #page-practice .q-option.wrong,
html:not([data-theme="dark"]) #page-exam .q-option.wrong {
  background: var(--error-bg) !important;
  border-color: var(--error-border) !important;
  color: var(--error-text) !important;
  font-weight: 500 !important;
}
html:not([data-theme="dark"]) #page-practice .q-option.wrong::before,
html:not([data-theme="dark"]) #page-exam .q-option.wrong::before {
  border-color: var(--error-icon) !important;
  background-color: var(--error-icon) !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 4.5l7 7M11.5 4.5l-7 7' stroke='%23fff' stroke-width='2'/%3E%3C/svg%3E") !important;
  background-size: 12px !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}
html:not([data-theme="dark"]) #page-practice .q-option.wrong .q-option-label,
html:not([data-theme="dark"]) #page-practice .q-option.wrong .q-option-text,
html:not([data-theme="dark"]) #page-exam .q-option.wrong .q-option-label,
html:not([data-theme="dark"]) #page-exam .q-option.wrong .q-option-text {
  color: var(--error-text) !important;
}
/* 选项文字完整换行：长选项在窄屏不截断（含无空格长串） */
#page-practice .q-option .q-option-label,
#page-practice .q-option .q-option-text,
#page-exam .q-option .q-option-label,
#page-exam .q-option .q-option-text {
  display: inline !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}
#page-practice .q-option,
#page-exam .q-option {
  overflow: visible !important;
}

/* ============================================================
   第四项：夜间模式整体对齐测试版（2026-11-02）
   参考 deploy/index.html 测试版深青墨绿夜间色板，仅作用于 dark
   ============================================================ */
/* ---- 色板变量：对齐测试版 dark ---- */
[data-theme="dark"] {
  --bg: #0a1512;
  --bg-deep: #050d0a;
  --card-bg: #10251c;
  --card-solid: #12301f;
  --primary: #35c98f;
  --primary-dark: #0d3a2c;
  --primary-light: rgba(53,201,143,0.13);
  --success: #35c98f;
  --success-light: rgba(53,201,143,0.15);
  --danger: #ff6a6a;
  --danger-light: rgba(255,106,106,0.13);
  --warning: #f2b33d;
  --text: #e5efe9;
  --text-primary: #f2f8f5;
  --text-secondary: #a8c2b5;
  --text-tertiary: #64816f;
  --border: rgba(120,195,158,0.16);
  --cat-bg: #142a20;
  --shadow: 0 10px 32px rgba(0,0,0,0.38);
  --shadow-lg: 0 22px 52px rgba(0,0,0,0.55);
  --fire: #f2b33d;
  --fire-hi: #ffd37b;
  --fire-deep: #b97f1f;
  --teal-hi: #7fe0b4;
  --teal-deep: #0e3d2e;
  --glass: rgba(19,42,33,0.68);
  --glass-hi: rgba(24,56,42,0.82);
  --ring-bg: rgba(120,195,158,0.12);
  --btn-sec-bg: color-mix(in srgb, var(--primary) 18%, #1a1d23);
  --btn-sec-border: color-mix(in srgb, var(--primary) 50%, transparent);
  --btn-sec-text: #8fd0ae;
  --success-bg: rgba(53,201,143,0.16);
  --success-text: #7fe0b4;
  --success-border: rgba(53,201,143,0.45);
  --success-icon: #7fe0b4;
  --error-bg: rgba(255,93,104,0.16);
  --error-text: #ff9aa2;
  --error-border: rgba(255,93,104,0.45);
  --error-icon: #ff9aa2;
  --due-bg: rgba(255,152,0,0.16);
  --due-text: #ffb74d;
  --due-border: rgba(255,152,0,0.45);
  --info-bg: rgba(22,119,255,0.16);
  --info-text: #69b1ff;
  --info-border: rgba(22,119,255,0.45);
}

/* ---- 页面背景 ---- */
[data-theme="dark"] html,
[data-theme="dark"] body,
[data-theme="dark"] #app,
[data-theme="dark"] .page,
[data-theme="dark"] #page-home,
[data-theme="dark"] #page-practice.active,
[data-theme="dark"] #page-exam.active { background: var(--bg) !important; }

/* ---- 卡片/面板底：旧 #1e2128 → 测试版 #10251c ---- */
[data-theme="dark"] .feature-item,
[data-theme="dark"] .data-grid .stat-card,
[data-theme="dark"] .quick-entry .entry-card,
[data-theme="dark"] .activity-card,
[data-theme="dark"] .trend-chart,
[data-theme="dark"] .home-search,
[data-theme="dark"] #page-practice .analysis-card,
[data-theme="dark"] #page-practice .practice-stats,
[data-theme="dark"] .wrong-item, [data-theme="dark"] .review-item,
[data-theme="dark"] .learned-item, [data-theme="dark"] .collect-item,
[data-theme="dark"] .filter-bar,
[data-theme="dark"] .stat-card,
[data-theme="dark"] .practice-sheet-panel,
[data-theme="dark"] .analysis-area,
[data-theme="dark"] .settings-group,
[data-theme="dark"] .stats-overview,
[data-theme="dark"] .kd-item,
[data-theme="dark"] .guide-content > .guide-table-card:nth-child(even) { background: #10251c !important; }
[data-theme="dark"] .guide-content > .guide-table-card:nth-child(odd) { background: #142a20 !important; }

/* ---- 弹窗：对齐测试版玻璃渐变 ---- */
[data-theme="dark"] .modal,
[data-theme="dark"] .modal-content,
[data-theme="dark"] #num-modal-content,
[data-theme="dark"] #trap-modal-content,
[data-theme="dark"] #mix-modal-content,
[data-theme="dark"] #memorize-modal-content,
[data-theme="dark"] #scope-modal-content {
  background: linear-gradient(170deg, rgba(18,42,31,0.96), rgba(10,26,18,0.97)) !important;
  border-color: rgba(120,195,158,0.20) !important;
}
[data-theme="dark"] .modal-overlay { background: rgba(3,10,7,0.72) !important; backdrop-filter: blur(6px); }
[data-theme="dark"] .modal-title { color: #f2f8f5 !important; font-weight: 800 !important; }
[data-theme="dark"] .modal-close:hover { border-color: rgba(242,179,61,0.5) !important; color: #ffd37b !important; }

/* ---- 做题页关键容器：对齐测试版 ---- */
[data-theme="dark"] #page-practice .practice-header,
[data-theme="dark"] #page-exam .practice-header,
[data-theme="dark"] .practice-header {
  background: rgba(10,26,19,0.5) !important;
  border-bottom-color: rgba(120,195,158,0.12) !important;
}
[data-theme="dark"] #page-practice .question-card,
[data-theme="dark"] #page-exam .question-card,
[data-theme="dark"] .question-card {
  background: linear-gradient(165deg, rgba(19,46,34,0.82), rgba(11,28,20,0.78)) !important;
  border-color: rgba(120,195,158,0.18) !important;
  box-shadow: 0 16px 40px rgba(0,0,0,0.35), inset 0 1px 0 rgba(255,255,255,0.05) !important;
}
[data-theme="dark"] #page-practice .practice-controls,
[data-theme="dark"] #page-exam .practice-controls,
[data-theme="dark"] .practice-controls {
  background: rgb(26,29,36) !important;
  border-top-color: rgba(255,255,255,0.10) !important;
}
[data-theme="dark"] .keyboard-hint { background: rgb(26,29,36) !important; }

/* ---- 移动端底部导航：对齐测试版 ---- */
[data-theme="dark"] .bottom-nav {
  background: rgba(8,22,16,0.85) !important;
  border-top-color: rgba(120,195,158,0.15) !important;
  backdrop-filter: blur(18px) saturate(1.4);
  -webkit-backdrop-filter: blur(18px) saturate(1.4);
  box-shadow: 0 -8px 30px rgba(0,0,0,0.35) !important;
}
[data-theme="dark"] .nav-item { color: rgba(168,194,181,0.6) !important; }
[data-theme="dark"] .nav-item.active,
[data-theme="dark"] .nav-item.active .nav-label { color: #ffd37b !important; }

/* ---- 边框：旧 #2d3038 → 测试版 rgba(120,195,158,0.16) ---- */
[data-theme="dark"] .feature-item,
[data-theme="dark"] .data-grid .stat-card,
[data-theme="dark"] .activity-card,
[data-theme="dark"] .trend-chart,
[data-theme="dark"] .home-search,
[data-theme="dark"] #page-practice .progress-bar,
[data-theme="dark"] #page-practice .analysis-card,
[data-theme="dark"] #page-practice .practice-stats,
[data-theme="dark"] .wrong-item, [data-theme="dark"] .review-item,
[data-theme="dark"] .learned-item, [data-theme="dark"] .collect-item,
[data-theme="dark"] .filter-bar, [data-theme="dark"] .filter-btn,
[data-theme="dark"] .stat-card, [data-theme="dark"] .modal-header,
[data-theme="dark"] .scope-switcher, [data-theme="dark"] .practice-sheet-panel,
[data-theme="dark"] .ctrl-btn-prev, [data-theme="dark"] .ctrl-btn-outline,
[data-theme="dark"] .ctrl-btn-sheet-mobile, [data-theme="dark"] .ctrl-btn-mark,
[data-theme="dark"] .settings-group, [data-theme="dark"] .settings-item,
[data-theme="dark"] .stats-overview, [data-theme="dark"] .search-history-chip,
[data-theme="dark"] .accuracy-track { border-color: rgba(120,195,158,0.16) !important; }

/* ---- 文字：旧暗色板 → 测试版三档 ---- */
[data-theme="dark"] .section-title,
[data-theme="dark"] .data-grid .stat-card .stat-num,
[data-theme="dark"] #page-practice .practice-title,
[data-theme="dark"] #page-practice .analysis-title,
[data-theme="dark"] .plan-range-btn b,
[data-theme="dark"] .plan-summary b,
[data-theme="dark"] .overview-row b,
[data-theme="dark"] .settings-item-name,
[data-theme="dark"] .ach-num,
[data-theme="dark"] .home-search input { color: #e5efe9 !important; }
[data-theme="dark"] .data-grid .stat-card .stat-label,
[data-theme="dark"] #page-practice .progress-text,
[data-theme="dark"] #page-practice .analysis-text,
[data-theme="dark"] #page-practice .breadcrumb-nav,
[data-theme="dark"] .wrong-info, [data-theme="dark"] .review-info,
[data-theme="dark"] .learned-info, [data-theme="dark"] .collect-info,
[data-theme="dark"] .wrong-type, [data-theme="dark"] .review-type,
[data-theme="dark"] .learned-type, [data-theme="dark"] .collect-type,
[data-theme="dark"] .filter-btn, [data-theme="dark"] .scope-switcher,
[data-theme="dark"] .ctrl-btn-prev, [data-theme="dark"] .ctrl-btn-outline,
[data-theme="dark"] .ctrl-btn-sheet-mobile, [data-theme="dark"] .ctrl-btn-mark,
[data-theme="dark"] .btn-remove-review, [data-theme="dark"] .review-progress-badge.todo,
[data-theme="dark"] .plan-range-btn, [data-theme="dark"] .plan-btn-all,
[data-theme="dark"] .plan-btn-due.disabled, [data-theme="dark"] .plan-group-header,
[data-theme="dark"] .kd-tag, [data-theme="dark"] .kd-stat,
[data-theme="dark"] .overview-row, [data-theme="dark"] .settings-item-desc,
[data-theme="dark"] .history-day, [data-theme="dark"] .history-tip,
[data-theme="dark"] .history-item-time, [data-theme="dark"] .history-item-meta .h-gray,
[data-theme="dark"] .history-item-score small,
[data-theme="dark"] .history-item-no,
[data-theme="dark"] .hero-due-btn, [data-theme="dark"] .hero-due-btn .hero-due-num,
[data-theme="dark"] .toast { color: #a8c2b5 !important; }
[data-theme="dark"] #page-practice .keyboard-hint,
[data-theme="dark"] .hero-due-btn:hover,
[data-theme="dark"] .toast { color: #e5efe9 !important; }
[data-theme="dark"] .review-progress-badge.todo { color: #64816f !important; }

/* ---- 做题选项：对齐测试版 ---- */
[data-theme="dark"] #page-practice .q-option,
[data-theme="dark"] #page-exam .q-option { color: #e8eaed !important; }
[data-theme="dark"] #page-practice .q-content,
[data-theme="dark"] #page-exam .q-content { color: #eef6f1 !important; }

/* ---- 主色：旧 #63ab85 / rgba(99,171,133,·) → 测试版 #35c98f / rgba(53,201,143,·) ---- */
[data-theme="dark"] .feature-icon[style] { background: rgba(53,201,143,0.20) !important; }
[data-theme="dark"] .trend-table tr.today { background: rgba(53,201,143,0.16) !important; }
[data-theme="dark"] .q-attempt-badge {
  background: rgba(53,201,143,0.15) !important;
  color: #7fe0b4 !important;
  border: 1px solid rgba(53,201,143,0.3) !important;
}

/* ---- 首页 hero：对齐测试版玻璃主色渐变 ---- */
[data-theme="dark"] .home-hero {
  background: linear-gradient(140deg, rgba(53,201,143,0.30), rgba(53,201,143,0.14)) !important;
  border-color: rgba(120,195,158,0.18) !important;
}
[data-theme="dark"] .hero-over-banner {
  background: linear-gradient(135deg, rgba(53,201,143,0.30), rgba(53,201,143,0.14)) !important;
  color: #cfe7da !important;
}
[data-theme="dark"] .hero-over-banner b { color: #8fd0ae !important; }

/* ---- 测试版火焰金强调：主按钮/计时器/题型标签/面包屑当前页 ---- */
[data-theme="dark"] .btn-primary {
  background: linear-gradient(135deg, #ffd37b, #f2b33d) !important;
  color: #3a2404 !important;
  font-weight: 700 !important;
  border: none !important;
  box-shadow: 0 8px 24px rgba(242,179,61,0.28) !important;
}
[data-theme="dark"] .btn-primary:hover { box-shadow: 0 10px 30px rgba(242,179,61,0.45) !important; }
[data-theme="dark"] .exam-timer {
  background: rgba(242,179,61,0.14) !important;
  border: 1px solid rgba(242,179,61,0.4) !important;
  color: #ffd37b !important;
}
[data-theme="dark"] .q-type-badge {
  background: linear-gradient(135deg, rgba(242,179,61,0.25), rgba(242,179,61,0.1)) !important;
  color: #ffd37b !important;
  border: 1px solid rgba(242,179,61,0.4) !important;
}
[data-theme="dark"] .breadcrumb-nav .breadcrumb-current { color: #ffd37b !important; }
[data-theme="dark"] .guide-chapter-header:hover { background: rgba(120,195,158,0.10) !important; }
[data-theme="dark"] #page-exam .exam-sheet-num {
  color: #a8c2b5 !important;
  border-color: rgba(120,195,158,0.16) !important;
}


/* ============================================================
   本批体验改进（2026-11-02）
   1. 按钮栏改造：不确定仅模拟考试显示 + 固定宽度布局
   2. 多选题选中态改黄（火焰金/琥珀色系，与单选/判断区分）
   3. 夜间模式全面升级：层次补强
   ============================================================ */

/* ---------- 任务1：按钮栏改造 ---------- */
/* 练习页所有模式一律不渲染「不确定」（HTML 已移除，此处兜底防残留） */
#page-practice .ctrl-btn-mark { display: none !important; }

/* 按钮栏固定宽度布局：主按钮统一宽度，切换题目/模式时按钮不跳动 */
#page-practice .practice-controls .ctrl-btn,
#page-exam .practice-controls .ctrl-btn {
  flex: 0 0 auto !important;
  min-width: 0 !important;
  max-width: none !important;
  width: 150px !important;
}
/* 不确定按钮明显窄于主按钮（仅考试页可见） */
#page-exam .practice-controls .ctrl-btn-mark {
  width: 104px !important;
  flex: 0 0 104px !important;
}
/* 窄屏：主按钮 108px、不确定 84px，同样固定不跳动 */
@media (max-width: 768px) {
  #page-practice .practice-controls .ctrl-btn,
  #page-exam .practice-controls .ctrl-btn { width: 108px !important; }
  #page-exam .practice-controls .ctrl-btn-mark { width: 84px !important; flex: 0 0 84px !important; }
}
/* 不确定按钮激活态：琥珀金（警示/待确认语义，日夜间同款） */
#page-exam .ctrl-btn-mark.mark-on {
  background: color-mix(in srgb, #f2b33d 16%, #ffffff) !important;
  color: #6b4a00 !important;
  border-color: #f2b33d !important;
  font-weight: 700 !important;
}
[data-theme="dark"] #page-exam .ctrl-btn-mark.mark-on {
  background: color-mix(in srgb, #f2b33d 18%, #10251c) !important;
  color: #ffd37b !important;
  border-color: #f2b33d !important;
}

/* ---------- 任务2：多选题选中态改黄（火焰金/琥珀色系） ---------- */
#page-practice .q-option.multi.selected:not(.correct):not(.wrong),
#page-exam .q-option.multi.selected:not(.correct):not(.wrong) {
  background: color-mix(in srgb, #f2b33d 20%, #ffffff) !important;
  border: 2px solid #f2b33d !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, #f2b33d 26%, transparent) !important;
}
#page-practice .q-option.multi.selected:not(.correct):not(.wrong)::before,
#page-exam .q-option.multi.selected:not(.correct):not(.wrong)::before {
  width: 18px !important;
  height: 18px !important;
  border: 2px solid #f2b33d !important;
  background: #f2b33d !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M13.3 3.3L6 10.6 2.7 7.3 4 6l2 2 6-6 1.3 1.3z' fill='%233a2404'/%3E%3C/svg%3E") !important;
  background-size: 13px !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}
#page-practice .q-option.multi.selected:not(.correct):not(.wrong) .q-option-label,
#page-practice .q-option.multi.selected:not(.correct):not(.wrong) .q-option-text,
#page-exam .q-option.multi.selected:not(.correct):not(.wrong) .q-option-label,
#page-exam .q-option.multi.selected:not(.correct):not(.wrong) .q-option-text {
  color: #5c3d00 !important;
  font-weight: 600 !important;
}
[data-theme="dark"] #page-practice .q-option.multi.selected:not(.correct):not(.wrong),
[data-theme="dark"] #page-exam .q-option.multi.selected:not(.correct):not(.wrong) {
  background: color-mix(in srgb, #f2b33d 16%, #10251c) !important;
  border: 2px solid #f2b33d !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, #f2b33d 22%, transparent) !important;
}
[data-theme="dark"] #page-practice .q-option.multi.selected:not(.correct):not(.wrong)::before,
[data-theme="dark"] #page-exam .q-option.multi.selected:not(.correct):not(.wrong)::before {
  width: 18px !important;
  height: 18px !important;
  border: 2px solid #f2b33d !important;
  background: #f2b33d !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M13.3 3.3L6 10.6 2.7 7.3 4 6l2 2 6-6 1.3 1.3z' fill='%230a1512'/%3E%3C/svg%3E") !important;
  background-size: 13px !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}
[data-theme="dark"] #page-practice .q-option.multi.selected:not(.correct):not(.wrong) .q-option-label,
[data-theme="dark"] #page-practice .q-option.multi.selected:not(.correct):not(.wrong) .q-option-text,
[data-theme="dark"] #page-exam .q-option.multi.selected:not(.correct):not(.wrong) .q-option-label,
[data-theme="dark"] #page-exam .q-option.multi.selected:not(.correct):not(.wrong) .q-option-text {
  color: #ffd37b !important;
  font-weight: 600 !important;
}

/* ---------- 任务3：夜间模式全面升级（层次补强） ---------- */
/* 首页 hero-banner 卡片：蓝灰 → 深青墨绿玻璃 */
[data-theme="dark"] .hero-banner {
  background: linear-gradient(150deg, rgba(19,46,34,0.85), rgba(11,28,20,0.8)) !important;
  border-color: rgba(120,195,158,0.18) !important;
}
[data-theme="dark"] .hero-banner h3 { color: #eef6f1 !important; }
[data-theme="dark"] .hero-banner p { color: #a8c2b5 !important; }
/* hero 次级操作按钮：对齐次级控件 */
[data-theme="dark"] .hero-history-btn,
[data-theme="dark"] .hero-overview-btn,
[data-theme="dark"] .hero-lv-overview-btn {
  background: #142a20 !important;
  border-color: rgba(120,195,158,0.28) !important;
  color: #a8c2b5 !important;
}
[data-theme="dark"] .hero-history-btn:hover,
[data-theme="dark"] .hero-overview-btn:hover,
[data-theme="dark"] .hero-lv-overview-btn:hover { color: #ffd37b !important; border-color: rgba(242,179,61,0.5) !important; }
/* 首页功能入口/文字 */
[data-theme="dark"] .feature-label { color: #a8c2b5 !important; }
[data-theme="dark"] .feature-item:hover { background: #142a20 !important; }
[data-theme="dark"] .hero-text p { color: #a8c2b5 !important; }
/* 首页搜索框 */
[data-theme="dark"] .home-search input { background: #142a20 !important; }
/* 速记页：tabs 对齐测试版（active 火焰金） */
[data-theme="dark"] .guide-tab {
  background: #10251c !important;
  border-color: rgba(120,195,158,0.16) !important;
  color: #a8c2b5 !important;
}
[data-theme="dark"] .guide-tab.active {
  background: linear-gradient(135deg, rgba(242,179,61,0.28), rgba(242,179,61,0.12)) !important;
  border-color: rgba(242,179,61,0.45) !important;
  color: #ffd37b !important;
}
/* 速记表格：文字三档 + 斑马行强化 */
[data-theme="dark"] .guide-table-card .card-title { background: linear-gradient(135deg, #163f2c, #0f2a1d) !important; color: #e5efe9 !important; }
[data-theme="dark"] .guide-table-card th { color: #ffd37b !important; background: rgba(120,195,158,0.08) !important; }
[data-theme="dark"] .guide-table-card td { color: #cfe7da !important; }
[data-theme="dark"] .guide-table-card tbody tr:hover { background: rgba(120,195,158,0.10) !important; }
[data-theme="dark"] .guide-section-label, [data-theme="dark"] .guide-count { color: #64816f !important; }
[data-theme="dark"] .guide-no-result { color: #a8c2b5 !important; }
/* 弹窗：确认/开始类主按钮火焰金 */
[data-theme="dark"] .scope-modal-footer-btn {
  background: linear-gradient(135deg, #ffd37b, #f2b33d) !important;
  color: #3a2404 !important;
  border: none !important;
  font-weight: 700 !important;
  box-shadow: 0 8px 24px rgba(242,179,61,0.28) !important;
}
/* 弹窗内选中项：琥珀强调 */
[data-theme="dark"] .scope-modal-item.active,
[data-theme="dark"] #scope-modal-content .scope-modal-item.active {
  background: color-mix(in srgb, #f2b33d 20%, #10251c) !important;
  border-color: #f2b33d !important;
}
[data-theme="dark"] .scope-modal-item.active .scope-modal-item-name,
[data-theme="dark"] #scope-modal-content .scope-modal-item.active .scope-modal-item-name { color: #ffd37b !important; }
/* 做题：确认答案按钮火焰金（暗色） */
[data-theme="dark"] .ctrl-btn-submit {
  background: linear-gradient(135deg, #ffd37b, #f2b33d) !important;
  color: #3a2404 !important;
  border-color: transparent !important;
  font-weight: 700 !important;
}
/* 做题对错反馈：对齐测试版半透明绿/红，提高暗色可读性 */
[data-theme="dark"] #page-practice .q-option.correct,
[data-theme="dark"] #page-exam .q-option.correct {
  background: var(--success-bg) !important;
  border-color: var(--success-border) !important;
  color: var(--success-text) !important;
}
[data-theme="dark"] #page-practice .q-option.correct::before,
[data-theme="dark"] #page-exam .q-option.correct::before {
  width: 18px !important;
  height: 18px !important;
  border-color: var(--success-icon) !important;
  background-color: var(--success-icon) !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M13.3 3.3L6 10.6 2.7 7.3 4 6l2 2 6-6 1.3 1.3z' fill='%23fff'/%3E%3C/svg%3E") !important;
  background-size: 12px !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}
[data-theme="dark"] #page-practice .q-option.wrong,
[data-theme="dark"] #page-exam .q-option.wrong {
  background: var(--error-bg) !important;
  border-color: var(--error-border) !important;
  color: var(--error-text) !important;
}
[data-theme="dark"] #page-practice .q-option.wrong::before,
[data-theme="dark"] #page-exam .q-option.wrong::before {
  border-color: var(--error-icon) !important;
  background-color: var(--error-icon) !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 4.5l7 7M11.5 4.5l-7 7' stroke='%23fff' stroke-width='2'/%3E%3C/svg%3E") !important;
  background-size: 12px !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}
/* 答题卡：当前题号高亮金（夜间） */
[data-theme="dark"] #page-practice .exam-sheet-num.sheet-current,
[data-theme="dark"] #page-exam .exam-sheet-num.sheet-current {
  background: linear-gradient(135deg, rgba(242,179,61,0.3), rgba(242,179,61,0.12)) !important;
  border-color: #f2b33d !important;
  color: #ffd37b !important;
  font-weight: 700 !important;
}
/* 答题卡面板标题 */
[data-theme="dark"] .sheet-header {
  color: #e5efe9 !important;
  border-bottom-color: rgba(120,195,158,0.16) !important;
}
/* 滚动条：青绿系 */
[data-theme="dark"] ::-webkit-scrollbar-track { background: #0a1512 !important; }
[data-theme="dark"] ::-webkit-scrollbar-thumb { background: rgba(120,195,158,0.25) !important; border-radius: 4px !important; }
[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: rgba(120,195,158,0.4) !important; }


/* ===== 2026-11-04 UI subtraction pass (practice / exam) ===== */

/* 1) remove emphasis: stats row, learned badge, old sheet toggle */
.practice-topline-stats,
.q-learned-badge,
.sheet-toggle { display: none !important; }

/* 2) back button clearer */
.practice-back {
  width: 34px !important;
  height: 34px !important;
  border-radius: 10px !important;
  font-size: 26px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  color: #1f2328 !important;
  background: #f1f3f5 !important;
}
[data-theme="dark"] .practice-back { color: #f2f4f7 !important; background: #2b303a !important; }

/* 3) page title clearer */
.practice-title, #page-exam .practice-title {
  color: #1f2328 !important;
  font-weight: 700 !important;
}
#page-exam .practice-title { font-size: 17px !important; }
[data-theme="dark"] .practice-title,
[data-theme="dark"] #page-exam .practice-title,
[data-theme="dark"] #page-practice .practice-title { color: #f2f4f7 !important; }

/* 4) countdown timer: strip background and border */
.exam-timer, #page-exam .exam-timer,
[data-theme="dark"] .exam-timer, [data-theme="dark"] #page-exam .exam-timer {
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
}

/* 5) answer sheet numbers readable */
.exam-sheet-num { font-size: 13px !important; font-weight: 700 !important; }
.exam-sheet-num:not(.sheet-correct):not(.sheet-wrong):not(.sheet-current) {
  color: #2b2f36 !important;
}
[data-theme="dark"] .exam-sheet-num:not(.sheet-correct):not(.sheet-wrong):not(.sheet-current) {
  color: #eef1f5 !important;
  background: #2c313b !important;
  border-color: #434a58 !important;
}

/* 6) dark mode option readability */
[data-theme="dark"] #page-practice .q-option:not(.correct):not(.wrong),
[data-theme="dark"] #page-exam .q-option:not(.correct):not(.wrong) {
  background: #2f3441 !important;
  border-color: #4a5162 !important;
  color: #f4f6f9 !important;
}
[data-theme="dark"] #page-practice .q-option:not(.correct):not(.wrong) .q-option-label,
[data-theme="dark"] #page-exam .q-option:not(.correct):not(.wrong) .q-option-label,
[data-theme="dark"] #page-practice .q-option:not(.correct):not(.wrong) .q-option-text,
[data-theme="dark"] #page-exam .q-option:not(.correct):not(.wrong) .q-option-text {
  color: #f4f6f9 !important;
}

/* 7) sheet drawer + mask */
.sheet-mask {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.45);
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s ease;
  z-index: 1290;
}
.sheet-mask.show { opacity: 1; pointer-events: auto; }
.sheet-close {
  float: right;
  cursor: pointer;
  font-size: 15px;
  font-weight: 700;
  color: #666;
  padding: 0 2px;
  line-height: 1.2;
}
[data-theme="dark"] .sheet-close { color: #b9bdc4; }

.ctrl-btn-sheet {
  background: #fff;
  color: #2d6a4f;
  border: 1px solid #cfe3d8;
  font-weight: 700;
}
[data-theme="dark"] .ctrl-btn-sheet {
  background: #242730 !important;
  color: #8fd0ae !important;
  border-color: #3a3f4a !important;
}

@media (max-width: 767px) {
  .practice-sheet-panel {
    position: fixed !important;
    left: 0;
    right: 0;
    bottom: 0;
    top: auto !important;
    width: 100% !important;
    max-width: none !important;
    max-height: 72vh;
    overflow-y: auto;
    background: #fff;
    border-radius: 16px 16px 0 0;
    padding: 14px 16px calc(20px + env(safe-area-inset-bottom));
    box-shadow: 0 -8px 30px rgba(0,0,0,.18);
    transform: translateY(112%);
    transition: transform .24s ease;
    z-index: 1300;
    margin: 0 !important;
  }
  [data-theme="dark"] .practice-sheet-panel { background: #1e2128 !important; }
  .practice-sheet-panel.sheet-open { transform: translateY(0); }
  .practice-sheet-panel .exam-sheet-grid,
  .practice-sheet-panel.sheet-collapsed .exam-sheet-grid { display: grid !important; }
  .practice-sheet-panel .sheet-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
  }
  .practice-sheet-panel .sheet-header .sheet-close { float: none; }
  body.sheet-open { overflow: hidden; }

  /* control bar: 4 buttons fit in one row, evenly */
  #page-practice .practice-controls .ctrl-btn,
  #page-exam .practice-controls .ctrl-btn {
    width: auto !important;
    flex: 1 1 0 !important;
    min-width: 0 !important;
    font-size: 13px !important;
  }
  #page-exam .practice-controls .ctrl-btn-mark {
    width: auto !important;
    flex: 1 1 0 !important;
  }
}

.sheet-count {
  margin-left: auto;
  margin-right: 14px;
  font-size: 12px;
  font-weight: 600;
  color: #8a8f98;
}
[data-theme="dark"] .sheet-count { color: #9aa1ab; }
@media (min-width: 768px) {
  .sheet-close { display: none !important; }
  .sheet-count { margin-left: 10px; margin-right: 0; }
  .sheet-mask { display: none !important; }
  .ctrl-btn-sheet { display: none !important; }
}
@media (max-width: 767px) {
  .sheet-mask { display: none !important; }
}
@media (max-width: 767px) {
  .practice-sheet-panel .sheet-close {
    position: absolute;
    right: 16px;
    top: 12px;
    float: none;
    z-index: 3;
    padding: 4px 8px;
    font-size: 18px;
    line-height: 1;
  }
  .practice-sheet-panel { position: fixed; }
}