#32037922 A4A: Add preview referral email modal

This PR is built on top of #108738

Fixes https://linear.app/a8c/issue/A4A-2122/implement-preview-referral-email
Fixes https://linear.app/a8c/issue/A4A-2094/data-and-reporting-referral-tracking

Proposed Changes

• Add a Preview referral email button on the request-client-payment checkout that opens a modal showing how the referral email will look with the current message, products, term pricing, and selected logo.
• ReferralEmailPreviewModal – Renders the preview HTML (from the backend preview endpoint) in an iframe with injected styles so it matches the email client appearance; supports optional logo, client message, and product list.
• Referral email preview (mobile) – Preview is responsive on narrow viewports: wrapper uses 100% width with max 600px; viewport meta and formula-based scale (100vw / 600px) so the 600px email fits; iframe height is scaled to match visible content and avoid extra scrollbar.
• useReferralEmailPreview – TanStack Query hook that fetches preview HTML from the agency referral preview API (product IDs, greeting line, logo URL, term pricing).
• logo-url-utils – getLogoUrlForPreview() and convertBlobToDataUrl() so the preview can show the selected logo (including blob URLs from a newly chosen file) without uploading first.
• Checkout styles updated for the preview modal and any layout tweaks.
• Event tracking – Tracks events in the referral checkout flow: “Preview referral email” click; logo option change (profile / different / none); successful logo file select in upload.
• AGENTS.md – Add an “Analytics and tracking” section with instructions to add Tracks events for new user-facing actions using recordTracksEvent and the calypso_a4a_* prefix.

Why are these changes being made?

• Agencies need to see how the referral email will look (logo, message, products) before sending or copying the link, so they can correct the copy or logo without sending multiple emails.
• The preview is backed by the same API that generates the real email, so layout and content stay in sync; the modal is a thin client that displays the returned HTML.

Testing Instructions

• Patch 204479-ghe-Automattic/wpcom
• Sandbox wordpress.com
• Open A4A > Marketplace > enable referral mode > add products > go to checkout.
• Confirm a Preview referral email link is shown as displayed below

• Click it: a modal opens with the current client message, products, term pricing, and the currently selected logo (profile, custom, or none).
• Change the logo option or upload a different logo, then preview again – the modal should show the updated logo (blob URLs are converted to data URLs for preview).
• Change the client message and/or cart, then preview again – content in the modal should match.
• Close the modal and send or copy the referral link; behavior should match PR #108738 (no regression).
• On mobile or narrow viewport (e.g. 320px–600px), the email preview should scale to fit with no clipped content and no extra scrollbar.

Mobile view:

Pre-merge Checklist

• Has the general commit checklist been followed? (PCYsg-hS-p2)
• Have you written new tests for your changes?
• Have you tested the feature in Simple (P9HQHe-k8-p2), Atomic (P9HQHe-jW-p2), and self-hosted Jetpack sites (PCYsg-g6b-p2)?
• Have you checked for TypeScript, React or other console errors?
• Have you tested accessibility for your changes? Ensure the feature remains usable with various user agents (e.g., browsers), interfaces (e.g., keyboard navigation), and assistive technologies (e.g., screen readers) (PCYsg-S3g-p2).
• Have you used memoizing on expensive computations? More info in Memoizing with create-selector and Using memoizing selectors and Our Approach to Data
• Have we added the “[Status] String Freeze” label as soon as any new strings were ready for translation (p4TIVU-5Jq-p2)?
  • For UI changes, have we tested the change in various languages (for example, ES, PT, FR, or DE)? The length of text and words vary significantly between languages.
• For changes affecting Jetpack: Have we added the “[Status] Needs Privacy Updates” label if this pull request changes what data or activity we track or use (p4TIVU-aUh-p2)?