@scope([data-example]){[data-slot=timeline]{flex-direction:column;width:22rem;max-width:100%;margin:0;padding:0;list-style:none;display:flex}[data-slot=timeline][data-orientation=horizontal]{flex-direction:row;width:auto}[data-slot=timeline][data-busy]{opacity:.6}[data-slot=timeline-item]{grid-template-columns:var(--size-icon) 1fr;align-content:start;column-gap:var(--space-3);padding-bottom:var(--space-6);border-radius:var(--radius-row);outline-offset:var(--space-1);display:grid;position:relative}[data-slot=timeline-item]>*{grid-column:2}[data-slot=timeline-item]:last-child,[data-slot=timeline-item][data-last]{padding-bottom:0}[data-orientation=horizontal]>[data-slot=timeline-item]{row-gap:var(--space-2);width:8rem;padding-bottom:0;grid-template-columns:1fr;padding-inline-end:var(--space-4)}[data-orientation=horizontal]>[data-slot=timeline-item]>*{grid-column:1}[data-slot=timeline-marker]{box-sizing:border-box;width:var(--size-icon);height:var(--size-icon);border:2px solid var(--line);background:var(--paper);color:var(--paper);border-radius:50%;grid-area:1/1;align-self:center;place-items:center;display:grid}[data-slot=timeline-marker]>svg{stroke-width:3px;width:10px;height:10px}[data-slot=timeline-marker][data-complete]{border-color:var(--ink);background:var(--ink)}[data-slot=timeline-marker][data-current]{border-color:var(--ink);box-shadow:0 0 0 4px var(--halo)}[data-slot=timeline-marker][data-upcoming]{border-style:dashed}[data-slot=timeline-connector]{top:calc(var(--leading) / 2 + var(--size-icon) / 2 + var(--space-1));bottom:var(--space-1);background:var(--line-faint);grid-column:auto;width:2px;position:absolute;inset-inline-start:calc(var(--size-icon) / 2 - 1px)}[data-slot=timeline-connector][data-complete]{background:var(--ink)}:is(:last-child,[data-last])>[data-slot=timeline-connector]{display:none}[data-orientation=horizontal]>*>[data-slot=timeline-connector]{top:calc(var(--size-icon) / 2 - 1px);bottom:auto;inset-inline:calc(var(--size-icon) + var(--space-1)) var(--space-1);width:auto;height:2px}[data-slot=timeline-title]{font-weight:500;line-height:var(--leading);grid-row:1}[data-orientation=horizontal]>*>[data-slot=timeline-title]{grid-row:2}[data-slot=timeline-time]{color:var(--muted);font-size:var(--text-xs)}[data-slot=timeline-description]{margin-top:var(--space-1);font-size:var(--text-sm)}[data-slot=timeline-item]>[data-slot=collapsible-root]{margin-top:var(--space-2);width:auto}:scope:has([data-slot=timeline][role=feed]){justify-content:flex-start}}