/* 样式：适配蓝图 centered-column-notes，色彩：深棕与奶油白 */
:root{
  --bg: #f8f2ea; /* 奶油白 */
  --ink: #3b2b2a; /* 深棕 */
  --muted: #6b5a58;
  --accent: #6b4f49;
  --max-width: 1280px; /* 在1120-1440范围内 */
  --center-width: 780px; /* 桌面正文居中宽度 */
  --left-width: 220px;
  --right-width: calc(var(--max-width) - var(--left-width) - var(--center-width));
  --gutter: 28px;
  --serif: Georgia, 'Times New Roman', Times, serif;
  --ui: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}

/* 全局重置与布局基准 */
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:var(--serif);
  background:var(--bg);
  color:var(--ink);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  line-height:1.6;
  letter-spacing:0.01em;
}
a{color:var(--accent);text-decoration:none}
a:focus{outline:2px solid rgba(59,43,42,0.12)}
.page-header{padding:20px 16px 8px;border-bottom:1px solid rgba(59,43,42,0.06);background:transparent}
.header-line{display:flex;justify-content:space-between;align-items:center;font-family:var(--ui);color:var(--muted);font-size:13px}
.header-nav .home-link{font-weight:700;color:var(--ink)}
.header-masthead{padding-top:10px;padding-bottom:8px}
.masthead-large{font-family:var(--ui);font-weight:800;letter-spacing:0.02em;color:var(--ink);font-size:28px}
.masthead-bar{height:3px;background:var(--ink);width:64px;margin-top:8px;opacity:0.06}

/* 页面主布局容器 */
.page-layout{display:flex;justify-content:center;padding:20px 16px 60px}
.layout-inner{width:100%;max-width:var(--max-width);display:grid;grid-template-columns:var(--left-width) var(--center-width) var(--right-width);gap:var(--gutter);align-items:start}

/* 左栏（元信息） */
.col-left{font-family:var(--ui);color:var(--muted);font-size:13px}
.meta-block{margin-bottom:18px}
.meta-item{margin-bottom:6px}
.summary-block .block-title{font-weight:700;color:var(--ink);font-size:13px;margin-bottom:8px}
.summary{margin:0;color:var(--ink);font-size:14px;line-height:1.5}

/* 中心正文 */
.col-center{background:transparent}
.article-head{margin-bottom:8px}
.article-title{font-family:var(--ui);font-size:28px;margin:0 0 10px 0;color:var(--ink);line-height:1.12;font-weight:700}
.article-body{font-size:16px;color:var(--ink);font-family:var(--serif);line-height:1.7}
.content{white-space:pre-wrap}

/* FAQ 块：横线问答列表（由内容提供实际问答元素） */
.faq-section{margin-top:26px}
.faq-section .block-title{font-family:var(--ui);font-size:14px;color:var(--ink);margin-bottom:12px;font-weight:700}
.faq-list hr{border:none;border-top:1px solid rgba(59,43,42,0.06);margin:12px 0}
.faq-list p{margin:8px 0}

/* 右侧相关阅读：四列紧凑标题网格（桌面） */
.col-right{font-family:var(--ui);font-size:13px;color:var(--muted)}
.col-right .block-title{font-weight:700;color:var(--ink);margin-bottom:12px}
.related-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;font-size:13px}
.related-grid > *{line-height:1.25;color:var(--ink)}

/* 广告容器样式：独立模块，不悬浮 */
.ad-slot{margin:18px 0;padding:6px 8px;border:1px dashed rgba(59,43,42,0.06);background:transparent;color:var(--muted);font-family:var(--ui);font-size:13px}
.ad-top{max-width:var(--max-width);margin-left:auto;margin-right:auto}
.ad-middle{margin-top:20px}
.ad-bottom{margin-top:34px}

/* 页脚 */
.site-footer{padding:22px 16px;border-top:1px solid rgba(59,43,42,0.06);color:var(--muted);font-family:var(--ui);font-size:13px;text-align:center}

/* 可访问性与辅助类 */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}

/* 响应：桌面规则（必须包含 min-width:1024px） */
@media (min-width:1024px){
  body{padding-bottom:40px}
  .layout-inner{grid-template-columns:var(--left-width) var(--center-width) var(--right-width);gap:32px}
  .col-left{position:relative}
  .col-center{max-width:var(--center-width);margin:0 auto}
  .article-title{font-size:34px}
  .masthead-large{font-size:34px}
  .related-grid{gap:10px}
  /* 加强桌面大面积留白与紧凑字阶 */
  .page-layout{padding-top:26px}
}

/* 响应：移动规则（必须包含 max-width:767px） */
@media (max-width:767px){
  :root{--gutter:16px}
  .layout-inner{display:block;width:100%;padding:0}
  .col-left{order:2;padding:0 6px}
  .col-center{order:1;padding:0 10px}
  .col-right{order:3;padding:0 10px;margin-top:18px}
  .page-layout{padding:8px 8px 40px}
  .masthead-large{font-size:20px}
  .article-title{font-size:20px;line-height:1.15}
  .meta-item{font-size:13px}
  .summary{font-size:15px}
  .related-grid{grid-template-columns:repeat(2,1fr);gap:8px}
  .ad-slot{margin:12px 0}
  /* 确保在320px下无横向滚动 */
  html,body{overflow-x:hidden}
  .col-center,.col-left,.col-right{width:100%}
}

/* 中间断点（768-1023）保持阅读友好 */
@media (min-width:768px) and (max-width:1023px){
  .layout-inner{max-width:960px;display:block}
  .col-center{padding:0 12px}
  .related-grid{grid-template-columns:repeat(3,1fr)}
}