.angle-input {
  &:not(&--disabled) &__knob {
    transition: width 100ms linear;
  }

  @media (hover: hover) {
    &:not(&--disabled):not(:active) &__knob-wrapper:hover &__knob {
      width: 6px;
    }
  }

  &:not(&--disabled):active &__knob {
    width: 12px;
    border-width: 3px;
  }

  @media (prefers-reduced-motion) {
    &:not(&--disabled) &__knob {
      transition: none;
    }
  }
}