/* Stable end slots reserve room while the same anchors float at the layout edges. */
html body#top.case-side-nav-ready #content .case-navigation{position:relative}
.case-nav-placeholder{height:56px;min-width:0;width:var(--case-nav-expanded-width,240px);pointer-events:none;visibility:hidden;grid-row:1}
.case-nav-placeholder.is-previous{grid-column:1;justify-self:start}
.case-nav-placeholder.is-next{grid-column:3;justify-self:end}
html body#top.case-side-nav-ready #content .case-navigation>.case-navigation-button{
 position:fixed;top:calc(50vh - 28px);z-index:43;
 width:56px;max-width:none!important;min-width:56px;height:56px!important;
 margin:0!important;padding:0!important;overflow:hidden;
 opacity:0;visibility:hidden;pointer-events:none;filter:none!important;
 transition:width 440ms cubic-bezier(.22,1,.36,1),padding 440ms cubic-bezier(.22,1,.36,1),transform 440ms cubic-bezier(.22,1,.36,1),opacity 220ms,visibility 0s 440ms;
}
html body#top.case-side-nav-ready #content .case-navigation>.case-navigation-button.is-previous{left:0;right:auto;transform:translateX(calc(-100% - var(--gutter) - 16px))!important}
html body#top.case-side-nav-ready #content .case-navigation>.case-navigation-button.is-next{right:0;left:auto;transform:translateX(calc(100% + var(--gutter) + 16px))!important}
html body#top.case-side-nav-ready #content .case-navigation.case-side-nav-visible>.case-navigation-button{
 opacity:1;visibility:visible;pointer-events:auto;transform:translateX(0)!important;transition-delay:0s;
}
html body#top.case-side-nav-ready #content .case-navigation-button .control-label{display:flex;align-items:center;justify-content:center;gap:0!important;min-width:0;overflow:hidden}
html body#top.case-side-nav-ready #content .case-navigation-button .case-nav-arrow{display:block;flex:0 0 16px;width:16px;text-align:center}
html body#top.case-side-nav-ready #content .case-navigation-button .case-nav-text{
 display:block;max-width:0;opacity:0;overflow:hidden;white-space:nowrap;
 transition:max-width 440ms cubic-bezier(.22,1,.36,1),opacity 200ms;
}
/* At the center-line crossing, the controls become part of the document again. */
html body#top.case-side-nav-ready #content .case-navigation.case-side-nav-parked>.case-navigation-button{
 position:absolute;grid-column:auto!important;grid-row:auto!important;align-self:start!important;justify-self:auto!important;bottom:auto;top:var(--case-nav-slot-top);width:var(--case-nav-expanded-width);padding-inline:var(--case-nav-padding,28px)!important;
}
html body#top.case-side-nav-ready #content .case-navigation.case-side-nav-parked>.case-navigation-button.is-previous{left:0}
html body#top.case-side-nav-ready #content .case-navigation.case-side-nav-parked>.case-navigation-button.is-next{right:0}
html body#top.case-side-nav-ready #content .case-side-nav-parked .case-navigation-button .control-label{gap:8px!important}
html body#top.case-side-nav-ready #content .case-side-nav-parked .case-navigation-button .case-nav-text{max-width:var(--case-nav-expanded-width);opacity:1;text-overflow:clip;transition-delay:0s,100ms}
html body#top.case-side-nav-ready:has(dialog[open]) #content .case-navigation>.case-navigation-button{visibility:hidden!important;pointer-events:none}
@media(max-width:767px){
 .case-nav-placeholder{grid-row:2}
 .case-nav-placeholder.is-previous{grid-column:1}
 .case-nav-placeholder.is-next{grid-column:2}
}
@media(prefers-reduced-motion:reduce){
 html body#top.case-side-nav-ready #content .case-navigation>.case-navigation-button,
 html body#top.case-side-nav-ready #content .case-navigation-button .case-nav-text{transition:none}
}

