fix(frontend): 修复Studio原型表格与时间线样式

frontend/src/pages/studio/IngestionPipelinePage.vue

@@ -25,8 +25,10 @@ import { ingestionSteps } from '@/data/studioMock';
         <div class="pipeline-timeline">
           <article v-for="step in ingestionSteps" :key="step.name" :class="`is-${step.status}`">
             <div class="timeline-dot" />
+            <div class="timeline-content">
               <strong>{{ step.name }}</strong>
               <span>{{ step.description }}</span>
+            </div>
           </article>
         </div>
       </section>

frontend/src/pages/studio/ObservabilityPage.vue

@@ -25,7 +25,11 @@ import { recentRuns, traceSteps } from '@/data/studioMock';
           <div v-for="run in recentRuns" :key="run.id" class="run-row">
             <strong>{{ run.name }}</strong>
             <span>{{ run.type }}</span>
-            <el-tag :type="run.status === '成功' ? 'success' : 'warning'">{{ run.status }}</el-tag>
+            <span class="status-cell">
+              <span class="status-pill" :class="run.status === '成功' ? 'is-success' : 'is-warning'">
+                {{ run.status }}
+              </span>
+            </span>
             <span>{{ run.latency }}</span>
             <span>{{ run.cost }}</span>
           </div>

frontend/src/pages/studio/StudioDashboardPage.vue

@@ -76,7 +76,11 @@ import { lifecycleSteps, readinessChecklist, recentRuns } from '@/data/studioMoc
           <div v-for="run in recentRuns" :key="run.id" class="run-row">
             <strong>{{ run.name }}</strong>
             <span>{{ run.type }}</span>
-            <el-tag :type="run.status === '成功' ? 'success' : 'warning'">{{ run.status }}</el-tag>
+            <span class="status-cell">
+              <span class="status-pill" :class="run.status === '成功' ? 'is-success' : 'is-warning'">
+                {{ run.status }}
+              </span>
+            </span>
             <span>{{ run.latency }}</span>
             <span>{{ run.cost }}</span>
           </div>

frontend/src/styles/global.css

@@ -412,6 +412,7 @@ a {
   display: grid;
   grid-template-columns: 1.5fr 0.7fr 0.7fr 0.7fr 0.7fr;
   align-items: center;
+  column-gap: 14px;
   min-height: 44px;
   border-bottom: 1px solid var(--app-border-soft);
   color: #334155;
@@ -425,6 +426,14 @@ a {
   font-weight: 800;
 }
 
+.status-cell {
+  display: inline-flex;
+  align-items: center;
+  justify-self: start;
+  min-width: 74px;
+  max-width: 100%;
+}
+
 .warning-panel {
   display: flex;
   gap: 14px;
@@ -562,18 +571,57 @@ a {
   padding: 0 20px 18px;
 }
 
+.status-pill {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  min-width: 54px;
+  height: 24px;
+  padding: 0 10px;
+  border: 1px solid transparent;
+  border-radius: 6px;
+  font-size: 12px;
+  font-weight: 750;
+  line-height: 1;
+  white-space: nowrap;
+}
+
+.status-pill.is-success {
+  border-color: #bbf7d0;
+  color: #15803d;
+  background: #f0fdf4;
+}
+
+.status-pill.is-warning {
+  border-color: #fed7aa;
+  color: #c2410c;
+  background: #fff7ed;
+}
+
 .pipeline-timeline article {
   display: grid;
   grid-template-columns: auto 1fr;
   column-gap: 10px;
+  align-items: start;
   color: var(--app-text-muted);
 }
 
+.timeline-content {
+  min-width: 0;
+}
+
 .pipeline-timeline strong {
+  display: block;
   color: var(--app-text);
   font-size: 13px;
 }
 
+.pipeline-timeline span {
+  display: block;
+  margin-top: 4px;
+  line-height: 1.45;
+}
+
 .timeline-dot {
   width: 12px;
   height: 12px;