/* Processing steps. Split unchanged from the T-201 demo index.html. */
/* ---------- processing ---------- */
.proc{width:920px;padding:20px 30px}
.proc-head{display:flex;align-items:baseline;gap:12px;margin-bottom:4px}
.proc-head h1{font-size:21px;margin:0}
.elapsed{margin-left:auto;color:var(--muted);font-variant-numeric:tabular-nums}
.steps{list-style:none;margin:10px 0 0;padding:0}
.step{display:grid;grid-template-columns:28px 1fr auto;gap:2px 12px;padding:9px 0;border-top:1px solid var(--soft)}
.step:first-child{border-top:0}
.ico{width:22px;height:22px;border-radius:50%;border:2px solid #c9d0d6;margin-top:1px;display:flex;align-items:center;justify-content:center}
.step.running .ico{border-color:var(--accent);border-right-color:transparent;animation:spin .8s linear infinite}
.step.done .ico,.step.standin .ico{border-color:var(--accent);background:var(--accent)}
.step.standin .ico{border-color:#d08a3c;background:#d08a3c}
.step.skipped .ico,.step.none .ico{border-color:#b9c1c8;background:#b9c1c8}
.step.error .ico{border-color:#a1261b;background:#a1261b}
@keyframes spin{to{transform:rotate(360deg)}}
.lbl{font-weight:600}
.step.pending .lbl{color:var(--muted)}
.secs{color:var(--muted);font-variant-numeric:tabular-nums;font-size:13.5px}
.det{grid-column:2 / 4;color:var(--muted);font-size:13.5px;font-variant-numeric:tabular-nums}
.step.running .det{color:var(--accent)}
.tag{display:inline-block;font-size:11.5px;font-weight:650;letter-spacing:.3px;text-transform:uppercase;background:var(--stand-bg);color:var(--stand-ink);border-radius:6px;padding:1px 7px;margin-left:8px;vertical-align:1px}
.standin-why{grid-column:2 / 4;font-size:12.5px;color:var(--stand-ink)}
.deleted{margin-top:12px;background:var(--ok-bg);border:1px solid var(--ok-line);color:var(--ok-ink);border-radius:12px;padding:14px 16px;display:flex;gap:12px;align-items:flex-start}
.deleted b{display:block;font-size:16px;margin-bottom:2px}
.deleted .sub{font-size:13.5px}
.proc .actions{margin-top:12px}