/* ============================================================
   rs-home.css — 学术风个人主页 for Hexo Butterfly 5.3.5
   ------------------------------------------------------------
   作用域：所有规则均以 .rs-home 开头，不污染文章页 / 归档页。
   依赖：仅使用 Butterfly 真实存在的 CSS 变量（见 _global/index.styl
         与 _mode/darkmode.styl）。无 JS、无外链字体、无外链图片。

   使用到的主题变量（已核对源码）：
     --default-bg-color   主题色 #49B1F5（亮/暗模式都不变 → 唯一可靠强调色）
     --card-bg            #fff / #121212
     --font-color         #4C4948 / rgba(255,255,255,.7)
     --text-highlight-color  #1F2D3D / rgba(255,255,255,.9)
     --dark-grey          #cacaca / rgba(255,255,255,.2)  → 描边用它
     --card-meta          #858585（两个模式一致）        → 次要文字
     --btn-bg/--btn-color 亮色是主题色，暗色会变成深灰 → 强调色不能用它

   ⚠ 两个必须绕开的坑：
     1) --light-grey 在暗色模式下被反转为 rgba(255,255,255,.7)，
        当描边会变成刺眼亮线。本文件一律用 --dark-grey 做描边。
     2) 主题给 .container img 加了 margin-bottom:20px、圆角，
        且暗色模式下 img{filter:brightness(.8)}。下面已逐条复位。
   ============================================================ */

/* top_img: false 时 page.pug 会额外渲染一个 .page-title（"吴金科"），
   首页的 hero 里已经有名字了，这里隐掉。<title> 标签不受影响。 */
#body-wrap.type-resume .page-title { display: none; }

/* 简历页做成独立的一页：不显示站点标题 "Wuuu!" 和导航菜单。
   nav.fixed 为 false，#page-header 在普通文档流里，直接隐藏不会塌布局，
   补回它原本占的 60px + 10px margin 即可。
   （其他页面 —— /blog/、文章页、归档 —— 的导航栏不受影响。） */
#body-wrap.type-resume #page-header { display: none; }
#body-wrap.type-resume #content-inner.layout { padding-top: 50px; }

/* ---------- 局部 token 层：把主题变量映射成语义名 ---------- */
.rs-home {
  /* 装饰用强调色（竖线、圆点、边框）——主题色 #49B1F5 当文字只有 2.36:1，不达 AA */
  --rs-accent: var(--default-bg-color);
  /* 文字用强调色：#1273b8 在白底上 5.03:1，过 AA */
  --rs-accent-text: #1273b8;
  --rs-accent-solid: #1273b8;
  --rs-btn-primary-fg: #fff;
  --rs-ink: var(--text-highlight-color);
  --rs-body: var(--font-color);
  /* --card-meta (#858585) 在白底只有 3.69:1，次要文字换成 5.33:1 的 #6b6b6b */
  --rs-muted: #6b6b6b;
  --rs-line: var(--dark-grey);
  /* 按钮这类交互控件的描边要过 WCAG 1.4.11 的 3:1；--dark-grey 只有 1.64:1 */
  --rs-line-strong: #8f8f8f;
  --rs-surface: rgba(31, 45, 61, .035);
  --rs-surface-hover: rgba(31, 45, 61, .06);

  --rs-gap: 42px;
  --rs-radius: 6px;

  color: var(--rs-body);
  line-height: 1.75;
}

[data-theme='dark'] .rs-home {
  --rs-accent-text: var(--default-bg-color);  /* 7.93:1 on #121212 */
  --rs-accent-solid: var(--default-bg-color);
  --rs-btn-primary-fg: #10161c;               /* 暗色下主按钮配深字，白字同样只有 2.36:1 */
  --rs-muted: var(--card-meta);               /* #858585 在 #121212 上 5.08:1，够用 */
  --rs-line-strong: rgba(255, 255, 255, .42);
  --rs-surface: rgba(255, 255, 255, .045);
  --rs-surface-hover: rgba(255, 255, 255, .08);
}

