:root{
  --bg:#f6f1f2;
  --surface:#ffffff;
  --surface-2:#fbf2f3;
  --surface-3:#f4e7ea;
  --text:#342c30;
  --text-muted:#6d6167;
  --accent:#a62443;
  --accent-ink:#ffffff;
  --border:#ecd9de;
  --border-strong:#e2c2ca;
  --cta-fill:#4a1220;
  --cta-rail:rgba(255,255,255,.18);
  --cta-sheen:rgba(255,255,255,.14);
  --cta-edge:#7a2438;
  --cta-elevation:0 14px 30px rgba(74,18,32,.28);
  --font-body:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Source Han Sans SC",sans-serif;
  --font-serif:"Songti SC","STSong","SimSun","Noto Serif SC",serif;
  --fs-body:16px;
  --fs-h1:26px;
  --fs-h2:20px;
  --fs-h3:17px;
  --fs-small:14px;
  --space-1:4px;
  --space-2:8px;
  --space-3:12px;
  --space-4:16px;
  --space-5:24px;
  --space-6:32px;
  --space-7:48px;
  --space-8:64px;
  --radius-sm:3px;
  --radius-md:5px;
  --radius-lg:8px;
  --container:1120px;
  --ease:cubic-bezier(.2,.6,.3,1);
  --dur:160ms;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:var(--font-body);
  font-size:var(--fs-body);
  line-height:1.75;
  overflow-wrap:anywhere;
  padding-bottom:96px;
}
h1,h2,h3{font-family:var(--font-serif);font-weight:700;color:var(--text);line-height:1.4}
h1{font-size:var(--fs-h1)}
h2{font-size:var(--fs-h2)}
h3{font-size:var(--fs-h3);font-family:var(--font-body)}
p{margin:0 0 var(--space-4)}
a{color:var(--accent);text-decoration:none;transition:color var(--dur) var(--ease)}
a:hover{color:var(--text);text-decoration:underline}
ul{margin:0;padding:0;list-style:none}
.wrap{max-width:var(--container);margin:0 auto;padding:0 var(--space-5)}

/* 顶部工具条 */
.topbar{background:var(--surface-2);border-bottom:1px solid var(--border)}
.topbar-inner{display:flex;align-items:baseline;gap:var(--space-3);flex-wrap:wrap;padding-top:var(--space-1);padding-bottom:var(--space-1);font-size:var(--fs-small);color:var(--text-muted)}
.topbar-brand{font-weight:700;color:var(--accent)}
.topbar-link{margin-left:auto}

/* 头部字标 */
.masthead{background:var(--surface);border-bottom:1px solid var(--border)}
.masthead-inner{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);flex-wrap:wrap;padding-top:var(--space-5);padding-bottom:var(--space-4)}
.wordmark{display:flex;align-items:center;gap:var(--space-3);color:var(--text)}
.wordmark:hover{color:var(--text);text-decoration:none}
.wordmark-seal{display:grid;place-items:center;width:44px;height:44px;background:var(--accent);color:var(--accent-ink);font-family:var(--font-serif);font-size:24px;line-height:1;border-radius:var(--radius-sm)}
.wordmark-text{display:flex;flex-direction:column}
.wordmark-text strong{font-family:var(--font-serif);font-size:var(--fs-h1);letter-spacing:.02em;line-height:1.25}
.wordmark-text em{font-style:normal;font-size:var(--fs-small);color:var(--text-muted);letter-spacing:.02em}
.masthead-note{margin:0;font-size:var(--fs-small);color:var(--text-muted)}

/* 主导航 */
.mainnav{background:var(--accent);border-bottom:1px solid var(--accent)}
.mainnav ul{display:flex;flex-wrap:wrap}
.mainnav a{display:block;padding:10px var(--space-3);color:var(--accent-ink);font-size:15px;font-weight:700;line-height:24px;min-height:44px}
.mainnav a:hover,.mainnav a:focus-visible{background:var(--text);color:var(--accent-ink);text-decoration:none}
.mainnav a.is-active{background:var(--text)}

/* 面包屑 */
.crumb{font-size:var(--fs-small);color:var(--text-muted);padding:var(--space-4) 0 0}
.crumb a{color:var(--text-muted)}
.crumb a:hover{color:var(--accent)}
.crumb span{color:var(--text-muted)}

/* 两栏 */
.board-shell{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:var(--space-5);align-items:start;padding:var(--space-4) 0 var(--space-7)}
.board-col{min-width:0}

/* 导语区 */
.lede{background:var(--surface);border:1px solid var(--border-strong);padding:var(--space-5);margin-bottom:var(--space-5)}
.lede h1{margin:0 0 var(--space-3)}
.lede p{font-size:var(--fs-body);line-height:1.8;margin:0 0 var(--space-3)}
.lede p:last-child{margin-bottom:0}
.lede-rule{margin-top:var(--space-4);padding-top:var(--space-3);border-top:1px solid var(--border);color:var(--accent);font-weight:700}

