/* Page-specific styles for connections (from inline \3c style>, shadowified). */
.seq { display:flex; flex-direction:column; gap:0; }
.seq__step { display:flex; gap:12px; }
.seq__rail { display:flex; flex-direction:column; align-items:center; }
.seq__dot { width:26px; height:26px; border-radius:999px; display:grid; place-items:center; flex:none; }
.seq__dot .ic { width:14px; height:14px; }
.seq__dot.done { background:var(--accent); color:#fff; }
.seq__dot.wait { background:var(--accent-tint); color:var(--accent); }
.seq__line { width:2px; flex:1; background:var(--line-200); margin:2px 0; min-height:14px; }
.seq__body { padding-bottom:14px; }
.seq__body b { font-size:13px; color:var(--ink-900); display:block; }
.seq__body small { font-size:12px; color:var(--ink-400); }
.status { padding:4px 9px; font-size:11px; border-radius:999px; font-weight:600; display:inline-flex; align-items:center; gap:5px; }
.status .ic { width:11px; height:11px; }
.status--accepted { background:var(--accent-tint); color:var(--accent); }
.status--sent { background:color-mix(in srgb, var(--success-500) 16%, white); color:var(--success-500); }
.status--req { background:var(--surface-100); color:var(--ink-400); }