#workflow-progress { margin: 0 0 24px; scroll-margin-top: 116px; min-width: 0; }
#workflow-progress[hidden] { display: none; }
#job-progress-slot { margin-top: 20px; }
#workflow-progress .production-progress { padding: 20px; border: 1px solid var(--platinum-300, #d0c8bb); border-radius: 7px; background: linear-gradient(145deg, #faf9f6, #f5efe5); }
#workflow-progress .production-progress-heading { display: flex; gap: 14px; justify-content: space-between; align-items: baseline; font-size: 13px; }
#workflow-progress .progress-state { color: var(--muted, #696760); font-size: 11px; text-align: right; }
#workflow-progress .production-stages { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; list-style: none; padding: 0; margin: 20px 0; }
#workflow-progress .production-stages li { padding: 9px 2px 0; border-top: 4px solid #ded9cf; color: #77736b; font-size: 11px; overflow-wrap: anywhere; }
#workflow-progress .production-stages .done { border-color: #498765; color: #36654b; }
#workflow-progress .production-stages .current { border-color: #f5662a; color: #b33e0b; font-weight: 700; }
#workflow-progress .stage-activity { width: 100%; height: 7px; accent-color: #ed632c; display: block; margin: 10px 0 16px; }
#workflow-progress .scene-progress-count { font-size: 12px; margin: 0; }
#workflow-progress .production-clock { display: flex; align-items: center; justify-content: space-between; gap: 16px; font-size: 12px; }
#workflow-progress .production-elapsed { font-size: 22px; font-variant-numeric: tabular-nums; flex-shrink: 0; }
#workflow-progress .production-progress-note { font-size: 11px; line-height: 1.6; color: #6d675e; margin: 10px 0 0; }
body[data-studio-layout="mobile"] #workflow-progress { scroll-margin-top: 160px; }
body[data-studio-layout="mobile"] #workflow-progress .production-progress { padding: 14px; }
body[data-studio-layout="mobile"] #workflow-progress .production-stages { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 12px; }
@media (max-width: 600px) {
  #workflow-progress { scroll-margin-top: 150px; }
  #workflow-progress .production-progress { padding: 14px; }
  #workflow-progress .production-stages { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 12px; }
}