/* stylelint-disable */
.Slider {
  --slider-thumb-background-color: var(--color-background-accent-default);
  --slider-thumb-border-color: var(--color-border-base-accent-on);
  --slider-inner-rail-background-color: var(--color-background-accent-default);
  --slider-range-background-color: var(--color-border-base-main);
  --slider-position: 0;
  inline-size: 100%;
}
.Slider_size_m {
      --slider-size: 12px;
    }
.Slider_size_l {
      --slider-size: 20px;
    }
.Slider_disabled {
    --slider-thumb-background-color: var(--color-static-grey);
    --slider-thumb-border-color: var(--color-static-grey);
    --slider-inner-rail-background-color: var(--color-background-base-tertiary);
    --slider-range-background-color: var(--color-background-base-disabled);
  }
.Slider_hasMarks .Slider-Container {
      -webkit-margin-after: var(--spacing-6x);
              margin-block-end: var(--spacing-6x);
    }
.Slider-Container {
    position: relative;
    block-size: var(--slider-size);
  }
.Slider-Input {
    inset-inline-start: calc(var(--slider-size) / 2 * -1);
    block-size: var(--slider-size);
    inline-size: calc(100% + var(--slider-size));
    margin: 0;
    opacity: 0;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
    position: absolute;
    outline: none;
    cursor: pointer;
  }
.Slider-Input:hover + .Slider-Range .Slider-Thumb {
      --slider-thumb-background-color: var(--color-background-accent-hover);
    }
.Slider-Input:active + .Slider-Range .Slider-Thumb {
      --slider-thumb-background-color: var(--color-background-accent-pressed);
    }
.Slider-Input:focus-visible + .Slider-Range .Slider-Thumb {
      --slider-thumb-border-color: var(--color-border-accent-focused);
    }
.Slider-Input:disabled {
      pointer-events: none;
      cursor: default;
    }
.Slider-Range {
    background-color: var(--slider-range-background-color);
    border-radius: var(--border-radius-2xs);
    pointer-events: none;
    position: absolute;
    inline-size: 100%;
    inset-block-start: 50%;
    transform: translateY(-50%);
    display: block;
    block-size: 2px;
  }
.Slider-Rail {
    background-color: var(--slider-inner-rail-background-color);
    border-radius: var(--border-radius-2xs);
    inline-size: var(--slider-position);
    display: block;
    block-size: 2px;
  }
.Slider-Thumb {
    block-size: var(--slider-size);
    inline-size: var(--slider-size);
    border: var(--border-width-m) solid var(--slider-thumb-border-color);
    background-color: var(--slider-thumb-background-color);
    inset-inline-start: var(--slider-position);
    box-shadow: var(--shadow-s);
    position: absolute;
    display: block;
    box-sizing: border-box;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    inset-block-start: 50%;
    transition: background-color var(--transition-default),
      border-color var(--transition-default);
  }
