@font-face{font-family:InterVariable;font-style:normal;font-weight:100 900;font-display:swap;src:url(/fonts/InterVariable.woff2)format("woff2")}@font-face{font-family:InterVariable;font-style:italic;font-weight:100 900;font-display:swap;src:url(/fonts/InterVariable-Italic.woff2)format("woff2")}:root{--qa-canvas:#f7f5f0;--qa-canvas-raised:#fff;--qa-ink:#18181b;--qa-ink-muted:#52525b;--qa-ink-subtle:#71717a;--qa-line:#18181b14;--qa-line-strong:#18181b24;--qa-accent:#5a4aec;--qa-accent-soft:#7c6ef21a;--qa-cta-bg:#5a4aec;--qa-cta-bg-hover:#4a38e9;--qa-cta-fg:#fff;--qa-shot-shadow:0 1px 2px #18181b0f, 0 12px 32px -8px #18181b24, 0 40px 80px -24px #18181b2e;--qa-font-mono:"JetBrains Mono", "SF Mono", ui-monospace, Menlo, Consolas, "Liberation Mono", monospace;--qa-step-duration:4.5s}[data-theme=dark]{--qa-canvas:#17181c;--qa-canvas-raised:#1f2126;--qa-ink:#f4f4f5;--qa-ink-muted:#a1a1aa;--qa-ink-subtle:#8b8b94;--qa-line:#f4f4f514;--qa-line-strong:#f4f4f524;--qa-accent:#a195f7;--qa-accent-soft:#a195f724;--qa-cta-bg:#5a4aec;--qa-cta-bg-hover:#6b5cef;--qa-cta-fg:#fff;--qa-shot-shadow:0 0 0 1px #ffffff0a, 0 24px 64px -16px #0009;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--qa-canvas);-webkit-font-smoothing:antialiased;font-family:InterVariable,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji}a{color:inherit;text-decoration:none}a:focus-visible,button:focus-visible{outline:2px solid var(--qa-accent);outline-offset:3px;border-radius:6px}ul[role=list],ol[role=list]{margin:0;padding:0;list-style:none}code{font-family:var(--qa-font-mono);font-size:.875em}.landing{background:var(--qa-canvas);color:var(--qa-ink);font-feature-settings:"cv11", "ss01";letter-spacing:-.003em}.container{max-width:1120px;margin:0 auto;padding-inline:1.25rem}@media (width>=768px){.container{padding-inline:2rem}}.eyebrow{color:var(--qa-accent);letter-spacing:.01em;margin:0;font-size:.8125rem;font-weight:600}.textLink{color:var(--qa-accent);white-space:nowrap;font-size:.9375rem;font-weight:500}.textLink:hover{text-underline-offset:3px;text-decoration:underline}.siteHeader{border-bottom:1px solid var(--qa-line);background:var(--qa-canvas)}.siteNav{justify-content:space-between;align-items:center;height:60px;display:flex}.brand{color:var(--qa-ink);align-items:center;gap:.55rem;font-size:1.05rem;font-weight:650;display:inline-flex}.navLinks{color:var(--qa-ink-muted);align-items:center;gap:1.25rem;font-size:.9375rem;font-weight:500;display:inline-flex}.navLinks a:hover{color:var(--qa-ink)}.navGithub svg,.themeToggle svg{width:20px;height:20px;display:block}.navGithub,.themeToggle{width:2.25rem;height:2.25rem;color:inherit;cursor:pointer;background:0 0;border:0;border-radius:8px;justify-content:center;align-items:center;margin-inline:-.5rem;padding:0;display:inline-flex}@media (width<=519px){.navLinks{gap:1rem}.navOptional{display:none}}.themeToggle:hover{color:var(--qa-ink)}.themeToggle .iconSun,[data-theme=dark] .themeToggle .iconMoon{display:none}[data-theme=dark] .themeToggle .iconSun{display:block}.hero{text-align:center;padding:clamp(3.5rem,7vw,5rem) 0 clamp(4rem,8vw,6rem);position:relative;overflow:hidden}.hero:before{content:"";background:radial-gradient(ellipse 60% 50% at 50% 0%, var(--qa-accent-soft), transparent 70%);pointer-events:none;height:70%;position:absolute;inset:-40% 0 auto}.hero>*{position:relative}.heroLogo{width:64px;height:64px;margin:0 auto 1.25rem;display:block}.hero .eyebrow{margin-bottom:1rem}.heroTitle{letter-spacing:-.032em;color:var(--qa-ink);text-wrap:balance;max-width:16ch;margin:0 auto 1.25rem;font-size:clamp(2.5rem,5vw + .5rem,4.25rem);font-weight:600;line-height:1.04}.heroSubtitle{color:var(--qa-ink-muted);text-wrap:pretty;max-width:50ch;margin:0 auto;font-size:clamp(1.0625rem,.6vw + .9rem,1.25rem);line-height:1.55}.heroActions{flex-wrap:wrap;justify-content:center;align-items:center;gap:.5rem .75rem;margin-top:2rem;display:flex}.demo{text-align:left;max-width:1120px;margin:clamp(2.75rem,6vw,4rem) auto 0}.demoFrame{aspect-ratio:1200/720;background:var(--qa-canvas-raised);box-shadow:var(--qa-shot-shadow);outline:1px solid var(--qa-line-strong);outline-offset:-1px;border-radius:12px;position:relative;overflow:hidden}.demoFrame:after{content:"";border-radius:inherit;box-shadow:inset 0 0 0 1px var(--qa-line-strong);pointer-events:none;position:absolute;inset:0}.demoShot{opacity:0;transition:opacity .45s;display:none;position:absolute;inset:0}.demoShot.isActive,.demoShot.isPrev,.demoShot.isNext{display:block}.demoShot.isPrev{opacity:1;z-index:1}.demoShot img{z-index:1;width:100%;height:100%;display:block;position:absolute;top:0;left:0}.demoShot[data-hold=light] .shotLight,.demoShot[data-hold=dark] .shotDark{z-index:0;display:block!important}.demoShot.isActive{opacity:1;z-index:2}.demoCaption{display:grid}.demoFlow{grid-area:1/1;grid-template-rows:1fr auto;gap:1.5rem;display:grid}.demoFlow:not(.isActive){visibility:hidden}.demoControls{justify-content:center;align-items:center;gap:.5rem;margin-bottom:1.25rem;display:flex}.demoControls:before{content:"";flex:none;width:2.25rem}.demoPlay{width:2.25rem;height:2.25rem;color:var(--qa-ink-subtle);cursor:pointer;background:0 0;border:0;border-radius:999px;flex:none;justify-content:center;align-items:center;padding:0;transition:background-color .15s,color .15s;display:inline-flex}@media (width<=399px){.demoControls:before{display:none}}.demoPlay:focus-visible{border-radius:999px}.demoPlay[hidden],.demoControls:has(.demoPlay[hidden]):before{display:none}.demoPlay:hover{background:var(--qa-line);color:var(--qa-ink)}.demoPlay svg{width:.875rem;height:.875rem}.demoPlay .iconPlay,.demo.isPlaying:not(.isPaused) .demoPlay .iconPause{display:block}.demoPlay .iconPause,.demo.isPlaying:not(.isPaused) .demoPlay .iconPlay{display:none}.demoTabs{background:var(--qa-line);border-radius:10px;justify-content:center;gap:.25rem;width:fit-content;padding:.25rem;display:flex}.demoTab{font:inherit;white-space:nowrap;color:var(--qa-ink-muted);cursor:pointer;background:0 0;border:0;border-radius:7px;align-items:center;gap:.5rem;padding:.5rem .875rem;font-size:.875rem;font-weight:500;transition:background-color .15s,color .15s;display:inline-flex}.demoTab svg{width:1rem;height:1rem}@media (width<=519px){.demoTab svg{display:none}}.demoTab:hover{color:var(--qa-ink)}.demoTab[aria-current]{background:var(--qa-canvas-raised);color:var(--qa-ink);box-shadow:0 1px 2px #18181b14, 0 0 0 1px var(--qa-line)}.demoTab[aria-current] svg{color:var(--qa-accent)}@media (width<=639px){.demoFrame{aspect-ratio:4/3}.demoShot img{width:166.667%;max-width:none;height:auto;position:absolute;top:-7.407%;left:-33.333%}.demoShot[data-index="1"] img{top:-16.667%}.demoShot[data-index="2"] img{top:-14.815%;left:-47.917%}}.shotDark,[data-theme=dark] .shotLight{display:none!important}[data-theme=dark] .shotDark{display:block!important}.demoCaption{margin-top:1.5rem}.demoSteps{grid-template-columns:1fr;gap:.25rem;margin:0;padding:0;list-style:none;display:grid}@media (width>=768px){.demoSteps{grid-template-columns:repeat(3,1fr);gap:1.5rem}}.demoSteps>li{cursor:pointer;align-content:start;gap:.375rem;padding-bottom:.5rem;display:grid}.demoStep{width:100%;font:inherit;text-align:left;color:var(--qa-ink-subtle);cursor:pointer;background:0 0;border:0;padding:1rem 0 0;transition:color .2s;display:block;position:relative}.demoStep:hover,.demoStep[aria-current]{color:var(--qa-ink)}.demoProgress{background:var(--qa-line-strong);border-radius:2px;height:2px;position:absolute;inset:0 0 auto;overflow:hidden}.demoProgress:after{content:"";background:var(--qa-accent);transform-origin:0;position:absolute;inset:0;transform:scaleX(0)}.demoStep[aria-current] .demoProgress:after{transform:scaleX(1)}.demo.isPlaying .demoStep[aria-current] .demoProgress:after{animation:demoProgress var(--qa-step-duration) linear both}.demo.isPlaying:is(.isPaused,:has(.demoFrame:hover,.demoCaption:hover,.demoCaption:focus-within),.isOffscreen) .demoStep[aria-current] .demoProgress:after{animation-play-state:paused}@keyframes demoProgress{0%{transform:scaleX(0)}to{transform:scaleX(1)}}.demoStepTitle{align-items:center;gap:.5rem;font-size:.9375rem;font-weight:600;display:flex}.demoStepNumber{font-variant-numeric:tabular-nums;color:var(--qa-accent)}.demoStepDesc strong{color:var(--qa-ink);font-weight:600}.demoStepDesc{color:var(--qa-ink-muted);text-wrap:pretty;margin:0;font-size:.875rem;line-height:1.5}.demoRecipe{border:1px solid var(--qa-line);background:var(--qa-canvas-raised);color:var(--qa-ink-muted);border-radius:10px;grid-template-columns:1fr auto;align-items:baseline;gap:.875rem 1.5rem;padding:1rem 1.25rem;font-size:.8125rem;display:grid}.demoRecipeLabel{color:var(--qa-ink);margin:0;font-weight:600}.demoRecipe dl{grid-area:2/1/auto/-1;grid-template-columns:minmax(0,1fr);gap:.625rem 2rem;margin:0;display:grid}@media (width>=1024px){.demoRecipe dl{grid-template-columns:repeat(2,minmax(0,1fr))}}.demoRecipe dl>div{flex-direction:column;gap:.25rem;display:flex}@media (width>=1024px){.demoRecipe dl>div{flex-flow:wrap;align-items:baseline;gap:.25rem .625rem}}.demoRecipe dt{white-space:nowrap}.demoRecipe dd{color:var(--qa-ink);margin:0}.demoRecipe code,.demoStepDesc code{white-space:nowrap;background:var(--qa-line);color:var(--qa-ink);border-radius:4px;padding:.125em .375em}.demoRecipeNote{color:var(--qa-ink-muted);margin-left:.5rem}.demoRecipe a{color:var(--qa-accent);white-space:nowrap;justify-self:end;font-weight:500}.demoRecipe a:hover{text-underline-offset:3px;text-decoration:underline}@media (width<=479px){.demoRecipe{grid-template-columns:minmax(0,1fr)}.demoRecipe a{grid-row:3;justify-self:start}}.buttonPrimary,.buttonSecondary{border-radius:10px;justify-content:center;align-items:center;min-height:2.75rem;padding:0 1.25rem;font-size:.9375rem;text-decoration:none;transition:background-color .15s,box-shadow .15s,color .15s;display:inline-flex}.buttonPrimary{background:var(--qa-cta-bg);color:var(--qa-cta-fg);font-weight:600;box-shadow:0 1px 2px #18181b14,inset 0 1px #ffffff2e}.buttonPrimary:hover{background:var(--qa-cta-bg-hover);box-shadow:0 4px 12px #5a4aec47,inset 0 1px #ffffff38}.buttonSecondary{text-align:center;color:var(--qa-ink);box-shadow:inset 0 0 0 1px var(--qa-line-strong);padding-block:.5rem;font-weight:500;line-height:1.3}.buttonSecondary:hover{background:var(--qa-line)}.section{border-top:1px solid var(--qa-line);padding-block:clamp(4rem,8vw,6rem)}.sectionHead{flex-direction:column;gap:.875rem;margin-bottom:2.5rem;display:flex}.sectionHeadSplit{flex-flow:wrap;justify-content:space-between;align-items:flex-end;gap:1rem 2rem}.sectionHeadSplit>div{flex-direction:column;gap:.875rem;display:flex}.sectionTitle{letter-spacing:-.024em;color:var(--qa-ink);text-wrap:balance;max-width:24ch;margin:0;font-size:clamp(1.75rem,2.25vw + .75rem,2.5rem);font-weight:600;line-height:1.12}.choiceTypes{grid-template-columns:1fr;gap:.75rem;display:grid}@media (width>=640px){.choiceTypes{grid-template-columns:repeat(2,1fr)}}@media (width>=1180px){.choiceTypes{grid-template-columns:repeat(4,1fr)}}.choiceTypes>li{display:flex}.choiceType,.example{background:var(--qa-canvas-raised);border:1px solid var(--qa-line);border-radius:12px;flex-direction:column;width:100%;transition:border-color .2s;display:flex}.choiceType:hover,.example:hover{border-color:var(--qa-line-strong)}.choiceType{gap:.5rem;padding:1.5rem}.choiceIcon{background:var(--qa-accent-soft);width:2.25rem;height:2.25rem;color:var(--qa-accent);border-radius:9px;justify-content:center;align-items:center;margin-bottom:.5rem;display:inline-flex}.choiceIcon svg{width:1.125rem;height:1.125rem}.choiceName{letter-spacing:-.01em;color:var(--qa-ink);font-size:1.0625rem;font-weight:600}.choiceDesc{color:var(--qa-ink-muted);text-wrap:pretty;flex:1;font-size:.9375rem;line-height:1.55}.choiceExample{text-wrap:balance;border-top:1px solid var(--qa-line);color:var(--qa-ink-subtle);margin-top:.75rem;padding-top:.875rem;font-size:.8125rem;line-height:1.45}.choiceExample:before{content:"e.g. "}.further{gap:1.25rem;margin-top:3rem;display:grid}@media (width>=1024px){.further{grid-template-columns:12rem 1fr;align-items:start}}.furtherTitle{color:var(--qa-ink);margin:0;font-size:.9375rem;font-weight:600}.furtherList{grid-template-columns:1fr;gap:1.25rem 2rem;display:grid}@media (width>=640px){.furtherList{grid-template-columns:repeat(2,1fr)}}.furtherList a{gap:.25rem;display:grid}.furtherName{color:var(--qa-accent);font-size:.9375rem;font-weight:600}.furtherList a:hover .furtherName{text-underline-offset:3px;text-decoration:underline}.furtherDesc{text-wrap:balance;color:var(--qa-ink-muted);font-size:.875rem;line-height:1.5}.examples{grid-template-columns:1fr;gap:.75rem;display:grid}@media (width>=768px){.examples{grid-template-columns:repeat(2,1fr)}}.examples>li{display:flex}.example{gap:.5rem;padding:1.5rem 1.75rem}.exampleType{color:var(--qa-ink-subtle);align-items:center;gap:.375rem;margin-bottom:.25rem;font-size:.8125rem;font-weight:500;display:inline-flex}.exampleType svg{width:.9375rem;height:.9375rem;color:var(--qa-accent)}.exampleTitle{letter-spacing:-.01em;color:var(--qa-ink);font-size:1.125rem;font-weight:600}.example:hover .exampleTitle{text-decoration:underline;text-decoration-color:var(--qa-line-strong);text-underline-offset:4px}.exampleDesc{color:var(--qa-ink-muted);text-wrap:pretty;font-size:.9375rem;line-height:1.55}.quickStart{text-align:center}.quickStart .sectionHead{align-items:center}.steps{grid-template-columns:1fr;gap:2rem;margin:0;padding:0;list-style:none;display:grid}@media (width>=768px){.steps{grid-template-columns:repeat(3,1fr);gap:2.5rem}}.step{flex-direction:column;align-items:center;gap:.5rem;display:flex}.stepNumber{background:var(--qa-canvas-raised);border:1px solid var(--qa-line-strong);font-variant-numeric:tabular-nums;width:2rem;height:2rem;color:var(--qa-accent);border-radius:999px;justify-content:center;align-items:center;margin-bottom:.25rem;font-size:.875rem;font-weight:600;display:inline-flex}.stepTitle{letter-spacing:-.01em;color:var(--qa-ink);margin:0;font-size:1.0625rem;font-weight:600}.stepDesc{color:var(--qa-ink-muted);text-wrap:pretty;max-width:30ch;margin:0;font-size:.9375rem;line-height:1.55}.quickStartCta{flex-wrap:wrap;justify-content:center;gap:.75rem;margin-top:3rem;display:flex}.siteFooter{border-top:1px solid var(--qa-line);background:var(--qa-canvas-raised);color:var(--qa-ink-muted);padding:3rem 0 2.5rem;font-size:.875rem}.footerGrid{grid-template-columns:repeat(2,1fr);gap:2rem;display:grid}@media (width>=768px){.footerGrid{grid-template-columns:2fr repeat(3,1fr)}}.footerBrand{color:var(--qa-ink);grid-column:1/-1;align-self:start;align-items:center;gap:.5rem;font-weight:650;display:flex}@media (width>=768px){.footerBrand{grid-column:auto}}.footerTitle{color:var(--qa-ink);margin:0 0 .75rem;font-weight:600}.footerGrid ul{gap:.5rem;display:grid}.footerGrid a:hover{color:var(--qa-ink)}.footerMeta{border-top:1px solid var(--qa-line);color:var(--qa-ink-subtle);margin:2.5rem 0 0;padding-top:1.5rem;font-size:.8125rem}@media (prefers-reduced-motion:reduce){.demoShot,.demoStep,.choiceType,.example,.buttonPrimary,.buttonSecondary{transition:none}}