/*
  作者主页布局（参照分类页 .taxo-page 的 grid 模式）：
  - 顶部"最新发布"通栏 + hr
  - 下方 grid：左 sidebar（头像 + 名字 + 介绍 + 长 bio + follow / contact）
    + 右 main（卡片）

  撤回 perplex 原版 .page-header--left + #author position: absolute
  方案——那个让 sidebar 跟下方 section 重叠 / 大块空白。
*/

/* ── 撤掉 perplex 默认的 absolute 定位 ──────────────── */
#author {
  position: static !important;
  width: auto !important;
  display: block;
  margin-top: 1rem;
}

#author__portrait,
#author__title,
#author__description,
.author__bio,
#author__follow,
#author__contact {
  position: static !important;
  width: auto !important;
  margin-bottom: 1rem;
}

/* ── 头像：圆形，float 到左侧让文字 wrap ───────────────
   8rem 头像 float: left，sidebar 内文字从头像右边开始；bio 长到
   超过头像底部时自动 wrap 回头像下方，占整 sidebar 宽。 */
#author__portrait {
  float: left;
  width: 8rem !important;
  height: 8rem !important;
  margin: 0.5rem 1rem 0.75rem 0;
  shape-outside: circle(50%);
}

/* 内层 figure / frame / img__c 全部 100% 跟着 8rem 容器走，不再用
   perplex 的 padding-bottom: 100% aspect-ratio hack——直接让 img__c
   有显式 height + padding-bottom: 0，img 走 static 自然填满。 */
#author__portrait .fig,
#author__portrait figure {
  width: 100% !important;
  height: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  float: none !important;
}

#author__portrait .img__frame {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  overflow: hidden;
}

#author__portrait .img__c {
  width: 100% !important;
  height: 100% !important;
  padding-bottom: 0 !important;
  position: relative;
}

#author__portrait img {
  position: static !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  opacity: 1 !important;       /* 抑制 .img--ph opacity: 0 起步态 */
}

/* sidebar 内 author 顶部容器需要 clearfix，避免 float 头像撑爆容器 */
#author::after {
  content: "";
  display: block;
  clear: both;
}

/* author 名/tagline 顶部对齐头像顶——让 #author__title 不要有顶部 margin */
#author__title {
  margin-top: 0;
}

/* ── 长 bio 文字（_index.md 的 markdown body） ───── */
.author__bio {
  font-size: 1rem;
  line-height: 1.7;
  color: var(--c-text-medium);
  margin-top: 1rem;
  width: 100%;
  max-width: none;
}

.author__bio p {
  margin: 0 0 0.75rem 0;
  max-width: none;
  text-align: justify;
  text-align-last: left;
}

/* ── 整页 grid（仿 .taxo-page） ─────────────────── */
.author-page {
  padding: 2rem 0;
}

@media screen and (min-width: 79em) {
  .author-page {
    display: grid;
    grid-template-columns: 35rem 1fr;
    grid-template-rows: auto 1fr;
    column-gap: 2rem;
    align-items: start;
    padding-top: 4rem;
  }

  .author-page__header {
    grid-column: 1 / -1;
  }

  .author-page__sidebar,
  .author-page__main {
    min-width: 0;
  }
}

/* ── 顶部 header：补上 perplex .section > h2 / .section > hr 的样式 ──
   原来用 <section class="section"> 自动套这些样式，我们换成
   .author-page__header 后选择器不匹配了，得显式补回来。 */
.author-page__header {
  margin-bottom: 1rem;
}

.author-page__header > hr {
  border: none;
  border-bottom: 0.35rem solid var(--c-text-normal);
  height: 1rem;
  margin: 0;
}

.author-page__header > h2 {
  font-size: 1.915rem;
  line-height: 2rem;
  padding-top: 0.28rem;
  padding-bottom: 0.72rem;
  font-family: 'IBM Plex Sans Condensed', 'Helvetica Neue', Arial, sans-serif;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  word-spacing: 0.09em;
  margin: 0;
}

/* ── 移动端单列堆叠 ──────────────────────────────── */
@media screen and (max-width: 78.9375em) {
  .author-page__header,
  .author-page__sidebar,
  .author-page__main {
    margin-bottom: 2rem;
  }

  .author-page__header,
  .author-page__sidebar {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}

/* ──────────────────────────────────────────────────
   文章详情页顶部 meta 行的小作者列表（.author-list 由
   layouts/partials/authors/portrait-small.html 渲染）：头像 + 名字
   横向排列，Misty 是链接。这套规则跟上面 #author__portrait 无关
   ────────────────────────────────────────────────── */
.author-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.author-list a {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  text-decoration: none;
}

.author-list__name {
  display: inline;
  font-family: 'IBM Plex Sans Condensed', 'Helvetica Neue', Arial, sans-serif;
  font-size: 1.6rem;
  font-weight: 600;
  color: var(--c-frame-text-link, currentColor);
}

.author-list a:hover .author-list__name,
.author-list a:focus .author-list__name {
  color: var(--c-frame-border-active);
}