/* The source prototypes have a long sticky contents rail. Keep every focus ring
   reachable in a short desktop viewport without changing the mobile visibility. */
@media(min-width:1181px){
  .toc{max-height:calc(100dvh - var(--topbar-h) - 52px);overflow-y:auto;overscroll-behavior:contain;padding:4px 6px 6px 4px;scroll-padding-block:6px}
  .toc a{scroll-margin-block:6px}
  .toc a:focus-visible{outline-offset:-2px}
}

/* Native Tab scrolling must leave room for the complete outer focus outline,
   including links close to the viewport bottom and the fixed top bar. */
html{scroll-padding-block:calc(var(--topbar-h,72px) + 8px) 8px}
main :is(a,button,input,summary,select,textarea){scroll-margin-block:8px}

/* The only secondary entry is Account; guests must not see its empty heading. */
[data-auth="out"] .mn-head:has(+ .mn-more > .mn-acct:only-child),
[data-auth="out"] .mn-more:has(> .mn-acct:only-child){display:none}

/* Later chrome layout rules must not reveal signed-out actions after login. */
[data-auth="in"] .topbar .auth-out{display:none}
[data-auth="out"] .topbar .auth-in{display:none}
.topbar .icon-btn{min-width:44px;min-height:44px;justify-content:center;flex-shrink:0}
.topbar .icon-btn svg{flex:none}
.topbar .avatar{width:44px;height:44px}
@media(max-width:520px){.topbar{gap:6px}.topbar .top-actions{gap:8px}}

/* Switch the menu surface with its text: transitioning only the background
   briefly renders the expanded white label on the collapsed white surface. */
.menu-btn{transition:border-color .25s}

/* Search API descriptions can be much longer than prototype context labels.
   On narrow panels, give the result title a complete row before its context. */
@media(max-width:560px){
  .srch-hit{grid-template-columns:minmax(0,1fr);gap:5px;min-height:44px}
  .srch-hit .sh-n:empty{display:none}
  .srch-hit .sh-t{grid-column:1;white-space:normal;overflow-wrap:anywhere}
  .srch-hit .sh-c{grid-column:1;white-space:normal;overflow-wrap:anywhere}
}

.srch-empty{overflow-wrap:anywhere;font-size:14.5px;line-height:1.5;color:var(--ink-soft)}
.srch-hit:focus-visible{outline-offset:-3px}
.srch-body > .srch-esc{display:flex;align-items:center;justify-content:center;margin:0 auto 20px;min-height:44px;min-width:44px;padding:8px 16px;border-radius:99px;background:var(--ink);color:var(--card)}
@media(max-width:560px){.srch{padding:0}}
@media(pointer:coarse){.srch-esc{min-height:44px;min-width:44px}}

/* Native keyboard scrolling may align the final Account chip with the drawer
   edge in a short viewport. Keep its complete focus ring inside the chip. */
.mobnav .mn-more a:focus-visible{outline-offset:-2px}

/* Inline footer text can reach the viewport edge before its outer focus ring.
   Give native keyboard scrolling a box and room for the complete outline. */
.foot-cols a{display:inline-flex;align-items:center;vertical-align:top;scroll-margin-block:8px 12px}

/* A duration change does not cancel an already-running CSS transition.
   Removing the transition settles the hovered footer link immediately. */
@media(prefers-reduced-motion:reduce){
  .foot-cols a,.foot-cols a::after{transition:none!important}
}

/* Cancel in-flight legal-link transitions when the motion preference changes. */
@media(prefers-reduced-motion:reduce){
  .prose a,.toc a,.toc a::before{transition:none!important}
}

/* Root scroll-padding already reserves the fixed header for anchor jumps. */
.prose h2[id]{scroll-margin-top:24px}
/* Runtime preference changes also suppress the prototype's JS-driven cursor. */
@media(prefers-reduced-motion:reduce){
  .cursor,.cursor-ring{display:none!important}
  body.cursor-on{cursor:auto!important}
  body.cursor-on a,body.cursor-on button{cursor:pointer!important}
}

/* Legal navigation must settle when reduction is enabled during a transition. */
@media(prefers-reduced-motion:reduce){.sibnav a{transition:none!important}}