design(onboarding): add premium springy card animations, breathing focus inputs, and volumetric radial glow

vibn-frontend/_onboarding/onboarding-fork.tsx

@@ -112,24 +112,7 @@ export function ForkScreen({ name, value, onChange, onClose, onNext }) {
                   onChange(f.id);
                   onNext();
                 }}
-                style={{
-                  display: "flex",
-                  alignItems: "center",
-                  gap: 14,
-                  padding: "14px 16px",
-                  borderRadius: 12,
-                  border: `1px solid ${active ? "var(--accent)" : "var(--hairline)"}`,
-                  background: active
-                    ? "oklch(0.20 0.04 35 / 0.4)"
-                    : "oklch(0.18 0.009 60 / 0.6)",
-                  boxShadow: active
-                    ? "0 0 0 3px oklch(0.74 0.175 35 / 0.1)"
-                    : "none",
-                  textAlign: "left",
-                  color: "var(--fg)",
-                  transition: "border-color .15s, background .15s",
-                  cursor: "pointer",
-                }}
+                className={active ? "fork-card active" : "fork-card"}
               >
                 <span
                   style={{

vibn-frontend/_onboarding/page.tsx

@@ -543,19 +543,7 @@ function DoorCard({
     <button
       type="button"
       onClick={onClick}
-      style={{
-        display: "flex",
-        alignItems: "center",
-        gap: 14,
-        padding: "16px 18px",
-        borderRadius: 12,
-        textAlign: "left",
-        cursor: "pointer",
-        color: "var(--fg)",
-        border: `1px solid ${emphasized ? "var(--accent)" : "var(--hairline)"}`,
-        background: emphasized ? "var(--accent-soft)" : "var(--bg-1)",
-        transition: "border-color .15s, background .15s, transform .1s",
-      }}
+      className={emphasized ? "door-card active" : "door-card"}
     >
       <span
         style={{