.chip {
  display: inline-flex;
  align-items: baseline;
  gap: 0.25rem;
  padding: 0.2rem 0.55rem;
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1;
  border-radius: 999px;
  white-space: nowrap;
  letter-spacing: 0.01em;
  font-variant-numeric: tabular-nums;
}

.sm {
  padding: 0.1rem 0.4rem;
  font-size: 0.6875rem;
}

.suffix {
  font-weight: 500;
  opacity: 0.75;
}

.good {
  background: var(--status-above-bg);
  color: var(--status-above);
}

.bad {
  background: var(--brand-bg);
  color: var(--brand-strong);
}

.neutral {
  background: var(--bg-secondary);
  color: var(--text-muted);
}