/* ============================================================
   Cover Panel B — vertical loader. Owner request Aug 2026: a vertical
   line beneath the Work intro's last line ("Five systems... to do."),
   stretching down to the bottom edge of this pinned screen, ending in
   a small circle right there — all of it contained inside this one
   screen, no separate element spanning into the Work section.

   .wcov__spacer (flex:1, empty) above .wcov__text and .wcov__loader
   (flex:1) below it, inside .wcov__pan--b (justify-content overridden
   to flex-start in work-cover.css) — two equal flex:1 regions keep the
   text block centred exactly like before, but now the *second* one is
   real, visible content: the loader stretches to fill it entirely,
   reaching the panel's actual bottom edge rather than stopping at a
   fixed height. Pure CSS, no JS measurement of where the text ends —
   robust across any viewport height without a resize listener.

   Owner correction Aug 2026: no dim resting state at all — neither the
   track nor the dot show anything until they're actually filled. The
   line and the circle only exist once the scroll progress reaches
   them; nothing sits there beforehand as a preview of where they'll
   be.
   ============================================================ */

.wcov__loader{
  flex:1 1 0; position:relative; width:2px;
  margin-top:var(--sp-7); transform:translateY(-5px);
}

/* Grows from the top down — transform, not height, so it's one
   composited property per frame, not a layout-triggering resize. No
   track underneath it: there is nothing to see until this exists.
   bottom:8px, not height:100% — matches .wcov__loader-dot's own
   bottom offset exactly, so scaleY(1) lands the fill's edge right at
   the dot instead of 8px past it, and the charge (work-cover.js,
   loaderP>=1) lines up with the moment it visually touches. */
.wcov__loader-fill{
  position:absolute; top:0; left:0; width:100%; bottom:8px;
  background:var(--fill-bright); transform:scaleY(0); transform-origin:top;
  will-change:transform;
}

/* Invisible until charged — no hollow ring, no dim resting colour.
   .is-charged is the only thing that ever draws it, at the exact
   moment the fill reaches the bottom (work-cover.js). */
.wcov__loader-dot{
  position:absolute; left:50%; bottom:8px; transform:translateX(-50%) scale(0);
  width:14px; height:14px; border-radius:50%;
  background:var(--fill-bright);
  transition:transform var(--dur-3) var(--ease-move);
}
.wcov__loader-dot.is-charged{
  transform:translateX(-50%) scale(1.5);
}

@media (prefers-reduced-motion:reduce){
  .wcov__loader{ display:none; }
}