@3dsource/angular-unreal-module 0.0.148-dev.2 → 0.0.149-dev.0

package/fesm2022/3dsource-angular-unreal-module.mjs

@@ -1,7 +1,7 @@
 import * as i0 from '@angular/core';
 import { InjectionToken, inject, DestroyRef, ChangeDetectionStrategy, Component, Injectable, signal, effect, untracked, computed, Pipe, input, ElementRef, viewChild, afterNextRender, HostListener, output, makeEnvironmentProviders, provideEnvironmentInitializer } from '@angular/core';
 import { SourceButtonComponent, SourceLoadingComponent } from '@3dsource/source-ui-native';
-import { Subject, skip, share, merge, map, scan, timestamp, startWith, pairwise, concatMap, of, animationFrameScheduler, interval, Observable, timer, take, defer, switchMap, from, throwError, EMPTY, retry, timeout as timeout$1, repeat, takeUntil as takeUntil$1, fromEvent, tap as tap$1, throttleTime, delay, concat, debounceTime, mergeMap, shareReplay, NEVER, asyncScheduler, filter as filter$1, withLatestFrom as withLatestFrom$1, Subscription, bufferTime, combineLatestWith, distinctUntilChanged as distinctUntilChanged$1 } from 'rxjs';
+import { Subject, skip, share, merge, map, scan, timestamp, startWith, pairwise, concatMap, of, animationFrameScheduler, interval, Observable, timer, take, defer, switchMap, from, throwError, EMPTY, retry, timeout as timeout$1, repeat, BehaviorSubject, takeUntil as takeUntil$1, fromEvent, tap as tap$1, throttleTime, delay, concat, debounceTime, mergeMap, ignoreElements, shareReplay, NEVER, asyncScheduler, filter as filter$1, withLatestFrom as withLatestFrom$1, Subscription, bufferTime, combineLatestWith, distinctUntilChanged as distinctUntilChanged$1 } from 'rxjs';
 import { createAction, props, createReducer, on, createFeature, Store, createSelector, provideState } from '@ngrx/store';
 import { whereNot, Falsy, Logger, calculateMedian, clampf, lerp, getCanvasCached, getSnapshot, fitIntoRectangle, generateUuid, Truthy, tapLog, Semaphore, COLOR_CODES, where, KeyboardNumericCode, InvertedKeyMap, HEXtoRGB, RGBtoHSV, inverseLerp, HSVtoRGB, RGBtoHEX, fpIsASameAsB } from '@3dsource/utils';
 import { filter, map as map$1, distinctUntilChanged, takeWhile, takeUntil, catchError, tap, timeout, finalize, first, switchMap as switchMap$1, withLatestFrom, exhaustMap, debounceTime as debounceTime$1, take as take$1, startWith as startWith$1 } from 'rxjs/operators';
@@ -262,11 +262,11 @@ const REGION_PING_WARMUP_DEADLINE_MS = 1500;
 // freshly-started media for bandwidth.
 const REGION_PING_BACKGROUND_REFRESH_DELAY_MS = 5000;
 // Reconnection defaults
