/**
 * fsmag 头版 v9 版式层（2026-10-14）
 *
 * 站长：「第一街全站的版式设计再用点心，以前做的有点粗糙」。本层只管版式，不改内容与数据：
 *   1. 纸面统一：各版块一律白底，不再白／米白交替铺色带；版块之间只靠题头双线规分隔。
 *      副刊刊架是另一份刊物，保留一块浅灰底以示区隔。
 *   2. 栅格统一：版心 1200，12 栏思路（7+5 / 5+7 / 4×3），栏距 3rem；纵向节奏 3.25rem / 3.5rem。
 *   3. 字阶五级：头条 → 版块主推 → 次条 → 目录 → 元信息（日期一律等宽、栏目标签刊色衬线）。
 *   4. 图位：直角、无投影、无圆角；图在上时与文字左缘对齐；无封面不留空图位。
 *   5. 每个版块一种句式：精选＝大图主推＋三条次条；国际／社会＝图文主推（社会镜像）＋两栏目录；
 *      经济＝主推＋日期目录＋合作来源带；历史＝四栏图文横排。
 * 专用类 f9- 前缀；本文件在 HomeShell 中最后加载。
 */

/* ── 纸面与节奏 ─────────────────────────────────────────── */
.front-page { background: #fff; }
.fl-wrap,
.fpicks-wrap,
.fins-wrap,
.fecon-wrap,
.fhist-wrap {
  background: #fff;
  border-bottom: 0;
}
.f9-sec { padding: 3.25rem 0 3.5rem; }
.f9-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 var(--fsmag-space-read-pad);
}
.f9-inner > .fsh { margin-bottom: 1.9rem; }
@media (max-width: 759px) {
  .f9-sec { padding: 2.4rem 0 2.6rem; }
  .f9-inner > .fsh { margin-bottom: 1.4rem; }
}

/* 副刊刊架：另一份刊物，浅灰底区隔 */
.frack-wrap {
  background: var(--fsmag-color-paper-warm, #F5F5F4);
  border-bottom: 0;
  padding: 3.25rem 0 3.75rem;
}

/* ── 字阶 ──────────────────────────────────────────────── */
.f9-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.35rem 0.85rem;
  margin: 0 0 0.6rem;
}
.f9-meta time {
  font-family: var(--fsmag-font-mono);
  font-size: 0.68rem;
  letter-spacing: 0.02em;
  color: var(--fsmag-color-ink-subtle);
  font-variant-numeric: tabular-nums;
}
.f9-sec-label {
  font-family: var(--fsmag-font-title);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: var(--fsmag-color-deep);
}
.f9-h-lead,
.f9-h-feat,
.f9-h-sub {
  margin: 0;
  font-family: var(--fsmag-font-title);
  color: var(--fsmag-color-ink);
  text-wrap: pretty;
}
.f9-h-lead { font-size: clamp(1.6rem, 2.6vw, 2.15rem); font-weight: 700; line-height: 1.32; letter-spacing: 0.01em; }
.f9-h-feat { font-size: clamp(1.4rem, 2.1vw, 1.8rem); font-weight: 700; line-height: 1.38; letter-spacing: 0.01em; }
.f9-h-sub  { font-size: 1.1rem; font-weight: 600; line-height: 1.5; }
.f9-h-sub--lg { font-size: clamp(1.18rem, 1.6vw, 1.32rem); font-weight: 700; line-height: 1.45; }
.f9-h-lead a,
.f9-h-feat a,
.f9-h-sub a {
  color: inherit;
  text-decoration: none;
  transition: color 0.18s ease;
}
.f9-h-lead a:hover,
.f9-h-feat a:hover,
.f9-h-sub a:hover { color: var(--fsmag-color-deep); }

.f9-eng {
  margin: 0.45rem 0 0;
  font-family: var(--fsmag-font-eng);
  font-size: 0.76rem;
  letter-spacing: 0.03em;
  color: var(--fsmag-color-ink-muted);
}
.f9-dek {
  margin: 0.6rem 0 0;
  font-family: var(--fsmag-font-prose);
  font-size: 0.93rem;
  line-height: 1.85;
  color: var(--fsmag-color-ink-soft);
}
.f9-dek--lead { font-size: 1rem; max-width: 36em; }
.f9-clamp-2, .f9-clamp-3, .f9-clamp-4 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.f9-clamp-2 { -webkit-line-clamp: 2; }
.f9-clamp-3 { -webkit-line-clamp: 3; }
.f9-clamp-4 { -webkit-line-clamp: 4; }

.f9-go {
  display: inline-block;
  margin-top: 1rem;
  font-family: var(--fsmag-font-title);
  font-size: 0.86rem;
  font-weight: 600;
  color: var(--fsmag-color-deep);
  text-decoration: none;
  padding-bottom: 0.1rem;
  border-bottom: 1px solid color-mix(in srgb, var(--fsmag-color-deep) 35%, transparent);
  transition: border-color 0.18s ease;
}
.f9-go:hover { border-bottom-color: var(--fsmag-color-deep); }

/* ── 图位 ──────────────────────────────────────────────── */
.f9-fig {
  display: block;
  overflow: hidden;
  background: var(--fsmag-color-surface-soft);
  margin: 0 0 1.05rem;
}
.f9-fig img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s var(--fsmag-ease, ease);
}
.f9-fig:hover img { transform: scale(1.02); }
.f9-fig--3x2   { aspect-ratio: 3 / 2; }
.f9-fig--4x3   { aspect-ratio: 4 / 3; }
.f9-fig--16x10 { aspect-ratio: 16 / 10; }

