Give an unlabelled checkbox, radio or switch a 48px target

A selection control with a label is pressed anywhere along its row, but
one without — a table's "select all", a row's tick — was only its 18, 20
or 32px box, because the 40px state layer is a ::before that catches no
pointer. The box now wears the shared touch-target utility, which M3 asks
for on all three (checkbox, radio and switch specs: target size 48dp).

Plan step 13, finding IN-03.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Qwx5USif3wFFmxtHg5U1g9

resources/css/components/selection.css

@@ -19,6 +19,10 @@
  * Every state layer is on-surface when unselected and primary when selected, 8% on hover (only
  * where a pointer can hover) and 10% on focus and press; the focus indicator is the package's
  * secondary ring. A disabled control is on-surface at 38% and has no state layer.
+ *
+ * The state layer is a ::before with no pointer events, so it is not a target: a labelled control
+ * is pressed anywhere along its row, and a control with no label wears the `touch-target` utility
+ * (resources/css/tokens/state.css) so its box catches presses over M3's 48px minimum.
  */
 
 @layer components {