/* v1.1 additions. Original book spacing, media and MathML rules stay in toc.css. */
:root{--reader-scale:1;--header-duration:220ms;--header-ease:cubic-bezier(.4,0,.2,1);--reader-serif-zh:"Songti SC","STSong","Noto Serif CJK SC",serif;--reader-kai-zh:"Kaiti SC","STKaiti",serif;--reader-serif-en:Georgia,"Times New Roman",serif;}
.header-slot{display:flow-root;}
.blog-header{position:relative;z-index:30;background:var(--paper);transform:translateY(0);}
.header-tools{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.language-switch{font-size:calc(14px * var(--text-factor,var(--text-zoom-scale,1)));white-space:nowrap;}
.theme-icon{display:none;}
.header-stuck .blog-header{position:fixed;top:0;left:0;right:0;transform:translateY(0);transition:transform var(--header-duration) var(--header-ease);}
.header-stuck.header-hidden .blog-header{transform:translateY(-100%);}
.header-measuring .blog-header{transition:none!important;}
.rail{transition:transform .35s var(--ease),visibility .35s;}
.rail-handle{transition:left .35s var(--ease),background-color .2s var(--ease);}
.prose :is(h1,h2,h3,h4,[id]){scroll-margin-top:calc(var(--sticky-header-height,48px) + 24px);}
.prose{font-size:calc(calc(18px * var(--reader-scale)) * var(--text-factor,var(--text-zoom-scale,1)));font-family:var(--reader-body-font,var(--blog-font));}
.prose h1{font-size:calc(calc(clamp(30px,4vw,42px) * var(--reader-scale)) * var(--text-factor,var(--text-zoom-scale,1)));}
.prose h2{font-size:calc(calc(28px * var(--reader-scale)) * var(--text-factor,var(--text-zoom-scale,1)));}
.prose h3{font-size:calc(calc(22px * var(--reader-scale)) * var(--text-factor,var(--text-zoom-scale,1)));}
.prose h4{font-size:calc(calc(20px * var(--reader-scale)) * var(--text-factor,var(--text-zoom-scale,1)));}
.prose .caption,.prose figcaption{font-size:calc(calc(15px * var(--reader-scale)) * var(--text-factor,var(--text-zoom-scale,1)));}
html:lang(zh)[data-reader-font="serif"]{--reader-body-font:var(--reader-local-font,var(--reader-serif-zh));}
html:lang(zh)[data-reader-font="kai"]{--reader-body-font:var(--reader-local-font,var(--reader-kai-zh));}
html:lang(en)[data-reader-font="serif"]{--reader-body-font:var(--reader-local-font,var(--reader-serif-en));}
.translation-notice{padding:16px 20px;margin:0 0 24px;background:var(--soft);border-left:3px solid var(--accent);font:calc(16px * var(--text-factor,var(--text-zoom-scale,1)))/1.7 var(--blog-font);color:var(--ink-2);}
.original-language{font-size:calc(12px * var(--text-factor,var(--text-zoom-scale,1)));color:var(--muted);}
.reader-toggle{border:1px solid var(--line);border-radius:6px;cursor:pointer;background:var(--paper);color:var(--ink);font:calc(16px * var(--text-factor,var(--text-zoom-scale,1)))/1 var(--blog-font);min-width:44px;min-height:44px;padding:8px;}
.reader-panel{position:fixed;inset:calc(var(--sticky-header-height,105px) + 12px) max(24px,calc((100vw - 1000px)/2)) auto auto;margin:0;padding:24px;width:340px;max-width:calc(100vw - 48px);border:1px solid var(--line);border-radius:12px;background:var(--paper);color:var(--ink);box-shadow:0 8px 34px rgba(0,0,0,.16);font:calc(15px * var(--text-factor,var(--text-zoom-scale,1)))/1.5 var(--blog-font);}
.reader-panel[open]{animation:reader-in var(--header-duration) var(--header-ease);}
.reader-panel:not([open]){display:none;}
.reader-panel::backdrop{background:transparent;}
.reader-panel h2:focus{outline:none;}
.reader-choices .size-a{line-height:1;font-weight:500;}.reader-choices .size-0{font-size:calc(12px * var(--text-factor,var(--text-zoom-scale,1)));}.reader-choices .size-1{font-size:calc(14px * var(--text-factor,var(--text-zoom-scale,1)));}.reader-choices .size-2{font-size:calc(16px * var(--text-factor,var(--text-zoom-scale,1)));}.reader-choices .size-3{font-size:calc(19px * var(--text-factor,var(--text-zoom-scale,1)));}.reader-choices .size-4{font-size:calc(22px * var(--text-factor,var(--text-zoom-scale,1)));}
.theme-icon svg{width:14px;height:14px;display:block;}
.blog-footer a:only-child{margin-left:auto;}
.reader-panel-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:24px;}
.reader-panel h2,.rail-title{font:600 calc(18px * var(--text-factor,var(--text-zoom-scale,1)))/1.4 var(--blog-font);margin:0;}
.reader-panel-head button{border:0;background:none;color:var(--ink);font:calc(26px * var(--text-factor,var(--text-zoom-scale,1)))/1 var(--blog-font);width:44px;height:44px;cursor:pointer;}
.reader-panel fieldset{border:0;padding:0;margin:0 0 24px;min-width:0;}
.reader-panel fieldset:last-child{margin-bottom:0;}
.reader-panel legend{padding:0;margin-bottom:8px;color:var(--muted);}
.reader-choices{display:flex;gap:8px;}
.reader-choices button{flex:1;min-width:0;min-height:44px;border:1px solid var(--line);border-radius:6px;background:var(--paper);color:var(--ink);font:calc(16px * var(--text-factor,var(--text-zoom-scale,1)))/1.5 var(--blog-font);cursor:pointer;}
.reader-choices button[aria-pressed="true"]{background:var(--soft);border-color:var(--ink);box-shadow:inset 0 -2px var(--ink);}
/* Previews use local fallbacks; unselected web fonts never cause a request. */
.reader-choices .font-sample{font-size:calc(24px * var(--text-factor,var(--text-zoom-scale,1)));}
.reader-choices .font-serif{font-family:var(--reader-serif-zh);}
.reader-choices .font-kai{font-family:var(--reader-kai-zh);}
html:lang(en) .reader-choices .font-serif{font-family:var(--reader-serif-en);}
html[data-reader-font="serif"] .reader-choices .font-serif,html[data-reader-font="kai"] .reader-choices .font-kai{font-family:var(--reader-body-font);}
@keyframes reader-in{from{opacity:0;transform:translateY(12px);}}
@media(max-width:599px){
  .blog-header{--gutter:24px;}
  .header-tools{gap:12px;}
  .header-stuck .blog-header{height:48px;min-height:48px;padding-block:0;flex-wrap:nowrap;gap:8px;}
  .header-stuck .blog-name{flex-basis:auto;white-space:nowrap;font-size:calc(16px * var(--text-factor,var(--text-zoom-scale,1)));}
  .header-stuck .header-tools{gap:8px;flex-wrap:nowrap;}
  .header-stuck .blog-themes{padding:2px;gap:0;}
  .header-stuck .blog-themes button{min-height:34px;min-width:28px;padding:0 5px;font-size:calc(15px * var(--text-factor,var(--text-zoom-scale,1)));}
  .header-stuck .theme-word{display:none;}
  .header-stuck .theme-icon{display:inline-flex;align-items:center;justify-content:center;}
  .header-stuck .language-switch{font-size:calc(12px * var(--text-factor,var(--text-zoom-scale,1)));}
  .prose h2{font-size:calc(calc(26px * var(--reader-scale)) * var(--text-factor,var(--text-zoom-scale,1)));}
}
@media(width < 1280px){
  .reader-desktop{display:none;}
  .toc-fab,.to-top-fab,.to-top-fab.is-visible{transition:transform var(--header-duration) var(--header-ease),opacity var(--header-duration) var(--header-ease),visibility var(--header-duration);}
  .header-hidden :is(.toc-fab,.to-top-fab){transform:translateY(18px);opacity:0;visibility:hidden;pointer-events:none;}
  .reader-panel{inset:auto 24px max(24px,env(safe-area-inset-bottom,0px));width:auto;max-width:none;max-height:80dvh;overflow:auto;}
  .blog-footer{padding-bottom:calc(var(--toc-fab-bottom) + 2 * var(--toc-fab-size) + var(--fab-gap) + 16px);}
}
@media(prefers-reduced-motion:reduce){
  .blog-header,.rail,.rail-handle,.toc-fab,.to-top-fab{transition:none!important;}
  .reader-panel[open]{animation:none;}
}
/* pre4: the header controls share one frame, rhythm and monochrome state. */
:root{--reader-hand-en:"Klee One",cursive;}
.ui-icon{display:inline-block;width:24px;height:24px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle;}
.header-tools{gap:10px;flex-wrap:nowrap;}
.blog-languages,.blog-themes{display:flex;align-items:center;gap:2px;border:1px solid var(--line);border-radius:6px;padding:3px;height:44px;}
.blog-languages a,.blog-themes button{display:flex;align-items:center;justify-content:center;min-height:36px;padding:0 10px;border:0;border-radius:3px;font:calc(14px * var(--text-factor,var(--text-zoom-scale,1)))/1 var(--blog-font);color:var(--muted);background:none;text-decoration:none;white-space:nowrap;}
.blog-languages a[aria-current],.blog-themes button[aria-pressed="true"]{background:var(--soft);color:var(--ink);box-shadow:inset 0 -2px var(--ink);}
.blog-languages a:hover,.blog-themes button:hover,.reader-toggle:hover{background:var(--soft);color:var(--ink);}
.reader-toggle{height:44px;min-height:44px;min-width:44px;display:inline-grid;place-items:center;border:1px solid var(--line);border-radius:6px;font:calc(14px * var(--text-factor,var(--text-zoom-scale,1)))/1 var(--blog-font);}
.theme-icon{display:inline-flex;align-items:center;justify-content:center;}.theme-word{display:none;}
.theme-icon .ui-icon{width:24px;height:24px;}
.header-stuck .blog-header{min-height:56px;padding-block:6px;flex-wrap:nowrap;gap:8px;}
.header-stuck .blog-name{flex-basis:auto;font-size:calc(16px * var(--text-factor,var(--text-zoom-scale,1)));white-space:nowrap;}
.header-stuck .header-tools{gap:6px;flex-wrap:nowrap;}
.header-stuck :is(.blog-languages,.blog-themes){height:34px;padding:2px;gap:0;}
.header-stuck :is(.blog-languages a,.blog-themes button){min-height:28px;min-width:26px;padding:0 5px;font-size:calc(12px * var(--text-factor,var(--text-zoom-scale,1)));}
.header-stuck .reader-desktop{height:34px;min-height:34px;min-width:34px;padding:4px;}
.header-stuck .blog-header .ui-icon{width:20px;height:20px;}
/* Desktop rail: only the list scrolls; title and return button keep their space. */
@media(min-width:1280px){
  .rail{min-height:0;gap:16px;}
  .rail-title{flex:none;color:var(--ink);}
  .rail > .rail-list{flex:1 1 0;min-height:0;overflow-y:auto;overscroll-behavior:contain;align-content:start;margin:0;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--ink) 25%,transparent) transparent;}
  .rail-to-top{display:inline-flex;align-items:center;justify-content:center;gap:8px;flex:none;align-self:flex-start;min-height:44px;max-width:100%;margin:0;padding:10px 14px;border:0;border-radius:24px;background:var(--paper);color:var(--ink);box-shadow:0 2px 12px var(--shadow,rgba(17,17,17,.16)),inset 0 0 0 1px var(--line);font:calc(15px * var(--text-factor,var(--text-zoom-scale,1)))/1.45 var(--blog-font);cursor:pointer;text-decoration:none;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .18s var(--ease),visibility 0s .18s;}
  .rail-to-top.is-visible{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .18s var(--ease),visibility 0s;}
  .rail-to-top:hover{text-decoration:none;background:var(--soft);}
  .rail-to-top:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
  .rail-to-top .ui-icon{width:24px;height:24px;}
}
/* Leave room below the cover even in a 600px-high laptop window. */
@media(min-width:1280px) and (max-height:800px){.rail{gap:8px;padding-top:8px;padding-bottom:max(8px,env(safe-area-inset-bottom,0px));}}
@media(min-width:1280px) and (prefers-reduced-motion:reduce){.rail-to-top,.rail-to-top.is-visible{transition:none;}}
.toc-fab .list{width:24px;height:24px;}
.to-top-fab{width:var(--toc-fab-size);height:var(--toc-fab-size);}
.post-cover{width:100%;margin:0;background:#F7F5F0;}.post-cover img{display:block;width:min(100%,1600px,140vh,calc(200vh - 460px));max-height:min(70vh,calc(100vh - 230px));aspect-ratio:2/1;height:auto;margin-inline:auto;object-fit:contain;border-radius:0;}
.post-cover ~ .reader .post-shell.column{margin-top:0;padding-top:32px;}
.toc-inline{margin-bottom:24px;display:none;}
.home-intro p{margin:16px 0 0;color:var(--ink-2);font-size:calc(18px * var(--text-factor,var(--text-zoom-scale,1)));max-width:42em;}
html:lang(en)[data-reader-font="kai"]{--reader-body-font:var(--reader-local-font,var(--reader-hand-en));}
html:lang(en) .font-kai{font-family:var(--reader-hand-en);}
.font-sample{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:2px;}
.typeface-preview{display:block;height:30px;width:48px;fill:currentColor;}
.font-choice-name{font:calc(12px * var(--text-factor,var(--text-zoom-scale,1)))/1.4 var(--blog-font);color:var(--muted);}
@media(width < 1280px){.reader-desktop{display:none;}.header-stuck .blog-header{height:48px;min-height:48px;}.header-stuck .blog-name{font-size:calc(14px * var(--text-factor,var(--text-zoom-scale,1)));}}
@media(max-width:639px){
 .toc-inline{display:flow-root;}.post-shell.column{margin-top:16px;}
 .post-cover ~ .reader .post-shell.column{margin-top:0;padding-top:20px;}
 .blog-header{gap:16px;}.header-tools{gap:8px;}.blog-name{flex-basis:100%;}
 .blog-languages a,.blog-themes button{padding-inline:8px;}
 .header-stuck .blog-header{width:100%;padding-inline:12px;}
 .header-stuck .blog-name{font-size:calc(12px * var(--text-factor,var(--text-zoom-scale,1)));letter-spacing:-.03em;}
 .header-stuck .header-tools{gap:5px;}.header-stuck .blog-languages a{padding-inline:4px;font-size:calc(11px * var(--text-factor,var(--text-zoom-scale,1)));}
 .header-stuck .blog-themes button{padding:0 3px;min-width:24px;}
}
@media(max-width:359px){.header-stuck .blog-header{padding-inline:6px;gap:4px;}.header-stuck .blog-name{font-size:calc(11px * var(--text-factor,var(--text-zoom-scale,1)));}.header-stuck .blog-languages a{font-size:calc(10px * var(--text-factor,var(--text-zoom-scale,1)));padding-inline:3px;}.header-stuck .blog-themes button{min-width:20px;}.header-stuck .theme-icon .ui-icon{width:18px;height:18px;}}
/* pre6: optional heading faces have their own real weights; no synthetic bold. */
html[data-reader-font="serif"] :is(.prose h1,.prose h2,.prose h3,.prose h4,.post-list h3,.home h1),
html[data-reader-font="kai"] :is(.prose h1,.prose h2,.prose h3,.prose h4,.post-list h3,.home h1){font-family:var(--reader-heading-font,var(--reader-body-font));font-weight:var(--reader-heading-weight,700);font-synthesis:none;}
/* Match the Chinese default heading rule's specificity, including traditional text.
   Keep this separate from the shared English/home declarations above. */
html:lang(zh)[data-reader-font="serif"] :is(.prose h1,.prose h2,.prose h3,.prose h4,.prose .dek,.rail,.rail *,.toc-pop,.toc-pop *,.toc-inline,.toc-inline *),
html:lang(zh)[data-reader-font="kai"] :is(.prose h1,.prose h2,.prose h3,.prose h4,.prose .dek,.rail,.rail *,.toc-pop,.toc-pop *,.toc-inline,.toc-inline *){font-family:var(--reader-heading-font,var(--reader-body-font));font-weight:var(--reader-heading-weight,700);font-synthesis:none;}
/* Every absolute font declaration receives one multiplier at build time.
   Relative and inherited text already follows its parent's computed size. */
html.text-zoom :is(.prose h1,.home h1,.post-list h3,.post-subtitle){--text-factor:var(--title-text-scale);}
/* Keep Aa's reader scale; cap the subtitle independently of the enlarged prose. */
html.text-zoom .prose .dek{--text-factor:var(--title-text-scale);font-size:calc(calc(20.7px * var(--reader-scale)) * var(--text-factor,var(--text-zoom-scale,1)));}
html.text-zoom :is(.blog-header,.reader-panel,.mobile-reader-controls,.toc-fab,.to-top-fab,.rail,.rail-handle,.toc-pop,.toc-inline){--text-factor:var(--ui-text-scale);}
.theme-cycle{display:none;}
.header-tight .blog-header{flex-wrap:nowrap;gap:8px;}
.header-tight .blog-header .blog-name{flex:1 1 0;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.header-tight .header-tools{flex:0 0 auto;min-width:0;gap:6px;flex-wrap:nowrap;}
.header-tight .blog-languages a[aria-current],.header-tight .blog-themes{display:none;}
.header-tight .blog-languages{flex:none;}
.header-tight .theme-cycle{display:inline-grid;place-items:center;flex:none;width:44px;height:44px;padding:8px;border:1px solid var(--line);border-radius:6px;background:var(--paper);color:var(--ink);cursor:pointer;}
.header-tight.header-stuck .theme-cycle{width:34px;height:34px;padding:4px;}
.theme-cycle:focus-visible{outline:2px solid var(--accent);outline-offset:4px;}
html.text-zoom :is(.reader-panel,.toc-pop,.rail) :is(h2,p,a,legend){overflow-wrap:anywhere;}
/* translation review status: upright among the italic note, a small proofreading mark in front (11-01) */
.prose .caption .review-status{font-style:normal;white-space:nowrap;}
.prose .caption .review-status .ui-icon{width:1.1em;height:1.1em;vertical-align:-.2em;margin-right:.2em;}
/* blog-v1.2: main-site globe, one Aa and theme cycle, in a single header row. */
.blog-header,.header-stuck .blog-header{flex-wrap:nowrap;gap:16px;}
.blog-header .blog-name,.header-stuck .blog-header .blog-name{flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.blog-header .header-tools{flex:0 0 auto;display:flex;align-items:center;gap:16px;flex-wrap:nowrap;}
.language-control{position:relative;display:flex;align-items:center;}
.blog-header :is(.lang-toggle,.reader-toggle,.theme-cycle){position:relative;display:inline-flex;align-items:center;justify-content:center;flex:none;gap:.35em;margin:0;padding:0;border:0;border-radius:0;min-width:30px;min-height:30px;height:30px;background:none;color:var(--ink);font:calc(15px * var(--text-factor,var(--text-zoom-scale,1)))/1.2 var(--blog-font);white-space:nowrap;cursor:pointer;transition:color .3s var(--ease);}
.blog-header :is(.lang-toggle,.reader-toggle,.theme-cycle) svg{width:18px;height:18px;flex:none;}
.blog-header :is(.lang-toggle,.reader-toggle,.theme-cycle):hover{color:var(--ink-2);background:none;}
.blog-header :is(.lang-toggle,.reader-toggle,.theme-cycle):focus-visible{outline:2px solid var(--accent);outline-offset:4px;}
.script-note{margin:8px 0 0;font-size:calc(12px * var(--text-factor,var(--text-zoom-scale,1)));color:var(--muted);}
/* The existing contents and back-to-top positions and scroll rules stay intact. */
@media(max-width:639px){
 .blog-header,.header-stuck .blog-header{width:100%;min-height:64px;height:auto;margin:0;padding:16px 24px;gap:12px;}
 .header-stuck .blog-header{min-height:48px;height:48px;padding-block:8px;}
 .blog-header .blog-name,.header-stuck .blog-header .blog-name{font-size:calc(14px * var(--text-factor,var(--text-zoom-scale,1)));letter-spacing:-.02em;flex-basis:auto;}
 .blog-header .header-tools,.header-stuck .header-tools{gap:12px;}
 .blog-header :is(.lang-toggle,.reader-toggle,.theme-cycle){width:30px;min-width:30px;min-height:30px;height:30px;border:1px solid var(--muted);border-radius:50%;padding:0;}
 .blog-header :is(.lang-toggle,.reader-toggle,.theme-cycle) svg{width:15px;height:15px;}
 .lt-label,.tt-label,.rt-label{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}
 .reader-panel{max-height:80dvh;overflow:auto;}
}
.header-tight .blog-header .blog-name{flex:1 1 0;}
.header-tight .blog-header :is(.lt-label,.tt-label,.rt-label){position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
.header-tight .blog-header .header-tools{gap:12px;}
.header-tight .blog-header .theme-cycle{width:30px;height:30px;padding:0;}
@media(prefers-reduced-motion:reduce){.blog-header :is(.lang-toggle,.reader-toggle,.theme-cycle){transition:none;}}
/* Imported drafts inherit the shared reader, rail, header and both themes. */
.draft-label{font-size:.75em;color:var(--muted);border:1px solid var(--line);border-radius:3px;padding:.1em .4em;}
.imported .dek{color:var(--muted);font-size:1.15em;line-height:1.5;}
.imported .byline{color:var(--muted);font-size:.85em;}
.imported .num{color:var(--accent);margin-right:.5em;}
.imported figcaption{color:var(--muted);font-size:.85em;line-height:1.5;margin-top:.7em;}
.imported figcaption .no{color:var(--accent);font-weight:600;margin-right:.5em;}
.imported figure .scroll{max-width:100%;overflow-x:auto;}
.imported figure img{display:block;max-width:100%;height:auto;}
.imported .swipe{display:none;}
.imported pre{max-width:100%;overflow:auto;}
html[data-theme="dark"] .imported .fig-mono{filter:invert(1) hue-rotate(180deg);}
@media(prefers-color-scheme:dark){html:not([data-theme="light"]) .imported .fig-mono{filter:invert(1) hue-rotate(180deg);}}
/* v1.2 selected title, archive and appendix styles. */
.post-list>li:last-child{border-bottom:0}
.blog-footer{margin-top:24px}
.post-year{margin:36px 0 12px;color:var(--muted);font-size:calc(16px * var(--text-factor,var(--text-zoom-scale,1)));font-weight:400;letter-spacing:.02em}
.post-list h3{margin-bottom:8px}
.post-list .post-subtitle{margin:0 0 12px;color:var(--ink-2);font-size:calc(18px * var(--text-factor,var(--text-zoom-scale,1)));line-height:1.6}
.prose .dek{margin:12px 0 24px;color:var(--ink-2);font-size:1.15em;line-height:1.5;font-weight:400}
.prose .post-title{margin-bottom:0}
.post-updates{margin:44px 0 8px;padding-top:18px;border-top:1px solid var(--line);color:var(--muted)}
.prose .post-updates .pu-label{margin:0 0 8px;padding:0;font-size:calc(18px * var(--text-factor,var(--text-zoom-scale,1)));line-height:1.5;font-weight:400;color:var(--muted);letter-spacing:.02em}
.prose .post-updates time{display:block;font-size:calc(14px * var(--text-factor,var(--text-zoom-scale,1)));line-height:1.6;color:var(--muted);font-variant-numeric:tabular-nums;margin:0 0 4px}
.prose .post-updates ul{margin:0;padding:0;list-style:none}
.prose .post-updates li{margin:0 0 8px;padding:0;font-size:calc(16px * var(--text-factor,var(--text-zoom-scale,1)));line-height:1.75;color:var(--muted)}
.prose .post-updates li::before{content:none}
.post-updates,.post-neighbors{--text-factor:calc(var(--reader-scale,1) * var(--text-zoom-scale,1))}
.post-neighbors{margin:32px 0 8px;padding-top:18px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;font-size:calc(16px * var(--text-factor,var(--text-zoom-scale,1)));font-family:var(--blog-font)}
.post-neighbors a{max-width:100%;overflow-wrap:anywhere}
.post-neighbors span{display:inline-block;width:100%;color:var(--muted)}
.post-taxonomy{display:flex;flex-wrap:wrap;gap:12px}
.post-subtitle,.dek,.post-neighbors a{text-wrap:balance}
/* Framework section numbering and optional display title. */
.prose h2:has(>.num){display:flex;gap:.6em;align-items:baseline}
.prose h2>.num{color:var(--accent);flex:none;font-variant-numeric:tabular-nums}
.header-stuck .blog-header :is(.lang-toggle,.reader-toggle,.theme-cycle) svg{width:18px;height:18px}
@media(max-width:639px){.header-stuck .blog-header :is(.lang-toggle,.reader-toggle,.theme-cycle) svg{width:15px;height:15px}}

/* round8: home reading content shares the article preference scale and fonts. */
.home{font-family:var(--reader-body-font,var(--blog-font));}
.home h1{font-size:calc(calc(clamp(34px,5vw,54px) * var(--reader-scale)) * var(--text-factor,var(--text-zoom-scale,1)));text-wrap:balance;}
.home-intro .home-subtitle{margin:12px 0 0;font-size:calc(calc(24px * var(--reader-scale)) * var(--text-factor,var(--text-zoom-scale,1)));font-weight:500;color:var(--ink);text-wrap:balance;}
.home-intro .home-note{margin:8px 0 0;font-size:calc(calc(18px * var(--reader-scale)) * var(--text-factor,var(--text-zoom-scale,1)));color:var(--ink-2);text-wrap:pretty;}
.home .post-year{font-size:calc(calc(16px * var(--reader-scale)) * var(--text-factor,var(--text-zoom-scale,1)));}
.home .post-list h3{font-size:calc(calc(clamp(23px,3vw,30px) * var(--reader-scale)) * var(--text-factor,var(--text-zoom-scale,1)));}
.home .post-list .post-subtitle{font-size:calc(calc(18px * var(--reader-scale)) * var(--text-factor,var(--text-zoom-scale,1)));}
.home .post-summary{font-size:calc(calc(16px * var(--reader-scale)) * var(--text-factor,var(--text-zoom-scale,1)));}
.home .post-meta{font-size:calc(calc(14px * var(--reader-scale)) * var(--text-factor,var(--text-zoom-scale,1)));}
.home .language{font-size:calc(calc(12px * var(--reader-scale)) * var(--text-factor,var(--text-zoom-scale,1)));}
html:lang(zh)[data-reader-font="serif"] .home :is(h1,h2,h3),html:lang(zh)[data-reader-font="kai"] .home :is(h1,h2,h3),
html:lang(en)[data-reader-font="serif"] .home :is(h1,h2,h3),html:lang(en)[data-reader-font="kai"] .home :is(h1,h2,h3){font-family:var(--reader-heading-font,var(--reader-body-font));font-weight:var(--reader-heading-weight,700);font-synthesis:none;}
html.text-zoom .home-subtitle{--text-factor:var(--title-text-scale);}
@media(max-width:599px){.home-intro .home-subtitle{font-size:calc(calc(22px * var(--reader-scale)) * var(--text-factor,var(--text-zoom-scale,1)));}}

html:lang(zh) .home .post-year,html:lang(zh)[data-reader-font] .home .post-year{font-family:inherit;font-weight:400;}

/* Header settings reuse the reader dialog frame, placement and animation. */
.language-options ul{display:flex;gap:8px;list-style:none;padding:0;margin:0;}
.language-options li{flex:1;min-width:0;margin:0;padding:0;}
.language-options a{display:flex;align-items:center;justify-content:center;box-sizing:border-box;min-height:44px;padding:0;font:calc(16px * var(--text-factor,var(--text-zoom-scale,1)))/1.5 var(--blog-font);background:var(--paper);border:1px solid var(--line);border-radius:6px;color:var(--ink);text-decoration:none;}
.language-options a[aria-current]{background:var(--soft);border-color:var(--ink);box-shadow:inset 0 -2px var(--ink);}
.language-options a:hover,.language-options a:focus-visible{background:var(--soft);}
.color-choices button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:12px 4px;}
.color-choices span{font-size:calc(14px * var(--text-factor,var(--text-zoom-scale,1)));overflow-wrap:anywhere;}

/* Mobile settings share the contents button baseline and header visibility state. */
@media(width < 1280px){
 :root{--toc-fab-size:48px;--fab-gap:12px;--toc-fab-bottom:max(16px,calc(env(safe-area-inset-bottom,0px) + 10px));}
 .header-tools.mobile-reader-controls{position:fixed;z-index:12;right:max(14px,env(safe-area-inset-right,0px));bottom:var(--toc-fab-bottom);display:flex;align-items:center;flex-wrap:nowrap;gap:var(--fab-gap);transition:transform var(--header-duration) var(--header-ease),opacity var(--header-duration) var(--header-ease),visibility var(--header-duration);}
 .mobile-reader-controls :is(.lang-toggle,.reader-toggle,.theme-cycle){position:relative;display:grid;place-items:center;flex:none;width:var(--toc-fab-size);height:var(--toc-fab-size);min-width:var(--toc-fab-size);min-height:var(--toc-fab-size);margin:0;padding:0;border:0;border-radius:50%;background:var(--paper);color:var(--ink);box-shadow:0 2px 12px var(--shadow,rgba(17,17,17,.16)),inset 0 0 0 1px var(--line);cursor:pointer;}
 .mobile-reader-controls :is(.lt-label,.rt-label,.tt-label){position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}
 .mobile-reader-controls svg{width:18px;height:18px;flex:none;}
 .mobile-reader-controls button:hover{background:var(--soft);}
 .mobile-reader-controls button:focus-visible{outline:2px solid var(--accent);outline-offset:4px;}
 .header-hidden .mobile-reader-controls{transform:translateY(18px);opacity:0;visibility:hidden;pointer-events:none;}
 .blog-footer{padding-bottom:calc(var(--toc-fab-bottom) + var(--toc-fab-size) + 16px);}
 body:has(.toc-fab) .blog-footer{padding-bottom:calc(var(--toc-fab-bottom) + 2 * var(--toc-fab-size) + var(--fab-gap) + 16px);}
}
@media(width < 1280px) and (prefers-reduced-motion:reduce){.mobile-reader-controls{transition:none!important;}}
