Fixes #2194

The math for the `top-[calc(25%-2px)]` classes were incorrect. The
percentage should correspond to:

```
Where
  u is a spacing unit, `0.25em`
  L is the "mask-add/subtract/…" text's `line-height` = 0.75rem * ( 1 / 0.75 ) = 1rem = 4u
  M is the "mask-add/subtract/…" text's `mb-3` = 3u
  H is the masked images' height, `h-24` = 24u

Then
  Total height, T = L + M + H
                  = 4u + 3u + 24u
                  = 31u

  Masked image top offset, Q = L + M
                             = 4u + 3u
                             = 7u

  As a percentage = Q ÷ T
                  = 7u ÷ 31u × 100%
                  ≈ 22.6%
```

Thus to line everything up, the top should be `top-[calc(700%/31-2px)]`.

However, since the bottom of each grid element is aligned to the bottom
of the images, I'd thought it'd be simpler to offset the guide elements'
Y position based of the bottom. Thus, we'd only need to offset their
border width `2px`, with `-bottom-[2px]`.

| Before | After |
| --- | --- |
|
![Before](https://github.com/user-attachments/assets/027007ea-b247-4b75-9b13-41929a0b374a)
|
![After](https://github.com/user-attachments/assets/6e1f08b9-e4f3-4cb8-8bac-59b8ca610e64)
|

Perhaps ideally we'd use a CSS variable to DRY all the `2px` border
width offsets but that seemed out of scope of this PR.