<head> tags cannot contain most visible HTML elements, such as <div> or <p>. In the case of transparency, this can be detrimental to storytelling and design, with no easy way to interweave narrative, metadata, and functionality.
This is where <template> tags come in handy. They can go in <head> and <body>. They can contain tags that aren't normally valid in <head>. They will not render by default, but with some JavaScript, we can clone their content back into themselves, making it visible. Hacky but effective.
A Note on Accessibility
This page, with its approach to code transparency, is not designed with accessibility in mind. It is, in fact, terrible for accessibility. The excessive use of pseudo-elements and visual noise can make it difficult for screen readers and other assistive technologies to interpret the content correctly. I apologise to anyone trying to use it with such tools.