chore(ui): tighten and center bulk delete toolbar

packages/ui/src/components/message-section.tsx

@@ -1401,7 +1401,8 @@ export default function MessageSection(props: MessageSectionProps) {
               role="toolbar"
               aria-label={t("messageSection.bulkDelete.toolbarAriaLabel", { count: selectedDeleteCount() })}
             >
-              <span class="message-delete-mode-token-group" aria-hidden="true">
+              <div class="message-delete-mode-toolbar-row" aria-hidden="true">
+                <span class="message-delete-mode-token-group">
                   <span class="message-delete-mode-count message-delete-mode-count--before" title={`${tokenStats().used} tokens currently in context`}>
                     {formatTokenCount(tokenStats().used)}
                   </span>
@@ -1494,6 +1495,7 @@ export default function MessageSection(props: MessageSectionProps) {
                 >
                   <X class="w-4 h-4" aria-hidden="true" />
                 </button>
+              </div>
 
               <div class="message-delete-mode-hint-row keyboard-hints" aria-hidden="true">
                 <Kbd shortcut="cmd+click" />

packages/ui/src/lib/i18n/messages/es/messaging.ts

@@ -92,9 +92,9 @@ export const messagingMessages = {
   "messageSection.bulkDelete.selectionModeLabel": "Selección",
   "messageSection.bulkDelete.selectionModeAll": "Todo",
   "messageSection.bulkDelete.selectionModeTools": "Solo herramientas",
-  "messageSection.bulkDelete.selectionHint.toggle": "alternar",
+  "messageSection.bulkDelete.selectionHint.toggle": "Seleccionar elemento",
-  "messageSection.bulkDelete.selectionHint.range": "rango",
+  "messageSection.bulkDelete.selectionHint.range": "Seleccionar rango",
-  "messageSection.bulkDelete.selectionHint.clear": "limpiar",
+  "messageSection.bulkDelete.selectionHint.clear": "Borrar selección",
   "messageSection.bulkDelete.cancelTitle": "Cancelar selección",
   "messageSection.bulkDelete.failedTitle": "Error al eliminar",
   "messageSection.bulkDelete.failedMessage": "No se pudieron eliminar los elementos seleccionados",

packages/ui/src/lib/i18n/messages/fr/messaging.ts

@@ -92,9 +92,9 @@ export const messagingMessages = {
   "messageSection.bulkDelete.selectionModeLabel": "Sélection",
   "messageSection.bulkDelete.selectionModeAll": "Tous",
   "messageSection.bulkDelete.selectionModeTools": "Outils uniquement",
-  "messageSection.bulkDelete.selectionHint.toggle": "basculer",
+  "messageSection.bulkDelete.selectionHint.toggle": "Selectionner un element",
-  "messageSection.bulkDelete.selectionHint.range": "plage",
+  "messageSection.bulkDelete.selectionHint.range": "Selectionner une plage",
-  "messageSection.bulkDelete.selectionHint.clear": "effacer",
+  "messageSection.bulkDelete.selectionHint.clear": "Effacer la selection",
   "messageSection.bulkDelete.cancelTitle": "Annuler la sélection",
   "messageSection.bulkDelete.failedTitle": "Échec de suppression",
   "messageSection.bulkDelete.failedMessage": "Impossible de supprimer les éléments sélectionnés",

packages/ui/src/lib/i18n/messages/ja/messaging.ts

@@ -92,9 +92,9 @@ export const messagingMessages = {
   "messageSection.bulkDelete.selectionModeLabel": "選択",
   "messageSection.bulkDelete.selectionModeAll": "すべて",
   "messageSection.bulkDelete.selectionModeTools": "ツールのみ",
-  "messageSection.bulkDelete.selectionHint.toggle": "切り替え",
+  "messageSection.bulkDelete.selectionHint.toggle": "項目を選択",
-  "messageSection.bulkDelete.selectionHint.range": "範囲",
+  "messageSection.bulkDelete.selectionHint.range": "範囲を選択",
-  "messageSection.bulkDelete.selectionHint.clear": "クリア",
+  "messageSection.bulkDelete.selectionHint.clear": "選択を解除",
   "messageSection.bulkDelete.cancelTitle": "選択をキャンセル",
   "messageSection.bulkDelete.failedTitle": "削除に失敗しました",
   "messageSection.bulkDelete.failedMessage": "選択した項目の削除に失敗しました",

packages/ui/src/lib/i18n/messages/ru/messaging.ts

@@ -92,9 +92,9 @@ export const messagingMessages = {
   "messageSection.bulkDelete.selectionModeLabel": "Выбор",
   "messageSection.bulkDelete.selectionModeAll": "Все",
   "messageSection.bulkDelete.selectionModeTools": "Только инструменты",
-  "messageSection.bulkDelete.selectionHint.toggle": "переключить",
+  "messageSection.bulkDelete.selectionHint.toggle": "Выбрать элемент",
-  "messageSection.bulkDelete.selectionHint.range": "диапазон",
+  "messageSection.bulkDelete.selectionHint.range": "Выбрать диапазон",
-  "messageSection.bulkDelete.selectionHint.clear": "очистить",
+  "messageSection.bulkDelete.selectionHint.clear": "Очистить выбор",
   "messageSection.bulkDelete.cancelTitle": "Отменить выбор",
   "messageSection.bulkDelete.failedTitle": "Ошибка удаления",
   "messageSection.bulkDelete.failedMessage": "Не удалось удалить выбранные элементы",

packages/ui/src/lib/i18n/messages/zh-Hans/messaging.ts

@@ -92,9 +92,9 @@ export const messagingMessages = {
   "messageSection.bulkDelete.selectionModeLabel": "选择",
   "messageSection.bulkDelete.selectionModeAll": "全部",
   "messageSection.bulkDelete.selectionModeTools": "仅工具",
-  "messageSection.bulkDelete.selectionHint.toggle": "切换",
+  "messageSection.bulkDelete.selectionHint.toggle": "选择项目",
-  "messageSection.bulkDelete.selectionHint.range": "范围",
+  "messageSection.bulkDelete.selectionHint.range": "选择范围",
-  "messageSection.bulkDelete.selectionHint.clear": "清除",
+  "messageSection.bulkDelete.selectionHint.clear": "清除选择",
   "messageSection.bulkDelete.cancelTitle": "取消选择",
   "messageSection.bulkDelete.failedTitle": "删除失败",
   "messageSection.bulkDelete.failedMessage": "无法删除已选择的项目",

packages/ui/src/styles/messaging/message-selection.css

@@ -11,20 +11,29 @@
 
 .message-delete-mode-toolbar {
   position: absolute;
-  right: 5rem;
+  left: 50%;
+  transform: translateX(-50%);
   bottom: 1rem;
-  display: flex;
+  display: inline-flex;
-  flex-wrap: wrap;
+  flex-direction: column;
   align-items: center;
   gap: 6px;
   padding: 6px 10px;
-  background: color-mix(in oklab, var(--surface-base) 62%, var(--accent-primary));
+  /* Match other popups (dropdown-surface / panels) */
-  border: 1px solid var(--accent-primary);
+  background-color: var(--surface-base);
+  border: 1px solid var(--border-base);
   border-radius: 12px;
   z-index: 50;
-  box-shadow:
+  box-shadow: var(--panel-shadow-strong);
-    0 0 0 1px color-mix(in oklab, var(--accent-primary) 25%, transparent),
+  width: max-content;
-    0 8px 24px rgba(0, 0, 0, 0.3);
+  max-width: min(80vw, 560px);
+}
+
+.message-delete-mode-toolbar-row {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 6px;
 }
 
 .message-delete-mode-token-group {
@@ -202,7 +211,6 @@
 }
 
 .message-delete-mode-hint-row {
-  flex: 1 0 100%;
   display: flex;
   align-items: center;
   justify-content: center;
@@ -211,10 +219,11 @@
   font-size: 10px;
   color: var(--text-muted);
   user-select: none;
+  flex-wrap: wrap;
 }
 
 .message-delete-mode-hint-text {
-  white-space: nowrap;
+  white-space: normal;
 }
 
 .message-delete-mode-hint-sep {