/* Beta25: six circular orbs, one edamame-style capsule. */
#sidebar-controls{position:absolute;left:calc(var(--rail-x) + 8px);top:calc(var(--rail-y) + 8px);display:flex;flex-direction:column;gap:var(--orb-gap);visibility:hidden;opacity:0;pointer-events:none;transition:opacity .25s .25s}
.browsing #sidebar-controls{visibility:visible;opacity:1;pointer-events:auto}
.browsing #category-controls{display:none}
.browsing .hub,.browsing .dial>svg{display:none}
.sidebar-control{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;width:var(--orb-size);height:var(--orb-size);flex:0 0 var(--orb-size);border-radius:50%;border:1px solid #87907655;box-shadow:inset 0 1px 0 #ffffff70,0 1px 2px #28341a08;font:10px/1.12 Arial,Helvetica,sans-serif;letter-spacing:0;text-align:center;color:var(--ink)}
.sidebar-control svg{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:1.8;flex-shrink:0}
.sidebar-control span{max-width:100%;padding:0 3px}
.sidebar-control[aria-current]{border-color:#65794b99;box-shadow:inset 0 0 0 1px #65794b30}
.sidebar-control[aria-current] span{font-weight:700}
.sidebar-control:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.sidebar-control:hover svg{transform:translateY(-1px)}
.browsing .dial{border-radius:999px;border:1.4px solid #8e997e;background:transparent}
/* Match the homepage's fine marks within the capsule's existing eight-pixel rim. */
.dial>.sidebar-tick-ring{display:none;pointer-events:none}
body.browsing .dial>.sidebar-tick-ring{display:block;position:absolute;inset:0;width:100%;height:100%;overflow:hidden;pointer-events:none;stroke:var(--ink);stroke-width:.75;fill:none;opacity:.55;transform:none;transition:opacity .3s}
.browsing.rail-scrolls #navigator{position:absolute;bottom:auto;height:var(--rail-bottom)}
/* Keep the index reachable beside an open drawer, even on short screens. */
.drawer-open #navigator{z-index:9}
.drawer-open.rail-scrolls #navigator{position:fixed;top:var(--rail-y);bottom:12px;right:auto;width:calc(var(--rail-x) + var(--rail-width) + 8px);height:auto;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;pointer-events:auto}
.drawer-open.rail-scrolls .dial{transform:translate(var(--rail-x),0)}
.drawer-open.rail-scrolls #sidebar-controls{top:8px}
.browsing .section-heading h1{overflow-wrap:normal}
@media(max-width:800px){
 :root{--header-height:138px}
 .sidebar-control{font-size:7px;line-height:1.1;gap:4px}
 .sidebar-control svg{width:24px;height:24px}
 .browsing .section-heading h1{font-size:clamp(26px,7.5vw,32px);letter-spacing:-1.2px;line-height:1.04}
 body[data-category=transportation] .section-heading h1{font-size:clamp(23px,6.8vw,30px)}
 #project-drawer,.drawer-scrim{top:136px}
}
@media(prefers-reduced-motion:reduce){#sidebar-controls{transition:none}.sidebar-control:hover svg{transform:none}}

/* Owner's role hierarchy; the complete introduction remains centered on the dial. */
body:not(.browsing) .landing-copy .role{font-size:18px;line-height:1.35;margin:0 0 18px;color:var(--ink)}
@media(max-width:800px){body:not(.browsing) .landing-copy .role{font-size:15px;margin:0 0 12px}}
/* Five inward-facing names retain readable type on narrow phones. */
@media(max-width:800px){.category-arc text{font-size:16px;letter-spacing:0}}
/* During the spiral, only the moving disc takes pointer input. Transparent
   final-position anchor boxes must not cover another disc's live tap target. */
.intro-running:not(.browsing) .category-control{pointer-events:none}
.intro-running:not(.browsing) .category-control .category-visual{pointer-events:auto}