Interactive elements meet minimum touch target size (44x44px)

Touch targets that are too small cause mis-taps, especially for users with larger fingers, motor impairments, or when holding a phone one-handed in motion. A 16px icon button with no padding gives an actual tap area of roughly 256 px² — 25% of the 1936 px² that WCAG 2.2 SC 2.5.8 (Target Size, Minimum) requires at 44×44px. Repeated mis-taps on close buttons, icon actions, or navigation links create genuine usability failures that drive abandonment. WCAG 2.2 SC 2.5.5 (Target Size, Enhanced, AAA) sets 44×44px; SC 2.5.8 (AA) requires 24×24px minimum with spacing — either way, 16px icons without padding fail both levels.

Add explicit size and padding to every interactive element that carries only an icon. In src/app/globals.css or a component stylesheet:

.icon-btn {
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}

In Tailwind, use w-11 h-11 flex items-center justify-center on every icon-only <button>:

<button className="w-11 h-11 flex items-center justify-center rounded-md">
  <XIcon className="w-5 h-5" aria-hidden="true" />
  <span className="sr-only">Close</span>
</button>

For navigation links, block py-3 px-4 gives sufficient tap area without visual change.