.j-rail { position: fixed; right: 26px; top: 50%; z-index: 13; display: flex; flex-direction: column; align-items: center; gap: 14px;
  translate: 0 -50%; pointer-events: none; opacity: 0; transition: opacity 0.6s ease;
  padding: var(--j-rail-pad, 0); border-radius: var(--j-rail-radius, 0); background: var(--j-rail-back, none);
  -webkit-backdrop-filter: var(--j-rail-blur, none); backdrop-filter: var(--j-rail-blur, none);
  filter: var(--j-rail-shadow, drop-shadow(0 0 2px rgba(0, 0, 0, 0.55))); }
.j-rail.is-on { opacity: 1; }
.j-rail.is-gone { opacity: 0; }
.j-rail-track { position: relative; width: 1px; height: min(36vh, calc((var(--j-rail-n, 6) - 1) * 30px));
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0), var(--j-rail-line, rgba(255, 255, 255, 0.22)) 8%, var(--j-rail-line, rgba(255, 255, 255, 0.22)) 92%, rgba(255, 255, 255, 0)); }
.j-rail-tick { position: absolute; left: 50%; width: 7px; height: 1px; translate: -50% -50%; background: var(--j-rail-tick, rgba(255, 255, 255, 0.36));
  transition: background-color 0.4s ease, width 0.4s ease; }
.j-rail-tick.is-past { background: var(--j-rail-past, rgba(255, 255, 255, 0.7)); }
.j-rail-dot { position: absolute; left: 50%; width: 3px; height: 18px; translate: -50% -50%; border-radius: 2px; background: var(--j-rail-accent, #8B0000);
  box-shadow: 0 0 0 1px var(--j-rail-glow, rgba(224, 69, 60, 0.6)), 0 0 12px 1px var(--j-rail-glow, rgba(224, 69, 60, 0.55)); }
.j-rail-more { width: 12px; height: 8px; color: var(--j-rail-more, rgba(255, 255, 255, 0.82)); transition: opacity 0.5s ease;
  animation: j-rail-drift 2.4s ease-in-out infinite; }
.j-rail-more > svg, .j-rail-up > svg { display: block; width: 12px; height: 8px; overflow: visible; }
.j-rail.is-end .j-rail-more { opacity: 0; }
@keyframes j-rail-drift { 0%, 100% { translate: 0 -2px; opacity: 0.55; } 50% { translate: 0 3px; opacity: 1; } }
.j-rail-up { width: 12px; height: 8px; color: var(--j-rail-more, rgba(255, 255, 255, 0.82)); rotate: 180deg; transition: opacity 0.5s ease; }
.j-rail.is-start .j-rail-up { opacity: 0; }
.j-rail.is-ctl.is-on:not(.is-gone) > * { pointer-events: auto; }
.j-rail.is-ctl.is-start .j-rail-up, .j-rail.is-ctl.is-end .j-rail-more { pointer-events: none !important; }
.j-rail.is-ctl { touch-action: none; -webkit-tap-highlight-color: transparent; -webkit-user-select: none; user-select: none; }
.j-rail.is-ctl .j-rail-up, .j-rail.is-ctl .j-rail-more { position: relative; cursor: pointer; }
.j-rail.is-ctl .j-rail-up::after, .j-rail.is-ctl .j-rail-more::after { content: ""; position: absolute; inset: -12px -14px; }
.j-rail.is-ctl .j-rail-track { cursor: grab; }
.j-rail.is-ctl .j-rail-track::before { content: ""; position: absolute; inset: -8px -16px; }
.j-rail.is-drag .j-rail-track { cursor: grabbing; }
.j-rail.is-drag .j-rail-dot { transition: top 0.12s ease; }
.j-rail.is-drag .j-rail-more { animation: none; }
html.jp-on .j-rail { right: 14px; top: calc(var(--bar-h, 64px) + 22px); translate: 0 0; gap: 10px; z-index: 4; }
html.jp-on .j-rail { padding: var(--j-rail-pad, 9px 7px); border-radius: var(--j-rail-radius, 14px); background: var(--j-rail-back, rgba(12, 10, 8, 0.46)); }
html.jp-on .j-rail-track { height: min(26vh, calc((var(--j-rail-n, 6) - 1) * 18px)); }
html.jp-on .j-rail-tick { width: 6px; }
html.jp-on .j-rail-dot { height: 14px; }
html.jp-sheet-on .j-rail { opacity: 0; }
@media (prefers-reduced-motion: reduce) { .j-rail-more { animation: none; opacity: 0.8; } .j-rail, .j-rail-tick { transition: none; } }
.sc-failsafe .j-rail { display: none !important; }
@media print { .j-rail { display: none !important; } }
