
.page-head { display: flex; flex-direction: column; gap: 10px; padding: 20px 4px 0; }
.leg { display: grid; grid-template-columns: 28px minmax(0,1fr) auto; gap: 12px; align-items: center; padding: 16px 0; border-top: 1px solid var(--c-line); }
.leg:first-child { border-top: 0; padding-top: 4px; }
.leg__n { width: 28px; height: 28px; border-radius: 14px; background: var(--c-accent-soft); color: var(--c-accent-text); font-size: 13px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.leg__p { text-align: right; }
.funnel { display: flex; flex-direction: column; gap: 12px; }
.funnel__row { display: grid; grid-template-columns: 112px minmax(0,1fr) 48px; gap: 12px; align-items: center; }
.funnel__bar { height: 10px; border-radius: 5px; background: var(--c-track); }
.funnel__bar span { display: block; height: 100%; border-radius: 5px; background: var(--c-prob-1); }
.funnel__row.is-total .funnel__bar span { background: var(--c-accent); }
.dots { display: grid; grid-template-columns: repeat(20, minmax(0,1fr)); gap: 5px; }
.dots i { aspect-ratio: 1; border-radius: 50%; background: var(--c-track); }
.dots i.on { background: var(--c-accent); }
@media (min-width: 1024px) { .page-head { padding: 0; max-width: 720px; } }
