diff --git a/src-tauri/src/usage.rs b/src-tauri/src/usage.rs
index b99e902..e93a7f3 100644
--- a/src-tauri/src/usage.rs
+++ b/src-tauri/src/usage.rs
@@ -1067,17 +1067,7 @@ fn load_api_key_categories(
             let key = row.get::<_, String>(0)?;
             let remark = row.get::<_, String>(1)?;
             let display = row.get::<_, String>(2)?;
-            let label = if !remark.is_empty() {
-                if display.is_empty() {
-                    remark
-                } else {
-                    format!("{remark} · {display}")
-                }
-            } else if !display.is_empty() {
-                display
-            } else {
-                "未记录密钥".to_string()
-            };
+            let label = api_key_category_label(remark, display);
             Ok(UsageCategory {
                 key,
                 label,
@@ -1325,6 +1315,16 @@ fn mask_api_key(value: &str) -> String {
     format!("{start}••••{end}")
 }
 
+fn api_key_category_label(remark: String, display: String) -> String {
+    if !remark.is_empty() {
+        remark
+    } else if !display.is_empty() {
+        mask_api_key(&display)
+    } else {
+        "未记录密钥".to_string()
+    }
+}
+
 fn usage_source_display(config: &GuiConfigFile, provider: &str, source: &str) -> String {
     let source = source.trim();
     if source.is_empty() {
@@ -1415,6 +1415,18 @@ mod tests {
         assert_eq!(mask_api_key("sk-1234567890"), "sk-1••••7890");
     }
 
+    #[test]
+    fn api_key_category_uses_either_remark_or_masked_key() {
+        assert_eq!(
+            api_key_category_label("生产环境".to_string(), "12••••".to_string()),
+            "生产环境"
+        );
+        assert_eq!(
+            api_key_category_label(String::new(), "123456".to_string()),
+            "12••••"
+        );
+    }
+
     #[test]
     fn usage_source_prefers_api_access_remark_and_masks_secret_fallbacks() {
         let key = "sk-1234567890abcdefghijklmnopqrstuvwxyz";
diff --git a/src/pages/ApiAccessPage.tsx b/src/pages/ApiAccessPage.tsx
index d09c9d9..f0b532c 100644
--- a/src/pages/ApiAccessPage.tsx
+++ b/src/pages/ApiAccessPage.tsx
@@ -969,14 +969,13 @@ export function ApiAccessPage() {
                 <article className="real-provider-row" key={`${row.section}-${row.index}-${row.authIndex}`}>
                   <div className="provider-row-main">
                     <div className="provider-row-title">
-                      <strong title={row.name}>{row.name}</strong>
+                      <strong title={row.remark || row.name}>{row.remark || row.name}</strong>
                     </div>
                     <code title={definitionFor(row.section).openAi ? t('apiAccess.keys.count', { count: row.apiKeys.length }) : undefined}>
                       {definitionFor(row.section).openAi && row.apiKeys.length > 1
                         ? t('apiAccess.keys.summary', { key: maskSecret(row.apiKey), count: row.apiKeys.length })
                         : maskSecret(row.apiKey)}
                     </code>
-                    {row.remark ? <span className="provider-row-remark" title={row.remark}>{t('apiAccess.remarkValue', { remark: row.remark })}</span> : null}
                     <span className="provider-row-url" title={row.baseUrl || undefined}>{row.baseUrl || t('apiAccess.defaultUrl')}</span>
                     {row.models.length > 0 ? <span className="provider-row-models" title={row.models.map((model) => model.name).join(', ')}>{t('apiAccess.models.summary', { count: row.models.length, models: row.models.slice(0, 3).map((model) => model.name).join(', ') })}</span> : null}
                   </div>