What does font-size really correspond to?
Your understanding of the W3C references is correct, but your understanding of the red box is not. The red box does not depict the em-square. Its height is the sum of the ascent and descent from the metrics.