/* Runs & loads: the live pipeline's queue list and stage matrix, and the load page's
   dataset drawer steps. Shared patterns (sections, tiles, tables, KPI tiles) live in app.css. */
.rl-list { list-style: none; margin: 0; padding: 0; }
.rl-list li { display: flex; flex-direction: column; gap: 2px; padding: 10px var(--pad-x); border-bottom: 1px solid var(--border-subtle); }
.rl-list li:last-child { border-bottom: 0; }
.rl-list li b { font-weight: 600; }
.rl-list li > span { font-size: 12px; color: var(--fg-2); }
/* load page */
.ld-kpis { --n: 3; }
.ld-detail { padding: 12px var(--pad-x); display: flex; flex-direction: column; gap: 12px; font-size: var(--text-sm); }
.ld-name { font-size: 16px; font-weight: 600; }
.ld-dl { display: grid; grid-template-columns: 160px minmax(0, 1fr); gap: 8px 16px; margin: 0; }
.ld-dl dt { color: var(--fg-3); }
.ld-dl dd { margin: 0; color: var(--fg-1); }
.ld-steps { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--border-subtle); }
.ld-steps li { display: flex; gap: 10px; padding: 8px 0; }
.ld-steps .ic { padding-top: 2px; display: inline-flex; }
.ld-steps b { font-weight: 600; }
.ld-detail details.more > summary { padding-inline: 0; }
.ld-detail details.more .kv { padding-inline: 0; }
.wb-table tr[data-sel] td { background: var(--selection-bg); }
.wb-table tr[data-sel] td:first-child { box-shadow: inset 2px 0 0 var(--fg-1); }

/* Datasets by stage: one row per dataset, one column per step */
#rlBanner:empty, #rlMap:empty { display: none; }
.rm th { vertical-align: bottom; }
.rm-h { display: block; }
.rm-hs { display: block; font-weight: 400; text-transform: none; letter-spacing: 0; color: var(--fg-3); font-size: var(--text-2xs, 11px); margin-top: 2px; white-space: nowrap; }
.rm td { vertical-align: middle; }
.rm-ds { display: block; text-align: start; font-weight: 500; }
.rm-view { display: block; font-family: var(--font-mono); font-size: 11px; color: var(--fg-3); margin-top: 2px; }
.rm-c { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--fg-2); white-space: nowrap; }
.rm-c[data-s="wait"], .rm-c[data-s="skip"] { color: var(--fg-3); }
.rm-c[data-s="bad"] { color: var(--critical-fg); }
.rm-c[data-s="stop"] { color: var(--medium-fg); }
.rm-c[data-s="run"] > span:first-child { animation: fmSpinIc 1.4s linear infinite; }
@keyframes fmSpinIc { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .rm-c[data-s="run"] > span:first-child { animation: none; } }
.rm-d { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 12px; color: var(--fg-2); white-space: nowrap; }
