feat(recording): render the safe frame from a recording store

RecordingControls publishes the safe frame a recording composes in, 16:9
or 9:16 (null while none records), to the new recording store, and the
scene chrome renders the overlay's active and ratio classes from it
instead of the controls writing them. Any frame but 9:16, even none named,
records in 16:9 as before.

src/ui/applicationShell.js

@@ -63,6 +63,7 @@ import { useLocaleStore } from './stores/locale.js';
 import { useLocationStore } from './stores/location.js';
 import { useCockpitStore } from './stores/cockpit.js';
 import { useGlobeActionsStore } from './stores/globeActions.js';
+import { useRecordingStore } from './stores/recording.js';
 
 /**
  * Central UI orchestrator for the God's Eye View application.
@@ -129,6 +130,8 @@ export class StyleManager extends ShellFacade {
     this._recording = new RecordingControls({
       syncShareState: () => this._syncShareState(),
       syncHudControls: () => this._visualSettings._syncHudControls(),
+      publishSafeFrame: (frame) =>
+        useRecordingStore(applicationPinia()).publishSafeFrame(frame),
     });
     Object.assign(this, readShellElements());
     this._panelChrome = new PanelChrome({