.color-pill{align-items:center;gap:var(--space-3);width:max-content;display:inline-flex}.color-pill__dots{gap:.15em;display:flex}.color-pill__dot{background-color:var(--dot-color,var(--color-primary));clip-path:polygon(calc(.9em * var(--tilt)) 0, 100% 0, calc(100% - .9em * var(--tilt)) 100%, 0 100%);flex-shrink:0;width:.85em;height:.9em}.color-pill__name{color:var(--color-text-secondary);font-family:var(--font-mono);font-size:var(--font-size-2xs);letter-spacing:var(--tracking-wide);text-transform:uppercase}.color-pill--skeleton{font-family:var(--font-mono);font-size:var(--font-size-2xs);letter-spacing:var(--tracking-wide)}