Mobile Preview · 375px

The app on a phone.

Every dashboard, CPT table, and modal collapses to a single-column layout at 375px. The topbar nav becomes a horizontal scroll strip. Tap targets stay 44px+. Below is the live audit dashboard rendered inside a 375px frame. Drag your viewport narrower to see the real responsive behavior.

Mobile design rules

Topbar wraps under brand row

Nav becomes a horizontal-scroll strip below the brand. Sign-out button stays right-aligned. Suite switcher hides under 560px.

Tap targets at 44px minimum

Every button, nav link, and form input has min-height: 44px enforced via CSS. Focus rings persist for keyboard nav.

Stat cards stack vertically

Three-column grid collapses to single column under 880px. Each card keeps the full label + value + source line.

CPT/Payer tables hide secondary columns

Under 880px we keep CPT code, description, this-practice rate, peer p50. Secondary columns (CMS, peer-n, band detail) hide and re-appear on tap.

Banner adapts to two lines

The read-only audit banner wraps to a second line on narrow screens. The persona selector centers below the message text.

Audit Map floats above content

The floating "Audit Map" button shifts to bottom: 16px on phones and the panel becomes full-width with 12px side margins.

PDF report preview scales

The white-paper PDF preview keeps its readability. Header drops from 28px to 22px, side padding from 56px to 22px, but body text stays at 14px.

Want to test it for real? Open /audit-full-demo/dashboard?persona=7 directly on a phone, or use Chrome DevTools → Toggle device toolbar → iPhone 15 Pro (390x844). Every screen has been verified at 375px and 414px.