.section-rail {
  position:fixed;left:12px;top:50%;transform:translateY(-50%);z-index:90;
  display:flex;flex-direction:column;gap:16px;max-height:calc(100dvh - 180px);
  opacity:0;visibility:hidden;pointer-events:none;transition:opacity .3s;
  font-family:'Inter',sans-serif;
}
.section-rail.is-visible {opacity:1;visibility:visible;pointer-events:auto}
.section-rail[hidden] {display:none}
.section-rail a {display:flex;align-items:center;gap:10px;position:relative;width:26px;height:26px;text-decoration:none}
.section-rail b {display:grid;place-items:center;box-sizing:border-box;width:24px;height:24px;flex-shrink:0;border:1px solid #434854;border-radius:50%;color:#aaa;background:#111317;font-size:10px;font-weight:600;transition:background .25s,transform .25s,color .25s}
.section-rail span {position:absolute;left:35px;max-width:240px;width:max-content;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:#111317;color:#fff;padding:6px 10px;border:1px solid #343842;border-radius:5px;font-size:11px;letter-spacing:.04em;opacity:0;transform:translateX(-5px);transition:opacity .25s,transform .25s;pointer-events:none}
.section-rail a.is-active b {color:#04121a;border-color:transparent;background:linear-gradient(120deg,#00cbe6,#4d8eff);box-shadow:0 0 14px #00cbe64d;transform:scale(1.1)}
.section-rail a:hover span,.section-rail a:focus-visible span {opacity:1;transform:none}
.section-rail a:focus-visible {outline:2px solid #4d8eff;outline-offset:5px;border-radius:50%}
@media(min-width:1700px) {.section-rail a.is-active span {opacity:1;transform:none}}
@media(max-width:1350px),(max-height:580px) {.section-rail {display:none}}
@media(prefers-reduced-motion:reduce) {.section-rail,.section-rail * {transition:none}}