User feedback: text on the left edge ('left' align) was getting
cut off because the text extended to negative X (off the left
edge of the canvas). Same problem on the right.
Fix: swap the textAlign so each side's text extends INTO the tile,
not OFF the edge:
- Left-side labels (S, N) now use textAlign 'right'. Anchor at
the left edge of the tile area; the text's right edge is at
the anchor and it extends rightward into the tile.
- Right-side labels (y, x) use textAlign 'left'. Anchor at the
right edge; the text's left edge is at the anchor and extends
leftward into the tile.
Mirror (scale -1, 1) is still applied so the text content is
flipped.