Native First
This page shows a tasteful native path: <details> for disclosures and lightweight menus, <dialog> for modal surfaces, and only a minimal showModal() hook where the browser element still needs an opener.
Use native controls when the interaction is simple, local to the page, and maps well to browser semantics. That usually gives you better baseline accessibility and less JS to maintain.
<details> for section stacks, inspector trays, and lightweight menus<dialog> for modal review, confirmation, and quick-create flowsThe disclosure and menu examples below are fully native. The dialog itself is native too, but opening it still typically wants one small showModal() call unless you rely on newer command attributes or a framework.
This page intentionally does not load the helper script. The menu is <details> and the dialog opener is a few lines of vanilla JS only for the modal launch.
This is the cleanest replacement for a lightweight accordion when you do not need coordinated multi-panel state or more custom animation logic.