:root{
--paper:#F6F4EE;--white:#FFFFFF;--ink:#0F1416;--muted:#5F5B50;--hair:rgba(15,20,22,.1);--line:rgba(15,20,22,.12);
--primary:#2C6E7F;--primary-deep:#235968;--accent:#4FB3A9;
--stone:#EEEAE0;--stone-ink:#1C1A15;--stone-muted:#5E594C;
--sand:#E9E2D6;--sand-ink:#2A2218;--sand-muted:#65594A;
--fog:#E4E7EC;--fog-ink:#1B2330;--fog-muted:#545E6E;
--clay:#F1E4DC;--clay-ink:#3A2219;--clay-muted:#715040;
--night:#0F1416;--night-card:#172024;--night-code:#0A0E10;--night-ink:#F6F4EE;--night-muted:#A7B3B7;--night-hair:rgba(246,244,238,.14);
--input-line:#827E73;--focus:#2C6E7F;
--f-head:"Bricolage Grotesque","Avenir Next",-apple-system,"Segoe UI Variable Display","Helvetica Neue","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
--f-body:"Chivo",-apple-system,"Helvetica Neue","Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",Arial,sans-serif;
--f-mono:"JetBrains Mono","SF Mono",ui-monospace,Menlo,Consolas,-apple-system,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",monospace;
--text-xs:.75rem;--text-sm:.875rem;--text-base:1rem;--text-lg:1.25rem;--text-read:1.5rem;--text-xl:2rem;--text-display:3.5rem;
--lh-tight:1.15;--lh-title:1.35;--lh-body:1.6;--lh-code:1.7;
--space-1:.5rem;--space-2:1rem;--space-3:1.5rem;--space-4:2rem;--space-5:2.5rem;--space-6:3rem;--space-7:4.5rem;--space-8:7.5rem;
--space-close:7.5rem;--field-gap:.5rem;--gutter:3rem;--hero-top:3rem;--hero-crumb-top:3rem;--crumb-gap:1.5rem;
--radius-sm:10px;--radius-md:16px;--radius-lg:24px;--radius-pill:999px;--r-sm:10px;--r-md:16px;--r-lg:24px;
--width-read:48rem;--width-standard:80rem;--width-wide:96rem;
--shadow-input:0 24px 48px -24px rgba(42,34,24,.28);
--duration:200ms;--ease:cubic-bezier(.2,.7,.2,1);--header-height:72px;--z-header:100;--z-menu:110
}
*,*::before,*::after{box-sizing:border-box}
*{margin:0;padding:0}
html{background:var(--paper);scroll-padding-top:8rem}
body{font-family:var(--f-body);font-size:var(--text-base);line-height:var(--lh-body);color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased}
main{overflow-x:clip}
h1,h2,h3,h4,h5,h6{font-family:var(--f-head);font-weight:600;letter-spacing:-.02em;overflow-wrap:break-word}
h1{font-size:var(--text-display);line-height:var(--lh-tight)}
h2{font-size:var(--text-display);line-height:var(--lh-tight);font-weight:500}
h3{font-size:var(--text-lg);line-height:var(--lh-title)}
h4{font-size:var(--text-base);line-height:var(--lh-title)}
h5{font-size:var(--text-sm);line-height:var(--lh-title)}
h6{font-size:var(--text-xs);line-height:var(--lh-title)}
p,li,figcaption,blockquote,dt,dd,label{font-size:var(--text-base);line-height:var(--lh-body)}
small{font-size:var(--text-xs);line-height:var(--lh-body)}
th,td{font-size:var(--text-sm);line-height:var(--lh-body)}
code{font-family:var(--f-mono);font-size:var(--text-sm);line-height:var(--lh-code);font-variant-numeric:tabular-nums}
pre{max-width:100%;overflow-x:auto;font-family:var(--f-mono);font-size:var(--text-sm);line-height:var(--lh-code);tab-size:2}
pre code{display:block;width:max-content;min-width:100%;font-size:var(--text-sm);line-height:var(--lh-code)}
a{color:inherit;text-decoration:none}
a,button,input,select,textarea{touch-action:manipulation}
button,input,select,textarea{font-family:var(--f-body);font-size:var(--text-base);line-height:var(--lh-body)}
button{cursor:pointer}
button,select{text-transform:none}
img{display:block;max-width:100%;height:auto}
svg{flex:none;vertical-align:middle}
fieldset{border:0;min-width:0}
legend{font-size:var(--text-base);line-height:var(--lh-body)}
table{border-collapse:collapse}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--focus);outline-offset:4px}
::selection{background:var(--primary);color:var(--white)}
.container,.wrap,.container-wide,.container-read{width:100%;margin-inline:auto;padding-inline:var(--gutter)}
.container,.wrap{max-width:var(--width-standard)}
.container-wide{max-width:var(--width-wide)}
.container-read{max-width:var(--width-read)}
.grid{display:grid;gap:var(--space-3);align-items:stretch}
.grid>*{min-width:0}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid-auto{grid-template-columns:repeat(auto-fit,minmax(min(100%,16rem),1fr))}
.stack{display:flex;flex-direction:column;gap:var(--space-3)}
.stack>*{min-width:0}
.cluster{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-2)}
.mono,.numeric{font-family:var(--f-mono);font-variant-numeric:tabular-nums}
.muted{color:var(--muted)}
.text-sm{font-size:var(--text-sm);line-height:var(--lh-body)}
.text-xs{font-size:var(--text-xs);line-height:var(--lh-body)}
.text-lg{font-size:var(--text-lg);line-height:1.5}
.mt-2{margin-top:var(--space-2)}
.mt-3{margin-top:var(--space-3)}
.mt-4{margin-top:var(--space-4)}
.mt-6{margin-top:var(--space-6)}
.mt-7{margin-top:var(--space-7)}
.gap-1{gap:var(--space-1)}
.gap-3{gap:var(--space-3)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
:where(.reading){max-width:var(--width-read);padding:var(--space-5);background:var(--white);color:#0F1416;border-radius:var(--radius-lg)}
.reading h2,.reading h3{font-size:var(--text-read);line-height:var(--lh-title);margin-block:var(--space-5) var(--space-2)}
.reading p,.reading ul,.reading ol,.reading pre,.reading blockquote,.reading .table-scroll{margin-block:var(--space-3)}
.reading ul,.reading ol{padding-inline-start:var(--space-3)}
.reading a{color:var(--primary);text-decoration:underline;text-underline-offset:.2em}
:where(main>section:last-child){padding-bottom:var(--space-close)}
@media(min-width:80rem){
body::before{content:"";position:fixed;inset-block:0;left:calc(50% - 640px);width:1280px;border-inline:1px solid rgba(120,112,92,.16);pointer-events:none;z-index:40}
}
@media(max-width:64rem){
:root{--gutter:2rem;--space-8:5rem;--space-close:5rem}
.grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:42rem){
:root{--gutter:1.5rem;--text-display:2.5rem;--space-7:3rem;--space-8:4rem;--space-close:4rem}
.grid-2,.grid-3{grid-template-columns:minmax(0,1fr)}
.reading{padding:var(--space-3)}
}
@media(prefers-reduced-motion:reduce){
*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}