Add a troubleshooting panel (#2951)

## Description:

Add a troobleshooting panel with the most common problems, and a button
to copy the infos for better sharing

<img width="893" height="583" alt="image"
src="https://github.com/user-attachments/assets/7a37f88c-45b2-448c-86fc-6a3736bc9b25"
/>
<img width="654" height="697" alt="image"
src="https://github.com/user-attachments/assets/11dc1898-579b-42c0-953f-f8237eca2922"
/>

## Please complete the following:

- [x] I have added screenshots for all UI updates
- [x] I process any text displayed to the user through translateText()
and I've added it to the en.json file
- [x] I have added relevant tests to the test directory
- [x] I confirm I have thoroughly tested these changes and take full
responsibility for any bugs introduced

## Please put your Discord username so you can be contacted if a bug or
regression is found:

Mr. Box

resources/lang/en.json

@@ -7,6 +7,7 @@
   },
   "common": {
     "close": "Close",
+    "copy": "Copy",
     "back": "Back",
     "available": "Available",
     "preset_max": "Max",
@@ -51,12 +52,43 @@
     "account": "Account",
     "help": "Help",
     "menu": "Menu",
+    "troubleshooting": "Troubleshooting",
+    "go_to_troubleshooting": "Go to our troubleshooting page",
     "pick_pattern": "Pick a pattern!"
   },
   "news": {
     "github_link": "on GitHub",
     "title": "Release Notes"
   },
+  "troubleshooting": {
+    "title": "Troubleshooting",
+    "loading": "Loading...",
+    "environment": "Environment",
+    "rendering": "Rendering",
+    "power": "Power",
+    "browser": "Browser",
+    "platform": "Platform",
+    "copied_to_clipboard": "Info copied to the clipboard! Feel free to share it on our Discord if you need help.",
+    "os": "OS",
+    "device_pixel_ratio": "Device Pixel Ratio",
+    "chromium_tip": "OpenFront runs best on Chromium-based browsers.",
+    "hardware_acceleration_tip": "Make sure hardware acceleration is enabled in your browser settings for optimal performance.",
+    "renderer": "Renderer",
+    "max_texture_size": "Max Texture Size",
+    "high_precision_shaders": "High Precision Shaders",
+    "gpu": "GPU",
+    "unavailable": "Unavailable",
+    "gpu_tip": "Verify that this is the dedicated GPU, if one is available.",
+    "battery": "Battery",
+    "charging": "Charging",
+    "battery_level": "Battery Level",
+    "power_saving_tip": "Make sure that your browser is not set to power saving mode.",
+    "yes": "Yes",
+    "no": "No",
+    "unknown": "Unknown",
+    "software_rendering": "Software rendering",
+    "canvas_2d_no_gpu": "Canvas 2D (no GPU)"
+  },
   "help_modal": {
     "hotkeys": "Hotkeys",
     "table_key": "Key",
@@ -141,6 +173,7 @@
     "build_mirv": "MIRV",
     "build_mirv_desc": "The most powerful bomb in the game. Splits up into smaller bombs that will cover a huge range of territory. Only damages the player that you first clicked on to build it. Spawns from the nearest Missile Silo and lands in the area you first clicked to build it.",
     "player_icons": "Player icons",
+    "troubleshooting_desc": "If you experience performance issues, crashes, or other problems while playing OpenFront, please visit our Troubleshooting page for help diagnosing and fixing common issues:",
     "icon_desc": "Examples of some of the ingame icons you will encounter and what they mean:",
     "icon_crown": "Crown - Number 1. This is the top player in the leaderboard.",
     "icon_traitor": "Broken shield - Traitor. This player attacked an ally.",