font choice and alignment

There's no concrete issue, this is rather to collect some research about how text is rendered in the puzzles.

the generated svg only appears to specify "sans-serif" for the font
on firefox / macos, the font ends up as "Hiragino Kaku Gothic", which turns out to be the default Japanese font, and this choice appears down to p.html staring with <html lang="ja"> (regardless of pzpr language setting)
it appears that text is aligned by the top, using a computed font height via candle.js; compare candle.metrics.js which appends an element to the document for font measurement, and candle.svg.js for user-agent specific tweaks
png export would typically not use the Japanese font, possibly explaining the difference in appearance, compare #134

The font alignment doesn't always seem to work well. On macos / firefox / retina, it looks great by default

while numbers appear too low with lang="en"

This does not seem to be consistent over devices.

Some things that might be worth considering:

go over the alignment computation to improve the poorly aligned cases
make font choice less arbitrary; it would be great if we always used the same font for PNG export as for in-browser display; this might tie in with #97; we could specify fonts more precisely than just serif/sans-serif, and perhaps even serve a specific font explicitly
SVG export should ideally specify font well enough so that the vertical alignment matches whichever font is used for rendering

robx / pzprjs