Update logo and enhance layout responsiveness; add stroke animation for frequency chart paths

client/src/pages/EQPage.tsx

@@ -109,6 +109,8 @@ function FreqChart({
   const svgRef = useRef<SVGSVGElement | null>(null);
   const draggingBandRef = useRef<number | null>(null);
   const curvePathRef = useRef<SVGPathElement | null>(null);
+  const rawPathRef = useRef<SVGPathElement | null>(null);
+  const equalizedPathRef = useRef<SVGPathElement | null>(null);
   const [chartWidth, setChartWidth] = useState(340);
   const W = chartWidth;
   const [isBandDragging, setIsBandDragging] = useState(false);
@@ -221,6 +223,14 @@ function FreqChart({
     enabled: !isBandDragging,
     durationMs: 1350,
   });
+  useStrokeDrawAnimation(rawPathRef, rawPathD, {
+    enabled: !isBandDragging && !!rawPathD,
+    durationMs: 1350,
+  });
+  useStrokeDrawAnimation(equalizedPathRef, equalizedPathD, {
+    enabled: !isBandDragging && !!equalizedPathD,
+    durationMs: 1350,
+  });
 
   const freqLabels = [20, 50, 100, 200, 500, 1000, 2000, 5000, 10000, 20000];
   const gainLabels = [20, 15, 10, 5, 0, -5, -10, -15, -20];
@@ -337,6 +347,7 @@ function FreqChart({
           {/* Raw */}
           {rawPathD && showRaw && (
             <path
+              ref={rawPathRef}
               d={rawPathD}
               fill="none"
               stroke="#ffffff"
@@ -349,6 +360,7 @@ function FreqChart({
           {/* Equalized = EQ + Raw */}
           {equalizedPathD && showEqualized && (
             <path
+              ref={equalizedPathRef}
               d={equalizedPathD}
               fill="none"
               stroke="#23d2fe"