:root{
  --bg:#f8f6f2; /* 象牙白 */
  --surface:#ffffff;
  --line:#d4d0cc; /* 深紫灰调细线 */
  --accent:#414b67; /* 主色调深紫灰 */
  --muted:#6b6870;
  --text:#222;
  --max-width:1280px; /* 在1120-1440之间，选择中间值 */
  --gap:20px;
  --container-padding:18px;
}

/* 基础排版 */
*{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 CJK SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  background:var(--bg);
  color:var(--text);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

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

.container{max-width:var(--max-width);margin:24px auto;padding:0 var(--container-padding)}

/* 头部：极简细导航 */
.site-header{background:transparent;padding:14px 0;border-bottom:1px solid var(--line)}
.header-inner{max-width:var(--max-width);margin:0 auto;display:flex;align-items:center;gap:12px;padding:0 var(--container-padding)}
.brand{font-weight:700;color:var(--accent);letter-spacing:0.2px}
.index-bar{margin-left:auto;display:flex;gap:12px;color:var(--muted);font-size:13px}
.index-item{white-space:nowrap}

/* 广告占位样式（不悬浮、不覆盖） */
.ad-area{max-width:var(--max-width);margin:12px auto;padding:10px;box-sizing:border-box;border:1px dashed var(--line);background:transparent;color:var(--muted);font-size:13px}
.ad-area .ad{display:block}

/* ledger-grid 主结构：12 列网格 */
.ledger-grid{display:grid;grid-template-columns:1fr;}
.article{background:transparent}
.article-header{padding:6px 0 10px}
.article-title{font-size:28px;margin:8px 0 6px;color:var(--accent);font-weight:700}
.meta-line{display:flex;gap:12px;color:var(--muted);font-size:13px}
.summary{margin:12px 0;color:var(--muted);padding:10px 12px;border-top:1px solid transparent}

/* 内容包装，用以在桌面形成账页式细网格骨架 */
.content-wrap{display:block;margin-top:10px}
.main-content{min-width:0}
.content{color:var(--text);line-height:1.8}

/* 视觉签名：正文首段轻量首字强调（不改写文本） */
.content p:first-of-type::first-letter{float:left;font-size:1.6em;color:var(--accent);font-weight:600;line-height:1;margin-right:6px}

/* FAQ 与相关 */
.section-title{font-size:16px;margin:0 0 10px;color:var(--accent)}
.faq-list{display:block}
.related-list{list-style:none;padding:0;margin:0}
.related-list > li{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid var(--line);font-size:14px}
.related-list > li a{color:var(--text)}
.related-list time{color:var(--muted);font-size:13px;margin-left:12px}

.meta-track{margin-top:18px}
.meta-box{border:1px solid var(--line);padding:10px;margin-bottom:12px;background:rgba(255,255,255,0.6)}
.meta-title{margin:0 0 6px;color:var(--accent);font-size:13px}
.meta-key,.meta-desc{margin:0;color:var(--muted);font-size:13px}

.article-footer{margin-top:18px;padding-top:12px}
.copyright{color:var(--muted);font-size:13px;margin:8px 0}
.site-footer{border-top:1px solid var(--line);padding:12px 0;margin-top:18px;text-align:center;color:var(--muted);font-size:13px}

/* 蓝图与响应式要求 */
@media (min-width:1024px){
  /* 桌面：启用12列细网格，最大宽度约束在1120-1440之间 */
  .ledger-grid{grid-template-columns: repeat(12, 1fr);gap:var(--gap)}
  .container{padding:0}
  .article{grid-column:1 / -1}

  /* 标题横跨12列 */
  .article-header{grid-column:1 / -1;padding:10px 0}
  .article-title{font-size:34px}

  /* 内容占7列（1-7），FAQ占3列（8-10），元信息轨道占2列（11-12） */
  .content-wrap{display:grid;grid-template-columns:repeat(12,1fr);grid-column:1 / -1;gap:18px;align-items:start}
  .main-content{grid-column:1 / span 7}
  .faq-block{grid-column:8 / span 3;padding:6px 0}
  .meta-track{grid-column:11 / span 2}

  /* FAQ 两列布局 */
  .faq-list{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}

  /* 线框语言：直角细线 */
  .meta-box{border-radius:2px}
  .ad-area{border-radius:2px}
}

@media (max-width:767px){
  /* 手机端：网格解除，线框只保留为段落顶部细线 */
  .container{padding:0 12px}
  .header-inner{padding:0 12px}
  .article-title{font-size:20px}
  .meta-line{flex-direction:row;gap:8px;font-size:12px}
  .summary{border-top:1px solid var(--line);padding-top:10px}

  /* 将所有侧边轨道下移为顺序区块 */
  .content-wrap{display:block}
  .main-content{order:1}
  .faq-block{order:2;margin-top:16px}
  .meta-track{order:3;margin-top:16px}

  /* FAQ 改为单列 */
  .faq-list{display:block}
  .faq-list > *{margin-bottom:12px}

  /* 段落顶部仅保留细线，其他边框收起 */
  .meta-box{border:0;border-top:1px solid var(--line);padding:10px 0;background:transparent}
  .ad-area{border:0;border-top:1px dashed var(--line);padding:10px 0}

  /* 保证在窄屏 320px 时不出现横向滚动 */
  img,iframe,embed,object,video{max-width:100%;height:auto}
  .related-list > li{flex-direction:row;gap:8px}
}

/* 可读性与密度控制 */
.content p{margin:0 0 12px;font-size:15px}
.content h2,.content h3{margin:18px 0 8px;color:var(--accent)}

/* 禁止常见被禁止的视觉套路：不使用大圆角、渐变、重阴影 */
/* visual signature 已实现为正文首字轻量强调 */