overflow:hidden and border-radius not playing well with transit

[markhicken]

I have created a circle using border-radius and overflow:hidden. Inside that circle is a box. This box doesn't get clipped by the border-radius during animation. Before and after animation, the border-radius renders properly hiding the square edges.

See example here...
http://jsfiddle.net/P7Dkz/