/* Status filter chip · the kit rules for this component, quoted from phase-2/kit (kit v3) by phase-4/src/build_pack.py.
   Tokens come from ../../styles.css. Build it as: ToggleGroup. */
/* families/status-feedback/family.css */
.sf-filter{display:inline-flex;align-items:center;gap:var(--s-2);height:32px;padding:0 var(--s-3);border-radius:var(--r-control);border:1px solid hsl(var(--secondary-border));background:hsl(var(--background));font:var(--w-medium) 12.5px/1 var(--font-voice);font-stretch:var(--font-stretch-title);color:hsl(var(--foreground));transition:background-color var(--motion-hover),border-color var(--motion-hover),box-shadow var(--motion-focus)}
/* families/status-feedback/family.css */
.sf-filter:hover, .sf-filter.is-hover{background:hsl(var(--muted))}
/* families/status-feedback/family.css */
.sf-filter .n{font:var(--w-regular) 12px/1 var(--font-ui);font-variant-numeric:tabular-nums;color:hsl(var(--muted-foreground))}
/* families/status-feedback/family.css */
.sf-filter[aria-pressed=true]{background:hsl(var(--accent));border-color:hsl(var(--primary)/.4)}
/* families/status-feedback/family.css */
.sf-filter[aria-pressed=true] .n{color:hsl(var(--foreground));font-weight:var(--w-semibold)}
/* families/status-feedback/family.css */
.sf-filter.is-focus{outline:0;border-color:hsl(var(--ring));box-shadow:var(--focus-ring)}
/* families/status-feedback/family.css */
.sf-filter[disabled]{opacity:.45;pointer-events:none}
/* families/status-feedback/family.css */
.sf-filter.warn .n{color:hsl(var(--warning));font-weight:var(--w-semibold)}
/* families/status-feedback/family.css */
.sf-fbar{display:flex;flex-wrap:wrap;gap:var(--s-2)}