polish Semi UI query workspaces

vehicle-data-platform/apps/web/src/v2/styles/workspace.css

@@ -435,6 +435,30 @@
   white-space: nowrap;
 }
 
+.v2-workspace-panel-meta > .semi-tag,
+.v2-workspace-result-meta > .semi-tag {
+  min-height: 24px;
+  margin: 0;
+  border-radius: 999px;
+  padding-inline: 8px;
+  font-size: 10px;
+  font-variant-numeric: tabular-nums;
+  font-weight: 650;
+}
+
+.v2-workspace-result-meta {
+  display: inline-flex;
+  min-width: 0;
+  align-items: center;
+  gap: 7px;
+}
+
+.v2-workspace-result-meta > span {
+  color: #748398;
+  font-size: 10px;
+  font-variant-numeric: tabular-nums;
+}
+
 .v2-workspace-panel-actions > .semi-button {
   min-height: 34px;
   border-radius: 8px;
@@ -521,6 +545,10 @@
     padding: 7px 10px 6px;
   }
   .v2-workspace-panel-header.is-inverted > .v2-workspace-panel-copy > h5.semi-typography { font-size: 13px; }
+
+  .v2-workspace-result-meta > span {
+    display: none;
+  }
 }
 
 /*
@@ -3721,9 +3749,11 @@
 
 .v2-workspace-filter-copy > .semi-typography:first-child {
   flex: 0 0 auto;
+  margin: 0;
   color: #30445d;
   font-size: 12px;
   font-weight: 700;
+  line-height: 1.3;
 }
 
 .v2-workspace-filter-copy > .semi-typography:last-child {
@@ -3744,6 +3774,51 @@
   font-weight: 650;
 }
 
+.v2-mileage-query-panel.v2-workspace-filter-panel.semi-card {
+  border-radius: 12px;
+}
+
+.v2-mileage-query-panel .v2-workspace-filter-heading {
+  min-height: 42px;
+}
+
+@media (min-width: 681px) and (max-width: 1050px) {
+  .v2-mileage-query-panel .v2-mileage-filter {
+    min-height: 0;
+    grid-template-columns: minmax(200px, 1.35fr) repeat(2, minmax(112px, .72fr)) auto;
+    grid-template-areas:
+      "vehicle start end submit"
+      "source ranges ranges ranges";
+    align-items: end;
+  }
+
+  .v2-mileage-query-panel .v2-mileage-vehicle-field {
+    grid-area: vehicle;
+  }
+
+  .v2-mileage-query-panel .v2-mileage-filter > label:nth-of-type(2) {
+    grid-area: start;
+  }
+
+  .v2-mileage-query-panel .v2-mileage-filter > label:nth-of-type(3) {
+    grid-area: end;
+  }
+
+  .v2-mileage-query-panel .v2-mileage-filter > .v2-primary-button {
+    grid-area: submit;
+    width: auto;
+    margin-top: 0;
+  }
+
+  .v2-mileage-query-panel .v2-mileage-source-strategy {
+    grid-area: source;
+  }
+
+  .v2-mileage-query-panel .v2-mileage-ranges {
+    grid-area: ranges;
+  }
+}
+
 .v2-table-pagination.semi-page {
   min-width: 0;
   color: #607086;
@@ -3802,6 +3877,10 @@
     border-radius: 11px;
   }
 
+  .v2-mileage-query-panel.v2-workspace-filter-panel.semi-card {
+    border-radius: 11px;
+  }
+
   .v2-table-pagination-controls {
     justify-content: space-between;
   }