fix: qr code not rendering on iPad Safari in install modal

[ZayanKhan-12]

Description

Fixes the install modal showing no QR code on iPad (#1218).

Root cause is a two-part failure:

1. The QR <svg> from encodeQR(link, 'svg', …) carries only a viewBox — no width/height attributes — so its rendered size depends entirely on CSS.
2. The only sizing rule uses native CSS nesting:

   #sdk-mm-qrcode {
       svg { width: 50%; }
   }

   Native nesting is only supported in Safari 16.5+ (17.2 for the &-less relaxed form). Older iPad Safari drops the whole rule, leaving an SVG with no intrinsic size inside a flex container — which WebKit collapses to 0×0.

The fix un-nests the selector (works in every browser) and adds height: auto; aspect-ratio: 1 / 1 so the square QR keeps its shape. Applied to both style.css and widget-wrapper/resetStyles.css, covering both mm-install-modal and mm-select-modal.

Fixes #1218

Testing

• yarn workspace @metamask/sdk-install-modal-web build — compiled output now contains #sdk-mm-qrcode svg{width:50%;height:auto;aspect-ratio:1 / 1} (verified in dist)

🤖 Generated with Claude Code

---

Note

Low Risk
Scoped CSS-only change for modal QR display with no auth, data, or API impact.

Overview
Fixes invisible QR codes in the install and select modals on iPad Safari by replacing nested #sdk-mm-qrcode { svg { … } } rules with a flat #sdk-mm-qrcode svg selector in style.css and resetStyles.css, so sizing applies on browsers that drop unsupported native nesting.

The updated rule keeps 50% width and adds height: auto and aspect-ratio: 1 / 1 so viewBox-only SVGs get a non-zero square layout instead of collapsing in flex. The unreleased changelog notes the fix (#1397).

^{Reviewed by Cursor Bugbot for commit 36b6694. Bugbot is set up for automated code reviews on this repo. Configure here.}