@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;500;600;700;800;900&display=swap');
:root{--ink:#172c26;--muted:#68746e;--accent:#254d3e;--lime:#dbefac;--paper:#fff;--soft:#f3f6f3;--line:#e2e8e2;--mono:ui-monospace,SFMono-Regular,Consolas,monospace}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;color:var(--ink);background:var(--paper);font-family:'Noto Sans SC',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;font-size:1rem;line-height:1.7;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,a{-webkit-tap-highlight-color:transparent}a:focus-visible{outline:3px solid #86a552;outline-offset:6px;border-radius:3px}::selection{color:#18352a;background:var(--lime)}.wrap{width:min(1180px,calc(100% - 96px));margin:auto}.skip{position:fixed;top:-100px;left:20px;padding:12px;background:var(--lime);z-index:10}.skip:focus{top:16px}.site-header{height:108px;display:flex;align-items:center;justify-content:space-between;gap:30px;border-bottom:1px solid var(--line)}.brand{display:inline-flex;gap:13px;align-items:center;font-size:1.125rem;font-weight:700;letter-spacing:.025em}.brand-mark{font-family:var(--mono);display:grid;place-items:center;width:40px;height:40px;border-radius:10px;background:var(--ink);color:var(--lime);font-size:1.6875rem;letter-spacing:-3px;padding-right:3px;line-height:1}.nav{display:flex;align-items:center;gap:36px;font-size:0.875rem;color:var(--muted)}.nav a{position:relative;padding:15px 0}.nav a:hover,.nav a[aria-current=page]{color:var(--ink)}.nav a[aria-current=page]:after{content:'';position:absolute;left:0;right:0;bottom:4px;height:2px;background:var(--accent)}.nav-about{display:flex;gap:8px;align-items:center}.nav-about span{font-size:1.25rem}.intro{padding:67px 0 61px;display:grid;grid-template-columns:1fr 270px;align-items:end;gap:40px}.eyebrow{font:0.75rem/1.6 var(--mono);letter-spacing:.12em;color:var(--muted);text-transform:uppercase;display:flex;align-items:center;gap:12px}.eyebrow:before{content:'';width:22px;height:1px;background:currentColor}.intro h1{font-size:clamp(36px,4.4vw,56px);line-height:1.4;letter-spacing:-.045em;margin:20px 0 20px;font-weight:800}.intro h1 em{font-style:normal;color:#648268}.intro p{margin:0;color:var(--muted);font-size:1rem;line-height:1.9}.intro-aside{padding:0 0 6px 25px;border-left:1px solid var(--line)}.intro-aside .code{font-family:var(--mono);font-size:0.8125rem;color:#809083;margin-bottom:11px}.intro-aside p{font-size:0.875rem;line-height:2.1;color:#526458}.intro-aside strong{font-weight:500;color:var(--ink)}.feature-layout{display:grid;grid-template-columns:minmax(0,1fr) 302px;gap:26px}.featured{position:relative;display:flex;flex-direction:column;min-height:355px;padding:34px 38px;border-radius:6px;background:#214638;color:#fff;overflow:hidden;transition:background .2s}.featured:hover{background:#183b2d}.featured .feature-top{display:flex;align-items:center;justify-content:space-between;font-size:0.8125rem;color:#c3d4c4}.featured .feature-top span:first-child{display:inline-flex;align-items:center;gap:9px}.tiny-line{height:1px;width:19px;background:var(--lime);display:inline-block}.featured h2{font-size:2.125rem;letter-spacing:-.025em;line-height:1.6;font-weight:600;max-width:550px;margin:25px 0 12px}.featured p{font-size:0.9375rem;line-height:1.9;color:#cad8cc;margin:0;max-width:540px}.feature-bottom{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:26px}.meta{display:flex;flex-wrap:wrap;align-items:center;gap:12px;font-size:0.75rem;font-family:var(--mono);color:var(--muted)}.featured .meta{color:#c3d4c4}.meta .divider{width:3px;height:3px;border-radius:50%;background:currentColor}.round-arrow{width:41px;height:41px;border:1px solid #7e9a7c;border-radius:50%;display:grid;place-items:center;font-size:1.375rem;transition:transform .2s}.featured:hover .round-arrow{transform:translateX(3px)}.profile{padding:30px 28px;background:var(--soft);border-radius:6px;display:flex;flex-direction:column}.profile-title{display:flex;justify-content:space-between;align-items:center}.profile .profile-label{font:0.75rem var(--mono);letter-spacing:.1em;color:var(--muted)}.avatar{font-size:1.1875rem;font-weight:700;width:48px;height:48px;display:grid;place-items:center;border:1px solid #becfbf;border-radius:50%;background:#e6ece3}.profile h2{font-size:1.3125rem;font-weight:600;margin:19px 0 9px}.profile p{font-size:0.875rem;color:var(--muted);margin:0;line-height:1.95}.tags{display:flex;gap:7px;flex-wrap:wrap;margin-top:19px}.tag{font-size:0.75rem;padding:2px 8px;border:1px solid #d6dfd4;border-radius:3px;color:#52624f}.text-link{display:inline-flex;align-items:center;gap:12px;font-size:0.875rem}.profile .text-link{margin-top:auto;padding-top:24px;align-self:flex-start}.text-link:hover{color:#507641}.recent{padding:56px 0 30px}.section-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}.section-heading h2{font-size:1.4375rem;letter-spacing:-.025em;margin:0;font-weight:600}.section-heading h2 span{font:0.75rem var(--mono);color:var(--muted);margin-left:12px;vertical-align:middle}.section-heading .text-link{color:var(--muted)}.post-list{border-top:1px solid var(--line)}.post-row{display:grid;grid-template-columns:160px 1fr 40px;gap:30px;padding:29px 0;border-bottom:1px solid var(--line);transition:background .2s}.post-row:hover{background:#f8faf7}.post-side{display:flex;flex-direction:column;align-items:flex-start;gap:9px;padding-top:5px}.category{font-size:0.8125rem;color:#48694a}.post-side time{font:0.75rem/1.8 var(--mono);color:#849087}.post-row h3{font-size:1.3125rem;line-height:1.6;margin:0 0 7px;font-weight:600;letter-spacing:-.02em}.post-row p{margin:0;font-size:0.875rem;line-height:1.9;color:var(--muted)}.row-arrow{font-size:1.4375rem;color:#72816f;align-self:center;justify-self:end;transition:transform .2s}.post-row:hover .row-arrow{transform:translateX(4px)}.sample-note{display:flex;align-items:flex-start;gap:10px;margin-top:25px;font-size:0.75rem;color:#849087;line-height:1.8}.sample-note .mark{font-family:var(--mono);border:1px solid #c9d5c5;width:16px;height:16px;border-radius:50%;display:grid;place-items:center;flex:none;margin-top:2px;font-size:0.625rem}.site-footer{border-top:1px solid var(--line);margin-top:46px;padding:27px 0 32px;display:flex;align-items:center;justify-content:space-between;gap:20px}.footer-brand{font-size:0.875rem;font-weight:500}.footer-sub{font:0.75rem var(--mono);color:#7c897e}.footer-right{display:flex;gap:20px;align-items:center}.footer-right a{font-size:0.75rem;color:var(--muted)}.page-intro{padding:62px 0 38px}.page-intro h1{font-size:2.75rem;line-height:1.5;letter-spacing:-.03em;margin:15px 0}.page-intro p{color:var(--muted);max-width:640px}.category-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.category-block{border:1px solid var(--line);border-radius:6px;padding:28px}.category-block .category-number{font:0.75rem var(--mono);color:var(--muted)}.category-block h2{font-size:1.5rem;margin:12px 0 5px}.category-block p{font-size:0.875rem;line-height:1.9;color:var(--muted);margin:0 0 27px}.category-article{display:flex;gap:15px;align-items:center;justify-content:space-between;padding-top:20px;border-top:1px solid var(--line);font-size:0.9375rem;line-height:1.8}.category-article:hover{color:#537a40}.category-article span{flex:none}.about-layout{display:grid;grid-template-columns:1fr 300px;gap:85px;padding:10px 0 36px}.about-copy h2{font-size:1.4375rem;line-height:1.6;margin:30px 0 15px}.about-copy p{font-size:1rem;line-height:2;color:#56625b;max-width:720px}.about-copy p:first-child{margin-top:0}.about-panel{background:var(--soft);border-radius:6px;padding:28px;align-self:start}.about-panel .avatar{width:72px;height:72px;font-size:1.75rem}.about-panel h2{font-size:1.375rem;margin:22px 0 3px}.about-panel p{color:var(--muted);font-size:0.875rem}.about-panel .code{font:0.8125rem var(--mono);padding:25px 0 0;border-top:1px solid #dce4d9;margin-top:25px}.principles{display:grid;gap:17px}.principle{display:flex;gap:18px;align-items:baseline;padding-bottom:15px;border-bottom:1px solid var(--line)}.principle span{font:0.75rem var(--mono);color:#87927e}.principle p{margin:0}.back-link{display:inline-flex;gap:10px;align-items:center;color:var(--muted);font-size:0.875rem;margin-top:35px}.back-link:hover{color:var(--ink)}.article-shell{display:grid;grid-template-columns:minmax(0,780px) 200px;gap:80px;align-items:start}.article-header{padding:35px 0 30px;border-bottom:1px solid var(--line);margin-bottom:30px}.article-labels{display:flex;gap:12px;align-items:center}.sample-badge{font-size:0.75rem;border:1px solid var(--line);padding:0 6px;border-radius:3px;color:var(--muted)}.article-header h1{font-size:2.5rem;line-height:1.55;letter-spacing:-.035em;margin:19px 0}.article-deck{color:var(--muted);font-size:1.0625rem;line-height:1.9;margin:15px 0 22px}.article-body{color:#3f5047;font-size:1.0625rem;line-height:2}.article-body p{margin:0 0 23px}.article-body h2{font-size:1.625rem;line-height:1.6;letter-spacing:-.02em;color:var(--ink);margin:40px 0 17px}.article-body ul,.article-body ol{padding-left:24px;margin:20px 0 25px}.article-body li{padding-left:5px;margin:10px 0}.article-body strong{color:var(--ink);font-weight:600}.article-body blockquote{margin:28px 0;padding:20px 25px;border-left:3px solid #719562;background:var(--soft);color:#355339;font-size:1.125rem}.article-body blockquote p:last-child{margin:0}.article-body code{font-family:var(--mono);font-size:.85em;background:#eff3ed;border-radius:4px;padding:2px 5px}.article-body pre{padding:24px;border-radius:6px;background:#1f332b;color:#dfebda;line-height:1.9;font-size:0.875rem;overflow:auto;margin:25px 0}.article-body pre code{font-size:inherit;padding:0;background:none;color:inherit}.article-body a{color:#3f7037;text-decoration:underline;text-underline-offset:4px;overflow-wrap:anywhere}.article-body .table-wrap{overflow:auto;margin:25px 0}.article-body table{width:100%;border-collapse:collapse;font-size:0.9375rem;min-width:480px}.article-body th,.article-body td{text-align:left;padding:13px 14px;border:1px solid var(--line)}.article-body th{background:var(--soft);font-weight:500}.article-body .diagram{border:1px solid var(--line);border-radius:5px;padding:24px;display:flex;gap:15px;align-items:center;justify-content:center;font-size:0.875rem;line-height:1.6;margin:25px 0}.diagram .node{border:1px solid #c1d0b9;padding:13px 17px;text-align:center;border-radius:4px;background:#f3f6ef}.diagram .node small{display:block;color:var(--muted);font-size:0.75rem;margin-top:3px}.toc{position:sticky;top:35px;margin-top:46px;border-left:1px solid var(--line);padding-left:25px}.toc h2{font:0.75rem var(--mono);letter-spacing:.1em;color:var(--muted);margin:0 0 19px}.toc a{display:block;color:var(--muted);font-size:0.875rem;line-height:1.8;margin:14px 0}.toc a:hover{color:var(--ink)}.article-end{margin-top:45px;padding:22px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;align-items:center;font-size:0.875rem}.article-end p{color:var(--muted);font-size:0.75rem;margin:0}.article-end .author{display:flex;gap:12px;align-items:center}.article-end .avatar{width:38px;height:38px;font-size:0.9375rem}.article-siblings{display:flex;justify-content:space-between;gap:30px;margin:30px 0 45px}.article-siblings a{font-size:0.875rem;max-width:45%}.article-siblings span{display:block;font-size:0.75rem;color:var(--muted);margin-bottom:6px}.article-siblings a:last-child{text-align:right}.sources{font-size:0.875rem;padding-top:5px}.sources h2{font-size:1.25rem}.sources p{font-size:0.875rem}.not-found{padding:100px 0;max-width:650px}.not-found h1{font-size:2.875rem;margin:10px 0}.not-found p{color:var(--muted)}
@media(min-width:1500px){.wrap{width:1220px}.intro{padding-top:78px;padding-bottom:70px}}
@media(max-width:1000px){.wrap{width:calc(100% - 64px)}.intro{grid-template-columns:1fr 215px;gap:25px}.intro-aside{padding-left:20px}.feature-layout{grid-template-columns:1fr 270px;gap:20px}.featured{padding:30px}.featured h2{font-size:1.8125rem}.profile{padding:26px 24px}.article-shell{grid-template-columns:minmax(0,1fr) 170px;gap:35px}.article-header h1{font-size:2.125rem}.about-layout{gap:40px;grid-template-columns:1fr 270px}.post-row{grid-template-columns:120px 1fr 30px;gap:20px}}
@media(max-width:760px){.wrap{width:calc(100% - 40px)}.site-header{height:86px;gap:15px}.brand{font-size:0.9375rem;gap:9px;letter-spacing:0}.brand-mark{width:32px;height:32px;font-size:1.4375rem;border-radius:8px}.nav{gap:20px;font-size:0.8125rem}.nav-about span{display:none}.intro{grid-template-columns:1fr;padding:43px 0 35px}.intro h1{font-size:2.375rem;line-height:1.5;margin-top:18px}.intro p{font-size:0.875rem}.intro-aside{display:none}.feature-layout{grid-template-columns:1fr}.featured{min-height:330px;padding:28px}.featured h2{font-size:1.8125rem;margin-top:24px}.featured p{font-size:0.875rem}.profile{display:none}.recent{padding-top:36px}.section-heading h2{font-size:1.3125rem}.section-heading .text-link{font-size:0.8125rem}.post-row{grid-template-columns:1fr 24px;gap:9px 18px;padding:25px 0}.post-side{grid-column:1/3;flex-direction:row;align-items:center;gap:14px;padding:0}.post-row h3{font-size:1.1875rem}.post-row p{font-size:0.875rem}.row-arrow{font-size:1.25rem}.site-footer{flex-direction:column;align-items:flex-start;gap:13px;margin-top:35px}.footer-right{width:100%;justify-content:space-between}.category-grid{grid-template-columns:1fr}.page-intro{padding-top:40px}.page-intro h1{font-size:2.25rem}.category-block{padding:24px}.about-layout{grid-template-columns:1fr;gap:20px}.about-panel{order:-1;display:none}.about-copy p{font-size:1rem}.article-shell{display:block}.toc{display:none}.article-header{padding-top:26px}.article-header h1{font-size:1.9375rem;line-height:1.6}.article-deck{font-size:1rem}.article-body{font-size:1rem;line-height:2}.article-body h2{font-size:1.4375rem}.article-body pre{font-size:0.75rem;padding:18px}.article-body .diagram{padding:18px 10px;gap:8px;font-size:0.8125rem;flex-wrap:wrap}.diagram .node{padding:10px}.article-body blockquote{font-size:1.0625rem;padding:18px}.article-end{align-items:flex-start}.article-end>.text-link{font-size:0.75rem}.article-siblings{gap:20px}.article-siblings a{font-size:0.8125rem}}
@media(max-width:380px){.wrap{width:calc(100% - 32px)}.brand-name{font-size:0.8125rem}.nav{gap:14px}.intro h1{font-size:2.0625rem}.featured{padding:25px}.featured h2{font-size:1.625rem}.section-heading .text-link{font-size:0.75rem}.article-header h1{font-size:1.75rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}