Refactor scaling logic in app.js to improve viewport calculations

- Introduced a new function `viewportMaxCornerPx()` to calculate the maximum distance from the camera to the canvas corners.
- Updated the `resize()` and `applyZoom()` functions to use the new scaling logic based on the calculated viewport dimensions and a defined base view radius.
- Added a new constant `BASE_VIEW_RADIUS_KM` for better control over scaling behavior.

app.js

@@ -23,6 +23,8 @@
   var camCY = 0
   var SCALE = 0
   var zoomLevel = 1.0
+  /** World km from camera to farthest canvas corner when zoom label = 100%; +/- zoom scales this radius. */
+  var BASE_VIEW_RADIUS_KM = 1.15
   /** Keeps map labels readable vs panel type (~15% bump; pair with .coastal-surveillance-sim font-size). */
   var MAP_LABEL_SCALE = 1.15
 
@@ -373,7 +375,7 @@
       if (px >= 100 && px <= 240) { ringInterval = nice[i]; break }
       if (px < 100) ringInterval = nice[i]
     }
-    var maxDist = Math.sqrt(Math.pow(Math.max(camCX, W - camCX), 2) + Math.pow(camCY, 2)) / SCALE
+    var maxDist = viewportMaxCornerPx() / SCALE
     var maxRing = Math.ceil(maxDist / ringInterval) + 1
     var fs = 12 * MAP_LABEL_SCALE / SCALE
     var tw = 5 / SCALE
@@ -442,6 +444,16 @@
     refreshSvgHitBox()
   }
 
+  function viewportMaxCornerPx() {
+    if (W <= 0 || H <= 0) return 1
+    return Math.max(
+      Math.hypot(camCX, camCY),
+      Math.hypot(W - camCX, camCY),
+      Math.hypot(camCX, H - camCY),
+      Math.hypot(W - camCX, H - camCY)
+    )
+  }
+
   function resize() {
     if (!svg || !wrap) return
     W = wrap.clientWidth
@@ -450,7 +462,7 @@
     svg.setAttribute('height', H)
     camCX = W / 2
     camCY = H * 0.9
-    SCALE = Math.min(W, H) * 0.42 * zoomLevel
+    SCALE = viewportMaxCornerPx() / BASE_VIEW_RADIUS_KM * zoomLevel
     updateWorldTransform()
     if (bgSky) { bgSky.setAttribute('width', W); bgSky.setAttribute('height', camCY) }
     if (bgSea) { bgSea.setAttribute('y', camCY); bgSea.setAttribute('width', W); bgSea.setAttribute('height', H - camCY) }
@@ -476,7 +488,7 @@
   function applyZoom(delta) {
     var factor = delta > 0 ? 1.12 : 1 / 1.12
     zoomLevel = Math.max(0.3, Math.min(8, zoomLevel * factor))
-    SCALE = Math.min(W, H) * 0.42 * zoomLevel
+    SCALE = viewportMaxCornerPx() / BASE_VIEW_RADIUS_KM * zoomLevel
     updateWorldTransform()
     scheduleZoomVisuals()
     updateZoomLabel()