/* ---------- 复位主题在 .container 里注入的排版 ---------- */
.rs-home a { color: inherit; text-decoration: none; }
.rs-home a:hover { text-decoration: none; }
.rs-home p { margin: 0; }
.rs-home ul,
.rs-home ol { margin: 0; padding: 0; list-style: none; }
.rs-home li { margin: 0; }
.rs-home li::marker { content: none; }
.rs-home img { display: block; margin: 0; max-width: 100%; border-radius: 0; }
/* 暗色模式主题会把所有 img 调暗 20%，证件照必须还原 */
[data-theme='dark'] .rs-home img { filter: none; }
.rs-home > :last-child { margin-bottom: 0; }

/* ============================================================
   1. HERO
   ============================================================ */
.rs-hero {
  display: grid;
  grid-template-columns: 132px 1fr;
  gap: 30px;
  align-items: center;
  padding-bottom: var(--rs-gap);
  border-bottom: 1px solid var(--rs-line);
}

.rs-portrait {
  width: 132px;
  height: 176px;              /* 证件照 3:4 */
  overflow: hidden;
  border: 1px solid var(--rs-line);
  border-radius: var(--rs-radius);
  background: var(--rs-surface);
}

.rs-portrait img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.rs-name {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 6px;
}

.rs-name-cn {
  margin: 0;
  color: var(--rs-ink);
  font-size: 1.85em;
  font-weight: 700;
  letter-spacing: .04em;
  line-height: 1.3;
}

.rs-name-en {
  color: var(--rs-muted);
  font-size: 1em;
  font-weight: 400;
  letter-spacing: .08em;
}

.rs-tagline {
  margin-bottom: 4px !important;
  color: var(--rs-body);
  font-size: 1.02em;
}

.rs-tagline .rs-em {
  color: var(--rs-ink);
  font-weight: 600;
}

/* 定位/兴趣：用 · 分隔的次要行 */
.rs-affil {
  margin-bottom: 18px !important;
  color: var(--rs-muted);
  font-size: .92em;
}

/* ---------- 按钮组 ---------- */
.rs-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.rs-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 16px;
  border: 1px solid var(--rs-line-strong);
  border-radius: var(--rs-radius);
  color: var(--rs-body);
  font-size: .9em;
  line-height: 1.6;
  transition: border-color .2s, background-color .2s, color .2s;
}

.rs-btn:hover {
  border-color: var(--rs-accent-text);
  color: var(--rs-accent-text);
  background: var(--rs-surface);
}

/* 主按钮：不能用 --btn-bg —— 它在暗色模式会被主题改成深灰，按钮会“消失”。 */
.rs-btn--primary {
  border-color: var(--rs-accent-solid);
  background: var(--rs-accent-solid);
  color: var(--rs-btn-primary-fg);
}

.rs-btn--primary:hover {
  background: var(--rs-accent-solid);
  color: var(--rs-btn-primary-fg);
  filter: brightness(1.08);
}

/* ============================================================
   2. 区块通用
   ============================================================ */
.rs-section { margin-top: var(--rs-gap); }

.rs-h2 {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 18px !important;
  color: var(--rs-ink);
  font-size: 1.12em;
  font-weight: 700;
  letter-spacing: .06em;
}

/* 左侧一根 2px 的强调竖线，替代花哨图标 */
.rs-h2::before {
  content: '';
  display: block;
  width: 3px;
  height: 1em;
  border-radius: 2px;
  background: var(--rs-accent);
}

.rs-h2 .rs-h2-en {
  color: var(--rs-muted);
  font-size: .78em;
  font-weight: 400;
  letter-spacing: .1em;
  text-transform: uppercase;
}

/* ============================================================
   3. 教育背景 + 数字卡片
   ============================================================ */
.rs-edu {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 4px 16px;
  margin-bottom: 18px;
}

.rs-edu-school {
  color: var(--rs-ink);
  font-size: 1.02em;
  font-weight: 600;
}

.rs-edu-major { color: var(--rs-body); }

.rs-edu-date {
  color: var(--rs-muted);
  font-size: .88em;
  font-variant-numeric: tabular-nums;
}

.rs-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
  gap: 12px;
}

.rs-stat {
  padding: 14px 16px;
  border: 1px solid var(--rs-line);
  border-radius: var(--rs-radius);
  background: var(--rs-surface);
  text-align: center;
  transition: border-color .2s, background-color .2s;
}

