Add dataset bench and validation agents

frontend/src/styles.css

@@ -32,6 +32,11 @@ button, textarea, select {
   font: inherit;
 }
 
+input {
+  font: inherit;
+  color: var(--ink);
+}
+
 button {
   border: 0;
   color: inherit;
@@ -154,6 +159,10 @@ h2 {
   font-weight: 700;
 }
 
+.primary.secondary {
+  background: var(--cyan);
+}
+
 .primary:disabled, .iconButton:disabled {
   opacity: 0.5;
   cursor: not-allowed;
@@ -283,6 +292,159 @@ textarea {
   font-size: 13px;
 }
 
+.field.compact {
+  margin-top: 0;
+}
+
+.field input {
+  height: 38px;
+  padding: 0 10px;
+  border-radius: 6px;
+  border: 1px solid var(--line);
+  background: var(--field);
+}
+
+.datasetForm {
+  display: grid;
+  gap: 12px;
+}
+
+.segmented {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  gap: 6px;
+  padding: 4px;
+  border: 1px solid var(--line);
+  background: #101310;
+  border-radius: 7px;
+}
+
+.segmented button {
+  height: 34px;
+  border-radius: 5px;
+  background: transparent;
+  color: var(--muted);
+}
+
+.segmented button.active {
+  background: var(--green);
+  color: #0b0d0b;
+  font-weight: 760;
+}
+
+.drop {
+  min-height: 118px;
+  display: grid;
+  place-items: center;
+  gap: 8px;
+  position: relative;
+  border: 1px dashed #526052;
+  border-radius: 8px;
+  background: rgba(13, 16, 13, 0.8);
+  color: var(--muted);
+  text-align: center;
+  overflow: hidden;
+}
+
+.drop input {
+  position: absolute;
+  inset: 0;
+  opacity: 0;
+  cursor: pointer;
+}
+
+.buttonRow {
+  display: flex;
+  gap: 10px;
+}
+
+.opGrid {
+  display: grid;
+  grid-template-columns: repeat(4, minmax(0, 1fr));
+  gap: 8px;
+}
+
+.opGrid button {
+  min-width: 0;
+  height: 42px;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: 6px;
+  padding: 0 8px;
+  border-radius: 6px;
+  border: 1px solid var(--line);
+  background: #101310;
+  color: var(--muted);
+  font-size: 12px;
+}
+
+.opGrid button:hover {
+  color: var(--ink);
+  border-color: var(--green);
+}
+
+.opGrid span {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.datasetList {
+  display: grid;
+  gap: 10px;
+  max-height: 420px;
+  overflow: auto;
+}
+
+.datasetCard {
+  padding: 12px;
+  border: 1px solid var(--line);
+  border-radius: 7px;
+  background: #101310;
+}
+
+.datasetCardHead {
+  display: flex;
+  justify-content: space-between;
+  gap: 12px;
+  margin-bottom: 10px;
+}
+
+.datasetCardHead span {
+  color: var(--muted);
+  font-size: 12px;
+}
+
+.sampleStrip {
+  display: grid;
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+  gap: 8px;
+}
+
+.sampleStrip a {
+  min-width: 0;
+  padding: 8px;
+  border-radius: 5px;
+  border: 1px solid var(--line);
+  text-decoration: none;
+  color: var(--ink);
+  background: #0b0d0b;
+}
+
+.sampleStrip span,
+.sampleStrip small {
+  display: block;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.sampleStrip span {
+  color: var(--green);
+  font-size: 11px;
+}
+
 .jobList, .resultList {
   display: grid;
   gap: 8px;
@@ -382,11 +544,53 @@ meter {
   border-color: var(--green);
 }
 
+.resultList.tight {
+  max-height: 290px;
+}
+
+.insight {
+  min-height: 350px;
+}
+
+.previewGrid {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  gap: 10px;
+}
+
+.previewGrid a {
+  min-width: 0;
+  border: 1px solid var(--line);
+  border-radius: 7px;
+  overflow: hidden;
+  color: var(--ink);
+  text-decoration: none;
+  background: #0b0d0b;
+}
+
+.previewGrid img {
+  display: block;
+  width: 100%;
+  aspect-ratio: 16 / 10;
+  object-fit: cover;
+  background: #060806;
+}
+
+.previewGrid span {
+  display: block;
+  padding: 8px;
+  color: var(--muted);
+  font-size: 12px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
 @media (max-width: 1180px) {
   body { min-width: 960px; }
   .shell { grid-template-columns: 220px 1fr; }
   .taskColumns { grid-template-columns: repeat(3, minmax(0, 1fr)); }
+  .opGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
   .grid.three { grid-template-columns: 1fr; }
   .grid.two { grid-template-columns: 1fr; }
 }
-