/* ===== Reset & Base ===== */
* { margin: 0; padding: 0; box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html, body { height: 100%; overflow: hidden; }
body {
  font-family: -apple-system, 'PingFang SC', 'Microsoft YaHei', 'Helvetica Neue', sans-serif;
  background: #f0f2f0; color: #333; font-size: 14px;
}
body.theme-dark { background: #1a1a2e; }
body.theme-green { background: #d4edda; }
body.theme-parchment { background: #f5e6c8; }
#app {
  max-width: 450px; margin: 0 auto; height: 100%;
  position: relative; overflow: hidden;
  background: inherit;
}
/* Login page overrides background */
#page-login #app { background: transparent; }

/* ===== Page Management ===== */
.page { display: none; height: 100%; flex-direction: column; overflow: hidden; }
.page.active { display: flex; }

/* ===== 侧边菜单 ===== */
.drawer-overlay {
  position: fixed; top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0,0,0,0.4); z-index: 200; display: none;
}
.drawer-overlay.open { display: block; }
.drawer {
  position: fixed; top: 0; left: -280px; width: 280px; height: 100%;
  background: #fff; z-index: 201; transition: left 0.3s ease;
  display: flex; flex-direction: column; overflow-y: auto;
}
.drawer.open { left: 0; }
.drawer-header {
  background: linear-gradient(135deg, #2E6BDF, #1a4fa0);
  color: #fff; padding: 30px 16px 16px; display: flex; align-items: flex-start; gap: 12px;
}
.drawer-avatar {
  width: 48px; height: 48px; border-radius: 50%; background: rgba(255,255,255,0.2);
  display: flex; align-items: center; justify-content: center; font-size: 24px; flex-shrink: 0;
}
.drawer-user { flex: 1; }
.drawer-name { font-size: 15px; font-weight: 500; margin-bottom: 6px; }
.drawer-actions { display: flex; gap: 6px; }
.drawer-logout {
  background: rgba(255,255,255,0.2); border: none; color: #fff;
  padding: 5px 10px; border-radius: 4px; font-size: 12px; cursor: pointer;
}
.drawer-switch {
  background: rgba(255,255,255,0.25); border: 1px solid rgba(255,255,255,0.5); color: #fff;
  padding: 5px 10px; border-radius: 4px; font-size: 12px; cursor: pointer;
}
.drawer-switch:active { background: rgba(255,255,255,0.4); }
.header-chart-btn {
  width: 36px; height: 36px; border: none; background: #f0f2f0;
  border-radius: 10px; font-size: 18px; cursor: pointer; display: flex;
  align-items: center; justify-content: center; flex-shrink: 0;
}
.drawer-section { padding: 12px 16px; border-bottom: 1px solid #f0f0f0; }
.drawer-section-title { font-size: 12px; color: #999; margin-bottom: 8px; }
.drawer-subjects { display: flex; flex-direction: column; gap: 4px; }
.drawer-subject-item {
  padding: 8px 10px; border-radius: 6px; font-size: 13px; cursor: pointer;
  display: flex; justify-content: space-between; align-items: center;
}
.drawer-subject-item:active { background: #f0f7ff; }
.drawer-subject-item.active { color: #2E6BDF; font-weight: 500; background: #f0f7ff; }
.drawer-subject-count { font-size: 11px; color: #ccc; }
.drawer-footer { padding: 16px; margin-top: auto; }
.drawer-menu-item {
  padding: 10px; border-radius: 6px; font-size: 13px; cursor: pointer; color: #666;
}
.drawer-menu-item:active { background: #f5f5f5; }

/* ===== 首页 ===== */
.home-header {
  display: flex; align-items: center; padding: 14px 12px;
  background: #fff; border-bottom: 1px solid #f0f0f0; gap: 10px;
  flex-shrink: 0;
}
.header-menu-btn {
  width: 36px; height: 36px; border: none; background: #f0f2f0;
  border-radius: 10px; font-size: 18px; cursor: pointer; display: flex;
  align-items: center; justify-content: center; flex-shrink: 0;
}
.home-title-wrap { flex: 1; text-align: center; }
.home-title { font-size: 16px; font-weight: 600; display: block; }
.home-subtitle { font-size: 11px; color: #999; }

.home-scroll { flex: 1; display: flex; flex-direction: column; padding: 10px 12px; overflow: hidden; }
.chapter-scroll { flex: 1; overflow-y: auto; -webkit-overflow-scrolling: touch; margin-top: 6px; }

/* 功能按钮行 */
.func-row {
  display: flex; gap: 8px; padding: 4px 0 10px;
}
.func-btn {
  flex: 1; display: flex; flex-direction: column; align-items: center; gap: 4px;
  padding: 12px 4px; border: none; border-radius: 12px; font-size: 11px;
  cursor: pointer; white-space: nowrap; transition: transform 0.1s;
}
.func-btn:active { transform: scale(0.95); }
.func-btn span { font-size: 11px; }
.func-search { background: #e3f2fd; color: #1565c0; }
.func-exam { background: #fff3e0; color: #e65100; }
.func-wrong { background: #fce4ec; color: #c62828; }
.func-random { background: #f3e5f5; color: #7b1fa2; }

/* 题库统计 */
.stats-banner {
  background: #fff; border-radius: 12px;
  padding: 10px 0 14px; margin-bottom: 12px; box-shadow: 0 1px 4px rgba(0,0,0,0.05);
}
.stats-banner-label {
  text-align: center; font-size: 11px; color: #999; margin-bottom: 6px;
}
.stats-items { display: flex; }
.stats-item { flex: 1; text-align: center; border-right: 1px solid #f0f0f0; }
.stats-item:last-child { border-right: none; }
.stats-num { font-size: 22px; font-weight: 700; color: #2E6BDF; display: block; }
.stats-num.green { color: #1E9C50; }
.stats-num.orange { color: #ff9800; }
.stats-label { font-size: 11px; color: #999; }

body.theme-dark .stats-banner { background: #16213e; }
body.theme-dark .stats-banner-label { color: #888; }
body.theme-dark .stats-item { border-right-color: #0f3460; }
body.theme-dark .stats-label { color: #888; }
body.theme-green .stats-banner { background: #e8f5e9; }
body.theme-parchment .stats-banner { background: #fdf3e3; }

/* 侧边栏跟随主题 */
body.theme-dark .drawer { background: #16213e; }
body.theme-dark .drawer-section { border-bottom-color: #0f3460; }
body.theme-dark .drawer-section-title { color: #888; }
body.theme-dark .drawer-subject-item { color: #ccc; }
body.theme-dark .drawer-subject-item:active { background: #1a2744; }
body.theme-dark .drawer-subject-item.active { color: #5b9bef; background: #1a2744; }
body.theme-dark .drawer-footer { border-top-color: #0f3460; }
body.theme-dark .drawer-menu-item { color: #999; }
body.theme-dark .drawer-menu-item:active { background: #1a2744; }

body.theme-green .drawer { background: #e8f5e9; }
body.theme-green .drawer-section { border-bottom-color: #a8d8b0; }
body.theme-green .drawer-section-title { color: #5a8a5a; }
body.theme-green .drawer-subject-item { color: #2d5a2d; }
body.theme-green .drawer-subject-item:active { background: #c8e6c9; }
body.theme-green .drawer-subject-item.active { color: #1E9C50; background: #c8e6c9; }
body.theme-green .drawer-menu-item { color: #3a7a3a; }
body.theme-green .drawer-menu-item:active { background: #c8e6c9; }

body.theme-parchment .drawer { background: #fdf3e3; }
body.theme-parchment .drawer-section { border-bottom-color: #e0c9a0; }
body.theme-parchment .drawer-section-title { color: #8b6f4a; }
body.theme-parchment .drawer-subject-item { color: #5c3d1a; }
body.theme-parchment .drawer-subject-item:active { background: #f5e6c8; }
body.theme-parchment .drawer-subject-item.active { color: #8b6f4a; background: #f5e6c8; }
body.theme-parchment .drawer-menu-item { color: #6b4f2a; }
body.theme-parchment .drawer-menu-item:active { background: #f5e6c8; }

/* 章节列表 */
.section-label { font-size: 14px; font-weight: 600; margin-bottom: 8px; }
.chapter-card {
  background: #fff; border-radius: 10px; padding: 12px 14px;
  margin-bottom: 8px; box-shadow: 0 1px 3px rgba(0,0,0,0.04);
  cursor: pointer; transition: transform 0.1s;
}
.chapter-card:active { transform: scale(0.98); }
.chapter-top {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 6px;
}
.chapter-name { font-size: 13px; font-weight: 500; color: #333; flex: 1; }
.chapter-count { font-size: 12px; color: #999; margin-left: 8px; white-space: nowrap; }
.chapter-progress-row { display: flex; align-items: center; gap: 8px; }
.chapter-progress-bar {
  flex: 1; height: 4px; background: #eee; border-radius: 2px; overflow: hidden;
}
.chapter-progress-fill {
  height: 100%; background: linear-gradient(90deg, #2E6BDF, #5b9bef);
  border-radius: 2px; transition: width 0.3s;
}
.chapter-progress-text { font-size: 11px; color: #bbb; white-space: nowrap; }

/* Sub-chapters */
.parent-chapter { cursor: pointer; }
.expand-icon { font-size: 10px; margin-right: 6px; color: #999; }
.sub-chapters { margin-top: 10px; border-top: 1px solid #f0f0f0; padding-top: 8px; }
.sub-chapter {
  display: flex; justify-content: space-between; align-items: center;
  padding: 8px 10px; border-radius: 6px; cursor: pointer;
  font-size: 12px; color: #555; transition: 0.15s;
}
.sub-chapter:active { background: #f0f0f0; }
.sub-chapter + .sub-chapter { margin-top: 2px; }
.sub-chapter-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sub-chapter-count { font-size: 11px; color: #999; margin-left: 8px; white-space: nowrap; }

/* 底部选项卡 */
.home-tabs {
  display: flex; background: #fff; border-bottom: 1px solid #f0f0f0;
  flex-shrink: 0; padding: 6px 0; gap: 4px;
}
.home-tab {
  flex: 1; padding: 8px 4px; border: none; background: transparent;
  font-size: 12px; color: #666; cursor: pointer; border-radius: 8px;
  transition: all 0.15s;
}
.home-tab.active { background: #e3f2fd; color: #2E6BDF; font-weight: 500; }
.home-tab:active { background: #f0f0f0; }

/* ===== 题目练习页 ===== */
.practice-top {
  display: flex; align-items: center; padding: 10px 12px;
  background: #fff; border-bottom: 1px solid #f0f0f0; gap: 8px;
  flex-shrink: 0; position: relative;
}
.icon-btn, .back-btn {
  width: 44px; height: 44px; border: none; background: #f0f2f0;
  border-radius: 12px; font-size: 24px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  color: #333; flex-shrink: 0;
}
/* Large back button for touch */
.back-btn-lg {
  padding: 10px 16px; border: none; background: #f0f2f0;
  border-radius: 10px; font-size: 16px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  color: #333; min-width: 60px; min-height: 44px;
}
.practice-meta { flex: 1; font-size: 13px; color: #666; text-align: center; }

/* 顶部操作按钮（设置⚙️） */
.practice-top-actions {
  display: flex; align-items: center; gap: 10px;
  flex-shrink: 0;
}
.top-gear-btn {
  width: 36px; height: 36px; border: none; background: transparent;
  border-radius: 50%; font-size: 22px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  color: #666; transition: transform 0.15s;
}
.top-gear-btn:active { transform: scale(0.9); }

.practice-progress-wrap {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 12px; background: #fff; flex-shrink: 0;
}
.practice-progress-bar { flex: 1; height: 4px; background: #eee; border-radius: 2px; overflow: hidden; }
.practice-progress-fill { height: 100%; background: #2E6BDF; border-radius: 2px; transition: width 0.3s; }
.practice-progress-num { font-size: 11px; color: #999; white-space: nowrap; }

.practice-scroll {
  flex: 1; overflow-y: auto; -webkit-overflow-scrolling: touch;
  padding: 12px; background: #f0f2f0;
}

.question-box { animation: fadeIn 0.25s ease; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }

/* 题目卡片 */
.question-card {
  background: #fff; border-radius: 12px; padding: 18px;
  padding-bottom: 56px; /* 给底部操作栏留空间 */
  box-shadow: 0 1px 4px rgba(0,0,0,0.06); margin-bottom: 12px;
  position: relative;
}
.question-tags { display: flex; gap: 6px; margin-bottom: 10px; flex-wrap: wrap; }
.q-tag {
  padding: 2px 8px; border-radius: 4px; font-size: 11px;
}
.tag-single { background: #e8f5e9; color: #1E9C50; }
.tag-multi { background: #fff3e0; color: #e65100; }
.tag-case { background: #fce4ec; color: #c62828; }
.tag-score { background: #e3f2fd; color: #2E6BDF; }

.question-text {
  font-size: 15px; line-height: 1.8; margin-bottom: 14px;
  word-break: break-word;
}
.question-text img { max-width: 100%; border-radius: 6px; margin: 6px 0; }

/* 选项 */
.options { display: flex; flex-direction: column; gap: 8px; }
.option {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 12px 14px; border: 2px solid #e8e8e8; border-radius: 10px;
  cursor: pointer; font-size: 14px; line-height: 1.6; transition: all 0.15s;
  min-height: 44px;
}
.option:active { background: #f8f9ff; }
.option .label { font-weight: 600; color: #aaa; min-width: 24px; flex-shrink: 0; }
.option.selected { border-color: #2E6BDF; background: #e8f0fe; box-shadow: 0 0 0 2px rgba(46,107,223,0.15), inset 0 0 0 1px rgba(46,107,223,0.1); }
.option.selected .label { color: #2E6BDF; font-weight: 700; }
.option.correct { border-color: #1E9C50; background: #e8f5e9; }
.option.correct .label { color: #1E9C50; }
.option.wrong { border-color: #f44336; background: #ffebee; }
.option.wrong .label { color: #f44336; }
.option.missed { border-color: #ff9800; background: #fff3e0; }
.option.missed .label { color: #ff9800; }
.multi .option.selected { border-color: #ff9800; background: #fff3e0; box-shadow: 0 0 0 2px rgba(255,152,0,0.15), inset 0 0 0 1px rgba(255,152,0,0.1); }

/* 答案区域 */
.answer-box {
  background: #fff; border-radius: 12px; padding: 16px;
  box-shadow: 0 1px 4px rgba(0,0,0,0.06); margin-bottom: 12px;
  display: none;
}
.answer-box.show { display: block; }
.answer-box.correct { border-left: 3px solid #1E9C50; }
.answer-box.wrong { border-left: 3px solid #f44336; }
.answer-result { font-size: 16px; font-weight: 600; margin-bottom: 8px; }
.answer-result.right { color: #1E9C50; }
.answer-result.wrong { color: #f44336; }
.answer-result.partial { color: #e67e22; }
.answer-box.partial { border-left: 3px solid #e67e22; }
.answer-row { font-size: 13px; color: #555; margin-bottom: 4px; line-height: 1.6; }
.answer-row strong { color: #333; }
.answer-correct-text { color: #1E9C50; font-weight: 500; }
.answer-your-text { color: #f44336; font-weight: 500; }

/* 难度星级 */
.difficulty-row { display: flex; align-items: center; gap: 6px; margin: 8px 0; }
.difficulty-stars { color: #ff9800; font-size: 14px; }
.difficulty-label { font-size: 12px; color: #999; }

/* 正确率 */
.accuracy-row { display: flex; align-items: center; gap: 6px; margin: 8px 0; }
.accuracy-bar {
  flex: 1; height: 6px; background: #eee; border-radius: 3px; overflow: hidden;
}
.accuracy-fill { height: 100%; border-radius: 3px; }
.accuracy-text { font-size: 12px; color: #666; white-space: nowrap; min-width: 40px; text-align: right; }

/* 解析 */
.analysis-text {
  margin-top: 10px; padding-top: 10px; border-top: 1px solid #f0f0f0;
  font-size: 13px; line-height: 1.7; color: #444;
}
.analysis-text .label { color: #999; font-weight: 500; display: block; margin-bottom: 4px; }

/* 错题反馈 */
.feedback-row {
  margin-top: 10px; padding-top: 10px; border-top: 1px solid #f0f0f0;
  display: flex; gap: 8px;
}
.feedback-btn {
  padding: 6px 14px; border: 1px solid #ddd; border-radius: 6px;
  background: #fff; font-size: 12px; cursor: pointer; color: #666;
  transition: all 0.15s;
}
.feedback-btn:active { background: #f5f5f5; }
.feedback-btn.active { border-color: #ff9800; color: #ff9800; background: #fff8e1; }

/* 底部操作栏（仅提交按钮） */
.practice-bottom-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 4px;
  padding: 8px 12px 10px;
  background: #fff; border-top: 1px solid #f0f0f0; flex-shrink: 0;
}
.practice-bottom-bar .btn-prev,
.practice-bottom-bar .btn-next {
  flex: 1;
  max-width: 90px;
  padding: 8px 4px;
  border: 1px solid #ddd;
  border-radius: 8px;
  background: #fff;
  font-size: 13px;
  color: #2E6BDF;
  cursor: pointer;
  text-align: center;
  white-space: nowrap;
}
.practice-bottom-bar .btn-prev:active,
.practice-bottom-bar .btn-next:active { background: #f0f7ff; }
.practice-bottom-bar .btn-prev:disabled,
.practice-bottom-bar .btn-next:disabled { opacity: 0.4; border-color: #eee; color: #bbb; }
.practice-bottom-bar .btn-sheet {
  width: 40px; height: 40px;
  border: none; border-radius: 50%;
  background: #f0f2f0;
  font-size: 18px;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
}
.practice-bottom-bar .btn-sheet:active { background: #e8edf5; }
.btn-submit {
  flex: 1;
  max-width: 160px;
  padding: 10px 20px;
  border: none; border-radius: 8px;
  background: #2E6BDF; color: #fff; font-size: 14px; font-weight: 500;
  cursor: pointer; text-align: center;
}
.btn-submit:active { opacity: 0.85; }
.btn-submit:disabled { opacity: 0.5; }

/* ===== Safe Area ===== */
@supports (padding-top: env(safe-area-inset-top)) {
  .home-header { padding-top: calc(14px + env(safe-area-inset-top)); }
  .practice-bottom-bar { padding-bottom: calc(10px + env(safe-area-inset-bottom)); }
}

/* 案例题 */
.case-textarea {
  width: 100%; min-height: 100px; padding: 12px;
  border: 2px solid #ddd; border-radius: 10px; font-size: 14px;
  line-height: 1.6; resize: vertical;
}
.case-textarea:focus { outline: none; border-color: #2E6BDF; }
.btn-case-analysis {
  display: block; width: 100%; margin-top: 12px;
  padding: 10px; border: 2px solid #2E6BDF; border-radius: 10px;
  background: #fff; color: #2E6BDF; font-size: 14px; font-weight: 500;
  cursor: pointer; transition: 0.15s;
}
.btn-case-analysis:hover { background: #e3f2fd; }
.btn-case-analysis:active { transform: scale(0.98); }
#case-analysis-box {
  margin-top: 12px; padding: 14px; border-radius: 10px;
  background: #f8f9fa; border: 1px solid #e0e0e0;
}

/* ===== 完成页 ===== */
.result-wrap {
  display: flex; flex-direction: column; align-items: center;
  justify-content: center; padding: 60px 20px; flex: 1;
}
.result-emoji { font-size: 64px; margin-bottom: 16px; }
.result-title { font-size: 22px; font-weight: 600; margin-bottom: 16px; color: #333; }
.result-info { font-size: 14px; color: #666; margin-bottom: 24px; text-align: center; }
.btn-big { padding: 14px; font-size: 15px; border-radius: 10px; width: 100%; max-width: 300px; margin-bottom: 10px; text-align: center; cursor: pointer; }
.btn-primary { background: #2E6BDF; color: #fff; border: none; border-radius: 10px; padding: 12px 24px; font-size: 14px; cursor: pointer; text-align: center; }
.btn-primary:active { opacity: 0.85; }
.btn-outline { background: #fff; border: 1px solid #2E6BDF; color: #2E6BDF; border-radius: 10px; padding: 12px 24px; font-size: 14px; cursor: pointer; text-align: center; }
.btn-outline:active { background: #f0f7ff; }
.btn-block { width: 100%; padding: 14px; font-size: 15px; border-radius: 10px; }

/* ===== 空状态 ===== */
.empty-state { text-align: center; padding: 50px 20px; color: #999; }
.empty-state .icon { font-size: 48px; margin-bottom: 10px; }
.empty-state .text { font-size: 13px; }

/* ===== 错题页 ===== */
.wrong-actions {
  display: flex; gap: 8px; padding: 10px 12px;
  background: #fff; border-bottom: 1px solid #f0f0f0;
  flex-shrink: 0;
}
.wrong-action-btn {
  flex: 1; padding: 10px 4px; border: none; border-radius: 10px;
  font-size: 13px; cursor: pointer; font-weight: 500;
  transition: transform 0.1s;
}
.wrong-action-btn:active { transform: scale(0.96); }
.wrong-btn-all { background: #e3f2fd; color: #1565c0; }
.wrong-btn-group { background: #fff3e0; color: #e65100; }
.wrong-card {
  background: #fff; border-radius: 10px; padding: 14px;
  margin-bottom: 8px; box-shadow: 0 1px 3px rgba(0,0,0,0.04);
  cursor: pointer; transition: transform 0.1s;
}
.wrong-card:active { transform: scale(0.98); }
.wrong-card-tags { display: flex; gap: 6px; margin-bottom: 6px; flex-wrap: wrap; }
.wrong-card-text {
  font-size: 14px; line-height: 1.7; color: #333;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;
  overflow: hidden;
}
.wrong-card-delete {
  margin-top: 8px; text-align: right;
}
.wrong-card-delete button {
  padding: 4px 12px; border: 1px solid #f44336; border-radius: 6px;
  background: #fff; color: #f44336; font-size: 12px; cursor: pointer;
}
.wrong-card-delete button:active { background: #ffebee; }

body.theme-dark .wrong-card { background: #16213e; }
body.theme-dark .wrong-card-text { color: #e0e0e0; }
body.theme-green .wrong-card { background: #e8f5e9; }
body.theme-green .wrong-card-text { color: #2d5a2d; }
body.theme-parchment .wrong-card { background: #fdf3e3; }
body.theme-parchment .wrong-card-text { color: #5c3d1a; }

/* 错题分组选择 */
.wrong-group-item {
  display: flex; align-items: center; gap: 8px;
  padding: 12px; border-radius: 8px; cursor: pointer;
  transition: 0.15s; margin-bottom: 4px;
}
.wrong-group-item:active { background: #f5f5f5; }
.wrong-group-label {
  font-size: 14px; font-weight: 500; color: #333;
  min-width: 60px;
}
.wrong-group-range {
  flex: 1; font-size: 13px; color: #999;
}
.wrong-group-item .arrow { color: #ccc; font-size: 16px; }

.cat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding: 10px 0; }
.cat-card {
  background: #fff; border-radius: 14px; padding: 20px 14px; text-align: center;
  box-shadow: 0 1px 4px rgba(0,0,0,0.06); cursor: pointer; transition: transform 0.1s;
  min-height: 100px; display: flex; flex-direction: column; align-items: center; justify-content: center;
}
.cat-card:active { transform: scale(0.95); }
.cat-card .icon { font-size: 36px; margin-bottom: 8px; }
.cat-card .name { font-size: 14px; font-weight: 500; color: #333; }
.cat-card .desc { font-size: 11px; color: #999; margin-top: 4px; }
.cat-card.selected { border: 2px solid #2E6BDF; background: #f0f7ff; }

/* ===== 登录页（保留原样） ===== */
#page-login { display:flex; align-items:center; justify-content:center; min-height:100vh; padding:20px; background:transparent; }
#page-login.active { display:flex; }
.login-box { background:#fff; border-radius:16px; padding:30px; width:100%; max-width:380px; box-shadow:0 2px 20px rgba(0,0,0,0.08); text-align:center; }
.login-box h1 { font-size:28px; margin-bottom:5px; }
.login-box .subtitle { color:#999; font-size:13px; margin-bottom:20px; }
.tab-bar { display:flex; margin-bottom:20px; border-radius:8px; overflow:hidden; border:1px solid #e0e0e0; }
.tab-btn { flex:1; padding:10px; border:none; background:#fff; font-size:14px; cursor:pointer; }
.tab-btn.active { background:#4a90d9; color:#fff; }
.login-box input { width:100%; padding:12px; margin-bottom:10px; border:1px solid #ddd; border-radius:8px; font-size:14px; }
.login-box input:focus { outline:none; border-color:#4a90d9; }
.error-msg { color:#f44336; font-size:13px; margin-top:8px; min-height:20px; }

/* ===== Toast ===== */
.toast {
  position: fixed; top: 40%; left: 50%; transform: translate(-50%, -50%);
  background: rgba(0,0,0,0.75); color: #fff; padding: 10px 20px;
  border-radius: 8px; font-size: 13px; z-index: 999;
  animation: toastAnim 2s ease forwards; pointer-events: none;
}
@keyframes toastAnim {
  0% { opacity: 0; transform: translate(-50%, -50%) scale(0.85); }
  10% { opacity: 1; transform: translate(-50%, -50%) scale(1); }
  80% { opacity: 1; }
  100% { opacity: 0; transform: translate(-50%, -50%) scale(0.85); }
}

/* ===== 收藏按钮 ===== */
.top-fav-btn {
  width: 36px; height: 36px; border: none; background: transparent;
  border-radius: 50%; font-size: 22px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  color: #666; transition: transform 0.15s;
}
.top-fav-btn:active { transform: scale(0.9); }
.top-fav-btn.favorited {
  color: #ffc107;
  text-shadow: 0 0 6px rgba(255, 193, 7, 0.5);
}

/* 收藏按钮 - 首页功能行 */
.func-fav { background: #fff8e1; color: #f9a825; }

/* 收藏列表页 */
.fav-list-empty {
  text-align: center; padding: 60px 20px; color: #999;
}
.fav-list-empty .icon { font-size: 48px; margin-bottom: 10px; }
.fav-list-empty .text { font-size: 13px; }
.fav-card {
  background: #fff; border-radius: 10px; padding: 14px;
  margin-bottom: 8px; box-shadow: 0 1px 3px rgba(0,0,0,0.04);
  cursor: pointer; transition: transform 0.1s;
}
.fav-card:active { transform: scale(0.98); }
.fav-card-tags { display: flex; gap: 6px; margin-bottom: 6px; flex-wrap: wrap; }
.fav-card-text {
  font-size: 14px; line-height: 1.7; color: #333;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;
  overflow: hidden;
}
.fav-card-remove {
  margin-top: 8px; text-align: right;
}
.fav-card-remove button {
  padding: 4px 12px; border: 1px solid #f44336; border-radius: 6px;
  background: #fff; color: #f44336; font-size: 12px; cursor: pointer;
}
.fav-card-remove button:active { background: #ffebee; }

body.theme-dark .fav-card { background: #16213e; }
body.theme-dark .fav-card-text { color: #e0e0e0; }
body.theme-green .fav-card { background: #e8f5e9; }
body.theme-green .fav-card-text { color: #2d5a2d; }
body.theme-parchment .fav-card { background: #fdf3e3; }
body.theme-parchment .fav-card-text { color: #5c3d1a; }

/* ===== Safe Area ===== */
@supports (padding-top: env(safe-area-inset-top)) {
  .home-header { padding-top: calc(14px + env(safe-area-inset-top)); }
  .practice-bottom-bar { padding-bottom: calc(8px + env(safe-area-inset-bottom)); }
}

/* ===== Gear Button ===== */
.gear-btn {
  background: none; border: none; font-size: 18px; cursor: pointer;
  padding: 4px; line-height: 1; margin-left: 2px;
}

/* ===== Settings Panel ===== */
.settings-panel { display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 2000; }
.settings-panel.open { display: block; }
.settings-overlay {
  position: absolute; top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0,0,0,0.4);
}
.settings-content {
  position: absolute; bottom: 0; left: 0; right: 0;
  background: #fff; border-radius: 16px 16px 0 0;
  padding: 20px; max-height: 70vh; overflow-y: auto;
  transform: translateY(100%); transition: transform 0.3s ease;
}
.settings-panel.open .settings-content { transform: translateY(0); }
.settings-header {
  font-size: 17px; font-weight: 600; margin-bottom: 20px;
  display: flex; justify-content: space-between; align-items: center;
}
.settings-close { background: none; border: none; font-size: 20px; cursor: pointer; color: #999; }
.settings-group { margin-bottom: 20px; }
.settings-label { font-size: 14px; font-weight: 500; margin-bottom: 10px; color: #333; }

/* Toggle Switch */
.switch { position: relative; display: inline-block; width: 48px; height: 26px; }
.switch input { opacity: 0; width: 0; height: 0; }
.slider {
  position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0;
  background: #ccc; border-radius: 26px; transition: 0.3s;
}
.slider::before {
  content: ''; position: absolute; height: 20px; width: 20px;
  left: 3px; bottom: 3px; background: #fff; border-radius: 50%; transition: 0.3s;
}
.switch input:checked + .slider { background: #1890ff; }
.switch input:checked + .slider::before { transform: translateX(22px); }

/* Theme Options */
.theme-options { display: flex; gap: 12px; flex-wrap: wrap; }
.theme-item {
  display: flex; flex-direction: column; align-items: center; gap: 4px;
  cursor: pointer; padding: 6px; border-radius: 8px; border: 2px solid transparent;
  transition: 0.2s;
}
.theme-item.active { border-color: #1890ff; background: #e6f7ff; }
.theme-preview { width: 40px; height: 40px; border-radius: 8px; }
.theme-item span { font-size: 11px; color: #666; }

/* Font Size Buttons */
.font-size-options { display: flex; gap: 10px; }
.font-size-btn {
  flex: 1; text-align: center; padding: 10px; border-radius: 8px;
  border: 1px solid #d9d9d9; background: #fafafa; cursor: pointer;
  font-size: 14px; color: #333; transition: 0.2s;
}
.font-size-btn.active { background: #1890ff; color: #fff; border-color: #1890ff; }

/* Font Slider */
.font-slider-row { display: flex; align-items: center; gap: 10px; }
.font-slider-row span { font-size: 12px; color: #999; min-width: 16px; }
.font-slider-row input[type=range] { flex: 1; height: 4px; -webkit-appearance: none; appearance: none; background: #ddd; border-radius: 2px; outline: none; }
.font-slider-row input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; width: 20px; height: 20px; border-radius: 50%; background: #1890ff; cursor: pointer; }
#font-size-label { float: right; font-size: 13px; color: #999; }
.settings-footer { text-align: center; font-size: 11px; color: #bbb; margin-top: 8px; }

/* ===== Themes ===== */
body.theme-dark { background: #1a1a2e; color: #e0e0e0; }
body.theme-dark .practice-scroll { background: #1a1a2e; }
body.theme-dark .question-card { background: #16213e; border-color: #0f3460; }
body.theme-dark .question-text { color: #e0e0e0; }
body.theme-dark .option { background: #1a2744; border-color: #0f3460; color: #ccc; }
body.theme-dark .option:hover { border-color: #1890ff; }
body.theme-dark .option.selected { background: #0f3460; border-color: #4da3ff; box-shadow: 0 0 0 2px rgba(77,163,255,0.2), inset 0 0 0 1px rgba(77,163,255,0.1); }
body.theme-dark .option.correct { background: #1b4332; border-color: #2d6a4f; }
body.theme-dark .option.wrong { background: #4a1a1a; border-color: #c0392b; }
body.theme-dark .option.missed { background: #3d2b0e; border-color: #e67e22; }
body.theme-dark .answer-box { background: #1a2744; border-color: #0f3460; }
body.theme-dark .practice-top { background: #16213e; border-color: #0f3460; }
body.theme-dark .practice-progress-bar { background: #0f3460; }
body.theme-dark .practice-bottom-bar { background: #16213e; border-top-color: #0f3460; }
body.theme-dark .exam-bottom-bar { background: #16213e; border-top-color: #0f3460; }
body.theme-dark .btn-prev, body.theme-dark .btn-next { background: #1a2744; color: #ccc; }
body.theme-dark .q-tag { background: #0f3460; }
body.theme-dark .btn-case-analysis { background: #1a2744; border-color: #1890ff; color: #1890ff; }
body.theme-dark .btn-case-analysis:hover { background: #0f3460; }
body.theme-dark #case-analysis-box { background: #1a2744; border-color: #0f3460; color: #e0e0e0; }
body.theme-dark .case-textarea { background: #1a2744; border-color: #0f3460; color: #e0e0e0; }
body.theme-dark .settings-content { background: #16213e; color: #e0e0e0; }
body.theme-dark .settings-label { color: #ccc; }
body.theme-dark .theme-item span { color: #999; }

body.theme-green { background: #c7edcc; color: #2d5a2d; }
body.theme-green .practice-scroll { background: #c7edcc; }
body.theme-green .question-card { background: #d4f5d9; border-color: #a8d8b0; }
body.theme-green .question-text { color: #2d5a2d; }
body.theme-green .option { background: #e0f5e4; border-color: #a8d8b0; }
body.theme-green .option.selected { background: #c8e6c9; border-color: #388e3c; box-shadow: 0 0 0 2px rgba(56,142,60,0.2), inset 0 0 0 1px rgba(56,142,60,0.1); }
body.theme-green .practice-top { background: #d4f5d9; }
body.theme-green .practice-progress-bar { background: #a8d8b0; }
body.theme-green .practice-bottom-bar { background: #d4f5d9; }
body.theme-green .exam-bottom-bar { background: #d4f5d9; }
body.theme-green .btn-prev, body.theme-green .btn-next { background: #e0f5e4; color: #2d5a2d; }
body.theme-green .settings-content { background: #d4f5d9; color: #2d5a2d; }
body.theme-green .btn-case-analysis { background: #e0f5e4; border-color: #5a9e6a; color: #2d5a2d; }
body.theme-green .btn-case-analysis:hover { background: #a8d8b0; }
body.theme-green #case-analysis-box { background: #e0f5e4; border-color: #a8d8b0; }
body.theme-green .case-textarea { background: #e0f5e4; border-color: #a8d8b0; color: #2d5a2d; }

body.theme-parchment { background: #f5e6c8; color: #5c3d1a; }
body.theme-parchment .practice-scroll { background: #f5e6c8; }
body.theme-parchment .question-card { background: #faedd8; border-color: #e0c9a0; }
body.theme-parchment .question-text { color: #5c3d1a; }
body.theme-parchment .option { background: #fdf3e3; border-color: #e0c9a0; }
body.theme-parchment .option.selected { background: #d4b896; border-color: #8d6e4a; box-shadow: 0 0 0 2px rgba(141,110,74,0.2), inset 0 0 0 1px rgba(141,110,74,0.1); }
body.theme-parchment .practice-top { background: #faedd8; }
body.theme-parchment .practice-progress-bar { background: #e0c9a0; }
body.theme-parchment .practice-bottom-bar { background: #faedd8; }
body.theme-parchment .exam-bottom-bar { background: #faedd8; }
body.theme-parchment .btn-prev, body.theme-parchment .btn-next { background: #fdf3e3; color: #5c3d1a; }
body.theme-parchment .settings-content { background: #faedd8; color: #5c3d1a; }

/* ===== 首页全局主题 ===== */
body.theme-dark .home-header { background: #16213e; }
body.theme-dark .home-title { color: #e0e0e0; }
body.theme-dark .home-subtitle { color: #888; }
body.theme-dark .chapter-card { background: #16213e; border-color: #0f3460; }
body.theme-dark .chapter-name { color: #e0e0e0; }
body.theme-dark .chapter-count { color: #888; }
body.theme-dark .chapter-progress-bar { background: #0f3460; }
body.theme-dark .home-tabs { background: #16213e; border-bottom-color: #0f3460; }
body.theme-dark .home-tab { color: #888; }
body.theme-dark .home-tab.active { background: #0f3460; color: #1890ff; }
body.theme-dark .sub-chapter { color: #aaa; }
body.theme-dark .sub-chapter:active { background: #1a2744; }
body.theme-dark .sub-chapters { border-top-color: #0f3460; }
body.theme-dark .subject-card { background: #16213e; border-color: #0f3460; }
body.theme-dark .subject-name { color: #e0e0e0; }
body.theme-dark .subject-count { color: #888; }
body.theme-dark .subject-card-name { color: #e0e0e0; }
body.theme-dark .subject-card-count { color: #888; }
body.theme-dark .subject-card-arrow { color: #555; }
body.theme-dark .subject-card-actions { border-top-color: #0f3460; }
body.theme-dark .action-link { color: #aaa; }
body.theme-dark .action-link + .action-link { border-left-color: #0f3460; }
body.theme-dark .sub-chapter-count { color: #666; }

body.theme-green .home-header { background: #d4f5d9; }
body.theme-green .home-title { color: #2d5a2d; }
body.theme-green .home-subtitle { color: #5a9e6a; }
body.theme-green .chapter-card { background: #d4f5d9; border-color: #a8d8b0; }
body.theme-green .chapter-name { color: #2d5a2d; }
body.theme-green .chapter-count { color: #5a9e6a; }
body.theme-green .chapter-progress-bar { background: #a8d8b0; }
body.theme-green .home-tabs { background: #d4f5d9; border-bottom-color: #a8d8b0; }
body.theme-green .home-tab { color: #5a9e6a; }
body.theme-green .home-tab.active { background: #a8d8b0; color: #2d5a2d; }
body.theme-green .sub-chapter { color: #3a7a3a; }
body.theme-green .subject-card { background: #d4f5d9; border-color: #a8d8b0; }
body.theme-green .subject-name { color: #2d5a2d; }
body.theme-green .subject-card-name { color: #2d5a2d; }
body.theme-green .subject-card-count { color: #5a9e6a; }
body.theme-green .subject-card-arrow { color: #a8d8b0; }
body.theme-green .subject-card-actions { border-top-color: #a8d8b0; }
body.theme-green .action-link { color: #3a7a3a; }
body.theme-green .action-link + .action-link { border-left-color: #a8d8b0; }

body.theme-parchment .home-header { background: #faedd8; }
body.theme-parchment .home-title { color: #5c3d1a; }
body.theme-parchment .home-subtitle { color: #8b6b3d; }
body.theme-parchment .chapter-card { background: #faedd8; border-color: #e0c9a0; }
body.theme-parchment .chapter-name { color: #5c3d1a; }
body.theme-parchment .chapter-count { color: #8b6b3d; }
body.theme-parchment .chapter-progress-bar { background: #e0c9a0; }
body.theme-parchment .home-tabs { background: #faedd8; border-bottom-color: #e0c9a0; }
body.theme-parchment .home-tab { color: #8b6b3d; }
body.theme-parchment .home-tab.active { background: #e0c9a0; color: #5c3d1a; }
body.theme-parchment .sub-chapter { color: #6b4f2a; }
body.theme-parchment .subject-card { background: #faedd8; border-color: #e0c9a0; }
body.theme-parchment .subject-name { color: #5c3d1a; }
body.theme-parchment .subject-card-name { color: #5c3d1a; }
body.theme-parchment .subject-card-count { color: #8b6b3d; }
body.theme-parchment .subject-card-arrow { color: #e0c9a0; }
body.theme-parchment .subject-card-actions { border-top-color: #e0c9a0; }
body.theme-parchment .action-link { color: #6b4f2a; }
body.theme-parchment .action-link + .action-link { border-left-color: #e0c9a0; }

/* ===== 首页科目卡片 ===== */
.subject-card {
  background: #fff; border-radius: 10px; margin-bottom: 8px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04); overflow: hidden;
}
.subject-card-main {
  display: flex; align-items: center; padding: 12px 14px; gap: 12px;
  cursor: pointer; transition: transform 0.1s;
}
.subject-card-main:active { transform: scale(0.98); }
.subject-card-icon {
  width: 40px; height: 40px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  font-size: 20px; flex-shrink: 0;
}
.subject-card-info { flex: 1; min-width: 0; }
.subject-card-name { font-size: 14px; font-weight: 500; color: #333; }
.subject-card-count { font-size: 12px; color: #999; margin-top: 2px; }
.subject-card-arrow { font-size: 18px; color: #ccc; }
.subject-card-actions {
  display: flex; border-top: 1px solid #f0f0f0; padding: 6px 14px;
}
.action-link {
  font-size: 12px; color: #666; cursor: pointer; padding: 4px 0; flex: 1;
  text-align: center; transition: 0.1s;
}
.action-link:active { opacity: 0.6; }
.action-link + .action-link { border-left: 1px solid #f0f0f0; }
body.theme-parchment .btn-case-analysis { background: #fdf3e3; border-color: #c4a87a; color: #5c3d1a; }
body.theme-parchment .btn-case-analysis:hover { background: #e0c9a0; }
body.theme-parchment #case-analysis-box { background: #fdf3e3; border-color: #e0c9a0; }
body.theme-parchment .case-textarea { background: #fdf3e3; border-color: #e0c9a0; color: #5c3d1a; }

/* ===== Answer Sheet ===== */
.sheet-overlay {
  position: fixed; top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0,0,0,0.5); z-index: 3000;
  display: flex; align-items: center; justify-content: center;
}
.sheet-panel {
  background: #fff; border-radius: 16px; width: 90%; max-width: 380px;
  max-height: 80vh; overflow-y: auto; box-shadow: 0 8px 40px rgba(0,0,0,0.15);
}
.sheet-header {
  padding: 16px; font-size: 16px; font-weight: 600;
  border-bottom: 1px solid #eee; display: flex; justify-content: space-between;
}
.sheet-count { font-size: 13px; font-weight: 400; color: #999; }
.sheet-grid {
  display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px;
  padding: 16px;
}
.sheet-cell {
  aspect-ratio: 1; display: flex; align-items: center; justify-content: center;
  border-radius: 8px; font-size: 13px; font-weight: 500; cursor: pointer;
  background: #f0f0f0; color: #666; border: 1px solid #e0e0e0;
  transition: 0.15s;
}
.sheet-cell:active { transform: scale(0.92); }
.sheet-single { border-radius: 8px; }
.sheet-multi { border-radius: 8px; }
.sheet-correct { background: #d4edda; color: #155724; border-color: #b8daff; }
.sheet-wrong { background: #f8d7da; color: #721c24; border-color: #f5c6cb; }
.sheet-partial {
  background: linear-gradient(135deg, #d4edda 50%, #f8d7da 50%);
  color: #333; border-color: #e0c9a0;
}
.sheet-empty { background: #f5f5f5; color: #bbb; border-color: #eee; }
.sheet-active { box-shadow: 0 0 0 2px #2E6BDF; position: relative; z-index: 1; }
.sheet-section-label {
  font-size: 13px; font-weight: 600; color: #666;
  padding: 8px 16px 4px;
}
.sheet-legend {
  display: flex; gap: 16px; justify-content: center;
  padding: 0 16px 16px; font-size: 12px; color: #666;
}
.dot { display: inline-block; width: 10px; height: 10px; margin-right: 4px; vertical-align: middle; }
.dot-square { border-radius: 3px; }
.dot-diamond { border-radius: 50%; }
.dot-green { background: #d4edda; }
.dot-red { background: #f8d7da; }
.dot-half { background: linear-gradient(135deg, #d4edda 50%, #f8d7da 50%); }
.dot-gray { background: #f0f0f0; }
.dot-orange { background: #ff9800; }

/* ===== 解析切换区域 ===== */
.analysis-toggle-area {
  padding: 14px; border-radius: 10px; margin-bottom: 8px;
  background: #f8f9fa; border: 1px solid #e0e0e0;
}
.analysis-content { }
.analysis-row { margin-bottom: 8px; }
.analysis-row:last-child { margin-bottom: 0; }
.analysis-label { font-weight: 600; color: #555; font-size: 13px; display: block; margin-bottom: 4px; }
.analysis-answer { color: #1E9C50; font-weight: 500; font-size: 14px; }
.analysis-body { font-size: 13px; line-height: 1.7; color: #444; }

/* ===== 题目底部操作栏 ===== */
.question-action-bar {
  display: flex; gap: 8px; padding: 14px 18px 10px;
  border-top: 1px solid #f0f0f0; justify-content: center;
  position: relative; margin-top: 6px;
  background: inherit; border-radius: 0 0 12px 12px;
}
.q-action-btn {
  display: flex; align-items: center; justify-content: center; gap: 4px;
  padding: 8px 16px; border: 1px solid #ddd; border-radius: 20px;
  background: #fff; font-size: 13px; cursor: pointer; color: #666;
  transition: all 0.15s; min-height: 36px;
}
.q-action-btn:active { background: #f5f5f5; transform: scale(0.95); }
.btn-analysis-toggle { border-color: #2E6BDF; color: #2E6BDF; flex: 1; }
.btn-analysis-toggle:active { background: #f0f7ff; }
.btn-redo {
  width: 36px; height: 36px; padding: 0; border-radius: 50%;
  font-size: 18px; flex-shrink: 0;
}

/* Dark theme */
body.theme-dark .analysis-toggle-area { background: #1a2744; border-color: #0f3460; }
body.theme-dark .analysis-label { color: #999; }
body.theme-dark .analysis-body { color: #ccc; }
body.theme-dark .question-action-bar { border-top-color: #0f3460; }
body.theme-dark .q-action-btn { background: #1a2744; border-color: #0f3460; color: #ccc; }
body.theme-dark .btn-analysis-toggle { border-color: #1890ff; color: #1890ff; }
body.theme-dark .btn-analysis-toggle:active { background: #0f3460; }

/* Green theme */
body.theme-green .analysis-toggle-area { background: #e0f5e4; border-color: #a8d8b0; }
body.theme-green .analysis-label { color: #3a7a3a; }
body.theme-green .analysis-body { color: #2d5a2d; }
body.theme-green .question-action-bar { border-top-color: #a8d8b0; }
body.theme-green .q-action-btn { background: #e0f5e4; border-color: #a8d8b0; color: #2d5a2d; }
body.theme-green .btn-analysis-toggle { border-color: #5a9e6a; color: #2d5a2d; }

/* Parchment theme */
body.theme-parchment .analysis-toggle-area { background: #fdf3e3; border-color: #e0c9a0; }
body.theme-parchment .analysis-label { color: #6b4f2a; }
body.theme-parchment .analysis-body { color: #5c3d1a; }
body.theme-parchment .question-action-bar { border-top-color: #e0c9a0; }
body.theme-parchment .q-action-btn { background: #fdf3e3; border-color: #e0c9a0; color: #5c3d1a; }
body.theme-parchment .btn-analysis-toggle { border-color: #c4a87a; color: #5c3d1a; }
.report-btn {
  display: block; width: 100%; margin-top: 10px; padding: 8px;
  background: #fff3e0; border: 1px solid #ffcc80; border-radius: 8px;
  color: #e65100; font-size: 13px; cursor: pointer; transition: 0.2s;
}
.report-btn:active { background: #ffe0b2; }

/* 讨论按钮 */
.discuss-btn {
  display: block; width: 100%; margin-top: 10px; padding: 8px;
  background: #e3f2fd; border: 1px solid #90caf9; border-radius: 8px;
  color: #1565c0; font-size: 13px; cursor: pointer; transition: 0.2s;
}
.discuss-btn:active { background: #bbdefb; }

body.theme-dark .discuss-btn { background: #1a2744; border-color: #1890ff; color: #1890ff; }
body.theme-dark .discuss-btn:active { background: #0f3460; }
body.theme-green .discuss-btn { background: #c8e6c9; border-color: #81c784; color: #2e7d32; }
body.theme-parchment .discuss-btn { background: #f5e6c8; border-color: #c4a87a; color: #5c3d1a; }
.report-panel { max-width: 340px; }

/* ===== Sheet Button ===== */
.btn-sheet {
  background: none; border: none; font-size: 22px; cursor: pointer;
  padding: 4px 8px; line-height: 1;
}

/* Dark theme overrides */
body.theme-dark .sheet-panel { background: #16213e; }
body.theme-dark .sheet-header { border-color: #0f3460; color: #e0e0e0; }
body.theme-dark .sheet-cell { background: #1a2744; color: #999; border-color: #0f3460; }
body.theme-dark .sheet-correct { background: #1b4332; color: #6fcf97; border-color: #2d6a4f; }
body.theme-dark .sheet-wrong { background: #4a1a1a; color: #eb5757; border-color: #8b1a1a; }
body.theme-dark .sheet-partial { background: linear-gradient(135deg, #1b4332 50%, #4a1a1a 50%); }
body.theme-dark .sheet-empty { background: #1a2744; color: #555; border-color: #0f3460; }
body.theme-dark .report-btn { background: #3d2a1a; border-color: #8d6e3a; color: #ffb74d; }

/* ===== 讨论区面板 ===== */
.discuss-panel {
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 2px 12px rgba(0,0,0,0.08);
  overflow: hidden;
}
.discuss-panel-header {
  padding: 10px 12px;
  font-size: 14px;
  font-weight: 600;
  border-bottom: 1px solid #f0f0f0;
  color: #333;
}
.discuss-item {
  padding: 10px 0;
}
.discuss-item + .discuss-item {
  border-top: 1px solid #f5f5f5;
}
.discuss-item-top {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 4px;
}
.discuss-del-btn {
  font-size: 10px;
  color: #f44336;
  border: none;
  background: none;
  cursor: pointer;
  padding: 0;
  line-height: 1;
  flex-shrink: 0;
}
.discuss-author {
  font-size: 12px;
  font-weight: 500;
  color: #1890ff;
}
.discuss-time {
  font-size: 11px;
  color: #bbb;
  margin-right: auto;
}
.discuss-hidden-tag {
  font-size: 11px;
  color: #ff9800;
}
.discuss-del-wrap {
  display: inline-flex;
  align-items: center;
  cursor: pointer;
  flex-shrink: 0;
}
.discuss-del-box {
  font-size: 11px;
  color: #f44336;
  border: 1px solid #f44336;
  border-radius: 3px;
  padding: 1px 5px;
  line-height: 1.4;
}
.discuss-content {
  font-size: 13px;
  line-height: 1.6;
  color: #e67e22;
  padding-left: 0;
}
.discuss-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 6px;
}
.discuss-like-btn, .discuss-dislike-btn {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 12px;
  color: #999;
  cursor: pointer;
  user-select: none;
}
.discuss-like-btn.active { color: #1890ff; }
.discuss-dislike-btn.active { color: #f44336; }
.discuss-like-btn:active, .discuss-dislike-btn:active { opacity: 0.6; }
.discuss-empty {
  text-align: center;
  padding: 12px;
  color: #999;
  font-size: 12px;
}

/* 讨论区主题适配 */
body.theme-dark .discuss-panel { background: #1a2744; }
body.theme-dark .discuss-panel-header { border-color: #0f3460; color: #e0e0e0; }
body.theme-dark .discuss-item + .discuss-item { border-color: #0f3460; }
body.theme-dark .discuss-author { color: #64b5f6; }
body.theme-dark .discuss-content { color: #ffb74d; }
body.theme-green .discuss-panel { background: #e8f5e9; }
body.theme-green .discuss-panel-header { border-color: #c8e6c9; color: #2e7d32; }
body.theme-green .discuss-item + .discuss-item { border-color: #c8e6c9; }
body.theme-green .discuss-author { color: #388e3c; }
body.theme-green .discuss-content { color: #e65100; }
body.theme-parchment .discuss-panel { background: #fdf3e3; }
body.theme-parchment .discuss-panel-header { border-color: #e0c9a0; color: #5c3d1a; }
body.theme-parchment .discuss-item + .discuss-item { border-color: #e0c9a0; }
body.theme-parchment .discuss-author { color: #6d4c41; }
body.theme-parchment .discuss-content { color: #bf360c; }

/* ===== 头像选择 ===== */
.drawer-avatar {
  width: 48px; height: 48px; border-radius: 50%; background: rgba(255,255,255,0.2);
  display: flex; align-items: center; justify-content: center; font-size: 24px; flex-shrink: 0;
  cursor: pointer; transition: 0.2s;
}
.drawer-avatar:active { transform: scale(0.92); }
.drawer-avatar img {
  width: 100%; height: 100%; border-radius: 50%; object-fit: cover;
}
.avatar-grid {
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px;
}
.avatar-option {
  width: 100%; aspect-ratio: 1; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 28px; cursor: pointer; border: 2px solid transparent;
  background: #f0f2f0; transition: 0.15s;
}
.avatar-option:active { transform: scale(0.9); }
.avatar-option.selected { border-color: #1890ff; background: #e6f7ff; }
body.theme-dark .avatar-option { background: #1a2744; }
body.theme-dark .avatar-option.selected { border-color: #64b5f6; background: #0f3460; }
body.theme-green .avatar-option { background: #e8f5e9; }
body.theme-green .avatar-option.selected { border-color: #388e3c; background: #c8e6c9; }
body.theme-parchment .avatar-option { background: #fdf3e3; }
body.theme-parchment .avatar-option.selected { border-color: #6d4c41; background: #f5e6c8; }

/* ===== 讨论区头像 ===== */
.discuss-avatar {
  width: 24px; height: 24px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 14px; flex-shrink: 0; overflow: hidden;
}
.discuss-avatar img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; }

/* ===== 模拟考试设置弹窗 ===== */
.exam-setup-overlay {
  position: fixed; top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0,0,0,0.5); z-index: 9999;
  display: flex; align-items: center; justify-content: center;
}
.exam-setup-panel {
  background: #fff; border-radius: 16px; width: 320px;
  padding: 24px; box-shadow: 0 8px 32px rgba(0,0,0,0.2);
}
.exam-setup-title {
  font-size: 18px; font-weight: 600; text-align: center;
  margin-bottom: 20px; color: #333;
}
.exam-setup-body {
  display: flex; flex-direction: column; gap: 16px; margin-bottom: 24px;
}
.exam-setup-row {
  display: flex; justify-content: space-between; align-items: center;
}
.exam-setup-label {
  font-size: 15px; color: #333; font-weight: 500;
}
.exam-setup-stepper {
  display: flex; align-items: center; gap: 12px;
}
.step-btn {
  width: 36px; height: 36px; border: 2px solid #2E6BDF;
  border-radius: 50%; background: #fff; color: #2E6BDF;
  font-size: 18px; cursor: pointer; display: flex;
  align-items: center; justify-content: center;
  transition: all 0.15s; line-height: 1;
}
.step-btn:active { background: #e3f2fd; transform: scale(0.9); }
.step-num {
  font-size: 22px; font-weight: 700; color: #2E6BDF;
  min-width: 40px; text-align: center;
}
.exam-setup-actions {
  display: flex; flex-direction: column; gap: 10px;
}
.exam-btn {
  padding: 14px; border-radius: 12px; border: none;
  font-size: 16px; font-weight: 600; cursor: pointer;
  transition: all 0.15s;
}
.exam-btn:active { transform: scale(0.97); }
.exam-btn-practice {
  background: #e3f2fd; color: #1565c0;
}
.exam-btn-exam {
  background: linear-gradient(135deg, #2E6BDF, #1a4fa0);
  color: #fff;
}

/* ===== 考试模式页面 ===== */
.exam-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 16px; background: linear-gradient(135deg, #2E6BDF, #1a4fa0);
  color: #fff; flex-shrink: 0;
}
.exam-timer {
  font-size: 24px; font-weight: 700; font-family: 'Courier New', monospace;
  letter-spacing: 2px;
}
.exam-submit-btn {
  padding: 8px 20px; border-radius: 8px; border: 2px solid #fff;
  background: transparent; color: #fff; font-size: 15px;
  font-weight: 600; cursor: pointer; transition: all 0.15s;
}
.exam-submit-btn:active {
  background: #fff; color: #2E6BDF;
}
.exam-progress-wrap {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 16px; background: #fff; flex-shrink: 0;
}
.exam-progress-bar { flex: 1; height: 4px; background: #eee; border-radius: 2px; overflow: hidden; }
.exam-progress-fill { height: 100%; background: #1E9C50; border-radius: 2px; transition: width 0.3s; }
.exam-progress-num { font-size: 11px; color: #999; white-space: nowrap; }
.exam-scroll {
  flex: 1; overflow-y: auto; -webkit-overflow-scrolling: touch;
  padding: 12px; background: #f0f2f0;
}
.sheet-section-title {
  font-size: 13px; font-weight: 600; color: #666;
  padding: 8px 16px 4px;
}
.exam-bottom-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 4px;
  padding: 8px 12px 10px;
  background: #fff; border-top: 1px solid #f0f0f0; flex-shrink: 0;
}
.exam-bottom-bar .btn-prev,
.exam-bottom-bar .btn-next {
  flex: 1;
  max-width: 90px;
  padding: 8px 4px;
  border: 1px solid #ddd;
  border-radius: 8px;
  background: #fff;
  font-size: 13px;
  color: #2E6BDF;
  cursor: pointer;
  text-align: center;
  white-space: nowrap;
}
.exam-bottom-bar .btn-prev:active,
.exam-bottom-bar .btn-next:active { background: #f0f7ff; }
.exam-bottom-bar .btn-prev:disabled,
.exam-bottom-bar .btn-next:disabled { opacity: 0.4; border-color: #eee; color: #bbb; }
.exam-bottom-bar .btn-sheet {
  width: 40px; height: 40px;
  border: none; border-radius: 50%;
  background: #f0f2f0;
  font-size: 18px;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
}
.exam-bottom-bar .btn-sheet:active { background: #e8edf5; }
.exam-bottom-bar .btn-submit {
  flex: 1;
  max-width: 160px;
  padding: 10px 20px;
  border: none; border-radius: 8px;
  background: #2E6BDF; color: #fff; font-size: 14px; font-weight: 500;
  cursor: pointer; text-align: center;
  white-space: nowrap;
}
.exam-bottom-bar .btn-submit:active { opacity: 0.85; }
.exam-bottom-bar button[disabled] {
  opacity: 0.4;
  pointer-events: none;
}

/* 考试模式下题目选项样式 - 隐藏答案 */
.exam-mode .option.correct, .exam-mode .option.wrong {
  border-color: #e8e8e8; background: transparent;
}
.exam-mode .option.correct .label, .exam-mode .option.wrong .label {
  color: #aaa;
}

/* 交卷确认弹窗 */
.exam-confirm-overlay {
  position: fixed; top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0,0,0,0.5); z-index: 9999;
  display: flex; align-items: center; justify-content: center;
}
.exam-confirm-panel {
  background: #fff; border-radius: 16px; width: 300px;
  padding: 24px; box-shadow: 0 8px 32px rgba(0,0,0,0.2);
  text-align: center;
}
.exam-confirm-title {
  font-size: 18px; font-weight: 600; margin-bottom: 12px;
}
.exam-confirm-info {
  font-size: 14px; color: #666; margin-bottom: 20px; line-height: 1.6;
}
.exam-confirm-actions {
  display: flex; gap: 12px; justify-content: center;
}
.exam-confirm-btn {
  padding: 10px 24px; border-radius: 10px; border: none;
  font-size: 15px; font-weight: 500; cursor: pointer;
  transition: all 0.15s;
}
.exam-confirm-btn:active { transform: scale(0.95); }
.exam-confirm-cancel {
  background: #f5f5f5; color: #666;
}
.exam-confirm-submit {
  background: #f44336; color: #fff;
}

/* ===== 快速搜题 ===== */
.search-input-wrap {
  flex: 1; margin: 0 8px; display: flex; align-items: center;
  background: #f0f2f5; border-radius: 8px; overflow: hidden;
}
.search-input-wrap input {
  flex: 1; padding: 10px 8px 10px 12px; border: none; background: transparent;
  font-size: 14px; outline: none;
}
.search-input-icon {
  font-size: 16px; margin-right: 4px; flex-shrink: 0;
}
.search-go-btn {
  padding: 10px 20px; border: none; background: #2E6BDF;
  color: #fff; font-size: 14px; cursor: pointer;
  white-space: nowrap; font-weight: 500; flex-shrink: 0;
}
.search-go-btn:active { background: #1a4fa0; }
.search-info {
  padding: 8px 16px; font-size: 13px; color: #999;
  flex-shrink: 0;
}
.search-result-card {
  background: #fff; border-radius: 10px; padding: 14px;
  margin-bottom: 8px; box-shadow: 0 1px 3px rgba(0,0,0,0.04);
}
.search-result-card:active { transform: scale(0.98); }
.search-result-tags {
  display: flex; gap: 6px; margin-bottom: 6px; flex-wrap: wrap;
}
.search-result-text {
  font-size: 14px; line-height: 1.7; color: #333;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;
  overflow: hidden;
}
.search-result-text .highlight {
  color: #e65100; font-weight: 600;
}
.page-scroll {
  flex: 1; overflow-y: auto; -webkit-overflow-scrolling: touch;
  padding: 0 12px 12px;
}
.search-pagination {
  display: flex; align-items: center; justify-content: center;
  gap: 12px; padding: 12px 16px; flex-shrink: 0;
  border-top: 1px solid #f0f0f0; background: #fff;
}
.search-page-btn {
  padding: 10px 24px; border: 1px solid #2E6BDF; border-radius: 8px;
  background: #fff; color: #2E6BDF; font-size: 14px; cursor: pointer;
  min-height: 40px; font-weight: 500;
}
.search-page-btn:active { background: #e3f2fd; }
.search-page-btn[disabled] {
  opacity: 0.3; pointer-events: none; border-color: #ddd; color: #999;
}
.search-page-info {
  font-size: 14px; color: #666; font-weight: 500;
}

/* ===== 统计页 ===== */
.stats-card {
  background: #fff; border-radius: 12px; padding: 16px;
  margin-bottom: 12px; box-shadow: 0 1px 4px rgba(0,0,0,0.05);
}
.stats-card-title {
  font-size: 15px; font-weight: 600; color: #333; margin-bottom: 12px;
}
.stats-card-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
}
.stats-card-item {
  text-align: center; padding: 12px 8px;
  background: #f8f9ff; border-radius: 10px;
}
.stats-card-num {
  font-size: 24px; font-weight: 700; color: #2E6BDF; display: block;
}
.stats-card-label {
  font-size: 12px; color: #999; margin-top: 4px; display: block;
}
.stats-card-sub {
  font-size: 11px; color: #bbb; margin-top: 2px; display: block;
}
.stats-full-item {
  display: flex; justify-content: space-between; align-items: center;
  padding: 10px 0; border-bottom: 1px solid #f5f5f5;
}
.stats-full-item:last-child { border-bottom: none; }
.stats-full-label { font-size: 14px; color: #666; }
.stats-full-num { font-size: 16px; font-weight: 600; color: #333; }

body.theme-dark .stats-card { background: #16213e; }
body.theme-dark .stats-card-title { color: #e0e0e0; }
body.theme-dark .stats-card-item { background: #1a2744; }
body.theme-dark .stats-card-label { color: #888; }
body.theme-dark .stats-full-item { border-bottom-color: #0f3460; }
body.theme-dark .stats-full-label { color: #999; }
body.theme-dark .stats-full-num { color: #e0e0e0; }
body.theme-green .stats-card { background: #e8f5e9; }
body.theme-green .stats-card-item { background: #c8e6c9; }
body.theme-parchment .stats-card { background: #fdf3e3; }
body.theme-parchment .stats-card-item { background: #f5e6c8; }

/* ===== 公告横幅 ===== */
.announce-banner {
  display: flex; align-items: center;
  background: linear-gradient(135deg, #667eea, #764ba2);
  color: #fff; font-size: 13px; padding: 6px 12px;
  height: 36px; overflow: hidden; flex-shrink: 0;
}
.announce-scroll-wrap {
  flex: 1; overflow: hidden; height: 22px; line-height: 22px;
}
.announce-scroll-text {
  display: inline-block; white-space: nowrap;
  animation: announce-scroll 20s linear infinite;
}
@keyframes announce-scroll {
  0% { transform: translateX(100%); }
  100% { transform: translateX(-100%); }
}
.announce-close {
  background: none; border: none; color: #fff; font-size: 16px;
  cursor: pointer; padding: 4px 8px; flex-shrink: 0;
  opacity: 0.8; margin-left: 8px;
}
.announce-close:hover { opacity: 1; }

body.theme-dark .announce-banner {
  background: linear-gradient(135deg, #1a237e, #311b92);
}
body.theme-green .announce-banner {
  background: linear-gradient(135deg, #2e7d32, #1b5e20);
}
body.theme-parchment .announce-banner {
  background: linear-gradient(135deg, #8d6e63, #6d4c41);
}


/* 错题列表 */
.wrong-list-header { padding: 16px; display: flex; justify-content: space-between; align-items: center; }
.wrong-list-header h3 { margin: 0; font-size: 18px; }
.wrong-list-actions { display: flex; gap: 8px; }
.btn-small { padding: 6px 14px; border: 1px solid #2E6BDF; border-radius: 6px; background: #2E6BDF; color: #fff; cursor: pointer; font-size: 13px; }
.wrong-list { padding: 0 16px 16px; }
.wrong-item { display: flex; align-items: center; padding: 10px 12px; border: 1px solid #eee; border-radius: 8px; margin-bottom: 8px; cursor: pointer; transition: background 0.2s; }
.wrong-item:hover { background: #f5f5f5; }
.wrong-index { color: #999; font-size: 13px; min-width: 28px; }
.wrong-question { flex: 1; font-size: 14px; color: #333; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wrong-type { font-size: 14px; margin-left: 8px; }
body.theme-dark .wrong-item { border-color: #333; }
body.theme-dark .wrong-item:hover { background: #2a2a2a; }
body.theme-dark .wrong-question { color: #ccc; }

/* 错题分组按钮 */
.wrong-groups { padding: 0 16px 12px; display: flex; flex-wrap: wrap; gap: 8px; }
.btn-group { background: #fff; color: #2E6BDF; border: 1px solid #2E6BDF; }
body.theme-dark .btn-group { background: #2a2a2a; color: #64b5f6; border-color: #64b5f6; }

/* ===== 资料分享 ===== */
.share-link-card {
  background: #fff;
  border-radius: 10px;
  padding: 14px 16px;
  margin: 8px 12px;
  box-shadow: 0 1px 4px rgba(0,0,0,0.08);
  cursor: pointer;
  transition: transform 0.15s, box-shadow 0.15s;
}
.share-link-card:active {
  transform: scale(0.98);
  box-shadow: 0 1px 2px rgba(0,0,0,0.06);
}
.share-link-title {
  font-size: 15px;
  font-weight: 600;
  color: #2E6BDF;
  margin-bottom: 4px;
}
.share-link-desc {
  font-size: 13px;
  color: #666;
  margin-bottom: 4px;
}
.share-link-url {
  font-size: 12px;
  color: #999;
  word-break: break-all;
}
.share-link-time {
  font-size: 11px;
  color: #bbb;
  margin-top: 4px;
}
body.theme-dark .share-link-card {
  background: #2a2a2a;
}
body.theme-dark .share-link-title {
  color: #64b5f6;
}
body.theme-dark .share-link-desc {
  color: #aaa;
}

/* ===== 考试统计 ===== */
.exam-stats-btn {
  display: block;
  width: calc(100% - 24px);
  margin: 10px 12px 4px;
  padding: 10px;
  background: linear-gradient(135deg, #667eea, #764ba2);
  color: #fff;
  border: none;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: transform 0.15s, box-shadow 0.15s;
  text-align: center;
}
.exam-stats-btn:active {
  transform: scale(0.97);
}

/* 考试记录卡片 */
.exam-record-card {
  background: #fff;
  border-radius: 10px;
  margin: 8px 12px;
  padding: 14px 16px;
  box-shadow: 0 1px 4px rgba(0,0,0,0.08);
  cursor: pointer;
  transition: transform 0.15s, box-shadow 0.15s;
}
.exam-record-card:active {
  transform: scale(0.98);
}
.exam-record-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}
.exam-record-date {
  font-size: 12px;
  color: #999;
}
.exam-record-passed {
  font-size: 12px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 10px;
}
.exam-record-passed.yes {
  background: #e8f5e9;
  color: #1E9C50;
}
.exam-record-passed.no {
  background: #ffebee;
  color: #f44336;
}
.exam-record-score {
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 4px;
}
.exam-record-score .max {
  font-size: 14px;
  font-weight: 400;
  color: #999;
}
.exam-record-detail {
  font-size: 13px;
  color: #666;
  line-height: 1.6;
}
body.theme-dark .exam-record-card {
  background: #2a2a2a;
}
body.theme-dark .exam-record-date {
  color: #888;
}
body.theme-dark .exam-record-detail {
  color: #aaa;
}
body.theme-dark .exam-record-score .max {
  color: #888;
}
body.theme-dark .exam-record-passed.yes {
  background: #1b3d1b;
}
body.theme-dark .exam-record-passed.no {
  background: #3d1b1b;
}

/* 考试详情页 - 每题回顾 */
.exam-detail-q {
  background: #fff;
  border-radius: 10px;
  margin: 8px 12px;
  padding: 14px 16px;
  box-shadow: 0 1px 4px rgba(0,0,0,0.08);
}
.exam-detail-q-num {
  font-size: 12px;
  color: #999;
  margin-bottom: 6px;
}
.exam-detail-q-text {
  font-size: 15px;
  line-height: 1.7;
  margin-bottom: 10px;
}
.exam-detail-q-answer {
  font-size: 13px;
  line-height: 1.6;
  margin-bottom: 4px;
}
.exam-detail-q-answer .label {
  color: #999;
  margin-right: 4px;
}
.exam-detail-q-answer .correct-text {
  color: #1E9C50;
  font-weight: 600;
}
.exam-detail-q-answer .wrong-text {
  color: #f44336;
  font-weight: 600;
}
.exam-detail-q-answer .partial-text {
  color: #ff9800;
  font-weight: 600;
}
.exam-detail-q-analysis {
  margin-top: 8px;
  padding: 10px;
  background: #f5f5f5;
  border-radius: 8px;
  font-size: 13px;
  color: #555;
  line-height: 1.6;
}
body.theme-dark .exam-detail-q {
  background: #2a2a2a;
}
body.theme-dark .exam-detail-q-text {
  color: #e0e0e0;
}
body.theme-dark .exam-detail-q-analysis {
  background: #333;
  color: #bbb;
}
body.theme-dark .exam-detail-q-num {
  color: #888;
}