/* Floating square controls open away from their screen edge on hover/focus. */
html body#top.case-side-nav-ready #content .case-navigation:not(.case-side-nav-parked)>.case-navigation-button:is(:hover,:focus-visible){
 width:var(--case-nav-expanded-width);padding-inline:var(--case-nav-padding,28px)!important;
}
html body#top.case-side-nav-ready #content .case-navigation:not(.case-side-nav-parked)>.case-navigation-button:is(:hover,:focus-visible) .control-label{gap:8px!important}
html body#top.case-side-nav-ready #content .case-navigation:not(.case-side-nav-parked)>.case-navigation-button:is(:hover,:focus-visible) .case-nav-text{max-width:var(--case-nav-expanded-width);opacity:1;transition-delay:0s,100ms}

/* Compact side controls share the bottom switcher's translucent theme surfaces. */
html body#top.case-side-nav-ready.case-page #content .case-navigation:not(.case-side-nav-parked)>.case-navigation-button:not(:hover):not(:focus-visible){
 backdrop-filter:blur(18px) saturate(120%);-webkit-backdrop-filter:blur(18px) saturate(120%);
 background:rgba(255,255,255,.72)!important;color:#1a1a1a!important;
}
html body#top.case-side-nav-ready.case-page[data-case-theme="dark"] #content .case-navigation:not(.case-side-nav-parked)>.case-navigation-button:not(:hover):not(:focus-visible){
 background:rgba(36,36,36,.72)!important;color:#fff!important;
}

/* Floating controls hover by expanding only; keep their glass surface and ink. */
html body#top.case-side-nav-ready.case-page #content .case-navigation:not(.case-side-nav-parked)>.case-navigation-button{
 backdrop-filter:blur(18px) saturate(120%);-webkit-backdrop-filter:blur(18px) saturate(120%);
 background:rgba(255,255,255,.72)!important;color:#1a1a1a!important;
 --hover-base:rgba(255,255,255,.72);--hover-ink:#1a1a1a;
}
html body#top.case-side-nav-ready.case-page[data-case-theme="dark"] #content .case-navigation:not(.case-side-nav-parked)>.case-navigation-button{
 background:rgba(36,36,36,.72)!important;color:#fff!important;
 --hover-base:rgba(36,36,36,.72);--hover-ink:#fff;
}
html body#top.case-side-nav-ready.case-page #content .case-navigation:not(.case-side-nav-parked)>.case-navigation-button.fill-control::before{display:none!important}
html body#top.case-side-nav-ready.case-page #content .case-navigation:not(.case-side-nav-parked)>.case-navigation-button:is(:hover,:focus-visible) *{color:inherit!important}
html body#top.case-side-nav-ready.case-page[data-case-theme="dark"] #content .case-navigation:not(.case-side-nav-parked)>.case-navigation-button:is(:hover,:focus-visible) *{color:inherit!important}

/* Arrow glyphs sit one size above their 16px labels in every control state. */
html body#top.case-side-nav-ready.case-page #content .case-navigation>.case-navigation-button .case-nav-arrow{
 font-size:16px!important;line-height:22px!important;flex-basis:18px;width:18px;
}

/* Expanded controls size to their entire single-line copy, never to a grid slot. */
html body#top.case-side-nav-ready #content .case-navigation>.case-navigation-button{white-space:nowrap!important;flex-shrink:0}
html body#top.case-side-nav-ready #content .case-navigation .case-nav-text{white-space:nowrap!important;overflow-wrap:normal!important;word-break:normal!important;flex-shrink:0}
html body#top.case-side-nav-ready #content .case-navigation.case-side-nav-parked>.case-navigation-button{height:56px!important;min-height:56px;padding-block:0!important;max-width:none!important}
html body#top.case-side-nav-ready #content .case-navigation.case-nav-stacked{grid-template-columns:minmax(0,1fr);row-gap:24px}
html body#top.case-side-nav-ready #content .case-navigation.case-nav-stacked>.case-navigation-title{grid-column:1;grid-row:1}
html body#top.case-side-nav-ready #content .case-navigation.case-nav-stacked>.case-nav-placeholder.is-previous{grid-column:1;grid-row:2;justify-self:start}
html body#top.case-side-nav-ready #content .case-navigation.case-nav-stacked>.case-nav-placeholder.is-next{grid-column:1;grid-row:3;justify-self:end}