Previously the text layer in VitalSource PDFs consisted of a set of
absolutely positioned elements, one per word. When the user was making a
text selection and the cursor was between words, the browser could not
determine an appropriate caret position in the text. As a result text
selection was tricky.

Improve this by re-implementing ImageTextLayer to produce a more
structured DOM tree. Group the characters into words, lines and columns.
Words are laid out using inline layout into `<hypothesis-text-line>`
elements, which are then arranged using block layouts into
`<hypothesis-text-column>` elements. Columns are absolutely positioned.
Within lines and columns the gaps between words and lines are fine-tuned
using margins. This use of inline and block layouts allows the browser
to set the selection correctly when the cursor is between words or
lines. The visual gap between selected words has also been eliminated by
adding inter-word spaces to the previous word.

 - Separate page layout analysis from DOM construction. This makes these
   elements easier to understand and improve.

 - Change DOM structure generated by `ImageTextLayer` to a hierarchical
   structure of words, lines and columns.

 - Change ImageTextLayer to use DOMRect and DOMPoint as the types for
   rect and point structs. This allows sharing of geometry utilities
   with other code.

 - Simplify rescaling of text layer when image size changes by
   expressing all margins, sizes and scales in the text layer in terms
   of CSS variables (`--x-scale` and `--y-scale`) defined on the root
   `<hypothesis-text-layer>` element. When the image is resized, these
   variables are simply updated to reflect the new image size.