feat(settings): add item search (#1592)

Adds item-level search inside Settings so users can find concrete settings like provider auth, agent mode, terminal font size, tunnel options, notification events, and similar controls instead of only filtering top-level pages.
Groups search results by Settings page and shows localized labels plus optional descriptions where useful.
Supports keyboard navigation with Arrow Up/Down, Enter, and Escape, matching the existing autocomplete interaction style.
Opens the correct Settings page or split-page draft state before scrolling to the matching control.
Highlights the matched setting with a subtle token-based background so users can see where they landed without an aggressive outline.
Adds explicit data-settings-item anchors across Settings pages and a centralized search registry with runtime/mobile availability guards.
Updates Settings UI skill guidance so future Settings changes keep search registry entries, anchors, localization, and availability guards in sync.

packages/ui/src/components/sections/mcp/McpPage.tsx

@@ -1493,7 +1493,7 @@ export const McpPage: React.FC = () => {
         )}
 
         {/* Server Identity */}
-        <div className="mb-6">
+        <div data-settings-item="mcp.server" className="mb-6">
           <div className="mb-1 px-1">
             <h3 className="typography-ui-header font-medium text-foreground">{t('settings.mcp.page.server.title')}</h3>
           </div>
@@ -1604,7 +1604,7 @@ export const McpPage: React.FC = () => {
         </div>
 
         {/* Connection */}
-        <div className="mb-6">
+        <div data-settings-item="mcp.command" className="mb-6">
           <div className="mb-1 px-1">
             <h3 className="typography-ui-header font-medium text-foreground">
               {mcpType === 'local' ? t('settings.mcp.page.connection.command') : t('settings.mcp.page.connection.serverUrl')}
@@ -1634,7 +1634,7 @@ export const McpPage: React.FC = () => {
         </div>
 
         {mcpType === 'remote' && (
-          <div className="mb-6">
+          <div data-settings-item="mcp.advanced" className="mb-6">
             <div className="mb-1 px-1">
               <h3 className="typography-ui-header font-medium text-foreground">{t('settings.mcp.page.advanced.title')}</h3>
             </div>
@@ -1787,7 +1787,7 @@ export const McpPage: React.FC = () => {
         )}
 
         {/* Environment Variables */}
-        <div className="mb-2">
+        <div data-settings-item="mcp.environment" className="mb-2">
           <div className="mb-1 px-1">
             <h3 className="typography-ui-header font-medium text-foreground">
               {t('settings.mcp.page.env.title')}

packages/ui/src/components/sections/mcp/McpSidebar.tsx

@@ -186,6 +186,7 @@ export const McpSidebar: React.FC<McpSidebarProps> = ({ onItemSelect }) => {
             {t('settings.mcp.sidebar.total', { count: mcpServers.length })}
           </span>
           <Button size="sm"
+            data-settings-item="mcp.create"
             variant="ghost"
             className="h-7 w-7 px-0 -my-1 text-muted-foreground"
             onClick={handleCreateNew}