fix: separate model credential status

src/renderer/src/SettingsPanel.test.tsx

@@ -1930,6 +1930,11 @@ describe('SettingsPanel runtime files', () => {
     fireEvent.click(screen.getByRole('tab', { name: '模型连接' }))
     await screen.findByDisplayValue('默认模型')
     fireEvent.click(screen.getByRole('button', { name: '向量模型' }))
+    expect(
+      screen
+        .getByLabelText('API Key（可选）')
+        .closest('.runtime-note')
+    ).toHaveClass('model-service-form')
     expect(
       screen.getByText('向量模型连接', { selector: 'strong' })
     ).toBeInTheDocument()
@@ -1995,6 +2000,11 @@ describe('SettingsPanel runtime files', () => {
     await screen.findByDisplayValue('默认模型')
     fireEvent.click(screen.getByRole('button', { name: '重排模型' }))
 
+    expect(
+      screen
+        .getByLabelText('API Key（可选）')
+        .closest('.runtime-note')
+    ).toHaveClass('model-service-form')
     const rerankSwitch = screen.getByRole('switch', {
       name: '启用学习型重排'
     })

src/renderer/src/SettingsPanel.tsx

@@ -2147,7 +2147,7 @@ export function SettingsPanel({
                   <small>{t('model.embedding.description')}</small>
                 </div>
               </div>
-              <div className="runtime-note">
+              <div className="runtime-note model-service-form">
                 <label className="toggle-row">
                   <input
                     checked={knowledgeEmbeddingEnabled}
@@ -2260,7 +2260,7 @@ export function SettingsPanel({
                   <small>{t('model.rerank.description')}</small>
                 </div>
               </div>
-              <div className="runtime-note">
+              <div className="runtime-note model-service-form">
                 <label className="toggle-row">
                   <input
                     checked={knowledgeRerankEnabled}

src/renderer/src/WorkspacePrimitives.test.tsx

@@ -134,6 +134,12 @@ describe('WorkspacePrimitives', () => {
     )
   })
 
+  it('separates model service fields from credential status', () => {
+    expect(stylesheet).toMatch(
+      /\.model-service-form\s*\{[^}]*display:\s*grid;[^}]*gap:\s*var\(--space-3\);/u
+    )
+  })
+
   it('uses the design-system page gutters at each window width', () => {
     expect(stylesheet).toMatch(/--page-gutter:\s*32px;/u)
     expect(stylesheet).toMatch(

src/renderer/src/styles.css

@@ -4891,6 +4891,11 @@ button > svg {
   font-weight: 650;
 }
 
+.model-service-form {
+  display: grid;
+  gap: var(--space-3);
+}
+
 .runtime-source-options {
   display: grid;
   min-width: 0;