@franzzemen/brokenstock-shell 0.8.1 → 0.9.0

package/fesm2022/franzzemen-brokenstock-shell.mjs

@@ -1,12 +1,12 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, makeEnvironmentProviders, signal, computed, Injectable, inject, input, Directive, isDevMode, effect, untracked, HostListener, ViewChild, ViewEncapsulation, ChangeDetectionStrategy, Component, DestroyRef, NgZone, viewChild, afterNextRender, linkedSignal } from '@angular/core';
+import { InjectionToken, makeEnvironmentProviders, signal, computed, Injectable, inject, input, Directive, isDevMode, effect, untracked, HostListener, ViewChild, ViewEncapsulation, ChangeDetectionStrategy, Component, DestroyRef, NgZone, viewChild, afterNextRender, output } from '@angular/core';
 import * as i2$1 from '@angular/router';
 import { Router, RouterLink, RouterLinkActive, ActivatedRoute, RouterOutlet } from '@angular/router';
 import { BEARER_TOKEN_REGEX, HttpHeader, USERNAME_REGEX, PASSWORD_REGEX } from '@franzzemen/utility';
 import { validateCredentials } from '@franzzemen/identity';
-import { HttpClient } from '@angular/common/http';
-import { catchError, from, switchMap, throwError, firstValueFrom } from 'rxjs';
-import * as i3 from '@angular/forms';
+import { HttpClient, HttpErrorResponse } from '@angular/common/http';
+import { firstValueFrom, catchError, from, switchMap, throwError } from 'rxjs';
+import * as i1$2 from '@angular/forms';
 import { NG_VALIDATORS, FormsModule } from '@angular/forms';
 import { Marked } from 'marked';
 import { gfmHeadingId } from 'marked-gfm-heading-id';
@@ -23,14 +23,14 @@ import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
 import { CdkTrapFocus } from '@angular/cdk/a11y';
 import * as i5 from '@angular/cdk/text-field';
 import { TextFieldModule } from '@angular/cdk/text-field';
-import { MatFormField, MatLabel } from '@angular/material/form-field';
+import { MatFormField, MatLabel, MatFormFieldModule } from '@angular/material/form-field';
 import * as i4 from '@angular/material/input';
 import { MatInput, MatInputModule } from '@angular/material/input';
 import * as i6 from '@angular/material/button';
 import { MatButtonModule } from '@angular/material/button';
 import * as i7 from '@angular/material/checkbox';
 import { MatCheckboxModule } from '@angular/material/checkbox';
-import * as i1$2 from '@angular/material/dialog';
+import * as i2$2 from '@angular/material/dialog';
 import { MAT_DIALOG_DATA, MatDialogRef, MatDialogModule } from '@angular/material/dialog';
 
 /**
@@ -342,6 +342,77 @@ function decideRenewal(before, current) {
     return 'renew';
 }
 
+/*
+Created by Franz Zemen 2026-10-17
+License Type: UNLICENSED
+
+Authenticator sign-in — what the browser sees (authenticator-sign-in.prd.md).
+*/
+/**
+ * The one message for a pause (D8). The server sends no time and the screen invents none.
+ */
+const TOO_MANY_ATTEMPTS = 'Too many attempts.';
+/** Plain words for each refusal, shown on the sign-in screen and in the code dialog. */
+function authenticatorMessage(reason) {
+    switch (reason) {
+        case 'code-required': return 'Enter the 6-digit code from your authenticator app.';
+        case 'invalid-code': return 'That code did not work. Try the current one.';
+        case 'too-many-attempts': return TOO_MANY_ATTEMPTS;
+        case 'authenticator-not-set-up': return 'This account has no authenticator set up. Ask the administrator to reset it.';
+        case 'setup-required': return 'Scan this QR code with your authenticator app, then enter the 6-digit code it shows.';
+        default: return 'Unable to sign in';
+    }
+}
+/** The text file the Download button saves (D7). */
+function recoveryCodesFile(appName, username, codes, now = new Date()) {
+    return [
+        `${appName} recovery codes${username ? ` for ${username}` : ''}`,
+        `Generated ${now.toISOString()}`,
+        '',
+        'Each code works once, in place of the 6-digit code from your authenticator app.',
+        'Keep this file somewhere safe and offline. Anyone with these codes and your password can sign in.',
+        '',
+        ...codes,
+        '',
+    ].join('\n');
+}
+
+/**
+ * A refusal from an authenticator route, carrying the server's `reason`
+ * (authenticator-sign-in.prd.md). `message` is plain words for the screen.
+ */
+class AuthenticatorError extends Error {
+    constructor(reason, message, status) {
+        super(message);
+        this.reason = reason;
+        this.status = status;
+        this.name = 'AuthenticatorError';
+    }
+}
+/** Sign-in rejected because the next step is a code (or setting one up), not because anything failed. */
+const CODE_STEP = 'code-step';
+/**
+ * The sign-in request body, exactly as sent (multiple-devices E8, authenticator-sign-in.prd.md).
+ *
+ * Fields appear only when they carry a decision: the route's body schema is strict,
+ * and `additional: false` on a first attempt would be a statement where silence is
+ * meant. A code typed now wins; otherwise a ticket from a 409 that followed a
+ * correct code stands in for it (the server accepts a code only once, D20).
+ */
+function buildLoginBody(credentials, force, options, signInTicket) {
+    const proof = options.code
+        ? { code: options.code }
+        : options.recoveryCode
+            ? { recoveryCode: options.recoveryCode }
+            : signInTicket ? { signInTicket } : {};
+    return {
+        ...credentials,
+        ...(force ? { force: true } : {}),
+        ...(options.additional ? { additional: true } : {}),
+        ...(options.endSessionIds?.length ? { endSessionIds: options.endSessionIds } : {}),
+        ...proof,
+    };
+}
 /** Name of the cross-window renewal lock (PRD D5). */
 const RENEWAL_LOCK = 'brokenstock.session.renew';
 /** How long a window waits for the renewing window to publish a token (PRD D5). */
@@ -349,6 +420,11 @@ const PEER_RENEWAL_WAIT_MS = 10_000;
 /** How long the renewal request itself may take before it is abandoned (PRD D5). */
 const RENEWAL_TIMEOUT_MS = 15_000;
 class AuthenticationService {
+    /**
+     * The ticket from a 409 that followed a correct code. The retry sends it in place
+     * of the code, which the server will not accept twice (D20). Never shown.
+     */
+    #signInTicket;
     #refreshing;
     #auth;
     #httpClient;
@@ -381,6 +457,25 @@ class AuthenticationService {
         ...(ngDevMode ? [{ debugName: "additionalSignInAllowed" }] : /* istanbul ignore next */ []));
         this.pendingCredentials = signal(undefined, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "pendingCredentials" }] : /* istanbul ignore next */ []));
+        // ----- Authenticator (authenticator-sign-in.prd.md) -----
+        /** The extra step the sign-in screen is on after the password was accepted. */
+        this.codeStep = signal('none', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "codeStep" }] : /* istanbul ignore next */ []));
+        /** Inside an AWS-opened setup window: the QR and key to show (D9, D10). */
+        this.setupChallenge = signal(undefined, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "setupChallenge" }] : /* istanbul ignore next */ []));
+        /** New recovery codes to show ONCE, with a Download button (D7). Cleared when acknowledged. */
+        this.recoveryCodesToShow = signal(undefined, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "recoveryCodesToShow" }] : /* istanbul ignore next */ []));
+        /** Recovery codes left, from the last sign-in or status read. */
+        this.recoveryCodesLeft = signal(undefined, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "recoveryCodesLeft" }] : /* istanbul ignore next */ []));
+        /**
+         * Whether the AWS-set bypass is on for this account (D12). Drives the banner on
+         * every screen. Yes/no only: the server never says when it ends.
+         */
+        this.bypassActive = signal(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "bypassActive" }] : /* istanbul ignore next */ []));
         this.#refreshing = null;
         this.#auth = 'Bearer ..';
         this.#httpClient = inject(HttpClient);
