@layer components{.ui-badge{display:inline-flex;align-items:center;gap:var(--space-1);padding:2px var(--space-2);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:var(--weight-bold);line-height:1.4;white-space:nowrap}.ui-badge--neutral{background-color:var(--color-surface-2);color:var(--color-text-2);border:1px solid var(--color-border-strong)}.ui-badge--accent{background-color:var(--color-accent-tint);color:var(--color-accent);border:1px solid var(--color-border-accent)}.ui-badge--success{background-color:var(--color-success-tint);color:var(--color-success);border:1px solid transparent}.ui-badge--error{background-color:var(--color-error-tint);color:var(--color-error);border:1px solid transparent}.ui-badge--warning{background-color:var(--color-warning-tint);color:var(--color-warning);border:1px solid transparent}.ui-badge--info{background-color:var(--color-info-tint);color:var(--color-info);border:1px solid transparent}.ui-chip{display:inline-flex;align-items:center;gap:var(--space-2);min-height:36px;padding:0 var(--space-4);border-radius:var(--radius-full);background-color:var(--color-surface-2);border:1px solid var(--color-border-strong);color:var(--color-text-2);font-size:var(--text-sm);font-weight:var(--weight-semibold);white-space:nowrap;cursor:pointer;transition:background-color var(--dur-2) var(--ease-out),border-color var(--dur-2) var(--ease-out),color var(--dur-2) var(--ease-out)}.ui-chip:hover{border-color:var(--color-text-3);color:var(--color-text)}.ui-chip--selected{background-color:var(--color-accent-tint);border-color:var(--color-accent);color:var(--color-accent)}}