refactor(about): 重构技术标签云实现以提升性能和视觉效果

- 减少标签云容器内边距和间距以优化布局
- 移除基于CSS动画的多行滚动实现
- 引入绝对定位和JavaScript驱动的单行滚动逻辑
- 实现带偏移量的双轨道无缝循环滚动效果
- 动态计算并设置每行高度以防止布局错位
- 优化标签去重逻辑以避免重复显示相同标签
- 调整滚动速度参数以改善用户体验

css/about.css

@@ -1165,8 +1165,8 @@ a:not(.nav-logo):not(.nav-links a):not(.social-link):not(.btn):not(.footer-info
         overflow: hidden;
         justify-content: center;
         align-items: center;
-        padding: 20px 0;
-        gap: 15px;
+        padding: 8px 0;
+        gap: 6px;
         min-height: 150px;
     }
 
@@ -1178,41 +1178,21 @@ a:not(.nav-logo):not(.nav-links a):not(.social-link):not(.btn):not(.footer-info
 
     /* 三行滚动容器 */
     .tech-row {
-        display: flex;
+        position: relative;
+        display: block;
         width: 100%;
-        animation: scroll linear infinite;
-        animation-play-state: paused;
-        gap: 15px;
-        padding: 10px 0;
+        overflow: hidden;
+        padding: 1px 0;
+        height: auto;
     }
 
-    .tech-row.scrolling {
-        animation-play-state: running;
-    }
-
-    /* 第一行滚动速度 - 增快10倍 */
-    .tech-row:nth-child(1) {
-        animation-duration: 3s;
-    }
-
-    /* 第二行滚动速度 - 增快10倍 */
-    .tech-row:nth-child(2) {
-        animation-duration: 3.5s;
-    }
-
-    /* 第三行滚动速度 - 增快10倍 */
-    .tech-row:nth-child(3) {
-        animation-duration: 4s;
-    }
-
-    /* 滚动动画 */
-    @keyframes scroll {
-        0% {
-            transform: translateX(0);
-        }
-        100% {
-            transform: translateX(-50%);
-        }
+    .tech-track {
+        position: absolute;
+        left: 0;
+        top: 0;
+        display: inline-flex;
+        gap: 2px;
+        will-change: transform;
     }
 
     .cloud-tag {