@@ -471,6 +566,18 @@ class AuthenticationService {
         this.conflictSessions.set(undefined);
         this.additionalSignInAllowed.set(false);
         this.pendingCredentials.set(undefined);
+        this.#signInTicket = undefined;
+    }
+    /** Back to the password form from the code or setup step. */
+    cancelCodeStep() {
+        this.codeStep.set('none');
+        this.setupChallenge.set(undefined);
+        this.pendingCredentials.set(undefined);
+        this.#signInTicket = undefined;
+    }
+    /** The new recovery codes have been seen (and, we hope, downloaded). */
+    acknowledgeRecoveryCodes() {
+        this.recoveryCodesToShow.set(undefined);
     }
     /**
      * The session is gone and cannot be recovered — renewal failed permanently,
@@ -527,15 +634,7 @@ class AuthenticationService {
         this.#thinkingService.startThinking();
         return new Promise((resolve, reject) => {
             this.authenticating.set(true);
-            // Fields are added only when they carry a decision. The route's body
-            // schema is strict, and sending `additional: false` on a first attempt
-            // would be a statement where silence is meant.
-            const body = {
-                ...credentials,
-                ...(force ? { force: true } : {}),
-                ...(options.additional ? { additional: true } : {}),
-                ...(options.endSessionIds?.length ? { endSessionIds: options.endSessionIds } : {}),
-            };
+            const body = buildLoginBody(credentials, force, options, this.#signInTicket);
             const subscription = this.#httpClient
                 .post(this.#authUrls.login, body, {
                 headers: {
@@ -559,6 +658,14 @@ class AuthenticationService {
                             return;
                         }
                         this.#adoptToken(auth);
+                        const authenticator = response.body.authenticator;
+                        this.recoveryCodesLeft.set(authenticator?.recoveryCodesLeft);
+                        this.bypassActive.set(authenticator?.bypassActive === true);
+                        if (authenticator?.recoveryCodes?.length)
+                            this.recoveryCodesToShow.set(authenticator.recoveryCodes);
+                        this.codeStep.set('none');
+                        this.setupChallenge.set(undefined);
+                        this.#signInTicket = undefined;
                         this.authenticated.set(true);
                         this.pendingCredentials.set(undefined);
                         resolve();
@@ -574,7 +681,17 @@ class AuthenticationService {
                 },
                 error: (err) => {
                     try {
+                        const reason = err.error?.reason;
                         if (err.status === 409) {
+                            // After a correct code: the retry carries this instead (D20), and
+                            // new recovery codes from a setup must not be lost to this panel.
+                            if (typeof err.error?.signInTicket === 'string')
+                                this.#signInTicket = err.error.signInTicket;
+                            if (Array.isArray(err.error?.recoveryCodes))
+                                this.recoveryCodesToShow.set(err.error.recoveryCodes);
+                            // The code is done; the session choice is all that is left on screen.
+                            this.codeStep.set('none');
+                            this.setupChallenge.set(undefined);
                             this.conflictSessions.set(err.error?.activeSessions ?? []);
                             // Absent means false: an older back end that does not send this
                             // does not permit signing in alongside, so the screen must not
@@ -583,6 +700,27 @@ class AuthenticationService {
                             this.pendingCredentials.set(credentials);
                             reject('conflict');
                         }
+                        else if (reason === 'code-required') {
+                            this.codeStep.set('code');
+                            this.pendingCredentials.set(credentials);
+                            reject(CODE_STEP);
+                        }
+                        else if (reason === 'setup-required') {
+                            this.codeStep.set('setup');
+                            this.setupChallenge.set({ qr: err.error.qr, key: err.error.key });
+                            this.pendingCredentials.set(credentials);
+                            reject(CODE_STEP);
+                        }
+                        else if (reason) {
+                            // invalid-code / too-many-attempts / authenticator-not-set-up:
+                            // stay on the step the user is on; say what happened, in plain words.
+                            if (reason === 'too-many-attempts' || reason === 'authenticator-not-set-up')
+                                this.#signInTicket = undefined;
+                            reject(authenticatorMessage(reason));
+                        }
+                        else if (err.status === 401) {
+                            reject('Wrong username or password');
+                        }
                         else {
                             reject(err.message ?? 'Unable to login');
                         }
@@ -596,6 +734,68 @@ class AuthenticationService {
             });
         });
     }
+    // ---------------------------------------------------------------------------
+    // Authenticator settings and the on-demand check (authenticator-sign-in.prd.md)
+    //
+    // All under the sign-in URL (`/login/…` or `/admin/login/…`), on the auth
+    // worker. A wrong code here is 403, never 401, so the interceptor does not
+    // read it as an expired session.
+    // ---------------------------------------------------------------------------
+    /** Whether an authenticator is set up, codes left, and whether the bypass is on. Refreshes the banner. */
+    async authenticatorStatus() {
+        const status = await this.#authenticatorCall('GET', 'authenticator');
+        this.bypassActive.set(status.bypassActive);
+        this.recoveryCodesLeft.set(status.recoveryCodesLeft);
+        return status;
+    }
+    /** Begin setting up (or replacing) the authenticator: the password again, plus a current code when replacing (D5). */
+    startAuthenticatorSetup(password, current = {}) {
+        return this.#authenticatorCall('POST', 'authenticator/start', { password, ...current });
+    }
+    /** Finish setup with the first code from the newly scanned app. Returns the 10 recovery codes, once. */
+    async confirmAuthenticatorSetup(code) {
+        const { recoveryCodes } = await this.#authenticatorCall('POST', 'authenticator/confirm', { code });
+        this.recoveryCodesLeft.set(recoveryCodes.length);
+        return recoveryCodes;
+    }
+    /** Ten new recovery codes; the old ones stop working (D7). Needs a current code. */
+    async reissueRecoveryCodes(code) {
+        const { recoveryCodes } = await this.#authenticatorCall('POST', 'recovery-codes', { code });
+        this.recoveryCodesLeft.set(recoveryCodes.length);
+        return recoveryCodes;
+    }
+    /**
+     * The on-demand check (D15): proves the code again on this session and returns
+     * when it was recorded. `purpose` is a short label for the log, e.g.
+     * 'arm-live-trading' — it changes nothing. The bypass never satisfies this.
+     */
+    async verifyCode(entry, purpose) {
+        const { codeVerifiedAtEpoch } = await this.#authenticatorCall('POST', 'verify-code', { ...entry, ...(purpose ? { purpose } : {}) });
+        return codeVerifiedAtEpoch;
+    }
+    async #authenticatorCall(method, path, body) {
+        const url = `${this.#authUrls.login}/${path}`;
+        const headers = {
+            [HttpHeader.Authorization]: this.auth,
+            [HttpHeader.AppContext]: 'brokenstock',
+            ...(body !== undefined ? { [HttpHeader.ContentType]: 'application/json' } : {}),
+        };
+        try {
+            return method === 'GET'
+                ? await firstValueFrom(this.#httpClient.get(url, { headers }))
+                : await firstValueFrom(this.#httpClient.post(url, body, { headers }));
+        }
+        catch (err) {
+            if (err instanceof HttpErrorResponse) {
+                const reason = err.error?.reason;
+                const message = reason
+                    ? authenticatorMessage(reason)
+                    : err.status === 400 ? 'Check what you typed and try again.' : (err.error?.message ?? 'Something went wrong');
+                throw new AuthenticatorError(reason, message, err.status);
+            }
+            throw err;
+        }
+    }
     /**
      * Renews the session, coordinating with the other windows of this browser.
      *
@@ -701,6 +901,12 @@ class AuthenticationService {
         this.userSession.set(undefined);
         this.conflictSessions.set(undefined);
         this.pendingCredentials.set(undefined);
+        this.codeStep.set('none');
+        this.setupChallenge.set(undefined);
+        this.recoveryCodesToShow.set(undefined);
+        this.recoveryCodesLeft.set(undefined);
+        this.bypassActive.set(false);
+        this.#signInTicket = undefined;
         this.#auth = 'Bearer ..';
         this.#store.clear();
         this.#router.navigate(['/login']).catch(console.error);
@@ -2332,12 +2538,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImpor
  * Asks the command box to take the cursor. Called by the shell after most
  * actions (rail choices, Log Out, ?, ⧉, Escape, sign-in) and by apps.
  *
- * ⚠ A NO-OP ON A PHONE (scanner-phone-display E11). The console is not rendered
- * below 820px, and the one place every focus request passes through is here, so
- * this is where it is refused: focusing a text box on a phone raises the
- * on-screen keyboard over the screen the user just opened. Refusing it at the
- * source also means a request made on a phone is not left counted up, waiting to
- * be acted on when the console appears after a rotation.
+ * ⚠ A NO-OP ON A PHONE (scanner-phone-display D10/E11). The console is shown
+ * below 820px, but nothing may put the cursor in it there: focusing a text box
+ * on a phone raises the on-screen keyboard over the screen the user just opened.
+ * The one place every focus request passes through is here, so this is where it
+ * is refused. Refusing it at the source also means a request made on a phone is
+ * not left counted up, to be acted on after a rotation to a wider screen.
  */
 class TerminalFocusService {
     constructor() {
@@ -3164,15 +3370,12 @@ class SideMenu {
          * untouched — they are document-level listeners and work from a hardware
          * keyboard whatever the layout.
          *
-         * The console show/hide button is left out too: the console is not rendered
-         * on a phone at all (Franz, 2026-10-16, scanner-phone-display E11), so the
-         * button would have nothing to show.
+         * The console show/hide button stays (Franz, 2026-10-17: the console is back
+         * on phones, reversing 0.8.1). Turning the console ON from here does not put
+         * the cursor in the command box on a phone — see CommandTerminal.focusOnAppear.
          */
         this.drawer = input(false, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "drawer" }] : /* istanbul ignore next */ []));
-        /** The console show/hide button — the icon column only (see `drawer`). */
-        this.showConsoleToggle = computed(() => !this.drawer(), /* @ts-ignore */
-        ...(ngDevMode ? [{ debugName: "showConsoleToggle" }] : /* istanbul ignore next */ []));
         this.#allMenuItems = inject(SHELL_MENU_ITEMS, { optional: true }) ?? [];
         this.menuItems = computed(() => this.#allMenuItems.filter(item => !item.visible || item.visible()), /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "menuItems" }] : /* istanbul ignore next */ []));
@@ -3213,13 +3416,17 @@ class SideMenu {
     }
     toggleTerminal() {
         this.#terminalVisibility.toggle();
+        // ⚠ No terminal focus here either: on a phone, showing the console is not a
+        // request to type. The menu closes so the user sees the console appear.
+        if (this.drawer())
+            this.#phoneLayout.closeMenu();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: SideMenu, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: SideMenu, isStandalone: true, selector: "shell-side-menu", inputs: { drawer: { classPropertyName: "drawer", publicName: "drawer", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<nav class=\"side-menu\" [class.drawer]=\"drawer()\" [attr.aria-label]=\"drawer() ? 'Menu' : null\">\n  @for (item of menuItems(); track item.route) {\n    @if (isEnabled(item)) {\n      <a\n        class=\"menu-item\"\n        [routerLink]=\"item.route\"\n        routerLinkActive=\"active\"\n        [matTooltip]=\"item.label\"\n        matTooltipPosition=\"right\"\n        [matTooltipDisabled]=\"drawer()\"\n        (click)=\"onMenuClick(item)\"\n      >\n        <mat-icon>{{ item.icon }}</mat-icon>\n        @if (drawer()) {\n          <span class=\"menu-label\">{{ item.label }}</span>\n        }\n      </a>\n    } @else {\n      <!-- No routerLink: the item is inert. Pointer events stay live (see the\n           .disabled rule) so the tooltip still fires \u2014 it carries the only\n           explanation the user gets. In the phone menu the explanation is shown\n           as text instead, since there is no hover to fire it. -->\n      <span\n        class=\"menu-item disabled\"\n        [matTooltip]=\"disabledReasonFor(item)\"\n        matTooltipPosition=\"right\"\n        [matTooltipDisabled]=\"drawer()\"\n        aria-disabled=\"true\"\n      >\n        <mat-icon>{{ item.icon }}</mat-icon>\n        @if (drawer()) {\n          <span class=\"menu-label\">\n            {{ item.label }}\n            <span class=\"menu-reason\">{{ disabledReasonFor(item) }}</span>\n          </span>\n        }\n      </span>\n    }\n  }\n  <div class=\"menu-spacer\"></div>\n  @if (showConsoleToggle()) {\n    <button\n      class=\"menu-item terminal-toggle\"\n      type=\"button\"\n      [class.active]=\"terminalVisible()\"\n      [matTooltip]=\"terminalVisible() ? 'Hide command console' : 'Show command console'\"\n      matTooltipPosition=\"right\"\n      [attr.aria-pressed]=\"terminalVisible()\"\n      (click)=\"toggleTerminal()\"\n    >\n      <mat-icon>terminal</mat-icon>\n    </button>\n  }\n  @if (hasShortcuts() && !drawer()) {\n    <button\n      class=\"help-button\"\n      matTooltip=\"Keyboard shortcuts\"\n      matTooltipPosition=\"right\"\n      (click)=\"toggleHelp()\"\n    >\n      <span class=\"help-modifier\">Alt+</span><span class=\"help-key\">?</span>\n    </button>\n  }\n</nav>\n", styles: [".side-menu{display:flex;flex-direction:column;align-items:center;padding-top:8px;gap:4px;height:100%;background-color:var(--color-surface);border-right:1px solid var(--color-surface-border)}.menu-item{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:8px;color:var(--color-secondary-info);text-decoration:none;transition:background-color .15s,color .15s}.menu-item:hover{background-color:var(--color-surface-light);color:var(--color-interactive)}.menu-item.active,.menu-item.active:hover{background-color:var(--color-interactive, #00e5ff);color:var(--color-surface-dark, #0d1117)}.menu-item.disabled{opacity:.25;cursor:not-allowed}.menu-item.disabled:hover{background-color:transparent;color:var(--color-secondary-info)}.menu-spacer{flex:1}.menu-item.terminal-toggle{border:none;background:none;padding:0;cursor:pointer;margin-bottom:4px}.menu-item.terminal-toggle.active{color:var(--color-interactive)}.menu-item.terminal-toggle.active:hover{background-color:var(--color-interactive);color:var(--color-surface-dark)}.help-button{margin-bottom:8px;padding:4px 6px;border:1px solid var(--color-surface-border);border-radius:6px;background:none;font-size:.7rem;font-family:Roboto Mono,monospace;cursor:pointer;color:var(--color-interactive);transition:background-color .15s}.help-button:hover{background-color:var(--color-surface-light)}.help-modifier{opacity:.6}.help-key{font-weight:700}.side-menu.drawer{align-items:stretch;padding:8px;gap:2px;overflow-y:auto}.side-menu.drawer .menu-item{width:auto;height:44px;flex-shrink:0;justify-content:flex-start;gap:14px;padding:0 12px}.side-menu.drawer .menu-item.disabled{opacity:.5;height:auto;min-height:44px;padding-top:4px;padding-bottom:4px}.menu-label{display:block;min-width:0;font-size:.85rem;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.menu-reason{display:block;font-size:.7rem;white-space:normal}\n"], dependencies: [{ kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "browserUrl", "routerLink"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: SideMenu, isStandalone: true, selector: "shell-side-menu", inputs: { drawer: { classPropertyName: "drawer", publicName: "drawer", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<nav class=\"side-menu\" [class.drawer]=\"drawer()\" [attr.aria-label]=\"drawer() ? 'Menu' : null\">\n  @for (item of menuItems(); track item.route) {\n    @if (isEnabled(item)) {\n      <a\n        class=\"menu-item\"\n        [routerLink]=\"item.route\"\n        routerLinkActive=\"active\"\n        [matTooltip]=\"item.label\"\n        matTooltipPosition=\"right\"\n        [matTooltipDisabled]=\"drawer()\"\n        (click)=\"onMenuClick(item)\"\n      >\n        <mat-icon>{{ item.icon }}</mat-icon>\n        @if (drawer()) {\n          <span class=\"menu-label\">{{ item.label }}</span>\n        }\n      </a>\n    } @else {\n      <!-- No routerLink: the item is inert. Pointer events stay live (see the\n           .disabled rule) so the tooltip still fires \u2014 it carries the only\n           explanation the user gets. In the phone menu the explanation is shown\n           as text instead, since there is no hover to fire it. -->\n      <span\n        class=\"menu-item disabled\"\n        [matTooltip]=\"disabledReasonFor(item)\"\n        matTooltipPosition=\"right\"\n        [matTooltipDisabled]=\"drawer()\"\n        aria-disabled=\"true\"\n      >\n        <mat-icon>{{ item.icon }}</mat-icon>\n        @if (drawer()) {\n          <span class=\"menu-label\">\n            {{ item.label }}\n            <span class=\"menu-reason\">{{ disabledReasonFor(item) }}</span>\n          </span>\n        }\n      </span>\n    }\n  }\n  <div class=\"menu-spacer\"></div>\n  <button\n    class=\"menu-item terminal-toggle\"\n    type=\"button\"\n    [class.active]=\"terminalVisible()\"\n    [matTooltip]=\"terminalVisible() ? 'Hide command console' : 'Show command console'\"\n    matTooltipPosition=\"right\"\n    [matTooltipDisabled]=\"drawer()\"\n    [attr.aria-pressed]=\"terminalVisible()\"\n    (click)=\"toggleTerminal()\"\n  >\n    <mat-icon>terminal</mat-icon>\n    @if (drawer()) {\n      <span class=\"menu-label\">{{ terminalVisible() ? 'Hide command console' : 'Show command console' }}</span>\n    }\n  </button>\n  @if (hasShortcuts() && !drawer()) {\n    <button\n      class=\"help-button\"\n      matTooltip=\"Keyboard shortcuts\"\n      matTooltipPosition=\"right\"\n      (click)=\"toggleHelp()\"\n    >\n      <span class=\"help-modifier\">Alt+</span><span class=\"help-key\">?</span>\n    </button>\n  }\n</nav>\n", styles: [".side-menu{display:flex;flex-direction:column;align-items:center;padding-top:8px;gap:4px;height:100%;background-color:var(--color-surface);border-right:1px solid var(--color-surface-border)}.menu-item{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:8px;color:var(--color-secondary-info);text-decoration:none;transition:background-color .15s,color .15s}.menu-item:hover{background-color:var(--color-surface-light);color:var(--color-interactive)}.menu-item.active,.menu-item.active:hover{background-color:var(--color-interactive, #00e5ff);color:var(--color-surface-dark, #0d1117)}.menu-item.disabled{opacity:.25;cursor:not-allowed}.menu-item.disabled:hover{background-color:transparent;color:var(--color-secondary-info)}.menu-spacer{flex:1}.menu-item.terminal-toggle{border:none;background:none;padding:0;cursor:pointer;margin-bottom:4px}.menu-item.terminal-toggle.active{color:var(--color-interactive)}.menu-item.terminal-toggle.active:hover{background-color:var(--color-interactive);color:var(--color-surface-dark)}.help-button{margin-bottom:8px;padding:4px 6px;border:1px solid var(--color-surface-border);border-radius:6px;background:none;font-size:.7rem;font-family:Roboto Mono,monospace;cursor:pointer;color:var(--color-interactive);transition:background-color .15s}.help-button:hover{background-color:var(--color-surface-light)}.help-modifier{opacity:.6}.help-key{font-weight:700}.side-menu.drawer{align-items:stretch;padding:8px;gap:2px;overflow-y:auto}.side-menu.drawer .menu-item{width:auto;height:44px;flex-shrink:0;justify-content:flex-start;gap:14px;padding:0 12px}.side-menu.drawer .menu-item.terminal-toggle{padding:0 12px;margin-bottom:0;font:inherit;color:var(--color-secondary-info)}.side-menu.drawer .menu-item.terminal-toggle.active{color:var(--color-interactive)}.side-menu.drawer .menu-item.terminal-toggle.active:hover{background-color:var(--color-interactive);color:var(--color-surface-dark)}.side-menu.drawer .menu-item.disabled{opacity:.5;height:auto;min-height:44px;padding-top:4px;padding-bottom:4px}.menu-label{display:block;min-width:0;font-size:.85rem;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.menu-reason{display:block;font-size:.7rem;white-space:normal}\n"], dependencies: [{ kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "browserUrl", "routerLink"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: SideMenu, decorators: [{
             type: Component,
-            args: [{ selector: 'shell-side-menu', imports: [RouterLink, RouterLinkActive, MatIconModule, MatTooltipModule], changeDetection: ChangeDetectionStrategy.Eager, template: "<nav class=\"side-menu\" [class.drawer]=\"drawer()\" [attr.aria-label]=\"drawer() ? 'Menu' : null\">\n  @for (item of menuItems(); track item.route) {\n    @if (isEnabled(item)) {\n      <a\n        class=\"menu-item\"\n        [routerLink]=\"item.route\"\n        routerLinkActive=\"active\"\n        [matTooltip]=\"item.label\"\n        matTooltipPosition=\"right\"\n        [matTooltipDisabled]=\"drawer()\"\n        (click)=\"onMenuClick(item)\"\n      >\n        <mat-icon>{{ item.icon }}</mat-icon>\n        @if (drawer()) {\n          <span class=\"menu-label\">{{ item.label }}</span>\n        }\n      </a>\n    } @else {\n      <!-- No routerLink: the item is inert. Pointer events stay live (see the\n           .disabled rule) so the tooltip still fires \u2014 it carries the only\n           explanation the user gets. In the phone menu the explanation is shown\n           as text instead, since there is no hover to fire it. -->\n      <span\n        class=\"menu-item disabled\"\n        [matTooltip]=\"disabledReasonFor(item)\"\n        matTooltipPosition=\"right\"\n        [matTooltipDisabled]=\"drawer()\"\n        aria-disabled=\"true\"\n      >\n        <mat-icon>{{ item.icon }}</mat-icon>\n        @if (drawer()) {\n          <span class=\"menu-label\">\n            {{ item.label }}\n            <span class=\"menu-reason\">{{ disabledReasonFor(item) }}</span>\n          </span>\n        }\n      </span>\n    }\n  }\n  <div class=\"menu-spacer\"></div>\n  @if (showConsoleToggle()) {\n    <button\n      class=\"menu-item terminal-toggle\"\n      type=\"button\"\n      [class.active]=\"terminalVisible()\"\n      [matTooltip]=\"terminalVisible() ? 'Hide command console' : 'Show command console'\"\n      matTooltipPosition=\"right\"\n      [attr.aria-pressed]=\"terminalVisible()\"\n      (click)=\"toggleTerminal()\"\n    >\n      <mat-icon>terminal</mat-icon>\n    </button>\n  }\n  @if (hasShortcuts() && !drawer()) {\n    <button\n      class=\"help-button\"\n      matTooltip=\"Keyboard shortcuts\"\n      matTooltipPosition=\"right\"\n      (click)=\"toggleHelp()\"\n    >\n      <span class=\"help-modifier\">Alt+</span><span class=\"help-key\">?</span>\n    </button>\n  }\n</nav>\n", styles: [".side-menu{display:flex;flex-direction:column;align-items:center;padding-top:8px;gap:4px;height:100%;background-color:var(--color-surface);border-right:1px solid var(--color-surface-border)}.menu-item{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:8px;color:var(--color-secondary-info);text-decoration:none;transition:background-color .15s,color .15s}.menu-item:hover{background-color:var(--color-surface-light);color:var(--color-interactive)}.menu-item.active,.menu-item.active:hover{background-color:var(--color-interactive, #00e5ff);color:var(--color-surface-dark, #0d1117)}.menu-item.disabled{opacity:.25;cursor:not-allowed}.menu-item.disabled:hover{background-color:transparent;color:var(--color-secondary-info)}.menu-spacer{flex:1}.menu-item.terminal-toggle{border:none;background:none;padding:0;cursor:pointer;margin-bottom:4px}.menu-item.terminal-toggle.active{color:var(--color-interactive)}.menu-item.terminal-toggle.active:hover{background-color:var(--color-interactive);color:var(--color-surface-dark)}.help-button{margin-bottom:8px;padding:4px 6px;border:1px solid var(--color-surface-border);border-radius:6px;background:none;font-size:.7rem;font-family:Roboto Mono,monospace;cursor:pointer;color:var(--color-interactive);transition:background-color .15s}.help-button:hover{background-color:var(--color-surface-light)}.help-modifier{opacity:.6}.help-key{font-weight:700}.side-menu.drawer{align-items:stretch;padding:8px;gap:2px;overflow-y:auto}.side-menu.drawer .menu-item{width:auto;height:44px;flex-shrink:0;justify-content:flex-start;gap:14px;padding:0 12px}.side-menu.drawer .menu-item.disabled{opacity:.5;height:auto;min-height:44px;padding-top:4px;padding-bottom:4px}.menu-label{display:block;min-width:0;font-size:.85rem;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.menu-reason{display:block;font-size:.7rem;white-space:normal}\n"] }]
+            args: [{ selector: 'shell-side-menu', imports: [RouterLink, RouterLinkActive, MatIconModule, MatTooltipModule], changeDetection: ChangeDetectionStrategy.Eager, template: "<nav class=\"side-menu\" [class.drawer]=\"drawer()\" [attr.aria-label]=\"drawer() ? 'Menu' : null\">\n  @for (item of menuItems(); track item.route) {\n    @if (isEnabled(item)) {\n      <a\n        class=\"menu-item\"\n        [routerLink]=\"item.route\"\n        routerLinkActive=\"active\"\n        [matTooltip]=\"item.label\"\n        matTooltipPosition=\"right\"\n        [matTooltipDisabled]=\"drawer()\"\n        (click)=\"onMenuClick(item)\"\n      >\n        <mat-icon>{{ item.icon }}</mat-icon>\n        @if (drawer()) {\n          <span class=\"menu-label\">{{ item.label }}</span>\n        }\n      </a>\n    } @else {\n      <!-- No routerLink: the item is inert. Pointer events stay live (see the\n           .disabled rule) so the tooltip still fires \u2014 it carries the only\n           explanation the user gets. In the phone menu the explanation is shown\n           as text instead, since there is no hover to fire it. -->\n      <span\n        class=\"menu-item disabled\"\n        [matTooltip]=\"disabledReasonFor(item)\"\n        matTooltipPosition=\"right\"\n        [matTooltipDisabled]=\"drawer()\"\n        aria-disabled=\"true\"\n      >\n        <mat-icon>{{ item.icon }}</mat-icon>\n        @if (drawer()) {\n          <span class=\"menu-label\">\n            {{ item.label }}\n            <span class=\"menu-reason\">{{ disabledReasonFor(item) }}</span>\n          </span>\n        }\n      </span>\n    }\n  }\n  <div class=\"menu-spacer\"></div>\n  <button\n    class=\"menu-item terminal-toggle\"\n    type=\"button\"\n    [class.active]=\"terminalVisible()\"\n    [matTooltip]=\"terminalVisible() ? 'Hide command console' : 'Show command console'\"\n    matTooltipPosition=\"right\"\n    [matTooltipDisabled]=\"drawer()\"\n    [attr.aria-pressed]=\"terminalVisible()\"\n    (click)=\"toggleTerminal()\"\n  >\n    <mat-icon>terminal</mat-icon>\n    @if (drawer()) {\n      <span class=\"menu-label\">{{ terminalVisible() ? 'Hide command console' : 'Show command console' }}</span>\n    }\n  </button>\n  @if (hasShortcuts() && !drawer()) {\n    <button\n      class=\"help-button\"\n      matTooltip=\"Keyboard shortcuts\"\n      matTooltipPosition=\"right\"\n      (click)=\"toggleHelp()\"\n    >\n      <span class=\"help-modifier\">Alt+</span><span class=\"help-key\">?</span>\n    </button>\n  }\n</nav>\n", styles: [".side-menu{display:flex;flex-direction:column;align-items:center;padding-top:8px;gap:4px;height:100%;background-color:var(--color-surface);border-right:1px solid var(--color-surface-border)}.menu-item{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:8px;color:var(--color-secondary-info);text-decoration:none;transition:background-color .15s,color .15s}.menu-item:hover{background-color:var(--color-surface-light);color:var(--color-interactive)}.menu-item.active,.menu-item.active:hover{background-color:var(--color-interactive, #00e5ff);color:var(--color-surface-dark, #0d1117)}.menu-item.disabled{opacity:.25;cursor:not-allowed}.menu-item.disabled:hover{background-color:transparent;color:var(--color-secondary-info)}.menu-spacer{flex:1}.menu-item.terminal-toggle{border:none;background:none;padding:0;cursor:pointer;margin-bottom:4px}.menu-item.terminal-toggle.active{color:var(--color-interactive)}.menu-item.terminal-toggle.active:hover{background-color:var(--color-interactive);color:var(--color-surface-dark)}.help-button{margin-bottom:8px;padding:4px 6px;border:1px solid var(--color-surface-border);border-radius:6px;background:none;font-size:.7rem;font-family:Roboto Mono,monospace;cursor:pointer;color:var(--color-interactive);transition:background-color .15s}.help-button:hover{background-color:var(--color-surface-light)}.help-modifier{opacity:.6}.help-key{font-weight:700}.side-menu.drawer{align-items:stretch;padding:8px;gap:2px;overflow-y:auto}.side-menu.drawer .menu-item{width:auto;height:44px;flex-shrink:0;justify-content:flex-start;gap:14px;padding:0 12px}.side-menu.drawer .menu-item.terminal-toggle{padding:0 12px;margin-bottom:0;font:inherit;color:var(--color-secondary-info)}.side-menu.drawer .menu-item.terminal-toggle.active{color:var(--color-interactive)}.side-menu.drawer .menu-item.terminal-toggle.active:hover{background-color:var(--color-interactive);color:var(--color-surface-dark)}.side-menu.drawer .menu-item.disabled{opacity:.5;height:auto;min-height:44px;padding-top:4px;padding-bottom:4px}.menu-label{display:block;min-width:0;font-size:.85rem;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.menu-reason{display:block;font-size:.7rem;white-space:normal}\n"] }]
         }], propDecorators: { drawer: [{ type: i0.Input, args: [{ isSignal: true, alias: "drawer", required: false }] }] } });
 
 class MainContent {
@@ -3261,11 +3468,11 @@ class CommandTerminal {
         /**
          * Whether the command box takes the cursor when the console first appears.
          *
-         * True for a standalone console and for the console showing at start-up or
-         * after the user turns it back on. The shell passes false when the console
-         * appears because the screen widened past 820px (a tablet or phone rotated to
-         * landscape): a layout change is not the user asking to type, and taking the
-         * cursor there would pull it out of whatever they were doing.
+         * True for a standalone console. The shell passes false on a phone (below
+         * 820px), including when the user turns the console on from the ☰ menu:
+         * showing the console is not a request to type, and focusing the box would
+         * raise the on-screen keyboard over it (scanner-phone-display D10). On a
+         * phone, focusInput() refuses anyway; this keeps the intent explicit.
          */
         this.focusOnAppear = input(true, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "focusOnAppear" }] : /* istanbul ignore next */ []));
