/* ==========================================================================
 * 问渠 WenQu 个人主页质感增强（叠加在 style.min.css 之上，v10）
 * 仅作用于 app.html 看板区块：
 *   - 区块淡入错峰（配合 main.js 的 .reveal / .in-view）
 *   - 卡片精修：极细描边 + 分层阴影 + hover 上浮
 *   - 标题金色左饰线（纯排版边框，非自绘图形）
 *   - 周报 / 统计格语义色（对齐 App profile_page 配色）
 *   - 头像：真实图片保持圆形展示；无图 → 纯排版（不画「圆+首字」）
 *   - 成就：纯文字徽章（无圆徽、无首字），颜色/描边/透明度区分解锁态
 * 素材仍全部为站内/线上真实摄影；字体分层不变（WenQuSerif / WenQuSans / WenQuDisplay）。
 * ========================================================================== */

/* —— 区块淡入错峰（每个面板依次入场） —— */
#dash > .dash-panel.reveal {
  transition: opacity .65s ease, transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
#dash > .dash-panel.reveal:nth-child(1) { transition-delay: .02s; }
#dash > .dash-panel.reveal:nth-child(2) { transition-delay: .06s; }
#dash > .dash-panel.reveal:nth-child(3) { transition-delay: .10s; }
#dash > .dash-panel.reveal:nth-child(4) { transition-delay: .14s; }
#dash > .dash-panel.reveal:nth-child(5) { transition-delay: .18s; }
#dash > .dash-panel.reveal:nth-child(6) { transition-delay: .22s; }
#dash > .dash-panel.reveal:nth-child(7) { transition-delay: .26s; }
#dash > .dash-panel.reveal:nth-child(8) { transition-delay: .30s; }
#dash > .dash-panel.reveal:nth-child(9) { transition-delay: .34s; }
#dash > .dash-panel.reveal:nth-child(10) { transition-delay: .38s; }
@media (prefers-reduced-motion: reduce) {
  #dash > .dash-panel.reveal { transition: none; transition-delay: 0s; }
}

/* —— 卡片质感：极细描边 + 分层阴影 + hover 上浮 —— */
.dash-panel {
  border: 1px solid rgba(26, 35, 52, .05);
  box-shadow: 0 1px 2px rgba(26, 35, 52, .04), 0 10px 28px rgba(26, 35, 52, .08);
}
.dash-panel:hover {
  transform: translateY(-4px);
  box-shadow: 0 2px 6px rgba(26, 35, 52, .06), 0 22px 48px rgba(26, 35, 52, .14);
  border-color: rgba(184, 134, 59, .35);
}

/* —— 标题：金色左饰线（纯排版，拉高层次） —— */
.dash-panel-title {
  padding-left: 12px;
  border-left: 3px solid var(--gold);
  line-height: 1.35;
  letter-spacing: .02em;
}

/* 1 顶部用户卡 */
.dash-user { min-height: 168px; }
.dash-user-overlay {
  background: linear-gradient(180deg, rgba(26, 35, 52, .16) 0%, rgba(26, 35, 52, .5) 58%, rgba(26, 35, 52, .72) 100%);
}
.dash-user-inner { padding: 28px 24px; }
.dash-avatar-img {
  width: 64px;
  height: 64px;
  border: 2px solid rgba(255, 255, 255, .88);
  box-shadow: 0 6px 18px rgba(0, 0, 0, .3);
}
/* 无头像：纯排版，不画「圆+首字」 */
.dash-user-inner--plain { align-items: flex-start; }
.dash-user-inner--plain .dash-user-info { padding-left: 2px; }
.dash-user-inner--plain .dash-user-name { font-size: 1.62rem; letter-spacing: .02em; }
.dash-user-name { letter-spacing: .02em; }
.dash-user-meta { font-family: var(--display); letter-spacing: .04em; font-size: .9rem; }

