/* 站点共享样式
   风格：古典配色 + 顶部导航的文档结构
   纯 CSS，无外部依赖。字体使用系统字体栈，不加载 web font
   （中文字库动辄数 MB，会显著拖慢页面）。 */

:root{
  --paper:#F8F4EA;
  --paper-hi:#FBF7EE;
  --line:#DDD3BF;
  --ink:#2A241C;
  --body:#4A4237;
  --muted:#A69C8B;
  --cinnabar:#9C3D2E;
  --nav-bg:#F2EDE1;
  --nav-cur:#FBF6E9;
  --serif:"Songti SC","STSong","SimSun","Noto Serif CJK SC","Source Han Serif SC",serif;
}

*{box-sizing:border-box;}

body{
  margin:0;
  background:var(--paper);
  color:var(--body);
  font-family:var(--serif);
  font-size:17px;
  line-height:2.1;
  -webkit-text-size-adjust:100%;
}

a{color:var(--cinnabar);text-decoration:none;}
a:hover{text-decoration:underline;}

.wrap{max-width:860px;margin:0 auto;padding:0 24px;}

h1,h2,h3{font-weight:400;color:var(--ink);}

/* ---------- 顶部导航 ---------- */

.topbar{background:var(--nav-bg);border-bottom:1px solid var(--line);}

.topbar .wrap{
  display:flex;align-items:center;flex-wrap:wrap;
  gap:4px 24px;min-height:62px;
}

.brand{font-size:19px;color:var(--ink);letter-spacing:.08em;padding:14px 0;}
.brand:hover{text-decoration:none;color:var(--ink);}

.nav{margin-left:auto;display:flex;flex-wrap:wrap;gap:2px;}

.nav a{
  display:block;padding:7px 15px;
  color:var(--body);
  border-bottom:2px solid transparent;
}
.nav a:hover{color:var(--cinnabar);text-decoration:none;}
.nav a.cur{
  color:var(--cinnabar);
  background:var(--nav-cur);
  border-bottom-color:var(--cinnabar);
}

/* ---------- 首页 ---------- */

.lede{padding:40px 0 6px;}
.lede p{margin:0 0 6px;font-size:15px;line-height:1.95;color:var(--muted);}

.sec{margin-top:46px;}
.sec-hd{
  display:flex;align-items:baseline;
  border-bottom:1px solid var(--line);padding-bottom:12px;
}
.sec-hd h2{
  margin:0;font-size:18px;letter-spacing:.04em;
  border-left:3px solid var(--cinnabar);padding-left:13px;
}
.sec-hd .more{margin-left:auto;font-size:13px;}

/* ---------- 更新列表 ---------- */

.updates{list-style:none;margin:0;padding:0;}
.updates>li{border-bottom:1px solid var(--line);}
.updates a{display:block;padding:18px 0;color:inherit;}
.updates a:hover{text-decoration:none;}
.updates .t{color:var(--ink);font-size:17px;}
.updates a:hover .t{color:var(--cinnabar);}
.updates .d{color:var(--muted);font-size:13px;margin-left:12px;white-space:nowrap;}
.updates .s{display:block;color:var(--muted);font-size:14px;line-height:1.85;margin-top:4px;}
.updates .todo{display:block;padding:18px 0;color:var(--muted);font-size:15px;}

/* ---------- 分类卡片 ---------- */

.cats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:24px;}

.cat{
  display:block;padding:20px 18px;
  border:1px solid var(--line);border-radius:6px;
  background:var(--paper-hi);color:inherit;
}
.cat:hover{border-color:var(--cinnabar);text-decoration:none;}
.cat .cn{display:block;font-size:18px;color:var(--ink);}
.cat .cd{display:block;margin-top:8px;font-size:13px;line-height:1.8;color:var(--muted);}
.cat .cc{display:block;margin-top:12px;font-size:12px;color:var(--cinnabar);}

/* ---------- 栏目页 ---------- */

.crumb{padding-top:26px;font-size:13px;color:var(--muted);}
.crumb a{color:var(--muted);}
.crumb a:hover{color:var(--cinnabar);}

.lhead{margin-top:18px;padding-bottom:20px;border-bottom:1px solid var(--line);}
.lhead h1{
  margin:0;font-size:26px;line-height:1.5;
  border-left:3px solid var(--cinnabar);padding-left:15px;
}
.lhead .desc{margin:12px 0 0 18px;font-size:14px;line-height:1.9;color:var(--muted);}

.list{list-style:none;margin:0;padding:0;}
.list>li{border-bottom:1px solid var(--line);}
.list a{display:block;padding:18px 0;color:inherit;}
.list a:hover{text-decoration:none;}
.list .t{display:block;font-size:17px;color:var(--ink);}
.list a:hover .t{color:var(--cinnabar);}
.list .s{display:block;margin-top:4px;font-size:14px;line-height:1.85;color:var(--muted);}
.list .todo{display:block;padding:18px 0;font-size:15px;color:var(--muted);}

/* ---------- 条目页 ---------- */

.article{padding-top:26px;}
.article h1{
  margin:0;font-size:27px;line-height:1.55;
  border-left:3px solid var(--cinnabar);padding-left:15px;
}
.article .meta{margin:14px 0 34px 18px;font-size:13px;color:var(--muted);}
.article p{margin:0 0 1.3em;}
.article h2{
  margin:2em 0 .7em;font-size:19px;
  border-left:3px solid var(--line);padding-left:13px;
}
.article blockquote{
  margin:1.6em 0;padding:4px 0 4px 20px;
  border-left:3px solid var(--line);
  color:var(--muted);font-size:16px;
}

/* ---------- 上一则 / 下一则 ---------- */

.pager{
  display:flex;gap:12px;
  margin-top:60px;padding-top:26px;
  border-top:1px solid var(--line);
}
.pager a,.pager span.ph{
  flex:1;padding:14px 18px;
  border:1px solid var(--line);border-radius:6px;
  background:var(--paper-hi);
}
.pager a{color:inherit;}
.pager a:hover{border-color:var(--cinnabar);text-decoration:none;}
.pager span.ph{border-color:transparent;background:transparent;}
.pager .dir{display:block;font-size:12px;color:var(--muted);}
.pager .pt{display:block;margin-top:4px;font-size:15px;color:var(--ink);}

/* ---------- 页脚 ---------- */

.foot{
  margin-top:70px;
  border-top:1px solid var(--line);
  padding:22px 24px 46px;
  font-size:13px;line-height:1.9;color:var(--muted);
}
.foot p{margin:0 0 6px;}

/* ---------- 窄屏 ---------- */

@media (max-width:820px){
  .cats{grid-template-columns:repeat(2,1fr);}
}

@media (max-width:640px){
  body{font-size:16px;line-height:2;}
  .topbar .wrap{gap:0 16px;}
  .nav{margin-left:0;width:100%;}
  .nav a{padding:7px 10px;}
  .cats{grid-template-columns:1fr;}
  .pager{flex-direction:column;}
  .pager span.ph{display:none;}
  .lhead h1,.article h1{font-size:22px;}
}
