.tag{align-items:center;border-radius:var(--base-radius-full);display:inline-flex;gap:8px;justify-content:center;position:relative;padding:4px 8px;color:var(--color);background-color:color-mix(in srgb,var(--color) 15%,#fff);height:22px;transition:background-color .16s ease,color .16s ease}.tag.clickable{cursor:pointer}.tag.clickable:hover{background-color:color-mix(in srgb,var(--color) 30%,#fff)}.tag.clickable:active{background-color:color-mix(in srgb,var(--color) 50%,#fff)}.tag.clickable:focus{outline:1px solid var(--color)}.tag .text{position:relative;width:-moz-fit-content;width:fit-content}.filter{--effective-surface-secondary:var(--color,var(--surface-secondary));align-items:center;border-radius:var(--base-radius-full);display:inline-flex;gap:4px;justify-content:center;padding:4px 16px;position:relative;transition:background-color .16s ease,color .16s ease,border-color .16s ease}.filter.with-icon{padding:4px 7px}.filter.excluded{opacity:.7}.filter .text{margin-top:-1px;position:relative;width:-moz-fit-content;width:fit-content}.filter.clickable{cursor:pointer}.filter.clickable:hover:not(.selected){background-color:color-mix(in srgb,var(--effective-surface-secondary))}.filter.clickable:focus{outline:1px solid var(--effective-surface-secondary)}.filter.selected{background-color:color-mix(in srgb,var(--effective-surface-secondary),#fff 80%)}.filter.selected .text{color:var(--effective-surface-secondary)}.filter.unselected{border:1px solid;border-color:var(--effective-surface-secondary)}.filter.unselected .text{color:var(--effective-surface-secondary)}