:root{
  --bg:#F6F0E8;            /* 奶油白 */
  --ink:#3B2C26;           /* 深棕 */
  --muted:#7A6A61;
  --accent:#8A4B2F;        /* 克制强调色 */
  --max-width:1280px;      /* 在 1120-1440 间 */
  --content-gap:28px;
  --radius:4px;
  --line:rgba(59,44,38,0.08);
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans",Arial,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  color-scheme: light;
}

/* 基础重置与全局 */
*{box-sizing:border-box}
html,body{height:100%;background:var(--bg);color:var(--ink);margin:0}
a{color:var(--ink);text-decoration:none}
.container{max-width:var(--max-width);margin:0 auto;padding:18px}
.site-header{padding:12px 18px;border-bottom:1px solid rgba(59,44,38,0.06);background:transparent}
.brand-wrap{display:flex;align-items:center;gap:12px}
.brand{font-weight:700;color:var(--ink);font-size:18px}

/* 广告容器（独立且不覆盖正文） */
.ad-zone{max-width:var(--max-width);margin:18px auto;padding:10px;text-align:center;color:var(--muted);font-size:13px}
.ad-zone:empty{display:none}

/* 文章主体基线 */
.layout-root{padding:12px}
.ledger-article{max-width:var(--max-width);margin:0 auto;background:transparent;padding:0 12px}
.article-head{padding:6px 0 18px}
.article-title{margin:6px 0 8px;text-align:center;font-size:28px;line-height:1.15;font-weight:700}
.article-title::first-letter{color:var(--accent)} /* 标题首字首字母强调 */
.article-meta{display:flex;gap:12px;align-items:center;justify-content:center;color:var(--muted);font-size:13px;margin-bottom:12px}
.summary{max-width:900px;margin:0 auto 12px;text-align:left;color:var(--ink);font-size:15px}
.keywords{margin:6px 0 0;color:var(--muted);font-size:13px}

/* GRID 基础（桌面规则在 media query 中覆盖为 12 列） */
.ledger-grid{display:block}
.col-content,.col-faq,.col-meta{margin-top:18px}
.content-surface{padding:12px 6px}
.content-body{line-height:1.8;font-size:15px;color:var(--ink)}
.faq-surface{padding:6px}
.faq-heading{font-size:16px;margin:0 0 8px}
.faq-list{font-size:14px;color:var(--muted)}
.meta-surface{padding:6px;font-size:14px;color:var(--muted)}
.meta-head{margin:0 0 8px;font-size:14px;color:var(--ink)}
.meta-list{margin:0;padding:0;display:grid;grid-template-columns:repeat(2,auto);gap:6px 12px}
.related{margin-top:12px}
.related h4{margin:0 0 8px;font-size:13px}
.related-list{font-size:14px;color:var(--muted)}
.article-foot{margin-top:18px;padding-top:8px;border-top:1px solid var(--line);color:var(--muted);font-size:13px}
.site-footer{padding:18px;text-align:left;border-top:1px solid rgba(59,44,38,0.04);margin-top:30px}
.home-link{color:var(--ink);font-weight:600}

/* 桌面专用：严格实现账页式细网格骨架 */
@media (min-width:1024px){
  :root{--max-width:1280px}
  .layout-root{padding:30px}
  .ledger-article{padding:18px}

  /* 12列网格容器 */
  .ledger-grid{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:min-content;gap:24px 20px;align-items:start}

  /* 标题横跨 12 列（已位于 article-head），在网格中保留上方占位 */
  .grid-title-spacer{grid-column:1/13;height:0}

  /* 正文占 7 列 */
  .col-content{grid-column:1/8}
  .content-surface{border-left:1px solid var(--line);border-right:1px solid var(--line);padding:20px;background:transparent}

  /* FAQ 占 3 列：桌面为左问右答表格式 */
  .col-faq{grid-column:8/11}
  .faq-surface{padding:12px;border:1px solid var(--line)}
  .faq-list > *{display:grid;grid-template-columns:1fr 2fr;gap:8px 12px;padding:8px 0;border-bottom:1px dashed rgba(59,44,38,0.04)}
  .faq-list > *:last-child{border-bottom:0}
  .faq-list dt{font-weight:600;color:var(--ink)}
  .faq-list dd{margin:0;color:var(--muted)}

  /* 元信息轨道占 2 列，直角线框风格 */
  .col-meta{grid-column:11/13}
  .meta-surface{border:2px solid var(--line);padding:14px}

  /* 文章标题在桌面增加字号和间距，保持居中；同时第一字母强调色 */
  .article-title{font-size:34px}

  /* 在桌面保证正文宽度充足，不限制为窄列 */
  .content-body p{max-width:none}
}

/* 手机端专用布局：网格解除，线框只保留为段落顶部细线 */
@media (max-width:767px){
  :root{--max-width:680px}
  html,body{font-size:15px}
  .site-header{padding:10px}
  .brand{font-size:16px}
  .layout-root{padding:10px}
  .ledger-article{padding:6px}
  .article-title{text-align:center;font-size:20px}
  .article-meta{flex-direction:column;gap:6px;align-items:flex-start}
  .summary{text-align:left;padding-top:8px}

  /* 单列流式布局：侧栏下移为自然区块 */
  .ledger-grid{display:block}
  .col-content,.col-faq,.col-meta{margin-top:14px}
  .content-surface{padding:8px}
  .content-body{font-size:15px;line-height:1.9}

  /* 段落顶部细线作为章节分隔 */
  .content-body > *{padding-top:12px}
  .content-body > *:first-child{padding-top:0}
  .content-body > *{border-top:1px solid var(--line)}
  .content-body > *:first-child{border-top:0}

  /* FAQ 改为堆叠：问题在上答案在下 */
  .faq-list > *{display:block;padding:8px 0;border-top:1px solid var(--line)}
  .faq-list dt{font-weight:600}
  .faq-list dd{margin-top:6px;color:var(--muted)}

  .meta-surface{border-top:1px solid var(--line);padding-top:12px}

  /* 广告放置适配手机，仍不得覆盖正文 */
  .ad-zone{padding:8px;font-size:13px}
}

/* 无大面积纯色 Hero：确保首屏信息密度适度 */
@media (min-width:768px) and (max-width:1023px){
  /* 平板中间态，保持舒展 */
  .article-title{font-size:26px}
}

/* 可访问性与可读性细节 */
.article-title,.summary,.content-body{word-wrap:break-word;hyphens:auto}