fix: Web Client — вернул оригинальную красивую анимацию canvas

Изменения:
- 42 столбика как в оригинале
- Синусоидальная анимация
- Градиент cyan → blue
- Сглаживание RMS (0.7 old + 0.3 new)
- Случайные колебания для живости

Теперь красиво как было, но с данными satellite RMS!

web-client/client.html

@@ -583,8 +583,9 @@
     }
   }
 
-  // Визуализация на canvas — рисуем RMS от satellite
+  // Визуализация на canvas — рисуем RMS от satellite с красивой анимацией
-  let satelliteRmsHistory = new Array(64).fill(0);  // История RMS значений
+  let satelliteRmsHistory = new Array(42).fill(0);  // История RMS значений
+  let rmsSmoothed = 0;  // Сглаженное значение
   
   function drawSatelliteVisualization() {
     if(!ctx) return;
@@ -600,26 +601,35 @@
       return;
     }
     
-    // Добавляем текущее RMS в историю
+    // Добавляем текущее RMS в историю (сглаживание)
+    rmsSmoothed = rmsSmoothed * 0.7 + currentRms * 0.3;
     satelliteRmsHistory.shift();
-    satelliteRmsHistory.push(currentRms);
+    satelliteRmsHistory.push(rmsSmoothed);
     
     // Рисуем
     ctx.clearRect(0,0,canvas.width, canvas.height);
     ctx.fillStyle = '#03151f';
     ctx.fillRect(0,0,canvas.width, canvas.height);
     
-    const barWidth = (canvas.width / satelliteRmsHistory.length);
+    const barWidth = (canvas.width / 42);
     
-    for(let i=0; i<satelliteRmsHistory.length; i++) {
+    for(let i=0; i<42; i++) {
       const rms = satelliteRmsHistory[i];
-      const barHeight = Math.min(rms * canvas.height * 1.5, canvas.height - 5);
+      // Красивая анимация с синусом как в оригинале
-      const x = i * barWidth;
+      let barHeight = (rms * canvas.height * 1.5 * (Math.sin(i * 0.5) + 1)/2 + 5) * (0.5 + (Math.random()*0.3));
       
-      // Градиент от зелёного к красному
+      // Увеличиваем высоту если громко
-      const hue = 120 - (rms * 120);  // 120 = зелёный, 0 = красный
+      if(rms > 0.3) barHeight = rms * canvas.height * 1.8 * (Math.sin(i*0.3)+1.2);
-      ctx.fillStyle = `hsl(${hue}, 100%, 50%)`;
+      
-      ctx.fillRect(x, canvas.height - barHeight, barWidth - 1, barHeight);
+      barHeight = Math.min(barHeight, canvas.height-10);
+      const x = i * (barWidth+2);
+      
+      // Градиент как в оригинале
+      const grad = ctx.createLinearGradient(x, canvas.height-barHeight, x, canvas.height);
+      grad.addColorStop(0, '#0ff');
+      grad.addColorStop(1, '#3f87ff');
+      ctx.fillStyle = grad;
+      ctx.fillRect(x, canvas.height-barHeight, barWidth, barHeight);
     }
   }