/* 2 订阅卡 */
.sub-value { color: var(--gold-deep); }
.sub-mini {
  background: var(--paper);
  border: 1px solid var(--line);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.sub-mini:hover { transform: translateY(-2px); border-color: var(--gold); box-shadow: var(--shadow); }

/* 3 每日目标 */
.daily-num { color: var(--ink); letter-spacing: .01em; }
.daily-streak { color: var(--gold-deep); }
.progress-bar { background: var(--paper-2); }

/* 4 本周学习报告：头图 + 语义色 */
.week-head {
  position: relative;
  height: 64px;
  border-radius: 12px;
  overflow: hidden;
  margin: -8px 0 16px;
  display: flex;
  align-items: flex-end;
}
.week-head-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.week-head-overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(26, 35, 52, .62), rgba(26, 35, 52, .22)); }
.week-head-title {
  position: relative;
  z-index: 2;
  margin: 0 0 8px 14px;
  padding: 0;
  border-left: 0;
  color: #fff;
  font-size: 1.05rem;
  text-shadow: 0 1px 10px rgba(0, 0, 0, .4);
}
.week-value.wk-blue { color: #2456b3; }
.week-value.wk-green { color: var(--ok); }
.week-value.wk-amber { color: #a97a14; }
.week-value.wk-orange { color: #c2611a; }

/* 5 学科能力分 */
.ability-bar { padding-bottom: 2px; }
.ability-score { color: var(--gold-deep); }

/* 6 学习统计 3×3：语义色对齐 App _StatCard */
.stat-cell { border: 1px solid rgba(26, 35, 52, .04); }
.stat-num.acc-blue { color: #2456b3; }
.stat-num.acc-green { color: var(--ok); }
.stat-num.acc-orange { color: #c2611a; }
.stat-num.acc-amber { color: #a97a14; }
.stat-num.acc-purple { color: #7a4fb0; }
.stat-num.acc-red { color: var(--danger); }
.stat-num.acc-cyan { color: #177a8a; }
.stat-num.acc-teal { color: #1f7a6b; }

/* 7 训练记录 */
.hist-item { transition: transform .16s ease, box-shadow .16s ease; }
.hist-item:hover { transform: translateX(3px); box-shadow: var(--shadow); }
.hist-sub { font-family: var(--serif); font-weight: 700; }

/* 8 成就徽章：纯文字徽章，无圆徽、无首字 */
.ach-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(158px, 1fr)); gap: 12px; }
.ach-badge {
  background: rgba(184, 134, 59, .08);
  border: 1px solid rgba(184, 134, 59, .42);
  border-radius: 12px;
  padding: 14px 16px;
  text-align: left;
  width: auto;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.ach-badge:hover { transform: translateY(-2px); box-shadow: var(--shadow); border-color: var(--gold); }
.ach-badge-name {
  display: block;
  font-family: var(--serif);
  font-weight: 700;
  font-size: .96rem;
  color: var(--gold-deep);
  margin-bottom: 5px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ach-badge-status {
  display: inline-block;
  font-size: .74rem;
  font-weight: 700;
  letter-spacing: .1em;
  color: var(--ok);
}
.ach-badge.locked {
  background: rgba(26, 35, 52, .03);
  border: 1px dashed var(--line);
  opacity: .72;
}
.ach-badge.locked:hover { border-color: var(--muted); }
.ach-badge.locked .ach-badge-name { color: var(--muted); }
.ach-badge.locked .ach-badge-status { color: var(--muted); }

/* 9 能力成长趋势 */
.trend-wrap { padding: 2px 0; }
.trend-max { color: var(--gold-deep); }

/* 10 近期薄弱点 */
.weak-list { display: flex; flex-direction: column; gap: 8px; }
.weak-item {
  color: var(--ink-soft);
  font-size: .93rem;
  margin: 0;
  padding-left: 15px;
  position: relative;
}
.weak-item::before {
  content: "·";
  position: absolute;
  left: 0;
  color: var(--gold);
  font-weight: 700;
}

/* —— 移动端：成就徽章单列更舒适 —— */
@media (max-width: 640px) {
  .ach-grid { grid-template-columns: repeat(auto-fill, minmax(128px, 1fr)); gap: 10px; }
  .dash-user-inner { padding: 24px 20px; }
}