:root {
  --aunt-progress-text-color: var(--aunt-brand-color);
  --aunt-progress-text-size: var(--aunt-font-size-md);
  --aunt-progress-background-color: var(--aunt-gray-2);
  --aunt-progress-bar-color: var(--aunt-brand-color);
  --aunt-progress-text-gutter: var(--aunt-padding-s);
  --aunt-progress-border-radius: var(--aunt-border-radius-max);
  --aunt-progress-height: calc(4 * var(--aunt-hd));
}
.aunt-progress {
  display: flex;
  position: relative;
  align-items: center;
}
.aunt-progress__track {
  flex: 1;
  height: var(--aunt-progress-height);
  position: relative;
  background-color: var(--aunt-progress-background-color);
  border-radius: var(--aunt-progress-border-radius);
}
.aunt-progress__bar {
  position: absolute;
  height: var(--aunt-progress-height);
  border-radius: var(--aunt-progress-border-radius);
  background-color: var(--aunt-progress-bar-color);
}
.aunt-progress--wrapper {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}
.aunt-progress__text {
  font-size: var(--aunt-progress-text-size);
  color: var(--aunt-progress-text-color);
  display: inline-block;
}
.aunt-progress__text--left {
  margin-right: var(--aunt-progress-text-gutter);
}
.aunt-progress__text--right {
  margin-left: var(--aunt-progress-text-gutter);
}
.aunt-progress__text--innerLeft {
  position: absolute;
  margin-left: var(--aunt-progress-text-gutter);
  color: var(--aunt-white-color);
  z-index: 1;
}
.aunt-progress__text--follow {
  font-size: var(--aunt-font-size-sm);
  color: var(--aunt-white-color);
  background-color: var(--aunt-progress-bar-color);
  padding: calc(2 * var(--aunt-hd)) var(--aunt-padding-base);
  border-radius: var(--aunt-border-radius-max);
}