Ok, so. (This took a very long time of thinking.)
Knowing that:

• We cannot format the legend without some horrible hacking and/or a Chartjs update (by the way, @MusikAnimal : we're still on chartjs 2.7! it's on 4.4 right now. but I suppose the migration would be a pain...)
• The legend sometimes wraps, and so has not a fixed height.
• We can expect approximately from 1 to 30 rows, and from 1 to 30 namespaces.
• On mobile, it looks like minimum 3 namespaces per line is a safe bet (I got 4 from tests, taking a margin of error).

I think we should replace (in the subpage only) the current formula: 25 * rows + 30, by 25 * rows + 25*ceil(namespaces/3)).
I've done the tables. Here are the edge cases of row height, in pixels:

The old formula, with 1 row and 30 nses, makes it unreadable on both mobile and desktop.
The new formula also has special behaviour on this edge case, but:

• 200px is not that awkward for destop users. Especially as all of this concerns only the subpage.
• There'd only one row in this case
• 200px is visible, at least. and 25px on mobile is definitely better.

For this, we should also remove the fixed line thickness of 18px. For the ~=25px lines, it won't change much. For the edge case on wide screens, it'll make it seem less weird.

Here's what the 60px stuff looks like:

by the way, @MusikAnimal : we're still on chartjs 2.7! it's on 4.4 right now. but I suppose the migration would be a pain...)

Indeed, our JS/CSS stack needs a complete overhaul. I've just filed T392531: Overhaul frontend tech stack.

Thanks for putting so much time into this, @Alien333!

I'll queue this up for the next deployment. The situation over at T384711 needs to be resolved before the next deploy, so it might be a bit depending on how the new bot detection performs (currently I'm experimenting with uncommitted changes made directly on the prod server).

Ok! And thanks so much for all the hard work with the crazy bots, while I'm having fun with charts! :)