:root{--ctp-rosewater:#dc8a78;--ctp-flamingo:#dd7878;--ctp-pink:#ea76cb;--ctp-mauve:#8839ef;--ctp-red:#d20f39;--ctp-maroon:#e64553;--ctp-peach:#fe640b;--ctp-yellow:#df8e1d;--ctp-green:#40a02b;--ctp-teal:#179299;--ctp-sky:#04a5e5;--ctp-sapphire:#209fb5;--ctp-blue:#1e66f5;--ctp-lavender:#7287fd;--ctp-text:#4c4f69;--ctp-subtext1:#5c5f77;--ctp-subtext0:#6c6f85;--ctp-overlay2:#7c7f93;--ctp-overlay1:#8c8fa1;--ctp-overlay0:#9ca0b0;--ctp-surface2:#acb0be;--ctp-surface1:#bcc0cc;--ctp-surface0:#ccd0da;--ctp-base:#eff1f5;--ctp-mantle:#e6e9ef;--ctp-crust:#dce0e8}@media (prefers-color-scheme:dark){:root{--ctp-rosewater:#f4dbd6;--ctp-flamingo:#f0c6c6;--ctp-pink:#f5bde6;--ctp-mauve:#c6a0f6;--ctp-red:#ed8796;--ctp-maroon:#ee99a0;--ctp-peach:#f5a97f;--ctp-yellow:#eed49f;--ctp-green:#a6da95;--ctp-teal:#8bd5ca;--ctp-sky:#91d7e3;--ctp-sapphire:#7dc4e4;--ctp-blue:#8aadf4;--ctp-lavender:#b7bdf8;--ctp-text:#cad3f5;--ctp-subtext1:#b8c0e0;--ctp-subtext0:#a5adcb;--ctp-overlay2:#939ab7;--ctp-overlay1:#8087a2;--ctp-overlay0:#6e738d;--ctp-surface2:#5b6078;--ctp-surface1:#494d64;--ctp-surface0:#363a4f;--ctp-base:#24273a;--ctp-mantle:#1e2030;--ctp-crust:#181926}}.token.comment,.token.prolog,.token.doctype,.token.cdata{color:var(--ctp-overlay1)}.token.punctuation{color:var(--ctp-overlay2)}.token.namespace{opacity:.7}.token.property,.token.tag,.token.boolean,.token.number,.token.constant,.token.symbol,.token.deleted{color:var(--ctp-mauve)}.token.selector,.token.attr-name,.token.string,.token.char,.token.builtin,.token.inserted{color:var(--ctp-green)}.token.operator,.token.entity,.token.url,.language-css .token.string,.style .token.string{color:var(--ctp-peach);background:color-mix(in oklab, var(--ctp-base) 50%, transparent)}.token.atrule,.token.attr-value,.token.keyword{color:var(--ctp-sapphire)}.token.function,.token.class-name{color:var(--ctp-mauve)}.token.regex,.token.important,.token.variable{color:var(--ctp-yellow)}.token.important,.token.bold{font-weight:700}.token.italic{font-style:italic}.token.entity{cursor:help}:root{--nm-backdrop-color:#000c;--nm-backdrop-filter:none;--nm-backdrop-z-index:0;--nm-z-index:1;--nm-scrollbar-track-color:transparent;--nm-scrollbar-thumb-color:#ffffff80;--nm-radius:20px;--nm-max-width:50rem;--nm-background:white;--nm-duration:.35s;--nm-close-top:0;--nm-close-margin:0;--nm-scrollbar-width:0;--nm-scroll-position:0}.nano-modal,.nano-modal__backdrop,.nano-modal__wrapper,.nano-modal__content,.nano-modal__close-button{box-sizing:border-box;margin:0;padding:0}.nano-modal{width:100%;max-width:100%;height:100%;max-height:100%;color:inherit;touch-action:auto;overscroll-behavior:none;z-index:var(--nm-z-index);transition:opacity var(--nm-duration);scrollbar-width:thin;scrollbar-color:var(--nm-scrollbar-thumb-color) var(--nm-scrollbar-track-color);background:0 0;border:none;outline:none;position:fixed;inset:0}.nano-modal--closing[open]{opacity:.999}.nano-modal::backdrop{opacity:0;background-color:#0000}.nano-modal__backdrop{background:var(--nm-backdrop-color);-webkit-backdrop-filter:var(--nm-backdrop-filter);backdrop-filter:var(--nm-backdrop-filter);opacity:1;transition:opacity var(--nm-duration), transform var(--nm-duration), backdrop-filter var(--nm-duration);z-index:var(--nm-backdrop-z-index);display:none;position:fixed;inset:0}body:has(.nano-modal--closing[open]) .nano-modal__backdrop{opacity:0}html:has(.nano-modal[open]){touch-action:none;height:100%;overflow:hidden}body:has(.nano-modal[open]){touch-action:none;inset:0;position:fixed;inset-block-start:var(--nm-negative-margin);inset-inline-end:var(--nm-scrollbar-width);overflow:hidden}body:has(.nano-modal[open]) .nano-modal__backdrop{display:block}.nano-modal__wrapper{pointer-events:none}.nano-modal__content{background:var(--nm-background);max-width:var(--nm-max-width);pointer-events:all;z-index:0;will-change:transform, opacity;transition:opacity var(--nm-duration), transform var(--nm-duration);margin-inline:auto}.nano-modal__close-button{color:inherit;background:inherit;z-index:1;float:inline-end;top:var(--nm-close-top);margin:var(--nm-close-margin);cursor:pointer;border:none;position:sticky}@starting-style{body:has(.nano-modal[open]) .nano-modal__backdrop{opacity:0}}@starting-style{.nano-modal[open] .nano-modal__content{opacity:0}}.nano-modal--closing[open] .nano-modal__content{opacity:0}:root:has(.nano-modal[open]:not(#modal-unstyled)) :root{--nm-close-top:1rem}@starting-style{:root:has(.nano-modal[open]:not(#modal-unstyled)) .nano-modal[open] .nano-modal__content{transform:translateY(3rem)}}:root:has(.nano-modal[open]:not(#modal-unstyled)) .nano-modal--closing[open] .nano-modal__content{transform:translateY(3rem)}:root:has(.nano-modal[open]:not(#modal-unstyled)) .nano-modal__wrapper{flex-direction:column;justify-content:flex-end;min-height:90dvh;margin-block-start:10dvh;margin-inline:auto;display:flex}@media (width>=600px){:root:has(.nano-modal[open]:not(#modal-unstyled)) .nano-modal__wrapper{justify-content:center;min-height:calc(100dvh - 8rem);margin-block:4rem;padding-inline:2rem}}@media (width>=900px){:root:has(.nano-modal[open]:not(#modal-unstyled)) .nano-modal__wrapper{min-height:calc(100dvh - 12rem);margin-block:6rem;padding-inline:4rem}}:root:has(.nano-modal[open]:not(#modal-unstyled)) .nano-modal__content{border-start-start-radius:var(--nm-radius);border-start-end-radius:var(--nm-radius)}@media (width>=600px){:root:has(.nano-modal[open]:not(#modal-unstyled)) .nano-modal__content{border-radius:var(--nm-radius)}}:root:has(.nano-modal[open]:not(#modal-unstyled)) .nano-modal__close-button{padding:.5rem}:root{--bg:#fdfdff;--fg:#223;--fg-light:#445;--fg-white:#fff;--accent-1:oklch(64% .23 5);--accent-2:oklch(68% .25 250);--stripes-color-1:oklch(64% .23 5/.03);--stripes-color-2:oklch(64% .23 5/.07);--stripes-thickness:10px;--scrollbar-thumb:#00000040;--fg-nav:#778;--border-color:#eee;--bg-code:#f7f8fb;--fg-code:#3c3f49}@media (prefers-color-scheme:dark){:root{--bg:#131315;--fg:#fff6f6;--fg-light:#faeef6;--fg-white:#faeef6;--accent-1:oklch(60% .23 5);--accent-2:oklch(68% .25 250);--stripes-color-1:#8c325033;--stripes-color-2:#8c32504d;--stripes-thickness:10px;--scrollbar-thumb:#ffffff59;--fg-nav:#99a;--border-color:#222;--bg-code:#16171b;--fg-code:#cdd6f4;--nm-backdrop-color:#3232374d;--nm-background:#131315}.btn{--accent-1:oklch(48% .2 5)}}*{box-sizing:border-box;margin:0;padding:0}:focus-visible{outline:2px solid var(--accent-1);outline-offset:2px}html{scrollbar-color:var(--scrollbar-thumb) transparent}body{background:var(--bg);color:var(--fg);-webkit-font-smoothing:antialiased;font-family:system-ui,Inter,Roboto,Helvetica Neue,Arial Nova,Nimbus Sans,Arial,sans-serif;font-size:1rem;font-weight:500;line-height:1.5}@media (width>=600px){body{font-size:1.125rem}}@media (width>=900px){body{font-size:1.25rem}}img,picture,video,canvas,svg{max-width:100%;display:block}input,button,textarea,select{font:inherit}button{cursor:pointer;background:0 0;border:none}a{color:inherit}a:hover{color:var(--accent-1)}ul,ol{padding-left:1.15em}li::marker{color:var(--accent-1)}h1,h2,h3{overflow-wrap:break-word;letter-spacing:-.03em;text-wrap:balance;text-wrap:pretty;margin:0;padding:0;font-size:1.75rem;font-weight:700;line-height:1.1}@media (width>=600px){h1,h2,h3{font-size:2rem}}@media (width>=900px){h1,h2,h3{font-size:2.25rem}}h3{font-size:1.25rem}@media (width>=600px){h3{font-size:1.5rem}}@media (width>=900px){h3{font-size:1.75rem}}p,li{color:var(--fg-light)}pre{scrollbar-width:thin;scrollbar-color:var(--border-color) transparent;max-width:100%;color:var(--fg-code);background-color:var(--bg-code);border:1px solid var(--border-color);border-radius:8px;padding:.75rem;line-height:1.3;overflow:auto}code{color:var(--fg-code);font-family:ui-monospace,Cascadia Code,Source Code Pro,Menlo,Consolas,DejaVu Sans Mono,monospace;font-size:.875em}p code,li code{color:var(--accent-1)}pre code{font-size:.875em}@media (width>=600px){pre code{font-size:1rem}}.h1{margin-bottom:.5em;font-size:2.5rem;line-height:1}@media (width>=600px){.h1{font-size:3.5rem}}@media (width>=900px){.h1{font-size:5rem}}.h2{color:var(--fg-light);margin-bottom:.5em;font-size:1.75rem;line-height:1}@media (width>=600px){.h2{font-size:2.25rem}}@media (width>=900px){.h2{font-size:3rem}}.h2 code{font-family:ui-monospace,Cascadia Code,Source Code Pro,Menlo,Consolas,DejaVu Sans Mono,monospace;font-size:.75em}.accent-1{color:var(--accent-1)}.accent-2{color:var(--accent-2)}.btn{background:var(--accent-1);color:var(--fg-white);border-radius:4px;padding:.375rem .5rem;font-size:.875rem;font-weight:700;line-height:1;transition:background .25s}.btn:hover{background:#000}.btn--accent-2{background:var(--accent-2)}.btn--lg{border-radius:8px;padding:.75rem 1rem;font-size:1rem}@media (width>=600px){.btn--lg{padding:1rem 1.25rem}}#debug{display:none;position:fixed;top:.5rem;left:.5rem}#debug:target{flex-wrap:wrap;gap:.25rem;display:flex}.nano-modal__content p+p{margin-top:1em}.mb{margin-bottom:1rem}.stripe{background:var(--accent-1);width:100%;height:.25rem;position:fixed;top:0}.nav{display:none}@media (width>=900px){.nav{margin-top:calc(-1 * var(--nm-negative-margin));align-self:flex-start;display:block;position:sticky;top:2rem}}.nav__link,.nav__link-external{color:var(--fg-nav);padding:.375rem 0;font-size:1rem;font-weight:600;text-decoration:none;display:block}.nav__link:hover,.nav__link-external:hover{color:var(--fg)}.nav__logo{background:var(--accent-1);color:var(--accent-1);border-radius:.5em;place-items:center;width:4em;height:3em;margin-bottom:1em;font-weight:900;line-height:1;text-decoration:none;display:grid}.nav__logo span{background:var(--fg-white);border-radius:.25em;padding:.25em .75em}.nav__trigger{background:var(--accent-1);color:var(--fg-white);border-radius:.25em;padding:.5em .75em;font-weight:900;transition:background .25s;position:fixed;top:1.75rem;right:1.25rem}body:has(.nano-modal[open]) .nav__trigger{right:calc(1.25rem + var(--nm-scrollbar-width))}.nav__trigger:hover{background-color:#000}@media (width>=900px){.nav__trigger{display:none}}.nav__trigger svg{width:1em}#modal-nav .nano-modal__content{width:100%}.page{max-width:60rem;margin:0 auto;padding:1.25rem}@media (width>=600px){.page{padding:1.5rem}}@media (width>=900px){.page{grid-template-columns:10rem 1fr;gap:2rem;padding:2rem;display:grid}}.main{min-width:0}.content>*+*{margin-top:1em}.content h2,.content h3{margin-top:.5em;padding-top:1em}.demo-modal-trigger{border:1px solid var(--stripes-color-2);background:repeating-linear-gradient(35deg, var(--stripes-color-1), var(--stripes-color-1) var(--stripes-thickness), var(--stripes-color-2) var(--stripes-thickness), var(--stripes-color-2) calc(var(--stripes-thickness) * 2));border-radius:8px;place-items:center;max-width:24rem;padding:2.5em 0;display:grid}.nano-modal--base .nano-modal__content{padding:1.25rem}@media (width>=600px){.nano-modal--base .nano-modal__content{padding:1.5rem}}@media (width>=900px){.nano-modal--base .nano-modal__content{padding:2rem}}.nano-modal--base h2{margin-bottom:1rem}.nano-modal--base .nano-modal__close-button{font-size:.875em;font-weight:500;line-height:1}:root:has(.custom-modal[open]){--nm-backdrop-color:oklch(64% .2 5/.05);--nm-backdrop-filter:blur(100px)}:root:has(.custom-modal[open]:not(#modal-unstyled)) .custom-modal{--nm-close-top:1rem;--nm-duration:.5s;--nm-max-width:30rem;--nm-radius:0}:root:has(.custom-modal[open]:not(#modal-unstyled)) .custom-modal h2{margin-bottom:1.25rem}@starting-style{:root:has(.custom-modal[open]:not(#modal-unstyled)) .custom-modal[open] .nano-modal__content{transform:rotate(180deg)scale(.7)}}:root:has(.custom-modal[open]:not(#modal-unstyled)) .custom-modal.nano-modal--closing[open] .nano-modal__content{transform:rotate(-180deg)scale(.7)}:root:has(.custom-modal[open]:not(#modal-unstyled)) .custom-modal .nano-modal__wrapper{flex-direction:column;justify-content:center;min-height:calc(100dvh - 8rem);margin-block:4rem;margin-inline:auto;padding-inline:2rem;display:flex}:root:has(.custom-modal[open]:not(#modal-unstyled)) .custom-modal .nano-modal__content{border:2px solid var(--accent-1);background-color:var(--bg);background-image:repeating-linear-gradient(35deg, var(--stripes-color-1), var(--stripes-color-1) var(--stripes-thickness), var(--stripes-color-2) var(--stripes-thickness), var(--stripes-color-2) calc(var(--stripes-thickness) * 2));padding:1.25rem}@media (width>=600px){:root:has(.custom-modal[open]:not(#modal-unstyled)) .custom-modal .nano-modal__content{padding:2rem}}:root:has(.custom-modal[open]:not(#modal-unstyled)) .custom-modal .nano-modal__close-button{padding:.5rem}.footer{font-family:.875em;margin-top:6rem}[data-nm-open],.destroy{filter:grayscale()}:is(body:has([data-nm-init=true]) [data-nm-open],body:has([data-nm-init=true]) .destroy){filter:none}.hidden{display:none}.thin-scrollbar{scrollbar-width:thin}