Fix verify page exhale-note dialog visibility on mobile

[kojibai]

Motivation

• Mobile browsers were showing a blank/crystallized screen when opening the exhale-note popover on the verify page because the dialog was not getting a visible/fixed rendering state on small viewports.

Description

• Updated src/pages/VerifyPage.css to explicitly hide dialog.glass-modal by default and show it when the dialog is open via dialog.glass-modal[open] to ensure predictable rendering.
• Added positioning for dialog.glass-modal.fullscreen[open] to use position: fixed with a safe inset and high z-index so the fullscreen dialog is anchored correctly on mobile and desktop.
• Added a media query to account for safe-area insets on small screens using var(--safeTop|Right|Bot|Left) so the dialog respects device notches and bottom bars.

Testing

• Launched the dev server with npm run dev -- --host 0.0.0.0 --port 4173 and confirmed Vite served the app successfully.
• Ran a Playwright script that loaded http://127.0.0.1:4173/verify at a mobile viewport (390x844), forced the note dialog open attribute, and captured a screenshot to artifacts/verify-note-mobile.png, which validated the dialog is visible and positioned as expected.
• Committed the change with message Fix verify note dialog visibility on mobile and created this PR.

---

Codex Task

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
phi-network-5aii	Ready	Preview, Comment	Jan 31, 2026 6:06pm