/* 变量与基础 */
:root{
  --bg:#ffffff;
  --text:#111111;
  --muted:#6b6b6b;
  --accent:#b71c1c; /* 朱红强调 */
  --border:#e6e6e6;
  --radius:2px; /* surface 2px */
  --max-wrap: clamp(1120px, 88vw, 1440px);
  --gap:18px;
  --font-stack: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:var(--font-stack);
  line-height:1.45; /* 紧凑但可读 */
  font-size:16px;
}

a{color:var(--accent);text-decoration:none}

/* Site header - 窄报头 */
.site-header{
  border-bottom:1px solid var(--border);
  padding:10px 0;
  background:var(--bg);
}
.header-inner{
  width:var(--max-wrap);
  margin:0 auto;
  display:flex;
  align-items:center;
  gap:12px;
  padding:6px;
}
.brand{font-weight:700;color:var(--text)}
.index-nav ul{display:flex;gap:14px;margin:0;padding:0;list-style:none;align-items:center}
.index-nav li span{color:var(--muted);font-size:0.95rem}
.index-nav a{font-size:0.95rem}

/* 广告容器样式（独立，不覆盖正文） */
.ad{width:100%;padding:10px 0;text-align:center;border-top:1px dashed var(--border);border-bottom:1px dashed var(--border);background:transparent}
.ad-top,.ad-middle,.ad-bottom{font-size:0.95rem;color:var(--muted)}

/* 页面容器 */
.page-wrapper{display:block;padding:18px 0}
.page-inner{width:var(--max-wrap);margin:0 auto;padding:0 12px}

/* 文章头部：眉题 + 标题 + 元信息 + 摘要 */
.article-head{margin-bottom:12px}
.eyebrow{font-size:0.9rem;color:var(--muted);margin-bottom:6px}
.eyebrow-key{color:var(--text);font-weight:600}
.title{font-size:1.6rem;margin:0 0 8px 0;line-height:1.15}
.meta{font-size:0.88rem;color:var(--muted);display:flex;gap:12px;align-items:center;margin-bottom:8px}
.summary{padding:10px;border:1px solid var(--border);border-radius:var(--radius);background:transparent;margin:0 0 14px 0}

/* 主体区域默认单栏（mobile first） */
.article-body-wrapper{display:block}
.content-area{margin-bottom:12px}
.article-body{font-size:1rem;color:var(--text)}
.article-body p{margin:0 0 1em}

/* 视觉签名：正文首段首字轻量强调 */
.article-body p:first-of-type::first-letter{
  color:var(--accent);
  font-size:1.45em;
  font-weight:600;
  float:left;
  line-height:1;
  padding-right:6px;
}

/* 边注在移动端下移为块 */
.edge-note{border:1px solid var(--border);border-radius:var(--radius);padding:10px;margin-top:12px;background:transparent}
.note-block{margin-bottom:8px}
.note-title{font-size:0.95rem;margin:0 0 6px 0;color:var(--muted)}
.note-content{font-size:0.95rem}
.note-content.small{font-size:0. Ninerem}

/* 辅助区：FAQ 与 相关阅读（手机单列） */
.supplemental{margin-top:18px;display:block}
.faq h2, .related h2{font-size:1rem;margin:0 0 8px 0}
.faq-list, .related-list{margin:0 0 12px 0;padding-left:1.2rem}
.faq-list li, .related-list li{margin:0 0 0.8em;color:var(--muted)}

.site-footer{border-top:1px solid var(--border);padding:12px 0;margin-top:18px}
.footer-inner{width:var(--max-wrap);margin:0 auto;padding:6px 12px;display:flex;justify-content:space-between;align-items:center}

/* 视觉密度与可访问性 */
h1,h2,h3{color:var(--text)}

/* 禁止超出小屏宽度 */
img, iframe, embed, object{max-width:100%;height:auto}

/* 桌面专属规则（>=1024px）——编辑部堆叠结构 */
@media (min-width:1024px){
  .header-inner{padding:10px 0}
  .title{font-size:2rem}
  .page-inner{display:grid;grid-template-columns:1fr;gap:18px}

  /* 跨栏标题 + 摘要带（跨栏） */
  .article-head{grid-column:1/-1}
  .summary{max-width:100%;}

  /* 内容区使用10/2边注网格 */
  .article-body-wrapper{display:grid;grid-template-columns:repeat(12,1fr);gap:18px;align-items:start}
  .content-area{grid-column:1/11}
  .edge-note{grid-column:11/13}
  .edge-note{position:static}

  .article-body{font-size:1.03rem}

  /* FAQ 与 相关阅读底部不同宽度错位排列 */
  .supplemental{display:grid;grid-template-columns:repeat(12,1fr);gap:18px;margin-top:28px}
  .faq{grid-column:1/9;border:1px solid var(--border);border-radius:var(--radius);padding:14px}
  .related{grid-column:9/13;padding:14px}
  /* related 视觉上错位（偏右） */
  .related{transform:translateY(6px)}

  /* 较大屏使用更紧凑的行间 */
  body{font-size:16px;line-height:1.42}
}

/* 手机专属规则（<=767px）——各层按语义单列 */
@media (max-width:767px){
  .header-inner{padding:8px 12px}
  .index-nav ul{overflow:auto;gap:12px;padding-bottom:6px}
  .index-nav ul::-webkit-scrollbar{display:none}

  .page-inner{padding:0 12px}
  .title{font-size:1.2rem}
  .summary{font-size:0.98rem}
  .article-body p{font-size:0.98rem}
  .edge-note{margin-top:12px}
  .supplemental{margin-top:16px}

  /* 确保在320px无横向滚动 */
  html,body{min-width:0}
}

/* 无阴影、无大圆角，保持朴素 */