Two other techniques you could use for installing user styles:
layout.css.moz-document.content.enabled pref, add
the desired CSS to
{profile}/chrome/userContent.css, and restart the
browser.
A foolish optimisation in the user script: since
appendChild returns the appended child, you
don’t need to store it or look it up. Personally
I’d also use textContent instead
of innerHTML, though it doesn’t actually
matter:
document.head.appendChild(document.createElement('style')).textContent = 'a:visited {color: #518}'
So long as the page used color-scheme: dark or
similar appropriately (normally the case for dark pages, seldom
remembered for dark sections of light pages), there are two ways
to get a different visited link colour on dark backgrounds:
color: VisitedText;
color: light-dark(#518, #96b);
A related possibility: force link underlines. Some browsers provide a native way of forcing them (Firefox does), but I’ve become partial to a semitransparent-when-not-hovered style since about 2018. From my own user styles:
:any-link {
text-decoration: underline color-mix(in srgb, currentColor 30%, transparent) !important;
/* These are two extra properties not caught by the text-decoration shorthand, but relevant to reset. */
text-underline-offset: unset !important;
text-decoration-skip-ink: unset !important;
}
Correction to my last comment:
toolkit.legacyUserProfileCustomizations.stylesheets is
the Firefox pref to enable userContent.css.
(layout.css.moz-document.content.enabled
makes @-moz-document work—quite useful in
userContent.css, but distinct.)