fix(web): align the credential onboarding page

apps/web/tests/snapshots/onboarding-deepseek-config/missing.expected.md

@@ -1,6 +1,5 @@
 - region "添加一个 API Key 开始使用":
   - heading "添加一个 API Key 开始使用" [level=2]
   - paragraph: 配置 DeepSeek 官方模型，即可开始使用。
-  - text: DeepSeek deepseek-official
   - button "稍后配置"
   - button "前往配置"

packages/client/ui-models/src/client/DeepSeekOnboardingDialog.module.css

@@ -1,68 +1,45 @@
 .page {
   position: relative;
   z-index: 1;
-  width: min(640px, calc(100vw - 64px));
+  display: flex;
-  max-height: 100vh;
+  flex-direction: column;
-  padding: clamp(64px, 9vh, 108px) 0 40px;
+  justify-content: center;
+  width: min(560px, calc(100vw - 64px));
+  min-height: 100vh;
+  padding: 40px 0;
   box-sizing: border-box;
-  overflow-y: auto;
   color: var(--dsw-alias-label-primary);
 }
 
 .brand {
   display: flex;
   align-items: center;
-  margin-bottom: 42px;
+  margin-bottom: 36px;
   color: var(--dsw-alias-label-primary);
 }
 
 .title {
-  max-width: 620px;
   margin: 0;
-  font-size: clamp(30px, 4vw, 42px);
+  font-size: 32px;
-  line-height: 1.15;
+  line-height: 40px;
   font-weight: 600;
-  letter-spacing: -0.035em;
+  letter-spacing: -0.02em;
   outline: none;
 }
 
 .description {
-  max-width: 600px;
+  margin: 16px 0 0;
-  margin: 22px 0 0;
-  font-size: 17px;
-  line-height: 29px;
-  color: var(--dsw-alias-label-secondary);
-}
-
-.provider {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  max-width: 600px;
-  margin-top: 36px;
-  padding: 18px 20px;
-  border: 1px solid var(--dsw-alias-border-l2);
-  border-radius: 16px;
-  background: var(--dsw-alias-bg-module-platform);
-}
-
-.providerName {
   font-size: 16px;
-  line-height: 24px;
+  line-height: 28px;
-  font-weight: 600;
+  color: var(--dsw-alias-label-secondary);
-}
-
-.providerRoute {
-  font-size: 13px;
-  line-height: 20px;
-  color: var(--dsw-alias-label-tertiary);
 }
 
 .actions {
   display: flex;
   align-items: center;
+  justify-content: flex-end;
   gap: 12px;
-  margin-top: 40px;
+  margin-top: 36px;
 }
 
 .primary {
@@ -72,15 +49,13 @@
 .brand,
 .title,
 .description,
-.provider,
 .actions {
   animation: credential-enter 280ms cubic-bezier(0.23, 1, 0.32, 1) both;
 }
 
 .title { animation-delay: 40ms; }
 .description { animation-delay: 80ms; }
-.provider { animation-delay: 120ms; }
+.actions { animation-delay: 120ms; }
-.actions { animation-delay: 160ms; }
 
 @keyframes credential-enter {
   from {
@@ -98,7 +73,6 @@
   .brand,
   .title,
   .description,
-  .provider,
   .actions {
     animation: none;
   }
@@ -107,21 +81,18 @@
 @media (max-width: 560px) {
   .page {
     width: calc(100vw - 40px);
-    padding-top: 48px;
+    justify-content: flex-start;
+    padding-top: 64px;
   }
 
   .brand {
     margin-bottom: 30px;
   }
 
-  .description {
-    font-size: 16px;
-    line-height: 27px;
-  }
-
   .actions {
     align-items: stretch;
     flex-direction: column-reverse;
+    margin-top: 32px;
   }
 
   .primary,

packages/client/ui-models/src/client/DeepSeekOnboardingDialog.tsx

@@ -91,10 +91,6 @@ export function DeepSeekOnboardingDialog(props: DeepSeekOnboardingDialogProps):
         {t('onboardingTitle')}
       </h2>
       <p className={styles['description']}>{t('onboardingDescription')}</p>
-      <div className={styles['provider']}>
-        <span className={styles['providerName']}>DeepSeek</span>
-        <span className={styles['providerRoute']}>deepseek-official</span>
-      </div>
       <div className={styles['actions']}>
         <Button variant="ghost" className={styles['later']} onClick={complete}>
           {t('onboardingLater')}