feat: grey line on the world map; fix: trace checkboxes lied about their state

Grey line — the day/night terminator and its twilight band, off by default,
redrawn every minute so a map left open all day is not silently wrong by
evening. Its own Leaflet pane below the overlays, non-interactive, so it never
hides the path or beam nor swallows a click.

The solar maths is pure and was checked against known positions before being
wired to anything: both solstices, the March equinox, the subsolar longitude at
12 UTC, and day/night at Paris, Tokyo, New York, Sydney and Reykjavik across
seasons and hemispheres. That last set is what caught the real bug: the equation
has TWO solutions per meridian and the naive branch put New York in daylight at
02:00 in December — the terminator at +63° where it belongs at −63°. A shaded
map that looks entirely plausible and is exactly mirrored. It now anchors on the
classical terminator and takes the branch nearest it, which is also what makes
the twilight band follow the terminator instead of jumping hemisphere.

Separately, from a Xiegu user: the protocol-trace checkbox does not stay ticked.
It is React state initialised to false on every mount, so a trace still running
came back unticked — the operator ticks it to "switch it on", which switches it
OFF, and the log they send contains no trace at all. Worse than a cosmetic bug:
it silently defeats the one tool asked for to diagnose their radio. Both boxes
(CAT and WinKeyer) now read their real state from the backend.

frontend/src/components/MainMap.tsx

@@ -1,6 +1,7 @@
 import { useEffect, useRef, useState } from 'react';
 import L from 'leaflet';
 import 'leaflet/dist/leaflet.css';
+import { nightPolygon } from '../lib/greyline';
 import { gridToLatLon, gridSquareBounds, greatCirclePoints, pathBetween, destinationPoint } from '@/lib/maidenhead';
 import { writeUiPref } from '@/lib/uiPref';
 
