style(比赛): 有密码的比赛前面那个彩色盾牌锁换成和全站一样的细线灰锁，放到比赛名后面

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

apps/web/src/shared/components/ContestTitle.vue

@@ -1,18 +1,41 @@
 <script setup lang="ts">
 import { Icon } from "@iconify/vue"
+import { useThemeVars } from "naive-ui"
 import { ContestType } from "utils/constants"
 import type { AdminContest, Contest } from "utils/types"
 
 defineProps<{ contest: AdminContest | Contest }>()
+
+const theme = useThemeVars()
 </script>
 <template>
-  <n-flex>
+  <span class="contest-title">
+    <span class="text">{{ contest.title }}</span>
     <Icon
       v-if="contest.contestType === ContestType.private"
-      :height="24"
-      icon="streamline-ultimate-color:shield-lock"
-    ></Icon>
-    <span>{{ contest.title }}</span>
-  </n-flex>
+      icon="ph:lock-simple"
+      width="1em"
+      class="lock"
+      title="要输入密码才能进"
+    />
+  </span>
 </template>
-<style scoped></style>
+<style scoped>
+.contest-title {
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  min-width: 0;
+}
+
+.text {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.lock {
+  flex-shrink: 0;
+  color: v-bind("theme.textColor3");
+}
+</style>