/* task-71, reworked in task-112 (PCG-UI v1). The dark theme is the library's own (<html data-pcg-theme>), so this file
   no longer repeats any colour per theme. The live numbers are one quiet row on the panel (no boxed tiles, no dots, no
   coloured edges) and the stages are the library ProcessLine (.pcg-process); the «fleet» scene is gone (Badr). */

/* ============ live numbers + the stages (public/assets/js/live-counters.js) ============ */
.pcg-root .live-board { display: grid; gap: var(--pcg-space-4); margin-block: var(--pcg-space-6); padding: var(--pcg-space-6); background: var(--pcg-panel); border: 1px solid var(--pcg-separator); border-radius: var(--pcg-radius-panel); }
.pcg-root .live-board.compact { margin-block: var(--pcg-space-4); padding: var(--pcg-space-4); }
.pcg-root .live-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; }
.pcg-root .live-stat { display: grid; gap: 2px; align-content: start; min-width: 0; padding-inline: var(--pcg-space-4); border-inline-start: 1px solid var(--pcg-separator); }
.pcg-root .live-stat:first-child { padding-inline-start: 0; border-inline-start: 0; }
.pcg-root .live-stat dd { margin: 0; font: 500 clamp(24px, 2.6vw, 34px)/1.15 var(--pcg-font-latin); font-variant-numeric: tabular-nums; color: var(--pcg-ink); direction: ltr; text-align: start; unicode-bidi: isolate; white-space: nowrap; overflow: hidden; }
.pcg-root .live-stat dt { font-size: 13px; line-height: 20px; color: var(--pcg-muted); }
.pcg-root .live-est { font-size: 12px; color: var(--pcg-muted); }
/* ProcessLine: the library's .pcg-process (svg line on top, the steps under it); the line = the share of stages done */
.pcg-root .live-steps svg line { stroke-width: 4; }
.pcg-root .live-steps .pl-track { stroke: var(--pcg-separator); }
.pcg-root .live-steps .pl-fill { stroke: var(--pcg-red); }
.pcg-root .live-steps ol { margin: 0; flex-wrap: wrap; }
.pcg-root .live-steps .pl-step { display: grid; gap: 0; min-width: 0; flex: 1 1 0; font-size: 13px; line-height: 20px; }
.pcg-root .live-steps .pl-nm { color: var(--pcg-muted); overflow-wrap: anywhere; }
.pcg-root .live-steps .pl-st { color: var(--pcg-muted); font-size: 12px; }
.pcg-root .live-steps .pl-step[data-st="run"] .pl-nm, .pcg-root .live-steps .pl-step[data-st="done"] .pl-nm { color: var(--pcg-ink); font-weight: 700; }
.pcg-root .live-steps .pl-step[data-st="run"] .pl-st { color: var(--pcg-ink); }
.pcg-root .live-steps .pl-step[data-st="fail"] .pl-st { color: var(--pcg-error); }
@media (max-width: 720px) {
  .pcg-root .live-board { padding: var(--pcg-space-4); margin-block: var(--pcg-space-4); }
  .pcg-root .live-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: var(--pcg-space-3); }
  .pcg-root .live-stat:nth-child(odd) { padding-inline-start: 0; border-inline-start: 0; }
  .pcg-root .live-steps ol { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--pcg-space-2) var(--pcg-space-3); }
}

/* ============ spacing: the library scale on the shared shells ============ */
.pcg-root .appbar-in { gap: var(--pcg-space-3); }
.pcg-root .appbar .nav { gap: var(--pcg-space-2); align-items: center; }
@media (max-width: 720px) {
  .pcg-root .appbar-in { gap: var(--pcg-space-2); }
}

/* pcg-app.css resets `.pcg-root p { margin: 0 }` (specificity 0,1,1), which silently cancelled 21 paragraph margins the
   screens set with one class (0,1,0): the empty note flush under the canvas buttons, the approve bar, the flash, the
   wait line... They come back here, rounded onto the library scale. */
.pcg-root p.crumb, .pcg-root p.brief-line { margin-block-end: var(--pcg-space-2); }
.pcg-root p.dash-meta, .pcg-root p.flash, .pcg-root p.verdict, .pcg-root p.wait-line { margin-block-end: var(--pcg-space-4); }
.pcg-root p.now-step { margin-block: 0 var(--pcg-space-6); }
.pcg-root p.vd-prov { margin-block-end: var(--pcg-space-6); }
.pcg-root p.confirm, .pcg-root p.src { margin-block-start: var(--pcg-space-1); }
.pcg-root p.cv-agents, .pcg-root p.vd-note-row, .pcg-root p.row-act { margin-block-start: var(--pcg-space-2); }
.pcg-root p.pv-foot { margin-block-start: var(--pcg-space-3); }
.pcg-root p.home-foot, .pcg-root p.mt4, .pcg-root p.retrying { margin-block-start: var(--pcg-space-4); }
.pcg-root p.approve-bar, .pcg-root p.first-hint, .pcg-root p.save-row { margin-block-start: var(--pcg-space-6); }
.pcg-root p.cv-none { margin-block-start: var(--pcg-space-6); }