:root{
  --bg:#fbfaf7; --paper:#ffffff; --ink:#1f2328; --ink2:#4b5259; --ink3:#868d94;
  --line:#e7e4dd; --accent:#2f6f5e; --code-bg:#f3f1ec;
  --mono:"JetBrains Mono",Consolas,"Courier New",monospace;
  --sans:-apple-system,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
}
@media (prefers-color-scheme:dark){
  :root{
    --bg:#16181b; --paper:#1d2024; --ink:#e6e3dc; --ink2:#b4b0a8; --ink3:#7e7a73;
    --line:#2d3136; --accent:#7cc4ad; --code-bg:#24282d;
  }
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0; background:var(--bg); color:var(--ink); font:16px/1.8 var(--sans)}
a{color:var(--accent)}
.wrap{max-width:720px; margin:0 auto; padding:0 16px}

header.site{padding:48px 0 28px; border-bottom:1px solid var(--line)}
header.site .name{font-size:24px; font-weight:700; letter-spacing:.02em; color:var(--ink); text-decoration:none}
header.site p{margin:6px 0 0; color:var(--ink2); font-size:15px}
nav.top{margin-top:14px; display:flex; gap:18px; font-size:14px}
nav.top a{color:var(--ink2); text-decoration:none}
nav.top a:hover{color:var(--accent)}

main{padding:28px 0 48px}
.post-list{list-style:none; margin:0; padding:0}
.post-list li{padding:18px 0; border-bottom:1px dashed var(--line)}
.post-list time{display:block; font:13px var(--mono); color:var(--ink3)}
.post-list a.t{font-size:18px; font-weight:600; color:var(--ink); text-decoration:none}
.post-list a.t:hover{color:var(--accent)}
.post-list p{margin:4px 0 0; color:var(--ink2); font-size:15px}
.tag{display:inline-block; font-size:12px; color:var(--ink3); border:1px solid var(--line); border-radius:3px; padding:0 6px; margin-right:6px}

article h1{font-size:26px; line-height:1.4; margin:0 0 6px}
article .meta{font:13px var(--mono); color:var(--ink3); margin-bottom:28px}
article h2{font-size:19px; margin:32px 0 8px}
article p, article li{color:var(--ink)}
article code{font:14px var(--mono); background:var(--code-bg); padding:1px 5px; border-radius:3px}
article pre{background:var(--code-bg); padding:14px 16px; border-radius:6px; overflow-x:auto; font:13.5px/1.6 var(--mono)}
article pre code{background:none; padding:0}
article blockquote{margin:16px 0; padding:4px 16px; border-left:3px solid var(--accent); color:var(--ink2)}
article table{border-collapse:collapse; width:100%; font-size:14px; display:block; overflow-x:auto}
article th, article td{border:1px solid var(--line); padding:6px 10px; text-align:left}
.back{display:inline-block; margin-top:36px; font-size:14px}

.about{color:var(--ink2)}

footer{border-top:1px solid var(--line); padding:20px 0 32px; font-size:13px; color:var(--ink3)}
footer .row{display:flex; flex-wrap:wrap; gap:6px 18px; align-items:center}
footer a{color:var(--ink3); text-decoration:none}
footer a:hover{color:var(--accent)}
footer a.beian{display:inline-flex; align-items:center; gap:5px}
footer a.beian img{display:block}

/* ---- 深度文章扩展 ---- */
article .lead{font-size:17px; color:var(--ink2); border-left:3px solid var(--accent); padding-left:14px; margin:0 0 24px}
article h3{font-size:16px; margin:24px 0 6px}
.toc{background:var(--code-bg); border-radius:6px; padding:12px 18px; margin:0 0 28px; font-size:14px}
.toc b{display:block; margin-bottom:4px; color:var(--ink2)}
.toc ol{margin:0; padding-left:20px}
.toc a{text-decoration:none}
.callout{background:var(--code-bg); border-radius:6px; padding:12px 16px; margin:18px 0; font-size:15px}
.callout b:first-child{color:var(--accent)}
article table{margin:14px 0}
article th{background:var(--code-bg)}
.sources{font-size:13px; color:var(--ink3); border-top:1px dashed var(--line); margin-top:32px; padding-top:12px}
.sources a{color:var(--ink3)}
.series{margin-top:28px; font-size:14px; color:var(--ink2)}