Improve text overlay alignment for PageViewer selection accuracy

[hoyla]

This is an attempt to address the way text selection in the PageViewer is often misaligned vertically. A little robot tells me that the browser was adding default padding vertically, affecting selection. This removes that.

This doesn't fix the much more serious problem of text selection and highlighting being misaligned in terms of character counts down the page. But it does at least get the user onto the right line.

Add line-height: 1 and white-space: pre to .pfi-page__pdf-text to prevent browser defaults from distorting the invisible text overlay geometry.

• The default line-height (~1.2) added extra vertical space above/below each text div, causing the selectable area to be taller than the actual glyph.
• white-space: pre prevents the browser from collapsing whitespace or wrapping text, keeping positions aligned with where PDF.js placed them. Allegedly.

Before:

To select "workspaces section" the user actually has to drag the cursor across what appears to be the line below to get the selection right. The highlight itself is also too tall, although this actually helps since it overlaps the text, unlike the required cursor action.

After:

Cursor drag (and the highlight itself) aligns more accurately to the displayed text.

Testing:

• Looks good on local dev but..
• Probably needs some quite thorough testing with different documents on playground