Gradient Shimmer Bar

<!-- Gradient Shimmer Progress Bar -->
<div class="nuda-grad-shimmer" role="progressbar"
     aria-valuenow="62" aria-valuemin="0" aria-valuemax="100"
     aria-label="62% complete">
  <div class="nuda-grad-shimmer__bar" style="width: 62%"></div>
</div>

/* Gradient Shimmer Progress Bar
   A bright highlight sweeps across the lime fill (background-position only).
   Customize: --gradshimmer-color, --gradshimmer-track */

.nuda-grad-shimmer {
  --gradshimmer-color: #e4ff54;
  --gradshimmer-track: rgba(255, 255, 255, 0.08);
  width: 100%;
  height: 10px;
  background: var(--gradshimmer-track);
  border-radius: 5px;
  overflow: hidden;
}

.nuda-grad-shimmer__bar {
  height: 100%;
  border-radius: 5px;
  background: linear-gradient(
    90deg,
    #9bb024 0%,
    var(--gradshimmer-color) 40%,
    #ffffff 50%,
    var(--gradshimmer-color) 60%,
    #9bb024 100%
  );
  background-size: 250% 100%;
  animation: nuda-grad-shimmer 1.6s linear infinite;
  transition: width 0.3s ease;
}

@keyframes nuda-grad-shimmer {
  0%   { background-position: 150% 0; }
  100% { background-position: -150% 0; }
}

@media (prefers-reduced-motion: reduce) {
  .nuda-grad-shimmer__bar { animation: none; background-position: 50% 0; }
}