refactor(cooldown): 使用 CSS 背景动画替代多个 Snowflake 组件

优化冷却状态雪花效果的渲染性能

Author: Win11

web/src/index.css

@@ -432,6 +432,11 @@ body {
   100% { background-position: 1rem 1rem; }
 }
 
+@keyframes snowing {
+  0% { background-position: 0 0; }
+  100% { background-position: 50px 100px; }
+}
+
 .animate-streaming-badge {
   animation: pulseSoft 1.5s ease-in-out infinite;
   display: inline-block;
@@ -461,6 +466,16 @@ body {
   animation: marquee 1s linear infinite;
 }
 
+.animate-snowing {
+  background-image:
+    radial-gradient(6px 6px at 20% 30%, rgba(34, 211, 238, 0.4) 50%, transparent 50%),
+    radial-gradient(8px 8px at 40% 70%, rgba(34, 211, 238, 0.3) 50%, transparent 50%),
+    radial-gradient(5px 5px at 60% 40%, rgba(34, 211, 238, 0.4) 50%, transparent 50%),
+    radial-gradient(7px 7px at 80% 80%, rgba(34, 211, 238, 0.3) 50%, transparent 50%);
+  background-size: 100px 100px;
+  animation: snowing 5s linear infinite;
+}
+
 /* Marquee effect for table rows - direct background animation */
 .animate-marquee-row {
   background-color: rgba(0, 120, 212, 0.08);

web/src/pages/client-routes/components/provider-row.tsx

@@ -256,21 +256,8 @@ export function ProviderRowContent({
         <>
           <div className="absolute inset-0 bg-gradient-to-br from-cyan-500/5 via-transparent to-blue-600/5 pointer-events-none animate-pulse" />
           <div className="absolute inset-x-0 top-0 h-[1px] bg-gradient-to-r from-transparent via-cyan-400/20 to-transparent" />
-          {/* 雪花动画 */}
-          <div className="absolute inset-0 overflow-hidden pointer-events-none">
-            {[...Array(6)].map((_, i) => (
-              <Snowflake
-                key={i}
-                size={12}
-                className="absolute -top-4 text-cyan-500/20 animate-snowfall"
-                style={{
-                  left: `${Math.random() * 100}%`,
-                  animationDelay: `${Math.random() * 5}s`,
-                  animationDuration: `${5 + Math.random() * 5}s`,
-                }}
-              />
-            ))}
-          </div>
+          {/* 雪花动画 (CSS Background) */}
+          <div className="absolute inset-0 animate-snowing pointer-events-none opacity-60" />
         </>
       )}