/* ── 文章精选：7 + 5 ───────────────────────────────────── */
.f9-pk-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2rem; }
@media (min-width: 900px) {
  .f9-pk-grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 3rem; }
  .f9-pk-grid.is-solo { grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); }
}
.f9-pk-hero { min-width: 0; }
.f9-pk-hero .f9-fig--3x2 { aspect-ratio: 16 / 9; }
.f9-pk-side { list-style: none; margin: 0; padding: 0; min-width: 0; }
.f9-pk-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 9.5rem;
  gap: 1.4rem;
  align-items: start;
  padding: 1.35rem 0;
  border-top: 1px solid var(--fsmag-color-border);
}
.f9-pk-item.is-text { grid-template-columns: minmax(0, 1fr); }
.f9-pk-item:last-child { padding-bottom: 0; }
.f9-pk-thumb { margin: 0.2rem 0 0; }
@media (min-width: 900px) {
  .f9-pk-item:first-child { border-top: 0; padding-top: 0; }
}
@media (max-width: 559px) {
  .f9-pk-item { grid-template-columns: minmax(0, 1fr) 6.5rem; gap: 1rem; padding: 1.1rem 0; }
}

/* ── 国际／社会：主推图文（5+7，社会镜像 7+5）＋两栏目录 ─── */
.f9-feat { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.4rem; }
.f9-feat-fig { margin: 0; order: -1; }
@media (min-width: 900px) {
  .f9-feat { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 3rem; align-items: start; }
  .f9-feat-fig { order: 0; }
  .f9-feat.is-mirror { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
  .f9-feat.is-mirror .f9-feat-fig { order: -1; }
  .f9-feat-body { padding-top: 0.15rem; }
}
.f9-feat.is-text { grid-template-columns: minmax(0, 44em); }
.f9-feat-body { min-width: 0; }
.f9-feat-more { margin-top: 1.8rem; }
.f9-feat-more a { padding: 0.75rem 0; }

.f9-index {
  list-style: none;
  margin: 2.2rem 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  column-gap: 3rem;
}
.f9-index::before {
  content: "";
  grid-column: 1 / -1;
  border-top: 1px solid var(--fsmag-color-border-strong);
}
@media (min-width: 760px) {
  .f9-index--2col { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
}
.f9-index a {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1.2rem;
  padding: 0.85rem 0;
  border-bottom: 1px solid var(--fsmag-color-border);
  text-decoration: none;
}
.f9-index-title {
  min-width: 0;
  font-family: var(--fsmag-font-title);
  font-size: 0.98rem;
  font-weight: 600;
  line-height: 1.55;
  color: var(--fsmag-color-ink);
  transition: color 0.18s ease;
}
.f9-index a:hover .f9-index-title { color: var(--fsmag-color-deep); }
.f9-index time {
  flex: none;
  font-family: var(--fsmag-font-mono);
  font-size: 0.68rem;
  color: var(--fsmag-color-ink-subtle);
  font-variant-numeric: tabular-nums;
}

/* ── 经济：5 + 7 ───────────────────────────────────────── */
.f9-econ { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2rem; }
@media (min-width: 900px) {
  .f9-econ { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 3rem; align-items: start; }
}
.f9-econ-lead { min-width: 0; }
.f9-index--dated { margin-top: 0; }
.f9-index--dated a { justify-content: flex-start; gap: 1.4rem; }
.f9-index--dated time { width: 6.4em; }
.f9-index--dated .f9-index-title {
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media (max-width: 559px) {
  .f9-index--dated .f9-index-title { white-space: normal; }
}

.f9-partner { margin-top: 2.6rem; }
.f9-partner-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
  margin: 0;
  padding-top: 0.85rem;
  border-top: 1px solid var(--fsmag-color-ink);
}
.f9-partner-head span {
  font-family: var(--fsmag-font-title);
  font-size: 0.92rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--fsmag-color-ink);
}
.f9-partner-head a {
  font-family: var(--fsmag-font-title);
  font-size: 0.85rem;
  color: var(--fsmag-color-deep);
  text-decoration: none;
}
.f9-partner-head a:hover { text-decoration: underline; text-underline-offset: 3px; }
.f9-partner ul {
  list-style: none;
  margin: 0.4rem 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  column-gap: 2rem;
}
@media (min-width: 600px) { .f9-partner ul { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1000px) { .f9-partner ul { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.f9-partner li a {
  display: block;
  padding: 0.75rem 0;
  font-family: var(--fsmag-font-title);
  font-size: 0.94rem;
  line-height: 1.55;
  color: var(--fsmag-color-ink-soft);
  text-decoration: none;
  transition: color 0.18s ease;
}
.f9-partner li a:hover { color: var(--fsmag-color-deep); }

/* ── 历史：四栏图文横排 ─────────────────────────────────── */
.f9-strip {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 2rem;
}
@media (min-width: 560px) { .f9-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem 1.6rem; } }
@media (min-width: 1000px) { .f9-strip { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2rem; } }
.f9-strip-item { min-width: 0; }
.f9-strip-item.is-text {
  border-top: 1px solid var(--fsmag-color-border-strong);
  padding-top: 1rem;
}

/* ── 头版头条小调：右栏四条与左侧头条大致等高 ─────────────── */
.fl-grid { padding-top: 2.6rem; padding-bottom: 3.25rem; }
.fl-rail-item { padding: 1rem 0 1.1rem; }
@media (max-width: 599px) {
  .f9-partner li { border-bottom: 1px solid var(--fsmag-color-border); }
}
