fix(web): vertically center settings sidebar and refine active highlight styling

[Himanth-reddy]

Description

This PR improves the web Settings screen UI and navigation layout:

• Vertically Centered Sidebar: Anchors the settings left navigation bar to the vertical center of the viewport (top: 50%; transform: translateY(-50%)) so it stays constant and fixed while scrolling settings content.
• Clean Active Highlight: Replaces glows and white indicator lines with a clean matte active highlight box.
• Full-Width Content Layout: Expands settings panel cards across the screen width with butter-smooth 60 FPS transition animations when collapsing/expanding.

[chatgpt-codex-connector]

You have reached your Codex usage limits for code reviews. You can see your limits in the Codex usage dashboard.
To continue using code reviews, you can upgrade your account or add credits to your account and enable them for code reviews in your settings.

[ProdigyV21]

Desktop looks like a nice upgrade, but this breaks mobile: the PR switches the sidebar to position: fixed and content to calc(100% - 264px), without touching any media query. The existing @media (max-width: 640px) rule only resets grid columns, so on phones the fixed sidebar overlays the content and the content column shrinks to ~110px.

Two changes needed:

Add mobile overrides in the 640px media query: reset the sidebar to static/full-width (or a top bar) and content back to width: 100%. Please verify on an actual phone viewport (375px) before pushing.
Rebase on main — SettingsScreen.tsx changed in #472 (SSO login section) and globals.css gained new blocks this week.
Happy to merge after that.