Links in headings result in invalid HTML

[dijitali]

If you put a link within a heading, the resulting HTML works but is invalid because the anchor elements get nested.

For example, with the example-report.md from npx @observablehq/framework@latest create:

---
title: Example report
---

# A brief history of [space exploration](https://example.com/)

This report is a brief overview of the history and current state of rocket launches and space exploration.
...

Generates:

<main id="observablehq-main" class="observablehq">
      <h1 id="a-brief-history-of-space-exploration" tabindex="-1"><a class="observablehq-header-anchor"
          href="#a-brief-history-of-space-exploration">A brief history of <a href="https://example.com/" target="_blank"
            rel="noopener noreferrer">space exploration</a></a></h1>
      <p>This report is a brief overview of the history and current state of rocket launches and space exploration.</p>

Which browsers or the W3C validator will show as having structural errors:

Error: Start tag a seen but an element of the same type was already open.
From line 112, column 163; to line 112, column 235
istory of <a href="https://example.com/" target="_blank" rel="noopener noreferrer">space 

Error: Stray end tag a.
From line 112, column 257; to line 112, column 260
ration</a></a></h1>↩

[dijitali]

For comparison, GitHub renders this as below where a chain icon appears on hover for the fragment identifier link instead of the entire title text itself being the link:
https://gist.github.com/dijitali/7b50b5041df9b484fcd95c9724c0f433