.separator-demo{gap:20px;display:grid}.separator-demo-card{border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-panel);background:var(--sprout-surface);min-width:0;overflow:hidden}.separator-demo-card>header{border-bottom:1px solid var(--sprout-line);padding:14px 20px}.separator-demo-card h3{font-size:13px;font-weight:550}.separator-demo-card header p{color:var(--sprout-muted);margin-top:2px;font-size:12px;line-height:1.6}.separator-demo-card-body{background:var(--sprout-canvas);gap:16px;min-width:0;padding:20px;display:grid}.separator-demo-strong{font-size:14px;font-weight:550}.separator-demo-muted{color:var(--sprout-muted);font-size:13px;line-height:1.5}.separator-demo-orientations{grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));align-items:start;gap:16px;display:grid}.separator-demo-panel{border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-panel);background:var(--sprout-surface);gap:12px;padding:14px 16px;display:grid}.separator-demo-meta{color:var(--sprout-muted);flex-wrap:wrap;align-items:center;gap:8px 12px;padding-block:4px;font-size:13px;display:flex}.separator-demo-groups{flex-wrap:wrap;align-items:flex-start;gap:24px;display:flex}.separator-demo-group-wrap{justify-items:start;gap:8px;display:grid}.separator-demo-group{border:1px solid var(--sprout-input);border-radius:var(--sprout-radius-control);background:var(--sprout-surface);box-shadow:var(--sprout-shadow-control);padding:0;display:flex;overflow:hidden}.separator-demo-group[data-orientation=vertical]{flex-direction:column;align-items:stretch}.separator-demo-group>button{border-radius:0}.separator-demo-group>[data-slot=separator][data-orientation=vertical]{height:auto}.separator-demo-group>[data-slot=separator][data-orientation=horizontal]{width:auto}.separator-demo-forms{grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));align-items:start;gap:16px;display:grid}.separator-demo-form{border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-panel);background:var(--sprout-surface);gap:14px;min-width:0;padding:16px;display:grid}.separator-demo-spaced{padding-block:4px}.separator-demo-field{gap:6px;font-size:13px;font-weight:500;display:grid}.separator-demo-field input{border:1px solid var(--sprout-input);border-radius:var(--sprout-radius-control);background:var(--sprout-surface);min-width:0;height:32px;color:var(--sprout-text);font:inherit;padding-inline:10px;font-weight:400}.separator-demo-field input::placeholder{color:var(--sprout-muted)}.separator-demo-field input:focus-visible,.separator-demo-check input:focus-visible{outline:2px solid var(--sprout-focus);outline-offset:1px}.separator-demo-check{align-items:center;gap:8px;font-size:13px;display:flex}.separator-demo-check input{width:16px;height:16px;accent-color:var(--sprout-primary);margin:0}.separator-demo-narrow{max-width:100%}.separator-demo-toolbar{color:var(--sprout-muted);flex-wrap:wrap;align-items:center;gap:8px 12px;font-size:12px;display:flex}.separator-demo-list{border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-panel);background:var(--sprout-surface);min-width:0;padding:8px 12px}.separator-demo-list>p{padding:8px 0}.separator-demo-item-gap{margin-block:8px}.separator-demo-item{align-items:flex-start;gap:10px;min-width:0;padding-block:4px;display:flex}.separator-demo-item>svg{color:var(--sprout-muted);flex-shrink:0;margin-top:2px}.separator-demo-item-text{min-width:0}.separator-demo-item-text p:first-child{text-overflow:ellipsis;white-space:nowrap;font-size:13px;font-weight:500;overflow:hidden}.separator-demo-item-text p:last-child{color:var(--sprout-muted);font-size:12px}.separator-demo-skeleton{border-radius:var(--sprout-radius-control);background:var(--sprout-hover);height:36px;margin-block:4px}.separator-demo-sidebar{border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-panel);background:var(--sprout-surface);overflow:hidden}.separator-demo-sidebar .sprout-sidebar-layout{min-height:0}.separator-demo-sidebar .sprout-sidebar-panel{height:380px}.separator-demo-sidebar-main{flex:1;min-width:0;padding:16px}@media (width<=480px){.separator-demo-sidebar .sprout-sidebar-panel{width:11.5rem}}.separator-fade-demo{gap:20px;display:grid}.separator-fade-demo-card{border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-panel);background:var(--sprout-surface);min-width:0;overflow:hidden}.separator-fade-demo-card>header{border-bottom:1px solid var(--sprout-line);padding:14px 20px}.separator-fade-demo-card h3{font-size:13px;font-weight:550}.separator-fade-demo-card header p{color:var(--sprout-muted);margin-top:2px;font-size:12px;line-height:1.6}.separator-fade-demo-card-body{background:var(--sprout-canvas);gap:16px;min-width:0;padding:20px;display:grid}.separator-fade-demo-labels{gap:32px;padding-block:8px;display:grid}.separator-fade-demo-controls{flex-wrap:wrap;gap:8px 12px;display:flex}.separator-fade-demo-transcript{border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-panel);background:var(--sprout-surface);gap:16px;min-width:0;padding:16px;display:grid}.separator-fade-demo-message{min-width:0;display:flex}.separator-fade-demo-message[data-from=user]{justify-content:flex-end}.separator-fade-demo-message p{overflow-wrap:anywhere;max-width:min(100%,28rem);font-size:14px;line-height:1.5}.separator-fade-demo-message[data-from=user] p{border-radius:var(--sprout-radius-panel);background:var(--sprout-secondary);padding:8px 12px}.separator-fade-demo-status{border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-panel);background:var(--sprout-canvas);color:var(--sprout-muted);padding:10px 14px;font-size:13px}.separator-fade-demo-narrow{flex-wrap:wrap;gap:16px;display:flex}.separator-fade-demo-narrow>div{border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-panel);background:var(--sprout-surface);width:140px;padding:12px}.separator-marker-demo{gap:20px;display:grid}.separator-marker-demo-card{border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-panel);background:var(--sprout-surface);min-width:0;overflow:hidden}.separator-marker-demo-card>header{border-bottom:1px solid var(--sprout-line);padding:14px 20px}.separator-marker-demo-card h3{font-size:13px;font-weight:550}.separator-marker-demo-card header p{color:var(--sprout-muted);margin-top:2px;font-size:12px;line-height:1.6}.separator-marker-demo-card-body{background:var(--sprout-canvas);gap:16px;min-width:0;padding:20px;display:grid}.separator-marker-demo-variants{grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:12px;display:grid}.separator-marker-demo-variant{border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-panel);background:var(--sprout-surface);align-content:space-between;gap:14px;min-width:0;padding:14px 16px;display:grid}.separator-marker-demo-variant-text{color:var(--sprout-muted);gap:2px;font-size:12px;line-height:1.5;display:grid}.separator-marker-demo-variant-text code{color:var(--sprout-text);font-size:12px;font-weight:550}.separator-marker-demo-preview{border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-panel);background:var(--sprout-surface);gap:16px;min-width:0;padding:16px;display:grid}.separator-marker-demo-chat{border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-panel);background:var(--sprout-surface);gap:12px;min-width:0;max-width:640px;padding:16px;display:grid}.separator-marker-demo-message{max-width:85%;color:var(--sprout-text);font-size:14px;line-height:1.55}.separator-marker-demo-message[data-role=user]{border-radius:var(--sprout-radius-panel);background:var(--sprout-secondary);justify-self:end;padding:8px 12px}.separator-marker-demo-narrow{grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));align-items:start;gap:12px;display:grid}.separator-marker-demo-narrow-column{border:1px solid var(--sprout-line);border-radius:var(--sprout-radius-panel);background:var(--sprout-surface);width:100%;min-width:0;max-width:200px;padding:12px}