:root {
  --rwcc-progress-top: 0px;
  --rwcc-progress-height: 3px;
  --rwcc-progress-track: rgba(17, 24, 39, 0.12);
  --rwcc-progress-gradient: linear-gradient(
    90deg,
    #22c55e 0%,
    #06b6d4 35%,
    #3b82f6 70%,
    #a855f7 100%
  );
}

.rwcc-progress {
  position: fixed;
  top: var(--rwcc-progress-top);
  left: 0;
  right: 0;
  height: var(--rwcc-progress-height);
  background: var(--rwcc-progress-track);
  z-index: 2000;
  pointer-events: none;
}

.rwcc-progress__bar {
  width: 100%;
  height: 100%;
  transform: scaleX(0);
  transform-origin: left;
  background: var(--rwcc-progress-gradient);
  transition: transform 120ms linear;
}

@media (prefers-reduced-motion: reduce) {
  .rwcc-progress__bar {
    transition: none;
  }
}