:root{color-scheme:dark;--bg:#121310;--fg:#efeee5;--muted:#92958b;--line:#30322b;--amber:#eda662;--serif:Georgia,'Times New Roman',serif;--mono:'SFMono-Regular',Consolas,'Liberation Mono',monospace}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:32px}body{margin:0;background:var(--bg);color:var(--fg);font-family:Arial,Helvetica,sans-serif;font-size:16px;-webkit-font-smoothing:antialiased}.wrap{width:min(1320px,calc(100% - 112px));margin-inline:auto}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--amber);outline-offset:6px}header{height:106px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:24px}.wordmark{font-family:var(--serif);font-size:29px;letter-spacing:-1.1px}.amp{color:var(--amber);font-style:italic;margin:0 4px}.woven-mark{display:inline-block;color:var(--amber);font-family:var(--mono);font-size:31px;vertical-align:-1px;margin-right:13px}nav{display:flex;gap:38px;font-size:14px}nav a{color:#d4d6cb}nav a:hover,.repo-link:hover,footer a:hover{color:var(--amber)}.header-note{font-size:13px;color:var(--muted);font-family:var(--mono)}.hero{min-height:665px;display:grid;grid-template-columns:.92fr 1.08fr;align-items:center;gap:30px;padding-top:40px;padding-bottom:53px}.hero-copy{padding-top:10px}.eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:1.45px;line-height:1.7;color:var(--muted)}.eyebrow>span{display:inline-block;width:23px;height:1px;background:var(--amber);vertical-align:middle;margin-right:9px}h1{font-family:var(--serif);font-size:clamp(65px,6.8vw,100px);line-height:.99;font-weight:400;letter-spacing:-4.2px;margin:29px 0 27px}h1 em{color:var(--amber);font-weight:400}.intro{font-size:18px;line-height:1.6;color:#bfc1b7;margin:0 0 29px}.primary{display:inline-flex;align-items:center;gap:48px;background:var(--amber);color:#161710;padding:15px 20px;font-weight:600;font-size:14px;border:1px solid var(--amber);transition:background .2s}.primary:hover{background:#ffc489}.primary>span{font-size:22px;font-weight:400;line-height:.8}.smallprint{font-family:var(--mono);font-size:12px;color:#939689;margin-top:18px}.animation-panel{position:relative;min-width:0;align-self:stretch;display:flex;flex-direction:column;justify-content:center;padding-top:31px}.canvas-top{display:flex;justify-content:space-between;color:#8a8e80;font-family:var(--mono);font-size:11px;letter-spacing:1.5px;padding-inline:8px}canvas{width:100%;height:435px;display:block}.animation-controls{border-top:1px solid var(--line);padding-top:20px;display:flex;align-items:center;gap:17px}.phase-track{display:flex;gap:21px;flex:1;color:#62685a;font-family:var(--mono);font-size:11px}.phase-track span{transition:color .3s;white-space:nowrap}.phase-track b{font-size:12px;font-weight:400;margin-left:5px}.phase-track .active{color:var(--amber)}.replay,.pause{border:0;background:none;padding:5px 0;font-size:13px;color:#a4a89a}.replay:hover,.pause:hover{color:var(--fg)}.replay>span{font-size:19px;margin-right:4px;vertical-align:-1px}.pause{border-left:1px solid var(--line);padding-left:15px}.motion-note{font-size:12px;color:var(--muted);line-height:1.5}.rule{border-block:1px solid var(--line);padding-block:18px;display:flex;justify-content:space-between;font:11px var(--mono);letter-spacing:1.4px;color:#909586}.libraries{display:grid;grid-template-columns:1fr 1fr;padding-block:62px 76px;gap:100px}.libraries article+article{border-left:1px solid var(--line);padding-left:60px}.library-heading{display:flex;align-items:center;gap:13px}.index{font:12px var(--mono);color:var(--amber);align-self:flex-start;margin-top:10px}h2{font:400 48px var(--serif);letter-spacing:-1.7px;margin:0}.library-heading h2 span{color:var(--amber)}.library-type{font:10px var(--mono);color:#858c7e;letter-spacing:1.5px;margin-left:auto}.library-lead{font:27px/1.25 var(--serif);letter-spacing:-.4px;margin:25px 0 16px}.library-body{color:#a8aea0;font-size:16px;line-height:1.7;max-width:435px}.tags{list-style:none;margin:27px 0 34px;padding:0;display:flex;flex-wrap:wrap;gap:8px}.tags li{font:11px var(--mono);padding:8px 10px;background:#1c1e18;border:1px solid #2a2e24;color:#b2b8a8}.repo-link{font-size:14px;border-bottom:1px solid #535949;padding-bottom:8px;display:inline-block}.repo-link>span{display:none}.start{border-top:1px solid var(--line);padding-block:64px 80px;display:grid;grid-template-columns:.8fr 1.2fr;gap:48px;align-items:center}.start h2{margin:14px 0 20px;font-size:51px}.start p:not(.eyebrow){color:#a8aea0;font-size:16px}.start .requirements{font:12px var(--mono)!important;margin-top:26px}.code-panel{min-width:0;border:1px solid #383d30;background:#191c15}.code-header{display:flex;align-items:center;gap:18px;border-bottom:1px solid #383d30;padding:0 17px 0 0;font:12px var(--mono);color:#88917c}.code-header>span{margin-left:auto}.code-header>button{background:none;border:1px solid #464f3b;padding:6px 10px;font:12px var(--mono)}.tabs{display:flex}.tabs button{border:0;border-right:1px solid #383d30;background:transparent;padding:17px 22px;font:13px var(--mono);color:#87927d}.tabs button[aria-selected=true]{background:#252d1e;color:#eda662;box-shadow:inset 0 -2px #eda662}.code-panel pre{margin:0;padding:28px 24px 30px;font:13px/1.9 var(--mono);overflow-x:auto;min-height:180px}.comment{color:#89957b}.function{color:#e1e5d7}.string{color:#efb777}.code-foot{border-top:1px solid #383d30;padding:17px 20px;display:flex;gap:20px;flex-wrap:wrap;justify-content:space-between;font-size:12px;color:#9ca58f}.code-foot a{color:#dbc29c}.code-foot code{color:#e3e8d8}footer{border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:25px;padding-block:28px 38px;font-size:12px;color:#8b927f}footer p{margin:0}.footer-brand{font-size:23px;color:#d7dbce}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(min-width:1500px){.hero{min-height:730px}canvas{height:490px}}@media(max-width:1050px){.wrap{width:calc(100% - 64px)}.hero{gap:10px;min-height:610px}h1{font-size:76px}.libraries{gap:40px}.libraries article+article{padding-left:35px}.library-type{display:none}.phase-track{gap:10px}.start{grid-template-columns:.7fr 1.3fr;gap:24px}.code-panel pre{font-size:12px;padding-inline:16px}.code-header>span{display:none}.code-header>button{margin-left:auto}}@media(max-width:760px){.wrap{width:calc(100% - 40px)}header{height:84px}.wordmark{font-size:26px}.woven-mark{margin-right:6px}.header-note{display:none}nav{gap:20px;font-size:13px}nav a:first-child{display:none}.hero{grid-template-columns:1fr;padding-top:41px;padding-bottom:36px;gap:0}.hero-copy{padding-top:0}h1{font-size:clamp(66px,13vw,88px);letter-spacing:-3px;margin-block:22px}.intro{font-size:17px}.intro br:first-child{display:none}.intro br:first-child:after{content:' '}.primary{gap:45px}.animation-panel{padding-top:27px;margin-top:8px}canvas{height:340px}.canvas-top{font-size:10px}.animation-controls{padding-top:13px}.phase-track{gap:18px}.rule{font-size:10px;line-height:1.6;gap:20px}.rule>span:last-child{text-align:right}.libraries{grid-template-columns:1fr;padding-block:38px 44px;gap:36px}.libraries article+article{padding:34px 0 0;border-left:0;border-top:1px solid var(--line)}.library-heading h2{font-size:45px}.library-type{display:block}.library-lead{margin-top:22px}.library-lead br{display:none}.library-body{max-width:none}.tags{margin-block:22px 27px}.start{grid-template-columns:1fr;padding-block:42px 50px;gap:25px}.start h2{font-size:45px}.start .requirements{margin-top:20px}.code-panel pre{font-size:12px}.code-foot{line-height:1.6}footer{flex-wrap:wrap;column-gap:20px;row-gap:15px;padding-block:25px}footer p{margin-left:auto}footer>a:last-child{width:100%}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}@media(max-width:380px){.phase-track{gap:9px}.phase-track b{margin-left:2px}.animation-controls{gap:10px}.pause{padding-left:10px}.code-panel pre{font-size:11px}.library-type{font-size:9px}}
/* Competitive positioning: an editorial break before the library details. */
.positioning{max-width:390px;margin:-12px 0 28px;color:var(--muted);font-size:14px;line-height:1.7}.positioning a{color:#d4d6cb;text-decoration:underline;text-decoration-color:#535949;text-underline-offset:4px}.positioning a:hover{color:var(--amber)}
.competition{display:grid;grid-template-columns:.8fr 1.2fr;gap:64px;padding-block:62px;border-bottom:1px solid var(--line);align-items:start}.competition .eyebrow{margin:0 0 19px}.competition h2{font-size:clamp(40px,4vw,56px);line-height:1.08}.competition-copy{max-width:600px}.competition-copy p{color:#a8aea0;font-size:16px;line-height:1.7;margin:16px 0 0}.competition-copy .competition-lead{font:26px/1.4 var(--serif);letter-spacing:-.35px;color:var(--fg);margin:0 0 21px}.competition-lead strong{color:var(--amber);font-weight:400}
@media(max-width:760px){.positioning{max-width:360px}.competition{grid-template-columns:1fr;gap:25px;padding-block:38px}.competition h2{font-size:42px}.competition h2 br{display:none}.competition-copy .competition-lead{font-size:24px}}