@font-face{font-family:Atkinson Hyperlegible Next Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url(/_astro/atkinson-hyperlegible-next-latin-ext-wght-normal.C6vrW8VD.woff2)format("woff2-variations");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Atkinson Hyperlegible Next Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url(/_astro/atkinson-hyperlegible-next-latin-wght-normal.BcXVPD7q.woff2)format("woff2-variations");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Atkinson Hyperlegible Mono Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url(/_astro/atkinson-hyperlegible-mono-latin-ext-wght-normal.CXgNM06D.woff2)format("woff2-variations");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Atkinson Hyperlegible Mono Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url(/_astro/atkinson-hyperlegible-mono-latin-wght-normal.CoA7y8X5.woff2)format("woff2-variations");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}*,:before,:after{box-sizing:border-box}html{color-scheme:dark;background:var(--bg);-webkit-text-size-adjust:100%;text-size-adjust:100%}body{min-height:100dvh;color:var(--ink);background:var(--bg);margin:0}a{color:inherit}:focus-visible{outline:2px solid var(--accent);outline-offset:3px}svg{display:block}pre{tab-size:2;overflow-x:auto}.wm-ink{fill:var(--ink)}.wm-accent{fill:var(--accent)}.tok-keyword{color:var(--code-keyword)}.tok-function{color:var(--code-function)}.tok-string,.tok-string-expression{color:var(--code-string)}.tok-constant,.tok-parameter,.tok-flag{color:var(--code-constant)}.tok-punctuation,.tok-comment{color:var(--code-muted)}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track,::-webkit-scrollbar-corner{background:0 0}::-webkit-scrollbar-thumb{background:var(--line);background-clip:padding-box;border:2px solid #0000;border-radius:5px}::-webkit-scrollbar-thumb:hover{background-color:var(--muted)}::-webkit-scrollbar-button{display:none}@supports not selector(::-webkit-scrollbar){*{scrollbar-width:thin;scrollbar-color:var(--line) transparent}}:root{--bg:#0d0a14;--surface:#130e1c;--line:#211a2e;--line-strong:#3a2e50;--ink:#f2eef8;--soft:#c8bfd6;--muted:#9a90ab;--accent:#b26bff;--on-accent:#14061f;--lattice-lit:#c9b2e6;--lattice-dim:#221a30;--code-keyword:#d3b0ff;--code-function:#f2eef8;--code-string:#c6b5e0;--code-constant:#b69be0;--code-muted:#857a99;--sans:"Atkinson Hyperlegible Next Variable", system-ui, sans-serif;--mono:"Atkinson Hyperlegible Mono Variable", ui-monospace, monospace}@view-transition{navigation:auto}@media (prefers-reduced-motion:reduce){@view-transition{navigation:none}}html{scroll-padding-top:32px}body{font:400 1.0625rem / 1.6 var(--sans);color:var(--soft);flex-direction:column;display:flex}main{flex:1}h1,h2,h3,p,ul,ol{margin:0}ul,ol{padding:0;list-style:none}h1,h2,h3{color:var(--ink);text-wrap:balance}h2{letter-spacing:-.01em;font-size:1.75rem;font-weight:300;line-height:1.2}h3{font-size:1.125rem;font-weight:600;line-height:1.3}strong{color:var(--ink);font-weight:600}a{color:var(--ink);text-decoration-color:var(--muted);text-underline-offset:3px;text-decoration-thickness:1px}a:hover{text-decoration-color:var(--accent)}code,pre{font-family:var(--mono)}code{color:var(--ink);font-size:.875em}pre code{font-size:inherit}.shell{width:100%;max-width:1168px;margin-inline:auto;padding-inline:24px}.skip{z-index:100;background:var(--ink);color:var(--bg);border-radius:6px;padding:8px 14px;font-weight:600;text-decoration:none;position:absolute;top:40px;left:16px;transform:translateY(-200px)}.skip:focus{transform:none}.btn{border:1px solid var(--accent);background:var(--accent);min-height:46px;color:var(--on-accent);border-radius:6px;align-items:center;padding:0 20px;font-weight:600;text-decoration:none;transition:background-color .15s,border-color .15s;display:inline-flex}.btn:hover{background:var(--ink);border-color:var(--ink)}.btn-quiet{border-color:var(--line-strong);color:var(--ink);background:0 0}.btn-quiet:hover{border-color:var(--ink);background:0 0}.actions{flex-wrap:wrap;gap:12px;display:flex}.head{justify-content:space-between;align-items:center;gap:24px;height:72px;display:flex}.logo .brand{width:auto;height:34px}.head nav{gap:32px;display:flex}.head nav a{color:var(--soft);white-space:nowrap;font-size:.9375rem;text-decoration:none}.head nav a:hover,.head nav a[aria-current],.head nav a:last-child{color:var(--ink)}.head nav a[aria-current]{text-decoration:underline;text-decoration-color:var(--muted);text-underline-offset:6px}.head nav a:last-child{font-weight:600}.hero{isolation:isolate;min-height:clamp(520px,100svh - 104px,740px);display:grid;position:relative}.hero canvas{z-index:-2;touch-action:pan-y;width:100%;height:100%;position:absolute;inset:0;mask-image:linear-gradient(#0000,#000 14% 78%,#0000)}.hero canvas:focus-visible{outline-offset:-4px}@media (scripting:none){.hero:after{z-index:-2;content:"";background:radial-gradient(circle, var(--lattice-dim) 1px, transparent 1.5px) 0 0 / 30px 30px;width:100%;height:100%;position:absolute;inset:0;mask-image:linear-gradient(#0000,#000 14% 78%,#0000)}}.hero:before{content:"";z-index:-1;pointer-events:none;background:linear-gradient(90deg,#0d0a14f7 0%,#0d0a14eb 38%,#0d0a1400 68%);position:absolute;inset:0}.hero-in{grid-template-rows:1fr auto;padding-block:40px 56px;display:grid}.hero-copy{align-self:center;max-width:43rem}.hero h1{letter-spacing:-.022em;color:var(--soft);font-size:clamp(2.125rem,4.7vw,4.25rem);font-weight:300;line-height:1.05}.hero h1 strong{font-weight:400}.hero .actions{margin-top:36px}.hero-eye{width:1px;height:1px;position:absolute;top:44%;left:74%}.hero-note{max-width:46rem;color:var(--muted);font-size:.9375rem;line-height:1.55}.live{font-variant-numeric:tabular-nums;margin-top:6px}@media (scripting:none){.live{display:none}}.block{border-top:1px solid var(--line);grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:24px 48px;padding-block:72px;display:grid}.block:first-child{border-top:0}.block:last-child{padding-bottom:104px}.block p{max-width:40rem}.services{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 48px;display:grid}.services p{color:var(--muted);margin-top:4px}.tools{gap:40px;display:grid}.tools h3{align-items:baseline;gap:14px;margin-bottom:4px;display:flex}.tools h3 a:first-child,.posts h2 a,.posts h3 a{text-decoration:none}.tools h3 a:first-child:hover,.posts h2 a:hover,.posts h3 a:hover{text-decoration:underline;text-decoration-color:var(--accent)}.version{color:var(--muted);font-size:.9375rem;font-weight:400}.cmd{background:var(--surface);border-radius:6px;align-items:flex-start;gap:16px;margin-top:14px;padding:12px 16px;display:flex}.cmd code{white-space:pre-wrap;overflow-wrap:anywhere;flex:1;min-width:0;line-height:1.7}.cmd button,.copy{color:var(--muted);font:400 .875rem / 1.5 var(--sans);text-decoration:underline;text-decoration-color:var(--line-strong);text-underline-offset:3px;cursor:pointer;background:0 0;border:0;flex:none;padding:2px 0}.cmd button:hover,.copy:hover,.cmd button[data-copied],.copy[data-copied]{color:var(--ink)}.checks,.prose ul{padding-left:1.15em;list-style:outside}.checks li+li,.prose li+li{margin-top:10px}.checks li::marker,.prose li::marker{color:var(--muted)}.example{margin-top:32px}.files{color:var(--muted);overflow-wrap:anywhere;margin-top:14px;font-size:.9375rem}.posts li+li{margin-top:40px}.posts h2,.posts h3{letter-spacing:-.01em;margin-bottom:8px;font-size:1.5rem;font-weight:400;line-height:1.25}.posts p{max-width:40rem}.meta{color:var(--muted);margin-top:8px;font-size:.9375rem}.more,.block .actions{margin-top:24px}.foot{border-top:1px solid var(--line);color:var(--muted);padding-block:40px 64px;font-size:.9375rem}.foot p{max-width:40rem}.foot nav{flex-wrap:wrap;gap:8px 28px;margin-top:20px;display:flex}.foot nav a{color:var(--soft);text-decoration:none}.foot nav a:hover{color:var(--ink)}.page{padding-block:64px 104px}.page-head{max-width:46rem;margin-bottom:56px}.page-head h1{letter-spacing:-.02em;font-size:clamp(2.125rem,4.4vw,3.5rem);font-weight:300;line-height:1.08}.crumb{margin-bottom:16px;font-size:.9375rem}.crumb a{color:var(--muted);text-decoration:none}.crumb a:hover{color:var(--ink)}.crumb a:before{content:"← "}.lede{margin-top:18px;font-size:1.25rem;line-height:1.5}.progress{z-index:60;background:var(--accent);transform-origin:0;height:2px;position:fixed;inset:0 0 auto;transform:scaleX(0)}.post{grid-template-columns:minmax(0,42rem) 14rem;column-gap:96px;display:grid}.post .page-head{grid-column:1/-1}.contents{grid-area:2/2/span 2;align-self:start;font-size:.9375rem;position:sticky;top:32px}.contents p{color:var(--muted);margin-bottom:10px}.contents a{border-left:1px solid var(--line);color:var(--muted);padding:5px 0 5px 14px;line-height:1.35;text-decoration:none;transition:color .15s;display:block}.contents a:hover{color:var(--ink)}.contents a[aria-current]{border-left-color:var(--accent);color:var(--ink)}.prose{grid-column:1;min-width:0;font-size:1.125rem;line-height:1.7}.prose>*+*{margin-top:1.25em}.prose h2{margin-top:2.2em;font-size:1.625rem;font-weight:400}.anchor{color:var(--muted);opacity:0;margin-left:.4em;text-decoration:none;transition:opacity .15s}h2:hover .anchor,.anchor:focus-visible{opacity:1}@media (hover:none){.anchor{opacity:.7}}.prose :not(pre)>code{background:var(--surface);overflow-wrap:anywhere;border-radius:4px;padding:.12em .4em}.prose pre{background:var(--surface);color:var(--ink);border-radius:8px;margin:0;padding:18px 20px;font-size:.875rem;line-height:1.7}.code{position:relative}.code pre{padding-top:40px}.code .copy{position:absolute;top:10px;right:16px}.post-end{border-top:1px solid var(--line);flex-wrap:wrap;grid-column:1;align-items:center;gap:12px 20px;margin-top:64px;padding-top:32px;display:flex}@media (width<=960px){.block{grid-template-columns:minmax(0,1fr);padding-block:56px}.post{grid-template-columns:minmax(0,1fr);max-width:calc(42rem + 48px)}.contents{grid-area:auto/1;margin-bottom:48px;position:static}}@media (width<=720px){.shell{padding-inline:16px}.head{height:60px}.head nav{gap:20px}.head .wide{display:none}.logo .brand{height:28px}.hero{min-height:0}.hero canvas{z-index:0;width:calc(100% + 32px);height:250px;margin:20px -16px 12px;position:relative;mask-image:radial-gradient(closest-side,#000 55%,#0000)}.hero:before,.hero-eye{display:none}.hero-in{grid-template-rows:auto auto auto;padding-block:28px 40px}.hero .actions{margin-top:24px}.services{grid-template-columns:minmax(0,1fr);gap:20px}.cmd{flex-direction:column;gap:6px}.cmd code{white-space:pre;flex:none;max-width:100%;overflow-x:auto}.page{padding-block:40px 72px}.page-head{margin-bottom:40px}.prose{font-size:1.0625rem}.prose h2{font-size:1.5rem}.prose pre{font-size:.8125rem}}.brand-copy>*+*{margin-top:16px}.brand-note{color:var(--muted);font-size:.9375rem}.brand-sub{margin:40px 0 8px}.logo-grid,.swatches,.fonts{gap:32px 24px;display:grid}.logo-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.logo-grid p,.swatches p,.fonts p{color:var(--muted);font-size:.9375rem}.logo-grid h3,.swatches h3,.fonts h3{margin-top:12px}.logo-tile{border:1px solid var(--line);border-radius:8px;place-items:center;height:152px;padding:24px;display:grid}.logo-dark{background:var(--bg)}.logo-light{background:#f5f2fa}.logo-tile img{width:auto;max-width:100%;height:104px}.logo-wordmark img{height:56px}.downloads{gap:20px;margin-top:6px;display:flex}.downloads a{color:var(--ink)}.swatches{grid-template-columns:repeat(auto-fill,minmax(9.5rem,1fr))}.chip{border:1px solid var(--line-strong);border-radius:6px;width:100%;height:72px}.swatches code{font-size:.8125rem}.token{color:var(--muted)}.fonts{grid-template-columns:repeat(2,minmax(0,1fr))}.fonts .specimen{border-bottom:1px solid var(--line);color:var(--ink);padding:20px 0 16px;font-size:2.5rem;font-weight:300;line-height:1.1}.fonts .specimen-mono{font-family:var(--mono);font-size:2rem}@media (width<=720px){.logo-grid,.fonts{grid-template-columns:minmax(0,1fr)}}@media (prefers-reduced-motion:reduce){.btn,.contents a,.anchor{transition:none}html{scroll-behavior:auto}}