/* Compact scroll-spy rail; it overlays content instead of shifting the page layout. */
.case-spy{position:fixed;top:50%;left:14px;transform:translateY(-50%);width:52px;z-index:80;box-sizing:border-box;
  opacity:0;pointer-events:none;transition:opacity .35s ease;
  background:rgba(250,249,245,.96);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  border:1px solid #e7e3da;border-radius:16px;padding:9px 7px;box-shadow:0 10px 30px -18px rgba(20,20,19,.38)}
.case-spy.show{opacity:1;pointer-events:auto}
.case-spy-list{position:relative;display:grid;justify-items:center;gap:4px}
.case-spy-line{position:absolute;left:50%;top:15px;bottom:15px;width:1px;background:#e2ddd3;transform:translateX(-50%)}
.case-spy-item{position:relative;display:grid;place-items:center;width:34px;height:34px;padding:0;background:none;border:0;cursor:pointer;opacity:.9;transition:opacity .2s ease,transform .2s ease}
.case-spy-item::after{content:attr(data-label);position:absolute;left:calc(100% + 10px);top:50%;z-index:3;transform:translate(-4px,-50%);padding:8px 11px;border:1px solid #e7e3da;border-radius:9px;background:#fff;color:#28251f;box-shadow:0 8px 24px -14px rgba(20,20,19,.45);font:600 .72rem/1.2 "Plus Jakarta Sans",sans-serif;white-space:nowrap;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .16s ease,transform .16s ease,visibility .16s}
.case-spy-item:hover::after,.case-spy-item:focus-visible::after{opacity:1;visibility:visible;transform:translate(0,-50%)}
.case-spy-dot{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#f0eee8;border:1px solid #e2ddd3;box-sizing:border-box;position:relative;z-index:1;font:600 .62rem/1 "IBM Plex Mono",monospace;color:#77746d;transition:background .2s ease,border-color .2s ease,color .2s ease,transform .2s ease}
.case-spy-item:hover{opacity:1;transform:scale(1.08)}
.case-spy-item:focus-visible{outline:2px solid #8b6cc0;outline-offset:1px;border-radius:50%}
.case-spy-item.on{opacity:1}
.case-spy-item.on .case-spy-dot{background:#7656aa;border-color:#7656aa;color:#fff;transform:scale(1.08)}

/* Too narrow (phone-width) for a floating panel to make sense — hide it there. */
@media(max-width:639px){.case-spy{display:none}}

@media(prefers-reduced-motion:reduce){.case-spy,.case-spy-item,.case-spy-item::after,.case-spy-dot{transition:none}}
