:root {
  --paper:#fff; --ink:#111; --ink-2:#444; --muted:#595959; --line:#dedede; --soft:#f3f3f3;
  --fig-filter:none; --accent:#B8321C; --accent-soft:#FBE2DB; --gutter:24px; color-scheme:light;
  --blog-font:Inter,system-ui,-apple-system,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]){--paper:#161616;--ink:#d9d9d9;--ink-2:#c6c6c6;--muted:#a3a3a3;--line:#3b3b3b;--soft:#222222;--fig-filter:invert(1) hue-rotate(180deg);--accent:#FF7A5C;--accent-soft:#3E1C15;color-scheme:dark;}}
:root[data-theme="dark"]{--paper:#161616;--ink:#d9d9d9;--ink-2:#c6c6c6;--muted:#a3a3a3;--line:#3b3b3b;--soft:#222222;--fig-filter:invert(1) hue-rotate(180deg);--accent:#FF7A5C;--accent-soft:#3E1C15;color-scheme:dark;}
html:lang(en){--accent:#0F6E6B;--accent-soft:#DDF0EE;}
@media(prefers-color-scheme:dark){html:lang(en):not([data-theme="light"]){--accent:#4FD1C5;--accent-soft:#10302D;}}
html:lang(en)[data-theme="dark"]{--accent:#4FD1C5;--accent-soft:#10302D;}
*,*::before,*::after{box-sizing:border-box;}
html{text-size-adjust:100%;-webkit-text-size-adjust:100%;}
body{margin:0;background:var(--paper);color:var(--ink);font:calc(18px * var(--text-factor,var(--text-zoom-scale,1)))/1.8 var(--blog-font);overflow-wrap:anywhere;text-wrap:pretty;}
a{color:var(--accent);text-decoration-thickness:1px;text-underline-offset:.2em;}
a:hover{text-decoration-thickness:2px;}
:focus-visible{outline:2px solid var(--accent);outline-offset:5px;}
h1,h2,h3,h4{text-wrap:balance;line-height:1.4;}
p,li{text-wrap:pretty;orphans:2;widows:2;}
.blog-header,.blog-footer{width:min(calc(100% - 2 * var(--gutter)),1000px);margin-inline:auto;font:calc(15px * var(--text-factor,var(--text-zoom-scale,1)))/1.5 var(--blog-font);}
.blog-header{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px 24px;min-height:105px;padding-block:24px;border-bottom:1px solid var(--line);}
.blog-header .blog-name{font-size:calc(19px * var(--text-factor,var(--text-zoom-scale,1)));font-weight:650;color:var(--ink);text-decoration:none;letter-spacing:-.02em;}
.blog-themes{display:flex;align-items:center;gap:2px;border:1px solid var(--line);border-radius:6px;padding:3px;}
.blog-themes button{appearance:none;font:calc(14px * var(--text-factor,var(--text-zoom-scale,1)))/1 var(--blog-font);color:var(--muted);background:none;border:0;border-radius:3px;min-height:38px;padding:0 12px;cursor:pointer;}
.blog-themes button[aria-pressed="true"]{background:var(--soft);color:var(--ink);box-shadow:inset 0 -2px var(--ink);}
html[data-blog-mode="light"] [data-blog-theme="light"],html[data-blog-mode="dark"] [data-blog-theme="dark"]{font-weight:700;}
.blog-footer{border-top:1px solid var(--line);margin-top:88px;padding-block:26px 40px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 24px;color:var(--muted);}
.blog-footer a{color:var(--accent);}
.blog-skip{position:absolute;top:-100px;left:24px;padding:8px 16px;background:var(--paper);z-index:100;}
.blog-skip:focus{top:8px;}
.home{width:min(calc(100% - 2 * var(--gutter)),820px);margin:80px auto 0;}
.home-intro{margin-bottom:72px;}
.home h1{font-size:calc(clamp(34px,5vw,54px) * var(--text-factor,var(--text-zoom-scale,1)));font-weight:600;letter-spacing:-.045em;margin:0;max-width:12em;line-height:1.35;}
.post-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line);}
.post-list>li{padding:30px 0 34px;border-bottom:1px solid var(--line);}
.post-meta{display:flex;align-items:center;flex-wrap:wrap;gap:16px;color:var(--accent);font-size:calc(14px * var(--text-factor,var(--text-zoom-scale,1)));line-height:1.5;font-variant-numeric:tabular-nums;}
.language{border:1px solid currentColor;border-radius:3px;padding:1px 7px;font-size:calc(12px * var(--text-factor,var(--text-zoom-scale,1)));}
.post-list h3{margin:13px 0 12px;font-size:calc(clamp(23px,3vw,30px) * var(--text-factor,var(--text-zoom-scale,1)));font-weight:600;letter-spacing:-.025em;}
.post-list h3 a{color:var(--ink);text-decoration:none;}
.post-list h3 a:hover{color:var(--accent);text-decoration:underline;}
.post-summary{color:var(--muted);font-size:calc(16px * var(--text-factor,var(--text-zoom-scale,1)));line-height:1.8;margin:0;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.post-shell{width:min(calc(100% - 2 * var(--gutter)),684px);margin:62px auto 0;}
.post-title{font-size:calc(clamp(30px,4vw,42px) * var(--text-factor,var(--text-zoom-scale,1)));font-weight:650;letter-spacing:-.03em;margin:18px 0 48px;line-height:1.18;}
@media(min-width:600px){.prose p:not([class]),.prose li{font-size:calc(calc(20px * var(--reader-scale,1)) * var(--text-factor,var(--text-zoom-scale,1)));line-height:1.7}}
.prose p{margin:0 0 1.35em;}
.prose h2{font-size:calc(28px * var(--text-factor,var(--text-zoom-scale,1)));margin:2.5em 0 1em;letter-spacing:-.02em;}
.prose h3{font-size:calc(22px * var(--text-factor,var(--text-zoom-scale,1)));margin:2em 0 .8em;}
.prose h4{font-size:calc(20px * var(--text-factor,var(--text-zoom-scale,1)));margin:1.8em 0 .8em;}
.prose strong{font-weight:650;}
.prose blockquote{margin:1.5em 0;padding-left:1em;border-left:2px solid var(--muted);color:var(--ink-2);}
.prose blockquote p:last-child{margin-bottom:0;}
.prose ul,.prose ol{padding-left:1.5em;margin:0 0 1.5em;}
.prose li{padding-left:.15em;margin:.5em 0;}
.prose hr {
  border: 0; width: 16px; height: 16px; margin: 3.2rem auto 2.8rem; --m: var(--muted);
  background:
    linear-gradient(var(--m), var(--m)) 0 0 / 6px 1.5px no-repeat, linear-gradient(var(--m), var(--m)) 0 0 / 1.5px 6px no-repeat,
    linear-gradient(var(--m), var(--m)) 100% 0 / 6px 1.5px no-repeat, linear-gradient(var(--m), var(--m)) 100% 0 / 1.5px 6px no-repeat,
    linear-gradient(var(--m), var(--m)) 0 100% / 6px 1.5px no-repeat, linear-gradient(var(--m), var(--m)) 0 100% / 1.5px 6px no-repeat,
    linear-gradient(var(--m), var(--m)) 100% 100% / 6px 1.5px no-repeat, linear-gradient(var(--m), var(--m)) 100% 100% / 1.5px 6px no-repeat;
}
.prose figure{margin:2em 0 1.1em;}
.prose img{display:block;max-width:100%;width:auto;height:auto;margin-inline:auto;}
.prose .caption{font-size:calc(15px * var(--text-factor,var(--text-zoom-scale,1)));line-height:1.7;color:var(--muted);margin-bottom:2em;}
.prose pre{font:calc(13px * var(--text-factor,var(--text-zoom-scale,1)))/1.8 ui-monospace,SFMono-Regular,Consolas,monospace;white-space:pre;overflow-x:auto;max-width:100%;padding:20px;background:var(--soft);border:1px solid var(--line);margin:2em 0;}
@media(max-width:599px){:root{--gutter:22px;}.blog-header{min-height:0;gap:18px;}.blog-name{flex-basis:100%;}.blog-themes button{min-height:40px;}.home{margin-top:48px;}.home-intro{margin-bottom:46px;}.post-shell{margin-top:40px;}.post-title{margin-bottom:36px;}.prose h2{font-size:calc(26px * var(--text-factor,var(--text-zoom-scale,1)));}.blog-footer{margin-top:64px;}}

.prose .post-title.display,.prose .post-title+.dek{--display-scale:calc(var(--reader-scale,1) * var(--text-zoom-scale,1))}
.prose .post-title.display{font-size:clamp(calc(40px * var(--display-scale)),calc((3.2vw + 24px) * var(--display-scale)),calc(60px * var(--display-scale)));font-weight:760;line-height:1.02;letter-spacing:-.015em}
.prose .post-title+.dek{font-size:clamp(calc(22px * var(--display-scale)),calc((.77vw + 18px) * var(--display-scale)),calc(28px * var(--display-scale)));font-weight:520;line-height:1.3;color:var(--ink-2)}
html.text-zoom .prose .post-title+.dek{--display-scale:calc(var(--reader-scale,1) * var(--title-text-scale))}
html.text-zoom .prose .post-title.display{--display-scale:calc(var(--reader-scale,1) * var(--title-text-scale))}

.prose.emphasis-band strong{font-weight:600;background:linear-gradient(transparent 60%,var(--accent-soft) 60%);padding:0 .08em;}
.prose.emphasis-band blockquote{border-left-color:var(--accent);color:var(--ink);}
html:lang(zh) :is(.post-title,.dek,.prose h2,.prose h3,.prose h4,.post-list h3,.home h1){word-break:keep-all;overflow-wrap:anywhere;}
.prose [lang^="zh"]{font-style:normal;}

/* RSS subscription address wraps at narrow viewport widths. */
.subscribe-address{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center;min-width:0}
.subscribe-address code{font-family:inherit;font-size:.82em;overflow-wrap:anywhere;min-width:0;max-width:100%;user-select:all}
.subscribe-address button{appearance:none;font:inherit;color:var(--ink);background:none;border:1px solid var(--line);border-radius:999px;padding:.35em 1em;cursor:pointer}
.subscribe-address button:hover{border-color:currentColor}
.subscribe-address button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
#copy-status{display:block;min-height:1.6em;margin-top:.6em;font-size:.85em;color:var(--muted)}
.subscribe-page{overflow-wrap:anywhere;min-width:0}

/* Emphasis levels (山山 11/11): bold = key words; highlighter band = the one sentence per section to remember;
   the two or three most important sentences get the band all the way up. CSS only. */
/* 11/11 20:49 他定「满底色更重」: the full band (thesis) a stronger mix of the accent, the half band thinner and lighter; the first value is the fallback without color-mix */
.prose mark.hl{color:inherit;background:linear-gradient(transparent 58%,var(--accent-soft) 58%);background:linear-gradient(transparent 70%,color-mix(in srgb,var(--accent) 18%,var(--paper)) 70%);padding:0 .06em;-webkit-box-decoration-break:clone;box-decoration-break:clone;}
.prose mark.hl.ch{color:inherit}  /* one-per-chapter pick: same look as the band; the dev tryout can thin out the others (11/11) */
.prose mark.hl.key{background:var(--accent-soft);background:color-mix(in srgb,var(--accent) 28%,var(--paper));}  /* the two or three most important sentences: the band goes all the way up (山山 11/11 15:46: no star) */
@media (forced-colors:active){.prose mark.hl{background:Mark;color:MarkText;}}
