/* Section wayfinding sits above the story without changing its scroll timing. */
.scroll-progress{display:block;position:fixed;right:max(20px,env(safe-area-inset-right));top:50%;transform:translateY(-50%);z-index:80;width:40px;isolation:isolate;opacity:.6}
.scroll-progress[hidden]{display:none}
.scroll-progress::before,.scroll-progress::after{content:"";position:absolute;top:20px;bottom:20px;left:19px;width:2px;border-radius:2px;background:#dedede80;box-shadow:0 0 0 1px #ffffff80;pointer-events:none;z-index:0}
.scroll-progress::after{background:#aaa;box-shadow:none;transform:scaleY(var(--scroll-completion,0));transform-origin:top;will-change:transform}
.scroll-progress-completion{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.scroll-progress a{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;width:40px;height:40px;color:#222;text-decoration:none;-webkit-tap-highlight-color:transparent}
.scroll-progress-dot{width:7px;height:7px;border-radius:50%;background:#b5b5b5;box-shadow:0 0 0 3px #ffffffc9;transition:transform .24s ease,background .24s ease,box-shadow .24s ease}
.scroll-progress a[data-passed] .scroll-progress-dot{background:#777}
.scroll-progress a[aria-current] .scroll-progress-dot{background:#222;transform:scale(1.35);box-shadow:0 0 0 3px #fff,0 0 0 6px #33333318}
.scroll-progress-label{position:absolute;right:38px;white-space:nowrap;padding:7px 12px;border:1px solid #ffffffb3;border-radius:999px;background:#ffffffd9;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 2px 14px #00000007;font-size:12px;font-weight:500;line-height:1.2;opacity:0;transform:translateX(5px);pointer-events:none;transition:opacity .22s ease,transform .22s ease}
.scroll-progress a[aria-current] .scroll-progress-label,.scroll-progress a:hover .scroll-progress-label,.scroll-progress a:focus-visible .scroll-progress-label{opacity:1;transform:none}
.scroll-progress:has(a:hover) a[aria-current]:not(:hover) .scroll-progress-label,.scroll-progress:has(a:focus-visible) a[aria-current]:not(:focus-visible) .scroll-progress-label{opacity:0}
.scroll-progress a:focus-visible{outline:2px solid #222;outline-offset:-3px;border-radius:50%}
@media(max-width:700px){.scroll-progress{right:max(1px,env(safe-area-inset-right));width:28px}.scroll-progress a{width:28px;height:30px}.scroll-progress::before,.scroll-progress::after{left:13px;top:15px;bottom:15px}.scroll-progress-dot{width:5px;height:5px}.scroll-progress-label{display:none}}
@media(prefers-reduced-motion:reduce){.scroll-progress-dot,.scroll-progress-label{transition:none}}
@media(forced-colors:active){.scroll-progress::before{background:GrayText}.scroll-progress::after{background:CanvasText}.scroll-progress-dot{background:GrayText}.scroll-progress a[aria-current] .scroll-progress-dot{background:CanvasText;outline:2px solid CanvasText;outline-offset:3px}.scroll-progress-label{background:Canvas;color:CanvasText;border-color:CanvasText}}