Base font size is at least 16px

iOS Safari auto-zooms the entire page whenever a form input with a font-size below 16px receives focus. That zoom disrupts the layout, forces users to manually zoom back out, and abandons the tap position — effectively breaking the form submission flow on iPhone for a significant share of mobile users. WCAG 2.2 SC 1.4.4 (Resize Text) requires text to be resizable without loss of content or functionality; a base font below 16px often means inputs are already too small to use comfortably before any zoom occurs. Smaller base fonts also reduce legibility on high-DPI screens where antialiasing assumptions change below the 16px threshold.

Set a 16px floor in your global stylesheet and on all form controls. In src/app/globals.css (or your equivalent base stylesheet):

html { font-size: 16px; }
input, select, textarea { font-size: 16px; }

In Tailwind, text-base maps to 1rem (16px). Never apply text-xs or text-sm directly to <input> or <select> elements — wrap a label styled small instead.

• ID: mobile-responsiveness.viewport.text-readable-mobile

• Severity: medium

• What to look for: Check global CSS for the base font size on html, body, or :root. In Tailwind, the default base font size is 16px (1rem). Check if the default has been overridden to a smaller value. Also check form input font sizes — iOS Safari auto-zooms the page when inputs have a font-size below 16px.

• Pass criteria: Before evaluating, extract and quote the exact font-size declarations on html, body, and :root selectors, plus any global input/select/textarea font-size rules. Base font size must be at least 16px (or 1rem, which defaults to 16px in all major browsers). Count all form input font-size declarations. No more than 0 form input font-size declarations may be below 16px.

• Fail criteria: Base font size is explicitly set below 16px (e.g., font-size: 14px on html or body), or at least 1 form input font-size declaration is 14px or smaller.

• Skip (N/A) when: Never.

• Detail on fail: "html element has font-size: 14px (below 16px minimum) — iOS Safari will auto-zoom the page when any text input is focused" or "2 of 5 input font-size declarations are below 16px".

• Remediation: Keep base font sizes at 16px or above:

  html { font-size: 16px; }
  
  /* For inputs specifically */
  input, select, textarea { font-size: 16px; }
  

  In Tailwind, the default text-base class sets 16px. Avoid text-xs or text-sm on inputs.