Mostly fix monochrome svg rendering color and styling

[Kuuuube]

Once again not a 100% perfect fix but I'm not sure it's even possible to get this any better using canvases and the resvg library.

The way monochrome images and svgs work in Yomitan is they take on whatever the text color is. Normally this will just be white or black but the user can also set custom css to do whatever color they want.

This causes a very big issue when dealing solely with canvases. The previous way Yomitan handled this was by creating a mask over a background that would load the image or svg as the mask. This is horrible for performance. It is possible to apply a mask to a canvas in nearly the exact same way it was done previously, but this would be reverting some of the performance gains from using canvases to begin with.

Canvases cannot be used as masks unless they are first saved to a blob and then have a uri created for them to point to the generated image. This is not only horrible for performance but also goes very much against the way that canvases were implemented into Yomitan. Due to the use of workers, the amount of insanity required to get this working is just not worth it.

The resvg library does not support changing the fill of an svg. This would be a somewhat sketchy solution anyways since the --text-color variable would have to be checked for every svg that would be rendered, it wouldn't work for images, and it would require a page refresh to update to any changes (dark/light mode, user editing custom css).

The solution here gets about 95% of the way back to how it was before with some top tier css witchcraft.

The key is this css:

filter: grayscale(1) opacity(0.5) drop-shadow(0 0 0.01px var(--text-color)) saturate(1000%) brightness(1000%);

It can color anything to an almost exact absolute color. But it can never be 100% perfect due to relying on opacity. At opacity 0, the element wont show. At opacity 1, the colored drop shadow won't show and the element cannot be colored. It cannot handle colors that are not max brightness or max saturation.

Comparisons using an entry from 三省堂国語辞典　第八版 on dark and light mode:

	Light	Dark
Before Break
Before this PR
After this PR

[github-actions]

Playwright test results

 1 failed
 4 passed

Details

 5 tests across 4 suites
 5 minutes, 16 seconds
 58ecbeb

Failed tests

chromium › visual.spec.js › visual