:root{
  --bg:#efe7dd; /* 砂岩白 */
  --paper:#fffefa; /* 纸张色 */
  --accent:#b93b2f; /* 砖红 */
  --muted:#7a6f68;
  --line:#e7dfd6;
  --max-desktop-width:1280px;
  --gap:20px;
  font-family: system-ui, -apple-system, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", Arial, "Noto Sans CJK SC", sans-serif;
  color: #222;
}
html,body{height:100%;margin:0;background:linear-gradient(180deg,var(--bg) 0%, #f7f3ee 100%);}
a{color:inherit;text-decoration:none}
.site-header{position:relative}

/* 左侧纵向刊头（desktop）和顶部堆叠（mobile） */
.side-index{
  display:flex;flex-direction:column;gap:12px;padding:18px 16px;border-bottom:1px solid var(--line);background:transparent;color:#fff;position:fixed;left:0;top:0;bottom:0;width:220px;box-sizing:border-box;
}
.side-index .brand a{font-weight:700;color:var(--accent);background:transparent}
.side-index .index-list{list-style:none;padding:0;margin:4px 0 0 0;color:var(--muted)}
.side-index .index-list li{padding:6px 0}

/* 主体布局容器：在桌面保持宽度范围1120-1440 */
.site-main{margin-left:240px;padding:48px 32px 80px;box-sizing:border-box;}
@media (min-width:1024px){
  .site-main{width:clamp(1120px,90vw,var(--max-desktop-width));margin-left:240px;margin-right:auto}
}

/* 文章“偏移纸张”样式：偏移但无阴影、无大圆角 */
.sheet{background:var(--paper);border:1px solid var(--line);padding:28px 36px;color:var(--muted);box-sizing:border-box}
.article-header{margin-bottom:18px}
.title-row{display:grid;grid-template-columns:1fr 220px;align-items:start;gap:16px}

/* 标题向左越出正文基线：仅在桌面有效 */
h1{font-size:32px;line-height:1.05;margin:0 0 8px 0;font-weight:800;color:#181818;letter-spacing:-0.02em}
@media (min-width:1024px){
  .sheet{transform:translateX(-36px)} /* 偏移效果：像偏移纸张 */
  .site-main{padding-left:80px}
  h1{font-size:40px;margin-left:-46px;padding-left:8px}
}

/* 窄元信息列 */
.meta-col{font-size:13px;color:var(--muted);text-align:right}
.meta-item{padding:4px 0}
.summary{color:#333;margin:12px 0 18px;font-size:15px}

/* 正文：舒展、可读行宽 */
.article-body{color:#222;font-size:16px;line-height:1.78;hyphens:auto}
.article-body p{margin:0 0 1em}
.article-body h2{margin:28px 0 12px;font-size:18px;color:#111}

/* 视觉签名：章节标题带短编号线，但不自动编号 */
.section-title{display:flex;align-items:center;gap:10px;font-size:16px;margin:0 0 12px;color:var(--accent)}
.section-line{display:inline-block;width:28px;height:3px;background:var(--accent);border-radius:2px}

/* FAQ 区顶部边线主题色 */
.faq-region{border-top:4px solid var(--accent);padding-top:12px;margin-top:22px}
.faq-list{color:#333}

/* 相关阅读：编号列表样式 */
.related-region{margin-top:18px}
.related-list{counter-reset:item;padding-left:18px;margin:6px 0 0 0}
.related-list > *{margin:6px 0;padding-left:8px}
.related-list ol, .related-list ul{margin:0;padding:0}

/* 广告槽样式：独立容器，不悬浮，不遮盖 */
.ad-slot{margin:18px 0;padding:12px;border:1px dashed var(--line);background:transparent;color:var(--muted);font-size:14px}
.ad-top{margin-top:10px}

/* 脚注与页脚 */
.site-footer{margin-top:28px;padding:18px 0;color:var(--muted);font-size:13px}
.footer-inner{border-top:1px solid var(--line);padding-top:10px}

/* 密集布局调控 */
.sheet, .article-body, .faq-region, .related-region{max-width:100%}

/* 禁止阴影、大圆角等 */
.sheet{border-radius:0}

/* 手机端规则：取消偏移与越界，所有元素回到安全边距内 */
@media (max-width:767px){
  .side-index{position:relative;flex-direction:row;align-items:center;width:100%;height:auto;padding:10px 12px;gap:8px;border-bottom:1px solid var(--line)}
  .side-index .index-list{display:none}
  .site-main{margin:0;padding:18px}
  .sheet{transform:none;padding:18px}
  h1{font-size:22px;margin-left:0}
  .title-row{grid-template-columns:1fr;gap:8px}
  .meta-col{text-align:left;font-size:13px}
  .article-body{font-size:15px;line-height:1.7}
  .ad-slot{font-size:13px}
  /* 在320px下确保不横向滚动 */
  body{min-width:0}
  .site-main,.sheet{width:100%;box-sizing:border-box}
}

/* 桌面特有增强：非对称网格与窄边注 */
@media (min-width:1024px){
  .content-area{display:block}
  .sheet{display:block}
  .title-row{align-items:flex-end}
}