/* Blog: long reading on paper, under a band of ink. Body type is the system's, so any character renders in one face. */
:root{--paper:#F5EEDC;--ink:#2E2A23;--muted:#6B6152;--rule:rgba(64,58,48,.16);--mark:#A6402E;--wash:rgba(64,58,48,.06);
  --body:'Iowan Old Style','Palatino Linotype',Georgia,'Songti SC','Noto Serif CJK SC','Noto Serif SC',serif;
  --display:'SSmd Serif','Songti SC','Noto Serif CJK SC',Georgia,serif;
  --mono:ui-monospace,'SF Mono',Menlo,Consolas,monospace;}
@media (prefers-color-scheme:dark){
  :root{--paper:#171716;--ink:#E8E6E0;--muted:#A9A7A0;--rule:rgba(242,241,237,.16);--mark:#E39A74;--wash:rgba(242,241,237,.07);}
}
*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);-webkit-font-smoothing:antialiased;}
a{color:var(--mark);text-underline-offset:4px;}
:focus-visible{outline:2px solid var(--mark);outline-offset:3px;}
.skip{position:absolute;top:8px;left:24px;z-index:10;transform:translateY(-160%);padding:12px;background:var(--paper);color:var(--ink);}
.skip:focus{transform:none;}

.blog-nav{display:flex;align-items:center;gap:4px;font-family:-apple-system,BlinkMacSystemFont,'PingFang SC','Hiragino Sans GB',sans-serif;}
.bar.ink-bar .blog-nav a{min-height:40px;padding:0 12px;display:inline-flex;align-items:center;border-radius:10px;font-size:14px;text-decoration:none;}
.bar.ink-bar .blog-nav a:hover{background:rgba(255,255,255,.14);}
.bar.ink-bar .blog-nav .dl{margin-left:6px;padding:0 16px;border-radius:999px;background:#fff;color:#141413;font-weight:600;}
.bar.ink-bar .blog-nav .dl:hover{background:#FFF1E8;}

main{max-width:720px;margin:0 auto;padding:0 24px 72px;}
.masthead>.inner{width:min(672px,calc(100vw - 48px));}
.masthead h1{font-size:clamp(32px,4.6vw,52px);line-height:1.18;}
.crumbs{display:flex;gap:8px;margin:0 0 20px;font-size:14px;}
.crumbs a{text-decoration:none;opacity:.88;}
.crumbs a:hover{opacity:1;text-decoration:underline;}
.masthead .standfirst{max-width:36em;font-size:19px;line-height:1.6;}
.masthead .dateline{font-size:14px;}

.post{font-size:18px;line-height:1.75;}
html[lang="zh-CN"] .post{font-size:17px;line-height:1.9;}
.post>*:first-child{margin-top:0;}
.post p,.post ul,.post ol,.post blockquote{margin:0 0 1.1em;}
.post ul,.post ol{padding-left:1.4em;}
.post li{margin:.3em 0;}
.post h2{margin:2.2em 0 .7em;font-family:var(--display);font-weight:900;font-size:27px;line-height:1.3;}
.post h3{margin:1.9em 0 .5em;font-family:var(--display);font-weight:700;font-size:21px;line-height:1.35;}
.post h2+h3{margin-top:1em;}
.post strong{font-weight:700;}
.post code{font-family:var(--mono);font-size:.84em;padding:.12em .36em;border-radius:5px;background:var(--wash);}
.post pre{margin:1.3em 0;padding:16px 18px;overflow-x:auto;border-radius:12px;background:var(--wash);font-size:15px;line-height:1.6;}
.post pre code{padding:0;background:none;font-size:inherit;}
.post kbd{font-family:var(--body);font-size:.92em;white-space:nowrap;}
.post blockquote{padding-left:18px;border-left:3px solid var(--rule);color:var(--muted);}
.post hr{margin:2.4em 0;border:0;border-top:1px solid var(--rule);}
.post .table{margin:1.4em 0;overflow-x:auto;}
.post table{width:100%;border-collapse:collapse;font-size:15px;line-height:1.55;}
.post th,.post td{padding:10px 12px;border-bottom:1px solid var(--rule);text-align:left;vertical-align:top;}
.post th{font-weight:700;border-bottom-color:var(--muted);}
.post td:first-child{font-weight:600;}
.post figure{margin:1.8em 0;}
.post figure img{display:block;max-width:100%;height:auto;border-radius:12px;box-shadow:0 0 0 1px var(--rule);}
.post figcaption{margin-top:10px;color:var(--muted);font-size:14px;line-height:1.6;}

.post-cta{display:flex;gap:18px;align-items:flex-start;margin:56px 0 0;padding:22px;border:1px solid var(--rule);border-radius:16px;}
.post-cta img{flex:none;border-radius:14px;}
.post-cta p{margin:0;font-size:16px;line-height:1.7;}
.post-cta p+p{margin-top:8px;}
.more-posts{margin-top:56px;}
.more-posts h2,.post-list h2{font-family:var(--display);font-weight:900;}
.more-posts h2{margin:0 0 12px;font-size:22px;}
.more-posts ul,.post-list{margin:0;padding:0;list-style:none;}
.more-posts li{padding:16px 0;border-top:1px solid var(--rule);}
.more-posts li a{font-size:18px;font-weight:700;text-decoration:none;}
.more-posts li a:hover{text-decoration:underline;}
.more-posts li p{margin:6px 0 0;color:var(--muted);font-size:15px;line-height:1.65;}

.post-list li{padding:28px 0;border-top:1px solid var(--rule);}
.post-list li:first-child{border-top:0;padding-top:0;}
.post-list a{color:inherit;text-decoration:none;}
.post-list a:hover h2{color:var(--mark);}
.post-list h2{margin:0;font-size:25px;line-height:1.35;}
.post-list p{margin:10px 0 0;font-size:17px;line-height:1.7;}
.post-list .dateline{color:var(--muted);font-size:14px;}

.blog-footer{display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px;max-width:720px;margin:0 auto;padding:22px 24px 40px;
  border-top:1px solid var(--rule);color:var(--muted);font-size:14px;}
.blog-footer .links{display:flex;flex-wrap:wrap;gap:18px;}
.blog-footer a{color:inherit;}

@media (max-width:560px){
  .post{font-size:17px;}
  .post h2{font-size:24px;}
  .masthead .standfirst{font-size:17px;}
  .bar.ink-bar .blog-nav .dl{display:none;}
  .post-cta{flex-direction:column;}
}
.post figure.diagram img{margin:0 auto;box-shadow:none;}