:root{--bg: hsl(0 0% 100%);--fg: hsl(0 0% 4%);--muted: hsl(0 0% 45%);--hair: hsl(0 0% 91%);--hover: hsl(0 0% 97%);--chip: hsl(0 0% 96%);--beam: hsl(0 0% 0%);--sans: "Geist", "Inter", "PingFang SC", "Noto Sans SC", ui-sans-serif, system-ui, sans-serif;--mono: "Geist Mono", ui-monospace, monospace;--radius: 8px;color-scheme:light}html.dark{--bg: hsl(0 0% 4%);--fg: hsl(0 0% 98%);--muted: hsl(0 0% 64%);--hair: hsl(0 0% 16%);--hover: hsl(0 0% 9%);--chip: hsl(0 0% 12%);--beam: hsl(0 0% 100%);color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--fg);font-family:var(--sans);font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased}body{position:relative}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline;text-underline-offset:3px}.wrap{width:min(720px,calc(100% - 48px));margin-inline:auto}.wrap-lg{width:min(920px,calc(100% - 48px));margin-inline:auto}.site-header{position:sticky;top:0;z-index:20;height:64px;overflow:hidden;display:flex;align-items:center;border-bottom:1px solid var(--hair);background:color-mix(in srgb,var(--bg) 78%,transparent);backdrop-filter:blur(16px)}.site-header .wrap,.site-header .wrap-lg{display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;height:28px;overflow:hidden;font-weight:600;letter-spacing:-.03em;text-decoration:none}.brand:hover{text-decoration:none}.nav{display:flex;align-items:center;gap:4px;font-size:14px;color:var(--muted)}.nav a{position:relative;display:inline-flex;align-items:center;gap:6px;text-decoration:none;padding:6px 10px;border-radius:6px}.nav a:hover{color:var(--fg);background:var(--hover);text-decoration:none}.nav a[aria-current=page]{color:var(--fg)}.back-bar{padding-top:12px}.back-bar .wrap-lg{display:flex}.back-link{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--muted);text-decoration:none;padding:4px 0}.back-link:hover{color:var(--fg);text-decoration:none}.back-link .arrow-group{transform-box:fill-box;transform-origin:center}.back-link:hover .hi-back .arrow-group{animation:hi-back .4s ease}body:has(.back-bar) .hero{padding-top:20px}body:has(.back-bar) .page-head{padding-top:20px}body:has(.back-bar) article.post{padding-top:20px}.nav a[aria-current=page]:after{content:"";position:absolute;left:10px;right:10px;bottom:2px;height:1px;background:var(--fg);animation:grow-x .28s ease;transform-origin:left}.hero{display:flex;align-items:center;gap:28px;padding:48px 0 40px}.hero-screen{position:relative;min-height:calc(100svh - 64px);display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;padding:48px 24px 96px}.hero-copy{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;text-align:center}.hero-copy .shine{margin-bottom:18px}.hero-mark{margin:0;line-height:0}.hero-mark .sketch-duang{width:min(420px,78vw);height:auto}.childlike-mark{display:block;background:transparent}html.dark .childlike-mark{filter:invert(1)}.sketch-duang.is-brand{width:auto;height:28px;max-height:28px;object-fit:contain}.hero-screen p{margin:14px 0 0;color:var(--muted);font-size:16px}.scroll-cue{position:absolute;bottom:28px;z-index:1;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);text-decoration:none;animation:cue-float 2.2s ease-in-out infinite}.scroll-cue:hover{color:var(--fg);text-decoration:none}.home-rest{padding-bottom:88px}.home-block{padding-top:72px;scroll-margin-top:72px}.home-lead{margin:8px 0 28px;color:var(--muted)}.page-head{padding:48px 0 8px}.page-head h1,.page-title{margin:0;font-size:32px;letter-spacing:-.04em;font-weight:600}.page-title{display:flex;align-items:center;gap:12px}.page-title .text-reveal{margin:0;font-size:inherit}.kicker{margin:0 0 8px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}.empty{display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:28px 0 80px;color:var(--muted);border-top:1px solid var(--hair)}.empty p{margin:0}.hero h1{margin:0;font-size:32px;letter-spacing:-.04em;font-weight:600}.hero p{margin:8px 0 0;color:var(--muted);max-width:28rem}.feed{border-top:1px solid var(--hair)}.row{display:grid;grid-template-columns:104px 1fr auto;gap:16px;align-items:start;margin-inline:-12px;padding:18px 12px;border-bottom:1px solid var(--hair);text-decoration:none;color:inherit;border-radius:var(--radius);transition:background .18s ease,transform .18s ease}.row:hover{background:var(--hover);text-decoration:none;transform:translate(4px)}.row time{color:var(--muted);font-variant-numeric:tabular-nums;font-size:13px;padding-top:2px}.row strong{display:block;font-weight:500;letter-spacing:-.02em}.row span{display:block;margin-top:4px;color:var(--muted);font-size:13px}.row-go{color:var(--muted);opacity:0;transform:translate(-4px);transition:opacity .18s ease,transform .18s ease;padding-top:2px}.row:hover .row-go{opacity:1;transform:translate(0)}article.post{padding:48px 0 80px}article.post h1{margin:0 0 8px;font-size:32px;letter-spacing:-.04em;line-height:1.2}.post-lead{color:var(--muted);margin:0 0 8px}.post-meta{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:13px;margin-bottom:32px}.prose :is(h2,h3){margin-top:2em;letter-spacing:-.03em}.prose p{margin:1em 0}.prose ul,.prose ol{padding-left:1.25em}.prose li{margin:.35em 0}.prose blockquote{margin:1.25em 0;padding-left:1em;border-left:2px solid var(--hair);color:var(--muted)}.prose table{width:100%;border-collapse:collapse;font-size:14px}.prose th,.prose td{padding:8px 10px;border-bottom:1px solid var(--hair);text-align:left;vertical-align:top}.prose pre{overflow:auto;padding:16px;border:1px solid var(--hair);border-radius:var(--radius);background:var(--chip);font-size:13px;font-family:var(--mono)}.prose code{font-family:var(--mono);font-size:.9em}.prose :not(pre)>code{background:var(--chip);padding:.1em .35em;border-radius:4px}html.dark .astro-code,html.dark .astro-code span{color:var(--shiki-dark)!important;background-color:var(--shiki-dark-bg)!important}.tags{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 28px}.tags a{font-size:12px;color:var(--muted);border:1px solid var(--hair);border-radius:999px;padding:2px 8px;text-decoration:none;transition:background .16s ease,color .16s ease}.tags a:hover{background:var(--hover);color:var(--fg);text-decoration:none}.site-footer{border-top:1px solid var(--hair);padding:24px 0 40px;color:var(--muted);font-size:13px}.site-footer .wrap,.site-footer .wrap-lg{display:flex;justify-content:space-between;align-items:center}.footer-link{display:inline-flex;align-items:center;gap:6px}.about{padding:0 0 80px}.share-list{list-style:none;padding-left:0}.share-list li{display:flex;align-items:center;gap:10px;margin:.55em 0}.spotlight{pointer-events:none;position:fixed;inset:0;z-index:0;background:radial-gradient(88px circle at var(--x, 50%) var(--y, 180px),color-mix(in srgb,var(--fg) 6%,transparent),transparent 78%)}.typing{position:relative}.typing-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.typing-caret{display:inline-block;width:1.5px;height:.85em;margin-left:2px;background:currentColor;vertical-align:-.05em;animation:caret 1s step-end infinite}.typing.is-done .typing-caret{animation:none;opacity:0}.hero .typing{min-height:1.55em}.hero h1.typing{min-height:1.2em}.hero-screen p.typing{min-height:1.55em}.site-header,.wrap,.wrap-lg,.site-footer{position:relative;z-index:1}.blur-fade{animation:blur-fade .7s cubic-bezier(.16,1,.3,1) both;animation-delay:var(--d, 0ms)}.beam{position:relative}.beam:before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:conic-gradient(from var(--angle),transparent 55%,var(--beam),transparent 75%);animation:beam-spin 4s linear infinite;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}.shine{display:inline-block;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:transparent;background:linear-gradient(90deg,var(--muted) 0%,var(--fg) 50%,var(--muted) 100%);background-size:200% 100%;background-clip:text;-webkit-background-clip:text;animation:shine 3.2s linear infinite}.theme-toggle{width:32px;height:32px;margin-left:8px;border:1px solid var(--hair);border-radius:8px;background:var(--bg);color:var(--fg);display:grid;place-items:center;cursor:pointer;transition:background .16s ease,transform .16s ease}.theme-toggle:hover{background:var(--hover)}.theme-toggle:active{transform:scale(.96)}.theme-toggle .sketch-icon,.theme-toggle .hover-icon{width:16px;height:16px}html.dark .icon-sun{display:none}html:not(.dark) .icon-moon{display:none}.sketch-icon,.hover-icon{display:block;flex-shrink:0;color:currentColor;overflow:visible}.hover-icon *{transform-box:fill-box}.hi-home .house,.hi-home .door,.hi-user .user-avatar,.hi-sun .sun-center,.hi-moon .moon{transform-origin:center}.hi-home .door{transform-origin:center bottom}.hi-user .user-avatar{transition:transform .2s ease}.hi-book .book-line,.hi-file .file-fold,.hi-file .file-lines{stroke-dasharray:24;stroke-dashoffset:0}.nav a:hover .hi-home .roof{animation:hi-roof .4s ease-out}.nav a:hover .hi-home .house{animation:hi-house .3s ease-out 80ms both}.nav a:hover .hi-home .door{animation:hi-door .3s ease-out .2s both}.nav a:hover .hi-book .book-line-1{animation:hi-draw .3s ease 80ms both}.nav a:hover .hi-book .book-line-2{animation:hi-draw .3s ease .16s both}.nav a:hover .hi-book .book-line-3{animation:hi-draw .3s ease .24s both}.nav a:hover .hi-file .file-fold{animation:hi-draw .3s ease both}.nav a:hover .hi-file .file-lines{animation:hi-draw .4s ease .12s both}.nav a:hover .hi-user .user-avatar{transform:translateY(-1px) scale(1.06)}.theme-toggle:hover .hi-sun .sun-center{animation:hi-sun .4s ease}.theme-toggle:hover .hi-sun .sun-rays{animation:hi-rays .5s ease}.theme-toggle:hover .hi-moon .moon{animation:hi-moon .5s ease}@keyframes hi-roof{0%{transform:translateY(-2px);opacity:.55}to{transform:none;opacity:1}}@keyframes hi-house{0%{transform:scale(.94)}to{transform:none}}@keyframes hi-door{0%{transform:scaleY(0)}to{transform:none}}@keyframes hi-draw{0%{stroke-dashoffset:24;opacity:0}to{stroke-dashoffset:0;opacity:1}}@keyframes hi-sun{50%{transform:scale(.82)}}@keyframes hi-rays{50%{opacity:.4}}@keyframes hi-moon{40%{transform:rotate(-14deg) scale(1.08)}}@keyframes hi-back{40%{transform:translate(-3px)}}.reading-progress{position:fixed;top:0;left:0;z-index:40;height:2px;width:0;background:var(--fg);transform-origin:left}@property --angle{syntax: "<angle>"; inherits: false; initial-value: 0deg;}@keyframes blur-fade{0%{opacity:0;filter:blur(8px);transform:translateY(10px)}to{opacity:1;filter:blur(0);transform:none}}@keyframes grow-x{0%{transform:scaleX(0)}to{transform:scaleX(1)}}@keyframes beam-spin{to{--angle: 360deg}}@keyframes caret{50%{opacity:0}}.ripple{pointer-events:none;position:absolute;inset:0;display:grid;place-items:center}.ripple-ring{position:absolute;width:var(--s);height:var(--s);border-radius:50%;border:1px solid color-mix(in srgb,var(--fg) 18%,transparent);opacity:var(--o);animation:ripple 7s ease-out infinite;animation-delay:var(--d)}.ripple-ring.is-dashed{border-style:dashed}.marquee{overflow:hidden;border-block:1px solid var(--hair);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}.marquee-track{display:flex;width:max-content;animation:marquee 42s linear infinite}.marquee-item{display:flex;align-items:center;gap:28px;padding:14px 28px 14px 0;color:var(--muted);font-size:13px;letter-spacing:.04em;white-space:nowrap}.marquee-item i{display:block;width:4px;height:4px;border-radius:50%;background:var(--hair)}.marquee:hover .marquee-track{animation-play-state:paused}.topic-list{border-top:1px solid var(--hair)}.topic-row{display:grid;grid-template-columns:36px minmax(0,1fr) 40px;gap:16px;align-items:center;padding:18px 4px;border-bottom:1px solid var(--hair);text-decoration:none;color:inherit;transition:background .18s ease}.topic-row:hover{background:var(--hover);text-decoration:none}.topic-row.is-empty{color:var(--muted)}.topic-icon{display:grid;place-items:center;color:var(--fg)}.topic-row.is-empty .topic-icon{color:var(--muted)}.topic-main strong{display:block;font-weight:500;letter-spacing:-.03em}.topic-main em{display:block;margin-top:4px;font-style:normal;color:var(--muted);font-size:13px}.topic-count{font-variant-numeric:tabular-nums;font-size:13px;color:var(--muted);text-align:right}.text-reveal{margin:0;font-size:28px;letter-spacing:-.04em;font-weight:600}.text-reveal[data-pending]{opacity:0;filter:blur(8px);transform:translateY(10px)}.text-reveal.is-in{opacity:1;filter:none;transform:none;transition:opacity .6s cubic-bezier(.16,1,.3,1),filter .6s ease,transform .6s ease}@keyframes ripple{0%{transform:scale(.72);opacity:0}18%{opacity:var(--o)}to{transform:scale(1.12);opacity:0}}@keyframes marquee{to{transform:translate(-50%)}}@keyframes cue-float{0%,to{transform:translateY(0)}50%{transform:translateY(6px)}}@media(prefers-reduced-motion:reduce){.blur-fade,.beam:before,.shine,.nav a[aria-current=page]:after,.d-fill,.typing-caret,.ripple-ring,.marquee-track,.scroll-cue,.hover-icon *{animation:none}.hi-user .user-avatar,.row,.topic-row,.text-reveal{transition:none}.text-reveal[data-pending]{opacity:1;filter:none;transform:none}}@media(max-width:640px){.hero{flex-direction:column;align-items:flex-start;padding-top:32px}body:has(.back-bar) .hero{padding-top:16px}.row{grid-template-columns:1fr auto;gap:4px 12px}.row time{grid-column:1 / -1}.nav{gap:0}.nav a{padding:6px 8px}.nav-label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.topic-row{grid-template-columns:32px minmax(0,1fr) 32px;gap:10px}}.prose img{max-width:100%;height:auto}.demo-frame{display:block;width:100%;height:min(70vh,640px);margin:1.2em 0 1.6em;border:1px solid var(--hair);border-radius:var(--radius);background:var(--chip)}.prose .callout{margin:1.2em 0;padding:12px 16px;border:1px solid var(--hair);border-radius:var(--radius);background:var(--chip);color:var(--muted);font-size:14px}.prose .duang-whisper{margin:1.1em 0;padding:0 0 0 14px;border-inline-start:1px dashed var(--hair)}.prose .duang-whisper-jar-row{display:flex;align-items:flex-end;gap:8px;margin:0 0 8px}.prose .duang-whisper-jar{display:block;width:56px;height:auto;margin:0;border:0;background:transparent;user-select:none}html.dark .prose .duang-whisper-jar{filter:invert(1);opacity:.88}.prose img[src*=childlike-sketch]{background:transparent}.prose .duang-whisper-jar-note{font-family:var(--mono);font-size:11px;letter-spacing:.04em;color:var(--muted);padding-bottom:2px}.prose .duang-whisper-body{margin:0;font-size:13px;line-height:1.6;color:var(--muted)}.prose .duang-whisper-sign{margin:6px 0 0;font-size:13px;font-style:italic;color:var(--fg)}.prose .marginalia{margin:1em 0;padding:0 0 0 14px;border-inline-start:1px dashed var(--hair);font-size:13px;line-height:1.6;color:var(--muted)}.prose .marginalia.interview{border-inline-start-style:solid}.prose .marginalia summary{cursor:pointer;list-style:none;width:fit-content;color:var(--fg)}.prose .marginalia summary::-webkit-details-marker{display:none}.prose .marginalia summary:before{content:"+ 边注 "}.prose .marginalia[open] summary:before{content:"− 边注 "}.prose .marginalia.interview summary:before{content:"+ 面试重点 "}.prose .marginalia.interview[open] summary:before{content:"− 面试重点 "}.prose .marginalia .marginalia-body{display:block;margin-top:6px}.article-embed-note{margin:1.25rem 0 1.45rem;padding:16px;border:1px dashed var(--hair);border-radius:var(--radius);background:var(--chip)}.article-embed-note-title{margin:0 0 10px;font-size:15px;font-weight:600}.article-embed-note-lead,.article-embed-note-foot{margin:0 0 12px;font-size:13px;line-height:1.6;color:var(--muted)}.article-embed-note-foot{margin:12px 0 0;padding-top:10px;border-top:1px dashed var(--hair)}.article-diagram-head{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0 0 10px}.article-diagram-head>span{display:block;border:1px solid var(--hair);border-radius:6px;background:var(--bg);padding:6px 8px;font-size:12px;text-align:center;color:var(--muted)}.article-flow-stack{display:grid;gap:8px}.article-flow-row{border:1px solid var(--hair);border-radius:6px;background:var(--bg);padding:8px 10px}.article-flow-row p{margin:0;font-size:13px;line-height:1.6}.article-flow-row p+p{margin-top:4px;color:var(--muted)}.article-flow-row.is-client{border-inline-start:3px solid var(--fg)}.article-flow-row.is-server{border-inline-start:3px dashed var(--muted)}.article-compare-table th:first-child,.article-compare-table td:first-child{width:6.4rem;color:var(--muted);font-size:12px}.mixup-figure .mixup-scene,.perf-figure .perf-scene{margin:0;padding:6px 2px 2px;overflow-x:auto}.mixup-svg,.perf-svg{display:block;width:100%;max-width:40rem;height:auto;margin-inline:auto}.mixup-panel,.mixup-chip,.mixup-lane,.perf-chip,.perf-panel{fill:var(--bg);stroke:var(--fg);stroke-width:1.15}.mixup-panel.is-accent,.mixup-chip.is-accent,.mixup-lane.is-accent{fill:var(--chip)}.mixup-panel.is-soft{fill:var(--chip);stroke-dasharray:3 3}.mixup-title,.perf-chip-title,.perf-panel-title{fill:var(--fg);font-size:14px;font-weight:600;font-family:var(--sans)}.mixup-sub,.mixup-caption,.mixup-label,.perf-chip-sub,.perf-panel-sub,.perf-caption,.perf-label{fill:var(--muted);font-size:11.5px;font-family:var(--mono)}.mixup-ring,.mixup-guide{fill:none;stroke:var(--hair);stroke-width:1.1;stroke-dasharray:4 3}.mixup-fill,.mixup-pipe,.mixup-bar,.perf-bar,.perf-hbar,.perf-batch,.perf-dot{fill:var(--chip);stroke:var(--hair)}.mixup-fill.is-warm,.mixup-bar.is-heavy,.perf-bar.is-tail,.perf-hbar.is-tail,.mixup-dot,.perf-dot.is-live,.perf-swatch.is-live{fill:var(--fg)}.mixup-dot.is-wait,.perf-dot.is-wait,.perf-swatch.is-wait{fill:var(--muted);opacity:.55}.mixup-dot.is-io{fill:var(--muted)}.mixup-lock,.mixup-arrow,.perf-avg-line,.perf-axis{fill:none;stroke:var(--fg);stroke-width:1.4;stroke-linecap:round}.btree-scene{position:relative;margin:4px 0;padding:12px 8px 6px;border:1px solid var(--hair);border-radius:var(--radius);background:var(--chip);overflow:hidden}.btree-svg{display:block;width:100%;height:auto}.btree-svg .btree-ink{fill:none;stroke:var(--muted);stroke-width:1.55;stroke-linecap:round;stroke-linejoin:round}.btree-svg .btree-ink-soft,.btree-svg .btree-scatter{fill:none;stroke:var(--hair);stroke-width:1.15;stroke-dasharray:3.5 3}.btree-svg .btree-leaf-link,.btree-svg .btree-path{fill:none;stroke:var(--fg);stroke-width:1.55}.btree-svg .btree-node{fill:var(--bg);stroke:var(--fg);stroke-width:1.35}.btree-svg .btree-label,.btree-svg .btree-mono,.btree-svg .btree-badge-text{fill:var(--fg);font-size:11px;font-family:var(--sans)}.btree-svg .btree-sub{fill:var(--muted);font-size:9.5px;font-family:var(--sans)}.btree-svg .btree-range-band{fill:var(--chip);stroke:var(--hair)}.btree-demo-bar{display:flex;align-items:center;gap:8px;margin:4px 0 8px}.btree-demo-play{appearance:none;border:1px solid var(--hair);background:var(--bg);color:var(--fg);border-radius:999px;padding:4px 12px;font-size:12px;cursor:pointer}.btree-demo-status{margin:0;font-size:13px;color:var(--muted)}.mermaid-wrap,.prose pre.mermaid{margin:1.25em 0;padding:16px 12px;overflow-x:auto;border:1px solid var(--hair);border-radius:var(--radius);background:var(--chip)}.mermaid-wrap svg,.prose pre.mermaid svg{display:block;max-width:100%;height:auto;margin-inline:auto}html.dark .prose pre.mermaid svg,html.dark .mermaid-wrap svg{filter:invert(1)}.series-nav-card{margin:1.1rem 0 1.4rem;padding:4px 16px;border:1px solid var(--hair);border-inline-start:3px solid var(--fg);background:var(--chip)}.series-nav-card>blockquote{margin:10px 0;padding:0;border:none;background:transparent}