: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)}.chat-demo{padding:var(--space-6)var(--gutter)var(--space-12);max-width:1600px;margin:0 auto}.chat-demo .lede{max-width:88ch}.chat-demo h2{font:var(--type-h3);margin:0 0 var(--space-3)}.chat-demo h3{font:var(--fw-semibold)var(--fs-16)/1.2 var(--font-sans);margin:0}.chat-demo{--cc-h:40px;--cc-pad:14px;--cc-radius:999px;--cc-field-radius:12px;--cc-chevron:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236b6257' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E")}[data-theme=dark] .chat-demo{--cc-chevron:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23c9bca8' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E")}.chat-demo button,.chat-demo input[type=text],.chat-demo input[type=password],.chat-demo input[type=number],.chat-demo select,.chat-demo textarea{font:var(--fw-medium)var(--fs-14)/1.2 var(--font-sans);color:var(--fg-1);background:var(--surface-1);border:1px solid var(--border-2);border-radius:var(--cc-radius);transition:border-color .12s,background-color .12s}.chat-demo button,.chat-demo input[type=text],.chat-demo input[type=password],.chat-demo input[type=number],.chat-demo select{height:var(--cc-h);padding:0 var(--cc-pad)}.chat-demo input[type=text],.chat-demo input[type=password],.chat-demo input[type=number],.chat-demo textarea{border-radius:var(--cc-field-radius);font-weight:var(--fw-regular)}.chat-demo select{appearance:none;padding-right:calc(var(--cc-pad) + 18px);background:var(--surface-1)var(--cc-chevron)no-repeat right var(--cc-pad)center;cursor:pointer;max-width:100%}.chat-demo button{display:inline-flex;justify-content:center;align-items: center;gap:var(--space-1);cursor:pointer}.chat-demo button:hover:not(:disabled),.chat-demo select:hover{border-color:var(--border-strong)}.chat-demo :-webkit-any(button,select,input):focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}.chat-demo :-moz-any(button,select,input):focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}.chat-demo :is(button,select,input):focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}.chat-demo button:disabled{cursor:default;opacity:.5}.chat-demo input[type=number]{padding-right:var(--space-1);width:9ch}.chat-demo button.chat-primary{color:var(--fg-on-accent);background:var(--accent);border-color:var(--accent)}.chat-demo button.chat-primary:hover:not(:disabled){background:var(--accent-hover);border-color:var(--accent-hover)}.chat-demo button.chat-quiet{color:var(--fg-2);background:0 0;border-color:#0000}.chat-demo button.chat-quiet:hover:not(:disabled){color:var(--fg-1);border-color:var(--border-2)}.chat-field{display:grid;gap:6px;min-width:0}.chat-field>.chat-field-label{font:var(--type-label);letter-spacing:.02em;color:var(--fg-2)}.chat-combo{display:flex;min-width:0}.chat-demo .chat-combo>:first-child{border-radius:var(--cc-radius)0 0 var(--cc-radius);flex:1;min-width:0}.chat-demo .chat-combo>:last-child{border-radius:0 var(--cc-radius)var(--cc-radius)0;flex:none;margin-left:-1px}.chat-demo .chat-combo>:first-child:focus-visible{position:relative;z-index:1}.chat-demo input[type=checkbox],.chat-demo input[type=radio]{accent-color:var(--accent);cursor:pointer;width:18px;height:18px;margin:0}.chat-caption{margin:0 0 var(--space-4);padding-left:var(--space-3);border-left:3px solid var(--accent);font:var(--type-body-sm);color:var(--fg-1);min-height:1.5em}.chat-caption:empty{border-color:#0000;min-height:0;margin:0}.chat-panes{display:grid;gap:var(--space-8);margin-bottom:var(--space-8)}.chat-pane{min-width:0}.chat-host{padding:var(--space-4);display:grid;gap:var(--space-3);align-content: start}#chat-host-body{display:grid;gap:var(--space-3)}.chat-inside-grid{display:grid;grid-template-columns:minmax(280px,340px)minmax(0,1fr);gap:var(--space-4);align-items: start}.chat-inside-main{display:grid;gap:var(--space-3);min-width:0}.chat-clients{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,340px),1fr));gap:var(--space-4);align-items: start}.chat-client{display:flex;flex-direction:column;min-width:0}.chat-client>header{display:flex;gap:var(--space-2);padding:var(--space-3)var(--space-4);border-bottom:1px solid var(--border-1);flex-wrap:wrap;align-items: center}.chat-client-options{margin-left:auto}.chat-client-options[open]{flex-basis:100%;margin-left:0}.chat-client-options>summary,.chat-disclosure>summary,.chat-setup>summary{cursor:pointer;font:var(--type-ui);color:var(--fg-2);padding:var(--space-1)0;list-style:none}.chat-client-options>summary::-webkit-details-marker{display:none}.chat-disclosure>summary::-webkit-details-marker{display:none}.chat-setup>summary::-webkit-details-marker{display:none}.chat-client-options>summary:before,.chat-disclosure>summary:before,.chat-setup>summary:before{content:"▸";display:inline-block;color:var(--fg-3);width:1.2em}.chat-client-options[open]>summary:before,.chat-disclosure[open]>summary:before,.chat-setup[open]>summary:before{content:"▾"}.chat-client-options[open]>summary{margin-bottom:var(--space-2)}.chat-client-options-body{display:grid;gap:var(--space-2)}.chat-client-body{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-3);padding:var(--space-3)var(--space-4)var(--space-4);min-width:0}.chat-row{display:flex;gap:var(--space-2);flex-wrap:wrap;align-items: center}.chat-small,.chat-roles,.chat-usage{font:var(--type-body-sm);font-size:var(--fs-13);color:var(--fg-2);margin:0}.chat-chip{display:inline-flex;align-items: center;gap:var(--space-1);padding:2px var(--space-2);font:var(--type-label);color:var(--fg-1);background:var(--surface-2);border-radius:var(--radius-pill)}.chat-chip:before{content:"●";color:var(--fg-3)}.chat-chip[data-kind=idle]:before{color:var(--state-done)}.chat-chip[data-kind=busy]:before{color:var(--state-waiting)}.chat-chip[data-kind=error]:before{color:var(--state-error)}.chat-status{display:flex;gap:var(--space-2);flex-wrap:wrap}.chat-model .chat-row{margin-top:var(--space-1)}.chat-key{flex:16rem}.chat-roster{border-collapse:collapse;font:var(--type-ui);width:100%}.chat-roster caption{text-align:left;font:var(--type-label);color:var(--fg-2);padding-bottom:var(--space-2)}.chat-roster th,.chat-roster td{padding:var(--space-1)var(--space-1);border-bottom:1px solid var(--border-1);text-align:left}.chat-roster th small{color:var(--fg-2);font-weight:400}.chat-transcript{list-style:none;display:grid;gap:var(--space-2);overflow-y:auto;font:var(--type-body-sm);max-height:420px;margin:0;padding:0}.chat-transcript:empty:before{content:"Nothing yet.";color:var(--fg-3)}.msg{display:grid;padding:var(--space-2)var(--space-3);border-radius:var(--radius-2);background:var(--surface-2);gap:2px;min-width:0}.msg .who{font:var(--type-label);color:var(--fg-2)}.msg .text{white-space:pre-wrap;overflow-wrap:anywhere}.msg .text.thinking{color:var(--fg-2);font-style:italic}.msg.user{background:var(--accent-subtle)}.msg.user[data-steer]{border-left:3px solid var(--accent)}.msg.assistant[data-status=discarded]{opacity:.6;text-decoration:line-through;text-decoration-color:color-mix(in srgb,currentColor 40%,transparent)}.msg .call code.json{display:block;font-size:var(--fs-12);color:var(--fg-2);overflow-wrap:anywhere}.msg .cursor{color:var(--accent)}.msg.tools ul,.chat-calls{list-style:none;display:grid;gap:var(--space-1);margin:0;padding:0}.msg.tools li,.chat-calls li{border-left:3px solid var(--state-waiting);padding-left:var(--space-2)}.msg.tools li[data-status=done],.chat-calls li[data-status=done]{border-color:var(--state-done)}.msg.tools li[data-status=failed],.chat-calls li[data-status=failed]{border-color:var(--state-error)}.chat-demo pre{margin:var(--space-1)0 0;overflow:auto;font:var(--type-code);font-size:var(--fs-12);white-space:pre-wrap;overflow-wrap:anywhere;max-height:140px}.msg.notice{border:1px dashed var(--border-2);color:var(--fg-2);background:0 0}.msg.notice[data-level=error]{border-color:var(--state-error)}.chat-client chat-prompt{margin-top:var(--space-1)}.chat-questions:not(:empty){padding:var(--space-3);border:1px solid var(--accent);border-radius:var(--radius-2);display:grid;gap:var(--space-2)}.chat-questions p{margin:0}.chat-knobs summary{font:var(--type-ui);cursor:pointer}.chat-knobs .chat-row{margin-top:var(--space-2);font:var(--type-ui)}.chat-inspect{display:grid;gap:var(--space-3);margin-bottom:var(--space-6)}.chat-inspect scxml-explorer{--scxml-height:min(640px,calc(100dvh - 160px))}.chat-timeline-head{display:flex;gap:var(--space-3);flex-wrap:wrap;align-items:baseline}.chat-timeline-head label{font:var(--type-ui)}.chat-timeline{list-style:none;padding:var(--space-2);overflow-y:auto;font:var(--type-code);font-size:var(--fs-12);background:var(--surface-1);border:1px solid var(--border-2);border-radius:var(--radius-2);max-height:320px;margin:0}.chat-timeline li{display:flex;gap:var(--space-2);border-bottom:1px solid var(--border-1);flex-wrap:wrap;padding:2px 0}.chat-timeline li[data-dropped]{color:var(--state-error)}.chat-timeline .tl-at{color:var(--fg-3);min-width:7ch}.chat-timeline .tl-route{min-width:18ch}.chat-timeline .tl-gloss{color:var(--fg-2);font-family:var(--font-sans)}.chat-timeline .tl-note{color:var(--fg-1);font-family:var(--font-sans)}.chat-toolbar{position:sticky;top:var(--header-h);z-index:10;display:flex;gap:var(--space-2)var(--space-4);margin:0 calc(-1*var(--gutter))var(--space-4);padding:var(--space-3)var(--gutter);background:color-mix(in srgb,var(--bg-app)94%,transparent);backdrop-filter:blur(8px);box-shadow:0 10px 14px -14px color-mix(in srgb,var(--fg-1)32%,transparent);flex-wrap:wrap;justify-content:space-between;align-items: center}.chat-playback{display:flex;gap:var(--space-2);flex-wrap:wrap;align-items: center}.chat-demo .chat-play{display:inline-grid;color:var(--fg-on-accent);background:var(--accent);border-color:var(--accent);border-radius:999px;place-items: center;width:40px;height:40px;padding:0}.chat-demo .chat-play[data-playing=false] svg{margin-left:2px}.chat-demo .chat-step{display:inline-flex;align-items: center;gap:var(--space-1);padding:0 var(--space-4)0 var(--space-3);height:40px}.chat-demo .chat-views button:focus-visible{outline-offset:-4px}.chat-speed{display:inline-flex;border:1px solid var(--border-2);background:var(--surface-1);border-radius:999px;margin:0;padding:2px}.chat-speed label{position:relative;display:inline-grid;padding:0 var(--space-2);font:var(--fw-medium)var(--fs-14)/1 var(--font-sans);color:var(--fg-2);cursor:pointer;border-radius:999px;place-items: center;min-width:40px;height:34px}.chat-speed input{position:absolute;opacity:0;cursor:pointer;margin:0;inset:0}.chat-speed label:has(input:checked){color:var(--fg-on-accent);background:var(--accent)}.chat-speed label:has(input:focus-visible){outline:2px solid var(--focus-ring);outline-offset:1px}.chat-time{font:var(--type-code);color:var(--fg-2);font-variant-numeric:tabular-nums;min-width:6ch}.chat-views{display:none}.chat-demo .chat-views button{height:var(--cc-h);padding:0 var(--space-4);font:var(--fw-semibold)var(--fs-14)/1 var(--font-sans);border-radius:0}.chat-demo .chat-views button:first-child{border-radius:999px 0 0 999px}.chat-demo .chat-views button:last-child{border-radius:0 999px 999px 0;margin-left:-1px}.chat-demo .chat-views button[aria-pressed=true]{color:var(--fg-inverse);background:var(--fg-1);border-color:var(--fg-1)}.chat-setup{margin-bottom:var(--space-3)}.chat-setup-body{display:grid;grid-template-columns:minmax(0,26rem)minmax(0,22rem)auto;justify-content:start;gap:var(--space-4);padding:var(--space-3)0 var(--space-2);align-items: end}@media (max-width:719px){.chat-setup-body{grid-template-columns:minmax(0,1fr);gap:var(--space-3)}.chat-setup-body>.chat-quiet{justify-self:start}}.chat-switcher{display:none}.chat-disclosure-body{padding-top:var(--space-2)}.chat-check{display:inline-grid;cursor:pointer;place-items: center;min-width:32px;min-height:32px}@media (max-width:999px){.chat-demo{padding-top:var(--space-4)}.chat-demo .page-title{margin-bottom:var(--space-2)}.chat-demo .lede{font-size:var(--fs-16);margin-bottom:var(--space-3)}.chat-views{display:inline-flex}.chat-demo[data-view=chat] #chat-pane-inside,.chat-demo[data-view=inside] #chat-pane-chat{display:none}.chat-inside-grid{grid-template-columns:minmax(0,1fr)}.chat-inspect>h2{position:absolute;overflow:hidden;clip-path:inset(50%);width:1px;height:1px}.chat-switcher{display:flex;gap:var(--space-2);overflow-x:auto;margin:0 calc(-1*var(--gutter))var(--space-3);padding:2px var(--gutter)var(--space-1);scrollbar-width:none}.chat-demo .chat-switcher button{display:inline-flex;align-items: center;gap:var(--space-2);padding:0 var(--space-4);font:var(--fw-medium)var(--fs-14)/1 var(--font-sans);border-radius:999px;flex:none;height:44px}.chat-demo .chat-switcher button[aria-pressed=true]{color:var(--fg-inverse);background:var(--fg-1);border-color:var(--fg-1)}.chat-demo .chat-switcher button.add{color:var(--fg-2);border-style:dashed}.chat-switcher .dot{background:var(--state-done);border-radius:50%;width:8px;height:8px}.chat-switcher .dot[data-kind=busy]{background:var(--state-waiting)}.chat-switcher .dot[data-kind=error]{background:var(--state-error)}.chat-switcher .badge{font:var(--type-label);background:color-mix(in srgb,currentColor 14%,transparent);border-radius:999px;padding:2px 6px}.chat-client:not([data-current]){display:none}.chat-transcript{max-height:min(52vh,460px)}.chat-demo{--cc-h:44px}.chat-demo .chat-play{width:44px;height:44px}.chat-demo .chat-step{height:44px}.chat-speed label{min-width:44px;height:40px}.chat-client-options>summary,.chat-disclosure>summary,.chat-setup>summary{display:flex;align-items: center;min-height:44px}.chat-check{min-width:44px;min-height:44px}.chat-roster th,.chat-roster td{padding:0}.chat-roster th[scope=row]{padding-right:var(--space-2)}.chat-timeline{max-height:50vh}}@media (max-width:480px){.chat-toolbar{gap:var(--space-2)}.chat-time{display:none}.chat-speed label{min-width:36px;padding:0 6px}.chat-demo .chat-step{padding:0 var(--space-2)}}.chat-demo scxml-explorer::part(playback){display:none}.chat-speed-compact{display:none}.chat-demo .chat-speed-compact select{padding:0 var(--space-3);font:var(--fw-semibold)var(--fs-16)/1 var(--font-sans);color:var(--fg-on-accent);background:var(--accent);border-color:var(--accent);border-radius:999px;min-width:64px;height:44px}@media (max-width:480px){.chat-playback{flex-wrap:nowrap}.chat-speed{display:none}.chat-speed-compact{display:inline-flex}.chat-step-label{position:absolute;overflow:hidden;clip-path:inset(50%);width:1px;height:1px}.chat-demo .chat-step{justify-content:center;width:44px;padding:0}.chat-demo .chat-views button{padding:0 var(--space-3)}}.chat-dl{position:relative;flex:1 0 100%}.chat-dl[hidden]{display:none}.chat-demo .chat-dl-toggle{display:grid;grid-template-columns:minmax(0,1fr);padding:var(--space-1)var(--space-3);text-align:left;border-radius:var(--radius-2);border-color:var(--accent);background:color-mix(in srgb,var(--accent)8%,var(--surface-1));gap:4px;width:100%;height:auto;min-height:44px}.chat-dl[data-state=failed] .chat-dl-toggle{border-color:var(--state-error);background:color-mix(in srgb,var(--state-error)8%,var(--surface-1))}.chat-dl-text{font:var(--fw-medium)var(--fs-13)/1.3 var(--font-sans)}.chat-dl-text:before{content:"↓ "}.chat-dl-list{list-style:none;margin:var(--space-1)0 0;padding:var(--space-2);display:grid;gap:var(--space-2);background:var(--surface-1);border:1px solid var(--border-2);border-radius:var(--radius-2);font:var(--type-ui)}.chat-dl-list li{display:flex;gap:var(--space-2);justify-content:space-between;align-items: center}.chat-demo progress{display:block;accent-color:var(--accent);overflow:hidden;background:var(--surface-3);color:var(--accent);border:0;border-radius:999px;width:100%;height:6px}.chat-demo progress::-webkit-progress-bar{background:var(--surface-3)}.chat-demo progress::-webkit-progress-value{background:var(--accent)}.chat-demo progress::-moz-progress-bar{background:var(--accent)}.chat-client-tools{display:grid;gap:var(--space-3)}.chat-tools-mode{display:grid;gap:var(--space-2);border:0;margin:0;padding:0}.chat-tools-mode legend{padding:0 0 var(--space-1);font:var(--type-label);color:var(--fg-2)}.chat-mode-option{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--space-2);padding:var(--space-3);border:1px solid var(--border-2);border-radius:var(--cc-field-radius);cursor:pointer;font:var(--type-body-sm);align-items: start;transition:border-color .12s,background-color .12s}.chat-mode-option:has(input:checked){border-color:var(--accent);background:color-mix(in srgb,var(--accent)7%,var(--surface-1))}.chat-mode-option input{accent-color:var(--accent);width:18px;height:18px;margin:2px 0 0}.chat-mode-option span{display:grid;gap:2px}.chat-mode-option small{font-size:var(--fs-13);color:var(--fg-2)}.chat-dl-detail{display:grid;gap:var(--space-2);padding:var(--space-3);border:1px solid var(--border-1);border-radius:var(--cc-field-radius);background:var(--surface-2)}.chat-dl-detail[hidden]{display:none}.chat-dl-total{display:grid;font:var(--fw-medium)var(--fs-14)/1.3 var(--font-sans);gap:4px;margin:0}.chat-dl-rows{list-style:none;display:grid;gap:var(--space-2);margin:0;padding:0}.chat-dl-rows li{display:grid;grid-template-columns:minmax(0,1fr)auto;gap:2px var(--space-2);font:var(--type-ui)}.chat-dl-rows progress{grid-column:1/-1}.chat-dl-size{color:var(--fg-2);font-variant-numeric:tabular-nums}.chat-dl-words{grid-column:1/-1;font-size:var(--fs-12);color:var(--fg-2);font-variant-numeric:tabular-nums}.chat-dl-rows li[data-phase=ready] .chat-dl-words{color:var(--state-done)}.chat-dl-rows li[data-phase=failed] .chat-dl-words{color:var(--state-error)}.chat-dl-rows li[data-phase=ready] progress{opacity:.5}.chat-credit{font-size:var(--fs-12);color:var(--fg-2);margin:0}.chat-demo [hidden]{display:none!important}.chat-chart-picker select{justify-self:start;min-width:min(100%,18rem)}.chat-demo li[data-deadline]{--timeout:0;--fill:color-mix(in srgb,var(--state-waiting)20%,transparent);background:linear-gradient(to right,var(--fill)calc(var(--timeout)*100%),transparent 0);border-radius:0 var(--radius-2)var(--radius-2)0}.chat-demo li[data-deadline][data-late]{--fill:color-mix(in srgb,var(--state-error)22%,transparent)}.chat-host-status{display:flex;justify-content:space-between;align-items: center;gap:var(--space-2)}.chat-demo .chat-stop{padding:0 var(--space-3);color:var(--state-error);border-color:color-mix(in srgb,var(--state-error)55%,transparent);flex:none;gap:6px;height:32px}.chat-demo .chat-stop svg{fill:currentColor}.chat-demo .chat-stop:hover:not(:disabled){border-color:var(--state-error);background:color-mix(in srgb,var(--state-error)10%,transparent)}.chat-host .chat-section{border-top:1px solid var(--border-1);padding-top:var(--space-3)}.chat-host .chat-section>summary{font:var(--type-label);letter-spacing:.02em;color:var(--fg-2);text-transform:none}.chat-host .chat-section>.chat-disclosure-body{padding-top:var(--space-3)}.chat-roster-list{list-style:none;display:grid;gap:var(--space-3);margin:0;padding:0}.chat-roster-list>li{display:grid;gap:var(--space-2)}.chat-roster-who{display:flex;align-items:baseline;gap:6px var(--space-2);font:var(--type-body-sm);flex-wrap:wrap}.chat-roster-who strong{font-weight:var(--fw-semibold);color:var(--fg-1)}.chat-roster-tools,.chat-roster-note{font:var(--type-label);color:var(--fg-2)}.chat-roster-note{color:var(--state-error)}.chat-dot{background:var(--state-done);border-radius:50%;align-self: center;width:8px;height:8px}.chat-dot[data-kind=error]{background:var(--state-error)}.chat-role-toggles{display:flex;flex-wrap:wrap;gap:6px}.chat-demo .chat-role{font:var(--fw-medium)var(--fs-13)/1 var(--font-sans);color:var(--fg-2);background:0 0;border-style:dashed;gap:4px;height:30px;padding:0 12px}.chat-demo .chat-role[aria-pressed=true]{color:var(--fg-1);background:color-mix(in srgb,var(--accent)16%,var(--surface-1));border-style:solid;border-color:color-mix(in srgb,var(--accent)60%,transparent)}.chat-demo .chat-role[aria-pressed=true] svg{color:var(--accent)}.chat-model{display:grid;gap:var(--space-2)}.chat-segmented{display:inline-flex;border:1px solid var(--border-2);background:var(--surface-1);border-radius:999px;justify-self:start;margin:0;padding:2px}.chat-segmented label{position:relative;display:inline-grid;height:calc(var(--cc-h) - 6px);padding:0 var(--space-4);font:var(--fw-medium)var(--fs-14)/1 var(--font-sans);color:var(--fg-2);cursor:pointer;border-radius:999px;place-items: center}.chat-segmented input{position:absolute;opacity:0;cursor:pointer;width:100%;height:100%;margin:0;inset:0}.chat-segmented label:has(input:checked){color:var(--fg-on-accent);background:var(--accent)}.chat-segmented label:has(input:focus-visible){outline:2px solid var(--focus-ring);outline-offset:1px}.chat-key-card{display:grid;gap:var(--space-3);margin-top:var(--space-1);padding:var(--space-3);border:1px solid var(--border-2);border-radius:var(--cc-field-radius);background:color-mix(in srgb,var(--surface-2)50%,transparent)}.chat-key-card[data-state=ready]{border-color:color-mix(in srgb,var(--accent)50%,transparent)}.chat-key-card[data-state=locked]{border-color:color-mix(in srgb,var(--state-error)50%,transparent)}.chat-key-line{display:flex;align-items: center;gap:var(--space-2);font:var(--type-body-sm);color:var(--fg-2)}.chat-key-line svg{color:var(--accent);flex:none}.chat-key-line strong{color:var(--fg-1)}.chat-key-actions{display:flex;justify-content:space-between;align-items: center;gap:var(--space-2);flex-wrap:wrap}.chat-key-help{font:var(--type-body-sm);font-size:var(--fs-13);color:var(--fg-2);margin:0}.chat-demo .chat-switch{gap:var(--space-2);color:var(--fg-2);font:var(--type-body-sm);font-size:var(--fs-13);background:0 0;border:0;height:auto;min-height:32px;padding:0}.chat-switch-track{position:relative;background:var(--border-2);border-radius:999px;flex:none;width:34px;height:20px;transition:background-color .15s}.chat-switch-track:after{content:"";position:absolute;background:var(--surface-1);border-radius:50%;width:16px;height:16px;transition:transform .15s;top:2px;left:2px;box-shadow:0 1px 2px #00000040}.chat-switch[aria-checked=true] .chat-switch-track{background:var(--accent)}.chat-switch[aria-checked=true] .chat-switch-track:after{transform:translate(14px)}.chat-demo .chat-switch[aria-checked=true]{color:var(--fg-1)}@media (prefers-reduced-motion:reduce){.chat-switch-track,.chat-switch-track:after{transition:none}}.chat-host-stats{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3);padding-top:var(--space-3);border-top:1px solid var(--border-1);margin:0}.chat-host-stats dt{font:var(--type-label);color:var(--fg-2)}.chat-host-stats dd{font:var(--fw-semibold)var(--fs-18)/1.2 var(--font-sans);font-variant-numeric:tabular-nums;color:var(--fg-1);margin:2px 0 0}@media (max-width:999px){.chat-demo .chat-role,.chat-demo .chat-stop{height:40px}.chat-demo .chat-switch{min-height:44px}}.chat-key-actions[data-align=start]{justify-content:flex-start;gap:var(--space-1);margin-left:calc(-1*var(--cc-pad))}
