.fs-pill-button{--pill-action-icon-size:1rem;background:var(--pill-bg);border:1px solid var(--pill-border);cursor:pointer;transition:background-color var(--fs-fast-duration,.167s), color var(--fs-fast-duration,.167s);justify-content:center;align-items:center;gap:.375rem;padding-inline:.875rem;display:inline-flex;position:relative}.fs-pill-button:after{content:"";border-radius:inherit;background:var(--fs-elevation-control-border);pointer-events:none;padding:1px;position:absolute;inset:-1px;-webkit-mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.fs-pill-button.selected:after{background:var(--fs-elevation-accent-control-border)}.fs-pill-button.outline:after,.fs-pill-button.brand:after{background:0 0}.fs-pill-button:has(input:active):after{background:0 0}.fs-pill-button:has(input:disabled):after{background:0 0}.fs-pill-button:has(input:user-invalid):after{background:0 0}.fs-pill-button:has(input[aria-invalid=true]):after{background:0 0}.fs-pill-button.filled:not(.selected):not(.disabled){--pill-bg:var(--fs-control-fill-default);--pill-bg-hover:var(--fs-control-fill-secondary);--pill-bg-pressed:var(--fs-control-fill-tertiary)}.fs-pill-button.small{padding-inline:.625rem}.fs-pill-button.large{--pill-action-icon-size:1.25rem;padding-inline:1rem}.fs-pill-button.extra-large{--pill-action-icon-size:1.5rem;padding-inline:1.25rem}.fs-pill-button:has(>.fs-pill-button-icon){padding-inline-start:calc((var(--pill-height) - var(--pill-action-icon-size)) / 2 - 1px)}.fs-pill-button:has(>.fs-pill-button-icon):not(:has(>.fs-pill-button-text)){width:var(--pill-height);padding:0}.fs-pill-button:has(>.fs-pill-button-media){--pill-avatar-size:calc(var(--pill-height) - .5rem);padding-inline-start:.1875rem}.fs-pill-button>.fs-pill-button-text{align-items:center;gap:inherit;display:inline-flex}.fs-pill-button>.fs-pill-button-media{width:var(--pill-avatar-size);height:var(--pill-avatar-size);flex:none;align-items:center;display:inline-flex}.fs-pill-button>.fs-pill-button-media>*{width:100%;height:100%}.fs-pill-button>.fs-pill-button-media>.fs-avatar{width:var(--pill-avatar-size);height:var(--pill-avatar-size);font-size:calc(var(--pill-avatar-size) / 2.4);flex:none}.fs-pill-button>.fs-pill-button-media>.fs-avatar img{object-fit:cover;width:100%;height:100%}.fs-pill-button:not(.disabled):not(:has(input:disabled)):hover{background:var(--pill-bg-hover)}.fs-pill-button:has(input:active):not(.disabled):not(:has(input:disabled)){background:var(--pill-bg-pressed)}.fs-pill-button:has(input:focus-visible){outline:.125rem solid var(--fs-focus-stroke-outer);outline-offset:.125rem}:is(.fs-pill-button:has(input:user-invalid),.fs-pill-button:has(input[aria-invalid=true])){border-color:var(--fs-system-critical);color:var(--fs-system-critical)}.fs-pill-button.disabled{color:var(--fs-text-disabled);background:var(--fs-control-fill-disabled);border-color:var(--fs-control-stroke-default);cursor:not-allowed}.fs-pill-button:has(input:disabled){color:var(--fs-text-disabled);background:var(--fs-control-fill-disabled);border-color:var(--fs-control-stroke-default);cursor:not-allowed}.fs-pill-button.selected:is(.disabled,:has(input:disabled)){background:var(--fs-accent-fill-disabled);color:var(--fs-text-on-accent-disabled)}.fs-pill-button>input{z-index:1;opacity:0;width:100%;height:100%;cursor:inherit;margin:0;position:absolute;inset:0}.fs-pill-button>.fs-pill-button-icon{font-size:var(--pill-action-icon-size);flex:none;display:inline-flex}.fs-pill-button>.fs-pill-button-icon svg{width:var(--pill-action-icon-size);height:var(--pill-action-icon-size)}@media (prefers-reduced-motion:reduce){.fs-pill-button{transition:none}}