/* ==========================================================================
   Component: Progress Dots
   Fixed bottom-center panel indicator.
   Depends on: shared/tokens.css
   ========================================================================== */

.progress-dots {
  position: fixed;
  right: 24px;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
  gap: 10px;
  z-index: 100;
}

.dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--white-muted);
  transition: all 0.3s;
  cursor: pointer;
}

.dot.active {
  height: 24px;
  border-radius: 4px;
  background: var(--gold);
}