:root{
  --ink:#1b2430; --mute:#6d7a88; --line:#e5e9ee; --bg:#fcfcfd;
  --accent:#215d8f; --code-bg:#f4f6f8;
}
@media (prefers-color-scheme: dark){
  :root{
    --ink:#dfe4ea; --mute:#8b97a4; --line:#2a323b; --bg:#15191d;
    --accent:#7fb2dc; --code-bg:#1e242a;
  }
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  font-size:16px; line-height:1.85; letter-spacing:.01em;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
.wrap{max-width:680px; margin:0 auto; padding:72px 22px 60px}
header.site{display:flex; align-items:baseline; justify-content:space-between; gap:16px; margin-bottom:56px}
header.site h1{font-size:19px; font-weight:600; letter-spacing:.04em; margin:0}
header.site h1 a{color:var(--ink); border:0}
header.site nav{font-size:14px; color:var(--mute)}
header.site nav a{color:var(--mute); border:0; margin-left:18px}
header.site nav a:hover{color:var(--ink)}

h1.page{font-size:30px; font-weight:600; letter-spacing:.02em; margin:0 0 10px; line-height:1.35}
p.lede{color:var(--mute); margin:0 0 52px; font-size:15.5px}

a{color:var(--accent); text-decoration:none; border-bottom:1px solid rgba(33,93,143,.25)}
a:hover{border-bottom-color:currentColor}
@media (prefers-color-scheme: dark){a{border-bottom-color:rgba(127,178,220,.3)}}

ol.posts,ul.posts{list-style:none; margin:0; padding:0}
ol.posts li{padding:20px 0; border-top:1px solid var(--line)}
ol.posts li:first-child{border-top:0; padding-top:0}
ol.posts .date{color:var(--mute); font-size:13px; letter-spacing:.06em; font-variant-numeric:tabular-nums}
ol.posts .title{display:block; font-size:17.5px; font-weight:500; margin:3px 0 4px; color:var(--ink); border:0}
ol.posts .title:hover{color:var(--accent)}
ol.posts .sum{color:var(--mute); font-size:14.5px; line-height:1.7}

article h1{font-size:27px; font-weight:600; line-height:1.4; margin:0 0 8px; letter-spacing:.01em}
article .meta{color:var(--mute); font-size:13.5px; margin-bottom:40px; letter-spacing:.04em}
article h2{font-size:19px; font-weight:600; margin:44px 0 14px; letter-spacing:.02em}
article h3{font-size:16.5px; font-weight:600; margin:32px 0 10px}
article p{margin:0 0 18px}
article ul,article ol{margin:0 0 18px; padding-left:22px}
article li{margin:0 0 8px}
article code{
  background:var(--code-bg); padding:2px 5px; border-radius:3px;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:13.5px;
}
article pre{
  background:var(--code-bg); padding:16px 18px; border-radius:6px; overflow-x:auto;
  font-size:13px; line-height:1.7; margin:0 0 20px;
}
article pre code{background:none; padding:0; font-size:13px}
article blockquote{
  margin:0 0 20px; padding:2px 0 2px 16px; border-left:2px solid var(--line); color:var(--mute);
}
article table{width:100%; border-collapse:collapse; margin:0 0 22px; font-size:14.5px}
article th,article td{text-align:left; padding:8px 10px; border-bottom:1px solid var(--line); vertical-align:top}
article th{color:var(--mute); font-weight:500; font-size:13.5px}

hr{border:0; border-top:1px solid var(--line); margin:44px 0}

footer.site{
  margin-top:64px; padding-top:20px; border-top:1px solid var(--line);
  color:var(--mute); font-size:12.5px; line-height:2;
}
footer.site a{color:var(--mute); border:0}
footer.site a:hover{color:var(--ink)}
.back{display:inline-block; margin-bottom:36px; font-size:14px; color:var(--mute); border:0}
.back:hover{color:var(--ink)}