/* Tag input · 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: a composed component. */
/* families/form-controls/family.css */
.fc-tags{height:auto;min-height:var(--control-h);flex-wrap:wrap;padding:5px var(--s-2);gap:6px;cursor:text}
/* families/form-controls/family.css */
.fc-tags input{flex:1 0 120px;height:28px;padding:0 4px}
/* families/form-controls/family.css */
.fc-tag{display:inline-flex;align-items:center;gap:2px;height:26px;padding:0 2px 0 var(--s-2);border-radius:var(--r-chip);background:hsl(var(--accent));color:hsl(var(--accent-foreground));font:var(--w-medium) var(--text-small)/1 var(--font-ui);white-space:nowrap}
/* families/form-controls/family.css */
.fc-tag button{width:22px;height:22px;display:inline-grid;place-items:center;border-radius:var(--r-chip);color:hsl(var(--muted-foreground));transition:background-color var(--motion-hover)}
/* families/form-controls/family.css */
.fc-tag button:hover{background:hsl(var(--primary)/.08);color:hsl(var(--foreground))}
/* families/form-controls/family.css */
.fc-tags.ro .fc-tag, .fc-tags[aria-disabled=true] .fc-tag{padding-right:var(--s-2)}
/* families/form-controls/family.css */
.fc-tags input{flex-basis:56px}