/* p-insights.css — 驭火观察首页（/insights/）、芝微手记（/zhiwei/）（v2，2026-10-09）。全站组件在 fyro.css。
   驭火观察首页：首屏（背后是字符粒子）只有标题；三个栏目各一章，文章排成目录式的行：
     <ol class="post-list"><li><a class="post-row" href="…">
       <p class="post-meta">日期</p>
       <div class="post-main"><h3 class="post-title">…</h3><p class="post-summary">…</p></div>
     </a></li></ol>
   整行可点；悬停时底下变成一张白纸，标题变朱红。文末芝微手记的入口是 .link-list 的一行。
   10-27 删废话（Leon「小标、总数、过度解释、过度讨好的措辞和说法，全部删掉改掉」）：首屏的导语和栏目跳转 .ins-toc、各节编号小标、
   每行的编号 .post-no、日期后面的栏目名、「阅读全文」.post-more 删了，样式一起删；节标题前面没有小标了，顶格（芝微手记同）。
   芝微手记：首屏（字符粒子，同驭火观察）的要点表 .page-facts（手机上一行一项）；各期内容是一扇界面示意窗口（还没有内容时是空的列表）；
   账号开通后的账号卡片 .follow-cards（关于页 #follow 在 p-about.css 里有同样一段）。 */

/* ---------- 节标题：前面没有小标，顶格 ---------- */
.sec-head .sec-title:first-child { margin-top: 0; }

/* ---------- 文章目录 ---------- */
.post-list { border-top: 1.5px solid var(--ink); }
.post-list > li { border-bottom: 1px solid var(--line-2); }
.post-row {
  position: relative;
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr);
  column-gap: 40px;
  padding: 30px 18px 32px;
  margin-inline: -18px;
  border-radius: 14px;
  transition: background-color 200ms ease-out, box-shadow 200ms ease-out;
}
.post-meta { grid-column: 1; grid-row: 1; padding-top: 6px; font-size: 13px; line-height: 1.8; letter-spacing: 0.04em; color: var(--muted); }
.post-main { grid-column: 2; grid-row: 1; }
.post-title { font-family: var(--head); font-size: clamp(20px, 1.1vw + 14px, 24px); font-weight: var(--w-title); line-height: 1.45; letter-spacing: var(--track-title); color: var(--ink); text-wrap: balance; transition: color 160ms ease-out; }
.post-summary { max-width: 40em; margin-top: 10px; font-size: 15px; line-height: 1.88; color: var(--ink-soft); text-wrap: pretty; }
.sec-tint .post-row { --row-hi: var(--sheet); }
@media (hover: hover) and (pointer: fine) {
  .post-row:hover { background: var(--row-hi, var(--sheet-hi)); box-shadow: var(--sheet-shadow); }
  .post-row:hover .post-title { color: var(--cinnabar-text); }
}
@media (min-width: 701px) { .post-title { word-break: keep-all; overflow-wrap: break-word; } }
/* 平板和手机：日期一行，标题、摘要在下面 */
@media (max-width: 1023px) {
  .post-row { grid-template-columns: minmax(0, 1fr); padding: 26px 18px 28px; }
  .post-meta { grid-column: 1; grid-row: 1; padding-top: 0; }
  .post-main { grid-column: 1; grid-row: 2; margin-top: 8px; }
}
@media (max-width: 639px) {
  .post-row { padding: 24px 0 26px; margin-inline: 0; border-radius: 0; }
  .post-meta { font-size: 12.5px; }
  .post-summary { font-size: 14.5px; }
}

/* 文末：芝微手记的入口（.link-list 的一行），紧跟在文章目录后面 */
.sec.ins-end, .sec + .sec.ins-end:not(.sec-tint) { padding-block: 0 clamp(24px, 3vw, 40px); }
.ins-end .link-title { font-size: 17px; }

/* ---------- 芝微手记 ---------- */
.page-facts .wait-btn { font-family: var(--sans); font-weight: 500; letter-spacing: 0.02em; vertical-align: 3px; }
@media (min-width: 900px) { .page-facts > div { padding-right: 24px; margin-right: 24px; } }
/* 手机：要点表一行一项（左边小标，右边内容），不再折成参差的几栏 */
@media (max-width: 639px) {
  .page-facts { display: grid; }
  .page-facts > div { display: grid; grid-template-columns: 4em minmax(0, 1fr); align-items: baseline; margin-right: 0; padding: 11px 0; border-right: 0; border-bottom: 1px solid var(--line); }
  .page-facts > div:last-child { border-bottom: 0; }
  .page-facts dd { margin-top: 0; font-size: 17px; }
}
.zw-platforms .sec-head { margin-bottom: 28px; }
.zw-platforms .note-line { margin-top: 0; }
.zw-window { max-width: 880px; }
.zw-empty { display: grid; gap: 22px; }
.zw-skeleton { display: grid; }
.zw-skeleton li { display: grid; grid-template-columns: 30px 64px minmax(0, 1fr); align-items: center; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.zw-skeleton li::before { content: ""; width: 18px; height: 6px; border-radius: 3px; background: rgb(var(--ink-rgb) / 0.12); }
.zw-thumb { width: 64px; aspect-ratio: 4 / 3; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-card); }
.zw-bars { display: grid; gap: 8px; }
.zw-bars i { display: block; height: 8px; border-radius: 4px; background: rgb(var(--ink-rgb) / 0.09); }
.zw-bars i:first-child { width: min(62%, 320px); background: rgb(var(--ink-rgb) / 0.14); }
.zw-bars i:last-child { width: min(38%, 200px); }
.zw-empty-text { justify-self: center; max-width: 30em; text-align: center; font-size: 15px; line-height: 1.9; color: var(--ink-soft); }
.zw-empty-text::before { content: ""; display: block; width: 8px; height: 8px; margin: 0 auto 12px; border-radius: 50%; background: var(--cinnabar); box-shadow: 0 0 0 4px rgb(var(--accent-rgb) / 0.12); }
.zw-window + .note-line { margin-top: 26px; }

/* 账号开通以后的账号卡片（build.py 的 {{follow:zhiwei}}：平台、账号名、二维码） */
.follow-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; max-width: 560px; }
.follow-cards .follow-item { display: grid; justify-items: start; gap: 8px; padding: 16px; border: 1px solid var(--line); border-radius: 14px; background: var(--sheet); box-shadow: var(--sheet-shadow); }
.follow-cards .follow-link { display: grid; gap: 2px; padding: 0; border: 0; border-radius: 0; background: none; }
.follow-cards .follow-platform { font-size: 16px; font-weight: 600; color: var(--ink); }
.follow-cards .follow-name { font-size: 13px; color: var(--muted); }
.follow-cards .follow-qr { width: 100%; max-width: 120px; height: auto; aspect-ratio: 1 / 1; border: 1px solid var(--line); border-radius: 8px; }
.follow-cards + .note-line { margin-top: 22px; }
@media (max-width: 479px) {
  .follow-cards { grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 10px; }
  .follow-cards .follow-item { padding: 12px; }
}
@media (max-width: 639px) {
  .zw-skeleton li { grid-template-columns: 22px 52px minmax(0, 1fr); gap: 12px; }
  .zw-thumb { width: 52px; }
}
