/* ═════════════════════════════════════════════════════════════════
   16 px MINIMUM ON TOUCH CONTROLS — the LAST stylesheet of the page, on purpose
   ─────────────────────────────────────────────────────────────────
   ⛔ Not a design decision: iOS imposes it. When a control whose text is
   smaller than 16 px gets focus, WebKit ZOOMS the page "to help reading"
   and does NOT zoom back: the app ends up wider than the screen and the
   fields stick out on the right (seen on the iPhone on 2026-08-06). The
   viewport tag can't turn it off — Safari ignores `maximum-scale` since
   iOS 10 —, so the only cure is a 16 px control.
   Chrome never zooms, so on Android this is just a touch control with
   slightly larger text.

   ⚠️ It wins BY ORDER over the class rules that go below 16 (.textarea at
   13, .date-input at 14…): same specificity, so the later one applies.
   That's why it lives in its OWN sheet, loaded after every other one
   (`index.html`, right after `css/cv-badges.css`). Until 2026-09-29 it
   lived «at the end of main.css»; splitting main.css into 29 sheets left
   it in the middle, with nine sheets loaded after it, and nothing said so.
   `tests/unit-ios-16px-ultima-hoja.test.js` keeps it the last one.

   An INLINE style still beats this: the ones that are big on purpose
   (scoreboard, amounts, categories) are left alone, and above 16 px
   there is no zoom anyway.
   ═════════════════════════════════════════════════════════════════ */
@media (pointer: coarse) {
  input:not(.score-input),
  textarea,
  select,
  .input:not(.score-input),
  .textarea,
  .select,
  .date-input,
  .support-input {
    font-size: 16px;
  }
}