:root,:host{--badge-font-weight: var(--font-weight-medium);--badge-close-button-color: inherit;--badge-close-button-size: 1em;--badge-padding-block-sm-min: 5;--badge-padding-block-sm-max: 5;--badge-padding-inline-sm-min: 8;--badge-padding-inline-sm-max: 10;--badge-font-size-sm-min: 10;--badge-font-size-sm-max: 12;--badge-line-height-sm-min: 10;--badge-line-height-sm-max: 12;--badge-gap-sm-min: 4;--badge-gap-sm-max: 4;--badge-border-radius-sm-min: 6;--badge-border-radius-sm-max: 6;--badge-padding-block-md-min: 8;--badge-padding-block-md-max: 10;--badge-padding-inline-md-min: 12;--badge-padding-inline-md-max: 15;--badge-font-size-md-min: 12;--badge-font-size-md-max: 14;--badge-line-height-md-min: 12;--badge-line-height-md-max: 14;--badge-gap-md-min: 4;--badge-gap-md-max: 6;--badge-border-radius-md-min: 6;--badge-border-radius-md-max: 6;--badge-padding-block-lg-min: 8;--badge-padding-block-lg-max: 10;--badge-padding-inline-lg-min: 16;--badge-padding-inline-lg-max: 20;--badge-font-size-lg-min: 14;--badge-font-size-lg-max: 16;--badge-line-height-lg-min: 14;--badge-line-height-lg-max: 16;--badge-gap-lg-min: 6;--badge-gap-lg-max: 8;--badge-border-radius-lg-min: 6;--badge-border-radius-lg-max: 6;--badge-gray-background: #DCDFE4;--badge-gray-background-hover: #d2d6db;--badge-gray-color: #44546F;--badge-gray-color-hover: var(--color-neutral-1000);--badge-gray-border: none;--badge-brand-background: var(--color-brand-50);--badge-brand-background-hover: var(--badge-brand-background);--badge-brand-color: var(--color-brand-700);--badge-brand-color-hover: var(--color-brand-900);--badge-brand-border: 1px solid var(--color-brand-200);--badge-inverse-background: rgba(255, 255, 255, 0.3);--badge-inverse-background-hover: var(--badge-inverse-background);--badge-inverse-color: var(--color-white);--badge-inverse-color-hover: var(--color-white);--badge-inverse-border: 1px solid var(--color-white);--badge-bw-background: rgba(0, 0, 0, 0.1);--badge-bw-background-hover: var(--badge-bw-background);--badge-bw-color: var(--color-neutral-900);--badge-bw-color-hover: var(--color-neutral-950);--badge-bw-border: 1px solid var(--color-neutral-900);--badge-success-background: var(--color-success-50);--badge-success-background-hover: var(--badge-success-background);--badge-success-color: var(--color-success-700);--badge-success-color-hover: var(--color-success-900);--badge-success-border: 1px solid var(--color-success-200);--badge-warning-background: var(--color-warning-50);--badge-warning-background-hover: var(--badge-warning-background);--badge-warning-color: var(--color-warning-700);--badge-warning-color-hover: var(--color-warning-900);--badge-warning-border: 1px solid var(--color-warning-200);--badge-danger-background: var(--color-error-50);--badge-danger-background-hover: var(--badge-danger-background);--badge-danger-color: var(--color-error-700);--badge-danger-color-hover: var(--color-error-900);--badge-danger-border: 1px solid var(--color-error-200)}.badge{--background: var(--badge-gray-background);--foreground: var(--badge-gray-color);--border: var(--badge-gray-border);--border-radius: inherit;position:relative;display:inline-flex;align-items:center;background:var(--background);color:var(--foreground);border:var(--border);border-radius:var(--border-radius);box-shadow:var(--shadow);width:fit-content;height:fit-content;font-weight:var(--badge-font-weight);font-size:var(--font-size);line-height:var(--line-height);padding:var(--padding);gap:var(--gap);transition:color 150ms ease-in-out,background-color 150ms ease-in-out,border-color 150ms ease-in-out}.badge:hover,.badge.active{--background: var(--badge-gray-background-hover);--foreground: var(--badge-gray-color-hover)}.badge a,.badge .link{position:static;--border: none;--padding: 0;--shadow: none;--decoration: none;--foreground: inherit;--background: transparent;font-weight:var(--badge-font-weight);font-size:inherit;line-height:inherit;text-decoration:none;color:inherit;cursor:pointer;transition:none}.badge a::after,.badge .link::after{display:block;content:"";position:absolute;top:0;left:0;width:100%;height:100%;border-radius:inherit;z-index:0}.badge a *,.badge .link *{transition:none}.badge svg{color:inherit;transition:none}.badge svg *{transition:none}.badge .badge__close-button{align-self:center;display:flex;cursor:pointer;opacity:.5;z-index:1;--foreground: var(--badge-close-button-color, var(--foreground))}.badge .badge__close-button svg{width:var(--badge-close-button-size, 1em);height:var(--badge-close-button-size, 1em)}.badge.size--sm{--padding-block:clamp(var(--badge-padding-block-sm-min)*1px,(var(--badge-padding-block-sm-max) - var(--badge-padding-block-sm-min))/(var(--viewport-max) - var(--viewport-min))*100vw + (var(--badge-padding-block-sm-min) - (var(--badge-padding-block-sm-max) - var(--badge-padding-block-sm-min))*var(--viewport-min)/(var(--viewport-max) - var(--viewport-min)))*1px,var(--badge-padding-block-sm-max)*1px);--padding-inline:clamp(var(--badge-padding-inline-sm-min)*1px,(var(--badge-padding-inline-sm-max) - var(--badge-padding-inline-sm-min))/(var(--viewport-max) - var(--viewport-min))*100vw + (var(--badge-padding-inline-sm-min) - (var(--badge-padding-inline-sm-max) - var(--badge-padding-inline-sm-min))*var(--viewport-min)/(var(--viewport-max) - var(--viewport-min)))*1px,var(--badge-padding-inline-sm-max)*1px);--padding: var(--padding-block) var(--padding-inline);--font-size:clamp(var(--badge-font-size-sm-min)*1px,(var(--badge-font-size-sm-max) - var(--badge-font-size-sm-min))/(var(--viewport-max) - var(--viewport-min))*100vw + (var(--badge-font-size-sm-min) - (var(--badge-font-size-sm-max) - var(--badge-font-size-sm-min))*var(--viewport-min)/(var(--viewport-max) - var(--viewport-min)))*1px,var(--badge-font-size-sm-max)*1px);--line-height:clamp(var(--badge-line-height-sm-min)*1px,(var(--badge-line-height-sm-max) - var(--badge-line-height-sm-min))/(var(--viewport-max) - var(--viewport-min))*100vw + (var(--badge-line-height-sm-min) - (var(--badge-line-height-sm-max) - var(--badge-line-height-sm-min))*var(--viewport-min)/(var(--viewport-max) - var(--viewport-min)))*1px,var(--badge-line-height-sm-max)*1px);--gap:clamp(var(--badge-gap-sm-min)*1px,(var(--badge-gap-sm-max) - var(--badge-gap-sm-min))/(var(--viewport-max) - var(--viewport-min))*100vw + (var(--badge-gap-sm-min) - (var(--badge-gap-sm-max) - var(--badge-gap-sm-min))*var(--viewport-min)/(var(--viewport-max) - var(--viewport-min)))*1px,var(--badge-gap-sm-max)*1px);--border-radius:clamp(var(--badge-border-radius-sm-min)*1px,(var(--badge-border-radius-sm-max) - var(--badge-border-radius-sm-min))/(var(--viewport-max) - var(--viewport-min))*100vw + (var(--badge-border-radius-sm-min) - (var(--badge-border-radius-sm-max) - var(--badge-border-radius-sm-min))*var(--viewport-min)/(var(--viewport-max) - var(--viewport-min)))*1px,var(--badge-border-radius-sm-max)*1px)}.badge.size--md{--padding-block:clamp(var(--badge-padding-block-md-min)*1px,(var(--badge-padding-block-md-max) - var(--badge-padding-block-md-min))/(var(--viewport-max) - var(--viewport-min))*100vw + (var(--badge-padding-block-md-min) - (var(--badge-padding-block-md-max) - var(--badge-padding-block-md-min))*var(--viewport-min)/(var(--viewport-max) - var(--viewport-min)))*1px,var(--badge-padding-block-md-max)*1px);--padding-inline:clamp(var(--badge-padding-inline-md-min)*1px,(var(--badge-padding-inline-md-max) - var(--badge-padding-inline-md-min))/(var(--viewport-max) - var(--viewport-min))*100vw + (var(--badge-padding-inline-md-min) - (var(--badge-padding-inline-md-max) - var(--badge-padding-inline-md-min))*var(--viewport-min)/(var(--viewport-max) - var(--viewport-min)))*1px,var(--badge-padding-inline-md-max)*1px);--padding: var(--padding-block) var(--padding-inline);--font-size:clamp(var(--badge-font-size-md-min)*1px,(var(--badge-font-size-md-max) - var(--badge-font-size-md-min))/(var(--viewport-max) - var(--viewport-min))*100vw + (var(--badge-font-size-md-min) - (var(--badge-font-size-md-max) - var(--badge-font-size-md-min))*var(--viewport-min)/(var(--viewport-max) - var(--viewport-min)))*1px,var(--badge-font-size-md-max)*1px);--line-height:clamp(var(--badge-line-height-md-min)*1px,(var(--badge-line-height-md-max) - var(--badge-line-height-md-min))/(var(--viewport-max) - var(--viewport-min))*100vw + (var(--badge-line-height-md-min) - (var(--badge-line-height-md-max) - var(--badge-line-height-md-min))*var(--viewport-min)/(var(--viewport-max) - var(--viewport-min)))*1px,var(--badge-line-height-md-max)*1px);--gap:clamp(var(--badge-gap-md-min)*1px,(var(--badge-gap-md-max) - var(--badge-gap-md-min))/(var(--viewport-max) - var(--viewport-min))*100vw + (var(--badge-gap-md-min) - (var(--badge-gap-md-max) - var(--badge-gap-md-min))*var(--viewport-min)/(var(--viewport-max) - var(--viewport-min)))*1px,var(--badge-gap-md-max)*1px);--border-radius:clamp(var(--badge-border-radius-md-min)*1px,(var(--badge-border-radius-md-max) - var(--badge-border-radius-md-min))/(var(--viewport-max) - var(--viewport-min))*100vw + (var(--badge-border-radius-md-min) - (var(--badge-border-radius-md-max) - var(--badge-border-radius-md-min))*var(--viewport-min)/(var(--viewport-max) - var(--viewport-min)))*1px,var(--badge-border-radius-md-max)*1px)}.badge.size--lg{--padding-block:clamp(var(--badge-padding-block-lg-min)*1px,(var(--badge-padding-block-lg-max) - var(--badge-padding-block-lg-min))/(var(--viewport-max) - var(--viewport-min))*100vw + (var(--badge-padding-block-lg-min) - (var(--badge-padding-block-lg-max) - var(--badge-padding-block-lg-min))*var(--viewport-min)/(var(--viewport-max) - var(--viewport-min)))*1px,var(--badge-padding-block-lg-max)*1px);--padding-inline:clamp(var(--badge-padding-inline-lg-min)*1px,(var(--badge-padding-inline-lg-max) - var(--badge-padding-inline-lg-min))/(var(--viewport-max) - var(--viewport-min))*100vw + (var(--badge-padding-inline-lg-min) - (var(--badge-padding-inline-lg-max) - var(--badge-padding-inline-lg-min))*var(--viewport-min)/(var(--viewport-max) - var(--viewport-min)))*1px,var(--badge-padding-inline-lg-max)*1px);--padding: var(--padding-block) var(--padding-inline);--font-size:clamp(var(--badge-font-size-lg-min)*1px,(var(--badge-font-size-lg-max) - var(--badge-font-size-lg-min))/(var(--viewport-max) - var(--viewport-min))*100vw + (var(--badge-font-size-lg-min) - (var(--badge-font-size-lg-max) - var(--badge-font-size-lg-min))*var(--viewport-min)/(var(--viewport-max) - var(--viewport-min)))*1px,var(--badge-font-size-lg-max)*1px);--line-height:clamp(var(--badge-line-height-lg-min)*1px,(var(--badge-line-height-lg-max) - var(--badge-line-height-lg-min))/(var(--viewport-max) - var(--viewport-min))*100vw + (var(--badge-line-height-lg-min) - (var(--badge-line-height-lg-max) - var(--badge-line-height-lg-min))*var(--viewport-min)/(var(--viewport-max) - var(--viewport-min)))*1px,var(--badge-line-height-lg-max)*1px);--gap:clamp(var(--badge-gap-lg-min)*1px,(var(--badge-gap-lg-max) - var(--badge-gap-lg-min))/(var(--viewport-max) - var(--viewport-min))*100vw + (var(--badge-gap-lg-min) - (var(--badge-gap-lg-max) - var(--badge-gap-lg-min))*var(--viewport-min)/(var(--viewport-max) - var(--viewport-min)))*1px,var(--badge-gap-lg-max)*1px);--border-radius:clamp(var(--badge-border-radius-lg-min)*1px,(var(--badge-border-radius-lg-max) - var(--badge-border-radius-lg-min))/(var(--viewport-max) - var(--viewport-min))*100vw + (var(--badge-border-radius-lg-min) - (var(--badge-border-radius-lg-max) - var(--badge-border-radius-lg-min))*var(--viewport-min)/(var(--viewport-max) - var(--viewport-min)))*1px,var(--badge-border-radius-lg-max)*1px)}.badge.style--gray{--background: var(--badge-gray-background);--foreground: var(--badge-gray-color);--border: var(--badge-gray-border)}.badge.style--gray:hover,.badge.style--gray.active{--background: var(--badge-gray-background-hover);--foreground: var(--badge-gray-color-hover)}.badge.style--brand{--background: var(--badge-brand-background);--foreground: var(--badge-brand-color);--border: var(--badge-brand-border)}.badge.style--brand:hover,.badge.style--brand.active{--background: var(--badge-brand-background-hover);--foreground: var(--badge-brand-color-hover)}.badge.style--inverse{--background: var(--badge-inverse-background);--foreground: var(--badge-inverse-color);--border: var(--badge-inverse-border)}.badge.style--inverse:hover,.badge.style--inverse.active{--background: var(--badge-inverse-background-hover);--foreground: var(--badge-inverse-color-hover)}.badge.style--bw{--background: var(--badge-bw-background);--foreground: var(--badge-bw-color);--border: var(--badge-bw-border)}.badge.style--bw:hover,.badge.style--bw.active{--background: var(--badge-bw-background-hover);--foreground: var(--badge-bw-color-hover)}.badge.style--success{--background: var(--badge-success-background);--foreground: var(--badge-success-color);--border: var(--badge-success-border)}.badge.style--success:hover,.badge.style--success.active{--background: var(--badge-success-background-hover);--foreground: var(--badge-success-color-hover)}.badge.style--warning{--background: var(--badge-warning-background);--foreground: var(--badge-warning-color);--border: var(--badge-warning-border)}.badge.style--warning:hover,.badge.style--warning.active{--background: var(--badge-warning-background-hover);--foreground: var(--badge-warning-color-hover)}.badge.style--danger{--background: var(--badge-danger-background);--foreground: var(--badge-danger-color);--border: var(--badge-danger-border)}.badge.style--danger:hover,.badge.style--danger.active{--background: var(--badge-danger-background-hover);--foreground: var(--badge-danger-color-hover)}.badge>svg,.badge>img{width:var(--line-height);height:var(--line-height);flex-shrink:0}