refactor: consolidate platform detection across client components (#3325)

## Description:

This PR consolidates ad hoc platform/environment/viewport detection into
a single shared utility. It is scoped to this refactor only, and serves
as groundwork for the mobile-focused feature work planned for the v31
milestone.

### What changed
- Introduced a shared `Platform` utility centralising:
  - OS detection (with `userAgentData` + UA fallback)
  - Electron environment detection
- Viewport breakpoint helpers (`isMobileWidth`, `isTabletWidth`,
`isDesktopWidth`)
- Replaced duplicated inline checks across client files with the shared
API.
- Normalised Mac detection to derive from the consolidated OS logic
rather than a separate regex.

### Why
- Multiple client files each independently ran `navigator.userAgent`
regexes or copy-pasted `isElectron` logic — this unifies all of that.
- Puts a stable, tested abstraction in place before v31 mobile work
lands, so mobile feature branches have a consistent surface to build
against.

## Please complete the following:

- [x] I have added screenshots for all UI updates (N/A: refactor only,
no visible UI changes)
- [x] I process any text displayed to the user through translateText()
and I've added it to the en.json file (N/A: no new user-facing strings)
- [x] I have added relevant tests to the test directory (N/A: refactor
only)
- [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:

skigim

src/client/graphics/layers/GameLeftSidebar.ts

@@ -4,6 +4,7 @@ import { customElement, state } from "lit/decorators.js";
 import { EventBus } from "../../../core/EventBus";
 import { GameMode } from "../../../core/game/Game";
 import { GameView } from "../../../core/game/GameView";
+import { Platform } from "../../Platform";
 import { translateText } from "../../Utils";
 import { ImmunityBarVisibleEvent } from "./ImmunityTimer";
 import { Layer } from "./Layer";
@@ -51,7 +52,7 @@ export class GameLeftSidebar extends LitElement implements Layer {
       this.isPlayerTeamLabelVisible = true;
     }
     // Make it visible by default on large screens
-    if (window.innerWidth >= 1024) {
+    if (Platform.isDesktopWidth) {
       // lg breakpoint
       this._shownOnInit = true;
     }

src/client/graphics/layers/SpawnVideoReward.ts

@@ -1,6 +1,7 @@
 import { LitElement, html } from "lit";
 import { customElement, state } from "lit/decorators.js";
 import { crazyGamesSDK } from "src/client/CrazyGamesSDK";
+import { Platform } from "src/client/Platform";
 import { getGamesPlayed } from "src/client/Utils";
 import { GameType } from "src/core/game/Game";
 import { GameView } from "../../../core/game/GameView";
@@ -21,7 +22,7 @@ export class SpawnVideoAd extends LitElement implements Layer {
   init() {
     if (
       !window.adsEnabled ||
-      window.innerWidth < 768 ||
+      Platform.isMobileWidth ||
       crazyGamesSDK.isOnCrazyGames() ||
       this.game.config().gameConfig().gameType === GameType.Singleplayer ||
       getGamesPlayed() < 3 // Don't show to new players

src/client/graphics/layers/WinModal.ts

@@ -19,6 +19,7 @@ import {
   patternRelationship,
 } from "../../Cosmetics";
 import { crazyGamesSDK } from "../../CrazyGamesSDK";
+import { Platform } from "../../Platform";
 import { SendWinnerEvent } from "../../Transport";
 import { Layer } from "./Layer";
 
@@ -186,8 +187,7 @@ export class WinModal extends LitElement implements Layer {
 
     // Shuffle the array and take patterns based on screen size
     const shuffled = [...purchasablePatterns].sort(() => Math.random() - 0.5);
-    const isMobile = window.innerWidth < 768; // md breakpoint
-    const maxPatterns = isMobile ? 1 : 3;
+    const maxPatterns = Platform.isMobileWidth ? 1 : 3;
     const selectedPatterns = shuffled.slice(
       0,
       Math.min(maxPatterns, shuffled.length),