
:root{
  --ink:#1f2933; --sub:#5c6b7a; --line:#e7e2da; --bg:#fbfaf8;
  --card:#ffffff; --brand:#16324f; --accent:#b0402f; --accent-soft:#f6ece9;
  --max:860px;
}
*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:"PingFang SC","Microsoft YaHei",system-ui,-apple-system,"Hiragino Sans GB",sans-serif;
  font-size:16px; line-height:1.85; letter-spacing:.01em;
}
a{color:var(--brand); text-decoration:none;}
a:hover{color:var(--accent);}
.wrap{max-width:var(--max); margin:0 auto; padding:0 20px;}

header.site{background:var(--card); border-bottom:1px solid var(--line); position:sticky; top:0; z-index:10;}
header.site .wrap{display:flex; align-items:center; justify-content:space-between; gap:16px; padding-top:14px; padding-bottom:14px; flex-wrap:wrap;}
.brand{font-size:19px; font-weight:700; color:var(--brand); letter-spacing:.06em;}
.brand small{display:block; font-size:11.5px; font-weight:400; color:var(--sub); letter-spacing:.02em; margin-top:2px;}
nav.top{display:flex; gap:2px 4px; flex-wrap:wrap; justify-content:flex-end;}
nav.top a{padding:5px 9px; border-radius:999px; font-size:13.5px; color:#41505f;}
nav.top a:hover{background:var(--accent-soft); color:var(--accent);}
nav.top a.on{background:var(--brand); color:#fff;}

.hero{padding:54px 0 30px;}
.hero h1{font-size:29px; line-height:1.5; margin:0 0 14px; color:var(--brand); font-weight:700; letter-spacing:.01em;}
.hero p{color:#43505e; font-size:16.5px; margin:0 0 10px;}
.hero .meta{color:var(--sub); font-size:13.5px; margin-top:16px;}

.section-title{margin:38px 0 14px; font-size:15px; color:var(--sub); letter-spacing:.14em; font-weight:600;}
.cards{display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:14px;}
.card{background:var(--card); border:1px solid var(--line); border-radius:12px; padding:20px 20px 18px; transition:.15s; display:block;}
.card:hover{border-color:#d3ccc1; box-shadow:0 6px 18px rgba(30,40,60,.06); transform:translateY(-1px);}
.card h3{margin:0 0 8px; font-size:17.5px; color:var(--brand);}
.card p{margin:0; color:#54606d; font-size:14.3px; line-height:1.75;}
.card .n{margin-top:12px; font-size:13px; color:var(--accent);}

.list{margin:8px 0 0; padding:0; list-style:none;}
.list li{background:var(--card); border:1px solid var(--line); border-radius:12px; margin-bottom:12px; padding:18px 20px; transition:.15s;}
.list li:hover{border-color:#d3ccc1; box-shadow:0 6px 18px rgba(30,40,60,.06);}
.list .t{font-size:17px; font-weight:600; color:var(--brand); display:block; margin-bottom:6px; line-height:1.55;}
.list .d{color:#54606d; font-size:14.3px; margin:0 0 8px;}
.list .m{color:#8b94a0; font-size:12.8px; letter-spacing:.02em;}
.list .m a{color:#8b94a0;}
.list .m a:hover{color:var(--accent);}

/* 子分类卡片 */
.childcats{display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:12px;}
.childcat{display:block; background:var(--card); border:1px solid var(--line); border-radius:12px; padding:16px 18px; transition:.15s;}
.childcat:hover{border-color:#d3ccc1; box-shadow:0 6px 18px rgba(30,40,60,.06);}
.childcat h4{margin:0 0 6px; font-size:15.5px; color:var(--brand);}
.childcat p{margin:0; font-size:13.4px; color:#54606d; line-height:1.7;}
.childcat .n{margin-top:8px; font-size:12.5px; color:var(--accent);}

/* 分类树（文章总目录） */
ul.tree{list-style:none; margin:6px 0; padding:0;}
ul.tree ul{list-style:none; margin:4px 0 4px 6px; padding-left:18px; border-left:1px dashed var(--line);}
ul.tree li{padding:4px 0;}
ul.tree a.cn{font-weight:600; color:var(--brand); font-size:15.5px;}
ul.tree .num{color:#8b94a0; font-size:12.5px; margin-left:8px;}
ul.tree ul.pts{list-style:none; margin:2px 0 2px 6px; padding-left:18px; border-left:2px solid var(--accent-soft);}
ul.tree ul.pts li{padding:3px 0; font-size:14.6px;}

/* 标签 */
.taglist{display:flex; flex-wrap:wrap; gap:8px; margin:6px 0 0;}
.tag{display:inline-block; padding:4px 13px; border-radius:999px; background:var(--accent-soft); color:var(--accent); font-size:13px;}
.tag:hover{background:#efe0dc;}
.tag .c{color:#b08a80; font-size:12px; margin-left:5px;}

/* 文章页 */
article.post{background:var(--card); border:1px solid var(--line); border-radius:14px; padding:40px 44px 34px; margin:30px 0;}
article.post h1{font-size:25px; line-height:1.5; color:var(--brand); margin:0 0 12px; font-weight:700;}
article.post .m{color:#8b94a0; font-size:13px; padding-bottom:20px; border-bottom:1px solid var(--line); margin-bottom:26px;}
article.post h2{font-size:18.5px; color:var(--brand); margin:34px 0 12px; padding-left:12px; border-left:4px solid var(--accent); line-height:1.6;}
article.post p{margin:0 0 18px; font-size:16.8px; line-height:1.95; color:#252b32;}
article.post strong{color:#141a20; font-weight:600;}
article.post ul{margin:0 0 18px; padding-left:22px;}
article.post li{margin-bottom:8px; font-size:16.3px; line-height:1.85;}
article.post figure{margin:22px 0; text-align:center;}
article.post img{max-width:100%; border-radius:8px;}
article.post code{background:#f2efe9; padding:1px 6px; border-radius:4px; font-size:.92em;}
article.post .tags{margin-top:28px; padding-top:16px; border-top:1px dashed var(--line); display:flex; flex-wrap:wrap; gap:8px; align-items:center;}
article.post .tags .lab{color:#8b94a0; font-size:13.5px;}

.entity{background:#f4f7fa; border:1px solid #dde6ee; border-radius:12px; padding:22px 24px; margin:30px 0;}
.entity h4{margin:0 0 10px; font-size:15px; color:var(--brand); letter-spacing:.06em;}
.entity p{margin:0 0 7px; font-size:14.2px; color:#46535f; line-height:1.8;}
.entity b{color:#26313c;}

footer.site{border-top:1px solid var(--line); margin-top:50px; padding:26px 0 40px; color:#8b94a0; font-size:13px;}
footer.site .wrap{display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap;}

.crumb{font-size:13.5px; color:#8b94a0; margin:20px 0 0; line-height:1.9;}
.crumb a{color:#8b94a0;}
.crumb a:hover{color:var(--accent);}

@media(max-width:640px){
  .hero h1{font-size:23px;}
  article.post{padding:26px 20px 22px; border-radius:10px;}
  article.post h1{font-size:20.5px;}
  article.post p{font-size:16.3px;}
  body{font-size:15.5px;}
}
