fix 前端优化

platform_web/components/MagicalParticleLayer.tsx

@@ -11,23 +11,53 @@ const particleSlots = [
   { x: "92%", y: "86%" }
 ];
 
+const orbitalConstructSlots = [
+  { x: "76%", y: "82%", size: "min(54vw, 680px)", drift: "-6deg" },
+  { x: "14%", y: "58%", size: "min(34vw, 420px)", drift: "18deg" },
+  { x: "94%", y: "22%", size: "min(24vw, 300px)", drift: "-26deg" }
+];
+
 type ParticleStyle = CSSProperties & {
   "--particle-index": string;
   "--particle-x": string;
   "--particle-y": string;
 };
 
+type OrbitalConstructStyle = CSSProperties & {
+  "--construct-index": string;
+  "--construct-x": string;
+  "--construct-y": string;
+  "--construct-size": string;
+  "--construct-drift": string;
+};
+
 export function MagicalParticleLayer() {
   return (
     <>
       <div className="workspace-background-layer" aria-hidden="true" />
       <div className="global-particle-layer" aria-hidden="true">
-        <span className="global-particle-orbit" />
-        <span className="global-particle-orbit global-particle-orbit-secondary" />
+        <span className="global-particle-lightfall global-particle-lightfall-a" />
+        <span className="global-particle-lightfall global-particle-lightfall-b" />
+        <span className="global-particle-lightfall global-particle-lightfall-c" />
+        <span className="global-particle-side-ray global-particle-side-ray-left" />
+        <span className="global-particle-side-ray global-particle-side-ray-right" />
+        {orbitalConstructSlots.map((construct, index) => (
+          <span
+            key={`${construct.x}-${construct.y}-${construct.size}`}
+            className="global-orbital-construct"
+            style={
+              {
+                "--construct-index": String(index),
+                "--construct-x": construct.x,
+                "--construct-y": construct.y,
+                "--construct-size": construct.size,
+                "--construct-drift": construct.drift
+              } as OrbitalConstructStyle
+            }
+          />
+        ))}
         <span className="global-particle-sweep" />
         <span className="global-particle-ribbon" />
-        <span className="global-particle-frame global-particle-frame-tl" />
-        <span className="global-particle-frame global-particle-frame-br" />
         {particleSlots.map((slot, index) => (
           <span
             key={`${slot.x}-${slot.y}`}