.badge{--_badge-bg:transparent;--_badge-fg:var(--accent);--_badge-border:transparent;--badge-dot-size:.5rem;--badge-dot-color:var(--_dot,var(--accent));border-radius:var(--radius-control);border:1px solid var(--_badge-border);background:var(--_badge-bg);height:1.5rem;color:var(--_badge-fg);white-space:nowrap;align-items:center;gap:5px;padding:0 8px;font-size:.75rem;font-weight:500;line-height:1;transition:background-color .15s,border-color .15s,color .15s;display:inline-flex}.badge:has(.badge__mark){gap:8px;padding-right:0}.badge--outline,.badge--default,.badge--slate{--_badge-bg:var(--surface-muted);--_badge-fg:var(--ink-primary);--_badge-border:var(--border)}.badge--accent,.badge--tint{--_badge-bg:var(--accent-fill);--_badge-fg:var(--accent);--_badge-border:var(--accent-border)}.data-table--tasks .badge{font-size:.65rem}.badge--positive{--_badge-bg:var(--success-fill);--_badge-fg:var(--success);--_badge-border:var(--success-border)}.badge--primary{--_badge-bg:var(--accent);--_badge-fg:var(--accent-on);--_badge-border:var(--accent)}.badge-row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.badge__dot{--badge-dot-size:.5rem;height:var(--badge-dot-size);width:var(--badge-dot-size);background:var(--badge-dot-color);border-radius:50%;flex-shrink:0}.badge__dot--sm{--badge-dot-size:.375rem}.badge__mark{background:var(--accent);min-width:1.5rem;color:var(--accent-on);letter-spacing:0;justify-content:center;align-self:stretch;align-items:center;padding:0 6px;font-size:.625rem;font-weight:700;display:inline-flex}.badge__check{font-weight:800;line-height:1}.badge__spinner{border:2px solid;border-top-color:#0000;border-radius:50%;flex-shrink:0;width:.75rem;height:.75rem}button.badge,a.badge{cursor:pointer}a.badge:hover{opacity:.88}button.badge{height:1.875rem;padding:0 12px;font-size:.8125rem}button.badge:hover:not(:disabled){--_badge-border:var(--border-strong);--_badge-fg:var(--ink-primary)}button.badge--outline{--_badge-bg:var(--surface-elevated)}.badge[aria-pressed=true],.badge[aria-pressed=true]:hover:not(:disabled){--_badge-bg:color-mix(in srgb, var(--chart-emerald) 14%, var(--surface-elevated));--_badge-fg:var(--chart-emerald);--_badge-border:var(--chart-emerald)}
