Add raven animation feature with SVG assets and Three.js integration

- Introduced a new SVG asset for the raven silhouette.
- Updated CSS to position and style the raven animation layer.
- Implemented `RavenBurstCanvas` and `RavenFlock` components for rendering animated ravens using Three.js.
- Enhanced `GateTransitProvider` to manage raven animation state and integrate with existing transition logic.
- Added `ravenFx` type and default values for controlling raven animation properties.
- Adjusted transform origins and z-index for improved visual alignment during transitions.

public/raven-silhouette.svg

@@ -0,0 +1,20 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="256" height="160" viewBox="0 0 256 160">
+  <g fill="#0a0b08">
+    <!-- body -->
+    <ellipse cx="128" cy="88" rx="28" ry="16" />
+    <!-- neck + head -->
+    <path d="M100 82c-10-4-22-4-32 2-3 2-7 1-8-2 6-10 20-16 34-14 6 1 10 6 11 12 0 2-2 3-5 2z" />
+    <ellipse cx="78" cy="78" rx="14" ry="10" transform="rotate(-18 78 78)" />
+    <!-- beak -->
+    <path d="M64 76l-18 2 18 5z" />
+    <!-- left wing -->
+    <path d="M120 80c-28-22-62-36-96-34-6 0-8-6-3-9 38-16 78-8 108 14 8 6 10 16 4 22-4 3-9 4-13 7z" />
+    <!-- right wing -->
+    <path d="M136 78c26-24 60-40 96-42 6 0 9 6 4 9-34 18-66 34-90 52-6 4-14 2-16-4-2-6 2-12 6-15z" />
+    <!-- tail -->
+    <path d="M148 92c16 8 28 24 30 40 0 4-5 5-7 2-8-14-18-26-32-34-3-2-2-7 2-8 2 0 5 0 7 0z" />
+    <!-- legs tucked -->
+    <path d="M122 100c2 10 1 18-2 24-1 2-4 1-4-1 2-8 2-15 0-22 0-2 3-3 6-1z" />
+  </g>
+  <circle cx="72" cy="74" r="2.6" fill="#c8d97d" />
+</svg>