diff --git a/docs/theme.md b/docs/theme.md
index 294ed5d92..0eb785deb 100644
--- a/docs/theme.md
+++ b/docs/theme.md
@@ -418,6 +418,7 @@ utility / arbitrary variant；Vue Transition、跨浏览器 Range、动态富文
 - 表格斑马纹使用 `table-row-stripe-bg`；选中行悬停使用 `table-row-selected-hover-bg`，不被普通 Hover 覆盖
 - 结构化浮层头部使用 `popover-header-bg`，明暗模式分别检查它与表格背景的区分
 - Card 和选项默认不增加装饰性边框；键盘焦点必须保留可见反馈
+- 帮助与说明图标常态、Hover 和 Active 均保持透明背景，按钮使用 `variant="link"`，保留键盘焦点反馈；已有说明浮层时不重复显示原生 `title` 提示
 - 阴影保持中性，`shadowStrength` 只调节层级强弱，不给阴影染品牌色
 
 ## 扩展指南
diff --git a/frontend/src/components/schema-form/index.vue b/frontend/src/components/schema-form/index.vue
index 299ee7cb0..dc3785d20 100644
--- a/frontend/src/components/schema-form/index.vue
+++ b/frontend/src/components/schema-form/index.vue
@@ -146,7 +146,7 @@ defineExpose({ focusField })
         <template v-if="field.description" #label-extra>
           <ZPopover trigger="hover-click" placement="top-start">
             <template #reference>
-              <ZIconButton :aria-label="t('common.form.fieldHelp', { label: field.label })" class="size-3.5!" :title="undefined">
+              <ZIconButton variant="link" :aria-label="t('common.form.fieldHelp', { label: field.label })" class="size-3.5!" :title="undefined">
                 <Info class="size-3.5" />
               </ZIconButton>
             </template>