.rs-stat:hover {
  border-color: var(--rs-accent);
  background: var(--rs-surface-hover);
}

.rs-stat-num {
  color: var(--rs-ink);
  font-size: 1.5em;
  font-weight: 700;
  line-height: 1.25;
  font-variant-numeric: tabular-nums;
  letter-spacing: .01em;
}

.rs-stat-num .rs-stat-unit {
  color: var(--rs-muted);
  font-size: .58em;
  font-weight: 500;
}

.rs-stat-label {
  margin-top: 2px;
  color: var(--rs-muted);
  font-size: .82em;
  line-height: 1.5;
}

/* 核心课程：一行紧凑的次要信息 */
.rs-courses {
  margin-top: 14px !important;
  color: var(--rs-muted);
  font-size: .88em;
  line-height: 1.8;
}

.rs-courses-label {
  margin-right: 10px;
  padding: 1px 7px;
  border: 1px solid var(--rs-line);
  border-radius: 3px;
  font-size: .92em;
  white-space: nowrap;
}

/* ============================================================
   4. 科研成果
   ============================================================ */
.rs-pubs { display: flex; flex-direction: column; gap: 4px; }

.rs-pub {
  display: grid;
  grid-template-columns: 108px 1fr;
  gap: 16px;
  padding: 14px 12px;
  border-radius: var(--rs-radius);
  border-left: 2px solid transparent;
  transition: background-color .2s, border-color .2s;
}

.rs-pub:hover {
  border-left-color: var(--rs-accent);
  background: var(--rs-surface);
}

.rs-pub-venue { padding-top: 2px; }

.rs-pub-title {
  margin-bottom: 4px !important;
  color: var(--rs-ink);
  font-size: 1em;
  font-weight: 600;
  line-height: 1.6;
}

.rs-pub-authors {
  color: var(--rs-muted);
  font-size: .88em;
  line-height: 1.6;
}

/* 作者列表里高亮“我” */
.rs-pub-authors .rs-me {
  color: var(--rs-body);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
}

/* 投稿状态：已录用用主题色实心点，其余为次要灰 */
.rs-pub-status {
  margin-top: 3px !important;
  color: var(--rs-muted);
  font-size: .82em;
  letter-spacing: .02em;
}

.rs-pub-status::before {
  content: '';
  display: inline-block;
  width: 5px;
  height: 5px;
  margin-right: 7px;
  border: 1px solid var(--rs-muted);
  border-radius: 50%;
  vertical-align: 2px;
}

.rs-pub-status.is-accepted {
  color: var(--rs-accent-text);
  font-weight: 600;
}

.rs-pub-status.is-accepted::before {
  border-color: var(--rs-accent);
  background: var(--rs-accent);
}

.rs-pub-desc {
  margin-top: 7px !important;
  color: var(--rs-body);
  font-size: .9em;
  line-height: 1.75;
}

.rs-pub-links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 6px;
}

.rs-pub-links a {
  color: var(--rs-muted);
  font-size: .82em;
  border-bottom: 1px solid var(--rs-line);
  transition: color .2s, border-color .2s;
}

.rs-pub-links a:hover {
  color: var(--rs-accent-text);
  border-color: var(--rs-accent);
}

/* 共同一作等脚注 */
.rs-note {
  margin-top: 14px !important;
  padding-left: 12px;
  color: var(--rs-muted);
  font-size: .82em;
}

/* ---------- 会议 badge ---------- */
.rs-badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 4px;
  background: var(--rs-badge-bg, var(--rs-surface));
  color: var(--rs-badge-fg, var(--rs-body));
  font-size: .76em;
  font-weight: 700;
  letter-spacing: .04em;
  line-height: 1.7;
  white-space: nowrap;
}

