feat: 更新依赖项和配置，添加新通知类型

- 在 package.json 中添加了 @types/md5 和 @vueuse/integrations 依赖。
- 更新了 tsconfig.json 中的模块解析方式为 bundler。
- 在组件声明中移除了不再使用的 Naive UI 组件。
- 在弹幕窗口和设置中添加了启用动画的选项，并更新了相关样式。
- 实现了私信发送失败的通知功能，增强了用户体验。

src/views/ManageLayout.vue

@@ -50,6 +50,7 @@ import {
   NText,
   NTooltip,
   useMessage,
+  NCard,
 } from 'naive-ui'
 import { computed, h, onMounted, ref, watch } from 'vue'
 import { RouterLink, useRoute } from 'vue-router'
@@ -644,37 +645,125 @@ onMounted(() => {
         display: flex;
         justify-content: center;
         align-items: center;
-        flex-direction: column;
-        padding: 50px;
         height: 100vh;
+        width: 100vw;
+        background: linear-gradient(135deg, rgba(250,250,250,0.8) 0%, rgba(240,240,245,0.9) 100%);
+        padding: 0;
+        margin: 0;
         box-sizing: border-box;
+        position: fixed;
+        top: 0;
+        left: 0;
       "
+      :class="isDarkMode ? 'login-dark-bg' : ''"
     >
       <template v-if="!isLoadingAccount">
-        <NSpace
-          vertical
-          justify="center"
-          align="center"
+        <NCard
+          style="max-width: 520px; width: 100%; min-width: 350px; border-radius: 12px; box-shadow: 0 8px 24px rgba(0,0,0,0.08); margin: 16px;"
+          :bordered="false"
         >
-          <NText> 请登录或注册后使用 </NText>
-          <NButton
-            tag="a"
-            href="/"
+          <template #header>
+            <NFlex
+              justify="center"
+              align="center"
+              style="padding: 12px 0;"
+            >
+              <NText
+                strong
+                style="font-size: 1.8rem; text-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); background-image: linear-gradient(to right, #36d1dc, #5b86e5); -webkit-background-clip: text; -webkit-text-fill-color: transparent;"
+              >
+                VTSURU CENTER
+              </NText>
+            </NFlex>
+          </template>
+
+          <NSpace
+            vertical
+            size="large"
+            style="padding: 8px 0;"
           >
-            回到主页
-          </NButton>
-        </NSpace>
-        <NDivider />
-        <RegisterAndLogin style="max-width: 500px; min-width: 350px" />
+            <NFlex
+              justify="center"
+              align="center"
+            >
+              <NText style="font-size: 16px; text-align: center;">
+                请登录或注册后使用
+              </NText>
+            </NFlex>
+
+            <NAlert
+              type="info"
+              style="border-radius: 8px;"
+            >
+              <NFlex
+                vertical
+                align="center"
+                size="small"
+              >
+                <div style="text-align: center;">
+                  如果你不是主播且不发送棉花糖(提问)的话则不需要注册登录
+                </div>
+                <NFlex
+                  justify="center"
+                  style="width: 100%; margin-top: 8px;"
+                >
+                  <NButton
+                    type="primary"
+                    size="small"
+                    @click="$router.push({ name: 'bili-user'})"
+                  >
+                    <template #icon>
+                      <NIcon :component="BrowsersOutline" />
+                    </template>
+                    前往 Bilibili 认证用户主页
+                  </NButton>
+                </NFlex>
+              </NFlex>
+            </NAlert>
+
+            <NDivider style="margin: 8px 0;" />
+
+            <RegisterAndLogin />
+
+            <NFlex justify="center">
+              <NButton
+                secondary
+                tag="a"
+                href="/"
+                style="min-width: 100px;"
+              >
+                回到主页
+              </NButton>
+            </NFlex>
+          </NSpace>
+        </NCard>
       </template>
       <template v-else>
-        <NSpin
-          :loading="isLoadingAccount"
-          style="overflow: hidden"
+        <NCard
+          :bordered="false"
+          style="min-width: 300px; width: 100%; max-width: 400px; border-radius: 12px; box-shadow: 0 8px 24px rgba(0,0,0,0.08); margin: 16px;"
         >
-          正在请求账户数据...
-        </NSpin>
+          <NFlex
+            vertical
+            justify="center"
+            align="center"
+            style="padding: 20px 10px;"
+          >
+            <NSpin
+              :loading="isLoadingAccount"
+              size="large"
+            >
+              <NText>正在请求账户数据...</NText>
+            </NSpin>
+          </NFlex>
+        </NCard>
       </template>
     </NLayoutContent>
   </template>
 </template>
+
+<style scoped>
+.login-dark-bg {
+  background: linear-gradient(135deg, rgba(30,30,35,0.9) 0%, rgba(20,20,25,0.95) 100%) !important;
+}
+</style>