fix(core): replace most --affine with cssVar (#5728)

using a [babel plugin](https://gist.github.com/pengx17/49e24ae8a5a609bdaff122ee8c679d1c) to transform all var(--affine-xxx) to cssVar

Some issues:
- tried ast-grep but it seems to be not easy to add imports conditionally
- current work does not work well with ts with types because babel will strip them out

packages/frontend/component/src/ui/loading/styles.css.ts

@@ -1,11 +1,15 @@
 import { createVar, keyframes, style } from '@vanilla-extract/css';
-
 export const speedVar = createVar('speedVar');
-
 const rotate = keyframes({
-  '0%': { transform: 'rotate(0deg)' },
-  '50%': { transform: 'rotate(180deg)' },
-  '100%': { transform: 'rotate(360deg)' },
+  '0%': {
+    transform: 'rotate(0deg)',
+  },
+  '50%': {
+    transform: 'rotate(180deg)',
+  },
+  '100%': {
+    transform: 'rotate(360deg)',
+  },
 });
 export const loading = style({
   vars: {