/* The milestone list behind the chart page's version button (TP-569, public/chart-milestones; built without a design:
   POC), on the popup look of public/chart-fields (chart-popup). A green chip on the step that runs on test or live. */
.chart-milestones-popup { width: min(560px, 94vw); max-height: 80vh; display: flex; flex-direction: column; padding: 16px 18px; }
.chart-milestones-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.chart-milestones { list-style: none; margin: 10px 0 0; padding: 0; overflow: auto; }
.chart-milestone-row { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; width: 100%; padding: 8px 10px; border: 0; border-radius: 8px; background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.chart-milestone-row:hover { background: var(--bg); }
.chart-milestone-row.on { background: var(--advice-soft); }
.chart-milestone-n { font-weight: 600; }
.chart-milestone-run { padding: 1px 8px; border-radius: 999px; border: 1px solid var(--advice); background: var(--advice-soft); color: var(--advice); font-size: 0.8rem; font-weight: 600; }
.chart-milestone-at { margin-left: auto; }
.chart-milestone-release, .chart-milestone-stamps { flex-basis: 100%; }
.chart-milestones-none { margin-top: 10px; }
.chart-milestones-none p { margin: 0 0 4px; }