.canvas-demo-frame{border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-panel);background:var(--sprout-surface);min-width:0;overflow:hidden}.canvas-demo-bar{border-bottom:1px solid var(--sprout-line);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 16px;padding:10px 16px;display:flex}.canvas-demo-bar-text{flex-direction:column;gap:2px;min-width:0;display:flex}.canvas-demo-bar-title{color:var(--sprout-text);font-size:13px;font-weight:500}.canvas-demo-note{color:var(--sprout-muted);font-size:12px}.canvas-demo-controls{color:var(--sprout-muted);flex-wrap:wrap;align-items:center;gap:8px 12px;font-size:12px;display:flex}.canvas-demo-switch{align-items:center;gap:8px;display:inline-flex}.canvas-demo-stage{background:var(--sprout-canvas)}.canvas-demo-stage[data-width=narrow]{padding:16px}.canvas-demo-stage[data-width=narrow]>.canvas-demo-app{border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-panel);max-width:600px;margin-inline:auto;overflow:hidden}.canvas-demo-app{background:var(--sprout-surface);flex-direction:column;min-width:0;height:560px;display:flex}.canvas-demo-app-short{height:420px}.canvas-demo-app>[data-slot=chat-split]{flex:1;min-height:0}.canvas-demo-app-header{border-bottom:1px solid var(--sprout-line);background:var(--sprout-surface);justify-content:space-between;align-items:center;gap:12px;min-height:48px;padding:8px 12px 8px 16px;display:flex}.canvas-demo-app-title{min-width:0;color:var(--sprout-text);text-overflow:ellipsis;white-space:nowrap;font-size:14px;font-weight:500;overflow:hidden}.canvas-demo-conversation{outline:none;height:100%;overflow-y:auto}.canvas-demo-conversation:focus-visible{box-shadow:inset 0 0 0 2px var(--sprout-focus)}.canvas-demo-thread{max-width:560px;color:var(--sprout-text);gap:14px;margin-inline:auto;padding:20px 16px 32px;font-size:14px;line-height:1.6;display:grid}.canvas-demo-bubble{background:var(--sprout-secondary);border-radius:12px;justify-self:end;max-width:85%;padding:8px 12px}.canvas-demo-item{min-height:100%;display:grid}.canvas-demo-attention{border-bottom:1px solid var(--sprout-line);background:var(--sprout-canvas);padding:6px 16px}.canvas-demo-muted{color:var(--sprout-muted);font-size:12px;line-height:1.5}.canvas-demo-footer-note{border-top:1px solid var(--sprout-line);color:var(--sprout-muted);padding-top:12px;font-size:12px}.canvas-demo-sr-only{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.canvas-demo-badges{flex-wrap:wrap;gap:6px;padding:0;list-style:none;display:flex}.canvas-demo-table-wrap{border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-control);outline:none;overflow-x:auto}.canvas-demo-table-wrap:focus-visible{box-shadow:0 0 0 2px var(--sprout-focus)}.canvas-demo-table{border-collapse:collapse;width:100%;font-size:12px}.canvas-demo-table th,.canvas-demo-table td{border-bottom:1px solid var(--sprout-line);text-align:left;white-space:nowrap;padding:8px 12px}.canvas-demo-table th{background:var(--sprout-canvas);color:var(--sprout-muted);font-weight:500}.canvas-demo-table tr:last-child td{border-bottom:0}.canvas-demo-events{border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-control);padding:0;list-style:none;display:grid}.canvas-demo-events li{border-bottom:1px solid var(--sprout-line);grid-template-columns:104px minmax(0,1fr);gap:2px 12px;padding:10px 12px;font-size:13px;display:grid}.canvas-demo-events li:last-child{border-bottom:0}.canvas-demo-events .canvas-demo-muted{grid-column:2}.canvas-demo-event-time{color:var(--sprout-muted);font-variant-numeric:tabular-nums;grid-row:span 2;font-size:12px}.canvas-demo-event-title,.canvas-demo-field{color:var(--sprout-text);font-weight:500}.canvas-demo-skeletons{gap:10px;display:grid}.canvas-demo-chart{gap:10px;padding:0;list-style:none;display:grid}.canvas-demo-chart li{grid-template-columns:56px minmax(0,1fr) 64px;align-items:center;gap:12px;font-size:12px;display:grid}.canvas-demo-chart-label,.canvas-demo-chart-value{color:var(--sprout-muted);font-variant-numeric:tabular-nums}.canvas-demo-chart-value{text-align:right}.canvas-demo-chart-track{background:var(--sprout-secondary);border-radius:999px;height:10px;overflow:hidden}.canvas-demo-chart-bar{border-radius:inherit;background:var(--sprout-text);opacity:.72;height:100%;display:block}.canvas-demo-code{border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-control);overflow:hidden}.canvas-demo-code figcaption{border-bottom:1px solid var(--sprout-line);background:var(--sprout-canvas);color:var(--sprout-muted);padding:6px 12px;font-size:12px}.canvas-demo-code pre{color:var(--sprout-text);outline:none;margin:0;padding:12px;font:12px/1.6 ui-monospace,SFMono-Regular,Menlo,monospace;overflow-x:auto}.canvas-demo-code pre:focus-visible{box-shadow:inset 0 0 0 2px var(--sprout-focus)}.canvas-demo-plan{gap:12px;display:grid}.canvas-demo-plan-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;display:flex}.canvas-demo-plan-head h3,.canvas-demo-receipt h3{color:var(--sprout-text);font-size:14px;font-weight:550}.canvas-demo-plan ol{gap:8px;padding:0;font-size:13px;list-style:none;display:grid}.canvas-demo-plan li{color:var(--sprout-text);align-items:center;gap:10px;display:flex}.canvas-demo-plan li[data-done]{color:var(--sprout-muted);text-decoration:line-through}.canvas-demo-plan-dot{border:1.5px solid;border-radius:999px;flex:none;width:10px;height:10px}.canvas-demo-plan li[data-done] .canvas-demo-plan-dot{background:currentColor}.canvas-demo-schema{border:1px dashed var(--sprout-line);border-radius:var(--sprout-radius-control);background:var(--sprout-canvas);flex-wrap:wrap;gap:24px;padding:24px;display:flex}.canvas-demo-schema-table{border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-control);background:var(--sprout-surface);color:var(--sprout-text);align-items:center;gap:6px;padding:6px 10px;font-size:12px;font-weight:500;display:inline-flex}.canvas-demo-toggles{background:var(--sprout-canvas);gap:12px;padding:16px;display:grid}.canvas-demo-toggle-row{grid-template-columns:160px minmax(0,1fr);align-items:center;gap:16px;display:grid}.canvas-demo-toggle-row>.canvas-demo-app-header{border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-control)}.canvas-demo-toggle-note{color:var(--sprout-muted);font-size:12px}.canvas-demo-sections{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:20px;display:grid}.canvas-demo-section-sample{grid-template-rows:auto 1fr;gap:8px;min-width:0;display:grid}.canvas-demo-section-sample>figcaption{color:var(--sprout-muted);font-size:12px}.canvas-demo-section-surface{border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-panel);background:var(--sprout-surface);min-width:0;overflow:hidden}.canvas-demo-frame-surface{height:420px;margin:16px}.canvas-demo-frame-surface>[data-slot=canvas-section]{height:100%}.canvas-demo-recipes{gap:24px;margin-top:20px;display:grid}.canvas-demo-approval{flex-direction:column;min-height:100%;display:flex}.canvas-demo-approval-head{border-bottom:1px solid var(--sprout-line);justify-content:space-between;align-items:flex-start;gap:12px;padding:16px 20px;display:flex}.canvas-demo-approval-head h2,.canvas-demo-receipt h2{color:var(--sprout-text);font-size:15px;font-weight:550}.canvas-demo-approval-body{flex:1;padding:16px 20px}.canvas-demo-approval-table{border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-panel);overflow:hidden}.canvas-demo-approval-table header{border-bottom:1px solid var(--sprout-line);color:var(--sprout-text);align-items:center;gap:8px;padding:10px 12px;display:flex}.canvas-demo-approval-table h3{flex:1;font-size:13px;font-weight:550}.canvas-demo-approval-table ul{padding:0;list-style:none}.canvas-demo-approval-table li{border-bottom:1px solid var(--sprout-line);align-items:center;gap:8px;padding:8px 12px;font-size:13px;display:flex}.canvas-demo-approval-table li:last-child{border-bottom:0}.canvas-demo-field-type{margin-left:auto}.canvas-demo-approval-foot{border-top:1px solid var(--sprout-line);color:var(--sprout-muted);padding:12px 20px;font-size:12px}.canvas-demo-workflow-card{border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-panel);color:var(--sprout-text);gap:12px;padding:12px;display:flex}.canvas-demo-workflow-card>svg{color:var(--sprout-muted);flex:none;margin-top:2px}.canvas-demo-steps{gap:8px;padding:0;font-size:13px;list-style:none;display:grid}.canvas-demo-steps li{border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-control);align-items:center;gap:10px;padding:10px 12px;display:flex}.canvas-demo-step-index{background:var(--sprout-secondary);width:22px;height:22px;color:var(--sprout-text);border-radius:999px;flex:none;place-items:center;font-size:11px;font-weight:550;display:inline-grid}.canvas-demo-receipt{color:var(--sprout-text);align-content:start;gap:24px;padding:20px;font-size:13px;line-height:1.6;display:grid}.canvas-demo-receipt header{gap:4px;display:grid}.canvas-demo-receipt section{gap:8px;display:grid}.canvas-demo-success{color:var(--sprout-muted);font-size:12px;font-weight:500}@media (width<=760px){.canvas-demo-sections{grid-template-columns:minmax(0,1fr)}.canvas-demo-toggle-row{grid-template-columns:minmax(0,1fr);gap:6px}.canvas-demo-app{height:520px}.canvas-demo-stage[data-width=narrow]{padding:0}}