One-line: rows of comparable records — bookings, members, invoices.

```jsx
<Table variant="card">
  <TableHeader><TableRow><TableHead>Name</TableHead><TableHead>Status</TableHead></TableRow></TableHeader>
  <TableBody><TableRow><TableCell>Rick</TableCell><TableCell><Badge variant="success">Active</Badge></TableCell></TableRow></TableBody>
</Table>
```

Mark the selected row with \`data-state="selected"\`. Cells are \`white-space: nowrap\` by design; wrap long text yourself.
