:root{--color-white: #fffef4;--color-black: #07121f;--color-pure-white: #ffffff;--color-pure-black: #000000;--color-primary: #e91e63;--color-primary-text: #ffffff;--color-secondary: #422abf;--color-third: #bf3f2a;--color-coral: #d15c49;--color-indigo: #382f9c;--color-bg: #ffffff;--color-bg-fade: rgba(0, 0, 0, .5);--color-bg-faint: rgba(0, 0, 0, .05);--color-bg-subtle: rgba(255, 255, 255, .05);--color-bg-subtle-hover: rgba(255, 255, 255, .1);--color-text: #000000;--color-text-muted: rgba(0, 0, 0, .6);--color-text-light: rgba(255, 255, 255, .8);--color-cover-bg: #07121f;--color-cover-text: #fffef4;--color-cover-tag: #89dc12;--color-section-svg: var(--color-white);--color-section-animation: var(--color-cover-bg);--color-section-shapes: var(--color-white);--color-section-cli: var(--color-indigo);--color-section-examples: #141c28;--color-section-support: var(--color-white);--color-section-footer: #f7f6ea;--color-nav-hover-bg: rgba(255, 255, 255, .15);--color-mainnav-bg: #121212;--color-mainnav-text: var(--color-white);--color-border: #333333;--color-bracket: rgba(255, 255, 255, .35);--color-scrollbar: rgba(255, 255, 255, .3);--color-scrollbar-track: transparent;--color-inline-code-bg: #25292e;--color-code-bg: #f5f6f7;--color-code-border: rgba(0, 0, 0, .067);--color-code-text: #000000;--inline-code-shadow: none;--color-success-bg: #d2dd59;--color-success-text: #153411;--color-link: #0070f3;--color-em-bg: #07121fcc;--color-em-text: #ffffff;--shadow-sm: 0 .2rem .4rem rgba(0, 0, 0, .125);--shadow-md: 0 .6rem .8rem rgba(0, 0, 0, .313);--shadow-card: 0 .2rem .4rem rgba(0, 0, 0, .125), 0 .6rem .8rem rgba(0, 0, 0, .313);--radius: 6px;--radius-sm: 3px;--radius-md: 4px;--radius-lg: 999px;--star-color: #fabe1d;--color-star: #f59e0b;--color-bg-preview: #1a1a2e;--color-bg-code: #1e1e1e;--color-error: #dc2626;--color-error-bg: rgba(239, 68, 68, .1);--color-error-border: rgba(239, 68, 68, .3);--color-primary-dark: #c2185b}@media(prefers-color-scheme:dark){:root{--color-bg: #121212;--color-text: var(--color-white);--color-mainnav-bg: #121212;--color-mainnav-text: var(--color-white);--color-border: #333333;--color-scrollbar: rgba(255, 255, 255, .3);--color-inline-code-bg: #25292e;--color-code-bg: transparent;--color-code-border: transparent;--inline-code-shadow: none}}@media(prefers-color-scheme:light){:root{--color-bg: #ffffff;--color-text: var(--color-black);--color-mainnav-bg: #ffffff;--color-mainnav-text: var(--color-black);--color-border: #ddd;--color-scrollbar: rgba(0, 0, 0, .3);--color-cover-tag: #89dc12;--color-inline-code-bg: #f5f6f7;--color-code-bg: #f5f6f7;--color-code-border: rgba(0, 0, 0, .067);--inline-code-shadow: inset 0 0 0 1px rgba(0, 0, 0, .067)}}@font-face{font-family:Space Grotesk;src:url(/fonts/space-grotesk/SpaceGrotesk-Variable.woff2) format("woff2");font-style:normal;font-weight:300 700;font-display:swap}:root{--font-brand: "Space Grotesk", system-ui, sans-serif;--font-mono: ui-monospace, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace}html{scrollbar-gutter:stable;scrollbar-width:thin}*{margin:0;padding:0;box-sizing:border-box}ul{list-style:none}h1,h2,h3,h4,h5,h6{font-weight:700}img,picture,video{max-width:100%;display:block}body{-webkit-overflow-scrolling:touch;-webkit-text-size-adjust:100%;font-size:100%;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif}.brand-wordmark{font-family:var(--font-brand);font-weight:520;letter-spacing:-.035em}button{all:unset;box-sizing:border-box}input,button{font:inherit}css-doodle:not(:defined){visibility:hidden}button,css-doodle[click\:update]{touch-action:manipulation;-webkit-tap-highlight-color:transparent}.wrap{max-width:70rem;margin-inline:auto;padding-inline:2rem}.wrap>h2{font-size:2.4rem;margin-block-end:1.5rem;position:relative}.button-round{padding:.8rem 1.4rem;color:currentColor;border:1px solid currentColor;font-size:1.4rem;display:inline-flex;align-items:center;text-decoration:none;border-radius:var(--radius-lg);transition:background .2s ease,border-color .2s ease,color .2s ease,transform .2s ease,box-shadow .2s ease}.button-round:hover{background-color:var(--color-bg-subtle-hover)}.button-round:active{transform:scale(.96)}.button-round:focus-visible{outline:2px solid currentColor;outline-offset:2px}.button-round svg{margin-inline-start:.5rem;margin-inline-end:-.4rem;width:1.2rem;height:1.2rem}.button-round-fill{background:var(--color-cover-text);border-color:var(--color-cover-text);color:var(--color-cover-bg);font-weight:500}.button-round-fill:hover{background:var(--color-pure-white);border-color:var(--color-pure-white);box-shadow:0 0 0 3px color-mix(in srgb,var(--color-cover-text) 32%,transparent),0 0 22px color-mix(in srgb,var(--color-cover-text) 20%,transparent)}.button-round-fill:focus-visible{outline-color:var(--color-cover-text)}