++ fix

app/static/style.css

@@ -264,6 +264,66 @@ body {
   50%       { opacity: 0.4; transform: scale(0.75); }
 }
 
+.progress-track {
+  height: 6px;
+  border-radius: 99px;
+  background: rgba(255, 255, 255, 0.1);
+  overflow: hidden;
+}
+
+.progress-fill {
+  height: 100%;
+  border-radius: 99px;
+  background: linear-gradient(90deg, var(--ok), #4de8dd);
+  transition: width 0.4s ease;
+  min-width: 4px;
+}
+
+.progress-phase {
+  color: #ffe2a3;
+  font-size: 0.75rem;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+}
+
+.current-file-box {
+  display: flex;
+  align-items: baseline;
+  gap: 0.5rem;
+  background: rgba(0, 0, 0, 0.35);
+  border: 1px solid rgba(255, 183, 3, 0.25);
+  border-radius: 8px;
+  padding: 0.35rem 0.6rem;
+  font-size: 0.78rem;
+  overflow: hidden;
+}
+
+.current-file-label {
+  color: #ffb703;
+  font-size: 0.68rem;
+  text-transform: uppercase;
+  letter-spacing: 0.6px;
+  flex-shrink: 0;
+}
+
+.current-file-name {
+  color: #e0f7fa;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  /* scorre il nome da destra a sinistra se troppo lungo */
+  animation: marquee-file 12s linear infinite;
+  display: inline-block;
+  max-width: 100%;
+}
+
+@keyframes marquee-file {
+  0%   { transform: translateX(0); }
+  40%  { transform: translateX(0); }
+  90%  { transform: translateX(calc(-100% + 200px)); }
+  100% { transform: translateX(0); }
+}
+
 @media (max-width: 768px) {
   .hero-panel,
   .log-panel {