:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--font-body:ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;--font-display:"Iowan Old Style", "Palatino Linotype", "Songti SC", "Noto Serif CJK SC", "SimSun", serif;--font-mono:ui-monospace, "SFMono-Regular", Consolas, "Liberation Mono", monospace;--text-caption:.8125rem;--text-small:.875rem;--text-body:clamp(1rem, .96rem + .2vw, 1.125rem);--text-h3:clamp(1.25rem, 1.19rem + .3vw, 1.4375rem);--text-h2:clamp(1.625rem, 1.345rem + 1.4vw, 2.5rem);--text-h1:clamp(2.25rem, 1.69rem + 2.8vw, 4rem);--text-display:clamp(2.75rem, 2.03rem + 3.6vw, 5rem);--leading-display:1.22;--leading-heading:1.3;--leading-body:1.8;--leading-small:1.6;--weight-regular:400;--weight-medium:500;--weight-heading:600;--tracking-display:-.035em;--tracking-heading:-.025em;--tracking-body:0;--space-0:0;--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-6:1.5rem;--space-8:2rem;--space-12:3rem;--space-16:4rem;--space-24:6rem;--space-32:8rem;--gutter:clamp(1.25rem, .65rem + 3vw, 3rem);--section-space:clamp(3rem, 2rem + 5vw, 6rem);--content-wide:75rem;--content-reading:65ch;--content-reading-cjk:36em;--border-width:1px;--border-strong-width:2px;--radius-none:0;--radius-sm:.25rem;--radius-md:.5rem;--radius-lg:.75rem;--radius-pill:999px;--shadow-none:none;--shadow-popover:0 4px 16px #21201c1a, 0 1px 3px #21201c0f;--shadow-dialog:0 16px 48px #21201c29;--duration-instant:0s;--duration-fast:.12s;--duration-base:.2s;--duration-slow:.28s;--ease-out:cubic-bezier(.16, 1, .3, 1);--ease-in-out:cubic-bezier(.65, 0, .35, 1);--spring-mass:1;--spring-stiffness:300;--spring-damping:34.7;--breakpoint-sm:40rem;--breakpoint-md:48rem;--breakpoint-lg:64rem;--breakpoint-xl:80rem;--control-min:2.75rem;--background:#fdfdfc;--surface:#f9f9f8;--text-primary:#21201c;--text-secondary:#63635e;--muted:#63635e;--border:#dad9d6;--border-control:#82827c;--accent:#1e7a61;--accent-foreground:#fff;--accent-hover:#1d3b31;--surface-hover:#f1f0ef;--selection:#c3e9d7;--selection-text:#1d3b31;--focus-ring:#1e7a61}[data-theme=light]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--background:#fdfdfc;--surface:#f9f9f8;--text-primary:#21201c;--text-secondary:#63635e;--muted:#63635e;--border:#dad9d6;--border-control:#82827c;--accent:#1e7a61;--accent-foreground:#fff;--accent-hover:#1d3b31;--surface-hover:#f1f0ef;--selection:#c3e9d7;--selection-text:#1d3b31;--focus-ring:#1e7a61}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--background:#111110;--surface:#191918;--text-primary:#eeeeec;--text-secondary:#b5b3ad;--muted:#b5b3ad;--border:#3b3a37;--border-control:#7c7b74;--accent:#1fd8a4;--accent-foreground:#0d1512;--accent-hover:#adf0d4;--surface-hover:#222221;--selection:#114837;--selection-text:#adf0d4;--focus-ring:#1fd8a4;--shadow-popover:0 4px 16px #00000047, 0 1px 3px #0003;--shadow-dialog:0 16px 48px #0006}}[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--background:#111110;--surface:#191918;--text-primary:#eeeeec;--text-secondary:#b5b3ad;--muted:#b5b3ad;--border:#3b3a37;--border-control:#7c7b74;--accent:#1fd8a4;--accent-foreground:#0d1512;--accent-hover:#adf0d4;--surface-hover:#222221;--selection:#114837;--selection-text:#adf0d4;--focus-ring:#1fd8a4;--shadow-popover:0 4px 16px #00000047, 0 1px 3px #0003;--shadow-dialog:0 16px 48px #0006}@media (prefers-reduced-motion:reduce){:root{--duration-fast:0s;--duration-base:0s;--duration-slow:0s}}*{box-sizing:border-box}html{scroll-padding-block:var(--space-8)}body{background:var(--background);color:var(--text-primary);font:var(--weight-regular) var(--text-body)/var(--leading-body) var(--font-body);margin:0}::selection{background:var(--selection);color:var(--selection-text)}button,select{font:inherit}a{color:var(--accent);text-underline-offset:.22em;text-decoration-thickness:1px}a:hover{color:var(--accent-hover)}:where(a,button,select,summary):focus-visible{outline:2px solid var(--focus-ring);outline-offset:4px}h1,h2,h3,p{margin:0}h1,h2,h3{font-weight:var(--weight-heading);line-height:var(--leading-heading);letter-spacing:var(--tracking-heading);text-wrap:balance}h1{font-size:var(--text-h1)}h2{font-size:var(--text-h2)}h3{font-size:var(--text-h3)}:lang(zh-CN) :is(h1,h2,h3){letter-spacing:0}code{font:.85em/1.6 var(--font-mono);overflow-wrap:anywhere}.shell{width:min(100% - 2 * var(--gutter), var(--content-wide));margin-inline:auto}.skip{top:var(--space-4);left:var(--gutter);z-index:2;padding:var(--space-2) var(--space-4);background:var(--background);position:absolute;transform:translateY(-200%)}.skip:focus{transform:none}.masthead{justify-content:space-between;align-items:center;gap:var(--space-4);padding-block:var(--space-6);border-bottom:1px solid var(--border);flex-wrap:wrap;display:flex}.wordmark{color:var(--text-primary);font:500 1.625rem/1.4 var(--font-display);letter-spacing:-.04em;text-decoration:none}.header-tools,nav{align-items:center;gap:var(--space-6);flex-wrap:wrap;display:flex}nav a{color:var(--text-secondary);font-size:var(--text-small);padding-block:var(--space-2);text-decoration:none}.theme-control{align-items:center;gap:var(--space-2);font-size:var(--text-small);color:var(--text-secondary);display:flex}select{min-height:var(--control-min);padding:var(--space-2) var(--space-8) var(--space-2) var(--space-3);border:1px solid var(--border-control);border-radius:var(--radius-sm);background:var(--background);color:var(--text-primary)}.intro{padding-block:var(--section-space)}.intro h1{max-width:11em;font:400 var(--text-display)/var(--leading-display) var(--font-display);letter-spacing:.01em}.intro-copy{max-width:32em;color:var(--text-secondary);margin-top:var(--space-8)}.intro-note{margin-top:var(--space-6);color:var(--muted);font-size:var(--text-caption)}.section{padding-block:var(--section-space);border-top:1px solid var(--border)}.section-head{margin-bottom:var(--space-8);gap:var(--space-4);display:grid}.section-head p{max-width:34em;color:var(--text-secondary);font-size:var(--text-small)}.project{gap:var(--space-4);border-top:1px solid var(--border);padding-block:var(--space-8);display:grid}.project:last-child{border-bottom:1px solid var(--border)}.project-number{font:var(--text-small)/1.8 var(--font-mono);color:var(--muted)}.project-content p{color:var(--text-secondary);max-width:36em;margin-top:var(--space-3)}.project-link{width:fit-content;min-height:var(--control-min);font-size:var(--text-small);align-self:start;align-items:center;display:inline-flex}.project-domain{font-size:var(--text-caption);color:var(--muted);margin-top:var(--space-3);overflow-wrap:anywhere;display:block}.token-group{padding-block:var(--space-8);border-top:1px solid var(--border)}.token-heading{justify-content:space-between;align-items:baseline;gap:var(--space-4);margin-bottom:var(--space-6);display:flex}.token-heading span{font:var(--text-caption)/1.6 var(--font-mono);color:var(--muted)}.type-row{gap:var(--space-2);padding-block:var(--space-6);border-bottom:1px solid var(--border);display:grid}.type-row:last-child{border:0}.type-meta{font-size:var(--text-caption);color:var(--muted)}.type-meta code{font-size:var(--text-caption);display:block}.type-display{font:400 var(--text-display)/var(--leading-display) var(--font-display);letter-spacing:var(--tracking-display)}.type-h1{font-size:var(--text-h1);font-weight:600;line-height:1.3}.type-h2{font-size:var(--text-h2);font-weight:600;line-height:1.3}.type-h3{font-size:var(--text-h3);font-weight:600;line-height:1.3}.type-small{font-size:var(--text-small)}.type-caption{font-size:var(--text-caption)}.palette{gap:var(--space-6) var(--space-4);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.swatch{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--swatch);height:5rem}.color-item code{margin-top:var(--space-2);font-size:var(--text-caption);display:block}.color-value{color:var(--muted);font:var(--text-caption)/1.6 var(--font-mono)}.annotation{color:var(--text-secondary);font-size:var(--text-small);margin-top:var(--space-6);max-width:40em}.spacing{gap:var(--space-4);flex-wrap:wrap;align-items:end;display:flex}.space-item{text-align:center;min-width:2rem}.space-bar{width:1.5rem;height:var(--size);background:var(--text-primary);margin-inline:auto}.space-item code{margin-top:var(--space-2);color:var(--muted);font-size:var(--text-caption);display:block}.principles{gap:var(--space-8);display:grid}.principles p{color:var(--text-secondary);font-size:var(--text-small);margin-top:var(--space-3);max-width:36em}.example-surface{padding:var(--space-6);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md)}.button{min-height:var(--control-min);padding:var(--space-2) var(--space-4);background:var(--accent);color:var(--accent-foreground);border-radius:var(--radius-sm);font-size:var(--text-small);transition:background-color var(--duration-fast) var(--ease-out);border:1px solid #0000;justify-content:center;align-items:center;text-decoration:none;display:inline-flex}.button:hover{background:var(--accent-hover);color:var(--accent-foreground)}.example-surface .button{margin-top:var(--space-6)}.table-wrap{overflow-x:auto}table{border-collapse:collapse;text-align:left;width:100%;font-size:var(--text-small)}th,td{padding:var(--space-4) var(--space-4) var(--space-4) 0;border-bottom:1px solid var(--border);vertical-align:top}th{color:var(--text-secondary);font-weight:500}td:last-child{min-width:10em}.reading{max-width:var(--content-reading)}.reading:lang(zh-CN){max-width:var(--content-reading-cjk)}.reading p+p{margin-top:var(--space-6)}.foot{justify-content:space-between;gap:var(--space-4);border-top:1px solid var(--border);padding-block:var(--space-8);color:var(--muted);font-size:var(--text-caption);flex-wrap:wrap;display:flex}.foot a{color:inherit}@media (width>=40rem){.type-row{gap:var(--space-8);grid-template-columns:10rem minmax(0,1fr);align-items:baseline}.palette{grid-template-columns:repeat(4,minmax(0,1fr))}}@media (width>=48rem){.intro{gap:var(--space-12);grid-template-columns:1.2fr 1fr;align-items:end;display:grid}.intro-copy{margin-top:0}.section-head{grid-template-columns:1fr 1fr;align-items:baseline}.project{gap:var(--space-8);grid-template-columns:3rem minmax(0,1fr) auto}.principles{gap:var(--space-12);grid-template-columns:1fr 1fr}}@media (width>=64rem){.project{grid-template-columns:6rem minmax(0,1fr) 10rem}}@media (width>=80rem){.intro{column-gap:var(--space-24)}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}@media (forced-colors:active){.swatch,.space-bar{border:1px solid canvastext}.button{border-color:buttontext}}