:root{
  --navy: #0b2740; /* 藏蓝 */
  --paper: #fbf8f3; /* 纸白 */
  --ink: #0f1720;
  --muted: #6b7280;
  --accent: #0b3a66;
  --max-width: 1280px;
  --gap: 20px;
  --sys-font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "PingFang SC", "Microsoft YaHei", sans-serif;
}

/* 全局基础 */
html,body{height:100%;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sys-font);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  line-height:1.55;
  font-size:15px; /* 紧凑型 */
}

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

/* Header：左对齐紧凑品牌，双层报头第二层极窄 */
.site-header{padding:18px 16px 6px;border-bottom:1px solid rgba(11,39,64,0.06);background:transparent}
.header-top{display:flex;align-items:center;gap:16px}
.brand{font-weight:700;color:var(--navy);font-size:18px}
.nav-primary{display:flex;gap:10px;color:var(--muted);font-size:13px;margin-left:auto}
.nav-item{padding:6px 8px}
.header-slim{font-size:12px;color:var(--muted);padding:6px 0 12px;border-top:1px solid rgba(11,39,64,0.04);opacity:0.95}

/* page-wrap: 包含主栏目与侧边元信息栏，桌面为 9/3 分栏 */
.page-wrap{display:flex;flex-direction:column;gap:var(--gap);padding:18px;max-width:calc(100% - 32px);margin:0 auto}

.article{order:1}
.meta-aside{order:2}

/* Article 标题与构图线 */
.article-header{margin-bottom:12px}
.title-rule{height:2px;background:transparent}
.title-rule-top{height:1px;background:linear-gradient(90deg, rgba(11,39,64,0.06), rgba(11,39,64,0.02));margin-bottom:8px}
.article-title{font-size:22px;line-height:1.18;margin:0 0 8px;font-weight:700;text-align:left;color:var(--navy)}
.title-rule-bottom{height:4px;background:var(--navy);width:56px;margin-top:8px;margin-bottom:12px}

.lead-meta{font-size:12px;color:var(--muted);display:flex;gap:8px;align-items:center}
.description{margin:12px 0 18px;color:var(--muted);font-size:14px}

/* Content 区域：通栏展示，模块无容器，紧凑信息密度 */
.content{font-size:15px;color:var(--ink);word-wrap:break-word}
.content p{margin:0 0 12px}

.section-title{font-size:15px;color:var(--navy);margin:16px 0 10px;font-weight:600}

/* FAQ：无卡片的 details 折叠列表 */
.faq-list details{border-top:1px solid rgba(11,39,64,0.06);padding:10px 0}
.faq-list summary{cursor:pointer;font-weight:600;color:var(--accent);list-style:none}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list details p{margin:8px 0 0;color:var(--muted)}

/* Related：底部三列短卡但不用阴影 */
.related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.related-grid > *{background:transparent;padding:8px;border-top:1px solid rgba(11,39,64,0.04);font-size:14px}

/* Meta aside 视觉签名：桌面端沿边缘纵向排列 */
.meta-aside{padding:8px 0}
.meta-rail{display:flex;flex-direction:column;gap:10px;border-left:1px solid rgba(11,39,64,0.04);padding-left:14px}
.meta-item{font-size:13px;color:var(--muted)}
.meta-item strong{display:block;color:var(--navy);font-weight:600;margin-bottom:4px}
.meta-value{display:block;color:var(--muted);font-size:13px}

/* Ad slots : 独立容器，不悬浮、不覆盖 */
.ad-slot{margin:16px 0;padding:8px 10px;border:1px dashed rgba(11,39,64,0.06);color:var(--muted);font-size:13px;text-align:center;background:transparent}

/* Footer */
.site-footer{padding:18px;text-align:center;color:var(--muted);font-size:13px;border-top:1px solid rgba(11,39,64,0.04);margin-top:24px}

/* --- 桌面布局（必须含 @media (min-width: 1024px)） --- */
@media (min-width:1024px){
  .page-wrap{display:grid;grid-template-columns:3fr 1fr;gap:28px;align-items:start;max-width:var(--max-width);margin:12px auto;padding:32px}
  .article{order:1}
  .meta-aside{order:2}
  .article-title{font-size:26px}
  .content{font-size:15px}
  .related-grid{grid-template-columns:repeat(3,1fr)}
}

/* 保证容器在更宽屏幕时处于 1120px—1440px 范围（兼顾不同桌面） */
@media (min-width:1120px){
  .page-wrap{max-width:1280px;padding:36px}
}
@media (min-width:1440px){
  .page-wrap{max-width:1400px}
}

/* 元信息沿桌面端边缘：使 meta-rail 视觉更靠右侧边 */
@media (min-width:1024px){
  .meta-rail{align-self:start;position:sticky;top:24px}
}

/* --- 手机端（必须含 @media (max-width: 767px)） --- */
@media (max-width:767px){
  body{font-size:15px}
  .site-header{padding:12px}
  .nav-primary{display:none}
  .header-slim{display:block;padding:6px 0 8px}
  .page-wrap{display:block;padding:12px}
  .article{order:1}
  .meta-aside{order:2;margin-top:8px;border-top:1px solid rgba(11,39,64,0.04);padding-top:10px}
  .meta-rail{border-left:none;padding-left:0;flex-direction:column}
  .related-grid{grid-template-columns:repeat(1,1fr)}
  .related-grid > *{padding:10px 0}
  .title-rule-bottom{width:44px}
  .article-title{font-size:20px}
  .faq-list details{padding:8px 0}
  /* 标签可换行 */
  .nav-item{white-space:normal}
  /* 保证 320px 时不横向滚动 */
  .page-wrap{max-width:100%;box-sizing:border-box}
}
