From 0bfbee452e19b59a8903c06e70a8a2378b0f00d5 Mon Sep 17 00:00:00 2001
From: s53zo <44831766+s53zo@users.noreply.github.com>
Date: Thu, 12 Feb 2026 22:48:22 +0100
Subject: [PATCH 1/6] Auto-follow DX target from newest contest QSO

---
 src/components/PluginLayer.jsx       |  4 ++--
 src/components/WorldMap.jsx          |  3 +++
 src/plugins/layers/useContestQsos.js | 29 +++++++++++++++++++++++++++-
 3 files changed, 33 insertions(+), 3 deletions(-)

diff --git a/src/components/PluginLayer.jsx b/src/components/PluginLayer.jsx
index 79ea1740..6136c095 100644
--- a/src/components/PluginLayer.jsx
+++ b/src/components/PluginLayer.jsx
@@ -5,12 +5,12 @@
  */
 import React from 'react';
 
-export const PluginLayer = ({ plugin, enabled, opacity, map, callsign, locator, lowMemoryMode }) => {
+export const PluginLayer = ({ plugin, enabled, opacity, map, callsign, locator, lowMemoryMode, onDXChange, dxLocked, dxLocation }) => {
   
   const layerFunc = plugin.useLayer || plugin.hook;
 
   if (typeof layerFunc === 'function') {
-    layerFunc({ map, enabled, opacity, callsign, locator, lowMemoryMode });
+    layerFunc({ map, enabled, opacity, callsign, locator, lowMemoryMode, onDXChange, dxLocked, dxLocation });
   }
 
   return null;
diff --git a/src/components/WorldMap.jsx b/src/components/WorldMap.jsx
index aafbab7b..53959d21 100644
--- a/src/components/WorldMap.jsx
+++ b/src/components/WorldMap.jsx
@@ -910,6 +910,9 @@ export const WorldMap = ({
 		    callsign={callsign}
 		    locator={deLocator}
 		    lowMemoryMode={lowMemoryMode}
+		    onDXChange={onDXChange}
+		    dxLocked={dxLocked}
+		    dxLocation={dxLocation}
 		  />
 		))}
       //  MODIS SLIDER CODE HERE 
diff --git a/src/plugins/layers/useContestQsos.js b/src/plugins/layers/useContestQsos.js
index 01c8ba7c..c69e0e3d 100644
--- a/src/plugins/layers/useContestQsos.js
+++ b/src/plugins/layers/useContestQsos.js
@@ -13,13 +13,14 @@ export const metadata = {
   version: '1.0.0'
 };
 
-export function useLayer({ enabled = false, opacity = 0.7, map = null }) {
+export function useLayer({ enabled = false, opacity = 0.7, map = null, onDXChange = null }) {
   const [qsos, setQsos] = useState([]);
   const [deLocation, setDeLocation] = useState(null);
   const markersRef = useRef([]);
   const linesRef = useRef([]);
   const pollRef = useRef(null);
   const configLoadedRef = useRef(false);
+  const lastAutoDxQsoIdRef = useRef(null);
 
   useEffect(() => {
     if (!enabled || configLoadedRef.current) return;
@@ -129,5 +130,31 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null }) {
     });
   }, [qsos, enabled, opacity, map, deLocation]);
 
+  useEffect(() => {
+    if (!enabled || typeof onDXChange !== 'function' || !Array.isArray(qsos) || qsos.length === 0) return;
+
+    const latestWithCoords = [...qsos]
+      .reverse()
+      .find((qso) => Number.isFinite(parseFloat(qso?.lat)) && Number.isFinite(parseFloat(qso?.lon)));
+
+    if (!latestWithCoords) return;
+
+    const qsoId = latestWithCoords.id ||
+      `${latestWithCoords.dxCall || ''}-${latestWithCoords.timestamp || ''}-${latestWithCoords.lat}-${latestWithCoords.lon}`;
+
+    if (!qsoId || qsoId === lastAutoDxQsoIdRef.current) return;
+
+    const lat = parseFloat(latestWithCoords.lat);
+    let lon = parseFloat(latestWithCoords.lon);
+    if (!Number.isFinite(lat) || !Number.isFinite(lon)) return;
+
+    while (lon > 180) lon -= 360;
+    while (lon < -180) lon += 360;
+
+    // Auto-follow newest contest QSO so propagation/DX panel refresh from logger activity.
+    onDXChange({ lat, lon });
+    lastAutoDxQsoIdRef.current = qsoId;
+  }, [enabled, qsos, onDXChange]);
+
   return { layer: markersRef.current };
 }

From c88b630d5d3a690b18ecd83c337c318ba61b70b6 Mon Sep 17 00:00:00 2001
From: s53zo <44831766+s53zo@users.noreply.github.com>
Date: Thu, 12 Feb 2026 22:57:36 +0100
Subject: [PATCH 2/6] Add DXLog UDP support in contest QSO parser

---
 server.js | 43 +++++++++++++++++++++++++++++++++++--------
 1 file changed, 35 insertions(+), 8 deletions(-)

diff --git a/server.js b/server.js
index c5236d5e..72db9e70 100644
--- a/server.js
+++ b/server.js
@@ -8197,6 +8197,23 @@ function normalizeCallsign(value) {
   return (value || '').trim().toUpperCase();
 }
 
+function parseXmlBoolean(value) {
+  if (value == null) return null;
+  const normalized = String(value).trim().toLowerCase();
+  if (!normalized) return null;
+  if (normalized === 'true' || normalized === '1' || normalized === 'yes') return true;
+  if (normalized === 'false' || normalized === '0' || normalized === 'no') return false;
+  return null;
+}
+
+function detectContestSource(xml) {
+  const app = getXmlTag(xml, 'app').toLowerCase();
+  const logger = getXmlTag(xml, 'logger').toLowerCase();
+  if (app.includes('dxlog') || logger.includes('dxlog')) return 'dxlog';
+  if (app.includes('n1mm') || logger.includes('n1mm')) return 'n1mm';
+  return 'contest';
+}
+
 function n1mmFreqToMHz(value, bandMHz) {
   const v = parseFloat(value);
   if (!v || Number.isNaN(v)) return bandMHz || null;
@@ -8287,10 +8304,11 @@ function addContestQso(qso) {
   return true;
 }
 
-function parseN1MMContactInfo(xml) {
+function parseContestContactInfo(xml) {
   const dxCall = normalizeCallsign(getXmlTag(xml, 'call'));
   if (!dxCall) return null;
 
+  const source = detectContestSource(xml);
   const myCall = normalizeCallsign(getXmlTag(xml, 'mycall')) ||
     normalizeCallsign(getXmlTag(xml, 'stationprefix')) ||
     CONFIG.callsign;
@@ -8307,13 +8325,22 @@ function parseN1MMContactInfo(xml) {
   const contestName = getXmlTag(xml, 'contestname') || '';
   const timestampStr = getXmlTag(xml, 'timestamp') || '';
   const timestamp = parseN1MMTimestamp(timestampStr) || Date.now();
-  const id = getXmlTag(xml, 'ID') || '';
+  const id = getXmlTag(xml, 'ID') || getXmlTag(xml, 'guid') || getXmlTag(xml, 'qsoid') || '';
+  const isNewQso = parseXmlBoolean(getXmlTag(xml, 'newqso'));
+  const isDuplicate = parseXmlBoolean(getXmlTag(xml, 'duplicate'));
+  const isInvalid = parseXmlBoolean(getXmlTag(xml, 'invalid'));
+  const isDeleted = parseXmlBoolean(getXmlTag(xml, 'xqso'));
+
+  // DXLog may send non-new / duplicate / invalid/deleted updates on the same stream.
+  // Only ingest genuine new, valid QSOs so the map and auto-DX-follow stay clean.
+  if (isNewQso === false) return null;
+  if (isDuplicate === true || isInvalid === true || isDeleted === true) return null;
 
   const loc = resolveQsoLocation(dxCall, grid, comment);
 
   const qso = {
     id,
-    source: 'n1mm',
+    source,
     timestamp,
     time: timestampStr,
     myCall,
@@ -8398,17 +8425,17 @@ if (N1MM_ENABLED) {
       const text = buf.toString('utf8');
       const xml = extractContactInfoXml(text);
       if (!xml) return;
-      const qso = parseN1MMContactInfo(xml);
+      const qso = parseContestContactInfo(xml);
       if (qso) addContestQso(qso);
     });
 
     n1mmSocket.on('error', (err) => {
-      logErrorOnce('N1MM UDP', err.message);
+      logErrorOnce('Contest UDP', err.message);
     });
 
     n1mmSocket.on('listening', () => {
       const addr = n1mmSocket.address();
-      console.log(`[N1MM] UDP listener on ${addr.address}:${addr.port}`);
+      console.log(`[Contest UDP] listener on ${addr.address}:${addr.port}`);
     });
 
     n1mmSocket.bind(N1MM_UDP_PORT, '0.0.0.0');
@@ -8507,8 +8534,8 @@ app.listen(PORT, '0.0.0.0', () => {
   if (WSJTX_RELAY_KEY) {
     console.log(`  🔁 WSJT-X relay endpoint enabled (POST /api/wsjtx/relay)`);
   }
-if (N1MM_ENABLED) {
-    console.log(`  📥 N1MM UDP listener on port ${N1MM_UDP_PORT}`);
+  if (N1MM_ENABLED) {
+    console.log(`  📥 Contest logger UDP listener (N1MM/DXLog) on port ${N1MM_UDP_PORT}`);
   }
   if (AUTO_UPDATE_ENABLED) {
     console.log(`  🔄 Auto-update enabled every ${AUTO_UPDATE_INTERVAL_MINUTES || 60} minutes`);

From 3e80379c4b7e6bc90c9375b8651e5a5a0acb5662 Mon Sep 17 00:00:00 2001
From: s53zo <44831766+s53zo@users.noreply.github.com>
Date: Tue, 17 Feb 2026 22:26:27 +0100
Subject: [PATCH 3/6] Fix PluginLayer merge artifact and wire DX follow props

---
 src/components/PluginLayer.jsx | 44 ++++++++++++++++++----------------
 src/components/WorldMap.jsx    |  5 +++-
 2 files changed, 28 insertions(+), 21 deletions(-)

diff --git a/src/components/PluginLayer.jsx b/src/components/PluginLayer.jsx
index a227d9d9..a6a719c1 100644
--- a/src/components/PluginLayer.jsx
+++ b/src/components/PluginLayer.jsx
@@ -4,38 +4,42 @@
  */
 import React from 'react';
 
-export const PluginLayer = ({ plugin, enabled, opacity, map, callsign, locator, lowMemoryMode, onDXChange, dxLocked, dxLocation }) => {
-export const PluginLayer = ({ 
-  plugin, 
-  enabled, 
-  opacity, 
-  map, 
-  callsign, 
-  locator, 
+export const PluginLayer = ({
+  plugin,
+  enabled,
+  opacity,
+  map,
+  callsign,
+  locator,
   lowMemoryMode,
   satellites,
   units,
-  config
+  config,
+  onDXChange,
+  dxLocked,
+  dxLocation
 }) => {
   
   const layerFunc = plugin.useLayer || plugin.hook;
 
   if (typeof layerFunc === 'function') {
-    layerFunc({ map, enabled, opacity, callsign, locator, lowMemoryMode, onDXChange, dxLocked, dxLocation });
-    layerFunc({ 
-      map, 
-      enabled, 
-      opacity, 
-      callsign, 
-      locator, 
-      lowMemoryMode, 
-      satellites, 
+    layerFunc({
+      map,
+      enabled,
+      opacity,
+      callsign,
+      locator,
+      lowMemoryMode,
+      satellites,
       units,
-      config
+      config,
+      onDXChange,
+      dxLocked,
+      dxLocation
     });
   }
 
   return null;
 };
 
-export default PluginLayer;
\ No newline at end of file
+export default PluginLayer;
diff --git a/src/components/WorldMap.jsx b/src/components/WorldMap.jsx
index 77667957..178b0716 100644
--- a/src/components/WorldMap.jsx
+++ b/src/components/WorldMap.jsx
@@ -1366,6 +1366,9 @@ export const WorldMap = ({
           callsign={callsign}
           locator={deLocator}
           lowMemoryMode={lowMemoryMode}
+          onDXChange={onDXChange}
+          dxLocked={dxLocked}
+          dxLocation={dxLocation}
         />
       ))}
 
@@ -1612,4 +1615,4 @@ export const WorldMap = ({
   );
 };
 
-export default WorldMap;
\ No newline at end of file
+export default WorldMap;

From 72a8ce244d8185f021d63df8fa0912453e9904f7 Mon Sep 17 00:00:00 2001
From: s53zo <44831766+s53zo@users.noreply.github.com>
Date: Wed, 18 Feb 2026 23:29:47 +0100
Subject: [PATCH 4/6] style: format PR 371 files with Prettier

---
 server.js                            | 3213 ++++++++++----------------
 src/components/PluginLayer.jsx       |    5 +-
 src/components/WorldMap.jsx          |  957 ++++----
 src/plugins/layers/useContestQsos.js |   35 +-
 4 files changed, 1606 insertions(+), 2604 deletions(-)

diff --git a/server.js b/server.js
index 906886e2..fc6fca0a 100644
--- a/server.js
+++ b/server.js
@@ -28,18 +28,12 @@ const dgram = require('dgram');
 const fs = require('fs');
 const { execFile, spawn } = require('child_process');
 const mqttLib = require('mqtt');
-const {
-  initCtyData,
-  getCtyData,
-  lookupCall,
-} = require('./src/server/ctydat.js');
+const { initCtyData, getCtyData, lookupCall } = require('./src/server/ctydat.js');
 
 // Read version from package.json as single source of truth
 const APP_VERSION = (() => {
   try {
-    const pkg = JSON.parse(
-      fs.readFileSync(path.join(__dirname, 'package.json'), 'utf8'),
-    );
+    const pkg = JSON.parse(fs.readFileSync(path.join(__dirname, 'package.json'), 'utf8'));
     return pkg.version || '0.0.0';
   } catch {
     return '0.0.0';
@@ -49,10 +43,7 @@ const APP_VERSION = (() => {
 // Global safety nets — log but don't crash on stray errors (e.g. MQTT connack timeout)
 process.on('uncaughtException', (err) => {
   // BadRequestError: request aborted — benign, just a client disconnecting mid-request
-  if (
-    err.type === 'request.aborted' ||
-    (err.name === 'BadRequestError' && err.message === 'request aborted')
-  ) {
+  if (err.type === 'request.aborted' || (err.name === 'BadRequestError' && err.message === 'request aborted')) {
     return; // Silently ignore — not a real crash
   }
   // PayloadTooLargeError — client sent oversized body, already handled by Express middleware
@@ -66,11 +57,7 @@ process.on('uncaughtException', (err) => {
 });
 process.on('unhandledRejection', (reason) => {
   // AbortErrors are benign — just fetch timeouts firing after the request context ended
-  if (
-    reason &&
-    (reason.name === 'AbortError' ||
-      (typeof reason === 'string' && reason.includes('AbortError')))
-  ) {
+  if (reason && (reason.name === 'AbortError' || (typeof reason === 'string' && reason.includes('AbortError')))) {
     return; // Silently ignore — these are expected during upstream slowdowns
   }
   console.error(`[WARN] Unhandled rejection: ${reason}`);
@@ -83,9 +70,7 @@ const envExamplePath = path.join(__dirname, '.env.example');
 if (!fs.existsSync(envPath) && fs.existsSync(envExamplePath)) {
   fs.copyFileSync(envExamplePath, envPath);
   console.log('[Config] Created .env from .env.example');
-  console.log(
-    '[Config] ⚠️  Please edit .env with your callsign and locator, then restart',
-  );
+  console.log('[Config] ⚠️  Please edit .env with your callsign and locator, then restart');
 }
 
 // Load .env file if it exists
@@ -120,8 +105,7 @@ const API_WRITE_KEY = process.env.API_WRITE_KEY || '';
 // Helper: check write auth on POST endpoints that modify server state
 function requireWriteAuth(req, res, next) {
   if (!API_WRITE_KEY) return next(); // No key configured = open (local installs)
-  const token =
-    req.headers.authorization?.replace('Bearer ', '') || req.query.key || '';
+  const token = req.headers.authorization?.replace('Bearer ', '') || req.query.key || '';
   if (token === API_WRITE_KEY) return next();
   return res.status(401).json({
     error: 'Unauthorized — set Authorization: Bearer <API_WRITE_KEY>',
@@ -169,17 +153,13 @@ class UpstreamManager {
     const consecutive = prev.consecutive + 1;
 
     // Base delays by status: 429=aggressive, 503=moderate, other=short
-    const baseDelay =
-      statusCode === 429 ? 60000 : statusCode === 503 ? 30000 : 15000;
+    const baseDelay = statusCode === 429 ? 60000 : statusCode === 503 ? 30000 : 15000;
 
     // Per-service max backoff caps
     const maxBackoff = 30 * 60 * 1000; // 30 minutes
 
     // Exponential: base * 2^(n-1), capped per service
-    const delay = Math.min(
-      maxBackoff,
-      baseDelay * Math.pow(2, Math.min(consecutive - 1, 8)),
-    );
+    const delay = Math.min(maxBackoff, baseDelay * Math.pow(2, Math.min(consecutive - 1, 8)));
 
     // Add 0-15s jitter to prevent synchronized retries across instances
     const jitter = Math.random() * 15000;
@@ -328,10 +308,8 @@ if ((!stationLat || !stationLon) && locator) {
 }
 
 // Fallback to config.json location if no env
-if (!stationLat && jsonConfig.location?.lat)
-  stationLat = jsonConfig.location.lat;
-if (!stationLon && jsonConfig.location?.lon)
-  stationLon = jsonConfig.location.lon;
+if (!stationLat && jsonConfig.location?.lat) stationLat = jsonConfig.location.lat;
+if (!stationLon && jsonConfig.location?.lon) stationLon = jsonConfig.location.lon;
 
 const CONFIG = {
   // Station info (env takes precedence over config.json)
@@ -347,46 +325,26 @@ const CONFIG = {
   layout: process.env.LAYOUT || jsonConfig.layout || 'modern',
 
   // DX target
-  dxLatitude:
-    parseFloat(process.env.DX_LATITUDE) || jsonConfig.defaultDX?.lat || 51.5074,
-  dxLongitude:
-    parseFloat(process.env.DX_LONGITUDE) ||
-    jsonConfig.defaultDX?.lon ||
-    -0.1278,
+  dxLatitude: parseFloat(process.env.DX_LATITUDE) || jsonConfig.defaultDX?.lat || 51.5074,
+  dxLongitude: parseFloat(process.env.DX_LONGITUDE) || jsonConfig.defaultDX?.lon || -0.1278,
 
   // Feature toggles
-  showSatellites:
-    process.env.SHOW_SATELLITES !== 'false' &&
-    jsonConfig.features?.showSatellites !== false,
-  showPota:
-    process.env.SHOW_POTA !== 'false' &&
-    jsonConfig.features?.showPOTA !== false,
-  showDxPaths:
-    process.env.SHOW_DX_PATHS !== 'false' &&
-    jsonConfig.features?.showDXPaths !== false,
-  showDxWeather:
-    process.env.SHOW_DX_WEATHER !== 'false' &&
-    jsonConfig.features?.showDXWeather !== false,
-  classicAnalogClock:
-    process.env.CLASSIC_ANALOG_CLOCK === 'true' ||
-    jsonConfig.features?.classicAnalogClock === true,
+  showSatellites: process.env.SHOW_SATELLITES !== 'false' && jsonConfig.features?.showSatellites !== false,
+  showPota: process.env.SHOW_POTA !== 'false' && jsonConfig.features?.showPOTA !== false,
+  showDxPaths: process.env.SHOW_DX_PATHS !== 'false' && jsonConfig.features?.showDXPaths !== false,
+  showDxWeather: process.env.SHOW_DX_WEATHER !== 'false' && jsonConfig.features?.showDXWeather !== false,
+  classicAnalogClock: process.env.CLASSIC_ANALOG_CLOCK === 'true' || jsonConfig.features?.classicAnalogClock === true,
   showContests: jsonConfig.features?.showContests !== false,
   showDXpeditions: jsonConfig.features?.showDXpeditions !== false,
 
   // DX Cluster settings
   spotRetentionMinutes:
-    parseInt(process.env.SPOT_RETENTION_MINUTES) ||
-    jsonConfig.dxCluster?.spotRetentionMinutes ||
-    30,
-  dxClusterSource:
-    process.env.DX_CLUSTER_SOURCE || jsonConfig.dxCluster?.source || 'auto',
-  dxClusterHost:
-    process.env.DX_CLUSTER_HOST || jsonConfig.dxCluster?.host || '',
-  dxClusterPort:
-    parseInt(process.env.DX_CLUSTER_PORT) || jsonConfig.dxCluster?.port || 7300,
+    parseInt(process.env.SPOT_RETENTION_MINUTES) || jsonConfig.dxCluster?.spotRetentionMinutes || 30,
+  dxClusterSource: process.env.DX_CLUSTER_SOURCE || jsonConfig.dxCluster?.source || 'auto',
+  dxClusterHost: process.env.DX_CLUSTER_HOST || jsonConfig.dxCluster?.host || '',
+  dxClusterPort: parseInt(process.env.DX_CLUSTER_PORT) || jsonConfig.dxCluster?.port || 7300,
   // Login callsign for DX cluster telnet. If unset, falls back to CALLSIGN-56.
-  dxClusterCallsign:
-    process.env.DX_CLUSTER_CALLSIGN || jsonConfig.dxCluster?.callsign || '',
+  dxClusterCallsign: process.env.DX_CLUSTER_CALLSIGN || jsonConfig.dxCluster?.callsign || '',
 
   // API keys (don't expose to frontend)
   _openWeatherApiKey: process.env.OPENWEATHER_API_KEY || '',
@@ -398,9 +356,7 @@ const CONFIG = {
 const configMissing = CONFIG.callsign === 'N0CALL' || !CONFIG.gridSquare;
 if (configMissing) {
   console.log('[Config] ⚠️  Station configuration incomplete!');
-  console.log(
-    '[Config] Copy .env.example to .env OR config.example.json to config.json',
-  );
+  console.log('[Config] Copy .env.example to .env OR config.example.json to config.json');
   console.log('[Config] Set your CALLSIGN and LOCATOR/grid square');
   console.log('[Config] Settings popup will appear in browser');
 }
@@ -409,18 +365,13 @@ if (configMissing) {
 // Defaults to the public OpenHamClock prediction service; override in .env if self-hosting
 const ITURHFPROP_DEFAULT = 'https://proppy-production.up.railway.app';
 const ITURHFPROP_URL =
-  process.env.ITURHFPROP_URL &&
-  process.env.ITURHFPROP_URL.trim().startsWith('http')
+  process.env.ITURHFPROP_URL && process.env.ITURHFPROP_URL.trim().startsWith('http')
     ? process.env.ITURHFPROP_URL.trim()
     : ITURHFPROP_DEFAULT;
 
 // Log configuration
-console.log(
-  `[Config] Station: ${CONFIG.callsign} @ ${CONFIG.gridSquare || 'No grid'}`,
-);
-console.log(
-  `[Config] Location: ${CONFIG.latitude.toFixed(4)}, ${CONFIG.longitude.toFixed(4)}`,
-);
+console.log(`[Config] Station: ${CONFIG.callsign} @ ${CONFIG.gridSquare || 'No grid'}`);
+console.log(`[Config] Location: ${CONFIG.latitude.toFixed(4)}, ${CONFIG.longitude.toFixed(4)}`);
 console.log(`[Config] Units: ${CONFIG.units}, Time: ${CONFIG.timeFormat}h`);
 if (ITURHFPROP_URL) {
   const isDefault = ITURHFPROP_URL === ITURHFPROP_DEFAULT;
@@ -440,9 +391,7 @@ app.use(
 );
 
 // CORS — restrict to same origin by default; allow override via env
-const CORS_ORIGINS = process.env.CORS_ORIGINS
-  ? process.env.CORS_ORIGINS.split(',').map((s) => s.trim())
-  : true; // true = reflect request origin (same as before for local installs)
+const CORS_ORIGINS = process.env.CORS_ORIGINS ? process.env.CORS_ORIGINS.split(',').map((s) => s.trim()) : true; // true = reflect request origin (same as before for local installs)
 app.use(
   cors({
     origin: CORS_ORIGINS,
@@ -569,11 +518,7 @@ const ERROR_LOG_INTERVAL = 5 * 60 * 1000; // Only log same error once per 5 minu
 
 function logErrorOnce(category, message) {
   // Suppress AbortError messages — these are just fetch timeouts, not real errors
-  if (
-    message &&
-    (message.includes('aborted') || message.includes('AbortError'))
-  )
-    return false;
+  if (message && (message.includes('aborted') || message.includes('AbortError'))) return false;
 
   const key = `${category}:${message}`;
   const now = Date.now();
@@ -645,16 +590,10 @@ const endpointStats = {
       .map((s) => ({
         ...s,
         avgBytes: s.requests > 0 ? Math.round(s.totalBytes / s.requests) : 0,
-        avgDuration:
-          s.requests > 0 ? Math.round(s.totalDuration / s.requests) : 0,
-        requestsPerHour:
-          uptimeHours > 0 ? (s.requests / uptimeHours).toFixed(1) : s.requests,
-        bytesPerHour:
-          uptimeHours > 0
-            ? Math.round(s.totalBytes / uptimeHours)
-            : s.totalBytes,
-        errorRate:
-          s.requests > 0 ? ((s.errors / s.requests) * 100).toFixed(1) : 0,
+        avgDuration: s.requests > 0 ? Math.round(s.totalDuration / s.requests) : 0,
+        requestsPerHour: uptimeHours > 0 ? (s.requests / uptimeHours).toFixed(1) : s.requests,
+        bytesPerHour: uptimeHours > 0 ? Math.round(s.totalBytes / uptimeHours) : s.totalBytes,
+        errorRate: s.requests > 0 ? ((s.errors / s.requests) * 100).toFixed(1) : 0,
       }))
       .sort((a, b) => b.totalBytes - a.totalBytes); // Sort by bandwidth usage
 
@@ -722,10 +661,7 @@ app.use('/api', (req, res, next) => {
 // Self-hosted users must explicitly set ROTATOR_PROVIDER=pstrotator_udp.
 const ROTATOR_PROVIDER = (process.env.ROTATOR_PROVIDER || 'none').toLowerCase();
 const PSTROTATOR_HOST = process.env.PSTROTATOR_HOST || '192.168.1.43';
-const PSTROTATOR_UDP_PORT = parseInt(
-  process.env.PSTROTATOR_UDP_PORT || '12000',
-  10,
-);
+const PSTROTATOR_UDP_PORT = parseInt(process.env.PSTROTATOR_UDP_PORT || '12000', 10);
 const ROTATOR_STALE_MS = parseInt(process.env.ROTATOR_STALE_MS || '5000', 10);
 const ROTATOR_POLL_MS = parseInt(process.env.ROTATOR_POLL_MS || '1000', 10);
 
@@ -781,9 +717,7 @@ function ensureRotatorSocket() {
     try {
       sock.setRecvBufferSize?.(1024 * 1024);
     } catch {}
-    console.log(
-      `[Rotator] UDP listening on ${PSTROTATOR_REPLY_PORT} (provider=${ROTATOR_PROVIDER})`,
-    );
+    console.log(`[Rotator] UDP listening on ${PSTROTATOR_REPLY_PORT} (provider=${ROTATOR_PROVIDER})`);
   });
 
   rotatorSocket = sock;
@@ -794,17 +728,10 @@ function udpSend(message) {
   const sock = ensureRotatorSocket();
   const buf = Buffer.from(message, 'utf8');
   return new Promise((resolve, reject) => {
-    sock.send(
-      buf,
-      0,
-      buf.length,
-      PSTROTATOR_UDP_PORT,
-      PSTROTATOR_HOST,
-      (err) => {
-        if (err) return reject(err);
-        resolve();
-      },
-    );
+    sock.send(buf, 0, buf.length, PSTROTATOR_UDP_PORT, PSTROTATOR_HOST, (err) => {
+      if (err) return reject(err);
+      resolve();
+    });
   });
 }
 
@@ -871,9 +798,7 @@ app.get('/api/rotator/status', (req, res) => {
   res.setHeader('Cache-Control', 'no-cache, no-store, must-revalidate');
 
   const now = Date.now();
-  const isLive =
-    rotatorState.azimuth !== null &&
-    now - rotatorState.lastSeen <= ROTATOR_STALE_MS;
+  const isLive = rotatorState.azimuth !== null && now - rotatorState.lastSeen <= ROTATOR_STALE_MS;
 
   res.json({
     source: ROTATOR_PROVIDER,
@@ -898,9 +823,7 @@ app.post('/api/rotator/turn', async (req, res) => {
       ok: result.ok,
       target: result.target,
       azimuth: rotatorState.azimuth,
-      live:
-        rotatorState.azimuth !== null &&
-        Date.now() - rotatorState.lastSeen <= ROTATOR_STALE_MS,
+      live: rotatorState.azimuth !== null && Date.now() - rotatorState.lastSeen <= ROTATOR_STALE_MS,
       error: result.ok ? null : result.reason,
     });
   } catch (e) {
@@ -998,34 +921,20 @@ function loadVisitorStats() {
       console.log(
         `[Stats]   📊 All-time: ${data.allTimeVisitors || 0} unique visitors, ${data.allTimeRequests || 0} requests`,
       );
-      console.log(
-        `[Stats]   📅 History: ${(data.history || []).length} days tracked`,
-      );
+      console.log(`[Stats]   📅 History: ${(data.history || []).length} days tracked`);
       console.log(
         `[Stats]   🚀 Deployment #${(data.deploymentCount || 0) + 1} (first: ${data.serverFirstStarted || 'unknown'})`,
       );
 
       return {
         today: new Date().toISOString().slice(0, 10),
-        uniqueIPsToday:
-          data.today === new Date().toISOString().slice(0, 10)
-            ? data.uniqueIPsToday || []
-            : [],
-        totalRequestsToday:
-          data.today === new Date().toISOString().slice(0, 10)
-            ? data.totalRequestsToday || 0
-            : 0,
+        uniqueIPsToday: data.today === new Date().toISOString().slice(0, 10) ? data.uniqueIPsToday || [] : [],
+        totalRequestsToday: data.today === new Date().toISOString().slice(0, 10) ? data.totalRequestsToday || 0 : 0,
         allTimeVisitors: data.allTimeVisitors || 0,
         allTimeRequests: data.allTimeRequests || 0,
         // Reconstruct from geoIPCache keys (covers ~99% of IPs) + any legacy array
-        allTimeUniqueIPs: [
-          ...new Set([
-            ...(data.allTimeUniqueIPs || []),
-            ...Object.keys(data.geoIPCache || {}),
-          ]),
-        ],
-        serverFirstStarted:
-          data.serverFirstStarted || defaults.serverFirstStarted,
+        allTimeUniqueIPs: [...new Set([...(data.allTimeUniqueIPs || []), ...Object.keys(data.geoIPCache || {})])],
+        serverFirstStarted: data.serverFirstStarted || defaults.serverFirstStarted,
         lastDeployment: new Date().toISOString(),
         deploymentCount: (data.deploymentCount || 0) + 1,
         history: data.history || [],
@@ -1079,14 +988,9 @@ function saveVisitorStats(includeGeoCache = false) {
     saveErrorCount++;
     // Only log first error and then every 10th to avoid spam
     if (saveErrorCount === 1 || saveErrorCount % 10 === 0) {
-      console.error(
-        `[Stats] Failed to save (attempt #${saveErrorCount}):`,
-        err.message,
-      );
+      console.error(`[Stats] Failed to save (attempt #${saveErrorCount}):`, err.message);
       if (saveErrorCount === 1) {
-        console.error(
-          "[Stats] Stats will be kept in memory but won't persist across restarts",
-        );
+        console.error("[Stats] Stats will be kept in memory but won't persist across restarts");
       }
     }
   }
@@ -1127,33 +1031,19 @@ const GEOIP_BATCH_SIZE = 100; // ip-api.com batch limit
 
 // Queue any existing IPs that haven't been resolved yet
 for (const ip of allTimeIPSet) {
-  if (
-    !geoIPCache.has(ip) &&
-    ip !== 'unknown' &&
-    !ip.startsWith('127.') &&
-    !ip.startsWith('::')
-  ) {
+  if (!geoIPCache.has(ip) && ip !== 'unknown' && !ip.startsWith('127.') && !ip.startsWith('::')) {
     geoIPQueue.add(ip);
   }
 }
 if (geoIPQueue.size > 0) {
-  logInfo(
-    `[GeoIP] Queued ${geoIPQueue.size} unresolved IPs from history for batch lookup`,
-  );
+  logInfo(`[GeoIP] Queued ${geoIPQueue.size} unresolved IPs from history for batch lookup`);
 }
 
 /**
  * Queue an IP for GeoIP resolution
  */
 function queueGeoIPLookup(ip) {
-  if (
-    !ip ||
-    ip === 'unknown' ||
-    ip.startsWith('127.') ||
-    ip.startsWith('::1') ||
-    ip === '0.0.0.0'
-  )
-    return;
+  if (!ip || ip === 'unknown' || ip.startsWith('127.') || ip.startsWith('::1') || ip === '0.0.0.0') return;
   if (geoIPCache.has(ip)) return;
   geoIPQueue.add(ip);
 }
@@ -1169,13 +1059,11 @@ function recordCountry(ip, countryCode) {
   }
 
   // All-time stats
-  visitorStats.countryStats[countryCode] =
-    (visitorStats.countryStats[countryCode] || 0) + 1;
+  visitorStats.countryStats[countryCode] = (visitorStats.countryStats[countryCode] || 0) + 1;
 
   // Today stats (only if IP is in today's set)
   if (todayIPSet.has(ip)) {
-    visitorStats.countryStatsToday[countryCode] =
-      (visitorStats.countryStatsToday[countryCode] || 0) + 1;
+    visitorStats.countryStatsToday[countryCode] = (visitorStats.countryStatsToday[countryCode] || 0) + 1;
   }
 }
 
@@ -1205,20 +1093,17 @@ async function resolveGeoIPBatch() {
     const controller = new AbortController();
     const timeout = setTimeout(() => controller.abort(), 10000);
 
-    const response = await fetch(
-      'http://ip-api.com/batch?fields=query,countryCode,status',
-      {
-        method: 'POST',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify(
-          batch.map((ip) => ({
-            query: ip,
-            fields: 'query,countryCode,status',
-          })),
-        ),
-        signal: controller.signal,
-      },
-    );
+    const response = await fetch('http://ip-api.com/batch?fields=query,countryCode,status', {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify(
+        batch.map((ip) => ({
+          query: ip,
+          fields: 'query,countryCode,status',
+        })),
+      ),
+      signal: controller.signal,
+    });
     clearTimeout(timeout);
 
     if (response.status === 429) {
@@ -1247,9 +1132,7 @@ async function resolveGeoIPBatch() {
     }
 
     if (resolved > 0) {
-      logDebug(
-        `[GeoIP] Resolved ${resolved}/${batch.length} IPs (${geoIPQueue.size} remaining)`,
-      );
+      logDebug(`[GeoIP] Resolved ${resolved}/${batch.length} IPs (${geoIPQueue.size} remaining)`);
     }
   } catch (err) {
     // Re-queue on network errors
@@ -1287,10 +1170,7 @@ function rolloverVisitorStats() {
   const now = new Date().toISOString().slice(0, 10);
   if (now !== visitorStats.today) {
     // Save yesterday's stats to history
-    if (
-      visitorStats.uniqueIPsToday.length > 0 ||
-      visitorStats.totalRequestsToday > 0
-    ) {
+    if (visitorStats.uniqueIPsToday.length > 0 || visitorStats.totalRequestsToday > 0) {
       visitorStats.history.push({
         date: visitorStats.today,
         uniqueVisitors: visitorStats.uniqueIPsToday.length,
@@ -1304,10 +1184,7 @@ function rolloverVisitorStats() {
     }
     const avg =
       visitorStats.history.length > 0
-        ? Math.round(
-            visitorStats.history.reduce((sum, d) => sum + d.uniqueVisitors, 0) /
-              visitorStats.history.length,
-          )
+        ? Math.round(visitorStats.history.reduce((sum, d) => sum + d.uniqueVisitors, 0) / visitorStats.history.length)
         : 0;
     console.log(
       `[Stats] Daily rollover for ${visitorStats.today}: ${visitorStats.uniqueIPsToday.length} unique, ${visitorStats.totalRequestsToday} requests | All-time: ${visitorStats.allTimeVisitors} visitors | ${visitorStats.history.length}-day avg: ${avg}/day`,
@@ -1407,12 +1284,12 @@ const sessionTracker = {
         p90Duration: 0,
         maxDuration: 0,
         durationBuckets: {
-          'under1m': 0,
+          under1m: 0,
           '1to5m': 0,
           '5to15m': 0,
           '15to30m': 0,
           '30to60m': 0,
-          'over1h': 0,
+          over1h: 0,
         },
         recentTrend: [],
         activeSessions: [],
@@ -1420,21 +1297,19 @@ const sessionTracker = {
     }
 
     const durations = sessions.map((s) => s.duration).sort((a, b) => a - b);
-    const avg = Math.round(
-      durations.reduce((s, d) => s + d, 0) / durations.length,
-    );
+    const avg = Math.round(durations.reduce((s, d) => s + d, 0) / durations.length);
     const median = durations[Math.floor(durations.length / 2)];
     const p90 = durations[Math.floor(durations.length * 0.9)];
     const max = durations[durations.length - 1];
 
     // Duration distribution buckets
     const buckets = {
-      'under1m': 0,
+      under1m: 0,
       '1to5m': 0,
       '5to15m': 0,
       '15to30m': 0,
       '30to60m': 0,
-      'over1h': 0,
+      over1h: 0,
     };
     for (const d of durations) {
       if (d < 60000) buckets.under1m++;
@@ -1461,19 +1336,11 @@ const sessionTracker = {
         sessions: hourSessions.length,
         avgDuration:
           hourSessions.length > 0
-            ? Math.round(
-                hourSessions.reduce((s, x) => s + x.duration, 0) /
-                  hourSessions.length,
-              )
+            ? Math.round(hourSessions.reduce((s, x) => s + x.duration, 0) / hourSessions.length)
             : 0,
         avgDurationFormatted:
           hourSessions.length > 0
-            ? formatDuration(
-                Math.round(
-                  hourSessions.reduce((s, x) => s + x.duration, 0) /
-                    hourSessions.length,
-                ),
-              )
+            ? formatDuration(Math.round(hourSessions.reduce((s, x) => s + x.duration, 0) / hourSessions.length))
             : '--',
       });
     }
@@ -1512,8 +1379,7 @@ const sessionTracker = {
 
 function formatDuration(ms) {
   if (ms < 60000) return `${Math.round(ms / 1000)}s`;
-  if (ms < 3600000)
-    return `${Math.floor(ms / 60000)}m ${Math.round((ms % 60000) / 1000)}s`;
+  if (ms < 3600000) return `${Math.floor(ms / 60000)}m ${Math.round((ms % 60000) / 1000)}s`;
   return `${Math.floor(ms / 3600000)}h ${Math.floor((ms % 3600000) / 60000)}m`;
 }
 
@@ -1526,10 +1392,7 @@ app.use((req, res, next) => {
 
   // Track concurrent sessions for ALL requests (not just countable routes)
   const sessionIp =
-    req.headers['x-forwarded-for']?.split(',')[0]?.trim() ||
-    req.ip ||
-    req.connection?.remoteAddress ||
-    'unknown';
+    req.headers['x-forwarded-for']?.split(',')[0]?.trim() || req.ip || req.connection?.remoteAddress || 'unknown';
   if (req.path !== '/api/health' && !req.path.startsWith('/assets/')) {
     sessionTracker.touch(sessionIp, req.headers['user-agent']);
   }
@@ -1538,10 +1401,7 @@ app.use((req, res, next) => {
   const countableRoutes = ['/', '/index.html', '/api/config'];
   if (countableRoutes.includes(req.path)) {
     const ip =
-      req.headers['x-forwarded-for']?.split(',')[0]?.trim() ||
-      req.ip ||
-      req.connection?.remoteAddress ||
-      'unknown';
+      req.headers['x-forwarded-for']?.split(',')[0]?.trim() || req.ip || req.connection?.remoteAddress || 'unknown';
 
     // Track today's visitors
     const isNewToday = !todayIPSet.has(ip);
@@ -1577,18 +1437,10 @@ app.use((req, res, next) => {
 setInterval(
   () => {
     rolloverVisitorStats();
-    if (
-      visitorStats.uniqueIPsToday.length > 0 ||
-      visitorStats.allTimeVisitors > 0
-    ) {
+    if (visitorStats.uniqueIPsToday.length > 0 || visitorStats.allTimeVisitors > 0) {
       const avg =
         visitorStats.history.length > 0
-          ? Math.round(
-              visitorStats.history.reduce(
-                (sum, d) => sum + d.uniqueVisitors,
-                0,
-              ) / visitorStats.history.length,
-            )
+          ? Math.round(visitorStats.history.reduce((sum, d) => sum + d.uniqueVisitors, 0) / visitorStats.history.length)
           : visitorStats.uniqueIPsToday.length;
       console.log(
         `[Stats] Hourly: ${visitorStats.uniqueIPsToday.length} unique today, ${visitorStats.totalRequestsToday} requests | All-time: ${visitorStats.allTimeVisitors} visitors | Avg: ${avg}/day`,
@@ -1601,20 +1453,25 @@ setInterval(
 );
 
 // Log memory usage every 15 minutes for leak detection
-setInterval(() => {
-  const mem = process.memoryUsage();
-  const mb = (bytes) => (bytes / 1024 / 1024).toFixed(1);
-  const mqttStats = {
-    subscribers: pskMqtt.subscribers.size,
-    subscribedCalls: pskMqtt.subscribedCalls.size,
-    sseClients: [...pskMqtt.subscribers.values()].reduce((n, s) => n + s.size, 0),
-    recentSpotsEntries: pskMqtt.recentSpots.size,
-    recentSpotsTotal: [...pskMqtt.recentSpots.values()].reduce((n, s) => n + s.length, 0),
-    spotBufferEntries: pskMqtt.spotBuffer.size,
-    spotBufferTotal: [...pskMqtt.spotBuffer.values()].reduce((n, b) => n + b.length, 0),
-  };
-  console.log(`[Memory] RSS=${mb(mem.rss)}MB Heap=${mb(mem.heapUsed)}/${mb(mem.heapTotal)}MB External=${mb(mem.external)}MB | MQTT: ${mqttStats.sseClients} SSE clients, ${mqttStats.subscribedCalls} calls, ${mqttStats.recentSpotsTotal} recent spots (${mqttStats.recentSpotsEntries} entries), ${mqttStats.spotBufferTotal} buffered | GeoIP=${geoIPCache.size} CallLookup=${callsignLookupCache?.size || 0} LocCache=${callsignLocationCache?.size || 0} MySpots=${mySpotsCache.size} AllTimeIPs=${allTimeIPSet.size} RBN=${rbnSpotsByDX?.size || 0} RBNapi=${rbnApiCaches?.size || 0}`);
-}, 15 * 60 * 1000);
+setInterval(
+  () => {
+    const mem = process.memoryUsage();
+    const mb = (bytes) => (bytes / 1024 / 1024).toFixed(1);
+    const mqttStats = {
+      subscribers: pskMqtt.subscribers.size,
+      subscribedCalls: pskMqtt.subscribedCalls.size,
+      sseClients: [...pskMqtt.subscribers.values()].reduce((n, s) => n + s.size, 0),
+      recentSpotsEntries: pskMqtt.recentSpots.size,
+      recentSpotsTotal: [...pskMqtt.recentSpots.values()].reduce((n, s) => n + s.length, 0),
+      spotBufferEntries: pskMqtt.spotBuffer.size,
+      spotBufferTotal: [...pskMqtt.spotBuffer.values()].reduce((n, b) => n + b.length, 0),
+    };
+    console.log(
+      `[Memory] RSS=${mb(mem.rss)}MB Heap=${mb(mem.heapUsed)}/${mb(mem.heapTotal)}MB External=${mb(mem.external)}MB | MQTT: ${mqttStats.sseClients} SSE clients, ${mqttStats.subscribedCalls} calls, ${mqttStats.recentSpotsTotal} recent spots (${mqttStats.recentSpotsEntries} entries), ${mqttStats.spotBufferTotal} buffered | GeoIP=${geoIPCache.size} CallLookup=${callsignLookupCache?.size || 0} LocCache=${callsignLocationCache?.size || 0} MySpots=${mySpotsCache.size} AllTimeIPs=${allTimeIPSet.size} RBN=${rbnSpotsByDX?.size || 0} RBNapi=${rbnApiCaches?.size || 0}`,
+    );
+  },
+  15 * 60 * 1000,
+);
 
 // Periodic GC compaction — helps V8 release fragmented old-space memory
 // Without this, long-running processes slowly accumulate unreclaimable heap
@@ -1624,24 +1481,16 @@ setInterval(
       const memBefore = process.memoryUsage();
       global.gc();
       const memAfter = process.memoryUsage();
-      const heapFreed = (
-        (memBefore.heapUsed - memAfter.heapUsed) /
-        1024 /
-        1024
-      ).toFixed(1);
+      const heapFreed = ((memBefore.heapUsed - memAfter.heapUsed) / 1024 / 1024).toFixed(1);
       const rssNow = (memAfter.rss / 1024 / 1024).toFixed(0);
       if (heapFreed > 5) {
-        console.log(
-          `[GC] Compaction freed ${heapFreed}MB heap (RSS=${rssNow}MB)`,
-        );
+        console.log(`[GC] Compaction freed ${heapFreed}MB heap (RSS=${rssNow}MB)`);
       }
       // If RSS is still high after normal GC, do a second pass to release old-space pages
       if (memAfter.rss > 400 * 1024 * 1024) {
         global.gc();
         const rssAfter2 = (process.memoryUsage().rss / 1024 / 1024).toFixed(0);
-        console.log(
-          `[GC] High RSS — double compaction (${rssNow}MB -> ${rssAfter2}MB)`,
-        );
+        console.log(`[GC] High RSS — double compaction (${rssNow}MB -> ${rssAfter2}MB)`);
       }
     }
   },
@@ -1652,9 +1501,7 @@ setInterval(
 // AUTO UPDATE (GIT)
 // ============================================
 const AUTO_UPDATE_ENABLED = process.env.AUTO_UPDATE_ENABLED === 'true';
-const AUTO_UPDATE_INTERVAL_MINUTES = parseInt(
-  process.env.AUTO_UPDATE_INTERVAL_MINUTES || '60',
-);
+const AUTO_UPDATE_INTERVAL_MINUTES = parseInt(process.env.AUTO_UPDATE_INTERVAL_MINUTES || '60');
 const AUTO_UPDATE_ON_START = process.env.AUTO_UPDATE_ON_START === 'true';
 const AUTO_UPDATE_EXIT_AFTER = process.env.AUTO_UPDATE_EXIT_AFTER !== 'false';
 
@@ -1695,35 +1542,17 @@ async function getDefaultBranch() {
 async function hasGitUpdates() {
   // Ensure remote URL is correct
   try {
-    const { stdout: url } = await execFilePromise(
-      'git',
-      ['remote', 'get-url', 'origin'],
-      { cwd: __dirname },
-    );
+    const { stdout: url } = await execFilePromise('git', ['remote', 'get-url', 'origin'], { cwd: __dirname });
     if (!url.trim()) {
-      await execFilePromise(
-        'git',
-        [
-          'remote',
-          'add',
-          'origin',
-          'https://github.com/accius/openhamclock.git',
-        ],
-        { cwd: __dirname },
-      );
+      await execFilePromise('git', ['remote', 'add', 'origin', 'https://github.com/accius/openhamclock.git'], {
+        cwd: __dirname,
+      });
     }
   } catch {
     try {
-      await execFilePromise(
-        'git',
-        [
-          'remote',
-          'add',
-          'origin',
-          'https://github.com/accius/openhamclock.git',
-        ],
-        { cwd: __dirname },
-      );
+      await execFilePromise('git', ['remote', 'add', 'origin', 'https://github.com/accius/openhamclock.git'], {
+        cwd: __dirname,
+      });
     } catch {} // already exists
   }
 
@@ -1735,9 +1564,7 @@ async function hasGitUpdates() {
   // Reset branch cache after fetch (refs may have changed)
   _defaultBranch = null;
   const branch = await getDefaultBranch();
-  const local = (
-    await execFilePromise('git', ['rev-parse', 'HEAD'], { cwd: __dirname })
-  ).stdout.trim();
+  const local = (await execFilePromise('git', ['rev-parse', 'HEAD'], { cwd: __dirname })).stdout.trim();
   const remote = (
     await execFilePromise('git', ['rev-parse', `origin/${branch}`], {
       cwd: __dirname,
@@ -1749,12 +1576,7 @@ async function hasGitUpdates() {
 // Prevent chmod changes from showing as dirty (common on Pi, Mac, Windows/WSL)
 if (fs.existsSync(path.join(__dirname, '.git'))) {
   try {
-    execFile(
-      'git',
-      ['config', 'core.fileMode', 'false'],
-      { cwd: __dirname },
-      () => {},
-    );
+    execFile('git', ['config', 'core.fileMode', 'false'], { cwd: __dirname }, () => {});
   } catch {}
 }
 
@@ -1845,8 +1667,7 @@ async function autoUpdateTick(trigger = 'interval', force = false) {
 function startAutoUpdateScheduler() {
   if (!AUTO_UPDATE_ENABLED) return;
   const intervalMinutes =
-    Number.isFinite(AUTO_UPDATE_INTERVAL_MINUTES) &&
-    AUTO_UPDATE_INTERVAL_MINUTES > 0
+    Number.isFinite(AUTO_UPDATE_INTERVAL_MINUTES) && AUTO_UPDATE_INTERVAL_MINUTES > 0
       ? AUTO_UPDATE_INTERVAL_MINUTES
       : 60;
   const intervalMs = Math.max(5, intervalMinutes) * 60 * 1000;
@@ -1895,10 +1716,8 @@ const assetOptions = {
 // falls back to CDN redirect when vendor files haven't been downloaded yet.
 // Run: bash scripts/vendor-download.sh  to eliminate all external requests.
 const VENDOR_CDN_MAP = {
-  '/vendor/leaflet/leaflet.js':
-    'https://unpkg.com/leaflet@1.9.4/dist/leaflet.js',
-  '/vendor/leaflet/leaflet.css':
-    'https://unpkg.com/leaflet@1.9.4/dist/leaflet.css',
+  '/vendor/leaflet/leaflet.js': 'https://unpkg.com/leaflet@1.9.4/dist/leaflet.js',
+  '/vendor/leaflet/leaflet.css': 'https://unpkg.com/leaflet@1.9.4/dist/leaflet.css',
   '/vendor/fonts/fonts.css':
     'https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@300;400;500;600;700&family=Orbitron:wght@400;500;600;700;800;900&family=Space+Grotesk:wght@300;400;500;600;700&display=swap',
 };
@@ -1914,10 +1733,7 @@ app.use('/vendor', (req, res, next) => {
 if (distExists) {
   // Serve built React app from dist/
   // Hashed assets (with content hash in filename) can be cached forever
-  app.use(
-    '/assets',
-    express.static(path.join(distDir, 'assets'), assetOptions),
-  );
+  app.use('/assets', express.static(path.join(distDir, 'assets'), assetOptions));
   app.use(express.static(distDir, staticOptions));
   console.log('[Server] Serving React app from dist/');
 } else {
@@ -1946,15 +1762,10 @@ const NOAA_CACHE_TTL = 5 * 60 * 1000; // 5 minutes
 // NOAA Space Weather - Solar Flux
 app.get('/api/noaa/flux', async (req, res) => {
   try {
-    if (
-      noaaCache.flux.data &&
-      Date.now() - noaaCache.flux.timestamp < NOAA_CACHE_TTL
-    ) {
+    if (noaaCache.flux.data && Date.now() - noaaCache.flux.timestamp < NOAA_CACHE_TTL) {
       return res.json(noaaCache.flux.data);
     }
-    const response = await fetch(
-      'https://services.swpc.noaa.gov/json/f107_cm_flux.json',
-    );
+    const response = await fetch('https://services.swpc.noaa.gov/json/f107_cm_flux.json');
     const data = await response.json();
     noaaCache.flux = { data, timestamp: Date.now() };
     res.json(data);
@@ -1968,15 +1779,10 @@ app.get('/api/noaa/flux', async (req, res) => {
 // NOAA Space Weather - K-Index
 app.get('/api/noaa/kindex', async (req, res) => {
   try {
-    if (
-      noaaCache.kindex.data &&
-      Date.now() - noaaCache.kindex.timestamp < NOAA_CACHE_TTL
-    ) {
+    if (noaaCache.kindex.data && Date.now() - noaaCache.kindex.timestamp < NOAA_CACHE_TTL) {
       return res.json(noaaCache.kindex.data);
     }
-    const response = await fetch(
-      'https://services.swpc.noaa.gov/products/noaa-planetary-k-index.json',
-    );
+    const response = await fetch('https://services.swpc.noaa.gov/products/noaa-planetary-k-index.json');
     const data = await response.json();
     noaaCache.kindex = { data, timestamp: Date.now() };
     res.json(data);
@@ -1990,15 +1796,10 @@ app.get('/api/noaa/kindex', async (req, res) => {
 // NOAA Space Weather - Sunspots
 app.get('/api/noaa/sunspots', async (req, res) => {
   try {
-    if (
-      noaaCache.sunspots.data &&
-      Date.now() - noaaCache.sunspots.timestamp < NOAA_CACHE_TTL
-    ) {
+    if (noaaCache.sunspots.data && Date.now() - noaaCache.sunspots.timestamp < NOAA_CACHE_TTL) {
       return res.json(noaaCache.sunspots.data);
     }
-    const response = await fetch(
-      'https://services.swpc.noaa.gov/json/solar-cycle/observed-solar-cycle-indices.json',
-    );
+    const response = await fetch('https://services.swpc.noaa.gov/json/solar-cycle/observed-solar-cycle-indices.json');
     const data = await response.json();
     noaaCache.sunspots = { data, timestamp: Date.now() };
     res.json(data);
@@ -2017,27 +1818,17 @@ app.get('/api/noaa/sunspots', async (req, res) => {
 app.get('/api/solar-indices', async (req, res) => {
   try {
     // Check cache first
-    if (
-      noaaCache.solarIndices.data &&
-      Date.now() - noaaCache.solarIndices.timestamp < NOAA_CACHE_TTL
-    ) {
+    if (noaaCache.solarIndices.data && Date.now() - noaaCache.solarIndices.timestamp < NOAA_CACHE_TTL) {
       return res.json(noaaCache.solarIndices.data);
     }
 
-    const [fluxRes, kIndexRes, kForecastRes, sunspotRes, sfiSummaryRes] =
-      await Promise.allSettled([
-        fetch('https://services.swpc.noaa.gov/json/f107_cm_flux.json'),
-        fetch(
-          'https://services.swpc.noaa.gov/products/noaa-planetary-k-index.json',
-        ),
-        fetch(
-          'https://services.swpc.noaa.gov/products/noaa-planetary-k-index-forecast.json',
-        ),
-        fetch(
-          'https://services.swpc.noaa.gov/json/solar-cycle/observed-solar-cycle-indices.json',
-        ),
-        fetch('https://services.swpc.noaa.gov/products/summary/10cm-flux.json'),
-      ]);
+    const [fluxRes, kIndexRes, kForecastRes, sunspotRes, sfiSummaryRes] = await Promise.allSettled([
+      fetch('https://services.swpc.noaa.gov/json/f107_cm_flux.json'),
+      fetch('https://services.swpc.noaa.gov/products/noaa-planetary-k-index.json'),
+      fetch('https://services.swpc.noaa.gov/products/noaa-planetary-k-index-forecast.json'),
+      fetch('https://services.swpc.noaa.gov/json/solar-cycle/observed-solar-cycle-indices.json'),
+      fetch('https://services.swpc.noaa.gov/products/summary/10cm-flux.json'),
+    ]);
 
     const result = {
       sfi: { current: null, history: [] },
@@ -2073,8 +1864,7 @@ app.get('/api/solar-indices', async (req, res) => {
         }));
         // Only use archive for current if we still don't have one
         if (!result.sfi.current) {
-          result.sfi.current =
-            result.sfi.history[result.sfi.history.length - 1]?.value || null;
+          result.sfi.current = result.sfi.history[result.sfi.history.length - 1]?.value || null;
         }
       }
     }
@@ -2088,8 +1878,7 @@ app.get('/api/solar-indices', async (req, res) => {
           time: d[0],
           value: parseFloat(d[1]) || 0,
         }));
-        result.kp.current =
-          result.kp.history[result.kp.history.length - 1]?.value || null;
+        result.kp.current = result.kp.history[result.kp.history.length - 1]?.value || null;
       }
     }
 
@@ -2121,8 +1910,7 @@ app.get('/api/solar-indices', async (req, res) => {
         }));
         // Only use monthly archive for current if we still don't have one
         if (result.ssn.current == null) {
-          result.ssn.current =
-            result.ssn.history[result.ssn.history.length - 1]?.value || null;
+          result.ssn.current = result.ssn.history[result.ssn.history.length - 1]?.value || null;
         }
       }
     }
@@ -2134,8 +1922,7 @@ app.get('/api/solar-indices', async (req, res) => {
   } catch (error) {
     logErrorOnce('Solar Indices', error.message);
     // Return stale cache on error
-    if (noaaCache.solarIndices.data)
-      return res.json(noaaCache.solarIndices.data);
+    if (noaaCache.solarIndices.data) return res.json(noaaCache.solarIndices.data);
     res.status(500).json({ error: 'Failed to fetch solar indices' });
   }
 });
@@ -2149,15 +1936,8 @@ app.get('/api/dxpeditions', async (req, res) => {
     logDebug('[DXpeditions] API called');
 
     // Return cached data if fresh
-    if (
-      dxpeditionCache.data &&
-      now - dxpeditionCache.timestamp < dxpeditionCache.maxAge
-    ) {
-      logDebug(
-        '[DXpeditions] Returning cached data:',
-        dxpeditionCache.data.dxpeditions?.length,
-        'entries',
-      );
+    if (dxpeditionCache.data && now - dxpeditionCache.timestamp < dxpeditionCache.maxAge) {
+      logDebug('[DXpeditions] Returning cached data:', dxpeditionCache.data.dxpeditions?.length, 'entries');
       return res.json(dxpeditionCache.data);
     }
 
@@ -2235,9 +2015,7 @@ app.get('/api/dxpeditions', async (req, res) => {
       let dateStr = null;
 
       // Strategy 1: "DXCC: xxx Callsign: xxx" format
-      const dxccMatch = entry.match(
-        /DXCC:\s*([^C\n]+?)(?=Callsign:|QSL:|Source:|Info:|$)/i,
-      );
+      const dxccMatch = entry.match(/DXCC:\s*([^C\n]+?)(?=Callsign:|QSL:|Source:|Info:|$)/i);
       const callMatch = entry.match(/Callsign:\s*([A-Z0-9\/]+)/i);
 
       if (callMatch && dxccMatch) {
@@ -2247,9 +2025,7 @@ app.get('/api/dxpeditions', async (req, res) => {
 
       // Strategy 2: Look for callsign patterns directly (like "3Y0K" or "VP8/G3ABC")
       if (!callsign) {
-        const directCallMatch = entry.match(
-          /\b([A-Z]{1,2}\d[A-Z0-9]*[A-Z](?:\/[A-Z0-9]+)?)\b/,
-        );
+        const directCallMatch = entry.match(/\b([A-Z]{1,2}\d[A-Z0-9]*[A-Z](?:\/[A-Z0-9]+)?)\b/);
         if (directCallMatch) {
           callsign = directCallMatch[1];
         }
@@ -2257,9 +2033,7 @@ app.get('/api/dxpeditions', async (req, res) => {
 
       // Strategy 3: Parse "Entity - Callsign" or similar patterns
       if (!callsign) {
-        const altMatch = entry.match(
-          /([A-Za-z\s&]+?)\s*[-–:]\s*([A-Z]{1,2}\d[A-Z0-9]*)/,
-        );
+        const altMatch = entry.match(/([A-Za-z\s&]+?)\s*[-–:]\s*([A-Z]{1,2}\d[A-Z0-9]*)/);
         if (altMatch) {
           entity = altMatch[1].trim();
           callsign = altMatch[2].trim();
@@ -2301,20 +2075,7 @@ app.get('/api/dxpeditions', async (req, res) => {
       let isUpcoming = false;
 
       if (dateStr) {
-        const monthNames = [
-          'jan',
-          'feb',
-          'mar',
-          'apr',
-          'may',
-          'jun',
-          'jul',
-          'aug',
-          'sep',
-          'oct',
-          'nov',
-          'dec',
-        ];
+        const monthNames = ['jan', 'feb', 'mar', 'apr', 'may', 'jun', 'jul', 'aug', 'sep', 'oct', 'nov', 'dec'];
         const datePattern =
           /([A-Za-z]{3})\s+(\d{1,2})(?:,?\s*(\d{4}))?(?:\s*[-–]\s*([A-Za-z]{3})?\s*(\d{1,2})(?:,?\s*(\d{4}))?)?/i;
         const dateParsed = dateStr.match(datePattern);
@@ -2323,9 +2084,7 @@ app.get('/api/dxpeditions', async (req, res) => {
           const currentYear = new Date().getFullYear();
           const startMonth = monthNames.indexOf(dateParsed[1].toLowerCase());
           const startDay = parseInt(dateParsed[2]);
-          const startYear = dateParsed[3]
-            ? parseInt(dateParsed[3])
-            : currentYear;
+          const startYear = dateParsed[3] ? parseInt(dateParsed[3]) : currentYear;
 
           const endMonthStr = dateParsed[4] || dateParsed[1];
           const endMonth = monthNames.indexOf(endMonthStr.toLowerCase());
@@ -2334,11 +2093,7 @@ app.get('/api/dxpeditions', async (req, res) => {
 
           if (startMonth >= 0) {
             startDate = new Date(startYear, startMonth, startDay);
-            endDate = new Date(
-              endYear,
-              endMonth >= 0 ? endMonth : startMonth,
-              endDay,
-            );
+            endDate = new Date(endYear, endMonth >= 0 ? endMonth : startMonth, endDay);
 
             if (endDate < startDate && !dateParsed[6]) {
               endDate.setFullYear(endYear + 1);
@@ -2357,12 +2112,8 @@ app.get('/api/dxpeditions', async (req, res) => {
       const bandsMatch = entry.match(/(\d+(?:-\d+)?m)/g);
       const bands = bandsMatch ? [...new Set(bandsMatch)].join(' ') : '';
 
-      const modesMatch = entry.match(
-        /\b(CW|SSB|FT8|FT4|RTTY|PSK|FM|AM|DIGI)\b/gi,
-      );
-      const modes = modesMatch
-        ? [...new Set(modesMatch.map((m) => m.toUpperCase()))].join(' ')
-        : '';
+      const modesMatch = entry.match(/\b(CW|SSB|FT8|FT4|RTTY|PSK|FM|AM|DIGI)\b/gi);
+      const modes = modesMatch ? [...new Set(modesMatch.map((m) => m.toUpperCase()))].join(' ') : '';
 
       dxpeditions.push({
         callsign,
@@ -2393,21 +2144,13 @@ app.get('/api/dxpeditions', async (req, res) => {
       if (!a.isActive && b.isActive) return 1;
       if (a.isUpcoming && !b.isUpcoming) return -1;
       if (!a.isUpcoming && b.isUpcoming) return 1;
-      if (a.startDate && b.startDate)
-        return new Date(a.startDate) - new Date(b.startDate);
+      if (a.startDate && b.startDate) return new Date(a.startDate) - new Date(b.startDate);
       return 0;
     });
 
-    logDebug(
-      '[DXpeditions] Parsed',
-      uniqueDxpeditions.length,
-      'unique entries',
-    );
+    logDebug('[DXpeditions] Parsed', uniqueDxpeditions.length, 'unique entries');
     if (uniqueDxpeditions.length > 0) {
-      logDebug(
-        '[DXpeditions] First entry:',
-        JSON.stringify(uniqueDxpeditions[0]),
-      );
+      logDebug('[DXpeditions] First entry:', JSON.stringify(uniqueDxpeditions[0]));
     }
 
     const result = {
@@ -2418,13 +2161,7 @@ app.get('/api/dxpeditions', async (req, res) => {
       timestamp: new Date().toISOString(),
     };
 
-    logDebug(
-      '[DXpeditions] Result:',
-      result.active,
-      'active,',
-      result.upcoming,
-      'upcoming',
-    );
+    logDebug('[DXpeditions] Result:', result.active, 'active,', result.upcoming, 'upcoming');
 
     dxpeditionCache.data = result;
     dxpeditionCache.timestamp = now;
@@ -2445,15 +2182,10 @@ app.get('/api/dxpeditions', async (req, res) => {
 // NOAA Space Weather - X-Ray Flux
 app.get('/api/noaa/xray', async (req, res) => {
   try {
-    if (
-      noaaCache.xray.data &&
-      Date.now() - noaaCache.xray.timestamp < NOAA_CACHE_TTL
-    ) {
+    if (noaaCache.xray.data && Date.now() - noaaCache.xray.timestamp < NOAA_CACHE_TTL) {
       return res.json(noaaCache.xray.data);
     }
-    const response = await fetch(
-      'https://services.swpc.noaa.gov/json/goes/primary/xrays-6-hour.json',
-    );
+    const response = await fetch('https://services.swpc.noaa.gov/json/goes/primary/xrays-6-hour.json');
     const data = await response.json();
     noaaCache.xray = { data, timestamp: Date.now() };
     res.json(data);
@@ -2468,15 +2200,10 @@ app.get('/api/noaa/xray', async (req, res) => {
 const AURORA_CACHE_TTL = 30 * 60 * 1000; // 30 minutes (matches NOAA update frequency)
 app.get('/api/noaa/aurora', async (req, res) => {
   try {
-    if (
-      noaaCache.aurora.data &&
-      Date.now() - noaaCache.aurora.timestamp < AURORA_CACHE_TTL
-    ) {
+    if (noaaCache.aurora.data && Date.now() - noaaCache.aurora.timestamp < AURORA_CACHE_TTL) {
       return res.json(noaaCache.aurora.data);
     }
-    const response = await fetch(
-      'https://services.swpc.noaa.gov/json/ovation_aurora_latest.json',
-    );
+    const response = await fetch('https://services.swpc.noaa.gov/json/ovation_aurora_latest.json');
     const data = await response.json();
     noaaCache.aurora = { data, timestamp: Date.now() };
     res.json(data);
@@ -2493,10 +2220,7 @@ const DXNEWS_CACHE_TTL = 30 * 60 * 1000; // 30 minutes
 
 app.get('/api/dxnews', async (req, res) => {
   try {
-    if (
-      dxNewsCache.data &&
-      Date.now() - dxNewsCache.timestamp < DXNEWS_CACHE_TTL
-    ) {
+    if (dxNewsCache.data && Date.now() - dxNewsCache.timestamp < DXNEWS_CACHE_TTL) {
       return res.json(dxNewsCache.data);
     }
 
@@ -2523,9 +2247,7 @@ app.get('/api/dxnews', async (req, res) => {
         // Extract title
         const titleMatch = block.match(/title="([^"]+)"/);
         // Extract date
-        const dateMatch = block.match(
-          /(\d{4}-\d{2}-\d{2}\s+\d{2}:\d{2}:\d{2})/,
-        );
+        const dateMatch = block.match(/(\d{4}-\d{2}-\d{2}\s+\d{2}:\d{2}:\d{2})/);
         // Extract description - text after the date, before stats
         const descParts = block.split(/\d{4}-\d{2}-\d{2}\s+\d{2}:\d{2}:\d{2}/);
         let desc = '';
@@ -2573,7 +2295,7 @@ const POTA_CACHE_TTL = 90 * 1000; // 90 seconds (longer than 60s frontend poll t
 app.get('/api/pota/spots', async (req, res) => {
   try {
     // Return cached data if fresh
-    if (potaCache.data && (Date.now() - potaCache.timestamp) < POTA_CACHE_TTL) {
+    if (potaCache.data && Date.now() - potaCache.timestamp < POTA_CACHE_TTL) {
       res.set('Cache-Control', 'no-store');
       return res.json(potaCache.data);
     }
@@ -2584,23 +2306,14 @@ app.get('/api/pota/spots', async (req, res) => {
     // Log diagnostic info about the response
     if (Array.isArray(data) && data.length > 0) {
       const sample = data[0];
-      logDebug(
-        '[POTA] API returned',
-        data.length,
-        'spots. Sample fields:',
-        Object.keys(sample).join(', '),
-      );
+      logDebug('[POTA] API returned', data.length, 'spots. Sample fields:', Object.keys(sample).join(', '));
 
       // Count coordinate coverage
       const withLatLon = data.filter((s) => s.latitude && s.longitude).length;
       const withGrid6 = data.filter((s) => s.grid6).length;
       const withGrid4 = data.filter((s) => s.grid4).length;
-      const noCoords = data.filter(
-        (s) => !s.latitude && !s.longitude && !s.grid6 && !s.grid4,
-      ).length;
-      logDebug(
-        `[POTA] Coords: ${withLatLon} lat/lon, ${withGrid6} grid6, ${withGrid4} grid4, ${noCoords} no coords`,
-      );
+      const noCoords = data.filter((s) => !s.latitude && !s.longitude && !s.grid6 && !s.grid4).length;
+      logDebug(`[POTA] Coords: ${withLatLon} lat/lon, ${withGrid6} grid6, ${withGrid4} grid4, ${noCoords} no coords`);
     }
 
     // Cache the response
@@ -2610,7 +2323,7 @@ app.get('/api/pota/spots', async (req, res) => {
   } catch (error) {
     logErrorOnce('POTA', error.message);
     // Return stale cache on error, but only if less than 10 minutes old
-    if (potaCache.data && (Date.now() - potaCache.timestamp) < 10 * 60 * 1000) return res.json(potaCache.data);
+    if (potaCache.data && Date.now() - potaCache.timestamp < 10 * 60 * 1000) return res.json(potaCache.data);
     res.status(500).json({ error: 'Failed to fetch POTA spots' });
   }
 });
@@ -2622,7 +2335,7 @@ const WWFF_CACHE_TTL = 90 * 1000; // 90 seconds (longer than 60s frontend poll t
 app.get('/api/wwff/spots', async (req, res) => {
   try {
     // Return cached data if fresh
-    if (wwffCache.data && (Date.now() - wwffCache.timestamp) < WWFF_CACHE_TTL) {
+    if (wwffCache.data && Date.now() - wwffCache.timestamp < WWFF_CACHE_TTL) {
       res.set('Cache-Control', 'no-store');
       return res.json(wwffCache.data);
     }
@@ -2633,12 +2346,7 @@ app.get('/api/wwff/spots', async (req, res) => {
     // Log diagnostic info about the response
     if (Array.isArray(data) && data.length > 0) {
       const sample = data[0];
-      logDebug(
-        '[WWFF] API returned',
-        data.length,
-        'spots. Sample fields:',
-        Object.keys(sample).join(', '),
-      );
+      logDebug('[WWFF] API returned', data.length, 'spots. Sample fields:', Object.keys(sample).join(', '));
     }
 
     // Cache the response
@@ -2648,7 +2356,7 @@ app.get('/api/wwff/spots', async (req, res) => {
   } catch (error) {
     logErrorOnce('WWFF', error.message);
     // Return stale cache on error, but only if less than 10 minutes old
-    if (wwffCache.data && (Date.now() - wwffCache.timestamp) < 10 * 60 * 1000) return res.json(wwffCache.data);
+    if (wwffCache.data && Date.now() - wwffCache.timestamp < 10 * 60 * 1000) return res.json(wwffCache.data);
     res.status(500).json({ error: 'Failed to fetch WWFF spots' });
   }
 });
@@ -2666,10 +2374,7 @@ const SOTASUMMITS_CACHE_TTL = 24 * 60 * 60 * 1000; // 1 day
 async function checkSummitCache() {
   const now = Date.now();
   try {
-    if (
-      sotaSummits.data &&
-      now - sotaSummits.timestamp < SOTASUMMITS_CACHE_TTL
-    ) {
+    if (sotaSummits.data && now - sotaSummits.timestamp < SOTASUMMITS_CACHE_TTL) {
       return;
     }
     logDebug('[SOTA] Refreshing sotaSummits');
@@ -2677,14 +2382,13 @@ async function checkSummitCache() {
     const data = await response.text();
     const Papa = require('papaparse');
     const csvresults = Papa.parse(data, {
-        skipFirstNLines: 1,
-        header: true
-      }
-    );
+      skipFirstNLines: 1,
+      header: true,
+    });
 
     let summit = {};
 
-    csvresults.data.forEach( obj => {
+    csvresults.data.forEach((obj) => {
       summit[obj['SummitCode']] = {
         latitude: obj['Latitude'],
         longitude: obj['Longitude'],
@@ -2708,7 +2412,7 @@ checkSummitCache(); // Prime the sotaSummits cache
 app.get('/api/sota/spots', async (req, res) => {
   try {
     // Return cached data if fresh
-    if (sotaCache.data && (Date.now() - sotaCache.timestamp) < SOTA_CACHE_TTL) {
+    if (sotaCache.data && Date.now() - sotaCache.timestamp < SOTA_CACHE_TTL) {
       res.set('Cache-Control', 'no-store');
       return res.json(sotaCache.data);
     }
@@ -2727,12 +2431,7 @@ app.get('/api/sota/spots', async (req, res) => {
     }
     if (Array.isArray(data) && data.length > 0) {
       const sample = data[0];
-      logDebug(
-        '[SOTA] API returned',
-        data.length,
-        'spots. Sample fields:',
-        Object.keys(sample).join(', '),
-      );
+      logDebug('[SOTA] API returned', data.length, 'spots. Sample fields:', Object.keys(sample).join(', '));
     }
 
     // Cache the response
@@ -2742,7 +2441,7 @@ app.get('/api/sota/spots', async (req, res) => {
   } catch (error) {
     logErrorOnce('SOTA', error.message);
     // Return stale cache on error, but only if less than 10 minutes old
-    if (sotaCache.data && (Date.now() - sotaCache.timestamp) < 10 * 60 * 1000) return res.json(sotaCache.data);
+    if (sotaCache.data && Date.now() - sotaCache.timestamp < 10 * 60 * 1000) return res.json(sotaCache.data);
     res.status(500).json({ error: 'Failed to fetch SOTA spots' });
   }
 });
@@ -2775,8 +2474,7 @@ function parseN0NBHxml(xml) {
 
   // Parse VHF conditions
   const vhfConditions = [];
-  const vhfRegex =
-    /<phenomenon name="([^"]+)" location="([^"]+)">([^<]+)<\/phenomenon>/g;
+  const vhfRegex = /<phenomenon name="([^"]+)" location="([^"]+)">([^<]+)<\/phenomenon>/g;
   while ((match = vhfRegex.exec(xml)) !== null) {
     vhfConditions.push({
       name: match[1],
@@ -2817,10 +2515,7 @@ function parseN0NBHxml(xml) {
 // N0NBH Parsed Band Conditions + Solar Data
 app.get('/api/n0nbh', async (req, res) => {
   try {
-    if (
-      n0nbhCache.data &&
-      Date.now() - n0nbhCache.timestamp < N0NBH_CACHE_TTL
-    ) {
+    if (n0nbhCache.data && Date.now() - n0nbhCache.timestamp < N0NBH_CACHE_TTL) {
       return res.json(n0nbhCache.data);
     }
 
@@ -2841,10 +2536,7 @@ app.get('/api/n0nbh', async (req, res) => {
 app.get('/api/hamqsl/conditions', async (req, res) => {
   try {
     // Use N0NBH cache if fresh, otherwise fetch
-    if (
-      n0nbhCache.data &&
-      Date.now() - n0nbhCache.timestamp < N0NBH_CACHE_TTL
-    ) {
+    if (n0nbhCache.data && Date.now() - n0nbhCache.timestamp < N0NBH_CACHE_TTL) {
       // Re-fetch raw XML from cache won't work since we only store parsed,
       // so just fetch fresh if needed
     }
@@ -2864,9 +2556,7 @@ app.get('/api/hamqsl/conditions', async (req, res) => {
 // The 'proxy' source uses our DX Spider Proxy microservice
 
 // DX Spider Proxy URL (sibling service on Railway or external)
-const DXSPIDER_PROXY_URL =
-  process.env.DXSPIDER_PROXY_URL ||
-  'https://dxspider-proxy-production-1ec7.up.railway.app';
+const DXSPIDER_PROXY_URL = process.env.DXSPIDER_PROXY_URL || 'https://dxspider-proxy-production-1ec7.up.railway.app';
 
 // Cache for DX Spider telnet spots (to avoid excessive connections)
 let dxSpiderCache = { spots: [], timestamp: 0 };
@@ -2883,11 +2573,7 @@ const DXSPIDER_NODES = [
 const DXSPIDER_SSID = '-56'; // OpenHamClock SSID
 
 function getDxClusterLoginCallsign(preferredCallsign = null) {
-  const candidate = (
-    preferredCallsign ||
-    CONFIG.dxClusterCallsign ||
-    ''
-  ).trim();
+  const candidate = (preferredCallsign || CONFIG.dxClusterCallsign || '').trim();
   if (candidate && candidate.toUpperCase() !== 'N0CALL') {
     return candidate.toUpperCase();
   }
@@ -2909,17 +2595,7 @@ function parseDXSpiderSpotLine(line) {
     if (!/^\d{4}$/.test(hhmm)) return Date.now();
     const hh = parseInt(hhmm.substring(0, 2), 10);
     const mm = parseInt(hhmm.substring(2, 4), 10);
-    const dt = new Date(
-      Date.UTC(
-        now.getUTCFullYear(),
-        now.getUTCMonth(),
-        now.getUTCDate(),
-        hh,
-        mm,
-        0,
-        0,
-      ),
-    );
+    const dt = new Date(Date.UTC(now.getUTCFullYear(), now.getUTCMonth(), now.getUTCDate(), hh, mm, 0, 0));
     // If parsed time is too far in the future, assume spot was yesterday.
     if (dt.getTime() - Date.now() > 5 * 60 * 1000) {
       dt.setUTCDate(dt.getUTCDate() - 1);
@@ -2930,9 +2606,7 @@ function parseDXSpiderSpotLine(line) {
   // Format 1: classic stream line
   // DX de SPOTTER:  14074.0 DXCALL comment 1234Z
   if (line.includes('DX de ')) {
-    const match = line.match(
-      /DX de ([A-Z0-9\/\-]+):\s+(\d+\.?\d*)\s+([A-Z0-9\/\-]+)\s+(.+?)\s+(\d{4})Z/i,
-    );
+    const match = line.match(/DX de ([A-Z0-9\/\-]+):\s+(\d+\.?\d*)\s+([A-Z0-9\/\-]+)\s+(.+?)\s+(\d{4})Z/i);
     if (match) {
       const freqKhz = parseFloat(match[2]);
       if (isNaN(freqKhz) || freqKhz <= 0) return null;
@@ -2956,9 +2630,7 @@ function parseDXSpiderSpotLine(line) {
   if (tableMatch) {
     const freqKhz = parseFloat(tableMatch[1]);
     if (isNaN(freqKhz) || freqKhz <= 0) return null;
-    const fullDateMatch = line.match(
-      /^\s*\d+\.?\d*\s+[A-Z0-9\/\-]+\s+(\d{1,2})-([A-Za-z]{3})-(\d{4})\s+(\d{4})Z/i,
-    );
+    const fullDateMatch = line.match(/^\s*\d+\.?\d*\s+[A-Z0-9\/\-]+\s+(\d{1,2})-([A-Za-z]{3})-(\d{4})\s+(\d{4})Z/i);
     let timestampMs = Date.now();
     if (fullDateMatch) {
       const day = parseInt(fullDateMatch[1], 10);
@@ -3156,10 +2828,7 @@ function connectCustomSession(session) {
       !err.message.includes('ENOTFOUND') &&
       !err.message.includes('ECONNREFUSED')
     ) {
-      logErrorOnce(
-        'DX Cluster',
-        `Custom DX Spider ${session.node.host}: ${err.message}`,
-      );
+      logErrorOnce('DX Cluster', `Custom DX Spider ${session.node.host}: ${err.message}`);
     }
     handleCustomSessionDisconnect(session);
   });
@@ -3237,9 +2906,7 @@ function tryDXSpiderNode(node, userCallsign = null) {
 
     // Try connecting to DX Spider node
     client.connect(node.port, node.host, () => {
-      logDebug(
-        `[DX Cluster] DX Spider: connected to ${node.host}:${node.port} as ${loginCallsign}`,
-      );
+      logDebug(`[DX Cluster] DX Spider: connected to ${node.host}:${node.port} as ${loginCallsign}`);
     });
 
     client.on('data', (data) => {
@@ -3270,9 +2937,7 @@ function tryDXSpiderNode(node, userCallsign = null) {
         commandSent = true;
         setTimeout(() => {
           if (!finished) {
-            logInfo(
-              `[DX Cluster] Sending command: sh/dx 25 to ${node.host}:${node.port} as ${loginCallsign}`,
-            );
+            logInfo(`[DX Cluster] Sending command: sh/dx 25 to ${node.host}:${node.port} as ${loginCallsign}`);
             client.write('sh/dx 25\r\n');
           }
         }, 1000);
@@ -3285,14 +2950,7 @@ function tryDXSpiderNode(node, userCallsign = null) {
         const parsed = parseDXSpiderSpotLine(line);
         if (!parsed) continue;
         // Avoid duplicates
-        if (
-          !spots.find(
-            (s) =>
-              s.call === parsed.call &&
-              s.freq === parsed.freq &&
-              s.spotter === parsed.spotter,
-          )
-        ) {
+        if (!spots.find((s) => s.call === parsed.call && s.freq === parsed.freq && s.spotter === parsed.spotter)) {
           spots.push(parsed);
         }
       }
@@ -3323,12 +2981,7 @@ function tryDXSpiderNode(node, userCallsign = null) {
 
     client.on('close', () => {
       if (!finished && spots.length > 0) {
-        logDebug(
-          '[DX Cluster] DX Spider:',
-          spots.length,
-          'spots from',
-          node.host,
-        );
+        logDebug('[DX Cluster] DX Spider:', spots.length, 'spots from', node.host);
         dxSpiderCache = { spots: spots, timestamp: Date.now() };
       }
       finalize(spots.length > 0 ? spots : null);
@@ -3338,12 +2991,7 @@ function tryDXSpiderNode(node, userCallsign = null) {
     setTimeout(() => {
       if (!finished) {
         if (spots.length > 0) {
-          logDebug(
-            '[DX Cluster] DX Spider:',
-            spots.length,
-            'spots from',
-            node.host,
-          );
+          logDebug('[DX Cluster] DX Spider:', spots.length, 'spots from', node.host);
           dxSpiderCache = { spots: spots, timestamp: Date.now() };
         }
         finalize(spots.length > 0 ? spots : null);
@@ -3353,11 +3001,7 @@ function tryDXSpiderNode(node, userCallsign = null) {
 }
 
 app.get('/api/dxcluster/spots', async (req, res) => {
-  const source = (
-    req.query.source ||
-    CONFIG.dxClusterSource ||
-    'auto'
-  ).toLowerCase();
+  const source = (req.query.source || CONFIG.dxClusterSource || 'auto').toLowerCase();
 
   // Helper function for HamQTH (HTTP-based, works everywhere)
   async function fetchHamQTH() {
@@ -3365,13 +3009,10 @@ app.get('/api/dxcluster/spots', async (req, res) => {
     const timeout = setTimeout(() => controller.abort(), 10000);
 
     try {
-      const response = await fetch(
-        'https://www.hamqth.com/dxc_csv.php?limit=25',
-        {
-          headers: { 'User-Agent': 'OpenHamClock/3.13.1' },
-          signal: controller.signal,
-        },
-      );
+      const response = await fetch('https://www.hamqth.com/dxc_csv.php?limit=25', {
+        headers: { 'User-Agent': 'OpenHamClock/3.13.1' },
+        signal: controller.signal,
+      });
       clearTimeout(timeout);
 
       if (response.ok) {
@@ -3393,15 +3034,13 @@ app.get('/api/dxcluster/spots', async (req, res) => {
             const timeDate = parts[4] || '';
 
             // Frequency: convert from kHz to MHz
-            const freqMhz =
-              freqKhz > 1000 ? (freqKhz / 1000).toFixed(3) : String(freqKhz);
+            const freqMhz = freqKhz > 1000 ? (freqKhz / 1000).toFixed(3) : String(freqKhz);
 
             // Time: extract HHMM from "2149 2025-05-27" format
             let time = '';
             if (timeDate && timeDate.length >= 4) {
               const timeStr = timeDate.substring(0, 4);
-              time =
-                timeStr.substring(0, 2) + ':' + timeStr.substring(2, 4) + 'z';
+              time = timeStr.substring(0, 2) + ':' + timeStr.substring(2, 4) + 'z';
             }
 
             return {
@@ -3432,13 +3071,10 @@ app.get('/api/dxcluster/spots', async (req, res) => {
     const timeout = setTimeout(() => controller.abort(), 10000);
 
     try {
-      const response = await fetch(
-        `${DXSPIDER_PROXY_URL}/api/dxcluster/spots?limit=50`,
-        {
-          headers: { 'User-Agent': 'OpenHamClock/3.13.1' },
-          signal: controller.signal,
-        },
-      );
+      const response = await fetch(`${DXSPIDER_PROXY_URL}/api/dxcluster/spots?limit=50`, {
+        headers: { 'User-Agent': 'OpenHamClock/3.13.1' },
+        signal: controller.signal,
+      });
       clearTimeout(timeout);
 
       if (response.ok) {
@@ -3461,15 +3097,8 @@ app.get('/api/dxcluster/spots', async (req, res) => {
   // Multiple nodes for failover - uses module-level constants and tryDXSpiderNode
   async function fetchDXSpider() {
     // Check cache first (use longer cache to reduce connection attempts)
-    if (
-      Date.now() - dxSpiderCache.timestamp < DXSPIDER_CACHE_TTL &&
-      dxSpiderCache.spots.length > 0
-    ) {
-      logDebug(
-        '[DX Cluster] DX Spider: returning',
-        dxSpiderCache.spots.length,
-        'cached spots',
-      );
+    if (Date.now() - dxSpiderCache.timestamp < DXSPIDER_CACHE_TTL && dxSpiderCache.spots.length > 0) {
+      logDebug('[DX Cluster] DX Spider: returning', dxSpiderCache.spots.length, 'cached spots');
       return dxSpiderCache.spots;
     }
 
@@ -3529,8 +3158,7 @@ app.get('/api/dxcluster/sources', (req, res) => {
     {
       id: 'proxy',
       name: 'DX Spider Proxy ⭐',
-      description:
-        'Our dedicated proxy service - real-time telnet feed via HTTP',
+      description: 'Our dedicated proxy service - real-time telnet feed via HTTP',
     },
     {
       id: 'hamqth',
@@ -3573,19 +3201,10 @@ function parseSpotHHMMzToTimestamp(timeStr, fallbackTs = Date.now()) {
   if (!m) return fallbackTs;
   const hh = parseInt(m[1], 10);
   const mm = parseInt(m[2], 10);
-  if (!Number.isFinite(hh) || !Number.isFinite(mm) || hh > 23 || mm > 59)
-    return fallbackTs;
+  if (!Number.isFinite(hh) || !Number.isFinite(mm) || hh > 23 || mm > 59) return fallbackTs;
 
   const now = new Date();
-  const ts = Date.UTC(
-    now.getUTCFullYear(),
-    now.getUTCMonth(),
-    now.getUTCDate(),
-    hh,
-    mm,
-    0,
-    0,
-  );
+  const ts = Date.UTC(now.getUTCFullYear(), now.getUTCMonth(), now.getUTCDate(), hh, mm, 0, 0);
   // If parsed time is slightly ahead of now, assume it belongs to previous UTC day.
   if (ts - Date.now() > 5 * 60 * 1000) {
     return ts - 24 * 60 * 60 * 1000;
@@ -3598,14 +3217,8 @@ app.get('/api/dxcluster/paths', async (req, res) => {
   const source = req.query.source || 'auto';
   const customHost = (req.query.host || CONFIG.dxClusterHost || '').trim();
   const parsedPort = parseInt(req.query.port, 10);
-  const customPort = Number.isFinite(parsedPort)
-    ? parsedPort
-    : CONFIG.dxClusterPort;
-  const userCallsign = (
-    req.query.callsign ||
-    CONFIG.dxClusterCallsign ||
-    ''
-  ).trim();
+  const customPort = Number.isFinite(parsedPort) ? parsedPort : CONFIG.dxClusterPort;
+  const userCallsign = (req.query.callsign || CONFIG.dxClusterCallsign || '').trim();
 
   // SECURITY: Validate custom host to prevent SSRF (internal network scanning)
   if (source === 'custom' && customHost) {
@@ -3613,9 +3226,7 @@ app.get('/api/dxcluster/paths', async (req, res) => {
     const blockedPatterns =
       /^(localhost|127\.|10\.|172\.(1[6-9]|2\d|3[01])\.|192\.168\.|169\.254\.|0\.|0:|\[::1\]|::1|fe80:|fc00:|fd00:|ff00:)/i;
     if (blockedPatterns.test(customHost)) {
-      return res
-        .status(400)
-        .json({ error: 'Custom host cannot be a private/reserved address' });
+      return res.status(400).json({ error: 'Custom host cannot be a private/reserved address' });
     }
     // Block numeric-only hosts (raw IPs) that could be encoded to bypass above
     // Only allow hostnames that look like legitimate DX Spider nodes
@@ -3629,16 +3240,12 @@ app.get('/api/dxcluster/paths', async (req, res) => {
         (octets[0] === 192 && octets[1] === 168) ||
         (octets[0] === 169 && octets[1] === 254)
       ) {
-        return res
-          .status(400)
-          .json({ error: 'Custom host cannot be a private/reserved address' });
+        return res.status(400).json({ error: 'Custom host cannot be a private/reserved address' });
       }
     }
     // Restrict port range to common DX Spider/telnet ports
     if (customPort < 1024 || customPort > 49151) {
-      return res
-        .status(400)
-        .json({ error: 'Port must be between 1024 and 49151' });
+      return res.status(400).json({ error: 'Port must be between 1024 and 49151' });
     }
   }
 
@@ -3650,11 +3257,7 @@ app.get('/api/dxcluster/paths', async (req, res) => {
   const pathsCache = getDxPathsCache(cacheKey);
 
   // Check cache first (but not for custom sources - they might have different data)
-  if (
-    source !== 'custom' &&
-    Date.now() - pathsCache.timestamp < DXPATHS_CACHE_TTL &&
-    pathsCache.paths.length > 0
-  ) {
+  if (source !== 'custom' && Date.now() - pathsCache.timestamp < DXPATHS_CACHE_TTL && pathsCache.paths.length > 0) {
     logDebug('[DX Paths] Returning', pathsCache.paths.length, 'cached paths');
     return res.json(pathsCache.paths);
   }
@@ -3706,13 +3309,10 @@ app.get('/api/dxcluster/paths', async (req, res) => {
     // Try proxy if not using custom or custom failed
     if (newSpots.length === 0 && source !== 'custom') {
       try {
-        const proxyResponse = await fetch(
-          `${DXSPIDER_PROXY_URL}/api/spots?limit=100`,
-          {
-            headers: { 'User-Agent': 'OpenHamClock/3.14.11' },
-            signal: controller.signal,
-          },
-        );
+        const proxyResponse = await fetch(`${DXSPIDER_PROXY_URL}/api/spots?limit=100`, {
+          headers: { 'User-Agent': 'OpenHamClock/3.14.11' },
+          signal: controller.signal,
+        });
 
         if (proxyResponse.ok) {
           const proxyData = await proxyResponse.json();
@@ -3740,13 +3340,10 @@ app.get('/api/dxcluster/paths', async (req, res) => {
     // Fallback to HamQTH if proxy failed (never for explicit custom source)
     if (newSpots.length === 0 && source !== 'custom') {
       try {
-        const response = await fetch(
-          'https://www.hamqth.com/dxc_csv.php?limit=50',
-          {
-            headers: { 'User-Agent': 'OpenHamClock/3.13.1' },
-            signal: controller.signal,
-          },
-        );
+        const response = await fetch('https://www.hamqth.com/dxc_csv.php?limit=50', {
+          headers: { 'User-Agent': 'OpenHamClock/3.13.1' },
+          signal: controller.signal,
+        });
 
         if (response.ok) {
           const text = await response.text();
@@ -3788,13 +3385,7 @@ app.get('/api/dxcluster/paths', async (req, res) => {
               dxGrid: grids.dxGrid,
               freq: (freqKhz / 1000).toFixed(3),
               comment,
-              time:
-                timeDate.length >= 4
-                  ? timeDate.substring(0, 2) +
-                    ':' +
-                    timeDate.substring(2, 4) +
-                    'z'
-                  : '',
+              time: timeDate.length >= 4 ? timeDate.substring(0, 2) + ':' + timeDate.substring(2, 4) + 'z' : '',
               timestamp: spotTimestamp,
               id: `${dxCall}-${freqKhz}-${spotter}`,
             });
@@ -3810,9 +3401,7 @@ app.get('/api/dxcluster/paths', async (req, res) => {
 
     if (newSpots.length === 0) {
       // Return existing paths if fetch failed
-      const validPaths = pathsCache.allPaths.filter(
-        (p) => now - p.timestamp < DXPATHS_RETENTION,
-      );
+      const validPaths = pathsCache.allPaths.filter((p) => now - p.timestamp < DXPATHS_RETENTION);
       return res.json(validPaths.slice(0, 50));
     }
 
@@ -3858,11 +3447,7 @@ app.get('/api/dxcluster/paths', async (req, res) => {
     const hamqthMisses = []; // Callsigns to look up in background
     for (const call of callsToLookup) {
       const cached = callsignLookupCache.get(call);
-      if (
-        cached &&
-        now - cached.timestamp < CALLSIGN_CACHE_TTL &&
-        cached.data?.lat != null
-      ) {
+      if (cached && now - cached.timestamp < CALLSIGN_CACHE_TTL && cached.data?.lat != null) {
         hamqthLocations[call] = {
           lat: cached.data.lat,
           lon: cached.data.lon,
@@ -3880,24 +3465,17 @@ app.get('/api/dxcluster/paths', async (req, res) => {
     // Limit to 10 per cycle to avoid hammering HamQTH
     if (hamqthMisses.length > 0) {
       const batch = hamqthMisses.slice(0, 10);
-      logDebug(
-        '[DX Paths] Background HamQTH lookup for',
-        batch.length,
-        'callsigns',
-      );
+      logDebug('[DX Paths] Background HamQTH lookup for', batch.length, 'callsigns');
       for (const rawCall of batch) {
         // Sanitize and validate before hitting external API
         const call = rawCall.replace(/[<>]/g, '').trim();
         if (!call || !/^[A-Z0-9\/\-]{1,20}$/.test(call)) continue;
 
         // Fire-and-forget — results land in callsignLookupCache for next poll
-        fetch(
-          `https://www.hamqth.com/dxcc.php?callsign=${encodeURIComponent(call)}`,
-          {
-            headers: { 'User-Agent': 'OpenHamClock/' + APP_VERSION },
-            signal: AbortSignal.timeout(5000),
-          },
-        )
+        fetch(`https://www.hamqth.com/dxcc.php?callsign=${encodeURIComponent(call)}`, {
+          headers: { 'User-Agent': 'OpenHamClock/' + APP_VERSION },
+          signal: AbortSignal.timeout(5000),
+        })
           .then(async (resp) => {
             if (!resp.ok) return;
             const text = await resp.text();
@@ -3959,10 +3537,7 @@ app.get('/api/dxcluster/paths', async (req, res) => {
         }
 
         // Fall back to HamQTH cached location (more accurate than prefix)
-        if (
-          !dxLoc &&
-          hamqthLocations[baseCallMap[spot.dxCall] || spot.dxCall]
-        ) {
+        if (!dxLoc && hamqthLocations[baseCallMap[spot.dxCall] || spot.dxCall]) {
           dxLoc = hamqthLocations[baseCallMap[spot.dxCall] || spot.dxCall];
         }
 
@@ -4010,18 +3585,13 @@ app.get('/api/dxcluster/paths', async (req, res) => {
         }
 
         // Fall back to HamQTH cached location for spotter
-        if (
-          !spotterLoc &&
-          hamqthLocations[baseCallMap[spot.spotter] || spot.spotter]
-        ) {
-          spotterLoc =
-            hamqthLocations[baseCallMap[spot.spotter] || spot.spotter];
+        if (!spotterLoc && hamqthLocations[baseCallMap[spot.spotter] || spot.spotter]) {
+          spotterLoc = hamqthLocations[baseCallMap[spot.spotter] || spot.spotter];
         }
 
         // Fall back to prefix location for spotter (now includes grid-based coordinates!)
         if (!spotterLoc) {
-          spotterLoc =
-            prefixLocations[baseCallMap[spot.spotter] || spot.spotter];
+          spotterLoc = prefixLocations[baseCallMap[spot.spotter] || spot.spotter];
           if (spotterLoc && spotterLoc.grid) {
             spotterGridSquare = spotterLoc.grid;
           }
@@ -4047,27 +3617,20 @@ app.get('/api/dxcluster/paths', async (req, res) => {
           time: spot.time,
           id: spot.id,
           // Sorting is driven by spot-provided HHMMz time when available.
-          timestamp: parseSpotHHMMzToTimestamp(
-            spot.time,
-            Number.isFinite(spot.timestamp) ? spot.timestamp : now,
-          ),
+          timestamp: parseSpotHHMMzToTimestamp(spot.time, Number.isFinite(spot.timestamp) ? spot.timestamp : now),
         };
       })
       .filter(Boolean);
 
     // Merge with existing paths, removing expired and duplicates
-    const existingValidPaths = pathsCache.allPaths.filter(
-      (p) => now - p.timestamp < DXPATHS_RETENTION,
-    );
+    const existingValidPaths = pathsCache.allPaths.filter((p) => now - p.timestamp < DXPATHS_RETENTION);
 
     // Add new paths, avoiding duplicates (same dxCall+freq within 2 minutes)
     const mergedPaths = [...existingValidPaths];
     for (const newPath of newPaths) {
       const isDuplicate = mergedPaths.some(
         (existing) =>
-          existing.dxCall === newPath.dxCall &&
-          existing.freq === newPath.freq &&
-          now - existing.timestamp < 120000, // 2 minute dedup window
+          existing.dxCall === newPath.dxCall && existing.freq === newPath.freq && now - existing.timestamp < 120000, // 2 minute dedup window
       );
       if (!isDuplicate) {
         mergedPaths.push(newPath);
@@ -4075,19 +3638,9 @@ app.get('/api/dxcluster/paths', async (req, res) => {
     }
 
     // Sort by timestamp (newest first) and limit
-    const sortedPaths = mergedPaths
-      .sort((a, b) => b.timestamp - a.timestamp)
-      .slice(0, 100);
+    const sortedPaths = mergedPaths.sort((a, b) => b.timestamp - a.timestamp).slice(0, 100);
 
-    logDebug(
-      '[DX Paths]',
-      sortedPaths.length,
-      'total paths (',
-      newPaths.length,
-      'new from',
-      newSpots.length,
-      'spots)',
-    );
+    logDebug('[DX Paths]', sortedPaths.length, 'total paths (', newPaths.length, 'new from', newSpots.length, 'spots)');
 
     // Update cache
     dxSpotPathsCacheByKey.set(cacheKey, {
@@ -4126,13 +3679,8 @@ setInterval(
     }
     // If still over cap after TTL purge, evict oldest entries
     if (callsignLookupCache.size > CALLSIGN_CACHE_MAX) {
-      const sorted = [...callsignLookupCache.entries()].sort(
-        (a, b) => a[1].timestamp - b[1].timestamp,
-      );
-      const toRemove = sorted.slice(
-        0,
-        callsignLookupCache.size - CALLSIGN_CACHE_MAX,
-      );
+      const sorted = [...callsignLookupCache.entries()].sort((a, b) => a[1].timestamp - b[1].timestamp);
+      const toRemove = sorted.slice(0, callsignLookupCache.size - CALLSIGN_CACHE_MAX);
       for (const [call] of toRemove) {
         callsignLookupCache.delete(call);
         purged++;
@@ -4148,10 +3696,7 @@ setInterval(
 
 // Helper: add to cache with size enforcement — prevents unbounded growth between cleanups
 function cacheCallsignLookup(call, data) {
-  if (
-    callsignLookupCache.size >= CALLSIGN_CACHE_MAX &&
-    !callsignLookupCache.has(call)
-  ) {
+  if (callsignLookupCache.size >= CALLSIGN_CACHE_MAX && !callsignLookupCache.has(call)) {
     // Evict oldest entry to make room
     const oldest = callsignLookupCache.keys().next().value;
     if (oldest) callsignLookupCache.delete(oldest);
@@ -4179,24 +3724,7 @@ function extractBaseCallsign(raw) {
   const parts = call.split('/');
 
   // Known suffixes that are always modifiers (not callsigns)
-  const MODIFIERS = new Set([
-    'M',
-    'P',
-    'QRP',
-    'MM',
-    'AM',
-    'R',
-    'T',
-    'B',
-    'BCN',
-    'LH',
-    'A',
-    'E',
-    'J',
-    'AG',
-    'AE',
-    'KT',
-  ]);
+  const MODIFIERS = new Set(['M', 'P', 'QRP', 'MM', 'AM', 'R', 'T', 'B', 'BCN', 'LH', 'A', 'E', 'J', 'AG', 'AE', 'KT']);
 
   // Filter out known modifiers and single digits (call area overrides like /6)
   const candidates = parts.filter((p) => {
@@ -4308,9 +3836,7 @@ async function qrzLogin() {
           errorMatch[1].includes('denied')
         ) {
           qrzSession.authFailedUntil = Date.now() + qrzSession.authFailCooldown;
-          console.error(
-            `[QRZ] Login failed: ${errorMatch[1]} — suppressing retries for 1 hour`,
-          );
+          console.error(`[QRZ] Login failed: ${errorMatch[1]} — suppressing retries for 1 hour`);
         } else {
           console.error(`[QRZ] Login failed: ${errorMatch[1]}`);
         }
@@ -4417,9 +3943,7 @@ async function qrzLookup(callsign) {
       source: 'qrz',
     };
 
-    logDebug(
-      `[QRZ] ${callsign}: ${result.lat.toFixed(4)}, ${result.lon.toFixed(4)} (${result.geoloc})`,
-    );
+    logDebug(`[QRZ] ${callsign}: ${result.lat.toFixed(4)}, ${result.lon.toFixed(4)} (${result.geoloc})`);
     return result;
   } catch (err) {
     if (err.name !== 'AbortError') {
@@ -4432,12 +3956,9 @@ async function qrzLookup(callsign) {
 // Look up via HamQTH DXCC API (no auth, but only DXCC-level accuracy)
 async function hamqthLookup(callsign) {
   try {
-    const response = await fetch(
-      `https://www.hamqth.com/dxcc.php?callsign=${encodeURIComponent(callsign)}`,
-      {
-        signal: AbortSignal.timeout(8000),
-      },
-    );
+    const response = await fetch(`https://www.hamqth.com/dxcc.php?callsign=${encodeURIComponent(callsign)}`, {
+      signal: AbortSignal.timeout(8000),
+    });
 
     if (!response.ok) return null;
 
@@ -4477,14 +3998,8 @@ app.get('/api/qrz/status', (req, res) => {
     lookupCount: qrzSession.lookupCount,
     lastError: qrzSession.lastError,
     authCooldownRemaining:
-      qrzSession.authFailedUntil > Date.now()
-        ? Math.round((qrzSession.authFailedUntil - Date.now()) / 60000)
-        : 0,
-    source: CONFIG._qrzUsername
-      ? 'env'
-      : qrzSession.username
-        ? 'settings'
-        : 'none',
+      qrzSession.authFailedUntil > Date.now() ? Math.round((qrzSession.authFailedUntil - Date.now()) / 60000) : 0,
+    source: CONFIG._qrzUsername ? 'env' : qrzSession.username ? 'settings' : 'none',
   });
 });
 
@@ -4514,10 +4029,10 @@ app.post('/api/qrz/configure', writeLimiter, async (req, res) => {
     qrzSession.password = oldPassword;
     return res.status(429).json({
       success: false,
-      error: 'QRZ login recently failed with these credentials. Try again later or use different credentials.'
+      error: 'QRZ login recently failed with these credentials. Try again later or use different credentials.',
     });
   }
-  
+
   const key = await qrzLogin();
 
   if (key) {
@@ -4587,8 +4102,7 @@ app.get('/api/callsign/:call', async (req, res) => {
   const callsign = extractBaseCallsign(rawCallsign);
 
   // Check cache first (check both raw and base forms)
-  const cached =
-    callsignLookupCache.get(callsign) || callsignLookupCache.get(rawCallsign);
+  const cached = callsignLookupCache.get(callsign) || callsignLookupCache.get(rawCallsign);
   if (cached && now - cached.timestamp < CALLSIGN_CACHE_TTL) {
     logDebug('[Callsign Lookup] Cache hit for:', callsign);
     return res.json(cached.data);
@@ -4706,8 +4220,7 @@ function maidenheadToLatLon(grid) {
 // Try to extract grid locators from a comment string
 // Returns { spotterGrid, dxGrid } - may have one, both, or neither
 function extractGridsFromComment(comment) {
-  if (!comment || typeof comment !== 'string')
-    return { spotterGrid: null, dxGrid: null };
+  if (!comment || typeof comment !== 'string') return { spotterGrid: null, dxGrid: null };
 
   // Check for dual grid format: FN20<>EM79 or FN20->EM79 or FN20/EM79
   const dualGridMatch = comment.match(
@@ -4752,9 +4265,7 @@ function isValidGrid(grid) {
   const firstChar = grid.charCodeAt(0);
   const secondChar = grid.charCodeAt(1);
   // First char should be A-R, second char should be A-R
-  return (
-    firstChar >= 65 && firstChar <= 82 && secondChar >= 65 && secondChar <= 82
-  );
+  return firstChar >= 65 && firstChar <= 82 && secondChar >= 65 && secondChar <= 82;
 }
 
 // Legacy single-grid extraction (kept for compatibility)
@@ -4777,135 +4288,135 @@ function estimateLocationFromPrefix(callsign) {
     // ============================================
     // USA - by call district
     // ============================================
-    'W1': 'FN41',
-    'K1': 'FN41',
-    'N1': 'FN41',
-    'AA1': 'FN41',
-    'W2': 'FN20',
-    'K2': 'FN20',
-    'N2': 'FN20',
-    'AA2': 'FN20',
-    'W3': 'FM19',
-    'K3': 'FM19',
-    'N3': 'FM19',
-    'AA3': 'FM19',
-    'W4': 'EM73',
-    'K4': 'EM73',
-    'N4': 'EM73',
-    'AA4': 'EM73',
-    'W5': 'EM12',
-    'K5': 'EM12',
-    'N5': 'EM12',
-    'AA5': 'EM12',
-    'W6': 'CM97',
-    'K6': 'CM97',
-    'N6': 'CM97',
-    'AA6': 'CM97',
-    'W7': 'DN31',
-    'K7': 'DN31',
-    'N7': 'DN31',
-    'AA7': 'DN31',
-    'W8': 'EN81',
-    'K8': 'EN81',
-    'N8': 'EN81',
-    'AA8': 'EN81',
-    'W9': 'EN52',
-    'K9': 'EN52',
-    'N9': 'EN52',
-    'AA9': 'EN52',
-    'W0': 'EN31',
-    'K0': 'EN31',
-    'N0': 'EN31',
-    'AA0': 'EN31',
-    'W': 'EM79',
-    'K': 'EM79',
-    'N': 'EM79',
+    W1: 'FN41',
+    K1: 'FN41',
+    N1: 'FN41',
+    AA1: 'FN41',
+    W2: 'FN20',
+    K2: 'FN20',
+    N2: 'FN20',
+    AA2: 'FN20',
+    W3: 'FM19',
+    K3: 'FM19',
+    N3: 'FM19',
+    AA3: 'FM19',
+    W4: 'EM73',
+    K4: 'EM73',
+    N4: 'EM73',
+    AA4: 'EM73',
+    W5: 'EM12',
+    K5: 'EM12',
+    N5: 'EM12',
+    AA5: 'EM12',
+    W6: 'CM97',
+    K6: 'CM97',
+    N6: 'CM97',
+    AA6: 'CM97',
+    W7: 'DN31',
+    K7: 'DN31',
+    N7: 'DN31',
+    AA7: 'DN31',
+    W8: 'EN81',
+    K8: 'EN81',
+    N8: 'EN81',
+    AA8: 'EN81',
+    W9: 'EN52',
+    K9: 'EN52',
+    N9: 'EN52',
+    AA9: 'EN52',
+    W0: 'EN31',
+    K0: 'EN31',
+    N0: 'EN31',
+    AA0: 'EN31',
+    W: 'EM79',
+    K: 'EM79',
+    N: 'EM79',
 
     // ============================================
     // US Territories
     // ============================================
-    'KP4': 'FK68',
-    'NP4': 'FK68',
-    'WP4': 'FK68',
-    'KP3': 'FK68',
-    'NP3': 'FK68',
-    'WP3': 'FK68',
-    'KP2': 'FK77',
-    'NP2': 'FK77',
-    'WP2': 'FK77',
-    'KP1': 'FK28',
-    'NP1': 'FK28',
-    'WP1': 'FK28',
-    'KP5': 'FK68',
-    'KH0': 'QK25',
-    'NH0': 'QK25',
-    'WH0': 'QK25',
-    'KH1': 'BL01',
-    'KH2': 'QK24',
-    'NH2': 'QK24',
-    'WH2': 'QK24',
-    'KH3': 'BK29',
-    'KH4': 'AL07',
-    'KH5': 'BK29',
-    'KH5K': 'BL01',
-    'KH6': 'BL10',
-    'NH6': 'BL10',
-    'WH6': 'BL10',
-    'KH7': 'BL10',
-    'NH7': 'BL10',
-    'WH7': 'BL10',
-    'KH8': 'AH38',
-    'NH8': 'AH38',
-    'WH8': 'AH38',
-    'KH9': 'AK19',
-    'KL7': 'BP51',
-    'NL7': 'BP51',
-    'WL7': 'BP51',
-    'AL7': 'BP51',
-    'KG4': 'FK29',
+    KP4: 'FK68',
+    NP4: 'FK68',
+    WP4: 'FK68',
+    KP3: 'FK68',
+    NP3: 'FK68',
+    WP3: 'FK68',
+    KP2: 'FK77',
+    NP2: 'FK77',
+    WP2: 'FK77',
+    KP1: 'FK28',
+    NP1: 'FK28',
+    WP1: 'FK28',
+    KP5: 'FK68',
+    KH0: 'QK25',
+    NH0: 'QK25',
+    WH0: 'QK25',
+    KH1: 'BL01',
+    KH2: 'QK24',
+    NH2: 'QK24',
+    WH2: 'QK24',
+    KH3: 'BK29',
+    KH4: 'AL07',
+    KH5: 'BK29',
+    KH5K: 'BL01',
+    KH6: 'BL10',
+    NH6: 'BL10',
+    WH6: 'BL10',
+    KH7: 'BL10',
+    NH7: 'BL10',
+    WH7: 'BL10',
+    KH8: 'AH38',
+    NH8: 'AH38',
+    WH8: 'AH38',
+    KH9: 'AK19',
+    KL7: 'BP51',
+    NL7: 'BP51',
+    WL7: 'BP51',
+    AL7: 'BP51',
+    KG4: 'FK29',
 
     // ============================================
     // Canada
     // ============================================
-    'VE1': 'FN74',
-    'VA1': 'FN74',
-    'VE2': 'FN35',
-    'VA2': 'FN35',
-    'VE3': 'FN03',
-    'VA3': 'FN03',
-    'VE4': 'EN19',
-    'VA4': 'EN19',
-    'VE5': 'DO51',
-    'VA5': 'DO51',
-    'VE6': 'DO33',
-    'VA6': 'DO33',
-    'VE7': 'CN89',
-    'VA7': 'CN89',
-    'VE8': 'DP31',
-    'VE9': 'FN65',
-    'VA9': 'FN65',
-    'VO1': 'GN37',
-    'VO2': 'GO17',
-    'VY0': 'EQ79',
-    'VY1': 'CP28',
-    'VY2': 'FN86',
-    'CY0': 'GN76',
-    'CY9': 'FN97',
-    'VE': 'FN03',
-    'VA': 'FN03',
+    VE1: 'FN74',
+    VA1: 'FN74',
+    VE2: 'FN35',
+    VA2: 'FN35',
+    VE3: 'FN03',
+    VA3: 'FN03',
+    VE4: 'EN19',
+    VA4: 'EN19',
+    VE5: 'DO51',
+    VA5: 'DO51',
+    VE6: 'DO33',
+    VA6: 'DO33',
+    VE7: 'CN89',
+    VA7: 'CN89',
+    VE8: 'DP31',
+    VE9: 'FN65',
+    VA9: 'FN65',
+    VO1: 'GN37',
+    VO2: 'GO17',
+    VY0: 'EQ79',
+    VY1: 'CP28',
+    VY2: 'FN86',
+    CY0: 'GN76',
+    CY9: 'FN97',
+    VE: 'FN03',
+    VA: 'FN03',
 
     // ============================================
     // Mexico & Central America
     // ============================================
-    'XE': 'EK09',
-    'XE1': 'EK09',
-    'XE2': 'DL84',
-    'XE3': 'EK57',
-    'XA': 'EK09',
-    'XB': 'EK09',
-    'XC': 'EK09',
-    'XD': 'EK09',
-    'XF': 'DK48',
+    XE: 'EK09',
+    XE1: 'EK09',
+    XE2: 'DL84',
+    XE3: 'EK57',
+    XA: 'EK09',
+    XB: 'EK09',
+    XC: 'EK09',
+    XD: 'EK09',
+    XF: 'DK48',
     '4A': 'EK09',
     '4B': 'EK09',
     '4C': 'EK09',
@@ -4916,416 +4427,416 @@ function estimateLocationFromPrefix(callsign) {
     '6H': 'EK09',
     '6I': 'EK09',
     '6J': 'EK09',
-    'TI': 'EJ79',
-    'TE': 'EJ79',
-    'TG': 'EK44',
-    'TD': 'EK44',
-    'HR': 'EK55',
-    'HQ': 'EK55',
-    'YN': 'EK62',
-    'HT': 'EK62',
-    'H6': 'EK62',
-    'H7': 'EK62',
-    'HP': 'FJ08',
-    'HO': 'FJ08',
-    'H3': 'FJ08',
-    'H8': 'FJ08',
-    'H9': 'FJ08',
+    TI: 'EJ79',
+    TE: 'EJ79',
+    TG: 'EK44',
+    TD: 'EK44',
+    HR: 'EK55',
+    HQ: 'EK55',
+    YN: 'EK62',
+    HT: 'EK62',
+    H6: 'EK62',
+    H7: 'EK62',
+    HP: 'FJ08',
+    HO: 'FJ08',
+    H3: 'FJ08',
+    H8: 'FJ08',
+    H9: 'FJ08',
     '3E': 'FJ08',
     '3F': 'FJ08',
-    'YS': 'EK53',
-    'HU': 'EK53',
-    'V3': 'EK56',
+    YS: 'EK53',
+    HU: 'EK53',
+    V3: 'EK56',
 
     // ============================================
     // Caribbean
     // ============================================
-    'HI': 'FK49',
-    'CO': 'FL10',
-    'CM': 'FL10',
-    'CL': 'FL10',
-    'T4': 'FL10',
+    HI: 'FK49',
+    CO: 'FL10',
+    CM: 'FL10',
+    CL: 'FL10',
+    T4: 'FL10',
     '6Y': 'FK17',
-    'VP5': 'FL31',
-    'C6': 'FL06',
-    'ZF': 'EK99',
-    'V2': 'FK97',
-    'J3': 'FK92',
-    'J6': 'FK93',
-    'J7': 'FK95',
-    'J8': 'FK93',
+    VP5: 'FL31',
+    C6: 'FL06',
+    ZF: 'EK99',
+    V2: 'FK97',
+    J3: 'FK92',
+    J6: 'FK93',
+    J7: 'FK95',
+    J8: 'FK93',
     '8P': 'GK03',
     '9Y': 'FK90',
-    'PJ2': 'FK52',
-    'PJ4': 'FK52',
-    'PJ5': 'FK87',
-    'PJ6': 'FK87',
-    'PJ7': 'FK88',
-    'P4': 'FK52',
-    'VP2E': 'FK88',
-    'VP2M': 'FK96',
-    'VP2V': 'FK77',
-    'V4': 'FK87',
-    'FG': 'FK96',
-    'FM': 'FK94',
-    'TO': 'FK94',
-    'FS': 'FK88',
-    'FJ': 'GK08',
-    'HH': 'FK38',
+    PJ2: 'FK52',
+    PJ4: 'FK52',
+    PJ5: 'FK87',
+    PJ6: 'FK87',
+    PJ7: 'FK88',
+    P4: 'FK52',
+    VP2E: 'FK88',
+    VP2M: 'FK96',
+    VP2V: 'FK77',
+    V4: 'FK87',
+    FG: 'FK96',
+    FM: 'FK94',
+    TO: 'FK94',
+    FS: 'FK88',
+    FJ: 'GK08',
+    HH: 'FK38',
 
     // ============================================
     // South America
     // ============================================
-    'LU': 'GF05',
-    'LW': 'GF05',
-    'LO': 'GF05',
-    'LR': 'GF05',
-    'LT': 'GF05',
-    'AY': 'GF05',
-    'AZ': 'GF05',
-    'L1': 'GF05',
-    'L2': 'GF05',
-    'L3': 'GF05',
-    'L4': 'GF05',
-    'L5': 'GF05',
-    'L6': 'GF05',
-    'L7': 'GF05',
-    'L8': 'GF05',
-    'L9': 'GF05',
-    'PY': 'GG87',
-    'PP': 'GG87',
-    'PQ': 'GG87',
-    'PR': 'GG87',
-    'PS': 'GG87',
-    'PT': 'GG87',
-    'PU': 'GG87',
-    'PV': 'GG87',
-    'PW': 'GG87',
-    'PX': 'GG87',
-    'ZV': 'GG87',
-    'ZW': 'GG87',
-    'ZX': 'GG87',
-    'ZY': 'GG87',
-    'ZZ': 'GG87',
-    'CE': 'FF46',
-    'CA': 'FF46',
-    'CB': 'FF46',
-    'CC': 'FF46',
-    'CD': 'FF46',
-    'XQ': 'FF46',
-    'XR': 'FF46',
+    LU: 'GF05',
+    LW: 'GF05',
+    LO: 'GF05',
+    LR: 'GF05',
+    LT: 'GF05',
+    AY: 'GF05',
+    AZ: 'GF05',
+    L1: 'GF05',
+    L2: 'GF05',
+    L3: 'GF05',
+    L4: 'GF05',
+    L5: 'GF05',
+    L6: 'GF05',
+    L7: 'GF05',
+    L8: 'GF05',
+    L9: 'GF05',
+    PY: 'GG87',
+    PP: 'GG87',
+    PQ: 'GG87',
+    PR: 'GG87',
+    PS: 'GG87',
+    PT: 'GG87',
+    PU: 'GG87',
+    PV: 'GG87',
+    PW: 'GG87',
+    PX: 'GG87',
+    ZV: 'GG87',
+    ZW: 'GG87',
+    ZX: 'GG87',
+    ZY: 'GG87',
+    ZZ: 'GG87',
+    CE: 'FF46',
+    CA: 'FF46',
+    CB: 'FF46',
+    CC: 'FF46',
+    CD: 'FF46',
+    XQ: 'FF46',
+    XR: 'FF46',
     '3G': 'FF46',
-    'CE0Y': 'DG52',
-    'CE0Z': 'FE49',
-    'CE0X': 'FG14',
-    'CX': 'GF15',
-    'CV': 'GF15',
-    'HC': 'FI09',
-    'HD': 'FI09',
-    'HC8': 'EI49',
-    'OA': 'FH17',
-    'OB': 'FH17',
-    'OC': 'FH17',
+    CE0Y: 'DG52',
+    CE0Z: 'FE49',
+    CE0X: 'FG14',
+    CX: 'GF15',
+    CV: 'GF15',
+    HC: 'FI09',
+    HD: 'FI09',
+    HC8: 'EI49',
+    OA: 'FH17',
+    OB: 'FH17',
+    OC: 'FH17',
     '4T': 'FH17',
-    'HK': 'FJ35',
-    'HJ': 'FJ35',
+    HK: 'FJ35',
+    HJ: 'FJ35',
     '5J': 'FJ35',
     '5K': 'FJ35',
-    'HK0': 'FJ55',
-    'HK0M': 'EJ96',
-    'YV': 'FK60',
-    'YW': 'FK60',
-    'YX': 'FK60',
-    'YY': 'FK60',
+    HK0: 'FJ55',
+    HK0M: 'EJ96',
+    YV: 'FK60',
+    YW: 'FK60',
+    YX: 'FK60',
+    YY: 'FK60',
     '4M': 'FK60',
-    'YV0': 'FK53',
-    'CP': 'FH64',
+    YV0: 'FK53',
+    CP: 'FH64',
     '8R': 'GJ24',
-    'PZ': 'GJ25',
-    'FY': 'GJ34',
-    'VP8': 'GD18',
-    'VP8F': 'GD18',
-    'VP8G': 'IC16',
-    'VP8H': 'GC17',
-    'VP8O': 'GC06',
-    'VP8S': 'GC06',
+    PZ: 'GJ25',
+    FY: 'GJ34',
+    VP8: 'GD18',
+    VP8F: 'GD18',
+    VP8G: 'IC16',
+    VP8H: 'GC17',
+    VP8O: 'GC06',
+    VP8S: 'GC06',
 
     // ============================================
     // Europe - UK & Ireland
     // ============================================
-    'G': 'IO91',
-    'M': 'IO91',
+    G: 'IO91',
+    M: 'IO91',
     '2E': 'IO91',
-    'GW': 'IO81',
-    'MW': 'IO81',
+    GW: 'IO81',
+    MW: 'IO81',
     '2W': 'IO81',
-    'GM': 'IO85',
-    'MM': 'IO85',
+    GM: 'IO85',
+    MM: 'IO85',
     '2M': 'IO85',
-    'GI': 'IO64',
-    'MI': 'IO64',
+    GI: 'IO64',
+    MI: 'IO64',
     '2I': 'IO64',
-    'GD': 'IO74',
-    'MD': 'IO74',
+    GD: 'IO74',
+    MD: 'IO74',
     '2D': 'IO74',
-    'GJ': 'IN89',
-    'MJ': 'IN89',
+    GJ: 'IN89',
+    MJ: 'IN89',
     '2J': 'IN89',
-    'GU': 'IN89',
-    'MU': 'IN89',
+    GU: 'IN89',
+    MU: 'IN89',
     '2U': 'IN89',
-    'EI': 'IO63',
-    'EJ': 'IO63',
+    EI: 'IO63',
+    EJ: 'IO63',
 
     // ============================================
     // Europe - Germany
     // ============================================
-    'DL': 'JO51',
-    'DJ': 'JO51',
-    'DK': 'JO51',
-    'DA': 'JO51',
-    'DB': 'JO51',
-    'DC': 'JO51',
-    'DD': 'JO51',
-    'DF': 'JO51',
-    'DG': 'JO51',
-    'DH': 'JO51',
-    'DM': 'JO51',
-    'DO': 'JO51',
-    'DP': 'JO51',
-    'DQ': 'JO51',
-    'DR': 'JO51',
+    DL: 'JO51',
+    DJ: 'JO51',
+    DK: 'JO51',
+    DA: 'JO51',
+    DB: 'JO51',
+    DC: 'JO51',
+    DD: 'JO51',
+    DF: 'JO51',
+    DG: 'JO51',
+    DH: 'JO51',
+    DM: 'JO51',
+    DO: 'JO51',
+    DP: 'JO51',
+    DQ: 'JO51',
+    DR: 'JO51',
 
     // ============================================
     // Europe - France & territories
     // ============================================
-    'F': 'JN18',
-    'TM': 'JN18',
+    F: 'JN18',
+    TM: 'JN18',
 
     // ============================================
     // Europe - Italy
     // ============================================
-    'I': 'JN61',
-    'IK': 'JN45',
-    'IZ': 'JN61',
-    'IW': 'JN61',
-    'IU': 'JN61',
+    I: 'JN61',
+    IK: 'JN45',
+    IZ: 'JN61',
+    IW: 'JN61',
+    IU: 'JN61',
 
     // ============================================
     // Europe - Spain & Portugal
     // ============================================
-    'EA': 'IN80',
-    'EC': 'IN80',
-    'EB': 'IN80',
-    'ED': 'IN80',
-    'EE': 'IN80',
-    'EF': 'IN80',
-    'EG': 'IN80',
-    'EH': 'IN80',
-    'EA6': 'JM19',
-    'EC6': 'JM19',
-    'EA8': 'IL18',
-    'EC8': 'IL18',
-    'EA9': 'IM75',
-    'EC9': 'IM75',
-    'CT': 'IM58',
-    'CQ': 'IM58',
-    'CS': 'IM58',
-    'CT3': 'IM12',
-    'CQ3': 'IM12',
-    'CU': 'HM68',
+    EA: 'IN80',
+    EC: 'IN80',
+    EB: 'IN80',
+    ED: 'IN80',
+    EE: 'IN80',
+    EF: 'IN80',
+    EG: 'IN80',
+    EH: 'IN80',
+    EA6: 'JM19',
+    EC6: 'JM19',
+    EA8: 'IL18',
+    EC8: 'IL18',
+    EA9: 'IM75',
+    EC9: 'IM75',
+    CT: 'IM58',
+    CQ: 'IM58',
+    CS: 'IM58',
+    CT3: 'IM12',
+    CQ3: 'IM12',
+    CU: 'HM68',
 
     // ============================================
     // Europe - Benelux
     // ============================================
-    'PA': 'JO21',
-    'PD': 'JO21',
-    'PE': 'JO21',
-    'PF': 'JO21',
-    'PG': 'JO21',
-    'PH': 'JO21',
-    'PI': 'JO21',
-    'ON': 'JO20',
-    'OO': 'JO20',
-    'OP': 'JO20',
-    'OQ': 'JO20',
-    'OR': 'JO20',
-    'OS': 'JO20',
-    'OT': 'JO20',
-    'LX': 'JN39',
+    PA: 'JO21',
+    PD: 'JO21',
+    PE: 'JO21',
+    PF: 'JO21',
+    PG: 'JO21',
+    PH: 'JO21',
+    PI: 'JO21',
+    ON: 'JO20',
+    OO: 'JO20',
+    OP: 'JO20',
+    OQ: 'JO20',
+    OR: 'JO20',
+    OS: 'JO20',
+    OT: 'JO20',
+    LX: 'JN39',
 
     // ============================================
     // Europe - Alpine
     // ============================================
-    'HB': 'JN47',
-    'HB9': 'JN47',
-    'HE': 'JN47',
-    'HB0': 'JN47',
-    'OE': 'JN78',
+    HB: 'JN47',
+    HB9: 'JN47',
+    HE: 'JN47',
+    HB0: 'JN47',
+    OE: 'JN78',
 
     // ============================================
     // Europe - Scandinavia
     // ============================================
-    'OZ': 'JO55',
-    'OU': 'JO55',
-    'OV': 'JO55',
+    OZ: 'JO55',
+    OU: 'JO55',
+    OV: 'JO55',
     '5P': 'JO55',
     '5Q': 'JO55',
-    'OX': 'GP47',
-    'XP': 'GP47',
-    'SM': 'JO89',
-    'SA': 'JO89',
-    'SB': 'JO89',
-    'SC': 'JO89',
-    'SD': 'JO89',
-    'SE': 'JO89',
-    'SF': 'JO89',
-    'SG': 'JO89',
-    'SH': 'JO89',
-    'SI': 'JO89',
-    'SJ': 'JO89',
-    'SK': 'JO89',
-    'SL': 'JO89',
+    OX: 'GP47',
+    XP: 'GP47',
+    SM: 'JO89',
+    SA: 'JO89',
+    SB: 'JO89',
+    SC: 'JO89',
+    SD: 'JO89',
+    SE: 'JO89',
+    SF: 'JO89',
+    SG: 'JO89',
+    SH: 'JO89',
+    SI: 'JO89',
+    SJ: 'JO89',
+    SK: 'JO89',
+    SL: 'JO89',
     '7S': 'JO89',
     '8S': 'JO89',
-    'LA': 'JO59',
-    'LB': 'JO59',
-    'LC': 'JO59',
-    'LD': 'JO59',
-    'LE': 'JO59',
-    'LF': 'JO59',
-    'LG': 'JO59',
-    'LH': 'JO59',
-    'LI': 'JO59',
-    'LJ': 'JO59',
-    'LK': 'JO59',
-    'LL': 'JO59',
-    'LM': 'JO59',
-    'LN': 'JO59',
-    'JW': 'JQ68',
-    'JX': 'IQ50',
-    'OH': 'KP20',
-    'OF': 'KP20',
-    'OG': 'KP20',
-    'OI': 'KP20',
-    'OH0': 'JP90',
-    'OJ0': 'KP03',
-    'TF': 'HP94',
+    LA: 'JO59',
+    LB: 'JO59',
+    LC: 'JO59',
+    LD: 'JO59',
+    LE: 'JO59',
+    LF: 'JO59',
+    LG: 'JO59',
+    LH: 'JO59',
+    LI: 'JO59',
+    LJ: 'JO59',
+    LK: 'JO59',
+    LL: 'JO59',
+    LM: 'JO59',
+    LN: 'JO59',
+    JW: 'JQ68',
+    JX: 'IQ50',
+    OH: 'KP20',
+    OF: 'KP20',
+    OG: 'KP20',
+    OI: 'KP20',
+    OH0: 'JP90',
+    OJ0: 'KP03',
+    TF: 'HP94',
 
     // ============================================
     // Europe - Eastern
     // ============================================
-    'SP': 'JO91',
-    'SQ': 'JO91',
-    'SO': 'JO91',
-    'SN': 'JO91',
+    SP: 'JO91',
+    SQ: 'JO91',
+    SO: 'JO91',
+    SN: 'JO91',
     '3Z': 'JO91',
-    'HF': 'JO91',
-    'OK': 'JN79',
-    'OL': 'JN79',
-    'OM': 'JN88',
-    'HA': 'JN97',
-    'HG': 'JN97',
-    'YO': 'KN34',
-    'YP': 'KN34',
-    'YQ': 'KN34',
-    'YR': 'KN34',
-    'LZ': 'KN22',
-    'SV': 'KM17',
-    'SX': 'KM17',
-    'SY': 'KM17',
-    'SZ': 'KM17',
-    'J4': 'KM17',
-    'SV5': 'KM46',
-    'SV9': 'KM25',
+    HF: 'JO91',
+    OK: 'JN79',
+    OL: 'JN79',
+    OM: 'JN88',
+    HA: 'JN97',
+    HG: 'JN97',
+    YO: 'KN34',
+    YP: 'KN34',
+    YQ: 'KN34',
+    YR: 'KN34',
+    LZ: 'KN22',
+    SV: 'KM17',
+    SX: 'KM17',
+    SY: 'KM17',
+    SZ: 'KM17',
+    J4: 'KM17',
+    SV5: 'KM46',
+    SV9: 'KM25',
     'SV/A': 'KN10',
     '9H': 'JM75',
-    'YU': 'KN04',
-    'YT': 'KN04',
-    'YZ': 'KN04',
+    YU: 'KN04',
+    YT: 'KN04',
+    YZ: 'KN04',
     '9A': 'JN75',
-    'S5': 'JN76',
-    'E7': 'JN84',
-    'Z3': 'KN01',
+    S5: 'JN76',
+    E7: 'JN84',
+    Z3: 'KN01',
     '4O': 'JN92',
-    'ZA': 'JN91',
-    'T7': 'JN63',
-    'HV': 'JN61',
+    ZA: 'JN91',
+    T7: 'JN63',
+    HV: 'JN61',
     '1A': 'JM64',
 
     // ============================================
     // Europe - Baltic
     // ============================================
-    'LY': 'KO24',
-    'ES': 'KO29',
-    'YL': 'KO26',
+    LY: 'KO24',
+    ES: 'KO29',
+    YL: 'KO26',
 
     // ============================================
     // Russia & Ukraine & Belarus
     // ============================================
-    'UA': 'KO85',
-    'RA': 'KO85',
-    'RU': 'KO85',
-    'RV': 'KO85',
-    'RW': 'KO85',
-    'RX': 'KO85',
-    'RZ': 'KO85',
-    'R1': 'KO85',
-    'R2': 'KO85',
-    'R3': 'KO85',
-    'R4': 'KO85',
-    'R5': 'KO85',
-    'R6': 'KO85',
-    'U1': 'KO85',
-    'U2': 'KO85',
-    'U3': 'KO85',
-    'U4': 'KO85',
-    'U5': 'KO85',
-    'U6': 'KO85',
-    'UA9': 'MO06',
-    'RA9': 'MO06',
-    'R9': 'MO06',
-    'U9': 'MO06',
-    'UA0': 'OO33',
-    'RA0': 'OO33',
-    'R0': 'OO33',
-    'U0': 'OO33',
-    'UA2': 'KO04',
-    'RA2': 'KO04',
-    'R2F': 'KO04',
-    'UR': 'KO50',
-    'UT': 'KO50',
-    'UX': 'KO50',
-    'US': 'KO50',
-    'UY': 'KO50',
-    'UW': 'KO50',
-    'UV': 'KO50',
-    'UU': 'KO50',
-    'EU': 'KO33',
-    'EV': 'KO33',
-    'EW': 'KO33',
-    'ER': 'KN47',
-    'C3': 'JN02',
+    UA: 'KO85',
+    RA: 'KO85',
+    RU: 'KO85',
+    RV: 'KO85',
+    RW: 'KO85',
+    RX: 'KO85',
+    RZ: 'KO85',
+    R1: 'KO85',
+    R2: 'KO85',
+    R3: 'KO85',
+    R4: 'KO85',
+    R5: 'KO85',
+    R6: 'KO85',
+    U1: 'KO85',
+    U2: 'KO85',
+    U3: 'KO85',
+    U4: 'KO85',
+    U5: 'KO85',
+    U6: 'KO85',
+    UA9: 'MO06',
+    RA9: 'MO06',
+    R9: 'MO06',
+    U9: 'MO06',
+    UA0: 'OO33',
+    RA0: 'OO33',
+    R0: 'OO33',
+    U0: 'OO33',
+    UA2: 'KO04',
+    RA2: 'KO04',
+    R2F: 'KO04',
+    UR: 'KO50',
+    UT: 'KO50',
+    UX: 'KO50',
+    US: 'KO50',
+    UY: 'KO50',
+    UW: 'KO50',
+    UV: 'KO50',
+    UU: 'KO50',
+    EU: 'KO33',
+    EV: 'KO33',
+    EW: 'KO33',
+    ER: 'KN47',
+    C3: 'JN02',
 
     // ============================================
     // Asia - Japan
     // ============================================
-    'JA': 'PM95',
-    'JH': 'PM95',
-    'JR': 'PM95',
-    'JE': 'PM95',
-    'JF': 'PM95',
-    'JG': 'PM95',
-    'JI': 'PM95',
-    'JJ': 'PM95',
-    'JK': 'PM95',
-    'JL': 'PM95',
-    'JM': 'PM95',
-    'JN': 'PM95',
-    'JO': 'PM95',
-    'JP': 'PM95',
-    'JQ': 'PM95',
-    'JS': 'PM95',
+    JA: 'PM95',
+    JH: 'PM95',
+    JR: 'PM95',
+    JE: 'PM95',
+    JF: 'PM95',
+    JG: 'PM95',
+    JI: 'PM95',
+    JJ: 'PM95',
+    JK: 'PM95',
+    JL: 'PM95',
+    JM: 'PM95',
+    JN: 'PM95',
+    JO: 'PM95',
+    JP: 'PM95',
+    JQ: 'PM95',
+    JS: 'PM95',
     '7J': 'PM95',
     '7K': 'PM95',
     '7L': 'PM95',
@@ -5336,68 +4847,68 @@ function estimateLocationFromPrefix(callsign) {
     '8L': 'PM95',
     '8M': 'PM95',
     '8N': 'PM95',
-    'JA1': 'PM95',
-    'JA2': 'PM84',
-    'JA3': 'PM74',
-    'JA4': 'PM64',
-    'JA5': 'PM63',
-    'JA6': 'PM53',
-    'JA7': 'QM07',
-    'JA8': 'QN02',
-    'JA9': 'PM86',
-    'JA0': 'PM97',
-    'JD1': 'QL07',
+    JA1: 'PM95',
+    JA2: 'PM84',
+    JA3: 'PM74',
+    JA4: 'PM64',
+    JA5: 'PM63',
+    JA6: 'PM53',
+    JA7: 'QM07',
+    JA8: 'QN02',
+    JA9: 'PM86',
+    JA0: 'PM97',
+    JD1: 'QL07',
 
     // ============================================
     // Asia - China & Taiwan & Hong Kong
     // ============================================
-    'BY': 'OM92',
-    'BT': 'OM92',
-    'BA': 'OM92',
-    'BD': 'OM92',
-    'BG': 'OM92',
-    'BH': 'OM92',
-    'BI': 'OM92',
-    'BJ': 'OM92',
-    'BL': 'OM92',
-    'BM': 'OM92',
-    'BO': 'OM92',
-    'BP': 'OM92',
-    'BQ': 'OM92',
-    'BR': 'OM92',
-    'BS': 'OM92',
-    'BU': 'OM92',
-    'BV': 'PL04',
-    'BW': 'PL04',
-    'BX': 'PL04',
-    'BN': 'PL04',
-    'XX9': 'OL62',
-    'VR': 'OL62',
+    BY: 'OM92',
+    BT: 'OM92',
+    BA: 'OM92',
+    BD: 'OM92',
+    BG: 'OM92',
+    BH: 'OM92',
+    BI: 'OM92',
+    BJ: 'OM92',
+    BL: 'OM92',
+    BM: 'OM92',
+    BO: 'OM92',
+    BP: 'OM92',
+    BQ: 'OM92',
+    BR: 'OM92',
+    BS: 'OM92',
+    BU: 'OM92',
+    BV: 'PL04',
+    BW: 'PL04',
+    BX: 'PL04',
+    BN: 'PL04',
+    XX9: 'OL62',
+    VR: 'OL62',
 
     // ============================================
     // Asia - Korea
     // ============================================
-    'HL': 'PM37',
-    'DS': 'PM37',
+    HL: 'PM37',
+    DS: 'PM37',
     '6K': 'PM37',
     '6L': 'PM37',
     '6M': 'PM37',
     '6N': 'PM37',
-    'D7': 'PM37',
-    'D8': 'PM37',
-    'D9': 'PM37',
-    'P5': 'PM38',
+    D7: 'PM37',
+    D8: 'PM37',
+    D9: 'PM37',
+    P5: 'PM38',
 
     // ============================================
     // Asia - Southeast
     // ============================================
-    'HS': 'OK03',
-    'E2': 'OK03',
-    'XV': 'OK30',
+    HS: 'OK03',
+    E2: 'OK03',
+    XV: 'OK30',
     '3W': 'OK30',
-    'XU': 'OK10',
-    'XW': 'NK97',
-    'XZ': 'NL99',
+    XU: 'OK10',
+    XW: 'NK97',
+    XZ: 'NL99',
     '1Z': 'NL99',
     '9V': 'OJ11',
     '9M': 'OJ05',
@@ -5406,25 +4917,25 @@ function estimateLocationFromPrefix(callsign) {
     '9M8': 'OJ69',
     '9W6': 'OJ69',
     '9W8': 'OJ69',
-    'DU': 'PK04',
-    'DV': 'PK04',
-    'DW': 'PK04',
-    'DX': 'PK04',
-    'DY': 'PK04',
-    'DZ': 'PK04',
+    DU: 'PK04',
+    DV: 'PK04',
+    DW: 'PK04',
+    DX: 'PK04',
+    DY: 'PK04',
+    DZ: 'PK04',
     '4D': 'PK04',
     '4E': 'PK04',
     '4F': 'PK04',
     '4G': 'PK04',
     '4H': 'PK04',
     '4I': 'PK04',
-    'YB': 'OI33',
-    'YC': 'OI33',
-    'YD': 'OI33',
-    'YE': 'OI33',
-    'YF': 'OI33',
-    'YG': 'OI33',
-    'YH': 'OI33',
+    YB: 'OI33',
+    YC: 'OI33',
+    YD: 'OI33',
+    YE: 'OI33',
+    YF: 'OI33',
+    YG: 'OI33',
+    YH: 'OI33',
     '7A': 'OI33',
     '7B': 'OI33',
     '7C': 'OI33',
@@ -5443,170 +4954,170 @@ function estimateLocationFromPrefix(callsign) {
     '8G': 'OI33',
     '8H': 'OI33',
     '8I': 'OI33',
-    'V8': 'OJ84',
+    V8: 'OJ84',
 
     // ============================================
     // Asia - South
     // ============================================
-    'VU': 'MK82',
-    'VU2': 'MK82',
-    'VU3': 'MK82',
-    'VU4': 'MJ97',
-    'VU7': 'MJ58',
+    VU: 'MK82',
+    VU2: 'MK82',
+    VU3: 'MK82',
+    VU4: 'MJ97',
+    VU7: 'MJ58',
     '8T': 'MK82',
     '8U': 'MK82',
     '8V': 'MK82',
     '8W': 'MK82',
     '8X': 'MK82',
     '8Y': 'MK82',
-    'AP': 'MM44',
+    AP: 'MM44',
     '4S': 'MJ96',
-    'S2': 'NL93',
+    S2: 'NL93',
     '9N': 'NL27',
-    'A5': 'NL49',
+    A5: 'NL49',
     '8Q': 'MJ63',
 
     // ============================================
     // Asia - Middle East
     // ============================================
-    'A4': 'LL93',
-    'A41': 'LL93',
-    'A43': 'LL93',
-    'A45': 'LL93',
-    'A47': 'LL93',
-    'A6': 'LL65',
-    'A61': 'LL65',
-    'A62': 'LL65',
-    'A63': 'LL65',
-    'A65': 'LL65',
-    'A7': 'LL45',
-    'A71': 'LL45',
-    'A72': 'LL45',
-    'A73': 'LL45',
-    'A75': 'LL45',
-    'A9': 'LL56',
-    'A91': 'LL56',
-    'A92': 'LL56',
+    A4: 'LL93',
+    A41: 'LL93',
+    A43: 'LL93',
+    A45: 'LL93',
+    A47: 'LL93',
+    A6: 'LL65',
+    A61: 'LL65',
+    A62: 'LL65',
+    A63: 'LL65',
+    A65: 'LL65',
+    A7: 'LL45',
+    A71: 'LL45',
+    A72: 'LL45',
+    A73: 'LL45',
+    A75: 'LL45',
+    A9: 'LL56',
+    A91: 'LL56',
+    A92: 'LL56',
     '9K': 'LL47',
-    'HZ': 'LL24',
+    HZ: 'LL24',
     '7Z': 'LL24',
     '8Z': 'LL24',
     '4X': 'KM72',
     '4Z': 'KM72',
-    'OD': 'KM73',
-    'JY': 'KM71',
-    'YK': 'KM74',
-    'YI': 'LM30',
-    'EP': 'LL58',
-    'EQ': 'LL58',
-    'EK': 'LN20',
+    OD: 'KM73',
+    JY: 'KM71',
+    YK: 'KM74',
+    YI: 'LM30',
+    EP: 'LL58',
+    EQ: 'LL58',
+    EK: 'LN20',
     '4J': 'LN40',
     '4K': 'LN40',
     '4L': 'LN21',
-    'TA': 'KN41',
-    'TB': 'KN41',
-    'TC': 'KN41',
-    'YM': 'KN41',
-    'TA1': 'KN41',
+    TA: 'KN41',
+    TB: 'KN41',
+    TC: 'KN41',
+    YM: 'KN41',
+    TA1: 'KN41',
     '5B': 'KM64',
-    'C4': 'KM64',
-    'H2': 'KM64',
-    'P3': 'KM64',
-    'ZC4': 'KM64',
+    C4: 'KM64',
+    H2: 'KM64',
+    P3: 'KM64',
+    ZC4: 'KM64',
 
     // ============================================
     // Asia - Central
     // ============================================
-    'EX': 'MM78',
-    'EY': 'MM49',
-    'EZ': 'LN71',
-    'UK': 'MN41',
-    'UN': 'MN53',
-    'UP': 'MN53',
-    'UQ': 'MN53',
-    'YA': 'MM24',
-    'T6': 'MM24',
+    EX: 'MM78',
+    EY: 'MM49',
+    EZ: 'LN71',
+    UK: 'MN41',
+    UN: 'MN53',
+    UP: 'MN53',
+    UQ: 'MN53',
+    YA: 'MM24',
+    T6: 'MM24',
 
     // ============================================
     // Oceania - Australia
     // ============================================
-    'VK': 'QF56',
-    'VK1': 'QF44',
-    'VK2': 'QF56',
-    'VK3': 'QF22',
-    'VK4': 'QG62',
-    'VK5': 'PF95',
-    'VK6': 'OF86',
-    'VK7': 'QE38',
-    'VK8': 'PH57',
-    'VK9': 'QF56',
-    'VK9C': 'OH29',
-    'VK9X': 'NH93',
-    'VK9L': 'QF92',
-    'VK9W': 'QG14',
-    'VK9M': 'QG11',
-    'VK9N': 'RF73',
-    'VK0H': 'MC55',
-    'VK0M': 'QE37',
+    VK: 'QF56',
+    VK1: 'QF44',
+    VK2: 'QF56',
+    VK3: 'QF22',
+    VK4: 'QG62',
+    VK5: 'PF95',
+    VK6: 'OF86',
+    VK7: 'QE38',
+    VK8: 'PH57',
+    VK9: 'QF56',
+    VK9C: 'OH29',
+    VK9X: 'NH93',
+    VK9L: 'QF92',
+    VK9W: 'QG14',
+    VK9M: 'QG11',
+    VK9N: 'RF73',
+    VK0H: 'MC55',
+    VK0M: 'QE37',
 
     // ============================================
     // Oceania - New Zealand & Pacific
     // ============================================
-    'ZL': 'RF70',
-    'ZL1': 'RF72',
-    'ZL2': 'RF70',
-    'ZL3': 'RE66',
-    'ZL4': 'RE54',
-    'ZM': 'RF70',
-    'ZL7': 'AE67',
-    'ZL8': 'AH36',
-    'ZL9': 'RE44',
-    'E5': 'BH83',
-    'E51': 'BH83',
-    'E52': 'AI38',
-    'ZK3': 'AH89',
-    'FK': 'RG37',
-    'TX': 'RG37',
+    ZL: 'RF70',
+    ZL1: 'RF72',
+    ZL2: 'RF70',
+    ZL3: 'RE66',
+    ZL4: 'RE54',
+    ZM: 'RF70',
+    ZL7: 'AE67',
+    ZL8: 'AH36',
+    ZL9: 'RE44',
+    E5: 'BH83',
+    E51: 'BH83',
+    E52: 'AI38',
+    ZK3: 'AH89',
+    FK: 'RG37',
+    TX: 'RG37',
     'FK/C': 'RH29',
-    'FO': 'BH52',
+    FO: 'BH52',
     'FO/A': 'CJ07',
     'FO/C': 'CI06',
     'FO/M': 'DI79',
-    'FW': 'AH44',
-    'A3': 'AG28',
-    'A35': 'AG28',
+    FW: 'AH44',
+    A3: 'AG28',
+    A35: 'AG28',
     '5W': 'AH45',
-    'YJ': 'RH31',
-    'YJ0': 'RH31',
-    'H4': 'RI07',
-    'H44': 'RI07',
-    'P2': 'QI24',
-    'V6': 'QJ66',
-    'V7': 'RJ48',
-    'T8': 'PJ77',
-    'T2': 'RI87',
-    'T3': 'RI96',
-    'T31': 'AI58',
-    'T32': 'BI69',
-    'T33': 'AJ25',
-    'C2': 'QI32',
+    YJ: 'RH31',
+    YJ0: 'RH31',
+    H4: 'RI07',
+    H44: 'RI07',
+    P2: 'QI24',
+    V6: 'QJ66',
+    V7: 'RJ48',
+    T8: 'PJ77',
+    T2: 'RI87',
+    T3: 'RI96',
+    T31: 'AI58',
+    T32: 'BI69',
+    T33: 'AJ25',
+    C2: 'QI32',
     '3D2': 'RH91',
     '3D2C': 'QH38',
     '3D2R': 'RG26',
-    'ZK2': 'AI48',
-    'E6': 'AH28',
+    ZK2: 'AI48',
+    E6: 'AH28',
 
     // ============================================
     // Africa - North
     // ============================================
-    'CN': 'IM63',
+    CN: 'IM63',
     '5C': 'IM63',
     '5D': 'IM63',
     '7X': 'JM16',
     '3V': 'JM54',
-    'TS': 'JM54',
+    TS: 'JM54',
     '5A': 'JM73',
-    'SU': 'KL30',
+    SU: 'KL30',
     '6A': 'KL30',
 
     // ============================================
@@ -5614,102 +5125,102 @@ function estimateLocationFromPrefix(callsign) {
     // ============================================
     '5T': 'IL30',
     '6W': 'IK14',
-    'C5': 'IK13',
-    'J5': 'IK52',
+    C5: 'IK13',
+    J5: 'IK52',
     '3X': 'IJ75',
     '9L': 'IJ38',
-    'EL': 'IJ56',
-    'TU': 'IJ95',
+    EL: 'IJ56',
+    TU: 'IJ95',
     '9G': 'IJ95',
     '5V': 'JJ07',
-    'TY': 'JJ16',
+    TY: 'JJ16',
     '5N': 'JJ55',
     '5U': 'JK16',
-    'TZ': 'IK52',
-    'XT': 'JJ00',
-    'TJ': 'JJ55',
-    'D4': 'HK76',
+    TZ: 'IK52',
+    XT: 'JJ00',
+    TJ: 'JJ55',
+    D4: 'HK76',
 
     // ============================================
     // Africa - Central
     // ============================================
-    'TT': 'JK73',
-    'TN': 'JI64',
+    TT: 'JK73',
+    TN: 'JI64',
     '9Q': 'JI76',
-    'TL': 'JJ91',
-    'TR': 'JI41',
-    'S9': 'JJ40',
+    TL: 'JJ91',
+    TR: 'JI41',
+    S9: 'JJ40',
     '3C': 'JJ41',
-    'D2': 'JH84',
+    D2: 'JH84',
 
     // ============================================
     // Africa - East
     // ============================================
-    'ET': 'KJ49',
-    'E3': 'KJ76',
+    ET: 'KJ49',
+    E3: 'KJ76',
     '6O': 'LJ07',
-    'T5': 'LJ07',
-    'J2': 'LK03',
+    T5: 'LJ07',
+    J2: 'LK03',
     '5Z': 'KI88',
     '5X': 'KI42',
     '5H': 'KI73',
     '9X': 'KI45',
     '9U': 'KI23',
-    'C9': 'KH53',
+    C9: 'KH53',
     '7Q': 'KH54',
     '9J': 'KH35',
-    'Z2': 'KH42',
+    Z2: 'KH42',
     '7P': 'KG30',
     '3DA': 'KG53',
-    'A2': 'KG52',
-    'V5': 'JG87',
+    A2: 'KG52',
+    V5: 'JG87',
 
     // ============================================
     // Africa - South
     // ============================================
-    'ZS': 'KG33',
-    'ZR': 'KG33',
-    'ZT': 'KG33',
-    'ZU': 'KG33',
-    'ZS8': 'KG42',
+    ZS: 'KG33',
+    ZR: 'KG33',
+    ZT: 'KG33',
+    ZU: 'KG33',
+    ZS8: 'KG42',
     '3Y': 'JD45',
 
     // ============================================
     // Africa - Islands
     // ============================================
-    'D6': 'LH47',
+    D6: 'LH47',
     '5R': 'LH45',
     '3B8': 'LG89',
     '3B9': 'LH14',
     '3B6': 'LH28',
-    'S7': 'LI73',
-    'FT5W': 'KG42',
-    'FT5X': 'MC55',
-    'FT5Z': 'ME47',
-    'FR': 'LG79',
-    'FH': 'LI15',
-    'VQ9': 'MJ66',
+    S7: 'LI73',
+    FT5W: 'KG42',
+    FT5X: 'MC55',
+    FT5Z: 'ME47',
+    FR: 'LG79',
+    FH: 'LI15',
+    VQ9: 'MJ66',
 
     // ============================================
     // Antarctica
     // ============================================
-    'CE9': 'FC56',
-    'DP0': 'IB59',
-    'DP1': 'IB59',
-    'KC4': 'FC56',
+    CE9: 'FC56',
+    DP0: 'IB59',
+    DP1: 'IB59',
+    KC4: 'FC56',
     '8J1': 'LC97',
-    'R1AN': 'KC29',
-    'ZL5': 'RB32',
+    R1AN: 'KC29',
+    ZL5: 'RB32',
 
     // ============================================
     // Other/Islands
     // ============================================
-    'ZB': 'IM76',
-    'ZD7': 'IH74',
-    'ZD8': 'II22',
-    'ZD9': 'JE26',
+    ZB: 'IM76',
+    ZD7: 'IH74',
+    ZD8: 'II22',
+    ZD9: 'JE26',
     '9M0': 'NJ07',
-    'BQ9': 'PJ29',
+    BQ9: 'PJ29',
   };
 
   const upper = callsign.toUpperCase();
@@ -5761,9 +5272,7 @@ function estimateLocationFromPrefix(callsign) {
         lon: gridLoc.lon,
         grid: grid,
         country:
-          territoryPrefix3.startsWith('KP') ||
-          territoryPrefix3.startsWith('NP') ||
-          territoryPrefix3.startsWith('WP')
+          territoryPrefix3.startsWith('KP') || territoryPrefix3.startsWith('NP') || territoryPrefix3.startsWith('WP')
             ? 'Puerto Rico/USVI'
             : territoryPrefix3.startsWith('KH') ||
                 territoryPrefix3.startsWith('NH') ||
@@ -5801,10 +5310,7 @@ function estimateLocationFromPrefix(callsign) {
       9: 'EN52', // IL, IN, WI
     };
 
-    const grid =
-      district && usDistrictGrids[district]
-        ? usDistrictGrids[district]
-        : 'EM79';
+    const grid = district && usDistrictGrids[district] ? usDistrictGrids[district] : 'EM79';
     const gridLoc = maidenheadToLatLon(grid);
     if (gridLoc) {
       return {
@@ -5903,101 +5409,101 @@ function estimateLocationFromPrefix(callsign) {
 // Helper to get country name from prefix
 function getCountryFromPrefix(prefix) {
   const prefixCountries = {
-    'W': 'USA',
-    'K': 'USA',
-    'N': 'USA',
-    'AA': 'USA',
-    'KP4': 'Puerto Rico',
-    'NP4': 'Puerto Rico',
-    'WP4': 'Puerto Rico',
-    'KP2': 'US Virgin Is',
-    'NP2': 'US Virgin Is',
-    'WP2': 'US Virgin Is',
-    'KH6': 'Hawaii',
-    'NH6': 'Hawaii',
-    'WH6': 'Hawaii',
-    'KH2': 'Guam',
-    'KL7': 'Alaska',
-    'NL7': 'Alaska',
-    'WL7': 'Alaska',
-    'VE': 'Canada',
-    'VA': 'Canada',
-    'VY': 'Canada',
-    'VO': 'Canada',
-    'G': 'England',
-    'M': 'England',
+    W: 'USA',
+    K: 'USA',
+    N: 'USA',
+    AA: 'USA',
+    KP4: 'Puerto Rico',
+    NP4: 'Puerto Rico',
+    WP4: 'Puerto Rico',
+    KP2: 'US Virgin Is',
+    NP2: 'US Virgin Is',
+    WP2: 'US Virgin Is',
+    KH6: 'Hawaii',
+    NH6: 'Hawaii',
+    WH6: 'Hawaii',
+    KH2: 'Guam',
+    KL7: 'Alaska',
+    NL7: 'Alaska',
+    WL7: 'Alaska',
+    VE: 'Canada',
+    VA: 'Canada',
+    VY: 'Canada',
+    VO: 'Canada',
+    G: 'England',
+    M: 'England',
     '2E': 'England',
-    'GM': 'Scotland',
-    'GW': 'Wales',
-    'GI': 'N. Ireland',
-    'EI': 'Ireland',
-    'F': 'France',
-    'DL': 'Germany',
-    'I': 'Italy',
-    'EA': 'Spain',
-    'CT': 'Portugal',
-    'PA': 'Netherlands',
-    'ON': 'Belgium',
-    'HB': 'Switzerland',
-    'OE': 'Austria',
-    'OZ': 'Denmark',
-    'SM': 'Sweden',
-    'LA': 'Norway',
-    'OH': 'Finland',
-    'SP': 'Poland',
-    'OK': 'Czech Rep',
-    'HA': 'Hungary',
-    'YO': 'Romania',
-    'LZ': 'Bulgaria',
-    'UA': 'Russia',
-    'UR': 'Ukraine',
-    'JA': 'Japan',
-    'HL': 'S. Korea',
-    'BV': 'Taiwan',
-    'BY': 'China',
-    'VU': 'India',
-    'HS': 'Thailand',
-    'VK': 'Australia',
-    'ZL': 'New Zealand',
-    'LU': 'Argentina',
-    'PY': 'Brazil',
-    'ZV': 'Brazil',
-    'ZW': 'Brazil',
-    'ZX': 'Brazil',
-    'ZY': 'Brazil',
-    'ZZ': 'Brazil',
-    'CE': 'Chile',
-    'HK': 'Colombia',
-    'YV': 'Venezuela',
-    'HC': 'Ecuador',
-    'OA': 'Peru',
-    'CX': 'Uruguay',
-    'ZS': 'South Africa',
-    'CN': 'Morocco',
-    'SU': 'Egypt',
+    GM: 'Scotland',
+    GW: 'Wales',
+    GI: 'N. Ireland',
+    EI: 'Ireland',
+    F: 'France',
+    DL: 'Germany',
+    I: 'Italy',
+    EA: 'Spain',
+    CT: 'Portugal',
+    PA: 'Netherlands',
+    ON: 'Belgium',
+    HB: 'Switzerland',
+    OE: 'Austria',
+    OZ: 'Denmark',
+    SM: 'Sweden',
+    LA: 'Norway',
+    OH: 'Finland',
+    SP: 'Poland',
+    OK: 'Czech Rep',
+    HA: 'Hungary',
+    YO: 'Romania',
+    LZ: 'Bulgaria',
+    UA: 'Russia',
+    UR: 'Ukraine',
+    JA: 'Japan',
+    HL: 'S. Korea',
+    BV: 'Taiwan',
+    BY: 'China',
+    VU: 'India',
+    HS: 'Thailand',
+    VK: 'Australia',
+    ZL: 'New Zealand',
+    LU: 'Argentina',
+    PY: 'Brazil',
+    ZV: 'Brazil',
+    ZW: 'Brazil',
+    ZX: 'Brazil',
+    ZY: 'Brazil',
+    ZZ: 'Brazil',
+    CE: 'Chile',
+    HK: 'Colombia',
+    YV: 'Venezuela',
+    HC: 'Ecuador',
+    OA: 'Peru',
+    CX: 'Uruguay',
+    ZS: 'South Africa',
+    CN: 'Morocco',
+    SU: 'Egypt',
     '5N': 'Nigeria',
     '5Z': 'Kenya',
-    'ET': 'Ethiopia',
-    'TY': 'Benin',
-    'TU': 'Ivory Coast',
-    'TR': 'Gabon',
-    'TZ': 'Mali',
-    'V5': 'Namibia',
-    'A2': 'Botswana',
-    'JY': 'Jordan',
-    'HZ': 'Saudi Arabia',
-    'A6': 'UAE',
-    'A7': 'Qatar',
-    'A9': 'Bahrain',
-    'A4': 'Oman',
+    ET: 'Ethiopia',
+    TY: 'Benin',
+    TU: 'Ivory Coast',
+    TR: 'Gabon',
+    TZ: 'Mali',
+    V5: 'Namibia',
+    A2: 'Botswana',
+    JY: 'Jordan',
+    HZ: 'Saudi Arabia',
+    A6: 'UAE',
+    A7: 'Qatar',
+    A9: 'Bahrain',
+    A4: 'Oman',
     '4X': 'Israel',
-    'OD': 'Lebanon',
-    'YK': 'Syria',
-    'YI': 'Iraq',
-    'EP': 'Iran',
-    'TA': 'Turkey',
+    OD: 'Lebanon',
+    YK: 'Syria',
+    YI: 'Iraq',
+    EP: 'Iran',
+    TA: 'Turkey',
     '5B': 'Cyprus',
-    'EK': 'Armenia',
+    EK: 'Armenia',
     '4J': 'Azerbaijan',
   };
 
@@ -6049,13 +5555,10 @@ app.get('/api/myspots/:callsign', async (req, res) => {
     const controller = new AbortController();
     const timeout = setTimeout(() => controller.abort(), 10000);
 
-    const response = await fetch(
-      `https://www.hamqth.com/dxc_csv.php?limit=100`,
-      {
-        headers: { 'User-Agent': 'OpenHamClock/3.13.1' },
-        signal: controller.signal,
-      },
-    );
+    const response = await fetch(`https://www.hamqth.com/dxc_csv.php?limit=100`, {
+      headers: { 'User-Agent': 'OpenHamClock/3.13.1' },
+      signal: controller.signal,
+    });
     clearTimeout(timeout);
 
     if (response.ok) {
@@ -6074,12 +5577,7 @@ app.get('/api/myspots/:callsign', async (req, res) => {
         const timeStr = parts[4]?.trim() || '';
 
         // Check if our callsign is involved (as spotter or spotted)
-        if (
-          spotter === callsign ||
-          dxCall === callsign ||
-          spotter.includes(callsign) ||
-          dxCall.includes(callsign)
-        ) {
+        if (spotter === callsign || dxCall === callsign || spotter.includes(callsign) || dxCall.includes(callsign)) {
           mySpots.push({
             spotter,
             dxCall,
@@ -6096,9 +5594,7 @@ app.get('/api/myspots/:callsign', async (req, res) => {
     logDebug('[My Spots] Found', mySpots.length, 'spots involving', callsign);
 
     // Now try to get locations for each unique callsign
-    const uniqueCalls = [
-      ...new Set(mySpots.map((s) => (s.isMySpot ? s.dxCall : s.spotter))),
-    ];
+    const uniqueCalls = [...new Set(mySpots.map((s) => (s.isMySpot ? s.dxCall : s.spotter)))];
     const locations = {};
 
     for (const rawCall of uniqueCalls.slice(0, 10)) {
@@ -6217,10 +5713,7 @@ app.get('/api/pskreporter/config', (req, res) => {
     mqtt: {
       status: pskMqtt.connected ? 'connected' : 'disconnected',
       activeCallsigns: pskMqtt.subscribedCalls.size,
-      sseClients: [...pskMqtt.subscribers.values()].reduce(
-        (n, s) => n + s.size,
-        0,
-      ),
+      sseClients: [...pskMqtt.subscribers.values()].reduce((n, s) => n + s.size, 0),
     },
     info: 'Connect to /api/pskreporter/stream/:callsign for real-time spots via Server-Sent Events',
   });
@@ -6240,10 +5733,7 @@ app.get('/api/pskreporter/:callsign', async (req, res) => {
     mqtt: {
       status: pskMqtt.connected ? 'connected' : 'disconnected',
       activeCallsigns: pskMqtt.subscribedCalls.size,
-      sseClients: Array.from(pskMqtt.subscribers.values()).reduce(
-        (s, c) => s + c.size,
-        0,
-      ),
+      sseClients: Array.from(pskMqtt.subscribers.values()).reduce((s, c) => s + c.size, 0),
     },
   });
 });
@@ -6295,9 +5785,7 @@ function pskMqttConnect() {
   }
 
   const clientId = `ohc_svr_${Math.random().toString(16).substr(2, 8)}`;
-  console.log(
-    `[PSK-MQTT] Connecting to mqtt.pskreporter.info as ${clientId}...`,
-  );
+  console.log(`[PSK-MQTT] Connecting to mqtt.pskreporter.info as ${clientId}...`);
 
   const client = mqttLib.connect('wss://mqtt.pskreporter.info:1886/mqtt', {
     clientId,
@@ -6330,9 +5818,7 @@ function pskMqttConnect() {
           if (err.message && err.message.includes('onnection closed')) return;
           console.error(`[PSK-MQTT] Batch subscribe error:`, err.message);
         } else {
-          console.log(
-            `[PSK-MQTT] Subscribed ${count} callsigns (${topics.length} topics)`,
-          );
+          console.log(`[PSK-MQTT] Subscribed ${count} callsigns (${topics.length} topics)`);
         }
       });
     } else {
@@ -6378,16 +5864,13 @@ function pskMqttConnect() {
           lon: receiverLoc?.lon,
           direction: 'tx',
         };
-        if (!pskMqtt.spotBuffer.has(scUpper))
-          pskMqtt.spotBuffer.set(scUpper, []);
+        if (!pskMqtt.spotBuffer.has(scUpper)) pskMqtt.spotBuffer.set(scUpper, []);
         pskMqtt.spotBuffer.get(scUpper).push(txSpot);
         // Also add to recent spots (capped at insert time to prevent unbounded growth)
-        if (!pskMqtt.recentSpots.has(scUpper))
-          pskMqtt.recentSpots.set(scUpper, []);
+        if (!pskMqtt.recentSpots.has(scUpper)) pskMqtt.recentSpots.set(scUpper, []);
         const scRecent = pskMqtt.recentSpots.get(scUpper);
         scRecent.push(txSpot);
-        if (scRecent.length > 250)
-          pskMqtt.recentSpots.set(scUpper, scRecent.slice(-200));
+        if (scRecent.length > 250) pskMqtt.recentSpots.set(scUpper, scRecent.slice(-200));
       }
 
       // Buffer for RX subscribers (rc is the callsign being tracked)
@@ -6399,15 +5882,12 @@ function pskMqttConnect() {
           lon: senderLoc?.lon,
           direction: 'rx',
         };
-        if (!pskMqtt.spotBuffer.has(rcUpper))
-          pskMqtt.spotBuffer.set(rcUpper, []);
+        if (!pskMqtt.spotBuffer.has(rcUpper)) pskMqtt.spotBuffer.set(rcUpper, []);
         pskMqtt.spotBuffer.get(rcUpper).push(rxSpot);
-        if (!pskMqtt.recentSpots.has(rcUpper))
-          pskMqtt.recentSpots.set(rcUpper, []);
+        if (!pskMqtt.recentSpots.has(rcUpper)) pskMqtt.recentSpots.set(rcUpper, []);
         const rcRecent = pskMqtt.recentSpots.get(rcUpper);
         rcRecent.push(rxSpot);
-        if (rcRecent.length > 250)
-          pskMqtt.recentSpots.set(rcUpper, rcRecent.slice(-200));
+        if (rcRecent.length > 250) pskMqtt.recentSpots.set(rcUpper, rcRecent.slice(-200));
       }
     } catch {
       pskMqtt.stats.messagesDropped++;
@@ -6450,9 +5930,7 @@ function scheduleMqttReconnect() {
   );
   // Log first attempt and every 5th to avoid spam during extended outages
   if (pskMqtt.reconnectAttempts === 1 || pskMqtt.reconnectAttempts % 5 === 0) {
-    console.log(
-      `[PSK-MQTT] Reconnecting in ${(delay / 1000).toFixed(1)}s (attempt ${pskMqtt.reconnectAttempts})...`,
-    );
+    console.log(`[PSK-MQTT] Reconnecting in ${(delay / 1000).toFixed(1)}s (attempt ${pskMqtt.reconnectAttempts})...`);
   }
   pskMqtt.reconnectTimer = setTimeout(() => {
     pskMqtt.reconnectTimer = null;
@@ -6566,7 +6044,7 @@ app.get('/api/pskreporter/stream/:callsign', (req, res) => {
   res.writeHead(200, {
     'Content-Type': 'text/event-stream',
     'Cache-Control': 'no-cache, no-transform',
-    'Connection': 'keep-alive',
+    Connection: 'keep-alive',
     'X-Accel-Buffering': 'no',
     'Content-Encoding': 'identity',
   });
@@ -6597,10 +6075,7 @@ app.get('/api/pskreporter/stream/:callsign', (req, res) => {
       subscribeCallsign(callsign);
     }
     // Start MQTT connection if not already connected
-    if (
-      !pskMqtt.client ||
-      (!pskMqtt.connected && pskMqtt.reconnectAttempts === 0)
-    ) {
+    if (!pskMqtt.client || (!pskMqtt.connected && pskMqtt.reconnectAttempts === 0)) {
       pskMqttConnect();
     }
   }
@@ -6625,9 +6100,7 @@ app.get('/api/pskreporter/stream/:callsign', (req, res) => {
     const clients = pskMqtt.subscribers.get(callsign);
     if (clients) {
       clients.delete(res);
-      console.log(
-        `[PSK-MQTT] SSE client disconnected for ${callsign} (${clients.size} remaining)`,
-      );
+      console.log(`[PSK-MQTT] SSE client disconnected for ${callsign} (${clients.size} remaining)`);
 
       // If no more clients for this callsign, unsubscribe after a grace period
       if (clients.size === 0) {
@@ -6640,15 +6113,11 @@ app.get('/api/pskreporter/stream/:callsign', (req, res) => {
             pskMqtt.recentSpots.delete(callsign);
             pskMqtt.spotBuffer.delete(callsign);
             unsubscribeCallsign(callsign);
-            console.log(
-              `[PSK-MQTT] Unsubscribed ${callsign} (no more clients after grace period)`,
-            );
+            console.log(`[PSK-MQTT] Unsubscribed ${callsign} (no more clients after grace period)`);
 
             // If no subscribers at all, disconnect MQTT entirely
             if (pskMqtt.subscribedCalls.size === 0 && pskMqtt.client) {
-              console.log(
-                '[PSK-MQTT] No more subscribers, disconnecting from broker',
-              );
+              console.log('[PSK-MQTT] No more subscribers, disconnecting from broker');
               // Cancel any pending reconnect
               if (pskMqtt.reconnectTimer) {
                 clearTimeout(pskMqtt.reconnectTimer);
@@ -6693,9 +6162,7 @@ function latLonToGrid(lat, lon) {
 
   // Subsquare (2 chars): 5' lon x 2.5' lat
   const subsq1 = String.fromCharCode(65 + Math.floor(((adjLon % 2) * 60) / 5));
-  const subsq2 = String.fromCharCode(
-    65 + Math.floor(((adjLat % 1) * 60) / 2.5),
-  );
+  const subsq2 = String.fromCharCode(65 + Math.floor(((adjLat % 1) * 60) / 2.5));
 
   return `${field1}${field2}${square1}${square2}${subsq1}${subsq2}`.toUpperCase();
 }
@@ -6713,10 +6180,7 @@ const callsignLocationCache = new Map(); // Cache for skimmer/station locations
 const LOCATION_CACHE_MAX = 2000; // ~1000 active RBN skimmers worldwide, 2x headroom
 
 function cacheCallsignLocation(call, data) {
-  if (
-    callsignLocationCache.size >= LOCATION_CACHE_MAX &&
-    !callsignLocationCache.has(call)
-  ) {
+  if (callsignLocationCache.size >= LOCATION_CACHE_MAX && !callsignLocationCache.has(call)) {
     const oldest = callsignLocationCache.keys().next().value;
     if (oldest) callsignLocationCache.delete(oldest);
   }
@@ -6747,9 +6211,7 @@ function maintainRBNConnection(port = 7000) {
     return; // Already connected
   }
 
-  console.log(
-    `[RBN] Creating persistent connection to telnet.reversebeacon.net:${port}...`,
-  );
+  console.log(`[RBN] Creating persistent connection to telnet.reversebeacon.net:${port}...`);
 
   let dataBuffer = '';
   let authenticated = false;
@@ -6796,9 +6258,7 @@ function maintainRBNConnection(port = 7000) {
       // CW:   DX de W3LPL-#:     7003.0  K3LR           CW    30 dB  23 WPM  CQ      0123Z
       // FT8:  DX de KM3T-#:     14074.0  K3LR           FT8   -12 dB              CQ      0123Z
       // RTTY: DX de W3LPL-#:    14080.0  K3LR           RTTY  15 dB  45 BPS  CQ      0123Z
-      const spotMatch = line.match(
-        /DX de\s+(\S+)\s*:\s*([\d.]+)\s+(\S+)\s+(\S+)\s+([-\d]+)\s+dB/,
-      );
+      const spotMatch = line.match(/DX de\s+(\S+)\s*:\s*([\d.]+)\s+(\S+)\s+(\S+)\s+([-\d]+)\s+dB/);
 
       if (spotMatch) {
         const [, skimmer, freq, dx, mode, snr] = spotMatch;
@@ -6887,9 +6347,7 @@ setInterval(() => {
     }
   }
   if (cleaned > 0) {
-    console.log(
-      `[RBN] Cleanup: removed ${cleaned} expired spots, tracking ${rbnSpotsByDX.size} DX stations`,
-    );
+    console.log(`[RBN] Cleanup: removed ${cleaned} expired spots, tracking ${rbnSpotsByDX.size} DX stations`);
   }
   // Also purge expired rbnApiCaches entries (10s TTL, but entries never removed otherwise)
   const apiCutoff = Date.now() - 60000; // Keep entries under 1 minute (6x the 10s TTL)
@@ -6917,12 +6375,10 @@ async function enrichSpotWithLocation(spot) {
 
   // Lookup location (don't block on failures)
   try {
-    const response = await fetch(
-      `http://localhost:${PORT}/api/callsign/${skimmerCall}`,
-    );
+    const response = await fetch(`http://localhost:${PORT}/api/callsign/${skimmerCall}`);
     if (response.ok) {
       const locationData = await response.json();
-      
+
       // Verify the API returned data for the callsign we asked for
       // (guards against any response mix-up or redirect)
       const returnedCall = (locationData.callsign || '').toUpperCase();
@@ -6931,11 +6387,14 @@ async function enrichSpotWithLocation(spot) {
         console.warn(`[RBN] Callsign mismatch! Requested: ${skimmerCall}, Got: ${returnedCall} — discarding`);
         return spot;
       }
-      
+
       // Validate coordinates are reasonable
-      if (typeof locationData.lat === 'number' && typeof locationData.lon === 'number' &&
-          Math.abs(locationData.lat) <= 90 && Math.abs(locationData.lon) <= 180) {
-        
+      if (
+        typeof locationData.lat === 'number' &&
+        typeof locationData.lon === 'number' &&
+        Math.abs(locationData.lat) <= 90 &&
+        Math.abs(locationData.lon) <= 180
+      ) {
         // Cross-validate: compare returned location against prefix estimate
         // If they're wildly different, the lookup data may be wrong
         const prefixLoc = estimateLocationFromPrefix(requestedBase);
@@ -6946,14 +6405,16 @@ async function enrichSpotWithLocation(spot) {
             if (dist > 5000) {
               // Location is > 5000 km from where the callsign prefix says it should be
               // This is almost certainly wrong data — use prefix estimate instead
-              console.warn(`[RBN] Location sanity check FAILED for ${skimmerCall}: lookup=${locationData.lat.toFixed(1)},${locationData.lon.toFixed(1)} vs prefix=${prefixCoords.lat.toFixed(1)},${prefixCoords.lon.toFixed(1)} (${Math.round(dist)} km apart) — using prefix`);
+              console.warn(
+                `[RBN] Location sanity check FAILED for ${skimmerCall}: lookup=${locationData.lat.toFixed(1)},${locationData.lon.toFixed(1)} vs prefix=${prefixCoords.lat.toFixed(1)},${prefixCoords.lon.toFixed(1)} (${Math.round(dist)} km apart) — using prefix`,
+              );
               const grid = latLonToGrid(prefixCoords.lat, prefixCoords.lon);
               const location = {
                 callsign: skimmerCall,
                 grid: grid,
                 lat: prefixCoords.lat,
                 lon: prefixCoords.lon,
-                country: prefixLoc.country || locationData.country
+                country: prefixLoc.country || locationData.country,
               };
               cacheCallsignLocation(skimmerCall, location);
               return {
@@ -6961,12 +6422,12 @@ async function enrichSpotWithLocation(spot) {
                 grid: grid,
                 skimmerLat: prefixCoords.lat,
                 skimmerLon: prefixCoords.lon,
-                skimmerCountry: location.country
+                skimmerCountry: location.country,
               };
             }
           }
         }
-        
+
         const grid = latLonToGrid(locationData.lat, locationData.lon);
 
         const location = {
@@ -7028,17 +6489,19 @@ app.get('/api/rbn/spots', async (req, res) => {
 
   // Direct O(1) lookup by DX callsign — no scanning the full firehose
   const dxSpots = rbnSpotsByDX.get(callsign) || [];
-  const recentSpots = dxSpots.filter(spot => spot.timestampMs > cutoff);
-  
+  const recentSpots = dxSpots.filter((spot) => spot.timestampMs > cutoff);
+
   // Enrich with skimmer locations — process sequentially to avoid
   // concurrent lookup race conditions that can mix up locations
   const enrichedSpots = [];
   for (const spot of recentSpots) {
     enrichedSpots.push(await enrichSpotWithLocation(spot));
   }
-  
-  console.log(`[RBN] Returning ${enrichedSpots.length} spots for ${callsign} (last ${minutes} min, ${rbnSpotsByDX.size} DX stations tracked)`);
-  
+
+  console.log(
+    `[RBN] Returning ${enrichedSpots.length} spots for ${callsign} (last ${minutes} min, ${rbnSpotsByDX.size} DX stations tracked)`,
+  );
+
   const response = {
     count: enrichedSpots.length,
     spots: enrichedSpots,
@@ -7064,9 +6527,7 @@ app.get('/api/rbn/location/:callsign', async (req, res) => {
 
   try {
     // Look up via HamQTH
-    const response = await fetch(
-      `http://localhost:${PORT}/api/callsign/${callsign}`,
-    );
+    const response = await fetch(`http://localhost:${PORT}/api/callsign/${callsign}`);
     if (response.ok) {
       const locationData = await response.json();
       const grid = latLonToGrid(locationData.lat, locationData.lon);
@@ -7093,9 +6554,7 @@ app.get('/api/rbn/location/:callsign', async (req, res) => {
 
 // Legacy endpoint for compatibility (deprecated)
 app.get('/api/rbn', async (req, res) => {
-  console.log(
-    '[RBN] Warning: Using deprecated /api/rbn endpoint, use /api/rbn/spots instead',
-  );
+  console.log('[RBN] Warning: Using deprecated /api/rbn endpoint, use /api/rbn/spots instead');
 
   const callsign = (req.query.callsign || '').toUpperCase().trim();
   const minutes = parseInt(req.query.minutes) || 30;
@@ -7110,9 +6569,7 @@ app.get('/api/rbn', async (req, res) => {
 
   // Filter spots for this callsign
   const userSpots = rbnSpots
-    .filter(
-      (spot) => spot.timestampMs > cutoff && spot.dx.toUpperCase() === callsign,
-    )
+    .filter((spot) => spot.timestampMs > cutoff && spot.dx.toUpperCase() === callsign)
     .slice(-limit);
 
   res.json(userSpots);
@@ -7273,11 +6730,7 @@ app.get('/api/wspr/heatmap', async (req, res) => {
   const cacheKey = `wspr:${minutes}:${band}:${raw ? 'raw' : 'agg'}`;
 
   // 1. Fresh cache hit — serve immediately
-  if (
-    wsprCache.data &&
-    wsprCache.data.cacheKey === cacheKey &&
-    now - wsprCache.timestamp < WSPR_CACHE_TTL
-  ) {
+  if (wsprCache.data && wsprCache.data.cacheKey === cacheKey && now - wsprCache.timestamp < WSPR_CACHE_TTL) {
     return res.json({ ...wsprCache.data.result, cached: true });
   }
 
@@ -7298,10 +6751,7 @@ app.get('/api/wspr/heatmap', async (req, res) => {
   }
 
   // 3. Stale-while-revalidate: if stale data exists, serve it and refresh in background
-  const hasStale =
-    wsprCache.data &&
-    wsprCache.data.cacheKey === cacheKey &&
-    now - wsprCache.timestamp < WSPR_STALE_TTL;
+  const hasStale = wsprCache.data && wsprCache.data.cacheKey === cacheKey && now - wsprCache.timestamp < WSPR_STALE_TTL;
 
   // 4. Deduplicated upstream fetch — WSPR is global data, so all users share ONE in-flight request
   const doFetch = () =>
@@ -7315,20 +6765,15 @@ app.get('/api/wspr/heatmap', async (req, res) => {
       const response = await fetch(url, {
         headers: {
           'User-Agent': 'OpenHamClock/15.2.12 (Amateur Radio Dashboard)',
-          'Accept': '*/*',
+          Accept: '*/*',
         },
         signal: controller.signal,
       });
       clearTimeout(timeout);
 
       if (!response.ok) {
-        const backoffSecs = upstream.recordFailure(
-          'pskreporter',
-          response.status,
-        );
-        throw new Error(
-          `HTTP ${response.status} — backing off for ${backoffSecs}s`,
-        );
+        const backoffSecs = upstream.recordFailure('pskreporter', response.status);
+        throw new Error(`HTTP ${response.status} — backing off for ${backoffSecs}s`);
       }
 
       const xml = await response.text();
@@ -7357,12 +6802,7 @@ app.get('/api/wspr/heatmap', async (req, res) => {
         const receiverAz = getAttr('receiverAzimuth');
         const drift = getAttr('drift');
 
-        if (
-          receiverCallsign &&
-          senderCallsign &&
-          senderLocator &&
-          receiverLocator
-        ) {
+        if (receiverCallsign && senderCallsign && senderLocator && receiverLocator) {
           const freq = frequency ? parseInt(frequency) : null;
           const spotBand = freq ? getBandFromHz(freq) : 'Unknown';
 
@@ -7373,14 +6813,9 @@ app.get('/api/wspr/heatmap', async (req, res) => {
 
           if (senderLoc && receiverLoc) {
             const powerWatts = power ? parseFloat(power) : null;
-            const powerDbm = powerWatts
-              ? (10 * Math.log10(powerWatts * 1000)).toFixed(0)
-              : null;
+            const powerDbm = powerWatts ? (10 * Math.log10(powerWatts * 1000)).toFixed(0) : null;
             const dist = distance ? parseInt(distance) : null;
-            const kPerW =
-              dist && powerWatts && powerWatts > 0
-                ? Math.round(dist / powerWatts)
-                : null;
+            const kPerW = dist && powerWatts && powerWatts > 0 ? Math.round(dist / powerWatts) : null;
 
             spots.push({
               sender: senderCallsign,
@@ -7402,12 +6837,8 @@ app.get('/api/wspr/heatmap', async (req, res) => {
               receiverAz: receiverAz ? parseInt(receiverAz) : null,
               drift: drift ? parseInt(drift) : null,
               kPerW: kPerW,
-              timestamp: flowStartSecs
-                ? parseInt(flowStartSecs) * 1000
-                : Date.now(),
-              age: flowStartSecs
-                ? Math.floor((Date.now() / 1000 - parseInt(flowStartSecs)) / 60)
-                : 0,
+              timestamp: flowStartSecs ? parseInt(flowStartSecs) * 1000 : Date.now(),
+              age: flowStartSecs ? Math.floor((Date.now() / 1000 - parseInt(flowStartSecs)) / 60) : 0,
             });
           }
         }
@@ -7427,9 +6858,7 @@ app.get('/api/wspr/heatmap', async (req, res) => {
           source: 'pskreporter',
           format: 'raw',
         };
-        console.log(
-          `[WSPR Heatmap] Returning ${spots.length} raw spots (${minutes}min, band: ${band})`,
-        );
+        console.log(`[WSPR Heatmap] Returning ${spots.length} raw spots (${minutes}min, band: ${band})`);
       } else {
         const aggregated = aggregateWSPRByGrid(spots);
         result = {
@@ -7485,7 +6914,7 @@ app.get('/api/wspr/heatmap', async (req, res) => {
 // Updated list of active amateur radio satellites and selected weather satellites
 const HAM_SATELLITES = {
   // High Priority - Popular FM satellites
-  'ISS': {
+  ISS: {
     norad: 25544,
     name: 'ISS (ZARYA)',
     color: '#00ffff',
@@ -7783,7 +7212,7 @@ const HAM_SATELLITES = {
   },
 
   // APRS Digipeaters
-  'ARISS': {
+  ARISS: {
     norad: 25544,
     name: 'ARISS (ISS)',
     color: '#00ffff',
@@ -7799,7 +7228,7 @@ const HAM_SATELLITES = {
     priority: 4,
     mode: 'Telemetry',
   },
-  'MEZNSAT': {
+  MEZNSAT: {
     norad: 46489,
     name: 'MeznSat',
     color: '#66ff66',
@@ -7824,13 +7253,13 @@ app.get('/api/satellites/tle', async (req, res) => {
     const now = Date.now();
 
     // Return memory cache if fresh (6-hour window)
-    if (tleCache.data && (now - tleCache.timestamp) < TLE_CACHE_DURATION) {
+    if (tleCache.data && now - tleCache.timestamp < TLE_CACHE_DURATION) {
       return res.json(tleCache.data);
     }
 
     logDebug('[Satellites] Fetching fresh TLE data from multiple groups...');
     const tleData = {};
-    
+
     const controller = new AbortController();
     const timeout = setTimeout(() => controller.abort(), 15000);
 
@@ -7839,13 +7268,10 @@ app.get('/api/satellites/tle', async (req, res) => {
 
     for (const group of groups) {
       try {
-        const response = await fetch(
-          `https://celestrak.org/NORAD/elements/gp.php?GROUP=${group}&FORMAT=tle`,
-          {
-            headers: { 'User-Agent': 'OpenHamClock/3.3' },
-            signal: controller.signal,
-          },
-        );
+        const response = await fetch(`https://celestrak.org/NORAD/elements/gp.php?GROUP=${group}&FORMAT=tle`, {
+          headers: { 'User-Agent': 'OpenHamClock/3.3' },
+          signal: controller.signal,
+        });
 
         if (response.ok) {
           const text = await response.text();
@@ -7859,18 +7285,14 @@ app.get('/api/satellites/tle', async (req, res) => {
               const noradId = parseInt(line1.substring(2, 7));
 
               // Skip if this NORAD ID already exists (prevent duplicates)
-              const alreadyExists = Object.values(tleData).some(
-                (sat) => sat.norad === noradId,
-              );
+              const alreadyExists = Object.values(tleData).some((sat) => sat.norad === noradId);
               if (alreadyExists) continue;
 
               // Create a sanitized key from the satellite name
               const key = name.replace(/[^A-Z0-9\-]/g, '_').toUpperCase();
 
               // Check if we have metadata in HAM_SATELLITES
-              const hamSat = Object.values(HAM_SATELLITES).find(
-                (s) => s.norad === noradId,
-              );
+              const hamSat = Object.values(HAM_SATELLITES).find((s) => s.norad === noradId);
 
               if (hamSat) {
                 // Use defined metadata from HAM_SATELLITES
@@ -7902,9 +7324,7 @@ app.get('/api/satellites/tle', async (req, res) => {
     // Fallback for ISS if it wasn't found in the groups above
     if (!issExists) {
       try {
-        const issRes = await fetch(
-          'https://celestrak.org/NORAD/elements/gp.php?CATNR=25544&FORMAT=tle',
-        );
+        const issRes = await fetch('https://celestrak.org/NORAD/elements/gp.php?CATNR=25544&FORMAT=tle');
         if (issRes.ok) {
           const issText = await issRes.text();
           const issLines = issText.trim().split('\n');
@@ -7946,10 +7366,7 @@ async function fetchIonosondeData() {
   const now = Date.now();
 
   // Return cached data if fresh
-  if (
-    ionosondeCache.data &&
-    now - ionosondeCache.timestamp < ionosondeCache.maxAge
-  ) {
+  if (ionosondeCache.data && now - ionosondeCache.timestamp < ionosondeCache.maxAge) {
     return ionosondeCache.data;
   }
 
@@ -7992,9 +7409,7 @@ async function fetchIonosondeData() {
       timestamp: now,
     };
 
-    logDebug(
-      `[Ionosonde] Fetched ${validStations.length} valid stations from KC2G`,
-    );
+    logDebug(`[Ionosonde] Fetched ${validStations.length} valid stations from KC2G`);
     return validStations;
   } catch (error) {
     logErrorOnce('Ionosonde', `Fetch error: ${error.message}`);
@@ -8024,10 +7439,7 @@ function haversineDistance(lat1, lon1, lat2, lon2) {
   const dLon = ((lon2 - lon1) * Math.PI) / 180;
   const a =
     Math.sin(dLat / 2) * Math.sin(dLat / 2) +
-    Math.cos((lat1 * Math.PI) / 180) *
-      Math.cos((lat2 * Math.PI) / 180) *
-      Math.sin(dLon / 2) *
-      Math.sin(dLon / 2);
+    Math.cos((lat1 * Math.PI) / 180) * Math.cos((lat2 * Math.PI) / 180) * Math.sin(dLon / 2) * Math.sin(dLon / 2);
   return R * 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a));
 }
 
@@ -8071,9 +7483,7 @@ function interpolateFoF2(lat, lon, stations) {
   }
 
   // Filter to only stations within valid range
-  const validStations = stationsWithDist.filter(
-    (s) => s.distance <= MAX_VALID_DISTANCE,
-  );
+  const validStations = stationsWithDist.filter((s) => s.distance <= MAX_VALID_DISTANCE);
   const nearest = validStations.slice(0, 5);
 
   // If very close to a station, use its value directly
@@ -8134,25 +7544,14 @@ let iturhfpropCache = {
 /**
  * Fetch base prediction from ITURHFProp service
  */
-async function fetchITURHFPropPrediction(
-  txLat,
-  txLon,
-  rxLat,
-  rxLon,
-  ssn,
-  month,
-  hour,
-) {
+async function fetchITURHFPropPrediction(txLat, txLon, rxLat, rxLon, ssn, month, hour) {
   if (!ITURHFPROP_URL) return null;
 
   const cacheKey = `${txLat.toFixed(1)},${txLon.toFixed(1)}-${rxLat.toFixed(1)},${rxLon.toFixed(1)}-${ssn}-${month}-${hour}`;
   const now = Date.now();
 
   // Check cache
-  if (
-    iturhfpropCache.key === cacheKey &&
-    now - iturhfpropCache.timestamp < iturhfpropCache.maxAge
-  ) {
+  if (iturhfpropCache.key === cacheKey && now - iturhfpropCache.timestamp < iturhfpropCache.maxAge) {
     return iturhfpropCache.data;
   }
 
@@ -8286,12 +7685,7 @@ function applyHybridCorrection(iturhfpropData, ionoData, kIndex, sfi) {
       reliability: Math.round(correctedReliability),
       baseReliability: Math.round(baseReliability),
       correctionApplied: correction.factor !== 1.0,
-      status:
-        correctedReliability >= 70
-          ? 'GOOD'
-          : correctedReliability >= 40
-            ? 'FAIR'
-            : 'POOR',
+      status: correctedReliability >= 70 ? 'GOOD' : correctedReliability >= 40 ? 'FAIR' : 'POOR',
     };
   }
 
@@ -8359,9 +7753,7 @@ app.get('/api/propagation', async (req, res) => {
       // Prefer SWPC summary (updates every few hours) + N0NBH for SSN
       const [summaryRes, kRes] = await Promise.allSettled([
         fetch('https://services.swpc.noaa.gov/products/summary/10cm-flux.json'),
-        fetch(
-          'https://services.swpc.noaa.gov/products/noaa-planetary-k-index.json',
-        ),
+        fetch('https://services.swpc.noaa.gov/products/noaa-planetary-k-index.json'),
       ]);
 
       if (summaryRes.status === 'fulfilled' && summaryRes.value.ok) {
@@ -8410,11 +7802,7 @@ app.get('/api/propagation', async (req, res) => {
 
     // Get ionospheric data at path midpoint
     const ionoData = interpolateFoF2(midLat, midLon, ionosondeStations);
-    const hasValidIonoData = !!(
-      ionoData &&
-      ionoData.method !== 'no-coverage' &&
-      ionoData.foF2
-    );
+    const hasValidIonoData = !!(ionoData && ionoData.method !== 'no-coverage' && ionoData.foF2);
 
     const currentHour = new Date().getUTCHours();
     const currentMonth = new Date().getMonth() + 1;
@@ -8445,15 +7833,8 @@ app.get('/api/propagation', async (req, res) => {
 
       if (iturhfpropData && hasValidIonoData) {
         // Full hybrid: ITURHFProp + ionosonde correction
-        hybridResult = applyHybridCorrection(
-          iturhfpropData,
-          ionoData,
-          kIndex,
-          sfi,
-        );
-        logDebug(
-          '[Propagation] Using HYBRID mode (ITURHFProp + ionosonde correction)',
-        );
+        hybridResult = applyHybridCorrection(iturhfpropData, ionoData, kIndex, sfi);
+        logDebug('[Propagation] Using HYBRID mode (ITURHFProp + ionosonde correction)');
       } else if (iturhfpropData) {
         // ITURHFProp only (no ionosonde coverage)
         hybridResult = {
@@ -8466,17 +7847,7 @@ app.get('/api/propagation', async (req, res) => {
     }
 
     // ===== FALLBACK: Built-in calculations =====
-    const bands = [
-      '160m',
-      '80m',
-      '40m',
-      '30m',
-      '20m',
-      '17m',
-      '15m',
-      '12m',
-      '10m',
-    ];
+    const bands = ['160m', '80m', '40m', '30m', '20m', '17m', '15m', '12m', '10m'];
     const bandFreqs = [1.8, 3.5, 7, 10, 14, 18, 21, 24, 28];
 
     // Generate predictions (hybrid or fallback)
@@ -8551,8 +7922,7 @@ app.get('/api/propagation', async (req, res) => {
 
         // Get hybrid reliability for this band (the accurate one)
         const hybridBand = hybridResult.bands?.[band];
-        const hybridReliability =
-          hybridBand?.reliability || builtInCurrentReliability;
+        const hybridReliability = hybridBand?.reliability || builtInCurrentReliability;
 
         // Calculate correction ratio (how much to scale predictions)
         // Avoid division by zero, and cap the ratio to prevent extreme corrections
@@ -8583,10 +7953,7 @@ app.get('/api/propagation', async (req, res) => {
             signalMarginDb,
           );
           // Apply correction ratio and clamp to valid range
-          const correctedReliability = Math.min(
-            99,
-            Math.max(0, Math.round(baseReliability * correctionRatio)),
-          );
+          const correctedReliability = Math.min(99, Math.max(0, Math.round(baseReliability * correctionRatio)));
           predictions[band].push({
             hour,
             reliability: correctedReliability,
@@ -8638,16 +8005,7 @@ app.get('/api/propagation', async (req, res) => {
 
     // Calculate MUF and LUF
     const currentMuf =
-      hybridResult?.muf ||
-      calculateMUF(
-        distance,
-        midLat,
-        midLon,
-        currentHour,
-        sfi,
-        ssn,
-        effectiveIonoData,
-      );
+      hybridResult?.muf || calculateMUF(distance, midLat, midLon, currentHour, sfi, ssn, effectiveIonoData);
     const currentLuf = calculateLUF(distance, midLat, currentHour, sfi, kIndex);
 
     // Build ionospheric response
@@ -8734,10 +8092,7 @@ app.get('/api/propagation/heatmap', async (req, res) => {
   const cacheKey = `${deLat.toFixed(0)}:${deLon.toFixed(0)}:${freq}:${gridSize}:${txMode}:${txPower}`;
   const now = Date.now();
 
-  if (
-    PROP_HEATMAP_CACHE[cacheKey] &&
-    now - PROP_HEATMAP_CACHE[cacheKey].ts < PROP_HEATMAP_TTL
-  ) {
+  if (PROP_HEATMAP_CACHE[cacheKey] && now - PROP_HEATMAP_CACHE[cacheKey].ts < PROP_HEATMAP_TTL) {
     return res.json(PROP_HEATMAP_CACHE[cacheKey].data);
   }
 
@@ -8749,9 +8104,7 @@ app.get('/api/propagation/heatmap', async (req, res) => {
     try {
       const [fluxRes, kRes] = await Promise.allSettled([
         fetch('https://services.swpc.noaa.gov/json/f107_cm_flux.json'),
-        fetch(
-          'https://services.swpc.noaa.gov/products/noaa-planetary-k-index.json',
-        ),
+        fetch('https://services.swpc.noaa.gov/products/noaa-planetary-k-index.json'),
       ]);
       if (fluxRes.status === 'fulfilled' && fluxRes.value.ok) {
         const data = await fluxRes.value.json();
@@ -8970,8 +8323,7 @@ function calculateEnhancedReliability(
   if (ionoData && hour !== currentHour) {
     // Estimate foF2 change based on diurnal variation
     // foF2 typically varies by factor of 2-3 between day and night
-    const currentHourFactor =
-      1 + 0.4 * Math.cos(((currentHour - 14) * Math.PI) / 12);
+    const currentHourFactor = 1 + 0.4 * Math.cos(((currentHour - 14) * Math.PI) / 12);
     const targetHourFactor = 1 + 0.4 * Math.cos(((hour - 14) * Math.PI) / 12);
     const scaleFactor = targetHourFactor / currentHourFactor;
 
@@ -8982,15 +8334,7 @@ function calculateEnhancedReliability(
     };
   }
 
-  const muf = calculateMUF(
-    distance,
-    midLat,
-    midLon,
-    hour,
-    sfi,
-    ssn,
-    hourIonoData,
-  );
+  const muf = calculateMUF(distance, midLat, midLon, hour, sfi, ssn, hourIonoData);
   const luf = calculateLUF(distance, midLat, hour, sfi, kIndex);
 
   // Apply signal margin from mode + power to MUF/LUF boundaries.
@@ -9009,15 +8353,13 @@ function calculateEnhancedReliability(
     reliability = Math.max(0, 30 - (freq - effectiveMuf) * 5);
   } else if (freq > effectiveMuf) {
     // Slightly above MUF - marginal (sometimes works due to scatter)
-    reliability =
-      30 + ((effectiveMuf * 1.1 - freq) / (effectiveMuf * 0.1)) * 20;
+    reliability = 30 + ((effectiveMuf * 1.1 - freq) / (effectiveMuf * 0.1)) * 20;
   } else if (freq < effectiveLuf * 0.8) {
     // Well below LUF - absorbed
     reliability = Math.max(0, 20 - (effectiveLuf - freq) * 10);
   } else if (freq < effectiveLuf) {
     // Near LUF - marginal
-    reliability =
-      20 + ((freq - effectiveLuf * 0.8) / (effectiveLuf * 0.2)) * 30;
+    reliability = 20 + ((freq - effectiveLuf * 0.8) / (effectiveLuf * 0.2)) * 30;
   } else {
     // In usable range - calculate optimum
     // Optimum Working Frequency (OWF) is typically 80-85% of MUF
@@ -9036,8 +8378,7 @@ function calculateEnhancedReliability(
         reliability = 50 + (position / optimalPosition) * 45;
       } else {
         // Above OWF - reliability decreases as we approach MUF
-        reliability =
-          95 - ((position - optimalPosition) / (1 - optimalPosition)) * 45;
+        reliability = 95 - ((position - optimalPosition) / (1 - optimalPosition)) * 45;
       }
     }
   }
@@ -9139,16 +8480,13 @@ app.get('/api/contests', async (req, res) => {
     const controller = new AbortController();
     const timeout = setTimeout(() => controller.abort(), 10000);
 
-    const response = await fetch(
-      'https://www.contestcalendar.com/calendar.rss',
-      {
-        headers: {
-          'User-Agent': 'OpenHamClock/3.13.1',
-          'Accept': 'application/rss+xml, application/xml, text/xml',
-        },
-        signal: controller.signal,
+    const response = await fetch('https://www.contestcalendar.com/calendar.rss', {
+      headers: {
+        'User-Agent': 'OpenHamClock/3.13.1',
+        Accept: 'application/rss+xml, application/xml, text/xml',
       },
-    );
+      signal: controller.signal,
+    });
     clearTimeout(timeout);
 
     if (response.ok) {
@@ -9207,29 +8545,17 @@ function parseContestRSS(xml) {
       const parsed = parseContestDateTime(desc, currentYear);
 
       if (parsed) {
-        const status =
-          now >= parsed.start && now <= parsed.end ? 'active' : 'upcoming';
+        const status = now >= parsed.start && now <= parsed.end ? 'active' : 'upcoming';
 
         // Try to detect mode from contest name
         let mode = 'Mixed';
         const nameLower = name.toLowerCase();
-        if (nameLower.includes('cw') || nameLower.includes('morse'))
-          mode = 'CW';
-        else if (
-          nameLower.includes('ssb') ||
-          nameLower.includes('phone') ||
-          nameLower.includes('sideband')
-        )
+        if (nameLower.includes('cw') || nameLower.includes('morse')) mode = 'CW';
+        else if (nameLower.includes('ssb') || nameLower.includes('phone') || nameLower.includes('sideband'))
           mode = 'SSB';
         else if (nameLower.includes('rtty')) mode = 'RTTY';
-        else if (
-          nameLower.includes('ft4') ||
-          nameLower.includes('ft8') ||
-          nameLower.includes('digi')
-        )
-          mode = 'Digital';
-        else if (nameLower.includes('vhf') || nameLower.includes('uhf'))
-          mode = 'VHF';
+        else if (nameLower.includes('ft4') || nameLower.includes('ft8') || nameLower.includes('digi')) mode = 'Digital';
+        else if (nameLower.includes('vhf') || nameLower.includes('uhf')) mode = 'VHF';
 
         contests.push({
           name,
@@ -9268,12 +8594,9 @@ function parseContestDateTime(desc, year) {
     };
 
     // Pattern 1: "1300Z, Jan 31 to 1300Z, Feb 1"
-    const rangeMatch = desc.match(
-      /(\d{4})Z,\s*(\w+)\s+(\d+)\s+to\s+(\d{4})Z,\s*(\w+)\s+(\d+)/i,
-    );
+    const rangeMatch = desc.match(/(\d{4})Z,\s*(\w+)\s+(\d+)\s+to\s+(\d{4})Z,\s*(\w+)\s+(\d+)/i);
     if (rangeMatch) {
-      const [, startTime, startMon, startDay, endTime, endMon, endDay] =
-        rangeMatch;
+      const [, startTime, startMon, startDay, endTime, endMon, endDay] = rangeMatch;
       const startMonth = months[startMon.toLowerCase()];
       const endMonth = months[endMon.toLowerCase()];
 
@@ -9311,22 +8634,10 @@ function parseContestDateTime(desc, year) {
       const month = months[mon.toLowerCase()];
 
       const start = new Date(
-        Date.UTC(
-          year,
-          month,
-          parseInt(day),
-          parseInt(startTime.substring(0, 2)),
-          parseInt(startTime.substring(2, 4)),
-        ),
+        Date.UTC(year, month, parseInt(day), parseInt(startTime.substring(0, 2)), parseInt(startTime.substring(2, 4))),
       );
       const end = new Date(
-        Date.UTC(
-          year,
-          month,
-          parseInt(day),
-          parseInt(endTime.substring(0, 2)),
-          parseInt(endTime.substring(2, 4)),
-        ),
+        Date.UTC(year, month, parseInt(day), parseInt(endTime.substring(0, 2)), parseInt(endTime.substring(2, 4))),
       );
 
       // Handle overnight contests (end time < start time means next day)
@@ -9342,22 +8653,10 @@ function parseContestDateTime(desc, year) {
       const month = months[mon.toLowerCase()];
 
       const start = new Date(
-        Date.UTC(
-          year,
-          month,
-          parseInt(day),
-          parseInt(startTime.substring(0, 2)),
-          parseInt(startTime.substring(2, 4)),
-        ),
+        Date.UTC(year, month, parseInt(day), parseInt(startTime.substring(0, 2)), parseInt(startTime.substring(2, 4))),
       );
       const end = new Date(
-        Date.UTC(
-          year,
-          month,
-          parseInt(day),
-          parseInt(endTime.substring(0, 2)),
-          parseInt(endTime.substring(2, 4)),
-        ),
+        Date.UTC(year, month, parseInt(day), parseInt(endTime.substring(0, 2)), parseInt(endTime.substring(2, 4))),
       );
 
       if (end <= start) end.setUTCDate(end.getUTCDate() + 1);
@@ -9566,13 +8865,10 @@ function calculateUpcomingContests() {
 
       // Most contests start at 00:00 UTC Saturday
       startDate.setUTCHours(0, 0, 0, 0);
-      const endDate = new Date(
-        startDate.getTime() + contest.duration * 3600000,
-      );
+      const endDate = new Date(startDate.getTime() + contest.duration * 3600000);
 
       if (endDate > now) {
-        const status =
-          now >= startDate && now <= endDate ? 'active' : 'upcoming';
+        const status = now >= startDate && now <= endDate ? 'active' : 'upcoming';
         contests.push({
           name: contest.name,
           start: startDate.toISOString(),
@@ -9635,16 +8931,11 @@ function generateStatusDashboard() {
 
   // Calculate time since first deployment
   const firstStart = new Date(visitorStats.serverFirstStarted);
-  const trackingDays = Math.floor(
-    (Date.now() - firstStart.getTime()) / 86400000,
-  );
+  const trackingDays = Math.floor((Date.now() - firstStart.getTime()) / 86400000);
 
   const avg =
     visitorStats.history.length > 0
-      ? Math.round(
-          visitorStats.history.reduce((sum, d) => sum + d.uniqueVisitors, 0) /
-            visitorStats.history.length,
-        )
+      ? Math.round(visitorStats.history.reduce((sum, d) => sum + d.uniqueVisitors, 0) / visitorStats.history.length)
       : visitorStats.uniqueIPsToday.length;
 
   // Get last 14 days for the chart
@@ -9665,9 +8956,7 @@ function generateStatusDashboard() {
     .map((d) => {
       const height = Math.max((d.uniqueVisitors / maxVisitors) * 100, 2);
       const date = new Date(d.date);
-      const dayLabel = date
-        .toLocaleDateString('en-US', { weekday: 'short' })
-        .slice(0, 2);
+      const dayLabel = date.toLocaleDateString('en-US', { weekday: 'short' }).slice(0, 2);
       const isToday = d.date === visitorStats.today;
       return `
       <div class="bar-container" title="${d.date}: ${d.uniqueVisitors} visitors, ${d.totalRequests} requests">
@@ -9681,14 +8970,9 @@ function generateStatusDashboard() {
     .join('');
 
   // Calculate week-over-week growth
-  const thisWeek = chartData
-    .slice(-7)
-    .reduce((sum, d) => sum + d.uniqueVisitors, 0);
-  const lastWeek = chartData
-    .slice(-14, -7)
-    .reduce((sum, d) => sum + d.uniqueVisitors, 0);
-  const growth =
-    lastWeek > 0 ? Math.round(((thisWeek - lastWeek) / lastWeek) * 100) : 0;
+  const thisWeek = chartData.slice(-7).reduce((sum, d) => sum + d.uniqueVisitors, 0);
+  const lastWeek = chartData.slice(-14, -7).reduce((sum, d) => sum + d.uniqueVisitors, 0);
+  const growth = lastWeek > 0 ? Math.round(((thisWeek - lastWeek) / lastWeek) * 100) : 0;
   const growthIcon = growth > 0 ? '📈' : growth < 0 ? '📉' : '➡️';
   const growthColor = growth > 0 ? '#00ff88' : growth < 0 ? '#ff4466' : '#888';
 
@@ -9696,10 +8980,7 @@ function generateStatusDashboard() {
   const apiStats = endpointStats.getStats();
   const estimatedMonthlyGB =
     apiStats.uptimeHours > 0
-      ? (
-          ((apiStats.totalBytes / parseFloat(apiStats.uptimeHours)) * 24 * 30) /
-          (1024 * 1024 * 1024)
-        ).toFixed(2)
+      ? (((apiStats.totalBytes / parseFloat(apiStats.uptimeHours)) * 24 * 30) / (1024 * 1024 * 1024)).toFixed(2)
       : '0.00';
 
   // Get session stats
@@ -9711,10 +8992,7 @@ function generateStatusDashboard() {
     .map((ep, i) => {
       const bytesFormatted = formatBytes(ep.totalBytes);
       const avgBytesFormatted = formatBytes(ep.avgBytes);
-      const bandwidthBar = Math.min(
-        (ep.totalBytes / (apiStats.totalBytes || 1)) * 100,
-        100,
-      );
+      const bandwidthBar = Math.min((ep.totalBytes / (apiStats.totalBytes || 1)) * 100, 100);
       return `
       <tr>
         <td style="color: #888">${i + 1}</td>
@@ -10212,12 +9490,8 @@ function generateStatusDashboard() {
 
     ${(() => {
       // Country statistics section
-      const allTimeCountries = Object.entries(
-        visitorStats.countryStats || {},
-      ).sort((a, b) => b[1] - a[1]);
-      const todayCountries = Object.entries(
-        visitorStats.countryStatsToday || {},
-      ).sort((a, b) => b[1] - a[1]);
+      const allTimeCountries = Object.entries(visitorStats.countryStats || {}).sort((a, b) => b[1] - a[1]);
+      const todayCountries = Object.entries(visitorStats.countryStatsToday || {}).sort((a, b) => b[1] - a[1]);
       const totalResolved = allTimeCountries.reduce((s, [, v]) => s + v, 0);
 
       if (allTimeCountries.length === 0 && geoIPQueue.size === 0) return '';
@@ -10225,9 +9499,7 @@ function generateStatusDashboard() {
       // Country code to flag emoji
       const flag = (cc) => {
         try {
-          return String.fromCodePoint(
-            ...[...cc.toUpperCase()].map((c) => 0x1f1e5 + c.charCodeAt(0) - 64),
-          );
+          return String.fromCodePoint(...[...cc.toUpperCase()].map((c) => 0x1f1e5 + c.charCodeAt(0) - 64));
         } catch {
           return '🏳';
         }
@@ -10345,11 +9617,8 @@ function generateStatusDashboard() {
               const backedOff = upstream.isBackedOff(svc);
               const remaining = upstream.backoffRemaining(svc);
               const consecutive = upstream.backoffs.get(svc)?.consecutive || 0;
-              const prefix =
-                svc === 'pskreporter' ? ['psk:', 'wspr:'] : ['weather:'];
-              const inFlight = [...upstream.inFlight.keys()].filter((k) =>
-                prefix.some((p) => k.startsWith(p)),
-              ).length;
+              const prefix = svc === 'pskreporter' ? ['psk:', 'wspr:'] : ['weather:'];
+              const inFlight = [...upstream.inFlight.keys()].filter((k) => prefix.some((p) => k.startsWith(p))).length;
               const label = 'PSKReporter (WSPR Heatmap)';
               return `<tr>
               <td>${label}</td>
@@ -10401,8 +9670,7 @@ app.get('/api/health', (req, res) => {
   rolloverVisitorStats();
 
   // SECURITY: Check if request is authenticated for full details
-  const token =
-    req.headers.authorization?.replace('Bearer ', '') || req.query.key || '';
+  const token = req.headers.authorization?.replace('Bearer ', '') || req.query.key || '';
   const isAuthed = API_WRITE_KEY && token === API_WRITE_KEY;
 
   // Check if browser wants HTML or explicitly requesting JSON
@@ -10415,10 +9683,7 @@ app.get('/api/health', (req, res) => {
     // JSON response for API consumers
     const avg =
       visitorStats.history.length > 0
-        ? Math.round(
-            visitorStats.history.reduce((sum, d) => sum + d.uniqueVisitors, 0) /
-              visitorStats.history.length,
-          )
+        ? Math.round(visitorStats.history.reduce((sum, d) => sum + d.uniqueVisitors, 0) / visitorStats.history.length)
         : visitorStats.uniqueIPsToday.length;
 
     // Get endpoint monitoring stats
@@ -10491,9 +9756,8 @@ app.get('/api/health', (req, res) => {
           status: upstream.isBackedOff('pskreporter') ? 'backoff' : 'ok',
           backoffRemaining: upstream.backoffRemaining('pskreporter'),
           consecutive: upstream.backoffs.get('pskreporter')?.consecutive || 0,
-          inFlightRequests: [...upstream.inFlight.keys()].filter(
-            (k) => k.startsWith('psk:') || k.startsWith('wspr:'),
-          ).length,
+          inFlightRequests: [...upstream.inFlight.keys()].filter((k) => k.startsWith('psk:') || k.startsWith('wspr:'))
+            .length,
         },
         weather: {
           status: 'client-direct',
@@ -10503,27 +9767,14 @@ app.get('/api/health', (req, res) => {
         pskMqttProxy: {
           connected: pskMqtt.connected,
           // SECURITY: Only expose active callsigns to authenticated requests
-          activeCallsigns: isAuthed
-            ? [...pskMqtt.subscribedCalls]
-            : pskMqtt.subscribedCalls.size,
-          sseClients: [...pskMqtt.subscribers.values()].reduce(
-            (n, s) => n + s.size,
-            0,
-          ),
+          activeCallsigns: isAuthed ? [...pskMqtt.subscribedCalls] : pskMqtt.subscribedCalls.size,
+          sseClients: [...pskMqtt.subscribers.values()].reduce((n, s) => n + s.size, 0),
           spotsReceived: pskMqtt.stats.spotsReceived,
           spotsRelayed: pskMqtt.stats.spotsRelayed,
           messagesDropped: pskMqtt.stats.messagesDropped,
-          bufferedSpots: [...pskMqtt.spotBuffer.values()].reduce(
-            (n, b) => n + b.length,
-            0,
-          ),
-          recentSpotsCache: [...pskMqtt.recentSpots.values()].reduce(
-            (n, s) => n + s.length,
-            0,
-          ),
-          lastSpotTime: pskMqtt.stats.lastSpotTime
-            ? new Date(pskMqtt.stats.lastSpotTime).toISOString()
-            : null,
+          bufferedSpots: [...pskMqtt.spotBuffer.values()].reduce((n, b) => n + b.length, 0),
+          recentSpotsCache: [...pskMqtt.recentSpots.values()].reduce((n, s) => n + s.length, 0),
+          lastSpotTime: pskMqtt.stats.lastSpotTime ? new Date(pskMqtt.stats.lastSpotTime).toISOString() : null,
         },
       },
     });
@@ -10553,8 +9804,7 @@ app.get('/api/version', (req, res) => {
 // On multi-user hosted deployments (openhamclock.com), leave disabled —
 // settings stay in each user's browser localStorage.
 
-const SETTINGS_SYNC_ENABLED =
-  (process.env.SETTINGS_SYNC || '').toLowerCase() === 'true';
+const SETTINGS_SYNC_ENABLED = (process.env.SETTINGS_SYNC || '').toLowerCase() === 'true';
 
 function getSettingsFilePath() {
   if (!SETTINGS_SYNC_ENABLED) return null;
@@ -10581,14 +9831,9 @@ function getSettingsFilePath() {
 }
 
 const SETTINGS_FILE = getSettingsFilePath();
-if (SETTINGS_SYNC_ENABLED && SETTINGS_FILE)
-  logInfo(`[Settings] ✓ Sync enabled, using: ${SETTINGS_FILE}`);
-else if (SETTINGS_SYNC_ENABLED)
-  logWarn('[Settings] Sync enabled but no writable path found');
-else
-  logInfo(
-    '[Settings] Sync disabled (set SETTINGS_SYNC=true in .env to enable)',
-  );
+if (SETTINGS_SYNC_ENABLED && SETTINGS_FILE) logInfo(`[Settings] ✓ Sync enabled, using: ${SETTINGS_FILE}`);
+else if (SETTINGS_SYNC_ENABLED) logWarn('[Settings] Sync enabled but no writable path found');
+else logInfo('[Settings] Sync disabled (set SETTINGS_SYNC=true in .env to enable)');
 
 function loadServerSettings() {
   if (!SETTINGS_SYNC_ENABLED || !SETTINGS_FILE) return null;
@@ -10637,10 +9882,7 @@ app.post('/api/settings', writeLimiter, requireWriteAuth, (req, res) => {
   // Only allow openhamclock_* and ohc_* keys (security: prevent arbitrary data injection)
   const filtered = {};
   for (const [key, value] of Object.entries(settings)) {
-    if (
-      (key.startsWith('openhamclock_') || key.startsWith('ohc_')) &&
-      typeof value === 'string'
-    ) {
+    if ((key.startsWith('openhamclock_') || key.startsWith('ohc_')) && typeof value === 'string') {
       filtered[key] = value;
     }
   }
@@ -10690,8 +9932,7 @@ app.get('/api/config', (req, res) => {
     configIncomplete: CONFIG.callsign === 'N0CALL' || !CONFIG.gridSquare,
 
     // Server timezone (from TZ env var or system)
-    timezone:
-      process.env.TZ || Intl.DateTimeFormat().resolvedOptions().timeZone || '',
+    timezone: process.env.TZ || Intl.DateTimeFormat().resolvedOptions().timeZone || '',
 
     // Feature availability
     features: {
@@ -11092,17 +10333,7 @@ function parseDecodeMessage(text) {
 
   // FT8/FT4 protocol tokens that look like valid Maidenhead grids but aren't
   // RR73 matches [A-R]{2}\d{2} but is a QSO acknowledgment
-  const FT8_TOKENS = new Set([
-    'RR73',
-    'RR53',
-    'RR13',
-    'RR23',
-    'RR33',
-    'RR43',
-    'RR63',
-    'RR83',
-    'RR93',
-  ]);
+  const FT8_TOKENS = new Set(['RR73', 'RR53', 'RR13', 'RR23', 'RR33', 'RR43', 'RR63', 'RR83', 'RR93']);
 
   // Validate grid: must be valid Maidenhead AND not an FT8 protocol token
   function isGrid(s) {
@@ -11133,8 +10364,7 @@ function parseDecodeMessage(text) {
     // Modifiers (DX, POTA, NA, EU, etc.) come before it
     if (tokens.length >= 1) {
       result.caller = tokens[tokens.length - 1];
-      result.modifier =
-        tokens.length >= 2 ? tokens.slice(0, -1).join(' ') : null;
+      result.modifier = tokens.length >= 2 ? tokens.slice(0, -1).join(' ') : null;
     }
 
     result.grid = grid;
@@ -11297,28 +10527,17 @@ function handleWSJTXMessage(msg, state) {
         const targetCall = extractBaseCallsign(rawCall);
         if (targetCall) {
           const cached = callsignLookupCache.get(targetCall);
-          if (
-            cached &&
-            Date.now() - cached.timestamp < CALLSIGN_CACHE_TTL &&
-            cached.data?.lat != null
-          ) {
+          if (cached && Date.now() - cached.timestamp < CALLSIGN_CACHE_TTL && cached.data?.lat != null) {
             decode.lat = cached.data.lat;
             decode.lon = cached.data.lon;
             decode.gridSource = 'hamqth';
-          } else if (
-            targetCall.length >= 3 &&
-            !wsjtxHamqthInflight.has(targetCall) &&
-            wsjtxHamqthInflight.size < 5
-          ) {
+          } else if (targetCall.length >= 3 && !wsjtxHamqthInflight.has(targetCall) && wsjtxHamqthInflight.size < 5) {
             // Background lookup for next cycle (fire-and-forget, max 5 concurrent)
             wsjtxHamqthInflight.add(targetCall);
-            fetch(
-              `https://www.hamqth.com/dxcc.php?callsign=${encodeURIComponent(targetCall)}`,
-              {
-                headers: { 'User-Agent': 'OpenHamClock/' + APP_VERSION },
-                signal: AbortSignal.timeout(5000),
-              },
-            )
+            fetch(`https://www.hamqth.com/dxcc.php?callsign=${encodeURIComponent(targetCall)}`, {
+              headers: { 'User-Agent': 'OpenHamClock/' + APP_VERSION },
+              signal: AbortSignal.timeout(5000),
+            })
               .then(async (resp) => {
                 if (!resp.ok) return;
                 const text = await resp.text();
@@ -11440,7 +10659,7 @@ function handleWSJTXMessage(msg, state) {
 }
 
 // ---- N3FJP Logged QSO relay (in-memory) ----
-const N3FJP_QSO_RETENTION_MINUTES = parseInt(process.env.N3FJP_QSO_RETENTION_MINUTES || "1440", 10);
+const N3FJP_QSO_RETENTION_MINUTES = parseInt(process.env.N3FJP_QSO_RETENTION_MINUTES || '1440', 10);
 let n3fjpQsos = [];
 
 function pruneN3fjpQsos() {
@@ -11466,9 +10685,7 @@ async function lookupCallLatLon(callsign) {
 
   try {
     // Reuse your existing endpoint (keeps all HamQTH/grid logic in one place)
-    const resp = await fetch(
-      `http://localhost:${PORT}/api/callsign/${encodeURIComponent(call)}`,
-    );
+    const resp = await fetch(`http://localhost:${PORT}/api/callsign/${encodeURIComponent(call)}`);
     if (!resp.ok) return null;
 
     const data = await resp.json();
@@ -11485,8 +10702,7 @@ async function lookupCallLatLon(callsign) {
 // POST one QSO from a bridge (your Python script)
 app.post('/api/n3fjp/qso', writeLimiter, requireWriteAuth, async (req, res) => {
   const qso = req.body || {};
-  if (!qso.dx_call)
-    return res.status(400).json({ ok: false, error: 'dx_call required' });
+  if (!qso.dx_call) return res.status(400).json({ ok: false, error: 'dx_call required' });
 
   if (!qso.ts_utc) qso.ts_utc = new Date().toISOString();
   if (!qso.source) qso.source = 'n3fjp_to_timemapper_udp';
@@ -11598,8 +10814,7 @@ app.get('/api/wsjtx', (req, res) => {
   }
 
   // Relay is "connected" if this session's relay was seen in last 60 seconds
-  const relayConnected =
-    state.relay && Date.now() - state.relay.lastSeen < 60000;
+  const relayConnected = state.relay && Date.now() - state.relay.lastSeen < 60000;
 
   res.json({
     enabled: WSJTX_ENABLED,
@@ -11622,15 +10837,10 @@ app.get('/api/wsjtx', (req, res) => {
 // API endpoint: get just decodes (lightweight polling)
 app.get('/api/wsjtx/decodes', (req, res) => {
   const sessionId = req.query.session || '';
-  const state =
-    sessionId && WSJTX_RELAY_KEY
-      ? wsjtxRelaySessions[sessionId] || { decodes: [] }
-      : wsjtxState;
+  const state = sessionId && WSJTX_RELAY_KEY ? wsjtxRelaySessions[sessionId] || { decodes: [] } : wsjtxState;
 
   const since = parseInt(req.query.since) || 0;
-  const decodes = since
-    ? state.decodes.filter((d) => d.timestamp > since)
-    : state.decodes.slice(-100);
+  const decodes = since ? state.decodes.filter((d) => d.timestamp > since) : state.decodes.slice(-100);
 
   res.json({ decodes, timestamp: Date.now() });
 });
@@ -11641,9 +10851,7 @@ app.get('/api/wsjtx/decodes', (req, res) => {
 app.post('/api/wsjtx/relay', (req, res) => {
   // Auth check
   if (!WSJTX_RELAY_KEY) {
-    return res
-      .status(503)
-      .json({ error: 'Relay not configured — set WSJTX_RELAY_KEY in .env' });
+    return res.status(503).json({ error: 'Relay not configured — set WSJTX_RELAY_KEY in .env' });
   }
 
   const authHeader = req.headers.authorization || '';
@@ -11686,10 +10894,7 @@ app.post('/api/wsjtx/relay', (req, res) => {
   for (const msg of batch) {
     if (msg && typeof msg.type === 'number' && msg.id) {
       // Ensure timestamp is reasonable (within last 5 minutes or use server time)
-      if (
-        !msg.timestamp ||
-        Math.abs(Date.now() - msg.timestamp) > 5 * 60 * 1000
-      ) {
+      if (!msg.timestamp || Math.abs(Date.now() - msg.timestamp) > 5 * 60 * 1000) {
         msg.timestamp = Date.now();
       }
       handleWSJTXMessage(msg, session);
@@ -11716,9 +10921,7 @@ app.get('/api/wsjtx/relay/agent.js', (req, res) => {
 // Embeds relay.js + server URL + relay key into a one-file launcher
 app.get('/api/wsjtx/relay/download/:platform', (req, res) => {
   if (!WSJTX_RELAY_KEY) {
-    return res
-      .status(503)
-      .json({ error: 'Relay not configured — set WSJTX_RELAY_KEY in .env' });
+    return res.status(503).json({ error: 'Relay not configured — set WSJTX_RELAY_KEY in .env' });
   }
 
   const platform = req.params.platform; // 'linux', 'mac', or 'windows'
@@ -11746,9 +10949,7 @@ app.get('/api/wsjtx/relay/download/:platform', (req, res) => {
 
   // SECURITY: Validate platform parameter
   if (!['linux', 'mac', 'windows'].includes(platform)) {
-    return res
-      .status(400)
-      .json({ error: 'Invalid platform. Use: linux, mac, or windows' });
+    return res.status(400).json({ error: 'Invalid platform. Use: linux, mac, or windows' });
   }
 
   // SECURITY: Sanitize all values embedded into generated scripts to prevent command injection
@@ -11767,8 +10968,7 @@ app.get('/api/wsjtx/relay/download/:platform', (req, res) => {
       '# OpenHamClock WSJT-X Relay — Auto-configured',
       '# Generated by ' + safeServerURL,
       '#',
-      '# Usage:  bash ' +
-        (platform === 'mac' ? 'start-relay.command' : 'start-relay.sh'),
+      '# Usage:  bash ' + (platform === 'mac' ? 'start-relay.command' : 'start-relay.sh'),
       '# Stop:   Ctrl+C',
       '# Requires: Node.js 14+ (https://nodejs.org)',
       '#',
@@ -11807,13 +11007,9 @@ app.get('/api/wsjtx/relay/download/:platform', (req, res) => {
     ];
 
     const script = lines.join('\n') + '\n';
-    const filename =
-      platform === 'mac' ? 'start-relay.command' : 'start-relay.sh';
+    const filename = platform === 'mac' ? 'start-relay.command' : 'start-relay.sh';
     res.setHeader('Content-Type', 'application/x-sh');
-    res.setHeader(
-      'Content-Disposition',
-      'attachment; filename="' + filename + '"',
-    );
+    res.setHeader('Content-Disposition', 'attachment; filename="' + filename + '"');
     return res.send(script);
   } else if (platform === 'windows') {
     // .bat that auto-downloads portable Node.js if needed, then runs relay
@@ -11930,15 +11126,10 @@ app.get('/api/wsjtx/relay/download/:platform', (req, res) => {
 
     const script = batLines.join('\r\n') + '\r\n';
     res.setHeader('Content-Type', 'application/x-msdos-program');
-    res.setHeader(
-      'Content-Disposition',
-      'attachment; filename="start-relay.bat"',
-    );
+    res.setHeader('Content-Disposition', 'attachment; filename="start-relay.bat"');
     return res.send(script);
   } else {
-    return res
-      .status(400)
-      .json({ error: 'Invalid platform. Use: linux, mac, or windows' });
+    return res.status(400).json({ error: 'Invalid platform. Use: linux, mac, or windows' });
   }
 });
 
@@ -11996,17 +11187,12 @@ app.get('/api/rig/package.json', (req, res) => {
 app.get('/api/rig/download/:platform', (req, res) => {
   const platform = req.params.platform;
   if (!['linux', 'mac', 'windows'].includes(platform)) {
-    return res
-      .status(400)
-      .json({ error: 'Invalid platform. Use: linux, mac, or windows' });
+    return res.status(400).json({ error: 'Invalid platform. Use: linux, mac, or windows' });
   }
 
   const proto = req.headers['x-forwarded-proto'] || req.protocol || 'http';
   const host = req.headers['x-forwarded-host'] || req.headers.host;
-  const serverURL = (proto + '://' + host).replace(
-    /[^a-zA-Z0-9._\-:\/\@]/g,
-    '',
-  );
+  const serverURL = (proto + '://' + host).replace(/[^a-zA-Z0-9._\-:\/\@]/g, '');
 
   if (platform === 'windows') {
     const NODE_VERSION = 'v22.13.1';
@@ -12127,17 +11313,11 @@ app.get('/api/rig/download/:platform', (req, res) => {
       ].join('\r\n') + '\r\n';
 
     res.setHeader('Content-Type', 'application/x-msdos-program');
-    res.setHeader(
-      'Content-Disposition',
-      'attachment; filename="OpenHamClock-Rig-Listener.bat"',
-    );
+    res.setHeader('Content-Disposition', 'attachment; filename="OpenHamClock-Rig-Listener.bat"');
     return res.send(bat);
   } else {
     // Linux / Mac
-    const filename =
-      platform === 'mac'
-        ? 'OpenHamClock-Rig-Listener.command'
-        : 'OpenHamClock-Rig-Listener.sh';
+    const filename = platform === 'mac' ? 'OpenHamClock-Rig-Listener.command' : 'OpenHamClock-Rig-Listener.sh';
     const rigDir = '$HOME/openhamclock-rig';
 
     const sh =
@@ -12175,14 +11355,10 @@ app.get('/api/rig/download/:platform', (req, res) => {
         '',
         '# Download latest rig-listener.js',
         'echo "  Downloading rig listener..."',
-        'curl -sL "' +
-          serverURL +
-          '/api/rig/listener.js" -o "$RIG_DIR/rig-listener.js"',
+        'curl -sL "' + serverURL + '/api/rig/listener.js" -o "$RIG_DIR/rig-listener.js"',
         '',
         '# package.json (always refresh)',
-        'curl -sL "' +
-          serverURL +
-          '/api/rig/package.json" -o "$RIG_DIR/package.json"',
+        'curl -sL "' + serverURL + '/api/rig/package.json" -o "$RIG_DIR/package.json"',
         '',
         '# npm install (one-time)',
         'if [ ! -d "$RIG_DIR/node_modules/serialport" ]; then',
@@ -12202,10 +11378,7 @@ app.get('/api/rig/download/:platform', (req, res) => {
       ].join('\n') + '\n';
 
     res.setHeader('Content-Type', 'application/x-sh');
-    res.setHeader(
-      'Content-Disposition',
-      'attachment; filename="' + filename + '"',
-    );
+    res.setHeader('Content-Disposition', 'attachment; filename="' + filename + '"');
     return res.send(sh);
   }
 });
@@ -12213,8 +11386,7 @@ app.get('/api/rig/download/:platform', (req, res) => {
 const N1MM_UDP_PORT = parseInt(process.env.N1MM_UDP_PORT || '12060');
 const N1MM_ENABLED = process.env.N1MM_UDP_ENABLED === 'true';
 const N1MM_MAX_QSOS = parseInt(process.env.N1MM_MAX_QSOS || '200');
-const N1MM_QSO_MAX_AGE =
-  parseInt(process.env.N1MM_QSO_MAX_AGE_MINUTES || '360') * 60 * 1000;
+const N1MM_QSO_MAX_AGE = parseInt(process.env.N1MM_QSO_MAX_AGE_MINUTES || '360') * 60 * 1000;
 
 const contestQsoState = {
   qsos: [],
@@ -12328,9 +11500,7 @@ function resolveQsoLocation(dxCall, grid, comment) {
 
 function pruneContestQsos() {
   const now = Date.now();
-  contestQsoState.qsos = contestQsoState.qsos.filter(
-    (q) => now - q.timestamp <= N1MM_QSO_MAX_AGE,
-  );
+  contestQsoState.qsos = contestQsoState.qsos.filter((q) => now - q.timestamp <= N1MM_QSO_MAX_AGE);
   if (contestQsoState.qsos.length > N1MM_MAX_QSOS) {
     contestQsoState.qsos = contestQsoState.qsos.slice(-N1MM_MAX_QSOS);
   }
@@ -12375,7 +11545,8 @@ function parseContestContactInfo(xml) {
   if (!dxCall) return null;
 
   const source = detectContestSource(xml);
-  const myCall = normalizeCallsign(getXmlTag(xml, 'mycall')) ||
+  const myCall =
+    normalizeCallsign(getXmlTag(xml, 'mycall')) ||
     normalizeCallsign(getXmlTag(xml, 'stationprefix')) ||
     CONFIG.callsign;
 
@@ -12383,10 +11554,7 @@ function parseContestContactInfo(xml) {
   const bandMHz = bandStr ? parseFloat(bandStr) : null;
   const rxRaw = parseFloat(getXmlTag(xml, 'rxfreq'));
   const txRaw = parseFloat(getXmlTag(xml, 'txfreq'));
-  const freqMHz = n1mmFreqToMHz(
-    !Number.isNaN(rxRaw) ? rxRaw : !Number.isNaN(txRaw) ? txRaw : null,
-    bandMHz,
-  );
+  const freqMHz = n1mmFreqToMHz(!Number.isNaN(rxRaw) ? rxRaw : !Number.isNaN(txRaw) ? txRaw : null, bandMHz);
   const mode = (getXmlTag(xml, 'mode') || '').toUpperCase();
   const comment = getXmlTag(xml, 'comment') || '';
   const gridRaw = getXmlTag(xml, 'gridsquare');
@@ -12437,17 +11605,13 @@ function normalizeContestQso(input, source) {
   if (!input || typeof input !== 'object') return null;
   const dxCall = normalizeCallsign(input.dxCall || input.call);
   if (!dxCall) return null;
-  const myCall =
-    normalizeCallsign(input.myCall || input.mycall || input.deCall) ||
-    CONFIG.callsign;
+  const myCall = normalizeCallsign(input.myCall || input.mycall || input.deCall) || CONFIG.callsign;
   const bandMHz = parseFloat(input.bandMHz || input.band);
   const freqMHz = parseFloat(input.freqMHz || input.freq);
   const mode = (input.mode || '').toUpperCase();
   const grid = (input.grid || input.gridsquare || '').toUpperCase();
   const timestamp =
-    typeof input.timestamp === 'number'
-      ? input.timestamp
-      : parseN1MMTimestamp(input.timestamp) || Date.now();
+    typeof input.timestamp === 'number' ? input.timestamp : parseN1MMTimestamp(input.timestamp) || Date.now();
 
   let lat = parseFloat(input.lat);
   let lon = parseFloat(input.lon);
@@ -12519,16 +11683,12 @@ if (N1MM_ENABLED) {
 // API endpoint: get contest QSOs
 app.get('/api/contest/qsos', (req, res) => {
   const limitRaw = parseInt(req.query.limit);
-  const limit = Number.isFinite(limitRaw)
-    ? Math.min(Math.max(limitRaw, 1), 500)
-    : 200;
+  const limit = Number.isFinite(limitRaw) ? Math.min(Math.max(limitRaw, 1), 500) : 200;
   const since = parseInt(req.query.since) || 0;
 
   pruneContestQsos();
 
-  const filtered = since
-    ? contestQsoState.qsos.filter((q) => q.timestamp > since)
-    : contestQsoState.qsos;
+  const filtered = since ? contestQsoState.qsos.filter((q) => q.timestamp > since) : contestQsoState.qsos;
 
   res.json({
     qsos: filtered.slice(-limit),
@@ -12639,9 +11799,7 @@ app.listen(PORT, '0.0.0.0', () => {
     console.log(`  📥 Contest logger UDP listener (N1MM/DXLog) on port ${N1MM_UDP_PORT}`);
   }
   if (AUTO_UPDATE_ENABLED) {
-    console.log(
-      `  🔄 Auto-update enabled every ${AUTO_UPDATE_INTERVAL_MINUTES || 60} minutes`,
-    );
+    console.log(`  🔄 Auto-update enabled every ${AUTO_UPDATE_INTERVAL_MINUTES || 60} minutes`);
   }
   console.log('  🖥️  Open your browser to start using OpenHamClock');
   console.log('');
@@ -12670,19 +11828,10 @@ app.listen(PORT, '0.0.0.0', () => {
     .catch(() => {});
 
   // Check for outdated systemd service file that prevents auto-update restart
-  if (
-    AUTO_UPDATE_ENABLED &&
-    (process.env.INVOCATION_ID || process.ppid === 1)
-  ) {
+  if (AUTO_UPDATE_ENABLED && (process.env.INVOCATION_ID || process.ppid === 1)) {
     try {
-      const serviceFile = fs.readFileSync(
-        '/etc/systemd/system/openhamclock.service',
-        'utf8',
-      );
-      if (
-        serviceFile.includes('Restart=on-failure') &&
-        !serviceFile.includes('Restart=always')
-      ) {
+      const serviceFile = fs.readFileSync('/etc/systemd/system/openhamclock.service', 'utf8');
+      if (serviceFile.includes('Restart=on-failure') && !serviceFile.includes('Restart=always')) {
         console.log('  ⚠️  Your systemd service file uses Restart=on-failure');
         console.log('     Auto-updates may not restart properly.');
         console.log(
diff --git a/src/components/PluginLayer.jsx b/src/components/PluginLayer.jsx
index a6a719c1..895c64ed 100644
--- a/src/components/PluginLayer.jsx
+++ b/src/components/PluginLayer.jsx
@@ -17,9 +17,8 @@ export const PluginLayer = ({
   config,
   onDXChange,
   dxLocked,
-  dxLocation
+  dxLocation,
 }) => {
-  
   const layerFunc = plugin.useLayer || plugin.hook;
 
   if (typeof layerFunc === 'function') {
@@ -35,7 +34,7 @@ export const PluginLayer = ({
       config,
       onDXChange,
       dxLocked,
-      dxLocation
+      dxLocation,
     });
   }
 
diff --git a/src/components/WorldMap.jsx b/src/components/WorldMap.jsx
index 984d6be5..535206b8 100644
--- a/src/components/WorldMap.jsx
+++ b/src/components/WorldMap.jsx
@@ -2,9 +2,9 @@
  * WorldMap Component
  * Leaflet map with DE/DX markers, terminator, DX paths, POTA, satellites, PSKReporter
  */
-import { useRef, useEffect, useState, useMemo } from "react";
-import { useTranslation } from "react-i18next";
-import { MAP_STYLES } from "../utils/config.js";
+import { useRef, useEffect, useState, useMemo } from 'react';
+import { useTranslation } from 'react-i18next';
+import { MAP_STYLES } from '../utils/config.js';
 import {
   calculateGridSquare,
   getSunPosition,
@@ -12,8 +12,8 @@ import {
   getGreatCirclePoints,
   replicatePath,
   replicatePoint,
-} from "../utils/geo.js";
-import { getBandColor } from "../utils/callsign.js";
+} from '../utils/geo.js';
+import { getBandColor } from '../utils/callsign.js';
 import {
   BAND_LEGEND_ORDER,
   getBandColorForBand,
@@ -21,26 +21,26 @@ import {
   getEffectiveBandColors,
   loadBandColorOverrides,
   saveBandColorOverrides,
-} from "../utils/bandColors.js";
-import { createTerminator } from "../utils/terminator.js";
-import { getAllLayers } from "../plugins/layerRegistry.js";
-import useLocalInstall from "../hooks/app/useLocalInstall.js";
-import PluginLayer from "./PluginLayer.jsx";
-import AzimuthalMap from "./AzimuthalMap.jsx";
-import { DXNewsTicker } from "./DXNewsTicker.jsx";
-import { filterDXPaths } from "../utils";
+} from '../utils/bandColors.js';
+import { createTerminator } from '../utils/terminator.js';
+import { getAllLayers } from '../plugins/layerRegistry.js';
+import useLocalInstall from '../hooks/app/useLocalInstall.js';
+import PluginLayer from './PluginLayer.jsx';
+import AzimuthalMap from './AzimuthalMap.jsx';
+import { DXNewsTicker } from './DXNewsTicker.jsx';
+import { filterDXPaths } from '../utils';
 
 // SECURITY: Escape HTML to prevent XSS in Leaflet popups/tooltips
 // DX cluster data, POTA/SOTA spots, and WSJT-X decodes come from external sources
 // and could contain malicious HTML/script tags in callsigns, comments, or park names.
 function esc(str) {
-  if (str == null) return "";
+  if (str == null) return '';
   return String(str)
-    .replace(/&/g, "&amp;")
-    .replace(/</g, "&lt;")
-    .replace(/>/g, "&gt;")
-    .replace(/"/g, "&quot;")
-    .replace(/'/g, "&#39;");
+    .replace(/&/g, '&amp;')
+    .replace(/</g, '&lt;')
+    .replace(/>/g, '&gt;')
+    .replace(/"/g, '&quot;')
+    .replace(/'/g, '&#39;');
 }
 
 export const WorldMap = ({
@@ -69,11 +69,11 @@ export const WorldMap = ({
   showWSJTX,
   onSpotClick,
   hoveredSpot,
-  callsign = "N0CALL",
+  callsign = 'N0CALL',
   showDXNews = true,
   hideOverlays,
   lowMemoryMode = false,
-  units = "imperial",
+  units = 'imperial',
   mouseZoom,
   showRotatorBearing = false,
   rotatorAzimuth = null,
@@ -108,7 +108,7 @@ export const WorldMap = ({
 
   // Calculate grid locator from DE location for plugins
   const deLocator = useMemo(() => {
-    if (!deLocation?.lat || !deLocation?.lon) return "";
+    if (!deLocation?.lat || !deLocation?.lon) return '';
     return calculateGridSquare(deLocation.lat, deLocation.lon);
   }, [deLocation?.lat, deLocation?.lon]);
 
@@ -136,15 +136,8 @@ export const WorldMap = ({
       setBandColorOverrides(loadBandColorOverrides());
       setBandColorVersion((v) => v + 1);
     };
-    window.addEventListener(
-      "openhamclock-band-colors-change",
-      onBandColorsChange,
-    );
-    return () =>
-      window.removeEventListener(
-        "openhamclock-band-colors-change",
-        onBandColorsChange,
-      );
+    window.addEventListener('openhamclock-band-colors-change', onBandColorsChange);
+    return () => window.removeEventListener('openhamclock-band-colors-change', onBandColorsChange);
   }, []);
 
   // Plugin system refs and state
@@ -155,7 +148,7 @@ export const WorldMap = ({
 
   // Re-evaluate feature-gated integrations when toggles change in Settings
   useEffect(() => {
-    const bump = () => setIntegrationsRev(v => v + 1);
+    const bump = () => setIntegrationsRev((v) => v + 1);
     try {
       window.addEventListener('ohc-n3fjp-config-changed', bump);
       window.addEventListener('ohc-rotator-config-changed', bump);
@@ -167,47 +160,44 @@ export const WorldMap = ({
       } catch {}
     };
   }, []);
-  
+
   // Filter out localOnly layers on hosted version
   const getAvailableLayers = () => {
     // Reference integrationsRev so changes trigger a re-render pass.
     void integrationsRev;
     let n3fjpEnabled = false;
-    try { n3fjpEnabled = localStorage.getItem('ohc_n3fjp_enabled') === '1'; } catch {}
+    try {
+      n3fjpEnabled = localStorage.getItem('ohc_n3fjp_enabled') === '1';
+    } catch {}
 
-    return getAllLayers().filter(l => {
+    return getAllLayers().filter((l) => {
       if (l.localOnly && !isLocalInstall) return false;
       // N3FJP is local-only + feature-gated (so hosted never shows it and local users must opt-in)
       if (l.id === 'n3fjp_logged_qsos' && !n3fjpEnabled) return false;
       return true;
     });
   };
-  
+
   // Load map style from localStorage
   const getStoredMapSettings = () => {
     try {
-      const stored = localStorage.getItem("openhamclock_mapSettings");
+      const stored = localStorage.getItem('openhamclock_mapSettings');
       return stored ? JSON.parse(stored) : {};
     } catch (e) {
       return {};
     }
   };
   const storedSettings = getStoredMapSettings();
-  const [mapStyle, setMapStyle] = useState(storedSettings.mapStyle || "dark");
+  const [mapStyle, setMapStyle] = useState(storedSettings.mapStyle || 'dark');
   const [bandColorVersion, setBandColorVersion] = useState(0);
   const [editingBand, setEditingBand] = useState(null);
-  const [editingColor, setEditingColor] = useState("#ff6666");
-  const [bandColorOverrides, setBandColorOverrides] = useState(() =>
-    loadBandColorOverrides(),
-  );
+  const [editingColor, setEditingColor] = useState('#ff6666');
+  const [bandColorOverrides, setBandColorOverrides] = useState(() => loadBandColorOverrides());
   // Tracks whether window.L (Leaflet, loaded via <script> in index.html) is ready.
   // Leaflet is NOT bundled by Vite — it's a self-hosted vendor file. If it hasn't
   // loaded by the time this component mounts, we poll and flip this flag to retry.
-  const [leafletReady, setLeafletReady] = useState(() => typeof window.L !== "undefined");
-  const effectiveBandColors = useMemo(
-    () => getEffectiveBandColors(bandColorOverrides),
-    [bandColorOverrides],
-  );
+  const [leafletReady, setLeafletReady] = useState(() => typeof window.L !== 'undefined');
+  const effectiveBandColors = useMemo(() => getEffectiveBandColors(bandColorOverrides), [bandColorOverrides]);
 
   const getScaledZoomLevel = (inverseMultiplier) => {
     // Ensure the input stays within 1–100
@@ -226,7 +216,7 @@ export const WorldMap = ({
   // Night overlay darkness (0-100 → fillOpacity 0.0-1.0)
   const [nightDarkness, setNightDarkness] = useState(() => {
     try {
-      return parseInt(localStorage.getItem("ohc_nightDarkness")) || 60;
+      return parseInt(localStorage.getItem('ohc_nightDarkness')) || 60;
     } catch {
       return 60;
     }
@@ -234,7 +224,7 @@ export const WorldMap = ({
 
   const getGibsUrl = (days) => {
     const date = new Date(Date.now() - (days * 24 + 12) * 60 * 60 * 1000);
-    const dateStr = date.toISOString().split("T")[0];
+    const dateStr = date.toISOString().split('T')[0];
     return `https://gibs.earthdata.nasa.gov/wmts/epsg3857/best/MODIS_Terra_CorrectedReflectance_TrueColor/default/${dateStr}/GoogleMapsCompatible_Level9/{z}/{y}/{x}.jpg`;
   };
   // End GIBS MODIS CODE
@@ -247,7 +237,7 @@ export const WorldMap = ({
   // Map lock — prevents accidental panning/zooming (useful on touch devices)
   const [mapLocked, setMapLocked] = useState(() => {
     try {
-      return localStorage.getItem("openhamclock_mapLocked") === "true";
+      return localStorage.getItem('openhamclock_mapLocked') === 'true';
     } catch {
       return false;
     }
@@ -298,8 +288,7 @@ export const WorldMap = ({
     const Δλ = toRad(lon2 - lon1);
 
     const y = Math.sin(Δλ) * Math.cos(φ2);
-    const x =
-      Math.cos(φ1) * Math.sin(φ2) - Math.sin(φ1) * Math.cos(φ2) * Math.cos(Δλ);
+    const x = Math.cos(φ1) * Math.sin(φ2) - Math.sin(φ1) * Math.cos(φ2) * Math.cos(Δλ);
 
     const θ = Math.atan2(y, x);
     return (toDeg(θ) + 360) % 360;
@@ -322,7 +311,7 @@ export const WorldMap = ({
     try {
       const existing = getStoredMapSettings();
       localStorage.setItem(
-        "openhamclock_mapSettings",
+        'openhamclock_mapSettings',
         JSON.stringify({
           ...existing,
           mapStyle,
@@ -332,7 +321,7 @@ export const WorldMap = ({
         }),
       );
     } catch (e) {
-      console.error("Failed to save map settings:", e);
+      console.error('Failed to save map settings:', e);
     }
   }, [mapStyle, mapView, mouseZoom]);
 
@@ -344,20 +333,20 @@ export const WorldMap = ({
     // Leaflet is loaded via a <script> tag in index.html (self-hosted vendor file).
     // On slow connections or if the file 404s, window.L may not be ready yet.
     // Poll for up to 5 seconds before giving up with an actionable error.
-    if (typeof window.L === "undefined") {
+    if (typeof window.L === 'undefined') {
       let attempts = 0;
       const maxAttempts = 50; // 50 × 100ms = 5 seconds
       const poll = setInterval(() => {
         attempts++;
-        if (typeof window.L !== "undefined") {
+        if (typeof window.L !== 'undefined') {
           clearInterval(poll);
           setLeafletReady(true); // triggers a re-render → re-runs this effect with L defined
         } else if (attempts >= maxAttempts) {
           clearInterval(poll);
           console.error(
-            "Leaflet failed to load after 5s. " +
-            "Check that /vendor/leaflet/leaflet.js is accessible. " +
-            "Run: bash scripts/vendor-download.sh"
+            'Leaflet failed to load after 5s. ' +
+              'Check that /vendor/leaflet/leaflet.js is accessible. ' +
+              'Run: bash scripts/vendor-download.sh',
           );
         }
       }, 100);
@@ -384,27 +373,27 @@ export const WorldMap = ({
     });
 
     // --- night pane ---
-    map.createPane("nightPane");
-    const nightPane = map.getPane("nightPane");
+    map.createPane('nightPane');
+    const nightPane = map.getPane('nightPane');
     nightPane.style.zIndex = 650;
-    nightPane.style.pointerEvents = "none";
-    nightPane.id = "night-lights-pane";
+    nightPane.style.pointerEvents = 'none';
+    nightPane.id = 'night-lights-pane';
 
     // Initial tile layer (Base Day Map)
     tileLayerRef.current = L.tileLayer(MAP_STYLES[mapStyle].url, {
       attribution: MAP_STYLES[mapStyle].attribution,
       noWrap: false,
-      crossOrigin: "anonymous",
+      crossOrigin: 'anonymous',
     }).addTo(map);
 
     // Day/night terminator
     terminatorRef.current = createTerminator({
       resolution: 2,
       fillOpacity: nightDarkness / 100,
-      fillColor: "#000010",
-      color: "#ffaa00",
+      fillColor: '#000010',
+      color: '#ffaa00',
       weight: 2,
-      dashArray: "5, 5",
+      dashArray: '5, 5',
       wrap: false,
     }).addTo(map);
 
@@ -414,7 +403,7 @@ export const WorldMap = ({
         terminatorRef.current.setTime();
         const path = terminatorRef.current.getElement();
         if (path) {
-          path.classList.add("terminator-path");
+          path.classList.add('terminator-path');
         }
       }
     }, 100);
@@ -424,12 +413,12 @@ export const WorldMap = ({
         terminatorRef.current.setTime();
         const path = terminatorRef.current.getElement();
         if (path) {
-          path.classList.add("terminator-path");
+          path.classList.add('terminator-path');
         }
       }
     }, 60000);
 
-    map.on("moveend", () => {
+    map.on('moveend', () => {
       const center = map.getCenter();
       const zoom = map.getZoom();
       setMapView({ center: [center.lat, center.lng], zoom });
@@ -438,24 +427,17 @@ export const WorldMap = ({
     // Click handler:
     // - Shift+click => turn rotator toward clicked point (if enabled)
     // - Normal click => set DX (only if not locked)
-    map.on("click", (e) => {
+    map.on('click', (e) => {
       // Normalize longitude to -180..180
       let lon = e.latlng.lng;
       while (lon > 180) lon -= 360;
       while (lon < -180) lon += 360;
 
       const oe = e?.originalEvent;
-      const isShift =
-        !!oe?.shiftKey ||
-        (typeof oe?.getModifierState === "function" &&
-          oe.getModifierState("Shift"));
+      const isShift = !!oe?.shiftKey || (typeof oe?.getModifierState === 'function' && oe.getModifierState('Shift'));
 
       // SHIFT+click => turn rotator (do NOT move DX)
-      if (
-        isShift &&
-        rotatorEnabledRef.current &&
-        typeof rotatorTurnRef.current === "function"
-      ) {
+      if (isShift && rotatorEnabledRef.current && typeof rotatorTurnRef.current === 'function') {
         const de = deRef.current;
         if (de?.lat != null && de?.lon != null) {
           const az = initialBearingDeg(de.lat, de.lon, e.latlng.lat, lon);
@@ -475,18 +457,13 @@ export const WorldMap = ({
 
     // Apply initial map lock state if saved
     if (mapLocked) {
-      [
-        map.dragging,
-        map.touchZoom,
-        map.doubleClickZoom,
-        map.scrollWheelZoom,
-        map.boxZoom,
-        map.keyboard,
-      ].forEach((h) => {
-        if (h) h.disable();
-      });
+      [map.dragging, map.touchZoom, map.doubleClickZoom, map.scrollWheelZoom, map.boxZoom, map.keyboard].forEach(
+        (h) => {
+          if (h) h.disable();
+        },
+      );
       const zc = map.zoomControl?.getContainer();
-      if (zc) zc.style.display = "none";
+      if (zc) zc.style.display = 'none';
     }
 
     const resizeObserver = new ResizeObserver(() => {
@@ -507,8 +484,7 @@ export const WorldMap = ({
   // Update the value for how many scroll pixels count as a zoom level
   useEffect(() => {
     if (!mapInstanceRef.current) return;
-    mapInstanceRef.current.options.wheelPxPerZoomLevel =
-      getScaledZoomLevel(mouseZoom);
+    mapInstanceRef.current.options.wheelPxPerZoomLevel = getScaledZoomLevel(mouseZoom);
   }, [mouseZoom]);
 
   // Apply map lock — disable all navigation interactions while keeping click-through
@@ -516,14 +492,7 @@ export const WorldMap = ({
     const map = mapInstanceRef.current;
     if (!map) return;
 
-    const handlers = [
-      map.dragging,
-      map.touchZoom,
-      map.doubleClickZoom,
-      map.scrollWheelZoom,
-      map.boxZoom,
-      map.keyboard,
-    ];
+    const handlers = [map.dragging, map.touchZoom, map.doubleClickZoom, map.scrollWheelZoom, map.boxZoom, map.keyboard];
 
     handlers.forEach((h) => {
       if (h) mapLocked ? h.disable() : h.enable();
@@ -533,15 +502,12 @@ export const WorldMap = ({
     const zoomControl = map.zoomControl;
     if (zoomControl) {
       const el = zoomControl.getContainer();
-      if (el) el.style.display = mapLocked ? "none" : "";
+      if (el) el.style.display = mapLocked ? 'none' : '';
     }
 
     // Persist to localStorage
     try {
-      localStorage.setItem(
-        "openhamclock_mapLocked",
-        mapLocked ? "true" : "false",
-      );
+      localStorage.setItem('openhamclock_mapLocked', mapLocked ? 'true' : 'false');
     } catch {}
   }, [mapLocked]);
 
@@ -556,7 +522,7 @@ export const WorldMap = ({
 
     // Determine the URL: Use the dynamic GIBS generator if 'MODIS' is selected
     let url = MAP_STYLES[mapStyle].url;
-    if (mapStyle === "MODIS") {
+    if (mapStyle === 'MODIS') {
       url = getGibsUrl(gibsOffset);
     }
 
@@ -564,9 +530,9 @@ export const WorldMap = ({
     tileLayerRef.current = L.tileLayer(url, {
       attribution: MAP_STYLES[mapStyle].attribution,
       noWrap: false,
-      crossOrigin: "anonymous",
+      crossOrigin: 'anonymous',
       // NASA GIBS tiles only cover -180..180; other tile providers wrap naturally
-      ...(mapStyle === "MODIS"
+      ...(mapStyle === 'MODIS'
         ? {
             bounds: [
               [-85, -180],
@@ -580,12 +546,12 @@ export const WorldMap = ({
     if (terminatorRef.current) {
       terminatorRef.current.setStyle({
         fillOpacity: nightDarkness / 100,
-        fillColor: "#000008",
-        color: "transparent",
+        fillColor: '#000008',
+        color: 'transparent',
         weight: 2,
       });
 
-      if (typeof terminatorRef.current.bringToFront === "function") {
+      if (typeof terminatorRef.current.bringToFront === 'function') {
         terminatorRef.current.bringToFront();
       }
     }
@@ -601,11 +567,11 @@ export const WorldMap = ({
 
     // 4. Handle Clipping Mask
     const updateMask = () => {
-      const nightPane = document.getElementById("night-lights-pane");
-      const terminatorPath = document.querySelector(".terminator-path");
+      const nightPane = document.getElementById('night-lights-pane');
+      const terminatorPath = document.querySelector('.terminator-path');
 
       if (nightPane && terminatorPath) {
-        const pathData = terminatorPath.getAttribute("d");
+        const pathData = terminatorPath.getAttribute('d');
         if (pathData) {
           nightPane.style.clipPath = `path('${pathData}')`;
           nightPane.style.webkitClipPath = `path('${pathData}')`;
@@ -625,7 +591,7 @@ export const WorldMap = ({
       terminatorRef.current.setStyle({ fillOpacity: nightDarkness / 100 });
     }
     try {
-      localStorage.setItem("ohc_nightDarkness", String(nightDarkness));
+      localStorage.setItem('ohc_nightDarkness', String(nightDarkness));
     } catch {}
   }, [nightDarkness]);
 
@@ -649,31 +615,31 @@ export const WorldMap = ({
 
     // Bright distinct colors for countries (designed for maximum contrast between neighbors)
     const COLORS = [
-      "#e6194b",
-      "#3cb44b",
-      "#4363d8",
-      "#f58231",
-      "#911eb4",
-      "#42d4f4",
-      "#f032e6",
-      "#bfef45",
-      "#fabed4",
-      "#469990",
-      "#dcbeff",
-      "#9A6324",
-      "#800000",
-      "#aaffc3",
-      "#808000",
-      "#000075",
-      "#e6beff",
-      "#ff6961",
-      "#77dd77",
-      "#fdfd96",
-      "#84b6f4",
-      "#fdcae1",
-      "#c1e1c1",
-      "#b39eb5",
-      "#ffb347",
+      '#e6194b',
+      '#3cb44b',
+      '#4363d8',
+      '#f58231',
+      '#911eb4',
+      '#42d4f4',
+      '#f032e6',
+      '#bfef45',
+      '#fabed4',
+      '#469990',
+      '#dcbeff',
+      '#9A6324',
+      '#800000',
+      '#aaffc3',
+      '#808000',
+      '#000075',
+      '#e6beff',
+      '#ff6961',
+      '#77dd77',
+      '#fdfd96',
+      '#84b6f4',
+      '#fdcae1',
+      '#c1e1c1',
+      '#b39eb5',
+      '#ffb347',
     ];
 
     // Simple string hash for consistent color assignment
@@ -688,7 +654,7 @@ export const WorldMap = ({
 
     // Deep-shift all coordinates in a GeoJSON geometry by a longitude offset
     const shiftCoords = (coords, offset) => {
-      if (typeof coords[0] === "number") {
+      if (typeof coords[0] === 'number') {
         // [lon, lat] point
         return [coords[0] + offset, coords[1]];
       }
@@ -710,9 +676,7 @@ export const WorldMap = ({
     };
 
     // Fetch world countries GeoJSON (Natural Earth 110m simplified, ~240KB)
-    fetch(
-      "https://cdn.jsdelivr.net/gh/johan/world.geo.json@master/countries.geo.json",
-    )
+    fetch('https://cdn.jsdelivr.net/gh/johan/world.geo.json@master/countries.geo.json')
       .then((res) => {
         if (!res.ok) throw new Error(`HTTP ${res.status}`);
         return res.json();
@@ -721,11 +685,11 @@ export const WorldMap = ({
         if (!mapInstanceRef.current) return;
 
         const styleFunc = (feature) => {
-          const name = feature.properties?.name || feature.id || "Unknown";
+          const name = feature.properties?.name || feature.id || 'Unknown';
           return {
             fillColor: hashColor(name),
             fillOpacity: 0.65,
-            color: "#fff",
+            color: '#fff',
             weight: 1,
             opacity: 0.8,
           };
@@ -740,11 +704,11 @@ export const WorldMap = ({
             onEachFeature:
               offset === 0
                 ? (feature, layer) => {
-                    const name = feature.properties?.name || "Unknown";
+                    const name = feature.properties?.name || 'Unknown';
                     layer.bindTooltip(name, {
                       sticky: true,
-                      className: "country-tooltip",
-                      direction: "top",
+                      className: 'country-tooltip',
+                      direction: 'top',
                       offset: [0, -5],
                     });
                   }
@@ -762,7 +726,7 @@ export const WorldMap = ({
         if (terminatorRef.current) terminatorRef.current.bringToFront();
       })
       .catch((err) => {
-        console.warn("Could not load countries GeoJSON:", err);
+        console.warn('Could not load countries GeoJSON:', err);
       });
 
     return () => {
@@ -793,8 +757,8 @@ export const WorldMap = ({
     // DE Marker — replicate across world copies
     replicatePoint(deLocation.lat, deLocation.lon).forEach(([lat, lon]) => {
       const deIcon = L.divIcon({
-        className: "custom-marker de-marker",
-        html: "DE",
+        className: 'custom-marker de-marker',
+        html: 'DE',
         iconSize: [32, 32],
         iconAnchor: [16, 16],
       });
@@ -809,8 +773,8 @@ export const WorldMap = ({
     // DX Marker — replicate across world copies
     replicatePoint(dxLocation.lat, dxLocation.lon).forEach(([lat, lon]) => {
       const dxIcon = L.divIcon({
-        className: "custom-marker dx-marker",
-        html: "DX",
+        className: 'custom-marker dx-marker',
+        html: 'DX',
         iconSize: [32, 32],
         iconAnchor: [16, 16],
       });
@@ -837,33 +801,29 @@ export const WorldMap = ({
       // Sun marker
       const sunPos = getSunPosition(now);
       const sunIcon = L.divIcon({
-        className: "custom-marker sun-marker",
-        html: "☼",
+        className: 'custom-marker sun-marker',
+        html: '☼',
         iconSize: [24, 24],
         iconAnchor: [12, 12],
       });
       sunMarkerRef.current = L.marker([sunPos.lat, sunPos.lon], {
         icon: sunIcon,
       })
-        .bindPopup(
-          `<b>☼ Subsolar Point</b><br>${sunPos.lat.toFixed(2)}°, ${sunPos.lon.toFixed(2)}°`,
-        )
+        .bindPopup(`<b>☼ Subsolar Point</b><br>${sunPos.lat.toFixed(2)}°, ${sunPos.lon.toFixed(2)}°`)
         .addTo(map);
 
       // Moon marker
       const moonPos = getMoonPosition(now);
       const moonIcon = L.divIcon({
-        className: "custom-marker moon-marker",
-        html: "☽",
+        className: 'custom-marker moon-marker',
+        html: '☽',
         iconSize: [24, 24],
         iconAnchor: [12, 12],
       });
       moonMarkerRef.current = L.marker([moonPos.lat, moonPos.lon], {
         icon: moonIcon,
       })
-        .bindPopup(
-          `<b>☽ Sublunar Point</b><br>${moonPos.lat.toFixed(2)}°, ${moonPos.lon.toFixed(2)}°`,
-        )
+        .bindPopup(`<b>☽ Sublunar Point</b><br>${moonPos.lat.toFixed(2)}°, ${moonPos.lon.toFixed(2)}°`)
         .addTo(map);
     };
 
@@ -896,46 +856,22 @@ export const WorldMap = ({
 
       filteredPaths.forEach((path) => {
         try {
-          if (
-            !path.spotterLat ||
-            !path.spotterLon ||
-            !path.dxLat ||
-            !path.dxLon
-          )
-            return;
-          if (
-            isNaN(path.spotterLat) ||
-            isNaN(path.spotterLon) ||
-            isNaN(path.dxLat) ||
-            isNaN(path.dxLon)
-          )
-            return;
-
-          const pathPoints = getGreatCirclePoints(
-            path.spotterLat,
-            path.spotterLon,
-            path.dxLat,
-            path.dxLon,
-          );
+          if (!path.spotterLat || !path.spotterLon || !path.dxLat || !path.dxLon) return;
+          if (isNaN(path.spotterLat) || isNaN(path.spotterLon) || isNaN(path.dxLat) || isNaN(path.dxLon)) return;
+
+          const pathPoints = getGreatCirclePoints(path.spotterLat, path.spotterLon, path.dxLat, path.dxLon);
 
-          if (
-            !pathPoints ||
-            !Array.isArray(pathPoints) ||
-            pathPoints.length === 0
-          )
-            return;
+          if (!pathPoints || !Array.isArray(pathPoints) || pathPoints.length === 0) return;
 
           const freq = parseFloat(path.freq);
           const color = getBandColor(freq);
 
-          const isHovered =
-            hoveredSpot &&
-            hoveredSpot.call?.toUpperCase() === path.dxCall?.toUpperCase();
+          const isHovered = hoveredSpot && hoveredSpot.call?.toUpperCase() === path.dxCall?.toUpperCase();
 
           // Render polyline on all 3 world copies so it's visible across the dateline
           replicatePath(pathPoints).forEach((copy) => {
             const line = L.polyline(copy, {
-              color: isHovered ? "#ffffff" : color,
+              color: isHovered ? '#ffffff' : color,
               weight: isHovered ? 4 : 1.5,
               opacity: isHovered ? 1 : 0.5,
             }).addTo(map);
@@ -947,8 +883,8 @@ export const WorldMap = ({
           replicatePoint(path.dxLat, path.dxLon).forEach(([lat, lon]) => {
             const dxCircle = L.circleMarker([lat, lon], {
               radius: isHovered ? 12 : 6,
-              fillColor: isHovered ? "#ffffff" : color,
-              color: isHovered ? color : "#fff",
+              fillColor: isHovered ? '#ffffff' : color,
+              color: isHovered ? color : '#fff',
               weight: isHovered ? 3 : 1.5,
               opacity: 1,
               fillOpacity: isHovered ? 1 : 0.9,
@@ -960,7 +896,7 @@ export const WorldMap = ({
               .addTo(map);
 
             if (onSpotClick) {
-              dxCircle.on("click", () => onSpotClick(path));
+              dxCircle.on('click', () => onSpotClick(path));
             }
 
             if (isHovered) dxCircle.bringToFront();
@@ -970,8 +906,8 @@ export const WorldMap = ({
           // Add label if enabled — replicate across world copies
           if (showDXLabels || isHovered) {
             const labelIcon = L.divIcon({
-              className: "",
-              html: `<span style="display:inline-block;background:${isHovered ? "#fff" : color};color:${isHovered ? color : "#000"};padding:${isHovered ? "3px 6px" : "2px 5px"};border-radius:3px;font-family:'JetBrains Mono',monospace;font-size:${isHovered ? "12px" : "11px"};font-weight:700;white-space:nowrap;border:1px solid ${isHovered ? color : "rgba(0,0,0,0.5)"};box-shadow:0 1px ${isHovered ? "4px" : "2px"} rgba(0,0,0,${isHovered ? "0.5" : "0.3"});line-height:1.1;">${path.dxCall}</span>`,
+              className: '',
+              html: `<span style="display:inline-block;background:${isHovered ? '#fff' : color};color:${isHovered ? color : '#000'};padding:${isHovered ? '3px 6px' : '2px 5px'};border-radius:3px;font-family:'JetBrains Mono',monospace;font-size:${isHovered ? '12px' : '11px'};font-weight:700;white-space:nowrap;border:1px solid ${isHovered ? color : 'rgba(0,0,0,0.5)'};box-shadow:0 1px ${isHovered ? '4px' : '2px'} rgba(0,0,0,${isHovered ? '0.5' : '0.3'});line-height:1.1;">${path.dxCall}</span>`,
               iconSize: null,
               iconAnchor: [0, 0],
             });
@@ -983,29 +919,22 @@ export const WorldMap = ({
               }).addTo(map);
 
               if (onSpotClick) {
-                label.on("click", () => onSpotClick(path));
+                label.on('click', () => onSpotClick(path));
               }
 
               dxPathsMarkersRef.current.push(label);
             });
           }
         } catch (err) {
-          console.error("Error rendering DX path:", err);
+          console.error('Error rendering DX path:', err);
         }
       });
     }
-  }, [
-    dxPaths,
-    dxFilters,
-    showDXPaths,
-    showDXLabels,
-    hoveredSpot,
-    bandColorVersion,
-  ]);
+  }, [dxPaths, dxFilters, showDXPaths, showDXLabels, hoveredSpot, bandColorVersion]);
 
   useEffect(() => {
     const map = mapInstanceRef.current;
-    if (!map || typeof L === "undefined") return;
+    if (!map || typeof L === 'undefined') return;
 
     const lat = deLocation?.lat;
     const lon = deLocation?.lon;
@@ -1014,12 +943,7 @@ export const WorldMap = ({
     const az = Number.isFinite(aRaw) ? ((aRaw % 360) + 360) % 360 : null;
 
     // If disabled or no DE/azimuth, remove layer if it exists
-    if (
-      !showRotatorBearing ||
-      !Number.isFinite(lat) ||
-      !Number.isFinite(lon) ||
-      az == null
-    ) {
+    if (!showRotatorBearing || !Number.isFinite(lat) || !Number.isFinite(lon) || az == null) {
       if (rotatorLineRef.current) {
         map.removeLayer(rotatorLineRef.current);
         rotatorLineRef.current = null;
@@ -1037,11 +961,11 @@ export const WorldMap = ({
     // Create if missing
     if (!rotatorGlowRef.current) {
       rotatorGlowRef.current = L.polyline(points, {
-        color: "rgba(0,255,255,0.20)",
+        color: 'rgba(0,255,255,0.20)',
         weight: 8,
         opacity: 1,
-        dashArray: "10 10",
-        className: "ohc-rotator-bearing-glow",
+        dashArray: '10 10',
+        className: 'ohc-rotator-bearing-glow',
         interactive: false,
       }).addTo(map);
     } else {
@@ -1050,25 +974,18 @@ export const WorldMap = ({
 
     if (!rotatorLineRef.current) {
       rotatorLineRef.current = L.polyline(points, {
-        color: "rgba(0,255,255,0.78)",
+        color: 'rgba(0,255,255,0.78)',
         weight: 2.4,
         opacity: rotatorIsStale ? 0.55 : 1,
-        dashArray: "10 10",
-        className: "ohc-rotator-bearing",
+        dashArray: '10 10',
+        className: 'ohc-rotator-bearing',
         interactive: false,
       }).addTo(map);
     } else {
       rotatorLineRef.current.setLatLngs(points);
       rotatorLineRef.current.setStyle({ opacity: rotatorIsStale ? 0.55 : 1 });
     }
-  }, [
-    showRotatorBearing,
-    deLocation?.lat,
-    deLocation?.lon,
-    rotatorAzimuth,
-    rotatorLastGoodAzimuth,
-    rotatorIsStale,
-  ]);
+  }, [showRotatorBearing, deLocation?.lat, deLocation?.lon, rotatorAzimuth, rotatorLastGoodAzimuth, rotatorIsStale]);
 
   const unwrapLonPath = (latlngs) => {
     if (!Array.isArray(latlngs) || latlngs.length < 2) return latlngs;
@@ -1105,19 +1022,19 @@ export const WorldMap = ({
           // Green triangle marker for POTA activators — replicate across world copies
           replicatePoint(spot.lat, spot.lon).forEach(([lat, lon]) => {
             const triangleIcon = L.divIcon({
-              className: "",
+              className: '',
               html: `<span style="display:inline-block;width:0;height:0;border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:14px solid #44cc44;filter:drop-shadow(0 1px 2px rgba(0,0,0,0.6));"></span>`,
               iconSize: [14, 14],
               iconAnchor: [7, 14],
             });
             const marker = L.marker([lat, lon], { icon: triangleIcon })
               .bindPopup(
-                `<b data-qrz-call="${esc(spot.call)}" style="color:#44cc44; cursor:pointer">${esc(spot.call)}</b><br><span style="color:#888">${esc(spot.ref)}</span> ${esc(spot.locationDesc || "")}<br>${spot.name ? `<i>${esc(spot.name)}</i><br>` : ""}${esc(spot.freq)} ${esc(spot.mode || "")} <span style="color:#888">${esc(spot.time || "")}</span>`,
+                `<b data-qrz-call="${esc(spot.call)}" style="color:#44cc44; cursor:pointer">${esc(spot.call)}</b><br><span style="color:#888">${esc(spot.ref)}</span> ${esc(spot.locationDesc || '')}<br>${spot.name ? `<i>${esc(spot.name)}</i><br>` : ''}${esc(spot.freq)} ${esc(spot.mode || '')} <span style="color:#888">${esc(spot.time || '')}</span>`,
               )
               .addTo(map);
 
             if (onSpotClick) {
-              marker.on("click", () => onSpotClick(spot));
+              marker.on('click', () => onSpotClick(spot));
             }
 
             potaMarkersRef.current.push(marker);
@@ -1126,7 +1043,7 @@ export const WorldMap = ({
           // Only show callsign label when labels are enabled — replicate
           if (showPOTALabels) {
             const labelIcon = L.divIcon({
-              className: "",
+              className: '',
               html: `<span style="display:inline-block;background:#44cc44;color:#000;padding:2px 5px;border-radius:3px;font-size:11px;font-family:'JetBrains Mono',monospace;font-weight:700;white-space:nowrap;border:1px solid rgba(0,0,0,0.5);box-shadow:0 1px 2px rgba(0,0,0,0.3);line-height:1.1;">${spot.call}</span>`,
               iconSize: null,
               iconAnchor: [0, -2],
@@ -1158,19 +1075,19 @@ export const WorldMap = ({
           // Light green inverted triangle for WWFF activators — replicate across world copies
           replicatePoint(spot.lat, spot.lon).forEach(([lat, lon]) => {
             const triangleIcon = L.divIcon({
-              className: "",
+              className: '',
               html: `<span style="display:inline-block;width:0;height:0;border-left:7px solid transparent;border-right:7px solid transparent;border-top:14px solid #a3f3a3;filter:drop-shadow(0 1px 2px rgba(0,0,0,0.6));"></span>`,
               iconSize: [14, 14],
               iconAnchor: [7, 0],
             });
             const marker = L.marker([lat, lon], { icon: triangleIcon })
               .bindPopup(
-                `<b data-qrz-call="${esc(spot.call)}" style="color:#a3f3a3; cursor:pointer">${esc(spot.call)}</b><br><span style="color:#888">${esc(spot.ref)}</span> ${esc(spot.locationDesc || "")}<br>${spot.name ? `<i>${esc(spot.name)}</i><br>` : ""}${esc(spot.freq)} ${esc(spot.mode || "")} <span style="color:#888">${esc(spot.time || "")}</span>`,
+                `<b data-qrz-call="${esc(spot.call)}" style="color:#a3f3a3; cursor:pointer">${esc(spot.call)}</b><br><span style="color:#888">${esc(spot.ref)}</span> ${esc(spot.locationDesc || '')}<br>${spot.name ? `<i>${esc(spot.name)}</i><br>` : ''}${esc(spot.freq)} ${esc(spot.mode || '')} <span style="color:#888">${esc(spot.time || '')}</span>`,
               )
               .addTo(map);
 
             if (onSpotClick) {
-              marker.on("click", () => onSpotClick(spot));
+              marker.on('click', () => onSpotClick(spot));
             }
 
             wwffMarkersRef.current.push(marker);
@@ -1179,7 +1096,7 @@ export const WorldMap = ({
           // Only show callsign label when labels are enabled — replicate
           if (showWWFFLabels) {
             const labelIcon = L.divIcon({
-              className: "",
+              className: '',
               html: `<span style="display:inline-block;background:#a3f3a3;color:#000;padding:2px 5px;border-radius:3px;font-size:11px;font-family:'JetBrains Mono',monospace;font-weight:700;white-space:nowrap;border:1px solid rgba(0,0,0,0.5);box-shadow:0 1px 2px rgba(0,0,0,0.3);line-height:1.1;">${esc(spot.call)}</span>`,
               iconSize: null,
               iconAnchor: [0, -2],
@@ -1211,19 +1128,19 @@ export const WorldMap = ({
           // Orange diamond marker for SOTA activators — replicate across world copies
           replicatePoint(spot.lat, spot.lon).forEach(([lat, lon]) => {
             const diamondIcon = L.divIcon({
-              className: "",
+              className: '',
               html: `<span style="display:inline-block;width:12px;height:12px;background:#ff9632;transform:rotate(45deg);border:1px solid rgba(0,0,0,0.4);filter:drop-shadow(0 1px 2px rgba(0,0,0,0.6));"></span>`,
               iconSize: [12, 12],
               iconAnchor: [6, 6],
             });
             const marker = L.marker([lat, lon], { icon: diamondIcon })
               .bindPopup(
-                `<b data-qrz-call="${esc(spot.call)}" style="color:#ff9632; cursor:pointer">${esc(spot.call)}</b><br><span style="color:#888">${esc(spot.ref)}</span>${spot.summit ? ` — ${esc(spot.summit)}` : ""}${spot.points ? ` <span style="color:#ff9632">(${esc(spot.points)}pt)</span>` : ""}<br>${esc(spot.freq)} ${esc(spot.mode || "")} <span style="color:#888">${esc(spot.time || "")}</span>`,
+                `<b data-qrz-call="${esc(spot.call)}" style="color:#ff9632; cursor:pointer">${esc(spot.call)}</b><br><span style="color:#888">${esc(spot.ref)}</span>${spot.summit ? ` — ${esc(spot.summit)}` : ''}${spot.points ? ` <span style="color:#ff9632">(${esc(spot.points)}pt)</span>` : ''}<br>${esc(spot.freq)} ${esc(spot.mode || '')} <span style="color:#888">${esc(spot.time || '')}</span>`,
               )
               .addTo(map);
 
             if (onSpotClick) {
-              marker.on("click", () => onSpotClick(spot));
+              marker.on('click', () => onSpotClick(spot));
             }
 
             sotaMarkersRef.current.push(marker);
@@ -1232,7 +1149,7 @@ export const WorldMap = ({
           // Only show callsign label when labels are enabled — replicate
           if (showSOTALabels) {
             const labelIcon = L.divIcon({
-              className: "",
+              className: '',
               html: `<span style="display:inline-block;background:#ff9632;color:#000;padding:2px 5px;border-radius:3px;font-size:11px;font-family:'JetBrains Mono',monospace;font-weight:700;white-space:nowrap;border:1px solid rgba(0,0,0,0.5);box-shadow:0 1px 2px rgba(0,0,0,0.3);line-height:1.1;">${spot.call}</span>`,
               iconSize: null,
               iconAnchor: [0, -2],
@@ -1275,7 +1192,7 @@ export const WorldMap = ({
 
       // Initialize state ONLY on first mount (when empty)
       if (Object.keys(pluginLayerStates).length === 0) {
-        console.log("Loading saved layer states:", initialStates);
+        console.log('Loading saved layer states:', initialStates);
         setPluginLayerStates(initialStates);
       }
 
@@ -1283,28 +1200,16 @@ export const WorldMap = ({
       window.hamclockLayerControls = {
         layers: availableLayers.map((l) => ({
           ...l,
-          enabled:
-            pluginLayerStates[l.id]?.enabled ??
-            initialStates[l.id]?.enabled ??
-            l.defaultEnabled,
-          opacity:
-            pluginLayerStates[l.id]?.opacity ??
-            initialStates[l.id]?.opacity ??
-            l.defaultOpacity,
-          config:
-            pluginLayerStates[l.id]?.config ??
-            initialStates[l.id]?.config ??
-            l.config,
+          enabled: pluginLayerStates[l.id]?.enabled ?? initialStates[l.id]?.enabled ?? l.defaultEnabled,
+          opacity: pluginLayerStates[l.id]?.opacity ?? initialStates[l.id]?.opacity ?? l.defaultOpacity,
+          config: pluginLayerStates[l.id]?.config ?? initialStates[l.id]?.config ?? l.config,
         })),
 
         toggleLayer: (id, enabled) => {
           const settings = getStoredMapSettings();
           const layers = settings.layers || {};
           layers[id] = { ...(layers[id] || {}), enabled };
-          localStorage.setItem(
-            "openhamclock_mapSettings",
-            JSON.stringify({ ...settings, layers }),
-          );
+          localStorage.setItem('openhamclock_mapSettings', JSON.stringify({ ...settings, layers }));
           setPluginLayerStates((prev) => ({
             ...prev,
             [id]: { ...prev[id], enabled },
@@ -1315,10 +1220,7 @@ export const WorldMap = ({
           const settings = getStoredMapSettings();
           const layers = settings.layers || {};
           layers[id] = { ...(layers[id] || {}), opacity };
-          localStorage.setItem(
-            "openhamclock_mapSettings",
-            JSON.stringify({ ...settings, layers }),
-          );
+          localStorage.setItem('openhamclock_mapSettings', JSON.stringify({ ...settings, layers }));
           setPluginLayerStates((prev) => ({
             ...prev,
             [id]: { ...prev[id], opacity },
@@ -1335,10 +1237,7 @@ export const WorldMap = ({
             config: { ...(currentLayer.config || {}), ...configDelta },
           };
 
-          localStorage.setItem(
-            "openhamclock_mapSettings",
-            JSON.stringify({ ...settings, layers }),
-          );
+          localStorage.setItem('openhamclock_mapSettings', JSON.stringify({ ...settings, layers }));
 
           setPluginLayerStates((prev) => ({
             ...prev,
@@ -1350,7 +1249,7 @@ export const WorldMap = ({
         },
       };
     } catch (err) {
-      console.error("Plugin system error:", err);
+      console.error('Plugin system error:', err);
     }
   }, [pluginLayerStates, integrationsRev]);
 
@@ -1365,17 +1264,12 @@ export const WorldMap = ({
     // Validate deLocation exists and has valid coordinates
     const hasValidDE =
       deLocation &&
-      typeof deLocation.lat === "number" &&
+      typeof deLocation.lat === 'number' &&
       !isNaN(deLocation.lat) &&
-      typeof deLocation.lon === "number" &&
+      typeof deLocation.lon === 'number' &&
       !isNaN(deLocation.lon);
 
-    if (
-      showPSKReporter &&
-      pskReporterSpots &&
-      pskReporterSpots.length > 0 &&
-      hasValidDE
-    ) {
+    if (showPSKReporter && pskReporterSpots && pskReporterSpots.length > 0 && hasValidDE) {
       pskReporterSpots.forEach((spot) => {
         // Validate spot coordinates are valid numbers
         let spotLat = parseFloat(spot.lat);
@@ -1384,41 +1278,28 @@ export const WorldMap = ({
         if (!isNaN(spotLat) && !isNaN(spotLon)) {
           // For TX spots (you transmitted → someone received): show the receiver (remote station)
           // For RX spots (someone transmitted → you received): show the sender (remote station)
-          const displayCall =
-            spot.direction === "rx"
-              ? spot.sender
-              : spot.receiver || spot.sender;
-          const dirLabel = spot.direction === "rx" ? "RX" : "TX";
-          const freqMHz =
-            spot.freqMHz ||
-            (spot.freq ? (spot.freq / 1000000).toFixed(3) : "?");
+          const displayCall = spot.direction === 'rx' ? spot.sender : spot.receiver || spot.sender;
+          const dirLabel = spot.direction === 'rx' ? 'RX' : 'TX';
+          const freqMHz = spot.freqMHz || (spot.freq ? (spot.freq / 1000000).toFixed(3) : '?');
           const bandColor = getBandColor(parseFloat(freqMHz));
 
           try {
             // Draw line from DE to spot location
-            const points = getGreatCirclePoints(
-              deLocation.lat,
-              deLocation.lon,
-              spotLat,
-              spotLon,
-              50,
-            );
+            const points = getGreatCirclePoints(deLocation.lat, deLocation.lon, spotLat, spotLon, 50);
 
             // Render polyline on all 3 world copies
             if (
               points &&
               Array.isArray(points) &&
               points.length > 1 &&
-              points.every(
-                (p) => Array.isArray(p) && !isNaN(p[0]) && !isNaN(p[1]),
-              )
+              points.every((p) => Array.isArray(p) && !isNaN(p[0]) && !isNaN(p[1]))
             ) {
               replicatePath(points).forEach((copy) => {
                 const line = L.polyline(copy, {
                   color: bandColor,
                   weight: 1.5,
                   opacity: 0.5,
-                  dashArray: "4, 4",
+                  dashArray: '4, 4',
                 }).addTo(map);
                 pskMarkersRef.current.push(line);
               });
@@ -1429,7 +1310,7 @@ export const WorldMap = ({
               const circle = L.circleMarker([rLat, rLon], {
                 radius: 4,
                 fillColor: bandColor,
-                color: "#fff",
+                color: '#fff',
                 weight: 1,
                 opacity: 0.9,
                 fillOpacity: 0.8,
@@ -1438,19 +1319,19 @@ export const WorldMap = ({
                   `
                 <b data-qrz-call="${esc(displayCall)}" style="cursor:pointer">${esc(displayCall)}</b> <span style="color:#888;font-size:10px">${dirLabel}</span><br>
                 ${esc(spot.mode)} @ ${esc(freqMHz)} MHz<br>
-                ${spot.snr !== null ? `SNR: ${spot.snr > 0 ? "+" : ""}${spot.snr} dB` : ""}
+                ${spot.snr !== null ? `SNR: ${spot.snr > 0 ? '+' : ''}${spot.snr} dB` : ''}
               `,
                 )
                 .addTo(map);
 
               if (onSpotClick) {
-                circle.on("click", () => onSpotClick(spot));
+                circle.on('click', () => onSpotClick(spot));
               }
 
               pskMarkersRef.current.push(circle);
             });
           } catch (err) {
-            console.warn("Error rendering PSKReporter spot:", err);
+            console.warn('Error rendering PSKReporter spot:', err);
           }
         }
       });
@@ -1467,9 +1348,9 @@ export const WorldMap = ({
 
     const hasValidDE =
       deLocation &&
-      typeof deLocation.lat === "number" &&
+      typeof deLocation.lat === 'number' &&
       !isNaN(deLocation.lat) &&
-      typeof deLocation.lon === "number" &&
+      typeof deLocation.lon === 'number' &&
       !isNaN(deLocation.lon);
 
     if (showWSJTX && wsjtxSpots && wsjtxSpots.length > 0 && hasValidDE) {
@@ -1477,11 +1358,8 @@ export const WorldMap = ({
       // For CQ: caller is the station. For QSO: dxCall is the remote station.
       const seen = new Map();
       wsjtxSpots.forEach((spot) => {
-        const call = spot.caller || spot.dxCall || "";
-        if (
-          call &&
-          (!seen.has(call) || spot.timestamp > seen.get(call).timestamp)
-        ) {
+        const call = spot.caller || spot.dxCall || '';
+        if (call && (!seen.has(call) || spot.timestamp > seen.get(call).timestamp)) {
           seen.set(call, spot);
         }
       });
@@ -1492,35 +1370,27 @@ export const WorldMap = ({
 
         if (!isNaN(spotLat) && !isNaN(spotLon)) {
           const freqMHz = spot.dialFrequency ? spot.dialFrequency / 1000000 : 0;
-          const bandColor = freqMHz ? getBandColor(freqMHz) : "#a78bfa";
+          const bandColor = freqMHz ? getBandColor(freqMHz) : '#a78bfa';
           // Prefix-estimated locations get reduced opacity
-          const isEstimated = spot.gridSource === "prefix";
+          const isEstimated = spot.gridSource === 'prefix';
 
           try {
             // Draw line from DE to decoded station
-            const points = getGreatCirclePoints(
-              deLocation.lat,
-              deLocation.lon,
-              spotLat,
-              spotLon,
-              50,
-            );
+            const points = getGreatCirclePoints(deLocation.lat, deLocation.lon, spotLat, spotLon, 50);
 
             if (
               points &&
               Array.isArray(points) &&
               points.length > 1 &&
-              points.every(
-                (p) => Array.isArray(p) && !isNaN(p[0]) && !isNaN(p[1]),
-              )
+              points.every((p) => Array.isArray(p) && !isNaN(p[0]) && !isNaN(p[1]))
             ) {
               // Render polyline on all 3 world copies
               replicatePath(points).forEach((copy) => {
                 const line = L.polyline(copy, {
-                  color: "#a78bfa",
+                  color: '#a78bfa',
                   weight: 1.5,
                   opacity: isEstimated ? 0.15 : 0.4,
-                  dashArray: "2, 6",
+                  dashArray: '2, 6',
                 }).addTo(map);
                 wsjtxMarkersRef.current.push(line);
               });
@@ -1530,11 +1400,11 @@ export const WorldMap = ({
             replicatePoint(spotLat, spotLon).forEach(([rLat, rLon]) => {
               const diamond = L.marker([rLat, rLon], {
                 icon: L.divIcon({
-                  className: "",
+                  className: '',
                   html: `<div style="
                     width: 8px; height: 8px;
                     background: ${bandColor};
-                    border: 1px solid ${isEstimated ? "#888" : "#fff"};
+                    border: 1px solid ${isEstimated ? '#888' : '#fff'};
                     transform: rotate(45deg);
                     opacity: ${isEstimated ? 0.5 : 0.9};
                   "></div>`,
@@ -1544,15 +1414,15 @@ export const WorldMap = ({
               })
                 .bindPopup(
                   `
-                <b data-qrz-call="${esc(call)}" style="cursor:pointer">${esc(call)}</b> ${spot.type === "CQ" ? "CQ" : ""}<br>
-                ${esc(spot.grid || "")} ${esc(spot.band || "")}${spot.gridSource === "prefix" ? " <i>(est)</i>" : spot.gridSource === "cache" ? " <i>(prev)</i>" : ""}<br>
-                ${esc(spot.mode || "")} SNR: ${spot.snr != null ? (spot.snr >= 0 ? "+" : "") + spot.snr : "?"} dB
+                <b data-qrz-call="${esc(call)}" style="cursor:pointer">${esc(call)}</b> ${spot.type === 'CQ' ? 'CQ' : ''}<br>
+                ${esc(spot.grid || '')} ${esc(spot.band || '')}${spot.gridSource === 'prefix' ? ' <i>(est)</i>' : spot.gridSource === 'cache' ? ' <i>(prev)</i>' : ''}<br>
+                ${esc(spot.mode || '')} SNR: ${spot.snr != null ? (spot.snr >= 0 ? '+' : '') + spot.snr : '?'} dB
               `,
                 )
                 .addTo(map);
 
               if (onSpotClick) {
-                diamond.on("click", () => onSpotClick(spot));
+                diamond.on('click', () => onSpotClick(spot));
               }
 
               wsjtxMarkersRef.current.push(diamond);
@@ -1593,9 +1463,9 @@ export const WorldMap = ({
   };
 
   return (
-    <div style={{ position: "relative", height: "100%", minHeight: "200px" }}>
+    <div style={{ position: 'relative', height: '100%', minHeight: '200px' }}>
       {/* Azimuthal equidistant projection (canvas-based) */}
-      {mapStyle === "azimuthal" && (
+      {mapStyle === 'azimuthal' && (
         <AzimuthalMap
           deLocation={deLocation}
           dxLocation={dxLocation}
@@ -1624,27 +1494,23 @@ export const WorldMap = ({
       <div
         ref={mapRef}
         style={{
-          height: "100%",
-          width: "100%",
-          borderRadius: "8px",
-          background: mapStyle === "countries" ? "#4a90d9" : undefined,
-          display: mapStyle === "azimuthal" ? "none" : undefined,
+          height: '100%',
+          width: '100%',
+          borderRadius: '8px',
+          background: mapStyle === 'countries' ? '#4a90d9' : undefined,
+          display: mapStyle === 'azimuthal' ? 'none' : undefined,
         }}
       />
 
       {/* Render all plugin layers (Leaflet only) */}
-      {mapStyle !== "azimuthal" &&
+      {mapStyle !== 'azimuthal' &&
         mapInstanceRef.current &&
         getAllLayers().map((layerDef) => (
           <PluginLayer
             key={layerDef.id}
             plugin={layerDef}
-            enabled={
-              pluginLayerStates[layerDef.id]?.enabled ?? layerDef.defaultEnabled
-            }
-            opacity={
-              pluginLayerStates[layerDef.id]?.opacity ?? layerDef.defaultOpacity
-            }
+            enabled={pluginLayerStates[layerDef.id]?.enabled ?? layerDef.defaultEnabled}
+            opacity={pluginLayerStates[layerDef.id]?.opacity ?? layerDef.defaultOpacity}
             config={pluginLayerStates[layerDef.id]?.config ?? layerDef.config}
             map={mapInstanceRef.current}
             satellites={satellites}
@@ -1661,60 +1527,54 @@ export const WorldMap = ({
       {/* MODIS Control (Only shows when MODIS map style is active) */}
 
       {/* Map lock toggle — below Leaflet zoom controls (Leaflet only) */}
-      {mapStyle !== "azimuthal" && (
+      {mapStyle !== 'azimuthal' && (
         <button
           onClick={() => setMapLocked((prev) => !prev)}
-          title={
-            mapLocked
-              ? "Unlock map (enable panning/zooming)"
-              : "Lock map (prevent accidental panning/zooming)"
-          }
+          title={mapLocked ? 'Unlock map (enable panning/zooming)' : 'Lock map (prevent accidental panning/zooming)'}
           style={{
-            position: "absolute",
-            top: "72px",
-            left: "10px",
-            width: "30px",
-            height: "30px",
-            background: mapLocked
-              ? "rgba(255, 80, 80, 0.25)"
-              : "rgba(0, 0, 0, 0.6)",
-            border: `2px solid ${mapLocked ? "rgba(255, 80, 80, 0.7)" : "rgba(0,0,0,0.3)"}`,
-            borderRadius: "4px",
-            color: mapLocked ? "#ff5050" : "#ccc",
-            fontSize: "14px",
-            cursor: "pointer",
+            position: 'absolute',
+            top: '72px',
+            left: '10px',
+            width: '30px',
+            height: '30px',
+            background: mapLocked ? 'rgba(255, 80, 80, 0.25)' : 'rgba(0, 0, 0, 0.6)',
+            border: `2px solid ${mapLocked ? 'rgba(255, 80, 80, 0.7)' : 'rgba(0,0,0,0.3)'}`,
+            borderRadius: '4px',
+            color: mapLocked ? '#ff5050' : '#ccc',
+            fontSize: '14px',
+            cursor: 'pointer',
             zIndex: 1000,
-            display: "flex",
-            alignItems: "center",
-            justifyContent: "center",
+            display: 'flex',
+            alignItems: 'center',
+            justifyContent: 'center',
             lineHeight: 1,
           }}
         >
-          {mapLocked ? "🔒" : "🔓"}
+          {mapLocked ? '🔒' : '🔓'}
         </button>
       )}
 
       {/* Night darkness slider (Leaflet only) */}
-      {mapStyle !== "azimuthal" && (
+      {mapStyle !== 'azimuthal' && (
         <div
           title="Adjust night overlay darkness"
           style={{
-            position: "absolute",
-            top: "108px",
-            left: "10px",
-            background: "rgba(0, 0, 0, 0.7)",
-            border: "1px solid #444",
-            borderRadius: "4px",
-            padding: "6px 8px",
+            position: 'absolute',
+            top: '108px',
+            left: '10px',
+            background: 'rgba(0, 0, 0, 0.7)',
+            border: '1px solid #444',
+            borderRadius: '4px',
+            padding: '6px 8px',
             zIndex: 1000,
-            display: "flex",
-            flexDirection: "column",
-            alignItems: "center",
-            gap: "3px",
-            width: "30px",
+            display: 'flex',
+            flexDirection: 'column',
+            alignItems: 'center',
+            gap: '3px',
+            width: '30px',
           }}
         >
-          <span style={{ fontSize: "12px", lineHeight: 1 }}>🌙</span>
+          <span style={{ fontSize: '12px', lineHeight: 1 }}>🌙</span>
           <input
             type="range"
             min="0"
@@ -1722,18 +1582,18 @@ export const WorldMap = ({
             value={nightDarkness}
             onChange={(e) => setNightDarkness(parseInt(e.target.value))}
             style={{
-              cursor: "pointer",
-              width: "80px",
-              transform: "rotate(-90deg)",
-              transformOrigin: "center center",
-              margin: "32px 0",
+              cursor: 'pointer',
+              width: '80px',
+              transform: 'rotate(-90deg)',
+              transformOrigin: 'center center',
+              margin: '32px 0',
             }}
           />
           <span
             style={{
-              fontSize: "9px",
-              fontFamily: "JetBrains Mono, monospace",
-              color: "#999",
+              fontSize: '9px',
+              fontFamily: 'JetBrains Mono, monospace',
+              color: '#999',
               lineHeight: 1,
             }}
           >
@@ -1742,31 +1602,31 @@ export const WorldMap = ({
         </div>
       )}
 
-      {mapStyle === "MODIS" && (
+      {mapStyle === 'MODIS' && (
         <div
           style={{
-            position: "absolute",
-            top: "50px",
-            right: "10px",
-            background: "rgba(0, 0, 0, 0.8)",
-            border: "1px solid #444",
-            padding: "8px",
-            borderRadius: "4px",
+            position: 'absolute',
+            top: '50px',
+            right: '10px',
+            background: 'rgba(0, 0, 0, 0.8)',
+            border: '1px solid #444',
+            padding: '8px',
+            borderRadius: '4px',
             zIndex: 1000,
-            display: "flex",
-            flexDirection: "column",
-            alignItems: "center",
-            gap: "10px",
+            display: 'flex',
+            flexDirection: 'column',
+            alignItems: 'center',
+            gap: '10px',
           }}
         >
           <div
             style={{
-              color: "#00ffcc",
-              fontSize: "10px",
-              fontFamily: "JetBrains Mono",
+              color: '#00ffcc',
+              fontSize: '10px',
+              fontFamily: 'JetBrains Mono',
             }}
           >
-            {gibsOffset === 0 ? "LATEST IMAGERY" : `${gibsOffset} DAYS AGO`}
+            {gibsOffset === 0 ? 'LATEST IMAGERY' : `${gibsOffset} DAYS AGO`}
           </div>
           <input
             type="range"
@@ -1774,7 +1634,7 @@ export const WorldMap = ({
             max="7"
             value={gibsOffset}
             onChange={(e) => setGibsOffset(parseInt(e.target.value))}
-            style={{ cursor: "pointer", width: "100px" }}
+            style={{ cursor: 'pointer', width: '100px' }}
           />
         </div>
       )}
@@ -1784,19 +1644,19 @@ export const WorldMap = ({
         value={mapStyle}
         onChange={(e) => setMapStyle(e.target.value)}
         style={{
-          position: "absolute",
-          top: "10px",
-          right: "10px",
-          background: "rgba(0, 0, 0, 0.8)",
-          border: "1px solid #444",
-          color: "#00ffcc",
-          padding: "6px 10px",
-          borderRadius: "4px",
-          fontSize: "11px",
-          fontFamily: "JetBrains Mono",
-          cursor: "pointer",
+          position: 'absolute',
+          top: '10px',
+          right: '10px',
+          background: 'rgba(0, 0, 0, 0.8)',
+          border: '1px solid #444',
+          color: '#00ffcc',
+          padding: '6px 10px',
+          borderRadius: '4px',
+          fontSize: '11px',
+          fontFamily: 'JetBrains Mono',
+          cursor: 'pointer',
           zIndex: 1000,
-          outline: "none",
+          outline: 'none',
         }}
       >
         {Object.entries(MAP_STYLES).map(([key, style]) => (
@@ -1809,37 +1669,28 @@ export const WorldMap = ({
       {/* Satellite toggle */}
 
       {/* Labels toggle */}
-      {onToggleDXLabels &&
-        showDXPaths &&
-        Array.isArray(dxPaths) &&
-        dxPaths.length > 0 && (
-          <button
-            onClick={onToggleDXLabels}
-            title={
-              showDXLabels
-                ? "Hide callsign labels on map"
-                : "Show callsign labels on map"
-            }
-            style={{
-              position: "absolute",
-              top: "10px",
-              left: "50px",
-              background: showDXLabels
-                ? "rgba(255, 170, 0, 0.2)"
-                : "rgba(0, 0, 0, 0.8)",
-              border: `1px solid ${showDXLabels ? "#ffaa00" : "#666"}`,
-              color: showDXLabels ? "#ffaa00" : "#888",
-              padding: "6px 10px",
-              borderRadius: "4px",
-              fontSize: "11px",
-              fontFamily: "JetBrains Mono",
-              cursor: "pointer",
-              zIndex: 1000,
-            }}
-          >
-            ⊞ CALLS {showDXLabels ? "ON" : "OFF"}
-          </button>
-        )}
+      {onToggleDXLabels && showDXPaths && Array.isArray(dxPaths) && dxPaths.length > 0 && (
+        <button
+          onClick={onToggleDXLabels}
+          title={showDXLabels ? 'Hide callsign labels on map' : 'Show callsign labels on map'}
+          style={{
+            position: 'absolute',
+            top: '10px',
+            left: '50px',
+            background: showDXLabels ? 'rgba(255, 170, 0, 0.2)' : 'rgba(0, 0, 0, 0.8)',
+            border: `1px solid ${showDXLabels ? '#ffaa00' : '#666'}`,
+            color: showDXLabels ? '#ffaa00' : '#888',
+            padding: '6px 10px',
+            borderRadius: '4px',
+            fontSize: '11px',
+            fontFamily: 'JetBrains Mono',
+            cursor: 'pointer',
+            zIndex: 1000,
+          }}
+        >
+          ⊞ CALLS {showDXLabels ? 'ON' : 'OFF'}
+        </button>
+      )}
 
       {/* DX News Ticker - left side of bottom bar */}
       {!hideOverlays && showDXNews && <DXNewsTicker />}
@@ -1848,26 +1699,26 @@ export const WorldMap = ({
       {!hideOverlays && (
         <div
           style={{
-            position: "absolute",
-            bottom: "44px",
-            left: "50%",
-            transform: "translateX(-50%)",
-            background: "rgba(0, 0, 0, 0.85)",
-            border: "1px solid #444",
-            borderRadius: "6px",
-            padding: "6px 10px",
+            position: 'absolute',
+            bottom: '44px',
+            left: '50%',
+            transform: 'translateX(-50%)',
+            background: 'rgba(0, 0, 0, 0.85)',
+            border: '1px solid #444',
+            borderRadius: '6px',
+            padding: '6px 10px',
             zIndex: 1000,
-            display: "flex",
-            gap: "8px",
-            alignItems: "center",
-            fontSize: "11px",
-            fontFamily: "JetBrains Mono, monospace",
-            flexWrap: "nowrap",
+            display: 'flex',
+            gap: '8px',
+            alignItems: 'center',
+            fontSize: '11px',
+            fontFamily: 'JetBrains Mono, monospace',
+            flexWrap: 'nowrap',
           }}
         >
           {showDXPaths && (
-            <div style={{ display: "flex", gap: "8px", alignItems: "center" }}>
-              <span style={{ color: "#888" }}>DX:</span>
+            <div style={{ display: 'flex', gap: '8px', alignItems: 'center' }}>
+              <span style={{ color: '#888' }}>DX:</span>
               {BAND_LEGEND_ORDER.map((band) => {
                 const bg = getBandColorForBand(band, effectiveBandColors);
                 const fg = getBandTextColor(bg);
@@ -1881,13 +1732,11 @@ export const WorldMap = ({
                     style={{
                       background: bg,
                       color: fg,
-                      padding: "2px 5px",
-                      borderRadius: "3px",
-                      fontWeight: "600",
-                      border: isActive
-                        ? "2px solid #ffffff"
-                        : "1px solid rgba(0,0,0,0.35)",
-                      cursor: "pointer",
+                      padding: '2px 5px',
+                      borderRadius: '3px',
+                      fontWeight: '600',
+                      border: isActive ? '2px solid #ffffff' : '1px solid rgba(0,0,0,0.35)',
+                      cursor: 'pointer',
                       lineHeight: 1.1,
                     }}
                   >
@@ -1897,39 +1746,39 @@ export const WorldMap = ({
               })}
             </div>
           )}
-          <div style={{ display: "flex", gap: "8px", alignItems: "center" }}>
+          <div style={{ display: 'flex', gap: '8px', alignItems: 'center' }}>
             <span
               style={{
-                background: "var(--accent-amber)",
-                color: "#000",
-                padding: "2px 5px",
-                borderRadius: "3px",
-                fontWeight: "600",
+                background: 'var(--accent-amber)',
+                color: '#000',
+                padding: '2px 5px',
+                borderRadius: '3px',
+                fontWeight: '600',
               }}
             >
               ●&nbsp;DE
             </span>
             <span
               style={{
-                background: "#00aaff",
-                color: "#000",
-                padding: "2px 5px",
-                borderRadius: "3px",
-                fontWeight: "600",
+                background: '#00aaff',
+                color: '#000',
+                padding: '2px 5px',
+                borderRadius: '3px',
+                fontWeight: '600',
               }}
             >
               ●&nbsp;DX
             </span>
           </div>
           {showPOTA && (
-            <div style={{ display: "flex", gap: "4px", alignItems: "center" }}>
+            <div style={{ display: 'flex', gap: '4px', alignItems: 'center' }}>
               <span
                 style={{
-                  background: "#44cc44",
-                  color: "#000",
-                  padding: "2px 5px",
-                  borderRadius: "3px",
-                  fontWeight: "600",
+                  background: '#44cc44',
+                  color: '#000',
+                  padding: '2px 5px',
+                  borderRadius: '3px',
+                  fontWeight: '600',
                 }}
               >
                 ▲&nbsp;POTA
@@ -1937,14 +1786,14 @@ export const WorldMap = ({
             </div>
           )}
           {showWWFF && (
-            <div style={{ display: "flex", gap: "4px", alignItems: "center" }}>
+            <div style={{ display: 'flex', gap: '4px', alignItems: 'center' }}>
               <span
                 style={{
-                  background: "#a3f3a3",
-                  color: "#000",
-                  padding: "2px 5px",
-                  borderRadius: "3px",
-                  fontWeight: "600",
+                  background: '#a3f3a3',
+                  color: '#000',
+                  padding: '2px 5px',
+                  borderRadius: '3px',
+                  fontWeight: '600',
                 }}
               >
                 ▼ WWFF
@@ -1952,72 +1801,68 @@ export const WorldMap = ({
             </div>
           )}
           {showSOTA && (
-            <div style={{ display: "flex", gap: "4px", alignItems: "center" }}>
+            <div style={{ display: 'flex', gap: '4px', alignItems: 'center' }}>
               <span
                 style={{
-                  background: "#ff9632",
-                  color: "#000",
-                  padding: "2px 5px",
-                  borderRadius: "3px",
-                  fontWeight: "600",
+                  background: '#ff9632',
+                  color: '#000',
+                  padding: '2px 5px',
+                  borderRadius: '3px',
+                  fontWeight: '600',
                 }}
               >
                 ◆&nbsp;SOTA
               </span>
             </div>
           )}
-          <div style={{ display: "flex", gap: "6px", alignItems: "center" }}>
-            <span style={{ color: "#ffcc00" }}>
-              ☼&nbsp;{t("app.legend.sun")}
-            </span>
-            <span style={{ color: "#aaaaaa" }}>
-              ☽&nbsp;{t("app.legend.moon")}
-            </span>
+          <div style={{ display: 'flex', gap: '6px', alignItems: 'center' }}>
+            <span style={{ color: '#ffcc00' }}>☼&nbsp;{t('app.legend.sun')}</span>
+            <span style={{ color: '#aaaaaa' }}>☽&nbsp;{t('app.legend.moon')}</span>
           </div>
         </div>
       )}
       {!hideOverlays && editingBand && (
         <div
           style={{
-            position: "absolute",
-            left: "50%",
-            bottom: "92px",
-            transform: "translateX(-50%)",
-            background: "rgba(0, 0, 0, 0.92)",
-            border: "1px solid #555",
-            borderRadius: "6px",
-            padding: "8px",
+            position: 'absolute',
+            left: '50%',
+            bottom: '92px',
+            transform: 'translateX(-50%)',
+            background: 'rgba(0, 0, 0, 0.92)',
+            border: '1px solid #555',
+            borderRadius: '6px',
+            padding: '8px',
             zIndex: 1001,
-            display: "flex",
-            alignItems: "center",
-            gap: "6px",
-            fontFamily: "JetBrains Mono, monospace",
-            fontSize: "11px",
+            display: 'flex',
+            alignItems: 'center',
+            gap: '6px',
+            fontFamily: 'JetBrains Mono, monospace',
+            fontSize: '11px',
           }}
         >
-          <span style={{ color: "#bbb" }}>{editingBand}</span>
+          <span style={{ color: '#bbb' }}>{editingBand}</span>
           <input
             type="color"
             value={editingColor}
             onChange={(e) => setEditingColor(e.target.value)}
             style={{
-              width: "26px",
-              height: "20px",
+              width: '26px',
+              height: '20px',
               padding: 0,
-              border: "1px solid #444",
-              background: "transparent",
-              cursor: "pointer",
+              border: '1px solid #444',
+              background: 'transparent',
+              cursor: 'pointer',
             }}
           />
           <span
             style={{
-              width: "80px",
-              background: "#111",
-              color: "#ddd",
-              border: "1px solid #444",
-              borderRadius: "3px",
-              padding: "2px 5px",
-              fontFamily: "JetBrains Mono, monospace",
+              width: '80px',
+              background: '#111',
+              color: '#ddd',
+              border: '1px solid #444',
+              borderRadius: '3px',
+              padding: '2px 5px',
+              fontFamily: 'JetBrains Mono, monospace',
             }}
           >
             {editingColor}
@@ -2026,12 +1871,12 @@ export const WorldMap = ({
             type="button"
             onClick={saveBandColor}
             style={{
-              background: "#1f6d35",
-              color: "#d2ffd8",
-              border: "1px solid #3da15d",
-              borderRadius: "4px",
-              padding: "3px 7px",
-              cursor: "pointer",
+              background: '#1f6d35',
+              color: '#d2ffd8',
+              border: '1px solid #3da15d',
+              borderRadius: '4px',
+              padding: '3px 7px',
+              cursor: 'pointer',
             }}
           >
             Save
@@ -2040,12 +1885,12 @@ export const WorldMap = ({
             type="button"
             onClick={resetBandColor}
             style={{
-              background: "#6f3f0f",
-              color: "#ffd7b0",
-              border: "1px solid #a76a2d",
-              borderRadius: "4px",
-              padding: "3px 7px",
-              cursor: "pointer",
+              background: '#6f3f0f',
+              color: '#ffd7b0',
+              border: '1px solid #a76a2d',
+              borderRadius: '4px',
+              padding: '3px 7px',
+              cursor: 'pointer',
             }}
           >
             Reset
@@ -2054,12 +1899,12 @@ export const WorldMap = ({
             type="button"
             onClick={resetAllBandColors}
             style={{
-              background: "#5b1d1d",
-              color: "#ffc1c1",
-              border: "1px solid #9a3d3d",
-              borderRadius: "4px",
-              padding: "3px 7px",
-              cursor: "pointer",
+              background: '#5b1d1d',
+              color: '#ffc1c1',
+              border: '1px solid #9a3d3d',
+              borderRadius: '4px',
+              padding: '3px 7px',
+              cursor: 'pointer',
             }}
           >
             Reset All
@@ -2068,12 +1913,12 @@ export const WorldMap = ({
             type="button"
             onClick={() => setEditingBand(null)}
             style={{
-              background: "#222",
-              color: "#ddd",
-              border: "1px solid #555",
-              borderRadius: "4px",
-              padding: "3px 7px",
-              cursor: "pointer",
+              background: '#222',
+              color: '#ddd',
+              border: '1px solid #555',
+              borderRadius: '4px',
+              padding: '3px 7px',
+              cursor: 'pointer',
             }}
           >
             Close
diff --git a/src/plugins/layers/useContestQsos.js b/src/plugins/layers/useContestQsos.js
index c69e0e3d..bc4108a5 100644
--- a/src/plugins/layers/useContestQsos.js
+++ b/src/plugins/layers/useContestQsos.js
@@ -10,7 +10,7 @@ export const metadata = {
   category: 'amateur',
   defaultEnabled: false,
   defaultOpacity: 0.7,
-  version: '1.0.0'
+  version: '1.0.0',
 };
 
 export function useLayer({ enabled = false, opacity = 0.7, map = null, onDXChange = null }) {
@@ -67,11 +67,15 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, onDXChang
   useEffect(() => {
     if (!map || typeof L === 'undefined') return;
 
-    linesRef.current.forEach(line => {
-      try { map.removeLayer(line); } catch (e) {}
+    linesRef.current.forEach((line) => {
+      try {
+        map.removeLayer(line);
+      } catch (e) {}
     });
-    markersRef.current.forEach(marker => {
-      try { map.removeLayer(marker); } catch (e) {}
+    markersRef.current.forEach((marker) => {
+      try {
+        map.removeLayer(marker);
+      } catch (e) {}
     });
     linesRef.current = [];
     markersRef.current = [];
@@ -81,7 +85,7 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, onDXChang
     const recent = qsos.slice(-120);
     const de = deLocation;
 
-    recent.forEach(qso => {
+    recent.forEach((qso) => {
       const lat = parseFloat(qso.lat);
       const lon = parseFloat(qso.lon);
       if (!Number.isFinite(lat) || !Number.isFinite(lon)) return;
@@ -94,19 +98,19 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, onDXChang
       if (de && Number.isFinite(de.lat) && Number.isFinite(de.lon)) {
         const points = getGreatCirclePoints(de.lat, de.lon, lat, lon, 50);
         if (Array.isArray(points) && points.length > 1) {
-          replicatePath(points).forEach(copy => {
+          replicatePath(points).forEach((copy) => {
             const line = L.polyline(copy, {
               color: bandColor,
               weight: 1.5,
               opacity: lineOpacity,
-              dashArray: '2, 6'
+              dashArray: '2, 6',
             }).addTo(map);
             linesRef.current.push(line);
           });
         }
       }
 
-      const bandLabel = qso.bandMHz ? `${qso.bandMHz} MHz` : (qso.band || '');
+      const bandLabel = qso.bandMHz ? `${qso.bandMHz} MHz` : qso.band || '';
       const timeLabel = qso.time || (qso.timestamp ? new Date(qso.timestamp).toLocaleTimeString() : '');
       const sourceLabel = qso.source ? qso.source.toUpperCase() : '';
 
@@ -117,13 +121,17 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, onDXChang
           color: '#fff',
           weight: 1,
           opacity: 0.9,
-          fillOpacity: markerOpacity
-        }).bindPopup(`
+          fillOpacity: markerOpacity,
+        })
+          .bindPopup(
+            `
           <b>${qso.dxCall || ''}</b><br>
           ${qso.mode || ''} ${bandLabel}<br>
           ${timeLabel ? `${timeLabel}<br>` : ''}
           ${sourceLabel}
-        `).addTo(map);
+        `,
+          )
+          .addTo(map);
 
         markersRef.current.push(marker);
       });
@@ -139,7 +147,8 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, onDXChang
 
     if (!latestWithCoords) return;
 
-    const qsoId = latestWithCoords.id ||
+    const qsoId =
+      latestWithCoords.id ||
       `${latestWithCoords.dxCall || ''}-${latestWithCoords.timestamp || ''}-${latestWithCoords.lat}-${latestWithCoords.lon}`;
 
     if (!qsoId || qsoId === lastAutoDxQsoIdRef.current) return;

From 3d6266cf4823676b091fe1c832cc76d7b4ebcffb Mon Sep 17 00:00:00 2001
From: s53zo <44831766+s53zo@users.noreply.github.com>
Date: Wed, 18 Feb 2026 23:31:12 +0100
Subject: [PATCH 5/6] style: apply Prettier formatting for CI

---
 .github/ISSUE_TEMPLATE/bug_report.md      |   11 +
 .github/ISSUE_TEMPLATE/feature_request.md |   11 +-
 .github/PULL_REQUEST_TEMPLATE.md          |    6 +-
 .github/workflows/build-rig-listener.yml  |    6 +-
 .github/workflows/ci.yml                  |  144 +-
 .github/workflows/docker-image.yml        |    2 +-
 .github/workflows/rig-listener-build.yml  |    2 +-
 CHANGELOG.md                              |   50 +-
 CODE_OF_CONDUCT.md                        |   22 +-
 CONTRIBUTING.md                           |   13 +-
 README.md                                 |  207 +-
 SECURITY.md                               |   70 +-
 TESTING.md                                |   17 +-
 config.example.json                       |   16 +-
 config.js                                 |  158 +-
 docker-compose.yml                        |    6 +-
 docs/ARCHITECTURE.md                      |    2 +-
 dxspider-proxy/README.md                  |   15 +-
 dxspider-proxy/server.js                  |  200 +-
 electron/main.js                          |   67 +-
 index.html                                |  281 +--
 iturhfprop-service/README.md              |   17 +-
 iturhfprop-service/server.js              |  267 +--
 package.json                              |    4 +-
 public/index.html                         |  191 +-
 rig-bridge/README.md                      |   52 +-
 rig-bridge/rig-bridge.js                  |  275 ++-
 rig-control/UserGuide.md                  |    3 +-
 rig-control/rig-daemon.js                 |  212 +-
 rig-control/scripts/README.md             |    5 +
 rig-control/test-flrig.js                 |   24 +-
 rig-control/test_plan.md                  |   51 +-
 rig-listener/README.md                    |   33 +-
 rig-listener/build.js                     |    4 +-
 rig-listener/rig-listener.js              |  361 +++-
 src/App.jsx                               |  111 +-
 src/DockableApp.jsx                       |  940 +++++----
 src/components/AmbientPanel.jsx           |  223 ++-
 src/components/AnalogClockPanel.jsx       |   27 +-
 src/components/AzimuthalMap.jsx           |  343 ++--
 src/components/BandConditionsPanel.jsx    |   42 +-
 src/components/BandHealthPanel.jsx        |  361 ++--
 src/components/CallsignLink.jsx           |   61 +-
 src/components/ContestPanel.jsx           |  249 ++-
 src/components/DXClusterPanel.jsx         |   82 +-
 src/components/DXFilterManager.jsx        |  863 +++++----
 src/components/DXNewsTicker.jsx           |  193 +-
 src/components/DXpeditionPanel.jsx        |   48 +-
 src/components/DockableLayout.jsx         |  238 +--
 src/components/ErrorBoundary.jsx          |   71 +-
 src/components/Header.jsx                 |  235 ++-
 src/components/IDTimerPanel.jsx           |  124 +-
 src/components/Icons.jsx                  |  211 +-
 src/components/LocationPanel.jsx          |  228 ++-
 src/components/OnAirPanel.jsx             |   46 +-
 src/components/POTAPanel.jsx              |   58 +-
 src/components/PSKFilterManager.jsx       |  282 ++-
 src/components/PSKReporterPanel.jsx       |  469 +++--
 src/components/PotaSotaPanel.jsx          |   68 +-
 src/components/PropagationPanel.jsx       |  468 +++--
 src/components/RigControlPanel.jsx        |   58 +-
 src/components/RotatorMapOverlay.jsx      |   47 +-
 src/components/RotatorPanel.jsx           |  178 +-
 src/components/SOTAPanel.jsx              |   70 +-
 src/components/SettingsPanel.jsx          | 2129 +++++++++++++--------
 src/components/SolarPanel.jsx             |  609 ++++--
 src/components/SpaceWeatherPanel.jsx      |  102 +-
 src/components/WWFFPanel.jsx              |   58 +-
 src/components/WeatherPanel.jsx           |  219 ++-
 src/components/WhatsNew.jsx               |  228 ++-
 src/components/index.js                   |    2 +-
 src/contexts/DockableLayoutContext.jsx    |   99 +-
 src/contexts/RigContext.jsx               |   60 +-
 src/hooks/app/useAppConfig.js             |   16 +-
 src/hooks/app/useDXLocation.js            |    4 +-
 src/hooks/app/useFilters.js               |   10 +-
 src/hooks/app/useFullscreen.js            |   10 +-
 src/hooks/app/useMapLayers.js             |   46 +-
 src/hooks/app/useSatellitesFilters.js     |    8 +-
 src/hooks/app/useTimeState.js             |   18 +-
 src/hooks/app/useVersionCheck.js          |    8 +-
 src/hooks/index.js                        |    2 +-
 src/hooks/useAmbientWeather.js            |   28 +-
 src/hooks/useBandConditions.js            |   35 +-
 src/hooks/useBandHealth.js                |  150 +-
 src/hooks/useDXCluster.js                 |   37 +-
 src/hooks/useDXClusterData.js             |   78 +-
 src/hooks/usePOTASpots.js                 |  103 +-
 src/hooks/usePSKReporter.js               |  119 +-
 src/hooks/usePropagation.js               |    4 +-
 src/hooks/useRotator.js                   |   15 +-
 src/hooks/useSOTASpots.js                 |   29 +-
 src/hooks/useSatellites.js                |   18 +-
 src/hooks/useSolarIndices.js              |    2 +-
 src/hooks/useSpaceWeather.js              |   31 +-
 src/hooks/useVisibilityRefresh.js         |    6 +-
 src/hooks/useWSJTX.js                     |   44 +-
 src/hooks/useWWFFSpots.js                 |   53 +-
 src/hooks/useWeather.js                   |   22 +-
 src/lang/i18n.js                          |   10 +-
 src/layouts/ClassicLayout.jsx             | 1422 ++++++--------
 src/layouts/ModernLayout.jsx              |  279 ++-
 src/main.jsx                              |    2 +-
 src/plugins/OpenHamClock-Plugin-Guide.md  |  239 +--
 src/plugins/layerRegistry.js              |   12 +-
 src/plugins/layers/CloudLayer/README.md   |   37 +-
 src/plugins/layers/aurora/README.md       |   46 +-
 src/plugins/layers/earthquakes/README.md  |   58 +-
 src/plugins/layers/grayline/README.md     |   77 +-
 src/plugins/layers/lightning/README.md    |   58 +-
 src/plugins/layers/rbn/README.md          |   63 +-
 src/plugins/layers/satellite/README.md    |    4 +-
 src/plugins/layers/useAurora.js           |   21 +-
 src/plugins/layers/useCityLights.js       |    9 +-
 src/plugins/layers/useEarthquakes.js      |   80 +-
 src/plugins/layers/useGrayLine.js         |  302 +--
 src/plugins/layers/useGreatCircle.js      |   29 +-
 src/plugins/layers/useLightning.js        |  319 +--
 src/plugins/layers/useMUFMap.js           |  162 +-
 src/plugins/layers/useN3FJPLoggedQSOs.js  |  157 +-
 src/plugins/layers/useOWMClouds.js        |    9 +-
 src/plugins/layers/useRBN.js              |  290 +--
 src/plugins/layers/useSatelliteLayer.js   |  124 +-
 src/plugins/layers/useVOACAPHeatmap.js    |  225 ++-
 src/plugins/layers/useWSPR.js             |  651 ++++---
 src/plugins/layers/useWXRadar.js          |    8 +-
 src/plugins/layers/wspr/README.md         |   54 +-
 src/plugins/layers/wxradar/README.md      |   24 +-
 src/server/ctydat.js                      |   22 +-
 src/store/layoutStore.js                  |   50 +-
 src/styles/main.css                       |  297 ++-
 src/utils/apiFetch.js                     |   12 +-
 src/utils/bandPlan.js                     |   34 +-
 src/utils/callsign.js                     |  453 +++--
 src/utils/config.js                       |  116 +-
 src/utils/ctyLookup.js                    |    2 +-
 src/utils/dxClusterFilters.js             |  243 ++-
 src/utils/dxClusterFilters.test.js        |    4 +-
 src/utils/geo.js                          |  212 +-
 src/utils/index.js                        |   10 +-
 src/utils/profiles.js                     |   46 +-
 src/utils/terminator.js                   |   42 +-
 vite.config.mjs                           |   22 +-
 vitest.config.js                          |   13 +-
 wsjtx-relay/README.md                     |   15 +-
 wsjtx-relay/package.json                  |    8 +-
 wsjtx-relay/relay.js                      |  196 +-
 147 files changed, 11789 insertions(+), 8380 deletions(-)

diff --git a/.github/ISSUE_TEMPLATE/bug_report.md b/.github/ISSUE_TEMPLATE/bug_report.md
index b4c1a8ef..d947a02c 100644
--- a/.github/ISSUE_TEMPLATE/bug_report.md
+++ b/.github/ISSUE_TEMPLATE/bug_report.md
@@ -7,22 +7,28 @@ assignees: ''
 ---
 
 ## Describe the Bug
+
 A clear and concise description of what the bug is.
 
 ## To Reproduce
+
 Steps to reproduce the behavior:
+
 1. Go to '...'
 2. Click on '...'
 3. Scroll down to '...'
 4. See error
 
 ## Expected Behavior
+
 A clear and concise description of what you expected to happen.
 
 ## Screenshots
+
 If applicable, add screenshots to help explain your problem.
 
 ## Environment
+
 - **OS**: [e.g., Windows 11, macOS Sonoma, Ubuntu 22.04, Raspberry Pi OS]
 - **Browser**: [e.g., Chrome 120, Firefox 121, Safari 17]
 - **Node.js Version**: [e.g., 20.10.0]
@@ -30,19 +36,24 @@ If applicable, add screenshots to help explain your problem.
 - **Running As**: [Web browser / Electron app / Docker]
 
 ## For Raspberry Pi Users
+
 - **Pi Model**: [e.g., Pi 4 4GB, Pi 3B+]
 - **Pi OS Version**: [e.g., Bookworm 64-bit]
 - **Display**: [e.g., Official 7" touchscreen, HDMI 1080p monitor]
 - **Running in Kiosk Mode**: [Yes/No]
 
 ## Console Errors
+
 If there are any errors in the browser console (F12), please paste them here:
+
 ```
 Paste console errors here
 ```
 
 ## Additional Context
+
 Add any other context about the problem here. Include your callsign if you're comfortable sharing it!
 
 ---
+
 73!
diff --git a/.github/ISSUE_TEMPLATE/feature_request.md b/.github/ISSUE_TEMPLATE/feature_request.md
index b4bf1131..e0b222f9 100644
--- a/.github/ISSUE_TEMPLATE/feature_request.md
+++ b/.github/ISSUE_TEMPLATE/feature_request.md
@@ -7,16 +7,21 @@ assignees: ''
 ---
 
 ## Is your feature request related to a problem?
+
 A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]
 
 ## Describe the Solution You'd Like
+
 A clear and concise description of what you want to happen.
 
 ## Describe Alternatives You've Considered
+
 A clear and concise description of any alternative solutions or features you've considered.
 
 ## Use Case
+
 How would this feature benefit amateur radio operators? Be specific about the use case:
+
 - [ ] General HF operation
 - [ ] VHF/UHF operation
 - [ ] Satellite operation
@@ -24,18 +29,22 @@ How would this feature benefit amateur radio operators? Be specific about the us
 - [ ] POTA/SOTA
 - [ ] DXing
 - [ ] Emergency communications
-- [ ] Other: ___________
+- [ ] Other: ****\_\_\_****
 
 ## Would you be willing to help implement this?
+
 - [ ] Yes, I can submit a PR
 - [ ] Yes, I can help test
 - [ ] No, but I'd use it!
 
 ## Additional Context
+
 Add any other context, screenshots, or mockups about the feature request here.
 
 ## Similar Features in Other Software
+
 Are there similar features in other amateur radio software? If so, what do you like/dislike about their implementation?
 
 ---
+
 73!
diff --git a/.github/PULL_REQUEST_TEMPLATE.md b/.github/PULL_REQUEST_TEMPLATE.md
index de05745b..d168077d 100644
--- a/.github/PULL_REQUEST_TEMPLATE.md
+++ b/.github/PULL_REQUEST_TEMPLATE.md
@@ -16,9 +16,9 @@
 
 <!-- Steps for reviewers to verify the change works correctly -->
 
-1. 
-2. 
-3. 
+1.
+2.
+3.
 
 ## Checklist
 
diff --git a/.github/workflows/build-rig-listener.yml b/.github/workflows/build-rig-listener.yml
index 36594900..47c48e10 100644
--- a/.github/workflows/build-rig-listener.yml
+++ b/.github/workflows/build-rig-listener.yml
@@ -7,7 +7,7 @@
 name: Build Rig Listener
 
 on:
-  workflow_dispatch:          # Manual trigger from Actions tab
+  workflow_dispatch: # Manual trigger from Actions tab
   release:
     types: [created]
 
@@ -21,12 +21,12 @@ jobs:
             output: rig-listener-win-x64.exe
             artifact: rig-listener-win-x64
 
-          - os: macos-13              # Intel Mac
+          - os: macos-13 # Intel Mac
             target: node18-macos-x64
             output: rig-listener-mac-x64
             artifact: rig-listener-mac-x64
 
-          - os: macos-latest          # Apple Silicon
+          - os: macos-latest # Apple Silicon
             target: node18-macos-arm64
             output: rig-listener-mac-arm64
             artifact: rig-listener-mac-arm64
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
index 440520fa..980634e3 100644
--- a/.github/workflows/ci.yml
+++ b/.github/workflows/ci.yml
@@ -2,98 +2,98 @@ name: CI
 
 on:
   push:
-    branches: [ main, develop ]
+    branches: [main, develop]
   pull_request:
-    branches: [ main ]
+    branches: [main]
 
 jobs:
   format:
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v4
+      - uses: actions/checkout@v4
 
-    - name: Use Node.js 22.x
-      uses: actions/setup-node@v4
-      with:
-        node-version: 22.x
+      - name: Use Node.js 22.x
+        uses: actions/setup-node@v4
+        with:
+          node-version: 22.x
 
-    - name: Install dependencies
-      run: npm install
+      - name: Install dependencies
+        run: npm install
 
-    - name: Check formatting
-      run: npm run format:check
+      - name: Check formatting
+        run: npm run format:check
 
   test:
     runs-on: ubuntu-latest
     needs: format
-    
+
     strategy:
       matrix:
         node-version: [20.x, 22.x]
-    
+
     steps:
-    - uses: actions/checkout@v4
-    
-    - name: Use Node.js ${{ matrix.node-version }}
-      uses: actions/setup-node@v4
-      with:
-        node-version: ${{ matrix.node-version }}
-    
-    - name: Install dependencies
-      run: npm install
-    
-    - name: Build frontend
-      run: npm run build
-    
-    - name: Start server and test health endpoint
-      run: |
-        node server.js &
-        SERVER_PID=$!
-
-        for i in $(seq 1 30); do
-          if curl -sf http://localhost:3000/api/health > /dev/null 2>&1; then
-            echo "✓ Health check passed on :3000 attempt $i"
-            kill $SERVER_PID 2>/dev/null || true
-            exit 0
-          fi
-          if curl -sf http://localhost:3001/api/health > /dev/null 2>&1; then
-            echo "✓ Health check passed on :3001 attempt $i"
-            kill $SERVER_PID 2>/dev/null || true
-            exit 0
-          fi
-          sleep 1
-        done
-
-        echo "✗ Health check failed after 30 attempts (tried :3000 and :3001)"
-        kill $SERVER_PID 2>/dev/null || true
-        exit 1
-        
+      - uses: actions/checkout@v4
+
+      - name: Use Node.js ${{ matrix.node-version }}
+        uses: actions/setup-node@v4
+        with:
+          node-version: ${{ matrix.node-version }}
+
+      - name: Install dependencies
+        run: npm install
+
+      - name: Build frontend
+        run: npm run build
+
+      - name: Start server and test health endpoint
+        run: |
+          node server.js &
+          SERVER_PID=$!
+
+          for i in $(seq 1 30); do
+            if curl -sf http://localhost:3000/api/health > /dev/null 2>&1; then
+              echo "✓ Health check passed on :3000 attempt $i"
+              kill $SERVER_PID 2>/dev/null || true
+              exit 0
+            fi
+            if curl -sf http://localhost:3001/api/health > /dev/null 2>&1; then
+              echo "✓ Health check passed on :3001 attempt $i"
+              kill $SERVER_PID 2>/dev/null || true
+              exit 0
+            fi
+            sleep 1
+          done
+
+          echo "✗ Health check failed after 30 attempts (tried :3000 and :3001)"
+          kill $SERVER_PID 2>/dev/null || true
+          exit 1
+
   docker:
     runs-on: ubuntu-latest
     needs: test
     # Only run docker build on push to main, not PRs
     if: github.event_name == 'push' && github.ref == 'refs/heads/main'
-    
+
     steps:
-    - uses: actions/checkout@v4
-    
-    - name: Build Docker image
-      run: docker build -t openhamclock:test .
-    # Force server port to 3000 for CI health check consistency
-    - name: Test Docker container
-      run: |
-        docker run -d -p 3000:3000 --name ohc-test openhamclock:test
-        
-        for i in $(seq 1 30); do
-          if curl -sf http://localhost:3000/api/health > /dev/null 2>&1; then
-            echo "✓ Docker health check passed on attempt $i"
-            docker stop ohc-test
-            exit 0
-          fi
-          sleep 1
-        done
-        
-        echo "✗ Docker health check failed after 30 attempts"
-        docker logs ohc-test
-        docker stop ohc-test
-        exit 1
+      - uses: actions/checkout@v4
+
+      - name: Build Docker image
+        run: docker build -t openhamclock:test .
+      # Force server port to 3000 for CI health check consistency
+      - name: Test Docker container
+        run: |
+          docker run -d -p 3000:3000 --name ohc-test openhamclock:test
+
+          for i in $(seq 1 30); do
+            if curl -sf http://localhost:3000/api/health > /dev/null 2>&1; then
+              echo "✓ Docker health check passed on attempt $i"
+              docker stop ohc-test
+              exit 0
+            fi
+            sleep 1
+          done
+
+          echo "✗ Docker health check failed after 30 attempts"
+          docker logs ohc-test
+          docker stop ohc-test
+          exit 1
diff --git a/.github/workflows/docker-image.yml b/.github/workflows/docker-image.yml
index 7bc2c1e3..6062a4d4 100644
--- a/.github/workflows/docker-image.yml
+++ b/.github/workflows/docker-image.yml
@@ -2,7 +2,7 @@ name: Build and Publish Docker Image
 
 on:
   push:
-    branches: [ "main" ]
+    branches: ['main']
 
 env:
   REGISTRY: ghcr.io
diff --git a/.github/workflows/rig-listener-build.yml b/.github/workflows/rig-listener-build.yml
index 2cd340bb..ba886c2f 100644
--- a/.github/workflows/rig-listener-build.yml
+++ b/.github/workflows/rig-listener-build.yml
@@ -84,7 +84,7 @@ jobs:
       - name: Create Release
         uses: softprops/action-gh-release@v2
         with:
-          name: "Rig Listener ${{ github.ref_name }}"
+          name: 'Rig Listener ${{ github.ref_name }}'
           body: |
             ## OpenHamClock Rig Listener
 
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 080b0c04..ff53dcf1 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -5,6 +5,7 @@ All notable changes to OpenHamClock will be documented in this file.
 ## [15.5.4] - 2026-02-18
 
 ### Fixed
+
 - **WWFF cache validation bug**: Copy-paste error checked `potaCache.data` instead of `wwffCache.data`, causing stale or missing WWFF spots
 - **Stale spot fallback**: POTA, SOTA, and WWFF endpoints now cap stale cache at 10 minutes (was unlimited on upstream API failure)
 - **Client-side age filtering**: POTA and SOTA spots now filter out entries older than 60 minutes (WWFF already had this)
@@ -16,16 +17,19 @@ All notable changes to OpenHamClock will be documented in this file.
 - **Map callsign labels**: Tightened bounding boxes on all map callsign labels (DX Cluster, POTA, WWFF, SOTA) — reduced padding, border, font-size, and added tight line-height for less map clutter
 
 ### Added
+
 - Prettier code formatting pipeline with `.prettierrc`, pre-commit hooks (Husky + lint-staged), and CI enforcement
 - `RBNapi=` metric in memory diagnostic logs
 - Express error middleware catches body-parser errors before they reach uncaughtException
 
 ### Restored
+
 - `rig-bridge/` and `rig-control/` directories for power users who prefer flrig/rigctld or daemon-based rig control
 
 ## [15.5.3] - 2026-02-17
 
 ### Added
+
 - **Satellite tracker overhaul** — Floating data window, blinking visibility indicators, pinned satellite tracking, GOES-18/19 weather satellites re-enabled
 - **SOTA summit details** — Spots now include full summit info (name, altitude, coordinates, points) from the official SOTA summits database, refreshed daily
 - **POTA/WWFF click-to-tune** — Park spots now properly trigger rig control when clicked
@@ -34,12 +38,14 @@ All notable changes to OpenHamClock will be documented in this file.
 - **Contributors list** — 23 contributors recognized in the Community tab
 
 ### Fixed
+
 - **WSJT-X rig tuning** — Click-to-tune now sends the dial frequency instead of the audio offset for FT8/FT4 decodes
 - **Frequency display** — POTA, SOTA, and WWFF panels now consistently show frequencies in MHz
 - **SOTA QRT filtering** — Operators who have signed off (QRT) are filtered out of the spots list
 - **Favicon not showing** — SEO and favicon tags were only in the monolithic fallback, not the Vite-built index.html that production serves
 
 ### Removed
+
 - Nested duplicate `openhamclock-main/` directory (3.7MB waste)
 - Backup/debug files: `.jsxbak`, `.backup`, `.bak`, `tle_backup.txt`, test scripts, debug patches
 - Stale dev notes: `TODAYS_PLUGIN_UPDATES.md`, `PLUGIN_DOCUMENTATION_SUMMARY.md`, `RIG_CONTROL_COMPARISON.md`
@@ -48,6 +54,7 @@ All notable changes to OpenHamClock will be documented in this file.
 - Duplicate `build-rig-listener.yml` workflow
 
 ### Improved
+
 - New `docs/ARCHITECTURE.md` — full codebase map for contributors
 - Rewritten `CONTRIBUTING.md` — proper dev setup, code patterns, testing checklist
 - `.editorconfig` for consistent formatting across editors
@@ -57,6 +64,7 @@ All notable changes to OpenHamClock will be documented in this file.
 ## [15.5.2] - 2026-02-16
 
 ### Fixed
+
 - **Railway OOM crashes** — Memory leak investigation at 1800-2300 concurrent users:
   - `callsignLocationCache` (RBN skimmers) had no cap — added 2000-entry limit with oldest-first eviction
   - `geoIPCache` stored duplicate data in both a Map and a plain object — eliminated object, reconstruct only at save time
@@ -68,16 +76,19 @@ All notable changes to OpenHamClock will be documented in this file.
 ## [15.5.1] - 2026-02-15
 
 ### Added
+
 - **cty.dat DXCC entity database** — Callsign identification now uses the full AD1C cty.dat database (~400 entities, thousands of prefixes). Replaces the old 120-entry prefix table.
 - **Smarter DX cluster filtering** — Spotter/spot continent/zone filtering uses cty.dat for accurate identification
 
 ### Fixed
+
 - **MUF layer regression** — The ionosonde-based MUF overlay was missing from Map Layers; restored
 - **VOACAP power levels** — Changing TX power now produces dramatically different propagation maps as expected
 
 ## [15.5.0] - 2026-02-15
 
 ### Added
+
 - **Direct rig control** — Click any DX spot, POTA activation, or WSJT-X decode to tune your radio. Supports Yaesu, Kenwood, Elecraft, and Icom via USB serial.
 - **One-click rig listener download** — Download the Rig Listener for Windows, Mac, or Linux from Settings. Double-click to run — auto-installs everything.
 - **Interactive setup wizard** — Detects USB serial ports, asks radio brand/model, saves config, connects in 30 seconds.
@@ -88,6 +99,7 @@ All notable changes to OpenHamClock will be documented in this file.
 ## [15.4.1] - 2026-02-15
 
 ### Added
+
 - **QRZ.com callsign lookups** — 3-tier waterfall: QRZ → HamQTH → prefix estimation
 - **Antenna rotator panel** — Real-time azimuth display and Shift+click map control
 - **Mouse wheel zoom sensitivity** — Adjustable scroll-to-zoom speed
@@ -102,6 +114,7 @@ All notable changes to OpenHamClock will be documented in this file.
 ## [15.2.12] - 2026-02-12
 
 ### Fixed
+
 - **Critical memory leak (OOM at 4GB after ~24h)** — Multiple unbounded data structures in the PSK-MQTT proxy caused heap exhaustion:
   - `recentSpots` had no cap on insert — spots were `.push()`ed with no limit, only trimmed to 500 every 5 minutes. With 1000+ subscribed callsigns, hundreds of thousands of spots accumulated between cleanups. Now capped at 200 per callsign at insert time.
   - `recentSpots` and `spotBuffer` entries were never cleaned up when callsigns unsubscribed — every callsign that disconnected left behind up to 500 spots for up to 1 hour. Over 24 hours with thousands of unique visitors, this accumulated hundreds of MB of orphaned spot data. Now deleted immediately on unsubscribe.
@@ -120,28 +133,34 @@ All notable changes to OpenHamClock will be documented in this file.
 ## [15.2.11] - 2026-02-11
 
 ### Added
+
 - **ID Timer panel (Dockable layout)** — 10-minute countdown timer that reminds operators to identify their station. Displays a large countdown with progress bar; in the final minute the display turns red and pulses. At expiration, plays three short beeps via Web Audio API and shows a full-screen overlay with your callsign in large blinking text. Clicking anywhere dismisses the alert and resets the timer. Start/Stop button lets operators pause the timer when not on the air. Available from the `+` panel picker as 📢 ID Timer
 
 ### Fixed
+
 - **PSK-MQTT reconnect fork bomb** — When the MQTT broker connection dropped, `pskMqttConnect()` called `.end(true)` on the old client, which fired its `close` event, which called `scheduleMqttReconnect()`, which called `pskMqttConnect()` again — each cycle doubling the number of pending reconnect chains. Over hours of downtime this created hundreds of parallel reconnect loops, flooding logs with `Disconnected from mqtt.pskreporter.info` and exhausting resources. Three fixes: (1) strip all event listeners from old client before `.end(true)` so its `close` event can't schedule a reconnect; (2) stale-client guard on `close`/`error`/`offline` handlers — only react if the firing client is still the current one; (3) single reconnect timer — `clearTimeout` before scheduling a new reconnect, preventing multiple pending timers
 
 ## [15.2.10] - 2026-02-11
 
 ### Added
+
 - **SOTA (Summits on the Air) panel** — New SOTA activator spots panel alongside POTA. In Classic and Modern layouts, the POTA slot now has POTA/SOTA tabs (like the Solar panel cycling) with independent Map ON/OFF toggles for each. In Dockable layout, SOTA is a fully separate panel in the panel picker (⛰️) so you can dock it independently, stack it with POTA, or place it anywhere
 - **SOTA map markers** — Orange diamond markers for SOTA activators on the world map (distinct from POTA's green triangles). Callsign labels shown when DX labels are enabled. Popup shows summit reference, name, and points. Separate `showSOTA` map layer toggle. Legend shows `◆ SOTA` when active
 - **SOTA data hook** — `useSOTASpots` fetches from the existing `/api/sota/spots` server endpoint (SOTA API v2). Maps summit details including lat/lon, altitude, and activation points. 2-minute refresh cycle matching POTA
 
 ### Fixed
+
 - **DX location lock not working** — Clicking callsigns in DX Cluster or PSK Reporter panels moved the DX point even when locked. Lock check was only in the WorldMap click handler; `handleDXChange` in `useDXLocation` now gates all updates through `dxLockedRef`
 - **Map overlays disappear at dateline (#327)** — Replaced antimeridian path splitting with world-copy duplication (same approach as the GrayLine plugin). Polylines and circle markers are now rendered at -360°, 0°, +360° longitude offsets so they appear on every visible map copy. Affects DX Cluster paths, PSK Reporter paths, WSJT-X paths, satellite tracks/footprints, great circle lines, and contest QSO lines. Users in Australia, New Zealand, and Pacific islands no longer lose spots when panning
 
 ## [15.1.9] - 2026-02-10
 
 ### Added
+
 - **Server-side settings sync (opt-in)** — All UI preferences (layout, panel visibility, map layers, filters, theme, temp unit, solar panel mode, etc.) can now be persisted on the server in `data/settings.json`. Enable with `SETTINGS_SYNC=true` in `.env` — designed for single-operator self-hosted/Pi deployments where you want every device (phone, tablet, desktop) to share the same configuration without setting up each browser individually. Disabled by default for multi-user hosted deployments like openhamclock.com where each user's settings live in their own browser localStorage. When enabled: server → browser on page load (server wins), browser → server on any change (2s debounce). First device to connect seeds the server; subsequent devices inherit settings
 
 ### Fixed
+
 - **Stale SFI and SSN values** — SFI was reading from `f107_cm_flux.json` which stopped updating at 2025-12-31, showing a month-old value of 170. SSN was reading from `observed-solar-cycle-indices.json` which only has monthly averages. Now uses three-tier fallback: (1) SWPC `summary/10cm-flux.json` for current SFI (updates every few hours), (2) N0NBH/hamqsl.com feed for both SFI and daily SSN (same source as GridTracker, Log4OM, and hamqsl.com), (3) archive endpoints for history graphs only. Propagation predictions also updated to use current values. N0NBH cache pre-warmed on server startup
 - **RBN only showing CW spots** — The RBN telnet parser regex required a `WPM` field, which only CW spots have. FT8, FT4, RTTY, and PSK spots were silently dropped. Fixed regex to match all spot formats by terminating at `dB` and optionally extracting WPM/BPS speed afterward. RBN buffer increased from 500 → 2000 spots
 - **"fatal: couldn't find remote ref" on update (#293)** — Update script and server-side git functions didn't handle broken git state: missing/wrong remote URL, detached HEAD, stale remote refs, or missing upstream tracking. Now auto-fixes remote URL, fetches with `--prune`, detects and recovers detached HEAD, sets upstream tracking, and falls back to `git reset --hard` if `git pull` fails
@@ -152,10 +171,12 @@ All notable changes to OpenHamClock will be documented in this file.
 ## [15.1.8] - 2026-02-10
 
 ### Changed
+
 - **Weather → client-direct Open-Meteo** — Removed entire server-side weather stack (NWS, Open-Meteo proxy, background worker, throttle queue, cache). All weather is now fetched directly by each user's browser from Open-Meteo. Rate limits are distributed across all user IPs instead of concentrated on our server — eliminates the 429 backoff death spirals that plagued 2,000+ user deployments. Optional Open-Meteo API key field in Settings for users who want higher limits. Removed ~400 lines of server code
 - **Solar indices panel** — Each section (SFI, K-Index, SSN) now shows contextual detail: condition labels (e.g. "Excellent", "Quiet", "High"), chart descriptions ("10.7cm Solar Flux — 20-day trend"), value ranges, time axis labels on K-Index bars ("Now → +24h"), and fallback explanatory text when no history data is available
 
 ### Fixed
+
 - **Blank screen — `filteredSatellites is not defined`** — DockableApp and ClassicLayout passed raw `satellites.data` to WorldMap instead of `filteredSatellites`. The variable was never destructured from props, causing a ReferenceError that crashed the entire React tree with no error boundary to catch it. Fixed all three layouts to properly receive and pass `filteredSatellites`. Also means satellite filters in Settings now actually work in dockable and classic layouts
 - **Blank screen after update** — After server updates, browsers with cached old JS chunks would fail to load new modules, crashing the React app with a blank screen (users had to clear cookies/cache to fix). Three fixes: (1) global chunk-load error handler in `index.html` detects stale module import failures and auto-reloads once; (2) `update.sh` now deletes `dist/` before rebuilding to prevent old hashed chunks from being served alongside new ones; (3) backward-compatible `/api/weather` stub endpoint returns `{ _direct: true }` so old cached client code doesn't 404
 - **Global error boundary** — Added `ErrorBoundary` component wrapping the entire app. Future render crashes show a recovery UI with "Reload Page" and "Clear Cache & Reload" buttons plus expandable error details, instead of a blank screen
@@ -163,6 +184,7 @@ All notable changes to OpenHamClock will be documented in this file.
 ## [15.1.7] - 2026-02-09
 
 ### Added
+
 - **Upstream Request Manager** — New `UpstreamManager` class prevents request stampedes on external APIs. Three-layer protection: (1) in-flight request deduplication — 50 concurrent users trigger 1 upstream fetch, not 50; (2) stale-while-revalidate — serve cached data instantly while refreshing in background; (3) exponential backoff with jitter per service. Applied to PSKReporter HTTP and WSPR Heatmap endpoints
 - **PSKReporter Server-Side MQTT Proxy** — Server now maintains a single MQTT connection to `mqtt.pskreporter.info` instead of each browser opening its own. Spots are buffered per callsign and pushed to clients via Server-Sent Events (SSE) every 10 seconds. Dynamic subscription management: subscribes when first SSE client connects for a callsign, unsubscribes 30s after last client disconnects, disconnects from broker entirely when no clients are active. Exponential backoff on broker disconnects. Health dashboard shows MQTT proxy stats (connected/callsigns/spots/clients). Client `usePSKReporter` hook rewritten to use `EventSource` instead of `mqtt` library — no more direct browser-to-broker connections
 - **GeoIP Country Statistics** — Visitor IPs resolved to country codes via ip-api.com batch endpoint (free, no API key). Results cached persistently across restarts. `/api/health` JSON includes `visitors.today.countries` and `visitors.allTime.countries` (sorted by count). HTML dashboard shows "🌍 Visitor Countries" section with flag emoji badges for today and horizontal bar chart with percentages for all-time data
@@ -170,9 +192,10 @@ All notable changes to OpenHamClock will be documented in this file.
 - **WSJT-X Decode Retention Control** — New time filter dropdown (5m / 15m / 30m / 60m) in the WSJT-X panel header controls how long decoded messages are kept visible in the list and on the map. Default 30 minutes, persisted in localStorage
 
 ### Fixed
+
 - **Weather 429 cascade** — Multiple issues caused weather to disappear for all users: (1) each WeatherPanel called `useWeather()` independently, doubling API calls; now fetched once at App level and passed as `weatherData` prop; (2) no retry on 429 — client waited full 15-min poll; now retries at 15s→30s→60s→120s→300s; (3) `WeatherPanel` returned `null` on error with no feedback; now shows loading/error states
 - **Weather overwhelmed at 2000+ users** — Server was exhausting Open-Meteo's free tier (10K/day) by proxying weather for all users through a single IP. Moved weather to client-direct: each user's browser fetches from Open-Meteo directly, distributing rate limits across all user IPs. Optional API key in Settings for higher limits
-- **WSJT-X decodes not mapping correctly (#299)** — Only 13 of 100 decodes showed map pins because: (1) only CQ messages were mapped — all QSO exchanges (signal reports, RR73, 73, grid exchanges) were filtered out even when a grid square was present; (2) grid regex `^grid$` only matched if the exchange was *nothing but* a grid — messages like `EN82 a7` (grid + signal report) failed; (3) no memory between decodes — once a station's CQ with grid scrolled off, subsequent exchanges from that callsign lost their location. Fix: map ALL decode types with resolved coordinates, extract grids from anywhere in exchange text, maintain a callsign→grid cache across decodes, and fall back to callsign prefix estimation as a last resort. Prefix-estimated locations shown at reduced opacity with *(est)* label in popup
+- **WSJT-X decodes not mapping correctly (#299)** — Only 13 of 100 decodes showed map pins because: (1) only CQ messages were mapped — all QSO exchanges (signal reports, RR73, 73, grid exchanges) were filtered out even when a grid square was present; (2) grid regex `^grid$` only matched if the exchange was _nothing but_ a grid — messages like `EN82 a7` (grid + signal report) failed; (3) no memory between decodes — once a station's CQ with grid scrolled off, subsequent exchanges from that callsign lost their location. Fix: map ALL decode types with resolved coordinates, extract grids from anywhere in exchange text, maintain a callsign→grid cache across decodes, and fall back to callsign prefix estimation as a last resort. Prefix-estimated locations shown at reduced opacity with _(est)_ label in popup
 - **PSKReporter SSE stream stuck at "Connecting"** — Compression middleware was gzip-buffering SSE events; API cache middleware was setting `Cache-Control` on the stream endpoint. Fix: skip compression for `text/event-stream`, skip cache headers for `/stream/` paths, add explicit `res.flush()` after every SSE write, set `Content-Encoding: identity` and `no-transform` headers
 - **"vite: not found" after update (#284)** — `npm install` skips devDependencies when `NODE_ENV=production` is set, leaving `vite` and `vitest` uninstalled. Three fixes: (1) all npm scripts now use `npx vite`/`npx vitest` which auto-resolves from `node_modules/.bin`; (2) `update.sh`, `setup-pi.sh`, and `setup-linux.sh` now use `npm install --include=dev` to force devDependency installation regardless of NODE_ENV; (3) `prestart` build step no longer runs tests — `npm start` just builds and starts, tests are separate via `npm test`
 - **VOACAP heatmap blocks DX click** — Heatmap grid rectangles had `interactive: true` with popup bindings, which consumed map clicks before they could reach the DX-setting handler. Set to `interactive: false` so clicks pass through. The color-coded grid with legend still communicates propagation reliability visually
@@ -180,10 +203,12 @@ All notable changes to OpenHamClock will be documented in this file.
 - **PSK-MQTT "Connection closed" subscribe spam** — When the MQTT broker connection dropped, a race condition caused `pskMqtt.connected` to still be `true` while the socket was dead. Incoming SSE clients would call `subscribeCallsign()`, which passed the connected check but got "Connection closed" callbacks — one error per callsign, flooding the log with 40+ lines. Fix: suppress expected "Connection closed" errors (reconnect handler re-subscribes all callsigns anyway), and batch all reconnect subscriptions into a single MQTT subscribe call instead of individual calls per callsign
 
 ### Removed
+
 - **PSKReporter HTTP backfill** — Removed the `/api/pskreporter/http/:callsign` endpoint and all client-side `fetchHistorical()` code. With 2,000+ concurrent users, every new SSE connection triggered 2 HTTP requests to PSKReporter's retrieve API (TX + RX), causing constant 503 errors and backoff. The backoff was shared with the WSPR heatmap endpoint, so PSK failures were taking WSPR down too. The SSE connected event already delivers up to 500 recent spots from the server's MQTT buffer — no HTTP backfill needed. Net effect: zero HTTP requests to PSKReporter for live spot data, cleaner upstream status on health dashboard
 - **WSPR Heatmap had zero backoff** — PSKReporter 503 responses were ignored; WSPR kept hammering on every 2-min poll. Now shares PSKReporter's exponential backoff via UpstreamManager
 
 ### Changed
+
 - **WSJT-X decode limits** — Server buffer: 200 → 500 decodes. Max age: 30 → 60 minutes. Client ring buffer: 200 → 500. These are the raw limits; the new retention dropdown (5m/15m/30m/60m) controls what the user actually sees
 - **WSPR client polling** — 2 min → 5 min (server caches for 10 min anyway)
 - **PSKReporter backoff** — Replaced fixed-duration backoff (15 min / 1 hr) with exponential backoff: 30s → 60s → 120s → ... capped at 30 min, with 0-15s random jitter to prevent synchronized retry storms
@@ -191,12 +216,14 @@ All notable changes to OpenHamClock will be documented in this file.
 ## [15.1.1] - 2026-02-09
 
 ### Added
+
 - **VOACAP Propagation Heatmap** — New map layer plugin (`voacap-heatmap`) overlays color-coded propagation predictions across the globe for a selected band. Draggable/minimizable control panel with band selector (160m–6m), grid resolution (5°–20°), and color legend. Server-side `/api/propagation/heatmap` endpoint computes reliability grid using ITU-R P.533-style model with live solar indices. 5-minute server cache, 3 world copies for dateline support, click popups with reliability %, distance, and grid coordinates
 - **Propagation Mode & Power** — VOACAP predictions now factor in operating mode and TX power. Eight modes supported (SSB, CW, FT8, FT4, WSPR, JS8, RTTY, PSK31) with physically-modeled decode advantages (+34dB for FT8, +41dB for WSPR vs SSB baseline). Power offset in dB relative to 100W. Signal margin widens/narrows effective MUF/LUF window — FT8 shows bands "open" that SSB shows "closed". Configurable in Settings → Station tab with preset power buttons (5W/25W/100W/1.5kW) + custom watt input. Live margin readout. Applied to both main propagation panel and VOACAP heatmap map layer
 - **Distance Units** — Global metric/imperial toggle in Settings. Affects all distance displays: DE↔DX distance (LocationPanel), propagation path distance, ionosonde distance, satellite altitude & range, great circle path popup, WSPR spot distances & efficiency, VOACAP heatmap cell popups. Default: Imperial (mi)
 - **Custom Terminator** — Replaced CDN-based `L.terminator` with built-in `src/utils/terminator.js` implementation that spans 3 world copies for seamless dateline crossing
 
 ### Fixed
+
 - **Gray line disappearing past dateline** — Replaced `splitAtDateLine()` with `unwrapAndCopyLine()` / `unwrapAndCopyPolygon()` in gray line plugin. All 5 render paths fixed (main terminator, enhanced DX zone, civil/nautical/astronomical twilight)
 - **Sun/moon marker updates** — Now update every 60 seconds instead of only on initial render
 - **DX Cluster frequency format (Classic/Tablet/Compact)** — Frequencies showed `14.1` instead of `14.070` in non-Modern layouts. Fixed `.toFixed(1)` → `.toFixed(3)` and added kHz→MHz conversion for all 3 ClassicLayout DX cluster displays
@@ -204,14 +231,17 @@ All notable changes to OpenHamClock will be documented in this file.
 ## [15.0.2] - 2026-02-08
 
 ### Added
+
 - **Per-panel font sizing (Dockable Mode)** — A−/A+ buttons in each panel's tabset header. 10 zoom steps from 70% to 200%, persisted per-panel in localStorage. Percentage badge shown when zoomed; click to reset. World Map excluded (has its own zoom)
 - **DX News Ticker toggle** — New checkbox in Settings → Map Layers tab to show/hide the scrolling DX news ticker. Persisted in localStorage with other map layer settings
 - **Weather proxy** — New `/api/weather` server endpoint proxies Open-Meteo requests. Coordinates rounded to ~11km grid for cache sharing across users. 15-minute cache, 1-hour stale serving on rate limit/errors. Client debounced (2s) to prevent rapid-fire calls when clicking through DX spots
 
 ### Changed
+
 - **ITU-R P.533 by default** — All installs now use the public OpenHamClock ITURHFProp service (`proppy-production.up.railway.app`) for propagation predictions out of the box. No `.env` configuration needed. Self-hosting still supported via `ITURHFPROP_URL` override
 
 ### Fixed
+
 - **DX Cluster spot clicks** — Clicking a DX cluster spot now updates the DX panel and map. Root cause: `DXClusterPanel` had no `onClick` handler; paths data with coordinates wasn't being looked up. Fixed across Modern, Classic, and Dockable layouts
 - **RBN layer showing N0CALL** — RBN (and all plugin layers) showed "N0CALL" instead of the user's callsign. Root cause: `WorldMap` wasn't passing `callsign`, `locator`, or `lowMemoryMode` to `PluginLayer`. Also fixed 4 of 6 `WorldMap` instances across layouts that were missing the `callsign` prop entirely
 - **Update button fails with "Local changes detected"** — `git status --porcelain` blocked updates when file permissions changed (e.g., `chmod +x update.sh`) or on cross-platform mode differences. Fix: `git config core.fileMode false` set at server startup, in setup scripts, and in `update.sh`. Auto-update now stashes local changes before pulling instead of refusing
@@ -227,6 +257,7 @@ All notable changes to OpenHamClock will be documented in this file.
 ## [15.0.0] - 2026-02-08
 
 ### Added
+
 - **N0NBH Band Conditions** — Real-time band condition data from N0NBH's NOAA-sourced feed replaces the old calculated estimates. Server-side `/api/n0nbh` endpoint with 1-hour caching. Day/night conditions per band, VHF conditions (Aurora, E-skip by region), geomagnetic field status, signal noise level, and MUF. PropagationPanel shows mini day/night indicators when conditions differ between day and night
 - **User Profiles** — Save and load named configuration profiles from Settings → Profiles tab. Each profile snapshots all localStorage keys (config, layout, filters, map layers, preferences). Supports save, load, rename, delete, export to JSON file, and import from file. Useful for multi-operator shared stations or switching between personal views (contest mode, field day, everyday)
 - **Concurrent User Tracking** — Health dashboard (`/api/health`) now shows real-time concurrent users, peak concurrent count, session duration analytics (avg/median/p90/max), duration distribution buckets, and an active users table with anonymized IPs and session durations
@@ -236,6 +267,7 @@ All notable changes to OpenHamClock will be documented in this file.
 - **Space Weather Extras** — Header shows A-index (color-coded: green <10, amber 10-19, red ≥20) and geomagnetic field status from N0NBH data
 
 ### Changed
+
 - **Band Conditions Rewrite** — `useBandConditions` hook completely rewritten. Removed 200+ lines of local SFI/K-index formula calculations. Now fetches from `/api/n0nbh` server proxy and maps N0NBH grouped ranges (80m-40m, 30m-20m, etc.) to individual bands
 - **Health Dashboard Auto-Refresh** — HTML health dashboard now auto-refreshes every 30 seconds
 - **Stats Grid** — Health dashboard shows 6 stat cards (added Online Now and Peak Concurrent)
@@ -244,11 +276,13 @@ All notable changes to OpenHamClock will be documented in this file.
 - **Version** — Bumped to 15.0.0
 
 ### Fixed
+
 - **CI Health Check Failure** — `npm start` was running `prestart` (full rebuild) before starting the server, causing the 5-second `sleep` + `curl` to fail every time. Now uses `node server.js` directly since the build step already ran
 
 ## [3.12.0] - 2025-02-03
 
 ### Added
+
 - **State persistence** — All user preferences survive page refresh: PSK/WSJT-X panel mode, TX/RX tab, solar image wavelength, weather panel expanded state, temperature unit
 - **Collapsible weather** — DE location weather section collapses to one-line summary, expands for full details
 - **Lunar phase display** — 4th cycling mode in Solar panel shows current moon phase with SVG rendering, illumination %, and next full/new moon dates
@@ -260,6 +294,7 @@ All notable changes to OpenHamClock will be documented in this file.
 - **WSPR data quality** — Spot limit increased from 2,000 to 10,000, detailed marker tooltips with power/SNR/distance/efficiency
 
 ### Fixed
+
 - **PSKReporter MQTT** — Field mapping used `sa`/`ra` (ADIF country codes) instead of `sc`/`rc` (callsigns), so no MQTT spots ever matched
 - **PSKReporter RX topic** — Subscription pattern had one extra wildcard
 - **PSKReporter HTTP fallback** — If MQTT fails within 12 seconds, automatically falls back to HTTP API
@@ -273,19 +308,23 @@ All notable changes to OpenHamClock will be documented in this file.
 - **VOACAP ionosonde label** — Added "Iono:" prefix to clarify it's the data source, not the DX location
 
 ### Changed
+
 - **WSPR update frequency** — Polling interval from 5 minutes to 60 seconds
 - **WSPR band chart** — Removed pulsing animation, added smooth CSS transition
 
 ### Reverted
+
 - **WSPR MQTT** — Real-time MQTT feed attempted and reverted due to mixed content policy (HTTPS pages cannot connect to insecure WebSocket)
 
 ## [3.11.0] - 2025-02-02
 
 ### Added
+
 - **PSKReporter Integration** — New panel showing stations hearing you (TX) and stations you're hearing (RX). Supports FT8, FT4, JS8, and other digital modes. Configurable time window. Signal paths drawn on map
 - **Bandwidth Optimization** — Reduced network egress by ~85%: GZIP compression, server-side caching, reduced polling intervals, HTTP Cache-Control headers
 
 ### Fixed
+
 - Empty ITURHFPROP_URL causing "Only absolute URLs supported" error
 - Satellite TLE fetch timeout errors handled silently
 - Reduced console log spam for network errors
@@ -293,6 +332,7 @@ All notable changes to OpenHamClock will be documented in this file.
 ## [3.10.0] - 2025-02-02
 
 ### Added
+
 - **Environment-based configuration** — `.env` file auto-created from `.env.example` on first run. Supports CALLSIGN, LOCATOR, PORT, HOST, UNITS, TIME_FORMAT, THEME, LAYOUT
 - **Auto-build on start** — `npm start` automatically builds React frontend
 - **Update script** — `./scripts/update.sh` for easy local/Pi updates
@@ -303,10 +343,12 @@ All notable changes to OpenHamClock will be documented in this file.
 - **Classic layout** — Original HamClock-style with black background and large colored numbers
 
 ### Changed
+
 - Configuration priority: localStorage > .env > defaults
 - DX Spider connection uses dxspider.co.uk as primary
 
 ### Fixed
+
 - Header clock "shaking" when digits change
 - Header layout wrapping on smaller screens
 - Reduced log spam with rate-limited error logging
@@ -314,6 +356,7 @@ All notable changes to OpenHamClock will be documented in this file.
 ## [3.9.0] - 2025-01-31
 
 ### Added
+
 - DX Filter modal with tabs for Zones, Bands, Modes, Watchlist, Exclude
 - Spot retention time configurable (5-30 minutes) in Settings
 - Satellite tracking with 40+ amateur radio satellites
@@ -321,6 +364,7 @@ All notable changes to OpenHamClock will be documented in this file.
 - Map legend showing all 10 HF bands plus DE/DX/Sun/Moon markers
 
 ### Fixed
+
 - DX Filter modal crash when opening
 - K-Index display showing correct values
 - Contest calendar attribution
@@ -328,6 +372,7 @@ All notable changes to OpenHamClock will be documented in this file.
 ## [3.8.0] - 2025-01-28
 
 ### Added
+
 - Multiple DX cluster source fallbacks
 - ITURHFProp hybrid propagation predictions
 - Ionosonde real-time corrections
@@ -335,17 +380,20 @@ All notable changes to OpenHamClock will be documented in this file.
 ## [3.7.0] - 2025-01-25
 
 ### Added
+
 - Modular React architecture with Vite
 - 13 extracted components, 12 custom hooks, 3 utility modules
 - Railway deployment support
 - Docker support
 
 ### Changed
+
 - Complete rewrite from monolithic HTML to modular React
 
 ## [3.0.0] - 2025-01-15
 
 ### Added
+
 - Initial modular extraction from monolithic codebase
 - React + Vite build system
 - Express backend for API proxying
diff --git a/CODE_OF_CONDUCT.md b/CODE_OF_CONDUCT.md
index 525a571d..888f4181 100644
--- a/CODE_OF_CONDUCT.md
+++ b/CODE_OF_CONDUCT.md
@@ -8,20 +8,20 @@ In the spirit of amateur radio's long tradition of courtesy, we as contributors
 
 Examples of behavior that contributes to creating a positive environment include:
 
-* Using welcoming and inclusive language
-* Being respectful of differing viewpoints and experiences
-* Gracefully accepting constructive criticism
-* Focusing on what is best for the community
-* Showing empathy towards other community members
-* Following amateur radio's tradition of courtesy and helpfulness
+- Using welcoming and inclusive language
+- Being respectful of differing viewpoints and experiences
+- Gracefully accepting constructive criticism
+- Focusing on what is best for the community
+- Showing empathy towards other community members
+- Following amateur radio's tradition of courtesy and helpfulness
 
 Examples of unacceptable behavior include:
 
-* The use of sexualized language or imagery and unwelcome sexual attention or advances
-* Trolling, insulting/derogatory comments, and personal or political attacks
-* Public or private harassment
-* Publishing others' private information without explicit permission
-* Other conduct which could reasonably be considered inappropriate
+- The use of sexualized language or imagery and unwelcome sexual attention or advances
+- Trolling, insulting/derogatory comments, and personal or political attacks
+- Public or private harassment
+- Publishing others' private information without explicit permission
+- Other conduct which could reasonably be considered inappropriate
 
 ## Our Responsibilities
 
diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index 6a1f7ba4..b01e86eb 100644
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -63,7 +63,7 @@ Full architecture details: **[docs/ARCHITECTURE.md](docs/ARCHITECTURE.md)**
 ### Requesting Features
 
 1. Open an issue using the **Feature Request** template
-2. Describe the use case — *why* is this useful for operators?
+2. Describe the use case — _why_ is this useful for operators?
 3. Mockups and screenshots are welcome
 
 ### Claiming a Bug or Issue
@@ -130,7 +130,7 @@ export const MyPanel = ({ data, loading, onSpotClick }) => {
 
   return (
     <div style={{ color: 'var(--text-primary)' }}>
-      {data.map(item => (
+      {data.map((item) => (
         <div key={item.id} onClick={() => onSpotClick?.(item)}>
           {item.callsign} — {item.freq}
         </div>
@@ -218,16 +218,17 @@ npm run dev
 ## 🎨 CSS & Theming
 
 Use CSS variables for all colors:
+
 ```js
 let myCache = { data: null, timestamp: 0 };
 const MY_TTL = 5 * 60 * 1000;
 
 app.get('/api/mydata', async (req, res) => {
   const now = Date.now();
-  if (myCache.data && (now - myCache.timestamp) < MY_TTL) {
+  if (myCache.data && now - myCache.timestamp < MY_TTL) {
     return res.json(myCache.data);
   }
-  const data = await fetch('https://api.example.com/data').then(r => r.json());
+  const data = await fetch('https://api.example.com/data').then((r) => r.json());
   myCache = { data, timestamp: now };
   res.json(data);
 });
@@ -249,7 +250,9 @@ export const useLayer = ({ map, enabled, config }) => {
   useEffect(() => {
     if (!map || !enabled) return;
     // Add your Leaflet layers here
-    return () => { /* cleanup */ };
+    return () => {
+      /* cleanup */
+    };
   }, [map, enabled]);
 };
 ```
diff --git a/README.md b/README.md
index 7c2087ae..776c225a 100644
--- a/README.md
+++ b/README.md
@@ -163,12 +163,12 @@ All filter settings are saved to your browser's localStorage and persist across
 
 **DX cluster source options (configurable in Settings → DX Cluster tab or in .env):**
 
-| Source | Description |
-|--------|-------------|
+| Source                        | Description                                                                                                      |
+| ----------------------------- | ---------------------------------------------------------------------------------------------------------------- |
 | **DX Spider Proxy** (default) | Persistent telnet connection to the DX Spider network via a proxy microservice. Most reliable, best spot volume. |
-| **HamQTH** | Spots from HamQTH's DX cluster HTTP feed. No telnet required. |
-| **DXWatch** | Spots from the DXWatch cluster. |
-| **Auto** | Tries all sources in order and uses the first one that responds. |
+| **HamQTH**                    | Spots from HamQTH's DX cluster HTTP feed. No telnet required.                                                    |
+| **DXWatch**                   | Spots from the DXWatch cluster.                                                                                  |
+| **Auto**                      | Tries all sources in order and uses the first one that responds.                                                 |
 
 **Spot retention:** Spots remain in the list for 30 minutes by default. Change this via the `SPOT_RETENTION_MINUTES` variable in `.env` (range: 5–30 minutes) or in the DX Filter Manager settings tab.
 
@@ -333,11 +333,13 @@ Real-time HF and VHF band conditions from the N0NBH solar conditions feed, sourc
 **What it shows:**
 
 Each HF band from 80m through 10m with day and night condition indicators:
+
 - **Green (GOOD)** — Band is open with good propagation. Get on the air!
 - **Amber (FAIR)** — Band may be usable but conditions are degraded.
 - **Red (POOR)** — Band is not supporting propagation.
 
 Additional information in the panel:
+
 - **Day/night indicator** — Shows current conditions with a ☀/☾ marker, plus mini indicators when day and night conditions differ
 - **VHF conditions** — Aurora and E-skip status by region (Europe, North America) with green/gray color coding
 - **Footer stats** — SFI, K-index, geomagnetic field status (color-coded: green=QUIET, amber=UNSETTLED, red=ACTIVE/STORM), signal noise level
@@ -477,6 +479,7 @@ Current weather conditions at your station location, displayed in the header bar
 - Weather description icon and temperature in both °F and °C
 
 **Below the DE and optionally DX Location panel:**
+
 - Temperature in either °F or °C with a toggle to select which one (note that the toggle affects both the DE and DX temperature display)
 - Weather description (clear, cloudy, rain, snow, etc.) with an emoji icon
 - Humidity and wind speed
@@ -561,12 +564,12 @@ A classic analog clock display showing local time with additional station inform
 
 Four visual themes, selectable in Settings or via `THEME` in `.env`:
 
-| Theme | Description |
-|-------|-------------|
-| **Dark** | Modern dark interface with amber and cyan accents on a charcoal background. Easy on the eyes for late-night operating. This is the default. |
-| **Light** | Light background with darker text. Best for daytime use or brightly lit environments where a dark screen causes too much contrast. |
-| **Legacy** | Classic green-on-black terminal aesthetic reminiscent of vintage station monitors. Monochrome green text with a true-black background. |
-| **Retro** | 90s-era GUI style with teal backgrounds, silver beveled panels, and shadow effects. A nostalgic throwback to early Windows and OS/2 interfaces. |
+| Theme      | Description                                                                                                                                     |
+| ---------- | ----------------------------------------------------------------------------------------------------------------------------------------------- |
+| **Dark**   | Modern dark interface with amber and cyan accents on a charcoal background. Easy on the eyes for late-night operating. This is the default.     |
+| **Light**  | Light background with darker text. Best for daytime use or brightly lit environments where a dark screen causes too much contrast.              |
+| **Legacy** | Classic green-on-black terminal aesthetic reminiscent of vintage station monitors. Monochrome green text with a true-black background.          |
+| **Retro**  | 90s-era GUI style with teal backgrounds, silver beveled panels, and shadow effects. A nostalgic throwback to early Windows and OS/2 interfaces. |
 
 All themes use CSS custom properties defined in `src/styles/main.css`. To create your own theme, add a new set of CSS variables following the existing pattern.
 
@@ -574,9 +577,9 @@ All themes use CSS custom properties defined in `src/styles/main.css`. To create
 
 Two layout modes, selectable in Settings or via `LAYOUT` in `.env`:
 
-| Layout | Description |
-|--------|-------------|
-| **Modern** | Responsive 3-column grid layout. The map fills the center column, with sidebar panels on the left and right. Designed for widescreen monitors (1920×1080 and above). Panels reflow on smaller screens. |
+| Layout      | Description                                                                                                                                                                                                                                                           |
+| ----------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| **Modern**  | Responsive 3-column grid layout. The map fills the center column, with sidebar panels on the left and right. Designed for widescreen monitors (1920×1080 and above). Panels reflow on smaller screens.                                                                |
 | **Classic** | Inspired by the original HamClock by Elwood Downey, WB0OEW (SK). Features a black background, large colored numeric displays for callsign and frequency, a rainbow frequency bar, and a full-width map. Optimized for dedicated displays and Raspberry Pi kiosk mode. |
 
 ---
@@ -587,11 +590,11 @@ OpenHamClock has a plugin system for adding custom map overlays without modifyin
 
 **Built-in plugins:**
 
-| Layer | Description |
-|-------|-------------|
-| **Aurora** | Real-time auroral oval overlay from the NOAA OVATION model. Shows the current extent of the aurora borealis/australis. Useful for VHF operators (aurora can enable 2m and 6m contacts) and HF operators (aurora degrades polar HF paths). |
-| **Earthquakes** | Recent seismic activity markers from USGS. Large earthquakes can temporarily affect HF propagation through atmospheric acoustic-gravity waves. |
-| **Weather Radar** | Precipitation overlay showing rain, snow, and storms. |
+| Layer             | Description                                                                                                                                                                                                                               |
+| ----------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| **Aurora**        | Real-time auroral oval overlay from the NOAA OVATION model. Shows the current extent of the aurora borealis/australis. Useful for VHF operators (aurora can enable 2m and 6m contacts) and HF operators (aurora degrades polar HF paths). |
+| **Earthquakes**   | Recent seismic activity markers from USGS. Large earthquakes can temporarily affect HF propagation through atmospheric acoustic-gravity waves.                                                                                            |
+| **Weather Radar** | Precipitation overlay showing rain, snow, and storms.                                                                                                                                                                                     |
 
 **How to enable/disable layers:**
 
@@ -632,6 +635,7 @@ Save and switch between named configuration profiles. Useful when multiple opera
 6. To share a profile or move it between devices, click **⤓** (export) to download a JSON file, then use **Import Profile from File** on the other device
 
 **Profile actions:**
+
 - **▶ Load** — Restores the profile and reloads the page
 - **↻ Update** — Overwrites the saved profile with your current live state
 - **✎ Rename** — Inline rename
@@ -655,6 +659,7 @@ When the server is updated with a new version (e.g., via `git pull` + restart, o
 Visit `/api/health` in your browser for a real-time server status dashboard. The page auto-refreshes every 30 seconds.
 
 **What it shows:**
+
 - **Online Now** — Real-time concurrent user count (sessions expire after 5 minutes of inactivity)
 - **Peak Concurrent** — Highest simultaneous users since last restart
 - **Visitors Today / All-Time** — Unique IP counts with daily average
@@ -674,6 +679,7 @@ Visitor stats persist across restarts via file-based storage. Configure the stor
 All configuration is done through the `.env` file. On first run, this file is auto-created from `.env.example`. You can also change most settings through the browser-based Settings panel.
 
 > **Can't find the `.env` file?** Files starting with a dot are hidden by default on Linux, Mac, and Raspberry Pi.
+>
 > - **Terminal:** `ls -la` to see hidden files, or `nano .env` to edit directly
 > - **File manager (Pi/Linux):** Press `Ctrl+H` to toggle hidden files
 > - **Mac Finder:** Press `Cmd+Shift+.` to toggle hidden files
@@ -683,63 +689,63 @@ All configuration is done through the `.env` file. On first run, this file is au
 
 ### Station Settings
 
-| Variable | Default | Description |
-|----------|---------|-------------|
-| `CALLSIGN` | `N0CALL` | Your amateur radio callsign. This is shown in the header bar and used for DX cluster login, PSKReporter queries, and "My Spots" tracking. |
-| `LOCATOR` | `FN31` | Your Maidenhead grid locator (4 or 6 characters). Used to calculate your station coordinates if LATITUDE/LONGITUDE aren't set. |
-| `LATITUDE` | *(from locator)* | Station latitude in decimal degrees. Overrides the latitude calculated from LOCATOR. |
-| `LONGITUDE` | *(from locator)* | Station longitude in decimal degrees. Overrides the longitude calculated from LOCATOR. |
+| Variable    | Default          | Description                                                                                                                               |
+| ----------- | ---------------- | ----------------------------------------------------------------------------------------------------------------------------------------- |
+| `CALLSIGN`  | `N0CALL`         | Your amateur radio callsign. This is shown in the header bar and used for DX cluster login, PSKReporter queries, and "My Spots" tracking. |
+| `LOCATOR`   | `FN31`           | Your Maidenhead grid locator (4 or 6 characters). Used to calculate your station coordinates if LATITUDE/LONGITUDE aren't set.            |
+| `LATITUDE`  | _(from locator)_ | Station latitude in decimal degrees. Overrides the latitude calculated from LOCATOR.                                                      |
+| `LONGITUDE` | _(from locator)_ | Station longitude in decimal degrees. Overrides the longitude calculated from LOCATOR.                                                    |
 
 ### Server Settings
 
-| Variable | Default | Description |
-|----------|---------|-------------|
-| `PORT` | `3001` | Backend API server port. In development, the Vite frontend runs on 3000 and proxies /api to this port. |
-| `HOST` | `localhost` | Bind address. Set to `0.0.0.0` to make OpenHamClock accessible from other devices on your LAN (tablets, phones, other PCs). |
-| `LOG_LEVEL` | `warn` | Server log verbosity: `debug` (everything), `info` (operational), `warn` (problems), `error` (failures only). Use `warn` for production. |
+| Variable    | Default     | Description                                                                                                                              |
+| ----------- | ----------- | ---------------------------------------------------------------------------------------------------------------------------------------- |
+| `PORT`      | `3001`      | Backend API server port. In development, the Vite frontend runs on 3000 and proxies /api to this port.                                   |
+| `HOST`      | `localhost` | Bind address. Set to `0.0.0.0` to make OpenHamClock accessible from other devices on your LAN (tablets, phones, other PCs).              |
+| `LOG_LEVEL` | `warn`      | Server log verbosity: `debug` (everything), `info` (operational), `warn` (problems), `error` (failures only). Use `warn` for production. |
 
 ### Display Preferences
 
-| Variable | Default | Description |
-|----------|---------|-------------|
-| `UNITS` | `imperial` | `imperial` (°F, miles) or `metric` (°C, km). Affects weather display and distance calculations. |
-| `TIME_FORMAT` | `12` | `12` or `24` hour clock format. Can also be toggled by clicking the local clock in the header. |
-| `THEME` | `dark` | `dark`, `light`, `legacy`, or `retro`. See [Themes and Layouts](#themes-and-layouts). |
-| `LAYOUT` | `modern` | `modern` or `classic`. See [Themes and Layouts](#themes-and-layouts). |
-| `TZ` | *(browser)* | IANA timezone identifier (e.g., `America/New_York`, `Europe/London`). Only needed if your browser spoofs the timezone (common with privacy browsers like Librewolf). |
+| Variable      | Default     | Description                                                                                                                                                          |
+| ------------- | ----------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `UNITS`       | `imperial`  | `imperial` (°F, miles) or `metric` (°C, km). Affects weather display and distance calculations.                                                                      |
+| `TIME_FORMAT` | `12`        | `12` or `24` hour clock format. Can also be toggled by clicking the local clock in the header.                                                                       |
+| `THEME`       | `dark`      | `dark`, `light`, `legacy`, or `retro`. See [Themes and Layouts](#themes-and-layouts).                                                                                |
+| `LAYOUT`      | `modern`    | `modern` or `classic`. See [Themes and Layouts](#themes-and-layouts).                                                                                                |
+| `TZ`          | _(browser)_ | IANA timezone identifier (e.g., `America/New_York`, `Europe/London`). Only needed if your browser spoofs the timezone (common with privacy browsers like Librewolf). |
 
 ### Feature Toggles
 
-| Variable | Default | Description |
-|----------|---------|-------------|
-| `SHOW_POTA` | `true` | Show POTA activator markers on the map. |
-| `SHOW_SATELLITES` | `true` | Show satellite tracks on the map. |
-| `SHOW_DX_PATHS` | `true` | Show great-circle DX signal paths on the map. |
-| `SHOW_DX_WEATHER` | `true` | Show weather for the selected DX location. |
+| Variable               | Default | Description                                                                         |
+| ---------------------- | ------- | ----------------------------------------------------------------------------------- |
+| `SHOW_POTA`            | `true`  | Show POTA activator markers on the map.                                             |
+| `SHOW_SATELLITES`      | `true`  | Show satellite tracks on the map.                                                   |
+| `SHOW_DX_PATHS`        | `true`  | Show great-circle DX signal paths on the map.                                       |
+| `SHOW_DX_WEATHER`      | `true`  | Show weather for the selected DX location.                                          |
 | `CLASSIC_ANALOG_CLOCK` | `false` | Show analog clock panel in the classic layout. Always available in dockable layout. |
 
 ### External Services
 
-| Variable | Default | Description |
-|----------|---------|-------------|
-| `OPENWEATHER_API_KEY` | *(none)* | OpenWeatherMap API key. Only needed for the **Cloud Layer** map overlay — weather data uses Open-Meteo directly from each user's browser with no key. Get a free key at [openweathermap.org/api](https://openweathermap.org/api). Also set `VITE_OPENWEATHER_API_KEY` to the same value. |
-| `ITURHFPROP_URL` | Public service | URL for ITU-R P.533 propagation predictions. Defaults to the public OpenHamClock service. Override only if self-hosting the `iturhfprop-service/`. |
-| `DXSPIDER_PROXY_URL` | *(none)* | URL of your DX Spider proxy. A default proxy is provided, so you only need this if you're running your own. |
+| Variable              | Default        | Description                                                                                                                                                                                                                                                                              |
+| --------------------- | -------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `OPENWEATHER_API_KEY` | _(none)_       | OpenWeatherMap API key. Only needed for the **Cloud Layer** map overlay — weather data uses Open-Meteo directly from each user's browser with no key. Get a free key at [openweathermap.org/api](https://openweathermap.org/api). Also set `VITE_OPENWEATHER_API_KEY` to the same value. |
+| `ITURHFPROP_URL`      | Public service | URL for ITU-R P.533 propagation predictions. Defaults to the public OpenHamClock service. Override only if self-hosting the `iturhfprop-service/`.                                                                                                                                       |
+| `DXSPIDER_PROXY_URL`  | _(none)_       | URL of your DX Spider proxy. A default proxy is provided, so you only need this if you're running your own.                                                                                                                                                                              |
 
 ### WSJT-X Integration
 
-| Variable | Default | Description |
-|----------|---------|-------------|
-| `WSJTX_ENABLED` | `true` | Enable the WSJT-X UDP listener on the server. |
-| `WSJTX_UDP_PORT` | `2237` | UDP port for receiving WSJT-X decoded messages. Must match the port configured in WSJT-X Settings → Reporting → UDP Server. |
-| `WSJTX_RELAY_KEY` | *(none)* | Shared secret key for the WSJT-X relay agent. Required only for cloud deployments where WSJT-X can't reach the server directly over UDP. Pick any strong random string. |
+| Variable          | Default  | Description                                                                                                                                                             |
+| ----------------- | -------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `WSJTX_ENABLED`   | `true`   | Enable the WSJT-X UDP listener on the server.                                                                                                                           |
+| `WSJTX_UDP_PORT`  | `2237`   | UDP port for receiving WSJT-X decoded messages. Must match the port configured in WSJT-X Settings → Reporting → UDP Server.                                             |
+| `WSJTX_RELAY_KEY` | _(none)_ | Shared secret key for the WSJT-X relay agent. Required only for cloud deployments where WSJT-X can't reach the server directly over UDP. Pick any strong random string. |
 
 ### DX Cluster
 
-| Variable | Default | Description |
-|----------|---------|-------------|
-| `DX_CLUSTER_CALLSIGN` | *(CALLSIGN-56)* | Callsign used for DX cluster login. Defaults to your callsign with SSID suffix -56. Use -57 for a staging/test instance to avoid conflicts. |
-| `SPOT_RETENTION_MINUTES` | `30` | How long DX spots stay in the list before aging out. Range: 5–30 minutes. |
+| Variable                 | Default         | Description                                                                                                                                 |
+| ------------------------ | --------------- | ------------------------------------------------------------------------------------------------------------------------------------------- |
+| `DX_CLUSTER_CALLSIGN`    | _(CALLSIGN-56)_ | Callsign used for DX cluster login. Defaults to your callsign with SSID suffix -56. Use -57 for a staging/test instance to avoid conflicts. |
+| `SPOT_RETENTION_MINUTES` | `30`            | How long DX spots stay in the list before aging out. Range: 5–30 minutes.                                                                   |
 
 ### Configuration Priority
 
@@ -854,13 +860,13 @@ railway up
 
 **Environment variables to set in Railway's dashboard:**
 
-| Variable | Value | Notes |
-|----------|-------|-------|
-| `CALLSIGN` | Your callsign | Required |
-| `LOCATOR` | Your grid | Required |
-| `HOST` | `0.0.0.0` | Required for Railway |
-| `LOG_LEVEL` | `warn` | Recommended to stay under Railway's 500 logs/sec limit |
-| `WSJTX_RELAY_KEY` | *(random string)* | Only if using the WSJT-X relay agent |
+| Variable          | Value             | Notes                                                  |
+| ----------------- | ----------------- | ------------------------------------------------------ |
+| `CALLSIGN`        | Your callsign     | Required                                               |
+| `LOCATOR`         | Your grid         | Required                                               |
+| `HOST`            | `0.0.0.0`         | Required for Railway                                   |
+| `LOG_LEVEL`       | `warn`            | Recommended to stay under Railway's 500 logs/sec limit |
+| `WSJTX_RELAY_KEY` | _(random string)_ | Only if using the WSJT-X relay agent                   |
 
 **Cost:** Railway's free tier is usually sufficient for a single-user instance.
 
@@ -907,17 +913,20 @@ The relay agent (`wsjtx-relay/relay.js`) bridges WSJT-X on your local machine to
 **Setup:**
 
 1. On your server (or Railway dashboard), set `WSJTX_RELAY_KEY` to any strong random string:
+
    ```
    WSJTX_RELAY_KEY=my-super-secret-relay-key-2024
    ```
 
 2. On your local machine (where WSJT-X runs), start the relay:
+
    ```bash
    cd wsjtx-relay
    node relay.js --url https://openhamclock.com --key my-super-secret-relay-key-2024
    ```
 
    Or with environment variables:
+
    ```bash
    OPENHAMCLOCK_URL=https://openhamclock.com RELAY_KEY=my-super-secret-relay-key-2024 node relay.js
    ```
@@ -1084,40 +1093,40 @@ PSKReporter MQTT ──────────────► React ──► P
 
 The backend exposes these REST endpoints. All data endpoints return JSON. Cache durations shown are server-side; the frontend may poll at different intervals.
 
-| Endpoint | Description | Cache |
-|----------|-------------|-------|
-| `GET /api/config` | Server configuration (callsign, location, features, version) | — |
-| `GET /api/version` | Lightweight version check (for auto-refresh polling) | no-cache |
-| `GET /api/health` | Health dashboard with uptime, visitors, concurrent users, session analytics, API traffic | — |
-| `GET /api/n0nbh` | N0NBH band conditions (SFI, K, bands, VHF, geomag, signal noise, MUF) | 1 hr |
-| *(weather)* | Weather is fetched directly from Open-Meteo by each user's browser — no server endpoint needed | — |
-| `GET /api/dxcluster/spots` | Current DX cluster spots (array of spot objects) | 5 sec |
-| `GET /api/dxcluster/paths` | DX spots with resolved coordinates for map display | 5 sec |
-| `GET /api/dxcluster/sources` | Available DX cluster source backends | — |
-| `GET /api/solar-indices` | SFI, Kp, SSN with 30-day history arrays | 15 min |
-| `GET /api/noaa/flux` | Raw 10.7 cm solar flux from NOAA | 15 min |
-| `GET /api/noaa/kindex` | Raw planetary K-index from NOAA | 15 min |
-| `GET /api/noaa/sunspots` | Raw sunspot number from NOAA | 15 min |
-| `GET /api/noaa/xray` | GOES X-ray flux (6-hour dataset) | 15 min |
-| `GET /api/noaa/aurora` | Aurora oval boundary data from OVATION model | 15 min |
-| `GET /api/hamqsl/conditions` | HamQSL band conditions XML (parsed to JSON) | 30 min |
-| `GET /api/propagation` | HF propagation predictions (per-band reliability %) | 10 min |
-| `GET /api/pota/spots` | POTA activator spots from api.pota.app | 1 min |
-| `GET /api/wwff/spots` | WWFF activator spots from spots.wwff.co | 90 sec |
-| `GET /api/sota/spots` | SOTA activator spots from api2.sota.org.uk | 2 min |
-| `GET /api/satellites/tle` | Satellite TLE data from CelesTrak | 6 hr |
-| `GET /api/contests` | Contest calendar from contestcalendar.com | 30 min |
-| `GET /api/dxpeditions` | Active DXpeditions from NG3K | 30 min |
-| `GET /api/dxnews` | DX news headlines from DXNews.com | 30 min |
-| `GET /api/callsign/:call` | Callsign lookup (DXCC entity, grid, country, continent) | — |
-| `GET /api/myspots/:callsign` | Recent spots of a specific callsign | 30 sec |
-| `GET /api/ionosonde` | Ionospheric sounding data from prop.kc2g.com | 5 min |
-| `GET /api/pskreporter/config` | PSKReporter MQTT connection configuration | — |
-| `GET /api/pskreporter/http/:call` | PSKReporter HTTP API fallback | 2 min |
-| `GET /api/wsjtx` | WSJT-X connection status and active client list | — |
-| `GET /api/wsjtx/decodes` | WSJT-X decoded messages (latest batch) | — |
-| `POST /api/wsjtx/relay` | WSJT-X relay agent data ingest endpoint | — |
-| `GET /api/qrz/lookup/:callsign` | QRZ.com callsign lookup | — |
+| Endpoint                          | Description                                                                                    | Cache    |
+| --------------------------------- | ---------------------------------------------------------------------------------------------- | -------- |
+| `GET /api/config`                 | Server configuration (callsign, location, features, version)                                   | —        |
+| `GET /api/version`                | Lightweight version check (for auto-refresh polling)                                           | no-cache |
+| `GET /api/health`                 | Health dashboard with uptime, visitors, concurrent users, session analytics, API traffic       | —        |
+| `GET /api/n0nbh`                  | N0NBH band conditions (SFI, K, bands, VHF, geomag, signal noise, MUF)                          | 1 hr     |
+| _(weather)_                       | Weather is fetched directly from Open-Meteo by each user's browser — no server endpoint needed | —        |
+| `GET /api/dxcluster/spots`        | Current DX cluster spots (array of spot objects)                                               | 5 sec    |
+| `GET /api/dxcluster/paths`        | DX spots with resolved coordinates for map display                                             | 5 sec    |
+| `GET /api/dxcluster/sources`      | Available DX cluster source backends                                                           | —        |
+| `GET /api/solar-indices`          | SFI, Kp, SSN with 30-day history arrays                                                        | 15 min   |
+| `GET /api/noaa/flux`              | Raw 10.7 cm solar flux from NOAA                                                               | 15 min   |
+| `GET /api/noaa/kindex`            | Raw planetary K-index from NOAA                                                                | 15 min   |
+| `GET /api/noaa/sunspots`          | Raw sunspot number from NOAA                                                                   | 15 min   |
+| `GET /api/noaa/xray`              | GOES X-ray flux (6-hour dataset)                                                               | 15 min   |
+| `GET /api/noaa/aurora`            | Aurora oval boundary data from OVATION model                                                   | 15 min   |
+| `GET /api/hamqsl/conditions`      | HamQSL band conditions XML (parsed to JSON)                                                    | 30 min   |
+| `GET /api/propagation`            | HF propagation predictions (per-band reliability %)                                            | 10 min   |
+| `GET /api/pota/spots`             | POTA activator spots from api.pota.app                                                         | 1 min    |
+| `GET /api/wwff/spots`             | WWFF activator spots from spots.wwff.co                                                        | 90 sec   |
+| `GET /api/sota/spots`             | SOTA activator spots from api2.sota.org.uk                                                     | 2 min    |
+| `GET /api/satellites/tle`         | Satellite TLE data from CelesTrak                                                              | 6 hr     |
+| `GET /api/contests`               | Contest calendar from contestcalendar.com                                                      | 30 min   |
+| `GET /api/dxpeditions`            | Active DXpeditions from NG3K                                                                   | 30 min   |
+| `GET /api/dxnews`                 | DX news headlines from DXNews.com                                                              | 30 min   |
+| `GET /api/callsign/:call`         | Callsign lookup (DXCC entity, grid, country, continent)                                        | —        |
+| `GET /api/myspots/:callsign`      | Recent spots of a specific callsign                                                            | 30 sec   |
+| `GET /api/ionosonde`              | Ionospheric sounding data from prop.kc2g.com                                                   | 5 min    |
+| `GET /api/pskreporter/config`     | PSKReporter MQTT connection configuration                                                      | —        |
+| `GET /api/pskreporter/http/:call` | PSKReporter HTTP API fallback                                                                  | 2 min    |
+| `GET /api/wsjtx`                  | WSJT-X connection status and active client list                                                | —        |
+| `GET /api/wsjtx/decodes`          | WSJT-X decoded messages (latest batch)                                                         | —        |
+| `POST /api/wsjtx/relay`           | WSJT-X relay agent data ingest endpoint                                                        | —        |
+| `GET /api/qrz/lookup/:callsign`   | QRZ.com callsign lookup                                                                        | —        |
 
 ---
 
@@ -1172,11 +1181,13 @@ npm run dev      # Terminal 2 — Frontend on :3000
 ```
 
 **Read first:**
+
 - **[docs/ARCHITECTURE.md](docs/ARCHITECTURE.md)** — Full codebase map and key patterns
 - **[CONTRIBUTING.md](CONTRIBUTING.md)** — Dev setup, code guidelines, testing checklist, PR workflow
 - **[src/plugins/OpenHamClock-Plugin-Guide.md](src/plugins/OpenHamClock-Plugin-Guide.md)** — Map layer plugin API
 
 **Community:**
+
 - [GitHub Issues](https://github.com/accius/openhamclock/issues) — Bug reports and feature requests
 - [Facebook Group](https://www.facebook.com/groups/1217043013897440) — Discussion and help
 - [Reddit r/OpenHamClock](https://www.reddit.com/r/OpenHamClock/) — Community discussion
diff --git a/SECURITY.md b/SECURITY.md
index 9ef88774..7c10f0d7 100644
--- a/SECURITY.md
+++ b/SECURITY.md
@@ -18,7 +18,9 @@ As a rapidly evolving open-source project, we primarily support the latest versi
 ## 2. Scope
 
 ### 2.1 In Scope
+
 The following are within the scope of this vulnerability disclosure policy:
+
 - OpenHamClock application code (frontend and backend)
 - Configuration defaults and deployment artifacts in this repository
 - Build, packaging, and update mechanisms owned by this repository
@@ -26,7 +28,9 @@ The following are within the scope of this vulnerability disclosure policy:
 - Installation and update scripts (`setup-*.sh`, `update.sh`)
 
 ### 2.2 Out of Scope
+
 The following are generally **not** in scope but may be considered on a case-by-case basis:
+
 - Third-party services and APIs consumed by OpenHamClock (report to the respective vendor)
 - Vulnerabilities in upstream dependencies that do not materially affect this project's usage
 - Issues requiring physical access to the user's device (unless remote access was enabled in an unsafe manner by default configuration)
@@ -34,11 +38,12 @@ The following are generally **not** in scope but may be considered on a case-by-
 - Issues in end-of-life or unsupported versions
 
 ### 2.3 Scope Questions
+
 If you're unsure whether something is in scope, **please report it anyway** and clearly mark it as a **"scope question"** in your submission. We will provide guidance.
 
 ---
 
-## 3. Security Contact 
+## 3. Security Contact
 
 For vulnerability reports, please use one of the **private channels** below. The maintainer acts as the primary security contact and may engage additional community members under NDA for remediation when necessary.
 
@@ -51,17 +56,20 @@ For vulnerability reports, please use one of the **private channels** below. The
 ### 4.1 Reporting Channels (in order of preference)
 
 #### Primary: GitHub Private Vulnerability Reporting
+
 - **URL**: https://github.com/accius/openhamclock/security/advisories/new
 - **Advantages**: Structured submission, built-in secure communication, CVE assignment support
 - **Expected acknowledgment**: Automated immediate, human review within 7 days
 
 #### Secondary: Encrypted Email
+
 - **Address**: chris@cjhlighting.com
 - **PGP Key**: Available at https://github.com/accius.gpg (or keybase.io/accius)
 - **Fingerprint**: `[Will be added - use PGP key for sensitive communications]`
 - **Use when**: GitHub reporting is unavailable or for highly sensitive disclosures
 
 #### Tertiary: Direct Message
+
 - **Platform**: Twitter/X DM to @[handle] (if urgent and other channels fail)
 - **Note**: Less secure; use only for initial contact, then switch to encrypted channel
 
@@ -70,6 +78,7 @@ For vulnerability reports, please use one of the **private channels** below. The
 A complete vulnerability report should include:
 
 **Required**:
+
 - **Vulnerability type** (e.g., SQL injection, XSS, authentication bypass, RCE, information disclosure)
 - **Affected component(s)** (e.g., `server.js`, auto-update mechanism, Docker configuration)
 - **Affected version(s)** (commit hash or version tag)
@@ -78,6 +87,7 @@ A complete vulnerability report should include:
 - **Impact assessment** (what can an attacker achieve?)
 
 **Optional but helpful**:
+
 - **Severity assessment** (your opinion: Critical/High/Medium/Low)
 - **Suggested remediation** or mitigation approach
 - **Disclosure preferences** (embargo duration, credit preferences)
@@ -86,6 +96,7 @@ A complete vulnerability report should include:
 ### 4.3 Sensitive Data Handling
 
 To protect operator privacy, **please avoid including**:
+
 - Real amateur radio callsigns (use `K0XXX` or `W1ABC` as placeholders)
 - Actual grid locators (use `AA00aa` as placeholder)
 - Production IP addresses (use RFC5737 documentation addresses: `192.0.2.0/24`)
@@ -93,11 +104,13 @@ To protect operator privacy, **please avoid including**:
 - Personal information of operators (names, addresses, email addresses)
 
 If sensitive data is **absolutely necessary** for reproduction:
+
 - Redact or pseudonymize it
 - Clearly explain what was redacted and why it's needed
 - Offer to provide actual data over a secure side-channel if essential
 
 ### 4.4 Language
+
 Reports may be submitted in **English** (preferred) or other languages. We will make reasonable efforts to work with non-English reporters but may experience delays in processing.
 
 ---
@@ -108,15 +121,15 @@ Reports may be submitted in **English** (preferred) or other languages. We will
 
 Each reported vulnerability is assigned a unique **case identifier** (format: `OHC-YYYY-NNNN`, e.g., `OHC-2026-0001`) and progresses through these states:
 
-| State | Description | Typical Duration |
-|-------|-------------|------------------|
-| **RECEIVED** | Report received, awaiting initial review | 0-7 days |
-| **ASSIGNED** | Case assigned to handler, analysis started | 1-14 days |
-| **CONFIRMED** | Vulnerability validated and reproduced | - |
-| **REMEDIATION** | Fix in development and testing | 7-90 days |
-| **VENDOR-FIX** | Fix ready, coordinating disclosure | 0-14 days |
-| **PUBLIC** | Vulnerability and fix publicly disclosed | Terminal state |
-| **REJECTED** | Not a vulnerability or out of scope | Terminal state |
+| State           | Description                                | Typical Duration |
+| --------------- | ------------------------------------------ | ---------------- |
+| **RECEIVED**    | Report received, awaiting initial review   | 0-7 days         |
+| **ASSIGNED**    | Case assigned to handler, analysis started | 1-14 days        |
+| **CONFIRMED**   | Vulnerability validated and reproduced     | -                |
+| **REMEDIATION** | Fix in development and testing             | 7-90 days        |
+| **VENDOR-FIX**  | Fix ready, coordinating disclosure         | 0-14 days        |
+| **PUBLIC**      | Vulnerability and fix publicly disclosed   | Terminal state   |
+| **REJECTED**    | Not a vulnerability or out of scope        | Terminal state   |
 
 **Status transitions** will be communicated to the reporter via the reporting channel.
 
@@ -125,7 +138,7 @@ Each reported vulnerability is assigned a unique **case identifier** (format: `O
 We commit to the following response targets:
 
 - **Initial acknowledgment**: Within **7 calendar days** of receipt
-- **Preliminary assessment**: Within **14 calendar days** of receipt  
+- **Preliminary assessment**: Within **14 calendar days** of receipt
 - **Regular updates**: At least every **14 calendar days** while case is active
 - **Target remediation**: Within **90 days** for Critical/High severity issues
 
@@ -135,18 +148,19 @@ We commit to the following response targets:
 
 We use CVSS v3.1 base scores to classify severity:
 
-| Severity | CVSS Score | Response Priority | Typical Fix Timeline |
-|----------|-----------|-------------------|---------------------|
-| **Critical** | 9.0 - 10.0 | Immediate | 7-30 days |
-| **High** | 7.0 - 8.9 | Urgent | 30-60 days |
-| **Medium** | 4.0 - 6.9 | Normal | 60-90 days |
-| **Low** | 0.1 - 3.9 | Best effort | Next release cycle |
+| Severity     | CVSS Score | Response Priority | Typical Fix Timeline |
+| ------------ | ---------- | ----------------- | -------------------- |
+| **Critical** | 9.0 - 10.0 | Immediate         | 7-30 days            |
+| **High**     | 7.0 - 8.9  | Urgent            | 30-60 days           |
+| **Medium**   | 4.0 - 6.9  | Normal            | 60-90 days           |
+| **Low**      | 0.1 - 3.9  | Best effort       | Next release cycle   |
 
 Reporters are encouraged to provide their own CVSS assessment, but the PSIRT makes the final determination.
 
 ### 5.4 Remediation Development (ISO/IEC 30111 §7.5)
 
 Remediation may take the form of:
+
 1. **Code fix**: Patch applied to the codebase
 2. **Configuration change**: Secure defaults or documentation update
 3. **Workaround**: Interim mitigation until a full fix is available
@@ -170,6 +184,7 @@ By default, we follow a **90-day coordinated disclosure** timeline from initial
 ### 6.2 Early Disclosure
 
 We may disclose **earlier than 90 days** if:
+
 - Fix is ready and tested
 - No multi-party coordination is required
 - Reporter agrees to early disclosure
@@ -178,6 +193,7 @@ We may disclose **earlier than 90 days** if:
 ### 6.3 Embargo Extensions
 
 The 90-day timeline may be **extended** if:
+
 - Complexity requires additional development time (negotiated with reporter)
 - Multi-party coordination is in progress (see §7)
 - Affected component is in a third-party dependency awaiting upstream fix
@@ -187,6 +203,7 @@ The 90-day timeline may be **extended** if:
 ### 6.4 Emergency Disclosure
 
 If we become aware of **active exploitation** or **imminent public disclosure**, we may:
+
 1. Immediately publish a security advisory with available mitigations
 2. Notify affected parties via established channels
 3. Release a patch or workaround, even if incomplete
@@ -196,6 +213,7 @@ We will make reasonable efforts to notify the reporter before emergency disclosu
 ### 6.5 Public Disclosure Content (ISO/IEC 29147 §7.5.3)
 
 Our security advisories include:
+
 - Vulnerability description (non-technical summary + technical details)
 - Affected versions and components
 - CVE identifier (if assigned)
@@ -206,6 +224,7 @@ Our security advisories include:
 - Timeline of disclosure
 
 **Disclosure channels**:
+
 - GitHub Security Advisory (primary)
 - CHANGELOG.md and release notes
 - Project README / documentation
@@ -218,6 +237,7 @@ Our security advisories include:
 ### 7.1 When Multi-Party Coordination is Needed
 
 We initiate multi-party coordination when a vulnerability:
+
 - Affects **upstream dependencies** (e.g., Express, Node.js, npm packages)
 - Impacts **downstream projects** (forks, derivatives, or integrations)
 - Is present in **multiple projects** sharing similar code
@@ -237,6 +257,7 @@ When multi-party coordination is required:
 ### 7.3 Coordinator Roles
 
 We may request assistance from:
+
 - **CERT/CC** (cert.org) for high-impact vulnerabilities affecting multiple vendors
 - **MITRE** (cve.org) for CVE assignment and management
 - **GitHub Security Lab** for coordination within the GitHub ecosystem
@@ -245,6 +266,7 @@ We may request assistance from:
 ### 7.4 Information Sharing Restrictions
 
 When participating in multi-party coordination:
+
 - All parties operate under **confidentiality** until the agreed disclosure date
 - Information may be shared with:
   - Directly affected vendors/projects (on need-to-know basis)
@@ -258,6 +280,7 @@ When participating in multi-party coordination:
 ### 7.5 Disclosure Date Negotiation
 
 Target disclosure date is determined by:
+
 - Complexity of remediation across all parties
 - Criticality and exploit likelihood
 - Default 90-day window (may be shorter or longer by agreement)
@@ -280,11 +303,12 @@ We recognize and credit security researchers who responsibly disclose vulnerabil
 ### 8.2 Hall of Fame
 
 We may maintain a **Security Researchers Hall of Fame** in this repository recognizing:
+
 - Researchers who have reported valid vulnerabilities
 - Year of report and severity classification
 - Link to public advisory (if applicable)
 
-*This section will be created when the first qualifying report is received.*
+_This section will be created when the first qualifying report is received._
 
 ### 8.3 Bug Bounty Program
 
@@ -320,6 +344,7 @@ When testing for vulnerabilities:
 ### 9.3 Responsible Disclosure Commitment
 
 If you follow this policy, we commit to:
+
 - Not pursue legal action related to your research
 - Work with you to understand and validate the issue
 - Acknowledge your contribution publicly (unless you prefer anonymity)
@@ -368,6 +393,7 @@ To reduce your vulnerability surface:
 
 3. **Update regularly**  
    Subscribe to security advisories and apply updates promptly:
+
    ```bash
    git pull
    npm install
@@ -378,7 +404,7 @@ To reduce your vulnerability surface:
 4. **Run with least privilege**  
    Use a dedicated non-root user for the application. If using Docker, ensure the container runs as non-root.
 
-5. **Enable security features**  
+5. **Enable security features**
    - Set `NODE_ENV=production`
    - Configure `AUTO_UPDATE_ENABLED=false` if you prefer manual updates
    - Use HTTPS (TLS) for all connections
@@ -395,12 +421,14 @@ To reduce your vulnerability surface:
 ## 12. Policy Review and Updates
 
 This policy will be reviewed and updated:
+
 - **Annually** (or more frequently as needed)
 - When processes change materially
 - After significant security incidents
 - To align with evolving ISO/IEC standards
 
 **History**:
+
 - **v1.1** (2026-02-12): Enhanced ISO/IEC compliance, added multi-party coordination, severity classification, case lifecycle
 - **v1.0** (Initial): Basic vulnerability disclosure policy
 
@@ -409,6 +437,7 @@ This policy will be reviewed and updated:
 ## 13. Contact and Questions
 
 For questions about this policy (not vulnerability reports):
+
 - **General security questions**: Open a public Discussion on GitHub
 - **Policy clarifications**: Email chris@cjhlighting.com (non-confidential)
 
@@ -423,8 +452,9 @@ Thank you to the security research community for helping make OpenHamClock safer
 ## Metadata
 
 This policy aligns with international standards for vulnerability disclosure and handling:
+
 - **ISO/IEC 29147:2018** - Vulnerability disclosure
-- **ISO/IEC 30111:2019** - Vulnerability handling processes  
+- **ISO/IEC 30111:2019** - Vulnerability handling processes
 - **ISO/IEC TR 5895:2022** - Multi-party coordinated vulnerability disclosure and handling
 
 **Document version**: 1.1  
diff --git a/TESTING.md b/TESTING.md
index 7b7912f5..c7bf86d8 100644
--- a/TESTING.md
+++ b/TESTING.md
@@ -1,29 +1,35 @@
 # Unit Testing
+
 This guide explains how to run unit tests for this project
 
 Note that this document, the initial setup and configuration of testing,
 and the initial set of tests for utils/dxClusterFilters.js was created
 with the help of the AI agent "Claude Code" at https://claude.ai
+
 - Rich Freedman, N2EHL 2026-02-07
 
 ## Running Tests
 
 ### Run tests in watch mode (recommended for development)
+
 ```bash
 npm test
 ```
 
 ### Run tests once
+
 ```bash
 npm run test:run
 ```
 
 ### Run tests with UI (interactive browser interface)
+
 ```bash
 npm run test:ui
 ```
 
 ### Run tests with coverage report
+
 ```bash
 npm run test:coverage
 ```
@@ -56,10 +62,12 @@ describe('Feature Name', () => {
       dxCall: 'W1AW',
       spotter: 'K2ABC',
       freq: '14.074',
-      comment: 'FT8'
+      comment: 'FT8',
     };
-    const filters = { /* your filters */ };
-    
+    const filters = {
+      /* your filters */
+    };
+
     expect(applyDXFilters(spot, filters)).toBe(true);
   });
 });
@@ -84,14 +92,17 @@ Add this to your CI pipeline:
 ## Troubleshooting
 
 ### Tests not running?
+
 1. Make sure all dependencies are installed: `npm install`
 2. Check that Node.js version is 18+ : `node --version`
 
 ### Import errors?
+
 - Ensure file paths use `.js` extensions in imports
 - Check that `vitest.config.js` is in the project root
 
 ### Coverage not generating?
+
 - Make sure `@vitest/coverage-v8` is installed
 - Run: `npm install --save-dev @vitest/coverage-v8`
 
diff --git a/config.example.json b/config.example.json
index 30d9f2cc..b27efb7e 100644
--- a/config.example.json
+++ b/config.example.json
@@ -1,25 +1,25 @@
 {
   "_comment": "OpenHamClock User Configuration",
   "_instructions": "Copy this file to config.json and customize for your station. Your config.json will NOT be overwritten by git updates.",
-  
+
   "callsign": "N0CALL",
   "locator": "FN31",
-  
+
   "location": {
-    "lat": 40.0150,
+    "lat": 40.015,
     "lon": -105.2705
   },
-  
+
   "defaultDX": {
     "lat": 35.6762,
     "lon": 139.6503
   },
-  
+
   "units": "imperial",
   "timeFormat": "12",
   "theme": "dark",
   "layout": "modern",
-  
+
   "features": {
     "showPOTA": true,
     "showSatellites": true,
@@ -27,12 +27,12 @@
     "showContests": true,
     "showDXpeditions": true
   },
-  
+
   "dxCluster": {
     "spotRetentionMinutes": 30,
     "source": "auto"
   },
-  
+
   "refreshIntervals": {
     "spaceWeather": 300000,
     "bandConditions": 300000,
diff --git a/config.js b/config.js
index bc56e180..4bfd8a84 100644
--- a/config.js
+++ b/config.js
@@ -1,9 +1,9 @@
 /**
  * OpenHamClock Configuration
- * 
+ *
  * Edit this file to customize your OpenHamClock instance.
  * After making changes, refresh the browser to apply.
- * 
+ *
  * For Raspberry Pi: Edit this file at ~/openhamclock/config.js
  */
 
@@ -11,44 +11,44 @@ const OpenHamClockConfig = {
   // ========================================
   // STATION INFORMATION
   // ========================================
-  
+
   // Your callsign (displayed in header)
-  callsign: "K0CJH",
-  
+  callsign: 'K0CJH',
+
   // Your location (DE - "This End")
   // Find coordinates: https://www.latlong.net/
   location: {
-    lat: 39.7392,    // Latitude (positive = North, negative = South)
-    lon: -104.9903   // Longitude (positive = East, negative = West)
+    lat: 39.7392, // Latitude (positive = North, negative = South)
+    lon: -104.9903, // Longitude (positive = East, negative = West)
   },
-  
+
   // Default DX location (far end for path calculations)
   // Set to a frequently worked location, or leave as default
   defaultDX: {
-    lat: 35.6762,   // Tokyo, Japan
-    lon: 139.6503
+    lat: 35.6762, // Tokyo, Japan
+    lon: 139.6503,
   },
-  
+
   // ========================================
   // DISPLAY OPTIONS
   // ========================================
-  
+
   // Theme: 'dark' (default), 'light' (coming soon)
-  theme: "dark",
-  
+  theme: 'dark',
+
   // Time format: '24h' or '12h'
-  timeFormat: "24h",
-  
+  timeFormat: '24h',
+
   // Date format: 'iso' (YYYY-MM-DD), 'us' (MM/DD/YYYY), 'eu' (DD/MM/YYYY)
-  dateFormat: "iso",
-  
+  dateFormat: 'iso',
+
   // Show seconds in time display
   showSeconds: true,
-  
+
   // ========================================
   // PANELS TO DISPLAY
   // ========================================
-  
+
   // Enable/disable individual panels
   panels: {
     utcClock: true,
@@ -60,132 +60,132 @@ const OpenHamClockConfig = {
     bandConditions: true,
     dxCluster: true,
     potaActivity: true,
-    sotaActivity: false,  // Coming soon
-    satellites: false,     // Coming soon
-    contests: false        // Coming soon
+    sotaActivity: false, // Coming soon
+    satellites: false, // Coming soon
+    contests: false, // Coming soon
   },
-  
+
   // ========================================
   // MAP OPTIONS
   // ========================================
-  
+
   map: {
     // Map style: 'standard', 'terrain', 'minimal'
-    style: "standard",
-    
+    style: 'standard',
+
     // Show day/night terminator (gray line)
     showTerminator: true,
-    
+
     // Show grid lines
     showGrid: true,
-    
+
     // Show path between DE and DX
     showPath: true,
-    
+
     // Path style: 'greatCircle' or 'straight'
-    pathStyle: "greatCircle"
+    pathStyle: 'greatCircle',
   },
-  
+
   // ========================================
   // DX CLUSTER SETTINGS
   // ========================================
-  
+
   dxCluster: {
     // Enable live DX cluster connection
-    enabled: false,  // Set to true when API is implemented
-    
+    enabled: false, // Set to true when API is implemented
+
     // Cluster node (Telnet)
-    node: "dxc.nc7j.com",
+    node: 'dxc.nc7j.com',
     port: 7373,
-    
+
     // Login callsign (usually your call)
-    login: "K0CJH",
-    
+    login: 'K0CJH',
+
     // Filter options
     filters: {
       // Only show spots for these bands (empty = all bands)
-      bands: [],  // e.g., ["20m", "40m", "15m"]
-      
+      bands: [], // e.g., ["20m", "40m", "15m"]
+
       // Only show these modes (empty = all modes)
-      modes: [],  // e.g., ["FT8", "CW", "SSB"]
-      
+      modes: [], // e.g., ["FT8", "CW", "SSB"]
+
       // Minimum spot age to display (minutes)
-      maxAge: 30
-    }
+      maxAge: 30,
+    },
   },
-  
+
   // ========================================
   // POTA/SOTA SETTINGS
   // ========================================
-  
+
   pota: {
     enabled: true,
-    
+
     // Filter by state/region (empty = all)
-    regions: [],  // e.g., ["K-CO", "K-WY"]
-    
+    regions: [], // e.g., ["K-CO", "K-WY"]
+
     // Maximum number of spots to show
-    maxSpots: 10
+    maxSpots: 10,
   },
-  
+
   sota: {
     enabled: false,
-    
+
     // Filter by association (empty = all)
-    associations: [],  // e.g., ["W7C", "W0C"]
-    
-    maxSpots: 10
+    associations: [], // e.g., ["W7C", "W0C"]
+
+    maxSpots: 10,
   },
-  
+
   // ========================================
   // SPACE WEATHER DATA SOURCES
   // ========================================
-  
+
   dataRefresh: {
     // Refresh interval in seconds
-    spaceWeather: 300,    // 5 minutes
-    bandConditions: 300,  // 5 minutes
-    dxCluster: 5,         // 5 seconds (live)
-    pota: 60,             // 1 minute
-    sota: 60              // 1 minute
+    spaceWeather: 300, // 5 minutes
+    bandConditions: 300, // 5 minutes
+    dxCluster: 5, // 5 seconds (live)
+    pota: 60, // 1 minute
+    sota: 60, // 1 minute
   },
-  
+
   // ========================================
   // SOUND/ALERTS (Coming Soon)
   // ========================================
-  
+
   alerts: {
     enabled: false,
-    
+
     // Sound alerts for new DX spots
     dxClusterSound: false,
-    
+
     // Alert for specific DXCC entities
-    watchedEntities: [],  // e.g., ["VP8", "3Y", "P5"]
-    
+    watchedEntities: [], // e.g., ["VP8", "3Y", "P5"]
+
     // Alert for space weather events
-    spaceWeatherAlert: false
+    spaceWeatherAlert: false,
   },
-  
+
   // ========================================
   // ADVANCED
   // ========================================
-  
+
   advanced: {
     // Enable debug logging
     debug: false,
-    
+
     // Custom CSS (appended to page)
-    customCSS: "",
-    
+    customCSS: '',
+
     // API endpoints (for self-hosted data servers)
     apiEndpoints: {
-      spaceWeather: null,  // null = use default
+      spaceWeather: null, // null = use default
       dxCluster: null,
       pota: null,
-      sota: null
-    }
-  }
+      sota: null,
+    },
+  },
 };
 
 // Export for use in main application
diff --git a/docker-compose.yml b/docker-compose.yml
index 5b58978d..e20a3d8c 100644
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -3,8 +3,8 @@ services:
     build: .
     container_name: openhamclock
     ports:
-      - "3000:3000"
-      - "2237:2237/udp"   # WSJT-X UDP — point WSJT-X to 127.0.0.1:2237
+      - '3000:3000'
+      - '2237:2237/udp' # WSJT-X UDP — point WSJT-X to 127.0.0.1:2237
     environment:
       - NODE_ENV=production
       - PORT=3000
@@ -15,7 +15,7 @@ services:
       # - WSJTX_RELAY_KEY=your-secret-relay-key-here
     restart: unless-stopped
     healthcheck:
-      test: ["CMD", "wget", "--no-verbose", "--tries=1", "--spider", "http://localhost:3000/api/health"]
+      test: ['CMD', 'wget', '--no-verbose', '--tries=1', '--spider', 'http://localhost:3000/api/health']
       interval: 30s
       timeout: 10s
       retries: 3
diff --git a/docs/ARCHITECTURE.md b/docs/ARCHITECTURE.md
index 0fe69ecf..bae54ce3 100644
--- a/docs/ARCHITECTURE.md
+++ b/docs/ARCHITECTURE.md
@@ -199,7 +199,7 @@ const MY_CACHE_TTL = 5 * 60 * 1000; // 5 minutes
 // 2. Create route
 app.get('/api/myfeature', async (req, res) => {
   const now = Date.now();
-  if (myCache.data && (now - myCache.timestamp) < MY_CACHE_TTL) {
+  if (myCache.data && now - myCache.timestamp < MY_CACHE_TTL) {
     return res.json(myCache.data);
   }
   const response = await fetch('https://external-api.com/data');
diff --git a/dxspider-proxy/README.md b/dxspider-proxy/README.md
index 5fe4d83e..483adb09 100644
--- a/dxspider-proxy/README.md
+++ b/dxspider-proxy/README.md
@@ -22,14 +22,15 @@ Many cloud hosting platforms (including Railway) don't support outbound telnet c
 
 ## Environment Variables
 
-| Variable | Default | Description |
-|----------|---------|-------------|
-| `PORT` | 3001 | HTTP server port |
+| Variable   | Default      | Description                       |
+| ---------- | ------------ | --------------------------------- |
+| `PORT`     | 3001         | HTTP server port                  |
 | `CALLSIGN` | OPENHAMCLOCK | Callsign used for DX Spider login |
 
 ## API Endpoints
 
 ### `GET /health`
+
 Health check endpoint.
 
 ```json
@@ -46,9 +47,11 @@ Health check endpoint.
 ```
 
 ### `GET /api/spots`
+
 Get accumulated spots with full details.
 
 Query parameters:
+
 - `limit` (default: 50, max: 200) - Number of spots to return
 - `since` (timestamp) - Only return spots after this timestamp
 
@@ -75,9 +78,11 @@ Query parameters:
 ```
 
 ### `GET /api/dxcluster/spots`
+
 Get spots in simplified format (compatible with OpenHamClock).
 
 Query parameters:
+
 - `limit` (default: 25, max: 100)
 
 ```json
@@ -95,6 +100,7 @@ Query parameters:
 ```
 
 ### `GET /api/stats`
+
 Get statistics about spots.
 
 ```json
@@ -120,6 +126,7 @@ Get statistics about spots.
 ```
 
 ### `GET /api/nodes`
+
 List available DX Spider nodes.
 
 ```json
@@ -133,9 +140,11 @@ List available DX Spider nodes.
 ```
 
 ### `POST /api/reconnect`
+
 Force reconnection to current node.
 
 ### `POST /api/switch-node`
+
 Switch to a different node.
 
 ```json
diff --git a/dxspider-proxy/server.js b/dxspider-proxy/server.js
index bdf39e6f..170d6888 100644
--- a/dxspider-proxy/server.js
+++ b/dxspider-proxy/server.js
@@ -1,9 +1,9 @@
 /**
  * DX Spider Telnet Proxy Service
- * 
+ *
  * A microservice that maintains a persistent telnet connection to DX Spider,
  * accumulates spots, and serves them via HTTP API.
- * 
+ *
  * Designed to run on Railway as a standalone service.
  */
 
@@ -22,7 +22,7 @@ const CONFIG = {
     { host: 'dxspider.co.uk', port: 7300, name: 'DX Spider UK (G6NHU)' },
     { host: 'dxc.nc7j.com', port: 7373, name: 'NC7J' },
     { host: 'dxc.ai9t.com', port: 7373, name: 'AI9T' },
-    { host: 'dxc.w6cua.org', port: 7300, name: 'W6CUA' }
+    { host: 'dxc.w6cua.org', port: 7300, name: 'W6CUA' },
   ],
   // Callsign with SSID - use env var as-is, or default to OPENHAMCLOCK-56
   // Set CALLSIGN=YOURCALL-56 for production, CALLSIGN=YOURCALL-57 for staging
@@ -31,14 +31,14 @@ const CONFIG = {
   reconnectDelayMs: 10000, // 10 seconds between reconnect attempts
   maxReconnectAttempts: 3,
   cleanupIntervalMs: 60000, // 1 minute
-  keepAliveIntervalMs: 120000 // 2 minutes - send keepalive
+  keepAliveIntervalMs: 120000, // 2 minutes - send keepalive
 };
 
 // State
 let spots = [];
 let client = null;
 let connected = false;
-let connecting = false;  // NEW: Prevent concurrent connection attempts
+let connecting = false; // NEW: Prevent concurrent connection attempts
 let currentNode = null;
 let currentNodeIndex = 0;
 let reconnectAttempts = 0;
@@ -57,27 +57,27 @@ const currentLogLevel = LOG_LEVELS[LOG_LEVEL] ?? LOG_LEVELS.info;
 
 // Map log categories to levels
 const CATEGORY_LEVELS = {
-  'SPOT': 'debug',     // Per-spot logging is debug-only
-  'CLEANUP': 'debug',  // Periodic cleanup is debug-only
-  'KEEPALIVE': 'debug', // Keepalive pings are debug-only
-  'CMD': 'debug',      // Command logging is debug-only
-  'AUTH': 'info',      // Auth events are informational
-  'CONNECT': 'info',   // Connection events are informational
-  'CLOSE': 'info',
-  'RECONNECT': 'info',
-  'FAILOVER': 'info',
-  'API': 'info',
-  'START': 'info',
-  'CONFIG': 'info',
-  'SHUTDOWN': 'info',
-  'ERROR': 'warn',
-  'TIMEOUT': 'warn',
+  SPOT: 'debug', // Per-spot logging is debug-only
+  CLEANUP: 'debug', // Periodic cleanup is debug-only
+  KEEPALIVE: 'debug', // Keepalive pings are debug-only
+  CMD: 'debug', // Command logging is debug-only
+  AUTH: 'info', // Auth events are informational
+  CONNECT: 'info', // Connection events are informational
+  CLOSE: 'info',
+  RECONNECT: 'info',
+  FAILOVER: 'info',
+  API: 'info',
+  START: 'info',
+  CONFIG: 'info',
+  SHUTDOWN: 'info',
+  ERROR: 'warn',
+  TIMEOUT: 'warn',
 };
 
 const log = (level, message, data = null) => {
   const categoryLevel = LOG_LEVELS[CATEGORY_LEVELS[level] || 'info'] ?? LOG_LEVELS.info;
   if (categoryLevel < currentLogLevel) return;
-  
+
   const timestamp = new Date().toISOString();
   const logLine = `[${timestamp}] [${level}] ${message}`;
   if (data) {
@@ -93,14 +93,14 @@ const parseSpotLine = (line) => {
   try {
     // Match: DX de W3ABC:     14025.0  JA1XYZ       CW 599           1234Z
     const match = line.match(/^DX de\s+([A-Z0-9/]+):\s+(\d+\.?\d*)\s+([A-Z0-9/]+)\s+(.*)$/i);
-    
+
     if (!match) return null;
-    
+
     const spotter = match[1].toUpperCase();
     const freqKhz = parseFloat(match[2]);
     const dxCall = match[3].toUpperCase();
     let comment = match[4].trim();
-    
+
     // Extract time from end of comment (format: 1234Z or 1234z)
     let time = '';
     const timeMatch = comment.match(/(\d{4})[Zz]\s*$/);
@@ -110,10 +110,9 @@ const parseSpotLine = (line) => {
     } else {
       // Use current UTC time
       const now = new Date();
-      time = String(now.getUTCHours()).padStart(2, '0') + ':' + 
-             String(now.getUTCMinutes()).padStart(2, '0') + 'z';
+      time = String(now.getUTCHours()).padStart(2, '0') + ':' + String(now.getUTCMinutes()).padStart(2, '0') + 'z';
     }
-    
+
     // Detect mode from comment
     let mode = null;
     const upperComment = comment.toUpperCase();
@@ -125,14 +124,16 @@ const parseSpotLine = (line) => {
     else if (upperComment.includes('PSK')) mode = 'PSK';
     else if (upperComment.includes('FM')) mode = 'FM';
     else if (upperComment.includes('AM')) mode = 'AM';
-    
+
     // Extract grid squares from comment
     // Pattern: Look for 4 or 6 char grids, possibly in format "GRID1<>GRID2" or "GRID1->GRID2"
     let spotterGrid = null;
     let dxGrid = null;
-    
+
     // Check for dual grid format: FN20<>EM79 or FN20->EM79 or FN20/EM79
-    const dualGridMatch = comment.match(/\b([A-R]{2}[0-9]{2}(?:[A-X]{2})?)\s*(?:<>|->|\/|<)\s*([A-R]{2}[0-9]{2}(?:[A-X]{2})?)\b/i);
+    const dualGridMatch = comment.match(
+      /\b([A-R]{2}[0-9]{2}(?:[A-X]{2})?)\s*(?:<>|->|\/|<)\s*([A-R]{2}[0-9]{2}(?:[A-X]{2})?)\b/i,
+    );
     if (dualGridMatch) {
       spotterGrid = dualGridMatch[1].toUpperCase();
       dxGrid = dualGridMatch[2].toUpperCase();
@@ -149,7 +150,7 @@ const parseSpotLine = (line) => {
         }
       }
     }
-    
+
     return {
       spotter,
       spotterGrid,
@@ -161,7 +162,7 @@ const parseSpotLine = (line) => {
       time,
       mode,
       timestamp: Date.now(),
-      source: 'DX Spider'
+      source: 'DX Spider',
     };
   } catch (err) {
     log('ERROR', 'Failed to parse spot line', { line, error: err.message });
@@ -172,14 +173,13 @@ const parseSpotLine = (line) => {
 // Add a spot to the accumulator
 const addSpot = (spot) => {
   if (!spot) return;
-  
+
   // Check for duplicate (same call + freq within 2 minutes)
-  const isDuplicate = spots.some(existing =>
-    existing.call === spot.call &&
-    existing.freq === spot.freq &&
-    (spot.timestamp - existing.timestamp) < 120000
+  const isDuplicate = spots.some(
+    (existing) =>
+      existing.call === spot.call && existing.freq === spot.freq && spot.timestamp - existing.timestamp < 120000,
   );
-  
+
   if (!isDuplicate) {
     spots.unshift(spot); // Add to beginning (newest first)
     totalSpotsReceived++;
@@ -192,7 +192,7 @@ const addSpot = (spot) => {
 const cleanupSpots = () => {
   const cutoff = Date.now() - CONFIG.spotRetentionMs;
   const before = spots.length;
-  spots = spots.filter(s => s.timestamp > cutoff);
+  spots = spots.filter((s) => s.timestamp > cutoff);
   const removed = before - spots.length;
   if (removed > 0) {
     log('CLEANUP', `Removed ${removed} expired spots, ${spots.length} remaining`);
@@ -206,15 +206,15 @@ const connect = () => {
     log('CONNECT', 'Connection attempt already in progress, skipping');
     return;
   }
-  
+
   connecting = true;
-  
+
   // Clear any pending reconnect timer
   if (reconnectTimer) {
     clearTimeout(reconnectTimer);
     reconnectTimer = null;
   }
-  
+
   // Clean up existing client without triggering reconnect
   if (client) {
     try {
@@ -223,15 +223,15 @@ const connect = () => {
     } catch (e) {}
     client = null;
   }
-  
+
   const node = CONFIG.nodes[currentNodeIndex];
   currentNode = node;
-  
+
   log('CONNECT', `Attempting connection to ${node.name} (${node.host}:${node.port})`);
-  
+
   client = new net.Socket();
   client.setTimeout(60000); // 60 second timeout
-  
+
   client.connect(node.port, node.host, () => {
     connected = true;
     connecting = false;
@@ -239,20 +239,20 @@ const connect = () => {
     connectionStartTime = new Date();
     buffer = '';
     log('CONNECT', `Connected to ${node.name}`);
-    
+
     // Send login after short delay
     setTimeout(() => {
       if (client && connected) {
         client.write(CONFIG.callsign + '\r\n');
         log('AUTH', `Sent callsign: ${CONFIG.callsign}`);
-        
+
         // After login, enable DX spot announcements
         setTimeout(() => {
           if (client && connected) {
             // Request recent spots first
             client.write('sh/dx 30\r\n');
             log('CMD', 'Sent: sh/dx 30');
-            
+
             // Then enable the spot stream (some nodes need this)
             setTimeout(() => {
               if (client && connected) {
@@ -264,22 +264,22 @@ const connect = () => {
         }, 2000);
       }
     }, 1000);
-    
+
     // Start keepalive
     startKeepAlive();
   });
-  
+
   client.on('data', (data) => {
     buffer += data.toString();
-    
+
     // Process complete lines
     const lines = buffer.split('\n');
     buffer = lines.pop() || ''; // Keep incomplete line in buffer
-    
+
     for (const line of lines) {
       const trimmed = line.trim();
       if (!trimmed) continue;
-      
+
       // Check if it's a DX spot
       if (trimmed.startsWith('DX de ')) {
         const spot = parseSpotLine(trimmed);
@@ -289,19 +289,19 @@ const connect = () => {
       }
     }
   });
-  
+
   client.on('timeout', () => {
     log('TIMEOUT', 'Connection timed out');
     connecting = false;
     handleDisconnect();
   });
-  
+
   client.on('error', (err) => {
     log('ERROR', `Connection error: ${err.message}`);
     connecting = false;
     handleDisconnect();
   });
-  
+
   client.on('close', () => {
     if (connected) {
       log('CLOSE', 'Connection closed');
@@ -316,7 +316,7 @@ const startKeepAlive = () => {
   if (keepAliveTimer) {
     clearInterval(keepAliveTimer);
   }
-  
+
   keepAliveTimer = setInterval(() => {
     if (client && connected) {
       try {
@@ -336,31 +336,31 @@ const handleDisconnect = () => {
   if (!connected && !connecting && reconnectTimer) {
     return; // Already disconnected and reconnect scheduled
   }
-  
+
   connected = false;
   connecting = false;
-  
+
   if (keepAliveTimer) {
     clearInterval(keepAliveTimer);
     keepAliveTimer = null;
   }
-  
+
   // Don't schedule another reconnect if one is already pending
   if (reconnectTimer) {
     return;
   }
-  
+
   reconnectAttempts++;
-  
+
   if (reconnectAttempts >= CONFIG.maxReconnectAttempts) {
     // Try next node
     currentNodeIndex = (currentNodeIndex + 1) % CONFIG.nodes.length;
     reconnectAttempts = 0;
     log('FAILOVER', `Switching to node: ${CONFIG.nodes[currentNodeIndex].name}`);
   }
-  
+
   log('RECONNECT', `Attempting reconnect in ${CONFIG.reconnectDelayMs}ms (attempt ${reconnectAttempts})`);
-  
+
   reconnectTimer = setTimeout(() => {
     reconnectTimer = null;
     connect();
@@ -380,9 +380,10 @@ app.get('/health', (req, res) => {
     spotsInMemory: spots.length,
     totalSpotsReceived,
     lastSpotTime: lastSpotTime?.toISOString() || null,
-    connectionUptime: connectionStartTime ? 
-      Math.floor((Date.now() - connectionStartTime.getTime()) / 1000) + 's' : null,
-    uptime: process.uptime() + 's'
+    connectionUptime: connectionStartTime
+      ? Math.floor((Date.now() - connectionStartTime.getTime()) / 1000) + 's'
+      : null,
+    uptime: process.uptime() + 's',
   });
 });
 
@@ -390,37 +391,37 @@ app.get('/health', (req, res) => {
 app.get('/api/spots', (req, res) => {
   const limit = Math.min(parseInt(req.query.limit) || 50, 200);
   const since = parseInt(req.query.since) || 0; // Timestamp filter
-  
+
   let filteredSpots = spots;
-  
+
   // Filter by timestamp if provided
   if (since > 0) {
-    filteredSpots = spots.filter(s => s.timestamp > since);
+    filteredSpots = spots.filter((s) => s.timestamp > since);
   }
-  
+
   res.json({
     spots: filteredSpots.slice(0, limit),
     total: filteredSpots.length,
     connected,
     source: currentNode?.name || 'disconnected',
-    timestamp: Date.now()
+    timestamp: Date.now(),
   });
 });
 
 // Get spots in simple format (for compatibility with existing DX cluster endpoint)
 app.get('/api/dxcluster/spots', (req, res) => {
   const limit = Math.min(parseInt(req.query.limit) || 25, 100);
-  
-  const formattedSpots = spots.slice(0, limit).map(s => ({
+
+  const formattedSpots = spots.slice(0, limit).map((s) => ({
     spotter: s.spotter,
     freq: s.freq,
     call: s.call,
     comment: s.comment,
     time: s.time,
     mode: s.mode,
-    source: 'DX Spider Proxy'
+    source: 'DX Spider Proxy',
   }));
-  
+
   res.json(formattedSpots);
 });
 
@@ -430,11 +431,11 @@ app.get('/api/stats', (req, res) => {
   const bandCounts = {};
   let spotsWithDxGrid = 0;
   let spotsWithSpotterGrid = 0;
-  
-  spots.forEach(s => {
+
+  spots.forEach((s) => {
     if (s.dxGrid) spotsWithDxGrid++;
     if (s.spotterGrid) spotsWithSpotterGrid++;
-    
+
     const freq = s.freqKhz;
     let band = 'other';
     if (freq >= 1800 && freq <= 2000) band = '160m';
@@ -445,20 +446,21 @@ app.get('/api/stats', (req, res) => {
     else if (freq >= 18068 && freq <= 18168) band = '17m';
     else if (freq >= 21000 && freq <= 21450) band = '15m';
     else if (freq >= 24890 && freq <= 24990) band = '12m';
-    else if (freq >= 26500 && freq <= 27500) band = '11m';  // CB band
+    else if (freq >= 26500 && freq <= 27500)
+      band = '11m'; // CB band
     else if (freq >= 28000 && freq <= 29700) band = '10m';
     else if (freq >= 50000 && freq <= 54000) band = '6m';
-    
+
     bandCounts[band] = (bandCounts[band] || 0) + 1;
   });
-  
+
   // Calculate spots per mode
   const modeCounts = {};
-  spots.forEach(s => {
+  spots.forEach((s) => {
     const mode = s.mode || 'unknown';
     modeCounts[mode] = (modeCounts[mode] || 0) + 1;
   });
-  
+
   res.json({
     connected,
     currentNode: currentNode?.name || 'none',
@@ -469,28 +471,28 @@ app.get('/api/stats', (req, res) => {
     lastSpotTime: lastSpotTime?.toISOString() || null,
     retentionMinutes: CONFIG.spotRetentionMs / 60000,
     bandCounts,
-    modeCounts
+    modeCounts,
   });
 });
 
 // Debug endpoint - show spots with grids
 app.get('/api/debug/grids', (req, res) => {
-  const spotsWithGrids = spots.filter(s => s.dxGrid || s.spotterGrid).slice(0, 20);
-  const allGrids = spots.slice(0, 50).map(s => ({
+  const spotsWithGrids = spots.filter((s) => s.dxGrid || s.spotterGrid).slice(0, 20);
+  const allGrids = spots.slice(0, 50).map((s) => ({
     call: s.call,
     spotter: s.spotter,
     dxGrid: s.dxGrid || null,
     spotterGrid: s.spotterGrid || null,
-    comment: s.comment
+    comment: s.comment,
   }));
-  
+
   res.json({
     totalSpots: spots.length,
-    spotsWithDxGrid: spots.filter(s => s.dxGrid).length,
-    spotsWithSpotterGrid: spots.filter(s => s.spotterGrid).length,
-    spotsWithAnyGrid: spots.filter(s => s.dxGrid || s.spotterGrid).length,
+    spotsWithDxGrid: spots.filter((s) => s.dxGrid).length,
+    spotsWithSpotterGrid: spots.filter((s) => s.spotterGrid).length,
+    spotsWithAnyGrid: spots.filter((s) => s.dxGrid || s.spotterGrid).length,
     sampleSpotsWithGrids: spotsWithGrids,
-    recentSpots: allGrids
+    recentSpots: allGrids,
   });
 });
 
@@ -511,7 +513,7 @@ app.post('/api/switch-node', (req, res) => {
     handleDisconnect();
     res.json({ status: 'switching', node: CONFIG.nodes[index].name });
   } else {
-    res.status(400).json({ error: 'Invalid node index', availableNodes: CONFIG.nodes.map(n => n.name) });
+    res.status(400).json({ error: 'Invalid node index', availableNodes: CONFIG.nodes.map((n) => n.name) });
   }
 });
 
@@ -523,9 +525,9 @@ app.get('/api/nodes', (req, res) => {
       name: n.name,
       host: n.host,
       port: n.port,
-      active: i === currentNodeIndex
+      active: i === currentNodeIndex,
     })),
-    currentIndex: currentNodeIndex
+    currentIndex: currentNodeIndex,
   });
 });
 
@@ -543,8 +545,8 @@ app.listen(PORT, () => {
   log('START', `DX Spider Proxy listening on port ${PORT}`);
   log('CONFIG', `Callsign: ${CONFIG.callsign}`);
   log('CONFIG', `Spot retention: ${CONFIG.spotRetentionMs / 60000} minutes`);
-  log('CONFIG', `Available nodes: ${CONFIG.nodes.map(n => n.name).join(', ')}`);
-  
+  log('CONFIG', `Available nodes: ${CONFIG.nodes.map((n) => n.name).join(', ')}`);
+
   // Connect to DX Spider
   connect();
 });
diff --git a/electron/main.js b/electron/main.js
index b0b6440e..950abba1 100644
--- a/electron/main.js
+++ b/electron/main.js
@@ -1,6 +1,6 @@
 /**
  * OpenHamClock Electron Main Process
- * 
+ *
  * Creates a native desktop application wrapper for OpenHamClock
  * Supports Windows, macOS, Linux, and Raspberry Pi
  */
@@ -21,13 +21,13 @@ if (!isDev) {
   const express = require('express');
   const serverApp = express();
   const PORT = 3847; // Use a unique port for embedded server
-  
+
   const staticDir = path.join(__dirname, '..', 'dist');
   serverApp.use(express.static(staticDir));
   serverApp.get('*', (req, res) => {
     res.sendFile(path.join(staticDir, 'index.html'));
   });
-  
+
   server = serverApp.listen(PORT, () => {
     console.log(`Embedded server running on port ${PORT}`);
   });
@@ -35,14 +35,10 @@ if (!isDev) {
 
 function createWindow() {
   // Determine the URL to load
-  const loadURL = isDev 
-    ? 'http://localhost:3000' 
-    : `http://localhost:3847`;
+  const loadURL = isDev ? 'http://localhost:3000' : `http://localhost:3847`;
 
   // Create the browser window
-  const assetDir = isDev
-    ? path.join(__dirname, '..', 'public')
-    : path.join(__dirname, '..', 'dist');
+  const assetDir = isDev ? path.join(__dirname, '..', 'public') : path.join(__dirname, '..', 'dist');
 
   mainWindow = new BrowserWindow({
     width: 1600,
@@ -105,7 +101,7 @@ function createMenu() {
             if (mainWindow) {
               mainWindow.webContents.reload();
             }
-          }
+          },
         },
         { type: 'separator' },
         {
@@ -115,11 +111,11 @@ function createMenu() {
             if (mainWindow) {
               mainWindow.setFullScreen(!mainWindow.isFullScreen());
             }
-          }
+          },
         },
         { type: 'separator' },
-        { role: 'quit' }
-      ]
+        { role: 'quit' },
+      ],
     },
     {
       label: 'View',
@@ -131,8 +127,8 @@ function createMenu() {
         { role: 'zoomIn' },
         { role: 'zoomOut' },
         { type: 'separator' },
-        { role: 'togglefullscreen' }
-      ]
+        { role: 'togglefullscreen' },
+      ],
     },
     {
       label: 'Map',
@@ -140,44 +136,44 @@ function createMenu() {
         {
           label: 'Dark Theme',
           accelerator: '1',
-          click: () => sendMapStyle('dark')
+          click: () => sendMapStyle('dark'),
         },
         {
           label: 'Satellite',
           accelerator: '2',
-          click: () => sendMapStyle('satellite')
+          click: () => sendMapStyle('satellite'),
         },
         {
           label: 'Terrain',
           accelerator: '3',
-          click: () => sendMapStyle('terrain')
+          click: () => sendMapStyle('terrain'),
         },
         {
           label: 'Streets',
           accelerator: '4',
-          click: () => sendMapStyle('streets')
+          click: () => sendMapStyle('streets'),
         },
         {
           label: 'Topographic',
           accelerator: '5',
-          click: () => sendMapStyle('topo')
+          click: () => sendMapStyle('topo'),
         },
         {
           label: 'Ocean',
           accelerator: '6',
-          click: () => sendMapStyle('ocean')
+          click: () => sendMapStyle('ocean'),
         },
         {
           label: 'National Geographic',
           accelerator: '7',
-          click: () => sendMapStyle('natgeo')
+          click: () => sendMapStyle('natgeo'),
         },
         {
           label: 'Gray',
           accelerator: '8',
-          click: () => sendMapStyle('gray')
-        }
-      ]
+          click: () => sendMapStyle('gray'),
+        },
+      ],
     },
     {
       label: 'Help',
@@ -190,22 +186,23 @@ function createMenu() {
               type: 'info',
               title: 'About OpenHamClock',
               message: 'OpenHamClock v3.0.0',
-              detail: 'An open-source amateur radio dashboard.\n\nIn memory of Elwood Downey, WB0OEW, creator of the original HamClock.\n\n73 de the OpenHamClock community!'
+              detail:
+                'An open-source amateur radio dashboard.\n\nIn memory of Elwood Downey, WB0OEW, creator of the original HamClock.\n\n73 de the OpenHamClock community!',
             });
-          }
+          },
         },
         {
           label: 'GitHub Repository',
           click: () => {
             shell.openExternal('https://github.com/accius/openhamclock');
-          }
+          },
         },
         { type: 'separator' },
         {
           label: 'Report Issue',
           click: () => {
             shell.openExternal('https://github.com/accius/openhamclock/issues/new');
-          }
+          },
         },
         { type: 'separator' },
         {
@@ -215,10 +212,10 @@ function createMenu() {
             if (mainWindow) {
               mainWindow.webContents.toggleDevTools();
             }
-          }
-        }
-      ]
-    }
+          },
+        },
+      ],
+    },
   ];
 
   // macOS specific menu adjustments
@@ -234,8 +231,8 @@ function createMenu() {
         { role: 'hideOthers' },
         { role: 'unhide' },
         { type: 'separator' },
-        { role: 'quit' }
-      ]
+        { role: 'quit' },
+      ],
     });
   }
 
diff --git a/index.html b/index.html
index 4dd2b37b..451c661f 100644
--- a/index.html
+++ b/index.html
@@ -1,141 +1,156 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover">
-  <title>OpenHamClock - Amateur Radio Dashboard | Live DX Cluster, Propagation, Band Conditions</title>
-  
-  <!-- SEO Meta -->
-  <meta name="description" content="OpenHamClock is a free, real-time amateur radio dashboard with live DX cluster spots, PSK Reporter, Reverse Beacon Network, POTA/SOTA tracking, propagation predictions, solar indices, band conditions, satellite passes, and an interactive world map. Runs on any browser — desktop, Raspberry Pi, tablet, or phone. No login, no ads, no subscription.">
-  <meta name="keywords" content="ham clock, hamclock, openhamclock, open ham clock, amateur radio dashboard, ham radio dashboard, DX cluster, DX spots, PSK Reporter, Reverse Beacon Network, RBN, POTA tracker, SOTA tracker, propagation prediction, band conditions, solar flux, K-index, sunspot number, space weather, ham radio map, great circle map, satellite tracker, amateur radio, ham radio, shortwave, HF propagation, MUF map, gray line, greyline, VOACAP, ham radio tools, free ham radio software, web ham clock, raspberry pi ham clock">
-  <meta name="author" content="Chris Hetherington, K0CJH">
-  <meta name="robots" content="index, follow">
-  <link rel="canonical" href="https://openhamclock.com/">
+  <head>
+    <meta charset="UTF-8" />
+    <meta
+      name="viewport"
+      content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover"
+    />
+    <title>OpenHamClock - Amateur Radio Dashboard | Live DX Cluster, Propagation, Band Conditions</title>
 
-  <!-- Open Graph (Facebook, Discord, iMessage, etc.) -->
-  <meta property="og:type" content="website">
-  <meta property="og:url" content="https://openhamclock.com/">
-  <meta property="og:title" content="OpenHamClock - Free Amateur Radio Dashboard">
-  <meta property="og:description" content="Live DX cluster spots, PSK Reporter, RBN skimmer data, POTA/SOTA tracking, propagation predictions, solar indices, band conditions, satellite passes, and an interactive world map — all in one free browser-based dashboard. No login, no ads.">
-  <meta property="og:image" content="https://openhamclock.com/icons/og-image.png">
-  <meta property="og:image:width" content="1200">
-  <meta property="og:image:height" content="630">
-  <meta property="og:site_name" content="OpenHamClock">
-  <meta property="og:locale" content="en_US">
+    <!-- SEO Meta -->
+    <meta
+      name="description"
+      content="OpenHamClock is a free, real-time amateur radio dashboard with live DX cluster spots, PSK Reporter, Reverse Beacon Network, POTA/SOTA tracking, propagation predictions, solar indices, band conditions, satellite passes, and an interactive world map. Runs on any browser — desktop, Raspberry Pi, tablet, or phone. No login, no ads, no subscription."
+    />
+    <meta
+      name="keywords"
+      content="ham clock, hamclock, openhamclock, open ham clock, amateur radio dashboard, ham radio dashboard, DX cluster, DX spots, PSK Reporter, Reverse Beacon Network, RBN, POTA tracker, SOTA tracker, propagation prediction, band conditions, solar flux, K-index, sunspot number, space weather, ham radio map, great circle map, satellite tracker, amateur radio, ham radio, shortwave, HF propagation, MUF map, gray line, greyline, VOACAP, ham radio tools, free ham radio software, web ham clock, raspberry pi ham clock"
+    />
+    <meta name="author" content="Chris Hetherington, K0CJH" />
+    <meta name="robots" content="index, follow" />
+    <link rel="canonical" href="https://openhamclock.com/" />
 
-  <!-- Twitter Card -->
-  <meta name="twitter:card" content="summary_large_image">
-  <meta name="twitter:title" content="OpenHamClock - Free Amateur Radio Dashboard">
-  <meta name="twitter:description" content="Live DX spots, PSK Reporter, RBN, POTA/SOTA, propagation, solar data, satellites, and world map — free for every ham. No login, no ads.">
-  <meta name="twitter:image" content="https://openhamclock.com/icons/og-image.png">
+    <!-- Open Graph (Facebook, Discord, iMessage, etc.) -->
+    <meta property="og:type" content="website" />
+    <meta property="og:url" content="https://openhamclock.com/" />
+    <meta property="og:title" content="OpenHamClock - Free Amateur Radio Dashboard" />
+    <meta
+      property="og:description"
+      content="Live DX cluster spots, PSK Reporter, RBN skimmer data, POTA/SOTA tracking, propagation predictions, solar indices, band conditions, satellite passes, and an interactive world map — all in one free browser-based dashboard. No login, no ads."
+    />
+    <meta property="og:image" content="https://openhamclock.com/icons/og-image.png" />
+    <meta property="og:image:width" content="1200" />
+    <meta property="og:image:height" content="630" />
+    <meta property="og:site_name" content="OpenHamClock" />
+    <meta property="og:locale" content="en_US" />
 
-  <!-- Favicons (cache-bust with version) -->
-  <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png?v=2">
-  <link rel="icon" type="image/x-icon" href="/favicon.ico?v=2">
-  <link rel="shortcut icon" href="/favicon.ico?v=2">
-  <link rel="icon" type="image/png" sizes="512x512" href="/icons/icon-512.png?v=2">
-  <link rel="icon" type="image/png" sizes="192x192" href="/icons/icon-192.png?v=2">
+    <!-- Twitter Card -->
+    <meta name="twitter:card" content="summary_large_image" />
+    <meta name="twitter:title" content="OpenHamClock - Free Amateur Radio Dashboard" />
+    <meta
+      name="twitter:description"
+      content="Live DX spots, PSK Reporter, RBN, POTA/SOTA, propagation, solar data, satellites, and world map — free for every ham. No login, no ads."
+    />
+    <meta name="twitter:image" content="https://openhamclock.com/icons/og-image.png" />
 
-  <!-- JSON-LD Structured Data -->
-  <script type="application/ld+json">
-  {
-    "@context": "https://schema.org",
-    "@type": "WebApplication",
-    "name": "OpenHamClock",
-    "alternateName": ["Ham Clock", "HamClock", "Open Ham Clock", "Open HamClock"],
-    "url": "https://openhamclock.com",
-    "description": "Free, real-time amateur radio operations dashboard with live DX cluster spots, PSK Reporter decodes, Reverse Beacon Network data, POTA/SOTA activator tracking, satellite passes, propagation predictions, solar indices, band conditions, space weather, and an interactive world map with great circle paths.",
-    "applicationCategory": "UtilitiesApplication",
-    "operatingSystem": "Any (Web Browser)",
-    "browserRequirements": "Requires a modern web browser",
-    "offers": {
-      "@type": "Offer",
-      "price": "0",
-      "priceCurrency": "USD"
-    },
-    "author": {
-      "@type": "Person",
-      "name": "Chris Hetherington",
-      "callSign": "K0CJH"
-    },
-    "sameAs": [
-      "https://github.com/accius/openhamclock",
-      "https://www.facebook.com/groups/1217043013897440",
-      "https://www.reddit.com/r/OpenHamClock/"
-    ],
-    "isAccessibleForFree": true,
-    "keywords": "ham clock, amateur radio dashboard, DX cluster, PSK Reporter, propagation, band conditions, POTA, SOTA, ham radio map"
-  }
-  </script>
-  
-  <!-- PWA -->
-  <link rel="manifest" href="/manifest.json">
-  <meta name="theme-color" content="#0a0e14">
-  <meta name="color-scheme" content="dark light">
-  
-  <!-- iOS PWA (Add to Home Screen → fullscreen standalone) -->
-  <meta name="apple-mobile-web-app-capable" content="yes">
-  <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
-  <meta name="apple-mobile-web-app-title" content="OpenHamClock">
-  <link rel="apple-touch-icon" sizes="180x180" href="/icons/apple-touch-icon.png?v=2">
-  
-  <!-- Android -->
-  <meta name="mobile-web-app-capable" content="yes">
-  
-  <!-- Fonts (self-hosted for privacy — run: bash scripts/vendor-download.sh) -->
-  <link href="/vendor/fonts/fonts.css" rel="stylesheet">
-  
-  <!-- Leaflet CSS (self-hosted) -->
-  <link rel="stylesheet" href="/vendor/leaflet/leaflet.css" />
-  
-  <!-- Leaflet JS (self-hosted) -->
-  <script src="/vendor/leaflet/leaflet.js"></script>
-</head>
-<body>
-  <div id="root"></div>
-  <script>
-    // Detect stale JS chunks after an update and force-reload once.
-    // After a server update, browsers may have old hashed JS cached.
-    // Old chunks import new chunks (or vice versa) → module error → blank screen.
-    // This catches that and reloads to get the fresh index.html + new chunk URLs.
-    window.addEventListener('error', function(e) {
-      var msg = (e.message || '') + ' ' + ((e.filename || '') + '');
-      if (
-        msg.indexOf('Failed to fetch dynamically imported module') !== -1 ||
-        msg.indexOf('Importing a module script failed') !== -1 ||
-        msg.indexOf('error loading dynamically imported module') !== -1 ||
-        msg.indexOf('ChunkLoadError') !== -1 ||
-        msg.indexOf('Loading chunk') !== -1 ||
-        (e.filename && e.filename.indexOf('/assets/') !== -1 && msg.indexOf('SyntaxError') !== -1)
-      ) {
-        // Only auto-reload once to prevent infinite loops
-        if (!sessionStorage.getItem('ohc_chunk_reload')) {
-          sessionStorage.setItem('ohc_chunk_reload', '1');
-          console.warn('[OpenHamClock] Stale JS detected after update — reloading...');
-          window.location.reload();
-        }
+    <!-- Favicons (cache-bust with version) -->
+    <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png?v=2" />
+    <link rel="icon" type="image/x-icon" href="/favicon.ico?v=2" />
+    <link rel="shortcut icon" href="/favicon.ico?v=2" />
+    <link rel="icon" type="image/png" sizes="512x512" href="/icons/icon-512.png?v=2" />
+    <link rel="icon" type="image/png" sizes="192x192" href="/icons/icon-192.png?v=2" />
+
+    <!-- JSON-LD Structured Data -->
+    <script type="application/ld+json">
+      {
+        "@context": "https://schema.org",
+        "@type": "WebApplication",
+        "name": "OpenHamClock",
+        "alternateName": ["Ham Clock", "HamClock", "Open Ham Clock", "Open HamClock"],
+        "url": "https://openhamclock.com",
+        "description": "Free, real-time amateur radio operations dashboard with live DX cluster spots, PSK Reporter decodes, Reverse Beacon Network data, POTA/SOTA activator tracking, satellite passes, propagation predictions, solar indices, band conditions, space weather, and an interactive world map with great circle paths.",
+        "applicationCategory": "UtilitiesApplication",
+        "operatingSystem": "Any (Web Browser)",
+        "browserRequirements": "Requires a modern web browser",
+        "offers": {
+          "@type": "Offer",
+          "price": "0",
+          "priceCurrency": "USD"
+        },
+        "author": {
+          "@type": "Person",
+          "name": "Chris Hetherington",
+          "callSign": "K0CJH"
+        },
+        "sameAs": [
+          "https://github.com/accius/openhamclock",
+          "https://www.facebook.com/groups/1217043013897440",
+          "https://www.reddit.com/r/OpenHamClock/"
+        ],
+        "isAccessibleForFree": true,
+        "keywords": "ham clock, amateur radio dashboard, DX cluster, PSK Reporter, propagation, band conditions, POTA, SOTA, ham radio map"
       }
-    });
-    // Clear the reload flag on successful load
-    window.addEventListener('load', function() {
-      sessionStorage.removeItem('ohc_chunk_reload');
-    });
-    // Also catch dynamic import() failures (rejected promises)
-    window.addEventListener('unhandledrejection', function(e) {
-      var msg = (e.reason && e.reason.message) || '';
-      if (
-        msg.indexOf('Failed to fetch dynamically imported module') !== -1 ||
-        msg.indexOf('Importing a module script failed') !== -1 ||
-        msg.indexOf('error loading dynamically imported module') !== -1
-      ) {
-        if (!sessionStorage.getItem('ohc_chunk_reload')) {
-          sessionStorage.setItem('ohc_chunk_reload', '1');
-          console.warn('[OpenHamClock] Stale module detected — reloading...');
-          window.location.reload();
+    </script>
+
+    <!-- PWA -->
+    <link rel="manifest" href="/manifest.json" />
+    <meta name="theme-color" content="#0a0e14" />
+    <meta name="color-scheme" content="dark light" />
+
+    <!-- iOS PWA (Add to Home Screen → fullscreen standalone) -->
+    <meta name="apple-mobile-web-app-capable" content="yes" />
+    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
+    <meta name="apple-mobile-web-app-title" content="OpenHamClock" />
+    <link rel="apple-touch-icon" sizes="180x180" href="/icons/apple-touch-icon.png?v=2" />
+
+    <!-- Android -->
+    <meta name="mobile-web-app-capable" content="yes" />
+
+    <!-- Fonts (self-hosted for privacy — run: bash scripts/vendor-download.sh) -->
+    <link href="/vendor/fonts/fonts.css" rel="stylesheet" />
+
+    <!-- Leaflet CSS (self-hosted) -->
+    <link rel="stylesheet" href="/vendor/leaflet/leaflet.css" />
+
+    <!-- Leaflet JS (self-hosted) -->
+    <script src="/vendor/leaflet/leaflet.js"></script>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script>
+      // Detect stale JS chunks after an update and force-reload once.
+      // After a server update, browsers may have old hashed JS cached.
+      // Old chunks import new chunks (or vice versa) → module error → blank screen.
+      // This catches that and reloads to get the fresh index.html + new chunk URLs.
+      window.addEventListener('error', function (e) {
+        var msg = (e.message || '') + ' ' + ((e.filename || '') + '');
+        if (
+          msg.indexOf('Failed to fetch dynamically imported module') !== -1 ||
+          msg.indexOf('Importing a module script failed') !== -1 ||
+          msg.indexOf('error loading dynamically imported module') !== -1 ||
+          msg.indexOf('ChunkLoadError') !== -1 ||
+          msg.indexOf('Loading chunk') !== -1 ||
+          (e.filename && e.filename.indexOf('/assets/') !== -1 && msg.indexOf('SyntaxError') !== -1)
+        ) {
+          // Only auto-reload once to prevent infinite loops
+          if (!sessionStorage.getItem('ohc_chunk_reload')) {
+            sessionStorage.setItem('ohc_chunk_reload', '1');
+            console.warn('[OpenHamClock] Stale JS detected after update — reloading...');
+            window.location.reload();
+          }
         }
-      }
-    });
-  </script>
-  <script type="module" src="/src/main.jsx"></script>
-</body>
+      });
+      // Clear the reload flag on successful load
+      window.addEventListener('load', function () {
+        sessionStorage.removeItem('ohc_chunk_reload');
+      });
+      // Also catch dynamic import() failures (rejected promises)
+      window.addEventListener('unhandledrejection', function (e) {
+        var msg = (e.reason && e.reason.message) || '';
+        if (
+          msg.indexOf('Failed to fetch dynamically imported module') !== -1 ||
+          msg.indexOf('Importing a module script failed') !== -1 ||
+          msg.indexOf('error loading dynamically imported module') !== -1
+        ) {
+          if (!sessionStorage.getItem('ohc_chunk_reload')) {
+            sessionStorage.setItem('ohc_chunk_reload', '1');
+            console.warn('[OpenHamClock] Stale module detected — reloading...');
+            window.location.reload();
+          }
+        }
+      });
+    </script>
+    <script type="module" src="/src/main.jsx"></script>
+  </body>
 </html>
diff --git a/iturhfprop-service/README.md b/iturhfprop-service/README.md
index d3219e3a..6be772ef 100644
--- a/iturhfprop-service/README.md
+++ b/iturhfprop-service/README.md
@@ -16,11 +16,13 @@ This microservice provides HF propagation predictions as a REST API, suitable fo
 ## API Endpoints
 
 ### Health Check
+
 ```
 GET /api/health
 ```
 
 Response:
+
 ```json
 {
   "status": "healthy",
@@ -30,6 +32,7 @@ Response:
 ```
 
 ### Single Point Prediction
+
 ```
 GET /api/predict?txLat=40.1&txLon=-74.8&rxLat=51.5&rxLon=-0.1&month=1&hour=12&ssn=100
 ```
@@ -49,6 +52,7 @@ Parameters:
 | frequencies | No | Comma-separated MHz values |
 
 Response:
+
 ```json
 {
   "model": "ITU-R P.533-14",
@@ -63,6 +67,7 @@ Response:
 ```
 
 ### 24-Hour Prediction
+
 ```
 GET /api/predict/hourly?txLat=40.1&txLon=-74.8&rxLat=51.5&rxLon=-0.1&month=1&ssn=100
 ```
@@ -70,11 +75,13 @@ GET /api/predict/hourly?txLat=40.1&txLon=-74.8&rxLat=51.5&rxLon=-0.1&month=1&ssn
 Returns predictions for each hour (0-23 UTC).
 
 ### Band Conditions (Simplified)
+
 ```
 GET /api/bands?txLat=40.1&txLon=-74.8&rxLat=51.5&rxLon=-0.1
 ```
 
 Response:
+
 ```json
 {
   "model": "ITU-R P.533-14",
@@ -96,6 +103,7 @@ Response:
 3. Deploy!
 
 The Dockerfile will:
+
 - Clone and build ITURHFProp from source
 - Set up the Node.js API wrapper
 - Configure all necessary data files
@@ -149,10 +157,10 @@ const ITURHFPROP_SERVICE = process.env.ITURHFPROP_URL || 'http://localhost:3001'
 
 app.get('/api/propagation', async (req, res) => {
   const { deLat, deLon, dxLat, dxLon } = req.query;
-  
+
   try {
     const response = await fetch(
-      `${ITURHFPROP_SERVICE}/api/bands?txLat=${deLat}&txLon=${deLon}&rxLat=${dxLat}&rxLon=${dxLon}`
+      `${ITURHFPROP_SERVICE}/api/bands?txLat=${deLat}&txLon=${deLon}&rxLat=${dxLat}&rxLon=${dxLon}`,
     );
     const data = await response.json();
     res.json(data);
@@ -174,6 +182,7 @@ app.get('/api/propagation', async (req, res) => {
 ### ITU-R P.533-14
 
 The prediction model accounts for:
+
 - F2-layer propagation (main HF mode)
 - E-layer propagation
 - Sporadic-E when applicable
@@ -200,10 +209,10 @@ ITURHFProp is provided by ITU-R Study Group 3 - see [ITU-R-Study-Group-3/ITU-R-H
 ## Credits
 
 - **ITURHFProp** by ITU-R Study Group 3 - The core prediction engine
-- **ITU-R P.533-14** - International Telecommunication Union recommendation  
+- **ITU-R P.533-14** - International Telecommunication Union recommendation
 - **Chris Behm & George Engelbrecht** - Original ITURHFProp developers
 - **OpenHamClock** - Integration target
 
 ---
 
-*73 de OpenHamClock contributors*
+_73 de OpenHamClock contributors_
diff --git a/iturhfprop-service/server.js b/iturhfprop-service/server.js
index 9fd3502f..96cb0038 100644
--- a/iturhfprop-service/server.js
+++ b/iturhfprop-service/server.js
@@ -1,9 +1,9 @@
 /**
  * ITURHFProp Service
- * 
+ *
  * REST API wrapper for the ITURHFProp HF propagation prediction engine
  * Implements ITU-R P.533-14 "Method for the prediction of the performance of HF circuits"
- * 
+ *
  * Endpoints:
  *   GET /api/predict - Single point prediction
  *   GET /api/predict/hourly - 24-hour prediction
@@ -37,7 +37,7 @@ let circuitBreakerOpen = false;
 let consecutiveFailures = 0;
 let lastFailureTime = 0;
 let lastLogTime = 0;
-const FAILURE_THRESHOLD = 3;  // Open after 3 failures
+const FAILURE_THRESHOLD = 3; // Open after 3 failures
 const CIRCUIT_RESET_TIME = 5 * 60 * 1000; // 5 minutes before retry
 const LOG_INTERVAL = 5 * 60 * 1000; // Only log every 5 minutes
 
@@ -49,7 +49,7 @@ function getCacheKey(params) {
 
 function getFromCache(key) {
   const cached = predictionCache.get(key);
-  if (cached && (Date.now() - cached.timestamp < CACHE_TTL)) {
+  if (cached && Date.now() - cached.timestamp < CACHE_TTL) {
     return cached.data;
   }
   predictionCache.delete(key);
@@ -76,7 +76,7 @@ function shouldLog() {
 
 function checkCircuitBreaker() {
   if (!circuitBreakerOpen) return false;
-  
+
   // Check if enough time has passed to try again
   if (Date.now() - lastFailureTime > CIRCUIT_RESET_TIME) {
     circuitBreakerOpen = false;
@@ -92,11 +92,13 @@ function checkCircuitBreaker() {
 function recordFailure() {
   consecutiveFailures++;
   lastFailureTime = Date.now();
-  
+
   if (consecutiveFailures >= FAILURE_THRESHOLD && !circuitBreakerOpen) {
     circuitBreakerOpen = true;
     if (shouldLog()) {
-      console.log(`[Circuit Breaker] OPEN after ${consecutiveFailures} failures - pausing for ${CIRCUIT_RESET_TIME/1000}s`);
+      console.log(
+        `[Circuit Breaker] OPEN after ${consecutiveFailures} failures - pausing for ${CIRCUIT_RESET_TIME / 1000}s`,
+      );
     }
   }
 }
@@ -117,7 +119,7 @@ if (!fs.existsSync(TEMP_DIR)) {
 
 // HF band frequencies (MHz) - P.533 valid range is 2-30 MHz
 const HF_BANDS = {
-  '160m': 2.0,    // Adjusted from 1.9 to meet P.533 minimum of 2 MHz
+  '160m': 2.0, // Adjusted from 1.9 to meet P.533 minimum of 2 MHz
   '80m': 3.5,
   '60m': 5.3,
   '40m': 7.1,
@@ -126,7 +128,7 @@ const HF_BANDS = {
   '17m': 18.1,
   '15m': 21.1,
   '12m': 24.9,
-  '10m': 28.1
+  '10m': 28.1,
   // Note: 11m (27 MHz) excluded - too close to P.533 upper limit, use built-in calculation
   // Note: 6m (50 MHz) excluded - outside P.533 HF range (2-30 MHz)
 };
@@ -136,16 +138,21 @@ const HF_BANDS = {
  */
 function generateInputFile(params) {
   const {
-    txLat, txLon, rxLat, rxLon,
-    year, month, hour,
+    txLat,
+    txLon,
+    rxLat,
+    rxLon,
+    year,
+    month,
+    hour,
     ssn = 100,
-    txPower = 100,  // Watts
-    txGain = 0,     // dBi
-    rxGain = 0,     // dBi
+    txPower = 100, // Watts
+    txGain = 0, // dBi
+    rxGain = 0, // dBi
     frequencies = Object.values(HF_BANDS),
-    manMadeNoise = 'RESIDENTIAL',  // CITY, RESIDENTIAL, RURAL, QUIET
+    manMadeNoise = 'RESIDENTIAL', // CITY, RESIDENTIAL, RURAL, QUIET
     requiredReliability = 90,
-    requiredSNR = 15  // dB for SSB
+    requiredSNR = 15, // dB for SSB
   } = params;
 
   // Convert coordinates to ITURHFProp format (decimal degrees)
@@ -155,8 +162,8 @@ function generateInputFile(params) {
   const rxLonStr = rxLon >= 0 ? `${rxLon.toFixed(2)} E` : `${Math.abs(rxLon).toFixed(2)} W`;
 
   // Format frequencies - comma-separated per ITURHFProp docs
-  const freqList = frequencies.map(f => f.toFixed(3)).join(', ');
-  
+  const freqList = frequencies.map((f) => f.toFixed(3)).join(', ');
+
   // ITURHFProp input file format - complete version with all required fields
   const input = `PathName "OpenHamClock"
 PathTXName "TX"
@@ -172,7 +179,7 @@ RXGOS 0.0
 AntennaOrientation "TX2RX"
 Path.year ${year}
 Path.month ${month}
-Path.hour ${isNaN(hour) ? 12 : (hour === 0 ? 24 : hour)}
+Path.hour ${isNaN(hour) ? 12 : hour === 0 ? 24 : hour}
 Path.SSN ${ssn}
 Path.frequency ${freqList}
 Path.txpower ${(10 * Math.log10(txPower)).toFixed(1)}
@@ -205,59 +212,59 @@ function parseOutputFile(outputPath) {
   try {
     const output = fs.readFileSync(outputPath, 'utf8');
     const lines = output.split('\n');
-    
+
     const results = {
       frequencies: [],
-      raw: output.substring(0, 3000)  // Include raw for debugging
+      raw: output.substring(0, 3000), // Include raw for debugging
     };
-    
+
     let inDataSection = false;
-    
+
     for (const line of lines) {
       const trimmed = line.trim();
-      
+
       // Look for "Calculated Parameters" section
       if (trimmed.includes('Calculated Parameters') && !trimmed.includes('End')) {
         inDataSection = true;
         continue;
       }
-      
+
       // Stop at end of data
       if (trimmed.includes('End Calculated') || trimmed.includes('*****')) {
         if (inDataSection && results.frequencies.length > 0) {
           break;
         }
       }
-      
+
       // Parse data lines: "02, 05,    2.000,-120.29, -16.04,   0.00"
       // Format: Month, Hour, Freq, Pr, SNR, BCR
       if (inDataSection && trimmed && !trimmed.startsWith('*') && !trimmed.startsWith('-')) {
-        const parts = trimmed.split(',').map(p => p.trim());
-        
+        const parts = trimmed.split(',').map((p) => p.trim());
+
         if (parts.length >= 6) {
           const freq = parseFloat(parts[2]);
           const pr = parseFloat(parts[3]);
           const snr = parseFloat(parts[4]);
           const bcr = parseFloat(parts[5]);
-          
+
           if (!isNaN(freq) && freq > 0) {
             results.frequencies.push({
               freq: freq,
               sdbw: pr,
               snr: snr,
-              reliability: bcr
+              reliability: bcr,
             });
           }
         }
       }
     }
-    
+
     // Extract MUF from header section
     const mufMatch = output.match(/(?:BMUF|MUF|Operational MUF)\s*[:=]?\s*([\d.]+)/i);
     if (mufMatch) {
       results.muf = parseFloat(mufMatch[1]);
     }
-    
+
     return results;
   } catch (err) {
     // File doesn't exist - this is expected when ITURHFProp fails
@@ -273,65 +280,67 @@ async function runPrediction(params) {
   if (checkCircuitBreaker()) {
     return { error: 'Circuit breaker open', frequencies: [], circuitBreakerOpen: true };
   }
-  
+
   // Check cache
   const cacheKey = getCacheKey(params);
   const cached = getFromCache(cacheKey);
   if (cached) {
     return { ...cached, fromCache: true };
   }
-  
+
   const id = crypto.randomBytes(8).toString('hex');
   const inputPath = path.join(TEMP_DIR, `input_${id}.txt`);
   const outputPath = path.join(TEMP_DIR, `output_${id}.txt`);
-  
+
   // Ensure temp dir exists
   if (!fs.existsSync(TEMP_DIR)) {
     fs.mkdirSync(TEMP_DIR, { recursive: true });
   }
-  
+
   try {
     // Generate input file
     const inputContent = generateInputFile(params);
     fs.writeFileSync(inputPath, inputContent);
-    
+
     // Run ITURHFProp
     const startTime = Date.now();
     const cmd = `${ITURHFPROP_PATH} ${inputPath} ${outputPath}`;
-    
+
     let execStdout = '';
     try {
       execStdout = execSync(cmd, {
         timeout: 30000,
         encoding: 'utf8',
-        env: { ...process.env, LD_LIBRARY_PATH: '/opt/iturhfprop:' + (process.env.LD_LIBRARY_PATH || '') }
+        env: { ...process.env, LD_LIBRARY_PATH: '/opt/iturhfprop:' + (process.env.LD_LIBRARY_PATH || '') },
       });
     } catch (execError) {
       recordFailure();
-      
+
       // Only log occasionally
       if (shouldLog()) {
-        console.error(`[ITURHFProp] Failed (exit ${execError.status}), failures: ${consecutiveFailures}, circuit: ${circuitBreakerOpen ? 'OPEN' : 'closed'}`);
+        console.error(
+          `[ITURHFProp] Failed (exit ${execError.status}), failures: ${consecutiveFailures}, circuit: ${circuitBreakerOpen ? 'OPEN' : 'closed'}`,
+        );
       }
-      
+
       // Cache the error to prevent repeated attempts
       const errorResult = { error: `Exit code ${execError.status}`, frequencies: [] };
       setCache(cacheKey, errorResult);
       return errorResult;
     }
-    
+
     const elapsed = Date.now() - startTime;
-    
+
     // Parse output
     const results = parseOutputFile(outputPath);
-    
+
     if (results.frequencies.length === 0) {
       recordFailure();
       const errorResult = { error: 'No frequency results', frequencies: [], elapsed };
       setCache(cacheKey, errorResult);
       return errorResult;
     }
-    
+
     // Success!
     recordSuccess();
     results.elapsed = elapsed;
@@ -342,18 +351,17 @@ async function runPrediction(params) {
       rxLon: params.rxLon,
       hour: params.hour,
       month: params.month,
-      ssn: params.ssn
+      ssn: params.ssn,
     };
-    
+
     // Cache successful result
     setCache(cacheKey, results);
-    
+
     if (shouldLog()) {
       console.log(`[ITURHFProp] Success: ${results.frequencies.length} freqs, MUF=${results.muf || 'N/A'}`);
     }
-    
+
     return results;
-    
   } finally {
     // Cleanup temp files
     try {
@@ -376,16 +384,17 @@ app.get('/api/health', (req, res) => {
   const binaryExists = fs.existsSync(ITURHFPROP_PATH);
   const dataExists = fs.existsSync(ITURHFPROP_DATA);
   const dataSubExists = fs.existsSync(ITURHFPROP_DATA + '/Data');
-  
+
   // Check for shared libraries
   const libp533Exists = fs.existsSync('/opt/iturhfprop/libp533.so');
   const libp372Exists = fs.existsSync('/opt/iturhfprop/libp372.so');
-  
+
   // Check for ionospheric data (ionos12.bin in Data folder)
   const ionosDataExists = fs.existsSync(ITURHFPROP_DATA + '/Data/ionos12.bin');
-  
+
   res.json({
-    status: binaryExists && dataSubExists && libp533Exists && ionosDataExists && !circuitBreakerOpen ? 'healthy' : 'degraded',
+    status:
+      binaryExists && dataSubExists && libp533Exists && ionosDataExists && !circuitBreakerOpen ? 'healthy' : 'degraded',
     service: 'iturhfprop',
     version: '1.0.0',
     engine: 'ITURHFProp (ITU-R P.533-14)',
@@ -397,13 +406,13 @@ app.get('/api/health', (req, res) => {
     circuitBreaker: {
       open: circuitBreakerOpen,
       consecutiveFailures,
-      cacheSize: predictionCache.size
+      cacheSize: predictionCache.size,
     },
     paths: {
       binary: ITURHFPROP_PATH,
-      data: ITURHFPROP_DATA
+      data: ITURHFPROP_DATA,
     },
-    timestamp: new Date().toISOString()
+    timestamp: new Date().toISOString(),
   });
 });
 
@@ -415,9 +424,9 @@ app.get('/api/diag', async (req, res) => {
     binary: {},
     libraries: {},
     data: {},
-    testRun: {}
+    testRun: {},
   };
-  
+
   // Check binary
   try {
     const stats = fs.statSync(ITURHFPROP_PATH);
@@ -425,20 +434,20 @@ app.get('/api/diag', async (req, res) => {
       exists: true,
       size: stats.size,
       mode: stats.mode.toString(8),
-      path: ITURHFPROP_PATH
+      path: ITURHFPROP_PATH,
     };
   } catch (e) {
     results.binary = { exists: false, error: e.message };
   }
-  
+
   // Check libraries
   try {
-    const libs = fs.readdirSync('/opt/iturhfprop').filter(f => f.endsWith('.so'));
+    const libs = fs.readdirSync('/opt/iturhfprop').filter((f) => f.endsWith('.so'));
     results.libraries = { found: libs };
   } catch (e) {
     results.libraries = { error: e.message };
   }
-  
+
   // Check data files
   try {
     const dataFiles = fs.readdirSync(ITURHFPROP_DATA + '/Data').slice(0, 15);
@@ -446,7 +455,7 @@ app.get('/api/diag', async (req, res) => {
   } catch (e) {
     results.data.dataDir = { error: e.message };
   }
-  
+
   // Check for ionospheric data
   try {
     const ionosExists = fs.existsSync(ITURHFPROP_DATA + '/Data/ionos12.bin');
@@ -454,7 +463,7 @@ app.get('/api/diag', async (req, res) => {
   } catch (e) {
     results.data.ionosData = { error: e.message };
   }
-  
+
   // Try running ldd on the binary
   try {
     const { execSync } = require('child_process');
@@ -463,30 +472,30 @@ app.get('/api/diag', async (req, res) => {
   } catch (e) {
     results.testRun.ldd = { error: e.message };
   }
-  
+
   // Try running the binary with no args to see usage
   try {
     const { execSync } = require('child_process');
-    const output = execSync(`${ITURHFPROP_PATH} 2>&1 || true`, { 
+    const output = execSync(`${ITURHFPROP_PATH} 2>&1 || true`, {
       encoding: 'utf8',
-      env: { ...process.env, LD_LIBRARY_PATH: '/opt/iturhfprop' }
+      env: { ...process.env, LD_LIBRARY_PATH: '/opt/iturhfprop' },
     });
     results.testRun.usage = output.split('\n').slice(0, 10);
   } catch (e) {
     results.testRun.usage = { error: e.message, stderr: e.stderr?.toString(), stdout: e.stdout?.toString() };
   }
-  
+
   // List ALL files in Data directory
   try {
     const allDataFiles = fs.readdirSync(ITURHFPROP_DATA + '/Data');
     results.data.allFiles = allDataFiles;
-    results.data.hasIonos = allDataFiles.some(f => f.includes('ionos'));
-    results.data.hasAnt = allDataFiles.some(f => f.endsWith('.ant'));
+    results.data.hasIonos = allDataFiles.some((f) => f.includes('ionos'));
+    results.data.hasAnt = allDataFiles.some((f) => f.endsWith('.ant'));
     results.data.fileCount = allDataFiles.length;
   } catch (e) {
     results.data.allFiles = { error: e.message };
   }
-  
+
   // Create a minimal test input file and try to run
   try {
     const { execSync } = require('child_process');
@@ -528,13 +537,16 @@ RptFileFormat "RPT_PR | RPT_SNR | RPT_BCR"
 `;
     fs.writeFileSync('/tmp/test_input.txt', testInput);
     results.testRun.inputFile = testInput.split('\n');
-    
-    const testOutput = execSync(`${ITURHFPROP_PATH} /tmp/test_input.txt /tmp/test_output.txt 2>&1 || echo "Exit code: $?"`, {
-      encoding: 'utf8',
-      env: { ...process.env, LD_LIBRARY_PATH: '/opt/iturhfprop' }
-    });
+
+    const testOutput = execSync(
+      `${ITURHFPROP_PATH} /tmp/test_input.txt /tmp/test_output.txt 2>&1 || echo "Exit code: $?"`,
+      {
+        encoding: 'utf8',
+        env: { ...process.env, LD_LIBRARY_PATH: '/opt/iturhfprop' },
+      },
+    );
     results.testRun.testExec = testOutput.split('\n').slice(0, 20);
-    
+
     // Check if output was created
     if (fs.existsSync('/tmp/test_output.txt')) {
       const output = fs.readFileSync('/tmp/test_output.txt', 'utf8');
@@ -545,29 +557,35 @@ RptFileFormat "RPT_PR | RPT_SNR | RPT_BCR"
   } catch (e) {
     results.testRun.testExec = { error: e.message, stderr: e.stderr?.toString(), stdout: e.stdout?.toString() };
   }
-  
+
   res.json(results);
 });
 
 /**
  * Single point prediction
- * 
+ *
  * GET /api/predict?txLat=40&txLon=-74&rxLat=51&rxLon=0&month=1&hour=12&ssn=100
  */
 app.get('/api/predict', async (req, res) => {
   try {
     const {
-      txLat, txLon, rxLat, rxLon,
-      month, hour, ssn,
+      txLat,
+      txLon,
+      rxLat,
+      rxLon,
+      month,
+      hour,
+      ssn,
       year = new Date().getFullYear(),
-      txPower, frequencies
+      txPower,
+      frequencies,
     } = req.query;
-    
+
     // Validate required params
     if (!txLat || !txLon || !rxLat || !rxLon) {
       return res.status(400).json({ error: 'Missing required coordinates (txLat, txLon, rxLat, rxLon)' });
     }
-    
+
     const params = {
       txLat: parseFloat(txLat),
       txLon: parseFloat(txLon),
@@ -577,21 +595,20 @@ app.get('/api/predict', async (req, res) => {
       month: parseInt(month) || new Date().getMonth() + 1,
       hour: parseInt(hour) || new Date().getUTCHours() || 12,
       ssn: parseInt(ssn) || 100,
-      txPower: parseInt(txPower) || 100
+      txPower: parseInt(txPower) || 100,
     };
-    
+
     if (frequencies) {
-      params.frequencies = frequencies.split(',').map(f => parseFloat(f));
+      params.frequencies = frequencies.split(',').map((f) => parseFloat(f));
     }
-    
+
     const results = await runPrediction(params);
-    
+
     res.json({
       model: 'ITU-R P.533-14',
       engine: 'ITURHFProp',
-      ...results
+      ...results,
     });
-    
   } catch (err) {
     console.error('[API Error]', err);
     res.status(500).json({ error: err.message });
@@ -600,22 +617,18 @@ app.get('/api/predict', async (req, res) => {
 
 /**
  * 24-hour prediction
- * 
+ *
  * GET /api/predict/hourly?txLat=40&txLon=-74&rxLat=51&rxLon=0&month=1&ssn=100
  */
 app.get('/api/predict/hourly', async (req, res) => {
   try {
-    const {
-      txLat, txLon, rxLat, rxLon,
-      month, ssn,
-      year = new Date().getFullYear()
-    } = req.query;
-    
+    const { txLat, txLon, rxLat, rxLon, month, ssn, year = new Date().getFullYear() } = req.query;
+
     // Validate required params
     if (!txLat || !txLon || !rxLat || !rxLon) {
       return res.status(400).json({ error: 'Missing required coordinates (txLat, txLon, rxLat, rxLon)' });
     }
-    
+
     const baseParams = {
       txLat: parseFloat(txLat),
       txLon: parseFloat(txLon),
@@ -623,12 +636,12 @@ app.get('/api/predict/hourly', async (req, res) => {
       rxLon: parseFloat(rxLon),
       year: parseInt(year),
       month: parseInt(month) || new Date().getMonth() + 1,
-      ssn: parseInt(ssn) || 100
+      ssn: parseInt(ssn) || 100,
     };
-    
+
     // Run predictions for each hour (0-23 UTC)
     const hourlyResults = [];
-    
+
     for (let hour = 0; hour < 24; hour++) {
       const params = { ...baseParams, hour };
       try {
@@ -636,29 +649,28 @@ app.get('/api/predict/hourly', async (req, res) => {
         hourlyResults.push({
           hour,
           muf: result.muf,
-          frequencies: result.frequencies
+          frequencies: result.frequencies,
         });
       } catch (err) {
         hourlyResults.push({
           hour,
-          error: err.message
+          error: err.message,
         });
       }
     }
-    
+
     res.json({
       model: 'ITU-R P.533-14',
       engine: 'ITURHFProp',
       path: {
         tx: { lat: baseParams.txLat, lon: baseParams.txLon },
-        rx: { lat: baseParams.rxLat, lon: baseParams.rxLon }
+        rx: { lat: baseParams.rxLat, lon: baseParams.rxLon },
       },
       month: baseParams.month,
       year: baseParams.year,
       ssn: baseParams.ssn,
-      hourly: hourlyResults
+      hourly: hourlyResults,
     });
-    
   } catch (err) {
     console.error('[API Error]', err);
     res.status(500).json({ error: err.message });
@@ -667,20 +679,17 @@ app.get('/api/predict/hourly', async (req, res) => {
 
 /**
  * Band conditions (simplified format for OpenHamClock)
- * 
+ *
  * GET /api/bands?txLat=40&txLon=-74&rxLat=51&rxLon=0
  */
 app.get('/api/bands', async (req, res) => {
   try {
-    const {
-      txLat, txLon, rxLat, rxLon,
-      month, hour, ssn
-    } = req.query;
-    
+    const { txLat, txLon, rxLat, rxLon, month, hour, ssn } = req.query;
+
     if (!txLat || !txLon || !rxLat || !rxLon) {
       return res.status(400).json({ error: 'Missing required coordinates' });
     }
-    
+
     const params = {
       txLat: parseFloat(txLat),
       txLon: parseFloat(txLon),
@@ -690,20 +699,18 @@ app.get('/api/bands', async (req, res) => {
       month: parseInt(month) || new Date().getMonth() + 1,
       hour: parseInt(hour) || new Date().getUTCHours() || 12,
       ssn: parseInt(ssn) || 100,
-      frequencies: Object.values(HF_BANDS)
+      frequencies: Object.values(HF_BANDS),
     };
-    
+
     const results = await runPrediction(params);
-    
+
     // Map to band names
     const bands = {};
     const bandFreqs = Object.entries(HF_BANDS);
-    
+
     for (const freqResult of results.frequencies) {
-      const bandEntry = bandFreqs.find(([name, freq]) => 
-        Math.abs(freq - freqResult.freq) < 1
-      );
-      
+      const bandEntry = bandFreqs.find(([name, freq]) => Math.abs(freq - freqResult.freq) < 1);
+
       if (bandEntry) {
         const [bandName] = bandEntry;
         bands[bandName] = {
@@ -711,12 +718,11 @@ app.get('/api/bands', async (req, res) => {
           reliability: freqResult.reliability,
           snr: freqResult.snr,
           sdbw: freqResult.sdbw,
-          status: freqResult.reliability >= 70 ? 'GOOD' :
-                  freqResult.reliability >= 40 ? 'FAIR' : 'POOR'
+          status: freqResult.reliability >= 70 ? 'GOOD' : freqResult.reliability >= 40 ? 'FAIR' : 'POOR',
         };
       }
     }
-    
+
     res.json({
       model: 'ITU-R P.533-14',
       muf: results.muf,
@@ -727,11 +733,10 @@ app.get('/api/bands', async (req, res) => {
         parsedFreqs: results.frequencies,
         execStdout: results.execStdout,
         execStderr: results.execStderr,
-        inputContent: results.inputContent?.substring(0, 1000)
+        inputContent: results.inputContent?.substring(0, 1000),
       },
-      timestamp: new Date().toISOString()
+      timestamp: new Date().toISOString(),
     });
-    
   } catch (err) {
     console.error('[API Error]', err);
     res.status(500).json({ error: err.message });
diff --git a/package.json b/package.json
index 9a6ac652..701767ef 100644
--- a/package.json
+++ b/package.json
@@ -7,7 +7,7 @@
     "dev": "npx vite",
     "electron": "electron .",
     "electron-builder": "electron-builder",
-    "build": "npx vite build",    
+    "build": "npx vite build",
     "preview": "npx vite preview",
     "prestart": "npm run build",
     "server": "node server.js",
@@ -77,4 +77,4 @@
     }
   ],
   "license": "MIT"
-}
\ No newline at end of file
+}
diff --git a/public/index.html b/public/index.html
index d5887b6f..f8ae703b 100644
--- a/public/index.html
+++ b/public/index.html
@@ -1,95 +1,102 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>OpenHamClock - Amateur Radio Dashboard | Live DX Cluster, Propagation, Band Conditions</title>
-  <meta name="description" content="OpenHamClock is a free, real-time amateur radio dashboard with live DX cluster spots, PSK Reporter, RBN, POTA/SOTA tracking, propagation predictions, solar indices, band conditions, satellite passes, and world map. No login, no ads.">
-  <link rel="canonical" href="https://openhamclock.com/">
-  <style>
-    * { margin: 0; padding: 0; box-sizing: border-box; }
-    body {
-      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
-      background: #1a1a2e;
-      color: #eee;
-      min-height: 100vh;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-    }
-    .container {
-      text-align: center;
-      padding: 40px;
-      max-width: 600px;
-    }
-    h1 {
-      color: #fbbf24;
-      font-size: 2.5rem;
-      margin-bottom: 20px;
-    }
-    p {
-      font-size: 1.1rem;
-      line-height: 1.6;
-      margin-bottom: 15px;
-      color: #aaa;
-    }
-    code {
-      background: #2d2d44;
-      padding: 4px 10px;
-      border-radius: 4px;
-      font-family: 'JetBrains Mono', monospace;
-      color: #4ade80;
-    }
-    .command {
-      background: #2d2d44;
-      padding: 20px;
-      border-radius: 8px;
-      margin: 30px 0;
-      text-align: left;
-    }
-    .command code {
-      display: block;
-      background: none;
-      padding: 5px 0;
-    }
-    a.button {
-      display: inline-block;
-      background: #4ade80;
-      color: #1a1a2e;
-      padding: 12px 24px;
-      border-radius: 6px;
-      text-decoration: none;
-      font-weight: bold;
-      margin: 20px 0;
-    }
-    a.button:hover {
-      background: #22c55e;
-    }
-    .note {
-      font-size: 0.9rem;
-      color: #888;
-      margin-top: 30px;
-    }
-  </style>
-</head>
-<body>
-  <div class="container">
-    <h1>📻 OpenHamClock</h1>
-    <p>The modular frontend needs to be built first.</p>
-    
-    <a href="/index-monolithic.html" class="button">Use Classic Version Instead</a>
-    
-    <p style="margin-top: 30px;">Or build the modular version:</p>
-    <div class="command">
-      <code>npm install</code>
-      <code>npm run build</code>
-      <code>npm start</code>
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>OpenHamClock - Amateur Radio Dashboard | Live DX Cluster, Propagation, Band Conditions</title>
+    <meta
+      name="description"
+      content="OpenHamClock is a free, real-time amateur radio dashboard with live DX cluster spots, PSK Reporter, RBN, POTA/SOTA tracking, propagation predictions, solar indices, band conditions, satellite passes, and world map. No login, no ads."
+    />
+    <link rel="canonical" href="https://openhamclock.com/" />
+    <style>
+      * {
+        margin: 0;
+        padding: 0;
+        box-sizing: border-box;
+      }
+      body {
+        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+        background: #1a1a2e;
+        color: #eee;
+        min-height: 100vh;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+      }
+      .container {
+        text-align: center;
+        padding: 40px;
+        max-width: 600px;
+      }
+      h1 {
+        color: #fbbf24;
+        font-size: 2.5rem;
+        margin-bottom: 20px;
+      }
+      p {
+        font-size: 1.1rem;
+        line-height: 1.6;
+        margin-bottom: 15px;
+        color: #aaa;
+      }
+      code {
+        background: #2d2d44;
+        padding: 4px 10px;
+        border-radius: 4px;
+        font-family: 'JetBrains Mono', monospace;
+        color: #4ade80;
+      }
+      .command {
+        background: #2d2d44;
+        padding: 20px;
+        border-radius: 8px;
+        margin: 30px 0;
+        text-align: left;
+      }
+      .command code {
+        display: block;
+        background: none;
+        padding: 5px 0;
+      }
+      a.button {
+        display: inline-block;
+        background: #4ade80;
+        color: #1a1a2e;
+        padding: 12px 24px;
+        border-radius: 6px;
+        text-decoration: none;
+        font-weight: bold;
+        margin: 20px 0;
+      }
+      a.button:hover {
+        background: #22c55e;
+      }
+      .note {
+        font-size: 0.9rem;
+        color: #888;
+        margin-top: 30px;
+      }
+    </style>
+  </head>
+  <body>
+    <div class="container">
+      <h1>📻 OpenHamClock</h1>
+      <p>The modular frontend needs to be built first.</p>
+
+      <a href="/index-monolithic.html" class="button">Use Classic Version Instead</a>
+
+      <p style="margin-top: 30px">Or build the modular version:</p>
+      <div class="command">
+        <code>npm install</code>
+        <code>npm run build</code>
+        <code>npm start</code>
+      </div>
+
+      <p class="note">
+        The classic version works without building.<br />
+        The modular version requires Node.js 18+ to build.
+      </p>
     </div>
-    
-    <p class="note">
-      The classic version works without building.<br>
-      The modular version requires Node.js 18+ to build.
-    </p>
-  </div>
-</body>
+  </body>
 </html>
diff --git a/rig-bridge/README.md b/rig-bridge/README.md
index 2ebbd4d5..e5e9359c 100644
--- a/rig-bridge/README.md
+++ b/rig-bridge/README.md
@@ -7,13 +7,15 @@ The Rig Bridge connects OpenHamClock directly to your radio via USB — no flrig
 ## Supported Radios
 
 ### Direct USB (Recommended)
-| Brand | Protocol | Tested Models |
-|-------|----------|---------------|
-| **Yaesu** | CAT | FT-991A, FT-891, FT-710, FT-DX10, FT-DX101, FT-5000 |
-| **Kenwood** | Kenwood | TS-890, TS-590, TS-2000, TS-480 |
-| **Icom** | CI-V | IC-7300, IC-7610, IC-9700, IC-705, IC-7851 |
+
+| Brand       | Protocol | Tested Models                                       |
+| ----------- | -------- | --------------------------------------------------- |
+| **Yaesu**   | CAT      | FT-991A, FT-891, FT-710, FT-DX10, FT-DX101, FT-5000 |
+| **Kenwood** | Kenwood  | TS-890, TS-590, TS-2000, TS-480                     |
+| **Icom**    | CI-V     | IC-7300, IC-7610, IC-9700, IC-705, IC-7851          |
 
 ### Via Control Software (Legacy)
+
 Still works with **flrig** or **rigctld** if you prefer.
 
 ---
@@ -21,6 +23,7 @@ Still works with **flrig** or **rigctld** if you prefer.
 ## Quick Start
 
 ### Option A: Download the Executable (Easiest)
+
 1. Download the right file for your OS from the Releases page
 2. Double-click to run
 3. Open **http://localhost:5555** in your browser
@@ -28,11 +31,13 @@ Still works with **flrig** or **rigctld** if you prefer.
 5. Click **Save & Connect**
 
 ### Option B: Run with Node.js
+
 ```bash
 cd rig-bridge
 npm install
 node rig-bridge.js
 ```
+
 Then open **http://localhost:5555** to configure.
 
 ---
@@ -40,16 +45,19 @@ Then open **http://localhost:5555** to configure.
 ## Radio Setup Tips
 
 ### Yaesu FT-991A
+
 1. Connect USB-B cable from radio to computer
 2. On the radio: **Menu → Operation Setting → CAT Rate → 38400**
 3. In Rig Bridge: Select **Yaesu**, pick your COM port, baud **38400**, stop bits **2**
 
 ### Icom IC-7300
+
 1. Connect USB cable from radio to computer
 2. On the radio: **Menu → Connectors → CI-V → CI-V USB Baud Rate → 115200**
 3. In Rig Bridge: Select **Icom**, pick COM port, baud **115200**, stop bits **1**, address **0x94**
 
 ### Kenwood TS-590
+
 1. Connect USB cable from radio to computer
 2. In Rig Bridge: Select **Kenwood**, pick COM port, baud **9600**, stop bits **1**
 
@@ -87,13 +95,13 @@ Executables are output to the `dist/` folder.
 
 ## Troubleshooting
 
-| Problem | Solution |
-|---------|----------|
-| No COM ports found | Install USB driver (Silicon Labs CP210x for Yaesu, FTDI for some Kenwood) |
-| Port opens but no data | Check baud rate matches radio's CAT Rate setting |
-| Icom not responding | Verify CI-V address matches your radio model |
-| CORS errors in browser | The bridge allows all origins by default |
-| Port already in use | Close flrig/rigctld if running — you don't need them anymore |
+| Problem                | Solution                                                                  |
+| ---------------------- | ------------------------------------------------------------------------- |
+| No COM ports found     | Install USB driver (Silicon Labs CP210x for Yaesu, FTDI for some Kenwood) |
+| Port opens but no data | Check baud rate matches radio's CAT Rate setting                          |
+| Icom not responding    | Verify CI-V address matches your radio model                              |
+| CORS errors in browser | The bridge allows all origins by default                                  |
+| Port already in use    | Close flrig/rigctld if running — you don't need them anymore              |
 
 ---
 
@@ -101,13 +109,13 @@ Executables are output to the `dist/` folder.
 
 Same API as the original rig-daemon — fully backward compatible:
 
-| Method | Endpoint | Description |
-|--------|----------|-------------|
-| GET | `/status` | Current freq, mode, PTT, connected status |
-| GET | `/stream` | SSE stream of real-time updates |
-| POST | `/freq` | Set frequency: `{ "freq": 14074000 }` |
-| POST | `/mode` | Set mode: `{ "mode": "USB" }` |
-| POST | `/ptt` | Set PTT: `{ "ptt": true }` |
-| GET | `/api/ports` | List available serial ports |
-| GET | `/api/config` | Get current configuration |
-| POST | `/api/config` | Update configuration & reconnect |
+| Method | Endpoint      | Description                               |
+| ------ | ------------- | ----------------------------------------- |
+| GET    | `/status`     | Current freq, mode, PTT, connected status |
+| GET    | `/stream`     | SSE stream of real-time updates           |
+| POST   | `/freq`       | Set frequency: `{ "freq": 14074000 }`     |
+| POST   | `/mode`       | Set mode: `{ "mode": "USB" }`             |
+| POST   | `/ptt`        | Set PTT: `{ "ptt": true }`                |
+| GET    | `/api/ports`  | List available serial ports               |
+| GET    | `/api/config` | Get current configuration                 |
+| POST   | `/api/config` | Update configuration & reconnect          |
diff --git a/rig-bridge/rig-bridge.js b/rig-bridge/rig-bridge.js
index d06b1676..ff49d635 100644
--- a/rig-bridge/rig-bridge.js
+++ b/rig-bridge/rig-bridge.js
@@ -1,15 +1,15 @@
 #!/usr/bin/env node
 /**
  * OpenHamClock Rig Bridge v1.0.0
- * 
+ *
  * Standalone bridge that talks DIRECTLY to your radio via USB serial.
  * No flrig, no rigctld, no Node.js install needed (when compiled with pkg).
- * 
+ *
  * Supports: Yaesu (FT-991A, FT-891, FT-710, FT-DX10, FT-DX101, etc.)
  *           Kenwood (TS-890, TS-590, TS-2000, etc.)
  *           Icom (IC-7300, IC-7610, IC-9700, IC-705, etc.)
  *           + Legacy flrig/rigctld backends
- * 
+ *
  * Usage:  node rig-bridge.js          (then open http://localhost:5555 to configure)
  *         ohc-rig-bridge-win.exe      (compiled standalone)
  */
@@ -21,22 +21,20 @@ const path = require('path');
 const net = require('net');
 
 // ─── Portable config path (works in pkg snapshots too) ───
-const CONFIG_DIR = process.pkg
-  ? path.dirname(process.execPath)
-  : __dirname;
+const CONFIG_DIR = process.pkg ? path.dirname(process.execPath) : __dirname;
 const CONFIG_PATH = path.join(CONFIG_DIR, 'rig-bridge-config.json');
 
 // ─── Defaults ───
 const DEFAULT_CONFIG = {
   port: 5555,
   radio: {
-    type: 'none',          // none | yaesu | kenwood | icom | flrig | rigctld
-    serialPort: '',        // COM3, /dev/ttyUSB0, etc.
+    type: 'none', // none | yaesu | kenwood | icom | flrig | rigctld
+    serialPort: '', // COM3, /dev/ttyUSB0, etc.
     baudRate: 38400,
     dataBits: 8,
-    stopBits: 2,           // Yaesu default; Icom/Kenwood typically 1
+    stopBits: 2, // Yaesu default; Icom/Kenwood typically 1
     parity: 'none',
-    icomAddress: '0x94',   // Default CI-V address for IC-7300
+    icomAddress: '0x94', // Default CI-V address for IC-7300
     pollInterval: 500,
     pttEnabled: false,
     // Legacy backend settings
@@ -44,7 +42,7 @@ const DEFAULT_CONFIG = {
     rigctldPort: 4532,
     flrigHost: '127.0.0.1',
     flrigPort: 12345,
-  }
+  },
 };
 
 // ─── Load / save config ───
@@ -56,7 +54,7 @@ function loadConfig() {
       config = {
         ...DEFAULT_CONFIG,
         ...raw,
-        radio: { ...DEFAULT_CONFIG.radio, ...(raw.radio || {}) }
+        radio: { ...DEFAULT_CONFIG.radio, ...(raw.radio || {}) },
       };
       console.log(`[Config] Loaded from ${CONFIG_PATH}`);
     }
@@ -94,7 +92,7 @@ const state = {
 let sseClients = [];
 function broadcast(data) {
   const msg = `data: ${JSON.stringify(data)}\n\n`;
-  sseClients.forEach(c => c.res.write(msg));
+  sseClients.forEach((c) => c.res.write(msg));
 }
 function updateState(prop, value) {
   if (state[prop] !== value) {
@@ -131,7 +129,7 @@ async function listPorts() {
   try {
     const { SerialPort: SP } = require('serialport');
     const ports = await SP.list();
-    return ports.map(p => ({
+    return ports.map((p) => ({
       path: p.path,
       manufacturer: p.manufacturer || '',
       serialNumber: p.serialNumber || '',
@@ -153,7 +151,7 @@ function connectSerial() {
   disconnectSerial();
 
   console.log(`[Serial] Opening ${config.radio.serialPort} at ${config.radio.baudRate} baud...`);
-  
+
   serialConnection = new SP({
     path: config.radio.serialPort,
     baudRate: config.radio.baudRate,
@@ -207,7 +205,9 @@ function connectSerial() {
 function disconnectSerial() {
   stopPolling();
   if (serialConnection && serialConnection.isOpen) {
-    try { serialConnection.close(); } catch (e) {}
+    try {
+      serialConnection.close();
+    } catch (e) {}
   }
   serialConnection = null;
 }
@@ -223,11 +223,17 @@ function startPolling() {
   stopPolling();
   pollTimer = setInterval(() => {
     if (!serialConnection || !serialConnection.isOpen) return;
-    
+
     switch (config.radio.type) {
-      case 'yaesu':   pollYaesu(); break;
-      case 'kenwood':  pollKenwood(); break;
-      case 'icom':     pollIcom(); break;
+      case 'yaesu':
+        pollYaesu();
+        break;
+      case 'kenwood':
+        pollKenwood();
+        break;
+      case 'icom':
+        pollIcom();
+        break;
     }
   }, config.radio.pollInterval || 500);
 }
@@ -246,7 +252,7 @@ function stopPolling() {
 // ═══════════════════════════════════════════════════════
 
 function pollYaesu() {
-  // FA = read VFO-A freq, MD0 = read main mode  
+  // FA = read VFO-A freq, MD0 = read main mode
   // More reliable across models than IF which varies in format
   serialWrite('FA;');
   // Stagger mode query slightly to avoid buffer collisions
@@ -258,7 +264,7 @@ function processAsciiBuffer() {
   while ((idx = rxBuffer.indexOf(';')) !== -1) {
     const response = rxBuffer.substring(0, idx);
     rxBuffer = rxBuffer.substring(idx + 1);
-    
+
     if (config.radio.type === 'yaesu') {
       parseYaesuResponse(response);
     } else if (config.radio.type === 'kenwood') {
@@ -319,14 +325,26 @@ function parseYaesuResponse(resp) {
 }
 
 const YAESU_MODES = {
-  '1': 'LSB', '2': 'USB', '3': 'CW', '4': 'FM',
-  '5': 'AM', '6': 'RTTY-LSB', '7': 'CW-R', '8': 'DATA-LSB',
-  '9': 'RTTY-USB', 'A': 'DATA-FM', 'B': 'FM-N', 'C': 'DATA-USB',
-  'D': 'AM-N', 'E': 'C4FM'
+  1: 'LSB',
+  2: 'USB',
+  3: 'CW',
+  4: 'FM',
+  5: 'AM',
+  6: 'RTTY-LSB',
+  7: 'CW-R',
+  8: 'DATA-LSB',
+  9: 'RTTY-USB',
+  A: 'DATA-FM',
+  B: 'FM-N',
+  C: 'DATA-USB',
+  D: 'AM-N',
+  E: 'C4FM',
 };
 
 const YAESU_MODE_REVERSE = {};
-Object.entries(YAESU_MODES).forEach(([k, v]) => { YAESU_MODE_REVERSE[v] = k; });
+Object.entries(YAESU_MODES).forEach(([k, v]) => {
+  YAESU_MODE_REVERSE[v] = k;
+});
 
 function yaesuSetFreq(hz) {
   const padded = String(Math.round(hz)).padStart(9, '0');
@@ -339,10 +357,22 @@ function yaesuSetMode(mode) {
   // Try common aliases
   if (!digit) {
     const aliases = {
-      'USB': '2', 'LSB': '1', 'CW': '3', 'CW-R': '7',
-      'FM': '4', 'AM': '5', 'DATA-USB': 'C', 'DATA-LSB': '8',
-      'RTTY': '6', 'RTTY-R': '9', 'FT8': 'C', 'FT4': 'C',
-      'DIGI': 'C', 'SSB': '2', 'PSK': 'C', 'JT65': 'C',
+      USB: '2',
+      LSB: '1',
+      CW: '3',
+      'CW-R': '7',
+      FM: '4',
+      AM: '5',
+      'DATA-USB': 'C',
+      'DATA-LSB': '8',
+      RTTY: '6',
+      'RTTY-R': '9',
+      FT8: 'C',
+      FT4: 'C',
+      DIGI: 'C',
+      SSB: '2',
+      PSK: 'C',
+      JT65: 'C',
     };
     digit = aliases[mode.toUpperCase()];
   }
@@ -405,13 +435,22 @@ function parseKenwoodResponse(resp) {
 }
 
 const KENWOOD_MODES = {
-  '1': 'LSB', '2': 'USB', '3': 'CW', '4': 'FM',
-  '5': 'AM', '6': 'FSK', '7': 'CW-R', '8': 'DATA-LSB',
-  '9': 'FSK-R', 'A': 'DATA-USB'
+  1: 'LSB',
+  2: 'USB',
+  3: 'CW',
+  4: 'FM',
+  5: 'AM',
+  6: 'FSK',
+  7: 'CW-R',
+  8: 'DATA-LSB',
+  9: 'FSK-R',
+  A: 'DATA-USB',
 };
 
 const KENWOOD_MODE_REVERSE = {};
-Object.entries(KENWOOD_MODES).forEach(([k, v]) => { KENWOOD_MODE_REVERSE[v] = k; });
+Object.entries(KENWOOD_MODES).forEach(([k, v]) => {
+  KENWOOD_MODE_REVERSE[v] = k;
+});
 
 function kenwoodSetFreq(hz) {
   const padded = String(Math.round(hz)).padStart(11, '0');
@@ -422,9 +461,18 @@ function kenwoodSetMode(mode) {
   let digit = KENWOOD_MODE_REVERSE[mode];
   if (!digit) {
     const aliases = {
-      'USB': '2', 'LSB': '1', 'CW': '3', 'CW-R': '7',
-      'FM': '4', 'AM': '5', 'DATA-USB': 'A', 'DATA-LSB': '8',
-      'FT8': 'A', 'FT4': 'A', 'DIGI': 'A', 'PSK': 'A',
+      USB: '2',
+      LSB: '1',
+      CW: '3',
+      'CW-R': '7',
+      FM: '4',
+      AM: '5',
+      'DATA-USB': 'A',
+      'DATA-LSB': '8',
+      FT8: 'A',
+      FT4: 'A',
+      DIGI: 'A',
+      PSK: 'A',
     };
     digit = aliases[mode.toUpperCase()];
   }
@@ -441,7 +489,7 @@ function kenwoodSetPTT(on) {
 // Binary protocol: FE FE [to] [from] [cmd] [sub] [data...] FD
 // ═══════════════════════════════════════════════════════
 
-const ICOM_CONTROLLER = 0xE0; // Our address (controller)
+const ICOM_CONTROLLER = 0xe0; // Our address (controller)
 
 function getIcomAddress() {
   const addr = config.radio.icomAddress || '0x94';
@@ -450,10 +498,10 @@ function getIcomAddress() {
 
 function icomBuildCmd(cmd, sub, data = []) {
   const to = getIcomAddress();
-  const packet = [0xFE, 0xFE, to, ICOM_CONTROLLER, cmd];
+  const packet = [0xfe, 0xfe, to, ICOM_CONTROLLER, cmd];
   if (sub !== undefined && sub !== null) packet.push(sub);
   packet.push(...data);
-  packet.push(0xFD);
+  packet.push(0xfd);
   return Buffer.from(packet);
 }
 
@@ -469,12 +517,15 @@ function handleIcomData(data) {
 
   while (true) {
     // Find start of frame
-    const start = rxBinaryBuffer.indexOf(0xFE);
-    if (start === -1) { rxBinaryBuffer = Buffer.alloc(0); return; }
+    const start = rxBinaryBuffer.indexOf(0xfe);
+    if (start === -1) {
+      rxBinaryBuffer = Buffer.alloc(0);
+      return;
+    }
     if (start > 0) rxBinaryBuffer = rxBinaryBuffer.slice(start);
 
     // Need at least FE FE ... FD
-    const end = rxBinaryBuffer.indexOf(0xFD, 2);
+    const end = rxBinaryBuffer.indexOf(0xfd, 2);
     if (end === -1) return; // Wait for more data
 
     const frame = rxBinaryBuffer.slice(0, end + 1);
@@ -482,7 +533,7 @@ function handleIcomData(data) {
 
     // Skip preamble FE FE
     if (frame.length < 6) continue;
-    if (frame[0] !== 0xFE || frame[1] !== 0xFE) continue;
+    if (frame[0] !== 0xfe || frame[1] !== 0xfe) continue;
 
     const to = frame[2];
     const from = frame[3];
@@ -493,7 +544,8 @@ function handleIcomData(data) {
 
     switch (cmd) {
       case 0x03: // Frequency response
-      case 0x00: { // Freq update (unsolicited)
+      case 0x00: {
+        // Freq update (unsolicited)
         if (frame.length >= 10) {
           const freq = icomBCDToFreq(frame.slice(5, 10));
           if (freq > 0) updateState('freq', freq);
@@ -501,7 +553,8 @@ function handleIcomData(data) {
         break;
       }
       case 0x04: // Mode response
-      case 0x01: { // Mode update
+      case 0x01: {
+        // Mode update
         if (frame.length >= 7) {
           const mode = ICOM_MODES[frame[5]] || state.mode;
           updateState('mode', mode);
@@ -511,10 +564,12 @@ function handleIcomData(data) {
         }
         break;
       }
-      case 0xFB: { // OK acknowledgment
+      case 0xfb: {
+        // OK acknowledgment
         break;
       }
-      case 0xFA: { // NG (error)
+      case 0xfa: {
+        // NG (error)
         console.warn('[Icom] Command rejected (NG)');
         break;
       }
@@ -527,8 +582,8 @@ function icomBCDToFreq(bytes) {
   let freq = 0;
   let mult = 1;
   for (let i = 0; i < bytes.length; i++) {
-    const lo = bytes[i] & 0x0F;
-    const hi = (bytes[i] >> 4) & 0x0F;
+    const lo = bytes[i] & 0x0f;
+    const hi = (bytes[i] >> 4) & 0x0f;
     freq += lo * mult;
     mult *= 10;
     freq += hi * mult;
@@ -541,22 +596,34 @@ function icomFreqToBCD(freq) {
   const bytes = [];
   let f = Math.round(freq);
   for (let i = 0; i < 5; i++) {
-    const lo = f % 10; f = Math.floor(f / 10);
-    const hi = f % 10; f = Math.floor(f / 10);
+    const lo = f % 10;
+    f = Math.floor(f / 10);
+    const hi = f % 10;
+    f = Math.floor(f / 10);
     bytes.push((hi << 4) | lo);
   }
   return bytes;
 }
 
 const ICOM_MODES = {
-  0x00: 'LSB', 0x01: 'USB', 0x02: 'AM', 0x03: 'CW',
-  0x04: 'RTTY', 0x05: 'FM', 0x06: 'WFM', 0x07: 'CW-R',
-  0x08: 'RTTY-R', 0x11: 'DATA-LSB', 0x12: 'DATA-USB',
+  0x00: 'LSB',
+  0x01: 'USB',
+  0x02: 'AM',
+  0x03: 'CW',
+  0x04: 'RTTY',
+  0x05: 'FM',
+  0x06: 'WFM',
+  0x07: 'CW-R',
+  0x08: 'RTTY-R',
+  0x11: 'DATA-LSB',
+  0x12: 'DATA-USB',
   0x17: 'DATA-FM',
 };
 
 const ICOM_MODE_REVERSE = {};
-Object.entries(ICOM_MODES).forEach(([k, v]) => { ICOM_MODE_REVERSE[v] = parseInt(k); });
+Object.entries(ICOM_MODES).forEach(([k, v]) => {
+  ICOM_MODE_REVERSE[v] = parseInt(k);
+});
 
 function icomSetFreq(hz) {
   const bcd = icomFreqToBCD(hz);
@@ -567,10 +634,20 @@ function icomSetMode(mode) {
   let code = ICOM_MODE_REVERSE[mode];
   if (code === undefined) {
     const aliases = {
-      'USB': 0x01, 'LSB': 0x00, 'CW': 0x03, 'CW-R': 0x07,
-      'FM': 0x05, 'AM': 0x02, 'DATA-USB': 0x12, 'DATA-LSB': 0x11,
-      'FT8': 0x12, 'FT4': 0x12, 'DIGI': 0x12, 'PSK': 0x12,
-      'RTTY': 0x04, 'RTTY-R': 0x08,
+      USB: 0x01,
+      LSB: 0x00,
+      CW: 0x03,
+      'CW-R': 0x07,
+      FM: 0x05,
+      AM: 0x02,
+      'DATA-USB': 0x12,
+      'DATA-LSB': 0x11,
+      FT8: 0x12,
+      FT4: 0x12,
+      DIGI: 0x12,
+      PSK: 0x12,
+      RTTY: 0x04,
+      'RTTY-R': 0x08,
     };
     code = aliases[mode.toUpperCase()];
   }
@@ -581,7 +658,7 @@ function icomSetMode(mode) {
 }
 
 function icomSetPTT(on) {
-  serialWrite(icomBuildCmd(0x1C, 0x00, [on ? 0x01 : 0x00]));
+  serialWrite(icomBuildCmd(0x1c, 0x00, [on ? 0x01 : 0x00]));
 }
 
 // ═══════════════════════════════════════════════════════
@@ -636,7 +713,10 @@ function startRigctldPoll() {
 }
 
 function rigctldSend(cmd, cb) {
-  if (!rigctldSocket) { if (cb) cb(new Error('Not connected')); return; }
+  if (!rigctldSocket) {
+    if (cb) cb(new Error('Not connected'));
+    return;
+  }
   rigctldQueue.push({ cmd, cb });
   rigctldProcess();
 }
@@ -716,10 +796,18 @@ function startFlrigPoll() {
 
 function setFreq(hz) {
   switch (config.radio.type) {
-    case 'yaesu':   yaesuSetFreq(hz); break;
-    case 'kenwood':  kenwoodSetFreq(hz); break;
-    case 'icom':     icomSetFreq(hz); break;
-    case 'rigctld':  rigctldSend(`F ${hz}`); break;
+    case 'yaesu':
+      yaesuSetFreq(hz);
+      break;
+    case 'kenwood':
+      kenwoodSetFreq(hz);
+      break;
+    case 'icom':
+      icomSetFreq(hz);
+      break;
+    case 'rigctld':
+      rigctldSend(`F ${hz}`);
+      break;
     case 'flrig':
       if (flrigClient) flrigClient.methodCall('rig.set_frequency', [parseFloat(hz) + 0.1], () => {});
       break;
@@ -728,10 +816,18 @@ function setFreq(hz) {
 
 function setModeCmd(mode) {
   switch (config.radio.type) {
-    case 'yaesu':   yaesuSetMode(mode); break;
-    case 'kenwood':  kenwoodSetMode(mode); break;
-    case 'icom':     icomSetMode(mode); break;
-    case 'rigctld':  rigctldSend(`M ${mode} 0`); break;
+    case 'yaesu':
+      yaesuSetMode(mode);
+      break;
+    case 'kenwood':
+      kenwoodSetMode(mode);
+      break;
+    case 'icom':
+      icomSetMode(mode);
+      break;
+    case 'rigctld':
+      rigctldSend(`M ${mode} 0`);
+      break;
     case 'flrig':
       if (flrigClient) flrigClient.methodCall('rig.set_mode', [mode], () => {});
       break;
@@ -744,10 +840,18 @@ function setPTTCmd(on) {
     return false;
   }
   switch (config.radio.type) {
-    case 'yaesu':   yaesuSetPTT(on); break;
-    case 'kenwood':  kenwoodSetPTT(on); break;
-    case 'icom':     icomSetPTT(on); break;
-    case 'rigctld':  rigctldSend(on ? 'T 1' : 'T 0'); break;
+    case 'yaesu':
+      yaesuSetPTT(on);
+      break;
+    case 'kenwood':
+      kenwoodSetPTT(on);
+      break;
+    case 'icom':
+      icomSetPTT(on);
+      break;
+    case 'rigctld':
+      rigctldSend(on ? 'T 1' : 'T 0');
+      break;
     case 'flrig':
       if (flrigClient) flrigClient.methodCall('rig.set_ptt', [on ? 1 : 0], () => {});
       break;
@@ -762,7 +866,7 @@ function setPTTCmd(on) {
 function startConnection() {
   stopConnection();
   console.log(`[Bridge] Starting connection, type: ${config.radio.type}`);
-  
+
   switch (config.radio.type) {
     case 'yaesu':
     case 'kenwood':
@@ -785,7 +889,12 @@ function startConnection() {
 function stopConnection() {
   stopPolling();
   disconnectSerial();
-  if (rigctldSocket) { try { rigctldSocket.destroy(); } catch(e) {} rigctldSocket = null; }
+  if (rigctldSocket) {
+    try {
+      rigctldSocket.destroy();
+    } catch (e) {}
+    rigctldSocket = null;
+  }
   flrigClient = null;
   rigctldQueue = [];
   rigctldPending = null;
@@ -828,10 +937,10 @@ app.post('/api/config', (req, res) => {
     config.radio = { ...config.radio, ...newConfig.radio };
   }
   saveConfig();
-  
+
   // Restart connection with new config
   startConnection();
-  
+
   res.json({ success: true, config });
 });
 
@@ -840,7 +949,7 @@ app.post('/api/test', async (req, res) => {
   // Quick serial port test
   const testPort = req.body.serialPort || config.radio.serialPort;
   const testBaud = req.body.baudRate || config.radio.baudRate;
-  
+
   const SP = getSerialPort();
   if (!SP) return res.json({ success: false, error: 'serialport module not available' });
 
@@ -850,7 +959,7 @@ app.post('/api/test', async (req, res) => {
       baudRate: testBaud,
       autoOpen: false,
     });
-    
+
     testConn.open((err) => {
       if (err) {
         return res.json({ success: false, error: err.message });
@@ -880,7 +989,7 @@ app.get('/stream', (req, res) => {
   res.writeHead(200, {
     'Content-Type': 'text/event-stream',
     'Cache-Control': 'no-cache',
-    'Connection': 'keep-alive',
+    Connection: 'keep-alive',
     'Access-Control-Allow-Origin': '*',
   });
 
@@ -898,7 +1007,7 @@ app.get('/stream', (req, res) => {
   sseClients.push({ id: clientId, res });
 
   req.on('close', () => {
-    sseClients = sseClients.filter(c => c.id !== clientId);
+    sseClients = sseClients.filter((c) => c.id !== clientId);
   });
 });
 
diff --git a/rig-control/UserGuide.md b/rig-control/UserGuide.md
index 6ab9dc93..fd4c4412 100644
--- a/rig-control/UserGuide.md
+++ b/rig-control/UserGuide.md
@@ -144,9 +144,10 @@ node rig-daemon.js
 
 ## ✅ You're Done!
 
-Navigate to the dashboard. You should see the Rig Control panel (if enabled). 
+Navigate to the dashboard. You should see the Rig Control panel (if enabled).
 
 **Try it out:**
+
 - Click a spot on the **World Map**.
 - Click a row in the **DX Cluster** list.
 - Click a **POTA** or **SOTA** spot.
diff --git a/rig-control/rig-daemon.js b/rig-control/rig-daemon.js
index 78498707..662c7949 100644
--- a/rig-control/rig-daemon.js
+++ b/rig-control/rig-daemon.js
@@ -10,20 +10,20 @@
  *   node rig-daemon.js --type flrig   --rig-host 127.0.0.1 --rig-port 12345 --http-port 5555
  */
 
-const express = require("express");
-const cors = require("cors");
-const net = require("net");
-const xmlrpc = require("xmlrpc");
+const express = require('express');
+const cors = require('cors');
+const net = require('net');
+const xmlrpc = require('xmlrpc');
 
 // Configuration Defaults
-const fs = require("fs");
-const path = require("path");
+const fs = require('fs');
+const path = require('path');
 
 let CONFIG = {
-  server: { host: "0.0.0.0", port: 5555 },
+  server: { host: '0.0.0.0', port: 5555 },
   radio: {
-    type: "rigctld",
-    host: "127.0.0.1",
+    type: 'rigctld',
+    host: '127.0.0.1',
     rigPort: 4532,
     pollInterval: 1000,
     pttEnabled: false,
@@ -31,10 +31,10 @@ let CONFIG = {
 };
 
 // Load Config File
-const configPath = path.join(__dirname, "rig-config.json");
+const configPath = path.join(__dirname, 'rig-config.json');
 if (fs.existsSync(configPath)) {
   try {
-    const fileConfig = JSON.parse(fs.readFileSync(configPath, "utf8"));
+    const fileConfig = JSON.parse(fs.readFileSync(configPath, 'utf8'));
     console.log(`[Config] Loaded configuration from ${configPath}`);
 
     // Merge Server Config
@@ -56,17 +56,17 @@ if (fs.existsSync(configPath)) {
 // Legacy CLI Args (Prioritize over config file if provided)
 const ARGS = process.argv.slice(2);
 for (let i = 0; i < ARGS.length; i++) {
-  if (ARGS[i] === "--type") CONFIG.radio.type = ARGS[++i];
-  if (ARGS[i] === "--rig-host") CONFIG.radio.host = ARGS[++i];
-  if (ARGS[i] === "--rig-port") CONFIG.radio.rigPort = parseInt(ARGS[++i]);
-  if (ARGS[i] === "--http-port") CONFIG.server.port = parseInt(ARGS[++i]);
+  if (ARGS[i] === '--type') CONFIG.radio.type = ARGS[++i];
+  if (ARGS[i] === '--rig-host') CONFIG.radio.host = ARGS[++i];
+  if (ARGS[i] === '--rig-port') CONFIG.radio.rigPort = parseInt(ARGS[++i]);
+  if (ARGS[i] === '--http-port') CONFIG.server.port = parseInt(ARGS[++i]);
 }
 
 // Adjust default port if flrig and not manually set (heuristic)
 if (
-  CONFIG.radio.type === "flrig" &&
+  CONFIG.radio.type === 'flrig' &&
   CONFIG.radio.rigPort === 4532 &&
-  !process.argv.includes("--rig-port") &&
+  !process.argv.includes('--rig-port') &&
   !fs.existsSync(configPath)
 ) {
   CONFIG.radio.rigPort = 12345;
@@ -79,7 +79,7 @@ console.log(`[Config] HTTP: ${CONFIG.server.port}`);
 // State
 const state = {
   freq: 0,
-  mode: "",
+  mode: '',
   width: 0,
   ptt: false,
   connected: false,
@@ -112,38 +112,36 @@ const RigaAdapter = {
     RigaAdapter.connect();
     // Poll loop
     setInterval(() => {
-      if (!state.connected || CONFIG.radio.type !== "rigctld") return;
-      RigaAdapter.send("f");
-      RigaAdapter.send("m");
-      RigaAdapter.send("t");
+      if (!state.connected || CONFIG.radio.type !== 'rigctld') return;
+      RigaAdapter.send('f');
+      RigaAdapter.send('m');
+      RigaAdapter.send('t');
     }, CONFIG.radio.pollInterval);
   },
 
   connect: () => {
     if (RigaAdapter.socket) return;
-    console.log(
-      `[Rigctld] Connecting to ${CONFIG.radio.host}:${CONFIG.radio.rigPort}...`,
-    );
+    console.log(`[Rigctld] Connecting to ${CONFIG.radio.host}:${CONFIG.radio.rigPort}...`);
     const s = new net.Socket();
     s.connect(CONFIG.radio.rigPort, CONFIG.radio.host, () => {
-      console.log("[Rigctld] Connected");
+      console.log('[Rigctld] Connected');
       state.connected = true;
       RigaAdapter.socket = s;
     });
-    s.on("data", (data) => {
-      const lines = data.toString().split("\n");
+    s.on('data', (data) => {
+      const lines = data.toString().split('\n');
       for (const line of lines) {
         if (!line.trim()) continue;
         RigaAdapter.handleResponse(line.trim());
       }
     });
-    s.on("close", () => {
-      console.log("[Rigctld] Disconnected");
+    s.on('close', () => {
+      console.log('[Rigctld] Disconnected');
       state.connected = false;
       RigaAdapter.socket = null;
       setTimeout(RigaAdapter.connect, 5000);
     });
-    s.on("error", (err) => {
+    s.on('error', (err) => {
       console.error(`[Rigctld] Error: ${err.message}`);
       s.destroy();
     });
@@ -151,7 +149,7 @@ const RigaAdapter = {
 
   send: (cmd, cb) => {
     if (!RigaAdapter.socket) {
-      if (cb) cb(new Error("Not connected"));
+      if (cb) cb(new Error('Not connected'));
       return;
     }
     RigaAdapter.queue.push({ cmd, cb });
@@ -159,15 +157,10 @@ const RigaAdapter = {
   },
 
   process: () => {
-    if (
-      RigaAdapter.pending ||
-      RigaAdapter.queue.length === 0 ||
-      !RigaAdapter.socket
-    )
-      return;
+    if (RigaAdapter.pending || RigaAdapter.queue.length === 0 || !RigaAdapter.socket) return;
     const req = RigaAdapter.queue.shift();
     RigaAdapter.pending = req;
-    RigaAdapter.socket.write(req.cmd + "\n");
+    RigaAdapter.socket.write(req.cmd + '\n');
   },
 
   handleResponse: (line) => {
@@ -175,27 +168,27 @@ const RigaAdapter = {
     const req = RigaAdapter.pending;
     RigaAdapter.pending = null;
 
-    if (req.cmd === "f" || req.cmd.startsWith("F")) {
+    if (req.cmd === 'f' || req.cmd.startsWith('F')) {
       const newFreq = parseInt(line);
       if (newFreq !== state.freq) {
         state.freq = newFreq;
-        broadcast({ type: "update", prop: "freq", value: state.freq });
+        broadcast({ type: 'update', prop: 'freq', value: state.freq });
       }
-    } else if (req.cmd === "m" || req.cmd.startsWith("M")) {
-      const parts = line.split(" ");
+    } else if (req.cmd === 'm' || req.cmd.startsWith('M')) {
+      const parts = line.split(' ');
       const newMode = parts[0];
-      const newWidth = parseInt(parts[1] || "0");
+      const newWidth = parseInt(parts[1] || '0');
 
       if (newMode !== state.mode || newWidth !== state.width) {
         state.mode = newMode;
         state.width = newWidth;
-        broadcast({ type: "update", prop: "mode", value: state.mode });
+        broadcast({ type: 'update', prop: 'mode', value: state.mode });
       }
-    } else if (req.cmd === "t" || req.cmd.startsWith("T")) {
-      const newPTT = line === "1";
+    } else if (req.cmd === 't' || req.cmd.startsWith('T')) {
+      const newPTT = line === '1';
       if (newPTT !== state.ptt) {
         state.ptt = newPTT;
-        broadcast({ type: "update", prop: "ptt", value: state.ptt });
+        broadcast({ type: 'update', prop: 'ptt', value: state.ptt });
       }
     }
 
@@ -215,57 +208,57 @@ const FlrigAdapter = {
     FlrigAdapter.client = xmlrpc.createClient({
       host: CONFIG.radio.host,
       port: CONFIG.radio.rigPort,
-      path: "/",
+      path: '/',
     });
     state.connected = true; // Assume connected as it's connectionless (HTTP), validation happens on poll
-    console.log("[Flrig] Client initialized (XML-RPC is connectionless)");
+    console.log('[Flrig] Client initialized (XML-RPC is connectionless)');
 
     // Poll loop
     setInterval(FlrigAdapter.poll, CONFIG.radio.pollInterval);
 
     // FEATURE: Log supported modes
-    FlrigAdapter.client.methodCall("rig.get_modes", [], (err, val) => {
+    FlrigAdapter.client.methodCall('rig.get_modes', [], (err, val) => {
       if (!err && val) {
-        console.log("[Flrig] Supported Modes:", val);
+        console.log('[Flrig] Supported Modes:', val);
       } else if (err) {
-        console.warn("[Flrig] Could not fetch modes:", err.message);
+        console.warn('[Flrig] Could not fetch modes:', err.message);
       }
     });
   },
 
   poll: () => {
     // Get Freq
-    FlrigAdapter.client.methodCall("rig.get_vfo", [], (err, val) => {
+    FlrigAdapter.client.methodCall('rig.get_vfo', [], (err, val) => {
       if (err) {
-        if (state.connected) console.error("[Flrig] Poll Error:", err.message);
+        if (state.connected) console.error('[Flrig] Poll Error:', err.message);
         state.connected = false;
       } else {
         if (!state.connected) {
           state.connected = true;
-          broadcast({ type: "update", prop: "connected", value: true });
+          broadcast({ type: 'update', prop: 'connected', value: true });
         }
         const newFreq = parseFloat(val);
         if (newFreq !== state.freq) {
           state.freq = newFreq;
-          broadcast({ type: "update", prop: "freq", value: state.freq });
+          broadcast({ type: 'update', prop: 'freq', value: state.freq });
         }
         state.lastUpdate = Date.now();
       }
     });
     // Get Mode
-    FlrigAdapter.client.methodCall("rig.get_mode", [], (err, val) => {
+    FlrigAdapter.client.methodCall('rig.get_mode', [], (err, val) => {
       if (!err && val !== state.mode) {
         state.mode = val;
-        broadcast({ type: "update", prop: "mode", value: state.mode });
+        broadcast({ type: 'update', prop: 'mode', value: state.mode });
       }
     });
     // Get PTT
-    FlrigAdapter.client.methodCall("rig.get_ptt", [], (err, val) => {
+    FlrigAdapter.client.methodCall('rig.get_ptt', [], (err, val) => {
       if (!err) {
         const newPTT = !!val;
         if (newPTT !== state.ptt) {
           state.ptt = newPTT;
-          broadcast({ type: "update", prop: "ptt", value: state.ptt });
+          broadcast({ type: 'update', prop: 'ptt', value: state.ptt });
         }
       }
     });
@@ -275,43 +268,36 @@ const FlrigAdapter = {
     // flrig expects a double. If we pass an integer (e.g. 14000000),
     // the xmlrpc lib sends <int> and flrig throws a type error.
     // We add a tiny fraction to force <double> serialization.
-    FlrigAdapter.client.methodCall(
-      "rig.set_frequency",
-      [parseFloat(freq) + 0.1],
-      cb,
-    );
+    FlrigAdapter.client.methodCall('rig.set_frequency', [parseFloat(freq) + 0.1], cb);
   },
 
   setMode: (mode, cb) => {
     // flrig set_mode just takes mode string
-    FlrigAdapter.client.methodCall("rig.set_mode", [mode], cb);
+    FlrigAdapter.client.methodCall('rig.set_mode', [mode], cb);
   },
 
   setPTT: (ptt, cb) => {
     // flrig set_ptt takes integer 0 or 1
-    FlrigAdapter.client.methodCall("rig.set_ptt", [ptt ? 1 : 0], cb);
+    FlrigAdapter.client.methodCall('rig.set_ptt', [ptt ? 1 : 0], cb);
   },
 
   tune: () => {
-    console.log("[Flrig] Sending Tune command...");
+    console.log('[Flrig] Sending Tune command...');
     // Try rig.tune first
-    FlrigAdapter.client.methodCall("rig.tune", [1], (err, _val) => {
+    FlrigAdapter.client.methodCall('rig.tune', [1], (err, _val) => {
       if (err) {
-        console.warn(
-          "[Flrig] rig.tune failed, trying fallback (PTT toggle):",
-          err.message,
-        );
+        console.warn('[Flrig] rig.tune failed, trying fallback (PTT toggle):', err.message);
         // Fallback: Toggle PTT if TUNE command not supported/failed
         FlrigAdapter.setPTT(true, () => {
           const delay = getTuneDelay();
           setTimeout(() => {
             FlrigAdapter.setPTT(false, () => {
-              console.log("[Flrig] Fallback Tune (PTT) completed");
+              console.log('[Flrig] Fallback Tune (PTT) completed');
             });
           }, delay); // Transmit for configured duration
         });
       } else {
-        console.log("[Flrig] Tune command sent successfully");
+        console.log('[Flrig] Tune command sent successfully');
         // If rig.tune is momentary, we might need to turn it off?
         // Usually tune starts a cycle. Let's assume it triggers the tuner.
       }
@@ -328,10 +314,10 @@ const FlrigAdapter = {
 // ==========================================
 const MockAdapter = {
   init: () => {
-    console.log("[Mock] Initializing Simulation Mode...");
+    console.log('[Mock] Initializing Simulation Mode...');
     state.connected = true;
     state.freq = 14074000;
-    state.mode = "USB";
+    state.mode = 'USB';
     state.width = 2400;
     state.ptt = false;
     state.lastUpdate = Date.now();
@@ -345,29 +331,29 @@ const MockAdapter = {
   setFreq: (freq, cb) => {
     console.log(`[Mock] SET FREQ: ${freq}`);
     state.freq = parseInt(freq);
-    broadcast({ type: "update", prop: "freq", value: state.freq });
+    broadcast({ type: 'update', prop: 'freq', value: state.freq });
     if (cb) cb(null);
   },
 
   setMode: (mode, cb) => {
     console.log(`[Mock] SET MODE: ${mode}`);
     state.mode = mode;
-    broadcast({ type: "update", prop: "mode", value: state.mode });
+    broadcast({ type: 'update', prop: 'mode', value: state.mode });
     if (cb) cb(null);
   },
 
   setPTT: (ptt, cb) => {
     console.log(`[Mock] SET PTT: ${ptt}`);
     state.ptt = !!ptt;
-    broadcast({ type: "update", prop: "ptt", value: state.ptt });
+    broadcast({ type: 'update', prop: 'ptt', value: state.ptt });
     if (cb) cb(null);
   },
 
   tune: () => {
-    console.log("[Mock] TUNE COMMAND RECEIVED");
-    console.log("[Mock] Simulating tuner cycle (3s)...");
+    console.log('[Mock] TUNE COMMAND RECEIVED');
+    console.log('[Mock] Simulating tuner cycle (3s)...');
     setTimeout(() => {
-      console.log("[Mock] TUNE COMPLETED");
+      console.log('[Mock] TUNE COMPLETED');
     }, 3000);
   },
 };
@@ -378,9 +364,9 @@ const MockAdapter = {
 
 // Initialize selected adapter
 // Initialize selected adapter
-if (CONFIG.radio.type === "flrig") {
+if (CONFIG.radio.type === 'flrig') {
   FlrigAdapter.init();
-} else if (CONFIG.radio.type === "mock") {
+} else if (CONFIG.radio.type === 'mock') {
   MockAdapter.init();
 } else {
   RigaAdapter.init();
@@ -390,7 +376,7 @@ const app = express();
 app.use(cors());
 app.use(express.json());
 
-app.get("/status", (_req, res) => {
+app.get('/status', (_req, res) => {
   res.json({
     connected: state.connected,
     freq: state.freq,
@@ -401,18 +387,18 @@ app.get("/status", (_req, res) => {
   });
 });
 
-app.get("/stream", (req, res) => {
+app.get('/stream', (req, res) => {
   // SSE Headers
   res.writeHead(200, {
-    "Content-Type": "text/event-stream",
-    "Cache-Control": "no-cache",
-    Connection: "keep-alive",
-    "Access-Control-Allow-Origin": "*",
+    'Content-Type': 'text/event-stream',
+    'Cache-Control': 'no-cache',
+    Connection: 'keep-alive',
+    'Access-Control-Allow-Origin': '*',
   });
 
   // Send initial state
   const initialData = {
-    type: "init",
+    type: 'init',
     connected: state.connected,
     freq: state.freq,
     mode: state.mode,
@@ -427,18 +413,18 @@ app.get("/stream", (req, res) => {
   clients.push(newClient);
 
   // Cleanup on close
-  req.on("close", () => {
+  req.on('close', () => {
     clients = clients.filter((c) => c.id !== clientId);
   });
 });
 
-app.post("/freq", (req, res) => {
+app.post('/freq', (req, res) => {
   const { freq } = req.body;
-  if (!freq) return res.status(400).json({ error: "Missing freq" });
+  if (!freq) return res.status(400).json({ error: 'Missing freq' });
 
   console.log(`[API] Setting Freq: ${freq}`);
 
-  if (CONFIG.radio.type === "flrig") {
+  if (CONFIG.radio.type === 'flrig') {
     FlrigAdapter.setFreq(freq, (err, _val) => {
       if (err) return res.status(500).json({ error: err.message });
 
@@ -456,7 +442,7 @@ app.post("/freq", (req, res) => {
 
       res.json({ success: true });
     });
-  } else if (CONFIG.radio.type === "mock") {
+  } else if (CONFIG.radio.type === 'mock') {
     MockAdapter.setFreq(freq, (_err) => {
       if (req.body.tune) MockAdapter.tune();
       res.json({ success: true });
@@ -464,63 +450,61 @@ app.post("/freq", (req, res) => {
   } else {
     RigaAdapter.send(`F ${freq}`, (err, _val) => {
       if (err) return res.status(500).json({ error: err.message });
-      setTimeout(() => RigaAdapter.send("f"), 100);
+      setTimeout(() => RigaAdapter.send('f'), 100);
       res.json({ success: true });
     });
   }
 });
 
-app.post("/mode", (req, res) => {
+app.post('/mode', (req, res) => {
   const { mode } = req.body;
-  if (!mode) return res.status(400).json({ error: "Missing mode" });
+  if (!mode) return res.status(400).json({ error: 'Missing mode' });
 
   // passband is optional, default usually 2400 for SSB (only used for rigctld)
   const passband = req.body.passband || 0;
   console.log(`[API] Setting Mode: ${mode}`);
 
-  if (CONFIG.radio.type === "flrig") {
+  if (CONFIG.radio.type === 'flrig') {
     FlrigAdapter.setMode(mode, (err, _val) => {
       if (err) return res.status(500).json({ error: err.message });
       setTimeout(FlrigAdapter.poll, 100);
       res.json({ success: true });
     });
-  } else if (CONFIG.radio.type === "mock") {
+  } else if (CONFIG.radio.type === 'mock') {
     MockAdapter.setMode(mode, (_err) => {
       res.json({ success: true });
     });
   } else {
     RigaAdapter.send(`M ${mode} ${passband}`, (err, _val) => {
       if (err) return res.status(500).json({ error: err.message });
-      setTimeout(() => RigaAdapter.send("m"), 100);
+      setTimeout(() => RigaAdapter.send('m'), 100);
       res.json({ success: true });
     });
   }
 });
 
-app.post("/ptt", (req, res) => {
+app.post('/ptt', (req, res) => {
   const { ptt } = req.body;
 
   if (ptt && !CONFIG.radio.pttEnabled) {
-    console.warn(
-      `[API] PTT request BLOCKED by configuration (pttEnabled: false)`,
-    );
-    return res.status(403).json({ error: "PTT disabled in configuration" });
+    console.warn(`[API] PTT request BLOCKED by configuration (pttEnabled: false)`);
+    return res.status(403).json({ error: 'PTT disabled in configuration' });
   }
 
   console.log(`[API] Setting PTT: ${ptt}`);
 
-  if (CONFIG.radio.type === "flrig") {
+  if (CONFIG.radio.type === 'flrig') {
     FlrigAdapter.setPTT(ptt, (err, _val) => {
       if (err) return res.status(500).json({ error: err.message });
       state.ptt = !!ptt;
       res.json({ success: true });
     });
-  } else if (CONFIG.radio.type === "mock") {
+  } else if (CONFIG.radio.type === 'mock') {
     MockAdapter.setPTT(ptt, (_err) => {
       res.json({ success: true });
     });
   } else {
-    const cmd = ptt ? "T 1" : "T 0";
+    const cmd = ptt ? 'T 1' : 'T 0';
     RigaAdapter.send(cmd, (err, _val) => {
       if (err) return res.status(500).json({ error: err.message });
       state.ptt = !!ptt;
@@ -532,7 +516,5 @@ app.post("/ptt", (req, res) => {
 app.listen(CONFIG.server.port, CONFIG.server.host, () => {
   console.log(`[HTTP] Rig Daemon listening on port ${CONFIG.server.port}`);
   console.log(`[HTTP] CORS enabled for all origins`);
-  console.log(
-    `[HTTP] Connects to ${CONFIG.radio.type} at ${CONFIG.radio.host}:${CONFIG.radio.rigPort}`,
-  );
+  console.log(`[HTTP] Connects to ${CONFIG.radio.type} at ${CONFIG.radio.host}:${CONFIG.radio.rigPort}`);
 });
diff --git a/rig-control/scripts/README.md b/rig-control/scripts/README.md
index dbbc5d83..29a60360 100644
--- a/rig-control/scripts/README.md
+++ b/rig-control/scripts/README.md
@@ -3,9 +3,11 @@
 This directory contains scripts to install the **Rig Control Daemon** as a background service on Linux, macOS, and Windows.
 
 ## Prerequisite
+
 - **Node.js** must be installed on your system.
 
 ## Linux (systemd)
+
 Installs as a user-level systemd service (`openhamclock-rig`).
 
 1. Open a terminal.
@@ -21,6 +23,7 @@ Installs as a user-level systemd service (`openhamclock-rig`).
    - Stop: `sudo systemctl stop openhamclock-rig`
 
 ## macOS (launchd)
+
 Installs as a LaunchAgent (`com.openhamclock.rig`) for the current user.
 
 1. Open Terminal.
@@ -35,6 +38,7 @@ Installs as a LaunchAgent (`com.openhamclock.rig`) for the current user.
    - Stop: `launchctl unload ~/Library/LaunchAgents/com.openhamclock.rig.plist`
 
 ## Windows (Task Scheduler)
+
 Installs as a Scheduled Task that runs at logon (hidden window).
 
 1. Open PowerShell as Administrator (optional, but recommended for task registration).
@@ -49,4 +53,5 @@ Installs as a Scheduled Task that runs at logon (hidden window).
    - You can manually Start/End the task from there.
 
 ---
+
 **Note:** The daemon listens on port **4532** by default. Ensure this port is allowed in your firewall if accessing from another machine.
diff --git a/rig-control/test-flrig.js b/rig-control/test-flrig.js
index 559ca318..acedba77 100644
--- a/rig-control/test-flrig.js
+++ b/rig-control/test-flrig.js
@@ -1,33 +1,33 @@
-const xmlrpc = require("xmlrpc");
+const xmlrpc = require('xmlrpc');
 
-const HOST = "127.0.0.1";
+const HOST = '127.0.0.1';
 const PORT = 12345;
 
-const client = xmlrpc.createClient({ host: HOST, port: PORT, path: "/" });
+const client = xmlrpc.createClient({ host: HOST, port: PORT, path: '/' });
 
 console.log(`Connecting to flrig at ${HOST}:${PORT}...`);
 
 // Test 1: Get Frequency (Should work)
-client.methodCall("rig.get_vfo", [], (err, val) => {
+client.methodCall('rig.get_vfo', [], (err, val) => {
   if (err) {
-    console.error("get_vfo failed:", err);
+    console.error('get_vfo failed:', err);
   } else {
-    console.log("Current Freq:", val);
+    console.log('Current Freq:', val);
 
     // Test 2: Set Freq (Integer) - Might fail
     const targetInt = 14075000;
     console.log(`Attempting to set Integer Freq: ${targetInt}`);
-    client.methodCall("rig.set_frequency", [targetInt], (err2, val2) => {
-      if (err2) console.error("Set Int failed:", err2);
-      else console.log("Set Int result:", val2);
+    client.methodCall('rig.set_frequency', [targetInt], (err2, val2) => {
+      if (err2) console.error('Set Int failed:', err2);
+      else console.log('Set Int result:', val2);
     });
 
     // Test 3: Set Freq (Double) - Should work
     const targetDouble = 14076000.1;
     console.log(`Attempting to set Double Freq: ${targetDouble}`);
-    client.methodCall("rig.set_frequency", [targetDouble], (err3, val3) => {
-      if (err3) console.error("Set Double failed:", err3);
-      else console.log("Set Double result:", val3);
+    client.methodCall('rig.set_frequency', [targetDouble], (err3, val3) => {
+      if (err3) console.error('Set Double failed:', err3);
+      else console.log('Set Double result:', val3);
     });
   }
 });
diff --git a/rig-control/test_plan.md b/rig-control/test_plan.md
index d3930c4c..974608fc 100644
--- a/rig-control/test_plan.md
+++ b/rig-control/test_plan.md
@@ -5,30 +5,35 @@
 **Branch:** `feat/rig-control-minimal`
 
 ## 1. Introduction
+
 This document outlines the test procedures for verifying the new Rig Control integration in OpenHamClock. The goal is to ensure that the application can communicate with an amateur radio transceiver via the intermediate daemon, correctly display frequency/mode, and control the rig (tuning and PTT) from various panels.
 
 ## 2. Prerequisites
 
 ### Hardware
+
 - A computer running OpenHamClock (local dev or deployed).
 - An amateur radio transceiver (Rig) with CAT control capabilities.
 - A USB CAT cable connecting the computer to the Rig.
 
 ### Software
+
 - **Node.js** (v16 or higher) installed on the machine connected to the Rig.
 - **Hamlib (`rigctld`)** OR **`flrig`** installed and configured for your specific radio.
-    - *Note: `rigctld` is part of the `hamlib` package.*
-    - *Note: `flrig` is a standalone GUI program.*
+  - _Note: `rigctld` is part of the `hamlib` package._
+  - _Note: `flrig` is a standalone GUI program._
 
 ## 3. Setup & Installation
 
 ### Step 3.1: Start the Rig Interface (Backend)
+
 1. **Connect your Rig** and ensure it is powered on.
 2. **Start your CAT control software**:
    - **Option A (flrig):** Open `flrig`, configure your transceiver, and ensure "Init" is successful. Default XML-RPC port is usually `12345`.
    - **Option B (rigctld):** Run `rigctld -m <model> -r <device> -t 4532` (adjust model/device as needed).
 
 ### Step 3.2: Start the OpenHamClock Daemon
+
 The OpenHamClock web app cannot talk directly to your rig; it needs a small bridge (daemon).
 
 1. Navigate to the `rig-control/` directory in the project:
@@ -47,9 +52,10 @@ The OpenHamClock web app cannot talk directly to your rig; it needs a small brid
    ```bash
    node rig-daemon.js
    ```
-   *Success Indicator: The terminal should show "Connected to flrig/hamlib on..." and "Listening on http://0.0.0.0:5555".*
+   _Success Indicator: The terminal should show "Connected to flrig/hamlib on..." and "Listening on http://0.0.0.0:5555"._
 
 ### Step 3.3: Start OpenHamClock (Frontend)
+
 1. In the main project directory, start the development server:
    ```bash
    npm run dev
@@ -70,14 +76,18 @@ The OpenHamClock web app cannot talk directly to your rig; it needs a small brid
 ## 5. Test Cases
 
 ### TC-01: Connectivity Verification
+
 **Objective:** Confirm OpenHamClock can read rig status.
+
 1. Open the **Rig Control** panel (it should appear in your layout, or switch to "Modern" layout if not visible).
 2. **Verify:** The status LED in the top-right of the panel is **GREEN**.
 3. **Verify:** The large frequency display matches your rig's VFO A.
 4. **Verify:** The mode badge (e.g., USB, CW) matches your rig.
 
 ### TC-02: Manual Control
+
 **Objective:** Confirm OpenHamClock can command the rig via the panel.
+
 1. In the Rig Control panel, enter a frequency (e.g., `14.074`) in the input box.
 2. Click **Set**.
 3. **Verify:** The rig physically changes to `14.074.000` Hz.
@@ -89,7 +99,9 @@ The OpenHamClock web app cannot talk directly to your rig; it needs a small brid
 9. **Verify:** The Rig returns to Receive (`RX`) mode.
 
 ### TC-03: On-Air Indicator
+
 **Objective:** Confirm the On-Air panel reflects TX status.
+
 1. Add the **On Air** panel to your layout (if using Dockable layout) or observe the PTT status.
 2. Press PTT on the rig microphone OR use the on-screen PTT.
 3. **Verify:** The On Air panel turns **RED** and displays "ON AIR".
@@ -97,7 +109,9 @@ The OpenHamClock web app cannot talk directly to your rig; it needs a small brid
 5. **Verify:** The panel returns to standard/gray "RX" state.
 
 ### TC-04: Click-to-Tune (Spot Integration)
+
 **Objective:** Confirm clicking spots retunes the rig.
+
 1. Open the **DX Cluster** panel or **POTA** panel.
 2. Find a spot and click on it.
 3. **Verify:** The rig retunes to the spot's frequency (regardless of "Click-to-tune" setting).
@@ -105,21 +119,24 @@ The OpenHamClock web app cannot talk directly to your rig; it needs a small brid
 5. **Verify:** The rig mode changes automatically based on the new frequency.
 
 ### TC-05: Mode Logic Verification (Critical)
+
 **Objective:** Verify that specific modes are enforced based on band conventions.
 
-*NOTE: The logic enforces `< 10 MHz = LSB` and `>= 10 MHz = USB`, except for 60m (USB).*
+_NOTE: The logic enforces `< 10 MHz = LSB` and `>= 10 MHz = USB`, except for 60m (USB)._
 
-| Test Step | Action | Expected Frequency | Expected Mode |
-| :--- | :--- | :--- | :--- |
-| **5.1** | Click a **20m FT8** spot (e.g., 14.074) | 14.074.000 | **USB** |
-| **5.2** | Click a **40m FT8** spot (e.g., 7.074) | 7.074.000 | **LSB** |
-| **5.3** | Click a **80m FT8** spot (e.g., 3.573) | 3.573.000 | **LSB** |
-| **5.4** | Click a **20m CW** spot (e.g., 14.010) | 14.010.000 | **USB** |
-| **5.5** | Click a **40m CW** spot (e.g., 7.010) | 7.010.000 | **LSB** |
-| **5.6** | Click a **60m** spot (e.g., 5.357) | 5.357.000 | **USB** |
+| Test Step | Action                                  | Expected Frequency | Expected Mode |
+| :-------- | :-------------------------------------- | :----------------- | :------------ |
+| **5.1**   | Click a **20m FT8** spot (e.g., 14.074) | 14.074.000         | **USB**       |
+| **5.2**   | Click a **40m FT8** spot (e.g., 7.074)  | 7.074.000          | **LSB**       |
+| **5.3**   | Click a **80m FT8** spot (e.g., 3.573)  | 3.573.000          | **LSB**       |
+| **5.4**   | Click a **20m CW** spot (e.g., 14.010)  | 14.010.000         | **USB**       |
+| **5.5**   | Click a **40m CW** spot (e.g., 7.010)   | 7.010.000          | **LSB**       |
+| **5.6**   | Click a **60m** spot (e.g., 5.357)      | 5.357.000          | **USB**       |
 
 ### TC-06: Error Handling
+
 **Objective:** Confirm behavior when components fail.
+
 1. Stop the `rig-daemon.js` (Ctrl+C in terminal).
 2. **Verify:** The Rig Control panel status LED turns **RED** (within ~5 seconds).
 3. **Verify:** An error banner "Daemon not reachable" appears in the panel.
@@ -127,15 +144,17 @@ The OpenHamClock web app cannot talk directly to your rig; it needs a small brid
 5. **Verify:** The panel recovers to **GREEN** automatically.
 
 ### TC-07: Configurable Tune Delay
+
 **Objective:** Verify that the ATU trigger duration can be customized.
 **Prerequisite:** Feature "Click-to-tune" enabled in Settings.
 
-| Test Step | Action | Expected Behavior |
-| :--- | :--- | :--- |
-| **7.1** | Default Config | Stop daemon. Ensure `tuneDelay` is `3000` (or missing) in `rig-config.json`. Start daemon. Click a spot. Verify "Tune" (or PTT) lasts ~3 seconds. |
-| **7.2** | Custom Config | Stop daemon. Edit `rig-config.json`: set `"tuneDelay": 5000`. Start daemon. Click a spot. Verify "Tune" (or PTT) lasts ~5 seconds. |
+| Test Step | Action         | Expected Behavior                                                                                                                                 |
+| :-------- | :------------- | :------------------------------------------------------------------------------------------------------------------------------------------------ |
+| **7.1**   | Default Config | Stop daemon. Ensure `tuneDelay` is `3000` (or missing) in `rig-config.json`. Start daemon. Click a spot. Verify "Tune" (or PTT) lasts ~3 seconds. |
+| **7.2**   | Custom Config  | Stop daemon. Edit `rig-config.json`: set `"tuneDelay": 5000`. Start daemon. Click a spot. Verify "Tune" (or PTT) lasts ~5 seconds.                |
 
 ## 6. Cleanup
+
 - Stop the daemon (`Ctrl+C`).
 - Stop the frontend (`Ctrl+C`).
 - (Optional) Uncheck "Enable Hamlib integration" in Settings if returning to normal use without the daemon.
diff --git a/rig-listener/README.md b/rig-listener/README.md
index 481b269d..80c48893 100644
--- a/rig-listener/README.md
+++ b/rig-listener/README.md
@@ -8,12 +8,12 @@ No flrig. No rigctld. No Node.js. Just a single executable that connects your ra
 
 Grab the right file for your computer from the [Releases](../../releases) page:
 
-| Platform | Download |
-|----------|----------|
-| **Windows** (64-bit) | `rig-listener-win-x64.exe` |
-| **Mac** (Apple Silicon — M1/M2/M3) | `rig-listener-mac-arm64` |
-| **Mac** (Intel) | `rig-listener-mac-x64` |
-| **Linux** (64-bit) | `rig-listener-linux-x64` |
+| Platform                           | Download                   |
+| ---------------------------------- | -------------------------- |
+| **Windows** (64-bit)               | `rig-listener-win-x64.exe` |
+| **Mac** (Apple Silicon — M1/M2/M3) | `rig-listener-mac-arm64`   |
+| **Mac** (Intel)                    | `rig-listener-mac-x64`     |
+| **Linux** (64-bit)                 | `rig-listener-linux-x64`   |
 
 ## Setup (One Time)
 
@@ -24,13 +24,16 @@ Grab the right file for your computer from the [Releases](../../releases) page:
 **Windows:** Double-click `rig-listener-win-x64.exe`
 
 **Mac:** Open Terminal, then:
+
 ```bash
 chmod +x rig-listener-mac-arm64
 ./rig-listener-mac-arm64
 ```
+
 > Mac may show a security warning. Go to System Settings → Privacy & Security → click "Allow Anyway".
 
 **Linux:**
+
 ```bash
 chmod +x rig-listener-linux-x64
 ./rig-listener-linux-x64
@@ -62,6 +65,7 @@ The wizard lists your serial ports, asks your radio brand, and saves the config:
 ### 4. Connect OpenHamClock
 
 In **Settings → Rig Control**:
+
 - ☑ Enable Rig Control
 - Host: `http://localhost`
 - Port: `5555`
@@ -88,12 +92,12 @@ To re-run the wizard: `rig-listener --wizard`
 
 ## Supported Radios
 
-| Brand | Models | Protocol |
-|-------|--------|----------|
-| **Yaesu** | FT-991A, FT-891, FT-710, FT-DX10, FT-DX101, FT-450D, FT-817/818 | CAT |
-| **Kenwood** | TS-590, TS-890, TS-480, TS-2000 | Kenwood |
-| **Elecraft** | K3, K4, KX3, KX2 | Kenwood-compatible |
-| **Icom** | IC-7300, IC-7610, IC-705, IC-9700, IC-7100 | CI-V |
+| Brand        | Models                                                          | Protocol           |
+| ------------ | --------------------------------------------------------------- | ------------------ |
+| **Yaesu**    | FT-991A, FT-891, FT-710, FT-DX10, FT-DX101, FT-450D, FT-817/818 | CAT                |
+| **Kenwood**  | TS-590, TS-890, TS-480, TS-2000                                 | Kenwood            |
+| **Elecraft** | K3, K4, KX3, KX2                                                | Kenwood-compatible |
+| **Icom**     | IC-7300, IC-7610, IC-705, IC-9700, IC-7100                      | CI-V               |
 
 ## Radio Configuration
 
@@ -121,19 +125,23 @@ The listener polls your radio every 500ms for frequency/mode/PTT and pushes chan
 ## Troubleshooting
 
 **No serial ports detected**
+
 - Is the USB cable plugged in?
 - Windows: Check Device Manager → Ports. You may need the [Silicon Labs CP210x driver](https://www.silabs.com/developers/usb-to-uart-bridge-vcp-drivers)
 - Linux: `sudo usermod -a -G dialout $USER` then log out/in
 
 **"Port in use"**
+
 - Close flrig, rigctld, WSJT-X, fldigi, or any other program using the same serial port. Only one program can use a serial port at a time.
 
 **Connected but no frequency updates**
+
 - Baud rate mismatch — must match your radio's CAT rate setting exactly
 - Wrong brand selected — re-run with `--wizard`
 - Icom: CI-V address must match (re-run wizard to change)
 
 **Mac security warning**
+
 - System Settings → Privacy & Security → scroll down → click "Allow Anyway"
 
 ## Command Line Options
@@ -160,6 +168,7 @@ node rig-listener.js
 ```
 
 To build your own executable:
+
 ```bash
 npm run build
 ```
diff --git a/rig-listener/build.js b/rig-listener/build.js
index e27bc947..76d9e32a 100644
--- a/rig-listener/build.js
+++ b/rig-listener/build.js
@@ -1,11 +1,11 @@
 #!/usr/bin/env node
 /**
  * Build helper — creates a standalone executable for the current platform.
- * 
+ *
  * Usage:
  *   node build.js              Build for current OS
  *   node build.js --all        Build for all platforms (from GitHub Actions)
- * 
+ *
  * Requires: npm install (serialport must be installed first)
  * Uses: @yao-pkg/pkg (auto-downloaded via npx)
  */
diff --git a/rig-listener/rig-listener.js b/rig-listener/rig-listener.js
index c89f60cd..308c8fa6 100644
--- a/rig-listener/rig-listener.js
+++ b/rig-listener/rig-listener.js
@@ -27,9 +27,7 @@ const VERSION = '1.0.0';
 const HTTP_PORT_DEFAULT = 5555;
 
 // Config lives NEXT TO the executable (or cwd for dev), NOT inside the pkg snapshot
-const CONFIG_DIR = process.pkg
-  ? path.dirname(process.execPath)
-  : __dirname;
+const CONFIG_DIR = process.pkg ? path.dirname(process.execPath) : __dirname;
 const CONFIG_FILE = path.join(CONFIG_DIR, 'rig-listener-config.json');
 
 // ============================================
@@ -48,8 +46,13 @@ let sseClients = [];
 
 function broadcast(data) {
   const msg = `data: ${JSON.stringify(data)}\n\n`;
-  sseClients = sseClients.filter(c => {
-    try { c.write(msg); return true; } catch { return false; }
+  sseClients = sseClients.filter((c) => {
+    try {
+      c.write(msg);
+      return true;
+    } catch {
+      return false;
+    }
   });
 }
 
@@ -65,13 +68,21 @@ function updateState(prop, value) {
 // FT-991A, FT-891, FT-710, FT-DX10, FT-DX101, FT-450D, etc.
 // ============================================
 const YAESU_MODES = {
-  '1': 'LSB', '2': 'USB', '3': 'CW', '4': 'FM', '5': 'AM',
-  '6': 'RTTY-LSB', '7': 'CW-R', '8': 'DATA-LSB', '9': 'RTTY-USB',
-  'A': 'DATA-FM', 'B': 'FM-N', 'C': 'DATA-USB', 'D': 'AM-N',
+  1: 'LSB',
+  2: 'USB',
+  3: 'CW',
+  4: 'FM',
+  5: 'AM',
+  6: 'RTTY-LSB',
+  7: 'CW-R',
+  8: 'DATA-LSB',
+  9: 'RTTY-USB',
+  A: 'DATA-FM',
+  B: 'FM-N',
+  C: 'DATA-USB',
+  D: 'AM-N',
 };
-const YAESU_MODES_REV = Object.fromEntries(
-  Object.entries(YAESU_MODES).map(([k, v]) => [v, k])
-);
+const YAESU_MODES_REV = Object.fromEntries(Object.entries(YAESU_MODES).map(([k, v]) => [v, k]));
 
 const YaesuProtocol = {
   buffer: '',
@@ -126,12 +137,16 @@ const YaesuProtocol = {
 // KENWOOD / ELECRAFT PROTOCOL
 // ============================================
 const KENWOOD_MODES = {
-  '1': 'LSB', '2': 'USB', '3': 'CW', '4': 'FM', '5': 'AM',
-  '6': 'FSK', '7': 'CW-R', '9': 'FSK-R',
+  1: 'LSB',
+  2: 'USB',
+  3: 'CW',
+  4: 'FM',
+  5: 'AM',
+  6: 'FSK',
+  7: 'CW-R',
+  9: 'FSK-R',
 };
-const KENWOOD_MODES_REV = Object.fromEntries(
-  Object.entries(KENWOOD_MODES).map(([k, v]) => [v, k])
-);
+const KENWOOD_MODES_REV = Object.fromEntries(Object.entries(KENWOOD_MODES).map(([k, v]) => [v, k]));
 
 const KenwoodProtocol = {
   buffer: '',
@@ -184,42 +199,56 @@ const KenwoodProtocol = {
 // ICOM CI-V PROTOCOL (binary)
 // ============================================
 const ICOM_MODES = {
-  0x00: 'LSB', 0x01: 'USB', 0x02: 'AM', 0x03: 'CW', 0x04: 'RTTY',
-  0x05: 'FM', 0x06: 'WFM', 0x07: 'CW-R', 0x08: 'RTTY-R', 0x17: 'DV',
+  0x00: 'LSB',
+  0x01: 'USB',
+  0x02: 'AM',
+  0x03: 'CW',
+  0x04: 'RTTY',
+  0x05: 'FM',
+  0x06: 'WFM',
+  0x07: 'CW-R',
+  0x08: 'RTTY-R',
+  0x17: 'DV',
 };
-const ICOM_MODES_REV = Object.fromEntries(
-  Object.entries(ICOM_MODES).map(([k, v]) => [v, parseInt(k)])
-);
+const ICOM_MODES_REV = Object.fromEntries(Object.entries(ICOM_MODES).map(([k, v]) => [v, parseInt(k)]));
 const ICOM_ADDRESSES = {
-  'IC-7300': 0x94, 'IC-7610': 0x98, 'IC-705': 0xA4,
-  'IC-9700': 0xA2, 'IC-7100': 0x88, 'IC-7851': 0x8E,
-  'IC-7600': 0x7A, 'IC-746': 0x56, 'IC-718': 0x5E,
+  'IC-7300': 0x94,
+  'IC-7610': 0x98,
+  'IC-705': 0xa4,
+  'IC-9700': 0xa2,
+  'IC-7100': 0x88,
+  'IC-7851': 0x8e,
+  'IC-7600': 0x7a,
+  'IC-746': 0x56,
+  'IC-718': 0x5e,
 };
 
 const IcomProtocol = {
   buffer: Buffer.alloc(0),
   civAddr: 0x94,
-  controllerAddr: 0xE0,
+  controllerAddr: 0xe0,
 
   buildPollCommands() {
-    return [
-      this._frame([0x03]),
-      this._frame([0x04]),
-      this._frame([0x1C, 0x00]),
-    ];
+    return [this._frame([0x03]), this._frame([0x04]), this._frame([0x1c, 0x00])];
   },
 
   _frame(payload) {
-    return Buffer.from([0xFE, 0xFE, this.civAddr, this.controllerAddr, ...payload, 0xFD]);
+    return Buffer.from([0xfe, 0xfe, this.civAddr, this.controllerAddr, ...payload, 0xfd]);
   },
 
   parseResponse(chunk) {
     this.buffer = Buffer.concat([this.buffer, typeof chunk === 'string' ? Buffer.from(chunk, 'binary') : chunk]);
     while (true) {
-      const start = this.buffer.indexOf(Buffer.from([0xFE, 0xFE]));
-      if (start === -1) { this.buffer = Buffer.alloc(0); return; }
-      const endIdx = this.buffer.indexOf(0xFD, start + 2);
-      if (endIdx === -1) { this.buffer = this.buffer.subarray(start); return; }
+      const start = this.buffer.indexOf(Buffer.from([0xfe, 0xfe]));
+      if (start === -1) {
+        this.buffer = Buffer.alloc(0);
+        return;
+      }
+      const endIdx = this.buffer.indexOf(0xfd, start + 2);
+      if (endIdx === -1) {
+        this.buffer = this.buffer.subarray(start);
+        return;
+      }
 
       const frame = this.buffer.subarray(start, endIdx + 1);
       this.buffer = this.buffer.subarray(endIdx + 1);
@@ -234,17 +263,20 @@ const IcomProtocol = {
         if (freq > 0) updateState('freq', freq);
       } else if ((cmd === 0x04 || cmd === 0x01) && data.length >= 1) {
         updateState('mode', ICOM_MODES[data[0]] || `MODE_${data[0].toString(16)}`);
-      } else if (cmd === 0x1C && data.length >= 2 && data[0] === 0x00) {
+      } else if (cmd === 0x1c && data.length >= 2 && data[0] === 0x00) {
         updateState('ptt', data[1] === 0x01);
       }
     }
   },
 
   _bcdToFreq(data) {
-    let freq = 0, mult = 1;
+    let freq = 0,
+      mult = 1;
     for (let i = 0; i < Math.min(data.length, 5); i++) {
-      freq += (data[i] & 0x0F) * mult; mult *= 10;
-      freq += ((data[i] >> 4) & 0x0F) * mult; mult *= 10;
+      freq += (data[i] & 0x0f) * mult;
+      mult *= 10;
+      freq += ((data[i] >> 4) & 0x0f) * mult;
+      mult *= 10;
     }
     return freq;
   },
@@ -253,8 +285,10 @@ const IcomProtocol = {
     const buf = Buffer.alloc(5);
     let f = Math.round(hz);
     for (let i = 0; i < 5; i++) {
-      const lo = f % 10; f = Math.floor(f / 10);
-      const hi = f % 10; f = Math.floor(f / 10);
+      const lo = f % 10;
+      f = Math.floor(f / 10);
+      const hi = f % 10;
+      f = Math.floor(f / 10);
       buf[i] = (hi << 4) | lo;
     }
     return buf;
@@ -270,7 +304,7 @@ const IcomProtocol = {
   },
 
   setPttCmd(on) {
-    return this._frame([0x1C, 0x00, on ? 0x01 : 0x00]);
+    return this._frame([0x1c, 0x00, on ? 0x01 : 0x00]);
   },
 };
 
@@ -278,11 +312,19 @@ const IcomProtocol = {
 // MOCK PROTOCOL
 // ============================================
 const MockProtocol = {
-  buildPollCommands() { return []; },
+  buildPollCommands() {
+    return [];
+  },
   parseResponse() {},
-  setFreqCmd() { return null; },
-  setModeCmd() { return null; },
-  setPttCmd() { return null; },
+  setFreqCmd() {
+    return null;
+  },
+  setModeCmd() {
+    return null;
+  },
+  setPttCmd() {
+    return null;
+  },
 };
 
 // ============================================
@@ -299,9 +341,19 @@ async function initSerial(cfg) {
 
   if (brand === 'yaesu') protocol = YaesuProtocol;
   else if (brand === 'kenwood' || brand === 'elecraft') protocol = KenwoodProtocol;
-  else if (brand === 'icom') { protocol = IcomProtocol; IcomProtocol.civAddr = cfg.radio.civAddress || 0x94; }
-  else if (brand === 'mock') { protocol = MockProtocol; state.connected = true; state.freq = 14074000; state.mode = 'USB'; return; }
-  else { console.error(`[Error] Unknown brand: ${brand}`); process.exit(1); }
+  else if (brand === 'icom') {
+    protocol = IcomProtocol;
+    IcomProtocol.civAddr = cfg.radio.civAddress || 0x94;
+  } else if (brand === 'mock') {
+    protocol = MockProtocol;
+    state.connected = true;
+    state.freq = 14074000;
+    state.mode = 'USB';
+    return;
+  } else {
+    console.error(`[Error] Unknown brand: ${brand}`);
+    process.exit(1);
+  }
 
   let SerialPort;
   try {
@@ -337,7 +389,9 @@ async function initSerial(cfg) {
     pollTimer = setInterval(() => {
       if (!serialPort?.isOpen) return;
       for (const cmd of protocol.buildPollCommands()) {
-        try { serialPort.write(cmd); } catch {}
+        try {
+          serialPort.write(cmd);
+        } catch {}
       }
     }, cfg.radio.pollInterval || 500);
   });
@@ -367,10 +421,8 @@ async function initSerial(cfg) {
       console.error('  Troubleshooting:');
       console.error('    • Is the USB cable connected?');
       console.error('    • Is another program using this port? (flrig, WSJT-X, etc.)');
-      if (process.platform === 'linux')
-        console.error('    • Try: sudo usermod -a -G dialout $USER  (then log out/in)');
-      if (process.platform === 'win32')
-        console.error('    • Check Device Manager → Ports for correct COM port');
+      if (process.platform === 'linux') console.error('    • Try: sudo usermod -a -G dialout $USER  (then log out/in)');
+      if (process.platform === 'win32') console.error('    • Check Device Manager → Ports for correct COM port');
       console.error('');
       setTimeout(() => reconnect(cfg), 5000);
     }
@@ -378,15 +430,25 @@ async function initSerial(cfg) {
 }
 
 function reconnect(cfg) {
-  if (serialPort) { try { serialPort.close(); } catch {} serialPort = null; }
+  if (serialPort) {
+    try {
+      serialPort.close();
+    } catch {}
+    serialPort = null;
+  }
   console.log(`[Serial] Reconnecting to ${cfg.serial.port}...`);
   initSerial(cfg);
 }
 
 function sendToRadio(data) {
   if (!serialPort?.isOpen) return false;
-  try { serialPort.write(data); return true; }
-  catch (e) { console.error(`[Serial] Write error: ${e.message}`); return false; }
+  try {
+    serialPort.write(data);
+    return true;
+  } catch (e) {
+    console.error(`[Serial] Write error: ${e.message}`);
+    return false;
+  }
 }
 
 // ============================================
@@ -397,65 +459,126 @@ function startServer(port) {
     res.setHeader('Access-Control-Allow-Origin', '*');
     res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS');
     res.setHeader('Access-Control-Allow-Headers', 'Content-Type');
-    if (req.method === 'OPTIONS') { res.writeHead(204); res.end(); return; }
+    if (req.method === 'OPTIONS') {
+      res.writeHead(204);
+      res.end();
+      return;
+    }
 
     const pathname = new URL(req.url, `http://${req.headers.host}`).pathname;
 
     if (req.method === 'GET' && pathname === '/status') {
       res.writeHead(200, { 'Content-Type': 'application/json' });
-      res.end(JSON.stringify({ connected: state.connected, freq: state.freq, mode: state.mode, width: state.width, ptt: state.ptt, timestamp: state.lastUpdate }));
+      res.end(
+        JSON.stringify({
+          connected: state.connected,
+          freq: state.freq,
+          mode: state.mode,
+          width: state.width,
+          ptt: state.ptt,
+          timestamp: state.lastUpdate,
+        }),
+      );
     } else if (req.method === 'GET' && pathname === '/stream') {
-      res.writeHead(200, { 'Content-Type': 'text/event-stream', 'Cache-Control': 'no-cache', Connection: 'keep-alive', 'Access-Control-Allow-Origin': '*' });
-      res.write(`data: ${JSON.stringify({ type: 'init', connected: state.connected, freq: state.freq, mode: state.mode, width: state.width, ptt: state.ptt })}\n\n`);
+      res.writeHead(200, {
+        'Content-Type': 'text/event-stream',
+        'Cache-Control': 'no-cache',
+        Connection: 'keep-alive',
+        'Access-Control-Allow-Origin': '*',
+      });
+      res.write(
+        `data: ${JSON.stringify({ type: 'init', connected: state.connected, freq: state.freq, mode: state.mode, width: state.width, ptt: state.ptt })}\n\n`,
+      );
       sseClients.push(res);
-      req.on('close', () => { sseClients = sseClients.filter(c => c !== res); });
+      req.on('close', () => {
+        sseClients = sseClients.filter((c) => c !== res);
+      });
     } else if (req.method === 'POST' && pathname === '/freq') {
       parseBody(req, (body) => {
-        if (!body?.freq) { res.writeHead(400); res.end('{"error":"Missing freq"}'); return; }
+        if (!body?.freq) {
+          res.writeHead(400);
+          res.end('{"error":"Missing freq"}');
+          return;
+        }
         const cmd = protocol.setFreqCmd(body.freq);
-        if (cmd) { console.log(`[CMD] Freq → ${body.freq} Hz`); sendToRadio(cmd); }
-        res.writeHead(200, { 'Content-Type': 'application/json' }); res.end('{"success":true}');
+        if (cmd) {
+          console.log(`[CMD] Freq → ${body.freq} Hz`);
+          sendToRadio(cmd);
+        }
+        res.writeHead(200, { 'Content-Type': 'application/json' });
+        res.end('{"success":true}');
       });
     } else if (req.method === 'POST' && pathname === '/mode') {
       parseBody(req, (body) => {
-        if (!body?.mode) { res.writeHead(400); res.end('{"error":"Missing mode"}'); return; }
+        if (!body?.mode) {
+          res.writeHead(400);
+          res.end('{"error":"Missing mode"}');
+          return;
+        }
         const cmd = protocol.setModeCmd(body.mode);
-        if (cmd) { console.log(`[CMD] Mode → ${body.mode}`); sendToRadio(cmd); }
-        res.writeHead(200, { 'Content-Type': 'application/json' }); res.end('{"success":true}');
+        if (cmd) {
+          console.log(`[CMD] Mode → ${body.mode}`);
+          sendToRadio(cmd);
+        }
+        res.writeHead(200, { 'Content-Type': 'application/json' });
+        res.end('{"success":true}');
       });
     } else if (req.method === 'POST' && pathname === '/ptt') {
       parseBody(req, (body) => {
-        if (!config?.radio?.pttEnabled && body?.ptt) { res.writeHead(403); res.end('{"error":"PTT disabled"}'); return; }
+        if (!config?.radio?.pttEnabled && body?.ptt) {
+          res.writeHead(403);
+          res.end('{"error":"PTT disabled"}');
+          return;
+        }
         const cmd = protocol.setPttCmd(!!body?.ptt);
-        if (cmd) { console.log(`[CMD] PTT → ${body.ptt ? 'ON' : 'OFF'}`); sendToRadio(cmd); }
-        res.writeHead(200, { 'Content-Type': 'application/json' }); res.end('{"success":true}');
+        if (cmd) {
+          console.log(`[CMD] PTT → ${body.ptt ? 'ON' : 'OFF'}`);
+          sendToRadio(cmd);
+        }
+        res.writeHead(200, { 'Content-Type': 'application/json' });
+        res.end('{"success":true}');
       });
     } else if (req.method === 'GET' && pathname === '/') {
       res.writeHead(200, { 'Content-Type': 'application/json' });
       res.end(JSON.stringify({ name: 'OpenHamClock Rig Listener', version: VERSION, connected: state.connected }));
     } else {
-      res.writeHead(404); res.end('{"error":"Not found"}');
+      res.writeHead(404);
+      res.end('{"error":"Not found"}');
     }
   });
 
-  server.listen(port, '0.0.0.0', () => { console.log(`[HTTP] Listening on port ${port}`); });
+  server.listen(port, '0.0.0.0', () => {
+    console.log(`[HTTP] Listening on port ${port}`);
+  });
   server.on('error', (err) => {
-    if (err.code === 'EADDRINUSE') { console.error(`\n  ❌ Port ${port} already in use.\n`); process.exit(1); }
+    if (err.code === 'EADDRINUSE') {
+      console.error(`\n  ❌ Port ${port} already in use.\n`);
+      process.exit(1);
+    }
   });
 }
 
 function parseBody(req, cb) {
   let d = '';
-  req.on('data', c => d += c);
-  req.on('end', () => { try { cb(JSON.parse(d)); } catch { cb(null); } });
+  req.on('data', (c) => (d += c));
+  req.on('end', () => {
+    try {
+      cb(JSON.parse(d));
+    } catch {
+      cb(null);
+    }
+  });
 }
 
 // ============================================
 // LIST SERIAL PORTS
 // ============================================
 async function listPorts() {
-  try { return await require('serialport').SerialPort.list(); }
-  catch { return []; }
+  try {
+    return await require('serialport').SerialPort.list();
+  } catch {
+    return [];
+  }
 }
 
 // ============================================
@@ -463,7 +586,7 @@ async function listPorts() {
 // ============================================
 async function runWizard() {
   const rl = readline.createInterface({ input: process.stdin, output: process.stdout });
-  const ask = (q) => new Promise(r => rl.question(q, r));
+  const ask = (q) => new Promise((r) => rl.question(q, r));
 
   console.log('');
   console.log('  ┌──────────────────────────────────────────────┐');
@@ -490,11 +613,15 @@ async function runWizard() {
   if (ports.length > 0) {
     const choice = await ask(`  Select port (1-${ports.length}, or type path): `);
     const idx = parseInt(choice) - 1;
-    selectedPort = (idx >= 0 && idx < ports.length) ? ports[idx].path : choice.trim();
+    selectedPort = idx >= 0 && idx < ports.length ? ports[idx].path : choice.trim();
   } else {
     selectedPort = (await ask('  Enter serial port (e.g. COM3 or /dev/ttyUSB0): ')).trim();
   }
-  if (!selectedPort) { console.log('\n  ❌ No port selected.\n'); rl.close(); process.exit(1); }
+  if (!selectedPort) {
+    console.log('\n  ❌ No port selected.\n');
+    rl.close();
+    process.exit(1);
+  }
   console.log(`\n  ✅ Port: ${selectedPort}\n`);
 
   console.log('  📻 Radio brand:\n');
@@ -504,7 +631,7 @@ async function runWizard() {
   console.log('     4) Icom      (IC-7300, IC-7610, IC-705, IC-9700)');
   console.log('');
   const brandChoice = (await ask('  Select brand (1-4): ')).trim();
-  const brand = { '1': 'yaesu', '2': 'kenwood', '3': 'elecraft', '4': 'icom' }[brandChoice] || 'yaesu';
+  const brand = { 1: 'yaesu', 2: 'kenwood', 3: 'elecraft', 4: 'icom' }[brandChoice] || 'yaesu';
   console.log(`\n  ✅ Brand: ${brand}\n`);
 
   const model = (await ask('  Radio model (optional, e.g. FT-991A): ')).trim();
@@ -525,7 +652,8 @@ async function runWizard() {
     if (civInput) civAddress = parseInt(civInput, 16) || civAddress;
   }
 
-  const httpPort = parseInt((await ask(`\n  HTTP port for OpenHamClock [${HTTP_PORT_DEFAULT}]: `)).trim()) || HTTP_PORT_DEFAULT;
+  const httpPort =
+    parseInt((await ask(`\n  HTTP port for OpenHamClock [${HTTP_PORT_DEFAULT}]: `)).trim()) || HTTP_PORT_DEFAULT;
   rl.close();
 
   const cfg = {
@@ -548,13 +676,28 @@ function parseCLI() {
   const o = {};
   for (let i = 0; i < args.length; i++) {
     switch (args[i]) {
-      case '--port': case '-p': o.serialPort = args[++i]; break;
-      case '--baud': case '-b': o.baudRate = parseInt(args[++i]); break;
-      case '--brand': o.brand = args[++i]; break;
-      case '--http-port': o.httpPort = parseInt(args[++i]); break;
-      case '--mock': o.mock = true; break;
-      case '--wizard': o.forceWizard = true; break;
-      case '--help': case '-h':
+      case '--port':
+      case '-p':
+        o.serialPort = args[++i];
+        break;
+      case '--baud':
+      case '-b':
+        o.baudRate = parseInt(args[++i]);
+        break;
+      case '--brand':
+        o.brand = args[++i];
+        break;
+      case '--http-port':
+        o.httpPort = parseInt(args[++i]);
+        break;
+      case '--mock':
+        o.mock = true;
+        break;
+      case '--wizard':
+        o.forceWizard = true;
+        break;
+      case '--help':
+      case '-h':
         console.log(`
 OpenHamClock Rig Listener v${VERSION}
 
@@ -596,17 +739,26 @@ async function main() {
 
   if (cli.mock) {
     config = { radio: { brand: 'mock', pttEnabled: false }, server: { port: cli.httpPort || HTTP_PORT_DEFAULT } };
-    protocol = MockProtocol; state.connected = true; state.freq = 14074000; state.mode = 'USB';
+    protocol = MockProtocol;
+    state.connected = true;
+    state.freq = 14074000;
+    state.mode = 'USB';
     console.log('  📻 Simulation mode — no radio needed\n');
-    startServer(config.server.port); printInstructions(config.server.port); return;
+    startServer(config.server.port);
+    printInstructions(config.server.port);
+    return;
   }
 
   let cfg;
   if (cli.forceWizard || !fs.existsSync(CONFIG_FILE)) {
     cfg = await runWizard();
   } else {
-    try { cfg = JSON.parse(fs.readFileSync(CONFIG_FILE, 'utf8')); console.log(`  📂 Loaded: ${CONFIG_FILE}`); }
-    catch { cfg = await runWizard(); }
+    try {
+      cfg = JSON.parse(fs.readFileSync(CONFIG_FILE, 'utf8'));
+      console.log(`  📂 Loaded: ${CONFIG_FILE}`);
+    } catch {
+      cfg = await runWizard();
+    }
   }
 
   if (cli.serialPort) cfg.serial.port = cli.serialPort;
@@ -614,7 +766,10 @@ async function main() {
   if (cli.brand) cfg.radio.brand = cli.brand;
   if (cli.httpPort) cfg.server.port = cli.httpPort;
 
-  if (!cfg.serial.port) { console.error('  ❌ No serial port. Run with --wizard\n'); process.exit(1); }
+  if (!cfg.serial.port) {
+    console.error('  ❌ No serial port. Run with --wizard\n');
+    process.exit(1);
+  }
 
   console.log(`  📻 Radio: ${cfg.radio.brand.toUpperCase()} ${cfg.radio.model || ''}`);
   console.log(`  🔌 Port:  ${cfg.serial.port} @ ${cfg.serial.baudRate} baud`);
@@ -641,9 +796,19 @@ function printInstructions(port) {
 process.on('SIGINT', () => {
   console.log('\n  Shutting down...');
   if (pollTimer) clearInterval(pollTimer);
-  if (serialPort?.isOpen) { serialPort.close(() => { console.log('  73!'); process.exit(0); }); }
-  else { console.log('  73!'); process.exit(0); }
+  if (serialPort?.isOpen) {
+    serialPort.close(() => {
+      console.log('  73!');
+      process.exit(0);
+    });
+  } else {
+    console.log('  73!');
+    process.exit(0);
+  }
 });
 process.on('SIGTERM', () => process.emit('SIGINT'));
 
-main().catch(err => { console.error(`\n❌ ${err.message}\n`); process.exit(1); });
+main().catch((err) => {
+  console.error(`\n❌ ${err.message}\n`);
+  process.exit(1);
+});
diff --git a/src/App.jsx b/src/App.jsx
index 7075cce1..a9fedb70 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -29,7 +29,7 @@ import {
   useSatellites,
   useSolarIndices,
   usePSKReporter,
-  useWSJTX
+  useWSJTX,
 } from './hooks';
 
 import useAppConfig from './hooks/app/useAppConfig';
@@ -52,13 +52,7 @@ const App = () => {
   const { t } = useTranslation();
 
   // Core config/state
-  const {
-    config,
-    configLoaded,
-    showDxWeather,
-    classicAnalogClock,
-    handleSaveConfig
-  } = useAppConfig();
+  const { config, configLoaded, showDxWeather, classicAnalogClock, handleSaveConfig } = useAppConfig();
 
   const [showSettings, setShowSettings] = useState(false);
   const [showDXFilters, setShowDXFilters] = useState(false);
@@ -66,13 +60,17 @@ const App = () => {
   const [layoutResetKey, setLayoutResetKey] = useState(0);
   const [, setBandColorChangeVersion] = useState(0);
   const [tempUnit, setTempUnit] = useState(() => {
-    try { return localStorage.getItem('openhamclock_tempUnit') || 'F'; } catch { return 'F'; }
+    try {
+      return localStorage.getItem('openhamclock_tempUnit') || 'F';
+    } catch {
+      return 'F';
+    }
   });
   const [updateInProgress, setUpdateInProgress] = useState(false);
 
   useEffect(() => {
     const onBandColorsChange = () => {
-      setBandColorChangeVersion(v => v + 1);
+      setBandColorChangeVersion((v) => v + 1);
     };
     window.addEventListener('openhamclock-band-colors-change', onBandColorsChange);
     return () => window.removeEventListener('openhamclock-band-colors-change', onBandColorsChange);
@@ -83,12 +81,12 @@ const App = () => {
     const hasLocalStorage = localStorage.getItem('openhamclock_config');
     if (!hasLocalStorage && config.callsign === 'N0CALL') {
       setShowSettings(true);
-      
+
       // Auto-detect mobile/tablet on first visit and set appropriate layout
       const isTouchDevice = 'ontouchstart' in window || navigator.maxTouchPoints > 0;
       const isSmallScreen = window.innerWidth <= 768;
       const isTabletSize = window.innerWidth > 768 && window.innerWidth <= 1200;
-      
+
       if (isTouchDevice && isSmallScreen) {
         // Phone → compact layout
         handleSaveConfig({ ...config, layout: 'compact' });
@@ -101,7 +99,7 @@ const App = () => {
 
   const handleResetLayout = useCallback(() => {
     resetLayout();
-    setLayoutResetKey(prev => prev + 1);
+    setLayoutResetKey((prev) => prev + 1);
   }, []);
 
   const handleUpdateClick = useCallback(async () => {
@@ -112,13 +110,21 @@ const App = () => {
     try {
       const res = await fetch('/api/update', { method: 'POST' });
       let payload = {};
-      try { payload = await res.json(); } catch { /* ignore */ }
+      try {
+        payload = await res.json();
+      } catch {
+        /* ignore */
+      }
       if (!res.ok) {
         throw new Error(payload.error || t('app.update.failedToStart'));
       }
       alert(t('app.update.started'));
       setTimeout(() => {
-        try { window.location.reload(); } catch { /* ignore */ }
+        try {
+          window.location.reload();
+        } catch {
+          /* ignore */
+        }
       }, 15000);
     } catch (err) {
       setUpdateInProgress(false);
@@ -127,12 +133,7 @@ const App = () => {
   }, [updateInProgress, t]);
 
   // Location & map state
-  const {
-    dxLocation,
-    dxLocked,
-    handleToggleDxLock,
-    handleDXChange
-  } = useDXLocation(config.defaultDX);
+  const { dxLocation, dxLocked, handleToggleDxLock, handleDXChange } = useDXLocation(config.defaultDX);
 
   const {
     mapLayers,
@@ -144,15 +145,10 @@ const App = () => {
     toggleSatellites,
     togglePSKReporter,
     toggleWSJTX,
-    toggleDXNews
+    toggleDXNews,
   } = useMapLayers();
 
-  const {
-    dxFilters,
-    setDxFilters,
-    pskFilters,
-    setPskFilters
-  } = useFilters();
+  const { dxFilters, setDxFilters, pskFilters, setPskFilters } = useFilters();
 
   const { isFullscreen, handleFullscreenToggle } = useFullscreen();
   const scale = useResponsiveScale();
@@ -177,15 +173,11 @@ const App = () => {
   const pskReporter = usePSKReporter(config.callsign, {
     minutes: config.lowMemoryMode ? 5 : 30,
     enabled: config.callsign !== 'N0CALL',
-    maxSpots: config.lowMemoryMode ? 50 : 500
+    maxSpots: config.lowMemoryMode ? 50 : 500,
   });
   const wsjtx = useWSJTX();
 
-  const {
-    satelliteFilters,
-    setSatelliteFilters,
-    filteredSatellites
-  } = useSatellitesFilters(satellites.data);
+  const { satelliteFilters, setSatelliteFilters, filteredSatellites } = useSatellitesFilters(satellites.data);
 
   const {
     currentTime,
@@ -199,7 +191,7 @@ const App = () => {
     deGrid,
     dxGrid,
     deSunTimes,
-    dxSunTimes
+    dxSunTimes,
   } = useTimeState(config.location, dxLocation, config.timezone);
 
   const filteredPskSpots = useMemo(() => {
@@ -207,7 +199,7 @@ const App = () => {
     if (!pskFilters?.bands?.length && !pskFilters?.grids?.length && !pskFilters?.modes?.length) {
       return allSpots;
     }
-    return allSpots.filter(spot => {
+    return allSpots.filter((spot) => {
       if (pskFilters?.bands?.length && !pskFilters.bands.includes(spot.band)) return false;
       if (pskFilters?.modes?.length && !pskFilters.modes.includes(spot.mode)) return false;
       if (pskFilters?.grids?.length) {
@@ -223,23 +215,27 @@ const App = () => {
   const wsjtxMapSpots = useMemo(() => {
     // Apply same age filter as panel (stored in localStorage)
     let ageMinutes = 30;
-    try { ageMinutes = parseInt(localStorage.getItem('ohc_wsjtx_age')) || 30; } catch {}
+    try {
+      ageMinutes = parseInt(localStorage.getItem('ohc_wsjtx_age')) || 30;
+    } catch {}
     const ageCutoff = Date.now() - ageMinutes * 60 * 1000;
-    
+
     // Map all decodes with resolved coordinates (CQ, QSO exchanges, prefix estimates)
     // WorldMap deduplicates by callsign, keeping most recent
-    return wsjtx.decodes.filter(d => d.lat && d.lon && d.timestamp >= ageCutoff);
+    return wsjtx.decodes.filter((d) => d.lat && d.lon && d.timestamp >= ageCutoff);
   }, [wsjtx.decodes]);
 
   // Map hover
   const [hoveredSpot, setHoveredSpot] = useState(null);
 
   // Sidebar visibility & layout (used by some layouts)
-  const leftSidebarVisible = config.panels?.deLocation?.visible !== false ||
+  const leftSidebarVisible =
+    config.panels?.deLocation?.visible !== false ||
     config.panels?.dxLocation?.visible !== false ||
     config.panels?.solar?.visible !== false ||
     config.panels?.propagation?.visible !== false;
-  const rightSidebarVisible = config.panels?.dxCluster?.visible !== false ||
+  const rightSidebarVisible =
+    config.panels?.dxCluster?.visible !== false ||
     config.panels?.pskReporter?.visible !== false ||
     config.panels?.dxpeditions?.visible !== false ||
     config.panels?.pota?.visible !== false ||
@@ -323,31 +319,28 @@ const App = () => {
     leftSidebarVisible,
     rightSidebarVisible,
     getGridTemplateColumns,
-    scale
+    scale,
   };
 
   return (
-    <div style={{
-      width: '100vw',
-      height: '100vh',
-      background: 'var(--bg-primary)',
-      display: 'flex',
-      justifyContent: 'center',
-      alignItems: 'center',
-      overflow: 'hidden'
-    }}>
+    <div
+      style={{
+        width: '100vw',
+        height: '100vh',
+        background: 'var(--bg-primary)',
+        display: 'flex',
+        justifyContent: 'center',
+        alignItems: 'center',
+        overflow: 'hidden',
+      }}
+    >
       <RigProvider rigConfig={config.rigControl || { enabled: false, host: 'http://localhost', port: 5555 }}>
         {config.layout === 'dockable' ? (
-          <DockableLayout
-            key={layoutResetKey}
-            {...layoutProps}
-          />
-        ) : (config.layout === 'classic' || config.layout === 'tablet' || config.layout === 'compact') ? (
+          <DockableLayout key={layoutResetKey} {...layoutProps} />
+        ) : config.layout === 'classic' || config.layout === 'tablet' || config.layout === 'compact' ? (
           <ClassicLayout {...layoutProps} />
         ) : (
-          <ModernLayout
-            {...layoutProps}
-          />
+          <ModernLayout {...layoutProps} />
         )}
       </RigProvider>
 
diff --git a/src/DockableApp.jsx b/src/DockableApp.jsx
index b75727c1..29971bc2 100644
--- a/src/DockableApp.jsx
+++ b/src/DockableApp.jsx
@@ -25,7 +25,7 @@ import {
   AnalogClockPanel,
   RigControlPanel,
   OnAirPanel,
-  IDTimerPanel
+  IDTimerPanel,
 } from './components';
 
 import { loadLayout, saveLayout, DEFAULT_LAYOUT } from './store/layoutStore.js';
@@ -33,7 +33,7 @@ import { DockableLayoutProvider } from './contexts';
 import { useRig } from './contexts/RigContext.jsx';
 import './styles/flexlayout-openhamclock.css';
 import useMapLayers from './hooks/app/useMapLayers';
-import useRotator from "./hooks/useRotator";
+import useRotator from './hooks/useRotator';
 
 // Icons
 const PlusIcon = () => (
@@ -158,18 +158,22 @@ export const DockableApp = ({
     try {
       const stored = localStorage.getItem('openhamclock_panelZoom');
       return stored ? JSON.parse(stored) : {};
-    } catch { return {}; }
+    } catch {
+      return {};
+    }
   });
 
   useEffect(() => {
-    try { localStorage.setItem('openhamclock_panelZoom', JSON.stringify(panelZoom)); } catch { }
+    try {
+      localStorage.setItem('openhamclock_panelZoom', JSON.stringify(panelZoom));
+    } catch {}
   }, [panelZoom]);
 
   const ZOOM_STEPS = [0.7, 0.8, 0.9, 1.0, 1.1, 1.2, 1.3, 1.5, 1.75, 2.0];
   const adjustZoom = useCallback((component, delta) => {
-    setPanelZoom(prev => {
+    setPanelZoom((prev) => {
       const current = prev[component] || 1.0;
-      const currentIdx = ZOOM_STEPS.findIndex(s => s >= current - 0.01);
+      const currentIdx = ZOOM_STEPS.findIndex((s) => s >= current - 0.01);
       const newIdx = Math.max(0, Math.min(ZOOM_STEPS.length - 1, (currentIdx >= 0 ? currentIdx : 3) + delta));
       const newZoom = ZOOM_STEPS[newIdx];
       if (newZoom === 1.0) {
@@ -184,41 +188,44 @@ export const DockableApp = ({
   const { tuneTo, enabled } = useRig();
 
   // Unified Spot Click Handler (Tune + Set DX)
-  const handleSpotClick = useCallback((spot) => {
-    if (!spot) return;
-
-    // 1. Tune Rig if frequency is available and rig control is enabled
-    if (enabled && (spot.freq || spot.freqMHz || spot.dialFrequency)) {
-      let freqToSend;
-
-      // WSJT-X decodes have dialFrequency (the VFO frequency to tune to)
-      // The freq field is just the audio delta offset within the passband
-      if (spot.dialFrequency) {
-        freqToSend = spot.dialFrequency; // Use dial frequency directly
-      } else {
-        // For other spot types (DX Cluster, POTA, etc.), use freq or freqMHz as-is
-        freqToSend = spot.freq || spot.freqMHz;
+  const handleSpotClick = useCallback(
+    (spot) => {
+      if (!spot) return;
+
+      // 1. Tune Rig if frequency is available and rig control is enabled
+      if (enabled && (spot.freq || spot.freqMHz || spot.dialFrequency)) {
+        let freqToSend;
+
+        // WSJT-X decodes have dialFrequency (the VFO frequency to tune to)
+        // The freq field is just the audio delta offset within the passband
+        if (spot.dialFrequency) {
+          freqToSend = spot.dialFrequency; // Use dial frequency directly
+        } else {
+          // For other spot types (DX Cluster, POTA, etc.), use freq or freqMHz as-is
+          freqToSend = spot.freq || spot.freqMHz;
+        }
+
+        tuneTo(freqToSend, spot.mode);
       }
 
-      tuneTo(freqToSend, spot.mode);
-    }
-
-    // 2. Set DX Location if location data is available
-    // For DX Cluster spots, we need to find the path data which contains coordinates
-    // For POTA/SOTA, the spot object itself has lat/lon
-    if (spot.lat && spot.lon) {
-      handleDXChange({ lat: spot.lat, lon: spot.lon });
-    } else if (spot.call) {
-      // Try to find in DX Cluster paths
-      const path = (dxClusterData.paths || []).find(p => p.dxCall === spot.call);
-      if (path && path.dxLat != null && path.dxLon != null) {
-        handleDXChange({ lat: path.dxLat, lon: path.dxLon });
+      // 2. Set DX Location if location data is available
+      // For DX Cluster spots, we need to find the path data which contains coordinates
+      // For POTA/SOTA, the spot object itself has lat/lon
+      if (spot.lat && spot.lon) {
+        handleDXChange({ lat: spot.lat, lon: spot.lon });
+      } else if (spot.call) {
+        // Try to find in DX Cluster paths
+        const path = (dxClusterData.paths || []).find((p) => p.dxCall === spot.call);
+        if (path && path.dxLat != null && path.dxLon != null) {
+          handleDXChange({ lat: path.dxLat, lon: path.dxLon });
+        }
       }
-    }
-  }, [tuneTo, enabled, handleDXChange, dxClusterData.paths]);
+    },
+    [tuneTo, enabled, handleDXChange, dxClusterData.paths],
+  );
 
   const resetZoom = useCallback((component) => {
-    setPanelZoom(prev => {
+    setPanelZoom((prev) => {
       const { [component]: _, ...rest } = prev;
       return rest;
     });
@@ -245,7 +252,9 @@ export const DockableApp = ({
     const hasAmbient = (() => {
       try {
         return !!(import.meta.env?.VITE_AMBIENT_API_KEY && import.meta.env?.VITE_AMBIENT_APPLICATION_KEY);
-      } catch { return false; }
+      } catch {
+        return false;
+      }
     })();
 
     return {
@@ -253,25 +262,25 @@ export const DockableApp = ({
       'de-location': { name: 'DE Location', icon: '📍' },
       'dx-location': { name: 'DX Target', icon: '🎯' },
       'analog-clock': { name: 'Analog Clock', icon: '🕐' },
-      'solar': { name: 'Solar (all views)', icon: '☀️' },
+      solar: { name: 'Solar (all views)', icon: '☀️' },
       'solar-image': { name: 'Solar Image', icon: '☀️', group: 'Solar' },
       'solar-indices': { name: 'Solar Indices', icon: '📊', group: 'Solar' },
       'solar-xray': { name: 'X-Ray Flux', icon: '⚡', group: 'Solar' },
-      'lunar': { name: 'Lunar Phase', icon: '🌙', group: 'Solar' },
-      'propagation': { name: 'Propagation (all views)', icon: '📡' },
+      lunar: { name: 'Lunar Phase', icon: '🌙', group: 'Solar' },
+      propagation: { name: 'Propagation (all views)', icon: '📡' },
       'propagation-chart': { name: 'VOACAP Chart', icon: '📈', group: 'Propagation' },
       'propagation-bars': { name: 'VOACAP Bars', icon: '📊', group: 'Propagation' },
       'band-conditions': { name: 'Band Conditions', icon: '📶', group: 'Propagation' },
       'band-health': { name: 'Band Health', icon: '📶' },
       'dx-cluster': { name: 'DX Cluster', icon: '📻' },
       'psk-reporter': { name: 'PSK Reporter', icon: '📡' },
-      'dxpeditions': { name: 'DXpeditions', icon: '🏝️' },
-      'pota': { name: 'POTA', icon: '🏕️' },
-      'wwff': { name: 'WWFF', icon: '🌲' },
-      'sota': { name: 'SOTA', icon: '⛰️' },
-      ...(isLocalInstall ? { 'rotator': { name: 'Rotator', icon: '🧭' } } : {}),
-      'contests': { name: 'Contests', icon: '🏆' },
-      ...(hasAmbient ? { 'ambient': { name: 'Ambient Weather', icon: '🌦️' } } : {}),
+      dxpeditions: { name: 'DXpeditions', icon: '🏝️' },
+      pota: { name: 'POTA', icon: '🏕️' },
+      wwff: { name: 'WWFF', icon: '🌲' },
+      sota: { name: 'SOTA', icon: '⛰️' },
+      ...(isLocalInstall ? { rotator: { name: 'Rotator', icon: '🧭' } } : {}),
+      contests: { name: 'Contests', icon: '🏆' },
+      ...(hasAmbient ? { ambient: { name: 'Ambient Weather', icon: '🌦️' } } : {}),
       'rig-control': { name: 'Rig Control', icon: '📻' },
       'on-air': { name: 'On Air', icon: '🔴' },
       'id-timer': { name: 'ID Timer', icon: '📢' },
@@ -279,22 +288,34 @@ export const DockableApp = ({
   }, [isLocalInstall]);
 
   // Add panel
-  const handleAddPanel = useCallback((panelId) => {
-    if (!targetTabSetId || !panelDefs[panelId]) return;
-    model.doAction(Actions.addNode(
-      { type: 'tab', name: panelDefs[panelId].name, component: panelId, id: `${panelId}-${Date.now()}` },
-      targetTabSetId, DockLocation.CENTER, -1, true
-    ));
-    setShowPanelPicker(false);
-  }, [model, targetTabSetId, panelDefs]);
+  const handleAddPanel = useCallback(
+    (panelId) => {
+      if (!targetTabSetId || !panelDefs[panelId]) return;
+      model.doAction(
+        Actions.addNode(
+          { type: 'tab', name: panelDefs[panelId].name, component: panelId, id: `${panelId}-${Date.now()}` },
+          targetTabSetId,
+          DockLocation.CENTER,
+          -1,
+          true,
+        ),
+      );
+      setShowPanelPicker(false);
+    },
+    [model, targetTabSetId, panelDefs],
+  );
 
   // Render DE Location panel content
   const renderDELocation = (nodeId) => (
     <div style={{ padding: '14px', height: '100%', overflowY: 'auto' }}>
-      <div style={{ fontSize: '14px', color: 'var(--accent-cyan)', fontWeight: '700', marginBottom: '10px' }}>📍 DE - YOUR LOCATION</div>
+      <div style={{ fontSize: '14px', color: 'var(--accent-cyan)', fontWeight: '700', marginBottom: '10px' }}>
+        📍 DE - YOUR LOCATION
+      </div>
       <div style={{ fontFamily: 'JetBrains Mono', fontSize: '14px' }}>
         <div style={{ color: 'var(--accent-amber)', fontSize: '22px', fontWeight: '700' }}>{deGrid}</div>
-        <div style={{ color: 'var(--text-secondary)', fontSize: '13px', marginTop: '4px' }}>{config.location.lat.toFixed(4)}°, {config.location.lon.toFixed(4)}°</div>
+        <div style={{ color: 'var(--text-secondary)', fontSize: '13px', marginTop: '4px' }}>
+          {config.location.lat.toFixed(4)}°, {config.location.lon.toFixed(4)}°
+        </div>
         <div style={{ marginTop: '8px', fontSize: '13px' }}>
           <span style={{ color: 'var(--text-secondary)' }}>☀ </span>
           <span style={{ color: 'var(--accent-amber)', fontWeight: '600' }}>{deSunTimes.sunrise}</span>
@@ -306,7 +327,12 @@ export const DockableApp = ({
       <WeatherPanel
         weatherData={localWeather}
         tempUnit={tempUnit}
-        onTempUnitChange={(unit) => { setTempUnit(unit); try { localStorage.setItem('openhamclock_tempUnit', unit); } catch { } }}
+        onTempUnitChange={(unit) => {
+          setTempUnit(unit);
+          try {
+            localStorage.setItem('openhamclock_tempUnit', unit);
+          } catch {}
+        }}
         nodeId={nodeId}
       />
     </div>
@@ -332,7 +358,7 @@ export const DockableApp = ({
               cursor: 'pointer',
               display: 'flex',
               alignItems: 'center',
-              gap: '3px'
+              gap: '3px',
             }}
           >
             {dxLocked ? '🔒' : '🔓'}
@@ -349,11 +375,17 @@ export const DockableApp = ({
           const sign = utcOffsetH >= 0 ? '+' : '';
           return (
             <div style={{ color: 'var(--accent-cyan)', fontSize: '13px', marginTop: '2px' }}>
-              {hh}:{mm} <span style={{ color: 'var(--text-muted)', fontSize: '11px' }}>(UTC{sign}{utcOffsetH})</span>
+              {hh}:{mm}{' '}
+              <span style={{ color: 'var(--text-muted)', fontSize: '11px' }}>
+                (UTC{sign}
+                {utcOffsetH})
+              </span>
             </div>
           );
         })()}
-        <div style={{ color: 'var(--text-secondary)', fontSize: '13px', marginTop: '4px' }}>{dxLocation.lat.toFixed(4)}°, {dxLocation.lon.toFixed(4)}°</div>
+        <div style={{ color: 'var(--text-secondary)', fontSize: '13px', marginTop: '4px' }}>
+          {dxLocation.lat.toFixed(4)}°, {dxLocation.lon.toFixed(4)}°
+        </div>
         <div style={{ marginTop: '8px', fontSize: '13px' }}>
           <span style={{ color: 'var(--text-secondary)' }}>☀ </span>
           <span style={{ color: 'var(--accent-amber)', fontWeight: '600' }}>{dxSunTimes.sunrise}</span>
@@ -365,7 +397,12 @@ export const DockableApp = ({
         <WeatherPanel
           weatherData={dxWeather}
           tempUnit={tempUnit}
-          onTempUnitChange={(unit) => { setTempUnit(unit); try { localStorage.setItem('openhamclock_tempUnit', unit); } catch { } }}
+          onTempUnitChange={(unit) => {
+            setTempUnit(unit);
+            try {
+              localStorage.setItem('openhamclock_tempUnit', unit);
+            } catch {}
+          }}
           nodeId={nodeId}
         />
       )}
@@ -374,14 +411,14 @@ export const DockableApp = ({
 
   const rot = useRotator({
     mock: false,
-    endpointUrl: isLocalInstall ? "/api/rotator/status" : undefined,
+    endpointUrl: isLocalInstall ? '/api/rotator/status' : undefined,
     pollMs: 2000,
     staleMs: 5000,
   });
   const turnRotator = useCallback(async (azimuth) => {
-    const res = await fetch("/api/rotator/turn", {
-      method: "POST",
-      headers: { "Content-Type": "application/json" },
+    const res = await fetch('/api/rotator/turn', {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json' },
       body: JSON.stringify({ azimuth }),
     });
     const data = await res.json().catch(() => ({}));
@@ -392,7 +429,7 @@ export const DockableApp = ({
   }, []);
 
   const stopRotator = useCallback(async () => {
-    const res = await fetch("/api/rotator/stop", { method: "POST" });
+    const res = await fetch('/api/rotator/stop', { method: 'POST' });
     const data = await res.json().catch(() => ({}));
     if (!res.ok || data?.ok === false) {
       throw new Error(data?.error || `HTTP ${res.status}`);
@@ -408,7 +445,6 @@ export const DockableApp = ({
         dxLocation={dxLocation}
         onDXChange={handleDXChange}
         dxLocked={dxLocked}
-
         potaSpots={potaSpots.data}
         wwffSpots={wwffSpots.data}
         sotaSpots={sotaSpots.data}
@@ -418,27 +454,20 @@ export const DockableApp = ({
         satellites={filteredSatellites}
         pskReporterSpots={filteredPskSpots}
         wsjtxSpots={wsjtxMapSpots}
-
         showDXPaths={mapLayersEff.showDXPaths}
         showDXLabels={mapLayersEff.showDXLabels}
         onToggleDXLabels={mapLayersEff.showDXPaths ? toggleDXLabelsEff : undefined}
-
         showPOTA={mapLayersEff.showPOTA}
         showPOTALabels={mapLayersEff.showPOTALabels}
-
         showWWFF={mapLayersEff.showWWFF}
         showWWFFLabels={mapLayersEff.showWWFFLabels}
-
         showSOTA={mapLayersEff.showSOTA}
         showSOTALabels={mapLayersEff.showSOTALabels}
-
         showSatellites={mapLayersEff.showSatellites}
         onToggleSatellites={toggleSatellitesEff}
-
         showPSKReporter={mapLayersEff.showPSKReporter}
         showWSJTX={mapLayersEff.showWSJTX}
         showDXNews={mapLayersEff.showDXNews}
-
         // ✅ Rotator bearing overlay support
         showRotatorBearing={mapLayersEff.showRotatorBearing}
         rotatorAzimuth={rot.azimuth}
@@ -446,7 +475,6 @@ export const DockableApp = ({
         rotatorIsStale={rot.isStale}
         rotatorControlEnabled={!rot.isStale}
         onRotatorTurnRequest={turnRotator}
-
         hoveredSpot={hoveredSpot}
         leftSidebarVisible={true}
         rightSidebarVisible={true}
@@ -459,301 +487,398 @@ export const DockableApp = ({
     </div>
   );
 
-
   // Factory for rendering panel content
-  const factory = useCallback((node) => {
-    const component = node.getComponent();
-    const nodeId = node.getId();
-
-    let content;
-    switch (component) {
-      case 'world-map':
-        return renderWorldMap(); // Map has its own zoom — skip panel zoom
-
-      case 'de-location':
-        content = renderDELocation(nodeId);
-        break;
-
-      case 'dx-location':
-        content = renderDXLocation(nodeId);
-        break;
-
-      case 'analog-clock':
-        content = <AnalogClockPanel currentTime={currentTime} sunTimes={deSunTimes} />;
-        break;
-
-      case 'solar':
-        content = <SolarPanel solarIndices={solarIndices} />;
-        break;
-
-      case 'solar-image':
-        content = <SolarPanel solarIndices={solarIndices} forcedMode="image" />;
-        break;
-
-      case 'solar-indices':
-        content = <SolarPanel solarIndices={solarIndices} forcedMode="indices" />;
-        break;
-
-      case 'solar-xray':
-        content = <SolarPanel solarIndices={solarIndices} forcedMode="xray" />;
-        break;
-
-      case 'lunar':
-        content = <SolarPanel solarIndices={solarIndices} forcedMode="lunar" />;
-        break;
-
-      case 'propagation':
-        content = <PropagationPanel propagation={propagation.data} loading={propagation.loading} bandConditions={bandConditions} units={config.units} propConfig={config.propagation} />;
-        break;
-
-      case 'propagation-chart':
-        content = <PropagationPanel propagation={propagation.data} loading={propagation.loading} bandConditions={bandConditions} units={config.units} propConfig={config.propagation} forcedMode="chart" />;
-        break;
-
-      case 'propagation-bars':
-        content = <PropagationPanel propagation={propagation.data} loading={propagation.loading} bandConditions={bandConditions} units={config.units} propConfig={config.propagation} forcedMode="bars" />;
-        break;
-
-      case 'band-conditions':
-        content = <PropagationPanel propagation={propagation.data} loading={propagation.loading} bandConditions={bandConditions} units={config.units} propConfig={config.propagation} forcedMode="bands" />;
-        break;
-
-      case 'band-health':
-        return (
-          <BandHealthPanel
-            dxSpots={dxClusterData.spots}
-            clusterFilters={dxFilters}
-          />
-        );
-
-      case 'dx-cluster':
-        content = (
-          <DXClusterPanel
-            data={dxClusterData.spots}
-            loading={dxClusterData.loading}
-            totalSpots={dxClusterData.totalSpots}
-            filters={dxFilters}
-            onFilterChange={setDxFilters}
-            onOpenFilters={() => setShowDXFilters(true)}
-            onHoverSpot={setHoveredSpot}
-            onSpotClick={handleSpotClick}
-            hoveredSpot={hoveredSpot}
-            showOnMap={mapLayersEff.showDXPaths}
-            onToggleMap={toggleDXPathsEff}
-          />
-        );
-        break;
-
-      case 'psk-reporter':
-        content = (
-          <PSKReporterPanel
-            callsign={config.callsign}
-            pskReporter={pskReporter}
-            showOnMap={mapLayersEff.showPSKReporter}
-            onToggleMap={togglePSKReporterEff}
-            filters={pskFilters}
-            onOpenFilters={() => setShowPSKFilters(true)}
-            onSpotClick={handleSpotClick}
-            wsjtxDecodes={wsjtx.decodes}
-            wsjtxClients={wsjtx.clients}
-            wsjtxQsos={wsjtx.qsos}
-            wsjtxStats={wsjtx.stats}
-            wsjtxLoading={wsjtx.loading}
-            wsjtxEnabled={wsjtx.enabled}
-            wsjtxPort={wsjtx.port}
-            wsjtxRelayEnabled={wsjtx.relayEnabled}
-            wsjtxRelayConnected={wsjtx.relayConnected}
-            wsjtxSessionId={wsjtx.sessionId}
-            showWSJTXOnMap={mapLayersEff.showWSJTX}
-            onToggleWSJTXMap={toggleWSJTXEff}
-          />
-        );
-        break;
-
-      case 'dxpeditions':
-        content = <DXpeditionPanel data={dxpeditions.data} loading={dxpeditions.loading} />;
-        break;
-
-      case 'pota':
-        content = (
-          <POTAPanel
-            data={potaSpots.data}
-            loading={potaSpots.loading}
-            lastUpdated={potaSpots.lastUpdated}
-            lastChecked={potaSpots.lastChecked}
-            showOnMap={mapLayersEff.showPOTA}
-            onToggleMap={togglePOTAEff}
-
-            showLabelsOnMap={mapLayersEff.showPOTALabels}
-            onToggleLabelsOnMap={togglePOTALabelsEff}
-            onSpotClick={handleSpotClick}
-          />
-        );
-        break;
-
-      case 'wwff':
-        content = (
-          <WWFFPanel
-            data={wwffSpots.data}
-            loading={wwffSpots.loading}
-            lastUpdated={wwffSpots.lastUpdated}
-            lastChecked={wwffSpots.lastChecked}
-            showOnMap={mapLayersEff.showWWFF}
-            onToggleMap={toggleWWFFEff}
-
-            showLabelsOnMap={mapLayersEff.showWWFFLabels}
-            onToggleLabelsOnMap={toggleWWFFLabelsEff}
-            onSpotClick={handleSpotClick}
-          />
-        );
-        break;
-
-      case 'sota':
-        content = (
-          <SOTAPanel
-            data={sotaSpots.data}
-            loading={sotaSpots.loading}
-            lastUpdated={sotaSpots.lastUpdated}
-            lastChecked={sotaSpots.lastChecked}
-            showOnMap={mapLayersEff.showSOTA}
-            onToggleMap={toggleSOTAEff}
-
-            showLabelsOnMap={mapLayersEff.showSOTALabels}
-            onToggleLabelsOnMap={toggleSOTALabelsEff}
-            onSpotClick={handleSpotClick}
+  const factory = useCallback(
+    (node) => {
+      const component = node.getComponent();
+      const nodeId = node.getId();
+
+      let content;
+      switch (component) {
+        case 'world-map':
+          return renderWorldMap(); // Map has its own zoom — skip panel zoom
+
+        case 'de-location':
+          content = renderDELocation(nodeId);
+          break;
+
+        case 'dx-location':
+          content = renderDXLocation(nodeId);
+          break;
+
+        case 'analog-clock':
+          content = <AnalogClockPanel currentTime={currentTime} sunTimes={deSunTimes} />;
+          break;
+
+        case 'solar':
+          content = <SolarPanel solarIndices={solarIndices} />;
+          break;
+
+        case 'solar-image':
+          content = <SolarPanel solarIndices={solarIndices} forcedMode="image" />;
+          break;
+
+        case 'solar-indices':
+          content = <SolarPanel solarIndices={solarIndices} forcedMode="indices" />;
+          break;
+
+        case 'solar-xray':
+          content = <SolarPanel solarIndices={solarIndices} forcedMode="xray" />;
+          break;
+
+        case 'lunar':
+          content = <SolarPanel solarIndices={solarIndices} forcedMode="lunar" />;
+          break;
+
+        case 'propagation':
+          content = (
+            <PropagationPanel
+              propagation={propagation.data}
+              loading={propagation.loading}
+              bandConditions={bandConditions}
+              units={config.units}
+              propConfig={config.propagation}
             />
-        );
-        break;
-
-      case 'contests':
-        content = <ContestPanel data={contests.data} loading={contests.loading} />;
-        break;
-
-      case "rotator":
-        return (
-          <RotatorPanel
-            state={rot}
-            overlayEnabled={mapLayersEff.showRotatorBearing}
-            onToggleOverlay={toggleRotatorBearingEff}
-
-            onTurnAzimuth={turnRotator}
-            onStop={stopRotator}
-            controlsEnabled={!rot.isStale}
-          />
-        );
+          );
+          break;
+
+        case 'propagation-chart':
+          content = (
+            <PropagationPanel
+              propagation={propagation.data}
+              loading={propagation.loading}
+              bandConditions={bandConditions}
+              units={config.units}
+              propConfig={config.propagation}
+              forcedMode="chart"
+            />
+          );
+          break;
+
+        case 'propagation-bars':
+          content = (
+            <PropagationPanel
+              propagation={propagation.data}
+              loading={propagation.loading}
+              bandConditions={bandConditions}
+              units={config.units}
+              propConfig={config.propagation}
+              forcedMode="bars"
+            />
+          );
+          break;
+
+        case 'band-conditions':
+          content = (
+            <PropagationPanel
+              propagation={propagation.data}
+              loading={propagation.loading}
+              bandConditions={bandConditions}
+              units={config.units}
+              propConfig={config.propagation}
+              forcedMode="bands"
+            />
+          );
+          break;
+
+        case 'band-health':
+          return <BandHealthPanel dxSpots={dxClusterData.spots} clusterFilters={dxFilters} />;
+
+        case 'dx-cluster':
+          content = (
+            <DXClusterPanel
+              data={dxClusterData.spots}
+              loading={dxClusterData.loading}
+              totalSpots={dxClusterData.totalSpots}
+              filters={dxFilters}
+              onFilterChange={setDxFilters}
+              onOpenFilters={() => setShowDXFilters(true)}
+              onHoverSpot={setHoveredSpot}
+              onSpotClick={handleSpotClick}
+              hoveredSpot={hoveredSpot}
+              showOnMap={mapLayersEff.showDXPaths}
+              onToggleMap={toggleDXPathsEff}
+            />
+          );
+          break;
+
+        case 'psk-reporter':
+          content = (
+            <PSKReporterPanel
+              callsign={config.callsign}
+              pskReporter={pskReporter}
+              showOnMap={mapLayersEff.showPSKReporter}
+              onToggleMap={togglePSKReporterEff}
+              filters={pskFilters}
+              onOpenFilters={() => setShowPSKFilters(true)}
+              onSpotClick={handleSpotClick}
+              wsjtxDecodes={wsjtx.decodes}
+              wsjtxClients={wsjtx.clients}
+              wsjtxQsos={wsjtx.qsos}
+              wsjtxStats={wsjtx.stats}
+              wsjtxLoading={wsjtx.loading}
+              wsjtxEnabled={wsjtx.enabled}
+              wsjtxPort={wsjtx.port}
+              wsjtxRelayEnabled={wsjtx.relayEnabled}
+              wsjtxRelayConnected={wsjtx.relayConnected}
+              wsjtxSessionId={wsjtx.sessionId}
+              showWSJTXOnMap={mapLayersEff.showWSJTX}
+              onToggleWSJTXMap={toggleWSJTXEff}
+            />
+          );
+          break;
+
+        case 'dxpeditions':
+          content = <DXpeditionPanel data={dxpeditions.data} loading={dxpeditions.loading} />;
+          break;
+
+        case 'pota':
+          content = (
+            <POTAPanel
+              data={potaSpots.data}
+              loading={potaSpots.loading}
+              lastUpdated={potaSpots.lastUpdated}
+              lastChecked={potaSpots.lastChecked}
+              showOnMap={mapLayersEff.showPOTA}
+              onToggleMap={togglePOTAEff}
+              showLabelsOnMap={mapLayersEff.showPOTALabels}
+              onToggleLabelsOnMap={togglePOTALabelsEff}
+              onSpotClick={handleSpotClick}
+            />
+          );
+          break;
+
+        case 'wwff':
+          content = (
+            <WWFFPanel
+              data={wwffSpots.data}
+              loading={wwffSpots.loading}
+              lastUpdated={wwffSpots.lastUpdated}
+              lastChecked={wwffSpots.lastChecked}
+              showOnMap={mapLayersEff.showWWFF}
+              onToggleMap={toggleWWFFEff}
+              showLabelsOnMap={mapLayersEff.showWWFFLabels}
+              onToggleLabelsOnMap={toggleWWFFLabelsEff}
+              onSpotClick={handleSpotClick}
+            />
+          );
+          break;
+
+        case 'sota':
+          content = (
+            <SOTAPanel
+              data={sotaSpots.data}
+              loading={sotaSpots.loading}
+              lastUpdated={sotaSpots.lastUpdated}
+              lastChecked={sotaSpots.lastChecked}
+              showOnMap={mapLayersEff.showSOTA}
+              onToggleMap={toggleSOTAEff}
+              showLabelsOnMap={mapLayersEff.showSOTALabels}
+              onToggleLabelsOnMap={toggleSOTALabelsEff}
+              onSpotClick={handleSpotClick}
+            />
+          );
+          break;
 
+        case 'contests':
+          content = <ContestPanel data={contests.data} loading={contests.loading} />;
+          break;
 
-      case 'ambient':
-        content = (
-          <AmbientPanel
-            tempUnit={tempUnit}
-            onTempUnitChange={(unit) => {
-              setTempUnit(unit);
-              try { localStorage.setItem('openhamclock_tempUnit', unit); } catch { }
-            }}
-          />
-        );
-        break;
+        case 'rotator':
+          return (
+            <RotatorPanel
+              state={rot}
+              overlayEnabled={mapLayersEff.showRotatorBearing}
+              onToggleOverlay={toggleRotatorBearingEff}
+              onTurnAzimuth={turnRotator}
+              onStop={stopRotator}
+              controlsEnabled={!rot.isStale}
+            />
+          );
 
-      case 'rig-control':
-        content = <RigControlPanel />;
-        break;
+        case 'ambient':
+          content = (
+            <AmbientPanel
+              tempUnit={tempUnit}
+              onTempUnitChange={(unit) => {
+                setTempUnit(unit);
+                try {
+                  localStorage.setItem('openhamclock_tempUnit', unit);
+                } catch {}
+              }}
+            />
+          );
+          break;
 
-      case 'on-air':
-        content = <OnAirPanel />;
-        break;
+        case 'rig-control':
+          content = <RigControlPanel />;
+          break;
 
-      case 'id-timer':
-        content = <IDTimerPanel callsign={config.callsign} />;
-        break;
+        case 'on-air':
+          content = <OnAirPanel />;
+          break;
 
-      default:
-        content = (
-          <div style={{ padding: '20px', color: '#ff6b6b', textAlign: 'center' }}>
-            <div style={{ fontSize: '14px', marginBottom: '8px' }}>Outdated panel: {component}</div>
-            <div style={{ fontSize: '12px', color: '#888' }}>Click "Reset" button below to update layout</div>
-          </div>
-        );
-    }
+        case 'id-timer':
+          content = <IDTimerPanel callsign={config.callsign} />;
+          break;
 
-    // Apply per-panel zoom
-    const zoom = panelZoom[component] || 1.0;
-    if (zoom !== 1.0) {
-      return (
-        <div style={{ zoom, width: '100%', height: '100%', transformOrigin: 'top left' }}>
-          {content}
-        </div>
-      );
-    }
-    return content;
-  }, [
-    config, deGrid, dxGrid, dxLocation, deSunTimes, dxSunTimes, showDxWeather, tempUnit, localWeather, dxWeather, solarIndices,
-    propagation, bandConditions, dxClusterData, dxFilters, hoveredSpot, mapLayers, potaSpots, wwffSpots, sotaSpots,
-    mySpots, satellites, filteredSatellites, filteredPskSpots, wsjtxMapSpots, dxpeditions, contests,
-    pskFilters, wsjtx, handleDXChange, setDxFilters, setShowDXFilters, setShowPSKFilters,
-    setHoveredSpot, toggleDXPaths, toggleDXLabels, togglePOTA, toggleWWFF, toggleSOTA, toggleSatellites, togglePSKReporter, toggleWSJTX,
-    dxLocked, handleToggleDxLock, panelZoom
-  ]);
+        default:
+          content = (
+            <div style={{ padding: '20px', color: '#ff6b6b', textAlign: 'center' }}>
+              <div style={{ fontSize: '14px', marginBottom: '8px' }}>Outdated panel: {component}</div>
+              <div style={{ fontSize: '12px', color: '#888' }}>Click "Reset" button below to update layout</div>
+            </div>
+          );
+      }
+
+      // Apply per-panel zoom
+      const zoom = panelZoom[component] || 1.0;
+      if (zoom !== 1.0) {
+        return <div style={{ zoom, width: '100%', height: '100%', transformOrigin: 'top left' }}>{content}</div>;
+      }
+      return content;
+    },
+    [
+      config,
+      deGrid,
+      dxGrid,
+      dxLocation,
+      deSunTimes,
+      dxSunTimes,
+      showDxWeather,
+      tempUnit,
+      localWeather,
+      dxWeather,
+      solarIndices,
+      propagation,
+      bandConditions,
+      dxClusterData,
+      dxFilters,
+      hoveredSpot,
+      mapLayers,
+      potaSpots,
+      wwffSpots,
+      sotaSpots,
+      mySpots,
+      satellites,
+      filteredSatellites,
+      filteredPskSpots,
+      wsjtxMapSpots,
+      dxpeditions,
+      contests,
+      pskFilters,
+      wsjtx,
+      handleDXChange,
+      setDxFilters,
+      setShowDXFilters,
+      setShowPSKFilters,
+      setHoveredSpot,
+      toggleDXPaths,
+      toggleDXLabels,
+      togglePOTA,
+      toggleWWFF,
+      toggleSOTA,
+      toggleSatellites,
+      togglePSKReporter,
+      toggleWSJTX,
+      dxLocked,
+      handleToggleDxLock,
+      panelZoom,
+    ],
+  );
 
   // Add + and font size buttons to tabsets
-  const onRenderTabSet = useCallback((node, renderValues) => {
-    // Get the active tab's component name for zoom controls
-    const selectedNode = node.getSelectedNode?.();
-    const selectedComponent = selectedNode?.getComponent?.();
+  const onRenderTabSet = useCallback(
+    (node, renderValues) => {
+      // Get the active tab's component name for zoom controls
+      const selectedNode = node.getSelectedNode?.();
+      const selectedComponent = selectedNode?.getComponent?.();
 
-    // Skip zoom controls for world-map
-    if (selectedComponent && selectedComponent !== 'world-map') {
-      const currentZoom = panelZoom[selectedComponent] || 1.0;
-      const zoomPct = Math.round(currentZoom * 100);
+      // Skip zoom controls for world-map
+      if (selectedComponent && selectedComponent !== 'world-map') {
+        const currentZoom = panelZoom[selectedComponent] || 1.0;
+        const zoomPct = Math.round(currentZoom * 100);
 
-      renderValues.stickyButtons.push(
-        <button
-          key="zoom-out"
-          title="Decrease font size"
-          className="flexlayout__tab_toolbar_button"
-          onClick={(e) => { e.stopPropagation(); adjustZoom(selectedComponent, -1); }}
-          style={{ fontSize: '11px', fontWeight: '700', fontFamily: 'JetBrains Mono, monospace', padding: '0 3px', opacity: currentZoom <= 0.7 ? 0.3 : 1 }}
-        >
-          A−
-        </button>
-      );
-      if (currentZoom !== 1.0) {
         renderValues.stickyButtons.push(
           <button
-            key="zoom-reset"
-            title="Reset font size"
+            key="zoom-out"
+            title="Decrease font size"
+            className="flexlayout__tab_toolbar_button"
+            onClick={(e) => {
+              e.stopPropagation();
+              adjustZoom(selectedComponent, -1);
+            }}
+            style={{
+              fontSize: '11px',
+              fontWeight: '700',
+              fontFamily: 'JetBrains Mono, monospace',
+              padding: '0 3px',
+              opacity: currentZoom <= 0.7 ? 0.3 : 1,
+            }}
+          >
+            A−
+          </button>,
+        );
+        if (currentZoom !== 1.0) {
+          renderValues.stickyButtons.push(
+            <button
+              key="zoom-reset"
+              title="Reset font size"
+              className="flexlayout__tab_toolbar_button"
+              onClick={(e) => {
+                e.stopPropagation();
+                resetZoom(selectedComponent);
+              }}
+              style={{
+                fontSize: '9px',
+                fontFamily: 'JetBrains Mono, monospace',
+                padding: '0 2px',
+                color: 'var(--accent-amber)',
+              }}
+            >
+              {zoomPct}%
+            </button>,
+          );
+        }
+        renderValues.stickyButtons.push(
+          <button
+            key="zoom-in"
+            title="Increase font size"
             className="flexlayout__tab_toolbar_button"
-            onClick={(e) => { e.stopPropagation(); resetZoom(selectedComponent); }}
-            style={{ fontSize: '9px', fontFamily: 'JetBrains Mono, monospace', padding: '0 2px', color: 'var(--accent-amber)' }}
+            onClick={(e) => {
+              e.stopPropagation();
+              adjustZoom(selectedComponent, 1);
+            }}
+            style={{
+              fontSize: '11px',
+              fontWeight: '700',
+              fontFamily: 'JetBrains Mono, monospace',
+              padding: '0 3px',
+              opacity: currentZoom >= 2.0 ? 0.3 : 1,
+            }}
           >
-            {zoomPct}%
-          </button>
+            A+
+          </button>,
         );
       }
+
       renderValues.stickyButtons.push(
         <button
-          key="zoom-in"
-          title="Increase font size"
+          key="add"
+          title="Add panel"
           className="flexlayout__tab_toolbar_button"
-          onClick={(e) => { e.stopPropagation(); adjustZoom(selectedComponent, 1); }}
-          style={{ fontSize: '11px', fontWeight: '700', fontFamily: 'JetBrains Mono, monospace', padding: '0 3px', opacity: currentZoom >= 2.0 ? 0.3 : 1 }}
+          onClick={(e) => {
+            e.stopPropagation();
+            setTargetTabSetId(node.getId());
+            setShowPanelPicker(true);
+          }}
         >
-          A+
-        </button>
+          <PlusIcon />
+        </button>,
       );
-    }
-
-    renderValues.stickyButtons.push(
-      <button
-        key="add"
-        title="Add panel"
-        className="flexlayout__tab_toolbar_button"
-        onClick={(e) => { e.stopPropagation(); setTargetTabSetId(node.getId()); setShowPanelPicker(true); }}
-      >
-        <PlusIcon />
-      </button>
-    );
-  }, [panelZoom, adjustZoom, resetZoom]);
+    },
+    [panelZoom, adjustZoom, resetZoom],
+  );
 
   // Get unused panels
   const getAvailablePanels = useCallback(() => {
@@ -763,11 +888,21 @@ export const DockableApp = ({
       (n.getChildren?.() || []).forEach(walk);
     };
     walk(model.getRoot());
-    return Object.entries(panelDefs).filter(([id]) => !used.has(id)).map(([id, def]) => ({ id, ...def }));
+    return Object.entries(panelDefs)
+      .filter(([id]) => !used.has(id))
+      .map(([id, def]) => ({ id, ...def }));
   }, [model, panelDefs]);
 
   return (
-    <div style={{ display: 'flex', flexDirection: 'column', height: '100vh', width: '100vw', background: 'var(--bg-primary)' }}>
+    <div
+      style={{
+        display: 'flex',
+        flexDirection: 'column',
+        height: '100vh',
+        width: '100vw',
+        background: 'var(--bg-primary)',
+      }}
+    >
       {/* Header */}
       <div style={{ flexShrink: 0, padding: '8px 8px 0 8px' }}>
         <Header
@@ -807,58 +942,106 @@ export const DockableApp = ({
       {/* Panel picker modal */}
       {showPanelPicker && (
         <div
-          style={{ position: 'fixed', inset: 0, background: 'rgba(0,0,0,0.7)', display: 'flex', alignItems: 'center', justifyContent: 'center', zIndex: 10000 }}
+          style={{
+            position: 'fixed',
+            inset: 0,
+            background: 'rgba(0,0,0,0.7)',
+            display: 'flex',
+            alignItems: 'center',
+            justifyContent: 'center',
+            zIndex: 10000,
+          }}
           onClick={() => setShowPanelPicker(false)}
         >
           <div
-            style={{ background: 'rgba(26,32,44,0.98)', border: '1px solid #2d3748', borderRadius: '12px', padding: '20px', minWidth: '350px' }}
-            onClick={e => e.stopPropagation()}
+            style={{
+              background: 'rgba(26,32,44,0.98)',
+              border: '1px solid #2d3748',
+              borderRadius: '12px',
+              padding: '20px',
+              minWidth: '350px',
+            }}
+            onClick={(e) => e.stopPropagation()}
           >
-            <h3 style={{ margin: '0 0 16px', color: '#00ffcc', fontFamily: 'JetBrains Mono', fontSize: '14px' }}>Add Panel</h3>
+            <h3 style={{ margin: '0 0 16px', color: '#00ffcc', fontFamily: 'JetBrains Mono', fontSize: '14px' }}>
+              Add Panel
+            </h3>
             <div style={{ display: 'grid', gridTemplateColumns: '1fr 1fr', gap: '8px' }}>
               {(() => {
                 const panels = getAvailablePanels();
-                const ungrouped = panels.filter(p => !p.group);
+                const ungrouped = panels.filter((p) => !p.group);
                 const groups = {};
-                panels.filter(p => p.group).forEach(p => {
-                  if (!groups[p.group]) groups[p.group] = [];
-                  groups[p.group].push(p);
-                });
+                panels
+                  .filter((p) => p.group)
+                  .forEach((p) => {
+                    if (!groups[p.group]) groups[p.group] = [];
+                    groups[p.group].push(p);
+                  });
                 return (
                   <>
-                    {ungrouped.map(p => (
+                    {ungrouped.map((p) => (
                       <button
                         key={p.id}
                         onClick={() => handleAddPanel(p.id)}
                         style={{
-                          background: 'rgba(0,0,0,0.3)', border: '1px solid #2d3748', borderRadius: '6px',
-                          padding: '10px', cursor: 'pointer', textAlign: 'left'
+                          background: 'rgba(0,0,0,0.3)',
+                          border: '1px solid #2d3748',
+                          borderRadius: '6px',
+                          padding: '10px',
+                          cursor: 'pointer',
+                          textAlign: 'left',
+                        }}
+                        onMouseEnter={(e) => {
+                          e.currentTarget.style.borderColor = '#00ffcc';
+                        }}
+                        onMouseLeave={(e) => {
+                          e.currentTarget.style.borderColor = '#2d3748';
                         }}
-                        onMouseEnter={e => { e.currentTarget.style.borderColor = '#00ffcc'; }}
-                        onMouseLeave={e => { e.currentTarget.style.borderColor = '#2d3748'; }}
                       >
                         <span style={{ fontSize: '16px', marginRight: '8px' }}>{p.icon}</span>
-                        <span style={{ color: '#e2e8f0', fontFamily: 'JetBrains Mono', fontSize: '12px' }}>{p.name}</span>
+                        <span style={{ color: '#e2e8f0', fontFamily: 'JetBrains Mono', fontSize: '12px' }}>
+                          {p.name}
+                        </span>
                       </button>
                     ))}
                     {Object.entries(groups).map(([group, items]) => (
                       <React.Fragment key={group}>
-                        <div style={{ gridColumn: '1 / -1', fontSize: '10px', color: '#718096', fontFamily: 'JetBrains Mono', marginTop: '6px', borderTop: '1px solid #2d3748', paddingTop: '8px' }}>
+                        <div
+                          style={{
+                            gridColumn: '1 / -1',
+                            fontSize: '10px',
+                            color: '#718096',
+                            fontFamily: 'JetBrains Mono',
+                            marginTop: '6px',
+                            borderTop: '1px solid #2d3748',
+                            paddingTop: '8px',
+                          }}
+                        >
                           {group} Sub-panels
                         </div>
-                        {items.map(p => (
+                        {items.map((p) => (
                           <button
                             key={p.id}
                             onClick={() => handleAddPanel(p.id)}
                             style={{
-                              background: 'rgba(0,0,0,0.2)', border: '1px solid #2d3748', borderRadius: '6px',
-                              padding: '8px 10px', cursor: 'pointer', textAlign: 'left'
+                              background: 'rgba(0,0,0,0.2)',
+                              border: '1px solid #2d3748',
+                              borderRadius: '6px',
+                              padding: '8px 10px',
+                              cursor: 'pointer',
+                              textAlign: 'left',
+                            }}
+                            onMouseEnter={(e) => {
+                              e.currentTarget.style.borderColor = '#00ffcc';
+                            }}
+                            onMouseLeave={(e) => {
+                              e.currentTarget.style.borderColor = '#2d3748';
                             }}
-                            onMouseEnter={e => { e.currentTarget.style.borderColor = '#00ffcc'; }}
-                            onMouseLeave={e => { e.currentTarget.style.borderColor = '#2d3748'; }}
                           >
                             <span style={{ fontSize: '14px', marginRight: '6px' }}>{p.icon}</span>
-                            <span style={{ color: '#cbd5e0', fontFamily: 'JetBrains Mono', fontSize: '11px' }}>{p.name}</span>
+                            <span style={{ color: '#cbd5e0', fontFamily: 'JetBrains Mono', fontSize: '11px' }}>
+                              {p.name}
+                            </span>
                           </button>
                         ))}
                       </React.Fragment>
@@ -872,7 +1055,16 @@ export const DockableApp = ({
             )}
             <button
               onClick={() => setShowPanelPicker(false)}
-              style={{ width: '100%', marginTop: '12px', background: 'transparent', border: '1px solid #2d3748', borderRadius: '6px', padding: '8px', color: '#a0aec0', cursor: 'pointer' }}
+              style={{
+                width: '100%',
+                marginTop: '12px',
+                background: 'transparent',
+                border: '1px solid #2d3748',
+                borderRadius: '6px',
+                padding: '8px',
+                color: '#a0aec0',
+                cursor: 'pointer',
+              }}
             >
               Cancel
             </button>
@@ -881,5 +1073,5 @@ export const DockableApp = ({
       )}
     </div>
   );
-}
-export default DockableApp;
\ No newline at end of file
+};
+export default DockableApp;
diff --git a/src/components/AmbientPanel.jsx b/src/components/AmbientPanel.jsx
index 14e4ad5c..0f189297 100644
--- a/src/components/AmbientPanel.jsx
+++ b/src/components/AmbientPanel.jsx
@@ -1,14 +1,14 @@
-import React, { useEffect, useMemo, useState } from "react";
-import { useAmbientWeather } from "../hooks/useAmbientWeather.js";
+import React, { useEffect, useMemo, useState } from 'react';
+import { useAmbientWeather } from '../hooks/useAmbientWeather.js';
 
 const row = (label, value) => (
-  <div style={{ display: "flex", justifyContent: "space-between", gap: 10, margin: "2px 0" }}>
-    <span style={{ color: "var(--text-muted)" }}>{label}</span>
-    <span style={{ color: "var(--text-primary)", fontWeight: 600 }}>{value}</span>
+  <div style={{ display: 'flex', justifyContent: 'space-between', gap: 10, margin: '2px 0' }}>
+    <span style={{ color: 'var(--text-muted)' }}>{label}</span>
+    <span style={{ color: 'var(--text-primary)', fontWeight: 600 }}>{value}</span>
   </div>
 );
 
-const STORAGE_KEY = "openhamclock_ambientPanel";
+const STORAGE_KEY = 'openhamclock_ambientPanel';
 
 const DEFAULT_SHOW = {
   // Outside
@@ -54,12 +54,12 @@ const DEFAULT_SHOW = {
 
 function safeLocalTimeString(v) {
   try {
-    if (v == null || v === "") return "";
+    if (v == null || v === '') return '';
     const d = new Date(v);
-    if (Number.isNaN(d.getTime())) return "";
+    if (Number.isNaN(d.getTime())) return '';
     return d.toLocaleString();
   } catch {
-    return "";
+    return '';
   }
 }
 
@@ -81,21 +81,18 @@ function loadPanelPrefs() {
 
 function savePanelPrefs(prefs) {
   try {
-    localStorage.setItem(
-      STORAGE_KEY,
-      JSON.stringify({ autoHideMissing: prefs.autoHideMissing, show: prefs.show })
-    );
+    localStorage.setItem(STORAGE_KEY, JSON.stringify({ autoHideMissing: prefs.autoHideMissing, show: prefs.show }));
   } catch {
     // ignore
   }
 }
 
 function fmtBoolOk(v) {
-  if (v == null) return "--";
-  return v ? "OK" : "LOW";
+  if (v == null) return '--';
+  return v ? 'OK' : 'LOW';
 }
 
-export default function AmbientPanel({ tempUnit = "F" }) {
+export default function AmbientPanel({ tempUnit = 'F' }) {
   // ✅ Hooks must always run in the same order
   const ambient = useAmbientWeather(tempUnit);
   const w = ambient.data;
@@ -107,10 +104,10 @@ export default function AmbientPanel({ tempUnit = "F" }) {
   }, [prefs]);
 
   // ✅ Derive units safely even when w is null
-  const deg = `°${(w?.tempUnit || tempUnit)}`;
-  const windUnit = w?.windUnit || "mph";
-  const rainUnit = w?.rainUnit || "in";
-  const pressureUnit = w?.pressureUnit || "inHg";
+  const deg = `°${w?.tempUnit || tempUnit}`;
+  const windUnit = w?.windUnit || 'mph';
+  const rainUnit = w?.rainUnit || 'in';
+  const pressureUnit = w?.pressureUnit || 'inHg';
 
   // ✅ useMemo MUST run on every render (return [] when no data)
   const rows = useMemo(() => {
@@ -118,45 +115,81 @@ export default function AmbientPanel({ tempUnit = "F" }) {
 
     return [
       // Outside
-      { key: "temp", label: "Temp", value: w.temp, fmt: (v) => `${v}${deg}`, group: "outside" },
-      { key: "feelsLike", label: "Feels", value: w.feelsLike, fmt: (v) => `${v}${deg}`, group: "outside" },
-      { key: "humidity", label: "Humidity", value: w.humidity, fmt: (v) => `${v}%`, group: "outside" },
-      { key: "dewPoint", label: "Dew Pt", value: w.dewPoint, fmt: (v) => `${v}${deg}`, group: "outside" },
+      { key: 'temp', label: 'Temp', value: w.temp, fmt: (v) => `${v}${deg}`, group: 'outside' },
+      { key: 'feelsLike', label: 'Feels', value: w.feelsLike, fmt: (v) => `${v}${deg}`, group: 'outside' },
+      { key: 'humidity', label: 'Humidity', value: w.humidity, fmt: (v) => `${v}%`, group: 'outside' },
+      { key: 'dewPoint', label: 'Dew Pt', value: w.dewPoint, fmt: (v) => `${v}${deg}`, group: 'outside' },
 
       // Pressure
-      { key: "pressureRel", label: "Pressure (Rel)", value: w.pressureRel, fmt: (v) => `${v} ${pressureUnit}`, group: "outside" },
-      { key: "pressureAbs", label: "Pressure (Abs)", value: w.pressureAbs, fmt: (v) => `${v} ${pressureUnit}`, group: "outside" },
+      {
+        key: 'pressureRel',
+        label: 'Pressure (Rel)',
+        value: w.pressureRel,
+        fmt: (v) => `${v} ${pressureUnit}`,
+        group: 'outside',
+      },
+      {
+        key: 'pressureAbs',
+        label: 'Pressure (Abs)',
+        value: w.pressureAbs,
+        fmt: (v) => `${v} ${pressureUnit}`,
+        group: 'outside',
+      },
 
       // Wind
-      { key: "windSpeed", label: "Wind", value: w.windSpeed, fmt: (v) => `${v} ${windUnit}`, group: "wind" },
+      { key: 'windSpeed', label: 'Wind', value: w.windSpeed, fmt: (v) => `${v} ${windUnit}`, group: 'wind' },
       // NOTE: windDir is a compass string (E, ESE, etc.) — no degree symbol
-      { key: "windDir", label: "Direction", value: w.windDir, fmt: (v) => `${v}`, group: "wind" },
-      { key: "windDirDeg", label: "Dir (deg)", value: w.windDirDeg, fmt: (v) => `${v}°`, group: "wind" },
-      { key: "windGust", label: "Gust", value: w.windGust, fmt: (v) => `${v} ${windUnit}`, group: "wind" },
-      { key: "maxDailyGust", label: "Max Gust", value: w.maxDailyGust, fmt: (v) => `${v} ${windUnit}`, group: "wind" },
+      { key: 'windDir', label: 'Direction', value: w.windDir, fmt: (v) => `${v}`, group: 'wind' },
+      { key: 'windDirDeg', label: 'Dir (deg)', value: w.windDirDeg, fmt: (v) => `${v}°`, group: 'wind' },
+      { key: 'windGust', label: 'Gust', value: w.windGust, fmt: (v) => `${v} ${windUnit}`, group: 'wind' },
+      { key: 'maxDailyGust', label: 'Max Gust', value: w.maxDailyGust, fmt: (v) => `${v} ${windUnit}`, group: 'wind' },
 
       // Rain
-      { key: "rainDaily", label: "Rain Today", value: w.rainDaily, fmt: (v) => `${v} ${rainUnit}`, group: "rain" },
-      { key: "rainRate", label: "Rain Rate", value: w.rainRate, fmt: (v) => `${v} ${rainUnit}`, group: "rain" },
-      { key: "rainHourly", label: "Rain Hourly", value: w.rainHourly, fmt: (v) => `${v} ${rainUnit}`, group: "rain" },
-      { key: "rainWeekly", label: "Rain Weekly", value: w.rainWeekly, fmt: (v) => `${v} ${rainUnit}`, group: "rain" },
-      { key: "rainMonthly", label: "Rain Monthly", value: w.rainMonthly, fmt: (v) => `${v} ${rainUnit}`, group: "rain" },
-      { key: "rainYearly", label: "Rain Yearly", value: w.rainYearly, fmt: (v) => `${v} ${rainUnit}`, group: "rain" },
+      { key: 'rainDaily', label: 'Rain Today', value: w.rainDaily, fmt: (v) => `${v} ${rainUnit}`, group: 'rain' },
+      { key: 'rainRate', label: 'Rain Rate', value: w.rainRate, fmt: (v) => `${v} ${rainUnit}`, group: 'rain' },
+      { key: 'rainHourly', label: 'Rain Hourly', value: w.rainHourly, fmt: (v) => `${v} ${rainUnit}`, group: 'rain' },
+      { key: 'rainWeekly', label: 'Rain Weekly', value: w.rainWeekly, fmt: (v) => `${v} ${rainUnit}`, group: 'rain' },
+      {
+        key: 'rainMonthly',
+        label: 'Rain Monthly',
+        value: w.rainMonthly,
+        fmt: (v) => `${v} ${rainUnit}`,
+        group: 'rain',
+      },
+      { key: 'rainYearly', label: 'Rain Yearly', value: w.rainYearly, fmt: (v) => `${v} ${rainUnit}`, group: 'rain' },
 
       // Indoor
-      { key: "indoorTemp", label: "Indoor Temp", value: w.indoorTemp, fmt: (v) => `${v}${deg}`, group: "indoor" },
-      { key: "indoorHumidity", label: "Indoor Humidity", value: w.indoorHumidity, fmt: (v) => `${v}%`, group: "indoor" },
-      { key: "indoorFeelsLike", label: "Indoor Feels", value: w.indoorFeelsLike, fmt: (v) => `${v}${deg}`, group: "indoor" },
-      { key: "indoorDewPoint", label: "Indoor Dew Pt", value: w.indoorDewPoint, fmt: (v) => `${v}${deg}`, group: "indoor" },
+      { key: 'indoorTemp', label: 'Indoor Temp', value: w.indoorTemp, fmt: (v) => `${v}${deg}`, group: 'indoor' },
+      {
+        key: 'indoorHumidity',
+        label: 'Indoor Humidity',
+        value: w.indoorHumidity,
+        fmt: (v) => `${v}%`,
+        group: 'indoor',
+      },
+      {
+        key: 'indoorFeelsLike',
+        label: 'Indoor Feels',
+        value: w.indoorFeelsLike,
+        fmt: (v) => `${v}${deg}`,
+        group: 'indoor',
+      },
+      {
+        key: 'indoorDewPoint',
+        label: 'Indoor Dew Pt',
+        value: w.indoorDewPoint,
+        fmt: (v) => `${v}${deg}`,
+        group: 'indoor',
+      },
 
       // Extras
-      { key: "uv", label: "UV", value: w.uv, fmt: (v) => `${v}`, group: "extras" },
-      { key: "solar", label: "Solar", value: w.solar, fmt: (v) => `${v}`, group: "extras" },
+      { key: 'uv', label: 'UV', value: w.uv, fmt: (v) => `${v}`, group: 'extras' },
+      { key: 'solar', label: 'Solar', value: w.solar, fmt: (v) => `${v}`, group: 'extras' },
 
       // Battery
-      { key: "battOutOk", label: "Batt Out", value: w.battOutOk, fmt: fmtBoolOk, group: "battery" },
-      { key: "battInOk", label: "Batt In", value: w.battInOk, fmt: fmtBoolOk, group: "battery" },
-      { key: "battRainOk", label: "Batt Rain", value: w.battRainOk, fmt: fmtBoolOk, group: "battery" },
+      { key: 'battOutOk', label: 'Batt Out', value: w.battOutOk, fmt: fmtBoolOk, group: 'battery' },
+      { key: 'battInOk', label: 'Batt In', value: w.battInOk, fmt: fmtBoolOk, group: 'battery' },
+      { key: 'battRainOk', label: 'Batt Rain', value: w.battRainOk, fmt: fmtBoolOk, group: 'battery' },
     ];
   }, [w, deg, windUnit, rainUnit, pressureUnit]);
 
@@ -165,21 +198,19 @@ export default function AmbientPanel({ tempUnit = "F" }) {
 
   // Render helper (not a hook; safe anywhere)
   const Code = ({ children }) => (
-    <code style={{ background: "var(--bg-tertiary)", padding: "2px 4px", borderRadius: 3 }}>
-      {children}
-    </code>
+    <code style={{ background: 'var(--bg-tertiary)', padding: '2px 4px', borderRadius: 3 }}>{children}</code>
   );
 
   // ✅ Now it’s safe to early-return after hooks
-  if (hasError && ambient.error?.code === "missing_credentials") {
+  if (hasError && ambient.error?.code === 'missing_credentials') {
     return (
       <div className="panel" style={{ padding: 14 }}>
         <div style={{ fontSize: 14, fontWeight: 800, marginBottom: 8 }}>🌦️ Ambient Weather</div>
-        <div style={{ color: "var(--text-secondary)", fontSize: 13, lineHeight: 1.4 }}>
+        <div style={{ color: 'var(--text-secondary)', fontSize: 13, lineHeight: 1.4 }}>
           Missing Ambient credentials.
           <br />
-          Put <Code>VITE_AMBIENT_API_KEY</Code> and <Code>VITE_AMBIENT_APPLICATION_KEY</Code> in{" "}
-          <Code>.env.local</Code>, then restart.
+          Put <Code>VITE_AMBIENT_API_KEY</Code> and <Code>VITE_AMBIENT_APPLICATION_KEY</Code> in <Code>.env.local</Code>
+          , then restart.
         </div>
       </div>
     );
@@ -189,7 +220,7 @@ export default function AmbientPanel({ tempUnit = "F" }) {
     return (
       <div className="panel" style={{ padding: 14 }}>
         <div style={{ fontSize: 14, fontWeight: 800, marginBottom: 8 }}>🌦️ Ambient Weather</div>
-        <div style={{ color: "var(--text-secondary)", fontSize: 13 }}>Loading…</div>
+        <div style={{ color: 'var(--text-secondary)', fontSize: 13 }}>Loading…</div>
       </div>
     );
   }
@@ -198,8 +229,8 @@ export default function AmbientPanel({ tempUnit = "F" }) {
     return (
       <div className="panel" style={{ padding: 14 }}>
         <div style={{ fontSize: 14, fontWeight: 800, marginBottom: 8 }}>🌦️ Ambient Weather</div>
-        <div style={{ color: "var(--text-secondary)", fontSize: 13 }}>
-          No data yet. {hasError ? `(${ambient.error?.message || "error"})` : ""}
+        <div style={{ color: 'var(--text-secondary)', fontSize: 13 }}>
+          No data yet. {hasError ? `(${ambient.error?.message || 'error'})` : ''}
         </div>
       </div>
     );
@@ -208,21 +239,21 @@ export default function AmbientPanel({ tempUnit = "F" }) {
   const filtered = rows.filter((r) => {
     if (!prefs.show[r.key]) return false;
     if (!prefs.autoHideMissing) return true;
-    return !(r.value == null || r.value === "");
+    return !(r.value == null || r.value === '');
   });
 
   const byGroup = (g) => filtered.filter((r) => r.group === g);
 
-  const outsideRows = byGroup("outside");
-  const windRows = byGroup("wind");
-  const rainRows = byGroup("rain");
-  const indoorRows = byGroup("indoor");
-  const extraRows = byGroup("extras");
-  const batteryRows = byGroup("battery");
+  const outsideRows = byGroup('outside');
+  const windRows = byGroup('wind');
+  const rainRows = byGroup('rain');
+  const indoorRows = byGroup('indoor');
+  const extraRows = byGroup('extras');
+  const batteryRows = byGroup('battery');
 
   const Toggle = ({ k, label }) => (
-    <label style={{ display: "flex", alignItems: "center", justifyContent: "space-between", gap: 10, margin: "4px 0" }}>
-      <span style={{ color: "var(--text-secondary)", fontSize: 13 }}>{label}</span>
+    <label style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 10, margin: '4px 0' }}>
+      <span style={{ color: 'var(--text-secondary)', fontSize: 13 }}>{label}</span>
       <input
         type="checkbox"
         checked={!!prefs.show[k]}
@@ -233,24 +264,22 @@ export default function AmbientPanel({ tempUnit = "F" }) {
 
   return (
     <div className="panel" style={{ padding: 14 }}>
-      <div style={{ display: "flex", alignItems: "center", justifyContent: "space-between", marginBottom: 10 }}>
+      <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', marginBottom: 10 }}>
         <div style={{ fontSize: 14, fontWeight: 800 }}>🌦️ Ambient Weather</div>
-        <div style={{ display: "flex", alignItems: "center", gap: 10 }}>
-          <div style={{ fontSize: 12, color: "var(--text-muted)" }}>
-            {safeLocalTimeString(w.lastUpdated)}
-          </div>
+        <div style={{ display: 'flex', alignItems: 'center', gap: 10 }}>
+          <div style={{ fontSize: 12, color: 'var(--text-muted)' }}>{safeLocalTimeString(w.lastUpdated)}</div>
           <button
             onClick={() => setPrefs((p) => ({ ...p, open: !p.open }))}
             title="Ambient display options"
             style={{
-              cursor: "pointer",
-              border: "1px solid var(--border-color)",
-              background: "var(--bg-tertiary)",
-              color: "var(--text-primary)",
+              cursor: 'pointer',
+              border: '1px solid var(--border-color)',
+              background: 'var(--bg-tertiary)',
+              color: 'var(--text-primary)',
               borderRadius: 6,
-              padding: "2px 8px",
+              padding: '2px 8px',
               fontSize: 12,
-              lineHeight: "18px",
+              lineHeight: '18px',
             }}
           >
             ⚙
@@ -263,13 +292,15 @@ export default function AmbientPanel({ tempUnit = "F" }) {
           style={{
             marginBottom: 10,
             padding: 10,
-            border: "1px solid var(--border-color)",
+            border: '1px solid var(--border-color)',
             borderRadius: 10,
-            background: "var(--bg-tertiary)",
+            background: 'var(--bg-tertiary)',
           }}
         >
-          <label style={{ display: "flex", alignItems: "center", justifyContent: "space-between", gap: 10, marginBottom: 8 }}>
-            <span style={{ color: "var(--text-secondary)", fontSize: 13 }}>Auto-hide missing values</span>
+          <label
+            style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 10, marginBottom: 8 }}
+          >
+            <span style={{ color: 'var(--text-secondary)', fontSize: 13 }}>Auto-hide missing values</span>
             <input
               type="checkbox"
               checked={!!prefs.autoHideMissing}
@@ -277,9 +308,11 @@ export default function AmbientPanel({ tempUnit = "F" }) {
             />
           </label>
 
-          <div style={{ display: "grid", gridTemplateColumns: "1fr 1fr", gap: 10 }}>
+          <div style={{ display: 'grid', gridTemplateColumns: '1fr 1fr', gap: 10 }}>
             <div>
-              <div style={{ fontWeight: 800, fontSize: 12, color: "var(--text-primary)", marginBottom: 6 }}>Outside</div>
+              <div style={{ fontWeight: 800, fontSize: 12, color: 'var(--text-primary)', marginBottom: 6 }}>
+                Outside
+              </div>
               <Toggle k="temp" label="Temp" />
               <Toggle k="feelsLike" label="Feels" />
               <Toggle k="humidity" label="Humidity" />
@@ -289,7 +322,7 @@ export default function AmbientPanel({ tempUnit = "F" }) {
             </div>
 
             <div>
-              <div style={{ fontWeight: 800, fontSize: 12, color: "var(--text-primary)", marginBottom: 6 }}>Wind</div>
+              <div style={{ fontWeight: 800, fontSize: 12, color: 'var(--text-primary)', marginBottom: 6 }}>Wind</div>
               <Toggle k="windSpeed" label="Wind Speed" />
               <Toggle k="windDir" label="Direction (N/NE/E…)" />
               <Toggle k="windDirDeg" label="Direction (deg)" />
@@ -298,7 +331,7 @@ export default function AmbientPanel({ tempUnit = "F" }) {
             </div>
 
             <div>
-              <div style={{ fontWeight: 800, fontSize: 12, color: "var(--text-primary)", marginBottom: 6 }}>Rain</div>
+              <div style={{ fontWeight: 800, fontSize: 12, color: 'var(--text-primary)', marginBottom: 6 }}>Rain</div>
               <Toggle k="rainDaily" label="Rain Today" />
               <Toggle k="rainRate" label="Rain Rate" />
               <Toggle k="rainHourly" label="Rain Hourly" />
@@ -308,7 +341,7 @@ export default function AmbientPanel({ tempUnit = "F" }) {
             </div>
 
             <div>
-              <div style={{ fontWeight: 800, fontSize: 12, color: "var(--text-primary)", marginBottom: 6 }}>
+              <div style={{ fontWeight: 800, fontSize: 12, color: 'var(--text-primary)', marginBottom: 6 }}>
                 Indoor / Extras
               </div>
               <Toggle k="indoorTemp" label="Indoor Temp" />
@@ -325,30 +358,30 @@ export default function AmbientPanel({ tempUnit = "F" }) {
         </div>
       )}
 
-      {outsideRows.map((r) => row(r.label, r.value != null ? r.fmt(r.value) : "--"))}
+      {outsideRows.map((r) => row(r.label, r.value != null ? r.fmt(r.value) : '--'))}
 
       {windRows.length > 0 && (
-        <div style={{ marginTop: 10, paddingTop: 10, borderTop: "1px solid var(--border-color)" }}>
-          {windRows.map((r) => row(r.label, r.value != null ? r.fmt(r.value) : "--"))}
+        <div style={{ marginTop: 10, paddingTop: 10, borderTop: '1px solid var(--border-color)' }}>
+          {windRows.map((r) => row(r.label, r.value != null ? r.fmt(r.value) : '--'))}
         </div>
       )}
 
       {rainRows.length > 0 && (
-        <div style={{ marginTop: 10, paddingTop: 10, borderTop: "1px solid var(--border-color)" }}>
-          {rainRows.map((r) => row(r.label, r.value != null ? r.fmt(r.value) : "--"))}
+        <div style={{ marginTop: 10, paddingTop: 10, borderTop: '1px solid var(--border-color)' }}>
+          {rainRows.map((r) => row(r.label, r.value != null ? r.fmt(r.value) : '--'))}
         </div>
       )}
 
       {indoorRows.length > 0 && (
-        <div style={{ marginTop: 10, paddingTop: 10, borderTop: "1px solid var(--border-color)" }}>
-          {indoorRows.map((r) => row(r.label, r.value != null ? r.fmt(r.value) : "--"))}
+        <div style={{ marginTop: 10, paddingTop: 10, borderTop: '1px solid var(--border-color)' }}>
+          {indoorRows.map((r) => row(r.label, r.value != null ? r.fmt(r.value) : '--'))}
         </div>
       )}
 
       {(extraRows.length > 0 || batteryRows.length > 0) && (
-        <div style={{ marginTop: 10, paddingTop: 10, borderTop: "1px solid var(--border-color)" }}>
-          {extraRows.map((r) => row(r.label, r.value != null ? r.fmt(r.value) : "--"))}
-          {batteryRows.map((r) => row(r.label, r.value != null ? r.fmt(r.value) : "--"))}
+        <div style={{ marginTop: 10, paddingTop: 10, borderTop: '1px solid var(--border-color)' }}>
+          {extraRows.map((r) => row(r.label, r.value != null ? r.fmt(r.value) : '--'))}
+          {batteryRows.map((r) => row(r.label, r.value != null ? r.fmt(r.value) : '--'))}
         </div>
       )}
     </div>
diff --git a/src/components/AnalogClockPanel.jsx b/src/components/AnalogClockPanel.jsx
index 044c2f67..1f586be1 100644
--- a/src/components/AnalogClockPanel.jsx
+++ b/src/components/AnalogClockPanel.jsx
@@ -34,7 +34,7 @@ export const AnalogClockPanel = ({ currentTime, sunTimes }) => {
   // Calculate hand angles
   const secondAngle = (seconds / 60) * 360;
   const minuteAngle = ((minutes + seconds / 60) / 60) * 360;
-  const hourAngle = ((hours % 12 + minutes / 60) / 12) * 360;
+  const hourAngle = (((hours % 12) + minutes / 60) / 12) * 360;
 
   // Format date info (already local)
   const dayOfWeek = time.toLocaleDateString([], { weekday: 'short' });
@@ -74,7 +74,7 @@ export const AnalogClockPanel = ({ currentTime, sunTimes }) => {
         stroke={isMajor ? 'var(--text-primary)' : 'var(--text-muted)'}
         strokeWidth={isMajor ? 2 : 1}
         strokeLinecap="round"
-      />
+      />,
     );
   }
 
@@ -97,7 +97,7 @@ export const AnalogClockPanel = ({ currentTime, sunTimes }) => {
         fontWeight="600"
       >
         {i}
-      </text>
+      </text>,
     );
   }
 
@@ -179,28 +179,13 @@ export const AnalogClockPanel = ({ currentTime, sunTimes }) => {
         </text>
 
         {/* Hour hand */}
-        <Hand
-          angle={hourAngle}
-          length={clockRadius * 0.5}
-          width={4}
-          color="var(--text-primary)"
-        />
+        <Hand angle={hourAngle} length={clockRadius * 0.5} width={4} color="var(--text-primary)" />
 
         {/* Minute hand */}
-        <Hand
-          angle={minuteAngle}
-          length={clockRadius * 0.7}
-          width={3}
-          color="var(--text-primary)"
-        />
+        <Hand angle={minuteAngle} length={clockRadius * 0.7} width={3} color="var(--text-primary)" />
 
         {/* Second hand */}
-        <Hand
-          angle={secondAngle}
-          length={clockRadius * 0.8}
-          width={1.5}
-          color="var(--accent-red, #ef4444)"
-        />
+        <Hand angle={secondAngle} length={clockRadius * 0.8} width={1.5} color="var(--accent-red, #ef4444)" />
 
         {/* Center dot */}
         <circle cx={center} cy={center} r={4} fill="var(--accent-red, #ef4444)" />
diff --git a/src/components/AzimuthalMap.jsx b/src/components/AzimuthalMap.jsx
index 84627a7b..63d445b9 100644
--- a/src/components/AzimuthalMap.jsx
+++ b/src/components/AzimuthalMap.jsx
@@ -13,8 +13,10 @@ import { calculateGridSquare } from '../utils/geo.js';
 const DEG = Math.PI / 180;
 
 function project(lat, lon, lat0, lon0) {
-  const φ = lat * DEG, λ = lon * DEG;
-  const φ0 = lat0 * DEG, λ0 = lon0 * DEG;
+  const φ = lat * DEG,
+    λ = lon * DEG;
+  const φ0 = lat0 * DEG,
+    λ0 = lon0 * DEG;
   const cosC = Math.sin(φ0) * Math.sin(φ) + Math.cos(φ0) * Math.cos(φ) * Math.cos(λ - λ0);
   const c = Math.acos(Math.max(-1, Math.min(1, cosC)));
   if (c < 1e-10) return { x: 0, y: 0, dist: 0 };
@@ -22,16 +24,18 @@ function project(lat, lon, lat0, lon0) {
   return {
     x: k * Math.cos(φ) * Math.sin(λ - λ0),
     y: -(k * (Math.cos(φ0) * Math.sin(φ) - Math.sin(φ0) * Math.cos(φ) * Math.cos(λ - λ0))),
-    dist: c * 6371 // distance in km
+    dist: c * 6371, // distance in km
   };
 }
 
 function unproject(x, y, lat0, lon0) {
-  const φ0 = lat0 * DEG, λ0 = lon0 * DEG;
+  const φ0 = lat0 * DEG,
+    λ0 = lon0 * DEG;
   const ρ = Math.sqrt(x * x + y * y);
   if (ρ < 1e-10) return { lat: lat0, lon: lon0 };
   const c = ρ; // azimuthal equidistant: ρ = c
-  const sinC = Math.sin(c), cosC = Math.cos(c);
+  const sinC = Math.sin(c),
+    cosC = Math.cos(c);
   const lat = Math.asin(cosC * Math.sin(φ0) + (-y * sinC * Math.cos(φ0)) / ρ) / DEG;
   const lon = (λ0 + Math.atan2(x * sinC, ρ * Math.cos(φ0) * cosC + y * Math.sin(φ0) * sinC)) / DEG;
   return { lat, lon: ((lon + 540) % 360) - 180 };
@@ -44,7 +48,9 @@ async function fetchLand() {
   try {
     const res = await fetch('https://cdn.jsdelivr.net/gh/johan/world.geo.json@master/countries.geo.json');
     geoCache = await res.json();
-  } catch { geoCache = { features: [] }; }
+  } catch {
+    geoCache = { features: [] };
+  }
   return geoCache;
 }
 
@@ -92,14 +98,16 @@ export default function AzimuthalMap({
 
   // Load GeoJSON once
   useEffect(() => {
-    fetchLand().then(geo => { geoRef.current = geo; });
+    fetchLand().then((geo) => {
+      geoRef.current = geo;
+    });
   }, []);
 
   // Resize observer
   useEffect(() => {
     const el = containerRef.current;
     if (!el) return;
-    const ro = new ResizeObserver(entries => {
+    const ro = new ResizeObserver((entries) => {
       const { width, height } = entries[0].contentRect;
       setSize({ w: Math.round(width), h: Math.round(height) });
     });
@@ -108,23 +116,29 @@ export default function AzimuthalMap({
   }, []);
 
   // ── Coordinate conversion ────────────────────────────────
-  const toCanvas = useCallback((lat, lon) => {
-    const p = project(lat, lon, lat0, lon0);
-    const scale = (Math.min(size.w, size.h) / 2 - 20) * zoom / Math.PI;
-    return {
-      x: size.w / 2 + p.x * scale + pan.x,
-      y: size.h / 2 + p.y * scale + pan.y,
-      dist: p.dist
-    };
-  }, [lat0, lon0, size.w, size.h, zoom, pan.x, pan.y]);
-
-  const fromCanvas = useCallback((cx, cy) => {
-    const scale = (Math.min(size.w, size.h) / 2 - 20) * zoom / Math.PI;
-    const x = (cx - size.w / 2 - pan.x) / scale;
-    const y = (cy - size.h / 2 - pan.y) / scale;
-    if (Math.sqrt(x * x + y * y) > Math.PI) return null;
-    return unproject(x, y, lat0, lon0);
-  }, [lat0, lon0, size.w, size.h, zoom, pan.x, pan.y]);
+  const toCanvas = useCallback(
+    (lat, lon) => {
+      const p = project(lat, lon, lat0, lon0);
+      const scale = ((Math.min(size.w, size.h) / 2 - 20) * zoom) / Math.PI;
+      return {
+        x: size.w / 2 + p.x * scale + pan.x,
+        y: size.h / 2 + p.y * scale + pan.y,
+        dist: p.dist,
+      };
+    },
+    [lat0, lon0, size.w, size.h, zoom, pan.x, pan.y],
+  );
+
+  const fromCanvas = useCallback(
+    (cx, cy) => {
+      const scale = ((Math.min(size.w, size.h) / 2 - 20) * zoom) / Math.PI;
+      const x = (cx - size.w / 2 - pan.x) / scale;
+      const y = (cy - size.h / 2 - pan.y) / scale;
+      if (Math.sqrt(x * x + y * y) > Math.PI) return null;
+      return unproject(x, y, lat0, lon0);
+    },
+    [lat0, lon0, size.w, size.h, zoom, pan.x, pan.y],
+  );
 
   // ── Render ───────────────────────────────────────────────
   useEffect(() => {
@@ -160,14 +174,14 @@ export default function AzimuthalMap({
       ctx.strokeStyle = '#2a3a4a';
       ctx.lineWidth = 0.5;
 
-      geo.features.forEach(feature => {
+      geo.features.forEach((feature) => {
         const geom = feature.geometry;
         if (!geom) return;
-        const rings = geom.type === 'Polygon' ? [geom.coordinates] :
-                      geom.type === 'MultiPolygon' ? geom.coordinates : [];
+        const rings =
+          geom.type === 'Polygon' ? [geom.coordinates] : geom.type === 'MultiPolygon' ? geom.coordinates : [];
 
-        rings.forEach(polygon => {
-          polygon.forEach(ring => {
+        rings.forEach((polygon) => {
+          polygon.forEach((ring) => {
             if (ring.length < 3) return;
             ctx.beginPath();
             let started = false;
@@ -176,8 +190,10 @@ export default function AzimuthalMap({
               const p = project(lat, lon, lat0, lon0);
               const px = cx + p.x * scale;
               const py = cy + p.y * scale;
-              if (!started) { ctx.moveTo(px, py); started = true; }
-              else ctx.lineTo(px, py);
+              if (!started) {
+                ctx.moveTo(px, py);
+                started = true;
+              } else ctx.lineTo(px, py);
             }
             ctx.closePath();
             ctx.fill();
@@ -192,7 +208,7 @@ export default function AzimuthalMap({
     ctx.lineWidth = 1;
     ctx.setLineDash([4, 8]);
     const ringDistances = [2000, 5000, 10000, 15000, 20000]; // km
-    ringDistances.forEach(km => {
+    ringDistances.forEach((km) => {
       const angularDist = km / 6371; // radians
       const r = angularDist * scale;
       if (r > 2 && r < R * 1.5) {
@@ -236,7 +252,7 @@ export default function AzimuthalMap({
 
     // ── DX Cluster paths ─────────────────────────────────
     if (showDXPaths && dxPaths?.length > 0) {
-      dxPaths.forEach(path => {
+      dxPaths.forEach((path) => {
         if (!path.dxLat || !path.dxLon) return;
         const freq = parseFloat(path.freq);
         const color = getBandColor(freq);
@@ -257,18 +273,27 @@ export default function AzimuthalMap({
             const lat = path.spotterLat + (path.dxLat - path.spotterLat) * t;
             const lon = path.spotterLon + (path.dxLon - path.spotterLon) * t;
             // Proper great circle interpolation
-            const d = Math.acos(Math.max(-1, Math.min(1,
-              Math.sin(path.spotterLat * DEG) * Math.sin(path.dxLat * DEG) +
-              Math.cos(path.spotterLat * DEG) * Math.cos(path.dxLat * DEG) *
-              Math.cos((path.dxLon - path.spotterLon) * DEG)
-            )));
+            const d = Math.acos(
+              Math.max(
+                -1,
+                Math.min(
+                  1,
+                  Math.sin(path.spotterLat * DEG) * Math.sin(path.dxLat * DEG) +
+                    Math.cos(path.spotterLat * DEG) *
+                      Math.cos(path.dxLat * DEG) *
+                      Math.cos((path.dxLon - path.spotterLon) * DEG),
+                ),
+              ),
+            );
             if (d < 1e-6) continue;
             const A = Math.sin((1 - t) * d) / Math.sin(d);
             const B = Math.sin(t * d) / Math.sin(d);
-            const x = A * Math.cos(path.spotterLat * DEG) * Math.cos(path.spotterLon * DEG) +
-                      B * Math.cos(path.dxLat * DEG) * Math.cos(path.dxLon * DEG);
-            const y = A * Math.cos(path.spotterLat * DEG) * Math.sin(path.spotterLon * DEG) +
-                      B * Math.cos(path.dxLat * DEG) * Math.sin(path.dxLon * DEG);
+            const x =
+              A * Math.cos(path.spotterLat * DEG) * Math.cos(path.spotterLon * DEG) +
+              B * Math.cos(path.dxLat * DEG) * Math.cos(path.dxLon * DEG);
+            const y =
+              A * Math.cos(path.spotterLat * DEG) * Math.sin(path.spotterLon * DEG) +
+              B * Math.cos(path.dxLat * DEG) * Math.sin(path.dxLon * DEG);
             const z = A * Math.sin(path.spotterLat * DEG) + B * Math.sin(path.dxLat * DEG);
             const iLat = Math.atan2(z, Math.sqrt(x * x + y * y)) / DEG;
             const iLon = Math.atan2(y, x) / DEG;
@@ -295,7 +320,7 @@ export default function AzimuthalMap({
 
     // ── PSK Reporter spots ───────────────────────────────
     if (showPSKReporter && pskReporterSpots?.length > 0) {
-      pskReporterSpots.forEach(spot => {
+      pskReporterSpots.forEach((spot) => {
         const lat = parseFloat(spot.lat);
         const lon = parseFloat(spot.lon);
         if (isNaN(lat) || isNaN(lon)) return;
@@ -326,11 +351,11 @@ export default function AzimuthalMap({
     // ── WSJT-X spots ─────────────────────────────────────
     if (showWSJTX && wsjtxSpots?.length > 0) {
       const seen = new Map();
-      wsjtxSpots.forEach(s => {
+      wsjtxSpots.forEach((s) => {
         const call = s.caller || s.dxCall || '';
         if (call && (!seen.has(call) || s.timestamp > seen.get(call).timestamp)) seen.set(call, s);
       });
-      seen.forEach(spot => {
+      seen.forEach((spot) => {
         const lat = parseFloat(spot.lat);
         const lon = parseFloat(spot.lon);
         if (isNaN(lat) || isNaN(lon)) return;
@@ -362,7 +387,7 @@ export default function AzimuthalMap({
 
     // ── POTA spots ───────────────────────────────────────
     if (showPOTA && potaSpots?.length > 0) {
-      potaSpots.forEach(spot => {
+      potaSpots.forEach((spot) => {
         if (!spot.lat || !spot.lon) return;
         const p = toCanvas(spot.lat, spot.lon);
         // Green triangle
@@ -381,7 +406,7 @@ export default function AzimuthalMap({
 
     // ── WWFF spots ───────────────────────────────────────
     if (showWWFF && wwffSpots?.length > 0) {
-      wwffSpots.forEach(spot => {
+      wwffSpots.forEach((spot) => {
         if (!spot.lat || !spot.lon) return;
         const p = toCanvas(spot.lat, spot.lon);
         // Light green inverted triangle
@@ -400,7 +425,7 @@ export default function AzimuthalMap({
 
     // ── SOTA spots ───────────────────────────────────────
     if (showSOTA && sotaSpots?.length > 0) {
-      sotaSpots.forEach(spot => {
+      sotaSpots.forEach((spot) => {
         if (!spot.lat || !spot.lon) return;
         const p = toCanvas(spot.lat, spot.lon);
         // Orange diamond
@@ -470,68 +495,100 @@ export default function AzimuthalMap({
       const grid = calculateGridSquare(lat0, lon0);
       ctx.fillText(`Azimuthal Equidistant · ${grid} · ${lat0.toFixed(2)}°, ${lon0.toFixed(2)}°`, 14, size.h - 19);
     }
-
-  }, [size, zoom, pan, lat0, lon0, deLocation, dxLocation,
-      dxPaths, dxFilters, showDXPaths, hoveredSpot,
-      potaSpots, showPOTA, wwffSpots, showWWFF,
-      sotaSpots, showSOTA,
-      pskReporterSpots, showPSKReporter,
-      wsjtxSpots, showWSJTX,
-      hideOverlays, toCanvas]);
+  }, [
+    size,
+    zoom,
+    pan,
+    lat0,
+    lon0,
+    deLocation,
+    dxLocation,
+    dxPaths,
+    dxFilters,
+    showDXPaths,
+    hoveredSpot,
+    potaSpots,
+    showPOTA,
+    wwffSpots,
+    showWWFF,
+    sotaSpots,
+    showSOTA,
+    pskReporterSpots,
+    showPSKReporter,
+    wsjtxSpots,
+    showWSJTX,
+    hideOverlays,
+    toCanvas,
+  ]);
 
   // ── Mouse handlers ───────────────────────────────────────
   const handleWheel = useCallback((e) => {
     e.preventDefault();
-    setZoom(prev => Math.max(0.5, Math.min(8, prev * (e.deltaY < 0 ? 1.15 : 0.87))));
+    setZoom((prev) => Math.max(0.5, Math.min(8, prev * (e.deltaY < 0 ? 1.15 : 0.87))));
   }, []);
 
-  const handleMouseDown = useCallback((e) => {
-    if (e.button === 0) {
-      dragRef.current = { startX: e.clientX - pan.x, startY: e.clientY - pan.y };
-    }
-  }, [pan]);
-
-  const handleMouseMove = useCallback((e) => {
-    if (dragRef.current) {
-      setPan({ x: e.clientX - dragRef.current.startX, y: e.clientY - dragRef.current.startY });
-      return;
-    }
-    // Tooltip
-    const rect = canvasRef.current?.getBoundingClientRect();
-    if (!rect) return;
-    const mx = e.clientX - rect.left;
-    const my = e.clientY - rect.top;
-    const pos = fromCanvas(mx, my);
-    if (pos) {
-      const bearing = ((Math.atan2(
-        Math.sin((pos.lon - lon0) * DEG) * Math.cos(pos.lat * DEG),
-        Math.cos(lat0 * DEG) * Math.sin(pos.lat * DEG) - Math.sin(lat0 * DEG) * Math.cos(pos.lat * DEG) * Math.cos((pos.lon - lon0) * DEG)
-      ) / DEG) + 360) % 360;
-      const p = project(pos.lat, pos.lon, lat0, lon0);
-      setTooltip({
-        x: mx, y: my,
-        text: `${pos.lat.toFixed(1)}°, ${pos.lon.toFixed(1)}°  ${calculateGridSquare(pos.lat, pos.lon)}  ${Math.round(p.dist)} km  ${Math.round(bearing)}°`
-      });
-    } else {
-      setTooltip(null);
-    }
-  }, [fromCanvas, lat0, lon0]);
+  const handleMouseDown = useCallback(
+    (e) => {
+      if (e.button === 0) {
+        dragRef.current = { startX: e.clientX - pan.x, startY: e.clientY - pan.y };
+      }
+    },
+    [pan],
+  );
 
-  const handleMouseUp = useCallback((e) => {
-    const wasDrag = dragRef.current && (
-      Math.abs(e.clientX - (dragRef.current.startX + pan.x)) > 3 ||
-      Math.abs(e.clientY - (dragRef.current.startY + pan.y)) > 3
-    );
-    dragRef.current = null;
-    if (wasDrag) return; // was a drag, not a click
+  const handleMouseMove = useCallback(
+    (e) => {
+      if (dragRef.current) {
+        setPan({ x: e.clientX - dragRef.current.startX, y: e.clientY - dragRef.current.startY });
+        return;
+      }
+      // Tooltip
+      const rect = canvasRef.current?.getBoundingClientRect();
+      if (!rect) return;
+      const mx = e.clientX - rect.left;
+      const my = e.clientY - rect.top;
+      const pos = fromCanvas(mx, my);
+      if (pos) {
+        const bearing =
+          (Math.atan2(
+            Math.sin((pos.lon - lon0) * DEG) * Math.cos(pos.lat * DEG),
+            Math.cos(lat0 * DEG) * Math.sin(pos.lat * DEG) -
+              Math.sin(lat0 * DEG) * Math.cos(pos.lat * DEG) * Math.cos((pos.lon - lon0) * DEG),
+          ) /
+            DEG +
+            360) %
+          360;
+        const p = project(pos.lat, pos.lon, lat0, lon0);
+        setTooltip({
+          x: mx,
+          y: my,
+          text: `${pos.lat.toFixed(1)}°, ${pos.lon.toFixed(1)}°  ${calculateGridSquare(pos.lat, pos.lon)}  ${Math.round(p.dist)} km  ${Math.round(bearing)}°`,
+        });
+      } else {
+        setTooltip(null);
+      }
+    },
+    [fromCanvas, lat0, lon0],
+  );
 
-    // Click → set DX
-    if (dxLocked || !onDXChange) return;
-    const rect = canvasRef.current?.getBoundingClientRect();
-    if (!rect) return;
-    const pos = fromCanvas(e.clientX - rect.left, e.clientY - rect.top);
-    if (pos) onDXChange(pos);
-  }, [dxLocked, onDXChange, fromCanvas, pan]);
+  const handleMouseUp = useCallback(
+    (e) => {
+      const wasDrag =
+        dragRef.current &&
+        (Math.abs(e.clientX - (dragRef.current.startX + pan.x)) > 3 ||
+          Math.abs(e.clientY - (dragRef.current.startY + pan.y)) > 3);
+      dragRef.current = null;
+      if (wasDrag) return; // was a drag, not a click
+
+      // Click → set DX
+      if (dxLocked || !onDXChange) return;
+      const rect = canvasRef.current?.getBoundingClientRect();
+      if (!rect) return;
+      const pos = fromCanvas(e.clientX - rect.left, e.clientY - rect.top);
+      if (pos) onDXChange(pos);
+    },
+    [dxLocked, onDXChange, fromCanvas, pan],
+  );
 
   const handleMouseLeave = useCallback(() => {
     dragRef.current = null;
@@ -541,7 +598,14 @@ export default function AzimuthalMap({
   return (
     <div
       ref={containerRef}
-      style={{ position: 'relative', width: '100%', height: '100%', overflow: 'hidden', borderRadius: '8px', background: '#0a0f1a' }}
+      style={{
+        position: 'relative',
+        width: '100%',
+        height: '100%',
+        overflow: 'hidden',
+        borderRadius: '8px',
+        background: '#0a0f1a',
+      }}
     >
       <canvas
         ref={canvasRef}
@@ -557,38 +621,55 @@ export default function AzimuthalMap({
 
       {/* Tooltip */}
       {tooltip && (
-        <div style={{
-          position: 'absolute',
-          left: tooltip.x + 14,
-          top: tooltip.y - 28,
-          background: 'rgba(0, 0, 0, 0.85)',
-          border: '1px solid #444',
-          borderRadius: '4px',
-          padding: '3px 8px',
-          color: '#00ffcc',
-          fontSize: '11px',
-          fontFamily: '"JetBrains Mono", monospace',
-          pointerEvents: 'none',
-          whiteSpace: 'nowrap',
-          zIndex: 2000,
-        }}>
+        <div
+          style={{
+            position: 'absolute',
+            left: tooltip.x + 14,
+            top: tooltip.y - 28,
+            background: 'rgba(0, 0, 0, 0.85)',
+            border: '1px solid #444',
+            borderRadius: '4px',
+            padding: '3px 8px',
+            color: '#00ffcc',
+            fontSize: '11px',
+            fontFamily: '"JetBrains Mono", monospace',
+            pointerEvents: 'none',
+            whiteSpace: 'nowrap',
+            zIndex: 2000,
+          }}
+        >
           {tooltip.text}
         </div>
       )}
 
       {/* Zoom controls */}
-      <div style={{
-        position: 'absolute',
-        top: '10px',
-        left: '10px',
-        display: 'flex',
-        flexDirection: 'column',
-        gap: '2px',
-        zIndex: 1000,
-      }}>
-        <button onClick={() => setZoom(z => Math.min(8, z * 1.4))} style={zoomBtnStyle}>+</button>
-        <button onClick={() => setZoom(z => Math.max(0.5, z / 1.4))} style={zoomBtnStyle}>−</button>
-        <button onClick={() => { setZoom(1); setPan({ x: 0, y: 0 }); }} title="Reset view" style={{ ...zoomBtnStyle, fontSize: '10px' }}>⌂</button>
+      <div
+        style={{
+          position: 'absolute',
+          top: '10px',
+          left: '10px',
+          display: 'flex',
+          flexDirection: 'column',
+          gap: '2px',
+          zIndex: 1000,
+        }}
+      >
+        <button onClick={() => setZoom((z) => Math.min(8, z * 1.4))} style={zoomBtnStyle}>
+          +
+        </button>
+        <button onClick={() => setZoom((z) => Math.max(0.5, z / 1.4))} style={zoomBtnStyle}>
+          −
+        </button>
+        <button
+          onClick={() => {
+            setZoom(1);
+            setPan({ x: 0, y: 0 });
+          }}
+          title="Reset view"
+          style={{ ...zoomBtnStyle, fontSize: '10px' }}
+        >
+          ⌂
+        </button>
       </div>
     </div>
   );
diff --git a/src/components/BandConditionsPanel.jsx b/src/components/BandConditionsPanel.jsx
index 7edf3a64..17caae95 100644
--- a/src/components/BandConditionsPanel.jsx
+++ b/src/components/BandConditionsPanel.jsx
@@ -27,11 +27,13 @@ export const BandConditionsPanel = ({ data, loading }) => {
           <div className="loading-spinner" />
         </div>
       ) : (
-        <div style={{ 
-          display: 'grid', 
-          gridTemplateColumns: 'repeat(auto-fill, minmax(50px, 1fr))', 
-          gap: '6px' 
-        }}>
+        <div
+          style={{
+            display: 'grid',
+            gridTemplateColumns: 'repeat(auto-fill, minmax(50px, 1fr))',
+            gap: '6px',
+          }}
+        >
           {data.map(({ band, condition }) => {
             const style = getConditionStyle(condition);
             return (
@@ -42,23 +44,27 @@ export const BandConditionsPanel = ({ data, loading }) => {
                   padding: '6px 4px',
                   background: style.bg,
                   borderRadius: '4px',
-                  border: `1px solid ${style.color}33`
+                  border: `1px solid ${style.color}33`,
                 }}
               >
-                <div style={{ 
-                  fontSize: '12px', 
-                  fontWeight: '700', 
-                  color: 'var(--text-primary)',
-                  fontFamily: 'JetBrains Mono, monospace'
-                }}>
+                <div
+                  style={{
+                    fontSize: '12px',
+                    fontWeight: '700',
+                    color: 'var(--text-primary)',
+                    fontFamily: 'JetBrains Mono, monospace',
+                  }}
+                >
                   {band}
                 </div>
-                <div style={{ 
-                  fontSize: '9px', 
-                  fontWeight: '600', 
-                  color: style.color,
-                  marginTop: '2px'
-                }}>
+                <div
+                  style={{
+                    fontSize: '9px',
+                    fontWeight: '600',
+                    color: style.color,
+                    marginTop: '2px',
+                  }}
+                >
                   {t(`band.conditions.${condition.toLowerCase()}`)}
                 </div>
               </div>
diff --git a/src/components/BandHealthPanel.jsx b/src/components/BandHealthPanel.jsx
index 82cf3e71..56ab8408 100644
--- a/src/components/BandHealthPanel.jsx
+++ b/src/components/BandHealthPanel.jsx
@@ -1,101 +1,116 @@
-import { useEffect, useMemo, useRef, useState } from "react";
-import { createPortal } from "react-dom";
-import { useBandHealth, classifySpotMode } from "../hooks/useBandHealth.js";
-import { getBandFromFreq } from "../utils/callsign.js";
+import { useEffect, useMemo, useRef, useState } from 'react';
+import { createPortal } from 'react-dom';
+import { useBandHealth, classifySpotMode } from '../hooks/useBandHealth.js';
+import { getBandFromFreq } from '../utils/callsign.js';
 
 const MODE_TILES = [
-  { value: "ALL", label: "All" },
-  { value: "SSB", label: "SSB" },
-  { value: "CW", label: "CW" },
-  { value: "FT8", label: "FT8" },
-  { value: "FT4", label: "FT4" },
-  { value: "RTTY", label: "RTTY" },
-  { value: "PSK", label: "PSK" },
-  { value: "JT65", label: "JT65" },
-  { value: "JS8", label: "JS8" },
-  { value: "SSTV", label: "SSTV" },
-  { value: "AM", label: "AM" },
-  { value: "FM", label: "FM" },
+  { value: 'ALL', label: 'All' },
+  { value: 'SSB', label: 'SSB' },
+  { value: 'CW', label: 'CW' },
+  { value: 'FT8', label: 'FT8' },
+  { value: 'FT4', label: 'FT4' },
+  { value: 'RTTY', label: 'RTTY' },
+  { value: 'PSK', label: 'PSK' },
+  { value: 'JT65', label: 'JT65' },
+  { value: 'JS8', label: 'JS8' },
+  { value: 'SSTV', label: 'SSTV' },
+  { value: 'AM', label: 'AM' },
+  { value: 'FM', label: 'FM' },
 ];
 
-const DIGITAL_MODES = new Set(["FT8", "FT4", "RTTY", "PSK", "JT65", "JS8", "SSTV"]);
+const DIGITAL_MODES = new Set(['FT8', 'FT4', 'RTTY', 'PSK', 'JT65', 'JS8', 'SSTV']);
 
 const WINDOW_OPTIONS = [
-  { value: 15, label: "15m" },
-  { value: 30, label: "30m" },
-  { value: 60, label: "60m" },
+  { value: 15, label: '15m' },
+  { value: 30, label: '30m' },
+  { value: 60, label: '60m' },
 ];
 
-const BAND_TILES = ["160m", "80m", "60m", "40m", "30m", "20m", "17m", "15m", "12m", "10m", "6m", "2m", "70cm"];
+const BAND_TILES = ['160m', '80m', '60m', '40m', '30m', '20m', '17m', '15m', '12m', '10m', '6m', '2m', '70cm'];
 
-const STORAGE_MODE_KEY = "openhamclock_bandHealth_mode";
-const STORAGE_WINDOW_KEY = "openhamclock_bandHealth_window";
+const STORAGE_MODE_KEY = 'openhamclock_bandHealth_mode';
+const STORAGE_WINDOW_KEY = 'openhamclock_bandHealth_window';
 
 function compactStatusLabel(label) {
-  switch (String(label || "").toUpperCase()) {
-    case "EXCELLENT": return "EXCEL";
-    case "UNUSABLE": return "UNUS";
-    default: return label;
+  switch (String(label || '').toUpperCase()) {
+    case 'EXCELLENT':
+      return 'EXCEL';
+    case 'UNUSABLE':
+      return 'UNUS';
+    default:
+      return label;
   }
 }
 
 function activityStyle(activity) {
   switch (activity) {
-    case "excellent": 
-    case "good":
-      return { border: "1px solid rgba(74,222,128,0.55)", background: "rgba(74,222,128,0.10)", color: "#4ade80" };
-    case "usable":
-      return { border: "1px solid rgba(251,191,36,0.55)", background: "rgba(251,191,36,0.10)", color: "#fbbf24" };
-    case "quiet":
-      return { border: "1px solid rgba(148,163,184,0.45)", background: "rgba(148,163,184,0.08)", color: "var(--text-muted)" };
-    case "closed":
+    case 'excellent':
+    case 'good':
+      return { border: '1px solid rgba(74,222,128,0.55)', background: 'rgba(74,222,128,0.10)', color: '#4ade80' };
+    case 'usable':
+      return { border: '1px solid rgba(251,191,36,0.55)', background: 'rgba(251,191,36,0.10)', color: '#fbbf24' };
+    case 'quiet':
+      return {
+        border: '1px solid rgba(148,163,184,0.45)',
+        background: 'rgba(148,163,184,0.08)',
+        color: 'var(--text-muted)',
+      };
+    case 'closed':
     default:
-      return { border: "1px solid rgba(239,68,68,0.40)", background: "rgba(239,68,68,0.08)", color: "#fb7185" };
+      return { border: '1px solid rgba(239,68,68,0.40)', background: 'rgba(239,68,68,0.08)', color: '#fb7185' };
   }
 }
 
 function heatFromRatio(r) {
-  if (r <= 0) return { key: "cold", label: "COLD" };
-  if (r < 0.25) return { key: "cool", label: "COOL" };
-  if (r < 0.60) return { key: "warm", label: "WARM" };
-  return { key: "hot", label: "HOT" };
+  if (r <= 0) return { key: 'cold', label: 'COLD' };
+  if (r < 0.25) return { key: 'cool', label: 'COOL' };
+  if (r < 0.6) return { key: 'warm', label: 'WARM' };
+  return { key: 'hot', label: 'HOT' };
 }
 
 // For ALL: 3-level summary based on average activity across included modes
 function heatFromAverageRatio3(avg) {
-  if (avg <= 0) return { key: "cold", label: "COLD" };
-  if (avg < 0.55) return { key: "warm", label: "WARM" };
-  return { key: "hot", label: "HOT" };
+  if (avg <= 0) return { key: 'cold', label: 'COLD' };
+  if (avg < 0.55) return { key: 'warm', label: 'WARM' };
+  return { key: 'hot', label: 'HOT' };
 }
 
 function heatStyle(heatKey) {
   switch (heatKey) {
-    case "hot":
-      return { border: "1px solid rgba(74,222,128,0.70)", background: "rgba(74,222,128,0.12)", color: "#4ade80" };
-    case "warm":
-      return { border: "1px solid rgba(251,191,36,0.65)", background: "rgba(251,191,36,0.12)", color: "#fbbf24" };
-    case "cool":
-      return { border: "1px solid rgba(148,163,184,0.55)", background: "rgba(148,163,184,0.10)", color: "var(--text-primary)" };
-    case "cold":
+    case 'hot':
+      return { border: '1px solid rgba(74,222,128,0.70)', background: 'rgba(74,222,128,0.12)', color: '#4ade80' };
+    case 'warm':
+      return { border: '1px solid rgba(251,191,36,0.65)', background: 'rgba(251,191,36,0.12)', color: '#fbbf24' };
+    case 'cool':
+      return {
+        border: '1px solid rgba(148,163,184,0.55)',
+        background: 'rgba(148,163,184,0.10)',
+        color: 'var(--text-primary)',
+      };
+    case 'cold':
     default:
-      return { border: "1px solid rgba(239,68,68,0.35)", background: "rgba(239,68,68,0.06)", color: "var(--text-muted)" };
+      return {
+        border: '1px solid rgba(239,68,68,0.35)',
+        background: 'rgba(239,68,68,0.06)',
+        color: 'var(--text-muted)',
+      };
   }
 }
 
 function filteredStyle() {
   return {
-    border: "1px dashed rgba(148,163,184,0.35)",
-    background: "rgba(148,163,184,0.04)",
-    color: "rgba(148,163,184,0.70)",
+    border: '1px dashed rgba(148,163,184,0.35)',
+    background: 'rgba(148,163,184,0.04)',
+    color: 'rgba(148,163,184,0.70)',
     opacity: 0.55,
-    filter: "grayscale(0.7)",
+    filter: 'grayscale(0.7)',
   };
 }
 
 function trendGlyph(trend) {
-  if (trend === "rising") return "▲";
-  if (trend === "falling") return "▼";
-  return "•";
+  if (trend === 'rising') return '▲';
+  if (trend === 'falling') return '▼';
+  return '•';
 }
 
 /**
@@ -111,7 +126,7 @@ function spotToBand(spot) {
   if (!Number.isFinite(f) || f <= 0) return null;
 
   const band = getBandFromFreq(f);
-  return band && band !== "other" ? band : null;
+  return band && band !== 'other' ? band : null;
 }
 
 export default function BandHealthPanel({ dxSpots = [], clusterFilters = null }) {
@@ -127,15 +142,15 @@ export default function BandHealthPanel({ dxSpots = [], clusterFilters = null })
 
   const [mode, setMode] = useState(() => {
     try {
-      return localStorage.getItem(STORAGE_MODE_KEY) || "ALL";
+      return localStorage.getItem(STORAGE_MODE_KEY) || 'ALL';
     } catch {
-      return "ALL";
+      return 'ALL';
     }
   });
 
   const [windowMinutes, setWindowMinutes] = useState(() => {
     try {
-      const v = parseInt(localStorage.getItem(STORAGE_WINDOW_KEY) || "15", 10);
+      const v = parseInt(localStorage.getItem(STORAGE_WINDOW_KEY) || '15', 10);
       return Number.isFinite(v) ? v : 15;
     } catch {
       return 15;
@@ -156,8 +171,6 @@ export default function BandHealthPanel({ dxSpots = [], clusterFilters = null })
       localStorage.setItem(STORAGE_WINDOW_KEY, String(n));
     } catch {}
   };
-  
-
 
   // Filters come from dxFilters (same object DXClusterPanel uses)
   const includedBands = useMemo(() => {
@@ -180,9 +193,9 @@ export default function BandHealthPanel({ dxSpots = [], clusterFilters = null })
   const updatedText = useMemo(() => {
     try {
       const d = new Date(updatedAt);
-      return d.toLocaleTimeString(undefined, { hour: "2-digit", minute: "2-digit" });
+      return d.toLocaleTimeString(undefined, { hour: '2-digit', minute: '2-digit' });
     } catch {
-      return "";
+      return '';
     }
   }, [updatedAt]);
 
@@ -193,9 +206,9 @@ export default function BandHealthPanel({ dxSpots = [], clusterFilters = null })
     return BAND_TILES.map((bandName) => {
       const base = byBand.get(bandName) || {
         band: bandName,
-        activity: "closed",
-        label: "CLOSED",
-        trend: "steady",
+        activity: 'closed',
+        label: 'CLOSED',
+        trend: 'steady',
         count: 0,
         uniques: 0,
       };
@@ -205,10 +218,10 @@ export default function BandHealthPanel({ dxSpots = [], clusterFilters = null })
         return {
           ...base,
           filtered: true,
-          label: "FILTERED",
+          label: 'FILTERED',
           count: 0,
           uniques: 0,
-          trend: "steady",
+          trend: 'steady',
         };
       }
 
@@ -226,7 +239,7 @@ export default function BandHealthPanel({ dxSpots = [], clusterFilters = null })
     const uniques = new Map();
 
     for (const t of MODE_TILES) {
-      if (t.value !== "ALL") {
+      if (t.value !== 'ALL') {
         counts.set(t.value, 0);
         uniques.set(t.value, new Set());
       }
@@ -239,7 +252,7 @@ export default function BandHealthPanel({ dxSpots = [], clusterFilters = null })
       // timestamp can be number or ISO; normalize safely
       let ts = now;
       if (s?.timestamp != null) {
-        const maybe = typeof s.timestamp === "number" ? s.timestamp : Date.parse(s.timestamp);
+        const maybe = typeof s.timestamp === 'number' ? s.timestamp : Date.parse(s.timestamp);
         ts = Number.isFinite(maybe) ? maybe : now;
       }
       if (ts < cutoff) continue;
@@ -250,7 +263,7 @@ export default function BandHealthPanel({ dxSpots = [], clusterFilters = null })
       // Respect band filters (if active)
       if (includedBands && !includedBands.has(band)) continue;
 
-      const m = String(classifySpotMode(s)?.mode || "").toUpperCase();
+      const m = String(classifySpotMode(s)?.mode || '').toUpperCase();
 
       // If mode filters active, only count spots that match included modes
       if (includedModes && (!m || !includedModes.has(m))) continue;
@@ -277,7 +290,7 @@ export default function BandHealthPanel({ dxSpots = [], clusterFilters = null })
     let sumRatio = 0;
     let nRatio = 0;
     for (const t of MODE_TILES) {
-      if (t.value === "ALL") continue;
+      if (t.value === 'ALL') continue;
       if (includedModes && !includedModes.has(t.value)) continue;
 
       const c = counts.get(t.value) || 0;
@@ -296,7 +309,7 @@ export default function BandHealthPanel({ dxSpots = [], clusterFilters = null })
       // timestamp can be number or ISO; normalize safely
       let ts = now;
       if (s?.timestamp != null) {
-        const maybe = typeof s.timestamp === "number" ? s.timestamp : Date.parse(s.timestamp);
+        const maybe = typeof s.timestamp === 'number' ? s.timestamp : Date.parse(s.timestamp);
         ts = Number.isFinite(maybe) ? maybe : now;
       }
       if (ts < cutoff) continue;
@@ -308,7 +321,7 @@ export default function BandHealthPanel({ dxSpots = [], clusterFilters = null })
       if (includedBands && !includedBands.has(band)) continue;
 
       const cls = classifySpotMode(s); // { mode, inferred, confidence, ... }
-      const m = String(cls?.mode || "").toUpperCase();
+      const m = String(cls?.mode || '').toUpperCase();
 
       // If mode filters active, only count spots that match included modes
       if (includedModes && (!m || !includedModes.has(m))) continue;
@@ -321,25 +334,25 @@ export default function BandHealthPanel({ dxSpots = [], clusterFilters = null })
 
     const unknownCount = Math.max(0, allCount - knownCount);
 
-const tiles = MODE_TILES.map((t) => {
-  if (t.value === "ALL") {
-    const heat = heatFromAverageRatio3(avgRatio);
-    const tooltip =
-      `There are ${allCount} active signals on the bands right now.\n` +
-      `Classified into known modes: ${knownCount} (inferred: ${inferredCount}).\n` +
-      `Still unknown/unspecified: ${unknownCount}.\n` +
-      `Inference is best-effort from frequency (band plan).`;
-
-    return {
-      value: "ALL",
-      label: "All",
-      count: allCount,
-      uniq: allUniques.size,
-      heat,
-      filtered: false,
-      tooltip,
-    };
-  }
+    const tiles = MODE_TILES.map((t) => {
+      if (t.value === 'ALL') {
+        const heat = heatFromAverageRatio3(avgRatio);
+        const tooltip =
+          `There are ${allCount} active signals on the bands right now.\n` +
+          `Classified into known modes: ${knownCount} (inferred: ${inferredCount}).\n` +
+          `Still unknown/unspecified: ${unknownCount}.\n` +
+          `Inference is best-effort from frequency (band plan).`;
+
+        return {
+          value: 'ALL',
+          label: 'All',
+          count: allCount,
+          uniq: allUniques.size,
+          heat,
+          filtered: false,
+          tooltip,
+        };
+      }
 
       const isFiltered = includedModes ? !includedModes.has(t.value) : false;
       if (isFiltered) {
@@ -348,7 +361,7 @@ const tiles = MODE_TILES.map((t) => {
           label: t.label,
           count: 0,
           uniq: 0,
-          heat: { key: "cold", label: "FILTERED" },
+          heat: { key: 'cold', label: 'FILTERED' },
           filtered: true,
         };
       }
@@ -369,20 +382,23 @@ const tiles = MODE_TILES.map((t) => {
     });
 
     // Keep ALL first; then sort rest by activity
-    const allTile = tiles.find((x) => x.value === "ALL");
-    const rest = tiles.filter((x) => x.value !== "ALL").sort((a, b) => b.count - a.count);
+    const allTile = tiles.find((x) => x.value === 'ALL');
+    const rest = tiles.filter((x) => x.value !== 'ALL').sort((a, b) => b.count - a.count);
     return allTile ? [allTile, ...rest] : rest;
   }, [dxSpots, windowMinutes, includedBands, includedModes]);
 
   return (
-    <div className="panel" style={{ padding: "8px 10px", height: "100%", overflow: "hidden", display: "flex", flexDirection: "column" }}>
+    <div
+      className="panel"
+      style={{ padding: '8px 10px', height: '100%', overflow: 'hidden', display: 'flex', flexDirection: 'column' }}
+    >
       {/* Header */}
-      <div style={{ display: "flex", justifyContent: "space-between", alignItems: "center", marginBottom: 6 }}>
-        <div style={{ fontSize: 12, fontWeight: 700, letterSpacing: "0.04em" }}>HF BAND HEALTH</div>
-        <div style={{ display: "flex", alignItems: "center", gap: 8 }}>
-          <div style={{ fontSize: 10, color: "var(--text-muted)" }}>{updatedText ? `upd ${updatedText}` : ""}</div>
+      <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: 6 }}>
+        <div style={{ fontSize: 12, fontWeight: 700, letterSpacing: '0.04em' }}>HF BAND HEALTH</div>
+        <div style={{ display: 'flex', alignItems: 'center', gap: 8 }}>
+          <div style={{ fontSize: 10, color: 'var(--text-muted)' }}>{updatedText ? `upd ${updatedText}` : ''}</div>
           <div
-            style={{ cursor: "help", userSelect: "none" }}
+            style={{ cursor: 'help', userSelect: 'none' }}
             title="HF Band Health shows real-world band usability based on recent DX Cluster spot activity. It uses a rolling time window and respects active DX Cluster filters."
           >
             ℹ️
@@ -391,24 +407,28 @@ const tiles = MODE_TILES.map((t) => {
       </div>
 
       {/* Controls */}
-      <div style={{ display: "flex", gap: 8, alignItems: "center", marginBottom: 8 }}>
-        <div style={{ display: "flex", gap: 6, alignItems: "center" }}>
-          <span style={{ fontSize: 10, color: "var(--text-muted)" }}>Window</span>
+      <div style={{ display: 'flex', gap: 8, alignItems: 'center', marginBottom: 8 }}>
+        <div style={{ display: 'flex', gap: 6, alignItems: 'center' }}>
+          <span style={{ fontSize: 10, color: 'var(--text-muted)' }}>Window</span>
           <select
             value={windowMinutes}
             onChange={(e) => onWindowChange(e.target.value)}
             style={{
               fontSize: 11,
-              padding: "2px 6px",
-              background: "var(--bg-secondary)",
-              color: "var(--text-primary)",
-              border: "1px solid var(--border-color)",
+              padding: '2px 6px',
+              background: 'var(--bg-secondary)',
+              color: 'var(--text-primary)',
+              border: '1px solid var(--border-color)',
               borderRadius: 4,
-              outline: "none",
+              outline: 'none',
             }}
           >
             {WINDOW_OPTIONS.map((o) => (
-              <option key={o.value} value={o.value} style={{ background: "var(--bg-secondary)", color: "var(--text-primary)" }}>
+              <option
+                key={o.value}
+                value={o.value}
+                style={{ background: 'var(--bg-secondary)', color: 'var(--text-primary)' }}
+              >
                 {o.label}
               </option>
             ))}
@@ -416,18 +436,24 @@ const tiles = MODE_TILES.map((t) => {
         </div>
 
         <div
-          style={{ marginLeft: "auto", fontSize: 9, color: "var(--text-muted)" }}
-          title={filtersActive ? "Based on the active DX Cluster feed (filters active)" : "Based on the active DX Cluster feed"}
+          style={{ marginLeft: 'auto', fontSize: 9, color: 'var(--text-muted)' }}
+          title={
+            filtersActive
+              ? 'Based on the active DX Cluster feed (filters active)'
+              : 'Based on the active DX Cluster feed'
+          }
         >
-          DX Cluster{filtersActive ? " (filtered)" : ""}
+          DX Cluster{filtersActive ? ' (filtered)' : ''}
         </div>
       </div>
 
       {/* Mode tiles */}
       <div style={{ marginBottom: 8 }}>
-        <div style={{ display: "flex", justifyContent: "space-between", alignItems: "center", marginBottom: 6 }}>
-          <div style={{ fontSize: 10, color: "var(--text-muted)", letterSpacing: "0.04em", fontWeight: 700 }}>MODE ACTIVITY</div>
-          <div style={{ fontSize: 9, color: "var(--text-muted)" }}>(click to filter)</div>
+        <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: 6 }}>
+          <div style={{ fontSize: 10, color: 'var(--text-muted)', letterSpacing: '0.04em', fontWeight: 700 }}>
+            MODE ACTIVITY
+          </div>
+          <div style={{ fontSize: 9, color: 'var(--text-muted)' }}>(click to filter)</div>
         </div>
 
         {/* Pulse animation for selected mode */}
@@ -448,16 +474,16 @@ const tiles = MODE_TILES.map((t) => {
           }
         `}</style>
 
-        <div style={{ display: "grid", gridTemplateColumns: "repeat(4, minmax(0, 1fr))", gap: 6 }}>
+        <div style={{ display: 'grid', gridTemplateColumns: 'repeat(4, minmax(0, 1fr))', gap: 6 }}>
           {modeTiles.map((m) => {
             const isSelected = m.value === mode;
             const st = m.filtered ? filteredStyle() : heatStyle(m.heat.key);
 
             const tipText =
-              m.value === "ALL"
-                ? (m.tooltip || "")
+              m.value === 'ALL'
+                ? m.tooltip || ''
                 : m.filtered
-                  ? "Filtered out by DX Cluster mode filters"
+                  ? 'Filtered out by DX Cluster mode filters'
                   : `spots: ${m.count}, unique: ${m.uniq} • ${m.heat.label}`;
 
             return (
@@ -469,15 +495,15 @@ const tiles = MODE_TILES.map((t) => {
                 style={{
                   ...st,
                   borderRadius: 6,
-                  padding: "6px 7px",
-                  cursor: "pointer",
-                  userSelect: "none",
-                  outline: "none",
-                  animation: isSelected ? "ohcPulseRing 1.4s ease-in-out infinite" : "none",
+                  padding: '6px 7px',
+                  cursor: 'pointer',
+                  userSelect: 'none',
+                  outline: 'none',
+                  animation: isSelected ? 'ohcPulseRing 1.4s ease-in-out infinite' : 'none',
                 }}
               >
-                <div style={{ display: "flex", flexDirection: "column", alignItems: "center", gap: 2, minWidth: 0 }}>
-                  <div style={{ fontSize: 12, fontWeight: 800, textAlign: "center", whiteSpace: "nowrap" }}>
+                <div style={{ display: 'flex', flexDirection: 'column', alignItems: 'center', gap: 2, minWidth: 0 }}>
+                  <div style={{ fontSize: 12, fontWeight: 800, textAlign: 'center', whiteSpace: 'nowrap' }}>
                     {m.label}
                   </div>
 
@@ -485,15 +511,15 @@ const tiles = MODE_TILES.map((t) => {
                     style={{
                       fontSize: 10,
                       fontWeight: 700,
-                      letterSpacing: "0.03em",
-                      textAlign: "center",
-                      whiteSpace: "nowrap",
-                      overflow: "hidden",
-                      textOverflow: "ellipsis",
-                      width: "100%",
+                      letterSpacing: '0.03em',
+                      textAlign: 'center',
+                      whiteSpace: 'nowrap',
+                      overflow: 'hidden',
+                      textOverflow: 'ellipsis',
+                      width: '100%',
                     }}
                   >
-                    {m.filtered ? "FILTERED" : m.heat.label}
+                    {m.filtered ? 'FILTERED' : m.heat.label}
                   </div>
                 </div>
               </div>
@@ -502,9 +528,9 @@ const tiles = MODE_TILES.map((t) => {
         </div>
       </div>
 
-{/* Bands grid */}
-      <div style={{ overflow: "auto", paddingRight: 4 }}>
-        <div style={{ display: "grid", gridTemplateColumns: "repeat(4, minmax(0, 1fr))", gap: 6 }}>
+      {/* Bands grid */}
+      <div style={{ overflow: 'auto', paddingRight: 4 }}>
+        <div style={{ display: 'grid', gridTemplateColumns: 'repeat(4, minmax(0, 1fr))', gap: 6 }}>
           {bands.map((b) => {
             const st = b.filtered ? filteredStyle() : activityStyle(b.activity);
 
@@ -514,53 +540,52 @@ const tiles = MODE_TILES.map((t) => {
                 style={{
                   ...st,
                   borderRadius: 6,
-                  padding: "6px 7px",
+                  padding: '6px 7px',
                   minHeight: 40,
-                  display: "flex",
-                  flexDirection: "column",
-                  justifyContent: "space-between",
+                  display: 'flex',
+                  flexDirection: 'column',
+                  justifyContent: 'space-between',
                 }}
                 onMouseMove={(e) =>
                   setTip({
                     x: e.clientX,
                     y: e.clientY,
                     text: b.filtered
-                      ? "Filtered out by DX Cluster band filters"
+                      ? 'Filtered out by DX Cluster band filters'
                       : `status: ${b.label} • spots: ${b.count}, unique: ${b.uniques}`,
                   })
                 }
                 onMouseLeave={() => setTip(null)}
               >
-                <div style={{ display: "flex", justifyContent: "space-between", alignItems: "baseline" }}>
+                <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'baseline' }}>
                   <div style={{ fontSize: 12, fontWeight: 800 }}>{b.band}</div>
-                  <div style={{ fontSize: 11, opacity: 0.9 }}>{b.filtered ? "" : trendGlyph(b.trend)}</div>
+                  <div style={{ fontSize: 11, opacity: 0.9 }}>{b.filtered ? '' : trendGlyph(b.trend)}</div>
                 </div>
 
-                <div style={{ display: "flex", flexDirection: "column", alignItems: "center", gap: 2, minWidth: 0 }}>
+                <div style={{ display: 'flex', flexDirection: 'column', alignItems: 'center', gap: 2, minWidth: 0 }}>
                   <div
                     style={{
                       fontSize: 10,
                       fontWeight: 700,
-                      letterSpacing: "0.03em",
-                      textAlign: "center",
-                      whiteSpace: "nowrap",
-                      overflow: "hidden",
-                      textOverflow: "ellipsis",
-                      width: "100%",
+                      letterSpacing: '0.03em',
+                      textAlign: 'center',
+                      whiteSpace: 'nowrap',
+                      overflow: 'hidden',
+                      textOverflow: 'ellipsis',
+                      width: '100%',
                     }}
                     title={b.label} // full word on hover
                   >
                     {compactStatusLabel(b.label)}
                   </div>
-
                 </div>
               </div>
             );
           })}
         </div>
 
-        <div style={{ marginTop: 8, fontSize: 9, color: "var(--text-muted)" }}>
-          {mode === "ALL"
+        <div style={{ marginTop: 8, fontSize: 9, color: 'var(--text-muted)' }}>
+          {mode === 'ALL'
             ? `Showing all included modes from DX Cluster spots over the last ${windowMinutes} minutes.`
             : `Showing ${mode} spots from DX Cluster over the last ${windowMinutes} minutes.`}
         </div>
@@ -591,26 +616,26 @@ const tiles = MODE_TILES.map((t) => {
               // If below would go off the bottom, try above instead
               if (placeBelow) {
                 const belowBottom = y + h + 24;
-                if (belowBottom > (vh - MARGIN) && aboveTop >= MARGIN) placeBelow = false;
+                if (belowBottom > vh - MARGIN && aboveTop >= MARGIN) placeBelow = false;
               }
 
               return (
                 <div
                   ref={tipRef}
                   style={{
-                    position: "fixed",
+                    position: 'fixed',
                     left: x,
                     top: y,
-                    transform: placeBelow ? "translate(-50%, 14px)" : "translate(-50%, -120%)",
-                    background: "rgba(0,0,0,0.9)",
-                    color: "#e5e7eb",
-                    padding: "4px 8px",
+                    transform: placeBelow ? 'translate(-50%, 14px)' : 'translate(-50%, -120%)',
+                    background: 'rgba(0,0,0,0.9)',
+                    color: '#e5e7eb',
+                    padding: '4px 8px',
                     fontSize: 11,
                     borderRadius: 4,
-                    whiteSpace: "pre",
+                    whiteSpace: 'pre',
                     zIndex: 2147483647,
-                    pointerEvents: "none",
-                    boxShadow: "0 2px 6px rgba(0,0,0,0.4)",
+                    pointerEvents: 'none',
+                    boxShadow: '0 2px 6px rgba(0,0,0,0.4)',
                     maxWidth: 360,
                   }}
                 >
@@ -618,7 +643,7 @@ const tiles = MODE_TILES.map((t) => {
                 </div>
               );
             })(),
-            document.body
+            document.body,
           )
         : null}
     </div>
diff --git a/src/components/CallsignLink.jsx b/src/components/CallsignLink.jsx
index f9ec7750..b057c1fa 100644
--- a/src/components/CallsignLink.jsx
+++ b/src/components/CallsignLink.jsx
@@ -1,9 +1,9 @@
 /**
  * CallsignLink — clickable callsign that opens QRZ.com
- * 
+ *
  * Usage:
  *   <CallsignLink call="K1ABC" color="#fff" fontWeight="700" />
- * 
+ *
  * Reads the global toggle from localStorage (ohc_qrz_links).
  * When enabled, clicking opens https://www.qrz.com/db/CALLSIGN in a new tab.
  */
@@ -12,15 +12,15 @@ import { createContext, useContext, useState, useCallback, useEffect } from 'rea
 // ── Extract base callsign from decorated/portable calls ──
 // 5Z4/OZ6ABL → OZ6ABL, UA1TAN/M → UA1TAN, W1ABC/6 → W1ABC
 // Picks the segment that looks most like a home callsign.
-const MODIFIERS = new Set(['M','P','QRP','MM','AM','R','T','B','BCN','LH','A','E','J','AG','AE','KT']);
+const MODIFIERS = new Set(['M', 'P', 'QRP', 'MM', 'AM', 'R', 'T', 'B', 'BCN', 'LH', 'A', 'E', 'J', 'AG', 'AE', 'KT']);
 function extractBaseCall(raw) {
   if (!raw || !raw.includes('/')) return raw || '';
   const parts = raw.toUpperCase().split('/');
-  const candidates = parts.filter(p => p && !MODIFIERS.has(p) && !/^\d$/.test(p));
+  const candidates = parts.filter((p) => p && !MODIFIERS.has(p) && !/^\d$/.test(p));
   if (candidates.length === 0) return parts[0] || raw;
   if (candidates.length === 1) return candidates[0];
   const pat = /^[A-Z]{1,3}\d{1,4}[A-Z]{1,4}$/;
-  const full = candidates.filter(c => pat.test(c));
+  const full = candidates.filter((c) => pat.test(c));
   if (full.length === 1) return full[0];
   candidates.sort((a, b) => b.length - a.length);
   return candidates[0];
@@ -31,22 +31,24 @@ const QRZContext = createContext({ enabled: true, toggle: () => {} });
 
 export function QRZProvider({ children }) {
   const [enabled, setEnabled] = useState(() => {
-    try { return localStorage.getItem('ohc_qrz_links') !== 'false'; } catch { return true; }
+    try {
+      return localStorage.getItem('ohc_qrz_links') !== 'false';
+    } catch {
+      return true;
+    }
   });
 
   const toggle = useCallback(() => {
-    setEnabled(prev => {
+    setEnabled((prev) => {
       const next = !prev;
-      try { localStorage.setItem('ohc_qrz_links', String(next)); } catch {}
+      try {
+        localStorage.setItem('ohc_qrz_links', String(next));
+      } catch {}
       return next;
     });
   }, []);
 
-  return (
-    <QRZContext.Provider value={{ enabled, toggle }}>
-      {children}
-    </QRZContext.Provider>
-  );
+  return <QRZContext.Provider value={{ enabled, toggle }}>{children}</QRZContext.Provider>;
 }
 
 export function useQRZ() {
@@ -58,7 +60,10 @@ export function QRZToggle({ style }) {
   const { enabled, toggle } = useQRZ();
   return (
     <span
-      onClick={(e) => { e.stopPropagation(); toggle(); }}
+      onClick={(e) => {
+        e.stopPropagation();
+        toggle();
+      }}
       title={enabled ? 'Click callsigns to open QRZ.com (ON)' : 'QRZ callsign links disabled (OFF)'}
       style={{
         cursor: 'pointer',
@@ -66,9 +71,11 @@ export function QRZToggle({ style }) {
         opacity: enabled ? 1 : 0.4,
         userSelect: 'none',
         transition: 'opacity 0.2s',
-        ...style
+        ...style,
       }}
-    >🔍</span>
+    >
+      🔍
+    </span>
   );
 }
 
@@ -79,7 +86,7 @@ export default function CallsignLink({
   fontWeight = 'inherit',
   fontSize = 'inherit',
   style = {},
-  children
+  children,
 }) {
   const { enabled } = useQRZ();
 
@@ -104,10 +111,14 @@ export default function CallsignLink({
         cursor: enabled ? 'pointer' : 'inherit',
         borderBottom: enabled ? '1px dotted rgba(255,255,255,0.15)' : 'none',
         transition: 'color 0.15s',
-        ...style
+        ...style,
+      }}
+      onMouseEnter={(e) => {
+        if (enabled) e.target.style.color = 'var(--accent-cyan)';
+      }}
+      onMouseLeave={(e) => {
+        if (enabled) e.target.style.color = color;
       }}
-      onMouseEnter={(e) => { if (enabled) e.target.style.color = 'var(--accent-cyan)'; }}
-      onMouseLeave={(e) => { if (enabled) e.target.style.color = color; }}
       title={enabled ? `Look up ${call} on QRZ.com` : call}
     >
       {children || call}
@@ -122,16 +133,18 @@ let _mapHandlerInstalled = false;
 export function setupMapQRZHandler() {
   if (_mapHandlerInstalled) return;
   _mapHandlerInstalled = true;
-  
+
   document.addEventListener('click', (e) => {
     const el = e.target.closest('[data-qrz-call]');
     if (!el) return;
-    
+
     // Check if QRZ links are enabled
     let enabled = true;
-    try { enabled = localStorage.getItem('ohc_qrz_links') !== 'false'; } catch {}
+    try {
+      enabled = localStorage.getItem('ohc_qrz_links') !== 'false';
+    } catch {}
     if (!enabled) return;
-    
+
     const call = el.getAttribute('data-qrz-call');
     if (call) {
       const baseCall = extractBaseCall(call);
diff --git a/src/components/ContestPanel.jsx b/src/components/ContestPanel.jsx
index ce5cbaa4..785f9f56 100644
--- a/src/components/ContestPanel.jsx
+++ b/src/components/ContestPanel.jsx
@@ -2,8 +2,8 @@
  * ContestPanel Component
  * Displays upcoming and active contests with live indicators
  */
-import { useState } from "react";
-import { useTranslation } from "react-i18next";
+import { useState } from 'react';
+import { useTranslation } from 'react-i18next';
 
 export const ContestPanel = ({ data, loading }) => {
   const { t, i18n } = useTranslation();
@@ -11,7 +11,7 @@ export const ContestPanel = ({ data, loading }) => {
   // Switchable option: open WA7BNM contest page on click
   const [openContestLinks, setOpenContestLinks] = useState(() => {
     try {
-      return localStorage.getItem("ohc_contest_links") !== "false";
+      return localStorage.getItem('ohc_contest_links') !== 'false';
     } catch {
       return true;
     }
@@ -21,7 +21,7 @@ export const ContestPanel = ({ data, loading }) => {
     const next = !openContestLinks;
     setOpenContestLinks(next);
     try {
-      localStorage.setItem("ohc_contest_links", String(next));
+      localStorage.setItem('ohc_contest_links', String(next));
     } catch {}
   };
 
@@ -29,54 +29,49 @@ export const ContestPanel = ({ data, loading }) => {
   const getContestUrl = (contest) => {
     if (contest.url) return contest.url;
     // Fallback: link to WA7BNM current contest listing
-    return "https://www.contestcalendar.com/fwcont.php";
+    return 'https://www.contestcalendar.com/fwcont.php';
   };
 
   const handleContestClick = (contest, e) => {
     if (!openContestLinks) return;
     e.stopPropagation();
-    window.open(getContestUrl(contest), "_blank", "noopener,noreferrer");
+    window.open(getContestUrl(contest), '_blank', 'noopener,noreferrer');
   };
 
   const getModeColor = (mode) => {
     switch (mode) {
-      case "CW":
-        return "var(--accent-cyan)";
-      case "SSB":
-        return "var(--accent-amber)";
-      case "RTTY":
-        return "var(--accent-purple)";
-      case "FT8":
-      case "FT4":
-        return "var(--accent-green)";
-      case "Mixed":
-        return "var(--text-secondary)";
+      case 'CW':
+        return 'var(--accent-cyan)';
+      case 'SSB':
+        return 'var(--accent-amber)';
+      case 'RTTY':
+        return 'var(--accent-purple)';
+      case 'FT8':
+      case 'FT4':
+        return 'var(--accent-green)';
+      case 'Mixed':
+        return 'var(--text-secondary)';
       default:
-        return "var(--text-secondary)";
+        return 'var(--text-secondary)';
     }
   };
 
   const formatDate = (dateStr) => {
-    if (!dateStr) return "";
+    if (!dateStr) return '';
     const date = new Date(dateStr);
-    const language = (i18n.resolvedLanguage || i18n.language || "en")
-      .split("-")[0]
-      .toLowerCase();
+    const language = (i18n.resolvedLanguage || i18n.language || 'en').split('-')[0].toLowerCase();
 
-    if (language === "de") {
-      const parts = new Intl.DateTimeFormat("de-DE", {
-        day: "numeric",
-        month: "short",
+    if (language === 'de') {
+      const parts = new Intl.DateTimeFormat('de-DE', {
+        day: 'numeric',
+        month: 'short',
       }).formatToParts(date);
-      const day = parts.find((p) => p.type === "day")?.value || "";
-      const month = (parts.find((p) => p.type === "month")?.value || "").replace(
-        /\.$/,
-        "",
-      );
+      const day = parts.find((p) => p.type === 'day')?.value || '';
+      const month = (parts.find((p) => p.type === 'month')?.value || '').replace(/\.$/, '');
       return `${day}. ${month}`;
     }
 
-    return date.toLocaleDateString("en-US", { month: "short", day: "numeric" });
+    return date.toLocaleDateString('en-US', { month: 'short', day: 'numeric' });
   };
 
   // Check if contest is live (happening now)
@@ -108,21 +103,19 @@ export const ContestPanel = ({ data, loading }) => {
     if (now >= start && now <= end) {
       // Contest is live - show time remaining
       const hoursLeft = Math.floor((end - now) / (1000 * 60 * 60));
-      const minsLeft = Math.floor(
-        ((end - now) % (1000 * 60 * 60)) / (1000 * 60),
-      );
+      const minsLeft = Math.floor(((end - now) % (1000 * 60 * 60)) / (1000 * 60));
       if (hoursLeft > 0) {
-        return t("contest.panel.time.live.hoursMinutes", {
+        return t('contest.panel.time.live.hoursMinutes', {
           hours: hoursLeft,
           minutes: minsLeft,
         });
       }
-      return t("contest.panel.time.live.minutes", { minutes: minsLeft });
+      return t('contest.panel.time.live.minutes', { minutes: minsLeft });
     } else if (now < start) {
       // Contest hasn't started
       const hoursUntil = Math.floor((start - now) / (1000 * 60 * 60));
       if (hoursUntil < 24) {
-        return t("contest.panel.time.startsIn", { hours: hoursUntil });
+        return t('contest.panel.time.startsIn', { hours: hoursUntil });
       }
       return formatDate(contest.start);
     }
@@ -153,54 +146,50 @@ export const ContestPanel = ({ data, loading }) => {
     <div
       className="panel"
       style={{
-        padding: "8px",
-        height: "100%",
-        display: "flex",
-        flexDirection: "column",
+        padding: '8px',
+        height: '100%',
+        display: 'flex',
+        flexDirection: 'column',
       }}
     >
       <div
         style={{
-          marginBottom: "6px",
-          fontSize: "11px",
-          display: "flex",
-          justifyContent: "space-between",
-          alignItems: "center",
-          color: "var(--accent-primary)",
-          fontWeight: "700",
+          marginBottom: '6px',
+          fontSize: '11px',
+          display: 'flex',
+          justifyContent: 'space-between',
+          alignItems: 'center',
+          color: 'var(--accent-primary)',
+          fontWeight: '700',
         }}
       >
-        <span>{t("contest.panel.title")}</span>
-        <div style={{ display: "flex", alignItems: "center", gap: "6px" }}>
+        <span>{t('contest.panel.title')}</span>
+        <div style={{ display: 'flex', alignItems: 'center', gap: '6px' }}>
           {liveCount > 0 && (
             <span
               style={{
-                background: "rgba(239, 68, 68, 0.3)",
-                color: "#ef4444",
-                padding: "2px 6px",
-                borderRadius: "4px",
-                fontSize: "9px",
-                fontWeight: "700",
-                border: "1px solid #ef4444",
+                background: 'rgba(239, 68, 68, 0.3)',
+                color: '#ef4444',
+                padding: '2px 6px',
+                borderRadius: '4px',
+                fontSize: '9px',
+                fontWeight: '700',
+                border: '1px solid #ef4444',
               }}
             >
-              <span>{t("contest.panel.live", { liveCount })}</span>
+              <span>{t('contest.panel.live', { liveCount })}</span>
             </span>
           )}
           {/* Toggle: open contest links in WA7BNM */}
           <span
             onClick={toggleContestLinks}
-            title={
-              openContestLinks
-                ? "Click contest names to open WA7BNM (ON)"
-                : "Contest links disabled (OFF)"
-            }
+            title={openContestLinks ? 'Click contest names to open WA7BNM (ON)' : 'Contest links disabled (OFF)'}
             style={{
-              cursor: "pointer",
-              fontSize: "11px",
+              cursor: 'pointer',
+              fontSize: '11px',
               opacity: openContestLinks ? 1 : 0.4,
-              userSelect: "none",
-              transition: "opacity 0.2s",
+              userSelect: 'none',
+              transition: 'opacity 0.2s',
             }}
           >
             🔗
@@ -208,13 +197,13 @@ export const ContestPanel = ({ data, loading }) => {
         </div>
       </div>
 
-      <div style={{ flex: 1, overflowY: "auto" }}>
+      <div style={{ flex: 1, overflowY: 'auto' }}>
         {loading ? (
           <div
             style={{
-              display: "flex",
-              justifyContent: "center",
-              padding: "10px",
+              display: 'flex',
+              justifyContent: 'center',
+              padding: '10px',
             }}
           >
             <div className="loading-spinner" />
@@ -222,8 +211,8 @@ export const ContestPanel = ({ data, loading }) => {
         ) : sortedContests.length > 0 ? (
           <div
             style={{
-              fontSize: "10px",
-              fontFamily: "JetBrains Mono, monospace",
+              fontSize: '10px',
+              fontFamily: 'JetBrains Mono, monospace',
             }}
           >
             {sortedContests.map((contest, i) => {
@@ -234,95 +223,73 @@ export const ContestPanel = ({ data, loading }) => {
                 <div
                   key={`${contest.name}-${i}`}
                   style={{
-                    padding: "5px 6px",
-                    marginBottom: "3px",
-                    borderRadius: "4px",
+                    padding: '5px 6px',
+                    marginBottom: '3px',
+                    borderRadius: '4px',
                     background: live
-                      ? "rgba(239, 68, 68, 0.15)"
+                      ? 'rgba(239, 68, 68, 0.15)'
                       : soon
-                        ? "rgba(251, 191, 36, 0.1)"
-                        : "rgba(255,255,255,0.03)",
-                    border: live
-                      ? "1px solid rgba(239, 68, 68, 0.4)"
-                      : "1px solid transparent",
+                        ? 'rgba(251, 191, 36, 0.1)'
+                        : 'rgba(255,255,255,0.03)',
+                    border: live ? '1px solid rgba(239, 68, 68, 0.4)' : '1px solid transparent',
                   }}
                 >
                   <div
                     style={{
-                      display: "flex",
-                      alignItems: "center",
-                      gap: "6px",
+                      display: 'flex',
+                      alignItems: 'center',
+                      gap: '6px',
                     }}
                   >
                     {live && (
                       <span
                         style={{
-                          color: "#ef4444",
-                          fontSize: "8px",
-                          animation: "pulse 1.5s infinite",
+                          color: '#ef4444',
+                          fontSize: '8px',
+                          animation: 'pulse 1.5s infinite',
                         }}
                       >
                         ●
                       </span>
                     )}
-                    {soon && !live && (
-                      <span style={{ color: "#fbbf24", fontSize: "8px" }}>
-                        ◐
-                      </span>
-                    )}
+                    {soon && !live && <span style={{ color: '#fbbf24', fontSize: '8px' }}>◐</span>}
                     <span
                       onClick={(e) => handleContestClick(contest, e)}
                       style={{
-                        color: live ? "#ef4444" : "var(--text-primary)",
-                        fontWeight: "600",
+                        color: live ? '#ef4444' : 'var(--text-primary)',
+                        fontWeight: '600',
                         flex: 1,
-                        whiteSpace: "nowrap",
-                        overflow: "hidden",
-                        textOverflow: "ellipsis",
-                        cursor: openContestLinks ? "pointer" : "default",
-                        textDecoration: openContestLinks ? "none" : "none",
-                        borderBottom: openContestLinks
-                          ? "1px dotted rgba(255,255,255,0.2)"
-                          : "none",
-                        transition: "color 0.15s",
+                        whiteSpace: 'nowrap',
+                        overflow: 'hidden',
+                        textOverflow: 'ellipsis',
+                        cursor: openContestLinks ? 'pointer' : 'default',
+                        textDecoration: openContestLinks ? 'none' : 'none',
+                        borderBottom: openContestLinks ? '1px dotted rgba(255,255,255,0.2)' : 'none',
+                        transition: 'color 0.15s',
                       }}
                       onMouseEnter={(e) => {
-                        if (openContestLinks)
-                          e.target.style.color = "var(--accent-cyan)";
+                        if (openContestLinks) e.target.style.color = 'var(--accent-cyan)';
                       }}
                       onMouseLeave={(e) => {
-                        if (openContestLinks)
-                          e.target.style.color = live
-                            ? "#ef4444"
-                            : "var(--text-primary)";
+                        if (openContestLinks) e.target.style.color = live ? '#ef4444' : 'var(--text-primary)';
                       }}
-                      title={
-                        openContestLinks
-                          ? `Open ${contest.name} on WA7BNM Contest Calendar`
-                          : contest.name
-                      }
+                      title={openContestLinks ? `Open ${contest.name} on WA7BNM Contest Calendar` : contest.name}
                     >
                       {contest.name}
                     </span>
                   </div>
                   <div
                     style={{
-                      display: "flex",
-                      justifyContent: "space-between",
-                      marginTop: "3px",
+                      display: 'flex',
+                      justifyContent: 'space-between',
+                      marginTop: '3px',
                     }}
                   >
-                    <span style={{ color: getModeColor(contest.mode) }}>
-                      {contest.mode}
-                    </span>
+                    <span style={{ color: getModeColor(contest.mode) }}>{contest.mode}</span>
                     <span
                       style={{
-                        color: live
-                          ? "#ef4444"
-                          : soon
-                            ? "#fbbf24"
-                            : "var(--text-muted)",
-                        fontWeight: live ? "600" : "400",
+                        color: live ? '#ef4444' : soon ? '#fbbf24' : 'var(--text-muted)',
+                        fontWeight: live ? '600' : '400',
                       }}
                     >
                       {getTimeInfo(contest)}
@@ -335,13 +302,13 @@ export const ContestPanel = ({ data, loading }) => {
         ) : (
           <div
             style={{
-              textAlign: "center",
-              color: "var(--text-muted)",
-              padding: "10px",
-              fontSize: "11px",
+              textAlign: 'center',
+              color: 'var(--text-muted)',
+              padding: '10px',
+              fontSize: '11px',
             }}
           >
-            {t("contest.panel.no.contests")}
+            {t('contest.panel.no.contests')}
           </div>
         )}
       </div>
@@ -349,10 +316,10 @@ export const ContestPanel = ({ data, loading }) => {
       {/* Contest Calendar Credit */}
       <div
         style={{
-          marginTop: "4px",
-          paddingTop: "4px",
-          borderTop: "1px solid var(--border-color)",
-          textAlign: "right",
+          marginTop: '4px',
+          paddingTop: '4px',
+          borderTop: '1px solid var(--border-color)',
+          textAlign: 'right',
         }}
       >
         <a
@@ -360,12 +327,12 @@ export const ContestPanel = ({ data, loading }) => {
           target="_blank"
           rel="noopener noreferrer"
           style={{
-            fontSize: "9px",
-            color: "var(--text-muted)",
-            textDecoration: "none",
+            fontSize: '9px',
+            color: 'var(--text-muted)',
+            textDecoration: 'none',
           }}
         >
-          {t("contest.panel.calendar")}
+          {t('contest.panel.calendar')}
         </a>
       </div>
     </div>
diff --git a/src/components/DXClusterPanel.jsx b/src/components/DXClusterPanel.jsx
index 49da642f..396524f2 100644
--- a/src/components/DXClusterPanel.jsx
+++ b/src/components/DXClusterPanel.jsx
@@ -34,19 +34,10 @@ export const DXClusterPanel = ({
 
     const hh = parseInt(m[1], 10);
     const mm = parseInt(m[2], 10);
-    if (!Number.isFinite(hh) || !Number.isFinite(mm) || hh > 23 || mm > 59)
-      return null;
+    if (!Number.isFinite(hh) || !Number.isFinite(mm) || hh > 23 || mm > 59) return null;
 
     const now = new Date();
-    let ts = Date.UTC(
-      now.getUTCFullYear(),
-      now.getUTCMonth(),
-      now.getUTCDate(),
-      hh,
-      mm,
-      0,
-      0,
-    );
+    let ts = Date.UTC(now.getUTCFullYear(), now.getUTCMonth(), now.getUTCDate(), hh, mm, 0, 0);
 
     // Handle day rollover near UTC midnight.
     if (ts - Date.now() > 5 * 60 * 1000) {
@@ -93,7 +84,7 @@ export const DXClusterPanel = ({
 
   return (
     <div
-      className='panel'
+      className="panel"
       style={{
         padding: '10px',
         display: 'flex',
@@ -115,14 +106,9 @@ export const DXClusterPanel = ({
         }}
       >
         <span>
-          <IconGlobe
-            size={12}
-            style={{ verticalAlign: 'middle', marginRight: '4px' }}
-          />
+          <IconGlobe size={12} style={{ verticalAlign: 'middle', marginRight: '4px' }} />
           {t('dxClusterPanel.title')}{' '}
-          <span style={{ color: 'var(--accent-green)', fontSize: '10px' }}>
-            ● {t('dxClusterPanel.live')}
-          </span>
+          <span style={{ color: 'var(--accent-green)', fontSize: '10px' }}>● {t('dxClusterPanel.live')}</span>
         </span>
         <div style={{ display: 'flex', alignItems: 'center', gap: '6px' }}>
           <span style={{ fontSize: '9px', color: 'var(--text-muted)' }}>
@@ -132,10 +118,7 @@ export const DXClusterPanel = ({
             onClick={onOpenFilters}
             title={t('dxClusterPanel.filterTooltip')}
             style={{
-              background:
-                filterCount > 0
-                  ? 'rgba(255, 170, 0, 0.3)'
-                  : 'rgba(100, 100, 100, 0.3)',
+              background: filterCount > 0 ? 'rgba(255, 170, 0, 0.3)' : 'rgba(100, 100, 100, 0.3)',
               border: `1px solid ${filterCount > 0 ? '#ffaa00' : '#666'}`,
               color: filterCount > 0 ? '#ffaa00' : '#888',
               padding: '2px 8px',
@@ -145,23 +128,14 @@ export const DXClusterPanel = ({
               cursor: 'pointer',
             }}
           >
-            <IconSearch
-              size={10}
-              style={{ verticalAlign: 'middle', marginRight: '3px' }}
-            />
+            <IconSearch size={10} style={{ verticalAlign: 'middle', marginRight: '3px' }} />
             {t('dxClusterPanel.filtersButton')}
           </button>
           <button
             onClick={onToggleMap}
-            title={
-              showOnMap
-                ? t('dxClusterPanel.mapToggleHide')
-                : t('dxClusterPanel.mapToggleShow')
-            }
+            title={showOnMap ? t('dxClusterPanel.mapToggleHide') : t('dxClusterPanel.mapToggleShow')}
             style={{
-              background: showOnMap
-                ? 'rgba(68, 136, 255, 0.3)'
-                : 'rgba(100, 100, 100, 0.3)',
+              background: showOnMap ? 'rgba(68, 136, 255, 0.3)' : 'rgba(100, 100, 100, 0.3)',
               border: `1px solid ${showOnMap ? '#4488ff' : '#666'}`,
               color: showOnMap ? '#4488ff' : '#888',
               padding: '2px 8px',
@@ -171,13 +145,8 @@ export const DXClusterPanel = ({
               cursor: 'pointer',
             }}
           >
-            <IconMap
-              size={10}
-              style={{ verticalAlign: 'middle', marginRight: '3px' }}
-            />
-            {showOnMap
-              ? t('dxClusterPanel.mapToggleOn')
-              : t('dxClusterPanel.mapToggleOff')}
+            <IconMap size={10} style={{ verticalAlign: 'middle', marginRight: '3px' }} />
+            {showOnMap ? t('dxClusterPanel.mapToggleOn') : t('dxClusterPanel.mapToggleOff')}
           </button>
         </div>
       </div>
@@ -185,7 +154,7 @@ export const DXClusterPanel = ({
       {/* Quick search */}
       <div style={{ display: 'flex', gap: '4px', marginBottom: '6px' }}>
         <input
-          type='text'
+          type="text"
           placeholder={t('dxClusterPanel.quickSearch')}
           value={filters?.callsign || ''}
           onChange={(e) =>
@@ -209,10 +178,8 @@ export const DXClusterPanel = ({
 
       {/* Spots list */}
       {loading ? (
-        <div
-          style={{ display: 'flex', justifyContent: 'center', padding: '20px' }}
-        >
-          <div className='loading-spinner' />
+        <div style={{ display: 'flex', justifyContent: 'center', padding: '20px' }}>
+          <div className="loading-spinner" />
         </div>
       ) : spots.length === 0 ? (
         <div
@@ -223,9 +190,7 @@ export const DXClusterPanel = ({
             fontSize: '12px',
           }}
         >
-          {filterCount > 0
-            ? t('dxClusterPanel.noSpotsFiltered')
-            : t('dxClusterPanel.noSpots')}
+          {filterCount > 0 ? t('dxClusterPanel.noSpotsFiltered') : t('dxClusterPanel.noSpots')}
         </div>
       ) : (
         <div
@@ -279,9 +244,7 @@ export const DXClusterPanel = ({
                       : 'transparent',
                   cursor: 'pointer',
                   transition: 'background 0.15s',
-                  borderLeft: isHovered
-                    ? '2px solid #4488ff'
-                    : '2px solid transparent',
+                  borderLeft: isHovered ? '2px solid #4488ff' : '2px solid transparent',
                 }}
               >
                 <div style={{ color, fontWeight: '600' }}>{freqDisplay}</div>
@@ -294,11 +257,7 @@ export const DXClusterPanel = ({
                     whiteSpace: 'nowrap',
                   }}
                 >
-                  <CallsignLink
-                    call={spot.call}
-                    color='var(--text-primary)'
-                    fontWeight='700'
-                  />
+                  <CallsignLink call={spot.call} color="var(--text-primary)" fontWeight="700" />
                 </div>
                 <div
                   style={{
@@ -310,12 +269,7 @@ export const DXClusterPanel = ({
                     alignSelf: 'center',
                   }}
                 >
-                  de{' '}
-                  <CallsignLink
-                    call={spot.spotter || '?'}
-                    color='var(--text-muted)'
-                    fontSize='10px'
-                  />
+                  de <CallsignLink call={spot.spotter || '?'} color="var(--text-muted)" fontSize="10px" />
                 </div>
                 <div
                   style={{
diff --git a/src/components/DXFilterManager.jsx b/src/components/DXFilterManager.jsx
index 17c8df55..e6d37f38 100644
--- a/src/components/DXFilterManager.jsx
+++ b/src/components/DXFilterManager.jsx
@@ -9,7 +9,6 @@ export const DXFilterManager = ({ filters, onFilterChange, isOpen, onClose }) =>
   const [newWatchlistCall, setNewWatchlistCall] = useState('');
   const [newDXExcludeCall, setNewDXExcludeCall] = useState('');
   const [newDEExcludeCall, setNewDEExcludeCall] = useState('');
-  
 
   if (!isOpen) return null;
 
@@ -20,7 +19,7 @@ export const DXFilterManager = ({ filters, onFilterChange, isOpen, onClose }) =>
     { code: 'AF', name: 'Africa' },
     { code: 'AS', name: 'Asia' },
     { code: 'OC', name: 'Oceania' },
-    { code: 'AN', name: 'Antarctica' }
+    { code: 'AN', name: 'Antarctica' },
   ];
 
   const bands = ['160m', '80m', '60m', '40m', '30m', '20m', '17m', '15m', '12m', '11m', '10m', '6m', '2m', '70cm'];
@@ -29,9 +28,7 @@ export const DXFilterManager = ({ filters, onFilterChange, isOpen, onClose }) =>
   // noinspection DuplicatedCode
   const toggleArrayItem = (key, item) => {
     const current = filters[key] || [];
-    const newArray = current.includes(item)
-      ? current.filter(x => x !== item)
-      : [...current, item];
+    const newArray = current.includes(item) ? current.filter((x) => x !== item) : [...current, item];
     onFilterChange({ ...filters, [key]: newArray.length ? newArray : undefined });
   };
 
@@ -76,7 +73,7 @@ export const DXFilterManager = ({ filters, onFilterChange, isOpen, onClose }) =>
     fontSize: '13px',
     cursor: 'pointer',
     fontFamily: 'inherit',
-    fontWeight: active ? '600' : '400'
+    fontWeight: active ? '600' : '400',
   });
 
   const chipStyle = (selected) => ({
@@ -88,7 +85,7 @@ export const DXFilterManager = ({ filters, onFilterChange, isOpen, onClose }) =>
     fontSize: '12px',
     cursor: 'pointer',
     fontFamily: 'JetBrains Mono, monospace',
-    fontWeight: selected ? '600' : '400'
+    fontWeight: selected ? '600' : '400',
   });
 
   const zoneButtonStyle = (selected) => ({
@@ -104,7 +101,7 @@ export const DXFilterManager = ({ filters, onFilterChange, isOpen, onClose }) =>
     fontSize: '12px',
     cursor: 'pointer',
     fontFamily: 'JetBrains Mono, monospace',
-    fontWeight: selected ? '600' : '400'
+    fontWeight: selected ? '600' : '400',
   });
 
   const addToWatchlist = () => {
@@ -126,7 +123,7 @@ export const DXFilterManager = ({ filters, onFilterChange, isOpen, onClose }) =>
       setNewDXExcludeCall('');
     }
   };
-  
+
   const addToDEExcludeCalls = () => {
     if (newDEExcludeCall.trim()) {
       const current = filters?.excludeDECallList || [];
@@ -135,7 +132,7 @@ export const DXFilterManager = ({ filters, onFilterChange, isOpen, onClose }) =>
       }
       setNewDEExcludeCall('');
     }
-  };  
+  };
 
   const renderZonesTab = () => (
     <div>
@@ -148,7 +145,7 @@ export const DXFilterManager = ({ filters, onFilterChange, isOpen, onClose }) =>
           Shows spots FROM these continents reporting DX OUTSIDE these continents
         </div>
         <div style={{ display: 'flex', flexWrap: 'wrap', gap: '8px' }}>
-          {continents.map(c => (
+          {continents.map((c) => (
             <button
               key={c.code}
               onClick={() => toggleArrayItem('continents', c.code)}
@@ -163,14 +160,43 @@ export const DXFilterManager = ({ filters, onFilterChange, isOpen, onClose }) =>
       {/* CQ Zones */}
       <div style={{ marginBottom: '20px' }}>
         <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '10px' }}>
-          <span style={{ fontSize: '13px', fontWeight: '600', color: 'var(--text-primary)' }}>Spotter (DE) CQ Zones</span>
+          <span style={{ fontSize: '13px', fontWeight: '600', color: 'var(--text-primary)' }}>
+            Spotter (DE) CQ Zones
+          </span>
           <div style={{ display: 'flex', gap: '12px' }}>
-            <button onClick={() => selectAll('cqZones', Array.from({length: 40}, (_, i) => i + 1))} style={{ background: 'none', border: 'none', color: 'var(--accent-cyan)', fontSize: '12px', cursor: 'pointer' }}>Select All</button>
-            <button onClick={() => clearFilter('cqZones')} style={{ background: 'none', border: 'none', color: 'var(--accent-red)', fontSize: '12px', cursor: 'pointer' }}>Clear</button>
+            <button
+              onClick={() =>
+                selectAll(
+                  'cqZones',
+                  Array.from({ length: 40 }, (_, i) => i + 1),
+                )
+              }
+              style={{
+                background: 'none',
+                border: 'none',
+                color: 'var(--accent-cyan)',
+                fontSize: '12px',
+                cursor: 'pointer',
+              }}
+            >
+              Select All
+            </button>
+            <button
+              onClick={() => clearFilter('cqZones')}
+              style={{
+                background: 'none',
+                border: 'none',
+                color: 'var(--accent-red)',
+                fontSize: '12px',
+                cursor: 'pointer',
+              }}
+            >
+              Clear
+            </button>
           </div>
         </div>
         <div style={{ display: 'grid', gridTemplateColumns: 'repeat(15, 1fr)', gap: '4px' }}>
-          {Array.from({ length: 40 }, (_, i) => i + 1).map(zone => (
+          {Array.from({ length: 40 }, (_, i) => i + 1).map((zone) => (
             <button
               key={zone}
               onClick={() => toggleArrayItem('cqZones', zone)}
@@ -185,14 +211,43 @@ export const DXFilterManager = ({ filters, onFilterChange, isOpen, onClose }) =>
       {/* ITU Zones */}
       <div>
         <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '10px' }}>
-          <span style={{ fontSize: '13px', fontWeight: '600', color: 'var(--text-primary)' }}>Spotter (DE) ITU Zones</span>
+          <span style={{ fontSize: '13px', fontWeight: '600', color: 'var(--text-primary)' }}>
+            Spotter (DE) ITU Zones
+          </span>
           <div style={{ display: 'flex', gap: '12px' }}>
-            <button onClick={() => selectAll('ituZones', Array.from({length: 90}, (_, i) => i + 1))} style={{ background: 'none', border: 'none', color: 'var(--accent-cyan)', fontSize: '12px', cursor: 'pointer' }}>Select All</button>
-            <button onClick={() => clearFilter('ituZones')} style={{ background: 'none', border: 'none', color: 'var(--accent-red)', fontSize: '12px', cursor: 'pointer' }}>Clear</button>
+            <button
+              onClick={() =>
+                selectAll(
+                  'ituZones',
+                  Array.from({ length: 90 }, (_, i) => i + 1),
+                )
+              }
+              style={{
+                background: 'none',
+                border: 'none',
+                color: 'var(--accent-cyan)',
+                fontSize: '12px',
+                cursor: 'pointer',
+              }}
+            >
+              Select All
+            </button>
+            <button
+              onClick={() => clearFilter('ituZones')}
+              style={{
+                background: 'none',
+                border: 'none',
+                color: 'var(--accent-red)',
+                fontSize: '12px',
+                cursor: 'pointer',
+              }}
+            >
+              Clear
+            </button>
           </div>
         </div>
         <div style={{ display: 'grid', gridTemplateColumns: 'repeat(15, 1fr)', gap: '4px' }}>
-          {Array.from({ length: 90 }, (_, i) => i + 1).map(zone => (
+          {Array.from({ length: 90 }, (_, i) => i + 1).map((zone) => (
             <button
               key={zone}
               onClick={() => toggleArrayItem('ituZones', zone)}
@@ -209,14 +264,38 @@ export const DXFilterManager = ({ filters, onFilterChange, isOpen, onClose }) =>
   const renderBandsTab = () => (
     <div>
       <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '10px' }}>
-        <span style={{ fontSize: '13px', fontWeight: '600', color: 'var(--text-primary)' }}>Include HF/VHF/UHF Bands</span>
+        <span style={{ fontSize: '13px', fontWeight: '600', color: 'var(--text-primary)' }}>
+          Include HF/VHF/UHF Bands
+        </span>
         <div style={{ display: 'flex', gap: '12px' }}>
-          <button onClick={() => selectAll('bands', bands)} style={{ background: 'none', border: 'none', color: 'var(--accent-cyan)', fontSize: '12px', cursor: 'pointer' }}>Select All</button>
-          <button onClick={() => clearFilter('bands')} style={{ background: 'none', border: 'none', color: 'var(--accent-red)', fontSize: '12px', cursor: 'pointer' }}>Clear</button>
+          <button
+            onClick={() => selectAll('bands', bands)}
+            style={{
+              background: 'none',
+              border: 'none',
+              color: 'var(--accent-cyan)',
+              fontSize: '12px',
+              cursor: 'pointer',
+            }}
+          >
+            Select All
+          </button>
+          <button
+            onClick={() => clearFilter('bands')}
+            style={{
+              background: 'none',
+              border: 'none',
+              color: 'var(--accent-red)',
+              fontSize: '12px',
+              cursor: 'pointer',
+            }}
+          >
+            Clear
+          </button>
         </div>
       </div>
       <div style={{ display: 'flex', flexWrap: 'wrap', gap: '8px' }}>
-        {bands.map(band => (
+        {bands.map((band) => (
           <button
             key={band}
             onClick={() => toggleArrayItem('bands', band)}
@@ -232,14 +311,38 @@ export const DXFilterManager = ({ filters, onFilterChange, isOpen, onClose }) =>
   const renderModesTab = () => (
     <div>
       <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '10px' }}>
-        <span style={{ fontSize: '13px', fontWeight: '600', color: 'var(--text-primary)' }}>Include Operating Modes</span>
+        <span style={{ fontSize: '13px', fontWeight: '600', color: 'var(--text-primary)' }}>
+          Include Operating Modes
+        </span>
         <div style={{ display: 'flex', gap: '12px' }}>
-          <button onClick={() => selectAll('modes', modes)} style={{ background: 'none', border: 'none', color: 'var(--accent-cyan)', fontSize: '12px', cursor: 'pointer' }}>Select All</button>
-          <button onClick={() => clearFilter('modes')} style={{ background: 'none', border: 'none', color: 'var(--accent-red)', fontSize: '12px', cursor: 'pointer' }}>Clear</button>
+          <button
+            onClick={() => selectAll('modes', modes)}
+            style={{
+              background: 'none',
+              border: 'none',
+              color: 'var(--accent-cyan)',
+              fontSize: '12px',
+              cursor: 'pointer',
+            }}
+          >
+            Select All
+          </button>
+          <button
+            onClick={() => clearFilter('modes')}
+            style={{
+              background: 'none',
+              border: 'none',
+              color: 'var(--accent-red)',
+              fontSize: '12px',
+              cursor: 'pointer',
+            }}
+          >
+            Clear
+          </button>
         </div>
       </div>
       <div style={{ display: 'flex', flexWrap: 'wrap', gap: '8px' }}>
-        {modes.map(mode => (
+        {modes.map((mode) => (
           <button
             key={mode}
             onClick={() => toggleArrayItem('modes', mode)}
@@ -273,22 +376,56 @@ export const DXFilterManager = ({ filters, onFilterChange, isOpen, onClose }) =>
               borderRadius: '4px',
               color: 'var(--text-primary)',
               fontSize: '13px',
-              fontFamily: 'JetBrains Mono'
+              fontFamily: 'JetBrains Mono',
             }}
           />
-          <button onClick={addToWatchlist} style={{ padding: '8px 16px', background: 'var(--accent-cyan)', border: 'none', borderRadius: '4px', color: '#000', fontWeight: '600', cursor: 'pointer' }}>Add</button>
+          <button
+            onClick={addToWatchlist}
+            style={{
+              padding: '8px 16px',
+              background: 'var(--accent-cyan)',
+              border: 'none',
+              borderRadius: '4px',
+              color: '#000',
+              fontWeight: '600',
+              cursor: 'pointer',
+            }}
+          >
+            Add
+          </button>
         </div>
       </div>
       <div style={{ display: 'flex', flexWrap: 'wrap', gap: '8px' }}>
-        {(filters?.watchlist || []).map(call => (
+        {(filters?.watchlist || []).map((call) => (
           <div key={call} style={{ ...chipStyle(true), display: 'flex', alignItems: 'center', gap: '8px' }}>
             {call}
-            <button onClick={() => toggleArrayItem('watchlist', call)} style={{ background: 'none', border: 'none', color: 'var(--accent-red)', cursor: 'pointer', padding: 0, fontSize: '14px' }}>×</button>
+            <button
+              onClick={() => toggleArrayItem('watchlist', call)}
+              style={{
+                background: 'none',
+                border: 'none',
+                color: 'var(--accent-red)',
+                cursor: 'pointer',
+                padding: 0,
+                fontSize: '14px',
+              }}
+            >
+              ×
+            </button>
           </div>
         ))}
       </div>
       <div style={{ marginTop: '16px' }}>
-        <label style={{ display: 'flex', alignItems: 'center', gap: '8px', color: 'var(--text-secondary)', fontSize: '12px', cursor: 'pointer' }}>
+        <label
+          style={{
+            display: 'flex',
+            alignItems: 'center',
+            gap: '8px',
+            color: 'var(--text-secondary)',
+            fontSize: '12px',
+            cursor: 'pointer',
+          }}
+        >
           <input
             type="checkbox"
             checked={filters?.watchlistOnly || false}
@@ -300,261 +437,319 @@ export const DXFilterManager = ({ filters, onFilterChange, isOpen, onClose }) =>
     </div>
   );
 
-
-const renderExcludeTab = () => (
+  const renderExcludeTab = () => (
     <div>
-        {/* Exclude DX (spot) Continents */}
-        <div style={{marginBottom: '20px'}}>
-            <div style={{fontSize: '13px', fontWeight: '600', color: 'var(--text-primary)', marginBottom: '10px'}}>
-                Exclude Spots (DX) by Continent
-            </div>
-            <div style={{display: 'flex', flexWrap: 'wrap', gap: '8px'}}>
-                {continents.map(c => (
-                    <button
-                        key={c.code}
-                        onClick={() => toggleArrayItem('excludeContinents', c.code)}
-                        style={chipStyle(filters?.excludeContinents?.includes(c.code))}
-                    >
-                        {c.code} - {c.name}
-                    </button>
-                ))}
-            </div>
+      {/* Exclude DX (spot) Continents */}
+      <div style={{ marginBottom: '20px' }}>
+        <div style={{ fontSize: '13px', fontWeight: '600', color: 'var(--text-primary)', marginBottom: '10px' }}>
+          Exclude Spots (DX) by Continent
         </div>
+        <div style={{ display: 'flex', flexWrap: 'wrap', gap: '8px' }}>
+          {continents.map((c) => (
+            <button
+              key={c.code}
+              onClick={() => toggleArrayItem('excludeContinents', c.code)}
+              style={chipStyle(filters?.excludeContinents?.includes(c.code))}
+            >
+              {c.code} - {c.name}
+            </button>
+          ))}
+        </div>
+      </div>
 
+      {/* Exclude DX (spot) CQ Zones */}
+      <div style={{ marginBottom: '20px' }}>
+        <div
+          style={{
+            display: 'flex',
+            justifyContent: 'space-between',
+            alignItems: 'center',
+            marginBottom: '10px',
+          }}
+        >
+          <span
+            style={{
+              fontSize: '13px',
+              fontWeight: '600',
+              color: 'var(--text-primary)',
+            }}
+          >
+            Exclude Spots (DX) by CQ Zone
+          </span>
+          <div style={{ display: 'flex', gap: '12px' }}>
+            <button
+              onClick={() =>
+                selectAll(
+                  'excludeCqZones',
+                  Array.from({ length: 40 }, (_, i) => i + 1),
+                )
+              }
+              style={{
+                background: 'none',
+                border: 'none',
+                color: 'var(--accent-cyan)',
+                fontSize: '12px',
+                cursor: 'pointer',
+              }}
+            >
+              Select All
+            </button>
+            <button
+              onClick={() => clearFilter('excludeCqZones')}
+              style={{
+                background: 'none',
+                border: 'none',
+                color: 'var(--accent-red)',
+                fontSize: '12px',
+                cursor: 'pointer',
+              }}
+            >
+              Clear
+            </button>
+          </div>
+        </div>
+        <div style={{ display: 'grid', gridTemplateColumns: 'repeat(15, 1fr)', gap: '4px' }}>
+          {Array.from({ length: 40 }, (_, i) => i + 1).map((zone) => (
+            <button
+              key={zone}
+              onClick={() => toggleArrayItem('excludeCqZones', zone)}
+              style={zoneButtonStyle(filters?.excludeCqZones?.includes(zone))}
+            >
+              {zone}
+            </button>
+          ))}
+        </div>
+      </div>
 
-        {/* Exclude DX (spot) CQ Zones */}
-        <div style={{marginBottom: '20px'}}>
-            <div style={{
-                display: 'flex',
-                justifyContent: 'space-between',
-                alignItems: 'center',
-                marginBottom: '10px'
-            }}>
-                <span style={{
-                    fontSize: '13px',
-                    fontWeight: '600',
-                    color: 'var(--text-primary)'
-                }}>Exclude Spots (DX) by CQ Zone</span>
-                <div style={{display: 'flex', gap: '12px'}}>
-                    <button onClick={() => selectAll('excludeCqZones', Array.from({length: 40}, (_, i) => i + 1))} style={{
-                        background: 'none',
-                        border: 'none',
-                        color: 'var(--accent-cyan)',
-                        fontSize: '12px',
-                        cursor: 'pointer'
-                    }}>Select All
-                    </button>
-                    <button onClick={() => clearFilter('excludeCqZones')} style={{
-                        background: 'none',
-                        border: 'none',
-                        color: 'var(--accent-red)',
-                        fontSize: '12px',
-                        cursor: 'pointer'
-                    }}>Clear
-                    </button>
-                </div>
-            </div>
-            <div style={{display: 'grid', gridTemplateColumns: 'repeat(15, 1fr)', gap: '4px'}}>
-                {Array.from({length: 40}, (_, i) => i + 1).map(zone => (
-                    <button
-                        key={zone}
-                        onClick={() => toggleArrayItem('excludeCqZones', zone)}
-                        style={zoneButtonStyle(filters?.excludeCqZones?.includes(zone))}
-                    >
-                        {zone}
-                    </button>
-                ))}
-            </div>
+      {/* Exclude DX (spot) ITU Zones */}
+      <div style={{ marginBottom: '20px' }}>
+        <div
+          style={{
+            display: 'flex',
+            justifyContent: 'space-between',
+            alignItems: 'center',
+            marginBottom: '10px',
+          }}
+        >
+          <span
+            style={{
+              fontSize: '13px',
+              fontWeight: '600',
+              color: 'var(--text-primary)',
+            }}
+          >
+            Exclude Spots (DX) by ITU Zone
+          </span>
+          <div style={{ display: 'flex', gap: '12px' }}>
+            <button
+              onClick={() =>
+                selectAll(
+                  'excludeItuZones',
+                  Array.from({ length: 90 }, (_, i) => i + 1),
+                )
+              }
+              style={{
+                background: 'none',
+                border: 'none',
+                color: 'var(--accent-cyan)',
+                fontSize: '12px',
+                cursor: 'pointer',
+              }}
+            >
+              Select All
+            </button>
+            <button
+              onClick={() => clearFilter('excludeItuZones')}
+              style={{
+                background: 'none',
+                border: 'none',
+                color: 'var(--accent-red)',
+                fontSize: '12px',
+                cursor: 'pointer',
+              }}
+            >
+              Clear
+            </button>
+          </div>
         </div>
+        <div style={{ display: 'grid', gridTemplateColumns: 'repeat(15, 1fr)', gap: '4px' }}>
+          {Array.from({ length: 90 }, (_, i) => i + 1).map((zone) => (
+            <button
+              key={zone}
+              onClick={() => toggleArrayItem('excludeItuZones', zone)}
+              style={zoneButtonStyle(filters?.excludeItuZones?.includes(zone))}
+            >
+              {zone}
+            </button>
+          ))}
+        </div>
+      </div>
 
-        {/* Exclude DX (spot) ITU Zones */}
-        <div style={{marginBottom: '20px'}}>
-            <div style={{
+      {/* Exclude DX (spot) callsigns */}
+      <div style={{ marginBottom: '20px' }}>
+        <div style={{ marginBottom: '16px' }}>
+          <div
+            style={{
+              fontSize: '13px',
+              fontWeight: '600',
+              color: 'var(--text-primary)',
+              marginBottom: '8px',
+            }}
+          >
+            Exclude Spot (DX) Callsigns - Hide callsigns beginning with:
+          </div>
+          <div style={{ display: 'flex', gap: '8px' }}>
+            <input
+              type="text"
+              value={newDXExcludeCall}
+              onChange={(e) => setNewDXExcludeCall(e.target.value.toUpperCase())}
+              onKeyPress={(e) => e.key === 'Enter' && addToDXExcludeCalls()}
+              placeholder="Enter callsign..."
+              style={{
+                flex: 1,
+                padding: '8px 12px',
+                background: 'var(--bg-tertiary)',
+                border: '1px solid var(--border-color)',
+                borderRadius: '4px',
+                color: 'var(--text-primary)',
+                fontSize: '13px',
+                fontFamily: 'JetBrains Mono',
+              }}
+            />
+            <button
+              onClick={addToDXExcludeCalls}
+              style={{
+                padding: '8px 16px',
+                background: 'var(--accent-red)',
+                border: 'none',
+                borderRadius: '4px',
+                color: '#fff',
+                fontWeight: '600',
+                cursor: 'pointer',
+              }}
+            >
+              Add
+            </button>
+          </div>
+        </div>
+        <div style={{ display: 'flex', flexWrap: 'wrap', gap: '8px' }}>
+          {(filters?.excludeDXCallList || []).map((call) => (
+            <div
+              key={call}
+              style={{
+                ...chipStyle(false),
+                background: 'rgba(255, 68, 68, 0.2)',
+                borderColor: 'var(--accent-red)',
+                color: 'var(--accent-red)',
                 display: 'flex',
-                justifyContent: 'space-between',
                 alignItems: 'center',
-                marginBottom: '10px'
-            }}>
-                <span style={{
-                    fontSize: '13px',
-                    fontWeight: '600',
-                    color: 'var(--text-primary)'
-                }}>Exclude Spots (DX) by ITU Zone</span>
-                <div style={{display: 'flex', gap: '12px'}}>
-                    <button onClick={() => selectAll('excludeItuZones', Array.from({length: 90}, (_, i) => i + 1))}
-                            style={{
-                                background: 'none',
-                                border: 'none',
-                                color: 'var(--accent-cyan)',
-                                fontSize: '12px',
-                                cursor: 'pointer'
-                            }}>Select All
-                    </button>
-                    <button onClick={() => clearFilter('excludeItuZones')} style={{
-                        background: 'none',
-                        border: 'none',
-                        color: 'var(--accent-red)',
-                        fontSize: '12px',
-                        cursor: 'pointer'
-                    }}>Clear
-                    </button>
-                </div>
-            </div>
-            <div style={{display: 'grid', gridTemplateColumns: 'repeat(15, 1fr)', gap: '4px'}}>
-                {Array.from({length: 90}, (_, i) => i + 1).map(zone => (
-                    <button
-                        key={zone}
-                        onClick={() => toggleArrayItem('excludeItuZones', zone)}
-                        style={zoneButtonStyle(filters?.excludeItuZones?.includes(zone))}
-                    >
-                        {zone}
-                    </button>
-                ))}
+                gap: '8px',
+              }}
+            >
+              {call}
+              <button
+                onClick={() => toggleArrayItem('excludeDXCallList', call)}
+                style={{
+                  background: 'none',
+                  border: 'none',
+                  color: 'var(--accent-red)',
+                  cursor: 'pointer',
+                  padding: 0,
+                  fontSize: '14px',
+                }}
+              >
+                ×
+              </button>
             </div>
+          ))}
         </div>
+      </div>
 
-        {/* Exclude DX (spot) callsigns */}
-        <div style={{marginBottom: '20px'}}>
-            <div style={{marginBottom: '16px'}}>
-                <div style={{
-                    fontSize: '13px',
-                    fontWeight: '600',
-                    color: 'var(--text-primary)',
-                    marginBottom: '8px'
-                }}>
-                    Exclude Spot (DX) Callsigns - Hide callsigns beginning with:
-                </div>
-                <div style={{display: 'flex', gap: '8px'}}>
-                    <input
-                        type="text"
-                        value={newDXExcludeCall}
-                        onChange={(e) => setNewDXExcludeCall(e.target.value.toUpperCase())}
-                        onKeyPress={(e) => e.key === 'Enter' && addToDXExcludeCalls()}
-                        placeholder="Enter callsign..."
-                        style={{
-                            flex: 1,
-                            padding: '8px 12px',
-                            background: 'var(--bg-tertiary)',
-                            border: '1px solid var(--border-color)',
-                            borderRadius: '4px',
-                            color: 'var(--text-primary)',
-                            fontSize: '13px',
-                            fontFamily: 'JetBrains Mono'
-                        }}
-                    />
-                    <button onClick={addToDXExcludeCalls} style={{
-                        padding: '8px 16px',
-                        background: 'var(--accent-red)',
-                        border: 'none',
-                        borderRadius: '4px',
-                        color: '#fff',
-                        fontWeight: '600',
-                        cursor: 'pointer'
-                    }}>Add
-                    </button>
-                </div>
-            </div>
-            <div style={{display: 'flex', flexWrap: 'wrap', gap: '8px'}}>
-                {(filters?.excludeDXCallList || []).map(call => (
-                    <div key={call} style={{
-                        ...chipStyle(false),
-                        background: 'rgba(255, 68, 68, 0.2)',
-                        borderColor: 'var(--accent-red)',
-                        color: 'var(--accent-red)',
-                        display: 'flex',
-                        alignItems: 'center',
-                        gap: '8px'
-                    }}>
-                        {call}
-                        <button onClick={() => toggleArrayItem('excludeDXCallList', call)}
-                            style={{
-                                background: 'none',
-                                border: 'none',
-                                color: 'var(--accent-red)',
-                                cursor: 'pointer',
-                                padding: 0,
-                                fontSize: '14px'
-                            }}>×
-                        </button>
-                    </div>
-                ))}
-            </div>
+      {/* Exclude DE (spotter) callsigns */}
+      <div>
+        <div style={{ marginBottom: '16px' }}>
+          <div
+            style={{
+              fontSize: '13px',
+              fontWeight: '600',
+              color: 'var(--text-primary)',
+              marginBottom: '8px',
+            }}
+          >
+            Exclude Spotter (DE) Callsigns - Hide callsigns beginning with:
+          </div>
+          <div style={{ display: 'flex', gap: '8px' }}>
+            <input
+              type="text"
+              value={newDEExcludeCall}
+              onChange={(e) => setNewDEExcludeCall(e.target.value.toUpperCase())}
+              onKeyPress={(e) => e.key === 'Enter' && addToDEExcludeCalls()}
+              placeholder="Enter callsign..."
+              style={{
+                flex: 1,
+                padding: '8px 12px',
+                background: 'var(--bg-tertiary)',
+                border: '1px solid var(--border-color)',
+                borderRadius: '4px',
+                color: 'var(--text-primary)',
+                fontSize: '13px',
+                fontFamily: 'JetBrains Mono',
+              }}
+            />
+            <button
+              onClick={addToDEExcludeCalls}
+              style={{
+                padding: '8px 16px',
+                background: 'var(--accent-red)',
+                border: 'none',
+                borderRadius: '4px',
+                color: '#fff',
+                fontWeight: '600',
+                cursor: 'pointer',
+              }}
+            >
+              Add
+            </button>
+          </div>
         </div>
-
-        {/* Exclude DE (spotter) callsigns */}
-        <div>
-            <div style={{marginBottom: '16px'}}>
-                <div style={{
-                    fontSize: '13px',
-                    fontWeight: '600',
-                    color: 'var(--text-primary)',
-                    marginBottom: '8px'
-                }}>
-                    Exclude Spotter (DE) Callsigns - Hide callsigns beginning with:
-                </div>
-                <div style={{display: 'flex', gap: '8px'}}>
-                    <input
-                        type="text"
-                        value={newDEExcludeCall}
-                        onChange={(e) => setNewDEExcludeCall(e.target.value.toUpperCase())}
-                        onKeyPress={(e) => e.key === 'Enter' && addToDEExcludeCalls()}
-                        placeholder="Enter callsign..."
-                        style={{
-                            flex: 1,
-                            padding: '8px 12px',
-                            background: 'var(--bg-tertiary)',
-                            border: '1px solid var(--border-color)',
-                            borderRadius: '4px',
-                            color: 'var(--text-primary)',
-                            fontSize: '13px',
-                            fontFamily: 'JetBrains Mono'
-                        }}
-                    />
-                    <button onClick={addToDEExcludeCalls} style={{
-                        padding: '8px 16px',
-                        background: 'var(--accent-red)',
-                        border: 'none',
-                        borderRadius: '4px',
-                        color: '#fff',
-                        fontWeight: '600',
-                        cursor: 'pointer'
-                    }}>Add
-                    </button>
-                </div>
-            </div>
-            <div style={{display: 'flex', flexWrap: 'wrap', gap: '8px'}}>
-                {(filters?.excludeDECallList || []).map(call => (
-                    <div key={call} style={{
-                        ...chipStyle(false),
-                        background: 'rgba(255, 68, 68, 0.2)',
-                        borderColor: 'var(--accent-red)',
-                        color: 'var(--accent-red)',
-                        display: 'flex',
-                        alignItems: 'center',
-                        gap: '8px'
-                    }}>
-                        {call}
-                        <button onClick={() => toggleArrayItem('excludeDECallList', call)}
-                            style={{
-                                background: 'none',
-                                border: 'none',
-                                color: 'var(--accent-red)',
-                                cursor: 'pointer',
-                                padding: 0,
-                                fontSize: '14px'
-                            }}>×
-                        </button>
-                    </div>
-                ))}
+        <div style={{ display: 'flex', flexWrap: 'wrap', gap: '8px' }}>
+          {(filters?.excludeDECallList || []).map((call) => (
+            <div
+              key={call}
+              style={{
+                ...chipStyle(false),
+                background: 'rgba(255, 68, 68, 0.2)',
+                borderColor: 'var(--accent-red)',
+                color: 'var(--accent-red)',
+                display: 'flex',
+                alignItems: 'center',
+                gap: '8px',
+              }}
+            >
+              {call}
+              <button
+                onClick={() => toggleArrayItem('excludeDECallList', call)}
+                style={{
+                  background: 'none',
+                  border: 'none',
+                  color: 'var(--accent-red)',
+                  cursor: 'pointer',
+                  padding: 0,
+                  fontSize: '14px',
+                }}
+              >
+                ×
+              </button>
             </div>
+          ))}
         </div>
+      </div>
     </div>
-);
-
+  );
 
   const renderSettingsTab = () => {
     const retentionMinutes = filters?.spotRetentionMinutes || 30;
-    
+
     return (
       <div>
         <div style={{ marginBottom: '24px' }}>
@@ -574,21 +769,31 @@ const renderExcludeTab = () => (
               onChange={(e) => onFilterChange({ ...filters, spotRetentionMinutes: parseInt(e.target.value) })}
               style={{ flex: 1, cursor: 'pointer' }}
             />
-            <div style={{ 
-              minWidth: '80px', 
-              textAlign: 'center',
-              padding: '8px 12px',
-              background: 'var(--bg-tertiary)',
-              borderRadius: '4px',
-              fontFamily: 'JetBrains Mono',
-              fontSize: '14px',
-              fontWeight: '600',
-              color: 'var(--accent-cyan)'
-            }}>
+            <div
+              style={{
+                minWidth: '80px',
+                textAlign: 'center',
+                padding: '8px 12px',
+                background: 'var(--bg-tertiary)',
+                borderRadius: '4px',
+                fontFamily: 'JetBrains Mono',
+                fontSize: '14px',
+                fontWeight: '600',
+                color: 'var(--accent-cyan)',
+              }}
+            >
               {retentionMinutes} min
             </div>
           </div>
-          <div style={{ display: 'flex', justifyContent: 'space-between', marginTop: '8px', fontSize: '11px', color: 'var(--text-muted)' }}>
+          <div
+            style={{
+              display: 'flex',
+              justifyContent: 'space-between',
+              marginTop: '8px',
+              fontSize: '11px',
+              color: 'var(--text-muted)',
+            }}
+          >
             <span>5 min (freshest)</span>
             <span>30 min (default)</span>
           </div>
@@ -599,7 +804,7 @@ const renderExcludeTab = () => (
             Quick Presets
           </div>
           <div style={{ display: 'flex', gap: '8px' }}>
-            {[5, 10, 15, 20, 30].map(mins => (
+            {[5, 10, 15, 20, 30].map((mins) => (
               <button
                 key={mins}
                 onClick={() => onFilterChange({ ...filters, spotRetentionMinutes: mins })}
@@ -611,7 +816,7 @@ const renderExcludeTab = () => (
                   color: retentionMinutes === mins ? 'var(--accent-cyan)' : 'var(--text-secondary)',
                   fontSize: '13px',
                   cursor: 'pointer',
-                  fontFamily: 'JetBrains Mono'
+                  fontFamily: 'JetBrains Mono',
                 }}
               >
                 {mins} min
@@ -624,39 +829,43 @@ const renderExcludeTab = () => (
   };
 
   return (
-    <div style={{
-      position: 'fixed',
-      top: 0,
-      left: 0,
-      right: 0,
-      bottom: 0,
-      background: 'rgba(0, 0, 0, 0.8)',
-      display: 'flex',
-      alignItems: 'center',
-      justifyContent: 'center',
-      zIndex: 10000
-    }}>
-      <div style={{
-        background: 'var(--bg-secondary)',
-        border: '1px solid var(--border-color)',
-        borderRadius: '12px',
-        width: '700px',
-        maxHeight: '95vh',
+    <div
+      style={{
+        position: 'fixed',
+        top: 0,
+        left: 0,
+        right: 0,
+        bottom: 0,
+        background: 'rgba(0, 0, 0, 0.8)',
         display: 'flex',
-        flexDirection: 'column'
-      }}>
+        alignItems: 'center',
+        justifyContent: 'center',
+        zIndex: 10000,
+      }}
+    >
+      <div
+        style={{
+          background: 'var(--bg-secondary)',
+          border: '1px solid var(--border-color)',
+          borderRadius: '12px',
+          width: '700px',
+          maxHeight: '95vh',
+          display: 'flex',
+          flexDirection: 'column',
+        }}
+      >
         {/* Header */}
-        <div style={{ 
-          display: 'flex', 
-          justifyContent: 'space-between', 
-          alignItems: 'center',
-          padding: '16px 20px',
-          borderBottom: '1px solid var(--border-color)'
-        }}>
+        <div
+          style={{
+            display: 'flex',
+            justifyContent: 'space-between',
+            alignItems: 'center',
+            padding: '16px 20px',
+            borderBottom: '1px solid var(--border-color)',
+          }}
+        >
           <div>
-            <div style={{ fontSize: '18px', fontWeight: '700', color: 'var(--accent-cyan)' }}>
-              ⊘ DX Cluster Filters
-            </div>
+            <div style={{ fontSize: '18px', fontWeight: '700', color: 'var(--accent-cyan)' }}>⊘ DX Cluster Filters</div>
             <div style={{ fontSize: '12px', color: 'var(--text-muted)', marginTop: '2px' }}>
               {getActiveFilterCount()} filters active
             </div>
@@ -671,7 +880,7 @@ const renderExcludeTab = () => (
                 borderRadius: '6px',
                 color: 'var(--accent-red)',
                 fontSize: '13px',
-                cursor: 'pointer'
+                cursor: 'pointer',
               }}
             >
               Clear All
@@ -686,7 +895,7 @@ const renderExcludeTab = () => (
                 color: 'var(--text-primary)',
                 fontSize: '13px',
                 fontWeight: '600',
-                cursor: 'pointer'
+                cursor: 'pointer',
               }}
             >
               Done
@@ -696,12 +905,24 @@ const renderExcludeTab = () => (
 
         {/* Tabs */}
         <div style={{ display: 'flex', borderBottom: '1px solid var(--border-color)' }}>
-          <button onClick={() => setActiveTab('zones')} style={tabStyle(activeTab === 'zones')}>Zones</button>
-          <button onClick={() => setActiveTab('bands')} style={tabStyle(activeTab === 'bands')}>Bands</button>
-          <button onClick={() => setActiveTab('modes')} style={tabStyle(activeTab === 'modes')}>Modes</button>
-          <button onClick={() => setActiveTab('watchlist')} style={tabStyle(activeTab === 'watchlist')}>Watchlist</button>
-          <button onClick={() => setActiveTab('exclude')} style={tabStyle(activeTab === 'exclude')}>Exclude</button>
-          <button onClick={() => setActiveTab('settings')} style={tabStyle(activeTab === 'settings')}>⊙ Settings</button>
+          <button onClick={() => setActiveTab('zones')} style={tabStyle(activeTab === 'zones')}>
+            Zones
+          </button>
+          <button onClick={() => setActiveTab('bands')} style={tabStyle(activeTab === 'bands')}>
+            Bands
+          </button>
+          <button onClick={() => setActiveTab('modes')} style={tabStyle(activeTab === 'modes')}>
+            Modes
+          </button>
+          <button onClick={() => setActiveTab('watchlist')} style={tabStyle(activeTab === 'watchlist')}>
+            Watchlist
+          </button>
+          <button onClick={() => setActiveTab('exclude')} style={tabStyle(activeTab === 'exclude')}>
+            Exclude
+          </button>
+          <button onClick={() => setActiveTab('settings')} style={tabStyle(activeTab === 'settings')}>
+            ⊙ Settings
+          </button>
         </div>
 
         {/* Tab Content */}
diff --git a/src/components/DXNewsTicker.jsx b/src/components/DXNewsTicker.jsx
index afa0c983..fa5add64 100644
--- a/src/components/DXNewsTicker.jsx
+++ b/src/components/DXNewsTicker.jsx
@@ -14,7 +14,7 @@ function isDXNewsEnabled() {
       const layers = JSON.parse(stored);
       return layers.showDXNews !== false;
     }
-  } catch { }
+  } catch {}
   return true; // default on
 }
 
@@ -89,64 +89,75 @@ export const DXNewsTicker = ({ sidebar = false }) => {
   if (!visible || loading || news.length === 0) return null;
 
   // Build ticker text: "TITLE — description  ★  TITLE — description  ★  ..."
-  const tickerItems = news.map(item => ({
+  const tickerItems = news.map((item) => ({
     title: item.title,
-    desc: item.description
+    desc: item.description,
   }));
 
   return (
     <div
       ref={tickerRef}
-      style={sidebar ? {
-        width: '100%',
-        height: '100%',
-        background: 'transparent',
-        overflow: 'hidden',
-        display: 'flex',
-        alignItems: 'center'
-      } : {
-        position: 'absolute',
-        bottom: '8px',
-        left: '8px',
-        right: '8px',
-        height: '28px',
-        background: 'rgba(0, 0, 0, 0.85)',
-        border: '1px solid #444',
-        borderRadius: '6px',
-        overflow: 'hidden',
-        zIndex: 999,
-        display: 'flex',
-        alignItems: 'center'
-      }}
+      style={
+        sidebar
+          ? {
+              width: '100%',
+              height: '100%',
+              background: 'transparent',
+              overflow: 'hidden',
+              display: 'flex',
+              alignItems: 'center',
+            }
+          : {
+              position: 'absolute',
+              bottom: '8px',
+              left: '8px',
+              right: '8px',
+              height: '28px',
+              background: 'rgba(0, 0, 0, 0.85)',
+              border: '1px solid #444',
+              borderRadius: '6px',
+              overflow: 'hidden',
+              zIndex: 999,
+              display: 'flex',
+              alignItems: 'center',
+            }
+      }
     >
       {/* DX NEWS label */}
-      <a href="https://dxnews.com" target="_blank" rel="noopener noreferrer" style={{
-        background: 'rgba(255, 136, 0, 0.9)',
-        color: '#000',
-        fontWeight: '700',
-        fontSize: '10px',
-        fontFamily: 'JetBrains Mono, monospace',
-        padding: '0 8px',
-        height: '100%',
-        display: 'flex',
-        alignItems: 'center',
-        flexShrink: 0,
-        borderRight: '1px solid #444',
-        letterSpacing: '0.5px',
-        textDecoration: 'none',
-      }}>
+      <a
+        href="https://dxnews.com"
+        target="_blank"
+        rel="noopener noreferrer"
+        style={{
+          background: 'rgba(255, 136, 0, 0.9)',
+          color: '#000',
+          fontWeight: '700',
+          fontSize: '10px',
+          fontFamily: 'JetBrains Mono, monospace',
+          padding: '0 8px',
+          height: '100%',
+          display: 'flex',
+          alignItems: 'center',
+          flexShrink: 0,
+          borderRight: '1px solid #444',
+          letterSpacing: '0.5px',
+          textDecoration: 'none',
+        }}
+      >
         📰 DX NEWS
       </a>
 
       {/* Scrolling content */}
-      <div style={{
-        flex: 1,
-        overflow: 'hidden',
-        position: 'relative',
-        height: '100%',
-        maskImage: 'linear-gradient(to right, transparent 0%, black 3%, black 97%, transparent 100%)',
-        WebkitMaskImage: 'linear-gradient(to right, transparent 0%, black 3%, black 97%, transparent 100%)'
-      }}>
+      <div
+        style={{
+          flex: 1,
+          overflow: 'hidden',
+          position: 'relative',
+          height: '100%',
+          maskImage: 'linear-gradient(to right, transparent 0%, black 3%, black 97%, transparent 100%)',
+          WebkitMaskImage: 'linear-gradient(to right, transparent 0%, black 3%, black 97%, transparent 100%)',
+        }}
+      >
         <div
           ref={contentRef}
           style={{
@@ -161,35 +172,41 @@ export const DXNewsTicker = ({ sidebar = false }) => {
             animationIterationCount: 'infinite',
             animationPlayState: paused ? 'paused' : 'running',
             paddingLeft: '100%',
-            willChange: 'transform'
+            willChange: 'transform',
           }}
           onClick={() => setPaused(!paused)}
-          title={paused ? t("app.dxNews.resumeTooltip") : t("app.dxNews.pauseTooltip")}
+          title={paused ? t('app.dxNews.resumeTooltip') : t('app.dxNews.pauseTooltip')}
         >
           {tickerItems.map((item, i) => (
             <span key={i} style={{ display: 'inline-flex', alignItems: 'center' }}>
-              <span style={{
-                color: '#ff8800',
-                fontWeight: '700',
-                fontSize: '11px',
-                fontFamily: 'JetBrains Mono, monospace',
-                marginRight: '6px'
-              }}>
+              <span
+                style={{
+                  color: '#ff8800',
+                  fontWeight: '700',
+                  fontSize: '11px',
+                  fontFamily: 'JetBrains Mono, monospace',
+                  marginRight: '6px',
+                }}
+              >
                 {item.title}
               </span>
-              <span style={{
-                color: '#aaa',
-                fontSize: '11px',
-                fontFamily: 'JetBrains Mono, monospace',
-                marginRight: '12px'
-              }}>
+              <span
+                style={{
+                  color: '#aaa',
+                  fontSize: '11px',
+                  fontFamily: 'JetBrains Mono, monospace',
+                  marginRight: '12px',
+                }}
+              >
                 {item.desc}
               </span>
-              <span style={{
-                color: '#555',
-                fontSize: '10px',
-                marginRight: '12px'
-              }}>
+              <span
+                style={{
+                  color: '#555',
+                  fontSize: '10px',
+                  marginRight: '12px',
+                }}
+              >
                 ◆
               </span>
             </span>
@@ -197,28 +214,34 @@ export const DXNewsTicker = ({ sidebar = false }) => {
           {/* Duplicate for seamless loop */}
           {tickerItems.map((item, i) => (
             <span key={`dup-${i}`} style={{ display: 'inline-flex', alignItems: 'center' }}>
-              <span style={{
-                color: '#ff8800',
-                fontWeight: '700',
-                fontSize: '11px',
-                fontFamily: 'JetBrains Mono, monospace',
-                marginRight: '6px'
-              }}>
+              <span
+                style={{
+                  color: '#ff8800',
+                  fontWeight: '700',
+                  fontSize: '11px',
+                  fontFamily: 'JetBrains Mono, monospace',
+                  marginRight: '6px',
+                }}
+              >
                 {item.title}
               </span>
-              <span style={{
-                color: '#aaa',
-                fontSize: '11px',
-                fontFamily: 'JetBrains Mono, monospace',
-                marginRight: '12px'
-              }}>
+              <span
+                style={{
+                  color: '#aaa',
+                  fontSize: '11px',
+                  fontFamily: 'JetBrains Mono, monospace',
+                  marginRight: '12px',
+                }}
+              >
                 {item.desc}
               </span>
-              <span style={{
-                color: '#555',
-                fontSize: '10px',
-                marginRight: '12px'
-              }}>
+              <span
+                style={{
+                  color: '#555',
+                  fontSize: '10px',
+                  marginRight: '12px',
+                }}
+              >
                 ◆
               </span>
             </span>
diff --git a/src/components/DXpeditionPanel.jsx b/src/components/DXpeditionPanel.jsx
index e84cf65f..aa445155 100644
--- a/src/components/DXpeditionPanel.jsx
+++ b/src/components/DXpeditionPanel.jsx
@@ -18,13 +18,16 @@ export const DXpeditionPanel = ({ data, loading }) => {
 
   return (
     <div className="panel" style={{ padding: '8px', height: '100%', display: 'flex', flexDirection: 'column' }}>
-      <div className="panel-header" style={{ 
-        display: 'flex', 
-        justifyContent: 'space-between', 
-        alignItems: 'center', 
-        marginBottom: '6px',
-        fontSize: '11px'
-      }}>
+      <div
+        className="panel-header"
+        style={{
+          display: 'flex',
+          justifyContent: 'space-between',
+          alignItems: 'center',
+          marginBottom: '6px',
+          fontSize: '11px',
+        }}
+      >
         <span>⊕ DXPEDITIONS</span>
         {data && (
           <span style={{ fontSize: '9px', color: 'var(--text-muted)' }}>
@@ -32,7 +35,7 @@ export const DXpeditionPanel = ({ data, loading }) => {
           </span>
         )}
       </div>
-      
+
       <div style={{ flex: 1, overflowY: 'auto' }}>
         {loading ? (
           <div style={{ display: 'flex', justifyContent: 'center', padding: '10px' }}>
@@ -42,24 +45,23 @@ export const DXpeditionPanel = ({ data, loading }) => {
           data.dxpeditions.slice(0, 4).map((exp, idx) => {
             const style = getStatusStyle(exp);
             return (
-              <div key={idx} style={{ 
-                padding: '4px 6px',
-                marginBottom: '3px',
-                background: style.bg,
-                borderLeft: `2px solid ${style.border}`,
-                borderRadius: '3px',
-                fontSize: '11px',
-                fontFamily: 'JetBrains Mono, monospace'
-              }}>
+              <div
+                key={idx}
+                style={{
+                  padding: '4px 6px',
+                  marginBottom: '3px',
+                  background: style.bg,
+                  borderLeft: `2px solid ${style.border}`,
+                  borderRadius: '3px',
+                  fontSize: '11px',
+                  fontFamily: 'JetBrains Mono, monospace',
+                }}
+              >
                 <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
                   <CallsignLink call={exp.callsign} color="var(--accent-amber)" fontWeight="700" />
-                  <span style={{ color: style.color, fontSize: '9px' }}>
-                    {exp.isActive ? '● NOW' : 'SOON'}
-                  </span>
-                </div>
-                <div style={{ color: 'var(--text-muted)', fontSize: '10px' }}>
-                  {exp.entity}
+                  <span style={{ color: style.color, fontSize: '9px' }}>{exp.isActive ? '● NOW' : 'SOON'}</span>
                 </div>
+                <div style={{ color: 'var(--text-muted)', fontSize: '10px' }}>{exp.entity}</div>
               </div>
             );
           })
diff --git a/src/components/DockableLayout.jsx b/src/components/DockableLayout.jsx
index 26ad68bc..fbd59e5f 100644
--- a/src/components/DockableLayout.jsx
+++ b/src/components/DockableLayout.jsx
@@ -30,7 +30,7 @@ export const DockableLayout = ({
   renderWorldMap,
   renderHeader,
   // Individual panel render functions for advanced docking
-  renderPanels = {}
+  renderPanels = {},
 }) => {
   const layoutRef = useRef(null);
   const [model, setModel] = useState(() => Model.fromJson(loadLayout()));
@@ -69,76 +69,82 @@ export const DockableLayout = ({
   }, []);
 
   // Add a new panel to a tabset
-  const handleAddPanel = useCallback((panelId) => {
-    if (!targetTabSetId || !PANEL_DEFINITIONS[panelId]) return;
-
-    const panel = PANEL_DEFINITIONS[panelId];
-
-    model.doAction(
-      Actions.addNode(
-        {
-          type: 'tab',
-          name: panel.name,
-          component: panelId,
-          id: `${panelId}-${Date.now()}`,
-        },
-        targetTabSetId,
-        DockLocation.CENTER,
-        -1,
-        true
-      )
-    );
-
-    setShowPanelPicker(false);
-    setTargetTabSetId(null);
-  }, [model, targetTabSetId]);
+  const handleAddPanel = useCallback(
+    (panelId) => {
+      if (!targetTabSetId || !PANEL_DEFINITIONS[panelId]) return;
+
+      const panel = PANEL_DEFINITIONS[panelId];
+
+      model.doAction(
+        Actions.addNode(
+          {
+            type: 'tab',
+            name: panel.name,
+            component: panelId,
+            id: `${panelId}-${Date.now()}`,
+          },
+          targetTabSetId,
+          DockLocation.CENTER,
+          -1,
+          true,
+        ),
+      );
+
+      setShowPanelPicker(false);
+      setTargetTabSetId(null);
+    },
+    [model, targetTabSetId],
+  );
 
   // Render tab content based on component type
-  const factory = useCallback((node) => {
-    const component = node.getComponent();
+  const factory = useCallback(
+    (node) => {
+      const component = node.getComponent();
 
-    switch (component) {
-      case 'left-sidebar':
-        return renderLeftSidebar ? renderLeftSidebar() : <div>Left Sidebar</div>;
+      switch (component) {
+        case 'left-sidebar':
+          return renderLeftSidebar ? renderLeftSidebar() : <div>Left Sidebar</div>;
 
-      case 'right-sidebar':
-        return renderRightSidebar ? renderRightSidebar() : <div>Right Sidebar</div>;
+        case 'right-sidebar':
+          return renderRightSidebar ? renderRightSidebar() : <div>Right Sidebar</div>;
 
-      case 'world-map':
-        return renderWorldMap ? renderWorldMap() : <div>World Map</div>;
+        case 'world-map':
+          return renderWorldMap ? renderWorldMap() : <div>World Map</div>;
 
-      // Individual panels for advanced docking
-      case 'de-location':
-        return renderPanels.deLocation ? renderPanels.deLocation() : null;
+        // Individual panels for advanced docking
+        case 'de-location':
+          return renderPanels.deLocation ? renderPanels.deLocation() : null;
 
-      case 'dx-location':
-        return renderPanels.dxLocation ? renderPanels.dxLocation() : null;
+        case 'dx-location':
+          return renderPanels.dxLocation ? renderPanels.dxLocation() : null;
 
-      case 'solar':
-        return renderPanels.solar ? renderPanels.solar() : null;
+        case 'solar':
+          return renderPanels.solar ? renderPanels.solar() : null;
 
-      case 'propagation':
-        return renderPanels.propagation ? renderPanels.propagation() : null;
+        case 'propagation':
+          return renderPanels.propagation ? renderPanels.propagation() : null;
 
-      case 'dx-cluster':
-        return renderPanels.dxCluster ? renderPanels.dxCluster() : null;
+        case 'dx-cluster':
+          return renderPanels.dxCluster ? renderPanels.dxCluster() : null;
 
-      case 'psk-reporter':
-        return renderPanels.pskReporter ? renderPanels.pskReporter() : null;
+        case 'psk-reporter':
+          return renderPanels.pskReporter ? renderPanels.pskReporter() : null;
 
-      case 'dxpeditions':
-        return renderPanels.dxpeditions ? renderPanels.dxpeditions() : null;
+        case 'dxpeditions':
+          return renderPanels.dxpeditions ? renderPanels.dxpeditions() : null;
 
-      case 'pota':
-        return renderPanels.pota ? renderPanels.pota() : null;
+        case 'pota':
+          return renderPanels.pota ? renderPanels.pota() : null;
 
-      case 'contests':
-        return renderPanels.contests ? renderPanels.contests() : null;
+        case 'contests':
+          return renderPanels.contests ? renderPanels.contests() : null;
 
-      default:
-        return <div style={{ padding: '20px', color: '#888' }}>Unknown panel: {component}</div>;
-    }
-  }, [renderLeftSidebar, renderRightSidebar, renderWorldMap, renderPanels]);
+        default:
+          return <div style={{ padding: '20px', color: '#888' }}>Unknown panel: {component}</div>;
+      }
+    },
+    [renderLeftSidebar, renderRightSidebar, renderWorldMap, renderPanels],
+  );
 
   // Custom tab set rendering with + button
   const onRenderTabSet = useCallback((node, renderValues) => {
@@ -156,7 +162,7 @@ export const DockableLayout = ({
         style={{ padding: '4px 6px' }}
       >
         <PlusIcon />
-      </button>
+      </button>,
     );
   }, []);
 
@@ -182,27 +188,27 @@ export const DockableLayout = ({
   }, [model]);
 
   return (
-    <div style={{
-      display: 'flex',
-      flexDirection: 'column',
-      height: '100vh',
-      width: '100vw',
-      background: 'var(--bg-primary)'
-    }}>
+    <div
+      style={{
+        display: 'flex',
+        flexDirection: 'column',
+        height: '100vh',
+        width: '100vw',
+        background: 'var(--bg-primary)',
+      }}
+    >
       {/* Header - always at top, not part of dockable layout */}
-      {renderHeader && (
-        <div style={{ flexShrink: 0 }}>
-          {renderHeader()}
-        </div>
-      )}
+      {renderHeader && <div style={{ flexShrink: 0 }}>{renderHeader()}</div>}
 
       {/* Dockable panel area */}
-      <div style={{
-        flex: 1,
-        position: 'relative',
-        padding: '8px',
-        minHeight: 0 // Important for flexbox
-      }}>
+      <div
+        style={{
+          flex: 1,
+          position: 'relative',
+          padding: '8px',
+          minHeight: 0, // Important for flexbox
+        }}
+      >
         <Layout
           ref={layoutRef}
           model={model}
@@ -276,21 +282,25 @@ export const DockableLayout = ({
             }}
             onClick={(e) => e.stopPropagation()}
           >
-            <h3 style={{
-              margin: '0 0 16px 0',
-              color: '#00ffcc',
-              fontFamily: 'JetBrains Mono, monospace',
-              fontSize: '16px',
-              fontWeight: '600',
-            }}>
+            <h3
+              style={{
+                margin: '0 0 16px 0',
+                color: '#00ffcc',
+                fontFamily: 'JetBrains Mono, monospace',
+                fontSize: '16px',
+                fontWeight: '600',
+              }}
+            >
               Add Panel
             </h3>
 
-            <div style={{
-              display: 'grid',
-              gridTemplateColumns: '1fr 1fr',
-              gap: '8px',
-            }}>
+            <div
+              style={{
+                display: 'grid',
+                gridTemplateColumns: '1fr 1fr',
+                gap: '8px',
+              }}
+            >
               {getAvailablePanels().map((panel) => (
                 <button
                   key={panel.id}
@@ -313,27 +323,33 @@ export const DockableLayout = ({
                     e.currentTarget.style.background = 'rgba(0, 0, 0, 0.3)';
                   }}
                 >
-                  <div style={{
-                    display: 'flex',
-                    alignItems: 'center',
-                    gap: '8px',
-                    marginBottom: '4px',
-                  }}>
+                  <div
+                    style={{
+                      display: 'flex',
+                      alignItems: 'center',
+                      gap: '8px',
+                      marginBottom: '4px',
+                    }}
+                  >
                     <span style={{ fontSize: '18px' }}>{panel.icon}</span>
-                    <span style={{
-                      color: '#e2e8f0',
-                      fontFamily: 'JetBrains Mono, monospace',
-                      fontSize: '13px',
-                      fontWeight: '600',
-                    }}>
+                    <span
+                      style={{
+                        color: '#e2e8f0',
+                        fontFamily: 'JetBrains Mono, monospace',
+                        fontSize: '13px',
+                        fontWeight: '600',
+                      }}
+                    >
                       {panel.name}
                     </span>
                   </div>
-                  <div style={{
-                    color: '#718096',
-                    fontSize: '11px',
-                    lineHeight: 1.4,
-                  }}>
+                  <div
+                    style={{
+                      color: '#718096',
+                      fontSize: '11px',
+                      lineHeight: 1.4,
+                    }}
+                  >
                     {panel.description}
                   </div>
                 </button>
@@ -341,12 +357,14 @@ export const DockableLayout = ({
             </div>
 
             {getAvailablePanels().length === 0 && (
-              <div style={{
-                color: '#718096',
-                textAlign: 'center',
-                padding: '20px',
-                fontStyle: 'italic',
-              }}>
+              <div
+                style={{
+                  color: '#718096',
+                  textAlign: 'center',
+                  padding: '20px',
+                  fontStyle: 'italic',
+                }}
+              >
                 All panels are already visible
               </div>
             )}
diff --git a/src/components/ErrorBoundary.jsx b/src/components/ErrorBoundary.jsx
index 2626d464..385ea3a8 100644
--- a/src/components/ErrorBoundary.jsx
+++ b/src/components/ErrorBoundary.jsx
@@ -23,54 +23,85 @@ export class ErrorBoundary extends React.Component {
     if (!this.state.hasError) return this.props.children;
 
     return (
-      <div style={{
-        width: '100vw', height: '100vh',
-        background: '#1a1a2e', color: '#eee',
-        display: 'flex', alignItems: 'center', justifyContent: 'center',
-        fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif'
-      }}>
+      <div
+        style={{
+          width: '100vw',
+          height: '100vh',
+          background: '#1a1a2e',
+          color: '#eee',
+          display: 'flex',
+          alignItems: 'center',
+          justifyContent: 'center',
+          fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
+        }}
+      >
         <div style={{ textAlign: 'center', padding: '40px', maxWidth: '600px' }}>
           <div style={{ fontSize: '48px', marginBottom: '16px' }}>⚠️</div>
-          <h1 style={{ color: '#fbbf24', fontSize: '1.5rem', marginBottom: '12px' }}>
-            OpenHamClock hit an error
-          </h1>
+          <h1 style={{ color: '#fbbf24', fontSize: '1.5rem', marginBottom: '12px' }}>OpenHamClock hit an error</h1>
           <p style={{ color: '#aaa', marginBottom: '24px', lineHeight: 1.6 }}>
-            Something went wrong rendering the dashboard. This usually fixes itself after a reload.
-            If it keeps happening, try clearing your browser cache.
+            Something went wrong rendering the dashboard. This usually fixes itself after a reload. If it keeps
+            happening, try clearing your browser cache.
           </p>
           <div style={{ display: 'flex', gap: '12px', justifyContent: 'center', marginBottom: '24px' }}>
             <button
               onClick={() => window.location.reload()}
               style={{
-                background: '#fbbf24', color: '#1a1a2e', border: 'none',
-                padding: '10px 24px', borderRadius: '6px', fontSize: '14px',
-                fontWeight: '600', cursor: 'pointer'
+                background: '#fbbf24',
+                color: '#1a1a2e',
+                border: 'none',
+                padding: '10px 24px',
+                borderRadius: '6px',
+                fontSize: '14px',
+                fontWeight: '600',
+                cursor: 'pointer',
               }}
             >
               Reload Page
             </button>
             <button
               onClick={() => {
-                try { localStorage.clear(); } catch {}
+                try {
+                  localStorage.clear();
+                } catch {}
                 window.location.reload();
               }}
               style={{
-                background: 'transparent', color: '#ff6b6b', border: '1px solid #ff6b6b',
-                padding: '10px 24px', borderRadius: '6px', fontSize: '14px',
-                cursor: 'pointer'
+                background: 'transparent',
+                color: '#ff6b6b',
+                border: '1px solid #ff6b6b',
+                padding: '10px 24px',
+                borderRadius: '6px',
+                fontSize: '14px',
+                cursor: 'pointer',
               }}
             >
               Clear Cache & Reload
             </button>
           </div>
           {this.state.error && (
-            <details style={{ textAlign: 'left', background: '#0d0d1a', padding: '12px', borderRadius: '6px', fontSize: '11px' }}>
+            <details
+              style={{
+                textAlign: 'left',
+                background: '#0d0d1a',
+                padding: '12px',
+                borderRadius: '6px',
+                fontSize: '11px',
+              }}
+            >
               <summary style={{ cursor: 'pointer', color: '#888', marginBottom: '8px' }}>Error details</summary>
               <pre style={{ color: '#ff6b6b', whiteSpace: 'pre-wrap', wordBreak: 'break-all', margin: 0 }}>
                 {this.state.error.toString()}
               </pre>
               {this.state.errorInfo?.componentStack && (
-                <pre style={{ color: '#666', whiteSpace: 'pre-wrap', wordBreak: 'break-all', margin: '8px 0 0', fontSize: '10px' }}>
+                <pre
+                  style={{
+                    color: '#666',
+                    whiteSpace: 'pre-wrap',
+                    wordBreak: 'break-all',
+                    margin: '8px 0 0',
+                    fontSize: '10px',
+                  }}
+                >
                   {this.state.errorInfo.componentStack}
                 </pre>
               )}
diff --git a/src/components/Header.jsx b/src/components/Header.jsx
index 24a53384..fb7258ac 100644
--- a/src/components/Header.jsx
+++ b/src/components/Header.jsx
@@ -22,30 +22,35 @@ export const Header = ({
   onFullscreenToggle,
   isFullscreen,
   updateInProgress,
-  showUpdateButton
+  showUpdateButton,
 }) => {
   return (
-    <div style={{
-      gridColumn: '1 / -1',
-      display: 'flex',
-      flexWrap: 'nowrap',
-      alignItems: 'center',
-      justifyContent: 'space-between',
-      background: 'var(--bg-panel)',
-      border: '1px solid var(--border-color)',
-      borderRadius: '6px',
-      padding: '6px 12px',
-      minHeight: '50px',
-      fontFamily: 'JetBrains Mono, monospace',
-      overflow: 'hidden'
-    }}>
+    <div
+      style={{
+        gridColumn: '1 / -1',
+        display: 'flex',
+        flexWrap: 'nowrap',
+        alignItems: 'center',
+        justifyContent: 'space-between',
+        background: 'var(--bg-panel)',
+        border: '1px solid var(--border-color)',
+        borderRadius: '6px',
+        padding: '6px 12px',
+        minHeight: '50px',
+        fontFamily: 'JetBrains Mono, monospace',
+        overflow: 'hidden',
+      }}
+    >
       {/* Callsign & Settings */}
       <div style={{ display: 'flex', alignItems: 'center', gap: '12px', flexShrink: 0 }}>
         <span
           style={{
-            fontSize: config.headerSize > 0.1 && config.headerSize <= 2
-              ? `${22 * config.headerSize}px`
-              : "22px", fontWeight: '900', color: 'var(--accent-amber)', cursor: 'pointer', fontFamily: 'Orbitron, monospace', whiteSpace: 'nowrap'
+            fontSize: config.headerSize > 0.1 && config.headerSize <= 2 ? `${22 * config.headerSize}px` : '22px',
+            fontWeight: '900',
+            color: 'var(--accent-amber)',
+            cursor: 'pointer',
+            fontFamily: 'Orbitron, monospace',
+            whiteSpace: 'nowrap',
           }}
           onClick={onSettingsClick}
           title="Click for settings"
@@ -56,7 +61,8 @@ export const Header = ({
         {(() => {
           const touch = typeof window !== 'undefined' && ('ontouchstart' in window || navigator.maxTouchPoints > 0);
           const narrow = typeof window !== 'undefined' && window.innerWidth <= 1024;
-          if (touch && narrow) return <span className="ohc-mobile-badge">{window.innerWidth <= 768 ? '📱' : '📱 Tablet'}</span>;
+          if (touch && narrow)
+            return <span className="ohc-mobile-badge">{window.innerWidth <= 768 ? '📱' : '📱 Tablet'}</span>;
           return null;
         })()}
         <QRZToggle />
@@ -65,15 +71,17 @@ export const Header = ({
       {/* UTC Clock */}
       <div style={{ display: 'flex', alignItems: 'center', gap: '6px', flexShrink: 0 }}>
         <span style={{ fontSize: '13px', color: 'var(--accent-cyan)', fontWeight: '600' }}>UTC</span>
-        <span style={{
-          fontSize: config.headerSize > 0.1 && config.headerSize <= 2
-            ? `${24 * config.headerSize}px`
-            : "24px",
-          fontWeight: '700',
-          color: 'var(--accent-cyan)',
-          fontFamily: 'JetBrains Mono, Consolas, monospace',
-          whiteSpace: 'nowrap'
-        }}>{utcTime}</span>
+        <span
+          style={{
+            fontSize: config.headerSize > 0.1 && config.headerSize <= 2 ? `${24 * config.headerSize}px` : '24px',
+            fontWeight: '700',
+            color: 'var(--accent-cyan)',
+            fontFamily: 'JetBrains Mono, Consolas, monospace',
+            whiteSpace: 'nowrap',
+          }}
+        >
+          {utcTime}
+        </span>
         <span style={{ fontSize: '12px', color: 'var(--text-muted)', whiteSpace: 'nowrap' }}>{utcDate}</span>
       </div>
 
@@ -84,79 +92,122 @@ export const Header = ({
         title={`Click to switch to ${use12Hour ? '24-hour' : '12-hour'} format`}
       >
         <span style={{ fontSize: '13px', color: 'var(--accent-amber)', fontWeight: '600' }}>LOCAL</span>
-        <span style={{
-          fontSize: config.headerSize > 0.1 && config.headerSize <= 2
-            ? `${24 * config.headerSize}px`
-            : "24px",
-          fontWeight: '700',
-          color: 'var(--accent-amber)',
-          fontFamily: 'JetBrains Mono, Consolas, monospace',
-          whiteSpace: 'nowrap'
-        }}>{localTime}</span>
+        <span
+          style={{
+            fontSize: config.headerSize > 0.1 && config.headerSize <= 2 ? `${24 * config.headerSize}px` : '24px',
+            fontWeight: '700',
+            color: 'var(--accent-amber)',
+            fontFamily: 'JetBrains Mono, Consolas, monospace',
+            whiteSpace: 'nowrap',
+          }}
+        >
+          {localTime}
+        </span>
         <span style={{ fontSize: '12px', color: 'var(--text-muted)', whiteSpace: 'nowrap' }}>{localDate}</span>
       </div>
 
       {/* Weather & Solar Stats */}
-      <div style={{ display: 'flex', gap: '12px', fontSize: '13px', fontFamily: 'JetBrains Mono, Consolas, monospace', whiteSpace: 'nowrap', flexShrink: 0 }}>
-        {localWeather?.data && (() => {
-          // Always compute both F and C from the raw Celsius source
-          // This avoids ±1° rounding drift when toggling units
-          const rawC = localWeather.data.rawTempC;
-          const tempF = Math.round(rawC * 9 / 5 + 32);
-          const tempC = Math.round(rawC);
-          const windLabel = localWeather.data.windUnit || 'mph';
-          return (
-            <div title={`${localWeather.data.description} • Wind: ${localWeather.data.windSpeed} ${windLabel}`}>
-              <span style={{
-                marginRight: '3px',
-                fontSize: config.headerSize > 0.1 && config.headerSize <= 2
-                  ? `${12 * config.headerSize}px`
-                  : "12px",
-              }}>
-                {localWeather.data.icon}
-              </span>
-              <span style={{
-                color: 'var(--accent-cyan)', fontWeight: '600',
-                fontSize: config.headerSize > 0.1 && config.headerSize <= 2
-                  ? `${12 * config.headerSize}px`
-                  : "12px",
-              }}>
-                {tempF}°F/{tempC}°C
-              </span>
-            </div>
-          );
-        })()}
+      <div
+        style={{
+          display: 'flex',
+          gap: '12px',
+          fontSize: '13px',
+          fontFamily: 'JetBrains Mono, Consolas, monospace',
+          whiteSpace: 'nowrap',
+          flexShrink: 0,
+        }}
+      >
+        {localWeather?.data &&
+          (() => {
+            // Always compute both F and C from the raw Celsius source
+            // This avoids ±1° rounding drift when toggling units
+            const rawC = localWeather.data.rawTempC;
+            const tempF = Math.round((rawC * 9) / 5 + 32);
+            const tempC = Math.round(rawC);
+            const windLabel = localWeather.data.windUnit || 'mph';
+            return (
+              <div title={`${localWeather.data.description} • Wind: ${localWeather.data.windSpeed} ${windLabel}`}>
+                <span
+                  style={{
+                    marginRight: '3px',
+                    fontSize:
+                      config.headerSize > 0.1 && config.headerSize <= 2 ? `${12 * config.headerSize}px` : '12px',
+                  }}
+                >
+                  {localWeather.data.icon}
+                </span>
+                <span
+                  style={{
+                    color: 'var(--accent-cyan)',
+                    fontWeight: '600',
+                    fontSize:
+                      config.headerSize > 0.1 && config.headerSize <= 2 ? `${12 * config.headerSize}px` : '12px',
+                  }}
+                >
+                  {tempF}°F/{tempC}°C
+                </span>
+              </div>
+            );
+          })()}
         <div>
           <span style={{ color: 'var(--text-muted)' }}>SFI </span>
-          <span style={{ color: 'var(--accent-amber)', fontWeight: '700' }}>{solarIndices?.data?.sfi?.current || spaceWeather?.data?.solarFlux || '--'}</span>
+          <span style={{ color: 'var(--accent-amber)', fontWeight: '700' }}>
+            {solarIndices?.data?.sfi?.current || spaceWeather?.data?.solarFlux || '--'}
+          </span>
         </div>
         <div>
           <span style={{ color: 'var(--text-muted)' }}>K </span>
-          <span style={{ color: parseInt(solarIndices?.data?.kp?.current ?? spaceWeather?.data?.kIndex) >= 4 ? 'var(--accent-red)' : 'var(--accent-green)', fontWeight: '700' }}>
+          <span
+            style={{
+              color:
+                parseInt(solarIndices?.data?.kp?.current ?? spaceWeather?.data?.kIndex) >= 4
+                  ? 'var(--accent-red)'
+                  : 'var(--accent-green)',
+              fontWeight: '700',
+            }}
+          >
             {solarIndices?.data?.kp?.current ?? spaceWeather?.data?.kIndex ?? '--'}
           </span>
         </div>
         <div>
           <span style={{ color: 'var(--text-muted)' }}>SSN </span>
-          <span style={{ color: 'var(--accent-cyan)', fontWeight: '700' }}>{solarIndices?.data?.ssn?.current || spaceWeather?.data?.sunspotNumber || '--'}</span>
+          <span style={{ color: 'var(--accent-cyan)', fontWeight: '700' }}>
+            {solarIndices?.data?.ssn?.current || spaceWeather?.data?.sunspotNumber || '--'}
+          </span>
         </div>
         {bandConditions?.extras?.aIndex && (
           <div>
             <span style={{ color: 'var(--text-muted)' }}>A </span>
-            <span style={{ color: parseInt(bandConditions.extras.aIndex) >= 20 ? 'var(--accent-red)' : parseInt(bandConditions.extras.aIndex) >= 10 ? 'var(--accent-amber)' : 'var(--accent-green)', fontWeight: '700' }}>
+            <span
+              style={{
+                color:
+                  parseInt(bandConditions.extras.aIndex) >= 20
+                    ? 'var(--accent-red)'
+                    : parseInt(bandConditions.extras.aIndex) >= 10
+                      ? 'var(--accent-amber)'
+                      : 'var(--accent-green)',
+                fontWeight: '700',
+              }}
+            >
               {bandConditions.extras.aIndex}
             </span>
           </div>
         )}
         {bandConditions?.extras?.geomagField && (
           <div>
-            <span style={{
-              fontSize: '10px',
-              color: bandConditions.extras.geomagField === 'QUIET' ? 'var(--accent-green)' :
-                bandConditions.extras.geomagField === 'ACTIVE' || bandConditions.extras.geomagField.includes('STORM') ? 'var(--accent-red)' :
-                  'var(--accent-amber)',
-              fontWeight: '600'
-            }}>
+            <span
+              style={{
+                fontSize: '10px',
+                color:
+                  bandConditions.extras.geomagField === 'QUIET'
+                    ? 'var(--accent-green)'
+                    : bandConditions.extras.geomagField === 'ACTIVE' ||
+                        bandConditions.extras.geomagField.includes('STORM')
+                      ? 'var(--accent-red)'
+                      : 'var(--accent-amber)',
+                fontWeight: '600',
+              }}
+            >
               {bandConditions.extras.geomagField}
             </span>
           </div>
@@ -184,7 +235,7 @@ export const Header = ({
                 display: 'flex',
                 alignItems: 'center',
                 gap: '3px',
-                whiteSpace: 'nowrap'
+                whiteSpace: 'nowrap',
               }}
               title="Buy me a coffee!"
             >
@@ -207,7 +258,7 @@ export const Header = ({
                 display: 'flex',
                 alignItems: 'center',
                 gap: '3px',
-                whiteSpace: 'nowrap'
+                whiteSpace: 'nowrap',
               }}
               title="Donate via PayPal"
             >
@@ -227,7 +278,7 @@ export const Header = ({
               color: updateInProgress ? 'var(--accent-green)' : 'var(--text-secondary)',
               fontSize: '12px',
               cursor: updateInProgress ? 'wait' : 'pointer',
-              whiteSpace: 'nowrap'
+              whiteSpace: 'nowrap',
             }}
             title="Run update now (server will restart)"
           >
@@ -244,10 +295,11 @@ export const Header = ({
             color: 'var(--text-secondary)',
             fontSize: '12px',
             cursor: 'pointer',
-            whiteSpace: 'nowrap'
+            whiteSpace: 'nowrap',
           }}
         >
-          <IconGear size={12} style={{ verticalAlign: 'middle', marginRight: '4px' }} />Settings
+          <IconGear size={12} style={{ verticalAlign: 'middle', marginRight: '4px' }} />
+          Settings
         </button>
         <button
           onClick={onFullscreenToggle}
@@ -259,14 +311,21 @@ export const Header = ({
             color: isFullscreen ? 'var(--accent-green)' : 'var(--text-secondary)',
             fontSize: '12px',
             cursor: 'pointer',
-            whiteSpace: 'nowrap'
+            whiteSpace: 'nowrap',
           }}
-          title={isFullscreen ? "Exit Fullscreen (Esc)" : "Enter Fullscreen"}
+          title={isFullscreen ? 'Exit Fullscreen (Esc)' : 'Enter Fullscreen'}
         >
-          {isFullscreen
-            ? <><IconShrink size={12} style={{ verticalAlign: 'middle', marginRight: '4px' }} />Exit</>
-            : <><IconExpand size={12} style={{ verticalAlign: 'middle', marginRight: '4px' }} />Full</>
-          }
+          {isFullscreen ? (
+            <>
+              <IconShrink size={12} style={{ verticalAlign: 'middle', marginRight: '4px' }} />
+              Exit
+            </>
+          ) : (
+            <>
+              <IconExpand size={12} style={{ verticalAlign: 'middle', marginRight: '4px' }} />
+              Full
+            </>
+          )}
         </button>
       </div>
     </div>
diff --git a/src/components/IDTimerPanel.jsx b/src/components/IDTimerPanel.jsx
index 9048c943..82d90341 100644
--- a/src/components/IDTimerPanel.jsx
+++ b/src/components/IDTimerPanel.jsx
@@ -83,7 +83,8 @@ export const IDTimerPanel = ({ callsign }) => {
   }, []);
 
   const toggle = useCallback(() => {
-    if (active) stop(); else start();
+    if (active) stop();
+    else start();
   }, [active, start, stop]);
 
   // Tick loop — only runs when active
@@ -116,15 +117,21 @@ export const IDTimerPanel = ({ callsign }) => {
   const barColor = !active && !expired ? '#555' : urgent ? '#ff4444' : '#44cc44';
 
   return (
-    <div className="panel" style={{ padding: '8px', height: '100%', display: 'flex', flexDirection: 'column', position: 'relative' }}>
+    <div
+      className="panel"
+      style={{ padding: '8px', height: '100%', display: 'flex', flexDirection: 'column', position: 'relative' }}
+    >
       {/* Header */}
-      <div className="panel-header" style={{
-        display: 'flex',
-        justifyContent: 'space-between',
-        alignItems: 'center',
-        marginBottom: '6px',
-        fontSize: '11px'
-      }}>
+      <div
+        className="panel-header"
+        style={{
+          display: 'flex',
+          justifyContent: 'space-between',
+          alignItems: 'center',
+          marginBottom: '6px',
+          fontSize: '11px',
+        }}
+      >
         <span>📢 ID TIMER</span>
         <div style={{ display: 'flex', gap: '4px' }}>
           <button
@@ -138,7 +145,7 @@ export const IDTimerPanel = ({ callsign }) => {
               borderRadius: '3px',
               fontSize: '9px',
               fontFamily: 'JetBrains Mono',
-              cursor: 'pointer'
+              cursor: 'pointer',
             }}
           >
             {active ? '■ Stop' : '▶ Start'}
@@ -154,7 +161,7 @@ export const IDTimerPanel = ({ callsign }) => {
               borderRadius: '3px',
               fontSize: '9px',
               fontFamily: 'JetBrains Mono',
-              cursor: 'pointer'
+              cursor: 'pointer',
             }}
           >
             ↺
@@ -163,33 +170,52 @@ export const IDTimerPanel = ({ callsign }) => {
       </div>
 
       {/* Countdown display */}
-      <div style={{ flex: 1, display: 'flex', flexDirection: 'column', justifyContent: 'center', alignItems: 'center', gap: '8px' }}>
-        <div style={{
-          fontSize: '32px',
-          fontWeight: '900',
-          fontFamily: 'Orbitron, JetBrains Mono, monospace',
-          color: expired ? '#ff4444' : !active ? '#555' : urgent ? '#ff4444' : 'var(--text-primary, #eee)',
-          letterSpacing: '2px',
-          animation: expired ? 'idBlink 0.6s ease-in-out infinite' : (urgent ? 'idPulse 1s ease-in-out infinite' : 'none')
-        }}>
+      <div
+        style={{
+          flex: 1,
+          display: 'flex',
+          flexDirection: 'column',
+          justifyContent: 'center',
+          alignItems: 'center',
+          gap: '8px',
+        }}
+      >
+        <div
+          style={{
+            fontSize: '32px',
+            fontWeight: '900',
+            fontFamily: 'Orbitron, JetBrains Mono, monospace',
+            color: expired ? '#ff4444' : !active ? '#555' : urgent ? '#ff4444' : 'var(--text-primary, #eee)',
+            letterSpacing: '2px',
+            animation: expired
+              ? 'idBlink 0.6s ease-in-out infinite'
+              : urgent
+                ? 'idPulse 1s ease-in-out infinite'
+                : 'none',
+          }}
+        >
           {formatTime(remaining)}
         </div>
 
         {/* Progress bar */}
-        <div style={{
-          width: '100%',
-          height: '6px',
-          background: 'rgba(255,255,255,0.08)',
-          borderRadius: '3px',
-          overflow: 'hidden'
-        }}>
-          <div style={{
-            width: `${pct}%`,
-            height: '100%',
-            background: barColor,
+        <div
+          style={{
+            width: '100%',
+            height: '6px',
+            background: 'rgba(255,255,255,0.08)',
             borderRadius: '3px',
-            transition: 'width 0.3s linear, background 0.3s'
-          }} />
+            overflow: 'hidden',
+          }}
+        >
+          <div
+            style={{
+              width: `${pct}%`,
+              height: '100%',
+              background: barColor,
+              borderRadius: '3px',
+              transition: 'width 0.3s linear, background 0.3s',
+            }}
+          />
         </div>
 
         <div style={{ fontSize: '9px', color: 'var(--text-muted, #888)', fontFamily: 'JetBrains Mono, monospace' }}>
@@ -203,17 +229,23 @@ export const IDTimerPanel = ({ callsign }) => {
           onClick={reset}
           style={{
             position: 'fixed',
-            top: 0, left: 0, right: 0, bottom: 0,
+            top: 0,
+            left: 0,
+            right: 0,
+            bottom: 0,
             background: 'rgba(0,0,0,0.75)',
             display: 'flex',
             justifyContent: 'center',
             alignItems: 'center',
             zIndex: 99999,
-            cursor: 'pointer'
+            cursor: 'pointer',
           }}
         >
           <div
-            onClick={(e) => { e.stopPropagation(); reset(); }}
+            onClick={(e) => {
+              e.stopPropagation();
+              reset();
+            }}
             style={{
               background: '#1a1a2e',
               border: '3px solid #ff4444',
@@ -223,20 +255,22 @@ export const IDTimerPanel = ({ callsign }) => {
               boxShadow: '0 0 40px rgba(255, 68, 68, 0.4)',
               animation: 'idBlink 0.6s ease-in-out infinite',
               cursor: 'pointer',
-              maxWidth: '90vw'
+              maxWidth: '90vw',
             }}
           >
             <div style={{ fontSize: '18px', color: '#ff4444', marginBottom: '12px', fontWeight: '700' }}>
               📢 IDENTIFY YOUR STATION
             </div>
-            <div style={{
-              fontSize: '36px',
-              fontWeight: '900',
-              fontFamily: 'Orbitron, JetBrains Mono, monospace',
-              color: '#ff4444',
-              letterSpacing: '3px',
-              marginBottom: '16px'
-            }}>
+            <div
+              style={{
+                fontSize: '36px',
+                fontWeight: '900',
+                fontFamily: 'Orbitron, JetBrains Mono, monospace',
+                color: '#ff4444',
+                letterSpacing: '3px',
+                marginBottom: '16px',
+              }}
+            >
               {callsign || 'N0CALL'}
             </div>
             <div style={{ fontSize: '13px', color: '#888', fontFamily: 'JetBrains Mono, monospace' }}>
diff --git a/src/components/Icons.jsx b/src/components/Icons.jsx
index 00f3fb71..24bf4737 100644
--- a/src/components/Icons.jsx
+++ b/src/components/Icons.jsx
@@ -1,9 +1,9 @@
 /**
  * SVG Icons for OpenHamClock
- * 
+ *
  * Cross-platform icons that render identically on all browsers and operating systems.
  * Replaces emoji which render as tofu/boxes on Linux Chromium without emoji fonts.
- * 
+ *
  * All icons accept: size (default 14), color (default 'currentColor'), style, className
  */
 import React from 'react';
@@ -12,7 +12,16 @@ const defaults = { size: 14, color: 'currentColor' };
 
 // Magnifying glass / Search / Filter
 export const IconSearch = ({ size = defaults.size, color = defaults.color, ...props }) => (
-  <svg width={size} height={size} viewBox="0 0 16 16" fill="none" stroke={color} strokeWidth="1.8" strokeLinecap="round" {...props}>
+  <svg
+    width={size}
+    height={size}
+    viewBox="0 0 16 16"
+    fill="none"
+    stroke={color}
+    strokeWidth="1.8"
+    strokeLinecap="round"
+    {...props}
+  >
     <circle cx="6.5" cy="6.5" r="4.5" />
     <line x1="10" y1="10" x2="14" y2="14" />
   </svg>
@@ -20,7 +29,17 @@ export const IconSearch = ({ size = defaults.size, color = defaults.color, ...pr
 
 // Refresh / Reload
 export const IconRefresh = ({ size = defaults.size, color = defaults.color, ...props }) => (
-  <svg width={size} height={size} viewBox="0 0 16 16" fill="none" stroke={color} strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round" {...props}>
+  <svg
+    width={size}
+    height={size}
+    viewBox="0 0 16 16"
+    fill="none"
+    stroke={color}
+    strokeWidth="1.8"
+    strokeLinecap="round"
+    strokeLinejoin="round"
+    {...props}
+  >
     <path d="M13.5 2.5v4h-4" />
     <path d="M2.5 13.5v-4h4" />
     <path d="M3.5 5.5a5.5 5.5 0 0 1 9.1-1l.9.9" />
@@ -30,7 +49,17 @@ export const IconRefresh = ({ size = defaults.size, color = defaults.color, ...p
 
 // Map
 export const IconMap = ({ size = defaults.size, color = defaults.color, ...props }) => (
-  <svg width={size} height={size} viewBox="0 0 16 16" fill="none" stroke={color} strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" {...props}>
+  <svg
+    width={size}
+    height={size}
+    viewBox="0 0 16 16"
+    fill="none"
+    stroke={color}
+    strokeWidth="1.5"
+    strokeLinecap="round"
+    strokeLinejoin="round"
+    {...props}
+  >
     <path d="M1 3.5l4.5-2 5 2.5 4.5-2v11l-4.5 2-5-2.5L1 14.5z" />
     <line x1="5.5" y1="1.5" x2="5.5" y2="12" />
     <line x1="10.5" y1="4" x2="10.5" y2="14.5" />
@@ -39,7 +68,17 @@ export const IconMap = ({ size = defaults.size, color = defaults.color, ...props
 
 // Gear / Settings
 export const IconGear = ({ size = defaults.size, color = defaults.color, ...props }) => (
-  <svg width={size} height={size} viewBox="0 0 16 16" fill="none" stroke={color} strokeWidth="1.4" strokeLinecap="round" strokeLinejoin="round" {...props}>
+  <svg
+    width={size}
+    height={size}
+    viewBox="0 0 16 16"
+    fill="none"
+    stroke={color}
+    strokeWidth="1.4"
+    strokeLinecap="round"
+    strokeLinejoin="round"
+    {...props}
+  >
     <circle cx="8" cy="8" r="2.2" />
     <path d="M8 1.5l.7 1.8a4.5 4.5 0 0 1 1.6.9l1.9-.4 1 1.7-1.2 1.4c.1.4.1.7 0 1.1l1.2 1.4-1 1.7-1.9-.4a4.5 4.5 0 0 1-1.6.9L8 14.5l-.7-1.8a4.5 4.5 0 0 1-1.6-.9l-1.9.4-1-1.7 1.2-1.4c-.1-.4-.1-.7 0-1.1L3.8 6.6l1-1.7 1.9.4a4.5 4.5 0 0 1 1.6-.9z" />
   </svg>
@@ -47,7 +86,16 @@ export const IconGear = ({ size = defaults.size, color = defaults.color, ...prop
 
 // Globe / World
 export const IconGlobe = ({ size = defaults.size, color = defaults.color, ...props }) => (
-  <svg width={size} height={size} viewBox="0 0 16 16" fill="none" stroke={color} strokeWidth="1.5" strokeLinecap="round" {...props}>
+  <svg
+    width={size}
+    height={size}
+    viewBox="0 0 16 16"
+    fill="none"
+    stroke={color}
+    strokeWidth="1.5"
+    strokeLinecap="round"
+    {...props}
+  >
     <circle cx="8" cy="8" r="6.5" />
     <ellipse cx="8" cy="8" rx="2.8" ry="6.5" />
     <line x1="1.5" y1="8" x2="14.5" y2="8" />
@@ -56,7 +104,17 @@ export const IconGlobe = ({ size = defaults.size, color = defaults.color, ...pro
 
 // Satellite
 export const IconSatellite = ({ size = defaults.size, color = defaults.color, ...props }) => (
-  <svg width={size} height={size} viewBox="0 0 16 16" fill="none" stroke={color} strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" {...props}>
+  <svg
+    width={size}
+    height={size}
+    viewBox="0 0 16 16"
+    fill="none"
+    stroke={color}
+    strokeWidth="1.5"
+    strokeLinecap="round"
+    strokeLinejoin="round"
+    {...props}
+  >
     <rect x="5" y="5" width="6" height="6" rx="1" transform="rotate(45 8 8)" />
     <line x1="2" y1="2" x2="4.5" y2="4.5" />
     <line x1="11.5" y1="11.5" x2="14" y2="14" />
@@ -66,7 +124,17 @@ export const IconSatellite = ({ size = defaults.size, color = defaults.color, ..
 
 // Antenna / Radio
 export const IconAntenna = ({ size = defaults.size, color = defaults.color, ...props }) => (
-  <svg width={size} height={size} viewBox="0 0 16 16" fill="none" stroke={color} strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" {...props}>
+  <svg
+    width={size}
+    height={size}
+    viewBox="0 0 16 16"
+    fill="none"
+    stroke={color}
+    strokeWidth="1.5"
+    strokeLinecap="round"
+    strokeLinejoin="round"
+    {...props}
+  >
     <line x1="8" y1="6" x2="8" y2="15" />
     <line x1="5" y1="15" x2="11" y2="15" />
     <path d="M4 4a5.5 5.5 0 0 1 8 0" />
@@ -77,7 +145,16 @@ export const IconAntenna = ({ size = defaults.size, color = defaults.color, ...p
 
 // Sun
 export const IconSun = ({ size = defaults.size, color = defaults.color, ...props }) => (
-  <svg width={size} height={size} viewBox="0 0 16 16" fill="none" stroke={color} strokeWidth="1.5" strokeLinecap="round" {...props}>
+  <svg
+    width={size}
+    height={size}
+    viewBox="0 0 16 16"
+    fill="none"
+    stroke={color}
+    strokeWidth="1.5"
+    strokeLinecap="round"
+    {...props}
+  >
     <circle cx="8" cy="8" r="3" />
     <line x1="8" y1="1" x2="8" y2="3" />
     <line x1="8" y1="13" x2="8" y2="15" />
@@ -92,14 +169,34 @@ export const IconSun = ({ size = defaults.size, color = defaults.color, ...props
 
 // Moon
 export const IconMoon = ({ size = defaults.size, color = defaults.color, ...props }) => (
-  <svg width={size} height={size} viewBox="0 0 16 16" fill="none" stroke={color} strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" {...props}>
+  <svg
+    width={size}
+    height={size}
+    viewBox="0 0 16 16"
+    fill="none"
+    stroke={color}
+    strokeWidth="1.5"
+    strokeLinecap="round"
+    strokeLinejoin="round"
+    {...props}
+  >
     <path d="M13.5 8.5a6 6 0 1 1-6-6 4.5 4.5 0 0 0 6 6z" />
   </svg>
 );
 
 // Trophy / Contest
 export const IconTrophy = ({ size = defaults.size, color = defaults.color, ...props }) => (
-  <svg width={size} height={size} viewBox="0 0 16 16" fill="none" stroke={color} strokeWidth="1.4" strokeLinecap="round" strokeLinejoin="round" {...props}>
+  <svg
+    width={size}
+    height={size}
+    viewBox="0 0 16 16"
+    fill="none"
+    stroke={color}
+    strokeWidth="1.4"
+    strokeLinecap="round"
+    strokeLinejoin="round"
+    {...props}
+  >
     <path d="M5 2h6v5a3 3 0 0 1-6 0z" />
     <path d="M5 4H3a1.5 1.5 0 0 0 0 3h2" />
     <path d="M11 4h2a1.5 1.5 0 0 1 0 3h-2" />
@@ -111,7 +208,17 @@ export const IconTrophy = ({ size = defaults.size, color = defaults.color, ...pr
 
 // Tent / POTA / Camping
 export const IconTent = ({ size = defaults.size, color = defaults.color, ...props }) => (
-  <svg width={size} height={size} viewBox="0 0 16 16" fill="none" stroke={color} strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" {...props}>
+  <svg
+    width={size}
+    height={size}
+    viewBox="0 0 16 16"
+    fill="none"
+    stroke={color}
+    strokeWidth="1.5"
+    strokeLinecap="round"
+    strokeLinejoin="round"
+    {...props}
+  >
     <path d="M8 2L1.5 14h13z" />
     <path d="M8 2v12" />
     <path d="M6 14l2-5 2 5" />
@@ -120,7 +227,16 @@ export const IconTent = ({ size = defaults.size, color = defaults.color, ...prop
 
 // Earth / DXpedition
 export const IconEarth = ({ size = defaults.size, color = defaults.color, ...props }) => (
-  <svg width={size} height={size} viewBox="0 0 16 16" fill="none" stroke={color} strokeWidth="1.5" strokeLinecap="round" {...props}>
+  <svg
+    width={size}
+    height={size}
+    viewBox="0 0 16 16"
+    fill="none"
+    stroke={color}
+    strokeWidth="1.5"
+    strokeLinecap="round"
+    {...props}
+  >
     <circle cx="8" cy="8" r="6.5" />
     <path d="M1.5 6h13M1.5 10h13" />
     <ellipse cx="8" cy="8" rx="3" ry="6.5" />
@@ -129,7 +245,17 @@ export const IconEarth = ({ size = defaults.size, color = defaults.color, ...pro
 
 // Pin / Location
 export const IconPin = ({ size = defaults.size, color = defaults.color, ...props }) => (
-  <svg width={size} height={size} viewBox="0 0 16 16" fill="none" stroke={color} strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" {...props}>
+  <svg
+    width={size}
+    height={size}
+    viewBox="0 0 16 16"
+    fill="none"
+    stroke={color}
+    strokeWidth="1.5"
+    strokeLinecap="round"
+    strokeLinejoin="round"
+    {...props}
+  >
     <path d="M8 1.5A4.5 4.5 0 0 0 3.5 6c0 3.5 4.5 8.5 4.5 8.5s4.5-5 4.5-8.5A4.5 4.5 0 0 0 8 1.5z" />
     <circle cx="8" cy="6" r="1.5" />
   </svg>
@@ -137,7 +263,17 @@ export const IconPin = ({ size = defaults.size, color = defaults.color, ...props
 
 // Tag / Label
 export const IconTag = ({ size = defaults.size, color = defaults.color, ...props }) => (
-  <svg width={size} height={size} viewBox="0 0 16 16" fill="none" stroke={color} strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" {...props}>
+  <svg
+    width={size}
+    height={size}
+    viewBox="0 0 16 16"
+    fill="none"
+    stroke={color}
+    strokeWidth="1.5"
+    strokeLinecap="round"
+    strokeLinejoin="round"
+    {...props}
+  >
     <path d="M1.5 1.5h6l7 7-6 6-7-7z" />
     <circle cx="5" cy="5" r="1" fill={color} stroke="none" />
   </svg>
@@ -145,7 +281,17 @@ export const IconTag = ({ size = defaults.size, color = defaults.color, ...props
 
 // Fullscreen expand
 export const IconExpand = ({ size = defaults.size, color = defaults.color, ...props }) => (
-  <svg width={size} height={size} viewBox="0 0 16 16" fill="none" stroke={color} strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round" {...props}>
+  <svg
+    width={size}
+    height={size}
+    viewBox="0 0 16 16"
+    fill="none"
+    stroke={color}
+    strokeWidth="1.8"
+    strokeLinecap="round"
+    strokeLinejoin="round"
+    {...props}
+  >
     <polyline points="10,1 15,1 15,6" />
     <polyline points="6,15 1,15 1,10" />
     <line x1="15" y1="1" x2="9.5" y2="6.5" />
@@ -155,7 +301,17 @@ export const IconExpand = ({ size = defaults.size, color = defaults.color, ...pr
 
 // Fullscreen shrink
 export const IconShrink = ({ size = defaults.size, color = defaults.color, ...props }) => (
-  <svg width={size} height={size} viewBox="0 0 16 16" fill="none" stroke={color} strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round" {...props}>
+  <svg
+    width={size}
+    height={size}
+    viewBox="0 0 16 16"
+    fill="none"
+    stroke={color}
+    strokeWidth="1.8"
+    strokeLinecap="round"
+    strokeLinejoin="round"
+    {...props}
+  >
     <polyline points="5,10 0,15" />
     <polyline points="11,6 16,1" />
     <polyline points="6,11 6,15 2,15" />
@@ -164,7 +320,20 @@ export const IconShrink = ({ size = defaults.size, color = defaults.color, ...pr
 );
 
 export default {
-  IconSearch, IconRefresh, IconMap, IconGear, IconGlobe, IconSatellite,
-  IconAntenna, IconSun, IconMoon, IconTrophy, IconTent, IconEarth,
-  IconPin, IconTag, IconExpand, IconShrink,
+  IconSearch,
+  IconRefresh,
+  IconMap,
+  IconGear,
+  IconGlobe,
+  IconSatellite,
+  IconAntenna,
+  IconSun,
+  IconMoon,
+  IconTrophy,
+  IconTent,
+  IconEarth,
+  IconPin,
+  IconTag,
+  IconExpand,
+  IconShrink,
 };
diff --git a/src/components/LocationPanel.jsx b/src/components/LocationPanel.jsx
index be61f567..256e38dd 100644
--- a/src/components/LocationPanel.jsx
+++ b/src/components/LocationPanel.jsx
@@ -3,7 +3,14 @@
  * Displays DE and DX location info with grid squares and sun times
  */
 import React from 'react';
-import { calculateGridSquare, calculateBearing, calculateDistance, formatDistance, getMoonPhase, getMoonPhaseEmoji } from '../utils/geo.js';
+import {
+  calculateGridSquare,
+  calculateBearing,
+  calculateDistance,
+  formatDistance,
+  getMoonPhase,
+  getMoonPhaseEmoji,
+} from '../utils/geo.js';
 
 export const LocationPanel = ({
   config,
@@ -12,7 +19,7 @@ export const LocationPanel = ({
   dxSunTimes,
   currentTime,
   dxLocked,
-  onToggleDxLock
+  onToggleDxLock,
 }) => {
   const deGrid = calculateGridSquare(config.location.lat, config.location.lon);
   const dxGrid = calculateGridSquare(dxLocation.lat, dxLocation.lon);
@@ -24,60 +31,74 @@ export const LocationPanel = ({
   return (
     <div className="panel" style={{ padding: '12px' }}>
       <div className="panel-header">◎ LOCATIONS</div>
-      
+
       {/* DE Location */}
       <div style={{ marginBottom: '12px' }}>
-        <div style={{ 
-          display: 'flex', 
-          justifyContent: 'space-between', 
-          alignItems: 'center',
-          marginBottom: '4px'
-        }}>
-          <span style={{ 
-            color: 'var(--accent-amber)', 
-            fontWeight: '700', 
-            fontSize: '14px' 
-          }}>
+        <div
+          style={{
+            display: 'flex',
+            justifyContent: 'space-between',
+            alignItems: 'center',
+            marginBottom: '4px',
+          }}
+        >
+          <span
+            style={{
+              color: 'var(--accent-amber)',
+              fontWeight: '700',
+              fontSize: '14px',
+            }}
+          >
             DE: {config.callsign}
           </span>
-          <span style={{ 
-            color: 'var(--accent-green)', 
-            fontFamily: 'JetBrains Mono, monospace',
-            fontSize: '12px'
-          }}>
+          <span
+            style={{
+              color: 'var(--accent-green)',
+              fontFamily: 'JetBrains Mono, monospace',
+              fontSize: '12px',
+            }}
+          >
             {deGrid}
           </span>
         </div>
-        <div style={{ 
-          fontSize: '11px', 
-          color: 'var(--text-muted)',
-          fontFamily: 'JetBrains Mono, monospace'
-        }}>
+        <div
+          style={{
+            fontSize: '11px',
+            color: 'var(--text-muted)',
+            fontFamily: 'JetBrains Mono, monospace',
+          }}
+        >
           {config.location.lat.toFixed(4)}°, {config.location.lon.toFixed(4)}°
         </div>
-        <div style={{ 
-          fontSize: '11px', 
-          color: 'var(--text-secondary)',
-          marginTop: '4px'
-        }}>
+        <div
+          style={{
+            fontSize: '11px',
+            color: 'var(--text-secondary)',
+            marginTop: '4px',
+          }}
+        >
           ☀ {deSunTimes.sunrise} / {deSunTimes.sunset} UTC
         </div>
       </div>
-      
+
       {/* DX Location */}
       <div style={{ marginBottom: '12px' }}>
-        <div style={{ 
-          display: 'flex', 
-          justifyContent: 'space-between', 
-          alignItems: 'center',
-          marginBottom: '4px'
-        }}>
+        <div
+          style={{
+            display: 'flex',
+            justifyContent: 'space-between',
+            alignItems: 'center',
+            marginBottom: '4px',
+          }}
+        >
           <div style={{ display: 'flex', alignItems: 'center', gap: '8px' }}>
-            <span style={{ 
-              color: 'var(--accent-blue)', 
-              fontWeight: '700', 
-              fontSize: '14px' 
-            }}>
+            <span
+              style={{
+                color: 'var(--accent-blue)',
+                fontWeight: '700',
+                fontSize: '14px',
+              }}
+            >
               DX Target
             </span>
             {onToggleDxLock && (
@@ -95,89 +116,106 @@ export const LocationPanel = ({
                   cursor: 'pointer',
                   display: 'flex',
                   alignItems: 'center',
-                  gap: '3px'
+                  gap: '3px',
                 }}
               >
                 {dxLocked ? '🔒' : '🔓'}
               </button>
             )}
           </div>
-          <span style={{ 
-            color: 'var(--accent-green)', 
-            fontFamily: 'JetBrains Mono, monospace',
-            fontSize: '12px'
-          }}>
+          <span
+            style={{
+              color: 'var(--accent-green)',
+              fontFamily: 'JetBrains Mono, monospace',
+              fontSize: '12px',
+            }}
+          >
             {dxGrid}
           </span>
         </div>
-        <div style={{ 
-          fontSize: '11px', 
-          color: 'var(--text-muted)',
-          fontFamily: 'JetBrains Mono, monospace'
-        }}>
+        <div
+          style={{
+            fontSize: '11px',
+            color: 'var(--text-muted)',
+            fontFamily: 'JetBrains Mono, monospace',
+          }}
+        >
           {dxLocation.lat.toFixed(4)}°, {dxLocation.lon.toFixed(4)}°
         </div>
-        <div style={{ 
-          fontSize: '11px', 
-          color: 'var(--text-secondary)',
-          marginTop: '4px'
-        }}>
+        <div
+          style={{
+            fontSize: '11px',
+            color: 'var(--text-secondary)',
+            marginTop: '4px',
+          }}
+        >
           ☀ {dxSunTimes.sunrise} / {dxSunTimes.sunset} UTC
         </div>
       </div>
-      
+
       {/* Path Info */}
-      <div style={{ 
-        padding: '10px',
-        background: 'var(--bg-tertiary)',
-        borderRadius: '6px',
-        marginBottom: '12px'
-      }}>
-        <div style={{ 
-          display: 'grid', 
-          gridTemplateColumns: '1fr 1fr', 
-          gap: '12px',
-          textAlign: 'center'
-        }}>
+      <div
+        style={{
+          padding: '10px',
+          background: 'var(--bg-tertiary)',
+          borderRadius: '6px',
+          marginBottom: '12px',
+        }}
+      >
+        <div
+          style={{
+            display: 'grid',
+            gridTemplateColumns: '1fr 1fr',
+            gap: '12px',
+            textAlign: 'center',
+          }}
+        >
           <div>
             <div style={{ fontSize: '10px', color: 'var(--text-muted)' }}>BEARING</div>
-            <div style={{ 
-              fontSize: '18px', 
-              fontWeight: '700', 
-              color: 'var(--accent-cyan)',
-              fontFamily: 'Orbitron, monospace'
-            }}>
+            <div
+              style={{
+                fontSize: '18px',
+                fontWeight: '700',
+                color: 'var(--accent-cyan)',
+                fontFamily: 'Orbitron, monospace',
+              }}
+            >
               {bearing.toFixed(0)}°
             </div>
           </div>
           <div>
             <div style={{ fontSize: '10px', color: 'var(--text-muted)' }}>DISTANCE</div>
-            <div style={{ 
-              fontSize: '18px', 
-              fontWeight: '700', 
-              color: 'var(--accent-cyan)',
-              fontFamily: 'Orbitron, monospace'
-            }}>
+            <div
+              style={{
+                fontSize: '18px',
+                fontWeight: '700',
+                color: 'var(--accent-cyan)',
+                fontFamily: 'Orbitron, monospace',
+              }}
+            >
               {formatDistance(distance, config.units)}
             </div>
           </div>
         </div>
       </div>
-      
+
       {/* Moon Phase */}
-      <div style={{ 
-        textAlign: 'center',
-        padding: '8px',
-        background: 'var(--bg-tertiary)',
-        borderRadius: '6px'
-      }}>
+      <div
+        style={{
+          textAlign: 'center',
+          padding: '8px',
+          background: 'var(--bg-tertiary)',
+          borderRadius: '6px',
+        }}
+      >
         <span style={{ fontSize: '20px', marginRight: '8px' }}>{moonEmoji}</span>
-        <span style={{ 
-          fontSize: '11px', 
-          color: 'var(--text-secondary)' 
-        }}>
-          {moonPhase < 0.25 ? 'Waxing' : moonPhase < 0.5 ? 'Waxing' : moonPhase < 0.75 ? 'Waning' : 'Waning'}
-          {' '}
+        <span
+          style={{
+            fontSize: '11px',
+            color: 'var(--text-secondary)',
+          }}
+        >
+          {moonPhase < 0.25 ? 'Waxing' : moonPhase < 0.5 ? 'Waxing' : moonPhase < 0.75 ? 'Waning' : 'Waning'}{' '}
           {Math.round(moonPhase * 100)}%
         </span>
       </div>
diff --git a/src/components/OnAirPanel.jsx b/src/components/OnAirPanel.jsx
index ab6c922a..53abbc81 100644
--- a/src/components/OnAirPanel.jsx
+++ b/src/components/OnAirPanel.jsx
@@ -1,6 +1,6 @@
-import React from "react";
-import { useTranslation } from "react-i18next";
-import { useRig } from "../contexts/RigContext";
+import React from 'react';
+import { useTranslation } from 'react-i18next';
+import { useRig } from '../contexts/RigContext';
 
 const OnAirPanel = () => {
   const { t } = useTranslation();
@@ -9,40 +9,40 @@ const OnAirPanel = () => {
   return (
     <div
       style={{
-        height: "100%",
-        width: "100%",
-        display: "flex",
-        alignItems: "center",
-        justifyContent: "center",
-        background: ptt ? "var(--accent-red)" : "var(--bg-secondary)",
-        color: ptt ? "var(--text-primary)" : "var(--text-muted)",
-        flexDirection: "column",
-        transition: "background 0.2s, color 0.2s",
+        height: '100%',
+        width: '100%',
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'center',
+        background: ptt ? 'var(--accent-red)' : 'var(--bg-secondary)',
+        color: ptt ? 'var(--text-primary)' : 'var(--text-muted)',
+        flexDirection: 'column',
+        transition: 'background 0.2s, color 0.2s',
       }}
     >
       <div
         style={{
-          fontSize: "clamp(2rem, 8vw, 6rem)",
-          fontWeight: "900",
-          fontFamily: "Orbitron, sans-serif",
-          textAlign: "center",
+          fontSize: 'clamp(2rem, 8vw, 6rem)',
+          fontWeight: '900',
+          fontFamily: 'Orbitron, sans-serif',
+          textAlign: 'center',
           lineHeight: 1,
-          textShadow: ptt ? "0 0 20px rgba(0,0,0,0.5)" : "none",
-          animation: ptt ? "pulse 1s infinite" : "none",
+          textShadow: ptt ? '0 0 20px rgba(0,0,0,0.5)' : 'none',
+          animation: ptt ? 'pulse 1s infinite' : 'none',
         }}
       >
-        {ptt ? t("app.onAir.transmitting") : t("app.onAir.receiving")}
+        {ptt ? t('app.onAir.transmitting') : t('app.onAir.receiving')}
       </div>
       {!ptt && (
         <div
           style={{
-            marginTop: "1rem",
-            fontSize: "0.8rem",
-            fontFamily: "JetBrains Mono, monospace",
+            marginTop: '1rem',
+            fontSize: '0.8rem',
+            fontFamily: 'JetBrains Mono, monospace',
             opacity: 0.5,
           }}
         >
-          {t("app.onAir.standby")}
+          {t('app.onAir.standby')}
         </div>
       )}
     </div>
diff --git a/src/components/POTAPanel.jsx b/src/components/POTAPanel.jsx
index a00659cb..6f713a73 100644
--- a/src/components/POTAPanel.jsx
+++ b/src/components/POTAPanel.jsx
@@ -24,16 +24,29 @@ export const POTAPanel = ({
 
   return (
     <div className="panel" style={{ padding: '8px', height: '100%', display: 'flex', flexDirection: 'column' }}>
-      <div className="panel-header" style={{
-        display: 'flex',
-        justifyContent: 'space-between',
-        alignItems: 'center',
-        marginBottom: '6px',
-        fontSize: '11px'
-      }}>
+      <div
+        className="panel-header"
+        style={{
+          display: 'flex',
+          justifyContent: 'space-between',
+          alignItems: 'center',
+          marginBottom: '6px',
+          fontSize: '11px',
+        }}
+      >
         <span>
           ▲ POTA ACTIVATORS {data?.length > 0 ? `(${data.length})` : ''}
-          {checkedTime && <span style={{ color: isStale ? (staleMinutes >= 10 ? '#ff4444' : '#ffaa00') : '#666', marginLeft: '6px', fontSize: '9px' }}>{isStale ? `⚠ ${staleMinutes}m stale` : `✓${checkedTime}`}</span>}
+          {checkedTime && (
+            <span
+              style={{
+                color: isStale ? (staleMinutes >= 10 ? '#ff4444' : '#ffaa00') : '#666',
+                marginLeft: '6px',
+                fontSize: '9px',
+              }}
+            >
+              {isStale ? `⚠ ${staleMinutes}m stale` : `✓${checkedTime}`}
+            </span>
+          )}
         </span>
         <div style={{ display: 'flex', gap: '6px', alignItems: 'center' }}>
           <button
@@ -47,7 +60,7 @@ export const POTAPanel = ({
               borderRadius: '3px',
               fontSize: '9px',
               fontFamily: 'JetBrains Mono',
-              cursor: 'pointer'
+              cursor: 'pointer',
             }}
           >
             ⊞ Map {showOnMap ? 'ON' : 'OFF'}
@@ -65,7 +78,7 @@ export const POTAPanel = ({
                 borderRadius: '3px',
                 fontSize: '9px',
                 fontFamily: 'JetBrains Mono',
-                cursor: 'pointer'
+                cursor: 'pointer',
               }}
             >
               ⊞ Calls {showLabelsOnMap ? 'ON' : 'OFF'}
@@ -90,16 +103,31 @@ export const POTAPanel = ({
                   gap: '4px',
                   padding: '3px 0',
                   borderBottom: i < data.length - 1 ? '1px solid var(--border-color)' : 'none',
-                  cursor: 'pointer'
+                  cursor: 'pointer',
                 }}
                 onClick={() => {
                   onSpotClick?.(spot);
                 }}
               >
-                <span style={{ color: '#44cc44', fontWeight: '600', overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}>
+                <span
+                  style={{
+                    color: '#44cc44',
+                    fontWeight: '600',
+                    overflow: 'hidden',
+                    textOverflow: 'ellipsis',
+                    whiteSpace: 'nowrap',
+                  }}
+                >
                   <CallsignLink call={spot.call} color="#44cc44" fontWeight="600" />
                 </span>
-                <span style={{ color: 'var(--text-muted)', overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}>
+                <span
+                  style={{
+                    color: 'var(--text-muted)',
+                    overflow: 'hidden',
+                    textOverflow: 'ellipsis',
+                    whiteSpace: 'nowrap',
+                  }}
+                >
                   {spot.locationDesc || spot.ref}
                 </span>
                 <span style={{ color: 'var(--accent-cyan)', textAlign: 'right' }}>
@@ -115,9 +143,7 @@ export const POTAPanel = ({
                     }
                   })()}
                 </span>
-                <span style={{ color: 'var(--text-muted)', textAlign: 'right', fontSize: '9px' }}>
-                  {spot.time}
-                </span>
+                <span style={{ color: 'var(--text-muted)', textAlign: 'right', fontSize: '9px' }}>{spot.time}</span>
               </div>
             ))}
           </div>
diff --git a/src/components/PSKFilterManager.jsx b/src/components/PSKFilterManager.jsx
index 6a267e5b..82928e38 100644
--- a/src/components/PSKFilterManager.jsx
+++ b/src/components/PSKFilterManager.jsx
@@ -6,14 +6,68 @@ import React, { useState } from 'react';
 
 const BANDS = ['160m', '80m', '60m', '40m', '30m', '20m', '17m', '15m', '12m', '10m', '6m', '2m', '70cm'];
 const MODES = [
-  '-FT8', 'CONTESTI', 'CW', 'CWU', 'DFCW-90', 'DOMINO', 'ECHO', 'FREEDV', 
-  'FSK441', 'FSQ', 'FST4', 'FST4W', 'FST4W-90', 'FT4', 'FT8', 'HELL', 'HFDL', 
-  'JT', 'JT4', 'JT65', 'JT65B', 'JT9', 'JTMS', 'JS8', 'LZ3CB', 'MFSK16', 
-  'MFSK22', 'MFSK32', 'MSK144', 'NULL', 'OLIVIA', 'OLIVIA 1', 'OLIVIA 3', 
-  'OLIVIA 4', 'OLIVIA 8', 'OPERA', 'PI4', 'PKT', 'POCSAG', 'PSK', 'PSK31', 
-  'PSK32', 'PSK63', 'Q65', 'Q65-30A', 'Q65A', 'Q65B', 'Q65D', 'ROS', 'RTTY', 
-  'RTTY 45', 'SIM31', 'SIM63', 'SSB', 'SSTV', 'THOR-M', 'THOR11', 'THOR22', 
-  'THOR32', 'THRB', 'VARAC', 'WSPR'
+  '-FT8',
+  'CONTESTI',
+  'CW',
+  'CWU',
+  'DFCW-90',
+  'DOMINO',
+  'ECHO',
+  'FREEDV',
+  'FSK441',
+  'FSQ',
+  'FST4',
+  'FST4W',
+  'FST4W-90',
+  'FT4',
+  'FT8',
+  'HELL',
+  'HFDL',
+  'JT',
+  'JT4',
+  'JT65',
+  'JT65B',
+  'JT9',
+  'JTMS',
+  'JS8',
+  'LZ3CB',
+  'MFSK16',
+  'MFSK22',
+  'MFSK32',
+  'MSK144',
+  'NULL',
+  'OLIVIA',
+  'OLIVIA 1',
+  'OLIVIA 3',
+  'OLIVIA 4',
+  'OLIVIA 8',
+  'OPERA',
+  'PI4',
+  'PKT',
+  'POCSAG',
+  'PSK',
+  'PSK31',
+  'PSK32',
+  'PSK63',
+  'Q65',
+  'Q65-30A',
+  'Q65A',
+  'Q65B',
+  'Q65D',
+  'ROS',
+  'RTTY',
+  'RTTY 45',
+  'SIM31',
+  'SIM63',
+  'SSB',
+  'SSTV',
+  'THOR-M',
+  'THOR11',
+  'THOR22',
+  'THOR32',
+  'THRB',
+  'VARAC',
+  'WSPR',
 ];
 
 // Common grid field prefixes by region
@@ -35,9 +89,7 @@ export const PSKFilterManager = ({ filters, onFilterChange, isOpen, onClose }) =
 
   const toggleArrayItem = (key, item) => {
     const current = filters[key] || [];
-    const newArray = current.includes(item)
-      ? current.filter(x => x !== item)
-      : [...current, item];
+    const newArray = current.includes(item) ? current.filter((x) => x !== item) : [...current, item];
     onFilterChange({ ...filters, [key]: newArray.length ? newArray : undefined });
   };
 
@@ -83,7 +135,7 @@ export const PSKFilterManager = ({ filters, onFilterChange, isOpen, onClose }) =
     fontSize: '13px',
     cursor: 'pointer',
     fontFamily: 'inherit',
-    fontWeight: active ? '600' : '400'
+    fontWeight: active ? '600' : '400',
   });
 
   const chipStyle = (selected) => ({
@@ -95,32 +147,42 @@ export const PSKFilterManager = ({ filters, onFilterChange, isOpen, onClose }) =
     fontSize: '12px',
     cursor: 'pointer',
     fontFamily: 'JetBrains Mono, monospace',
-    fontWeight: selected ? '600' : '400'
+    fontWeight: selected ? '600' : '400',
   });
 
   const renderBandsTab = () => (
     <div>
       <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '15px' }}>
-        <span style={{ fontSize: '13px', fontWeight: '600', color: 'var(--text-primary)' }}>
-          Filter by Band
-        </span>
+        <span style={{ fontSize: '13px', fontWeight: '600', color: 'var(--text-primary)' }}>Filter by Band</span>
         <div style={{ display: 'flex', gap: '12px' }}>
-          <button 
-            onClick={() => selectAll('bands', BANDS)} 
-            style={{ background: 'none', border: 'none', color: 'var(--accent-cyan)', fontSize: '12px', cursor: 'pointer' }}
+          <button
+            onClick={() => selectAll('bands', BANDS)}
+            style={{
+              background: 'none',
+              border: 'none',
+              color: 'var(--accent-cyan)',
+              fontSize: '12px',
+              cursor: 'pointer',
+            }}
           >
             Select All
           </button>
-          <button 
-            onClick={() => clearFilter('bands')} 
-            style={{ background: 'none', border: 'none', color: 'var(--accent-red)', fontSize: '12px', cursor: 'pointer' }}
+          <button
+            onClick={() => clearFilter('bands')}
+            style={{
+              background: 'none',
+              border: 'none',
+              color: 'var(--accent-red)',
+              fontSize: '12px',
+              cursor: 'pointer',
+            }}
           >
             Clear
           </button>
         </div>
       </div>
       <div style={{ display: 'flex', flexWrap: 'wrap', gap: '8px' }}>
-        {BANDS.map(band => (
+        {BANDS.map((band) => (
           <button
             key={band}
             onClick={() => toggleArrayItem('bands', band)}
@@ -131,9 +193,7 @@ export const PSKFilterManager = ({ filters, onFilterChange, isOpen, onClose }) =
         ))}
       </div>
       <div style={{ marginTop: '15px', fontSize: '11px', color: 'var(--text-muted)' }}>
-        {filters?.bands?.length 
-          ? `Showing only: ${filters.bands.join(', ')}`
-          : 'Showing all bands (no filter)'}
+        {filters?.bands?.length ? `Showing only: ${filters.bands.join(', ')}` : 'Showing all bands (no filter)'}
       </div>
     </div>
   );
@@ -141,12 +201,16 @@ export const PSKFilterManager = ({ filters, onFilterChange, isOpen, onClose }) =
   const renderGridsTab = () => (
     <div>
       <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '15px' }}>
-        <span style={{ fontSize: '13px', fontWeight: '600', color: 'var(--text-primary)' }}>
-          Filter by Grid Square
-        </span>
-        <button 
-          onClick={() => clearFilter('grids')} 
-          style={{ background: 'none', border: 'none', color: 'var(--accent-red)', fontSize: '12px', cursor: 'pointer' }}
+        <span style={{ fontSize: '13px', fontWeight: '600', color: 'var(--text-primary)' }}>Filter by Grid Square</span>
+        <button
+          onClick={() => clearFilter('grids')}
+          style={{
+            background: 'none',
+            border: 'none',
+            color: 'var(--accent-red)',
+            fontSize: '12px',
+            cursor: 'pointer',
+          }}
         >
           Clear All
         </button>
@@ -169,7 +233,7 @@ export const PSKFilterManager = ({ filters, onFilterChange, isOpen, onClose }) =
             borderRadius: '4px',
             color: 'var(--text-primary)',
             fontSize: '13px',
-            fontFamily: 'JetBrains Mono'
+            fontFamily: 'JetBrains Mono',
           }}
         />
         <button
@@ -182,7 +246,7 @@ export const PSKFilterManager = ({ filters, onFilterChange, isOpen, onClose }) =
             color: '#000',
             fontSize: '12px',
             cursor: 'pointer',
-            fontWeight: '600'
+            fontWeight: '600',
           }}
         >
           Add
@@ -192,11 +256,9 @@ export const PSKFilterManager = ({ filters, onFilterChange, isOpen, onClose }) =
       {/* Selected grids */}
       {filters?.grids?.length > 0 && (
         <div style={{ marginBottom: '20px' }}>
-          <div style={{ fontSize: '12px', color: 'var(--text-muted)', marginBottom: '8px' }}>
-            Active Grid Filters:
-          </div>
+          <div style={{ fontSize: '12px', color: 'var(--text-muted)', marginBottom: '8px' }}>Active Grid Filters:</div>
           <div style={{ display: 'flex', flexWrap: 'wrap', gap: '6px' }}>
-            {filters.grids.map(grid => (
+            {filters.grids.map((grid) => (
               <button
                 key={grid}
                 onClick={() => toggleArrayItem('grids', grid)}
@@ -204,7 +266,7 @@ export const PSKFilterManager = ({ filters, onFilterChange, isOpen, onClose }) =
                   ...chipStyle(true),
                   display: 'flex',
                   alignItems: 'center',
-                  gap: '6px'
+                  gap: '6px',
                 }}
               >
                 {grid}
@@ -216,23 +278,19 @@ export const PSKFilterManager = ({ filters, onFilterChange, isOpen, onClose }) =
       )}
 
       {/* Quick select by region */}
-      <div style={{ fontSize: '12px', color: 'var(--text-muted)', marginBottom: '10px' }}>
-        Quick Select by Region:
-      </div>
-      {GRID_REGIONS.map(region => (
+      <div style={{ fontSize: '12px', color: 'var(--text-muted)', marginBottom: '10px' }}>Quick Select by Region:</div>
+      {GRID_REGIONS.map((region) => (
         <div key={region.name} style={{ marginBottom: '12px' }}>
-          <div style={{ fontSize: '11px', color: 'var(--text-secondary)', marginBottom: '6px' }}>
-            {region.name}
-          </div>
+          <div style={{ fontSize: '11px', color: 'var(--text-secondary)', marginBottom: '6px' }}>{region.name}</div>
           <div style={{ display: 'flex', flexWrap: 'wrap', gap: '4px' }}>
-            {region.grids.map(grid => (
+            {region.grids.map((grid) => (
               <button
                 key={grid}
                 onClick={() => toggleArrayItem('grids', grid)}
                 style={{
                   ...chipStyle(filters?.grids?.includes(grid)),
                   padding: '4px 8px',
-                  fontSize: '11px'
+                  fontSize: '11px',
                 }}
               >
                 {grid}
@@ -247,26 +305,36 @@ export const PSKFilterManager = ({ filters, onFilterChange, isOpen, onClose }) =
   const renderModesTab = () => (
     <div>
       <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '15px' }}>
-        <span style={{ fontSize: '13px', fontWeight: '600', color: 'var(--text-primary)' }}>
-          Filter by Mode
-        </span>
+        <span style={{ fontSize: '13px', fontWeight: '600', color: 'var(--text-primary)' }}>Filter by Mode</span>
         <div style={{ display: 'flex', gap: '12px' }}>
-          <button 
-            onClick={() => selectAll('modes', MODES)} 
-            style={{ background: 'none', border: 'none', color: 'var(--accent-cyan)', fontSize: '12px', cursor: 'pointer' }}
+          <button
+            onClick={() => selectAll('modes', MODES)}
+            style={{
+              background: 'none',
+              border: 'none',
+              color: 'var(--accent-cyan)',
+              fontSize: '12px',
+              cursor: 'pointer',
+            }}
           >
             Select All
           </button>
-          <button 
-            onClick={() => clearFilter('modes')} 
-            style={{ background: 'none', border: 'none', color: 'var(--accent-red)', fontSize: '12px', cursor: 'pointer' }}
+          <button
+            onClick={() => clearFilter('modes')}
+            style={{
+              background: 'none',
+              border: 'none',
+              color: 'var(--accent-red)',
+              fontSize: '12px',
+              cursor: 'pointer',
+            }}
           >
             Clear
           </button>
         </div>
       </div>
       <div style={{ display: 'flex', flexWrap: 'wrap', gap: '8px' }}>
-        {MODES.map(mode => (
+        {MODES.map((mode) => (
           <button
             key={mode}
             onClick={() => toggleArrayItem('modes', mode)}
@@ -277,15 +345,13 @@ export const PSKFilterManager = ({ filters, onFilterChange, isOpen, onClose }) =
         ))}
       </div>
       <div style={{ marginTop: '15px', fontSize: '11px', color: 'var(--text-muted)' }}>
-        {filters?.modes?.length 
-          ? `Showing only: ${filters.modes.join(', ')}`
-          : 'Showing all modes (no filter)'}
+        {filters?.modes?.length ? `Showing only: ${filters.modes.join(', ')}` : 'Showing all modes (no filter)'}
       </div>
     </div>
   );
 
   return (
-    <div 
+    <div
       style={{
         position: 'fixed',
         top: 0,
@@ -296,33 +362,35 @@ export const PSKFilterManager = ({ filters, onFilterChange, isOpen, onClose }) =
         display: 'flex',
         alignItems: 'center',
         justifyContent: 'center',
-        zIndex: 2000
+        zIndex: 2000,
       }}
       onClick={(e) => e.target === e.currentTarget && onClose()}
     >
-      <div style={{
-        background: 'var(--bg-primary)',
-        border: '1px solid var(--border-color)',
-        borderRadius: '8px',
-        width: '500px',
-        maxWidth: '95vw',
-        maxHeight: '85vh',
-        display: 'flex',
-        flexDirection: 'column',
-        boxShadow: '0 8px 32px rgba(0, 0, 0, 0.5)'
-      }}>
-        {/* Header */}
-        <div style={{
+      <div
+        style={{
+          background: 'var(--bg-primary)',
+          border: '1px solid var(--border-color)',
+          borderRadius: '8px',
+          width: '500px',
+          maxWidth: '95vw',
+          maxHeight: '85vh',
           display: 'flex',
-          justifyContent: 'space-between',
-          alignItems: 'center',
-          padding: '16px 20px',
-          borderBottom: '1px solid var(--border-color)'
-        }}>
+          flexDirection: 'column',
+          boxShadow: '0 8px 32px rgba(0, 0, 0, 0.5)',
+        }}
+      >
+        {/* Header */}
+        <div
+          style={{
+            display: 'flex',
+            justifyContent: 'space-between',
+            alignItems: 'center',
+            padding: '16px 20px',
+            borderBottom: '1px solid var(--border-color)',
+          }}
+        >
           <div>
-            <h3 style={{ margin: 0, fontSize: '16px', color: 'var(--text-primary)' }}>
-              ⌇ PSKReporter Filters
-            </h3>
+            <h3 style={{ margin: 0, fontSize: '16px', color: 'var(--text-primary)' }}>⌇ PSKReporter Filters</h3>
             <span style={{ fontSize: '12px', color: 'var(--text-muted)' }}>
               {getActiveFilterCount()} filter{getActiveFilterCount() !== 1 ? 's' : ''} active
             </span>
@@ -335,7 +403,7 @@ export const PSKFilterManager = ({ filters, onFilterChange, isOpen, onClose }) =
               color: 'var(--text-muted)',
               fontSize: '24px',
               cursor: 'pointer',
-              lineHeight: 1
+              lineHeight: 1,
             }}
           >
             ×
@@ -343,11 +411,13 @@ export const PSKFilterManager = ({ filters, onFilterChange, isOpen, onClose }) =
         </div>
 
         {/* Tabs */}
-        <div style={{ 
-          display: 'flex', 
-          borderBottom: '1px solid var(--border-color)',
-          background: 'var(--bg-secondary)'
-        }}>
+        <div
+          style={{
+            display: 'flex',
+            borderBottom: '1px solid var(--border-color)',
+            background: 'var(--bg-secondary)',
+          }}
+        >
           <button onClick={() => setActiveTab('bands')} style={tabStyle(activeTab === 'bands')}>
             Bands {filters?.bands?.length ? `(${filters.bands.length})` : ''}
           </button>
@@ -360,24 +430,28 @@ export const PSKFilterManager = ({ filters, onFilterChange, isOpen, onClose }) =
         </div>
 
         {/* Tab Content */}
-        <div style={{ 
-          flex: 1, 
-          overflow: 'auto', 
-          padding: '20px'
-        }}>
+        <div
+          style={{
+            flex: 1,
+            overflow: 'auto',
+            padding: '20px',
+          }}
+        >
           {activeTab === 'bands' && renderBandsTab()}
           {activeTab === 'grids' && renderGridsTab()}
           {activeTab === 'modes' && renderModesTab()}
         </div>
 
         {/* Footer */}
-        <div style={{
-          display: 'flex',
-          justifyContent: 'space-between',
-          padding: '16px 20px',
-          borderTop: '1px solid var(--border-color)',
-          background: 'var(--bg-secondary)'
-        }}>
+        <div
+          style={{
+            display: 'flex',
+            justifyContent: 'space-between',
+            padding: '16px 20px',
+            borderTop: '1px solid var(--border-color)',
+            background: 'var(--bg-secondary)',
+          }}
+        >
           <button
             onClick={clearAllFilters}
             style={{
@@ -387,7 +461,7 @@ export const PSKFilterManager = ({ filters, onFilterChange, isOpen, onClose }) =
               borderRadius: '4px',
               color: 'var(--accent-red)',
               fontSize: '13px',
-              cursor: 'pointer'
+              cursor: 'pointer',
             }}
           >
             Clear All Filters
@@ -402,7 +476,7 @@ export const PSKFilterManager = ({ filters, onFilterChange, isOpen, onClose }) =
               color: '#000',
               fontSize: '13px',
               cursor: 'pointer',
-              fontWeight: '600'
+              fontWeight: '600',
             }}
           >
             Done
diff --git a/src/components/PSKReporterPanel.jsx b/src/components/PSKReporterPanel.jsx
index 0ee5b936..43501891 100644
--- a/src/components/PSKReporterPanel.jsx
+++ b/src/components/PSKReporterPanel.jsx
@@ -1,7 +1,7 @@
 /**
  * PSKReporter + WSJT-X Panel
  * Digital mode spots — toggle between internet (PSKReporter) and local (WSJT-X UDP)
- * 
+ *
  * Layout:
  *   Row 1: Segmented mode toggle  |  map + filter controls
  *   Row 2: Sub-tabs (Being Heard / Hearing  or  Decodes / QSOs)
@@ -35,34 +35,65 @@ const PSKReporterPanel = ({
   wsjtxRelayConnected,
   wsjtxSessionId,
   showWSJTXOnMap,
-  onToggleWSJTXMap
+  onToggleWSJTXMap,
 }) => {
   const { t } = useTranslation();
   const [panelMode, setPanelMode] = useState(() => {
-    try { const s = localStorage.getItem('openhamclock_pskPanelMode'); return s || 'psk'; } catch { return 'psk'; }
+    try {
+      const s = localStorage.getItem('openhamclock_pskPanelMode');
+      return s || 'psk';
+    } catch {
+      return 'psk';
+    }
   });
   const [activeTab, setActiveTab] = useState(() => {
-    try { const s = localStorage.getItem('openhamclock_pskActiveTab'); return s || 'tx'; } catch { return 'tx'; }
+    try {
+      const s = localStorage.getItem('openhamclock_pskActiveTab');
+      return s || 'tx';
+    } catch {
+      return 'tx';
+    }
   });
   const [wsjtxTab, setWsjtxTab] = useState('decodes');
   const [wsjtxFilter, setWsjtxFilter] = useState('all'); // 'all' | 'cq' | band name
   const [wsjtxAge, setWsjtxAge] = useState(() => {
-    try { return parseInt(localStorage.getItem('ohc_wsjtx_age')) || 30; } catch { return 30; }
+    try {
+      return parseInt(localStorage.getItem('ohc_wsjtx_age')) || 30;
+    } catch {
+      return 30;
+    }
   }); // minutes: 5, 15, 30, 60
 
   // Persist panel mode and active tab
-  const setPanelModePersist = (v) => { setPanelMode(v); try { localStorage.setItem('openhamclock_pskPanelMode', v); } catch { } };
-  const setActiveTabPersist = (v) => { setActiveTab(v); try { localStorage.setItem('openhamclock_pskActiveTab', v); } catch { } };
+  const setPanelModePersist = (v) => {
+    setPanelMode(v);
+    try {
+      localStorage.setItem('openhamclock_pskPanelMode', v);
+    } catch {}
+  };
+  const setActiveTabPersist = (v) => {
+    setActiveTab(v);
+    try {
+      localStorage.setItem('openhamclock_pskActiveTab', v);
+    } catch {}
+  };
 
   // PSKReporter data from App-level hook (single SSE connection shared across app)
   const {
-    txReports = [], txCount = 0, rxReports = [], rxCount = 0,
-    loading = false, error = null, connected = false, source = '', refresh = () => { }
+    txReports = [],
+    txCount = 0,
+    rxReports = [],
+    rxCount = 0,
+    loading = false,
+    error = null,
+    connected = false,
+    source = '',
+    refresh = () => {},
   } = pskReporter;
 
   // ── PSK filtering ──
   const filterReports = (reports) => {
-    return reports.filter(r => {
+    return reports.filter((r) => {
       if (filters?.bands?.length && !filters.bands.includes(r.band)) return false;
       if (filters?.grids?.length) {
         const grid = activeTab === 'tx' ? r.receiverGrid : r.senderGrid;
@@ -77,16 +108,17 @@ const PSKReporterPanel = ({
   const filteredTx = useMemo(() => filterReports(txReports), [txReports, filters, activeTab]);
   const filteredRx = useMemo(() => filterReports(rxReports), [rxReports, filters, activeTab]);
   const filteredReports = activeTab === 'tx' ? filteredTx : filteredRx;
-  const pskFilterCount = [filters?.bands?.length, filters?.grids?.length, filters?.modes?.length].filter(Boolean).length;
+  const pskFilterCount = [filters?.bands?.length, filters?.grids?.length, filters?.modes?.length].filter(
+    Boolean,
+  ).length;
 
-  const getFreqColor = (freqMHz) => !freqMHz ? 'var(--text-muted)' : getBandColor(parseFloat(freqMHz));
-  const formatAge = (m) => (
+  const getFreqColor = (freqMHz) => (!freqMHz ? 'var(--text-muted)' : getBandColor(parseFloat(freqMHz)));
+  const formatAge = (m) =>
     m < 1
       ? t('pskReporterPanel.time.now')
       : m < 60
         ? t('pskReporterPanel.time.minutes', { minutes: m })
-        : t('pskReporterPanel.time.hours', { hours: Math.floor(m / 60) })
-  );
+        : t('pskReporterPanel.time.hours', { hours: Math.floor(m / 60) });
 
   // ── WSJT-X helpers ──
   const activeClients = Object.entries(wsjtxClients);
@@ -94,12 +126,13 @@ const PSKReporterPanel = ({
 
   // Build unified filter options: All, CQ Only, then each available band
   const wsjtxFilterOptions = useMemo(() => {
-    const bands = [...new Set(wsjtxDecodes.map(d => d.band).filter(Boolean))]
-      .sort((a, b) => (parseInt(b) || 999) - (parseInt(a) || 999));
+    const bands = [...new Set(wsjtxDecodes.map((d) => d.band).filter(Boolean))].sort(
+      (a, b) => (parseInt(b) || 999) - (parseInt(a) || 999),
+    );
     return [
       { value: 'all', label: t('pskReporterPanel.wsjtx.filterAll') },
       { value: 'cq', label: t('pskReporterPanel.wsjtx.filterCq') },
-      ...bands.map(b => ({ value: b, label: b }))
+      ...bands.map((b) => ({ value: b, label: b })),
     ];
   }, [wsjtxDecodes, t]);
 
@@ -108,13 +141,13 @@ const PSKReporterPanel = ({
 
     // Time retention filter
     const ageCutoff = Date.now() - wsjtxAge * 60 * 1000;
-    filtered = filtered.filter(d => d.timestamp >= ageCutoff);
+    filtered = filtered.filter((d) => d.timestamp >= ageCutoff);
 
     if (wsjtxFilter === 'cq') {
-      filtered = filtered.filter(d => d.type === 'CQ');
+      filtered = filtered.filter((d) => d.type === 'CQ');
     } else if (wsjtxFilter !== 'all') {
       // Band filter
-      filtered = filtered.filter(d => d.band === wsjtxFilter);
+      filtered = filtered.filter((d) => d.band === wsjtxFilter);
     }
     return filtered.reverse();
   }, [wsjtxDecodes, wsjtxFilter, wsjtxAge]);
@@ -141,9 +174,11 @@ const PSKReporterPanel = ({
   // Compact status dot
   const statusDot = connected
     ? { color: '#4ade80', char: '●' }
-    : (source === 'connecting' || source === 'reconnecting')
+    : source === 'connecting' || source === 'reconnecting'
       ? { color: '#fbbf24', char: '◐' }
-      : error ? { color: '#ef4444', char: '●' } : null;
+      : error
+        ? { color: '#ef4444', char: '●' }
+        : null;
 
   // ── Shared styles ──
   const segBtn = (active, color) => ({
@@ -182,27 +217,40 @@ const PSKReporterPanel = ({
   });
 
   return (
-    <div className="panel" style={{
-      padding: '8px 10px',
-      display: 'flex',
-      flexDirection: 'column',
-      height: '100%',
-      overflow: 'hidden'
-    }}>
-      {/* ── Row 1: Mode toggle + controls ── */}
-      <div style={{
+    <div
+      className="panel"
+      style={{
+        padding: '8px 10px',
         display: 'flex',
-        alignItems: 'center',
-        justifyContent: 'space-between',
-        marginBottom: '5px',
-        flexShrink: 0,
-      }}>
+        flexDirection: 'column',
+        height: '100%',
+        overflow: 'hidden',
+      }}
+    >
+      {/* ── Row 1: Mode toggle + controls ── */}
+      <div
+        style={{
+          display: 'flex',
+          alignItems: 'center',
+          justifyContent: 'space-between',
+          marginBottom: '5px',
+          flexShrink: 0,
+        }}
+      >
         {/* Mode toggle */}
         <div style={{ display: 'flex' }}>
-          <button onClick={() => setPanelModePersist('psk')} style={segBtn(panelMode === 'psk', 'var(--accent-primary)')} title={t('pskReporterPanel.mode.pskTooltip')}>
+          <button
+            onClick={() => setPanelModePersist('psk')}
+            style={segBtn(panelMode === 'psk', 'var(--accent-primary)')}
+            title={t('pskReporterPanel.mode.pskTooltip')}
+          >
             PSKReporter
           </button>
-          <button onClick={() => setPanelModePersist('wsjtx')} style={segBtn(panelMode === 'wsjtx', '#a78bfa')} title={t('pskReporterPanel.mode.wsjtxTooltip')}>
+          <button
+            onClick={() => setPanelModePersist('wsjtx')}
+            style={segBtn(panelMode === 'wsjtx', '#a78bfa')}
+            title={t('pskReporterPanel.mode.wsjtxTooltip')}
+          >
             WSJT-X
           </button>
         </div>
@@ -215,14 +263,26 @@ const PSKReporterPanel = ({
               {statusDot && (
                 <span style={{ color: statusDot.color, fontSize: '10px', lineHeight: 1 }}>{statusDot.char}</span>
               )}
-              <button onClick={onOpenFilters} style={iconBtn(pskFilterCount > 0, '#ffaa00')} title={t('pskReporterPanel.psk.filterTooltip')}>
-                <IconSearch size={11} style={{ verticalAlign: 'middle' }} />{pskFilterCount > 0 ? pskFilterCount : ''}
+              <button
+                onClick={onOpenFilters}
+                style={iconBtn(pskFilterCount > 0, '#ffaa00')}
+                title={t('pskReporterPanel.psk.filterTooltip')}
+              >
+                <IconSearch size={11} style={{ verticalAlign: 'middle' }} />
+                {pskFilterCount > 0 ? pskFilterCount : ''}
+              </button>
+              <button
+                onClick={refresh}
+                disabled={loading}
+                style={{
+                  ...iconBtn(false),
+                  opacity: loading ? 0.4 : 1,
+                  cursor: loading ? 'not-allowed' : 'pointer',
+                }}
+                title={t('pskReporterPanel.psk.refreshTooltip')}
+              >
+                <IconRefresh size={11} style={{ verticalAlign: 'middle' }} />
               </button>
-              <button onClick={refresh} disabled={loading} style={{
-                ...iconBtn(false),
-                opacity: loading ? 0.4 : 1,
-                cursor: loading ? 'not-allowed' : 'pointer',
-              }} title={t('pskReporterPanel.psk.refreshTooltip')}><IconRefresh size={11} style={{ verticalAlign: 'middle' }} /></button>
             </>
           )}
 
@@ -249,13 +309,21 @@ const PSKReporterPanel = ({
                   maxWidth: '90px',
                 }}
               >
-                {wsjtxFilterOptions.map(o => (
-                  <option key={o.value} value={o.value}>{o.label}</option>
+                {wsjtxFilterOptions.map((o) => (
+                  <option key={o.value} value={o.value}>
+                    {o.label}
+                  </option>
                 ))}
               </select>
               <select
                 value={wsjtxAge}
-                onChange={(e) => { const v = parseInt(e.target.value); setWsjtxAge(v); try { localStorage.setItem('ohc_wsjtx_age', v); } catch { } }}
+                onChange={(e) => {
+                  const v = parseInt(e.target.value);
+                  setWsjtxAge(v);
+                  try {
+                    localStorage.setItem('ohc_wsjtx_age', v);
+                  } catch {}
+                }}
                 style={{
                   background: 'var(--bg-tertiary)',
                   color: 'var(--text-primary)',
@@ -278,7 +346,11 @@ const PSKReporterPanel = ({
 
           {/* Map toggle (always visible) */}
           {handleMapToggle && (
-            <button onClick={handleMapToggle} style={iconBtn(isMapOn, panelMode === 'psk' ? '#4488ff' : '#a78bfa')} title={isMapOn ? t('pskReporterPanel.map.hide') : t('pskReporterPanel.map.show')}>
+            <button
+              onClick={handleMapToggle}
+              style={iconBtn(isMapOn, panelMode === 'psk' ? '#4488ff' : '#a78bfa')}
+              title={isMapOn ? t('pskReporterPanel.map.hide') : t('pskReporterPanel.map.show')}
+            >
               <IconMap size={11} style={{ verticalAlign: 'middle' }} />
             </button>
           )}
@@ -289,19 +361,35 @@ const PSKReporterPanel = ({
       <div style={{ display: 'flex', gap: '4px', marginBottom: '5px', flexShrink: 0 }}>
         {panelMode === 'psk' ? (
           <>
-            <button onClick={() => setActiveTabPersist('tx')} style={subTabBtn(activeTab === 'tx', '#4ade80')} title={t('pskReporterPanel.tabs.heardTooltip')}>
+            <button
+              onClick={() => setActiveTabPersist('tx')}
+              style={subTabBtn(activeTab === 'tx', '#4ade80')}
+              title={t('pskReporterPanel.tabs.heardTooltip')}
+            >
               ▲ {t('pskReporterPanel.tabs.heard', { count: pskFilterCount > 0 ? filteredTx.length : txCount })}
             </button>
-            <button onClick={() => setActiveTabPersist('rx')} style={subTabBtn(activeTab === 'rx', '#60a5fa')} title={t('pskReporterPanel.tabs.hearingTooltip')}>
+            <button
+              onClick={() => setActiveTabPersist('rx')}
+              style={subTabBtn(activeTab === 'rx', '#60a5fa')}
+              title={t('pskReporterPanel.tabs.hearingTooltip')}
+            >
               ▼ {t('pskReporterPanel.tabs.hearing', { count: pskFilterCount > 0 ? filteredRx.length : rxCount })}
             </button>
           </>
         ) : (
           <>
-            <button onClick={() => setWsjtxTab('decodes')} style={subTabBtn(wsjtxTab === 'decodes', '#a78bfa')} title={t('pskReporterPanel.wsjtx.decodingTooltip')}>
+            <button
+              onClick={() => setWsjtxTab('decodes')}
+              style={subTabBtn(wsjtxTab === 'decodes', '#a78bfa')}
+              title={t('pskReporterPanel.wsjtx.decodingTooltip')}
+            >
               {t('pskReporterPanel.wsjtx.decodes', { count: filteredDecodes.length })}
             </button>
-            <button onClick={() => setWsjtxTab('qsos')} style={subTabBtn(wsjtxTab === 'qsos', '#a78bfa')} title={t('pskReporterPanel.wsjtx.qsosTooltip')}>
+            <button
+              onClick={() => setWsjtxTab('qsos')}
+              style={subTabBtn(wsjtxTab === 'qsos', '#a78bfa')}
+              title={t('pskReporterPanel.wsjtx.qsosTooltip')}
+            >
               {t('pskReporterPanel.wsjtx.qsos', { count: wsjtxQsos.length })}
             </button>
           </>
@@ -310,11 +398,10 @@ const PSKReporterPanel = ({
 
       {/* ── Content area ── */}
       <div style={{ flex: 1, overflow: 'auto', fontSize: '11px', fontFamily: "'JetBrains Mono', monospace" }}>
-
         {/* === PSKReporter content === */}
         {panelMode === 'psk' && (
           <>
-            {(!callsign || callsign === 'N0CALL') ? (
+            {!callsign || callsign === 'N0CALL' ? (
               <div style={{ color: 'var(--text-muted)', textAlign: 'center', padding: '16px', fontSize: '11px' }}>
                 {t('pskReporterPanel.psk.setCallsign')}
               </div>
@@ -358,22 +445,42 @@ const PSKReporterPanel = ({
                       background: i % 2 === 0 ? 'rgba(255,255,255,0.02)' : 'transparent',
                       cursor: report.lat && report.lon ? 'pointer' : 'default',
                     }}
-                    onMouseEnter={(e) => e.currentTarget.style.background = 'rgba(68,136,255,0.12)'}
-                    onMouseLeave={(e) => e.currentTarget.style.background = i % 2 === 0 ? 'rgba(255,255,255,0.02)' : 'transparent'}
+                    onMouseEnter={(e) => (e.currentTarget.style.background = 'rgba(68,136,255,0.12)')}
+                    onMouseLeave={(e) =>
+                      (e.currentTarget.style.background = i % 2 === 0 ? 'rgba(255,255,255,0.02)' : 'transparent')
+                    }
                   >
                     <span style={{ color, fontWeight: '600', fontSize: '10px' }}>{freqMHz}</span>
-                    <span style={{
-                      color: 'var(--text-primary)', fontWeight: '600', fontSize: '11px',
-                      overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap'
-                    }}>
+                    <span
+                      style={{
+                        color: 'var(--text-primary)',
+                        fontWeight: '600',
+                        fontSize: '11px',
+                        overflow: 'hidden',
+                        textOverflow: 'ellipsis',
+                        whiteSpace: 'nowrap',
+                      }}
+                    >
                       <CallsignLink call={displayCall} color="var(--text-primary)" fontWeight="600" fontSize="11px" />
-                      {grid && <span style={{ color: 'var(--text-muted)', fontWeight: '400', marginLeft: '4px', fontSize: '9px' }}>{grid}</span>}
+                      {grid && (
+                        <span
+                          style={{ color: 'var(--text-muted)', fontWeight: '400', marginLeft: '4px', fontSize: '9px' }}
+                        >
+                          {grid}
+                        </span>
+                      )}
                     </span>
                     <span style={{ display: 'flex', alignItems: 'center', gap: '3px', fontSize: '9px' }}>
                       <span style={{ color: 'var(--text-muted)' }}>{report.mode}</span>
                       {report.snr != null && (
-                        <span style={{ color: report.snr >= 0 ? '#4ade80' : report.snr >= -10 ? '#fbbf24' : '#f97316', fontWeight: '600' }}>
-                          {report.snr > 0 ? '+' : ''}{report.snr}
+                        <span
+                          style={{
+                            color: report.snr >= 0 ? '#4ade80' : report.snr >= -10 ? '#fbbf24' : '#f97316',
+                            fontWeight: '600',
+                          }}
+                        >
+                          {report.snr > 0 ? '+' : ''}
+                          {report.snr}
                         </span>
                       )}
                       <span style={{ color: 'var(--text-muted)' }}>{formatAge(report.age)}</span>
@@ -390,47 +497,101 @@ const PSKReporterPanel = ({
           <>
             {/* No client connected */}
             {!wsjtxLoading && activeClients.length === 0 && wsjtxDecodes.length === 0 ? (
-              <div style={{
-                display: 'flex', alignItems: 'center', justifyContent: 'center',
-                flexDirection: 'column', gap: '8px', color: 'var(--text-muted)',
-                fontSize: '11px', textAlign: 'center', padding: '16px 8px', height: '100%'
-              }}>
+              <div
+                style={{
+                  display: 'flex',
+                  alignItems: 'center',
+                  justifyContent: 'center',
+                  flexDirection: 'column',
+                  gap: '8px',
+                  color: 'var(--text-muted)',
+                  fontSize: '11px',
+                  textAlign: 'center',
+                  padding: '16px 8px',
+                  height: '100%',
+                }}
+              >
                 <div style={{ fontSize: '12px' }}>{t('pskReporterPanel.wsjtx.waiting')}</div>
                 {wsjtxRelayEnabled ? (
                   wsjtxRelayConnected ? (
                     <div style={{ fontSize: '10px', opacity: 0.8, lineHeight: 1.6 }}>
-                      <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', gap: '6px', marginBottom: '4px' }}>
-                        <span style={{ display: 'inline-block', width: '8px', height: '8px', borderRadius: '50%', background: '#4ade80', boxShadow: '0 0 4px #4ade80' }} />
-                        <span style={{ color: '#4ade80', fontWeight: 600 }}>{t('pskReporterPanel.wsjtx.relayConnected')}</span>
-                      </div>
-                      <div style={{ fontSize: '9px', opacity: 0.5 }}>
-                        {t('pskReporterPanel.wsjtx.relayHint')}
+                      <div
+                        style={{
+                          display: 'flex',
+                          alignItems: 'center',
+                          justifyContent: 'center',
+                          gap: '6px',
+                          marginBottom: '4px',
+                        }}
+                      >
+                        <span
+                          style={{
+                            display: 'inline-block',
+                            width: '8px',
+                            height: '8px',
+                            borderRadius: '50%',
+                            background: '#4ade80',
+                            boxShadow: '0 0 4px #4ade80',
+                          }}
+                        />
+                        <span style={{ color: '#4ade80', fontWeight: 600 }}>
+                          {t('pskReporterPanel.wsjtx.relayConnected')}
+                        </span>
                       </div>
+                      <div style={{ fontSize: '9px', opacity: 0.5 }}>{t('pskReporterPanel.wsjtx.relayHint')}</div>
                     </div>
                   ) : (
                     <div style={{ fontSize: '10px', opacity: 0.8, lineHeight: 1.6 }}>
-                      <div style={{ marginBottom: '8px' }}>
-                        {t('pskReporterPanel.wsjtx.downloadRelay')}
-                      </div>
+                      <div style={{ marginBottom: '8px' }}>{t('pskReporterPanel.wsjtx.downloadRelay')}</div>
                       <div style={{ display: 'flex', gap: '4px', justifyContent: 'center', flexWrap: 'wrap' }}>
-                        <a href={`/api/wsjtx/relay/download/linux?session=${wsjtxSessionId || ''}`}
+                        <a
+                          href={`/api/wsjtx/relay/download/linux?session=${wsjtxSessionId || ''}`}
                           style={{
-                            padding: '4px 10px', borderRadius: '4px', fontSize: '10px', fontWeight: '600',
-                            background: 'rgba(167,139,250,0.2)', border: '1px solid #a78bfa55',
-                            color: '#a78bfa', textDecoration: 'none', cursor: 'pointer',
-                          }}>{t('pskReporterPanel.wsjtx.platformLinux')}</a>
-                        <a href={`/api/wsjtx/relay/download/mac?session=${wsjtxSessionId || ''}`}
+                            padding: '4px 10px',
+                            borderRadius: '4px',
+                            fontSize: '10px',
+                            fontWeight: '600',
+                            background: 'rgba(167,139,250,0.2)',
+                            border: '1px solid #a78bfa55',
+                            color: '#a78bfa',
+                            textDecoration: 'none',
+                            cursor: 'pointer',
+                          }}
+                        >
+                          {t('pskReporterPanel.wsjtx.platformLinux')}
+                        </a>
+                        <a
+                          href={`/api/wsjtx/relay/download/mac?session=${wsjtxSessionId || ''}`}
                           style={{
-                            padding: '4px 10px', borderRadius: '4px', fontSize: '10px', fontWeight: '600',
-                            background: 'rgba(167,139,250,0.2)', border: '1px solid #a78bfa55',
-                            color: '#a78bfa', textDecoration: 'none', cursor: 'pointer',
-                          }}>{t('pskReporterPanel.wsjtx.platformMac')}</a>
-                        <a href={`/api/wsjtx/relay/download/windows?session=${wsjtxSessionId || ''}`}
+                            padding: '4px 10px',
+                            borderRadius: '4px',
+                            fontSize: '10px',
+                            fontWeight: '600',
+                            background: 'rgba(167,139,250,0.2)',
+                            border: '1px solid #a78bfa55',
+                            color: '#a78bfa',
+                            textDecoration: 'none',
+                            cursor: 'pointer',
+                          }}
+                        >
+                          {t('pskReporterPanel.wsjtx.platformMac')}
+                        </a>
+                        <a
+                          href={`/api/wsjtx/relay/download/windows?session=${wsjtxSessionId || ''}`}
                           style={{
-                            padding: '4px 10px', borderRadius: '4px', fontSize: '10px', fontWeight: '600',
-                            background: 'rgba(167,139,250,0.2)', border: '1px solid #a78bfa55',
-                            color: '#a78bfa', textDecoration: 'none', cursor: 'pointer',
-                          }}>{t('pskReporterPanel.wsjtx.platformWindows')}</a>
+                            padding: '4px 10px',
+                            borderRadius: '4px',
+                            fontSize: '10px',
+                            fontWeight: '600',
+                            background: 'rgba(167,139,250,0.2)',
+                            border: '1px solid #a78bfa55',
+                            color: '#a78bfa',
+                            textDecoration: 'none',
+                            cursor: 'pointer',
+                          }}
+                        >
+                          {t('pskReporterPanel.wsjtx.platformWindows')}
+                        </a>
                       </div>
                       <div style={{ fontSize: '9px', opacity: 0.5, marginTop: '6px' }}>
                         {t('pskReporterPanel.wsjtx.requiresNode')}
@@ -449,32 +610,55 @@ const PSKReporterPanel = ({
               <>
                 {filteredDecodes.length === 0 ? (
                   <div style={{ color: 'var(--text-muted)', textAlign: 'center', padding: '16px', fontSize: '11px' }}>
-                    {wsjtxDecodes.length > 0 ? t('pskReporterPanel.wsjtx.noDecodesFiltered') : t('pskReporterPanel.wsjtx.listening')}
+                    {wsjtxDecodes.length > 0
+                      ? t('pskReporterPanel.wsjtx.noDecodesFiltered')
+                      : t('pskReporterPanel.wsjtx.listening')}
                   </div>
                 ) : (
                   filteredDecodes.map((d, i) => (
                     <div
                       key={d.id || i}
                       style={{
-                        display: 'flex', gap: '5px', padding: '2px 2px',
+                        display: 'flex',
+                        gap: '5px',
+                        padding: '2px 2px',
                         borderBottom: '1px solid var(--border-color)',
                         alignItems: 'baseline',
                         opacity: d.lowConfidence ? 0.5 : 1,
                       }}
                     >
                       <span style={{ color: 'var(--text-muted)', minWidth: '44px', fontSize: '10px' }}>{d.time}</span>
-                      <span style={{ color: getSnrColor(d.snr), minWidth: '26px', textAlign: 'right', fontSize: '10px' }}>
+                      <span
+                        style={{ color: getSnrColor(d.snr), minWidth: '26px', textAlign: 'right', fontSize: '10px' }}
+                      >
                         {d.snr != null ? (d.snr >= 0 ? `+${d.snr}` : d.snr) : ''}
                       </span>
-                      <span style={{ color: 'var(--text-muted)', minWidth: '24px', textAlign: 'right', fontSize: '10px' }}>{d.dt}</span>
-                      <span style={{
-                        color: d.band ? getBandColor(d.dialFrequency / 1000000) : 'var(--text-muted)',
-                        minWidth: '32px', textAlign: 'right', fontSize: '10px'
-                      }}>{d.freq}</span>
-                      <span style={{
-                        color: getMsgColor(d), flex: 1, whiteSpace: 'nowrap',
-                        overflow: 'hidden', textOverflow: 'ellipsis',
-                      }}>{d.message}</span>
+                      <span
+                        style={{ color: 'var(--text-muted)', minWidth: '24px', textAlign: 'right', fontSize: '10px' }}
+                      >
+                        {d.dt}
+                      </span>
+                      <span
+                        style={{
+                          color: d.band ? getBandColor(d.dialFrequency / 1000000) : 'var(--text-muted)',
+                          minWidth: '32px',
+                          textAlign: 'right',
+                          fontSize: '10px',
+                        }}
+                      >
+                        {d.freq}
+                      </span>
+                      <span
+                        style={{
+                          color: getMsgColor(d),
+                          flex: 1,
+                          whiteSpace: 'nowrap',
+                          overflow: 'hidden',
+                          textOverflow: 'ellipsis',
+                        }}
+                      >
+                        {d.message}
+                      </span>
                     </div>
                   ))
                 )}
@@ -488,44 +672,65 @@ const PSKReporterPanel = ({
                   </div>
                 ) : (
                   [...wsjtxQsos].reverse().map((q, i) => (
-                    <div key={i} style={{
-                      display: 'flex', gap: '5px', padding: '3px 2px',
-                      borderBottom: '1px solid var(--border-color)', alignItems: 'baseline',
-                    }}>
-                      <span style={{
-                        color: q.band ? getBandColor(q.frequency / 1000000) : 'var(--accent-green)',
-                        fontWeight: '600', minWidth: '65px'
-                      }}><CallsignLink call={q.dxCall} color={q.band ? getBandColor(q.frequency / 1000000) : 'var(--accent-green)'} fontWeight="600" /></span>
+                    <div
+                      key={i}
+                      style={{
+                        display: 'flex',
+                        gap: '5px',
+                        padding: '3px 2px',
+                        borderBottom: '1px solid var(--border-color)',
+                        alignItems: 'baseline',
+                      }}
+                    >
+                      <span
+                        style={{
+                          color: q.band ? getBandColor(q.frequency / 1000000) : 'var(--accent-green)',
+                          fontWeight: '600',
+                          minWidth: '65px',
+                        }}
+                      >
+                        <CallsignLink
+                          call={q.dxCall}
+                          color={q.band ? getBandColor(q.frequency / 1000000) : 'var(--accent-green)'}
+                          fontWeight="600"
+                        />
+                      </span>
                       <span style={{ color: 'var(--text-muted)', fontSize: '10px' }}>{q.band}</span>
                       <span style={{ color: 'var(--text-muted)', fontSize: '10px' }}>{q.mode}</span>
-                      <span style={{ color: 'var(--text-muted)', fontSize: '10px' }}>{q.reportSent}/{q.reportRecv}</span>
+                      <span style={{ color: 'var(--text-muted)', fontSize: '10px' }}>
+                        {q.reportSent}/{q.reportRecv}
+                      </span>
                       {q.dxGrid && <span style={{ color: '#a78bfa', fontSize: '10px' }}>{q.dxGrid}</span>}
-                    </div >
+                    </div>
                   ))
                 )}
               </>
             )}
           </>
         )}
-      </div >
+      </div>
 
       {/* ── WSJT-X status footer ── */}
-      {
-        panelMode === 'wsjtx' && activeClients.length > 0 && (
-          <div style={{
-            fontSize: '9px', color: 'var(--text-muted)',
+      {panelMode === 'wsjtx' && activeClients.length > 0 && (
+        <div
+          style={{
+            fontSize: '9px',
+            color: 'var(--text-muted)',
             borderTop: '1px solid var(--border-color)',
-            paddingTop: '2px', marginTop: '2px',
-            display: 'flex', justifyContent: 'space-between', flexShrink: 0
-          }}>
-            <span>{activeClients.map(([id, c]) => `${id}${c.version ? ` v${c.version}` : ''}`).join(', ')}</span>
-            {primaryClient?.dialFrequency && (
-              <span style={{ color: '#a78bfa' }}>{(primaryClient.dialFrequency / 1000000).toFixed(6)} MHz</span>
-            )}
-          </div>
-        )
-      }
-    </div >
+            paddingTop: '2px',
+            marginTop: '2px',
+            display: 'flex',
+            justifyContent: 'space-between',
+            flexShrink: 0,
+          }}
+        >
+          <span>{activeClients.map(([id, c]) => `${id}${c.version ? ` v${c.version}` : ''}`).join(', ')}</span>
+          {primaryClient?.dialFrequency && (
+            <span style={{ color: '#a78bfa' }}>{(primaryClient.dialFrequency / 1000000).toFixed(6)} MHz</span>
+          )}
+        </div>
+      )}
+    </div>
   );
 };
 
diff --git a/src/components/PotaSotaPanel.jsx b/src/components/PotaSotaPanel.jsx
index 8a4ea124..0fb06372 100644
--- a/src/components/PotaSotaPanel.jsx
+++ b/src/components/PotaSotaPanel.jsx
@@ -11,23 +11,42 @@ import { SOTAPanel } from './SOTAPanel.jsx';
 const TABS = ['pota', 'wwff', 'sota'];
 
 export const PotaSotaPanel = ({
-  potaData, potaLoading, potaLastUpdated, potaLastChecked, showPOTA, onTogglePOTA,
-  wwffData, wwffLoading, wwffLastUpdated, wwffLastChecked, showWWFF, onToggleWWFF,
-  sotaData, sotaLoading, sotaLastUpdated, sotaLastChecked, showSOTA, onToggleSOTA,
+  potaData,
+  potaLoading,
+  potaLastUpdated,
+  potaLastChecked,
+  showPOTA,
+  onTogglePOTA,
+  wwffData,
+  wwffLoading,
+  wwffLastUpdated,
+  wwffLastChecked,
+  showWWFF,
+  onToggleWWFF,
+  sotaData,
+  sotaLoading,
+  sotaLastUpdated,
+  sotaLastChecked,
+  showSOTA,
+  onToggleSOTA,
   onPOTASpotClick,
   onWWFFSpotClick,
-  onSOTASpotClick
+  onSOTASpotClick,
 }) => {
   const [activeTab, setActiveTab] = useState(() => {
     try {
       const saved = localStorage.getItem('openhamclock_potaSotaTab');
       return TABS.includes(saved) ? saved : 'pota';
-    } catch { return 'pota'; }
+    } catch {
+      return 'pota';
+    }
   });
 
   const handleTabChange = (tab) => {
     setActiveTab(tab);
-    try { localStorage.setItem('openhamclock_potaSotaTab', tab); } catch { }
+    try {
+      localStorage.setItem('openhamclock_potaSotaTab', tab);
+    } catch {}
   };
 
   const tabStyle = (tab) => ({
@@ -35,17 +54,13 @@ export const PotaSotaPanel = ({
     padding: '3px 0',
     background: activeTab === tab ? 'rgba(255, 255, 255, 0.08)' : 'transparent',
     border: 'none',
-    borderBottom: activeTab === tab
-      ? `2px solid ${tab === 'pota' ? '#44cc44' : '#ff9632'}`
-      : '2px solid transparent',
-    color: activeTab === tab
-      ? (tab === 'pota' ? '#44cc44' : '#ff9632')
-      : '#666',
+    borderBottom: activeTab === tab ? `2px solid ${tab === 'pota' ? '#44cc44' : '#ff9632'}` : '2px solid transparent',
+    color: activeTab === tab ? (tab === 'pota' ? '#44cc44' : '#ff9632') : '#666',
     fontSize: '10px',
     fontFamily: 'JetBrains Mono, monospace',
     fontWeight: activeTab === tab ? '700' : '400',
     cursor: 'pointer',
-    transition: 'all 0.15s ease'
+    transition: 'all 0.15s ease',
   });
 
   const potaStaleMin = potaLastUpdated ? Math.floor((Date.now() - potaLastUpdated) / 60000) : null;
@@ -60,19 +75,30 @@ export const PotaSotaPanel = ({
   return (
     <div style={{ height: '100%', display: 'flex', flexDirection: 'column' }}>
       {/* Tab bar */}
-      <div style={{
-        display: 'flex',
-        borderBottom: '1px solid var(--border-color)',
-        flexShrink: 0
-      }}>
+      <div
+        style={{
+          display: 'flex',
+          borderBottom: '1px solid var(--border-color)',
+          flexShrink: 0,
+        }}
+      >
         <button style={tabStyle('pota')} onClick={() => handleTabChange('pota')}>
-          ▲ POTA {potaData?.length > 0 ? `(${potaData.length})` : ''}{potaStaleMin >= 5 && <span style={{ color: potaStaleMin >= 10 ? '#ff4444' : '#ffaa00' }}>{staleWarning(potaStaleMin)}</span>}
+          ▲ POTA {potaData?.length > 0 ? `(${potaData.length})` : ''}
+          {potaStaleMin >= 5 && (
+            <span style={{ color: potaStaleMin >= 10 ? '#ff4444' : '#ffaa00' }}>{staleWarning(potaStaleMin)}</span>
+          )}
         </button>
         <button style={tabStyle('wwff')} onClick={() => handleTabChange('wwff')}>
-          ▲ WWFF {wwffData?.length > 0 ? `(${wwffData.length})` : ''}{wwffStaleMin >= 5 && <span style={{ color: wwffStaleMin >= 10 ? '#ff4444' : '#ffaa00' }}>{staleWarning(wwffStaleMin)}</span>}
+          ▲ WWFF {wwffData?.length > 0 ? `(${wwffData.length})` : ''}
+          {wwffStaleMin >= 5 && (
+            <span style={{ color: wwffStaleMin >= 10 ? '#ff4444' : '#ffaa00' }}>{staleWarning(wwffStaleMin)}</span>
+          )}
         </button>
         <button style={tabStyle('sota')} onClick={() => handleTabChange('sota')}>
-          ⛰ SOTA {sotaData?.length > 0 ? `(${sotaData.length})` : ''}{sotaStaleMin >= 5 && <span style={{ color: sotaStaleMin >= 10 ? '#ff4444' : '#ffaa00' }}>{staleWarning(sotaStaleMin)}</span>}
+          ⛰ SOTA {sotaData?.length > 0 ? `(${sotaData.length})` : ''}
+          {sotaStaleMin >= 5 && (
+            <span style={{ color: sotaStaleMin >= 10 ? '#ff4444' : '#ffaa00' }}>{staleWarning(sotaStaleMin)}</span>
+          )}
         </button>
       </div>
 
diff --git a/src/components/PropagationPanel.jsx b/src/components/PropagationPanel.jsx
index 86fa7d7f..04a24690 100644
--- a/src/components/PropagationPanel.jsx
+++ b/src/components/PropagationPanel.jsx
@@ -6,7 +6,14 @@ import React, { useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { formatDistance } from '../utils/geo.js';
 
-export const PropagationPanel = ({ propagation, loading, bandConditions, forcedMode, units = 'imperial', propConfig = {} }) => {
+export const PropagationPanel = ({
+  propagation,
+  loading,
+  bandConditions,
+  forcedMode,
+  units = 'imperial',
+  propConfig = {},
+}) => {
   const { t } = useTranslation();
   // Load view mode preference from localStorage
   const [internalViewMode, setViewMode] = useState(() => {
@@ -14,7 +21,9 @@ export const PropagationPanel = ({ propagation, loading, bandConditions, forcedM
       const saved = localStorage.getItem('openhamclock_voacapViewMode');
       if (saved === 'bars' || saved === 'bands') return saved;
       return 'chart';
-    } catch (e) { return 'chart'; }
+    } catch (e) {
+      return 'chart';
+    }
   });
 
   // When forcedMode is set, lock to that mode (used by dockable sub-panels)
@@ -26,7 +35,9 @@ export const PropagationPanel = ({ propagation, loading, bandConditions, forcedM
       const saved = localStorage.getItem('openhamclock_voacapColorScheme');
       if (saved === 'heatmap') return 'heatmap';
       return 'stoplight';
-    } catch (e) { return 'stoplight'; }
+    } catch (e) {
+      return 'stoplight';
+    }
   });
 
   const toggleColorScheme = (e) => {
@@ -35,7 +46,7 @@ export const PropagationPanel = ({ propagation, loading, bandConditions, forcedM
     setColorScheme(newScheme);
     try {
       localStorage.setItem('openhamclock_voacapColorScheme', newScheme);
-    } catch (e) { }
+    } catch (e) {}
   };
 
   // Cycle through view modes
@@ -46,14 +57,15 @@ export const PropagationPanel = ({ propagation, loading, bandConditions, forcedM
     setViewMode(newMode);
     try {
       localStorage.setItem('openhamclock_voacapViewMode', newMode);
-    } catch (e) { }
+    } catch (e) {}
   };
 
-  const getBandStyle = (condition) => ({
-    GOOD: { bg: 'rgba(0,255,136,0.2)', color: '#00ff88', border: 'rgba(0,255,136,0.4)' },
-    FAIR: { bg: 'rgba(255,180,50,0.2)', color: '#ffb432', border: 'rgba(255,180,50,0.4)' },
-    POOR: { bg: 'rgba(255,68,102,0.2)', color: '#ff4466', border: 'rgba(255,68,102,0.4)' }
-  }[condition] || { bg: 'rgba(255,180,50,0.2)', color: '#ffb432', border: 'rgba(255,180,50,0.4)' });
+  const getBandStyle = (condition) =>
+    ({
+      GOOD: { bg: 'rgba(0,255,136,0.2)', color: '#00ff88', border: 'rgba(0,255,136,0.4)' },
+      FAIR: { bg: 'rgba(255,180,50,0.2)', color: '#ffb432', border: 'rgba(255,180,50,0.4)' },
+      POOR: { bg: 'rgba(255,68,102,0.2)', color: '#ff4466', border: 'rgba(255,68,102,0.4)' },
+    })[condition] || { bg: 'rgba(255,180,50,0.2)', color: '#ffb432', border: 'rgba(255,180,50,0.4)' };
 
   if (loading || !propagation) {
     return (
@@ -66,7 +78,8 @@ export const PropagationPanel = ({ propagation, loading, bandConditions, forcedM
     );
   }
 
-  const { solarData, distance, currentBands, currentHour, hourlyPredictions, muf, luf, ionospheric, dataSource } = propagation;
+  const { solarData, distance, currentBands, currentHour, hourlyPredictions, muf, luf, ionospheric, dataSource } =
+    propagation;
   const hasRealData = ionospheric?.method === 'direct' || ionospheric?.method === 'interpolated';
   const isDaytime = new Date().getUTCHours() >= 6 && new Date().getUTCHours() <= 18;
 
@@ -93,9 +106,10 @@ export const PropagationPanel = ({ propagation, loading, bandConditions, forcedM
   };
 
   // Legend colors (must match getHeatColor order low→high)
-  const legendColors = colorScheme === 'heatmap'
-    ? ['#004400', '#00aa00', '#88cc00', '#ffcc00', '#ff6600', '#ff0000']
-    : ['#441111', '#cc2200', '#ff6600', '#ffcc00', '#55bb00', '#00cc00'];
+  const legendColors =
+    colorScheme === 'heatmap'
+      ? ['#004400', '#00aa00', '#88cc00', '#ffcc00', '#ff6600', '#ff0000']
+      : ['#441111', '#cc2200', '#ff6600', '#ffcc00', '#55bb00', '#00cc00'];
 
   const getReliabilityColor = (rel) => {
     if (rel >= 70) return '#00ff88';
@@ -107,21 +121,31 @@ export const PropagationPanel = ({ propagation, loading, bandConditions, forcedM
 
   const translateCondition = (cond) => {
     switch (cond) {
-      case 'GOOD': return t('band.conditions.good');
-      case 'FAIR': return t('band.conditions.fair');
-      case 'POOR': return t('band.conditions.poor');
-      default: return cond;
+      case 'GOOD':
+        return t('band.conditions.good');
+      case 'FAIR':
+        return t('band.conditions.fair');
+      case 'POOR':
+        return t('band.conditions.poor');
+      default:
+        return cond;
     }
   };
 
   const getStatusColor = (status) => {
     switch (status) {
-      case 'EXCELLENT': return '#00ff88';
-      case 'GOOD': return '#88ff00';
-      case 'FAIR': return '#ffcc00';
-      case 'POOR': return '#ff8800';
-      case 'CLOSED': return '#ff4444';
-      default: return 'var(--text-muted)';
+      case 'EXCELLENT':
+        return '#00ff88';
+      case 'GOOD':
+        return '#88ff00';
+      case 'FAIR':
+        return '#ffcc00';
+      case 'POOR':
+        return '#ff8800';
+      case 'CLOSED':
+        return '#ff4444';
+      default:
+        return 'var(--text-muted)';
     }
   };
 
@@ -129,15 +153,21 @@ export const PropagationPanel = ({ propagation, loading, bandConditions, forcedM
   const viewModeLabels = {
     chart: t('propagation.view.chart'),
     bars: t('propagation.view.bars'),
-    bands: t('propagation.view.bands')
+    bands: t('propagation.view.bands'),
   };
 
   return (
-    <div className="panel" style={{ cursor: forcedMode ? 'default' : 'pointer' }} onClick={forcedMode ? undefined : cycleViewMode}>
+    <div
+      className="panel"
+      style={{ cursor: forcedMode ? 'default' : 'pointer' }}
+      onClick={forcedMode ? undefined : cycleViewMode}
+    >
       <div className="panel-header" style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
         <span>
           {viewMode === 'bands' ? t('band.conditions') : '⌇ VOACAP'}
-          {hasRealData && viewMode !== 'bands' && <span style={{ color: '#00ff88', fontSize: '10px', marginLeft: '4px' }}>●</span>}
+          {hasRealData && viewMode !== 'bands' && (
+            <span style={{ color: '#00ff88', fontSize: '10px', marginLeft: '4px' }}>●</span>
+          )}
         </span>
         {!forcedMode && (
           <span style={{ fontSize: '10px', color: 'var(--text-muted)' }}>
@@ -148,21 +178,31 @@ export const PropagationPanel = ({ propagation, loading, bandConditions, forcedM
 
       {/* Mode & Power indicator */}
       {(propConfig.mode || propConfig.power) && viewMode !== 'bands' && (
-        <div style={{
-          display: 'flex', justifyContent: 'center', gap: '8px',
-          padding: '2px 0 4px', fontSize: '10px', color: 'var(--text-muted)',
-          borderBottom: '1px solid var(--border-color)', marginBottom: '4px'
-        }}>
-          <span style={{ color: 'var(--accent-amber)' }}>
-            {propConfig.mode || 'SSB'}
-          </span>
+        <div
+          style={{
+            display: 'flex',
+            justifyContent: 'center',
+            gap: '8px',
+            padding: '2px 0 4px',
+            fontSize: '10px',
+            color: 'var(--text-muted)',
+            borderBottom: '1px solid var(--border-color)',
+            marginBottom: '4px',
+          }}
+        >
+          <span style={{ color: 'var(--accent-amber)' }}>{propConfig.mode || 'SSB'}</span>
           <span>•</span>
-          <span>{(propConfig.power || 100) >= 1000 ? `${((propConfig.power || 100) / 1000).toFixed(1)}kW` : `${propConfig.power || 100}W`}</span>
+          <span>
+            {(propConfig.power || 100) >= 1000
+              ? `${((propConfig.power || 100) / 1000).toFixed(1)}kW`
+              : `${propConfig.power || 100}W`}
+          </span>
           {propagation?.signalMargin !== undefined && propagation.signalMargin !== 0 && (
             <>
               <span>•</span>
               <span style={{ color: propagation.signalMargin > 0 ? '#00ff88' : '#ff6644' }}>
-                {propagation.signalMargin > 0 ? '+' : ''}{propagation.signalMargin}dB
+                {propagation.signalMargin > 0 ? '+' : ''}
+                {propagation.signalMargin}dB
               </span>
             </>
           )}
@@ -174,7 +214,9 @@ export const PropagationPanel = ({ propagation, loading, bandConditions, forcedM
         <div style={{ padding: '4px' }}>
           {/* Day/Night toggle indicator */}
           {bandConditions?.extras?.source && (
-            <div style={{ display: 'flex', justifyContent: 'center', gap: '12px', marginBottom: '4px', fontSize: '10px' }}>
+            <div
+              style={{ display: 'flex', justifyContent: 'center', gap: '12px', marginBottom: '4px', fontSize: '10px' }}
+            >
               <span style={{ color: isDaytime ? '#ffcc00' : 'var(--text-muted)' }}>
                 ☀ {t('propagation.day')} {isDaytime ? `(${t('propagation.now')})` : ''}
               </span>
@@ -188,19 +230,30 @@ export const PropagationPanel = ({ propagation, loading, bandConditions, forcedM
               const style = getBandStyle(band.condition);
               const translatedCond = translateCondition(band.condition);
               return (
-                <div key={idx} style={{
-                  background: style.bg,
-                  border: `1px solid ${style.border}`,
-                  borderRadius: '4px',
-                  padding: '6px 2px',
-                  textAlign: 'center'
-                }}
+                <div
+                  key={idx}
+                  style={{
+                    background: style.bg,
+                    border: `1px solid ${style.border}`,
+                    borderRadius: '4px',
+                    padding: '6px 2px',
+                    textAlign: 'center',
+                  }}
                   title={`${band.band}: ${t('propagation.day')}=${band.day || band.condition} ${t('propagation.night')}=${band.night || band.condition}`}
                 >
-                  <div style={{ fontFamily: 'Orbitron, monospace', fontSize: '13px', fontWeight: '700', color: style.color }}>
+                  <div
+                    style={{
+                      fontFamily: 'Orbitron, monospace',
+                      fontSize: '13px',
+                      fontWeight: '700',
+                      color: style.color,
+                    }}
+                  >
                     {band.band}
                   </div>
-                  <div style={{ fontSize: '9px', fontWeight: '600', color: style.color, marginTop: '2px', opacity: 0.8 }}>
+                  <div
+                    style={{ fontSize: '9px', fontWeight: '600', color: style.color, marginTop: '2px', opacity: 0.8 }}
+                  >
                     {translatedCond}
                   </div>
                   {/* Day/Night mini indicator when both are available */}
@@ -217,22 +270,38 @@ export const PropagationPanel = ({ propagation, loading, bandConditions, forcedM
           {/* VHF Conditions */}
           {(bandConditions?.vhfConditions || []).length > 0 && (
             <div style={{ marginTop: '6px', padding: '4px', background: 'var(--bg-tertiary)', borderRadius: '4px' }}>
-              <div style={{ fontSize: '9px', color: 'var(--text-muted)', marginBottom: '3px', textTransform: 'uppercase', letterSpacing: '0.5px' }}>{t('propagation.vhf.title')}</div>
+              <div
+                style={{
+                  fontSize: '9px',
+                  color: 'var(--text-muted)',
+                  marginBottom: '3px',
+                  textTransform: 'uppercase',
+                  letterSpacing: '0.5px',
+                }}
+              >
+                {t('propagation.vhf.title')}
+              </div>
               <div style={{ display: 'flex', flexWrap: 'wrap', gap: '4px' }}>
                 {bandConditions.vhfConditions.map((v, i) => {
                   const isOpen = !v.condition?.toLowerCase().includes('closed');
-                  const label = v.name === 'vhf-aurora' ? 'Aurora'
-                    : v.name === 'E-Skip' ? `Es ${v.location?.replace('_', ' ').replace('north america', 'NA').replace('europe', 'EU').replace('6m', '6m EU').replace('4m', '4m EU')}`
-                      : v.name;
+                  const label =
+                    v.name === 'vhf-aurora'
+                      ? 'Aurora'
+                      : v.name === 'E-Skip'
+                        ? `Es ${v.location?.replace('_', ' ').replace('north america', 'NA').replace('europe', 'EU').replace('6m', '6m EU').replace('4m', '4m EU')}`
+                        : v.name;
                   return (
-                    <span key={i} style={{
-                      fontSize: '9px',
-                      padding: '1px 4px',
-                      borderRadius: '2px',
-                      background: isOpen ? 'rgba(0,255,136,0.15)' : 'rgba(255,255,255,0.05)',
-                      color: isOpen ? '#00ff88' : 'var(--text-muted)',
-                      border: `1px solid ${isOpen ? 'rgba(0,255,136,0.3)' : 'rgba(255,255,255,0.1)'}`
-                    }}>
+                    <span
+                      key={i}
+                      style={{
+                        fontSize: '9px',
+                        padding: '1px 4px',
+                        borderRadius: '2px',
+                        background: isOpen ? 'rgba(0,255,136,0.15)' : 'rgba(255,255,255,0.05)',
+                        color: isOpen ? '#00ff88' : 'var(--text-muted)',
+                        border: `1px solid ${isOpen ? 'rgba(0,255,136,0.3)' : 'rgba(255,255,255,0.1)'}`,
+                      }}
+                    >
                       {label}: {isOpen ? v.condition : t('propagation.vhf.closed')}
                     </span>
                   );
@@ -243,19 +312,38 @@ export const PropagationPanel = ({ propagation, loading, bandConditions, forcedM
 
           {/* Geomag + Signal Noise + Source */}
           <div style={{ marginTop: '4px', fontSize: '10px', color: 'var(--text-muted)', textAlign: 'center' }}>
-            <span>SFI {solarData?.sfi} • K {solarData?.kIndex}</span>
+            <span>
+              SFI {solarData?.sfi} • K {solarData?.kIndex}
+            </span>
             {bandConditions?.extras?.geomagField && (
-              <span> • {t('propagation.geomag')}: <span style={{
-                color: bandConditions.extras.geomagField === 'QUIET' ? 'var(--accent-green)' :
-                  bandConditions.extras.geomagField === 'ACTIVE' || bandConditions.extras.geomagField === 'STORM' ? 'var(--accent-red)' :
-                    'var(--accent-amber)'
-              }}>{bandConditions.extras.geomagField}</span></span>
+              <span>
+                {' '}
+                • {t('propagation.geomag')}:{' '}
+                <span
+                  style={{
+                    color:
+                      bandConditions.extras.geomagField === 'QUIET'
+                        ? 'var(--accent-green)'
+                        : bandConditions.extras.geomagField === 'ACTIVE' ||
+                            bandConditions.extras.geomagField === 'STORM'
+                          ? 'var(--accent-red)'
+                          : 'var(--accent-amber)',
+                  }}
+                >
+                  {bandConditions.extras.geomagField}
+                </span>
+              </span>
             )}
             {bandConditions?.extras?.signalNoise && (
-              <span> • {t('propagation.noise')}: {bandConditions.extras.signalNoise}</span>
+              <span>
+                {' '}
+                • {t('propagation.noise')}: {bandConditions.extras.signalNoise}
+              </span>
             )}
           </div>
-          <div style={{ fontSize: '9px', color: 'var(--text-muted)', textAlign: 'center', marginTop: '2px', opacity: 0.6 }}>
+          <div
+            style={{ fontSize: '9px', color: 'var(--text-muted)', textAlign: 'center', marginTop: '2px', opacity: 0.6 }}
+          >
             {bandConditions?.extras?.source === 'N0NBH' ? 'Source: N0NBH / NOAA' : t('propagation.source.general')}
             {bandConditions?.extras?.updated && ` • ${bandConditions.extras.updated}`}
           </div>
@@ -263,15 +351,17 @@ export const PropagationPanel = ({ propagation, loading, bandConditions, forcedM
       ) : (
         <>
           {/* MUF/LUF and Data Source Info */}
-          <div style={{
-            display: 'flex',
-            justifyContent: 'space-between',
-            padding: '4px 8px',
-            background: hasRealData ? 'rgba(0, 255, 136, 0.1)' : 'var(--bg-tertiary)',
-            borderRadius: '4px',
-            marginBottom: '4px',
-            fontSize: '11px'
-          }}>
+          <div
+            style={{
+              display: 'flex',
+              justifyContent: 'space-between',
+              padding: '4px 8px',
+              background: hasRealData ? 'rgba(0, 255, 136, 0.1)' : 'var(--bg-tertiary)',
+              borderRadius: '4px',
+              marginBottom: '4px',
+              fontSize: '11px',
+            }}
+          >
             <div style={{ display: 'flex', gap: '12px' }}>
               <span>
                 <span style={{ color: 'var(--text-muted)' }}>MUF </span>
@@ -287,18 +377,19 @@ export const PropagationPanel = ({ propagation, loading, bandConditions, forcedM
             <span style={{ color: hasRealData ? '#00ff88' : 'var(--text-muted)', fontSize: '10px' }}>
               {hasRealData
                 ? `⌇ Iono: ${ionospheric?.source || 'ionosonde'}${ionospheric?.distance ? ` (${formatDistance(ionospheric.distance, units)} from path)` : ''}`
-                : `⚡ ${t('propagation.estimated')}`
-              }
+                : `⚡ ${t('propagation.estimated')}`}
             </span>
             {dataSource && dataSource.includes('ITU') && (
-              <span style={{
-                color: '#ff6b35',
-                fontSize: '9px',
-                marginLeft: '8px',
-                padding: '1px 4px',
-                background: 'rgba(255,107,53,0.15)',
-                borderRadius: '3px'
-              }}>
+              <span
+                style={{
+                  color: '#ff6b35',
+                  fontSize: '9px',
+                  marginLeft: '8px',
+                  padding: '1px 4px',
+                  background: 'rgba(255,107,53,0.15)',
+                  borderRadius: '3px',
+                }}
+              >
                 🔬 ITU-R P.533
               </span>
             )}
@@ -307,36 +398,40 @@ export const PropagationPanel = ({ propagation, loading, bandConditions, forcedM
           {viewMode === 'chart' ? (
             /* VOACAP Heat Map Chart View */
             <div style={{ padding: '4px' }}>
-              <div style={{
-                display: 'grid',
-                gridTemplateColumns: '28px repeat(24, 1fr)',
-                gridTemplateRows: `repeat(${bands.length}, 12px)`,
-                gap: '1px',
-                fontSize: '12px',
-                fontFamily: 'JetBrains Mono, monospace'
-              }}>
+              <div
+                style={{
+                  display: 'grid',
+                  gridTemplateColumns: '28px repeat(24, 1fr)',
+                  gridTemplateRows: `repeat(${bands.length}, 12px)`,
+                  gap: '1px',
+                  fontSize: '12px',
+                  fontFamily: 'JetBrains Mono, monospace',
+                }}
+              >
                 {bands.map((band) => (
                   <React.Fragment key={band}>
-                    <div style={{
-                      display: 'flex',
-                      alignItems: 'center',
-                      justifyContent: 'flex-end',
-                      paddingRight: '4px',
-                      color: 'var(--text-muted)',
-                      fontSize: '12px'
-                    }}>
+                    <div
+                      style={{
+                        display: 'flex',
+                        alignItems: 'center',
+                        justifyContent: 'flex-end',
+                        paddingRight: '4px',
+                        color: 'var(--text-muted)',
+                        fontSize: '12px',
+                      }}
+                    >
                       {band.replace('m', '')}
                     </div>
                     {Array.from({ length: 24 }, (_, hour) => {
                       let rel = 0;
                       if (hour === currentHour && currentBands?.length > 0) {
-                        const currentBandData = currentBands.find(b => b.band === band);
+                        const currentBandData = currentBands.find((b) => b.band === band);
                         if (currentBandData) {
                           rel = currentBandData.reliability || 0;
                         }
                       } else {
                         const bandData = hourlyPredictions?.[band];
-                        const hourData = bandData?.find(h => h.hour === hour);
+                        const hourData = bandData?.find((h) => h.hour === hour);
                         rel = hourData?.reliability || 0;
                       }
                       return (
@@ -345,7 +440,7 @@ export const PropagationPanel = ({ propagation, loading, bandConditions, forcedM
                           style={{
                             background: getHeatColor(rel),
                             borderRadius: '1px',
-                            border: hour === currentHour ? '1px solid white' : 'none'
+                            border: hour === currentHour ? '1px solid white' : 'none',
                           }}
                           title={`${band} @ ${hour}:00 UTC: ${rel}%`}
                         />
@@ -356,27 +451,35 @@ export const PropagationPanel = ({ propagation, loading, bandConditions, forcedM
               </div>
 
               {/* Hour labels */}
-              <div style={{
-                display: 'grid',
-                gridTemplateColumns: '28px repeat(24, 1fr)',
-                marginTop: '2px',
-                fontSize: '9px',
-                color: 'var(--text-muted)'
-              }}>
+              <div
+                style={{
+                  display: 'grid',
+                  gridTemplateColumns: '28px repeat(24, 1fr)',
+                  marginTop: '2px',
+                  fontSize: '9px',
+                  color: 'var(--text-muted)',
+                }}
+              >
                 <div>UTC</div>
-                {[0, '', '', 3, '', '', 6, '', '', 9, '', '', 12, '', '', 15, '', '', 18, '', '', 21, '', ''].map((h, i) => (
-                  <div key={i} style={{ textAlign: 'center' }}>{h}</div>
-                ))}
+                {[0, '', '', 3, '', '', 6, '', '', 9, '', '', 12, '', '', 15, '', '', 18, '', '', 21, '', ''].map(
+                  (h, i) => (
+                    <div key={i} style={{ textAlign: 'center' }}>
+                      {h}
+                    </div>
+                  ),
+                )}
               </div>
 
               {/* Legend */}
-              <div style={{
-                marginTop: '6px',
-                display: 'flex',
-                justifyContent: 'space-between',
-                alignItems: 'center',
-                fontSize: '11px'
-              }}>
+              <div
+                style={{
+                  marginTop: '6px',
+                  display: 'flex',
+                  justifyContent: 'space-between',
+                  alignItems: 'center',
+                  fontSize: '11px',
+                }}
+              >
                 <div style={{ display: 'flex', gap: '2px', alignItems: 'center' }}>
                   <span style={{ color: 'var(--text-muted)' }}>REL:</span>
                   {legendColors.map((c, i) => (
@@ -393,70 +496,105 @@ export const PropagationPanel = ({ propagation, loading, bandConditions, forcedM
                       borderRadius: '3px',
                       cursor: 'pointer',
                       border: '1px solid rgba(255,255,255,0.1)',
-                      userSelect: 'none'
+                      userSelect: 'none',
                     }}
-                    title={colorScheme === 'stoplight' ? t('propagation.heatmap.tooltip.voacap') : t('propagation.heatmap.tooltip.stoplight')}
+                    title={
+                      colorScheme === 'stoplight'
+                        ? t('propagation.heatmap.tooltip.voacap')
+                        : t('propagation.heatmap.tooltip.stoplight')
+                    }
                   >
                     {colorScheme === 'stoplight' ? '🚦' : '🌡️'}
                   </span>
                 </div>
                 <div style={{ color: 'var(--text-muted)' }}>
-                  {formatDistance(distance || 0, units)} • {ionospheric?.foF2 ? `foF2=${ionospheric.foF2}` : `SSN=${solarData?.ssn}`}
+                  {formatDistance(distance || 0, units)} •{' '}
+                  {ionospheric?.foF2 ? `foF2=${ionospheric.foF2}` : `SSN=${solarData?.ssn}`}
                 </div>
               </div>
             </div>
           ) : (
             /* Bar Chart View */
             <div style={{ fontSize: '13px' }}>
-              <div style={{
-                display: 'flex',
-                justifyContent: 'space-around',
-                padding: '4px',
-                marginBottom: '4px',
-                background: 'var(--bg-tertiary)',
-                borderRadius: '4px',
-                fontSize: '11px'
-              }}>
-                <span><span style={{ color: 'var(--text-muted)' }}>SFI </span><span style={{ color: 'var(--accent-amber)' }}>{solarData?.sfi}</span></span>
+              <div
+                style={{
+                  display: 'flex',
+                  justifyContent: 'space-around',
+                  padding: '4px',
+                  marginBottom: '4px',
+                  background: 'var(--bg-tertiary)',
+                  borderRadius: '4px',
+                  fontSize: '11px',
+                }}
+              >
+                <span>
+                  <span style={{ color: 'var(--text-muted)' }}>SFI </span>
+                  <span style={{ color: 'var(--accent-amber)' }}>{solarData?.sfi}</span>
+                </span>
                 {ionospheric?.foF2 ? (
-                  <span><span style={{ color: 'var(--text-muted)' }}>foF2 </span><span style={{ color: '#00ff88' }}>{ionospheric.foF2}</span></span>
+                  <span>
+                    <span style={{ color: 'var(--text-muted)' }}>foF2 </span>
+                    <span style={{ color: '#00ff88' }}>{ionospheric.foF2}</span>
+                  </span>
                 ) : (
-                  <span><span style={{ color: 'var(--text-muted)' }}>SSN </span><span style={{ color: 'var(--accent-cyan)' }}>{solarData?.ssn}</span></span>
+                  <span>
+                    <span style={{ color: 'var(--text-muted)' }}>SSN </span>
+                    <span style={{ color: 'var(--accent-cyan)' }}>{solarData?.ssn}</span>
+                  </span>
                 )}
-                <span><span style={{ color: 'var(--text-muted)' }}>K </span><span style={{ color: solarData?.kIndex >= 4 ? '#ff4444' : '#00ff88' }}>{solarData?.kIndex}</span></span>
+                <span>
+                  <span style={{ color: 'var(--text-muted)' }}>K </span>
+                  <span style={{ color: solarData?.kIndex >= 4 ? '#ff4444' : '#00ff88' }}>{solarData?.kIndex}</span>
+                </span>
               </div>
 
               {(currentBands || []).slice(0, 11).map((band) => (
-                <div key={band.band} style={{
-                  display: 'grid',
-                  gridTemplateColumns: '32px 1fr 40px',
-                  gap: '4px',
-                  padding: '2px 0',
-                  alignItems: 'center'
-                }}>
-                  <span style={{
-                    fontFamily: 'JetBrains Mono, monospace',
-                    fontSize: '12px',
-                    color: band.reliability >= 50 ? 'var(--accent-green)' : 'var(--text-muted)'
-                  }}>
+                <div
+                  key={band.band}
+                  style={{
+                    display: 'grid',
+                    gridTemplateColumns: '32px 1fr 40px',
+                    gap: '4px',
+                    padding: '2px 0',
+                    alignItems: 'center',
+                  }}
+                >
+                  <span
+                    style={{
+                      fontFamily: 'JetBrains Mono, monospace',
+                      fontSize: '12px',
+                      color: band.reliability >= 50 ? 'var(--accent-green)' : 'var(--text-muted)',
+                    }}
+                  >
                     {band.band}
                   </span>
-                  <div style={{ position: 'relative', height: '10px', background: 'var(--bg-tertiary)', borderRadius: '2px' }}>
-                    <div style={{
-                      position: 'absolute',
-                      top: 0,
-                      left: 0,
-                      height: '100%',
-                      width: `${band.reliability}%`,
-                      background: getReliabilityColor(band.reliability),
-                      borderRadius: '2px'
-                    }} />
+                  <div
+                    style={{
+                      position: 'relative',
+                      height: '10px',
+                      background: 'var(--bg-tertiary)',
+                      borderRadius: '2px',
+                    }}
+                  >
+                    <div
+                      style={{
+                        position: 'absolute',
+                        top: 0,
+                        left: 0,
+                        height: '100%',
+                        width: `${band.reliability}%`,
+                        background: getReliabilityColor(band.reliability),
+                        borderRadius: '2px',
+                      }}
+                    />
                   </div>
-                  <span style={{
-                    textAlign: 'right',
-                    fontSize: '12px',
-                    color: getStatusColor(band.status)
-                  }}>
+                  <span
+                    style={{
+                      textAlign: 'right',
+                      fontSize: '12px',
+                      color: getStatusColor(band.status),
+                    }}
+                  >
                     {band.reliability}%
                   </span>
                 </div>
diff --git a/src/components/RigControlPanel.jsx b/src/components/RigControlPanel.jsx
index 94446955..be533a12 100644
--- a/src/components/RigControlPanel.jsx
+++ b/src/components/RigControlPanel.jsx
@@ -1,26 +1,15 @@
-import React, { useState } from "react";
-import { useTranslation } from "react-i18next";
-import { useRig } from "../contexts/RigContext";
+import React, { useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { useRig } from '../contexts/RigContext';
 
 const RigControlPanel = () => {
   const { t } = useTranslation();
-  const {
-    connected,
-    enabled,
-    freq,
-    mode,
-    ptt,
-    setFreq,
-    setMode,
-    setPTT,
-    error,
-    tuneTo,
-  } = useRig();
-  const [inputFreq, setInputFreq] = useState("");
+  const { connected, enabled, freq, mode, ptt, setFreq, setMode, setPTT, error, tuneTo } = useRig();
+  const [inputFreq, setInputFreq] = useState('');
 
   // Format frequency to MHz (e.g., 14.074.000)
   const formatFreq = (f) => {
-    if (!f) return "---.---.---";
+    if (!f) return '---.---.---';
     return (f / 1000000).toFixed(6);
   };
 
@@ -29,27 +18,27 @@ const RigControlPanel = () => {
     if (inputFreq) {
       // tuneTo handles parsing (MHz/kHz/Hz) and sets mode automatically via band plan
       tuneTo(inputFreq);
-      setInputFreq("");
+      setInputFreq('');
     }
   };
 
   // Determine status
-  let statusColor = "red";
-  let statusTitle = t("app.rigControl.disconnected");
+  let statusColor = 'red';
+  let statusTitle = t('app.rigControl.disconnected');
 
   if (!enabled) {
-    statusColor = "grey";
-    statusTitle = t("app.rigControl.disabled");
+    statusColor = 'grey';
+    statusTitle = t('app.rigControl.disabled');
   } else if (connected) {
-    statusColor = "green";
-    statusTitle = t("app.rigControl.connected");
+    statusColor = 'green';
+    statusTitle = t('app.rigControl.connected');
   }
 
   return (
     <div className="panel rig-control-panel">
       <div className="panel-header">
         <h3>
-          <span className="icon">📻</span> {t("app.rigControl.title")}
+          <span className="icon">📻</span> {t('app.rigControl.title')}
         </h3>
         <div className="panel-controls">
           <span className={`status-led ${statusColor}`} title={statusTitle} />
@@ -57,16 +46,13 @@ const RigControlPanel = () => {
       </div>
 
       <div className="panel-content">
-        {error && (
-          <div className="error-banner">{t("app.rigControl.error.daemon")}</div>
-        )}
+        {error && <div className="error-banner">{t('app.rigControl.error.daemon')}</div>}
 
         <div className="rig-display">
-          <div className={`frequency-readout ${ptt ? "transmitting" : ""}`}>
-            {formatFreq(freq)}{" "}
-            <span className="unit">{t("app.units.mhz")}</span>
+          <div className={`frequency-readout ${ptt ? 'transmitting' : ''}`}>
+            {formatFreq(freq)} <span className="unit">{t('app.units.mhz')}</span>
           </div>
-          <div className="mode-badge">{mode || "---"}</div>
+          <div className="mode-badge">{mode || '---'}</div>
         </div>
 
         <div className="rig-controls">
@@ -74,26 +60,26 @@ const RigControlPanel = () => {
             <input
               type="number"
               step="0.0001"
-              placeholder={t("app.rigControl.setFreqPlaceholder")}
+              placeholder={t('app.rigControl.setFreqPlaceholder')}
               value={inputFreq}
               onChange={(e) => setInputFreq(e.target.value)}
               disabled={!enabled}
             />
             <button type="submit" disabled={!enabled}>
-              {t("app.rigControl.set")}
+              {t('app.rigControl.set')}
             </button>
           </form>
 
           <div className="ptt-control">
             <button
-              className={`ptt-btn ${ptt ? "active" : ""}`}
+              className={`ptt-btn ${ptt ? 'active' : ''}`}
               onMouseDown={() => setPTT(true)}
               onMouseUp={() => setPTT(false)}
               onTouchStart={() => setPTT(true)}
               onTouchEnd={() => setPTT(false)}
               disabled={!enabled}
             >
-              {t("app.rigControl.ptt")}
+              {t('app.rigControl.ptt')}
             </button>
           </div>
         </div>
diff --git a/src/components/RotatorMapOverlay.jsx b/src/components/RotatorMapOverlay.jsx
index cdfd90ab..6734aa08 100644
--- a/src/components/RotatorMapOverlay.jsx
+++ b/src/components/RotatorMapOverlay.jsx
@@ -1,4 +1,4 @@
-import React, { useEffect, useMemo, useRef, useState } from "react";
+import React, { useEffect, useMemo, useRef, useState } from 'react';
 
 /**
  * RotatorMapOverlay V1
@@ -7,9 +7,9 @@ import React, { useEffect, useMemo, useRef, useState } from "react";
  */
 export default function RotatorMapOverlay({
   enabled,
-  deLocation,          // expects { lat, lon } or { latitude, longitude }
-  azimuth,             // degrees (0=N, 90=E)
-  lastGoodAzimuth,     // fallback when azimuth is null/stale
+  deLocation, // expects { lat, lon } or { latitude, longitude }
+  azimuth, // degrees (0=N, 90=E)
+  lastGoodAzimuth, // fallback when azimuth is null/stale
 }) {
   const wrapRef = useRef(null);
   const [size, setSize] = useState({ w: 0, h: 0 });
@@ -41,10 +41,10 @@ export default function RotatorMapOverlay({
   }, [azimuth, lastGoodAzimuth]);
 
   const pathD = useMemo(() => {
-    if (!enabled) return "";
-    if (!Number.isFinite(lat) || !Number.isFinite(lon)) return "";
-    if (!usedAz && usedAz !== 0) return "";
-    if (!size.w || !size.h) return "";
+    if (!enabled) return '';
+    if (!Number.isFinite(lat) || !Number.isFinite(lon)) return '';
+    if (!usedAz && usedAz !== 0) return '';
+    if (!size.w || !size.h) return '';
 
     // Start pixel from DE
     const p0 = projectEquirect(lon, lat, size.w, size.h);
@@ -72,11 +72,11 @@ export default function RotatorMapOverlay({
     <div
       ref={wrapRef}
       style={{
-        position: "absolute",
+        position: 'absolute',
         inset: 0,
-        pointerEvents: "none",
+        pointerEvents: 'none',
         zIndex: 2005,
-        background: "transparent",
+        background: 'transparent',
       }}
     >
       <svg
@@ -100,18 +100,17 @@ export default function RotatorMapOverlay({
 }
 
 function normalizeLatLon(loc) {
-  if (!loc || typeof loc !== "object") return { lat: NaN, lon: NaN };
+  if (!loc || typeof loc !== 'object') return { lat: NaN, lon: NaN };
 
-  const lat =
-    Number.isFinite(loc.lat) ? loc.lat :
-    Number.isFinite(loc.latitude) ? loc.latitude :
-    NaN;
+  const lat = Number.isFinite(loc.lat) ? loc.lat : Number.isFinite(loc.latitude) ? loc.latitude : NaN;
 
-  const lon =
-    Number.isFinite(loc.lon) ? loc.lon :
-    Number.isFinite(loc.lng) ? loc.lng :
-    Number.isFinite(loc.longitude) ? loc.longitude :
-    NaN;
+  const lon = Number.isFinite(loc.lon)
+    ? loc.lon
+    : Number.isFinite(loc.lng)
+      ? loc.lng
+      : Number.isFinite(loc.longitude)
+        ? loc.longitude
+        : NaN;
 
   return { lat, lon };
 }
@@ -133,8 +132,10 @@ function destinationPoint(latDeg, lonDeg, bearingDeg, distanceDeg) {
   const θ = toRad(bearingDeg);
   const δ = toRad(distanceDeg);
 
-  const sinφ1 = Math.sin(φ1), cosφ1 = Math.cos(φ1);
-  const sinδ = Math.sin(δ), cosδ = Math.cos(δ);
+  const sinφ1 = Math.sin(φ1),
+    cosφ1 = Math.cos(φ1);
+  const sinδ = Math.sin(δ),
+    cosδ = Math.cos(δ);
 
   const sinφ2 = sinφ1 * cosδ + cosφ1 * sinδ * Math.cos(θ);
   const φ2 = Math.asin(sinφ2);
diff --git a/src/components/RotatorPanel.jsx b/src/components/RotatorPanel.jsx
index 842c3c00..9ad2f903 100644
--- a/src/components/RotatorPanel.jsx
+++ b/src/components/RotatorPanel.jsx
@@ -1,5 +1,5 @@
-import React, { useRef, useMemo } from "react";
-import useRotator from "../hooks/useRotator";
+import React, { useRef, useMemo } from 'react';
+import useRotator from '../hooks/useRotator';
 
 /**
  * Rotator Panel V1
@@ -20,9 +20,7 @@ export default function RotatorPanel({
   onStop,
   controlsEnabled = true,
 }) {
-  
-  const { azimuth, lastGoodAzimuth, isStale } =
-  state ?? useRotator({ endpointUrl, pollMs, staleMs });
+  const { azimuth, lastGoodAzimuth, isStale } = state ?? useRotator({ endpointUrl, pollMs, staleMs });
 
   const displayAngleRef = useRef(null); // continuous angle
   const prevAzRef = useRef(null);
@@ -49,15 +47,15 @@ export default function RotatorPanel({
   }, [lastGoodAzimuth, azimuth]);
 
   const bearingText = useMemo(() => {
-    if (azimuth == null || Number.isNaN(azimuth)) return "--";
+    if (azimuth == null || Number.isNaN(azimuth)) return '--';
     const a = ((Math.round(azimuth) % 360) + 360) % 360;
-    return String(a).padStart(3, "0");
+    return String(a).padStart(3, '0');
   }, [azimuth]);
 
   const [showCompass, setShowCompass] = React.useState(() => {
     try {
-      const v = localStorage.getItem("ohc_rotator_showCompass");
-      return v === null ? true : v === "1";
+      const v = localStorage.getItem('ohc_rotator_showCompass');
+      return v === null ? true : v === '1';
     } catch {
       return true;
     }
@@ -66,7 +64,9 @@ export default function RotatorPanel({
   const toggleCompass = () => {
     setShowCompass((v) => {
       const next = !v;
-      try { localStorage.setItem("ohc_rotator_showCompass", next ? "1" : "0"); } catch {}
+      try {
+        localStorage.setItem('ohc_rotator_showCompass', next ? '1' : '0');
+      } catch {}
       return next;
     });
   };
@@ -75,53 +75,52 @@ export default function RotatorPanel({
     <div className="ohc-rotator-panel">
       <div className="ohc-rotator-header">
         <div className="ohc-rotator-meta">
-
           <button
             onClick={toggleCompass}
             style={{
               marginLeft: 10,
-              padding: "4px 10px",
+              padding: '4px 10px',
               borderRadius: 999,
               fontSize: 11,
-              fontFamily: "JetBrains Mono",
-              cursor: "pointer",
-              background: showCompass ? "rgba(0,255,255,0.15)" : "rgba(0,0,0,0.35)",
-              border: `1px solid ${showCompass ? "#00ffff" : "rgba(255,255,255,0.18)"}`,
-              color: showCompass ? "#00ffff" : "rgba(255,255,255,0.65)",
+              fontFamily: 'JetBrains Mono',
+              cursor: 'pointer',
+              background: showCompass ? 'rgba(0,255,255,0.15)' : 'rgba(0,0,0,0.35)',
+              border: `1px solid ${showCompass ? '#00ffff' : 'rgba(255,255,255,0.18)'}`,
+              color: showCompass ? '#00ffff' : 'rgba(255,255,255,0.65)',
             }}
-            title={showCompass ? "Hide compass" : "Show compass"}
+            title={showCompass ? 'Hide compass' : 'Show compass'}
           >
-            COMPASS {showCompass ? "ON" : "OFF"}
+            COMPASS {showCompass ? 'ON' : 'OFF'}
           </button>
 
-          {typeof onToggleOverlay === "function" && (
+          {typeof onToggleOverlay === 'function' && (
             <button
               onClick={onToggleOverlay}
               style={{
                 marginLeft: 10,
-                padding: "4px 10px",
+                padding: '4px 10px',
                 borderRadius: 999,
                 fontSize: 11,
-                fontFamily: "JetBrains Mono",
-                cursor: "pointer",
-                background: overlayEnabled ? "rgba(0,255,255,0.15)" : "rgba(0,0,0,0.35)",
-                border: `1px solid ${overlayEnabled ? "#00ffff" : "rgba(255,255,255,0.18)"}`,
-                color: overlayEnabled ? "#00ffff" : "rgba(255,255,255,0.65)",
+                fontFamily: 'JetBrains Mono',
+                cursor: 'pointer',
+                background: overlayEnabled ? 'rgba(0,255,255,0.15)' : 'rgba(0,0,0,0.35)',
+                border: `1px solid ${overlayEnabled ? '#00ffff' : 'rgba(255,255,255,0.18)'}`,
+                color: overlayEnabled ? '#00ffff' : 'rgba(255,255,255,0.65)',
               }}
-              title={overlayEnabled ? "Hide rotator bearing on map" : "Show rotator bearing on map"}
+              title={overlayEnabled ? 'Hide rotator bearing on map' : 'Show rotator bearing on map'}
             >
-              MAP {overlayEnabled ? "ON" : "OFF"}
+              MAP {overlayEnabled ? 'ON' : 'OFF'}
             </button>
           )}
         </div>
       </div>
-       
-      {typeof onTurnAzimuth === "function" && (
+
+      {typeof onTurnAzimuth === 'function' && (
         <div
           style={{
-            display: "flex",
-            flexDirection: "column",
-            alignItems: "center",
+            display: 'flex',
+            flexDirection: 'column',
+            alignItems: 'center',
             gap: 10,
             marginBottom: 12,
           }}
@@ -129,15 +128,15 @@ export default function RotatorPanel({
           {/* Row 1: Nudge + Stop */}
           <div
             style={{
-              display: "flex",
+              display: 'flex',
               gap: 8,
-              justifyContent: "center",
-              flexWrap: "wrap",
+              justifyContent: 'center',
+              flexWrap: 'wrap',
             }}
           >
             <button
               disabled={!controlsEnabled}
-              onClick={() => onTurnAzimuth(((Number(azimuth ?? lastGoodAzimuth ?? 0) - 10) % 360 + 360) % 360)}
+              onClick={() => onTurnAzimuth((((Number(azimuth ?? lastGoodAzimuth ?? 0) - 10) % 360) + 360) % 360)}
               style={btnStyle(!controlsEnabled)}
             >
               -10
@@ -145,14 +144,14 @@ export default function RotatorPanel({
 
             <button
               disabled={!controlsEnabled}
-              onClick={() => onTurnAzimuth(((Number(azimuth ?? lastGoodAzimuth ?? 0) - 5) % 360 + 360) % 360)}
+              onClick={() => onTurnAzimuth((((Number(azimuth ?? lastGoodAzimuth ?? 0) - 5) % 360) + 360) % 360)}
               style={btnStyle(!controlsEnabled)}
             >
               -5
             </button>
 
             <button
-              disabled={!controlsEnabled || typeof onStop !== "function"}
+              disabled={!controlsEnabled || typeof onStop !== 'function'}
               onClick={() => onStop?.()}
               style={btnStyle(!controlsEnabled)}
             >
@@ -161,7 +160,7 @@ export default function RotatorPanel({
 
             <button
               disabled={!controlsEnabled}
-              onClick={() => onTurnAzimuth(((Number(azimuth ?? lastGoodAzimuth ?? 0) + 5) % 360 + 360) % 360)}
+              onClick={() => onTurnAzimuth((((Number(azimuth ?? lastGoodAzimuth ?? 0) + 5) % 360) + 360) % 360)}
               style={btnStyle(!controlsEnabled)}
             >
               +5
@@ -169,7 +168,7 @@ export default function RotatorPanel({
 
             <button
               disabled={!controlsEnabled}
-              onClick={() => onTurnAzimuth(((Number(azimuth ?? lastGoodAzimuth ?? 0) + 10) % 360 + 360) % 360)}
+              onClick={() => onTurnAzimuth((((Number(azimuth ?? lastGoodAzimuth ?? 0) + 10) % 360) + 360) % 360)}
               style={btnStyle(!controlsEnabled)}
             >
               +10
@@ -179,15 +178,12 @@ export default function RotatorPanel({
           {/* Row 2: AZ input centered */}
           <div
             style={{
-              display: "flex",
-              justifyContent: "center",
-              width: "100%",
+              display: 'flex',
+              justifyContent: 'center',
+              width: '100%',
             }}
           >
-            <AzGoto
-              disabled={!controlsEnabled}
-              onGo={(v) => onTurnAzimuth(v)}
-            />
+            <AzGoto disabled={!controlsEnabled} onGo={(v) => onTurnAzimuth(v)} />
           </div>
 
           {/* Row 3: Tip centered */}
@@ -195,7 +191,7 @@ export default function RotatorPanel({
             style={{
               fontSize: 11,
               opacity: 0.65,
-              textAlign: "center",
+              textAlign: 'center',
             }}
           >
             Tip: <b>Shift-click</b> the map to turn
@@ -204,32 +200,28 @@ export default function RotatorPanel({
       )}
       <div className="ohc-rotator-body">
         {showCompass && (
-          <Compass
-            azimuth={azimuth ?? lastGoodAzimuth ?? 0}
-            displayAngle={displayAngle}
-            isStale={isStale}
-          />
+          <Compass azimuth={azimuth ?? lastGoodAzimuth ?? 0} displayAngle={displayAngle} isStale={isStale} />
         )}
 
         <div
           style={{
-            display: "flex",
-            justifyContent: "center",
+            display: 'flex',
+            justifyContent: 'center',
             marginTop: showCompass ? 16 : 10,
-            width: "100%",
+            width: '100%',
           }}
         >
           <div
             style={{
-              display: "inline-flex",
-              width: "fit-content",
-              alignItems: "baseline",
-              justifyContent: "center",
+              display: 'inline-flex',
+              width: 'fit-content',
+              alignItems: 'baseline',
+              justifyContent: 'center',
               gap: 6,
-              padding: "10px 16px",
+              padding: '10px 16px',
               borderRadius: 14,
-              border: "1px solid rgba(255,255,255,0.10)",
-              background: "rgba(255,255,255,0.03)",
+              border: '1px solid rgba(255,255,255,0.10)',
+              background: 'rgba(255,255,255,0.03)',
               minWidth: 160,
             }}
           >
@@ -239,7 +231,7 @@ export default function RotatorPanel({
                 fontWeight: 800,
                 letterSpacing: 1,
                 lineHeight: 1,
-                color: "rgba(255,255,255,0.85)",
+                color: 'rgba(255,255,255,0.85)',
               }}
             >
               {bearingText}
@@ -249,7 +241,7 @@ export default function RotatorPanel({
                 fontSize: 20,
                 opacity: 0.65,
                 fontWeight: 700,
-                position: "relative",
+                position: 'relative',
                 top: -4, // optional: nudges ° up
               }}
             >
@@ -265,9 +257,8 @@ export default function RotatorPanel({
 }
 
 function Compass({ azimuth, displayAngle, isStale }) {
-  
   return (
-    <div className={"ohc-compass " + (isStale ? "ohc-compass--stale" : "")}>
+    <div className={'ohc-compass ' + (isStale ? 'ohc-compass--stale' : '')}>
       <svg viewBox="0 0 200 200" className="ohc-compass-svg" aria-label="Compass">
         {/* Outer ring */}
         <circle cx="100" cy="100" r="92" className="ohc-compass-ring" />
@@ -288,7 +279,7 @@ function Compass({ azimuth, displayAngle, isStale }) {
                 x2="100"
                 y2={100 - r2}
                 transform={`rotate(${deg} 100 100)`}
-                className={isMajor ? "ohc-tick ohc-tick--major" : "ohc-tick"}
+                className={isMajor ? 'ohc-tick ohc-tick--major' : 'ohc-tick'}
               />
             );
           })}
@@ -314,27 +305,16 @@ function Compass({ azimuth, displayAngle, isStale }) {
         <g
           className="ohc-needle-wrap"
           style={{
-            transform: displayAngle == null
-              ? "none"
-              : `rotate(${displayAngle}deg)`,
-            transition: "transform 250ms linear",
+            transform: displayAngle == null ? 'none' : `rotate(${displayAngle}deg)`,
+            transition: 'transform 250ms linear',
           }}
         >
           {/* Needle body */}
-          <path
-            d="M100 40 L106 100 L100 160 L94 100 Z"
-            className="ohc-needle"
-          />
+          <path d="M100 40 L106 100 L100 160 L94 100 Z" className="ohc-needle" />
           {/* Red direction tip */}
-          <path
-            d="M100 34 L106 54 L94 54 Z"
-            className="ohc-needle-tip-red"
-          />
+          <path d="M100 34 L106 54 L94 54 Z" className="ohc-needle-tip-red" />
           {/* Needle tip highlight */}
-          <path
-            d="M100 40 L104 98 L100 100 Z"
-            className="ohc-needle-tip"
-          />
+          <path d="M100 40 L104 98 L100 100 Z" className="ohc-needle-tip" />
         </g>
 
         {/* Center cap */}
@@ -346,22 +326,22 @@ function Compass({ azimuth, displayAngle, isStale }) {
 }
 function btnStyle(disabled) {
   return {
-    padding: "4px 10px",
+    padding: '4px 10px',
     borderRadius: 999,
     fontSize: 11,
-    fontFamily: "JetBrains Mono",
-    cursor: disabled ? "not-allowed" : "pointer",
-    background: "rgba(0,0,0,0.35)",
-    border: "1px solid rgba(255,255,255,0.18)",
-    color: disabled ? "rgba(255,255,255,0.35)" : "rgba(255,255,255,0.75)",
+    fontFamily: 'JetBrains Mono',
+    cursor: disabled ? 'not-allowed' : 'pointer',
+    background: 'rgba(0,0,0,0.35)',
+    border: '1px solid rgba(255,255,255,0.18)',
+    color: disabled ? 'rgba(255,255,255,0.35)' : 'rgba(255,255,255,0.75)',
   };
 }
 
 function AzGoto({ disabled, onGo }) {
-  const [val, setVal] = React.useState("");
+  const [val, setVal] = React.useState('');
 
   return (
-    <div style={{ display: "flex", gap: 6, alignItems: "center" }}>
+    <div style={{ display: 'flex', gap: 6, alignItems: 'center' }}>
       <input
         disabled={disabled}
         value={val}
@@ -369,14 +349,14 @@ function AzGoto({ disabled, onGo }) {
         placeholder="AZ"
         style={{
           width: 56,
-          padding: "4px 8px",
+          padding: '4px 8px',
           borderRadius: 8,
           fontSize: 11,
-          fontFamily: "JetBrains Mono",
-          background: "rgba(0,0,0,0.35)",
-          border: "1px solid rgba(255,255,255,0.18)",
-          color: "rgba(255,255,255,0.85)",
-          outline: "none",
+          fontFamily: 'JetBrains Mono',
+          background: 'rgba(0,0,0,0.35)',
+          border: '1px solid rgba(255,255,255,0.18)',
+          color: 'rgba(255,255,255,0.85)',
+          outline: 'none',
         }}
       />
       <button
diff --git a/src/components/SOTAPanel.jsx b/src/components/SOTAPanel.jsx
index 58af5ff8..c873f56c 100644
--- a/src/components/SOTAPanel.jsx
+++ b/src/components/SOTAPanel.jsx
@@ -5,7 +5,8 @@
 import React from 'react';
 import CallsignLink from './CallsignLink.jsx';
 
-export const SOTAPanel = ({ data,
+export const SOTAPanel = ({
+  data,
   loading,
   lastUpdated,
   lastChecked,
@@ -13,7 +14,7 @@ export const SOTAPanel = ({ data,
   onToggleMap,
   showLabelsOnMap,
   onToggleLabelsOnMap = true,
-  onSpotClick
+  onSpotClick,
 }) => {
   const staleMinutes = lastUpdated ? Math.floor((Date.now() - lastUpdated) / 60000) : null;
   const isStale = staleMinutes !== null && staleMinutes >= 5;
@@ -26,16 +27,29 @@ export const SOTAPanel = ({ data,
   }
   return (
     <div className="panel" style={{ padding: '8px', height: '100%', display: 'flex', flexDirection: 'column' }}>
-      <div className="panel-header" style={{
-        display: 'flex',
-        justifyContent: 'space-between',
-        alignItems: 'center',
-        marginBottom: '6px',
-        fontSize: '11px'
-      }}>
+      <div
+        className="panel-header"
+        style={{
+          display: 'flex',
+          justifyContent: 'space-between',
+          alignItems: 'center',
+          marginBottom: '6px',
+          fontSize: '11px',
+        }}
+      >
         <span>
           ⛰ SOTA ACTIVATORS {data?.length > 0 ? `(${data.length})` : ''}
-          {checkedTime && <span style={{ color: isStale ? (staleMinutes >= 10 ? '#ff4444' : '#ffaa00') : '#666', marginLeft: '6px', fontSize: '9px' }}>{isStale ? `⚠ ${staleMinutes}m stale` : `✓${checkedTime}`}</span>}
+          {checkedTime && (
+            <span
+              style={{
+                color: isStale ? (staleMinutes >= 10 ? '#ff4444' : '#ffaa00') : '#666',
+                marginLeft: '6px',
+                fontSize: '9px',
+              }}
+            >
+              {isStale ? `⚠ ${staleMinutes}m stale` : `✓${checkedTime}`}
+            </span>
+          )}
         </span>
         <div style={{ display: 'flex', gap: '6px', alignItems: 'center' }}>
           <button
@@ -49,7 +63,7 @@ export const SOTAPanel = ({ data,
               borderRadius: '3px',
               fontSize: '9px',
               fontFamily: 'JetBrains Mono',
-              cursor: 'pointer'
+              cursor: 'pointer',
             }}
           >
             ⊞ Map {showOnMap ? 'ON' : 'OFF'}
@@ -67,7 +81,7 @@ export const SOTAPanel = ({ data,
                 borderRadius: '3px',
                 fontSize: '9px',
                 fontFamily: 'JetBrains Mono',
-                cursor: 'pointer'
+                cursor: 'pointer',
               }}
             >
               ⊞ Calls {showLabelsOnMap ? 'ON' : 'OFF'}
@@ -93,16 +107,32 @@ export const SOTAPanel = ({ data,
                   gap: '4px',
                   padding: '3px 0',
                   borderBottom: i < data.length - 1 ? '1px solid var(--border-color)' : 'none',
-                  cursor: 'pointer'
+                  cursor: 'pointer',
                 }}
-                onMouseEnter={(e) => e.currentTarget.style.background = 'rgba(255,255,255,0.05)'}
-                onMouseLeave={(e) => e.currentTarget.style.background = 'transparent'}
+                onMouseEnter={(e) => (e.currentTarget.style.background = 'rgba(255,255,255,0.05)')}
+                onMouseLeave={(e) => (e.currentTarget.style.background = 'transparent')}
               >
-                <span style={{ color: '#ff9632', fontWeight: '600', overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}>
+                <span
+                  style={{
+                    color: '#ff9632',
+                    fontWeight: '600',
+                    overflow: 'hidden',
+                    textOverflow: 'ellipsis',
+                    whiteSpace: 'nowrap',
+                  }}
+                >
                   <CallsignLink call={spot.call} color="#ff9632" fontWeight="600" />
                 </span>
-                <span style={{ color: 'var(--text-muted)', overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}
-                  title={spot.summit ? `${spot.ref} — ${spot.summit}${spot.points ? ` (${spot.points}pt)` : ''}` : spot.ref}
+                <span
+                  style={{
+                    color: 'var(--text-muted)',
+                    overflow: 'hidden',
+                    textOverflow: 'ellipsis',
+                    whiteSpace: 'nowrap',
+                  }}
+                  title={
+                    spot.summit ? `${spot.ref} — ${spot.summit}${spot.points ? ` (${spot.points}pt)` : ''}` : spot.ref
+                  }
                 >
                   {spot.ref}
                 </span>
@@ -119,9 +149,7 @@ export const SOTAPanel = ({ data,
                     }
                   })()}
                 </span>
-                <span style={{ color: 'var(--text-muted)', textAlign: 'right', fontSize: '9px' }}>
-                  {spot.time}
-                </span>
+                <span style={{ color: 'var(--text-muted)', textAlign: 'right', fontSize: '9px' }}>{spot.time}</span>
               </div>
             ))}
           </div>
diff --git a/src/components/SettingsPanel.jsx b/src/components/SettingsPanel.jsx
index 4f186342..88a0adbd 100644
--- a/src/components/SettingsPanel.jsx
+++ b/src/components/SettingsPanel.jsx
@@ -15,12 +15,23 @@ import {
   renameProfile,
   exportProfile,
   exportCurrentState,
-  importProfile
+  importProfile,
 } from '../utils/profiles.js';
 
 import useLocalInstall from '../hooks/app/useLocalInstall.js';
 
-export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout, satellites, satelliteFilters, onSatelliteFiltersChange, mapLayers, onToggleDXNews }) => {
+export const SettingsPanel = ({
+  isOpen,
+  onClose,
+  config,
+  onSave,
+  onResetLayout,
+  satellites,
+  satelliteFilters,
+  onSatelliteFiltersChange,
+  mapLayers,
+  onToggleDXNews,
+}) => {
   const [callsign, setCallsign] = useState(config?.callsign || '');
   const [headerSize, setheaderSize] = useState(config?.headerSize || 1.0);
   const [gridSquare, setGridSquare] = useState('');
@@ -31,7 +42,9 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
   const [mouseZoom, setMouseZoom] = useState(config?.mouseZoom || 50);
   const [timezone, setTimezone] = useState(config?.timezone || '');
   const [dxClusterSource, setDxClusterSource] = useState(config?.dxClusterSource || 'dxspider-proxy');
-  const [customDxCluster, setCustomDxCluster] = useState(config?.customDxCluster || { enabled: false, host: '', port: 7300 });
+  const [customDxCluster, setCustomDxCluster] = useState(
+    config?.customDxCluster || { enabled: false, host: '', port: 7300 },
+  );
   const [lowMemoryMode, setLowMemoryMode] = useState(config?.lowMemoryMode || false);
   const [units, setUnits] = useState(config?.units || 'imperial');
   const [propMode, setPropMode] = useState(config?.propagation?.mode || 'SSB');
@@ -106,7 +119,7 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
   useEffect(() => {
     if (config) {
       setCallsign(config.callsign || '');
-      setheaderSize(config.headerSize || 1.0)
+      setheaderSize(config.headerSize || 1.0);
       setLat(config.location?.lat || 0);
       setLon(config.location?.lon || 0);
       setTheme(config.theme || 'dark');
@@ -181,8 +194,8 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
   useEffect(() => {
     if (isOpen && activeTab === 'profiles') {
       fetch('/api/qrz/status')
-        .then(r => r.json())
-        .then(data => setQrzStatus(data))
+        .then((r) => r.json())
+        .then((data) => setQrzStatus(data))
         .catch(() => setQrzStatus(null));
     }
   }, [isOpen, activeTab]);
@@ -208,16 +221,16 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
   // Reset all popup positions for a plugin
   const resetPopupPositions = (layerId) => {
     const storageKeys = {
-      'lightning': ['lightning-stats-position', 'lightning-proximity-position'],
-      'wspr': ['wspr-filter-position', 'wspr-stats-position', 'wspr-legend-position', 'wspr-chart-position'],
-      'rbn': ['rbn-panel-position'],
-      'grayline': ['grayline-position'],
-      'n3fjp_logged_qsos': ['n3fjp-position'],
-      'voacap-heatmap': ['voacap-heatmap-position']
+      lightning: ['lightning-stats-position', 'lightning-proximity-position'],
+      wspr: ['wspr-filter-position', 'wspr-stats-position', 'wspr-legend-position', 'wspr-chart-position'],
+      rbn: ['rbn-panel-position'],
+      grayline: ['grayline-position'],
+      n3fjp_logged_qsos: ['n3fjp-position'],
+      'voacap-heatmap': ['voacap-heatmap-position'],
     };
 
     const keys = storageKeys[layerId] || [];
-    keys.forEach(key => {
+    keys.forEach((key) => {
       localStorage.removeItem(key);
       // Also remove minimized state
       localStorage.removeItem(key + '-minimized');
@@ -255,8 +268,8 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
     if (grid.length >= 6) {
       const lon3 = (grid.charCodeAt(4) - 65) * (2 / 24);
       const lat3 = (grid.charCodeAt(5) - 65) * (1 / 24);
-      lon = lon1 + lon2 + lon3 + (1 / 24);
-      lat = lat1 + lat2 + lat3 + (1 / 48);
+      lon = lon1 + lon2 + lon3 + 1 / 24;
+      lat = lat1 + lat2 + lat3 + 1 / 48;
     }
 
     return { lat, lon };
@@ -278,7 +291,7 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
         (error) => {
           console.error('Geolocation error:', error);
           alert(t('station.settings.useLocation.error1'));
-        }
+        },
       );
     } else {
       alert(t('station.settings.useLocation.error2'));
@@ -287,18 +300,14 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
 
   const handleToggleLayer = (layerId) => {
     if (window.hamclockLayerControls) {
-      const layer = layers.find(l => l.id === layerId);
+      const layer = layers.find((l) => l.id === layerId);
       const newEnabledState = !layer.enabled;
 
       // Update the control
       window.hamclockLayerControls.toggleLayer(layerId, newEnabledState);
 
       // Force immediate UI update
-      setLayers(prevLayers =>
-        prevLayers.map(l =>
-          l.id === layerId ? { ...l, enabled: newEnabledState } : l
-        )
-      );
+      setLayers((prevLayers) => prevLayers.map((l) => (l.id === layerId ? { ...l, enabled: newEnabledState } : l)));
 
       // Refresh after a short delay to get the updated state
       setTimeout(() => {
@@ -310,15 +319,10 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
   };
   const handleUpdateLayerConfig = (layerId, configDelta) => {
     if (window.hamclockLayerControls?.updateLayerConfig) {
-
       window.hamclockLayerControls.updateLayerConfig(layerId, configDelta);
 
-      setLayers(prevLayers =>
-        prevLayers.map(l =>
-          l.id === layerId
-            ? { ...l, config: { ...(l.config || {}), ...configDelta } }
-            : l
-        )
+      setLayers((prevLayers) =>
+        prevLayers.map((l) => (l.id === layerId ? { ...l, config: { ...(l.config || {}), ...configDelta } } : l)),
       );
     }
   };
@@ -345,7 +349,7 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
       lowMemoryMode,
       units,
       propagation: { mode: propMode, power: parseFloat(propPower) || 100 },
-      rigControl: { enabled: rigEnabled, host: rigHost, port: parseInt(rigPort) || 5555, tuneEnabled }
+      rigControl: { enabled: rigEnabled, host: rigHost, port: parseInt(rigPort) || 5555, tuneEnabled },
     });
     onClose();
   };
@@ -353,16 +357,14 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
   if (!isOpen) return null;
 
   const Code = ({ children }) => (
-    <code style={{ background: 'var(--bg-tertiary)', padding: '2px 4px', borderRadius: '3px' }}>
-      {children}
-    </code>
+    <code style={{ background: 'var(--bg-tertiary)', padding: '2px 4px', borderRadius: '3px' }}>{children}</code>
   );
 
   const themeDescriptions = {
     dark: t('station.settings.theme.dark.describe'),
     light: t('station.settings.theme.light.describe'),
     legacy: t('station.settings.theme.legacy.describe'),
-    retro: t('station.settings.theme.retro.describe')
+    retro: t('station.settings.theme.retro.describe'),
   };
 
   const layoutDescriptions = {
@@ -370,51 +372,59 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
     classic: t('station.settings.layout.classic.describe'),
     tablet: t('station.settings.layout.tablet.describe'),
     compact: t('station.settings.layout.compact.describe'),
-    dockable: t('station.settings.layout.dockable.describe')
+    dockable: t('station.settings.layout.dockable.describe'),
   };
 
   return (
-    <div style={{
-      position: 'fixed',
-      top: 0,
-      left: 0,
-      right: 0,
-      bottom: 0,
-      background: 'rgba(0, 0, 0, 0.8)',
-      display: 'flex',
-      justifyContent: 'center',
-      alignItems: 'center',
-      zIndex: 10000
-    }}>
-      <div style={{
-        background: 'var(--bg-secondary)',
-        border: '2px solid var(--accent-amber)',
-        borderRadius: '12px',
-        padding: '24px',
-        width: '520px',
-        maxHeight: '90vh',
-        overflowY: 'auto'
-      }}>
-        <h2 style={{
-          color: 'var(--accent-cyan)',
-          marginTop: 0,
-          marginBottom: '24px',
-          textAlign: 'center',
-          fontFamily: 'Orbitron, monospace',
-          fontSize: '20px'
-        }}>
+    <div
+      style={{
+        position: 'fixed',
+        top: 0,
+        left: 0,
+        right: 0,
+        bottom: 0,
+        background: 'rgba(0, 0, 0, 0.8)',
+        display: 'flex',
+        justifyContent: 'center',
+        alignItems: 'center',
+        zIndex: 10000,
+      }}
+    >
+      <div
+        style={{
+          background: 'var(--bg-secondary)',
+          border: '2px solid var(--accent-amber)',
+          borderRadius: '12px',
+          padding: '24px',
+          width: '520px',
+          maxHeight: '90vh',
+          overflowY: 'auto',
+        }}
+      >
+        <h2
+          style={{
+            color: 'var(--accent-cyan)',
+            marginTop: 0,
+            marginBottom: '24px',
+            textAlign: 'center',
+            fontFamily: 'Orbitron, monospace',
+            fontSize: '20px',
+          }}
+        >
           {t('station.settings.title')}
         </h2>
 
         {/* Tab Navigation */}
-        <div style={{
-          display: 'flex',
-          flexWrap: 'wrap',
-          gap: '4px',
-          marginBottom: '24px',
-          borderBottom: '1px solid var(--border-color)',
-          paddingBottom: '12px'
-        }}>
+        <div
+          style={{
+            display: 'flex',
+            flexWrap: 'wrap',
+            gap: '4px',
+            marginBottom: '24px',
+            borderBottom: '1px solid var(--border-color)',
+            paddingBottom: '12px',
+          }}
+        >
           <button
             onClick={() => setActiveTab('station')}
             style={{
@@ -427,7 +437,7 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
               fontSize: '13px',
               cursor: 'pointer',
               fontWeight: activeTab === 'station' ? '700' : '400',
-              fontFamily: 'JetBrains Mono, monospace'
+              fontFamily: 'JetBrains Mono, monospace',
             }}
           >
             {t('station.settings.tab1.title')}
@@ -445,7 +455,7 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
               fontSize: '13px',
               cursor: 'pointer',
               fontWeight: activeTab === 'integrations' ? '700' : '400',
-              fontFamily: 'JetBrains Mono, monospace'
+              fontFamily: 'JetBrains Mono, monospace',
             }}
           >
             Integrations
@@ -463,7 +473,7 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
               fontSize: '13px',
               cursor: 'pointer',
               fontWeight: activeTab === 'layers' ? '700' : '400',
-              fontFamily: 'JetBrains Mono, monospace'
+              fontFamily: 'JetBrains Mono, monospace',
             }}
           >
             {t('station.settings.tab2.title')}
@@ -480,13 +490,16 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
               fontSize: '13px',
               cursor: 'pointer',
               fontWeight: activeTab === 'satellites' ? '700' : '400',
-              fontFamily: 'JetBrains Mono, monospace'
+              fontFamily: 'JetBrains Mono, monospace',
             }}
           >
             {t('station.settings.tab3.title')}
           </button>
           <button
-            onClick={() => { setActiveTab('profiles'); refreshProfiles(); }}
+            onClick={() => {
+              setActiveTab('profiles');
+              refreshProfiles();
+            }}
             style={{
               flex: 1,
               padding: '10px',
@@ -497,7 +510,7 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
               fontSize: '13px',
               cursor: 'pointer',
               fontWeight: activeTab === 'profiles' ? '700' : '400',
-              fontFamily: 'JetBrains Mono, monospace'
+              fontFamily: 'JetBrains Mono, monospace',
             }}
           >
             Profiles
@@ -514,7 +527,7 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
               fontSize: '13px',
               cursor: 'pointer',
               fontWeight: activeTab === 'community' ? '700' : '400',
-              fontFamily: 'JetBrains Mono, monospace'
+              fontFamily: 'JetBrains Mono, monospace',
             }}
           >
             Community
@@ -526,20 +539,20 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
           <>
             {/* First-time setup banner */}
             {(config?.configIncomplete || config?.callsign === 'N0CALL' || !config?.locator) && (
-              <div style={{
-                background: 'rgba(255, 193, 7, 0.15)',
-                border: '1px solid var(--accent-amber)',
-                borderRadius: '8px',
-                padding: '12px 16px',
-                marginBottom: '20px',
-                fontSize: '13px'
-              }}>
+              <div
+                style={{
+                  background: 'rgba(255, 193, 7, 0.15)',
+                  border: '1px solid var(--accent-amber)',
+                  borderRadius: '8px',
+                  padding: '12px 16px',
+                  marginBottom: '20px',
+                  fontSize: '13px',
+                }}
+              >
                 <div style={{ color: 'var(--accent-amber)', fontWeight: '700', marginBottom: '6px' }}>
-                  {t("station.settings.welcome")}
-                </div>
-                <div style={{ color: 'var(--text-secondary)', lineHeight: 1.5 }}>
-                  {t("station.settings.describe")}
+                  {t('station.settings.welcome')}
                 </div>
+                <div style={{ color: 'var(--text-secondary)', lineHeight: 1.5 }}>{t('station.settings.describe')}</div>
                 <div style={{ color: 'var(--text-muted)', fontSize: '11px', marginTop: '8px' }}>
                   <Trans i18nKey="station.settings.tip.env" components={{ envExample: <Code />, env: <Code /> }} />
                 </div>
@@ -547,21 +560,32 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
             )}
 
             {/* Integrations moved to dedicated tab */}
-            <div style={{
-              background: 'rgba(0, 255, 255, 0.04)',
-              border: '1px solid var(--border-color)',
-              borderRadius: '8px',
-              padding: '10px 14px',
-              marginBottom: '20px',
-              fontSize: 12,
-              color: 'var(--text-secondary)'
-            }}>
+            <div
+              style={{
+                background: 'rgba(0, 255, 255, 0.04)',
+                border: '1px solid var(--border-color)',
+                borderRadius: '8px',
+                padding: '10px 14px',
+                marginBottom: '20px',
+                fontSize: 12,
+                color: 'var(--text-secondary)',
+              }}
+            >
               Looking for Rotator / N3FJP / other add-ons? See <b>Settings → Integrations</b>.
             </div>
 
             {/* Callsign */}
             <div style={{ marginBottom: '20px' }}>
-              <label style={{ display: 'block', marginBottom: '6px', color: 'var(--text-muted)', fontSize: '11px', textTransform: 'uppercase', letterSpacing: '1px' }}>
+              <label
+                style={{
+                  display: 'block',
+                  marginBottom: '6px',
+                  color: 'var(--text-muted)',
+                  fontSize: '11px',
+                  textTransform: 'uppercase',
+                  letterSpacing: '1px',
+                }}
+              >
                 {t('station.settings.callsign')}
               </label>
               <input
@@ -578,7 +602,7 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                   fontSize: '18px',
                   fontFamily: 'JetBrains Mono, monospace',
                   fontWeight: '700',
-                  boxSizing: 'border-box'
+                  boxSizing: 'border-box',
                 }}
               />
             </div>
@@ -586,7 +610,15 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
             {/* Callsign Size*/}
             <div style={{ marginBottom: '20px' }}>
               <div>
-                <label style={{ display: 'block', marginBottom: '6px', color: 'var(--text-muted)', fontSize: '11px', textTransform: 'uppercase' }}>
+                <label
+                  style={{
+                    display: 'block',
+                    marginBottom: '6px',
+                    color: 'var(--text-muted)',
+                    fontSize: '11px',
+                    textTransform: 'uppercase',
+                  }}
+                >
                   {t('station.settings.headerSize')}
                 </label>
                 <input
@@ -595,7 +627,7 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                   value={isNaN(lat) ? '' : headerSize}
                   onChange={(e) => {
                     if (e.target.value >= 0.1 && e.target.value <= 2.0) {
-                      setheaderSize(e.target.value)
+                      setheaderSize(e.target.value);
                     }
                   }}
                   style={{
@@ -607,7 +639,7 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                     color: 'var(--text-primary)',
                     fontSize: '14px',
                     fontFamily: 'JetBrains Mono, monospace',
-                    boxSizing: 'border-box'
+                    boxSizing: 'border-box',
                   }}
                 />
               </div>
@@ -615,7 +647,16 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
 
             {/* Grid Square */}
             <div style={{ marginBottom: '20px' }}>
-              <label style={{ display: 'block', marginBottom: '6px', color: 'var(--text-muted)', fontSize: '11px', textTransform: 'uppercase', letterSpacing: '1px' }}>
+              <label
+                style={{
+                  display: 'block',
+                  marginBottom: '6px',
+                  color: 'var(--text-muted)',
+                  fontSize: '11px',
+                  textTransform: 'uppercase',
+                  letterSpacing: '1px',
+                }}
+              >
                 {t('station.settings.locator')}
               </label>
               <input
@@ -634,7 +675,7 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                   fontSize: '18px',
                   fontFamily: 'JetBrains Mono, monospace',
                   fontWeight: '700',
-                  boxSizing: 'border-box'
+                  boxSizing: 'border-box',
                 }}
               />
             </div>
@@ -642,7 +683,15 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
             {/* Lat/Lon */}
             <div style={{ display: 'grid', gridTemplateColumns: '1fr 1fr', gap: '12px', marginBottom: '12px' }}>
               <div>
-                <label style={{ display: 'block', marginBottom: '6px', color: 'var(--text-muted)', fontSize: '11px', textTransform: 'uppercase' }}>
+                <label
+                  style={{
+                    display: 'block',
+                    marginBottom: '6px',
+                    color: 'var(--text-muted)',
+                    fontSize: '11px',
+                    textTransform: 'uppercase',
+                  }}
+                >
                   {t('station.settings.latitude')}
                 </label>
                 <input
@@ -659,12 +708,20 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                     color: 'var(--text-primary)',
                     fontSize: '14px',
                     fontFamily: 'JetBrains Mono, monospace',
-                    boxSizing: 'border-box'
+                    boxSizing: 'border-box',
                   }}
                 />
               </div>
               <div>
-                <label style={{ display: 'block', marginBottom: '6px', color: 'var(--text-muted)', fontSize: '11px', textTransform: 'uppercase' }}>
+                <label
+                  style={{
+                    display: 'block',
+                    marginBottom: '6px',
+                    color: 'var(--text-muted)',
+                    fontSize: '11px',
+                    textTransform: 'uppercase',
+                  }}
+                >
                   {t('station.settings.longitude')}
                 </label>
                 <input
@@ -681,7 +738,7 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                     color: 'var(--text-primary)',
                     fontSize: '14px',
                     fontFamily: 'JetBrains Mono, monospace',
-                    boxSizing: 'border-box'
+                    boxSizing: 'border-box',
                   }}
                 />
               </div>
@@ -698,7 +755,7 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                 color: 'var(--text-secondary)',
                 fontSize: '13px',
                 cursor: 'pointer',
-                marginBottom: '20px'
+                marginBottom: '20px',
               }}
             >
               {t('station.settings.useLocation')}
@@ -706,7 +763,15 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
 
             {/* Mouse wheel zoom factor */}
             <div style={{ marginBottom: '31px' }}>
-              <label style={{ display: 'block', color: 'var(--text-muted)', fontSize: '11px', textTransform: 'uppercase', letterSpacing: '1px' }}>
+              <label
+                style={{
+                  display: 'block',
+                  color: 'var(--text-muted)',
+                  fontSize: '11px',
+                  textTransform: 'uppercase',
+                  letterSpacing: '1px',
+                }}
+              >
                 {t('station.settings.mouseZoom')}
                 <input
                   type="range"
@@ -717,7 +782,7 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                   style={{
                     width: '100%',
                     cursor: 'pointer',
-                    marginTop: '3px'
+                    marginTop: '3px',
                   }}
                 />
               </label>
@@ -731,7 +796,16 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
 
             {/* Theme */}
             <div style={{ marginBottom: '8px' }}>
-              <label style={{ display: 'block', marginBottom: '8px', color: 'var(--text-muted)', fontSize: '11px', textTransform: 'uppercase', letterSpacing: '1px' }}>
+              <label
+                style={{
+                  display: 'block',
+                  marginBottom: '8px',
+                  color: 'var(--text-muted)',
+                  fontSize: '11px',
+                  textTransform: 'uppercase',
+                  letterSpacing: '1px',
+                }}
+              >
                 {t('station.settings.theme')}
               </label>
               <div style={{ display: 'grid', gridTemplateColumns: 'repeat(4, 1fr)', gap: '8px' }}>
@@ -747,10 +821,11 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                       color: theme === th ? '#000' : 'var(--text-secondary)',
                       fontSize: '12px',
                       cursor: 'pointer',
-                      fontWeight: theme === th ? '600' : '400'
+                      fontWeight: theme === th ? '600' : '400',
                     }}
                   >
-                    {th === 'dark' ? '🌙' : th === 'light' ? '☀️' : th === 'legacy' ? '💻' : '🪟'} {t('station.settings.theme.' + th)}
+                    {th === 'dark' ? '🌙' : th === 'light' ? '☀️' : th === 'legacy' ? '💻' : '🪟'}{' '}
+                    {t('station.settings.theme.' + th)}
                   </button>
                 ))}
               </div>
@@ -761,7 +836,16 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
 
             {/* Layout */}
             <div style={{ marginBottom: '8px' }}>
-              <label style={{ display: 'block', marginBottom: '8px', color: 'var(--text-muted)', fontSize: '11px', textTransform: 'uppercase', letterSpacing: '1px' }}>
+              <label
+                style={{
+                  display: 'block',
+                  marginBottom: '8px',
+                  color: 'var(--text-muted)',
+                  fontSize: '11px',
+                  textTransform: 'uppercase',
+                  letterSpacing: '1px',
+                }}
+              >
                 {t('station.settings.layout')}
               </label>
               <div style={{ display: 'grid', gridTemplateColumns: 'repeat(3, 1fr)', gap: '8px' }}>
@@ -777,10 +861,19 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                       color: layout === l ? '#000' : 'var(--text-secondary)',
                       fontSize: '12px',
                       cursor: 'pointer',
-                      fontWeight: layout === l ? '600' : '400'
+                      fontWeight: layout === l ? '600' : '400',
                     }}
                   >
-                    {l === 'modern' ? '🖥️' : l === 'classic' ? '📺' : l === 'tablet' ? '📱' : l === 'compact' ? '📊' : '⊞'} {l === 'dockable' ? t('station.settings.layout.dockable') : t('station.settings.layout.' + l)}
+                    {l === 'modern'
+                      ? '🖥️'
+                      : l === 'classic'
+                        ? '📺'
+                        : l === 'tablet'
+                          ? '📱'
+                          : l === 'compact'
+                            ? '📊'
+                            : '⊞'}{' '}
+                    {l === 'dockable' ? t('station.settings.layout.dockable') : t('station.settings.layout.' + l)}
                   </button>
                 ))}
               </div>
@@ -805,7 +898,7 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                     cursor: 'pointer',
                     display: 'flex',
                     alignItems: 'center',
-                    gap: '6px'
+                    gap: '6px',
                   }}
                 >
                   <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2">
@@ -819,7 +912,16 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
 
             {/* DX Cluster Source */}
             <div style={{ marginBottom: '20px' }}>
-              <label style={{ display: 'block', marginBottom: '8px', color: 'var(--text-muted)', fontSize: '11px', textTransform: 'uppercase', letterSpacing: '1px' }}>
+              <label
+                style={{
+                  display: 'block',
+                  marginBottom: '8px',
+                  color: 'var(--text-muted)',
+                  fontSize: '11px',
+                  textTransform: 'uppercase',
+                  letterSpacing: '1px',
+                }}
+              >
                 {t('station.settings.timezone')}
               </label>
               <select
@@ -834,7 +936,7 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                   color: timezone ? 'var(--accent-green)' : 'var(--text-muted)',
                   fontSize: '14px',
                   fontFamily: 'JetBrains Mono, monospace',
-                  cursor: 'pointer'
+                  cursor: 'pointer',
                 }}
               >
                 <option value="">{t('station.settings.timezone.auto')}</option>
@@ -925,7 +1027,16 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
 
             {/* Distance Units */}
             <div style={{ marginBottom: '20px' }}>
-              <label style={{ display: 'block', marginBottom: '8px', color: 'var(--text-muted)', fontSize: '11px', textTransform: 'uppercase', letterSpacing: '1px' }}>
+              <label
+                style={{
+                  display: 'block',
+                  marginBottom: '8px',
+                  color: 'var(--text-muted)',
+                  fontSize: '11px',
+                  textTransform: 'uppercase',
+                  letterSpacing: '1px',
+                }}
+              >
                 📏 Distance Units
               </label>
               <div style={{ display: 'flex', gap: '8px' }}>
@@ -940,7 +1051,7 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                     color: units === 'imperial' ? '#000' : 'var(--text-secondary)',
                     fontSize: '13px',
                     cursor: 'pointer',
-                    fontWeight: units === 'imperial' ? '600' : '400'
+                    fontWeight: units === 'imperial' ? '600' : '400',
                   }}
                 >
                   🇺🇸 Imperial (mi)
@@ -956,7 +1067,7 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                     color: units === 'metric' ? '#000' : 'var(--text-secondary)',
                     fontSize: '13px',
                     cursor: 'pointer',
-                    fontWeight: units === 'metric' ? '600' : '400'
+                    fontWeight: units === 'metric' ? '600' : '400',
                   }}
                 >
                   🌍 Metric (km)
@@ -971,16 +1082,27 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
 
             {/* Rig Control Settings */}
             <div style={{ marginBottom: '20px' }}>
-              <label style={{ display: 'block', marginBottom: '8px', color: 'var(--text-muted)', fontSize: '11px', textTransform: 'uppercase', letterSpacing: '1px' }}>
+              <label
+                style={{
+                  display: 'block',
+                  marginBottom: '8px',
+                  color: 'var(--text-muted)',
+                  fontSize: '11px',
+                  textTransform: 'uppercase',
+                  letterSpacing: '1px',
+                }}
+              >
                 {t('station.settings.rigControl.title')} (Beta)
               </label>
 
-              <div style={{
-                background: 'var(--bg-tertiary)',
-                padding: '12px',
-                borderRadius: '6px',
-                border: '1px solid var(--border-color)'
-              }}>
+              <div
+                style={{
+                  background: 'var(--bg-tertiary)',
+                  padding: '12px',
+                  borderRadius: '6px',
+                  border: '1px solid var(--border-color)',
+                }}
+              >
                 <div style={{ display: 'flex', alignItems: 'center', marginBottom: '12px' }}>
                   <input
                     type="checkbox"
@@ -996,35 +1118,76 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                 {rigEnabled && (
                   <>
                     {/* Download Rig Listener */}
-                    <div style={{
-                      background: 'rgba(99,102,241,0.08)',
-                      border: '1px solid rgba(99,102,241,0.2)',
-                      borderRadius: '6px',
-                      padding: '10px',
-                      marginBottom: '12px',
-                    }}>
-                      <div style={{ fontSize: '11px', color: 'var(--text-secondary)', marginBottom: '8px', lineHeight: 1.4 }}>
-                        📻 Download the Rig Listener for your computer. Double-click to run — it connects your radio to OpenHamClock via USB.
+                    <div
+                      style={{
+                        background: 'rgba(99,102,241,0.08)',
+                        border: '1px solid rgba(99,102,241,0.2)',
+                        borderRadius: '6px',
+                        padding: '10px',
+                        marginBottom: '12px',
+                      }}
+                    >
+                      <div
+                        style={{
+                          fontSize: '11px',
+                          color: 'var(--text-secondary)',
+                          marginBottom: '8px',
+                          lineHeight: 1.4,
+                        }}
+                      >
+                        📻 Download the Rig Listener for your computer. Double-click to run — it connects your radio to
+                        OpenHamClock via USB.
                       </div>
                       <div style={{ display: 'flex', gap: '6px', flexWrap: 'wrap' }}>
-                        <a href="/api/rig/download/windows"
+                        <a
+                          href="/api/rig/download/windows"
                           style={{
-                            padding: '5px 12px', borderRadius: '4px', fontSize: '11px', fontWeight: '600',
-                            background: 'rgba(99,102,241,0.15)', border: '1px solid rgba(99,102,241,0.3)',
-                            color: '#818cf8', textDecoration: 'none', cursor: 'pointer',
-                          }}>⊞ Windows</a>
-                        <a href="/api/rig/download/mac"
+                            padding: '5px 12px',
+                            borderRadius: '4px',
+                            fontSize: '11px',
+                            fontWeight: '600',
+                            background: 'rgba(99,102,241,0.15)',
+                            border: '1px solid rgba(99,102,241,0.3)',
+                            color: '#818cf8',
+                            textDecoration: 'none',
+                            cursor: 'pointer',
+                          }}
+                        >
+                          ⊞ Windows
+                        </a>
+                        <a
+                          href="/api/rig/download/mac"
                           style={{
-                            padding: '5px 12px', borderRadius: '4px', fontSize: '11px', fontWeight: '600',
-                            background: 'rgba(99,102,241,0.15)', border: '1px solid rgba(99,102,241,0.3)',
-                            color: '#818cf8', textDecoration: 'none', cursor: 'pointer',
-                          }}> Mac</a>
-                        <a href="/api/rig/download/linux"
+                            padding: '5px 12px',
+                            borderRadius: '4px',
+                            fontSize: '11px',
+                            fontWeight: '600',
+                            background: 'rgba(99,102,241,0.15)',
+                            border: '1px solid rgba(99,102,241,0.3)',
+                            color: '#818cf8',
+                            textDecoration: 'none',
+                            cursor: 'pointer',
+                          }}
+                        >
+                          {' '}
+                          Mac
+                        </a>
+                        <a
+                          href="/api/rig/download/linux"
                           style={{
-                            padding: '5px 12px', borderRadius: '4px', fontSize: '11px', fontWeight: '600',
-                            background: 'rgba(99,102,241,0.15)', border: '1px solid rgba(99,102,241,0.3)',
-                            color: '#818cf8', textDecoration: 'none', cursor: 'pointer',
-                          }}>🐧 Linux</a>
+                            padding: '5px 12px',
+                            borderRadius: '4px',
+                            fontSize: '11px',
+                            fontWeight: '600',
+                            background: 'rgba(99,102,241,0.15)',
+                            border: '1px solid rgba(99,102,241,0.3)',
+                            color: '#818cf8',
+                            textDecoration: 'none',
+                            cursor: 'pointer',
+                          }}
+                        >
+                          🐧 Linux
+                        </a>
                       </div>
                       <div style={{ fontSize: '9px', color: 'var(--text-muted)', marginTop: '6px', opacity: 0.7 }}>
                         Supports Yaesu, Kenwood, Elecraft, and Icom radios. No extra software needed.
@@ -1032,68 +1195,82 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                     </div>
 
                     <div style={{ display: 'grid', gridTemplateColumns: '2fr 1fr', gap: '10px' }}>
-                    <div>
-                      <label style={{ display: 'block', marginBottom: '4px', color: 'var(--text-muted)', fontSize: '10px' }}>
-                        {t('station.settings.rigControl.host')}
-                      </label>
-                      <input
-                        type="text"
-                        value={rigHost}
-                        onChange={(e) => setRigHost(e.target.value)}
-                        placeholder="http://localhost"
-                        style={{
-                          width: '100%',
-                          padding: '8px',
-                          background: 'var(--bg-primary)',
-                          border: '1px solid var(--border-color)',
-                          borderRadius: '4px',
-                          color: 'var(--accent-cyan)',
-                          fontSize: '13px',
-                          fontFamily: 'JetBrains Mono',
-                          boxSizing: 'border-box'
-                        }}
-                      />
+                      <div>
+                        <label
+                          style={{
+                            display: 'block',
+                            marginBottom: '4px',
+                            color: 'var(--text-muted)',
+                            fontSize: '10px',
+                          }}
+                        >
+                          {t('station.settings.rigControl.host')}
+                        </label>
+                        <input
+                          type="text"
+                          value={rigHost}
+                          onChange={(e) => setRigHost(e.target.value)}
+                          placeholder="http://localhost"
+                          style={{
+                            width: '100%',
+                            padding: '8px',
+                            background: 'var(--bg-primary)',
+                            border: '1px solid var(--border-color)',
+                            borderRadius: '4px',
+                            color: 'var(--accent-cyan)',
+                            fontSize: '13px',
+                            fontFamily: 'JetBrains Mono',
+                            boxSizing: 'border-box',
+                          }}
+                        />
+                      </div>
+                      <div>
+                        <label
+                          style={{
+                            display: 'block',
+                            marginBottom: '4px',
+                            color: 'var(--text-muted)',
+                            fontSize: '10px',
+                          }}
+                        >
+                          {t('station.settings.rigControl.port')}
+                        </label>
+                        <input
+                          type="number"
+                          value={rigPort}
+                          onChange={(e) => setRigPort(e.target.value)}
+                          placeholder="5555"
+                          style={{
+                            width: '100%',
+                            padding: '8px',
+                            background: 'var(--bg-primary)',
+                            border: '1px solid var(--border-color)',
+                            borderRadius: '4px',
+                            color: 'var(--accent-cyan)',
+                            fontSize: '13px',
+                            fontFamily: 'JetBrains Mono',
+                            boxSizing: 'border-box',
+                          }}
+                        />
+                      </div>
                     </div>
-                    <div>
-                      <label style={{ display: 'block', marginBottom: '4px', color: 'var(--text-muted)', fontSize: '10px' }}>
-                        {t('station.settings.rigControl.port')}
-                      </label>
+
+                    <div style={{ marginTop: '10px', display: 'flex', alignItems: 'center' }}>
                       <input
-                        type="number"
-                        value={rigPort}
-                        onChange={(e) => setRigPort(e.target.value)}
-                        placeholder="5555"
-                        style={{
-                          width: '100%',
-                          padding: '8px',
-                          background: 'var(--bg-primary)',
-                          border: '1px solid var(--border-color)',
-                          borderRadius: '4px',
-                          color: 'var(--accent-cyan)',
-                          fontSize: '13px',
-                          fontFamily: 'JetBrains Mono',
-                          boxSizing: 'border-box'
-                        }}
+                        type="checkbox"
+                        checked={tuneEnabled}
+                        onChange={(e) => setTuneEnabled(e.target.checked)}
+                        style={{ marginRight: '8px' }}
                       />
-                    </div>
-                  </div>
-
-                  <div style={{ marginTop: '10px', display: 'flex', alignItems: 'center' }}>
-                    <input
-                      type="checkbox"
-                      checked={tuneEnabled}
-                      onChange={(e) => setTuneEnabled(e.target.checked)}
-                      style={{ marginRight: '8px' }}
-                    />
-                    <div>
-                      <span style={{ color: 'var(--text-primary)', fontSize: '13px' }}>
-                        {t('station.settings.rigControl.tuneEnabled')}
-                      </span>
-                      <div style={{ fontSize: '10px', color: 'var(--text-muted)' }}>
-                        {t('station.settings.rigControl.tuneEnabled.hint')}
+                      <div>
+                        <span style={{ color: 'var(--text-primary)', fontSize: '13px' }}>
+                          {t('station.settings.rigControl.tuneEnabled')}
+                        </span>
+                        <div style={{ fontSize: '10px', color: 'var(--text-muted)' }}>
+                          {t('station.settings.rigControl.tuneEnabled.hint')}
+                        </div>
                       </div>
                     </div>
-                  </div>
                   </>
                 )}
               </div>
@@ -1101,7 +1278,16 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
 
             {/* Propagation Settings */}
             <div style={{ marginBottom: '20px' }}>
-              <label style={{ display: 'block', marginBottom: '8px', color: 'var(--text-muted)', fontSize: '11px', textTransform: 'uppercase', letterSpacing: '1px' }}>
+              <label
+                style={{
+                  display: 'block',
+                  marginBottom: '8px',
+                  color: 'var(--text-muted)',
+                  fontSize: '11px',
+                  textTransform: 'uppercase',
+                  letterSpacing: '1px',
+                }}
+              >
                 ⌇ Propagation Mode & Power
               </label>
 
@@ -1117,8 +1303,8 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                     { id: 'WSPR', label: 'WSPR', desc: 'Beacon' },
                     { id: 'JS8', label: 'JS8', desc: 'Chat' },
                     { id: 'RTTY', label: 'RTTY', desc: 'Teletype' },
-                    { id: 'PSK31', label: 'PSK31', desc: 'PSK' }
-                  ].map(m => (
+                    { id: 'PSK31', label: 'PSK31', desc: 'PSK' },
+                  ].map((m) => (
                     <button
                       key={m.id}
                       onClick={() => setPropMode(m.id)}
@@ -1133,7 +1319,7 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                         fontWeight: propMode === m.id ? '700' : '400',
                         fontFamily: 'JetBrains Mono, monospace',
                         lineHeight: 1.2,
-                        textAlign: 'center'
+                        textAlign: 'center',
                       }}
                       title={m.desc}
                     >
@@ -1146,13 +1332,20 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
               {/* Power */}
               <div style={{ marginBottom: '6px' }}>
                 <div style={{ fontSize: '11px', color: 'var(--text-muted)', marginBottom: '4px' }}>TX Power</div>
-                <div style={{ display: 'grid', gridTemplateColumns: 'repeat(4, 1fr) 1.2fr', gap: '4px', alignItems: 'center' }}>
+                <div
+                  style={{
+                    display: 'grid',
+                    gridTemplateColumns: 'repeat(4, 1fr) 1.2fr',
+                    gap: '4px',
+                    alignItems: 'center',
+                  }}
+                >
                   {[
                     { w: 5, label: '5W', tip: 'QRP' },
                     { w: 25, label: '25W', tip: 'Low' },
                     { w: 100, label: '100W', tip: 'Std' },
-                    { w: 1500, label: '1.5kW', tip: 'Max' }
-                  ].map(p => (
+                    { w: 1500, label: '1.5kW', tip: 'Max' },
+                  ].map((p) => (
                     <button
                       key={p.w}
                       onClick={() => setPropPower(p.w)}
@@ -1165,7 +1358,7 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                         fontSize: '11px',
                         cursor: 'pointer',
                         fontWeight: propPower === p.w ? '700' : '400',
-                        fontFamily: 'JetBrains Mono, monospace'
+                        fontFamily: 'JetBrains Mono, monospace',
                       }}
                       title={p.tip}
                     >
@@ -1190,7 +1383,7 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                         fontSize: '11px',
                         fontFamily: 'JetBrains Mono, monospace',
                         textAlign: 'center',
-                        boxSizing: 'border-box'
+                        boxSizing: 'border-box',
                       }}
                       min="0.1"
                       max="2000"
@@ -1207,20 +1400,35 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                   const adv = modeAdv[propMode] || 0;
                   const pwrDb = 10 * Math.log10((propPower || 100) / 100);
                   const margin = adv + pwrDb;
-                  return `Signal margin: ${margin >= 0 ? '+' : ''}${margin.toFixed(1)} dB vs SSB@100W — ${margin >= 30 ? 'extreme weak-signal advantage' :
-                    margin >= 15 ? 'strong advantage — marginal bands may open' :
-                      margin >= 5 ? 'moderate advantage' :
-                        margin >= -5 ? 'baseline conditions' :
-                          margin >= -15 ? 'reduced margin — some bands may close' :
-                            'significant disadvantage — only strong openings'
-                    }`;
+                  return `Signal margin: ${margin >= 0 ? '+' : ''}${margin.toFixed(1)} dB vs SSB@100W — ${
+                    margin >= 30
+                      ? 'extreme weak-signal advantage'
+                      : margin >= 15
+                        ? 'strong advantage — marginal bands may open'
+                        : margin >= 5
+                          ? 'moderate advantage'
+                          : margin >= -5
+                            ? 'baseline conditions'
+                            : margin >= -15
+                              ? 'reduced margin — some bands may close'
+                              : 'significant disadvantage — only strong openings'
+                  }`;
                 })()}
               </div>
             </div>
 
             {/* Low Memory Mode */}
             <div style={{ marginBottom: '20px' }}>
-              <label style={{ display: 'block', marginBottom: '8px', color: 'var(--text-muted)', fontSize: '11px', textTransform: 'uppercase', letterSpacing: '1px' }}>
+              <label
+                style={{
+                  display: 'block',
+                  marginBottom: '8px',
+                  color: 'var(--text-muted)',
+                  fontSize: '11px',
+                  textTransform: 'uppercase',
+                  letterSpacing: '1px',
+                }}
+              >
                 🧠 Performance Mode
               </label>
               <div style={{ display: 'flex', gap: '8px' }}>
@@ -1235,7 +1443,7 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                     color: !lowMemoryMode ? '#000' : 'var(--text-secondary)',
                     fontSize: '13px',
                     cursor: 'pointer',
-                    fontWeight: !lowMemoryMode ? '600' : '400'
+                    fontWeight: !lowMemoryMode ? '600' : '400',
                   }}
                 >
                   🚀 Full
@@ -1251,20 +1459,35 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                     color: lowMemoryMode ? '#000' : 'var(--text-secondary)',
                     fontSize: '13px',
                     cursor: 'pointer',
-                    fontWeight: lowMemoryMode ? '600' : '400'
+                    fontWeight: lowMemoryMode ? '600' : '400',
                   }}
                 >
                   🪶 Low Memory
                 </button>
               </div>
-              <div style={{ fontSize: '11px', color: lowMemoryMode ? 'var(--accent-green)' : 'var(--text-muted)', marginTop: '6px' }}>
+              <div
+                style={{
+                  fontSize: '11px',
+                  color: lowMemoryMode ? 'var(--accent-green)' : 'var(--text-muted)',
+                  marginTop: '6px',
+                }}
+              >
                 {lowMemoryMode
                   ? '✓ Low Memory Mode: Reduced animations, fewer map markers, smaller spot limits. Recommended for systems with <8GB RAM.'
                   : 'Full Mode: All features enabled. Requires 8GB+ RAM for best performance.'}
               </div>
             </div>
             <div style={{ marginBottom: '20px' }}>
-              <label style={{ display: 'block', marginBottom: '8px', color: 'var(--text-muted)', fontSize: '11px', textTransform: 'uppercase', letterSpacing: '1px' }}>
+              <label
+                style={{
+                  display: 'block',
+                  marginBottom: '8px',
+                  color: 'var(--text-muted)',
+                  fontSize: '11px',
+                  textTransform: 'uppercase',
+                  letterSpacing: '1px',
+                }}
+              >
                 {t('station.settings.dx.title')}
               </label>
               <select
@@ -1279,7 +1502,7 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                   color: 'var(--accent-green)',
                   fontSize: '14px',
                   fontFamily: 'JetBrains Mono, monospace',
-                  cursor: 'pointer'
+                  cursor: 'pointer',
                 }}
               >
                 <option value="dxspider-proxy">{t('station.settings.dx.option1')}</option>
@@ -1295,20 +1518,32 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
 
             {/* Custom DX Cluster Settings */}
             {dxClusterSource === 'custom' && (
-              <div style={{
-                marginBottom: '20px',
-                padding: '16px',
-                background: 'var(--bg-tertiary)',
-                borderRadius: '8px',
-                border: '1px solid var(--border-color)'
-              }}>
-                <label style={{ display: 'block', marginBottom: '12px', color: 'var(--accent-cyan)', fontSize: '12px', fontWeight: '600' }}>
+              <div
+                style={{
+                  marginBottom: '20px',
+                  padding: '16px',
+                  background: 'var(--bg-tertiary)',
+                  borderRadius: '8px',
+                  border: '1px solid var(--border-color)',
+                }}
+              >
+                <label
+                  style={{
+                    display: 'block',
+                    marginBottom: '12px',
+                    color: 'var(--accent-cyan)',
+                    fontSize: '12px',
+                    fontWeight: '600',
+                  }}
+                >
                   {t('station.settings.dx.custom.title')}
                 </label>
 
                 {/* Host */}
                 <div style={{ marginBottom: '12px' }}>
-                  <label style={{ display: 'block', marginBottom: '4px', color: 'var(--text-muted)', fontSize: '11px' }}>
+                  <label
+                    style={{ display: 'block', marginBottom: '4px', color: 'var(--text-muted)', fontSize: '11px' }}
+                  >
                     {t('station.settings.dx.custom.host')}
                   </label>
                   <input
@@ -1324,14 +1559,16 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                       borderRadius: '6px',
                       color: 'var(--text-primary)',
                       fontSize: '14px',
-                      fontFamily: 'JetBrains Mono, monospace'
+                      fontFamily: 'JetBrains Mono, monospace',
                     }}
                   />
                 </div>
 
                 {/* Port */}
                 <div style={{ marginBottom: '12px' }}>
-                  <label style={{ display: 'block', marginBottom: '4px', color: 'var(--text-muted)', fontSize: '11px' }}>
+                  <label
+                    style={{ display: 'block', marginBottom: '4px', color: 'var(--text-muted)', fontSize: '11px' }}
+                  >
                     {t('station.settings.dx.custom.port')}
                   </label>
                   <input
@@ -1347,14 +1584,13 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                       borderRadius: '6px',
                       color: 'var(--text-primary)',
                       fontSize: '14px',
-                      fontFamily: 'JetBrains Mono, monospace'
+                      fontFamily: 'JetBrains Mono, monospace',
                     }}
                   />
                 </div>
 
                 <div style={{ fontSize: '11px', color: 'var(--text-muted)', marginTop: '8px' }}>
-                  {t('station.settings.dx.custom.callsign', { callsign: callsign || 'N0CALL' })}
-                  {' '}
+                  {t('station.settings.dx.custom.callsign', { callsign: callsign || 'N0CALL' })}{' '}
                   {t('station.settings.dx.custom.commonPorts')}
                 </div>
                 <div style={{ fontSize: '11px', color: 'var(--accent-amber)', marginTop: '8px' }}>
@@ -1365,7 +1601,16 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
 
             {/* Language */}
             <div style={{ marginBottom: '20px' }}>
-              <label style={{ display: 'block', marginBottom: '8px', color: 'var(--text-muted)', fontSize: '11px', textTransform: 'uppercase', letterSpacing: '1px' }}>
+              <label
+                style={{
+                  display: 'block',
+                  marginBottom: '8px',
+                  color: 'var(--text-muted)',
+                  fontSize: '11px',
+                  textTransform: 'uppercase',
+                  letterSpacing: '1px',
+                }}
+              >
                 ⊕ {t('station.settings.language')}
               </label>
               <div style={{ display: 'grid', gridTemplateColumns: 'repeat(4, 1fr)', gap: '6px' }}>
@@ -1375,20 +1620,27 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                     onClick={() => i18n.changeLanguage(lang.code)}
                     style={{
                       padding: '8px 6px',
-                      background: i18n.language === lang.code || (i18n.language && i18n.language.startsWith(lang.code))
-                        ? 'rgba(0, 221, 255, 0.2)'
-                        : 'var(--bg-tertiary)',
-                      border: `1px solid ${i18n.language === lang.code || (i18n.language && i18n.language.startsWith(lang.code))
-                        ? 'var(--accent-cyan)'
-                        : 'var(--border-color)'}`,
+                      background:
+                        i18n.language === lang.code || (i18n.language && i18n.language.startsWith(lang.code))
+                          ? 'rgba(0, 221, 255, 0.2)'
+                          : 'var(--bg-tertiary)',
+                      border: `1px solid ${
+                        i18n.language === lang.code || (i18n.language && i18n.language.startsWith(lang.code))
+                          ? 'var(--accent-cyan)'
+                          : 'var(--border-color)'
+                      }`,
                       borderRadius: '6px',
-                      color: i18n.language === lang.code || (i18n.language && i18n.language.startsWith(lang.code))
-                        ? 'var(--accent-cyan)'
-                        : 'var(--text-secondary)',
+                      color:
+                        i18n.language === lang.code || (i18n.language && i18n.language.startsWith(lang.code))
+                          ? 'var(--accent-cyan)'
+                          : 'var(--text-secondary)',
                       fontSize: '12px',
                       cursor: 'pointer',
-                      fontWeight: i18n.language === lang.code || (i18n.language && i18n.language.startsWith(lang.code)) ? '600' : '400',
-                      textAlign: 'center'
+                      fontWeight:
+                        i18n.language === lang.code || (i18n.language && i18n.language.startsWith(lang.code))
+                          ? '600'
+                          : '400',
+                      textAlign: 'center',
                     }}
                   >
                     {lang.flag} {lang.name}
@@ -1403,52 +1655,58 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
         {activeTab === 'integrations' && (
           <div>
             {/* Status pill */}
-            <div style={{
-              display: 'flex',
-              alignItems: 'center',
-              justifyContent: 'space-between',
-              gap: 12,
-              marginBottom: 16,
-              padding: '10px 14px',
-              borderRadius: 10,
-              border: '1px solid var(--border-color)',
-              background: 'var(--bg-tertiary)'
-            }}>
+            <div
+              style={{
+                display: 'flex',
+                alignItems: 'center',
+                justifyContent: 'space-between',
+                gap: 12,
+                marginBottom: 16,
+                padding: '10px 14px',
+                borderRadius: 10,
+                border: '1px solid var(--border-color)',
+                background: 'var(--bg-tertiary)',
+              }}
+            >
               <div style={{ color: 'var(--text-secondary)', fontSize: 12 }}>
                 These features require a local OpenHamClock instance.
               </div>
-              <div style={{
-                fontFamily: 'JetBrains Mono, monospace',
-                fontSize: 11,
-                padding: '4px 10px',
-                borderRadius: 999,
-                border: `1px solid ${isLocalInstall ? 'var(--accent-cyan)' : 'rgba(255,255,255,0.18)'}`,
-                color: isLocalInstall ? 'var(--accent-cyan)' : 'var(--text-muted)',
-                background: isLocalInstall ? 'rgba(0,255,255,0.10)' : 'rgba(0,0,0,0.25)'
-              }}>
+              <div
+                style={{
+                  fontFamily: 'JetBrains Mono, monospace',
+                  fontSize: 11,
+                  padding: '4px 10px',
+                  borderRadius: 999,
+                  border: `1px solid ${isLocalInstall ? 'var(--accent-cyan)' : 'rgba(255,255,255,0.18)'}`,
+                  color: isLocalInstall ? 'var(--accent-cyan)' : 'var(--text-muted)',
+                  background: isLocalInstall ? 'rgba(0,255,255,0.10)' : 'rgba(0,0,0,0.25)',
+                }}
+              >
                 {isLocalInstall ? 'Local mode' : 'Hosted mode'}
               </div>
             </div>
 
             {/* Local-only group */}
-            <div style={{
-              background: 'rgba(0, 255, 255, 0.05)',
-              border: '1px solid var(--border-color)',
-              borderRadius: '10px',
-              padding: '14px 16px',
-              marginBottom: 16
-            }}>
-              <div style={{
-                display: 'flex',
-                alignItems: 'baseline',
-                justifyContent: 'space-between',
-                gap: 12,
-                marginBottom: 10
-              }}>
+            <div
+              style={{
+                background: 'rgba(0, 255, 255, 0.05)',
+                border: '1px solid var(--border-color)',
+                borderRadius: '10px',
+                padding: '14px 16px',
+                marginBottom: 16,
+              }}
+            >
+              <div
+                style={{
+                  display: 'flex',
+                  alignItems: 'baseline',
+                  justifyContent: 'space-between',
+                  gap: 12,
+                  marginBottom: 10,
+                }}
+              >
                 <div>
-                  <div style={{ color: 'var(--accent-cyan)', fontWeight: 800, letterSpacing: 0.2 }}>
-                    Local-only
-                  </div>
+                  <div style={{ color: 'var(--accent-cyan)', fontWeight: 800, letterSpacing: 0.2 }}>Local-only</div>
                   <div style={{ color: 'var(--text-secondary)', fontSize: 12, lineHeight: 1.45, marginTop: 4 }}>
                     These integrations are disabled on the hosted site so they can never crash or spam the network.
                   </div>
@@ -1456,20 +1714,31 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
               </div>
 
               {/* Rotator */}
-              <div style={{
-                borderTop: '1px solid rgba(255,255,255,0.08)',
-                paddingTop: 12,
-                marginTop: 8
-              }}>
+              <div
+                style={{
+                  borderTop: '1px solid rgba(255,255,255,0.08)',
+                  paddingTop: 12,
+                  marginTop: 8,
+                }}
+              >
                 <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', gap: 12 }}>
                   <div>
                     <div style={{ fontWeight: 700, color: 'var(--text-primary)' }}>🧭 Rotator</div>
                     <div style={{ color: 'var(--text-secondary)', fontSize: 12, lineHeight: 1.45 }}>
-                      Requires a rotator backend (e.g., PstRotatorAz or a simple HTTP bridge) reachable by your local OpenHamClock Node server.
+                      Requires a rotator backend (e.g., PstRotatorAz or a simple HTTP bridge) reachable by your local
+                      OpenHamClock Node server.
                     </div>
                   </div>
 
-                  <label style={{ display: 'flex', alignItems: 'center', gap: 8, fontFamily: 'JetBrains Mono, monospace', fontSize: 12 }}>
+                  <label
+                    style={{
+                      display: 'flex',
+                      alignItems: 'center',
+                      gap: 8,
+                      fontFamily: 'JetBrains Mono, monospace',
+                      fontSize: 12,
+                    }}
+                  >
                     <input
                       type="checkbox"
                       disabled={!isLocalInstall}
@@ -1477,7 +1746,9 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                       onChange={(e) => {
                         const next = !!e.target.checked;
                         setRotatorEnabled(next);
-                        try { localStorage.setItem('ohc_rotator_enabled', next ? '1' : '0'); } catch {}
+                        try {
+                          localStorage.setItem('ohc_rotator_enabled', next ? '1' : '0');
+                        } catch {}
                         // Default overlay OFF when enabling (hosted-safe + predictable)
                         if (next) {
                           try {
@@ -1487,7 +1758,9 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                             localStorage.setItem('openhamclock_mapLayers', JSON.stringify(ml));
                           } catch {}
                         }
-                        try { window.dispatchEvent(new Event('ohc-rotator-config-changed')); } catch {}
+                        try {
+                          window.dispatchEvent(new Event('ohc-rotator-config-changed'));
+                        } catch {}
                       }}
                     />
                     Enable
@@ -1497,10 +1770,10 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                 <details style={{ marginTop: 10 }}>
                   <summary
                     style={{
-                      cursor: "pointer",
-                      color: "var(--accent-amber)",
+                      cursor: 'pointer',
+                      color: 'var(--accent-amber)',
                       fontSize: 12,
-                      userSelect: "none",
+                      userSelect: 'none',
                     }}
                   >
                     Learn how
@@ -1509,7 +1782,7 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                   <div
                     style={{
                       marginTop: 8,
-                      color: "var(--text-secondary)",
+                      color: 'var(--text-secondary)',
                       fontSize: 12,
                       lineHeight: 1.55,
                     }}
@@ -1521,51 +1794,40 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                     <ol style={{ margin: 0, paddingLeft: 18 }}>
                       <li>
                         Run OpenHamClock locally:
-                        <div style={{ fontFamily: "JetBrains Mono", marginTop: 4 }}>
-                          npm start
-                        </div>
+                        <div style={{ fontFamily: 'JetBrains Mono', marginTop: 4 }}>npm start</div>
                         Open the local URL shown in your terminal (example: http://127.0.0.1:3001).
                       </li>
 
                       <li style={{ marginTop: 6 }}>
-                        Install and configure <b>PstRotatorAz</b> (or another rotator backend)
-                        on your LAN.
-                        <div style={{ marginTop: 4 }}>
-                          Enable and start its control interface (web/UDP).
-                        </div>
+                        Install and configure <b>PstRotatorAz</b> (or another rotator backend) on your LAN.
+                        <div style={{ marginTop: 4 }}>Enable and start its control interface (web/UDP).</div>
                       </li>
 
                       <li style={{ marginTop: 6 }}>
                         In the OpenHamClock folder:
-                        <div style={{ fontFamily: "JetBrains Mono", marginTop: 4 }}>
-                          copy .env.example → .env
-                        </div>
+                        <div style={{ fontFamily: 'JetBrains Mono', marginTop: 4 }}>copy .env.example → .env</div>
                         Then edit:
-                        <div style={{ fontFamily: "JetBrains Mono", marginTop: 4 }}>
+                        <div style={{ fontFamily: 'JetBrains Mono', marginTop: 4 }}>
                           VITE_PSTROTATOR_TARGET=http://192.168.1.43:50004
                         </div>
                         (Replace with the IP and port of your PstRotatorAz machine.)
                       </li>
 
-                      <li style={{ marginTop: 6 }}>
-                        Ensure Windows Firewall allows the PstRotatorAz port.
-                      </li>
+                      <li style={{ marginTop: 6 }}>Ensure Windows Firewall allows the PstRotatorAz port.</li>
 
                       <li style={{ marginTop: 6 }}>
-                        Enable Rotator here, then add the <b>Rotator</b> panel using the “+”
-                        button on any tabset.
+                        Enable Rotator here, then add the <b>Rotator</b> panel using the “+” button on any tabset.
                       </li>
                     </ol>
 
-                    <div style={{ marginTop: 10, fontSize: 11, color: "var(--text-muted)" }}>
-                      Tip: Click <b>MAP ON</b> inside the Rotator panel to show the bearing
-                      overlay. Hold <b>Shift</b> and click the map to rotate your antenna to
-                      that heading.
+                    <div style={{ marginTop: 10, fontSize: 11, color: 'var(--text-muted)' }}>
+                      Tip: Click <b>MAP ON</b> inside the Rotator panel to show the bearing overlay. Hold <b>Shift</b>{' '}
+                      and click the map to rotate your antenna to that heading.
                     </div>
 
-                    <div style={{ marginTop: 6, fontSize: 11, color: "var(--text-muted)" }}>
-                      Note: This feature cannot work on the hosted site because it requires
-                      access to devices on your local network.
+                    <div style={{ marginTop: 6, fontSize: 11, color: 'var(--text-muted)' }}>
+                      Note: This feature cannot work on the hosted site because it requires access to devices on your
+                      local network.
                     </div>
                   </div>
                 </details>
@@ -1574,22 +1836,23 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                   <div
                     style={{
                       marginTop: 8,
-                      color: "var(--text-muted)",
+                      color: 'var(--text-muted)',
                       fontSize: 11,
                     }}
                   >
                     Hosted mode detected — Rotator cannot be enabled here.
                   </div>
                 )}
-
               </div>
 
               {/* N3FJP */}
-              <div style={{
-                borderTop: '1px solid rgba(255,255,255,0.08)',
-                paddingTop: 12,
-                marginTop: 14
-              }}>
+              <div
+                style={{
+                  borderTop: '1px solid rgba(255,255,255,0.08)',
+                  paddingTop: 12,
+                  marginTop: 14,
+                }}
+              >
                 <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', gap: 12 }}>
                   <div>
                     <div style={{ fontWeight: 700, color: 'var(--text-primary)' }}>🗺️ N3FJP Logged QSOs</div>
@@ -1598,7 +1861,15 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                     </div>
                   </div>
 
-                  <label style={{ display: 'flex', alignItems: 'center', gap: 8, fontFamily: 'JetBrains Mono, monospace', fontSize: 12 }}>
+                  <label
+                    style={{
+                      display: 'flex',
+                      alignItems: 'center',
+                      gap: 8,
+                      fontFamily: 'JetBrains Mono, monospace',
+                      fontSize: 12,
+                    }}
+                  >
                     <input
                       type="checkbox"
                       disabled={!isLocalInstall}
@@ -1606,8 +1877,12 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                       onChange={(e) => {
                         const next = !!e.target.checked;
                         setN3fjpEnabled(next);
-                        try { localStorage.setItem('ohc_n3fjp_enabled', next ? '1' : '0'); } catch {}
-                        try { window.dispatchEvent(new Event('ohc-n3fjp-config-changed')); } catch {}
+                        try {
+                          localStorage.setItem('ohc_n3fjp_enabled', next ? '1' : '0');
+                        } catch {}
+                        try {
+                          window.dispatchEvent(new Event('ohc-n3fjp-config-changed'));
+                        } catch {}
 
                         // ✅ Also toggle the map layer automatically
                         try {
@@ -1633,7 +1908,16 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                 {/* Simple config */}
                 <div style={{ display: 'flex', gap: 10, marginTop: 10, flexWrap: 'wrap' }}>
                   <div style={{ flex: '1 1 160px' }}>
-                    <label style={{ display: 'block', marginBottom: 6, color: 'var(--text-muted)', fontSize: 11, textTransform: 'uppercase', letterSpacing: 1 }}>
+                    <label
+                      style={{
+                        display: 'block',
+                        marginBottom: 6,
+                        color: 'var(--text-muted)',
+                        fontSize: 11,
+                        textTransform: 'uppercase',
+                        letterSpacing: 1,
+                      }}
+                    >
                       Display window
                     </label>
                     <select
@@ -1643,8 +1927,12 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                         const v = parseInt(e.target.value, 10);
                         const next = Number.isFinite(v) ? v : 15;
                         setN3fjpDisplayMinutes(next);
-                        try { localStorage.setItem('n3fjp_display_minutes', String(next)); } catch {}
-                        try { window.dispatchEvent(new Event('ohc-n3fjp-config-changed')); } catch {}
+                        try {
+                          localStorage.setItem('n3fjp_display_minutes', String(next));
+                        } catch {}
+                        try {
+                          window.dispatchEvent(new Event('ohc-n3fjp-config-changed'));
+                        } catch {}
                       }}
                       style={{
                         width: '100%',
@@ -1654,19 +1942,28 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                         borderRadius: '6px',
                         color: 'var(--text-primary)',
                         fontSize: '14px',
-                        fontFamily: 'JetBrains Mono, monospace'
+                        fontFamily: 'JetBrains Mono, monospace',
                       }}
                     >
                       {[15, 30, 60, 120, 240, 720, 1440].map((m) => (
                         <option key={m} value={m}>
-                          {m === 60 ? "1 hour" : m < 60 ? `${m} min` : `${m / 60} hours`}
+                          {m === 60 ? '1 hour' : m < 60 ? `${m} min` : `${m / 60} hours`}
                         </option>
                       ))}
                     </select>
                   </div>
 
                   <div style={{ flex: '0 0 120px' }}>
-                    <label style={{ display: 'block', marginBottom: 6, color: 'var(--text-muted)', fontSize: 11, textTransform: 'uppercase', letterSpacing: 1 }}>
+                    <label
+                      style={{
+                        display: 'block',
+                        marginBottom: 6,
+                        color: 'var(--text-muted)',
+                        fontSize: 11,
+                        textTransform: 'uppercase',
+                        letterSpacing: 1,
+                      }}
+                    >
                       Line color
                     </label>
                     <input
@@ -1676,16 +1973,20 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                       onChange={(e) => {
                         const next = e.target.value || '#3388ff';
                         setN3fjpLineColor(next);
-                        try { localStorage.setItem('n3fjp_line_color', next); } catch {}
-                        try { window.dispatchEvent(new Event('ohc-n3fjp-config-changed')); } catch {}
-                      }}
-                      style={{
+                        try {
+                          localStorage.setItem('n3fjp_line_color', next);
+                        } catch {}
+                        try {
+                          window.dispatchEvent(new Event('ohc-n3fjp-config-changed'));
+                        } catch {}
+                      }}
+                      style={{
                         width: '100%',
                         height: 40,
                         padding: 0,
                         border: '1px solid var(--border-color)',
                         borderRadius: 6,
-                        background: 'transparent'
+                        background: 'transparent',
                       }}
                     />
                   </div>
@@ -1694,10 +1995,10 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                 <details style={{ marginTop: 10 }}>
                   <summary
                     style={{
-                      cursor: "pointer",
-                      color: "var(--accent-amber)",
+                      cursor: 'pointer',
+                      color: 'var(--accent-amber)',
                       fontSize: 12,
-                      userSelect: "none",
+                      userSelect: 'none',
                     }}
                   >
                     Learn how
@@ -1706,7 +2007,7 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                   <div
                     style={{
                       marginTop: 8,
-                      color: "var(--text-secondary)",
+                      color: 'var(--text-secondary)',
                       fontSize: 12,
                       lineHeight: 1.55,
                     }}
@@ -1718,21 +2019,17 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                     <ol style={{ margin: 0, paddingLeft: 18 }}>
                       <li>
                         Run OpenHamClock locally:
-                        <div style={{ fontFamily: "JetBrains Mono", marginTop: 4 }}>
-                          npm start
-                        </div>
-                        Open the local URL shown in your terminal
-                        (example: http://127.0.0.1:3001).
+                        <div style={{ fontFamily: 'JetBrains Mono', marginTop: 4 }}>npm start</div>
+                        Open the local URL shown in your terminal (example: http://127.0.0.1:3001).
                       </li>
 
                       <li style={{ marginTop: 6 }}>
-                        Install the N3FJP bridge on the same PC (or LAN machine)
-                        that can access your N3FJP logger.
+                        Install the N3FJP bridge on the same PC (or LAN machine) that can access your N3FJP logger.
                       </li>
 
                       <li style={{ marginTop: 6 }}>
                         Edit the bridge <b>config.json</b> file and set:
-                        <div style={{ fontFamily: "JetBrains Mono", marginTop: 4 }}>
+                        <div style={{ fontFamily: 'JetBrains Mono', marginTop: 4 }}>
                           "OHC_BASE_URL": "http://127.0.0.1:3001"
                         </div>
                         (Use the exact URL printed by OpenHamClock.)
@@ -1740,14 +2037,12 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
 
                       <li style={{ marginTop: 6 }}>
                         Ensure:
-                        <div style={{ fontFamily: "JetBrains Mono", marginTop: 4 }}>
-                          "ENABLE_OHC_HTTP": true
-                        </div>
+                        <div style={{ fontFamily: 'JetBrains Mono', marginTop: 4 }}>"ENABLE_OHC_HTTP": true</div>
                       </li>
 
                       <li style={{ marginTop: 6 }}>
-                        Start the bridge script (PowerShell or VBS launcher).
-                        You should see log messages when QSOs are entered.
+                        Start the bridge script (PowerShell or VBS launcher). You should see log messages when QSOs are
+                        entered.
                       </li>
 
                       <li style={{ marginTop: 6 }}>
@@ -1757,19 +2052,18 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                       </li>
                     </ol>
 
-                    <div style={{ marginTop: 10, fontSize: 11, color: "var(--text-muted)" }}>
-                      Tip: If you see “connection refused,” verify that OpenHamClock
-                      is running locally and that the port matches your
+                    <div style={{ marginTop: 10, fontSize: 11, color: 'var(--text-muted)' }}>
+                      Tip: If you see “connection refused,” verify that OpenHamClock is running locally and that the
+                      port matches your
                       <b> OHC_BASE_URL</b> setting.
                     </div>
 
-                    <div style={{ marginTop: 6, fontSize: 11, color: "var(--text-muted)" }}>
-                      Note: This integration cannot work on the hosted site because it
-                      requires access to your local N3FJP logger and LAN services.
+                    <div style={{ marginTop: 6, fontSize: 11, color: 'var(--text-muted)' }}>
+                      Note: This integration cannot work on the hosted site because it requires access to your local
+                      N3FJP logger and LAN services.
                     </div>
                   </div>
                 </details>
-
               </div>
             </div>
           </div>
@@ -1779,28 +2073,34 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
         {activeTab === 'layers' && (
           <div>
             {/* Map Overlays section */}
-            <div style={{
-              background: 'var(--bg-tertiary)',
-              border: '1px solid var(--border-color)',
-              borderRadius: '8px',
-              padding: '14px',
-              marginBottom: '16px'
-            }}>
-              <div style={{
-                fontSize: '11px',
-                textTransform: 'uppercase',
-                letterSpacing: '0.5px',
-                color: 'var(--text-muted)',
-                marginBottom: '10px'
-              }}>
+            <div
+              style={{
+                background: 'var(--bg-tertiary)',
+                border: '1px solid var(--border-color)',
+                borderRadius: '8px',
+                padding: '14px',
+                marginBottom: '16px',
+              }}
+            >
+              <div
+                style={{
+                  fontSize: '11px',
+                  textTransform: 'uppercase',
+                  letterSpacing: '0.5px',
+                  color: 'var(--text-muted)',
+                  marginBottom: '10px',
+                }}
+              >
                 Map Overlays
               </div>
-              <label style={{
-                display: 'flex',
-                alignItems: 'center',
-                gap: '10px',
-                cursor: 'pointer'
-              }}>
+              <label
+                style={{
+                  display: 'flex',
+                  alignItems: 'center',
+                  gap: '10px',
+                  cursor: 'pointer',
+                }}
+              >
                 <input
                   type="checkbox"
                   checked={mapLayers?.showDXNews !== false}
@@ -1809,12 +2109,14 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                 />
                 <span style={{ fontSize: '18px' }}>📰</span>
                 <div>
-                  <div style={{
-                    color: mapLayers?.showDXNews !== false ? 'var(--accent-amber)' : 'var(--text-primary)',
-                    fontSize: '14px',
-                    fontWeight: '600',
-                    fontFamily: 'JetBrains Mono, monospace'
-                  }}>
+                  <div
+                    style={{
+                      color: mapLayers?.showDXNews !== false ? 'var(--accent-amber)' : 'var(--text-primary)',
+                      fontSize: '14px',
+                      fontWeight: '600',
+                      fontFamily: 'JetBrains Mono, monospace',
+                    }}
+                  >
                     DX News Ticker
                   </div>
                   <div style={{ fontSize: '11px', color: 'var(--text-muted)', marginTop: '2px' }}>
@@ -1826,23 +2128,35 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
 
             {layers.length > 0 ? (
               layers
-                .filter(layer => layer.category !== 'satellites') // Correctly filter out satellites
-                .map(layer => (
-                  <div key={layer.id} style={{
-                    background: 'var(--bg-tertiary)',
-                    border: `1px solid ${layer.enabled ? 'var(--accent-amber)' : 'var(--border-color)'}`,
-                    borderRadius: '8px',
-                    padding: '14px',
-                    marginBottom: '12px'
-                  }}>
-                    <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', marginBottom: '8px' }}>
-                      <label style={{
+                .filter((layer) => layer.category !== 'satellites') // Correctly filter out satellites
+                .map((layer) => (
+                  <div
+                    key={layer.id}
+                    style={{
+                      background: 'var(--bg-tertiary)',
+                      border: `1px solid ${layer.enabled ? 'var(--accent-amber)' : 'var(--border-color)'}`,
+                      borderRadius: '8px',
+                      padding: '14px',
+                      marginBottom: '12px',
+                    }}
+                  >
+                    <div
+                      style={{
                         display: 'flex',
                         alignItems: 'center',
-                        gap: '10px',
-                        cursor: 'pointer',
-                        flex: 1
-                      }}>
+                        justifyContent: 'space-between',
+                        marginBottom: '8px',
+                      }}
+                    >
+                      <label
+                        style={{
+                          display: 'flex',
+                          alignItems: 'center',
+                          gap: '10px',
+                          cursor: 'pointer',
+                          flex: 1,
+                        }}
+                      >
                         <input
                           type="checkbox"
                           checked={layer.enabled}
@@ -1850,52 +2164,60 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                           style={{
                             width: '18px',
                             height: '18px',
-                            cursor: 'pointer'
+                            cursor: 'pointer',
                           }}
                         />
                         <span style={{ fontSize: '18px' }}>{layer.icon}</span>
                         <div>
-                          <div style={{
-                            color: layer.enabled ? 'var(--accent-amber)' : 'var(--text-primary)',
-                            fontSize: '14px',
-                            fontWeight: '600',
-                            fontFamily: 'JetBrains Mono, monospace'
-                          }}>
+                          <div
+                            style={{
+                              color: layer.enabled ? 'var(--accent-amber)' : 'var(--text-primary)',
+                              fontSize: '14px',
+                              fontWeight: '600',
+                              fontFamily: 'JetBrains Mono, monospace',
+                            }}
+                          >
                             {layer.name.startsWith('plugins.') ? t(layer.name) : layer.name}
                           </div>
                           {layer.description && (
-                            <div style={{
-                              fontSize: '11px',
-                              color: 'var(--text-muted)',
-                              marginTop: '2px'
-                            }}>
+                            <div
+                              style={{
+                                fontSize: '11px',
+                                color: 'var(--text-muted)',
+                                marginTop: '2px',
+                              }}
+                            >
                               {layer.description.startsWith('plugins.') ? t(layer.description) : layer.description}
                             </div>
                           )}
                         </div>
                       </label>
-                      <span style={{
-                        fontSize: '11px',
-                        textTransform: 'uppercase',
-                        color: 'var(--text-secondary)',
-                        background: 'var(--bg-hover)',
-                        padding: '2px 8px',
-                        borderRadius: '3px'
-                      }}>
+                      <span
+                        style={{
+                          fontSize: '11px',
+                          textTransform: 'uppercase',
+                          color: 'var(--text-secondary)',
+                          background: 'var(--bg-hover)',
+                          padding: '2px 8px',
+                          borderRadius: '3px',
+                        }}
+                      >
                         {layer.category}
                       </span>
                     </div>
 
                     {layer.enabled && (
                       <div style={{ paddingLeft: '38px', marginTop: '12px' }}>
-                        <label style={{
-                          display: 'block',
-                          fontSize: '11px',
-                          color: 'var(--text-muted)',
-                          marginBottom: '6px',
-                          textTransform: 'uppercase',
-                          letterSpacing: '0.5px'
-                        }}>
+                        <label
+                          style={{
+                            display: 'block',
+                            fontSize: '11px',
+                            color: 'var(--text-muted)',
+                            marginBottom: '6px',
+                            textTransform: 'uppercase',
+                            letterSpacing: '0.5px',
+                          }}
+                        >
                           {t('station.settings.layers.opacity')}: {Math.round(layer.opacity * 100)}%
                         </label>
                         <input
@@ -1906,42 +2228,47 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                           onChange={(e) => handleOpacityChange(layer.id, parseFloat(e.target.value) / 100)}
                           style={{
                             width: '100%',
-                            cursor: 'pointer'
+                            cursor: 'pointer',
                           }}
                         />
 
                         {/* CTRL+Click Reset Button - Hidden unless CTRL is pressed */}
-                        {ctrlPressed && ['lightning', 'wspr', 'rbn', 'grayline', 'n3fjp_logged_qsos', 'voacap-heatmap'].includes(layer.id) && (
-                          <button
-                            onClick={() => resetPopupPositions(layer.id)}
-                            style={{
-                              marginTop: '12px',
-                              padding: '8px 12px',
-                              background: 'var(--accent-red)',
-                              color: 'white',
-                              border: 'none',
-                              borderRadius: '4px',
-                              cursor: 'pointer',
-                              fontSize: '11px',
-                              fontWeight: '600',
-                              textTransform: 'uppercase',
-                              width: '100%'
-                            }}
-                          >
-                            🔄 RESET POPUPS
-                          </button>
-                        )}
+                        {ctrlPressed &&
+                          ['lightning', 'wspr', 'rbn', 'grayline', 'n3fjp_logged_qsos', 'voacap-heatmap'].includes(
+                            layer.id,
+                          ) && (
+                            <button
+                              onClick={() => resetPopupPositions(layer.id)}
+                              style={{
+                                marginTop: '12px',
+                                padding: '8px 12px',
+                                background: 'var(--accent-red)',
+                                color: 'white',
+                                border: 'none',
+                                borderRadius: '4px',
+                                cursor: 'pointer',
+                                fontSize: '11px',
+                                fontWeight: '600',
+                                textTransform: 'uppercase',
+                                width: '100%',
+                              }}
+                            >
+                              🔄 RESET POPUPS
+                            </button>
+                          )}
                       </div>
                     )}
                   </div>
                 ))
             ) : (
-              <div style={{
-                textAlign: 'center',
-                padding: '40px 20px',
-                color: 'var(--text-muted)',
-                fontSize: '13px'
-              }}>
+              <div
+                style={{
+                  textAlign: 'center',
+                  padding: '40px 20px',
+                  color: 'var(--text-muted)',
+                  fontSize: '13px',
+                }}
+              >
                 {t('station.settings.layers.noLayers')}
               </div>
             )}
@@ -1954,15 +2281,18 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
             {/* 1. Plugin Layer Toggle Section */}
             <div style={{ marginBottom: '20px' }}>
               {layers
-                .filter(layer => layer.category === 'satellites')
-                .map(layer => (
-                  <div key={layer.id} style={{
-                    background: 'var(--bg-tertiary)',
-                    border: `1px solid ${layer.enabled ? 'var(--accent-amber)' : 'var(--border-color)'}`,
-                    borderRadius: '8px',
-                    padding: '14px',
-                    marginBottom: '12px'
-                  }}>
+                .filter((layer) => layer.category === 'satellites')
+                .map((layer) => (
+                  <div
+                    key={layer.id}
+                    style={{
+                      background: 'var(--bg-tertiary)',
+                      border: `1px solid ${layer.enabled ? 'var(--accent-amber)' : 'var(--border-color)'}`,
+                      borderRadius: '8px',
+                      padding: '14px',
+                      marginBottom: '12px',
+                    }}
+                  >
                     <label style={{ display: 'flex', alignItems: 'center', gap: '10px', cursor: 'pointer' }}>
                       <input
                         type="checkbox"
@@ -1972,37 +2302,63 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                       />
                       <span style={{ fontSize: '18px' }}>🛰️</span>
                       <div>
-                        <div style={{
-                          color: layer.enabled ? 'var(--accent-amber)' : 'var(--text-primary)',
-                          fontSize: '14px',
-                          fontWeight: '600',
-                          fontFamily: 'JetBrains Mono, monospace'
-                        }}>
+                        <div
+                          style={{
+                            color: layer.enabled ? 'var(--accent-amber)' : 'var(--text-primary)',
+                            fontSize: '14px',
+                            fontWeight: '600',
+                            fontFamily: 'JetBrains Mono, monospace',
+                          }}
+                        >
                           {layer.name}
                         </div>
-                        <div style={{ fontSize: '11px', color: 'var(--text-muted)' }}>
-                          {layer.description}
-                        </div>
+                        <div style={{ fontSize: '11px', color: 'var(--text-muted)' }}>{layer.description}</div>
                       </div>
                     </label>
 
                     {layer.enabled && (
-                      <div style={{ paddingLeft: '38px', marginTop: '10px', display: 'flex', flexDirection: 'column', gap: '12px' }}>
+                      <div
+                        style={{
+                          paddingLeft: '38px',
+                          marginTop: '10px',
+                          display: 'flex',
+                          flexDirection: 'column',
+                          gap: '12px',
+                        }}
+                      >
                         {/* Sub-Toggles for Tracks and Footprints */}
                         <div style={{ display: 'flex', gap: '15px' }}>
-                          <label style={{ display: 'flex', alignItems: 'center', gap: '6px', fontSize: '11px', cursor: 'pointer' }}>
+                          <label
+                            style={{
+                              display: 'flex',
+                              alignItems: 'center',
+                              gap: '6px',
+                              fontSize: '11px',
+                              cursor: 'pointer',
+                            }}
+                          >
                             <input
                               type="checkbox"
                               checked={layer.config?.showTracks !== false}
                               onChange={(e) => handleUpdateLayerConfig(layer.id, { showTracks: e.target.checked })}
-                            /> Track Lines
+                            />{' '}
+                            Track Lines
                           </label>
-                          <label style={{ display: 'flex', alignItems: 'center', gap: '6px', fontSize: '11px', cursor: 'pointer' }}>
+                          <label
+                            style={{
+                              display: 'flex',
+                              alignItems: 'center',
+                              gap: '6px',
+                              fontSize: '11px',
+                              cursor: 'pointer',
+                            }}
+                          >
                             <input
                               type="checkbox"
                               checked={layer.config?.showFootprints !== false}
                               onChange={(e) => handleUpdateLayerConfig(layer.id, { showFootprints: e.target.checked })}
-                            /> Footprints
+                            />{' '}
+                            Footprints
                           </label>
                         </div>
                         {/* Lead Time Slider WIP
@@ -2049,16 +2405,18 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
             </div>
 
             {/* 2. Existing Satellite Filter Controls */}
-            <div style={{
-              display: 'flex',
-              justifyContent: 'space-between',
-              marginBottom: '16px',
-              paddingBottom: '12px',
-              borderBottom: '1px solid var(--border-color)'
-            }}>
+            <div
+              style={{
+                display: 'flex',
+                justifyContent: 'space-between',
+                marginBottom: '16px',
+                paddingBottom: '12px',
+                borderBottom: '1px solid var(--border-color)',
+              }}
+            >
               <button
                 onClick={() => {
-                  const allSats = (satellites || []).map(s => s.name);
+                  const allSats = (satellites || []).map((s) => s.name);
                   onSatelliteFiltersChange(allSats);
                 }}
                 style={{
@@ -2069,9 +2427,11 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                   padding: '6px 12px',
                   fontSize: '12px',
                   cursor: 'pointer',
-                  fontFamily: 'JetBrains Mono'
+                  fontFamily: 'JetBrains Mono',
                 }}
-              >{t('station.settings.satellites.selectAll')}</button>
+              >
+                {t('station.settings.satellites.selectAll')}
+              </button>
               <button
                 onClick={() => onSatelliteFiltersChange([])}
                 style={{
@@ -2082,16 +2442,20 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                   padding: '6px 12px',
                   fontSize: '12px',
                   cursor: 'pointer',
-                  fontFamily: 'JetBrains Mono'
+                  fontFamily: 'JetBrains Mono',
                 }}
-              >{t('station.settings.satellites.clear')}</button>
+              >
+                {t('station.settings.satellites.clear')}
+              </button>
             </div>
 
-            <div style={{
-              fontSize: '11px',
-              color: 'var(--text-muted)',
-              marginBottom: '12px'
-            }}>
+            <div
+              style={{
+                fontSize: '11px',
+                color: 'var(--text-muted)',
+                marginBottom: '12px',
+              }}
+            >
               {satelliteFilters.length === 0
                 ? t('station.settings.satellites.showAll')
                 : t('station.settings.satellites.selectedCount', { count: satelliteFilters.length })}
@@ -2113,7 +2477,7 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                   color: 'var(--text-primary)',
                   fontFamily: 'JetBrains Mono',
                   fontSize: '12px',
-                  outline: 'none'
+                  outline: 'none',
                 }}
               />
               {satelliteSearch && (
@@ -2129,25 +2493,26 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                     color: '#ff6666',
                     cursor: 'pointer',
                     fontSize: '16px',
-                    padding: '4px 8px'
+                    padding: '4px 8px',
                   }}
-                >×</button>
+                >
+                  ×
+                </button>
               )}
             </div>
 
             {/* Satellite Grid */}
-            <div style={{
-              display: 'grid',
-              gridTemplateColumns: 'repeat(2, 1fr)',
-              gap: '8px',
-              maxHeight: '400px',
-              overflowY: 'auto'
-            }}>
+            <div
+              style={{
+                display: 'grid',
+                gridTemplateColumns: 'repeat(2, 1fr)',
+                gap: '8px',
+                maxHeight: '400px',
+                overflowY: 'auto',
+              }}
+            >
               {(satellites || [])
-                .filter(sat =>
-                  !satelliteSearch ||
-                  sat.name.toLowerCase().includes(satelliteSearch.toLowerCase())
-                )
+                .filter((sat) => !satelliteSearch || sat.name.toLowerCase().includes(satelliteSearch.toLowerCase()))
                 .sort((a, b) => {
                   const aSelected = satelliteFilters.includes(a.name);
                   const bSelected = satelliteFilters.includes(b.name);
@@ -2155,14 +2520,14 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                   if (!aSelected && bSelected) return 1;
                   return a.name.localeCompare(b.name);
                 })
-                .map(sat => {
+                .map((sat) => {
                   const isSelected = satelliteFilters.includes(sat.name);
                   return (
                     <button
                       key={sat.name}
                       onClick={() => {
                         if (isSelected) {
-                          onSatelliteFiltersChange(satelliteFilters.filter(n => n !== sat.name));
+                          onSatelliteFiltersChange(satelliteFilters.filter((n) => n !== sat.name));
                         } else {
                           onSatelliteFiltersChange([...satelliteFilters, sat.name]);
                         }
@@ -2179,31 +2544,37 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                         fontSize: '12px',
                         display: 'flex',
                         alignItems: 'center',
-                        gap: '8px'
+                        gap: '8px',
                       }}
                     >
-                      <span style={{
-                        width: '16px',
-                        height: '16px',
-                        borderRadius: '3px',
-                        border: `2px solid ${isSelected ? '#00ffff' : '#666'}`,
-                        background: isSelected ? '#00ffff' : 'transparent',
-                        display: 'flex',
-                        alignItems: 'center',
-                        justifyContent: 'center',
-                        fontSize: '10px',
-                        flexShrink: 0
-                      }}>
+                      <span
+                        style={{
+                          width: '16px',
+                          height: '16px',
+                          borderRadius: '3px',
+                          border: `2px solid ${isSelected ? '#00ffff' : '#666'}`,
+                          background: isSelected ? '#00ffff' : 'transparent',
+                          display: 'flex',
+                          alignItems: 'center',
+                          justifyContent: 'center',
+                          fontSize: '10px',
+                          flexShrink: 0,
+                        }}
+                      >
                         {isSelected && '✓'}
                       </span>
                       <div style={{ flex: 1, overflow: 'hidden' }}>
-                        <div style={{
-                          color: isSelected ? '#00ffff' : 'var(--text-primary)',
-                          fontWeight: '600',
-                          whiteSpace: 'nowrap',
-                          overflow: 'hidden',
-                          textOverflow: 'ellipsis'
-                        }}>{sat.name}</div>
+                        <div
+                          style={{
+                            color: isSelected ? '#00ffff' : 'var(--text-primary)',
+                            fontWeight: '600',
+                            whiteSpace: 'nowrap',
+                            overflow: 'hidden',
+                            textOverflow: 'ellipsis',
+                          }}
+                        >
+                          {sat.name}
+                        </div>
                       </div>
                     </button>
                   );
@@ -2217,48 +2588,56 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
           <div style={{ display: 'flex', flexDirection: 'column', gap: '16px' }}>
             {/* Description */}
             <div style={{ fontSize: '12px', color: 'var(--text-muted)', lineHeight: '1.5' }}>
-              Save your current layout, theme, map layers, filters, and all preferences as a named profile.
-              Switch between profiles when sharing a HamClock between operators, or to toggle between your own saved views.
+              Save your current layout, theme, map layers, filters, and all preferences as a named profile. Switch
+              between profiles when sharing a HamClock between operators, or to toggle between your own saved views.
             </div>
 
             {/* Active profile indicator */}
             {activeProfileName && (
-              <div style={{
-                display: 'flex',
-                alignItems: 'center',
-                gap: '8px',
-                padding: '8px 12px',
-                background: 'rgba(0, 255, 136, 0.1)',
-                border: '1px solid rgba(0, 255, 136, 0.3)',
-                borderRadius: '6px',
-                fontSize: '12px'
-              }}>
+              <div
+                style={{
+                  display: 'flex',
+                  alignItems: 'center',
+                  gap: '8px',
+                  padding: '8px 12px',
+                  background: 'rgba(0, 255, 136, 0.1)',
+                  border: '1px solid rgba(0, 255, 136, 0.3)',
+                  borderRadius: '6px',
+                  fontSize: '12px',
+                }}
+              >
                 <span style={{ color: '#00ff88' }}>●</span>
-                <span style={{ color: 'var(--text-primary)' }}>Active: <strong>{activeProfileName}</strong></span>
+                <span style={{ color: 'var(--text-primary)' }}>
+                  Active: <strong>{activeProfileName}</strong>
+                </span>
               </div>
             )}
 
             {/* Status message */}
             {profileMessage && (
-              <div style={{
-                padding: '8px 12px',
-                background: profileMessage.type === 'error' ? 'rgba(255, 68, 102, 0.1)' : 'rgba(0, 255, 136, 0.1)',
-                border: `1px solid ${profileMessage.type === 'error' ? 'rgba(255, 68, 102, 0.3)' : 'rgba(0, 255, 136, 0.3)'}`,
-                borderRadius: '6px',
-                fontSize: '11px',
-                color: profileMessage.type === 'error' ? '#ff4466' : '#00ff88'
-              }}>
+              <div
+                style={{
+                  padding: '8px 12px',
+                  background: profileMessage.type === 'error' ? 'rgba(255, 68, 102, 0.1)' : 'rgba(0, 255, 136, 0.1)',
+                  border: `1px solid ${profileMessage.type === 'error' ? 'rgba(255, 68, 102, 0.3)' : 'rgba(0, 255, 136, 0.3)'}`,
+                  borderRadius: '6px',
+                  fontSize: '11px',
+                  color: profileMessage.type === 'error' ? '#ff4466' : '#00ff88',
+                }}
+              >
                 {profileMessage.text}
               </div>
             )}
 
             {/* Save new profile */}
-            <div style={{
-              padding: '12px',
-              background: 'var(--bg-tertiary)',
-              borderRadius: '8px',
-              border: '1px solid var(--border-color)'
-            }}>
+            <div
+              style={{
+                padding: '12px',
+                background: 'var(--bg-tertiary)',
+                borderRadius: '8px',
+                border: '1px solid var(--border-color)',
+              }}
+            >
               <div style={{ fontSize: '12px', fontWeight: '600', color: 'var(--accent-amber)', marginBottom: '8px' }}>
                 💾 Save Current State as Profile
               </div>
@@ -2270,7 +2649,8 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                   onKeyDown={(e) => {
                     if (e.key === 'Enter' && newProfileName.trim()) {
                       const exists = profiles[newProfileName.trim()];
-                      if (exists && !window.confirm(`Profile "${newProfileName.trim()}" already exists. Overwrite?`)) return;
+                      if (exists && !window.confirm(`Profile "${newProfileName.trim()}" already exists. Overwrite?`))
+                        return;
                       saveProfile(newProfileName.trim());
                       setNewProfileName('');
                       refreshProfiles();
@@ -2287,14 +2667,15 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                     borderRadius: '4px',
                     color: 'var(--text-primary)',
                     fontSize: '12px',
-                    fontFamily: 'JetBrains Mono, monospace'
+                    fontFamily: 'JetBrains Mono, monospace',
                   }}
                 />
                 <button
                   onClick={() => {
                     if (!newProfileName.trim()) return;
                     const exists = profiles[newProfileName.trim()];
-                    if (exists && !window.confirm(`Profile "${newProfileName.trim()}" already exists. Overwrite?`)) return;
+                    if (exists && !window.confirm(`Profile "${newProfileName.trim()}" already exists. Overwrite?`))
+                      return;
                     saveProfile(newProfileName.trim());
                     setNewProfileName('');
                     refreshProfiles();
@@ -2304,14 +2685,16 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                   disabled={!newProfileName.trim()}
                   style={{
                     padding: '8px 16px',
-                    background: newProfileName.trim() ? 'linear-gradient(135deg, #00ff88 0%, #00ddff 100%)' : 'var(--bg-tertiary)',
+                    background: newProfileName.trim()
+                      ? 'linear-gradient(135deg, #00ff88 0%, #00ddff 100%)'
+                      : 'var(--bg-tertiary)',
                     border: 'none',
                     borderRadius: '4px',
                     color: newProfileName.trim() ? '#000' : 'var(--text-muted)',
                     fontSize: '12px',
                     fontWeight: '700',
                     cursor: newProfileName.trim() ? 'pointer' : 'default',
-                    whiteSpace: 'nowrap'
+                    whiteSpace: 'nowrap',
                   }}
                 >
                   Save
@@ -2325,15 +2708,17 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                 📋 Saved Profiles ({Object.keys(profiles).length})
               </div>
               {Object.keys(profiles).length === 0 ? (
-                <div style={{
-                  padding: '20px',
-                  textAlign: 'center',
-                  color: 'var(--text-muted)',
-                  fontSize: '12px',
-                  background: 'var(--bg-tertiary)',
-                  borderRadius: '8px',
-                  border: '1px dashed var(--border-color)'
-                }}>
+                <div
+                  style={{
+                    padding: '20px',
+                    textAlign: 'center',
+                    color: 'var(--text-muted)',
+                    fontSize: '12px',
+                    background: 'var(--bg-tertiary)',
+                    borderRadius: '8px',
+                    border: '1px dashed var(--border-color)',
+                  }}
+                >
                   No saved profiles yet. Save your current configuration above.
                 </div>
               ) : (
@@ -2349,25 +2734,28 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                       try {
                         const cfg = profile.snapshot?.openhamclock_config;
                         if (cfg) snapshotCallsign = JSON.parse(cfg).callsign || '';
-                      } catch { }
+                      } catch {}
 
                       // Parse layout type
                       let snapshotLayout = '';
                       try {
                         const cfg = profile.snapshot?.openhamclock_config;
                         if (cfg) snapshotLayout = JSON.parse(cfg).layout || '';
-                      } catch { }
+                      } catch {}
 
                       return (
-                        <div key={name} style={{
-                          display: 'flex',
-                          alignItems: 'center',
-                          gap: '8px',
-                          padding: '10px 12px',
-                          background: isActive ? 'rgba(0, 255, 136, 0.08)' : 'var(--bg-tertiary)',
-                          border: `1px solid ${isActive ? 'rgba(0, 255, 136, 0.3)' : 'var(--border-color)'}`,
-                          borderRadius: '6px',
-                        }}>
+                        <div
+                          key={name}
+                          style={{
+                            display: 'flex',
+                            alignItems: 'center',
+                            gap: '8px',
+                            padding: '10px 12px',
+                            background: isActive ? 'rgba(0, 255, 136, 0.08)' : 'var(--bg-tertiary)',
+                            border: `1px solid ${isActive ? 'rgba(0, 255, 136, 0.3)' : 'var(--border-color)'}`,
+                            borderRadius: '6px',
+                          }}
+                        >
                           {/* Profile info */}
                           <div style={{ flex: 1, minWidth: 0 }}>
                             {isRenaming ? (
@@ -2380,7 +2768,10 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                                     if (e.key === 'Enter') {
                                       if (renameProfile(name, renameValue)) {
                                         refreshProfiles();
-                                        setProfileMessage({ type: 'success', text: `Renamed to "${renameValue.trim()}"` });
+                                        setProfileMessage({
+                                          type: 'success',
+                                          text: `Renamed to "${renameValue.trim()}"`,
+                                        });
                                       } else {
                                         setProfileMessage({ type: 'error', text: 'Rename failed — name may be taken' });
                                       }
@@ -2398,44 +2789,75 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                                     borderRadius: '3px',
                                     color: 'var(--text-primary)',
                                     fontSize: '12px',
-                                    fontFamily: 'JetBrains Mono, monospace'
+                                    fontFamily: 'JetBrains Mono, monospace',
                                   }}
                                 />
-                                <button onClick={() => {
-                                  if (renameProfile(name, renameValue)) {
-                                    refreshProfiles();
-                                    setProfileMessage({ type: 'success', text: `Renamed to "${renameValue.trim()}"` });
-                                  } else {
-                                    setProfileMessage({ type: 'error', text: 'Rename failed — name may already exist' });
-                                  }
-                                  setRenamingProfile(null);
-                                  setTimeout(() => setProfileMessage(null), 3000);
-                                }} style={{
-                                  padding: '4px 8px', background: 'var(--accent-green)', border: 'none',
-                                  borderRadius: '3px', color: '#000', fontSize: '10px', cursor: 'pointer', fontWeight: '700'
-                                }}>✓</button>
-                                <button onClick={() => setRenamingProfile(null)} style={{
-                                  padding: '4px 8px', background: 'var(--bg-primary)', border: '1px solid var(--border-color)',
-                                  borderRadius: '3px', color: 'var(--text-muted)', fontSize: '10px', cursor: 'pointer'
-                                }}>✕</button>
+                                <button
+                                  onClick={() => {
+                                    if (renameProfile(name, renameValue)) {
+                                      refreshProfiles();
+                                      setProfileMessage({
+                                        type: 'success',
+                                        text: `Renamed to "${renameValue.trim()}"`,
+                                      });
+                                    } else {
+                                      setProfileMessage({
+                                        type: 'error',
+                                        text: 'Rename failed — name may already exist',
+                                      });
+                                    }
+                                    setRenamingProfile(null);
+                                    setTimeout(() => setProfileMessage(null), 3000);
+                                  }}
+                                  style={{
+                                    padding: '4px 8px',
+                                    background: 'var(--accent-green)',
+                                    border: 'none',
+                                    borderRadius: '3px',
+                                    color: '#000',
+                                    fontSize: '10px',
+                                    cursor: 'pointer',
+                                    fontWeight: '700',
+                                  }}
+                                >
+                                  ✓
+                                </button>
+                                <button
+                                  onClick={() => setRenamingProfile(null)}
+                                  style={{
+                                    padding: '4px 8px',
+                                    background: 'var(--bg-primary)',
+                                    border: '1px solid var(--border-color)',
+                                    borderRadius: '3px',
+                                    color: 'var(--text-muted)',
+                                    fontSize: '10px',
+                                    cursor: 'pointer',
+                                  }}
+                                >
+                                  ✕
+                                </button>
                               </div>
                             ) : (
                               <>
-                                <div style={{
-                                  fontSize: '13px',
-                                  fontWeight: '600',
-                                  color: isActive ? '#00ff88' : 'var(--text-primary)',
-                                  whiteSpace: 'nowrap',
-                                  overflow: 'hidden',
-                                  textOverflow: 'ellipsis'
-                                }}>
+                                <div
+                                  style={{
+                                    fontSize: '13px',
+                                    fontWeight: '600',
+                                    color: isActive ? '#00ff88' : 'var(--text-primary)',
+                                    whiteSpace: 'nowrap',
+                                    overflow: 'hidden',
+                                    textOverflow: 'ellipsis',
+                                  }}
+                                >
                                   {isActive && <span style={{ marginRight: '4px' }}>●</span>}
                                   {name}
                                 </div>
                                 <div style={{ fontSize: '10px', color: 'var(--text-muted)', marginTop: '2px' }}>
                                   {snapshotCallsign && <span>{snapshotCallsign}</span>}
                                   {snapshotLayout && <span> • {snapshotLayout}</span>}
-                                  {profile.updatedAt && <span> • {new Date(profile.updatedAt).toLocaleDateString()}</span>}
+                                  {profile.updatedAt && (
+                                    <span> • {new Date(profile.updatedAt).toLocaleDateString()}</span>
+                                  )}
                                 </div>
                               </>
                             )}
@@ -2447,7 +2869,11 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                               {/* Load */}
                               <button
                                 onClick={() => {
-                                  if (window.confirm(`Load profile "${name}"? This will replace your current settings and reload.`)) {
+                                  if (
+                                    window.confirm(
+                                      `Load profile "${name}"? This will replace your current settings and reload.`,
+                                    )
+                                  ) {
                                     loadProfile(name);
                                     window.location.reload();
                                   }
@@ -2461,7 +2887,7 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                                   color: isActive ? '#00ff88' : 'var(--text-secondary)',
                                   fontSize: '11px',
                                   cursor: 'pointer',
-                                  fontWeight: '600'
+                                  fontWeight: '600',
                                 }}
                               >
                                 {isActive ? '✓ Active' : '▶ Load'}
@@ -2482,12 +2908,17 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                                   borderRadius: '4px',
                                   color: 'var(--text-muted)',
                                   fontSize: '11px',
-                                  cursor: 'pointer'
+                                  cursor: 'pointer',
                                 }}
-                              >↻</button>
+                              >
+                                ↻
+                              </button>
                               {/* Rename */}
                               <button
-                                onClick={() => { setRenamingProfile(name); setRenameValue(name); }}
+                                onClick={() => {
+                                  setRenamingProfile(name);
+                                  setRenameValue(name);
+                                }}
                                 title="Rename"
                                 style={{
                                   padding: '5px 8px',
@@ -2496,9 +2927,11 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                                   borderRadius: '4px',
                                   color: 'var(--text-muted)',
                                   fontSize: '11px',
-                                  cursor: 'pointer'
+                                  cursor: 'pointer',
                                 }}
-                              >✎</button>
+                              >
+                                ✎
+                              </button>
                               {/* Export */}
                               <button
                                 onClick={() => {
@@ -2523,9 +2956,11 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                                   borderRadius: '4px',
                                   color: 'var(--text-muted)',
                                   fontSize: '11px',
-                                  cursor: 'pointer'
+                                  cursor: 'pointer',
                                 }}
-                              >⤓</button>
+                              >
+                                ⤓
+                              </button>
                               {/* Delete */}
                               <button
                                 onClick={() => {
@@ -2544,9 +2979,11 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                                   borderRadius: '4px',
                                   color: '#ff4466',
                                   fontSize: '11px',
-                                  cursor: 'pointer'
+                                  cursor: 'pointer',
                                 }}
-                              >✕</button>
+                              >
+                                ✕
+                              </button>
                             </div>
                           )}
                         </div>
@@ -2557,36 +2994,81 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
             </div>
 
             {/* QRZ.com XML API Credentials */}
-            <div style={{
-              padding: '12px',
-              background: 'var(--bg-tertiary)',
-              borderRadius: '8px',
-              border: '1px solid var(--border-color)',
-              marginBottom: '12px'
-            }}>
-              <div style={{ fontSize: '12px', fontWeight: '600', color: 'var(--accent-amber)', marginBottom: '4px', display: 'flex', alignItems: 'center', gap: '8px' }}>
+            <div
+              style={{
+                padding: '12px',
+                background: 'var(--bg-tertiary)',
+                borderRadius: '8px',
+                border: '1px solid var(--border-color)',
+                marginBottom: '12px',
+              }}
+            >
+              <div
+                style={{
+                  fontSize: '12px',
+                  fontWeight: '600',
+                  color: 'var(--accent-amber)',
+                  marginBottom: '4px',
+                  display: 'flex',
+                  alignItems: 'center',
+                  gap: '8px',
+                }}
+              >
                 <span>📡 QRZ.com Callsign Lookup</span>
                 {qrzStatus?.configured && (
-                  <span style={{
-                    fontSize: '10px', fontWeight: '500', padding: '1px 6px', borderRadius: '3px',
-                    background: qrzStatus.hasSession ? 'rgba(46, 204, 113, 0.15)' : 'rgba(241, 196, 15, 0.15)',
-                    color: qrzStatus.hasSession ? '#2ecc71' : '#f1c40f'
-                  }}>
+                  <span
+                    style={{
+                      fontSize: '10px',
+                      fontWeight: '500',
+                      padding: '1px 6px',
+                      borderRadius: '3px',
+                      background: qrzStatus.hasSession ? 'rgba(46, 204, 113, 0.15)' : 'rgba(241, 196, 15, 0.15)',
+                      color: qrzStatus.hasSession ? '#2ecc71' : '#f1c40f',
+                    }}
+                  >
                     {qrzStatus.hasSession ? '● Connected' : '○ Configured'}
                     {qrzStatus.source === 'env' ? ' (env)' : ''}
                   </span>
                 )}
               </div>
               <div style={{ fontSize: '11px', color: 'var(--text-muted)', marginBottom: '8px', lineHeight: 1.4 }}>
-                Enables precise station locations from <a href="https://www.qrz.com/i/subscriptions.html" target="_blank" rel="noopener" style={{ color: 'var(--accent-blue)' }}>QRZ.com</a> user
-                profiles (user-supplied coordinates, geocoded addresses, grid squares).
-                Without this, locations fall back to HamQTH (country-level only).
-                Requires a QRZ Logbook Data subscription.
+                Enables precise station locations from{' '}
+                <a
+                  href="https://www.qrz.com/i/subscriptions.html"
+                  target="_blank"
+                  rel="noopener"
+                  style={{ color: 'var(--accent-blue)' }}
+                >
+                  QRZ.com
+                </a>{' '}
+                user profiles (user-supplied coordinates, geocoded addresses, grid squares). Without this, locations
+                fall back to HamQTH (country-level only). Requires a QRZ Logbook Data subscription.
               </div>
               {qrzStatus?.source === 'env' ? (
-                <div style={{ fontSize: '11px', color: 'var(--text-muted)', padding: '8px', background: 'var(--bg-primary)', borderRadius: '4px' }}>
-                  ✓ Credentials configured via <code style={{ background: 'var(--bg-tertiary)', padding: '1px 4px', borderRadius: '2px' }}>QRZ_USERNAME</code> / <code style={{ background: 'var(--bg-tertiary)', padding: '1px 4px', borderRadius: '2px' }}>QRZ_PASSWORD</code> in .env file
-                  {qrzStatus.lookupCount > 0 && <span style={{ color: 'var(--accent-green)' }}> — {qrzStatus.lookupCount} lookups this session</span>}
+                <div
+                  style={{
+                    fontSize: '11px',
+                    color: 'var(--text-muted)',
+                    padding: '8px',
+                    background: 'var(--bg-primary)',
+                    borderRadius: '4px',
+                  }}
+                >
+                  ✓ Credentials configured via{' '}
+                  <code style={{ background: 'var(--bg-tertiary)', padding: '1px 4px', borderRadius: '2px' }}>
+                    QRZ_USERNAME
+                  </code>{' '}
+                  /{' '}
+                  <code style={{ background: 'var(--bg-tertiary)', padding: '1px 4px', borderRadius: '2px' }}>
+                    QRZ_PASSWORD
+                  </code>{' '}
+                  in .env file
+                  {qrzStatus.lookupCount > 0 && (
+                    <span style={{ color: 'var(--accent-green)' }}>
+                      {' '}
+                      — {qrzStatus.lookupCount} lookups this session
+                    </span>
+                  )}
                 </div>
               ) : (
                 <>
@@ -2597,10 +3079,15 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                       value={qrzUsername}
                       onChange={(e) => setQrzUsername(e.target.value)}
                       style={{
-                        flex: 1, padding: '8px 12px', background: 'var(--bg-primary)',
-                        border: '1px solid var(--border-color)', borderRadius: '4px',
-                        color: 'var(--text-primary)', fontSize: '12px', fontFamily: 'JetBrains Mono, monospace',
-                        boxSizing: 'border-box'
+                        flex: 1,
+                        padding: '8px 12px',
+                        background: 'var(--bg-primary)',
+                        border: '1px solid var(--border-color)',
+                        borderRadius: '4px',
+                        color: 'var(--text-primary)',
+                        fontSize: '12px',
+                        fontFamily: 'JetBrains Mono, monospace',
+                        boxSizing: 'border-box',
                       }}
                     />
                     <input
@@ -2609,10 +3096,15 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                       value={qrzPassword}
                       onChange={(e) => setQrzPassword(e.target.value)}
                       style={{
-                        flex: 1, padding: '8px 12px', background: 'var(--bg-primary)',
-                        border: '1px solid var(--border-color)', borderRadius: '4px',
-                        color: 'var(--text-primary)', fontSize: '12px', fontFamily: 'JetBrains Mono, monospace',
-                        boxSizing: 'border-box'
+                        flex: 1,
+                        padding: '8px 12px',
+                        background: 'var(--bg-primary)',
+                        border: '1px solid var(--border-color)',
+                        borderRadius: '4px',
+                        color: 'var(--text-primary)',
+                        fontSize: '12px',
+                        fontFamily: 'JetBrains Mono, monospace',
+                        boxSizing: 'border-box',
                       }}
                     />
                   </div>
@@ -2626,14 +3118,14 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                           const res = await fetch('/api/qrz/configure', {
                             method: 'POST',
                             headers: { 'Content-Type': 'application/json' },
-                            body: JSON.stringify({ username: qrzUsername.trim(), password: qrzPassword.trim() })
+                            body: JSON.stringify({ username: qrzUsername.trim(), password: qrzPassword.trim() }),
                           });
                           const data = await res.json();
                           if (data.success) {
                             setQrzMessage({ type: 'success', text: 'Connected to QRZ.com successfully!' });
                             setQrzPassword('');
                             // Refresh status
-                            const st = await fetch('/api/qrz/status').then(r => r.json());
+                            const st = await fetch('/api/qrz/status').then((r) => r.json());
                             setQrzStatus(st);
                           } else {
                             setQrzMessage({ type: 'error', text: data.error || 'Login failed' });
@@ -2644,9 +3136,15 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                         setQrzTesting(false);
                       }}
                       style={{
-                        padding: '6px 14px', fontSize: '11px', fontWeight: '600', borderRadius: '4px',
-                        border: 'none', cursor: (qrzTesting || !qrzUsername.trim() || !qrzPassword.trim()) ? 'not-allowed' : 'pointer',
-                        background: 'var(--accent-amber)', color: '#000', opacity: (qrzTesting || !qrzUsername.trim() || !qrzPassword.trim()) ? 0.5 : 1
+                        padding: '6px 14px',
+                        fontSize: '11px',
+                        fontWeight: '600',
+                        borderRadius: '4px',
+                        border: 'none',
+                        cursor: qrzTesting || !qrzUsername.trim() || !qrzPassword.trim() ? 'not-allowed' : 'pointer',
+                        background: 'var(--accent-amber)',
+                        color: '#000',
+                        opacity: qrzTesting || !qrzUsername.trim() || !qrzPassword.trim() ? 0.5 : 1,
                       }}
                     >
                       {qrzTesting ? 'Testing...' : 'Save & Test'}
@@ -2658,13 +3156,17 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                           setQrzUsername('');
                           setQrzPassword('');
                           setQrzMessage(null);
-                          const st = await fetch('/api/qrz/status').then(r => r.json());
+                          const st = await fetch('/api/qrz/status').then((r) => r.json());
                           setQrzStatus(st);
                         }}
                         style={{
-                          padding: '6px 12px', fontSize: '11px', borderRadius: '4px',
-                          border: '1px solid var(--border-color)', cursor: 'pointer',
-                          background: 'transparent', color: 'var(--text-muted)'
+                          padding: '6px 12px',
+                          fontSize: '11px',
+                          borderRadius: '4px',
+                          border: '1px solid var(--border-color)',
+                          cursor: 'pointer',
+                          background: 'transparent',
+                          color: 'var(--text-muted)',
                         }}
                       >
                         Remove
@@ -2677,11 +3179,17 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                     )}
                   </div>
                   {qrzMessage && (
-                    <div style={{
-                      marginTop: '6px', fontSize: '11px', padding: '6px 10px', borderRadius: '4px',
-                      background: qrzMessage.type === 'success' ? 'rgba(46, 204, 113, 0.1)' : 'rgba(231, 76, 60, 0.1)',
-                      color: qrzMessage.type === 'success' ? '#2ecc71' : '#e74c3c'
-                    }}>
+                    <div
+                      style={{
+                        marginTop: '6px',
+                        fontSize: '11px',
+                        padding: '6px 10px',
+                        borderRadius: '4px',
+                        background:
+                          qrzMessage.type === 'success' ? 'rgba(46, 204, 113, 0.1)' : 'rgba(231, 76, 60, 0.1)',
+                        color: qrzMessage.type === 'success' ? '#2ecc71' : '#e74c3c',
+                      }}
+                    >
                       {qrzMessage.type === 'success' ? '✓' : '✗'} {qrzMessage.text}
                     </div>
                   )}
@@ -2690,31 +3198,51 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
             </div>
 
             {/* Open-Meteo API Key (optional) */}
-            <div style={{
-              padding: '12px',
-              background: 'var(--bg-tertiary)',
-              borderRadius: '8px',
-              border: '1px solid var(--border-color)',
-              marginBottom: '12px'
-            }}>
+            <div
+              style={{
+                padding: '12px',
+                background: 'var(--bg-tertiary)',
+                borderRadius: '8px',
+                border: '1px solid var(--border-color)',
+                marginBottom: '12px',
+              }}
+            >
               <div style={{ fontSize: '12px', fontWeight: '600', color: 'var(--accent-amber)', marginBottom: '8px' }}>
-                🌡️ Open-Meteo API Key <span style={{ color: 'var(--text-muted)', fontWeight: '400', fontSize: '11px' }}>(optional)</span>
+                🌡️ Open-Meteo API Key{' '}
+                <span style={{ color: 'var(--text-muted)', fontWeight: '400', fontSize: '11px' }}>(optional)</span>
               </div>
               <div style={{ fontSize: '11px', color: 'var(--text-muted)', marginBottom: '8px', lineHeight: 1.4 }}>
-                Weather data is provided by Open-Meteo's free API. For higher rate limits or commercial use,
-                enter your API key from <a href="https://open-meteo.com/en/pricing" target="_blank" rel="noopener" style={{ color: 'var(--accent-blue)' }}>open-meteo.com</a>.
-                Leave blank for the free tier.
+                Weather data is provided by Open-Meteo's free API. For higher rate limits or commercial use, enter your
+                API key from{' '}
+                <a
+                  href="https://open-meteo.com/en/pricing"
+                  target="_blank"
+                  rel="noopener"
+                  style={{ color: 'var(--accent-blue)' }}
+                >
+                  open-meteo.com
+                </a>
+                . Leave blank for the free tier.
               </div>
               <input
                 type="text"
                 placeholder="Free tier (no key needed)"
-                defaultValue={(() => { try { return localStorage.getItem('ohc_openmeteo_apikey') || ''; } catch { return ''; } })()}
+                defaultValue={(() => {
+                  try {
+                    return localStorage.getItem('ohc_openmeteo_apikey') || '';
+                  } catch {
+                    return '';
+                  }
+                })()}
                 onChange={(e) => {
                   try {
                     const val = e.target.value.trim();
-                    if (val) { localStorage.setItem('ohc_openmeteo_apikey', val); }
-                    else { localStorage.removeItem('ohc_openmeteo_apikey'); }
-                  } catch { }
+                    if (val) {
+                      localStorage.setItem('ohc_openmeteo_apikey', val);
+                    } else {
+                      localStorage.removeItem('ohc_openmeteo_apikey');
+                    }
+                  } catch {}
                 }}
                 style={{
                   width: '100%',
@@ -2725,18 +3253,20 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                   color: 'var(--text-primary)',
                   fontSize: '12px',
                   fontFamily: 'JetBrains Mono, monospace',
-                  boxSizing: 'border-box'
+                  boxSizing: 'border-box',
                 }}
               />
             </div>
 
             {/* Import / Export section */}
-            <div style={{
-              padding: '12px',
-              background: 'var(--bg-tertiary)',
-              borderRadius: '8px',
-              border: '1px solid var(--border-color)'
-            }}>
+            <div
+              style={{
+                padding: '12px',
+                background: 'var(--bg-tertiary)',
+                borderRadius: '8px',
+                border: '1px solid var(--border-color)',
+              }}
+            >
               <div style={{ fontSize: '12px', fontWeight: '600', color: 'var(--accent-amber)', marginBottom: '8px' }}>
                 📦 Import / Export
               </div>
@@ -2774,7 +3304,7 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                     color: 'var(--text-secondary)',
                     fontSize: '11px',
                     cursor: 'pointer',
-                    fontWeight: '600'
+                    fontWeight: '600',
                   }}
                 >
                   ⤒ Import Profile from File
@@ -2800,14 +3330,15 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                     color: 'var(--text-secondary)',
                     fontSize: '11px',
                     cursor: 'pointer',
-                    fontWeight: '600'
+                    fontWeight: '600',
                   }}
                 >
                   ⤓ Export Current State
                 </button>
               </div>
               <div style={{ fontSize: '10px', color: 'var(--text-muted)', marginTop: '8px' }}>
-                Share profile files between devices or operators. Exported files contain all settings, layout preferences, map layers, and filter configurations.
+                Share profile files between devices or operators. Exported files contain all settings, layout
+                preferences, map layers, and filter configurations.
               </div>
             </div>
           </div>
@@ -2819,60 +3350,154 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
             <p style={{ fontSize: '13px', color: 'var(--text-secondary)', marginBottom: '8px' }}>
               Join the OpenHamClock community — report bugs, request features, and connect with other operators.
             </p>
-            <a href="https://github.com/accius/openhamclock" target="_blank" rel="noopener noreferrer" style={{
-              display: 'flex', alignItems: 'center', gap: '12px', padding: '14px 16px',
-              background: 'var(--bg-tertiary)', borderRadius: '8px', textDecoration: 'none',
-              color: 'var(--text-primary)', border: '1px solid transparent', transition: 'border-color 0.2s'
-            }} onMouseOver={e => e.currentTarget.style.borderColor = 'var(--border-color)'}
-               onMouseOut={e => e.currentTarget.style.borderColor = 'transparent'}>
-              <svg width="24" height="24" viewBox="0 0 24 24" fill="currentColor"><path d="M12 0C5.37 0 0 5.37 0 12c0 5.31 3.435 9.795 8.205 11.385.6.105.825-.255.825-.57 0-.285-.015-1.23-.015-2.235-3.015.555-3.795-.735-4.035-1.41-.135-.345-.72-1.41-1.23-1.695-.42-.225-1.02-.78-.015-.795.945-.015 1.62.87 1.845 1.23 1.08 1.815 2.805 1.305 3.495.99.105-.78.42-1.305.765-1.605-2.67-.3-5.46-1.335-5.46-5.925 0-1.305.465-2.385 1.23-3.225-.12-.3-.54-1.53.12-3.18 0 0 1.005-.315 3.3 1.23.96-.27 1.98-.405 3-.405s2.04.135 3 .405c2.295-1.56 3.3-1.23 3.3-1.23.66 1.65.24 2.88.12 3.18.765.84 1.23 1.905 1.23 3.225 0 4.605-2.805 5.625-5.475 5.925.435.375.81 1.095.81 2.22 0 1.605-.015 2.895-.015 3.3 0 .315.225.69.825.57A12.02 12.02 0 0024 12c0-6.63-5.37-12-12-12z"/></svg>
+            <a
+              href="https://github.com/accius/openhamclock"
+              target="_blank"
+              rel="noopener noreferrer"
+              style={{
+                display: 'flex',
+                alignItems: 'center',
+                gap: '12px',
+                padding: '14px 16px',
+                background: 'var(--bg-tertiary)',
+                borderRadius: '8px',
+                textDecoration: 'none',
+                color: 'var(--text-primary)',
+                border: '1px solid transparent',
+                transition: 'border-color 0.2s',
+              }}
+              onMouseOver={(e) => (e.currentTarget.style.borderColor = 'var(--border-color)')}
+              onMouseOut={(e) => (e.currentTarget.style.borderColor = 'transparent')}
+            >
+              <svg width="24" height="24" viewBox="0 0 24 24" fill="currentColor">
+                <path d="M12 0C5.37 0 0 5.37 0 12c0 5.31 3.435 9.795 8.205 11.385.6.105.825-.255.825-.57 0-.285-.015-1.23-.015-2.235-3.015.555-3.795-.735-4.035-1.41-.135-.345-.72-1.41-1.23-1.695-.42-.225-1.02-.78-.015-.795.945-.015 1.62.87 1.845 1.23 1.08 1.815 2.805 1.305 3.495.99.105-.78.42-1.305.765-1.605-2.67-.3-5.46-1.335-5.46-5.925 0-1.305.465-2.385 1.23-3.225-.12-.3-.54-1.53.12-3.18 0 0 1.005-.315 3.3 1.23.96-.27 1.98-.405 3-.405s2.04.135 3 .405c2.295-1.56 3.3-1.23 3.3-1.23.66 1.65.24 2.88.12 3.18.765.84 1.23 1.905 1.23 3.225 0 4.605-2.805 5.625-5.475 5.925.435.375.81 1.095.81 2.22 0 1.605-.015 2.895-.015 3.3 0 .315.225.69.825.57A12.02 12.02 0 0024 12c0-6.63-5.37-12-12-12z" />
+              </svg>
               <div>
                 <div style={{ fontWeight: 600, fontSize: '14px' }}>GitHub</div>
                 <div style={{ fontSize: '11px', color: 'var(--text-muted)' }}>Source code, issues & releases</div>
               </div>
             </a>
-            <a href="https://www.facebook.com/groups/1217043013897440" target="_blank" rel="noopener noreferrer" style={{
-              display: 'flex', alignItems: 'center', gap: '12px', padding: '14px 16px',
-              background: 'var(--bg-tertiary)', borderRadius: '8px', textDecoration: 'none',
-              color: 'var(--text-primary)', border: '1px solid transparent', transition: 'border-color 0.2s'
-            }} onMouseOver={e => e.currentTarget.style.borderColor = 'var(--border-color)'}
-               onMouseOut={e => e.currentTarget.style.borderColor = 'transparent'}>
-              <svg width="24" height="24" viewBox="0 0 24 24" fill="#1877F2"><path d="M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z"/></svg>
+            <a
+              href="https://www.facebook.com/groups/1217043013897440"
+              target="_blank"
+              rel="noopener noreferrer"
+              style={{
+                display: 'flex',
+                alignItems: 'center',
+                gap: '12px',
+                padding: '14px 16px',
+                background: 'var(--bg-tertiary)',
+                borderRadius: '8px',
+                textDecoration: 'none',
+                color: 'var(--text-primary)',
+                border: '1px solid transparent',
+                transition: 'border-color 0.2s',
+              }}
+              onMouseOver={(e) => (e.currentTarget.style.borderColor = 'var(--border-color)')}
+              onMouseOut={(e) => (e.currentTarget.style.borderColor = 'transparent')}
+            >
+              <svg width="24" height="24" viewBox="0 0 24 24" fill="#1877F2">
+                <path d="M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z" />
+              </svg>
               <div>
                 <div style={{ fontWeight: 600, fontSize: '14px' }}>Facebook Group</div>
                 <div style={{ fontSize: '11px', color: 'var(--text-muted)' }}>Community discussion & help</div>
               </div>
             </a>
-            <a href="https://www.reddit.com/r/OpenHamClock/" target="_blank" rel="noopener noreferrer" style={{
-              display: 'flex', alignItems: 'center', gap: '12px', padding: '14px 16px',
-              background: 'var(--bg-tertiary)', borderRadius: '8px', textDecoration: 'none',
-              color: 'var(--text-primary)', border: '1px solid transparent', transition: 'border-color 0.2s'
-            }} onMouseOver={e => e.currentTarget.style.borderColor = 'var(--border-color)'}
-               onMouseOut={e => e.currentTarget.style.borderColor = 'transparent'}>
-              <svg width="24" height="24" viewBox="0 0 24 24" fill="#FF4500"><path d="M12 0A12 12 0 000 12a12 12 0 0012 12 12 12 0 0012-12A12 12 0 0012 0zm5.01 4.744c.688 0 1.25.561 1.25 1.249a1.25 1.25 0 01-2.498.056l-2.597-.547-.8 3.747c1.824.07 3.48.632 4.674 1.488.308-.309.73-.491 1.207-.491.968 0 1.754.786 1.754 1.754 0 .716-.435 1.333-1.01 1.614a3.111 3.111 0 01.042.52c0 2.694-3.13 4.87-7.004 4.87-3.874 0-7.004-2.176-7.004-4.87 0-.183.015-.366.043-.534A1.748 1.748 0 014.028 12c0-.968.786-1.754 1.754-1.754.463 0 .898.196 1.207.49 1.207-.883 2.878-1.43 4.744-1.487l.885-4.182a.342.342 0 01.14-.197.35.35 0 01.238-.042l2.906.617a1.214 1.214 0 011.108-.701zM9.25 12C8.561 12 8 12.562 8 13.25c0 .687.561 1.248 1.25 1.248.687 0 1.248-.561 1.248-1.249 0-.688-.561-1.249-1.249-1.249zm5.5 0c-.687 0-1.248.561-1.248 1.25 0 .687.561 1.248 1.249 1.248.688 0 1.249-.561 1.249-1.249 0-.687-.562-1.249-1.25-1.249zm-5.466 3.99a.327.327 0 00-.231.094.33.33 0 000 .463c.842.842 2.484.913 2.961.913.477 0 2.105-.056 2.961-.913a.361.361 0 000-.463.327.327 0 00-.462 0c-.545.533-1.684.73-2.512.73-.828 0-1.979-.196-2.512-.73a.326.326 0 00-.205-.094z"/></svg>
+            <a
+              href="https://www.reddit.com/r/OpenHamClock/"
+              target="_blank"
+              rel="noopener noreferrer"
+              style={{
+                display: 'flex',
+                alignItems: 'center',
+                gap: '12px',
+                padding: '14px 16px',
+                background: 'var(--bg-tertiary)',
+                borderRadius: '8px',
+                textDecoration: 'none',
+                color: 'var(--text-primary)',
+                border: '1px solid transparent',
+                transition: 'border-color 0.2s',
+              }}
+              onMouseOver={(e) => (e.currentTarget.style.borderColor = 'var(--border-color)')}
+              onMouseOut={(e) => (e.currentTarget.style.borderColor = 'transparent')}
+            >
+              <svg width="24" height="24" viewBox="0 0 24 24" fill="#FF4500">
+                <path d="M12 0A12 12 0 000 12a12 12 0 0012 12 12 12 0 0012-12A12 12 0 0012 0zm5.01 4.744c.688 0 1.25.561 1.25 1.249a1.25 1.25 0 01-2.498.056l-2.597-.547-.8 3.747c1.824.07 3.48.632 4.674 1.488.308-.309.73-.491 1.207-.491.968 0 1.754.786 1.754 1.754 0 .716-.435 1.333-1.01 1.614a3.111 3.111 0 01.042.52c0 2.694-3.13 4.87-7.004 4.87-3.874 0-7.004-2.176-7.004-4.87 0-.183.015-.366.043-.534A1.748 1.748 0 014.028 12c0-.968.786-1.754 1.754-1.754.463 0 .898.196 1.207.49 1.207-.883 2.878-1.43 4.744-1.487l.885-4.182a.342.342 0 01.14-.197.35.35 0 01.238-.042l2.906.617a1.214 1.214 0 011.108-.701zM9.25 12C8.561 12 8 12.562 8 13.25c0 .687.561 1.248 1.25 1.248.687 0 1.248-.561 1.248-1.249 0-.688-.561-1.249-1.249-1.249zm5.5 0c-.687 0-1.248.561-1.248 1.25 0 .687.561 1.248 1.249 1.248.688 0 1.249-.561 1.249-1.249 0-.687-.562-1.249-1.25-1.249zm-5.466 3.99a.327.327 0 00-.231.094.33.33 0 000 .463c.842.842 2.484.913 2.961.913.477 0 2.105-.056 2.961-.913a.361.361 0 000-.463.327.327 0 00-.462 0c-.545.533-1.684.73-2.512.73-.828 0-1.979-.196-2.512-.73a.326.326 0 00-.205-.094z" />
+              </svg>
               <div>
                 <div style={{ fontWeight: 600, fontSize: '14px' }}>Reddit</div>
                 <div style={{ fontSize: '11px', color: 'var(--text-muted)' }}>r/OpenHamClock</div>
               </div>
             </a>
-            <div style={{ marginTop: '16px', padding: '14px 16px', background: 'var(--bg-tertiary)', borderRadius: '8px', textAlign: 'center' }}>
-              <div style={{ fontSize: '14px', fontWeight: 600, color: 'var(--accent-amber)' }}>Created by Chris Hetherington — K0CJH</div>
-              <div style={{ fontSize: '12px', color: 'var(--text-secondary)', marginTop: '6px', lineHeight: '1.5' }}>Built with the help of an amazing community of amateur radio operators contributing features, reporting bugs, and making OpenHamClock better every day.</div>
-              <div style={{ fontSize: '12px', color: 'var(--text-muted)', marginTop: '6px' }}>K0CJH / openhamclock.com</div>
+            <div
+              style={{
+                marginTop: '16px',
+                padding: '14px 16px',
+                background: 'var(--bg-tertiary)',
+                borderRadius: '8px',
+                textAlign: 'center',
+              }}
+            >
+              <div style={{ fontSize: '14px', fontWeight: 600, color: 'var(--accent-amber)' }}>
+                Created by Chris Hetherington — K0CJH
+              </div>
+              <div style={{ fontSize: '12px', color: 'var(--text-secondary)', marginTop: '6px', lineHeight: '1.5' }}>
+                Built with the help of an amazing community of amateur radio operators contributing features, reporting
+                bugs, and making OpenHamClock better every day.
+              </div>
+              <div style={{ fontSize: '12px', color: 'var(--text-muted)', marginTop: '6px' }}>
+                K0CJH / openhamclock.com
+              </div>
             </div>
 
             {/* Contributors */}
-            <div style={{ marginTop: '12px', padding: '14px 16px', background: 'var(--bg-tertiary)', borderRadius: '8px' }}>
-              <div style={{ fontSize: '12px', color: 'var(--accent-amber)', fontWeight: 600, textTransform: 'uppercase', letterSpacing: '1px', marginBottom: '10px', textAlign: 'center' }}>Contributors</div>
-              <div style={{ fontSize: '11px', color: 'var(--text-muted)', textAlign: 'center', marginBottom: '10px' }}>Thank you to everyone who has contributed code, features, bug fixes, and ideas.</div>
+            <div
+              style={{ marginTop: '12px', padding: '14px 16px', background: 'var(--bg-tertiary)', borderRadius: '8px' }}
+            >
+              <div
+                style={{
+                  fontSize: '12px',
+                  color: 'var(--accent-amber)',
+                  fontWeight: 600,
+                  textTransform: 'uppercase',
+                  letterSpacing: '1px',
+                  marginBottom: '10px',
+                  textAlign: 'center',
+                }}
+              >
+                Contributors
+              </div>
+              <div style={{ fontSize: '11px', color: 'var(--text-muted)', textAlign: 'center', marginBottom: '10px' }}>
+                Thank you to everyone who has contributed code, features, bug fixes, and ideas.
+              </div>
               <div style={{ display: 'flex', flexWrap: 'wrap', gap: '6px', justifyContent: 'center' }}>
                 {[
-                  'creinemann', 'ceotjoe', 'alanhargreaves', 'dmazan', 'Delerius',
-                  'rfreedman', 'SebFox2011', 'infopcgood', 'thomas-schreck', 'echo-gravitas',
-                  'yuryja', 'Holyszewski', 'trancen', 'ThePangel', 'w8mej',
-                  'JoshuaNewport', 'denete', 'kmanwar89', 'KentenRoth', 's53zo',
-                  'theodeurne76', 'm1dst', 'brianbruff'
-                ].map(name => (
+                  'creinemann',
+                  'ceotjoe',
+                  'alanhargreaves',
+                  'dmazan',
+                  'Delerius',
+                  'rfreedman',
+                  'SebFox2011',
+                  'infopcgood',
+                  'thomas-schreck',
+                  'echo-gravitas',
+                  'yuryja',
+                  'Holyszewski',
+                  'trancen',
+                  'ThePangel',
+                  'w8mej',
+                  'JoshuaNewport',
+                  'denete',
+                  'kmanwar89',
+                  'KentenRoth',
+                  's53zo',
+                  'theodeurne76',
+                  'm1dst',
+                  'brianbruff',
+                ].map((name) => (
                   <a
                     key={name}
                     href={`https://github.com/${name}`}
@@ -2890,8 +3515,14 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
                       border: '1px solid transparent',
                       transition: 'all 0.15s',
                     }}
-                    onMouseOver={e => { e.currentTarget.style.borderColor = 'var(--accent-cyan)'; e.currentTarget.style.color = 'var(--accent-cyan)'; }}
-                    onMouseOut={e => { e.currentTarget.style.borderColor = 'transparent'; e.currentTarget.style.color = 'var(--text-secondary)'; }}
+                    onMouseOver={(e) => {
+                      e.currentTarget.style.borderColor = 'var(--accent-cyan)';
+                      e.currentTarget.style.color = 'var(--accent-cyan)';
+                    }}
+                    onMouseOut={(e) => {
+                      e.currentTarget.style.borderColor = 'transparent';
+                      e.currentTarget.style.color = 'var(--text-secondary)';
+                    }}
                   >
                     {name}
                   </a>
@@ -2915,7 +3546,7 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
               borderRadius: '6px',
               color: 'var(--text-secondary)',
               fontSize: '14px',
-              cursor: 'pointer'
+              cursor: 'pointer',
             }}
           >
             {t('cancel')}
@@ -2930,7 +3561,7 @@ export const SettingsPanel = ({ isOpen, onClose, config, onSave, onResetLayout,
               color: '#000',
               fontSize: '14px',
               fontWeight: '700',
-              cursor: 'pointer'
+              cursor: 'pointer',
             }}
           >
             {t('station.settings.button.save')}
diff --git a/src/components/SolarPanel.jsx b/src/components/SolarPanel.jsx
index a6008275..77b2364b 100644
--- a/src/components/SolarPanel.jsx
+++ b/src/components/SolarPanel.jsx
@@ -8,7 +8,12 @@ import { getMoonPhase } from '../utils/geo.js';
 const MODES = ['image', 'indices', 'xray', 'lunar'];
 const MODE_LABELS = { image: 'SOLAR', indices: 'SOLAR INDICES', xray: 'X-RAY FLUX', lunar: 'LUNAR' };
 const MODE_ICONS = { image: '◫', indices: '⊞', xray: '☽', lunar: '☼' };
-const MODE_TITLES = { image: 'Show solar indices', indices: 'Show X-ray flux', xray: 'Show lunar phase', lunar: 'Show solar image' };
+const MODE_TITLES = {
+  image: 'Show solar indices',
+  indices: 'Show X-ray flux',
+  xray: 'Show lunar phase',
+  lunar: 'Show solar image',
+};
 
 // Flare class from flux value (W/m²)
 const getFlareClass = (flux) => {
@@ -24,10 +29,16 @@ const getFlareClass = (flux) => {
 const formatFlux = (flux) => {
   if (!flux || flux <= 0) return '--';
   const cls = getFlareClass(flux);
-  const base = flux >= 1e-4 ? flux / 1e-4 :
-               flux >= 1e-5 ? flux / 1e-5 :
-               flux >= 1e-6 ? flux / 1e-6 :
-               flux >= 1e-7 ? flux / 1e-7 : flux / 1e-8;
+  const base =
+    flux >= 1e-4
+      ? flux / 1e-4
+      : flux >= 1e-5
+        ? flux / 1e-5
+        : flux >= 1e-6
+          ? flux / 1e-6
+          : flux >= 1e-7
+            ? flux / 1e-7
+            : flux / 1e-8;
   return `${cls.letter}${base.toFixed(1)}`;
 };
 
@@ -38,13 +49,19 @@ export const SolarPanel = ({ solarIndices, forcedMode }) => {
       if (MODES.includes(saved)) return saved;
       if (saved === 'indices') return 'indices';
       return 'image';
-    } catch (e) { return 'image'; }
+    } catch (e) {
+      return 'image';
+    }
   });
 
   // When forcedMode is set, lock to that mode (used by dockable sub-panels)
   const mode = forcedMode && MODES.includes(forcedMode) ? forcedMode : internalMode;
   const [imageType, setImageType] = useState(() => {
-    try { return localStorage.getItem('openhamclock_solarImageType') || '0193'; } catch { return '0193'; }
+    try {
+      return localStorage.getItem('openhamclock_solarImageType') || '0193';
+    } catch {
+      return '0193';
+    }
   });
   const [xrayData, setXrayData] = useState(null);
   const [xrayLoading, setXrayLoading] = useState(false);
@@ -54,10 +71,13 @@ export const SolarPanel = ({ solarIndices, forcedMode }) => {
   const [imageTimestamp, setImageTimestamp] = useState(() => Math.floor(Date.now() / 900000) * 900000);
   useEffect(() => {
     // Refresh every 15 minutes to get latest SDO image
-    const interval = setInterval(() => {
-      setImageTimestamp(Math.floor(Date.now() / 900000) * 900000);
-      setImageError(false); // Reset error state on refresh
-    }, 15 * 60 * 1000);
+    const interval = setInterval(
+      () => {
+        setImageTimestamp(Math.floor(Date.now() / 900000) * 900000);
+        setImageError(false); // Reset error state on refresh
+      },
+      15 * 60 * 1000,
+    );
     return () => clearInterval(interval);
   }, []);
 
@@ -70,12 +90,14 @@ export const SolarPanel = ({ solarIndices, forcedMode }) => {
     }, 30000);
     return () => clearTimeout(retry);
   }, [imageError, mode]);
-  
+
   const cycleMode = () => {
     const nextIdx = (MODES.indexOf(mode) + 1) % MODES.length;
     const next = MODES[nextIdx];
     setMode(next);
-    try { localStorage.setItem('openhamclock_solarPanelMode', next); } catch (e) {}
+    try {
+      localStorage.setItem('openhamclock_solarPanelMode', next);
+    } catch (e) {}
   };
 
   // Fetch X-ray data when xray mode is active
@@ -86,7 +108,7 @@ export const SolarPanel = ({ solarIndices, forcedMode }) => {
       if (res.ok) {
         const data = await res.json();
         // Filter to 0.1-0.8nm (long wavelength, standard for flare classification)
-        const filtered = data.filter(d => d.energy === '0.1-0.8nm' && d.flux > 0);
+        const filtered = data.filter((d) => d.energy === '0.1-0.8nm' && d.flux > 0);
         setXrayData(filtered);
       }
     } catch (err) {
@@ -103,17 +125,17 @@ export const SolarPanel = ({ solarIndices, forcedMode }) => {
       return () => clearInterval(interval);
     }
   }, [mode, fetchXray]);
-  
+
   const imageTypes = {
     '0193': { name: 'AIA 193Å', desc: 'Corona' },
     '0304': { name: 'AIA 304Å', desc: 'Chromosphere' },
     '0171': { name: 'AIA 171Å', desc: 'Quiet Corona' },
     '0094': { name: 'AIA 94Å', desc: 'Flaring' },
-    'HMIIC': { name: 'HMI Int', desc: 'Visible' }
+    HMIIC: { name: 'HMI Int', desc: 'Visible' },
   };
-  
+
   const imageUrl = `https://sdo.gsfc.nasa.gov/assets/img/latest/latest_256_${imageType}.jpg?t=${imageTimestamp}`;
-  
+
   const getKpColor = (value) => {
     if (value >= 7) return '#ff0000';
     if (value >= 5) return '#ff6600';
@@ -127,29 +149,38 @@ export const SolarPanel = ({ solarIndices, forcedMode }) => {
   // X-Ray flux chart renderer
   const renderXrayChart = () => {
     if (xrayLoading && !xrayData) {
-      return <div style={{ textAlign: 'center', color: 'var(--text-muted)', padding: '20px' }}>Loading X-ray data...</div>;
+      return (
+        <div style={{ textAlign: 'center', color: 'var(--text-muted)', padding: '20px' }}>Loading X-ray data...</div>
+      );
     }
     if (!xrayData || xrayData.length === 0) {
-      return <div style={{ textAlign: 'center', color: 'var(--text-muted)', padding: '20px' }}>No X-ray data available</div>;
+      return (
+        <div style={{ textAlign: 'center', color: 'var(--text-muted)', padding: '20px' }}>No X-ray data available</div>
+      );
     }
 
     // Use last ~360 points (~6 hours at 1-min resolution)
     const points = xrayData.slice(-360);
     const currentFlux = points[points.length - 1]?.flux;
     const currentClass = getFlareClass(currentFlux);
-    const peakFlux = Math.max(...points.map(p => p.flux));
+    const peakFlux = Math.max(...points.map((p) => p.flux));
     const peakClass = getFlareClass(peakFlux);
 
     // Chart dimensions
-    const W = 280, H = 130;
-    const padL = 28, padR = 6, padT = 8, padB = 18;
+    const W = 280,
+      H = 130;
+    const padL = 28,
+      padR = 6,
+      padT = 8,
+      padB = 18;
     const chartW = W - padL - padR;
     const chartH = H - padT - padB;
 
     // Log scale: 1e-8 (A1.0) to 1e-3 (X10)
-    const logMin = -8, logMax = -3;
+    const logMin = -8,
+      logMax = -3;
     const logRange = logMax - logMin;
-    
+
     const fluxToY = (flux) => {
       if (!flux || flux <= 0) return padT + chartH;
       const log = Math.log10(flux);
@@ -158,21 +189,24 @@ export const SolarPanel = ({ solarIndices, forcedMode }) => {
     };
 
     // Build SVG path
-    const pathD = points.map((p, i) => {
-      const x = padL + (i / (points.length - 1)) * chartW;
-      const y = fluxToY(p.flux);
-      return `${i === 0 ? 'M' : 'L'}${x.toFixed(1)},${y.toFixed(1)}`;
-    }).join(' ');
+    const pathD = points
+      .map((p, i) => {
+        const x = padL + (i / (points.length - 1)) * chartW;
+        const y = fluxToY(p.flux);
+        return `${i === 0 ? 'M' : 'L'}${x.toFixed(1)},${y.toFixed(1)}`;
+      })
+      .join(' ');
 
     // Gradient fill path
-    const fillD = pathD + ` L${(padL + chartW).toFixed(1)},${(padT + chartH).toFixed(1)} L${padL},${(padT + chartH).toFixed(1)} Z`;
+    const fillD =
+      pathD + ` L${(padL + chartW).toFixed(1)},${(padT + chartH).toFixed(1)} L${padL},${(padT + chartH).toFixed(1)} Z`;
 
     // Flare class threshold lines
     const thresholds = [
       { flux: 1e-7, label: 'B', color: '#00cc88' },
       { flux: 1e-6, label: 'C', color: '#ffcc00' },
       { flux: 1e-5, label: 'M', color: '#ff6600' },
-      { flux: 1e-4, label: 'X', color: '#ff0000' }
+      { flux: 1e-4, label: 'X', color: '#ff0000' },
     ];
 
     // Time labels
@@ -184,61 +218,86 @@ export const SolarPanel = ({ solarIndices, forcedMode }) => {
     return (
       <div>
         {/* Current level display */}
-        <div style={{ 
-          display: 'flex', 
-          justifyContent: 'space-between', 
-          alignItems: 'center',
-          marginBottom: '6px',
-          padding: '4px 8px',
-          background: 'var(--bg-tertiary)',
-          borderRadius: '6px'
-        }}>
+        <div
+          style={{
+            display: 'flex',
+            justifyContent: 'space-between',
+            alignItems: 'center',
+            marginBottom: '6px',
+            padding: '4px 8px',
+            background: 'var(--bg-tertiary)',
+            borderRadius: '6px',
+          }}
+        >
           <div>
             <span style={{ fontSize: '10px', color: 'var(--text-muted)' }}>Current </span>
-            <span style={{ 
-              fontSize: '18px', fontWeight: '700', color: currentClass.color,
-              fontFamily: 'Orbitron, monospace'
-            }}>
+            <span
+              style={{
+                fontSize: '18px',
+                fontWeight: '700',
+                color: currentClass.color,
+                fontFamily: 'Orbitron, monospace',
+              }}
+            >
               {formatFlux(currentFlux)}
             </span>
           </div>
           <div>
             <span style={{ fontSize: '10px', color: 'var(--text-muted)' }}>6h Peak </span>
-            <span style={{ 
-              fontSize: '14px', fontWeight: '600', color: peakClass.color,
-              fontFamily: 'Orbitron, monospace'
-            }}>
+            <span
+              style={{
+                fontSize: '14px',
+                fontWeight: '600',
+                color: peakClass.color,
+                fontFamily: 'Orbitron, monospace',
+              }}
+            >
               {formatFlux(peakFlux)}
             </span>
           </div>
         </div>
 
         {/* SVG Chart */}
-        <svg width="100%" viewBox={`0 0 ${W} ${H}`} preserveAspectRatio="xMidYMid meet"
-          style={{ background: 'var(--bg-tertiary)', borderRadius: '6px' }}>
-          
+        <svg
+          width="100%"
+          viewBox={`0 0 ${W} ${H}`}
+          preserveAspectRatio="xMidYMid meet"
+          style={{ background: 'var(--bg-tertiary)', borderRadius: '6px' }}
+        >
           {/* Flare class background bands */}
           {thresholds.map((t, i) => {
             const y1 = fluxToY(t.flux);
             const y0 = i === 0 ? padT + chartH : fluxToY(thresholds[i - 1].flux);
-            return (
-              <rect key={t.label} x={padL} y={y1} width={chartW} height={y0 - y1}
-                fill={t.color} opacity={0.06} />
-            );
+            return <rect key={t.label} x={padL} y={y1} width={chartW} height={y0 - y1} fill={t.color} opacity={0.06} />;
           })}
           {/* X class band to top */}
-          <rect x={padL} y={padT} width={chartW} 
-            height={fluxToY(1e-4) - padT} fill="#ff0000" opacity={0.06} />
+          <rect x={padL} y={padT} width={chartW} height={fluxToY(1e-4) - padT} fill="#ff0000" opacity={0.06} />
 
           {/* Threshold lines */}
-          {thresholds.map(t => {
+          {thresholds.map((t) => {
             const y = fluxToY(t.flux);
             return (
               <g key={t.label}>
-                <line x1={padL} y1={y} x2={padL + chartW} y2={y}
-                  stroke={t.color} strokeWidth="0.5" strokeDasharray="3,3" opacity={0.5} />
-                <text x={padL + 2} y={y - 2} fill={t.color} fontSize="8" fontWeight="600"
-                  fontFamily="JetBrains Mono, monospace">{t.label}</text>
+                <line
+                  x1={padL}
+                  y1={y}
+                  x2={padL + chartW}
+                  y2={y}
+                  stroke={t.color}
+                  strokeWidth="0.5"
+                  strokeDasharray="3,3"
+                  opacity={0.5}
+                />
+                <text
+                  x={padL + 2}
+                  y={y - 2}
+                  fill={t.color}
+                  fontSize="8"
+                  fontWeight="600"
+                  fontFamily="JetBrains Mono, monospace"
+                >
+                  {t.label}
+                </text>
               </g>
             );
           })}
@@ -256,12 +315,29 @@ export const SolarPanel = ({ solarIndices, forcedMode }) => {
           <path d={pathD} fill="none" stroke={currentClass.color} strokeWidth="1.5" />
 
           {/* Time axis labels */}
-          <text x={padL} y={H - 2} fill="var(--text-muted, #888)" fontSize="8"
-            fontFamily="JetBrains Mono, monospace">{fmt(firstTime)}</text>
-          <text x={padL + chartW / 2} y={H - 2} fill="var(--text-muted, #888)" fontSize="8"
-            fontFamily="JetBrains Mono, monospace" textAnchor="middle">{fmt(midTime)}</text>
-          <text x={padL + chartW} y={H - 2} fill="var(--text-muted, #888)" fontSize="8"
-            fontFamily="JetBrains Mono, monospace" textAnchor="end">{fmt(lastTime)} UTC</text>
+          <text x={padL} y={H - 2} fill="var(--text-muted, #888)" fontSize="8" fontFamily="JetBrains Mono, monospace">
+            {fmt(firstTime)}
+          </text>
+          <text
+            x={padL + chartW / 2}
+            y={H - 2}
+            fill="var(--text-muted, #888)"
+            fontSize="8"
+            fontFamily="JetBrains Mono, monospace"
+            textAnchor="middle"
+          >
+            {fmt(midTime)}
+          </text>
+          <text
+            x={padL + chartW}
+            y={H - 2}
+            fill="var(--text-muted, #888)"
+            fontSize="8"
+            fontFamily="JetBrains Mono, monospace"
+            textAnchor="end"
+          >
+            {fmt(lastTime)} UTC
+          </text>
         </svg>
 
         <div style={{ fontSize: '9px', color: 'var(--text-muted)', marginTop: '3px', textAlign: 'center' }}>
@@ -275,8 +351,8 @@ export const SolarPanel = ({ solarIndices, forcedMode }) => {
   const renderLunar = () => {
     const now = new Date();
     const phase = getMoonPhase(now); // 0-1, 0=new, 0.5=full
-    const illumination = Math.round((1 - Math.cos(phase * 2 * Math.PI)) / 2 * 100);
-    
+    const illumination = Math.round(((1 - Math.cos(phase * 2 * Math.PI)) / 2) * 100);
+
     // Phase name
     let phaseName = 'New Moon';
     if (phase >= 0.0625 && phase < 0.1875) phaseName = 'Waxing Crescent';
@@ -306,8 +382,9 @@ export const SolarPanel = ({ solarIndices, forcedMode }) => {
     // SVG moon — uses a crescent/gibbous mask technique
     // phase 0=new(dark), 0.25=first quarter(right lit), 0.5=full(all lit), 0.75=last quarter(left lit)
     const R = 60; // moon radius
-    const CX = 70, CY = 70;
-    
+    const CX = 70,
+      CY = 70;
+
     // The terminator curve is an ellipse whose x-radius varies with phase
     // At new moon (0): fully dark. At full (0.5): fully lit.
     // phase 0-0.5: right side lit (waxing), 0.5-1: left side lit (waning)
@@ -321,7 +398,7 @@ export const SolarPanel = ({ solarIndices, forcedMode }) => {
       // Lit portion: we draw two arcs — the outer limb and the terminator
       // For waxing (0 < phase < 0.5): right side is lit
       // For waning (0.5 < phase < 1): left side is lit
-      
+
       if (phase < 0.01 || phase > 0.99) {
         // New moon — no lit area
         return null;
@@ -330,7 +407,7 @@ export const SolarPanel = ({ solarIndices, forcedMode }) => {
         // Full moon — entire circle lit
         return `M${CX},${CY - R} A${R},${R} 0 1,1 ${CX},${CY + R} A${R},${R} 0 1,1 ${CX},${CY - R}`;
       }
-      
+
       const absTermX = Math.abs(terminatorX);
 
       if (phase < 0.5) {
@@ -345,7 +422,7 @@ export const SolarPanel = ({ solarIndices, forcedMode }) => {
         return `M${CX},${CY - R} A${R},${R} 0 0,0 ${CX},${CY + R} A${absTermX},${R} 0 0,1 ${CX},${CY - R}`;
       }
     };
-    
+
     const litPath = buildMoonPath();
 
     return (
@@ -368,18 +445,42 @@ export const SolarPanel = ({ solarIndices, forcedMode }) => {
                 <circle cx={CX} cy={CY} r={R} />
               </clipPath>
             </defs>
-            
+
             {/* Dark side (always full circle, dark) */}
             <circle cx={CX} cy={CY} r={R} fill="#1a1a2e" stroke="#333" strokeWidth="1.5" />
-            
+
             {/* Lit surface with craters — clipped to lit path */}
             {litPath && (
               <g clipPath="url(#moonClip)">
                 <path d={litPath} fill="url(#moonSurface)" />
                 {/* Mare (dark patches) */}
-                <ellipse cx={CX - 12} cy={CY - 8} rx="18" ry="14" fill="#b8b0a0" opacity="0.5" clipPath="url(#moonClip)" />
-                <ellipse cx={CX + 15} cy={CY + 10} rx="12" ry="10" fill="#b0a898" opacity="0.4" clipPath="url(#moonClip)" />
-                <ellipse cx={CX - 5} cy={CY + 20} rx="14" ry="8" fill="#ada598" opacity="0.35" clipPath="url(#moonClip)" />
+                <ellipse
+                  cx={CX - 12}
+                  cy={CY - 8}
+                  rx="18"
+                  ry="14"
+                  fill="#b8b0a0"
+                  opacity="0.5"
+                  clipPath="url(#moonClip)"
+                />
+                <ellipse
+                  cx={CX + 15}
+                  cy={CY + 10}
+                  rx="12"
+                  ry="10"
+                  fill="#b0a898"
+                  opacity="0.4"
+                  clipPath="url(#moonClip)"
+                />
+                <ellipse
+                  cx={CX - 5}
+                  cy={CY + 20}
+                  rx="14"
+                  ry="8"
+                  fill="#ada598"
+                  opacity="0.35"
+                  clipPath="url(#moonClip)"
+                />
                 {/* Craters */}
                 <circle cx={CX + 20} cy={CY - 20} r="6" fill="url(#crater1)" opacity="0.5" />
                 <circle cx={CX - 25} cy={CY + 5} r="4" fill="url(#crater1)" opacity="0.4" />
@@ -388,34 +489,56 @@ export const SolarPanel = ({ solarIndices, forcedMode }) => {
                 <circle cx={CX + 25} cy={CY + 5} r="3" fill="url(#crater1)" opacity="0.3" />
               </g>
             )}
-            
+
             {/* Subtle glow */}
             <circle cx={CX} cy={CY} r={R + 3} fill="none" stroke="rgba(200,200,180,0.1)" strokeWidth="4" />
           </svg>
         </div>
-        
+
         {/* Phase info */}
         <div style={{ textAlign: 'center', marginBottom: '8px' }}>
           <div style={{ fontSize: '14px', fontWeight: '700', color: 'var(--text-primary)' }}>{phaseName}</div>
-          <div style={{ fontSize: '12px', color: 'var(--accent-amber)', fontFamily: 'Orbitron, monospace', marginTop: '2px' }}>
+          <div
+            style={{
+              fontSize: '12px',
+              color: 'var(--accent-amber)',
+              fontFamily: 'Orbitron, monospace',
+              marginTop: '2px',
+            }}
+          >
             {illumination}% illuminated
           </div>
         </div>
-        
+
         {/* Next phases */}
-        <div style={{ 
-          display: 'flex', gap: '8px', justifyContent: 'center',
-          fontSize: '10px', fontFamily: 'JetBrains Mono, monospace',
-        }}>
-          <div style={{ 
-            background: 'var(--bg-tertiary)', borderRadius: '4px', padding: '4px 8px', textAlign: 'center',
-          }}>
+        <div
+          style={{
+            display: 'flex',
+            gap: '8px',
+            justifyContent: 'center',
+            fontSize: '10px',
+            fontFamily: 'JetBrains Mono, monospace',
+          }}
+        >
+          <div
+            style={{
+              background: 'var(--bg-tertiary)',
+              borderRadius: '4px',
+              padding: '4px 8px',
+              textAlign: 'center',
+            }}
+          >
             <div style={{ color: 'var(--text-muted)' }}>● New</div>
             <div style={{ color: 'var(--text-secondary)', fontWeight: '600' }}>{nextNew}</div>
           </div>
-          <div style={{ 
-            background: 'var(--bg-tertiary)', borderRadius: '4px', padding: '4px 8px', textAlign: 'center',
-          }}>
+          <div
+            style={{
+              background: 'var(--bg-tertiary)',
+              borderRadius: '4px',
+              padding: '4px 8px',
+              textAlign: 'center',
+            }}
+          >
             <div style={{ color: 'var(--text-muted)' }}>○ Full</div>
             <div style={{ color: 'var(--text-secondary)', fontWeight: '600' }}>{nextFull}</div>
           </div>
@@ -425,29 +548,45 @@ export const SolarPanel = ({ solarIndices, forcedMode }) => {
   };
 
   return (
-    <div style={{
-      height: '100%',
-      display: 'flex',
-      flexDirection: 'column',
-      padding: '8px',
-      boxSizing: 'border-box'
-    }}>
-      {/* Header with cycle button */}
-      <div style={{
+    <div
+      style={{
+        height: '100%',
         display: 'flex',
-        justifyContent: 'space-between',
-        alignItems: 'center',
-        marginBottom: '6px',
-        flexShrink: 0
-      }}>
-        <span style={{ fontSize: '12px', color: mode === 'lunar' ? 'var(--accent-purple)' : 'var(--accent-amber)', fontWeight: '700' }}>
+        flexDirection: 'column',
+        padding: '8px',
+        boxSizing: 'border-box',
+      }}
+    >
+      {/* Header with cycle button */}
+      <div
+        style={{
+          display: 'flex',
+          justifyContent: 'space-between',
+          alignItems: 'center',
+          marginBottom: '6px',
+          flexShrink: 0,
+        }}
+      >
+        <span
+          style={{
+            fontSize: '12px',
+            color: mode === 'lunar' ? 'var(--accent-purple)' : 'var(--accent-amber)',
+            fontWeight: '700',
+          }}
+        >
           {mode === 'lunar' ? '🌙' : '☀'} {MODE_LABELS[mode]}
         </span>
         <div style={{ display: 'flex', gap: '4px', alignItems: 'center' }}>
           {mode === 'image' && (
-            <select 
+            <select
               value={imageType}
-              onChange={(e) => { setImageType(e.target.value); setImageError(false); try { localStorage.setItem('openhamclock_solarImageType', e.target.value); } catch {} }}
+              onChange={(e) => {
+                setImageType(e.target.value);
+                setImageError(false);
+                try {
+                  localStorage.setItem('openhamclock_solarImageType', e.target.value);
+                } catch {}
+              }}
               onClick={(e) => e.stopPropagation()}
               style={{
                 background: 'var(--bg-tertiary)',
@@ -456,44 +595,57 @@ export const SolarPanel = ({ solarIndices, forcedMode }) => {
                 fontSize: '10px',
                 padding: '2px 4px',
                 borderRadius: '3px',
-                cursor: 'pointer'
+                cursor: 'pointer',
               }}
             >
               {Object.entries(imageTypes).map(([key, val]) => (
-                <option key={key} value={key}>{val.desc}</option>
+                <option key={key} value={key}>
+                  {val.desc}
+                </option>
               ))}
             </select>
           )}
           {!forcedMode && (
-          <button
-            onClick={cycleMode}
-            style={{
-              background: 'var(--bg-tertiary)',
-              border: '1px solid var(--border-color)',
-              color: 'var(--text-secondary)',
-              fontSize: '10px',
-              padding: '2px 6px',
-              borderRadius: '3px',
-              cursor: 'pointer'
-            }}
-            title={MODE_TITLES[mode]}
-          >
-            {MODE_ICONS[mode]}
-          </button>
+            <button
+              onClick={cycleMode}
+              style={{
+                background: 'var(--bg-tertiary)',
+                border: '1px solid var(--border-color)',
+                color: 'var(--text-secondary)',
+                fontSize: '10px',
+                padding: '2px 6px',
+                borderRadius: '3px',
+                cursor: 'pointer',
+              }}
+              title={MODE_TITLES[mode]}
+            >
+              {MODE_ICONS[mode]}
+            </button>
           )}
         </div>
       </div>
-      
+
       {mode === 'indices' ? (
         /* Solar Indices View */
         <div style={{ flex: 1, overflowY: 'auto', minHeight: 0 }}>
           {solarIndices?.data ? (
             <div style={{ display: 'flex', flexDirection: 'column', gap: '8px' }}>
               {/* SFI Row */}
-              <div style={{ background: 'var(--bg-tertiary)', borderRadius: '6px', padding: '8px', display: 'flex', alignItems: 'center', gap: '12px' }}>
+              <div
+                style={{
+                  background: 'var(--bg-tertiary)',
+                  borderRadius: '6px',
+                  padding: '8px',
+                  display: 'flex',
+                  alignItems: 'center',
+                  gap: '12px',
+                }}
+              >
                 <div style={{ minWidth: '60px' }}>
                   <div style={{ fontSize: '10px', color: 'var(--text-muted)' }}>SFI</div>
-                  <div style={{ fontSize: '22px', fontWeight: '700', color: '#ff8800', fontFamily: 'Orbitron, monospace' }}>
+                  <div
+                    style={{ fontSize: '22px', fontWeight: '700', color: '#ff8800', fontFamily: 'Orbitron, monospace' }}
+                  >
                     {solarIndices.data.sfi?.current || '--'}
                   </div>
                   <div style={{ fontSize: '8px', color: 'var(--text-muted)', lineHeight: 1.2 }}>
@@ -511,39 +663,75 @@ export const SolarPanel = ({ solarIndices, forcedMode }) => {
                 <div style={{ flex: 1 }}>
                   {solarIndices.data.sfi?.history?.length > 0 ? (
                     <div>
-                      <div style={{ fontSize: '8px', color: 'var(--text-muted)', marginBottom: '1px', display: 'flex', justifyContent: 'space-between' }}>
+                      <div
+                        style={{
+                          fontSize: '8px',
+                          color: 'var(--text-muted)',
+                          marginBottom: '1px',
+                          display: 'flex',
+                          justifyContent: 'space-between',
+                        }}
+                      >
                         <span>10.7cm Solar Flux — 20-day trend</span>
-                        <span>{(() => { const h = solarIndices.data.sfi.history.slice(-20); const vals = h.map(d => d.value); return `${Math.min(...vals)}–${Math.max(...vals)}`; })()}</span>
+                        <span>
+                          {(() => {
+                            const h = solarIndices.data.sfi.history.slice(-20);
+                            const vals = h.map((d) => d.value);
+                            return `${Math.min(...vals)}–${Math.max(...vals)}`;
+                          })()}
+                        </span>
                       </div>
                       <svg width="100%" height="30" viewBox="0 0 100 30" preserveAspectRatio="none">
                         {(() => {
                           const data = solarIndices.data.sfi.history.slice(-20);
-                          const values = data.map(d => d.value);
+                          const values = data.map((d) => d.value);
                           const max = Math.max(...values, 1);
                           const min = Math.min(...values);
                           const range = max - min || 1;
-                          const points = data.map((d, i) => {
-                            const x = (i / (data.length - 1)) * 100;
-                            const y = 30 - ((d.value - min) / range) * 25;
-                            return `${x},${y}`;
-                          }).join(' ');
+                          const points = data
+                            .map((d, i) => {
+                              const x = (i / (data.length - 1)) * 100;
+                              const y = 30 - ((d.value - min) / range) * 25;
+                              return `${x},${y}`;
+                            })
+                            .join(' ');
                           return <polyline points={points} fill="none" stroke="#ff8800" strokeWidth="1.5" />;
                         })()}
                       </svg>
                     </div>
                   ) : (
                     <div style={{ fontSize: '9px', color: 'var(--text-muted)', lineHeight: 1.3 }}>
-                      10.7cm radio flux from the sun.<br/>Higher = better HF propagation.<br/>70 poor · 120+ good · 150+ excellent
+                      10.7cm radio flux from the sun.
+                      <br />
+                      Higher = better HF propagation.
+                      <br />
+                      70 poor · 120+ good · 150+ excellent
                     </div>
                   )}
                 </div>
               </div>
-              
+
               {/* K-Index Row */}
-              <div style={{ background: 'var(--bg-tertiary)', borderRadius: '6px', padding: '8px', display: 'flex', alignItems: 'center', gap: '12px' }}>
+              <div
+                style={{
+                  background: 'var(--bg-tertiary)',
+                  borderRadius: '6px',
+                  padding: '8px',
+                  display: 'flex',
+                  alignItems: 'center',
+                  gap: '12px',
+                }}
+              >
                 <div style={{ minWidth: '60px' }}>
                   <div style={{ fontSize: '10px', color: 'var(--text-muted)' }}>K-Index</div>
-                  <div style={{ fontSize: '22px', fontWeight: '700', color: getKpColor(kpData?.current), fontFamily: 'Orbitron, monospace' }}>
+                  <div
+                    style={{
+                      fontSize: '22px',
+                      fontWeight: '700',
+                      color: getKpColor(kpData?.current),
+                      fontFamily: 'Orbitron, monospace',
+                    }}
+                  >
                     {kpData?.current ?? '--'}
                   </div>
                   <div style={{ fontSize: '8px', color: 'var(--text-muted)', lineHeight: 1.2 }}>
@@ -568,18 +756,23 @@ export const SolarPanel = ({ solarIndices, forcedMode }) => {
                         {kpData.forecast.slice(0, 8).map((item, i) => {
                           const val = typeof item === 'object' ? item.value : item;
                           return (
-                            <div key={i} style={{
-                              flex: 1,
-                              height: `${Math.max(10, (val / 9) * 100)}%`,
-                              background: getKpColor(val),
-                              borderRadius: '2px',
-                              opacity: 0.8
-                            }} title={`Kp ${val}`} />
+                            <div
+                              key={i}
+                              style={{
+                                flex: 1,
+                                height: `${Math.max(10, (val / 9) * 100)}%`,
+                                background: getKpColor(val),
+                                borderRadius: '2px',
+                                opacity: 0.8,
+                              }}
+                              title={`Kp ${val}`}
+                            />
                           );
                         })}
                       </div>
                       <div style={{ display: 'flex', fontSize: '7px', color: 'var(--text-muted)', marginTop: '1px' }}>
-                        <span>Now</span><span style={{ marginLeft: 'auto' }}>+24h</span>
+                        <span>Now</span>
+                        <span style={{ marginLeft: 'auto' }}>+24h</span>
                       </div>
                     </div>
                   ) : kpData?.history?.length > 0 ? (
@@ -591,33 +784,53 @@ export const SolarPanel = ({ solarIndices, forcedMode }) => {
                         {kpData.history.slice(-8).map((item, i) => {
                           const val = typeof item === 'object' ? item.value : item;
                           return (
-                            <div key={i} style={{
-                              flex: 1,
-                              height: `${Math.max(10, (val / 9) * 100)}%`,
-                              background: getKpColor(val),
-                              borderRadius: '2px',
-                              opacity: 0.8
-                            }} title={`Kp ${val}`} />
+                            <div
+                              key={i}
+                              style={{
+                                flex: 1,
+                                height: `${Math.max(10, (val / 9) * 100)}%`,
+                                background: getKpColor(val),
+                                borderRadius: '2px',
+                                opacity: 0.8,
+                              }}
+                              title={`Kp ${val}`}
+                            />
                           );
                         })}
                       </div>
                       <div style={{ display: 'flex', fontSize: '7px', color: 'var(--text-muted)', marginTop: '1px' }}>
-                        <span>-24h</span><span style={{ marginLeft: 'auto' }}>Now</span>
+                        <span>-24h</span>
+                        <span style={{ marginLeft: 'auto' }}>Now</span>
                       </div>
                     </div>
                   ) : (
                     <div style={{ fontSize: '9px', color: 'var(--text-muted)', lineHeight: 1.3 }}>
-                      Geomagnetic disturbance (0–9).<br/>Low K = stable ionosphere, good HF.<br/>K≥5 = geomagnetic storm, HF disrupted.
+                      Geomagnetic disturbance (0–9).
+                      <br />
+                      Low K = stable ionosphere, good HF.
+                      <br />
+                      K≥5 = geomagnetic storm, HF disrupted.
                     </div>
                   )}
                 </div>
               </div>
-              
+
               {/* SSN Row */}
-              <div style={{ background: 'var(--bg-tertiary)', borderRadius: '6px', padding: '8px', display: 'flex', alignItems: 'center', gap: '12px' }}>
+              <div
+                style={{
+                  background: 'var(--bg-tertiary)',
+                  borderRadius: '6px',
+                  padding: '8px',
+                  display: 'flex',
+                  alignItems: 'center',
+                  gap: '12px',
+                }}
+              >
                 <div style={{ minWidth: '60px' }}>
                   <div style={{ fontSize: '10px', color: 'var(--text-muted)' }}>SSN</div>
-                  <div style={{ fontSize: '22px', fontWeight: '700', color: '#aa88ff', fontFamily: 'Orbitron, monospace' }}>
+                  <div
+                    style={{ fontSize: '22px', fontWeight: '700', color: '#aa88ff', fontFamily: 'Orbitron, monospace' }}
+                  >
                     {solarIndices.data.ssn?.current || '--'}
                   </div>
                   <div style={{ fontSize: '8px', color: 'var(--text-muted)', lineHeight: 1.2 }}>
@@ -635,29 +848,49 @@ export const SolarPanel = ({ solarIndices, forcedMode }) => {
                 <div style={{ flex: 1 }}>
                   {solarIndices.data.ssn?.history?.length > 0 ? (
                     <div>
-                      <div style={{ fontSize: '8px', color: 'var(--text-muted)', marginBottom: '1px', display: 'flex', justifyContent: 'space-between' }}>
+                      <div
+                        style={{
+                          fontSize: '8px',
+                          color: 'var(--text-muted)',
+                          marginBottom: '1px',
+                          display: 'flex',
+                          justifyContent: 'space-between',
+                        }}
+                      >
                         <span>Sunspot Number — 20-day trend</span>
-                        <span>{(() => { const h = solarIndices.data.ssn.history.slice(-20); const vals = h.map(d => d.value); return `${Math.min(...vals)}–${Math.max(...vals)}`; })()}</span>
+                        <span>
+                          {(() => {
+                            const h = solarIndices.data.ssn.history.slice(-20);
+                            const vals = h.map((d) => d.value);
+                            return `${Math.min(...vals)}–${Math.max(...vals)}`;
+                          })()}
+                        </span>
                       </div>
                       <svg width="100%" height="30" viewBox="0 0 100 30" preserveAspectRatio="none">
                         {(() => {
                           const data = solarIndices.data.ssn.history.slice(-20);
-                          const values = data.map(d => d.value);
+                          const values = data.map((d) => d.value);
                           const max = Math.max(...values, 1);
                           const min = Math.min(...values, 0);
                           const range = max - min || 1;
-                          const points = data.map((d, i) => {
-                            const x = (i / (data.length - 1)) * 100;
-                            const y = 30 - ((d.value - min) / range) * 25;
-                            return `${x},${y}`;
-                          }).join(' ');
+                          const points = data
+                            .map((d, i) => {
+                              const x = (i / (data.length - 1)) * 100;
+                              const y = 30 - ((d.value - min) / range) * 25;
+                              return `${x},${y}`;
+                            })
+                            .join(' ');
                           return <polyline points={points} fill="none" stroke="#aa88ff" strokeWidth="1.5" />;
                         })()}
                       </svg>
                     </div>
                   ) : (
                     <div style={{ fontSize: '9px', color: 'var(--text-muted)', lineHeight: 1.3 }}>
-                      Daily sunspot count.<br/>More sunspots = more ionization = better HF.<br/>Tracks the 11-year solar cycle.
+                      Daily sunspot count.
+                      <br />
+                      More sunspots = more ionization = better HF.
+                      <br />
+                      Tracks the 11-year solar cycle.
                     </div>
                   )}
                 </div>
@@ -671,25 +904,23 @@ export const SolarPanel = ({ solarIndices, forcedMode }) => {
         </div>
       ) : mode === 'xray' ? (
         /* X-Ray Flux Chart View */
-        <div style={{ flex: 1, overflowY: 'auto', minHeight: 0 }}>
-          {renderXrayChart()}
-        </div>
+        <div style={{ flex: 1, overflowY: 'auto', minHeight: 0 }}>{renderXrayChart()}</div>
       ) : mode === 'lunar' ? (
         /* Lunar Phase View */
-        <div style={{ flex: 1, overflowY: 'auto', minHeight: 0 }}>
-          {renderLunar()}
-        </div>
+        <div style={{ flex: 1, overflowY: 'auto', minHeight: 0 }}>{renderLunar()}</div>
       ) : (
         /* Solar Image View */
-        <div style={{
-          flex: 1,
-          display: 'flex',
-          flexDirection: 'column',
-          alignItems: 'center',
-          justifyContent: 'center',
-          minHeight: 0,
-          overflow: 'hidden'
-        }}>
+        <div
+          style={{
+            flex: 1,
+            display: 'flex',
+            flexDirection: 'column',
+            alignItems: 'center',
+            justifyContent: 'center',
+            minHeight: 0,
+            overflow: 'hidden',
+          }}
+        >
           {imageError ? (
             <div style={{ textAlign: 'center', color: 'var(--text-muted)', padding: '20px' }}>
               <div style={{ fontSize: '24px', marginBottom: '4px' }}>☀️</div>
@@ -706,7 +937,7 @@ export const SolarPanel = ({ solarIndices, forcedMode }) => {
                 height: 'auto',
                 objectFit: 'contain',
                 borderRadius: '50%',
-                border: '2px solid var(--border-color)'
+                border: '2px solid var(--border-color)',
               }}
               onError={() => setImageError(true)}
               onLoad={() => setImageError(false)}
diff --git a/src/components/SpaceWeatherPanel.jsx b/src/components/SpaceWeatherPanel.jsx
index d0aaca12..0162ab43 100644
--- a/src/components/SpaceWeatherPanel.jsx
+++ b/src/components/SpaceWeatherPanel.jsx
@@ -21,64 +21,86 @@ export const SpaceWeatherPanel = ({ data, loading }) => {
           <div className="loading-spinner" />
         </div>
       ) : (
-        <div style={{ 
-          display: 'grid', 
-          gridTemplateColumns: 'repeat(3, 1fr)', 
-          gap: '12px', 
-          textAlign: 'center' 
-        }}>
+        <div
+          style={{
+            display: 'grid',
+            gridTemplateColumns: 'repeat(3, 1fr)',
+            gap: '12px',
+            textAlign: 'center',
+          }}
+        >
           <div>
             <div style={{ fontSize: '11px', color: 'var(--text-muted)', marginBottom: '4px' }}>SFI</div>
-            <div style={{ 
-              fontSize: '24px', 
-              fontWeight: '700', 
-              color: 'var(--accent-amber)',
-              fontFamily: 'Orbitron, monospace'
-            }}>
+            <div
+              style={{
+                fontSize: '24px',
+                fontWeight: '700',
+                color: 'var(--accent-amber)',
+                fontFamily: 'Orbitron, monospace',
+              }}
+            >
               {data?.solarFlux || '--'}
             </div>
           </div>
           <div>
             <div style={{ fontSize: '11px', color: 'var(--text-muted)', marginBottom: '4px' }}>K-INDEX</div>
-            <div style={{ 
-              fontSize: '24px', 
-              fontWeight: '700', 
-              color: getKIndexColor(data?.kIndex),
-              fontFamily: 'Orbitron, monospace'
-            }}>
+            <div
+              style={{
+                fontSize: '24px',
+                fontWeight: '700',
+                color: getKIndexColor(data?.kIndex),
+                fontFamily: 'Orbitron, monospace',
+              }}
+            >
               {data?.kIndex || '--'}
             </div>
           </div>
           <div>
             <div style={{ fontSize: '11px', color: 'var(--text-muted)', marginBottom: '4px' }}>SSN</div>
-            <div style={{ 
-              fontSize: '24px', 
-              fontWeight: '700', 
-              color: 'var(--accent-cyan)',
-              fontFamily: 'Orbitron, monospace'
-            }}>
+            <div
+              style={{
+                fontSize: '24px',
+                fontWeight: '700',
+                color: 'var(--accent-cyan)',
+                fontFamily: 'Orbitron, monospace',
+              }}
+            >
               {data?.sunspotNumber || '--'}
             </div>
           </div>
         </div>
       )}
       {data?.conditions && (
-        <div style={{ 
-          textAlign: 'center', 
-          marginTop: '12px', 
-          padding: '6px',
-          background: data.conditions === 'GOOD' ? 'rgba(0, 255, 136, 0.1)' :
-                      data.conditions === 'FAIR' ? 'rgba(255, 180, 50, 0.1)' :
-                      data.conditions === 'POOR' ? 'rgba(255, 68, 102, 0.1)' : 'transparent',
-          borderRadius: '4px'
-        }}>
-          <span style={{ 
-            fontSize: '11px', 
-            fontWeight: '600',
-            color: data.conditions === 'GOOD' ? 'var(--accent-green)' :
-                   data.conditions === 'FAIR' ? 'var(--accent-amber)' :
-                   data.conditions === 'POOR' ? 'var(--accent-red)' : 'var(--text-muted)'
-          }}>
+        <div
+          style={{
+            textAlign: 'center',
+            marginTop: '12px',
+            padding: '6px',
+            background:
+              data.conditions === 'GOOD'
+                ? 'rgba(0, 255, 136, 0.1)'
+                : data.conditions === 'FAIR'
+                  ? 'rgba(255, 180, 50, 0.1)'
+                  : data.conditions === 'POOR'
+                    ? 'rgba(255, 68, 102, 0.1)'
+                    : 'transparent',
+            borderRadius: '4px',
+          }}
+        >
+          <span
+            style={{
+              fontSize: '11px',
+              fontWeight: '600',
+              color:
+                data.conditions === 'GOOD'
+                  ? 'var(--accent-green)'
+                  : data.conditions === 'FAIR'
+                    ? 'var(--accent-amber)'
+                    : data.conditions === 'POOR'
+                      ? 'var(--accent-red)'
+                      : 'var(--text-muted)',
+            }}
+          >
             CONDITIONS: {data.conditions}
           </span>
         </div>
diff --git a/src/components/WWFFPanel.jsx b/src/components/WWFFPanel.jsx
index 01c238b5..77efdab9 100644
--- a/src/components/WWFFPanel.jsx
+++ b/src/components/WWFFPanel.jsx
@@ -22,16 +22,29 @@ export const WWFFPanel = ({
 
   return (
     <div className="panel" style={{ padding: '8px', height: '100%', display: 'flex', flexDirection: 'column' }}>
-      <div className="panel-header" style={{
-        display: 'flex',
-        justifyContent: 'space-between',
-        alignItems: 'center',
-        marginBottom: '6px',
-        fontSize: '11px'
-      }}>
+      <div
+        className="panel-header"
+        style={{
+          display: 'flex',
+          justifyContent: 'space-between',
+          alignItems: 'center',
+          marginBottom: '6px',
+          fontSize: '11px',
+        }}
+      >
         <span>
           ▲ WWFF ACTIVATORS {data?.length > 0 ? `(${data.length})` : ''}
-          {checkedTime && <span style={{ color: isStale ? (staleMinutes >= 10 ? '#ff4444' : '#ffaa00') : '#666', marginLeft: '6px', fontSize: '9px' }}>{isStale ? `⚠ ${staleMinutes}m stale` : `✓${checkedTime}`}</span>}
+          {checkedTime && (
+            <span
+              style={{
+                color: isStale ? (staleMinutes >= 10 ? '#ff4444' : '#ffaa00') : '#666',
+                marginLeft: '6px',
+                fontSize: '9px',
+              }}
+            >
+              {isStale ? `⚠ ${staleMinutes}m stale` : `✓${checkedTime}`}
+            </span>
+          )}
         </span>
         <div style={{ display: 'flex', gap: '6px', alignItems: 'center' }}>
           <button
@@ -45,7 +58,7 @@ export const WWFFPanel = ({
               borderRadius: '3px',
               fontSize: '9px',
               fontFamily: 'JetBrains Mono',
-              cursor: 'pointer'
+              cursor: 'pointer',
             }}
           >
             ⊞ Map {showOnMap ? 'ON' : 'OFF'}
@@ -63,7 +76,7 @@ export const WWFFPanel = ({
                 borderRadius: '3px',
                 fontSize: '9px',
                 fontFamily: 'JetBrains Mono',
-                cursor: 'pointer'
+                cursor: 'pointer',
               }}
             >
               ⊞ Calls {showLabelsOnMap ? 'ON' : 'OFF'}
@@ -89,13 +102,28 @@ export const WWFFPanel = ({
                   gap: '4px',
                   padding: '3px 0',
                   borderBottom: i < data.length - 1 ? '1px solid var(--border-color)' : 'none',
-                  cursor: 'pointer'
+                  cursor: 'pointer',
                 }}
               >
-                <span style={{ color: '#44cc44', fontWeight: '600', overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}>
+                <span
+                  style={{
+                    color: '#44cc44',
+                    fontWeight: '600',
+                    overflow: 'hidden',
+                    textOverflow: 'ellipsis',
+                    whiteSpace: 'nowrap',
+                  }}
+                >
                   <CallsignLink call={spot.call} color="#44cc44" fontWeight="600" />
                 </span>
-                <span style={{ color: 'var(--text-muted)', overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}>
+                <span
+                  style={{
+                    color: 'var(--text-muted)',
+                    overflow: 'hidden',
+                    textOverflow: 'ellipsis',
+                    whiteSpace: 'nowrap',
+                  }}
+                >
                   {spot.ref}
                 </span>
                 <span style={{ color: 'var(--accent-cyan)', textAlign: 'right' }}>
@@ -111,9 +139,7 @@ export const WWFFPanel = ({
                     }
                   })()}
                 </span>
-                <span style={{ color: 'var(--text-muted)', textAlign: 'right', fontSize: '9px' }}>
-                  {spot.time}
-                </span>
+                <span style={{ color: 'var(--text-muted)', textAlign: 'right', fontSize: '9px' }}>{spot.time}</span>
               </div>
             ))}
           </div>
diff --git a/src/components/WeatherPanel.jsx b/src/components/WeatherPanel.jsx
index 48b69981..c6f63821 100644
--- a/src/components/WeatherPanel.jsx
+++ b/src/components/WeatherPanel.jsx
@@ -1,12 +1,12 @@
 /**
  * WeatherPanel Component
  * Displays current weather conditions with expandable forecast details.
- * 
+ *
  * Can receive pre-fetched weather data via `weatherData` prop (from App-level
  * useWeather hook), or fetch its own data via `location` prop. Pre-fetched
  * data eliminates duplicate API calls when multiple components need the same
  * weather (e.g., DE panel + header both showing home station weather).
- * 
+ *
  * Shows loading skeleton and error/retry states instead of disappearing
  * when weather API is rate-limited.
  */
@@ -20,11 +20,15 @@ export const WeatherPanel = ({
   tempUnit,
   onTempUnitChange,
   nodeId,
-  weatherData   // Optional: pre-fetched { data, loading, error } from useWeather
+  weatherData, // Optional: pre-fetched { data, loading, error } from useWeather
 }) => {
   const { t } = useTranslation();
   const [weatherExpanded, setWeatherExpanded] = useState(() => {
-    try { return localStorage.getItem('openhamclock_weatherExpanded') === 'true'; } catch { return false; }
+    try {
+      return localStorage.getItem('openhamclock_weatherExpanded') === 'true';
+    } catch {
+      return false;
+    }
   });
   const contentRef = useRef(null);
   const prevExpandedRef = useRef(weatherExpanded);
@@ -67,13 +71,20 @@ export const WeatherPanel = ({
   // --- Loading state ---
   if (loading && !w) {
     return (
-      <div ref={contentRef} style={{ marginTop: '12px', borderTop: '1px solid var(--border-color)', paddingTop: '10px' }}>
+      <div
+        ref={contentRef}
+        style={{ marginTop: '12px', borderTop: '1px solid var(--border-color)', paddingTop: '10px' }}
+      >
         <div style={{ display: 'flex', alignItems: 'center', gap: '8px' }}>
           <span style={{ fontSize: '20px', lineHeight: 1, opacity: 0.4 }}>🌡️</span>
-          <span style={{
-            fontSize: '14px', color: 'var(--text-muted)', fontFamily: 'JetBrains Mono, monospace',
-            animation: 'pulse 1.5s ease-in-out infinite'
-          }}>
+          <span
+            style={{
+              fontSize: '14px',
+              color: 'var(--text-muted)',
+              fontFamily: 'JetBrains Mono, monospace',
+              animation: 'pulse 1.5s ease-in-out infinite',
+            }}
+          >
             Loading weather…
           </span>
           <style>{`@keyframes pulse { 0%, 100% { opacity: 0.4 } 50% { opacity: 1 } }`}</style>
@@ -85,17 +96,24 @@ export const WeatherPanel = ({
   // Translate error messages from useWeather hook
   const getErrorMessage = (msg) => {
     switch (msg) {
-      case 'Weather unavailable': return t('weather.error.unavailable');
-      case 'Weather service busy': return t('weather.error.busy');
-      case 'Weather loading...': return t('weather.error.loading');
-      default: return msg;
+      case 'Weather unavailable':
+        return t('weather.error.unavailable');
+      case 'Weather service busy':
+        return t('weather.error.busy');
+      case 'Weather loading...':
+        return t('weather.error.loading');
+      default:
+        return msg;
     }
   };
 
   // --- Error state (no data at all) ---
   if (!w && error) {
     return (
-      <div ref={contentRef} style={{ marginTop: '12px', borderTop: '1px solid var(--border-color)', paddingTop: '10px' }}>
+      <div
+        ref={contentRef}
+        style={{ marginTop: '12px', borderTop: '1px solid var(--border-color)', paddingTop: '10px' }}
+      >
         <div style={{ display: 'flex', alignItems: 'center', gap: '8px' }}>
           <span style={{ fontSize: '16px', lineHeight: 1 }}>⚠️</span>
           <span style={{ fontSize: '11px', color: 'var(--text-muted)', fontFamily: 'JetBrains Mono, monospace' }}>
@@ -119,27 +137,60 @@ export const WeatherPanel = ({
       {/* Compact summary row — always visible */}
       <div style={{ display: 'flex', alignItems: 'center', gap: '8px' }}>
         <div
-          onClick={() => { const next = !weatherExpanded; setWeatherExpanded(next); try { localStorage.setItem('openhamclock_weatherExpanded', next.toString()); } catch { } }}
+          onClick={() => {
+            const next = !weatherExpanded;
+            setWeatherExpanded(next);
+            try {
+              localStorage.setItem('openhamclock_weatherExpanded', next.toString());
+            } catch {}
+          }}
           style={{
-            display: 'flex', alignItems: 'center', gap: '8px', cursor: 'pointer',
-            userSelect: 'none', flex: 1, minWidth: 0,
+            display: 'flex',
+            alignItems: 'center',
+            gap: '8px',
+            cursor: 'pointer',
+            userSelect: 'none',
+            flex: 1,
+            minWidth: 0,
           }}
         >
           <span style={{ fontSize: '20px', lineHeight: 1 }}>{w.icon}</span>
-          <span style={{ fontSize: '18px', fontWeight: '700', color: 'var(--text-primary)', fontFamily: 'Orbitron, monospace' }}>
-            {w.temp}{deg}
+          <span
+            style={{
+              fontSize: '18px',
+              fontWeight: '700',
+              color: 'var(--text-primary)',
+              fontFamily: 'Orbitron, monospace',
+            }}
+          >
+            {w.temp}
+            {deg}
           </span>
-          <span style={{ fontSize: '11px', color: 'var(--text-secondary)', flex: 1, overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}>
+          <span
+            style={{
+              fontSize: '11px',
+              color: 'var(--text-secondary)',
+              flex: 1,
+              overflow: 'hidden',
+              textOverflow: 'ellipsis',
+              whiteSpace: 'nowrap',
+            }}
+          >
             {t(`weather.condition.${w.weatherCode}`, { defaultValue: w.description })}
           </span>
           <span style={{ fontSize: '11px', color: 'var(--text-muted)', fontFamily: 'JetBrains Mono, monospace' }}>
             💨{w.windSpeed}
           </span>
-          <span style={{
-            fontSize: '10px', color: 'var(--text-muted)',
-            transform: weatherExpanded ? 'rotate(180deg)' : 'rotate(0deg)',
-            transition: 'transform 0.2s',
-          }}>▼</span>
+          <span
+            style={{
+              fontSize: '10px',
+              color: 'var(--text-muted)',
+              transform: weatherExpanded ? 'rotate(180deg)' : 'rotate(0deg)',
+              transition: 'transform 0.2s',
+            }}
+          >
+            ▼
+          </span>
         </div>
         {/* F/C toggle */}
         {onTempUnitChange && (
@@ -169,11 +220,17 @@ export const WeatherPanel = ({
 
       {/* Error badge — show when data is stale but we have cached data */}
       {error && w && (
-        <div style={{
-          fontSize: '9px', color: 'var(--accent-amber)', fontFamily: 'JetBrains Mono, monospace',
-          marginTop: '4px', opacity: 0.7
-        }}>
-          ⚠ {getErrorMessage(error.message)}{error.retryIn ? t('weather.error.retry', { seconds: error.retryIn }) : ''}
+        <div
+          style={{
+            fontSize: '9px',
+            color: 'var(--accent-amber)',
+            fontFamily: 'JetBrains Mono, monospace',
+            marginTop: '4px',
+            opacity: 0.7,
+          }}
+        >
+          ⚠ {getErrorMessage(error.message)}
+          {error.retryIn ? t('weather.error.retry', { seconds: error.retryIn }) : ''}
         </div>
       )}
 
@@ -181,27 +238,38 @@ export const WeatherPanel = ({
       {weatherExpanded && (
         <div style={{ marginTop: '10px' }}>
           {/* Feels like + hi/lo */}
-          <div style={{ display: 'flex', justifyContent: 'space-between', fontSize: '11px', marginBottom: '8px', fontFamily: 'JetBrains Mono, monospace' }}>
+          <div
+            style={{
+              display: 'flex',
+              justifyContent: 'space-between',
+              fontSize: '11px',
+              marginBottom: '8px',
+              fontFamily: 'JetBrains Mono, monospace',
+            }}
+          >
             {w.feelsLike !== w.temp && (
-              <span style={{ color: 'var(--text-muted)' }}>{t('weather.feelsLike', { temp: `${w.feelsLike}${deg}` })}</span>
+              <span style={{ color: 'var(--text-muted)' }}>
+                {t('weather.feelsLike', { temp: `${w.feelsLike}${deg}` })}
+              </span>
             )}
             {w.todayHigh != null && (
               <span style={{ color: 'var(--text-muted)', marginLeft: 'auto' }}>
-                <span style={{ color: 'var(--accent-amber)' }}>▲{w.todayHigh}°</span>
-                {' '}
+                <span style={{ color: 'var(--accent-amber)' }}>▲{w.todayHigh}°</span>{' '}
                 <span style={{ color: 'var(--accent-blue)' }}>▼{w.todayLow}°</span>
               </span>
             )}
           </div>
 
           {/* Detail grid */}
-          <div style={{
-            display: 'grid',
-            gridTemplateColumns: '1fr 1fr',
-            gap: '6px 12px',
-            fontSize: '11px',
-            fontFamily: 'JetBrains Mono, monospace',
-          }}>
+          <div
+            style={{
+              display: 'grid',
+              gridTemplateColumns: '1fr 1fr',
+              gap: '6px 12px',
+              fontSize: '11px',
+              fontFamily: 'JetBrains Mono, monospace',
+            }}
+          >
             <div style={{ display: 'flex', justifyContent: 'space-between' }}>
               <span style={{ color: 'var(--text-muted)' }}>{t('weather.wind')}</span>
               <span style={{ color: 'var(--text-secondary)' }}>
@@ -215,17 +283,24 @@ export const WeatherPanel = ({
             {w.windGusts > w.windSpeed + 5 && (
               <div style={{ display: 'flex', justifyContent: 'space-between' }}>
                 <span style={{ color: 'var(--text-muted)' }}>{t('weather.gusts')}</span>
-                <span style={{ color: 'var(--text-secondary)' }}>{w.windGusts} {wind}</span>
+                <span style={{ color: 'var(--text-secondary)' }}>
+                  {w.windGusts} {wind}
+                </span>
               </div>
             )}
             <div style={{ display: 'flex', justifyContent: 'space-between' }}>
               <span style={{ color: 'var(--text-muted)' }}>{t('weather.dewPoint')}</span>
-              <span style={{ color: 'var(--text-secondary)' }}>{w.dewPoint}{deg}</span>
+              <span style={{ color: 'var(--text-secondary)' }}>
+                {w.dewPoint}
+                {deg}
+              </span>
             </div>
             {w.pressure && (
               <div style={{ display: 'flex', justifyContent: 'space-between' }}>
                 <span style={{ color: 'var(--text-muted)' }}>{t('weather.pressure')}</span>
-                <span style={{ color: 'var(--text-secondary)' }}>{w.pressure} {t('weather.hpa')}</span>
+                <span style={{ color: 'var(--text-secondary)' }}>
+                  {w.pressure} {t('weather.hpa')}
+                </span>
               </div>
             )}
             <div style={{ display: 'flex', justifyContent: 'space-between' }}>
@@ -235,13 +310,26 @@ export const WeatherPanel = ({
             {w.visibility && (
               <div style={{ display: 'flex', justifyContent: 'space-between' }}>
                 <span style={{ color: 'var(--text-muted)' }}>{t('weather.visibility')}</span>
-                <span style={{ color: 'var(--text-secondary)' }}>{w.visibility} {vis}</span>
+                <span style={{ color: 'var(--text-secondary)' }}>
+                  {w.visibility} {vis}
+                </span>
               </div>
             )}
             {w.uvIndex > 0 && (
               <div style={{ display: 'flex', justifyContent: 'space-between' }}>
                 <span style={{ color: 'var(--text-muted)' }}>{t('weather.uv')}</span>
-                <span style={{ color: w.uvIndex >= 8 ? '#ef4444' : w.uvIndex >= 6 ? '#f97316' : w.uvIndex >= 3 ? '#eab308' : 'var(--text-secondary)' }}>
+                <span
+                  style={{
+                    color:
+                      w.uvIndex >= 8
+                        ? '#ef4444'
+                        : w.uvIndex >= 6
+                          ? '#f97316'
+                          : w.uvIndex >= 3
+                            ? '#eab308'
+                            : 'var(--text-secondary)',
+                  }}
+                >
                   {w.uvIndex.toFixed(1)}
                 </span>
               </div>
@@ -250,23 +338,32 @@ export const WeatherPanel = ({
 
           {/* 3-Day Forecast */}
           {w.daily?.length > 0 && (
-            <div style={{
-              marginTop: '10px',
-              paddingTop: '8px',
-              borderTop: '1px solid var(--border-color)',
-            }}>
-              <div style={{ fontSize: '10px', color: 'var(--text-muted)', marginBottom: '6px', fontWeight: '600' }}>{t('weather.forecast')}</div>
+            <div
+              style={{
+                marginTop: '10px',
+                paddingTop: '8px',
+                borderTop: '1px solid var(--border-color)',
+              }}
+            >
+              <div style={{ fontSize: '10px', color: 'var(--text-muted)', marginBottom: '6px', fontWeight: '600' }}>
+                {t('weather.forecast')}
+              </div>
               <div style={{ display: 'flex', gap: '4px' }}>
                 {w.daily.map((day, i) => (
-                  <div key={i} style={{
-                    flex: 1,
-                    textAlign: 'center',
-                    padding: '6px 2px',
-                    background: 'var(--bg-tertiary)',
-                    borderRadius: '4px',
-                    fontSize: '10px',
-                  }}>
-                    <div style={{ color: 'var(--text-muted)', fontWeight: '600', marginBottom: '2px' }}>{i === 0 ? t('weather.today') : day.date}</div>
+                  <div
+                    key={i}
+                    style={{
+                      flex: 1,
+                      textAlign: 'center',
+                      padding: '6px 2px',
+                      background: 'var(--bg-tertiary)',
+                      borderRadius: '4px',
+                      fontSize: '10px',
+                    }}
+                  >
+                    <div style={{ color: 'var(--text-muted)', fontWeight: '600', marginBottom: '2px' }}>
+                      {i === 0 ? t('weather.today') : day.date}
+                    </div>
                     <div style={{ fontSize: '16px', lineHeight: 1.2 }}>{day.icon}</div>
                     <div style={{ fontFamily: 'JetBrains Mono, monospace', marginTop: '2px' }}>
                       <span style={{ color: 'var(--accent-amber)' }}>{day.high}°</span>
diff --git a/src/components/WhatsNew.jsx b/src/components/WhatsNew.jsx
index 4c4dc82c..f6076de1 100644
--- a/src/components/WhatsNew.jsx
+++ b/src/components/WhatsNew.jsx
@@ -17,24 +17,24 @@ const CHANGELOG = [
       {
         icon: '🗺️',
         title: 'Leaflet Load Reliability Fix',
-        desc: 'Fixed a race condition where the world map could silently fail to initialize if Leaflet\'s vendor script hadn\'t finished loading by the time the map component mounted — most likely on slower connections or after a failed vendor-download. The map now polls for up to 5 seconds and retries automatically instead of giving up on first mount.'
+        desc: "Fixed a race condition where the world map could silently fail to initialize if Leaflet's vendor script hadn't finished loading by the time the map component mounted — most likely on slower connections or after a failed vendor-download. The map now polls for up to 5 seconds and retries automatically instead of giving up on first mount.",
       },
       {
         icon: '🛠️',
         title: 'Actionable Leaflet Error',
-        desc: 'If Leaflet genuinely fails to load after 5 seconds (missing vendor file, 404, network error), the console now shows a clear message with the exact fix: run bash scripts/vendor-download.sh. No more cryptic "Leaflet not loaded" with no context.'
+        desc: 'If Leaflet genuinely fails to load after 5 seconds (missing vendor file, 404, network error), the console now shows a clear message with the exact fix: run bash scripts/vendor-download.sh. No more cryptic "Leaflet not loaded" with no context.',
       },
       {
         icon: '🤝',
         title: 'Contributor Self-Assign',
-        desc: 'Any GitHub user can now self-assign issues without needing write access. Comment /assign on any open issue and the bot will claim it for you instantly and react with 👍. Makes it easy to signal you\'re working on something without waiting for a maintainer.'
+        desc: "Any GitHub user can now self-assign issues without needing write access. Comment /assign on any open issue and the bot will claim it for you instantly and react with 👍. Makes it easy to signal you're working on something without waiting for a maintainer.",
       },
       {
         icon: '📋',
         title: 'Updated Contributing Guide',
-        desc: 'CONTRIBUTING.md now includes a dedicated "Claiming a Bug or Issue" section explaining the /assign workflow, sitting right where new contributors naturally look — between feature requests and code submission instructions.'
+        desc: 'CONTRIBUTING.md now includes a dedicated "Claiming a Bug or Issue" section explaining the /assign workflow, sitting right where new contributors naturally look — between feature requests and code submission instructions.',
       },
-    ]
+    ],
   },
   {
     version: '15.5.4',
@@ -44,44 +44,44 @@ const CHANGELOG = [
       {
         icon: '📡',
         title: 'Stale Spots Fix',
-        desc: 'Fixed a bug where WWFF spots could show data hours old due to a cache validation error. All three spot sources (POTA, SOTA, WWFF) now enforce a 60-minute age filter and a 10-minute stale cache limit — no more chasing ghosts.'
+        desc: 'Fixed a bug where WWFF spots could show data hours old due to a cache validation error. All three spot sources (POTA, SOTA, WWFF) now enforce a 60-minute age filter and a 10-minute stale cache limit — no more chasing ghosts.',
       },
       {
         icon: '🧠',
         title: 'Memory Leak Fixes',
-        desc: 'Plugged several server-side memory leaks: RBN API response cache now auto-cleans, callsign and IP tracking caps tightened, and cache structures that grew unbounded over 24 hours are now properly pruned.'
+        desc: 'Plugged several server-side memory leaks: RBN API response cache now auto-cleans, callsign and IP tracking caps tightened, and cache structures that grew unbounded over 24 hours are now properly pruned.',
       },
       {
         icon: '🔇',
         title: 'QRZ Login Spam Eliminated',
-        desc: 'QRZ credential failures now properly respect the 1-hour cooldown. Previously, any user testing credentials in Settings would reset the timer for everyone, hammering QRZ with bad logins all day.'
+        desc: 'QRZ credential failures now properly respect the 1-hour cooldown. Previously, any user testing credentials in Settings would reset the timer for everyone, hammering QRZ with bad logins all day.',
       },
       {
         icon: '🛡️',
         title: 'Cleaner Error Handling',
-        desc: 'Added proper Express error middleware to catch body-parser errors gracefully. No more stack traces in logs from clients disconnecting mid-request or sending oversized payloads.'
+        desc: 'Added proper Express error middleware to catch body-parser errors gracefully. No more stack traces in logs from clients disconnecting mid-request or sending oversized payloads.',
       },
       {
         icon: '🎨',
         title: 'Prettier for Contributors',
-        desc: 'Standardized code formatting with Prettier, pre-commit hooks via Husky, and CI enforcement. No more quote style debates in pull requests — formatting is now automatic.'
+        desc: 'Standardized code formatting with Prettier, pre-commit hooks via Husky, and CI enforcement. No more quote style debates in pull requests — formatting is now automatic.',
       },
       {
         icon: '📻',
         title: 'Rig Control Options Restored',
-        desc: 'The rig-bridge (flrig/rigctld) and rig-control (daemon mode) directories are back for power users who need more customization than the one-click Rig Listener provides.'
+        desc: 'The rig-bridge (flrig/rigctld) and rig-control (daemon mode) directories are back for power users who need more customization than the one-click Rig Listener provides.',
       },
       {
         icon: '🔎',
         title: 'DX Cluster Mode Filter Fixed',
-        desc: 'Filtering by SSB, FT8, or CW no longer hides everything. Mode detection now infers from frequency when the spot comment doesn\'t mention a mode — which is most spots. 14.074? That\'s FT8. 14.250? SSB. It just works now.'
+        desc: "Filtering by SSB, FT8, or CW no longer hides everything. Mode detection now infers from frequency when the spot comment doesn't mention a mode — which is most spots. 14.074? That's FT8. 14.250? SSB. It just works now.",
       },
       {
         icon: '📡',
         title: 'RBN Skimmer Locations Fixed',
-        desc: 'Fixed a bug where RBN skimmer callsigns could show at wrong locations on the map. Enrichment is now sequential with cross-validation — if a lookup returns a location >5000 km from the callsign\'s expected country, it falls back to prefix estimation.'
+        desc: "Fixed a bug where RBN skimmer callsigns could show at wrong locations on the map. Enrichment is now sequential with cross-validation — if a lookup returns a location >5000 km from the callsign's expected country, it falls back to prefix estimation.",
       },
-    ]
+    ],
   },
   {
     version: '15.5.3',
@@ -91,44 +91,44 @@ const CHANGELOG = [
       {
         icon: '🛰️',
         title: 'Satellite Tracker Overhaul',
-        desc: 'Completely redesigned satellite layer with a floating data window, blinking indicators for visible passes, pinned satellite tracking, and GOES-18/19 weather satellites re-enabled.'
+        desc: 'Completely redesigned satellite layer with a floating data window, blinking indicators for visible passes, pinned satellite tracking, and GOES-18/19 weather satellites re-enabled.',
       },
       {
         icon: '⛰️',
         title: 'SOTA Summit Details',
-        desc: 'SOTA spots now include full summit information — name, altitude, coordinates, and point values — pulled from the official SOTA summits database and refreshed daily.'
+        desc: 'SOTA spots now include full summit information — name, altitude, coordinates, and point values — pulled from the official SOTA summits database and refreshed daily.',
       },
       {
         icon: '📻',
         title: 'WSJT-X Rig Tuning Fix',
-        desc: 'Clicking a WSJT-X decode now sends the correct dial frequency to your radio instead of the audio offset. FT8/FT4 click-to-tune works properly.'
+        desc: 'Clicking a WSJT-X decode now sends the correct dial frequency to your radio instead of the audio offset. FT8/FT4 click-to-tune works properly.',
       },
       {
         icon: '🎯',
         title: 'POTA/WWFF Click-to-Tune',
-        desc: 'POTA and WWFF spots now properly trigger rig control when clicked — same one-click tuning that DX cluster spots have always had.'
+        desc: 'POTA and WWFF spots now properly trigger rig control when clicked — same one-click tuning that DX cluster spots have always had.',
       },
       {
         icon: '📊',
         title: 'Frequency Display Fix',
-        desc: 'POTA, SOTA, and WWFF panels now consistently display frequencies in MHz. No more confusion between kHz and MHz values across different data sources.'
+        desc: 'POTA, SOTA, and WWFF panels now consistently display frequencies in MHz. No more confusion between kHz and MHz values across different data sources.',
       },
       {
         icon: '🔇',
         title: 'SOTA QRT Filtering',
-        desc: 'Operators who have signed off (QRT) are now automatically filtered out of the SOTA spots list — no more chasing stations that are already off the air.'
+        desc: 'Operators who have signed off (QRT) are now automatically filtered out of the SOTA spots list — no more chasing stations that are already off the air.',
       },
       {
         icon: '🔍',
         title: 'SEO & Branding',
-        desc: 'New favicon, Open Graph social sharing cards, structured data for search engines, and a canonical URL to ensure openhamclock.com is always the top result.'
+        desc: 'New favicon, Open Graph social sharing cards, structured data for search engines, and a canonical URL to ensure openhamclock.com is always the top result.',
       },
       {
         icon: '🤝',
         title: 'Community Tab',
-        desc: 'New Community tab in Settings with links to GitHub, Facebook Group, and Reddit — plus a contributors wall thanking everyone who has helped build OpenHamClock.'
+        desc: 'New Community tab in Settings with links to GitHub, Facebook Group, and Reddit — plus a contributors wall thanking everyone who has helped build OpenHamClock.',
       },
-    ]
+    ],
   },
   {
     version: '15.5.1',
@@ -138,24 +138,24 @@ const CHANGELOG = [
       {
         icon: '🌍',
         title: 'cty.dat DXCC Entity Database',
-        desc: 'Callsign → entity identification now uses the full AD1C cty.dat database — the same file every contest logger uses. ~400 DXCC entities, thousands of prefixes, zone overrides, and exact callsign matches. Replaces the old hand-coded 120-entry prefix table.'
+        desc: 'Callsign → entity identification now uses the full AD1C cty.dat database — the same file every contest logger uses. ~400 DXCC entities, thousands of prefixes, zone overrides, and exact callsign matches. Replaces the old hand-coded 120-entry prefix table.',
       },
       {
         icon: '📡',
         title: 'MUF Layer Restored',
-        desc: 'Fixed a regression where the MUF Map layer disappeared from the Map Layers list. The ionosonde-based MUF overlay is back.'
+        desc: 'Fixed a regression where the MUF Map layer disappeared from the Map Layers list. The ionosonde-based MUF overlay is back.',
       },
       {
         icon: '🔥',
         title: 'VOACAP Power Levels Fixed',
-        desc: 'Changing TX power (e.g. 5W vs 1000W) now produces dramatically different propagation maps, matching real-world behavior. Previously, power barely affected the heatmap colors.'
+        desc: 'Changing TX power (e.g. 5W vs 1000W) now produces dramatically different propagation maps, matching real-world behavior. Previously, power barely affected the heatmap colors.',
       },
       {
         icon: '🔎',
         title: 'Smarter DX Cluster Filtering',
-        desc: 'Spotter and spot continent/zone filtering is now far more accurate thanks to the cty.dat database. Calls like 3B9WR (Rodriguez Island) and 5B4 (Cyprus) are correctly identified instead of falling through to crude single-character guesses.'
+        desc: 'Spotter and spot continent/zone filtering is now far more accurate thanks to the cty.dat database. Calls like 3B9WR (Rodriguez Island) and 5B4 (Cyprus) are correctly identified instead of falling through to crude single-character guesses.',
       },
-    ]
+    ],
   },
   {
     version: '15.5.0',
@@ -165,34 +165,34 @@ const CHANGELOG = [
       {
         icon: '📻',
         title: 'Direct Rig Control',
-        desc: 'Click any DX cluster spot, POTA activation, or WSJT-X decode and your radio tunes instantly. Supports Yaesu, Kenwood, Elecraft, and Icom radios — no flrig or rigctld needed.'
+        desc: 'Click any DX cluster spot, POTA activation, or WSJT-X decode and your radio tunes instantly. Supports Yaesu, Kenwood, Elecraft, and Icom radios — no flrig or rigctld needed.',
       },
       {
         icon: '⬇️',
         title: 'One-Click Rig Listener Download',
-        desc: 'Enable Rig Control in Settings and download the Rig Listener for Windows, Mac, or Linux. Double-click to run — it auto-installs everything. No Node.js, no command line, no setup headaches.'
+        desc: 'Enable Rig Control in Settings and download the Rig Listener for Windows, Mac, or Linux. Double-click to run — it auto-installs everything. No Node.js, no command line, no setup headaches.',
       },
       {
         icon: '🔌',
         title: 'Interactive Setup Wizard',
-        desc: 'The Rig Listener detects your USB serial ports, asks your radio brand and model, saves the config, and connects. First run is a 30-second wizard — after that, just double-click to start.'
+        desc: 'The Rig Listener detects your USB serial ports, asks your radio brand and model, saves the config, and connects. First run is a 30-second wizard — after that, just double-click to start.',
       },
       {
         icon: '🔄',
         title: 'Live Frequency & Mode Display',
-        desc: 'Your radio\'s current frequency and mode are shown in real time on the dashboard. Polls every 500ms over USB so the display always matches your dial.'
+        desc: "Your radio's current frequency and mode are shown in real time on the dashboard. Polls every 500ms over USB so the display always matches your dial.",
       },
       {
         icon: '🌙',
         title: 'Night Darkness Slider',
-        desc: 'Adjust how dark the nighttime shading appears on the map. Slide from subtle to dramatic — find the look that works for your setup. Located below the map lock toggle.'
+        desc: 'Adjust how dark the nighttime shading appears on the map. Slide from subtle to dramatic — find the look that works for your setup. Located below the map lock toggle.',
       },
       {
         icon: '👁️',
         title: 'Hosted User Cleanup',
-        desc: 'Rotator panel and local-only features are now hidden for hosted users — cleaner interface, no confusing controls that don\'t apply to your setup.'
+        desc: "Rotator panel and local-only features are now hidden for hosted users — cleaner interface, no confusing controls that don't apply to your setup.",
       },
-    ]
+    ],
   },
   {
     version: '15.4.1',
@@ -202,55 +202,55 @@ const CHANGELOG = [
       {
         icon: '📡',
         title: 'QRZ.com Callsign Lookups',
-        desc: 'Precise station locations from QRZ user profiles, geocoded addresses, and grid squares. 3-tier waterfall: QRZ → HamQTH → prefix estimation. Configure credentials in Settings → Profiles.'
+        desc: 'Precise station locations from QRZ user profiles, geocoded addresses, and grid squares. 3-tier waterfall: QRZ → HamQTH → prefix estimation. Configure credentials in Settings → Profiles.',
       },
       {
         icon: '🎯',
         title: 'Antenna Rotator Panel',
-        desc: 'Real-time rotator control and bearing display. Shows current azimuth on the map with an animated bearing line. Shift+click the map to turn your antenna to any point.'
+        desc: 'Real-time rotator control and bearing display. Shows current azimuth on the map with an animated bearing line. Shift+click the map to turn your antenna to any point.',
       },
       {
         icon: '🖱️',
         title: 'Mouse Wheel Zoom Sensitivity',
-        desc: 'Adjustable scroll-to-zoom speed for the map. Fine-tune it in Settings → Station.'
+        desc: 'Adjustable scroll-to-zoom speed for the map. Fine-tune it in Settings → Station.',
       },
       {
         icon: '🔒',
         title: 'Map Lock',
-        desc: 'Lock the map to prevent accidental panning and zooming — great for touch screens. Toggle with the lock icon below the zoom controls.'
+        desc: 'Lock the map to prevent accidental panning and zooming — great for touch screens. Toggle with the lock icon below the zoom controls.',
       },
       {
         icon: '🔗',
         title: 'Clickable QRZ Callsigns',
-        desc: 'Callsigns across DX Cluster, POTA, SOTA, PSK Reporter, WSJT-X, and map popups are now clickable links to QRZ.com profiles.'
+        desc: 'Callsigns across DX Cluster, POTA, SOTA, PSK Reporter, WSJT-X, and map popups are now clickable links to QRZ.com profiles.',
       },
       {
         icon: '🏆',
         title: 'Contest Calendar Links',
-        desc: 'Contest names in the Contests panel now link directly to the WA7BNM contest calendar for rules and details.'
+        desc: 'Contest names in the Contests panel now link directly to the WA7BNM contest calendar for rules and details.',
       },
       {
         icon: '🌍',
         title: 'World Copy Replication',
-        desc: 'All map markers (DE, DX, POTA, SOTA, DX cluster, WSJT-X, labels) now properly replicate across all three world copies — no more disappearing markers when scrolling east/west.'
+        desc: 'All map markers (DE, DX, POTA, SOTA, DX cluster, WSJT-X, labels) now properly replicate across all three world copies — no more disappearing markers when scrolling east/west.',
       },
       {
         icon: '📻',
         title: 'RBN Firehose Fix',
-        desc: 'Reverse Beacon Network spots are no longer lost from telnet buffer overflow. All spots for each DX station are now preserved.'
+        desc: 'Reverse Beacon Network spots are no longer lost from telnet buffer overflow. All spots for each DX station are now preserved.',
       },
       {
         icon: '📡',
         title: 'VOACAP Power Reactivity',
-        desc: 'The propagation heatmap now updates immediately when you change transmit power or mode — no more stale predictions.'
+        desc: 'The propagation heatmap now updates immediately when you change transmit power or mode — no more stale predictions.',
       },
       {
         icon: '🗺️',
         title: 'PSK Reporter Direction Fix',
-        desc: 'Map popups now correctly show the remote station callsign instead of your own for both TX and RX spots.'
+        desc: 'Map popups now correctly show the remote station callsign instead of your own for both TX and RX spots.',
       },
-    ]
-  }
+    ],
+  },
 ];
 
 const LS_KEY = 'openhamclock_lastSeenVersion';
@@ -274,7 +274,7 @@ export default function WhatsNew() {
         // Show if never seen, or if the stored version differs from current
         if (!lastSeen || lastSeen !== version) {
           // Only show if we actually have changelog entries for this version
-          const hasEntry = CHANGELOG.some(c => c.version === version);
+          const hasEntry = CHANGELOG.some((c) => c.version === version);
           if (hasEntry) {
             setVisible(true);
           } else {
@@ -301,7 +301,7 @@ export default function WhatsNew() {
 
   if (!visible || !currentVersion) return null;
 
-  const entry = CHANGELOG.find(c => c.version === currentVersion);
+  const entry = CHANGELOG.find((c) => c.version === currentVersion);
   if (!entry) return null;
 
   return (
@@ -336,43 +336,53 @@ export default function WhatsNew() {
         }}
       >
         {/* Header */}
-        <div style={{
-          padding: '24px 24px 16px',
-          borderBottom: '1px solid var(--border-color, #333)',
-          textAlign: 'center',
-        }}>
-          <div style={{
-            fontSize: '13px',
-            fontFamily: "'JetBrains Mono', monospace",
-            color: 'var(--accent-cyan, #00ffcc)',
-            letterSpacing: '0.1em',
-            textTransform: 'uppercase',
-            marginBottom: '8px',
-          }}>
+        <div
+          style={{
+            padding: '24px 24px 16px',
+            borderBottom: '1px solid var(--border-color, #333)',
+            textAlign: 'center',
+          }}
+        >
+          <div
+            style={{
+              fontSize: '13px',
+              fontFamily: "'JetBrains Mono', monospace",
+              color: 'var(--accent-cyan, #00ffcc)',
+              letterSpacing: '0.1em',
+              textTransform: 'uppercase',
+              marginBottom: '8px',
+            }}
+          >
             OpenHamClock v{entry.version}
           </div>
-          <div style={{
-            fontSize: '20px',
-            fontWeight: '700',
-            color: 'var(--text-primary, #e0e0e0)',
-          }}>
+          <div
+            style={{
+              fontSize: '20px',
+              fontWeight: '700',
+              color: 'var(--text-primary, #e0e0e0)',
+            }}
+          >
             What's New
           </div>
-          <div style={{
-            fontSize: '13px',
-            color: 'var(--text-muted, #888)',
-            marginTop: '6px',
-          }}>
+          <div
+            style={{
+              fontSize: '13px',
+              color: 'var(--text-muted, #888)',
+              marginTop: '6px',
+            }}
+          >
             {entry.heading}
           </div>
         </div>
 
         {/* Feature list — scrollable */}
-        <div style={{
-          overflowY: 'auto',
-          padding: '16px 24px',
-          flex: 1,
-        }}>
+        <div
+          style={{
+            overflowY: 'auto',
+            padding: '16px 24px',
+            flex: 1,
+          }}
+        >
           {entry.features.map((f, i) => (
             <div
               key={i}
@@ -380,34 +390,38 @@ export default function WhatsNew() {
                 display: 'flex',
                 gap: '12px',
                 padding: '10px 0',
-                borderBottom: i < entry.features.length - 1
-                  ? '1px solid rgba(255,255,255,0.06)'
-                  : 'none',
+                borderBottom: i < entry.features.length - 1 ? '1px solid rgba(255,255,255,0.06)' : 'none',
               }}
             >
-              <div style={{
-                fontSize: '20px',
-                lineHeight: '28px',
-                flexShrink: 0,
-                width: '28px',
-                textAlign: 'center',
-              }}>
+              <div
+                style={{
+                  fontSize: '20px',
+                  lineHeight: '28px',
+                  flexShrink: 0,
+                  width: '28px',
+                  textAlign: 'center',
+                }}
+              >
                 {f.icon}
               </div>
               <div>
-                <div style={{
-                  fontWeight: '600',
-                  fontSize: '14px',
-                  color: 'var(--text-primary, #e0e0e0)',
-                  marginBottom: '3px',
-                }}>
+                <div
+                  style={{
+                    fontWeight: '600',
+                    fontSize: '14px',
+                    color: 'var(--text-primary, #e0e0e0)',
+                    marginBottom: '3px',
+                  }}
+                >
                   {f.title}
                 </div>
-                <div style={{
-                  fontSize: '12px',
-                  lineHeight: '1.5',
-                  color: 'var(--text-muted, #999)',
-                }}>
+                <div
+                  style={{
+                    fontSize: '12px',
+                    lineHeight: '1.5',
+                    color: 'var(--text-muted, #999)',
+                  }}
+                >
                   {f.desc}
                 </div>
               </div>
@@ -416,12 +430,14 @@ export default function WhatsNew() {
         </div>
 
         {/* Footer */}
-        <div style={{
-          padding: '16px 24px',
-          borderTop: '1px solid var(--border-color, #333)',
-          display: 'flex',
-          justifyContent: 'center',
-        }}>
+        <div
+          style={{
+            padding: '16px 24px',
+            borderTop: '1px solid var(--border-color, #333)',
+            display: 'flex',
+            justifyContent: 'center',
+          }}
+        >
           <button
             onClick={handleDismiss}
             style={{
@@ -436,8 +452,8 @@ export default function WhatsNew() {
               cursor: 'pointer',
               transition: 'opacity 0.15s',
             }}
-            onMouseEnter={(e) => e.target.style.opacity = '0.85'}
-            onMouseLeave={(e) => e.target.style.opacity = '1'}
+            onMouseEnter={(e) => (e.target.style.opacity = '0.85')}
+            onMouseLeave={(e) => (e.target.style.opacity = '1')}
           >
             Got it — 73!
           </button>
diff --git a/src/components/index.js b/src/components/index.js
index facc366e..949adb8f 100644
--- a/src/components/index.js
+++ b/src/components/index.js
@@ -30,4 +30,4 @@ export { default as RigControlPanel } from './RigControlPanel.jsx';
 export { default as OnAirPanel } from './OnAirPanel.jsx';
 export { IDTimerPanel } from './IDTimerPanel.jsx';
 export { default as RotatorPanel } from './RotatorPanel.jsx';
-export { default as RotatorMapOverlay } from './RotatorMapOverlay.jsx';
\ No newline at end of file
+export { default as RotatorMapOverlay } from './RotatorMapOverlay.jsx';
diff --git a/src/contexts/DockableLayoutContext.jsx b/src/contexts/DockableLayoutContext.jsx
index dc7998d7..e4346613 100644
--- a/src/contexts/DockableLayoutContext.jsx
+++ b/src/contexts/DockableLayoutContext.jsx
@@ -13,51 +13,61 @@ export const DockableLayoutProvider = ({ model, children }) => {
    * @param {string} nodeId - The tab node ID
    * @param {number} contentHeight - Desired content height in pixels
    */
-  const requestResize = useCallback((nodeId, contentHeight) => {
-    if (!model || !nodeId) return;
-
-    try {
-      const node = model.getNodeById(nodeId);
-      if (!node) return;
-
-      // Find the parent tabset
-      const tabset = node.getParent();
-      if (!tabset) return;
-
-      // Calculate target height with padding for tab header
-      const targetHeight = contentHeight + 60;
-
-      // Set minimum height directly - this forces the panel to be at least this tall
-      model.doAction(Actions.updateNodeAttributes(tabset.getId(), {
-        minHeight: targetHeight
-      }));
-    } catch (err) {
-      console.warn('Panel resize failed:', err);
-    }
-  }, [model]);
+  const requestResize = useCallback(
+    (nodeId, contentHeight) => {
+      if (!model || !nodeId) return;
+
+      try {
+        const node = model.getNodeById(nodeId);
+        if (!node) return;
+
+        // Find the parent tabset
+        const tabset = node.getParent();
+        if (!tabset) return;
+
+        // Calculate target height with padding for tab header
+        const targetHeight = contentHeight + 60;
+
+        // Set minimum height directly - this forces the panel to be at least this tall
+        model.doAction(
+          Actions.updateNodeAttributes(tabset.getId(), {
+            minHeight: targetHeight,
+          }),
+        );
+      } catch (err) {
+        console.warn('Panel resize failed:', err);
+      }
+    },
+    [model],
+  );
 
   /**
    * Reset a panel to its default size
    * @param {string} nodeId - The tab node ID
    */
-  const resetSize = useCallback((nodeId) => {
-    if (!model || !nodeId) return;
-
-    try {
-      const node = model.getNodeById(nodeId);
-      if (!node) return;
-
-      const tabset = node.getParent();
-      if (!tabset) return;
-
-      // Remove the minHeight constraint
-      model.doAction(Actions.updateNodeAttributes(tabset.getId(), {
-        minHeight: 0
-      }));
-    } catch (err) {
-      console.warn('Panel reset failed:', err);
-    }
-  }, [model]);
+  const resetSize = useCallback(
+    (nodeId) => {
+      if (!model || !nodeId) return;
+
+      try {
+        const node = model.getNodeById(nodeId);
+        if (!node) return;
+
+        const tabset = node.getParent();
+        if (!tabset) return;
+
+        // Remove the minHeight constraint
+        model.doAction(
+          Actions.updateNodeAttributes(tabset.getId(), {
+            minHeight: 0,
+          }),
+        );
+      } catch (err) {
+        console.warn('Panel reset failed:', err);
+      }
+    },
+    [model],
+  );
 
   return (
     <DockableLayoutContext.Provider value={{ model, requestResize, resetSize }}>
@@ -73,9 +83,12 @@ export const DockableLayoutProvider = ({ model, children }) => {
 export const usePanelResize = (nodeId) => {
   const context = useContext(DockableLayoutContext);
 
-  const requestResize = useCallback((contentHeight) => {
-    context?.requestResize(nodeId, contentHeight);
-  }, [context, nodeId]);
+  const requestResize = useCallback(
+    (contentHeight) => {
+      context?.requestResize(nodeId, contentHeight);
+    },
+    [context, nodeId],
+  );
 
   const resetSize = useCallback(() => {
     context?.resetSize(nodeId);
diff --git a/src/contexts/RigContext.jsx b/src/contexts/RigContext.jsx
index ce644657..9c4e4815 100644
--- a/src/contexts/RigContext.jsx
+++ b/src/contexts/RigContext.jsx
@@ -1,22 +1,16 @@
-import React, {
-  createContext,
-  useContext,
-  useState,
-  useEffect,
-  useCallback,
-} from "react";
-import { getModeFromFreq, mapModeToRig } from "../utils/bandPlan.js";
+import React, { createContext, useContext, useState, useEffect, useCallback } from 'react';
+import { getModeFromFreq, mapModeToRig } from '../utils/bandPlan.js';
 
 // Default config
 // Default config (fallback)
-const DEFAULT_RIG_URL = "http://localhost:5555";
+const DEFAULT_RIG_URL = 'http://localhost:5555';
 
 const RigContext = createContext(null);
 
 export const useRig = () => {
   const context = useContext(RigContext);
   if (!context) {
-    throw new Error("useRig must be used within a RigProvider");
+    throw new Error('useRig must be used within a RigProvider');
   }
   return context;
 };
@@ -25,7 +19,7 @@ export const RigProvider = ({ children, rigConfig }) => {
   const [rigState, setRigState] = useState({
     connected: false,
     freq: 0,
-    mode: "",
+    mode: '',
     ptt: false,
     width: 0,
     lastUpdate: 0,
@@ -35,9 +29,7 @@ export const RigProvider = ({ children, rigConfig }) => {
 
   // Construct URL from config or default
   const rigUrl =
-    rigConfig && rigConfig.host && rigConfig.port
-      ? `${rigConfig.host}:${rigConfig.port}`
-      : DEFAULT_RIG_URL;
+    rigConfig && rigConfig.host && rigConfig.port ? `${rigConfig.host}:${rigConfig.port}` : DEFAULT_RIG_URL;
 
   // Connect to SSE Stream
   useEffect(() => {
@@ -52,9 +44,7 @@ export const RigProvider = ({ children, rigConfig }) => {
     const connectSSE = () => {
       // Construct URL from config or default
       const rigUrl =
-        rigConfig && rigConfig.host && rigConfig.port
-          ? `${rigConfig.host}:${rigConfig.port}`
-          : DEFAULT_RIG_URL;
+        rigConfig && rigConfig.host && rigConfig.port ? `${rigConfig.host}:${rigConfig.port}` : DEFAULT_RIG_URL;
 
       // console.log('[RigContext] Connecting to SSE stream...', `${rigUrl}/stream`);
       eventSource = new EventSource(`${rigUrl}/stream`);
@@ -68,7 +58,7 @@ export const RigProvider = ({ children, rigConfig }) => {
         try {
           const data = JSON.parse(event.data);
 
-          if (data.type === "init") {
+          if (data.type === 'init') {
             setRigState((prev) => ({
               ...prev,
               connected: data.connected,
@@ -78,7 +68,7 @@ export const RigProvider = ({ children, rigConfig }) => {
               ptt: data.ptt,
               lastUpdate: Date.now(),
             }));
-          } else if (data.type === "update") {
+          } else if (data.type === 'update') {
             setRigState((prev) => ({
               ...prev,
               [data.prop]: data.value,
@@ -86,7 +76,7 @@ export const RigProvider = ({ children, rigConfig }) => {
             }));
           }
         } catch (e) {
-          console.error("[RigContext] Failed to parse SSE message", e);
+          console.error('[RigContext] Failed to parse SSE message', e);
         }
       };
 
@@ -94,7 +84,7 @@ export const RigProvider = ({ children, rigConfig }) => {
         // console.error('[RigContext] SSE Error', err);
         eventSource.close();
         setRigState((prev) => ({ ...prev, connected: false }));
-        setError("Connection lost");
+        setError('Connection lost');
 
         // Retry in 5s
         retryTimeout = setTimeout(connectSSE, 5000);
@@ -115,13 +105,13 @@ export const RigProvider = ({ children, rigConfig }) => {
       if (!rigConfig?.enabled) return;
       try {
         await fetch(`${rigUrl}/freq`, {
-          method: "POST",
-          headers: { "Content-Type": "application/json" },
+          method: 'POST',
+          headers: { 'Content-Type': 'application/json' },
           body: JSON.stringify({ freq, tune: rigConfig.tuneEnabled }),
         });
         // No need to poll, SSE will push update
       } catch (err) {
-        console.error("Failed to set freq:", err);
+        console.error('Failed to set freq:', err);
       }
     },
     [rigUrl, rigConfig],
@@ -133,13 +123,13 @@ export const RigProvider = ({ children, rigConfig }) => {
       if (!rigConfig?.enabled) return;
       try {
         await fetch(`${rigUrl}/mode`, {
-          method: "POST",
-          headers: { "Content-Type": "application/json" },
+          method: 'POST',
+          headers: { 'Content-Type': 'application/json' },
           body: JSON.stringify({ mode }),
         });
         // SSE will push update
       } catch (err) {
-        console.error("Failed to set mode:", err);
+        console.error('Failed to set mode:', err);
       }
     },
     [rigUrl, rigConfig],
@@ -154,13 +144,13 @@ export const RigProvider = ({ children, rigConfig }) => {
 
       try {
         await fetch(`${rigUrl}/ptt`, {
-          method: "POST",
-          headers: { "Content-Type": "application/json" },
+          method: 'POST',
+          headers: { 'Content-Type': 'application/json' },
           body: JSON.stringify({ ptt: enabled }),
         });
         // SSE will push update
       } catch (err) {
-        console.error("Failed to set PTT:", err);
+        console.error('Failed to set PTT:', err);
         // Revert optimistic update?
         // setRigState(prev => ({ ...prev, ptt: !enabled }));
       }
@@ -202,7 +192,7 @@ export const RigProvider = ({ children, rigConfig }) => {
 
       let hz = 0;
       // Handle number
-      if (typeof freqInput === "number") {
+      if (typeof freqInput === 'number') {
         // If small number (< 1000), assume MHz -> Hz
         // If medium number (< 100000), assume kHz -> Hz
         // If large number (> 100000), assume Hz
@@ -211,18 +201,18 @@ export const RigProvider = ({ children, rigConfig }) => {
         else hz = freqInput;
       }
       // Handle string
-      else if (typeof freqInput === "string") {
+      else if (typeof freqInput === 'string') {
         // Remove non-numeric chars except dot
-        const clean = freqInput.replace(/[^\d.]/g, "");
+        const clean = freqInput.replace(/[^\d.]/g, '');
         const val = parseFloat(clean);
         if (isNaN(val)) return;
 
         // Heuristic: If string contains "MHz", treat as MHz
-        if (freqInput.toLowerCase().includes("mhz")) {
+        if (freqInput.toLowerCase().includes('mhz')) {
           hz = val * 1000000;
         }
         // If string contains "kHz", treat as kHz
-        else if (freqInput.toLowerCase().includes("khz")) {
+        else if (freqInput.toLowerCase().includes('khz')) {
           hz = val * 1000;
         }
         // Otherwise use magnitude heuristic
diff --git a/src/hooks/app/useAppConfig.js b/src/hooks/app/useAppConfig.js
index 722d4af3..eac14bcf 100644
--- a/src/hooks/app/useAppConfig.js
+++ b/src/hooks/app/useAppConfig.js
@@ -1,7 +1,15 @@
 'use strict';
 
 import { useState, useEffect } from 'react';
-import { loadConfig, saveConfig, applyTheme, fetchServerConfig, fetchServerSettings, syncAllSettingsToServer, installSettingsSyncInterceptor } from '../../utils';
+import {
+  loadConfig,
+  saveConfig,
+  applyTheme,
+  fetchServerConfig,
+  fetchServerSettings,
+  syncAllSettingsToServer,
+  installSettingsSyncInterceptor,
+} from '../../utils';
 
 export default function useAppConfig() {
   const [config, setConfig] = useState(loadConfig);
@@ -17,14 +25,14 @@ export default function useAppConfig() {
         setShowDxWeather(serverCfg.showDxWeather !== false);
         setClassicAnalogClock(serverCfg.classicAnalogClock === true);
       }
-      
+
       // 2. If server-side settings sync is enabled (self-hosted/Pi), load settings from server
       const syncEnabled = serverCfg?.features?.settingsSync === true;
       if (syncEnabled) {
         const hadServerSettings = await fetchServerSettings();
         // Install interceptor: any future localStorage write to openhamclock_* auto-syncs to server
         installSettingsSyncInterceptor();
-        
+
         // If first device with no server settings, push current state to server
         if (!hadServerSettings) {
           syncAllSettingsToServer();
@@ -63,6 +71,6 @@ export default function useAppConfig() {
     setShowDxWeather,
     classicAnalogClock,
     setClassicAnalogClock,
-    handleSaveConfig
+    handleSaveConfig,
   };
 }
diff --git a/src/hooks/app/useDXLocation.js b/src/hooks/app/useDXLocation.js
index 54df390e..8cdaf86a 100644
--- a/src/hooks/app/useDXLocation.js
+++ b/src/hooks/app/useDXLocation.js
@@ -41,7 +41,7 @@ export default function useDXLocation(defaultDX) {
   }, [dxLocked]);
 
   const handleToggleDxLock = useCallback(() => {
-    setDxLocked(prev => !prev);
+    setDxLocked((prev) => !prev);
   }, []);
 
   const handleDXChange = useCallback((coords) => {
@@ -55,6 +55,6 @@ export default function useDXLocation(defaultDX) {
     setDxLocation,
     dxLocked,
     handleToggleDxLock,
-    handleDXChange
+    handleDXChange,
   };
 }
diff --git a/src/hooks/app/useFilters.js b/src/hooks/app/useFilters.js
index 8a9e340b..dce508e5 100644
--- a/src/hooks/app/useFilters.js
+++ b/src/hooks/app/useFilters.js
@@ -8,7 +8,9 @@ export default function useFilters() {
     try {
       const stored = localStorage.getItem('openhamclock_dxFilters');
       return stored ? JSON.parse(stored) : {};
-    } catch (e) { return {}; }
+    } catch (e) {
+      return {};
+    }
   });
 
   useEffect(() => {
@@ -22,7 +24,9 @@ export default function useFilters() {
     try {
       const stored = localStorage.getItem('openhamclock_pskFilters');
       return stored ? JSON.parse(stored) : {};
-    } catch (e) { return {}; }
+    } catch (e) {
+      return {};
+    }
   });
 
   useEffect(() => {
@@ -36,6 +40,6 @@ export default function useFilters() {
     dxFilters,
     setDxFilters,
     pskFilters,
-    setPskFilters
+    setPskFilters,
   };
 }
diff --git a/src/hooks/app/useFullscreen.js b/src/hooks/app/useFullscreen.js
index 7b193fd6..c00c877c 100644
--- a/src/hooks/app/useFullscreen.js
+++ b/src/hooks/app/useFullscreen.js
@@ -7,9 +7,15 @@ export default function useFullscreen() {
 
   const handleFullscreenToggle = useCallback(() => {
     if (!document.fullscreenElement) {
-      document.documentElement.requestFullscreen().then(() => setIsFullscreen(true)).catch(() => {});
+      document.documentElement
+        .requestFullscreen()
+        .then(() => setIsFullscreen(true))
+        .catch(() => {});
     } else {
-      document.exitFullscreen().then(() => setIsFullscreen(false)).catch(() => {});
+      document
+        .exitFullscreen()
+        .then(() => setIsFullscreen(false))
+        .catch(() => {});
     }
   }, []);
 
diff --git a/src/hooks/app/useMapLayers.js b/src/hooks/app/useMapLayers.js
index 72148e73..352f52b3 100644
--- a/src/hooks/app/useMapLayers.js
+++ b/src/hooks/app/useMapLayers.js
@@ -8,7 +8,7 @@ export default function useMapLayers() {
     showPOTA: true,
     showPOTALabels: true,
     showWWFF: true,
-    showWWFFLabels:true,
+    showWWFFLabels: true,
     showSOTA: true,
     showSOTALabels: true,
     showSatellites: false,
@@ -49,19 +49,37 @@ export default function useMapLayers() {
     } catch {}
   }, [mapLayers]);
 
-  const toggleDXPaths = useCallback(() => setMapLayers(prev => ({ ...prev, showDXPaths: !prev.showDXPaths })), []);
-  const toggleDXLabels = useCallback(() => setMapLayers(prev => ({ ...prev, showDXLabels: !prev.showDXLabels })), []);
-  const togglePOTA = useCallback(() => setMapLayers(prev => ({ ...prev, showPOTA: !prev.showPOTA })), []);
-  const togglePOTALabels = useCallback(() => setMapLayers(prev => ({ ...prev, showPOTALabels: !prev.showPOTALabels })), []);
-  const toggleWWFF = useCallback(() => setMapLayers(prev => ({ ...prev, showWWFF: !prev.showWWFF })), []);
-  const toggleWWFFLabels = useCallback(() => setMapLayers(prev => ({ ...prev, showWWFFLabels: !prev.showWWFFLabels })), []);
-  const toggleSOTA = useCallback(() => setMapLayers(prev => ({ ...prev, showSOTA: !prev.showSOTA })), []);
-  const toggleSOTALabels = useCallback(() => setMapLayers(prev => ({ ...prev, showSOTALabels: !prev.showSOTALabels })), []);
-  const toggleSatellites = useCallback(() => setMapLayers(prev => ({ ...prev, showSatellites: !prev.showSatellites })), []);
-  const togglePSKReporter = useCallback(() => setMapLayers(prev => ({ ...prev, showPSKReporter: !prev.showPSKReporter })), []);
-  const toggleWSJTX = useCallback(() => setMapLayers(prev => ({ ...prev, showWSJTX: !prev.showWSJTX })), []);
-  const toggleDXNews = useCallback(() => setMapLayers(prev => ({ ...prev, showDXNews: !prev.showDXNews })), []);
-  const toggleRotatorBearing = useCallback(() => setMapLayers(prev => ({ ...prev, showRotatorBearing: !prev.showRotatorBearing })), []);
+  const toggleDXPaths = useCallback(() => setMapLayers((prev) => ({ ...prev, showDXPaths: !prev.showDXPaths })), []);
+  const toggleDXLabels = useCallback(() => setMapLayers((prev) => ({ ...prev, showDXLabels: !prev.showDXLabels })), []);
+  const togglePOTA = useCallback(() => setMapLayers((prev) => ({ ...prev, showPOTA: !prev.showPOTA })), []);
+  const togglePOTALabels = useCallback(
+    () => setMapLayers((prev) => ({ ...prev, showPOTALabels: !prev.showPOTALabels })),
+    [],
+  );
+  const toggleWWFF = useCallback(() => setMapLayers((prev) => ({ ...prev, showWWFF: !prev.showWWFF })), []);
+  const toggleWWFFLabels = useCallback(
+    () => setMapLayers((prev) => ({ ...prev, showWWFFLabels: !prev.showWWFFLabels })),
+    [],
+  );
+  const toggleSOTA = useCallback(() => setMapLayers((prev) => ({ ...prev, showSOTA: !prev.showSOTA })), []);
+  const toggleSOTALabels = useCallback(
+    () => setMapLayers((prev) => ({ ...prev, showSOTALabels: !prev.showSOTALabels })),
+    [],
+  );
+  const toggleSatellites = useCallback(
+    () => setMapLayers((prev) => ({ ...prev, showSatellites: !prev.showSatellites })),
+    [],
+  );
+  const togglePSKReporter = useCallback(
+    () => setMapLayers((prev) => ({ ...prev, showPSKReporter: !prev.showPSKReporter })),
+    [],
+  );
+  const toggleWSJTX = useCallback(() => setMapLayers((prev) => ({ ...prev, showWSJTX: !prev.showWSJTX })), []);
+  const toggleDXNews = useCallback(() => setMapLayers((prev) => ({ ...prev, showDXNews: !prev.showDXNews })), []);
+  const toggleRotatorBearing = useCallback(
+    () => setMapLayers((prev) => ({ ...prev, showRotatorBearing: !prev.showRotatorBearing })),
+    [],
+  );
 
   return {
     mapLayers,
diff --git a/src/hooks/app/useSatellitesFilters.js b/src/hooks/app/useSatellitesFilters.js
index aff34367..a93374cf 100644
--- a/src/hooks/app/useSatellitesFilters.js
+++ b/src/hooks/app/useSatellitesFilters.js
@@ -8,7 +8,9 @@ export default function useSatellitesFilters(satellitesData) {
     try {
       const saved = localStorage.getItem('openhamclock_satelliteFilters');
       return saved ? JSON.parse(saved) : [];
-    } catch (e) { return []; }
+    } catch (e) {
+      return [];
+    }
   });
 
   useEffect(() => {
@@ -22,13 +24,13 @@ export default function useSatellitesFilters(satellitesData) {
     // If no satellites are selected in the filter, show NONE (empty array)
     // Only show satellites that are explicitly selected
     return satelliteFilters.length > 0
-      ? (satellitesData || []).filter(sat => satelliteFilters.includes(sat.name))
+      ? (satellitesData || []).filter((sat) => satelliteFilters.includes(sat.name))
       : [];
   }, [satelliteFilters, satellitesData]);
 
   return {
     satelliteFilters,
     setSatelliteFilters,
-    filteredSatellites
+    filteredSatellites,
   };
 }
diff --git a/src/hooks/app/useTimeState.js b/src/hooks/app/useTimeState.js
index 9cb88373..5b34e822 100644
--- a/src/hooks/app/useTimeState.js
+++ b/src/hooks/app/useTimeState.js
@@ -11,7 +11,9 @@ export default function useTimeState(configLocation, dxLocation, timezone) {
   const [use12Hour, setUse12Hour] = useState(() => {
     try {
       return localStorage.getItem('openhamclock_use12Hour') === 'true';
-    } catch (e) { return false; }
+    } catch (e) {
+      return false;
+    }
   });
 
   useEffect(() => {
@@ -20,7 +22,7 @@ export default function useTimeState(configLocation, dxLocation, timezone) {
     } catch (e) {}
   }, [use12Hour]);
 
-  const handleTimeFormatToggle = useCallback(() => setUse12Hour(prev => !prev), []);
+  const handleTimeFormatToggle = useCallback(() => setUse12Hour((prev) => !prev), []);
 
   useEffect(() => {
     let timeout;
@@ -48,8 +50,14 @@ export default function useTimeState(configLocation, dxLocation, timezone) {
 
   const deGrid = useMemo(() => calculateGridSquare(configLocation.lat, configLocation.lon), [configLocation]);
   const dxGrid = useMemo(() => calculateGridSquare(dxLocation.lat, dxLocation.lon), [dxLocation]);
-  const deSunTimes = useMemo(() => calculateSunTimes(configLocation.lat, configLocation.lon, currentTime), [configLocation, currentTime]);
-  const dxSunTimes = useMemo(() => calculateSunTimes(dxLocation.lat, dxLocation.lon, currentTime), [dxLocation, currentTime]);
+  const deSunTimes = useMemo(
+    () => calculateSunTimes(configLocation.lat, configLocation.lon, currentTime),
+    [configLocation, currentTime],
+  );
+  const dxSunTimes = useMemo(
+    () => calculateSunTimes(dxLocation.lat, dxLocation.lon, currentTime),
+    [dxLocation, currentTime],
+  );
 
   const utcTime = currentTime.toISOString().substr(11, 8);
   const utcDate = currentTime.toISOString().substr(0, 10);
@@ -74,6 +82,6 @@ export default function useTimeState(configLocation, dxLocation, timezone) {
     deGrid,
     dxGrid,
     deSunTimes,
-    dxSunTimes
+    dxSunTimes,
   };
 }
diff --git a/src/hooks/app/useVersionCheck.js b/src/hooks/app/useVersionCheck.js
index d7c37f06..68952abf 100644
--- a/src/hooks/app/useVersionCheck.js
+++ b/src/hooks/app/useVersionCheck.js
@@ -55,7 +55,9 @@ export default function useVersionCheck() {
       clearTimeout(initialTimer);
       if (timer) clearInterval(timer);
       if (toastRef.current) {
-        try { document.body.removeChild(toastRef.current); } catch {}
+        try {
+          document.body.removeChild(toastRef.current);
+        } catch {}
       }
     };
   }, []);
@@ -63,7 +65,9 @@ export default function useVersionCheck() {
   function showUpdateToast(oldVer, newVer) {
     // Remove existing toast if any
     if (toastRef.current) {
-      try { document.body.removeChild(toastRef.current); } catch {}
+      try {
+        document.body.removeChild(toastRef.current);
+      } catch {}
     }
 
     const toast = document.createElement('div');
diff --git a/src/hooks/index.js b/src/hooks/index.js
index 70f4d22b..7ea76a8f 100644
--- a/src/hooks/index.js
+++ b/src/hooks/index.js
@@ -22,4 +22,4 @@ export { usePSKReporter } from './usePSKReporter.js';
 export { useWSJTX } from './useWSJTX.js';
 export { useAmbientWeather } from './useAmbientWeather.js';
 export { useBandHealth } from './useBandHealth.js';
-export { default as useRotator } from './useRotator.js';
\ No newline at end of file
+export { default as useRotator } from './useRotator.js';
diff --git a/src/hooks/useAmbientWeather.js b/src/hooks/useAmbientWeather.js
index e010d426..490d630f 100644
--- a/src/hooks/useAmbientWeather.js
+++ b/src/hooks/useAmbientWeather.js
@@ -15,14 +15,14 @@
 import { useEffect, useMemo, useState } from 'react';
 
 // --- unit conversion helpers (raw base is US) ---
-const fToC = (f) => (f - 32) * 5 / 9;
+const fToC = (f) => ((f - 32) * 5) / 9;
 const mphToKmh = (mph) => mph * 1.609344;
 const inToMm = (inch) => inch * 25.4;
 const inHgToHpa = (inHg) => inHg * 33.8638866667;
 
 function windDirection(deg) {
   if (deg == null) return '';
-  const dirs = ['N','NNE','NE','ENE','E','ESE','SE','SSE','S','SSW','SW','WSW','W','WNW','NW','NNW'];
+  const dirs = ['N', 'NNE', 'NE', 'ENE', 'E', 'ESE', 'SE', 'SSE', 'S', 'SSW', 'SW', 'WSW', 'W', 'WNW', 'NW', 'NNW'];
   return dirs[Math.round(deg / 22.5) % 16];
 }
 
@@ -63,10 +63,10 @@ export const useAmbientWeather = (tempUnit = 'F') => {
 
   useEffect(() => {
     if (!apiKey || !appKey) {
-	  setLoading(false);
-	  setError({ code: "missing_credentials", message: "Ambient keys not configured" });
-	  return;
-	}
+      setLoading(false);
+      setError({ code: 'missing_credentials', message: 'Ambient keys not configured' });
+      return;
+    }
 
     let mounted = true;
 
@@ -81,13 +81,13 @@ export const useAmbientWeather = (tempUnit = 'F') => {
         const json = await resp.json();
 
         // Ambient may return an array; be defensive if a single object is returned.
-        const devices = Array.isArray(json) ? json : (json ? [json] : []);
+        const devices = Array.isArray(json) ? json : json ? [json] : [];
 
         if (devices.length === 0) throw new Error('No devices returned');
 
         let chosen = devices[0];
         if (deviceMac) {
-          const match = devices.find(d => String(d.macAddress || '').toLowerCase() === deviceMac);
+          const match = devices.find((d) => String(d.macAddress || '').toLowerCase() === deviceMac);
           if (match) chosen = match;
         }
 
@@ -96,7 +96,7 @@ export const useAmbientWeather = (tempUnit = 'F') => {
 
         if (mounted) setRawDevice(chosen);
       } catch (e) {
-	   if (mounted) setError({ code: "fetch_error", message: e?.message || "Ambient fetch error" });
+        if (mounted) setError({ code: 'fetch_error', message: e?.message || 'Ambient fetch error' });
       } finally {
         if (mounted) setLoading(false);
       }
@@ -140,15 +140,15 @@ export const useAmbientWeather = (tempUnit = 'F') => {
     const convPressure = (inHg) => {
       const n = safeNum(inHg);
       if (n == null) return null;
-      return isMetric ? (inHgToHpa(n)).toFixed(1) : n.toFixed(3);
+      return isMetric ? inHgToHpa(n).toFixed(1) : n.toFixed(3);
     };
 
     return {
-	  lastUpdated: updatedAtMs ? new Date(updatedAtMs).toISOString() : null,
+      lastUpdated: updatedAtMs ? new Date(updatedAtMs).toISOString() : null,
 
-	  // common aliases for UI
-	  barometer: convPressure(ld.baromrelin ?? ld.baromabsin),
-	  rainRate: convRain(ld.rainratein),  // may be undefined on some stations -> null	
+      // common aliases for UI
+      barometer: convPressure(ld.baromrelin ?? ld.baromabsin),
+      rainRate: convRain(ld.rainratein), // may be undefined on some stations -> null
       // meta
       name: rawDevice.info?.name || 'Ambient Station',
       macAddress: rawDevice.macAddress, // consider not using in UI
diff --git a/src/hooks/useBandConditions.js b/src/hooks/useBandConditions.js
index 1b400ada..e9c45019 100644
--- a/src/hooks/useBandConditions.js
+++ b/src/hooks/useBandConditions.js
@@ -12,7 +12,7 @@ const BAND_RANGE_MAP = {
   '80m-40m': ['80m', '60m', '40m'],
   '30m-20m': ['30m', '20m'],
   '17m-15m': ['17m', '15m'],
-  '12m-10m': ['12m', '10m']
+  '12m-10m': ['12m', '10m'],
 };
 
 // Normalize condition strings from N0NBH (they use title case)
@@ -37,44 +37,46 @@ export const useBandConditions = () => {
         if (!response) return; // backed off
         if (!response.ok) throw new Error(`N0NBH API error: ${response.status}`);
         const n0nbh = await response.json();
-        
+
         // Build lookup: { 'day': { '80m-40m': 'Good', ... }, 'night': { ... } }
         const conditionMap = { day: {}, night: {} };
-        for (const bc of (n0nbh.bandConditions || [])) {
+        for (const bc of n0nbh.bandConditions || []) {
           conditionMap[bc.time] = conditionMap[bc.time] || {};
           conditionMap[bc.time][bc.name] = normalizeCondition(bc.condition);
         }
-        
+
         // Determine if it's currently day or night (UTC-based, simplified)
         const hour = new Date().getUTCHours();
         const isDaytime = hour >= 6 && hour <= 18;
         const currentTime = isDaytime ? 'day' : 'night';
-        
+
         // Expand grouped ranges into individual bands with day and night conditions
         const bands = [];
         for (const [range, individualBands] of Object.entries(BAND_RANGE_MAP)) {
           const dayCondition = conditionMap.day?.[range] || 'FAIR';
           const nightCondition = conditionMap.night?.[range] || 'FAIR';
-          
+
           for (const band of individualBands) {
             bands.push({
               band,
               condition: currentTime === 'day' ? dayCondition : nightCondition,
               day: dayCondition,
-              night: nightCondition
+              night: nightCondition,
             });
           }
         }
-        
+
         setData(bands);
-        
+
         // VHF conditions
-        setVhfConditions((n0nbh.vhfConditions || []).map(v => ({
-          name: v.name,
-          location: v.location,
-          condition: v.condition
-        })));
-        
+        setVhfConditions(
+          (n0nbh.vhfConditions || []).map((v) => ({
+            name: v.name,
+            location: v.location,
+            condition: v.condition,
+          })),
+        );
+
         // Extra solar/geomag data from N0NBH
         setExtras({
           aIndex: n0nbh.solarData?.aIndex,
@@ -91,9 +93,8 @@ export const useBandConditions = () => {
           signalNoise: n0nbh.signalNoise,
           muf: n0nbh.solarData?.muf,
           updated: n0nbh.updated,
-          source: 'N0NBH'
+          source: 'N0NBH',
         });
-        
       } catch (err) {
         console.error('[BandConditions] N0NBH fetch error:', err);
       } finally {
diff --git a/src/hooks/useBandHealth.js b/src/hooks/useBandHealth.js
index 34f6874e..8263e8b9 100644
--- a/src/hooks/useBandHealth.js
+++ b/src/hooks/useBandHealth.js
@@ -8,12 +8,10 @@
  * Input is an array of DX cluster spots (from useDXClusterData().spots).
  */
 
-import { useMemo } from "react";
-import { getBandFromFreq, detectMode } from "../utils/callsign.js";
+import { useMemo } from 'react';
+import { getBandFromFreq, detectMode } from '../utils/callsign.js';
 
-const DEFAULT_BANDS = [
-  "160m","80m","60m","40m","30m","20m","17m","15m","12m","10m","6m","2m","70cm"
-];
+const DEFAULT_BANDS = ['160m', '80m', '60m', '40m', '30m', '20m', '17m', '15m', '12m', '10m', '6m', '2m', '70cm'];
 
 const clamp = (n, min, max) => Math.max(min, Math.min(max, n));
 
@@ -25,8 +23,8 @@ const clamp = (n, min, max) => Math.max(min, Math.min(max, n));
 // - Be conservative and explainable.
 // - Provide a confidence value for potential weighting.
 
-const CONF_HIGH = "high";
-const CONF_MED = "medium";
+const CONF_HIGH = 'high';
+const CONF_MED = 'medium';
 
 function freqToMHz(rawFreq) {
   const f = parseFloat(rawFreq);
@@ -40,23 +38,23 @@ function freqToMHz(rawFreq) {
 const ISLAND_TOL_MHZ = 0.003; // ~3 kHz
 const ISLANDS = [
   // FT8
-  { mhz: 3.573,  mode: "FT8" },
-  { mhz: 7.074,  mode: "FT8" },
-  { mhz: 10.136, mode: "FT8" },
-  { mhz: 14.074, mode: "FT8" },
-  { mhz: 18.100, mode: "FT8" },
-  { mhz: 21.074, mode: "FT8" },
-  { mhz: 24.915, mode: "FT8" },
-  { mhz: 28.074, mode: "FT8" },
+  { mhz: 3.573, mode: 'FT8' },
+  { mhz: 7.074, mode: 'FT8' },
+  { mhz: 10.136, mode: 'FT8' },
+  { mhz: 14.074, mode: 'FT8' },
+  { mhz: 18.1, mode: 'FT8' },
+  { mhz: 21.074, mode: 'FT8' },
+  { mhz: 24.915, mode: 'FT8' },
+  { mhz: 28.074, mode: 'FT8' },
   // FT4
-  { mhz: 3.575,  mode: "FT4" },
-  { mhz: 7.0475, mode: "FT4" },
-  { mhz: 10.140, mode: "FT4" },
-  { mhz: 14.080, mode: "FT4" },
-  { mhz: 18.104, mode: "FT4" },
-  { mhz: 21.080, mode: "FT4" },
-  { mhz: 24.919, mode: "FT4" },
-  { mhz: 28.080, mode: "FT4" },
+  { mhz: 3.575, mode: 'FT4' },
+  { mhz: 7.0475, mode: 'FT4' },
+  { mhz: 10.14, mode: 'FT4' },
+  { mhz: 14.08, mode: 'FT4' },
+  { mhz: 18.104, mode: 'FT4' },
+  { mhz: 21.08, mode: 'FT4' },
+  { mhz: 24.919, mode: 'FT4' },
+  { mhz: 28.08, mode: 'FT4' },
 ];
 
 function inferModeFromFrequency(rawFreq) {
@@ -66,7 +64,7 @@ function inferModeFromFrequency(rawFreq) {
   // 1) High-confidence islands
   for (const isl of ISLANDS) {
     if (Math.abs(mhz - isl.mhz) <= ISLAND_TOL_MHZ) {
-      return { mode: isl.mode, confidence: CONF_HIGH, inferredBy: "band-plan" };
+      return { mode: isl.mode, confidence: CONF_HIGH, inferredBy: 'band-plan' };
     }
   }
 
@@ -75,51 +73,51 @@ function inferModeFromFrequency(rawFreq) {
   if (!band) return null;
 
   switch (band) {
-    case "160m":
-      if (mhz >= 1.8 && mhz < 1.84) return { mode: "CW", confidence: CONF_MED, inferredBy: "band-plan" };
-      if (mhz >= 1.84 && mhz <= 2.0) return { mode: "SSB", confidence: CONF_MED, inferredBy: "band-plan" };
+    case '160m':
+      if (mhz >= 1.8 && mhz < 1.84) return { mode: 'CW', confidence: CONF_MED, inferredBy: 'band-plan' };
+      if (mhz >= 1.84 && mhz <= 2.0) return { mode: 'SSB', confidence: CONF_MED, inferredBy: 'band-plan' };
       return null;
 
-    case "80m":
-      if (mhz >= 3.5 && mhz < 3.6) return { mode: "CW", confidence: CONF_MED, inferredBy: "band-plan" };
-      if (mhz >= 3.6 && mhz <= 4.0) return { mode: "SSB", confidence: CONF_MED, inferredBy: "band-plan" };
+    case '80m':
+      if (mhz >= 3.5 && mhz < 3.6) return { mode: 'CW', confidence: CONF_MED, inferredBy: 'band-plan' };
+      if (mhz >= 3.6 && mhz <= 4.0) return { mode: 'SSB', confidence: CONF_MED, inferredBy: 'band-plan' };
       return null;
 
-    case "40m":
-      if (mhz >= 7.0 && mhz < 7.05) return { mode: "CW", confidence: CONF_MED, inferredBy: "band-plan" };
-      if (mhz >= 7.05 && mhz <= 7.3) return { mode: "SSB", confidence: CONF_MED, inferredBy: "band-plan" };
+    case '40m':
+      if (mhz >= 7.0 && mhz < 7.05) return { mode: 'CW', confidence: CONF_MED, inferredBy: 'band-plan' };
+      if (mhz >= 7.05 && mhz <= 7.3) return { mode: 'SSB', confidence: CONF_MED, inferredBy: 'band-plan' };
       return null;
 
-    case "30m":
+    case '30m':
       // 30m is mixed CW/digital; only islands are high-confidence.
-      if (mhz >= 10.1 && mhz <= 10.15) return { mode: "CW", confidence: CONF_MED, inferredBy: "band-plan" };
+      if (mhz >= 10.1 && mhz <= 10.15) return { mode: 'CW', confidence: CONF_MED, inferredBy: 'band-plan' };
       return null;
 
-    case "20m":
-      if (mhz >= 14.0 && mhz < 14.07) return { mode: "CW", confidence: CONF_MED, inferredBy: "band-plan" };
-      if (mhz >= 14.07 && mhz <= 14.35) return { mode: "SSB", confidence: CONF_MED, inferredBy: "band-plan" };
+    case '20m':
+      if (mhz >= 14.0 && mhz < 14.07) return { mode: 'CW', confidence: CONF_MED, inferredBy: 'band-plan' };
+      if (mhz >= 14.07 && mhz <= 14.35) return { mode: 'SSB', confidence: CONF_MED, inferredBy: 'band-plan' };
       return null;
 
-    case "17m":
-      if (mhz >= 18.068 && mhz < 18.095) return { mode: "CW", confidence: CONF_MED, inferredBy: "band-plan" };
-      if (mhz >= 18.11 && mhz <= 18.168) return { mode: "SSB", confidence: CONF_MED, inferredBy: "band-plan" };
+    case '17m':
+      if (mhz >= 18.068 && mhz < 18.095) return { mode: 'CW', confidence: CONF_MED, inferredBy: 'band-plan' };
+      if (mhz >= 18.11 && mhz <= 18.168) return { mode: 'SSB', confidence: CONF_MED, inferredBy: 'band-plan' };
       // 18.095–18.110 is intentionally left ambiguous (digital/other)
       return null;
 
-    case "15m":
-      if (mhz >= 21.0 && mhz < 21.07) return { mode: "CW", confidence: CONF_MED, inferredBy: "band-plan" };
-      if (mhz >= 21.07 && mhz <= 21.45) return { mode: "SSB", confidence: CONF_MED, inferredBy: "band-plan" };
+    case '15m':
+      if (mhz >= 21.0 && mhz < 21.07) return { mode: 'CW', confidence: CONF_MED, inferredBy: 'band-plan' };
+      if (mhz >= 21.07 && mhz <= 21.45) return { mode: 'SSB', confidence: CONF_MED, inferredBy: 'band-plan' };
       return null;
 
-    case "12m":
-      if (mhz >= 24.89 && mhz < 24.915) return { mode: "CW", confidence: CONF_MED, inferredBy: "band-plan" };
-      if (mhz >= 24.93 && mhz <= 24.99) return { mode: "SSB", confidence: CONF_MED, inferredBy: "band-plan" };
+    case '12m':
+      if (mhz >= 24.89 && mhz < 24.915) return { mode: 'CW', confidence: CONF_MED, inferredBy: 'band-plan' };
+      if (mhz >= 24.93 && mhz <= 24.99) return { mode: 'SSB', confidence: CONF_MED, inferredBy: 'band-plan' };
       // 24.915–24.93 left ambiguous
       return null;
 
-    case "10m":
-      if (mhz >= 28.0 && mhz < 28.07) return { mode: "CW", confidence: CONF_MED, inferredBy: "band-plan" };
-      if (mhz >= 28.3 && mhz <= 29.7) return { mode: "SSB", confidence: CONF_MED, inferredBy: "band-plan" };
+    case '10m':
+      if (mhz >= 28.0 && mhz < 28.07) return { mode: 'CW', confidence: CONF_MED, inferredBy: 'band-plan' };
+      if (mhz >= 28.3 && mhz <= 29.7) return { mode: 'SSB', confidence: CONF_MED, inferredBy: 'band-plan' };
       // 28.07–28.3 left ambiguous (digital/other)
       return null;
 
@@ -137,7 +135,7 @@ function inferModeFromFrequency(rawFreq) {
  */
 export function classifySpotMode(spot) {
   const explicit = normalizeMode(detectMode(spot?.comment) || null);
-  if (explicit && explicit !== "ALL") {
+  if (explicit && explicit !== 'ALL') {
     return { mode: explicit, inferred: false, confidence: null, inferredBy: null };
   }
 
@@ -150,9 +148,9 @@ export function classifySpotMode(spot) {
 }
 
 function normalizeMode(mode) {
-  if (!mode) return "ALL";
+  if (!mode) return 'ALL';
   const m = String(mode).toUpperCase();
-  return m === "ALL" ? "ALL" : m;
+  return m === 'ALL' ? 'ALL' : m;
 }
 
 function scoreToLevel(baseLevel, { diversity, trend }) {
@@ -164,27 +162,27 @@ function scoreToLevel(baseLevel, { diversity, trend }) {
   if (diversity < 0.35 && baseLevel >= 2) level -= 1;
 
   // Trend nudges one step
-  if (trend === "rising") level += 1;
-  if (trend === "falling") level -= 1;
+  if (trend === 'rising') level += 1;
+  if (trend === 'falling') level -= 1;
 
   return clamp(level, 0, 4);
 }
 
 // level 0..4
 const LEVELS = [
-  { key: "closed",    label: "CLOSED"    },
-  { key: "quiet",     label: "QUIET"     },
-  { key: "usable",    label: "USABLE"    },
-  { key: "good",      label: "GOOD"      },
-  { key: "excellent", label: "EXCELLENT" },
+  { key: 'closed', label: 'CLOSED' },
+  { key: 'quiet', label: 'QUIET' },
+  { key: 'usable', label: 'USABLE' },
+  { key: 'good', label: 'GOOD' },
+  { key: 'excellent', label: 'EXCELLENT' },
 ];
 
 function baseLevelFromCount(spots) {
-  if (spots <= 0) return 0;     // closed
-  if (spots < 5)  return 1;     // quiet
-  if (spots < 15) return 2;     // usable
-  if (spots < 40) return 3;     // good
-  return 4;                     // excellent
+  if (spots <= 0) return 0; // closed
+  if (spots < 5) return 1; // quiet
+  if (spots < 15) return 2; // usable
+  if (spots < 40) return 3; // good
+  return 4; // excellent
 }
 
 function computeTrend(spots, now, windowMs) {
@@ -198,19 +196,15 @@ function computeTrend(spots, now, windowMs) {
     else newer++;
   }
 
-  if (older === 0 && newer === 0) return "steady";
+  if (older === 0 && newer === 0) return 'steady';
   // Rising if second half is 25%+ higher, falling if 25%+ lower
-  if (newer > older * 1.25) return "rising";
-  if (older > newer * 1.25) return "falling";
-  return "steady";
+  if (newer > older * 1.25) return 'rising';
+  if (older > newer * 1.25) return 'falling';
+  return 'steady';
 }
 
 export function useBandHealth(dxSpots = [], options = {}) {
-  const {
-    mode = "ALL",
-    windowMinutes = 15,
-    bands = DEFAULT_BANDS
-  } = options;
+  const { mode = 'ALL', windowMinutes = 15, bands = DEFAULT_BANDS } = options;
 
   return useMemo(() => {
     const now = Date.now();
@@ -227,7 +221,7 @@ export function useBandHealth(dxSpots = [], options = {}) {
       const ts = s?.timestamp || now;
       if (ts < cutoff) continue;
 
-      if (desiredMode === "ALL") {
+      if (desiredMode === 'ALL') {
         filtered.push({ spot: s, weight: 1, inferred: false });
         continue;
       }
@@ -258,7 +252,7 @@ export function useBandHealth(dxSpots = [], options = {}) {
     }
 
     // Build result for each band (always include all bands, even if 0)
-    const results = bands.map(band => {
+    const results = bands.map((band) => {
       const items = byBand.get(band) || [];
       const rawCount = items.length;
 
@@ -294,7 +288,7 @@ export function useBandHealth(dxSpots = [], options = {}) {
         trend,
         level,
         activity: LEVELS[level].key,
-        label: LEVELS[level].label
+        label: LEVELS[level].label,
       };
     });
 
@@ -302,7 +296,7 @@ export function useBandHealth(dxSpots = [], options = {}) {
       updatedAt: now,
       mode: desiredMode,
       windowMinutes: Math.round(windowMs / 60000),
-      bands: results
+      bands: results,
     };
   }, [dxSpots, mode, windowMinutes, bands]);
 }
diff --git a/src/hooks/useDXCluster.js b/src/hooks/useDXCluster.js
index 5b8076f1..d04d1ee7 100644
--- a/src/hooks/useDXCluster.js
+++ b/src/hooks/useDXCluster.js
@@ -4,14 +4,14 @@
  */
 import { useState, useEffect, useCallback } from 'react';
 
-import {applyDXFilters} from "../utils/dxClusterFilters";
+import { applyDXFilters } from '../utils/dxClusterFilters';
 
 export const useDXCluster = (source = 'auto', filters = {}) => {
   const [allSpots, setAllSpots] = useState([]); // All accumulated spots
   const [data, setData] = useState([]); // Filtered spots for display
   const [loading, setLoading] = useState(true);
   const [activeSource, setActiveSource] = useState('');
-  
+
   // Get retention time from filters, default to 30 minutes
   const spotRetentionMs = (filters?.spotRetentionMinutes || 30) * 60 * 1000;
   const pollInterval = 60000; // 60 seconds - reduced from 30s to save bandwidth
@@ -19,7 +19,7 @@ export const useDXCluster = (source = 'auto', filters = {}) => {
   // Apply filters to spots using the consolidated filter function
   const applyFilters = useCallback((spots, filters) => {
     if (!filters || Object.keys(filters).length === 0) return spots;
-    return spots.filter(spot => applyDXFilters(spot, filters));
+    return spots.filter((spot) => applyDXFilters(spot, filters));
   }, []);
 
   useEffect(() => {
@@ -28,30 +28,27 @@ export const useDXCluster = (source = 'auto', filters = {}) => {
         const response = await fetch(`/api/dxcluster/spots?source=${encodeURIComponent(source)}`);
         if (response.ok) {
           const newSpots = await response.json();
-          
-          setAllSpots(prev => {
+
+          setAllSpots((prev) => {
             const now = Date.now();
             // Create map of existing spots by unique key
-            const existingMap = new Map(
-              prev.map(s => [`${s.call}-${s.freq}-${s.spotter}`, s])
-            );
-            
+            const existingMap = new Map(prev.map((s) => [`${s.call}-${s.freq}-${s.spotter}`, s]));
+
             // Add or update with new spots
-            newSpots.forEach(spot => {
+            newSpots.forEach((spot) => {
               const key = `${spot.call}-${spot.freq}-${spot.spotter}`;
               existingMap.set(key, { ...spot, timestamp: now });
             });
-            
+
             // Filter out spots older than retention time
-            const validSpots = Array.from(existingMap.values())
-              .filter(s => (now - (s.timestamp || now)) < spotRetentionMs);
-            
+            const validSpots = Array.from(existingMap.values()).filter(
+              (s) => now - (s.timestamp || now) < spotRetentionMs,
+            );
+
             // Sort by timestamp (newest first) and limit
-            return validSpots
-              .sort((a, b) => (b.timestamp || 0) - (a.timestamp || 0))
-              .slice(0, 200);
+            return validSpots.sort((a, b) => (b.timestamp || 0) - (a.timestamp || 0)).slice(0, 200);
           });
-          
+
           setActiveSource('dxcluster');
         }
       } catch (err) {
@@ -68,9 +65,9 @@ export const useDXCluster = (source = 'auto', filters = {}) => {
 
   // Clean up spots immediately when retention time changes
   useEffect(() => {
-    setAllSpots(prev => {
+    setAllSpots((prev) => {
       const now = Date.now();
-      return prev.filter(s => (now - (s.timestamp || now)) < spotRetentionMs);
+      return prev.filter((s) => now - (s.timestamp || now) < spotRetentionMs);
     });
   }, [spotRetentionMs]);
 
diff --git a/src/hooks/useDXClusterData.js b/src/hooks/useDXClusterData.js
index 4172608d..76229ea2 100644
--- a/src/hooks/useDXClusterData.js
+++ b/src/hooks/useDXClusterData.js
@@ -5,29 +5,29 @@
  */
 import { useState, useEffect, useCallback, useRef } from 'react';
 
-import {applyDXFilters} from "../utils/dxClusterFilters";
+import { applyDXFilters } from '../utils/dxClusterFilters';
 import { useVisibilityRefresh } from './useVisibilityRefresh';
 import { apiFetch } from '../utils/apiFetch';
 
 export const useDXClusterData = (filters = {}, config = {}) => {
   const [allData, setAllData] = useState([]);
-  const [spots, setSpots] = useState([]);     // For list display
-  const [paths, setPaths] = useState([]);     // For map display
+  const [spots, setSpots] = useState([]); // For list display
+  const [paths, setPaths] = useState([]); // For map display
   const [loading, setLoading] = useState(true);
   const lastFetchRef = useRef(0);
   const fetchRef = useRef(null);
-  
+
   const spotRetentionMs = (filters?.spotRetentionMinutes || 30) * 60 * 1000;
   const pollInterval = config.lowMemoryMode ? 120000 : 60000; // 120s in low memory, 60s otherwise
 
   // Build query params for custom cluster settings
   const buildQueryParams = useCallback(() => {
     const params = new URLSearchParams();
-    
+
     // Add source
     const source = config.dxClusterSource || 'dxspider-proxy';
     params.append('source', source);
-    
+
     // Add custom cluster settings if using custom source
     if (source === 'custom' && config.customDxCluster) {
       if (config.customDxCluster.host) {
@@ -37,19 +37,19 @@ export const useDXClusterData = (filters = {}, config = {}) => {
         params.append('port', config.customDxCluster.port);
       }
     }
-    
+
     // Always send callsign for login (with SSID)
     if (config.callsign && config.callsign !== 'N0CALL') {
       params.append('callsign', config.callsign);
     }
-    
+
     return params.toString();
   }, [config.dxClusterSource, config.customDxCluster, config.callsign]);
 
   // Apply filters using the consolidated filter function from callsign.js
   const applyFilters = useCallback((data, filters) => {
     if (!filters || Object.keys(filters).length === 0) return data;
-    return data.filter(item => applyDXFilters(item, filters));
+    return data.filter((item) => applyDXFilters(item, filters));
   }, []);
 
   // Fetch data from unified paths endpoint (has all the data we need)
@@ -61,29 +61,26 @@ export const useDXClusterData = (filters = {}, config = {}) => {
         if (response?.ok) {
           const newData = await response.json();
           const now = Date.now();
-          
-          setAllData(prev => {
+
+          setAllData((prev) => {
             // Create map of existing items by unique key
-            const existingMap = new Map(
-              prev.map(item => [`${item.dxCall}-${item.freq}-${item.spotter}`, item])
-            );
-            
+            const existingMap = new Map(prev.map((item) => [`${item.dxCall}-${item.freq}-${item.spotter}`, item]));
+
             // Add or update with new data
-            newData.forEach(item => {
+            newData.forEach((item) => {
               const key = `${item.dxCall}-${item.freq}-${item.spotter}`;
               existingMap.set(key, { ...item, timestamp: item.timestamp || now });
             });
-            
+
             // Filter out items older than retention time
-            const validItems = Array.from(existingMap.values())
-              .filter(item => (now - (item.timestamp || now)) < spotRetentionMs);
-            
+            const validItems = Array.from(existingMap.values()).filter(
+              (item) => now - (item.timestamp || now) < spotRetentionMs,
+            );
+
             // Sort by timestamp (newest first) and limit
-            return validItems
-              .sort((a, b) => (b.timestamp || 0) - (a.timestamp || 0))
-              .slice(0, 200);
+            return validItems.sort((a, b) => (b.timestamp || 0) - (a.timestamp || 0)).slice(0, 200);
           });
-          
+
           lastFetchRef.current = now;
         }
       } catch (err) {
@@ -104,48 +101,47 @@ export const useDXClusterData = (filters = {}, config = {}) => {
 
   // Clean up data when retention time changes
   useEffect(() => {
-    setAllData(prev => {
+    setAllData((prev) => {
       const now = Date.now();
-      return prev.filter(item => (now - (item.timestamp || now)) < spotRetentionMs);
+      return prev.filter((item) => now - (item.timestamp || now) < spotRetentionMs);
     });
   }, [spotRetentionMs]);
 
   // Apply filters and split into spots (for list) and paths (for map)
   useEffect(() => {
     const filtered = applyFilters(allData, filters);
-    
+
     // Low memory mode limits
     const lowMemoryMode = config.lowMemoryMode || false;
     const MAX_SPOTS = lowMemoryMode ? 50 : 500;
     const MAX_PATHS = lowMemoryMode ? 25 : 200;
-    
+
     // Format for list display (matches old useDXCluster format)
-    const spotList = filtered.slice(0, MAX_SPOTS).map(item => ({
+    const spotList = filtered.slice(0, MAX_SPOTS).map((item) => ({
       call: item.dxCall,
       freq: item.freq,
       comment: item.comment || '',
       time: item.time || '',
       spotter: item.spotter,
       source: 'DXCluster',
-      timestamp: item.timestamp
+      timestamp: item.timestamp,
     }));
-    
+
     // Format for map display (matches old useDXPaths format)
     // Only include items that have valid coordinates
-    const pathList = filtered.filter(item => 
-      item.spotterLat != null && item.spotterLon != null &&
-      item.dxLat != null && item.dxLon != null
-    ).slice(0, MAX_PATHS);
-    
+    const pathList = filtered
+      .filter((item) => item.spotterLat != null && item.spotterLon != null && item.dxLat != null && item.dxLon != null)
+      .slice(0, MAX_PATHS);
+
     setSpots(spotList);
     setPaths(pathList);
   }, [allData, filters, applyFilters, config.lowMemoryMode]);
 
-  return { 
-    spots,           // For DXClusterPanel list
-    paths,           // For WorldMap
-    loading, 
-    totalSpots: allData.length 
+  return {
+    spots, // For DXClusterPanel list
+    paths, // For WorldMap
+    loading,
+    totalSpots: allData.length,
   };
 };
 
diff --git a/src/hooks/usePOTASpots.js b/src/hooks/usePOTASpots.js
index 6cc8103c..efe6707a 100644
--- a/src/hooks/usePOTASpots.js
+++ b/src/hooks/usePOTASpots.js
@@ -22,8 +22,8 @@ function gridToLatLon(grid) {
   if (grid.length >= 6) {
     const lonSec = (g.charCodeAt(4) - 65) * (2 / 24);
     const latSec = (g.charCodeAt(5) - 65) * (1 / 24);
-    finalLon = lon + lonMin + lonSec + (1 / 24);
-    finalLat = lat + latMin + latSec + (0.5 / 24);
+    finalLon = lon + lonMin + lonSec + 1 / 24;
+    finalLat = lat + latMin + latSec + 0.5 / 24;
   }
 
   return { lat: finalLat, lon: finalLon };
@@ -46,15 +46,19 @@ export const usePOTASpots = () => {
         if (res?.ok) {
           const spots = await res.json();
           console.log(`[POTA] Fetched ${Array.isArray(spots) ? spots.length : 0} spots`);
-          
+
           // Log newest spot time for staleness debugging
           let newestTime = null;
           if (Array.isArray(spots) && spots.length > 0) {
-            const times = spots.map(s => s.spotTime).filter(Boolean).sort().reverse();
+            const times = spots
+              .map((s) => s.spotTime)
+              .filter(Boolean)
+              .sort()
+              .reverse();
             newestTime = times[0] || null;
             if (newestTime) console.log(`[POTA] Newest spot: ${newestTime}`);
           }
-          
+
           // Only mark as "updated" when data content actually changes
           // (POTA API may return same stale spots for extended periods)
           if (newestTime !== lastNewestSpotRef.current || lastNewestSpotRef.current === null) {
@@ -64,7 +68,7 @@ export const usePOTASpots = () => {
 
           // Filter out QRT spots and nearly-expired spots, then sort by most recent
           const validSpots = spots
-            .filter(s => {
+            .filter((s) => {
               // Filter out QRT (operator signed off)
               const comments = (s.comments || '').toUpperCase().trim();
               if (comments === 'QRT' || comments.startsWith('QRT ') || comments.startsWith('QRT,')) return false;
@@ -88,45 +92,54 @@ export const usePOTASpots = () => {
               return timeB - timeA;
             });
 
-          setData(validSpots.map(s => {
-            // Use API coordinates, fall back to grid square
-            let lat = s.latitude ? parseFloat(s.latitude) : null;
-            let lon = s.longitude ? parseFloat(s.longitude) : null;
-
-            if ((!lat || !lon) && s.grid6) {
-              const loc = gridToLatLon(s.grid6);
-              if (loc) { lat = loc.lat; lon = loc.lon; }
-            }
-            if ((!lat || !lon) && s.grid4) {
-              const loc = gridToLatLon(s.grid4);
-              if (loc) { lat = loc.lat; lon = loc.lon; }
-            }
-
-
-            // POTA API returns frequency in kHz as a string (e.g., "7160" or "433240")
-            // Convert to MHz for consistency with SOTA and proper rig control
-            const freqKhz = parseFloat(s.frequency);
-            const freqMhz = !isNaN(freqKhz) ? freqKhz / 1000 : null;
-
-            return {
-              call: s.activator,
-              ref: s.reference,
-              freq: freqMhz ? freqMhz.toString() : s.frequency, // Convert to MHz string
-              mode: s.mode,
-              name: s.name || s.locationDesc,
-              locationDesc: s.locationDesc,
-              lat,
-              lon,
-              // POTA API returns UTC timestamps without 'Z' suffix, violating ISO 8601
-              // JavaScript interprets timestamps without timezone as local time
-              // Defensively append 'Z' if not present to force UTC interpretation
-              time: s.spotTime ? (() => {
-                const ts = s.spotTime.endsWith('Z') || s.spotTime.endsWith('z') ? s.spotTime : s.spotTime + 'Z';
-                return new Date(ts).toISOString().substr(11, 5) + 'z';
-              })() : '',
-              expire: s.expire || 0
-            };
-          }));
+          setData(
+            validSpots.map((s) => {
+              // Use API coordinates, fall back to grid square
+              let lat = s.latitude ? parseFloat(s.latitude) : null;
+              let lon = s.longitude ? parseFloat(s.longitude) : null;
+
+              if ((!lat || !lon) && s.grid6) {
+                const loc = gridToLatLon(s.grid6);
+                if (loc) {
+                  lat = loc.lat;
+                  lon = loc.lon;
+                }
+              }
+              if ((!lat || !lon) && s.grid4) {
+                const loc = gridToLatLon(s.grid4);
+                if (loc) {
+                  lat = loc.lat;
+                  lon = loc.lon;
+                }
+              }
+
+              // POTA API returns frequency in kHz as a string (e.g., "7160" or "433240")
+              // Convert to MHz for consistency with SOTA and proper rig control
+              const freqKhz = parseFloat(s.frequency);
+              const freqMhz = !isNaN(freqKhz) ? freqKhz / 1000 : null;
+
+              return {
+                call: s.activator,
+                ref: s.reference,
+                freq: freqMhz ? freqMhz.toString() : s.frequency, // Convert to MHz string
+                mode: s.mode,
+                name: s.name || s.locationDesc,
+                locationDesc: s.locationDesc,
+                lat,
+                lon,
+                // POTA API returns UTC timestamps without 'Z' suffix, violating ISO 8601
+                // JavaScript interprets timestamps without timezone as local time
+                // Defensively append 'Z' if not present to force UTC interpretation
+                time: s.spotTime
+                  ? (() => {
+                      const ts = s.spotTime.endsWith('Z') || s.spotTime.endsWith('z') ? s.spotTime : s.spotTime + 'Z';
+                      return new Date(ts).toISOString().substr(11, 5) + 'z';
+                    })()
+                  : '',
+                expire: s.expire || 0,
+              };
+            }),
+          );
         } else {
           console.warn(`[POTA] Fetch failed: ${res?.status || 'no response'} ${res?.statusText || ''}`);
         }
diff --git a/src/hooks/usePSKReporter.js b/src/hooks/usePSKReporter.js
index ffff92c2..027bcbff 100644
--- a/src/hooks/usePSKReporter.js
+++ b/src/hooks/usePSKReporter.js
@@ -34,11 +34,7 @@ function deduplicateSpots(spots, maxSpots) {
 }
 
 export const usePSKReporter = (callsign, options = {}) => {
-  const {
-    minutes = 30,
-    enabled = true,
-    maxSpots = 500
-  } = options;
+  const { minutes = 30, enabled = true, maxSpots = 500 } = options;
 
   const [txReports, setTxReports] = useState([]);
   const [rxReports, setRxReports] = useState([]);
@@ -55,48 +51,50 @@ export const usePSKReporter = (callsign, options = {}) => {
   const eventSourceRef = useRef(null);
 
   // Clean old spots
-  const cleanOldSpots = useCallback((spots, maxAgeMinutes) => {
-    const cutoff = Date.now() - (maxAgeMinutes * 60 * 1000);
-    return spots.filter(s => s.timestamp > cutoff).slice(0, maxSpots);
-  }, [maxSpots]);
+  const cleanOldSpots = useCallback(
+    (spots, maxAgeMinutes) => {
+      const cutoff = Date.now() - maxAgeMinutes * 60 * 1000;
+      return spots.filter((s) => s.timestamp > cutoff).slice(0, maxSpots);
+    },
+    [maxSpots],
+  );
 
   // Process an array of spots (from SSE batch or initial payload)
-  const processSpots = useCallback((spots) => {
-    if (!mountedRef.current || !spots || spots.length === 0) return;
-
-    const upperCallsign = callsign?.toUpperCase();
-    if (!upperCallsign) return;
-
-    let txChanged = false;
-    let rxChanged = false;
-
-    for (const spot of spots) {
-      const now = Date.now();
-      spot.age = spot.timestamp ? Math.floor((now - spot.timestamp) / 60000) : 0;
-
-      if (spot.direction === 'tx') {
-        txReportsRef.current = deduplicateSpots(
-          [spot, ...txReportsRef.current], maxSpots
-        );
-        txChanged = true;
-      } else if (spot.direction === 'rx') {
-        rxReportsRef.current = deduplicateSpots(
-          [spot, ...rxReportsRef.current], maxSpots
-        );
-        rxChanged = true;
+  const processSpots = useCallback(
+    (spots) => {
+      if (!mountedRef.current || !spots || spots.length === 0) return;
+
+      const upperCallsign = callsign?.toUpperCase();
+      if (!upperCallsign) return;
+
+      let txChanged = false;
+      let rxChanged = false;
+
+      for (const spot of spots) {
+        const now = Date.now();
+        spot.age = spot.timestamp ? Math.floor((now - spot.timestamp) / 60000) : 0;
+
+        if (spot.direction === 'tx') {
+          txReportsRef.current = deduplicateSpots([spot, ...txReportsRef.current], maxSpots);
+          txChanged = true;
+        } else if (spot.direction === 'rx') {
+          rxReportsRef.current = deduplicateSpots([spot, ...rxReportsRef.current], maxSpots);
+          rxChanged = true;
+        }
       }
-    }
 
-    if (txChanged) {
-      setTxReports(cleanOldSpots([...txReportsRef.current], minutes));
-    }
-    if (rxChanged) {
-      setRxReports(cleanOldSpots([...rxReportsRef.current], minutes));
-    }
-    if (txChanged || rxChanged) {
-      setLastUpdate(new Date());
-    }
-  }, [callsign, minutes, maxSpots, cleanOldSpots]);
+      if (txChanged) {
+        setTxReports(cleanOldSpots([...txReportsRef.current], minutes));
+      }
+      if (rxChanged) {
+        setRxReports(cleanOldSpots([...rxReportsRef.current], minutes));
+      }
+      if (txChanged || rxChanged) {
+        setLastUpdate(new Date());
+      }
+    },
+    [callsign, minutes, maxSpots, cleanOldSpots],
+  );
 
   // Connect to SSE stream
   useEffect(() => {
@@ -133,7 +131,9 @@ export const usePSKReporter = (callsign, options = {}) => {
       if (!mountedRef.current) return;
       try {
         const data = JSON.parse(e.data);
-        console.log(`[PSKReporter SSE] Connected! MQTT ${data.mqttConnected ? 'up' : 'pending'}, ${data.recentSpots?.length || 0} recent spots`);
+        console.log(
+          `[PSKReporter SSE] Connected! MQTT ${data.mqttConnected ? 'up' : 'pending'}, ${data.recentSpots?.length || 0} recent spots`,
+        );
         setConnected(true);
         setLoading(false);
         setSource('sse');
@@ -189,16 +189,23 @@ export const usePSKReporter = (callsign, options = {}) => {
     const interval = setInterval(() => {
       const now = Date.now();
 
-      setTxReports(prev => prev.map(r => ({
-        ...r,
-        age: Math.floor((now - r.timestamp) / 60000)
-      })).filter(r => r.age <= minutes));
-
-      setRxReports(prev => prev.map(r => ({
-        ...r,
-        age: Math.floor((now - r.timestamp) / 60000)
-      })).filter(r => r.age <= minutes));
-
+      setTxReports((prev) =>
+        prev
+          .map((r) => ({
+            ...r,
+            age: Math.floor((now - r.timestamp) / 60000),
+          }))
+          .filter((r) => r.age <= minutes),
+      );
+
+      setRxReports((prev) =>
+        prev
+          .map((r) => ({
+            ...r,
+            age: Math.floor((now - r.timestamp) / 60000),
+          }))
+          .filter((r) => r.age <= minutes),
+      );
     }, 30000);
 
     return () => clearInterval(interval);
@@ -217,7 +224,7 @@ export const usePSKReporter = (callsign, options = {}) => {
     setLoading(true);
     setSource('reconnecting');
     setError(null);
-    setReconnectKey(k => k + 1);
+    setReconnectKey((k) => k + 1);
   }, []);
 
   // Reconnect SSE when tab becomes visible if connection was lost (browser throttling)
@@ -240,7 +247,7 @@ export const usePSKReporter = (callsign, options = {}) => {
     connected,
     source,
     lastUpdate,
-    refresh
+    refresh,
   };
 };
 
diff --git a/src/hooks/usePropagation.js b/src/hooks/usePropagation.js
index 04ffcc7b..d305609d 100644
--- a/src/hooks/usePropagation.js
+++ b/src/hooks/usePropagation.js
@@ -23,9 +23,9 @@ export const usePropagation = (deLocation, dxLocation, propagationConfig = {}) =
           dxLat: dxLocation.lat,
           dxLon: dxLocation.lon,
           mode,
-          power
+          power,
         });
-        
+
         const response = await fetch(`/api/propagation?${params}`);
         if (response.ok) {
           const result = await response.json();
diff --git a/src/hooks/useRotator.js b/src/hooks/useRotator.js
index 990144fa..c7baca79 100644
--- a/src/hooks/useRotator.js
+++ b/src/hooks/useRotator.js
@@ -1,4 +1,4 @@
-import { useEffect, useMemo, useRef, useState } from "react";
+import { useEffect, useMemo, useRef, useState } from 'react';
 
 /**
  * useRotator (V2)
@@ -14,15 +14,10 @@ import { useEffect, useMemo, useRef, useState } from "react";
  *  ageMs: number
  *  available: boolean  — whether a rotator is configured server-side
  */
-export default function useRotator({
-  endpointUrl,
-  pollMs = 2000,
-  staleMs = 5000,
-  mock = false,
-} = {}) {
+export default function useRotator({ endpointUrl, pollMs = 2000, staleMs = 5000, mock = false } = {}) {
   const [azimuth, setAzimuth] = useState(null);
   const [lastGoodAzimuth, setLastGoodAzimuth] = useState(null);
-  const [source, setSource] = useState(mock ? "mock" : "unknown");
+  const [source, setSource] = useState(mock ? 'mock' : 'unknown');
   const [lastUpdate, setLastUpdate] = useState(0);
   const [available, setAvailable] = useState(false);
 
@@ -46,7 +41,7 @@ export default function useRotator({
     }
 
     if (mock) {
-      setSource("mock");
+      setSource('mock');
       setAvailable(true);
       setAzimuth((prev) => (prev == null ? 22 : prev));
       setLastGoodAzimuth((prev) => (prev == null ? 22 : prev));
@@ -75,7 +70,7 @@ export default function useRotator({
       if (disabledRef.current) return;
 
       try {
-        const res = await fetch(endpointUrl, { cache: "no-store" });
+        const res = await fetch(endpointUrl, { cache: 'no-store' });
         if (!res.ok) throw new Error(`HTTP ${res.status}`);
 
         const data = await res.json();
diff --git a/src/hooks/useSOTASpots.js b/src/hooks/useSOTASpots.js
index 5984ae44..4c9c24d6 100644
--- a/src/hooks/useSOTASpots.js
+++ b/src/hooks/useSOTASpots.js
@@ -22,11 +22,15 @@ export const useSOTASpots = () => {
         if (res?.ok) {
           const spots = await res.json();
           console.log(`[SOTA] Fetched ${Array.isArray(spots) ? spots.length : 0} spots`);
-          
+
           // Only mark as "updated" when data content actually changes
           let newestTime = null;
           if (Array.isArray(spots) && spots.length > 0) {
-            const times = spots.map(s => s.timeStamp).filter(Boolean).sort().reverse();
+            const times = spots
+              .map((s) => s.timeStamp)
+              .filter(Boolean)
+              .sort()
+              .reverse();
             newestTime = times[0] || null;
           }
           if (newestTime !== lastNewestSpotRef.current || lastNewestSpotRef.current === null) {
@@ -36,8 +40,8 @@ export const useSOTASpots = () => {
 
           // Map SOTA API response to our standard spot format
           const mapped = (Array.isArray(spots) ? spots : [])
-            .filter(s => {
-              if (! (s.activatorCallsign && s.frequency)) return false;
+            .filter((s) => {
+              if (!(s.activatorCallsign && s.frequency)) return false;
               // Filter out QRT (operator signed off)
               const comments = (s.comments || '').toUpperCase().trim();
               if (comments === 'QRT' || comments.startsWith('QRT ') || comments.startsWith('QRT,')) return false;
@@ -49,7 +53,7 @@ export const useSOTASpots = () => {
               }
               return true;
             })
-            .map(s => {
+            .map((s) => {
               // summitDetails often contains lat/lng from the SOTA DB
               const details = s.summitDetails || {};
               const lat = details.latitude != null ? parseFloat(details.latitude) : null;
@@ -60,9 +64,7 @@ export const useSOTASpots = () => {
 
               return {
                 call: s.activatorCallsign,
-                ref: s.associationCode && s.summitCode
-                  ? `${s.associationCode}/${s.summitCode}`
-                  : (s.summitCode || ''),
+                ref: s.associationCode && s.summitCode ? `${s.associationCode}/${s.summitCode}` : s.summitCode || '',
                 summit: details.name || '',
                 altM: details.altM || details.altitude || null,
                 points: details.points || s.points || null,
@@ -73,10 +75,13 @@ export const useSOTASpots = () => {
                 lon,
                 // SOTA API returns UTC timestamps without 'Z' suffix, violating ISO 8601
                 // Defensively append 'Z' if not present to force UTC interpretation
-                time: s.timeStamp ? (() => {
-                  const ts = s.timeStamp.endsWith('Z') || s.timeStamp.endsWith('z') ? s.timeStamp : s.timeStamp + 'Z';
-                  return new Date(ts).toISOString().substr(11, 5) + 'z';
-                })() : ''
+                time: s.timeStamp
+                  ? (() => {
+                      const ts =
+                        s.timeStamp.endsWith('Z') || s.timeStamp.endsWith('z') ? s.timeStamp : s.timeStamp + 'Z';
+                      return new Date(ts).toISOString().substr(11, 5) + 'z';
+                    })()
+                  : '',
               };
             });
 
diff --git a/src/hooks/useSatellites.js b/src/hooks/useSatellites.js
index 238df29f..2550b55c 100644
--- a/src/hooks/useSatellites.js
+++ b/src/hooks/useSatellites.js
@@ -45,7 +45,7 @@ export const useSatellites = (observerLocation) => {
       const observerGd = {
         longitude: satellite.degreesToRadians(observerLocation.lon),
         latitude: satellite.degreesToRadians(observerLocation.lat),
-        height: 0.1 // km above sea level
+        height: 0.1, // km above sea level
       };
 
       Object.entries(tleData).forEach(([name, tle]) => {
@@ -57,12 +57,12 @@ export const useSatellites = (observerLocation) => {
         try {
           const satrec = satellite.twoline2satrec(line1, line2);
           const positionAndVelocity = satellite.propagate(satrec, now);
-          
+
           if (!positionAndVelocity.position) return;
 
           const gmst = satellite.gstime(now);
           const positionGd = satellite.eciToGeodetic(positionAndVelocity.position, gmst);
-          
+
           // Convert to degrees
           const lat = satellite.degreesLat(positionGd.latitude);
           const lon = satellite.degreesLong(positionGd.longitude);
@@ -71,7 +71,7 @@ export const useSatellites = (observerLocation) => {
           // Calculate look angles
           const lookAngles = satellite.ecfToLookAngles(
             observerGd,
-            satellite.eciToEcf(positionAndVelocity.position, gmst)
+            satellite.eciToEcf(positionAndVelocity.position, gmst),
           );
 
           const azimuth = satellite.radiansToDegrees(lookAngles.azimuth);
@@ -83,11 +83,11 @@ export const useSatellites = (observerLocation) => {
           const track = [];
           const trackMinutes = 90;
           const stepMinutes = 1;
-          
-          for (let m = -trackMinutes/2; m <= trackMinutes/2; m += stepMinutes) {
+
+          for (let m = -trackMinutes / 2; m <= trackMinutes / 2; m += stepMinutes) {
             const trackTime = new Date(now.getTime() + m * 60 * 1000);
             const trackPV = satellite.propagate(satrec, trackTime);
-            
+
             if (trackPV.position) {
               const trackGmst = satellite.gstime(trackTime);
               const trackGd = satellite.eciToGeodetic(trackPV.position, trackGmst);
@@ -96,7 +96,7 @@ export const useSatellites = (observerLocation) => {
               track.push([trackLat, trackLon]);
             }
           }
-          
+
           // Calculate footprint radius (visibility circle)
           // Formula: radius = Earth_radius * arccos(Earth_radius / (Earth_radius + altitude))
           const earthRadius = 6371; // km
@@ -115,7 +115,7 @@ export const useSatellites = (observerLocation) => {
             track,
             footprintRadius: Math.round(footprintRadius),
             mode: tle.mode || 'Unknown',
-            color: tle.color || '#00ffff'
+            color: tle.color || '#00ffff',
           });
         } catch (e) {
           // Skip satellites with invalid TLE
diff --git a/src/hooks/useSolarIndices.js b/src/hooks/useSolarIndices.js
index 6f98f986..b47911cd 100644
--- a/src/hooks/useSolarIndices.js
+++ b/src/hooks/useSolarIndices.js
@@ -23,7 +23,7 @@ export const useSolarIndices = () => {
         setLoading(false);
       }
     };
-    
+
     fetchData();
     // Refresh every 15 minutes
     const interval = setInterval(fetchData, 15 * 60 * 1000);
diff --git a/src/hooks/useSpaceWeather.js b/src/hooks/useSpaceWeather.js
index b9834549..d9cc64e1 100644
--- a/src/hooks/useSpaceWeather.js
+++ b/src/hooks/useSpaceWeather.js
@@ -15,26 +15,29 @@ export const useSpaceWeather = () => {
         const [fluxRes, kIndexRes, sunspotRes] = await Promise.allSettled([
           fetch('https://services.swpc.noaa.gov/json/f107_cm_flux.json'),
           fetch('https://services.swpc.noaa.gov/products/noaa-planetary-k-index.json'),
-          fetch('https://services.swpc.noaa.gov/json/solar-cycle/observed-solar-cycle-indices.json')
+          fetch('https://services.swpc.noaa.gov/json/solar-cycle/observed-solar-cycle-indices.json'),
         ]);
 
-        let solarFlux = '--', kIndex = '--', sunspotNumber = '--';
+        let solarFlux = '--',
+          kIndex = '--',
+          sunspotNumber = '--';
 
         if (fluxRes.status === 'fulfilled' && fluxRes.value.ok) {
           const d = await fluxRes.value.json();
-          if (d?.length) solarFlux = Math.round(d[d.length-1].flux || d[d.length-1].value || 0);
+          if (d?.length) solarFlux = Math.round(d[d.length - 1].flux || d[d.length - 1].value || 0);
         }
         if (kIndexRes.status === 'fulfilled' && kIndexRes.value.ok) {
           const d = await kIndexRes.value.json();
-          if (d?.length > 1) kIndex = d[d.length-1][1] || '--';
+          if (d?.length > 1) kIndex = d[d.length - 1][1] || '--';
         }
         if (sunspotRes.status === 'fulfilled' && sunspotRes.value.ok) {
           const d = await sunspotRes.value.json();
-          if (d?.length) sunspotNumber = Math.round(d[d.length-1].ssn || 0);
+          if (d?.length) sunspotNumber = Math.round(d[d.length - 1].ssn || 0);
         }
 
         let conditions = 'UNKNOWN';
-        const sfi = parseInt(solarFlux), ki = parseInt(kIndex);
+        const sfi = parseInt(solarFlux),
+          ki = parseInt(kIndex);
         if (!isNaN(sfi) && !isNaN(ki)) {
           if (sfi >= 150 && ki <= 2) conditions = 'EXCELLENT';
           else if (sfi >= 100 && ki <= 3) conditions = 'GOOD';
@@ -42,13 +45,13 @@ export const useSpaceWeather = () => {
           else conditions = 'POOR';
         }
 
-        setData({ 
-          solarFlux: String(solarFlux), 
-          sunspotNumber: String(sunspotNumber), 
-          kIndex: String(kIndex), 
-          aIndex: '--', 
-          conditions, 
-          lastUpdate: new Date() 
+        setData({
+          solarFlux: String(solarFlux),
+          sunspotNumber: String(sunspotNumber),
+          kIndex: String(kIndex),
+          aIndex: '--',
+          conditions,
+          lastUpdate: new Date(),
         });
       } catch (err) {
         console.error('Space weather error:', err);
@@ -56,7 +59,7 @@ export const useSpaceWeather = () => {
         setLoading(false);
       }
     };
-    
+
     fetchData();
     const interval = setInterval(fetchData, DEFAULT_CONFIG.refreshIntervals.spaceWeather);
     return () => clearInterval(interval);
diff --git a/src/hooks/useVisibilityRefresh.js b/src/hooks/useVisibilityRefresh.js
index 67803ce9..8dfa0b8e 100644
--- a/src/hooks/useVisibilityRefresh.js
+++ b/src/hooks/useVisibilityRefresh.js
@@ -1,12 +1,12 @@
 /**
  * useVisibilityRefresh Hook
- * 
+ *
  * Handles browser tab throttling — Chromium-based browsers (Edge, Chrome)
  * aggressively throttle or freeze setInterval in background tabs.
  * When the tab becomes visible again, this hook fires the callback
  * so data can be refetched immediately instead of waiting for the
  * next (potentially delayed) interval tick.
- * 
+ *
  * Usage:
  *   useVisibilityRefresh(fetchData, 5000);
  *   // calls fetchData when tab becomes visible, with 5s cooldown
@@ -16,7 +16,7 @@ import { useEffect, useRef } from 'react';
 export function useVisibilityRefresh(callback, cooldownMs = 5000) {
   const lastCallRef = useRef(0);
   const callbackRef = useRef(callback);
-  
+
   // Keep callback ref current without re-registering listener
   useEffect(() => {
     callbackRef.current = callback;
diff --git a/src/hooks/useWSJTX.js b/src/hooks/useWSJTX.js
index 6e33d7f3..3a57f11e 100644
--- a/src/hooks/useWSJTX.js
+++ b/src/hooks/useWSJTX.js
@@ -1,18 +1,18 @@
 /**
  * useWSJTX Hook
  * Polls the server for WSJT-X UDP data (decoded messages, status, QSOs)
- * 
+ *
  * WSJT-X sends decoded FT8/FT4/JT65/WSPR messages over UDP.
  * The server listens on the configured port and this hook fetches the results.
- * 
+ *
  * Each browser gets a unique session ID so relay data is per-user.
  */
 import { useState, useEffect, useCallback, useRef } from 'react';
 import { useVisibilityRefresh } from './useVisibilityRefresh';
 import { apiFetch } from '../utils/apiFetch';
 
-const POLL_FAST = 2000;    // 2s when data is flowing
-const POLL_SLOW = 30000;   // 30s idle check — is anything connected?
+const POLL_FAST = 2000; // 2s when data is flowing
+const POLL_SLOW = 30000; // 30s idle check — is anything connected?
 const API_URL = '/api/wsjtx';
 const DECODES_URL = '/api/wsjtx/decodes';
 
@@ -60,9 +60,7 @@ export function useWSJTX(enabled = true) {
     // Skip if we're in a rate-limit backoff window
     if (Date.now() < backoffUntil.current) return;
     try {
-      const base = lastTimestamp.current 
-        ? `${DECODES_URL}?since=${lastTimestamp.current}`
-        : DECODES_URL;
+      const base = lastTimestamp.current ? `${DECODES_URL}?since=${lastTimestamp.current}` : DECODES_URL;
       const sep = base.includes('?') ? '&' : '?';
       const url = `${base}${sep}session=${sessionId}`;
       const res = await apiFetch(url);
@@ -74,19 +72,19 @@ export function useWSJTX(enabled = true) {
       }
       if (!res.ok) throw new Error(`HTTP ${res.status}`);
       const json = await res.json();
-      
+
       if (json.decodes?.length > 0) {
-        setData(prev => {
+        setData((prev) => {
           // Merge new decodes, dedup by id, keep last 200
-          const existing = new Set(prev.decodes.map(d => d.id));
-          const newDecodes = json.decodes.filter(d => !existing.has(d.id));
+          const existing = new Set(prev.decodes.map((d) => d.id));
+          const newDecodes = json.decodes.filter((d) => !existing.has(d.id));
           if (newDecodes.length === 0) return prev;
-          
+
           const merged = [...prev.decodes, ...newDecodes].slice(-500);
           return { ...prev, decodes: merged, stats: { ...prev.stats, totalDecodes: merged.length } };
         });
       }
-      
+
       lastTimestamp.current = json.timestamp || Date.now();
       setError(null);
     } catch (e) {
@@ -110,11 +108,10 @@ export function useWSJTX(enabled = true) {
       const json = await res.json();
       setData(json);
       // Data is flowing if there are active clients or recent decodes
-      hasDataFlowing.current = !!(json.enabled && (
-        (json.stats?.activeClients > 0) ||
-        (json.decodes?.length > 0) ||
-        (json.qsos?.length > 0)
-      ));
+      hasDataFlowing.current = !!(
+        json.enabled &&
+        (json.stats?.activeClients > 0 || json.decodes?.length > 0 || json.qsos?.length > 0)
+      );
       lastTimestamp.current = Date.now();
       setLoading(false);
       setError(null);
@@ -132,12 +129,13 @@ export function useWSJTX(enabled = true) {
   // Polling - adaptive: fast (2s) when data flows, slow (30s) when idle
   useEffect(() => {
     if (!enabled) return;
-    
+
     let timer;
     const tick = () => {
       const interval = hasDataFlowing.current ? POLL_FAST : POLL_SLOW;
       fullFetchCounter.current++;
-      if (fullFetchCounter.current >= 8) { // Full refresh every ~16s (fast) or ~240s (slow)
+      if (fullFetchCounter.current >= 8) {
+        // Full refresh every ~16s (fast) or ~240s (slow)
         fullFetchCounter.current = 0;
         fetchFull();
       } else {
@@ -146,12 +144,14 @@ export function useWSJTX(enabled = true) {
       timer = setTimeout(tick, interval);
     };
     timer = setTimeout(tick, POLL_SLOW); // Start slow, speed up if data arrives
-    
+
     return () => clearTimeout(timer);
   }, [enabled, fetchFull, pollDecodes]);
 
   // Refresh immediately when tab becomes visible (handles browser throttling)
-  useVisibilityRefresh(() => { if (enabled) fetchFull(); }, 5000);
+  useVisibilityRefresh(() => {
+    if (enabled) fetchFull();
+  }, 5000);
 
   return {
     ...data,
diff --git a/src/hooks/useWWFFSpots.js b/src/hooks/useWWFFSpots.js
index 8433ce73..eb08a611 100644
--- a/src/hooks/useWWFFSpots.js
+++ b/src/hooks/useWWFFSpots.js
@@ -23,11 +23,14 @@ export const useWWFFSpots = () => {
         if (res?.ok) {
           const spots = await res.json();
           console.log(`[WWFF] Fetched ${Array.isArray(spots) ? spots.length : 0} spots`);
-          
+
           // Only mark as "updated" when data content actually changes
           let newestTime = null;
           if (Array.isArray(spots) && spots.length > 0) {
-            const times = spots.map(s => s.spot_time).filter(Boolean).sort((a, b) => b - a);
+            const times = spots
+              .map((s) => s.spot_time)
+              .filter(Boolean)
+              .sort((a, b) => b - a);
             newestTime = times[0] || null;
           }
           if (newestTime !== lastNewestSpotRef.current || lastNewestSpotRef.current === null) {
@@ -37,7 +40,7 @@ export const useWWFFSpots = () => {
 
           // Filter out QRT spots and nearly-expired spots, then sort by most recent
           const validSpots = spots
-            .filter(s => {
+            .filter((s) => {
               // Filter out QRT (operator signed off)
               const comments = (s.remarks || '').toUpperCase().trim();
               if (comments === 'QRT' || comments.startsWith('QRT ') || comments.startsWith('QRT,')) return false;
@@ -54,29 +57,31 @@ export const useWWFFSpots = () => {
               return timeB - timeA;
             });
 
-          setData(validSpots.map(s => {
-            // Use API coordinates
-            let lat = s.latitude ? parseFloat(s.latitude) : null;
-            let lon = s.longitude ? parseFloat(s.longitude) : null;
+          setData(
+            validSpots.map((s) => {
+              // Use API coordinates
+              let lat = s.latitude ? parseFloat(s.latitude) : null;
+              let lon = s.longitude ? parseFloat(s.longitude) : null;
 
-            // WWFF API returns frequency_khz as a number (e.g., 7160 or 433240)
-            // Convert to MHz for consistency with POTA/SOTA and proper rig control
-            const freqKhz = parseFloat(s.frequency_khz);
-            const freqMhz = !isNaN(freqKhz) ? freqKhz / 1000 : null;
+              // WWFF API returns frequency_khz as a number (e.g., 7160 or 433240)
+              // Convert to MHz for consistency with POTA/SOTA and proper rig control
+              const freqKhz = parseFloat(s.frequency_khz);
+              const freqMhz = !isNaN(freqKhz) ? freqKhz / 1000 : null;
 
-            return {
-              call: s.activator,
-              ref: s.reference,
-              freq: freqMhz ? freqMhz.toString() : s.frequency_khz, // Convert to MHz string
-              mode: s.mode,
-              name: s.reference_name,
-              remarks: s.remarks,
-              lat,
-              lon,
-              time: s.spot_time ? s.spot_time_formatted.substr(11, 5) + 'z' : '',
-              expire: 0
-            };
-          }));
+              return {
+                call: s.activator,
+                ref: s.reference,
+                freq: freqMhz ? freqMhz.toString() : s.frequency_khz, // Convert to MHz string
+                mode: s.mode,
+                name: s.reference_name,
+                remarks: s.remarks,
+                lat,
+                lon,
+                time: s.spot_time ? s.spot_time_formatted.substr(11, 5) + 'z' : '',
+                expire: 0,
+              };
+            }),
+          );
         } else {
           console.warn(`[WWFF] Fetch failed: ${res?.status || 'no response'} ${res?.statusText || ''}`);
         }
diff --git a/src/hooks/useWeather.js b/src/hooks/useWeather.js
index e86d29c7..a0ec6001 100644
--- a/src/hooks/useWeather.js
+++ b/src/hooks/useWeather.js
@@ -4,7 +4,7 @@
  * International weather: fetched directly from Open-Meteo by each user's browser
  *   — distributes rate limits across all users instead of concentrating on server.
  *   — optional API key support via localStorage ('ohc_openmeteo_apikey')
- * 
+ *
  * Always fetches in metric (Celsius, km/h, mm) and converts client-side.
  */
 import { useState, useEffect, useRef } from 'react';
@@ -38,7 +38,7 @@ const WEATHER_CODES = {
   86: { desc: 'Heavy snow showers', icon: '❄️' },
   95: { desc: 'Thunderstorm', icon: '⛈️' },
   96: { desc: 'Thunderstorm w/ slight hail', icon: '⛈️' },
-  99: { desc: 'Thunderstorm w/ heavy hail', icon: '⛈️' }
+  99: { desc: 'Thunderstorm w/ heavy hail', icon: '⛈️' },
 };
 
 // Wind direction from degrees
@@ -63,7 +63,7 @@ function normalizeLat(lat) {
 }
 
 // Conversion helpers — always from Celsius/metric base
-const cToF = (c) => c * 9 / 5 + 32;
+const cToF = (c) => (c * 9) / 5 + 32;
 const kmhToMph = (k) => k * 0.621371;
 const mmToInch = (mm) => mm * 0.0393701;
 const kmToMi = (km) => km * 0.621371;
@@ -82,8 +82,8 @@ export function convertWeatherData(rawData, tempUnit = 'F') {
   const code = current.weather_code;
   const weather = WEATHER_CODES[code] || { desc: 'Unknown', icon: '🌡️' };
 
-  const convTemp = (c) => c == null ? null : Math.round(isMetric ? c : cToF(c));
-  const convWind = (k) => k == null ? null : Math.round(isMetric ? k : kmhToMph(k));
+  const convTemp = (c) => (c == null ? null : Math.round(isMetric ? c : cToF(c)));
+  const convWind = (k) => (k == null ? null : Math.round(isMetric ? k : kmhToMph(k)));
 
   // Build hourly forecast (next 24h in 3h intervals)
   const hourlyForecast = [];
@@ -112,7 +112,7 @@ export function convertWeatherData(rawData, tempUnit = 'F') {
         low: convTemp(daily.temperature_2m_min?.[i]),
         precipProb: daily.precipitation_probability_max?.[i] || 0,
         precipSum: isMetric
-          ? (daily.precipitation_sum?.[i] || 0)
+          ? daily.precipitation_sum?.[i] || 0
           : parseFloat(mmToInch(daily.precipitation_sum?.[i] || 0).toFixed(2)),
         icon: dWeather.icon,
         desc: dWeather.desc,
@@ -137,9 +137,7 @@ export function convertWeatherData(rawData, tempUnit = 'F') {
     windDir: windDirection(current.wind_direction_10m),
     windDirDeg: current.wind_direction_10m || 0,
     windGusts: convWind(current.wind_gusts_10m),
-    precipitation: isMetric
-      ? (current.precipitation || 0)
-      : parseFloat(mmToInch(current.precipitation || 0).toFixed(2)),
+    precipitation: isMetric ? current.precipitation || 0 : parseFloat(mmToInch(current.precipitation || 0).toFixed(2)),
     uvIndex: current.uv_index || 0,
     visibility: current.visibility
       ? isMetric
@@ -169,7 +167,9 @@ const POLL_INTERVAL = 2 * 60 * 60 * 1000; // 2 hours — matches server cache TT
 // Each user's browser makes its own request — rate limits are per-IP, not per-server
 async function fetchOpenMeteoDirect(lat, lon) {
   let apiKey = '';
-  try { apiKey = localStorage.getItem('ohc_openmeteo_apikey') || ''; } catch {}
+  try {
+    apiKey = localStorage.getItem('ohc_openmeteo_apikey') || '';
+  } catch {}
 
   const params = [
     `latitude=${lat}`,
@@ -224,7 +224,7 @@ export const useWeather = (location, tempUnit = 'F') => {
         retryCountRef.current++;
         setError({
           message: err.message === 'Rate limited' ? 'Weather service busy' : 'Weather unavailable',
-          retryIn: Math.round(delay / 1000)
+          retryIn: Math.round(delay / 1000),
         });
         retryRef.current = setTimeout(fetchWeather, delay);
       } finally {
diff --git a/src/lang/i18n.js b/src/lang/i18n.js
index 2db93970..59380767 100644
--- a/src/lang/i18n.js
+++ b/src/lang/i18n.js
@@ -23,7 +23,7 @@ export const LANGUAGES = [
   { code: 'ja', name: '日本語', flag: '🇯🇵' },
   { code: 'ko', name: '한국어', flag: '🇰🇷' },
   { code: 'it', name: 'Italiano', flag: '🇮🇹' },
-  { code: 'sl', name: 'Slovenščina', flag: '🇸🇮' }
+  { code: 'sl', name: 'Slovenščina', flag: '🇸🇮' },
 ];
 
 export const resources = {
@@ -36,7 +36,7 @@ export const resources = {
   ja: { translation: translationJA },
   ko: { translation: translationKO },
   it: { translation: translationIT },
-  sl: { translation: translationSL }
+  sl: { translation: translationSL },
 };
 
 i18n
@@ -46,12 +46,12 @@ i18n
     fallbackLng: 'en',
     resources,
     interpolation: {
-      escapeValue: false
+      escapeValue: false,
     },
     detection: {
       order: ['localStorage', 'navigator'],
-      caches: ['localStorage']
-    }
+      caches: ['localStorage'],
+    },
   });
 
 export default i18n;
diff --git a/src/layouts/ClassicLayout.jsx b/src/layouts/ClassicLayout.jsx
index af547e6b..4aaf51e8 100644
--- a/src/layouts/ClassicLayout.jsx
+++ b/src/layouts/ClassicLayout.jsx
@@ -1,10 +1,10 @@
 /**
  * Classic HamClock-style layout
  */
-import { DXNewsTicker, WorldMap } from "../components";
-import { getBandColor, getBandColorForBand } from "../utils";
-import CallsignLink from "../components/CallsignLink.jsx";
-import { useRig } from "../contexts/RigContext.jsx";
+import { DXNewsTicker, WorldMap } from '../components';
+import { getBandColor, getBandColorForBand } from '../utils';
+import CallsignLink from '../components/CallsignLink.jsx';
+import { useRig } from '../contexts/RigContext.jsx';
 
 export default function ClassicLayout(props) {
   const {
@@ -52,30 +52,8 @@ export default function ClassicLayout(props) {
     toggleSatellites,
   } = props;
 
-  const liveSpotBands = [
-    "160m",
-    "80m",
-    "60m",
-    "40m",
-    "30m",
-    "20m",
-    "17m",
-    "15m",
-    "12m",
-    "10m",
-  ];
-  const mapLegendBands = [
-    "160",
-    "80",
-    "40",
-    "30",
-    "20",
-    "17",
-    "15",
-    "12",
-    "10",
-    "6",
-  ];
+  const liveSpotBands = ['160m', '80m', '60m', '40m', '30m', '20m', '17m', '15m', '12m', '10m'];
+  const mapLegendBands = ['160', '80', '40', '30', '20', '17', '15', '12', '10', '6'];
 
   const { tuneTo } = useRig();
 
@@ -85,103 +63,87 @@ export default function ClassicLayout(props) {
     tuneTo(spot);
   };
 
-  return config.layout === "classic" ? (
+  return config.layout === 'classic' ? (
     <div
       style={{
-        width: "100vw",
-        height: "100vh",
-        display: "flex",
-        flexDirection: "column",
-        background: "#000000",
-        fontFamily: "JetBrains Mono, monospace",
-        overflow: "hidden",
+        width: '100vw',
+        height: '100vh',
+        display: 'flex',
+        flexDirection: 'column',
+        background: '#000000',
+        fontFamily: 'JetBrains Mono, monospace',
+        overflow: 'hidden',
       }}
     >
       {/* TOP BAR - HamClock style */}
       <div
         style={{
-          display: "grid",
-          gridTemplateColumns: "280px 1fr 300px",
-          height: "130px",
-          borderBottom: "2px solid #333",
-          background: "#000",
+          display: 'grid',
+          gridTemplateColumns: '280px 1fr 300px',
+          height: '130px',
+          borderBottom: '2px solid #333',
+          background: '#000',
         }}
       >
         {/* Callsign & Time */}
-        <div style={{ padding: "8px 12px", borderRight: "1px solid #333" }}>
+        <div style={{ padding: '8px 12px', borderRight: '1px solid #333' }}>
           <div
             style={{
-              fontSize: "42px",
-              fontWeight: "900",
-              color: "#ff4444",
-              fontFamily: "Orbitron, monospace",
-              cursor: "pointer",
+              fontSize: '42px',
+              fontWeight: '900',
+              color: '#ff4444',
+              fontFamily: 'Orbitron, monospace',
+              cursor: 'pointer',
               lineHeight: 1,
             }}
             onClick={() => setShowSettings(true)}
-            title={t("app.settings.click")}
+            title={t('app.settings.click')}
           >
             {config.callsign}
           </div>
-          <div style={{ fontSize: "11px", color: "#888", marginTop: "2px" }}>
-            {t("app.uptime", { uptime, version: "v4.20" })}
+          <div style={{ fontSize: '11px', color: '#888', marginTop: '2px' }}>
+            {t('app.uptime', { uptime, version: 'v4.20' })}
           </div>
-          <div style={{ marginTop: "8px" }}>
+          <div style={{ marginTop: '8px' }}>
             <div
               style={{
-                fontSize: "36px",
-                fontWeight: "700",
-                color: "#00ff00",
-                fontFamily: "JetBrains Mono, Consolas, monospace",
+                fontSize: '36px',
+                fontWeight: '700',
+                color: '#00ff00',
+                fontFamily: 'JetBrains Mono, Consolas, monospace',
                 lineHeight: 1,
-                width: "180px",
+                width: '180px',
               }}
             >
               {utcTime}
-              <span style={{ fontSize: "20px", color: "#00cc00" }}>
-                :{String(new Date().getUTCSeconds()).padStart(2, "0")}
+              <span style={{ fontSize: '20px', color: '#00cc00' }}>
+                :{String(new Date().getUTCSeconds()).padStart(2, '0')}
               </span>
             </div>
-            <div
-              style={{ fontSize: "14px", color: "#00cc00", marginTop: "2px" }}
-            >
-              {utcDate}{" "}
-              <span style={{ color: "#666", marginLeft: "8px" }}>
-                {t("app.time.utc")}
-              </span>
+            <div style={{ fontSize: '14px', color: '#00cc00', marginTop: '2px' }}>
+              {utcDate} <span style={{ color: '#666', marginLeft: '8px' }}>{t('app.time.utc')}</span>
             </div>
           </div>
         </div>
 
         {/* Solar Indices - SSN & SFI */}
-        <div style={{ display: "flex", borderRight: "1px solid #333" }}>
+        <div style={{ display: 'flex', borderRight: '1px solid #333' }}>
           {/* SSN */}
-          <div
-            style={{ flex: 1, padding: "8px", borderRight: "1px solid #333" }}
-          >
-            <div
-              style={{ fontSize: "10px", color: "#888", textAlign: "center" }}
-            >
-              {t("app.solar.sunspotNumber")}
-            </div>
-            <div style={{ display: "flex", alignItems: "center", gap: "8px" }}>
+          <div style={{ flex: 1, padding: '8px', borderRight: '1px solid #333' }}>
+            <div style={{ fontSize: '10px', color: '#888', textAlign: 'center' }}>{t('app.solar.sunspotNumber')}</div>
+            <div style={{ display: 'flex', alignItems: 'center', gap: '8px' }}>
               <div
                 style={{
                   flex: 1,
-                  height: "70px",
-                  background: "#001100",
-                  border: "1px solid #333",
-                  borderRadius: "2px",
-                  padding: "4px",
+                  height: '70px',
+                  background: '#001100',
+                  border: '1px solid #333',
+                  borderRadius: '2px',
+                  padding: '4px',
                 }}
               >
                 {solarIndices?.data?.ssn?.history?.length > 0 && (
-                  <svg
-                    width="100%"
-                    height="100%"
-                    viewBox="0 0 100 60"
-                    preserveAspectRatio="none"
-                  >
+                  <svg width="100%" height="100%" viewBox="0 0 100 60" preserveAspectRatio="none">
                     {(() => {
                       const data = solarIndices.data.ssn.history.slice(-30);
                       const values = data.map((d) => d.value);
@@ -194,67 +156,51 @@ export default function ClassicLayout(props) {
                           const y = 60 - ((d.value - min) / range) * 55;
                           return `${x},${y}`;
                         })
-                        .join(" ");
-                      return (
-                        <polyline
-                          points={points}
-                          fill="none"
-                          stroke="#00ff00"
-                          strokeWidth="1.5"
-                        />
-                      );
+                        .join(' ');
+                      return <polyline points={points} fill="none" stroke="#00ff00" strokeWidth="1.5" />;
                     })()}
                   </svg>
                 )}
               </div>
               <div
                 style={{
-                  fontSize: "48px",
-                  fontWeight: "700",
-                  color: "#00ffff",
-                  fontFamily: "Orbitron, monospace",
+                  fontSize: '48px',
+                  fontWeight: '700',
+                  color: '#00ffff',
+                  fontFamily: 'Orbitron, monospace',
                 }}
               >
-                {solarIndices?.data?.ssn?.current || "--"}
+                {solarIndices?.data?.ssn?.current || '--'}
               </div>
             </div>
             <div
               style={{
-                fontSize: "10px",
-                color: "#666",
-                textAlign: "center",
-                marginTop: "2px",
+                fontSize: '10px',
+                color: '#666',
+                textAlign: 'center',
+                marginTop: '2px',
               }}
             >
-              {t("app.solar.last30Days")}
+              {t('app.solar.last30Days')}
             </div>
           </div>
 
           {/* SFI */}
-          <div style={{ flex: 1, padding: "8px" }}>
-            <div
-              style={{ fontSize: "10px", color: "#888", textAlign: "center" }}
-            >
-              {t("app.solar.solarFlux")}
-            </div>
-            <div style={{ display: "flex", alignItems: "center", gap: "8px" }}>
+          <div style={{ flex: 1, padding: '8px' }}>
+            <div style={{ fontSize: '10px', color: '#888', textAlign: 'center' }}>{t('app.solar.solarFlux')}</div>
+            <div style={{ display: 'flex', alignItems: 'center', gap: '8px' }}>
               <div
                 style={{
                   flex: 1,
-                  height: "70px",
-                  background: "#001100",
-                  border: "1px solid #333",
-                  borderRadius: "2px",
-                  padding: "4px",
+                  height: '70px',
+                  background: '#001100',
+                  border: '1px solid #333',
+                  borderRadius: '2px',
+                  padding: '4px',
                 }}
               >
                 {solarIndices?.data?.sfi?.history?.length > 0 && (
-                  <svg
-                    width="100%"
-                    height="100%"
-                    viewBox="0 0 100 60"
-                    preserveAspectRatio="none"
-                  >
+                  <svg width="100%" height="100%" viewBox="0 0 100 60" preserveAspectRatio="none">
                     {(() => {
                       const data = solarIndices.data.sfi.history.slice(-30);
                       const values = data.map((d) => d.value);
@@ -267,92 +213,72 @@ export default function ClassicLayout(props) {
                           const y = 60 - ((d.value - min) / range) * 55;
                           return `${x},${y}`;
                         })
-                        .join(" ");
-                      return (
-                        <polyline
-                          points={points}
-                          fill="none"
-                          stroke="#00ff00"
-                          strokeWidth="1.5"
-                        />
-                      );
+                        .join(' ');
+                      return <polyline points={points} fill="none" stroke="#00ff00" strokeWidth="1.5" />;
                     })()}
                   </svg>
                 )}
               </div>
               <div
                 style={{
-                  fontSize: "48px",
-                  fontWeight: "700",
-                  color: "#ff66ff",
-                  fontFamily: "Orbitron, monospace",
+                  fontSize: '48px',
+                  fontWeight: '700',
+                  color: '#ff66ff',
+                  fontFamily: 'Orbitron, monospace',
                 }}
               >
-                {solarIndices?.data?.sfi?.current || "--"}
+                {solarIndices?.data?.sfi?.current || '--'}
               </div>
             </div>
             <div
               style={{
-                fontSize: "10px",
-                color: "#666",
-                textAlign: "center",
-                marginTop: "2px",
+                fontSize: '10px',
+                color: '#666',
+                textAlign: 'center',
+                marginTop: '2px',
               }}
             >
-              {t("app.solar.last30DaysPlus7")}
+              {t('app.solar.last30DaysPlus7')}
             </div>
           </div>
         </div>
 
         {/* Live Spots & Indices */}
-        <div style={{ display: "flex" }}>
+        <div style={{ display: 'flex' }}>
           {/* Live Spots by Band */}
-          <div
-            style={{ flex: 1, padding: "8px", borderRight: "1px solid #333" }}
-          >
-            <div
-              style={{ fontSize: "12px", color: "#ff6666", fontWeight: "700" }}
-            >
-              {t("app.liveSpots.title")}
-            </div>
-            <div
-              style={{ fontSize: "9px", color: "#888", marginBottom: "4px" }}
-            >
-              {t("app.liveSpots.ofGridLastMinutes", {
+          <div style={{ flex: 1, padding: '8px', borderRight: '1px solid #333' }}>
+            <div style={{ fontSize: '12px', color: '#ff6666', fontWeight: '700' }}>{t('app.liveSpots.title')}</div>
+            <div style={{ fontSize: '9px', color: '#888', marginBottom: '4px' }}>
+              {t('app.liveSpots.ofGridLastMinutes', {
                 grid: deGrid,
                 minutes: 15,
               })}
             </div>
             <div
               style={{
-                display: "grid",
-                gridTemplateColumns: "1fr 1fr",
-                gap: "2px",
-                fontSize: "10px",
+                display: 'grid',
+                gridTemplateColumns: '1fr 1fr',
+                gap: '2px',
+                fontSize: '10px',
               }}
             >
               {liveSpotBands.map((band) => (
-                <div
-                  key={band}
-                  style={{ display: "flex", justifyContent: "space-between" }}
-                >
-                  <span style={{ color: getBandColorForBand(band) }}>
-                    {band}
-                  </span>
-                  <span style={{ color: "#fff" }}>
+                <div key={band} style={{ display: 'flex', justifyContent: 'space-between' }}>
+                  <span style={{ color: getBandColorForBand(band) }}>{band}</span>
+                  <span style={{ color: '#fff' }}>
                     {dxClusterData.spots?.filter((s) => {
                       const freq = parseFloat(s.freq);
                       const bands = {
-                        "160m": [1.8, 2],
-                        "80m": [3.5, 4],
-                        "60m": [5.3, 5.4],
-                        "40m": [7, 7.3],
-                        "30m": [10.1, 10.15],
-                        "20m": [14, 14.35],
-                        "17m": [18.068, 18.168],
-                        "15m": [21, 21.45],
-                        "12m": [24.89, 24.99],
-                        "10m": [28, 29.7],
+                        '160m': [1.8, 2],
+                        '80m': [3.5, 4],
+                        '60m': [5.3, 5.4],
+                        '40m': [7, 7.3],
+                        '30m': [10.1, 10.15],
+                        '20m': [14, 14.35],
+                        '17m': [18.068, 18.168],
+                        '15m': [21, 21.45],
+                        '12m': [24.89, 24.99],
+                        '10m': [28, 29.7],
                       };
                       const r = bands[band];
                       return r && freq >= r[0] && freq <= r[1];
@@ -364,54 +290,50 @@ export default function ClassicLayout(props) {
           </div>
 
           {/* Space Weather Indices */}
-          <div style={{ width: "70px", padding: "8px", fontSize: "11px" }}>
-            <div style={{ marginBottom: "6px" }}>
-              <div style={{ color: "#888" }}>{t("app.spaceWeather.xray")}</div>
+          <div style={{ width: '70px', padding: '8px', fontSize: '11px' }}>
+            <div style={{ marginBottom: '6px' }}>
+              <div style={{ color: '#888' }}>{t('app.spaceWeather.xray')}</div>
               <div
                 style={{
-                  color: "#ffff00",
-                  fontSize: "16px",
-                  fontWeight: "700",
+                  color: '#ffff00',
+                  fontSize: '16px',
+                  fontWeight: '700',
                 }}
               >
                 M3.0
               </div>
             </div>
-            <div style={{ marginBottom: "6px" }}>
-              <div style={{ color: "#888" }}>{t("app.spaceWeather.kp")}</div>
+            <div style={{ marginBottom: '6px' }}>
+              <div style={{ color: '#888' }}>{t('app.spaceWeather.kp')}</div>
               <div
                 style={{
-                  color: "#00ff00",
-                  fontSize: "16px",
-                  fontWeight: "700",
+                  color: '#00ff00',
+                  fontSize: '16px',
+                  fontWeight: '700',
                 }}
               >
-                {solarIndices?.data?.kp?.current ??
-                  spaceWeather?.data?.kIndex ??
-                  "--"}
+                {solarIndices?.data?.kp?.current ?? spaceWeather?.data?.kIndex ?? '--'}
               </div>
             </div>
-            <div style={{ marginBottom: "6px" }}>
-              <div style={{ color: "#888" }}>{t("app.spaceWeather.bz")}</div>
+            <div style={{ marginBottom: '6px' }}>
+              <div style={{ color: '#888' }}>{t('app.spaceWeather.bz')}</div>
               <div
                 style={{
-                  color: "#00ffff",
-                  fontSize: "16px",
-                  fontWeight: "700",
+                  color: '#00ffff',
+                  fontSize: '16px',
+                  fontWeight: '700',
                 }}
               >
                 -0
               </div>
             </div>
             <div>
-              <div style={{ color: "#888" }}>
-                {t("app.spaceWeather.aurora")}
-              </div>
+              <div style={{ color: '#888' }}>{t('app.spaceWeather.aurora')}</div>
               <div
                 style={{
-                  color: "#ff00ff",
-                  fontSize: "16px",
-                  fontWeight: "700",
+                  color: '#ff00ff',
+                  fontSize: '16px',
+                  fontWeight: '700',
                 }}
               >
                 18
@@ -422,78 +344,71 @@ export default function ClassicLayout(props) {
       </div>
 
       {/* MAIN AREA */}
-      <div style={{ flex: 1, display: "flex", overflow: "hidden" }}>
+      <div style={{ flex: 1, display: 'flex', overflow: 'hidden' }}>
         {/* DX Cluster List */}
         <div
           style={{
-            width: "220px",
-            borderRight: "1px solid #333",
-            display: "flex",
-            flexDirection: "column",
-            background: "#000",
+            width: '220px',
+            borderRight: '1px solid #333',
+            display: 'flex',
+            flexDirection: 'column',
+            background: '#000',
           }}
         >
           <div
             style={{
-              padding: "4px 8px",
-              borderBottom: "1px solid #333",
-              display: "flex",
-              justifyContent: "space-between",
-              alignItems: "center",
+              padding: '4px 8px',
+              borderBottom: '1px solid #333',
+              display: 'flex',
+              justifyContent: 'space-between',
+              alignItems: 'center',
             }}
           >
-            <span
-              style={{ color: "#ff6666", fontSize: "14px", fontWeight: "700" }}
-            >
-              {t("app.dxCluster.shortTitle")}
-            </span>
-            <span style={{ color: "#00ff00", fontSize: "10px" }}>
-              dxspider.co.uk:7300
+            <span style={{ color: '#ff6666', fontSize: '14px', fontWeight: '700' }}>
+              {t('app.dxCluster.shortTitle')}
             </span>
+            <span style={{ color: '#00ff00', fontSize: '10px' }}>dxspider.co.uk:7300</span>
           </div>
-          <div style={{ flex: 1, overflow: "auto", fontSize: "11px" }}>
+          <div style={{ flex: 1, overflow: 'auto', fontSize: '11px' }}>
             {dxClusterData.spots?.slice(0, 25).map((spot, i) => (
               <div
                 key={i}
                 style={{
-                  padding: "2px 6px",
-                  display: "grid",
-                  gridTemplateColumns: "65px 1fr 35px",
-                  gap: "4px",
-                  borderBottom: "1px solid #111",
-                  cursor: "pointer",
-                  background:
-                    hoveredSpot?.call === spot.call ? "#333" : "transparent",
+                  padding: '2px 6px',
+                  display: 'grid',
+                  gridTemplateColumns: '65px 1fr 35px',
+                  gap: '4px',
+                  borderBottom: '1px solid #111',
+                  cursor: 'pointer',
+                  background: hoveredSpot?.call === spot.call ? '#333' : 'transparent',
                 }}
                 onMouseEnter={() => setHoveredSpot(spot)}
                 onMouseLeave={() => setHoveredSpot(null)}
                 onClick={() => {
                   tuneTo(spot);
-                  const path = (dxClusterData.paths || []).find(
-                    (p) => p.dxCall === spot.call,
-                  );
+                  const path = (dxClusterData.paths || []).find((p) => p.dxCall === spot.call);
                   if (path && path.dxLat != null && path.dxLon != null) {
                     handleDXChange({ lat: path.dxLat, lon: path.dxLon });
                   }
                 }}
               >
-                <span style={{ color: "#ffff00" }}>
+                <span style={{ color: '#ffff00' }}>
                   {(() => {
                     const f = parseFloat(spot.freq);
                     return f > 1000 ? (f / 1000).toFixed(3) : f.toFixed(3);
                   })()}
                 </span>
-                <span style={{ color: "#00ffff" }}>
+                <span style={{ color: '#00ffff' }}>
                   <CallsignLink call={spot.call} color="#00ffff" />
                 </span>
-                <span style={{ color: "#888" }}>{spot.time || "--"}</span>
+                <span style={{ color: '#888' }}>{spot.time || '--'}</span>
               </div>
             ))}
           </div>
         </div>
 
         {/* Map */}
-        <div style={{ flex: 1, position: "relative" }}>
+        <div style={{ flex: 1, position: 'relative' }}>
           <WorldMap
             deLocation={config.location}
             dxLocation={dxLocation}
@@ -528,49 +443,43 @@ export default function ClassicLayout(props) {
           {/* Map overlay buttons — bottom-left to avoid WorldMap's SAT/CALLS buttons at top */}
           <div
             style={{
-              position: "absolute",
-              bottom: "54px",
-              left: "10px",
-              display: "flex",
-              gap: "6px",
+              position: 'absolute',
+              bottom: '54px',
+              left: '10px',
+              display: 'flex',
+              gap: '6px',
               zIndex: 1000,
             }}
           >
             <button
               onClick={() => setShowSettings(true)}
               style={{
-                background: "rgba(0,0,0,0.7)",
-                border: "1px solid #444",
-                color: "#fff",
-                padding: "6px 12px",
-                fontSize: "12px",
-                cursor: "pointer",
-                borderRadius: "4px",
+                background: 'rgba(0,0,0,0.7)',
+                border: '1px solid #444',
+                color: '#fff',
+                padding: '6px 12px',
+                fontSize: '12px',
+                cursor: 'pointer',
+                borderRadius: '4px',
               }}
             >
-              {t("app.settings")}
+              {t('app.settings')}
             </button>
 
             <button
               onClick={handleToggleDxLock}
-              title={
-                dxLocked
-                  ? t("app.dxLock.unlockTooltip")
-                  : t("app.dxLock.lockTooltip")
-              }
+              title={dxLocked ? t('app.dxLock.unlockTooltip') : t('app.dxLock.lockTooltip')}
               style={{
-                background: dxLocked
-                  ? "rgba(255,180,0,0.9)"
-                  : "rgba(0,0,0,0.7)",
-                border: "1px solid #444",
-                color: dxLocked ? "#000" : "#fff",
-                padding: "6px 12px",
-                fontSize: "12px",
-                cursor: "pointer",
-                borderRadius: "4px",
+                background: dxLocked ? 'rgba(255,180,0,0.9)' : 'rgba(0,0,0,0.7)',
+                border: '1px solid #444',
+                color: dxLocked ? '#000' : '#fff',
+                padding: '6px 12px',
+                fontSize: '12px',
+                cursor: 'pointer',
+                borderRadius: '4px',
               }}
             >
-              {dxLocked ? t("app.dxLock.locked") : t("app.dxLock.unlocked")}
+              {dxLocked ? t('app.dxLock.locked') : t('app.dxLock.unlocked')}
             </button>
           </div>
         </div>
@@ -579,18 +488,18 @@ export default function ClassicLayout(props) {
       {/* BOTTOM - Frequency Scale */}
       <div
         style={{
-          height: "24px",
+          height: '24px',
           background:
-            "linear-gradient(90deg, #ff0000 0%, #ff8800 15%, #ffff00 30%, #00ff00 45%, #00ffff 60%, #0088ff 75%, #8800ff 90%, #ff00ff 100%)",
-          display: "flex",
-          alignItems: "center",
-          justifyContent: "space-around",
-          fontSize: "10px",
-          color: "#000",
-          fontWeight: "700",
+            'linear-gradient(90deg, #ff0000 0%, #ff8800 15%, #ffff00 30%, #00ff00 45%, #00ffff 60%, #0088ff 75%, #8800ff 90%, #ff00ff 100%)',
+          display: 'flex',
+          alignItems: 'center',
+          justifyContent: 'space-around',
+          fontSize: '10px',
+          color: '#000',
+          fontWeight: '700',
         }}
       >
-        <span>{t("app.units.mhz")}</span>
+        <span>{t('app.units.mhz')}</span>
         <span>5</span>
         <span>10</span>
         <span>15</span>
@@ -600,45 +509,45 @@ export default function ClassicLayout(props) {
         <span>35</span>
       </div>
     </div>
-  ) : config.layout === "tablet" ? (
+  ) : config.layout === 'tablet' ? (
     /* TABLET LAYOUT - Optimized for 7-10" widescreen displays (16:9) */
     <div
       style={{
-        width: "100vw",
-        height: "100vh",
-        display: "flex",
-        flexDirection: "column",
-        background: "var(--bg-primary)",
-        fontFamily: "JetBrains Mono, monospace",
-        overflow: "hidden",
+        width: '100vw',
+        height: '100vh',
+        display: 'flex',
+        flexDirection: 'column',
+        background: 'var(--bg-primary)',
+        fontFamily: 'JetBrains Mono, monospace',
+        overflow: 'hidden',
       }}
     >
       {/* COMPACT TOP BAR */}
       <div
         style={{
-          display: "flex",
-          alignItems: "center",
-          justifyContent: "space-between",
-          background: "var(--bg-panel)",
-          borderBottom: "1px solid var(--border-color)",
-          padding: "6px 12px",
-          height: "52px",
+          display: 'flex',
+          alignItems: 'center',
+          justifyContent: 'space-between',
+          background: 'var(--bg-panel)',
+          borderBottom: '1px solid var(--border-color)',
+          padding: '6px 12px',
+          height: '52px',
           flexShrink: 0,
-          gap: "10px",
+          gap: '10px',
         }}
       >
         {/* Callsign */}
         <span
           style={{
-            fontSize: "28px",
-            fontWeight: "900",
-            color: "var(--accent-amber)",
-            fontFamily: "Orbitron, monospace",
-            cursor: "pointer",
-            whiteSpace: "nowrap",
+            fontSize: '28px',
+            fontWeight: '900',
+            color: 'var(--accent-amber)',
+            fontFamily: 'Orbitron, monospace',
+            cursor: 'pointer',
+            whiteSpace: 'nowrap',
           }}
           onClick={() => setShowSettings(true)}
-          title={t("app.settings.title")}
+          title={t('app.settings.title')}
         >
           {config.callsign}
         </span>
@@ -646,26 +555,26 @@ export default function ClassicLayout(props) {
         {/* UTC */}
         <div
           style={{
-            display: "flex",
-            alignItems: "center",
-            gap: "4px",
-            whiteSpace: "nowrap",
+            display: 'flex',
+            alignItems: 'center',
+            gap: '4px',
+            whiteSpace: 'nowrap',
           }}
         >
           <span
             style={{
-              fontSize: "14px",
-              color: "var(--text-muted)",
-              fontWeight: "600",
+              fontSize: '14px',
+              color: 'var(--text-muted)',
+              fontWeight: '600',
             }}
           >
-            {t("app.time.utc")}
+            {t('app.time.utc')}
           </span>
           <span
             style={{
-              fontSize: "24px",
-              fontWeight: "700",
-              color: "var(--accent-cyan)",
+              fontSize: '24px',
+              fontWeight: '700',
+              color: 'var(--accent-cyan)',
             }}
           >
             {utcTime}
@@ -675,31 +584,31 @@ export default function ClassicLayout(props) {
         {/* Local */}
         <div
           style={{
-            display: "flex",
-            alignItems: "center",
-            gap: "4px",
-            cursor: "pointer",
-            whiteSpace: "nowrap",
+            display: 'flex',
+            alignItems: 'center',
+            gap: '4px',
+            cursor: 'pointer',
+            whiteSpace: 'nowrap',
           }}
           onClick={handleTimeFormatToggle}
-          title={t("app.time.toggleFormat", {
-            format: use12Hour ? "24h" : "12h",
+          title={t('app.time.toggleFormat', {
+            format: use12Hour ? '24h' : '12h',
           })}
         >
           <span
             style={{
-              fontSize: "14px",
-              color: "var(--text-muted)",
-              fontWeight: "600",
+              fontSize: '14px',
+              color: 'var(--text-muted)',
+              fontWeight: '600',
             }}
           >
-            {t("app.time.locShort")}
+            {t('app.time.locShort')}
           </span>
           <span
             style={{
-              fontSize: "24px",
-              fontWeight: "700",
-              color: "var(--accent-amber)",
+              fontSize: '24px',
+              fontWeight: '700',
+              color: 'var(--accent-amber)',
             }}
           >
             {localTime}
@@ -709,63 +618,50 @@ export default function ClassicLayout(props) {
         {/* Solar Quick Stats */}
         <div
           style={{
-            display: "flex",
-            gap: "10px",
-            fontSize: "15px",
-            whiteSpace: "nowrap",
+            display: 'flex',
+            gap: '10px',
+            fontSize: '15px',
+            whiteSpace: 'nowrap',
           }}
         >
           <span>
-            <span style={{ color: "var(--text-muted)" }}>
-              {t("app.solar.sfiShort")}{" "}
-            </span>
-            <span style={{ color: "var(--accent-amber)", fontWeight: "700" }}>
-              {solarIndices?.data?.sfi?.current ||
-                spaceWeather?.data?.solarFlux ||
-                "--"}
+            <span style={{ color: 'var(--text-muted)' }}>{t('app.solar.sfiShort')} </span>
+            <span style={{ color: 'var(--accent-amber)', fontWeight: '700' }}>
+              {solarIndices?.data?.sfi?.current || spaceWeather?.data?.solarFlux || '--'}
             </span>
           </span>
           <span>
-            <span style={{ color: "var(--text-muted)" }}>
-              {t("app.solar.kpShort")}{" "}
-            </span>
+            <span style={{ color: 'var(--text-muted)' }}>{t('app.solar.kpShort')} </span>
             <span
               style={{
                 color:
-                  parseInt(
-                    solarIndices?.data?.kp?.current ??
-                      spaceWeather?.data?.kIndex,
-                  ) >= 4
-                    ? "var(--accent-red)"
-                    : "var(--accent-green)",
-                fontWeight: "700",
+                  parseInt(solarIndices?.data?.kp?.current ?? spaceWeather?.data?.kIndex) >= 4
+                    ? 'var(--accent-red)'
+                    : 'var(--accent-green)',
+                fontWeight: '700',
               }}
             >
-              {solarIndices?.data?.kp?.current ??
-                spaceWeather?.data?.kIndex ??
-                "--"}
+              {solarIndices?.data?.kp?.current ?? spaceWeather?.data?.kIndex ?? '--'}
             </span>
           </span>
           <span>
-            <span style={{ color: "var(--text-muted)" }}>
-              {t("app.solar.ssnShort")}{" "}
-            </span>
-            <span style={{ color: "var(--accent-cyan)", fontWeight: "700" }}>
-              {solarIndices?.data?.ssn?.current || "--"}
+            <span style={{ color: 'var(--text-muted)' }}>{t('app.solar.ssnShort')} </span>
+            <span style={{ color: 'var(--accent-cyan)', fontWeight: '700' }}>
+              {solarIndices?.data?.ssn?.current || '--'}
             </span>
           </span>
           {bandConditions?.extras?.aIndex && (
             <span>
-              <span style={{ color: "var(--text-muted)" }}>A </span>
+              <span style={{ color: 'var(--text-muted)' }}>A </span>
               <span
                 style={{
                   color:
                     parseInt(bandConditions.extras.aIndex) >= 20
-                      ? "var(--accent-red)"
+                      ? 'var(--accent-red)'
                       : parseInt(bandConditions.extras.aIndex) >= 10
-                        ? "var(--accent-amber)"
-                        : "var(--accent-green)",
-                  fontWeight: "700",
+                        ? 'var(--accent-amber)'
+                        : 'var(--accent-green)',
+                  fontWeight: '700',
                 }}
               >
                 {bandConditions.extras.aIndex}
@@ -775,15 +671,15 @@ export default function ClassicLayout(props) {
           {bandConditions?.extras?.geomagField && (
             <span
               style={{
-                fontSize: "12px",
+                fontSize: '12px',
                 color:
-                  bandConditions.extras.geomagField === "QUIET"
-                    ? "var(--accent-green)"
-                    : bandConditions.extras.geomagField === "ACTIVE" ||
-                        bandConditions.extras.geomagField.includes("STORM")
-                      ? "var(--accent-red)"
-                      : "var(--accent-amber)",
-                fontWeight: "600",
+                  bandConditions.extras.geomagField === 'QUIET'
+                    ? 'var(--accent-green)'
+                    : bandConditions.extras.geomagField === 'ACTIVE' ||
+                        bandConditions.extras.geomagField.includes('STORM')
+                      ? 'var(--accent-red)'
+                      : 'var(--accent-amber)',
+                fontWeight: '600',
               }}
             >
               {bandConditions.extras.geomagField}
@@ -792,27 +688,27 @@ export default function ClassicLayout(props) {
         </div>
 
         {/* Controls */}
-        <div style={{ display: "flex", gap: "4px" }}>
+        <div style={{ display: 'flex', gap: '4px' }}>
           {!isFullscreen && (
             <a
               href="https://www.paypal.com/donate/?hosted_button_id=MMYPQBLA6SW68"
               target="_blank"
               rel="noopener noreferrer"
               style={{
-                background: "linear-gradient(135deg, #0070ba 0%, #003087 100%)",
-                border: "none",
-                padding: "4px 8px",
-                borderRadius: "4px",
-                color: "#fff",
-                fontSize: "11px",
-                fontWeight: "600",
-                textDecoration: "none",
-                display: "flex",
-                alignItems: "center",
-                cursor: "pointer",
-                whiteSpace: "nowrap",
+                background: 'linear-gradient(135deg, #0070ba 0%, #003087 100%)',
+                border: 'none',
+                padding: '4px 8px',
+                borderRadius: '4px',
+                color: '#fff',
+                fontSize: '11px',
+                fontWeight: '600',
+                textDecoration: 'none',
+                display: 'flex',
+                alignItems: 'center',
+                cursor: 'pointer',
+                whiteSpace: 'nowrap',
               }}
-              title={t("app.donate.paypal")}
+              title={t('app.donate.paypal')}
             >
               💳
             </a>
@@ -820,13 +716,13 @@ export default function ClassicLayout(props) {
           <button
             onClick={() => setShowSettings(true)}
             style={{
-              background: "var(--bg-tertiary)",
-              border: "1px solid var(--border-color)",
-              padding: "4px 8px",
-              borderRadius: "4px",
-              color: "var(--text-secondary)",
-              fontSize: "12px",
-              cursor: "pointer",
+              background: 'var(--bg-tertiary)',
+              border: '1px solid var(--border-color)',
+              padding: '4px 8px',
+              borderRadius: '4px',
+              color: 'var(--text-secondary)',
+              fontSize: '12px',
+              cursor: 'pointer',
             }}
           >
             ⚙
@@ -834,24 +730,24 @@ export default function ClassicLayout(props) {
           <button
             onClick={handleFullscreenToggle}
             style={{
-              background: "var(--bg-tertiary)",
-              border: "1px solid var(--border-color)",
-              padding: "4px 8px",
-              borderRadius: "4px",
-              color: "var(--text-secondary)",
-              fontSize: "12px",
-              cursor: "pointer",
+              background: 'var(--bg-tertiary)',
+              border: '1px solid var(--border-color)',
+              padding: '4px 8px',
+              borderRadius: '4px',
+              color: 'var(--text-secondary)',
+              fontSize: '12px',
+              cursor: 'pointer',
             }}
           >
-            {isFullscreen ? "⛶" : "⛶"}
+            {isFullscreen ? '⛶' : '⛶'}
           </button>
         </div>
       </div>
 
       {/* MAIN AREA: Map + Data Sidebar */}
-      <div style={{ flex: 1, display: "flex", overflow: "hidden" }}>
+      <div style={{ flex: 1, display: 'flex', overflow: 'hidden' }}>
         {/* MAP */}
-        <div style={{ flex: 1, position: "relative" }}>
+        <div style={{ flex: 1, position: 'relative' }}>
           <WorldMap
             deLocation={config.location}
             dxLocation={dxLocation}
@@ -886,45 +782,41 @@ export default function ClassicLayout(props) {
           {/* DX Lock button overlay — bottom-left to avoid WorldMap's SAT/CALLS buttons at top */}
           <button
             onClick={handleToggleDxLock}
-            title={
-              dxLocked
-                ? t("app.dxLock.unlockTooltip")
-                : t("app.dxLock.lockTooltip")
-            }
+            title={dxLocked ? t('app.dxLock.unlockTooltip') : t('app.dxLock.lockTooltip')}
             style={{
-              position: "absolute",
-              bottom: "40px",
-              left: "10px",
-              background: dxLocked ? "rgba(255,180,0,0.9)" : "rgba(0,0,0,0.7)",
-              border: "1px solid #444",
-              color: dxLocked ? "#000" : "#fff",
-              padding: "6px 12px",
-              fontSize: "12px",
-              cursor: "pointer",
-              borderRadius: "4px",
+              position: 'absolute',
+              bottom: '40px',
+              left: '10px',
+              background: dxLocked ? 'rgba(255,180,0,0.9)' : 'rgba(0,0,0,0.7)',
+              border: '1px solid #444',
+              color: dxLocked ? '#000' : '#fff',
+              padding: '6px 12px',
+              fontSize: '12px',
+              cursor: 'pointer',
+              borderRadius: '4px',
               zIndex: 1000,
             }}
           >
-            {dxLocked ? t("app.dxLock.locked") : t("app.dxLock.unlocked")}
+            {dxLocked ? t('app.dxLock.locked') : t('app.dxLock.unlocked')}
           </button>
           {/* Compact Band Legend */}
           <div
             style={{
-              position: "absolute",
-              bottom: "4px",
-              left: "50%",
-              transform: "translateX(-50%)",
-              background: "rgba(0,0,0,0.8)",
-              border: "1px solid #444",
-              borderRadius: "4px",
-              padding: "3px 6px",
+              position: 'absolute',
+              bottom: '4px',
+              left: '50%',
+              transform: 'translateX(-50%)',
+              background: 'rgba(0,0,0,0.8)',
+              border: '1px solid #444',
+              borderRadius: '4px',
+              padding: '3px 6px',
               zIndex: 1000,
-              display: "flex",
-              gap: "3px",
-              alignItems: "center",
-              fontSize: "9px",
-              fontFamily: "JetBrains Mono, monospace",
-              fontWeight: "700",
+              display: 'flex',
+              gap: '3px',
+              alignItems: 'center',
+              fontSize: '9px',
+              fontFamily: 'JetBrains Mono, monospace',
+              fontWeight: '700',
             }}
           >
             {mapLegendBands.map((band) => (
@@ -932,9 +824,9 @@ export default function ClassicLayout(props) {
                 key={band}
                 style={{
                   background: getBandColorForBand(`${band}m`),
-                  color: "#000",
-                  padding: "1px 3px",
-                  borderRadius: "2px",
+                  color: '#000',
+                  padding: '1px 3px',
+                  borderRadius: '2px',
                   lineHeight: 1.2,
                 }}
               >
@@ -947,57 +839,57 @@ export default function ClassicLayout(props) {
         {/* DATA SIDEBAR */}
         <div
           style={{
-            width: "280px",
+            width: '280px',
             flexShrink: 0,
-            display: "flex",
-            flexDirection: "column",
-            borderLeft: "1px solid var(--border-color)",
-            background: "var(--bg-secondary)",
-            overflow: "hidden",
+            display: 'flex',
+            flexDirection: 'column',
+            borderLeft: '1px solid var(--border-color)',
+            background: 'var(--bg-secondary)',
+            overflow: 'hidden',
           }}
         >
           {/* Band Conditions Grid */}
           <div
             style={{
-              padding: "8px",
-              borderBottom: "1px solid var(--border-color)",
+              padding: '8px',
+              borderBottom: '1px solid var(--border-color)',
             }}
           >
             <div
               style={{
-                fontSize: "13px",
-                color: "var(--accent-amber)",
-                fontWeight: "700",
-                marginBottom: "6px",
-                textTransform: "uppercase",
-                letterSpacing: "0.5px",
+                fontSize: '13px',
+                color: 'var(--accent-amber)',
+                fontWeight: '700',
+                marginBottom: '6px',
+                textTransform: 'uppercase',
+                letterSpacing: '0.5px',
               }}
             >
-              {t("band.conditions")}
+              {t('band.conditions')}
             </div>
             <div
               style={{
-                display: "grid",
-                gridTemplateColumns: "repeat(4, 1fr)",
-                gap: "4px",
+                display: 'grid',
+                gridTemplateColumns: 'repeat(4, 1fr)',
+                gap: '4px',
               }}
             >
               {(bandConditions?.data || []).slice(0, 13).map((band, idx) => {
                 const colors = {
                   GOOD: {
-                    bg: "rgba(0,255,136,0.2)",
-                    color: "#00ff88",
-                    border: "rgba(0,255,136,0.4)",
+                    bg: 'rgba(0,255,136,0.2)',
+                    color: '#00ff88',
+                    border: 'rgba(0,255,136,0.4)',
                   },
                   FAIR: {
-                    bg: "rgba(255,180,50,0.2)",
-                    color: "#ffb432",
-                    border: "rgba(255,180,50,0.4)",
+                    bg: 'rgba(255,180,50,0.2)',
+                    color: '#ffb432',
+                    border: 'rgba(255,180,50,0.4)',
                   },
                   POOR: {
-                    bg: "rgba(255,68,102,0.2)",
-                    color: "#ff4466",
-                    border: "rgba(255,68,102,0.4)",
+                    bg: 'rgba(255,68,102,0.2)',
+                    color: '#ff4466',
+                    border: 'rgba(255,68,102,0.4)',
                   },
                 };
                 const s = colors[band.condition] || colors.FAIR;
@@ -1007,16 +899,16 @@ export default function ClassicLayout(props) {
                     style={{
                       background: s.bg,
                       border: `1px solid ${s.border}`,
-                      borderRadius: "4px",
-                      padding: "5px 2px",
-                      textAlign: "center",
+                      borderRadius: '4px',
+                      padding: '5px 2px',
+                      textAlign: 'center',
                     }}
                   >
                     <div
                       style={{
-                        fontFamily: "Orbitron, monospace",
-                        fontSize: "15px",
-                        fontWeight: "700",
+                        fontFamily: 'Orbitron, monospace',
+                        fontSize: '15px',
+                        fontWeight: '700',
                         color: s.color,
                       }}
                     >
@@ -1024,8 +916,8 @@ export default function ClassicLayout(props) {
                     </div>
                     <div
                       style={{
-                        fontSize: "10px",
-                        fontWeight: "600",
+                        fontSize: '10px',
+                        fontWeight: '600',
                         color: s.color,
                         opacity: 0.8,
                       }}
@@ -1040,28 +932,20 @@ export default function ClassicLayout(props) {
             {propagation.data && (
               <div
                 style={{
-                  display: "flex",
-                  gap: "12px",
-                  marginTop: "6px",
-                  fontSize: "14px",
-                  justifyContent: "center",
+                  display: 'flex',
+                  gap: '12px',
+                  marginTop: '6px',
+                  fontSize: '14px',
+                  justifyContent: 'center',
                 }}
               >
                 <span>
-                  <span style={{ color: "var(--text-muted)" }}>
-                    {t("app.propagation.muf")}{" "}
-                  </span>
-                  <span style={{ color: "#ff8800", fontWeight: "700" }}>
-                    {propagation.data.muf || "?"}
-                  </span>
+                  <span style={{ color: 'var(--text-muted)' }}>{t('app.propagation.muf')} </span>
+                  <span style={{ color: '#ff8800', fontWeight: '700' }}>{propagation.data.muf || '?'}</span>
                 </span>
                 <span>
-                  <span style={{ color: "var(--text-muted)" }}>
-                    {t("app.propagation.luf")}{" "}
-                  </span>
-                  <span style={{ color: "#00aaff", fontWeight: "700" }}>
-                    {propagation.data.luf || "?"}
-                  </span>
+                  <span style={{ color: 'var(--text-muted)' }}>{t('app.propagation.luf')} </span>
+                  <span style={{ color: '#00aaff', fontWeight: '700' }}>{propagation.data.luf || '?'}</span>
                 </span>
               </div>
             )}
@@ -1071,60 +955,55 @@ export default function ClassicLayout(props) {
           <div
             style={{
               flex: 1,
-              overflow: "hidden",
-              display: "flex",
-              flexDirection: "column",
+              overflow: 'hidden',
+              display: 'flex',
+              flexDirection: 'column',
             }}
           >
             <div
               style={{
-                padding: "6px 8px",
-                borderBottom: "1px solid var(--border-color)",
-                display: "flex",
-                justifyContent: "space-between",
-                alignItems: "center",
+                padding: '6px 8px',
+                borderBottom: '1px solid var(--border-color)',
+                display: 'flex',
+                justifyContent: 'space-between',
+                alignItems: 'center',
               }}
             >
               <span
                 style={{
-                  fontSize: "14px",
-                  color: "var(--accent-red)",
-                  fontWeight: "700",
-                  textTransform: "uppercase",
+                  fontSize: '14px',
+                  color: 'var(--accent-red)',
+                  fontWeight: '700',
+                  textTransform: 'uppercase',
                 }}
               >
-                {t("app.dxCluster.title")}
+                {t('app.dxCluster.title')}
               </span>
-              <span style={{ fontSize: "12px", color: "var(--text-muted)" }}>
-                {t("app.dxCluster.spotsCount", {
+              <span style={{ fontSize: '12px', color: 'var(--text-muted)' }}>
+                {t('app.dxCluster.spotsCount', {
                   count: dxClusterData.spots?.length || 0,
                 })}
               </span>
             </div>
-            <div style={{ flex: 1, overflowY: "auto" }}>
+            <div style={{ flex: 1, overflowY: 'auto' }}>
               {dxClusterData.spots?.slice(0, 30).map((spot, i) => (
                 <div
                   key={i}
                   style={{
-                    padding: "3px 8px",
-                    display: "grid",
-                    gridTemplateColumns: "80px 1fr 52px",
-                    gap: "4px",
-                    borderBottom: "1px solid rgba(255,255,255,0.05)",
-                    cursor: "pointer",
-                    background:
-                      hoveredSpot?.call === spot.call
-                        ? "var(--bg-tertiary)"
-                        : "transparent",
-                    fontSize: "14px",
+                    padding: '3px 8px',
+                    display: 'grid',
+                    gridTemplateColumns: '80px 1fr 52px',
+                    gap: '4px',
+                    borderBottom: '1px solid rgba(255,255,255,0.05)',
+                    cursor: 'pointer',
+                    background: hoveredSpot?.call === spot.call ? 'var(--bg-tertiary)' : 'transparent',
+                    fontSize: '14px',
                   }}
                   onMouseEnter={() => setHoveredSpot(spot)}
                   onMouseLeave={() => setHoveredSpot(null)}
                   onClick={() => {
                     tuneTo(spot);
-                    const path = (dxClusterData.paths || []).find(
-                      (p) => p.dxCall === spot.call,
-                    );
+                    const path = (dxClusterData.paths || []).find((p) => p.dxCall === spot.call);
                     if (path && path.dxLat != null && path.dxLon != null) {
                       handleDXChange({ lat: path.dxLat, lon: path.dxLon });
                     }
@@ -1133,11 +1012,9 @@ export default function ClassicLayout(props) {
                   <span
                     style={{
                       color: getBandColor(
-                        parseFloat(spot.freq) > 1000
-                          ? parseFloat(spot.freq) / 1000
-                          : parseFloat(spot.freq),
+                        parseFloat(spot.freq) > 1000 ? parseFloat(spot.freq) / 1000 : parseFloat(spot.freq),
                       ),
-                      fontWeight: "700",
+                      fontWeight: '700',
                     }}
                   >
                     {(() => {
@@ -1147,27 +1024,23 @@ export default function ClassicLayout(props) {
                   </span>
                   <span
                     style={{
-                      color: "var(--accent-cyan)",
-                      fontWeight: "600",
-                      overflow: "hidden",
-                      textOverflow: "ellipsis",
-                      whiteSpace: "nowrap",
+                      color: 'var(--accent-cyan)',
+                      fontWeight: '600',
+                      overflow: 'hidden',
+                      textOverflow: 'ellipsis',
+                      whiteSpace: 'nowrap',
                     }}
                   >
-                    <CallsignLink
-                      call={spot.call}
-                      color="var(--accent-cyan)"
-                      fontWeight="600"
-                    />
+                    <CallsignLink call={spot.call} color="var(--accent-cyan)" fontWeight="600" />
                   </span>
                   <span
                     style={{
-                      color: "var(--text-muted)",
-                      textAlign: "right",
-                      fontSize: "12px",
+                      color: 'var(--text-muted)',
+                      textAlign: 'right',
+                      fontSize: '12px',
                     }}
                   >
-                    {spot.time || "--"}
+                    {spot.time || '--'}
                   </span>
                 </div>
               ))}
@@ -1179,11 +1052,11 @@ export default function ClassicLayout(props) {
             <div
               style={{
                 flexShrink: 0,
-                borderTop: "1px solid var(--border-color)",
-                background: "var(--bg-panel)",
-                height: "28px",
-                position: "relative",
-                overflow: "hidden",
+                borderTop: '1px solid var(--border-color)',
+                background: 'var(--bg-panel)',
+                height: '28px',
+                position: 'relative',
+                overflow: 'hidden',
               }}
             >
               <DXNewsTicker sidebar={true} />
@@ -1192,129 +1065,124 @@ export default function ClassicLayout(props) {
         </div>
       </div>
     </div>
-  ) : config.layout === "compact" ? (
+  ) : config.layout === 'compact' ? (
     /* COMPACT LAYOUT - Optimized for 4:3 screens and data-first display */
     <div
       style={{
-        width: "100vw",
-        height: "100vh",
-        display: "flex",
-        flexDirection: "column",
-        background: "var(--bg-primary)",
-        fontFamily: "JetBrains Mono, monospace",
-        overflow: "hidden",
+        width: '100vw',
+        height: '100vh',
+        display: 'flex',
+        flexDirection: 'column',
+        background: 'var(--bg-primary)',
+        fontFamily: 'JetBrains Mono, monospace',
+        overflow: 'hidden',
       }}
     >
       {/* TOP: Callsign + Times + Solar */}
       <div
         style={{
-          background: "var(--bg-panel)",
-          borderBottom: "1px solid var(--border-color)",
-          padding: "8px 12px",
+          background: 'var(--bg-panel)',
+          borderBottom: '1px solid var(--border-color)',
+          padding: '8px 12px',
           flexShrink: 0,
         }}
       >
         {/* Row 1: Callsign + Times */}
         <div
           style={{
-            display: "flex",
-            alignItems: "center",
-            justifyContent: "space-between",
-            marginBottom: "6px",
+            display: 'flex',
+            alignItems: 'center',
+            justifyContent: 'space-between',
+            marginBottom: '6px',
           }}
         >
           <span
             style={{
-              fontSize: "32px",
-              fontWeight: "900",
-              color: "var(--accent-amber)",
-              fontFamily: "Orbitron, monospace",
-              cursor: "pointer",
+              fontSize: '32px',
+              fontWeight: '900',
+              color: 'var(--accent-amber)',
+              fontFamily: 'Orbitron, monospace',
+              cursor: 'pointer',
             }}
             onClick={() => setShowSettings(true)}
-            title={t("app.settings.title")}
+            title={t('app.settings.title')}
           >
             {config.callsign}
           </span>
-          <div style={{ display: "flex", gap: "20px", alignItems: "center" }}>
-            <div style={{ textAlign: "center" }}>
+          <div style={{ display: 'flex', gap: '20px', alignItems: 'center' }}>
+            <div style={{ textAlign: 'center' }}>
               <div
                 style={{
-                  fontSize: "11px",
-                  color: "var(--text-muted)",
-                  textTransform: "uppercase",
-                  fontWeight: "600",
+                  fontSize: '11px',
+                  color: 'var(--text-muted)',
+                  textTransform: 'uppercase',
+                  fontWeight: '600',
                 }}
               >
-                {t("app.time.utc")}
+                {t('app.time.utc')}
               </div>
               <div
                 style={{
-                  fontSize: "28px",
-                  fontWeight: "700",
-                  color: "var(--accent-cyan)",
+                  fontSize: '28px',
+                  fontWeight: '700',
+                  color: 'var(--accent-cyan)',
                   lineHeight: 1,
                 }}
               >
                 {utcTime}
               </div>
-              <div style={{ fontSize: "12px", color: "var(--text-muted)" }}>
-                {utcDate}
-              </div>
+              <div style={{ fontSize: '12px', color: 'var(--text-muted)' }}>{utcDate}</div>
             </div>
             <div
-              style={{ textAlign: "center", cursor: "pointer" }}
+              style={{ textAlign: 'center', cursor: 'pointer' }}
               onClick={handleTimeFormatToggle}
-              title={t("app.time.toggleFormat", {
-                format: use12Hour ? "24h" : "12h",
+              title={t('app.time.toggleFormat', {
+                format: use12Hour ? '24h' : '12h',
               })}
             >
               <div
                 style={{
-                  fontSize: "11px",
-                  color: "var(--text-muted)",
-                  textTransform: "uppercase",
-                  fontWeight: "600",
+                  fontSize: '11px',
+                  color: 'var(--text-muted)',
+                  textTransform: 'uppercase',
+                  fontWeight: '600',
                 }}
               >
-                {t("app.time.local")}
+                {t('app.time.local')}
               </div>
               <div
                 style={{
-                  fontSize: "28px",
-                  fontWeight: "700",
-                  color: "var(--accent-amber)",
+                  fontSize: '28px',
+                  fontWeight: '700',
+                  color: 'var(--accent-amber)',
                   lineHeight: 1,
                 }}
               >
                 {localTime}
               </div>
-              <div style={{ fontSize: "12px", color: "var(--text-muted)" }}>
-                {localDate}
-              </div>
+              <div style={{ fontSize: '12px', color: 'var(--text-muted)' }}>{localDate}</div>
             </div>
           </div>
-          <div style={{ display: "flex", gap: "4px" }}>
+          <div style={{ display: 'flex', gap: '4px' }}>
             {!isFullscreen && (
               <a
                 href="https://www.paypal.com/donate/?hosted_button_id=MMYPQBLA6SW68"
                 target="_blank"
                 rel="noopener noreferrer"
                 style={{
-                  background:
-                    "linear-gradient(135deg, #0070ba 0%, #003087 100%)",
-                  border: "none",
-                  padding: "6px 10px",
-                  borderRadius: "4px",
-                  color: "#fff",
-                  fontSize: "13px",
-                  fontWeight: "600",
-                  textDecoration: "none",
-                  display: "flex",
-                  alignItems: "center",
-                  cursor: "pointer",
+                  background: 'linear-gradient(135deg, #0070ba 0%, #003087 100%)',
+                  border: 'none',
+                  padding: '6px 10px',
+                  borderRadius: '4px',
+                  color: '#fff',
+                  fontSize: '13px',
+                  fontWeight: '600',
+                  textDecoration: 'none',
+                  display: 'flex',
+                  alignItems: 'center',
+                  cursor: 'pointer',
                 }}
-                title={t("app.donate.paypal")}
+                title={t('app.donate.paypal')}
               >
                 💳
               </a>
@@ -1322,13 +1190,13 @@ export default function ClassicLayout(props) {
             <button
               onClick={() => setShowSettings(true)}
               style={{
-                background: "var(--bg-tertiary)",
-                border: "1px solid var(--border-color)",
-                padding: "6px 10px",
-                borderRadius: "4px",
-                color: "var(--text-secondary)",
-                fontSize: "14px",
-                cursor: "pointer",
+                background: 'var(--bg-tertiary)',
+                border: '1px solid var(--border-color)',
+                padding: '6px 10px',
+                borderRadius: '4px',
+                color: 'var(--text-secondary)',
+                fontSize: '14px',
+                cursor: 'pointer',
               }}
             >
               ⚙
@@ -1336,13 +1204,13 @@ export default function ClassicLayout(props) {
             <button
               onClick={handleFullscreenToggle}
               style={{
-                background: "var(--bg-tertiary)",
-                border: "1px solid var(--border-color)",
-                padding: "6px 10px",
-                borderRadius: "4px",
-                color: "var(--text-secondary)",
-                fontSize: "14px",
-                cursor: "pointer",
+                background: 'var(--bg-tertiary)',
+                border: '1px solid var(--border-color)',
+                padding: '6px 10px',
+                borderRadius: '4px',
+                color: 'var(--text-secondary)',
+                fontSize: '14px',
+                cursor: 'pointer',
               }}
             >
               ⛶
@@ -1352,64 +1220,51 @@ export default function ClassicLayout(props) {
         {/* Row 2: Solar indices inline */}
         <div
           style={{
-            display: "flex",
-            gap: "16px",
-            fontSize: "15px",
-            justifyContent: "center",
-            flexWrap: "wrap",
+            display: 'flex',
+            gap: '16px',
+            fontSize: '15px',
+            justifyContent: 'center',
+            flexWrap: 'wrap',
           }}
         >
           <span>
-            <span style={{ color: "var(--text-muted)" }}>
-              {t("app.solar.sfiShort")}{" "}
-            </span>
-            <span style={{ color: "var(--accent-amber)", fontWeight: "700" }}>
-              {solarIndices?.data?.sfi?.current ||
-                spaceWeather?.data?.solarFlux ||
-                "--"}
+            <span style={{ color: 'var(--text-muted)' }}>{t('app.solar.sfiShort')} </span>
+            <span style={{ color: 'var(--accent-amber)', fontWeight: '700' }}>
+              {solarIndices?.data?.sfi?.current || spaceWeather?.data?.solarFlux || '--'}
             </span>
           </span>
           <span>
-            <span style={{ color: "var(--text-muted)" }}>
-              {t("app.solar.kpShort")}{" "}
-            </span>
+            <span style={{ color: 'var(--text-muted)' }}>{t('app.solar.kpShort')} </span>
             <span
               style={{
                 color:
-                  parseInt(
-                    solarIndices?.data?.kp?.current ??
-                      spaceWeather?.data?.kIndex,
-                  ) >= 4
-                    ? "var(--accent-red)"
-                    : "var(--accent-green)",
-                fontWeight: "700",
+                  parseInt(solarIndices?.data?.kp?.current ?? spaceWeather?.data?.kIndex) >= 4
+                    ? 'var(--accent-red)'
+                    : 'var(--accent-green)',
+                fontWeight: '700',
               }}
             >
-              {solarIndices?.data?.kp?.current ??
-                spaceWeather?.data?.kIndex ??
-                "--"}
+              {solarIndices?.data?.kp?.current ?? spaceWeather?.data?.kIndex ?? '--'}
             </span>
           </span>
           <span>
-            <span style={{ color: "var(--text-muted)" }}>
-              {t("app.solar.ssnShort")}{" "}
-            </span>
-            <span style={{ color: "var(--accent-cyan)", fontWeight: "700" }}>
-              {solarIndices?.data?.ssn?.current || "--"}
+            <span style={{ color: 'var(--text-muted)' }}>{t('app.solar.ssnShort')} </span>
+            <span style={{ color: 'var(--accent-cyan)', fontWeight: '700' }}>
+              {solarIndices?.data?.ssn?.current || '--'}
             </span>
           </span>
           {bandConditions?.extras?.aIndex && (
             <span>
-              <span style={{ color: "var(--text-muted)" }}>A </span>
+              <span style={{ color: 'var(--text-muted)' }}>A </span>
               <span
                 style={{
                   color:
                     parseInt(bandConditions.extras.aIndex) >= 20
-                      ? "var(--accent-red)"
+                      ? 'var(--accent-red)'
                       : parseInt(bandConditions.extras.aIndex) >= 10
-                        ? "var(--accent-amber)"
-                        : "var(--accent-green)",
-                  fontWeight: "700",
+                        ? 'var(--accent-amber)'
+                        : 'var(--accent-green)',
+                  fontWeight: '700',
                 }}
               >
                 {bandConditions.extras.aIndex}
@@ -1419,15 +1274,15 @@ export default function ClassicLayout(props) {
           {bandConditions?.extras?.geomagField && (
             <span
               style={{
-                fontSize: "12px",
+                fontSize: '12px',
                 color:
-                  bandConditions.extras.geomagField === "QUIET"
-                    ? "var(--accent-green)"
-                    : bandConditions.extras.geomagField === "ACTIVE" ||
-                        bandConditions.extras.geomagField.includes("STORM")
-                      ? "var(--accent-red)"
-                      : "var(--accent-amber)",
-                fontWeight: "600",
+                  bandConditions.extras.geomagField === 'QUIET'
+                    ? 'var(--accent-green)'
+                    : bandConditions.extras.geomagField === 'ACTIVE' ||
+                        bandConditions.extras.geomagField.includes('STORM')
+                      ? 'var(--accent-red)'
+                      : 'var(--accent-amber)',
+                fontWeight: '600',
               }}
             >
               {bandConditions.extras.geomagField}
@@ -1436,31 +1291,24 @@ export default function ClassicLayout(props) {
           {propagation.data && (
             <>
               <span>
-                <span style={{ color: "var(--text-muted)" }}>
-                  {t("app.propagation.muf")}{" "}
-                </span>
-                <span style={{ color: "#ff8800", fontWeight: "600" }}>
-                  {propagation.data.muf || "?"} {t("app.units.mhz")}
+                <span style={{ color: 'var(--text-muted)' }}>{t('app.propagation.muf')} </span>
+                <span style={{ color: '#ff8800', fontWeight: '600' }}>
+                  {propagation.data.muf || '?'} {t('app.units.mhz')}
                 </span>
               </span>
               <span>
-                <span style={{ color: "var(--text-muted)" }}>
-                  {t("app.propagation.luf")}{" "}
-                </span>
-                <span style={{ color: "#00aaff", fontWeight: "600" }}>
-                  {propagation.data.luf || "?"} {t("app.units.mhz")}
+                <span style={{ color: 'var(--text-muted)' }}>{t('app.propagation.luf')} </span>
+                <span style={{ color: '#00aaff', fontWeight: '600' }}>
+                  {propagation.data.luf || '?'} {t('app.units.mhz')}
                 </span>
               </span>
             </>
           )}
           {localWeather?.data && (
             <span>
-              <span style={{ marginRight: "2px" }}>
-                {localWeather.data.icon}
-              </span>
-              <span style={{ color: "var(--accent-cyan)", fontWeight: "600" }}>
-                {localWeather.data.temp}°
-                {localWeather.data.tempUnit || tempUnit}
+              <span style={{ marginRight: '2px' }}>{localWeather.data.icon}</span>
+              <span style={{ color: 'var(--accent-cyan)', fontWeight: '600' }}>
+                {localWeather.data.temp}°{localWeather.data.tempUnit || tempUnit}
               </span>
             </span>
           )}
@@ -1470,36 +1318,36 @@ export default function ClassicLayout(props) {
       {/* BAND CONDITIONS - Full Width */}
       <div
         style={{
-          padding: "8px 12px",
-          borderBottom: "1px solid var(--border-color)",
-          background: "var(--bg-secondary)",
+          padding: '8px 12px',
+          borderBottom: '1px solid var(--border-color)',
+          background: 'var(--bg-secondary)',
           flexShrink: 0,
         }}
       >
         <div
           style={{
-            display: "flex",
-            justifyContent: "center",
-            gap: "5px",
-            flexWrap: "wrap",
+            display: 'flex',
+            justifyContent: 'center',
+            gap: '5px',
+            flexWrap: 'wrap',
           }}
         >
           {(bandConditions?.data || []).slice(0, 13).map((band, idx) => {
             const colors = {
               GOOD: {
-                bg: "rgba(0,255,136,0.2)",
-                color: "#00ff88",
-                border: "rgba(0,255,136,0.4)",
+                bg: 'rgba(0,255,136,0.2)',
+                color: '#00ff88',
+                border: 'rgba(0,255,136,0.4)',
               },
               FAIR: {
-                bg: "rgba(255,180,50,0.2)",
-                color: "#ffb432",
-                border: "rgba(255,180,50,0.4)",
+                bg: 'rgba(255,180,50,0.2)',
+                color: '#ffb432',
+                border: 'rgba(255,180,50,0.4)',
               },
               POOR: {
-                bg: "rgba(255,68,102,0.2)",
-                color: "#ff4466",
-                border: "rgba(255,68,102,0.4)",
+                bg: 'rgba(255,68,102,0.2)',
+                color: '#ff4466',
+                border: 'rgba(255,68,102,0.4)',
               },
             };
             const s = colors[band.condition] || colors.FAIR;
@@ -1509,17 +1357,17 @@ export default function ClassicLayout(props) {
                 style={{
                   background: s.bg,
                   border: `1px solid ${s.border}`,
-                  borderRadius: "4px",
-                  padding: "5px 10px",
-                  textAlign: "center",
-                  minWidth: "58px",
+                  borderRadius: '4px',
+                  padding: '5px 10px',
+                  textAlign: 'center',
+                  minWidth: '58px',
                 }}
               >
                 <div
                   style={{
-                    fontFamily: "Orbitron, monospace",
-                    fontSize: "16px",
-                    fontWeight: "700",
+                    fontFamily: 'Orbitron, monospace',
+                    fontSize: '16px',
+                    fontWeight: '700',
                     color: s.color,
                   }}
                 >
@@ -1527,8 +1375,8 @@ export default function ClassicLayout(props) {
                 </div>
                 <div
                   style={{
-                    fontSize: "11px",
-                    fontWeight: "600",
+                    fontSize: '11px',
+                    fontWeight: '600',
                     color: s.color,
                     opacity: 0.8,
                   }}
@@ -1542,9 +1390,9 @@ export default function ClassicLayout(props) {
       </div>
 
       {/* MAIN: Map + DX Cluster side by side */}
-      <div style={{ flex: 1, display: "flex", overflow: "hidden" }}>
+      <div style={{ flex: 1, display: 'flex', overflow: 'hidden' }}>
         {/* Map */}
-        <div style={{ flex: 1, position: "relative" }}>
+        <div style={{ flex: 1, position: 'relative' }}>
           <WorldMap
             deLocation={config.location}
             dxLocation={dxLocation}
@@ -1578,64 +1426,57 @@ export default function ClassicLayout(props) {
           />
           <div
             style={{
-              position: "absolute",
-              bottom: "26px",
-              left: "50%",
-              transform: "translateX(-50%)",
-              fontSize: "14px",
-              color: "var(--text-muted)",
-              background: "rgba(0,0,0,0.7)",
-              padding: "3px 10px",
-              borderRadius: "4px",
-              display: "flex",
-              alignItems: "center",
-              gap: "8px",
+              position: 'absolute',
+              bottom: '26px',
+              left: '50%',
+              transform: 'translateX(-50%)',
+              fontSize: '14px',
+              color: 'var(--text-muted)',
+              background: 'rgba(0,0,0,0.7)',
+              padding: '3px 10px',
+              borderRadius: '4px',
+              display: 'flex',
+              alignItems: 'center',
+              gap: '8px',
             }}
           >
             <span>
-              {deGrid} → {dxGrid} •{" "}
-              {dxLocked
-                ? t("app.dxLock.lockedShort")
-                : t("app.dxLock.clickToSet")}
+              {deGrid} → {dxGrid} • {dxLocked ? t('app.dxLock.lockedShort') : t('app.dxLock.clickToSet')}
             </span>
             <button
               onClick={handleToggleDxLock}
-              title={
-                dxLocked
-                  ? t("app.dxLock.unlockShort")
-                  : t("app.dxLock.lockShort")
-              }
+              title={dxLocked ? t('app.dxLock.unlockShort') : t('app.dxLock.lockShort')}
               style={{
-                background: dxLocked ? "var(--accent-amber)" : "transparent",
-                color: dxLocked ? "#000" : "var(--text-muted)",
-                border: "none",
-                borderRadius: "3px",
-                padding: "1px 4px",
-                fontSize: "12px",
-                cursor: "pointer",
+                background: dxLocked ? 'var(--accent-amber)' : 'transparent',
+                color: dxLocked ? '#000' : 'var(--text-muted)',
+                border: 'none',
+                borderRadius: '3px',
+                padding: '1px 4px',
+                fontSize: '12px',
+                cursor: 'pointer',
               }}
             >
-              {dxLocked ? "🔒" : "🔓"}
+              {dxLocked ? '🔒' : '🔓'}
             </button>
           </div>
           {/* Compact Band Legend */}
           <div
             style={{
-              position: "absolute",
-              bottom: "4px",
-              left: "50%",
-              transform: "translateX(-50%)",
-              background: "rgba(0,0,0,0.8)",
-              border: "1px solid #444",
-              borderRadius: "4px",
-              padding: "3px 6px",
+              position: 'absolute',
+              bottom: '4px',
+              left: '50%',
+              transform: 'translateX(-50%)',
+              background: 'rgba(0,0,0,0.8)',
+              border: '1px solid #444',
+              borderRadius: '4px',
+              padding: '3px 6px',
               zIndex: 1000,
-              display: "flex",
-              gap: "3px",
-              alignItems: "center",
-              fontSize: "9px",
-              fontFamily: "JetBrains Mono, monospace",
-              fontWeight: "700",
+              display: 'flex',
+              gap: '3px',
+              alignItems: 'center',
+              fontSize: '9px',
+              fontFamily: 'JetBrains Mono, monospace',
+              fontWeight: '700',
             }}
           >
             {mapLegendBands.map((band) => (
@@ -1643,9 +1484,9 @@ export default function ClassicLayout(props) {
                 key={band}
                 style={{
                   background: getBandColorForBand(`${band}m`),
-                  color: "#000",
-                  padding: "1px 3px",
-                  borderRadius: "2px",
+                  color: '#000',
+                  padding: '1px 3px',
+                  borderRadius: '2px',
                   lineHeight: 1.2,
                 }}
               >
@@ -1658,62 +1499,55 @@ export default function ClassicLayout(props) {
         {/* Compact DX Cluster */}
         <div
           style={{
-            width: "250px",
+            width: '250px',
             flexShrink: 0,
-            borderLeft: "1px solid var(--border-color)",
-            background: "var(--bg-secondary)",
-            display: "flex",
-            flexDirection: "column",
-            overflow: "hidden",
+            borderLeft: '1px solid var(--border-color)',
+            background: 'var(--bg-secondary)',
+            display: 'flex',
+            flexDirection: 'column',
+            overflow: 'hidden',
           }}
         >
           <div
             style={{
-              padding: "6px 8px",
-              borderBottom: "1px solid var(--border-color)",
-              display: "flex",
-              justifyContent: "space-between",
-              alignItems: "center",
+              padding: '6px 8px',
+              borderBottom: '1px solid var(--border-color)',
+              display: 'flex',
+              justifyContent: 'space-between',
+              alignItems: 'center',
             }}
           >
             <span
               style={{
-                fontSize: "14px",
-                color: "var(--accent-red)",
-                fontWeight: "700",
-                textTransform: "uppercase",
+                fontSize: '14px',
+                color: 'var(--accent-red)',
+                fontWeight: '700',
+                textTransform: 'uppercase',
               }}
             >
-              {t("app.dxCluster.title")}
-            </span>
-            <span style={{ fontSize: "12px", color: "var(--text-muted)" }}>
-              {dxClusterData.spots?.length || 0}
+              {t('app.dxCluster.title')}
             </span>
+            <span style={{ fontSize: '12px', color: 'var(--text-muted)' }}>{dxClusterData.spots?.length || 0}</span>
           </div>
-          <div style={{ flex: 1, overflowY: "auto" }}>
+          <div style={{ flex: 1, overflowY: 'auto' }}>
             {dxClusterData.spots?.slice(0, 40).map((spot, i) => (
               <div
                 key={i}
                 style={{
-                  padding: "3px 8px",
-                  display: "grid",
-                  gridTemplateColumns: "75px 1fr 50px",
-                  gap: "4px",
-                  borderBottom: "1px solid rgba(255,255,255,0.05)",
-                  cursor: "pointer",
-                  background:
-                    hoveredSpot?.call === spot.call
-                      ? "var(--bg-tertiary)"
-                      : "transparent",
-                  fontSize: "14px",
+                  padding: '3px 8px',
+                  display: 'grid',
+                  gridTemplateColumns: '75px 1fr 50px',
+                  gap: '4px',
+                  borderBottom: '1px solid rgba(255,255,255,0.05)',
+                  cursor: 'pointer',
+                  background: hoveredSpot?.call === spot.call ? 'var(--bg-tertiary)' : 'transparent',
+                  fontSize: '14px',
                 }}
                 onMouseEnter={() => setHoveredSpot(spot)}
                 onMouseLeave={() => setHoveredSpot(null)}
                 onClick={() => {
                   tuneTo(spot);
-                  const path = (dxClusterData.paths || []).find(
-                    (p) => p.dxCall === spot.call,
-                  );
+                  const path = (dxClusterData.paths || []).find((p) => p.dxCall === spot.call);
                   if (path && path.dxLat != null && path.dxLon != null) {
                     handleDXChange({ lat: path.dxLat, lon: path.dxLon });
                   }
@@ -1722,11 +1556,9 @@ export default function ClassicLayout(props) {
                 <span
                   style={{
                     color: getBandColor(
-                      parseFloat(spot.freq) > 1000
-                        ? parseFloat(spot.freq) / 1000
-                        : parseFloat(spot.freq),
+                      parseFloat(spot.freq) > 1000 ? parseFloat(spot.freq) / 1000 : parseFloat(spot.freq),
                     ),
-                    fontWeight: "700",
+                    fontWeight: '700',
                   }}
                 >
                   {(() => {
@@ -1736,27 +1568,23 @@ export default function ClassicLayout(props) {
                 </span>
                 <span
                   style={{
-                    color: "var(--accent-cyan)",
-                    fontWeight: "600",
-                    overflow: "hidden",
-                    textOverflow: "ellipsis",
-                    whiteSpace: "nowrap",
+                    color: 'var(--accent-cyan)',
+                    fontWeight: '600',
+                    overflow: 'hidden',
+                    textOverflow: 'ellipsis',
+                    whiteSpace: 'nowrap',
                   }}
                 >
-                  <CallsignLink
-                    call={spot.call}
-                    color="var(--accent-cyan)"
-                    fontWeight="600"
-                  />
+                  <CallsignLink call={spot.call} color="var(--accent-cyan)" fontWeight="600" />
                 </span>
                 <span
                   style={{
-                    color: "var(--text-muted)",
-                    textAlign: "right",
-                    fontSize: "12px",
+                    color: 'var(--text-muted)',
+                    textAlign: 'right',
+                    fontSize: '12px',
                   }}
                 >
-                  {spot.time || "--"}
+                  {spot.time || '--'}
                 </span>
               </div>
             ))}
@@ -1767,11 +1595,11 @@ export default function ClassicLayout(props) {
             <div
               style={{
                 flexShrink: 0,
-                borderTop: "1px solid var(--border-color)",
-                background: "var(--bg-panel)",
-                height: "28px",
-                position: "relative",
-                overflow: "hidden",
+                borderTop: '1px solid var(--border-color)',
+                background: 'var(--bg-panel)',
+                height: '28px',
+                position: 'relative',
+                overflow: 'hidden',
               }}
             >
               <DXNewsTicker sidebar={true} />
diff --git a/src/layouts/ModernLayout.jsx b/src/layouts/ModernLayout.jsx
index b4d83f02..7d3a527d 100644
--- a/src/layouts/ModernLayout.jsx
+++ b/src/layouts/ModernLayout.jsx
@@ -12,7 +12,7 @@ import {
   DXpeditionPanel,
   PSKReporterPanel,
   WeatherPanel,
-  AnalogClockPanel
+  AnalogClockPanel,
 } from '../components';
 import { useRig } from '../contexts/RigContext.jsx';
 
@@ -95,19 +95,21 @@ export default function ModernLayout(props) {
   };
 
   return (
-    <div style={{
-      width: scale < 1 ? `${100 / scale}vw` : '100vw',
-      height: scale < 1 ? `${100 / scale}vh` : '100vh',
-      transform: `scale(${scale})`,
-      transformOrigin: 'center center',
-      display: 'grid',
-      gridTemplateColumns: getGridTemplateColumns(),
-      gridTemplateRows: '55px 1fr',
-      gap: leftSidebarVisible || rightSidebarVisible ? '8px' : '0',
-      padding: leftSidebarVisible || rightSidebarVisible ? '8px' : '0',
-      overflow: 'hidden',
-      boxSizing: 'border-box'
-    }}>
+    <div
+      style={{
+        width: scale < 1 ? `${100 / scale}vw` : '100vw',
+        height: scale < 1 ? `${100 / scale}vh` : '100vh',
+        transform: `scale(${scale})`,
+        transformOrigin: 'center center',
+        display: 'grid',
+        gridTemplateColumns: getGridTemplateColumns(),
+        gridTemplateRows: '55px 1fr',
+        gap: leftSidebarVisible || rightSidebarVisible ? '8px' : '0',
+        padding: leftSidebarVisible || rightSidebarVisible ? '8px' : '0',
+        overflow: 'hidden',
+        boxSizing: 'border-box',
+      }}
+    >
       {/* TOP BAR */}
       <Header
         config={config}
@@ -139,8 +141,14 @@ export default function ModernLayout(props) {
                 {t('app.dxLocation.deTitle')}
               </div>
               <div style={{ fontFamily: 'JetBrains Mono', fontSize: '14px' }}>
-                <div style={{ color: 'var(--accent-amber)', fontSize: '22px', fontWeight: '700', letterSpacing: '1px' }}>{deGrid}</div>
-                <div style={{ color: 'var(--text-secondary)', fontSize: '13px', marginTop: '4px' }}>{config.location.lat.toFixed(4)}°, {config.location.lon.toFixed(4)}°</div>
+                <div
+                  style={{ color: 'var(--accent-amber)', fontSize: '22px', fontWeight: '700', letterSpacing: '1px' }}
+                >
+                  {deGrid}
+                </div>
+                <div style={{ color: 'var(--text-secondary)', fontSize: '13px', marginTop: '4px' }}>
+                  {config.location.lat.toFixed(4)}°, {config.location.lon.toFixed(4)}°
+                </div>
                 <div style={{ marginTop: '8px', fontSize: '13px' }}>
                   <span style={{ color: 'var(--text-secondary)' }}>☀ </span>
                   <span style={{ color: 'var(--accent-amber)', fontWeight: '600' }}>{deSunTimes.sunrise}</span>
@@ -152,7 +160,12 @@ export default function ModernLayout(props) {
               <WeatherPanel
                 weatherData={localWeather}
                 tempUnit={tempUnit}
-                onTempUnitChange={(unit) => { setTempUnit(unit); try { localStorage.setItem('openhamclock_tempUnit', unit); } catch { } }}
+                onTempUnitChange={(unit) => {
+                  setTempUnit(unit);
+                  try {
+                    localStorage.setItem('openhamclock_tempUnit', unit);
+                  } catch {}
+                }}
               />
             </div>
           )}
@@ -160,7 +173,9 @@ export default function ModernLayout(props) {
           {/* DX Location */}
           {config.panels?.dxLocation?.visible !== false && (
             <div className="panel" style={{ padding: '14px', flex: '0 0 auto' }}>
-              <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', marginBottom: '10px' }}>
+              <div
+                style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', marginBottom: '10px' }}
+              >
                 <div style={{ fontSize: '14px', color: 'var(--accent-green)', fontWeight: '700' }}>
                   {t('app.dxLocation.dxTitle')}
                 </div>
@@ -174,15 +189,27 @@ export default function ModernLayout(props) {
                     borderRadius: '4px',
                     padding: '2px 6px',
                     fontSize: '10px',
-                    cursor: 'pointer'
+                    cursor: 'pointer',
                   }}
                 >
                   {dxLocked ? '🔒' : '🔓'}
                 </button>
               </div>
-              <div style={{ fontFamily: 'JetBrains Mono', fontSize: '14px', display: 'flex', justifyContent: 'space-between', alignItems: 'flex-start' }}>
+              <div
+                style={{
+                  fontFamily: 'JetBrains Mono',
+                  fontSize: '14px',
+                  display: 'flex',
+                  justifyContent: 'space-between',
+                  alignItems: 'flex-start',
+                }}
+              >
                 <div style={{ flex: 1 }}>
-                  <div style={{ color: 'var(--accent-amber)', fontSize: '22px', fontWeight: '700', letterSpacing: '1px' }}>{dxGrid}</div>
+                  <div
+                    style={{ color: 'var(--accent-amber)', fontSize: '22px', fontWeight: '700', letterSpacing: '1px' }}
+                  >
+                    {dxGrid}
+                  </div>
                   {(() => {
                     const utcOffsetH = Math.round(dxLocation.lon / 15);
                     const dxDate = new Date(currentTime.getTime() + utcOffsetH * 3600000);
@@ -190,12 +217,25 @@ export default function ModernLayout(props) {
                     const mm = String(dxDate.getUTCMinutes()).padStart(2, '0');
                     const sign = utcOffsetH >= 0 ? '+' : '';
                     return (
-                      <div style={{ color: 'var(--accent-cyan)', fontSize: '13px', marginTop: '2px', fontFamily: 'JetBrains Mono' }}>
-                        {hh}:{mm} <span style={{ color: 'var(--text-muted)', fontSize: '11px' }}>(UTC{sign}{utcOffsetH})</span>
+                      <div
+                        style={{
+                          color: 'var(--accent-cyan)',
+                          fontSize: '13px',
+                          marginTop: '2px',
+                          fontFamily: 'JetBrains Mono',
+                        }}
+                      >
+                        {hh}:{mm}{' '}
+                        <span style={{ color: 'var(--text-muted)', fontSize: '11px' }}>
+                          (UTC{sign}
+                          {utcOffsetH})
+                        </span>
                       </div>
                     );
                   })()}
-                  <div style={{ color: 'var(--text-secondary)', fontSize: '13px', marginTop: '4px' }}>{dxLocation.lat.toFixed(4)}°, {dxLocation.lon.toFixed(4)}°</div>
+                  <div style={{ color: 'var(--text-secondary)', fontSize: '13px', marginTop: '4px' }}>
+                    {dxLocation.lat.toFixed(4)}°, {dxLocation.lon.toFixed(4)}°
+                  </div>
                   <div style={{ marginTop: '8px', fontSize: '13px' }}>
                     <span style={{ color: 'var(--text-secondary)' }}>☀ </span>
                     <span style={{ color: 'var(--accent-amber)', fontWeight: '600' }}>{dxSunTimes.sunrise}</span>
@@ -203,56 +243,75 @@ export default function ModernLayout(props) {
                     <span style={{ color: 'var(--accent-purple)', fontWeight: '600' }}>{dxSunTimes.sunset}</span>
                   </div>
                 </div>
-                <div style={{ borderLeft: '1px solid var(--border-color)', paddingLeft: '12px', marginLeft: '12px', minWidth: '90px' }}>
-                  <div style={{ color: 'var(--text-secondary)', fontSize: '11px', marginBottom: '4px' }}>{t('app.dxLocation.beamDir')}</div>
+                <div
+                  style={{
+                    borderLeft: '1px solid var(--border-color)',
+                    paddingLeft: '12px',
+                    marginLeft: '12px',
+                    minWidth: '90px',
+                  }}
+                >
+                  <div style={{ color: 'var(--text-secondary)', fontSize: '11px', marginBottom: '4px' }}>
+                    {t('app.dxLocation.beamDir')}
+                  </div>
                   <div style={{ fontSize: '13px', marginBottom: '3px' }}>
                     <span style={{ color: 'var(--text-secondary)' }}>{t('app.dxLocation.sp')} </span>
-                    <span style={{ color: 'var(--accent-cyan)', fontWeight: '700' }}>{(() => {
-                      const deLat = config.location.lat * Math.PI / 180;
-                      const deLon = config.location.lon * Math.PI / 180;
-                      const dxLat = dxLocation.lat * Math.PI / 180;
-                      const dxLon = dxLocation.lon * Math.PI / 180;
-                      const dLon = dxLon - deLon;
-                      const y = Math.sin(dLon) * Math.cos(dxLat);
-                      const x = Math.cos(deLat) * Math.sin(dxLat) - Math.sin(deLat) * Math.cos(dxLat) * Math.cos(dLon);
-                      let sp = Math.atan2(y, x) * 180 / Math.PI;
-                      sp = (sp + 360) % 360;
-                      return Math.round(sp);
-                    })()}°</span>
+                    <span style={{ color: 'var(--accent-cyan)', fontWeight: '700' }}>
+                      {(() => {
+                        const deLat = (config.location.lat * Math.PI) / 180;
+                        const deLon = (config.location.lon * Math.PI) / 180;
+                        const dxLat = (dxLocation.lat * Math.PI) / 180;
+                        const dxLon = (dxLocation.lon * Math.PI) / 180;
+                        const dLon = dxLon - deLon;
+                        const y = Math.sin(dLon) * Math.cos(dxLat);
+                        const x =
+                          Math.cos(deLat) * Math.sin(dxLat) - Math.sin(deLat) * Math.cos(dxLat) * Math.cos(dLon);
+                        let sp = (Math.atan2(y, x) * 180) / Math.PI;
+                        sp = (sp + 360) % 360;
+                        return Math.round(sp);
+                      })()}
+                      °
+                    </span>
                   </div>
                   <div style={{ fontSize: '13px', marginBottom: '6px' }}>
                     <span style={{ color: 'var(--text-secondary)' }}>{t('app.dxLocation.lp')} </span>
-                    <span style={{ color: 'var(--accent-purple)', fontWeight: '700' }}>{(() => {
-                      const deLat = config.location.lat * Math.PI / 180;
-                      const deLon = config.location.lon * Math.PI / 180;
-                      const dxLat = dxLocation.lat * Math.PI / 180;
-                      const dxLon = dxLocation.lon * Math.PI / 180;
-                      const dLon = dxLon - deLon;
-                      const y = Math.sin(dLon) * Math.cos(dxLat);
-                      const x = Math.cos(deLat) * Math.sin(dxLat) - Math.sin(deLat) * Math.cos(dxLat) * Math.cos(dLon);
-                      let sp = Math.atan2(y, x) * 180 / Math.PI;
-                      sp = (sp + 360) % 360;
-                      let lp = (sp + 180) % 360;
-                      return Math.round(lp);
-                    })()}°</span>
+                    <span style={{ color: 'var(--accent-purple)', fontWeight: '700' }}>
+                      {(() => {
+                        const deLat = (config.location.lat * Math.PI) / 180;
+                        const deLon = (config.location.lon * Math.PI) / 180;
+                        const dxLat = (dxLocation.lat * Math.PI) / 180;
+                        const dxLon = (dxLocation.lon * Math.PI) / 180;
+                        const dLon = dxLon - deLon;
+                        const y = Math.sin(dLon) * Math.cos(dxLat);
+                        const x =
+                          Math.cos(deLat) * Math.sin(dxLat) - Math.sin(deLat) * Math.cos(dxLat) * Math.cos(dLon);
+                        let sp = (Math.atan2(y, x) * 180) / Math.PI;
+                        sp = (sp + 360) % 360;
+                        let lp = (sp + 180) % 360;
+                        return Math.round(lp);
+                      })()}
+                      °
+                    </span>
                   </div>
                   <div style={{ fontSize: '13px', paddingTop: '6px', borderTop: '1px solid var(--border-color)' }}>
-                    <span style={{ color: 'var(--accent-cyan)', fontWeight: '700' }}>{(() => {
-                      // Haversine distance formula
-                      const R = 6371; // Earth radius in km
-                      const deLat = config.location.lat * Math.PI / 180;
-                      const deLon = config.location.lon * Math.PI / 180;
-                      const dxLat = dxLocation.lat * Math.PI / 180;
-                      const dxLon = dxLocation.lon * Math.PI / 180;
-                      const dLat = dxLat - deLat;
-                      const dLon = dxLon - deLon;
-                      const a = Math.sin(dLat / 2) * Math.sin(dLat / 2) +
-                        Math.cos(deLat) * Math.cos(dxLat) *
-                        Math.sin(dLon / 2) * Math.sin(dLon / 2);
-                      const c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a));
-                      const km = R * c;
-                      return `📏 ${Math.round(km).toLocaleString()} km`;
-                    })()}</span>
+                    <span style={{ color: 'var(--accent-cyan)', fontWeight: '700' }}>
+                      {(() => {
+                        // Haversine distance formula
+                        const R = 6371; // Earth radius in km
+                        const deLat = (config.location.lat * Math.PI) / 180;
+                        const deLon = (config.location.lon * Math.PI) / 180;
+                        const dxLat = (dxLocation.lat * Math.PI) / 180;
+                        const dxLon = (dxLocation.lon * Math.PI) / 180;
+                        const dLat = dxLat - deLat;
+                        const dLon = dxLon - deLon;
+                        const a =
+                          Math.sin(dLat / 2) * Math.sin(dLat / 2) +
+                          Math.cos(deLat) * Math.cos(dxLat) * Math.sin(dLon / 2) * Math.sin(dLon / 2);
+                        const c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a));
+                        const km = R * c;
+                        return `📏 ${Math.round(km).toLocaleString()} km`;
+                      })()}
+                    </span>
                   </div>
                 </div>
               </div>
@@ -260,7 +319,12 @@ export default function ModernLayout(props) {
                 <WeatherPanel
                   weatherData={dxWeather}
                   tempUnit={tempUnit}
-                  onTempUnitChange={(unit) => { setTempUnit(unit); try { localStorage.setItem('openhamclock_tempUnit', unit); } catch { } }}
+                  onTempUnitChange={(unit) => {
+                    setTempUnit(unit);
+                    try {
+                      localStorage.setItem('openhamclock_tempUnit', unit);
+                    } catch {}
+                  }}
                 />
               )}
             </div>
@@ -274,9 +338,7 @@ export default function ModernLayout(props) {
           )}
 
           {/* Solar Panel */}
-          {config.panels?.solar?.visible !== false && (
-            <SolarPanel solarIndices={solarIndices} />
-          )}
+          {config.panels?.solar?.visible !== false && <SolarPanel solarIndices={solarIndices} />}
 
           {/* VOACAP/Propagation Panel */}
           {config.panels?.propagation?.visible !== false && (
@@ -292,7 +354,16 @@ export default function ModernLayout(props) {
       )}
 
       {/* CENTER - MAP */}
-      <div style={{ position: 'relative', borderRadius: '6px', overflow: 'hidden', width: '100%', height: '100%', minWidth: 0 }}>
+      <div
+        style={{
+          position: 'relative',
+          borderRadius: '6px',
+          overflow: 'hidden',
+          width: '100%',
+          height: '100%',
+          minWidth: 0,
+        }}
+      >
         <WorldMap
           deLocation={config.location}
           dxLocation={dxLocation}
@@ -325,17 +396,19 @@ export default function ModernLayout(props) {
           mouseZoom={config.mouseZoom}
           onSpotClick={tuneTo}
         />
-        <div style={{
-          position: 'absolute',
-          bottom: '8px',
-          left: '50%',
-          transform: 'translateX(-50%)',
-          fontSize: '13px',
-          color: 'var(--text-muted)',
-          background: 'rgba(0,0,0,0.7)',
-          padding: '2px 8px',
-          borderRadius: '4px'
-        }}>
+        <div
+          style={{
+            position: 'absolute',
+            bottom: '8px',
+            left: '50%',
+            transform: 'translateX(-50%)',
+            fontSize: '13px',
+            color: 'var(--text-muted)',
+            background: 'rgba(0,0,0,0.7)',
+            padding: '2px 8px',
+            borderRadius: '4px',
+          }}
+        >
           {t('app.callsign', { callsign: config.callsign })}
         </div>
       </div>
@@ -345,7 +418,9 @@ export default function ModernLayout(props) {
         <div style={{ display: 'flex', flexDirection: 'column', gap: '4px', overflow: 'hidden' }}>
           {/* DX Cluster - primary panel, takes most space */}
           {config.panels?.dxCluster?.visible !== false && (
-            <div style={{ flex: `${config.panels.dxCluster.size || 2} 1 auto`, minHeight: '180px', overflow: 'hidden' }}>
+            <div
+              style={{ flex: `${config.panels.dxCluster.size || 2} 1 auto`, minHeight: '180px', overflow: 'hidden' }}
+            >
               <DXClusterPanel
                 data={dxClusterData.spots}
                 loading={dxClusterData.loading}
@@ -356,7 +431,7 @@ export default function ModernLayout(props) {
                 onHoverSpot={setHoveredSpot}
                 onSpotClick={(spot) => {
                   tuneTo(spot);
-                  const path = (dxClusterData.paths || []).find(p => p.dxCall === spot.call);
+                  const path = (dxClusterData.paths || []).find((p) => p.dxCall === spot.call);
                   if (path && path.dxLat != null && path.dxLon != null) {
                     handleDXChange({ lat: path.dxLat, lon: path.dxLon });
                   }
@@ -370,7 +445,9 @@ export default function ModernLayout(props) {
 
           {/* PSKReporter + WSJT-X - digital mode spots */}
           {config.panels?.pskReporter?.visible !== false && (
-            <div style={{ flex: `${config.panels.pskReporter.size || 1} 1 auto`, minHeight: '140px', overflow: 'hidden' }}>
+            <div
+              style={{ flex: `${config.panels.pskReporter.size || 1} 1 auto`, minHeight: '140px', overflow: 'hidden' }}
+            >
               <PSKReporterPanel
                 callsign={config.callsign}
                 pskReporter={pskReporter}
@@ -401,14 +478,28 @@ export default function ModernLayout(props) {
 
           {/* DXpeditions */}
           {config.panels?.dxpeditions?.visible !== false && (
-            <div style={{ flex: `${config.panels.dxpeditions?.size || 1} 0 auto`, minHeight: '70px', maxHeight: '100px', overflow: 'hidden' }}>
+            <div
+              style={{
+                flex: `${config.panels.dxpeditions?.size || 1} 0 auto`,
+                minHeight: '70px',
+                maxHeight: '100px',
+                overflow: 'hidden',
+              }}
+            >
               <DXpeditionPanel data={dxpeditions.data} loading={dxpeditions.loading} />
             </div>
           )}
 
           {/* POTA / SOTA */}
           {config.panels?.pota?.visible !== false && (
-            <div style={{ flex: `${config.panels.pota?.size || 1} 0 auto`, minHeight: '60px', maxHeight: '120px', overflow: 'hidden' }}>
+            <div
+              style={{
+                flex: `${config.panels.pota?.size || 1} 0 auto`,
+                minHeight: '60px',
+                maxHeight: '120px',
+                overflow: 'hidden',
+              }}
+            >
               <PotaSotaPanel
                 potaData={potaSpots.data}
                 potaLoading={potaSpots.loading}
@@ -437,11 +528,19 @@ export default function ModernLayout(props) {
 
           {/* Contests - at bottom, compact */}
           {config.panels?.contests?.visible !== false && (
-            <div style={{ flex: `${config.panels.contests?.size || 1} 0 auto`, minHeight: '80px', maxHeight: '120px', overflow: 'hidden' }}>
+            <div
+              style={{
+                flex: `${config.panels.contests?.size || 1} 0 auto`,
+                minHeight: '80px',
+                maxHeight: '120px',
+                overflow: 'hidden',
+              }}
+            >
               <ContestPanel data={contests.data} loading={contests.loading} />
             </div>
           )}
         </div>
       )}
-    </div>);
+    </div>
+  );
 }
diff --git a/src/main.jsx b/src/main.jsx
index bc5651f7..d20721cf 100644
--- a/src/main.jsx
+++ b/src/main.jsx
@@ -16,5 +16,5 @@ ReactDOM.createRoot(document.getElementById('root')).render(
         <App />
       </QRZProvider>
     </ErrorBoundary>
-  </React.StrictMode>
+  </React.StrictMode>,
 );
diff --git a/src/plugins/OpenHamClock-Plugin-Guide.md b/src/plugins/OpenHamClock-Plugin-Guide.md
index b37d0f40..2bf583f6 100644
--- a/src/plugins/OpenHamClock-Plugin-Guide.md
+++ b/src/plugins/OpenHamClock-Plugin-Guide.md
@@ -77,6 +77,7 @@ Plugin adds/removes/updates Leaflet layers on map
 ### Integration Points
 
 **WorldMap.jsx** (3 small additions):
+
 1. Import `getAllLayers` from registry
 2. Add `pluginLayersRef` and `pluginLayerStates` state
 3. Render `<PluginLayer>` components in JSX
@@ -104,7 +105,7 @@ export const metadata = {
   category: 'custom',
   defaultEnabled: false,
   defaultOpacity: 0.7,
-  version: '1.0.0'
+  version: '1.0.0',
 };
 
 export function useLayer({ enabled, opacity, map }) {
@@ -116,7 +117,7 @@ export function useLayer({ enabled, opacity, map }) {
     if (enabled && !layerRef) {
       // Add your layer
       const layer = L.tileLayer('https://example.com/{z}/{x}/{y}.png', {
-        opacity: opacity
+        opacity: opacity,
       });
       layer.addTo(map);
       setLayerRef(layer);
@@ -148,7 +149,7 @@ import * as MyLayerPlugin from './layers/useMyLayer.js';
 const layerPlugins = [
   WXRadarPlugin,
   EarthquakesPlugin,
-  MyLayerPlugin,  // ← Add your plugin here
+  MyLayerPlugin, // ← Add your plugin here
 ];
 ```
 
@@ -183,7 +184,7 @@ export const metadata = {
   category: 'weather',
   defaultEnabled: false,
   defaultOpacity: 0.8,
-  version: '1.0.0'
+  version: '1.0.0',
 };
 
 export function useLayer({ enabled = false, opacity = 0.8, map = null }) {
@@ -196,9 +197,7 @@ export function useLayer({ enabled = false, opacity = 0.8, map = null }) {
 
     const fetchStrikes = async () => {
       try {
-        const response = await fetch(
-          'https://api.example.com/lightning?minutes=30'
-        );
+        const response = await fetch('https://api.example.com/lightning?minutes=30');
         const data = await response.json();
         setStrikes(data.strikes || []);
       } catch (err) {
@@ -207,7 +206,7 @@ export function useLayer({ enabled = false, opacity = 0.8, map = null }) {
     };
 
     fetchStrikes();
-    
+
     // Refresh every 1 minute
     const interval = setInterval(fetchStrikes, 60000);
     return () => clearInterval(interval);
@@ -218,7 +217,7 @@ export function useLayer({ enabled = false, opacity = 0.8, map = null }) {
     if (!map || typeof L === 'undefined') return;
 
     // Clear old markers
-    markers.forEach(m => {
+    markers.forEach((m) => {
       try {
         map.removeLayer(m);
       } catch (e) {
@@ -231,7 +230,7 @@ export function useLayer({ enabled = false, opacity = 0.8, map = null }) {
 
     const newMarkers = [];
 
-    strikes.forEach(strike => {
+    strikes.forEach((strike) => {
       // Create marker
       const marker = L.circleMarker([strike.lat, strike.lon], {
         radius: 6,
@@ -239,7 +238,7 @@ export function useLayer({ enabled = false, opacity = 0.8, map = null }) {
         color: '#ff6600',
         weight: 2,
         fillOpacity: opacity,
-        opacity: opacity
+        opacity: opacity,
       });
 
       // Add popup
@@ -257,7 +256,7 @@ export function useLayer({ enabled = false, opacity = 0.8, map = null }) {
     setMarkers(newMarkers);
 
     return () => {
-      newMarkers.forEach(m => {
+      newMarkers.forEach((m) => {
         try {
           map.removeLayer(m);
         } catch (e) {
@@ -269,7 +268,7 @@ export function useLayer({ enabled = false, opacity = 0.8, map = null }) {
 
   return {
     markers,
-    strikeCount: strikes.length
+    strikeCount: strikes.length,
   };
 }
 ```
@@ -299,17 +298,14 @@ export function useLayer({ enabled, opacity, map }) {
 
     if (enabled && !layerRef) {
       // WMS tile layer
-      const layer = L.tileLayer.wms(
-        'https://mesonet.agron.iastate.edu/cgi-bin/wms/nexrad/n0r.cgi',
-        {
-          layers: 'nexrad-n0r-900913',
-          format: 'image/png',
-          transparent: true,
-          opacity: opacity,
-          zIndex: 200,
-          attribution: '© Data Provider'
-        }
-      );
+      const layer = L.tileLayer.wms('https://mesonet.agron.iastate.edu/cgi-bin/wms/nexrad/n0r.cgi', {
+        layers: 'nexrad-n0r-900913',
+        format: 'image/png',
+        transparent: true,
+        opacity: opacity,
+        zIndex: 200,
+        attribution: '© Data Provider',
+      });
       layer.addTo(map);
       setLayerRef(layer);
     } else if (!enabled && layerRef) {
@@ -365,21 +361,21 @@ export function useLayer({ enabled, opacity, map }) {
     if (!map || typeof L === 'undefined') return;
 
     // Clear old
-    markers.forEach(m => map.removeLayer(m));
+    markers.forEach((m) => map.removeLayer(m));
     setMarkers([]);
 
     if (!enabled || data.length === 0) return;
 
     const newMarkers = [];
 
-    data.forEach(point => {
+    data.forEach((point) => {
       const marker = L.circleMarker([point.lat, point.lon], {
         radius: 8,
         fillColor: point.color || '#ff0000',
         color: '#fff',
         weight: 2,
         fillOpacity: opacity,
-        opacity: opacity
+        opacity: opacity,
       });
 
       marker.bindPopup(`
@@ -394,7 +390,7 @@ export function useLayer({ enabled, opacity, map }) {
     setMarkers(newMarkers);
 
     return () => {
-      newMarkers.forEach(m => map.removeLayer(m));
+      newMarkers.forEach((m) => map.removeLayer(m));
     };
   }, [enabled, data, map, opacity]);
 
@@ -416,7 +412,7 @@ export function useLayer({ enabled, opacity, map }) {
     if (!enabled) return;
 
     fetch('https://api.example.com/boundaries.geojson')
-      .then(r => r.json())
+      .then((r) => r.json())
       .then(setGeoData);
   }, [enabled]);
 
@@ -434,13 +430,13 @@ export function useLayer({ enabled, opacity, map }) {
           color: '#0000ff',
           weight: 2,
           opacity: opacity,
-          fillOpacity: opacity * 0.3
+          fillOpacity: opacity * 0.3,
         },
         onEachFeature: (feature, layer) => {
           if (feature.properties.name) {
             layer.bindPopup(`<b>${feature.properties.name}</b>`);
           }
-        }
+        },
       });
       layer.addTo(map);
       setLayerRef(layer);
@@ -467,7 +463,7 @@ export function useLayer({ enabled, opacity, map }) {
 useEffect(() => {
   // ✅ GOOD: Check before using
   if (!map || typeof L === 'undefined') return;
-  
+
   // Now safe to use map and L
   const layer = L.marker([...]).addTo(map);
 }, [map]);
@@ -485,7 +481,7 @@ useEffect(() => {
 ```javascript
 useEffect(() => {
   const layer = L.marker([...]).addTo(map);
-  
+
   // ✅ GOOD: Cleanup function
   return () => {
     if (layer && map) {
@@ -514,7 +510,7 @@ useEffect(() => {
       console.error('Plugin data error:', err);
     }
   };
-  
+
   if (enabled) fetchData();
 }, [enabled]);
 ```
@@ -524,14 +520,14 @@ useEffect(() => {
 ```javascript
 useEffect(() => {
   if (!enabled) return;
-  
+
   const interval = setInterval(fetchData, 60000);
   const markers = [];
-  
+
   // ✅ GOOD: Clean up intervals and markers
   return () => {
     clearInterval(interval);
-    markers.forEach(m => map.removeLayer(m));
+    markers.forEach((m) => map.removeLayer(m));
   };
 }, [enabled]);
 ```
@@ -574,32 +570,35 @@ const markers = data.map(createMarker); // data has 50000 items
 
 ```javascript
 // Check plugin registration
-window.hamclockLayerControls.layers
+window.hamclockLayerControls.layers;
 
 // Check localStorage
-JSON.parse(localStorage.getItem('openhamclock_mapSettings')).layers
+JSON.parse(localStorage.getItem('openhamclock_mapSettings')).layers;
 
 // Manually toggle (for debugging)
-window.hamclockLayerControls.toggleLayer('mylayer', true)
+window.hamclockLayerControls.toggleLayer('mylayer', true);
 
 // Check layer state
-window.hamclockLayerControls.layers.find(l => l.id === 'mylayer')
+window.hamclockLayerControls.layers.find((l) => l.id === 'mylayer');
 ```
 
 ### Common Test Scenarios
 
 **Test 1: Fresh Install**
+
 1. Clear localStorage: `localStorage.clear()`
 2. Refresh page
 3. Plugin should be at defaultEnabled state
 4. Toggle on/off should work
 
 **Test 2: State Persistence**
+
 1. Enable plugin, set opacity to 50%
 2. Refresh page (F5)
 3. Plugin should still be enabled at 50% opacity
 
 **Test 3: Multiple Plugins**
+
 1. Enable weather radar
 2. Enable earthquakes
 3. Both should display simultaneously
@@ -612,32 +611,34 @@ window.hamclockLayerControls.layers.find(l => l.id === 'mylayer')
 ### Problem: Layer doesn't appear when enabled
 
 **Possible Causes:**
+
 - Map instance not ready
 - Leaflet not loaded
 - API/data fetch failed
 - Invalid coordinates
 
 **Solution:**
+
 ```javascript
 useEffect(() => {
   // Add debug logging
   console.log('Plugin state:', { enabled, map, data: data.length });
-  
+
   if (!map) {
     console.warn('Map not ready');
     return;
   }
-  
+
   if (typeof L === 'undefined') {
     console.error('Leaflet not loaded');
     return;
   }
-  
+
   if (data.length === 0) {
     console.warn('No data to display');
     return;
   }
-  
+
   // Continue with rendering...
 }, [enabled, map, data]);
 ```
@@ -647,17 +648,18 @@ useEffect(() => {
 **Cause:** Missing cleanup or not checking enabled state
 
 **Solution:**
+
 ```javascript
 useEffect(() => {
   if (!map) return;
-  
+
   // Remove layer if disabled
   if (!enabled && layerRef) {
     map.removeLayer(layerRef);
     setLayerRef(null);
     return; // Exit early
   }
-  
+
   // Only add if enabled
   if (enabled && !layerRef) {
     const layer = createLayer();
@@ -671,14 +673,13 @@ useEffect(() => {
 **Cause:** localStorage not saving correctly
 
 **Solution:**
+
 ```javascript
 // Check if data is being saved
 window.hamclockLayerControls.toggleLayer('mylayer', true);
 
 // Then check localStorage
-console.log(
-  JSON.parse(localStorage.getItem('openhamclock_mapSettings')).layers
-);
+console.log(JSON.parse(localStorage.getItem('openhamclock_mapSettings')).layers);
 
 // Should show: { mylayer: { enabled: true, opacity: 0.7 } }
 ```
@@ -686,11 +687,13 @@ console.log(
 ### Problem: Plugin not in Settings panel
 
 **Causes:**
+
 1. Not registered in layerRegistry.js
 2. Missing metadata export
 3. Syntax error in plugin file
 
 **Solution:**
+
 ```bash
 # Check for syntax errors
 npm run dev
@@ -708,6 +711,7 @@ grep -n "export const metadata" src/plugins/layers/useMyLayer.js
 **Cause:** Calling state setter during render
 
 **Solution:**
+
 ```javascript
 // ❌ BAD: State update during render
 if (enabled && !layerRef) {
@@ -740,8 +744,8 @@ export function useLayer({ enabled, opacity, map }) {
     // Create custom control
     const RefreshControl = L.Control.extend({
       options: { position: 'topright' },
-      
-      onAdd: function(map) {
+
+      onAdd: function (map) {
         const container = L.DomUtil.create('div', 'leaflet-bar');
         const button = L.DomUtil.create('a', '', container);
         button.innerHTML = '🔄';
@@ -749,14 +753,14 @@ export function useLayer({ enabled, opacity, map }) {
         button.style.cursor = 'pointer';
         button.style.padding = '5px 10px';
         button.style.background = '#fff';
-        
-        button.onclick = function(e) {
+
+        button.onclick = function (e) {
           e.preventDefault();
           fetchData(); // Trigger refresh
         };
-        
+
         return container;
-      }
+      },
     });
 
     const control = new RefreshControl();
@@ -793,13 +797,13 @@ const createCustomIcon = (color, label) => {
       </div>
     `,
     iconSize: null,
-    iconAnchor: [0, 0]
+    iconAnchor: [0, 0],
   });
 };
 
 // Usage
 const marker = L.marker([lat, lon], {
-  icon: createCustomIcon('#ff0000', 'ALERT')
+  icon: createCustomIcon('#ff0000', 'ALERT'),
 });
 ```
 
@@ -818,21 +822,21 @@ export function useLayer({ enabled, opacity, map }) {
 
     let animationFrame;
     const targetOpacity = enabled ? opacity : 0;
-    
+
     const animate = () => {
-      setCurrentOpacity(prev => {
+      setCurrentOpacity((prev) => {
         const diff = targetOpacity - prev;
         if (Math.abs(diff) < 0.01) return targetOpacity;
         return prev + diff * 0.1; // Ease towards target
       });
-      
+
       if (Math.abs(currentOpacity - targetOpacity) > 0.01) {
         animationFrame = requestAnimationFrame(animate);
       }
     };
-    
+
     animate();
-    
+
     return () => {
       if (animationFrame) cancelAnimationFrame(animationFrame);
     };
@@ -857,14 +861,14 @@ export function useLayer({ enabled, opacity, map }) {
 
 ```typescript
 export const metadata: {
-  id: string;              // Unique identifier (lowercase, no spaces)
-  name: string;            // Display name in UI
-  description: string;     // Brief description (shown in Settings)
-  icon: string;            // Emoji icon (single character)
-  category: string;        // Category for grouping (weather, geology, etc.)
+  id: string; // Unique identifier (lowercase, no spaces)
+  name: string; // Display name in UI
+  description: string; // Brief description (shown in Settings)
+  icon: string; // Emoji icon (single character)
+  category: string; // Category for grouping (weather, geology, etc.)
   defaultEnabled: boolean; // Initial enabled state
-  defaultOpacity: number;  // Initial opacity (0.0 to 1.0)
-  version: string;         // Plugin version (semver)
+  defaultOpacity: number; // Initial opacity (0.0 to 1.0)
+  version: string; // Plugin version (semver)
 };
 ```
 
@@ -872,19 +876,21 @@ export const metadata: {
 
 ```typescript
 export function useLayer(params: {
-  enabled: boolean;   // Current enabled state
-  opacity: number;    // Current opacity (0.0 to 1.0)
-  map: L.Map | null;  // Leaflet map instance (may be null initially)
-}): any;              // Optional return value (for debugging/monitoring)
+  enabled: boolean; // Current enabled state
+  opacity: number; // Current opacity (0.0 to 1.0)
+  map: L.Map | null; // Leaflet map instance (may be null initially)
+}): any; // Optional return value (for debugging/monitoring)
 ```
 
 **Parameters:**
+
 - `enabled` - Boolean indicating if layer should be visible
 - `opacity` - Number from 0.0 (transparent) to 1.0 (opaque)
 - `map` - Leaflet map instance or null if not ready
 
 **Return Value (Optional):**
 Return any data you want for debugging. Common returns:
+
 - `{ layer: layerRef }` - Reference to Leaflet layer
 - `{ markers: markersArray }` - Array of markers
 - `{ count: dataLength }` - Number of items displayed
@@ -917,46 +923,49 @@ const memoizedFn = useCallback(() => {
 ### Leaflet API Essentials
 
 **Map Methods:**
+
 ```javascript
-map.addLayer(layer)          // Add layer to map
-map.removeLayer(layer)       // Remove layer from map
-map.hasLayer(layer)          // Check if layer exists
-map.getCenter()              // Get center [lat, lon]
-map.getZoom()                // Get zoom level
-map.getBounds()              // Get visible bounds
-map.panTo([lat, lon])        // Pan to coordinates
-map.setView([lat, lon], zoom) // Set center and zoom
+map.addLayer(layer); // Add layer to map
+map.removeLayer(layer); // Remove layer from map
+map.hasLayer(layer); // Check if layer exists
+map.getCenter(); // Get center [lat, lon]
+map.getZoom(); // Get zoom level
+map.getBounds(); // Get visible bounds
+map.panTo([lat, lon]); // Pan to coordinates
+map.setView([lat, lon], zoom); // Set center and zoom
 ```
 
 **Layer Types:**
+
 ```javascript
 // Tile layer
-L.tileLayer(url, options)
-L.tileLayer.wms(url, options)
+L.tileLayer(url, options);
+L.tileLayer.wms(url, options);
 
 // Markers
-L.marker([lat, lon], options)
-L.circleMarker([lat, lon], options)
+L.marker([lat, lon], options);
+L.circleMarker([lat, lon], options);
 
 // Shapes
-L.circle([lat, lon], options)
-L.polygon(latlngs, options)
-L.polyline(latlngs, options)
+L.circle([lat, lon], options);
+L.polygon(latlngs, options);
+L.polyline(latlngs, options);
 
 // GeoJSON
-L.geoJSON(geojsonData, options)
+L.geoJSON(geojsonData, options);
 
 // Layer groups
-L.layerGroup(layers)
-L.featureGroup(layers)
+L.layerGroup(layers);
+L.featureGroup(layers);
 ```
 
 **Popup/Tooltip:**
+
 ```javascript
-marker.bindPopup(content, options)
-marker.bindTooltip(content, options)
-marker.openPopup()
-marker.closePopup()
+marker.bindPopup(content, options);
+marker.bindTooltip(content, options);
+marker.openPopup();
+marker.closePopup();
 ```
 
 ### Fetch API
@@ -970,8 +979,8 @@ const data = await response.json();
 const response = await fetch(url, {
   method: 'GET',
   headers: {
-    'Accept': 'application/json'
-  }
+    Accept: 'application/json',
+  },
 });
 
 // Error handling
@@ -993,26 +1002,26 @@ try {
 **File:** `src/plugins/layers/useWXRadar.js`
 
 **Features:**
+
 - WMS tile overlay
 - Auto-refresh every 2 minutes
 - Opacity control
 - NEXRAD radar data
 
 **Key Code:**
+
 ```javascript
-const layer = L.tileLayer.wms(
-  'https://mesonet.agron.iastate.edu/cgi-bin/wms/nexrad/n0r.cgi',
-  {
-    layers: 'nexrad-n0r-900913',
-    format: 'image/png',
-    transparent: true,
-    opacity: opacity,
-    zIndex: 200
-  }
-);
+const layer = L.tileLayer.wms('https://mesonet.agron.iastate.edu/cgi-bin/wms/nexrad/n0r.cgi', {
+  layers: 'nexrad-n0r-900913',
+  format: 'image/png',
+  transparent: true,
+  opacity: opacity,
+  zIndex: 200,
+});
 ```
 
 **Learn From:**
+
 - Simple tile layer implementation
 - Auto-refresh pattern
 - WMS configuration
@@ -1022,6 +1031,7 @@ const layer = L.tileLayer.wms(
 **File:** `src/plugins/layers/useEarthquakes.js`
 
 **Features:**
+
 - USGS GeoJSON API
 - Circle markers scaled by magnitude
 - Color-coded by severity
@@ -1029,6 +1039,7 @@ const layer = L.tileLayer.wms(
 - Auto-refresh every 5 minutes
 
 **Key Code:**
+
 ```javascript
 const size = Math.min(Math.max(mag * 4, 8), 40);
 
@@ -1037,7 +1048,7 @@ const marker = L.circleMarker([lat, lon], {
   fillColor: color,
   color: '#fff',
   weight: 2,
-  fillOpacity: opacity
+  fillOpacity: opacity,
 });
 
 marker.bindPopup(`
@@ -1048,6 +1059,7 @@ marker.bindPopup(`
 ```
 
 **Learn From:**
+
 - API data fetching
 - Dynamic marker sizing
 - Color-coding logic
@@ -1088,36 +1100,43 @@ marker.bindPopup(`
 ### Data Sources
 
 **Weather:**
+
 - NOAA NEXRAD Radar: https://mesonet.agron.iastate.edu/
 - OpenWeatherMap: https://openweathermap.org/api
 - Weather.gov API: https://www.weather.gov/documentation/services-web-api
 
 **Geology:**
+
 - USGS Earthquakes: https://earthquake.usgs.gov/fdsnws/event/1/
 - USGS Volcanoes: https://volcanoes.usgs.gov/vhp/data_api.html
 
 **Astronomy:**
+
 - NASA APIs: https://api.nasa.gov/
 - Space Weather: https://services.swpc.noaa.gov/
 
 **Amateur Radio:**
+
 - Reverse Beacon Network: https://www.reversebeacon.net/
 - PSK Reporter: https://pskreporter.info/
 - APRS-IS: http://www.aprs-is.net/
 
 **General:**
+
 - OpenStreetMap: https://wiki.openstreetmap.org/wiki/API
 - Natural Earth Data: https://www.naturalearthdata.com/
 
 ### Libraries
 
 **Leaflet Plugins:**
+
 - Marker Clustering: https://github.com/Leaflet/Leaflet.markercluster
 - Heatmaps: https://github.com/Leaflet/Leaflet.heat
 - Animated Markers: https://github.com/openplans/Leaflet.AnimatedMarker
 - Draw Tools: https://github.com/Leaflet/Leaflet.draw
 
 **React Resources:**
+
 - React Hooks Docs: https://react.dev/reference/react
 - useEffect Guide: https://react.dev/reference/react/useEffect
 
@@ -1201,4 +1220,4 @@ Questions? Found a bug? Have an idea? Open an issue on GitHub!
 
 ---
 
-*Last Updated: February 2, 2026*
\ No newline at end of file
+_Last Updated: February 2, 2026_
diff --git a/src/plugins/layerRegistry.js b/src/plugins/layerRegistry.js
index b097acdb..6aada5a8 100644
--- a/src/plugins/layerRegistry.js
+++ b/src/plugins/layerRegistry.js
@@ -41,10 +41,10 @@ let cachedLayers = null;
 
 export function getAllLayers() {
   if (cachedLayers) return cachedLayers;
-  
+
   cachedLayers = layerPlugins
-    .filter(plugin => plugin.metadata && plugin.useLayer)
-    .map(plugin => ({
+    .filter((plugin) => plugin.metadata && plugin.useLayer)
+    .map((plugin) => ({
       id: plugin.metadata.id,
       name: plugin.metadata.name,
       description: plugin.metadata.description,
@@ -53,13 +53,13 @@ export function getAllLayers() {
       defaultOpacity: plugin.metadata.defaultOpacity || 0.6,
       category: plugin.metadata.category || 'overlay',
       localOnly: plugin.metadata.localOnly || false,
-      hook: plugin.useLayer
+      hook: plugin.useLayer,
     }));
-  
+
   return cachedLayers;
 }
 
 export function getLayerById(layerId) {
   const layers = getAllLayers();
-  return layers.find(layer => layer.id === layerId) || null;
+  return layers.find((layer) => layer.id === layerId) || null;
 }
diff --git a/src/plugins/layers/CloudLayer/README.md b/src/plugins/layers/CloudLayer/README.md
index 20beff88..b1e30f6f 100644
--- a/src/plugins/layers/CloudLayer/README.md
+++ b/src/plugins/layers/CloudLayer/README.md
@@ -17,31 +17,35 @@ The Global Clouds plugin provides a real-time satellite-derived cloud cover over
 ## 🌟 Features
 
 ### Core Capabilities
-* **Real-time Cloud Overlay**: High-resolution global cloud imagery updated every 10–15 minutes.
-* **Global Coverage**: Seamless cloud data for all continents and oceans.
-* **Transparency Control**: Adjustable opacity (0-100%) to view underlying satellite imagery or map features.
-* **API Integration**: Securely utilizes your personal **OpenWeatherMap API key** from the `.env` configuration.
+
+- **Real-time Cloud Overlay**: High-resolution global cloud imagery updated every 10–15 minutes.
+- **Global Coverage**: Seamless cloud data for all continents and oceans.
+- **Transparency Control**: Adjustable opacity (0-100%) to view underlying satellite imagery or map features.
+- **API Integration**: Securely utilizes your personal **OpenWeatherMap API key** from the `.env` configuration.
 
 ### Data Visualization
-* **Cloud Density**: Translucent white overlays representing current cloud formations.
-* **Integration**: Designed to overlay perfectly on top of **MODIS Terra** or **Dark** map styles.
-* **Dynamic UI**: Toggle visibility directly from the **Map Layers** settings.
+
+- **Cloud Density**: Translucent white overlays representing current cloud formations.
+- **Integration**: Designed to overlay perfectly on top of **MODIS Terra** or **Dark** map styles.
+- **Dynamic UI**: Toggle visibility directly from the **Map Layers** settings.
 
 ---
 
 ## 📊 Data Details
 
 ### Data Source
-* **Provider**: OpenWeatherMap (OWM)
-* **Service**: Weather Maps 1.0
-* **URL**: `https://tile.openweathermap.org/map/clouds_new/{z}/{x}/{y}.png`
-* **Update Frequency**: Approximately every 10 minutes.
-* **Data Latency**: Near real-time satellite processing.
+
+- **Provider**: OpenWeatherMap (OWM)
+- **Service**: Weather Maps 1.0
+- **URL**: `https://tile.openweathermap.org/map/clouds_new/{z}/{x}/{y}.png`
+- **Update Frequency**: Approximately every 10 minutes.
+- **Data Latency**: Near real-time satellite processing.
 
 ### Cloud Product
-* **Product Code**: `clouds_new` (Modern Tiled API)
-* **Resolution**: Global tiled coverage.
-* **Z-Index**: 1000 (Placed above base maps, below markers and terminator).
+
+- **Product Code**: `clouds_new` (Modern Tiled API)
+- **Resolution**: Global tiled coverage.
+- **Z-Index**: 1000 (Placed above base maps, below markers and terminator).
 
 ---
 
@@ -57,6 +61,7 @@ The Global Clouds plugin provides a real-time satellite-derived cloud cover over
 ## 🔧 Usage
 
 ### Basic Setup
+
 1. **Configure API Key**: Ensure `VITE_OPENWEATHER_API_KEY=` is set in your `.env` file. Same as your standard OPEN Weather API KEY
 2. **Enable Plugin**: Open **Settings** → **Map Layers** and toggle **☁️ Global Clouds**.
 3. **Adjust Opacity**: Use the **Opacity** slider to find the right balance (Default: 50%).
@@ -66,6 +71,7 @@ The Global Clouds plugin provides a real-time satellite-derived cloud cover over
 ## ⚙️ Configuration
 
 ### Default Settings
+
 ```json
 {
   "id": "owm-clouds",
@@ -74,3 +80,4 @@ The Global Clouds plugin provides a real-time satellite-derived cloud cover over
   "category": "weather",
   "zIndex": 1000
 }
+```
diff --git a/src/plugins/layers/aurora/README.md b/src/plugins/layers/aurora/README.md
index 0e09d925..034534bb 100644
--- a/src/plugins/layers/aurora/README.md
+++ b/src/plugins/layers/aurora/README.md
@@ -16,6 +16,7 @@ The Aurora Forecast plugin visualizes real-time aurora probability forecasts fro
 ## 🌟 Features
 
 ### Core Capabilities
+
 - **30-Minute Aurora Forecast**: NOAA OVATION model prediction
 - **Global Coverage**: Full Northern and Southern hemisphere visualization
 - **Color-Coded Probability**: Green → Yellow → Orange → Red (4-100%)
@@ -24,6 +25,7 @@ The Aurora Forecast plugin visualizes real-time aurora probability forecasts fro
 - **Smooth Rendering**: Anti-aliased interpolation for visual quality
 
 ### Aurora Visualization
+
 - **Color Ramp** (matches NOAA official):
   - **Dark Green** (4-25%): Low probability
   - **Green** (25-40%): Moderate probability
@@ -40,6 +42,7 @@ The Aurora Forecast plugin visualizes real-time aurora probability forecasts fro
 ## 📊 Data Details
 
 ### Data Source
+
 - **Model**: NOAA OVATION Aurora Forecast
 - **Provider**: NOAA Space Weather Prediction Center (SWPC)
 - **API Endpoint**: https://services.swpc.noaa.gov/json/ovation_aurora_latest.json
@@ -49,6 +52,7 @@ The Aurora Forecast plugin visualizes real-time aurora probability forecasts fro
 - **Data Points**: ~65,000 grid cells (360×181)
 
 ### Data Format
+
 ```json
 {
   "Forecast Time": "2026-02-03 16:45:00",
@@ -62,6 +66,7 @@ The Aurora Forecast plugin visualizes real-time aurora probability forecasts fro
 ```
 
 ### Model Details
+
 - **Physics-Based**: Uses real-time solar wind data
 - **Input Data**: ACE/DSCOVR satellite observations
 - **Propagation Time**: ~1 hour from L1 point to Earth
@@ -73,32 +78,42 @@ The Aurora Forecast plugin visualizes real-time aurora probability forecasts fro
 ## 🎯 Use Cases
 
 ### 1. **HF Propagation Monitoring**
+
 Aurora can disrupt HF radio propagation, especially on polar paths.
+
 - **High aurora probability** = increased absorption on high-latitude paths
 - **Monitor 20m-160m bands** for impact
 - **Avoid gray-line paths** through active aurora zones
 
 ### 2. **VHF/UHF Aurora Scatter**
+
 Strong aurora enables long-distance VHF/UHF contacts via aurora scatter.
+
 - **50 MHz (6m)**: 500-1500 km contacts possible
 - **144 MHz (2m)**: 500-1200 km contacts possible
 - **432 MHz (70cm)**: 300-800 km contacts possible
 - **Look for red/orange zones** in your region
 
 ### 3. **Contest/DXpedition Planning**
+
 Plan operating strategy around aurora conditions.
+
 - **High aurora**: Focus on mid-latitude paths
 - **Low aurora**: High-latitude paths open
 - **Aurora openings**: VHF/UHF operators activate
 
 ### 4. **Space Weather Awareness**
+
 General situational awareness of geomagnetic conditions.
+
 - **Correlates with Kp index**
 - **Indicates solar storm effects**
 - **Helps predict propagation changes**
 
 ### 5. **Visual Aurora Prediction**
+
 Plan aurora photography/viewing (requires clear skies).
+
 - **Red zones (>75%)**: Excellent chance of visible aurora
 - **Yellow zones (40-75%)**: Good chance with dark skies
 - **Green zones (4-40%)**: Possible with very dark skies
@@ -129,18 +144,21 @@ Plan aurora photography/viewing (requires clear skies).
 ### Reading the Forecast
 
 #### For HF Operators
+
 - **Green aurora near your path**: Minimal impact
 - **Yellow/orange aurora on path**: Possible degradation
 - **Red aurora on path**: Significant absorption likely
 - **Aurora equatorward of your location**: Possible propagation enhancement on east-west paths
 
 #### For VHF/UHF Operators
+
 - **Your location in red zone**: Excellent aurora scatter potential
 - **Your location in orange zone**: Good aurora scatter potential
 - **Your location in yellow zone**: Possible weak aurora scatter
 - **Beam toward aurora**: Point antenna toward auroral oval (usually north in Northern Hemisphere)
 
 #### Timing
+
 - **Forecast**: 30 minutes ahead (use current conditions for immediate assessment)
 - **Update frequency**: Every 10 minutes (real-time tracking)
 - **Best accuracy**: Within 1-2 hours of major geomagnetic events
@@ -150,6 +168,7 @@ Plan aurora photography/viewing (requires clear skies).
 ## ⚙️ Configuration
 
 ### Default Settings
+
 ```javascript
 {
   enabled: false,
@@ -162,13 +181,14 @@ Plan aurora photography/viewing (requires clear skies).
 ```
 
 ### Color Mapping Algorithm
+
 ```javascript
 // Probability 4-100 mapped to color ramp
 function auroraCmap(probability) {
-  if (probability < 4) return null;  // Transparent
-  
-  const t = (probability - 4) / 80;  // Normalize to 0-1
-  
+  if (probability < 4) return null; // Transparent
+
+  const t = (probability - 4) / 80; // Normalize to 0-1
+
   // Green → Yellow → Orange → Red gradient
   // Alpha increases with probability (0.3 → 1.0)
 }
@@ -179,6 +199,7 @@ function auroraCmap(probability) {
 ## 🧪 Technical Details
 
 ### Implementation
+
 - **Technology**: Leaflet ImageOverlay
 - **Canvas Rendering**: HTML5 Canvas API
 - **Resolution**: 360×181 grid upscaled to 720×362 with anti-aliasing
@@ -186,6 +207,7 @@ function auroraCmap(probability) {
 - **Longitude Shift**: Corrected for -180° to +180° map coordinates
 
 ### Performance
+
 - **Data Size**: ~200 KB JSON per fetch
 - **Render Time**: <200ms for canvas generation
 - **Canvas Size**: 720×362 pixels (smoothed 2× upscale)
@@ -193,18 +215,20 @@ function auroraCmap(probability) {
 - **Network**: Fetches every 10 minutes
 
 ### Data Flow
+
 ```
 NOAA OVATION Model → SWPC JSON API → OpenHamClock Proxy → Canvas Rendering → Map Overlay
    (real-time)         (10 min cache)    (fetch on demand)    (<200ms)       (instant)
 ```
 
 ### Coordinate Transformation
+
 ```javascript
 // NOAA grid: lon 0-359°, lat -90° to +90°
 // Leaflet: lon -180° to +180°, lat -90° to +90°
 
 // Shift longitudes for map alignment
-x = (lon >= 180) ? lon - 180 : lon + 180;
+x = lon >= 180 ? lon - 180 : lon + 180;
 
 // Flip latitudes for canvas (top = north)
 y = 90 - lat;
@@ -215,22 +239,26 @@ y = 90 - lat;
 ## 🔍 Troubleshooting
 
 ### No Aurora Overlay Showing
+
 1. **Check internet connection**: Requires live NOAA data
 2. **Opacity**: Increase opacity slider
 3. **Low activity**: During solar minimum, aurora may be weak/absent
 4. **Browser cache**: Clear cache and reload (Ctrl+F5)
 
 ### Overlay Looks Pixelated
+
 - **This is normal**: 1° resolution grid (111 km at equator)
 - **Upscaling applied**: 2× smoothing with anti-aliasing
 - **Physics limitation**: Model resolution is 1°
 
 ### Data Not Updating
+
 - **Auto-refresh**: Plugin refreshes every 10 minutes automatically
 - **Manual refresh**: Toggle plugin off/on to force refresh
 - **NOAA SWPC**: Check https://www.swpc.noaa.gov for service status
 
 ### Color Too Dim/Bright
+
 - **Adjust opacity**: Use slider (try 50-80%)
 - **Low probability**: Green colors are subtle by design
 - **High probability**: Red colors are vivid (rare during low activity)
@@ -250,6 +278,7 @@ y = 90 - lat;
 ## 📝 Version History
 
 ### v2.0.0 (2026-02-03)
+
 - High-resolution 1° grid (360×181 points)
 - NOAA official color ramp (green → red)
 - Smooth rendering with 2× anti-aliasing
@@ -259,6 +288,7 @@ y = 90 - lat;
 - Probability filtering (<4% transparent)
 
 ### v1.0.0 (Initial Release)
+
 - Basic OVATION aurora forecast
 - Simple overlay rendering
 - Manual refresh only
@@ -268,12 +298,14 @@ y = 90 - lat;
 ## 💡 Tips & Best Practices
 
 ### For HF Operators
+
 1. **Compare with WSPR**: Check if high-latitude WSPR paths are weak/absent
 2. **Gray line awareness**: Combine with Gray Line plugin to see aurora impact on terminator paths
 3. **Band selection**: Lower bands (80m, 160m) more affected than higher bands (15m, 10m)
 4. **Alternate paths**: Route around aurora (use mid-latitude paths)
 
 ### For VHF/UHF Operators
+
 1. **Red zones = activate**: Strong aurora = excellent scatter potential
 2. **CW mode**: Aurora scatter sounds "raspy" or "hissy"
 3. **SSB challenges**: Aurora Doppler spreading makes SSB difficult
@@ -281,12 +313,14 @@ y = 90 - lat;
 5. **Beam north**: Point antenna toward auroral oval
 
 ### Common Workflows
+
 - **Daily Check**: Enable at start of operating session
 - **Storm Watch**: Monitor during solar storm events (CME arrivals)
 - **Contest**: Leave enabled to track propagation changes
 - **Aurora Chase**: VHF/UHF operators watch for red zones in their region
 
 ### Combining with Other Plugins
+
 - **WSPR + Aurora**: Identify absorption on high-latitude paths
 - **Gray Line + Aurora**: See aurora interference on terminator paths
 - **Earthquakes + Aurora**: Both can affect ionosphere (different mechanisms)
@@ -320,4 +354,4 @@ y = 90 - lat;
 
 **73 de OpenHamClock** 📡🌌
 
-*Auroral awareness for the prepared operator*
+_Auroral awareness for the prepared operator_
diff --git a/src/plugins/layers/earthquakes/README.md b/src/plugins/layers/earthquakes/README.md
index 4f4097e2..8728ae38 100644
--- a/src/plugins/layers/earthquakes/README.md
+++ b/src/plugins/layers/earthquakes/README.md
@@ -16,6 +16,7 @@ The Earthquakes plugin displays live seismic activity data from the USGS Earthqu
 ## 🌟 Features
 
 ### Core Capabilities
+
 - **Live Earthquake Data**: USGS M2.5+ earthquakes from the last hour
 - **Animated New Quake Detection**: Flash animation highlights newly detected earthquakes
 - **Magnitude-Based Sizing**: Larger circles for stronger quakes (16px–40px)
@@ -26,9 +27,10 @@ The Earthquakes plugin displays live seismic activity data from the USGS Earthqu
 - **Stable Positions**: Earthquakes stay at exact locations (no movement/drift)
 
 ### Visual Indicators (v1.2.0)
+
 - **Colored Circle Markers**: Background color shows magnitude severity
 - **Seismograph Wave Icon**: Custom SVG with zigzag waves, epicenter dot, and ground triangle
-- **Flash Animation (New Quakes)**: 
+- **Flash Animation (New Quakes)**:
   - Bright flash effect with glow (0.8s duration)
   - Expanding ring (50km radius, 3s duration)
   - 🆕 Badge in popup
@@ -37,21 +39,23 @@ The Earthquakes plugin displays live seismic activity data from the USGS Earthqu
 - **Box Shadow**: Depth effect for better visibility
 
 ### Magnitude Categories (Enhanced v1.2.0)
-| Magnitude | Size | Color | Hex | Classification |
-|-----------|------|-------|-----|----------------|
-| M1.0-2.0 | 16px | 🟢 Light Green | #90EE90 | Micro |
-| M2.0-3.0 | 16-20px | 🟡 Yellow | #FFEB3B | Minor |
-| M3.0-4.0 | 20-24px | 🟠 Orange | #FFA500 | Light |
-| M4.0-5.0 | 24-28px | 🟠 Deep Orange | #FF6600 | Moderate |
-| M5.0-6.0 | 28-32px | 🔴 Red | #FF3300 | Strong |
-| M6.0-7.0 | 32-36px | 🔴 Dark Red | #CC0000 | Major |
-| M7.0+ | 36-40px | 🔴 Very Dark Red | #8B0000 | Great |
+
+| Magnitude | Size    | Color            | Hex     | Classification |
+| --------- | ------- | ---------------- | ------- | -------------- |
+| M1.0-2.0  | 16px    | 🟢 Light Green   | #90EE90 | Micro          |
+| M2.0-3.0  | 16-20px | 🟡 Yellow        | #FFEB3B | Minor          |
+| M3.0-4.0  | 20-24px | 🟠 Orange        | #FFA500 | Light          |
+| M4.0-5.0  | 24-28px | 🟠 Deep Orange   | #FF6600 | Moderate       |
+| M5.0-6.0  | 28-32px | 🔴 Red           | #FF3300 | Strong         |
+| M6.0-7.0  | 32-36px | 🔴 Dark Red      | #CC0000 | Major          |
+| M7.0+     | 36-40px | 🔴 Very Dark Red | #8B0000 | Great          |
 
 ---
 
 ## 📊 Data Details
 
 ### Data Source
+
 - **Provider**: USGS Earthquake Hazards Program
 - **Feed**: GeoJSON All Earthquakes (Last Hour) **[Updated v1.2.0]**
 - **URL**: https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/all_hour.geojson
@@ -60,7 +64,9 @@ The Earthquakes plugin displays live seismic activity data from the USGS Earthqu
 - **Time Window**: Last hour (more responsive to new activity)
 
 ### Earthquake Properties
+
 Each earthquake includes:
+
 - **Location**: Geographic description (e.g., "8 km NW of Palm Springs, CA")
 - **Magnitude**: Richter/Moment magnitude scale
 - **Depth**: Kilometers below surface
@@ -76,18 +82,23 @@ Each earthquake includes:
 ## 🎯 Use Cases
 
 ### 1. **Seismic Activity Monitoring**
+
 Track global earthquake activity in real-time, especially in tectonically active regions.
 
 ### 2. **Ionospheric Disturbance Awareness**
+
 Large earthquakes (M6+) can potentially affect ionospheric conditions and radio propagation.
 
 ### 3. **Regional Safety**
+
 Monitor seismic activity near your QTH (location) or planned DXpedition sites.
 
 ### 4. **Emergency Communications**
+
 Quick situational awareness during seismic events for EMCOMM (emergency communications) operations.
 
 ### 5. **Scientific Interest**
+
 Educational visualization of global tectonic plate boundaries and seismic patterns.
 
 ---
@@ -120,17 +131,20 @@ Educational visualization of global tectonic plate boundaries and seismic patter
 ### Understanding the Display
 
 #### Circle Size
+
 - **Larger circles** = Stronger earthquakes
 - **Smaller circles** = Weaker earthquakes
 - Size scales with magnitude (M2.5 = 8px, M7+ = 40px)
 
 #### New Earthquake Animation (v1.1.0)
+
 - **Growing dot**: Earthquake marker animates from small to full size (0.6 seconds)
 - **Pulse ring**: Expanding circular ring (50km radius, 3 seconds)
 - **🆕 Badge**: New earthquakes show "🆕" in popup for easy identification
 - **Auto-dismiss**: Animation plays once, then marker remains static
 
 #### Color Interpretation
+
 - **Yellow**: Minor quakes, little concern (M2.5-3.0)
 - **Orange**: Light to moderate, noticeable (M3.0-5.0)
 - **Red shades**: Strong to great, potentially destructive (M5.0+)
@@ -140,6 +154,7 @@ Educational visualization of global tectonic plate boundaries and seismic patter
 ## ⚙️ Configuration
 
 ### Default Settings
+
 ```javascript
 {
   enabled: false,
@@ -151,6 +166,7 @@ Educational visualization of global tectonic plate boundaries and seismic patter
 ```
 
 ### Animation Settings (v1.1.0)
+
 ```css
 /* Pulse ring animation */
 .earthquake-pulse-ring {
@@ -170,6 +186,7 @@ Educational visualization of global tectonic plate boundaries and seismic patter
 ## 🧪 Technical Details
 
 ### Implementation
+
 - **Marker Type**: Leaflet CircleMarker
 - **Data Format**: GeoJSON
 - **Coordinate System**: WGS84 (EPSG:4326)
@@ -177,12 +194,14 @@ Educational visualization of global tectonic plate boundaries and seismic patter
 - **Animation**: CSS keyframes + Leaflet interaction
 
 ### Performance
+
 - **Typical Load**: 50-200 earthquakes per day
 - **Marker Rendering**: <50ms for typical dataset
 - **Update Frequency**: 5 minutes (300,000ms)
 - **Animation Impact**: Minimal (CSS-based)
 
 ### Animation Technical Details (v1.1.0)
+
 ```javascript
 // Track previously seen earthquake IDs
 const previousQuakeIds = useRef(new Set());
@@ -191,21 +210,22 @@ const previousQuakeIds = useRef(new Set());
 const isNew = !previousQuakeIds.current.has(quakeId);
 
 // Apply animation classes
-className: isNew ? 'earthquake-pulse-new' : 'earthquake-marker'
+className: isNew ? 'earthquake-pulse-new' : 'earthquake-marker';
 
 // Create pulse ring for new quakes
 if (isNew) {
   const pulseRing = L.circle([lat, lon], {
-    radius: 50000,  // 50km in meters
-    className: 'earthquake-pulse-ring'
+    radius: 50000, // 50km in meters
+    className: 'earthquake-pulse-ring',
   });
-  
+
   // Auto-remove after animation completes
   setTimeout(() => map.removeLayer(pulseRing), 3000);
 }
 ```
 
 ### Data Flow
+
 ```
 USGS Seismic Network → GeoJSON API → OpenHamClock → Animated Map Display
       (real-time)        (5 min delay)    (5 min refresh)    (instant)
@@ -216,17 +236,20 @@ USGS Seismic Network → GeoJSON API → OpenHamClock → Animated Map Display
 ## 🔍 Troubleshooting
 
 ### No Earthquakes Showing
+
 1. **Check time period**: Only M2.5+ from last 24 hours
 2. **Zoom level**: Zoom in if markers are clustered
 3. **Opacity**: Increase opacity slider
 4. **Global coverage**: Earthquakes occur worldwide, may not be local
 
 ### Animation Not Playing
+
 - **First load**: Animation only plays for NEW earthquakes detected after plugin is enabled
 - **Refresh required**: Toggle plugin off/on to reset "new" detection
 - **Cache**: Clear browser cache if animations appear stuck
 
 ### Performance Issues
+
 - **Many earthquakes**: If 200+ quakes, consider zooming in
 - **Animation lag**: Disable and re-enable plugin to reset
 - **Browser**: Use modern browser (Chrome, Firefox, Edge)
@@ -245,6 +268,7 @@ USGS Seismic Network → GeoJSON API → OpenHamClock → Animated Map Display
 ## 📝 Version History
 
 ### v1.1.0 (2026-02-03)
+
 - **NEW**: Animated new earthquake detection
 - Growing dot animation (0.6s)
 - Pulse ring effect (3s, 50km radius)
@@ -253,6 +277,7 @@ USGS Seismic Network → GeoJSON API → OpenHamClock → Animated Map Display
 - Updated description and documentation
 
 ### v1.0.0 (Initial Release)
+
 - Live USGS earthquake data (M2.5+, 24hr)
 - Magnitude-based sizing (8-40px)
 - Color-coded by magnitude (6 categories)
@@ -265,6 +290,7 @@ USGS Seismic Network → GeoJSON API → OpenHamClock → Animated Map Display
 ## 💡 Tips & Best Practices
 
 ### For Best Results
+
 1. **Leave enabled overnight** to catch new seismic events with animation
 2. **Set opacity to 80-90%** for clear visibility
 3. **Click for details** - popups contain valuable information
@@ -272,12 +298,14 @@ USGS Seismic Network → GeoJSON API → OpenHamClock → Animated Map Display
 5. **Cross-reference with USGS** using detail links for official reports
 
 ### Animation Behavior
+
 - **First enable**: No animations (all quakes treated as "existing")
 - **After 5 min**: New quakes detected since last refresh animate
 - **Toggle off/on**: Resets "new" detection (all quakes animate next refresh)
 - **Best experience**: Keep plugin enabled continuously
 
 ### Common Workflows
+
 - **Daily Monitoring**: Enable at start of day, check periodically
 - **Event Tracking**: After major quake, monitor aftershocks
 - **Regional Focus**: Zoom to area of interest (e.g., Pacific Ring of Fire)
@@ -312,4 +340,4 @@ USGS Seismic Network → GeoJSON API → OpenHamClock → Animated Map Display
 
 **73 de OpenHamClock** 📡🌋
 
-*Seismic awareness for the radio amateur*
+_Seismic awareness for the radio amateur_
diff --git a/src/plugins/layers/grayline/README.md b/src/plugins/layers/grayline/README.md
index 5e9d65b3..336af65b 100644
--- a/src/plugins/layers/grayline/README.md
+++ b/src/plugins/layers/grayline/README.md
@@ -16,9 +16,10 @@ The Gray Line (Solar Terminator) Propagation Overlay plugin visualizes the bound
 ## 🌟 Features
 
 ### Core Capabilities
+
 - **Real-time Solar Terminator**: Live day/night boundary calculation
 - **Enhanced DX Zone**: Highlight ±5° region around terminator (peak propagation)
-- **Three Twilight Zones**: 
+- **Three Twilight Zones**:
   - Civil Twilight (-6° solar altitude)
   - Nautical Twilight (-12° solar altitude)
   - Astronomical Twilight (-18° solar altitude)
@@ -28,6 +29,7 @@ The Gray Line (Solar Terminator) Propagation Overlay plugin visualizes the bound
 - **Minimizable Panel**: Click header or toggle icon to minimize
 
 ### Visual Components
+
 - **Terminator Line**: Orange dashed line (solar altitude = 0°)
 - **Enhanced DX Zone**: Yellow shaded band (±5° from terminator)
 - **Twilight Zones**: Blue-purple gradient overlays (adjustable opacity 20-100%)
@@ -41,7 +43,7 @@ The Gray Line (Solar Terminator) Propagation Overlay plugin visualizes the bound
 
 The gray line is the transition zone between day and night. During this period:
 
-1. **D-Layer Absorption Reduces**: 
+1. **D-Layer Absorption Reduces**:
    - D-layer (60-90 km altitude) absorbs HF signals during the day
    - At twilight, D-layer weakens rapidly while F-layer remains ionized
    - Result: Signals can propagate long distances with less attenuation
@@ -64,32 +66,35 @@ The gray line is the transition zone between day and night. During this period:
 ### Propagation Characteristics
 
 | Frequency Band | Gray Line Effect | Typical DX Range |
-|----------------|------------------|------------------|
-| 160m (1.8 MHz) | Excellent | 2000-5000 km |
-| 80m (3.5 MHz) | Excellent | 2000-6000 km |
-| 40m (7 MHz) | Very Good | 3000-8000 km |
-| 30m (10 MHz) | Good | 4000-10000 km |
-| 20m (14 MHz) | Good | 5000-12000 km |
-| 17m (18 MHz) | Moderate | 5000-10000 km |
-| 15m (21 MHz) | Moderate | 6000-10000 km |
-| 12m (24 MHz) | Fair | 6000-8000 km |
-| 10m (28 MHz) | Fair | 6000-8000 km |
+| -------------- | ---------------- | ---------------- |
+| 160m (1.8 MHz) | Excellent        | 2000-5000 km     |
+| 80m (3.5 MHz)  | Excellent        | 2000-6000 km     |
+| 40m (7 MHz)    | Very Good        | 3000-8000 km     |
+| 30m (10 MHz)   | Good             | 4000-10000 km    |
+| 20m (14 MHz)   | Good             | 5000-12000 km    |
+| 17m (18 MHz)   | Moderate         | 5000-10000 km    |
+| 15m (21 MHz)   | Moderate         | 6000-10000 km    |
+| 12m (24 MHz)   | Fair             | 6000-8000 km     |
+| 10m (28 MHz)   | Fair             | 6000-8000 km     |
 
 ### Best Times for Gray Line DX
 
 **1. Sunrise Enhancement (Local)**
+
 - **When**: 30 minutes before to 30 minutes after local sunrise
 - **Direction**: West to East paths
 - **Bands**: 80m, 40m, 30m excellent; 20m-10m good
 - **Why**: Your D-layer weakening, F-layer still strong
 
 **2. Sunset Enhancement (Local)**
+
 - **When**: 30 minutes before to 30 minutes after local sunset
 - **Direction**: East to West paths
 - **Bands**: 80m, 40m, 30m excellent; 20m-10m good
 - **Why**: Your D-layer weakening, F-layer still strong
 
 **3. Cross-Terminator Paths**
+
 - **When**: Your location and DX location both on gray line
 - **Direction**: Any direction along terminator
 - **Bands**: All HF bands (especially low bands)
@@ -102,30 +107,40 @@ The gray line is the transition zone between day and night. During this period:
 ## 🎯 Use Cases
 
 ### 1. **Long-Distance DX Contacts**
+
 Identify optimal times for working rare DX stations.
+
 - **Example**: West Coast USA to Europe on 80m at sunrise
 - **Strategy**: Watch for when both locations are on terminator
 
 ### 2. **Contest Operating**
+
 Maximize QSO rates during gray line openings.
+
 - **Peak times**: Sunrise and sunset periods
 - **Focus**: Low bands (80m, 40m) during twilight
 - **Multiply contacts**: Work multiple continents during peak
 
 ### 3. **DXpedition Planning**
+
 Plan operating schedule around gray line windows.
+
 - **Identify**: Best times for target regions
 - **Coordinate**: With other operators in different time zones
 - **Optimize**: Antenna patterns for gray line directions
 
 ### 4. **Propagation Learning**
+
 Understand day/night transition effects on propagation.
+
 - **Visual**: See terminator move in real-time
 - **Compare**: With actual propagation (use WSPR plugin)
 - **Learn**: Correlation between gray line and enhanced propagation
 
 ### 5. **Operating Strategy**
+
 Plan band and direction changes based on terminator position.
+
 - **Morning**: Work west on 80m/40m as sun rises
 - **Evening**: Work east on 80m/40m as sun sets
 - **Night**: Follow terminator around the globe on 160m
@@ -158,22 +173,26 @@ Plan band and direction changes based on terminator position.
 ### Interpreting the Display
 
 #### Terminator Line (Orange Dashed)
+
 - **Solar Altitude**: Exactly 0°
 - **Day/Night**: Left side is day, right side is night (varies by direction)
 - **Sine Wave**: Amplitude = solar declination (~23.5° max)
 
 #### Enhanced DX Zone (Yellow Band)
+
 - **Region**: ±5° around terminator (solar altitude -5° to +5°)
 - **Peak Propagation**: Best DX conditions in this zone
 - **Width**: ~550 km (340 miles) total width
 
 #### Twilight Zones (Blue-Purple Gradient)
+
 - **Civil Twilight**: Sun -6° below horizon (brightest twilight)
 - **Nautical Twilight**: Sun -12° below horizon (darker)
 - **Astronomical Twilight**: Sun -18° below horizon (darkest before true night)
 - **Propagation**: Twilight zones show extended D-layer weakening
 
 #### Real-Time Animation
+
 - **Update**: Every 60 seconds
 - **Movement**: Terminator moves westward (~15° per hour)
 - **Earth Rotation**: Terminator is fixed in space; Earth rotates beneath it
@@ -183,6 +202,7 @@ Plan band and direction changes based on terminator position.
 ## ⚙️ Configuration
 
 ### Default Settings
+
 ```javascript
 {
   enabled: false,
@@ -198,11 +218,12 @@ Plan band and direction changes based on terminator position.
 ```
 
 ### Twilight Opacity Range (v1.0.2)
+
 - **Minimum**: 20%
 - **Maximum**: 100%
 - **Default**: 50%
 - **Step**: 5%
-- **Use Case**: 
+- **Use Case**:
   - 20-30%: Subtle overlay, casual viewing
   - 50-70%: Balanced visibility, general use
   - 80-100%: Maximum visibility, analysis/study
@@ -214,12 +235,13 @@ Plan band and direction changes based on terminator position.
 ### Astronomical Calculations
 
 #### Solar Position
+
 ```javascript
 // Calculate solar declination
 const N = dayOfYear(date);
-const L = (280.460 + 0.9856474 * N) % 360;
+const L = (280.46 + 0.9856474 * N) % 360;
 const g = (357.528 + 0.9856003 * N) % 360;
-const eclipticLon = L + 1.915 * sin(g) + 0.020 * sin(2 * g);
+const eclipticLon = L + 1.915 * sin(g) + 0.02 * sin(2 * g);
 const declination = asin(sin(eclipticLon) * sin(23.439));
 
 // Calculate hour angle
@@ -227,13 +249,11 @@ const solarTime = ut + longitude / 15;
 const hourAngle = (solarTime - 12) * 15;
 
 // Calculate solar altitude
-const altitude = asin(
-  sin(latitude) * sin(declination) + 
-  cos(latitude) * cos(declination) * cos(hourAngle)
-);
+const altitude = asin(sin(latitude) * sin(declination) + cos(latitude) * cos(declination) * cos(hourAngle));
 ```
 
 #### Terminator Line (Solar Altitude = 0°)
+
 ```javascript
 // For each longitude, solve for latitude where altitude = 0
 // sin(0) = sin(lat) * sin(dec) + cos(lat) * cos(dec) * cos(HA)
@@ -244,7 +264,9 @@ const latitude = atan(-cos(hourAngle) / tan(declination));
 ```
 
 #### Twilight Zones (Solar Altitude < 0°)
+
 Uses Newton-Raphson iteration to solve:
+
 ```javascript
 // For target altitude (e.g., -6°, -12°, -18°)
 // Iteratively solve: f(lat) = altitude - target = 0
@@ -253,6 +275,7 @@ Uses Newton-Raphson iteration to solve:
 ```
 
 ### Performance
+
 - **Update Frequency**: 60 seconds
 - **Calculation Time**: <10ms per update
 - **Points Generated**: 360 points per line (1° resolution)
@@ -260,6 +283,7 @@ Uses Newton-Raphson iteration to solve:
 - **Memory**: ~500 KB for all layers
 
 ### Data Flow
+
 ```
 System Clock → UTC Time → Solar Position → Terminator Calculation → Map Rendering
    (1 sec)      (instant)    (<5ms)          (<5ms)                  (<10ms)
@@ -270,22 +294,26 @@ System Clock → UTC Time → Solar Position → Terminator Calculation → Map
 ## 🔍 Troubleshooting
 
 ### Terminator Not Showing
+
 1. **Check opacity**: Increase main opacity slider
 2. **Zoom level**: Zoom in to see line detail
 3. **Toggle off/on**: Refresh the plugin
 4. **Browser**: Use modern browser (Chrome, Firefox, Edge)
 
 ### Line Not Smooth / Looks Jagged
+
 - **This is normal**: 360 points (1° resolution) is a good balance
 - **Map projection**: Mercator distortion near poles
 - **Zoom in**: Line appears smoother at higher zoom
 
 ### Line Not Moving
+
 - **60-second updates**: Movement is slow (Earth rotates 15°/hour = 0.25°/minute)
 - **Wait 5 minutes**: You should see noticeable shift
 - **Check UTC time**: If time not updating, refresh page
 
 ### Control Panel Won't Drag
+
 - **CTRL key**: Must hold CTRL while dragging
 - **Click header**: Drag the dark header bar, not the controls
 - **Cursor**: Should change to grab cursor when CTRL held
@@ -304,17 +332,20 @@ System Clock → UTC Time → Solar Position → Terminator Calculation → Map
 ## 📝 Version History
 
 ### v1.0.2 (2026-02-03)
+
 - Changed twilight opacity range to 20-100% (was 10-70%)
 - Increased default twilight opacity to 50% (was 30%)
 - Improved visibility for twilight zones
 
 ### v1.0.1 (2026-02-03)
+
 - Fixed terminator calculation for proper sine wave shape
 - Corrected spherical trigonometry formula
 - Improved twilight zone calculation with Newton-Raphson iteration
 - Better edge case handling (equinox, poles)
 
 ### v1.0.0 (2026-02-03)
+
 - Initial release
 - Real-time solar terminator calculation
 - Three twilight zones (civil, nautical, astronomical)
@@ -328,6 +359,7 @@ System Clock → UTC Time → Solar Position → Terminator Calculation → Map
 ## 💡 Tips & Best Practices
 
 ### For Best Results
+
 1. **Leave enabled overnight**: Watch terminator sweep across the globe
 2. **Combine with WSPR**: See correlation between gray line and enhanced propagation
 3. **Set twilight opacity to 30-50%**: Balanced view without overwhelming the map
@@ -337,29 +369,34 @@ System Clock → UTC Time → Solar Position → Terminator Calculation → Map
 ### Gray Line Operating Strategy
 
 #### Morning (Local Sunrise)
+
 1. **30 min before sunrise**: Start on 80m or 40m
 2. **Point west**: Work stations in your sunset
 3. **Listen east**: Work stations in their sunrise
 4. **As sun rises**: Move to higher bands (20m, 15m)
 
 #### Evening (Local Sunset)
+
 1. **30 min before sunset**: Start on 80m or 40m
 2. **Point east**: Work stations in their sunrise
 3. **Listen west**: Work stations in their sunset
 4. **After sunset**: Stay on low bands for best DX
 
 #### Cross-Terminator Magic
+
 - **Both on gray line**: Maximum propagation enhancement
 - **Check map**: See when your QTH and target are both on terminator
 - **Plan ahead**: Use time zones to calculate optimal times
 
 ### Common Workflows
+
 - **Morning Routine**: Enable plugin, check terminator position, select band/direction
 - **Contest**: Monitor terminator movement to anticipate band openings
 - **DX Chase**: Use terminator to predict when rare DX will be workable
 - **Learning**: Compare gray line with actual propagation (WSPR plugin)
 
 ### Combining with Other Plugins
+
 - **WSPR + Gray Line**: See enhanced propagation along terminator paths
 - **Aurora + Gray Line**: Identify aurora interference on twilight paths
 - **Earthquakes + Gray Line**: (No direct correlation, but interesting overlay)
@@ -393,4 +430,4 @@ System Clock → UTC Time → Solar Position → Terminator Calculation → Map
 
 **73 de OpenHamClock** 📡⏰
 
-*Ride the gray line to DX glory!*
+_Ride the gray line to DX glory!_
diff --git a/src/plugins/layers/lightning/README.md b/src/plugins/layers/lightning/README.md
index 69e803eb..4d402bef 100644
--- a/src/plugins/layers/lightning/README.md
+++ b/src/plugins/layers/lightning/README.md
@@ -16,6 +16,7 @@ The Lightning Detection plugin visualizes real-time lightning strikes on the map
 ## 🌟 Features
 
 ### Core Capabilities
+
 - **Real-time Lightning Strikes**: Visualize strikes with colored circle markers
 - **Animated Strike Detection**: Flash animation highlights new strikes (0.8s)
 - **Age-Based Color Coding**: Strikes fade from gold → orange → red → brown
@@ -27,6 +28,7 @@ The Lightning Detection plugin visualizes real-time lightning strikes on the map
 - **Stable Positions**: Strikes stay at exact locations (no movement/drift)
 
 ### Visual Indicators
+
 - **Colored Circle Markers**: Background color shows strike age (size 12-32px)
 - **Lightning Bolt Icon**: White ⚡ symbol centered on circle
 - **Flash Animation**: New strikes appear with bright gold glow (0.8s)
@@ -36,19 +38,21 @@ The Lightning Detection plugin visualizes real-time lightning strikes on the map
 - **🆕 Badge**: New strikes marked in popup
 
 ### Strike Age Colors
-| Age | Color | Hex | Meaning | Icon Size |
-|-----|-------|-----|---------|-----------|
-| <1 min | 🟡 Gold | #FFD700 | Fresh strike | 12-32px |
-| 1-5 min | 🟠 Orange | #FFA500 | Recent strike | 12-32px |
-| 5-15 min | 🔴 Red | #FF6B6B | Aging strike | 12-32px |
-| 15-30 min | 🔴 Dark Red | #CD5C5C | Old strike | 12-32px |
-| >30 min | 🟤 Brown | #8B4513 | Very old strike | 12-32px |
+
+| Age       | Color       | Hex     | Meaning         | Icon Size |
+| --------- | ----------- | ------- | --------------- | --------- |
+| <1 min    | 🟡 Gold     | #FFD700 | Fresh strike    | 12-32px   |
+| 1-5 min   | 🟠 Orange   | #FFA500 | Recent strike   | 12-32px   |
+| 5-15 min  | 🔴 Red      | #FF6B6B | Aging strike    | 12-32px   |
+| 15-30 min | 🔴 Dark Red | #CD5C5C | Old strike      | 12-32px   |
+| >30 min   | 🟤 Brown    | #8B4513 | Very old strike | 12-32px   |
 
 ---
 
 ## 📊 Data Details
 
 ### Data Source (Current: Simulated)
+
 - **Provider**: Simulated lightning data (demo mode)
 - **Update Frequency**: Every 30 seconds
 - **Time Window**: Last 30 minutes
@@ -56,13 +60,16 @@ The Lightning Detection plugin visualizes real-time lightning strikes on the map
 - **Strike Count**: ~50 strikes per update
 
 **Note**: This plugin is designed to integrate with real-time lightning networks like:
+
 - Blitzortung.org (global, community-based)
 - LightningMaps.org (visualization partner)
 - NOAA GLM (Geostationary Lightning Mapper)
 - Other regional networks
 
 ### Strike Properties
+
 Each lightning strike includes:
+
 - **Location**: Latitude, longitude (decimal degrees)
 - **Timestamp**: UTC time of strike
 - **Age**: Time since strike (seconds/minutes)
@@ -71,6 +78,7 @@ Each lightning strike includes:
 - **Region**: Approximate location name
 
 ### Lightning Science
+
 - **Positive Strikes (+)**: 10-15% of all strikes, more intense, typically 50-300 kA
 - **Negative Strikes (-)**: 85-90% of all strikes, less intense, typically 20-100 kA
 - **Cloud-to-Ground (CG)**: Most damaging and dangerous type
@@ -81,35 +89,45 @@ Each lightning strike includes:
 ## 🎯 Use Cases
 
 ### 1. **Safety Awareness**
+
 Monitor nearby lightning to protect yourself and equipment.
+
 - **Outdoor Operations**: Field Day, portable ops, antenna work
 - **Storm Watch**: Track approaching thunderstorms
 - **Lightning Distance**: Estimate strike proximity
 - **Shelter Decision**: When to seek shelter (30/30 rule)
 
 ### 2. **QRM/QRN Source Identification**
+
 Identify lightning as source of radio interference.
+
 - **S9+40dB Crashes**: Lightning-induced noise
 - **HF Noise**: Especially on low bands (160m, 80m, 40m)
 - **VHF/UHF Impact**: Local static crashes
 - **Correlation**: Match noise with strike times/locations
 
 ### 3. **Equipment Protection**
+
 Safeguard station equipment from lightning damage.
+
 - **Disconnect Antennas**: When nearby strikes detected
 - **Ground Station**: Proper grounding practices
 - **Surge Protection**: Monitor for risk periods
 - **Insurance**: Document strike events near station
 
 ### 4. **Operating Decisions**
+
 Plan radio activity around storm conditions.
+
 - **Delay Operations**: Wait for storms to pass
 - **Band Selection**: Avoid affected paths
 - **Contest Strategy**: Pause during electrical activity
 - **Emergency Comms**: EMCOMM safety protocols
 
 ### 5. **Meteorological Interest**
+
 Track storm development and intensity.
+
 - **Storm Tracking**: Follow storm movement
 - **Intensity Assessment**: Strike rate indicates severity
 - **Nowcasting**: Short-term weather prediction
@@ -149,18 +167,21 @@ Track storm development and intensity.
 ### Interpreting the Display
 
 #### Strike Markers
+
 - **Size**: Larger circles = more intense strikes (5-20px)
 - **Color**: Age-based fading (gold → brown over 30 minutes)
 - **Border**: Thick white border on new strikes
 - **Animation**: Flash + pulse ring for new strikes
 
 #### Statistics Panel (Top-Left)
+
 - **Real-time counts** by age category
 - **Polarity breakdown** (positive vs. negative)
 - **Average intensity** in kiloamperes
 - **Updates every 30 seconds**
 
 #### Safety Indicators
+
 - **Gold strikes near your QTH**: Immediate danger zone
 - **High strike count**: Active thunderstorm
 - **Increasing fresh strikes**: Intensifying storm
@@ -171,6 +192,7 @@ Track storm development and intensity.
 ## ⚙️ Configuration
 
 ### Default Settings
+
 ```javascript
 {
   enabled: false,
@@ -183,6 +205,7 @@ Track storm development and intensity.
 ```
 
 ### Animation Settings
+
 ```css
 /* Flash animation (new strikes) */
 .lightning-strike-new {
@@ -208,6 +231,7 @@ Track storm development and intensity.
 ## 🧪 Technical Details
 
 ### Implementation
+
 - **Marker Type**: Leaflet CircleMarker
 - **Data Format**: JSON (timestamp, lat/lon, intensity, polarity)
 - **Coordinate System**: WGS84 (EPSG:4326)
@@ -215,6 +239,7 @@ Track storm development and intensity.
 - **Animation**: CSS keyframes + class toggling
 
 ### Performance
+
 - **Typical Load**: 50 strikes per update
 - **Marker Rendering**: <50ms for 50 strikes
 - **Update Frequency**: 30 seconds (30,000ms)
@@ -222,6 +247,7 @@ Track storm development and intensity.
 - **Memory**: ~1 MB for 50 strikes + animations
 
 ### Current Implementation: Simulated Data
+
 ```javascript
 // Demo mode generates ~50 strikes globally
 // Clustered around major cities (realistic storm patterns)
@@ -239,7 +265,9 @@ const stormCenters = [
 ```
 
 ### Future: Real API Integration
+
 When integrated with Blitzortung.org or similar:
+
 ```javascript
 // Production implementation
 const fetchLightning = async () => {
@@ -250,6 +278,7 @@ const fetchLightning = async () => {
 ```
 
 **Required Backend Endpoint:**
+
 - `GET /api/lightning/strikes`
 - Query params: `minutes`, `region`, `minIntensity`
 - Response: `{ strikes: [...], timestamp, source }`
@@ -259,22 +288,26 @@ const fetchLightning = async () => {
 ## 🔍 Troubleshooting
 
 ### No Lightning Showing
+
 1. **Demo mode**: Currently showing simulated data
 2. **Opacity**: Increase opacity slider
 3. **Zoom level**: Zoom in to see individual strikes
 4. **Real data**: Backend API not yet implemented
 
 ### Animation Not Playing
+
 - **First load**: Animation only for NEW strikes after plugin enabled
 - **Refresh**: Toggle plugin off/on to reset "new" detection
 - **Browser**: Use modern browser (Chrome, Firefox, Edge)
 
 ### Performance Issues
+
 - **Many strikes**: If >200 strikes, map may slow down
 - **Animation lag**: Reduce opacity or disable temporarily
 - **Browser**: Close other tabs, restart browser
 
 ### Statistics Not Updating
+
 - **Auto-refresh**: Stats update every 30 seconds automatically
 - **Manual refresh**: Toggle plugin off/on
 - **Data source**: Check if backend API is responding
@@ -294,6 +327,7 @@ const fetchLightning = async () => {
 ## 📝 Version History
 
 ### v1.0.0 (2026-02-03)
+
 - Initial release with simulated data
 - Real-time strike visualization
 - Age-based color coding (gold → brown)
@@ -310,30 +344,35 @@ const fetchLightning = async () => {
 ## 💡 Tips & Best Practices
 
 ### For Safety
+
 1. **30/30 Rule**: Seek shelter if time between flash and thunder <30 seconds; wait 30 minutes after last strike
 2. **6-Mile Rule**: Lightning can strike up to 10 miles from storm center
 3. **Disconnect Antennas**: When nearby gold strikes appear
 4. **Indoor Only**: Stay inside during electrical activity
 
 ### For Operations
+
 1. **Monitor continuously**: Leave plugin enabled during outdoor ops
 2. **Set opacity to 80-90%**: Clear visibility without overwhelming map
 3. **Watch fresh count**: Rising fresh strikes = intensifying storm
 4. **Compare with radar**: Use with Weather Radar plugin for full picture
 
 ### Animation Behavior
+
 - **First enable**: No animations (all strikes treated as "existing")
 - **After 30 sec**: New strikes detected since last refresh animate
 - **Toggle off/on**: Resets "new" detection (next refresh animates all)
 - **Best experience**: Keep plugin enabled continuously
 
 ### Common Workflows
+
 - **Field Day**: Enable at start of event, monitor throughout
 - **Antenna Work**: Check before climbing tower or touching antennas
 - **Storm Watch**: Track approaching storms during severe weather
 - **EMCOMM**: Safety monitor for outdoor emergency operations
 
 ### Combining with Other Plugins
+
 - **Weather Radar + Lightning**: Complete storm visualization
 - **WSPR + Lightning**: See lightning interference on propagation
 - **Gray Line + Lightning**: Lightning activity often peaks at twilight
@@ -361,6 +400,7 @@ const fetchLightning = async () => {
 ## 🚀 Future Enhancements
 
 ### Planned Features (v1.1.0+)
+
 - **Real-Time Data Integration**: Blitzortung.org API connection
 - **Alert Notifications**: Browser alerts for nearby strikes
 - **Distance Rings**: Concentric circles around user location (5, 10, 20 miles)
@@ -372,6 +412,7 @@ const fetchLightning = async () => {
 - **Altitude Data**: Cloud-to-ground vs. intra-cloud detection
 
 ### Integration Options
+
 - **Blitzortung.org**: Global community network (recommended)
 - **NOAA GLM**: Geostationary Lightning Mapper (Western Hemisphere)
 - **WWLLN**: World Wide Lightning Location Network
@@ -386,6 +427,7 @@ const fetchLightning = async () => {
 **Future Data License**: Blitzortung.org (non-commercial use)
 
 **Blitzortung.org Policy:**
+
 > The system is made for private and entertainment purposes. It is not an official information service for lightning data. A commercial use of our data is strongly prohibited.
 
 ---
@@ -406,4 +448,4 @@ const fetchLightning = async () => {
 
 **73 de OpenHamClock** 📡⚡
 
-*Stay aware, stay safe, and keep the static down!*
+_Stay aware, stay safe, and keep the static down!_
diff --git a/src/plugins/layers/rbn/README.md b/src/plugins/layers/rbn/README.md
index 84efbae7..9d52c21b 100644
--- a/src/plugins/layers/rbn/README.md
+++ b/src/plugins/layers/rbn/README.md
@@ -15,6 +15,7 @@ The Reverse Beacon Network (RBN) Plugin shows **who's hearing YOUR signal** in r
 ## What is RBN?
 
 The Reverse Beacon Network is a worldwide network of automated receiving stations (skimmers) that continuously monitor amateur radio bands for CW and digital signals. When they hear your callsign, they automatically post a "spot" showing:
+
 - Where you were heard (skimmer location)
 - Signal strength (SNR in dB)
 - Frequency and band
@@ -29,12 +30,14 @@ This gives you **instant feedback** on your antenna performance, propagation con
 ### ✅ v1.0.0 - Initial Release (Latest)
 
 #### **Real-Time Signal Monitoring**
+
 - Shows all skimmers currently hearing your callsign
 - Updates automatically every 2 minutes
 - Configurable time window (10-120 minutes)
 - Color-coded by signal strength (SNR)
 
 #### **Visual Elements**
+
 - **Circle Markers** at each skimmer location
   - Size scales with signal strength
   - Color indicates SNR level (Red=weak, Green=strong)
@@ -54,7 +57,9 @@ This gives you **instant feedback** on your antenna performance, propagation con
   - Average SNR across all spots
 
 #### **Signal Strength Color Coding**
+
 SNR-based color scale:
+
 - 🔴 **Red** (< 0 dB): Weak signal
 - 🟠 **Orange** (0-10 dB): Fair signal
 - 🟡 **Yellow** (10-20 dB): Good signal
@@ -62,6 +67,7 @@ SNR-based color scale:
 - 💚 **Bright Green** (30+ dB): Excellent signal
 
 #### **Marker Sizing**
+
 - < 0 dB: 6px radius (smallest)
 - 0-10 dB: 8px radius
 - 10-20 dB: 10px radius
@@ -69,7 +75,9 @@ SNR-based color scale:
 - 30+ dB: 14px radius (largest)
 
 #### **Interactive Popups**
+
 Click any skimmer marker to see:
+
 - Skimmer callsign
 - Your callsign (being heard)
 - Signal-to-noise ratio (SNR in dB)
@@ -79,6 +87,7 @@ Click any skimmer marker to see:
 - Timestamp
 
 #### **Performance Features**
+
 - 2-minute caching to reduce API load
 - Automatic cleanup of old layers
 - Efficient great circle path calculations
@@ -109,23 +118,27 @@ Click any skimmer marker to see:
 ### Using the Control Panel
 
 #### **Band Selector**
+
 - **All Bands**: Shows spots from all bands (default)
 - **Specific Band**: Filter to 160m, 80m, 40m, 30m, 20m, 17m, 15m, 12m, 10m, or 6m
 - Useful for checking propagation on contest bands
 
 #### **Time Window Slider**
+
 - **Range**: 10 to 120 minutes
 - **Default**: 30 minutes
 - **Purpose**: How far back to look for spots
 - Longer windows show more spots but may include stale data
 
 #### **Min SNR Threshold**
+
 - **Range**: -30 to +30 dB
 - **Default**: -10 dB
 - **Purpose**: Filter out weak signals
 - Increase to see only strong reports
 
 #### **Show Paths Toggle**
+
 - **ON**: Display dashed lines from your station to each skimmer
 - **OFF**: Show only skimmer markers
 - Useful for reducing map clutter
@@ -134,7 +147,7 @@ Click any skimmer marker to see:
 
 **Spots**: Total number of times you've been heard  
 **Skimmers**: Number of unique receiving stations  
-**Avg SNR**: Average signal strength across all reports  
+**Avg SNR**: Average signal strength across all reports
 
 Higher SNR = stronger signal = better propagation!
 
@@ -156,10 +169,12 @@ Higher SNR = stronger signal = better propagation!
 **Endpoint**: `/api/rbn`
 
 **Query Parameters**:
+
 - `callsign` (required): Your callsign (e.g., "VE3TOS", "K0CJH")
 - `limit` (optional): Max spots to return (default: 100)
 
 **Response Format**:
+
 ```json
 [
   {
@@ -177,6 +192,7 @@ Higher SNR = stronger signal = better propagation!
 ```
 
 **Response Fields**:
+
 - `callsign`: Skimmer that heard you
 - `frequency`: Frequency in Hz
 - `band`: Band (160m, 80m, etc.)
@@ -192,6 +208,7 @@ Higher SNR = stronger signal = better propagation!
 ## 🚀 Use Cases
 
 ### 1. **Antenna Testing**
+
 - Make a quick CW/digital transmission
 - Wait 2-5 minutes for plugin to update
 - See where your signal is being heard
@@ -199,24 +216,28 @@ Higher SNR = stronger signal = better propagation!
 - Track SNR improvements from antenna changes
 
 ### 2. **Propagation Checking**
+
 - Quick "am I getting out?" check before contest
 - See which bands are open in real-time
 - Identify skip zones and dead spots
 - Monitor propagation throughout the day
 
 ### 3. **Signal Reports**
+
 - Get objective SNR measurements from skimmers
 - Compare your signal strength to other stations
 - Validate local noise issues (low SNR everywhere)
 - Identify directional antenna patterns
 
 ### 4. **Contest Strategy**
+
 - Check which bands are working to needed multipliers
 - See signal strength to different continents
 - Identify best times for specific paths
 - Monitor band openings in real-time
 
 ### 5. **QRP Validation**
+
 - Running QRP (low power)?
 - RBN shows if anyone is hearing you
 - Objective proof of propagation
@@ -272,18 +293,19 @@ Higher SNR = stronger signal = better propagation!
 
 ### Comparing with Other Plugins
 
-| Plugin | What It Shows | Use Case |
-|--------|---------------|----------|
-| **RBN** | Who hears YOU | Antenna testing, signal reports |
-| **WSPR** | Global propagation | General band conditions |
-| **PSKReporter** | Who you hear | Reception analysis |
-| **DX Cluster** | Active DX stations | Chasing rare stations |
+| Plugin          | What It Shows      | Use Case                        |
+| --------------- | ------------------ | ------------------------------- |
+| **RBN**         | Who hears YOU      | Antenna testing, signal reports |
+| **WSPR**        | Global propagation | General band conditions         |
+| **PSKReporter** | Who you hear       | Reception analysis              |
+| **DX Cluster**  | Active DX stations | Chasing rare stations           |
 
 ---
 
 ## 🎨 Technical Implementation
 
 ### File Structure
+
 ```
 src/plugins/layers/
 ├── useRBN.js           # Main plugin file
@@ -292,12 +314,14 @@ src/plugins/layers/
 ```
 
 ### Architecture
+
 - **React Hooks-based**: Uses `useState`, `useEffect`, `useRef`
 - **Leaflet Integration**: Direct Leaflet.js API usage
 - **Zero Core Changes**: Plugin is completely self-contained
 - **Follows Plugin Pattern**: Matches existing plugins
 
 ### Key Functions
+
 - `gridToLatLon(grid)`: Converts Maidenhead grid to coordinates
 - `getSNRColor(snr)`: Maps SNR to color gradient
 - `getMarkerSize(snr)`: Maps SNR to marker size
@@ -306,6 +330,7 @@ src/plugins/layers/
 - `useLayer()`: Main plugin hook
 
 ### Dependencies
+
 - **React**: Component framework
 - **Leaflet**: Map rendering (`L.circleMarker`, `L.polyline`)
 - **Backend API**: `/api/rbn` endpoint
@@ -315,12 +340,14 @@ src/plugins/layers/
 ## 🐛 Troubleshooting
 
 ### Plugin Not Appearing
+
 - Check that `RBNPlugin` is imported in `layerRegistry.js`
 - Verify `metadata` export exists in `useRBN.js`
 - Check browser console for import errors
 - Rebuild: `npm run build`
 
 ### No Spots Displayed
+
 - **Check your callsign**: Must be configured in settings
 - **Default callsign**: "N0CALL" won't fetch data
 - **Transmit**: RBN only hears you when you transmit
@@ -328,17 +355,20 @@ src/plugins/layers/
 - **Check console**: Open DevTools → Console for errors
 
 ### Incorrect Marker Locations
+
 - RBN provides grid squares for skimmer locations
 - Grid-to-lat/lon conversion is approximate (±0.5°)
 - This is normal and expected behavior
 
 ### API Errors
+
 - RBN API may have rate limits
 - 2-minute cache reduces load
 - Try again in a few minutes
 - Check `/api/rbn?callsign=YOURCALL` directly
 
 ### Performance Issues
+
 - Reduce time window to 10-15 minutes
 - Increase SNR threshold to filter weak spots
 - Disable path lines (toggle off)
@@ -349,24 +379,28 @@ src/plugins/layers/
 ## 🚀 Future Enhancements (Roadmap)
 
 ### v1.1.0 - Enhanced Visualization (Planned)
+
 - [ ] **Signal Strength Heatmap**: Density map of strong reports
 - [ ] **Directional Pattern**: Polar plot showing signal distribution
 - [ ] **Historical Tracking**: Time-slider to replay past spots
 - [ ] **Best Reports Highlighting**: Auto-highlight strongest signals
 
 ### v1.2.0 - Advanced Filters (Planned)
+
 - [ ] **Mode Filter**: Filter by CW, RTTY, PSK, etc.
 - [ ] **Continent Filter**: Show only specific continents
 - [ ] **Distance Filter**: Show skimmers within X km range
 - [ ] **WPM Filter**: Filter CW by speed (for CW operators)
 
 ### v1.3.0 - Analytics (Planned)
+
 - [ ] **Coverage Map**: Grid square coverage visualization
 - [ ] **SNR Chart**: Historical SNR trends over time
 - [ ] **Band Comparison**: Side-by-side band performance
 - [ ] **Antenna Comparison**: Save/compare antenna configs
 
 ### v1.4.0 - Alerts & Notifications (Planned)
+
 - [ ] **New Continent Alert**: Notify when heard on new continent
 - [ ] **SNR Threshold Alert**: Alert when SNR exceeds threshold
 - [ ] **Band Opening Alert**: Notify when specific band opens
@@ -381,6 +415,7 @@ src/plugins/layers/
 **Want to help?** Pick an item from "Future Enhancements" above.
 
 ### Coding Standards
+
 - Follow existing plugin patterns
 - Keep code self-contained in plugin file
 - Add comments for complex logic
@@ -419,33 +454,43 @@ MIT License - Same as OpenHamClock project
 ## 📖 Frequently Asked Questions (FAQ)
 
 ### Q: Why don't I see any spots?
+
 **A:** You must be transmitting for RBN skimmers to hear you. Make some CQ calls or participate in a contest, then wait 2-5 minutes for the plugin to update.
 
 ### Q: Do I need to register with RBN?
+
 **A:** No registration required! RBN automatically detects and reports all amateur radio callsigns.
 
 ### Q: What modes does RBN support?
+
 **A:** CW (Morse code), RTTY, PSK31, PSK63, FT8, FT4, and other digital modes. Check reversebeacon.net for the full list.
 
 ### Q: Why are some markers far from their actual location?
+
 **A:** RBN provides grid squares (e.g., "FN31"), which are converted to approximate lat/lon. This is accurate to within about 70km.
 
 ### Q: Can I see spots from multiple callsigns?
+
 **A:** Currently, the plugin shows spots for your configured callsign only. Multi-callsign support may be added in future versions.
 
 ### Q: How accurate is the SNR measurement?
+
 **A:** SNR is measured by the skimmer's receiver and is quite accurate. However, different skimmers may use slightly different measurement methods.
 
 ### Q: Does this work for all bands?
+
 **A:** Yes! RBN covers all HF bands from 160m to 6m. Most activity is on CW contest bands (160m, 80m, 40m, 20m, 15m, 10m).
 
 ### Q: Can I use this to find my signal reports?
+
 **A:** Yes! RBN provides objective signal reports in dB. This is more accurate than the traditional RST system.
 
 ### Q: Why do paths look curved?
+
 **A:** Paths use great circle routes (shortest distance on a sphere), which appear curved on a flat map projection.
 
 ### Q: How often does RBN update?
+
 **A:** The plugin checks for new spots every 2 minutes. RBN skimmers report spots in real-time (within seconds of hearing you).
 
 ---
@@ -456,6 +501,6 @@ MIT License - Same as OpenHamClock project
 
 ---
 
-*73 de OpenHamClock Contributors! 📡*
+_73 de OpenHamClock Contributors! 📡_
 
-*"See your signal around the world!"* 🌍
+_"See your signal around the world!"_ 🌍
diff --git a/src/plugins/layers/satellite/README.md b/src/plugins/layers/satellite/README.md
index 4e72e1cb..2431c149 100644
--- a/src/plugins/layers/satellite/README.md
+++ b/src/plugins/layers/satellite/README.md
@@ -12,7 +12,7 @@ Data Source: Internal TLE API / satellite.js
 Overview
 The Satellite Tracks plugin provides high-performance, real-time orbital tracking and visualization for the OpenHamClock interface. It uses on-device orbital propagation to calculate precise positions, helping operators predict passes and monitor satellite telemetry in a dedicated data window.
 
-🌟 Features 
+🌟 Features
 Core Capabilities
 Real-time Propagation: Calculates satellite positions locally using satellite.js and TLE data fetched every 60 seconds.
 
@@ -64,4 +64,4 @@ Pin a Satellite: Click on any satellite icon on the map to open the focused data
 
 Configure Views: Use the config sliders to adjust Lead/Tail track lengths and toggle footprints.
 
-Close Data Window: Click the red "×" in the telemetry window or click the satellite again to unpin.
\ No newline at end of file
+Close Data Window: Click the red "×" in the telemetry window or click the satellite again to unpin.
diff --git a/src/plugins/layers/useAurora.js b/src/plugins/layers/useAurora.js
index 200bf1e9..0b43efce 100644
--- a/src/plugins/layers/useAurora.js
+++ b/src/plugins/layers/useAurora.js
@@ -15,7 +15,7 @@ export const metadata = {
   category: 'space-weather',
   defaultEnabled: false,
   defaultOpacity: 0.6,
-  version: '2.0.0'
+  version: '2.0.0',
 };
 
 // Aurora color ramp: transparent → green → yellow → red
@@ -150,7 +150,9 @@ export function useLayer({ enabled = false, opacity = 0.6, map = null }) {
 
     // Remove existing
     if (overlayLayer) {
-      try { map.removeLayer(overlayLayer); } catch (e) {}
+      try {
+        map.removeLayer(overlayLayer);
+      } catch (e) {}
       setOverlayLayer(null);
     }
 
@@ -213,12 +215,15 @@ export function useLayer({ enabled = false, opacity = 0.6, map = null }) {
 
       const overlay = L.imageOverlay(
         shiftedUrl,
-        [[-90, -180], [90, 180]],
+        [
+          [-90, -180],
+          [90, 180],
+        ],
         {
           opacity: opacity,
           zIndex: 210,
-          interactive: false
-        }
+          interactive: false,
+        },
       );
 
       overlay.addTo(map);
@@ -229,7 +234,9 @@ export function useLayer({ enabled = false, opacity = 0.6, map = null }) {
 
     return () => {
       if (overlayLayer && map) {
-        try { map.removeLayer(overlayLayer); } catch (e) {}
+        try {
+          map.removeLayer(overlayLayer);
+        } catch (e) {}
       }
     };
   }, [enabled, auroraData, map]);
@@ -247,6 +254,6 @@ export function useLayer({ enabled = false, opacity = 0.6, map = null }) {
     refresh: () => {
       setAuroraData(null);
       fetchingRef.current = false;
-    }
+    },
   };
 }
diff --git a/src/plugins/layers/useCityLights.js b/src/plugins/layers/useCityLights.js
index da20c59d..d31e4da0 100644
--- a/src/plugins/layers/useCityLights.js
+++ b/src/plugins/layers/useCityLights.js
@@ -15,20 +15,21 @@ export const metadata = {
 
 export const useLayer = ({ map, enabled, opacity }) => {
   const layerRef = useRef(null);
-  const nightUrl = 'https://gibs.earthdata.nasa.gov/wmts/epsg3857/best/VIIRS_CityLights_2012/default/2012-03-12/GoogleMapsCompatible_Level8/{z}/{y}/{x}.jpg';
+  const nightUrl =
+    'https://gibs.earthdata.nasa.gov/wmts/epsg3857/best/VIIRS_CityLights_2012/default/2012-03-12/GoogleMapsCompatible_Level8/{z}/{y}/{x}.jpg';
 
   useEffect(() => {
     if (!map) return;
 
     const L = window.L;
-    
+
     // Create the layer if it doesn't exist
     if (!layerRef.current) {
       layerRef.current = L.tileLayer(nightUrl, {
         attribution: 'NASA GIBS',
         noWrap: false,
         pane: 'nightPane', // Ensure it still uses the blended pane
-        zIndex: 1
+        zIndex: 1,
       });
     }
 
@@ -50,4 +51,4 @@ export const useLayer = ({ map, enabled, opacity }) => {
       layerRef.current.setOpacity(opacity);
     }
   }, [opacity, enabled]);
-};
\ No newline at end of file
+};
diff --git a/src/plugins/layers/useEarthquakes.js b/src/plugins/layers/useEarthquakes.js
index e0d1cefb..74f8ef1b 100644
--- a/src/plugins/layers/useEarthquakes.js
+++ b/src/plugins/layers/useEarthquakes.js
@@ -19,7 +19,7 @@ export const metadata = {
   category: 'geology',
   defaultEnabled: false,
   defaultOpacity: 0.9,
-  version: '1.2.0'
+  version: '1.2.0',
 };
 
 export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemoryMode = false }) {
@@ -27,7 +27,7 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
   const [earthquakeData, setEarthquakeData] = useState([]);
   const previousQuakeIds = useRef(new Set());
   const isFirstLoad = useRef(true);
-  
+
   // Low memory mode limits
   const MAX_QUAKES = lowMemoryMode ? 20 : 100;
   const REFRESH_INTERVAL = lowMemoryMode ? 600000 : 300000; // 10 min vs 5 min
@@ -40,7 +40,7 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
       try {
         // USGS GeoJSON feed - All earthquakes from last hour
         const response = await fetch(
-          'https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/2.5_day.geojson'
+          'https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/2.5_day.geojson',
           //'https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/all_hour.geojson'
         );
         const data = await response.json();
@@ -64,7 +64,7 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
     if (!map || typeof L === 'undefined') return;
 
     // Clear old markers
-    markersRef.forEach(marker => {
+    markersRef.forEach((marker) => {
       try {
         map.removeLayer(marker);
       } catch (e) {
@@ -81,18 +81,18 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
     const newMarkers = [];
     const currentQuakeIds = new Set();
 
-    earthquakeData.forEach(quake => {
+    earthquakeData.forEach((quake) => {
       const coords = quake.geometry.coordinates;
       const props = quake.properties;
       const mag = props.mag;
-      
+
       // GeoJSON standard format: [longitude, latitude, elevation]
       // For Santa Lucía, Peru: [-70.5639, -15.6136, 206.486]
       //   coords[0] = -70.5639 = Longitude (W)
       //   coords[1] = -15.6136 = Latitude (S)
       //   coords[2] = 206.486 = Depth (km)
-      const lat = coords[1];  // Latitude (y-axis)
-      const lon = coords[0];  // Longitude (x-axis)
+      const lat = coords[1]; // Latitude (y-axis)
+      const lon = coords[0]; // Longitude (x-axis)
       const depth = coords[2];
       const quakeId = quake.id;
 
@@ -103,7 +103,7 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
         geojson: `[lon=${coords[0]}, lat=${coords[1]}, depth=${coords[2]}]`,
         extracted: `lat=${lat} (coords[1]), lon=${lon} (coords[0])`,
         leafletMarkerCall: `L.marker([${lat}, ${lon}])`,
-        explanation: `Standard Leaflet [latitude, longitude] format - CSS position fixed`
+        explanation: `Standard Leaflet [latitude, longitude] format - CSS position fixed`,
       });
 
       currentQuakeIds.add(quakeId);
@@ -120,23 +120,29 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
 
       // Color based on magnitude (gets redder with stronger quakes)
       let color;
-      if (mag < 2) color = '#90EE90'; // Light green - micro
-      else if (mag < 3) color = '#FFEB3B'; // Yellow - minor
-      else if (mag < 4) color = '#FFA500'; // Orange - light
-      else if (mag < 5) color = '#FF6600'; // Deep orange - moderate
-      else if (mag < 6) color = '#FF3300'; // Red - strong
-      else if (mag < 7) color = '#CC0000'; // Dark red - major
+      if (mag < 2)
+        color = '#90EE90'; // Light green - micro
+      else if (mag < 3)
+        color = '#FFEB3B'; // Yellow - minor
+      else if (mag < 4)
+        color = '#FFA500'; // Orange - light
+      else if (mag < 5)
+        color = '#FF6600'; // Deep orange - moderate
+      else if (mag < 6)
+        color = '#FF3300'; // Red - strong
+      else if (mag < 7)
+        color = '#CC0000'; // Dark red - major
       else color = '#8B0000'; // Very dark red - great
 
       // Create earthquake icon with visible shake/wave symbol
       const waveIcon = `
-        <svg width="${size*0.8}" height="${size*0.8}" viewBox="0 0 32 32" style="fill: white; stroke: white; stroke-width: 1;">
+        <svg width="${size * 0.8}" height="${size * 0.8}" viewBox="0 0 32 32" style="fill: white; stroke: white; stroke-width: 1;">
           <path d="M16 4 L13 12 L10 8 L8 16 L6 12 L4 20 M16 4 L19 12 L22 8 L24 16 L26 12 L28 20" stroke-width="2" fill="none"/>
           <circle cx="16" cy="16" r="3" fill="white"/>
           <path d="M16 22 L14 26 L18 26 Z" fill="white"/>
         </svg>
       `;
-      
+
       const icon = L.divIcon({
         className: 'earthquake-icon',
         html: `<div style="
@@ -153,23 +159,23 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
           box-shadow: 0 2px 8px rgba(0,0,0,0.5);
         ">${waveIcon}</div>`,
         iconSize: [size, size],
-        iconAnchor: [size/2, size/2],
-        popupAnchor: [0, 0]  // Popup appears at the marker position (icon center)
+        iconAnchor: [size / 2, size / 2],
+        popupAnchor: [0, 0], // Popup appears at the marker position (icon center)
       });
-      
+
       console.log(`📍 Creating marker for ${quakeId}: M${mag.toFixed(1)} at [lat=${lat}, lon=${lon}] - ${props.place}`);
-      
+
       // Use standard Leaflet [latitude, longitude] format
       // The popup was appearing in the correct location, confirming marker position is correct
       // The icon was appearing offset due to CSS position: relative issue (now fixed)
-      const markerCoords = [lat, lon];  // CORRECT: [latitude, longitude]
-      
+      const markerCoords = [lat, lon]; // CORRECT: [latitude, longitude]
+
       console.log(`   → Creating L.marker([${markerCoords[0]}, ${markerCoords[1]}]) = [lat, lon]`);
-      
-      const circle = L.marker(markerCoords, { 
-        icon, 
+
+      const circle = L.marker(markerCoords, {
+        icon,
         opacity,
-        zIndexOffset: 10000 // Ensure markers appear on top
+        zIndexOffset: 10000, // Ensure markers appear on top
       });
 
       // Add to map first
@@ -185,7 +191,7 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
               const iconDiv = iconElement.querySelector('div');
               if (iconDiv) {
                 iconDiv.classList.add('earthquake-pulse-new');
-                
+
                 // Remove animation class after it completes (0.8s)
                 setTimeout(() => {
                   try {
@@ -198,7 +204,7 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
             console.warn('Could not animate earthquake marker:', e);
           }
         }, 10);
-        
+
         // Create pulsing ring effect - use same [lat, lon] format
         const pulseRing = L.circle([lat, lon], {
           radius: 50000, // 50km radius in meters
@@ -207,11 +213,11 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
           color: color,
           weight: 3,
           opacity: 0.8,
-          className: 'earthquake-pulse-ring'
+          className: 'earthquake-pulse-ring',
         });
-        
+
         pulseRing.addTo(map);
-        
+
         // Remove pulse ring after animation completes
         setTimeout(() => {
           try {
@@ -224,9 +230,7 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
       const time = new Date(props.time);
       const timeStr = time.toLocaleString();
       const ageMinutes = Math.floor((Date.now() - props.time) / 60000);
-      const ageStr = ageMinutes < 60 
-        ? `${ageMinutes} min ago` 
-        : `${Math.floor(ageMinutes / 60)} hr ago`;
+      const ageStr = ageMinutes < 60 ? `${ageMinutes} min ago` : `${Math.floor(ageMinutes / 60)} hr ago`;
 
       // Add popup with details
       circle.bindPopup(`
@@ -253,7 +257,7 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
 
     // Update previous quake IDs for next comparison
     previousQuakeIds.current = currentQuakeIds;
-    
+
     // After first load, allow animations for new quakes
     if (isFirstLoad.current) {
       isFirstLoad.current = false;
@@ -263,7 +267,7 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
     setMarkersRef(newMarkers);
 
     return () => {
-      newMarkers.forEach(marker => {
+      newMarkers.forEach((marker) => {
         try {
           map.removeLayer(marker);
         } catch (e) {
@@ -275,6 +279,6 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
 
   return {
     markers: markersRef,
-    earthquakeCount: earthquakeData.length
+    earthquakeCount: earthquakeData.length,
   };
 }
diff --git a/src/plugins/layers/useGrayLine.js b/src/plugins/layers/useGrayLine.js
index 0c161dc3..84061915 100644
--- a/src/plugins/layers/useGrayLine.js
+++ b/src/plugins/layers/useGrayLine.js
@@ -2,7 +2,7 @@ import { useState, useEffect, useRef } from 'react';
 
 /**
  * Gray Line Propagation Overlay Plugin v1.0.1
- * 
+ *
  * Features:
  * - Real-time solar terminator (day/night boundary)
  * - Twilight zones (civil, nautical, astronomical)
@@ -11,7 +11,7 @@ import { useState, useEffect, useRef } from 'react';
  * - Color-coded by propagation potential
  * - Minimizable control panel
  * - Corrected sine wave calculation (v1.0.1)
- * 
+ *
  * Use Case: Identify optimal times for long-distance DX contacts
  * The gray line provides enhanced HF propagation for several hours
  */
@@ -24,64 +24,65 @@ export const metadata = {
   category: 'propagation',
   defaultEnabled: false,
   defaultOpacity: 0.5,
-  version: '1.0.2'
+  version: '1.0.2',
 };
 
 // Solar calculations based on astronomical algorithms
 function calculateSolarPosition(date) {
   const JD = dateToJulianDate(date);
   const T = (JD - 2451545.0) / 36525.0; // Julian centuries since J2000.0
-  
+
   // Mean longitude of the sun
   const L0 = (280.46646 + 36000.76983 * T + 0.0003032 * T * T) % 360;
-  
+
   // Mean anomaly
   const M = (357.52911 + 35999.05029 * T - 0.0001537 * T * T) % 360;
-  const MRad = M * Math.PI / 180;
-  
+  const MRad = (M * Math.PI) / 180;
+
   // Equation of center
-  const C = (1.914602 - 0.004817 * T - 0.000014 * T * T) * Math.sin(MRad)
-          + (0.019993 - 0.000101 * T) * Math.sin(2 * MRad)
-          + 0.000289 * Math.sin(3 * MRad);
-  
+  const C =
+    (1.914602 - 0.004817 * T - 0.000014 * T * T) * Math.sin(MRad) +
+    (0.019993 - 0.000101 * T) * Math.sin(2 * MRad) +
+    0.000289 * Math.sin(3 * MRad);
+
   // True longitude
   const trueLon = L0 + C;
-  
+
   // Apparent longitude
   const omega = 125.04 - 1934.136 * T;
-  const lambda = trueLon - 0.00569 - 0.00478 * Math.sin(omega * Math.PI / 180);
-  
+  const lambda = trueLon - 0.00569 - 0.00478 * Math.sin((omega * Math.PI) / 180);
+
   // Obliquity of ecliptic
   const epsilon = 23.439291 - 0.0130042 * T;
-  const epsilonRad = epsilon * Math.PI / 180;
-  const lambdaRad = lambda * Math.PI / 180;
-  
+  const epsilonRad = (epsilon * Math.PI) / 180;
+  const lambdaRad = (lambda * Math.PI) / 180;
+
   // Solar declination
-  const declination = Math.asin(Math.sin(epsilonRad) * Math.sin(lambdaRad)) * 180 / Math.PI;
-  
+  const declination = (Math.asin(Math.sin(epsilonRad) * Math.sin(lambdaRad)) * 180) / Math.PI;
+
   // Solar right ascension
-  const RA = Math.atan2(Math.cos(epsilonRad) * Math.sin(lambdaRad), Math.cos(lambdaRad)) * 180 / Math.PI;
-  
+  const RA = (Math.atan2(Math.cos(epsilonRad) * Math.sin(lambdaRad), Math.cos(lambdaRad)) * 180) / Math.PI;
+
   return { declination, rightAscension: RA };
 }
 
 function dateToJulianDate(date) {
-  return (date.getTime() / 86400000) + 2440587.5;
+  return date.getTime() / 86400000 + 2440587.5;
 }
 
 // Calculate solar hour angle for a given longitude at a specific time
 function calculateHourAngle(date, longitude) {
   const JD = dateToJulianDate(date);
   const T = (JD - 2451545.0) / 36525.0;
-  
+
   // Greenwich Mean Sidereal Time
-  const GMST = (280.46061837 + 360.98564736629 * (JD - 2451545.0) + 0.000387933 * T * T - T * T * T / 38710000) % 360;
-  
+  const GMST = (280.46061837 + 360.98564736629 * (JD - 2451545.0) + 0.000387933 * T * T - (T * T * T) / 38710000) % 360;
+
   const { rightAscension } = calculateSolarPosition(date);
-  
+
   // Local hour angle
   const hourAngle = (GMST + longitude - rightAscension + 360) % 360;
-  
+
   return hourAngle;
 }
 
@@ -89,14 +90,14 @@ function calculateHourAngle(date, longitude) {
 function calculateSolarAltitude(date, latitude, longitude) {
   const { declination } = calculateSolarPosition(date);
   const hourAngle = calculateHourAngle(date, longitude);
-  
-  const latRad = latitude * Math.PI / 180;
-  const decRad = declination * Math.PI / 180;
-  const haRad = hourAngle * Math.PI / 180;
-  
+
+  const latRad = (latitude * Math.PI) / 180;
+  const decRad = (declination * Math.PI) / 180;
+  const haRad = (hourAngle * Math.PI) / 180;
+
   const sinAlt = Math.sin(latRad) * Math.sin(decRad) + Math.cos(latRad) * Math.cos(decRad) * Math.cos(haRad);
-  const altitude = Math.asin(sinAlt) * 180 / Math.PI;
-  
+  const altitude = (Math.asin(sinAlt) * 180) / Math.PI;
+
   return altitude;
 }
 
@@ -104,49 +105,49 @@ function calculateSolarAltitude(date, latitude, longitude) {
 // This replaces the old splitAtDateLine approach, which broke when map center was past ±180°
 function unwrapAndCopyLine(points) {
   if (points.length < 2) return [points];
-  
+
   // Step 1: Unwrap longitudes so they're continuous
-  const unwrapped = points.map(p => [...p]);
+  const unwrapped = points.map((p) => [...p]);
   for (let i = 1; i < unwrapped.length; i++) {
-    while (unwrapped[i][1] - unwrapped[i-1][1] > 180) unwrapped[i][1] -= 360;
-    while (unwrapped[i][1] - unwrapped[i-1][1] < -180) unwrapped[i][1] += 360;
+    while (unwrapped[i][1] - unwrapped[i - 1][1] > 180) unwrapped[i][1] -= 360;
+    while (unwrapped[i][1] - unwrapped[i - 1][1] < -180) unwrapped[i][1] += 360;
   }
-  
+
   // Step 2: Create 3 world copies so lines render past the dateline
   const copies = [];
   for (const offset of [-360, 0, 360]) {
     copies.push(unwrapped.map(([lat, lon]) => [lat, lon + offset]));
   }
-  
+
   return copies;
 }
 
 // Unwrap and copy a polygon (upper + lower bounds creating a closed shape)
 function unwrapAndCopyPolygon(upperPoints, lowerPoints) {
   if (upperPoints.length < 2 || lowerPoints.length < 2) return [];
-  
+
   // Unwrap both lines
-  const upperUnwrapped = upperPoints.map(p => [...p]);
+  const upperUnwrapped = upperPoints.map((p) => [...p]);
   for (let i = 1; i < upperUnwrapped.length; i++) {
-    while (upperUnwrapped[i][1] - upperUnwrapped[i-1][1] > 180) upperUnwrapped[i][1] -= 360;
-    while (upperUnwrapped[i][1] - upperUnwrapped[i-1][1] < -180) upperUnwrapped[i][1] += 360;
+    while (upperUnwrapped[i][1] - upperUnwrapped[i - 1][1] > 180) upperUnwrapped[i][1] -= 360;
+    while (upperUnwrapped[i][1] - upperUnwrapped[i - 1][1] < -180) upperUnwrapped[i][1] += 360;
   }
-  
-  const lowerUnwrapped = lowerPoints.map(p => [...p]);
+
+  const lowerUnwrapped = lowerPoints.map((p) => [...p]);
   for (let i = 1; i < lowerUnwrapped.length; i++) {
-    while (lowerUnwrapped[i][1] - lowerUnwrapped[i-1][1] > 180) lowerUnwrapped[i][1] -= 360;
-    while (lowerUnwrapped[i][1] - lowerUnwrapped[i-1][1] < -180) lowerUnwrapped[i][1] += 360;
+    while (lowerUnwrapped[i][1] - lowerUnwrapped[i - 1][1] > 180) lowerUnwrapped[i][1] -= 360;
+    while (lowerUnwrapped[i][1] - lowerUnwrapped[i - 1][1] < -180) lowerUnwrapped[i][1] += 360;
   }
-  
+
   // Combine into closed polygon ring
   const baseRing = [...upperUnwrapped, ...lowerUnwrapped.slice().reverse()];
-  
+
   // Create 3 world copies
   const copies = [];
   for (const offset of [-360, 0, 360]) {
     copies.push(baseRing.map(([lat, lon]) => [lat, lon + offset]));
   }
-  
+
   return copies;
 }
 
@@ -154,26 +155,26 @@ function unwrapAndCopyPolygon(upperPoints, lowerPoints) {
 function generateTerminatorLine(date, solarAltitude = 0, numPoints = 360) {
   const points = [];
   const { declination } = calculateSolarPosition(date);
-  const decRad = declination * Math.PI / 180;
-  const altRad = solarAltitude * Math.PI / 180;
-  
+  const decRad = (declination * Math.PI) / 180;
+  const altRad = (solarAltitude * Math.PI) / 180;
+
   // For each longitude, calculate the latitude where the sun is at the specified altitude
   for (let i = 0; i <= numPoints; i++) {
     const lon = (i / numPoints) * 360 - 180;
     const hourAngle = calculateHourAngle(date, lon);
-    const haRad = hourAngle * Math.PI / 180;
-    
+    const haRad = (hourAngle * Math.PI) / 180;
+
     const cosHA = Math.cos(haRad);
     const sinDec = Math.sin(decRad);
     const cosDec = Math.cos(decRad);
     const sinAlt = Math.sin(altRad);
-    
+
     let lat;
-    
+
     // Check if solution exists (sun can reach this altitude at this longitude)
     // For terminator and twilight, check if |cos(HA) * cos(dec)| <= 1 - sin(alt) * sin(dec)
     const testValue = (sinAlt - sinDec * sinDec) / (cosDec * cosDec * cosHA * cosHA);
-    
+
     if (Math.abs(declination) < 0.01) {
       // Near equinox: terminator is nearly straight along equator
       lat = 0;
@@ -183,12 +184,12 @@ function generateTerminatorLine(date, solarAltitude = 0, numPoints = 360) {
     } else {
       // Standard case: calculate terminator latitude
       const tanDec = Math.tan(decRad);
-      
+
       if (solarAltitude === 0) {
         // Terminator (sunrise/sunset line)
         // Formula: tan(lat) = -cos(HA) / tan(dec)
         if (Math.abs(tanDec) > 0.0001) {
-          lat = Math.atan(-cosHA / tanDec) * 180 / Math.PI;
+          lat = (Math.atan(-cosHA / tanDec) * 180) / Math.PI;
         } else {
           lat = 0;
         }
@@ -196,56 +197,56 @@ function generateTerminatorLine(date, solarAltitude = 0, numPoints = 360) {
         // Twilight zones (negative solar altitude)
         // Use Newton-Raphson iteration to solve for latitude
         // Equation: sin(lat) * sin(dec) + cos(lat) * cos(dec) * cos(HA) = sin(alt)
-        
+
         // Initial guess based on terminator
         let testLat = Math.atan(-cosHA / tanDec);
-        
+
         // Iterate to find solution
         let converged = false;
         for (let iter = 0; iter < 10; iter++) {
           const f = Math.sin(testLat) * sinDec + Math.cos(testLat) * cosDec * cosHA - sinAlt;
           const fPrime = Math.cos(testLat) * sinDec - Math.sin(testLat) * cosDec * cosHA;
-          
+
           if (Math.abs(f) < 0.0001) {
             converged = true;
             break;
           }
-          
+
           if (Math.abs(fPrime) > 0.0001) {
             testLat = testLat - f / fPrime;
           } else {
             break;
           }
-          
+
           // Constrain to valid latitude range during iteration
-          testLat = Math.max(-Math.PI/2, Math.min(Math.PI/2, testLat));
+          testLat = Math.max(-Math.PI / 2, Math.min(Math.PI / 2, testLat));
         }
-        
+
         // Only use the point if iteration converged
         if (!converged) {
           continue;
         }
-        
-        lat = testLat * 180 / Math.PI;
+
+        lat = (testLat * 180) / Math.PI;
       }
     }
-    
+
     // Strict clamping to valid latitude range
     lat = Math.max(-85, Math.min(85, lat));
-    
+
     // Only add point if it's valid and not at extreme latitude
     if (isFinite(lat) && isFinite(lon) && Math.abs(lat) < 85) {
       points.push([lat, lon]);
     }
   }
-  
+
   return points;
 }
 
 // Make control panel draggable and minimizable
 function makeDraggable(element, storageKey, skipPositionLoad = false) {
   if (!element) return;
-  
+
   // Load saved position only if not already loaded
   if (!skipPositionLoad) {
     const saved = localStorage.getItem(storageKey);
@@ -253,7 +254,7 @@ function makeDraggable(element, storageKey, skipPositionLoad = false) {
       try {
         const data = JSON.parse(saved);
         element.style.position = 'fixed';
-        
+
         // Check if saved as percentage (new format) or pixels (old format)
         if (data.topPercent !== undefined && data.leftPercent !== undefined) {
           // Use percentage-based positioning (scales with zoom)
@@ -266,7 +267,7 @@ function makeDraggable(element, storageKey, skipPositionLoad = false) {
           element.style.top = topPercent + '%';
           element.style.left = leftPercent + '%';
         }
-        
+
         element.style.right = 'auto';
         element.style.bottom = 'auto';
         element.style.transform = 'none';
@@ -281,12 +282,12 @@ function makeDraggable(element, storageKey, skipPositionLoad = false) {
       element.style.bottom = 'auto';
     }
   }
-  
+
   element.title = 'Hold CTRL and drag to reposition';
-  
+
   let isDragging = false;
   let startX, startY, startLeft, startTop;
-  
+
   const updateCursor = (e) => {
     if (e.ctrlKey) {
       element.style.cursor = 'grab';
@@ -294,7 +295,7 @@ function makeDraggable(element, storageKey, skipPositionLoad = false) {
       element.style.cursor = 'default';
     }
   };
-  
+
   element.addEventListener('mouseenter', updateCursor);
   element.addEventListener('mousemove', updateCursor);
   document.addEventListener('keydown', (e) => {
@@ -303,50 +304,50 @@ function makeDraggable(element, storageKey, skipPositionLoad = false) {
   document.addEventListener('keyup', (e) => {
     if (e.key === 'Control') updateCursor(e);
   });
-  
-  element.addEventListener('mousedown', function(e) {
+
+  element.addEventListener('mousedown', function (e) {
     if (!e.ctrlKey) return;
     if (e.target.tagName === 'SELECT' || e.target.tagName === 'INPUT' || e.target.tagName === 'LABEL') {
       return;
     }
-    
+
     isDragging = true;
     startX = e.clientX;
     startY = e.clientY;
     startLeft = element.offsetLeft;
     startTop = element.offsetTop;
-    
+
     element.style.cursor = 'grabbing';
     element.style.opacity = '0.8';
     e.preventDefault();
   });
-  
-  document.addEventListener('mousemove', function(e) {
+
+  document.addEventListener('mousemove', function (e) {
     if (!isDragging) return;
-    
+
     const dx = e.clientX - startX;
     const dy = e.clientY - startY;
-    
-    element.style.left = (startLeft + dx) + 'px';
-    element.style.top = (startTop + dy) + 'px';
+
+    element.style.left = startLeft + dx + 'px';
+    element.style.top = startTop + dy + 'px';
   });
-  
-  document.addEventListener('mouseup', function(e) {
+
+  document.addEventListener('mouseup', function (e) {
     if (isDragging) {
       isDragging = false;
       element.style.opacity = '1';
       updateCursor(e);
-      
+
       // Save position as percentage of viewport for zoom compatibility
       const topPercent = (element.offsetTop / window.innerHeight) * 100;
       const leftPercent = (element.offsetLeft / window.innerWidth) * 100;
-      
+
       const position = {
         topPercent,
         leftPercent,
         // Keep pixel values for backward compatibility
         top: element.offsetTop,
-        left: element.offsetLeft
+        left: element.offsetLeft,
       };
       localStorage.setItem(storageKey, JSON.stringify(position));
     }
@@ -355,17 +356,17 @@ function makeDraggable(element, storageKey, skipPositionLoad = false) {
 
 function addMinimizeToggle(element, storageKey) {
   if (!element) return;
-  
+
   const minimizeKey = storageKey + '-minimized';
   const header = element.querySelector('div:first-child');
   if (!header) return;
-  
+
   const content = Array.from(element.children).slice(1);
   const contentWrapper = document.createElement('div');
   contentWrapper.className = 'grayline-panel-content';
-  content.forEach(child => contentWrapper.appendChild(child));
+  content.forEach((child) => contentWrapper.appendChild(child));
   element.appendChild(contentWrapper);
-  
+
   const minimizeBtn = document.createElement('span');
   minimizeBtn.className = 'grayline-minimize-btn';
   minimizeBtn.innerHTML = '▼';
@@ -380,31 +381,31 @@ function addMinimizeToggle(element, storageKey) {
     transition: opacity 0.2s;
   `;
   minimizeBtn.title = 'Minimize/Maximize';
-  
+
   minimizeBtn.addEventListener('mouseenter', () => {
     minimizeBtn.style.opacity = '1';
   });
   minimizeBtn.addEventListener('mouseleave', () => {
     minimizeBtn.style.opacity = '0.7';
   });
-  
+
   header.style.display = 'flex';
   header.style.justifyContent = 'space-between';
   header.style.alignItems = 'center';
   header.appendChild(minimizeBtn);
-  
+
   const isMinimized = localStorage.getItem(minimizeKey) === 'true';
   if (isMinimized) {
     contentWrapper.style.display = 'none';
     minimizeBtn.innerHTML = '▶';
     element.style.cursor = 'pointer';
   }
-  
+
   const toggle = (e) => {
     if (e && e.ctrlKey) return;
-    
+
     const isCurrentlyMinimized = contentWrapper.style.display === 'none';
-    
+
     if (isCurrentlyMinimized) {
       contentWrapper.style.display = 'block';
       minimizeBtn.innerHTML = '▼';
@@ -417,13 +418,13 @@ function addMinimizeToggle(element, storageKey) {
       localStorage.setItem(minimizeKey, 'true');
     }
   };
-  
+
   header.addEventListener('click', (e) => {
     if (e.target === header || e.target.tagName === 'DIV') {
       toggle(e);
     }
   });
-  
+
   minimizeBtn.addEventListener('click', (e) => {
     e.stopPropagation();
     toggle(e);
@@ -436,21 +437,21 @@ export function useLayer({ enabled = false, opacity = 0.5, map = null }) {
   const [showTwilight, setShowTwilight] = useState(true);
   const [showEnhancedZone, setShowEnhancedZone] = useState(true);
   const [twilightOpacity, setTwilightOpacity] = useState(0.5);
-  
+
   const controlRef = useRef(null);
   const updateIntervalRef = useRef(null);
 
   // Update time every minute
   useEffect(() => {
     if (!enabled) return;
-    
+
     const updateTime = () => {
       setCurrentTime(new Date());
     };
-    
+
     updateTime(); // Initial update
     updateIntervalRef.current = setInterval(updateTime, 60000); // Every minute
-    
+
     return () => {
       if (updateIntervalRef.current) {
         clearInterval(updateIntervalRef.current);
@@ -464,7 +465,7 @@ export function useLayer({ enabled = false, opacity = 0.5, map = null }) {
 
     const GrayLineControl = L.Control.extend({
       options: { position: 'topright' },
-      onAdd: function() {
+      onAdd: function () {
         const container = L.DomUtil.create('div', 'grayline-control');
         container.style.cssText = `
           background: var(--bg-panel);
@@ -477,10 +478,10 @@ export function useLayer({ enabled = false, opacity = 0.5, map = null }) {
           box-shadow: 0 2px 8px rgba(0,0,0,0.3);
           min-width: 200px;
         `;
-        
+
         const now = new Date();
         const timeStr = now.toUTCString();
-        
+
         container.innerHTML = `
           <div style="font-weight: bold; margin-bottom: 8px; font-size: 12px;">🌅 Gray Line</div>
           
@@ -513,18 +514,18 @@ export function useLayer({ enabled = false, opacity = 0.5, map = null }) {
             <div style="margin-top: 4px;">Updates every minute</div>
           </div>
         `;
-        
+
         L.DomEvent.disableClickPropagation(container);
         L.DomEvent.disableScrollPropagation(container);
-        
+
         return container;
-      }
+      },
     });
-    
+
     const control = new GrayLineControl();
     map.addControl(control);
     controlRef.current = control;
-    
+
     setTimeout(() => {
       const container = document.querySelector('.grayline-control');
       if (container) {
@@ -540,17 +541,17 @@ export function useLayer({ enabled = false, opacity = 0.5, map = null }) {
             container.style.bottom = 'auto';
           } catch (e) {}
         }
-        
+
         makeDraggable(container, 'grayline-position');
         addMinimizeToggle(container, 'grayline-position');
       }
-      
+
       // Add event listeners
       const twilightCheck = document.getElementById('grayline-twilight');
       const enhancedCheck = document.getElementById('grayline-enhanced');
       const twilightOpacitySlider = document.getElementById('grayline-twilight-opacity');
       const twilightOpacityValue = document.getElementById('twilight-opacity-value');
-      
+
       if (twilightCheck) {
         twilightCheck.addEventListener('change', (e) => setShowTwilight(e.target.checked));
       }
@@ -565,7 +566,6 @@ export function useLayer({ enabled = false, opacity = 0.5, map = null }) {
         });
       }
     }, 150);
-    
   }, [enabled, map]);
 
   // Update time display
@@ -581,24 +581,24 @@ export function useLayer({ enabled = false, opacity = 0.5, map = null }) {
     if (!map || !enabled) return;
 
     // Clear old layers
-    layers.forEach(layer => {
+    layers.forEach((layer) => {
       try {
         map.removeLayer(layer);
       } catch (e) {}
     });
-    
+
     const newLayers = [];
-    
+
     // Main terminator (solar altitude = 0°)
     const terminator = generateTerminatorLine(currentTime, 0, 360);
     const terminatorCopies = unwrapAndCopyLine(terminator);
-    
-    terminatorCopies.forEach(segment => {
+
+    terminatorCopies.forEach((segment) => {
       const terminatorLine = L.polyline(segment, {
         color: '#ff6600',
         weight: 3,
         opacity: opacity * 0.8,
-        dashArray: '10, 5'
+        dashArray: '10, 5',
       });
       terminatorLine.bindPopup(`
         <div style="font-family: 'JetBrains Mono', monospace;">
@@ -611,23 +611,23 @@ export function useLayer({ enabled = false, opacity = 0.5, map = null }) {
       terminatorLine.addTo(map);
       newLayers.push(terminatorLine);
     });
-    
+
     // Enhanced DX zone (±5° from terminator)
     if (showEnhancedZone) {
       const enhancedUpper = generateTerminatorLine(currentTime, 5, 360);
       const enhancedLower = generateTerminatorLine(currentTime, -5, 360);
-      
+
       // Only create polygon if we have valid points
       if (enhancedUpper.length > 2 && enhancedLower.length > 2) {
         const polygonCopies = unwrapAndCopyPolygon(enhancedUpper, enhancedLower);
-        
+
         if (polygonCopies.length > 0) {
           const enhancedPoly = L.polygon(polygonCopies, {
             color: '#ffaa00',
             fillColor: '#ffaa00',
             fillOpacity: opacity * 0.15,
             weight: 1,
-            opacity: opacity * 0.3
+            opacity: opacity * 0.3,
           });
           enhancedPoly.bindPopup(`
             <div style="font-family: 'JetBrains Mono', monospace;">
@@ -642,19 +642,19 @@ export function useLayer({ enabled = false, opacity = 0.5, map = null }) {
         }
       }
     }
-    
+
     // Twilight zones
     if (showTwilight) {
       // Civil twilight (sun altitude -6°)
       const civilTwilight = generateTerminatorLine(currentTime, -6, 360);
       const civilCopies = unwrapAndCopyLine(civilTwilight);
-      
-      civilCopies.forEach(segment => {
+
+      civilCopies.forEach((segment) => {
         const civilLine = L.polyline(segment, {
           color: '#4488ff',
           weight: 2,
           opacity: twilightOpacity * 0.6,
-          dashArray: '5, 5'
+          dashArray: '5, 5',
         });
         civilLine.bindPopup(`
           <div style="font-family: 'JetBrains Mono', monospace;">
@@ -666,17 +666,17 @@ export function useLayer({ enabled = false, opacity = 0.5, map = null }) {
         civilLine.addTo(map);
         newLayers.push(civilLine);
       });
-      
+
       // Nautical twilight (sun altitude -12°)
       const nauticalTwilight = generateTerminatorLine(currentTime, -12, 360);
       const nauticalCopies = unwrapAndCopyLine(nauticalTwilight);
-      
-      nauticalCopies.forEach(segment => {
+
+      nauticalCopies.forEach((segment) => {
         const nauticalLine = L.polyline(segment, {
           color: '#6666ff',
           weight: 1.5,
           opacity: twilightOpacity * 0.4,
-          dashArray: '3, 3'
+          dashArray: '3, 3',
         });
         nauticalLine.bindPopup(`
           <div style="font-family: 'JetBrains Mono', monospace;">
@@ -688,17 +688,17 @@ export function useLayer({ enabled = false, opacity = 0.5, map = null }) {
         nauticalLine.addTo(map);
         newLayers.push(nauticalLine);
       });
-      
+
       // Astronomical twilight (sun altitude -18°)
       const astroTwilight = generateTerminatorLine(currentTime, -18, 360);
       const astroCopies = unwrapAndCopyLine(astroTwilight);
-      
-      astroCopies.forEach(segment => {
+
+      astroCopies.forEach((segment) => {
         const astroLine = L.polyline(segment, {
           color: '#8888ff',
           weight: 1,
           opacity: twilightOpacity * 0.3,
-          dashArray: '2, 2'
+          dashArray: '2, 2',
         });
         astroLine.bindPopup(`
           <div style="font-family: 'JetBrains Mono', monospace;">
@@ -711,11 +711,11 @@ export function useLayer({ enabled = false, opacity = 0.5, map = null }) {
         newLayers.push(astroLine);
       });
     }
-    
+
     setLayers(newLayers);
-    
+
     return () => {
-      newLayers.forEach(layer => {
+      newLayers.forEach((layer) => {
         try {
           map.removeLayer(layer);
         } catch (e) {}
@@ -732,8 +732,8 @@ export function useLayer({ enabled = false, opacity = 0.5, map = null }) {
         // Silently handle removal errors
       }
       controlRef.current = null;
-      
-      layers.forEach(layer => {
+
+      layers.forEach((layer) => {
         try {
           map.removeLayer(layer);
         } catch (e) {}
@@ -746,6 +746,6 @@ export function useLayer({ enabled = false, opacity = 0.5, map = null }) {
     layers,
     currentTime,
     showTwilight,
-    showEnhancedZone
+    showEnhancedZone,
   };
 }
diff --git a/src/plugins/layers/useGreatCircle.js b/src/plugins/layers/useGreatCircle.js
index be4ac425..f31d4272 100644
--- a/src/plugins/layers/useGreatCircle.js
+++ b/src/plugins/layers/useGreatCircle.js
@@ -13,7 +13,7 @@ export const metadata = {
   category: 'propagation',
   defaultEnabled: false,
   defaultOpacity: 0.8,
-  version: '1.0.0'
+  version: '1.0.0',
 };
 
 /**
@@ -56,10 +56,9 @@ export function useLayer({ enabled = false, opacity = 0.8, map = null }) {
 
     const check = () => {
       const { de, dx } = readLocations();
-      setLocations(prev => {
+      setLocations((prev) => {
         if (!de || !dx) return prev;
-        if (prev.de?.lat === de.lat && prev.de?.lon === de.lon &&
-            prev.dx?.lat === dx.lat && prev.dx?.lon === dx.lon) {
+        if (prev.de?.lat === de.lat && prev.de?.lon === de.lon && prev.dx?.lat === dx.lat && prev.dx?.lon === dx.lon) {
           return prev;
         }
         return { de, dx };
@@ -76,8 +75,10 @@ export function useLayer({ enabled = false, opacity = 0.8, map = null }) {
     if (!map || typeof L === 'undefined') return;
 
     // Remove old layers
-    layersRef.current.forEach(l => {
-      try { map.removeLayer(l); } catch (e) {}
+    layersRef.current.forEach((l) => {
+      try {
+        map.removeLayer(l);
+      } catch (e) {}
     });
     layersRef.current = [];
 
@@ -107,7 +108,7 @@ export function useLayer({ enabled = false, opacity = 0.8, map = null }) {
 
     // Short path — solid cyan line (replicated across world copies)
     const spPoints = getGreatCirclePoints(de.lat, de.lon, dx.lat, dx.lon, 100);
-    replicatePath(spPoints).forEach(copy => {
+    replicatePath(spPoints).forEach((copy) => {
       const spLine = L.polyline(copy, {
         color: '#00d4ff',
         weight: 2.5,
@@ -122,7 +123,7 @@ export function useLayer({ enabled = false, opacity = 0.8, map = null }) {
     // Long path — dashed purple line (replicated across world copies)
     const lpPoints = getLongPathPoints(de.lat, de.lon, dx.lat, dx.lon);
     if (lpPoints.length > 0) {
-      replicatePath(lpPoints).forEach(copy => {
+      replicatePath(lpPoints).forEach((copy) => {
         const lpLine = L.polyline(copy, {
           color: '#b388ff',
           weight: 1.5,
@@ -137,8 +138,10 @@ export function useLayer({ enabled = false, opacity = 0.8, map = null }) {
     }
 
     return () => {
-      layersRef.current.forEach(l => {
-        try { map.removeLayer(l); } catch (e) {}
+      layersRef.current.forEach((l) => {
+        try {
+          map.removeLayer(l);
+        } catch (e) {}
       });
       layersRef.current = [];
     };
@@ -147,8 +150,10 @@ export function useLayer({ enabled = false, opacity = 0.8, map = null }) {
   // Cleanup on disable
   useEffect(() => {
     if (!enabled && map) {
-      layersRef.current.forEach(l => {
-        try { map.removeLayer(l); } catch (e) {}
+      layersRef.current.forEach((l) => {
+        try {
+          map.removeLayer(l);
+        } catch (e) {}
       });
       layersRef.current = [];
     }
diff --git a/src/plugins/layers/useLightning.js b/src/plugins/layers/useLightning.js
index 47f2e230..dda32d80 100644
--- a/src/plugins/layers/useLightning.js
+++ b/src/plugins/layers/useLightning.js
@@ -12,7 +12,7 @@ export const metadata = {
   category: 'weather',
   defaultEnabled: false,
   defaultOpacity: 0.9,
-  version: '2.0.0'
+  version: '2.0.0',
 };
 
 // LZW decompression - Blitzortung uses LZW compression for WebSocket data
@@ -24,13 +24,13 @@ function lzwDecode(compressed) {
   const out = [currChar];
   let code = 256;
   let phrase;
-  
+
   for (let i = 1; i < data.length; i++) {
     const currCode = data[i].charCodeAt(0);
     if (currCode < 256) {
       phrase = data[i];
     } else {
-      phrase = dict[currCode] ? dict[currCode] : (oldPhrase + currChar);
+      phrase = dict[currCode] ? dict[currCode] : oldPhrase + currChar;
     }
     out.push(phrase);
     currChar = phrase.charAt(0);
@@ -38,19 +38,18 @@ function lzwDecode(compressed) {
     code++;
     oldPhrase = phrase;
   }
-  
+
   return out.join('');
 }
 
 // Haversine formula for distance calculation
 function calculateDistance(lat1, lon1, lat2, lon2, unit = 'km') {
   const R = unit === 'km' ? 6371.14 : 3963.1; // Earth radius in km or miles
-  const dLat = (lat2 - lat1) * Math.PI / 180;
-  const dLon = (lon2 - lon1) * Math.PI / 180;
-  const a = 
+  const dLat = ((lat2 - lat1) * Math.PI) / 180;
+  const dLon = ((lon2 - lon1) * Math.PI) / 180;
+  const a =
     Math.sin(dLat / 2) * Math.sin(dLat / 2) +
-    Math.cos(lat1 * Math.PI / 180) * Math.cos(lat2 * Math.PI / 180) *
-    Math.sin(dLon / 2) * Math.sin(dLon / 2);
+    Math.cos((lat1 * Math.PI) / 180) * Math.cos((lat2 * Math.PI) / 180) * Math.sin(dLon / 2) * Math.sin(dLon / 2);
   const c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a));
   return R * c;
 }
@@ -67,7 +66,7 @@ function getStrikeColor(ageMinutes) {
 // Make control draggable with CTRL+drag
 function makeDraggable(element, storageKey, skipPositionLoad = false) {
   if (!element) return;
-  
+
   // Load saved position only if not already loaded
   if (!skipPositionLoad) {
     const saved = localStorage.getItem(storageKey);
@@ -75,7 +74,7 @@ function makeDraggable(element, storageKey, skipPositionLoad = false) {
       try {
         const data = JSON.parse(saved);
         element.style.position = 'fixed';
-        
+
         // Check if saved as percentage (new format) or pixels (old format)
         if (data.topPercent !== undefined && data.leftPercent !== undefined) {
           // Use percentage-based positioning (scales with zoom)
@@ -88,7 +87,7 @@ function makeDraggable(element, storageKey, skipPositionLoad = false) {
           element.style.top = topPercent + '%';
           element.style.left = leftPercent + '%';
         }
-        
+
         element.style.right = 'auto';
         element.style.bottom = 'auto';
         element.style.transform = 'none';
@@ -103,12 +102,12 @@ function makeDraggable(element, storageKey, skipPositionLoad = false) {
       element.style.bottom = 'auto';
     }
   }
-  
+
   element.title = 'Hold CTRL and drag to reposition';
-  
+
   let isDragging = false;
   let startX, startY, startLeft, startTop;
-  
+
   const updateCursor = (e) => {
     if (e.ctrlKey) {
       element.style.cursor = 'grab';
@@ -116,7 +115,7 @@ function makeDraggable(element, storageKey, skipPositionLoad = false) {
       element.style.cursor = 'default';
     }
   };
-  
+
   element.addEventListener('mouseenter', updateCursor);
   element.addEventListener('mousemove', updateCursor);
   document.addEventListener('keydown', (e) => {
@@ -125,50 +124,50 @@ function makeDraggable(element, storageKey, skipPositionLoad = false) {
   document.addEventListener('keyup', (e) => {
     if (e.key === 'Control') updateCursor(e);
   });
-  
-  element.addEventListener('mousedown', function(e) {
+
+  element.addEventListener('mousedown', function (e) {
     if (!e.ctrlKey) return;
     if (e.target.tagName === 'SELECT' || e.target.tagName === 'INPUT' || e.target.tagName === 'LABEL') {
       return;
     }
-    
+
     isDragging = true;
     startX = e.clientX;
     startY = e.clientY;
     startLeft = element.offsetLeft;
     startTop = element.offsetTop;
-    
+
     element.style.cursor = 'grabbing';
     element.style.opacity = '0.8';
     e.preventDefault();
   });
-  
-  document.addEventListener('mousemove', function(e) {
+
+  document.addEventListener('mousemove', function (e) {
     if (!isDragging) return;
-    
+
     const dx = e.clientX - startX;
     const dy = e.clientY - startY;
-    
-    element.style.left = (startLeft + dx) + 'px';
-    element.style.top = (startTop + dy) + 'px';
+
+    element.style.left = startLeft + dx + 'px';
+    element.style.top = startTop + dy + 'px';
   });
-  
-  document.addEventListener('mouseup', function(e) {
+
+  document.addEventListener('mouseup', function (e) {
     if (isDragging) {
       isDragging = false;
       element.style.opacity = '1';
       updateCursor(e);
-      
+
       // Save position as percentage of viewport for zoom compatibility
       const topPercent = (element.offsetTop / window.innerHeight) * 100;
       const leftPercent = (element.offsetLeft / window.innerWidth) * 100;
-      
+
       const position = {
         topPercent,
         leftPercent,
         // Keep pixel values for backward compatibility
         top: element.offsetTop,
-        left: element.offsetLeft
+        left: element.offsetLeft,
       };
       localStorage.setItem(storageKey, JSON.stringify(position));
     }
@@ -178,18 +177,18 @@ function makeDraggable(element, storageKey, skipPositionLoad = false) {
 // Add minimize/maximize toggle
 function addMinimizeToggle(element, storageKey) {
   if (!element) return;
-  
+
   const minimizeKey = storageKey + '-minimized';
   const header = element.firstElementChild;
   if (!header) return;
-  
+
   // Wrap content
   const content = Array.from(element.children).slice(1);
   const contentWrapper = document.createElement('div');
   contentWrapper.className = 'lightning-panel-content';
-  content.forEach(child => contentWrapper.appendChild(child));
+  content.forEach((child) => contentWrapper.appendChild(child));
   element.appendChild(contentWrapper);
-  
+
   // Add minimize button
   const minimizeBtn = document.createElement('span');
   minimizeBtn.className = 'lightning-minimize-btn';
@@ -205,19 +204,19 @@ function addMinimizeToggle(element, storageKey) {
     transition: opacity 0.2s;
   `;
   minimizeBtn.title = 'Minimize/Maximize';
-  
+
   minimizeBtn.addEventListener('mouseenter', () => {
     minimizeBtn.style.opacity = '1';
   });
   minimizeBtn.addEventListener('mouseleave', () => {
     minimizeBtn.style.opacity = '0.7';
   });
-  
+
   header.style.display = 'flex';
   header.style.justifyContent = 'space-between';
   header.style.alignItems = 'center';
   header.appendChild(minimizeBtn);
-  
+
   // Load saved state
   const isMinimized = localStorage.getItem(minimizeKey) === 'true';
   if (isMinimized) {
@@ -225,13 +224,13 @@ function addMinimizeToggle(element, storageKey) {
     minimizeBtn.innerHTML = '▶';
     element.style.cursor = 'pointer';
   }
-  
+
   // Toggle function
   const toggle = (e) => {
     if (e && e.ctrlKey) return;
-    
+
     const isCurrentlyMinimized = contentWrapper.style.display === 'none';
-    
+
     if (isCurrentlyMinimized) {
       contentWrapper.style.display = 'block';
       minimizeBtn.innerHTML = '▼';
@@ -244,7 +243,7 @@ function addMinimizeToggle(element, storageKey) {
       localStorage.setItem(minimizeKey, 'true');
     }
   };
-  
+
   minimizeBtn.addEventListener('click', toggle);
   header.addEventListener('click', (e) => {
     if (e.target === minimizeBtn || e.target.parentElement === minimizeBtn) {
@@ -267,7 +266,7 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
   const previousStrikeIds = useRef(new Set());
   const currentServerIndexRef = useRef(0); // Track which server we're using
   const connectionAttemptsRef = useRef(0); // Track connection attempts
-  
+
   // Low memory mode limits
   const MAX_STRIKES = lowMemoryMode ? 100 : 500;
   const STRIKE_RETENTION_MS = lowMemoryMode ? 60000 : 300000; // 1 min vs 5 min
@@ -287,17 +286,17 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
     // Available Blitzortung WebSocket servers (tested and verified online)
     // ws3, ws4, ws5, ws6, ws9, ws10 have certificate issues as of 2026-02
     const servers = [
-      'wss://ws8.blitzortung.org',  // Primary (most reliable)
-      'wss://ws7.blitzortung.org',  // Backup 1
-      'wss://ws2.blitzortung.org',  // Backup 2
-      'wss://ws1.blitzortung.org'   // Backup 3
+      'wss://ws8.blitzortung.org', // Primary (most reliable)
+      'wss://ws7.blitzortung.org', // Backup 1
+      'wss://ws2.blitzortung.org', // Backup 2
+      'wss://ws1.blitzortung.org', // Backup 3
     ];
 
     const connectWebSocket = () => {
       try {
         const serverUrl = servers[currentServerIndexRef.current];
         console.log(`[Lightning] Connecting to ${serverUrl} (attempt ${connectionAttemptsRef.current + 1})...`);
-        
+
         const ws = new WebSocket(serverUrl);
         wsRef.current = ws;
 
@@ -312,7 +311,7 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
             // Decompress LZW-compressed data
             const decompressed = lzwDecode(event.data);
             const data = JSON.parse(decompressed);
-            
+
             // Parse lightning strike data
             // Format: { time: timestamp, lat: latitude, lon: longitude, alt: altitude, pol: polarity, mds: signal }
             if (data.time && data.lat && data.lon) {
@@ -325,16 +324,16 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
                 intensity: Math.abs(data.pol || 0),
                 polarity: (data.pol || 0) >= 0 ? 'positive' : 'negative',
                 altitude: data.alt || 0,
-                signal: data.mds || 0
+                signal: data.mds || 0,
               };
 
               // Add to buffer
               strikesBufferRef.current.push(strike);
-              
+
               // Keep only strikes within retention window
               const cutoffTime = Date.now() - STRIKE_RETENTION_MS;
               strikesBufferRef.current = strikesBufferRef.current
-                .filter(s => s.timestamp > cutoffTime)
+                .filter((s) => s.timestamp > cutoffTime)
                 .slice(-MAX_STRIKES); // Keep only most recent MAX_STRIKES
 
               // Update state every second to batch updates
@@ -353,7 +352,7 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
         ws.onerror = (error) => {
           console.error(`[Lightning] WebSocket error on ${servers[currentServerIndexRef.current]}:`, error);
           connectionAttemptsRef.current++;
-          
+
           // Try next server if this one fails
           if (connectionAttemptsRef.current >= 3) {
             console.log(`[Lightning] Failed to connect after 3 attempts, trying next server...`);
@@ -366,17 +365,17 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
           const serverUrl = servers[currentServerIndexRef.current];
           console.log(`[Lightning] WebSocket closed for ${serverUrl}`);
           wsRef.current = null;
-          
+
           // Increment connection attempts
           connectionAttemptsRef.current++;
-          
+
           // Try next server if too many failed attempts on current server
           if (connectionAttemptsRef.current >= 3) {
             console.log(`[Lightning] Too many failures on ${serverUrl}, rotating to next server...`);
             currentServerIndexRef.current = (currentServerIndexRef.current + 1) % servers.length;
             connectionAttemptsRef.current = 0;
           }
-          
+
           // Reconnect after 5 seconds if still enabled
           if (enabled) {
             console.log(`[Lightning] Reconnecting to ${servers[currentServerIndexRef.current]} in 5s...`);
@@ -386,14 +385,14 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
       } catch (err) {
         console.error(`[Lightning] Error connecting to ${servers[currentServerIndexRef.current]}:`, err);
         connectionAttemptsRef.current++;
-        
+
         // Try next server on connection error
         if (connectionAttemptsRef.current >= 3) {
           console.log(`[Lightning] Too many connection errors, trying next server...`);
           currentServerIndexRef.current = (currentServerIndexRef.current + 1) % servers.length;
           connectionAttemptsRef.current = 0;
         }
-        
+
         // Retry after 10 seconds
         if (enabled) {
           setTimeout(connectWebSocket, 10000);
@@ -421,7 +420,7 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
     if (!map || typeof L === 'undefined') return;
 
     // Clear old markers
-    strikeMarkers.forEach(marker => {
+    strikeMarkers.forEach((marker) => {
       try {
         map.removeLayer(marker);
       } catch (e) {
@@ -435,9 +434,9 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
     const newMarkers = [];
     const currentStrikeIds = new Set();
 
-    lightningData.forEach(strike => {
+    lightningData.forEach((strike) => {
       const { id, lat, lon, timestamp, age, intensity, polarity } = strike;
-      
+
       currentStrikeIds.add(id);
       const ageMinutes = age / 60;
 
@@ -447,7 +446,7 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
       // Calculate marker size based on intensity
       const baseRadius = 4;
       const intensityFactor = Math.min(intensity / 100, 2);
-      const radius = baseRadius + (intensityFactor * 3);
+      const radius = baseRadius + intensityFactor * 3;
 
       // Strike marker with pulsing animation for new strikes
       // Use divIcon with lightning bolt instead of circleMarker
@@ -466,7 +465,9 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
               transform: ${isNewStrike ? 'scale(1.2)' : 'scale(1)'};
               transition: all 0.3s ease;
             ">⚡</div>
-            ${isNewStrike ? `
+            ${
+              isNewStrike
+                ? `
               <div class="lightning-shockwave" style="
                 position: absolute;
                 top: 50%;
@@ -479,23 +480,23 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
                 opacity: 0;
                 animation: shockwave-expand 2s ease-out;
               "></div>
-            ` : ''}
+            `
+                : ''
+            }
           </div>
         `,
         className: '',
         iconSize: [24, 24],
-        iconAnchor: [12, 12]
+        iconAnchor: [12, 12],
       });
-      
-      const marker = L.marker([lat, lon], { 
+
+      const marker = L.marker([lat, lon], {
         icon: icon,
-        opacity: isNewStrike ? 1 : 0.6 * opacity
+        opacity: isNewStrike ? 1 : 0.6 * opacity,
       });
 
       // Popup with strike details
-      const ageStr = ageMinutes < 1 
-        ? `${Math.round(age)}s ago`
-        : `${Math.round(ageMinutes)}m ago`;
+      const ageStr = ageMinutes < 1 ? `${Math.round(age)}s ago` : `${Math.round(ageMinutes)}m ago`;
 
       marker.bindPopup(`
         <div style="font-family: 'JetBrains Mono', monospace; font-size: 12px;">
@@ -518,39 +519,39 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
   // Thunder front circles at high zoom (speed of sound visualization)
   useEffect(() => {
     if (!map || typeof L === 'undefined') return;
-    
+
     // Clear old thunder circles
-    thunderCircles.forEach(circle => {
+    thunderCircles.forEach((circle) => {
       try {
         map.removeLayer(circle);
       } catch (e) {}
     });
     setThunderCircles([]);
-    
+
     if (!enabled || !map) return;
-    
+
     const zoom = map.getZoom();
     if (zoom < 8) return; // Only show at high zoom levels
-    
+
     const now = Date.now();
     const newCircles = [];
-    
+
     // Only show thunder fronts for very recent strikes (last 2 minutes)
-    const recentStrikes = lightningData.filter(strike => {
+    const recentStrikes = lightningData.filter((strike) => {
       const ageSeconds = (now - strike.timestamp) / 1000;
       return ageSeconds < 120; // 2 minutes
     });
-    
-    recentStrikes.forEach(strike => {
+
+    recentStrikes.forEach((strike) => {
       const ageSeconds = (now - strike.timestamp) / 1000;
-      
+
       // Speed of sound: ~343 m/s = ~0.343 km/s
       // Calculate radius in meters based on age
       const radiusMeters = ageSeconds * 343;
-      
+
       // Fade out over time
-      const opacity = Math.max(0, 1 - (ageSeconds / 120));
-      
+      const opacity = Math.max(0, 1 - ageSeconds / 120);
+
       if (opacity > 0.05) {
         const circle = L.circle([strike.lat, strike.lon], {
           radius: radiusMeters,
@@ -558,14 +559,14 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
           fillColor: 'transparent',
           weight: 1,
           opacity: opacity * 0.3,
-          interactive: false
+          interactive: false,
         });
-        
+
         circle.addTo(map);
         newCircles.push(circle);
       }
     });
-    
+
     setThunderCircles(newCircles);
   }, [map, enabled, lightningData]);
 
@@ -634,7 +635,7 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
 
     const StatsControl = L.Control.extend({
       options: { position: 'topright' },
-      onAdd: function() {
+      onAdd: function () {
         console.log('[Lightning] StatsControl onAdd called');
         const div = L.DomUtil.create('div', 'lightning-stats');
         div.style.cssText = `
@@ -651,14 +652,14 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
           <div style="font-weight: bold; font-size: 14px; margin-bottom: 8px;">⚡ Lightning Activity</div>
           <div style="opacity: 0.7; font-size: 10px;">Connecting...</div>
         `;
-        
+
         // Prevent map interaction
         L.DomEvent.disableClickPropagation(div);
         L.DomEvent.disableScrollPropagation(div);
-        
+
         console.log('[Lightning] Stats panel div created');
         return div;
-      }
+      },
     });
 
     const control = new StatsControl();
@@ -686,7 +687,7 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
             console.error('[Lightning] Error applying saved position:', e);
           }
         }
-        
+
         makeDraggable(container, 'lightning-stats-position');
         addMinimizeToggle(container, 'lightning-stats-position');
         console.log('[Lightning] Stats panel is now draggable with minimize toggle');
@@ -719,19 +720,19 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
     }
 
     const now = Date.now();
-    const oneMinAgo = now - (60 * 1000);
-    const fiveMinAgo = now - (5 * 60 * 1000);
+    const oneMinAgo = now - 60 * 1000;
+    const fiveMinAgo = now - 5 * 60 * 1000;
 
-    const fresh = lightningData.filter(s => s.timestamp > oneMinAgo).length;
-    const recent = lightningData.filter(s => s.timestamp > fiveMinAgo && s.timestamp <= oneMinAgo).length;
+    const fresh = lightningData.filter((s) => s.timestamp > oneMinAgo).length;
+    const recent = lightningData.filter((s) => s.timestamp > fiveMinAgo && s.timestamp <= oneMinAgo).length;
     const total = lightningData.length;
 
     const avgIntensity = lightningData.reduce((sum, s) => sum + s.intensity, 0) / total;
-    const positiveStrikes = lightningData.filter(s => s.polarity === 'positive').length;
+    const positiveStrikes = lightningData.filter((s) => s.polarity === 'positive').length;
     const negativeStrikes = total - positiveStrikes;
-    
+
     console.log('[Lightning] Stats panel updated:', { fresh, recent, total });
-    
+
     const contentHTML = `
       <table style="width: 100%; font-size: 11px;">
         <tr><td>Fresh (&lt;1 min):</td><td style="text-align: right; color: var(--accent-amber);">${fresh}</td></tr>
@@ -746,7 +747,7 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
         Real-time via Blitzortung.org
       </div>
     `;
-    
+
     // Check if minimize toggle has been added (content is wrapped)
     const contentWrapper = div.querySelector('.lightning-panel-content');
     if (contentWrapper) {
@@ -756,18 +757,18 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
       // Initial render before minimize toggle is added
       const children = Array.from(div.children);
       // Remove all children except the header (first child)
-      children.slice(1).forEach(child => child.remove());
+      children.slice(1).forEach((child) => child.remove());
       // Add new content
       const tempDiv = document.createElement('div');
       tempDiv.innerHTML = contentHTML;
-      Array.from(tempDiv.children).forEach(child => div.appendChild(child));
+      Array.from(tempDiv.children).forEach((child) => div.appendChild(child));
     }
   }, [statsControl, enabled, lightningData]);
 
   // Proximity detection and alerts (30km radius)
   useEffect(() => {
     if (!enabled) return;
-    
+
     // Get config from localStorage
     let config;
     try {
@@ -777,24 +778,24 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
     } catch (e) {
       return;
     }
-    
+
     const stationLat = config.location?.lat || config.latitude;
     const stationLon = config.location?.lon || config.longitude;
-    
+
     if (!stationLat || !stationLon || lightningData.length === 0) return;
-    
+
     const ALERT_RADIUS_KM = 30;
     const now = Date.now();
     const ONE_MINUTE_AGO = now - 60000;
-    
+
     // Check for new strikes within 30km in the last minute
-    const nearbyNewStrikes = lightningData.filter(strike => {
+    const nearbyNewStrikes = lightningData.filter((strike) => {
       if (strike.timestamp < ONE_MINUTE_AGO) return false;
-      
+
       const distance = calculateDistance(stationLat, stationLon, strike.lat, strike.lon, 'km');
       return distance <= ALERT_RADIUS_KM;
     });
-    
+
     // Flash the stats panel red if there are nearby strikes
     const panel = document.querySelector('.lightning-stats');
     if (panel) {
@@ -803,10 +804,12 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
         panel.style.border = '2px solid #ff0000';
         panel.style.boxShadow = '0 0 20px rgba(255, 0, 0, 0.8)';
         panel.style.transition = 'all 0.3s ease';
-        
+
         // Play alert sound if available
         try {
-          const audio = new Audio('data:audio/wav;base64,UklGRnoGAABXQVZFZm10IBAAAAABAAEAQB8AAEAfAAABAAgAZGF0YQoGAACBhYqFbF1fdJivrJBhNjVgodDbq2EcBj+a2/LDciUFLIHO8tiJNwgZaLvt559NEAxQp+PwtmMcBjiR1/LMeSwFJHfH8N2QQAoUXrTp66hVFApGn+DyvmwhBTGH0fPTgjMGHm7A7+OZRAEKT6Ln77BcGAU+ltryxnMnBSp+y/HajDkHGWi77eWdTQ0MUKfj8LZjHAY4kdfy');
+          const audio = new Audio(
+            'data:audio/wav;base64,UklGRnoGAABXQVZFZm10IBAAAAABAAEAQB8AAEAfAAABAAgAZGF0YQoGAACBhYqFbF1fdJivrJBhNjVgodDbq2EcBj+a2/LDciUFLIHO8tiJNwgZaLvt559NEAxQp+PwtmMcBjiR1/LMeSwFJHfH8N2QQAoUXrTp66hVFApGn+DyvmwhBTGH0fPTgjMGHm7A7+OZRAEKT6Ln77BcGAU+ltryxnMnBSp+y/HajDkHGWi77eWdTQ0MUKfj8LZjHAY4kdfy',
+          );
           audio.volume = 0.3;
           audio.play().catch(() => {}); // Ignore errors if audio fails
         } catch (e) {}
@@ -820,8 +823,15 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
 
   // Create proximity panel control (30km radius)
   useEffect(() => {
-    console.log('[Lightning] Proximity effect triggered - enabled:', enabled, 'map:', !!map, 'proximityControl:', !!proximityControlRef.current);
-    
+    console.log(
+      '[Lightning] Proximity effect triggered - enabled:',
+      enabled,
+      'map:',
+      !!map,
+      'proximityControl:',
+      !!proximityControlRef.current,
+    );
+
     if (!map || typeof L === 'undefined') {
       console.log('[Lightning] Proximity: No map or Leaflet');
       return;
@@ -834,9 +844,9 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
       console.log('[Lightning] Proximity: Already exists, skipping');
       return; // Already created
     }
-    
+
     console.log('[Lightning] Proximity: Getting station config from localStorage...');
-    
+
     // Get config from localStorage directly (more reliable than window.hamclockConfig)
     let config;
     try {
@@ -848,7 +858,7 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
         console.log('[Lightning] Proximity: No config in localStorage, setting retry timer');
         const retryTimer = setTimeout(() => {
           console.log('[Lightning] Proximity: Retry timer fired, triggering re-render');
-          setLightningData(prev => [...prev]); // Trigger re-render
+          setLightningData((prev) => [...prev]); // Trigger re-render
         }, 2000);
         return () => clearTimeout(retryTimer);
       }
@@ -856,12 +866,12 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
       console.error('[Lightning] Proximity: Error reading config:', e);
       return;
     }
-    
+
     const stationLat = config.location?.lat || config.latitude;
     const stationLon = config.location?.lon || config.longitude;
-    
+
     console.log('[Lightning] Proximity: Station location:', { stationLat, stationLon });
-    
+
     if (!stationLat || !stationLon) {
       console.log('[Lightning] Proximity: No station location - aborting');
       return;
@@ -871,7 +881,7 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
 
     const ProximityControl = L.Control.extend({
       options: { position: 'bottomright' },
-      onAdd: function() {
+      onAdd: function () {
         const div = L.DomUtil.create('div', 'lightning-proximity');
         div.style.cssText = `
           background: var(--bg-panel);
@@ -888,13 +898,13 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
           <div style="font-weight: bold; font-size: 14px; margin-bottom: 8px;">📍 Nearby Strikes (30km)</div>
           <div style="opacity: 0.7; font-size: 10px;">No recent strikes</div>
         `;
-        
+
         // Prevent map interaction
         L.DomEvent.disableClickPropagation(div);
         L.DomEvent.disableScrollPropagation(div);
-        
+
         return div;
-      }
+      },
     });
 
     const control = new ProximityControl();
@@ -907,12 +917,14 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
     const maxRetries = 20; // Try for up to 2 seconds
     const retryInterval = setInterval(() => {
       retries++;
-      console.log(`[Lightning] Proximity: Looking for .lightning-proximity container... (attempt ${retries}/${maxRetries})`);
+      console.log(
+        `[Lightning] Proximity: Looking for .lightning-proximity container... (attempt ${retries}/${maxRetries})`,
+      );
       const container = document.querySelector('.lightning-proximity');
       if (container) {
         clearInterval(retryInterval);
         console.log('[Lightning] Proximity: Container found! Making draggable...');
-        
+
         // Default to CENTER of screen (not corner!)
         container.style.position = 'fixed';
         container.style.top = '50%';
@@ -921,16 +933,16 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
         container.style.right = 'auto';
         container.style.bottom = 'auto';
         container.style.zIndex = '1001'; // Ensure it's on top
-        
+
         console.log('[Lightning] Proximity: Panel positioned at center of screen');
-        
+
         // Try to load saved position (but validate it's on-screen)
         const saved = localStorage.getItem('lightning-proximity-position');
         let positionLoaded = false;
         if (saved) {
           try {
             const data = JSON.parse(saved);
-            
+
             // Check if saved as percentage (new format) or pixels (old format)
             if (data.topPercent !== undefined && data.leftPercent !== undefined) {
               // Use percentage-based positioning (scales with zoom)
@@ -938,14 +950,18 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
               container.style.left = data.leftPercent + '%';
               container.style.transform = 'none';
               positionLoaded = true;
-              console.log('[Lightning] Proximity: Applied saved position (percentage):', { 
-                topPercent: data.topPercent, 
-                leftPercent: data.leftPercent 
+              console.log('[Lightning] Proximity: Applied saved position (percentage):', {
+                topPercent: data.topPercent,
+                leftPercent: data.leftPercent,
               });
             } else if (data.top !== undefined && data.left !== undefined) {
               // Legacy pixel format - validate and convert to percentage
-              if (data.top >= 0 && data.top < window.innerHeight - 100 && 
-                  data.left >= 0 && data.left < window.innerWidth - 200) {
+              if (
+                data.top >= 0 &&
+                data.top < window.innerHeight - 100 &&
+                data.left >= 0 &&
+                data.left < window.innerWidth - 200
+              ) {
                 const topPercent = (data.top / window.innerHeight) * 100;
                 const leftPercent = (data.left / window.innerWidth) * 100;
                 container.style.top = topPercent + '%';
@@ -962,12 +978,12 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
             console.error('[Lightning] Proximity: Error applying saved position:', e);
           }
         }
-        
+
         // Make draggable - pass flag to skip position loading since we already did it
         makeDraggable(container, 'lightning-proximity-position', positionLoaded);
         addMinimizeToggle(container, 'lightning-proximity-position');
         console.log('[Lightning] Proximity: Panel is now draggable and minimizable');
-        
+
         // IMPORTANT: Set ref AFTER setup is complete
         proximityControlRef.current = control;
         console.log('[Lightning] Proximity: Ref updated with control');
@@ -1007,10 +1023,10 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
     } catch (e) {
       return;
     }
-    
+
     const stationLat = config.location?.lat || config.latitude;
     const stationLon = config.location?.lon || config.longitude;
-    
+
     if (!stationLat || !stationLon) return;
 
     const PROXIMITY_RADIUS_KM = 30;
@@ -1018,15 +1034,15 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
 
     // Find all strikes within 30km
     const nearbyStrikes = lightningData
-      .map(strike => {
+      .map((strike) => {
         const distance = calculateDistance(stationLat, stationLon, strike.lat, strike.lon, 'km');
         return { ...strike, distance };
       })
-      .filter(strike => strike.distance <= PROXIMITY_RADIUS_KM)
+      .filter((strike) => strike.distance <= PROXIMITY_RADIUS_KM)
       .sort((a, b) => a.distance - b.distance); // Sort by distance (closest first)
 
     let contentHTML = '';
-    
+
     if (nearbyStrikes.length === 0) {
       contentHTML = `
         <div style="opacity: 0.7; font-size: 10px; text-align: center; padding: 10px 0;">
@@ -1039,7 +1055,7 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
       const ageMinutes = Math.floor((now - closestStrike.timestamp) / 60000);
       const ageSeconds = Math.floor((now - closestStrike.timestamp) / 1000);
       const ageStr = ageMinutes > 0 ? `${ageMinutes}m ago` : `${ageSeconds}s ago`;
-      
+
       contentHTML = `
         <div style="margin-bottom: 8px; padding: 8px; background: rgba(255,0,0,0.1); border-left: 3px solid var(--accent-red); border-radius: 4px;">
           <div style="font-weight: bold; color: var(--accent-red); margin-bottom: 4px;">
@@ -1054,30 +1070,33 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null, lowMemory
         <div style="font-size: 9px; color: var(--text-muted); border-top: 1px solid var(--border-color); padding-top: 6px; margin-top: 6px;">
           <strong>All Nearby Strikes:</strong><br>
           <div style="max-height: 150px; overflow-y: auto; margin-top: 4px;">
-            ${nearbyStrikes.slice(0, 10).map((strike, idx) => {
-              const age = Math.floor((now - strike.timestamp) / 1000);
-              const timeStr = age < 60 ? `${age}s` : `${Math.floor(age / 60)}m`;
-              return `
+            ${nearbyStrikes
+              .slice(0, 10)
+              .map((strike, idx) => {
+                const age = Math.floor((now - strike.timestamp) / 1000);
+                const timeStr = age < 60 ? `${age}s` : `${Math.floor(age / 60)}m`;
+                return `
                 <div style="padding: 2px 0; border-bottom: 1px dotted var(--border-color);">
                   ${idx + 1}. ${strike.distance.toFixed(1)} km • ${timeStr} • ${strike.polarity === 'positive' ? '+' : '-'}${Math.round(strike.intensity)} kA
                 </div>
               `;
-            }).join('')}
+              })
+              .join('')}
             ${nearbyStrikes.length > 10 ? `<div style="padding: 4px 0; opacity: 0.6;">+${nearbyStrikes.length - 10} more...</div>` : ''}
           </div>
         </div>
       `;
     }
-    
+
     const contentWrapper = div.querySelector('.lightning-panel-content');
     if (contentWrapper) {
       contentWrapper.innerHTML = contentHTML;
     } else {
       const children = Array.from(div.children);
-      children.slice(1).forEach(child => child.remove());
+      children.slice(1).forEach((child) => child.remove());
       const tempDiv = document.createElement('div');
       tempDiv.innerHTML = contentHTML;
-      Array.from(tempDiv.children).forEach(child => div.appendChild(child));
+      Array.from(tempDiv.children).forEach((child) => div.appendChild(child));
     }
   }, [enabled, lightningData]); // No proximityControl dependency - using ref
 
diff --git a/src/plugins/layers/useMUFMap.js b/src/plugins/layers/useMUFMap.js
index 55aa3142..1236eeb5 100644
--- a/src/plugins/layers/useMUFMap.js
+++ b/src/plugins/layers/useMUFMap.js
@@ -2,12 +2,12 @@ import { useState, useEffect, useRef } from 'react';
 
 /**
  * MUF (Maximum Usable Frequency) Map Layer v1.0.0
- * 
+ *
  * Renders a real-time MUF heatmap across the world using ionosonde station
  * data from the KC2G/GIRO network. Station MUF(3000) readings are spatially
  * interpolated using Inverse Distance Weighting to produce a smooth
  * color-coded overlay showing current HF propagation conditions.
- * 
+ *
  * Color scale:
  *   ≤3 MHz  — dark purple  (no usable HF)
  *   5 MHz   — blue         (80m only)
@@ -16,7 +16,7 @@ import { useState, useEffect, useRef } from 'react';
  *   21 MHz  — yellow       (15m open)
  *   28 MHz  — orange       (10m open)
  *   ≥35 MHz — red/magenta  (6m / sporadic-E)
- * 
+ *
  * Data source: /api/ionosonde (server-proxied from prop.kc2g.com)
  * Update interval: 10 minutes
  */
@@ -29,7 +29,7 @@ export const metadata = {
   category: 'propagation',
   defaultEnabled: false,
   defaultOpacity: 0.4,
-  version: '1.0.0'
+  version: '1.0.0',
 };
 
 // ── Color scale: MUF frequency → RGBA ──────────────────────────────
@@ -45,39 +45,39 @@ function mufColor(mhz) {
   if (f < 5) {
     // 2–5 MHz: dark purple → blue
     const t = (f - 2) / 3;
-    r = Math.round(60 + t * (-10));   // 60 → 50
-    g = Math.round(0 + t * 40);       // 0 → 40
-    b = Math.round(120 + t * 95);     // 120 → 215
+    r = Math.round(60 + t * -10); // 60 → 50
+    g = Math.round(0 + t * 40); // 0 → 40
+    b = Math.round(120 + t * 95); // 120 → 215
   } else if (f < 10) {
     // 5–10 MHz: blue → cyan
     const t = (f - 5) / 5;
-    r = Math.round(50 * (1 - t));     // 50 → 0
-    g = Math.round(40 + t * 200);     // 40 → 240
-    b = Math.round(215 + t * 25);     // 215 → 240
+    r = Math.round(50 * (1 - t)); // 50 → 0
+    g = Math.round(40 + t * 200); // 40 → 240
+    b = Math.round(215 + t * 25); // 215 → 240
   } else if (f < 15) {
     // 10–15 MHz: cyan → green
     const t = (f - 10) / 5;
-    r = Math.round(0 + t * 30);       // 0 → 30
-    g = Math.round(240 - t * 20);     // 240 → 220
-    b = Math.round(240 * (1 - t));    // 240 → 0
+    r = Math.round(0 + t * 30); // 0 → 30
+    g = Math.round(240 - t * 20); // 240 → 220
+    b = Math.round(240 * (1 - t)); // 240 → 0
   } else if (f < 21) {
     // 15–21 MHz: green → yellow
     const t = (f - 15) / 6;
-    r = Math.round(30 + t * 225);     // 30 → 255
-    g = Math.round(220 + t * 35);     // 220 → 255
+    r = Math.round(30 + t * 225); // 30 → 255
+    g = Math.round(220 + t * 35); // 220 → 255
     b = 0;
   } else if (f < 28) {
     // 21–28 MHz: yellow → orange
     const t = (f - 21) / 7;
     r = 255;
-    g = Math.round(255 - t * 140);    // 255 → 115
+    g = Math.round(255 - t * 140); // 255 → 115
     b = 0;
   } else {
     // 28–40 MHz: orange → red-magenta
     const t = Math.min((f - 28) / 12, 1);
     r = 255;
-    g = Math.round(115 - t * 115);    // 115 → 0
-    b = Math.round(t * 80);           // 0 → 80
+    g = Math.round(115 - t * 115); // 115 → 0
+    b = Math.round(t * 80); // 0 → 80
   }
 
   return { r, g, b };
@@ -108,21 +108,21 @@ function haversine(lat1, lon1, lat2, lon2) {
   const R = 6371;
   const dLat = (lat2 - lat1) * 0.017453293;
   const dLon = (lon2 - lon1) * 0.017453293;
-  const a = Math.sin(dLat / 2) * Math.sin(dLat / 2) +
-            Math.cos(lat1 * 0.017453293) * Math.cos(lat2 * 0.017453293) *
-            Math.sin(dLon / 2) * Math.sin(dLon / 2);
+  const a =
+    Math.sin(dLat / 2) * Math.sin(dLat / 2) +
+    Math.cos(lat1 * 0.017453293) * Math.cos(lat2 * 0.017453293) * Math.sin(dLon / 2) * Math.sin(dLon / 2);
   return R * 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a));
 }
 
 // ── Build canvas overlay from station data ─────────────────────────
 // Creates equirectangular projection image -180..180 lon, -90..90 lat
-const GRID_W = 360;  // 1° per pixel longitude
-const GRID_H = 181;  // 1° per pixel latitude
+const GRID_W = 360; // 1° per pixel longitude
+const GRID_H = 181; // 1° per pixel latitude
 const CANVAS_SCALE = 2; // 2x upscale for smooth rendering
 
 function buildMUFCanvas(stations) {
   // Pre-filter valid stations
-  const valid = stations.filter(s => s.mufd > 0 && s.lat != null && s.lon != null);
+  const valid = stations.filter((s) => s.mufd > 0 && s.lat != null && s.lon != null);
   if (valid.length < 3) return null;
 
   const canvas = document.createElement('canvas');
@@ -149,7 +149,7 @@ function buildMUFCanvas(stations) {
       if (!color) continue;
 
       const idx = (y * GRID_W + x) * 4;
-      pixels[idx]     = color.r;
+      pixels[idx] = color.r;
       pixels[idx + 1] = color.g;
       pixels[idx + 2] = color.b;
       pixels[idx + 3] = 180; // Base alpha (opacity handled by Leaflet)
@@ -182,8 +182,8 @@ function makeDraggable(el, storageKey) {
         el.style.top = d.topPercent + '%';
         el.style.left = d.leftPercent + '%';
       } else {
-        el.style.top = ((d.top / window.innerHeight) * 100) + '%';
-        el.style.left = ((d.left / window.innerWidth) * 100) + '%';
+        el.style.top = (d.top / window.innerHeight) * 100 + '%';
+        el.style.left = (d.left / window.innerWidth) * 100 + '%';
       }
       el.style.right = 'auto';
       el.style.bottom = 'auto';
@@ -198,28 +198,46 @@ function makeDraggable(el, storageKey) {
     el.style.bottom = 'auto';
   }
   el.title = 'Hold CTRL and drag to reposition';
-  let dragging = false, sx, sy, sl, st;
-  el.addEventListener('mouseenter', e => { el.style.cursor = e.ctrlKey ? 'grab' : 'default'; });
-  el.addEventListener('mousemove', e => { el.style.cursor = e.ctrlKey ? 'grab' : 'default'; });
-  el.addEventListener('mousedown', e => {
+  let dragging = false,
+    sx,
+    sy,
+    sl,
+    st;
+  el.addEventListener('mouseenter', (e) => {
+    el.style.cursor = e.ctrlKey ? 'grab' : 'default';
+  });
+  el.addEventListener('mousemove', (e) => {
+    el.style.cursor = e.ctrlKey ? 'grab' : 'default';
+  });
+  el.addEventListener('mousedown', (e) => {
     if (!e.ctrlKey) return;
-    dragging = true; sx = e.clientX; sy = e.clientY;
-    sl = parseInt(el.style.left) || 0; st = parseInt(el.style.top) || 0;
-    el.style.cursor = 'grabbing'; e.preventDefault(); e.stopPropagation();
+    dragging = true;
+    sx = e.clientX;
+    sy = e.clientY;
+    sl = parseInt(el.style.left) || 0;
+    st = parseInt(el.style.top) || 0;
+    el.style.cursor = 'grabbing';
+    e.preventDefault();
+    e.stopPropagation();
   });
-  document.addEventListener('mousemove', e => {
+  document.addEventListener('mousemove', (e) => {
     if (!dragging) return;
-    el.style.left = (sl + e.clientX - sx) + 'px';
-    el.style.top = (st + e.clientY - sy) + 'px';
+    el.style.left = sl + e.clientX - sx + 'px';
+    el.style.top = st + e.clientY - sy + 'px';
   });
   document.addEventListener('mouseup', () => {
     if (!dragging) return;
-    dragging = false; el.style.cursor = 'default';
-    localStorage.setItem(storageKey, JSON.stringify({
-      topPercent: (el.offsetTop / window.innerHeight) * 100,
-      leftPercent: (el.offsetLeft / window.innerWidth) * 100,
-      top: el.offsetTop, left: el.offsetLeft
-    }));
+    dragging = false;
+    el.style.cursor = 'default';
+    localStorage.setItem(
+      storageKey,
+      JSON.stringify({
+        topPercent: (el.offsetTop / window.innerHeight) * 100,
+        leftPercent: (el.offsetLeft / window.innerWidth) * 100,
+        top: el.offsetTop,
+        left: el.offsetLeft,
+      }),
+    );
   });
 }
 
@@ -232,7 +250,7 @@ function addMinimizeToggle(container, storageKey) {
     content.style.display = 'none';
     btn.textContent = '▶';
   }
-  btn.addEventListener('click', e => {
+  btn.addEventListener('click', (e) => {
     e.stopPropagation();
     const hidden = content.style.display === 'none';
     content.style.display = hidden ? 'block' : 'none';
@@ -246,7 +264,7 @@ export function useLayer({ map, enabled, opacity }) {
   const [stations, setStations] = useState(null);
   const [loading, setLoading] = useState(false);
   const [fetchTime, setFetchTime] = useState(null);
-  const overlaysRef = useRef([]);      // Array of L.imageOverlay (3 world copies)
+  const overlaysRef = useRef([]); // Array of L.imageOverlay (3 world copies)
   const controlRef = useRef(null);
   const fetchingRef = useRef(false);
   const intervalRef = useRef(null);
@@ -261,7 +279,11 @@ export function useLayer({ map, enabled, opacity }) {
       setLoading(true);
       try {
         const res = await fetch('/api/ionosonde');
-        if (res.status === 429) { fetchingRef.current = false; setLoading(false); return; }
+        if (res.status === 429) {
+          fetchingRef.current = false;
+          setLoading(false);
+          return;
+        }
         if (!res.ok) throw new Error(`HTTP ${res.status}`);
         const json = await res.json();
         if (json.stations?.length > 0) {
@@ -278,7 +300,9 @@ export function useLayer({ map, enabled, opacity }) {
 
     fetchData();
     intervalRef.current = setInterval(fetchData, 10 * 60 * 1000); // 10 min
-    return () => { if (intervalRef.current) clearInterval(intervalRef.current); };
+    return () => {
+      if (intervalRef.current) clearInterval(intervalRef.current);
+    };
   }, [enabled]);
 
   // ── Render overlay on map ─────────────────────────────────────
@@ -286,7 +310,11 @@ export function useLayer({ map, enabled, opacity }) {
     if (!map || typeof L === 'undefined') return;
 
     // Clear previous overlays
-    overlaysRef.current.forEach(ov => { try { map.removeLayer(ov); } catch (e) {} });
+    overlaysRef.current.forEach((ov) => {
+      try {
+        map.removeLayer(ov);
+      } catch (e) {}
+    });
     overlaysRef.current = [];
 
     if (!enabled || !stations || stations.length < 3) return;
@@ -300,13 +328,16 @@ export function useLayer({ map, enabled, opacity }) {
       for (const lonOffset of [-360, 0, 360]) {
         const overlay = L.imageOverlay(
           dataUrl,
-          [[-90, -180 + lonOffset], [90, 180 + lonOffset]],
+          [
+            [-90, -180 + lonOffset],
+            [90, 180 + lonOffset],
+          ],
           {
             opacity: opacity,
             zIndex: 200,
             interactive: false,
-            className: 'muf-map-overlay'
-          }
+            className: 'muf-map-overlay',
+          },
         );
         overlay.addTo(map);
         newOverlays.push(overlay);
@@ -317,14 +348,20 @@ export function useLayer({ map, enabled, opacity }) {
     }
 
     return () => {
-      overlaysRef.current.forEach(ov => { try { map.removeLayer(ov); } catch (e) {} });
+      overlaysRef.current.forEach((ov) => {
+        try {
+          map.removeLayer(ov);
+        } catch (e) {}
+      });
     };
   }, [enabled, stations, map]);
 
   // ── Update opacity ────────────────────────────────────────────
   useEffect(() => {
-    overlaysRef.current.forEach(ov => {
-      try { ov.setOpacity(opacity); } catch (e) {}
+    overlaysRef.current.forEach((ov) => {
+      try {
+        ov.setOpacity(opacity);
+      } catch (e) {}
     });
   }, [opacity]);
 
@@ -333,7 +370,9 @@ export function useLayer({ map, enabled, opacity }) {
     if (!map || typeof L === 'undefined') return;
 
     if (controlRef.current) {
-      try { map.removeControl(controlRef.current); } catch (e) {}
+      try {
+        map.removeControl(controlRef.current);
+      } catch (e) {}
       controlRef.current = null;
     }
 
@@ -397,7 +436,7 @@ export function useLayer({ map, enabled, opacity }) {
           </div>
         `;
         return container;
-      }
+      },
     });
 
     controlRef.current = new MUFControl();
@@ -409,7 +448,6 @@ export function useLayer({ map, enabled, opacity }) {
       makeDraggable(container, 'muf-map-position');
       addMinimizeToggle(container, 'muf-map-position');
     }, 150);
-
   }, [enabled, map, stations, loading]);
 
   // ── Update status text ────────────────────────────────────────
@@ -427,10 +465,16 @@ export function useLayer({ map, enabled, opacity }) {
   useEffect(() => {
     if (!enabled && map) {
       if (controlRef.current) {
-        try { map.removeControl(controlRef.current); } catch (e) {}
+        try {
+          map.removeControl(controlRef.current);
+        } catch (e) {}
         controlRef.current = null;
       }
-      overlaysRef.current.forEach(ov => { try { map.removeLayer(ov); } catch (e) {} });
+      overlaysRef.current.forEach((ov) => {
+        try {
+          map.removeLayer(ov);
+        } catch (e) {}
+      });
       overlaysRef.current = [];
     }
   }, [enabled, map]);
diff --git a/src/plugins/layers/useN3FJPLoggedQSOs.js b/src/plugins/layers/useN3FJPLoggedQSOs.js
index 33300f7a..78157fcf 100644
--- a/src/plugins/layers/useN3FJPLoggedQSOs.js
+++ b/src/plugins/layers/useN3FJPLoggedQSOs.js
@@ -9,19 +9,19 @@ export const metadata = {
   localOnly: true,
   defaultEnabled: false,
   defaultOpacity: 0.9,
-  version: '0.2.0'
+  version: '0.2.0',
 };
 
 const POLL_MS = 2000;
 
-  // --- User settings (persisted) ---
+// --- User settings (persisted) ---
 const STORAGE_MINUTES_KEY = 'n3fjp_display_minutes';
 const STORAGE_COLOR_KEY = 'n3fjp_line_color';
 
 // Make control draggable with CTRL+drag
 function makeDraggable(element, storageKey, skipPositionLoad = false) {
   if (!element) return;
-  
+
   // Load saved position only if not already loaded
   if (!skipPositionLoad) {
     const saved = localStorage.getItem(storageKey);
@@ -29,7 +29,7 @@ function makeDraggable(element, storageKey, skipPositionLoad = false) {
       try {
         const data = JSON.parse(saved);
         element.style.position = 'fixed';
-        
+
         // Check if saved as percentage (new format) or pixels (old format)
         if (data.topPercent !== undefined && data.leftPercent !== undefined) {
           // Use percentage-based positioning (scales with zoom)
@@ -42,7 +42,7 @@ function makeDraggable(element, storageKey, skipPositionLoad = false) {
           element.style.top = topPercent + '%';
           element.style.left = leftPercent + '%';
         }
-        
+
         element.style.right = 'auto';
         element.style.bottom = 'auto';
         element.style.transform = 'none';
@@ -57,12 +57,12 @@ function makeDraggable(element, storageKey, skipPositionLoad = false) {
       element.style.bottom = 'auto';
     }
   }
-  
+
   element.title = 'Hold CTRL and drag to reposition';
-  
+
   let isDragging = false;
   let startX, startY, startLeft, startTop;
-  
+
   const updateCursor = (e) => {
     if (e.ctrlKey) {
       element.style.cursor = 'grab';
@@ -70,7 +70,7 @@ function makeDraggable(element, storageKey, skipPositionLoad = false) {
       element.style.cursor = 'default';
     }
   };
-  
+
   element.addEventListener('mouseenter', updateCursor);
   element.addEventListener('mousemove', updateCursor);
   document.addEventListener('keydown', (e) => {
@@ -79,50 +79,50 @@ function makeDraggable(element, storageKey, skipPositionLoad = false) {
   document.addEventListener('keyup', (e) => {
     if (e.key === 'Control') updateCursor(e);
   });
-  
-  element.addEventListener('mousedown', function(e) {
+
+  element.addEventListener('mousedown', function (e) {
     if (!e.ctrlKey) return;
     if (e.target.tagName === 'SELECT' || e.target.tagName === 'INPUT' || e.target.tagName === 'LABEL') {
       return;
     }
-    
+
     isDragging = true;
     startX = e.clientX;
     startY = e.clientY;
     startLeft = element.offsetLeft;
     startTop = element.offsetTop;
-    
+
     element.style.cursor = 'grabbing';
     element.style.opacity = '0.8';
     e.preventDefault();
   });
-  
-  document.addEventListener('mousemove', function(e) {
+
+  document.addEventListener('mousemove', function (e) {
     if (!isDragging) return;
-    
+
     const dx = e.clientX - startX;
     const dy = e.clientY - startY;
-    
-    element.style.left = (startLeft + dx) + 'px';
-    element.style.top = (startTop + dy) + 'px';
+
+    element.style.left = startLeft + dx + 'px';
+    element.style.top = startTop + dy + 'px';
   });
-  
-  document.addEventListener('mouseup', function(e) {
+
+  document.addEventListener('mouseup', function (e) {
     if (isDragging) {
       isDragging = false;
       element.style.opacity = '1';
       updateCursor(e);
-      
+
       // Save position as percentage of viewport for zoom compatibility
       const topPercent = (element.offsetTop / window.innerHeight) * 100;
       const leftPercent = (element.offsetLeft / window.innerWidth) * 100;
-      
+
       const position = {
         topPercent,
         leftPercent,
         // Keep pixel values for backward compatibility
         top: element.offsetTop,
-        left: element.offsetLeft
+        left: element.offsetLeft,
       };
       localStorage.setItem(storageKey, JSON.stringify(position));
     }
@@ -132,18 +132,18 @@ function makeDraggable(element, storageKey, skipPositionLoad = false) {
 // Add minimize/maximize toggle
 function addMinimizeToggle(element, storageKey) {
   if (!element) return;
-  
+
   const minimizeKey = storageKey + '-minimized';
   const header = element.firstElementChild;
   if (!header) return;
-  
+
   // Wrap content
   const content = Array.from(element.children).slice(1);
   const contentWrapper = document.createElement('div');
   contentWrapper.className = 'n3fjp-panel-content';
-  content.forEach(child => contentWrapper.appendChild(child));
+  content.forEach((child) => contentWrapper.appendChild(child));
   element.appendChild(contentWrapper);
-  
+
   // Add minimize button
   const minimizeBtn = document.createElement('span');
   minimizeBtn.className = 'n3fjp-minimize-btn';
@@ -159,19 +159,19 @@ function addMinimizeToggle(element, storageKey) {
     transition: opacity 0.2s;
   `;
   minimizeBtn.title = 'Minimize/Maximize';
-  
+
   minimizeBtn.addEventListener('mouseenter', () => {
     minimizeBtn.style.opacity = '1';
   });
   minimizeBtn.addEventListener('mouseleave', () => {
     minimizeBtn.style.opacity = '0.7';
   });
-  
+
   header.style.display = 'flex';
   header.style.justifyContent = 'space-between';
   header.style.alignItems = 'center';
   header.appendChild(minimizeBtn);
-  
+
   // Load saved state
   const isMinimized = localStorage.getItem(minimizeKey) === 'true';
   if (isMinimized) {
@@ -179,13 +179,13 @@ function addMinimizeToggle(element, storageKey) {
     minimizeBtn.innerHTML = '▶';
     element.style.cursor = 'pointer';
   }
-  
+
   // Toggle function
   const toggle = (e) => {
     if (e && e.ctrlKey) return;
-    
+
     const isCurrentlyMinimized = contentWrapper.style.display === 'none';
-    
+
     if (isCurrentlyMinimized) {
       contentWrapper.style.display = 'block';
       minimizeBtn.innerHTML = '▼';
@@ -198,7 +198,7 @@ function addMinimizeToggle(element, storageKey) {
       localStorage.setItem(minimizeKey, 'true');
     }
   };
-  
+
   minimizeBtn.addEventListener('click', toggle);
   header.addEventListener('click', (e) => {
     if (e.target !== minimizeBtn) toggle(e);
@@ -275,23 +275,23 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null }) {
   useEffect(() => {
     if (!map || typeof L === 'undefined') return;
 
-	// --- Preserve open popup across redraws ---
-	// Use our own ref as the source of truth (map._popup can be fickle during redraws)
-	const openDxCall = (!suppressReopenRef.current && lastOpenDxCallRef.current)
-	  ? lastOpenDxCallRef.current
-	  : null;
-	
-	// Remove old layers
-	layersRef.forEach(layer => {
-	  try { map.removeLayer(layer); } catch {}
-	});
-	setLayersRef([]);
+    // --- Preserve open popup across redraws ---
+    // Use our own ref as the source of truth (map._popup can be fickle during redraws)
+    const openDxCall = !suppressReopenRef.current && lastOpenDxCallRef.current ? lastOpenDxCallRef.current : null;
+
+    // Remove old layers
+    layersRef.forEach((layer) => {
+      try {
+        map.removeLayer(layer);
+      } catch {}
+    });
+    setLayersRef([]);
 
-	if (!enabled || !qsos.length) return;
+    if (!enabled || !qsos.length) return;
 
     // ---- CLIENT-SIDE FILTER: Show only QSOs newer than X minutes ----
-    const cutoff = Date.now() - (displayMinutes * 60 * 1000);
-    const recent = qsos.filter(q => {
+    const cutoff = Date.now() - displayMinutes * 60 * 1000;
+    const recent = qsos.filter((q) => {
       const t = Date.parse(q.ts_utc || q.ts || '');
       return !Number.isNaN(t) && t >= cutoff;
     });
@@ -343,7 +343,7 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null }) {
     }
 
     // Plot each QSO using qso.lat/qso.lon
-    recent.forEach(q => {
+    recent.forEach((q) => {
       const lat = q.lat;
       const lon = q.lon;
       if (typeof lat !== 'number' || typeof lon !== 'number') return;
@@ -365,23 +365,23 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null }) {
 
       // Tag marker so we can re-open its popup after a redraw
       dxMarker.__dxCall = dxCall;
-       // User intent: keep THIS call's popup open across redraws
-		dxMarker.on("click", () => {
-		  lastOpenDxCallRef.current = dxCall;
-		  suppressReopenRef.current = false;
-		});
-
-    dxMarker.on("popupclose", () => {
-	  // If the marker was removed from the map (our redraw does this every POLL_MS),
-	  // Leaflet will close the popup. That's NOT a user close.
-	  if (!map || !map.hasLayer(dxMarker)) return;
-
-	  // This is a real user close (clicked X or clicked map/another marker)
-	  if (lastOpenDxCallRef.current === dxCall) {
-		suppressReopenRef.current = true;
-		lastOpenDxCallRef.current = null;
-	  }
-	});
+      // User intent: keep THIS call's popup open across redraws
+      dxMarker.on('click', () => {
+        lastOpenDxCallRef.current = dxCall;
+        suppressReopenRef.current = false;
+      });
+
+      dxMarker.on('popupclose', () => {
+        // If the marker was removed from the map (our redraw does this every POLL_MS),
+        // Leaflet will close the popup. That's NOT a user close.
+        if (!map || !map.hasLayer(dxMarker)) return;
+
+        // This is a real user close (clicked X or clicked map/another marker)
+        if (lastOpenDxCallRef.current === dxCall) {
+          suppressReopenRef.current = true;
+          lastOpenDxCallRef.current = null;
+        }
+      });
 
       dxMarker.bindPopup(
         `<div style="font-family: JetBrains Mono, monospace;">
@@ -393,7 +393,7 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null }) {
           ${q.loc_source ? `Loc: ${q.loc_source}<br/>` : ''}
           ${q.dx_grid ? `Grid: ${q.dx_grid}<br/>` : ''}
           <span style="opacity:0.7;">Retention: ${retentionMinutes} min</span>
-        </div>`
+        </div>`,
       );
 
       newLayers.push(dxMarker);
@@ -401,32 +401,39 @@ export function useLayer({ enabled = false, opacity = 0.9, map = null }) {
       // If this was the popup that was open before redraw, re-open it now
       if (!suppressReopenRef.current && openDxCall && dxCall === openDxCall) {
         setTimeout(() => {
-          try { dxMarker.openPopup(); } catch {}
+          try {
+            dxMarker.openPopup();
+          } catch {}
         }, 0);
       }
 
       // Draw line from station -> DX if we have station coords
       if (station) {
         const line = L.polyline(
-          [[station.lat, station.lon], [lat, lon]],
-          { opacity, color: lineColor }
+          [
+            [station.lat, station.lon],
+            [lat, lon],
+          ],
+          { opacity, color: lineColor },
         ).addTo(map);
         newLayers.push(line);
       }
     });
 
     setLayersRef(newLayers);
-	
+
     // Cleanup
     return () => {
-      newLayers.forEach(layer => {
-        try { map.removeLayer(layer); } catch {}
+      newLayers.forEach((layer) => {
+        try {
+          map.removeLayer(layer);
+        } catch {}
       });
     };
   }, [enabled, qsos, map, opacity, retentionMinutes, displayMinutes, lineColor]);
 
   return {
     qsoCount: qsos.length,
-    retentionMinutes
+    retentionMinutes,
   };
 }
diff --git a/src/plugins/layers/useOWMClouds.js b/src/plugins/layers/useOWMClouds.js
index bf28b636..b4104f8b 100644
--- a/src/plugins/layers/useOWMClouds.js
+++ b/src/plugins/layers/useOWMClouds.js
@@ -13,7 +13,7 @@ export const metadata = {
   category: 'weather',
   defaultEnabled: false,
   defaultOpacity: 0.5,
-  localOnly: true
+  localOnly: true,
 };
 
 // The registry looks for this EXACT name: useLayer
@@ -21,20 +21,19 @@ export function useLayer({ enabled = false, opacity = 0.5, map = null }) {
   const layerRef = useRef(null);
 
   useEffect(() => {
-
     if (!map) return;
 
     if (enabled) {
       const apiKey = import.meta.env.VITE_OPENWEATHER_API_KEY || '';
-      
+
       if (!layerRef.current) {
         layerRef.current = L.tileLayer(
           `https://tile.openweathermap.org/map/clouds_new/{z}/{x}/{y}.png?appid=${apiKey}`,
           {
             opacity: opacity,
             zIndex: 1000,
-            attribution: '© OpenWeatherMap'
-          }
+            attribution: '© OpenWeatherMap',
+          },
         );
         layerRef.current.addTo(map);
       } else {
diff --git a/src/plugins/layers/useRBN.js b/src/plugins/layers/useRBN.js
index 35772a17..ff824be5 100644
--- a/src/plugins/layers/useRBN.js
+++ b/src/plugins/layers/useRBN.js
@@ -2,7 +2,7 @@ import { useState, useEffect, useRef } from 'react';
 
 /**
  * Reverse Beacon Network (RBN) Plugin v1.0.0
- * 
+ *
  * Features:
  * - Shows who's hearing YOUR signal
  * - Real-time skimmer spots
@@ -11,7 +11,7 @@ import { useState, useEffect, useRef } from 'react';
  * - Band filter
  * - Time window filter
  * - Great circle paths to skimmers
- * 
+ *
  * Data source: Reverse Beacon Network API
  * Update interval: 10 seconds
  */
@@ -19,7 +19,7 @@ import { useState, useEffect, useRef } from 'react';
 // Make control panel draggable with CTRL+drag and save position
 function makeDraggable(element, storageKey, skipPositionLoad = false) {
   if (!element) return;
-  
+
   // Load saved position only if not already loaded
   if (!skipPositionLoad) {
     const saved = localStorage.getItem(storageKey);
@@ -27,7 +27,7 @@ function makeDraggable(element, storageKey, skipPositionLoad = false) {
       try {
         const data = JSON.parse(saved);
         element.style.position = 'fixed';
-        
+
         // Check if saved as percentage (new format) or pixels (old format)
         if (data.topPercent !== undefined && data.leftPercent !== undefined) {
           // Use percentage-based positioning (scales with zoom)
@@ -40,7 +40,7 @@ function makeDraggable(element, storageKey, skipPositionLoad = false) {
           element.style.top = topPercent + '%';
           element.style.left = leftPercent + '%';
         }
-        
+
         element.style.right = 'auto';
         element.style.bottom = 'auto';
         element.style.transform = 'none';
@@ -55,13 +55,13 @@ function makeDraggable(element, storageKey, skipPositionLoad = false) {
       element.style.bottom = 'auto';
     }
   }
-  
+
   // Add drag hint
   element.title = 'Hold CTRL and drag to reposition';
-  
+
   let isDragging = false;
   let startX, startY, startLeft, startTop;
-  
+
   // Update cursor based on CTRL key
   const updateCursor = (e) => {
     if (e.ctrlKey) {
@@ -70,7 +70,7 @@ function makeDraggable(element, storageKey, skipPositionLoad = false) {
       element.style.cursor = 'default';
     }
   };
-  
+
   element.addEventListener('mouseenter', updateCursor);
   element.addEventListener('mousemove', updateCursor);
   document.addEventListener('keydown', (e) => {
@@ -79,53 +79,53 @@ function makeDraggable(element, storageKey, skipPositionLoad = false) {
   document.addEventListener('keyup', (e) => {
     if (e.key === 'Control') updateCursor(e);
   });
-  
-  element.addEventListener('mousedown', function(e) {
+
+  element.addEventListener('mousedown', function (e) {
     // Only allow dragging with CTRL key
     if (!e.ctrlKey) return;
-    
+
     // Only allow dragging from empty areas (not inputs/selects)
     if (e.target.tagName === 'SELECT' || e.target.tagName === 'INPUT' || e.target.tagName === 'LABEL') {
       return;
     }
-    
+
     isDragging = true;
     startX = e.clientX;
     startY = e.clientY;
     startLeft = element.offsetLeft;
     startTop = element.offsetTop;
-    
+
     element.style.cursor = 'grabbing';
     element.style.opacity = '0.8';
     e.preventDefault();
   });
-  
-  document.addEventListener('mousemove', function(e) {
+
+  document.addEventListener('mousemove', function (e) {
     if (!isDragging) return;
-    
+
     const dx = e.clientX - startX;
     const dy = e.clientY - startY;
-    
-    element.style.left = (startLeft + dx) + 'px';
-    element.style.top = (startTop + dy) + 'px';
+
+    element.style.left = startLeft + dx + 'px';
+    element.style.top = startTop + dy + 'px';
   });
-  
-  document.addEventListener('mouseup', function(e) {
+
+  document.addEventListener('mouseup', function (e) {
     if (isDragging) {
       isDragging = false;
       element.style.opacity = '1';
       updateCursor(e);
-      
+
       // Save position as percentage of viewport for zoom compatibility
       const topPercent = (element.offsetTop / window.innerHeight) * 100;
       const leftPercent = (element.offsetLeft / window.innerWidth) * 100;
-      
+
       const position = {
         topPercent,
         leftPercent,
         // Keep pixel values for backward compatibility
         top: element.offsetTop,
-        left: element.offsetLeft
+        left: element.offsetLeft,
       };
       localStorage.setItem(storageKey, JSON.stringify(position));
     }
@@ -135,20 +135,20 @@ function makeDraggable(element, storageKey, skipPositionLoad = false) {
 // Add minimize/maximize functionality to control panels
 function addMinimizeToggle(element, storageKey) {
   if (!element) return;
-  
+
   const minimizeKey = storageKey + '-minimized';
-  
+
   // Create minimize button
   const header = element.querySelector('div:first-child');
   if (!header) return;
-  
+
   // Wrap content (everything except header)
   const content = Array.from(element.children).slice(1);
   const contentWrapper = document.createElement('div');
   contentWrapper.className = 'rbn-panel-content';
-  content.forEach(child => contentWrapper.appendChild(child));
+  content.forEach((child) => contentWrapper.appendChild(child));
   element.appendChild(contentWrapper);
-  
+
   // Add minimize button to header
   const minimizeBtn = document.createElement('span');
   minimizeBtn.className = 'rbn-minimize-btn';
@@ -164,19 +164,19 @@ function addMinimizeToggle(element, storageKey) {
     transition: opacity 0.2s;
   `;
   minimizeBtn.title = 'Minimize/Maximize';
-  
+
   minimizeBtn.addEventListener('mouseenter', () => {
     minimizeBtn.style.opacity = '1';
   });
   minimizeBtn.addEventListener('mouseleave', () => {
     minimizeBtn.style.opacity = '0.7';
   });
-  
+
   header.style.display = 'flex';
   header.style.justifyContent = 'space-between';
   header.style.alignItems = 'center';
   header.appendChild(minimizeBtn);
-  
+
   // Load saved state
   const isMinimized = localStorage.getItem(minimizeKey) === 'true';
   if (isMinimized) {
@@ -184,14 +184,14 @@ function addMinimizeToggle(element, storageKey) {
     minimizeBtn.innerHTML = '▶';
     element.style.cursor = 'pointer';
   }
-  
+
   // Toggle function
   const toggle = (e) => {
     // Don't toggle if CTRL is held (for dragging)
     if (e && e.ctrlKey) return;
-    
+
     const isCurrentlyMinimized = contentWrapper.style.display === 'none';
-    
+
     if (isCurrentlyMinimized) {
       // Expand
       contentWrapper.style.display = 'block';
@@ -206,14 +206,14 @@ function addMinimizeToggle(element, storageKey) {
       localStorage.setItem(minimizeKey, 'true');
     }
   };
-  
+
   // Click header to toggle (except on button itself)
   header.addEventListener('click', (e) => {
     if (e.target === header || e.target.tagName === 'DIV') {
       toggle(e);
     }
   });
-  
+
   // Click button to toggle
   minimizeBtn.addEventListener('click', (e) => {
     e.stopPropagation();
@@ -229,40 +229,40 @@ export const metadata = {
   category: 'propagation',
   defaultEnabled: false,
   defaultOpacity: 0.7,
-  version: '1.0.0'
+  version: '1.0.0',
 };
 
 // Convert grid square to lat/lon
 function gridToLatLon(grid) {
   if (!grid || grid.length < 4) return null;
-  
+
   grid = grid.toUpperCase();
   const lon = (grid.charCodeAt(0) - 65) * 20 - 180;
   const lat = (grid.charCodeAt(1) - 65) * 10 - 90;
   const lon2 = parseInt(grid[2]) * 2;
   const lat2 = parseInt(grid[3]);
-  
+
   let longitude = lon + lon2 + 1;
   let latitude = lat + lat2 + 0.5;
-  
+
   if (grid.length >= 6) {
-    const lon3 = (grid.charCodeAt(4) - 65) * (2/24);
-    const lat3 = (grid.charCodeAt(5) - 65) * (1/24);
-    longitude = lon + lon2 + lon3 + (1/24);
-    latitude = lat + lat2 + lat3 + (0.5/24);
+    const lon3 = (grid.charCodeAt(4) - 65) * (2 / 24);
+    const lat3 = (grid.charCodeAt(5) - 65) * (1 / 24);
+    longitude = lon + lon2 + lon3 + 1 / 24;
+    latitude = lat + lat2 + lat3 + 0.5 / 24;
   }
-  
+
   return { lat: latitude, lon: longitude };
 }
 
 // Get color based on SNR (signal-to-noise ratio)
 function getSNRColor(snr) {
   if (snr === null || snr === undefined) return '#888888';
-  if (snr < 0) return '#ff3333';      // Red: Weak
-  if (snr < 10) return '#ff9933';     // Orange: Fair
-  if (snr < 20) return '#ffcc33';     // Yellow: Good
-  if (snr < 30) return '#99ff33';     // Light green: Very good
-  return '#33ff33';                   // Bright green: Excellent
+  if (snr < 0) return '#ff3333'; // Red: Weak
+  if (snr < 10) return '#ff9933'; // Orange: Fair
+  if (snr < 20) return '#ffcc33'; // Yellow: Good
+  if (snr < 30) return '#99ff33'; // Light green: Very good
+  return '#33ff33'; // Bright green: Excellent
 }
 
 // Get marker size based on SNR
@@ -278,20 +278,30 @@ function getMarkerSize(snr) {
 // Calculate great circle path - returns array of path segments (split at dateline)
 function getGreatCirclePath(lat1, lon1, lat2, lon2, numPoints = 30) {
   if (!isFinite(lat1) || !isFinite(lon1) || !isFinite(lat2) || !isFinite(lon2)) {
-    return [[[lat1, lon1], [lat2, lon2]]];
+    return [
+      [
+        [lat1, lon1],
+        [lat2, lon2],
+      ],
+    ];
   }
-  
+
   const deltaLat = Math.abs(lat2 - lat1);
   const deltaLon = Math.abs(lon2 - lon1);
   if (deltaLat < 0.5 && deltaLon < 0.5) {
-    return [[[lat1, lon1], [lat2, lon2]]];
+    return [
+      [
+        [lat1, lon1],
+        [lat2, lon2],
+      ],
+    ];
   }
-  
+
   // Normalize longitudes to handle dateline crossing
   let lon1Norm = lon1;
   let lon2Norm = lon2;
   const crossesDateline = Math.abs(lon2 - lon1) > 180;
-  
+
   if (crossesDateline) {
     // Adjust longitudes to take shorter path
     if (lon2 > lon1) {
@@ -300,57 +310,59 @@ function getGreatCirclePath(lat1, lon1, lat2, lon2, numPoints = 30) {
       lon2Norm = lon2 + 360;
     }
   }
-  
+
   const path = [];
-  
+
   // Convert to radians
-  const lat1Rad = lat1 * Math.PI / 180;
-  const lon1Rad = lon1Norm * Math.PI / 180;
-  const lat2Rad = lat2 * Math.PI / 180;
-  const lon2Rad = lon2Norm * Math.PI / 180;
-  
+  const lat1Rad = (lat1 * Math.PI) / 180;
+  const lon1Rad = (lon1Norm * Math.PI) / 180;
+  const lat2Rad = (lat2 * Math.PI) / 180;
+  const lon2Rad = (lon2Norm * Math.PI) / 180;
+
   // Calculate distance
   const d = Math.acos(
-    Math.sin(lat1Rad) * Math.sin(lat2Rad) +
-    Math.cos(lat1Rad) * Math.cos(lat2Rad) * Math.cos(lon2Rad - lon1Rad)
+    Math.sin(lat1Rad) * Math.sin(lat2Rad) + Math.cos(lat1Rad) * Math.cos(lat2Rad) * Math.cos(lon2Rad - lon1Rad),
   );
-  
+
   // Handle very small distances
   if (isNaN(d) || d < 0.0001) {
-    return [[[lat1, lon1], [lat2, lon2]]];
+    return [
+      [
+        [lat1, lon1],
+        [lat2, lon2],
+      ],
+    ];
   }
-  
+
   // Generate points along the path
   for (let i = 0; i <= numPoints; i++) {
     const f = i / numPoints;
     const A = Math.sin((1 - f) * d) / Math.sin(d);
     const B = Math.sin(f * d) / Math.sin(d);
-    
-    const x = A * Math.cos(lat1Rad) * Math.cos(lon1Rad) +
-              B * Math.cos(lat2Rad) * Math.cos(lon2Rad);
-    const y = A * Math.cos(lat1Rad) * Math.sin(lon1Rad) +
-              B * Math.cos(lat2Rad) * Math.sin(lon2Rad);
+
+    const x = A * Math.cos(lat1Rad) * Math.cos(lon1Rad) + B * Math.cos(lat2Rad) * Math.cos(lon2Rad);
+    const y = A * Math.cos(lat1Rad) * Math.sin(lon1Rad) + B * Math.cos(lat2Rad) * Math.sin(lon2Rad);
     const z = A * Math.sin(lat1Rad) + B * Math.sin(lat2Rad);
-    
-    const lat = Math.atan2(z, Math.sqrt(x * x + y * y)) * 180 / Math.PI;
-    let lon = Math.atan2(y, x) * 180 / Math.PI;
-    
+
+    const lat = (Math.atan2(z, Math.sqrt(x * x + y * y)) * 180) / Math.PI;
+    let lon = (Math.atan2(y, x) * 180) / Math.PI;
+
     // Normalize longitude back to -180 to 180 range
     while (lon > 180) lon -= 360;
     while (lon < -180) lon += 360;
-    
+
     path.push([lat, lon]);
   }
-  
+
   // If path crosses dateline, split into segments
   if (crossesDateline) {
     const segments = [];
     let currentSegment = [path[0]];
-    
+
     for (let i = 1; i < path.length; i++) {
       const prevLon = path[i - 1][1];
       const currLon = path[i][1];
-      
+
       // Check if this segment crosses dateline (jump > 180°)
       if (Math.abs(currLon - prevLon) > 180) {
         // Finish current segment
@@ -361,15 +373,15 @@ function getGreatCirclePath(lat1, lon1, lat2, lon2, numPoints = 30) {
         currentSegment.push(path[i]);
       }
     }
-    
+
     // Add final segment
     if (currentSegment.length > 0) {
       segments.push(currentSegment);
     }
-    
+
     return segments;
   }
-  
+
   // Return single segment
   return [path];
 }
@@ -398,11 +410,11 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
   const [minSNR, setMinSNR] = useState(-10);
   const [showPaths, setShowPaths] = useState(true);
   const [stats, setStats] = useState({ total: 0, skimmers: 0, avgSNR: 0 });
-  
+
   // Low memory mode limits
   const MAX_SPOTS = lowMemoryMode ? 25 : 200;
   const UPDATE_INTERVAL = lowMemoryMode ? 30000 : 10000; // 10s normal, 30s low-memory (panel says "Update: 10sec")
-  
+
   const layersRef = useRef([]);
   const controlRef = useRef(null);
   const updateIntervalRef = useRef(null);
@@ -418,27 +430,29 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
       // Server filters by callsign and enriches with locations — no client-side firehose scanning
       const response = await fetch(
         `/api/rbn/spots?callsign=${encodeURIComponent(callsign)}&minutes=${Math.ceil(timeWindow)}`,
-        { headers: { 'Accept': 'application/json' } }
+        { headers: { Accept: 'application/json' } },
       );
-      
+
       if (!response.ok) {
         throw new Error(`RBN API error: ${response.status}`);
       }
-      
+
       const data = await response.json();
-      
+
       if (data && data.spots && Array.isArray(data.spots)) {
         const mySpots = data.spots;
-        
+
         console.log(`[RBN] Received ${mySpots.length} spots for ${callsign}`);
-        
+
         // Log spot details
         if (mySpots.length > 0) {
           mySpots.forEach((spot, idx) => {
-            console.log(`  ${idx + 1}. Skimmer: ${spot.callsign}, Freq: ${spot.freqMHz} MHz, SNR: ${spot.snr} dB, Band: ${spot.band}, Grid: ${spot.grid || 'MISSING'}, Lat: ${spot.skimmerLat || '?'}, Lon: ${spot.skimmerLon || '?'}`);
+            console.log(
+              `  ${idx + 1}. Skimmer: ${spot.callsign}, Freq: ${spot.freqMHz} MHz, SNR: ${spot.snr} dB, Band: ${spot.band}, Grid: ${spot.grid || 'MISSING'}, Lat: ${spot.skimmerLat || '?'}, Lon: ${spot.skimmerLon || '?'}`,
+            );
           });
         }
-        
+
         // Client-side location fallback for any spots the server couldn't resolve
         const enrichedSpots = await Promise.all(
           mySpots.map(async (spot) => {
@@ -447,32 +461,34 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
               const locationResponse = await fetch(`/api/rbn/location/${spot.callsign}`);
               if (locationResponse.ok) {
                 const loc = await locationResponse.json();
-                return { ...spot, grid: loc.grid, skimmerLat: loc.lat, skimmerLon: loc.lon, skimmerCountry: loc.country };
+                return {
+                  ...spot,
+                  grid: loc.grid,
+                  skimmerLat: loc.lat,
+                  skimmerLon: loc.lon,
+                  skimmerCountry: loc.country,
+                };
               }
             } catch (err) {
               console.warn(`[RBN] Location fallback failed for ${spot.callsign}`);
             }
             return spot;
-          })
+          }),
         );
-        
+
         // Store ALL spots — the render effect handles band/SNR/age filtering
         // so slider changes take effect instantly without re-fetching
         setSpots(enrichedSpots);
-        
+
         // Calculate statistics from all spots
-        const validSNRs = enrichedSpots
-          .map(s => s.snr)
-          .filter(snr => snr !== null && snr !== undefined);
-        
-        const uniqueSkimmers = new Set(enrichedSpots.map(s => s.callsign));
-        
+        const validSNRs = enrichedSpots.map((s) => s.snr).filter((snr) => snr !== null && snr !== undefined);
+
+        const uniqueSkimmers = new Set(enrichedSpots.map((s) => s.callsign));
+
         setStats({
           total: enrichedSpots.length,
           skimmers: uniqueSkimmers.size,
-          avgSNR: validSNRs.length > 0 
-            ? (validSNRs.reduce((a, b) => a + b, 0) / validSNRs.length).toFixed(1)
-            : 0
+          avgSNR: validSNRs.length > 0 ? (validSNRs.reduce((a, b) => a + b, 0) / validSNRs.length).toFixed(1) : 0,
         });
       }
     } catch (error) {
@@ -486,7 +502,7 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
       fetchRBNSpots();
       updateIntervalRef.current = setInterval(fetchRBNSpots, UPDATE_INTERVAL);
     }
-    
+
     return () => {
       if (updateIntervalRef.current) {
         clearInterval(updateIntervalRef.current);
@@ -499,7 +515,7 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
     if (!map || !enabled) return;
 
     // Clear old layers
-    layersRef.current.forEach(layer => {
+    layersRef.current.forEach((layer) => {
       try {
         map.removeLayer(layer);
       } catch (e) {}
@@ -514,34 +530,36 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
     // Filter spots by band, SNR, and AGE
     const now = Date.now();
     const timeWindowMs = timeWindow * 60 * 1000; // Convert minutes to milliseconds
-    
-    const filteredSpots = spots.filter(spot => {
+
+    const filteredSpots = spots.filter((spot) => {
       const band = freqToBand(spot.frequency || spot.freq || 0);
       const snr = spot.snr || spot.db || 0;
-      
+
       // Band filter
       if (selectedBand !== 'all' && selectedBand !== 'All' && band !== selectedBand) return false;
-      
+
       // SNR filter
       if (snr < minSNR) return false;
-      
+
       // AGE filter - only show spots within the time window
       const spotTimestamp = new Date(spot.timestamp).getTime();
       const ageMs = now - spotTimestamp;
       if (ageMs > timeWindowMs) {
         return false; // Spot is too old, don't show it
       }
-      
+
       return true;
     });
 
-    console.log(`[RBN] Rendering ${filteredSpots.length} spots (within ${timeWindow < 1 ? (timeWindow * 60).toFixed(0) + 's' : timeWindow.toFixed(1) + 'min'} window)`);
+    console.log(
+      `[RBN] Rendering ${filteredSpots.length} spots (within ${timeWindow < 1 ? (timeWindow * 60).toFixed(0) + 's' : timeWindow.toFixed(1) + 'min'} window)`,
+    );
 
     // Render each spot
-    filteredSpots.forEach(spot => {
+    filteredSpots.forEach((spot) => {
       // spot contains: { callsign (skimmer), dx (you), freq, band, mode, snr, grid, skimmerLat, skimmerLon }
       const skimmerGrid = spot.grid;
-      
+
       if (!skimmerGrid) {
         console.warn(`[RBN] No grid square for skimmer ${spot.callsign}`);
         return;
@@ -554,7 +572,7 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
       } else {
         skimmerLoc = gridToLatLon(skimmerGrid);
       }
-      
+
       if (!skimmerLoc) return;
 
       const snr = spot.snr || 0;
@@ -565,18 +583,15 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
 
       // Create path line from YOUR location to the SKIMMER
       if (showPaths) {
-        const pathSegments = getGreatCirclePath(
-          deLocation.lat, deLocation.lon,
-          skimmerLoc.lat, skimmerLoc.lon
-        );
+        const pathSegments = getGreatCirclePath(deLocation.lat, deLocation.lon, skimmerLoc.lat, skimmerLoc.lon);
 
         // Draw each segment (handles dateline crossing)
-        pathSegments.forEach(pathPoints => {
+        pathSegments.forEach((pathPoints) => {
           const pathLine = L.polyline(pathPoints, {
             color: getSNRColor(snr),
             weight: 2,
             opacity: opacity * 0.6,
-            dashArray: '5, 5'
+            dashArray: '5, 5',
           });
 
           pathLine.addTo(map);
@@ -594,7 +609,7 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
         color: '#ffffff',
         weight: 2,
         opacity: opacity,
-        fillOpacity: opacity * 0.8
+        fillOpacity: opacity * 0.8,
       });
 
       marker.bindPopup(`
@@ -603,7 +618,7 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
           Heard: <b>${callsign}</b><br>
           SNR: <b>${snr} dB</b><br>
           Band: <b>${band}</b><br>
-          Freq: <b>${(freq/1000).toFixed(1)} kHz</b><br>
+          Freq: <b>${(freq / 1000).toFixed(1)} kHz</b><br>
           Grid: ${skimmerGrid}<br>
           Time: ${timestamp.toLocaleTimeString()}
         </div>
@@ -612,7 +627,6 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
       marker.addTo(map);
       layersRef.current.push(marker);
     });
-
   }, [map, enabled, spots, selectedBand, minSNR, showPaths, opacity, callsign, timeWindow]);
 
   // Create control panel
@@ -622,7 +636,7 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
     // Create control panel
     const control = L.control({ position: 'topright' });
 
-    control.onAdd = function() {
+    control.onAdd = function () {
       const div = L.DomUtil.create('div', 'leaflet-bar leaflet-control rbn-control');
       div.style.background = 'var(--bg-panel)';
       div.style.padding = '10px';
@@ -698,7 +712,7 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
           } else {
             timeValue.textContent = timeWindow.toFixed(1) + 'min';
           }
-          
+
           timeSlider.addEventListener('input', (e) => {
             const val = parseFloat(e.target.value);
             // Display as seconds if < 1 minute, otherwise minutes
@@ -753,7 +767,7 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
             controlElement.style.bottom = 'auto';
           } catch (e) {}
         }
-        
+
         makeDraggable(controlElement, 'rbn-panel-position');
         addMinimizeToggle(controlElement, 'rbn-panel');
       }
@@ -770,14 +784,14 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
   // Separate effect to update stats display without recreating the entire control
   useEffect(() => {
     if (!enabled || !controlRef.current) return;
-    
+
     const container = controlRef.current.getContainer();
     if (!container) return;
-    
+
     // Find stats display (before minimize toggle wraps content)
-    const statsDisplay = container.querySelector('#rbn-stats-display') || 
-                        container.querySelector('.rbn-panel-content #rbn-stats-display');
-    
+    const statsDisplay =
+      container.querySelector('#rbn-stats-display') || container.querySelector('.rbn-panel-content #rbn-stats-display');
+
     if (statsDisplay) {
       statsDisplay.innerHTML = `
         Spots: <b>${stats.total}</b> | Skimmers: <b>${stats.skimmers}</b><br>
@@ -789,7 +803,7 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
   // Cleanup on disable
   useEffect(() => {
     if (!enabled) {
-      layersRef.current.forEach(layer => {
+      layersRef.current.forEach((layer) => {
         try {
           map.removeLayer(layer);
         } catch (e) {}
diff --git a/src/plugins/layers/useSatelliteLayer.js b/src/plugins/layers/useSatelliteLayer.js
index afeed1e8..9f9e18c6 100644
--- a/src/plugins/layers/useSatelliteLayer.js
+++ b/src/plugins/layers/useSatelliteLayer.js
@@ -15,7 +15,7 @@ export const metadata = {
     tailTimeMins: 15,
     showTracks: true,
     showFootprints: true,
-  }
+  },
 };
 
 export const useLayer = ({ map, enabled, satellites, setSatellites, opacity, config, units }) => {
@@ -35,9 +35,7 @@ export const useLayer = ({ map, enabled, satellites, setSatellites, opacity, con
 
   // Helper to add/remove satellites from the active view
   const toggleSatellite = (name) => {
-    setSelectedSats(prev => 
-      prev.includes(name) ? prev.filter(n => n !== name) : [...prev, name]
-    );
+    setSelectedSats((prev) => (prev.includes(name) ? prev.filter((n) => n !== name) : [...prev, name]));
   };
 
   // Bridge to the popup window HTML
@@ -49,17 +47,19 @@ export const useLayer = ({ map, enabled, satellites, setSatellites, opacity, con
     try {
       const response = await fetch('/api/satellites/tle');
       const data = await response.json();
-      
+
       const observerGd = {
         latitude: satellite.degreesToRadians(config?.lat || 43.44),
         longitude: satellite.degreesToRadians(config?.lon || -88.63),
-        height: (config?.alt || 260) / 1000
+        height: (config?.alt || 260) / 1000,
       };
 
-      const satArray = Object.keys(data).map(name => {
+      const satArray = Object.keys(data).map((name) => {
         const satData = data[name];
         let isVisible = false;
-        let az = 0, el = 0, range = 0;
+        let az = 0,
+          el = 0,
+          range = 0;
         const leadTrack = [];
 
         if (satData.line1 && satData.line2) {
@@ -71,7 +71,7 @@ export const useLayer = ({ map, enabled, satellites, setSatellites, opacity, con
           if (positionAndVelocity.position) {
             const positionEcf = satellite.eciToEcf(positionAndVelocity.position, gmst);
             const lookAngles = satellite.ecfToLookAngles(observerGd, positionEcf);
-            
+
             az = lookAngles.azimuth * (180 / Math.PI);
             el = lookAngles.elevation * (180 / Math.PI);
             range = lookAngles.rangeSat;
@@ -85,22 +85,19 @@ export const useLayer = ({ map, enabled, satellites, setSatellites, opacity, con
             if (posVel.position) {
               const fGmst = satellite.gstime(futureTime);
               const geodetic = satellite.eciToGeodetic(posVel.position, fGmst);
-              leadTrack.push([
-                satellite.degreesLat(geodetic.latitude),
-                satellite.degreesLong(geodetic.longitude)
-              ]);
+              leadTrack.push([satellite.degreesLat(geodetic.latitude), satellite.degreesLong(geodetic.longitude)]);
             }
           }
         }
 
-        return { 
-          ...satData, 
-          name, 
-          visible: isVisible, 
-          azimuth: az, 
-          elevation: el, 
+        return {
+          ...satData,
+          name,
+          visible: isVisible,
+          azimuth: az,
+          elevation: el,
           range: range,
-          leadTrack 
+          leadTrack,
         };
       });
 
@@ -110,7 +107,7 @@ export const useLayer = ({ map, enabled, satellites, setSatellites, opacity, con
     }
   };
 
-const updateInfoWindow = () => {
+  const updateInfoWindow = () => {
     const winId = 'sat-data-window';
     const container = map.getContainer();
     let win = container.querySelector(`#${winId}`);
@@ -138,7 +135,7 @@ const updateInfoWindow = () => {
         fontFamily: 'monospace',
         pointerEvents: 'auto',
         boxShadow: '0 0 15px rgba(0,0,0,0.7)',
-        cursor: 'default'
+        cursor: 'default',
       });
       container.appendChild(win);
 
@@ -149,7 +146,7 @@ const updateInfoWindow = () => {
           isDragging = true;
           win.style.cursor = 'move';
           // --- STOP MAP DRAGGING ---
-          if (map.dragging) map.dragging.disable(); 
+          if (map.dragging) map.dragging.disable();
           e.preventDefault();
           e.stopPropagation();
         }
@@ -171,10 +168,10 @@ const updateInfoWindow = () => {
           win.style.cursor = 'default';
           // --- RE-ENABLE MAP DRAGGING ---
           if (map.dragging) map.dragging.enable();
-          
+
           setWinPos({
             top: parseInt(win.style.top),
-            right: parseInt(win.style.right)
+            right: parseInt(win.style.right),
           });
         }
       };
@@ -183,7 +180,7 @@ const updateInfoWindow = () => {
     win.style.top = `${winPos.top}px`;
     win.style.right = `${winPos.right}px`;
 
-    const activeSats = satellites.filter(s => selectedSats.includes(s.name));
+    const activeSats = satellites.filter((s) => selectedSats.includes(s.name));
 
     const clearAllBtn = `
       <div style="margin-bottom: 12px; border-bottom: 2px solid #004444; padding-bottom: 8px; display: flex; flex-direction: column; align-items: center; gap: 5px;">
@@ -195,13 +192,16 @@ const updateInfoWindow = () => {
       </div>
     `;
 
-    win.innerHTML = clearAllBtn + activeSats.map(sat => {
-      const isVisible = sat.visible === true;
-      const isImp = units === 'imperial';
-      const conv = isImp ? 0.621371 : 1;
-      const distUnit = isImp ? ' mi' : ' km';
+    win.innerHTML =
+      clearAllBtn +
+      activeSats
+        .map((sat) => {
+          const isVisible = sat.visible === true;
+          const isImp = units === 'imperial';
+          const conv = isImp ? 0.621371 : 1;
+          const distUnit = isImp ? ' mi' : ' km';
 
-      return `
+          return `
         <div class="sat-card" style="border-bottom: 1px solid #004444; margin-bottom: 10px; padding-bottom: 8px;">
           <div style="display:flex; justify-content:space-between; align-items:center; margin-bottom:4px;">
             <strong style="color:#ffffff; font-size: 14px;">${sat.name}</strong>
@@ -220,7 +220,8 @@ const updateInfoWindow = () => {
           </table>
         </div>
       `;
-    }).join('');
+        })
+        .join('');
   };
 
   const renderSatellites = () => {
@@ -230,11 +231,11 @@ const updateInfoWindow = () => {
 
     const globalOpacity = opacity !== undefined ? opacity : 1.0;
 
-    satellites.forEach(sat => {
+    satellites.forEach((sat) => {
       const isSelected = selectedSats.includes(sat.name);
 
       if (isSelected && config?.showFootprints !== false && sat.alt) {
-        const EARTH_RADIUS = 6371; 
+        const EARTH_RADIUS = 6371;
         const centralAngle = Math.acos(EARTH_RADIUS / (EARTH_RADIUS + sat.alt));
         const footprintRadiusMeters = centralAngle * EARTH_RADIUS * 1000;
         const footColor = sat.visible === true ? '#00ff00' : '#00ffff';
@@ -247,41 +248,60 @@ const updateInfoWindow = () => {
             opacity: globalOpacity,
             fillColor: footColor,
             fillOpacity: globalOpacity * 0.15,
-            interactive: false
+            interactive: false,
           }).addTo(layerGroupRef.current);
         });
       }
 
       if (config?.showTracks !== false && sat.track) {
-        const pathCoords = sat.track.map(p => [p[0], p[1]]);
-        replicatePath(pathCoords).forEach(coords => {
+        const pathCoords = sat.track.map((p) => [p[0], p[1]]);
+        replicatePath(pathCoords).forEach((coords) => {
           if (isSelected) {
             for (let i = 0; i < coords.length - 1; i++) {
-              const fade = (i / coords.length);
-              window.L.polyline([coords[i], coords[i+1]], { 
-                color: '#00ffff', weight: 6, opacity: fade * 0.3 * globalOpacity, lineCap: 'round', interactive: false 
+              const fade = i / coords.length;
+              window.L.polyline([coords[i], coords[i + 1]], {
+                color: '#00ffff',
+                weight: 6,
+                opacity: fade * 0.3 * globalOpacity,
+                lineCap: 'round',
+                interactive: false,
               }).addTo(layerGroupRef.current);
-              window.L.polyline([coords[i], coords[i+1]], { 
-                color: '#ffffff', weight: 2, opacity: fade * globalOpacity, lineCap: 'round', interactive: false 
+              window.L.polyline([coords[i], coords[i + 1]], {
+                color: '#ffffff',
+                weight: 2,
+                opacity: fade * globalOpacity,
+                lineCap: 'round',
+                interactive: false,
               }).addTo(layerGroupRef.current);
             }
           } else {
-            window.L.polyline(coords, { color: '#00ffff', weight: 1, opacity: 0.15 * globalOpacity, dashArray: '5, 10', interactive: false }).addTo(layerGroupRef.current);
+            window.L.polyline(coords, {
+              color: '#00ffff',
+              weight: 1,
+              opacity: 0.15 * globalOpacity,
+              dashArray: '5, 10',
+              interactive: false,
+            }).addTo(layerGroupRef.current);
           }
         });
 
         if (isSelected && sat.leadTrack && sat.leadTrack.length > 0) {
-          const leadCoords = sat.leadTrack.map(p => [p[0], p[1]]);
-          replicatePath(leadCoords).forEach(lCoords => {
+          const leadCoords = sat.leadTrack.map((p) => [p[0], p[1]]);
+          replicatePath(leadCoords).forEach((lCoords) => {
             window.L.polyline(lCoords, {
-              color: '#ffff00', weight: 3, opacity: 0.8 * globalOpacity, dashArray: '8, 12', lineCap: 'round', interactive: false
+              color: '#ffff00',
+              weight: 3,
+              opacity: 0.8 * globalOpacity,
+              dashArray: '8, 12',
+              lineCap: 'round',
+              interactive: false,
             }).addTo(layerGroupRef.current);
           });
         }
       }
 
       replicatePoint(sat.lat, sat.lon).forEach((pos) => {
-        const marker = window.L.marker(pos, { 
+        const marker = window.L.marker(pos, {
           icon: window.L.divIcon({
             className: 'sat-marker',
             html: `<div style="display:flex; flex-direction:column; align-items:center; opacity: ${globalOpacity};">
@@ -289,9 +309,9 @@ const updateInfoWindow = () => {
                      <div class="sat-label" style="${isSelected ? 'color: #ffffff; font-weight: bold;' : ''}">${sat.name}</div>
                    </div>`,
             iconSize: [80, 50],
-            iconAnchor: [40, 25]
+            iconAnchor: [40, 25],
           }),
-          zIndexOffset: isSelected ? 10000 : 1000
+          zIndexOffset: isSelected ? 10000 : 1000,
         });
 
         marker.on('click', (e) => {
@@ -309,7 +329,7 @@ const updateInfoWindow = () => {
   useEffect(() => {
     if (!map) return;
     if (!layerGroupRef.current) layerGroupRef.current = window.L.layerGroup().addTo(map);
-    
+
     if (enabled) {
       fetchSatellites();
       const interval = setInterval(fetchSatellites, 5000);
@@ -326,4 +346,4 @@ const updateInfoWindow = () => {
   }, [satellites, selectedSats, units, opacity, config]);
 
   return null;
-};
\ No newline at end of file
+};
diff --git a/src/plugins/layers/useVOACAPHeatmap.js b/src/plugins/layers/useVOACAPHeatmap.js
index b2e5a9c5..ca5e6947 100644
--- a/src/plugins/layers/useVOACAPHeatmap.js
+++ b/src/plugins/layers/useVOACAPHeatmap.js
@@ -2,11 +2,11 @@ import { useState, useEffect, useRef } from 'react';
 
 /**
  * VOACAP-Style Propagation Heatmap Plugin v1.0.0
- * 
+ *
  * Shows color-coded propagation predictions from your DE location to
- * the entire world for a selected HF band — green (good), yellow 
+ * the entire world for a selected HF band — green (good), yellow
  * (marginal), red (poor). Inspired by the original HamClock VOACAP overlay.
- * 
+ *
  * Data source: /api/propagation/heatmap (server-side, uses ITU-R P.533-style model)
  * Update interval: 5 minutes
  */
@@ -19,20 +19,20 @@ export const metadata = {
   category: 'propagation',
   defaultEnabled: false,
   defaultOpacity: 0.35,
-  version: '1.0.0'
+  version: '1.0.0',
 };
 
 // HF bands: label, frequency in MHz
 const BANDS = [
   { label: '160m', freq: 1.8 },
-  { label: '80m',  freq: 3.5 },
-  { label: '40m',  freq: 7 },
-  { label: '30m',  freq: 10 },
-  { label: '20m',  freq: 14 },
-  { label: '17m',  freq: 18 },
-  { label: '15m',  freq: 21 },
-  { label: '12m',  freq: 24 },
-  { label: '10m',  freq: 28 }
+  { label: '80m', freq: 3.5 },
+  { label: '40m', freq: 7 },
+  { label: '30m', freq: 10 },
+  { label: '20m', freq: 14 },
+  { label: '17m', freq: 18 },
+  { label: '15m', freq: 21 },
+  { label: '12m', freq: 24 },
+  { label: '10m', freq: 28 },
 ];
 
 // Reliability to color: red (0%) → yellow (50%) → green (100%)
@@ -56,7 +56,7 @@ function reliabilityColor(r) {
 // Make control panel draggable with CTRL+drag
 function makeDraggable(element, storageKey, skipPositionLoad = false) {
   if (!element) return;
-  
+
   // Load saved position only if not already loaded
   if (!skipPositionLoad) {
     const saved = localStorage.getItem(storageKey);
@@ -64,7 +64,7 @@ function makeDraggable(element, storageKey, skipPositionLoad = false) {
       try {
         const data = JSON.parse(saved);
         element.style.position = 'fixed';
-        
+
         // Check if saved as percentage (new format) or pixels (old format)
         if (data.topPercent !== undefined && data.leftPercent !== undefined) {
           // Use percentage-based positioning (scales with zoom)
@@ -77,7 +77,7 @@ function makeDraggable(element, storageKey, skipPositionLoad = false) {
           element.style.top = topPercent + '%';
           element.style.left = leftPercent + '%';
         }
-        
+
         element.style.right = 'auto';
         element.style.bottom = 'auto';
         element.style.transform = 'none';
@@ -92,19 +92,19 @@ function makeDraggable(element, storageKey, skipPositionLoad = false) {
       element.style.bottom = 'auto';
     }
   }
-  
+
   element.title = 'Hold CTRL and drag to reposition';
-  
+
   let isDragging = false;
   let startX, startY, startLeft, startTop;
-  
+
   const updateCursor = (e) => {
     element.style.cursor = e.ctrlKey ? 'grab' : 'default';
   };
-  
+
   element.addEventListener('mouseenter', updateCursor);
   element.addEventListener('mousemove', updateCursor);
-  
+
   element.addEventListener('mousedown', (e) => {
     if (!e.ctrlKey) return;
     isDragging = true;
@@ -116,30 +116,30 @@ function makeDraggable(element, storageKey, skipPositionLoad = false) {
     e.preventDefault();
     e.stopPropagation();
   });
-  
+
   document.addEventListener('mousemove', (e) => {
     if (!isDragging) return;
     const dx = e.clientX - startX;
     const dy = e.clientY - startY;
-    element.style.left = (startLeft + dx) + 'px';
-    element.style.top = (startTop + dy) + 'px';
+    element.style.left = startLeft + dx + 'px';
+    element.style.top = startTop + dy + 'px';
   });
-  
+
   document.addEventListener('mouseup', () => {
     if (!isDragging) return;
     isDragging = false;
     element.style.cursor = 'default';
-    
+
     // Save position as percentage of viewport for zoom compatibility
     const topPercent = (element.offsetTop / window.innerHeight) * 100;
     const leftPercent = (element.offsetLeft / window.innerWidth) * 100;
-    
+
     const position = {
       topPercent,
       leftPercent,
       // Keep pixel values for backward compatibility
       top: element.offsetTop,
-      left: element.offsetLeft
+      left: element.offsetLeft,
     };
     localStorage.setItem(storageKey, JSON.stringify(position));
   });
@@ -148,19 +148,19 @@ function makeDraggable(element, storageKey, skipPositionLoad = false) {
 // Minimize/maximize toggle
 function addMinimizeToggle(container, storageKey) {
   if (!container) return;
-  
+
   const contentWrapper = container.querySelector('.voacap-panel-content');
   const minimizeBtn = container.querySelector('.voacap-minimize-btn');
   if (!contentWrapper || !minimizeBtn) return;
-  
+
   const minKey = storageKey + '-minimized';
   const isMinimized = localStorage.getItem(minKey) === 'true';
-  
+
   if (isMinimized) {
     contentWrapper.style.display = 'none';
     minimizeBtn.textContent = '▶';
   }
-  
+
   minimizeBtn.addEventListener('click', (e) => {
     e.stopPropagation();
     const hidden = contentWrapper.style.display === 'none';
@@ -183,36 +183,40 @@ export function useLayer({ map, enabled, opacity, callsign, locator }) {
     try {
       const cfg = JSON.parse(localStorage.getItem('openhamclock_config') || '{}');
       return cfg.propagation?.mode || 'SSB';
-    } catch { return 'SSB'; }
+    } catch {
+      return 'SSB';
+    }
   });
   const [propPower, setPropPower] = useState(() => {
     try {
       const cfg = JSON.parse(localStorage.getItem('openhamclock_config') || '{}');
       return cfg.propagation?.power || 100;
-    } catch { return 100; }
+    } catch {
+      return 100;
+    }
   });
   const [data, setData] = useState(null);
   const [loading, setLoading] = useState(false);
   const [lastFetch, setLastFetch] = useState(0);
-  
+
   const layersRef = useRef([]);
   const controlRef = useRef(null);
   const intervalRef = useRef(null);
-  
+
   // Listen for config changes (fired by saveConfig in config.js)
   useEffect(() => {
     const onConfigChange = (e) => {
       const cfg = e.detail || {};
       const newMode = cfg.propagation?.mode || 'SSB';
       const newPower = cfg.propagation?.power || 100;
-      setPropMode(prev => prev !== newMode ? newMode : prev);
-      setPropPower(prev => prev !== newPower ? newPower : prev);
+      setPropMode((prev) => (prev !== newMode ? newMode : prev));
+      setPropPower((prev) => (prev !== newPower ? newPower : prev));
     };
-    
+
     window.addEventListener('openhamclock-config-change', onConfigChange);
     return () => window.removeEventListener('openhamclock-config-change', onConfigChange);
   }, []);
-  
+
   // Parse DE location from locator grid square
   const deLocation = (() => {
     if (!locator || locator.length < 4) return null;
@@ -223,15 +227,15 @@ export function useLayer({ map, enabled, opacity, callsign, locator }) {
     const latMin = parseInt(g[3]) * 1;
     return { lat: lat + latMin + 0.5, lon: lon + lonMin + 1 };
   })();
-  
+
   // Fetch heatmap data
   useEffect(() => {
     if (!enabled || !deLocation) return;
-    
+
     const fetchData = async () => {
       const band = BANDS[selectedBand];
       if (!band) return;
-      
+
       setLoading(true);
       try {
         const url = `/api/propagation/heatmap?deLat=${deLocation.lat.toFixed(1)}&deLon=${deLocation.lon.toFixed(1)}&freq=${band.freq}&grid=${gridSize}&mode=${propMode}&power=${propPower}`;
@@ -247,48 +251,50 @@ export function useLayer({ map, enabled, opacity, callsign, locator }) {
         setLoading(false);
       }
     };
-    
+
     fetchData();
     intervalRef.current = setInterval(fetchData, 5 * 60 * 1000);
-    
+
     return () => {
       if (intervalRef.current) clearInterval(intervalRef.current);
     };
   }, [enabled, deLocation?.lat, deLocation?.lon, selectedBand, gridSize, propMode, propPower]);
-  
+
   // Create control panel
   useEffect(() => {
     if (!map || !enabled) return;
-    
+
     // Avoid duplicate controls
     if (controlRef.current) {
-      try { map.removeControl(controlRef.current); } catch (e) {}
+      try {
+        map.removeControl(controlRef.current);
+      } catch (e) {}
       controlRef.current = null;
     }
-    
+
     const VOACAPControl = L.Control.extend({
       options: { position: 'topright' },
-      onAdd: function() {
+      onAdd: function () {
         const container = L.DomUtil.create('div', 'voacap-heatmap-control');
         L.DomEvent.disableClickPropagation(container);
         L.DomEvent.disableScrollPropagation(container);
-        
-        const bandOptions = BANDS.map((b, i) =>
-          `<option value="${i}" ${i === selectedBand ? 'selected' : ''}>${b.label} (${b.freq} MHz)</option>`
-        ).join('');
-        
-        const gridOptions = [5, 10, 15, 20].map(g =>
-          `<option value="${g}" ${g === gridSize ? 'selected' : ''}>${g}°</option>`
-        ).join('');
-        
-        const modeOptions = ['SSB', 'CW', 'FT8', 'FT4', 'RTTY', 'AM', 'FM'].map(m =>
-          `<option value="${m}" ${m === propMode ? 'selected' : ''}>${m}</option>`
-        ).join('');
-        
-        const powerOptions = [5, 10, 25, 50, 100, 200, 400, 500, 750, 1000, 1500].map(p =>
-          `<option value="${p}" ${p === propPower ? 'selected' : ''}>${p}W</option>`
+
+        const bandOptions = BANDS.map(
+          (b, i) => `<option value="${i}" ${i === selectedBand ? 'selected' : ''}>${b.label} (${b.freq} MHz)</option>`,
         ).join('');
-        
+
+        const gridOptions = [5, 10, 15, 20]
+          .map((g) => `<option value="${g}" ${g === gridSize ? 'selected' : ''}>${g}°</option>`)
+          .join('');
+
+        const modeOptions = ['SSB', 'CW', 'FT8', 'FT4', 'RTTY', 'AM', 'FM']
+          .map((m) => `<option value="${m}" ${m === propMode ? 'selected' : ''}>${m}</option>`)
+          .join('');
+
+        const powerOptions = [5, 10, 25, 50, 100, 200, 400, 500, 750, 1000, 1500]
+          .map((p) => `<option value="${p}" ${p === propPower ? 'selected' : ''}>${p}W</option>`)
+          .join('');
+
         container.innerHTML = `
           <div style="
             background: rgba(20, 20, 40, 0.92);
@@ -364,14 +370,14 @@ export function useLayer({ map, enabled, opacity, callsign, locator }) {
             </div>
           </div>
         `;
-        
+
         return container;
-      }
+      },
     });
-    
+
     controlRef.current = new VOACAPControl();
     map.addControl(controlRef.current);
-    
+
     // Helper to update both plugin state AND global config in localStorage
     const updateGlobalConfig = (mode, power) => {
       try {
@@ -383,12 +389,12 @@ export function useLayer({ map, enabled, opacity, callsign, locator }) {
         // Don't dispatch event here — we're already updating local state directly
       } catch (e) {}
     };
-    
+
     // Wire up event handlers after DOM is ready
     setTimeout(() => {
       const container = controlRef.current?._container;
       if (!container) return;
-      
+
       // Apply saved position
       const saved = localStorage.getItem('voacap-heatmap-position');
       if (saved) {
@@ -401,15 +407,15 @@ export function useLayer({ map, enabled, opacity, callsign, locator }) {
           container.style.bottom = 'auto';
         } catch (e) {}
       }
-      
+
       makeDraggable(container, 'voacap-heatmap-position');
       addMinimizeToggle(container, 'voacap-heatmap-position');
-      
+
       const bandSelect = document.getElementById('voacap-band-select');
       const gridSelect = document.getElementById('voacap-grid-select');
       const modeSelect = document.getElementById('voacap-mode-select');
       const powerSelect = document.getElementById('voacap-power-select');
-      
+
       if (bandSelect) {
         bandSelect.addEventListener('change', (e) => {
           const val = parseInt(e.target.value);
@@ -439,13 +445,12 @@ export function useLayer({ map, enabled, opacity, callsign, locator }) {
         });
       }
     }, 150);
-    
   }, [enabled, map]);
-  
+
   // Update status text and sync panel dropdowns when mode/power change
   useEffect(() => {
     if (!enabled) return;
-    
+
     const statusEl = document.getElementById('voacap-status');
     if (statusEl) {
       if (loading) {
@@ -454,89 +459,97 @@ export function useLayer({ map, enabled, opacity, callsign, locator }) {
         statusEl.textContent = `${data.mode || 'SSB'} ${data.power || 100}W | SFI: ${data.solarData?.sfi} K: ${data.solarData?.kIndex}`;
       }
     }
-    
+
     // Sync dropdowns if changed externally (e.g. from Settings panel)
     const modeSelect = document.getElementById('voacap-mode-select');
     const powerSelect = document.getElementById('voacap-power-select');
     if (modeSelect && modeSelect.value !== propMode) modeSelect.value = propMode;
     if (powerSelect && parseFloat(powerSelect.value) !== propPower) powerSelect.value = propPower;
   }, [loading, data, enabled, propMode, propPower]);
-  
+
   // Render heatmap rectangles on the map
   useEffect(() => {
     if (!map || !enabled) return;
-    
+
     // Clear old layers
-    layersRef.current.forEach(layer => {
-      try { map.removeLayer(layer); } catch (e) {}
+    layersRef.current.forEach((layer) => {
+      try {
+        map.removeLayer(layer);
+      } catch (e) {}
     });
     layersRef.current = [];
-    
+
     if (!data?.cells?.length) return;
-    
+
     const half = (data.gridSize || 10) / 2;
     const newLayers = [];
-    
-    data.cells.forEach(cell => {
+
+    data.cells.forEach((cell) => {
       const color = reliabilityColor(cell.r);
       const band = BANDS[selectedBand];
-      
+
       // Create rectangles in 3 world copies for dateline support
       for (const offset of [-360, 0, 360]) {
         const bounds = [
           [cell.lat - half, cell.lon - half + offset],
-          [cell.lat + half, cell.lon + half + offset]
+          [cell.lat + half, cell.lon + half + offset],
         ];
-        
+
         const rect = L.rectangle(bounds, {
           color: 'transparent',
           fillColor: color,
           fillOpacity: opacity,
           weight: 0,
           interactive: false,
-          bubblingMouseEvents: true
+          bubblingMouseEvents: true,
         });
-        
+
         rect.addTo(map);
         newLayers.push(rect);
       }
     });
-    
+
     layersRef.current = newLayers;
-    
+
     return () => {
-      newLayers.forEach(layer => {
-        try { map.removeLayer(layer); } catch (e) {}
+      newLayers.forEach((layer) => {
+        try {
+          map.removeLayer(layer);
+        } catch (e) {}
       });
     };
   }, [map, enabled, data, opacity, selectedBand]);
-  
+
   // Cleanup on disable
   useEffect(() => {
     if (!enabled && map) {
       if (controlRef.current) {
-        try { map.removeControl(controlRef.current); } catch (e) {}
+        try {
+          map.removeControl(controlRef.current);
+        } catch (e) {}
         controlRef.current = null;
       }
-      layersRef.current.forEach(layer => {
-        try { map.removeLayer(layer); } catch (e) {}
+      layersRef.current.forEach((layer) => {
+        try {
+          map.removeLayer(layer);
+        } catch (e) {}
       });
       layersRef.current = [];
     }
   }, [enabled, map]);
-  
+
   return { data, loading, selectedBand };
 }
 
 // Quick haversine for popup display (no need for full precision)
 function haversineApprox(lat1, lon1, lat2, lon2) {
   const R = 6371;
-  const dLat = (lat2 - lat1) * Math.PI / 180;
-  const dLon = (lon2 - lon1) * Math.PI / 180;
-  const a = Math.sin(dLat/2) * Math.sin(dLat/2) +
-    Math.cos(lat1 * Math.PI/180) * Math.cos(lat2 * Math.PI/180) *
-    Math.sin(dLon/2) * Math.sin(dLon/2);
-  return Math.round(R * 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1-a)));
+  const dLat = ((lat2 - lat1) * Math.PI) / 180;
+  const dLon = ((lon2 - lon1) * Math.PI) / 180;
+  const a =
+    Math.sin(dLat / 2) * Math.sin(dLat / 2) +
+    Math.cos((lat1 * Math.PI) / 180) * Math.cos((lat2 * Math.PI) / 180) * Math.sin(dLon / 2) * Math.sin(dLon / 2);
+  return Math.round(R * 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a)));
 }
 
 // Format distance using global units preference from config
diff --git a/src/plugins/layers/useWSPR.js b/src/plugins/layers/useWSPR.js
index 2dcc943f..a745793a 100644
--- a/src/plugins/layers/useWSPR.js
+++ b/src/plugins/layers/useWSPR.js
@@ -2,7 +2,7 @@ import { useState, useEffect, useRef } from 'react';
 
 /**
  * WSPR Propagation Heatmap Plugin v1.6.0
- * 
+ *
  * Advanced Features:
  * - Great circle curved path lines between transmitters and receivers
  * - Color-coded by signal strength (SNR)
@@ -27,7 +27,7 @@ import { useState, useEffect, useRef } from 'react';
  *   - Grid-level aggregation for heatmap
  *   - Aggregated path rendering between grid squares
  *   - Backward compatible with raw spot data
- * 
+ *
  * Data source: PSK Reporter API (WSPR mode spots)
  * Update interval: 5 minutes
  */
@@ -40,29 +40,29 @@ export const metadata = {
   category: 'propagation',
   defaultEnabled: false, // Opt-in only - uses PSKReporter HTTP API
   defaultOpacity: 0.7,
-  version: '1.6.1'
+  version: '1.6.1',
 };
 
 // Convert grid square to lat/lon
 function gridToLatLon(grid) {
   if (!grid || grid.length < 4) return null;
-  
+
   grid = grid.toUpperCase();
   const lon = (grid.charCodeAt(0) - 65) * 20 - 180;
   const lat = (grid.charCodeAt(1) - 65) * 10 - 90;
   const lon2 = parseInt(grid[2]) * 2;
   const lat2 = parseInt(grid[3]);
-  
+
   let longitude = lon + lon2 + 1;
   let latitude = lat + lat2 + 0.5;
-  
+
   if (grid.length >= 6) {
-    const lon3 = (grid.charCodeAt(4) - 65) * (2/24);
-    const lat3 = (grid.charCodeAt(5) - 65) * (1/24);
-    longitude = lon + lon2 + lon3 + (1/24);
-    latitude = lat + lat2 + lat3 + (0.5/24);
+    const lon3 = (grid.charCodeAt(4) - 65) * (2 / 24);
+    const lat3 = (grid.charCodeAt(5) - 65) * (1 / 24);
+    longitude = lon + lon2 + lon3 + 1 / 24;
+    latitude = lat + lat2 + lat3 + 0.5 / 24;
   }
-  
+
   return { lat: latitude, lon: longitude };
 }
 
@@ -78,11 +78,11 @@ function fmtDist(km) {
 // Get color based on SNR (darker colors for better visibility)
 function getSNRColor(snr) {
   if (snr === null || snr === undefined) return '#666666';
-  if (snr < -20) return '#cc0000';      // Dark red
-  if (snr < -10) return '#dd4400';      // Dark orange
-  if (snr < 0) return '#ee8800';        // Orange
-  if (snr < 5) return '#dddd00';        // Dark yellow
-  return '#00cc00';                     // Dark green
+  if (snr < -20) return '#cc0000'; // Dark red
+  if (snr < -10) return '#dd4400'; // Dark orange
+  if (snr < 0) return '#ee8800'; // Orange
+  if (snr < 5) return '#dddd00'; // Dark yellow
+  return '#00cc00'; // Dark green
 }
 
 // Get line weight based on SNR (doubled for better visibility)
@@ -99,82 +99,94 @@ function getLineWeight(snr) {
 function getGreatCirclePath(lat1, lon1, lat2, lon2, numPoints = 30) {
   // Validate input coordinates
   if (!isFinite(lat1) || !isFinite(lon1) || !isFinite(lat2) || !isFinite(lon2)) {
-    return [[lat1, lon1], [lat2, lon2]];
+    return [
+      [lat1, lon1],
+      [lat2, lon2],
+    ];
   }
-  
+
   // Check if points are very close (less than 0.5 degree)
   const deltaLat = Math.abs(lat2 - lat1);
   const deltaLon = Math.abs(lon2 - lon1);
   if (deltaLat < 0.5 && deltaLon < 0.5) {
-    return [[lat1, lon1], [lat2, lon2]];
+    return [
+      [lat1, lon1],
+      [lat2, lon2],
+    ];
   }
-  
+
   const path = [];
-  
+
   const toRad = (deg) => (deg * Math.PI) / 180;
   const toDeg = (rad) => (rad * 180) / Math.PI;
-  
+
   const lat1Rad = toRad(lat1);
   const lon1Rad = toRad(lon1);
   const lat2Rad = toRad(lat2);
   const lon2Rad = toRad(lon2);
-  
-  const cosD = Math.sin(lat1Rad) * Math.sin(lat2Rad) +
-               Math.cos(lat1Rad) * Math.cos(lat2Rad) * Math.cos(lon2Rad - lon1Rad);
-  
+
+  const cosD =
+    Math.sin(lat1Rad) * Math.sin(lat2Rad) + Math.cos(lat1Rad) * Math.cos(lat2Rad) * Math.cos(lon2Rad - lon1Rad);
+
   const d = Math.acos(Math.max(-1, Math.min(1, cosD)));
-  
+
   if (d < 0.01 || Math.abs(d - Math.PI) < 0.01) {
-    return [[lat1, lon1], [lat2, lon2]];
+    return [
+      [lat1, lon1],
+      [lat2, lon2],
+    ];
   }
-  
+
   const sinD = Math.sin(d);
-  
+
   for (let i = 0; i <= numPoints; i++) {
     const f = i / numPoints;
-    
+
     const A = Math.sin((1 - f) * d) / sinD;
     const B = Math.sin(f * d) / sinD;
-    
+
     const x = A * Math.cos(lat1Rad) * Math.cos(lon1Rad) + B * Math.cos(lat2Rad) * Math.cos(lon2Rad);
     const y = A * Math.cos(lat1Rad) * Math.sin(lon1Rad) + B * Math.cos(lat2Rad) * Math.sin(lon2Rad);
     const z = A * Math.sin(lat1Rad) + B * Math.sin(lat2Rad);
-    
+
     const lat = toDeg(Math.atan2(z, Math.sqrt(x * x + y * y)));
     const lon = toDeg(Math.atan2(y, x));
-    
+
     if (isFinite(lat) && isFinite(lon)) {
       path.push([lat, lon]);
     }
   }
-  
+
   if (path.length < 2) {
-    return [[lat1, lon1], [lat2, lon2]];
+    return [
+      [lat1, lon1],
+      [lat2, lon2],
+    ];
   }
-  
+
   return path;
 }
 
 // Calculate propagation score (0-100)
 function calculatePropagationScore(spots) {
   if (!spots || spots.length === 0) return 0;
-  
+
   const avgSNR = spots.reduce((sum, s) => sum + (s.snr || -20), 0) / spots.length;
   const pathCount = spots.length;
-  const strongSignals = spots.filter(s => s.snr > 0).length;
-  
+  const strongSignals = spots.filter((s) => s.snr > 0).length;
+
   // Score based on: average SNR (40%), path count (30%), strong signal ratio (30%)
   const snrScore = Math.max(0, Math.min(100, ((avgSNR + 20) / 25) * 40));
   const countScore = Math.min(30, (pathCount / 100) * 30);
   const strongScore = (strongSignals / pathCount) * 30;
-  
+
   return Math.round(snrScore + countScore + strongScore);
 }
 
 // Make control panel draggable with CTRL+drag and save position
 function makeDraggable(element, storageKey, skipPositionLoad = false) {
   if (!element) return;
-  
+
   // Load saved position only if not already loaded
   if (!skipPositionLoad) {
     const saved = localStorage.getItem(storageKey);
@@ -182,7 +194,7 @@ function makeDraggable(element, storageKey, skipPositionLoad = false) {
       try {
         const data = JSON.parse(saved);
         element.style.position = 'fixed';
-        
+
         // Check if saved as percentage (new format) or pixels (old format)
         if (data.topPercent !== undefined && data.leftPercent !== undefined) {
           // Use percentage-based positioning (scales with zoom)
@@ -195,7 +207,7 @@ function makeDraggable(element, storageKey, skipPositionLoad = false) {
           element.style.top = topPercent + '%';
           element.style.left = leftPercent + '%';
         }
-        
+
         element.style.right = 'auto';
         element.style.bottom = 'auto';
         element.style.transform = 'none';
@@ -210,13 +222,13 @@ function makeDraggable(element, storageKey, skipPositionLoad = false) {
       element.style.bottom = 'auto';
     }
   }
-  
+
   // Add drag hint
   element.title = 'Hold CTRL and drag to reposition';
-  
+
   let isDragging = false;
   let startX, startY, startLeft, startTop;
-  
+
   // Update cursor based on CTRL key
   const updateCursor = (e) => {
     if (e.ctrlKey) {
@@ -225,7 +237,7 @@ function makeDraggable(element, storageKey, skipPositionLoad = false) {
       element.style.cursor = 'default';
     }
   };
-  
+
   element.addEventListener('mouseenter', updateCursor);
   element.addEventListener('mousemove', updateCursor);
   document.addEventListener('keydown', (e) => {
@@ -234,53 +246,53 @@ function makeDraggable(element, storageKey, skipPositionLoad = false) {
   document.addEventListener('keyup', (e) => {
     if (e.key === 'Control') updateCursor(e);
   });
-  
-  element.addEventListener('mousedown', function(e) {
+
+  element.addEventListener('mousedown', function (e) {
     // Only allow dragging with CTRL key
     if (!e.ctrlKey) return;
-    
+
     // Only allow dragging from empty areas (not inputs/selects)
     if (e.target.tagName === 'SELECT' || e.target.tagName === 'INPUT' || e.target.tagName === 'LABEL') {
       return;
     }
-    
+
     isDragging = true;
     startX = e.clientX;
     startY = e.clientY;
     startLeft = element.offsetLeft;
     startTop = element.offsetTop;
-    
+
     element.style.cursor = 'grabbing';
     element.style.opacity = '0.8';
     e.preventDefault();
   });
-  
-  document.addEventListener('mousemove', function(e) {
+
+  document.addEventListener('mousemove', function (e) {
     if (!isDragging) return;
-    
+
     const dx = e.clientX - startX;
     const dy = e.clientY - startY;
-    
-    element.style.left = (startLeft + dx) + 'px';
-    element.style.top = (startTop + dy) + 'px';
+
+    element.style.left = startLeft + dx + 'px';
+    element.style.top = startTop + dy + 'px';
   });
-  
-  document.addEventListener('mouseup', function(e) {
+
+  document.addEventListener('mouseup', function (e) {
     if (isDragging) {
       isDragging = false;
       element.style.opacity = '1';
       updateCursor(e);
-      
+
       // Save position as percentage of viewport for zoom compatibility
       const topPercent = (element.offsetTop / window.innerHeight) * 100;
       const leftPercent = (element.offsetLeft / window.innerWidth) * 100;
-      
+
       const position = {
         topPercent,
         leftPercent,
         // Keep pixel values for backward compatibility
         top: element.offsetTop,
-        left: element.offsetLeft
+        left: element.offsetLeft,
       };
       localStorage.setItem(storageKey, JSON.stringify(position));
     }
@@ -293,9 +305,9 @@ function addMinimizeToggle(element, storageKey) {
     console.warn('[WSPR] addMinimizeToggle: element is null/undefined for', storageKey);
     return;
   }
-  
+
   const minimizeKey = storageKey + '-minimized';
-  
+
   // Create minimize button
   // Use firstElementChild instead of querySelector
   const header = element.firstElementChild;
@@ -303,16 +315,16 @@ function addMinimizeToggle(element, storageKey) {
     console.warn('[WSPR] No header found for minimize toggle on', storageKey, 'children:', element.children.length);
     return;
   }
-  
+
   console.log('[WSPR] Adding minimize toggle to', storageKey, 'header:', header.innerHTML.substring(0, 50));
-  
+
   // Wrap content (everything except header)
   const content = Array.from(element.children).slice(1);
   const contentWrapper = document.createElement('div');
   contentWrapper.className = 'wspr-panel-content';
-  content.forEach(child => contentWrapper.appendChild(child));
+  content.forEach((child) => contentWrapper.appendChild(child));
   element.appendChild(contentWrapper);
-  
+
   // Add minimize button to header
   const minimizeBtn = document.createElement('span');
   minimizeBtn.className = 'wspr-minimize-btn';
@@ -328,19 +340,19 @@ function addMinimizeToggle(element, storageKey) {
     transition: opacity 0.2s;
   `;
   minimizeBtn.title = 'Minimize/Maximize';
-  
+
   minimizeBtn.addEventListener('mouseenter', () => {
     minimizeBtn.style.opacity = '1';
   });
   minimizeBtn.addEventListener('mouseleave', () => {
     minimizeBtn.style.opacity = '0.7';
   });
-  
+
   header.style.display = 'flex';
   header.style.justifyContent = 'space-between';
   header.style.alignItems = 'center';
   header.appendChild(minimizeBtn);
-  
+
   // Load saved state
   const isMinimized = localStorage.getItem(minimizeKey) === 'true';
   if (isMinimized) {
@@ -348,14 +360,14 @@ function addMinimizeToggle(element, storageKey) {
     minimizeBtn.innerHTML = '▶';
     element.style.cursor = 'pointer';
   }
-  
+
   // Toggle function
   const toggle = (e) => {
     // Don't toggle if CTRL is held (for dragging)
     if (e && e.ctrlKey) return;
-    
+
     const isCurrentlyMinimized = contentWrapper.style.display === 'none';
-    
+
     if (isCurrentlyMinimized) {
       // Expand
       contentWrapper.style.display = 'block';
@@ -370,14 +382,14 @@ function addMinimizeToggle(element, storageKey) {
       localStorage.setItem(minimizeKey, 'true');
     }
   };
-  
+
   // Click header to toggle (except on button itself)
   header.addEventListener('click', (e) => {
     if (e.target === header || e.target.tagName === 'DIV') {
       toggle(e);
     }
   });
-  
+
   // Click button to toggle
   minimizeBtn.addEventListener('click', (e) => {
     e.stopPropagation();
@@ -390,39 +402,39 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
   const [markerLayers, setMarkerLayers] = useState([]);
   const [heatmapLayer, setHeatmapLayer] = useState(null);
   const [wsprData, setWsprData] = useState([]);
-  const [filterByGrid, setFilterByGrid] = useState(true);  // Default ON - shows activity in your grid area
+  const [filterByGrid, setFilterByGrid] = useState(true); // Default ON - shows activity in your grid area
   const [gridFilter, setGridFilter] = useState('');
-  
+
   // v1.2.0 - Advanced Filters
   const [bandFilter, setBandFilter] = useState('all');
   const [timeWindow, setTimeWindow] = useState(lowMemoryMode ? 15 : 30); // minutes - shorter in low memory
   const [snrThreshold, setSNRThreshold] = useState(-30); // dB
   const [showAnimation, setShowAnimation] = useState(!lowMemoryMode); // Disable animations in low memory mode
   const [showHeatmap, setShowHeatmap] = useState(false);
-  
+
   // Low memory mode limits
   const MAX_PATHS = lowMemoryMode ? 100 : 10000;
   const MAX_HEATMAP_POINTS = lowMemoryMode ? 50 : 500;
-  
+
   // v1.4.3 - Separate opacity controls
   const [pathOpacity, setPathOpacity] = useState(0.7);
   const [heatmapOpacity, setHeatmapOpacity] = useState(0.6);
-  
+
   // UI Controls (refs to avoid recreation)
   const legendControlRef = useRef(null);
   const statsControlRef = useRef(null);
   const filterControlRef = useRef(null);
   const chartControlRef = useRef(null);
-  
+
   const [legendControl, setLegendControl] = useState(null);
   const [statsControl, setStatsControl] = useState(null);
   const [filterControl, setFilterControl] = useState(null);
   const [chartControl, setChartControl] = useState(null);
-  
+
   const animationFrameRef = useRef(null);
 
   // Fetch WSPR data with dynamic time window and band filter
-  
+
   const stripCallsign = (call) => {
     if (!call) return '';
     return call.split(/[\/\-]/)[0].toUpperCase();
@@ -445,15 +457,17 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
         const response = await fetch(`/api/wspr/heatmap?minutes=${timeWindow}&band=${bandFilter}`);
         if (response.ok) {
           const data = await response.json();
-          
+
           // Handle new aggregated format
           if (data.format === 'aggregated' && data.grids) {
-            console.log(`[WSPR Plugin] Loaded aggregated data: ${data.uniqueGrids} grids, ${data.paths?.length || 0} paths from ${data.totalSpots} spots`);
-            
+            console.log(
+              `[WSPR Plugin] Loaded aggregated data: ${data.uniqueGrids} grids, ${data.paths?.length || 0} paths from ${data.totalSpots} spots`,
+            );
+
             // Convert aggregated grids to spot-like format for backward compatibility with rendering
             // Each grid becomes a "virtual spot" with combined TX/RX activity
             const virtualSpots = [];
-            
+
             // Create spots from grids (for heatmap rendering)
             for (const grid of data.grids) {
               // Create a virtual spot for each active grid
@@ -472,10 +486,10 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
                 txCount: grid.txCount,
                 rxCount: grid.rxCount,
                 totalActivity: grid.totalActivity,
-                isAggregated: true
+                isAggregated: true,
               });
             }
-            
+
             // Add path data for rendering propagation lines
             if (data.paths && data.paths.length > 0) {
               for (const path of data.paths) {
@@ -492,53 +506,53 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
                   band: Object.keys(path.bands).sort((a, b) => path.bands[b] - path.bands[a])[0] || 'Unknown',
                   pathCount: path.count,
                   isPath: true,
-                  isAggregated: true
+                  isAggregated: true,
                 });
               }
             }
-            
+
             // Store band activity for chart
             if (data.bandActivity) {
               virtualSpots.bandActivity = data.bandActivity;
             }
-            
+
             setWsprData(virtualSpots);
             return;
           }
-          
+
           // Legacy format handling (raw spots)
           let spots = data.spots || [];
-          
+
           // Strip suffixes from all callsigns
-          spots = spots.map(spot => {
+          spots = spots.map((spot) => {
             return {
               ...spot,
               sender: stripCallsign(spot.sender),
-              receiver: stripCallsign(spot.receiver)
+              receiver: stripCallsign(spot.receiver),
             };
           });
-          
+
           // Filter by callsign ONLY if grid filter is OFF
           if (!filterByGrid && callsign && callsign !== 'N0CALL') {
             const baseCall = stripCallsign(callsign);
             console.log(`[WSPR] Filtering for callsign: ${baseCall} (grid filter OFF)`);
-            
-            spots = spots.filter(spot => {
+
+            spots = spots.filter((spot) => {
               // Show spots where I'm TX or RX
               const isTX = spot.sender === baseCall;
               const isRX = spot.receiver === baseCall;
               return isTX || isRX;
             });
-            
+
             console.log(`[WSPR] Found ${spots.length} spots for ${baseCall} (TX or RX)`);
           } else if (filterByGrid) {
             console.log(`[WSPR] Grid filter ON - fetching ALL spots (${spots.length} total)`);
           }
-          
+
           // Convert grid squares to lat/lon if coordinates are missing
-          spots = spots.map(spot => {
+          spots = spots.map((spot) => {
             let updated = { ...spot };
-            
+
             // Convert sender grid to lat/lon if missing
             if ((!spot.senderLat || !spot.senderLon) && spot.senderGrid) {
               const loc = gridToLatLon(spot.senderGrid);
@@ -547,7 +561,7 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
                 updated.senderLon = loc.lon;
               }
             }
-            
+
             // Convert receiver grid to lat/lon if missing
             if ((!spot.receiverLat || !spot.receiverLon) && spot.receiverGrid) {
               const loc = gridToLatLon(spot.receiverGrid);
@@ -556,10 +570,10 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
                 updated.receiverLon = loc.lon;
               }
             }
-            
+
             return updated;
           });
-          
+
           setWsprData(spots);
           console.log(`[WSPR Plugin] Loaded ${spots.length} raw spots (${timeWindow}min, band: ${bandFilter})`);
         }
@@ -577,11 +591,12 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
   // Create UI controls once (v1.2.0+)
   useEffect(() => {
     if (!enabled || !map) return;
-    if (filterControlRef.current || statsControlRef.current || legendControlRef.current || chartControlRef.current) return;
+    if (filterControlRef.current || statsControlRef.current || legendControlRef.current || chartControlRef.current)
+      return;
 
     const FilterControl = L.Control.extend({
       options: { position: 'topright' },
-      onAdd: function() {
+      onAdd: function () {
         const container = L.DomUtil.create('div', 'wspr-filter-control');
         container.style.cssText = `
           background: var(--bg-panel);
@@ -594,7 +609,7 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
           box-shadow: 0 2px 8px rgba(0,0,0,0.3);
           min-width: 180px;
         `;
-        
+
         container.innerHTML = `
           <div style="font-weight: bold; margin-bottom: 8px; font-size: 12px;">🎛️ Filters</div>
           
@@ -674,20 +689,20 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
             </div>
           </div>
         `;
-        
+
         // Prevent map events from propagating
         L.DomEvent.disableClickPropagation(container);
         L.DomEvent.disableScrollPropagation(container);
-        
+
         return container;
-      }
+      },
     });
-    
+
     const control = new FilterControl();
     map.addControl(control);
     filterControlRef.current = control;
     setFilterControl(control);
-    
+
     // Make control draggable after it's added to DOM
     setTimeout(() => {
       const container = document.querySelector('.wspr-filter-control');
@@ -704,12 +719,12 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
             container.style.bottom = 'auto';
           } catch (e) {}
         }
-        
+
         makeDraggable(container, 'wspr-filter-position');
         addMinimizeToggle(container, 'wspr-filter-position');
       }
     }, 150);
-    
+
     // Add event listeners after control is added
     setTimeout(() => {
       const bandSelect = document.getElementById('wspr-band-filter');
@@ -724,7 +739,7 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
       const heatCheck = document.getElementById('wspr-heatmap');
       const gridFilterCheck = document.getElementById('wspr-grid-filter');
       const gridInput = document.getElementById('wspr-grid-input');
-      
+
       if (bandSelect) bandSelect.addEventListener('change', (e) => setBandFilter(e.target.value));
       if (timeSelect) timeSelect.addEventListener('change', (e) => setTimeWindow(parseInt(e.target.value)));
       if (snrSlider) {
@@ -748,14 +763,16 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
         });
       }
       if (animCheck) animCheck.addEventListener('change', (e) => setShowAnimation(e.target.checked));
-      if (heatCheck) heatCheck.addEventListener('change', (e) => {
-        console.log('[WSPR] Heatmap toggle:', e.target.checked);
-        setShowHeatmap(e.target.checked);
-      });
-      if (gridFilterCheck) gridFilterCheck.addEventListener('change', (e) => {
-        setFilterByGrid(e.target.checked);
-        console.log('[WSPR] Grid filter toggle:', e.target.checked);
-      });
+      if (heatCheck)
+        heatCheck.addEventListener('change', (e) => {
+          console.log('[WSPR] Heatmap toggle:', e.target.checked);
+          setShowHeatmap(e.target.checked);
+        });
+      if (gridFilterCheck)
+        gridFilterCheck.addEventListener('change', (e) => {
+          setFilterByGrid(e.target.checked);
+          console.log('[WSPR] Grid filter toggle:', e.target.checked);
+        });
       if (gridInput) {
         gridInput.addEventListener('input', (e) => {
           const value = e.target.value.toUpperCase().substring(0, 6);
@@ -765,11 +782,11 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
         });
       }
     }, 100);
-    
+
     // Create stats control
     const StatsControl = L.Control.extend({
       options: { position: 'topleft' },
-      onAdd: function() {
+      onAdd: function () {
         const div = L.DomUtil.create('div', 'wspr-stats');
         div.style.cssText = `
           background: var(--bg-panel);
@@ -794,20 +811,20 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
           <div>Total: <span style="color: var(--accent-green);">0</span></div>
           <div style="margin-top: 6px; font-size: 10px; opacity: 0.7;">Initializing...</div>
         `;
-        
+
         // Prevent map interaction when clicking/dragging on this control
         L.DomEvent.disableClickPropagation(div);
         L.DomEvent.disableScrollPropagation(div);
-        
+
         return div;
-      }
+      },
     });
-    
+
     const stats = new StatsControl();
     map.addControl(stats);
     statsControlRef.current = stats;
     setStatsControl(stats);
-    
+
     setTimeout(() => {
       const container = document.querySelector('.wspr-stats');
       if (container) {
@@ -823,16 +840,16 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
             container.style.bottom = 'auto';
           } catch (e) {}
         }
-        
+
         makeDraggable(container, 'wspr-stats-position');
         addMinimizeToggle(container, 'wspr-stats-position');
       }
     }, 150);
-    
+
     // Create legend control
     const LegendControl = L.Control.extend({
       options: { position: 'bottomright' },
-      onAdd: function() {
+      onAdd: function () {
         const div = L.DomUtil.create('div', 'wspr-legend');
         div.style.cssText = `
           background: var(--bg-panel);
@@ -856,13 +873,13 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
           </div>
         `;
         return div;
-      }
+      },
     });
     const legend = new LegendControl();
     map.addControl(legend);
     legendControlRef.current = legend;
     setLegendControl(legend);
-    
+
     setTimeout(() => {
       const container = document.querySelector('.wspr-legend');
       if (container) {
@@ -878,16 +895,16 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
             container.style.bottom = 'auto';
           } catch (e) {}
         }
-        
+
         makeDraggable(container, 'wspr-legend-position');
         addMinimizeToggle(container, 'wspr-legend-position');
       }
     }, 150);
-    
+
     // Create band chart control
     const ChartControl = L.Control.extend({
       options: { position: 'bottomleft' },
-      onAdd: function() {
+      onAdd: function () {
         const div = L.DomUtil.create('div', 'wspr-chart');
         div.style.cssText = `
           background: var(--bg-panel);
@@ -900,21 +917,22 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
           box-shadow: 0 2px 8px rgba(0,0,0,0.3);
           min-width: 160px;
         `;
-        div.innerHTML = '<div style="font-weight: bold; margin-bottom: 6px; font-size: 11px;">📊 Band Activity</div><div style="opacity: 0.7;">Loading...</div>';
-        
+        div.innerHTML =
+          '<div style="font-weight: bold; margin-bottom: 6px; font-size: 11px;">📊 Band Activity</div><div style="opacity: 0.7;">Loading...</div>';
+
         // Prevent map interaction when clicking/dragging on this control
         L.DomEvent.disableClickPropagation(div);
         L.DomEvent.disableScrollPropagation(div);
-        
+
         return div;
-      }
+      },
     });
-    
+
     const chart = new ChartControl();
     map.addControl(chart);
     chartControlRef.current = chart;
     setChartControl(chart);
-    
+
     setTimeout(() => {
       const container = document.querySelector('.wspr-chart');
       if (container) {
@@ -930,14 +948,13 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
             container.style.bottom = 'auto';
           } catch (e) {}
         }
-        
+
         makeDraggable(container, 'wspr-chart-position');
         addMinimizeToggle(container, 'wspr-chart-position');
       }
     }, 150);
-    
+
     console.log('[WSPR] All controls created once');
-    
   }, [enabled, map]);
 
   // Render WSPR paths and markers
@@ -945,11 +962,15 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
     if (!map || typeof L === 'undefined') return;
 
     // Clear old layers
-    pathLayers.forEach(layer => {
-      try { map.removeLayer(layer); } catch (e) {}
+    pathLayers.forEach((layer) => {
+      try {
+        map.removeLayer(layer);
+      } catch (e) {}
     });
-    markerLayers.forEach(layer => {
-      try { map.removeLayer(layer); } catch (e) {}
+    markerLayers.forEach((layer) => {
+      try {
+        map.removeLayer(layer);
+      } catch (e) {}
     });
     setPathLayers([]);
     setMarkerLayers([]);
@@ -960,115 +981,124 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
     const newMarkers = [];
     const txStations = new Set();
     const rxStations = new Set();
-    
+
     // Filter by SNR threshold and grid square OR callsign
-    let filteredData = wsprData.filter(spot => {
+    let filteredData = wsprData.filter((spot) => {
       // SNR filter
       if ((spot.snr || -30) < snrThreshold) return false;
-      
+
       // Grid square filter (if enabled AND grid is set) - show spots in/around that grid
       if (filterByGrid && gridFilter && gridFilter.length >= 2) {
         const gridUpper = gridFilter.toUpperCase();
         const senderGrid = spot.senderGrid ? spot.senderGrid.toUpperCase() : '';
         const receiverGrid = spot.receiverGrid ? spot.receiverGrid.toUpperCase() : '';
-        
+
         // Match prefix: FN matches FN03, FN02, FN21, etc.
         const senderMatch = senderGrid.startsWith(gridUpper);
         const receiverMatch = receiverGrid.startsWith(gridUpper);
-        
+
         // Show if either TX or RX matches the grid prefix
         return senderMatch || receiverMatch;
       }
-      
+
       // If grid filter is ON but no grid set, show ALL spots (don't filter)
       if (filterByGrid && (!gridFilter || gridFilter.length < 2)) {
         return true;
       }
-      
+
       // If grid filter is OFF, filter by callsign (TX/RX involving your station)
       if (!filterByGrid && callsign && callsign !== 'N0CALL') {
         const baseCallsign = callsign.split(/[\/\-]/)[0].toUpperCase();
         const senderBase = (spot.sender || '').split(/[\/\-]/)[0].toUpperCase();
         const receiverBase = (spot.receiver || '').split(/[\/\-]/)[0].toUpperCase();
-        
+
         // Show only if your callsign is TX or RX
         return senderBase === baseCallsign || receiverBase === baseCallsign;
       }
-      
+
       // If no callsign and no grid filter, show all
       return true;
     });
-    
-    console.log(`[WSPR Paths] Filtering: filterByGrid=${filterByGrid}, gridFilter="${gridFilter}", callsign="${callsign}", input=${wsprData.length}, output=${filteredData.length}`);
-    
+
+    console.log(
+      `[WSPR Paths] Filtering: filterByGrid=${filterByGrid}, gridFilter="${gridFilter}", callsign="${callsign}", input=${wsprData.length}, output=${filteredData.length}`,
+    );
+
     // For aggregated data, only render actual paths (items with both sender and receiver coords)
-    const pathData = filteredData.filter(spot => spot.isPath || (!spot.isAggregated && spot.receiverLat && spot.receiverLon));
-    
+    const pathData = filteredData.filter(
+      (spot) => spot.isPath || (!spot.isAggregated && spot.receiverLat && spot.receiverLon),
+    );
+
     // Debug: Log grid squares when filter is enabled
     if (filterByGrid && gridFilter && filteredData.length > 0) {
       const grids = new Set();
-      filteredData.slice(0, 5).forEach(spot => {
+      filteredData.slice(0, 5).forEach((spot) => {
         if (spot.senderGrid) grids.add(spot.senderGrid.substring(0, 4));
         if (spot.receiverGrid) grids.add(spot.receiverGrid.substring(0, 4));
       });
-      console.log(`[WSPR Grid] Filtering for ${gridFilter}, found ${filteredData.length} spots with grids:`, Array.from(grids).join(', '));
+      console.log(
+        `[WSPR Grid] Filtering for ${gridFilter}, found ${filteredData.length} spots with grids:`,
+        Array.from(grids).join(', '),
+      );
     } else if (filterByGrid && gridFilter && filteredData.length === 0) {
       // Log what grids ARE available
       const availableGrids = new Set();
-      wsprData.slice(0, 10).forEach(spot => {
+      wsprData.slice(0, 10).forEach((spot) => {
         if (spot.senderGrid) availableGrids.add(spot.senderGrid.substring(0, 4));
         if (spot.receiverGrid) availableGrids.add(spot.receiverGrid.substring(0, 4));
       });
-      console.log(`[WSPR Grid] No matches for ${gridFilter}. Available grids in data:`, Array.from(availableGrids).join(', '));
+      console.log(
+        `[WSPR Grid] No matches for ${gridFilter}. Available grids in data:`,
+        Array.from(availableGrids).join(', '),
+      );
     }
     const limitedData = pathData.slice(0, MAX_PATHS); // Limit paths based on memory mode
-    
+
     // Find best DX paths (longest distance, good SNR)
     const bestPaths = limitedData
-      .map(spot => {
+      .map((spot) => {
         const dist = Math.sqrt(
-          Math.pow(spot.receiverLat - spot.senderLat, 2) +
-          Math.pow(spot.receiverLon - spot.senderLon, 2)
+          Math.pow(spot.receiverLat - spot.senderLat, 2) + Math.pow(spot.receiverLon - spot.senderLon, 2),
         );
         return { ...spot, distance: dist };
       })
-      .filter(s => s.snr > 0)
+      .filter((s) => s.snr > 0)
       .sort((a, b) => b.distance - a.distance)
       .slice(0, 10);
-    
-    const bestPathSet = new Set(bestPaths.map(p => `${p.sender}-${p.receiver}`));
 
-    limitedData.forEach(spot => {
+    const bestPathSet = new Set(bestPaths.map((p) => `${p.sender}-${p.receiver}`));
+
+    limitedData.forEach((spot) => {
       // Validate coordinates
       if (!spot.senderLat || !spot.senderLon || !spot.receiverLat || !spot.receiverLon) {
         return;
       }
-      
+
       const sLat = parseFloat(spot.senderLat);
       const sLon = parseFloat(spot.senderLon);
       const rLat = parseFloat(spot.receiverLat);
       const rLon = parseFloat(spot.receiverLon);
-      
+
       if (!isFinite(sLat) || !isFinite(sLon) || !isFinite(rLat) || !isFinite(rLon)) {
         return;
       }
-      
+
       // Calculate great circle path
       const pathCoords = getGreatCirclePath(sLat, sLon, rLat, rLon, 30);
-      
+
       if (!pathCoords || pathCoords.length < 2) {
         return;
       }
-      
+
       // Check if this is a best DX path
       const isBestPath = bestPathSet.has(`${spot.sender}-${spot.receiver}`);
-      
+
       const path = L.polyline(pathCoords, {
         color: isBestPath ? '#00ffff' : getSNRColor(spot.snr),
         weight: isBestPath ? 4 : getLineWeight(spot.snr),
         opacity: pathOpacity * (isBestPath ? 0.9 : 0.6),
         smoothFactor: 1,
-        className: showAnimation ? 'wspr-animated-path' : ''
+        className: showAnimation ? 'wspr-animated-path' : '',
       });
 
       const snrStr = spot.snr !== null ? `${spot.snr} dB` : 'N/A';
@@ -1080,13 +1110,15 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
       const txAzStr = spot.senderAz !== null ? `${spot.senderAz}°` : 'N/A';
       const rxAzStr = spot.receiverAz !== null ? `${spot.receiverAz}°` : 'N/A';
       const spotQStr = spot.snr && spot.distance ? Math.round(spot.distance / Math.pow(10, spot.snr / 10)) : null;
-      
+
       path.bindPopup(`
         <div style="font-family: 'JetBrains Mono', monospace; min-width: 240px;">
           <div style="font-size: 13px; font-weight: bold; color: ${getSNRColor(spot.snr)}; margin-bottom: 8px; text-align: center;">
             ${spot.sender} ⇢ ${spot.receiver}
           </div>
-          ${spot.isAggregated ? `
+          ${
+            spot.isAggregated
+              ? `
           <div style="font-size: 11px; text-align: center; margin-bottom: 8px; color: #00ccff;">
             ${spot.pathCount || 1} propagation paths
           </div>
@@ -1095,7 +1127,8 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
             <tr><td style="opacity: 0.7;">Avg SNR:</td><td style="color: ${getSNRColor(spot.snr)}; font-weight: bold;">${spot.snr !== null ? spot.snr + ' dB' : 'N/A'}</td></tr>
             <tr><td style="opacity: 0.7;">Path Count:</td><td><b>${spot.pathCount || 1}</b></td></tr>
           </table>
-          ` : `
+          `
+              : `
           <div style="font-size: 10px; opacity: 0.7; text-align: center; margin-bottom: 8px;">
             ${ageStr}
           </div>
@@ -1111,7 +1144,8 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
             <tr><td style="opacity: 0.7;">Az TX:</td><td><b>${txAzStr}</b></td></tr>
             <tr><td style="opacity: 0.7;">Az RX:</td><td><b>${rxAzStr}</b></td></tr>
           </table>
-          `}
+          `
+          }
         </div>
       `);
 
@@ -1128,7 +1162,7 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
           color: '#ffffff',
           weight: 1.5,
           fillOpacity: pathOpacity * 0.9,
-          opacity: pathOpacity
+          opacity: pathOpacity,
         });
         // Build detailed tooltip for TX
         let txDetails = `
@@ -1137,24 +1171,24 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
             <div style="margin-bottom: 6px;"><b style="font-size: 13px;">${spot.sender}</b> ⇢ <b style="font-size: 13px;">${spot.receiver}</b></div>
             <div style="opacity: 0.7; margin-bottom: 8px;">Grid: ${spot.senderGrid}</div>
         `;
-        
+
         // Add frequency and band
         if (spot.freqMHz) {
           txDetails += `<div><b>${spot.freqMHz} MHz</b> (${spot.band || 'Unknown'})</div>`;
         }
-        
+
         // Add power if available
         if (spot.power !== null && spot.power !== undefined) {
           const powerDbm = spot.powerDbm !== null ? ` (${spot.powerDbm.toFixed(1)} dBm)` : '';
           txDetails += `<div>Power: <b>${spot.power} W</b>${powerDbm}</div>`;
         }
-        
+
         // Add SNR
         if (spot.snr !== null && spot.snr !== undefined) {
           const snrColor = spot.snr > 0 ? '#00cc00' : spot.snr > -10 ? '#ffaa00' : '#ff6600';
           txDetails += `<div>SNR: <b style="color: ${snrColor};">${spot.snr} dB</b></div>`;
         }
-        
+
         // Add distance and efficiency
         if (spot.distance) {
           txDetails += `<div>Distance: <b>${fmtDist(spot.distance)}</b></div>`;
@@ -1162,24 +1196,24 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
             txDetails += `<div>Efficiency: <b>${fmtDist(spot.kPerW)}/W</b></div>`;
           }
         }
-        
+
         // Add azimuth
         if (spot.senderAz !== null) {
           txDetails += `<div>Azimuth: <b>${spot.senderAz}°</b></div>`;
         }
-        
+
         // Add drift if available
         if (spot.drift !== null && spot.drift !== undefined) {
           txDetails += `<div>Drift: ${spot.drift} Hz</div>`;
         }
-        
+
         // Add timestamp
         if (spot.timestamp) {
           const date = new Date(spot.timestamp);
           const timeStr = date.toLocaleString();
           txDetails += `<div style="margin-top: 6px; font-size: 10px; opacity: 0.6;">${timeStr}</div>`;
         }
-        
+
         txDetails += `</div>`;
         txMarker.bindPopup(txDetails);
         txMarker.addTo(map);
@@ -1195,7 +1229,7 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
           color: '#ffffff',
           weight: 1.5,
           fillOpacity: pathOpacity * 0.9,
-          opacity: pathOpacity
+          opacity: pathOpacity,
         });
         // Build detailed tooltip for RX
         let rxDetails = `
@@ -1204,24 +1238,24 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
             <div style="margin-bottom: 6px;"><b style="font-size: 13px;">${spot.sender}</b> ⇢ <b style="font-size: 13px;">${spot.receiver}</b></div>
             <div style="opacity: 0.7; margin-bottom: 8px;">Grid: ${spot.receiverGrid}</div>
         `;
-        
+
         // Add frequency and band
         if (spot.freqMHz) {
           rxDetails += `<div><b>${spot.freqMHz} MHz</b> (${spot.band || 'Unknown'})</div>`;
         }
-        
+
         // Add power if available
         if (spot.power !== null && spot.power !== undefined) {
           const powerDbm = spot.powerDbm !== null ? ` (${spot.powerDbm.toFixed(1)} dBm)` : '';
           rxDetails += `<div>Power: <b>${spot.power} W</b>${powerDbm}</div>`;
         }
-        
+
         // Add SNR
         if (spot.snr !== null && spot.snr !== undefined) {
           const snrColor = spot.snr > 0 ? '#00cc00' : spot.snr > -10 ? '#ffaa00' : '#ff6600';
           rxDetails += `<div>SNR: <b style="color: ${snrColor};">${spot.snr} dB</b></div>`;
         }
-        
+
         // Add distance and efficiency
         if (spot.distance) {
           rxDetails += `<div>Distance: <b>${fmtDist(spot.distance)}</b></div>`;
@@ -1229,24 +1263,24 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
             rxDetails += `<div>Efficiency: <b>${fmtDist(spot.kPerW)}/W</b></div>`;
           }
         }
-        
+
         // Add azimuth
         if (spot.receiverAz !== null) {
           rxDetails += `<div>Azimuth: <b>${spot.receiverAz}°</b></div>`;
         }
-        
+
         // Add drift if available
         if (spot.drift !== null && spot.drift !== undefined) {
           rxDetails += `<div>Drift: ${spot.drift} Hz</div>`;
         }
-        
+
         // Add timestamp
         if (spot.timestamp) {
           const date = new Date(spot.timestamp);
           const timeStr = date.toLocaleString();
           rxDetails += `<div style="margin-top: 6px; font-size: 10px; opacity: 0.6;">${timeStr}</div>`;
         }
-        
+
         rxDetails += `</div>`;
         rxMarker.bindPopup(rxDetails);
         rxMarker.addTo(map);
@@ -1256,12 +1290,12 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
 
     setPathLayers(newPaths);
     setMarkerLayers(newMarkers);
-    
+
     // Update stats content only (don't recreate control)
     const propScore = calculatePropagationScore(limitedData);
     const scoreColor = propScore > 70 ? '#00ff00' : propScore > 40 ? '#ffaa00' : '#ff6600';
     const totalStations = txStations.size + rxStations.size;
-    
+
     // Update existing stats panel content if it exists
     setTimeout(() => {
       const statsContainer = document.querySelector('.wspr-stats');
@@ -1277,7 +1311,7 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
           <div>Total: <span style="color: var(--accent-green);">${totalStations}</span></div>
           <div style="margin-top: 6px; font-size: 10px; opacity: 0.7;">Last ${timeWindow} min</div>
         `;
-        
+
         // Check if minimize toggle has been added (content is wrapped)
         const contentWrapper = statsContainer.querySelector('.wspr-panel-content');
         if (contentWrapper) {
@@ -1292,19 +1326,19 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
         }
       }
     }, 50);
-    
+
     // Update band chart content if it exists
     setTimeout(() => {
       const chartContainer = document.querySelector('.wspr-chart');
       if (chartContainer && limitedData.length > 0 && enabled) {
         const bandCounts = {};
-        limitedData.forEach(spot => {
+        limitedData.forEach((spot) => {
           const band = spot.band || 'Unknown';
           bandCounts[band] = (bandCounts[band] || 0) + 1;
         });
-        
+
         let chartContentHTML = '';
-        
+
         Object.entries(bandCounts)
           .sort((a, b) => b[1] - a[1])
           .slice(0, 8)
@@ -1323,7 +1357,7 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
               </div>
             `;
           });
-        
+
         // Check if minimize toggle has been added (content is wrapped)
         const contentWrapper = chartContainer.querySelector('.wspr-panel-content');
         if (contentWrapper) {
@@ -1338,15 +1372,21 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
         }
       }
     }, 50);
-    
-    console.log(`[WSPR Plugin] Rendered ${newPaths.length} paths, ${newMarkers.length} markers, ${bestPaths.length} best DX`);
+
+    console.log(
+      `[WSPR Plugin] Rendered ${newPaths.length} paths, ${newMarkers.length} markers, ${bestPaths.length} best DX`,
+    );
 
     return () => {
-      newPaths.forEach(layer => {
-        try { map.removeLayer(layer); } catch (e) {}
+      newPaths.forEach((layer) => {
+        try {
+          map.removeLayer(layer);
+        } catch (e) {}
       });
-      newMarkers.forEach(layer => {
-        try { map.removeLayer(layer); } catch (e) {}
+      newMarkers.forEach((layer) => {
+        try {
+          map.removeLayer(layer);
+        } catch (e) {}
       });
     };
   }, [enabled, wsprData, map, pathOpacity, snrThreshold, showAnimation, timeWindow, filterByGrid, gridFilter]);
@@ -1354,7 +1394,7 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
   // Render heatmap overlay (v1.4.0)
   useEffect(() => {
     if (!map || typeof L === 'undefined') return;
-    
+
     // Remove existing heatmap
     if (heatmapLayer && map) {
       try {
@@ -1362,147 +1402,152 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
       } catch (e) {}
       setHeatmapLayer(null);
     }
-    
+
     if (!enabled || !showHeatmap || wsprData.length === 0) return;
-    
+
     console.log('[WSPR] Rendering heatmap with', wsprData.length, 'spots');
-    
+
     // Create heatmap circles for all TX and RX stations
     const heatPoints = [];
     const stationCounts = {};
-    
+
     // Filter by SNR threshold and grid square OR callsign
-    let filteredData = wsprData.filter(spot => {
+    let filteredData = wsprData.filter((spot) => {
       // SNR filter
       if ((spot.snr || -30) < snrThreshold) return false;
-      
+
       // Grid square filter (if enabled AND grid is set) - show spots in/around that grid
       if (filterByGrid && gridFilter && gridFilter.length >= 2) {
         const gridUpper = gridFilter.toUpperCase();
         const senderGrid = spot.senderGrid ? spot.senderGrid.toUpperCase() : '';
         const receiverGrid = spot.receiverGrid ? spot.receiverGrid.toUpperCase() : '';
-        
+
         // Match prefix: FN matches FN03, FN02, FN21, etc.
         const senderMatch = senderGrid.startsWith(gridUpper);
         const receiverMatch = receiverGrid.startsWith(gridUpper);
-        
+
         // Show if either TX or RX matches the grid prefix
         return senderMatch || receiverMatch;
       }
-      
+
       // If grid filter is ON but no grid set, show ALL spots (don't filter)
       if (filterByGrid && (!gridFilter || gridFilter.length < 2)) {
         return true;
       }
-      
+
       // If grid filter is OFF, filter by callsign (TX/RX involving your station)
       if (!filterByGrid && callsign && callsign !== 'N0CALL') {
         const baseCallsign = callsign.split(/[\/\-]/)[0].toUpperCase();
         const senderBase = (spot.sender || '').split(/[\/\-]/)[0].toUpperCase();
         const receiverBase = (spot.receiver || '').split(/[\/\-]/)[0].toUpperCase();
-        
+
         // Show only if your callsign is TX or RX
         return senderBase === baseCallsign || receiverBase === baseCallsign;
       }
-      
+
       // If no callsign and no grid filter, show all
       return true;
     });
-    
-    console.log(`[WSPR Heatmap] Filtering: filterByGrid=${filterByGrid}, gridFilter="${gridFilter}", input=${wsprData.length}, output=${filteredData.length}`);
-    
+
+    console.log(
+      `[WSPR Heatmap] Filtering: filterByGrid=${filterByGrid}, gridFilter="${gridFilter}", input=${wsprData.length}, output=${filteredData.length}`,
+    );
+
     // For aggregated data, grids already have activity counts
-    const hasAggregatedData = filteredData.some(spot => spot.isAggregated && spot.totalActivity);
-    
+    const hasAggregatedData = filteredData.some((spot) => spot.isAggregated && spot.totalActivity);
+
     if (hasAggregatedData) {
       // Use pre-aggregated grid data
-      filteredData.forEach(spot => {
+      filteredData.forEach((spot) => {
         // Only process grid spots (not paths)
         if (!spot.isPath && spot.senderLat && spot.senderLon && spot.totalActivity) {
           const sLat = parseFloat(spot.senderLat);
           const sLon = parseFloat(spot.senderLon);
-          
+
           if (!isFinite(sLat) || !isFinite(sLon)) return;
-          
+
           const key = spot.senderGrid || `${sLat.toFixed(1)},${sLon.toFixed(1)}`;
           stationCounts[key] = spot.totalActivity;
-          heatPoints.push({ 
-            lat: sLat, 
-            lon: sLon, 
-            key: key, 
+          heatPoints.push({
+            lat: sLat,
+            lon: sLon,
+            key: key,
             grid: spot.senderGrid,
             stationCount: spot.stationCount,
             txCount: spot.txCount,
-            rxCount: spot.rxCount
+            rxCount: spot.rxCount,
           });
         }
       });
       console.log(`[WSPR Heatmap] Using aggregated data: ${heatPoints.length} grid squares`);
     } else {
       // Legacy: count activity from individual spots
-      filteredData.forEach(spot => {
+      filteredData.forEach((spot) => {
         if (!spot.senderLat || !spot.senderLon || !spot.receiverLat || !spot.receiverLon) return;
-        
+
         const sLat = parseFloat(spot.senderLat);
         const sLon = parseFloat(spot.senderLon);
         const rLat = parseFloat(spot.receiverLat);
         const rLon = parseFloat(spot.receiverLon);
-        
+
         if (!isFinite(sLat) || !isFinite(sLon) || !isFinite(rLat) || !isFinite(rLon)) return;
-        
+
         // Count activity at each location
         const txKey = `${sLat.toFixed(1)},${sLon.toFixed(1)}`;
         const rxKey = `${rLat.toFixed(1)},${rLon.toFixed(1)}`;
-        
+
         stationCounts[txKey] = (stationCounts[txKey] || 0) + 1;
         stationCounts[rxKey] = (stationCounts[rxKey] || 0) + 1;
-        
+
         heatPoints.push({ lat: sLat, lon: sLon, key: txKey });
         heatPoints.push({ lat: rLat, lon: rLon, key: rxKey });
       });
     }
-    
+
     // Create gradient circles for heatmap
     const heatCircles = [];
     const uniquePoints = {};
-    
-    heatPoints.forEach(point => {
+
+    heatPoints.forEach((point) => {
       if (!uniquePoints[point.key]) {
-        uniquePoints[point.key] = { 
-          lat: point.lat, 
-          lon: point.lon, 
+        uniquePoints[point.key] = {
+          lat: point.lat,
+          lon: point.lon,
           count: stationCounts[point.key],
           grid: point.grid,
           stationCount: point.stationCount,
           txCount: point.txCount,
-          rxCount: point.rxCount
+          rxCount: point.rxCount,
         };
       }
     });
-    
-    Object.values(uniquePoints).forEach(point => {
+
+    Object.values(uniquePoints).forEach((point) => {
       const intensity = Math.min(point.count / 10, 1); // Normalize to 0-1
-      
+
       // Color based on activity level
       let color;
-      if (intensity > 0.7) color = '#ff0000'; // Red - very hot
-      else if (intensity > 0.5) color = '#ff6600'; // Orange - hot
-      else if (intensity > 0.3) color = '#ffaa00'; // Yellow - warm
+      if (intensity > 0.7)
+        color = '#ff0000'; // Red - very hot
+      else if (intensity > 0.5)
+        color = '#ff6600'; // Orange - hot
+      else if (intensity > 0.3)
+        color = '#ffaa00'; // Yellow - warm
       else color = '#00aaff'; // Blue - cool
-      
+
       // Create focused heatmap spots (tighter, station-specific)
-      const baseRadius = 8 + (intensity * 15); // 8-23 pixels (even bigger!)
+      const baseRadius = 8 + intensity * 15; // 8-23 pixels (even bigger!)
       const numLayers = 4; // More layers for intense glow
-      
+
       for (let i = 0; i < numLayers; i++) {
         const layerRadius = baseRadius * (1.6 - i * 0.25); // Even bigger glow
         // VERY HIGH base opacity: 0.75-1.0 range, less penalty per layer
         const layerOpacity = (0.75 + intensity * 0.25) * (1 - i * 0.15) * heatmapOpacity;
-        
+
         // Small offset for glow effect
         const offsetLat = point.lat + (Math.random() - 0.5) * 0.01;
         const offsetLon = point.lon + (Math.random() - 0.5) * 0.01;
-        
+
         const circle = L.circle([offsetLat, offsetLon], {
           radius: layerRadius * 6000, // Much bigger for high visibility!
           fillColor: color,
@@ -1510,12 +1555,13 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
           color: color,
           weight: 0,
           opacity: 0,
-          className: 'wspr-heatmap-cloud' // For CSS blur
+          className: 'wspr-heatmap-cloud', // For CSS blur
         });
-        
+
         // Only add popup to the first (largest) circle
         if (i === 0) {
-          const popupContent = point.grid ? `
+          const popupContent = point.grid
+            ? `
             <div style="font-family: 'JetBrains Mono', monospace;">
               <b>🔥 Grid: ${point.grid}</b><br>
               Total Activity: ${point.count}<br>
@@ -1523,7 +1569,8 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
               ${point.txCount ? `TX: ${point.txCount} | RX: ${point.rxCount || 0}<br>` : ''}
               Lat: ${point.lat.toFixed(2)} | Lon: ${point.lon.toFixed(2)}
             </div>
-          ` : `
+          `
+            : `
             <div style="font-family: 'JetBrains Mono', monospace;">
               <b>🔥 Activity Hot Spot</b><br>
               Stations: ${point.count}<br>
@@ -1533,20 +1580,20 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
           `;
           circle.bindPopup(popupContent);
         }
-        
+
         circle.addTo(map);
         heatCircles.push(circle);
       }
     });
-    
+
     // Store as layer group
     const heatGroup = L.layerGroup(heatCircles);
     setHeatmapLayer(heatGroup);
-    
+
     console.log(`[WSPR] Heatmap rendered with ${Object.keys(uniquePoints).length} hot spots`);
-    
+
     return () => {
-      heatCircles.forEach(circle => {
+      heatCircles.forEach((circle) => {
         try {
           map.removeLayer(circle);
         } catch (e) {}
@@ -1558,15 +1605,15 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
   useEffect(() => {
     if (!enabled && map) {
       // Only log once and check if controls actually exist before attempting removal
-      const hasControls = filterControlRef.current || legendControlRef.current || 
-                          statsControlRef.current || chartControlRef.current;
-      
+      const hasControls =
+        filterControlRef.current || legendControlRef.current || statsControlRef.current || chartControlRef.current;
+
       if (!hasControls) {
         return; // Nothing to clean up
       }
-      
+
       console.log('[WSPR] Plugin disabled - cleaning up all controls and layers');
-      
+
       // Remove filter control
       if (filterControlRef.current) {
         try {
@@ -1578,7 +1625,7 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
         filterControlRef.current = null;
         setFilterControl(null);
       }
-      
+
       // Remove legend control
       if (legendControlRef.current) {
         try {
@@ -1590,7 +1637,7 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
         legendControlRef.current = null;
         setLegendControl(null);
       }
-      
+
       // Remove stats control
       if (statsControlRef.current) {
         try {
@@ -1602,7 +1649,7 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
         statsControlRef.current = null;
         setStatsControl(null);
       }
-      
+
       // Remove chart control
       if (chartControlRef.current) {
         try {
@@ -1614,7 +1661,7 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
         chartControlRef.current = null;
         setChartControl(null);
       }
-      
+
       // Remove heatmap layer
       if (heatmapLayer) {
         try {
@@ -1625,13 +1672,17 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
         }
         setHeatmapLayer(null);
       }
-      
+
       // Clear all paths and markers - use refs to avoid infinite loop
-      pathLayers.forEach(layer => {
-        try { map.removeLayer(layer); } catch (e) {}
+      pathLayers.forEach((layer) => {
+        try {
+          map.removeLayer(layer);
+        } catch (e) {}
       });
-      markerLayers.forEach(layer => {
-        try { map.removeLayer(layer); } catch (e) {}
+      markerLayers.forEach((layer) => {
+        try {
+          map.removeLayer(layer);
+        } catch (e) {}
       });
       setPathLayers([]);
       setMarkerLayers([]);
@@ -1642,7 +1693,7 @@ export function useLayer({ enabled = false, opacity = 0.7, map = null, callsign,
     paths: pathLayers,
     markers: markerLayers,
     spotCount: wsprData.length,
-    filteredCount: wsprData.filter(s => (s.snr || -30) >= snrThreshold).length,
-    filters: { bandFilter, timeWindow, snrThreshold, showAnimation, showHeatmap, pathOpacity, heatmapOpacity }
+    filteredCount: wsprData.filter((s) => (s.snr || -30) >= snrThreshold).length,
+    filters: { bandFilter, timeWindow, snrThreshold, showAnimation, showHeatmap, pathOpacity, heatmapOpacity },
   };
 }
diff --git a/src/plugins/layers/useWXRadar.js b/src/plugins/layers/useWXRadar.js
index 15692afe..c1b30ba6 100644
--- a/src/plugins/layers/useWXRadar.js
+++ b/src/plugins/layers/useWXRadar.js
@@ -10,7 +10,7 @@ export const metadata = {
   category: 'weather',
   defaultEnabled: false,
   defaultOpacity: 0.6,
-  version: '1.0.0'
+  version: '1.0.0',
 };
 
 export function useLayer({ enabled = false, opacity = 0.6, map = null }) {
@@ -25,8 +25,8 @@ export function useLayer({ enabled = false, opacity = 0.6, map = null }) {
       transparent: true,
       attribution: i18n.t('plugins.layers.wxradar.attribution'),
       opacity: opacity,
-      zIndex: 200
-    }
+      zIndex: 200,
+    },
   };
 
   // Add/remove layer
@@ -85,6 +85,6 @@ export function useLayer({ enabled = false, opacity = 0.6, map = null }) {
 
   return {
     layer: layerRef,
-    refresh: () => setRadarTimestamp(Date.now())
+    refresh: () => setRadarTimestamp(Date.now()),
   };
 }
diff --git a/src/plugins/layers/wspr/README.md b/src/plugins/layers/wspr/README.md
index 6fa5c923..a5a1c802 100644
--- a/src/plugins/layers/wspr/README.md
+++ b/src/plugins/layers/wspr/README.md
@@ -17,8 +17,9 @@ The WSPR (Weak Signal Propagation Reporter) Heatmap Plugin provides real-time vi
 ### ✅ v1.5.0 - Minimize/Maximize Panel Controls (Latest)
 
 #### **Panel Minimization**
+
 - **All 4 Panels Minimizable**: Click any panel header to minimize/maximize
-- **Toggle Icons**: 
+- **Toggle Icons**:
   - ▼ (down arrow) = Panel expanded
   - ▶ (right arrow) = Panel minimized
 - **Click Behavior**:
@@ -29,6 +30,7 @@ The WSPR (Weak Signal Propagation Reporter) Heatmap Plugin provides real-time vi
 - **Visual Feedback**: Hover over button shows opacity change
 
 #### **Panels You Can Minimize**
+
 1. **Filter Panel** (top-right) - Most useful for reducing clutter!
    - Large panel with many controls
    - Minimizes to just "🎛️ Filters" header
@@ -43,6 +45,7 @@ The WSPR (Weak Signal Propagation Reporter) Heatmap Plugin provides real-time vi
    - Minimizes to "📊 Band Activity" header
 
 #### **Benefits**
+
 - Keep panels available but out of the way
 - Reduce screen clutter without losing controls
 - Quick restore with single click
@@ -52,6 +55,7 @@ The WSPR (Weak Signal Propagation Reporter) Heatmap Plugin provides real-time vi
 ### ✅ v1.4.3 - Separate Opacity Controls
 
 #### **Independent Opacity Sliders**
+
 - **Path Opacity**: Control visibility of propagation paths and station markers (10-100%)
   - Affects path lines, TX markers (orange), and RX markers (blue)
   - Default: 70%
@@ -64,6 +68,7 @@ The WSPR (Weak Signal Propagation Reporter) Heatmap Plugin provides real-time vi
 - **Visual Separators**: Clean organization in filter panel
 
 #### **Use Cases**
+
 - Dim paths to 30% while keeping heatmap at 80% to focus on hot spots
 - Dim heatmap to 20% while keeping paths at 90% to focus on propagation
 - Fine-tune both for optimal visibility based on map type and lighting
@@ -72,6 +77,7 @@ The WSPR (Weak Signal Propagation Reporter) Heatmap Plugin provides real-time vi
 ### ✅ v1.4.2 - Performance & Duplicate Control Fix
 
 #### **Critical Bug Fix**
+
 - **Fixed Duplicate Popups**: No more multiple "WSPR Activity" popups spawning
   - Controls were recreating on every opacity/animation change
   - Stats, legend, and chart controls now created ONCE on plugin enable
@@ -80,6 +86,7 @@ The WSPR (Weak Signal Propagation Reporter) Heatmap Plugin provides real-time vi
   - Issue: Toggling "Animate Paths" created new popup → FIXED
 
 #### **Major Performance Improvements**
+
 - **90% Reduction in Re-renders**: Separated control creation from data rendering
   - Controls created in dedicated useEffect (runs once per enable)
   - Data updates only refresh control CONTENT (via innerHTML)
@@ -89,6 +96,7 @@ The WSPR (Weak Signal Propagation Reporter) Heatmap Plugin provides real-time vi
 - **Memory Efficient**: Eliminated control recreation loops
 
 #### **Technical Optimizations**
+
 - Control creation dependencies: `[enabled, map]` only
 - Render dependencies: `[enabled, wsprData, map, snrThreshold, showAnimation, timeWindow]`
 - Removed: `opacity, statsControl, legendControl, chartControl` from render deps
@@ -98,6 +106,7 @@ The WSPR (Weak Signal Propagation Reporter) Heatmap Plugin provides real-time vi
 ### ✅ v1.4.1 - Bug Fixes
 
 #### **Fixed Issues**
+
 - **CTRL+Drag to Move**: Panels now require holding CTRL key while dragging
   - Cursor changes to "grab" hand when CTRL is held
   - Prevents accidental moves when using dropdowns/sliders
@@ -115,12 +124,14 @@ The WSPR (Weak Signal Propagation Reporter) Heatmap Plugin provides real-time vi
 ### ✅ v1.4.0 - Interactive Heatmap & Draggable Panels
 
 #### **Draggable Control Panels**
+
 - All control panels can be repositioned by holding CTRL and dragging
 - Panel positions saved to localStorage
 - Positions persist across browser sessions
 - Independent position for each panel (filters, stats, legend, chart)
 
 #### **Working Heatmap Visualization**
+
 - Toggle heatmap view with checkbox in filter panel
 - Density-based hot spot visualization
 - Color-coded by activity level:
@@ -134,6 +145,7 @@ The WSPR (Weak Signal Propagation Reporter) Heatmap Plugin provides real-time vi
 ### ✅ v1.3.0 - Advanced Analytics & Filtering
 
 #### **Advanced Filter Controls (v1.2.0)**
+
 - **Band Selector Dropdown**: Filter by specific bands (160m-6m)
 - **Time Range Slider**: Choose 15min, 30min, 1hr, 2hr, or 6hr windows
 - **SNR Threshold Filter**: Adjustable minimum signal strength (-30 to +10 dB)
@@ -141,6 +153,7 @@ The WSPR (Weak Signal Propagation Reporter) Heatmap Plugin provides real-time vi
 - **Heatmap Toggle**: Switch between path view and density heatmap
 
 #### **Analytics Dashboard (v1.3.0)**
+
 - **Propagation Score**: 0-100 real-time score based on:
   - Average SNR (40% weight)
   - Path count (30% weight)
@@ -150,6 +163,7 @@ The WSPR (Weak Signal Propagation Reporter) Heatmap Plugin provides real-time vi
 - **Real-Time Statistics**: Dynamic counters for all activity
 
 #### **Visual Enhancements (v1.3.0)**
+
 - **Animated Paths**: Smooth pulse animation along propagation routes
 - **Best Path Highlighting**: Cyan-colored paths for exceptional DX
 - **Score Glow Effect**: Pulsing glow on propagation score
@@ -159,12 +173,14 @@ The WSPR (Weak Signal Propagation Reporter) Heatmap Plugin provides real-time vi
 ### ✅ Core Features (v1.0.0 - v1.1.0)
 
 #### **Real-Time Propagation Paths**
+
 - Displays signal paths between WSPR transmitters (TX) and receivers (RX)
 - Great circle paths (curved lines following Earth's curvature)
 - Updates automatically every 5 minutes
 - Shows last 30 minutes of activity
 
 #### **Signal Strength Visualization**
+
 - **Color-coded by SNR (Signal-to-Noise Ratio)**:
   - 🔴 Red: Very weak (< -20 dB)
   - 🟠 Orange-Red: Weak (-20 to -10 dB)
@@ -175,12 +191,14 @@ The WSPR (Weak Signal Propagation Reporter) Heatmap Plugin provides real-time vi
 - **Opacity control** via Settings panel slider
 
 #### **Station Markers**
+
 - 🟠 **Orange circles**: Transmitting stations
 - 🔵 **Blue circles**: Receiving stations
 - Hover tooltips showing callsigns
 - De-duplicated (one marker per station)
 
 #### **Interactive Information**
+
 - **Click any path** to see detailed popup:
   - Transmitter callsign and grid square
   - Receiver callsign and grid square
@@ -189,12 +207,14 @@ The WSPR (Weak Signal Propagation Reporter) Heatmap Plugin provides real-time vi
   - Spot age (minutes or hours ago)
 
 #### **Performance Optimizations**
+
 - Limits display to 500 most recent spots
 - 5-minute API caching to respect rate limits
 - Efficient layer management (add/remove on enable/disable)
 - Memory cleanup on component unmount
 
 #### **User Controls**
+
 - Enable/disable toggle in Settings → Map Layers
 - Opacity slider (0-100%)
 - Persistent state saved in localStorage
@@ -213,6 +233,7 @@ The WSPR (Weak Signal Propagation Reporter) Heatmap Plugin provides real-time vi
 ## 📖 Usage Instructions
 
 ### Basic Setup
+
 1. Open OpenHamClock in your browser
 2. Navigate to **Settings** (⚙️ icon)
 3. Open **Map Layers** tab
@@ -222,6 +243,7 @@ The WSPR (Weak Signal Propagation Reporter) Heatmap Plugin provides real-time vi
 7. The map will now display real-time WSPR propagation paths
 
 ### Moving Control Panels (CTRL+Drag)
+
 - **How to Move**: Hold **CTRL** key and drag any panel to reposition it
   - Cursor changes to "grab" hand (✋) when CTRL is held
   - Cursor returns to normal when CTRL is released
@@ -234,6 +256,7 @@ The WSPR (Weak Signal Propagation Reporter) Heatmap Plugin provides real-time vi
   - Band Activity Chart (bottom-left)
 
 ### Minimizing Panels (Click Header)
+
 - **How to Minimize**: Click anywhere on the panel header
   - Or click the ▼/▶ toggle button in the header
   - Panel collapses to show only header
@@ -245,6 +268,7 @@ The WSPR (Weak Signal Propagation Reporter) Heatmap Plugin provides real-time vi
 - **Works with CTRL+Drag**: Can drag minimized panels
 
 ### Using the Filter Panel
+
 - **Band Selector**: Choose specific band (160m-6m) or "All Bands"
 - **Time Window**: Select 15min, 30min, 1hr, 2hr, or 6hr
 - **Min SNR**: Adjust slider to filter weak signals (-30 to +10 dB)
@@ -258,6 +282,7 @@ The WSPR (Weak Signal Propagation Reporter) Heatmap Plugin provides real-time vi
 - **Show Heatmap**: Switch to density heatmap view
 
 ### Understanding the Display
+
 - **Curved Lines**: Propagation paths (great circle routes)
 - **Colors**: Signal strength (Red=weak, Green=strong)
 - **Cyan Paths**: Best DX paths (⭐ top 10 longest/strongest)
@@ -266,6 +291,7 @@ The WSPR (Weak Signal Propagation Reporter) Heatmap Plugin provides real-time vi
 - **Click Paths**: View detailed spot information
 
 ### Reading the Statistics Panel
+
 - **Propagation Score**: 0-100 overall HF conditions
   - Green (>70): Excellent propagation
   - Orange (40-70): Good propagation
@@ -275,6 +301,7 @@ The WSPR (Weak Signal Propagation Reporter) Heatmap Plugin provides real-time vi
 - **Total**: Combined station count
 
 ### Tips & Best Practices
+
 - Try different time windows to see propagation changes
 - Use SNR threshold to focus on strong signals
 - Move panels to avoid covering map areas of interest
@@ -291,10 +318,12 @@ The WSPR (Weak Signal Propagation Reporter) Heatmap Plugin provides real-time vi
 **Endpoint**: `/api/wspr/heatmap`
 
 **Query Parameters**:
+
 - `minutes` (optional): Time window in minutes (default: 30)
 - `band` (optional): Filter by band, e.g., "20m", "40m" (default: "all")
 
 **Response Format**:
+
 ```json
 {
   "count": 245,
@@ -328,6 +357,7 @@ The WSPR (Weak Signal Propagation Reporter) Heatmap Plugin provides real-time vi
 ## 🚀 Optional Enhancements (Roadmap)
 
 ### ✅ v1.2.0 - Advanced Filtering (COMPLETED)
+
 - [x] **Band Selector UI**: Dropdown menu for band filtering
 - [x] **Time Range Slider**: Choose 15min, 30min, 1hr, 2hr, 6hr windows
 - [x] **SNR Threshold Filter**: Hide weak signals below threshold
@@ -335,6 +365,7 @@ The WSPR (Weak Signal Propagation Reporter) Heatmap Plugin provides real-time vi
 - [ ] **Callsign Search**: Highlight paths involving specific callsign (future)
 
 ### ✅ v1.3.0 - Analytics (COMPLETED)
+
 - [x] **Activity Counter**: Show total TX/RX stations count
 - [x] **Band Activity Chart**: Bar chart showing spots per band
 - [ ] **Hot Spot Heatmap**: Density map of high-activity regions (in progress)
@@ -342,6 +373,7 @@ The WSPR (Weak Signal Propagation Reporter) Heatmap Plugin provides real-time vi
 - [x] **Best DX Paths**: Highlight longest or strongest paths
 
 ### v1.4.0 - Advanced Features (Planned)
+
 - [ ] **Historical Playback**: Time-slider to replay past propagation
 - [ ] **Frequency Histogram**: Show active WSPR frequencies
 - [ ] **MUF Overlay**: Calculated Maximum Usable Frequency zones
@@ -351,6 +383,7 @@ The WSPR (Weak Signal Propagation Reporter) Heatmap Plugin provides real-time vi
 - [ ] **Path Recording**: Record and replay propagation patterns
 
 ### v1.1.0 - Enhanced Visualization (COMPLETED)
+
 - [x] **Signal Strength Legend**: Color scale legend in map corner
 - [x] **Path Animation**: Animated signal "pulses" from TX to RX
 - [ ] **Fading Paths**: Older spots fade out gradually (future)
@@ -361,6 +394,7 @@ The WSPR (Weak Signal Propagation Reporter) Heatmap Plugin provides real-time vi
 ## 🎨 Technical Implementation
 
 ### File Structure
+
 ```
 src/plugins/layers/
 ├── useWSPR.js          # Main plugin file
@@ -369,18 +403,21 @@ src/plugins/layers/
 ```
 
 ### Architecture
+
 - **React Hooks-based**: Uses `useState`, `useEffect`
 - **Leaflet Integration**: Direct Leaflet.js API usage
 - **Zero Core Changes**: Plugin is completely self-contained
 - **Follows Plugin Pattern**: Matches existing plugins (Aurora, Earthquakes, Weather Radar)
 
 ### Key Functions
+
 - `gridToLatLon(grid)`: Converts Maidenhead grid to coordinates
 - `getSNRColor(snr)`: Maps SNR to color gradient
 - `getLineWeight(snr)`: Maps SNR to line thickness
 - `useLayer()`: Main plugin hook (called by PluginLayer.jsx)
 
 ### Dependencies
+
 - **React**: Component framework
 - **Leaflet**: Map rendering (`L.polyline`, `L.circleMarker`)
 - **Backend API**: `/api/wspr/heatmap` endpoint
@@ -414,14 +451,16 @@ src/plugins/layers/
 
 1. Copy `useWSPR.js` to `src/plugins/layers/`
 2. Add to `src/plugins/layerRegistry.js`:
+
    ```javascript
    import * as WSPRPlugin from './layers/useWSPR.js';
-   
+
    const layerPlugins = [
      // ... other plugins
      WSPRPlugin,
    ];
    ```
+
 3. Ensure `/api/wspr/heatmap` endpoint exists in `server.js`
 4. Rebuild: `npm run build`
 5. Restart server: `npm start`
@@ -452,22 +491,26 @@ function getSNRColor(snr) {
 ## 🐛 Troubleshooting
 
 ### Plugin Not Appearing in Settings
+
 - Check that `WSPRPlugin` is imported in `layerRegistry.js`
 - Verify `metadata` export exists in `useWSPR.js`
 - Check browser console for import errors
 
 ### No Spots Displayed
+
 - Open browser DevTools → Network tab
 - Check if `/api/wspr/heatmap` returns data
 - PSK Reporter may have rate limits (5-minute cache helps)
 - Try increasing time window: `?minutes=60`
 
 ### Performance Issues
+
 - Reduce max spots: Change `limitedData.slice(0, 500)` to `slice(0, 200)`
 - Increase update interval to 10 minutes
 - Disable other map layers temporarily
 
 ### API Timeout Errors
+
 - PSK Reporter API can be slow during high activity
 - Backend timeout is 20 seconds
 - Cached data will be returned if fresh data fails
@@ -477,22 +520,26 @@ function getSNRColor(snr) {
 ## 📊 Example Use Cases
 
 ### 1. **Contest Planning**
+
 - Check which bands are "open" before contest
 - See propagation to needed multiplier zones
 - Identify best times for DX contacts
 
 ### 2. **Antenna Testing**
+
 - Enable plugin, transmit WSPR
 - Wait 5-10 minutes
 - Check where your signal is being heard
 - Compare different antennas/times
 
 ### 3. **Propagation Study**
+
 - Watch how paths change throughout the day
 - Correlate with solar activity
 - Learn which bands work to specific regions
 
 ### 4. **Station Comparison**
+
 - Compare your reports with nearby stations
 - Identify local noise/RFI issues
 - Validate antenna performance
@@ -506,6 +553,7 @@ function getSNRColor(snr) {
 **Want to help?** Pick an item from "Optional Enhancements" above.
 
 ### Coding Standards
+
 - Follow existing plugin patterns
 - Keep code self-contained in plugin file
 - Add comments for complex logic
@@ -545,4 +593,4 @@ MIT License - Same as OpenHamClock project
 
 ---
 
-*73 de OpenHamClock Contributors! 📡*
+_73 de OpenHamClock Contributors! 📡_
diff --git a/src/plugins/layers/wxradar/README.md b/src/plugins/layers/wxradar/README.md
index 6e39c1e4..a8a44651 100644
--- a/src/plugins/layers/wxradar/README.md
+++ b/src/plugins/layers/wxradar/README.md
@@ -16,6 +16,7 @@ The Weather Radar plugin provides real-time NEXRAD (Next Generation Radar) weath
 ## 🌟 Features
 
 ### Core Capabilities
+
 - **NEXRAD Radar Overlay**: High-resolution weather radar imagery
 - **Real-time Updates**: Auto-refresh every 2 minutes
 - **Coverage**: Complete North America (USA, Canada, Mexico)
@@ -23,6 +24,7 @@ The Weather Radar plugin provides real-time NEXRAD (Next Generation Radar) weath
 - **WMS Integration**: Uses Weather Map Service (WMS) for efficient loading
 
 ### Data Visualization
+
 - **Precipitation Intensity**: Color-coded radar returns
   - Light: Green
   - Moderate: Yellow
@@ -36,6 +38,7 @@ The Weather Radar plugin provides real-time NEXRAD (Next Generation Radar) weath
 ## 📊 Data Details
 
 ### Data Source
+
 - **Provider**: Iowa State University Mesonet
 - **Service**: NEXRAD WMS (n0r product)
 - **URL**: https://mesonet.agron.iastate.edu/cgi-bin/wms/nexrad/n0r.cgi
@@ -43,6 +46,7 @@ The Weather Radar plugin provides real-time NEXRAD (Next Generation Radar) weath
 - **Data Latency**: ~5-10 minutes from radar scan
 
 ### Radar Product
+
 - **Product Code**: N0R (Base Reflectivity)
 - **Resolution**: ~1 km at radar site
 - **Range**: ~230 miles (370 km) from radar
@@ -53,18 +57,23 @@ The Weather Radar plugin provides real-time NEXRAD (Next Generation Radar) weath
 ## 🎯 Use Cases
 
 ### 1. **Weather Monitoring**
+
 Monitor local weather conditions and precipitation in real-time.
 
 ### 2. **Storm Tracking**
+
 Track approaching storms, severe weather, and precipitation systems.
 
 ### 3. **Operating Conditions**
+
 Assess weather impact on outdoor antenna installations and operations.
 
 ### 4. **Propagation Analysis**
+
 Identify weather fronts that can affect radio wave propagation (especially VHF/UHF).
 
 ### 5. **Safety Planning**
+
 Monitor severe weather before outdoor activities or antenna work.
 
 ---
@@ -91,6 +100,7 @@ Monitor severe weather before outdoor activities or antenna work.
 ### Interpreting Radar
 
 #### Precipitation Colors
+
 - **Green**: Light rain/drizzle
 - **Yellow**: Moderate rain
 - **Orange**: Heavy rain
@@ -98,6 +108,7 @@ Monitor severe weather before outdoor activities or antenna work.
 - **Purple**: Extreme precipitation/hail
 
 #### Coverage Gaps
+
 - **Dark spots**: Areas between radar sites (blind spots)
 - **Circular patterns**: Individual radar site coverage
 - **Mountains**: Terrain can block radar beams
@@ -107,6 +118,7 @@ Monitor severe weather before outdoor activities or antenna work.
 ## ⚙️ Configuration
 
 ### Default Settings
+
 ```javascript
 {
   enabled: false,
@@ -117,6 +129,7 @@ Monitor severe weather before outdoor activities or antenna work.
 ```
 
 ### WMS Parameters
+
 - **Service**: WMS (OGC Web Map Service)
 - **Version**: 1.3.0
 - **Format**: PNG with transparency
@@ -128,18 +141,21 @@ Monitor severe weather before outdoor activities or antenna work.
 ## 🧪 Technical Details
 
 ### Implementation
+
 - **Technology**: Leaflet WMS TileLayer
 - **Projection**: Web Mercator (EPSG:3857)
 - **Tile Size**: 256x256 pixels
 - **Z-Index**: 200 (above base map, below markers)
 
 ### Performance
+
 - **Tile Caching**: Browser caches tiles automatically
 - **Refresh**: Forced redraw every 2 minutes
 - **Network**: ~50-200 KB per map view
 - **Render Time**: <100ms for tile display
 
 ### Data Flow
+
 ```
 NEXRAD Radars → IEM Processing → WMS Server → OpenHamClock → Map Display
     (~5 min)        (real-time)      (on-demand)     (2 min refresh)
@@ -150,17 +166,20 @@ NEXRAD Radars → IEM Processing → WMS Server → OpenHamClock → Map Display
 ## 🔍 Troubleshooting
 
 ### Radar Not Showing
+
 1. **Check internet connection**: WMS requires live internet
 2. **Zoom level**: Zoom in if radar is too faint
 3. **Opacity**: Increase opacity slider
 4. **Clear browser cache**: Force reload (Ctrl+F5)
 
 ### Outdated Data
+
 - **Auto-refresh**: Plugin refreshes every 2 minutes automatically
 - **Manual refresh**: Toggle plugin off/on to force refresh
 - **IEM Service**: Check https://mesonet.agron.iastate.edu for service status
 
 ### Performance Issues
+
 - **Lower opacity**: Reduce to 40-50%
 - **Zoom in**: Less tiles to load
 - **Disable when not needed**: Toggle off to reduce network usage
@@ -178,6 +197,7 @@ NEXRAD Radars → IEM Processing → WMS Server → OpenHamClock → Map Display
 ## 📝 Version History
 
 ### v1.0.0 (2026-02-03)
+
 - Initial release
 - NEXRAD N0R base reflectivity overlay
 - Auto-refresh every 2 minutes
@@ -189,12 +209,14 @@ NEXRAD Radars → IEM Processing → WMS Server → OpenHamClock → Map Display
 ## 💡 Tips & Best Practices
 
 ### For Best Results
+
 1. **Set opacity to 50-70%** for balanced view
 2. **Use with other layers** (e.g., Gray Line, WSPR) for context
 3. **Monitor regularly** during weather events
 4. **Check multiple zoom levels** for detail vs overview
 
 ### Common Workflows
+
 - **Storm Monitoring**: Enable radar + adjust opacity to 80-90%
 - **Casual Check**: Quick toggle on/off to see current conditions
 - **Propagation Study**: Compare with WSPR propagation paths
@@ -229,4 +251,4 @@ NEXRAD Radars → IEM Processing → WMS Server → OpenHamClock → Map Display
 
 **73 de OpenHamClock** 📡☁️
 
-*Real-time weather awareness for radio operators*
+_Real-time weather awareness for radio operators_
diff --git a/src/server/ctydat.js b/src/server/ctydat.js
index 290cbb36..5cbe509f 100644
--- a/src/server/ctydat.js
+++ b/src/server/ctydat.js
@@ -11,12 +11,16 @@
  *           continent/zone mapping, prefix-estimated coordinates.
  */
 let fetch;
-try { fetch = require('node-fetch'); } catch { fetch = globalThis.fetch; }
+try {
+  fetch = require('node-fetch');
+} catch {
+  fetch = globalThis.fetch;
+}
 
 const CTY_URL = 'https://www.country-files.com/bigcty/cty.dat';
 const REFRESH_INTERVAL = 24 * 60 * 60 * 1000; // 24 hours
 
-let ctyCache = null;   // { prefixes: {}, exact: {}, entities: [], timestamp }
+let ctyCache = null; // { prefixes: {}, exact: {}, entities: [], timestamp }
 let fetchTimer = null;
 
 /**
@@ -35,9 +39,9 @@ let fetchTimer = null;
  *   <nn/nn> — lat/lon override (rare)
  */
 function parseCtyDat(text) {
-  const prefixes = {};   // prefix string → entity info
-  const exact = {};      // exact callsign → entity info
-  const entities = [];   // list of all entities
+  const prefixes = {}; // prefix string → entity info
+  const exact = {}; // exact callsign → entity info
+  const entities = []; // list of all entities
 
   // Normalize line endings and split into entity blocks.
   // Each block starts at column 0 (header) and continues with
@@ -46,7 +50,7 @@ function parseCtyDat(text) {
 
   // Join continuation lines: alias lines are indented (start with space/tab)
   // Combine into blocks separated by semicolons
-  const blocks = raw.split(';').filter(b => b.trim());
+  const blocks = raw.split(';').filter((b) => b.trim());
 
   for (const block of blocks) {
     const lines = block.split('\n');
@@ -68,7 +72,7 @@ function parseCtyDat(text) {
     if (!headerLine) continue;
 
     // Parse header: split by colon
-    const parts = headerLine.split(':').map(s => s.trim());
+    const parts = headerLine.split(':').map((s) => s.trim());
     if (parts.length < 8) continue;
 
     const entityName = parts[0];
@@ -101,8 +105,8 @@ function parseCtyDat(text) {
     // Parse alias prefixes
     const aliasList = aliasText
       .split(',')
-      .map(s => s.trim())
-      .filter(s => s.length > 0);
+      .map((s) => s.trim())
+      .filter((s) => s.length > 0);
 
     for (const alias of aliasList) {
       // Parse modifiers: (cq)[itu]{cont}<lat/lon>
diff --git a/src/store/layoutStore.js b/src/store/layoutStore.js
index 190c45b4..04d3475e 100644
--- a/src/store/layoutStore.js
+++ b/src/store/layoutStore.js
@@ -33,8 +33,8 @@ export const DEFAULT_LAYOUT = {
             id: 'left-top-tabset',
             children: [
               { type: 'tab', name: 'DE Location', component: 'de-location', id: 'de-location-tab' },
-              { type: 'tab', name: 'DX Target', component: 'dx-location', id: 'dx-location-tab' }
-            ]
+              { type: 'tab', name: 'DX Target', component: 'dx-location', id: 'dx-location-tab' },
+            ],
           },
           {
             type: 'tabset',
@@ -44,18 +44,16 @@ export const DEFAULT_LAYOUT = {
               { type: 'tab', name: 'Solar', component: 'solar', id: 'solar-tab' },
               { type: 'tab', name: 'Propagation', component: 'propagation', id: 'propagation-tab' },
               { type: 'tab', name: 'Ambient', component: 'ambient', id: 'ambient-tab' },
-              { type: 'tab', name: 'Band Health', component: 'band-health', id: 'band-health-tab' }
-            ]
-          }
-        ]
+              { type: 'tab', name: 'Band Health', component: 'band-health', id: 'band-health-tab' },
+            ],
+          },
+        ],
       },
       {
         type: 'tabset',
         weight: 56,
         id: 'center-tabset',
-        children: [
-          { type: 'tab', name: 'World Map', component: 'world-map', id: 'map-tab' }
-        ]
+        children: [{ type: 'tab', name: 'World Map', component: 'world-map', id: 'map-tab' }],
       },
       {
         type: 'row',
@@ -67,8 +65,8 @@ export const DEFAULT_LAYOUT = {
             id: 'right-top-tabset',
             children: [
               { type: 'tab', name: 'DX Cluster', component: 'dx-cluster', id: 'dx-cluster-tab' },
-              { type: 'tab', name: 'PSK Reporter', component: 'psk-reporter', id: 'psk-reporter-tab' }
-            ]
+              { type: 'tab', name: 'PSK Reporter', component: 'psk-reporter', id: 'psk-reporter-tab' },
+            ],
           },
           {
             type: 'tabset',
@@ -78,29 +76,29 @@ export const DEFAULT_LAYOUT = {
               { type: 'tab', name: 'DXpeditions', component: 'dxpeditions', id: 'dxpeditions-tab' },
               { type: 'tab', name: 'POTA', component: 'pota', id: 'pota-tab' },
               { type: 'tab', name: 'SOTA', component: 'sota', id: 'sota-tab' },
-              { type: 'tab', name: 'Contests', component: 'contests', id: 'contests-tab' }
-            ]
-          }
-        ]
-      }
-    ]
-  }
+              { type: 'tab', name: 'Contests', component: 'contests', id: 'contests-tab' },
+            ],
+          },
+        ],
+      },
+    ],
+  },
 };
 
 // Panel definitions for the panel picker
 export const PANEL_DEFINITIONS = {
   'de-location': { name: 'DE Location', icon: '📍', description: 'Your station location and weather' },
   'dx-location': { name: 'DX Target', icon: '🎯', description: 'Target location for DXing' },
-  'solar': { name: 'Solar', icon: '☀️', description: 'Sunspot numbers and solar flux' },
-  'propagation': { name: 'Propagation', icon: '📡', description: 'Band conditions and forecasts' },
-  'ambient': { name: 'Ambient Weather', icon: '🌦️', description: 'AmbientWeather.net station data' },
+  solar: { name: 'Solar', icon: '☀️', description: 'Sunspot numbers and solar flux' },
+  propagation: { name: 'Propagation', icon: '📡', description: 'Band conditions and forecasts' },
+  ambient: { name: 'Ambient Weather', icon: '🌦️', description: 'AmbientWeather.net station data' },
   'band-health': { name: 'HF Band Health', icon: '📶', description: 'Observed band usability from DX cluster spots' },
   'dx-cluster': { name: 'DX Cluster', icon: '📻', description: 'Live DX spots from cluster' },
   'psk-reporter': { name: 'PSK Reporter', icon: '📡', description: 'Digital mode spots and WSJT-X' },
-  'dxpeditions': { name: 'DXpeditions', icon: '🏝️', description: 'Upcoming DXpeditions' },
-  'pota': { name: 'POTA', icon: '🏕️', description: 'Parks on the Air activators' },
-  'sota': { name: 'SOTA', icon: '⛰️', description: 'Summits on the Air activators' },
-  'contests': { name: 'Contests', icon: '🏆', description: 'Upcoming and active contests' },
+  dxpeditions: { name: 'DXpeditions', icon: '🏝️', description: 'Upcoming DXpeditions' },
+  pota: { name: 'POTA', icon: '🏕️', description: 'Parks on the Air activators' },
+  sota: { name: 'SOTA', icon: '⛰️', description: 'Summits on the Air activators' },
+  contests: { name: 'Contests', icon: '🏆', description: 'Upcoming and active contests' },
   'id-timer': { name: 'ID Timer', icon: '📢', description: '10-minute station identification reminder' },
   'world-map': { name: 'World Map', icon: '🗺️', description: 'Interactive world map' },
   'rig-control': { name: 'Rig Control', icon: '📻', description: 'Transceiver control and feedback' },
@@ -129,7 +127,7 @@ export const saveLayout = (layout) => {
   try {
     localStorage.setItem('openhamclock_dockLayout', JSON.stringify(layout));
     // Lazy import to avoid circular dependency
-    import('../utils/config.js').then(m => m.syncAllSettingsToServer());
+    import('../utils/config.js').then((m) => m.syncAllSettingsToServer());
   } catch (e) {
     console.error('Failed to save layout:', e);
   }
diff --git a/src/styles/main.css b/src/styles/main.css
index 607555f3..7ca4e2e1 100644
--- a/src/styles/main.css
+++ b/src/styles/main.css
@@ -1,7 +1,8 @@
 /* ============================================
    THEME: DARK (Default)
    ============================================ */
-:root, [data-theme="dark"] {
+:root,
+[data-theme='dark'] {
   --bg-primary: #0a0e14;
   --bg-secondary: #111820;
   --bg-tertiary: #1a2332;
@@ -25,7 +26,7 @@
 /* ============================================
    THEME: LIGHT
    ============================================ */
-[data-theme="light"] {
+[data-theme='light'] {
   --bg-primary: #f5f7fa;
   --bg-secondary: #ffffff;
   --bg-tertiary: #e8ecf0;
@@ -49,7 +50,7 @@
 /* ============================================
    THEME: LEGACY (Green Terminal Style)
    ============================================ */
-[data-theme="legacy"] {
+[data-theme='legacy'] {
   --bg-primary: #000000;
   --bg-secondary: #0a0a0a;
   --bg-tertiary: #151515;
@@ -73,7 +74,7 @@
 /* ============================================
    THEME: RETRO (90s Windows Style)
    ============================================ */
-[data-theme="retro"] {
+[data-theme='retro'] {
   --bg-primary: #008080;
   --bg-secondary: #c0c0c0;
   --bg-tertiary: #dfdfdf;
@@ -98,7 +99,11 @@
   --scanline-opacity: 0;
 }
 
-* { margin: 0; padding: 0; box-sizing: border-box; }
+* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
 
 body {
   font-family: 'Space Grotesk', sans-serif;
@@ -106,18 +111,20 @@ body {
   color: var(--text-primary);
   min-height: 100vh;
   overflow-x: hidden;
-  transition: background 0.3s, color 0.3s;
+  transition:
+    background 0.3s,
+    color 0.3s;
 }
 
 /* Legacy theme uses monospace font */
-[data-theme="legacy"] body,
-[data-theme="legacy"] * {
+[data-theme='legacy'] body,
+[data-theme='legacy'] * {
   font-family: 'JetBrains Mono', monospace !important;
 }
 
 /* Classic theme uses system fonts */
-[data-theme="retro"] body,
-[data-theme="retro"] * {
+[data-theme='retro'] body,
+[data-theme='retro'] * {
   font-family: 'Tahoma', 'MS Sans Serif', 'Arial', sans-serif !important;
 }
 
@@ -125,8 +132,17 @@ body {
 body::before {
   content: '';
   position: fixed;
-  top: 0; left: 0; right: 0; bottom: 0;
-  background: repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(0,0,0,var(--scanline-opacity)) 2px, rgba(0,0,0,var(--scanline-opacity)) 4px);
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: repeating-linear-gradient(
+    0deg,
+    transparent,
+    transparent 2px,
+    rgba(0, 0, 0, var(--scanline-opacity)) 2px,
+    rgba(0, 0, 0, var(--scanline-opacity)) 4px
+  );
   pointer-events: none;
   z-index: 9999;
 }
@@ -136,11 +152,11 @@ body::before {
    ============================================ */
 
 /* 3D Beveled border effect for classic theme */
-[data-theme="retro"] .panel {
+[data-theme='retro'] .panel {
   background: #c0c0c0 !important;
   border: none !important;
   border-radius: 0 !important;
-  box-shadow: 
+  box-shadow:
     inset -1px -1px 0 #404040,
     inset 1px 1px 0 #ffffff,
     inset -2px -2px 0 #808080,
@@ -149,8 +165,8 @@ body::before {
 }
 
 /* Classic window title bar style */
-[data-theme="retro"] .panel-header,
-[data-theme="retro"] .panel > div:first-child {
+[data-theme='retro'] .panel-header,
+[data-theme='retro'] .panel > div:first-child {
   background: linear-gradient(90deg, #000080, #1084d0) !important;
   color: #ffffff !important;
   font-weight: bold !important;
@@ -160,13 +176,13 @@ body::before {
 }
 
 /* Classic buttons */
-[data-theme="retro"] button,
-[data-theme="retro"] .map-style-btn {
+[data-theme='retro'] button,
+[data-theme='retro'] .map-style-btn {
   background: #c0c0c0 !important;
   color: #000000 !important;
   border: none !important;
   border-radius: 0 !important;
-  box-shadow: 
+  box-shadow:
     inset -1px -1px 0 #404040,
     inset 1px 1px 0 #ffffff,
     inset -2px -2px 0 #808080,
@@ -176,15 +192,15 @@ body::before {
   padding: 4px 12px !important;
 }
 
-[data-theme="retro"] button:hover,
-[data-theme="retro"] .map-style-btn:hover {
+[data-theme='retro'] button:hover,
+[data-theme='retro'] .map-style-btn:hover {
   background: #dfdfdf !important;
 }
 
-[data-theme="retro"] button:active,
-[data-theme="retro"] .map-style-btn:active,
-[data-theme="retro"] .map-style-btn.active {
-  box-shadow: 
+[data-theme='retro'] button:active,
+[data-theme='retro'] .map-style-btn:active,
+[data-theme='retro'] .map-style-btn.active {
+  box-shadow:
     inset 1px 1px 0 #404040,
     inset -1px -1px 0 #ffffff,
     inset 2px 2px 0 #808080,
@@ -192,13 +208,13 @@ body::before {
 }
 
 /* Classic inputs */
-[data-theme="retro"] input,
-[data-theme="retro"] select {
+[data-theme='retro'] input,
+[data-theme='retro'] select {
   background: #ffffff !important;
   color: #000000 !important;
   border: none !important;
   border-radius: 0 !important;
-  box-shadow: 
+  box-shadow:
     inset 1px 1px 0 #404040,
     inset -1px -1px 0 #ffffff,
     inset 2px 2px 0 #808080,
@@ -209,35 +225,37 @@ body::before {
 }
 
 /* Classic scrollbars */
-[data-theme="retro"] ::-webkit-scrollbar {
+[data-theme='retro'] ::-webkit-scrollbar {
   width: 16px;
   height: 16px;
 }
 
-[data-theme="retro"] ::-webkit-scrollbar-track {
+[data-theme='retro'] ::-webkit-scrollbar-track {
   background: #c0c0c0;
-  background-image: 
-    linear-gradient(45deg, #808080 25%, transparent 25%),
-    linear-gradient(-45deg, #808080 25%, transparent 25%),
-    linear-gradient(45deg, transparent 75%, #808080 75%),
-    linear-gradient(-45deg, transparent 75%, #808080 75%);
+  background-image:
+    linear-gradient(45deg, #808080 25%, transparent 25%), linear-gradient(-45deg, #808080 25%, transparent 25%),
+    linear-gradient(45deg, transparent 75%, #808080 75%), linear-gradient(-45deg, transparent 75%, #808080 75%);
   background-size: 4px 4px;
-  background-position: 0 0, 0 2px, 2px -2px, -2px 0px;
+  background-position:
+    0 0,
+    0 2px,
+    2px -2px,
+    -2px 0px;
 }
 
-[data-theme="retro"] ::-webkit-scrollbar-thumb {
+[data-theme='retro'] ::-webkit-scrollbar-thumb {
   background: #c0c0c0;
   border-radius: 0;
-  box-shadow: 
+  box-shadow:
     inset -1px -1px 0 #404040,
     inset 1px 1px 0 #ffffff,
     inset -2px -2px 0 #808080,
     inset 2px 2px 0 #dfdfdf;
 }
 
-[data-theme="retro"] ::-webkit-scrollbar-button {
+[data-theme='retro'] ::-webkit-scrollbar-button {
   background: #c0c0c0;
-  box-shadow: 
+  box-shadow:
     inset -1px -1px 0 #404040,
     inset 1px 1px 0 #ffffff;
   width: 16px;
@@ -245,88 +263,128 @@ body::before {
 }
 
 /* Classic links */
-[data-theme="retro"] a {
+[data-theme='retro'] a {
   color: #0000ff !important;
   text-decoration: underline !important;
 }
 
-[data-theme="retro"] a:visited {
+[data-theme='retro'] a:visited {
   color: #800080 !important;
 }
 
 /* Classic header styling */
-[data-theme="retro"] [style*="gridColumn: '1 / -1'"] {
+[data-theme='retro'] [style*="gridColumn: '1 / -1'"] {
   background: #c0c0c0 !important;
 }
 
 /* Classic text colors override */
-[data-theme="retro"] [style*="color: var(--accent-cyan)"],
-[data-theme="retro"] [style*="color: var(--accent-amber)"],
-[data-theme="retro"] [style*="color: var(--accent-green)"] {
+[data-theme='retro'] [style*='color: var(--accent-cyan)'],
+[data-theme='retro'] [style*='color: var(--accent-amber)'],
+[data-theme='retro'] [style*='color: var(--accent-green)'] {
   color: #000080 !important;
 }
 
 /* Classic modal/dialog styling */
-[data-theme="retro"] [style*="position: fixed"][style*="background: rgba"] {
+[data-theme='retro'] [style*='position: fixed'][style*='background: rgba'] {
   background: rgba(0, 128, 128, 0.9) !important;
 }
 
 /* Classic table styling for DX cluster */
-[data-theme="retro"] table,
-[data-theme="retro"] [style*="display: grid"] {
+[data-theme='retro'] table,
+[data-theme='retro'] [style*='display: grid'] {
   border-collapse: collapse;
 }
 
-[data-theme="retro"] tr:nth-child(even) {
+[data-theme='retro'] tr:nth-child(even) {
   background: #dfdfdf;
 }
 
-[data-theme="retro"] tr:nth-child(odd) {
+[data-theme='retro'] tr:nth-child(odd) {
   background: #c0c0c0;
 }
 
 /* Classic Leaflet overrides */
-[data-theme="retro"] .leaflet-container {
+[data-theme='retro'] .leaflet-container {
   background: #000080 !important;
 }
 
-[data-theme="retro"] .leaflet-control-zoom {
+[data-theme='retro'] .leaflet-control-zoom {
   border-radius: 0 !important;
 }
 
-[data-theme="retro"] .leaflet-control-zoom a {
+[data-theme='retro'] .leaflet-control-zoom a {
   background: #c0c0c0 !important;
   color: #000000 !important;
   border-radius: 0 !important;
-  box-shadow: 
+  box-shadow:
     inset -1px -1px 0 #404040,
     inset 1px 1px 0 #ffffff !important;
 }
 
-[data-theme="retro"] .leaflet-popup-content-wrapper {
+[data-theme='retro'] .leaflet-popup-content-wrapper {
   background: #c0c0c0 !important;
   border-radius: 0 !important;
-  box-shadow: 
+  box-shadow:
     inset -1px -1px 0 #404040,
     inset 1px 1px 0 #ffffff,
-    2px 2px 4px rgba(0,0,0,0.5) !important;
+    2px 2px 4px rgba(0, 0, 0, 0.5) !important;
 }
 
-[data-theme="retro"] .leaflet-popup-tip {
+[data-theme='retro'] .leaflet-popup-tip {
   background: #c0c0c0 !important;
 }
 
 /* ============================================
    ANIMATIONS
    ============================================ */
-@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.7; } }
-@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
-@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
-@keyframes blink { 0%, 100% { opacity: 1; } 50% { opacity: 0; } }
-@keyframes dxnews-scroll { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }
+@keyframes pulse {
+  0%,
+  100% {
+    opacity: 1;
+  }
+  50% {
+    opacity: 0.7;
+  }
+}
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+    transform: translateY(10px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+@keyframes spin {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+}
+@keyframes blink {
+  0%,
+  100% {
+    opacity: 1;
+  }
+  50% {
+    opacity: 0;
+  }
+}
+@keyframes dxnews-scroll {
+  0% {
+    transform: translateX(0);
+  }
+  100% {
+    transform: translateX(-50%);
+  }
+}
 
 .loading-spinner {
-  width: 14px; height: 14px;
+  width: 14px;
+  height: 14px;
   border: 2px solid var(--border-color);
   border-top-color: var(--accent-amber);
   border-radius: 50%;
@@ -335,13 +393,13 @@ body::before {
 }
 
 /* Legacy theme specific styles */
-[data-theme="legacy"] .loading-spinner {
+[data-theme='legacy'] .loading-spinner {
   border-color: var(--accent-green);
   border-top-color: var(--accent-amber);
 }
 
 /* Classic theme uses hourglass cursor for loading */
-[data-theme="retro"] .loading-spinner {
+[data-theme='retro'] .loading-spinner {
   border-radius: 0;
   border-color: #000000;
   border-top-color: #808080;
@@ -413,7 +471,7 @@ body::before {
   font-size: 12px;
   border-radius: 50%;
   border: 2px solid white;
-  box-shadow: 0 0 10px rgba(0,0,0,0.5);
+  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
 }
 
 .de-marker {
@@ -445,9 +503,9 @@ body::before {
 }
 
 /* Classic theme markers - square */
-[data-theme="retro"] .custom-marker,
-[data-theme="retro"] .de-marker,
-[data-theme="retro"] .dx-marker {
+[data-theme='retro'] .custom-marker,
+[data-theme='retro'] .de-marker,
+[data-theme='retro'] .dx-marker {
   border-radius: 0 !important;
 }
 
@@ -562,7 +620,7 @@ body::before {
 }
 
 /* Classic tooltips */
-[data-theme="retro"] .dx-tooltip {
+[data-theme='retro'] .dx-tooltip {
   background: #ffffcc !important;
   border: 1px solid #000000 !important;
   border-radius: 0 !important;
@@ -594,22 +652,50 @@ body::before {
 /* ============================================
    UTILITY CLASSES
    ============================================ */
-.text-amber { color: var(--accent-amber); }
-.text-green { color: var(--accent-green); }
-.text-red { color: var(--accent-red); }
-.text-blue { color: var(--accent-blue); }
-.text-cyan { color: var(--accent-cyan); }
-.text-muted { color: var(--text-muted); }
-.text-primary { color: var(--text-primary); }
-.text-secondary { color: var(--text-secondary); }
-
-.font-mono { font-family: 'JetBrains Mono', monospace; }
-.font-display { font-family: 'Orbitron', monospace; }
-
-.bg-panel { background: var(--bg-panel); }
-.bg-primary { background: var(--bg-primary); }
-.bg-secondary { background: var(--bg-secondary); }
-.bg-tertiary { background: var(--bg-tertiary); }
+.text-amber {
+  color: var(--accent-amber);
+}
+.text-green {
+  color: var(--accent-green);
+}
+.text-red {
+  color: var(--accent-red);
+}
+.text-blue {
+  color: var(--accent-blue);
+}
+.text-cyan {
+  color: var(--accent-cyan);
+}
+.text-muted {
+  color: var(--text-muted);
+}
+.text-primary {
+  color: var(--text-primary);
+}
+.text-secondary {
+  color: var(--text-secondary);
+}
+
+.font-mono {
+  font-family: 'JetBrains Mono', monospace;
+}
+.font-display {
+  font-family: 'Orbitron', monospace;
+}
+
+.bg-panel {
+  background: var(--bg-panel);
+}
+.bg-primary {
+  background: var(--bg-primary);
+}
+.bg-secondary {
+  background: var(--bg-secondary);
+}
+.bg-tertiary {
+  background: var(--bg-tertiary);
+}
 
 /* ============================================
    WSPR PLUGIN ANIMATIONS (v1.3.0)
@@ -637,7 +723,8 @@ body::before {
 
 /* Pulsing marker animation */
 @keyframes wspr-marker-pulse {
-  0%, 100% {
+  0%,
+  100% {
     transform: scale(1);
     opacity: 0.8;
   }
@@ -664,12 +751,12 @@ body::before {
 .wspr-legend:hover,
 .wspr-chart:hover {
   transform: translateY(-2px);
-  box-shadow: 0 4px 12px rgba(0,0,0,0.4) !important;
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4) !important;
 }
 
 /* Filter input styles */
 .wspr-filter-control select,
-.wspr-filter-control input[type="range"] {
+.wspr-filter-control input[type='range'] {
   transition: all 0.2s ease;
 }
 
@@ -679,7 +766,7 @@ body::before {
   outline: none;
 }
 
-.wspr-filter-control input[type="range"]::-webkit-slider-thumb {
+.wspr-filter-control input[type='range']::-webkit-slider-thumb {
   appearance: none;
   width: 16px;
   height: 16px;
@@ -689,11 +776,11 @@ body::before {
   transition: background 0.2s ease;
 }
 
-.wspr-filter-control input[type="range"]::-webkit-slider-thumb:hover {
+.wspr-filter-control input[type='range']::-webkit-slider-thumb:hover {
   background: #00ddff;
 }
 
-.wspr-filter-control input[type="range"]::-moz-range-thumb {
+.wspr-filter-control input[type='range']::-moz-range-thumb {
   width: 16px;
   height: 16px;
   border-radius: 50%;
@@ -703,7 +790,7 @@ body::before {
   transition: background 0.2s ease;
 }
 
-.wspr-filter-control input[type="range"]::-moz-range-thumb:hover {
+.wspr-filter-control input[type='range']::-moz-range-thumb:hover {
   background: #00ddff;
 }
 
@@ -717,21 +804,24 @@ body::before {
   }
 }
 
-.wspr-chart div[style*="background: linear-gradient"] {
+.wspr-chart div[style*='background: linear-gradient'] {
   animation: wspr-bar-grow 0.5s ease-out;
 }
 
 /* Propagation score glow effect */
 @keyframes wspr-score-glow {
-  0%, 100% {
+  0%,
+  100% {
     text-shadow: 0 0 5px currentColor;
   }
   50% {
-    text-shadow: 0 0 15px currentColor, 0 0 25px currentColor;
+    text-shadow:
+      0 0 15px currentColor,
+      0 0 25px currentColor;
   }
 }
 
-.wspr-stats div[style*="font-size: 18px"] {
+.wspr-stats div[style*='font-size: 18px'] {
   animation: wspr-score-glow 2s ease-in-out infinite;
 }
 
@@ -1027,9 +1117,11 @@ body::before {
 #night-lights-pane {
   z-index: 650 !important;
   pointer-events: none;
-  mix-blend-mode: screen; 
+  mix-blend-mode: screen;
   filter: contrast(1.2);
-  transition: opacity 0.2s ease, clip-path 0.5s ease-in-out;
+  transition:
+    opacity 0.2s ease,
+    clip-path 0.5s ease-in-out;
 }
 
 .terminator-path {
@@ -1037,8 +1129,7 @@ body::before {
   z-index: 400 !important; /* Sit behind the city lights but in front of the map */
 }
 
-
 /* Hide city lights completely in 'Countries' or high-contrast modes */
-[data-theme="retro"] #night-lights-pane {
+[data-theme='retro'] #night-lights-pane {
   display: none;
 }
diff --git a/src/utils/apiFetch.js b/src/utils/apiFetch.js
index 934e3a9a..69ba79db 100644
--- a/src/utils/apiFetch.js
+++ b/src/utils/apiFetch.js
@@ -1,11 +1,11 @@
 /**
  * apiFetch — drop-in replacement for fetch() with shared 429 backoff.
- * 
+ *
  * When any API call gets a 429, ALL subsequent apiFetch calls pause
  * for the backoff period (default 30s, or per Retry-After header).
  * This prevents a 429 cascade where dozens of hooks keep hammering
  * the server and making the rate limit situation worse.
- * 
+ *
  * Usage: import { apiFetch } from '../utils/apiFetch';
  *        const res = await apiFetch('/api/dxcluster/paths');
  *        // returns null during backoff (caller should handle gracefully)
@@ -15,14 +15,14 @@ let backedOffUntil = 0;
 
 export async function apiFetch(url, options) {
   const now = Date.now();
-  
+
   // If we're in a backoff period, skip the request entirely
   if (now < backedOffUntil) {
     return null;
   }
-  
+
   const response = await fetch(url, options);
-  
+
   if (response.status === 429) {
     // Parse Retry-After header (seconds) or default to 30s
     const retryAfter = response.headers.get('Retry-After');
@@ -30,7 +30,7 @@ export async function apiFetch(url, options) {
     backedOffUntil = Date.now() + backoffMs;
     console.warn(`[API] 429 rate limited — backing off ${backoffMs / 1000}s for all API calls`);
   }
-  
+
   return response;
 }
 
diff --git a/src/utils/bandPlan.js b/src/utils/bandPlan.js
index 7e320324..67a297b1 100644
--- a/src/utils/bandPlan.js
+++ b/src/utils/bandPlan.js
@@ -1,4 +1,4 @@
-import bandPlan from "./bandplan.json";
+import bandPlan from './bandplan.json';
 
 /**
  * Band Plan Utilities
@@ -11,7 +11,7 @@ import bandPlan from "./bandplan.json";
  * @returns {string} - 'LSB', 'USB', 'CW', 'FM', 'AM'
  */
 export const getModeFromFreq = (hz) => {
-  if (!hz) return "USB"; // Default safe fallback
+  if (!hz) return 'USB'; // Default safe fallback
 
   const khz = hz / 1000;
   const mhz = hz / 1000000;
@@ -26,8 +26,8 @@ export const getModeFromFreq = (hz) => {
   // Generic Rules if outside specific ham bands
   // < 10 MHz -> LSB
   // >= 10 MHz -> USB
-  if (mhz < 10) return "LSB";
-  return "USB";
+  if (mhz < 10) return 'LSB';
+  return 'USB';
 };
 
 /**
@@ -36,14 +36,14 @@ export const getModeFromFreq = (hz) => {
  * @returns {string} - 'USB' or 'LSB'
  */
 export const getSideband = (hz) => {
-  if (!hz) return "USB";
+  if (!hz) return 'USB';
   const mhz = hz / 1000000;
 
   // Check for 60m exception (always USB)
-  if (mhz >= 5.3 && mhz <= 5.405) return "USB";
+  if (mhz >= 5.3 && mhz <= 5.405) return 'USB';
 
   // Standard rule: < 10MHz is LSB, >= 10MHz is USB
-  return mhz < 10 ? "LSB" : "USB";
+  return mhz < 10 ? 'LSB' : 'USB';
 };
 
 /**
@@ -54,29 +54,17 @@ export const getSideband = (hz) => {
  * @returns {string} - The mapped mode string
  */
 export const mapModeToRig = (mode, freq) => {
-  if (!mode) return "";
+  if (!mode) return '';
   const m = mode.toUpperCase();
   const sb = getSideband(freq);
 
-  const suffix = sb === "USB" ? "U" : "L";
+  const suffix = sb === 'USB' ? 'U' : 'L';
 
   // List of digital modes to map to sideband
-  const digitalModes = [
-    "FT8",
-    "FT4",
-    "JS8",
-    "WSPR",
-    "JT65",
-    "JT9",
-    "PSK31",
-    "PSK63",
-    "RTTY",
-    "DATA",
-    "PKT",
-  ];
+  const digitalModes = ['FT8', 'FT4', 'JS8', 'WSPR', 'JT65', 'JT9', 'PSK31', 'PSK63', 'RTTY', 'DATA', 'PKT'];
 
   // Map Digital, CW, and generic SSB to specific sideband
-  if (digitalModes.includes(m) || m === "CW" || m === "SSB") {
+  if (digitalModes.includes(m) || m === 'CW' || m === 'SSB') {
     return sb;
   }
 
diff --git a/src/utils/callsign.js b/src/utils/callsign.js
index e28e924c..a0f2f22b 100644
--- a/src/utils/callsign.js
+++ b/src/utils/callsign.js
@@ -2,46 +2,46 @@
  * Callsign and Band Utilities
  * Band detection, mode detection, callsign parsing
  */
-import { getBandColorForFreq } from "./bandColors.js";
-import { ctyLookup } from "./ctyLookup.js";
+import { getBandColorForFreq } from './bandColors.js';
+import { ctyLookup } from './ctyLookup.js';
 
 /**
  * HF Amateur Bands
  */
 export const HF_BANDS = [
-  "160m",
-  "80m",
-  "60m",
-  "40m",
-  "30m",
-  "20m",
-  "17m",
-  "15m",
-  "12m",
-  "11m",
-  "10m",
-  "6m",
-  "2m",
-  "70cm",
+  '160m',
+  '80m',
+  '60m',
+  '40m',
+  '30m',
+  '20m',
+  '17m',
+  '15m',
+  '12m',
+  '11m',
+  '10m',
+  '6m',
+  '2m',
+  '70cm',
 ];
 
 /**
  * Continents for DX filtering
  */
 export const CONTINENTS = [
-  { code: "NA", name: "North America" },
-  { code: "SA", name: "South America" },
-  { code: "EU", name: "Europe" },
-  { code: "AF", name: "Africa" },
-  { code: "AS", name: "Asia" },
-  { code: "OC", name: "Oceania" },
-  { code: "AN", name: "Antarctica" },
+  { code: 'NA', name: 'North America' },
+  { code: 'SA', name: 'South America' },
+  { code: 'EU', name: 'Europe' },
+  { code: 'AF', name: 'Africa' },
+  { code: 'AS', name: 'Asia' },
+  { code: 'OC', name: 'Oceania' },
+  { code: 'AN', name: 'Antarctica' },
 ];
 
 /**
  * Digital/Voice Modes
  */
-export const MODES = ["CW", "SSB", "FT8", "FT4", "RTTY", "PSK", "AM", "FM"];
+export const MODES = ['CW', 'SSB', 'FT8', 'FT4', 'RTTY', 'PSK', 'AM', 'FM'];
 
 /**
  * Get band from frequency (in kHz)
@@ -50,21 +50,21 @@ export const getBandFromFreq = (freq) => {
   const f = parseFloat(freq);
   // Handle MHz input (convert to kHz)
   const freqKhz = f < 1000 ? f * 1000 : f;
-  if (freqKhz >= 1800 && freqKhz <= 2000) return "160m";
-  if (freqKhz >= 3500 && freqKhz <= 4000) return "80m";
-  if (freqKhz >= 5330 && freqKhz <= 5405) return "60m";
-  if (freqKhz >= 7000 && freqKhz <= 7300) return "40m";
-  if (freqKhz >= 10100 && freqKhz <= 10150) return "30m";
-  if (freqKhz >= 14000 && freqKhz <= 14350) return "20m";
-  if (freqKhz >= 18068 && freqKhz <= 18168) return "17m";
-  if (freqKhz >= 21000 && freqKhz <= 21450) return "15m";
-  if (freqKhz >= 24890 && freqKhz <= 24990) return "12m";
-  if (freqKhz >= 26000 && freqKhz <= 28000) return "11m"; // CB band
-  if (freqKhz >= 28000 && freqKhz <= 29700) return "10m";
-  if (freqKhz >= 50000 && freqKhz <= 54000) return "6m";
-  if (freqKhz >= 144000 && freqKhz <= 148000) return "2m";
-  if (freqKhz >= 420000 && freqKhz <= 450000) return "70cm";
-  return "other";
+  if (freqKhz >= 1800 && freqKhz <= 2000) return '160m';
+  if (freqKhz >= 3500 && freqKhz <= 4000) return '80m';
+  if (freqKhz >= 5330 && freqKhz <= 5405) return '60m';
+  if (freqKhz >= 7000 && freqKhz <= 7300) return '40m';
+  if (freqKhz >= 10100 && freqKhz <= 10150) return '30m';
+  if (freqKhz >= 14000 && freqKhz <= 14350) return '20m';
+  if (freqKhz >= 18068 && freqKhz <= 18168) return '17m';
+  if (freqKhz >= 21000 && freqKhz <= 21450) return '15m';
+  if (freqKhz >= 24890 && freqKhz <= 24990) return '12m';
+  if (freqKhz >= 26000 && freqKhz <= 28000) return '11m'; // CB band
+  if (freqKhz >= 28000 && freqKhz <= 29700) return '10m';
+  if (freqKhz >= 50000 && freqKhz <= 54000) return '6m';
+  if (freqKhz >= 144000 && freqKhz <= 148000) return '2m';
+  if (freqKhz >= 420000 && freqKhz <= 450000) return '70cm';
+  return 'other';
 };
 
 /**
@@ -87,16 +87,15 @@ export const detectMode = (comment, freq) => {
   // 1) Try comment-based detection first (highest confidence)
   if (comment) {
     const upper = comment.toUpperCase();
-    if (upper.includes("FT8")) return "FT8";
-    if (upper.includes("FT4")) return "FT4";
-    if (upper.includes("CW")) return "CW";
-    if (upper.includes("SSB") || upper.includes("LSB") || upper.includes("USB"))
-      return "SSB";
-    if (upper.includes("RTTY")) return "RTTY";
-    if (upper.includes("PSK")) return "PSK";
+    if (upper.includes('FT8')) return 'FT8';
+    if (upper.includes('FT4')) return 'FT4';
+    if (upper.includes('CW')) return 'CW';
+    if (upper.includes('SSB') || upper.includes('LSB') || upper.includes('USB')) return 'SSB';
+    if (upper.includes('RTTY')) return 'RTTY';
+    if (upper.includes('PSK')) return 'PSK';
     // Check AM/FM carefully — "AM" appears in many callsigns/words
-    if (/\bAM\b/.test(upper)) return "AM";
-    if (/\bFM\b/.test(upper)) return "FM";
+    if (/\bAM\b/.test(upper)) return 'AM';
+    if (/\bFM\b/.test(upper)) return 'FM';
   }
 
   // 2) Frequency-based fallback
@@ -110,32 +109,32 @@ export const detectMode = (comment, freq) => {
   const TOLERANCE = 0.003;
   const DIGITAL_ISLANDS = [
     // FT8 calling frequencies
-    { mhz: 1.840, mode: "FT8" },
-    { mhz: 3.573, mode: "FT8" },
-    { mhz: 7.074, mode: "FT8" },
-    { mhz: 10.136, mode: "FT8" },
-    { mhz: 14.074, mode: "FT8" },
-    { mhz: 18.100, mode: "FT8" },
-    { mhz: 21.074, mode: "FT8" },
-    { mhz: 24.915, mode: "FT8" },
-    { mhz: 28.074, mode: "FT8" },
-    { mhz: 50.313, mode: "FT8" },
+    { mhz: 1.84, mode: 'FT8' },
+    { mhz: 3.573, mode: 'FT8' },
+    { mhz: 7.074, mode: 'FT8' },
+    { mhz: 10.136, mode: 'FT8' },
+    { mhz: 14.074, mode: 'FT8' },
+    { mhz: 18.1, mode: 'FT8' },
+    { mhz: 21.074, mode: 'FT8' },
+    { mhz: 24.915, mode: 'FT8' },
+    { mhz: 28.074, mode: 'FT8' },
+    { mhz: 50.313, mode: 'FT8' },
     // FT4 calling frequencies
-    { mhz: 3.575, mode: "FT4" },
-    { mhz: 7.0475, mode: "FT4" },
-    { mhz: 10.140, mode: "FT4" },
-    { mhz: 14.080, mode: "FT4" },
-    { mhz: 18.104, mode: "FT4" },
-    { mhz: 21.140, mode: "FT4" },
-    { mhz: 24.919, mode: "FT4" },
-    { mhz: 28.180, mode: "FT4" },
-    { mhz: 50.318, mode: "FT4" },
+    { mhz: 3.575, mode: 'FT4' },
+    { mhz: 7.0475, mode: 'FT4' },
+    { mhz: 10.14, mode: 'FT4' },
+    { mhz: 14.08, mode: 'FT4' },
+    { mhz: 18.104, mode: 'FT4' },
+    { mhz: 21.14, mode: 'FT4' },
+    { mhz: 24.919, mode: 'FT4' },
+    { mhz: 28.18, mode: 'FT4' },
+    { mhz: 50.318, mode: 'FT4' },
     // RTTY common frequencies
-    { mhz: 3.580, mode: "RTTY" },
-    { mhz: 7.035, mode: "RTTY" },
-    { mhz: 14.080, mode: "RTTY" }, // Note: overlaps FT4 — FT4 checked first
-    { mhz: 21.080, mode: "RTTY" },
-    { mhz: 28.080, mode: "RTTY" },
+    { mhz: 3.58, mode: 'RTTY' },
+    { mhz: 7.035, mode: 'RTTY' },
+    { mhz: 14.08, mode: 'RTTY' }, // Note: overlaps FT4 — FT4 checked first
+    { mhz: 21.08, mode: 'RTTY' },
+    { mhz: 28.08, mode: 'RTTY' },
   ];
 
   for (const island of DIGITAL_ISLANDS) {
@@ -146,29 +145,29 @@ export const detectMode = (comment, freq) => {
 
   // Band plan segments — CW vs SSB by frequency range
   // These are broader and lower confidence, but good enough for filtering
-  if (mhz >= 1.800 && mhz < 1.840) return "CW";
-  if (mhz >= 1.840 && mhz <= 2.000) return "SSB";
-  if (mhz >= 3.500 && mhz < 3.600) return "CW";
-  if (mhz >= 3.600 && mhz <= 4.000) return "SSB";
-  if (mhz >= 7.000 && mhz < 7.050) return "CW";
-  if (mhz >= 7.050 && mhz < 7.070) return "CW"; // CW/digital segment
-  if (mhz >= 7.150 && mhz <= 7.300) return "SSB";
-  if (mhz >= 10.100 && mhz <= 10.150) return "CW";
-  if (mhz >= 14.000 && mhz < 14.070) return "CW";
-  if (mhz >= 14.150 && mhz <= 14.350) return "SSB";
-  if (mhz >= 18.068 && mhz < 18.095) return "CW";
-  if (mhz >= 18.110 && mhz <= 18.168) return "SSB";
-  if (mhz >= 21.000 && mhz < 21.070) return "CW";
-  if (mhz >= 21.150 && mhz <= 21.450) return "SSB";
-  if (mhz >= 24.890 && mhz < 24.910) return "CW";
-  if (mhz >= 24.930 && mhz <= 24.990) return "SSB";
-  if (mhz >= 28.000 && mhz < 28.070) return "CW";
-  if (mhz >= 28.300 && mhz <= 29.000) return "SSB";
-  if (mhz >= 50.000 && mhz < 50.100) return "CW";
-  if (mhz >= 50.100 && mhz <= 50.300) return "SSB";
+  if (mhz >= 1.8 && mhz < 1.84) return 'CW';
+  if (mhz >= 1.84 && mhz <= 2.0) return 'SSB';
+  if (mhz >= 3.5 && mhz < 3.6) return 'CW';
+  if (mhz >= 3.6 && mhz <= 4.0) return 'SSB';
+  if (mhz >= 7.0 && mhz < 7.05) return 'CW';
+  if (mhz >= 7.05 && mhz < 7.07) return 'CW'; // CW/digital segment
+  if (mhz >= 7.15 && mhz <= 7.3) return 'SSB';
+  if (mhz >= 10.1 && mhz <= 10.15) return 'CW';
+  if (mhz >= 14.0 && mhz < 14.07) return 'CW';
+  if (mhz >= 14.15 && mhz <= 14.35) return 'SSB';
+  if (mhz >= 18.068 && mhz < 18.095) return 'CW';
+  if (mhz >= 18.11 && mhz <= 18.168) return 'SSB';
+  if (mhz >= 21.0 && mhz < 21.07) return 'CW';
+  if (mhz >= 21.15 && mhz <= 21.45) return 'SSB';
+  if (mhz >= 24.89 && mhz < 24.91) return 'CW';
+  if (mhz >= 24.93 && mhz <= 24.99) return 'SSB';
+  if (mhz >= 28.0 && mhz < 28.07) return 'CW';
+  if (mhz >= 28.3 && mhz <= 29.0) return 'SSB';
+  if (mhz >= 50.0 && mhz < 50.1) return 'CW';
+  if (mhz >= 50.1 && mhz <= 50.3) return 'SSB';
   // 2m/70cm FM simplex
-  if (mhz >= 144.000 && mhz <= 148.000) return "FM";
-  if (mhz >= 420.000 && mhz <= 450.000) return "FM";
+  if (mhz >= 144.0 && mhz <= 148.0) return 'FM';
+  if (mhz >= 420.0 && mhz <= 450.0) return 'FM';
 
   return null;
 };
@@ -178,152 +177,152 @@ export const detectMode = (comment, freq) => {
  */
 export const PREFIX_MAP = {
   // North America
-  W: { cq: 5, itu: 8, cont: "NA" },
-  K: { cq: 5, itu: 8, cont: "NA" },
-  N: { cq: 5, itu: 8, cont: "NA" },
-  AA: { cq: 5, itu: 8, cont: "NA" },
-  VE: { cq: 5, itu: 4, cont: "NA" },
-  VA: { cq: 5, itu: 4, cont: "NA" },
-  XE: { cq: 6, itu: 10, cont: "NA" },
-  XF: { cq: 6, itu: 10, cont: "NA" },
+  W: { cq: 5, itu: 8, cont: 'NA' },
+  K: { cq: 5, itu: 8, cont: 'NA' },
+  N: { cq: 5, itu: 8, cont: 'NA' },
+  AA: { cq: 5, itu: 8, cont: 'NA' },
+  VE: { cq: 5, itu: 4, cont: 'NA' },
+  VA: { cq: 5, itu: 4, cont: 'NA' },
+  XE: { cq: 6, itu: 10, cont: 'NA' },
+  XF: { cq: 6, itu: 10, cont: 'NA' },
   // Europe
-  G: { cq: 14, itu: 27, cont: "EU" },
-  M: { cq: 14, itu: 27, cont: "EU" },
-  F: { cq: 14, itu: 27, cont: "EU" },
-  DL: { cq: 14, itu: 28, cont: "EU" },
-  DJ: { cq: 14, itu: 28, cont: "EU" },
-  DK: { cq: 14, itu: 28, cont: "EU" },
-  PA: { cq: 14, itu: 27, cont: "EU" },
-  ON: { cq: 14, itu: 27, cont: "EU" },
-  EA: { cq: 14, itu: 37, cont: "EU" },
-  I: { cq: 15, itu: 28, cont: "EU" },
-  SP: { cq: 15, itu: 28, cont: "EU" },
-  OK: { cq: 15, itu: 28, cont: "EU" },
-  OM: { cq: 15, itu: 28, cont: "EU" },
-  HA: { cq: 15, itu: 28, cont: "EU" },
-  OE: { cq: 15, itu: 28, cont: "EU" },
-  HB: { cq: 14, itu: 28, cont: "EU" },
-  SM: { cq: 14, itu: 18, cont: "EU" },
-  LA: { cq: 14, itu: 18, cont: "EU" },
-  OH: { cq: 15, itu: 18, cont: "EU" },
-  OZ: { cq: 14, itu: 18, cont: "EU" },
-  UA: { cq: 16, itu: 29, cont: "EU" },
-  RA: { cq: 16, itu: 29, cont: "EU" },
-  RU: { cq: 16, itu: 29, cont: "EU" },
-  RW: { cq: 16, itu: 29, cont: "EU" },
-  UR: { cq: 16, itu: 29, cont: "EU" },
-  UT: { cq: 16, itu: 29, cont: "EU" },
-  YU: { cq: 15, itu: 28, cont: "EU" },
-  YT: { cq: 15, itu: 28, cont: "EU" },
-  LY: { cq: 15, itu: 29, cont: "EU" },
-  ES: { cq: 15, itu: 29, cont: "EU" },
-  YL: { cq: 15, itu: 29, cont: "EU" },
-  EI: { cq: 14, itu: 27, cont: "EU" },
-  GI: { cq: 14, itu: 27, cont: "EU" },
-  GW: { cq: 14, itu: 27, cont: "EU" },
-  GM: { cq: 14, itu: 27, cont: "EU" },
-  CT: { cq: 14, itu: 37, cont: "EU" },
-  SV: { cq: 20, itu: 28, cont: "EU" },
-  "9A": { cq: 15, itu: 28, cont: "EU" },
-  S5: { cq: 15, itu: 28, cont: "EU" },
-  LZ: { cq: 20, itu: 28, cont: "EU" },
-  YO: { cq: 20, itu: 28, cont: "EU" },
+  G: { cq: 14, itu: 27, cont: 'EU' },
+  M: { cq: 14, itu: 27, cont: 'EU' },
+  F: { cq: 14, itu: 27, cont: 'EU' },
+  DL: { cq: 14, itu: 28, cont: 'EU' },
+  DJ: { cq: 14, itu: 28, cont: 'EU' },
+  DK: { cq: 14, itu: 28, cont: 'EU' },
+  PA: { cq: 14, itu: 27, cont: 'EU' },
+  ON: { cq: 14, itu: 27, cont: 'EU' },
+  EA: { cq: 14, itu: 37, cont: 'EU' },
+  I: { cq: 15, itu: 28, cont: 'EU' },
+  SP: { cq: 15, itu: 28, cont: 'EU' },
+  OK: { cq: 15, itu: 28, cont: 'EU' },
+  OM: { cq: 15, itu: 28, cont: 'EU' },
+  HA: { cq: 15, itu: 28, cont: 'EU' },
+  OE: { cq: 15, itu: 28, cont: 'EU' },
+  HB: { cq: 14, itu: 28, cont: 'EU' },
+  SM: { cq: 14, itu: 18, cont: 'EU' },
+  LA: { cq: 14, itu: 18, cont: 'EU' },
+  OH: { cq: 15, itu: 18, cont: 'EU' },
+  OZ: { cq: 14, itu: 18, cont: 'EU' },
+  UA: { cq: 16, itu: 29, cont: 'EU' },
+  RA: { cq: 16, itu: 29, cont: 'EU' },
+  RU: { cq: 16, itu: 29, cont: 'EU' },
+  RW: { cq: 16, itu: 29, cont: 'EU' },
+  UR: { cq: 16, itu: 29, cont: 'EU' },
+  UT: { cq: 16, itu: 29, cont: 'EU' },
+  YU: { cq: 15, itu: 28, cont: 'EU' },
+  YT: { cq: 15, itu: 28, cont: 'EU' },
+  LY: { cq: 15, itu: 29, cont: 'EU' },
+  ES: { cq: 15, itu: 29, cont: 'EU' },
+  YL: { cq: 15, itu: 29, cont: 'EU' },
+  EI: { cq: 14, itu: 27, cont: 'EU' },
+  GI: { cq: 14, itu: 27, cont: 'EU' },
+  GW: { cq: 14, itu: 27, cont: 'EU' },
+  GM: { cq: 14, itu: 27, cont: 'EU' },
+  CT: { cq: 14, itu: 37, cont: 'EU' },
+  SV: { cq: 20, itu: 28, cont: 'EU' },
+  '9A': { cq: 15, itu: 28, cont: 'EU' },
+  S5: { cq: 15, itu: 28, cont: 'EU' },
+  LZ: { cq: 20, itu: 28, cont: 'EU' },
+  YO: { cq: 20, itu: 28, cont: 'EU' },
   // Asia
-  JA: { cq: 25, itu: 45, cont: "AS" },
-  JH: { cq: 25, itu: 45, cont: "AS" },
-  JR: { cq: 25, itu: 45, cont: "AS" },
-  JE: { cq: 25, itu: 45, cont: "AS" },
-  JF: { cq: 25, itu: 45, cont: "AS" },
-  JG: { cq: 25, itu: 45, cont: "AS" },
-  JI: { cq: 25, itu: 45, cont: "AS" },
-  JJ: { cq: 25, itu: 45, cont: "AS" },
-  JK: { cq: 25, itu: 45, cont: "AS" },
-  JL: { cq: 25, itu: 45, cont: "AS" },
-  JM: { cq: 25, itu: 45, cont: "AS" },
-  JN: { cq: 25, itu: 45, cont: "AS" },
-  JO: { cq: 25, itu: 45, cont: "AS" },
-  JP: { cq: 25, itu: 45, cont: "AS" },
-  JQ: { cq: 25, itu: 45, cont: "AS" },
-  JS: { cq: 25, itu: 45, cont: "AS" },
-  HL: { cq: 25, itu: 44, cont: "AS" },
-  DS: { cq: 25, itu: 44, cont: "AS" },
-  BY: { cq: 24, itu: 44, cont: "AS" },
-  BV: { cq: 24, itu: 44, cont: "AS" },
-  VU: { cq: 22, itu: 41, cont: "AS" },
-  DU: { cq: 27, itu: 50, cont: "OC" },
-  "9M": { cq: 28, itu: 54, cont: "AS" },
-  HS: { cq: 26, itu: 49, cont: "AS" },
-  XV: { cq: 26, itu: 49, cont: "AS" },
+  JA: { cq: 25, itu: 45, cont: 'AS' },
+  JH: { cq: 25, itu: 45, cont: 'AS' },
+  JR: { cq: 25, itu: 45, cont: 'AS' },
+  JE: { cq: 25, itu: 45, cont: 'AS' },
+  JF: { cq: 25, itu: 45, cont: 'AS' },
+  JG: { cq: 25, itu: 45, cont: 'AS' },
+  JI: { cq: 25, itu: 45, cont: 'AS' },
+  JJ: { cq: 25, itu: 45, cont: 'AS' },
+  JK: { cq: 25, itu: 45, cont: 'AS' },
+  JL: { cq: 25, itu: 45, cont: 'AS' },
+  JM: { cq: 25, itu: 45, cont: 'AS' },
+  JN: { cq: 25, itu: 45, cont: 'AS' },
+  JO: { cq: 25, itu: 45, cont: 'AS' },
+  JP: { cq: 25, itu: 45, cont: 'AS' },
+  JQ: { cq: 25, itu: 45, cont: 'AS' },
+  JS: { cq: 25, itu: 45, cont: 'AS' },
+  HL: { cq: 25, itu: 44, cont: 'AS' },
+  DS: { cq: 25, itu: 44, cont: 'AS' },
+  BY: { cq: 24, itu: 44, cont: 'AS' },
+  BV: { cq: 24, itu: 44, cont: 'AS' },
+  VU: { cq: 22, itu: 41, cont: 'AS' },
+  DU: { cq: 27, itu: 50, cont: 'OC' },
+  '9M': { cq: 28, itu: 54, cont: 'AS' },
+  HS: { cq: 26, itu: 49, cont: 'AS' },
+  XV: { cq: 26, itu: 49, cont: 'AS' },
   // Oceania
-  VK: { cq: 30, itu: 59, cont: "OC" },
-  ZL: { cq: 32, itu: 60, cont: "OC" },
-  FK: { cq: 32, itu: 56, cont: "OC" },
-  VK9: { cq: 30, itu: 60, cont: "OC" },
-  YB: { cq: 28, itu: 51, cont: "OC" },
-  KH6: { cq: 31, itu: 61, cont: "OC" },
-  KH2: { cq: 27, itu: 64, cont: "OC" },
+  VK: { cq: 30, itu: 59, cont: 'OC' },
+  ZL: { cq: 32, itu: 60, cont: 'OC' },
+  FK: { cq: 32, itu: 56, cont: 'OC' },
+  VK9: { cq: 30, itu: 60, cont: 'OC' },
+  YB: { cq: 28, itu: 51, cont: 'OC' },
+  KH6: { cq: 31, itu: 61, cont: 'OC' },
+  KH2: { cq: 27, itu: 64, cont: 'OC' },
   // South America
-  LU: { cq: 13, itu: 14, cont: "SA" },
-  PY: { cq: 11, itu: 15, cont: "SA" },
-  CE: { cq: 12, itu: 14, cont: "SA" },
-  CX: { cq: 13, itu: 14, cont: "SA" },
-  HK: { cq: 9, itu: 12, cont: "SA" },
-  YV: { cq: 9, itu: 12, cont: "SA" },
-  HC: { cq: 10, itu: 12, cont: "SA" },
-  OA: { cq: 10, itu: 12, cont: "SA" },
+  LU: { cq: 13, itu: 14, cont: 'SA' },
+  PY: { cq: 11, itu: 15, cont: 'SA' },
+  CE: { cq: 12, itu: 14, cont: 'SA' },
+  CX: { cq: 13, itu: 14, cont: 'SA' },
+  HK: { cq: 9, itu: 12, cont: 'SA' },
+  YV: { cq: 9, itu: 12, cont: 'SA' },
+  HC: { cq: 10, itu: 12, cont: 'SA' },
+  OA: { cq: 10, itu: 12, cont: 'SA' },
   // Africa
-  ZS: { cq: 38, itu: 57, cont: "AF" },
-  "5N": { cq: 35, itu: 46, cont: "AF" },
-  EA8: { cq: 33, itu: 36, cont: "AF" },
-  CN: { cq: 33, itu: 37, cont: "AF" },
-  "7X": { cq: 33, itu: 37, cont: "AF" },
-  SU: { cq: 34, itu: 38, cont: "AF" },
-  ST: { cq: 34, itu: 47, cont: "AF" },
-  ET: { cq: 37, itu: 48, cont: "AF" },
-  "5Z": { cq: 37, itu: 48, cont: "AF" },
-  "5H": { cq: 37, itu: 53, cont: "AF" },
+  ZS: { cq: 38, itu: 57, cont: 'AF' },
+  '5N': { cq: 35, itu: 46, cont: 'AF' },
+  EA8: { cq: 33, itu: 36, cont: 'AF' },
+  CN: { cq: 33, itu: 37, cont: 'AF' },
+  '7X': { cq: 33, itu: 37, cont: 'AF' },
+  SU: { cq: 34, itu: 38, cont: 'AF' },
+  ST: { cq: 34, itu: 47, cont: 'AF' },
+  ET: { cq: 37, itu: 48, cont: 'AF' },
+  '5Z': { cq: 37, itu: 48, cont: 'AF' },
+  '5H': { cq: 37, itu: 53, cont: 'AF' },
   // Caribbean
-  VP5: { cq: 8, itu: 11, cont: "NA" },
-  PJ: { cq: 9, itu: 11, cont: "SA" },
-  HI: { cq: 8, itu: 11, cont: "NA" },
-  CO: { cq: 8, itu: 11, cont: "NA" },
-  KP4: { cq: 8, itu: 11, cont: "NA" },
-  FG: { cq: 8, itu: 11, cont: "NA" },
+  VP5: { cq: 8, itu: 11, cont: 'NA' },
+  PJ: { cq: 9, itu: 11, cont: 'SA' },
+  HI: { cq: 8, itu: 11, cont: 'NA' },
+  CO: { cq: 8, itu: 11, cont: 'NA' },
+  KP4: { cq: 8, itu: 11, cont: 'NA' },
+  FG: { cq: 8, itu: 11, cont: 'NA' },
   // Antarctica
-  DP0: { cq: 38, itu: 67, cont: "AN" },
-  VP8: { cq: 13, itu: 73, cont: "AN" },
-  KC4: { cq: 13, itu: 67, cont: "AN" },
+  DP0: { cq: 38, itu: 67, cont: 'AN' },
+  VP8: { cq: 13, itu: 73, cont: 'AN' },
+  KC4: { cq: 13, itu: 67, cont: 'AN' },
 };
 
 /**
  * Fallback mapping based on first character
  */
 const FALLBACK_MAP = {
-  A: { cq: 21, itu: 39, cont: "AS" },
-  B: { cq: 24, itu: 44, cont: "AS" },
-  C: { cq: 14, itu: 27, cont: "EU" },
-  D: { cq: 14, itu: 28, cont: "EU" },
-  E: { cq: 14, itu: 27, cont: "EU" },
-  F: { cq: 14, itu: 27, cont: "EU" },
-  G: { cq: 14, itu: 27, cont: "EU" },
-  H: { cq: 14, itu: 27, cont: "EU" },
-  I: { cq: 15, itu: 28, cont: "EU" },
-  J: { cq: 25, itu: 45, cont: "AS" },
-  K: { cq: 5, itu: 8, cont: "NA" },
-  L: { cq: 13, itu: 14, cont: "SA" },
-  M: { cq: 14, itu: 27, cont: "EU" },
-  N: { cq: 5, itu: 8, cont: "NA" },
-  O: { cq: 15, itu: 18, cont: "EU" },
-  P: { cq: 11, itu: 15, cont: "SA" },
-  R: { cq: 16, itu: 29, cont: "EU" },
-  S: { cq: 15, itu: 28, cont: "EU" },
-  T: { cq: 37, itu: 48, cont: "AF" },
-  U: { cq: 16, itu: 29, cont: "EU" },
-  V: { cq: 5, itu: 4, cont: "NA" },
-  W: { cq: 5, itu: 8, cont: "NA" },
-  X: { cq: 6, itu: 10, cont: "NA" },
-  Y: { cq: 15, itu: 28, cont: "EU" },
-  Z: { cq: 38, itu: 57, cont: "AF" },
+  A: { cq: 21, itu: 39, cont: 'AS' },
+  B: { cq: 24, itu: 44, cont: 'AS' },
+  C: { cq: 14, itu: 27, cont: 'EU' },
+  D: { cq: 14, itu: 28, cont: 'EU' },
+  E: { cq: 14, itu: 27, cont: 'EU' },
+  F: { cq: 14, itu: 27, cont: 'EU' },
+  G: { cq: 14, itu: 27, cont: 'EU' },
+  H: { cq: 14, itu: 27, cont: 'EU' },
+  I: { cq: 15, itu: 28, cont: 'EU' },
+  J: { cq: 25, itu: 45, cont: 'AS' },
+  K: { cq: 5, itu: 8, cont: 'NA' },
+  L: { cq: 13, itu: 14, cont: 'SA' },
+  M: { cq: 14, itu: 27, cont: 'EU' },
+  N: { cq: 5, itu: 8, cont: 'NA' },
+  O: { cq: 15, itu: 18, cont: 'EU' },
+  P: { cq: 11, itu: 15, cont: 'SA' },
+  R: { cq: 16, itu: 29, cont: 'EU' },
+  S: { cq: 15, itu: 28, cont: 'EU' },
+  T: { cq: 37, itu: 48, cont: 'AF' },
+  U: { cq: 16, itu: 29, cont: 'EU' },
+  V: { cq: 5, itu: 4, cont: 'NA' },
+  W: { cq: 5, itu: 8, cont: 'NA' },
+  X: { cq: 6, itu: 10, cont: 'NA' },
+  Y: { cq: 15, itu: 28, cont: 'EU' },
+  Z: { cq: 38, itu: 57, cont: 'AF' },
 };
 
 /**
diff --git a/src/utils/config.js b/src/utils/config.js
index 8453cf08..acf7f2ec 100644
--- a/src/utils/config.js
+++ b/src/utils/config.js
@@ -1,31 +1,31 @@
 /**
  * Configuration Utilities
  * Handles app configuration, localStorage persistence, and theme management
- * 
+ *
  * Configuration priority:
  * 1. localStorage (user's browser settings)
  * 2. Server config (from .env file)
  * 3. Default values
  */
-  // Map offset for MODIS Gibs imagery to attempt to load latest global planetary coverage
-  const getGIBSUrl = (offsetDays = 0) => {
-    // Subtracts offsetDays and 12 hours to ensure a complete global pass
-    const date = new Date(Date.now() - (offsetDays * 24 + 12) * 60 * 60 * 1000);
-    const dateString = date.toISOString().split('T')[0];
-    
-    return `https://gibs.earthdata.nasa.gov/wmts/epsg3857/best/MODIS_Terra_CorrectedReflectance_TrueColor/default/${dateString}/GoogleMapsCompatible_Level9/{z}/{y}/{x}.jpg`;
-  };
-  // *Offset delay end code here *
-  export const DEFAULT_CONFIG = {
+// Map offset for MODIS Gibs imagery to attempt to load latest global planetary coverage
+const getGIBSUrl = (offsetDays = 0) => {
+  // Subtracts offsetDays and 12 hours to ensure a complete global pass
+  const date = new Date(Date.now() - (offsetDays * 24 + 12) * 60 * 60 * 1000);
+  const dateString = date.toISOString().split('T')[0];
+
+  return `https://gibs.earthdata.nasa.gov/wmts/epsg3857/best/MODIS_Terra_CorrectedReflectance_TrueColor/default/${dateString}/GoogleMapsCompatible_Level9/{z}/{y}/{x}.jpg`;
+};
+// *Offset delay end code here *
+export const DEFAULT_CONFIG = {
   callsign: 'N0CALL',
   headerSize: 1.0, // Float multiplies base px size (0.1 to 2.0)
   locator: '',
-  location: { lat: 40.0150, lon: -105.2705 }, // Boulder, CO (default)
+  location: { lat: 40.015, lon: -105.2705 }, // Boulder, CO (default)
   defaultDX: { lat: 35.6762, lon: 139.6503 }, // Tokyo
   units: 'imperial', // 'imperial' or 'metric'
   propagation: {
-    mode: 'SSB',    // SSB, CW, FT8, FT4, WSPR, JS8, RTTY, PSK31
-    power: 100      // TX power in watts
+    mode: 'SSB', // SSB, CW, FT8, FT4, WSPR, JS8, RTTY, PSK31
+    power: 100, // TX power in watts
   },
   theme: 'dark', // 'dark', 'light', 'legacy', or 'retro'
   layout: 'modern', // 'modern' or 'classic'
@@ -47,15 +47,15 @@
     pskReporter: { visible: true, size: 1.0 },
     dxpeditions: { visible: true, size: 1.0 },
     pota: { visible: true, size: 1.0 },
-    contests: { visible: true, size: 1.0 }
+    contests: { visible: true, size: 1.0 },
   },
   refreshIntervals: {
-    spaceWeather: 300000,   // 5 minutes
+    spaceWeather: 300000, // 5 minutes
     bandConditions: 300000, // 5 minutes
-    pota: 120000,           // 2 minutes (was 1 min)
-    dxCluster: 30000,       // 30 seconds (was 5 sec)
-    terminator: 60000       // 1 minute
-  }
+    pota: 120000, // 2 minutes (was 1 min)
+    dxCluster: 30000, // 30 seconds (was 5 sec)
+    terminator: 60000, // 1 minute
+  },
 };
 
 // Cache for server config
@@ -89,7 +89,7 @@ export const fetchServerConfig = async () => {
 export const loadConfig = () => {
   // Start with defaults
   let config = { ...DEFAULT_CONFIG };
-  
+
   // Try to load from localStorage FIRST (user's saved settings)
   let localConfig = null;
   try {
@@ -101,7 +101,7 @@ export const loadConfig = () => {
   } catch (e) {
     console.error('Error loading config from localStorage:', e);
   }
-  
+
   // If user has localStorage config, use it (this is the priority)
   if (localConfig) {
     config = {
@@ -111,25 +111,24 @@ export const loadConfig = () => {
       location: localConfig.location || config.location,
       defaultDX: localConfig.defaultDX || config.defaultDX,
       panels: { ...config.panels, ...localConfig.panels },
-      refreshIntervals: { ...config.refreshIntervals, ...localConfig.refreshIntervals }
+      refreshIntervals: { ...config.refreshIntervals, ...localConfig.refreshIntervals },
     };
-  } 
+  }
   // Only use server config if NO localStorage exists (first-time user)
   else if (serverConfig) {
     // Server config provides initial defaults for new users
     // But only if they have real values (not N0CALL)
     config = {
       ...config,
-      callsign: (serverConfig.callsign && serverConfig.callsign !== 'N0CALL')
-        ? serverConfig.callsign : config.callsign,
+      callsign: serverConfig.callsign && serverConfig.callsign !== 'N0CALL' ? serverConfig.callsign : config.callsign,
       locator: serverConfig.locator || config.locator,
       location: {
         lat: serverConfig.latitude || config.location.lat,
-        lon: serverConfig.longitude || config.location.lon
+        lon: serverConfig.longitude || config.location.lon,
       },
       defaultDX: {
         lat: serverConfig.dxLatitude || config.defaultDX.lat,
-        lon: serverConfig.dxLongitude || config.defaultDX.lon
+        lon: serverConfig.dxLongitude || config.defaultDX.lon,
       },
       units: serverConfig.units || config.units,
       theme: serverConfig.theme || config.theme,
@@ -140,18 +139,18 @@ export const loadConfig = () => {
       showSatellites: serverConfig.showSatellites ?? config.showSatellites,
       showPota: serverConfig.showPota ?? config.showPota,
       showDxPaths: serverConfig.showDxPaths ?? config.showDxPaths,
-      panels: { ...config.panels, ...serverConfig.panels }
+      panels: { ...config.panels, ...serverConfig.panels },
     };
   }
-  
+
   // Mark if config needs setup (no callsign set anywhere)
-  config.configIncomplete = (config.callsign === 'N0CALL' || !config.locator);
-  
+  config.configIncomplete = config.callsign === 'N0CALL' || !config.locator;
+
   // Always inject version from server (not a user preference — server is source of truth)
   if (serverConfig?.version) {
     config.version = serverConfig.version;
   }
-  
+
   return config;
 };
 
@@ -212,11 +211,11 @@ export const fetchServerSettings = async () => {
     const response = await fetch('/api/settings');
     if (!response.ok) return false; // 404 = sync disabled, or server error
     const settings = await response.json();
-    
+
     // Check if sync is disabled (server returns { enabled: false })
     if (settings.enabled === false) return false;
     if (!settings || Object.keys(settings).length === 0) return false;
-    
+
     // Apply server settings to localStorage (server wins)
     let applied = 0;
     for (const [key, value] of Object.entries(settings)) {
@@ -225,7 +224,7 @@ export const fetchServerSettings = async () => {
         applied++;
       }
     }
-    
+
     if (applied > 0) {
       console.log(`[Config] Synced ${applied} settings from server`);
     }
@@ -243,7 +242,7 @@ export const fetchServerSettings = async () => {
 let _syncTimeout = null;
 export const syncAllSettingsToServer = () => {
   if (!_interceptorInstalled) return; // Sync not enabled — no-op
-  
+
   // Debounce: wait 2s after last change before pushing
   if (_syncTimeout) clearTimeout(_syncTimeout);
   _syncTimeout = setTimeout(async () => {
@@ -262,13 +261,13 @@ export const syncAllSettingsToServer = () => {
           settings[key] = localStorage.getItem(key);
         }
       }
-      
+
       const response = await fetch('/api/settings', {
         method: 'POST',
         headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify(settings)
+        body: JSON.stringify(settings),
       });
-      
+
       if (response.ok) {
         const result = await response.json();
         console.log(`[Config] Synced ${result.keys} settings to server`);
@@ -289,7 +288,7 @@ let _interceptorInstalled = false;
 export const installSettingsSyncInterceptor = () => {
   if (_interceptorInstalled) return;
   _interceptorInstalled = true;
-  
+
   const originalSetItem = localStorage.setItem.bind(localStorage);
   localStorage.setItem = (key, value) => {
     originalSetItem(key, value);
@@ -321,75 +320,76 @@ export const MAP_STYLES = {
   dark: {
     name: 'Dark',
     url: 'https://{s}.basemaps.cartocdn.com/dark_all/{z}/{x}/{y}{r}.png',
-    attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OSM</a> &copy; <a href="https://carto.com/">CARTO</a>'
+    attribution:
+      '&copy; <a href="https://www.openstreetmap.org/copyright">OSM</a> &copy; <a href="https://carto.com/">CARTO</a>',
   },
   darkEsri: {
     name: 'Dark (Esri)',
     url: 'https://services.arcgisonline.com/ArcGIS/rest/services/Canvas/World_Dark_Gray_Base/MapServer/tile/{z}/{y}/{x}',
-    attribution: '&copy; Esri'
+    attribution: '&copy; Esri',
   },
   satellite: {
     name: 'Satellite',
     url: 'https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}',
-    attribution: '&copy; Esri'
+    attribution: '&copy; Esri',
   },
   MODIS: {
     name: 'Modis Truecolor', // NASA GIBS MODIS Truecolor Imagery
-    url: '', // Handled dynamically in WorldMap.jsx 
-    attribution: '&copy; NASA GIBS'
+    url: '', // Handled dynamically in WorldMap.jsx
+    attribution: '&copy; NASA GIBS',
   },
   terrain: {
     name: 'Terrain',
     url: 'https://{s}.tile.opentopomap.org/{z}/{x}/{y}.png',
-    attribution: '&copy; <a href="https://opentopomap.org">OpenTopoMap</a>'
+    attribution: '&copy; <a href="https://opentopomap.org">OpenTopoMap</a>',
   },
   streets: {
     name: 'Streets',
     url: 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
-    attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a>'
+    attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a>',
   },
   topo: {
     name: 'Topo',
     url: 'https://services.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer/tile/{z}/{y}/{x}',
-    attribution: '&copy; Esri'
+    attribution: '&copy; Esri',
   },
   watercolor: {
     name: 'Ocean',
     url: 'https://services.arcgisonline.com/ArcGIS/rest/services/Ocean/World_Ocean_Base/MapServer/tile/{z}/{y}/{x}',
-    attribution: '&copy; Esri'
+    attribution: '&copy; Esri',
   },
   hybrid: {
     name: 'Hybrid',
     url: 'https://mt1.google.com/vt/lyrs=y&x={x}&y={y}&z={z}',
-    attribution: '&copy; Google'
+    attribution: '&copy; Google',
   },
   gray: {
     name: 'Gray',
     url: 'https://services.arcgisonline.com/ArcGIS/rest/services/Canvas/World_Light_Gray_Base/MapServer/tile/{z}/{y}/{x}',
-    attribution: '&copy; Esri'
+    attribution: '&copy; Esri',
   },
   political: {
     name: 'Political',
     url: 'https://services.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer/tile/{z}/{y}/{x}',
-    attribution: '&copy; Esri'
+    attribution: '&copy; Esri',
   },
   natgeo: {
     name: 'Nat Geo',
     url: 'https://services.arcgisonline.com/ArcGIS/rest/services/NatGeo_World_Map/MapServer/tile/{z}/{y}/{x}',
-    attribution: '&copy; Esri, National Geographic'
+    attribution: '&copy; Esri, National Geographic',
   },
   countries: {
     name: 'Countries',
     url: 'https://services.arcgisonline.com/ArcGIS/rest/services/Reference/World_Boundaries_and_Places/MapServer/tile/{z}/{y}/{x}',
     attribution: '&copy; Esri, Natural Earth',
-    countriesOverlay: true
+    countriesOverlay: true,
   },
   azimuthal: {
     name: 'Azimuthal',
     url: '',
     attribution: 'Azimuthal Equidistant',
-    isCanvas: true
-  }
+    isCanvas: true,
+  },
 };
 
 export default {
@@ -401,5 +401,5 @@ export default {
   saveConfig,
   isConfigIncomplete,
   applyTheme,
-  MAP_STYLES
+  MAP_STYLES,
 };
diff --git a/src/utils/ctyLookup.js b/src/utils/ctyLookup.js
index 4c3b8546..ebe37a5f 100644
--- a/src/utils/ctyLookup.js
+++ b/src/utils/ctyLookup.js
@@ -17,7 +17,7 @@
 import { apiFetch } from './apiFetch';
 
 let prefixes = null; // { PREFIX: { entity, dxcc, cq, itu, cont, lat, lon } }
-let exact = null;    // { CALLSIGN: { ... } }
+let exact = null; // { CALLSIGN: { ... } }
 let loaded = false;
 let loading = false;
 
diff --git a/src/utils/dxClusterFilters.js b/src/utils/dxClusterFilters.js
index 257900f2..703f92c0 100644
--- a/src/utils/dxClusterFilters.js
+++ b/src/utils/dxClusterFilters.js
@@ -1,4 +1,4 @@
-import {detectMode, getBandFromFreq, getCallsignInfo} from "./callsign";
+import { detectMode, getBandFromFreq, getCallsignInfo } from './callsign';
 
 /**
  * dxClusterFilters.js : DXCluster Filtering Utilities
@@ -15,14 +15,12 @@ import {detectMode, getBandFromFreq, getCallsignInfo} from "./callsign";
  * @returns {boolean} - true if item passes filters, false if filtered out
  */
 const applyWatchlistFilter = (filters, dxCall) => {
-    if (filters.watchlistOnly && filters.watchlist?.length > 0) {
-        const matchesWatchlist = filters.watchlist.some(w =>
-            dxCall?.toUpperCase().startsWith(w.toUpperCase())
-        );
-        if (!matchesWatchlist) return false;
-    }
-    return true;
-}
+  if (filters.watchlistOnly && filters.watchlist?.length > 0) {
+    const matchesWatchlist = filters.watchlist.some((w) => dxCall?.toUpperCase().startsWith(w.toUpperCase()));
+    if (!matchesWatchlist) return false;
+  }
+  return true;
+};
 
 /**
  * Applies the Spotter (DE) inclusion filters, which are specified in the UI 'Zones' tab of the DXCluster's 'Filters' dialog
@@ -43,36 +41,35 @@ const applyWatchlistFilter = (filters, dxCall) => {
  * @returns {boolean} - true if item passes filters, false if filtered out
  */
 const applySpotterInclusionFilters = (filters, spotterInfo, dxInfo) => {
-
-    // DE Continent 'include' filter - filter by SPOTTER's continent
-    // Also excludes domestic spots (DX in same continent as spotter)
-    if (filters.continents?.length > 0) {
-        // Spotter must be FROM one of the selected continents
-        if (!spotterInfo.continent || !filters.continents.includes(spotterInfo.continent)) {
-            return false;
-        }
-        // DX must be OUTSIDE the selected continents (exclude domestic spots)
-        if (dxInfo.continent && filters.continents.includes(dxInfo.continent)) {
-            return false;
-        }
+  // DE Continent 'include' filter - filter by SPOTTER's continent
+  // Also excludes domestic spots (DX in same continent as spotter)
+  if (filters.continents?.length > 0) {
+    // Spotter must be FROM one of the selected continents
+    if (!spotterInfo.continent || !filters.continents.includes(spotterInfo.continent)) {
+      return false;
+    }
+    // DX must be OUTSIDE the selected continents (exclude domestic spots)
+    if (dxInfo.continent && filters.continents.includes(dxInfo.continent)) {
+      return false;
     }
+  }
 
-    // DE CQ Zone 'include' filter - filter by SPOTTER's zone
-    if (filters.cqZones?.length > 0) {
-        if (!spotterInfo.cqZone || !filters.cqZones.includes(spotterInfo.cqZone)) {
-            return false;
-        }
+  // DE CQ Zone 'include' filter - filter by SPOTTER's zone
+  if (filters.cqZones?.length > 0) {
+    if (!spotterInfo.cqZone || !filters.cqZones.includes(spotterInfo.cqZone)) {
+      return false;
     }
+  }
 
-    // DE ITU Zone 'include' filter - filter by SPOTTER's zone
-    if (filters.ituZones?.length > 0) {
-        if (!spotterInfo.ituZone || !filters.ituZones.includes(spotterInfo.ituZone)) {
-            return false;
-        }
+  // DE ITU Zone 'include' filter - filter by SPOTTER's zone
+  if (filters.ituZones?.length > 0) {
+    if (!spotterInfo.ituZone || !filters.ituZones.includes(spotterInfo.ituZone)) {
+      return false;
     }
+  }
 
-    return true;
-}
+  return true;
+};
 
 /**
  * Applies the Spot (DX) exclusion filters, which are specified in the UI 'Exclude' tab of the DXCluster's 'Filters' dialog
@@ -91,54 +88,47 @@ const applySpotterInclusionFilters = (filters, spotterInfo, dxInfo) => {
  * @returns {boolean} - true if item passes filters, false if filtered out
  */
 const applySpotExclusionFilters = (filters, spotter, dxCall, dxInfo) => {
-
-    // DX (spot) Continent 'exclude' filter
-    if (filters.excludeContinents?.length > 0) {
-        if (dxInfo.continent && filters.excludeContinents.includes(dxInfo.continent)) {
-            return false;
-        }
-    }
-
-    // DX (spot) CQ Zone 'exclude' filter
-    if (filters.excludeCqZones?.length > 0) {
-        if (dxInfo.cqZone && filters.excludeCqZones.includes(dxInfo.cqZone)) {
-            return false;
-        }
+  // DX (spot) Continent 'exclude' filter
+  if (filters.excludeContinents?.length > 0) {
+    if (dxInfo.continent && filters.excludeContinents.includes(dxInfo.continent)) {
+      return false;
     }
+  }
 
-    // DX (spot) ITU Zone 'exclude' filter
-    if (filters.excludeItuZones?.length > 0) {
-        if (dxInfo.ituZone && filters.excludeItuZones.includes(dxInfo.ituZone)) {
-            return false;
-        }
+  // DX (spot) CQ Zone 'exclude' filter
+  if (filters.excludeCqZones?.length > 0) {
+    if (dxInfo.cqZone && filters.excludeCqZones.includes(dxInfo.cqZone)) {
+      return false;
     }
+  }
 
-    // DX (spot) Callsign 'exclude' filter - hide matching calls (prefix match)
-    if (filters.excludeDXCallList?.length > 0) {
-        const isExcluded = filters.excludeDXCallList.some(exc =>
-            dxCall?.toUpperCase().startsWith(exc.toUpperCase())
-        );
-        if (isExcluded) return false;
+  // DX (spot) ITU Zone 'exclude' filter
+  if (filters.excludeItuZones?.length > 0) {
+    if (dxInfo.ituZone && filters.excludeItuZones.includes(dxInfo.ituZone)) {
+      return false;
     }
-
-    // DE (spotter) Callsign 'exclude' filter - hide matching calls (prefix match)
-    if (filters.excludeDECallList?.length > 0) {
-        const isExcluded = filters.excludeDECallList.some(exc =>
-            spotter?.toUpperCase().startsWith(exc.toUpperCase())
-        );
-        if (isExcluded) return false;
-    }
-
-    // Legacy excludeList support (for backwards compatibility)
-    if (filters.excludeList?.length > 0) {
-        const isExcluded = filters.excludeList.some(exc =>
-            dxCall?.toUpperCase().startsWith(exc.toUpperCase())
-        );
-        if (isExcluded) return false;
-    }
-
-    return true;
-}
+  }
+
+  // DX (spot) Callsign 'exclude' filter - hide matching calls (prefix match)
+  if (filters.excludeDXCallList?.length > 0) {
+    const isExcluded = filters.excludeDXCallList.some((exc) => dxCall?.toUpperCase().startsWith(exc.toUpperCase()));
+    if (isExcluded) return false;
+  }
+
+  // DE (spotter) Callsign 'exclude' filter - hide matching calls (prefix match)
+  if (filters.excludeDECallList?.length > 0) {
+    const isExcluded = filters.excludeDECallList.some((exc) => spotter?.toUpperCase().startsWith(exc.toUpperCase()));
+    if (isExcluded) return false;
+  }
+
+  // Legacy excludeList support (for backwards compatibility)
+  if (filters.excludeList?.length > 0) {
+    const isExcluded = filters.excludeList.some((exc) => dxCall?.toUpperCase().startsWith(exc.toUpperCase()));
+    if (isExcluded) return false;
+  }
+
+  return true;
+};
 
 /**
  * Applies the Band filter, which is specified in the UI 'Bands' tab of the DXCluster's 'Filters' dialog
@@ -156,12 +146,12 @@ const applySpotExclusionFilters = (filters, spotter, dxCall, dxInfo) => {
  * @returns {boolean} - true if item passes filters, false if filtered out
  */
 const applyBandFilter = (item, filters) => {
-    if (filters.bands?.length > 0) {
-        const band = getBandFromFreq(parseFloat(item.freq) * 1000);
-        if (!filters.bands.includes(band)) return false;
-    }
-    return true;
-}
+  if (filters.bands?.length > 0) {
+    const band = getBandFromFreq(parseFloat(item.freq) * 1000);
+    if (!filters.bands.includes(band)) return false;
+  }
+  return true;
+};
 
 /**
  * Applies the Mode filter, which is specified in the UI 'Modes' tab of the DXCluster's 'Filters' dialog
@@ -179,12 +169,12 @@ const applyBandFilter = (item, filters) => {
  * @returns {boolean} - true if item passes filters, false if filtered out
  */
 const applyModeFilter = (item, filters) => {
-    if (filters.modes?.length > 0) {
-        const mode = detectMode(item.comment, item.freq);
-        if (!mode || !filters.modes.includes(mode)) return false;
-    }
-    return true;
-}
+  if (filters.modes?.length > 0) {
+    const mode = detectMode(item.comment, item.freq);
+    if (!mode || !filters.modes.includes(mode)) return false;
+  }
+  return true;
+};
 
 /**
  * Applies the Mode filter, which is specified in the UI 'Modes' tab of the DXCluster's 'Filters' dialog
@@ -197,15 +187,15 @@ const applyModeFilter = (item, filters) => {
  * @returns {boolean} - true if item passes filters, false if filtered out
  */
 const applyQuickSearchFilter = (filters, dxCall, spotter) => {
-    if (filters.callsign && filters.callsign.trim()) {
-        const search = filters.callsign.trim().toUpperCase();
-        const matchesCall = dxCall?.toUpperCase().includes(search);
-        const matchesSpotter = spotter?.toUpperCase().includes(search);
-        if (!matchesCall && !matchesSpotter) return false;
-    }
-
-    return true;
-}
+  if (filters.callsign && filters.callsign.trim()) {
+    const search = filters.callsign.trim().toUpperCase();
+    const matchesCall = dxCall?.toUpperCase().includes(search);
+    const matchesSpotter = spotter?.toUpperCase().includes(search);
+    if (!matchesCall && !matchesSpotter) return false;
+  }
+
+  return true;
+};
 
 /**
  * Apply DX filters to a single spot/path item
@@ -218,41 +208,40 @@ const applyQuickSearchFilter = (filters, dxCall, spotter) => {
  * @returns {boolean} - true if item passes filters, false if filtered out
  */
 export const applyDXFilters = (item, filters) => {
-    if (!filters || Object.keys(filters).length === 0) return true;
-
-    const spotter = item.spotter;
-    const spotterInfo = getCallsignInfo(spotter);
+  if (!filters || Object.keys(filters).length === 0) return true;
 
-    const dxCall = item.dxCall || item.call;
-    const dxInfo = getCallsignInfo(dxCall);
+  const spotter = item.spotter;
+  const spotterInfo = getCallsignInfo(spotter);
 
+  const dxCall = item.dxCall || item.call;
+  const dxInfo = getCallsignInfo(dxCall);
 
-    if(!applyWatchlistFilter(filters, dxCall)) {
-        return false;
-    }
+  if (!applyWatchlistFilter(filters, dxCall)) {
+    return false;
+  }
 
-    if(!applySpotterInclusionFilters(filters, spotterInfo, dxInfo)) {
-        return false;
-    }
+  if (!applySpotterInclusionFilters(filters, spotterInfo, dxInfo)) {
+    return false;
+  }
 
-    if(!applySpotExclusionFilters(filters, spotter, dxCall, dxInfo)) {
-        return false;
-    }
+  if (!applySpotExclusionFilters(filters, spotter, dxCall, dxInfo)) {
+    return false;
+  }
 
-    if(!applyBandFilter(item, filters)) {
-        return false
-    }
+  if (!applyBandFilter(item, filters)) {
+    return false;
+  }
 
-    if(!applyModeFilter(item, filters)) {
-        return false;
-    }
+  if (!applyModeFilter(item, filters)) {
+    return false;
+  }
 
-    if(!applyQuickSearchFilter(filters, dxCall, spotter)) {
-        return false;
-    }
+  if (!applyQuickSearchFilter(filters, dxCall, spotter)) {
+    return false;
+  }
 
-    // item passes (gets included)
-    return true;
+  // item passes (gets included)
+  return true;
 };
 
 /**
@@ -260,8 +249,8 @@ export const applyDXFilters = (item, filters) => {
  * Wrapper around applyDXFilters for filtering arrays
  */
 export const filterDXPaths = (paths, filters) => {
-    if (!paths || !filters) return paths;
-    if (Object.keys(filters).length === 0) return paths;
+  if (!paths || !filters) return paths;
+  if (Object.keys(filters).length === 0) return paths;
 
-    return paths.filter(item => applyDXFilters(item, filters));
-};
\ No newline at end of file
+  return paths.filter((item) => applyDXFilters(item, filters));
+};
diff --git a/src/utils/dxClusterFilters.test.js b/src/utils/dxClusterFilters.test.js
index 84efa477..12b9a520 100644
--- a/src/utils/dxClusterFilters.test.js
+++ b/src/utils/dxClusterFilters.test.js
@@ -574,9 +574,7 @@ describe('dxClusterFilters', () => {
     });
 
     it('should return original array when filters is null', () => {
-      const paths = [
-        { dxCall: 'W1AW', spotter: 'K2ABC', freq: '14.074', comment: 'FT8' },
-      ];
+      const paths = [{ dxCall: 'W1AW', spotter: 'K2ABC', freq: '14.074', comment: 'FT8' }];
       const result = filterDXPaths(paths, null);
       expect(result).toEqual(paths);
     });
diff --git a/src/utils/geo.js b/src/utils/geo.js
index b4e24a5c..10a8ca41 100644
--- a/src/utils/geo.js
+++ b/src/utils/geo.js
@@ -22,12 +22,12 @@ export const calculateGridSquare = (lat, lon) => {
  * Calculate bearing between two points
  */
 export const calculateBearing = (lat1, lon1, lat2, lon2) => {
-  const φ1 = lat1 * Math.PI / 180;
-  const φ2 = lat2 * Math.PI / 180;
-  const Δλ = (lon2 - lon1) * Math.PI / 180;
+  const φ1 = (lat1 * Math.PI) / 180;
+  const φ2 = (lat2 * Math.PI) / 180;
+  const Δλ = ((lon2 - lon1) * Math.PI) / 180;
   const y = Math.sin(Δλ) * Math.cos(φ2);
   const x = Math.cos(φ1) * Math.sin(φ2) - Math.sin(φ1) * Math.cos(φ2) * Math.cos(Δλ);
-  return (Math.atan2(y, x) * 180 / Math.PI + 360) % 360;
+  return ((Math.atan2(y, x) * 180) / Math.PI + 360) % 360;
 };
 
 /**
@@ -35,12 +35,12 @@ export const calculateBearing = (lat1, lon1, lat2, lon2) => {
  */
 export const calculateDistance = (lat1, lon1, lat2, lon2) => {
   const R = 6371;
-  const φ1 = lat1 * Math.PI / 180;
-  const φ2 = lat2 * Math.PI / 180;
-  const Δφ = (lat2 - lat1) * Math.PI / 180;
-  const Δλ = (lon2 - lon1) * Math.PI / 180;
-  const a = Math.sin(Δφ/2) ** 2 + Math.cos(φ1) * Math.cos(φ2) * Math.sin(Δλ/2) ** 2;
-  return R * 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1-a));
+  const φ1 = (lat1 * Math.PI) / 180;
+  const φ2 = (lat2 * Math.PI) / 180;
+  const Δφ = ((lat2 - lat1) * Math.PI) / 180;
+  const Δλ = ((lon2 - lon1) * Math.PI) / 180;
+  const a = Math.sin(Δφ / 2) ** 2 + Math.cos(φ1) * Math.cos(φ2) * Math.sin(Δλ / 2) ** 2;
+  return R * 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a));
 };
 
 /**
@@ -62,7 +62,7 @@ export const formatDistance = (km, units) => {
  */
 export const getSunPosition = (date) => {
   const dayOfYear = Math.floor((date - new Date(date.getFullYear(), 0, 0)) / 86400000);
-  const declination = -23.45 * Math.cos((360/365) * (dayOfYear + 10) * Math.PI / 180);
+  const declination = -23.45 * Math.cos(((360 / 365) * (dayOfYear + 10) * Math.PI) / 180);
   const hours = date.getUTCHours() + date.getUTCMinutes() / 60;
   const longitude = (12 - hours) * 15;
   return { lat: declination, lon: longitude };
@@ -75,66 +75,70 @@ export const getMoonPosition = (date) => {
   // Julian date calculation
   const JD = date.getTime() / 86400000 + 2440587.5;
   const T = (JD - 2451545.0) / 36525; // Julian centuries from J2000
-  
+
   // Moon's mean longitude
   const L0 = (218.316 + 481267.8813 * T) % 360;
-  
+
   // Moon's mean anomaly
   const M = (134.963 + 477198.8676 * T) % 360;
-  const MRad = M * Math.PI / 180;
-  
+  const MRad = (M * Math.PI) / 180;
+
   // Moon's mean elongation
-  const D = (297.850 + 445267.1115 * T) % 360;
-  const DRad = D * Math.PI / 180;
-  
+  const D = (297.85 + 445267.1115 * T) % 360;
+  const DRad = (D * Math.PI) / 180;
+
   // Sun's mean anomaly
   const Ms = (357.529 + 35999.0503 * T) % 360;
-  const MsRad = Ms * Math.PI / 180;
-  
+  const MsRad = (Ms * Math.PI) / 180;
+
   // Moon's argument of latitude
   const F = (93.272 + 483202.0175 * T) % 360;
-  const FRad = F * Math.PI / 180;
-  
+  const FRad = (F * Math.PI) / 180;
+
   // Longitude corrections (simplified)
-  const dL = 6.289 * Math.sin(MRad)
-           + 1.274 * Math.sin(2 * DRad - MRad)
-           + 0.658 * Math.sin(2 * DRad)
-           + 0.214 * Math.sin(2 * MRad)
-           - 0.186 * Math.sin(MsRad)
-           - 0.114 * Math.sin(2 * FRad);
-  
+  const dL =
+    6.289 * Math.sin(MRad) +
+    1.274 * Math.sin(2 * DRad - MRad) +
+    0.658 * Math.sin(2 * DRad) +
+    0.214 * Math.sin(2 * MRad) -
+    0.186 * Math.sin(MsRad) -
+    0.114 * Math.sin(2 * FRad);
+
   // Moon's ecliptic longitude
-  const moonLon = ((L0 + dL) % 360 + 360) % 360;
-  
+  const moonLon = (((L0 + dL) % 360) + 360) % 360;
+
   // Moon's ecliptic latitude (simplified)
-  const moonLat = 5.128 * Math.sin(FRad)
-                + 0.281 * Math.sin(MRad + FRad)
-                + 0.278 * Math.sin(MRad - FRad);
-  
+  const moonLat = 5.128 * Math.sin(FRad) + 0.281 * Math.sin(MRad + FRad) + 0.278 * Math.sin(MRad - FRad);
+
   // Convert ecliptic to equatorial coordinates
   const obliquity = 23.439 - 0.0000004 * (JD - 2451545.0);
-  const oblRad = obliquity * Math.PI / 180;
-  const moonLonRad = moonLon * Math.PI / 180;
-  const moonLatRad = moonLat * Math.PI / 180;
-  
+  const oblRad = (obliquity * Math.PI) / 180;
+  const moonLonRad = (moonLon * Math.PI) / 180;
+  const moonLatRad = (moonLat * Math.PI) / 180;
+
   // Right ascension
-  const RA = Math.atan2(
-    Math.sin(moonLonRad) * Math.cos(oblRad) - Math.tan(moonLatRad) * Math.sin(oblRad),
-    Math.cos(moonLonRad)
-  ) * 180 / Math.PI;
-  
+  const RA =
+    (Math.atan2(
+      Math.sin(moonLonRad) * Math.cos(oblRad) - Math.tan(moonLatRad) * Math.sin(oblRad),
+      Math.cos(moonLonRad),
+    ) *
+      180) /
+    Math.PI;
+
   // Declination
-  const dec = Math.asin(
-    Math.sin(moonLatRad) * Math.cos(oblRad) + 
-    Math.cos(moonLatRad) * Math.sin(oblRad) * Math.sin(moonLonRad)
-  ) * 180 / Math.PI;
-  
+  const dec =
+    (Math.asin(
+      Math.sin(moonLatRad) * Math.cos(oblRad) + Math.cos(moonLatRad) * Math.sin(oblRad) * Math.sin(moonLonRad),
+    ) *
+      180) /
+    Math.PI;
+
   // Greenwich Mean Sidereal Time
   const GMST = (280.46061837 + 360.98564736629 * (JD - 2451545.0)) % 360;
-  
+
   // Sublunar point longitude
-  const sublunarLon = ((RA - GMST) % 360 + 540) % 360 - 180;
-  
+  const sublunarLon = ((((RA - GMST) % 360) + 540) % 360) - 180;
+
   return { lat: dec, lon: sublunarLon };
 };
 
@@ -144,7 +148,7 @@ export const getMoonPosition = (date) => {
 export const getMoonPhase = (date) => {
   const JD = date.getTime() / 86400000 + 2440587.5;
   const T = (JD - 2451545.0) / 36525;
-  const D = (297.850 + 445267.1115 * T) % 360; // Mean elongation: 0=new, 180=full
+  const D = (297.85 + 445267.1115 * T) % 360; // Mean elongation: 0=new, 180=full
   // Normalize to 0-1 range (0=new, 0.5=full)
   const phase = (((D % 360) + 360) % 360) / 360;
   return phase;
@@ -170,8 +174,8 @@ export const getMoonPhaseEmoji = (phase) => {
  * Uses NOAA solar calculator algorithm for accuracy
  */
 export const calculateSunTimes = (lat, lon, date) => {
-  const toRad = d => d * Math.PI / 180;
-  const toDeg = r => r * 180 / Math.PI;
+  const toRad = (d) => (d * Math.PI) / 180;
+  const toDeg = (r) => (r * 180) / Math.PI;
 
   // Julian date calculation
   const year = date.getUTCFullYear();
@@ -181,7 +185,14 @@ export const calculateSunTimes = (lat, lon, date) => {
   const a = Math.floor((14 - month) / 12);
   const y = year + 4800 - a;
   const m = month + 12 * a - 3;
-  const jd = day + Math.floor((153 * m + 2) / 5) + 365 * y + Math.floor(y / 4) - Math.floor(y / 100) + Math.floor(y / 400) - 32045;
+  const jd =
+    day +
+    Math.floor((153 * m + 2) / 5) +
+    365 * y +
+    Math.floor(y / 4) -
+    Math.floor(y / 100) +
+    Math.floor(y / 400) -
+    32045;
 
   // Julian century from J2000.0
   const jc = (jd - 2451545) / 36525;
@@ -196,9 +207,10 @@ export const calculateSunTimes = (lat, lon, date) => {
   const e = 0.016708634 - jc * (0.000042037 + 0.0000001267 * jc);
 
   // Sun's equation of center
-  const C = Math.sin(toRad(M)) * (1.914602 - jc * (0.004817 + 0.000014 * jc))
-          + Math.sin(toRad(2 * M)) * (0.019993 - 0.000101 * jc)
-          + Math.sin(toRad(3 * M)) * 0.000289;
+  const C =
+    Math.sin(toRad(M)) * (1.914602 - jc * (0.004817 + 0.000014 * jc)) +
+    Math.sin(toRad(2 * M)) * (0.019993 - 0.000101 * jc) +
+    Math.sin(toRad(3 * M)) * 0.000289;
 
   // Sun's true longitude
   const sunLon = L0 + C;
@@ -216,13 +228,15 @@ export const calculateSunTimes = (lat, lon, date) => {
 
   // Equation of time (minutes)
   const y2 = Math.tan(toRad(obliq / 2)) ** 2;
-  const eqTime = 4 * toDeg(
-    y2 * Math.sin(2 * toRad(L0))
-    - 2 * e * Math.sin(toRad(M))
-    + 4 * e * y2 * Math.sin(toRad(M)) * Math.cos(2 * toRad(L0))
-    - 0.5 * y2 * y2 * Math.sin(4 * toRad(L0))
-    - 1.25 * e * e * Math.sin(2 * toRad(M))
-  );
+  const eqTime =
+    4 *
+    toDeg(
+      y2 * Math.sin(2 * toRad(L0)) -
+        2 * e * Math.sin(toRad(M)) +
+        4 * e * y2 * Math.sin(toRad(M)) * Math.cos(2 * toRad(L0)) -
+        0.5 * y2 * y2 * Math.sin(4 * toRad(L0)) -
+        1.25 * e * e * Math.sin(2 * toRad(M)),
+    );
 
   // Hour angle for sunrise/sunset (accounting for atmospheric refraction and sun's radius)
   // Standard altitude is -0.833 degrees (refraction + sun radius)
@@ -273,39 +287,43 @@ export const WORLD_COPY_OFFSETS = [-360, 0, 360];
  * Use replicatePath() to create copies for all visible world copies.
  */
 export const getGreatCirclePoints = (lat1, lon1, lat2, lon2, n = 100) => {
-  const toRad = d => d * Math.PI / 180;
-  const toDeg = r => r * 180 / Math.PI;
-  
-  const φ1 = toRad(lat1), λ1 = toRad(lon1);
-  const φ2 = toRad(lat2), λ2 = toRad(lon2);
-  
-  const d = 2 * Math.asin(Math.sqrt(
-    Math.sin((φ1-φ2)/2)**2 + Math.cos(φ1)*Math.cos(φ2)*Math.sin((λ1-λ2)/2)**2
-  ));
-  
+  const toRad = (d) => (d * Math.PI) / 180;
+  const toDeg = (r) => (r * 180) / Math.PI;
+
+  const φ1 = toRad(lat1),
+    λ1 = toRad(lon1);
+  const φ2 = toRad(lat2),
+    λ2 = toRad(lon2);
+
+  const d =
+    2 * Math.asin(Math.sqrt(Math.sin((φ1 - φ2) / 2) ** 2 + Math.cos(φ1) * Math.cos(φ2) * Math.sin((λ1 - λ2) / 2) ** 2));
+
   // If distance is essentially zero, return just the two points
   if (d < 0.0001) {
-    return [[lat1, lon1], [lat2, lon2]];
+    return [
+      [lat1, lon1],
+      [lat2, lon2],
+    ];
   }
-  
+
   const rawPoints = [];
   for (let i = 0; i <= n; i++) {
     const f = i / n;
-    const A = Math.sin((1-f)*d) / Math.sin(d);
-    const B = Math.sin(f*d) / Math.sin(d);
-    const x = A*Math.cos(φ1)*Math.cos(λ1) + B*Math.cos(φ2)*Math.cos(λ2);
-    const y = A*Math.cos(φ1)*Math.sin(λ1) + B*Math.cos(φ2)*Math.sin(λ2);
-    const z = A*Math.sin(φ1) + B*Math.sin(φ2);
-    rawPoints.push([toDeg(Math.atan2(z, Math.sqrt(x*x+y*y))), toDeg(Math.atan2(y, x))]);
+    const A = Math.sin((1 - f) * d) / Math.sin(d);
+    const B = Math.sin(f * d) / Math.sin(d);
+    const x = A * Math.cos(φ1) * Math.cos(λ1) + B * Math.cos(φ2) * Math.cos(λ2);
+    const y = A * Math.cos(φ1) * Math.sin(λ1) + B * Math.cos(φ2) * Math.sin(λ2);
+    const z = A * Math.sin(φ1) + B * Math.sin(φ2);
+    rawPoints.push([toDeg(Math.atan2(z, Math.sqrt(x * x + y * y))), toDeg(Math.atan2(y, x))]);
   }
-  
+
   // Unwrap longitudes to be continuous (no jumps > 180°)
   // This lets Leaflet draw smoothly across the antimeridian and world copies
   for (let i = 1; i < rawPoints.length; i++) {
-    while (rawPoints[i][1] - rawPoints[i-1][1] > 180) rawPoints[i][1] -= 360;
-    while (rawPoints[i][1] - rawPoints[i-1][1] < -180) rawPoints[i][1] += 360;
+    while (rawPoints[i][1] - rawPoints[i - 1][1] > 180) rawPoints[i][1] -= 360;
+    while (rawPoints[i][1] - rawPoints[i - 1][1] < -180) rawPoints[i][1] += 360;
   }
-  
+
   return rawPoints;
 };
 
@@ -319,15 +337,15 @@ export const replicatePath = (path) => {
   if (!path || path.length === 0) return [];
 
   const segments = [[]];
-  
+
   // 1. Detect Date Line jumps and split into separate line segments
   for (let i = 0; i < path.length; i++) {
     const current = path[i];
     const prev = path[i - 1];
-    
+
     // If the longitude jump is > 180 degrees, the satellite crossed the edge.
     if (prev && Math.abs(current[1] - prev[1]) > 180) {
-      segments.push([]); 
+      segments.push([]);
     }
     segments[segments.length - 1].push(current);
   }
@@ -336,11 +354,11 @@ export const replicatePath = (path) => {
   const wrappedWorlds = [];
   const offsets = [0, 360, -360];
 
-  segments.forEach(segment => {
+  segments.forEach((segment) => {
     if (segment.length < 2) return;
-    
-    offsets.forEach(offset => {
-      wrappedWorlds.push(segment.map(p => [p[0], p[1] + offset]));
+
+    offsets.forEach((offset) => {
+      wrappedWorlds.push(segment.map((p) => [p[0], p[1] + offset]));
     });
   });
 
@@ -353,7 +371,7 @@ export const replicatePath = (path) => {
  */
 export const replicatePoint = (lat, lon) => {
   const nLon = normalizeLon(lon);
-  return WORLD_COPY_OFFSETS.map(offset => [lat, nLon + offset]);
+  return WORLD_COPY_OFFSETS.map((offset) => [lat, nLon + offset]);
 };
 
 export default {
@@ -369,5 +387,5 @@ export default {
   replicatePath,
   replicatePoint,
   normalizeLon,
-  WORLD_COPY_OFFSETS
+  WORLD_COPY_OFFSETS,
 };
diff --git a/src/utils/index.js b/src/utils/index.js
index 196f5b9e..9e5803b9 100644
--- a/src/utils/index.js
+++ b/src/utils/index.js
@@ -14,7 +14,7 @@ export {
   syncAllSettingsToServer,
   installSettingsSyncInterceptor,
   isConfigIncomplete,
-  MAP_STYLES
+  MAP_STYLES,
 } from './config.js';
 
 // Geographic calculations
@@ -31,7 +31,7 @@ export {
   replicatePath,
   replicatePoint,
   normalizeLon,
-  WORLD_COPY_OFFSETS
+  WORLD_COPY_OFFSETS,
 } from './geo.js';
 
 // Callsign and band utilities
@@ -43,9 +43,9 @@ export {
   getBandColor,
   detectMode,
   PREFIX_MAP,
-  getCallsignInfo
+  getCallsignInfo,
 } from './callsign.js';
-export {filterDXPaths} from "./dxClusterFilters";
+export { filterDXPaths } from './dxClusterFilters';
 
 // Band color utilities
 export {
@@ -58,5 +58,5 @@ export {
   getEffectiveBandColors,
   getBandColorForBand,
   getBandColorForFreq,
-  getBandTextColor
+  getBandTextColor,
 } from './bandColors.js';
diff --git a/src/utils/profiles.js b/src/utils/profiles.js
index 790d1f62..e3560f49 100644
--- a/src/utils/profiles.js
+++ b/src/utils/profiles.js
@@ -94,7 +94,7 @@ function restoreSnapshot(snapshot) {
       keysToRemove.push(key);
     }
   }
-  keysToRemove.forEach(k => localStorage.removeItem(k));
+  keysToRemove.forEach((k) => localStorage.removeItem(k));
 
   // Write snapshot keys
   for (const [key, value] of Object.entries(snapshot)) {
@@ -158,11 +158,11 @@ export function renameProfile(oldName, newName) {
   const profiles = getProfiles();
   if (!profiles[oldName]) return false;
   if (profiles[newName.trim()]) return false; // target name already exists
-  
+
   profiles[newName.trim()] = { ...profiles[oldName], updatedAt: new Date().toISOString() };
   delete profiles[oldName];
   saveProfiles(profiles);
-  
+
   if (getActiveProfile() === oldName) {
     localStorage.setItem(ACTIVE_KEY, newName.trim());
   }
@@ -176,26 +176,34 @@ export function exportProfile(name) {
   const profiles = getProfiles();
   const profile = profiles[name];
   if (!profile) return null;
-  return JSON.stringify({
-    name,
-    version: 1,
-    exportedAt: new Date().toISOString(),
-    ...profile,
-  }, null, 2);
+  return JSON.stringify(
+    {
+      name,
+      version: 1,
+      exportedAt: new Date().toISOString(),
+      ...profile,
+    },
+    null,
+    2,
+  );
 }
 
 /**
  * Export current live state as a JSON string (without needing a saved profile)
  */
 export function exportCurrentState(name = 'Exported') {
-  return JSON.stringify({
-    name,
-    version: 1,
-    exportedAt: new Date().toISOString(),
-    snapshot: takeSnapshot(),
-    createdAt: new Date().toISOString(),
-    updatedAt: new Date().toISOString(),
-  }, null, 2);
+  return JSON.stringify(
+    {
+      name,
+      version: 1,
+      exportedAt: new Date().toISOString(),
+      snapshot: takeSnapshot(),
+      createdAt: new Date().toISOString(),
+      updatedAt: new Date().toISOString(),
+    },
+    null,
+    2,
+  );
 }
 
 /**
@@ -206,7 +214,7 @@ export function importProfile(jsonString) {
   try {
     const data = JSON.parse(jsonString);
     if (!data.snapshot || !data.name) return null;
-    
+
     const profiles = getProfiles();
     // Avoid overwriting - add suffix if name exists
     let name = data.name;
@@ -214,7 +222,7 @@ export function importProfile(jsonString) {
     while (profiles[name]) {
       name = `${data.name} (${counter++})`;
     }
-    
+
     profiles[name] = {
       snapshot: data.snapshot,
       createdAt: data.createdAt || new Date().toISOString(),
diff --git a/src/utils/terminator.js b/src/utils/terminator.js
index de824d52..c500da69 100644
--- a/src/utils/terminator.js
+++ b/src/utils/terminator.js
@@ -3,7 +3,7 @@
  * Based on @joergdietrich/leaflet.terminator math, extended to span
  * multiple world copies (-540..540° longitude) so the gray line renders
  * correctly when users pan past the International Date Line.
- * 
+ *
  * Removes CDN dependency on L.Terminator.js
  */
 
@@ -25,9 +25,9 @@ function gmst(date) {
 /** Sun's ecliptic position */
 function sunEclipticPosition(jd) {
   const n = jd - 2451545.0;
-  const L = (280.460 + 0.9856474 * n) % 360;
+  const L = (280.46 + 0.9856474 * n) % 360;
   const g = ((357.528 + 0.9856003 * n) % 360) * RAD;
-  const lambda = (L + 1.915 * Math.sin(g) + 0.020 * Math.sin(2 * g)) * RAD;
+  const lambda = (L + 1.915 * Math.sin(g) + 0.02 * Math.sin(2 * g)) * RAD;
   return { lambda };
 }
 
@@ -61,14 +61,14 @@ function computeNightPolygon(time, resolution) {
   const sunPos = sunEquatorialPosition(eclPos.lambda, obliq);
   const gmstVal = gmst(date);
   const ha0 = hourAngle(gmstVal, sunPos, -180);
-  
+
   const steps = Math.ceil(360 / resolution);
   const baseLine = [];
-  
+
   for (let i = 0; i <= steps; i++) {
-    const lon = -180 + (i * 360 / steps);
-    const ha = ha0 + (i * 360 / steps) * RAD;
-    
+    const lon = -180 + (i * 360) / steps;
+    const ha = ha0 + ((i * 360) / steps) * RAD;
+
     let lat;
     const tanDelta = Math.tan(sunPos.delta);
     if (Math.abs(tanDelta) < 1e-10) {
@@ -77,32 +77,32 @@ function computeNightPolygon(time, resolution) {
     } else {
       lat = Math.atan(-Math.cos(ha) / tanDelta) / RAD;
     }
-    
+
     baseLine.push([lat, lon]);
   }
-  
+
   // Close the polygon through the dark pole
   // delta > 0 (northern summer): south pole is in darkness
   // delta < 0 (northern winter): north pole is in darkness
   const nightPole = sunPos.delta >= 0 ? -90 : 90;
-  
+
   const baseRing = [...baseLine];
   baseRing.push([nightPole, 180]);
   baseRing.push([nightPole, -180]);
-  
+
   // Create 3 world copies so terminator is visible past the dateline
   const rings = [];
   for (const offset of [-360, 0, 360]) {
     rings.push(baseRing.map(([lat, lon]) => [lat, lon + offset]));
   }
-  
+
   return rings;
 }
 
 /**
  * Create a Leaflet terminator layer
  * Drop-in replacement for L.terminator()
- * 
+ *
  * @param {Object} options - Leaflet polygon style options + resolution
  * @returns {L.Polygon} Polygon with setTime() method
  */
@@ -117,9 +117,9 @@ export function createTerminator(options = {}) {
     time,
     ...otherOptions
   } = options;
-  
+
   const rings = computeNightPolygon(time || new Date(), resolution);
-  
+
   const polygon = L.polygon(rings, {
     fillOpacity,
     fillColor,
@@ -128,21 +128,21 @@ export function createTerminator(options = {}) {
     dashArray,
     interactive: false,
     bubblingMouseEvents: false,
-    ...otherOptions
+    ...otherOptions,
   });
-  
+
   polygon._terminatorResolution = resolution;
-  
+
   /**
    * Update the terminator to a new time
    * @param {Date} [newTime] - Time to compute for (default: now)
    */
-  polygon.setTime = function(newTime) {
+  polygon.setTime = function (newTime) {
     const t = newTime || new Date();
     const newRings = computeNightPolygon(t, this._terminatorResolution);
     this.setLatLngs(newRings);
   };
-  
+
   return polygon;
 }
 
diff --git a/vite.config.mjs b/vite.config.mjs
index e41bbb0b..b741e63b 100644
--- a/vite.config.mjs
+++ b/vite.config.mjs
@@ -9,9 +9,9 @@ export default defineConfig({
     proxy: {
       '/api': {
         target: 'http://localhost:3001',
-        changeOrigin: true
-      }
-    }
+        changeOrigin: true,
+      },
+    },
   },
   resolve: {
     alias: {
@@ -19,15 +19,15 @@ export default defineConfig({
       '@components': path.resolve(__dirname, './src/components'),
       '@hooks': path.resolve(__dirname, './src/hooks'),
       '@utils': path.resolve(__dirname, './src/utils'),
-      '@styles': path.resolve(__dirname, './src/styles')
-    }
+      '@styles': path.resolve(__dirname, './src/styles'),
+    },
   },
   define: {
     // mqtt.js needs these for browser
     global: 'globalThis',
   },
   optimizeDeps: {
-    include: ['mqtt']
+    include: ['mqtt'],
   },
   build: {
     outDir: 'dist',
@@ -37,9 +37,9 @@ export default defineConfig({
         manualChunks: {
           vendor: ['react', 'react-dom'],
           satellite: ['satellite.js'],
-          mqtt: ['mqtt']
-        }
-      }
-    }
-  }
+          mqtt: ['mqtt'],
+        },
+      },
+    },
+  },
 });
diff --git a/vitest.config.js b/vitest.config.js
index f241799e..f6c5bb68 100644
--- a/vitest.config.js
+++ b/vitest.config.js
@@ -10,14 +10,7 @@ export default defineConfig({
     coverage: {
       provider: 'v8',
       reporter: ['text', 'json', 'html'],
-      exclude: [
-        'node_modules/',
-        'src/test/',
-        '*.config.js',
-        '**/*.d.ts',
-        'dist/',
-        'build/'
-      ]
-    }
-  }
+      exclude: ['node_modules/', 'src/test/', '*.config.js', '**/*.d.ts', 'dist/', 'build/'],
+    },
+  },
 });
diff --git a/wsjtx-relay/README.md b/wsjtx-relay/README.md
index cb0a3cce..ccbbbc91 100644
--- a/wsjtx-relay/README.md
+++ b/wsjtx-relay/README.md
@@ -61,13 +61,13 @@ That's it. The relay will show decoded messages as they come in.
 
 ## Options
 
-| Flag | Env Variable | Default | Description |
-|------|-------------|---------|-------------|
-| `--url` | `OPENHAMCLOCK_URL` | — | Server URL (required) |
-| `--key` | `RELAY_KEY` | — | Auth key (required) |
-| `--port` | `WSJTX_UDP_PORT` | `2237` | Local UDP port |
-| `--interval` | `BATCH_INTERVAL` | `2000` | Batch send interval (ms) |
-| `--verbose` | `VERBOSE=true` | off | Show all decoded messages |
+| Flag         | Env Variable       | Default | Description               |
+| ------------ | ------------------ | ------- | ------------------------- |
+| `--url`      | `OPENHAMCLOCK_URL` | —       | Server URL (required)     |
+| `--key`      | `RELAY_KEY`        | —       | Auth key (required)       |
+| `--port`     | `WSJTX_UDP_PORT`   | `2237`  | Local UDP port            |
+| `--interval` | `BATCH_INTERVAL`   | `2000`  | Batch send interval (ms)  |
+| `--verbose`  | `VERBOSE=true`     | off     | Show all decoded messages |
 
 ## Running as a Service
 
@@ -98,6 +98,7 @@ sudo systemctl enable --now wsjtx-relay
 ### Windows (Task Scheduler)
 
 Create a batch file `start-relay.bat`:
+
 ```batch
 @echo off
 set OPENHAMCLOCK_URL=https://openhamclock.com
diff --git a/wsjtx-relay/package.json b/wsjtx-relay/package.json
index fbf1954a..14c27af7 100644
--- a/wsjtx-relay/package.json
+++ b/wsjtx-relay/package.json
@@ -6,7 +6,13 @@
   "scripts": {
     "start": "node relay.js"
   },
-  "keywords": ["wsjt-x", "ham-radio", "ft8", "relay", "openhamclock"],
+  "keywords": [
+    "wsjt-x",
+    "ham-radio",
+    "ft8",
+    "relay",
+    "openhamclock"
+  ],
   "license": "MIT",
   "engines": {
     "node": ">=14.0.0"
diff --git a/wsjtx-relay/relay.js b/wsjtx-relay/relay.js
index 9c791ee5..870ed9aa 100644
--- a/wsjtx-relay/relay.js
+++ b/wsjtx-relay/relay.js
@@ -1,21 +1,21 @@
 #!/usr/bin/env node
 /**
  * OpenHamClock WSJT-X Relay Agent
- * 
+ *
  * Captures WSJT-X UDP datagrams on your local machine and relays
  * decoded messages to a remote OpenHamClock instance (e.g. openhamclock.com).
- * 
+ *
  * WSJT-X sends UDP only on the local network — this bridge lets your
  * cloud-hosted dashboard see your decodes in real time.
- * 
+ *
  * Zero dependencies — uses only Node.js built-in modules.
- * 
+ *
  * Usage:
  *   node relay.js --url https://openhamclock.com --key YOUR_RELAY_KEY
- *   
+ *
  *   Or with environment variables:
  *   OPENHAMCLOCK_URL=https://openhamclock.com RELAY_KEY=abc123 node relay.js
- * 
+ *
  * In WSJT-X: Settings → Reporting → UDP Server
  *   Address: 127.0.0.1   Port: 2237
  */
@@ -39,16 +39,35 @@ function parseArgs() {
     batchInterval: parseInt(process.env.BATCH_INTERVAL || '2000'),
     verbose: process.env.VERBOSE === 'true',
   };
-  
+
   for (let i = 0; i < args.length; i++) {
     switch (args[i]) {
-      case '--url': case '-u': config.url = args[++i]; break;
-      case '--key': case '-k': config.key = args[++i]; break;
-      case '--session': case '-s': config.session = args[++i]; break;
-      case '--port': case '-p': config.port = parseInt(args[++i]); break;
-      case '--interval': case '-i': config.batchInterval = parseInt(args[++i]); break;
-      case '--verbose': case '-v': config.verbose = true; break;
-      case '--help': case '-h':
+      case '--url':
+      case '-u':
+        config.url = args[++i];
+        break;
+      case '--key':
+      case '-k':
+        config.key = args[++i];
+        break;
+      case '--session':
+      case '-s':
+        config.session = args[++i];
+        break;
+      case '--port':
+      case '-p':
+        config.port = parseInt(args[++i]);
+        break;
+      case '--interval':
+      case '-i':
+        config.batchInterval = parseInt(args[++i]);
+        break;
+      case '--verbose':
+      case '-v':
+        config.verbose = true;
+        break;
+      case '--help':
+      case '-h':
         console.log(`
 OpenHamClock WSJT-X Relay Agent
 
@@ -78,7 +97,7 @@ Example:
         process.exit(0);
     }
   }
-  
+
   return config;
 }
 
@@ -111,30 +130,48 @@ const relayEndpoint = `${serverUrl}/api/wsjtx/relay`;
 // WSJT-X BINARY PROTOCOL PARSER
 // ============================================
 
-const WSJTX_MAGIC = 0xADBCCBDA;
+const WSJTX_MAGIC = 0xadbccbda;
 
 const WSJTX_MSG = {
-  HEARTBEAT: 0, STATUS: 1, DECODE: 2, CLEAR: 3,
-  REPLY: 4, QSO_LOGGED: 5, CLOSE: 6, REPLAY: 7,
-  HALT_TX: 8, FREE_TEXT: 9, WSPR_DECODE: 10,
-  LOCATION: 11, LOGGED_ADIF: 12,
+  HEARTBEAT: 0,
+  STATUS: 1,
+  DECODE: 2,
+  CLEAR: 3,
+  REPLY: 4,
+  QSO_LOGGED: 5,
+  CLOSE: 6,
+  REPLAY: 7,
+  HALT_TX: 8,
+  FREE_TEXT: 9,
+  WSPR_DECODE: 10,
+  LOCATION: 11,
+  LOGGED_ADIF: 12,
 };
 
 class WSJTXReader {
-  constructor(buffer) { this.buf = buffer; this.offset = 0; }
-  remaining() { return this.buf.length - this.offset; }
-  
+  constructor(buffer) {
+    this.buf = buffer;
+    this.offset = 0;
+  }
+  remaining() {
+    return this.buf.length - this.offset;
+  }
+
   readUInt8() {
     if (this.remaining() < 1) return null;
     return this.buf.readUInt8(this.offset++);
   }
   readInt32() {
     if (this.remaining() < 4) return null;
-    const v = this.buf.readInt32BE(this.offset); this.offset += 4; return v;
+    const v = this.buf.readInt32BE(this.offset);
+    this.offset += 4;
+    return v;
   }
   readUInt32() {
     if (this.remaining() < 4) return null;
-    const v = this.buf.readUInt32BE(this.offset); this.offset += 4; return v;
+    const v = this.buf.readUInt32BE(this.offset);
+    this.offset += 4;
+    return v;
   }
   readUInt64() {
     if (this.remaining() < 8) return null;
@@ -143,18 +180,24 @@ class WSJTXReader {
     this.offset += 8;
     return hi * 0x100000000 + lo;
   }
-  readBool() { const v = this.readUInt8(); return v === null ? null : v !== 0; }
+  readBool() {
+    const v = this.readUInt8();
+    return v === null ? null : v !== 0;
+  }
   readDouble() {
     if (this.remaining() < 8) return null;
-    const v = this.buf.readDoubleBE(this.offset); this.offset += 8; return v;
+    const v = this.buf.readDoubleBE(this.offset);
+    this.offset += 8;
+    return v;
   }
   readUtf8() {
     const len = this.readUInt32();
-    if (len === null || len === 0xFFFFFFFF) return null;
+    if (len === null || len === 0xffffffff) return null;
     if (len === 0) return '';
     if (this.remaining() < len) return null;
     const str = this.buf.toString('utf8', this.offset, this.offset + len);
-    this.offset += len; return str;
+    this.offset += len;
+    return str;
   }
   readQTime() {
     const ms = this.readUInt32();
@@ -162,8 +205,13 @@ class WSJTXReader {
     const h = Math.floor(ms / 3600000);
     const m = Math.floor((ms % 3600000) / 60000);
     const s = Math.floor((ms % 60000) / 1000);
-    return { ms, hours: h, minutes: m, seconds: s,
-      formatted: `${String(h).padStart(2,'0')}:${String(m).padStart(2,'0')}:${String(s).padStart(2,'0')}` };
+    return {
+      ms,
+      hours: h,
+      minutes: m,
+      seconds: s,
+      formatted: `${String(h).padStart(2, '0')}:${String(m).padStart(2, '0')}:${String(s).padStart(2, '0')}`,
+    };
   }
   readQDateTime() {
     const julianDay = this.readUInt64();
@@ -178,14 +226,14 @@ function parseWSJTXMessage(buffer) {
   const reader = new WSJTXReader(buffer);
   const magic = reader.readUInt32();
   if (magic !== WSJTX_MAGIC) return null;
-  
+
   const schema = reader.readUInt32();
   const type = reader.readUInt32();
   const id = reader.readUtf8();
   if (type === null || id === null) return null;
-  
+
   const msg = { type, id, schema, timestamp: Date.now() };
-  
+
   try {
     switch (type) {
       case WSJTX_MSG.HEARTBEAT:
@@ -269,8 +317,10 @@ function parseWSJTXMessage(buffer) {
       default:
         return null;
     }
-  } catch (e) { return null; }
-  
+  } catch (e) {
+    return null;
+  }
+
   return msg;
 }
 
@@ -285,13 +335,18 @@ let totalSent = 0;
 let totalDecodes = 0;
 
 const MSG_TYPE_NAMES = {
-  0: 'Heartbeat', 1: 'Status', 2: 'Decode', 3: 'Clear',
-  5: 'QSO Logged', 6: 'Close', 10: 'WSPR',
+  0: 'Heartbeat',
+  1: 'Status',
+  2: 'Decode',
+  3: 'Clear',
+  5: 'QSO Logged',
+  6: 'Close',
+  10: 'WSPR',
 };
 
 function queueMessage(msg) {
   messageQueue.push(msg);
-  
+
   if (config.verbose && msg.type === WSJTX_MSG.DECODE) {
     const snr = msg.snr != null ? (msg.snr >= 0 ? `+${msg.snr}` : msg.snr) : '?';
     console.log(`  📻 ${msg.time?.formatted || '??'} ${snr}dB ${msg.deltaFreq}Hz ${msg.message}`);
@@ -300,14 +355,14 @@ function queueMessage(msg) {
 
 function sendBatch() {
   if (sendInFlight || messageQueue.length === 0) return;
-  
+
   const batch = messageQueue.splice(0, messageQueue.length);
   sendInFlight = true;
-  
+
   const body = JSON.stringify({ messages: batch, session: config.session });
   const parsed = new URL(relayEndpoint);
   const transport = parsed.protocol === 'https:' ? https : http;
-  
+
   const reqOpts = {
     hostname: parsed.hostname,
     port: parsed.port || (parsed.protocol === 'https:' ? 443 : 80),
@@ -316,25 +371,27 @@ function sendBatch() {
     headers: {
       'Content-Type': 'application/json',
       'Content-Length': Buffer.byteLength(body),
-      'Authorization': `Bearer ${config.key}`,
+      Authorization: `Bearer ${config.key}`,
       'X-Relay-Version': RELAY_VERSION,
-      'Connection': 'close',
+      Connection: 'close',
     },
     timeout: 10000,
   };
-  
+
   const req = transport.request(reqOpts, (res) => {
     let data = '';
-    res.on('data', (chunk) => data += chunk);
+    res.on('data', (chunk) => (data += chunk));
     res.on('end', () => {
       sendInFlight = false;
-      
+
       if (res.statusCode === 200) {
         consecutiveErrors = 0;
         totalSent += batch.length;
-        const decodes = batch.filter(m => m.type === WSJTX_MSG.DECODE).length;
+        const decodes = batch.filter((m) => m.type === WSJTX_MSG.DECODE).length;
         if (decodes > 0 || config.verbose) {
-          process.stdout.write(`  ✅ Relayed ${batch.length} msg${batch.length > 1 ? 's' : ''} (${decodes} decode${decodes !== 1 ? 's' : ''}) — total: ${totalSent}\r`);
+          process.stdout.write(
+            `  ✅ Relayed ${batch.length} msg${batch.length > 1 ? 's' : ''} (${decodes} decode${decodes !== 1 ? 's' : ''}) — total: ${totalSent}\r`,
+          );
         }
       } else if (res.statusCode === 401 || res.statusCode === 403) {
         console.error(`\n  ❌ Authentication failed (${res.statusCode}) — check your relay key`);
@@ -348,13 +405,13 @@ function sendBatch() {
       }
     });
   });
-  
+
   req.on('error', (err) => {
     sendInFlight = false;
     consecutiveErrors++;
     // Re-queue on network error
     messageQueue.unshift(...batch);
-    
+
     if (consecutiveErrors <= 3 || consecutiveErrors % 10 === 0) {
       console.error(`\n  ⚠️  Connection error (attempt ${consecutiveErrors}): ${err.message}`);
       if (consecutiveErrors === 1 && err.message.includes('ECONNRESET')) {
@@ -366,14 +423,14 @@ function sendBatch() {
       }
     }
   });
-  
+
   req.on('timeout', () => {
     req.destroy();
     sendInFlight = false;
     consecutiveErrors++;
     messageQueue.unshift(...batch);
   });
-  
+
   req.write(body);
   req.end();
 }
@@ -404,12 +461,13 @@ const socket = dgram.createSocket('udp4');
 socket.on('message', (buf, rinfo) => {
   const msg = parseWSJTXMessage(buf);
   if (!msg) return;
-  
+
   // Track decodes for local stats
   if (msg.type === WSJTX_MSG.DECODE && msg.isNew) totalDecodes++;
-  
+
   // Queue for relay — skip REPLAY type (bulk replay request)
-  if (msg.type !== 7) { // REPLAY
+  if (msg.type !== 7) {
+    // REPLAY
     queueMessage(msg);
   }
 });
@@ -428,7 +486,7 @@ socket.on('error', (err) => {
 
 socket.on('listening', () => {
   const addr = socket.address();
-  
+
   console.log('');
   console.log('╔══════════════════════════════════════════════════╗');
   console.log(`║  OpenHamClock WSJT-X Relay Agent v${RELAY_VERSION}         ║`);
@@ -445,10 +503,10 @@ socket.on('listening', () => {
   console.log('');
   console.log('  Waiting for WSJT-X packets...');
   console.log('');
-  
+
   // Start batch relay loop
   scheduleBatch();
-  
+
   // Send relay heartbeat immediately, then every 30s
   // This tells the server the relay is alive even before WSJT-X sends any packets
   let heartbeatOk = false;
@@ -456,7 +514,7 @@ socket.on('listening', () => {
     const body = JSON.stringify({ relay: true, version: RELAY_VERSION, port: config.port, session: config.session });
     const parsed = new URL(relayEndpoint);
     const transport = parsed.protocol === 'https:' ? https : http;
-    
+
     const reqOpts = {
       hostname: parsed.hostname,
       port: parsed.port || (parsed.protocol === 'https:' ? 443 : 80),
@@ -465,16 +523,16 @@ socket.on('listening', () => {
       headers: {
         'Content-Type': 'application/json',
         'Content-Length': Buffer.byteLength(body),
-        'Authorization': `Bearer ${config.key}`,
+        Authorization: `Bearer ${config.key}`,
         'X-Relay-Heartbeat': 'true',
-        'Connection': 'close',
+        Connection: 'close',
       },
       timeout: 10000,
     };
-    
+
     const req = transport.request(reqOpts, (res) => {
       let data = '';
-      res.on('data', (chunk) => data += chunk);
+      res.on('data', (chunk) => (data += chunk));
       res.on('end', () => {
         if (res.statusCode === 200) {
           if (!heartbeatOk) {
@@ -514,11 +572,11 @@ socket.on('listening', () => {
     req.write(body);
     req.end();
   }
-  
+
   // Pre-flight check: verify server is reachable with a simple GET before starting relay
   const healthUrl = new URL(`${serverUrl}/api/health`);
   const healthTransport = healthUrl.protocol === 'https:' ? https : http;
-  const healthReq = healthTransport.get(healthUrl.href, { timeout: 10000, headers: { 'Connection': 'close' } }, (res) => {
+  const healthReq = healthTransport.get(healthUrl.href, { timeout: 10000, headers: { Connection: 'close' } }, (res) => {
     res.resume();
     if (res.statusCode === 200) {
       console.log(`  ✅ Server reachable (${serverUrl})`);
@@ -546,14 +604,14 @@ socket.on('listening', () => {
     console.error('     Will retry heartbeat anyway...');
     sendHeartbeat();
   });
-  
+
   setInterval(sendHeartbeat, 30000);
-  
+
   // Periodic health check — verify server is reachable
   setInterval(() => {
     const parsed = new URL(`${serverUrl}/api/wsjtx`);
     const transport = parsed.protocol === 'https:' ? https : http;
-    const req = transport.get(parsed.href, { timeout: 5000, headers: { 'Connection': 'close' } }, (res) => {
+    const req = transport.get(parsed.href, { timeout: 5000, headers: { Connection: 'close' } }, (res) => {
       if (res.statusCode === 200 && consecutiveErrors > 0) {
         console.log('\n  ✅ Server connection restored');
         consecutiveErrors = 0;

From 2a40592ae6c308cd461f61c8980d886690670993 Mon Sep 17 00:00:00 2001
From: s53zo <44831766+s53zo@users.noreply.github.com>
Date: Wed, 18 Feb 2026 23:32:15 +0100
Subject: [PATCH 6/6] style: format feature request template

---
 .github/ISSUE_TEMPLATE/feature_request.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/ISSUE_TEMPLATE/feature_request.md b/.github/ISSUE_TEMPLATE/feature_request.md
index e0b222f9..66ed167b 100644
--- a/.github/ISSUE_TEMPLATE/feature_request.md
+++ b/.github/ISSUE_TEMPLATE/feature_request.md
@@ -29,7 +29,7 @@ How would this feature benefit amateur radio operators? Be specific about the us
 - [ ] POTA/SOTA
 - [ ] DXing
 - [ ] Emergency communications
-- [ ] Other: ****\_\_\_****
+- [ ] Other: \***\*\_\_\_\*\***
 
 ## Would you be willing to help implement this?