:root{
  --paper:#f6f8f7; /* 轻纸张底色（青灰） */
  --ink:#0b2b2f; /* 深色文字 */
  --muted:#567c80; /* 湖蓝做强调 */
  --line:#cfe0df; /* 细线颜色 */
  --accent:#2b8f9d; /* 视觉高亮 */
  --max-width:1280px; /* 中间值，桌面在1120-1440范围内 */
  --gap:20px;
  --font-sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
}

/* 全局基础 */
*{box-sizing:border-box}
html,body{height:100%;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--font-sans);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
.sr{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}

/* 页头：栏目索引式导航（视觉识别：页头与正文不同对齐基线） */
.site-header{border-bottom:2px solid var(--line);background:transparent}
.header-inner{max-width:var(--max-width);margin:0 auto;display:flex;align-items:center;gap:16px;padding:12px 16px}
.brand{font-weight:700;color:var(--muted);font-size:1rem;letter-spacing:0.04em}
.nav-index ul{display:flex;gap:14px;list-style:none;margin:0;padding:0}
.nav-index li{font-size:0.95rem;color:var(--muted)}
.nav-index a{font-weight:600}

/* 页面容器 */
.page-container{padding:18px 16px 36px}

/* 标题行：标题横跨12列（视觉上是大行），内部左右分置摘要 */
.title-row{max-width:var(--max-width);margin:14px auto 10px;}
.title-inner{display:flex;align-items:flex-start;gap:24px}
.title-inner h1{margin:0;font-size:1.6rem;line-height:1.15;font-weight:800;flex:1 1 60%;text-align:left}
.summary{flex:0 0 36%;color:var(--muted);font-size:0.97rem}
.summary p{margin:0}

/* 广告槽样式（非覆盖、非悬浮） */
.ad-slot{max-width:var(--max-width);margin:14px auto;padding:10px;border:1px dashed var(--line);background:transparent;color:var(--muted);font-size:0.9rem;text-align:center}

/* 账页式细网格骨架（桌面） */
.ledger-grid{max-width:var(--max-width);margin:18px auto;display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gap);align-items:start}

/* 各栏定义（按合同：正文7 列，FAQ3 列，元信息2 列） */
.content-col{grid-column:1 / span 7}
.faq-col{grid-column:8 / span 3}
.meta-track{grid-column:11 / span 2}

/* 文章内容区（报刊式紧凑标题与舒展正文） */
.content-col .meta-inline{display:flex;gap:10px;font-size:0.9rem;color:var(--muted);margin-bottom:12px}
.content{font-size:1rem;color:var(--ink)}
.content p{margin:0 0 12px 0}
.content h2,.content h3{margin:1em 0 0.4em}
.content ul,.content ol{margin:0 0 12px 1.2em}

/* FAQ 两列（桌面） */
.faq-col h3{margin-top:0}
.faq-list{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.faq-list > *{border-top:2px solid var(--line);padding-top:10px}

/* 元信息轨道：直角线框风格，保持信息密集 */
.meta-track .meta-box{border-left:2px solid var(--line);padding-left:14px}
.meta-track dl{margin:0;font-size:0.95rem;color:var(--muted)}
.meta-track dt{font-weight:700;color:var(--ink);margin-top:8px}
.meta-track dd{margin:2px 0 8px 0}

/* 相关阅读 四列紧凑网格 */
.related{max-width:var(--max-width);margin:30px auto}
.related-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.related-grid > *{font-size:0.95rem;color:var(--muted);padding:6px 4px;border-top:1px solid transparent}

/* 页脚 */
.site-footer{border-top:1px solid var(--line);padding:12px 16px;background:transparent;color:var(--muted)}
.site-footer .footer-inner{max-width:var(--max-width);margin:0 auto;font-size:0.9rem}

/* 禁止使用阴影以替代信息层级（视觉规则） */
/* 视觉签名：页头与正文采用不同对齐基线（页头居中内对齐，正文首行有缩进） */
.content p:first-child{text-indent:0}
.content p{text-indent:0.4em}

/* 响应：桌面规则（必须包含 min-width:1024px） */
@media (min-width:1024px){
  /* 确保容器在1120-1440之间 */
  :root{--max-width:1280px}
  .header-inner{padding:18px 20px}
  .title-inner h1{font-size:2rem}
  .page-container{padding:26px 20px}
  /* 明显线框直角化（桌面强调网格线条） */
  .title-row{border-bottom:1px solid var(--line);padding-bottom:14px}
  .faq-list > *{border-top:2px solid var(--line)}
}

/* 手机端规则（必须包含 max-width:767px） */
@media (max-width:767px){
  :root{--max-width:720px}
  .header-inner{padding:10px}
  .nav-index ul{gap:10px;overflow:auto}

  /* 网格解除，线框只保留为段落顶部细线 */
  .ledger-grid{display:block;margin:10px auto}
  .content-col,.faq-col,.meta-track{grid-column:auto;}
  .title-inner{flex-direction:column;gap:8px}
  .title-inner h1{font-size:1.25rem}
  .summary{order:2;font-size:0.95rem}

  /* 内容段落顶部细线作为模块分隔 */
  .content p{border-top:1px solid var(--line);padding-top:10px;margin:0 0 12px}
  .content p:first-child{border-top:0;padding-top:0}

  /* FAQ 单列 */
  .faq-list{display:block}
  .faq-list > *{border-top:1px solid var(--line);padding-top:10px}

  /* 元信息移动到正文下方，转为块布局 */
  .meta-track{margin-top:14px;border-left:none;padding-left:0}
  .meta-track .meta-box{padding:0}

  /* 相关阅读 收束为两列以保持紧凑 */
  .related-grid{grid-template-columns:repeat(2,1fr)}

  /* 广告适配：保留容器自然流 */
  .ad-slot{margin:12px 10px}
}

/* 可访问性微调 */
.time, time{font-size:0.95rem}