.resizable-demo{gap:20px;display:grid}.resizable-demo-card{border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-panel);background:var(--sprout-surface);min-width:0;overflow:hidden}.resizable-demo-card>header{border-bottom:1px solid var(--sprout-line);padding:14px 20px}.resizable-demo-card h3{font-size:13px;font-weight:550}.resizable-demo-card header p{color:var(--sprout-muted);margin-top:2px;font-size:12px;line-height:1.6}.resizable-demo-card-body{background:var(--sprout-canvas);gap:16px;min-width:0;padding:20px;display:grid}.resizable-demo-strong{overflow-wrap:anywhere;font-size:14px;font-weight:550}.resizable-demo-muted{color:var(--sprout-muted);font-size:13px;line-height:1.5}.resizable-demo-eyebrow{color:var(--sprout-muted);font-size:12px;font-weight:550}.resizable-demo-orientations{grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:16px;display:grid}.resizable-demo-stack{gap:8px;min-width:0;display:grid}.resizable-demo-frame{border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-panel);background:var(--sprout-surface);min-width:0;height:224px;overflow:hidden}.resizable-demo-pane{align-content:start;gap:8px;height:100%;padding:14px 16px;display:grid;overflow:auto}.resizable-demo-list{gap:6px;font-size:13px;display:grid}.resizable-demo-list li{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.resizable-demo-toolbar{flex-wrap:wrap;gap:8px;display:flex}.resizable-demo-chat-frame{border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-panel);background:var(--sprout-surface);min-width:0;height:320px;display:flex;overflow:hidden}.resizable-demo-chat{flex-direction:column;gap:10px;height:100%;padding:16px;display:flex;overflow:auto}.resizable-demo-bubble{border-radius:var(--sprout-radius-panel);background:var(--sprout-secondary);max-width:34ch;padding:8px 12px;font-size:13px;line-height:1.5}.resizable-demo-bubble[data-from=user]{background:var(--sprout-primary);color:var(--sprout-on-primary);align-self:flex-end}.resizable-demo-canvas{align-content:start;gap:12px;height:100%;padding:16px;display:grid;overflow:auto}.resizable-demo-table{border-collapse:collapse;width:100%;font-size:13px}.resizable-demo-table th{color:var(--sprout-muted);text-align:left;font-weight:500}.resizable-demo-table th,.resizable-demo-table td{border-bottom:1px solid var(--sprout-line);padding:6px 8px 6px 0}.resizable-demo-explorer{border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-panel);background:var(--sprout-surface);flex-direction:column;min-width:0;display:flex;overflow:hidden}.resizable-demo-explorer-bar{border-bottom:1px solid var(--sprout-line);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;min-height:44px;padding:6px 12px 6px 16px;display:flex}.resizable-demo-explorer-bar code{font-size:12px}.resizable-demo-explorer-actions{gap:8px;display:flex}.resizable-demo-explorer-body{min-width:0;height:300px;display:flex;overflow:hidden}.resizable-demo-explorer-body>[data-slot=state-panel]{flex:1}.resizable-demo-scroll{width:100%;height:100%;overflow:auto}.resizable-demo-scroll[data-tone=muted]{background:color-mix(in oklab, var(--sprout-hover) 45%, transparent)}.resizable-demo-tree{gap:8px;padding:12px;display:grid}.resizable-demo-tree ul{gap:2px;display:grid}.resizable-demo-tree button{border-radius:var(--sprout-radius-control);width:100%;min-height:28px;color:var(--sprout-text);font:inherit;text-align:left;cursor:pointer;background:0 0;border:0;align-items:center;gap:8px;padding:4px 8px;font-size:13px;display:flex}.resizable-demo-tree button span{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.resizable-demo-tree button svg{color:var(--sprout-muted);flex:none}.resizable-demo-tree button:hover{background:var(--sprout-hover)}.resizable-demo-tree button[aria-current=true]{background:var(--sprout-active);font-weight:550}.resizable-demo-tree button:focus-visible{outline:2px solid var(--sprout-focus);outline-offset:-2px}.resizable-demo-file{gap:10px;padding:16px;display:grid}.resizable-demo-file pre{white-space:pre-wrap;overflow-wrap:anywhere;color:var(--sprout-muted);margin:0;font-size:12px;line-height:1.6}@media (prefers-reduced-motion:no-preference){.resizable-demo-tree button{transition:background-color var(--sprout-motion-fast) var(--sprout-motion-ease)}}