:root{
  --palette-foreground:#5a2a22; /* 砖红深色 */
  --palette-bg:#efe6dc; /* 砂岩白 */
  --white:#ffffff;
  --muted:#6b6b6b;
  --accent:#8a3b32;
  --max-wide-desktop:1320px;
  --band-padding:28px;
  --compact-line:1.45;
  --font-stack:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans CJK SC","PingFang SC","Hiragino Sans GB","Microsoft Yahei",sans-serif;
}

/* Reset minimal */
*{box-sizing:border-box}
html,body{height:100%;margin:0;font-family:var(--font-stack);color:#222;background:var(--palette-bg);-webkit-font-smoothing:antialiased}
img,figure{max-width:100%;height:auto}
a{color:inherit;text-decoration:none}

/* Header */
.site-header{background:var(--palette-foreground);color:var(--white)}
.header-inner{max-width:var(--max-wide-desktop);margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:12px 20px}
.brand{font-weight:700;letter-spacing:0.4px;color:var(--white)}
.nav-index{display:flex;gap:18px;color:rgba(255,255,255,0.9);font-size:13px}
.nav-item{opacity:0.95}

/* Bands baseline */
.band{padding:18px 0;border-top:1px solid rgba(0,0,0,0.02)}
.band-inner{margin:0 auto;padding:var(--band-padding)}
.band-width-900{max-width:900px}
.band-width-1100{max-width:1100px}
.band-width-1200{max-width:1200px}
.band-width-1300{max-width:1300px}

.ad-slot{background:transparent;color:var(--muted);font-size:14px}

/* Title band */
.band-title{background:linear-gradient(0deg, rgba(0,0,0,0.02), rgba(0,0,0,0.02)),var(--palette-bg)}
.title-frame{padding-top:30px;padding-bottom:22px}
.page-title{margin:0;font-size:28px;line-height:1.08;text-align:center;color:var(--palette-foreground);font-weight:800}
.meta-row{margin-top:10px;text-align:center;color:var(--muted);font-size:13px}
.meta-row .sep{margin:0 8px;color:rgba(0,0,0,0.15)}
.summary{margin-top:18px;margin-bottom:0;font-size:15px;line-height:var(--compact-line);max-width:820px;color:#333;text-align:left}

/* Content band */
.band-content{background:var(--white)}
.content-grid{display:block}
.article{color:#111}
.article-meta.small{font-size:13px;color:var(--muted);margin-bottom:12px}
.article-body{font-size:16px;line-height:var(--compact-line);color:#222}
.article-body p{margin:1em 0}

.side-box{margin-top:18px}
.side-square{background:var(--palette-bg);border:1px solid rgba(0,0,0,0.04);padding:14px;display:flex;flex-direction:column;align-items:flex-start}
.side-title{font-weight:700;color:var(--palette-foreground);margin-bottom:8px}
.side-body{font-size:13px;color:var(--muted);min-height:48px;width:100%}

/* FAQ */
.faq-frame{padding-top:18px;padding-bottom:18px}
.section-title{margin:0 0 12px 0;font-size:17px;color:var(--palette-foreground)}
.faq-list{counter-reset:faq-counter}
.faq-list > *{margin:10px 0;padding:12px;background:rgba(0,0,0,0.02);border-left:4px solid rgba(0,0,0,0.04)}
/* 编号式样式：若内容提供了多个块级 FAQ 项，使用数字前缀 */
.faq-list > *:before{counter-increment:faq-counter;content:counter(faq-counter) ". ";font-weight:700;color:var(--accent);margin-right:8px}

/* Related grid */
.related-frame{padding-top:18px;padding-bottom:22px}
.related-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.related-grid > *{background:transparent;padding:8px 0;font-size:14px;color:#1a1a1a}
.related-grid a{display:block;color:inherit}

/* Footer visual signature: wide-screen index style */
.site-footer{background:var(--palette-foreground);color:var(--white);padding:22px 0}
.footer-inner{max-width:var(--max-wide-desktop);margin:0 auto;padding:0 20px}
.footer-index{display:flex;gap:40px}
.index-column h3{margin:0 0 8px 0;font-size:14px}
.index-column ul{list-style:none;padding:0;margin:0}
.index-column li{margin:6px 0;color:rgba(255,255,255,0.9)}
.footer-bottom{border-top:1px solid rgba(255,255,255,0.05);margin-top:16px;padding-top:12px;color:rgba(255,255,255,0.8);font-size:13px}

/* Density: 紧凑 */
.page-title{letter-spacing:-0.2px}
.band-inner{padding-left:20px;padding-right:20px}

/* Desktop rules: 非对称网格，正文宽度舒适（在 1120px—1440px 范围内使用更宽的容器） */
@media (min-width:1024px){
  :root{--band-padding:32px}
  .band-inner{padding-left:28px;padding-right:28px}
  .band-width-900{max-width:900px}
  .band-width-1100{max-width:1100px}
  .band-width-1200{max-width:1200px}
  .band-width-1300{max-width:1300px}

  /* Title composition: 标题居中，摘要左对齐（已由 HTML 布局保证）；在大屏标题带更多留白 */
  .band-title{padding-top:32px;padding-bottom:28px}
  .page-title{font-size:36px}
  .summary{font-size:15px}

  /* 内容区：非对称两栏，正文占比更宽，侧边为方形信息块 */
  .content-grid{display:grid;grid-template-columns:1fr 300px;gap:28px;align-items:start}
  .band-content{padding-top:30px;padding-bottom:30px}
  .article-body{font-size:18px;line-height:1.6}
  .side-square{width:100%;height:100%;min-height:160px}

  /* Related: 四列紧凑标题网格（通过允许更多列实现） */
  .related-grid{grid-template-columns:repeat(4,1fr);gap:14px}
  .related-grid > *{font-size:14px;padding:6px}

  /* Footer becomes multi-column index */
  .footer-index{display:flex}
}

/* Mobile rules: 单列重排，取消过宽内边距，颜色轻量区分 */
@media (max-width:767px){
  :root{--band-padding:16px}
  .header-inner{padding:10px 16px}
  .band-inner{padding-left:12px;padding-right:12px}

  /* Title and summary adjust */
  .page-title{font-size:20px;text-align:center}
  .summary{font-size:14px}
  .meta-row{font-size:12px}

  /* Content becomes single column; side box 下移为正常区块 */
  .content-grid{display:block}
  .side-box{margin-top:16px}
  .side-square{min-height:80px}
  .article-body{font-size:16px;line-height:1.5}

  /* Related grid single column */
  .related-grid{grid-template-columns:1fr;gap:12px}

  /* FAQ simplified spacing */
  .faq-list > *{padding:10px}

  /* Footer stacks */
  .footer-index{display:block}
  .index-column{margin-bottom:12px}
}

/* Accessibility / readability tweaks */
h1,h2,h3{line-height:1.15}
.small{font-size:13px}

/* Forbid visual patterns explicitly: no gradients blue/purple, no glow buttons - enforced by palette and styles above */