Overlay focus scroll contracts

Use this skill for overlays whose runtime behavior depends on focus, background interactivity, scroll state, dismissal, or nested stacks. The goal is not a generic accessibility audit; it is to make overlay lifecycle behavior explicit and regression-testable.

Boundary with sibling skills

• Use overlay-focus-scroll-contracts for modal/drawer/sheet/popover/menu runtime: focus trap, focus restore, background inertness, aria-hidden timing, scroll lock, ESC/backdrop, nested overlays, and animation/unmount cleanup.
• Use a11y-contract-testing for rendered role/name/state/focus tests once the expected overlay contract is known.
• Use semantic-markup-contracts to decide whether trigger/content should use native button, link, dialog, list, heading, or form structure.
• Use webview-bridge-pages when the overlay is inside a native WebView and safe-area, keyboard, host back button, or bridge lifecycle is part of the failure.
• Use frontend-security-baseline for clickjacking, opener, CSP, or XSS traps around overlay content.
• Use css-transition-animation-contracts when a trap or scroll lock stays stuck because cleanup is gated on a transitionend that never fires (cancelled or interrupted exit animation).

Review workflow