:root{--color-surface: #fafafa;--color-text: #1a1a1a;--color-brand: #202126;--color-interaction: #1d4eb8;--color-link-hover: #133380;--color-button-text: #fafafa;--color-line: #c8c8c8;--space-xs: 4px;--space-s: 8px;--space-m: 16px;--space-l: 28px;--space-xl: 48px;--type-body: 18px;--type-h1: 30px;--type-h2: 25px;--type-h3: 21px;--radius-base: 6px;--radius-lg: 10px;--ramp-100: #e7e7e8;--ramp-200: #c8c8c9;--ramp-300: #9a9a9c;--ramp-400: #5e5e60;--ramp-500: #202126;--ramp-700: #161618;--ramp-900: #060607;--font-sans: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;--font-article: "Libertinus Sans", ui-sans-serif, system-ui, sans-serif;--font-article-display: "Libertinus Serif", ui-serif, Georgia, serif;--article-text: #1d1c1c;--article-muted: rgba(0, 0, 0, .6);--article-rule: rgba(0, 0, 0, .08);--article-link: #2d60a5;--article-link-hover: #133380;--article-accent: #2d60a5;--article-surface: #fcf6ee;--chip-bg: var(--article-link);--chip-onBg: var(--article-surface);--chip-bg-hover: var(--article-muted);--chip-border: rgba(0, 0, 0, .18)}::selection{background:var(--article-accent);color:#fff}*{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--article-surface);color:var(--article-text);font-family:var(--font-sans)}.layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:64px;max-width:88rem;margin:0 auto;padding:64px 40px;align-items:start}.example-panel{position:sticky;top:32px;align-self:start;display:flex;flex-direction:column;gap:16px}.example-label{font-family:var(--font-mono);font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:var(--article-muted);margin:0}.example-frame{background:var(--color-surface);color:var(--color-text);padding:var(--space-l);border-radius:var(--radius-lg);border:1px solid var(--article-rule);transition:background .25s ease,color .25s ease,border-radius .25s ease;display:flex;flex-direction:column;gap:var(--space-m);min-height:320px}.example-title{font-size:var(--type-h2);line-height:1.2;margin:0;color:var(--color-text);letter-spacing:-.01em;transition:color .25s ease,font-size .25s ease}.example-body{font-size:var(--type-body);line-height:1.5;margin:0;color:var(--color-text);transition:color .25s ease,font-size .25s ease}.example-separator{height:1px;width:100%;background:var(--color-line);transition:background .25s ease}.example-link{color:var(--color-interaction);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px;transition:color .15s ease}.example-link:hover{color:var(--color-link-hover)}.example-chart{display:flex;align-items:flex-end;gap:var(--space-xs);width:100%;height:110px;transition:gap .25s ease}.example-chart-bar{flex:1;height:var(--h);border-radius:2px;transition:background .25s ease,height .25s ease}.example-actions{display:flex;justify-content:flex-start}.example-button{background:var(--color-brand);color:var(--color-button-text);border:1px solid var(--color-line);padding:var(--space-s) var(--space-l);border-radius:var(--radius-base);font-family:inherit;font-size:var(--type-body);cursor:pointer;transition:background .25s ease,color .25s ease,border-color .25s ease,border-radius .25s ease}.example-button:hover{filter:brightness(1.08)}.article-content{font-family:var(--font-article);font-size:18px;line-height:1.6;color:var(--article-text)}.article-header{margin-bottom:56px}.kicker{font-family:var(--font-mono);font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:var(--article-accent);margin:0 0 1em 2.2rem}.article-content h1,.article-content h2,.article-content h3{font-family:var(--font-article-display);margin-top:1.5em}.article-content h1{font-size:64px;line-height:1.05;margin-bottom:2.2rem;letter-spacing:-.02em;font-weight:400;margin-top:0}.article-content h2{font-size:40px;line-height:1.15;letter-spacing:-.01em;font-weight:400}.article-content h3{font-size:26px;line-height:1.25;font-weight:400}@keyframes rewire-fade-in{0%{opacity:0;transform:translateY(-2px)}to{opacity:1;transform:translateY(0)}}.poline-demo{display:flex;flex-direction:column;gap:1rem;margin:1.5rem 0 1.75rem;padding:1.25rem 1.25rem 1.25rem 2.2rem;border:1px solid var(--article-rule);border-radius:12px;background:#00000004;max-width:60ch}.poline-demo__caption{margin:0!important;max-width:none!important;font-size:.85em;color:var(--article-muted)}.poline-demo poline-picker{display:block;width:100%;max-width:360px;aspect-ratio:1 / 1;margin:0 auto}.poline-demo__toggle{display:inline-flex;align-items:center;gap:8px;align-self:center;margin-top:4px;font-family:var(--font-mono);font-size:13px;color:var(--article-muted);cursor:pointer;-webkit-user-select:none;user-select:none}.poline-demo__toggle input[type=checkbox]{width:14px;height:14px;cursor:pointer;accent-color:var(--article-accent)}.bezier-demo{display:flex;flex-direction:column;gap:1rem;margin:1.5rem 0 1.75rem;padding:1.25rem 1.25rem 1.25rem 2.2rem;border:1px solid var(--article-rule);border-radius:12px;background:#00000004;max-width:60ch}.bezier-demo__caption{margin:0!important;max-width:none!important;font-size:.85em;color:var(--article-muted)}.bezier-svg{display:block;width:100%;max-width:80%;margin-left:-1.5rem;touch-action:none;-webkit-user-select:none;user-select:none}.bezier-svg circle[data-handle]:hover{fill:var(--article-accent)}.dep-graph-figure{margin:0;padding:12px;border:1px solid var(--article-rule);border-radius:10px;background:#00000004}.dep-graph-figure__caption{font-family:var(--font-mono);font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:var(--article-muted);margin-bottom:8px}.dep-graph svg{display:block;width:100%;height:auto}.article-footer{margin-top:64px;padding-top:32px;border-top:1px solid var(--article-rule);font-size:.95em;color:var(--article-muted)}.article-footer p{margin-bottom:8px;max-width:55ch}.article-content p,.article-content ul,.article-content ol{margin:0 0 1em 2.2rem;max-width:60ch;text-wrap:balance}.article-content .scale-demo__row{max-width:100%}.article-content .rule-line{margin-left:0;padding-left:2.2rem}.article-content .lede{font-size:1.5rem;color:var(--article-text);opacity:.85;line-height:1.5;max-width:50ch}.article-content section{border-top:1px solid var(--article-rule);padding-top:32px;margin-top:32px}.article-content section:first-of-type{border-top:none;padding-top:0;margin-top:0}.article-content code{font-family:var(--font-mono);font-size:.9em;padding:.05em .35em;background:#0000000d;border-radius:3px}.article-content a{color:var(--article-link);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px;transition:color .15s ease}.article-content a:hover{color:var(--article-link-hover)}.article-content em{font-style:italic}.article-content strong{font-weight:600}.token-list{list-style:none;padding:0;margin:0 0 16px}.token-list li{font-family:var(--font-mono);font-size:14px;padding:4px 0;display:flex;align-items:center;flex-wrap:wrap;gap:8px}.aside{font-family:var(--font-sans);font-size:13px;color:var(--article-muted)}.rule-line{font-family:var(--font-mono);font-size:14px;background:#0000000a;padding:12px 16px;display:flex;flex-wrap:wrap;align-items:center;gap:4px;box-shadow:inset 0 0 0 1px #00000014}.rule-line code{background:transparent;padding:0}.pair-demo{margin:20px 0 24px;padding:1rem 0;max-width:34rem;border:1px solid var(--article-rule);background:linear-gradient(180deg,#00000005,#00000009)}.pair-demo__title{margin:0 0 8px;font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--article-muted)}.pair-demo__rule{margin:0 0 14px;font-family:var(--font-mono);font-size:14px}.pair-demo__rule code{background:transparent;padding:0}.pair-demo__rows{display:grid;gap:10px;margin-bottom:12px}.pair-demo__row{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin:0;font-family:var(--font-mono);font-size:14px}.pair-demo__label{min-width:7.5rem}.pair-demo__note{margin:0;color:var(--article-muted);font-size:.95rem}.scale-demo{margin:20px 0 24px;padding:1rem 0;max-width:42rem;border:1px solid var(--article-rule);background:#00000006}.scale-demo__title{margin:0 0 10px;font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--article-muted)}.scale-demo__row{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:0;padding:6px 0;font-family:var(--font-mono);font-size:14px}.scale-demo__label{min-width:7.5rem}.scale-demo__row code{background:transparent;padding:0}.scale-demo__equals{color:var(--article-muted)}.token-chip{display:inline-flex;align-items:center;gap:6px;padding:2px 6px;margin:0 2px;background:var(--chip-bg);border:1px solid var(--chip-border);border-radius:999px;font-family:var(--font-mono);font-size:13px;line-height:1.4;color:var(--chip-onBg);cursor:pointer;vertical-align:baseline;transition:background .12s ease,transform .12s ease,opacity .25s ease,border-color .25s ease}.token-chip:hover{background:var(--chip-bg-hover)}.token-chip:active{transform:translateY(1px)}.token-chip:focus-visible{outline:2px solid var(--article-accent);outline-offset:2px}.token-chip--ref{border-style:dashed}.chip-swatch{width:12px;height:12px;border-radius:50%;border:1px solid var(--chip-onBg);flex-shrink:0}.chip-value{font-variant-numeric:tabular-nums}.chip-arrow{opacity:.55;font-weight:600}#popover-root{position:relative;z-index:1000;pointer-events:none}#popover-root>*{pointer-events:auto}.popover{position:fixed;background:#fff;color:#1a1a1a;border:1px solid rgba(0,0,0,.15);border-radius:8px;padding:12px 16px;box-shadow:0 12px 32px #00000024;min-width:260px;max-width:320px;z-index:2000;font-family:var(--font-sans);font-size:14px;line-height:1.4}.popover-title{font-family:var(--font-mono);font-size:12px;color:#0009;margin-bottom:8px}.popover-note{color:#0009;font-size:13px}.slider-wrap{display:flex;align-items:center;gap:12px}.slider-wrap input[type=range]{flex:1;accent-color:var(--article-accent)}.slider-value{font-family:var(--font-mono);font-size:13px;min-width:4ch;text-align:right;font-variant-numeric:tabular-nums}.color-picker-wrapper{position:fixed;z-index:2000;background:#fff;border:1px solid rgba(0,0,0,.12);border-radius:6px;padding:6px 10px;box-shadow:0 6px 24px #0000001f}.ref-list{display:flex;flex-direction:column;gap:1px;max-height:280px;overflow-y:auto;margin-top:8px}.ref-group-header{font-family:var(--font-mono);font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:#00000080;padding:8px 6px 4px}.ref-group-header:first-child{padding-top:0}.ref-option{display:flex;align-items:center;gap:8px;padding:5px 8px;border:1px solid transparent;background:transparent;border-radius:4px;cursor:pointer;font:inherit;color:inherit;text-align:left;font-family:var(--font-mono);font-size:12.5px}.ref-option:hover{background:#0000000d}.ref-option--selected{background:#0000000f;border-color:#0006}.ref-option--selected:after{content:"current";font-family:var(--font-sans);font-size:10px;text-transform:uppercase;letter-spacing:.05em;color:#0000008c;margin-left:auto}.ref-option--error{background:#dc3c3c26;border-color:#dc3c3c80}.ref-option-swatch{width:14px;height:14px;border-radius:50%;border:1px solid rgba(0,0,0,.2);flex-shrink:0}.ref-option-key{flex:1}.reset-btn{align-self:flex-start;font-family:var(--font-mono);font-size:12px;padding:6px 14px;background:transparent;border:1px solid var(--chip-border);border-radius:999px;cursor:pointer;color:var(--article-muted)}.reset-btn:hover{background:#0000000a;color:var(--article-text)}@media(max-width:960px){.layout{grid-template-columns:1fr;gap:32px;padding:32px 20px}.example-panel{position:static}}