fix(ShortcutFormatHelp): improve modal scrolling and layout

[thisisharsh7]

• ✅ Fixed vertical overflow: Dialog won't exceed viewport height
• ✅ Fixed navbar collision: 83vh leaves space for navbar
• ✅ Better scrolling UX: Header/footer stay fixed, content scrolls
• ✅ Proper border radius: Scrollable area respects modal corners
• ❌ Navbar white space: Still present (scrollbar compensation issue)

before:

after:

[thisisharsh7]

fix for #694

[Leftium]

❌ Navbar white space: Still present (scrollbar compensation issue)

• Notice the scrollbar appears next to the navbar even if a modal is not active
• Try: Settings → Keyboard Shortcuts without modal open.
• Try: other settings tabs like Privacy & Analytics, API keys, etc
• Try: Recordings List page with enough items to cause overflow
• Or: simply resizing the app window so the window height is smaller than the page contents

Therefore I suggest a root layout that ensures the navbar does not get included in the scrollbar. Something like a grid layout with grid-template-rows: auto 1fr

In addition to that, you can add sub layouts that ensure other child elements don't get scrollbars, even before reaching the root layout.

The parent layout will be a "catch-all" that ensures child elements that are too tall cannot "sneak by."

[thisisharsh7]

Thanks for the suggestions, @Leftium.

This PR focuses on modal scrolling and layout: dialogs respect viewport height and navbar space, header/footer stay fixed, and scrollable content respects modal corners.

Added consistent z-index increments to make future layering predictable:

• Navbar: z-50 (remains above page content)
• Toast notifications: z-90 (appears above navbar for visibility)
• Dialog overlay/content: z-[100] (appears above toasts, fully interactive)
• Alert dialog overlay/content: z-[110] (appears above all other UI elements)

Why:

• Ensures modals and their close buttons are always clickable
• Maintains a clear visual and interaction hierarchy for users
• Prevents toast notifications from blocking important dialogs

Testing:

• Verified that modals open above toasts and navbar
• Verified that alert dialogs appear above all other elements
• Checked interactions (clickable buttons) on all layers

We can address navbar whitespace separately in a dedicated layout improvement.

[Leftium]

If vertical navigation (#937) is merged, most of this PR is likely not needed. Probably want to remove some things like 83vh, which would just make the dialog smaller for no benefit.