Every table reads on a phone. A table wider than the box it sits in turns each of its rows into a card
(`data-stacked` on the table, painted by `controls::table-stack`): nobody scrolls sideways to find which
column a number belongs to.
Css cannot look up the header a cell sits under, so this writes it on every body cell:
data-label the whole header path, "Semaine 40 · 2026" -- the label the card shows next to the value
data-group-start on every cell, header ones included, that opens a column group (a header spanning
several columns): the line between two groups
and, when every group repeats the same headers (a period x year grid), `data-matrix` on the table,
`--table-matrix` the size of a group, `data-group` ("Semaine 40") on the first cell of each group,
`data-leaf` ("2026") on the cells of the first group and `data-lead` on the cells outside any group: the card
is then a small table of its own, one line per group.
A `data-label` written by the page wins over the header's. A table opts out with `class="no-stack"` or
`data-stack="off"`, as does a layout table (`role="presentation"`). With `data-stack="small"` it only turns
into cards on a phone or a tablet (`MMO.window.device`): on a desktop it stays a table, its box scrolls.
The document is watched from the start; an element watches its own shadow root.