.message-demo{gap:20px;display:grid}.message-demo-card{border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-panel);background:var(--sprout-surface);min-width:0;overflow:hidden}.message-demo-card>header{border-bottom:1px solid var(--sprout-line);padding:14px 20px}.message-demo-card h3{font-size:13px;font-weight:550}.message-demo-card header p{color:var(--sprout-muted);margin-top:2px;font-size:12px;line-height:1.6}.message-demo-card-body{background:var(--sprout-canvas);gap:16px;min-width:0;padding:20px;display:grid}.message-demo-code,.message-demo-variant-text code{color:var(--sprout-text);font-size:12px;font-weight:550}.message-demo-footnote{color:var(--sprout-muted);font-size:12px;line-height:1.5}.message-demo-sr{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.message-demo-transcript{gap:20px;min-width:0;display:grid}.message-demo-prose{max-width:65ch;font-size:var(--sprout-text-sm);white-space:pre-wrap;overflow-wrap:anywhere;margin:0;line-height:1.6}.message-demo-streaming{color:var(--sprout-muted);align-items:center;gap:8px;display:flex}.message-demo-change{min-width:0;color:var(--sprout-muted);align-items:center;gap:12px;padding-block:4px;display:flex}.message-demo-change>div{flex:1;min-width:0}.message-demo-change-title{font-size:var(--sprout-text-sm);color:var(--sprout-text);font-weight:500}.message-demo-change-meta{font-size:var(--sprout-text-xs)}.message-demo-onboarding-user{background:var(--sprout-secondary);border-radius:12px;max-width:100%;padding:12px 16px}.message-demo-onboarding-guide{padding:8px 12px}.message-demo-onboarding-user p,.message-demo-onboarding-guide p{font-size:var(--sprout-text-base);white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.5}.message-demo-onboarding-close{font-size:var(--sprout-text-base);padding-inline:12px;line-height:1.5}.message-demo-ghost{grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:24px;display:grid}.message-demo-footer-stack{text-align:end;justify-items:end;gap:8px;min-width:0;display:grid}.message-demo-failed{font-size:var(--sprout-text-sm);color:var(--sprout-danger);align-items:center;gap:6px;display:flex}.message-demo-reason{max-width:44ch;font-weight:400;line-height:1.5}.message-demo-actions{flex-wrap:wrap;justify-content:flex-end;gap:8px;display:flex}.message-demo-note{min-height:1lh;font-size:var(--sprout-text-xs);color:var(--sprout-muted)}.message-demo-truncate{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.message-demo-scroller{overscroll-behavior:contain;border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-panel);background:var(--sprout-surface);outline:none;height:280px;padding:16px;overflow-y:auto}.message-demo-scroller:focus-visible{outline:2px solid var(--sprout-focus);outline-offset:2px}.message-demo-variants{gap:0;display:grid}.message-demo-variant{border-top:1px solid var(--sprout-line);grid-template-columns:minmax(0,200px) minmax(0,1fr);align-items:center;gap:16px;padding:12px 0;display:grid}.message-demo-variant:first-child{border-top:0;padding-top:0}.message-demo-variant:last-child{padding-bottom:0}.message-demo-variant-text{color:var(--sprout-muted);gap:2px;font-size:12px;line-height:1.5;display:grid}@media (width<=640px){.message-demo-variant{grid-template-columns:minmax(0,1fr);gap:8px}}.message-demo-thread{flex-direction:column;gap:12px;min-width:0;display:flex}.message-demo-reactions{--sprout-message-reactions-ring:var(--sprout-canvas);grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:32px 24px;padding-block:12px;display:grid}.message-demo-reactions .message-demo-thread{gap:20px}.message-demo-inline{align-items:center;gap:6px;display:inline-flex}.message-demo-inline>svg{flex-shrink:0;width:14px;height:14px}.message-demo-chat{border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-panel);min-width:0;display:grid;overflow:hidden}.message-demo-timeline{overscroll-behavior:contain;background:var(--sprout-surface);height:340px;padding:20px 16px;overflow-y:auto}.message-demo-timeline:focus-visible{outline:2px solid var(--sprout-focus);outline-offset:-2px}.message-demo-turns{gap:24px;margin:0;padding:0;list-style:none;display:grid}.message-demo-empty{text-align:center;height:100%;color:var(--sprout-muted);place-items:center;font-size:13px;display:grid}.message-demo-pending{flex-direction:column;gap:12px;min-width:0;display:flex}.message-demo-thinking{color:var(--sprout-muted);align-items:center;gap:8px;font-size:13px;display:inline-flex}.message-demo-composer{border-top:1px solid var(--sprout-line);background:var(--sprout-canvas);align-items:flex-end;gap:8px;padding:10px 12px;display:flex}.message-demo-composer>:first-child{flex:1;min-width:0}.message-demo-composer-actions{align-items:center;gap:4px;display:flex}.message-demo-rich{gap:24px;display:grid}.message-demo-file{border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-control);background:var(--sprout-surface);white-space:nowrap;vertical-align:middle;max-width:100%;color:var(--sprout-text);align-items:center;gap:6px;margin-block:2px;padding:2px 8px 2px 4px;font-size:13px;line-height:1.5;text-decoration:none;display:inline-flex}.message-demo-file>span{text-overflow:ellipsis;overflow:hidden}.message-demo-file:focus-visible{outline:2px solid var(--sprout-focus);outline-offset:2px}.message-demo-markdown{font-size:var(--sprout-text-sm);gap:8px;line-height:1.6;display:grid}.message-demo-markdown ul{gap:4px;margin:0;padding-inline-start:20px;list-style:outside;display:grid}.message-demo-markdown code{background:var(--sprout-secondary);overflow-wrap:anywhere;border-radius:4px;padding:1px 4px;font-size:.85em}.message-demo-copy{align-items:center;gap:6px;min-height:24px;display:flex}.message-demo-history-tools{align-items:center;gap:12px;display:flex}