@@ -3372,9 +3579,11 @@ class CommandTerminal {
         return '';
     }
     /**
-     * ⚠ A no-op on a phone (scanner-phone-display E11). The shell does not render
-     * the console there at all; this guard covers an app that mounts the console
-     * itself, so nothing on a phone can raise the on-screen keyboard unasked.
+     * ⚠ A no-op on a phone (scanner-phone-display D10/E11). The console is shown
+     * there, but only the user tapping the box may give it the cursor; every
+     * programmatic path (first appearance, a finished command, a focus request,
+     * an app calling this) ends here and is refused, so nothing on a phone can
+     * raise the on-screen keyboard unasked.
      */
     focusInput() {
         if (this.#phoneLayout.isPhone())
@@ -3382,7 +3591,7 @@ class CommandTerminal {
         this.inputEl()?.nativeElement.focus();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: CommandTerminal, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: CommandTerminal, isStandalone: true, selector: "shell-command-terminal", inputs: { focusOnAppear: { classPropertyName: "focusOnAppear", publicName: "focusOnAppear", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "inputEl", first: true, predicate: ["terminalInput"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"terminal\">\n  <div class=\"terminal-input-row\">\n    <span class=\"prompt\">$</span>\n    <div class=\"input-wrapper\">\n      @if (ghostText()) {\n        <input\n          class=\"ghost-input\"\n          type=\"text\"\n          [value]=\"ghostText()\"\n          disabled\n          tabindex=\"-1\"\n          aria-hidden=\"true\"\n        />\n      }\n      <input\n        #terminalInput\n        class=\"terminal-input\"\n        type=\"text\"\n        [ngModel]=\"currentInput()\"\n        (ngModelChange)=\"onInputChange($event)\"\n        (keydown.enter)=\"onSubmit()\"\n        (keydown.tab)=\"onTab($any($event))\"\n        (keydown.escape)=\"dismissHelp()\"\n        placeholder=\"Type a command...\"\n        [disabled]=\"isProcessing()\"\n        autocomplete=\"off\"\n        spellcheck=\"false\"\n      />\n    </div>\n  </div>\n  <div class=\"terminal-output\">\n    @for (entry of history(); track entry.result.timestamp) {\n      @if (entry.input) {\n        <div class=\"terminal-line\">\n          <span class=\"prompt\">$</span>\n          <span class=\"command-text\">{{ entry.input }}@if ((entry.repeatCount ?? 1) > 1) { <span class=\"repeat-count\">(\u00D7{{ entry.repeatCount }})</span>}</span>\n        </div>\n      }\n      @if (entry.result.message) {\n        <div class=\"terminal-line\" [class]=\"getSeverityClass(entry.result)\">{{ entry.result.message }}</div>\n      }\n    }\n  </div>\n</div>\n", styles: [".terminal{display:flex;flex-direction:column;height:100%;background-color:var(--color-terminal-bg);border-top:1px solid var(--color-surface-border);font-family:Roboto Mono,Courier New,monospace;font-size:.85rem}.terminal-output{flex:1;overflow-y:auto;padding:8px 12px;display:flex;flex-direction:column}.terminal-line{line-height:1.6;color:var(--color-text-primary);white-space:pre-wrap}.terminal-line.error{color:var(--color-loss)}.terminal-line.warning{color:var(--color-warning)}.terminal-line.info{color:var(--color-info)}.prompt{color:var(--color-terminal-prompt);margin-right:8px;font-weight:700}.command-text{color:var(--color-terminal-text)}.repeat-count{color:var(--color-secondary-info);opacity:.6;margin-left:4px}.terminal-input-row{display:flex;align-items:center;padding:8px 12px;border-bottom:1px solid var(--color-surface-border)}.input-wrapper{flex:1;display:grid}.ghost-input,.terminal-input{grid-area:1 / 1;font-family:inherit;font-size:inherit;line-height:normal;margin:0;padding:0;border:none;background:transparent;outline:none;-webkit-appearance:none;appearance:none;width:100%}.ghost-input{color:var(--color-secondary-info);opacity:.3;pointer-events:none}.terminal-input{color:var(--color-terminal-text);caret-color:var(--color-terminal-prompt)}.terminal-input::placeholder{color:var(--color-secondary-info);opacity:.5}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: CommandTerminal, isStandalone: true, selector: "shell-command-terminal", inputs: { focusOnAppear: { classPropertyName: "focusOnAppear", publicName: "focusOnAppear", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "inputEl", first: true, predicate: ["terminalInput"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"terminal\">\n  <div class=\"terminal-input-row\">\n    <span class=\"prompt\">$</span>\n    <div class=\"input-wrapper\">\n      @if (ghostText()) {\n        <input\n          class=\"ghost-input\"\n          type=\"text\"\n          [value]=\"ghostText()\"\n          disabled\n          tabindex=\"-1\"\n          aria-hidden=\"true\"\n        />\n      }\n      <input\n        #terminalInput\n        class=\"terminal-input\"\n        type=\"text\"\n        [ngModel]=\"currentInput()\"\n        (ngModelChange)=\"onInputChange($event)\"\n        (keydown.enter)=\"onSubmit()\"\n        (keydown.tab)=\"onTab($any($event))\"\n        (keydown.escape)=\"dismissHelp()\"\n        placeholder=\"Type a command...\"\n        [disabled]=\"isProcessing()\"\n        autocomplete=\"off\"\n        spellcheck=\"false\"\n      />\n    </div>\n  </div>\n  <div class=\"terminal-output\">\n    @for (entry of history(); track entry.result.timestamp) {\n      @if (entry.input) {\n        <div class=\"terminal-line\">\n          <span class=\"prompt\">$</span>\n          <span class=\"command-text\">{{ entry.input }}@if ((entry.repeatCount ?? 1) > 1) { <span class=\"repeat-count\">(\u00D7{{ entry.repeatCount }})</span>}</span>\n        </div>\n      }\n      @if (entry.result.message) {\n        <div class=\"terminal-line\" [class]=\"getSeverityClass(entry.result)\">{{ entry.result.message }}</div>\n      }\n    }\n  </div>\n</div>\n", styles: [".terminal{display:flex;flex-direction:column;height:100%;background-color:var(--color-terminal-bg);border-top:1px solid var(--color-surface-border);font-family:Roboto Mono,Courier New,monospace;font-size:.85rem}.terminal-output{flex:1;overflow-y:auto;padding:8px 12px;display:flex;flex-direction:column}.terminal-line{line-height:1.6;color:var(--color-text-primary);white-space:pre-wrap}.terminal-line.error{color:var(--color-loss)}.terminal-line.warning{color:var(--color-warning)}.terminal-line.info{color:var(--color-info)}.prompt{color:var(--color-terminal-prompt);margin-right:8px;font-weight:700}.command-text{color:var(--color-terminal-text)}.repeat-count{color:var(--color-secondary-info);opacity:.6;margin-left:4px}.terminal-input-row{display:flex;align-items:center;padding:8px 12px;border-bottom:1px solid var(--color-surface-border)}.input-wrapper{flex:1;display:grid}.ghost-input,.terminal-input{grid-area:1 / 1;font-family:inherit;font-size:inherit;line-height:normal;margin:0;padding:0;border:none;background:transparent;outline:none;-webkit-appearance:none;appearance:none;width:100%}.ghost-input{color:var(--color-secondary-info);opacity:.3;pointer-events:none}.terminal-input{color:var(--color-terminal-text);caret-color:var(--color-terminal-prompt)}.terminal-input::placeholder{color:var(--color-secondary-info);opacity:.5}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: CommandTerminal, decorators: [{
             type: Component,
@@ -3392,6 +3601,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImpor
 const MIN_TERMINAL_HEIGHT = 80;
 const MAX_TERMINAL_RATIO = 0.6;
 const DEFAULT_TERMINAL_HEIGHT = 160;
+/**
+ * How often a signed-in window re-reads whether the AWS-set bypass is on
+ * (authenticator-sign-in.prd.md D12). The server never says when it ends, so the
+ * banner goes away on the first read after it has.
+ */
+const BYPASS_RECHECK_MS = 2 * 60 * 1000;
 class Shell {
     constructor() {
         this.#thinkingService = inject(ThinkingService);
@@ -3407,37 +3622,38 @@ class Shell {
         this.isPhone = this.#phoneLayout.isPhone;
         this.phoneMenuOpen = this.#phoneLayout.menuOpen;
         /**
-         * Whether the console (command box, output, and the resize bar above it) is
-         * shown, and whether it takes the cursor when it appears.
-         *
-         * `show`: never on a phone — Franz, 2026-10-16 (scanner-phone-display E11).
-         * The user's show/hide choice is kept untouched, so rotating to a width of
-         * 820px or more brings the console back exactly as it was left. Commands do
-         * not depend on the console: `CommandService.execute` runs from any button
-         * whether or not it is on screen.
+         * Whether the command box takes the cursor when the console appears: on a
+         * desktop yes, on a phone never (scanner-phone-display D10, Franz 2026-10-17).
          *
-         * `focusOnAppear`: false only when the console is appearing because the
-         * screen widened past 820px (see CommandTerminal.focusOnAppear); true at
-         * start-up and after the user turns the console on.
+         * The console is shown on a phone again (reversing 0.8.1), but nothing may
+         * put the cursor in its box there — the on-screen keyboard would cover the
+         * screen. That includes the user turning the console ON from the ☰ menu: a
+         * show is not a request to type, and the keyboard rising over the console the
+         * moment it appears would hide the output the user wanted to see. Tapping the
+         * box is the only way it gets the cursor on a phone.
          *
-         * ⚠ ONE SIGNAL, READ UNCONDITIONALLY BY THE TEMPLATE (`[class.terminal-hidden]`),
-         * and that is load-bearing. The focus decision needs the PREVIOUS layout to
-         * tell "widened from a phone" apart from "turned on". A linkedSignal only sees
-         * the state as of its last read, so a value read only inside the console's
-         * `@if` — never read while on a phone — would miss the phone state entirely
-         * and grab the cursor on rotation.
+         * Rotating across 820px never mounts or unmounts the console (its visibility
+         * is the user's choice alone), so this is only read when the user turns it on
+         * or at start-up. CommandTerminal.focusInput also refuses on a phone, as a
+         * second guard.
          */
-        this.consoleState = linkedSignal({ ...(ngDevMode ? { debugName: "consoleState" } : /* istanbul ignore next */ {}), source: () => ({ visible: this.terminalVisible(), phone: this.isPhone() }),
-            computation: (now, previous) => {
-                const show = now.visible && !now.phone;
-                if (!previous)
-                    return { show, focusOnAppear: true };
-                if (previous.source.visible !== now.visible)
-                    return { show, focusOnAppear: true };
-                if (previous.source.phone && !now.phone)
-                    return { show, focusOnAppear: false };
-                return { show, focusOnAppear: previous.value.focusOnAppear };
-            } });
+        this.consoleFocusOnAppear = computed(() => !this.isPhone(), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "consoleFocusOnAppear" }] : /* istanbul ignore next */ []));
+        /** "Sign-in code check is off." on every screen while the bypass is on (D12). */
+        this.bypassActive = this.#authService.bypassActive;
+        /**
+         * Keeps `bypassActive` current while signed in: once now (a window restored from
+         * storage never saw the sign-in response) and then every two minutes.
+         */
+        this.#bypassWatch = effect(onCleanup => {
+            if (!this.isAuthenticated())
+                return;
+            const read = () => { this.#authService.authenticatorStatus().catch(() => undefined); };
+            read();
+            const timer = setInterval(read, BYPASS_RECHECK_MS);
+            onCleanup(() => clearInterval(timer));
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "#bypassWatch" }] : /* istanbul ignore next */ []));
         this.terminalHeight = signal(`${DEFAULT_TERMINAL_HEIGHT}px`, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "terminalHeight" }] : /* istanbul ignore next */ []));
         this.isDragging = signal(false, /* @ts-ignore */
@@ -3450,9 +3666,8 @@ class Shell {
             document.removeEventListener('mousemove', this.#onMouseMove);
             document.removeEventListener('mouseup', this.#onMouseUp);
         };
-        // Touch drag for the resize bar (scanner-phone-display E12). Only reachable
-        // at 820px and wider — a tablet — since the bar is not rendered on a phone.
-        // Kept separate from the mouse path so the desktop's behaviour is unchanged;
+        // Touch drag for the resize bar (scanner-phone-display E12): tablets and,
+        // since the console is back there (D10, 2026-10-17), phones. Kept separate from the mouse path so the desktop's behaviour is unchanged;
         // the bar's `touch-action: none` stops the page scrolling under the finger.
         this.#onTouchMove = (event) => {
             const touch = event.touches[0];
@@ -3471,6 +3686,11 @@ class Shell {
     #authService;
     #terminalVisibility;
     #phoneLayout;
+    /**
+     * Keeps `bypassActive` current while signed in: once now (a window restored from
+     * storage never saw the sign-in response) and then every two minutes.
+     */
+    #bypassWatch;
     closePhoneMenu() {
         this.#phoneLayout.closeMenu();
     }
@@ -3495,9 +3715,8 @@ class Shell {
         document.addEventListener('mousemove', this.#onMouseMove);
         document.addEventListener('mouseup', this.#onMouseUp);
     }
-    // Touch drag for the resize bar (scanner-phone-display E12). Only reachable
-    // at 820px and wider — a tablet — since the bar is not rendered on a phone.
-    // Kept separate from the mouse path so the desktop's behaviour is unchanged;
+    // Touch drag for the resize bar (scanner-phone-display E12): tablets and,
+    // since the console is back there (D10, 2026-10-17), phones. Kept separate from the mouse path so the desktop's behaviour is unchanged;
     // the bar's `touch-action: none` stops the page scrolling under the finger.
     #onTouchMove;
     #onTouchEnd;
@@ -3513,13 +3732,97 @@ class Shell {
         document.addEventListener('touchcancel', this.#onTouchEnd);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: Shell, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: Shell, isStandalone: true, selector: "shell-root", ngImport: i0, template: "<div class=\"shell\" [style.--terminal-height]=\"terminalHeight()\" [class.is-dragging]=\"isDragging()\" [class.terminal-hidden]=\"!consoleState().show\">\n  <shell-status-bar class=\"shell-status\" [class.disabled-zone]=\"isThinking()\">\n    <ng-content />\n  </shell-status-bar>\n  @if (isAuthenticated() && !isPhone()) {\n    <shell-side-menu class=\"shell-menu\" [class.disabled-zone]=\"isThinking()\" />\n  }\n  <shell-main-content class=\"shell-main\" [class.full-width]=\"!isAuthenticated()\" />\n  @if (consoleState().show) {\n    <!-- Never on a phone (scanner-phone-display E11): see Shell.consoleState. -->\n    <div class=\"shell-resize\" [class.dragging]=\"isDragging()\" (mousedown)=\"onResizeStart($event)\" (touchstart)=\"onResizeTouchStart($event)\"></div>\n    <shell-command-terminal class=\"shell-terminal\" [class.disabled-zone]=\"isThinking()\" [focusOnAppear]=\"consoleState().focusOnAppear\" />\n  }\n  @if (isAuthenticated() && phoneMenuOpen()) {\n    <!-- Phone menu (scanner-phone-display D9): the icon column's items, opened from the \u2630 button. -->\n    <div class=\"phone-menu-backdrop\" (click)=\"closePhoneMenu()\"></div>\n    <shell-side-menu\n      id=\"shell-phone-menu\"\n      class=\"phone-menu\"\n      [class.disabled-zone]=\"isThinking()\"\n      [drawer]=\"true\"\n      role=\"dialog\"\n      aria-modal=\"true\"\n      aria-label=\"Menu\"\n      cdkTrapFocus\n      [cdkTrapFocusAutoCapture]=\"true\"\n      (keydown.escape)=\"closePhoneMenu()\"\n    />\n  }\n  <faq-modal />\n\n  @if (helpOverlay(); as helpText) {\n    <div class=\"help-backdrop\" (click)=\"dismissHelp()\">\n      <div class=\"help-panel\" (click)=\"$event.stopPropagation()\" role=\"dialog\" aria-label=\"Command help\">\n        <div class=\"help-panel-header\">\n          <span class=\"help-panel-title\">Help</span>\n          <button class=\"help-panel-close\" type=\"button\" (click)=\"dismissHelp()\" aria-label=\"Close help\">\u2715</button>\n        </div>\n        <div class=\"help-panel-content\">{{ helpText }}</div>\n        <div class=\"help-panel-footer\">\n          <span>Tip: for most commands you can swap the first and second words \u2014 e.g. \"disable user\" works the same as \"user disable\"</span>\n          <span class=\"help-panel-footer-dismiss\">Press Escape, click outside, or start typing to close</span>\n        </div>\n      </div>\n    </div>\n  }\n</div>\n", styles: [".shell{position:relative;display:grid;grid-template-areas:\"status   status\" \"menu     main\" \"resize   resize\" \"terminal terminal\";grid-template-columns:56px 1fr;grid-template-rows:48px 1fr 4px var(--terminal-height, 160px);height:100vh;height:100dvh;width:100vw;overflow:hidden;background-color:var(--color-surface-dark)}.shell.terminal-hidden{grid-template-rows:48px 1fr 0 0}.shell-status{grid-area:status}.shell-menu{grid-area:menu}.shell-main{grid-area:main;overflow:hidden}.shell-main.full-width{grid-column:1 / -1}.shell-resize{grid-area:resize;cursor:row-resize;touch-action:none;background-color:var(--color-surface-border);transition:background-color .15s ease}.shell-resize:hover,.shell-resize.dragging{background-color:var(--color-interactive)}.shell-terminal{grid-area:terminal}.shell.is-dragging{user-select:none;-webkit-user-select:none}.disabled-zone{pointer-events:none;opacity:.4;transition:opacity .2s ease}.help-backdrop{position:absolute;inset:0;z-index:100;background-color:#000000a6;display:flex;align-items:center;justify-content:center}.help-panel{background-color:var(--color-surface, #161b22);border:2px solid var(--color-interactive, #00e5ff);border-radius:4px;width:70%;max-width:820px;max-height:75vh;display:flex;flex-direction:column;font-family:Roboto Mono,Courier New,monospace;font-size:.85rem}.help-panel-header{display:flex;justify-content:space-between;align-items:center;padding:8px 16px;background-color:var(--color-surface-light, #21262d);border-bottom:1px solid var(--color-interactive, #00e5ff);border-radius:2px 2px 0 0;flex-shrink:0}.help-panel-title{color:var(--color-interactive, #00e5ff);font-weight:700;letter-spacing:.05em;text-transform:uppercase;font-size:.75rem}.help-panel-close{background:none;border:1px solid var(--color-surface-border, #30363d);color:var(--color-secondary-info, #9e9e9e);cursor:pointer;padding:2px 8px;font-size:.9rem;line-height:1.4;border-radius:3px;transition:color .15s ease,border-color .15s ease}.help-panel-close:hover{color:var(--color-text-primary, #ffffff);border-color:var(--color-interactive, #00e5ff)}.help-panel-content{flex:1;overflow-y:auto;padding:16px 20px;color:var(--color-text-primary, #ffffff);white-space:pre-wrap;line-height:1.7}.help-panel-footer{padding:6px 16px;background-color:var(--color-surface-light, #21262d);border-top:1px solid var(--color-surface-border, #30363d);border-radius:0 0 2px 2px;color:var(--color-secondary-info, #9e9e9e);font-size:.75rem;flex-shrink:0;display:flex;flex-direction:column;gap:2px}.help-panel-footer-dismiss{opacity:.6}@media(max-width:819.98px){.shell{grid-template-areas:\"status\" \"main\" \"resize\" \"terminal\";grid-template-columns:minmax(0,1fr)}.shell-menu{display:none}}.phone-menu-backdrop{position:absolute;inset:48px 0 0;z-index:50;background-color:color-mix(in srgb,var(--color-surface-dark) 70%,transparent)}.phone-menu{position:absolute;top:48px;bottom:0;left:0;z-index:51;display:block;width:min(280px,85vw);box-shadow:4px 0 16px color-mix(in srgb,var(--color-surface-dark) 60%,transparent)}\n"], dependencies: [{ kind: "component", type: StatusBar, selector: "shell-status-bar" }, { kind: "component", type: SideMenu, selector: "shell-side-menu", inputs: ["drawer"] }, { kind: "component", type: MainContent, selector: "shell-main-content" }, { kind: "component", type: CommandTerminal, selector: "shell-command-terminal", inputs: ["focusOnAppear"] }, { kind: "component", type: FaqModal, selector: "faq-modal" }, { kind: "directive", type: CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: Shell, isStandalone: true, selector: "shell-root", ngImport: i0, template: "<div class=\"shell\" [style.--terminal-height]=\"terminalHeight()\" [class.is-dragging]=\"isDragging()\" [class.terminal-hidden]=\"!terminalVisible()\">\n  <shell-status-bar class=\"shell-status\" [class.disabled-zone]=\"isThinking()\">\n    <ng-content />\n  </shell-status-bar>\n  @if (isAuthenticated() && !isPhone()) {\n    <shell-side-menu class=\"shell-menu\" [class.disabled-zone]=\"isThinking()\" />\n  }\n  <shell-main-content class=\"shell-main\" [class.full-width]=\"!isAuthenticated()\" />\n  @if (terminalVisible()) {\n    <!-- On a phone too (scanner-phone-display D10), but never given the cursor there: see Shell.consoleFocusOnAppear. -->\n    <div class=\"shell-resize\" [class.dragging]=\"isDragging()\" (mousedown)=\"onResizeStart($event)\" (touchstart)=\"onResizeTouchStart($event)\"></div>\n    <shell-command-terminal class=\"shell-terminal\" [class.disabled-zone]=\"isThinking()\" [focusOnAppear]=\"consoleFocusOnAppear()\" />\n  }\n  @if (isAuthenticated() && phoneMenuOpen()) {\n    <!-- Phone menu (scanner-phone-display D9): the icon column's items, opened from the \u2630 button. -->\n    <div class=\"phone-menu-backdrop\" (click)=\"closePhoneMenu()\"></div>\n    <shell-side-menu\n      id=\"shell-phone-menu\"\n      class=\"phone-menu\"\n      [class.disabled-zone]=\"isThinking()\"\n      [drawer]=\"true\"\n      role=\"dialog\"\n      aria-modal=\"true\"\n      aria-label=\"Menu\"\n      cdkTrapFocus\n      [cdkTrapFocusAutoCapture]=\"true\"\n      (keydown.escape)=\"closePhoneMenu()\"\n    />\n  }\n  @if (isAuthenticated() && bypassActive()) {\n    <!-- authenticator-sign-in.prd.md D12: cannot be dismissed; no end time (the server never sends one). -->\n    <div class=\"bypass-banner\" role=\"status\">Sign-in code check is off.</div>\n  }\n  <faq-modal />\n\n  @if (helpOverlay(); as helpText) {\n    <div class=\"help-backdrop\" (click)=\"dismissHelp()\">\n      <div class=\"help-panel\" (click)=\"$event.stopPropagation()\" role=\"dialog\" aria-label=\"Command help\">\n        <div class=\"help-panel-header\">\n          <span class=\"help-panel-title\">Help</span>\n          <button class=\"help-panel-close\" type=\"button\" (click)=\"dismissHelp()\" aria-label=\"Close help\">\u2715</button>\n        </div>\n        <div class=\"help-panel-content\">{{ helpText }}</div>\n        <div class=\"help-panel-footer\">\n          <span>Tip: for most commands you can swap the first and second words \u2014 e.g. \"disable user\" works the same as \"user disable\"</span>\n          <span class=\"help-panel-footer-dismiss\">Press Escape, click outside, or start typing to close</span>\n        </div>\n      </div>\n    </div>\n  }\n</div>\n", styles: [".shell{position:relative;display:grid;grid-template-areas:\"status   status\" \"menu     main\" \"resize   resize\" \"terminal terminal\";grid-template-columns:56px 1fr;grid-template-rows:48px 1fr 4px var(--terminal-height, 160px);height:100vh;height:100dvh;width:100vw;overflow:hidden;background-color:var(--color-surface-dark)}.shell.terminal-hidden{grid-template-rows:48px 1fr 0 0}.shell-status{grid-area:status}.shell-menu{grid-area:menu}.shell-main{grid-area:main;overflow:hidden}.shell-main.full-width{grid-column:1 / -1}.shell-resize{grid-area:resize;cursor:row-resize;touch-action:none;background-color:var(--color-surface-border);transition:background-color .15s ease}.shell-resize:hover,.shell-resize.dragging{background-color:var(--color-interactive)}.shell-terminal{grid-area:terminal}.shell.is-dragging{user-select:none;-webkit-user-select:none}.disabled-zone{pointer-events:none;opacity:.4;transition:opacity .2s ease}.help-backdrop{position:absolute;inset:0;z-index:100;background-color:#000000a6;display:flex;align-items:center;justify-content:center}.help-panel{background-color:var(--color-surface, #161b22);border:2px solid var(--color-interactive, #00e5ff);border-radius:4px;width:70%;max-width:820px;max-height:75vh;display:flex;flex-direction:column;font-family:Roboto Mono,Courier New,monospace;font-size:.85rem}.help-panel-header{display:flex;justify-content:space-between;align-items:center;padding:8px 16px;background-color:var(--color-surface-light, #21262d);border-bottom:1px solid var(--color-interactive, #00e5ff);border-radius:2px 2px 0 0;flex-shrink:0}.help-panel-title{color:var(--color-interactive, #00e5ff);font-weight:700;letter-spacing:.05em;text-transform:uppercase;font-size:.75rem}.help-panel-close{background:none;border:1px solid var(--color-surface-border, #30363d);color:var(--color-secondary-info, #9e9e9e);cursor:pointer;padding:2px 8px;font-size:.9rem;line-height:1.4;border-radius:3px;transition:color .15s ease,border-color .15s ease}.help-panel-close:hover{color:var(--color-text-primary, #ffffff);border-color:var(--color-interactive, #00e5ff)}.help-panel-content{flex:1;overflow-y:auto;padding:16px 20px;color:var(--color-text-primary, #ffffff);white-space:pre-wrap;line-height:1.7}.help-panel-footer{padding:6px 16px;background-color:var(--color-surface-light, #21262d);border-top:1px solid var(--color-surface-border, #30363d);border-radius:0 0 2px 2px;color:var(--color-secondary-info, #9e9e9e);font-size:.75rem;flex-shrink:0;display:flex;flex-direction:column;gap:2px}.help-panel-footer-dismiss{opacity:.6}@media(max-width:819.98px){.shell{grid-template-areas:\"status\" \"main\" \"resize\" \"terminal\";grid-template-columns:minmax(0,1fr)}.shell-menu{display:none}}.phone-menu-backdrop{position:absolute;inset:48px 0 0;z-index:50;background-color:color-mix(in srgb,var(--color-surface-dark) 70%,transparent)}.phone-menu{position:absolute;top:48px;bottom:0;left:0;z-index:51;display:block;width:min(280px,85vw);box-shadow:4px 0 16px color-mix(in srgb,var(--color-surface-dark) 60%,transparent)}.bypass-banner{position:fixed;top:52px;right:12px;z-index:1000;padding:6px 12px;border:2px solid var(--color-loss);border-radius:4px;background-color:var(--color-surface);color:var(--color-loss);font-weight:600;pointer-events:none}\n"], dependencies: [{ kind: "component", type: StatusBar, selector: "shell-status-bar" }, { kind: "component", type: SideMenu, selector: "shell-side-menu", inputs: ["drawer"] }, { kind: "component", type: MainContent, selector: "shell-main-content" }, { kind: "component", type: CommandTerminal, selector: "shell-command-terminal", inputs: ["focusOnAppear"] }, { kind: "component", type: FaqModal, selector: "faq-modal" }, { kind: "directive", type: CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: Shell, decorators: [{
             type: Component,
-            args: [{ selector: 'shell-root', imports: [StatusBar, SideMenu, MainContent, CommandTerminal, FaqModal, CdkTrapFocus], changeDetection: ChangeDetectionStrategy.Eager, template: "<div class=\"shell\" [style.--terminal-height]=\"terminalHeight()\" [class.is-dragging]=\"isDragging()\" [class.terminal-hidden]=\"!consoleState().show\">\n  <shell-status-bar class=\"shell-status\" [class.disabled-zone]=\"isThinking()\">\n    <ng-content />\n  </shell-status-bar>\n  @if (isAuthenticated() && !isPhone()) {\n    <shell-side-menu class=\"shell-menu\" [class.disabled-zone]=\"isThinking()\" />\n  }\n  <shell-main-content class=\"shell-main\" [class.full-width]=\"!isAuthenticated()\" />\n  @if (consoleState().show) {\n    <!-- Never on a phone (scanner-phone-display E11): see Shell.consoleState. -->\n    <div class=\"shell-resize\" [class.dragging]=\"isDragging()\" (mousedown)=\"onResizeStart($event)\" (touchstart)=\"onResizeTouchStart($event)\"></div>\n    <shell-command-terminal class=\"shell-terminal\" [class.disabled-zone]=\"isThinking()\" [focusOnAppear]=\"consoleState().focusOnAppear\" />\n  }\n  @if (isAuthenticated() && phoneMenuOpen()) {\n    <!-- Phone menu (scanner-phone-display D9): the icon column's items, opened from the \u2630 button. -->\n    <div class=\"phone-menu-backdrop\" (click)=\"closePhoneMenu()\"></div>\n    <shell-side-menu\n      id=\"shell-phone-menu\"\n      class=\"phone-menu\"\n      [class.disabled-zone]=\"isThinking()\"\n      [drawer]=\"true\"\n      role=\"dialog\"\n      aria-modal=\"true\"\n      aria-label=\"Menu\"\n      cdkTrapFocus\n      [cdkTrapFocusAutoCapture]=\"true\"\n      (keydown.escape)=\"closePhoneMenu()\"\n    />\n  }\n  <faq-modal />\n\n  @if (helpOverlay(); as helpText) {\n    <div class=\"help-backdrop\" (click)=\"dismissHelp()\">\n      <div class=\"help-panel\" (click)=\"$event.stopPropagation()\" role=\"dialog\" aria-label=\"Command help\">\n        <div class=\"help-panel-header\">\n          <span class=\"help-panel-title\">Help</span>\n          <button class=\"help-panel-close\" type=\"button\" (click)=\"dismissHelp()\" aria-label=\"Close help\">\u2715</button>\n        </div>\n        <div class=\"help-panel-content\">{{ helpText }}</div>\n        <div class=\"help-panel-footer\">\n          <span>Tip: for most commands you can swap the first and second words \u2014 e.g. \"disable user\" works the same as \"user disable\"</span>\n          <span class=\"help-panel-footer-dismiss\">Press Escape, click outside, or start typing to close</span>\n        </div>\n      </div>\n    </div>\n  }\n</div>\n", styles: [".shell{position:relative;display:grid;grid-template-areas:\"status   status\" \"menu     main\" \"resize   resize\" \"terminal terminal\";grid-template-columns:56px 1fr;grid-template-rows:48px 1fr 4px var(--terminal-height, 160px);height:100vh;height:100dvh;width:100vw;overflow:hidden;background-color:var(--color-surface-dark)}.shell.terminal-hidden{grid-template-rows:48px 1fr 0 0}.shell-status{grid-area:status}.shell-menu{grid-area:menu}.shell-main{grid-area:main;overflow:hidden}.shell-main.full-width{grid-column:1 / -1}.shell-resize{grid-area:resize;cursor:row-resize;touch-action:none;background-color:var(--color-surface-border);transition:background-color .15s ease}.shell-resize:hover,.shell-resize.dragging{background-color:var(--color-interactive)}.shell-terminal{grid-area:terminal}.shell.is-dragging{user-select:none;-webkit-user-select:none}.disabled-zone{pointer-events:none;opacity:.4;transition:opacity .2s ease}.help-backdrop{position:absolute;inset:0;z-index:100;background-color:#000000a6;display:flex;align-items:center;justify-content:center}.help-panel{background-color:var(--color-surface, #161b22);border:2px solid var(--color-interactive, #00e5ff);border-radius:4px;width:70%;max-width:820px;max-height:75vh;display:flex;flex-direction:column;font-family:Roboto Mono,Courier New,monospace;font-size:.85rem}.help-panel-header{display:flex;justify-content:space-between;align-items:center;padding:8px 16px;background-color:var(--color-surface-light, #21262d);border-bottom:1px solid var(--color-interactive, #00e5ff);border-radius:2px 2px 0 0;flex-shrink:0}.help-panel-title{color:var(--color-interactive, #00e5ff);font-weight:700;letter-spacing:.05em;text-transform:uppercase;font-size:.75rem}.help-panel-close{background:none;border:1px solid var(--color-surface-border, #30363d);color:var(--color-secondary-info, #9e9e9e);cursor:pointer;padding:2px 8px;font-size:.9rem;line-height:1.4;border-radius:3px;transition:color .15s ease,border-color .15s ease}.help-panel-close:hover{color:var(--color-text-primary, #ffffff);border-color:var(--color-interactive, #00e5ff)}.help-panel-content{flex:1;overflow-y:auto;padding:16px 20px;color:var(--color-text-primary, #ffffff);white-space:pre-wrap;line-height:1.7}.help-panel-footer{padding:6px 16px;background-color:var(--color-surface-light, #21262d);border-top:1px solid var(--color-surface-border, #30363d);border-radius:0 0 2px 2px;color:var(--color-secondary-info, #9e9e9e);font-size:.75rem;flex-shrink:0;display:flex;flex-direction:column;gap:2px}.help-panel-footer-dismiss{opacity:.6}@media(max-width:819.98px){.shell{grid-template-areas:\"status\" \"main\" \"resize\" \"terminal\";grid-template-columns:minmax(0,1fr)}.shell-menu{display:none}}.phone-menu-backdrop{position:absolute;inset:48px 0 0;z-index:50;background-color:color-mix(in srgb,var(--color-surface-dark) 70%,transparent)}.phone-menu{position:absolute;top:48px;bottom:0;left:0;z-index:51;display:block;width:min(280px,85vw);box-shadow:4px 0 16px color-mix(in srgb,var(--color-surface-dark) 60%,transparent)}\n"] }]
+            args: [{ selector: 'shell-root', imports: [StatusBar, SideMenu, MainContent, CommandTerminal, FaqModal, CdkTrapFocus], changeDetection: ChangeDetectionStrategy.Eager, template: "<div class=\"shell\" [style.--terminal-height]=\"terminalHeight()\" [class.is-dragging]=\"isDragging()\" [class.terminal-hidden]=\"!terminalVisible()\">\n  <shell-status-bar class=\"shell-status\" [class.disabled-zone]=\"isThinking()\">\n    <ng-content />\n  </shell-status-bar>\n  @if (isAuthenticated() && !isPhone()) {\n    <shell-side-menu class=\"shell-menu\" [class.disabled-zone]=\"isThinking()\" />\n  }\n  <shell-main-content class=\"shell-main\" [class.full-width]=\"!isAuthenticated()\" />\n  @if (terminalVisible()) {\n    <!-- On a phone too (scanner-phone-display D10), but never given the cursor there: see Shell.consoleFocusOnAppear. -->\n    <div class=\"shell-resize\" [class.dragging]=\"isDragging()\" (mousedown)=\"onResizeStart($event)\" (touchstart)=\"onResizeTouchStart($event)\"></div>\n    <shell-command-terminal class=\"shell-terminal\" [class.disabled-zone]=\"isThinking()\" [focusOnAppear]=\"consoleFocusOnAppear()\" />\n  }\n  @if (isAuthenticated() && phoneMenuOpen()) {\n    <!-- Phone menu (scanner-phone-display D9): the icon column's items, opened from the \u2630 button. -->\n    <div class=\"phone-menu-backdrop\" (click)=\"closePhoneMenu()\"></div>\n    <shell-side-menu\n      id=\"shell-phone-menu\"\n      class=\"phone-menu\"\n      [class.disabled-zone]=\"isThinking()\"\n      [drawer]=\"true\"\n      role=\"dialog\"\n      aria-modal=\"true\"\n      aria-label=\"Menu\"\n      cdkTrapFocus\n      [cdkTrapFocusAutoCapture]=\"true\"\n      (keydown.escape)=\"closePhoneMenu()\"\n    />\n  }\n  @if (isAuthenticated() && bypassActive()) {\n    <!-- authenticator-sign-in.prd.md D12: cannot be dismissed; no end time (the server never sends one). -->\n    <div class=\"bypass-banner\" role=\"status\">Sign-in code check is off.</div>\n  }\n  <faq-modal />\n\n  @if (helpOverlay(); as helpText) {\n    <div class=\"help-backdrop\" (click)=\"dismissHelp()\">\n      <div class=\"help-panel\" (click)=\"$event.stopPropagation()\" role=\"dialog\" aria-label=\"Command help\">\n        <div class=\"help-panel-header\">\n          <span class=\"help-panel-title\">Help</span>\n          <button class=\"help-panel-close\" type=\"button\" (click)=\"dismissHelp()\" aria-label=\"Close help\">\u2715</button>\n        </div>\n        <div class=\"help-panel-content\">{{ helpText }}</div>\n        <div class=\"help-panel-footer\">\n          <span>Tip: for most commands you can swap the first and second words \u2014 e.g. \"disable user\" works the same as \"user disable\"</span>\n          <span class=\"help-panel-footer-dismiss\">Press Escape, click outside, or start typing to close</span>\n        </div>\n      </div>\n    </div>\n  }\n</div>\n", styles: [".shell{position:relative;display:grid;grid-template-areas:\"status   status\" \"menu     main\" \"resize   resize\" \"terminal terminal\";grid-template-columns:56px 1fr;grid-template-rows:48px 1fr 4px var(--terminal-height, 160px);height:100vh;height:100dvh;width:100vw;overflow:hidden;background-color:var(--color-surface-dark)}.shell.terminal-hidden{grid-template-rows:48px 1fr 0 0}.shell-status{grid-area:status}.shell-menu{grid-area:menu}.shell-main{grid-area:main;overflow:hidden}.shell-main.full-width{grid-column:1 / -1}.shell-resize{grid-area:resize;cursor:row-resize;touch-action:none;background-color:var(--color-surface-border);transition:background-color .15s ease}.shell-resize:hover,.shell-resize.dragging{background-color:var(--color-interactive)}.shell-terminal{grid-area:terminal}.shell.is-dragging{user-select:none;-webkit-user-select:none}.disabled-zone{pointer-events:none;opacity:.4;transition:opacity .2s ease}.help-backdrop{position:absolute;inset:0;z-index:100;background-color:#000000a6;display:flex;align-items:center;justify-content:center}.help-panel{background-color:var(--color-surface, #161b22);border:2px solid var(--color-interactive, #00e5ff);border-radius:4px;width:70%;max-width:820px;max-height:75vh;display:flex;flex-direction:column;font-family:Roboto Mono,Courier New,monospace;font-size:.85rem}.help-panel-header{display:flex;justify-content:space-between;align-items:center;padding:8px 16px;background-color:var(--color-surface-light, #21262d);border-bottom:1px solid var(--color-interactive, #00e5ff);border-radius:2px 2px 0 0;flex-shrink:0}.help-panel-title{color:var(--color-interactive, #00e5ff);font-weight:700;letter-spacing:.05em;text-transform:uppercase;font-size:.75rem}.help-panel-close{background:none;border:1px solid var(--color-surface-border, #30363d);color:var(--color-secondary-info, #9e9e9e);cursor:pointer;padding:2px 8px;font-size:.9rem;line-height:1.4;border-radius:3px;transition:color .15s ease,border-color .15s ease}.help-panel-close:hover{color:var(--color-text-primary, #ffffff);border-color:var(--color-interactive, #00e5ff)}.help-panel-content{flex:1;overflow-y:auto;padding:16px 20px;color:var(--color-text-primary, #ffffff);white-space:pre-wrap;line-height:1.7}.help-panel-footer{padding:6px 16px;background-color:var(--color-surface-light, #21262d);border-top:1px solid var(--color-surface-border, #30363d);border-radius:0 0 2px 2px;color:var(--color-secondary-info, #9e9e9e);font-size:.75rem;flex-shrink:0;display:flex;flex-direction:column;gap:2px}.help-panel-footer-dismiss{opacity:.6}@media(max-width:819.98px){.shell{grid-template-areas:\"status\" \"main\" \"resize\" \"terminal\";grid-template-columns:minmax(0,1fr)}.shell-menu{display:none}}.phone-menu-backdrop{position:absolute;inset:48px 0 0;z-index:50;background-color:color-mix(in srgb,var(--color-surface-dark) 70%,transparent)}.phone-menu{position:absolute;top:48px;bottom:0;left:0;z-index:51;display:block;width:min(280px,85vw);box-shadow:4px 0 16px color-mix(in srgb,var(--color-surface-dark) 60%,transparent)}.bypass-banner{position:fixed;top:52px;right:12px;z-index:1000;padding:6px 12px;border:2px solid var(--color-loss);border-radius:4px;background-color:var(--color-surface);color:var(--color-loss);font-weight:600;pointer-events:none}\n"] }]
         }] });
 
+/*
+Created by Franz Zemen 2026-10-17
+License Type: UNLICENSED
+
+The 10 recovery codes, shown ONCE (authenticator-sign-in.prd.md D7), with Download (a text file made
+in the browser — nothing is stored on the server as a file) and Copy. "Continue" is the only way on,
+so the codes cannot scroll past unseen.
+*/
+class RecoveryCodes {
+    constructor() {
+        this.codes = input.required(/* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "codes" }] : /* istanbul ignore next */ []));
+        this.appName = input('BrokenStock', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "appName" }] : /* istanbul ignore next */ []));
+        this.username = input(undefined, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "username" }] : /* istanbul ignore next */ []));
+        this.done = output();
+        this.copied = signal(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "copied" }] : /* istanbul ignore next */ []));
+    }
+    download() {
+        const text = recoveryCodesFile(this.appName(), this.username(), this.codes());
+        const url = URL.createObjectURL(new Blob([text], { type: 'text/plain' }));
+        const a = document.createElement('a');
+        a.href = url;
+        a.download = `${this.appName().toLowerCase().replace(/[^a-z0-9]+/g, '-')}-recovery-codes.txt`;
+        a.click();
+        setTimeout(() => URL.revokeObjectURL(url));
+    }
+    copy() {
+        navigator.clipboard?.writeText(this.codes().join('\n')).then(() => this.copied.set(true)).catch(() => undefined);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: RecoveryCodes, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: RecoveryCodes, isStandalone: true, selector: "shell-recovery-codes", inputs: { codes: { classPropertyName: "codes", publicName: "codes", isSignal: true, isRequired: true, transformFunction: null }, appName: { classPropertyName: "appName", publicName: "appName", isSignal: true, isRequired: false, transformFunction: null }, username: { classPropertyName: "username", publicName: "username", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { done: "done" }, ngImport: i0, template: `
+    <div class="recovery-codes">
+      <p class="recovery-codes-lead text-text-primary"><strong>Save your recovery codes.</strong></p>
+      <p class="text-secondary-info">
+        Each one works once, in place of the 6-digit code, if you lose your phone.
+        They will not be shown again.
+      </p>
+      <ol class="recovery-codes-list">
+        @for (code of codes(); track code) {
+          <li><code>{{ code }}</code></li>
+        }
+      </ol>
+      <div class="recovery-codes-actions">
+        <button mat-stroked-button type="button" (click)="download()">
+          <mat-icon>download</mat-icon> Download
+        </button>
+        <button mat-stroked-button type="button" (click)="copy()">
+          <mat-icon>content_copy</mat-icon> {{ copied() ? 'Copied' : 'Copy' }}
+        </button>
+        <button mat-flat-button type="button" (click)="done.emit()">I have saved them — continue</button>
+      </div>
+    </div>
+  `, isInline: true, styles: [".recovery-codes{max-width:360px;padding:12px 16px;border-radius:4px;background-color:var(--color-surface-light);text-align:left;font-size:.9rem}.recovery-codes p{margin:0 0 8px}.recovery-codes-list{columns:2;margin:8px 0 12px;padding-left:1.5em;font-family:var(--shell-mono, monospace)}.recovery-codes-list li{margin:2px 0}.recovery-codes-actions{display:flex;flex-wrap:wrap;gap:8px}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i6.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: RecoveryCodes, decorators: [{
+            type: Component,
+            args: [{ selector: 'shell-recovery-codes', changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatButtonModule, MatIconModule], template: `
+    <div class="recovery-codes">
+      <p class="recovery-codes-lead text-text-primary"><strong>Save your recovery codes.</strong></p>
+      <p class="text-secondary-info">
+        Each one works once, in place of the 6-digit code, if you lose your phone.
+        They will not be shown again.
+      </p>
+      <ol class="recovery-codes-list">
+        @for (code of codes(); track code) {
+          <li><code>{{ code }}</code></li>
+        }
+      </ol>
+      <div class="recovery-codes-actions">
+        <button mat-stroked-button type="button" (click)="download()">
+          <mat-icon>download</mat-icon> Download
+        </button>
+        <button mat-stroked-button type="button" (click)="copy()">
+          <mat-icon>content_copy</mat-icon> {{ copied() ? 'Copied' : 'Copy' }}
+        </button>
+        <button mat-flat-button type="button" (click)="done.emit()">I have saved them — continue</button>
+      </div>
+    </div>
+  `, styles: [".recovery-codes{max-width:360px;padding:12px 16px;border-radius:4px;background-color:var(--color-surface-light);text-align:left;font-size:.9rem}.recovery-codes p{margin:0 0 8px}.recovery-codes-list{columns:2;margin:8px 0 12px;padding-left:1.5em;font-family:var(--shell-mono, monospace)}.recovery-codes-list li{margin:2px 0}.recovery-codes-actions{display:flex;flex-wrap:wrap;gap:8px}\n"] }]
+        }], propDecorators: { codes: [{ type: i0.Input, args: [{ isSignal: true, alias: "codes", required: true }] }], appName: [{ type: i0.Input, args: [{ isSignal: true, alias: "appName", required: false }] }], username: [{ type: i0.Input, args: [{ isSignal: true, alias: "username", required: false }] }], done: [{ type: i0.Output, args: ["done"] }] } });
+
 class Login {
     #postLoginRoute;
     #commandService;
@@ -3545,6 +3848,11 @@ class Login {
          */
         this.selected = signal(new Set(), /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "selected" }] : /* istanbul ignore next */ []));
