.Stepper {
  --stepper-connector-border: 2px solid var(--color-border-base-main);
  --stepper-connector-margin-block-end: 8px;
  display: flex;
}

  .Stepper_size_2xs {
      --stepper-step-dot-size: 12px;
    }

  .Stepper_size_xs {
      --stepper-step-dot-size: 24px;
    }

  .Stepper_size_s {
      --stepper-step-dot-size: 36px;
    }

  .Stepper_size_m {
      --stepper-step-dot-size: 40px;
    }

  .Stepper_size_l {
      --stepper-step-dot-size: 44px;
    }

  .Stepper_orientation_vertical {
      --stepper-step-flex-direction: row;
      flex-direction: column;
    }

  .Stepper_orientation_vertical .Stepper-Connector {
        -webkit-margin-after: var(--stepper-connector-margin-block-end);
                margin-block-end: var(--stepper-connector-margin-block-end);
      }

  .Stepper_orientation_horizontal {
      --stepper-step-flex-direction: column;
    }

  .Stepper-Connector {
    min-block-size: 20px;
  }

  .Stepper-Connector_orientation_vertical {
        -webkit-border-start: var(--stepper-connector-border);
                border-inline-start: var(--stepper-connector-border);
        -webkit-margin-start: calc(var(--stepper-step-dot-size) / 2 - 1px);
                margin-inline-start: calc(var(--stepper-step-dot-size) / 2 - 1px);
      }