.dui-badge { display: inline-flex; align-items: center; gap: .4rem; padding: .25rem .6rem; border-radius: 999px; background: var(--dui-surface-alt); color: var(--dui-ink); font-size: .72rem; font-weight: 650; }
.dui-badge::before { content: ""; width: .35rem; height: .35rem; border-radius: 50%; background: currentColor; }
.dui-badge[data-tone="success"] { color: var(--dui-success); background: var(--dui-success-bg); }
.dui-badge[data-tone="info"] { color: var(--dui-info); background: var(--dui-info-bg); }
.dui-badge[data-tone="warning"] { color: var(--dui-warning); background: var(--dui-warning-bg); }
.dui-badge[data-tone="danger"] { color: var(--dui-danger); background: var(--dui-danger-bg); }