fix(rotator): the SP/LP readout goes BELOW the dial

The wrapper around the svg was a flex ROW, so a sibling landed beside the
compass instead of under it. Column, and the readout spans the full width.

app.go

@@ -1406,8 +1406,9 @@ func (a *App) startup(ctx context.Context) {
 	// Anonymous usage heartbeat (once/day) so we can gauge active users. No-op
 	// when disabled in Preferences or until the PostHog key is configured.
 	go a.sendTelemetryHeartbeat()
-	go a.liveStatusLoop() // multi-op: heartbeat current activity to shared MySQL
-	go a.chatLoop()       // multi-op: poll the shared chat + heartbeat presence
+	go a.liveStatusLoop()  // multi-op: heartbeat current activity to shared MySQL
+	go a.chatLoop()        // multi-op: poll the shared chat + heartbeat presence
+	go a.hrdlogOnAirLoop() // publish frequency/mode/rig on hrdlog.net when enabled
 	// Locator store BEFORE the feed: the feed asks whether it exists to decide
 	// which bands to subscribe to.
 	a.startGridCache()

frontend/src/components/RotorCompass.tsx

@@ -128,7 +128,9 @@ export function RotorCompass({ bearing, headings, boomHeading, pattern, centerLa
         </div>
       )}
 
-      <div className="flex items-center justify-center p-2 min-h-0">
+      {/* flex-col: the readout goes BELOW the dial. This wrapper was a row, so a
+          sibling of the <svg> landed beside it. */}
+      <div className="flex flex-col items-center justify-center p-2 min-h-0">
         <svg
           viewBox={`0 0 ${SIZE} ${SIZE}`}
           className={onGoto ? 'cursor-pointer select-none' : 'select-none'}
@@ -196,7 +198,7 @@ export function RotorCompass({ bearing, headings, boomHeading, pattern, centerLa
             Here because it belongs to the compass: every place that draws one
             gets the readout, instead of each caller inventing its own.
             Clickable when the caller can turn, like the status bar's. */}
-        <div className="flex gap-1.5 mt-2 font-mono">
+        <div className="flex gap-1.5 mt-2 font-mono w-full">
           {([['SP', bearing ?? null], ['LP', bearing == null ? null : (bearing + 180) % 360]] as const).map(([lbl, az]) => (
             <button key={lbl} type="button" disabled={az == null || !onGoto}
               onClick={() => { if (az != null && onGoto) onGoto(Math.round(az)); }}