.product-demo{--demo-ink: #253044;--demo-muted: #64748b;--demo-subtle: #475569;--demo-border: #cbd5e1;--demo-border-soft: #e2e8f0;--demo-surface: #f8fafc;--demo-surface-raised: #fbfdff;--demo-surface-active: #eef2ff;--demo-active-border: #a5b4fc;--demo-active-ink: #312e81;--demo-accent: #0f766e;--demo-accent-soft: #ccfbf1;--demo-indigo: #4f46e5;--demo-node: #f8fafc;--demo-node-border: #94a3b8;--demo-node-label: #1e293b;--demo-node-type: #475569;--demo-source: #f1f5f9;--demo-source-code: #4338ca;border:1px solid var(--demo-border);border-radius:22px;background:var(--demo-surface-raised);color:var(--demo-ink);overflow:hidden;box-shadow:0 28px 80px -42px #33415566;text-align:left;scroll-margin-top:90px}.dark .product-demo{--demo-ink: #dfe7fb;--demo-muted: #b4c3db;--demo-subtle: #aab8cf;--demo-border: #435371;--demo-border-soft: #334155;--demo-surface: #101827;--demo-surface-raised: #101827;--demo-surface-active: #222f47;--demo-active-border: #465987;--demo-active-ink: #edf2ff;--demo-accent: #5eead4;--demo-accent-soft: #143e3d;--demo-indigo: #a5b4fc;--demo-node: #1c2b42;--demo-node-border: #51698e;--demo-node-label: #f1f5f9;--demo-node-type: #a8b9d1;--demo-source: #0d1421;--demo-source-code: #c7d2fe;box-shadow:0 28px 80px -35px #10182780}.demo-topbar,.demo-footer,.demo-workspace-bar{display:flex;align-items:center;justify-content:space-between;gap:16px}.demo-topbar{padding:16px 22px;border-bottom:1px solid var(--demo-border-soft);flex-wrap:wrap}.demo-label{display:flex;gap:8px;align-items:center;font-size:12px;color:var(--demo-muted)}.demo-status-dot{width:7px;height:7px;border-radius:50%;background:var(--demo-accent)}.demo-capabilities{display:flex;gap:4px;padding:4px;border:1px solid var(--demo-border-soft);border-radius:10px}.demo-capabilities button{padding:7px 10px;border-radius:6px;font-size:12px}.demo-capabilities [aria-pressed=true]{color:var(--demo-active-ink);background:var(--demo-surface-active)}.demo-body{display:grid;grid-template-columns:240px minmax(0,1fr)}.demo-story{padding:26px 22px;border-right:1px solid var(--demo-border-soft)}.demo-story .public-eyebrow{color:var(--demo-indigo);font-size:10px}.demo-steps{display:grid;gap:6px;margin-top:24px}.demo-steps button{display:flex;align-items:center;gap:13px;padding:13px 12px;border:1px solid transparent;border-radius:9px;color:var(--demo-subtle);font-size:14px;text-align:left}.demo-steps button>span:first-child{font:11px var(--font-code);color:var(--demo-indigo)}.demo-steps button svg{margin-left:auto;opacity:0}.demo-steps [aria-pressed=true]{color:var(--demo-active-ink);background:var(--demo-surface-active);border-color:var(--demo-active-border)}.demo-steps [aria-pressed=true] svg{opacity:1}.demo-stage-description{font-size:13px;line-height:1.65;color:var(--demo-muted);min-height:66px;margin-top:24px}.demo-playback{display:flex;flex-wrap:wrap;gap:14px;margin-top:22px}.demo-playback button{display:flex;align-items:center;gap:6px;font-size:12px;padding:6px 0}.product-demo button:focus-visible,.product-demo a:focus-visible{outline:2px solid var(--demo-accent);outline-offset:4px}.demo-workspace{min-width:0;background:radial-gradient(ellipse at 40% 40%,var(--demo-surface-raised),var(--demo-surface) 75%);display:flex;flex-direction:column;justify-content:center}.demo-workspace-bar{padding:17px 24px;font-size:11px;color:var(--demo-muted);border-bottom:1px solid var(--demo-border-soft)}.demo-workspace-bar>span:first-child{color:var(--demo-ink);font-weight:500}.demo-prompt{padding:20px 24px 0}.demo-prompt .public-eyebrow{color:var(--demo-accent);font-size:10px}.demo-prompt p{margin:8px 0;font-size:13px;line-height:1.65;max-width:64ch}.demo-caption{font-size:11px;color:var(--demo-subtle)}.demo-diagram{width:100%;padding:12px 16px;color:var(--demo-muted)}.demo-node-type{font-family:var(--font-code)}.demo-diagram svg{width:100%;display:block}.demo-boundary{fill:var(--demo-accent-soft);fill-opacity:.34;stroke:var(--demo-accent);stroke-dasharray:5 5}.demo-boundary-label{fill:var(--demo-accent);font-size:12px}.demo-connector{stroke:currentColor;stroke-width:1.5;fill:none}.demo-connector-highlighted{color:#0ea5e9;stroke-width:3.5;filter:drop-shadow(0 0 5px rgba(14,165,233,.65))}.demo-node rect{fill:var(--demo-node);stroke:var(--demo-node-border)}.demo-node circle{fill:var(--demo-indigo)}.demo-node-label{fill:var(--demo-node-label);font-size:14px;font-weight:500}.demo-node-type{fill:var(--demo-node-type);font-size:10px}.demo-node-edited rect{fill:var(--demo-accent-soft);stroke:var(--demo-accent);stroke-width:2px}.demo-node-edited circle{fill:var(--demo-accent)}.demo-node-highlighted rect{fill:var(--demo-node);stroke:#0ea5e9;stroke-width:2px;filter:drop-shadow(0 0 7px rgba(14,165,233,.65))}.demo-node-highlighted circle{fill:#0ea5e9}.demo-source{padding:17px 24px 24px;background:var(--demo-source);border-top:1px solid var(--demo-border-soft);margin-top:auto}.demo-source>div{display:flex;align-items:center;gap:8px;color:var(--demo-subtle);font-size:11px;margin-bottom:12px}.demo-source code{font-family:var(--font-code);color:var(--demo-source-code);font-size:12px;overflow-wrap:anywhere}.demo-change{display:inline-flex;gap:4px;align-items:center;margin-left:auto;color:var(--demo-accent)}.demo-presentation-caption{padding:8px 24px 24px;text-align:center;color:var(--demo-muted);font-size:13px}.demo-footer{padding:16px 22px;border-top:1px solid var(--demo-border-soft);flex-wrap:wrap;font-size:11px;color:var(--demo-subtle)}.demo-footer a{display:inline-flex;gap:7px;align-items:center;color:var(--demo-accent);font-size:12px;text-decoration:underline;text-underline-offset:4px}.demo-mobile-flow{display:none}@media(prefers-reduced-motion:no-preference){.demo-node rect,.demo-steps button{transition:fill .25s,border-color .2s,background-color .2s}.demo-diagram-active .demo-connector{stroke-dasharray:7 4;animation:demo-flow 1.5s linear infinite}@keyframes demo-flow{to{stroke-dashoffset:-22}}}@media(max-width:760px){.demo-body{grid-template-columns:1fr}.demo-story{border-right:0;border-bottom:1px solid var(--demo-border-soft);padding:18px}.demo-steps{grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;margin-top:12px}.demo-steps button{flex-direction:column;gap:5px;padding:10px 3px;font-size:12px}.demo-steps button svg{display:none}.demo-stage-description{min-height:42px;margin-top:12px}.demo-playback{margin-top:8px}.demo-topbar{padding:14px 18px}}@media(max-width:480px){.demo-diagram svg{display:none}.demo-mobile-flow{display:grid;gap:8px;list-style:none;margin:0;padding:4px}.demo-diagram-presenting svg{display:block}.demo-diagram-presenting .demo-mobile-flow{display:none}.demo-mobile-flow li{border:1px solid var(--demo-node-border);border-radius:9px;padding:12px;background:var(--demo-node);font-size:13px;color:var(--demo-node-label)}.demo-mobile-flow span{color:var(--demo-indigo);margin-right:10px;font-size:10px}.demo-mobile-flow small{display:block;color:var(--demo-muted);margin:6px 0 0 25px;font-size:11px}.demo-mobile-flow .demo-mobile-edited{border-color:var(--demo-accent);background:var(--demo-accent-soft)}.demo-prepared,.demo-change{display:none}}@media(min-width:761px){.demo-workspace{height:600px}.demo-workspace>.demo-diagram{flex:1;min-height:0}.demo-workspace>.demo-diagram svg{height:100%}.demo-workspace-bar,.demo-prompt,.demo-source,.demo-presentation-caption{flex-shrink:0}}@media(prefers-reduced-motion:no-preference){.demo-diagram-active .demo-node{animation:demo-node-enter .5s ease-out both;animation-delay:calc(var(--demo-order) * .11s)}@keyframes demo-node-enter{0%{opacity:0}to{opacity:1}}}