@layer elements,components;@font-face{font-display:swap;font-family:Recursive;font-style:normal;font-weight:300 1000;src:url(/recursive.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:root{--white: oklch(100% 0 0deg);--gray-14: oklch(14% 0 0deg);--gray-16: oklch(16% 0 0deg);--gray-20: oklch(20% 0 0deg);--gray-30: oklch(30% 0 0deg);--gray-35: oklch(35% 0 0deg);--gray-55: oklch(55% 0 0deg);--gray-62: oklch(62% 0 0deg);--gray-75: oklch(75% 0 0deg);--gray-85: oklch(85% 0 0deg);--gray-94: oklch(94% 0 0deg);--gray-98: oklch(98% 0 0deg);--pink: light-dark(oklch(55% .25 350deg), oklch(75% .18 350deg));--teal: light-dark(oklch(92% .04 190deg), oklch(30% .06 195deg));--purple: light-dark(oklch(44% .16 303deg), oklch(64% .12 303deg));--green: light-dark(oklch(65% .2 145deg), oklch(85% .12 145deg));--color-fg: light-dark(var(--gray-35), var(--gray-75));--color-fg-strong: light-dark(var(--gray-14), var(--gray-98));--color-fg-muted: light-dark(var(--gray-55), var(--gray-62));--color-bg: light-dark(var(--white), var(--gray-16));--color-bg-secondary: light-dark(var(--gray-98), var(--gray-20));--color-bg-tertiary: light-dark(var(--gray-94), var(--gray-30));--color-bg-quaternary: light-dark(var(--gray-85), var(--gray-35));--color-line: light-dark(var(--gray-85), var(--gray-35));--color-accent: var(--pink);--color-accent-strong: light-dark( oklch(from var(--color-accent) 45% c h), oklch(from var(--color-accent) 65% c h) );--color-accent-subtle: light-dark( oklch(from var(--color-accent) 99% .0038 h), oklch(from var(--color-accent) 30% .005 h) );--color-success: var(--green);--font-size-xs: clamp(.6914rem, .6814rem + .0498cqi, .72rem);--font-size-s: clamp(.7778rem, .7353rem + .2126cqi, .9rem);--font-size: clamp(.875rem, .788rem + .4348cqi, 1.125rem);--font-size-l: clamp(.9844rem, .8376rem + .7337cqi, 1.4063rem);--font-size-xl: clamp(1.1074rem, .8812rem + 1.1311cqi, 1.7578rem);--font-size-2xl: clamp(1.2458rem, .9149rem + 1.6546cqi, 2.1973rem);--font-size-3xl: clamp(1.4016rem, .9338rem + 2.3391cqi, 2.7466rem);--font-size-4xl: clamp(1.5768rem, .9311rem + 3.2286cqi, 3.4332rem);--font-size-5xl: clamp(1.7739rem, .8982rem + 4.3785cqi, 4.2915rem);--length-4xs: clamp(.125rem, .1143rem + .0543cqi, .1563rem);--length-3xs: clamp(.25rem, .2283rem + .1087cqi, .3125rem);--length-2xs: clamp(.4375rem, .394rem + .2174cqi, .5625rem);--length-xs: clamp(.6875rem, .6223rem + .3261cqi, .875rem);--length-s: clamp(.875rem, .788rem + .4348cqi, 1.125rem);--length: clamp(1.3125rem, 1.1821rem + .6522cqi, 1.6875rem);--length-l: clamp(1.75rem, 1.5761rem + .8696cqi, 2.25rem);--length-xl: clamp(2.625rem, 2.3641rem + 1.3043cqi, 3.375rem);--length-2xl: clamp(3.5rem, 3.1522rem + 1.7391cqi, 4.5rem);--length-3xl: clamp(5.25rem, 4.7283rem + 2.6087cqi, 6.75rem);--length-4xl: clamp(7rem, 6.3043rem + 3.4783cqi, 9rem);--length-3xs-2xs: clamp(.375rem, .3315rem + .2174cqi, .5rem);--length-s-3xl: clamp(.875rem, -1.1685rem + 10.2174cqi, 6.75rem);--length-l-xl: clamp(1.75rem, 1.1848rem + 2.8261cqi, 3.375rem);--length-l-3xl: clamp(1.75rem, .0109rem + 8.6957cqi, 6.75rem);--line-length: 1px;--line-length-l: 1.5px;--line-length-xl: 2px;--duration: 175ms;--duration-l: .3s;--timing-function: cubic-bezier(.4, 0, .2, 1);--timing-function-elastic: cubic-bezier(.34, 1.56, .64, 1);--shadow-s: inset 0 1px 0 0 oklch(from var(--white) l c h / 20%), 0 1px 2px light-dark(oklch(from var(--gray-30) l c h / 15%), transparent), 0 2px 4px light-dark(oklch(from var(--gray-30) l c h / 5%), transparent);--shadow: inset 0 1px 0 0 oklch(from var(--white) l c h / 30%), 0 1px 2px light-dark(oklch(from var(--gray-30) l c h / 10%), transparent), 0 2px 4px light-dark(oklch(from var(--gray-30) l c h / 8%), transparent), 0 4px 8px light-dark(oklch(from var(--gray-30) l c h / 4%), transparent), 0 8px 16px light-dark(oklch(from var(--gray-30) l c h / 2%), transparent);--shadow-l: inset 0 1px 0 0 oklch(from var(--white) l c h / 30%), 0 1px 2px light-dark(oklch(from var(--gray-30) l c h / 10%), transparent), 0 2px 4px light-dark(oklch(from var(--gray-30) l c h / 8%), transparent), 0 4px 8px light-dark(oklch(from var(--gray-30) l c h / 6%), transparent), 0 8px 16px light-dark(oklch(from var(--gray-30) l c h / 4%), transparent), 0 16px 32px light-dark(oklch(from var(--gray-30) l c h / 3%), transparent)}@layer elements{*{line-height:calc(var(--length-3xs-2xs) + 2ex)}:focus{outline:none;scroll-padding-block-end:8vb}:focus-visible{border-radius:var(--length-4xs);box-shadow:0 0 0 var(--line-length-l) var(--white);outline:var(--line-length-l) solid var(--gray-14);outline-offset:.125em}[id]{scroll-margin-block-start:var(--length-xl)}::selection{background-color:var(--teal)}html{accent-color:var(--color-accent);color-scheme:light dark;scrollbar-gutter:stable;@media(prefers-reduced-motion:no-preference){scroll-behavior:smooth}}body{background-color:var(--color-bg);color:var(--color-fg);container:inline-size;font-family:Recursive,system-ui;font-kerning:normal;font-optical-sizing:auto;font-size:var(--font-size);font-style:normal;font-variant-ligatures:common-ligatures no-discretionary-ligatures no-historical-ligatures contextual;font-variant-numeric:oldstyle-nums proportional-nums;font-variation-settings:"slnt" 0,"CASL" 0,"CRSV" .5,"MONO" 0;font-weight:400;hanging-punctuation:first allow-end last;hyphenate-limit-chars:7 4 3;hyphenate-limit-last:always;hyphenate-limit-lines:2;hyphenate-limit-zone:8%;hyphens:auto;margin-inline:auto;max-inline-size:min(90rem,100%);overflow:auto;padding:var(--length-s-3xl);text-size-adjust:none;text-wrap:pretty}section{margin-block:var(--length-l-3xl)}h1,h2,h3,h4{--spacing: -.02em;color:var(--color-fg-strong);font-variant-numeric:lining-nums;font-weight:700;hyphens:manual;letter-spacing:var(--spacing);letter-spacing:calc(progress(1em,1rem,3rem) * (var(--spacing) * 2));text-wrap:balance}h1{font-size:var(--font-size-5xl);margin-block-end:.28em}h2{font-size:var(--font-size-3xl);margin-block:1em .75em}h3{font-size:var(--font-size-xl);margin-block:1.25em .83em}h4{font-size:var(--font-size-l);margin-block:1.5em 1em}code,pre{max-inline-size:100%;overflow-y:auto}pre{border-radius:var(--length-xs);font-size:var(--font-size-s);line-height:1;margin-block:0;margin-inline:0;overflow-x:auto;padding-block:var(--length);padding-inline:var(--length);&:not(:hover,:focus){filter:grayscale(1)}}code{font-family:Recursive,monospace;font-size:inherit;font-variant-numeric:tabular-nums lining-nums slashed-zero;font-variation-settings:"slnt" 0,"CASL" 0,"CRSV" .5,"MONO" 1;&:not(pre code){background-color:var(--color-bg-secondary);border-radius:var(--length-3xs);font-family:inherit;font-size:.9em;padding-inline:.3em}}blockquote{border-inline-start:var(--line-length-xl) solid var(--color-line);color:var(--color-fg);margin-inline-start:0;padding-block:var(--length-xs);padding-inline-start:var(--length-s)}:is(ul,ol,dl){list-style-position:inside;padding-inline-start:0;:is(ul,ol,dl){padding-inline-start:.5lh}}a{&:any-link{cursor:pointer;text-decoration-skip-ink:auto;text-decoration-thickness:max(.08em,var(--line-length-l));text-underline-offset:.1em;transition:text-decoration-color var(--duration) var(--timing-function)}&:link,&:visited{text-decoration-color:oklch(from currentcolor l c h / 70%)}&:link{color:inherit}&:hover,&:focus-within{text-decoration-color:var(--color-accent)}&:active{text-decoration-color:var(--color-accent-strong)}&:visited{color:var(--color-fg-muted);&:hover,&:focus-within{color:var(--color-fg)}}}abbr{text-underline-offset:.3em}svg{display:block flow;max-inline-size:100%}label{display:block flow;margin-block-end:var(--length-xs)}button,input,textarea{border:var(--line-length) solid var(--color-line);color:inherit;font-family:inherit;font-size:inherit;hyphens:none;text-wrap:wrap}input,textarea{background-color:var(--color-bg-secondary);border-radius:var(--length-xs);box-sizing:border-box;inline-size:100%;padding-block:var(--length-s);padding-inline:var(--length);&:focus-within{border-radius:var(--length-xs)}}textarea{min-block-size:calc(3lh + (var(--length) * 2));scrollbar-gutter:stable}button{background-color:light-dark(var(--color-bg),var(--color-bg-tertiary));border-radius:var(--length-2xs);box-shadow:var(--shadow);color:var(--color-fg);cursor:pointer;display:block flex;font-size:var(--font-size-s);font-weight:600;gap:var(--length-3xs);padding-block:var(--length-3xs);padding-inline:var(--length-2xs);transition:transform var(--duration) var(--timing-function);svg{color:var(--color-fg)}&:hover,&:active{background-color:var(--color-accent-subtle);color:var(--color-fg-strong);svg{color:var(--color-accent)}}&:active{box-shadow:var(--shadow-s);transform:translateY(1px);svg{color:var(--color-accent-strong)}}}}@layer components{@scope(section.acknowledgements){:scope{@media(width>30em){margin-inline:auto;max-inline-size:60ch;text-align:center}}}}@layer components{@scope(nav.back){a{&:any-link{align-items:center;color:var(--color-fg-strong);display:inline flex;font-size:var(--font-size-s);font-weight:600;text-transform:uppercase}}}}@layer components{@scope(code-comparison){:scope{border-radius:var(--length-xs);display:block grid;gap:var(--length-2xs);&:not(:hover,:focus) pre{filter:grayscale(1)}}pre{&:not(:hover,:focus){filter:none}}div:nth-of-type(2){border-inline-start:var(--line-length) solid var(--color-line)}button{block-size:var(--length-xl);inline-size:var(--length-l)}}}@layer components{@scope(copy-clipboard){input{align-self:start;font-variant-numeric:tabular-nums lining-nums slashed-zero;font-variation-settings:"slnt" 0,"CASL" 0,"CRSV" .5,"MONO" 1}span:nth-of-type(1) svg{button:hover &{color:var(--color-accent)}}span:nth-of-type(2) svg{color:var(--color-success)}}}@layer components{@scope(footer){:scope{border-block-start:var(--line-length) solid var(--color-line);display:block grid;font-size:var(--font-size-s);gap:var(--length-2xs) var(--length-3xs);margin-block-start:var(--length-l-xl);padding-block:var(--length-l-xl);@media(width>30em){grid-template-columns:1fr auto}}p,a{color:var(--color-fg-muted);display:block flex;place-items:center}p{margin-block:0;&:first-of-type{gap:var(--length-2xs)}&:last-of-type{gap:var(--length-3xs)}}a{gap:var(--length-3xs);&:hover,&:focus-within{color:var(--color-fg)}}svg{block-size:1em;inline-size:1em}}}@layer components{@scope(section.get-started)to (.info-popover *){>div{display:block grid;gap:var(--length-xl) var(--length-2xl);@media(width>60em){grid-template-columns:repeat(2,1fr);grid-template-rows:auto auto auto 1fr auto auto}}form{@media(width>60em){grid-row:span 6}}div{div{position:relative;.info-popover{inset-block-start:var(--length-xs);inset-inline-end:var(--length-xs);position:absolute;z-index:5}@media(width>60em){display:block grid;gap:0;grid-row:span 6;grid-template-rows:subgrid}}}code-comparison{@media(width>60em){grid-row:span 5}}prompt-cycler{@media(width>60em){display:block grid;grid-row:span 3;grid-template-rows:subgrid}}copy-clipboard{@media(width>60em){display:block grid;grid-template-rows:subgrid}}label{&:last-of-type{margin-block-start:var(--length)}}p{&:first-of-type{margin-block:0 var(--length-xs)}&:last-of-type{display:block grid;margin-block-start:var(--length-xs);padding-inline:var(--length-s);place-items:center}}small{color:var(--color-fg-muted);font-size:var(--font-size-xs);text-align:center}}}@layer components{@scope(header){a{color:var(--color-fg-strong);font-size:var(--font-size-s);font-weight:600;text-decoration:none;text-transform:uppercase}svg{block-size:1.2lh;display:inline flow;inline-size:1.2lh;margin-inline:var(--length-4xs);vertical-align:-.15em}path{&:first-of-type{fill:var(--color-fg-strong);:scope:hover &{fill:var(--purple);transition:fill var(--duration) var(--timing-function)}}&:last-of-type{fill:light-dark(var(--gray-98),var(--gray-14))}}}}@layer components{@scope(section.hero){h1{max-inline-size:26ch}p{font-size:var(--font-size-xl);font-weight:300;max-inline-size:46ch}}}@layer components{@scope(span.info-popover){:scope{&[data-variant=inline]{--info-popover-size: .8em;--info-popover-position: bottom;--info-popover-margin-block: var(--length-2xs);--info-popover-margin-inline: var(--length-2xs)}}button{background-color:transparent;border:none;border-radius:50%;box-shadow:none;color:var(--color-fg);display:inline flex;font-size:var(--font-size);padding:0;&:hover,&:active{background-color:transparent;color:var(--color-fg-strong)}}svg{block-size:var(--info-popover-size, 1em);inline-size:var(--info-popover-size, 1em)}dialog{background-color:light-dark(var(--color-bg),var(--color-bg-quaternary));border:var(--line-length) solid var(--color-line);border-radius:var(--length-2xs);box-shadow:var(--shadow-l);color:var(--color-fg);font-size:var(--font-size-xs);margin-block:var(--info-popover-margin-block, var(--length-4xs));margin-inline:var(--info-popover-margin-inline, var(--length-4xs));max-inline-size:30ch;padding-block:var(--length-2xs);padding-inline:var(--length-s);position-area:var(--info-popover-position, bottom left);text-align:center}}}@layer components{@scope(aside.lint){:scope{border:var(--line-length) solid var(--color-line);border-radius:var(--length-xs);padding-block:var(--length-2xs);padding-inline:var(--length);@media(width>30em){display:block grid;margin-inline:auto;max-inline-size:48ch;place-items:center;text-align:center}}h2{font-size:var(--font-size-l)}p{&:first-of-type{margin-block:0}&:last-of-type{background-color:var(--color-bg-secondary);border-radius:var(--length-2xs);display:block grid;font-size:var(--font-size-s);gap:var(--length-2xs) var(--length-s);grid-template-columns:auto 1fr;padding:var(--length-xs);place-items:center;svg{block-size:2lh;fill:var(--color-fg-strong);inline-size:auto}@media(width>30em){max-inline-size:47ch;place-content:space-around;place-items:center;text-align:start}}}}}@layer components{@scope(prompt-cycler){nav{gap:var(--length);margin-block-start:var(--length-s);>button{padding:var(--length-3xs);svg{block-size:1lh;inline-size:1lh}}}span{align-items:center;display:block flex;gap:var(--length-2xs);span{background-color:var(--color-bg-tertiary);block-size:var(--length-2xs);border-radius:50%;inline-size:var(--length-2xs);&[aria-current=step]{background-color:var(--color-accent)}}}}}@layer components{@scope(p.signpost){:scope{margin-block-start:var(--length-l)}a{&:any-link{align-items:center;color:var(--color-fg-strong);display:inline flex;font-weight:600;position:relative;text-decoration:none}span{text-decoration:underline;text-decoration-color:currentcolor;text-decoration-thickness:max(.08em,var(--line-length-xl));text-underline-offset:.2em;transition:text-decoration-color var(--duration-l) var(--timing-function),text-decoration-thickness var(--duration-l) var(--timing-function),text-underline-offset var(--duration-l) var(--timing-function-elastic)}svg{inset-inline-start:95%;padding-inline-start:var(--length-s);position:absolute;transition:transform var(--duration-l) var(--timing-function-elastic)}&:hover,&:focus-within{span{text-decoration-color:var(--color-accent);text-decoration-thickness:max(.12em,var(--line-length-xl));text-underline-offset:.4em}svg{transform:translate(4px)}}&:active{span{text-decoration-color:var(--color-accent-strong);text-decoration-thickness:var(--line-length-xl);text-underline-offset:.2em;transition:none}}}}}@layer components{@scope(div.sub){main{max-inline-size:65ch}}}@layer components{@scope(section.what){:scope{@media(width>30em){margin-inline:auto;max-inline-size:90ch;text-align:center}}li{all:unset;background-color:var(--color-bg-secondary);border-radius:var(--length-xs);container-type:inline-size;padding-block:var(--length);padding-inline:var(--length);transition:opacity var(--duration-l) var(--timing-function);h3{font-size:var(--font-size-l);margin-block:0 var(--length-xs)}p{font-size:var(--font-size);margin-block:0}code{background-color:var(--color-bg-tertiary)}}ul{all:unset;display:block grid;gap:var(--length);grid-template-columns:repeat(auto-fill,minmax(min(100%,15em),1fr));margin-block-start:var(--length-l);&:has(li:hover,li:focus-within) li:not(:hover,li:focus-within){opacity:.55}}}}@layer components{@scope(section.why){:scope{@media(width>30em){margin-inline:auto;max-inline-size:60ch;text-align:center}}}}