Show dataset YOLO output readiness

frontend/src/styles.css

@@ -761,6 +761,16 @@ textarea {
   background: #0b0d0b;
 }
 
+.datasetOutputBox {
+  display: grid;
+  gap: 10px;
+  margin-top: 12px;
+  padding: 12px;
+  border: 1px solid var(--line);
+  border-radius: 7px;
+  background: #0b0d0b;
+}
+
 .qualityHead {
   display: flex;
   justify-content: space-between;
@@ -817,6 +827,65 @@ textarea {
   border-color: rgba(240, 113, 103, 0.55);
 }
 
+.datasetOutputLinks {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  gap: 8px;
+}
+
+.datasetOutputLinks a {
+  min-width: 0;
+  display: grid;
+  grid-template-columns: minmax(0, 1fr) auto;
+  gap: 8px;
+  padding: 8px;
+  border-radius: 6px;
+  border: 1px solid var(--line);
+  background: #101310;
+  color: var(--ink);
+  text-decoration: none;
+}
+
+.datasetOutputLinks span,
+.datasetOutputLinks small {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.datasetOutputPreview {
+  display: grid;
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+  gap: 8px;
+}
+
+.datasetOutputPreview a {
+  min-width: 0;
+  overflow: hidden;
+  border-radius: 6px;
+  border: 1px solid var(--line);
+  background: #101310;
+  color: var(--muted);
+  text-decoration: none;
+}
+
+.datasetOutputPreview img {
+  display: block;
+  width: 100%;
+  aspect-ratio: 1.35 / 1;
+  object-fit: cover;
+  background: #060806;
+}
+
+.datasetOutputPreview span {
+  display: block;
+  padding: 6px;
+  font-size: 11px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
 .jobList, .resultList {
   display: grid;
   gap: 8px;
@@ -1201,6 +1270,8 @@ meter {
 
   .opGrid,
   .sampleStrip,
+  .datasetOutputLinks,
+  .datasetOutputPreview,
   .taskCheckList,
   .agentCheckList,
   .qualityStats,