/* 会议配色：低饱和、克制。新增会议照此加一组即可。 */
.rs-badge.is-ijcai   { --rs-badge-fg: #4338ca; --rs-badge-bg: #e9eafc; }
.rs-badge.is-mm      { --rs-badge-fg: #b03060; --rs-badge-bg: #fbe9f0; }
.rs-badge.is-neurips { --rs-badge-fg: #1d6f5c; --rs-badge-bg: #e3f4ee; }
.rs-badge.is-icde    { --rs-badge-fg: #9a5b12; --rs-badge-bg: #fdf0df; }
.rs-badge.is-aaai    { --rs-badge-fg: #9a5b12; --rs-badge-bg: #fdf0df; }
.rs-badge.is-review  { --rs-badge-fg: #5b6470; --rs-badge-bg: #eef0f2; }
.rs-badge.is-arxiv   { --rs-badge-fg: #5b6470; --rs-badge-bg: #eef0f2; }

[data-theme='dark'] .rs-badge.is-ijcai   { --rs-badge-fg: #a5b4fc; --rs-badge-bg: rgba(99, 102, 241, .16); }
[data-theme='dark'] .rs-badge.is-mm      { --rs-badge-fg: #f0a4c4; --rs-badge-bg: rgba(219, 96, 148, .16); }
[data-theme='dark'] .rs-badge.is-neurips { --rs-badge-fg: #7fd3ba; --rs-badge-bg: rgba(45, 168, 137, .16); }
[data-theme='dark'] .rs-badge.is-icde    { --rs-badge-fg: #e8b878; --rs-badge-bg: rgba(200, 130, 40, .16); }
[data-theme='dark'] .rs-badge.is-aaai    { --rs-badge-fg: #e8b878; --rs-badge-bg: rgba(200, 130, 40, .16); }
[data-theme='dark'] .rs-badge.is-review  { --rs-badge-fg: #b4bcc6; --rs-badge-bg: rgba(255, 255, 255, .08); }
[data-theme='dark'] .rs-badge.is-arxiv   { --rs-badge-fg: #b4bcc6; --rs-badge-bg: rgba(255, 255, 255, .08); }

/* 一作 / 共一 标记 */
.rs-tag {
  display: inline-block;
  margin-left: 6px;
  padding: 0 6px;
  border: 1px solid var(--rs-line);
  border-radius: 3px;
  color: var(--rs-muted);
  font-size: .72em;
  font-weight: 500;
  letter-spacing: .03em;
  line-height: 1.7;
  vertical-align: 2px;
  white-space: nowrap;
}

.rs-tag--first {
  border-color: var(--rs-accent);
  color: var(--rs-accent-text);
}

/* ============================================================
   5. 奖项荣誉（左栏奖学金 / 右栏竞赛，与简历排版一致）
   ============================================================ */
.rs-awards {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr);
  gap: 8px 36px;
  align-items: start;
}

.rs-award-col li {
  position: relative;
  padding: 6px 0 6px 15px;
  color: var(--rs-body);
  line-height: 1.7;
}

/* 项目符号（主题的 list-style 已在顶部 reset 掉了，这里自己画） */
.rs-award-col li::before {
  content: '';
  position: absolute;
  top: .82em;
  left: 0;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--rs-accent);
}

.rs-award-col .rs-lv {
  margin-left: 8px;
  color: var(--rs-accent-text);
  font-size: .78em;
  white-space: nowrap;
}

/* ============================================================
   6. 项目经历
   ============================================================ */
.rs-projects { display: flex; flex-direction: column; gap: 4px; }

.rs-project {
  padding: 14px 12px;
  border-radius: var(--rs-radius);
  border-left: 2px solid transparent;
  transition: background-color .2s, border-color .2s;
}

.rs-project:hover {
  border-left-color: var(--rs-accent);
  background: var(--rs-surface);
}

.rs-project-head {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 4px 10px;
  margin-bottom: 4px;
}

.rs-project-name {
  color: var(--rs-ink);
  font-weight: 600;
  transition: color .2s;
}

a.rs-project-name:hover { color: var(--rs-accent-text); }

.rs-extlink {
  margin-left: 6px;
  font-size: .72em;
  vertical-align: 1px;
  opacity: .65;
}

.rs-project-role,
.rs-project-date {
  color: var(--rs-muted);
  font-size: .85em;
}

.rs-project-date { margin-left: auto; font-variant-numeric: tabular-nums; }

.rs-project-desc {
  color: var(--rs-body);
  font-size: .93em;
  line-height: 1.75;
}

.rs-stack {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}

.rs-stack span {
  padding: 1px 8px;
  border: 1px solid var(--rs-line);
  border-radius: 3px;
  color: var(--rs-muted);
  font-size: .76em;
  line-height: 1.7;
}

/* ============================================================
   7. 最近文章
   ============================================================ */
.rs-posts { display: flex; flex-direction: column; }

.rs-post {
  display: flex;
  align-items: baseline;
  gap: 14px;
  padding: 9px 0;
  border-bottom: 1px dashed var(--rs-line);
  transition: color .2s;
}

.rs-post:last-child { border-bottom: none; }
.rs-post:hover .rs-post-title { color: var(--rs-accent-text); }

.rs-post-date {
  flex: none;
  color: var(--rs-muted);
  font-size: .85em;
  font-variant-numeric: tabular-nums;
}

.rs-post-title {
  color: var(--rs-body);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  transition: color .2s;
}

.rs-more {
  margin-top: 16px;
  color: var(--rs-muted);
  font-size: .88em;
}

.rs-more a {
  color: var(--rs-accent-text);
  border-bottom: 1px solid transparent;
  transition: border-color .2s;
}

.rs-more a:hover { border-bottom-color: var(--rs-accent); }

/* ============================================================
   8. 响应式：手机端单列
   ============================================================ */
@media screen and (max-width: 768px) {
  .rs-home { --rs-gap: 32px; }

  .rs-hero {
    grid-template-columns: 1fr;
    justify-items: center;
    gap: 20px;
    text-align: center;
  }

  .rs-portrait { width: 112px; height: 150px; }

  .rs-name { justify-content: center; gap: 8px; }
  .rs-name-cn { font-size: 1.6em; }

  .rs-actions { justify-content: center; }
  .rs-btn { flex: 1 1 auto; justify-content: center; min-width: 44%; }

  /* 论文：badge 换到标题上方 */
  .rs-pub {
    grid-template-columns: 1fr;
    gap: 8px;
    padding: 14px 10px;
  }

  /* 奖项：两栏叠成一栏 */
  .rs-awards { grid-template-columns: 1fr; gap: 0; }

  .rs-project-date { margin-left: 0; }

  .rs-stats { grid-template-columns: repeat(2, 1fr); }

  /* 手机上标题被省略号截掉太难看，改成换行（最多两行） */
  .rs-post {
    align-items: flex-start;
    gap: 10px;
  }

  .rs-post-date { font-size: .8em; }

  .rs-post-title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    white-space: normal;
    line-height: 1.5;
  }
}

@media screen and (max-width: 380px) {
  .rs-stats { grid-template-columns: 1fr; }
  .rs-btn { min-width: 100%; }
}

/* ============================================================
   9. 打印（简历直接 Ctrl+P 也不难看）
   ============================================================ */
@media print {
  /* data-theme="dark" 在打印时依然挂在 <html> 上，而浏览器默认不打印背景色，
     不强制回到亮色 token 就是白纸白字。 */
  .rs-home,
  [data-theme='dark'] .rs-home {
    --rs-ink: #1f2d3d;
    --rs-body: #333;
    --rs-muted: #555;
    --rs-line: #bbb;
    --rs-line-strong: #999;
    --rs-accent: #1273b8;
    --rs-accent-text: #1273b8;
    --rs-surface: transparent;
    --rs-surface-hover: transparent;
    color: #333;
  }

  .rs-posts,
  .rs-more { display: none; }

  /* 邮箱是简历上最关键的一行，不能连按钮一起隐藏 —— 降级成纯文本 */
  .rs-btn {
    margin-right: 18px;
    padding: 0;
    border: none;
    background: none !important;
    color: #333 !important;
  }

  .rs-btn i { display: none; }

  .rs-btn[href^="/files"],
  .rs-btn[href="/blog/"] { display: none; }

  /* badge 靠底色表意，打印时底色会被丢弃，改用描边 */
  .rs-badge {
    background: none;
    border: 1px solid currentColor;
  }

  [data-theme='dark'] .rs-home .rs-badge { --rs-badge-fg: #333; }

  .rs-pub,
  .rs-project,
  .rs-award {
    page-break-inside: avoid;
    break-inside: avoid;
  }

  .rs-pub:hover,
  .rs-project:hover,
  .rs-stat:hover { background: none; border-left-color: transparent; }
}