Hairline list row for roadmaps and backer lists: index numeral, bold display title, detail string, right-aligned status.

```jsx
<div style={{ borderTop: "1px solid var(--border-hairline)" }}>
  <NumberedRow index="01" title="Ground prototype" detail="Pipeline validated" status="Done" state="done" />
  <NumberedRow index="02" title="EdisonSat-1" detail="Pathfinder proves the pipeline on orbit" status="In progress" state="active" />
</div>
```

`state="active"` adds a vermilion dot and colours the status. Stack rows inside a top-bordered container so the hairlines read as one table.
