It's great, but I wish I didn't have to do this in CSS. When you look at the source code, it doesn't look like styling at all, it looks like programming. As soon as your start calling bezier functions in a static styling language, you know something's not right. This type of coding would be much easier to do in JavaScript.
"This type of coding would be much easier to do in JavaScript."
You could do this in JavaScript by manipulating the DOM directly - that's what libraries such as jQuery offer, but having easing functions for transitions belongs as part of the styling[1], unless you're saying that CSS should only be for static layouts?
True, but I like being able to do this declaratively. You don't incrementally change it with code, you define a mathematical function against time for the transformation.
Half of the CSS code is used for the demo interaction (time changing, showing the helper elements and for debugging [grouping all animated elements to change the transition-duration all at one]).
