style(about): 调整移动端悬浮按钮定位及交互布局

- 修改 `.mobile-fab` 定位方式，将 `bottom` 值从固定像素改为视口高度百分比
- 更新兴趣项容器 `.interest-item` 的弹性布局方向为纵向排列
- 调整 `.i-text` 内部元素间距和对齐方式以优化文本显示效果
- 修正头像区域的内边距和间隙设置以提升视觉一致性
- 更改 JavaScript 中获取悬浮按钮的选择器以提高兼容性

css/about.css

@@ -2429,8 +2429,9 @@ body {
       padding: 15px;
       border-radius: 12px;
       display: flex;
-      align-items: center;
+      align-items: flex-start;
-      gap: 15px;
+      flex-direction: column;
+      gap: 10px;
       transition: background 0.3s;
   }
 
@@ -2442,13 +2443,14 @@ body {
       font-size: 2rem;
       color: var(--text-primary);
       -webkit-text-fill-color: initial;
+      margin-bottom: 6px;
   }
 
   .i-text {
       display: flex;
       flex-direction: column;
       min-width: 0;
-      gap: 5px;
+      gap: 6px;
   }
 
   /* 添加 min-width: 0 防止溢出 */
@@ -2732,11 +2734,19 @@ body {
         max-height: 150px; /* 限制高度 */
         overflow: hidden;
     }
+    .interest-item {
+        display: flex;
+        flex-direction: column;
+        align-items: flex-start;
+        gap: 10px;
+    }
+    .i-emoji { margin-bottom: 6px; }
 
     .i-text {
-        flex-direction: row;
+        display: flex;
-        align-items: center;
+        flex-direction: column;
-        gap: 8px;
+        align-items: flex-start;
+        gap: 6px;
     }
 
     .i-text strong, .i-text span {
@@ -3203,7 +3213,7 @@ body {
 }
 .social-dock .s-icon { color: var(--text-primary); }
 .social-dock .s-icon i { background: none !important; -webkit-background-clip: initial !important; background-clip: initial !important; -webkit-text-fill-color: initial !important; color: currentColor !important; text-shadow: none !important; }
-.mobile-fab { position: fixed; right: 16px; bottom: 88px; z-index: 1100; cursor: move; user-select: none; display: block !important; }
+.mobile-fab { position: fixed; right: 16px; bottom: 33vh; z-index: 1100; cursor: move; user-select: none; display: block !important; }
 .fab-main { display: flex; align-items: center; gap: 6px; background: var(--accent); color: #fff; border: none; border-radius: 22px; padding: 10px 14px; box-shadow: 0 8px 18px rgba(0,0,0,0.25); opacity: 0.9; transition: all 0.3s ease; }
 .fab-main:hover { opacity: 1; transform: scale(1.05); }
 .fab-main:active { transform: scale(0.95); }

js/about.js

@@ -663,7 +663,7 @@ class UIManager {
 
     // 初始化拖拽功能
     initDraggableFab() {
-        const fab = document.getElementById('fab-main');
+        const fab = document.querySelector('.mobile-fab');
         if (!fab) return;
 
         let isDragging = false;