.ui-state-tag{--state-soft:var(--surface-3);--state-text:var(--ink-700);align-items:center;gap:var(--space-1);height:var(--space-5);padding:0 var(--space-2);border-radius:var(--radius-xs);background:var(--state-soft);color:var(--state-text);font:inherit;font-size:var(--text-xs);font-weight:500;line-height:var(--space-5);white-space:nowrap;vertical-align:middle;border:0;flex:none;margin:0;display:inline-flex}.ui-state-tag.is-sm{height:calc(var(--space-4) + var(--space-1) / 2);padding:0 calc(var(--space-1) * 1.5);font-size:var(--text-2xs);line-height:calc(var(--space-4) + var(--space-1) / 2)}.ui-state-tag[data-tone=success]{--state-soft:var(--success-soft);--state-text:var(--success-text)}.ui-state-tag[data-tone=warning]{--state-soft:var(--warning-soft);--state-text:var(--warning-text)}.ui-state-tag[data-tone=danger]{--state-soft:var(--danger-soft);--state-text:var(--danger-text)}.ui-state-tag[data-tone=brand]{--state-soft:var(--brand-soft);--state-text:var(--brand-text)}.ui-state-tag-dot{width:calc(var(--space-1) * 1.5);height:calc(var(--space-1) * 1.5);background:currentColor;border-radius:50%;flex:none}.ui-state-tag.is-live .ui-state-tag-dot{animation:ui-state-pulse var(--duration-loop) var(--ease-loop) infinite}@keyframes ui-state-pulse{50%{opacity:.35}}.ui-state-tag.is-action{cursor:pointer;transition:box-shadow var(--duration-fast) var(--ease)}.ui-state-tag.is-action:hover{box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--state-text) 35%, transparent)}@media (prefers-reduced-motion:reduce){.ui-state-tag.is-live .ui-state-tag-dot{animation:none}.ui-state-tag.is-action{transition:none}}
