diff --git a/recharge/index.html b/recharge/index.html
index fcab918..5b7e315 100644
--- a/recharge/index.html
+++ b/recharge/index.html
@@ -262,6 +262,13 @@
                 flex: 1;
             }
 
+            .account-name-row {
+                display: flex;
+                min-width: 0;
+                align-items: center;
+                gap: 6px;
+            }
+
             .account-name,
             .account-meta {
                 overflow: hidden;
@@ -270,6 +277,7 @@
             }
 
             .account-name {
+                min-width: 0;
                 font-size: 15px;
                 font-weight: 850;
             }
@@ -281,14 +289,25 @@
             }
 
             .role-pill {
-                min-width: 76px;
-                padding: 7px 9px;
+                flex: 0 0 auto;
+                max-width: 112px;
+                padding: 4px 8px;
                 border-radius: 999px;
-                background: var(--hy-theme-surface);
+                border: 1px solid rgba(255, 255, 255, 0.62);
+                background: rgba(255, 255, 255, 0.48);
+                box-shadow:
+                    inset 0 1px 0 rgba(255, 255, 255, 0.58),
+                    0 6px 16px rgba(91, 62, 142, 0.08);
                 color: var(--hy-theme-primary-deep);
-                font-size: 12px;
+                font-size: 11px;
                 font-weight: 850;
+                line-height: 1.15;
+                overflow: hidden;
                 text-align: center;
+                text-overflow: ellipsis;
+                white-space: nowrap;
+                backdrop-filter: blur(12px);
+                -webkit-backdrop-filter: blur(12px);
             }
 
             .change-account {
@@ -845,10 +864,16 @@
                     <div id="account-card" class="account-card">
                         <div class="avatar" id="account-avatar"></div>
                         <div class="account-main">
-                            <div class="account-name" id="account-name">-</div>
+                            <div class="account-name-row">
+                                <div class="account-name" id="account-name">
+                                    -
+                                </div>
+                                <div class="role-pill" id="account-role">
+                                    -
+                                </div>
+                            </div>
                             <div class="account-meta" id="account-meta">-</div>
                         </div>
-                        <div class="role-pill" id="account-role">-</div>
                         <button
                             id="change-account"
                             class="secondary-button change-account"
@@ -1264,13 +1289,7 @@
                         account.username ||
                         account.display_user_id ||
                         t('recharge.accountConfirmed', 'Confirmed account');
-                    nodes.accountMeta.textContent = [
-                        account.display_user_id,
-                        account.country_name || account.country_code,
-                        account.region_name || account.region_code,
-                    ]
-                        .filter(Boolean)
-                        .join(' · ');
+                    nodes.accountMeta.textContent = accountMetaText(account);
                     nodes.accountRole.textContent =
                         account.audience_type === 'coin_seller'
                             ? t('recharge.coinSeller', 'Coin seller')
@@ -2202,6 +2221,98 @@
                     );
                 }
 
+                function accountMetaText(account) {
+                    return [
+                        account && account.display_user_id,
+                        accountCountryText(account),
+                    ]
+                        .filter(Boolean)
+                        .join(' · ');
+                }
+
+                // 后端账号字段可能返回中文展示名；非中文页面优先按 code/英文字段展示，避免 EN 页面混入中文地区。
+                function accountCountryText(account) {
+                    var code = firstValue(account, [
+                        'country_code',
+                        'countryCode',
+                    ]);
+                    var localized = countryNameFromCode(code);
+                    if (localized) return localized;
+                    return displayTextOrCode(
+                        firstValue(account, [
+                            'country_name_en',
+                            'countryNameEn',
+                            'country_english_name',
+                            'countryEnglishName',
+                            'country_display_name_en',
+                            'countryDisplayNameEn',
+                            'country_name',
+                            'countryName',
+                            'country_display_name',
+                            'countryDisplayName',
+                            'country',
+                        ]),
+                        code
+                    );
+                }
+
+                function countryNameFromCode(code) {
+                    code = String(code || '')
+                        .trim()
+                        .toUpperCase();
+                    if (!/^[A-Z]{2}$/.test(code)) return '';
+                    try {
+                        var displayNames = new Intl.DisplayNames(
+                            [currentDisplayLang()],
+                            { type: 'region' }
+                        );
+                        return displayNames.of(code) || code;
+                    } catch (error) {
+                        return code;
+                    }
+                }
+
+                function displayTextOrCode(value, code) {
+                    value = String(value || '').trim();
+                    if (!value) return '';
+                    if (currentDisplayLang() === 'zh') return value;
+                    var mapped = chineseLocationNameMap()[value];
+                    if (mapped) return mapped;
+                    if (containsChinese(value)) return String(code || '');
+                    return value;
+                }
+
+                function containsChinese(value) {
+                    return /[\u3400-\u9fff]/.test(String(value || ''));
+                }
+
+                function currentDisplayLang() {
+                    return window.HyAppI18n && window.HyAppI18n.lang
+                        ? window.HyAppI18n.lang()
+                        : 'en';
+                }
+
+                function firstValue(source, keys) {
+                    source = source || {};
+                    for (var i = 0; i < keys.length; i += 1) {
+                        var value = source[keys[i]];
+                        if (
+                            value !== undefined &&
+                            value !== null &&
+                            value !== ''
+                        ) {
+                            return value;
+                        }
+                    }
+                    return '';
+                }
+
+                function chineseLocationNameMap() {
+                    return {
+                        新加坡: 'Singapore',
+                    };
+                }
+
                 function toast(message) {
                     if (window.HyAppToast) window.HyAppToast.show(message);
                 }