/* 全局系统字体与核心变量，遵循“炭黑与暖灰”配色、方角框线、局部底色 */
:root{
  --bg:#f6f4f1; /* 暖灰 */
  --paper:#ffffff;
  --ink:#111111; /* 炭黑 */
  --muted:#777068;
  --accent:#222; /* 用于反向色块 */
  --gap:24px;
  --max-width:1280px; /* 在 1120-1440 之间 */
  --aside-width:340px;
  --radius:4px; /* 方角但轻微圆角 */
  --border:1px solid #e6e2dd;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  color-scheme: light;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
/* Header：报刊双层报头、工具栏合并站名与面包屑 */
.site-header{
  max-width:var(--max-width);
  margin:24px auto 0;
  padding:0 20px;
}
.toolbar{
  display:flex;
  gap:12px;
  align-items:center;
  font-size:14px;
  color:var(--muted);
}
.toolbar .home{
  text-decoration:none;
  color:var(--ink);
  font-weight:600;
}
.masthead{
  margin-top:8px;
  padding:10px 0 14px 0;
  border-bottom:var(--border);
}
.masthead-line{
  text-align:center;
  font-size:13px;
  color:var(--muted);
}
.masthead-line-top{font-weight:700;letter-spacing:0.06em}
.masthead-line-sub{font-size:12px;margin-top:4px;color:#8a857e}

/* 广告插槽保留但不浮动、不遮挡 */
.ad-slot{max-width:var(--max-width);margin:18px auto;padding:8px 20px;background:transparent;border:none}
.ad-slot > *{display:block}

/* 页面主体容器：居中报头与窄标题，中心线版面 */
.page-wrapper{max-width:var(--max-width);margin:18px auto;padding:0 20px 48px}
.edition{background:var(--paper);border:var(--border);border-radius:var(--radius);padding:28px}

/* 标题构图：标题居中、摘要左对齐 */
.edition-header{max-width:100%;padding-bottom:12px}
.title{
  margin:0 0 8px 0;
  text-align:center; /* 居中 */
  font-weight:800;
  font-size:28px; /* 紧凑标题 */
  line-height:1.08;
  letter-spacing:-0.02em;
}
.meta-row{display:flex;gap:12px;justify-content:center;color:var(--muted);font-size:13px;margin-bottom:12px}
.summary{
  margin:0 0 18px 0;
  max-width:900px;
  text-align:left; /* 摘要左对齐 */
  color:var(--muted);
  padding-left:6px;
}

/* 主体：桌面为非对称两栏（主列与注释栏），手机单列 */
.edition-body{display:block}
.main-column{min-width:0}
.annotation{display:block;margin-top:20px}
.annotation-box{border:var(--border);padding:12px;margin-bottom:12px;border-radius:var(--radius);background:#fff}
.annotation .anno-heading{font-weight:700;font-size:13px;color:var(--ink);margin-bottom:6px}
.annotation .anno-body{color:var(--muted);font-size:14px}
.annotation-box.muted .anno-body{color:#6e6963}

/* 正文样式——舒展易读 */
.content{color:var(--ink);font-size:17px;line-height:1.9}
.content p{margin:0 0 1em}
.content h2{font-size:18px;margin:1.2em 0 0.5em}
.content ul, .content ol{padding-left:1.2em}

/* FAQ 版式：桌面两列，手机单列 */
.faq-block{margin-top:22px}
.section-title{font-size:16px;margin:0 0 12px 0;color:var(--ink);font-weight:700}
.faq-grid{display:block;gap:12px}
.faq-grid > *{margin-bottom:12px}

/* 相关阅读：底部三列短卡但不用阴影；反向色块标题栏为视觉签名 */
.related-section{margin-top:28px;padding-top:14px;border-top:var(--border)}
.related-header{
  display:inline-block;
  background:var(--accent);
  color:#fff;
  padding:8px 12px;
  border-radius:2px;
  font-weight:700;
  margin-bottom:12px;
}
.related-grid{display:flex;gap:12px;margin-top:12px}
.related-grid > *{flex:1 1 0;background:#fff;border:var(--border);padding:12px;border-radius:3px;min-height:68px}
.related-grid > *:first-child{flex:1.05}
.related-grid > *:last-child{flex:0.95}
.related-grid .title{font-size:14px}

/* Footer */
.site-footer{max-width:var(--max-width);margin:24px auto;padding:18px 20px;color:var(--muted);font-size:13px}

/* 桌面端专属风格：非对称中轴格局与注释栏 */
@media (min-width:1024px){
  .edition{padding:36px}
  .title{font-size:34px}
  .edition-body{
    display:grid;
    grid-template-columns: 1fr var(--aside-width);
    gap:40px;
    align-items:start;
  }
  /* 主列更强调行宽，避免窄小的阅读列 */
  .main-column{min-width:0}
  .annotation{position:relative}

  /* FAQ 两列 */
  .faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}

  /* 相关阅读三列短卡：非等宽营销卡片，使用微差处理 */
  .related-grid{display:flex}
  .related-grid > *{min-width:0}
}

/* 手机端：全部左对齐单列，侧栏下移且无横向滚动 */
@media (max-width:767px){
  :root{--gap:16px}
  .site-header{margin:12px 12px 0}
  .masthead-line{font-size:12px}
  .page-wrapper{padding:0 12px}
  .edition{padding:18px}
  .title{font-size:20px;text-align:center}
  .summary{text-align:left;padding-left:0}
  .edition-body{display:block}
  .annotation{margin-top:20px}
  .annotation-box{padding:10px}
  .ad-slot{margin:12px auto}
  .related-grid{flex-direction:column}
  .related-grid > *{width:100%}
  .faq-grid{display:block}
  .meta-row{justify-content:flex-start}
  .toolbar{font-size:13px}
}

/* 可访问性与印刷性优化（保持简洁） */
a{color:inherit}