+        /** The code or recovery code typed on the code step (authenticator-sign-in.prd.md). */
+        this.codeText = '';
+        /** Typing a recovery code instead of the 6-digit code. */
+        this.useRecovery = signal(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "useRecovery" }] : /* istanbul ignore next */ []));
         this.USERNAME_REGEX = USERNAME_REGEX;
         this.PASSWORD_REGEX = PASSWORD_REGEX;
         this.appName = inject(SHELL_APP_NAME, { optional: true }) ?? 'Application';
@@ -3655,6 +3963,37 @@ class Login {
         this.selected.set(new Set());
         this.#doLogin(false, { endSessionIds: ids });
     }
+    /** The code step: the 6-digit code (or a recovery code), with the credentials already accepted. */
+    onSubmitCode(event) {
+        event.preventDefault();
+        this.errors = [];
+        const typed = this.codeText.trim();
+        if (!typed)
+            return;
+        this.submitted = true;
+        this.#doLogin(false, this.useRecovery() ? { recoveryCode: typed } : { code: typed });
+    }
+    onToggleRecovery() {
+        this.useRecovery.set(!this.useRecovery());
+        this.codeText = '';
+        this.errors = [];
+    }
+    /** Back to the password form. */
+    onCancelCode() {
+        this.authenticationService.cancelCodeStep();
+        this.codeText = '';
+        this.useRecovery.set(false);
+        this.errors = [];
+        this.submitted = false;
+    }
+    /** New recovery codes were shown after sign-in; now go where sign-in was going. */
+    onRecoveryCodesSaved() {
+        this.authenticationService.acknowledgeRecoveryCodes();
+        // Setup can finish on an attempt that then stops at "already signed in
+        // elsewhere": the codes are shown first, and the session choice is still open.
+        if (this.authenticationService.authenticated())
+            this.#navigateAfterLogin();
+    }
     onCancelConflict() {
         this.authenticationService.clearConflict();
         this.selected.set(new Set());
@@ -3665,19 +4004,31 @@ class Login {
             .login(this.model, force, choice)
             .then(() => {
             this.#commandService.echoCommand(`login ${this.model.username}`);
-            this.router.navigateByUrl(this.#resolvePostLoginUrl()).then(() => {
-                setTimeout(() => this.#terminalFocusService.requestFocus());
-            }).catch(console.error);
+            this.codeText = '';
+            this.useRecovery.set(false);
+            // Setup finished during this sign-in: the codes are on screen and must be
+            // seen before the app takes over the page.
+            if (this.authenticationService.recoveryCodesToShow()) {
+                this.submitted = false;
+                return;
+            }
+            this.#navigateAfterLogin();
         })
             .catch((err) => {
-            if (err !== 'conflict') {
+            if (err !== 'conflict' && err !== CODE_STEP) {
                 this.errors.push({ ndx: 0, message: typeof err === 'string' ? err : 'Unable to login' });
             }
+            this.codeText = '';
             this.submitted = false;
         });
     }
+    #navigateAfterLogin() {
+        this.router.navigateByUrl(this.#resolvePostLoginUrl()).then(() => {
+            setTimeout(() => this.#terminalFocusService.requestFocus());
+        }).catch(console.error);
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: Login, deps: [{ token: AuthenticationService }, { token: i2$1.Router }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: Login, isStandalone: true, selector: "shell-login", ngImport: i0, template: "@let usernameRegex = USERNAME_REGEX;\n@let passwordRegex = PASSWORD_REGEX;\n<div class=\"login-container\">\n  <div class=\"login-header\">\n    <h2 class=\"text-text-primary\">{{ appName }}</h2>\n    <p class=\"text-secondary-info\">Sign in to continue</p>\n  </div>\n  <form #loginForm=\"ngForm\" (ngSubmit)=\"onSubmit($event)\" class=\"login-form\">\n    <mat-form-field appearance=\"outline\" class=\"login-field\">\n      <mat-label>Username</mat-label>\n      <input\n        #usernameInput\n        matInput\n        placeholder=\"Enter username\"\n        [(ngModel)]=\"model.username\"\n        name=\"username\"\n        [disabled]=\"submitted\"\n        required\n        regexValidator\n        [regex]=\"usernameRegex\"\n        (cdkAutofill)=\"onAutofill($event, usernameInput)\"\n      />\n    </mat-form-field>\n    <mat-form-field appearance=\"outline\" class=\"login-field\">\n      <mat-label>Password</mat-label>\n      <input\n        #passwordInput\n        matInput\n        placeholder=\"Enter password\"\n        [type]=\"hide() ? 'password' : 'text'\"\n        [(ngModel)]=\"model.password\"\n        name=\"password\"\n        [disabled]=\"submitted\"\n        regexValidator\n        [regex]=\"passwordRegex\"\n        (cdkAutofill)=\"onAutofill($event, passwordInput)\"\n      />\n      <button\n        mat-icon-button\n        matSuffix\n        type=\"button\"\n        (click)=\"clickEvent($event)\"\n        [attr.aria-label]=\"'Hide password'\"\n        [attr.aria-pressed]=\"hide()\"\n      >\n        <mat-icon>{{ hide() ? 'visibility_off' : 'visibility' }}</mat-icon>\n      </button>\n    </mat-form-field>\n    <button mat-flat-button type=\"submit\" [disabled]=\"submitted\" class=\"login-button\">\n      Login\n    </button>\n  </form>\n  @if (errors.length > 0) {\n    <div class=\"login-errors\">\n      @for (error of errors; track error.ndx) {\n        <div class=\"login-error text-loss\">{{ error.message }}</div>\n      }\n    </div>\n  }\n  @if (authenticationService.conflictSessions(); as sessions) {\n    <div class=\"login-conflict\">\n      <p class=\"text-secondary-info\">\n        You are already signed in {{ sessions.length === 1 ? 'somewhere else' : 'on other devices' }}:\n      </p>\n      @for (session of sessions; track session.sessionId ?? $index) {\n        <div class=\"login-conflict-session\">\n          @if (canEndIndividually()) {\n            <mat-checkbox\n              [checked]=\"isSelected(session)\"\n              [disabled]=\"!session.sessionId\"\n              (change)=\"toggleSelected(session, $event.checked)\"\n              [attr.aria-label]=\"'End ' + deviceLabel(session)\"\n            ></mat-checkbox>\n          }\n          <span class=\"text-secondary-info\">\n            <strong>{{ deviceLabel(session) }}</strong>\n            <!-- signedInAtEpoch is when the password was typed. startEpoch is\n                 when the row was written, which renewal resets \u2014 so it is shown\n                 only when there is nothing better, and labelled for what it is. -->\n            @if (session.signedInAtEpoch) {\n              \u2014 since {{ session.signedInAtEpoch | date:'short' }}\n            } @else {\n              \u2014 last active {{ session.startEpoch | date:'short' }}\n            }\n          </span>\n        </div>\n      }\n      <div class=\"login-conflict-actions\">\n        <button mat-stroked-button type=\"button\" (click)=\"onCancelConflict()\">Cancel</button>\n        @if (selectedCount() > 0) {\n          <button mat-stroked-button type=\"button\" (click)=\"onEndSelected()\">\n            End {{ selectedCount() === 1 ? 'that one' : selectedCount() + ' of them' }} and sign in\n          </button>\n        }\n        <button mat-stroked-button type=\"button\" (click)=\"onTakeOver()\">\n          {{ sessions.length === 1 ? 'End it and sign in' : 'End them all and sign in' }}\n        </button>\n        @if (authenticationService.additionalSignInAllowed()) {\n          <button mat-flat-button type=\"button\" (click)=\"onSignInAsWell()\">Sign in here as well</button>\n        }\n      </div>\n    </div>\n  }\n</div>\n", styles: [".login-container{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;text-align:center}.login-header{margin-bottom:32px}.login-header h2{font-size:1.5rem;font-weight:300;margin-bottom:8px}.login-form{display:flex;flex-direction:column;align-items:center;gap:8px;width:320px}.login-field{width:100%;text-align:left}.login-takeover{align-self:flex-start;margin-top:4px}.login-button{margin-top:8px;width:100%}.login-errors{margin-top:16px;max-width:320px}.login-conflict{margin-top:16px;max-width:320px;padding:12px 16px;border-radius:4px;background-color:var(--color-surface-light);font-size:.85rem;text-align:left}.login-conflict p{margin:0 0 8px}.login-conflict-session{display:flex;align-items:center;gap:8px;margin:4px 0}.login-conflict-actions{flex-wrap:wrap;display:flex;gap:8px;margin-top:12px;justify-content:flex-end}.login-error{padding:8px 12px;margin-bottom:4px;font-size:.85rem;border-radius:4px;background-color:var(--color-surface-light)}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]):not([formArray]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: MatLabel, selector: "mat-label" }, { kind: "directive", type: MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i5.CdkAutofill, selector: "[cdkAutofill]", outputs: ["cdkAutofill"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i6.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i6.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i7.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: RegexValidatorDirective, selector: "[regexValidator]", inputs: ["regex"] }, { kind: "ngmodule", type: TextFieldModule }, { kind: "pipe", type: DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: Login, isStandalone: true, selector: "shell-login", ngImport: i0, template: "@let usernameRegex = USERNAME_REGEX;\n@let passwordRegex = PASSWORD_REGEX;\n<div class=\"login-container\">\n  <div class=\"login-header\">\n    <h2 class=\"text-text-primary\">{{ appName }}</h2>\n    <p class=\"text-secondary-info\">Sign in to continue</p>\n  </div>\n  @let step = authenticationService.codeStep();\n  @if (authenticationService.recoveryCodesToShow(); as codes) {\n    <shell-recovery-codes [codes]=\"codes\" [appName]=\"appName\" [username]=\"model.username\" (done)=\"onRecoveryCodesSaved()\" />\n  } @else if (step !== 'none') {\n    <form (submit)=\"onSubmitCode($event)\" class=\"login-form\" aria-label=\"Authenticator code\">\n      @if (step === 'setup' && authenticationService.setupChallenge(); as challenge) {\n        <p class=\"text-secondary-info login-code-lead\">\n          Set up your authenticator: scan this with Google Authenticator (or Authy, 1Password),\n          then enter the 6-digit code it shows.\n        </p>\n        <img class=\"login-qr\" [src]=\"challenge.qr\" alt=\"QR code for your authenticator app\" width=\"200\" height=\"200\" />\n        <p class=\"text-secondary-info login-key\">Can't scan? Enter this key: <code>{{ challenge.key }}</code></p>\n      } @else {\n        <p class=\"text-secondary-info login-code-lead\">\n          @if (useRecovery()) {\n            Enter one of your recovery codes.\n          } @else {\n            Enter the 6-digit code from your authenticator app.\n          }\n        </p>\n      }\n      <mat-form-field appearance=\"outline\" class=\"login-field\">\n        <mat-label>{{ useRecovery() ? 'Recovery code' : 'Code' }}</mat-label>\n        <input\n          matInput\n          name=\"code\"\n          [(ngModel)]=\"codeText\"\n          [disabled]=\"submitted\"\n          [attr.inputmode]=\"useRecovery() ? 'text' : 'numeric'\"\n          [attr.autocomplete]=\"useRecovery() ? 'off' : 'one-time-code'\"\n          [attr.maxlength]=\"useRecovery() ? 16 : 7\"\n          [placeholder]=\"useRecovery() ? 'xxxxx-xxxxx' : '123456'\"\n          autofocus\n        />\n      </mat-form-field>\n      <button mat-flat-button type=\"submit\" [disabled]=\"submitted\" class=\"login-button\">\n        {{ step === 'setup' ? 'Finish setup and sign in' : 'Sign in' }}\n      </button>\n      <div class=\"login-code-links\">\n        @if (step === 'code') {\n          <button mat-button type=\"button\" (click)=\"onToggleRecovery()\">\n            {{ useRecovery() ? 'Use the 6-digit code' : 'Use a recovery code' }}\n          </button>\n        }\n        <button mat-button type=\"button\" (click)=\"onCancelCode()\">Back</button>\n      </div>\n    </form>\n  } @else {\n  <form #loginForm=\"ngForm\" (ngSubmit)=\"onSubmit($event)\" class=\"login-form\">\n    <mat-form-field appearance=\"outline\" class=\"login-field\">\n      <mat-label>Username</mat-label>\n      <input\n        #usernameInput\n        matInput\n        placeholder=\"Enter username\"\n        [(ngModel)]=\"model.username\"\n        name=\"username\"\n        [disabled]=\"submitted\"\n        required\n        regexValidator\n        [regex]=\"usernameRegex\"\n        (cdkAutofill)=\"onAutofill($event, usernameInput)\"\n      />\n    </mat-form-field>\n    <mat-form-field appearance=\"outline\" class=\"login-field\">\n      <mat-label>Password</mat-label>\n      <input\n        #passwordInput\n        matInput\n        placeholder=\"Enter password\"\n        [type]=\"hide() ? 'password' : 'text'\"\n        [(ngModel)]=\"model.password\"\n        name=\"password\"\n        [disabled]=\"submitted\"\n        regexValidator\n        [regex]=\"passwordRegex\"\n        (cdkAutofill)=\"onAutofill($event, passwordInput)\"\n      />\n      <button\n        mat-icon-button\n        matSuffix\n        type=\"button\"\n        (click)=\"clickEvent($event)\"\n        [attr.aria-label]=\"'Hide password'\"\n        [attr.aria-pressed]=\"hide()\"\n      >\n        <mat-icon>{{ hide() ? 'visibility_off' : 'visibility' }}</mat-icon>\n      </button>\n    </mat-form-field>\n    <button mat-flat-button type=\"submit\" [disabled]=\"submitted\" class=\"login-button\">\n      Login\n    </button>\n  </form>\n  }\n  @if (errors.length > 0) {\n    <div class=\"login-errors\">\n      @for (error of errors; track error.ndx) {\n        <div class=\"login-error text-loss\">{{ error.message }}</div>\n      }\n    </div>\n  }\n  @if (authenticationService.conflictSessions(); as sessions) {\n    <div class=\"login-conflict\">\n      <p class=\"text-secondary-info\">\n        You are already signed in {{ sessions.length === 1 ? 'somewhere else' : 'on other devices' }}:\n      </p>\n      @for (session of sessions; track session.sessionId ?? $index) {\n        <div class=\"login-conflict-session\">\n          @if (canEndIndividually()) {\n            <mat-checkbox\n              [checked]=\"isSelected(session)\"\n              [disabled]=\"!session.sessionId\"\n              (change)=\"toggleSelected(session, $event.checked)\"\n              [attr.aria-label]=\"'End ' + deviceLabel(session)\"\n            ></mat-checkbox>\n          }\n          <span class=\"text-secondary-info\">\n            <strong>{{ deviceLabel(session) }}</strong>\n            <!-- signedInAtEpoch is when the password was typed. startEpoch is\n                 when the row was written, which renewal resets \u2014 so it is shown\n                 only when there is nothing better, and labelled for what it is. -->\n            @if (session.signedInAtEpoch) {\n              \u2014 since {{ session.signedInAtEpoch | date:'short' }}\n            } @else {\n              \u2014 last active {{ session.startEpoch | date:'short' }}\n            }\n          </span>\n        </div>\n      }\n      <div class=\"login-conflict-actions\">\n        <button mat-stroked-button type=\"button\" (click)=\"onCancelConflict()\">Cancel</button>\n        @if (selectedCount() > 0) {\n          <button mat-stroked-button type=\"button\" (click)=\"onEndSelected()\">\n            End {{ selectedCount() === 1 ? 'that one' : selectedCount() + ' of them' }} and sign in\n          </button>\n        }\n        <button mat-stroked-button type=\"button\" (click)=\"onTakeOver()\">\n          {{ sessions.length === 1 ? 'End it and sign in' : 'End them all and sign in' }}\n        </button>\n        @if (authenticationService.additionalSignInAllowed()) {\n          <button mat-flat-button type=\"button\" (click)=\"onSignInAsWell()\">Sign in here as well</button>\n        }\n      </div>\n    </div>\n  }\n</div>\n", styles: [".login-container{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;text-align:center}.login-header{margin-bottom:32px}.login-header h2{font-size:1.5rem;font-weight:300;margin-bottom:8px}.login-form{display:flex;flex-direction:column;align-items:center;gap:8px;width:320px}.login-field{width:100%;text-align:left}.login-takeover{align-self:flex-start;margin-top:4px}.login-button{margin-top:8px;width:100%}.login-errors{margin-top:16px;max-width:320px}.login-conflict{margin-top:16px;max-width:320px;padding:12px 16px;border-radius:4px;background-color:var(--color-surface-light);font-size:.85rem;text-align:left}.login-conflict p{margin:0 0 8px}.login-conflict-session{display:flex;align-items:center;gap:8px;margin:4px 0}.login-conflict-actions{flex-wrap:wrap;display:flex;gap:8px;margin-top:12px;justify-content:flex-end}.login-error{padding:8px 12px;margin-bottom:4px;font-size:.85rem;border-radius:4px;background-color:var(--color-surface-light)}.login-code-lead{margin:0 0 8px;font-size:.9rem}.login-qr{display:block;margin:4px auto 8px;image-rendering:pixelated}.login-key{margin:0 0 8px;font-size:.8rem;word-break:break-all}.login-code-links{display:flex;justify-content:space-between;width:100%}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]):not([formArray]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: MatLabel, selector: "mat-label" }, { kind: "directive", type: MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i5.CdkAutofill, selector: "[cdkAutofill]", outputs: ["cdkAutofill"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i6.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i6.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i7.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: RegexValidatorDirective, selector: "[regexValidator]", inputs: ["regex"] }, { kind: "ngmodule", type: TextFieldModule }, { kind: "component", type: RecoveryCodes, selector: "shell-recovery-codes", inputs: ["codes", "appName", "username"], outputs: ["done"] }, { kind: "pipe", type: DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: Login, decorators: [{
             type: Component,
@@ -3693,9 +4044,240 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImpor
                         RegexValidatorDirective,
                         TextFieldModule,
                         DatePipe,
-                    ], template: "@let usernameRegex = USERNAME_REGEX;\n@let passwordRegex = PASSWORD_REGEX;\n<div class=\"login-container\">\n  <div class=\"login-header\">\n    <h2 class=\"text-text-primary\">{{ appName }}</h2>\n    <p class=\"text-secondary-info\">Sign in to continue</p>\n  </div>\n  <form #loginForm=\"ngForm\" (ngSubmit)=\"onSubmit($event)\" class=\"login-form\">\n    <mat-form-field appearance=\"outline\" class=\"login-field\">\n      <mat-label>Username</mat-label>\n      <input\n        #usernameInput\n        matInput\n        placeholder=\"Enter username\"\n        [(ngModel)]=\"model.username\"\n        name=\"username\"\n        [disabled]=\"submitted\"\n        required\n        regexValidator\n        [regex]=\"usernameRegex\"\n        (cdkAutofill)=\"onAutofill($event, usernameInput)\"\n      />\n    </mat-form-field>\n    <mat-form-field appearance=\"outline\" class=\"login-field\">\n      <mat-label>Password</mat-label>\n      <input\n        #passwordInput\n        matInput\n        placeholder=\"Enter password\"\n        [type]=\"hide() ? 'password' : 'text'\"\n        [(ngModel)]=\"model.password\"\n        name=\"password\"\n        [disabled]=\"submitted\"\n        regexValidator\n        [regex]=\"passwordRegex\"\n        (cdkAutofill)=\"onAutofill($event, passwordInput)\"\n      />\n      <button\n        mat-icon-button\n        matSuffix\n        type=\"button\"\n        (click)=\"clickEvent($event)\"\n        [attr.aria-label]=\"'Hide password'\"\n        [attr.aria-pressed]=\"hide()\"\n      >\n        <mat-icon>{{ hide() ? 'visibility_off' : 'visibility' }}</mat-icon>\n      </button>\n    </mat-form-field>\n    <button mat-flat-button type=\"submit\" [disabled]=\"submitted\" class=\"login-button\">\n      Login\n    </button>\n  </form>\n  @if (errors.length > 0) {\n    <div class=\"login-errors\">\n      @for (error of errors; track error.ndx) {\n        <div class=\"login-error text-loss\">{{ error.message }}</div>\n      }\n    </div>\n  }\n  @if (authenticationService.conflictSessions(); as sessions) {\n    <div class=\"login-conflict\">\n      <p class=\"text-secondary-info\">\n        You are already signed in {{ sessions.length === 1 ? 'somewhere else' : 'on other devices' }}:\n      </p>\n      @for (session of sessions; track session.sessionId ?? $index) {\n        <div class=\"login-conflict-session\">\n          @if (canEndIndividually()) {\n            <mat-checkbox\n              [checked]=\"isSelected(session)\"\n              [disabled]=\"!session.sessionId\"\n              (change)=\"toggleSelected(session, $event.checked)\"\n              [attr.aria-label]=\"'End ' + deviceLabel(session)\"\n            ></mat-checkbox>\n          }\n          <span class=\"text-secondary-info\">\n            <strong>{{ deviceLabel(session) }}</strong>\n            <!-- signedInAtEpoch is when the password was typed. startEpoch is\n                 when the row was written, which renewal resets \u2014 so it is shown\n                 only when there is nothing better, and labelled for what it is. -->\n            @if (session.signedInAtEpoch) {\n              \u2014 since {{ session.signedInAtEpoch | date:'short' }}\n            } @else {\n              \u2014 last active {{ session.startEpoch | date:'short' }}\n            }\n          </span>\n        </div>\n      }\n      <div class=\"login-conflict-actions\">\n        <button mat-stroked-button type=\"button\" (click)=\"onCancelConflict()\">Cancel</button>\n        @if (selectedCount() > 0) {\n          <button mat-stroked-button type=\"button\" (click)=\"onEndSelected()\">\n            End {{ selectedCount() === 1 ? 'that one' : selectedCount() + ' of them' }} and sign in\n          </button>\n        }\n        <button mat-stroked-button type=\"button\" (click)=\"onTakeOver()\">\n          {{ sessions.length === 1 ? 'End it and sign in' : 'End them all and sign in' }}\n        </button>\n        @if (authenticationService.additionalSignInAllowed()) {\n          <button mat-flat-button type=\"button\" (click)=\"onSignInAsWell()\">Sign in here as well</button>\n        }\n      </div>\n    </div>\n  }\n</div>\n", styles: [".login-container{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;text-align:center}.login-header{margin-bottom:32px}.login-header h2{font-size:1.5rem;font-weight:300;margin-bottom:8px}.login-form{display:flex;flex-direction:column;align-items:center;gap:8px;width:320px}.login-field{width:100%;text-align:left}.login-takeover{align-self:flex-start;margin-top:4px}.login-button{margin-top:8px;width:100%}.login-errors{margin-top:16px;max-width:320px}.login-conflict{margin-top:16px;max-width:320px;padding:12px 16px;border-radius:4px;background-color:var(--color-surface-light);font-size:.85rem;text-align:left}.login-conflict p{margin:0 0 8px}.login-conflict-session{display:flex;align-items:center;gap:8px;margin:4px 0}.login-conflict-actions{flex-wrap:wrap;display:flex;gap:8px;margin-top:12px;justify-content:flex-end}.login-error{padding:8px 12px;margin-bottom:4px;font-size:.85rem;border-radius:4px;background-color:var(--color-surface-light)}\n"] }]
+                        RecoveryCodes,
+                    ], template: "@let usernameRegex = USERNAME_REGEX;\n@let passwordRegex = PASSWORD_REGEX;\n<div class=\"login-container\">\n  <div class=\"login-header\">\n    <h2 class=\"text-text-primary\">{{ appName }}</h2>\n    <p class=\"text-secondary-info\">Sign in to continue</p>\n  </div>\n  @let step = authenticationService.codeStep();\n  @if (authenticationService.recoveryCodesToShow(); as codes) {\n    <shell-recovery-codes [codes]=\"codes\" [appName]=\"appName\" [username]=\"model.username\" (done)=\"onRecoveryCodesSaved()\" />\n  } @else if (step !== 'none') {\n    <form (submit)=\"onSubmitCode($event)\" class=\"login-form\" aria-label=\"Authenticator code\">\n      @if (step === 'setup' && authenticationService.setupChallenge(); as challenge) {\n        <p class=\"text-secondary-info login-code-lead\">\n          Set up your authenticator: scan this with Google Authenticator (or Authy, 1Password),\n          then enter the 6-digit code it shows.\n        </p>\n        <img class=\"login-qr\" [src]=\"challenge.qr\" alt=\"QR code for your authenticator app\" width=\"200\" height=\"200\" />\n        <p class=\"text-secondary-info login-key\">Can't scan? Enter this key: <code>{{ challenge.key }}</code></p>\n      } @else {\n        <p class=\"text-secondary-info login-code-lead\">\n          @if (useRecovery()) {\n            Enter one of your recovery codes.\n          } @else {\n            Enter the 6-digit code from your authenticator app.\n          }\n        </p>\n      }\n      <mat-form-field appearance=\"outline\" class=\"login-field\">\n        <mat-label>{{ useRecovery() ? 'Recovery code' : 'Code' }}</mat-label>\n        <input\n          matInput\n          name=\"code\"\n          [(ngModel)]=\"codeText\"\n          [disabled]=\"submitted\"\n          [attr.inputmode]=\"useRecovery() ? 'text' : 'numeric'\"\n          [attr.autocomplete]=\"useRecovery() ? 'off' : 'one-time-code'\"\n          [attr.maxlength]=\"useRecovery() ? 16 : 7\"\n          [placeholder]=\"useRecovery() ? 'xxxxx-xxxxx' : '123456'\"\n          autofocus\n        />\n      </mat-form-field>\n      <button mat-flat-button type=\"submit\" [disabled]=\"submitted\" class=\"login-button\">\n        {{ step === 'setup' ? 'Finish setup and sign in' : 'Sign in' }}\n      </button>\n      <div class=\"login-code-links\">\n        @if (step === 'code') {\n          <button mat-button type=\"button\" (click)=\"onToggleRecovery()\">\n            {{ useRecovery() ? 'Use the 6-digit code' : 'Use a recovery code' }}\n          </button>\n        }\n        <button mat-button type=\"button\" (click)=\"onCancelCode()\">Back</button>\n      </div>\n    </form>\n  } @else {\n  <form #loginForm=\"ngForm\" (ngSubmit)=\"onSubmit($event)\" class=\"login-form\">\n    <mat-form-field appearance=\"outline\" class=\"login-field\">\n      <mat-label>Username</mat-label>\n      <input\n        #usernameInput\n        matInput\n        placeholder=\"Enter username\"\n        [(ngModel)]=\"model.username\"\n        name=\"username\"\n        [disabled]=\"submitted\"\n        required\n        regexValidator\n        [regex]=\"usernameRegex\"\n        (cdkAutofill)=\"onAutofill($event, usernameInput)\"\n      />\n    </mat-form-field>\n    <mat-form-field appearance=\"outline\" class=\"login-field\">\n      <mat-label>Password</mat-label>\n      <input\n        #passwordInput\n        matInput\n        placeholder=\"Enter password\"\n        [type]=\"hide() ? 'password' : 'text'\"\n        [(ngModel)]=\"model.password\"\n        name=\"password\"\n        [disabled]=\"submitted\"\n        regexValidator\n        [regex]=\"passwordRegex\"\n        (cdkAutofill)=\"onAutofill($event, passwordInput)\"\n      />\n      <button\n        mat-icon-button\n        matSuffix\n        type=\"button\"\n        (click)=\"clickEvent($event)\"\n        [attr.aria-label]=\"'Hide password'\"\n        [attr.aria-pressed]=\"hide()\"\n      >\n        <mat-icon>{{ hide() ? 'visibility_off' : 'visibility' }}</mat-icon>\n      </button>\n    </mat-form-field>\n    <button mat-flat-button type=\"submit\" [disabled]=\"submitted\" class=\"login-button\">\n      Login\n    </button>\n  </form>\n  }\n  @if (errors.length > 0) {\n    <div class=\"login-errors\">\n      @for (error of errors; track error.ndx) {\n        <div class=\"login-error text-loss\">{{ error.message }}</div>\n      }\n    </div>\n  }\n  @if (authenticationService.conflictSessions(); as sessions) {\n    <div class=\"login-conflict\">\n      <p class=\"text-secondary-info\">\n        You are already signed in {{ sessions.length === 1 ? 'somewhere else' : 'on other devices' }}:\n      </p>\n      @for (session of sessions; track session.sessionId ?? $index) {\n        <div class=\"login-conflict-session\">\n          @if (canEndIndividually()) {\n            <mat-checkbox\n              [checked]=\"isSelected(session)\"\n              [disabled]=\"!session.sessionId\"\n              (change)=\"toggleSelected(session, $event.checked)\"\n              [attr.aria-label]=\"'End ' + deviceLabel(session)\"\n            ></mat-checkbox>\n          }\n          <span class=\"text-secondary-info\">\n            <strong>{{ deviceLabel(session) }}</strong>\n            <!-- signedInAtEpoch is when the password was typed. startEpoch is\n                 when the row was written, which renewal resets \u2014 so it is shown\n                 only when there is nothing better, and labelled for what it is. -->\n            @if (session.signedInAtEpoch) {\n              \u2014 since {{ session.signedInAtEpoch | date:'short' }}\n            } @else {\n              \u2014 last active {{ session.startEpoch | date:'short' }}\n            }\n          </span>\n        </div>\n      }\n      <div class=\"login-conflict-actions\">\n        <button mat-stroked-button type=\"button\" (click)=\"onCancelConflict()\">Cancel</button>\n        @if (selectedCount() > 0) {\n          <button mat-stroked-button type=\"button\" (click)=\"onEndSelected()\">\n            End {{ selectedCount() === 1 ? 'that one' : selectedCount() + ' of them' }} and sign in\n          </button>\n        }\n        <button mat-stroked-button type=\"button\" (click)=\"onTakeOver()\">\n          {{ sessions.length === 1 ? 'End it and sign in' : 'End them all and sign in' }}\n        </button>\n        @if (authenticationService.additionalSignInAllowed()) {\n          <button mat-flat-button type=\"button\" (click)=\"onSignInAsWell()\">Sign in here as well</button>\n        }\n      </div>\n    </div>\n  }\n</div>\n", styles: [".login-container{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;text-align:center}.login-header{margin-bottom:32px}.login-header h2{font-size:1.5rem;font-weight:300;margin-bottom:8px}.login-form{display:flex;flex-direction:column;align-items:center;gap:8px;width:320px}.login-field{width:100%;text-align:left}.login-takeover{align-self:flex-start;margin-top:4px}.login-button{margin-top:8px;width:100%}.login-errors{margin-top:16px;max-width:320px}.login-conflict{margin-top:16px;max-width:320px;padding:12px 16px;border-radius:4px;background-color:var(--color-surface-light);font-size:.85rem;text-align:left}.login-conflict p{margin:0 0 8px}.login-conflict-session{display:flex;align-items:center;gap:8px;margin:4px 0}.login-conflict-actions{flex-wrap:wrap;display:flex;gap:8px;margin-top:12px;justify-content:flex-end}.login-error{padding:8px 12px;margin-bottom:4px;font-size:.85rem;border-radius:4px;background-color:var(--color-surface-light)}.login-code-lead{margin:0 0 8px;font-size:.9rem}.login-qr{display:block;margin:4px auto 8px;image-rendering:pixelated}.login-key{margin:0 0 8px;font-size:.8rem;word-break:break-all}.login-code-links{display:flex;justify-content:space-between;width:100%}\n"] }]
         }], ctorParameters: () => [{ type: AuthenticationService }, { type: i2$1.Router }] });
 