diff --git a/frontend/src/components/usage/UsageDetailPopover.vue b/frontend/src/components/usage/UsageDetailPopover.vue
index e0f51c90f..ffd10753b 100644
--- a/frontend/src/components/usage/UsageDetailPopover.vue
+++ b/frontend/src/components/usage/UsageDetailPopover.vue
@@ -19,10 +19,10 @@ defineProps<{
     <template #reference>
       <button
         type="button"
-        class="inline-flex size-4 items-center justify-center rounded-full outline-none focus-visible:ring-2 focus-visible:ring-cp-control-outline"
+        class="inline-flex size-4 items-center justify-center rounded-full bg-transparent outline-none focus-visible:ring-2 focus-visible:ring-cp-control-outline"
         :class="tone === 'warning'
-          ? 'bg-cp-warning-container text-cp-warning-on-container hover:bg-cp-warning-container-hover'
-          : 'bg-cp-primary-container text-cp-primary-on-container hover:bg-cp-primary-container-hover'"
+          ? 'text-cp-warning-text'
+          : 'text-cp-primary-text'"
         :aria-label="triggerLabel"
       >
         <Info class="size-3" />
diff --git a/frontend/src/i18n/locales/en/accounts.json b/frontend/src/i18n/locales/en/accounts.json
index 4b82334a2..8625b35ec 100644
--- a/frontend/src/i18n/locales/en/accounts.json
+++ b/frontend/src/i18n/locales/en/accounts.json
@@ -118,7 +118,6 @@
       "noModelsAvailable": "No models available for testing"
     },
     "credentials": {
-      "wsFirst": "WS first",
       "accountName": "Account name",
       "enterUpstreamName": "Enter the upstream name",
       "baseUrlHelp": "Enter the API base URL, endpoint paths are appended automatically",
@@ -126,7 +125,7 @@
       "apiKeyPlaceholder": "Leave blank to keep the current key",
       "enterUpstreamKey": "Enter the upstream key",
       "transportLabel": "Transport",
-      "webSocketHelp": "WS first requires upstream support for Responses WebSocket",
+      "webSocketHelp": "WS requires upstream support for Responses WebSocket",
       "nameRequired": "Enter an account name",
       "validation": {
         "urlLength": "Upstream API URL must not exceed 2,048 characters",
@@ -163,7 +162,6 @@
     "editor": {
       "title": "Edit account",
       "transportLabel": "Upstream transport",
-      "upstreamConnection": "Upstream connection",
       "loadError": "Could not load upstream settings",
       "notesHelp": "Up to 500 characters, leave blank to clear notes",
       "oauthUnavailable": "This account has no OAuth upstream settings",
diff --git a/frontend/src/i18n/locales/zh-Hans/accounts.json b/frontend/src/i18n/locales/zh-Hans/accounts.json
index 3da83675e..4f8592aa8 100644
--- a/frontend/src/i18n/locales/zh-Hans/accounts.json
+++ b/frontend/src/i18n/locales/zh-Hans/accounts.json
@@ -118,7 +118,6 @@
       "noModelsAvailable": "没有可测试模型"
     },
     "credentials": {
-      "wsFirst": "WS 优先",
       "accountName": "账号名称",
       "enterUpstreamName": "输入上游名称",
       "baseUrlHelp": "填写 API 前缀，接口路径会自动追加",
@@ -126,7 +125,7 @@
       "apiKeyPlaceholder": "留空保留当前密钥",
       "enterUpstreamKey": "输入上游密钥",
       "transportLabel": "传输方式",
-      "webSocketHelp": "WS 优先需要上游支持 Responses WebSocket",
+      "webSocketHelp": "WS 需要上游支持 Responses WebSocket",
       "nameRequired": "请输入账号名称",
       "validation": {
         "urlLength": "上游 API 地址不能超过 2048 个字符",
@@ -163,7 +162,6 @@
     "editor": {
       "title": "编辑账号",
       "transportLabel": "上游传输方式",
-      "upstreamConnection": "上游连接",
       "loadError": "上游设置读取失败",
       "notesHelp": "最多 500 字，留空可清除备注",
       "oauthUnavailable": "该账号没有 OAuth 上游设置",
diff --git a/frontend/src/i18n/locales/zh-Hant/accounts.json b/frontend/src/i18n/locales/zh-Hant/accounts.json
index eeff48d6f..0651b3568 100644
--- a/frontend/src/i18n/locales/zh-Hant/accounts.json
+++ b/frontend/src/i18n/locales/zh-Hant/accounts.json
@@ -118,7 +118,6 @@
       "noModelsAvailable": "沒有可測試模型"
     },
     "credentials": {
-      "wsFirst": "WS 優先",
       "accountName": "賬號名稱",
       "enterUpstreamName": "輸入上游名稱",
       "baseUrlHelp": "填寫 API 前綴，接口路徑會自動追加",
@@ -126,7 +125,7 @@
       "apiKeyPlaceholder": "留空保留當前密鑰",
       "enterUpstreamKey": "輸入上游密鑰",
       "transportLabel": "傳輸方式",
-      "webSocketHelp": "WS 優先需要上游支持 Responses WebSocket",
+      "webSocketHelp": "WS 需要上游支持 Responses WebSocket",
       "nameRequired": "請輸入賬號名稱",
       "validation": {
         "urlLength": "上游 API 地址不能超過 2048 個字符",
@@ -163,7 +162,6 @@
     "editor": {
       "title": "編輯賬號",
       "transportLabel": "上游傳輸方式",
-      "upstreamConnection": "上游連接",
       "loadError": "上游設置讀取失敗",
       "notesHelp": "最多 500 字，留空可清除備註",
       "oauthUnavailable": "該賬號沒有 OAuth 上游設置",
diff --git a/frontend/src/layout/components/system-update-modal/index.vue b/frontend/src/layout/components/system-update-modal/index.vue
index edaa79319..d1aea839f 100644
--- a/frontend/src/layout/components/system-update-modal/index.vue
+++ b/frontend/src/layout/components/system-update-modal/index.vue
@@ -481,7 +481,7 @@ watch(
         />
         <ZPopover placement="top-start">
           <template #reference>
-            <ZButton variant="text" size="small" square :aria-label="t('systemUpdate.channels.help')">
+            <ZButton variant="link" size="small" square :aria-label="t('systemUpdate.channels.help')">
               <CircleHelp class="size-4" />
             </ZButton>
           </template>
diff --git a/frontend/src/views/accounts/components/AccountApiKeyFields.vue b/frontend/src/views/accounts/components/AccountApiKeyFields.vue
index 869b68491..935f2f6fb 100644
--- a/frontend/src/views/accounts/components/AccountApiKeyFields.vue
+++ b/frontend/src/views/accounts/components/AccountApiKeyFields.vue
@@ -3,7 +3,6 @@ import type { ApiKeyAccountForm } from '../utils/upstreamApiKey'
 
 import { ZFormItem, ZInput, ZSegmented } from '@codex-proxy/ui'
 
-import { computed } from 'vue'
 import { useI18n } from 'vue-i18n'
 
 defineProps<{ disabled?: boolean, editing?: boolean }>()
@@ -11,13 +10,10 @@ defineProps<{ disabled?: boolean, editing?: boolean }>()
 const { t } = useI18n({ useScope: 'global' })
 
 const form = defineModel<ApiKeyAccountForm>({ required: true })
-const transportOptions = computed(() => ([
+const transportOptions = [
   { label: 'HTTP / SSE', value: 'http' },
-  {
-    label: t('accounts.credentials.wsFirst'),
-    value: 'prefer_websocket',
-  },
-]))
+  { label: 'WS', value: 'prefer_websocket' },
+]
 </script>
 
 <template>
diff --git a/frontend/src/views/accounts/components/AccountConnectionTestModal.vue b/frontend/src/views/accounts/components/AccountConnectionTestModal.vue
index 9c8542663..8960048dd 100644
--- a/frontend/src/views/accounts/components/AccountConnectionTestModal.vue
+++ b/frontend/src/views/accounts/components/AccountConnectionTestModal.vue
@@ -58,7 +58,7 @@ function connectionLogClass(tone: string) {
       <section
         class="flex items-center justify-between gap-4 rounded-cp-card bg-cp-fill-quaternary px-4 py-3"
       >
-        <AccountIdentityCell :account="account" size="lg" show-plan />
+        <AccountIdentityCell :account="account" size="lg" show-plan show-notes />
         <AccountStatusBadge
           :status="account.status"
           :error-reason="account.errorReason"
diff --git a/frontend/src/views/accounts/components/AccountEditModal.vue b/frontend/src/views/accounts/components/AccountEditModal.vue
index 24112da95..3bb1f7741 100644
--- a/frontend/src/views/accounts/components/AccountEditModal.vue
+++ b/frontend/src/views/accounts/components/AccountEditModal.vue
@@ -59,6 +59,7 @@ const selectedGroupIds = defineModel<string[]>('selectedGroupIds', { required: t
           class="min-w-0 flex-1"
           :account="account"
           size="lg"
+          show-notes
         />
         <div class="flex shrink-0 items-center gap-3">
           <AccountPlanBadge :authentication-kind="account.authenticationKind" :plan-type="account.planType" :plan-type-display="account.planTypeDisplay" size="sm" />
@@ -73,12 +74,7 @@ const selectedGroupIds = defineModel<string[]>('selectedGroupIds', { required: t
         <ZSegmented v-model="oauthTransport" :aria-label="t('accounts.editor.transportLabel')" :options="transportOptions" :disabled="saving || !configurationReady" />
       </ZFormItem>
 
-      <section v-if="isOpenAiApiKeyAccount(account)" class="grid gap-4">
-        <h3 class="m-0 text-cp font-heavy text-cp-text">
-          {{ t('accounts.editor.upstreamConnection') }}
-        </h3>
-        <AccountApiKeyFields v-model="apiKey" editing :disabled="saving || !configurationReady" />
-      </section>
+      <AccountApiKeyFields v-if="isOpenAiApiKeyAccount(account)" v-model="apiKey" editing :disabled="saving || !configurationReady" />
 
       <AccountSettingsFields
         v-model:enabled="enabled"
diff --git a/frontend/src/views/accounts/components/AccountModelAccessField.vue b/frontend/src/views/accounts/components/AccountModelAccessField.vue
index 3e0e771b4..54681561b 100644
--- a/frontend/src/views/accounts/components/AccountModelAccessField.vue
+++ b/frontend/src/views/accounts/components/AccountModelAccessField.vue
@@ -196,7 +196,7 @@ watch(search, () => {
             <ZPopover v-if="item.unavailable" class="mr-1 shrink-0" trigger="hover-click" placement="top" role="tooltip">
               <template #reference="{ open, id }">
                 <ZIconButton
-                  class="bg-transparent! hover:bg-transparent! active:bg-transparent!"
+                  variant="link"
                   size="small"
                   :aria-label="t('accounts.modelAccess.notInCurrentModelCatalog', { id: item.id })"
                   :aria-describedby="open ? id : undefined"
diff --git a/frontend/src/views/accounts/components/AccountNotesPopover.vue b/frontend/src/views/accounts/components/AccountNotesPopover.vue
index d6828b54c..81edbdb21 100644
--- a/frontend/src/views/accounts/components/AccountNotesPopover.vue
+++ b/frontend/src/views/accounts/components/AccountNotesPopover.vue
@@ -45,8 +45,7 @@ watch(() => props.notes, recheckOpen, { flush: 'post' })
     <template #reference>
       <button
         type="button"
-        class="inline-flex min-w-0 max-w-full touch-manipulation items-center rounded-cp-sm border-0 bg-transparent p-0 text-left text-cp-xs leading-4 text-cp-text-tertiary outline-none transition-colors hover:text-cp-primary-text focus-visible:ring-2 focus-visible:ring-cp-control-outline motion-reduce:transition-none"
-        :class="open ? 'text-cp-primary-text' : ''"
+        class="inline-flex min-w-0 max-w-full cursor-default touch-manipulation items-center rounded-cp-sm border-0 bg-transparent p-0 text-left text-cp-xs leading-4 text-cp-text-tertiary outline-none focus-visible:ring-2 focus-visible:ring-cp-control-outline"
         :aria-label="t('accounts.notes.viewAccountNotes')"
         aria-haspopup="dialog"
         :aria-expanded="open"
diff --git a/frontend/src/views/accounts/components/account-import-tasks/index.vue b/frontend/src/views/accounts/components/account-import-tasks/index.vue
index d540632f1..62fa09c1c 100644
--- a/frontend/src/views/accounts/components/account-import-tasks/index.vue
+++ b/frontend/src/views/accounts/components/account-import-tasks/index.vue
@@ -69,6 +69,8 @@ function handleRetentionKeydown(event: KeyboardEvent) {
         <ZPopover v-model="retentionOpen" trigger="hover-click" placement="top-start" :hover-delay="240">
           <template #reference>
             <ZIconButton
+              variant="link"
+              :title="undefined"
               :aria-label="t('accounts.importTasks.taskRetentionInstructions')"
               size="small"
               :aria-expanded="retentionOpen"
diff --git a/frontend/src/views/accounts/components/account-quota-forecast-modal/index.vue b/frontend/src/views/accounts/components/account-quota-forecast-modal/index.vue
index c6dd564e2..dd591762f 100644
--- a/frontend/src/views/accounts/components/account-quota-forecast-modal/index.vue
+++ b/frontend/src/views/accounts/components/account-quota-forecast-modal/index.vue
@@ -116,6 +116,8 @@ function handleExplanationKeydown(event: KeyboardEvent) {
         <ZPopover v-model="explanationOpen" trigger="hover-click" placement="top-start" :hover-delay="240">
           <template #reference>
             <ZIconButton
+              variant="link"
+              :title="undefined"
               :aria-label="t('accounts.quotaForecast.forecastDescription')"
               size="small"
               :aria-expanded="explanationOpen"
diff --git a/frontend/src/views/accounts/components/account-quota-panel/ResetCreditAutomation.vue b/frontend/src/views/accounts/components/account-quota-panel/ResetCreditAutomation.vue
index 78380565b..dcd938294 100644
--- a/frontend/src/views/accounts/components/account-quota-panel/ResetCreditAutomation.vue
+++ b/frontend/src/views/accounts/components/account-quota-panel/ResetCreditAutomation.vue
@@ -73,7 +73,7 @@ watch(() => props.accountId, () => {
         </h3>
         <ZPopover trigger="click" placement="bottom-start" role="dialog">
           <template #reference="{ open, id }">
-            <ZIconButton size="small" class="size-6! p-0!" :aria-label="t('accounts.quotaReset.automaticUsageRules')" :aria-expanded="open" :aria-controls="id">
+            <ZIconButton variant="link" :title="undefined" size="small" class="size-6! p-0!" :aria-label="t('accounts.quotaReset.automaticUsageRules')" :aria-expanded="open" :aria-controls="id">
               <CircleHelp class="size-3.5" />
             </ZIconButton>
           </template>
diff --git a/frontend/src/views/plugins/components/PluginHelpPopover.vue b/frontend/src/views/plugins/components/PluginHelpPopover.vue
index 4ad997d91..d5018d5fe 100644
--- a/frontend/src/views/plugins/components/PluginHelpPopover.vue
+++ b/frontend/src/views/plugins/components/PluginHelpPopover.vue
@@ -22,6 +22,7 @@ function handleKeydown(event: KeyboardEvent) {
   <ZPopover v-model="open" trigger="hover-click" placement="top-start" :hover-delay="240" class="shrink-0">
     <template #reference>
       <ZIconButton
+        variant="link"
         :aria-label="label"
         size="small"
         class="size-5!"
diff --git a/frontend/src/views/proxies/components/ProxyBatchCreateFields.vue b/frontend/src/views/proxies/components/ProxyBatchCreateFields.vue
index 1d367d009..7695bbbc3 100644
--- a/frontend/src/views/proxies/components/ProxyBatchCreateFields.vue
+++ b/frontend/src/views/proxies/components/ProxyBatchCreateFields.vue
@@ -23,7 +23,7 @@ const invalid = computed(() => props.rows.filter(row => row.error))
       <template #label-extra>
         <ZPopover class="-my-1" trigger="hover-click" placement="bottom-start">
           <template #reference="{ open }">
-            <ZIconButton :aria-label="t('proxies.batchCreate.formatDescription')" :title="undefined" :aria-expanded="open" class="size-6! hover:bg-transparent! active:bg-transparent!">
+            <ZIconButton variant="link" :aria-label="t('proxies.batchCreate.formatDescription')" :title="undefined" :aria-expanded="open" class="size-6!">
               <CircleHelp class="size-3.5" aria-hidden="true" />
             </ZIconButton>
           </template>
diff --git a/frontend/src/views/settings/components/AccountAffinityCard.vue b/frontend/src/views/settings/components/AccountAffinityCard.vue
index 3cdc8edd7..1fd835d68 100644
--- a/frontend/src/views/settings/components/AccountAffinityCard.vue
+++ b/frontend/src/views/settings/components/AccountAffinityCard.vue
@@ -37,7 +37,7 @@ const affinityOptions = computed(() => ([
         <template #label-extra>
           <ZPopover class="-my-1" trigger="hover-click" placement="top-start">
             <template #reference="{ open }">
-              <ZIconButton :aria-label="t('settings.affinity.accountAffinityInstructions')" :title="undefined" :aria-expanded="open" class="size-6! hover:bg-transparent! active:bg-transparent!">
+              <ZIconButton variant="link" :aria-label="t('settings.affinity.accountAffinityInstructions')" :title="undefined" :aria-expanded="open" class="size-6!">
                 <CircleAlert class="size-3.5" aria-hidden="true" />
               </ZIconButton>
             </template>
diff --git a/frontend/src/views/settings/components/AccountWarmupCard.vue b/frontend/src/views/settings/components/AccountWarmupCard.vue
index 77e9748c3..c72880c82 100644
--- a/frontend/src/views/settings/components/AccountWarmupCard.vue
+++ b/frontend/src/views/settings/components/AccountWarmupCard.vue
@@ -20,7 +20,7 @@ const model = defineModel<string>('model', { required: true })
         {{ t('settings.warmup.title') }}
         <ZPopover trigger="hover-click" placement="top-start">
           <template #reference="{ open }">
-            <ZIconButton :aria-label="t('settings.warmup.helpTitle')" :title="undefined" :aria-expanded="open" class="size-6! hover:bg-transparent! active:bg-transparent!">
+            <ZIconButton variant="link" :aria-label="t('settings.warmup.helpTitle')" :title="undefined" :aria-expanded="open" class="size-6!">
               <CircleAlert class="size-3.5" aria-hidden="true" />
             </ZIconButton>
           </template>
diff --git a/frontend/src/views/settings/components/ConcurrencyPolicyCard.vue b/frontend/src/views/settings/components/ConcurrencyPolicyCard.vue
index 9e9d0d4dd..b56bf9c4b 100644
--- a/frontend/src/views/settings/components/ConcurrencyPolicyCard.vue
+++ b/frontend/src/views/settings/components/ConcurrencyPolicyCard.vue
@@ -41,7 +41,7 @@ const openaiGuardianReservedConcurrency = defineModel<string>('openaiGuardianRes
         <template #label-extra>
           <ZPopover class="-my-1" trigger="hover-click" placement="top-start">
             <template #reference="{ open }">
-              <ZIconButton :aria-label="t('settings.concurrency.queueTimeoutHelpTitle')" :title="undefined" :aria-expanded="open" class="size-6! hover:bg-transparent! active:bg-transparent!">
+              <ZIconButton variant="link" :aria-label="t('settings.concurrency.queueTimeoutHelpTitle')" :title="undefined" :aria-expanded="open" class="size-6!">
                 <CircleAlert class="size-3.5" aria-hidden="true" />
               </ZIconButton>
             </template>
@@ -56,7 +56,7 @@ const openaiGuardianReservedConcurrency = defineModel<string>('openaiGuardianRes
         <template #label-extra>
           <ZPopover class="-my-1" trigger="hover-click" placement="top-start">
             <template #reference="{ open }">
-              <ZIconButton :aria-label="t('settings.concurrency.autoReview.helpTitle')" :title="undefined" :aria-expanded="open" class="size-6! hover:bg-transparent! active:bg-transparent!">
+              <ZIconButton variant="link" :aria-label="t('settings.concurrency.autoReview.helpTitle')" :title="undefined" :aria-expanded="open" class="size-6!">
                 <CircleAlert class="size-3.5" aria-hidden="true" />
               </ZIconButton>
             </template>
diff --git a/frontend/src/views/settings/components/SmartSchedulingModal.vue b/frontend/src/views/settings/components/SmartSchedulingModal.vue
index 65904c3cd..db2ec046f 100644
--- a/frontend/src/views/settings/components/SmartSchedulingModal.vue
+++ b/frontend/src/views/settings/components/SmartSchedulingModal.vue
@@ -112,7 +112,7 @@ function confirm() {
                 {{ field.label }}
                 <ZPopover trigger="hover-click" placement="top-start">
                   <template #reference="{ open: helpOpen }">
-                    <ZIconButton :aria-label="t('settings.scheduling.about', { label: field.label })" :title="undefined" :aria-expanded="helpOpen" class="size-6! hover:bg-transparent! active:bg-transparent!">
+                    <ZIconButton variant="link" :aria-label="t('settings.scheduling.about', { label: field.label })" :title="undefined" :aria-expanded="helpOpen" class="size-6!">
                       <CircleHelp class="size-3.5" />
                     </ZIconButton>
                   </template>
diff --git a/frontend/src/views/settings/components/backup/BackupRecordsCard.vue b/frontend/src/views/settings/components/backup/BackupRecordsCard.vue
index 59bbf316f..1d0ec07d9 100644
--- a/frontend/src/views/settings/components/backup/BackupRecordsCard.vue
+++ b/frontend/src/views/settings/components/backup/BackupRecordsCard.vue
@@ -138,7 +138,7 @@ function canDelete(record: BackupRecord): boolean {
         <span>{{ t('settings.backup.backupRecords') }}</span>
         <ZPopover trigger="hover-click" placement="bottom-start">
           <template #reference="{ open }">
-            <ZIconButton :aria-label="t('settings.backup.backupScopeDescription')" :title="undefined" :aria-expanded="open" class="size-6! hover:bg-transparent! active:bg-transparent!">
+            <ZIconButton variant="link" :aria-label="t('settings.backup.backupScopeDescription')" :title="undefined" :aria-expanded="open" class="size-6!">
               <CircleHelp class="size-3.5" aria-hidden="true" />
             </ZIconButton>
           </template>
diff --git a/frontend/src/views/settings/components/client-version/components/ClientVersionPolicyCard.vue b/frontend/src/views/settings/components/client-version/components/ClientVersionPolicyCard.vue
index 80fc8a7f1..b90503b7b 100644
--- a/frontend/src/views/settings/components/client-version/components/ClientVersionPolicyCard.vue
+++ b/frontend/src/views/settings/components/client-version/components/ClientVersionPolicyCard.vue
@@ -36,9 +36,10 @@ const minCodexCliVersion = defineModel<string>('minCodexCliVersion', { required:
       <span class="inline-flex items-center gap-1.5">
         <span>{{ t('settings.clientVersion.clientVersionRestrictions') }}</span>
         <ZIconButton
+          variant="link"
           :aria-label="t('settings.clientVersion.openGuide')"
           :title="undefined"
-          class="size-6! hover:bg-transparent! active:bg-transparent!"
+          class="size-6!"
           @click="emit('help')"
         >
           <CircleHelp class="size-3.5" aria-hidden="true" />
diff --git a/frontend/src/views/settings/components/error-protection/AccountErrorProtectionCard.vue b/frontend/src/views/settings/components/error-protection/AccountErrorProtectionCard.vue
index b828b8d79..421ad7491 100644
--- a/frontend/src/views/settings/components/error-protection/AccountErrorProtectionCard.vue
+++ b/frontend/src/views/settings/components/error-protection/AccountErrorProtectionCard.vue
@@ -101,6 +101,8 @@ function removeRule(id: string) {
             <ZPopover trigger="hover-click" placement="top-start" :hover-delay="240">
               <template #reference="{ open }">
                 <ZIconButton
+                  variant="link"
+                  :title="undefined"
                   size="small"
                   :aria-label="t('settings.errorProtection.matchingHelpTitle')"
                   :aria-expanded="open"
diff --git a/frontend/src/views/settings/components/privacy/PrivacyPolicyCard.vue b/frontend/src/views/settings/components/privacy/PrivacyPolicyCard.vue
index 8e3257751..69db40920 100644
--- a/frontend/src/views/settings/components/privacy/PrivacyPolicyCard.vue
+++ b/frontend/src/views/settings/components/privacy/PrivacyPolicyCard.vue
@@ -113,7 +113,7 @@ function remove(rule: PrivacyRule) {
             <ZSelect v-model="model.onError" size="small" class="w-34" :options="failureOptions" :aria-label="t('settings.privacy.ruleExecutionFailed')" :disabled="disabled" />
             <ZPopover trigger="hover-click" placement="top-end">
               <template #reference="{ open: helpOpen }">
-                <ZIconButton size="small" :aria-label="t('settings.privacy.ruleExecutionInstructions')" :title="undefined" class="hover:bg-transparent! active:bg-transparent!" :aria-expanded="helpOpen">
+                <ZIconButton variant="link" size="small" :aria-label="t('settings.privacy.ruleExecutionInstructions')" :title="undefined" :aria-expanded="helpOpen">
                   <CircleHelp class="size-3.5" />
                 </ZIconButton>
               </template>
diff --git a/frontend/src/views/settings/components/privacy/StepFields.vue b/frontend/src/views/settings/components/privacy/StepFields.vue
index b78e0ecfc..c2dfd1062 100644
--- a/frontend/src/views/settings/components/privacy/StepFields.vue
+++ b/frontend/src/views/settings/components/privacy/StepFields.vue
@@ -62,7 +62,7 @@ watch(() => step.value.action, (action) => {
       <template #label-extra>
         <ZPopover trigger="hover-click">
           <template #reference="{ open: helpOpen }">
-            <ZIconButton size="small" :aria-label="t('settings.privacy.steps.fieldPathSyntax')" :title="undefined" class="-my-2 hover:bg-transparent! active:bg-transparent!" :aria-expanded="helpOpen">
+            <ZIconButton variant="link" size="small" :aria-label="t('settings.privacy.steps.fieldPathSyntax')" :title="undefined" class="-my-2" :aria-expanded="helpOpen">
               <CircleHelp class="size-3.5" />
             </ZIconButton>
           </template>
@@ -84,7 +84,7 @@ watch(() => step.value.action, (action) => {
       <template #label-extra>
         <ZPopover trigger="hover-click">
           <template #reference="{ open: helpOpen }">
-            <ZIconButton size="small" :aria-label="t('settings.privacy.steps.regularSyntaxDescription')" :title="undefined" class="-my-2 hover:bg-transparent! active:bg-transparent!" :aria-expanded="helpOpen">
+            <ZIconButton variant="link" size="small" :aria-label="t('settings.privacy.steps.regularSyntaxDescription')" :title="undefined" class="-my-2" :aria-expanded="helpOpen">
               <CircleHelp class="size-3.5" />
             </ZIconButton>
           </template>
diff --git a/frontend/src/views/settings/components/privacy/StepList.vue b/frontend/src/views/settings/components/privacy/StepList.vue
index 129bcd2fb..ed4d5e236 100644
--- a/frontend/src/views/settings/components/privacy/StepList.vue
+++ b/frontend/src/views/settings/components/privacy/StepList.vue
@@ -114,7 +114,7 @@ function moveWithKeyboard(index: number, offset: -1 | 1) {
         </h3>
         <ZPopover trigger="hover-click">
           <template #reference="{ open: helpOpen }">
-            <ZIconButton size="small" :aria-label="t('settings.privacy.steps.helpTitle')" :title="undefined" class="size-5! hover:bg-transparent! active:bg-transparent!" :aria-expanded="helpOpen">
+            <ZIconButton variant="link" size="small" :aria-label="t('settings.privacy.steps.helpTitle')" :title="undefined" class="size-5!" :aria-expanded="helpOpen">
               <CircleHelp class="size-3.5" />
             </ZIconButton>
           </template>
diff --git a/frontend/src/views/settings/index.vue b/frontend/src/views/settings/index.vue
index 2223d273d..445dd7299 100644
--- a/frontend/src/views/settings/index.vue
+++ b/frontend/src/views/settings/index.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ZButton, ZConfirmDialog, ZIconButton, ZPageHeader, ZSegmented, ZSelect } from '@codex-proxy/ui'
+import { ZButton, ZConfirmDialog, ZIconButton, ZPageHeader, ZSegmented } from '@codex-proxy/ui'
 
 import { Save, Undo2 } from '@lucide/vue'
 
@@ -133,14 +133,7 @@ watch(section, (value) => {
       <ZSegmented
         :model-value="section"
         :aria-label="t('settings.page.sectionsLabel')"
-        class="hidden! bg-(--cp-input-bg)! sm:inline-grid!"
-        :options="sectionOptions"
-        @update:model-value="switchSection"
-      />
-      <ZSelect
-        :model-value="section"
-        :aria-label="t('settings.page.sectionsLabel')"
-        class="w-full sm:hidden"
+        class="w-full sm:w-auto"
         :options="sectionOptions"
         @update:model-value="switchSection"
       />
diff --git a/frontend/src/views/settings/pricing/PricingEditor.vue b/frontend/src/views/settings/pricing/PricingEditor.vue
index 3e025239c..e1a2915b6 100644
--- a/frontend/src/views/settings/pricing/PricingEditor.vue
+++ b/frontend/src/views/settings/pricing/PricingEditor.vue
@@ -162,7 +162,7 @@ function submit() {
     <template #footer>
       <ZPopover v-model="helpOpen" class="mr-auto self-center" placement="top-start" trigger="hover-click">
         <template #reference>
-          <ZButton variant="text" :aria-expanded="helpOpen" :aria-controls="helpOpen ? helpId : undefined">
+          <ZButton variant="link" :aria-expanded="helpOpen" :aria-controls="helpOpen ? helpId : undefined">
             <template #icon>
               <Info class="size-3.5" aria-hidden="true" />
             </template>
diff --git a/frontend/src/views/settings/pricing/PricingToolbar.vue b/frontend/src/views/settings/pricing/PricingToolbar.vue
index b24613a37..0b94e24cc 100644
--- a/frontend/src/views/settings/pricing/PricingToolbar.vue
+++ b/frontend/src/views/settings/pricing/PricingToolbar.vue
@@ -76,7 +76,7 @@ const providerOptions = computed(() => props.providers.map(value => ({
         <div class="flex items-center gap-1">
           <ZPopover v-model="syncInfoOpen" placement="bottom-end" trigger="hover-click">
             <template #reference>
-              <ZIconButton :aria-label="t('settings.pricing.synchronizationInstructions')" size="small" :aria-expanded="syncInfoOpen" :aria-controls="syncInfoOpen ? syncInfoId : undefined">
+              <ZIconButton variant="link" :title="undefined" :aria-label="t('settings.pricing.synchronizationInstructions')" size="small" :aria-expanded="syncInfoOpen" :aria-controls="syncInfoOpen ? syncInfoId : undefined">
                 <CircleAlert class="size-3.5" />
               </ZIconButton>
             </template>
diff --git a/frontend/src/views/settings/pricing/PricingUnit.vue b/frontend/src/views/settings/pricing/PricingUnit.vue
index df3eec793..bb1e1d2bb 100644
--- a/frontend/src/views/settings/pricing/PricingUnit.vue
+++ b/frontend/src/views/settings/pricing/PricingUnit.vue
@@ -15,10 +15,10 @@ const infoId = useId()
   <ZPopover v-model="infoOpen" placement="bottom-start" trigger="hover-click">
     <template #reference>
       <ZIconButton
+        variant="link"
         size="small"
         :aria-label="t('settings.pricing.unitHelp')"
         :title="undefined"
-        class="hover:bg-transparent! active:bg-transparent!"
         :aria-expanded="infoOpen"
         :aria-controls="infoOpen ? infoId : undefined"
       >