:root{
  --bg:#f6fafb; /* 淡青灰背景 */
  --surface:#ffffff;
  --frame:#cbdfe2; /* 细边框青灰 */
  --accent:#4aa3c3; /* 湖蓝 */
  --muted:#6b7a7d;
  --text:#111316;
  --serif:"Songti SC","Hiragino Mincho ProN","Georgia",serif;
  --sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  --content-max:1280px;
}

/* 全局重置与排版 */
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:var(--sans);
  color:var(--text);
  background:var(--bg);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  line-height:1.65;
}

.frame-root{
  max-width:1440px;
  margin:18px auto;
  padding:18px;
  background:linear-gradient(180deg, transparent, transparent); /* placeholder, no visible gradient */
}

/* 外框式总边框（桌面有效） */
.frame-root::before,
.frame-root::after{content:"";display:block}

/* 站点刊头 */
.site-header{display:flex;justify-content:center;padding:8px 0 12px}
.masthead{width:100%;max-width:var(--content-max);text-align:center;padding-bottom:8px;border-bottom:2px solid var(--frame)}
.site-name{font-family:var(--serif);font-size:20px;color:var(--text);font-weight:600}
.index-bar{margin-top:10px;display:flex;justify-content:center;gap:18px;flex-wrap:wrap}
.index-bar a,.index-bar .index-item{font-size:13px;color:var(--muted);text-decoration:none}
.index-bar a.home{color:var(--accent);font-weight:600}

/* 页面主壳 */
.page-shell{max-width:var(--content-max);margin:18px auto}
.content-grid{display:grid;grid-template-columns:1fr;gap:18px}

/* 文章主体 */
.article{background:var(--surface);border-top:1px solid var(--frame);border-bottom:1px solid var(--frame);padding:18px}
.article-head{padding-bottom:14px}
.title{font-family:var(--serif);font-size:26px;margin:0 0 8px;color:var(--text);position:relative;padding-left:6px}
/* 标题构图：左压并用粗细横线 */
.title::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);height:2px;width:36px;background:var(--accent)}
.title::after{content:"";position:absolute;left:44px;top:50%;transform:translateY(-50%);height:1px;width:100px;background:var(--frame)}

.meta-row{font-size:13px;color:var(--muted);margin-bottom:10px}
.summary{margin:0 0 14px;color:var(--muted)}

.article-body .content{color:var(--text);font-size:16px}
.article-body h2{margin-top:22px;margin-bottom:10px;font-size:18px}

/* 视觉签名：章节标题带短编号线但不生成编号 */
.section-title{display:flex;align-items:center;gap:10px;font-size:15px;margin:18px 0 10px;padding-top:6px}
.section-title::before{content:"";display:block;width:28px;height:4px;background:var(--accent);border-radius:2px}

/* FAQ 主题色顶部边线 */
.faq{border-top:3px solid var(--accent);background:linear-gradient(0deg,rgba(74,163,195,0.02),transparent);padding:12px;margin-top:12px}
.faq .faq-body{color:var(--text);font-size:15px}

/* 相关阅读：分隔线列表，若关联项含日期则展示 */
.related-list{margin-top:8px}
.related-list > *{display:block;padding:10px 0;border-top:1px solid var(--frame)}
.related-list a{color:var(--accent);text-decoration:none}
.related-list .item-meta{color:var(--muted);font-size:13px;display:block;margin-top:6px}

/* 侧栏 */
.sidebar{background:var(--surface);padding:18px;border-left:1px solid var(--frame);border-top:1px solid var(--frame);border-bottom:1px solid var(--frame)}
.side-box{border-top:1px solid var(--frame);padding-top:12px;margin-bottom:14px}
.side-title{font-size:13px;color:var(--muted);margin:0 0 8px}
.side-list{list-style:none;padding:0;margin:0;color:var(--text)}
.side-list li{padding:6px 0;border-top:1px dashed var(--frame);font-size:14px}
.small-note{font-size:13px;color:var(--muted)}

/* 广告插槽样式（独立，不覆盖正文） */
.ad-slot{background:transparent;padding:10px 0;text-align:center;color:var(--muted);font-size:13px}
.ad-slot > *{display:inline-block}

/* 页脚 */
.site-footer{margin-top:18px;padding-top:12px;padding-bottom:6px;text-align:center;color:var(--muted);font-size:13px}

/* --- 桌面端规则（必须包含） --- */
@media (min-width:1024px){
  .frame-root{border:1px solid var(--frame);padding:22px 26px}
  .content-grid{grid-template-columns:calc(8/12*100%) calc(4/12*100%);gap:26px}
  .article{padding:26px}
  .title{font-size:32px}
  .article-body .content{font-size:17px;line-height:1.8}
  .sidebar{padding:22px}
  /* 桌面独有：边注式布局与非对称网格体现 */
  .article{grid-column:1}
  .sidebar{grid-column:2}
}

/* --- 手机端规则（必须包含） --- */
@media (max-width:767px){
  body{padding:0 10px}
  .frame-root{margin:8px auto;padding:12px}
  /* 移除总框架左右边线（视觉上不显示帧边） */
  .frame-root{border:none}
  .masthead{padding-bottom:6px;border-bottom:1px solid var(--frame)}
  .content-grid{grid-template-columns:1fr}
  .article{padding:14px;border-left:none;border-right:none}
  .sidebar{order:3;padding:12px;border-left:none;border-top:1px solid var(--frame)}
  .site-header{padding:8px 0}
  .title{font-size:20px}
  .article-body .content{font-size:16px}
  /* 侧栏下移并成为自然区块（不固定） */
  .side-box{padding-top:10px}
  /* 紧凑的索引条恢复为横向可滚动 */
  .index-bar{justify-content:flex-start;overflow:auto;padding:8px 6px}
  .index-bar .index-item{white-space:nowrap;margin-right:14px}
  .ad-slot{font-size:12px}
}

/* 可访问性微调 */
a:focus{outline:2px dotted var(--accent);outline-offset:2px}