vibespot 0.9.4 → 1.0.0

package/ui/styles.css

@@ -840,21 +840,31 @@ body { display: flex; }
   color: var(--success);
 }
 
-.brand-asset-view {
-  font-size: 11px;
-  padding: 2px 6px;
-  margin-left: 4px;
+.brand-asset-row {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+}
+.brand-asset-actions {
+  display: flex;
+  gap: 2px;
+}
+.brand-asset-action {
   background: none;
   border: none;
-  color: var(--accent);
+  color: var(--text-muted);
   cursor: pointer;
-  text-decoration: underline;
-  text-underline-offset: 2px;
-  opacity: 0.7;
-  transition: opacity 0.15s ease;
+  font-size: 14px;
+  padding: 2px 4px;
+  border-radius: var(--radius-sm);
+  transition: color 0.15s, background 0.15s;
 }
-.brand-asset-view:hover {
-  opacity: 1;
+.brand-asset-action:hover {
+  color: var(--accent);
+  background: var(--bg-hover);
+}
+.brand-asset-action--delete:hover {
+  color: var(--error);
 }
 
 .brand-asset-upload__label {
@@ -2080,6 +2090,128 @@ body { display: flex; }
   flex-shrink: 0;
 }
 
+/* Agentic pipeline step progress */
+.pipeline-steps {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  padding: 4px 0;
+}
+
+.pipeline-step {
+  display: flex;
+  align-items: flex-start;
+  gap: 6px;
+  font-size: 13px;
+  color: var(--text-muted);
+  flex-wrap: wrap;
+}
+
+.pipeline-step--active {
+  color: var(--accent);
+  font-weight: 500;
+}
+
+.pipeline-step--active .pipeline-step__icon {
+  animation: spin 0.8s linear infinite;
+  display: inline-block;
+}
+
+.pipeline-step--done {
+  color: var(--success, #4ade80);
+}
+
+.pipeline-step--done .pipeline-step__icon {
+  animation: none;
+  font-size: 0;
+}
+
+.pipeline-step--done .pipeline-step__icon::after {
+  content: "✓";
+  font-size: 13px;
+}
+
+.pipeline-step__decision {
+  width: 100%;
+  font-size: 11.5px;
+  color: var(--text-dim);
+  padding-left: 20px;
+  margin-top: 2px;
+  white-space: pre-line;
+}
+
+/* Module progress cards during parallel generation */
+.pipeline-modules {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 6px;
+  padding: 6px 0 2px;
+}
+
+.pipeline-module-card {
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  padding: 3px 8px;
+  border-radius: 4px;
+  font-size: 12px;
+  background: var(--surface-elevated, rgba(255,255,255,0.05));
+  border: 1px solid var(--border);
+}
+
+.pipeline-module-card--generating {
+  border-color: var(--accent);
+  color: var(--accent);
+}
+
+.pipeline-module-card--complete {
+  border-color: var(--success, #4ade80);
+  color: var(--success, #4ade80);
+}
+
+.pipeline-module-card--failed {
+  border-color: var(--error, #ef4444);
+  color: var(--error, #ef4444);
+}
+
+.pipeline-module-card--retrying {
+  border-color: var(--warning, #f59e0b);
+  color: var(--warning, #f59e0b);
+}
+
+.pipeline-module-card__name {
+  font-weight: 500;
+}
+
+.pipeline-module-card__status {
+  font-size: 11px;
+  opacity: 0.8;
+}
+
+.pipeline-stats {
+  font-size: 12px;
+  color: var(--success, #4ade80);
+  padding: 6px 0 2px;
+  font-weight: 500;
+}
+
+.pipeline-stats--partial {
+  color: var(--warning, #f59e0b);
+}
+
+.pipeline-timer {
+  font-size: 12px;
+  color: var(--text-muted, #999);
+  padding: 6px 0 0;
+}
+
+.pipeline-modules-restored {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 6px;
+  padding: 6px 0;
+}
+
 .chat-msg__meta {
   font-size: 11px;
   color: var(--text-dim);