.timeline{list-style:none;margin:0;padding:0;display:grid}.timeline__step{position:relative;display:grid;grid-template-columns:22px minmax(0,1fr);grid-gap:0 var(--space-4);gap:0 var(--space-4)}.timeline__step:not(:last-child):before{content:"";position:absolute;left:10px;top:26px;bottom:2px;width:2px;background:var(--color-border)}.timeline__mark{box-sizing:border-box;width:22px;height:22px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;border:2px solid var(--color-border-strong);background:var(--color-surface);color:var(--color-surface)}.timeline__step[data-state=done] .timeline__mark{background:var(--color-success);border-color:var(--color-success)}.timeline__step[data-state=current] .timeline__mark{border-color:var(--color-accent);background:var(--color-accent-tint)}.timeline__step[data-state=current] .timeline__mark:after{content:"";width:8px;height:8px;border-radius:50%;box-sizing:border-box;border:2px solid var(--color-accent)}.timeline__step[data-state=paused] .timeline__mark{background:var(--color-warning);border-color:var(--color-warning);color:var(--palette-ink)}.timeline__body{min-width:0;padding:1px 0 var(--space-5)}.timeline__step:last-child .timeline__body{padding-bottom:0}.timeline__title{margin:0;font:var(--type-label-lg);color:var(--color-ink)}.timeline__detail{margin:2px 0 0;font:var(--type-body-small);color:var(--color-muted)}.timeline__step[data-state=todo] .timeline__title{color:var(--color-muted);font-weight:500}