fix(成就): 圆环百分比在移动端撑出 + 卡片边框加粗

- 圆环改用默认插槽渲染百分比，字号跟断点走（naive 自带指示器字号固定，76px 圆环放不下）
- 卡片边框 1px → 2px
- 置灰从整张卡挪到内容上，未获得的卡片不再把稀有度边框一起洗成灰

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

src/oj/achievement/components/AchievementCard.vue

@@ -55,10 +55,15 @@ const unlockDate = computed(() => {
 <template>
   <n-card
     size="small"
-    :class="{ locked: !achievement.unlocked, rare: isRare }"
-    :style="{ borderColor: RARITY_COLOR[achievement.rarity] }"
+    :class="{ rare: isRare }"
+    :style="{
+      borderColor: RARITY_COLOR[achievement.rarity],
+      // 1px 的描边在卡片背景上几乎看不出稀有度，加粗一档
+      borderWidth: '2px',
+    }"
   >
-    <n-thing>
+    <!-- 置灰只作用在内容上：套在整张卡上会把稀有度边框也一并洗成灰色 -->
+    <n-thing :class="{ locked: !achievement.unlocked }">
       <template #avatar>
         <AchievementIcon :icon="achievement.icon" :size="32" />
       </template>

src/oj/achievement/index.vue

@@ -88,7 +88,12 @@ watch(name, load)
             :percentage="summary.percent"
             :stroke-width="8"
             :style="{ width: isDesktop ? '110px' : '76px' }"
-          />
+          >
+            <!-- 自带指示器字号是固定的，76px 的圆环里会撑出来 -->
+            <n-text strong :style="{ fontSize: isDesktop ? '22px' : '15px' }">
+              {{ summary.percent }}%
+            </n-text>
+          </n-progress>
           <n-text depth="3" class="nowrap">
             已获得 {{ summary.unlocked }} / {{ summary.total }}
           </n-text>