.chip{align-items:center;column-gap:var(--space-2);max-inline-size:100%;min-block-size:var(--control-h-sm);padding-block:var(--space-1);padding-inline:var(--space-4);border:var(--border-control) solid var(--line);border-radius:var(--radius-pill);background:var(--bg-field);color:var(--ink);text-align:start;overflow-wrap:anywhere;cursor:pointer;flex-wrap:wrap;margin:0;font-weight:600;display:inline-flex;position:relative}.chip:before{content:"";inset-block:calc((var(--control-h-sm) - var(--control-h)) / 2);position:absolute;inset-inline:0}.chip__text{min-inline-size:0}.chip__hint{color:var(--ink-muted)}.chip:focus-visible,.chip:has(.chip__input:focus-visible){outline:var(--border-control) solid var(--line-strong);outline-offset:var(--border-control)}.chip[aria-pressed=false]:hover:not(:disabled),.chip:has(.chip__input:not(:checked,:disabled)):hover{border-color:var(--line-strong)}.chip__input{opacity:0;block-size:100%;inline-size:100%;cursor:inherit;margin:0;position:absolute;inset:0}.chip[aria-pressed=true],.chip:has(.chip__input:checked){border-color:var(--selected);background:var(--selected);color:var(--on-selected)}.chip[aria-pressed=true] .chip__hint,.chip:has(.chip__input:checked) .chip__hint{color:var(--on-selected)}.chip--sm{padding-inline:var(--space-3)}.chip:disabled,.chip:has(.chip__input:disabled){opacity:var(--opacity-disabled);cursor:not-allowed}.badge{max-inline-size:100%;padding-block:var(--space-1);padding-inline:var(--space-3);border-radius:var(--radius-pill);overflow-wrap:anywhere;align-items:center;font-weight:700;display:inline-flex}.badge--heat{background:var(--heat);color:var(--on-heat)}.badge--olive{background:var(--olive);color:var(--on-olive)}.badge--soft{background:var(--olive-tint);color:var(--ink)}
