/* A quiet margin annotation: counterclockwise lettering beside a hairline. */
#hell-descent{position:fixed;left:12px;top:50%;transform:translateY(-50%);height:min(calc(100svh - 150px),calc(clamp(190px,38vh,340px) + 152px));width:24px;z-index:45;pointer-events:none;--descent:0;color:var(--orange);opacity:.65;transition:opacity .5s ease}
.descent-track{position:absolute;inset:0 auto 0 0;width:1px;background:#ff4b0a2b}
.descent-fill{position:absolute;inset:0;width:1px;background:#ff4b0a9c;transform-origin:top;transform:scaleY(var(--descent))}
.descent-tick{position:absolute;left:-1px;top:var(--tick);width:3px;height:1px;transform:translateY(-50%);background:#ff4b0a60}
.descent-marker{position:absolute;left:-1px;top:calc(var(--descent)*100%);width:3px;height:3px;background:var(--orange);transform:translateY(-50%)}
.descent-name{position:absolute;left:13px;top:50%;transform:translate(-50%,-50%) rotate(-90deg);font:8.8px/1 'Courier New',monospace;letter-spacing:.19em;text-transform:uppercase;white-space:nowrap}
body.intro-open #hell-descent,body:has(#lightbox[open]) #hell-descent{visibility:hidden;opacity:0}
@media(max-width:700px){#hell-descent{left:6px;width:18px;height:min(calc(100svh - 140px),calc(clamp(150px,30vh,240px) + 152px));opacity:.55}.descent-name{left:10px;font-size:7.7px;letter-spacing:.13em}}
@media(prefers-reduced-motion:reduce){#hell-descent{transition:none}}

.circle-name{color:var(--orange);font-weight:400}
figcaption .circle-name:last-child{font-size:inherit;line-height:normal}
.hero-circle-mobile{display:none}
.red-circle{position:absolute;top:35px;right:5vw}
@media(max-width:700px){.hero-circle-mobile{display:inline;margin-left:10px}.red-circle{font-size:8px}.section-bar .circle-heading{white-space:nowrap;margin-left:12px}}
