feat(ui): sharpen dashboard console visual system

src/lib/ui/components/TelemetryCard.tsx

@@ -6,21 +6,29 @@ import { LineChart } from "./LineChart";
 
 export interface TelemetryCardProps {
   card: UiTelemetryCard;
+  index?: number;
 }
 
-export function TelemetryCard({ card }: TelemetryCardProps) {
+export function TelemetryCard({ card, index }: TelemetryCardProps) {
   const progress = resolveProgress(card);
   const value = formatMetricValue(card.value);
+  const metricIndex = index ? String(index).padStart(2, "0") : undefined;
 
   return (
     <article
       className="telemetry-card"
       data-severity={card.severity}
       data-model-id={card.id}
+      data-metric-index={metricIndex}
     >
       <header>
+        <div>
+          {metricIndex ? (
+            <span className="telemetry-card__index">{metricIndex}</span>
+          ) : null}
+          <h3>{card.label}</h3>
+        </div>
         {card.icon ? <IconGlyph name={card.icon} size="sm" /> : null}
-        <h3>{card.label}</h3>
       </header>
       <strong>{value}</strong>
       {progress !== null ? (
@@ -36,7 +44,7 @@ export function TelemetryCard({ card }: TelemetryCardProps) {
         />
       ) : null}
       {card.detail || card.description ? (
-        <p>{card.detail || card.description}</p>
+        <p className="telemetry-card__source">{card.detail || card.description}</p>
       ) : null}
     </article>
   );