Yeah I agree. I probably would have used a non-modal dialog here. You can actually absolutely position (or, rather sticky positioned) the body of the <details>

Yeah I agree. I probably would have used a non-modal dialog here. You can actually absolutely position (or, rather sticky positioned) the body of the <details> to the top. But I think the dismiss button, inside the dialog warrants it being a <dialog>. Dialogs usually open with a <button> (so that answers that question), and you would open this by calling dialog.show()—as opposed to the usual dialog.showModal()—since you don’t want to capture the focus. The Benefit of using the <dialog> element is that you can put it anywhere you want inside your DOM structure and allow it to interact with the page however you want to.