/* ── Vertex journey HUD: persistent progress rail + live scene counter (binds the scroll into one film) ── */
.vx-hud{position:fixed;right:20px;top:50%;transform:translateY(-50%);z-index:9995;display:none;flex-direction:column;align-items:flex-end;gap:14px;pointer-events:none;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.vx-hud.on{display:flex}
@media(max-width:860px){.vx-hud{display:none!important}}
.vx-hud-rail{width:2px;height:150px;background:rgba(255,255,255,.12);border-radius:2px;position:relative;overflow:hidden}
.vx-hud-fill{position:absolute;left:0;top:0;width:100%;height:100%;background:var(--orange,#ff7a1f);transform:scaleY(0);transform-origin:top center;will-change:transform}
.vx-hud-meta{display:flex;flex-direction:column;align-items:flex-end;line-height:1.15;letter-spacing:.1em;text-transform:uppercase}
.vx-hud-idx{font-size:.8rem;color:var(--orange,#ff7a1f);font-weight:700}
.vx-hud-tot{font-size:.58rem;color:rgba(255,255,255,.38)}
.vx-hud-name{font-size:.62rem;color:rgba(255,255,255,.66);margin-top:5px;transition:opacity .35s ease}
html[data-theme="light"] .vx-hud-rail{background:rgba(0,0,0,.14)}
html[data-theme="light"] .vx-hud-tot{color:rgba(0,0,0,.4)}
html[data-theme="light"] .vx-hud-name{color:rgba(0,0,0,.55)}

/* ── transition-as-travel: depth-threshold vignette crossing a scene boundary (opacity-only, fixed overlay) ── */
.vx-travel{position:fixed;inset:0;z-index:9994;pointer-events:none;opacity:0;will-change:opacity;
  background:radial-gradient(ellipse 72% 70% at 50% 50%,transparent 18%,rgba(6,6,10,.78) 72%,#06060a 100%)}
html[data-theme="light"] .vx-travel{background:radial-gradient(ellipse 72% 70% at 50% 50%,transparent 20%,rgba(7,10,20,.6) 75%,#070a14 100%)}

/* ── scene-lighting aura: faint accent light behind content (z-index:-1, shows through transparent sections), drifts per beat ── */
.vx-aura{position:fixed;inset:-20%;z-index:-1;pointer-events:none;will-change:transform;transition:transform 1.4s cubic-bezier(.16,1,.3,1);
  background:radial-gradient(38% 34% at 34% 30%,rgba(255,122,31,.12),transparent 70%)}
html[data-theme="light"] .vx-aura{background:radial-gradient(38% 34% at 34% 30%,rgba(232,98,10,.08),transparent 72%)}