/* 版块 */
.board{background:var(--surface);border:1px solid var(--border-strong);margin-bottom:var(--space-5)}
.board-head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-2);flex-wrap:wrap;background:var(--surface-2);border-bottom:1px solid var(--border-strong);padding:var(--space-2) var(--space-4)}
.board-head h2{margin:0;color:var(--accent)}
.board-sub{font-size:var(--fs-small);color:var(--text-muted)}
.board-body{padding:0 var(--space-4)}
.board-foot{border-top:1px solid var(--border);padding:var(--space-3) var(--space-4);font-size:var(--fs-body);background:var(--surface-2)}

/* 行列表 */
.row{padding:var(--space-4) 0;border-bottom:1px dashed var(--border)}
.row:last-child{border-bottom:0}
.row h3{margin:0 0 var(--space-1);line-height:1.5}
.row h3 a{color:var(--text)}
.row h3 a:hover{color:var(--accent)}
.row p{margin:0;font-size:var(--fs-body);color:var(--text-muted);line-height:1.65}

/* 标签 */
.chip{display:inline-block;padding:1px var(--space-2);border:1px solid var(--border-strong);border-radius:var(--radius-sm);font-size:13px;line-height:22px;color:var(--accent);background:var(--surface)}
.chip:hover{border-color:var(--accent);text-decoration:none}
.tag-strip{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2);padding:var(--space-4);background:var(--surface);border:1px solid var(--border-strong);font-size:var(--fs-small);color:var(--text-muted)}

/* 右栏 */
.rail-box{background:var(--surface);border:1px solid var(--border-strong);margin-bottom:var(--space-4)}
.rail-box h2{margin:0;background:var(--surface-2);border-bottom:1px solid var(--border-strong);padding:var(--space-2) var(--space-3);color:var(--accent);font-size:var(--fs-h3)}
.rail-box ul{padding:var(--space-2) var(--space-3)}
.rail-box li{padding:var(--space-2) 0;border-bottom:1px dashed var(--border);font-size:var(--fs-body)}
.rail-box li:last-child{border-bottom:0;padding-bottom:0}
.rail-box li a{color:var(--text)}
.rail-box li a:hover{color:var(--accent)}
.rail-cols li a{font-weight:700}
.rail-sub{display:block;font-size:13px;color:var(--text-muted);line-height:1.5;margin-top:var(--space-1)}
.rail-tags{display:flex;flex-wrap:wrap;gap:var(--space-1) var(--space-3)}
.rail-tags li{padding:0;border-bottom:0;font-size:var(--fs-small)}
.rail-rule p{padding:0 var(--space-3) 0;margin:var(--space-3) 0;font-size:var(--fs-small);line-height:1.7;color:var(--text)}
.rail-rule p:last-child{padding-bottom:var(--space-3)}

/* 文章 */
.post{background:var(--surface);border:1px solid var(--border-strong);padding:var(--space-6) var(--space-6) var(--space-5);margin-bottom:var(--space-5)}
.post h1{margin:0 0 var(--space-5);font-size:var(--fs-h1)}
.post-body p{font-size:17px;line-height:1.85;margin:0 0 var(--space-4)}
.post-tags{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2);padding-top:var(--space-4);border-top:1px solid var(--border);font-size:var(--fs-small);color:var(--text-muted)}
.back-col{margin-top:var(--space-4);font-size:var(--fs-body);color:var(--text-muted)}
.back-col a{font-weight:700}

/* 页脚 */
.site-foot{background:var(--surface-2);border-top:1px solid var(--border-strong);padding:var(--space-5) 0 var(--space-6);margin-top:var(--space-5)}
.foot-inner{display:flex;flex-direction:column;gap:var(--space-3)}
.foot-brand{margin:0;font-size:var(--fs-body);color:var(--text)}
.foot-brand a{font-weight:700}
.foot-links{display:flex;flex-wrap:wrap;gap:var(--space-2) var(--space-4);font-size:var(--fs-small)}
.foot-links a{color:var(--text-muted)}
.foot-links a:hover{color:var(--accent)}

:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

@media (max-width:1023px){
  .board-shell{grid-template-columns:minmax(0,1fr)}
  .rail{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-4)}
  .rail-box{margin-bottom:0}
}
@media (max-width:640px){
  .wrap{padding:0 var(--space-4)}
  h1{font-size:22px}
  .wordmark-text strong{font-size:22px}
  .masthead-note{width:100%}
  .mainnav a{padding:10px var(--space-2);font-size:14px}
  .lede{padding:var(--space-4)}
  .post{padding:var(--space-4)}
  .post-body p{font-size:16px}
  .rail{grid-template-columns:minmax(0,1fr)}
}
@media (prefers-reduced-motion:reduce){
  a{transition:none}
}
