style(about): 优化兴趣项样式并修复语言切换逻辑

- 调整兴趣项背景色、内边距和圆角，增强视觉效果
- 增加悬停状态下的阴影和边框变化动画
- 修改字体权重以提升文字可读性
- 修复中英文切换按钮标签显示错误的问题
- 根据当前语言和主题动态设置主题切换按钮提示文本

css/about.css

@@ -2209,23 +2209,26 @@ body {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 15px;
-    /*height: 100%; */
     margin-top: 1rem;
     align-content: center;
 }
 
 .interest-item {
-    background: rgba(128, 128, 128, 0.05);
-    padding: 5px;
-    border-radius: 2px;
+    background: rgba(255, 255, 255, 0.65);
+    padding: 12px;
+    border-radius: 12px;
     display: flex;
     align-items: center;
-    gap: 2px;
-    transition: background 0.3s;
+    gap: 10px;
+    transition: background 0.25s, box-shadow 0.25s, border-color 0.25s;
+    border: 1px solid rgba(128, 128, 128, 0.12);
+    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.06);
 }
 
 .interest-item:hover {
-    background: rgba(128, 128, 128, 0.1);
+    background: rgba(255, 255, 255, 0.9);
+    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.10);
+    border-color: rgba(108, 92, 231, 0.25);
 }
 
 .i-emoji {
@@ -2250,6 +2253,7 @@ body {
     background-clip: text;
     color: transparent;
     -webkit-text-fill-color: transparent;
+    font-weight: 600;
 }
 
 .i-text span:not(.i-emoji) {

js/about.js

@@ -153,7 +153,7 @@ class I18nManager {
             this.lang = this.lang === 'zh' ? 'en' : 'zh';
             setStoredLanguage(this.lang);
             this.apply();
-            const label = this.lang === 'zh' ? 'CN' : 'EN';
+            const label = this.lang === 'zh' ? 'EN' : 'CN';
             $('#lang-btn .btn-text').text(label);
             $('#lang-btn').attr('title', label);
         });
@@ -165,7 +165,7 @@ class I18nManager {
             const k = $(this).data('i18n');
             if (t[k]) $(this).text(t[k]);
         });
-        const label = this.lang === 'zh' ? 'CN' : 'EN';
+        const label = this.lang === 'zh' ? 'EN' : 'CN';
         $('#lang-btn .btn-text').text(label);
         $('#lang-btn').attr('title', label);
     }
@@ -184,6 +184,9 @@ class ThemeManager {
         let theme = getStoredTheme();
         if (theme === 'night') this.root.setAttribute('data-theme', 'night');
         $('#theme-btn').toggleClass('is-active', theme === 'night');
+        const langForTitle = getStoredLanguage();
+        const titleText = theme === 'night' ? (langForTitle === 'zh' ? '白天模式' : 'Day') : (langForTitle === 'zh' ? '黑夜模式' : 'Night');
+        $('#theme-btn').attr('title', titleText);
 
         $('#theme-btn').on('click', () => {
             const curr = this.root.getAttribute('data-theme');
@@ -192,6 +195,9 @@ class ThemeManager {
             else this.root.removeAttribute('data-theme');
             setStoredTheme(next)
             $('#theme-btn').toggleClass('is-active', next === 'night');
+            const lang = getStoredLanguage();
+            const t = next === 'night' ? (lang === 'zh' ? '白天模式' : 'Day') : (lang === 'zh' ? '黑夜模式' : 'Night');
+            $('#theme-btn').attr('title', t);
 
             // 更新Artalk主题
             if (typeof Artalk !== 'undefined') {