Most likely because your JS blocker also blocks custom fonts. It works fine without JS.

It does not: with JS blocked, the stylesheet for the webfont never gets injected. Even though it shouldn't need injecting in the first place.

I'm 100% sure it does. Check again.

Then you need to curl the URL, pipe it to an .html file, and then search the resulting file for "@font-face". The only place that has the @font-face rule for this fancy font is inside <template> syntax, meaning it will do nothing (template content is inert) until JS clones that template into the DOM as active content.

That's for the code-editor webcomponent, the rest of the site doesn't use JS.

Correct. The code editor that has the subscript: "The colors in the HTML snippet above comes from within the font itself, the code is plain text, and requires no JavaScript."

Which doesn't work without JS. So adding the @font-face to the page itself, so that things works even without JS, would be lovely.

I think you're seriously confused or purposefully trolling. That's not the web component I'm talking about, that's just plain html.