Draft: Prevent Ferris from hiding code

[NeatNit]

Fixes #2893.

I am so very rusty with JavaScript and DOM manipulation. This was more painful to get done than I expected. But I think it was worth it.

The premise is simple: if Ferris is hiding some code, let the user scroll horizontally far enough until the code is no longer hidden. However, we don't want to create excessive scrolling unnecessarily.

THIS IS A DRAFT. To do:

• JavaScript: need code review. Some lines are obvious junk. I think the general code structure is sound, but I'm really not sure about style and linter errors. As I said, I'm rusty with JS, and not in the good meaning of "rusty"! Let me know what needs fixing.
• CSS: should probably use CSS variables to put the ferris width and margin size in one place. Also, I wasn't sure if I should use margin or padding. Any idea?
• Make the margin smaller for small Ferris.

Before: Note that the horizontal scroll bar is at its limit.

After:

Before:

After: The longer line below Ferris is not given a margin unnecessarily.

[NeatNit]

Just a note: setTimeout is needed because getBoundingClientRect would otherwise return unusable results.

I know there's a lot to clean up in the code, the reasons I didn't do that before submitting is I wanted to first get feedback on the result. The rendered result is pretty much complete.

I will add screenshots to the OP in a few minutes.