-const DEFAULT_RECONNECT_ENABLED = true;
-const DEFAULT_RECONNECT_MAX_ATTEMPTS = 3;
-const DEFAULT_RECONNECT_DELAY_MS = 1000;
-const DEFAULT_RECONNECT_ON_ICE_FAILURE = true;
-const DEFAULT_RECONNECT_ON_DATACHANNEL_CLOSE = true;
+const RECONNECT_CONFIG = {
+    enabled: true,
+    maxAttempts: 3,
+    delayMs: 1000,
+};
 const UnrealStatusMessage = {
     CONNECTING_TO_SESSION: 'Connecting to session.',
     STARTING_YOUR_SESSION: 'Starting your session',
@@ -375,6 +375,18 @@ const setAfkTimerHide = createAction(scoped `set afk timer hide`);
 const setAfkTimerCountdown = createAction(scoped `set afk timer count down`, props());
 const showUnrealErrorMessage = createAction(scoped `show unreal error message`, props());
 const initSignalling = createAction(scoped `init signalling`);
+/**
+ * Dispatched when a prefetched connection parked on `window.__stream` by the
+ * `stream-prefetch.js` head-script is adopted instead of opening a fresh
+ * `connectToSignaling`. Marks cirrus connected and records the adopted machine
+ * in one transaction; the data channel / app-init chain then proceeds via
+ * `dataChannelConnected` dispatched from `WebRtcPlayerService`.
+ *
+ * Deliberately does NOT touch `streamClientCompanyId` / `streamViewId`: the host
+ * app (e.g. metabox) sets those authoritatively from its own data before
+ * `initSignalling`, and the prefetch script's ids are connection-internal only.
+ */
+const streamAdopted = createAction(scoped `stream adopted`, props());
 const startStream = createAction(scoped `startStream`, props());
 const resetConfig = createAction(scoped `reset config`);
 const resetAfk = createAction(scoped `reset afk action`);
@@ -429,6 +441,7 @@ const initialState = {
     isAfkTimerVisible: false,
     afkCountdown: 0,
     cirrusConnected: false,
+    adopted: false,
     establishingConnection: false,
     isReconnecting: false,
     viewportReady: false,
@@ -565,7 +578,11 @@ const unrealReducer = createReducer(initialState, on(changeStatusMainVideoOnScen
         },
     };
 }), on(initSignalling, (state) => {
-    return { ...state, disconnectReason: DisconnectReason.None };
+    return {
+        ...state,
+        adopted: false,
+        disconnectReason: DisconnectReason.None,
+    };
 }), on(reconnectPeerSuccess, (state) => {
     return { ...state, isReconnecting: false };
 }), on(setSignalingName, (state, { instanceName }) => {
@@ -628,6 +645,20 @@ const unrealReducer = createReducer(initialState, on(changeStatusMainVideoOnScen
     return { ...state, analyticsEvent: event };
 }), on(setCirrusConnected, (state) => {
     return { ...state, cirrusConnected: true };
+}), on(streamAdopted, (state, { machineId, ssData }) => {
+    return {
+        ...state,
+        cirrusConnected: true,
+        adopted: true,
+        ssData: ssData ?? state.ssData,
+        awsInstance: {
+            ...state.awsInstance,
+            wsUrl: machineId,
+            pollingUrl: null,
+            instanceName: 'Adopted Connection',
+            progressComplete: 0,
+        },
+    };
 }), on(showLoadingProgress, (state, { visible }) => {
     return { ...state, showLoadingProgress: visible };
 }), on(showResumeStreamPopup, (state, { visible }) => {
@@ -649,6 +680,7 @@ const unrealReducer = createReducer(initialState, on(changeStatusMainVideoOnScen
     return {
         ...state,
         cirrusConnected: false,
+        adopted: false,
         dataChannelConnected: false,
         viewportReady: false,
         isVideoPlaying: false,
@@ -1287,13 +1319,18 @@ const selectTotalProgress = createSelector(unrealFeature.selectStatusPercentSign
     const SIGNALLING_MAX = SIGNALLING_PERCENT_VALUE / 100;
     const ORCHESTRATION_WS_PATTERN = /^wss:\/\/orchestration-websocket/i;
     const isNewOrchestration = ORCHESTRATION_WS_PATTERN.test(awsInstance?.wsUrl ?? '');
-    // Orchestration progress is 0–1 from the backend; map to 0–1 directly.
-    // Once the data channel is connected, signaling is fully complete (1.0).
-    const signalingProgress = isNewOrchestration
-        ? dataChannelConnected
-            ? 1
-            : (awsInstance?.progressComplete ?? 0)
-        : (statusPercentSignallingServer ?? 0) / 100;
+    // Once the data channel is connected, signaling is fully complete (1.0) —
+    // regardless of orchestration type. This is what makes an ADOPTED stream
+    // (whose wsUrl is the machine host, not the orchestration-websocket URL,
+    // and which never set `statusPercentSignallingServer`) correctly show the
+    // whole first phase done instead of stalling near the command-only value.
+    // Otherwise: new orchestration reports 0–1 progress; legacy uses the
+    // polling percent.
+    const signalingProgress = dataChannelConnected
+        ? 1
+        : isNewOrchestration
+            ? (awsInstance?.progressComplete ?? 0)
+            : (statusPercentSignallingServer ?? 0) / 100;
     // +1% bump once WS URL is known (visual step for WS handshake)
     const splitPoint = awsInstance?.wsUrl
         ? SIGNALLING_MAX + 0.01
@@ -1334,11 +1371,11 @@ class WebrtcErrorModalComponent {
         this.#dialogRef.close();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: WebrtcErrorModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.4", type: WebrtcErrorModalComponent, isStandalone: true, selector: "app-webrtc-error-modal", ngImport: i0, template: "<div [attr.data-testid]=\"'webrtc-error-modal'\" class=\"src-modal\">\n  <header class=\"src-modal__header\"></header>\n  <section class=\"src-modal__body\">\n    <div [attr.data-testid]=\"'title'\" class=\"src-modal__title\">\n      WebRTC error\n    </div>\n    <div style=\"text-align: left\">\n      An internet connection type (WebRTC) appears to be blocked either by your\n      browser settings or your current network. If WebRTC is blocked on your\n      browser you may be able to adjust these settings yourself based on\n      instructions here:\n      <a href=\"https://myownconference.com/blog/en/webrtc/\" target=\"blank\"\n        >https://myownconference.com/blog/en/webrtc/</a\n      >\n      <br /><br />\n      Trying a different web browser may help confirm this as well. If WebRTC is\n      blocked by your network, try switching to a different network if possible\n      or contact your network administrator.<br /><br />\n      WebRTC is common, safe and increasingly utilised method for streaming real\n      time 3D experiences via a web browser. It typically consumes no more\n      bandwidth than streaming an HD video.\n    </div>\n  </section>\n  <footer class=\"src-modal__footer\">\n    <src-button\n      (onClick)=\"closeModalWithCirrusDisconnect()\"\n      [data-testid]=\"'close-webrtc-error-modal'\"\n      weight=\"primary\"\n    >\n      Ok\n    </src-button>\n  </footer>\n</div>\n", styles: [".src-modal{--modalBodyPadding: 20px 8px 20px 20px;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto}.src-modal__body{width:100%}.src-modal__body p{color:var(--src-text-body-main, #1f2937);font-size:14px;font-style:normal;font-weight:400;line-height:24px;margin-top:0}.src-modal__body a{word-wrap:break-word;white-space:normal}\n"], dependencies: [{ kind: "component", type: SourceButtonComponent, selector: "src-button", inputs: ["type", "appearance", "weight", "size", "context", "customClass", "isFullWidth", "isPressed", "isDisabled", "isLoading", "isInverted", "srcButtonConfig", "formID", "data-testid", "ariaLabel"], outputs: ["onClick", "onSubmit"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.4", type: WebrtcErrorModalComponent, isStandalone: true, selector: "app-webrtc-error-modal", ngImport: i0, template: "<div [attr.data-testid]=\"'webrtc-error-modal'\" class=\"src-modal\">\r\n  <header class=\"src-modal__header\"></header>\r\n  <section class=\"src-modal__body\">\r\n    <div [attr.data-testid]=\"'title'\" class=\"src-modal__title\">\r\n      WebRTC error\r\n    </div>\r\n    <div style=\"text-align: left\">\r\n      An internet connection type (WebRTC) appears to be blocked either by your\r\n      browser settings or your current network. If WebRTC is blocked on your\r\n      browser you may be able to adjust these settings yourself based on\r\n      instructions here:\r\n      <a href=\"https://myownconference.com/blog/en/webrtc/\" target=\"blank\"\r\n        >https://myownconference.com/blog/en/webrtc/</a\r\n      >\r\n      <br /><br />\r\n      Trying a different web browser may help confirm this as well. If WebRTC is\r\n      blocked by your network, try switching to a different network if possible\r\n      or contact your network administrator.<br /><br />\r\n      WebRTC is common, safe and increasingly utilised method for streaming real\r\n      time 3D experiences via a web browser. It typically consumes no more\r\n      bandwidth than streaming an HD video.\r\n    </div>\r\n  </section>\r\n  <footer class=\"src-modal__footer\">\r\n    <src-button\r\n      (onClick)=\"closeModalWithCirrusDisconnect()\"\r\n      [data-testid]=\"'close-webrtc-error-modal'\"\r\n      weight=\"primary\"\r\n    >\r\n      Ok\r\n    </src-button>\r\n  </footer>\r\n</div>\r\n", styles: [".src-modal{--modalBodyPadding: 20px 8px 20px 20px;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto}.src-modal__body{width:100%}.src-modal__body p{color:var(--src-text-body-main, #1f2937);font-size:14px;font-style:normal;font-weight:400;line-height:24px;margin-top:0}.src-modal__body a{word-wrap:break-word;white-space:normal}\n"], dependencies: [{ kind: "component", type: SourceButtonComponent, selector: "src-button", inputs: ["type", "appearance", "weight", "size", "context", "customClass", "isFullWidth", "isPressed", "isDisabled", "isLoading", "isInverted", "srcButtonConfig", "formID", "data-testid", "ariaLabel"], outputs: ["onClick", "onSubmit"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: WebrtcErrorModalComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-webrtc-error-modal', changeDetection: ChangeDetectionStrategy.OnPush, imports: [SourceButtonComponent], template: "<div [attr.data-testid]=\"'webrtc-error-modal'\" class=\"src-modal\">\n  <header class=\"src-modal__header\"></header>\n  <section class=\"src-modal__body\">\n    <div [attr.data-testid]=\"'title'\" class=\"src-modal__title\">\n      WebRTC error\n    </div>\n    <div style=\"text-align: left\">\n      An internet connection type (WebRTC) appears to be blocked either by your\n      browser settings or your current network. If WebRTC is blocked on your\n      browser you may be able to adjust these settings yourself based on\n      instructions here:\n      <a href=\"https://myownconference.com/blog/en/webrtc/\" target=\"blank\"\n        >https://myownconference.com/blog/en/webrtc/</a\n      >\n      <br /><br />\n      Trying a different web browser may help confirm this as well. If WebRTC is\n      blocked by your network, try switching to a different network if possible\n      or contact your network administrator.<br /><br />\n      WebRTC is common, safe and increasingly utilised method for streaming real\n      time 3D experiences via a web browser. It typically consumes no more\n      bandwidth than streaming an HD video.\n    </div>\n  </section>\n  <footer class=\"src-modal__footer\">\n    <src-button\n      (onClick)=\"closeModalWithCirrusDisconnect()\"\n      [data-testid]=\"'close-webrtc-error-modal'\"\n      weight=\"primary\"\n    >\n      Ok\n    </src-button>\n  </footer>\n</div>\n", styles: [".src-modal{--modalBodyPadding: 20px 8px 20px 20px;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto}.src-modal__body{width:100%}.src-modal__body p{color:var(--src-text-body-main, #1f2937);font-size:14px;font-style:normal;font-weight:400;line-height:24px;margin-top:0}.src-modal__body a{word-wrap:break-word;white-space:normal}\n"] }]
+            args: [{ selector: 'app-webrtc-error-modal', changeDetection: ChangeDetectionStrategy.OnPush, imports: [SourceButtonComponent], template: "<div [attr.data-testid]=\"'webrtc-error-modal'\" class=\"src-modal\">\r\n  <header class=\"src-modal__header\"></header>\r\n  <section class=\"src-modal__body\">\r\n    <div [attr.data-testid]=\"'title'\" class=\"src-modal__title\">\r\n      WebRTC error\r\n    </div>\r\n    <div style=\"text-align: left\">\r\n      An internet connection type (WebRTC) appears to be blocked either by your\r\n      browser settings or your current network. If WebRTC is blocked on your\r\n      browser you may be able to adjust these settings yourself based on\r\n      instructions here:\r\n      <a href=\"https://myownconference.com/blog/en/webrtc/\" target=\"blank\"\r\n        >https://myownconference.com/blog/en/webrtc/</a\r\n      >\r\n      <br /><br />\r\n      Trying a different web browser may help confirm this as well. If WebRTC is\r\n      blocked by your network, try switching to a different network if possible\r\n      or contact your network administrator.<br /><br />\r\n      WebRTC is common, safe and increasingly utilised method for streaming real\r\n      time 3D experiences via a web browser. It typically consumes no more\r\n      bandwidth than streaming an HD video.\r\n    </div>\r\n  </section>\r\n  <footer class=\"src-modal__footer\">\r\n    <src-button\r\n      (onClick)=\"closeModalWithCirrusDisconnect()\"\r\n      [data-testid]=\"'close-webrtc-error-modal'\"\r\n      weight=\"primary\"\r\n    >\r\n      Ok\r\n    </src-button>\r\n  </footer>\r\n</div>\r\n", styles: [".src-modal{--modalBodyPadding: 20px 8px 20px 20px;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto}.src-modal__body{width:100%}.src-modal__body p{color:var(--src-text-body-main, #1f2937);font-size:14px;font-style:normal;font-weight:400;line-height:24px;margin-top:0}.src-modal__body a{word-wrap:break-word;white-space:normal}\n"] }]
         }] });
 
 class CommandTelemetryService extends SubService {
@@ -1637,6 +1674,10 @@ class RegionsPingService {
      * entry is well-formed and still within {@link REGION_PING_CACHE_TTL_MS}.
      * All access is guarded — `localStorage` can throw (private mode, disabled
      * storage) or be absent (non-browser).
+     *
+     * Public so adopted connections (which skip `getFastest`) can replay the
+     * region-resolving telemetry phase from the same cached winner — see
+     * `UnrealEffects.regionTelemetryOnAdopt$`.
      */
     readCachedWinner() {
         try {
@@ -2392,6 +2433,22 @@ class SignallingService extends SubService {
         Logger.log('WS HANDLERS ADDED');
         OnOpenHandler.call(this);
     }
+    /**
+     * Adopt a live signalling socket opened by the `stream-prefetch.js`
+     * head-script. The socket is already OPEN and `requestStream` was already
+     * sent, so — unlike {@link addWsHandlers} — we attach message/close/error
+     * handlers but deliberately skip {@link OnOpenHandler} (which would
+     * `setCirrusConnected` + re-`sendRequestStream`). Reuses the head-script's
+     * `correlationId` so subsequent correlated messages line up.
+     */
+    adoptSocket(ws, correlationId) {
+        this.correlationId = correlationId;
+        ws.onmessage = OnMessageHandler.bind(this);
+        ws.onclose = OnCloseHandler.bind(this);
+        ws.onerror = OnErrorHandler.bind(this);
+        this.ws = ws;
+        Logger.log('WS ADOPTED (handshake already done, requestStream already sent)');
+    }
     showStatusMessage(statusMessage) {
         this.store.dispatch(setStatusMessage({ statusMessage }));
     }
@@ -2498,77 +2555,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImpor
             args: [{ providedIn: 'root' }]
         }], ctorParameters: () => [] });
 
-class UnrealCallbackService {
-    constructor() {
-        this.actions$ = inject(Actions);
-    }
-    /**
-     * Listens for unreal command callbacks matching a specific command or event type.
-     *
-     * Supports both MetaBoxCommand keys (e.g. `MetaBoxCommand.FLoadProductCommand`)
-     * and custom Unreal callback events (e.g. `'cameraChanged'`, `'onSceneState'`).
-     *
-     * @param command - The command or event key to filter callbacks by
-     * @returns Observable that emits matching callback payloads
-     *
-     * @example
-     * ```ts
-     * // Listen for a MetaBox command callback
-     * this.unrealCallbackService
-     *   .fromUnrealCallback(MetaBoxCommand.FLoadProductCommand)
-     *   .subscribe(data => console.log(data));
-     *
-     * // Listen for a custom Unreal event
-     * this.unrealCallbackService
-     *   .fromUnrealCallback('cameraChanged')
-     *   .subscribe(data => console.log(data));
-     * ```
-     */
-    fromUnrealCallback(command) {
-        return this.actions$.pipe(ofType(unrealCommandCallback), map$1(({ json }) => 'commandCallback' in json ? json.commandCallback : json), filter((json) => json.command === command), 
-        // Cast is required: after a `command`-based filter TS cannot narrow to a
-        // type discriminated on `callback`. The unwrapped object IS the full callback.
-        map$1((data) => data));
-    }
-    /**
-     * Sends a command and observes the matching response by correlationId.
-     * Replaces the old `observeCommandResponse` standalone function.
-     *
-     * @param data - The command data to send
-     * @param sender - Function to send the command to Unreal
-     * @param timeOut - Timeout in ms (default 60000)
-     * @param dispatchOnTimeout - Whether to emit on timeout (default true)
-     *
-     * @example
-     * ```ts
-     * this.unrealCallbackService
-     *   .observeCommandResponse<FLoopBackCommand['command']>(
-     *     { command: MetaBoxCommand.FLoopBackCommand },
-     *     (data) => this.communicator.sendCommandToUnreal(data),
-     *   )
-     *   .subscribe();
-     * ```
-     */
-    observeCommandResponse(data, sender, timeOut = 60000, dispatchOnTimeout = true) {
-        const correlationId = generateUuid();
-        return defer(() => {
-            const observable = this.actions$.pipe(ofType(unrealCommandCallback), map$1(({ json }) => 'commandCallback' in json ? json.commandCallback : json), filter((json) => json.correlationId === correlationId), timeout$1(timeOut), catchError(() => dispatchOnTimeout
-                ? of({ command: 'timeout', correlationId: 'timeout' })
-                : of(null)), take(1), tapLog('Command Response Observer'), filter(Truthy), 
-            // Cast: response is matched by correlationId, so it is the callback for K.
-            map$1((data) => data));
-            setTimeout(() => sender({ ...data, correlationId }), 0);
-            return observable;
-        });
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: UnrealCallbackService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: UnrealCallbackService, providedIn: 'root' }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: UnrealCallbackService, decorators: [{
-            type: Injectable,
-            args: [{ providedIn: 'root' }]
-        }] });
-
 /**
  * Default LBM Filter Parameters
  */
@@ -2601,7 +2587,13 @@ class VideoService extends SubService {
         this.audio = null;
         this.container = null;
         this.latencyTestTimings = new LatencyTimings();
-        this.videoTrack$ = new Subject();
+        // BehaviorSubject (not Subject) so a late subscriber to `videoStats$` still
+        // gets the current track. Adoption (`WebRtcPlayerService.adopt`) calls
+        // `attachVideoStream` synchronously/early — before the resize and app-init
+        // (`initAppByDataChannelReady$`) subscribers attach — and a plain Subject
+        // would drop that emission, so the stats interval (and `setViewportReady`,
+        // gated on `framesPerSecond`) would never start.
+        this.videoTrack$ = new BehaviorSubject(null);
         this.VideoEncoderQP = 0;
         this.aggregatedStats = {};
         this.kalmanFilter1D = new KalmanFilter1D(FilterModel.initialBitrateEstimate, FilterModel.initialErrorCovariance, FilterModel.processNoise, FilterModel.measurementNoise);
@@ -3290,7 +3282,11 @@ class WebRtcPlayerService extends SubService {
         const dcState = this.dcClient?.readyState;
         if (dcState && dcState !== 'open') {
             Logger.warn(`[Reconnect] DataChannel in "${dcState}" state during send, initiating peer reconnection`);
-            this.store.dispatch(reconnectPeer({ attempt: 1, maxAttempts: 3, delay: 0 }));
+            this.store.dispatch(reconnectPeer({
+                attempt: 1,
+                maxAttempts: RECONNECT_CONFIG.maxAttempts,
+                delay: 0,
+            }));
         }
     }
     /**
@@ -3315,6 +3311,51 @@ class WebRtcPlayerService extends SubService {
         void this.createWebRtcOffer();
         return true;
     }
+    /**
+     * Adopt a fully-negotiated connection prefetched by `stream-prefetch.js`:
+     * take ownership of its PeerConnection, DataChannel and media stream instead
+     * of running the handshake. The head-script attached property-based handlers
+     * (`pc.onicecandidate`, `dc.onmessage`, …) and buffered inbound DC messages;
+     * here we detach those, wire our own (addEventListener-based) handlers, replay
+     * the buffer in order, then drive `onDataChannelConnected` manually because the
+     * DataChannel is already open (its `open` event won't fire again).
+     */
+    adopt(pc, dc, stream, config, dcBuffer) {
+        // No prior pc/dc should exist on a fresh boot; closePC is idempotent.
+        this.closePC();
+        this.pcClient = pc;
+        this.cfg = config ?? {};
+        // Connection is fully negotiated — any late ICE goes straight in, not buffered.
+        this.remoteDescriptionSet = true;
+        // Detach the head-script's property handlers so events aren't processed
+        // twice once our addEventListener-based handlers are attached below.
+        pc.onicecandidate = null;
+        pc.ondatachannel = null;
+        pc.ontrack = null;
+        this.handlePeerConnectionEvents(pc);
+        // `setupPeerConnection` normally wires this; replicate for the adopted pc.
+        this.disconnect$
+            .pipe(take(1), takeUntil(this.destroy$))
+            .subscribe(() => this.closePC());
+        // Wire the already-open DataChannel. Nulling then re-listening is safe:
+        // these statements run synchronously, so no `message` event can interleave
+        // between detaching the script's handler and replaying the buffer.
+        dc.onmessage = null;
+        dc.onopen = null;
+        dc.onclose = null;
+        this.dcClient = this.setupDataChannelCallbacks(dc);
+        for (const buffered of dcBuffer) {
+            this.onDataChannelMessage$.next(buffered);
+        }
+        // DC is open already: balance the span `setupDataChannelCallbacks` opened
+        // (its `open` handler won't fire) and announce the connection ourselves.
+        this.commandTelemetryService.trackStopCommand('EXT-DataChannel Connection');
+        this.onDataChannelConnected();
+        // Attach the prefetched media to a fresh <video> (container is set by the
+        // scene component before `initSignalling`, so `create()` has a DOM target).
+        this.videoService.create();
+        this.videoService.attachVideoStream(stream, pc);
+    }
     setConfig(parOptions = {}) {
         const urlParams = new URLSearchParams(window.location.search);
         //**********************
@@ -3545,6 +3586,203 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImpor
             args: [{ providedIn: 'root' }]
         }], ctorParameters: () => [] });
 
+/**
+ * Adopts a WebRTC connection prefetched by the `stream-prefetch.js` head-script
+ * and parked on `window.__stream`, instead of running `connectToSignaling` from
+ * scratch. Called from the same seam where signalling normally starts
+ * (`connectToSignaling$` effect); if there is nothing ready to adopt it returns
+ * `false` and the caller falls back to the normal connect — strictly additive.
+ */
+class StreamAdoptionService {
+    constructor() {
+        this.store = inject(Store);
+        this.signalling = inject(SignallingService);
+        this.webRtc = inject(WebRtcPlayerService);
+    }
+    /**
+     * Decide adoption, WAITING for an in-flight prefetch instead of racing it.
+     *
+     * - nothing parked → emit `false` at once (caller connects normally).
+     * - already settled (`ready`/`failed`/`adopted`) → adopt-if-ready at once.
+     * - still `connecting` → wait for the script's `onSettled` callback and
+     *   adopt-if-ready the instant it fires (event-driven, zero polling latency).
+     *
+     * Deliberately NO time budget: for DIRECT orchestration the prefetch holds
+     * the socket open while the orchestrator provisions a machine, which can take
+     * minutes (150–200s+). A fixed deadline would make Angular give up and open a
+     * second connection mid-provisioning — exactly the race/orphan this avoids.
+     * The wait is bounded by liveness instead: the script flips the parked state
+     * to `failed` on a dead socket (`ws.onclose`/`onerror`), and the caller wraps
+     * this in `takeUntil(abortEstablishingConnection)`, so a route change / teardown
+     * cancels it. Emits exactly once. Cancelling runs no adoption — which is what
+     * stops a fast route-switch from starting overlapping connections.
+     *
+     * Wrapped in `defer` so the `tryAdopt()` side effect (which dispatches
+     * `streamAdopted`) runs at SUBSCRIPTION time, not when the observable is
+     * built. The effect prepends `startWith(setEstablishingConnection(true))`,
+     * which starts the telemetry session and subscribes its phase catalog; that
+     * must happen BEFORE `streamAdopted` → `regionTelemetryOnAdopt$` replays
+     * `regionResolved`, or the region phase fires into a session that doesn't
+     * exist yet and is lost. `defer` guarantees that ordering.
+     */
+    awaitAndAdopt$() {
+        return defer(() => {
+            const parked = window.__stream;
+            if (!parked) {
+                return of(false);
+            }
+            if (parked.state !== 'connecting') {
+                return of(this.tryAdopt());
+            }
+            Logger.info('[Adoption] Prefetch in progress — waiting before connecting');
+            return this.awaitSettled$(parked);
+        });
+    }
+    /**
+     * Event-driven wait: the script fires `onSettled` the instant it parks
+     * `ready`/`failed`, so we adopt with zero polling lag. Emits exactly once.
+     *
+     * No timer/budget by design: an indefinitely `connecting` stream is valid
+     * (DIRECT orchestration holds the socket open for minutes while it
+     * provisions), and every terminal state — including a dead socket — flips to
+     * `ready`/`failed` and fires the hook. Teardown (route change → unsubscribe)
+     * sets `done`, so a late callback after cancel can't trigger a stray adoption.
+     */
+    awaitSettled$(parked) {
+        return new Observable((subscriber) => {
+            let done = false;
+            parked.onSettled(() => {
+                if (done)
+                    return;
+                done = true;
+                subscriber.next(this.tryAdopt());
+                subscriber.complete();
+            });
+            return () => {
+                done = true;
+            };
+        });
+    }
+    /**
+     * @returns `true` if a ready parked stream was adopted (caller must NOT
+     *          start a fresh connection), `false` otherwise.
+     */
+    tryAdopt() {
+        const parked = window.__stream;
+        if (!parked || parked.state !== 'ready') {
+            return false;
+        }
+        // A ready stream whose transport died before adoption is useless — fall back.
+        if (!parked.ws ||
+            parked.ws.readyState !== WS_OPEN_STATE ||
+            !parked.pc ||
+            !parked.dc ||
+            !parked.stream) {
+            Logger.warn('[Adoption] Parked stream is ready but transport is not live');
+            return false;
+        }
+        Logger.info('[Adoption] Adopting prefetched stream', parked.timings);
+        // Clear the script's timers and mark the handoff complete.
+        parked.adopt();
+        // Flag cirrus connected (so a later `initSignalling` won't open a 2nd
+        // connection), record the adopted machine, and hydrate the streamer info
+        // (`ssData`) the prefetch captured from the `ssInfo` message. NOTE:
+        // clientId/viewId are left untouched — the host app (metabox) already set
+        // them authoritatively from its own data before `initSignalling`; the
+        // script's ids are only used internally to establish the connection.
+        this.store.dispatch(streamAdopted({
+            machineId: parked.machineId ?? null,
+            ssData: parked.ssData ?? null,
+            timings: parked.timings ?? null,
+        }));
+        // Hand the live socket over without re-sending `requestStream`, reusing the
+        // script's correlationId (the one `requestStream` was already sent with).
+        this.signalling.adoptSocket(parked.ws, parked.ids.correlationId);
+        // Take ownership of pc/dc/media + replay buffered DC traffic. This drives
+        // `dataChannelConnected`, which the `unrealReceiverReady$` effect turns into
+        // `dataChannelReady` → app init (console commands, loopback, viewport).
+        this.webRtc.adopt(parked.pc, parked.dc, parked.stream, parked.config ?? {}, parked.dcBuffer);
+        return true;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: StreamAdoptionService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: StreamAdoptionService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: StreamAdoptionService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
+
+class UnrealCallbackService {
+    constructor() {
+        this.actions$ = inject(Actions);
+    }
+    /**
+     * Listens for unreal command callbacks matching a specific command or event type.
+     *
+     * Supports both MetaBoxCommand keys (e.g. `MetaBoxCommand.FLoadProductCommand`)
+     * and custom Unreal callback events (e.g. `'cameraChanged'`, `'onSceneState'`).
+     *
+     * @param command - The command or event key to filter callbacks by
+     * @returns Observable that emits matching callback payloads
+     *
+     * @example
+     * ```ts
+     * // Listen for a MetaBox command callback
+     * this.unrealCallbackService
+     *   .fromUnrealCallback(MetaBoxCommand.FLoadProductCommand)
+     *   .subscribe(data => console.log(data));
+     *
+     * // Listen for a custom Unreal event
+     * this.unrealCallbackService
+     *   .fromUnrealCallback('cameraChanged')
+     *   .subscribe(data => console.log(data));
+     * ```
+     */
+    fromUnrealCallback(command) {
+        return this.actions$.pipe(ofType(unrealCommandCallback), map$1(({ json }) => 'commandCallback' in json ? json.commandCallback : json), filter((json) => json.command === command), 
+        // Cast is required: after a `command`-based filter TS cannot narrow to a
+        // type discriminated on `callback`. The unwrapped object IS the full callback.
+        map$1((data) => data));
+    }
+    /**
+     * Sends a command and observes the matching response by correlationId.
+     * Replaces the old `observeCommandResponse` standalone function.
+     *
+     * @param data - The command data to send
+     * @param sender - Function to send the command to Unreal
+     * @param timeOut - Timeout in ms (default 60000)
+     * @param dispatchOnTimeout - Whether to emit on timeout (default true)
+     *
+     * @example
+     * ```ts
+     * this.unrealCallbackService
+     *   .observeCommandResponse<FLoopBackCommand['command']>(
+     *     { command: MetaBoxCommand.FLoopBackCommand },
+     *     (data) => this.communicator.sendCommandToUnreal(data),
+     *   )
+     *   .subscribe();
+     * ```
+     */
+    observeCommandResponse(data, sender, timeOut = 60000, dispatchOnTimeout = true) {
+        const correlationId = generateUuid();
+        return defer(() => {
+            const observable = this.actions$.pipe(ofType(unrealCommandCallback), map$1(({ json }) => 'commandCallback' in json ? json.commandCallback : json), filter((json) => json.correlationId === correlationId), timeout$1(timeOut), catchError(() => dispatchOnTimeout
+                ? of({ command: 'timeout', correlationId: 'timeout' })
+                : of(null)), take(1), tapLog('Command Response Observer'), filter(Truthy), 
+            // Cast: response is matched by correlationId, so it is the callback for K.
+            map$1((data) => data));
+            setTimeout(() => sender({ ...data, correlationId }), 0);
+            return observable;
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: UnrealCallbackService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: UnrealCallbackService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: UnrealCallbackService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
+
 class UnrealCommunicatorService extends SubService {
     constructor() {
         super();
@@ -3675,11 +3913,11 @@ class UnrealErrorModalComponent {
         this.#dialogRef.close();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: UnrealErrorModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.4", type: UnrealErrorModalComponent, isStandalone: true, selector: "app-unreal-error-modal", ngImport: i0, template: "<div class=\"src-modal src-modal--small\">\n  <header class=\"src-modal__header\">\n    <div\n      [attr.data-testid]=\"'unreal-error-header-title'\"\n      class=\"src-modal__title\"\n    >\n      Warning\n    </div>\n  </header>\n  <div class=\"src-modal__body\">\n    <div>{{ dialogData.content }}</div>\n  </div>\n  <div class=\"src-modal__footer\">\n    <src-button (onClick)=\"close()\">Ok</src-button>\n  </div>\n</div>\n", styles: [".src-modal__header{padding:16px 24px 0}\n"], dependencies: [{ kind: "component", type: SourceButtonComponent, selector: "src-button", inputs: ["type", "appearance", "weight", "size", "context", "customClass", "isFullWidth", "isPressed", "isDisabled", "isLoading", "isInverted", "srcButtonConfig", "formID", "data-testid", "ariaLabel"], outputs: ["onClick", "onSubmit"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.4", type: UnrealErrorModalComponent, isStandalone: true, selector: "app-unreal-error-modal", ngImport: i0, template: "<div class=\"src-modal src-modal--small\">\r\n  <header class=\"src-modal__header\">\r\n    <div\r\n      [attr.data-testid]=\"'unreal-error-header-title'\"\r\n      class=\"src-modal__title\"\r\n    >\r\n      Warning\r\n    </div>\r\n  </header>\r\n  <div class=\"src-modal__body\">\r\n    <div>{{ dialogData.content }}</div>\r\n  </div>\r\n  <div class=\"src-modal__footer\">\r\n    <src-button (onClick)=\"close()\">Ok</src-button>\r\n  </div>\r\n</div>\r\n", styles: [".src-modal__header{padding:16px 24px 0}\n"], dependencies: [{ kind: "component", type: SourceButtonComponent, selector: "src-button", inputs: ["type", "appearance", "weight", "size", "context", "customClass", "isFullWidth", "isPressed", "isDisabled", "isLoading", "isInverted", "srcButtonConfig", "formID", "data-testid", "ariaLabel"], outputs: ["onClick", "onSubmit"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: UnrealErrorModalComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-unreal-error-modal', changeDetection: ChangeDetectionStrategy.OnPush, imports: [SourceButtonComponent], template: "<div class=\"src-modal src-modal--small\">\n  <header class=\"src-modal__header\">\n    <div\n      [attr.data-testid]=\"'unreal-error-header-title'\"\n      class=\"src-modal__title\"\n    >\n      Warning\n    </div>\n  </header>\n  <div class=\"src-modal__body\">\n    <div>{{ dialogData.content }}</div>\n  </div>\n  <div class=\"src-modal__footer\">\n    <src-button (onClick)=\"close()\">Ok</src-button>\n  </div>\n</div>\n", styles: [".src-modal__header{padding:16px 24px 0}\n"] }]
+            args: [{ selector: 'app-unreal-error-modal', changeDetection: ChangeDetectionStrategy.OnPush, imports: [SourceButtonComponent], template: "<div class=\"src-modal src-modal--small\">\r\n  <header class=\"src-modal__header\">\r\n    <div\r\n      [attr.data-testid]=\"'unreal-error-header-title'\"\r\n      class=\"src-modal__title\"\r\n    >\r\n      Warning\r\n    </div>\r\n  </header>\r\n  <div class=\"src-modal__body\">\r\n    <div>{{ dialogData.content }}</div>\r\n  </div>\r\n  <div class=\"src-modal__footer\">\r\n    <src-button (onClick)=\"close()\">Ok</src-button>\r\n  </div>\r\n</div>\r\n", styles: [".src-modal__header{padding:16px 24px 0}\n"] }]
         }] });
 
 class UnrealEffects {
@@ -3696,6 +3934,7 @@ class UnrealEffects {
         this.commandTelemetryService = inject(CommandTelemetryService);
         this.regionsPingService = inject(RegionsPingService);
         this.signallingService = inject(SignallingService);
+        this.streamAdoptionService = inject(StreamAdoptionService);
         this.videoService = inject(VideoService);
         this.unrealCallbackService = inject(UnrealCallbackService);
         this.dataChannelConnectionTimeout = this.unrealInitialConfig?.dataChannelConnectionTimeout ??
@@ -3703,17 +3942,6 @@ class UnrealEffects {
         this.connectionCompleted$ = this.store
             .select(unrealFeature.selectDataChannelConnected)
             .pipe(filter(Truthy));
-        this.reconnectConfig = {
-            enabled: this.unrealInitialConfig?.reconnect?.enabled ?? DEFAULT_RECONNECT_ENABLED,
-            maxAttempts: this.unrealInitialConfig?.reconnect?.maxAttempts ??
-                DEFAULT_RECONNECT_MAX_ATTEMPTS,
-            delayMs: this.unrealInitialConfig?.reconnect?.delayMs ??
-                DEFAULT_RECONNECT_DELAY_MS,
-            onIceFailure: this.unrealInitialConfig?.reconnect?.onIceFailure ??
-                DEFAULT_RECONNECT_ON_ICE_FAILURE,
-            onDataChannelClose: this.unrealInitialConfig?.reconnect?.onDataChannelClose ??
-                DEFAULT_RECONNECT_ON_DATACHANNEL_CLOSE,
-        };
         this.destroyConnections$ = createEffect(() => {
             return this.actions$.pipe(ofType(destroyUnrealScene), map(() => destroyRemoteConnections({ reason: DisconnectReason.Destroy })));
         });
@@ -3900,8 +4128,8 @@ class UnrealEffects {
          * Effect: `handleDataChannelClosed$`
          *
          * Triggers peer reconnection when DataChannel closes unexpectedly.
-         * Only triggers if reconnection is enabled, onDataChannelClose is true,
-         * and the signaling WebSocket is still connected.
+         * Only triggers if reconnection is enabled and the signaling WebSocket
+         * is still connected.
          */
         this.handleDataChannelClosed$ = createEffect(() => {
             return this.actions$.pipe(ofType(disconnectStream), filter(({ reason }) => reason === DisconnectReason.DataChannelClosed &&
@@ -3909,7 +4137,7 @@ class UnrealEffects {
                 Logger.warn('[Reconnect] DataChannel closed, initiating peer reconnection');
             }), map(() => reconnectPeer({
                 attempt: 1,
-                maxAttempts: this.reconnectConfig.maxAttempts,
+                maxAttempts: RECONNECT_CONFIG.maxAttempts,
                 delay: 0,
             })));
         });
@@ -3924,7 +4152,7 @@ class UnrealEffects {
          * Resets the data channel state when peer reconnection starts.
          */
         this.resetStateForPeerReconnect$ = createEffect(() => {
-            return this.actions$.pipe(ofType(reconnectPeer), filter(() => this.reconnectConfig.enabled), filter(({ attempt }) => attempt === 1), // Only reset on the first attempt
+            return this.actions$.pipe(ofType(reconnectPeer), filter(() => RECONNECT_CONFIG.enabled), filter(({ attempt }) => attempt === 1), // Only reset on the first attempt
             map(() => resetDataChannelForReconnect()));
         });
         /**
@@ -3934,9 +4162,9 @@ class UnrealEffects {
          * This only re-establishes the WebRTC connection, not the signaling.
          */
         this.executePeerReconnect$ = createEffect(() => {
-            return this.actions$.pipe(ofType(reconnectPeer), filter(() => this.reconnectConfig.enabled), tap(({ attempt, maxAttempts }) => {
-                Logger.info(`[Reconnect] Peer reconnection attempt ${attempt}/${maxAttempts} in ${this.reconnectConfig.delayMs}ms`);
-            }), switchMap(({ attempt, maxAttempts, delay }) => timer(delay ?? this.reconnectConfig.delayMs).pipe(switchMap(() => {
+            return this.actions$.pipe(ofType(reconnectPeer), filter(() => RECONNECT_CONFIG.enabled), tap(({ attempt, maxAttempts }) => {
+                Logger.info(`[Reconnect] Peer reconnection attempt ${attempt}/${maxAttempts} in ${RECONNECT_CONFIG.delayMs}ms`);
+            }), switchMap(({ attempt, maxAttempts, delay }) => timer(delay ?? RECONNECT_CONFIG.delayMs).pipe(switchMap(() => {
                 const success = this.webRtcPlayerService.reconnectPeer();
                 if (!success) {
                     Logger.error('[Reconnect] Failed to initiate peer reconnection');
@@ -4007,13 +4235,23 @@ class UnrealEffects {
                 return autoStart && !cirrusConnected;
             }), map(([, matchMakerUrls]) => [...matchMakerUrls].filter(Truthy)), filter((urls) => urls.length > 0), 
             // Ensure a single in-flight request per attempt.
-            exhaustMap((urls) => this.signallingService.connectToSignaling(urls)));
-        }, { dispatch: false });
+            exhaustMap((urls) => 
+            // If a prefetched `window.__stream` is ready — or still connecting —
+            // adopt it (waiting for it to finish) instead of racing a second
+            // connection; otherwise fall back to a fresh signalling connection.
+            // `takeUntil(abort)` cancels the wait on teardown / route change so a
+            // fast switch can't leave overlapping connections.
+            this.streamAdoptionService.awaitAndAdopt$().pipe(switchMap((adopted) => adopted ? EMPTY : this.signallingService.connectToSignaling(urls)), takeUntil(this.actions$.pipe(ofType(abortEstablishingConnection))), 
+            // The adopt/connect stream is side-effect-only (its values aren't
+            // actions) — swallow them, and emit `setEstablishingConnection`
+            // first so the reconnect/resume popup stays hidden during the
+            // (possibly deferred) prefetch-adoption wait. Adoption otherwise
+            // defers `connectToSignaling`, which is what normally sets this.
+            ignoreElements(), startWith(setEstablishingConnection({ value: true })))));
+        });
     }
     canPeerReconnect() {
-        return (this.reconnectConfig.enabled &&
-            this.reconnectConfig.onDataChannelClose &&
-            this.signallingService.isConnected());
+        return RECONNECT_CONFIG.enabled && this.signallingService.isConnected();
     }
     /**
      * Either schedules the next peer-reconnect attempt or gives up with the
@@ -5319,6 +5557,19 @@ const QP_RED_THRESHOLD = 35;
 const FPS_LOW_RATIO = 0.7; // p50 fps below 70% of target
 const UNLIMITED_REFERENCE_FPS = 60;
 const SAMPLE_WINDOW_MS = 5000;
+/**
+ * Catalog phase ids the prefetch establishes invisibly. For an adopted
+ * connection their live closers are suppressed and the phases are emitted by
+ * {@link StreamStatusTelemetryService2.emitAdoptedConnection} instead, timed
+ * from the prefetch's own marks and anchored at the moment Angular reached the
+ * connect call (session start) — so the waterfall shows the time the prefetch
+ * actually SAVED, not the prefetch's page-load-parallel raw timeline.
+ */
+const PREFETCHED_PHASE_IDS = new Set([
+    'region-resolving',
+    'signaling-connection',
+    'webrtc-negotiation',
+]);
 // Persistent per-browser identifier — survives page reloads. Used to group
 // multiple sessions of the same anonymous user for funnel / retention analysis.
 const USER_ID_STORAGE_KEY = 'source3d.streamTelemetry.userId';
@@ -5349,6 +5600,17 @@ class StreamStatusTelemetryService2 {
         this.disconnectReason$ = this.store.selectSignal(unrealFeature.selectDisconnectReason);
         this.errorMessage$ = this.store.selectSignal(unrealFeature.selectErrorMessage);
         this.viewPortReady$ = this.store.selectSignal(unrealFeature.selectViewportReady);
+        /**
+         * Synchronous adoption flag. The `streamAdopted` reducer sets it BEFORE any
+         * action subscriber runs, so the connection-phase closers (which fire inside
+         * the same dispatch, e.g. `ssinfo-received` off the `ssData` state change)
+         * can read it and defer to the prefetch-timed attribution emitted by
+         * {@link emitAdoptedConnection} instead of recording the live wall-clock.
+         */
+        this.adopted$ = this.store.selectSignal(unrealFeature.selectAdopted);
+        /** Streamer identity for the adopted signaling phase params. */
+        this.ssData$ = this.store.selectSignal(unrealFeature.selectSsData);
+        this.awsInstance$ = this.store.selectSignal(unrealFeature.selectAwsInstance);
         this.session = null;
         /**
          * Whether a session has already started during the current page lifetime.
@@ -5426,7 +5688,10 @@ class StreamStatusTelemetryService2 {
                     // CLOSER — the `regionResolved` action carries the raw ping
                     // samples (one per probe) from `RegionsPingService`; the
                     // catalog flattens them to a comma-separated string since
-                    // `toPhaseParams` only accepts primitives.
+                    // `toPhaseParams` only accepts primitives. Adopted connections never
+                    // run `getRegion`, but `UnrealEffects.regionTelemetryOnAdopt$` replays
+                    // the region waterfall (start → end → resolved) from the cached winner,
+                    // so this phase still appears with its ping samples.
                     {
                         id: 'region-resolved',
                         event: this.actions$.pipe(ofType(regionResolved), take(1), map(({ region, pingsMs }) => ({
@@ -5738,6 +6003,13 @@ class StreamStatusTelemetryService2 {
                     if (!this.session)
                         return;
                     if (isCloser) {
+                        // Adopted connections receive the region / signaling / webrtc
+                        // phases from `emitAdoptedConnection` (timed from the prefetch's
+                        // own marks). Skip the live closer for those, so the whole
+                        // pre-adoption wait isn't dumped onto whichever connection closer
+                        // happens to fire first at the adoption instant.
+                        if (this.adopted$() && PREFETCHED_PHASE_IDS.has(bucket.id))
+                            return;
                         this.emitPhaseEnded(bucket, bucketIdx, value);
                         return;
                     }
@@ -5748,6 +6020,12 @@ class StreamStatusTelemetryService2 {
                 }));
             });
         });
+        // Adopted connection: emit the region / signaling / webrtc phases timed
+        // from the prefetch marks, anchored at session start (see method doc). The
+        // live closers for these phases are suppressed (PREFETCHED_PHASE_IDS).
+        sub.add(this.actions$
+            .pipe(ofType(streamAdopted))
+            .subscribe(({ timings }) => this.emitAdoptedConnection(timings)));
         const bootstrapInfo = this.collectBootstrapInfo();
         this.emitLifecycle('stream.session_started', {
             sessionId: id,
@@ -5865,6 +6143,154 @@ class StreamStatusTelemetryService2 {
             overlays,
         });
     }
+    /**
+     * Emit the region / signaling / webrtc phases for an ADOPTED connection.
+     *
+     * The prefetch script established the connection in PARALLEL with page load,
+     * so the phases are positioned at their real (anchor-relative) spans — shifted
+     * LEFT to overlap the HTML-loading / route-idle rows — rather than sequentially
+     * after them. That's the whole point of the prefetch: the handshake already
+     * happened while the page was loading. Each phase ships:
+     *  - `duration` — the real sub-step time the prefetch spent.
+     *  - `spanStartMs` — anchor-relative start, so the viewer left-shifts the bar.
+     *  - `adoptionAtMs` — where Angular took over (the next phase, Unreal
+     *    communication, resumes here on the sequential timeline).
+     *  - savings params: `prefetchConnectMs` (full handshake), `prefetchSavedMs`
+     *    (done before Angular was ready), `adoptionWaitMs` (real connect→adopted
+     *    wait), `adoptionOverheadMs` (prefetch-ready → adopted gap).
+     */
+    emitAdoptedConnection(timings) {
+        const s = this.session;
+        if (!s)
+            return;
+        const t = timings ?? {};
+        const now = performance.now();
+        // Everything in anchor-relative ms — the same scale the viewer renders on
+        // (and the prefetch marks share the page `performance` clock).
+        const toMs = (perf) => Math.round(perf - s.anchorPerf);
+        const startMs = toMs(t['prefetch_start'] ?? s.startedAtPerf);
+        const wsOpenMs = Math.max(startMs, toMs(t['ws_open'] ?? t['prefetch_start'] ?? s.startedAtPerf));
+        const readyMs = Math.max(wsOpenMs, toMs(t['ready'] ?? t['dc_open'] ?? t['ws_open'] ?? s.startedAtPerf));
+        const adoptionAtMs = toMs(now);
+        const sessionStartMs = toMs(s.startedAtPerf);
+        const sigDur = wsOpenMs - startMs;
+        const webDur = readyMs - wsOpenMs;
+        const connectMs = readyMs - startMs;
+        // Main-thread blocking from the OPTIONAL `perf-longtask.js` head-script. If
+        // that script isn't on the page `window.__streamPerf` is undefined and
+        // these stay 0 — nothing breaks. Tasks carry page-`performance.now()` start
+        // times, so window them against the raw (pre-`toMs`) ready/adoption marks:
+        //   bootBlockingMs  — total over [0, adoption]: overall JS cost to boot.
+        //   adoptBlockingMs — within [ready, adoption]: how much of the
+        //                     "awaiting Angular code" gap was the thread actually
+        //                     blocked by JS (vs idle waiting). ≈gap ⇒ JS-bound;
+        //                     ≈0 ⇒ the app was just slow to reach the adopt call.
+        const readyPerf = t['ready'] ?? t['dc_open'] ?? t['ws_open'] ?? s.startedAtPerf;
+        const tasks = window.__streamPerf?.longTasks ?? [];
+        let bootBlockingMs = 0;
+        let adoptBlockingMs = 0;
+        let maxLongTaskMs = 0;
+        for (const lt of tasks) {
+            if (lt.start > now)
+                continue; // ignore tasks after adoption
+            bootBlockingMs += lt.dur;
+            if (lt.dur > maxLongTaskMs)
+                maxLongTaskMs = lt.dur;
+            if (lt.start >= readyPerf)
+                adoptBlockingMs += lt.dur;
+        }
+        // Savings, anchored at the moment Angular reached the connect call.
+        const savings = {
+            prefetched: true,
+            prefetchConnectMs: connectMs,
+            // How much of the handshake finished before Angular was ready (the win).
+            prefetchSavedMs: Math.max(0, Math.min(connectMs, sessionStartMs - startMs)),
+            // The real wait Angular experienced (connect call → adopted).
+            adoptionWaitMs: Math.max(0, adoptionAtMs - sessionStartMs),
+            // Gap between the prefetch being ready and Angular adopting it.
+            adoptionOverheadMs: Math.max(0, adoptionAtMs - readyMs),
+            // Main-thread blocking (longtask) — diagnoses whether the gap is JS-bound.
+            bootBlockingMs: Math.round(bootBlockingMs),
+            adoptBlockingMs: Math.round(adoptBlockingMs),
+            maxLongTaskMs: Math.round(maxLongTaskMs),
+        };
+        // Region (phaseNo 1) — served from the ping cache during prefetch (~0),
+        // positioned at the prefetch start; ship the samples.
+        const region = this.readRegionCache();
+        this.emitAdoptedPhase(0, startMs, 0, adoptionAtMs, {
+            region: region?.region_code ?? '',
+            pingsMs: region?.result.length ? `${region.result.join(', ')} ms` : null,
+        });
+        // Signaling (phaseNo 2) — [prefetch_start → ws_open]; streamer identity +
+        // savings; ws-connected marker sits at the phase's own end.
+        this.emitAdoptedPhase(1, startMs, sigDur, adoptionAtMs, {
+            ...this.adoptedSignalingParams(),
+            ...savings,
+            prefetchSignalingMs: sigDur,
+        }, [{ id: 'signaling-ws-connected', time: wsOpenMs }]);
+        // WebRTC negotiation (phaseNo 3) — [ws_open → ready].
+        this.emitAdoptedPhase(2, wsOpenMs, webDur, adoptionAtMs, {
+            iceCandidateCount: 0,
+            prefetchWebrtcMs: webDur,
+        });
+        // Unreal communication chains from the adoption moment (real wall-clock).
+        s.lastMilestonePerf = now;
+    }
+    /**
+     * Emit one adopted phase positioned at its real `spanStartMs` (left-shifted
+     * to overlap page load) with its real prefetch `duration`. `prefetched`,
+     * `spanStartMs` and `adoptionAtMs` ride as top-level wire fields the viewer
+     * uses to lay the bar out; the rest become display params.
+     */
+    emitAdoptedPhase(bucketIdx, spanStartMs, durationMs, adoptionAtMs, extras, milestones = []) {
+        const s = this.session;
+        if (!s)
+            return;
+        const bucket = this.phaseCatalog[bucketIdx];
+        this.track('stream.phase_ended', {
+            sessionId: s.id,
+            phaseNo: bucketIdx + 1,
+            id: bucket.id,
+            color: bucket.color,
+            duration: durationMs,
+            prefetched: true,
+            spanStartMs,
+            adoptionAtMs,
+            milestones,
+            params: toPhaseParams({ ...extras, prefetched: true }),
+            overlays: [],
+        });
+    }
+    /** Streamer identity params for the adopted signaling phase — mirrors the
+     *  `ssinfo-received` closer's shape (client / instanceName / …ssData). */
+    adoptedSignalingParams() {
+        const aws = this.awsInstance$();
+        const ssData = this.ssData$();
+        return {
+            client: aws?.wsUrl ?? null,
+            instanceName: aws?.instanceName ?? null,
+            ...(ssData ?? {}),
+        };
+    }
+    /** Read the region-ping cache the prefetch reused (localStorage), so the
+     *  adopted region phase can still report the winning region + samples. */
+    readRegionCache() {
+        try {
+            const raw = localStorage.getItem(REGION_PING_CACHE_KEY);
+            if (!raw)
+                return null;
+            const parsed = JSON.parse(raw);
+            return {
+                region_code: typeof parsed.region_code === 'string' ? parsed.region_code : '',
+                result: Array.isArray(parsed.result)
+                    ? parsed.result.filter((n) => typeof n === 'number')
+                    : [],
+            };
+        }
+        catch {
+            return null;
+        }
+    }
     handleWindow(samples) {
         if (!this.session)
             return;
@@ -6710,11 +7136,11 @@ class AfkTimeoutModalComponent {
         this.#afkService.reset();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: AfkTimeoutModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.4", type: AfkTimeoutModalComponent, isStandalone: true, selector: "app-afk-timeout-modal", ngImport: i0, template: "@if (isShowAfkPopup()) {\n  <div (click)=\"resetAfk()\" class=\"clickableState\" id=\"videoPlayOverlay\">\n    <div class=\"resume-box\">\n      <div aria-hidden=\"true\" class=\"resume-box__pic\" role=\"presentation\">\n        <div [innerHTML]=\"afkCountdown()\" class=\"text-number\"></div>\n      </div>\n      <div class=\"resume-box__text\">\n        <h3 class=\"resume-box__heading\">Session will time out soon</h3>\n        <p>\n          No activity detected. Press 'Continue' if you wish to keep your\n          session active\n        </p>\n      </div>\n      <src-button\n        [isFullWidth]=\"true\"\n        [data-testid]=\"'continue-session'\"\n        weight=\"primary\"\n        size=\"lg\"\n      >\n        Continue\n      </src-button>\n    </div>\n  </div>\n}\n", styles: ["#videoPlayOverlay{position:absolute;z-index:30;top:0;width:100%;height:100%;font-size:1.8em;font-family:var(--src-font-family-body);background-color:#646464b3}.clickableState{display:flex;justify-content:center;align-items:center;cursor:pointer}.textDisplayState{display:flex}.hiddenState{display:none}.resume-box{width:340px;padding:32px 20px 20px;flex-direction:column;align-items:center;border-radius:var(--src-border-rounded-parent, 8px);background:var(--src-surface-container-main, #fff);box-shadow:0 26px 80px #0003,0 0 1px #0003}.resume-box .resume-box__pic{width:72px;height:72px;margin:0 auto 22px;border-radius:48px;background:#ecf0f2;padding:12px;display:flex;align-items:center;justify-content:center}.resume-box .resume-box__pic .text-number{color:var(--src-colors-text-default, #1f2937);text-align:center;font-family:var(--src-font-family-body);font-size:30px;font-style:normal;font-weight:400;line-height:24px}.resume-box__text{margin-bottom:18px}.resume-box__text p{text-align:center;font-family:var(--src-font-family-body);font-size:var(--src-font-size-sm, 14px);font-style:normal;font-weight:400;line-height:24px;color:var(--src-text-body-secondary, #6b7280)}.resume-box__text .resume-box__heading{color:var(--src-text-body-main, #1f2937);text-align:center;font-family:var(--src-font-family-body);font-size:18px;font-style:normal;font-weight:500;line-height:26px;margin-bottom:8px}\n"], dependencies: [{ kind: "component", type: SourceButtonComponent, selector: "src-button", inputs: ["type", "appearance", "weight", "size", "context", "customClass", "isFullWidth", "isPressed", "isDisabled", "isLoading", "isInverted", "srcButtonConfig", "formID", "data-testid", "ariaLabel"], outputs: ["onClick", "onSubmit"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.4", type: AfkTimeoutModalComponent, isStandalone: true, selector: "app-afk-timeout-modal", ngImport: i0, template: "@if (isShowAfkPopup()) {\r\n  <div (click)=\"resetAfk()\" class=\"clickableState\" id=\"videoPlayOverlay\">\r\n    <div class=\"resume-box\">\r\n      <div aria-hidden=\"true\" class=\"resume-box__pic\" role=\"presentation\">\r\n        <div [innerHTML]=\"afkCountdown()\" class=\"text-number\"></div>\r\n      </div>\r\n      <div class=\"resume-box__text\">\r\n        <h3 class=\"resume-box__heading\">Session will time out soon</h3>\r\n        <p>\r\n          No activity detected. Press 'Continue' if you wish to keep your\r\n          session active\r\n        </p>\r\n      </div>\r\n      <src-button\r\n        [isFullWidth]=\"true\"\r\n        [data-testid]=\"'continue-session'\"\r\n        weight=\"primary\"\r\n        size=\"lg\"\r\n      >\r\n        Continue\r\n      </src-button>\r\n    </div>\r\n  </div>\r\n}\r\n", styles: ["#videoPlayOverlay{position:absolute;z-index:30;top:0;width:100%;height:100%;font-size:1.8em;font-family:var(--src-font-family-body);background-color:#646464b3}.clickableState{display:flex;justify-content:center;align-items:center;cursor:pointer}.textDisplayState{display:flex}.hiddenState{display:none}.resume-box{width:340px;padding:32px 20px 20px;flex-direction:column;align-items:center;border-radius:var(--src-border-rounded-parent, 8px);background:var(--src-surface-container-main, #fff);box-shadow:0 26px 80px #0003,0 0 1px #0003}.resume-box .resume-box__pic{width:72px;height:72px;margin:0 auto 22px;border-radius:48px;background:#ecf0f2;padding:12px;display:flex;align-items:center;justify-content:center}.resume-box .resume-box__pic .text-number{color:var(--src-colors-text-default, #1f2937);text-align:center;font-family:var(--src-font-family-body);font-size:30px;font-style:normal;font-weight:400;line-height:24px}.resume-box__text{margin-bottom:18px}.resume-box__text p{text-align:center;font-family:var(--src-font-family-body);font-size:var(--src-font-size-sm, 14px);font-style:normal;font-weight:400;line-height:24px;color:var(--src-text-body-secondary, #6b7280)}.resume-box__text .resume-box__heading{color:var(--src-text-body-main, #1f2937);text-align:center;font-family:var(--src-font-family-body);font-size:18px;font-style:normal;font-weight:500;line-height:26px;margin-bottom:8px}\n"], dependencies: [{ kind: "component", type: SourceButtonComponent, selector: "src-button", inputs: ["type", "appearance", "weight", "size", "context", "customClass", "isFullWidth", "isPressed", "isDisabled", "isLoading", "isInverted", "srcButtonConfig", "formID", "data-testid", "ariaLabel"], outputs: ["onClick", "onSubmit"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: AfkTimeoutModalComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-afk-timeout-modal', changeDetection: ChangeDetectionStrategy.OnPush, imports: [SourceButtonComponent], template: "@if (isShowAfkPopup()) {\n  <div (click)=\"resetAfk()\" class=\"clickableState\" id=\"videoPlayOverlay\">\n    <div class=\"resume-box\">\n      <div aria-hidden=\"true\" class=\"resume-box__pic\" role=\"presentation\">\n        <div [innerHTML]=\"afkCountdown()\" class=\"text-number\"></div>\n      </div>\n      <div class=\"resume-box__text\">\n        <h3 class=\"resume-box__heading\">Session will time out soon</h3>\n        <p>\n          No activity detected. Press 'Continue' if you wish to keep your\n          session active\n        </p>\n      </div>\n      <src-button\n        [isFullWidth]=\"true\"\n        [data-testid]=\"'continue-session'\"\n        weight=\"primary\"\n        size=\"lg\"\n      >\n        Continue\n      </src-button>\n    </div>\n  </div>\n}\n", styles: ["#videoPlayOverlay{position:absolute;z-index:30;top:0;width:100%;height:100%;font-size:1.8em;font-family:var(--src-font-family-body);background-color:#646464b3}.clickableState{display:flex;justify-content:center;align-items:center;cursor:pointer}.textDisplayState{display:flex}.hiddenState{display:none}.resume-box{width:340px;padding:32px 20px 20px;flex-direction:column;align-items:center;border-radius:var(--src-border-rounded-parent, 8px);background:var(--src-surface-container-main, #fff);box-shadow:0 26px 80px #0003,0 0 1px #0003}.resume-box .resume-box__pic{width:72px;height:72px;margin:0 auto 22px;border-radius:48px;background:#ecf0f2;padding:12px;display:flex;align-items:center;justify-content:center}.resume-box .resume-box__pic .text-number{color:var(--src-colors-text-default, #1f2937);text-align:center;font-family:var(--src-font-family-body);font-size:30px;font-style:normal;font-weight:400;line-height:24px}.resume-box__text{margin-bottom:18px}.resume-box__text p{text-align:center;font-family:var(--src-font-family-body);font-size:var(--src-font-size-sm, 14px);font-style:normal;font-weight:400;line-height:24px;color:var(--src-text-body-secondary, #6b7280)}.resume-box__text .resume-box__heading{color:var(--src-text-body-main, #1f2937);text-align:center;font-family:var(--src-font-family-body);font-size:18px;font-style:normal;font-weight:500;line-height:26px;margin-bottom:8px}\n"] }]
+            args: [{ selector: 'app-afk-timeout-modal', changeDetection: ChangeDetectionStrategy.OnPush, imports: [SourceButtonComponent], template: "@if (isShowAfkPopup()) {\r\n  <div (click)=\"resetAfk()\" class=\"clickableState\" id=\"videoPlayOverlay\">\r\n    <div class=\"resume-box\">\r\n      <div aria-hidden=\"true\" class=\"resume-box__pic\" role=\"presentation\">\r\n        <div [innerHTML]=\"afkCountdown()\" class=\"text-number\"></div>\r\n      </div>\r\n      <div class=\"resume-box__text\">\r\n        <h3 class=\"resume-box__heading\">Session will time out soon</h3>\r\n        <p>\r\n          No activity detected. Press 'Continue' if you wish to keep your\r\n          session active\r\n        </p>\r\n      </div>\r\n      <src-button\r\n        [isFullWidth]=\"true\"\r\n        [data-testid]=\"'continue-session'\"\r\n        weight=\"primary\"\r\n        size=\"lg\"\r\n      >\r\n        Continue\r\n      </src-button>\r\n    </div>\r\n  </div>\r\n}\r\n", styles: ["#videoPlayOverlay{position:absolute;z-index:30;top:0;width:100%;height:100%;font-size:1.8em;font-family:var(--src-font-family-body);background-color:#646464b3}.clickableState{display:flex;justify-content:center;align-items:center;cursor:pointer}.textDisplayState{display:flex}.hiddenState{display:none}.resume-box{width:340px;padding:32px 20px 20px;flex-direction:column;align-items:center;border-radius:var(--src-border-rounded-parent, 8px);background:var(--src-surface-container-main, #fff);box-shadow:0 26px 80px #0003,0 0 1px #0003}.resume-box .resume-box__pic{width:72px;height:72px;margin:0 auto 22px;border-radius:48px;background:#ecf0f2;padding:12px;display:flex;align-items:center;justify-content:center}.resume-box .resume-box__pic .text-number{color:var(--src-colors-text-default, #1f2937);text-align:center;font-family:var(--src-font-family-body);font-size:30px;font-style:normal;font-weight:400;line-height:24px}.resume-box__text{margin-bottom:18px}.resume-box__text p{text-align:center;font-family:var(--src-font-family-body);font-size:var(--src-font-size-sm, 14px);font-style:normal;font-weight:400;line-height:24px;color:var(--src-text-body-secondary, #6b7280)}.resume-box__text .resume-box__heading{color:var(--src-text-body-main, #1f2937);text-align:center;font-family:var(--src-font-family-body);font-size:18px;font-style:normal;font-weight:500;line-height:26px;margin-bottom:8px}\n"] }]
         }] });
 
 class FreezeFrameComponent {
@@ -6725,11 +7151,11 @@ class FreezeFrameComponent {
     }
     #store;
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: FreezeFrameComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.4", type: FreezeFrameComponent, isStandalone: true, selector: "app-freeze-frame", ngImport: i0, template: "@let image = combinedFreeze();\n@let progress = freezeFrameProgressMessageFromVideo();\n\n<div class=\"freeze-images\">\n  @if (image) {\n    <img [src]=\"image\" class=\"videoStillImage\" alt=\"freezeFrameImage\" />\n  }\n\n  @if (progress) {\n    <div class=\"progress-status\">\n      {{ progress }}\n    </div>\n  }\n</div>\n", styles: [".freeze-images{pointer-events:none;position:absolute;left:0;top:0;width:100%;height:100%;z-index:1}.freeze-images .freezeFrameOverlay{top:0;left:0;width:100%;height:100%;position:absolute;object-fit:cover;object-position:center}.freeze-images .videoStillImage{position:absolute;z-index:1;top:0;left:0;width:100%;height:100%;object-fit:cover}.freeze-images .progress-status{position:absolute;top:50%;left:50%;z-index:1;display:flex;flex-direction:column;justify-content:center;align-items:center;width:auto;height:auto;margin:0;padding:10px;background-color:#ffffffb3;border:1px solid grey;transform:translate(-50%,-50%)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.4", type: FreezeFrameComponent, isStandalone: true, selector: "app-freeze-frame", ngImport: i0, template: "@let image = combinedFreeze();\r\n@let progress = freezeFrameProgressMessageFromVideo();\r\n\r\n<div class=\"freeze-images\">\r\n  @if (image) {\r\n    <img [src]=\"image\" class=\"videoStillImage\" alt=\"freezeFrameImage\" />\r\n  }\r\n\r\n  @if (progress) {\r\n    <div class=\"progress-status\">\r\n      {{ progress }}\r\n    </div>\r\n  }\r\n</div>\r\n", styles: [".freeze-images{pointer-events:none;position:absolute;left:0;top:0;width:100%;height:100%;z-index:1}.freeze-images .freezeFrameOverlay{top:0;left:0;width:100%;height:100%;position:absolute;object-fit:cover;object-position:center}.freeze-images .videoStillImage{position:absolute;z-index:1;top:0;left:0;width:100%;height:100%;object-fit:cover}.freeze-images .progress-status{position:absolute;top:50%;left:50%;z-index:1;display:flex;flex-direction:column;justify-content:center;align-items:center;width:auto;height:auto;margin:0;padding:10px;background-color:#ffffffb3;border:1px solid grey;transform:translate(-50%,-50%)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: FreezeFrameComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-freeze-frame', changeDetection: ChangeDetectionStrategy.OnPush, template: "@let image = combinedFreeze();\n@let progress = freezeFrameProgressMessageFromVideo();\n\n<div class=\"freeze-images\">\n  @if (image) {\n    <img [src]=\"image\" class=\"videoStillImage\" alt=\"freezeFrameImage\" />\n  }\n\n  @if (progress) {\n    <div class=\"progress-status\">\n      {{ progress }}\n    </div>\n  }\n</div>\n", styles: [".freeze-images{pointer-events:none;position:absolute;left:0;top:0;width:100%;height:100%;z-index:1}.freeze-images .freezeFrameOverlay{top:0;left:0;width:100%;height:100%;position:absolute;object-fit:cover;object-position:center}.freeze-images .videoStillImage{position:absolute;z-index:1;top:0;left:0;width:100%;height:100%;object-fit:cover}.freeze-images .progress-status{position:absolute;top:50%;left:50%;z-index:1;display:flex;flex-direction:column;justify-content:center;align-items:center;width:auto;height:auto;margin:0;padding:10px;background-color:#ffffffb3;border:1px solid grey;transform:translate(-50%,-50%)}\n"] }]
+            args: [{ selector: 'app-freeze-frame', changeDetection: ChangeDetectionStrategy.OnPush, template: "@let image = combinedFreeze();\r\n@let progress = freezeFrameProgressMessageFromVideo();\r\n\r\n<div class=\"freeze-images\">\r\n  @if (image) {\r\n    <img [src]=\"image\" class=\"videoStillImage\" alt=\"freezeFrameImage\" />\r\n  }\r\n\r\n  @if (progress) {\r\n    <div class=\"progress-status\">\r\n      {{ progress }}\r\n    </div>\r\n  }\r\n</div>\r\n", styles: [".freeze-images{pointer-events:none;position:absolute;left:0;top:0;width:100%;height:100%;z-index:1}.freeze-images .freezeFrameOverlay{top:0;left:0;width:100%;height:100%;position:absolute;object-fit:cover;object-position:center}.freeze-images .videoStillImage{position:absolute;z-index:1;top:0;left:0;width:100%;height:100%;object-fit:cover}.freeze-images .progress-status{position:absolute;top:50%;left:50%;z-index:1;display:flex;flex-direction:column;justify-content:center;align-items:center;width:auto;height:auto;margin:0;padding:10px;background-color:#ffffffb3;border:1px solid grey;transform:translate(-50%,-50%)}\n"] }]
         }] });
 
 class SafePipe {
@@ -6771,11 +7197,11 @@ class LowBandwidthModalComponent {
         this.#dialogRef.close(value || false);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: LowBandwidthModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.4", type: LowBandwidthModalComponent, isStandalone: true, selector: "app-low-bandwidth-modal", ngImport: i0, template: "<div [attr.data-testid]=\"'low-bandwidth'\" class=\"src-modal src-modal--lbm\">\n  <header class=\"src-modal__header\">\n    <h6 [attr.data-testid]=\"'title'\" class=\"src-modal__title\">\n      Unstable Connection\n    </h6>\n  </header>\n  <section class=\"src-modal__body\">\n    <div\n      [innerHtml]=\"\n        'Fluid Interactivity Modes were disabled due to an unstable connection. Showcase Gallery Mode is enabled. To regain full functionality, switch to Interactive Mode.'\n          | safe: 'html'\n      \"\n      class=\"src-modal__scroll-box\"\n    ></div>\n  </section>\n  <footer class=\"src-modal__footer\">\n    <div class=\"src-modal__buttons\">\n      <src-button\n        (onClick)=\"close(true)\"\n        [data-testid]=\"'switch-to-interactive-mode'\"\n      >\n        Switch\n      </src-button>\n\n      <src-button\n        (onClick)=\"close()\"\n        [data-testid]=\"'close-lbm-modal'\"\n        weight=\"primary\"\n      >\n        Ok\n      </src-button>\n    </div>\n  </footer>\n</div>\n", styles: [".src-modal--lbm{width:360px}.src-modal--lbm .src-modal__body{font-size:14px;line-height:24px}.src-modal--lbm .src-modal__buttons{display:flex;gap:8px}\n"], dependencies: [{ kind: "component", type: SourceButtonComponent, selector: "src-button", inputs: ["type", "appearance", "weight", "size", "context", "customClass", "isFullWidth", "isPressed", "isDisabled", "isLoading", "isInverted", "srcButtonConfig", "formID", "data-testid", "ariaLabel"], outputs: ["onClick", "onSubmit"] }, { kind: "pipe", type: SafePipe, name: "safe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.4", type: LowBandwidthModalComponent, isStandalone: true, selector: "app-low-bandwidth-modal", ngImport: i0, template: "<div [attr.data-testid]=\"'low-bandwidth'\" class=\"src-modal src-modal--lbm\">\r\n  <header class=\"src-modal__header\">\r\n    <h6 [attr.data-testid]=\"'title'\" class=\"src-modal__title\">\r\n      Unstable Connection\r\n    </h6>\r\n  </header>\r\n  <section class=\"src-modal__body\">\r\n    <div\r\n      [innerHtml]=\"\r\n        'Fluid Interactivity Modes were disabled due to an unstable connection. Showcase Gallery Mode is enabled. To regain full functionality, switch to Interactive Mode.'\r\n          | safe: 'html'\r\n      \"\r\n      class=\"src-modal__scroll-box\"\r\n    ></div>\r\n  </section>\r\n  <footer class=\"src-modal__footer\">\r\n    <div class=\"src-modal__buttons\">\r\n      <src-button\r\n        (onClick)=\"close(true)\"\r\n        [data-testid]=\"'switch-to-interactive-mode'\"\r\n      >\r\n        Switch\r\n      </src-button>\r\n\r\n      <src-button\r\n        (onClick)=\"close()\"\r\n        [data-testid]=\"'close-lbm-modal'\"\r\n        weight=\"primary\"\r\n      >\r\n        Ok\r\n      </src-button>\r\n    </div>\r\n  </footer>\r\n</div>\r\n", styles: [".src-modal--lbm{width:360px}.src-modal--lbm .src-modal__body{font-size:14px;line-height:24px}.src-modal--lbm .src-modal__buttons{display:flex;gap:8px}\n"], dependencies: [{ kind: "component", type: SourceButtonComponent, selector: "src-button", inputs: ["type", "appearance", "weight", "size", "context", "customClass", "isFullWidth", "isPressed", "isDisabled", "isLoading", "isInverted", "srcButtonConfig", "formID", "data-testid", "ariaLabel"], outputs: ["onClick", "onSubmit"] }, { kind: "pipe", type: SafePipe, name: "safe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: LowBandwidthModalComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-low-bandwidth-modal', changeDetection: ChangeDetectionStrategy.OnPush, imports: [SafePipe, SourceButtonComponent], template: "<div [attr.data-testid]=\"'low-bandwidth'\" class=\"src-modal src-modal--lbm\">\n  <header class=\"src-modal__header\">\n    <h6 [attr.data-testid]=\"'title'\" class=\"src-modal__title\">\n      Unstable Connection\n    </h6>\n  </header>\n  <section class=\"src-modal__body\">\n    <div\n      [innerHtml]=\"\n        'Fluid Interactivity Modes were disabled due to an unstable connection. Showcase Gallery Mode is enabled. To regain full functionality, switch to Interactive Mode.'\n          | safe: 'html'\n      \"\n      class=\"src-modal__scroll-box\"\n    ></div>\n  </section>\n  <footer class=\"src-modal__footer\">\n    <div class=\"src-modal__buttons\">\n      <src-button\n        (onClick)=\"close(true)\"\n        [data-testid]=\"'switch-to-interactive-mode'\"\n      >\n        Switch\n      </src-button>\n\n      <src-button\n        (onClick)=\"close()\"\n        [data-testid]=\"'close-lbm-modal'\"\n        weight=\"primary\"\n      >\n        Ok\n      </src-button>\n    </div>\n  </footer>\n</div>\n", styles: [".src-modal--lbm{width:360px}.src-modal--lbm .src-modal__body{font-size:14px;line-height:24px}.src-modal--lbm .src-modal__buttons{display:flex;gap:8px}\n"] }]
+            args: [{ selector: 'app-low-bandwidth-modal', changeDetection: ChangeDetectionStrategy.OnPush, imports: [SafePipe, SourceButtonComponent], template: "<div [attr.data-testid]=\"'low-bandwidth'\" class=\"src-modal src-modal--lbm\">\r\n  <header class=\"src-modal__header\">\r\n    <h6 [attr.data-testid]=\"'title'\" class=\"src-modal__title\">\r\n      Unstable Connection\r\n    </h6>\r\n  </header>\r\n  <section class=\"src-modal__body\">\r\n    <div\r\n      [innerHtml]=\"\r\n        'Fluid Interactivity Modes were disabled due to an unstable connection. Showcase Gallery Mode is enabled. To regain full functionality, switch to Interactive Mode.'\r\n          | safe: 'html'\r\n      \"\r\n      class=\"src-modal__scroll-box\"\r\n    ></div>\r\n  </section>\r\n  <footer class=\"src-modal__footer\">\r\n    <div class=\"src-modal__buttons\">\r\n      <src-button\r\n        (onClick)=\"close(true)\"\r\n        [data-testid]=\"'switch-to-interactive-mode'\"\r\n      >\r\n        Switch\r\n      </src-button>\r\n\r\n      <src-button\r\n        (onClick)=\"close()\"\r\n        [data-testid]=\"'close-lbm-modal'\"\r\n        weight=\"primary\"\r\n      >\r\n        Ok\r\n      </src-button>\r\n    </div>\r\n  </footer>\r\n</div>\r\n", styles: [".src-modal--lbm{width:360px}.src-modal--lbm .src-modal__body{font-size:14px;line-height:24px}.src-modal--lbm .src-modal__buttons{display:flex;gap:8px}\n"] }]
         }] });
 
 class ImageLoadingSrcComponent {
@@ -6789,11 +7215,11 @@ class ImageLoadingSrcComponent {
         this.#store.dispatch(setLoadingImageSrc({ src: '' }));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: ImageLoadingSrcComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.4", type: ImageLoadingSrcComponent, isStandalone: true, selector: "app-image-loading-src", ngImport: i0, template: "@let image = imageLoadingSrc();\n@if (isLoaderScreenVisible()) {\n  <div class=\"preload\">\n    <div class=\"back\">\n      @if (image) {\n        <img\n          (error)=\"loadingImageError()\"\n          [ngSrc]=\"image\"\n          fill\n          loading=\"lazy\"\n          alt=\"image loading src\"\n        />\n      }\n    </div>\n  </div>\n}\n", styles: [".preload{position:absolute;top:0;left:0;width:100%;height:100%;text-align:center}.preload .back{position:absolute;top:0;left:0;display:flex;justify-content:center;align-items:center;width:100%;height:100%}.preload .back img{width:100%;height:100%;object-fit:cover}.preload .back{background-color:#fff}\n"], dependencies: [{ kind: "directive", type: NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "decoding", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.4", type: ImageLoadingSrcComponent, isStandalone: true, selector: "app-image-loading-src", ngImport: i0, template: "@let image = imageLoadingSrc();\r\n@if (isLoaderScreenVisible()) {\r\n  <div class=\"preload\">\r\n    <div class=\"back\">\r\n      @if (image) {\r\n        <img\r\n          (error)=\"loadingImageError()\"\r\n          [ngSrc]=\"image\"\r\n          fill\r\n          loading=\"lazy\"\r\n          alt=\"image loading src\"\r\n        />\r\n      }\r\n    </div>\r\n  </div>\r\n}\r\n", styles: [".preload{position:absolute;top:0;left:0;width:100%;height:100%;text-align:center}.preload .back{position:absolute;top:0;left:0;display:flex;justify-content:center;align-items:center;width:100%;height:100%}.preload .back img{width:100%;height:100%;object-fit:cover}.preload .back{background-color:#fff}\n"], dependencies: [{ kind: "directive", type: NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "decoding", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: ImageLoadingSrcComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-image-loading-src', changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgOptimizedImage], template: "@let image = imageLoadingSrc();\n@if (isLoaderScreenVisible()) {\n  <div class=\"preload\">\n    <div class=\"back\">\n      @if (image) {\n        <img\n          (error)=\"loadingImageError()\"\n          [ngSrc]=\"image\"\n          fill\n          loading=\"lazy\"\n          alt=\"image loading src\"\n        />\n      }\n    </div>\n  </div>\n}\n", styles: [".preload{position:absolute;top:0;left:0;width:100%;height:100%;text-align:center}.preload .back{position:absolute;top:0;left:0;display:flex;justify-content:center;align-items:center;width:100%;height:100%}.preload .back img{width:100%;height:100%;object-fit:cover}.preload .back{background-color:#fff}\n"] }]
+            args: [{ selector: 'app-image-loading-src', changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgOptimizedImage], template: "@let image = imageLoadingSrc();\r\n@if (isLoaderScreenVisible()) {\r\n  <div class=\"preload\">\r\n    <div class=\"back\">\r\n      @if (image) {\r\n        <img\r\n          (error)=\"loadingImageError()\"\r\n          [ngSrc]=\"image\"\r\n          fill\r\n          loading=\"lazy\"\r\n          alt=\"image loading src\"\r\n        />\r\n      }\r\n    </div>\r\n  </div>\r\n}\r\n", styles: [".preload{position:absolute;top:0;left:0;width:100%;height:100%;text-align:center}.preload .back{position:absolute;top:0;left:0;display:flex;justify-content:center;align-items:center;width:100%;height:100%}.preload .back img{width:100%;height:100%;object-fit:cover}.preload .back{background-color:#fff}\n"] }]
         }] });
 
 class StatGraphComponent {
@@ -6875,11 +7301,11 @@ class StatGraphComponent {
         this.draw();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: StatGraphComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.4", type: StatGraphComponent, isStandalone: true, selector: "app-stat-graph", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, stat: { classPropertyName: "stat", publicName: "stat", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, tickStep: { classPropertyName: "tickStep", publicName: "tickStep", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "window:resize": "resize()" } }, viewQueries: [{ propertyName: "graph", first: true, predicate: ["graph"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"content\">\n  <p>{{ label() }}: {{ current() }} | Min:{{ min() }} | Max:{{ max() }}</p>\n  <canvas #graph class=\"graph\"></canvas>\n</div>\n", styles: [".content{width:100%;height:100%}.content p{color:#fff;margin:5px 0 0;height:25px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.4", type: StatGraphComponent, isStandalone: true, selector: "app-stat-graph", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, stat: { classPropertyName: "stat", publicName: "stat", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, tickStep: { classPropertyName: "tickStep", publicName: "tickStep", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "window:resize": "resize()" } }, viewQueries: [{ propertyName: "graph", first: true, predicate: ["graph"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"content\">\r\n  <p>{{ label() }}: {{ current() }} | Min:{{ min() }} | Max:{{ max() }}</p>\r\n  <canvas #graph class=\"graph\"></canvas>\r\n</div>\r\n", styles: [".content{width:100%;height:100%}.content p{color:#fff;margin:5px 0 0;height:25px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: StatGraphComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-stat-graph', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"content\">\n  <p>{{ label() }}: {{ current() }} | Min:{{ min() }} | Max:{{ max() }}</p>\n  <canvas #graph class=\"graph\"></canvas>\n</div>\n", styles: [".content{width:100%;height:100%}.content p{color:#fff;margin:5px 0 0;height:25px}\n"] }]
+            args: [{ selector: 'app-stat-graph', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"content\">\r\n  <p>{{ label() }}: {{ current() }} | Min:{{ min() }} | Max:{{ max() }}</p>\r\n  <canvas #graph class=\"graph\"></canvas>\r\n</div>\r\n", styles: [".content{width:100%;height:100%}.content p{color:#fff;margin:5px 0 0;height:25px}\n"] }]
         }], ctorParameters: () => [], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: true }] }], stat: [{ type: i0.Input, args: [{ isSignal: true, alias: "stat", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], tickStep: [{ type: i0.Input, args: [{ isSignal: true, alias: "tickStep", required: false }] }], graph: [{ type: i0.ViewChild, args: ['graph', { isSignal: true }] }], resize: [{
                 type: HostListener,
                 args: ['window:resize']
@@ -6899,11 +7325,11 @@ class UnrealStatusComponent {
     #store;
     #loadingProgress;
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: UnrealStatusComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.4", type: UnrealStatusComponent, isStandalone: true, selector: "app-unreal-status", ngImport: i0, template: "@if (isShowLoadingPercentsPopup()) {\n  @let _awsInstance = awsInstance();\n  <div class=\"status-box\">\n    @if (_awsInstance?.message) {\n      <p>{{ _awsInstance?.message }}</p>\n    } @else {\n      <div class=\"status-box__message\">\n        <src-loading\n          [size]=\"30\"\n          [backgroundStrokeColor]=\"'#E5E7EB'\"\n          [progressStrokeColor]=\"'#1F2937'\"\n        />\n        {{ smoothPercents() }}%\n      </div>\n    }\n  </div>\n}\n", styles: ["app-stat-graph{height:30px;width:100%}.status-box{position:absolute;top:80%;left:50%;transform:translate(-50%,-50%);z-index:5;display:flex;justify-content:center;align-items:center;width:auto;max-width:500px;margin:0;background:var(--src-surface-container-main, #fff);border:none;border-radius:var(--src-border-rounded-full, 9999px);box-shadow:0 8px 20px #1718181f,0 3px 6px #17181814;pointer-events:none}.status-box p{padding:10px 15px;margin:0;text-align:center}.status-box__message{display:flex;align-items:center;padding:12px 20px 12px 16px;color:var(--src-text-body-main, #1f2937);font-size:16px;font-weight:400;line-height:24px}.status-box__message .status-box__message_text{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.status-box__message src-loading{margin-right:12px}\n"], dependencies: [{ kind: "component", type: SourceLoadingComponent, selector: "src-loading", inputs: ["size", "progress", "lineCap", "backgroundStrokeColor", "progressStrokeColor", "strokeWidth", "data-testid", "role", "ariaLabel", "ariaValueNow", "ariaValueMin", "ariaValueMax"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.4", type: UnrealStatusComponent, isStandalone: true, selector: "app-unreal-status", ngImport: i0, template: "@if (isShowLoadingPercentsPopup()) {\r\n  @let _awsInstance = awsInstance();\r\n  <div class=\"status-box\">\r\n    @if (_awsInstance?.message) {\r\n      <p>{{ _awsInstance?.message }}</p>\r\n    } @else {\r\n      <div class=\"status-box__message\">\r\n        <src-loading\r\n          [size]=\"30\"\r\n          [backgroundStrokeColor]=\"'#E5E7EB'\"\r\n          [progressStrokeColor]=\"'#1F2937'\"\r\n        />\r\n        {{ smoothPercents() }}%\r\n      </div>\r\n    }\r\n  </div>\r\n}\r\n", styles: ["app-stat-graph{height:30px;width:100%}.status-box{position:absolute;top:80%;left:50%;transform:translate(-50%,-50%);z-index:5;display:flex;justify-content:center;align-items:center;width:auto;max-width:500px;margin:0;background:var(--src-surface-container-main, #fff);border:none;border-radius:var(--src-border-rounded-full, 9999px);box-shadow:0 8px 20px #1718181f,0 3px 6px #17181814;pointer-events:none}.status-box p{padding:10px 15px;margin:0;text-align:center}.status-box__message{display:flex;align-items:center;padding:12px 20px 12px 16px;color:var(--src-text-body-main, #1f2937);font-size:16px;font-weight:400;line-height:24px}.status-box__message .status-box__message_text{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.status-box__message src-loading{margin-right:12px}\n"], dependencies: [{ kind: "component", type: SourceLoadingComponent, selector: "src-loading", inputs: ["size", "progress", "lineCap", "backgroundStrokeColor", "progressStrokeColor", "strokeWidth", "data-testid", "role", "ariaLabel", "ariaValueNow", "ariaValueMin", "ariaValueMax"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: UnrealStatusComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-unreal-status', changeDetection: ChangeDetectionStrategy.OnPush, imports: [SourceLoadingComponent], template: "@if (isShowLoadingPercentsPopup()) {\n  @let _awsInstance = awsInstance();\n  <div class=\"status-box\">\n    @if (_awsInstance?.message) {\n      <p>{{ _awsInstance?.message }}</p>\n    } @else {\n      <div class=\"status-box__message\">\n        <src-loading\n          [size]=\"30\"\n          [backgroundStrokeColor]=\"'#E5E7EB'\"\n          [progressStrokeColor]=\"'#1F2937'\"\n        />\n        {{ smoothPercents() }}%\n      </div>\n    }\n  </div>\n}\n", styles: ["app-stat-graph{height:30px;width:100%}.status-box{position:absolute;top:80%;left:50%;transform:translate(-50%,-50%);z-index:5;display:flex;justify-content:center;align-items:center;width:auto;max-width:500px;margin:0;background:var(--src-surface-container-main, #fff);border:none;border-radius:var(--src-border-rounded-full, 9999px);box-shadow:0 8px 20px #1718181f,0 3px 6px #17181814;pointer-events:none}.status-box p{padding:10px 15px;margin:0;text-align:center}.status-box__message{display:flex;align-items:center;padding:12px 20px 12px 16px;color:var(--src-text-body-main, #1f2937);font-size:16px;font-weight:400;line-height:24px}.status-box__message .status-box__message_text{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.status-box__message src-loading{margin-right:12px}\n"] }]
+            args: [{ selector: 'app-unreal-status', changeDetection: ChangeDetectionStrategy.OnPush, imports: [SourceLoadingComponent], template: "@if (isShowLoadingPercentsPopup()) {\r\n  @let _awsInstance = awsInstance();\r\n  <div class=\"status-box\">\r\n    @if (_awsInstance?.message) {\r\n      <p>{{ _awsInstance?.message }}</p>\r\n    } @else {\r\n      <div class=\"status-box__message\">\r\n        <src-loading\r\n          [size]=\"30\"\r\n          [backgroundStrokeColor]=\"'#E5E7EB'\"\r\n          [progressStrokeColor]=\"'#1F2937'\"\r\n        />\r\n        {{ smoothPercents() }}%\r\n      </div>\r\n    }\r\n  </div>\r\n}\r\n", styles: ["app-stat-graph{height:30px;width:100%}.status-box{position:absolute;top:80%;left:50%;transform:translate(-50%,-50%);z-index:5;display:flex;justify-content:center;align-items:center;width:auto;max-width:500px;margin:0;background:var(--src-surface-container-main, #fff);border:none;border-radius:var(--src-border-rounded-full, 9999px);box-shadow:0 8px 20px #1718181f,0 3px 6px #17181814;pointer-events:none}.status-box p{padding:10px 15px;margin:0;text-align:center}.status-box__message{display:flex;align-items:center;padding:12px 20px 12px 16px;color:var(--src-text-body-main, #1f2937);font-size:16px;font-weight:400;line-height:24px}.status-box__message .status-box__message_text{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.status-box__message src-loading{margin-right:12px}\n"] }]
         }] });
 
 class VideoStatsComponent {
@@ -7015,11 +7441,11 @@ class VideoStatsComponent {
         }));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: VideoStatsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.4", type: VideoStatsComponent, isStandalone: true, selector: "app-video-stats", ngImport: i0, template: "@if (videoStatus() && viewportReady()) {\n  <div class=\"settings-container\">\n    <button (click)=\"toggle()\" class=\"gear-button\">Stats</button>\n    <div (click)=\"toggle()\" [class.min]=\"collapsed()\" id=\"aggregatedStats\">\n      <div class=\"forNerds\">\n        <div (click)=\"$event.stopPropagation()\" class=\"static\">\n          <li>\n            <app-stat-graph\n              [stat]=\"fpsTick()!\"\n              label=\"FPS (higher is better)\"\n            />\n          </li>\n          <li>\n            <app-stat-graph\n              [stat]=\"videoQP()!\"\n              label=\"QP (lower is better)\"\n              color=\"#D5ff07\"\n            />\n          </li>\n          <li>\n            <app-stat-graph\n              [stat]=\"bitrateTick()!\"\n              label=\"Bitrate\"\n              color=\"#D57F07\"\n            />\n          </li>\n        </div>\n        <div>\n          @for (graph of graphList(); track graph.key) {\n            <li (click)=\"toggleGraph($event, graph.key, 0)\" class=\"graph\">\n              <app-stat-graph\n                [label]=\"graph.key\"\n                [stat]=\"graph.stat()\"\n                [color]=\"graph.color\"\n              />\n            </li>\n          }\n        </div>\n      </div>\n\n      @for (el of videoStatus(); track el.key + $index) {\n        <div (click)=\"toggleGraph($event, el.key, el.value)\" class=\"stat\">\n          <span>{{ el.key }}: </span>{{ el.value | json }}\n        </div>\n      }\n    </div>\n  </div>\n  @if (!collapsed()) {\n    <div [innerHTML]=\"ssData() | safe: 'html'\" class=\"ssInfo\"></div>\n  }\n}\n", styles: [".settings-container{position:absolute;top:65px;left:10px;z-index:1000;bottom:10px}.gear-button{left:0;width:50px;position:absolute;background:none;cursor:pointer;font-size:10px;font-weight:500;border:1px solid;border-radius:9px;background:#0162cc;color:#fff;padding:4px}.gear-button>*{color:#fff;filter:drop-shadow(1px 1px 1px rgb(0,0,0))}#aggregatedStats{max-height:calc(100% - 25px);overflow-y:auto;margin-top:25px;left:20px;z-index:31;max-width:400px;padding:10px;background-color:#fff3;border:1px solid grey}#aggregatedStats>*{color:#fff;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000}#aggregatedStats:empty{display:none}#aggregatedStats button{position:absolute;right:5px;top:5px}#aggregatedStats.min{display:none}#aggregatedStats .forNerds{width:100%}#aggregatedStats .forNerds li{list-style-type:none;height:60px}#aggregatedStats .forNerds li app-stat-graph{display:block;width:100%;height:100%}#aggregatedStats .stat span{font-weight:700}#aggregatedStats .stat,#aggregatedStats .graph{cursor:pointer}#aggregatedStats .static{pointer-events:all}.ssInfo{position:absolute;top:0;left:50%;transform:translate(-50%);color:#fff;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000;text-align:center;width:80%;pointer-events:none}\n"], dependencies: [{ kind: "component", type: StatGraphComponent, selector: "app-stat-graph", inputs: ["label", "stat", "color", "tickStep"] }, { kind: "pipe", type: JsonPipe, name: "json" }, { kind: "pipe", type: SafePipe, name: "safe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.4", type: VideoStatsComponent, isStandalone: true, selector: "app-video-stats", ngImport: i0, template: "@if (videoStatus() && viewportReady()) {\r\n  <div class=\"settings-container\">\r\n    <button (click)=\"toggle()\" class=\"gear-button\">Stats</button>\r\n    <div (click)=\"toggle()\" [class.min]=\"collapsed()\" id=\"aggregatedStats\">\r\n      <div class=\"forNerds\">\r\n        <div (click)=\"$event.stopPropagation()\" class=\"static\">\r\n          <li>\r\n            <app-stat-graph\r\n              [stat]=\"fpsTick()!\"\r\n              label=\"FPS (higher is better)\"\r\n            />\r\n          </li>\r\n          <li>\r\n            <app-stat-graph\r\n              [stat]=\"videoQP()!\"\r\n              label=\"QP (lower is better)\"\r\n              color=\"#D5ff07\"\r\n            />\r\n          </li>\r\n          <li>\r\n            <app-stat-graph\r\n              [stat]=\"bitrateTick()!\"\r\n              label=\"Bitrate\"\r\n              color=\"#D57F07\"\r\n            />\r\n          </li>\r\n        </div>\r\n        <div>\r\n          @for (graph of graphList(); track graph.key) {\r\n            <li (click)=\"toggleGraph($event, graph.key, 0)\" class=\"graph\">\r\n              <app-stat-graph\r\n                [label]=\"graph.key\"\r\n                [stat]=\"graph.stat()\"\r\n                [color]=\"graph.color\"\r\n              />\r\n            </li>\r\n          }\r\n        </div>\r\n      </div>\r\n\r\n      @for (el of videoStatus(); track el.key + $index) {\r\n        <div (click)=\"toggleGraph($event, el.key, el.value)\" class=\"stat\">\r\n          <span>{{ el.key }}: </span>{{ el.value | json }}\r\n        </div>\r\n      }\r\n    </div>\r\n  </div>\r\n  @if (!collapsed()) {\r\n    <div [innerHTML]=\"ssData() | safe: 'html'\" class=\"ssInfo\"></div>\r\n  }\r\n}\r\n", styles: [".settings-container{position:absolute;top:65px;left:10px;z-index:1000;bottom:10px}.gear-button{left:0;width:50px;position:absolute;background:none;cursor:pointer;font-size:10px;font-weight:500;border:1px solid;border-radius:9px;background:#0162cc;color:#fff;padding:4px}.gear-button>*{color:#fff;filter:drop-shadow(1px 1px 1px rgb(0,0,0))}#aggregatedStats{max-height:calc(100% - 25px);overflow-y:auto;margin-top:25px;left:20px;z-index:31;max-width:400px;padding:10px;background-color:#fff3;border:1px solid grey}#aggregatedStats>*{color:#fff;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000}#aggregatedStats:empty{display:none}#aggregatedStats button{position:absolute;right:5px;top:5px}#aggregatedStats.min{display:none}#aggregatedStats .forNerds{width:100%}#aggregatedStats .forNerds li{list-style-type:none;height:60px}#aggregatedStats .forNerds li app-stat-graph{display:block;width:100%;height:100%}#aggregatedStats .stat span{font-weight:700}#aggregatedStats .stat,#aggregatedStats .graph{cursor:pointer}#aggregatedStats .static{pointer-events:all}.ssInfo{position:absolute;top:0;left:50%;transform:translate(-50%);color:#fff;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000;text-align:center;width:80%;pointer-events:none}\n"], dependencies: [{ kind: "component", type: StatGraphComponent, selector: "app-stat-graph", inputs: ["label", "stat", "color", "tickStep"] }, { kind: "pipe", type: JsonPipe, name: "json" }, { kind: "pipe", type: SafePipe, name: "safe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: VideoStatsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-video-stats', changeDetection: ChangeDetectionStrategy.OnPush, imports: [StatGraphComponent, JsonPipe, SafePipe], template: "@if (videoStatus() && viewportReady()) {\n  <div class=\"settings-container\">\n    <button (click)=\"toggle()\" class=\"gear-button\">Stats</button>\n    <div (click)=\"toggle()\" [class.min]=\"collapsed()\" id=\"aggregatedStats\">\n      <div class=\"forNerds\">\n        <div (click)=\"$event.stopPropagation()\" class=\"static\">\n          <li>\n            <app-stat-graph\n              [stat]=\"fpsTick()!\"\n              label=\"FPS (higher is better)\"\n            />\n          </li>\n          <li>\n            <app-stat-graph\n              [stat]=\"videoQP()!\"\n              label=\"QP (lower is better)\"\n              color=\"#D5ff07\"\n            />\n          </li>\n          <li>\n            <app-stat-graph\n              [stat]=\"bitrateTick()!\"\n              label=\"Bitrate\"\n              color=\"#D57F07\"\n            />\n          </li>\n        </div>\n        <div>\n          @for (graph of graphList(); track graph.key) {\n            <li (click)=\"toggleGraph($event, graph.key, 0)\" class=\"graph\">\n              <app-stat-graph\n                [label]=\"graph.key\"\n                [stat]=\"graph.stat()\"\n                [color]=\"graph.color\"\n              />\n            </li>\n          }\n        </div>\n      </div>\n\n      @for (el of videoStatus(); track el.key + $index) {\n        <div (click)=\"toggleGraph($event, el.key, el.value)\" class=\"stat\">\n          <span>{{ el.key }}: </span>{{ el.value | json }}\n        </div>\n      }\n    </div>\n  </div>\n  @if (!collapsed()) {\n    <div [innerHTML]=\"ssData() | safe: 'html'\" class=\"ssInfo\"></div>\n  }\n}\n", styles: [".settings-container{position:absolute;top:65px;left:10px;z-index:1000;bottom:10px}.gear-button{left:0;width:50px;position:absolute;background:none;cursor:pointer;font-size:10px;font-weight:500;border:1px solid;border-radius:9px;background:#0162cc;color:#fff;padding:4px}.gear-button>*{color:#fff;filter:drop-shadow(1px 1px 1px rgb(0,0,0))}#aggregatedStats{max-height:calc(100% - 25px);overflow-y:auto;margin-top:25px;left:20px;z-index:31;max-width:400px;padding:10px;background-color:#fff3;border:1px solid grey}#aggregatedStats>*{color:#fff;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000}#aggregatedStats:empty{display:none}#aggregatedStats button{position:absolute;right:5px;top:5px}#aggregatedStats.min{display:none}#aggregatedStats .forNerds{width:100%}#aggregatedStats .forNerds li{list-style-type:none;height:60px}#aggregatedStats .forNerds li app-stat-graph{display:block;width:100%;height:100%}#aggregatedStats .stat span{font-weight:700}#aggregatedStats .stat,#aggregatedStats .graph{cursor:pointer}#aggregatedStats .static{pointer-events:all}.ssInfo{position:absolute;top:0;left:50%;transform:translate(-50%);color:#fff;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000;text-align:center;width:80%;pointer-events:none}\n"] }]
+            args: [{ selector: 'app-video-stats', changeDetection: ChangeDetectionStrategy.OnPush, imports: [StatGraphComponent, JsonPipe, SafePipe], template: "@if (videoStatus() && viewportReady()) {\r\n  <div class=\"settings-container\">\r\n    <button (click)=\"toggle()\" class=\"gear-button\">Stats</button>\r\n    <div (click)=\"toggle()\" [class.min]=\"collapsed()\" id=\"aggregatedStats\">\r\n      <div class=\"forNerds\">\r\n        <div (click)=\"$event.stopPropagation()\" class=\"static\">\r\n          <li>\r\n            <app-stat-graph\r\n              [stat]=\"fpsTick()!\"\r\n              label=\"FPS (higher is better)\"\r\n            />\r\n          </li>\r\n          <li>\r\n            <app-stat-graph\r\n              [stat]=\"videoQP()!\"\r\n              label=\"QP (lower is better)\"\r\n              color=\"#D5ff07\"\r\n            />\r\n          </li>\r\n          <li>\r\n            <app-stat-graph\r\n              [stat]=\"bitrateTick()!\"\r\n              label=\"Bitrate\"\r\n              color=\"#D57F07\"\r\n            />\r\n          </li>\r\n        </div>\r\n        <div>\r\n          @for (graph of graphList(); track graph.key) {\r\n            <li (click)=\"toggleGraph($event, graph.key, 0)\" class=\"graph\">\r\n              <app-stat-graph\r\n                [label]=\"graph.key\"\r\n                [stat]=\"graph.stat()\"\r\n                [color]=\"graph.color\"\r\n              />\r\n            </li>\r\n          }\r\n        </div>\r\n      </div>\r\n\r\n      @for (el of videoStatus(); track el.key + $index) {\r\n        <div (click)=\"toggleGraph($event, el.key, el.value)\" class=\"stat\">\r\n          <span>{{ el.key }}: </span>{{ el.value | json }}\r\n        </div>\r\n      }\r\n    </div>\r\n  </div>\r\n  @if (!collapsed()) {\r\n    <div [innerHTML]=\"ssData() | safe: 'html'\" class=\"ssInfo\"></div>\r\n  }\r\n}\r\n", styles: [".settings-container{position:absolute;top:65px;left:10px;z-index:1000;bottom:10px}.gear-button{left:0;width:50px;position:absolute;background:none;cursor:pointer;font-size:10px;font-weight:500;border:1px solid;border-radius:9px;background:#0162cc;color:#fff;padding:4px}.gear-button>*{color:#fff;filter:drop-shadow(1px 1px 1px rgb(0,0,0))}#aggregatedStats{max-height:calc(100% - 25px);overflow-y:auto;margin-top:25px;left:20px;z-index:31;max-width:400px;padding:10px;background-color:#fff3;border:1px solid grey}#aggregatedStats>*{color:#fff;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000}#aggregatedStats:empty{display:none}#aggregatedStats button{position:absolute;right:5px;top:5px}#aggregatedStats.min{display:none}#aggregatedStats .forNerds{width:100%}#aggregatedStats .forNerds li{list-style-type:none;height:60px}#aggregatedStats .forNerds li app-stat-graph{display:block;width:100%;height:100%}#aggregatedStats .stat span{font-weight:700}#aggregatedStats .stat,#aggregatedStats .graph{cursor:pointer}#aggregatedStats .static{pointer-events:all}.ssInfo{position:absolute;top:0;left:50%;transform:translate(-50%);color:#fff;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000;text-align:center;width:80%;pointer-events:none}\n"] }]
         }], ctorParameters: () => [] });
 
 class ResumeStreamButtonComponent {
@@ -7062,11 +7488,11 @@ class ResumeStreamButtonComponent {
         this.isSecondStart.set(true);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: ResumeStreamButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.4", type: ResumeStreamButtonComponent, isStandalone: true, selector: "app-resume-stream-button", ngImport: i0, template: "@if (isShowResumeButton()) {\n  <div class=\"resume-box\">\n    @if (isSecondStart()) {\n      <div class=\"resume-box__text\">\n        Your stream {{ isAfkDisconnect() ? 'has been' : 'is' }} paused due to\n        inactivity\n      </div>\n    }\n\n    <src-button\n      (onClick)=\"connect()\"\n      [isFullWidth]=\"true\"\n      [data-testid]=\"'connect-button'\"\n      size=\"lg\"\n      weight=\"primary\"\n      class=\"connect-button\"\n    >\n      {{ isSecondStart() ? 'Resume' : 'Start' }}\n    </src-button>\n  </div>\n}\n", styles: [".resume-box{padding:16px;position:absolute;bottom:0;left:50%;gap:12px;z-index:6;display:flex;transform:translate(-50%,-50%);flex-direction:column;align-items:center;border-radius:var(--src-border-rounded-parent, 8px);background:var(--src-surface-container-main, #fff);box-shadow:0 26px 80px #0003,0 0 1px #0003}.resume-box .connect-button{width:100%}.resume-box .resume-box__text{color:var(--src-color-grey-500, #6b7280);text-align:center;font-family:var(--src-font-family-body);font-size:14px;font-style:normal;font-weight:400;line-height:24px}\n"], dependencies: [{ kind: "component", type: SourceButtonComponent, selector: "src-button", inputs: ["type", "appearance", "weight", "size", "context", "customClass", "isFullWidth", "isPressed", "isDisabled", "isLoading", "isInverted", "srcButtonConfig", "formID", "data-testid", "ariaLabel"], outputs: ["onClick", "onSubmit"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.4", type: ResumeStreamButtonComponent, isStandalone: true, selector: "app-resume-stream-button", ngImport: i0, template: "@if (isShowResumeButton()) {\r\n  <div class=\"resume-box\">\r\n    @if (isSecondStart()) {\r\n      <div class=\"resume-box__text\">\r\n        Your stream {{ isAfkDisconnect() ? 'has been' : 'is' }} paused due to\r\n        inactivity\r\n      </div>\r\n    }\r\n\r\n    <src-button\r\n      (onClick)=\"connect()\"\r\n      [isFullWidth]=\"true\"\r\n      [data-testid]=\"'connect-button'\"\r\n      size=\"lg\"\r\n      weight=\"primary\"\r\n      class=\"connect-button\"\r\n    >\r\n      {{ isSecondStart() ? 'Resume' : 'Start' }}\r\n    </src-button>\r\n  </div>\r\n}\r\n", styles: [".resume-box{padding:16px;position:absolute;bottom:0;left:50%;gap:12px;z-index:6;display:flex;transform:translate(-50%,-50%);flex-direction:column;align-items:center;border-radius:var(--src-border-rounded-parent, 8px);background:var(--src-surface-container-main, #fff);box-shadow:0 26px 80px #0003,0 0 1px #0003}.resume-box .connect-button{width:100%}.resume-box .resume-box__text{color:var(--src-color-grey-500, #6b7280);text-align:center;font-family:var(--src-font-family-body);font-size:14px;font-style:normal;font-weight:400;line-height:24px}\n"], dependencies: [{ kind: "component", type: SourceButtonComponent, selector: "src-button", inputs: ["type", "appearance", "weight", "size", "context", "customClass", "isFullWidth", "isPressed", "isDisabled", "isLoading", "isInverted", "srcButtonConfig", "formID", "data-testid", "ariaLabel"], outputs: ["onClick", "onSubmit"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: ResumeStreamButtonComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-resume-stream-button', changeDetection: ChangeDetectionStrategy.OnPush, imports: [SourceButtonComponent], template: "@if (isShowResumeButton()) {\n  <div class=\"resume-box\">\n    @if (isSecondStart()) {\n      <div class=\"resume-box__text\">\n        Your stream {{ isAfkDisconnect() ? 'has been' : 'is' }} paused due to\n        inactivity\n      </div>\n    }\n\n    <src-button\n      (onClick)=\"connect()\"\n      [isFullWidth]=\"true\"\n      [data-testid]=\"'connect-button'\"\n      size=\"lg\"\n      weight=\"primary\"\n      class=\"connect-button\"\n    >\n      {{ isSecondStart() ? 'Resume' : 'Start' }}\n    </src-button>\n  </div>\n}\n", styles: [".resume-box{padding:16px;position:absolute;bottom:0;left:50%;gap:12px;z-index:6;display:flex;transform:translate(-50%,-50%);flex-direction:column;align-items:center;border-radius:var(--src-border-rounded-parent, 8px);background:var(--src-surface-container-main, #fff);box-shadow:0 26px 80px #0003,0 0 1px #0003}.resume-box .connect-button{width:100%}.resume-box .resume-box__text{color:var(--src-color-grey-500, #6b7280);text-align:center;font-family:var(--src-font-family-body);font-size:14px;font-style:normal;font-weight:400;line-height:24px}\n"] }]
+            args: [{ selector: 'app-resume-stream-button', changeDetection: ChangeDetectionStrategy.OnPush, imports: [SourceButtonComponent], template: "@if (isShowResumeButton()) {\r\n  <div class=\"resume-box\">\r\n    @if (isSecondStart()) {\r\n      <div class=\"resume-box__text\">\r\n        Your stream {{ isAfkDisconnect() ? 'has been' : 'is' }} paused due to\r\n        inactivity\r\n      </div>\r\n    }\r\n\r\n    <src-button\r\n      (onClick)=\"connect()\"\r\n      [isFullWidth]=\"true\"\r\n      [data-testid]=\"'connect-button'\"\r\n      size=\"lg\"\r\n      weight=\"primary\"\r\n      class=\"connect-button\"\r\n    >\r\n      {{ isSecondStart() ? 'Resume' : 'Start' }}\r\n    </src-button>\r\n  </div>\r\n}\r\n", styles: [".resume-box{padding:16px;position:absolute;bottom:0;left:50%;gap:12px;z-index:6;display:flex;transform:translate(-50%,-50%);flex-direction:column;align-items:center;border-radius:var(--src-border-rounded-parent, 8px);background:var(--src-surface-container-main, #fff);box-shadow:0 26px 80px #0003,0 0 1px #0003}.resume-box .connect-button{width:100%}.resume-box .resume-box__text{color:var(--src-color-grey-500, #6b7280);text-align:center;font-family:var(--src-font-family-body);font-size:14px;font-style:normal;font-weight:400;line-height:24px}\n"] }]
         }], ctorParameters: () => [] });
 
 class IntroSrcComponent {
@@ -7132,11 +7558,11 @@ class IntroSrcComponent {
         videoContainer.appendChild(videoElement);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: IntroSrcComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.4", type: IntroSrcComponent, isStandalone: true, selector: "app-intro-src", viewQueries: [{ propertyName: "videoElement", first: true, predicate: ["videoPlayerCover"], descendants: true, isSignal: true }], ngImport: i0, template: "@let image = imageIntroSrc();\n@if (image) {\n  <div class=\"backImage\">\n    <img (error)=\"loadingImageError()\" [ngSrc]=\"image\" fill alt=\"imageSrc\" />\n  </div>\n} @else if (videoIntroSrc()) {\n  <div #videoPlayerCover class=\"backVideo\"></div>\n}\n", styles: [".backVideo{position:absolute;top:0;left:0;display:flex;justify-content:center;align-items:center;width:100%;height:100%;z-index:1}.backVideo video{position:absolute;width:100%;height:100%;object-fit:cover}.backImage{position:absolute;top:0;left:0;display:flex;justify-content:center;align-items:center;width:100%;height:100%;z-index:1}.backImage img{position:absolute;width:100%;height:100%;object-fit:cover}\n"], dependencies: [{ kind: "directive", type: NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "decoding", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.4", type: IntroSrcComponent, isStandalone: true, selector: "app-intro-src", viewQueries: [{ propertyName: "videoElement", first: true, predicate: ["videoPlayerCover"], descendants: true, isSignal: true }], ngImport: i0, template: "@let image = imageIntroSrc();\r\n@if (image) {\r\n  <div class=\"backImage\">\r\n    <img (error)=\"loadingImageError()\" [ngSrc]=\"image\" fill alt=\"imageSrc\" />\r\n  </div>\r\n} @else if (videoIntroSrc()) {\r\n  <div #videoPlayerCover class=\"backVideo\"></div>\r\n}\r\n", styles: [".backVideo{position:absolute;top:0;left:0;display:flex;justify-content:center;align-items:center;width:100%;height:100%;z-index:1}.backVideo video{position:absolute;width:100%;height:100%;object-fit:cover}.backImage{position:absolute;top:0;left:0;display:flex;justify-content:center;align-items:center;width:100%;height:100%;z-index:1}.backImage img{position:absolute;width:100%;height:100%;object-fit:cover}\n"], dependencies: [{ kind: "directive", type: NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "decoding", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: IntroSrcComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-intro-src', imports: [NgOptimizedImage], changeDetection: ChangeDetectionStrategy.OnPush, template: "@let image = imageIntroSrc();\n@if (image) {\n  <div class=\"backImage\">\n    <img (error)=\"loadingImageError()\" [ngSrc]=\"image\" fill alt=\"imageSrc\" />\n  </div>\n} @else if (videoIntroSrc()) {\n  <div #videoPlayerCover class=\"backVideo\"></div>\n}\n", styles: [".backVideo{position:absolute;top:0;left:0;display:flex;justify-content:center;align-items:center;width:100%;height:100%;z-index:1}.backVideo video{position:absolute;width:100%;height:100%;object-fit:cover}.backImage{position:absolute;top:0;left:0;display:flex;justify-content:center;align-items:center;width:100%;height:100%;z-index:1}.backImage img{position:absolute;width:100%;height:100%;object-fit:cover}\n"] }]
+            args: [{ selector: 'app-intro-src', imports: [NgOptimizedImage], changeDetection: ChangeDetectionStrategy.OnPush, template: "@let image = imageIntroSrc();\r\n@if (image) {\r\n  <div class=\"backImage\">\r\n    <img (error)=\"loadingImageError()\" [ngSrc]=\"image\" fill alt=\"imageSrc\" />\r\n  </div>\r\n} @else if (videoIntroSrc()) {\r\n  <div #videoPlayerCover class=\"backVideo\"></div>\r\n}\r\n", styles: [".backVideo{position:absolute;top:0;left:0;display:flex;justify-content:center;align-items:center;width:100%;height:100%;z-index:1}.backVideo video{position:absolute;width:100%;height:100%;object-fit:cover}.backImage{position:absolute;top:0;left:0;display:flex;justify-content:center;align-items:center;width:100%;height:100%;z-index:1}.backImage img{position:absolute;width:100%;height:100%;object-fit:cover}\n"] }]
         }], ctorParameters: () => [], propDecorators: { videoElement: [{ type: i0.ViewChild, args: ['videoPlayerCover', { isSignal: true }] }] } });
 
 class UnrealSceneComponent {
@@ -7211,6 +7637,11 @@ class UnrealSceneComponent {
             const isExistMatchUrls = this.isExistMatchUrls();
             untracked(() => {
                 if (videoElement && isExistMatchUrls) {
+                    // Set the container before signalling starts: if a prefetched stream
+                    // is adopted here, VideoService.create() needs the DOM target now
+                    // (the live flow only reaches create() later, at `config` time, by
+                    // which point afterNextRender has already set it).
+                    this.videoService.setContainer(videoElement.nativeElement);
                     this.#store.dispatch(initSignalling());
                 }
             });
@@ -7345,7 +7776,7 @@ class UnrealSceneComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: UnrealSceneComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.4", type: UnrealSceneComponent, isStandalone: true, selector: "app-unreal-scene", inputs: { useContainerAsSizeProvider: { classPropertyName: "useContainerAsSizeProvider", publicName: "useContainerAsSizeProvider", isSignal: true, isRequired: false, transformFunction: null }, isStudio: { classPropertyName: "isStudio", publicName: "isStudio", isSignal: true, isRequired: false, transformFunction: null }, resolutionSize: { classPropertyName: "resolutionSize", publicName: "resolutionSize", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { changeMouseOverScene: "changeMouseOverScene" }, host: { listeners: { "mouseover": "onMouseOver()", "mouseout": "onMouseOut()", "contextmenu": "onContextMenu($event)" } }, viewQueries: [{ propertyName: "videoElement", first: true, predicate: ["videoContainer"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"frame unreal-container\">\n  <div #videoContainer id=\"player\"></div>\n\n  <app-intro-src />\n  <app-image-loading-src />\n  <app-resume-stream-button />\n  <app-unreal-status />\n  <app-freeze-frame />\n  <app-afk-timeout-modal />\n\n  <ng-content select=\"app-pdf\"></ng-content>\n  <ng-content select=\"app-show-case\"></ng-content>\n\n  @if (isDevMode) {\n    <app-video-stats />\n  }\n</div>\n", styles: [".unreal-container{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#fff}.unreal-container #player{position:absolute;width:100%;height:100%;display:flex;justify-content:center;align-items:center;overflow:hidden}.unreal-container.select{cursor:url('data:image/svg+xml,<svg width=\"24\" height=\"24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M15.15 21.375a1.423 1.423 0 0 1-1.15.063 1.487 1.487 0 0 1-.85-.788l-3-6.45-2.325 3.25c-.283.4-.658.525-1.125.375-.467-.15-.7-.466-.7-.95V4.05c0-.417.188-.717.563-.9.375-.183.729-.142 1.062.125l10.1 7.95c.383.284.496.65.337 1.1-.158.45-.479.675-.962.675h-4.2l2.975 6.375c.183.384.204.767.063 1.15a1.487 1.487 0 0 1-.788.85Z\" fill=\"%23000\"/><path d=\"m12.697 20.861.002.005c.237.495.617.852 1.128 1.04.515.191 1.039.16 1.539-.08a1.987 1.987 0 0 0 1.04-1.128 1.922 1.922 0 0 0-.079-1.536v-.003L13.684 13.5H17.1c.32 0 .628-.075.89-.26.263-.184.438-.447.544-.749.106-.3.135-.617.04-.925a1.458 1.458 0 0 0-.545-.738L7.936 2.883a1.51 1.51 0 0 0-.768-.336 1.471 1.471 0 0 0-.825.154 1.495 1.495 0 0 0-.626.547 1.492 1.492 0 0 0-.217.802v12.825c0 .324.08.634.272.897.193.261.467.43.775.53.31.099.632.12.942.016.31-.103.555-.313.743-.578h.001l1.825-2.552 2.639 5.673Z\" stroke=\"%23fff\" stroke-opacity=\".7\"/></svg>') 6 2,auto}.unreal-container.orbit{cursor:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\"><path fill=\"%23000\" d=\"M11.998 21.6c-1.966 0-3.737-.53-5.312-1.588-1.575-1.058-2.738-2.437-3.488-4.137a.852.852 0 0 1 .013-.713.867.867 0 0 1 .512-.487.86.86 0 0 1 .688.037c.225.109.387.28.487.513.617 1.35 1.559 2.45 2.825 3.3 1.267.85 2.692 1.275 4.275 1.275 1.384 0 2.646-.33 3.788-.988a7.985 7.985 0 0 0 2.762-2.612h-.85a.873.873 0 0 1-.64-.257.863.863 0 0 1-.26-.638.88.88 0 0 1 .26-.643.864.864 0 0 1 .64-.262h3c.255 0 .47.086.642.259a.87.87 0 0 1 .258.64v3a.874.874 0 0 1-.257.642.863.863 0 0 1-.637.259.88.88 0 0 1-.643-.259.865.865 0 0 1-.263-.641v-.725a9.95 9.95 0 0 1-3.35 2.925c-1.35.733-2.833 1.1-4.45 1.1Zm0-17.4c-1.383 0-2.645.33-3.787.987A7.985 7.985 0 0 0 5.448 7.8h.85c.255 0 .47.086.642.257a.863.863 0 0 1 .258.638.88.88 0 0 1-.258.642.864.864 0 0 1-.642.263h-3a.87.87 0 0 1-.64-.259.87.87 0 0 1-.26-.641v-3c0-.255.086-.469.258-.641a.863.863 0 0 1 .637-.26.88.88 0 0 1 .643.26.864.864 0 0 1 .262.64v.726A9.95 9.95 0 0 1 7.548 3.5c1.35-.733 2.834-1.1 4.45-1.1 2 0 3.788.542 5.363 1.625 1.575 1.083 2.736 2.49 3.482 4.22a.724.724 0 0 1-.045.646.926.926 0 0 1-.525.437.87.87 0 0 1-.687-.04.977.977 0 0 1-.488-.513c-.616-1.35-1.558-2.45-2.825-3.3-1.266-.85-2.691-1.275-4.275-1.275Zm0 10.8a2.893 2.893 0 0 1-2.125-.875A2.893 2.893 0 0 1 8.998 12c0-.833.292-1.542.875-2.125A2.893 2.893 0 0 1 11.998 9c.834 0 1.542.292 2.125.875.584.583.875 1.292.875 2.125s-.291 1.542-.875 2.125a2.893 2.893 0 0 1-2.125.875Z\"/><path stroke=\"%23fff\" stroke-opacity=\".7\" d=\"m2.739 16.072.002.005c.789 1.788 2.014 3.24 3.666 4.35 1.66 1.116 3.53 1.673 5.591 1.673 1.696 0 3.262-.386 4.69-1.16a10.54 10.54 0 0 0 2.714-2.097c.069.167.171.32.308.454.272.268.613.403.994.403.38 0 .722-.135.992-.406s.402-.614.402-.994v-3c0-.381-.134-.724-.405-.995a1.37 1.37 0 0 0-.995-.405h-3c-.383 0-.727.137-.997.411a1.38 1.38 0 0 0-.403.994c0 .38.135.723.407.992.238.237.532.369.858.397a7.552 7.552 0 0 1-2.027 1.685c-1.062.613-2.237.92-3.538.92-1.488 0-2.815-.397-3.996-1.19-1.19-.798-2.07-1.826-2.647-3.087-.147-.34-.393-.6-.727-.76a1.36 1.36 0 0 0-1.073-.058c-.37.133-.64.397-.8.754a1.351 1.351 0 0 0-.016 1.114Zm4.553-8.37a1.36 1.36 0 0 0-.858-.396A7.552 7.552 0 0 1 8.46 5.62c1.062-.613 2.237-.921 3.537-.921 1.489 0 2.816.398 3.997 1.19 1.19.8 2.07 1.827 2.646 3.088.148.34.394.6.728.76a1.37 1.37 0 0 0 1.068.063c.347-.12.62-.346.799-.668.187-.338.215-.71.072-1.072l-.003-.007-.003-.007c-.784-1.818-2.006-3.298-3.658-4.434C15.982 2.47 14.094 1.9 11.998 1.9c-1.695 0-3.261.385-4.688 1.16a10.536 10.536 0 0 0-2.715 2.096 1.364 1.364 0 0 0-.308-.453 1.38 1.38 0 0 0-.994-.403c-.38 0-.722.135-.992.406s-.403.614-.403.994v3c0 .38.135.724.406.995.27.27.614.405.994.405h3c.384 0 .727-.137.998-.412a1.38 1.38 0 0 0 .402-.993c0-.38-.135-.723-.406-.992ZM9.52 14.48a3.393 3.393 0 0 0 2.478 1.02c.965 0 1.8-.342 2.479-1.02a3.392 3.392 0 0 0 1.021-2.48c0-.963-.343-1.8-1.021-2.478A3.392 3.392 0 0 0 11.998 8.5c-.964 0-1.8.343-2.478 1.021A3.392 3.392 0 0 0 8.498 12c0 .964.344 1.8 1.022 2.479Z\"/></svg>') 12 12,auto}.unreal-container.pan{cursor:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\"><path fill=\"%23000\" d=\"M11.997 10.075a1.01 1.01 0 0 1-.738-.313 1.008 1.008 0 0 1-.312-.737V6.15l-.95.95a.998.998 0 0 1-.763.312 1.09 1.09 0 0 1-.763-.337 1.06 1.06 0 0 1-.324-.775c0-.3.108-.558.324-.775l2.776-2.775c.117-.116.237-.2.362-.25a1.04 1.04 0 0 1 .775 0c.125.05.246.134.363.25l2.8 2.8c.216.217.32.47.313.762a1.096 1.096 0 0 1-.338.763 1.058 1.058 0 0 1-.775.325c-.3 0-.558-.108-.775-.325l-.925-.925v2.875c0 .283-.104.53-.312.737a1.01 1.01 0 0 1-.738.313Zm0 11.5a1.04 1.04 0 0 1-.388-.075 1.103 1.103 0 0 1-.362-.25l-2.8-2.8a1.002 1.002 0 0 1-.313-.762c.009-.292.121-.546.337-.763.217-.217.475-.325.775-.325.3 0 .559.108.775.325l.926.925v-2.875c0-.283.104-.529.312-.737a1.01 1.01 0 0 1 .738-.313c.283 0 .529.104.738.313.208.208.312.454.312.737v2.875l.95-.95a.998.998 0 0 1 .762-.312c.292.008.546.12.763.337.216.217.324.475.324.775 0 .3-.108.559-.324.775l-2.775 2.775c-.117.116-.238.2-.363.25a1.04 1.04 0 0 1-.387.075Zm4.925-6.05a1.058 1.058 0 0 1-.326-.774c0-.3.109-.559.326-.776l.925-.925H14.97c-.283 0-.528-.104-.736-.312a1.01 1.01 0 0 1-.313-.738c0-.283.104-.53.313-.738.208-.208.453-.312.737-.312h2.875l-.95-.95a.998.998 0 0 1-.313-.762 1.09 1.09 0 0 1 .338-.764 1.06 1.06 0 0 1 .775-.324c.3 0 .558.108.775.324l2.774 2.776c.117.117.2.238.251.363a1.04 1.04 0 0 1 0 .775c-.05.124-.134.245-.25.362l-2.8 2.8c-.217.216-.471.32-.762.313a1.096 1.096 0 0 1-.763-.337Zm-11.4 0L2.746 12.75a1.103 1.103 0 0 1-.25-.362 1.04 1.04 0 0 1 0-.775c.05-.125.133-.246.25-.363l2.8-2.8c.216-.216.47-.32.762-.313.292.01.546.121.763.337.217.217.325.476.325.776 0 .3-.108.558-.325.775l-.925.925h2.875c.283 0 .529.104.737.312.208.209.313.455.313.738s-.105.53-.313.738a1.008 1.008 0 0 1-.737.312H6.147l.95.95c.217.217.32.471.312.762a1.09 1.09 0 0 1-.337.764 1.06 1.06 0 0 1-.775.324c-.3 0-.559-.108-.776-.324Z\"/><path stroke=\"%23fff\" stroke-opacity=\".7\" d=\"M9.22 7.912c.436.013.821-.15 1.13-.458l.097-.097v1.668c0 .422.16.793.458 1.09.298.299.67.46 1.092.46.422 0 .793-.161 1.091-.46.298-.297.459-.668.459-1.09V7.357l.071.072c.309.308.693.471 1.13.471.435 0 .82-.163 1.128-.471.301-.303.47-.676.483-1.102v-.001a1.501 1.501 0 0 0-.46-1.13l-2.799-2.8a1.6 1.6 0 0 0-.528-.36l-.003-.001a1.54 1.54 0 0 0-1.145 0l-.002.001a1.6 1.6 0 0 0-.529.36L8.118 5.172l-.001.001a1.56 1.56 0 0 0-.47 1.128c0 .435.163.82.47 1.128.303.303.676.472 1.103.484Zm0 0 .014-.5-.015.5Zm-1.311 6.865a1.497 1.497 0 0 0-.458-1.13l-.097-.097h1.668c.421 0 .793-.16 1.09-.458.298-.299.46-.67.46-1.092a1.51 1.51 0 0 0-.46-1.091 1.507 1.507 0 0 0-1.09-.459H7.354l.071-.072c.309-.308.472-.692.472-1.128 0-.436-.163-.82-.472-1.13a1.596 1.596 0 0 0-1.101-.482h-.002a1.501 1.501 0 0 0-1.129.459l-2.8 2.8a1.6 1.6 0 0 0-.36.528l-.001.003a1.54 1.54 0 0 0 0 1.144v.003c.081.2.208.375.362.529l2.774 2.775c.309.308.693.47 1.129.47.435 0 .82-.162 1.128-.47.303-.302.472-.676.484-1.102Zm0 0-.5-.014.5.015v-.001Zm3.038-8.627-.5.5.5.207V6.15Zm.475 15.814.002.001a1.54 1.54 0 0 0 1.145 0h.002c.2-.081.375-.208.53-.362l2.775-2.774a1.56 1.56 0 0 0 .47-1.129c0-.435-.162-.82-.47-1.128a1.589 1.589 0 0 0-1.103-.484 1.497 1.497 0 0 0-1.13.458l-.096.097v-1.668c0-.421-.161-.793-.459-1.09a1.509 1.509 0 0 0-1.091-.46c-.422 0-.794.161-1.092.46a1.507 1.507 0 0 0-.458 1.09v1.668l-.072-.072a1.558 1.558 0 0 0-1.129-.471c-.436 0-.82.163-1.128.471l-.001.001c-.301.302-.47.675-.483 1.101v.001c-.012.437.151.821.46 1.13l2.8 2.8c.153.153.328.28.528.36Zm5.146-6.085c.303.302.676.47 1.102.484a1.5 1.5 0 0 0 1.13-.46l2.8-2.8a1.6 1.6 0 0 0 .36-.528l.002-.003a1.54 1.54 0 0 0 0-1.144l-.001-.003a1.6 1.6 0 0 0-.361-.529l-2.774-2.775h-.001a1.56 1.56 0 0 0-1.128-.47c-.436 0-.82.162-1.128.47h-.001a1.59 1.59 0 0 0-.484 1.102c-.012.437.15.822.459 1.13l.097.097h-1.668c-.422 0-.793.16-1.09.459-.299.298-.46.67-.46 1.091 0 .422.161.793.46 1.092.297.297.668.458 1.09.458h1.668l-.072.072a1.558 1.558 0 0 0-.472 1.129c0 .435.164.82.472 1.128ZM6.147 13.05l.5.5.207-.5h-.707Z\"/></svg>') 12 12,auto}.unreal-container.dolly{cursor:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\"><mask id=\"a\" width=\"24\" height=\"24\" x=\"0\" y=\"0\" maskUnits=\"userSpaceOnUse\" style=\"mask-type:alpha\"><path fill=\"%23127392\" d=\"M0 0h24v24H0z\"/></mask><g mask=\"url(%23a)\"><path fill=\"%23000\" d=\"M12.002 20.575a1.026 1.026 0 0 1-.75-.325l-2.55-2.55a.933.933 0 0 1-.287-.713c.008-.275.113-.513.313-.713.2-.2.441-.3.725-.3.283 0 .524.1.724.3l.776.776V6.95l-.8.8c-.2.2-.438.296-.712.288a1.018 1.018 0 0 1-.713-.312c-.2-.2-.3-.442-.3-.726s.1-.525.3-.725l2.524-2.525a1.026 1.026 0 0 1 1.5 0l2.55 2.55c.2.2.296.438.289.713a1.023 1.023 0 0 1-.314.713c-.2.2-.441.3-.724.3a.988.988 0 0 1-.725-.3l-.775-.776v10.1l.8-.8c.2-.2.437-.296.712-.288.275.008.512.112.712.312.2.2.3.442.3.726s-.1.525-.3.725l-2.524 2.525a1.026 1.026 0 0 1-.75.325Z\"/><path stroke=\"%23fff\" stroke-opacity=\".7\" d=\"M13.553 8.153c.28.245.62.373 1 .373.415 0 .784-.153 1.078-.447.287-.287.446-.644.46-1.05v-.002a1.432 1.432 0 0 0-.435-1.08l-2.55-2.55-.354.353.354-.354a1.526 1.526 0 0 0-2.207 0L8.374 5.921A1.487 1.487 0 0 0 7.928 7c0 .416.152.785.446 1.08.288.287.645.446 1.052.457l4.127-.384Zm0 0v7.693m0-7.693a1.667 1.667 0 0 1-.079-.074l-3.021.075v7.693a1.482 1.482 0 0 0-1-.373c-.416 0-.785.153-1.079.447a1.522 1.522 0 0 0-.46 1.05v.002c-.011.417.14.786.435 1.08l2.55 2.55a1.527 1.527 0 0 0 2.207 0l2.525-2.524c.294-.294.446-.663.446-1.079 0-.416-.152-.785-.446-1.08a1.518 1.518 0 0 0-1.052-.457m0 0-.014.5.014-.5Zm0 0a1.424 1.424 0 0 0-1.027.383m0 0a1.583 1.583 0 0 0-.053.05l.354.354m-.3-.404v.104l.3.3m0 0-.3-.3v.6l.3-.3Z\"/></g></svg>%0A') 12 12,auto}.unreal-container.disabled:before{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}#playerUI{position:absolute;z-index:10;width:100%}#statsContainer{display:none;text-align:left;background-color:#000c}#stats{padding:6px;font-weight:700;font-size:14px;color:#0f0}canvas{position:absolute;image-rendering:crisp-edges}#overlay{position:absolute;top:0;right:2%;z-index:100;padding:4px;border-top-width:0;-webkit-border-bottom-right-radius:5px;-moz-border-radius-bottomright:5px;border-bottom-right-radius:5px;-webkit-border-bottom-left-radius:5px;-moz-border-radius-bottomleft:5px;border-bottom-left-radius:5px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none}.overlay{font-weight:lighter;font-family:var(--src-font-family-body)}#overlayButton:hover{cursor:pointer}#overlayButton{font-size:40px;text-align:right}#overlaySettings{display:none;width:300px;padding:4px}#videoMessageOverlay{position:absolute;z-index:20;width:100%;margin:auto;font-size:1.8em;font-family:var(--src-font-family-body)}#playButton{display:inline-block;height:auto}img#playButton{width:10%;max-width:241px}#UIInteraction{position:fixed}#UIInteractionButtonBoundary{padding:2px}#UIInteractionButton{cursor:pointer}#hiddenInput{position:absolute;left:-10%;width:0;opacity:0}#editTextButton{position:absolute;width:40px;height:40px}\n"], dependencies: [{ kind: "component", type: AfkTimeoutModalComponent, selector: "app-afk-timeout-modal" }, { kind: "component", type: UnrealStatusComponent, selector: "app-unreal-status" }, { kind: "component", type: FreezeFrameComponent, selector: "app-freeze-frame" }, { kind: "component", type: VideoStatsComponent, selector: "app-video-stats" }, { kind: "component", type: ResumeStreamButtonComponent, selector: "app-resume-stream-button" }, { kind: "component", type: ImageLoadingSrcComponent, selector: "app-image-loading-src" }, { kind: "component", type: IntroSrcComponent, selector: "app-intro-src" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.4", type: UnrealSceneComponent, isStandalone: true, selector: "app-unreal-scene", inputs: { useContainerAsSizeProvider: { classPropertyName: "useContainerAsSizeProvider", publicName: "useContainerAsSizeProvider", isSignal: true, isRequired: false, transformFunction: null }, isStudio: { classPropertyName: "isStudio", publicName: "isStudio", isSignal: true, isRequired: false, transformFunction: null }, resolutionSize: { classPropertyName: "resolutionSize", publicName: "resolutionSize", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { changeMouseOverScene: "changeMouseOverScene" }, host: { listeners: { "mouseover": "onMouseOver()", "mouseout": "onMouseOut()", "contextmenu": "onContextMenu($event)" } }, viewQueries: [{ propertyName: "videoElement", first: true, predicate: ["videoContainer"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"frame unreal-container\">\r\n  <div #videoContainer id=\"player\"></div>\r\n\r\n  <app-intro-src />\r\n  <app-image-loading-src />\r\n  <app-resume-stream-button />\r\n  <app-unreal-status />\r\n  <app-freeze-frame />\r\n  <app-afk-timeout-modal />\r\n\r\n  <ng-content select=\"app-pdf\"></ng-content>\r\n  <ng-content select=\"app-show-case\"></ng-content>\r\n\r\n  @if (isDevMode) {\r\n    <app-video-stats />\r\n  }\r\n</div>\r\n", styles: [".unreal-container{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#fff}.unreal-container #player{position:absolute;width:100%;height:100%;display:flex;justify-content:center;align-items:center;overflow:hidden}.unreal-container.select{cursor:url('data:image/svg+xml,<svg width=\"24\" height=\"24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M15.15 21.375a1.423 1.423 0 0 1-1.15.063 1.487 1.487 0 0 1-.85-.788l-3-6.45-2.325 3.25c-.283.4-.658.525-1.125.375-.467-.15-.7-.466-.7-.95V4.05c0-.417.188-.717.563-.9.375-.183.729-.142 1.062.125l10.1 7.95c.383.284.496.65.337 1.1-.158.45-.479.675-.962.675h-4.2l2.975 6.375c.183.384.204.767.063 1.15a1.487 1.487 0 0 1-.788.85Z\" fill=\"%23000\"/><path d=\"m12.697 20.861.002.005c.237.495.617.852 1.128 1.04.515.191 1.039.16 1.539-.08a1.987 1.987 0 0 0 1.04-1.128 1.922 1.922 0 0 0-.079-1.536v-.003L13.684 13.5H17.1c.32 0 .628-.075.89-.26.263-.184.438-.447.544-.749.106-.3.135-.617.04-.925a1.458 1.458 0 0 0-.545-.738L7.936 2.883a1.51 1.51 0 0 0-.768-.336 1.471 1.471 0 0 0-.825.154 1.495 1.495 0 0 0-.626.547 1.492 1.492 0 0 0-.217.802v12.825c0 .324.08.634.272.897.193.261.467.43.775.53.31.099.632.12.942.016.31-.103.555-.313.743-.578h.001l1.825-2.552 2.639 5.673Z\" stroke=\"%23fff\" stroke-opacity=\".7\"/></svg>') 6 2,auto}.unreal-container.orbit{cursor:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\"><path fill=\"%23000\" d=\"M11.998 21.6c-1.966 0-3.737-.53-5.312-1.588-1.575-1.058-2.738-2.437-3.488-4.137a.852.852 0 0 1 .013-.713.867.867 0 0 1 .512-.487.86.86 0 0 1 .688.037c.225.109.387.28.487.513.617 1.35 1.559 2.45 2.825 3.3 1.267.85 2.692 1.275 4.275 1.275 1.384 0 2.646-.33 3.788-.988a7.985 7.985 0 0 0 2.762-2.612h-.85a.873.873 0 0 1-.64-.257.863.863 0 0 1-.26-.638.88.88 0 0 1 .26-.643.864.864 0 0 1 .64-.262h3c.255 0 .47.086.642.259a.87.87 0 0 1 .258.64v3a.874.874 0 0 1-.257.642.863.863 0 0 1-.637.259.88.88 0 0 1-.643-.259.865.865 0 0 1-.263-.641v-.725a9.95 9.95 0 0 1-3.35 2.925c-1.35.733-2.833 1.1-4.45 1.1Zm0-17.4c-1.383 0-2.645.33-3.787.987A7.985 7.985 0 0 0 5.448 7.8h.85c.255 0 .47.086.642.257a.863.863 0 0 1 .258.638.88.88 0 0 1-.258.642.864.864 0 0 1-.642.263h-3a.87.87 0 0 1-.64-.259.87.87 0 0 1-.26-.641v-3c0-.255.086-.469.258-.641a.863.863 0 0 1 .637-.26.88.88 0 0 1 .643.26.864.864 0 0 1 .262.64v.726A9.95 9.95 0 0 1 7.548 3.5c1.35-.733 2.834-1.1 4.45-1.1 2 0 3.788.542 5.363 1.625 1.575 1.083 2.736 2.49 3.482 4.22a.724.724 0 0 1-.045.646.926.926 0 0 1-.525.437.87.87 0 0 1-.687-.04.977.977 0 0 1-.488-.513c-.616-1.35-1.558-2.45-2.825-3.3-1.266-.85-2.691-1.275-4.275-1.275Zm0 10.8a2.893 2.893 0 0 1-2.125-.875A2.893 2.893 0 0 1 8.998 12c0-.833.292-1.542.875-2.125A2.893 2.893 0 0 1 11.998 9c.834 0 1.542.292 2.125.875.584.583.875 1.292.875 2.125s-.291 1.542-.875 2.125a2.893 2.893 0 0 1-2.125.875Z\"/><path stroke=\"%23fff\" stroke-opacity=\".7\" d=\"m2.739 16.072.002.005c.789 1.788 2.014 3.24 3.666 4.35 1.66 1.116 3.53 1.673 5.591 1.673 1.696 0 3.262-.386 4.69-1.16a10.54 10.54 0 0 0 2.714-2.097c.069.167.171.32.308.454.272.268.613.403.994.403.38 0 .722-.135.992-.406s.402-.614.402-.994v-3c0-.381-.134-.724-.405-.995a1.37 1.37 0 0 0-.995-.405h-3c-.383 0-.727.137-.997.411a1.38 1.38 0 0 0-.403.994c0 .38.135.723.407.992.238.237.532.369.858.397a7.552 7.552 0 0 1-2.027 1.685c-1.062.613-2.237.92-3.538.92-1.488 0-2.815-.397-3.996-1.19-1.19-.798-2.07-1.826-2.647-3.087-.147-.34-.393-.6-.727-.76a1.36 1.36 0 0 0-1.073-.058c-.37.133-.64.397-.8.754a1.351 1.351 0 0 0-.016 1.114Zm4.553-8.37a1.36 1.36 0 0 0-.858-.396A7.552 7.552 0 0 1 8.46 5.62c1.062-.613 2.237-.921 3.537-.921 1.489 0 2.816.398 3.997 1.19 1.19.8 2.07 1.827 2.646 3.088.148.34.394.6.728.76a1.37 1.37 0 0 0 1.068.063c.347-.12.62-.346.799-.668.187-.338.215-.71.072-1.072l-.003-.007-.003-.007c-.784-1.818-2.006-3.298-3.658-4.434C15.982 2.47 14.094 1.9 11.998 1.9c-1.695 0-3.261.385-4.688 1.16a10.536 10.536 0 0 0-2.715 2.096 1.364 1.364 0 0 0-.308-.453 1.38 1.38 0 0 0-.994-.403c-.38 0-.722.135-.992.406s-.403.614-.403.994v3c0 .38.135.724.406.995.27.27.614.405.994.405h3c.384 0 .727-.137.998-.412a1.38 1.38 0 0 0 .402-.993c0-.38-.135-.723-.406-.992ZM9.52 14.48a3.393 3.393 0 0 0 2.478 1.02c.965 0 1.8-.342 2.479-1.02a3.392 3.392 0 0 0 1.021-2.48c0-.963-.343-1.8-1.021-2.478A3.392 3.392 0 0 0 11.998 8.5c-.964 0-1.8.343-2.478 1.021A3.392 3.392 0 0 0 8.498 12c0 .964.344 1.8 1.022 2.479Z\"/></svg>') 12 12,auto}.unreal-container.pan{cursor:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\"><path fill=\"%23000\" d=\"M11.997 10.075a1.01 1.01 0 0 1-.738-.313 1.008 1.008 0 0 1-.312-.737V6.15l-.95.95a.998.998 0 0 1-.763.312 1.09 1.09 0 0 1-.763-.337 1.06 1.06 0 0 1-.324-.775c0-.3.108-.558.324-.775l2.776-2.775c.117-.116.237-.2.362-.25a1.04 1.04 0 0 1 .775 0c.125.05.246.134.363.25l2.8 2.8c.216.217.32.47.313.762a1.096 1.096 0 0 1-.338.763 1.058 1.058 0 0 1-.775.325c-.3 0-.558-.108-.775-.325l-.925-.925v2.875c0 .283-.104.53-.312.737a1.01 1.01 0 0 1-.738.313Zm0 11.5a1.04 1.04 0 0 1-.388-.075 1.103 1.103 0 0 1-.362-.25l-2.8-2.8a1.002 1.002 0 0 1-.313-.762c.009-.292.121-.546.337-.763.217-.217.475-.325.775-.325.3 0 .559.108.775.325l.926.925v-2.875c0-.283.104-.529.312-.737a1.01 1.01 0 0 1 .738-.313c.283 0 .529.104.738.313.208.208.312.454.312.737v2.875l.95-.95a.998.998 0 0 1 .762-.312c.292.008.546.12.763.337.216.217.324.475.324.775 0 .3-.108.559-.324.775l-2.775 2.775c-.117.116-.238.2-.363.25a1.04 1.04 0 0 1-.387.075Zm4.925-6.05a1.058 1.058 0 0 1-.326-.774c0-.3.109-.559.326-.776l.925-.925H14.97c-.283 0-.528-.104-.736-.312a1.01 1.01 0 0 1-.313-.738c0-.283.104-.53.313-.738.208-.208.453-.312.737-.312h2.875l-.95-.95a.998.998 0 0 1-.313-.762 1.09 1.09 0 0 1 .338-.764 1.06 1.06 0 0 1 .775-.324c.3 0 .558.108.775.324l2.774 2.776c.117.117.2.238.251.363a1.04 1.04 0 0 1 0 .775c-.05.124-.134.245-.25.362l-2.8 2.8c-.217.216-.471.32-.762.313a1.096 1.096 0 0 1-.763-.337Zm-11.4 0L2.746 12.75a1.103 1.103 0 0 1-.25-.362 1.04 1.04 0 0 1 0-.775c.05-.125.133-.246.25-.363l2.8-2.8c.216-.216.47-.32.762-.313.292.01.546.121.763.337.217.217.325.476.325.776 0 .3-.108.558-.325.775l-.925.925h2.875c.283 0 .529.104.737.312.208.209.313.455.313.738s-.105.53-.313.738a1.008 1.008 0 0 1-.737.312H6.147l.95.95c.217.217.32.471.312.762a1.09 1.09 0 0 1-.337.764 1.06 1.06 0 0 1-.775.324c-.3 0-.559-.108-.776-.324Z\"/><path stroke=\"%23fff\" stroke-opacity=\".7\" d=\"M9.22 7.912c.436.013.821-.15 1.13-.458l.097-.097v1.668c0 .422.16.793.458 1.09.298.299.67.46 1.092.46.422 0 .793-.161 1.091-.46.298-.297.459-.668.459-1.09V7.357l.071.072c.309.308.693.471 1.13.471.435 0 .82-.163 1.128-.471.301-.303.47-.676.483-1.102v-.001a1.501 1.501 0 0 0-.46-1.13l-2.799-2.8a1.6 1.6 0 0 0-.528-.36l-.003-.001a1.54 1.54 0 0 0-1.145 0l-.002.001a1.6 1.6 0 0 0-.529.36L8.118 5.172l-.001.001a1.56 1.56 0 0 0-.47 1.128c0 .435.163.82.47 1.128.303.303.676.472 1.103.484Zm0 0 .014-.5-.015.5Zm-1.311 6.865a1.497 1.497 0 0 0-.458-1.13l-.097-.097h1.668c.421 0 .793-.16 1.09-.458.298-.299.46-.67.46-1.092a1.51 1.51 0 0 0-.46-1.091 1.507 1.507 0 0 0-1.09-.459H7.354l.071-.072c.309-.308.472-.692.472-1.128 0-.436-.163-.82-.472-1.13a1.596 1.596 0 0 0-1.101-.482h-.002a1.501 1.501 0 0 0-1.129.459l-2.8 2.8a1.6 1.6 0 0 0-.36.528l-.001.003a1.54 1.54 0 0 0 0 1.144v.003c.081.2.208.375.362.529l2.774 2.775c.309.308.693.47 1.129.47.435 0 .82-.162 1.128-.47.303-.302.472-.676.484-1.102Zm0 0-.5-.014.5.015v-.001Zm3.038-8.627-.5.5.5.207V6.15Zm.475 15.814.002.001a1.54 1.54 0 0 0 1.145 0h.002c.2-.081.375-.208.53-.362l2.775-2.774a1.56 1.56 0 0 0 .47-1.129c0-.435-.162-.82-.47-1.128a1.589 1.589 0 0 0-1.103-.484 1.497 1.497 0 0 0-1.13.458l-.096.097v-1.668c0-.421-.161-.793-.459-1.09a1.509 1.509 0 0 0-1.091-.46c-.422 0-.794.161-1.092.46a1.507 1.507 0 0 0-.458 1.09v1.668l-.072-.072a1.558 1.558 0 0 0-1.129-.471c-.436 0-.82.163-1.128.471l-.001.001c-.301.302-.47.675-.483 1.101v.001c-.012.437.151.821.46 1.13l2.8 2.8c.153.153.328.28.528.36Zm5.146-6.085c.303.302.676.47 1.102.484a1.5 1.5 0 0 0 1.13-.46l2.8-2.8a1.6 1.6 0 0 0 .36-.528l.002-.003a1.54 1.54 0 0 0 0-1.144l-.001-.003a1.6 1.6 0 0 0-.361-.529l-2.774-2.775h-.001a1.56 1.56 0 0 0-1.128-.47c-.436 0-.82.162-1.128.47h-.001a1.59 1.59 0 0 0-.484 1.102c-.012.437.15.822.459 1.13l.097.097h-1.668c-.422 0-.793.16-1.09.459-.299.298-.46.67-.46 1.091 0 .422.161.793.46 1.092.297.297.668.458 1.09.458h1.668l-.072.072a1.558 1.558 0 0 0-.472 1.129c0 .435.164.82.472 1.128ZM6.147 13.05l.5.5.207-.5h-.707Z\"/></svg>') 12 12,auto}.unreal-container.dolly{cursor:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\"><mask id=\"a\" width=\"24\" height=\"24\" x=\"0\" y=\"0\" maskUnits=\"userSpaceOnUse\" style=\"mask-type:alpha\"><path fill=\"%23127392\" d=\"M0 0h24v24H0z\"/></mask><g mask=\"url(%23a)\"><path fill=\"%23000\" d=\"M12.002 20.575a1.026 1.026 0 0 1-.75-.325l-2.55-2.55a.933.933 0 0 1-.287-.713c.008-.275.113-.513.313-.713.2-.2.441-.3.725-.3.283 0 .524.1.724.3l.776.776V6.95l-.8.8c-.2.2-.438.296-.712.288a1.018 1.018 0 0 1-.713-.312c-.2-.2-.3-.442-.3-.726s.1-.525.3-.725l2.524-2.525a1.026 1.026 0 0 1 1.5 0l2.55 2.55c.2.2.296.438.289.713a1.023 1.023 0 0 1-.314.713c-.2.2-.441.3-.724.3a.988.988 0 0 1-.725-.3l-.775-.776v10.1l.8-.8c.2-.2.437-.296.712-.288.275.008.512.112.712.312.2.2.3.442.3.726s-.1.525-.3.725l-2.524 2.525a1.026 1.026 0 0 1-.75.325Z\"/><path stroke=\"%23fff\" stroke-opacity=\".7\" d=\"M13.553 8.153c.28.245.62.373 1 .373.415 0 .784-.153 1.078-.447.287-.287.446-.644.46-1.05v-.002a1.432 1.432 0 0 0-.435-1.08l-2.55-2.55-.354.353.354-.354a1.526 1.526 0 0 0-2.207 0L8.374 5.921A1.487 1.487 0 0 0 7.928 7c0 .416.152.785.446 1.08.288.287.645.446 1.052.457l4.127-.384Zm0 0v7.693m0-7.693a1.667 1.667 0 0 1-.079-.074l-3.021.075v7.693a1.482 1.482 0 0 0-1-.373c-.416 0-.785.153-1.079.447a1.522 1.522 0 0 0-.46 1.05v.002c-.011.417.14.786.435 1.08l2.55 2.55a1.527 1.527 0 0 0 2.207 0l2.525-2.524c.294-.294.446-.663.446-1.079 0-.416-.152-.785-.446-1.08a1.518 1.518 0 0 0-1.052-.457m0 0-.014.5.014-.5Zm0 0a1.424 1.424 0 0 0-1.027.383m0 0a1.583 1.583 0 0 0-.053.05l.354.354m-.3-.404v.104l.3.3m0 0-.3-.3v.6l.3-.3Z\"/></g></svg>%0D%0A') 12 12,auto}.unreal-container.disabled:before{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}#playerUI{position:absolute;z-index:10;width:100%}#statsContainer{display:none;text-align:left;background-color:#000c}#stats{padding:6px;font-weight:700;font-size:14px;color:#0f0}canvas{position:absolute;image-rendering:crisp-edges}#overlay{position:absolute;top:0;right:2%;z-index:100;padding:4px;border-top-width:0;-webkit-border-bottom-right-radius:5px;-moz-border-radius-bottomright:5px;border-bottom-right-radius:5px;-webkit-border-bottom-left-radius:5px;-moz-border-radius-bottomleft:5px;border-bottom-left-radius:5px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none}.overlay{font-weight:lighter;font-family:var(--src-font-family-body)}#overlayButton:hover{cursor:pointer}#overlayButton{font-size:40px;text-align:right}#overlaySettings{display:none;width:300px;padding:4px}#videoMessageOverlay{position:absolute;z-index:20;width:100%;margin:auto;font-size:1.8em;font-family:var(--src-font-family-body)}#playButton{display:inline-block;height:auto}img#playButton{width:10%;max-width:241px}#UIInteraction{position:fixed}#UIInteractionButtonBoundary{padding:2px}#UIInteractionButton{cursor:pointer}#hiddenInput{position:absolute;left:-10%;width:0;opacity:0}#editTextButton{position:absolute;width:40px;height:40px}\n"], dependencies: [{ kind: "component", type: AfkTimeoutModalComponent, selector: "app-afk-timeout-modal" }, { kind: "component", type: UnrealStatusComponent, selector: "app-unreal-status" }, { kind: "component", type: FreezeFrameComponent, selector: "app-freeze-frame" }, { kind: "component", type: VideoStatsComponent, selector: "app-video-stats" }, { kind: "component", type: ResumeStreamButtonComponent, selector: "app-resume-stream-button" }, { kind: "component", type: ImageLoadingSrcComponent, selector: "app-image-loading-src" }, { kind: "component", type: IntroSrcComponent, selector: "app-intro-src" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: UnrealSceneComponent, decorators: [{
             type: Component,
@@ -7357,7 +7788,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImpor
                         ResumeStreamButtonComponent,
                         ImageLoadingSrcComponent,
                         IntroSrcComponent,
-                    ], template: "<div class=\"frame unreal-container\">\n  <div #videoContainer id=\"player\"></div>\n\n  <app-intro-src />\n  <app-image-loading-src />\n  <app-resume-stream-button />\n  <app-unreal-status />\n  <app-freeze-frame />\n  <app-afk-timeout-modal />\n\n  <ng-content select=\"app-pdf\"></ng-content>\n  <ng-content select=\"app-show-case\"></ng-content>\n\n  @if (isDevMode) {\n    <app-video-stats />\n  }\n</div>\n", styles: [".unreal-container{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#fff}.unreal-container #player{position:absolute;width:100%;height:100%;display:flex;justify-content:center;align-items:center;overflow:hidden}.unreal-container.select{cursor:url('data:image/svg+xml,<svg width=\"24\" height=\"24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M15.15 21.375a1.423 1.423 0 0 1-1.15.063 1.487 1.487 0 0 1-.85-.788l-3-6.45-2.325 3.25c-.283.4-.658.525-1.125.375-.467-.15-.7-.466-.7-.95V4.05c0-.417.188-.717.563-.9.375-.183.729-.142 1.062.125l10.1 7.95c.383.284.496.65.337 1.1-.158.45-.479.675-.962.675h-4.2l2.975 6.375c.183.384.204.767.063 1.15a1.487 1.487 0 0 1-.788.85Z\" fill=\"%23000\"/><path d=\"m12.697 20.861.002.005c.237.495.617.852 1.128 1.04.515.191 1.039.16 1.539-.08a1.987 1.987 0 0 0 1.04-1.128 1.922 1.922 0 0 0-.079-1.536v-.003L13.684 13.5H17.1c.32 0 .628-.075.89-.26.263-.184.438-.447.544-.749.106-.3.135-.617.04-.925a1.458 1.458 0 0 0-.545-.738L7.936 2.883a1.51 1.51 0 0 0-.768-.336 1.471 1.471 0 0 0-.825.154 1.495 1.495 0 0 0-.626.547 1.492 1.492 0 0 0-.217.802v12.825c0 .324.08.634.272.897.193.261.467.43.775.53.31.099.632.12.942.016.31-.103.555-.313.743-.578h.001l1.825-2.552 2.639 5.673Z\" stroke=\"%23fff\" stroke-opacity=\".7\"/></svg>') 6 2,auto}.unreal-container.orbit{cursor:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\"><path fill=\"%23000\" d=\"M11.998 21.6c-1.966 0-3.737-.53-5.312-1.588-1.575-1.058-2.738-2.437-3.488-4.137a.852.852 0 0 1 .013-.713.867.867 0 0 1 .512-.487.86.86 0 0 1 .688.037c.225.109.387.28.487.513.617 1.35 1.559 2.45 2.825 3.3 1.267.85 2.692 1.275 4.275 1.275 1.384 0 2.646-.33 3.788-.988a7.985 7.985 0 0 0 2.762-2.612h-.85a.873.873 0 0 1-.64-.257.863.863 0 0 1-.26-.638.88.88 0 0 1 .26-.643.864.864 0 0 1 .64-.262h3c.255 0 .47.086.642.259a.87.87 0 0 1 .258.64v3a.874.874 0 0 1-.257.642.863.863 0 0 1-.637.259.88.88 0 0 1-.643-.259.865.865 0 0 1-.263-.641v-.725a9.95 9.95 0 0 1-3.35 2.925c-1.35.733-2.833 1.1-4.45 1.1Zm0-17.4c-1.383 0-2.645.33-3.787.987A7.985 7.985 0 0 0 5.448 7.8h.85c.255 0 .47.086.642.257a.863.863 0 0 1 .258.638.88.88 0 0 1-.258.642.864.864 0 0 1-.642.263h-3a.87.87 0 0 1-.64-.259.87.87 0 0 1-.26-.641v-3c0-.255.086-.469.258-.641a.863.863 0 0 1 .637-.26.88.88 0 0 1 .643.26.864.864 0 0 1 .262.64v.726A9.95 9.95 0 0 1 7.548 3.5c1.35-.733 2.834-1.1 4.45-1.1 2 0 3.788.542 5.363 1.625 1.575 1.083 2.736 2.49 3.482 4.22a.724.724 0 0 1-.045.646.926.926 0 0 1-.525.437.87.87 0 0 1-.687-.04.977.977 0 0 1-.488-.513c-.616-1.35-1.558-2.45-2.825-3.3-1.266-.85-2.691-1.275-4.275-1.275Zm0 10.8a2.893 2.893 0 0 1-2.125-.875A2.893 2.893 0 0 1 8.998 12c0-.833.292-1.542.875-2.125A2.893 2.893 0 0 1 11.998 9c.834 0 1.542.292 2.125.875.584.583.875 1.292.875 2.125s-.291 1.542-.875 2.125a2.893 2.893 0 0 1-2.125.875Z\"/><path stroke=\"%23fff\" stroke-opacity=\".7\" d=\"m2.739 16.072.002.005c.789 1.788 2.014 3.24 3.666 4.35 1.66 1.116 3.53 1.673 5.591 1.673 1.696 0 3.262-.386 4.69-1.16a10.54 10.54 0 0 0 2.714-2.097c.069.167.171.32.308.454.272.268.613.403.994.403.38 0 .722-.135.992-.406s.402-.614.402-.994v-3c0-.381-.134-.724-.405-.995a1.37 1.37 0 0 0-.995-.405h-3c-.383 0-.727.137-.997.411a1.38 1.38 0 0 0-.403.994c0 .38.135.723.407.992.238.237.532.369.858.397a7.552 7.552 0 0 1-2.027 1.685c-1.062.613-2.237.92-3.538.92-1.488 0-2.815-.397-3.996-1.19-1.19-.798-2.07-1.826-2.647-3.087-.147-.34-.393-.6-.727-.76a1.36 1.36 0 0 0-1.073-.058c-.37.133-.64.397-.8.754a1.351 1.351 0 0 0-.016 1.114Zm4.553-8.37a1.36 1.36 0 0 0-.858-.396A7.552 7.552 0 0 1 8.46 5.62c1.062-.613 2.237-.921 3.537-.921 1.489 0 2.816.398 3.997 1.19 1.19.8 2.07 1.827 2.646 3.088.148.34.394.6.728.76a1.37 1.37 0 0 0 1.068.063c.347-.12.62-.346.799-.668.187-.338.215-.71.072-1.072l-.003-.007-.003-.007c-.784-1.818-2.006-3.298-3.658-4.434C15.982 2.47 14.094 1.9 11.998 1.9c-1.695 0-3.261.385-4.688 1.16a10.536 10.536 0 0 0-2.715 2.096 1.364 1.364 0 0 0-.308-.453 1.38 1.38 0 0 0-.994-.403c-.38 0-.722.135-.992.406s-.403.614-.403.994v3c0 .38.135.724.406.995.27.27.614.405.994.405h3c.384 0 .727-.137.998-.412a1.38 1.38 0 0 0 .402-.993c0-.38-.135-.723-.406-.992ZM9.52 14.48a3.393 3.393 0 0 0 2.478 1.02c.965 0 1.8-.342 2.479-1.02a3.392 3.392 0 0 0 1.021-2.48c0-.963-.343-1.8-1.021-2.478A3.392 3.392 0 0 0 11.998 8.5c-.964 0-1.8.343-2.478 1.021A3.392 3.392 0 0 0 8.498 12c0 .964.344 1.8 1.022 2.479Z\"/></svg>') 12 12,auto}.unreal-container.pan{cursor:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\"><path fill=\"%23000\" d=\"M11.997 10.075a1.01 1.01 0 0 1-.738-.313 1.008 1.008 0 0 1-.312-.737V6.15l-.95.95a.998.998 0 0 1-.763.312 1.09 1.09 0 0 1-.763-.337 1.06 1.06 0 0 1-.324-.775c0-.3.108-.558.324-.775l2.776-2.775c.117-.116.237-.2.362-.25a1.04 1.04 0 0 1 .775 0c.125.05.246.134.363.25l2.8 2.8c.216.217.32.47.313.762a1.096 1.096 0 0 1-.338.763 1.058 1.058 0 0 1-.775.325c-.3 0-.558-.108-.775-.325l-.925-.925v2.875c0 .283-.104.53-.312.737a1.01 1.01 0 0 1-.738.313Zm0 11.5a1.04 1.04 0 0 1-.388-.075 1.103 1.103 0 0 1-.362-.25l-2.8-2.8a1.002 1.002 0 0 1-.313-.762c.009-.292.121-.546.337-.763.217-.217.475-.325.775-.325.3 0 .559.108.775.325l.926.925v-2.875c0-.283.104-.529.312-.737a1.01 1.01 0 0 1 .738-.313c.283 0 .529.104.738.313.208.208.312.454.312.737v2.875l.95-.95a.998.998 0 0 1 .762-.312c.292.008.546.12.763.337.216.217.324.475.324.775 0 .3-.108.559-.324.775l-2.775 2.775c-.117.116-.238.2-.363.25a1.04 1.04 0 0 1-.387.075Zm4.925-6.05a1.058 1.058 0 0 1-.326-.774c0-.3.109-.559.326-.776l.925-.925H14.97c-.283 0-.528-.104-.736-.312a1.01 1.01 0 0 1-.313-.738c0-.283.104-.53.313-.738.208-.208.453-.312.737-.312h2.875l-.95-.95a.998.998 0 0 1-.313-.762 1.09 1.09 0 0 1 .338-.764 1.06 1.06 0 0 1 .775-.324c.3 0 .558.108.775.324l2.774 2.776c.117.117.2.238.251.363a1.04 1.04 0 0 1 0 .775c-.05.124-.134.245-.25.362l-2.8 2.8c-.217.216-.471.32-.762.313a1.096 1.096 0 0 1-.763-.337Zm-11.4 0L2.746 12.75a1.103 1.103 0 0 1-.25-.362 1.04 1.04 0 0 1 0-.775c.05-.125.133-.246.25-.363l2.8-2.8c.216-.216.47-.32.762-.313.292.01.546.121.763.337.217.217.325.476.325.776 0 .3-.108.558-.325.775l-.925.925h2.875c.283 0 .529.104.737.312.208.209.313.455.313.738s-.105.53-.313.738a1.008 1.008 0 0 1-.737.312H6.147l.95.95c.217.217.32.471.312.762a1.09 1.09 0 0 1-.337.764 1.06 1.06 0 0 1-.775.324c-.3 0-.559-.108-.776-.324Z\"/><path stroke=\"%23fff\" stroke-opacity=\".7\" d=\"M9.22 7.912c.436.013.821-.15 1.13-.458l.097-.097v1.668c0 .422.16.793.458 1.09.298.299.67.46 1.092.46.422 0 .793-.161 1.091-.46.298-.297.459-.668.459-1.09V7.357l.071.072c.309.308.693.471 1.13.471.435 0 .82-.163 1.128-.471.301-.303.47-.676.483-1.102v-.001a1.501 1.501 0 0 0-.46-1.13l-2.799-2.8a1.6 1.6 0 0 0-.528-.36l-.003-.001a1.54 1.54 0 0 0-1.145 0l-.002.001a1.6 1.6 0 0 0-.529.36L8.118 5.172l-.001.001a1.56 1.56 0 0 0-.47 1.128c0 .435.163.82.47 1.128.303.303.676.472 1.103.484Zm0 0 .014-.5-.015.5Zm-1.311 6.865a1.497 1.497 0 0 0-.458-1.13l-.097-.097h1.668c.421 0 .793-.16 1.09-.458.298-.299.46-.67.46-1.092a1.51 1.51 0 0 0-.46-1.091 1.507 1.507 0 0 0-1.09-.459H7.354l.071-.072c.309-.308.472-.692.472-1.128 0-.436-.163-.82-.472-1.13a1.596 1.596 0 0 0-1.101-.482h-.002a1.501 1.501 0 0 0-1.129.459l-2.8 2.8a1.6 1.6 0 0 0-.36.528l-.001.003a1.54 1.54 0 0 0 0 1.144v.003c.081.2.208.375.362.529l2.774 2.775c.309.308.693.47 1.129.47.435 0 .82-.162 1.128-.47.303-.302.472-.676.484-1.102Zm0 0-.5-.014.5.015v-.001Zm3.038-8.627-.5.5.5.207V6.15Zm.475 15.814.002.001a1.54 1.54 0 0 0 1.145 0h.002c.2-.081.375-.208.53-.362l2.775-2.774a1.56 1.56 0 0 0 .47-1.129c0-.435-.162-.82-.47-1.128a1.589 1.589 0 0 0-1.103-.484 1.497 1.497 0 0 0-1.13.458l-.096.097v-1.668c0-.421-.161-.793-.459-1.09a1.509 1.509 0 0 0-1.091-.46c-.422 0-.794.161-1.092.46a1.507 1.507 0 0 0-.458 1.09v1.668l-.072-.072a1.558 1.558 0 0 0-1.129-.471c-.436 0-.82.163-1.128.471l-.001.001c-.301.302-.47.675-.483 1.101v.001c-.012.437.151.821.46 1.13l2.8 2.8c.153.153.328.28.528.36Zm5.146-6.085c.303.302.676.47 1.102.484a1.5 1.5 0 0 0 1.13-.46l2.8-2.8a1.6 1.6 0 0 0 .36-.528l.002-.003a1.54 1.54 0 0 0 0-1.144l-.001-.003a1.6 1.6 0 0 0-.361-.529l-2.774-2.775h-.001a1.56 1.56 0 0 0-1.128-.47c-.436 0-.82.162-1.128.47h-.001a1.59 1.59 0 0 0-.484 1.102c-.012.437.15.822.459 1.13l.097.097h-1.668c-.422 0-.793.16-1.09.459-.299.298-.46.67-.46 1.091 0 .422.161.793.46 1.092.297.297.668.458 1.09.458h1.668l-.072.072a1.558 1.558 0 0 0-.472 1.129c0 .435.164.82.472 1.128ZM6.147 13.05l.5.5.207-.5h-.707Z\"/></svg>') 12 12,auto}.unreal-container.dolly{cursor:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\"><mask id=\"a\" width=\"24\" height=\"24\" x=\"0\" y=\"0\" maskUnits=\"userSpaceOnUse\" style=\"mask-type:alpha\"><path fill=\"%23127392\" d=\"M0 0h24v24H0z\"/></mask><g mask=\"url(%23a)\"><path fill=\"%23000\" d=\"M12.002 20.575a1.026 1.026 0 0 1-.75-.325l-2.55-2.55a.933.933 0 0 1-.287-.713c.008-.275.113-.513.313-.713.2-.2.441-.3.725-.3.283 0 .524.1.724.3l.776.776V6.95l-.8.8c-.2.2-.438.296-.712.288a1.018 1.018 0 0 1-.713-.312c-.2-.2-.3-.442-.3-.726s.1-.525.3-.725l2.524-2.525a1.026 1.026 0 0 1 1.5 0l2.55 2.55c.2.2.296.438.289.713a1.023 1.023 0 0 1-.314.713c-.2.2-.441.3-.724.3a.988.988 0 0 1-.725-.3l-.775-.776v10.1l.8-.8c.2-.2.437-.296.712-.288.275.008.512.112.712.312.2.2.3.442.3.726s-.1.525-.3.725l-2.524 2.525a1.026 1.026 0 0 1-.75.325Z\"/><path stroke=\"%23fff\" stroke-opacity=\".7\" d=\"M13.553 8.153c.28.245.62.373 1 .373.415 0 .784-.153 1.078-.447.287-.287.446-.644.46-1.05v-.002a1.432 1.432 0 0 0-.435-1.08l-2.55-2.55-.354.353.354-.354a1.526 1.526 0 0 0-2.207 0L8.374 5.921A1.487 1.487 0 0 0 7.928 7c0 .416.152.785.446 1.08.288.287.645.446 1.052.457l4.127-.384Zm0 0v7.693m0-7.693a1.667 1.667 0 0 1-.079-.074l-3.021.075v7.693a1.482 1.482 0 0 0-1-.373c-.416 0-.785.153-1.079.447a1.522 1.522 0 0 0-.46 1.05v.002c-.011.417.14.786.435 1.08l2.55 2.55a1.527 1.527 0 0 0 2.207 0l2.525-2.524c.294-.294.446-.663.446-1.079 0-.416-.152-.785-.446-1.08a1.518 1.518 0 0 0-1.052-.457m0 0-.014.5.014-.5Zm0 0a1.424 1.424 0 0 0-1.027.383m0 0a1.583 1.583 0 0 0-.053.05l.354.354m-.3-.404v.104l.3.3m0 0-.3-.3v.6l.3-.3Z\"/></g></svg>%0A') 12 12,auto}.unreal-container.disabled:before{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}#playerUI{position:absolute;z-index:10;width:100%}#statsContainer{display:none;text-align:left;background-color:#000c}#stats{padding:6px;font-weight:700;font-size:14px;color:#0f0}canvas{position:absolute;image-rendering:crisp-edges}#overlay{position:absolute;top:0;right:2%;z-index:100;padding:4px;border-top-width:0;-webkit-border-bottom-right-radius:5px;-moz-border-radius-bottomright:5px;border-bottom-right-radius:5px;-webkit-border-bottom-left-radius:5px;-moz-border-radius-bottomleft:5px;border-bottom-left-radius:5px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none}.overlay{font-weight:lighter;font-family:var(--src-font-family-body)}#overlayButton:hover{cursor:pointer}#overlayButton{font-size:40px;text-align:right}#overlaySettings{display:none;width:300px;padding:4px}#videoMessageOverlay{position:absolute;z-index:20;width:100%;margin:auto;font-size:1.8em;font-family:var(--src-font-family-body)}#playButton{display:inline-block;height:auto}img#playButton{width:10%;max-width:241px}#UIInteraction{position:fixed}#UIInteractionButtonBoundary{padding:2px}#UIInteractionButton{cursor:pointer}#hiddenInput{position:absolute;left:-10%;width:0;opacity:0}#editTextButton{position:absolute;width:40px;height:40px}\n"] }]
+                    ], template: "<div class=\"frame unreal-container\">\r\n  <div #videoContainer id=\"player\"></div>\r\n\r\n  <app-intro-src />\r\n  <app-image-loading-src />\r\n  <app-resume-stream-button />\r\n  <app-unreal-status />\r\n  <app-freeze-frame />\r\n  <app-afk-timeout-modal />\r\n\r\n  <ng-content select=\"app-pdf\"></ng-content>\r\n  <ng-content select=\"app-show-case\"></ng-content>\r\n\r\n  @if (isDevMode) {\r\n    <app-video-stats />\r\n  }\r\n</div>\r\n", styles: [".unreal-container{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#fff}.unreal-container #player{position:absolute;width:100%;height:100%;display:flex;justify-content:center;align-items:center;overflow:hidden}.unreal-container.select{cursor:url('data:image/svg+xml,<svg width=\"24\" height=\"24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M15.15 21.375a1.423 1.423 0 0 1-1.15.063 1.487 1.487 0 0 1-.85-.788l-3-6.45-2.325 3.25c-.283.4-.658.525-1.125.375-.467-.15-.7-.466-.7-.95V4.05c0-.417.188-.717.563-.9.375-.183.729-.142 1.062.125l10.1 7.95c.383.284.496.65.337 1.1-.158.45-.479.675-.962.675h-4.2l2.975 6.375c.183.384.204.767.063 1.15a1.487 1.487 0 0 1-.788.85Z\" fill=\"%23000\"/><path d=\"m12.697 20.861.002.005c.237.495.617.852 1.128 1.04.515.191 1.039.16 1.539-.08a1.987 1.987 0 0 0 1.04-1.128 1.922 1.922 0 0 0-.079-1.536v-.003L13.684 13.5H17.1c.32 0 .628-.075.89-.26.263-.184.438-.447.544-.749.106-.3.135-.617.04-.925a1.458 1.458 0 0 0-.545-.738L7.936 2.883a1.51 1.51 0 0 0-.768-.336 1.471 1.471 0 0 0-.825.154 1.495 1.495 0 0 0-.626.547 1.492 1.492 0 0 0-.217.802v12.825c0 .324.08.634.272.897.193.261.467.43.775.53.31.099.632.12.942.016.31-.103.555-.313.743-.578h.001l1.825-2.552 2.639 5.673Z\" stroke=\"%23fff\" stroke-opacity=\".7\"/></svg>') 6 2,auto}.unreal-container.orbit{cursor:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\"><path fill=\"%23000\" d=\"M11.998 21.6c-1.966 0-3.737-.53-5.312-1.588-1.575-1.058-2.738-2.437-3.488-4.137a.852.852 0 0 1 .013-.713.867.867 0 0 1 .512-.487.86.86 0 0 1 .688.037c.225.109.387.28.487.513.617 1.35 1.559 2.45 2.825 3.3 1.267.85 2.692 1.275 4.275 1.275 1.384 0 2.646-.33 3.788-.988a7.985 7.985 0 0 0 2.762-2.612h-.85a.873.873 0 0 1-.64-.257.863.863 0 0 1-.26-.638.88.88 0 0 1 .26-.643.864.864 0 0 1 .64-.262h3c.255 0 .47.086.642.259a.87.87 0 0 1 .258.64v3a.874.874 0 0 1-.257.642.863.863 0 0 1-.637.259.88.88 0 0 1-.643-.259.865.865 0 0 1-.263-.641v-.725a9.95 9.95 0 0 1-3.35 2.925c-1.35.733-2.833 1.1-4.45 1.1Zm0-17.4c-1.383 0-2.645.33-3.787.987A7.985 7.985 0 0 0 5.448 7.8h.85c.255 0 .47.086.642.257a.863.863 0 0 1 .258.638.88.88 0 0 1-.258.642.864.864 0 0 1-.642.263h-3a.87.87 0 0 1-.64-.259.87.87 0 0 1-.26-.641v-3c0-.255.086-.469.258-.641a.863.863 0 0 1 .637-.26.88.88 0 0 1 .643.26.864.864 0 0 1 .262.64v.726A9.95 9.95 0 0 1 7.548 3.5c1.35-.733 2.834-1.1 4.45-1.1 2 0 3.788.542 5.363 1.625 1.575 1.083 2.736 2.49 3.482 4.22a.724.724 0 0 1-.045.646.926.926 0 0 1-.525.437.87.87 0 0 1-.687-.04.977.977 0 0 1-.488-.513c-.616-1.35-1.558-2.45-2.825-3.3-1.266-.85-2.691-1.275-4.275-1.275Zm0 10.8a2.893 2.893 0 0 1-2.125-.875A2.893 2.893 0 0 1 8.998 12c0-.833.292-1.542.875-2.125A2.893 2.893 0 0 1 11.998 9c.834 0 1.542.292 2.125.875.584.583.875 1.292.875 2.125s-.291 1.542-.875 2.125a2.893 2.893 0 0 1-2.125.875Z\"/><path stroke=\"%23fff\" stroke-opacity=\".7\" d=\"m2.739 16.072.002.005c.789 1.788 2.014 3.24 3.666 4.35 1.66 1.116 3.53 1.673 5.591 1.673 1.696 0 3.262-.386 4.69-1.16a10.54 10.54 0 0 0 2.714-2.097c.069.167.171.32.308.454.272.268.613.403.994.403.38 0 .722-.135.992-.406s.402-.614.402-.994v-3c0-.381-.134-.724-.405-.995a1.37 1.37 0 0 0-.995-.405h-3c-.383 0-.727.137-.997.411a1.38 1.38 0 0 0-.403.994c0 .38.135.723.407.992.238.237.532.369.858.397a7.552 7.552 0 0 1-2.027 1.685c-1.062.613-2.237.92-3.538.92-1.488 0-2.815-.397-3.996-1.19-1.19-.798-2.07-1.826-2.647-3.087-.147-.34-.393-.6-.727-.76a1.36 1.36 0 0 0-1.073-.058c-.37.133-.64.397-.8.754a1.351 1.351 0 0 0-.016 1.114Zm4.553-8.37a1.36 1.36 0 0 0-.858-.396A7.552 7.552 0 0 1 8.46 5.62c1.062-.613 2.237-.921 3.537-.921 1.489 0 2.816.398 3.997 1.19 1.19.8 2.07 1.827 2.646 3.088.148.34.394.6.728.76a1.37 1.37 0 0 0 1.068.063c.347-.12.62-.346.799-.668.187-.338.215-.71.072-1.072l-.003-.007-.003-.007c-.784-1.818-2.006-3.298-3.658-4.434C15.982 2.47 14.094 1.9 11.998 1.9c-1.695 0-3.261.385-4.688 1.16a10.536 10.536 0 0 0-2.715 2.096 1.364 1.364 0 0 0-.308-.453 1.38 1.38 0 0 0-.994-.403c-.38 0-.722.135-.992.406s-.403.614-.403.994v3c0 .38.135.724.406.995.27.27.614.405.994.405h3c.384 0 .727-.137.998-.412a1.38 1.38 0 0 0 .402-.993c0-.38-.135-.723-.406-.992ZM9.52 14.48a3.393 3.393 0 0 0 2.478 1.02c.965 0 1.8-.342 2.479-1.02a3.392 3.392 0 0 0 1.021-2.48c0-.963-.343-1.8-1.021-2.478A3.392 3.392 0 0 0 11.998 8.5c-.964 0-1.8.343-2.478 1.021A3.392 3.392 0 0 0 8.498 12c0 .964.344 1.8 1.022 2.479Z\"/></svg>') 12 12,auto}.unreal-container.pan{cursor:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\"><path fill=\"%23000\" d=\"M11.997 10.075a1.01 1.01 0 0 1-.738-.313 1.008 1.008 0 0 1-.312-.737V6.15l-.95.95a.998.998 0 0 1-.763.312 1.09 1.09 0 0 1-.763-.337 1.06 1.06 0 0 1-.324-.775c0-.3.108-.558.324-.775l2.776-2.775c.117-.116.237-.2.362-.25a1.04 1.04 0 0 1 .775 0c.125.05.246.134.363.25l2.8 2.8c.216.217.32.47.313.762a1.096 1.096 0 0 1-.338.763 1.058 1.058 0 0 1-.775.325c-.3 0-.558-.108-.775-.325l-.925-.925v2.875c0 .283-.104.53-.312.737a1.01 1.01 0 0 1-.738.313Zm0 11.5a1.04 1.04 0 0 1-.388-.075 1.103 1.103 0 0 1-.362-.25l-2.8-2.8a1.002 1.002 0 0 1-.313-.762c.009-.292.121-.546.337-.763.217-.217.475-.325.775-.325.3 0 .559.108.775.325l.926.925v-2.875c0-.283.104-.529.312-.737a1.01 1.01 0 0 1 .738-.313c.283 0 .529.104.738.313.208.208.312.454.312.737v2.875l.95-.95a.998.998 0 0 1 .762-.312c.292.008.546.12.763.337.216.217.324.475.324.775 0 .3-.108.559-.324.775l-2.775 2.775c-.117.116-.238.2-.363.25a1.04 1.04 0 0 1-.387.075Zm4.925-6.05a1.058 1.058 0 0 1-.326-.774c0-.3.109-.559.326-.776l.925-.925H14.97c-.283 0-.528-.104-.736-.312a1.01 1.01 0 0 1-.313-.738c0-.283.104-.53.313-.738.208-.208.453-.312.737-.312h2.875l-.95-.95a.998.998 0 0 1-.313-.762 1.09 1.09 0 0 1 .338-.764 1.06 1.06 0 0 1 .775-.324c.3 0 .558.108.775.324l2.774 2.776c.117.117.2.238.251.363a1.04 1.04 0 0 1 0 .775c-.05.124-.134.245-.25.362l-2.8 2.8c-.217.216-.471.32-.762.313a1.096 1.096 0 0 1-.763-.337Zm-11.4 0L2.746 12.75a1.103 1.103 0 0 1-.25-.362 1.04 1.04 0 0 1 0-.775c.05-.125.133-.246.25-.363l2.8-2.8c.216-.216.47-.32.762-.313.292.01.546.121.763.337.217.217.325.476.325.776 0 .3-.108.558-.325.775l-.925.925h2.875c.283 0 .529.104.737.312.208.209.313.455.313.738s-.105.53-.313.738a1.008 1.008 0 0 1-.737.312H6.147l.95.95c.217.217.32.471.312.762a1.09 1.09 0 0 1-.337.764 1.06 1.06 0 0 1-.775.324c-.3 0-.559-.108-.776-.324Z\"/><path stroke=\"%23fff\" stroke-opacity=\".7\" d=\"M9.22 7.912c.436.013.821-.15 1.13-.458l.097-.097v1.668c0 .422.16.793.458 1.09.298.299.67.46 1.092.46.422 0 .793-.161 1.091-.46.298-.297.459-.668.459-1.09V7.357l.071.072c.309.308.693.471 1.13.471.435 0 .82-.163 1.128-.471.301-.303.47-.676.483-1.102v-.001a1.501 1.501 0 0 0-.46-1.13l-2.799-2.8a1.6 1.6 0 0 0-.528-.36l-.003-.001a1.54 1.54 0 0 0-1.145 0l-.002.001a1.6 1.6 0 0 0-.529.36L8.118 5.172l-.001.001a1.56 1.56 0 0 0-.47 1.128c0 .435.163.82.47 1.128.303.303.676.472 1.103.484Zm0 0 .014-.5-.015.5Zm-1.311 6.865a1.497 1.497 0 0 0-.458-1.13l-.097-.097h1.668c.421 0 .793-.16 1.09-.458.298-.299.46-.67.46-1.092a1.51 1.51 0 0 0-.46-1.091 1.507 1.507 0 0 0-1.09-.459H7.354l.071-.072c.309-.308.472-.692.472-1.128 0-.436-.163-.82-.472-1.13a1.596 1.596 0 0 0-1.101-.482h-.002a1.501 1.501 0 0 0-1.129.459l-2.8 2.8a1.6 1.6 0 0 0-.36.528l-.001.003a1.54 1.54 0 0 0 0 1.144v.003c.081.2.208.375.362.529l2.774 2.775c.309.308.693.47 1.129.47.435 0 .82-.162 1.128-.47.303-.302.472-.676.484-1.102Zm0 0-.5-.014.5.015v-.001Zm3.038-8.627-.5.5.5.207V6.15Zm.475 15.814.002.001a1.54 1.54 0 0 0 1.145 0h.002c.2-.081.375-.208.53-.362l2.775-2.774a1.56 1.56 0 0 0 .47-1.129c0-.435-.162-.82-.47-1.128a1.589 1.589 0 0 0-1.103-.484 1.497 1.497 0 0 0-1.13.458l-.096.097v-1.668c0-.421-.161-.793-.459-1.09a1.509 1.509 0 0 0-1.091-.46c-.422 0-.794.161-1.092.46a1.507 1.507 0 0 0-.458 1.09v1.668l-.072-.072a1.558 1.558 0 0 0-1.129-.471c-.436 0-.82.163-1.128.471l-.001.001c-.301.302-.47.675-.483 1.101v.001c-.012.437.151.821.46 1.13l2.8 2.8c.153.153.328.28.528.36Zm5.146-6.085c.303.302.676.47 1.102.484a1.5 1.5 0 0 0 1.13-.46l2.8-2.8a1.6 1.6 0 0 0 .36-.528l.002-.003a1.54 1.54 0 0 0 0-1.144l-.001-.003a1.6 1.6 0 0 0-.361-.529l-2.774-2.775h-.001a1.56 1.56 0 0 0-1.128-.47c-.436 0-.82.162-1.128.47h-.001a1.59 1.59 0 0 0-.484 1.102c-.012.437.15.822.459 1.13l.097.097h-1.668c-.422 0-.793.16-1.09.459-.299.298-.46.67-.46 1.091 0 .422.161.793.46 1.092.297.297.668.458 1.09.458h1.668l-.072.072a1.558 1.558 0 0 0-.472 1.129c0 .435.164.82.472 1.128ZM6.147 13.05l.5.5.207-.5h-.707Z\"/></svg>') 12 12,auto}.unreal-container.dolly{cursor:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" fill=\"none\"><mask id=\"a\" width=\"24\" height=\"24\" x=\"0\" y=\"0\" maskUnits=\"userSpaceOnUse\" style=\"mask-type:alpha\"><path fill=\"%23127392\" d=\"M0 0h24v24H0z\"/></mask><g mask=\"url(%23a)\"><path fill=\"%23000\" d=\"M12.002 20.575a1.026 1.026 0 0 1-.75-.325l-2.55-2.55a.933.933 0 0 1-.287-.713c.008-.275.113-.513.313-.713.2-.2.441-.3.725-.3.283 0 .524.1.724.3l.776.776V6.95l-.8.8c-.2.2-.438.296-.712.288a1.018 1.018 0 0 1-.713-.312c-.2-.2-.3-.442-.3-.726s.1-.525.3-.725l2.524-2.525a1.026 1.026 0 0 1 1.5 0l2.55 2.55c.2.2.296.438.289.713a1.023 1.023 0 0 1-.314.713c-.2.2-.441.3-.724.3a.988.988 0 0 1-.725-.3l-.775-.776v10.1l.8-.8c.2-.2.437-.296.712-.288.275.008.512.112.712.312.2.2.3.442.3.726s-.1.525-.3.725l-2.524 2.525a1.026 1.026 0 0 1-.75.325Z\"/><path stroke=\"%23fff\" stroke-opacity=\".7\" d=\"M13.553 8.153c.28.245.62.373 1 .373.415 0 .784-.153 1.078-.447.287-.287.446-.644.46-1.05v-.002a1.432 1.432 0 0 0-.435-1.08l-2.55-2.55-.354.353.354-.354a1.526 1.526 0 0 0-2.207 0L8.374 5.921A1.487 1.487 0 0 0 7.928 7c0 .416.152.785.446 1.08.288.287.645.446 1.052.457l4.127-.384Zm0 0v7.693m0-7.693a1.667 1.667 0 0 1-.079-.074l-3.021.075v7.693a1.482 1.482 0 0 0-1-.373c-.416 0-.785.153-1.079.447a1.522 1.522 0 0 0-.46 1.05v.002c-.011.417.14.786.435 1.08l2.55 2.55a1.527 1.527 0 0 0 2.207 0l2.525-2.524c.294-.294.446-.663.446-1.079 0-.416-.152-.785-.446-1.08a1.518 1.518 0 0 0-1.052-.457m0 0-.014.5.014-.5Zm0 0a1.424 1.424 0 0 0-1.027.383m0 0a1.583 1.583 0 0 0-.053.05l.354.354m-.3-.404v.104l.3.3m0 0-.3-.3v.6l.3-.3Z\"/></g></svg>%0D%0A') 12 12,auto}.unreal-container.disabled:before{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}#playerUI{position:absolute;z-index:10;width:100%}#statsContainer{display:none;text-align:left;background-color:#000c}#stats{padding:6px;font-weight:700;font-size:14px;color:#0f0}canvas{position:absolute;image-rendering:crisp-edges}#overlay{position:absolute;top:0;right:2%;z-index:100;padding:4px;border-top-width:0;-webkit-border-bottom-right-radius:5px;-moz-border-radius-bottomright:5px;border-bottom-right-radius:5px;-webkit-border-bottom-left-radius:5px;-moz-border-radius-bottomleft:5px;border-bottom-left-radius:5px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none}.overlay{font-weight:lighter;font-family:var(--src-font-family-body)}#overlayButton:hover{cursor:pointer}#overlayButton{font-size:40px;text-align:right}#overlaySettings{display:none;width:300px;padding:4px}#videoMessageOverlay{position:absolute;z-index:20;width:100%;margin:auto;font-size:1.8em;font-family:var(--src-font-family-body)}#playButton{display:inline-block;height:auto}img#playButton{width:10%;max-width:241px}#UIInteraction{position:fixed}#UIInteractionButtonBoundary{padding:2px}#UIInteractionButton{cursor:pointer}#hiddenInput{position:absolute;left:-10%;width:0;opacity:0}#editTextButton{position:absolute;width:40px;height:40px}\n"] }]
         }], ctorParameters: () => [], propDecorators: { useContainerAsSizeProvider: [{ type: i0.Input, args: [{ isSignal: true, alias: "useContainerAsSizeProvider", required: false }] }], isStudio: [{ type: i0.Input, args: [{ isSignal: true, alias: "isStudio", required: false }] }], resolutionSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "resolutionSize", required: false }] }], changeMouseOverScene: [{ type: i0.Output, args: ["changeMouseOverScene"] }], videoElement: [{ type: i0.ViewChild, args: ['videoContainer', { isSignal: true }] }], onMouseOver: [{
                 type: HostListener,
                 args: ['mouseover']
@@ -7408,11 +7839,11 @@ class FilterSettingsComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: FilterSettingsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.4", type: FilterSettingsComponent, isStandalone: true, selector: "app-filter-settings", ngImport: i0, template: "<div class=\"settings-container\">\n  <button (click)=\"togglePanel()\" class=\"gear-button\">LBM</button>\n  @if (settings.panelOpen) {\n    <div class=\"settings-panel\">\n      <h3>LBM Trigger Settings</h3>\n      <h5>Data Flow Monitor</h5>\n      <form>\n        <label>\n          Monitoring delay:\n          <input\n            [(ngModel)]=\"settings.monitoringDelayTime\"\n            [placeholder]=\"defaultFilterModel.monitoringDelayTime\"\n            type=\"number\"\n            name=\"monitoringDelayTime\"\n          />\n        </label>\n\n        <label>\n          Minimum Bitrate (kbit/s):\n          <input\n            [(ngModel)]=\"settings.minimumBitrate\"\n            [placeholder]=\"defaultFilterModel.minimumBitrate\"\n            type=\"number\"\n            name=\"minimumBitrate\"\n          />\n        </label>\n        <label>\n          Yellow Flag (%):\n          <input\n            [(ngModel)]=\"settings.yellowFlag\"\n            [placeholder]=\"defaultFilterModel.yellowFlag\"\n            type=\"number\"\n            name=\"yellowFlag\"\n          />\n        </label>\n        <label>\n          Red Flag (%):\n          <input\n            [(ngModel)]=\"settings.redFlag\"\n            [placeholder]=\"defaultFilterModel.redFlag\"\n            type=\"number\"\n            name=\"redFlag\"\n          />\n        </label>\n        <label>\n          Minimum FPS:\n          <input\n            [(ngModel)]=\"settings.minimumFps\"\n            [placeholder]=\"defaultFilterModel.minimumFps\"\n            type=\"number\"\n            name=\"minimumFps\"\n          />\n        </label>\n        <hr />\n        <h5>Kalman Filter</h5>\n        <label>\n          Initial Bitrate Estimate (kbit/s):\n          <input\n            [(ngModel)]=\"settings.initialBitrateEstimate\"\n            [placeholder]=\"defaultFilterModel.initialBitrateEstimate\"\n            type=\"number\"\n            name=\"initialBitrateEstimate\"\n          />\n        </label>\n        <label>\n          Initial Error Covariance:\n          <input\n            [(ngModel)]=\"settings.initialErrorCovariance\"\n            [placeholder]=\"defaultFilterModel.initialErrorCovariance\"\n            type=\"number\"\n            name=\"initialErrorCovariance\"\n          />\n        </label>\n        <label>\n          Process Noise (Q):\n          <input\n            [(ngModel)]=\"settings.processNoise\"\n            [placeholder]=\"defaultFilterModel.processNoise\"\n            type=\"number\"\n            name=\"processNoise\"\n          />\n        </label>\n        <label>\n          Measurement Noise (R):\n          <input\n            [(ngModel)]=\"settings.measurementNoise\"\n            [placeholder]=\"defaultFilterModel.measurementNoise\"\n            type=\"number\"\n            name=\"measurementNoise\"\n          />\n        </label>\n      </form>\n      <br />\n      <br />\n      <div class=\"apply-button-container\">\n        <button (click)=\"reset()\">Reset</button>\n        <button (click)=\"saveSettings()\">Apply</button>\n      </div>\n    </div>\n  }\n</div>\n", styles: [".settings-container{position:absolute;top:65px;right:10px;z-index:1000}.gear-button{right:0;width:50px;position:absolute;cursor:pointer;font-size:10px;background:none;font-weight:500;border:1px solid;border-radius:9px;background:#0162cc;color:#fff;padding:4px}.gear-button>*{color:#e6f419;filter:drop-shadow(1px 1px 1px rgb(0,0,0))}.settings-panel{font-size:13px;background:#fff;border:1px solid #ccc;padding:15px;margin-top:25px;border-radius:4px;box-shadow:0 2px 8px #0003}.settings-panel h3{margin-top:0}.settings-panel form{display:flex;flex-direction:column}.settings-panel label{margin-bottom:10px;display:flex;flex-direction:column}.settings-panel input{padding:4px;margin-top:4px;border:1px solid #ccc;border-radius:2px}.apply-button-container{position:absolute;bottom:15px;right:15px}.apply-button-container button{padding:6px 12px;border:none;background-color:#1976d2;color:#fff;border-radius:4px;cursor:pointer;margin:2px}.apply-button-container button:hover{background-color:#1565c0}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NumberValueAccessor, selector: "input[type=number]:not([ngNoCva])[formControlName],input[type=number]:not([ngNoCva])[formControl],input[type=number]:not([ngNoCva])[ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]):not([formArray]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.4", type: FilterSettingsComponent, isStandalone: true, selector: "app-filter-settings", ngImport: i0, template: "<div class=\"settings-container\">\r\n  <button (click)=\"togglePanel()\" class=\"gear-button\">LBM</button>\r\n  @if (settings.panelOpen) {\r\n    <div class=\"settings-panel\">\r\n      <h3>LBM Trigger Settings</h3>\r\n      <h5>Data Flow Monitor</h5>\r\n      <form>\r\n        <label>\r\n          Monitoring delay:\r\n          <input\r\n            [(ngModel)]=\"settings.monitoringDelayTime\"\r\n            [placeholder]=\"defaultFilterModel.monitoringDelayTime\"\r\n            type=\"number\"\r\n            name=\"monitoringDelayTime\"\r\n          />\r\n        </label>\r\n\r\n        <label>\r\n          Minimum Bitrate (kbit/s):\r\n          <input\r\n            [(ngModel)]=\"settings.minimumBitrate\"\r\n            [placeholder]=\"defaultFilterModel.minimumBitrate\"\r\n            type=\"number\"\r\n            name=\"minimumBitrate\"\r\n          />\r\n        </label>\r\n        <label>\r\n          Yellow Flag (%):\r\n          <input\r\n            [(ngModel)]=\"settings.yellowFlag\"\r\n            [placeholder]=\"defaultFilterModel.yellowFlag\"\r\n            type=\"number\"\r\n            name=\"yellowFlag\"\r\n          />\r\n        </label>\r\n        <label>\r\n          Red Flag (%):\r\n          <input\r\n            [(ngModel)]=\"settings.redFlag\"\r\n            [placeholder]=\"defaultFilterModel.redFlag\"\r\n            type=\"number\"\r\n            name=\"redFlag\"\r\n          />\r\n        </label>\r\n        <label>\r\n          Minimum FPS:\r\n          <input\r\n            [(ngModel)]=\"settings.minimumFps\"\r\n            [placeholder]=\"defaultFilterModel.minimumFps\"\r\n            type=\"number\"\r\n            name=\"minimumFps\"\r\n          />\r\n        </label>\r\n        <hr />\r\n        <h5>Kalman Filter</h5>\r\n        <label>\r\n          Initial Bitrate Estimate (kbit/s):\r\n          <input\r\n            [(ngModel)]=\"settings.initialBitrateEstimate\"\r\n            [placeholder]=\"defaultFilterModel.initialBitrateEstimate\"\r\n            type=\"number\"\r\n            name=\"initialBitrateEstimate\"\r\n          />\r\n        </label>\r\n        <label>\r\n          Initial Error Covariance:\r\n          <input\r\n            [(ngModel)]=\"settings.initialErrorCovariance\"\r\n            [placeholder]=\"defaultFilterModel.initialErrorCovariance\"\r\n            type=\"number\"\r\n            name=\"initialErrorCovariance\"\r\n          />\r\n        </label>\r\n        <label>\r\n          Process Noise (Q):\r\n          <input\r\n            [(ngModel)]=\"settings.processNoise\"\r\n            [placeholder]=\"defaultFilterModel.processNoise\"\r\n            type=\"number\"\r\n            name=\"processNoise\"\r\n          />\r\n        </label>\r\n        <label>\r\n          Measurement Noise (R):\r\n          <input\r\n            [(ngModel)]=\"settings.measurementNoise\"\r\n            [placeholder]=\"defaultFilterModel.measurementNoise\"\r\n            type=\"number\"\r\n            name=\"measurementNoise\"\r\n          />\r\n        </label>\r\n      </form>\r\n      <br />\r\n      <br />\r\n      <div class=\"apply-button-container\">\r\n        <button (click)=\"reset()\">Reset</button>\r\n        <button (click)=\"saveSettings()\">Apply</button>\r\n      </div>\r\n    </div>\r\n  }\r\n</div>\r\n", styles: [".settings-container{position:absolute;top:65px;right:10px;z-index:1000}.gear-button{right:0;width:50px;position:absolute;cursor:pointer;font-size:10px;background:none;font-weight:500;border:1px solid;border-radius:9px;background:#0162cc;color:#fff;padding:4px}.gear-button>*{color:#e6f419;filter:drop-shadow(1px 1px 1px rgb(0,0,0))}.settings-panel{font-size:13px;background:#fff;border:1px solid #ccc;padding:15px;margin-top:25px;border-radius:4px;box-shadow:0 2px 8px #0003}.settings-panel h3{margin-top:0}.settings-panel form{display:flex;flex-direction:column}.settings-panel label{margin-bottom:10px;display:flex;flex-direction:column}.settings-panel input{padding:4px;margin-top:4px;border:1px solid #ccc;border-radius:2px}.apply-button-container{position:absolute;bottom:15px;right:15px}.apply-button-container button{padding:6px 12px;border:none;background-color:#1976d2;color:#fff;border-radius:4px;cursor:pointer;margin:2px}.apply-button-container button:hover{background-color:#1565c0}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NumberValueAccessor, selector: "input[type=number]:not([ngNoCva])[formControlName],input[type=number]:not([ngNoCva])[formControl],input[type=number]:not([ngNoCva])[ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]):not([formArray]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: FilterSettingsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-filter-settings', imports: [FormsModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"settings-container\">\n  <button (click)=\"togglePanel()\" class=\"gear-button\">LBM</button>\n  @if (settings.panelOpen) {\n    <div class=\"settings-panel\">\n      <h3>LBM Trigger Settings</h3>\n      <h5>Data Flow Monitor</h5>\n      <form>\n        <label>\n          Monitoring delay:\n          <input\n            [(ngModel)]=\"settings.monitoringDelayTime\"\n            [placeholder]=\"defaultFilterModel.monitoringDelayTime\"\n            type=\"number\"\n            name=\"monitoringDelayTime\"\n          />\n        </label>\n\n        <label>\n          Minimum Bitrate (kbit/s):\n          <input\n            [(ngModel)]=\"settings.minimumBitrate\"\n            [placeholder]=\"defaultFilterModel.minimumBitrate\"\n            type=\"number\"\n            name=\"minimumBitrate\"\n          />\n        </label>\n        <label>\n          Yellow Flag (%):\n          <input\n            [(ngModel)]=\"settings.yellowFlag\"\n            [placeholder]=\"defaultFilterModel.yellowFlag\"\n            type=\"number\"\n            name=\"yellowFlag\"\n          />\n        </label>\n        <label>\n          Red Flag (%):\n          <input\n            [(ngModel)]=\"settings.redFlag\"\n            [placeholder]=\"defaultFilterModel.redFlag\"\n            type=\"number\"\n            name=\"redFlag\"\n          />\n        </label>\n        <label>\n          Minimum FPS:\n          <input\n            [(ngModel)]=\"settings.minimumFps\"\n            [placeholder]=\"defaultFilterModel.minimumFps\"\n            type=\"number\"\n            name=\"minimumFps\"\n          />\n        </label>\n        <hr />\n        <h5>Kalman Filter</h5>\n        <label>\n          Initial Bitrate Estimate (kbit/s):\n          <input\n            [(ngModel)]=\"settings.initialBitrateEstimate\"\n            [placeholder]=\"defaultFilterModel.initialBitrateEstimate\"\n            type=\"number\"\n            name=\"initialBitrateEstimate\"\n          />\n        </label>\n        <label>\n          Initial Error Covariance:\n          <input\n            [(ngModel)]=\"settings.initialErrorCovariance\"\n            [placeholder]=\"defaultFilterModel.initialErrorCovariance\"\n            type=\"number\"\n            name=\"initialErrorCovariance\"\n          />\n        </label>\n        <label>\n          Process Noise (Q):\n          <input\n            [(ngModel)]=\"settings.processNoise\"\n            [placeholder]=\"defaultFilterModel.processNoise\"\n            type=\"number\"\n            name=\"processNoise\"\n          />\n        </label>\n        <label>\n          Measurement Noise (R):\n          <input\n            [(ngModel)]=\"settings.measurementNoise\"\n            [placeholder]=\"defaultFilterModel.measurementNoise\"\n            type=\"number\"\n            name=\"measurementNoise\"\n          />\n        </label>\n      </form>\n      <br />\n      <br />\n      <div class=\"apply-button-container\">\n        <button (click)=\"reset()\">Reset</button>\n        <button (click)=\"saveSettings()\">Apply</button>\n      </div>\n    </div>\n  }\n</div>\n", styles: [".settings-container{position:absolute;top:65px;right:10px;z-index:1000}.gear-button{right:0;width:50px;position:absolute;cursor:pointer;font-size:10px;background:none;font-weight:500;border:1px solid;border-radius:9px;background:#0162cc;color:#fff;padding:4px}.gear-button>*{color:#e6f419;filter:drop-shadow(1px 1px 1px rgb(0,0,0))}.settings-panel{font-size:13px;background:#fff;border:1px solid #ccc;padding:15px;margin-top:25px;border-radius:4px;box-shadow:0 2px 8px #0003}.settings-panel h3{margin-top:0}.settings-panel form{display:flex;flex-direction:column}.settings-panel label{margin-bottom:10px;display:flex;flex-direction:column}.settings-panel input{padding:4px;margin-top:4px;border:1px solid #ccc;border-radius:2px}.apply-button-container{position:absolute;bottom:15px;right:15px}.apply-button-container button{padding:6px 12px;border:none;background-color:#1976d2;color:#fff;border-radius:4px;cursor:pointer;margin:2px}.apply-button-container button:hover{background-color:#1565c0}\n"] }]
+            args: [{ selector: 'app-filter-settings', imports: [FormsModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"settings-container\">\r\n  <button (click)=\"togglePanel()\" class=\"gear-button\">LBM</button>\r\n  @if (settings.panelOpen) {\r\n    <div class=\"settings-panel\">\r\n      <h3>LBM Trigger Settings</h3>\r\n      <h5>Data Flow Monitor</h5>\r\n      <form>\r\n        <label>\r\n          Monitoring delay:\r\n          <input\r\n            [(ngModel)]=\"settings.monitoringDelayTime\"\r\n            [placeholder]=\"defaultFilterModel.monitoringDelayTime\"\r\n            type=\"number\"\r\n            name=\"monitoringDelayTime\"\r\n          />\r\n        </label>\r\n\r\n        <label>\r\n          Minimum Bitrate (kbit/s):\r\n          <input\r\n            [(ngModel)]=\"settings.minimumBitrate\"\r\n            [placeholder]=\"defaultFilterModel.minimumBitrate\"\r\n            type=\"number\"\r\n            name=\"minimumBitrate\"\r\n          />\r\n        </label>\r\n        <label>\r\n          Yellow Flag (%):\r\n          <input\r\n            [(ngModel)]=\"settings.yellowFlag\"\r\n            [placeholder]=\"defaultFilterModel.yellowFlag\"\r\n            type=\"number\"\r\n            name=\"yellowFlag\"\r\n          />\r\n        </label>\r\n        <label>\r\n          Red Flag (%):\r\n          <input\r\n            [(ngModel)]=\"settings.redFlag\"\r\n            [placeholder]=\"defaultFilterModel.redFlag\"\r\n            type=\"number\"\r\n            name=\"redFlag\"\r\n          />\r\n        </label>\r\n        <label>\r\n          Minimum FPS:\r\n          <input\r\n            [(ngModel)]=\"settings.minimumFps\"\r\n            [placeholder]=\"defaultFilterModel.minimumFps\"\r\n            type=\"number\"\r\n            name=\"minimumFps\"\r\n          />\r\n        </label>\r\n        <hr />\r\n        <h5>Kalman Filter</h5>\r\n        <label>\r\n          Initial Bitrate Estimate (kbit/s):\r\n          <input\r\n            [(ngModel)]=\"settings.initialBitrateEstimate\"\r\n            [placeholder]=\"defaultFilterModel.initialBitrateEstimate\"\r\n            type=\"number\"\r\n            name=\"initialBitrateEstimate\"\r\n          />\r\n        </label>\r\n        <label>\r\n          Initial Error Covariance:\r\n          <input\r\n            [(ngModel)]=\"settings.initialErrorCovariance\"\r\n            [placeholder]=\"defaultFilterModel.initialErrorCovariance\"\r\n            type=\"number\"\r\n            name=\"initialErrorCovariance\"\r\n          />\r\n        </label>\r\n        <label>\r\n          Process Noise (Q):\r\n          <input\r\n            [(ngModel)]=\"settings.processNoise\"\r\n            [placeholder]=\"defaultFilterModel.processNoise\"\r\n            type=\"number\"\r\n            name=\"processNoise\"\r\n          />\r\n        </label>\r\n        <label>\r\n          Measurement Noise (R):\r\n          <input\r\n            [(ngModel)]=\"settings.measurementNoise\"\r\n            [placeholder]=\"defaultFilterModel.measurementNoise\"\r\n            type=\"number\"\r\n            name=\"measurementNoise\"\r\n          />\r\n        </label>\r\n      </form>\r\n      <br />\r\n      <br />\r\n      <div class=\"apply-button-container\">\r\n        <button (click)=\"reset()\">Reset</button>\r\n        <button (click)=\"saveSettings()\">Apply</button>\r\n      </div>\r\n    </div>\r\n  }\r\n</div>\r\n", styles: [".settings-container{position:absolute;top:65px;right:10px;z-index:1000}.gear-button{right:0;width:50px;position:absolute;cursor:pointer;font-size:10px;background:none;font-weight:500;border:1px solid;border-radius:9px;background:#0162cc;color:#fff;padding:4px}.gear-button>*{color:#e6f419;filter:drop-shadow(1px 1px 1px rgb(0,0,0))}.settings-panel{font-size:13px;background:#fff;border:1px solid #ccc;padding:15px;margin-top:25px;border-radius:4px;box-shadow:0 2px 8px #0003}.settings-panel h3{margin-top:0}.settings-panel form{display:flex;flex-direction:column}.settings-panel label{margin-bottom:10px;display:flex;flex-direction:column}.settings-panel input{padding:4px;margin-top:4px;border:1px solid #ccc;border-radius:2px}.apply-button-container{position:absolute;bottom:15px;right:15px}.apply-button-container button{padding:6px 12px;border:none;background-color:#1976d2;color:#fff;border-radius:4px;cursor:pointer;margin:2px}.apply-button-container button:hover{background-color:#1565c0}\n"] }]
         }] });
 
 class LowBandwidthDetectorComponent {
@@ -7524,11 +7955,11 @@ class LowBandwidthDetectorComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: LowBandwidthDetectorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.4", type: LowBandwidthDetectorComponent, isStandalone: true, selector: "app-low-bandwidth-detector", ngImport: i0, template: "@if (isReducedQuality() || isLowBandwidth()) {\n  <div\n    [class.expanded]=\"isIndicatorExpanded() && isLowBandwidth()\"\n    class=\"lbm-indicator freeze-loader\"\n  >\n    <div (click)=\"toggleIndicator(true)\" class=\"lbm-icon\">\n      <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 20 20\">\n        <path\n          fill=\"#85888E\"\n          d=\"M7.189 3.605c-.73.145-1.438.35-2.126.614A14.412 14.412 0 0 0 .896 6.666a1.08 1.08 0 0 0-.375.844c0 .34.118.629.354.865s.524.36.865.375c.34.014.65-.09.927-.313a11.89 11.89 0 0 1 3.385-1.916 10.94 10.94 0 0 1 1.235-.375l-.098-2.541ZM7.385 8.708a9.107 9.107 0 0 0-2.906 1.48c-.264.194-.402.464-.416.812-.014.347.104.646.354.896.236.236.524.364.864.385.34.02.664-.073.97-.281.422-.29.878-.53 1.368-.721a2.545 2.545 0 0 1-.166-.814l-.068-1.757ZM12.386 11.267c.094-.25.15-.52.161-.802l.068-1.755a9.019 9.019 0 0 1 2.927 1.52c.264.193.4.46.406.801.007.34-.114.635-.364.885a1.213 1.213 0 0 1-.865.365A1.614 1.614 0 0 1 13.77 12a6.574 6.574 0 0 0-1.385-.733ZM12.713 6.146l.098-2.542c.73.146 1.438.351 2.127.615 1.541.59 2.93 1.406 4.166 2.447.25.223.379.5.386.834.007.333-.115.625-.365.875a1.253 1.253 0 0 1-.864.375c-.34.014-.65-.09-.927-.313a11.892 11.892 0 0 0-3.386-1.916 10.94 10.94 0 0 0-1.235-.375ZM8.813 16.187c.32.32.715.48 1.187.48.472 0 .868-.16 1.188-.48.32-.32.479-.715.479-1.187 0-.473-.16-.868-.48-1.188-.319-.32-.715-.479-1.187-.479-.472 0-.868.16-1.187.48-.32.319-.48.714-.48 1.187 0 .472.16.868.48 1.187Z\"\n        />\n        <path\n          fill=\"#fff\"\n          fill-rule=\"evenodd\"\n          d=\"M10 .833c-.91 0-1.637.756-1.602 1.665l.304 7.92a1.299 1.299 0 0 0 2.596 0l.305-7.92A1.604 1.604 0 0 0 10 .833ZM8.813 16.187c.32.32.715.48 1.187.48.472 0 .868-.16 1.188-.48.32-.32.479-.715.479-1.187 0-.473-.16-.868-.48-1.188-.319-.32-.715-.479-1.187-.479-.472 0-.868.16-1.187.48-.32.319-.48.714-.48 1.187 0 .472.16.868.48 1.187Z\"\n          clip-rule=\"evenodd\"\n        />\n      </svg>\n    </div>\n\n    <div\n      [class.lbm-message--open]=\"isLowBandwidth() && isIndicatorExpanded()\"\n      class=\"lbm-message\"\n    >\n      <p class=\"lbm-description\">\n        Fluid Interactivity Modes were disabled due to an unstable connection.\n\n        <button\n          (click)=\"openLBMDialog()\"\n          [attr.data-testid]=\"'learn-more-lbm'\"\n          type=\"button\"\n          class=\"lbm-learn-more\"\n        >\n          Learn more\n        </button>\n      </p>\n      <button\n        (click)=\"toggleIndicator(false)\"\n        [attr.data-testid]=\"'close-lbm-indicator'\"\n        type=\"button\"\n        class=\"lbm-close\"\n      >\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          width=\"20\"\n          height=\"20\"\n          viewBox=\"0 0 20 20\"\n          fill=\"none\"\n        >\n          <path\n            d=\"M10.0001 11.2289L6.68618 14.5428C6.51951 14.7095 6.31818 14.7895 6.08218 14.7828C5.84618 14.7755 5.64485 14.6885 5.47818 14.5218C5.31151 14.3552 5.22818 14.1505 5.22818 13.9078C5.22818 13.6645 5.31151 13.4595 5.47818 13.2928L8.77107 9.99992L5.45718 6.68603C5.29051 6.51936 5.21051 6.3147 5.21718 6.07203C5.22451 5.8287 5.31151 5.6237 5.47818 5.45703C5.64485 5.29036 5.84951 5.20703 6.09218 5.20703C6.33551 5.20703 6.54051 5.29036 6.70718 5.45703L10.0001 8.77092L13.314 5.45703C13.4806 5.29036 13.6853 5.20703 13.928 5.20703C14.1713 5.20703 14.3763 5.29036 14.543 5.45703C14.7096 5.6237 14.793 5.8287 14.793 6.07203C14.793 6.3147 14.7096 6.51936 14.543 6.68603L11.2291 9.99992L14.543 13.3138C14.7096 13.4805 14.793 13.6818 14.793 13.9178C14.793 14.1538 14.7096 14.3552 14.543 14.5218C14.3763 14.6885 14.1713 14.7718 13.928 14.7718C13.6853 14.7718 13.4806 14.6885 13.314 14.5218L10.0001 11.2289Z\"\n            fill=\"white\"\n          />\n        </svg>\n      </button>\n    </div>\n  </div>\n}\n\n@if (isDevMode) {\n  <app-filter-settings />\n}\n", styles: [".freeze-loader,.lbm-indicator{--lbmPositionTop: 18px;--lbmPositionLeft: 18px;--lbmPositionRight: 18px;--lbmIndicatorSize: 36px;--lbmIndicatorBorderRadius: 8px;--lbmIndicatorCloseSize: 20px;--lbmPadding: 10px;--lbmTextSize: 13px;--lbmLineHeight: 20px;--lbmTextColor: #ffffff;--lbmBackgroundColor: rgba(17, 24, 39, .7);position:absolute;top:var(--lbmPositionTop);left:var(--lbmPositionLeft);z-index:10;display:flex;justify-content:center;align-items:flex-start;min-width:var(--lbmIndicatorSize);min-height:var(--lbmIndicatorSize);overflow:hidden}.freeze-loader.expanded,.lbm-indicator.expanded{--lbmPositionTop: 8px;--lbmPositionLeft: 8px;--lbmPositionRight: 8px;width:auto;max-width:calc(100% - var(--lbmPositionLeft) - var(--lbmPositionRight));padding:var(--lbmPadding);background:var(--lbmBackgroundColor);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:var(--lbmIndicatorBorderRadius);gap:12px}.freeze-loader .lbm-icon,.lbm-indicator .lbm-icon{display:flex;width:var(--lbmIndicatorSize);height:var(--lbmIndicatorSize);padding:8px;color:#fff;background-color:var(--lbmBackgroundColor);border-radius:50%;flex-shrink:0;cursor:pointer}.freeze-loader .lbm-icon svg,.freeze-loader .lbm-icon img,.lbm-indicator .lbm-icon svg,.lbm-indicator .lbm-icon img{width:100%;height:100%}.freeze-loader .lbm-close,.lbm-indicator .lbm-close{position:absolute;top:0;right:0;width:var(--lbmIndicatorCloseSize);height:var(--lbmIndicatorCloseSize);background-color:transparent;border:none;padding:0;cursor:pointer}.freeze-loader .lbm-message,.lbm-indicator .lbm-message{position:relative;opacity:0;height:0;max-width:0;padding-right:24px;pointer-events:none;visibility:hidden;animation:closeMessage .3s forwards}.freeze-loader .lbm-message--open,.lbm-indicator .lbm-message--open{position:relative;visibility:visible;display:flex;align-items:center;align-self:center;pointer-events:all;gap:12px;max-width:fit-content;height:auto;opacity:1;animation:openMessage .3s forwards}.freeze-loader .lbm-description,.lbm-indicator .lbm-description{margin:0;font-size:var(--lbmTextSize);font-weight:400;line-height:var(--lbmLineHeight);color:var(--lbmTextColor)}.freeze-loader .lbm-learn-more,.lbm-indicator .lbm-learn-more{display:inline-flex;padding:0;font-size:var(--lbmTextSize);font-weight:400;line-height:var(--lbmLineHeight);color:var(--lbmTextColor);text-decoration-line:underline;background-color:transparent;border:none;cursor:pointer}.freeze-loader .lbm-learn-more:hover,.lbm-indicator .lbm-learn-more:hover{text-decoration:none}@keyframes openMessage{0%{opacity:0;max-width:0;height:0}10%{height:auto;max-width:fit-content}to{opacity:1;height:auto;max-width:fit-content}}@keyframes closeMessage{0%{opacity:1;max-width:fit-content}to{opacity:0;max-width:0}}\n"], dependencies: [{ kind: "component", type: FilterSettingsComponent, selector: "app-filter-settings" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.4", type: LowBandwidthDetectorComponent, isStandalone: true, selector: "app-low-bandwidth-detector", ngImport: i0, template: "@if (isReducedQuality() || isLowBandwidth()) {\r\n  <div\r\n    [class.expanded]=\"isIndicatorExpanded() && isLowBandwidth()\"\r\n    class=\"lbm-indicator freeze-loader\"\r\n  >\r\n    <div (click)=\"toggleIndicator(true)\" class=\"lbm-icon\">\r\n      <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 20 20\">\r\n        <path\r\n          fill=\"#85888E\"\r\n          d=\"M7.189 3.605c-.73.145-1.438.35-2.126.614A14.412 14.412 0 0 0 .896 6.666a1.08 1.08 0 0 0-.375.844c0 .34.118.629.354.865s.524.36.865.375c.34.014.65-.09.927-.313a11.89 11.89 0 0 1 3.385-1.916 10.94 10.94 0 0 1 1.235-.375l-.098-2.541ZM7.385 8.708a9.107 9.107 0 0 0-2.906 1.48c-.264.194-.402.464-.416.812-.014.347.104.646.354.896.236.236.524.364.864.385.34.02.664-.073.97-.281.422-.29.878-.53 1.368-.721a2.545 2.545 0 0 1-.166-.814l-.068-1.757ZM12.386 11.267c.094-.25.15-.52.161-.802l.068-1.755a9.019 9.019 0 0 1 2.927 1.52c.264.193.4.46.406.801.007.34-.114.635-.364.885a1.213 1.213 0 0 1-.865.365A1.614 1.614 0 0 1 13.77 12a6.574 6.574 0 0 0-1.385-.733ZM12.713 6.146l.098-2.542c.73.146 1.438.351 2.127.615 1.541.59 2.93 1.406 4.166 2.447.25.223.379.5.386.834.007.333-.115.625-.365.875a1.253 1.253 0 0 1-.864.375c-.34.014-.65-.09-.927-.313a11.892 11.892 0 0 0-3.386-1.916 10.94 10.94 0 0 0-1.235-.375ZM8.813 16.187c.32.32.715.48 1.187.48.472 0 .868-.16 1.188-.48.32-.32.479-.715.479-1.187 0-.473-.16-.868-.48-1.188-.319-.32-.715-.479-1.187-.479-.472 0-.868.16-1.187.48-.32.319-.48.714-.48 1.187 0 .472.16.868.48 1.187Z\"\r\n        />\r\n        <path\r\n          fill=\"#fff\"\r\n          fill-rule=\"evenodd\"\r\n          d=\"M10 .833c-.91 0-1.637.756-1.602 1.665l.304 7.92a1.299 1.299 0 0 0 2.596 0l.305-7.92A1.604 1.604 0 0 0 10 .833ZM8.813 16.187c.32.32.715.48 1.187.48.472 0 .868-.16 1.188-.48.32-.32.479-.715.479-1.187 0-.473-.16-.868-.48-1.188-.319-.32-.715-.479-1.187-.479-.472 0-.868.16-1.187.48-.32.319-.48.714-.48 1.187 0 .472.16.868.48 1.187Z\"\r\n          clip-rule=\"evenodd\"\r\n        />\r\n      </svg>\r\n    </div>\r\n\r\n    <div\r\n      [class.lbm-message--open]=\"isLowBandwidth() && isIndicatorExpanded()\"\r\n      class=\"lbm-message\"\r\n    >\r\n      <p class=\"lbm-description\">\r\n        Fluid Interactivity Modes were disabled due to an unstable connection.\r\n\r\n        <button\r\n          (click)=\"openLBMDialog()\"\r\n          [attr.data-testid]=\"'learn-more-lbm'\"\r\n          type=\"button\"\r\n          class=\"lbm-learn-more\"\r\n        >\r\n          Learn more\r\n        </button>\r\n      </p>\r\n      <button\r\n        (click)=\"toggleIndicator(false)\"\r\n        [attr.data-testid]=\"'close-lbm-indicator'\"\r\n        type=\"button\"\r\n        class=\"lbm-close\"\r\n      >\r\n        <svg\r\n          xmlns=\"http://www.w3.org/2000/svg\"\r\n          width=\"20\"\r\n          height=\"20\"\r\n          viewBox=\"0 0 20 20\"\r\n          fill=\"none\"\r\n        >\r\n          <path\r\n            d=\"M10.0001 11.2289L6.68618 14.5428C6.51951 14.7095 6.31818 14.7895 6.08218 14.7828C5.84618 14.7755 5.64485 14.6885 5.47818 14.5218C5.31151 14.3552 5.22818 14.1505 5.22818 13.9078C5.22818 13.6645 5.31151 13.4595 5.47818 13.2928L8.77107 9.99992L5.45718 6.68603C5.29051 6.51936 5.21051 6.3147 5.21718 6.07203C5.22451 5.8287 5.31151 5.6237 5.47818 5.45703C5.64485 5.29036 5.84951 5.20703 6.09218 5.20703C6.33551 5.20703 6.54051 5.29036 6.70718 5.45703L10.0001 8.77092L13.314 5.45703C13.4806 5.29036 13.6853 5.20703 13.928 5.20703C14.1713 5.20703 14.3763 5.29036 14.543 5.45703C14.7096 5.6237 14.793 5.8287 14.793 6.07203C14.793 6.3147 14.7096 6.51936 14.543 6.68603L11.2291 9.99992L14.543 13.3138C14.7096 13.4805 14.793 13.6818 14.793 13.9178C14.793 14.1538 14.7096 14.3552 14.543 14.5218C14.3763 14.6885 14.1713 14.7718 13.928 14.7718C13.6853 14.7718 13.4806 14.6885 13.314 14.5218L10.0001 11.2289Z\"\r\n            fill=\"white\"\r\n          />\r\n        </svg>\r\n      </button>\r\n    </div>\r\n  </div>\r\n}\r\n\r\n@if (isDevMode) {\r\n  <app-filter-settings />\r\n}\r\n", styles: [".freeze-loader,.lbm-indicator{--lbmPositionTop: 18px;--lbmPositionLeft: 18px;--lbmPositionRight: 18px;--lbmIndicatorSize: 36px;--lbmIndicatorBorderRadius: 8px;--lbmIndicatorCloseSize: 20px;--lbmPadding: 10px;--lbmTextSize: 13px;--lbmLineHeight: 20px;--lbmTextColor: #ffffff;--lbmBackgroundColor: rgba(17, 24, 39, .7);position:absolute;top:var(--lbmPositionTop);left:var(--lbmPositionLeft);z-index:10;display:flex;justify-content:center;align-items:flex-start;min-width:var(--lbmIndicatorSize);min-height:var(--lbmIndicatorSize);overflow:hidden}.freeze-loader.expanded,.lbm-indicator.expanded{--lbmPositionTop: 8px;--lbmPositionLeft: 8px;--lbmPositionRight: 8px;width:auto;max-width:calc(100% - var(--lbmPositionLeft) - var(--lbmPositionRight));padding:var(--lbmPadding);background:var(--lbmBackgroundColor);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:var(--lbmIndicatorBorderRadius);gap:12px}.freeze-loader .lbm-icon,.lbm-indicator .lbm-icon{display:flex;width:var(--lbmIndicatorSize);height:var(--lbmIndicatorSize);padding:8px;color:#fff;background-color:var(--lbmBackgroundColor);border-radius:50%;flex-shrink:0;cursor:pointer}.freeze-loader .lbm-icon svg,.freeze-loader .lbm-icon img,.lbm-indicator .lbm-icon svg,.lbm-indicator .lbm-icon img{width:100%;height:100%}.freeze-loader .lbm-close,.lbm-indicator .lbm-close{position:absolute;top:0;right:0;width:var(--lbmIndicatorCloseSize);height:var(--lbmIndicatorCloseSize);background-color:transparent;border:none;padding:0;cursor:pointer}.freeze-loader .lbm-message,.lbm-indicator .lbm-message{position:relative;opacity:0;height:0;max-width:0;padding-right:24px;pointer-events:none;visibility:hidden;animation:closeMessage .3s forwards}.freeze-loader .lbm-message--open,.lbm-indicator .lbm-message--open{position:relative;visibility:visible;display:flex;align-items:center;align-self:center;pointer-events:all;gap:12px;max-width:fit-content;height:auto;opacity:1;animation:openMessage .3s forwards}.freeze-loader .lbm-description,.lbm-indicator .lbm-description{margin:0;font-size:var(--lbmTextSize);font-weight:400;line-height:var(--lbmLineHeight);color:var(--lbmTextColor)}.freeze-loader .lbm-learn-more,.lbm-indicator .lbm-learn-more{display:inline-flex;padding:0;font-size:var(--lbmTextSize);font-weight:400;line-height:var(--lbmLineHeight);color:var(--lbmTextColor);text-decoration-line:underline;background-color:transparent;border:none;cursor:pointer}.freeze-loader .lbm-learn-more:hover,.lbm-indicator .lbm-learn-more:hover{text-decoration:none}@keyframes openMessage{0%{opacity:0;max-width:0;height:0}10%{height:auto;max-width:fit-content}to{opacity:1;height:auto;max-width:fit-content}}@keyframes closeMessage{0%{opacity:1;max-width:fit-content}to{opacity:0;max-width:0}}\n"], dependencies: [{ kind: "component", type: FilterSettingsComponent, selector: "app-filter-settings" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.4", ngImport: i0, type: LowBandwidthDetectorComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-low-bandwidth-detector', changeDetection: ChangeDetectionStrategy.OnPush, imports: [FilterSettingsComponent], template: "@if (isReducedQuality() || isLowBandwidth()) {\n  <div\n    [class.expanded]=\"isIndicatorExpanded() && isLowBandwidth()\"\n    class=\"lbm-indicator freeze-loader\"\n  >\n    <div (click)=\"toggleIndicator(true)\" class=\"lbm-icon\">\n      <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 20 20\">\n        <path\n          fill=\"#85888E\"\n          d=\"M7.189 3.605c-.73.145-1.438.35-2.126.614A14.412 14.412 0 0 0 .896 6.666a1.08 1.08 0 0 0-.375.844c0 .34.118.629.354.865s.524.36.865.375c.34.014.65-.09.927-.313a11.89 11.89 0 0 1 3.385-1.916 10.94 10.94 0 0 1 1.235-.375l-.098-2.541ZM7.385 8.708a9.107 9.107 0 0 0-2.906 1.48c-.264.194-.402.464-.416.812-.014.347.104.646.354.896.236.236.524.364.864.385.34.02.664-.073.97-.281.422-.29.878-.53 1.368-.721a2.545 2.545 0 0 1-.166-.814l-.068-1.757ZM12.386 11.267c.094-.25.15-.52.161-.802l.068-1.755a9.019 9.019 0 0 1 2.927 1.52c.264.193.4.46.406.801.007.34-.114.635-.364.885a1.213 1.213 0 0 1-.865.365A1.614 1.614 0 0 1 13.77 12a6.574 6.574 0 0 0-1.385-.733ZM12.713 6.146l.098-2.542c.73.146 1.438.351 2.127.615 1.541.59 2.93 1.406 4.166 2.447.25.223.379.5.386.834.007.333-.115.625-.365.875a1.253 1.253 0 0 1-.864.375c-.34.014-.65-.09-.927-.313a11.892 11.892 0 0 0-3.386-1.916 10.94 10.94 0 0 0-1.235-.375ZM8.813 16.187c.32.32.715.48 1.187.48.472 0 .868-.16 1.188-.48.32-.32.479-.715.479-1.187 0-.473-.16-.868-.48-1.188-.319-.32-.715-.479-1.187-.479-.472 0-.868.16-1.187.48-.32.319-.48.714-.48 1.187 0 .472.16.868.48 1.187Z\"\n        />\n        <path\n          fill=\"#fff\"\n          fill-rule=\"evenodd\"\n          d=\"M10 .833c-.91 0-1.637.756-1.602 1.665l.304 7.92a1.299 1.299 0 0 0 2.596 0l.305-7.92A1.604 1.604 0 0 0 10 .833ZM8.813 16.187c.32.32.715.48 1.187.48.472 0 .868-.16 1.188-.48.32-.32.479-.715.479-1.187 0-.473-.16-.868-.48-1.188-.319-.32-.715-.479-1.187-.479-.472 0-.868.16-1.187.48-.32.319-.48.714-.48 1.187 0 .472.16.868.48 1.187Z\"\n          clip-rule=\"evenodd\"\n        />\n      </svg>\n    </div>\n\n    <div\n      [class.lbm-message--open]=\"isLowBandwidth() && isIndicatorExpanded()\"\n      class=\"lbm-message\"\n    >\n      <p class=\"lbm-description\">\n        Fluid Interactivity Modes were disabled due to an unstable connection.\n\n        <button\n          (click)=\"openLBMDialog()\"\n          [attr.data-testid]=\"'learn-more-lbm'\"\n          type=\"button\"\n          class=\"lbm-learn-more\"\n        >\n          Learn more\n        </button>\n      </p>\n      <button\n        (click)=\"toggleIndicator(false)\"\n        [attr.data-testid]=\"'close-lbm-indicator'\"\n        type=\"button\"\n        class=\"lbm-close\"\n      >\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          width=\"20\"\n          height=\"20\"\n          viewBox=\"0 0 20 20\"\n          fill=\"none\"\n        >\n          <path\n            d=\"M10.0001 11.2289L6.68618 14.5428C6.51951 14.7095 6.31818 14.7895 6.08218 14.7828C5.84618 14.7755 5.64485 14.6885 5.47818 14.5218C5.31151 14.3552 5.22818 14.1505 5.22818 13.9078C5.22818 13.6645 5.31151 13.4595 5.47818 13.2928L8.77107 9.99992L5.45718 6.68603C5.29051 6.51936 5.21051 6.3147 5.21718 6.07203C5.22451 5.8287 5.31151 5.6237 5.47818 5.45703C5.64485 5.29036 5.84951 5.20703 6.09218 5.20703C6.33551 5.20703 6.54051 5.29036 6.70718 5.45703L10.0001 8.77092L13.314 5.45703C13.4806 5.29036 13.6853 5.20703 13.928 5.20703C14.1713 5.20703 14.3763 5.29036 14.543 5.45703C14.7096 5.6237 14.793 5.8287 14.793 6.07203C14.793 6.3147 14.7096 6.51936 14.543 6.68603L11.2291 9.99992L14.543 13.3138C14.7096 13.4805 14.793 13.6818 14.793 13.9178C14.793 14.1538 14.7096 14.3552 14.543 14.5218C14.3763 14.6885 14.1713 14.7718 13.928 14.7718C13.6853 14.7718 13.4806 14.6885 13.314 14.5218L10.0001 11.2289Z\"\n            fill=\"white\"\n          />\n        </svg>\n      </button>\n    </div>\n  </div>\n}\n\n@if (isDevMode) {\n  <app-filter-settings />\n}\n", styles: [".freeze-loader,.lbm-indicator{--lbmPositionTop: 18px;--lbmPositionLeft: 18px;--lbmPositionRight: 18px;--lbmIndicatorSize: 36px;--lbmIndicatorBorderRadius: 8px;--lbmIndicatorCloseSize: 20px;--lbmPadding: 10px;--lbmTextSize: 13px;--lbmLineHeight: 20px;--lbmTextColor: #ffffff;--lbmBackgroundColor: rgba(17, 24, 39, .7);position:absolute;top:var(--lbmPositionTop);left:var(--lbmPositionLeft);z-index:10;display:flex;justify-content:center;align-items:flex-start;min-width:var(--lbmIndicatorSize);min-height:var(--lbmIndicatorSize);overflow:hidden}.freeze-loader.expanded,.lbm-indicator.expanded{--lbmPositionTop: 8px;--lbmPositionLeft: 8px;--lbmPositionRight: 8px;width:auto;max-width:calc(100% - var(--lbmPositionLeft) - var(--lbmPositionRight));padding:var(--lbmPadding);background:var(--lbmBackgroundColor);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:var(--lbmIndicatorBorderRadius);gap:12px}.freeze-loader .lbm-icon,.lbm-indicator .lbm-icon{display:flex;width:var(--lbmIndicatorSize);height:var(--lbmIndicatorSize);padding:8px;color:#fff;background-color:var(--lbmBackgroundColor);border-radius:50%;flex-shrink:0;cursor:pointer}.freeze-loader .lbm-icon svg,.freeze-loader .lbm-icon img,.lbm-indicator .lbm-icon svg,.lbm-indicator .lbm-icon img{width:100%;height:100%}.freeze-loader .lbm-close,.lbm-indicator .lbm-close{position:absolute;top:0;right:0;width:var(--lbmIndicatorCloseSize);height:var(--lbmIndicatorCloseSize);background-color:transparent;border:none;padding:0;cursor:pointer}.freeze-loader .lbm-message,.lbm-indicator .lbm-message{position:relative;opacity:0;height:0;max-width:0;padding-right:24px;pointer-events:none;visibility:hidden;animation:closeMessage .3s forwards}.freeze-loader .lbm-message--open,.lbm-indicator .lbm-message--open{position:relative;visibility:visible;display:flex;align-items:center;align-self:center;pointer-events:all;gap:12px;max-width:fit-content;height:auto;opacity:1;animation:openMessage .3s forwards}.freeze-loader .lbm-description,.lbm-indicator .lbm-description{margin:0;font-size:var(--lbmTextSize);font-weight:400;line-height:var(--lbmLineHeight);color:var(--lbmTextColor)}.freeze-loader .lbm-learn-more,.lbm-indicator .lbm-learn-more{display:inline-flex;padding:0;font-size:var(--lbmTextSize);font-weight:400;line-height:var(--lbmLineHeight);color:var(--lbmTextColor);text-decoration-line:underline;background-color:transparent;border:none;cursor:pointer}.freeze-loader .lbm-learn-more:hover,.lbm-indicator .lbm-learn-more:hover{text-decoration:none}@keyframes openMessage{0%{opacity:0;max-width:0;height:0}10%{height:auto;max-width:fit-content}to{opacity:1;height:auto;max-width:fit-content}}@keyframes closeMessage{0%{opacity:1;max-width:fit-content}to{opacity:0;max-width:0}}\n"] }]
+            args: [{ selector: 'app-low-bandwidth-detector', changeDetection: ChangeDetectionStrategy.OnPush, imports: [FilterSettingsComponent], template: "@if (isReducedQuality() || isLowBandwidth()) {\r\n  <div\r\n    [class.expanded]=\"isIndicatorExpanded() && isLowBandwidth()\"\r\n    class=\"lbm-indicator freeze-loader\"\r\n  >\r\n    <div (click)=\"toggleIndicator(true)\" class=\"lbm-icon\">\r\n      <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 20 20\">\r\n        <path\r\n          fill=\"#85888E\"\r\n          d=\"M7.189 3.605c-.73.145-1.438.35-2.126.614A14.412 14.412 0 0 0 .896 6.666a1.08 1.08 0 0 0-.375.844c0 .34.118.629.354.865s.524.36.865.375c.34.014.65-.09.927-.313a11.89 11.89 0 0 1 3.385-1.916 10.94 10.94 0 0 1 1.235-.375l-.098-2.541ZM7.385 8.708a9.107 9.107 0 0 0-2.906 1.48c-.264.194-.402.464-.416.812-.014.347.104.646.354.896.236.236.524.364.864.385.34.02.664-.073.97-.281.422-.29.878-.53 1.368-.721a2.545 2.545 0 0 1-.166-.814l-.068-1.757ZM12.386 11.267c.094-.25.15-.52.161-.802l.068-1.755a9.019 9.019 0 0 1 2.927 1.52c.264.193.4.46.406.801.007.34-.114.635-.364.885a1.213 1.213 0 0 1-.865.365A1.614 1.614 0 0 1 13.77 12a6.574 6.574 0 0 0-1.385-.733ZM12.713 6.146l.098-2.542c.73.146 1.438.351 2.127.615 1.541.59 2.93 1.406 4.166 2.447.25.223.379.5.386.834.007.333-.115.625-.365.875a1.253 1.253 0 0 1-.864.375c-.34.014-.65-.09-.927-.313a11.892 11.892 0 0 0-3.386-1.916 10.94 10.94 0 0 0-1.235-.375ZM8.813 16.187c.32.32.715.48 1.187.48.472 0 .868-.16 1.188-.48.32-.32.479-.715.479-1.187 0-.473-.16-.868-.48-1.188-.319-.32-.715-.479-1.187-.479-.472 0-.868.16-1.187.48-.32.319-.48.714-.48 1.187 0 .472.16.868.48 1.187Z\"\r\n        />\r\n        <path\r\n          fill=\"#fff\"\r\n          fill-rule=\"evenodd\"\r\n          d=\"M10 .833c-.91 0-1.637.756-1.602 1.665l.304 7.92a1.299 1.299 0 0 0 2.596 0l.305-7.92A1.604 1.604 0 0 0 10 .833ZM8.813 16.187c.32.32.715.48 1.187.48.472 0 .868-.16 1.188-.48.32-.32.479-.715.479-1.187 0-.473-.16-.868-.48-1.188-.319-.32-.715-.479-1.187-.479-.472 0-.868.16-1.187.48-.32.319-.48.714-.48 1.187 0 .472.16.868.48 1.187Z\"\r\n          clip-rule=\"evenodd\"\r\n        />\r\n      </svg>\r\n    </div>\r\n\r\n    <div\r\n      [class.lbm-message--open]=\"isLowBandwidth() && isIndicatorExpanded()\"\r\n      class=\"lbm-message\"\r\n    >\r\n      <p class=\"lbm-description\">\r\n        Fluid Interactivity Modes were disabled due to an unstable connection.\r\n\r\n        <button\r\n          (click)=\"openLBMDialog()\"\r\n          [attr.data-testid]=\"'learn-more-lbm'\"\r\n          type=\"button\"\r\n          class=\"lbm-learn-more\"\r\n        >\r\n          Learn more\r\n        </button>\r\n      </p>\r\n      <button\r\n        (click)=\"toggleIndicator(false)\"\r\n        [attr.data-testid]=\"'close-lbm-indicator'\"\r\n        type=\"button\"\r\n        class=\"lbm-close\"\r\n      >\r\n        <svg\r\n          xmlns=\"http://www.w3.org/2000/svg\"\r\n          width=\"20\"\r\n          height=\"20\"\r\n          viewBox=\"0 0 20 20\"\r\n          fill=\"none\"\r\n        >\r\n          <path\r\n            d=\"M10.0001 11.2289L6.68618 14.5428C6.51951 14.7095 6.31818 14.7895 6.08218 14.7828C5.84618 14.7755 5.64485 14.6885 5.47818 14.5218C5.31151 14.3552 5.22818 14.1505 5.22818 13.9078C5.22818 13.6645 5.31151 13.4595 5.47818 13.2928L8.77107 9.99992L5.45718 6.68603C5.29051 6.51936 5.21051 6.3147 5.21718 6.07203C5.22451 5.8287 5.31151 5.6237 5.47818 5.45703C5.64485 5.29036 5.84951 5.20703 6.09218 5.20703C6.33551 5.20703 6.54051 5.29036 6.70718 5.45703L10.0001 8.77092L13.314 5.45703C13.4806 5.29036 13.6853 5.20703 13.928 5.20703C14.1713 5.20703 14.3763 5.29036 14.543 5.45703C14.7096 5.6237 14.793 5.8287 14.793 6.07203C14.793 6.3147 14.7096 6.51936 14.543 6.68603L11.2291 9.99992L14.543 13.3138C14.7096 13.4805 14.793 13.6818 14.793 13.9178C14.793 14.1538 14.7096 14.3552 14.543 14.5218C14.3763 14.6885 14.1713 14.7718 13.928 14.7718C13.6853 14.7718 13.4806 14.6885 13.314 14.5218L10.0001 11.2289Z\"\r\n            fill=\"white\"\r\n          />\r\n        </svg>\r\n      </button>\r\n    </div>\r\n  </div>\r\n}\r\n\r\n@if (isDevMode) {\r\n  <app-filter-settings />\r\n}\r\n", styles: [".freeze-loader,.lbm-indicator{--lbmPositionTop: 18px;--lbmPositionLeft: 18px;--lbmPositionRight: 18px;--lbmIndicatorSize: 36px;--lbmIndicatorBorderRadius: 8px;--lbmIndicatorCloseSize: 20px;--lbmPadding: 10px;--lbmTextSize: 13px;--lbmLineHeight: 20px;--lbmTextColor: #ffffff;--lbmBackgroundColor: rgba(17, 24, 39, .7);position:absolute;top:var(--lbmPositionTop);left:var(--lbmPositionLeft);z-index:10;display:flex;justify-content:center;align-items:flex-start;min-width:var(--lbmIndicatorSize);min-height:var(--lbmIndicatorSize);overflow:hidden}.freeze-loader.expanded,.lbm-indicator.expanded{--lbmPositionTop: 8px;--lbmPositionLeft: 8px;--lbmPositionRight: 8px;width:auto;max-width:calc(100% - var(--lbmPositionLeft) - var(--lbmPositionRight));padding:var(--lbmPadding);background:var(--lbmBackgroundColor);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:var(--lbmIndicatorBorderRadius);gap:12px}.freeze-loader .lbm-icon,.lbm-indicator .lbm-icon{display:flex;width:var(--lbmIndicatorSize);height:var(--lbmIndicatorSize);padding:8px;color:#fff;background-color:var(--lbmBackgroundColor);border-radius:50%;flex-shrink:0;cursor:pointer}.freeze-loader .lbm-icon svg,.freeze-loader .lbm-icon img,.lbm-indicator .lbm-icon svg,.lbm-indicator .lbm-icon img{width:100%;height:100%}.freeze-loader .lbm-close,.lbm-indicator .lbm-close{position:absolute;top:0;right:0;width:var(--lbmIndicatorCloseSize);height:var(--lbmIndicatorCloseSize);background-color:transparent;border:none;padding:0;cursor:pointer}.freeze-loader .lbm-message,.lbm-indicator .lbm-message{position:relative;opacity:0;height:0;max-width:0;padding-right:24px;pointer-events:none;visibility:hidden;animation:closeMessage .3s forwards}.freeze-loader .lbm-message--open,.lbm-indicator .lbm-message--open{position:relative;visibility:visible;display:flex;align-items:center;align-self:center;pointer-events:all;gap:12px;max-width:fit-content;height:auto;opacity:1;animation:openMessage .3s forwards}.freeze-loader .lbm-description,.lbm-indicator .lbm-description{margin:0;font-size:var(--lbmTextSize);font-weight:400;line-height:var(--lbmLineHeight);color:var(--lbmTextColor)}.freeze-loader .lbm-learn-more,.lbm-indicator .lbm-learn-more{display:inline-flex;padding:0;font-size:var(--lbmTextSize);font-weight:400;line-height:var(--lbmLineHeight);color:var(--lbmTextColor);text-decoration-line:underline;background-color:transparent;border:none;cursor:pointer}.freeze-loader .lbm-learn-more:hover,.lbm-indicator .lbm-learn-more:hover{text-decoration:none}@keyframes openMessage{0%{opacity:0;max-width:0;height:0}10%{height:auto;max-width:fit-content}to{opacity:1;height:auto;max-width:fit-content}}@keyframes closeMessage{0%{opacity:1;max-width:fit-content}to{opacity:0;max-width:0}}\n"] }]
         }] });
 
 /**
@@ -7577,5 +8008,5 @@ function provideUnrealModule() {
  * Generated bundle index. Do not edit.
  */
 
-export { AFKService, AUTO_HIGH_RESOLUTION_IDLE_MS, AfkTimeoutModalComponent, AggregatorService, AnalyticsService, AnswerHandler, CommandTelemetryService, ConfigHandler, ConsoleExtensionsService, ControlScheme, DATA_CHANNEL_CONNECTION_TIMEOUT, DEBOUNCE_TO_MANY_RESIZE_CALLS, DEFAULT_AFK_TIMEOUT, DEFAULT_AFK_TIMEOUT_PERIOD, DEFAULT_RECONNECT_DELAY_MS, DEFAULT_RECONNECT_ENABLED, DEFAULT_RECONNECT_MAX_ATTEMPTS, DEFAULT_RECONNECT_ON_DATACHANNEL_CLOSE, DEFAULT_RECONNECT_ON_ICE_FAILURE, DESTROY_DISCONNECT_REASONS, DataFlowMonitor, DevModeService, DisconnectReason, FULL_HD_HEIGHT, FULL_HD_WIDTH, FileHandlerService, FileReceiverService, FilterSettingsComponent, FpsMonitorService, FreezeFrameComponent, FreezeFrameService, INNER_RETRY_LIMIT, IceCandidateHandler, ImageLoadingSrcComponent, InputOptions, InputService, InstanceReadyHandler, InstanceReservedHandler, IntroSrcComponent, KalmanFilter1D, LatencyTimings, LoadingProgressService, LowBandwidthDetectorComponent, LowBandwidthModalComponent, MINIMAL_FPS, MIN_CONTAINER_SIZE, MessageType, MouseButton, MouseButtonsMask, OUTER_RETRY_DELAY, OnCloseHandler, OnErrorHandler, OnMessageHandler, OnOpenHandler, OrchestrationMessageTypes, POLLING_TIME, PingHandler, PlayerCountHandler, REGION_PING_ACCURATE_SAMPLES, REGION_PING_BACKGROUND_REFRESH_DELAY_MS, REGION_PING_CACHE_KEY, REGION_PING_CACHE_TTL_MS, REGION_PING_WARMUP_DEADLINE_MS, RegionsPingService, SAME_SIZE_THRESHOLD, SCREEN_LOCKER_CONTAINER_ID, SIGNALLING_PERCENT_VALUE, SSInfoHandler, STREAMING_AUDIO_ID, STREAMING_VIDEO_ID, SafePipe, SignallingService, SpecialKeyCodes, StatGraphComponent, StreamStatusTelemetryService, StreamStatusTelemetryService2, SubService, ToClientMessage, UNREAL_CONFIG, UnrealCallbackService, UnrealCommunicatorService, UnrealEffects, UnrealSceneComponent, UnrealStatusMessage, VideoService, VideoStatsComponent, WSCloseCode_CIRRUS_ABNORMAL_CLOSURE, WSCloseCode_CIRRUS_MAX_PLAYERS_ERROR, WSCloseCode_CIRRUS_PLAYER_DISCONNECTED, WSCloseCode_CIRRUS_STREAMER_KIKED_PLAYER, WSCloseCode_FORCE_CIRRUS_CLOSE, WSCloseCode_NORMAL_AFK_TIMEOUT, WSCloseCode_NORMAL_CLOSURE, WSCloseCode_NORMAL_MANUAL_DISCONNECT, WSCloseCode_UNKNOWN, WSCloseCodes, WS_OPEN_STATE, WS_RETRY_PER_INSTANCE, WS_TIMEOUT, WebRtcPlayerService, WebrtcErrorModalComponent, abortEstablishingConnection, answerSent, changeStatusMainVideoOnScene, changeStreamResolutionAction, commandCompleted, commandStarted, dataChannelConnected, dataChannelReady, decodeData, destroyRemoteConnections, destroyUnrealScene, disconnectStream, dispatchResize, dropConnection, dropDC, dropPC, floatToPercents, floatToSmoothPercents, forceResizeViewport, fromResizeObserver, getActiveUrl, getImageFromVideoStream, getResizeStudioValues, getResizeValuesUniversal, getRtcErrorMessage, iceConnectionFailed, initSignalling, instanceReady, keepMaxUntilReset, makeEven, pollingEnded, pollingStarted, provideUnrealModule, provideUnrealState, qpToQuality, reconnectPeer, reconnectPeerFailed, reconnectPeerSuccess, regionPingFetchEnd, regionPingFetchStart, regionResolved, resetAfk, resetConfig, resetDataChannelForReconnect, resetIntroSrc, resetUserInactivityTimeout, resetWarnTimeout, saveAnalyticsEvent, selectCirrusConnectionId, selectClientAndViewIds, selectCommandProgress, selectFreezeFrameCombinedDataUrl, selectFreezeFrameDataUrl, selectFreezeFrameDataUrlFromVideo, selectFreezeFrameProgressMessageFromVideo, selectIsAutostart, selectIsExistMatchUrls, selectIsFreezeFrameLoading, selectIsFullyConnected, selectIsLoaderScreenVisible, selectIsVideoPlayingAndDataChannelConnected, selectShowLoader, selectShowReconnectPopup, selectSignalingParameters, selectStreamConfig, selectTotalProgress, selectUserInactivityDetected, selectWarnTimeout, setAfkTimerCountdown, setAfkTimerHide, setAfkTimerVisible, setAwsInstance, setCirrusConnected, setCirrusDisconnected, setConfig, setEstablishingConnection, setFreezeFrame, setFreezeFrameFromVideo, setIntroImageSrc, setIntroVideoSrc, setLoadingImageSrc, setLoopBackCommandIsCompleted, setMaxFps, setOrchestrationContext, setOrchestrationMessage, setOrchestrationParameters, setOrchestrationProgress, setSignalingName, setStatusMessage, setStatusPercentSignallingServer, setStreamClientCompanyId, setStreamViewId, setUnrealPlaywrightConfig, setUserInactivityTimeout, setViewportNotReady, setViewportReady, showLoadingProgress, showResumeStreamPopup, showUnrealErrorMessage, showUserInactivityTimeoutPopup, signalingRetryAttempted, smoothTransition, startStream, trackMixpanelEvent, trackTelemetryData, uint8ToBase64, unrealCommandCallback, unrealFeature, unrealReducer, updateCirrusInfo, videoAdaptedToContainer, videoStreamInitialized };
+export { AFKService, AUTO_HIGH_RESOLUTION_IDLE_MS, AfkTimeoutModalComponent, AggregatorService, AnalyticsService, AnswerHandler, CommandTelemetryService, ConfigHandler, ConsoleExtensionsService, ControlScheme, DATA_CHANNEL_CONNECTION_TIMEOUT, DEBOUNCE_TO_MANY_RESIZE_CALLS, DEFAULT_AFK_TIMEOUT, DEFAULT_AFK_TIMEOUT_PERIOD, DESTROY_DISCONNECT_REASONS, DataFlowMonitor, DevModeService, DisconnectReason, FULL_HD_HEIGHT, FULL_HD_WIDTH, FileHandlerService, FileReceiverService, FilterSettingsComponent, FpsMonitorService, FreezeFrameComponent, FreezeFrameService, INNER_RETRY_LIMIT, IceCandidateHandler, ImageLoadingSrcComponent, InputOptions, InputService, InstanceReadyHandler, InstanceReservedHandler, IntroSrcComponent, KalmanFilter1D, LatencyTimings, LoadingProgressService, LowBandwidthDetectorComponent, LowBandwidthModalComponent, MINIMAL_FPS, MIN_CONTAINER_SIZE, MessageType, MouseButton, MouseButtonsMask, OUTER_RETRY_DELAY, OnCloseHandler, OnErrorHandler, OnMessageHandler, OnOpenHandler, OrchestrationMessageTypes, POLLING_TIME, PingHandler, PlayerCountHandler, RECONNECT_CONFIG, REGION_PING_ACCURATE_SAMPLES, REGION_PING_BACKGROUND_REFRESH_DELAY_MS, REGION_PING_CACHE_KEY, REGION_PING_CACHE_TTL_MS, REGION_PING_WARMUP_DEADLINE_MS, RegionsPingService, SAME_SIZE_THRESHOLD, SCREEN_LOCKER_CONTAINER_ID, SIGNALLING_PERCENT_VALUE, SSInfoHandler, STREAMING_AUDIO_ID, STREAMING_VIDEO_ID, SafePipe, SignallingService, SpecialKeyCodes, StatGraphComponent, StreamAdoptionService, StreamStatusTelemetryService, StreamStatusTelemetryService2, SubService, ToClientMessage, UNREAL_CONFIG, UnrealCallbackService, UnrealCommunicatorService, UnrealEffects, UnrealSceneComponent, UnrealStatusMessage, VideoService, VideoStatsComponent, WSCloseCode_CIRRUS_ABNORMAL_CLOSURE, WSCloseCode_CIRRUS_MAX_PLAYERS_ERROR, WSCloseCode_CIRRUS_PLAYER_DISCONNECTED, WSCloseCode_CIRRUS_STREAMER_KIKED_PLAYER, WSCloseCode_FORCE_CIRRUS_CLOSE, WSCloseCode_NORMAL_AFK_TIMEOUT, WSCloseCode_NORMAL_CLOSURE, WSCloseCode_NORMAL_MANUAL_DISCONNECT, WSCloseCode_UNKNOWN, WSCloseCodes, WS_OPEN_STATE, WS_RETRY_PER_INSTANCE, WS_TIMEOUT, WebRtcPlayerService, WebrtcErrorModalComponent, abortEstablishingConnection, answerSent, changeStatusMainVideoOnScene, changeStreamResolutionAction, commandCompleted, commandStarted, dataChannelConnected, dataChannelReady, decodeData, destroyRemoteConnections, destroyUnrealScene, disconnectStream, dispatchResize, dropConnection, dropDC, dropPC, floatToPercents, floatToSmoothPercents, forceResizeViewport, fromResizeObserver, getActiveUrl, getImageFromVideoStream, getResizeStudioValues, getResizeValuesUniversal, getRtcErrorMessage, iceConnectionFailed, initSignalling, instanceReady, keepMaxUntilReset, makeEven, pollingEnded, pollingStarted, provideUnrealModule, provideUnrealState, qpToQuality, reconnectPeer, reconnectPeerFailed, reconnectPeerSuccess, regionPingFetchEnd, regionPingFetchStart, regionResolved, resetAfk, resetConfig, resetDataChannelForReconnect, resetIntroSrc, resetUserInactivityTimeout, resetWarnTimeout, saveAnalyticsEvent, selectCirrusConnectionId, selectClientAndViewIds, selectCommandProgress, selectFreezeFrameCombinedDataUrl, selectFreezeFrameDataUrl, selectFreezeFrameDataUrlFromVideo, selectFreezeFrameProgressMessageFromVideo, selectIsAutostart, selectIsExistMatchUrls, selectIsFreezeFrameLoading, selectIsFullyConnected, selectIsLoaderScreenVisible, selectIsVideoPlayingAndDataChannelConnected, selectShowLoader, selectShowReconnectPopup, selectSignalingParameters, selectStreamConfig, selectTotalProgress, selectUserInactivityDetected, selectWarnTimeout, setAfkTimerCountdown, setAfkTimerHide, setAfkTimerVisible, setAwsInstance, setCirrusConnected, setCirrusDisconnected, setConfig, setEstablishingConnection, setFreezeFrame, setFreezeFrameFromVideo, setIntroImageSrc, setIntroVideoSrc, setLoadingImageSrc, setLoopBackCommandIsCompleted, setMaxFps, setOrchestrationContext, setOrchestrationMessage, setOrchestrationParameters, setOrchestrationProgress, setSignalingName, setStatusMessage, setStatusPercentSignallingServer, setStreamClientCompanyId, setStreamViewId, setUnrealPlaywrightConfig, setUserInactivityTimeout, setViewportNotReady, setViewportReady, showLoadingProgress, showResumeStreamPopup, showUnrealErrorMessage, showUserInactivityTimeoutPopup, signalingRetryAttempted, smoothTransition, startStream, streamAdopted, trackMixpanelEvent, trackTelemetryData, uint8ToBase64, unrealCommandCallback, unrealFeature, unrealReducer, updateCirrusInfo, videoAdaptedToContainer, videoStreamInitialized };
 //# sourceMappingURL=3dsource-angular-unreal-module.mjs.map