:root{
  --paper:#f7f6f3; /* 轻纸张底色 */
  --ink:#22262a; /* 深色文字 */
  --muted:#6e7780; /* 次要文字 */
  --accent:#5aa6c2; /* 湖蓝主题 */
  --edge:#cfd8da; /* 青灰边线 */
  --max-width:1280px; /* 容器在1120-1440之间，取中值 */
  --gutter:24px;
  --sys-font: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans CJK SC",sans-serif;
}

/* 全局基础 */
html,body{height:100%;margin:0;color:var(--ink);background:var(--paper);font-family:var(--sys-font);-webkit-font-smoothing:antialiased}
.page{max-width:var(--max-width);margin:28px auto;padding:0 20px}
.site-header{padding:12px 0;border-bottom:1px solid var(--edge);background:transparent}
.top-nav{display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:var(--max-width);margin:0 auto;padding:0 20px}
.top-nav .nav-side{display:flex;gap:12px;color:var(--muted);font-size:13px}
.top-nav .nav-center{flex:0 0 auto}
.site-title{font-weight:700;color:var(--ink);text-decoration:none;font-size:18px}

/* Headline: split composition */
.headline{display:grid;gap:18px;align-items:start;margin:26px 0}
.headline-title{order:0}
.headline-summary{order:1}
.headline-title h1{margin:0;color:var(--ink);font-weight:800;line-height:1.05;font-size:28px;letter-spacing:0.1px}
.title-rule{margin-top:8px;height:18px;display:flex;gap:10px;align-items:center}
.title-rule span:first-child{flex:1;height:2px;background:var(--ink);opacity:0.12}
.title-rule span:last-child{width:64px;height:4px;background:var(--accent);border-radius:2px}
.headline .meta{color:var(--muted);font-size:13px;margin-bottom:8px}
.headline .summary{margin:0;color:var(--muted);font-size:15px;line-height:1.6}

/* Ads simple blocks, no floating */
.ad-container{margin:18px 0;padding:10px;border-top:1px dashed var(--edge);color:var(--muted);font-size:13px}
.ad-top,.ad-middle,.ad-bottom{background:transparent}

/* Content grid: default mobile (stack) */
.content-grid{display:block}
.content{margin-bottom:18px}
.content-body{color:var(--ink);font-size:16px;line-height:1.8}
.content-body p{margin:0 0 1em}
/* 视觉标识：正文首字强调(首字放大、不改写内容) */
.content-body p:first-child::first-letter{font-size:2.4em;float:left;line-height:1;padding-right:6px;color:var(--accent);font-weight:700}

/* Aside blocks */
.side{border-left:0;padding-left:0}
.faq{margin-bottom:18px;padding-top:10px;border-top:3px solid var(--accent)} /* faq_pattern: 主题色顶部边线 */
.faq-title{margin:0 0 10px;font-size:15px;color:var(--ink);font-weight:700}
.faq-list{color:var(--muted);font-size:14px;line-height:1.6}
.related{margin-top:8px}
.related-title{margin:0 0 10px;font-size:14px;color:var(--ink);font-weight:700}
.related-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.related-grid > *{font-size:14px;color:var(--muted)}

/* Footer */
.site-footer{padding:18px 20px 40px;color:var(--muted);font-size:13px;text-align:center;border-top:1px solid var(--edge);margin-top:20px}

/* Desktop rules: distinct layout, 2-stage change per blueprint */
@media (min-width:1024px){
  .page{padding:0 28px}
  /* Headline split: title left half, summary right half */
  .headline{grid-template-columns:1fr 1fr;align-items:start}
  .headline-title{padding-right:24px}
  .headline-summary{padding-left:24px}
  .headline-title h1{font-size:36px}

  /* After headline, enter 7/5 two-column grid */
  .content-grid{display:grid;grid-template-columns:7fr 5fr;gap:28px;align-items:start}
  .content{order:0}
  .side{order:1}

  /* Related pattern: four-column compact title grid */
  .related-grid{grid-template-columns:repeat(4,1fr);gap:10px}
  .related-grid > *{font-size:13px;color:var(--muted)}

  /* Slightly denser typography for desktop headlines */
  .headline .summary{font-size:15px}
  .content-body{font-size:17px;line-height:1.9}
}

/* Mobile rules: independent reflow, stacked headline */
@media (max-width:767px){
  .page{margin:12px auto;padding:0 14px}
  .top-nav{padding:0 14px}
  .headline{grid-template-columns:1fr;gap:12px}
  .headline-title h1{font-size:20px}
  .headline .summary{font-size:14px}
  .title-rule span:last-child{width:44px}

  /* content stacked: title, summary, content, faq, related */
  .content-grid{display:block}
  .content{margin-bottom:14px}
  .content-body{font-size:15px;line-height:1.75}
  .related-grid{grid-template-columns:repeat(2,1fr);gap:8px}
}

/* Accessibility helpers */
a{color:inherit}
h1,h2,h3{line-height:1.15}
/* 禁止玻璃拟态、模糊、悬浮卡片等：不使用滤镜、阴影或大圆角 */