/* ============================================================
   READING PROGRESS BAR
   Thin gradient bar fixed at the top of the viewport.
   Fills as the user scrolls — full width = reached page bottom.
   Markup is injected by menu.php:
     <div class="reading-progress" id="readingProgress"><div class="reading-progress-fill"></div></div>
   ============================================================ */

.reading-progress {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 3px;
  z-index: 9999;
  pointer-events: none;
  background: rgba(255, 255, 255, 0.08);
}

.reading-progress-fill {
  width: 0%;
  height: 100%;
  background: linear-gradient(90deg, #e8611a, #f0943a);
  transition: width 0.1s linear;
}