.sub-progress-bar,
.block-sub-progress-bar {
  --progress-value: 20%;
  --progress-color: #e50041;
  --progress-height: 8px;
  position: relative;
  width: 100%;
  max-width: 375px;
  height: var(--progress-height);
}

.sub-progress-bar__track {
  position: absolute;
  inset: 0;
  border-radius: 999px;
  background: #F5F5F5;
  border: 1px solid #E5E5E5;
}

.sub-progress-bar__fill {
  position: absolute;
  inset: 0 auto 0 0;
  width: var(--progress-value);
  border-radius: 999px;
  background: var(--progress-color);
}

.sub-progress-bar__thumb {
  position: absolute;
  top: 50%;
  left: var(--progress-value);
  transform: translate(-50%, -50%);
  width: calc(var(--progress-height) * 1.8);
  height: calc(var(--progress-height) * 1.8);
  border-radius: 50%;
  background: var(--progress-color);
}

.wp-block-group:has(+ .sub-progress-bar),
.sub-progress-bar + .wp-block-group {
  white-space: nowrap;
}