/* v21 UI polish — explanation source tags, honest listening, real home modules, option states */

/* 解析来源 / AI 标签 */
.mini-explain-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 6px;
}
.exp-tag {
  font-size: 11px;
  font-weight: 600;
  padding: 2px 9px;
  border-radius: 999px;
  white-space: nowrap;
}
.exp-tag-ai {
  background: #fff4e5;
  color: #9a5b00;
  border: 1px solid #ffd699;
}
.exp-tag-source {
  background: #e7f5ec;
  color: #1a7a3c;
  border: 1px solid #a9dcbb;
}

/* 听力：无真实音频时的诚实占位（绝不画假波形） */
.audio-pending {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 16px 18px;
  border: 1px dashed var(--line, #e2e8f0);
  border-radius: 14px;
  color: var(--muted, #64748b);
  font-weight: 600;
  background: var(--surface-2, #f8fafc);
}
.audio-pending-ico { font-size: 22px; }
.audio-prompt-v21 audio { width: 100%; height: 40px; margin-top: 4px; }

/* 首页真实模块（数据来自 state.stats.byDay） */
.home-recent-empty {
  color: var(--muted, #64748b);
  font-size: 13px;
  padding: 10px 0;
}
.home-recent-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 0;
  border-top: 1px solid var(--line, #e2e8f0);
}
.home-recent-item b { font-size: 13px; font-weight: 600; color: var(--ink, #0f172a); }
.home-recent-item small { font-size: 12px; color: var(--muted, #64748b); }
.mini-week-bars {
  display: flex;
  align-items: flex-end;
  gap: 6px;
  height: 48px;
  margin: 12px 0;
}
.mini-week-bars i {
  flex: 1;
  background: var(--line, #e2e8f0);
  border-radius: 4px 4px 0 0;
  min-height: 8%;
  transition: height .2s;
}
.mini-week-bars i.active { background: var(--primary, #4f46e5); }

/* 题卡可读性 + 选项状态（温和增强，覆盖层） */
#questionPrompt.prompt { line-height: 1.9; }
.option-btn { transition: border-color .15s, background .15s, transform .05s; }
.option-btn:not([disabled]):hover { border-color: var(--primary, #4f46e5); }
.option-btn:not([disabled]):active { transform: scale(.995); }
.option-btn.correct { border-color: var(--good, #16a34a); background: #eefaf1; }
.option-btn.incorrect { border-color: var(--bad, #ef4444); background: #fdeeee; }

/* 移动端：右栏跟在题卡下方，音频与长文自适应 */
@media (max-width: 880px) {
  .right-rail { margin-top: 16px; }
  .audio-prompt audio { width: 100%; }
}

/* 桌面端阅读：长文章独立滚动，问题区不被超长文章顶飞 */
@media (min-width: 881px) {
  #questionPrompt.split-layout .prompt-passage-pane {
    max-height: 62vh;
    overflow: auto;
  }
}