[css-inline-3] Improve illustrations for text edges

[fantasai]

Follow up from seek-oss/capsize#205 (comment) and #10703 (comment) -- the illustrations in the spec conflate the cap height with the ascent, and need to be redone.

[sciascia]

In addition to the comments above (and sorry if I'm misunderstanding something basic) but why is text-edge: leading; not actually leading?

If I'm understanding the illustration correctly, text-edge: leading; is actually line-height which splits the space evenly above and below the text, creating half leading which is the problem to begin with.

As a designer, I would expect text-edge: leading; to make the text behave like leading!

To properly reflect the spacing behaviour, shouldn't the properties be changed to the following...

1. text-edge: leading; becomes text-edge: line-height;
2. text-edge: text; becomes text-edge: leading?

#11364 #10703