Steps

A 28px filled disc in surface-inverse — the same fill as the primary button, which is what ties the two together in the draft.

1. 1
   Organisers publish the event

   One link, shared wherever athletes already are.

2. 2
   Athletes rate seven categories

   Ninety seconds, on a phone, on 4G, after a race.

3. 3
   The debrief goes out the same week

   current — focus ring on the marker, aria-current="step".

4. ✓
   Done step

   Marker goes success, title drops to secondary.

markerStyle="outline" for checklists. orientation="horizontal" spreads to three columns from md. The <ol> semantics belong to the caller — Steps does not decide whether your list is ordered.