/* badge.css ─ status pills + signal badges */ .wd-badge { display: inline-flex; align-items: center; gap: 4px; height: 18px; padding: 0 6px; border-radius: 3px; font: 600 10px/1 var(--font); letter-spacing: 0.08em; text-transform: uppercase; } .wd-badge--good { background: var(--signal-good-bg); color: var(--signal-good); } .wd-badge--bad { background: var(--signal-bad-bg); color: var(--signal-bad); } .wd-badge--warn { background: var(--signal-warn-bg); color: var(--signal-warn); } .wd-badge--idle { background: var(--bg-surface); color: var(--text-tertiary); } .wd-badge--info { background: var(--accent-subtle); color: var(--accent); } /* Status dot (4px circle, leading indicator on cards/rows) */ .wd-dot { width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; } .wd-dot--good { background: var(--signal-good); } .wd-dot--bad { background: var(--signal-bad); } .wd-dot--warn { background: var(--signal-warn); } .wd-dot--idle { background: var(--signal-idle); }