/* Clock Animation - State-Change Pattern */
/* Clock hand rotates smoothly using transitions for bidirectional animation */
/* Base state: Clock hand with smooth transition */
[data-name="ClockAnimate"] path[d="M12 6v6l4 2"] {
transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
transform-origin: 12px 12px; /* Rotate around clock center */
}
/* Hover state: Rotate the clock hand */
[data-name="ClockAnimate"]:hover path[d="M12 6v6l4 2"] {
transform: rotate(360deg);
}