/* 设计说明中指定的配色、基线、无阴影、无圆角风格 */
:root{
  --bg:#f6f3ea; /* 米白 */
  --ink:#022b20; /* 墨绿近似深色 */
  --muted:#6b6b6b;
  --accent: #0b3b2f; /* 墨绿色强调 */
  --line: rgba(2,43,32,0.06);
  --max-desktop-width:1300px;
  --grid-gap:20px;
  --content-min-width:0;
}

/* 基础重置与排版 */
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans SC', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
  color:var(--ink);
  background:var(--bg);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  line-height:1.55; /* 正文较舒展 */
  font-size:16px;
}

.masthead{border-bottom:1px solid var(--line); background:transparent}
.masthead-inner{max-width:var(--max-desktop-width); margin:0 auto; padding:14px 18px; display:flex; align-items:center; justify-content:space-between}
.brand{display:flex; align-items:center; gap:8px; color:var(--accent); font-weight:600}
.home-link{color:var(--accent); text-decoration:none}
.index-brief{color:var(--muted); font-size:13px}

.container{padding:18px; margin:0 auto;}

/* article header */
.article-head{max-width:100%; margin-bottom:8px}
.title{
  margin:0 0 8px 0;
  color:var(--ink);
  font-weight:800;
  letter-spacing:-0.02em;
  /* 报刊式紧凑标题：大字号但受限为两行 */
  font-size:clamp(26px, 3.6vw, 48px);
  line-height:1.02;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2; /* 不超过两行 */
  overflow:hidden;
}
.meta-row{color:var(--muted); font-size:13px; display:flex; gap:10px; align-items:center; margin-bottom:10px}
.meta-row .keywords{margin-left:auto; color:var(--muted); font-size:13px}
.summary{margin:0 0 12px 0; color:var(--ink); font-weight:600}

/* 广告容器样式（独立且不悬浮、无遮挡） */
.ad{border:1px dashed rgba(2,43,32,0.08); padding:10px; color:var(--muted); background:transparent; font-size:14px}
.ad-top{margin:12px 0}
.ad-middle{margin:20px 0}
.ad-bottom{margin:12px 0}

/* 主体网格：桌面10/2 网格 */
.body-grid{display:block}
.content-area{background:transparent}
.side-note{display:none}

/* 正文区视觉签名：双层基线网格感（淡横线） */
.content{
  background-image: repeating-linear-gradient(to bottom, transparent 0px, transparent calc(1.2em - 1px), rgba(2,43,32,0.02) calc(1.2em - 1px), rgba(2,43,32,0.02) calc(1.2em));
  padding:6px 4px;
  color:var(--ink);
  font-size:17px;
  line-height:1.45;
  word-break:break-word;
}
.content p{margin:0 0 12px 0}

.section-title{font-size:16px; font-weight:700; margin:18px 0 8px}

/* FAQ 两列（桌面） */
.faq-list{display:block}
.related-list{display:grid; gap:10px}

/* 边注样式：无圆角、细分隔线 */
.note-box{border-left:2px solid var(--line); padding-left:12px}
.note-head{color:var(--accent); font-weight:700; margin-bottom:8px}
.note-line{margin:6px 0; font-size:14px}
.note-line.small{color:var(--muted); font-size:13px}

/* 页脚 */
.site-footer{border-top:1px solid var(--line); margin-top:24px}
.footer-inner{max-width:var(--max-desktop-width); margin:0 auto; padding:18px}
.copyright{color:var(--muted); font-size:13px}

/* 响应式：桌面（>=1024px）形成 10/2 非对称网格 */
@media (min-width:1024px){
  .container{max-width:var(--max-desktop-width); padding:28px}
  .body-grid{display:grid; grid-template-columns:repeat(12, 1fr); gap:var(--grid-gap); align-items:start}
  .content-area{grid-column:1 / span 10}
  .side-note{grid-column:11 / span 2; display:block}

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

  /* 相关阅读 两列摘要列表 */
  .related-list{grid-template-columns:1fr 1fr}

  /* 使主体容器在 1120-1440 之间 */
  .masthead-inner, .footer-inner, .container{width:100%; max-width:1300px}
}

/* 手机端（<=767px）：边注并入标题下方，所有内容取消固定宽度 */
@media (max-width:767px){
  body{font-size:15px}
  .masthead-inner{padding:12px}
  .container{padding:12px}
  .title{font-size:22px; -webkit-line-clamp:2}
  .body-grid{display:block}
  .side-note{display:block; margin-top:12px}
  .side-note .note-box{border-left:none; border-top:1px solid var(--line); padding-top:10px}

  /* FAQ 单列 */
  .faq-list{display:block}
  .related-list{display:block; grid-template-columns:unset}

  /* 确保不会横向滚动 */
  .container, .masthead-inner, .footer-inner{padding-left:12px; padding-right:12px}
  .content{font-size:16px}
}

/* 中间断点（768px - 1023px）：维持可读性但不采用桌面布局 */
@media (min-width:768px) and (max-width:1023px){
  .container{padding:18px}
  .title{font-size:28px}
  .side-note{display:block; margin-top:12px}
}

/* 无阴影、无大量圆角，使用细线分隔来区分信息层级（遵守 forbidden_pattern） */