Fix: Support css variables in translation calculations

[loganwishartcraig]

Summary

We use css variable references in our custom tailwind theme instead of standard hardcoded values. Currently, this results in mangled values when using this library:

.data-\[side\=bottom\]\:slide-in-from-top-2[data-side="bottom"] {
    --tw-enter-translate-y: -var(--spacing-2);
}

This PR addresses the issue my moving to calc(...) where relevant to allow usage of css variables. Given there are no recommendations from tailwind I'm aware of warning users not to use css tokens for spacing theme values, I've just adjusted tailwindcss-animate slightly to resolve.

Happy to discuss questions/concerns or close if this feels too niche a usecse.

[loganwishartcraig]

If backwards compatibility is a concern for whatever reason, we may also consider only wrapping in calc if the value looks like a css variable reference (e.g. matches a RegExp).