/* 主题变量 */
:root{
  --navy: #09223a; /* 海军蓝 */
  --mist: #f2f4f6; /* 浅雾灰 */
  --text: #0b1720;
  --muted: #586169;
  --accent: #0f4c81;
  --max-width: clamp(1120px, 70vw, 1440px);
  --gutter: 28px;
  --line: 1px solid #dfe6eb; /* 细线 */
}

/* 全局字体与重置（系统字体） */
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  color:var(--text);
  background: #fff;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  line-height:1.55; /* 紧凑型技术资讯，但保持舒展 */
}
.wrap{max-width:var(--max-width);margin:0 auto;padding:0 20px}

/* Header: 双层报头但第二层极窄，左右分置 */
.site-header{border-bottom:var(--line);background:linear-gradient(180deg, white 0%, white 100%)}
.header-top{height:44px;display:flex;align-items:center}
.header-top .wrap{display:flex;justify-content:space-between;align-items:center}
.header-top .mast-left{font-weight:700;color:var(--navy)}
.header-top .mast-right a{color:var(--accent);text-decoration:none;font-size:14px}

.header-main{height:56px;display:flex;align-items:center}
.header-main-inner{display:flex;justify-content:space-between;align-items:center}
.editorial-left{display:flex;flex-direction:column}
.paper-title{font-size:18px;font-weight:700;color:var(--navy)}
.paper-sub{font-size:12px;color:var(--muted);margin-top:2px}
.editorial-right{font-size:13px;color:var(--muted)}

.ad-slot{padding:12px 20px;color:var(--muted);font-size:14px}
.ad-slot > *{display:block}

/* Container & Grid (中心线版式) */
.container{padding:36px 0}
.content-grid{display:grid;grid-template-columns:1fr 340px;gap:40px;align-items:start;max-width:var(--max-width);margin:0 auto;padding:0 20px}

/* Article 主体 */
.article{background:transparent}
.article-header{margin-bottom:18px}
.title-area{display:flex;align-items:flex-start;gap:24px}
.title-area h1{margin:0;font-size:28px;line-height:1.12;font-weight:700;flex:0 0 60%;color:var(--navy);max-width:720px}
.title-area .summary{margin:0;color:var(--muted);flex:1;font-size:15px}

.meta{margin-top:12px;color:var(--muted);font-size:13px}
.meta .published{margin-right:14px}
.section-sep{border:0;border-top:var(--line);margin:18px 0}

.article-body .content{font-size:15px;color:var(--text)}
.article-body .content p{margin:0 0 12px}

/* FAQ 两列桌面，手机单列 */
.faq-block{margin-top:22px}
.faq-block .section-title{font-size:16px;margin:0 0 10px;color:var(--navy)}
.faq-list{display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:14px}
.faq-list > *{padding:10px 0;border-top:var(--line)}

/* Related 带日期的分隔线列表 */
.related-block{margin-top:20px}
.related-block .section-title{font-size:16px;margin:0 0 10px;color:var(--navy)}
.related-list{display:flex;flex-direction:column}
.related-list > *{padding:12px 0;border-top:var(--line);color:var(--muted);font-size:14px}

/* 侧注（注释栏）——中轴向两侧布局的“边注” */
.annot{padding-top:8px}
.annot-panel{padding:10px 12px}
.annot-title{font-size:13px;margin:0 0 8px;color:var(--navy)}
.annot-item{font-size:14px;color:var(--muted);margin-bottom:10px}
.annot-desc{font-size:13px;color:var(--muted)}
.annot-note{font-size:12px;color:var(--muted);margin-top:6px}
.thin{border:0;border-top:var(--line);margin:10px 0}

/* Footer */
.site-footer{border-top:var(--line);padding:18px 0;margin-top:40px}
.footer-inner{display:flex;justify-content:space-between;align-items:center}
.footer-left{color:var(--muted);font-size:13px}
.footer-right{color:var(--muted);font-size:12px}

/* 视觉规则：直角和细线，禁止阴影与圆角 */
*{border-radius:0}

/* 桌面端强制规则（>=1024px）——中心线版式成立、标题摘要左右分置、正文与注释栏并列、FAQ 两列 */
@media (min-width:1024px){
  .title-area h1{font-size:34px}
  .content-grid{grid-template-columns:1fr 320px;gap:44px}
  .article-body .content{font-size:16px}
  .faq-list{grid-template-columns:repeat(2, minmax(0,1fr))}
  /* 保证容器宽度在合同区间内 */
  .wrap{max-width:var(--max-width)}
}

/* 手机端规则（<=767px）——解除中轴，全部左对齐单列，避免窄正文 */
@media (max-width:767px){
  .header-top{height:48px}
  .header-main{height:48px}
  .wrap{padding:0 14px}
  .content-grid{display:block;padding:0}
  .article{width:100%}
  .annot{margin-top:20px}
  .title-area{display:block}
  .title-area h1{font-size:20px;margin-bottom:8px}
  .title-area .summary{font-size:14px;margin-bottom:4px}
  .meta{font-size:12px}
  .article-body .content{font-size:16px}
  .faq-list{display:block}
  .faq-list > *{padding:10px 0;border-top:var(--line)}
  .related-list > *{padding:10px 0}
  .ad-slot{padding:10px 0}
  .footer-inner{flex-direction:column;gap:8px;align-items:flex-start}
}

/* 中等区间（768px - 1023px）采取接近移动端但更大字号 */
@media (min-width:768px) and (max-width:1023px){
  .content-grid{display:block}
  .title-area{display:block}
  .title-area h1{font-size:24px}
  .faq-list{display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:12px}
}

/* 可访问性和可读性小细节 */
a{color:var(--accent);text-decoration:none}