@@ -115,6 +116,12 @@ export function WorldMap({ fromGrid, toGrid, fromLabel, toLabel, beamAzimuths, b
   // pans/zooms freely (e.g. a whole-world view) and the view is remembered
   // across restarts. Default on.
   const [autoZoom, setAutoZoom] = useState(() => localStorage.getItem('opslog.mapAutoZoomDX') !== '0');
+
+  // Grey line — the day/night terminator with its twilight band. Off by
+  // default: it is a working tool for the operator who wants it, not decoration
+  // for the one who does not.
+  const [greyline, setGreyline] = useState(() => localStorage.getItem('opslog.mapGreyline') === '1');
+  const greylineLayer = useRef<L.LayerGroup | null>(null);
   const autoZoomRef = useRef(autoZoom);
   useEffect(() => { autoZoomRef.current = autoZoom; }, [autoZoom]);
 
@@ -152,6 +159,62 @@ export function WorldMap({ fromGrid, toGrid, fromLabel, toLabel, beamAzimuths, b
     if (m) addBasemap(m, basemap, baseLayer, labelsLayer);
   }, [basemap]);
 
+  // Draw the grey line, and keep it moving.
+  //
+  // Redrawn every minute: the terminator travels a quarter of a degree in that
+  // time, which is invisible, but a map left on all day would otherwise be
+  // silently wrong by evening — and the whole point of the display is knowing
+  // where the line is NOW.
+  //
+  // It lives in its own pane below the overlay pane so the path and beam are
+  // never hidden behind the shading, and is non-interactive so it can never
+  // swallow a click meant for the map.
+  useEffect(() => {
+    const m = worldMap.current;
+    if (!m) return;
+
+    if (!greyline) {
+      greylineLayer.current?.remove();
+      greylineLayer.current = null;
+      return;
+    }
+
+    if (!m.getPane('greyline')) {
+      const pane = m.createPane('greyline');
+      pane.style.zIndex = '350';        // above tiles (200), below overlays (400)
+      pane.style.pointerEvents = 'none';
+    }
+
+    const draw = () => {
+      const now = new Date();
+      greylineLayer.current?.remove();
+      const g = L.layerGroup([], { pane: 'greyline' });
+
+      // Two bands, drawn dark-to-light so they read as one gradient into night:
+      // full darkness (Sun below the horizon) and civil twilight (down to −6°),
+      // which is the band operators actually mean by "grey line".
+      const night = L.polygon(nightPolygon(now, 0), {
+        pane: 'greyline', stroke: false, fillColor: '#0b1220', fillOpacity: 0.32, interactive: false,
+      });
+      const twilight = L.polygon(nightPolygon(now, -6), {
+        pane: 'greyline', stroke: false, fillColor: '#0b1220', fillOpacity: 0.22, interactive: false,
+      });
+      // The terminator itself, so the line is readable at a glance rather than
+      // being inferred from where the shading fades.
+      const line = L.polyline(nightPolygon(now, 0).slice(0, -2), {
+        pane: 'greyline', color: '#f59e0b', weight: 1, opacity: 0.75, interactive: false,
+      });
+
+      night.addTo(g); twilight.addTo(g); line.addTo(g);
+      g.addTo(m);
+      greylineLayer.current = g;
+    };
+
+    draw();
+    const id = window.setInterval(draw, 60_000);
+    return () => { window.clearInterval(id); };
+  }, [greyline]);
+
   // Redraw overlays whenever the operator/DX grids (or beam) change.
   useEffect(() => {
     const wm = worldMap.current, wo = worldOverlay.current;
@@ -293,6 +356,21 @@ export function WorldMap({ fromGrid, toGrid, fromLabel, toLabel, beamAzimuths, b
       >
         Zoom DX
       </button>
+      {/* Grey line toggle, under the zoom button. */}
+      <button
+        type="button"
+        onClick={() => {
+          const v = !greyline;
+          setGreyline(v);
+          writeUiPref('opslog.mapGreyline', v ? '1' : '0');
+        }}
+        title={greyline ? 'Grey line is ON — day/night terminator and twilight band' : 'Show the grey line (day/night terminator)'}
+        className={`absolute top-9 right-1 z-[500] rounded-md px-2 py-1 text-[11px] font-medium shadow border backdrop-blur transition-colors ${
+          greyline ? 'bg-primary text-primary-foreground border-primary' : 'bg-card/90 text-muted-foreground border-border hover:bg-card'
+        }`}
+      >
+        Grey line
+      </button>
       {path && (
         <div className="absolute bottom-1 left-1 z-[500] rounded-md bg-card/90 backdrop-blur px-2 py-1 text-[11px] font-mono shadow border border-border pointer-events-none">
           <div><span className="text-muted-foreground">Dist</span> {Math.round(path.distanceShort).toLocaleString()} km

frontend/src/components/SettingsModal.tsx

@@ -37,6 +37,8 @@ import {
   GetQSLDefaults, SaveQSLDefaults,
   SetWinkeyerTrace,
   SetCIVTrace,
+  CIVTraceEnabled,
+  WinkeyerTraceEnabled,
   GetExternalServices, SaveExternalServices, TestQRZUpload, TestClublogUpload, TestHRDLogUpload, TestEQSLUpload, TestCloudlogUpload,
   GetPOTAToken, SavePOTAToken,
   TestLoTWUpload, ListTQSLStationLocations,
@@ -1136,8 +1138,17 @@ export function SettingsModal({ onClose, onSaved, initialSection, onMainPaneChan
   });
   const [wkPorts, setWkPorts] = useState<string[]>([]);
   // Session-only: the byte trace is a diagnostic, never a saved preference.
+  //
+  // But it must still SHOW its real state. These start false on every mount, so
+  // a trace already running came back unticked; the operator ticks the box to
+  // turn it on, which turns it off, and the log they send has no trace in it.
+  // Reported by a Xiegu user. Hydrated from the backend below.
   const [wkTrace, setWkTrace] = useState(false);
   const [civTrace, setCivTrace] = useState(false);
+  useEffect(() => {
+    CIVTraceEnabled().then((v) => setCivTrace(!!v)).catch(() => {});
+    WinkeyerTraceEnabled().then((v) => setWkTrace(!!v)).catch(() => {});
+  }, []);
   const setWkField = (patch: Partial<WKSettings>) => setWk((s) => ({ ...s, ...patch }));
 
   // ── Audio (DVK + QSO recorder) ──

frontend/src/lib/greyline.ts

@@ -0,0 +1,130 @@
+// Grey line — the day/night terminator, and the twilight band around it where
+// HF propagation briefly does things it does at no other time.
+//
+// The maths is the standard low-precision solar position (Meeus, chapter 25, as
+// used by NOAA's solar calculator): good to well under a degree, which is far
+// finer than the band being drawn. No ephemeris, no network, no dependency —
+// this has to work in a field shack with no internet.
+//
+// Everything here is pure so it can be tested against known positions; the
+// drawing lives in the map component.
+
+const DEG = Math.PI / 180;
+
+// julianDay for a date, including the fraction of the day.
+export function julianDay(d: Date): number {
+	return d.getTime() / 86400000 + 2440587.5;
+}
+
+// Sun's declination and Greenwich hour angle, both in degrees.
+//
+// Returned together because they are computed from the same intermediates and
+// every caller needs both — splitting them into two exported functions would
+// double the work at each call for the sake of a tidier signature.
+export function sunPosition(date: Date): { dec: number; gha: number } {
+	const jd = julianDay(date);
+	const n = jd - 2451545.0; // days from J2000.0
+
+	// Mean longitude and mean anomaly of the Sun.
+	const L = (280.460 + 0.9856474 * n) % 360;
+	const g = ((357.528 + 0.9856003 * n) % 360) * DEG;
+
+	// Ecliptic longitude: the equation of centre applied to the mean longitude.
+	const lambda = (L + 1.915 * Math.sin(g) + 0.020 * Math.sin(2 * g)) * DEG;
+
+	// Obliquity of the ecliptic, slowly decreasing.
+	const eps = (23.439 - 0.0000004 * n) * DEG;
+
+	const dec = Math.asin(Math.sin(eps) * Math.sin(lambda)) / DEG;
+
+	// Right ascension, kept in the same quadrant as the ecliptic longitude —
+	// atan2 alone lands 180° out for half the year, which mirrors the whole
+	// terminator about the prime meridian. Six months of a plausible-looking
+	// wrong answer is exactly the kind of bug that survives review.
+	let ra = Math.atan2(Math.cos(eps) * Math.sin(lambda), Math.cos(lambda)) / DEG;
+	if (ra < 0) ra += 360;
+
+	// Greenwich mean sidereal time, in degrees.
+	const gmst = (280.46061837 + 360.98564736629 * n) % 360;
+
+	let gha = gmst - ra;
+	gha = ((gha % 360) + 360) % 360;
+	return { dec, gha };
+}
+
+// terminatorLatitude returns the latitude, at a given longitude, where the Sun
+// sits at `altitude` degrees above (or below) the horizon.
+//
+// altitude 0 is the geometric terminator; -6 is civil twilight, the outer edge
+// of the grey line as operators use the term.
+//
+// Returns null where no such latitude exists at that longitude — inside the
+// polar day or polar night, where the Sun never crosses that altitude at all.
+export function terminatorLatitude(lonDeg: number, dec: number, gha: number, altitude = 0): number | null {
+	const ha = (gha + lonDeg) * DEG; // local hour angle
+	const d = dec * DEG;
+	const h = altitude * DEG;
+
+	// From sin(alt) = sin(dec)sin(lat) + cos(dec)cos(lat)cos(ha), solved for lat:
+	//   A·sin(lat) + B·cos(lat) = sin(alt),  A = sin(dec), B = cos(dec)cos(ha)
+	//
+	// That has TWO solutions per meridian, and picking the wrong one is not a
+	// small error — it mirrors the answer about the equator. New York at 02:00
+	// local in December came out as daylight because the branch chosen put the
+	// terminator at +63° where it belongs at −63°: a shaded map that looks
+	// entirely plausible and is exactly wrong.
+	//
+	// So anchor on the geometric terminator, where the answer is unambiguous and
+	// classical, and take whichever branch is nearest it. At altitude 0 that
+	// reproduces it exactly; for the twilight band it follows it by continuity,
+	// which is the physical requirement — the twilight curve is a small offset
+	// from the terminator, never on the other side of the planet.
+	const A = Math.sin(d);
+	const B = Math.cos(d) * Math.cos(ha);
+	const R = Math.hypot(A, B);
+	if (R === 0) return null;
+	const s = Math.sin(h) / R;
+	if (s < -1 || s > 1) return null; // the Sun never reaches this altitude here
+
+	// The classical terminator. Division by zero is deliberate and correct here:
+	// at an equinox tan(dec) → 0 and the terminator becomes a meridian, which is
+	// exactly what atan(±Infinity) = ±90° expresses.
+	const t = Math.tan(d);
+	if (t === 0 && Math.cos(ha) === 0) return null; // degenerate: no crossing to name
+	const lat0 = Math.atan(-Math.cos(ha) / t) / DEG;
+
+	const phi = Math.atan2(B, A); // phase of the A·sin(lat) + B·cos(lat) sum
+	const fold = (x: number) => {
+		let v = ((x + 180) % 360 + 360) % 360 - 180;
+		if (v > 90) v = 180 - v;
+		if (v < -90) v = -180 - v;
+		return v;
+	};
+	const c1 = fold((Math.asin(s) - phi) / DEG);
+	const c2 = fold((Math.PI - Math.asin(s) - phi) / DEG);
+	return Math.abs(c1 - lat0) <= Math.abs(c2 - lat0) ? c1 : c2;
+}
+
+// nightPolygon returns a ring covering the part of the world where the Sun is
+// below `altitude`, ready for L.polygon (as [lat, lon] pairs).
+//
+// The ring runs along the terminator from west to east and closes along
+// whichever pole is in darkness — which pole that is flips with the season, and
+// getting it wrong shades the lit half of the planet.
+export function nightPolygon(date: Date, altitude = 0, stepDeg = 2): [number, number][] {
+	const { dec, gha } = sunPosition(date);
+	const ring: [number, number][] = [];
+
+	for (let lon = -180; lon <= 180; lon += stepDeg) {
+		const lat = terminatorLatitude(lon, dec, gha, altitude);
+		// Inside a polar day/night there is no crossing; clamp to the pole so the
+		// ring stays closed rather than tearing open across the map.
+		ring.push([lat === null ? (dec > 0 ? -90 : 90) : lat, lon]);
+	}
+
+	// Northern summer (positive declination) → the SOUTH pole is dark.
+	const pole = dec > 0 ? -90 : 90;
+	ring.push([pole, 180]);
+	ring.push([pole, -180]);
+	return ring;
+}