:root{--vellum-50:#faf6ee;--vellum-100:#f4eee2;--vellum-150:#eee7d9;--vellum-200:#e7decd;--vellum-300:#daceb8;--vellum-400:#c9baa0;--graphite-300:#b3a796;--graphite-400:#978b7b;--graphite-500:#766c60;--graphite-600:#5c544b;--graphite-800:#3a342e;--graphite-900:#2a2622;--umber-1000:#120d09;--umber-950:#18120d;--umber-900:#201811;--umber-850:#281e16;--umber-800:#31251b;--umber-700:#45362a;--umber-600:#5b4838;--umber-500:#7c6752;--parchment-100:#f1e6d2;--parchment-300:#cbbba2;--parchment-500:#a38f76;--pine-100:#d8e8df;--pine-300:#86c4ab;--pine-400:#5fae8f;--pine-500:#1f5e4a;--pine-600:#194d3d;--pine-700:#133d30;--pine-900:#12302a;--ochre-400:#d8a64e;--ochre-600:#94650f;--sage-400:#9db282;--sage-600:#4f6a40;--madder-400:#e0705e;--madder-600:#a3302a;--clay-400:#b8876a;--slate-300:#9db6c3;--slate-400:#7f929b;--slate-600:#3e5f70;--rose-400:#c98a9a;--bg-app:var(--vellum-100);--bg-sunken:var(--vellum-200);--surface-1:var(--vellum-50);--surface-2:var(--vellum-150);--surface-3:var(--vellum-200);--surface-inverse:var(--graphite-900);--fg-1:var(--graphite-900);--fg-2:var(--graphite-600);--fg-3:var(--graphite-500);--fg-4:var(--graphite-400);--fg-inverse:var(--vellum-50);--fg-on-accent:#fff8f0;--border-1:var(--vellum-300);--border-2:var(--vellum-400);--border-strong:var(--graphite-500);--rule:var(--graphite-900);--accent:var(--pine-500);--accent-hover:var(--pine-600);--accent-press:var(--pine-700);--accent-fg:var(--pine-600);--accent-subtle:var(--pine-100);--focus-ring:var(--pine-500);--state-running:var(--pine-500);--state-running-bg:var(--pine-100);--state-waiting:var(--ochre-600);--state-waiting-bg:#f1e2c1;--state-done:var(--slate-600);--state-done-bg:#dce5ea;--state-error:var(--madder-600);--state-error-bg:#f2d7d0;--state-stopped:var(--graphite-500);--state-stopped-bg:var(--vellum-200);--data-1:var(--ochre-400);--data-2:var(--slate-400);--data-3:var(--clay-400);--data-4:var(--rose-400);--data-5:var(--graphite-400);--data-6:var(--pine-300);--text-body:var(--fg-1);--text-muted:var(--fg-2);--text-subtle:var(--fg-3);--text-link:var(--accent-fg);--surface-card:var(--surface-1);--surface-overlay:#2a262252;--surface-code:var(--vellum-150);--code-fg:var(--graphite-900);--code-muted:var(--graphite-400);--code-border:var(--vellum-300);--code-hl:#1f5e4a1a;--grid-minor:#78604017;--grid-major:#7860402b}[data-theme=dark]{--bg-app:var(--umber-950);--bg-sunken:var(--umber-1000);--surface-1:var(--umber-900);--surface-2:var(--umber-850);--surface-3:var(--umber-800);--surface-inverse:var(--parchment-100);--fg-1:var(--parchment-100);--fg-2:var(--parchment-300);--fg-3:var(--parchment-500);--fg-4:var(--umber-500);--fg-inverse:var(--umber-950);--fg-on-accent:var(--umber-1000);--border-1:var(--umber-700);--border-2:var(--umber-600);--border-strong:var(--umber-500);--rule:var(--parchment-300);--accent:var(--pine-400);--accent-hover:var(--pine-300);--accent-press:var(--pine-500);--accent-fg:var(--pine-300);--accent-subtle:var(--pine-900);--focus-ring:var(--pine-400);--state-running:var(--pine-300);--state-running-bg:var(--pine-900);--state-waiting:var(--ochre-400);--state-waiting-bg:#3d2c12;--state-done:var(--slate-300);--state-done-bg:#1c2a33;--state-error:var(--madder-400);--state-error-bg:#45190f;--state-stopped:var(--parchment-500);--state-stopped-bg:var(--umber-800);--surface-overlay:#0a0705b3;--surface-code:var(--umber-1000);--code-fg:var(--parchment-100);--code-muted:var(--umber-500);--code-border:var(--umber-700);--code-hl:#5fae8f24;--grid-minor:#f1e6d20b;--grid-major:#f1e6d217}:root{--font-sans:"IBM Plex Sans",system-ui,sans-serif;--font-mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;--font-serif:"Newsreader",Georgia,serif;--font-display:var(--font-serif);--fs-11:11px;--fs-12:12px;--fs-13:13px;--fs-14:14px;--fs-16:16px;--fs-18:18px;--fs-22:22px;--fs-30:30px;--fs-44:44px;--fs-64:64px;--fs-88:88px;--lh-tight:1;--lh-snug:1.2;--lh-body:1.55;--lh-prose:1.6;--lh-code:1.6;--tracking-display:-.02em;--tracking-tight:-.01em;--tracking-label:.12em;--fw-regular:400;--fw-medium:500;--fw-semibold:600;--type-display:var(--fw-regular)var(--fs-64)/var(--lh-tight)var(--font-display);--type-h1:var(--fw-regular)var(--fs-44)/1.05 var(--font-display);--type-h2:var(--fw-regular)var(--fs-30)/var(--lh-snug)var(--font-display);--type-h3:var(--fw-semibold)var(--fs-18)/var(--lh-snug)var(--font-sans);--type-prose:var(--fw-regular)var(--fs-18)/var(--lh-prose)var(--font-serif);--type-body:var(--fw-regular)var(--fs-16)/var(--lh-body)var(--font-sans);--type-body-sm:var(--fw-regular)var(--fs-14)/var(--lh-body)var(--font-sans);--type-ui:var(--fw-medium)var(--fs-13)/1 var(--font-sans);--type-label:var(--fw-medium)var(--fs-11)/1 var(--font-mono);--type-code:var(--fw-regular)var(--fs-13)/var(--lh-code)var(--font-mono)}:root{--space-0:0;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--space-16:64px;--space-24:96px;--radius-0:0;--radius-1:1px;--radius-2:2px;--radius-3:2px;--radius-pill:999px;--border-width:1px;--control-h-sm:26px;--control-h-md:32px;--control-h-lg:40px;--content-max:1120px;--prose-max:680px;--sidebar-w:248px}:root{--shadow-0:none;--shadow-pop:0 0 0 1px var(--border-2),0 8px 24px #3c28141f;--shadow-dialog:0 0 0 1px var(--border-2),0 24px 64px #3c281433;--ring:0 0 0 2px var(--bg-app),0 0 0 4px var(--focus-ring);--ease-step:cubic-bezier(.2,0,0,1);--ease-out:cubic-bezier(.16,1,.3,1);--dur-instant:80ms;--dur-fast:.14s;--dur-base:.22s;--dur-slow:.36s;--bg-grid:linear-gradient(var(--grid-major)1px,transparent 1px)-1px -1px/40px 40px,linear-gradient(90deg,var(--grid-major)1px,transparent 1px)-1px -1px/40px 40px,linear-gradient(var(--grid-minor)1px,transparent 1px)-1px -1px/8px 8px,linear-gradient(90deg,var(--grid-minor)1px,transparent 1px)-1px -1px/8px 8px}[data-theme=dark]{--shadow-pop:0 0 0 1px var(--border-2),0 8px 24px #00000080;--shadow-dialog:0 0 0 1px var(--border-2),0 24px 64px #0009}scxml-explorer,scxml-view{--scxml-bg:var(--bg-app);--scxml-surface:var(--surface-1);--scxml-surface-2:var(--surface-2);--scxml-surface-3:var(--surface-3);--scxml-fg:var(--fg-1);--scxml-fg-muted:var(--fg-2);--scxml-fg-subtle:var(--fg-2);--scxml-fg-faint:var(--fg-3);--scxml-border:var(--border-1);--scxml-border-2:var(--border-2);--scxml-border-strong:var(--border-strong);--scxml-accent:var(--accent);--scxml-accent-text:var(--accent-fg);--scxml-accent-subtle:var(--accent-subtle);--scxml-on-accent:var(--fg-on-accent);--scxml-running:var(--state-running);--scxml-running-bg:var(--state-running-bg);--scxml-waiting:color-mix(in srgb,var(--state-waiting)80%,var(--fg-1));--scxml-waiting-bg:var(--state-waiting-bg);--scxml-done:var(--state-done);--scxml-done-bg:var(--state-done-bg);--scxml-error:var(--state-error);--scxml-font-sans:var(--font-sans);--scxml-font-mono:var(--font-mono);--scxml-font-display:var(--font-serif);--scxml-display-weight:400;--scxml-radius:var(--radius-2);--scxml-duration:var(--dur-fast)}*,*:before,*:after{box-sizing:border-box}:root{--buncss-light:initial;--buncss-dark: ;color-scheme:light;--header-h:56px;--content-max:760px;--page-max:1320px;--gutter:var(--space-6)}:root[data-theme=dark]{--buncss-light: ;--buncss-dark:initial;color-scheme:dark}html{background:var(--bg-app);scroll-padding-top:calc(var(--header-h) + var(--space-4))}body{display:flex;color:var(--fg-1);font:var(--type-body);background:var(--bg-app);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;flex-direction:column;min-height:100vh;margin:0}main{flex:1}a{color:var(--text-link);text-decoration-color:color-mix(in srgb,currentColor 40%,transparent);text-underline-offset:3px}a:hover{color:var(--fg-1);text-decoration-color:currentColor}::selection{background:var(--accent-subtle);color:var(--fg-1)}:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}img,video{max-width:100%;height:auto}code,kbd,pre{font-family:var(--font-mono)}.skip{position:absolute;left:var(--space-3);z-index:100;padding:var(--space-2)var(--space-3);background:var(--surface-1);border:1px solid var(--border-2);top:-100px}.skip:focus{top:var(--space-3)}.visually-hidden{overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute!important}.site-header{position:sticky;z-index:20;background:color-mix(in srgb,var(--surface-1)92%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--border-1);top:0}.site-header .inner{display:flex;align-items: center;gap:var(--space-5);max-width:var(--page-max);min-height:var(--header-h);padding:0 var(--gutter);margin:0 auto}.brand{display:inline-flex;align-items:baseline;gap:var(--space-2);color:var(--fg-1);text-decoration:none;font:var(--fw-regular)24px/1 var(--font-display);letter-spacing:var(--tracking-tight);white-space:nowrap}.brand small{font:var(--type-label);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--fg-2)}.site-nav{display:flex;gap:var(--space-5);font:var(--type-label);letter-spacing:var(--tracking-label);text-transform:uppercase;flex:1;align-items: center}.site-nav a{color:var(--fg-2);text-decoration:none;padding:20px 0 18px}.site-nav a:hover{color:var(--fg-1)}.site-nav a[aria-current]{color:var(--fg-1);box-shadow:inset 0 -2px 0 var(--accent)}.header-tools{display:flex;gap:var(--space-2);align-items: center}.search-form input{height:var(--control-h-sm);padding:0 var(--space-3);font:var(--type-body-sm);color:var(--fg-1);background:var(--surface-1);border:1px solid var(--border-2);border-radius:var(--radius-2);width:180px}.icon-button{display:inline-grid;min-width:var(--control-h-sm);height:var(--control-h-sm);padding:0 var(--space-2);font:var(--type-ui);color:var(--fg-2);background:var(--surface-1);border:1px solid var(--border-2);border-radius:var(--radius-2);cursor:pointer;text-decoration:none;place-items: center}.icon-button:hover{color:var(--fg-1);border-color:var(--border-strong)}.menu-button{display:none}@media (max-width:900px){:root{--gutter:var(--space-4)}.site-nav{display:none;position:absolute;padding:var(--space-2)var(--gutter)var(--space-4);background:var(--surface-1);border-bottom:1px solid var(--border-1);flex-direction:column;align-items:stretch;gap:0;top:100%;left:0;right:0}.site-nav a{padding:var(--space-3)0}.site-header[data-open] .site-nav{display:flex}.menu-button{display:inline-grid;margin-left:auto}.search-form{display:none}}.site-footer{margin-top:var(--space-16);border-top:1px solid var(--border-1);background:var(--surface-1);color:var(--fg-2);font:var(--type-body-sm)}.site-footer .inner{display:flex;gap:var(--space-3)var(--space-6);max-width:var(--page-max);padding:var(--space-6)var(--gutter);flex-wrap:wrap;justify-content:space-between;margin:0 auto}.site-footer a{color:var(--fg-2)}.wrap{max-width:var(--page-max);padding:0 var(--gutter);margin:0 auto}.eyebrow{font:var(--type-label);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--accent-fg);margin:0 0 var(--space-3)}h1,h2,h3{text-wrap:balance}.page-title{font:var(--type-h1);letter-spacing:var(--tracking-display);margin:var(--space-10)0 var(--space-3)}.lede{font:var(--type-prose);color:var(--fg-2);max-width:var(--prose-max);margin:0 0 var(--space-6)}.button{display:inline-flex;align-items: center;gap:var(--space-2);height:var(--control-h-lg);padding:0 var(--space-5);font:var(--fw-medium)var(--fs-14)/1 var(--font-sans);color:var(--fg-1);background:var(--surface-1);border:1px solid var(--border-2);border-radius:var(--radius-2);text-decoration:none;cursor:pointer}.button:hover{border-color:var(--border-strong);color:var(--fg-1)}.button.primary{color:var(--fg-on-accent);background:var(--accent);border-color:var(--accent)}.button.primary:hover{background:var(--accent-hover);border-color:var(--accent-hover);color:var(--fg-on-accent)}.card{background:var(--surface-1);border:1px solid var(--border-2);border-radius:var(--radius-2)}.install{display:flex;align-items: center;gap:var(--space-2);padding:var(--space-2)var(--space-2)var(--space-2)var(--space-4);font:var(--type-code);color:var(--code-fg);background:var(--surface-code);border:1px solid var(--code-border);border-radius:var(--radius-2);max-width:100%}.install code{overflow-x:auto;white-space:nowrap;flex:1}.install .icon-button{flex:none}.hero{display:grid;grid-template-columns:minmax(0,.9fr)minmax(0,1.25fr);gap:var(--space-10);padding:var(--space-16)0 var(--space-12);align-items: center}.hero h1{font:var(--type-display);letter-spacing:var(--tracking-display);margin:0 0 var(--space-5)}.hero h1 em{color:var(--accent-fg);font-style:italic}.hero .actions{display:flex;gap:var(--space-3);margin-top:var(--space-6);flex-wrap:wrap}.hero-demo{padding:var(--space-3)}.hero-demo figcaption{display:flex;justify-content:space-between;gap:var(--space-3);padding:var(--space-3)var(--space-2)var(--space-1);font:var(--type-body-sm);color:var(--fg-2)}.hero-demo scxml-view{display:block}.showcase{margin:var(--space-6)0 var(--space-12)}.showcase .frame{display:block;padding:var(--space-3);overflow:hidden}.showcase img{display:block;border-radius:var(--radius-2);width:100%}.showcase figcaption{margin-top:var(--space-3);font:var(--type-body-sm);color:var(--fg-2)}.section-title{font:var(--type-h2);letter-spacing:var(--tracking-tight);margin:var(--space-12)0 var(--space-3)}.features{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-4);margin:var(--space-6)0}.feature{padding:var(--space-5)var(--space-5)var(--space-6)}.feature .stat{display:block;font:var(--fw-regular)var(--fs-30)/1.1 var(--font-display);color:var(--accent-fg);margin-bottom:var(--space-2)}.feature h3{font:var(--type-h3);margin:0 0 var(--space-2)}.feature p{color:var(--fg-2);font:var(--type-body-sm);margin:0}.two-up{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:var(--space-5);margin:var(--space-6)0}.two-up .card{padding:var(--space-6)}.two-up h3{font:var(--fw-regular)var(--fs-22)/var(--lh-snug)var(--font-display);margin:0 0 var(--space-3)}.two-up p{color:var(--fg-2);margin:0 0 var(--space-4)}@media (max-width:1000px){.features{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:640px){.features{grid-template-columns:minmax(0,1fr)}}@media (max-width:900px){.hero{grid-template-columns:minmax(0,1fr);padding-top:var(--space-10);gap:var(--space-8)}.hero h1{font-size:var(--fs-44)}.page-title{font-size:var(--fs-30)}}.docs{display:grid;grid-template-columns:240px minmax(0,var(--content-max))220px;gap:var(--space-10);max-width:var(--page-max);padding:0 var(--gutter);justify-content:center;margin:0 auto}.docs-nav{position:sticky;top:var(--header-h);max-height:calc(100vh - var(--header-h));overflow-y:auto;padding:var(--space-8)0;font:var(--type-body-sm);align-self: start}.docs-nav h2{font:var(--type-label);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--fg-2);margin:var(--space-5)0 var(--space-2)}.docs-nav h2:first-child{margin-top:0}.docs-nav ul{list-style:none;margin:0;padding:0}.docs-nav a{display:block;padding:5px var(--space-3);margin-left:calc(-1*var(--space-3));color:var(--fg-2);text-decoration:none;border-radius:var(--radius-2)}.docs-nav a:hover{color:var(--fg-1);background:var(--surface-2)}.docs-nav a[aria-current]{color:var(--fg-1);background:var(--accent-subtle);font-weight:var(--fw-medium)}.docs-nav-toggle{display:none}.toc{position:sticky;top:var(--header-h);max-height:calc(100vh - var(--header-h));overflow-y:auto;padding:var(--space-8)0;font:var(--type-body-sm);align-self: start}.toc h2{font:var(--type-label);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--fg-2);margin:0 0 var(--space-3)}.toc ul{list-style:none;margin:0;padding:0}.toc li.depth-3{padding-left:var(--space-3)}.toc a{display:block;color:var(--fg-2);text-decoration:none;padding:3px 0}.toc a:hover{color:var(--fg-1)}.toc .edit{display:inline-block;margin-top:var(--space-5);color:var(--fg-2)}@media (max-width:1180px){.docs{grid-template-columns:220px minmax(0,var(--content-max));gap:var(--space-8)}.toc{display:none}}@media (max-width:800px){.docs{grid-template-columns:minmax(0,1fr);gap:0}.docs-nav{position:static;padding:var(--space-4)0 0;max-height:none}.docs-nav-toggle{display:inline-flex}.docs-nav .groups{display:none;padding-top:var(--space-4)}.docs-nav[data-open] .groups{display:block}}.prose{padding:var(--space-8)0 var(--space-12);min-width:0}.prose>:first-child{margin-top:0}.prose h1{font:var(--type-h1);letter-spacing:var(--tracking-display);margin:0 0 var(--space-5)}.prose h2{font:var(--type-h2);letter-spacing:var(--tracking-tight);margin:var(--space-10)0 var(--space-3);padding-top:var(--space-2);border-top:1px solid var(--border-1)}.prose h3{font:var(--type-h3);margin:var(--space-8)0 var(--space-2)}.prose h4{font:var(--fw-semibold)var(--fs-16)/var(--lh-snug)var(--font-sans);margin:var(--space-6)0 var(--space-2)}.prose :-webkit-any(h2,h3,h4) .anchor{margin-left:var(--space-2);color:var(--fg-4);text-decoration:none;opacity:0}.prose :-moz-any(h2,h3,h4) .anchor{margin-left:var(--space-2);color:var(--fg-4);text-decoration:none;opacity:0}.prose :is(h2,h3,h4) .anchor{margin-left:var(--space-2);color:var(--fg-4);text-decoration:none;opacity:0}.prose .anchor:focus{opacity:1}.prose :-webkit-any(h2,h3,h4):hover .anchor{opacity:1}.prose :-moz-any(h2,h3,h4):hover .anchor{opacity:1}.prose :is(h2,h3,h4):hover .anchor{opacity:1}.prose p,.prose ul,.prose ol,.prose table,.prose pre,.prose blockquote{margin:0 0 var(--space-4)}.prose li{margin:var(--space-1)0}.prose li>p{margin:0}.prose :not(pre)>code{background:var(--surface-code);border:1px solid var(--code-border);border-radius:var(--radius-2);overflow-wrap:anywhere;padding:1px 5px;font-size:.88em}.prose pre{padding:var(--space-4);overflow-x:auto;font:var(--type-code);border:1px solid var(--code-border);border-radius:var(--radius-2);font-size:13px;background:var(--surface-1)!important}.prose pre code{font:inherit}.prose blockquote{padding:var(--space-2)var(--space-4);color:var(--fg-2);border-left:3px solid var(--accent);background:var(--surface-1)}.prose blockquote>:last-child{margin-bottom:0}.prose table{display:block;overflow-x:auto;border-collapse:collapse;font:var(--type-body-sm);max-width:100%}.prose th,.prose td{padding:var(--space-2)var(--space-3);border:1px solid var(--border-1);text-align:left;vertical-align:top}.prose th{background:var(--surface-2);font-weight:var(--fw-semibold)}.prose img{border:1px solid var(--border-1);border-radius:var(--radius-2)}.prose hr{border:0;border-top:1px solid var(--border-1);margin:var(--space-8)0}.shiki,.shiki span{color:var(--shiki-light)}[data-theme=dark] .shiki,[data-theme=dark] .shiki span{color:var(--shiki-dark)}.pager{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4);margin-top:var(--space-12)}.pager a{display:block;padding:var(--space-4);text-decoration:none;color:var(--fg-1);background:var(--surface-1);border:1px solid var(--border-2);border-radius:var(--radius-2)}.pager a:hover{border-color:var(--border-strong)}.pager small{display:block;font:var(--type-label);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--fg-2);margin-bottom:var(--space-1)}.pager .next{grid-column:2;text-align:right}.demo-bar{display:flex;gap:var(--space-3);margin-bottom:var(--space-4);flex-wrap:wrap;align-items: center}.demo-bar select,.demo-bar button{height:var(--control-h-sm);font:var(--type-ui);color:var(--fg-1);background:var(--surface-1);border:1px solid var(--border-2);border-radius:var(--radius-2);padding:0 var(--space-2)}.demo-bar button{cursor:pointer}.demo-bar .about{color:var(--fg-2);font:var(--type-body-sm);flex:320px}.explorer-demo scxml-explorer{--scxml-height:min(820px,calc(100dvh - 120px))}.slotted{display:flex;font:var(--type-body-sm);color:var(--fg-2);align-items: center;gap:6px}.slotted strong{color:var(--state-done)}.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,520px),1fr));gap:var(--space-5)}.gallery figure{padding:var(--space-3);min-width:0;margin:0}.gallery figcaption{padding:var(--space-3)var(--space-2)var(--space-1)}.gallery figcaption h2{font:var(--fw-regular)var(--fs-22)/var(--lh-snug)var(--font-display);margin:0 0 var(--space-1)}.gallery figcaption p{color:var(--fg-2);font:var(--type-body-sm);margin:0}.gallery scxml-view{min-height:300px}.demo-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--space-5);margin:var(--space-6)0}.demo-cards a.card{display:block;padding:var(--space-6);color:inherit;text-decoration:none}.demo-cards a.card:hover{border-color:var(--border-strong)}.demo-cards h2{font:var(--fw-regular)var(--fs-22)/var(--lh-snug)var(--font-display);margin:0 0 var(--space-2)}.demo-cards p{color:var(--fg-2);margin:0}.notice{padding:var(--space-5)var(--space-6);margin:var(--space-6)0;border-left:3px solid var(--state-waiting)}.notice h2{font:var(--type-h3);margin:0 0 var(--space-2)}.search-page{max-width:var(--content-max);padding:0 var(--gutter);--pagefind-ui-primary:var(--accent-fg);--pagefind-ui-text:var(--fg-1);--pagefind-ui-background:var(--surface-1);--pagefind-ui-border:var(--border-2);--pagefind-ui-tag:var(--surface-2);--pagefind-ui-font:var(--font-sans);--pagefind-ui-border-radius:2px;margin:0 auto}.search-page mark{background:var(--accent-subtle,var(--surface-2));color:var(--fg-1);font-weight:600}.prose td:first-child code{white-space:nowrap}.playground{--pg-fg:var(--fg-1);--pg-fg-subtle:var(--fg-2);--pg-border:var(--border-1);--pg-border-strong:var(--border-strong);--pg-accent:var(--accent);--pg-surface:var(--surface-1);--pg-surface-2:var(--surface-2);--pg-error:var(--state-error);--pg-warning:var(--state-waiting);--pg-font-mono:var(--font-mono);--pg-editor-bg:var(--surface-1);--pg-editor-gutter:var(--surface-2);--pg-editor-active:color-mix(in srgb,var(--accent)7%,transparent);--pg-editor-selection:color-mix(in srgb,var(--accent)22%,transparent);--pg-editor-match:color-mix(in srgb,var(--accent)16%,transparent);--pg-hl-tag:var(--pine-600);--pg-hl-attr:var(--slate-600);--pg-hl-string:var(--madder-600);--pg-hl-comment:var(--fg-3);--pg-height:clamp(460px,calc(100vh - var(--header-h) - 260px),820px);padding:var(--space-6)var(--gutter)var(--space-12);max-width:1600px;margin:0 auto}[data-theme=dark] .playground{--pg-hl-tag:var(--pine-300);--pg-hl-attr:var(--slate-300);--pg-hl-string:var(--rose-400)}.pg-intro .lede{max-width:88ch}.pg-bar{display:flex;gap:var(--space-3);margin:var(--space-4)0 var(--space-2);flex-wrap:wrap;align-items: center}.pg-picker{display:inline-flex;gap:var(--space-2);font:var(--type-ui);align-items: center}.pg-picker select,.pg-send input{height:var(--control-h-sm);font:var(--type-ui);color:var(--fg-1);background:var(--surface-1);border:1px solid var(--border-2);border-radius:var(--radius-2);padding:0 var(--space-2)}.pg-about{color:var(--fg-2);font-size:var(--fs-14);flex:280px}.pg-actions{display:inline-flex;gap:var(--space-2);flex-wrap:wrap}.pg-actions .button,.pg-send .button,.pg-log-head .button{height:var(--control-h-sm);padding:0 var(--space-3);font-size:var(--fs-13)}.pg-status{margin:0 0 var(--space-2);font:var(--type-ui);color:var(--fg-2);min-height:1.4em}.pg-status:before{content:"●";margin-right:var(--space-2);color:var(--state-running)}.pg-status[data-kind=busy]:before{color:var(--state-waiting)}.pg-status[data-kind=error]:before{color:var(--state-error)}.pg-status[data-kind=idle]:before{color:var(--state-done)}.pg-notice{margin:0 0 var(--space-3);padding:var(--space-3)var(--space-4)}.pg-notice[data-kind=warning]{border-left:3px solid var(--state-waiting)}.pg-notice .linklike{font:inherit;color:var(--text-link);text-decoration:underline;cursor:pointer;background:0 0;border:0;padding:0}.pg-link{font:var(--fw-regular)var(--fs-12)var(--font-mono);padding:var(--space-1)var(--space-2);border:1px solid var(--border-2);border-radius:var(--radius-2);background:var(--surface-1);color:var(--fg-1);width:min(100%,60ch)}.pg-tabs{display:flex;gap:var(--space-1);border-bottom:1px solid var(--border-1);margin-bottom:var(--space-3)}.pg-tabs button{font:var(--type-ui);color:var(--fg-2);padding:var(--space-2)var(--space-3);cursor:pointer;background:0 0;border:0;border-bottom:2px solid #0000;min-height:36px}.pg-tabs button[aria-selected=true]{color:var(--fg-1);border-bottom-color:var(--accent)}.pg-grid{display:grid;grid-template-columns:minmax(0,5fr)minmax(0,6fr);gap:var(--space-5);align-items: start}.pg-edit,.pg-run{display:flex;gap:var(--space-3);flex-direction:column;min-width:0}.pg-editor{height:var(--pg-height);overflow:hidden;display:flex;flex-direction:column}.pg-editor .cm-editor{flex:1;min-height:0}.pg-loading{margin:var(--space-4);color:var(--fg-2)}.pg-fallback{resize:none;padding:var(--space-3);font:var(--fw-regular)13px/1.55 var(--font-mono);color:var(--fg-1);background:var(--surface-1);tab-size:2;border:0;flex:1;width:100%}.pg-problems-box summary{cursor:pointer;font:var(--type-ui);color:var(--fg-2)}.pg-problems{list-style:none;margin:var(--space-2)0 0;display:grid;gap:var(--space-1);overflow:auto;max-height:180px;padding:0}.pg-problems button{text-align:left;font:var(--fw-regular)var(--fs-13)/1.4 var(--font-sans);color:var(--fg-1);background:var(--surface-1);border:1px solid var(--border-1);border-left:3px solid var(--state-waiting);border-radius:var(--radius-2);padding:var(--space-2)var(--space-3);cursor:pointer;width:100%}.pg-problems button[data-severity=error]{border-left-color:var(--state-error)}.pg-problems button:hover{border-color:var(--border-strong)}.pg-problems code{color:var(--fg-2);font-size:var(--fs-12)}.pg-sev{font:var(--type-label);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--fg-2)}.pg-line{color:var(--fg-2)}.pg-stage{height:var(--pg-height);overflow:auto;position:relative;transition:opacity var(--dur-base)}.playground[data-stale] .pg-stage{opacity:.55}.pg-view,.pg-explorer{display:block;--scxml-height:100%;border:0;height:100%}.playground[data-tab=explore] .pg-view,.playground:not([data-tab=explore]) .pg-explorer{display:none}.pg-send{display:flex;gap:var(--space-2);flex-wrap:wrap;align-items: end}.pg-send label{display:inline-flex;gap:var(--space-1);font:var(--type-ui);color:var(--fg-2);flex-direction:column}.pg-send label:first-child input{width:14ch}.pg-send label:nth-child(2){flex:200px}.pg-send input{font-family:var(--font-mono);font-size:var(--fs-13);min-height:32px}.pg-suggestions{display:flex;gap:var(--space-2);flex-wrap:wrap;flex-basis:100%}.pg-suggestions .chip{font:var(--fw-regular)var(--fs-12)/1 var(--font-mono);color:var(--accent-fg);background:var(--surface-1);border:1px solid var(--border-2);padding:var(--space-2)var(--space-3);cursor:pointer;border-radius:999px;min-height:28px}.pg-suggestions .chip:hover{border-color:var(--accent)}.pg-log-head{display:flex;justify-content:space-between;align-items: center}.pg-log-head h2{font:var(--type-label);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--fg-2);margin:0}.pg-log{list-style:none;margin:var(--space-2)0 0;padding:var(--space-2)var(--space-3);overflow:auto;font:var(--fw-regular)var(--fs-12)/1.6 var(--font-mono);background:var(--surface-code);border:1px solid var(--code-border);border-radius:var(--radius-2);color:var(--code-fg);height:180px}.pg-log li{white-space:pre-wrap;overflow-wrap:anywhere}.pg-log li[data-kind=error]{color:var(--state-error)}.pg-log li[data-kind=step]{color:var(--fg-2)}.pg-log li[data-kind=send]{color:var(--accent-fg)}.pg-log li[data-kind=info]{color:var(--fg-2);font-style:italic}@media (min-width:1001px){.pg-tabs [data-pg-tab=edit]{display:none}.pg-tabs{margin-left:calc(5/11*100% + var(--space-5)*6/11)}}@media (max-width:1000px){.pg-grid{grid-template-columns:minmax(0,1fr)}.playground:not([data-tab=edit]) .pg-edit,.playground[data-tab=edit] .pg-run{display:none}.playground{--pg-height:clamp(380px,calc(100vh - var(--header-h) - 220px),680px)}}@media (max-width:640px){.playground{padding:var(--space-4)var(--space-4)var(--space-10)}.pg-intro .lede{font-size:var(--fs-16)}}.code-with-action{position:relative}.code-with-action .open-in-playground{display:inline-block;margin:calc(-1*var(--space-3))0 var(--space-4);font:var(--type-ui)}