feat(layout): add active-network indicator pill to the header

[eischideraa-unn]

Description
This PR implements a persistent network indicator pill in the application header. This safety affordance
explicitly displays the currently active Stellar network (Mainnet vs. Testnet) to prevent users from
unknowingly transacting on the wrong network.

Closes #441

Implementation Details

• Created NetworkIndicator Component:
  • Reads the active network from SettingsContext.
  • Renders a styled pill:
    • "Mainnet": Uses the active variant (subtle).
    • "Testnet": Uses the slashed variant (high-visibility warning color).
    • "Unknown": Uses the unknown variant as a fallback.
  • Includes an accessible aria-label (e.g., "Active network: Testnet").
• Integration:
  • Added the NetworkIndicator to the Layout header component, positioned next to the ThemeToggle.
  • Styled with NetworkIndicator.css to ensure responsiveness and prevent header overflow at small
    viewports (min 360px).
• Context Update:
  • Exported SettingsState from SettingsContext.tsx to allow proper type-checking in component tests.
    Acceptance Criteria Checklist

• NetworkIndicator reflects active network
• Testnet pill is high-visibility + accessible name
• Responsive at 360px, contrast-passing in both themes
• RTL coverage including unknown-network fallback
• npm run lint + npm run build + npm run test all pass

[drips-wave]

@eischideraa-unn Great news! 🎉 Based on an automated assessment of this PR, the linked Wave issue(s) no longer count against your application limits.

You can now already apply to more issues while waiting for a review of this PR. Keep up the great work! 🚀

Learn more about application limits