Refactor BaseAuthForm card layout and add registration link to LoginForm

[Rutjake]

✨ Enhancement Description

• Update the visual appearance of the authentication screens to match the new Figma design. Instead of modifying individual pages, this refactor will target the shared <BaseAuthForm> shared component (BaseAuthForm.tsx and BaseAuthForm.module.scss). The form wrapper will be transformed into the new stylized "card" component layout detailed in Figma.

• Update LoginForm.tsx to inject a new "Register in-game" link/button into the <BaseAuthForm> actions or extra content. The target URL must be imported from the central configuration file appExternalLinks.ts.

• The current shared BaseAuthForm layout is outdated (e.g., rigid max-width: breakpoint(xl) and old input field designs). Refactoring this shared component ensures that both the current login form and any future authentication forms (like web registration) automatically share the exact same updated card layout and visual consistency.

---

🌟 Benefits of the Enhancement

• User Experience: A modern, responsive card container for auth forms that adapts cleanly across mobile, tablet, and desktop viewports. Clear UX pathing for new users to find the Google Play app.
• Project Impact: High reusability and scalability. Future-proofs the codebase so that implementing web registration later requires zero styling duplication, as <BaseAuthForm> will already act as the generic design-system-approved auth card.

---

🛠️ Proposed Implementation

• Technical Details:
  • Update BaseAuthForm.module.scss (specifically .baseAuthForm) to represent the new responsive card specifications from Figma (backgrounds, border-radius, shadows, paddings, and flexible width controls).
  • Update any input element styles inside .fields if the Figma design changes field borders, placeholders, or focus states.
  • In LoginForm.tsx, import the game app store link from appExternalLinks.ts and pass the new "Register in-game" link into the form's actions or extraContent prop.
  • Ensure the link opens securely in a new tab (target="_blank" rel="noopener noreferrer").
• Implementation Plan:
  1. Inspect the new login layout and shared card properties (spacing, dimensions) in Figma.
  2. Refactor BaseAuthForm.module.scss to implement the card layout and ensure clean mobile-first responsiveness.
  3. Wire the "Register in-game" link from appExternalLinks.ts into LoginForm.tsx.
  4. Verify that the updated <BaseAuthForm> renders correctly inside AuthLoginPage.tsx (route /auth/login).

---

📎 Additional Information

• Links & References:
  🔗Figma Designs

• Component Reuse & UI: If possible, utilize the same button component/variant that is already used on the homepage to keep the design language uniform and code implementation lightweight.

• Scope Note: Interactive states (such as hover effects) can be left as they currently are unless explicitly specified in the new Figma guidelines.

📷Preview: