Выровнять метку под индикатором шага

Question

Я бы хотел добавить метки, не удаляя внутренние круги и не вызывая проблем с существующим дизайном. Когда я добавляю метки, кажется, что они перемещают внутренние белые узлы или требуют настройки поля без ответа.

PUG

.progress-bar
    template(v-for="i of totalSteps")
      span.circle(:style="styleCircle[i-1]")
        span.node-circle(v-if="i>=totalSteps-1")
      span.line(:style="styleLine[i-1]" v-if="i!==totalSteps")

SASS

.progress-bar
  display: flex
  justify-content: center
  margin-bottom: 10px

.circle
  height: 20px
  width: 20px
  border-radius: 50%
  display: flex
  align-items: center
  margin: 0 auto

.line
  width: 100px
  height: 12px
  position: relative

.node-circle
  background-color: white
  height: 10px
  width: 10px
  border-radius: 50%
  position: relative
  margin: 0 auto