+/*
+Created by Franz Zemen 2026-10-17
+License Type: UNLICENSED
+
+Settings → Sign-in code (authenticator-sign-in.prd.md D5, D7). Shared by every app: each routes to
+`AuthenticatorSettings` wherever its settings live.
+
+  - Set up an authenticator (or replace one): the password again, plus a current code or a
+    recovery code when replacing → QR + typed-in key → the first code → 10 recovery codes.
+  - New recovery codes: a current code → 10 new ones; the old ones stop working.
+
+⛔ There is deliberately no "remove" and no "turn off" here (D13). Those are AWS-only; the screen
+says how to get them done.
+*/
+class AuthenticatorSettings {
+    constructor() {
+        this.#auth = inject(AuthenticationService);
+        this.appName = inject(SHELL_APP_NAME, { optional: true }) ?? 'BrokenStock';
+        this.status = signal(undefined, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "status" }] : /* istanbul ignore next */ []));
+        this.mode = signal('view', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "mode" }] : /* istanbul ignore next */ []));
+        this.busy = signal(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "busy" }] : /* istanbul ignore next */ []));
+        this.error = signal(undefined, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "error" }] : /* istanbul ignore next */ []));
+        this.challenge = signal(undefined, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "challenge" }] : /* istanbul ignore next */ []));
+        this.codes = signal(undefined, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "codes" }] : /* istanbul ignore next */ []));
+        this.useRecovery = signal(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "useRecovery" }] : /* istanbul ignore next */ []));
+        this.password = '';
+        this.code = '';
+    }
+    #auth;
+    ngOnInit() {
+        void this.#load();
+    }
+    async #load() {
+        try {
+            this.status.set(await this.#auth.authenticatorStatus());
+        }
+        catch (err) {
+            this.error.set(err instanceof AuthenticatorError ? err.message : 'Could not load your sign-in code settings.');
+        }
+    }
+    begin(mode) {
+        this.#reset();
+        this.mode.set(mode);
+    }
+    cancel() {
+        this.#reset();
+        this.mode.set('view');
+    }
+    toggleRecovery() {
+        this.useRecovery.set(!this.useRecovery());
+        this.code = '';
+    }
+    /** Password (and current code when replacing) → QR. */
+    async start(event) {
+        event.preventDefault();
+        await this.#run(async () => {
+            const current = this.status()?.enrolled
+                ? (this.useRecovery() ? { recoveryCode: this.code.trim() } : { code: this.code.trim() })
+                : {};
+            this.challenge.set(await this.#auth.startAuthenticatorSetup(this.password, current));
+            this.password = '';
+            this.code = '';
+            this.useRecovery.set(false);
+            this.mode.set('scan');
+        });
+    }
+    /** The first code from the newly scanned app → recovery codes. */
+    async confirm(event) {
+        event.preventDefault();
+        await this.#run(async () => {
+            this.codes.set(await this.#auth.confirmAuthenticatorSetup(this.code.trim()));
+            this.challenge.set(undefined);
+            this.code = '';
+            this.mode.set('codes');
+        });
+    }
+    async reissue(event) {
+        event.preventDefault();
+        await this.#run(async () => {
+            this.codes.set(await this.#auth.reissueRecoveryCodes(this.code.trim()));
+            this.code = '';
+            this.mode.set('codes');
+        });
+    }
+    async codesSaved() {
+        this.#reset();
+        this.mode.set('view');
+        await this.#load();
+    }
+    async #run(work) {
+        this.busy.set(true);
+        this.error.set(undefined);
+        try {
+            await work();
+        }
+        catch (err) {
+            this.error.set(err instanceof AuthenticatorError ? err.message : 'Something went wrong');
+            this.code = '';
+        }
+        finally {
+            this.busy.set(false);
+        }
+    }
+    #reset() {
+        this.password = '';
+        this.code = '';
+        this.error.set(undefined);
+        this.challenge.set(undefined);
+        this.codes.set(undefined);
+        this.useRecovery.set(false);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: AuthenticatorSettings, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: AuthenticatorSettings, isStandalone: true, selector: "shell-authenticator-settings", ngImport: i0, template: "<section class=\"authenticator-settings\">\n  <h2 class=\"text-text-primary\">Sign-in code</h2>\n  <p class=\"text-secondary-info\">\n    Signing in asks for your password and a 6-digit code from an authenticator app on your phone\n    (Google Authenticator, Authy, 1Password).\n  </p>\n\n  @if (status(); as s) {\n    @switch (mode()) {\n      @case ('view') {\n        <dl class=\"authenticator-facts\">\n          <dt>Authenticator</dt>\n          <dd>{{ s.enrolled ? 'Set up' : 'Not set up' }}</dd>\n          @if (s.enrolled) {\n            <dt>Recovery codes left</dt>\n            <dd [class.text-loss]=\"s.recoveryCodesLeft <= 2\">{{ s.recoveryCodesLeft }} of 10</dd>\n          }\n          <dt>Code required at sign-in</dt>\n          <dd>{{ s.enrolled ? 'Yes' : (s.codeRequired ? 'Yes' : 'Not yet \u2014 set one up') }}</dd>\n        </dl>\n        <div class=\"authenticator-actions\">\n          <button mat-flat-button type=\"button\" (click)=\"begin('password')\">\n            {{ s.enrolled ? 'Replace authenticator' : 'Set up authenticator' }}\n          </button>\n          @if (s.enrolled) {\n            <button mat-stroked-button type=\"button\" (click)=\"begin('reissue')\">New recovery codes</button>\n          }\n        </div>\n        <p class=\"text-secondary-info authenticator-note\">\n          Lost your phone? Sign in with a recovery code, then replace the authenticator here.\n          No recovery codes left? Only the administrator can reset it, from AWS \u2014 there is no way\n          to switch the code off from inside the app.\n        </p>\n      }\n\n      @case ('password') {\n        <form class=\"authenticator-form\" (submit)=\"start($event)\">\n          <mat-form-field appearance=\"outline\">\n            <mat-label>Password</mat-label>\n            <input matInput type=\"password\" name=\"password\" [(ngModel)]=\"password\" autocomplete=\"current-password\" [disabled]=\"busy()\" />\n          </mat-form-field>\n          @if (s.enrolled) {\n            <mat-form-field appearance=\"outline\">\n              <mat-label>{{ useRecovery() ? 'Recovery code' : 'Current 6-digit code' }}</mat-label>\n              <input matInput name=\"code\" [(ngModel)]=\"code\" [attr.inputmode]=\"useRecovery() ? 'text' : 'numeric'\"\n                     [attr.autocomplete]=\"useRecovery() ? 'off' : 'one-time-code'\" [disabled]=\"busy()\" />\n            </mat-form-field>\n            <button mat-button type=\"button\" class=\"authenticator-link\" (click)=\"toggleRecovery()\">\n              {{ useRecovery() ? 'Use the 6-digit code' : 'Lost the phone? Use a recovery code' }}\n            </button>\n          }\n          <div class=\"authenticator-actions\">\n            <button mat-button type=\"button\" (click)=\"cancel()\">Cancel</button>\n            <button mat-flat-button type=\"submit\" [disabled]=\"busy() || !password || (s.enrolled && !code.trim())\">Continue</button>\n          </div>\n        </form>\n      }\n\n      @case ('scan') {\n        @if (challenge(); as c) {\n          <form class=\"authenticator-form\" (submit)=\"confirm($event)\">\n            <p class=\"text-secondary-info\">Scan this with your authenticator app, then enter the 6-digit code it shows.</p>\n            <img class=\"authenticator-qr\" [src]=\"c.qr\" alt=\"QR code for your authenticator app\" width=\"200\" height=\"200\" />\n            <p class=\"text-secondary-info authenticator-key\">Can't scan? Enter this key: <code>{{ c.key }}</code></p>\n            <mat-form-field appearance=\"outline\">\n              <mat-label>Code</mat-label>\n              <input matInput name=\"code\" [(ngModel)]=\"code\" inputmode=\"numeric\" autocomplete=\"one-time-code\" [disabled]=\"busy()\" />\n            </mat-form-field>\n            <div class=\"authenticator-actions\">\n              <button mat-button type=\"button\" (click)=\"cancel()\">Cancel</button>\n              <button mat-flat-button type=\"submit\" [disabled]=\"busy() || !code.trim()\">Finish setup</button>\n            </div>\n            @if (s.enrolled) {\n              <p class=\"text-secondary-info authenticator-note\">Your old authenticator keeps working until you finish.</p>\n            }\n          </form>\n        }\n      }\n\n      @case ('reissue') {\n        <form class=\"authenticator-form\" (submit)=\"reissue($event)\">\n          <p class=\"text-secondary-info\">Ten new recovery codes. The ones you have now will stop working.</p>\n          <mat-form-field appearance=\"outline\">\n            <mat-label>Current 6-digit code</mat-label>\n            <input matInput name=\"code\" [(ngModel)]=\"code\" inputmode=\"numeric\" autocomplete=\"one-time-code\" [disabled]=\"busy()\" />\n          </mat-form-field>\n          <div class=\"authenticator-actions\">\n            <button mat-button type=\"button\" (click)=\"cancel()\">Cancel</button>\n            <button mat-flat-button type=\"submit\" [disabled]=\"busy() || !code.trim()\">Make new codes</button>\n          </div>\n        </form>\n      }\n\n      @case ('codes') {\n        @if (codes(); as list) {\n          <shell-recovery-codes [codes]=\"list\" [appName]=\"appName\" (done)=\"codesSaved()\" />\n        }\n      }\n    }\n  }\n\n  @if (error(); as message) {\n    <p class=\"text-loss authenticator-error\" role=\"alert\">{{ message }}</p>\n  }\n</section>\n", styles: [".authenticator-settings{max-width:480px;padding:16px}.authenticator-settings h2{font-size:1.25rem;font-weight:400;margin:0 0 8px}.authenticator-facts{display:grid;grid-template-columns:max-content 1fr;gap:4px 16px;margin:16px 0}.authenticator-facts dt{color:var(--color-secondary-info)}.authenticator-facts dd{margin:0}.authenticator-form{display:flex;flex-direction:column;gap:4px;max-width:320px;margin-top:12px}.authenticator-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}.authenticator-link{align-self:flex-start}.authenticator-note{margin-top:16px;font-size:.85rem}.authenticator-qr{display:block;margin:4px 0 8px;image-rendering:pixelated}.authenticator-key{font-size:.8rem;word-break:break-all}.authenticator-error{margin-top:12px}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]):not([formArray]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i6.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: RecoveryCodes, selector: "shell-recovery-codes", inputs: ["codes", "appName", "username"], outputs: ["done"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: AuthenticatorSettings, decorators: [{
+            type: Component,
+            args: [{ selector: 'shell-authenticator-settings', changeDetection: ChangeDetectionStrategy.OnPush, imports: [FormsModule, MatButtonModule, MatFormFieldModule, MatInputModule, RecoveryCodes], template: "<section class=\"authenticator-settings\">\n  <h2 class=\"text-text-primary\">Sign-in code</h2>\n  <p class=\"text-secondary-info\">\n    Signing in asks for your password and a 6-digit code from an authenticator app on your phone\n    (Google Authenticator, Authy, 1Password).\n  </p>\n\n  @if (status(); as s) {\n    @switch (mode()) {\n      @case ('view') {\n        <dl class=\"authenticator-facts\">\n          <dt>Authenticator</dt>\n          <dd>{{ s.enrolled ? 'Set up' : 'Not set up' }}</dd>\n          @if (s.enrolled) {\n            <dt>Recovery codes left</dt>\n            <dd [class.text-loss]=\"s.recoveryCodesLeft <= 2\">{{ s.recoveryCodesLeft }} of 10</dd>\n          }\n          <dt>Code required at sign-in</dt>\n          <dd>{{ s.enrolled ? 'Yes' : (s.codeRequired ? 'Yes' : 'Not yet \u2014 set one up') }}</dd>\n        </dl>\n        <div class=\"authenticator-actions\">\n          <button mat-flat-button type=\"button\" (click)=\"begin('password')\">\n            {{ s.enrolled ? 'Replace authenticator' : 'Set up authenticator' }}\n          </button>\n          @if (s.enrolled) {\n            <button mat-stroked-button type=\"button\" (click)=\"begin('reissue')\">New recovery codes</button>\n          }\n        </div>\n        <p class=\"text-secondary-info authenticator-note\">\n          Lost your phone? Sign in with a recovery code, then replace the authenticator here.\n          No recovery codes left? Only the administrator can reset it, from AWS \u2014 there is no way\n          to switch the code off from inside the app.\n        </p>\n      }\n\n      @case ('password') {\n        <form class=\"authenticator-form\" (submit)=\"start($event)\">\n          <mat-form-field appearance=\"outline\">\n            <mat-label>Password</mat-label>\n            <input matInput type=\"password\" name=\"password\" [(ngModel)]=\"password\" autocomplete=\"current-password\" [disabled]=\"busy()\" />\n          </mat-form-field>\n          @if (s.enrolled) {\n            <mat-form-field appearance=\"outline\">\n              <mat-label>{{ useRecovery() ? 'Recovery code' : 'Current 6-digit code' }}</mat-label>\n              <input matInput name=\"code\" [(ngModel)]=\"code\" [attr.inputmode]=\"useRecovery() ? 'text' : 'numeric'\"\n                     [attr.autocomplete]=\"useRecovery() ? 'off' : 'one-time-code'\" [disabled]=\"busy()\" />\n            </mat-form-field>\n            <button mat-button type=\"button\" class=\"authenticator-link\" (click)=\"toggleRecovery()\">\n              {{ useRecovery() ? 'Use the 6-digit code' : 'Lost the phone? Use a recovery code' }}\n            </button>\n          }\n          <div class=\"authenticator-actions\">\n            <button mat-button type=\"button\" (click)=\"cancel()\">Cancel</button>\n            <button mat-flat-button type=\"submit\" [disabled]=\"busy() || !password || (s.enrolled && !code.trim())\">Continue</button>\n          </div>\n        </form>\n      }\n\n      @case ('scan') {\n        @if (challenge(); as c) {\n          <form class=\"authenticator-form\" (submit)=\"confirm($event)\">\n            <p class=\"text-secondary-info\">Scan this with your authenticator app, then enter the 6-digit code it shows.</p>\n            <img class=\"authenticator-qr\" [src]=\"c.qr\" alt=\"QR code for your authenticator app\" width=\"200\" height=\"200\" />\n            <p class=\"text-secondary-info authenticator-key\">Can't scan? Enter this key: <code>{{ c.key }}</code></p>\n            <mat-form-field appearance=\"outline\">\n              <mat-label>Code</mat-label>\n              <input matInput name=\"code\" [(ngModel)]=\"code\" inputmode=\"numeric\" autocomplete=\"one-time-code\" [disabled]=\"busy()\" />\n            </mat-form-field>\n            <div class=\"authenticator-actions\">\n              <button mat-button type=\"button\" (click)=\"cancel()\">Cancel</button>\n              <button mat-flat-button type=\"submit\" [disabled]=\"busy() || !code.trim()\">Finish setup</button>\n            </div>\n            @if (s.enrolled) {\n              <p class=\"text-secondary-info authenticator-note\">Your old authenticator keeps working until you finish.</p>\n            }\n          </form>\n        }\n      }\n\n      @case ('reissue') {\n        <form class=\"authenticator-form\" (submit)=\"reissue($event)\">\n          <p class=\"text-secondary-info\">Ten new recovery codes. The ones you have now will stop working.</p>\n          <mat-form-field appearance=\"outline\">\n            <mat-label>Current 6-digit code</mat-label>\n            <input matInput name=\"code\" [(ngModel)]=\"code\" inputmode=\"numeric\" autocomplete=\"one-time-code\" [disabled]=\"busy()\" />\n          </mat-form-field>\n          <div class=\"authenticator-actions\">\n            <button mat-button type=\"button\" (click)=\"cancel()\">Cancel</button>\n            <button mat-flat-button type=\"submit\" [disabled]=\"busy() || !code.trim()\">Make new codes</button>\n          </div>\n        </form>\n      }\n\n      @case ('codes') {\n        @if (codes(); as list) {\n          <shell-recovery-codes [codes]=\"list\" [appName]=\"appName\" (done)=\"codesSaved()\" />\n        }\n      }\n    }\n  }\n\n  @if (error(); as message) {\n    <p class=\"text-loss authenticator-error\" role=\"alert\">{{ message }}</p>\n  }\n</section>\n", styles: [".authenticator-settings{max-width:480px;padding:16px}.authenticator-settings h2{font-size:1.25rem;font-weight:400;margin:0 0 8px}.authenticator-facts{display:grid;grid-template-columns:max-content 1fr;gap:4px 16px;margin:16px 0}.authenticator-facts dt{color:var(--color-secondary-info)}.authenticator-facts dd{margin:0}.authenticator-form{display:flex;flex-direction:column;gap:4px;max-width:320px;margin-top:12px}.authenticator-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}.authenticator-link{align-self:flex-start}.authenticator-note{margin-top:16px;font-size:.85rem}.authenticator-qr{display:block;margin:4px 0 8px;image-rendering:pixelated}.authenticator-key{font-size:.8rem;word-break:break-all}.authenticator-error{margin-top:12px}\n"] }]
+        }] });
+
+/*
+Created by Franz Zemen 2026-10-17
+License Type: UNLICENSED
+
+"Enter your code" — the reusable dialog for the on-demand check (authenticator-sign-in.prd.md D15).
+Live Trading opens it to arm trading; anything else that needs the code again can too.
+
+Closes with the time the server recorded (epoch ms), or `undefined` if cancelled. Wrong codes keep
+the dialog open with the reason in plain words; after five, "Too many attempts." and nothing more.
+
+    const at = await openCodeDialog(dialog, {title: 'Arm live trading', purpose: 'arm-live-trading'});
+*/
+class CodeDialog {
+    constructor() {
+        this.data = inject(MAT_DIALOG_DATA);
+        this.dialogRef = inject((MatDialogRef));
+        this.#auth = inject(AuthenticationService);
+        this.text = '';
+        this.useRecovery = signal(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "useRecovery" }] : /* istanbul ignore next */ []));
+        this.busy = signal(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "busy" }] : /* istanbul ignore next */ []));
+        this.error = signal(undefined, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "error" }] : /* istanbul ignore next */ []));
+    }
+    #auth;
+    toggleRecovery() {
+        this.useRecovery.set(!this.useRecovery());
+        this.text = '';
+        this.error.set(undefined);
+    }
+    async submit(event) {
+        event.preventDefault();
+        const typed = this.text.trim();
+        if (!typed)
+            return;
+        this.busy.set(true);
+        this.error.set(undefined);
+        try {
+            const at = await this.#auth.verifyCode(this.useRecovery() ? { recoveryCode: typed } : { code: typed }, this.data.purpose);
+            this.dialogRef.close(at);
+        }
+        catch (err) {
+            this.error.set(err instanceof AuthenticatorError ? err.message : 'Something went wrong');
+            this.text = '';
+        }
+        finally {
+            this.busy.set(false);
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: CodeDialog, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: CodeDialog, isStandalone: true, selector: "shell-code-dialog", ngImport: i0, template: `
+    <h2 mat-dialog-title>{{ data.title }}</h2>
+    <form (submit)="submit($event)">
+      <mat-dialog-content>
+        <p>{{ data.message ?? (useRecovery() ? 'Enter one of your recovery codes.' : 'Enter the 6-digit code from your authenticator app.') }}</p>
+        <mat-form-field appearance="outline" class="code-field">
+          <mat-label>{{ useRecovery() ? 'Recovery code' : 'Code' }}</mat-label>
+          <input matInput name="code" [(ngModel)]="text" [disabled]="busy()"
+                 [attr.inputmode]="useRecovery() ? 'text' : 'numeric'"
+                 [attr.autocomplete]="useRecovery() ? 'off' : 'one-time-code'" cdkFocusInitial />
+        </mat-form-field>
+        @if (error(); as message) {
+          <p class="code-error text-loss" role="alert">{{ message }}</p>
+        }
+      </mat-dialog-content>
+      <mat-dialog-actions align="end">
+        <button mat-button type="button" (click)="toggleRecovery()">{{ useRecovery() ? 'Use the 6-digit code' : 'Use a recovery code' }}</button>
+        <button mat-button type="button" (click)="dialogRef.close(undefined)">Cancel</button>
+        <button mat-flat-button type="submit" [disabled]="busy() || !text.trim()">{{ data.confirmLabel ?? 'Confirm' }}</button>
+      </mat-dialog-actions>
+    </form>
+  `, isInline: true, styles: [":host{display:block}.code-field{width:100%}.code-error{margin:0}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]):not([formArray]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i2$2.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i2$2.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i2$2.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i6.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: CodeDialog, decorators: [{
+            type: Component,
+            args: [{ selector: 'shell-code-dialog', changeDetection: ChangeDetectionStrategy.OnPush, imports: [FormsModule, MatDialogModule, MatButtonModule, MatFormFieldModule, MatInputModule], template: `
+    <h2 mat-dialog-title>{{ data.title }}</h2>
+    <form (submit)="submit($event)">
+      <mat-dialog-content>
+        <p>{{ data.message ?? (useRecovery() ? 'Enter one of your recovery codes.' : 'Enter the 6-digit code from your authenticator app.') }}</p>
+        <mat-form-field appearance="outline" class="code-field">
+          <mat-label>{{ useRecovery() ? 'Recovery code' : 'Code' }}</mat-label>
+          <input matInput name="code" [(ngModel)]="text" [disabled]="busy()"
+                 [attr.inputmode]="useRecovery() ? 'text' : 'numeric'"
+                 [attr.autocomplete]="useRecovery() ? 'off' : 'one-time-code'" cdkFocusInitial />
+        </mat-form-field>
+        @if (error(); as message) {
+          <p class="code-error text-loss" role="alert">{{ message }}</p>
+        }
+      </mat-dialog-content>
+      <mat-dialog-actions align="end">
+        <button mat-button type="button" (click)="toggleRecovery()">{{ useRecovery() ? 'Use the 6-digit code' : 'Use a recovery code' }}</button>
+        <button mat-button type="button" (click)="dialogRef.close(undefined)">Cancel</button>
+        <button mat-flat-button type="submit" [disabled]="busy() || !text.trim()">{{ data.confirmLabel ?? 'Confirm' }}</button>
+      </mat-dialog-actions>
+    </form>
+  `, styles: [":host{display:block}.code-field{width:100%}.code-error{margin:0}\n"] }]
+        }] });
+/** Opens the dialog; resolves with the recorded time (epoch ms), or undefined when cancelled. */
+function openCodeDialog(dialog, data) {
+    return firstValueFrom(dialog.open(CodeDialog, { data, width: '360px' }).afterClosed());
+}
+
 class ConfirmDialog {
     constructor() {
         this.data = inject(MAT_DIALOG_DATA);
@@ -3714,7 +4296,7 @@ class ConfirmDialog {
       <button mat-button (click)="dialogRef.close(false)">{{ data.cancelLabel ?? 'Cancel' }}</button>
       <button mat-flat-button color="warn" (click)="dialogRef.close(true)">{{ data.confirmLabel ?? 'Confirm' }}</button>
     </mat-dialog-actions>
-  `, isInline: true, styles: [":host{display:block}.warning-message{color:var(--color-warning);margin-top:8px}\n"], dependencies: [{ kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i1$2.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1$2.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1$2.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i6.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
+  `, isInline: true, styles: [":host{display:block}.warning-message{color:var(--color-warning);margin-top:8px}\n"], dependencies: [{ kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i2$2.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i2$2.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i2$2.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i6.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: ConfirmDialog, decorators: [{
             type: Component,
@@ -3742,5 +4324,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { AuthenticationService, CLEAR_USAGE, CommandRegistryService, CommandService, CommandTerminal, ConfirmDialog, FAQ_CONTENT_LOADER, FAQ_DEV_EDITOR, FAQ_DEV_MODE, FAQ_DEV_WORKSPACE_ROOT, FAQ_PUBLIC_PUBLISHER, FAQ_PUBLIC_SITE_BASE_URL, FaqAuthoringPanel, FaqHistoryService, FaqMarkdownRendererService, FaqModal, FaqService, HELP_USAGE, HttpFaqContentLoader, KeyboardShortcutService, Login, MainContent, PhoneLayoutService, PublicFaqIndex, PublicFaqPage, PublicFaqToc, RegexValidatorDirective, SESSION_TOKEN_KEY, SHELL_APP_NAME, SHELL_AUTH_URLS, SHELL_COMMANDS, SHELL_MENU_ITEMS, SHELL_PHONE_MEDIA_QUERY, SHELL_POST_LOGIN_ROUTE, SHELL_SHARED_SESSION, SessionTokenStore, Shell, SideMenu, StatusBar, TerminalFocusService, TerminalVisibilityService, ThemeService, ThinkingService, audienceAllowed, authGuard, authInterceptor, buildFallbackChain, decideRenewal, guestGuard, matchesRoute, provideShellConfig, tokenize };
+export { AuthenticationService, AuthenticatorError, AuthenticatorSettings, CLEAR_USAGE, CODE_STEP, CodeDialog, CommandRegistryService, CommandService, CommandTerminal, ConfirmDialog, FAQ_CONTENT_LOADER, FAQ_DEV_EDITOR, FAQ_DEV_MODE, FAQ_DEV_WORKSPACE_ROOT, FAQ_PUBLIC_PUBLISHER, FAQ_PUBLIC_SITE_BASE_URL, FaqAuthoringPanel, FaqHistoryService, FaqMarkdownRendererService, FaqModal, FaqService, HELP_USAGE, HttpFaqContentLoader, KeyboardShortcutService, Login, MainContent, PhoneLayoutService, PublicFaqIndex, PublicFaqPage, PublicFaqToc, RecoveryCodes, RegexValidatorDirective, SESSION_TOKEN_KEY, SHELL_APP_NAME, SHELL_AUTH_URLS, SHELL_COMMANDS, SHELL_MENU_ITEMS, SHELL_PHONE_MEDIA_QUERY, SHELL_POST_LOGIN_ROUTE, SHELL_SHARED_SESSION, SessionTokenStore, Shell, SideMenu, StatusBar, TOO_MANY_ATTEMPTS, TerminalFocusService, TerminalVisibilityService, ThemeService, ThinkingService, audienceAllowed, authGuard, authInterceptor, authenticatorMessage, buildFallbackChain, buildLoginBody, decideRenewal, guestGuard, matchesRoute, openCodeDialog, provideShellConfig, recoveryCodesFile, tokenize };
 //# sourceMappingURL=franzzemen-brokenstock-shell.mjs.map