Merge branch 'master' into feat/blazor-receiver-ui

Integrate YARP to forward all /api/** requests from the browser to the backend EnvelopeGenerator.API service. Add Yarp.ReverseProxy package, configure proxy routes and clusters in appsettings.json, and register YARP in Program.cs. Add API base URL configuration and register ReceiverApiClient, LocalizationService, and ReceiverAuthState as scoped services to support both server and client scenarios. This improves API/UI separation and authentication handling.

EnvelopeGenerator.API/Controllers/AnnotationController.cs

@@ -1,5 +1,6 @@
 using DigitalData.Core.Abstraction.Application.DTO;
 using DigitalData.Core.Exceptions;
+using EnvelopeGenerator.Application.Common.Dto;
 using EnvelopeGenerator.Application.Common.Extensions;
 using EnvelopeGenerator.Application.Common.Interfaces.Services;
 using EnvelopeGenerator.Application.Common.Notifications.DocSigned;
@@ -7,11 +8,13 @@ using EnvelopeGenerator.Application.EnvelopeReceivers.Queries;
 using EnvelopeGenerator.Application.Histories.Queries;
 using EnvelopeGenerator.Domain.Constants;
 using EnvelopeGenerator.API.Extensions;
+using EnvelopeGenerator.API.Models;
 using MediatR;
 using Microsoft.AspNetCore.Authentication;
 using Microsoft.AspNetCore.Authentication.Cookies;
 using Microsoft.AspNetCore.Authorization;
 using Microsoft.AspNetCore.Mvc;
+using System.Dynamic;
 
 namespace EnvelopeGenerator.API.Controllers;
 
@@ -115,4 +118,127 @@ public class AnnotationController : ControllerBase
         _logger.LogNotice(histRes.Notices);
         return StatusCode(500, histRes.Messages);
     }
+
+    /// <summary>
+    /// Returns the signature placeholders (id, page, x, y, width, height)
+    /// the authenticated receiver must sign on the current envelope.
+    /// Used by the Blazor receiver UI to render a custom signature overlay
+    /// on top of the DevExpress PDF viewer.
+    /// </summary>
+    [Authorize(Policy = AuthPolicy.Receiver)]
+    [HttpGet("elements")]
+    public async Task<IActionResult> GetElements(CancellationToken cancel)
+    {
+        var signature = User.GetReceiverSignatureOfReceiver();
+        var uuid = User.GetEnvelopeUuidOfReceiver();
+
+        var envelopeReceiver = await _mediator.ReadEnvelopeReceiverAsync(uuid, signature, cancel)
+            ?? throw new NotFoundException("Envelope receiver is not found.");
+
+        var elements = envelopeReceiver.Envelope?.Documents?.FirstOrDefault()?.Elements
+            ?? Enumerable.Empty<Application.Common.Dto.SignatureDto>();
+
+        // Only expose what the overlay needs (no internal columns).
+        var payload = elements
+            .Where(e => e.ReceiverId == envelopeReceiver.ReceiverId)
+            .Select(e => new
+            {
+                id       = e.Id,
+                page     = e.Page,
+                x        = e.X,
+                y        = e.Y,
+                width    = e.Width,
+                height   = e.Height,
+                required = e.Required,
+                tooltip  = e.Tooltip,
+            });
+
+        return Ok(payload);
+    }
+
+    /// <summary>
+    /// Signs the document for the authenticated receiver using a Blazor /
+    /// DevExpress friendly payload (one PNG image per placeholder, plus
+    /// optional position / city per placeholder).
+    ///
+    /// Internally produces a <see cref="PsPdfKitAnnotation"/> wrapping a
+    /// list of <see cref="AnnotationCreateDto"/> entries so that the
+    /// existing notification pipeline (mail / status / annotation persistence)
+    /// is fully reused. The Instant JSON is left blank because the Blazor
+    /// pipeline does not depend on PSPDFKit-side rendering.
+    /// </summary>
+    [Authorize(Policy = AuthPolicy.Receiver)]
+    [HttpPost("blazor")]
+    public async Task<IActionResult> SignBlazor([FromBody] BlazorSignaturePayload payload, CancellationToken cancel)
+    {
+        if (payload is null || payload.Signatures.Count == 0)
+            return BadRequest();
+
+        var signature = User.GetReceiverSignatureOfReceiver();
+        var uuid = User.GetEnvelopeUuidOfReceiver();
+
+        var envelopeReceiver = await _mediator.ReadEnvelopeReceiverAsync(uuid, signature, cancel)
+            ?? throw new NotFoundException("Envelope receiver is not found.");
+
+        if (await _mediator.IsSignedAsync(uuid, signature, cancel))
+            return Problem(statusCode: StatusCodes.Status409Conflict);
+
+        if (await _mediator.AnyHistoryAsync(uuid, new[] { EnvelopeStatus.EnvelopeRejected, EnvelopeStatus.DocumentRejected }, cancel))
+            return Problem(statusCode: StatusCodes.Status423Locked);
+
+        // Build a structured AnnotationCreateDto list out of the lightweight
+        // payload. One DTO per (element, kind) tuple, mirroring how the legacy
+        // PSPDFKit pipeline produced multiple form fields per placeholder.
+        var structured = new List<AnnotationCreateDto>();
+        foreach (var entry in payload.Signatures)
+        {
+            structured.Add(new AnnotationCreateDto
+            {
+                ElementId = entry.ElementId,
+                Name      = $"{entry.ElementId}#signature",
+                Type      = "signature",
+                Value     = entry.SignatureDataUrl,
+            });
+            if (!string.IsNullOrWhiteSpace(entry.Position))
+            {
+                structured.Add(new AnnotationCreateDto
+                {
+                    ElementId = entry.ElementId,
+                    Name      = $"{entry.ElementId}#position",
+                    Type      = "position",
+                    Value     = entry.Position!,
+                });
+            }
+            if (!string.IsNullOrWhiteSpace(entry.City))
+            {
+                structured.Add(new AnnotationCreateDto
+                {
+                    ElementId = entry.ElementId,
+                    Name      = $"{entry.ElementId}#city",
+                    Type      = "city",
+                    Value     = entry.City!,
+                });
+            }
+            structured.Add(new AnnotationCreateDto
+            {
+                ElementId = entry.ElementId,
+                Name      = $"{entry.ElementId}#date",
+                Type      = "date",
+                Value     = entry.SignedAt.ToString("o"),
+            });
+        }
+
+        // No PSPDFKit Instant JSON for the Blazor flow — pass an empty object.
+        var psPdfKitAnnotation = new PsPdfKitAnnotation(new ExpandoObject(), structured);
+
+        var docSignedNotification = await _mediator
+            .ReadEnvelopeReceiverAsync(uuid, signature, cancel)
+            .ToDocSignedNotification(psPdfKitAnnotation)
+            ?? throw new NotFoundException("Envelope receiver is not found.");
+
+        await _mediator.PublishSafely(docSignedNotification, cancel);
+        await HttpContext.SignOutAsync(CookieAuthenticationDefaults.AuthenticationScheme);
+
+        return Ok();
+    }
 }

EnvelopeGenerator.API/Controllers/ReceiverAuthController.cs

@@ -0,0 +1,407 @@
+using EnvelopeGenerator.API.Models;
+using EnvelopeGenerator.Application.Common.Extensions;
+using EnvelopeGenerator.Application.Common.Interfaces.Services;
+using EnvelopeGenerator.Application.EnvelopeReceivers.Queries;
+using EnvelopeGenerator.Domain.Constants;
+using EnvelopeGenerator.API.Extensions;
+using MediatR;
+using Microsoft.AspNetCore.Authentication;
+using Microsoft.AspNetCore.Authentication.Cookies;
+using Microsoft.AspNetCore.Mvc;
+using OtpNet;
+
+namespace EnvelopeGenerator.API.Controllers;
+
+/// <summary>
+/// REST-API für den Empfänger-Authentifizierungs-Flow.
+/// 
+/// Entspricht der Logik in EnvelopeGenerator.Web.Controllers.EnvelopeController
+/// (Main + LogInEnvelope), aber gibt JSON statt Views zurück.
+/// 
+/// Der Blazor-Client (ReceiverUI) ruft diese Endpunkte auf.
+/// 
+/// FLOW:
+/// 1. Client ruft GET  /api/receiverauth/{key}/status     → Prüft Status
+/// 2. Client ruft POST /api/receiverauth/{key}/access-code → Sendet AccessCode
+/// 3. Client ruft POST /api/receiverauth/{key}/tfa         → Sendet TFA-Code
+/// 
+/// Nach erfolgreicher Authentifizierung wird ein Cookie gesetzt (SignInEnvelopeAsync).
+/// Danach kann der Client die Dokument-Daten über die bestehenden Envelope-Endpunkte laden.
+/// </summary>
+[Route("api/[controller]")]
+[ApiController]
+public class ReceiverAuthController : ControllerBase
+{
+    private readonly ILogger<ReceiverAuthController> _logger;
+    private readonly IMediator _mediator;
+    private readonly IEnvelopeReceiverService _envRcvService;
+    private readonly IEnvelopeHistoryService _historyService;
+    private readonly IAuthenticator _authenticator;
+    private readonly IReceiverService _rcvService;
+    private readonly IEnvelopeSmsHandler _envSmsHandler;
+
+    public ReceiverAuthController(
+        ILogger<ReceiverAuthController> logger,
+        IMediator mediator,
+        IEnvelopeReceiverService envRcvService,
+        IEnvelopeHistoryService historyService,
+        IAuthenticator authenticator,
+        IReceiverService rcvService,
+        IEnvelopeSmsHandler envSmsHandler)
+    {
+        _logger = logger;
+        _mediator = mediator;
+        _envRcvService = envRcvService;
+        _historyService = historyService;
+        _authenticator = authenticator;
+        _rcvService = rcvService;
+        _envSmsHandler = envSmsHandler;
+    }
+
+    // ══════════════════════════════════════════════════════════════
+    // ENDPUNKT 1: STATUS PRÜFEN
+    // Entspricht: Web.EnvelopeController.Main()
+    // ══════════════════════════════════════════════════════════════
+
+    /// <summary>
+    /// Prüft den aktuellen Status eines Umschlags für den Empfänger.
+    /// Entscheidet ob: NotFound, Rejected, Signed, AccessCode nötig, oder direkt anzeigen.
+    /// </summary>
+    /// <param name="key">Der EnvelopeReceiver-Key aus der URL (Base64-kodiert)</param>
+    /// <param name="cancel">Cancellation-Token</param>
+    /// <returns>ReceiverAuthResponse mit dem aktuellen Status</returns>
+    [HttpGet("{key}/status")]
+    public async Task<IActionResult> GetStatus([FromRoute] string key, CancellationToken cancel)
+    {
+        try
+        {
+            // ── Key dekodieren ──
+            if (!key.TryDecode(out var decoded))
+                return NotFound(new ReceiverAuthResponse { Status = "not_found" });
+
+            // ── ReadOnly-Links ──
+            if (decoded.GetEncodeType() == EncodeType.EnvelopeReceiverReadOnly)
+            {
+                return Ok(new ReceiverAuthResponse
+                {
+                    Status = "show_document",
+                    ReadOnly = true
+                });
+            }
+
+            // ── EnvelopeReceiver laden (Light-Query: ohne Documents/Elements) ──
+            var er = await _mediator.Send(
+                new ReadEnvelopeReceiverLightQuery { Key = key }, cancel);
+            if (er is null)
+                return NotFound(new ReceiverAuthResponse { Status = "not_found" });
+
+            // ── Abgelehnt? ──
+            var rejRcvrs = await _historyService.ReadRejectingReceivers(er.Envelope!.Id);
+            if (rejRcvrs.Any())
+            {
+                await HttpContext.SignOutAsync(CookieAuthenticationDefaults.AuthenticationScheme);
+                return Ok(new ReceiverAuthResponse
+                {
+                    Status = "rejected",
+                    Title = er.Envelope.Title,
+                    SenderEmail = er.Envelope.User?.Email
+                });
+            }
+
+            // ── Bereits signiert? ──
+            if (await _historyService.IsSigned(
+                    envelopeId: er.Envelope.Id,
+                    userReference: er.Receiver!.EmailAddress))
+            {
+                await HttpContext.SignOutAsync(CookieAuthenticationDefaults.AuthenticationScheme);
+                return Ok(new ReceiverAuthResponse
+                {
+                    Status = "already_signed",
+                    Title = er.Envelope.Title,
+                    SenderEmail = er.Envelope.User?.Email
+                });
+            }
+
+            // ── Kein AccessCode nötig? → Direkt SignIn ──
+            if (!er.Envelope.UseAccessCode)
+            {
+                (string? uuid, string? signature) = decoded.ParseEnvelopeReceiverId();
+                var erSecretRes = await _envRcvService.ReadWithSecretByUuidSignatureAsync(
+                    uuid: uuid!, signature: signature!);
+
+                if (erSecretRes.IsFailed)
+                    return NotFound(new ReceiverAuthResponse { Status = "not_found" });
+
+                await HttpContext.SignInEnvelopeAsync(erSecretRes.Data, Role.ReceiverFull);
+
+                return Ok(new ReceiverAuthResponse
+                {
+                    Status = "show_document",
+                    Title = er.Envelope.Title,
+                    Message = er.Envelope.Message,
+                    SenderEmail = er.Envelope.User?.Email,
+                    ReadOnly = er.Envelope.ReadOnly
+                });
+            }
+
+            // ── AccessCode nötig ──
+            // HINWEIS: Die E-Mail mit dem AccessCode wird NICHT hier gesendet.
+            // Das passiert bereits im Web-Projekt, wenn der Link generiert wird.
+            // Der Blazor-Flow übernimmt erst NACH dem E-Mail-Versand.
+            bool accessCodeAlreadyRequested = await _historyService.AccessCodeAlreadyRequested(
+                envelopeId: er.Envelope.Id,
+                userReference: er.Receiver.EmailAddress);
+
+            if (!accessCodeAlreadyRequested)
+            {
+                // AccessCode wurde noch nie angefordert — das bedeutet der Empfänger
+                // kommt zum ersten Mal. Wir zeichnen es auf, aber die E-Mail
+                // wurde bereits vom Web-Projekt gesendet.
+                await _historyService.RecordAsync(
+                    er.EnvelopeId, er.Receiver.EmailAddress, EnvelopeStatus.AccessCodeRequested);
+            }
+
+            // ── Prüfe ob der Nutzer bereits eingeloggt ist ──
+            if (User.IsInRole(Role.ReceiverFull))
+            {
+                return Ok(new ReceiverAuthResponse
+                {
+                    Status = "show_document",
+                    Title = er.Envelope.Title,
+                    Message = er.Envelope.Message,
+                    SenderEmail = er.Envelope.User?.Email,
+                    ReadOnly = er.Envelope.ReadOnly
+                });
+            }
+
+            return Ok(new ReceiverAuthResponse
+            {
+                Status = "requires_access_code",
+                Title = er.Envelope.Title,
+                SenderEmail = er.Envelope.User?.Email,
+                TfaEnabled = er.Envelope.TFAEnabled,
+                HasPhoneNumber = er.HasPhoneNumber
+            });
+        }
+        catch (Exception ex)
+        {
+            _logger.LogError(ex, "Error checking status for key {Key}", key);
+            return StatusCode(500, new ReceiverAuthResponse
+            {
+                Status = "error",
+                ErrorMessage = "Ein unerwarteter Fehler ist aufgetreten."
+            });
+        }
+    }
+
+    // ══════════════════════════════════════════════════════════════
+    // ENDPUNKT 2: ACCESS-CODE PRÜFEN
+    // ══════════════════════════════════════════════════════════════
+
+    /// <summary>
+    /// Prüft den eingegebenen Zugangscode.
+    /// Bei Erfolg: SignIn oder TFA-Weiterleitung.
+    /// Bei Fehler: Fehlermeldung zurückgeben.
+    /// </summary>
+    [HttpPost("{key}/access-code")]
+    public async Task<IActionResult> SubmitAccessCode(
+        [FromRoute] string key,
+        [FromBody] AccessCodeRequest request,
+        CancellationToken cancel)
+    {
+        try
+        {
+            // ── Key dekodieren + Daten laden ──
+            (string? uuid, string? signature) = key.DecodeEnvelopeReceiverId();
+            if (uuid is null || signature is null)
+                return NotFound(new ReceiverAuthResponse { Status = "not_found" });
+
+            var erSecretRes = await _envRcvService.ReadWithSecretByUuidSignatureAsync(
+                uuid: uuid, signature: signature);
+
+            if (erSecretRes.IsFailed)
+                return NotFound(new ReceiverAuthResponse { Status = "not_found" });
+
+            var erSecret = erSecretRes.Data;
+
+            // ── AccessCode prüfen ──
+            if (erSecret.AccessCode != request.AccessCode)
+            {
+                await _historyService.RecordAsync(
+                    erSecret.EnvelopeId,
+                    erSecret.Receiver!.EmailAddress,
+                    EnvelopeStatus.AccessCodeIncorrect);
+
+                return Unauthorized(new ReceiverAuthResponse
+                {
+                    Status = "requires_access_code",
+                    Title = erSecret.Envelope!.Title,
+                    SenderEmail = erSecret.Envelope.User?.Email,
+                    TfaEnabled = erSecret.Envelope.TFAEnabled,
+                    HasPhoneNumber = erSecret.HasPhoneNumber,
+                    ErrorMessage = "Falscher Zugangscode."
+                });
+            }
+
+            // ── AccessCode korrekt ──
+            await _historyService.RecordAsync(
+                erSecret.EnvelopeId,
+                erSecret.Receiver!.EmailAddress,
+                EnvelopeStatus.AccessCodeCorrect);
+
+            // ── TFA erforderlich? ──
+            if (erSecret.Envelope!.TFAEnabled)
+            {
+                var rcv = erSecret.Receiver;
+                if (rcv.TotpSecretkey is null)
+                {
+                    rcv.TotpSecretkey = _authenticator.GenerateTotpSecretKey();
+                    await _rcvService.UpdateAsync(rcv);
+                }
+
+                await HttpContext.SignInEnvelopeAsync(erSecret, Role.ReceiverTFA);
+
+                if (request.PreferSms)
+                {
+                    var (smsRes, expiration) = await _envSmsHandler.SendTotpAsync(erSecret);
+
+                    return Ok(new ReceiverAuthResponse
+                    {
+                        Status = "requires_tfa",
+                        TfaType = "sms",
+                        TfaExpiration = expiration,
+                        Title = erSecret.Envelope.Title,
+                        SenderEmail = erSecret.Envelope.User?.Email,
+                        HasPhoneNumber = erSecret.HasPhoneNumber
+                    });
+                }
+                else
+                {
+                    return Ok(new ReceiverAuthResponse
+                    {
+                        Status = "requires_tfa",
+                        TfaType = "authenticator",
+                        Title = erSecret.Envelope.Title,
+                        SenderEmail = erSecret.Envelope.User?.Email,
+                        HasPhoneNumber = erSecret.HasPhoneNumber
+                    });
+                }
+            }
+
+            // ── Kein TFA → Direkt SignIn ──
+            await HttpContext.SignInEnvelopeAsync(erSecret, Role.ReceiverFull);
+
+            return Ok(new ReceiverAuthResponse
+            {
+                Status = "show_document",
+                Title = erSecret.Envelope.Title,
+                Message = erSecret.Envelope.Message,
+                SenderEmail = erSecret.Envelope.User?.Email,
+                ReadOnly = erSecret.Envelope.ReadOnly
+            });
+        }
+        catch (Exception ex)
+        {
+            _logger.LogError(ex, "Error submitting access code for key {Key}", key);
+            return StatusCode(500, new ReceiverAuthResponse
+            {
+                Status = "error",
+                ErrorMessage = "Ein unerwarteter Fehler ist aufgetreten."
+            });
+        }
+    }
+
+    // ══════════════════════════════════════════════════════════════
+    // ENDPUNKT 3: TFA-CODE PRÜFEN
+    // ══════════════════════════════════════════════════════════════
+
+    /// <summary>
+    /// Prüft den TFA-Code (SMS oder Authenticator).
+    /// Setzt voraus, dass der Nutzer bereits mit ReceiverTFA-Rolle eingeloggt ist.
+    /// </summary>
+    [HttpPost("{key}/tfa")]
+    public async Task<IActionResult> SubmitTfaCode(
+        [FromRoute] string key,
+        [FromBody] TfaCodeRequest request,
+        CancellationToken cancel)
+    {
+        try
+        {
+            if (!User.IsInRole(Role.ReceiverTFA))
+                return Unauthorized(new ReceiverAuthResponse
+                {
+                    Status = "requires_access_code",
+                    ErrorMessage = "Bitte zuerst den Zugangscode eingeben."
+                });
+
+            (string? uuid, string? signature) = key.DecodeEnvelopeReceiverId();
+            if (uuid is null || signature is null)
+                return NotFound(new ReceiverAuthResponse { Status = "not_found" });
+
+            var erSecretRes = await _envRcvService.ReadWithSecretByUuidSignatureAsync(
+                uuid: uuid, signature: signature);
+
+            if (erSecretRes.IsFailed)
+                return NotFound(new ReceiverAuthResponse { Status = "not_found" });
+
+            var erSecret = erSecretRes.Data;
+
+            if (erSecret.Receiver!.TotpSecretkey is null)
+            {
+                _logger.LogError("TotpSecretkey is null for receiver {Signature}", signature);
+                return StatusCode(500, new ReceiverAuthResponse
+                {
+                    Status = "error",
+                    ErrorMessage = "TFA-Konfiguration fehlt."
+                });
+            }
+
+            bool codeValid;
+
+            if (request.Type == "sms")
+            {
+                codeValid = _envSmsHandler.VerifyTotp(request.Code, erSecret.Receiver.TotpSecretkey);
+            }
+            else
+            {
+                codeValid = _authenticator.VerifyTotp(
+                    request.Code,
+                    erSecret.Receiver.TotpSecretkey,
+                    window: VerificationWindow.RfcSpecifiedNetworkDelay);
+            }
+
+            if (!codeValid)
+            {
+                return Unauthorized(new ReceiverAuthResponse
+                {
+                    Status = "requires_tfa",
+                    TfaType = request.Type,
+                    Title = erSecret.Envelope!.Title,
+                    SenderEmail = erSecret.Envelope.User?.Email,
+                    HasPhoneNumber = erSecret.HasPhoneNumber,
+                    ErrorMessage = "Falscher Code."
+                });
+            }
+
+            await HttpContext.SignInEnvelopeAsync(erSecret, Role.ReceiverFull);
+
+            return Ok(new ReceiverAuthResponse
+            {
+                Status = "show_document",
+                Title = erSecret.Envelope!.Title,
+                Message = erSecret.Envelope.Message,
+                SenderEmail = erSecret.Envelope.User?.Email,
+                ReadOnly = erSecret.Envelope.ReadOnly
+            });
+        }
+        catch (Exception ex)
+        {
+            _logger.LogError(ex, "Error submitting TFA code for key {Key}", key);
+            return StatusCode(500, new ReceiverAuthResponse
+            {
+                Status = "error",
+                ErrorMessage = "Ein unerwarteter Fehler ist aufgetreten."
+            });
+        }
+    }
+}

EnvelopeGenerator.API/Models/BlazorSignaturePayload.cs

@@ -0,0 +1,42 @@
+namespace EnvelopeGenerator.API.Models;
+
+/// <summary>
+/// Lightweight payload used by the Blazor receiver UI to submit signatures.
+/// Each entry corresponds to one signature placeholder rendered as an
+/// overlay on top of the DevExpress PDF viewer.
+///
+/// The legacy MVC flow ships a full PSPDFKit InstantJSON payload via
+/// <see cref="EnvelopeGenerator.Application.Common.Notifications.DocSigned.PsPdfKitAnnotation"/>.
+/// That format is browser-library specific. The Blazor client uses a
+/// transport-neutral DTO instead: only what the server actually needs
+/// to persist the signed document (image + metadata per placeholder).
+///
+/// Conversion to the internal <c>PsPdfKitAnnotation</c> happens inside
+/// <see cref="EnvelopeGenerator.API.Controllers.AnnotationController"/>.
+/// </summary>
+public class BlazorSignaturePayload
+{
+    /// <summary>The receiver-specific signed placeholders for this envelope.</summary>
+    public List<BlazorSignatureEntry> Signatures { get; set; } = new();
+}
+
+/// <summary>
+/// A single signed placeholder.
+/// </summary>
+public class BlazorSignatureEntry
+{
+    /// <summary>The receiver's <c>DocumentReceiverElement.Id</c> being signed.</summary>
+    public int ElementId { get; set; }
+
+    /// <summary>Signature image as a data URL (e.g. "data:image/png;base64,...").</summary>
+    public string SignatureDataUrl { get; set; } = string.Empty;
+
+    /// <summary>Optional position / job title entered by the receiver.</summary>
+    public string? Position { get; set; }
+
+    /// <summary>Optional city / location entered by the receiver.</summary>
+    public string? City { get; set; }
+
+    /// <summary>Capture timestamp (client local time).</summary>
+    public DateTime SignedAt { get; set; }
+}

EnvelopeGenerator.API/Models/ReceiverAuthResponse.cs

@@ -0,0 +1,78 @@
+namespace EnvelopeGenerator.API.Models;
+
+/// <summary>
+/// Einheitliche Antwort des ReceiverAuthControllers.
+/// 
+/// WARUM ein einziges Response-Objekt für alle Endpunkte?
+/// - Der Client braucht nur ein Format zu verstehen
+/// - Der Status-String bestimmt, welche Felder relevant sind
+/// - Entspricht dem, was der Web-Controller bisher über ViewData verteilt hat
+/// 
+/// Status-Werte und was sie bedeuten:
+/// - "requires_access_code" → AccessCode-Eingabe zeigen
+/// - "requires_tfa"         → TFA-Code-Eingabe zeigen (nach AccessCode)
+/// - "show_document"        → Dokument laden und anzeigen
+/// - "already_signed"       → Info-Seite "Bereits unterschrieben"
+/// - "rejected"             → Info-Seite "Abgelehnt"
+/// - "not_found"            → Fehler-Seite "Nicht gefunden"
+/// - "expired"              → Fehler-Seite "Link abgelaufen"
+/// </summary>
+public class ReceiverAuthResponse
+{
+    /// <summary>Aktueller Status des Empfänger-Flows</summary>
+    public required string Status { get; init; }
+
+    /// <summary>Titel des Umschlags (z.B. "Vertragsdokument")</summary>
+    public string? Title { get; init; }
+
+    /// <summary>Nachricht des Absenders</summary>
+    public string? Message { get; init; }
+
+    /// <summary>E-Mail des Absenders (für Rückfragen-Hinweis)</summary>
+    public string? SenderEmail { get; init; }
+
+    /// <summary>Name des Empfängers</summary>
+    public string? ReceiverName { get; init; }
+
+    /// <summary>Ob TFA für diesen Umschlag aktiviert ist</summary>
+    public bool TfaEnabled { get; init; }
+
+    /// <summary>Ob der Empfänger eine Telefonnummer hat (für SMS-TFA)</summary>
+    public bool HasPhoneNumber { get; init; }
+
+    /// <summary>Ob das Dokument nur gelesen werden soll (ReadAndConfirm)</summary>
+    public bool ReadOnly { get; init; }
+
+    /// <summary>TFA-Typ: "sms" oder "authenticator" (wenn Status = "requires_tfa")</summary>
+    public string? TfaType { get; init; }
+
+    /// <summary>Ablaufzeit des SMS-Codes (für Countdown-Timer)</summary>
+    public DateTime? TfaExpiration { get; init; }
+
+    /// <summary>Fehlermeldung (z.B. "Falscher Zugangscode")</summary>
+    public string? ErrorMessage { get; init; }
+}
+
+/// <summary>
+/// Request-Body für POST /api/receiverauth/{key}/access-code
+/// </summary>
+public class AccessCodeRequest
+{
+    /// <summary>Der vom Empfänger eingegebene Zugangscode</summary>
+    public required string AccessCode { get; init; }
+
+    /// <summary>Ob SMS statt Authenticator bevorzugt wird</summary>
+    public bool PreferSms { get; init; }
+}
+
+/// <summary>
+/// Request-Body für POST /api/receiverauth/{key}/tfa
+/// </summary>
+public class TfaCodeRequest
+{
+    /// <summary>Der eingegebene TFA-Code (6-stellig)</summary>
+    public required string Code { get; init; }
+
+    /// <summary>"sms" oder "authenticator"</summary>
+    public required string Type { get; init; }
+}

EnvelopeGenerator.Application/Common/Extensions/AutoMapperAuditingExtensions.cs

@@ -13,12 +13,12 @@ public static class AutoMapperAuditingExtensions
     /// </summary>
     public static IMappingExpression<TSource, TDestination> MapAddedWhen<TSource, TDestination>(this IMappingExpression<TSource, TDestination> expression)
         where TDestination : IHasAddedWhen
-        => expression.ForMember(dest => dest.AddedWhen, opt => opt.MapFrom(_ => DateTime.UtcNow));
+        => expression.ForMember(dest => dest.AddedWhen, opt => opt.MapFrom(_ => DateTime.Now));
 
     /// <summary>
     /// Maps <see cref="IHasChangedWhen.ChangedWhen"/> to the current UTC time.
     /// </summary>
     public static IMappingExpression<TSource, TDestination> MapChangedWhen<TSource, TDestination>(this IMappingExpression<TSource, TDestination> expression)
         where TDestination : IHasChangedWhen
-        => expression.ForMember(dest => dest.ChangedWhen, opt => opt.MapFrom(_ => DateTime.UtcNow));
+        => expression.ForMember(dest => dest.ChangedWhen, opt => opt.MapFrom(_ => DateTime.Now));
 }

EnvelopeGenerator.Application/Common/Notifications/SendMailHandler.cs

@@ -113,7 +113,7 @@ public abstract class SendMailHandler<TNotification> : INotificationHandler<TNot
             EmailAddress = notification.EmailAddress,
             EmailBody = temp.Body,
             EmailSubj = temp.Subject,
-            AddedWhen = DateTime.UtcNow,
+            AddedWhen = DateTime.Now,
             AddedWho = DispatcherParams.AddedWho,
             SendingProfile = DispatcherParams.SendingProfile,
             ReminderTypeId = DispatcherParams.ReminderTypeId,

EnvelopeGenerator.Application/DocStatus/MappingProfile.cs

@@ -27,7 +27,7 @@ public class MappingProfile : Profile
         CreateMap<UpdateDocStatusCommand, DocumentStatus>()
         .ForMember(dest => dest.Envelope, opt => opt.Ignore())
         .ForMember(dest => dest.Receiver, opt => opt.Ignore())
-        .ForMember(dest => dest.StatusChangedWhen, opt => opt.MapFrom(src => DateTime.UtcNow))
+        .ForMember(dest => dest.StatusChangedWhen, opt => opt.MapFrom(src => DateTime.Now))
         .MapChangedWhen();
     }
 }

EnvelopeGenerator.Application/EnvelopeReceivers/Queries/ReadEnvelopeReceiverLightQuery.cs

@@ -0,0 +1,60 @@
+using AutoMapper;
+using DigitalData.Core.Abstraction.Application.Repository;
+using EnvelopeGenerator.Application.Common.Dto.EnvelopeReceiver;
+using EnvelopeGenerator.Application.Common.Extensions;
+using EnvelopeGenerator.Application.Common.Query;
+using EnvelopeGenerator.Application.Envelopes.Queries;
+using EnvelopeGenerator.Application.Receivers.Queries;
+using EnvelopeGenerator.Domain.Entities;
+using MediatR;
+using Microsoft.EntityFrameworkCore;
+
+namespace EnvelopeGenerator.Application.EnvelopeReceivers.Queries;
+
+/// <summary>
+/// Leichte Variante von <see cref="ReadEnvelopeReceiverQuery"/>:
+/// Lädt NUR Envelope (mit Histories + User) und Receiver.
+/// Lädt NICHT Documents/Elements.
+/// 
+/// Verwendung: Status-Prüfungen wo keine Dokument-Daten benötigt werden
+/// (z.B. ReceiverAuthController.GetStatus).
+/// </summary>
+public record ReadEnvelopeReceiverLightQuery
+    : EnvelopeReceiverQueryBase<ReadEnvelopeQuery, ReadReceiverQuery>, IRequest<EnvelopeReceiverDto?>;
+
+/// <summary>
+/// Handler für <see cref="ReadEnvelopeReceiverLightQuery"/>.
+/// </summary>
+public class ReadEnvelopeReceiverLightQueryHandler
+    : IRequestHandler<ReadEnvelopeReceiverLightQuery, EnvelopeReceiverDto?>
+{
+    private readonly IRepository<EnvelopeReceiver> _repo;
+    private readonly IMapper _mapper;
+
+    /// <summary>
+    /// Konstruktor.
+    /// </summary>
+    /// <param name="repo">EnvelopeReceiver-Repository</param>
+    /// <param name="mapper">AutoMapper</param>
+    public ReadEnvelopeReceiverLightQueryHandler(IRepository<EnvelopeReceiver> repo, IMapper mapper)
+    {
+        _repo = repo;
+        _mapper = mapper;
+    }
+
+    /// <summary>
+    /// Lädt einen EnvelopeReceiver ohne Documents/Elements.
+    /// </summary>
+    public async Task<EnvelopeReceiverDto?> Handle(ReadEnvelopeReceiverLightQuery request, CancellationToken cancel)
+    {
+        var envRcv = await _repo.Query
+            .Where(request, notnull: false)
+            .AsNoTracking()
+            .Include(er => er.Envelope).ThenInclude(e => e!.Histories)
+            .Include(er => er.Envelope).ThenInclude(e => e!.User)
+            .Include(er => er.Receiver)
+            .FirstOrDefaultAsync(cancel);
+
+        return envRcv is null ? null : _mapper.Map<EnvelopeReceiverDto>(envRcv);
+    }
+}

EnvelopeGenerator.Application/Histories/Commands/CreateHistoryCommand.cs

@@ -34,7 +34,7 @@ public record CreateHistoryCommand : EnvelopeReceiverQueryBase, IRequest<History
     /// <summary>
     /// 
     /// </summary>
-    public DateTime AddedWhen { get; } = DateTime.UtcNow;
+    public DateTime AddedWhen { get; } = DateTime.Now;
 
     /// <summary>
     /// 

EnvelopeGenerator.Application/Resources/Resource.en-US.resx

@@ -448,7 +448,7 @@
     <value>Document has been reset.</value>
   </data>
   <data name="DocumentSuccessfullyConfirmed" xml:space="preserve">
-    <value>Document successfully red and confirmed!</value>
+    <value>Document successfully read and confirmed!</value>
   </data>
   <data name="DocumentConfirmedConfirmationMessage" xml:space="preserve">
     <value>You have read and confirmed the document. You will receive a written confirmation afterwards.</value>

EnvelopeGenerator.CommonServices/Jobs/FinalizeDocument/FinalizeDocumentJob.vb

@@ -15,6 +15,7 @@ Imports DigitalData.Core.Abstraction.Application
 Imports EnvelopeGenerator.Infrastructure
 Imports Microsoft.EntityFrameworkCore
 Imports DigitalData.Core.Abstractions
+Imports EnvelopeGenerator.Domain.Interfaces
 
 Namespace Jobs
     Public Class FinalizeDocumentJob
@@ -350,7 +351,7 @@ Namespace Jobs
                 Logger.Warn($"No SendFinalEmailToCreator - oMailToCreator [{oMailToCreator}] <> [{FinalEmailType.No}] ")
             End If
 
-            If oMailToReceivers <> FinalEmailType.No Then
+            If oMailToReceivers <> FinalEmailType.No And pEnvelope.IsReadAndSign() Then
                 Logger.Debug("Sending emails to receivers..")
                 SendFinalEmailToReceivers(pEnvelope) ', pAttachment
             Else

EnvelopeGenerator.Infrastructure/EGDbContext.cs

@@ -47,6 +47,8 @@ public abstract class EGDbContextBase : DbContext
 
     public DbSet<Signature> DocumentReceiverElements { get; set; }
 
+    public DbSet<ElementAnnotation> DocumentReceiverElementAnnotations { get; set; }
+
     public DbSet<DocumentStatus> DocumentStatus { get; set; }
 
     public DbSet<EmailTemplate> EmailTemplate { get; set; }

EnvelopeGenerator.Tests/Application/Fake.cs

@@ -215,7 +215,7 @@ public static class Extensions
         Title = faker.Lorem.Paragraph(faker.Random.Number(1, 2)),
         Message = faker.Lorem.Paragraph(faker.Random.Number(2, 5)),
         TfaEnabled = tfaEnabled,
-        AddedWhen = DateTime.UtcNow,
+        AddedWhen = DateTime.Now,
         CertificationType = (int)CertificationType.AdvancedElectronicSignature,
         UseAccessCode = false,
         ContractType = (int)ContractType.Contract,
@@ -273,9 +273,9 @@ public static class Extensions
         EnvelopeId = envelopeId,
         ReceiverId = receiverId,
         Status = ReceiverStatus.Unsigned,
-        AddedWhen = DateTime.UtcNow,
+        AddedWhen = DateTime.Now,
         AccessCode = faker.Random.Number(1000, 9999).ToString(),
-        ChangedWhen = DateTime.UtcNow,
+        ChangedWhen = DateTime.Now,
         CompanyName = faker.Company.CompanyName(),
         JobTitle = faker.Name.JobTitle(),
         Name = faker.Name.FullName(),

EnvelopeGenerator.Web/EnvelopeGenerator.Web.csproj

@@ -12,9 +12,9 @@
 		<PackageTags>digital data envelope generator web</PackageTags>
 		<Description>EnvelopeGenerator.Web is an ASP.NET MVC application developed to manage signing processes. It uses Entity Framework Core (EF Core) for database operations. The user interface for signing processes is developed with Razor View Engine (.cshtml files) and JavaScript under wwwroot, integrated with PSPDFKit. This integration allows users to view and sign documents seamlessly.</Description>
 		<ApplicationIcon>Assets\icon.ico</ApplicationIcon>
-		<Version>3.12.2</Version>						<!-- NuGet package version -->
+		<Version>3.12.3</Version>						<!-- NuGet package version -->
-		<AssemblyVersion>3.12.2.0</AssemblyVersion>		<!-- Assembly version for API compatibility -->
+		<AssemblyVersion>3.12.3.0</AssemblyVersion>		<!-- Assembly version for API compatibility -->
-		<FileVersion>3.12.2.0</FileVersion>				<!-- Windows file version -->
+		<FileVersion>3.12.3.0</FileVersion>				<!-- Windows file version -->
 		<Copyright>Copyright © 2025 Digital Data GmbH. All rights reserved.</Copyright>
 	</PropertyGroup>
 

EnvelopeGenerator.sln

@@ -35,6 +35,12 @@ Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "EnvelopeGenerator.Tests", "
 EndProject
 Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "EnvelopeGenerator.API", "EnvelopeGenerator.API\EnvelopeGenerator.API.csproj", "{EC768913-6270-14F4-1DD3-69C87A659462}"
 EndProject
+Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "receiverUI", "receiverUI", "{73D8F466-90AA-4F95-9BD1-7CDBB8565162}"
+EndProject
+Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "EnvelopeGenerator.ReceiverUI.Web", "receiverUI\EnvelopeGenerator.ReceiverUI.Web\EnvelopeGenerator.ReceiverUI.Web\EnvelopeGenerator.ReceiverUI.Web.csproj", "{AAD4720E-D175-44B5-B431-DB0BA636CD20}"
+EndProject
+Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "EnvelopeGenerator.ReceiverUI.Web.Client", "receiverUI\EnvelopeGenerator.ReceiverUI.Web\EnvelopeGenerator.ReceiverUI.Web.Client\EnvelopeGenerator.ReceiverUI.Web.Client.csproj", "{5D97B2C2-E19B-4958-81E1-38864EC88FEB}"
+EndProject
 Global
 	GlobalSection(SolutionConfigurationPlatforms) = preSolution
 		Debug|Any CPU = Debug|Any CPU
@@ -85,6 +91,14 @@ Global
 		{EC768913-6270-14F4-1DD3-69C87A659462}.Debug|Any CPU.Build.0 = Debug|Any CPU
 		{EC768913-6270-14F4-1DD3-69C87A659462}.Release|Any CPU.ActiveCfg = Release|Any CPU
 		{EC768913-6270-14F4-1DD3-69C87A659462}.Release|Any CPU.Build.0 = Release|Any CPU
+		{AAD4720E-D175-44B5-B431-DB0BA636CD20}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
+		{AAD4720E-D175-44B5-B431-DB0BA636CD20}.Debug|Any CPU.Build.0 = Debug|Any CPU
+		{AAD4720E-D175-44B5-B431-DB0BA636CD20}.Release|Any CPU.ActiveCfg = Release|Any CPU
+		{AAD4720E-D175-44B5-B431-DB0BA636CD20}.Release|Any CPU.Build.0 = Release|Any CPU
+		{5D97B2C2-E19B-4958-81E1-38864EC88FEB}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
+		{5D97B2C2-E19B-4958-81E1-38864EC88FEB}.Debug|Any CPU.Build.0 = Debug|Any CPU
+		{5D97B2C2-E19B-4958-81E1-38864EC88FEB}.Release|Any CPU.ActiveCfg = Release|Any CPU
+		{5D97B2C2-E19B-4958-81E1-38864EC88FEB}.Release|Any CPU.Build.0 = Release|Any CPU
 	EndGlobalSection
 	GlobalSection(SolutionProperties) = preSolution
 		HideSolutionNode = FALSE
@@ -104,6 +118,9 @@ Global
 		{211619F5-AE25-4BA5-A552-BACAFE0632D3} = {9943209E-1744-4944-B1BA-4F87FC1A0EEB}
 		{224C4845-1CDE-22B7-F3A9-1FF9297F70E8} = {0CBC2432-A561-4440-89BC-671B66A24146}
 		{EC768913-6270-14F4-1DD3-69C87A659462} = {E3C758DC-914D-4B7E-8457-0813F1FDB0CB}
+		{73D8F466-90AA-4F95-9BD1-7CDBB8565162} = {E3C758DC-914D-4B7E-8457-0813F1FDB0CB}
+		{AAD4720E-D175-44B5-B431-DB0BA636CD20} = {73D8F466-90AA-4F95-9BD1-7CDBB8565162}
+		{5D97B2C2-E19B-4958-81E1-38864EC88FEB} = {73D8F466-90AA-4F95-9BD1-7CDBB8565162}
 	EndGlobalSection
 	GlobalSection(ExtensibilityGlobals) = postSolution
 		SolutionGuid = {73E60370-756D-45AD-A19A-C40A02DACCC7}

receiverUI/.github/copilot-instructions.md

@@ -0,0 +1,22 @@
+---
+description: 'Answer questions about DevExpress UI Components and their APIs using the dxdocs server'
+---
+
+You are a .NET programmer and DevExpress products expert.
+
+You are tasked with answering questions about DevExpress components and their APIs using dxdocs MCP server tools.
+
+For **ANY** question about DevExpress components, use the dxdocs server to construct your answer.
+
+## Workflow:
+1. **Call devexpress_docs_search** to obtain help topics related to the user question
+2. **Call devexpress_docs_get_content** to fetch and read most relevant help topics
+3. **Reflect on obtained content** and how it relates to the question
+4. **Provide a comprehensive answer** based solely on retrieved information
+
+## Constraints:
+- **Use devexpress_docs_search only once per question** to avoid redundant queries
+- When answering questions, **use only information obtained from MCP server tools**
+- **Include code examples** when available in the documentation
+- **Reference specific DevExpress controls and properties** mentioned in the documentation
+- **Invoke version-specific MCP tools** (for example, dxdocs25_1) if a user specifies a version (for example, v25.1)

receiverUI/.mcp.json

@@ -0,0 +1,12 @@
+{
+  "servers": {
+    "dxdocs": {
+      "url": "https://api.devexpress.com/mcp/docs",
+      "type": "http"
+    },
+    "dxdocs25_1": {
+      "url": "https://api.devexpress.com/mcp/docs?v=25.1",
+      "type": "http"
+    }
+  }
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/Api/Models/EnvelopeDtos.cs

@@ -0,0 +1,126 @@
+namespace EnvelopeGenerator.ReceiverUI.Web.Client.Api.Models;
+
+/// <summary>
+/// Client-side DTOs for envelope display. These mirror the server-side
+/// EnvelopeReceiverDto / EnvelopeDto / DocumentDto used by the existing
+/// API endpoints, but expose only the fields the receiver UI actually needs.
+/// JSON serialization is camelCase by default (System.Text.Json).
+/// </summary>
+public class EnvelopeReceiverDto
+{
+    public long EnvelopeId { get; set; }
+    public long ReceiverId { get; set; }
+    public string? Name { get; set; }
+    public bool HasPhoneNumber { get; set; }
+    public EnvelopeDto? Envelope { get; set; }
+    public ReceiverDto? Receiver { get; set; }
+}
+
+public class EnvelopeDto
+{
+    public long Id { get; set; }
+    public string? Uuid { get; set; }
+    public string? Title { get; set; }
+    public string? Message { get; set; }
+    public bool ReadOnly { get; set; }
+    public bool UseAccessCode { get; set; }
+    public bool TFAEnabled { get; set; }
+    public DateTime AddedWhen { get; set; }
+    public SenderUserDto? User { get; set; }
+    public List<DocumentDto>? Documents { get; set; }
+}
+
+public class SenderUserDto
+{
+    public string? Email { get; set; }
+    public string? Prename { get; set; }
+    public string? Name { get; set; }
+}
+
+public class ReceiverDto
+{
+    public long Id { get; set; }
+    public string? EmailAddress { get; set; }
+    public string? Signature { get; set; }
+    public string? Prename { get; set; }
+    public string? Name { get; set; }
+}
+
+public class DocumentDto
+{
+    public long Id { get; set; }
+    public string? Name { get; set; }
+    public List<DocumentElementDto>? Elements { get; set; }
+}
+
+/// <summary>
+/// Signature placement on a PDF document. Pixel/inch units follow the same
+/// convention as the legacy PSPDFKit pipeline.
+/// </summary>
+public class DocumentElementDto
+{
+    public int Id { get; set; }
+    public int Page { get; set; }
+    public double Left { get; set; }
+    public double Top { get; set; }
+}
+
+/// <summary>
+/// Body for <c>POST /api/readonly</c> (share read-only link with another e-mail).
+/// </summary>
+public class ReadOnlyShareRequest
+{
+    public string ReceiverMail { get; set; } = string.Empty;
+    public DateTime DateValid { get; set; }
+}
+
+/// <summary>
+/// Returned by <c>GET /api/annotation/elements</c>. Each item describes a
+/// signature placeholder the authenticated receiver must sign on the
+/// current envelope. Coordinates are in PDF points relative to the page.
+/// </summary>
+public class SignatureElementDto
+{
+    public int Id { get; set; }
+    public int Page { get; set; }
+    public double X { get; set; }
+    public double Y { get; set; }
+    public double Width { get; set; }
+    public double Height { get; set; }
+    public bool Required { get; set; }
+    public string? Tooltip { get; set; }
+}
+
+/// <summary>
+/// Body of <c>POST /api/annotation/blazor</c> — mirrors the API-side
+/// <c>BlazorSignaturePayload</c>.
+/// </summary>
+public class BlazorSignaturePayload
+{
+    public List<BlazorSignatureEntry> Signatures { get; set; } = new();
+}
+
+public class BlazorSignatureEntry
+{
+    public int ElementId { get; set; }
+    /// <summary>Image as data URL (e.g. <c>data:image/png;base64,...</c>).</summary>
+    public string SignatureDataUrl { get; set; } = string.Empty;
+    public string? Position { get; set; }
+    public string? City { get; set; }
+    public DateTime SignedAt { get; set; }
+}
+
+/// <summary>
+/// Response of <c>GET /api/tfa/{envelopeReceiverId}</c>. The API serializes
+/// the anonymous type in <c>TfaRegistrationController.RegisterAsync</c>; the
+/// shape mirrored here is the camelCased JSON that crosses the wire.
+/// </summary>
+public class TfaRegistrationResponse
+{
+    public int EnvelopeId { get; set; }
+    public string? Uuid { get; set; }
+    public string? Signature { get; set; }
+    public DateTime? TfaRegDeadline { get; set; }
+    /// <summary>Base64-encoded PNG suitable for <c>data:image/png;base64,...</c>.</summary>
+    public string? TotpQR64 { get; set; }
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/Api/Models/ReceiverAuthDtos.cs

@@ -0,0 +1,53 @@
+namespace EnvelopeGenerator.ReceiverUI.Web.Client.Api.Models;
+
+/// <summary>
+/// Mirrors <c>EnvelopeGenerator.API.Models.ReceiverAuthResponse</c>.
+/// The Status string determines which fields are relevant.
+/// Possible values:
+/// requires_access_code, requires_tfa, show_document,
+/// already_signed, rejected, not_found, expired, error.
+/// </summary>
+public class ReceiverAuthResponse
+{
+    public string Status { get; set; } = string.Empty;
+    public string? Title { get; set; }
+    public string? Message { get; set; }
+    public string? SenderEmail { get; set; }
+    public string? ReceiverName { get; set; }
+    public bool TfaEnabled { get; set; }
+    public bool HasPhoneNumber { get; set; }
+    public bool ReadOnly { get; set; }
+
+    /// <summary>"sms" or "authenticator" when Status == "requires_tfa".</summary>
+    public string? TfaType { get; set; }
+    public DateTime? TfaExpiration { get; set; }
+    public string? ErrorMessage { get; set; }
+}
+
+public class AccessCodeRequest
+{
+    public string AccessCode { get; set; } = string.Empty;
+    public bool PreferSms { get; set; }
+}
+
+public class TfaCodeRequest
+{
+    public string Code { get; set; } = string.Empty;
+    /// <summary>"sms" or "authenticator".</summary>
+    public string Type { get; set; } = "authenticator";
+}
+
+/// <summary>
+/// Status strings returned by <see cref="ReceiverAuthResponse.Status"/>.
+/// </summary>
+public static class ReceiverAuthStatus
+{
+    public const string RequiresAccessCode = "requires_access_code";
+    public const string RequiresTfa = "requires_tfa";
+    public const string ShowDocument = "show_document";
+    public const string AlreadySigned = "already_signed";
+    public const string Rejected = "rejected";
+    public const string NotFound = "not_found";
+    public const string Expired = "expired";
+    public const string Error = "error";
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/Api/ReceiverApiClient.cs

@@ -0,0 +1,214 @@
+using System.Net;
+using System.Net.Http.Json;
+using EnvelopeGenerator.ReceiverUI.Web.Client.Api.Models;
+
+namespace EnvelopeGenerator.ReceiverUI.Web.Client.Api;
+
+/// <summary>
+/// Typed HTTP client for the EnvelopeGenerator receiver API.
+/// All endpoints are routed through the BFF (same origin), so the
+/// authentication cookie set by the API is automatically attached
+/// by the browser to every request issued by the injected HttpClient.
+/// </summary>
+public class ReceiverApiClient
+{
+    private readonly HttpClient _http;
+    private readonly ILogger<ReceiverApiClient> _logger;
+
+    public ReceiverApiClient(HttpClient http, ILogger<ReceiverApiClient> logger)
+    {
+        _http = http;
+        _logger = logger;
+    }
+
+    // ?? Receiver Auth ????????????????????????????????????????????????
+
+    public Task<ReceiverAuthResponse?> GetStatusAsync(string envelopeKey, CancellationToken ct = default)
+        => GetAuthAsync($"api/receiverauth/{Uri.EscapeDataString(envelopeKey)}/status", ct);
+
+    public Task<ReceiverAuthResponse?> SubmitAccessCodeAsync(string envelopeKey, AccessCodeRequest req, CancellationToken ct = default)
+        => PostAuthAsync($"api/receiverauth/{Uri.EscapeDataString(envelopeKey)}/access-code", req, ct);
+
+    public Task<ReceiverAuthResponse?> SubmitTfaCodeAsync(string envelopeKey, TfaCodeRequest req, CancellationToken ct = default)
+        => PostAuthAsync($"api/receiverauth/{Uri.EscapeDataString(envelopeKey)}/tfa", req, ct);
+
+    // ?? Envelope Receiver ????????????????????????????????????????????
+
+    public async Task<EnvelopeReceiverDto?> GetEnvelopeReceiverAsync(string envelopeKey, CancellationToken ct = default)
+    {
+        var res = await _http.GetAsync($"api/envelopereceiver/{Uri.EscapeDataString(envelopeKey)}", ct);
+        if (!res.IsSuccessStatusCode)
+            return null;
+        return await res.Content.ReadFromJsonAsync<EnvelopeReceiverDto>(cancellationToken: ct);
+    }
+
+    /// <summary>Downloads the document bytes for the receiver to display in a PDF viewer.</summary>
+    public async Task<byte[]?> GetDocumentAsync(string envelopeKey, CancellationToken ct = default)
+    {
+        var res = await _http.GetAsync($"api/document/{Uri.EscapeDataString(envelopeKey)}", ct);
+        if (!res.IsSuccessStatusCode)
+            return null;
+        return await res.Content.ReadAsByteArrayAsync(ct);
+    }
+
+    // ?? Annotation / Sign / Reject ???????????????????????????????????
+
+    /// <summary>
+    /// Returns the signature placeholders the authenticated receiver must sign.
+    /// </summary>
+    public async Task<List<SignatureElementDto>> GetSignatureElementsAsync(CancellationToken ct = default)
+    {
+        try
+        {
+            return await _http.GetFromJsonAsync<List<SignatureElementDto>>("api/annotation/elements", ct)
+                   ?? new List<SignatureElementDto>();
+        }
+        catch (Exception ex)
+        {
+            _logger.LogWarning(ex, "Failed to fetch signature elements.");
+            return new List<SignatureElementDto>();
+        }
+    }
+
+    /// <summary>
+    /// Submits the signed envelope using the Blazor-friendly endpoint.
+    /// </summary>
+    public async Task<HttpStatusCode> SignBlazorAsync(BlazorSignaturePayload payload, CancellationToken ct = default)
+    {
+        var res = await _http.PostAsJsonAsync("api/annotation/blazor", payload, ct);
+        return res.StatusCode;
+    }
+
+    /// <summary>
+    /// Fetches the TOTP QR code + registration deadline for the given
+    /// envelope-receiver key (encoded uuid+signature). The API generates
+    /// a fresh secret on first call and persists it server-side.
+    /// </summary>
+    public async Task<(TfaRegistrationResponse? Data, HttpStatusCode Status)> GetTfaRegistrationAsync(string envelopeReceiverId, CancellationToken ct = default)
+    {
+        try
+        {
+            var res = await _http.GetAsync($"api/tfa/{Uri.EscapeDataString(envelopeReceiverId)}", ct);
+            if (!res.IsSuccessStatusCode)
+                return (null, res.StatusCode);
+            var data = await res.Content.ReadFromJsonAsync<TfaRegistrationResponse>(cancellationToken: ct);
+            return (data, res.StatusCode);
+        }
+        catch (Exception ex)
+        {
+            _logger.LogWarning(ex, "Failed to fetch TFA registration for {Key}", envelopeReceiverId);
+            return (null, HttpStatusCode.InternalServerError);
+        }
+    }
+
+    /// <summary>Submits the signed annotations payload. Returns the HTTP status code.</summary>
+    public async Task<HttpStatusCode> SignAsync<TPayload>(TPayload? payload, CancellationToken ct = default)
+    {
+        var res = payload is null
+            ? await _http.PostAsync("api/annotation", content: null, ct)
+            : await _http.PostAsJsonAsync("api/annotation", payload, ct);
+        return res.StatusCode;
+    }
+
+    public async Task<bool> RejectAsync(string reason, CancellationToken ct = default)
+    {
+        var res = await _http.PostAsJsonAsync("api/annotation/reject", reason, ct);
+        return res.IsSuccessStatusCode;
+    }
+
+    // ?? Read-only share ??????????????????????????????????????????????
+
+    public async Task<bool> ShareReadOnlyAsync(ReadOnlyShareRequest req, CancellationToken ct = default)
+    {
+        var res = await _http.PostAsJsonAsync("api/readonly", req, ct);
+        return res.IsSuccessStatusCode;
+    }
+
+    // ?? Auth (logout) ????????????????????????????????????????????????
+
+    public async Task<bool> LogoutAsync(CancellationToken ct = default)
+    {
+        var res = await _http.PostAsync("auth/logout", content: null, ct);
+        return res.IsSuccessStatusCode;
+    }
+
+    // ?? Localization ?????????????????????????????????????????????????
+
+    public async Task<Dictionary<string, string>?> GetLocalizationStringsAsync(CancellationToken ct = default)
+    {
+        try
+        {
+            return await _http.GetFromJsonAsync<Dictionary<string, string>>("api/Localization", ct);
+        }
+        catch (Exception ex)
+        {
+            _logger.LogWarning(ex, "Failed to fetch localization strings.");
+            return null;
+        }
+    }
+
+    public async Task SetLanguageAsync(string language, CancellationToken ct = default)
+    {
+        try
+        {
+            await _http.PostAsync($"api/Localization/lang?language={Uri.EscapeDataString(language)}", content: null, ct);
+        }
+        catch (Exception ex)
+        {
+            _logger.LogWarning(ex, "Failed to set language to {Lang}.", language);
+        }
+    }
+
+    /// <summary>
+    /// Returns the currently selected language code (e.g. "de", "en"), or
+    /// <c>null</c> if no language cookie has been set yet (the API answers
+    /// with HTTP 404 in that case).
+    /// </summary>
+    public async Task<string?> GetLanguageAsync(CancellationToken ct = default)
+    {
+        try
+        {
+            var res = await _http.GetAsync("api/Localization/lang", ct);
+            if (!res.IsSuccessStatusCode)
+                return null;
+            return (await res.Content.ReadAsStringAsync(ct))?.Trim('"');
+        }
+        catch (Exception ex)
+        {
+            _logger.LogWarning(ex, "Failed to read current language.");
+            return null;
+        }
+    }
+
+    // ?? Helpers ??????????????????????????????????????????????????????
+
+    private async Task<ReceiverAuthResponse?> GetAuthAsync(string url, CancellationToken ct)
+    {
+        var res = await _http.GetAsync(url, ct);
+        return await ReadAuthAsync(res, ct);
+    }
+
+    private async Task<ReceiverAuthResponse?> PostAuthAsync<TReq>(string url, TReq body, CancellationToken ct)
+    {
+        var res = await _http.PostAsJsonAsync(url, body, ct);
+        return await ReadAuthAsync(res, ct);
+    }
+
+    private static async Task<ReceiverAuthResponse?> ReadAuthAsync(HttpResponseMessage res, CancellationToken ct)
+    {
+        // ReceiverAuthController returns a ReceiverAuthResponse body for both
+        // 2xx and known error statuses (401/404/500). We always try to deserialize.
+        try
+        {
+            return await res.Content.ReadFromJsonAsync<ReceiverAuthResponse>(cancellationToken: ct);
+        }
+        catch
+        {
+            return new ReceiverAuthResponse
+            {
+                Status = ReceiverAuthStatus.Error,
+                ErrorMessage = $"Unexpected response ({(int)res.StatusCode})."
+            };
+        }
+    }
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/EnvelopeGenerator.ReceiverUI.Web.Client.csproj

@@ -0,0 +1,37 @@
+<Project Sdk="Microsoft.NET.Sdk.BlazorWebAssembly">
+  <PropertyGroup>
+    <TargetFramework>net8.0</TargetFramework>
+    <Nullable>enable</Nullable>
+    <ImplicitUsings>enable</ImplicitUsings>
+    <NoDefaultLaunchSettingsFile>true</NoDefaultLaunchSettingsFile>
+    <StaticWebAssetProjectMode>Default</StaticWebAssetProjectMode>
+    <MSBuildWarningsAsMessages>$(MSBuildWarningsAsMessage);WASM0001</MSBuildWarningsAsMessages>
+    <!-- Required so that native assets (libSkiaSharp, libHarfBuzzSharp) from
+         SkiaSharp.NativeAssets.WebAssembly / HarfBuzzSharp.NativeAssets.WebAssembly
+         are statically linked into the WASM runtime. Without this the
+         DevExpress PDF SkiaRenderer throws DllNotFoundException: libSkiaSharp.
+         Requires the "wasm-tools" workload: dotnet workload install wasm-tools -->
+    <!--<WasmBuildNative>false</WasmBuildNative>-->
+  </PropertyGroup>
+
+  <ItemGroup>
+    <PackageReference Include="DevExpress.Blazor" Version="25.2.*" />
+    <PackageReference Include="DevExpress.Blazor.PdfViewer" Version="25.2.*" />
+    <PackageReference Include="DevExpress.Pdf.SkiaRenderer" Version="25.2.*" />
+    <PackageReference Include="HarfBuzzSharp.NativeAssets.WebAssembly" Version="8.3.1.2" />
+    <PackageReference Include="SkiaSharp.NativeAssets.WebAssembly" Version="3.119.1" />
+    <PackageReference Include="DevExpress.AIIntegration.Blazor" Version="25.2.*" />
+    <PackageReference Include="DevExpress.AIIntegration.OpenAI" Version="25.2.*" />
+
+    <PackageReference Include="Azure.AI.OpenAI" Version="2.2.0-beta.5" />
+    <PackageReference Include="Microsoft.Extensions.AI" Version="9.7.1" />
+    <PackageReference Include="Microsoft.Extensions.AI.OpenAI" Version="9.7.1-preview.1.25365.4" />
+
+    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="8.0.20" />
+    <PackageReference Include="Microsoft.Extensions.Http" Version="8.0.1" />
+  </ItemGroup>
+
+  <ItemGroup>
+    <EmbeddedResource Include="Documents\Invoice.pdf" />
+  </ItemGroup>
+</Project>

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/Layout/Drawer.razor

@@ -0,0 +1,38 @@
+@inherits DrawerStateComponentBase
+
+<div class="drawer-container">
+    <DxDrawer PanelWidth="@PanelWidth"
+              CssClass="@(CssClass + " mobile")"
+              Mode="DrawerMode.Overlap"
+              IsOpen="@ToggledDrawer"
+              BodyTemplate="BodyTemplate"
+              HeaderTemplate="HeaderTemplate"
+              FooterTemplate="FooterTemplate"
+              ApplyBackgroundShading="false"
+              ClosedCssClass="panel-closed">
+        <TargetContent>
+            <DxDrawer PanelWidth="@PanelWidth"
+                      CssClass="@CssClass"
+                      Mode="DrawerMode.Shrink"
+                      IsOpen="@(!ToggledDrawer)"
+                      BodyTemplate="BodyTemplate"
+                      HeaderTemplate="HeaderTemplate"
+                      FooterTemplate="FooterTemplate"
+                      OpenCssClass="panel-open">
+                <TargetContent>
+                    <div class="navigation-drawer-shading"></div>
+                    @TargetContent
+                </TargetContent>
+            </DxDrawer>
+        </TargetContent>
+    </DxDrawer>
+</div>
+
+@code {
+    [Parameter] public string? CssClass { get; set; }
+    [Parameter] public string? PanelWidth { get; set; }
+    [Parameter] public RenderFragment? TargetContent { get; set; }
+    [Parameter] public RenderFragment? BodyTemplate { get; set; }
+    [Parameter] public RenderFragment? HeaderTemplate { get; set; }
+    [Parameter] public RenderFragment? FooterTemplate { get; set; }
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/Layout/Drawer.razor.css

@@ -0,0 +1,53 @@
+.drawer-container {
+    height: 100%;
+}
+
+.navigation-drawer-shading {
+    height: 100%;
+    position: absolute;
+    transition: ease 300ms;
+    transition-property: opacity, visibility;
+    visibility: visible;
+    width: 100%;
+    z-index: 99;
+    background-color: var(--dxds-color-surface-backdrop-default-rest);
+}
+
+.navigation-drawer.mobile.panel-closed .navigation-drawer-shading {
+    opacity: 0;
+    visibility: hidden;
+}
+
+::deep .navigation-drawer > .dxbl-drawer-panel {
+    display: flex;
+}
+
+::deep .navigation-drawer.mobile > .dxbl-drawer-panel {
+    display: none;
+}
+
+.navigation-drawer-shading {
+    display: none;
+}
+
+::deep .panel-open:not(.mobile) .nav-buttons-container .menu-button {
+    display: none;
+}
+
+@media (max-width: 768px) {
+    ::deep .navigation-drawer > .dxbl-drawer-panel {
+        display: none;
+    }
+
+    ::deep .navigation-drawer.mobile > .dxbl-drawer-panel {
+        display: flex;
+    }
+
+    .navigation-drawer-shading {
+        display: block;
+    }
+
+    ::deep .panel-open:not(.mobile) .nav-buttons-container .menu-button {
+        display: flex;
+    }
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/Layout/MainLayout.razor

@@ -0,0 +1,53 @@
+@inherits DrawerStateLayoutComponentBase
+@inject NavigationManager NavigationManager
+
+<div class="page">
+    <Drawer CssClass="navigation-drawer" PanelWidth="240px">
+        <HeaderTemplate>
+            <div class="navigation-drawer-header">
+                <NavLink href="@AddDrawerStateToUrl("/")">
+                    <img class="logo" src="images/logo.svg" alt="DevExpress logo" />
+                </NavLink>
+                <NavLink aria-label="Close menu" href="@AddDrawerStateToUrlToggled(LocalPath)">
+                    <DxButton aria-label="Close menu" RenderStyle="ButtonRenderStyle.Light" RenderStyleMode="ButtonRenderStyleMode.Text" CssClass="btn-icon-only" IconCssClass="@(ToggledDrawer ? "icon icon-close" : "icon icon-menu")"></DxButton>
+                </NavLink>
+            </div>
+        </HeaderTemplate>
+        <BodyTemplate>
+            <div class="w-100">
+                <NavMenu></NavMenu>
+            </div>
+        </BodyTemplate>
+        <FooterTemplate>
+            <div class="navigation-drawer-footer">
+                <NavLink href="https://docs.devexpress.com/Blazor/400725/blazor-components" class="button-link">
+                    <DxButton Text="Docs" RenderStyle="ButtonRenderStyle.Light" RenderStyleMode="ButtonRenderStyleMode.Text" IconCssClass="icon icon-docs"></DxButton>
+                </NavLink>
+                <NavLink href="https://demos.devexpress.com/blazor/" class="button-link">
+                    <DxButton Text="Demos" RenderStyle="ButtonRenderStyle.Light" RenderStyleMode="ButtonRenderStyleMode.Text" IconCssClass="icon icon-demos"></DxButton>
+                </NavLink>
+            </div>
+        </FooterTemplate>
+        <TargetContent>
+            <div class="drawer-content">
+                <div class="nav-buttons-container">
+                    <NavLink aria-label="Open menu" href="@AddDrawerStateToUrlToggled(LocalPath)" class="menu-button">
+                        <DxButton aria-label="Open menu" RenderStyle="ButtonRenderStyle.Secondary" RenderStyleMode="ButtonRenderStyleMode.Text" CssClass="btn-icon-only" IconCssClass="icon icon-menu"></DxButton>
+                    </NavLink>
+                    @if (LocalPath != "/") {
+                        <NavLink href="@AddDrawerStateToUrl("/")" class="button-link">
+                            <DxButton Text="Back to Home" RenderStyle="ButtonRenderStyle.Secondary" RenderStyleMode="ButtonRenderStyleMode.Text" CssClass="back-button" IconCssClass="icon icon-back"></DxButton>
+                        </NavLink>
+                    }
+                </div>
+                <div class="page-content-container">
+                    @Body
+                </div>
+            </div>
+        </TargetContent>
+    </Drawer>
+</div>
+
+@code {
+    string LocalPath => new Uri(NavigationManager.Uri).LocalPath;
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/Layout/MainLayout.razor.css

@@ -0,0 +1,67 @@
+.page {
+    height: 100%;
+    min-height: 0;
+}
+
+::deep .navigation-drawer {
+    --dxbl-drawer-panel-body-padding-x: 0;
+    --dxbl-drawer-panel-body-padding-y: 1rem;
+    --dxbl-drawer-panel-footer-bg: none;
+    --dxbl-drawer-panel-header-bg: none;
+    --dxbl-drawer-separator-border-width: 0;
+}
+
+::deep .navigation-drawer > .dxbl-drawer-panel {
+    background-image: linear-gradient(180deg, var(--dxds-color-surface-primary-default-rest) 0%, var(--dxds-primary-170) 150%);
+}
+
+.navigation-drawer-header {
+    align-items: center;
+    display: flex;
+    justify-content: space-between;
+    padding: 1.375rem 0.375rem;
+    width: 100%;
+}
+
+.navigation-drawer-header .logo {
+    height: 1.5rem;
+    width: 9rem;
+}
+
+.navigation-drawer-footer {
+    display: flex;
+    justify-content: space-evenly;
+    padding-bottom: 0.875rem;
+    width: 100%;
+}
+
+.drawer-content {
+    display: flex;
+    flex-direction: column;
+    height: 100%;
+    overflow: auto;
+    padding: 2rem 1.5rem 1.5rem 1.5rem;
+}
+
+.nav-buttons-container {
+    align-items: center;
+    display: flex;
+    gap: 0.625rem;
+    min-height: 2rem;
+}
+
+::deep .nav-buttons-container > a {
+    color: inherit;
+}
+
+::deep .nav-buttons-container .back-button {
+    padding-left: 0;
+    padding-right: 0.25rem;
+}
+
+.page-content-container {
+    display: flex;
+    flex-direction: column;
+    flex-grow: 1;
+    min-height: 0;
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/Layout/NavMenu.razor

@@ -0,0 +1,35 @@
+@inject NavigationManager NavigationManager
+@implements IDisposable
+
+<div>
+    <DxMenu Orientation="@Orientation.Vertical" CssClass="menu">
+        <Items>
+            <DxMenuItem NavigateUrl="/samples" Text="Samples" CssClass="@MenuItemCssClass("/samples")" IconCssClass="icon icon-home"></DxMenuItem>
+            <DxMenuItem NavigateUrl="/counter" Text="Counter" CssClass="@MenuItemCssClass("/counter")" IconCssClass="icon icon-counter"></DxMenuItem>
+            <DxMenuItem NavigateUrl="/weather" Text="Weather" CssClass="@MenuItemCssClass("/weather")" IconCssClass="icon icon-weather"></DxMenuItem>
+            <DxMenuItem NavigateUrl="/pdfviewer" Text="PDF Viewer" CssClass="@MenuItemCssClass("/pdfviewer")" IconCssClass="icon icon-pdf-viewer"></DxMenuItem>
+        </Items>
+    </DxMenu>
+</div>
+
+@code {
+    private string? currentLocalPath;
+
+    protected override void OnInitialized() {
+        currentLocalPath = new Uri(NavigationManager.Uri).LocalPath;
+        NavigationManager.LocationChanged += OnLocationChanged;
+    }
+
+    private void OnLocationChanged(object? sender, LocationChangedEventArgs e) {
+        currentLocalPath = new Uri(NavigationManager.Uri).LocalPath;
+        InvokeAsync(StateHasChanged);
+    }
+
+    private string? MenuItemCssClass(string itemPath) {
+        return string.Equals(currentLocalPath, itemPath, StringComparison.OrdinalIgnoreCase) ? "menu-item-active" : null;
+    }
+
+    public void Dispose() {
+        NavigationManager.LocationChanged -= OnLocationChanged;
+    }
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/Layout/NavMenu.razor.css

@@ -0,0 +1,23 @@
+::deep .menu {
+    --dxbl-menu-bottom-left-border-radius: 0;
+    --dxbl-menu-bottom-right-border-radius: 0;
+    --dxbl-menu-top-left-border-radius: 0;
+    --dxbl-menu-top-right-border-radius: 0;
+    --dxbl-menu-item-padding-x: 1.125rem;
+    --dxbl-menu-item-padding-y: 0.5rem;
+    --dxbl-menu-item-color: var(--dxds-color-content-neutral-default-static-dark-rest);
+    --dxbl-menu-item-image-color: var(--dxds-color-content-neutral-default-static-dark-rest);
+    --dxbl-menu-item-hover-bg: rgb(from var(--dxds-color-surface-neutral-default-static-light-rest) r g b / 0.15);
+    --dxbl-menu-item-hover-color: var(--dxds-color-content-neutral-default-static-dark-hovered);
+    --dxbl-menu-item-hover-image-color: var(--dxds-color-content-neutral-default-static-dark-hovered);
+
+    background: none;
+}
+
+::deep .menu.display-mobile {
+    margin-bottom: 2rem;
+}
+
+::deep .menu-item-active {
+    background-color: rgb(from var(--dxds-color-surface-neutral-default-static-light-rest) r g b / 0.05);
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/Layout/ReceiverLayout.razor

@@ -0,0 +1,116 @@
+@inherits LayoutComponentBase
+@implements IDisposable
+@inject LocalizationService Loc
+@inject NavigationManager Nav
+@inject IJSRuntime JS
+
+@*
+    Layout for the receiver-facing pages migrated from EnvelopeGenerator.Web.
+    Mirrors the legacy MVC <body> structure: page content + sticky footer
+    with copyright link, language switcher and privacy link.
+
+    Cookie consent is reimplemented in Blazor (localStorage-backed) because
+    ASP.NET Core's <ITrackingConsentFeature> only works on the server side
+    and is awkward to integrate with InteractiveAuto rendering.
+*@
+
+<div class="receiver-shell">
+
+    @* Main page content *@
+    <main role="main" class="flex-grow-1">
+        @Body
+    </main>
+
+    @* Cookie consent banner (Blazor counterpart of _CookieConsentPartial). *@
+    @if (_consentVisible)
+    {
+        <div class="receiver-cookie-banner" role="alertdialog" aria-live="polite">
+            <span>@Loc["CookieConsentMessage"]</span>
+            <DxButton Text="@Loc["Accept"]"
+                      RenderStyle="ButtonRenderStyle.Primary"
+                      Click="AcceptCookiesAsync" />
+        </div>
+    }
+
+    @* Footer (copyright + language switcher + privacy). *@
+    <footer class="receiver-footer">
+        <span>
+            &copy; SignFlow 2023-@DateTime.Now.Year
+            <a href="https://digitaldata.works" target="_blank" rel="noopener">Digital Data GmbH</a>
+        </span>
+
+        <div class="d-flex align-items-center gap-2">
+            <select class="language-switcher" value="@_currentLang" @onchange="OnLanguageChangedAsync">
+                @foreach (var (lang, native, _) in LocalizationService.SupportedLanguages)
+                {
+                    <option value="@lang" selected="@(lang == _currentLang)">@native</option>
+                }
+            </select>
+        </div>
+
+        <a href="@($"/privacy-policy.{_currentLang}.html")" target="_blank" rel="noopener">
+            @Loc["Privacy"]
+        </a>
+    </footer>
+</div>
+
+@code {
+    private string _currentLang = "de";
+    private bool _consentVisible;
+
+    protected override async Task OnInitializedAsync()
+    {
+        Loc.Changed += OnLocChanged;
+        await Loc.EnsureLoadedAsync();
+        _currentLang = Loc.CurrentLanguage ?? "de";
+    }
+
+    protected override async Task OnAfterRenderAsync(bool firstRender)
+    {
+        if (!firstRender) return;
+        // Probe localStorage on the client only — InteractiveAuto means
+        // the server prerender runs without a browser, so JS interop is
+        // unavailable until the first client render.
+        try
+        {
+            var accepted = await JS.InvokeAsync<string?>("localStorage.getItem", "receiver.cookie-consent");
+            _consentVisible = accepted != "1";
+            StateHasChanged();
+        }
+        catch
+        {
+            // No-op: server prerender (JS unavailable) keeps the banner hidden.
+        }
+    }
+
+    private async Task AcceptCookiesAsync()
+    {
+        try
+        {
+            await JS.InvokeVoidAsync("localStorage.setItem", "receiver.cookie-consent", "1");
+        }
+        catch { /* ignore */ }
+        _consentVisible = false;
+    }
+
+    private async Task OnLanguageChangedAsync(ChangeEventArgs e)
+    {
+        var code = e.Value?.ToString();
+        if (string.IsNullOrEmpty(code) || code == _currentLang)
+            return;
+
+        _currentLang = code;
+        await Loc.ChangeLanguageAsync(code);
+        // Force a full reload so ASP.NET Core localization middleware
+        // picks up the new culture for any subsequent SSR / API calls.
+        Nav.NavigateTo(Nav.Uri, forceLoad: true);
+    }
+
+    private void OnLocChanged()
+    {
+        _currentLang = Loc.CurrentLanguage ?? _currentLang;
+        InvokeAsync(StateHasChanged);
+    }
+
+    public void Dispose() => Loc.Changed -= OnLocChanged;
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/Pages/Counter.razor

@@ -0,0 +1,24 @@
+@page "/counter"
+
+<PageTitle>Counter</PageTitle>
+
+<h1>Counter</h1>
+
+<div class="counter-block">
+    <div class="counter-content">
+        <div class="counter-count">
+            @currentCount
+        </div>
+        current count
+    </div>
+    <DxButton Click="IncrementCount">Click me</DxButton>
+</div>
+
+@code {
+    private int currentCount;
+
+    private void IncrementCount()
+    {
+        currentCount++;
+    }
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/Pages/Counter.razor.css

@@ -0,0 +1,25 @@
+.counter-block {
+    align-items: center;
+    border-radius: 1rem;
+    display: flex;
+    flex-direction: column;
+    gap: 1.5rem;
+    height: 17rem;
+    justify-content: center;
+    padding: 2.5rem 1.5rem 1.5rem;
+    width: 16.875rem;
+    border: 1px solid var(--dxds-color-border-neutral-default-rest);
+}
+
+.counter-block .counter-content {
+    align-items: center;
+    display: flex;
+    flex-direction: column;
+    gap: 0.5rem;
+}
+
+.counter-block .counter-count {
+    font-size: 7.5rem;
+    font-weight: 400;
+    line-height: 7.75rem;
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/Pages/Index/Index.razor

@@ -0,0 +1,27 @@
+@page "/samples"
+
+<PageTitle>Welcome</PageTitle>
+
+<div class="main-content">
+    <DxGridLayout CssClass="index-gridlayout">
+        <Rows>
+            <DxGridLayoutRow Height="auto" Areas="header"></DxGridLayoutRow>
+            <DxGridLayoutRow Height="auto" Areas="tiles"></DxGridLayoutRow>
+        </Rows>
+        <Items>
+            <DxGridLayoutItem Area="header" CssClass="title">
+                <Template>
+                    <div class="title-header-text">Hello World!</div>
+                    <div class="title-content-text">Welcome to your new DevExpress Blazor Application</div>
+                </Template>
+            </DxGridLayoutItem>
+            <DxGridLayoutItem Area="tiles" CssClass="tiles">
+                <Template>
+                    <IndexTile NavigateUrl="/counter" Title="Counter" Description="Count mouse clicks and track the total." IconCssClass="icon-counter" />
+                    <IndexTile NavigateUrl="/weather" Title="Weather" Description="See a 5-day temperature and weather conditions forecast." IconCssClass="icon-weather" />
+                    <IndexTile NavigateUrl="/pdfviewer" Title="PDF Viewer" Description="Load PDF files and view them in the web browser." IconCssClass="icon-pdf-viewer" />
+                </Template>
+            </DxGridLayoutItem>
+        </Items>
+    </DxGridLayout>
+</div>

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/Pages/Index/Index.razor.css

@@ -0,0 +1,31 @@
+::deep .index-gridlayout {
+    container-type: inline-size;
+    height: auto;
+    margin-top: auto;
+    margin-bottom: auto;
+    padding-bottom: 9rem;
+}
+
+::deep .title {
+    padding-bottom: 3rem;
+    text-align: center;
+}
+
+::deep .tiles {
+    --tile-column-count: 4;
+
+    display: grid;
+    gap: 1rem;
+    grid-template-columns: repeat(var(--tile-column-count), max-content);
+    justify-content: center;
+
+    @container (max-width: 60.5rem) {
+        --tile-column-count: 3;
+    }
+    @container (max-width: 45.125rem) {
+        --tile-column-count: 2;
+    }
+    @container (max-width: 29.75rem) {
+        --tile-column-count: 1;
+    }
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/Pages/Index/IndexTile.razor

@@ -0,0 +1,40 @@
+@inherits DrawerStateComponentBase
+
+<div class="tile">
+    <NavLink href="@AddDrawerStateToUrl(NavigateUrl)">
+        <DxGridLayout CssClass="tile-content" ColumnSpacing="0.75rem" RowSpacing="0.75rem">
+            <Rows>
+                <DxGridLayoutRow Areas="icon title" Height="auto" />
+                <DxGridLayoutRow Areas="description description" Height="auto" />
+            </Rows>
+            <Columns>
+                <DxGridLayoutColumn Width="auto" />
+                <DxGridLayoutColumn />
+            </Columns>
+            <Items>
+                <DxGridLayoutItem Area="icon" CssClass="tile-icon">
+                    <Template>
+                        <div class="@("icon " + IconCssClass)" aria-hidden="true"></div>
+                    </Template>
+                </DxGridLayoutItem>
+                <DxGridLayoutItem Area="title" CssClass="tile-title">
+                    <Template>
+                        @Title
+                    </Template>
+                </DxGridLayoutItem>
+                <DxGridLayoutItem Area="description" CssClass="tile-description">
+                    <Template>
+                        @Description
+                    </Template>
+                </DxGridLayoutItem>
+            </Items>
+        </DxGridLayout>
+    </NavLink>
+</div>
+
+@code {
+    [Parameter] public string NavigateUrl { get; set; } = string.Empty;
+    [Parameter] public string? Title { get; set; }
+    [Parameter] public string? Description { get; set; }
+    [Parameter] public string? IconCssClass { get; set; }
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/Pages/Index/IndexTile.razor.css

@@ -0,0 +1,44 @@
+.tile {
+    border-radius: 0.75rem;
+    height: 7.5rem;
+    transition: box-shadow 0.2s;
+    width: 14.375rem;
+    border: 1px solid var(--dxds-color-border-neutral-default-rest);
+}
+
+.tile:hover {
+    box-shadow: 0 4px 8px 0 rgba(170, 170, 170, 0.24), 0 0 2px 0 rgba(170, 170, 170, 0.2);
+}
+
+.tile ::deep > a {
+    text-decoration: none;
+}
+
+::deep .tile-content {
+    padding: 1rem;
+}
+
+::deep .tile-icon {
+    border-radius: 0.375rem;
+    height: 2.75rem;
+    padding: 0.75rem;
+    width: 2.75rem;
+    border: 1px solid var(--dxds-color-border-neutral-default-rest);
+}
+
+::deep .tile-title {
+    align-self: center;
+    color: var(--dxds-color-content-neutral-default-rest);
+    font-size: var(--dxds-font-size-base-md);
+    font-weight: var(--dxds-font-weight-base-strong);
+    letter-spacing: var(--dxds-letter-spacing-base-md);
+    line-height: var(--dxds-line-height-base-md);
+}
+
+::deep .tile-description {
+    color: var(--dxds-color-content-neutral-subdued-rest);
+    font-size: var(--dxds-font-size-base-sm);
+    font-weight: var(--dxds-font-weight-base-default);
+    letter-spacing: var(--dxds-letter-spacing-base-sm);
+    line-height: var(--dxds-line-height-base-sm);
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/Pages/PdfViewer.razor

@@ -0,0 +1,22 @@
+@page "/pdfviewer"
+
+<PageTitle>PDF Viewer</PageTitle>
+
+<h1>PDF Viewer</h1>
+
+<DxPdfViewer CssClass="h-100 w-100" DocumentContent="DocumentContent" ZoomLevel="1" />
+
+@code {
+    byte[]? DocumentContent { get; set; }
+
+    protected override async Task OnInitializedAsync() {
+        await base.OnInitializedAsync();
+
+        await using Stream stream =
+            System.Reflection.Assembly.GetExecutingAssembly().GetManifestResourceStream("EnvelopeGenerator.ReceiverUI.Web.Client.Documents.Invoice.pdf")
+            ?? throw new InvalidOperationException("Resource not found.");
+        using MemoryStream ms = new();
+        await stream.CopyToAsync(ms);
+        DocumentContent = ms.ToArray();
+    }
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/Pages/Receiver/EnvelopeExpired.razor

@@ -0,0 +1,24 @@
+@page "/envelope-expired"
+@layout EnvelopeGenerator.ReceiverUI.Web.Client.Layout.ReceiverLayout
+@rendermode InteractiveAuto
+@inject LocalizationService Loc
+
+@*
+    Counterpart of Views/Envelope/EnvelopeExpired.cshtml.
+*@
+
+<PageTitle>@Loc["Expired"]</PageTitle>
+
+<div class="page container p-5">
+    <header class="text-center">
+        <div class="icon expired"></div>
+        <h1>@Loc["Expired"]</h1>
+    </header>
+    <section class="text-center">
+        <p>@Loc["DocumentSharingPeriodExpired"]</p>
+    </section>
+</div>
+
+@code {
+    protected override async Task OnInitializedAsync() => await Loc.EnsureLoadedAsync();
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/Pages/Receiver/EnvelopeKeyRedirect.razor

@@ -0,0 +1,20 @@
+@page "/envelopekey/{*Path}"
+@layout EnvelopeGenerator.ReceiverUI.Web.Client.Layout.ReceiverLayout
+@rendermode InteractiveAuto
+@inject NavigationManager Nav
+
+@*
+    Counterpart of EnvelopeKeyRedirController:
+    /EnvelopeKey/{*path} ? /envelope/{path}
+    Preserves backwards compatibility with links generated by older e-mails.
+*@
+
+@code {
+    [Parameter] public string? Path { get; set; }
+
+    protected override void OnInitialized()
+    {
+        var target = "/envelope/" + (Path ?? string.Empty).TrimStart('/');
+        Nav.NavigateTo(target, replace: true);
+    }
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/Pages/Receiver/EnvelopeLockedView.razor

@@ -0,0 +1,229 @@
+@implements IDisposable
+@inject ReceiverApiClient Api
+@inject ReceiverAuthState State
+@inject LocalizationService Loc
+
+@*
+    Counterpart of EnvelopeGenerator.Web/Views/Envelope/EnvelopeLocked.cshtml.
+
+    Renders one of three input modes based on the current auth state:
+
+      • Status == requires_access_code
+          ? AccessCode input (+ optional "2FA per SMS" toggle)
+
+      • Status == requires_tfa, TfaType == "sms"
+          ? SMS code input + countdown until TfaExpiration
+
+      • Status == requires_tfa, TfaType == "authenticator"
+          ? Authenticator code input + "set up authenticator" link
+
+    On submit, the matching ReceiverApiClient method is invoked. The fresh
+    response replaces ReceiverAuthState.Current; the parent EnvelopePage
+    re-renders and either shows the document or navigates to a terminal page.
+*@
+
+<div class="page container py-4 px-4">
+
+    @* — Welcome banner (custom company image is added in Phase 6) — *@
+    <header class="text-center">
+        <div class="header-1 alert alert-secondary" role="alert">
+            <h3 class="text">@Loc["WelcomeToTheESignPortal"]</h3>
+        </div>
+
+        <div class="icon locked @(IsTfa ? "tfa" : "") mt-4 mb-1">
+            <svg xmlns="http://www.w3.org/2000/svg" width="72" height="72" fill="currentColor"
+                 class="bi bi-shield-lock" viewBox="0 0 16 16">
+                <path d="M5.338 1.59a61 61 0 0 0-2.837.856.48.48 0 0 0-.328.39c-.554 4.157.726 7.19 2.253 9.188a10.7 10.7 0 0 0 2.287 2.233c.346.244.652.42.893.533q.18.085.293.118a1 1 0 0 0 .101.025 1 1 0 0 0 .1-.025q.114-.034.294-.118c.24-.113.547-.29.893-.533a10.7 10.7 0 0 0 2.287-2.233c1.527-1.997 2.807-5.031 2.253-9.188a.48.48 0 0 0-.328-.39c-.651-.213-1.75-.56-2.837-.855C9.552 1.29 8.531 1.067 8 1.067c-.53 0-1.552.223-2.662.524zM5.072.56C6.157.265 7.31 0 8 0s1.843.265 2.928.56c1.11.3 2.229.655 2.887.87a1.54 1.54 0 0 1 1.044 1.262c.596 4.477-.787 7.795-2.465 9.99a11.8 11.8 0 0 1-2.517 2.453 7 7 0 0 1-1.048.625c-.28.132-.581.24-.829.24s-.548-.108-.829-.24a7 7 0 0 1-1.048-.625 11.8 11.8 0 0 1-2.517-2.453C1.928 10.487.545 7.169 1.141 2.692A1.54 1.54 0 0 1 2.185 1.43 63 63 0 0 1 5.072.56" />
+                <path d="M9.5 6.5a1.5 1.5 0 0 1-1 1.415l.385 1.99a.5.5 0 0 1-.491.595h-.788a.5.5 0 0 1-.49-.595l.384-1.99a1.5 1.5 0 1 1 2-1.415" />
+            </svg>
+        </div>
+        <h1>@Loc[$"LockedTitle{CodeKey}"]</h1>
+    </header>
+
+    @* — "Set up authenticator" hint, shown only on the authenticator step — *@
+    @if (IsAuthenticator)
+    {
+        <section class="text-center">
+            <p class="m-0 p-0">
+                @Loc["AuthenticatorSetup_Prefix"]
+                <a class="icon-link m-0 p-0" href="@($"/tfa/{EnvelopeKey}")" target="_blank" style="text-decoration:none">
+                    @Loc["AuthenticatorSetup_Link"] <i class="bi bi-box-arrow-up-right"></i>
+                </a>
+                @Loc["AuthenticatorSetup_Suffix"]
+            </p>
+        </section>
+    }
+
+    <section class="text-center">
+        <p>@Loc[$"LockedBody{CodeKey}"]</p>
+    </section>
+
+    <div class="row m-0 p-0">
+        <div class="access-code-panel justify-content-center align-items-center p-0 m-0">
+            <EditForm Model="this" OnValidSubmit="HandleSubmit" Context="editContext"
+                      id="form-access-code" class="form form-floating mb-0">
+                <div class="form-floating access-code-form-floating">
+
+                    <input id="access_code" type="password" class="form-control"
+                           placeholder="@Loc[$"LockedCodeLabel{CodeKey}"]"
+                           @bind="Code" @bind:event="oninput"
+                           disabled="@_submitting" required />
+                    <label for="access_code">@Loc[$"LockedCodeLabel{CodeKey}"]</label>
+
+                    <DxButton SubmitFormOnClick="true" Enabled="@(!_submitting)"
+                              RenderStyle="ButtonRenderStyle.Primary"
+                              CssClass="btn btn-primary">
+                        <span class="material-symbols-outlined">login</span>
+                    </DxButton>
+
+                    @if (ShowSmsToggle)
+                    {
+                        <div class="form-check form-switch tfa-sms">
+                            <input class="form-check-input" type="checkbox" role="switch"
+                                   id="flexSwitchCheckChecked"
+                                   @bind="PreferSms"
+                                   disabled="@(!State.Current!.HasPhoneNumber)" />
+                            <label class="form-check-label" for="flexSwitchCheckChecked">2FA per SMS</label>
+                        </div>
+                    }
+
+                    @if (IsSms && _smsRemaining is not null)
+                    {
+                        <div id="sms-timer" class="alert alert-primary" role="alert">@_smsRemaining</div>
+                    }
+                </div>
+            </EditForm>
+        </div>
+    </div>
+
+    @if (!string.IsNullOrEmpty(State.Current?.ErrorMessage))
+    {
+        <div id="access-code-error-message" class="alert alert-danger row" role="alert">
+            @State.Current.ErrorMessage
+        </div>
+    }
+
+    <section class="no-receiver-explanation text-center">
+        <details>
+            <summary>@Loc[$"LockedFooterTitle{CodeKey}"]</summary>
+            <p>
+                @Loc.Format($"LockedFooterBody{CodeKey}",
+                    State.Current?.SenderEmail ?? string.Empty,
+                    $"Envelope - {State.Current?.Title}",
+                    string.Empty)
+            </p>
+        </details>
+    </section>
+</div>
+
+@code {
+    [Parameter] public string EnvelopeKey { get; set; } = string.Empty;
+
+    private string Code { get; set; } = string.Empty;
+    private bool PreferSms { get; set; }
+    private bool _submitting;
+    private System.Threading.Timer? _smsTimer;
+    private string? _smsRemaining;
+
+    // — Mode helpers ????????????????????????????????????????????????
+    private bool IsAccessCodeStep => State.Current?.Status == ReceiverAuthStatus.RequiresAccessCode;
+    private bool IsTfa            => State.Current?.Status == ReceiverAuthStatus.RequiresTfa;
+    private bool IsSms            => IsTfa && State.Current?.TfaType == "sms";
+    private bool IsAuthenticator  => IsTfa && State.Current?.TfaType == "authenticator";
+
+    /// <summary>
+    /// Mirrors the legacy view's "codeKeyName" suffix used to pick the right
+    /// resource string ("LockedTitleAccess", "LockedTitleSms", ...).
+    /// </summary>
+    private string CodeKey => IsSms ? "Sms" : IsAuthenticator ? "Authenticator" : "Access";
+
+    private bool ShowSmsToggle =>
+        IsAccessCodeStep
+        && (State.Current?.TfaEnabled ?? false);
+
+    protected override async Task OnInitializedAsync()
+    {
+        await Loc.EnsureLoadedAsync();
+        State.Changed += OnStateChanged;
+        ResetSmsTimer();
+    }
+
+    private void OnStateChanged()
+    {
+        ResetSmsTimer();
+        InvokeAsync(StateHasChanged);
+    }
+
+    private async Task HandleSubmit()
+    {
+        if (_submitting || string.IsNullOrWhiteSpace(Code))
+            return;
+
+        _submitting = true;
+        try
+        {
+            ReceiverAuthResponse? res;
+            if (IsAccessCodeStep)
+            {
+                res = await Api.SubmitAccessCodeAsync(EnvelopeKey, new AccessCodeRequest
+                {
+                    AccessCode = Code,
+                    PreferSms  = PreferSms
+                });
+            }
+            else // TFA step
+            {
+                res = await Api.SubmitTfaCodeAsync(EnvelopeKey, new TfaCodeRequest
+                {
+                    Code = Code,
+                    Type = State.Current?.TfaType ?? "authenticator"
+                });
+            }
+
+            Code = string.Empty;
+            State.Set(EnvelopeKey, res);
+        }
+        finally
+        {
+            _submitting = false;
+        }
+    }
+
+    // — SMS countdown ???????????????????????????????????????????????
+    private void ResetSmsTimer()
+    {
+        _smsTimer?.Dispose();
+        _smsTimer = null;
+        _smsRemaining = null;
+
+        if (!IsSms || State.Current?.TfaExpiration is not DateTime exp)
+            return;
+
+        UpdateRemaining(exp);
+        _smsTimer = new System.Threading.Timer(_ =>
+        {
+            UpdateRemaining(exp);
+            InvokeAsync(StateHasChanged);
+        }, null, 1000, 1000);
+    }
+
+    private void UpdateRemaining(DateTime expiration)
+    {
+        var diff = expiration - DateTime.Now;
+        if (diff <= TimeSpan.Zero)
+        {
+            _smsRemaining = "00:00";
+            _smsTimer?.Dispose();
+            _smsTimer = null;
+            return;
+        }
+        _smsRemaining = $"{(int)diff.TotalMinutes:00}:{diff.Seconds:00}";
+    }
+
+    public void Dispose()
+    {
+        State.Changed -= OnStateChanged;
+        _smsTimer?.Dispose();
+    }
+}
+

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/Pages/Receiver/EnvelopeNotFound.razor

@@ -0,0 +1,24 @@
+@page "/envelope-not-found"
+@layout EnvelopeGenerator.ReceiverUI.Web.Client.Layout.ReceiverLayout
+@rendermode InteractiveAuto
+@inject LocalizationService Loc
+
+@*
+    Counterpart of the "EnvelopeNotFound" view (rendered by
+    EnvelopeGenerator.Web.Extensions.ViewExtensions.ViewEnvelopeNotFound()).
+*@
+
+<PageTitle>@Loc["EnvelopeNotFoundTitle"]</PageTitle>
+
+<div class="page container p-5">
+    <header class="text-center">
+        <h1>@Loc["EnvelopeNotFoundTitle"]</h1>
+    </header>
+    <section class="text-center">
+        <p>@Loc["EnvelopeNotFoundBody"]</p>
+    </section>
+</div>
+
+@code {
+    protected override async Task OnInitializedAsync() => await Loc.EnsureLoadedAsync();
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/Pages/Receiver/EnvelopePage.razor

@@ -0,0 +1,110 @@
+@page "/envelope/{Key}"
+@layout EnvelopeGenerator.ReceiverUI.Web.Client.Layout.ReceiverLayout
+@rendermode InteractiveAuto
+@inject ReceiverApiClient Api
+@inject ReceiverAuthState State
+@inject LocalizationService Loc
+@inject NavigationManager Nav
+
+@*
+    Counterpart of EnvelopeGenerator.Web/Controllers/EnvelopeController.Main.
+
+    Behavior:
+      1. Calls GET /api/receiverauth/{key}/status.
+      2. Routes to a sub-view based on the response Status:
+         - requires_access_code / requires_tfa ? EnvelopeLockedView (Phase 3)
+         - show_document                       ? ShowEnvelopeView    (Phase 4)
+         - already_signed                      ? /envelope-signed
+         - rejected                            ? /envelope-rejected
+         - not_found                           ? /envelope-not-found
+         - expired                             ? /envelope-expired
+         - error                               ? inline error banner
+
+    Sub-views are simple placeholders here; they are filled with real UI
+    in later phases. The routing skeleton just needs to compile and
+    transition correctly.
+*@
+
+<PageTitle>@(Auth?.Title ?? Loc["SignDoc"])</PageTitle>
+
+@if (_loading)
+{
+    <div class="page container p-5 text-center">
+        <DxLoadingPanel Visible="true" IsContentBlocked="false" ApplyBackgroundShading="false" />
+    </div>
+}
+else if (Auth is null)
+{
+    <div class="page container p-5 text-center">
+        <p class="alert alert-danger">@Loc["UnexpectedErrorTitle"]</p>
+    </div>
+}
+else
+{
+    switch (Auth.Status)
+    {
+        case ReceiverAuthStatus.RequiresAccessCode:
+        case ReceiverAuthStatus.RequiresTfa:
+            <EnvelopeLockedView EnvelopeKey="@Key" />
+            break;
+
+        case ReceiverAuthStatus.ShowDocument:
+            <ShowEnvelopeView EnvelopeKey="@Key" />
+            break;
+
+        default:
+            <div class="page container p-5 text-center">
+                <p class="alert alert-warning">@(Auth.ErrorMessage ?? Loc["UnexpectedErrorTitle"])</p>
+            </div>
+            break;
+    }
+}
+
+@code {
+    [Parameter] public string Key { get; set; } = string.Empty;
+
+    private bool _loading = true;
+    private ReceiverAuthResponse? Auth => State.Current;
+
+    protected override async Task OnInitializedAsync()
+    {
+        await Loc.EnsureLoadedAsync();
+        State.Changed += OnStateChanged;
+    }
+
+    protected override async Task OnParametersSetAsync()
+    {
+        // Re-fetch status if the route key changed or no response loaded yet.
+        if (State.EnvelopeKey != Key || State.Current is null)
+        {
+            _loading = true;
+            var res = await Api.GetStatusAsync(Key);
+            State.Set(Key, res);
+            RedirectIfTerminal(res);
+            _loading = false;
+        }
+        else
+        {
+            _loading = false;
+        }
+    }
+
+    private void RedirectIfTerminal(ReceiverAuthResponse? res)
+    {
+        if (res is null) return;
+        var target = res.Status switch
+        {
+            ReceiverAuthStatus.AlreadySigned => "/envelope-signed",
+            ReceiverAuthStatus.Rejected      => "/envelope-rejected",
+            ReceiverAuthStatus.NotFound      => "/envelope-not-found",
+            ReceiverAuthStatus.Expired       => "/envelope-expired",
+            _ => null
+        };
+        if (target is not null)
+            Nav.NavigateTo(target, replace: true);
+    }
+
+    private void OnStateChanged() => InvokeAsync(StateHasChanged);
+
+    public void Dispose() => State.Changed -= OnStateChanged;
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/Pages/Receiver/EnvelopeRejected.razor

@@ -0,0 +1,39 @@
+@page "/envelope-rejected"
+@layout EnvelopeGenerator.ReceiverUI.Web.Client.Layout.ReceiverLayout
+@rendermode InteractiveAuto
+@inject ReceiverAuthState State
+@inject LocalizationService Loc
+
+@*
+    Counterpart of Views/Envelope/EnvelopeRejected.cshtml.
+    Reads envelope title / sender info from the cached auth response,
+    which is populated by EnvelopePage before navigation occurs.
+*@
+
+<PageTitle>@Loc["DocRejected"]</PageTitle>
+
+<div class="page container p-5">
+    <header class="text-center">
+        <div class="icon rejected"></div>
+        <h1>@Loc["RejectionInfo1"]</h1>
+    </header>
+    <section class="text-center">
+        <small class="text-body-secondary">
+            @(Loc["RejectionInfo2"])
+        </small>
+        @if (State.Current is not null)
+        {
+            <p class="mt-3">
+                <strong>@State.Current.Title</strong>
+                @if (!string.IsNullOrEmpty(State.Current.SenderEmail))
+                {
+                    <span> — <a href="mailto:@State.Current.SenderEmail">@State.Current.SenderEmail</a></span>
+                }
+            </p>
+        }
+    </section>
+</div>
+
+@code {
+    protected override async Task OnInitializedAsync() => await Loc.EnsureLoadedAsync();
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/Pages/Receiver/EnvelopeSigned.razor

@@ -0,0 +1,31 @@
+@page "/envelope-signed"
+@layout EnvelopeGenerator.ReceiverUI.Web.Client.Layout.ReceiverLayout
+@rendermode InteractiveAuto
+@inject LocalizationService Loc
+
+@*
+    Counterpart of Views/Envelope/EnvelopeSigned.cshtml.
+    Full styling (icon + section card) is migrated in Phase 6.
+*@
+
+<PageTitle>@Loc["DocumentSuccessfullySigned"]</PageTitle>
+
+<div class="page container p-5">
+    <header class="text-center">
+        <div class="icon signed">
+            <svg xmlns="http://www.w3.org/2000/svg" width="72" height="72" fill="currentColor"
+                 class="bi bi-check2-circle" viewBox="0 0 16 16">
+                <path d="M2.5 8a5.5 5.5 0 0 1 8.25-4.764.5.5 0 0 0 .5-.866A6.5 6.5 0 1 0 14.5 8a.5.5 0 0 0-1 0 5.5 5.5 0 1 1-11 0z" />
+                <path d="M15.354 3.354a.5.5 0 0 0-.708-.708L8 9.293 5.354 6.646a.5.5 0 1 0-.708.708l3 3a.5.5 0 0 0 .708 0l7-7z" />
+            </svg>
+        </div>
+        <h1>@Loc["DocumentSuccessfullySigned"]</h1>
+    </header>
+    <section class="text-center">
+        <p>@Loc["DocumentSignedConfirmationMessage"]</p>
+    </section>
+</div>
+
+@code {
+    protected override async Task OnInitializedAsync() => await Loc.EnsureLoadedAsync();
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/Pages/Receiver/Error404.razor

@@ -0,0 +1,88 @@
+@page "/error404"
+@layout EnvelopeGenerator.ReceiverUI.Web.Client.Layout.ReceiverLayout
+@rendermode InteractiveAuto
+@inject LocalizationService Loc
+@inject NavigationManager Nav
+@inject IJSRuntime JS
+
+@*
+    Counterpart of HomeController.Error404 ? Views/Shared/_Error.cshtml.
+
+    The legacy view fully replaces the document with a black-space themed
+    layout. In Blazor we keep the receiver layout intact (so the user can
+    still reach the language switcher) and only scope error-space.css to
+    this page via <HeadContent>. JS animation (visor + cord) is initialized
+    once after the canvas elements are in the DOM.
+*@
+
+<HeadContent>
+    <link rel="stylesheet" href="/css/error-space.css" />
+</HeadContent>
+
+<PageTitle>404</PageTitle>
+
+<div class="error-space-stage" style="position:relative; height:80vh; overflow:hidden">
+    <div class="moon"></div>
+    <div class="moon__crater moon__crater1"></div>
+    <div class="moon__crater moon__crater2"></div>
+    <div class="moon__crater moon__crater3"></div>
+
+    <div class="star star1"></div>
+    <div class="star star2"></div>
+    <div class="star star3"></div>
+    <div class="star star4"></div>
+    <div class="star star5"></div>
+
+    <div class="error">
+        <div class="error__title">404</div>
+        <div class="error__subtitle">@Loc["PageNotFound"]</div>
+        <div class="error__description">@Loc["PageNotFoundDescription"]</div>
+        <a href="/" class="error__button error__button--active">@Loc["Home"]</a>
+    </div>
+
+    <div class="astronaut">
+        <div class="astronaut__backpack"></div>
+        <div class="astronaut__body"></div>
+        <div class="astronaut__body__chest"></div>
+        <div class="astronaut__arm-left1"></div>
+        <div class="astronaut__arm-left2"></div>
+        <div class="astronaut__arm-right1"></div>
+        <div class="astronaut__arm-right2"></div>
+        <div class="astronaut__arm-thumb-left"></div>
+        <div class="astronaut__arm-thumb-right"></div>
+        <div class="astronaut__leg-left"></div>
+        <div class="astronaut__leg-right"></div>
+        <div class="astronaut__foot-left"></div>
+        <div class="astronaut__foot-right"></div>
+        <div class="astronaut__wrist-left"></div>
+        <div class="astronaut__wrist-right"></div>
+
+        <div class="astronaut__cord">
+            <canvas id="cord" height="500" width="500"></canvas>
+        </div>
+
+        <div class="astronaut__head">
+            <canvas id="visor" width="60" height="60"></canvas>
+            <div class="astronaut__head-visor-flare1"></div>
+            <div class="astronaut__head-visor-flare2"></div>
+        </div>
+    </div>
+</div>
+
+@code {
+    protected override async Task OnInitializedAsync() => await Loc.EnsureLoadedAsync();
+
+    protected override async Task OnAfterRenderAsync(bool firstRender)
+    {
+        if (!firstRender) return;
+        try
+        {
+            const string js = "if (!window.__errSpaceLoaded) { window.__errSpaceLoaded = true; var s = document.createElement('script'); s.src = '/js/error-space.js'; document.body.appendChild(s); }";
+            await JS.InvokeVoidAsync("eval", js);
+        }
+        catch
+        {
+            // Animation is purely decorative — failing to load it is fine.
+        }
+    }
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/Pages/Receiver/Home.razor

@@ -0,0 +1,42 @@
+@page "/"
+@layout EnvelopeGenerator.ReceiverUI.Web.Client.Layout.ReceiverLayout
+@rendermode InteractiveAuto
+@inject LocalizationService Loc
+
+<PageTitle>@Loc["Home"]</PageTitle>
+
+@*
+    Counterpart of EnvelopeGenerator.Web/Views/Home/Main.cshtml.
+
+    The legacy view animates the description with typed.js. The Blazor
+    version omits the typewriter effect because it adds another JS
+    dependency for marginal value; the static description is shown
+    instead. Custom company / app logos are loaded from /img/ if
+    available, otherwise gracefully hidden via onerror.
+*@
+
+<div class="page container py-4 px-4">
+    <header class="text-center">
+        <div class="header-1 alert alert-secondary" role="alert">
+            <h3 class="text">@Loc["WelcomeToTheESignPortal"]</h3>
+            <img class="dd-locked-logo" src="/img/company.svg"
+                 onerror="this.style.display='none'" alt="" />
+        </div>
+        <div class="icon mt-4 mb-1">
+            <img class="signFlow-logo" src="/img/sign_flow_horizontal.svg"
+                 onerror="this.style.display='none'" alt="signFLOW" />
+        </div>
+    </header>
+    <section class="text-center">
+        <div class="alert alert-light" role="alert">
+            <p class="home-description">@Loc["HomePageDescription"]</p>
+        </div>
+    </section>
+</div>
+
+@code {
+    protected override async Task OnInitializedAsync()
+    {
+        await Loc.EnsureLoadedAsync();
+    }
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/Pages/Receiver/ShowEnvelopeView.razor

@@ -0,0 +1,461 @@
+@implements IDisposable
+@inject ReceiverApiClient Api
+@inject ReceiverAuthState State
+@inject LocalizationService Loc
+@inject NavigationManager Nav
+@inject ILogger<ShowEnvelopeView> Logger
+
+@*
+    Counterpart of EnvelopeGenerator.Web/Views/Envelope/ShowEnvelope.cshtml.
+
+    Sign flow (Phase 5):
+      • Document is rendered by DxPdfViewer for review.
+      • A side panel lists every signature placeholder the receiver has
+        to sign (GET /api/annotation/elements). Each entry opens
+        SignaturePadDialog to capture the signature image (+ optional
+        position / city) and stores the result locally.
+      • Complete validates that every placeholder is signed, then submits
+        the BlazorSignaturePayload (POST /api/annotation/blazor) and
+        navigates to /envelope-signed.
+      • Reset clears every captured signature locally (no server call).
+      • Reject and read-only share popups behave as in Phase 4.
+
+    Why a side-panel signing UX instead of overlaying widgets on the PDF?
+      • DevExpress DxPdfViewer does not expose a public surface for
+        programmatic widget annotations the way PSPDFKit did.
+      • A side panel is fully keyboard / screen-reader accessible, works
+        identically on mobile, and avoids fragile coordinate math against
+        DevExpress' internal DOM. The visual position on the PDF is still
+        communicated via the "Page P" badge per entry.
+*@
+
+<div class="envelope-view">
+
+    @* — Top toolbar / action buttons (desktop) — *@
+    @if (!IsReadOnly)
+    {
+        <div id="flex-action-panel" class="btn-group btn_group position-fixed bottom-0 end-0 d-flex align-items-center"
+             role="group">
+            <DxButton CssClass="btn_complete btn btn-success btn-desktop"
+                      Text="@Loc["Complete"]"
+                      Click="OnCompleteClick"
+                      Enabled="@(!_busy)" />
+            <DxButton CssClass="btn_reject btn btn-danger btn-desktop"
+                      Text="@Loc["Reject"]"
+                      Click="OnRejectClick"
+                      Enabled="@(!_busy)" />
+            <DxButton CssClass="btn_refresh btn btn-secondary btn-desktop"
+                      IconCssClass="bi bi-arrow-counterclockwise"
+                      Text="@Loc["Reset"]"
+                      Click="OnResetClick"
+                      Enabled="@(!_busy && _captured.Count > 0)" />
+        </div>
+    }
+
+    @* — Envelope info card — *@
+    <div class="dd-cards-container">
+        <div class="dd-card">
+            <div class="dd-card-preview">
+                <img src="/img/sign_flow_horizontal.svg" class="app-logo"
+                     onerror="this.style.display='none'" alt="signFLOW" />
+                @if (!IsReadOnly)
+                {
+                    <div class="progress-container">
+                        <div id="signed-count-bar" class="progress"></div>
+                        <span class="progress-text">
+                            <span id="signed-count">@SignedCount</span>/<span id="signature-count">@_elements.Count</span>
+                            @Loc["Signatures"]
+                        </span>
+                    </div>
+                }
+            </div>
+            <div class="dd-card-info">
+                <h2>@(State.Current?.Title)</h2>
+                @if (!string.IsNullOrEmpty(State.Current?.Message))
+                {
+                    <div class="markdown">@State.Current.Message</div>
+                }
+                @if (!string.IsNullOrEmpty(State.Current?.SenderEmail))
+                {
+                    <p>
+                        <small class="text-body-secondary">
+                            <a class="mail-link" href="mailto:@State.Current.SenderEmail">
+                                @State.Current.SenderEmail
+                            </a>
+                        </small>
+                    </p>
+                }
+            </div>
+        </div>
+    </div>
+
+    <div class="row g-3 m-0 envelope-content">
+
+        @* — PDF viewer — *@
+        <div class="col-12 col-lg-8 p-0">
+            <div id="pdfviewer-host" style="min-height:60vh; height:70vh;">
+                @if (_loadingDoc)
+                {
+                    <div class="d-flex align-items-center justify-content-center h-100">
+                        <DxLoadingPanel Visible="true" IsContentBlocked="false" ApplyBackgroundShading="false" />
+                    </div>
+                }
+                else if (_documentBytes is { Length: > 0 })
+                {
+                    <DxPdfViewer DocumentContent="_documentBytes"
+                                 CssClass="h-100 w-100"
+                                 ZoomLevel="1" />
+                }
+                else
+                {
+                    <div class="alert alert-warning m-3" role="alert">
+                        @Loc["DocumentNotFound"]
+                    </div>
+                }
+            </div>
+        </div>
+
+        @* — Side panel: signature placeholders to sign — *@
+        @if (!IsReadOnly)
+        {
+            <aside class="col-12 col-lg-4 p-3">
+                <h5>@Loc["SignaturePlaceholders"]</h5>
+                @if (_loadingElements)
+                {
+                    <DxLoadingPanel Visible="true" IsContentBlocked="false" ApplyBackgroundShading="false" />
+                }
+                else if (_elements.Count == 0)
+                {
+                    <p class="text-body-secondary">@Loc["NoSignatureRequired"]</p>
+                }
+                else
+                {
+                    <ol class="signature-list list-unstyled">
+                        @foreach (var (el, idx) in _elements.Select((e, i) => (e, i + 1)))
+                        {
+                            var signed = _captured.ContainsKey(el.Id);
+                            <li class="signature-item d-flex align-items-center justify-content-between gap-2 p-2 border rounded mb-2 @(signed ? "bg-success-subtle" : "")">
+                                <div>
+                                    <strong>#@idx</strong>
+                                    <span class="badge bg-secondary ms-1">@Loc["Page"] @el.Page</span>
+                                    @if (!string.IsNullOrEmpty(el.Tooltip))
+                                    {
+                                        <div class="small text-body-secondary">@el.Tooltip</div>
+                                    }
+                                    @if (signed)
+                                    {
+                                        <div class="small text-success">
+                                            <i class="bi bi-check2-circle"></i> @Loc["Signed"]
+                                        </div>
+                                    }
+                                </div>
+                                <DxButton Text="@(signed ? Loc["Change"] : Loc["Sign"])"
+                                          RenderStyle="@(signed ? ButtonRenderStyle.Secondary : ButtonRenderStyle.Primary)"
+                                          IconCssClass="bi bi-pen"
+                                          Click="@(() => OpenPadAsync(el))" />
+                            </li>
+                        }
+                    </ol>
+                }
+            </aside>
+        }
+    </div>
+
+    @* — Signature pad dialog — *@
+    <SignaturePadDialog @ref="_padDialog" Confirmed="OnSignatureConfirmed" />
+
+    @* — Confirm-complete popup — *@
+    <DxPopup @bind-Visible="_confirmCompleteVisible"
+             HeaderText="@Loc["ConfirmSigning"]"
+             ShowCloseButton="true"
+             Width="32rem">
+        <BodyContentTemplate Context="confirmCtx">
+            <p>@Loc["ConfirmSigningQ"]</p>
+        </BodyContentTemplate>
+        <FooterContentTemplate Context="confirmFootCtx">
+            <DxButton Text="@Loc["Confirm"]"
+                      RenderStyle="ButtonRenderStyle.Primary"
+                      Click="OnCompleteSubmit" Enabled="@(!_busy)" />
+            <DxButton Text="@Loc["Cancel"]"
+                      RenderStyle="ButtonRenderStyle.Secondary"
+                      Click="@(() => _confirmCompleteVisible = false)" />
+        </FooterContentTemplate>
+    </DxPopup>
+
+    @* — Read-only share popup — *@
+    @if (!IsReadOnly)
+    {
+        <DxPopup @bind-Visible="_shareVisible"
+                 HeaderText="@Loc["EnterRecipientToShareDocument"]"
+                 ShowCloseButton="true"
+                 Width="32rem">
+            <BodyContentTemplate Context="shareCtx">
+                <DxFormLayout>
+                    <DxFormLayoutItem Caption="@Loc["Email"]">
+                        <DxTextBox @bind-Text="_shareEmail" NullText="user@mail.com" />
+                    </DxFormLayoutItem>
+                    <DxFormLayoutItem Caption="@Loc["ValidUntil"]">
+                        <DxDateEdit @bind-Date="_shareValidUntil"
+                                    MinDate="DateTime.Today.AddDays(1)"
+                                    MaxDate="DateTime.Today.AddDays(90)" />
+                    </DxFormLayoutItem>
+                </DxFormLayout>
+                @if (!string.IsNullOrEmpty(_shareError))
+                {
+                    <div class="alert alert-danger mt-2">@_shareError</div>
+                }
+            </BodyContentTemplate>
+            <FooterContentTemplate Context="shareFootCtx">
+                <DxButton Text="@Loc["Send"]" RenderStyle="ButtonRenderStyle.Primary"
+                          IconCssClass="bi bi-send" Click="OnShareSubmit"
+                          Enabled="@(!_busy)" />
+            </FooterContentTemplate>
+        </DxPopup>
+
+        @* — Reject popup — *@
+        <DxPopup @bind-Visible="_rejectVisible"
+                 HeaderText="@Loc["Rejection"]"
+                 ShowCloseButton="true"
+                 Width="32rem">
+            <BodyContentTemplate Context="rejectCtx">
+                <p>@Loc["RejectionReasonQ"]</p>
+                <DxMemo @bind-Text="_rejectReason" Rows="4" />
+            </BodyContentTemplate>
+            <FooterContentTemplate Context="rejectFootCtx">
+                <DxButton Text="@Loc["Complete"]"
+                          RenderStyle="ButtonRenderStyle.Primary"
+                          Click="OnRejectSubmit" Enabled="@(!_busy)" />
+                <DxButton Text="@Loc["Back"]"
+                          RenderStyle="ButtonRenderStyle.Secondary"
+                          Click="@(() => _rejectVisible = false)" />
+            </FooterContentTemplate>
+        </DxPopup>
+    }
+
+    @if (!string.IsNullOrEmpty(_globalError))
+    {
+        <div class="alert alert-danger m-3" role="alert">@_globalError</div>
+    }
+</div>
+
+@code {
+    [Parameter] public string EnvelopeKey { get; set; } = string.Empty;
+
+    private byte[]? _documentBytes;
+    private bool _loadingDoc = true;
+    private bool _loadingElements = true;
+    private bool _busy;
+
+    private List<SignatureElementDto> _elements = new();
+    private readonly Dictionary<int, BlazorSignatureEntry> _captured = new();
+
+    private SignaturePadDialog? _padDialog;
+    private bool _confirmCompleteVisible;
+    private string? _globalError;
+
+    private bool _shareVisible;
+    private string _shareEmail = string.Empty;
+    private DateTime _shareValidUntil = DateTime.Today.AddDays(7);
+    private string? _shareError;
+
+    private bool _rejectVisible;
+    private string _rejectReason = string.Empty;
+
+    private bool IsReadOnly => State.Current?.ReadOnly ?? false;
+    private int SignedCount => _captured.Count;
+
+    protected override async Task OnInitializedAsync()
+    {
+        await Loc.EnsureLoadedAsync();
+        State.Changed += OnStateChanged;
+    }
+
+    protected override async Task OnParametersSetAsync()
+    {
+        if (_documentBytes is null && !string.IsNullOrEmpty(EnvelopeKey))
+        {
+            await LoadDocumentAsync();
+            if (!IsReadOnly)
+                await LoadElementsAsync();
+        }
+    }
+
+    private async Task LoadDocumentAsync()
+    {
+        _loadingDoc = true;
+        try
+        {
+            _documentBytes = await Api.GetDocumentAsync(EnvelopeKey);
+        }
+        catch (Exception ex)
+        {
+            Logger.LogError(ex, "Failed to load document for key {Key}", EnvelopeKey);
+        }
+        finally
+        {
+            _loadingDoc = false;
+        }
+    }
+
+    private async Task LoadElementsAsync()
+    {
+        _loadingElements = true;
+        try
+        {
+            _elements = await Api.GetSignatureElementsAsync();
+        }
+        catch (Exception ex)
+        {
+            Logger.LogError(ex, "Failed to load signature elements.");
+            _elements = new();
+        }
+        finally
+        {
+            _loadingElements = false;
+        }
+    }
+
+    private void OnStateChanged() => InvokeAsync(StateHasChanged);
+
+    // — Signature pad ?????????????????????????????????????????????????
+
+    private async Task OpenPadAsync(SignatureElementDto el)
+    {
+        if (_padDialog is null) return;
+        _captured.TryGetValue(el.Id, out var existing);
+        await _padDialog.ShowAsync(el.Id, existing?.Position, existing?.City);
+    }
+
+    private void OnSignatureConfirmed(BlazorSignatureEntry entry)
+    {
+        _captured[entry.ElementId] = entry;
+        StateHasChanged();
+    }
+
+    // — Toolbar actions ????????????????????????????????????????????????
+
+    private Task OnCompleteClick()
+    {
+        _globalError = null;
+        var missing = _elements.Where(e => !_captured.ContainsKey(e.Id)).ToList();
+        if (missing.Count > 0)
+        {
+            _globalError = Loc.Format("MissingSignaturesFmt", missing.Count);
+            return Task.CompletedTask;
+        }
+        _confirmCompleteVisible = true;
+        return Task.CompletedTask;
+    }
+
+    private async Task OnCompleteSubmit()
+    {
+        if (_busy) return;
+        _busy = true;
+        try
+        {
+            var payload = new BlazorSignaturePayload
+            {
+                Signatures = _captured.Values.ToList()
+            };
+            var status = await Api.SignBlazorAsync(payload);
+            _confirmCompleteVisible = false;
+            if ((int)status >= 200 && (int)status < 300)
+            {
+                Nav.NavigateTo("/envelope-signed", replace: true);
+            }
+            else
+            {
+                _globalError = $"{Loc["UnexpectedErrorTitle"]} ({(int)status})";
+            }
+        }
+        catch (Exception ex)
+        {
+            Logger.LogError(ex, "Sign submit failed.");
+            _globalError = Loc["UnexpectedErrorTitle"];
+        }
+        finally
+        {
+            _busy = false;
+        }
+    }
+
+    private Task OnRejectClick()
+    {
+        _rejectReason = string.Empty;
+        _rejectVisible = true;
+        return Task.CompletedTask;
+    }
+
+    private async Task OnRejectSubmit()
+    {
+        if (_busy) return;
+        _busy = true;
+        try
+        {
+            var ok = await Api.RejectAsync(_rejectReason ?? string.Empty);
+            _rejectVisible = false;
+            if (ok)
+                Nav.NavigateTo("/envelope-rejected", replace: true);
+        }
+        finally
+        {
+            _busy = false;
+        }
+    }
+
+    private void OnResetClick()
+    {
+        _captured.Clear();
+        _globalError = null;
+    }
+
+    // — Share read-only ?????????????????????????????????????????????????
+
+    private async Task OnShareSubmit()
+    {
+        _shareError = null;
+        if (string.IsNullOrWhiteSpace(_shareEmail) ||
+            !System.Text.RegularExpressions.Regex.IsMatch(_shareEmail, @"^\S+@\S+\.\S+$"))
+        {
+            _shareError = Loc["ShrEnvInvalidEmailText"];
+            return;
+        }
+        if (_shareValidUntil < DateTime.Today.AddDays(1))
+        {
+            _shareError = Loc["ShrEnvInvalidDateText"];
+            return;
+        }
+
+        _busy = true;
+        try
+        {
+            var ok = await Api.ShareReadOnlyAsync(new ReadOnlyShareRequest
+            {
+                ReceiverMail = _shareEmail,
+                DateValid = _shareValidUntil
+            });
+            if (ok)
+            {
+                _shareVisible = false;
+                _shareEmail = string.Empty;
+                _shareValidUntil = DateTime.Today.AddDays(7);
+            }
+            else
+            {
+                _shareError = Loc["ShrEnvOperationFailedText"];
+            }
+        }
+        catch
+        {
+            _shareError = Loc["UnexpectedErrorTitle"];
+        }
+        finally
+        {
+            _busy = false;
+        }
+    }
+
+    public void Dispose() => State.Changed -= OnStateChanged;
+}
+
+

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/Pages/Receiver/SignaturePadDialog.razor

@@ -0,0 +1,150 @@
+@implements IAsyncDisposable
+@inject IJSRuntime JS
+@inject LocalizationService Loc
+
+@*
+    Modal dialog that captures one signature for a single placeholder.
+
+    The user is asked to:
+      • draw their signature (mouse / touch),
+      • optionally fill in "position" (job title) and "city",
+      • confirm — which produces a BlazorSignatureEntry and closes the dialog.
+
+    The drawing surface is a plain HTML5 canvas wired up by signature-pad.js
+    (loaded once in App.razor). All JS interop is encapsulated here so the
+    rest of the receiver UI is free of DOM concerns.
+*@
+
+<DxPopup @bind-Visible="_visible"
+         HeaderText="@Loc["YourSignature"]"
+         ShowCloseButton="true"
+         CloseOnEscape="true"
+         Width="36rem"
+         Closed="OnClosed">
+    <BodyContentTemplate Context="padCtx">
+        <div class="signature-pad-container">
+            <canvas id="@_canvasId"
+                    class="signature-pad-canvas"
+                    style="width:100%; height:200px; border:1px solid #cfd6dd; border-radius:.25rem; background:#fff; touch-action:none"></canvas>
+
+            <div class="d-flex gap-2 mt-2">
+                <DxButton Text="@Loc["Clear"]"
+                          RenderStyle="ButtonRenderStyle.Secondary"
+                          IconCssClass="bi bi-eraser"
+                          Click="ClearAsync" />
+            </div>
+
+            <div class="mt-3">
+                <DxFormLayout>
+                    <DxFormLayoutItem Caption="@Loc["Position"]">
+                        <DxTextBox @bind-Text="_position" NullText="@Loc["PositionPlaceholder"]" />
+                    </DxFormLayoutItem>
+                    <DxFormLayoutItem Caption="@Loc["City"]">
+                        <DxTextBox @bind-Text="_city" NullText="@Loc["CityPlaceholder"]" />
+                    </DxFormLayoutItem>
+                </DxFormLayout>
+            </div>
+
+            @if (!string.IsNullOrEmpty(_error))
+            {
+                <div class="alert alert-danger mt-2 mb-0">@_error</div>
+            }
+        </div>
+    </BodyContentTemplate>
+    <FooterContentTemplate Context="footCtx">
+        <DxButton Text="@Loc["Confirm"]"
+                  RenderStyle="ButtonRenderStyle.Primary"
+                  IconCssClass="bi bi-check2"
+                  Click="ConfirmAsync" />
+        <DxButton Text="@Loc["Cancel"]"
+                  RenderStyle="ButtonRenderStyle.Secondary"
+                  Click="@(() => Hide())" />
+    </FooterContentTemplate>
+</DxPopup>
+
+@code {
+    /// <summary>Fired when the user confirms a valid signature.</summary>
+    [Parameter] public EventCallback<BlazorSignatureEntry> Confirmed { get; set; }
+
+    private readonly string _canvasId = $"sigpad_{Guid.NewGuid():N}";
+    private bool _visible;
+    private bool _attached;
+    private int _elementId;
+    private string _position = string.Empty;
+    private string _city = string.Empty;
+    private string? _error;
+
+    /// <summary>Opens the dialog and binds JS interop on the canvas.</summary>
+    public async Task ShowAsync(int elementId, string? defaultPosition = null, string? defaultCity = null)
+    {
+        _elementId = elementId;
+        _position  = defaultPosition ?? string.Empty;
+        _city      = defaultCity     ?? string.Empty;
+        _error     = null;
+        _visible   = true;
+        StateHasChanged();
+
+        // The canvas only exists after the popup is rendered. Wait one
+        // render cycle, then attach the pad.
+        await Task.Yield();
+        try
+        {
+            _attached = await JS.InvokeAsync<bool>("signaturePad.attach", _canvasId);
+        }
+        catch (JSException ex)
+        {
+            _error = ex.Message;
+            _attached = false;
+        }
+    }
+
+    public void Hide()
+    {
+        _visible = false;
+    }
+
+    private async Task ClearAsync()
+    {
+        if (_attached)
+            await JS.InvokeVoidAsync("signaturePad.clear", _canvasId);
+    }
+
+    private async Task ConfirmAsync()
+    {
+        if (!_attached)
+        {
+            _error = Loc["SignaturePadNotReady"];
+            return;
+        }
+
+        var dataUrl = await JS.InvokeAsync<string?>("signaturePad.toDataUrl", _canvasId);
+        if (string.IsNullOrEmpty(dataUrl))
+        {
+            _error = Loc["SignatureRequired"];
+            return;
+        }
+
+        await Confirmed.InvokeAsync(new BlazorSignatureEntry
+        {
+            ElementId        = _elementId,
+            SignatureDataUrl = dataUrl,
+            Position         = string.IsNullOrWhiteSpace(_position) ? null : _position.Trim(),
+            City             = string.IsNullOrWhiteSpace(_city)     ? null : _city.Trim(),
+            SignedAt         = DateTime.Now,
+        });
+
+        await OnClosed();
+        _visible = false;
+    }
+
+    private async Task OnClosed()
+    {
+        if (_attached)
+        {
+            try { await JS.InvokeVoidAsync("signaturePad.detach", _canvasId); } catch { /* ignore */ }
+            _attached = false;
+        }
+    }
+
+    public async ValueTask DisposeAsync() => await OnClosed();
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/Pages/Receiver/TfaRegistration.razor

@@ -0,0 +1,158 @@
+@page "/tfa/{Key}"
+@layout EnvelopeGenerator.ReceiverUI.Web.Client.Layout.ReceiverLayout
+@rendermode InteractiveAuto
+@inject ReceiverApiClient Api
+@inject LocalizationService Loc
+@inject NavigationManager Nav
+
+@*
+    Counterpart of TFARegController.Reg ? Views/TFAReg/Reg.cshtml.
+
+    The legacy view uses Bootstrap's collapse-based accordion to walk the
+    receiver through 3 steps:
+      1. Install an authenticator app
+      2. Scan the QR code
+      3. Verify the generated 6-digit code
+
+    The Blazor port keeps the exact same step structure but uses
+    DxAccordion so the visual / keyboard behavior matches the rest of
+    the receiver UI. The TOTP QR and registration deadline are fetched
+    from <c>GET /api/tfa/{key}</c> on first render.
+*@
+
+<PageTitle>@Loc["TfaRegistration"]</PageTitle>
+
+<div class="page container p-5">
+    <header class="text-center">
+        <div class="icon locked mt-4 mb-1">
+            <svg xmlns="http://www.w3.org/2000/svg" width="72" height="72" fill="currentColor"
+                 class="bi bi-shield-lock" viewBox="0 0 16 16">
+                <path d="M5.338 1.59a61 61 0 0 0-2.837.856.48.48 0 0 0-.328.39c-.554 4.157.726 7.19 2.253 9.188a10.7 10.7 0 0 0 2.287 2.233c.346.244.652.42.893.533q.18.085.293.118a1 1 0 0 0 .101.025 1 1 0 0 0 .1-.025q.114-.034.294-.118c.24-.113.547-.29.893-.533a10.7 10.7 0 0 0 2.287-2.233c1.527-1.997 2.807-5.031 2.253-9.188a.48.48 0 0 0-.328-.39c-.651-.213-1.75-.56-2.837-.855C9.552 1.29 8.531 1.067 8 1.067c-.53 0-1.552.223-2.662.524zM5.072.56C6.157.265 7.31 0 8 0s1.843.265 2.928.56c1.11.3 2.229.655 2.887.87a1.54 1.54 0 0 1 1.044 1.262c.596 4.477-.787 7.795-2.465 9.99a11.8 11.8 0 0 1-2.517 2.453 7 7 0 0 1-1.048.625c-.28.132-.581.24-.829.24s-.548-.108-.829-.24a7 7 0 0 1-1.048-.625 11.8 11.8 0 0 1-2.517-2.453C1.928 10.487.545 7.169 1.141 2.692A1.54 1.54 0 0 1 2.185 1.43 63 63 0 0 1 5.072.56" />
+                <path d="M9.5 6.5a1.5 1.5 0 0 1-1 1.415l.385 1.99a.5.5 0 0 1-.491.595h-.788a.5.5 0 0 1-.49-.595l.384-1.99a1.5 1.5 0 1 1 2-1.415" />
+            </svg>
+        </div>
+        <h2 class="mb-0">2-Factor Authentication (2FA)</h2>
+        <h2>@Loc["Registration"]</h2>
+    </header>
+
+    @if (_loading)
+    {
+        <div class="text-center mt-4">
+            <DxLoadingPanel Visible="true" IsContentBlocked="false" ApplyBackgroundShading="false" />
+        </div>
+    }
+    else if (_error is not null)
+    {
+        <div class="alert alert-danger mt-4" role="alert">@_error</div>
+        <div class="text-center mt-3">
+            <DxButton Text="@Loc["Back"]"
+                      RenderStyle="ButtonRenderStyle.Secondary"
+                      Click="@(() => Nav.NavigateTo($"/envelope/{Key}"))" />
+        </div>
+    }
+    else if (_data is not null)
+    {
+        <section class="text-center">
+            <p class="p-0 m-0">
+                @if (_data.TfaRegDeadline is DateTime dl)
+                {
+                    @Loc.Format("PageVisibleUntil", dl.ToString("d. MMM, HH:mm", new System.Globalization.CultureInfo("de-DE")))
+                }
+            </p>
+        </section>
+
+        <section class="text-start mt-4">
+            <DxAccordion>
+                <Items>
+                    <DxAccordionItem Text="@Loc["Step1Download2faApplication"]" Expanded="true">
+                        <ContentTemplate>
+                            <p class="text-wrap fw-medium">@Loc["Download2faAppInstruction"]</p>
+                            <p class="text-wrap fw-light">@Loc["Recommended2faApplications"]</p>
+                            <ul class="list-group text-start">
+                                <li class="list-group-item">
+                                    <a href="https://support.google.com/accounts/answer/1066447?hl=de&co=GENIE.Platform%3DAndroid"
+                                       target="_blank" rel="noopener" style="text-decoration:none">
+                                        <samp>Google Authenticator</samp>
+                                    </a>
+                                </li>
+                                <li class="list-group-item">
+                                    <a href="https://support.microsoft.com/de-de/account-billing/microsoft-authenticator-herunterladen-351498fc-850a-45da-b7b6-27e523b8702a"
+                                       target="_blank" rel="noopener" style="text-decoration:none">
+                                        <samp>Microsoft Authenticator</samp>
+                                    </a>
+                                </li>
+                            </ul>
+                        </ContentTemplate>
+                    </DxAccordionItem>
+
+                    <DxAccordionItem Text="@Loc["Step2ScanQrCode"]">
+                        <ContentTemplate>
+                            <div class="text-center m-0 p-0">
+                                @if (!string.IsNullOrEmpty(_data.TotpQR64))
+                                {
+                                    <img class="tfaQrCode"
+                                         src="@($"data:image/png;base64,{_data.TotpQR64}")"
+                                         alt="TOTP QR" />
+                                }
+                            </div>
+                            <p class="text-wrap fw-medium">@Loc["ScanQrCodeInstruction"]</p>
+                        </ContentTemplate>
+                    </DxAccordionItem>
+
+                    <DxAccordionItem Text="@Loc["Step3VerifyTheCode"]">
+                        <ContentTemplate>
+                            <p class="text-wrap fw-medium">
+                                @Loc["VerifyCodeInstructionMain"]
+                                <samp>@Loc["VerifyCodeInstructionSubmit"]</samp>.
+                            </p>
+                            <div class="text-center mt-3">
+                                <DxButton Text="@Loc["BackToEnvelope"]"
+                                          RenderStyle="ButtonRenderStyle.Primary"
+                                          Click="@(() => Nav.NavigateTo($"/envelope/{Key}"))" />
+                            </div>
+                        </ContentTemplate>
+                    </DxAccordionItem>
+                </Items>
+            </DxAccordion>
+        </section>
+    }
+</div>
+
+@code {
+    [Parameter] public string Key { get; set; } = string.Empty;
+
+    private TfaRegistrationResponse? _data;
+    private string? _error;
+    private bool _loading = true;
+
+    protected override async Task OnInitializedAsync()
+    {
+        await Loc.EnsureLoadedAsync();
+
+        _loading = true;
+        try
+        {
+            var (data, status) = await Api.GetTfaRegistrationAsync(Key);
+            if ((int)status >= 200 && (int)status < 300 && data is not null)
+            {
+                _data = data;
+            }
+            else if ((int)status == 410)
+            {
+                _error = Loc["TfaRegDeadlineExpired"];
+            }
+            else if ((int)status == 401)
+            {
+                _error = Loc["UnauthorizedTfaReg"];
+            }
+            else
+            {
+                _error = Loc["UnexpectedErrorTitle"];
+            }
+        }
+        finally
+        {
+            _loading = false;
+        }
+    }
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/Pages/Weather.razor

@@ -0,0 +1,32 @@
+@page "/weather"
+
+<PageTitle>Weather</PageTitle>
+
+<h1>Weather</h1>
+
+<DxGrid Data="@forecasts">
+    <Columns>
+        <DxGridDataColumn Caption="Date" FieldName="Date" />
+        <DxGridDataColumn Caption="Temperature (C)" FieldName="TemperatureC" />
+        <DxGridDataColumn Caption="Temperature (F)" FieldName="TemperatureF" />
+        <DxGridDataColumn Caption="Summary" FieldName="Summary" />
+    </Columns>
+</DxGrid>
+
+@code {
+    private WeatherForecast[]? forecasts;
+
+    protected override async Task OnInitializedAsync() {
+        DateOnly startDate = DateOnly.FromDateTime(DateTime.Now);
+        string[] summaries = ["Freezing", "Bracing", "Chilly", "Cool", "Mild", "Warm", "Balmy", "Hot", "Sweltering", "Scorching"];
+        forecasts = Enumerable.Range(1, 5).Select(index => new WeatherForecast(
+                Date: startDate.AddDays(index),
+                TemperatureC: Random.Shared.Next(-20, 55),
+                Summary: summaries[Random.Shared.Next(summaries.Length)]
+            )).ToArray();
+    }
+
+    private record WeatherForecast(DateOnly Date, int TemperatureC, string? Summary) {
+        public int TemperatureF => 32 + (int)(TemperatureC / 0.5556);
+    }
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/Program.cs

@@ -0,0 +1,31 @@
+using EnvelopeGenerator.ReceiverUI.Web.Client.Api;
+using EnvelopeGenerator.ReceiverUI.Web.Client.Services;
+using EnvelopeGenerator.ReceiverUI.Web.Client.Utils;
+using Microsoft.AspNetCore.Components.WebAssembly.Hosting;
+
+var builder = WebAssemblyHostBuilder.CreateDefault(args);
+
+builder.Services.AddDevExpressBlazor(options =>
+{
+    options.SizeMode = DevExpress.Blazor.SizeMode.Medium;
+});
+
+builder.Services.AddChatClient(builder.HostEnvironment.BaseAddress + "api/chat", "proxykey", "proxychat");
+
+builder.Services.AddDevExpressWebAssemblyBlazorPdfViewer();
+
+DevExpress.XtraPrinting.PrintingOptions.Pdf.RenderingEngine = DevExpress.XtraPrinting.XRPdfRenderingEngine.Skia;
+
+// ── Receiver API + Auth + Localization ─────────────────────────────
+// Same-origin HttpClient: the BFF (EnvelopeGenerator.ReceiverUI.Web)
+// reverse-proxies /api/** to EnvelopeGenerator.API and forwards the
+// HttpOnly authentication cookie automatically.
+builder.Services.AddHttpClient<ReceiverApiClient>(client =>
+{
+    client.BaseAddress = new Uri(builder.HostEnvironment.BaseAddress);
+});
+builder.Services.AddScoped<LocalizationService>();
+builder.Services.AddScoped<ReceiverAuthState>();
+
+await builder.Build().RunAsync();
+

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/Routes.razor

@@ -0,0 +1,14 @@
+<Router AppAssembly="typeof(Program).Assembly">
+    <Found Context="routeData">
+        <RouteView RouteData="routeData" DefaultLayout="typeof(Layout.MainLayout)" />
+    </Found>
+    <NotFound>
+        @*
+            Mirrors HomeController.Error404 from EnvelopeGenerator.Web,
+            which maps fallback requests to the Error404 view.
+        *@
+        <LayoutView Layout="@typeof(Layout.ReceiverLayout)">
+            <Pages.Receiver.Error404 />
+        </LayoutView>
+    </NotFound>
+</Router>

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/Services/LocalizationService.cs

@@ -0,0 +1,119 @@
+using EnvelopeGenerator.ReceiverUI.Web.Client.Api;
+
+namespace EnvelopeGenerator.ReceiverUI.Web.Client.Services;
+
+/// <summary>
+/// Pulls all localized strings from the API once and exposes them
+/// via an indexer mimicking <c>IStringLocalizer&lt;Resource&gt;["Key"]</c>
+/// in the legacy MVC Web project.
+///
+/// Missing keys fall back to the key itself (matching the previous behavior
+/// where <c>_localizer["X"].Value</c> returned "X" if not found).
+///
+/// Components consume this service as a scoped dependency and may call
+/// <see cref="EnsureLoadedAsync"/> in <c>OnInitializedAsync</c>.
+/// </summary>
+public class LocalizationService
+{
+    private readonly ReceiverApiClient _api;
+    private readonly ILogger<LocalizationService> _logger;
+    private Dictionary<string, string> _strings = new();
+    private Task? _loadTask;
+    private readonly object _gate = new();
+
+    public LocalizationService(ReceiverApiClient api, ILogger<LocalizationService> logger)
+    {
+        _api = api;
+        _logger = logger;
+    }
+
+    /// <summary>
+    /// Languages exposed in the footer's language switcher. Kept as a
+    /// small in-memory list so the receiver UI does not need an extra
+    /// API roundtrip just to populate a dropdown. Mirrors the cultures
+    /// configured server-side (de-DE, en-US, tr-TR).
+    /// </summary>
+    public static readonly IReadOnlyList<(string Code, string Native, string Flag)> SupportedLanguages =
+        new[]
+        {
+            ("de", "Deutsch",  "fi-de"),
+            ("en", "English",  "fi-gb"),
+            ("tr", "Türkçe",   "fi-tr"),
+        };
+
+    /// <summary>Currently active language code (best effort, set after a switch).</summary>
+    public string? CurrentLanguage { get; private set; }
+
+    /// <summary>Fires whenever the language changes and strings are reloaded.</summary>
+    public event Action? Changed;
+
+    /// <summary>
+    /// Get a localized string by key. Returns the key itself if not found
+    /// (compatible with the legacy <c>_localizer["..."].Value</c> behavior).
+    /// </summary>
+    public string this[string key]
+    {
+        get => _strings.TryGetValue(key, out var v) ? v : key;
+    }
+
+    /// <summary>
+    /// Format a localized template with positional arguments (e.g. "{0}", "{1}").
+    /// </summary>
+    public string Format(string key, params object?[] args)
+    {
+        var template = this[key];
+        try
+        {
+            return string.Format(template, args);
+        }
+        catch (FormatException)
+        {
+            return template;
+        }
+    }
+
+    public IReadOnlyDictionary<string, string> All => _strings;
+
+    /// <summary>
+    /// Loads localization strings from the API. Safe to call multiple times;
+    /// concurrent callers share the same in-flight request.
+    /// </summary>
+    public Task EnsureLoadedAsync(CancellationToken ct = default)
+    {
+        lock (_gate)
+        {
+            return _loadTask ??= LoadCoreAsync(ct);
+        }
+    }
+
+    /// <summary>Forces a reload (e.g. after a language change).</summary>
+    public Task ReloadAsync(CancellationToken ct = default)
+    {
+        lock (_gate)
+        {
+            _loadTask = LoadCoreAsync(ct);
+            return _loadTask;
+        }
+    }
+
+    private async Task LoadCoreAsync(CancellationToken ct)
+    {
+        // Refresh the current language alongside the strings so the
+        // footer dropdown reflects the cookie value picked up by the API.
+        var langTask = _api.GetLanguageAsync(ct);
+        var dict = await _api.GetLocalizationStringsAsync(ct);
+        if (dict is not null)
+            _strings = new Dictionary<string, string>(dict, StringComparer.OrdinalIgnoreCase);
+        else
+            _logger.LogWarning("Localization strings could not be loaded; falling back to keys.");
+        CurrentLanguage = await langTask ?? CurrentLanguage;
+        Changed?.Invoke();
+    }
+
+    public async Task ChangeLanguageAsync(string language, CancellationToken ct = default)
+    {
+        await _api.SetLanguageAsync(language, ct);
+        CurrentLanguage = language;
+        await ReloadAsync(ct);
+    }
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/Services/ReceiverAuthState.cs

@@ -0,0 +1,34 @@
+using EnvelopeGenerator.ReceiverUI.Web.Client.Api.Models;
+
+namespace EnvelopeGenerator.ReceiverUI.Web.Client.Services;
+
+/// <summary>
+/// Holds the current receiver authentication context for the active envelope.
+/// Scoped per circuit (Interactive Server) or per browser tab (Interactive WASM).
+///
+/// Pages observe <see cref="Changed"/> to re-render when the underlying
+/// auth response transitions (e.g. requires_access_code -> requires_tfa
+/// -> show_document).
+/// </summary>
+public class ReceiverAuthState
+{
+    private ReceiverAuthResponse? _current;
+    public string? EnvelopeKey { get; private set; }
+    public ReceiverAuthResponse? Current => _current;
+
+    public event Action? Changed;
+
+    public void Set(string envelopeKey, ReceiverAuthResponse? response)
+    {
+        EnvelopeKey = envelopeKey;
+        _current = response;
+        Changed?.Invoke();
+    }
+
+    public void Clear()
+    {
+        EnvelopeKey = null;
+        _current = null;
+        Changed?.Invoke();
+    }
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/Services/ServiceExtensions.cs

@@ -0,0 +1,25 @@
+using Azure;
+using Azure.AI.OpenAI;
+using Microsoft.Extensions.AI;
+
+namespace EnvelopeGenerator.ReceiverUI.Web.Client.Utils
+{
+    public static class ServiceExtensions
+    {
+        // Demo AI services are rate limited and intended for demonstration purposes only.
+        // DevExpress does not offer a REST API and does not ship any built-in LLMs/SLMs.
+        // Use of demo credentials in production is strictly prohibited.
+        // Specify the Azure OpenAI endpoint, key, and deployment name in the 'appsettings.json' file.
+        public static void AddChatClient(this IServiceCollection services, string aiEndpoint, string aiKey, string deployment)
+        {
+            services.AddDevExpressAI();
+            services.AddScoped<IChatClient>(_ =>
+            {
+                var azureClient = new AzureOpenAIClient(new Uri(aiEndpoint), new AzureKeyCredential(aiKey));
+                return azureClient
+                    .GetChatClient(deployment)
+                    .AsIChatClient();
+            });
+        }
+    }
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/Shared/DrawerStateComponentBase.cs

@@ -0,0 +1,77 @@
+using Microsoft.AspNetCore.Components;
+
+namespace EnvelopeGenerator.ReceiverUI.Web.Client.Shared
+{
+    public abstract class DrawerStateComponentBase : ComponentBase
+    {
+        [SupplyParameterFromQuery(Name = DrawerStateUrlBuilder.DrawerStateQueryParameterName)]
+        public bool ToggledDrawer { get; set; }
+
+        [Inject] NavigationManager NavigationManager { get; set; } = null!;
+
+        protected string AddDrawerStateToUrl(string baseUrl)
+        {
+            return DrawerStateUrlBuilder.AddStateToUrl(baseUrl, ToggledDrawer, NavigationManager);
+        }
+
+        protected string AddDrawerStateToUrlToggled(string baseUrl)
+        {
+            return DrawerStateUrlBuilder.AddStateToUrl(baseUrl, !ToggledDrawer, NavigationManager);
+        }
+
+        protected string RemoveDrawerStateFromUrl(string baseUrl)
+        {
+            return DrawerStateUrlBuilder.RemoveStateFromUrl(baseUrl, NavigationManager);
+        }
+    }
+
+    public abstract class DrawerStateLayoutComponentBase : LayoutComponentBase
+    {
+        [SupplyParameterFromQuery(Name = DrawerStateUrlBuilder.DrawerStateQueryParameterName)]
+        public bool ToggledDrawer { get; set; }
+
+        [Inject] NavigationManager NavigationManager { get; set; } = null!;
+
+        protected string AddDrawerStateToUrl(string baseUrl)
+        {
+            return DrawerStateUrlBuilder.AddStateToUrl(baseUrl, ToggledDrawer, NavigationManager);
+        }
+
+        protected string AddDrawerStateToUrlToggled(string baseUrl)
+        {
+            return DrawerStateUrlBuilder.AddStateToUrl(baseUrl, !ToggledDrawer, NavigationManager);
+        }
+
+        protected string RemoveDrawerStateFromUrl(string baseUrl)
+        {
+            return DrawerStateUrlBuilder.RemoveStateFromUrl(baseUrl, NavigationManager);
+        }
+    }
+
+    internal static class DrawerStateUrlBuilder
+    {
+        public const string DrawerStateQueryParameterName = "toggledSidebar";
+
+        public static string AddStateToUrl(string baseUrl, bool toggledDrawer, NavigationManager navigationManager)
+        {
+            return navigationManager.GetUriWithQueryParameters(
+                baseUrl,
+                new Dictionary<string, object?>
+                {
+                    [DrawerStateQueryParameterName] = toggledDrawer ? true : null
+                }
+            );
+        }
+
+        public static string RemoveStateFromUrl(string baseUrl, NavigationManager navigationManager)
+        {
+            return navigationManager.GetUriWithQueryParameters(
+                baseUrl,
+                new Dictionary<string, object?>
+                {
+                    [DrawerStateQueryParameterName] = null
+                }
+            );
+        }
+    }
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/_Imports.razor

@@ -0,0 +1,19 @@
+@using System.Net.Http
+@using System.Net.Http.Json
+@using Microsoft.AspNetCore.Components.Forms
+@using Microsoft.AspNetCore.Components.Routing
+@using Microsoft.AspNetCore.Components.Web
+@using Microsoft.AspNetCore.Components.Web.Virtualization
+@using Microsoft.JSInterop
+@using static Microsoft.AspNetCore.Components.Web.RenderMode
+@using EnvelopeGenerator.ReceiverUI.Web.Client
+@using EnvelopeGenerator.ReceiverUI.Web.Client.Shared
+@using EnvelopeGenerator.ReceiverUI.Web.Client.Api
+@using EnvelopeGenerator.ReceiverUI.Web.Client.Api.Models
+@using EnvelopeGenerator.ReceiverUI.Web.Client.Services
+
+@using DevExpress.Blazor
+@using DevExpress.Blazor.PdfViewer
+@using DevExpress.Blazor.Reporting.Models
+@using DevExpress.AIIntegration.Blazor.Chat
+@using DevExpress.AIIntegration.Blazor.HtmlEditor

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/wwwroot/appsettings.Development.json

@@ -0,0 +1,8 @@
+{
+  "Logging": {
+    "LogLevel": {
+      "Default": "Information",
+      "Microsoft.AspNetCore": "Warning"
+    }
+  }
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.Client/wwwroot/appsettings.json

@@ -0,0 +1,8 @@
+{
+  "Logging": {
+    "LogLevel": {
+      "Default": "Information",
+      "Microsoft.AspNetCore": "Warning"
+    }
+  }
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.sln

@@ -0,0 +1,50 @@
+Microsoft Visual Studio Solution File, Format Version 12.00
+# Visual Studio Version 16
+VisualStudioVersion = 16.0.0.0
+MinimumVisualStudioVersion = 16.0.0.0
+Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "EnvelopeGenerator.ReceiverUI.Web", "EnvelopeGenerator.ReceiverUI.Web\EnvelopeGenerator.ReceiverUI.Web.csproj", "{650B3CE7-2E93-4CC4-9F46-466686815EAA}"
+EndProject
+Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "EnvelopeGenerator.ReceiverUI.Web.Client", "EnvelopeGenerator.ReceiverUI.Web.Client\EnvelopeGenerator.ReceiverUI.Web.Client.csproj", "{5990939C-7E7B-4CFA-86FF-44CA5756498A}"
+EndProject
+Global
+	GlobalSection(SolutionConfigurationPlatforms) = preSolution
+		Debug|Any CPU = Debug|Any CPU
+		Debug|x64 = Debug|x64
+		Debug|x86 = Debug|x86
+		Release|Any CPU = Release|Any CPU
+		Release|x64 = Release|x64
+		Release|x86 = Release|x86
+	EndGlobalSection
+	GlobalSection(ProjectConfigurationPlatforms) = postSolution
+		{5990939C-7E7B-4CFA-86FF-44CA5756498A}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
+		{5990939C-7E7B-4CFA-86FF-44CA5756498A}.Debug|Any CPU.Build.0 = Debug|Any CPU
+		{5990939C-7E7B-4CFA-86FF-44CA5756498A}.Debug|x64.ActiveCfg = Debug|Any CPU
+		{5990939C-7E7B-4CFA-86FF-44CA5756498A}.Debug|x64.Build.0 = Debug|Any CPU
+		{5990939C-7E7B-4CFA-86FF-44CA5756498A}.Debug|x86.ActiveCfg = Debug|Any CPU
+		{5990939C-7E7B-4CFA-86FF-44CA5756498A}.Debug|x86.Build.0 = Debug|Any CPU
+		{5990939C-7E7B-4CFA-86FF-44CA5756498A}.Release|Any CPU.ActiveCfg = Release|Any CPU
+		{5990939C-7E7B-4CFA-86FF-44CA5756498A}.Release|Any CPU.Build.0 = Release|Any CPU
+		{5990939C-7E7B-4CFA-86FF-44CA5756498A}.Release|x64.ActiveCfg = Release|Any CPU
+		{5990939C-7E7B-4CFA-86FF-44CA5756498A}.Release|x64.Build.0 = Release|Any CPU
+		{5990939C-7E7B-4CFA-86FF-44CA5756498A}.Release|x86.ActiveCfg = Release|Any CPU
+		{5990939C-7E7B-4CFA-86FF-44CA5756498A}.Release|x86.Build.0 = Release|Any CPU
+		{650B3CE7-2E93-4CC4-9F46-466686815EAA}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
+		{650B3CE7-2E93-4CC4-9F46-466686815EAA}.Debug|Any CPU.Build.0 = Debug|Any CPU
+		{650B3CE7-2E93-4CC4-9F46-466686815EAA}.Debug|x64.ActiveCfg = Debug|Any CPU
+		{650B3CE7-2E93-4CC4-9F46-466686815EAA}.Debug|x64.Build.0 = Debug|Any CPU
+		{650B3CE7-2E93-4CC4-9F46-466686815EAA}.Debug|x86.ActiveCfg = Debug|Any CPU
+		{650B3CE7-2E93-4CC4-9F46-466686815EAA}.Debug|x86.Build.0 = Debug|Any CPU
+		{650B3CE7-2E93-4CC4-9F46-466686815EAA}.Release|Any CPU.ActiveCfg = Release|Any CPU
+		{650B3CE7-2E93-4CC4-9F46-466686815EAA}.Release|Any CPU.Build.0 = Release|Any CPU
+		{650B3CE7-2E93-4CC4-9F46-466686815EAA}.Release|x64.ActiveCfg = Release|Any CPU
+		{650B3CE7-2E93-4CC4-9F46-466686815EAA}.Release|x64.Build.0 = Release|Any CPU
+		{650B3CE7-2E93-4CC4-9F46-466686815EAA}.Release|x86.ActiveCfg = Release|Any CPU
+		{650B3CE7-2E93-4CC4-9F46-466686815EAA}.Release|x86.Build.0 = Release|Any CPU
+	EndGlobalSection
+	GlobalSection(SolutionProperties) = preSolution
+		HideSolutionNode = FALSE
+	EndGlobalSection
+	GlobalSection(ExtensibilityGlobals) = postSolution
+		SolutionGuid = {4C26868E-5E7C-458D-82E3-040509D0C71F}
+	EndGlobalSection
+EndGlobal

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web/Components/App.razor

@@ -0,0 +1,37 @@
+@using Microsoft.AspNetCore.Mvc.ViewFeatures
+@inject IFileVersionProvider FileVersionProvider
+
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <base href="/" />
+    @DxResourceManager.RegisterTheme(ActiveTheme)
+    @DxResourceManager.RegisterScripts()
+    <link href=@AppendVersion("_content/DevExpress.Blazor.Viewer/css/dx-blazor-viewer-components.fluent.css") rel="stylesheet" />
+    <link href=@AppendVersion("css/site.css") rel="stylesheet" />
+    <link href=@AppendVersion("css/receiver-site.css") rel="stylesheet" />
+    <link href=@AppendVersion("css/card.css") rel="stylesheet" />
+    <link href=@AppendVersion("css/logo.css") rel="stylesheet" />
+    <link href=@AppendVersion("css/receiver-extras.css") rel="stylesheet" />
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" rel="stylesheet" />
+    <link href=@AppendVersion("EnvelopeGenerator.ReceiverUI.Web.styles.css") rel="stylesheet" />
+    <HeadOutlet @rendermode="InteractiveAuto" />
+</head>
+<body>
+    <Routes @rendermode="InteractiveAuto" />
+    <script src="_framework/blazor.web.js"></script>
+    <script src="js/signature-pad.js"></script>
+</body>
+</html>
+
+@code {
+    static readonly ITheme ActiveTheme = Themes.Fluent.Clone(properties => {
+        properties.Mode = ThemeMode.Light;
+        properties.UseBootstrapStyles = true;
+    });
+
+    private string AppendVersion(string path) => FileVersionProvider.AddFileVersionToPath("/", path);
+
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web/Components/Pages/Error.razor

@@ -0,0 +1,36 @@
+@page "/Error"
+@using System.Diagnostics
+
+<PageTitle>Error</PageTitle>
+
+<h1 class="text-danger">Error.</h1>
+<h2 class="text-danger">An error occurred while processing your request.</h2>
+
+@if (ShowRequestId)
+{
+    <p>
+        <strong>Request ID:</strong> <code>@RequestId</code>
+    </p>
+}
+
+<h3>Development Mode</h3>
+<p>
+    Swapping to <strong>Development</strong> environment will display more detailed information about the error that occurred.
+</p>
+<p>
+    <strong>The Development environment shouldn't be enabled for deployed applications.</strong>
+    It can result in displaying sensitive information from exceptions to end users.
+    For local debugging, enable the <strong>Development</strong> environment by setting the <strong>ASPNETCORE_ENVIRONMENT</strong> environment variable to <strong>Development</strong>
+    and restarting the app.
+</p>
+
+@code{
+    [CascadingParameter]
+    private HttpContext? HttpContext { get; set; }
+
+    private string? RequestId { get; set; }
+    private bool ShowRequestId => !string.IsNullOrEmpty(RequestId);
+
+    protected override void OnInitialized() =>
+        RequestId = Activity.Current?.Id ?? HttpContext?.TraceIdentifier;
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web/Components/_Imports.razor

@@ -0,0 +1,18 @@
+@using System.Net.Http
+@using System.Net.Http.Json
+@using Microsoft.AspNetCore.Components.Forms
+@using Microsoft.AspNetCore.Components.Routing
+@using Microsoft.AspNetCore.Components.Web
+@using Microsoft.AspNetCore.Components.Web.Virtualization
+@using Microsoft.JSInterop
+@using static Microsoft.AspNetCore.Components.Web.RenderMode
+@using EnvelopeGenerator.ReceiverUI.Web
+@using EnvelopeGenerator.ReceiverUI.Web.Components
+@using EnvelopeGenerator.ReceiverUI.Web.Client
+@using EnvelopeGenerator.ReceiverUI.Web.Client.Shared
+
+@using DevExpress.Blazor
+@using DevExpress.Blazor.PdfViewer
+@using DevExpress.Blazor.Reporting.Models
+@using DevExpress.AIIntegration.Blazor.Chat
+@using DevExpress.AIIntegration.Blazor.HtmlEditor

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web.csproj

@@ -0,0 +1,28 @@
+<Project Sdk="Microsoft.NET.Sdk.Web">
+  <PropertyGroup>
+    <TargetFramework>net8.0</TargetFramework>
+    <Nullable>enable</Nullable>
+    <ImplicitUsings>enable</ImplicitUsings>
+  </PropertyGroup>
+
+  <ItemGroup>
+    <PackageReference Include="DevExpress.Blazor" Version="25.2.*" />
+    <PackageReference Include="DevExpress.Blazor.PdfViewer" Version="25.2.*" />
+    <PackageReference Include="DevExpress.Pdf.SkiaRenderer" Version="25.2.*" />
+    <PackageReference Include="SkiaSharp.NativeAssets.WebAssembly" Version="3.119.1" />
+    <PackageReference Include="HarfBuzzSharp.NativeAssets.WebAssembly" Version="8.3.1.2" />
+    <PackageReference Include="DevExpress.AIIntegration.Blazor" Version="25.2.*" />
+    <PackageReference Include="DevExpress.AIIntegration.OpenAI" Version="25.2.*" />
+    
+    <PackageReference Include="Azure.AI.OpenAI" Version="2.2.0-beta.5" />
+    <PackageReference Include="Microsoft.Extensions.AI" Version="9.7.1" />
+    <PackageReference Include="Microsoft.Extensions.AI.OpenAI" Version="9.7.1-preview.1.25365.4" />
+    
+    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="8.0.20" />
+    <PackageReference Include="Yarp.ReverseProxy" Version="2.2.0" />
+  </ItemGroup>
+
+  <ItemGroup>
+    <ProjectReference Include="..\EnvelopeGenerator.ReceiverUI.Web.Client\EnvelopeGenerator.ReceiverUI.Web.Client.csproj" />
+  </ItemGroup>
+</Project>

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web/Program.cs

@@ -0,0 +1,106 @@
+using EnvelopeGenerator.ReceiverUI.Web.Client.Api;
+using EnvelopeGenerator.ReceiverUI.Web.Client.Services;
+using EnvelopeGenerator.ReceiverUI.Web.Client.Utils;
+using EnvelopeGenerator.ReceiverUI.Web.Components;
+using System.Text;
+
+
+var builder = WebApplication.CreateBuilder(args);
+
+// Add services to the container.
+builder.Services.AddRazorComponents()
+    .AddInteractiveServerComponents()
+    .AddInteractiveWebAssemblyComponents();
+
+builder.Services.AddDevExpressBlazor(options =>
+{
+    options.SizeMode = DevExpress.Blazor.SizeMode.Medium;
+});
+
+var aiUri = builder.Configuration.GetSection("AzureOpenAISettings")["Endpoint"];
+var aiKey = builder.Configuration.GetSection("AzureOpenAISettings")["Key"];
+var aiModel = builder.Configuration.GetSection("AzureOpenAISettings")["DeploymentName"];
+
+if (string.IsNullOrEmpty(aiUri) || string.IsNullOrEmpty(aiKey) || string.IsNullOrEmpty(aiModel))
+    throw new InvalidOperationException("Specify the OpenAI endpoint, key, and deployment name in the 'appsettings.json' file.");
+builder.Services.AddChatClient(aiUri, aiKey, aiModel);
+builder.Services.AddHttpClient();
+
+builder.Services.AddMvc();
+
+builder.Services.AddDevExpressServerSideBlazorPdfViewer();
+
+// ── Receiver API + Auth + Localization (for prerender on the server) ─
+// During prerendering the components still need the same scoped services
+// as on the WASM side. Server-side calls go directly to the API
+// (configured via "Api:BaseUrl"); browser-side calls go through YARP.
+// Note: server-side prerender does NOT forward the user's auth cookie yet
+// (will be added in a later phase if interactive prerender is needed).
+var apiBaseUrl = builder.Configuration["Api:BaseUrl"]
+    ?? throw new InvalidOperationException("Api:BaseUrl is missing from configuration.");
+builder.Services.AddHttpClient<ReceiverApiClient>(client =>
+{
+    client.BaseAddress = new Uri(apiBaseUrl.TrimEnd('/') + "/");
+});
+builder.Services.AddScoped<LocalizationService>();
+builder.Services.AddScoped<ReceiverAuthState>();
+
+// ── YARP reverse proxy: forwards /api/** from the browser to the API
+// (same-origin from the browser's POV → HttpOnly auth cookie flows).
+builder.Services.AddReverseProxy()
+    .LoadFromConfig(builder.Configuration.GetSection("ReverseProxy"));
+
+var app = builder.Build();
+
+// Configure the HTTP request pipeline.
+if (app.Environment.IsDevelopment())
+{
+    app.UseWebAssemblyDebugging();
+}
+else
+{
+    app.UseExceptionHandler("/Error", createScopeForErrors: true);
+    // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
+    app.UseHsts();
+}
+
+app.MapPost("/api/chat/{*path}", async (string path, HttpContext context, CancellationToken ct) =>
+{
+    var httpClientFactory = context.RequestServices.GetRequiredService<IHttpClientFactory>();
+
+    var client = httpClientFactory.CreateClient();
+    client.BaseAddress = new(aiUri);
+    client.DefaultRequestHeaders.Authorization = new("Bearer", aiKey);
+
+    var newPath = path.Replace("proxychat", aiModel);
+    var endpointUri = new Uri(aiUri);
+    var uriBuilder = new UriBuilder(endpointUri)
+    {
+        Path = $"{endpointUri.AbsolutePath}/{newPath}",
+        Query = context.Request.QueryString.Value
+    };
+
+    var body = await new StreamReader(context.Request.Body).ReadToEndAsync(ct);
+
+    var response = await client.PostAsync(uriBuilder.Uri, new StringContent(body, Encoding.UTF8, "application/json"), ct);
+    context.Response.StatusCode = (int)response.StatusCode;
+    await response.Content.CopyToAsync(context.Response.Body, ct);
+});
+
+app.UseHttpsRedirection();
+
+app.UseStaticFiles();
+app.UseAntiforgery();
+
+// Forward all /api/** traffic (except /api/chat which is handled above)
+// to the EnvelopeGenerator.API backend.
+app.MapReverseProxy();
+
+app.MapRazorComponents<App>()
+    .AddInteractiveServerRenderMode()
+    .AddInteractiveWebAssemblyRenderMode()
+    .AddAdditionalAssemblies(typeof(EnvelopeGenerator.ReceiverUI.Web.Client._Imports).Assembly)
+    .AllowAnonymous();
+
+app.Run();
+

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web/Properties/launchSettings.json

@@ -0,0 +1,25 @@
+{
+  "$schema": "http://json.schemastore.org/launchsettings.json",
+  "profiles": {
+    "http": {
+      "commandName": "Project",
+      "dotnetRunMessages": true,
+      "launchBrowser": true,
+      "inspectUri": "{wsProtocol}://{url.hostname}:{url.port}/_framework/debug/ws-proxy?browser={browserInspectUri}",
+      "applicationUrl": "http://localhost:5000",
+      "environmentVariables": {
+        "ASPNETCORE_ENVIRONMENT": "Development"
+      }
+    },
+    "https": {
+      "commandName": "Project",
+      "dotnetRunMessages": true,
+      "launchBrowser": true,
+      "inspectUri": "{wsProtocol}://{url.hostname}:{url.port}/_framework/debug/ws-proxy?browser={browserInspectUri}",
+      "applicationUrl": "https://localhost:5001;http://localhost:5000",
+      "environmentVariables": {
+        "ASPNETCORE_ENVIRONMENT": "Development"
+      }
+    }
+  }
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web/appsettings.Development.json

@@ -0,0 +1,8 @@
+{
+  "Logging": {
+    "LogLevel": {
+      "Default": "Information",
+      "Microsoft.AspNetCore": "Warning"
+    }
+  }
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web/appsettings.json

@@ -0,0 +1,36 @@
+{
+  "AzureOpenAISettings": {
+    "Endpoint": "https://public-api.devexpress.com/demo-openai",
+    "Key": "DEMO",
+    "DeploymentName": "gpt-4.1"
+  },
+  "Api": {
+    "BaseUrl": "https://localhost:8088"
+  },
+  "ReverseProxy": {
+    "Routes": {
+      "envelope-api": {
+        "ClusterId": "envelope-api",
+        "Match": {
+          "Path": "/api/{**catch-all}"
+        }
+      }
+    },
+    "Clusters": {
+      "envelope-api": {
+        "Destinations": {
+          "default": {
+            "Address": "https://localhost:8088"
+          }
+        }
+      }
+    }
+  },
+  "Logging": {
+    "LogLevel": {
+      "Default": "Information",
+      "Microsoft.AspNetCore": "Warning"
+    }
+  },
+  "AllowedHosts": "*"
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web/wwwroot/css/card.css

@@ -0,0 +1,126 @@
+@import url('https://fonts.googleapis.com/css?family=Muli&display=swap');
+
+* {
+	box-sizing: border-box;
+}
+
+.dd-cards-container {
+	font-family: 'Muli', sans-serif;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	flex-direction: column;
+
+}
+
+.dd-card {
+	background-color: #fff;
+	display: flex;
+	max-width: 100%;
+	margin: 0;
+	overflow: hidden;
+	width: 100%;
+}
+
+	.dd-card h6 {
+		opacity: 0.6;
+		margin: 0;
+		letter-spacing: 0.0625rem;
+		font-size: clamp(0.6rem, 1.33vw, 0.8rem);
+	}
+
+	.dd-card h2 {
+		letter-spacing: 0.0625rem;
+		margin: 0;
+		font-size: clamp(1rem, 2.67vw, 1.67rem);
+	}
+
+.uppercase {
+	text-transform: uppercase;
+}
+
+.dd-card-preview {
+	background-color: #2A265F;
+	color: #fff;
+	padding: 0.1rem 1rem 1rem 1rem;
+	margin:0;
+	display: flex;
+	flex-direction: column;
+	justify-content: center;
+	align-items: center;
+}
+
+	.dd-card-preview a {
+		color: #fff;
+		opacity: 0.6;
+	}
+
+	.dd-card-preview button {
+		border-width: 0;
+		align-items: center;
+		background-color: transparent;
+		color: white;
+		margin: 15% 0 0 0;
+		transition: color 0.25s ease;
+
+	}
+
+		.dd-card-preview button:hover {
+			color: #bebebe;
+		}
+
+		.dd-card-preview span {
+		}
+
+.dd-card-info {
+	padding: clamp(0.55rem, 2vw, .875rem) 0 0 clamp(0.55rem, 2.5vw, 1.7rem);
+	margin: 0;
+	position: relative;
+	width: 100%;
+}
+
+	.dd-card-info p, .dd-card-info a, .dd-card-info small, .dd-card-info span {
+		opacity: 0.65;
+		font-size: clamp(0.55rem, 1.23vw, 0.75rem);
+		margin: clamp(0.55rem, 2vw, .875rem) 0 clamp(0.55rem, 2vw, .875rem) 0;
+		text-decoration: none;
+		padding: 0;
+	}
+
+.app-logo {
+	width: clamp(4rem, 10vw, 5rem);
+	margin: 1rem 0 0 0;
+}
+
+.progress-container {
+	text-align: right;
+	width: 100%;
+	margin: clamp(0.8rem, 2vw, 1rem) 0 0 0;
+}
+
+.progress {
+	background-color: #ddd;
+	border-radius: 0.1875rem;
+	height: clamp(0.25rem, 1vw, 0.3125rem);
+	width: clamp(6rem, 20vw, 10rem);
+	position: relative;
+}
+
+	.progress::after {
+		background-color: #2A265F;
+		content: '';
+		position: absolute;
+		top: 0;
+		left: 0;
+		height: clamp(0.25rem, 1vw, 0.3125rem);
+		width: var(--progress-width, 1%);
+		transition: width 1s ease;
+		opacity: 0.85;
+	}
+
+.progress-text {
+	font-size: clamp(0.5rem, 1.5vw, 0.625rem);
+	opacity: 0.6;
+	letter-spacing: clamp(0.05rem, 0.5vw, 0.0625rem);
+	text-align: left;
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web/wwwroot/css/error-space.css

@@ -0,0 +1,391 @@
+html,
+body {
+    height: 100%;
+    width: 100%;
+    margin: 0px;
+    background: linear-gradient(90deg, rgba(47, 54, 64, 1) 23%, rgba(24, 27, 32, 1) 100%);
+}
+
+:root {
+    --moon-left-position: 0px;
+}
+
+
+.moon {
+    background: linear-gradient(90deg, rgba(208, 208, 208, 1) 48%, rgba(145, 145, 145, 1) 100%);
+    position: absolute;
+    top: -100px;
+    left: var(--moon-left-position);
+    width: 900px;
+    height: 900px;
+    content: '';
+    border-radius: 100%;
+    box-shadow: 0px 0px 30px -4px rgba(0, 0, 0, 0.5);
+}
+
+.moon__crater {
+    position: absolute;
+    content: '';
+    border-radius: 100%;
+    background: linear-gradient(90deg, rgba(122, 122, 122, 1) 38%, rgba(195, 195, 195, 1) 100%);
+    opacity: 0.6;
+}
+
+.moon__crater1 {
+    top: 250px;
+    left: calc(var(--moon-left-position) + 800px);
+    width: 60px;
+    height: 180px;
+}
+
+.moon__crater2 {
+    top: 650px;
+    left: calc(var(--moon-left-position) + 640px);
+    width: 40px;
+    height: 80px;
+    transform: rotate(55deg);
+}
+
+.moon__crater3 {
+    top: -20px;
+    left: calc(var(--moon-left-position) + 340px);
+    width: 65px;
+    height: 120px;
+    transform: rotate(250deg);
+}
+
+.star {
+    background: grey;
+    position: absolute;
+    width: 5px;
+    height: 5px;
+    content: '';
+    border-radius: 100%;
+    transform: rotate(250deg);
+    opacity: 0.4;
+    animation-name: shimmer;
+    animation-duration: 1.5s;
+    animation-iteration-count: infinite;
+    animation-direction: alternate;
+}
+
+@keyframes shimmer {
+    from {
+        opacity: 0;
+    }
+
+    to {
+        opacity: 0.7;
+    }
+}
+
+.star1 {
+    top: 40%;
+    left: 50%;
+    animation-delay: 1s;
+}
+
+.star2 {
+    top: 60%;
+    left: 90%;
+    animation-delay: 3s;
+}
+
+.star3 {
+    top: 10%;
+    left: 70%;
+    animation-delay: 2s;
+}
+
+.star4 {
+    top: 90%;
+    left: 40%;
+}
+
+.star5 {
+    top: 20%;
+    left: 30%;
+    animation-delay: 0.5s;
+}
+
+.error {
+    position: absolute;
+    left: 100px;
+    top: 400px;
+    transform: translateY(-60%);
+    font-family: 'Montserrat', sans-serif;
+    color: #363e49;
+}
+
+.error__title {
+    font-size: 10em;
+}
+
+.error__subtitle {
+    font-size: 2em;
+}
+
+.error__description {
+    opacity: 0.5;
+}
+
+.error__button  {
+    display: inline-block;
+    margin-top: 3em;
+    margin-right: 0.5em;
+    padding: 0.5em 2em;
+    outline: none;
+    border: 2px solid #2f3640;
+    background-color: transparent;
+    border-radius: 8em;
+    color: #576375;
+    cursor: pointer;
+    transition-duration: 0.2s;
+    font-size: 0.75em;
+    font-family: 'Montserrat', sans-serif;
+    text-decoration: none;
+}
+
+.error__button:hover {
+    color: #21252c;
+}
+
+.error__button--active {
+    background-color: #e67e22;
+    border: 2px solid #e67e22;
+    color: white;
+}
+
+.error__button--active:hover {
+    box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.5);
+    color: white;
+}
+
+.astronaut {
+    position: absolute;
+    width: 185px;
+    height: 300px;
+    left: 70%;
+    top: 50%;
+    transform: translate(-50%, -50%) rotate(20deg) scale(1.2);
+}
+
+.astronaut__head {
+    background-color: white;
+    position: absolute;
+    top: 60px;
+    left: 60px;
+    width: 60px;
+    height: 60px;
+    content: '';
+    border-radius: 2em;
+}
+
+.astronaut__head-visor-flare1 {
+    background-color: #7f8fa6;
+    position: absolute;
+    top: 28px;
+    left: 40px;
+    width: 10px;
+    height: 10px;
+    content: '';
+    border-radius: 2em;
+    opacity: 0.5;
+}
+
+.astronaut__head-visor-flare2 {
+    background-color: #718093;
+    position: absolute;
+    top: 40px;
+    left: 38px;
+    width: 5px;
+    height: 5px;
+    content: '';
+    border-radius: 2em;
+    opacity: 0.3;
+}
+
+.astronaut__backpack {
+    background-color: #bfbfbf;
+    position: absolute;
+    top: 90px;
+    left: 47px;
+    width: 86px;
+    height: 90px;
+    content: '';
+    border-radius: 8px;
+}
+
+.astronaut__body {
+    background-color: #e6e6e6;
+    position: absolute;
+    top: 115px;
+    left: 55px;
+    width: 70px;
+    height: 80px;
+    content: '';
+    border-radius: 8px;
+}
+
+.astronaut__body__chest {
+    background-color: #d9d9d9;
+    position: absolute;
+    top: 140px;
+    left: 68px;
+    width: 45px;
+    height: 25px;
+    content: '';
+    border-radius: 6px;
+}
+
+.astronaut__arm-left1 {
+    background-color: #e6e6e6;
+    position: absolute;
+    top: 127px;
+    left: 9px;
+    width: 65px;
+    height: 20px;
+    content: '';
+    border-radius: 8px;
+    transform: rotate(-30deg);
+}
+
+.astronaut__arm-left2 {
+    background-color: #e6e6e6;
+    position: absolute;
+    top: 102px;
+    left: 7px;
+    width: 20px;
+    height: 45px;
+    content: '';
+    border-radius: 8px;
+    transform: rotate(-12deg);
+    border-top-left-radius: 8em;
+    border-top-right-radius: 8em;
+}
+
+.astronaut__arm-right1 {
+    background-color: #e6e6e6;
+    position: absolute;
+    top: 113px;
+    left: 100px;
+    width: 65px;
+    height: 20px;
+    content: '';
+    border-radius: 8px;
+    transform: rotate(-10deg);
+}
+
+.astronaut__arm-right2 {
+    background-color: #e6e6e6;
+    position: absolute;
+    top: 78px;
+    left: 141px;
+    width: 20px;
+    height: 45px;
+    content: '';
+    border-radius: 8px;
+    transform: rotate(-10deg);
+    border-top-left-radius: 8em;
+    border-top-right-radius: 8em;
+}
+
+.astronaut__arm-thumb-left {
+    background-color: #e6e6e6;
+    position: absolute;
+    top: 110px;
+    left: 21px;
+    width: 10px;
+    height: 6px;
+    content: '';
+    border-radius: 8em;
+    transform: rotate(-35deg);
+}
+
+.astronaut__arm-thumb-right {
+    background-color: #e6e6e6;
+    position: absolute;
+    top: 90px;
+    left: 133px;
+    width: 10px;
+    height: 6px;
+    content: '';
+    border-radius: 8em;
+    transform: rotate(20deg);
+}
+
+.astronaut__wrist-left {
+    background-color: #e67e22;
+    position: absolute;
+    top: 122px;
+    left: 6.5px;
+    width: 21px;
+    height: 4px;
+    content: '';
+    border-radius: 8em;
+    transform: rotate(-15deg);
+}
+
+.astronaut__wrist-right {
+    background-color: #e67e22;
+    position: absolute;
+    top: 98px;
+    left: 141px;
+    width: 21px;
+    height: 4px;
+    content: '';
+    border-radius: 8em;
+    transform: rotate(-10deg);
+}
+
+.astronaut__leg-left {
+    background-color: #e6e6e6;
+    position: absolute;
+    top: 188px;
+    left: 50px;
+    width: 23px;
+    height: 75px;
+    content: '';
+    transform: rotate(10deg);
+}
+
+.astronaut__leg-right {
+    background-color: #e6e6e6;
+    position: absolute;
+    top: 188px;
+    left: 108px;
+    width: 23px;
+    height: 75px;
+    content: '';
+    transform: rotate(-10deg);
+}
+
+.astronaut__foot-left {
+    background-color: white;
+    position: absolute;
+    top: 240px;
+    left: 43px;
+    width: 28px;
+    height: 20px;
+    content: '';
+    transform: rotate(10deg);
+    border-radius: 3px;
+    border-top-left-radius: 8em;
+    border-top-right-radius: 8em;
+    border-bottom: 4px solid #e67e22;
+}
+
+.astronaut__foot-right {
+    background-color: white;
+    position: absolute;
+    top: 240px;
+    left: 111px;
+    width: 28px;
+    height: 20px;
+    content: '';
+    transform: rotate(-10deg);
+    border-radius: 3px;
+    border-top-left-radius: 8em;
+    border-top-right-radius: 8em;
+    border-bottom: 4px solid #e67e22;
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web/wwwroot/css/icons.css

@@ -0,0 +1,38 @@
+.icon {
+    width: 1.25rem;
+    height: 1.25rem;
+    background-color: currentcolor;
+    mask-image: var(--icon-mask-image);
+    mask-position: center;
+    mask-repeat: no-repeat;
+}
+
+.icon-back {
+    --icon-mask-image: url("/images/back.svg");
+}
+.icon-close {
+    --icon-mask-image: url("/images/close.svg");
+}
+.icon-demos {
+    --icon-mask-image: url("/images/demos.svg");
+}
+.icon-docs {
+    --icon-mask-image: url("/images/doc.svg");
+}
+.icon-menu {
+    --icon-mask-image: url("/images/menu.svg");
+}
+
+/* pages */
+.icon-counter {
+    --icon-mask-image: url("/images/pages/counter.svg");
+}
+.icon-home {
+    --icon-mask-image: url("/images/pages/home.svg");
+}
+.icon-pdf-viewer {
+    --icon-mask-image: url("/images/pages/document-pdf.svg");
+}
+.icon-weather {
+    --icon-mask-image: url("/images/pages/weather.svg");
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web/wwwroot/css/logo.css

@@ -0,0 +1,37 @@
+.dd-locked-logo {
+    width: 13rem;
+    padding-top: 1rem;
+}
+
+.dd-show-logo {
+    width: 9rem;
+    position: absolute;
+    right: 0;
+    margin: 0 2rem 0 0;
+    padding: 0;
+    top:0;
+}
+
+.cursor-locked-logo {
+    width: 9rem;
+    padding-top: 1rem;
+}
+
+.cursor-show-logo {
+    width: 6rem;
+}
+
+@media (max-width: 767px) {
+    .dd-show-logo {
+        width: 5rem;
+        margin-right: 0rem;
+    }
+
+    .cursor-show-logo {
+        width: 3rem;
+    }
+}
+
+.signFlow-logo {
+    width: 9rem;
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web/wwwroot/css/open-iconic/README.md

@@ -0,0 +1,114 @@
+[Open Iconic v1.1.1](http://useiconic.com/open)
+===========
+
+### Open Iconic is the open source sibling of [Iconic](http://useiconic.com). It is a hyper-legible collection of 223 icons with a tiny footprint—ready to use with Bootstrap and Foundation. [View the collection](http://useiconic.com/open#icons)
+
+
+
+## What's in Open Iconic?
+
+* 223 icons designed to be legible down to 8 pixels
+* Super-light SVG files - 61.8 for the entire set 
+* SVG sprite—the modern replacement for icon fonts
+* Webfont (EOT, OTF, SVG, TTF, WOFF), PNG and WebP formats
+* Webfont stylesheets (including versions for Bootstrap and Foundation) in CSS, LESS, SCSS and Stylus formats
+* PNG and WebP raster images in 8px, 16px, 24px, 32px, 48px and 64px.
+
+
+## Getting Started
+
+#### For code samples and everything else you need to get started with Open Iconic, check out our [Icons](http://useiconic.com/open#icons) and [Reference](http://useiconic.com/open#reference) sections.
+
+### General Usage
+
+#### Using Open Iconic's SVGs
+
+We like SVGs and we think they're the way to display icons on the web. Since Open Iconic are just basic SVGs, we suggest you display them like you would any other image (don't forget the `alt` attribute).
+
+```
+<img src="/open-iconic/svg/icon-name.svg" alt="icon name">
+```
+
+#### Using Open Iconic's SVG Sprite
+
+Open Iconic also comes in a SVG sprite which allows you to display all the icons in the set with a single request. It's like an icon font, without being a hack.
+
+Adding an icon from an SVG sprite is a little different than what you're used to, but it's still a piece of cake. *Tip: To make your icons easily style able, we suggest adding a general class to the* `<svg>` *tag and a unique class name for each different icon in the* `<use>` *tag.*  
+
+```
+<svg class="icon">
+  <use xlink:href="open-iconic.svg#account-login" class="icon-account-login"></use>
+</svg>
+```
+
+Sizing icons only needs basic CSS. All the icons are in a square format, so just set the `<svg>` tag with equal width and height dimensions.
+
+```
+.icon {
+  width: 16px;
+  height: 16px;
+}
+```
+
+Coloring icons is even easier. All you need to do is set the `fill` rule on the `<use>` tag.
+
+```
+.icon-account-login {
+  fill: #f00;
+}
+```
+
+To learn more about SVG Sprites, read [Chris Coyier's guide](http://css-tricks.com/svg-sprites-use-better-icon-fonts/).
+
+#### Using Open Iconic's Icon Font...
+
+
+##### …with Bootstrap
+
+You can find our Bootstrap stylesheets in `font/css/open-iconic-bootstrap.{css, less, scss, styl}`
+
+
+```
+<link href="/open-iconic/font/css/open-iconic-bootstrap.css" rel="stylesheet">
+```
+
+
+```
+<span class="oi oi-icon-name" title="icon name" aria-hidden="true"></span>
+```
+
+##### …with Foundation
+
+You can find our Foundation stylesheets in `font/css/open-iconic-foundation.{css, less, scss, styl}`
+
+```
+<link href="/open-iconic/font/css/open-iconic-foundation.css" rel="stylesheet">
+```
+
+
+```
+<span class="fi-icon-name" title="icon name" aria-hidden="true"></span>
+```
+
+##### …on its own
+
+You can find our default stylesheets in `font/css/open-iconic.{css, less, scss, styl}`
+
+```
+<link href="/open-iconic/font/css/open-iconic.css" rel="stylesheet">
+```
+
+```
+<span class="oi" data-glyph="icon-name" title="icon name" aria-hidden="true"></span>
+```
+
+
+## License
+
+### Icons
+
+All code (including SVG markup) is under the [MIT License](http://opensource.org/licenses/MIT).
+
+### Fonts
+
+All fonts are under the [SIL Licensed](http://scripts.sil.org/cms/scripts/page.php?item_id=OFL_web).

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web/wwwroot/css/open-iconic/font-license.txt

@@ -0,0 +1,86 @@
+SIL OPEN FONT LICENSE Version 1.1
+
+Copyright (c) 2014 Waybury
+
+PREAMBLE
+The goals of the Open Font License (OFL) are to stimulate worldwide
+development of collaborative font projects, to support the font creation
+efforts of academic and linguistic communities, and to provide a free and
+open framework in which fonts may be shared and improved in partnership
+with others.
+
+The OFL allows the licensed fonts to be used, studied, modified and
+redistributed freely as long as they are not sold by themselves. The
+fonts, including any derivative works, can be bundled, embedded,
+redistributed and/or sold with any software provided that any reserved
+names are not used by derivative works. The fonts and derivatives,
+however, cannot be released under any other type of license. The
+requirement for fonts to remain under this license does not apply
+to any document created using the fonts or their derivatives.
+
+DEFINITIONS
+"Font Software" refers to the set of files released by the Copyright
+Holder(s) under this license and clearly marked as such. This may
+include source files, build scripts and documentation.
+
+"Reserved Font Name" refers to any names specified as such after the
+copyright statement(s).
+
+"Original Version" refers to the collection of Font Software components as
+distributed by the Copyright Holder(s).
+
+"Modified Version" refers to any derivative made by adding to, deleting,
+or substituting -- in part or in whole -- any of the components of the
+Original Version, by changing formats or by porting the Font Software to a
+new environment.
+
+"Author" refers to any designer, engineer, programmer, technical
+writer or other person who contributed to the Font Software.
+
+PERMISSION & CONDITIONS
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of the Font Software, to use, study, copy, merge, embed, modify,
+redistribute, and sell modified and unmodified copies of the Font
+Software, subject to the following conditions:
+
+1) Neither the Font Software nor any of its individual components,
+in Original or Modified Versions, may be sold by itself.
+
+2) Original or Modified Versions of the Font Software may be bundled,
+redistributed and/or sold with any software, provided that each copy
+contains the above copyright notice and this license. These can be
+included either as stand-alone text files, human-readable headers or
+in the appropriate machine-readable metadata fields within text or
+binary files as long as those fields can be easily viewed by the user.
+
+3) No Modified Version of the Font Software may use the Reserved Font
+Name(s) unless explicit written permission is granted by the corresponding
+Copyright Holder. This restriction only applies to the primary font name as
+presented to the users.
+
+4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
+Software shall not be used to promote, endorse or advertise any
+Modified Version, except to acknowledge the contribution(s) of the
+Copyright Holder(s) and the Author(s) or with their explicit written
+permission.
+
+5) The Font Software, modified or unmodified, in part or in whole,
+must be distributed entirely under this license, and must not be
+distributed under any other license. The requirement for fonts to
+remain under this license does not apply to any document created
+using the Font Software.
+
+TERMINATION
+This license becomes null and void if any of the above conditions are
+not met.
+
+DISCLAIMER
+THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
+OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
+COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
+DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
+OTHER DEALINGS IN THE FONT SOFTWARE.

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web/wwwroot/css/open-iconic/font/fonts/open-iconic.svg

@@ -0,0 +1,543 @@
+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
+<!--
+2014-7-1: Created.
+-->
+<svg xmlns="http://www.w3.org/2000/svg">
+<metadata>
+Created by FontForge 20120731 at Tue Jul  1 20:39:22 2014
+ By P.J. Onori
+Created by P.J. Onori with FontForge 2.0 (http://fontforge.sf.net)
+</metadata>
+<defs>
+<font id="open-iconic" horiz-adv-x="800" >
+  <font-face 
+    font-family="Icons"
+    font-weight="400"
+    font-stretch="normal"
+    units-per-em="800"
+    panose-1="2 0 5 3 0 0 0 0 0 0"
+    ascent="800"
+    descent="0"
+    bbox="-0.5 -101 802 800.126"
+    underline-thickness="50"
+    underline-position="-100"
+    unicode-range="U+E000-E0DE"
+  />
+    <missing-glyph />
+    <glyph glyph-name="" unicode="&#xe000;" 
+d="M300 700h500v-700h-500v100h400v500h-400v100zM400 500l200 -150l-200 -150v100h-400v100h400v100z" />
+    <glyph glyph-name="1" unicode="&#xe001;" 
+d="M300 700h500v-700h-500v100h400v500h-400v100zM200 500v-100h400v-100h-400v-100l-200 150z" />
+    <glyph glyph-name="2" unicode="&#xe002;" 
+d="M350 700c193 0 350 -157 350 -350v-50h100l-200 -200l-200 200h100v50c0 138 -112 250 -250 250s-250 -112 -250 -250c0 193 157 350 350 350z" />
+    <glyph glyph-name="3" unicode="&#xe003;" 
+d="M450 700c193 0 350 -157 350 -350c0 138 -112 250 -250 250s-250 -112 -250 -250v-50h100l-200 -200l-200 200h100v50c0 193 157 350 350 350z" />
+    <glyph glyph-name="4" unicode="&#xe004;" 
+d="M0 700h800v-100h-800v100zM100 500h600v-100h-600v100zM0 300h800v-100h-800v100zM100 100h600v-100h-600v100z" />
+    <glyph glyph-name="5" unicode="&#xe005;" 
+d="M0 700h800v-100h-800v100zM0 500h600v-100h-600v100zM0 300h800v-100h-800v100zM0 100h600v-100h-600v100z" />
+    <glyph glyph-name="6" unicode="&#xe006;" 
+d="M0 700h800v-100h-800v100zM200 500h600v-100h-600v100zM0 300h800v-100h-800v100zM200 100h600v-100h-600v100z" />
+    <glyph glyph-name="7" unicode="&#xe007;" 
+d="M400 700c75 0 146 -23 206 -59l-75 -225l-322 234c57 31 122 50 191 50zM125 588l191 -138l-310 -222c-4 24 -6 47 -6 72c0 114 49 215 125 288zM688 575c69 -72 112 -168 112 -275c0 -35 -8 -68 -16 -100h-218zM216 253l112 -347c-128 23 -232 109 -287 222zM372 100
+h372c-64 -109 -177 -185 -310 -197z" />
+    <glyph glyph-name="8" unicode="&#xe008;" horiz-adv-x="600" 
+d="M200 800h100v-500h200l-247 -300l-253 300h200v500z" />
+    <glyph glyph-name="9" unicode="&#xe009;" 
+d="M400 800c221 0 400 -179 400 -400s-179 -400 -400 -400s-400 179 -400 400s179 400 400 400zM300 700v-300h-200l300 -300l300 300h-200v300h-200z" />
+    <glyph glyph-name="a" unicode="&#xe00a;" 
+d="M400 800c221 0 400 -179 400 -400s-179 -400 -400 -400s-400 179 -400 400s179 400 400 400zM400 700l-300 -300l300 -300v200h300v200h-300v200z" />
+    <glyph glyph-name="b" unicode="&#xe00b;" 
+d="M400 800c221 0 400 -179 400 -400s-179 -400 -400 -400s-400 179 -400 400s179 400 400 400zM400 700v-200h-300v-200h300v-200l300 300z" />
+    <glyph glyph-name="c" unicode="&#xe00c;" 
+d="M400 800c221 0 400 -179 400 -400s-179 -400 -400 -400s-400 179 -400 400s179 400 400 400zM400 700l-300 -300h200v-300h200v300h200z" />
+    <glyph glyph-name="d" unicode="&#xe00d;" 
+d="M300 600v-200h500v-100h-500v-200l-300 247z" />
+    <glyph glyph-name="e" unicode="&#xe00e;" 
+d="M500 600l300 -247l-300 -253v200h-500v100h500v200z" />
+    <glyph glyph-name="f" unicode="&#xe00f;" horiz-adv-x="600" 
+d="M200 800h200v-500h200l-297 -300l-303 300h200v500z" />
+    <glyph glyph-name="10" unicode="&#xe010;" 
+d="M300 700v-200h500v-200h-500v-200l-300 297z" />
+    <glyph glyph-name="11" unicode="&#xe011;" 
+d="M500 700l300 -297l-300 -303v200h-500v200h500v200z" />
+    <glyph glyph-name="12" unicode="&#xe012;" horiz-adv-x="600" 
+d="M297 800l303 -300h-200v-500h-200v500h-200z" />
+    <glyph glyph-name="13" unicode="&#xe013;" horiz-adv-x="600" 
+d="M247 800l253 -300h-200v-500h-100v500h-200z" />
+    <glyph glyph-name="14" unicode="&#xe014;" 
+d="M400 800h100v-800h-100v800zM200 700h100v-600h-100v600zM600 600h100v-400h-100v400zM0 500h100v-200h-100v200z" />
+    <glyph glyph-name="15" unicode="&#xe015;" 
+d="M116 600l72 -72c-54 -54 -88 -126 -88 -209s34 -159 88 -213l-72 -72c-72 72 -116 175 -116 285s44 209 116 281zM684 600c72 -72 116 -171 116 -281s-44 -213 -116 -285l-72 72c54 54 88 130 88 213s-34 155 -88 209zM259 460l69 -72c-18 -18 -28 -41 -28 -69
+s10 -54 28 -72l-69 -72c-36 36 -59 89 -59 144s23 105 59 141zM541 459c36 -36 59 -85 59 -140s-23 -108 -59 -144l-69 72c18 18 28 44 28 72s-10 51 -28 69z" />
+    <glyph glyph-name="16" unicode="&#xe016;" horiz-adv-x="400" 
+d="M200 800c110 0 200 -90 200 -200s-90 -200 -200 -200s-200 90 -200 200s90 200 200 200zM100 319c31 -11 65 -19 100 -19s68 8 100 19v-319l-100 100l-100 -100v319z" />
+    <glyph glyph-name="17" unicode="&#xe017;" 
+d="M400 800c220 0 400 -180 400 -400s-180 -400 -400 -400s-400 180 -400 400s180 400 400 400zM400 700c-166 0 -300 -134 -300 -300c0 -66 21 -126 56 -175l419 419c-49 35 -109 56 -175 56zM644 575l-419 -419c49 -35 109 -56 175 -56c166 0 300 134 300 300
+c0 66 -21 126 -56 175z" />
+    <glyph glyph-name="18" unicode="&#xe018;" 
+d="M0 700h100v-600h700v-100h-800v700zM500 700h200v-500h-200v500zM200 500h200v-300h-200v300z" />
+    <glyph glyph-name="19" unicode="&#xe019;" 
+d="M397 800c13 1 23 -4 34 -13c2 -2 214 -254 241 -287h128v-100h-100v-366c0 -18 -16 -34 -34 -34h-532c-18 0 -34 16 -34 34v366h-100v100h128l234 281c9 11 22 18 35 19zM400 672l-144 -172h288zM250 300c-28 0 -50 -22 -50 -50v-100c0 -28 22 -50 50 -50s50 22 50 50
+v100c0 28 -22 50 -50 50zM550 300c-28 0 -50 -22 -50 -50v-100c0 -28 22 -50 50 -50s50 22 50 50v100c0 28 -22 50 -50 50z" />
+    <glyph glyph-name="1a" unicode="&#xe01a;" 
+d="M9 700h682c6 0 9 -4 9 -10v-190h100v-200h-100v-191c0 -6 -3 -9 -9 -9h-682c-6 0 -9 3 -9 9v582c0 6 3 9 9 9zM100 600v-400h500v400h-500z" />
+    <glyph glyph-name="1b" unicode="&#xe01b;" 
+d="M9 700h682c6 0 9 -4 9 -10v-190h100v-200h-100v-191c0 -6 -3 -9 -9 -9h-682c-6 0 -9 3 -9 9v582c0 6 3 9 9 9z" />
+    <glyph glyph-name="1c" unicode="&#xe01c;" 
+d="M92 650c0 23 19 50 45 50h3h5h5h500c28 0 50 -22 50 -50s-22 -50 -50 -50h-50v-141c9 -17 120 -231 166 -309c16 -26 34 -61 34 -106c0 -39 -15 -77 -41 -103h-3c-26 -25 -62 -41 -100 -41h-512c-39 0 -77 15 -103 41s-41 64 -41 103c0 46 18 80 34 106
+c46 78 157 292 166 309v141h-50c-2 0 -6 -1 -8 -1c-28 0 -50 23 -50 51zM500 600h-200v-162l-6 -10s-63 -123 -119 -228h450c-56 105 -119 228 -119 228l-6 10v162z" />
+    <glyph glyph-name="1d" unicode="&#xe01d;" 
+d="M400 800c110 0 200 -90 200 -200c0 -104 52 -198 134 -266c41 -34 66 -82 66 -134h-800c0 52 25 100 66 134c82 68 134 162 134 266c0 110 90 200 200 200zM300 100h200c0 -55 -45 -100 -100 -100s-100 45 -100 100z" />
+    <glyph glyph-name="1e" unicode="&#xe01e;" horiz-adv-x="600" 
+d="M150 800h50l350 -250l-225 -147l225 -153l-350 -250h-50v250l-75 -75l-75 75l150 150l-150 150l75 75l75 -75v250zM250 650v-200l150 100zM250 350v-200l150 100z" />
+    <glyph glyph-name="1f" unicode="&#xe01f;" 
+d="M0 800h500c110 0 200 -90 200 -200c0 -47 -17 -91 -44 -125c85 -40 144 -125 144 -225c0 -138 -112 -250 -250 -250h-550v100c55 0 100 45 100 100v400c0 55 -45 100 -100 100v100zM300 700v-200h100c55 0 100 45 100 100s-45 100 -100 100h-100zM300 400v-300h150
+c83 0 150 67 150 150s-67 150 -150 150h-150z" />
+    <glyph glyph-name="20" unicode="&#xe020;" horiz-adv-x="600" 
+d="M300 800v-300h200l-300 -500v300h-200z" />
+    <glyph glyph-name="21" unicode="&#xe021;" 
+d="M100 800h300v-300l100 100l100 -100v300h50c28 0 50 -22 50 -50v-550h-550c-28 0 -50 -22 -50 -50s22 -50 50 -50h550v-100h-550c-83 0 -150 67 -150 150v550l3 19c8 39 39 70 78 78z" />
+    <glyph glyph-name="22" unicode="&#xe022;" horiz-adv-x="400" 
+d="M0 800h400v-800l-200 200l-200 -200v800z" />
+    <glyph glyph-name="23" unicode="&#xe023;" 
+d="M0 800h800v-100h-800v100zM0 600h300v-103h203v103h297v-591c0 -6 -3 -9 -9 -9h-782c-6 0 -9 3 -9 9v591z" />
+    <glyph glyph-name="24" unicode="&#xe024;" 
+d="M300 800h200c55 0 100 -45 100 -100v-100h191c6 0 9 -3 9 -9v-241c0 -28 -22 -50 -50 -50h-700c-28 0 -50 22 -50 50v241c0 6 3 9 9 9h191v100c0 55 45 100 100 100zM300 700v-100h200v100h-200zM0 209c16 -6 32 -9 50 -9h700c18 0 34 3 50 9v-200c0 -6 -3 -9 -9 -9h-782
+c-6 0 -9 3 -9 9v200z" />
+    <glyph glyph-name="25" unicode="&#xe025;" horiz-adv-x="600" 
+d="M300 800c58 0 110 -16 147 -53s53 -89 53 -147h-100c0 39 -11 61 -25 75s-36 25 -75 25c-35 0 -55 -10 -72 -31s-28 -55 -28 -94c0 -51 20 -107 28 -175h172v-100h-178c-14 -60 -49 -127 -113 -200h491v-100h-600v122l16 12c69 69 95 121 106 166h-122v100h125
+c-8 50 -25 106 -25 175c0 58 16 114 50 156c34 43 88 69 150 69z" />
+    <glyph glyph-name="26" unicode="&#xe026;" 
+d="M34 700h4h3h4h5h700c28 0 50 -22 50 -50v-700c0 -28 -22 -50 -50 -50h-700c-28 0 -50 22 -50 50v700v2c0 20 15 42 34 48zM150 600c-28 0 -50 -22 -50 -50s22 -50 50 -50s50 22 50 50s-22 50 -50 50zM350 600c-28 0 -50 -22 -50 -50s22 -50 50 -50h300c28 0 50 22 50 50
+s-22 50 -50 50h-300zM100 400v-400h600v400h-600z" />
+    <glyph glyph-name="27" unicode="&#xe027;" 
+d="M744 797l6 -3l44 -44c4 -4 3 -8 0 -12l-266 -375l-15 -13l-25 -12c-23 72 -78 127 -150 150l12 25l13 15l375 266zM266 400c74 0 134 -60 134 -134c0 -147 -119 -266 -266 -266c-48 0 -95 12 -134 34c80 46 134 133 134 232c0 74 58 134 132 134z" />
+    <glyph glyph-name="28" unicode="&#xe028;" 
+d="M9 451c0 23 19 50 46 50c8 0 19 -3 26 -7l131 -66l29 22c-79 81 -1 250 118 250s197 -167 119 -250l28 -22l131 66c6 4 12 7 21 7c28 0 50 -22 50 -50c0 -17 -12 -37 -27 -45l-115 -56c9 -16 19 -33 25 -50h68c28 0 50 -22 50 -50s-22 -50 -50 -50h-50
+c0 -23 -2 -45 -6 -66l78 -40c21 -5 37 -28 37 -49c0 -28 -22 -50 -50 -50c-10 0 -23 5 -31 11l-65 35c-24 -46 -62 -86 -103 -110c-35 19 -60 45 -60 72v135v4v5v6v5v5v87c0 28 -22 50 -50 50c-24 0 -45 -17 -50 -40c1 -3 1 -8 1 -11s0 -8 -1 -11v-82v-4v-5v-144
+c0 -28 -24 -53 -59 -72c-41 25 -79 64 -103 110l-66 -35c-8 -6 -21 -11 -31 -11c-28 0 -50 22 -50 50c0 21 16 44 37 49l78 40c-4 21 -6 43 -6 66h-50h-5c-28 0 -50 22 -50 50c0 26 22 50 50 50h5h69c6 17 16 34 25 50l-116 56c-16 7 -28 27 -28 45z" />
+    <glyph glyph-name="29" unicode="&#xe029;" 
+d="M600 700h91c6 0 9 -3 9 -9v-582c0 -6 -3 -9 -9 -9h-91v600zM210 503l290 147v-500l-250 125v-3c-15 0 -25 -8 -28 -22l75 -178c11 -25 0 -58 -25 -69s-58 0 -69 25l-103 272h-91c-6 0 -9 3 -9 9v182c0 6 3 9 9 9h182z" />
+    <glyph glyph-name="2a" unicode="&#xe02a;" 
+d="M9 800h682c6 0 9 -3 9 -9v-782c0 -6 -3 -9 -9 -9h-682c-6 0 -9 3 -9 9v782c0 6 3 9 9 9zM100 700v-200h500v200h-500zM100 400v-100h100v100h-100zM300 400v-100h100v100h-100zM500 400v-300h100v300h-100zM100 200v-100h100v100h-100zM300 200v-100h100v100h-100z" />
+    <glyph glyph-name="2b" unicode="&#xe02b;" 
+d="M0 800h700v-200h-700v200zM0 500h700v-491c0 -6 -3 -9 -9 -9h-682c-6 0 -9 3 -9 9v491zM100 400v-100h100v100h-100zM300 400v-100h100v100h-100zM500 400v-100h100v100h-100zM100 200v-100h100v100h-100zM300 200v-100h100v100h-100z" />
+    <glyph glyph-name="2c" unicode="&#xe02c;" 
+d="M409 800h182c6 0 10 -4 12 -9l94 -182c2 -5 6 -9 12 -9h82c6 0 9 -3 9 -9v-582c0 -6 -3 -9 -9 -9h-782c-6 0 -9 3 -9 9v441c0 83 67 150 150 150h141c6 0 10 4 12 9l94 182c2 5 6 9 12 9zM150 500c-28 0 -50 -22 -50 -50s22 -50 50 -50s50 22 50 50s-22 50 -50 50z
+M500 500c-110 0 -200 -90 -200 -200s90 -200 200 -200s200 90 200 200s-90 200 -200 200zM500 400c55 0 100 -45 100 -100s-45 -100 -100 -100s-100 45 -100 100s45 100 100 100z" />
+    <glyph glyph-name="2d" unicode="&#xe02d;" 
+d="M0 600h800l-400 -400z" />
+    <glyph glyph-name="2e" unicode="&#xe02e;" horiz-adv-x="400" 
+d="M400 800v-800l-400 400z" />
+    <glyph glyph-name="2f" unicode="&#xe02f;" horiz-adv-x="400" 
+d="M0 800l400 -400l-400 -400v800z" />
+    <glyph glyph-name="30" unicode="&#xe030;" 
+d="M400 600l400 -400h-800z" />
+    <glyph glyph-name="31" unicode="&#xe031;" 
+d="M0 550c0 23 20 50 46 50h3h5h4h200c17 0 37 -13 44 -28l38 -72h444c14 0 19 -12 15 -25l-81 -250c-4 -13 -21 -25 -35 -25h-350c-14 0 -30 12 -34 25c-27 83 -54 167 -81 250l-10 25h-150c-2 0 -5 -1 -7 -1c-28 0 -51 23 -51 51zM358 100c28 0 50 -22 50 -50
+s-22 -50 -50 -50s-50 22 -50 50s22 50 50 50zM658 100c28 0 50 -22 50 -50s-22 -50 -50 -50s-50 22 -50 50s22 50 50 50z" />
+    <glyph glyph-name="32" unicode="&#xe032;" 
+d="M0 700h500v-100h-300v-300h-100l-100 -100v500zM300 500h500v-500l-100 100h-400v400z" />
+    <glyph glyph-name="33" unicode="&#xe033;" 
+d="M641 700l143 -141l-493 -493c-71 76 -146 148 -219 222l-72 71l141 141c50 -51 101 -101 153 -150c116 117 234 231 347 350z" />
+    <glyph glyph-name="34" unicode="&#xe034;" 
+d="M150 600l250 -250l250 250l150 -150l-400 -400l-400 400z" />
+    <glyph glyph-name="35" unicode="&#xe035;" horiz-adv-x="600" 
+d="M400 800l150 -150l-250 -250l250 -250l-150 -150l-400 400z" />
+    <glyph glyph-name="36" unicode="&#xe036;" horiz-adv-x="600" 
+d="M150 800l400 -400l-400 -400l-150 150l250 250l-250 250z" />
+    <glyph glyph-name="37" unicode="&#xe037;" 
+d="M400 600l400 -400l-150 -150l-250 250l-250 -250l-150 150z" />
+    <glyph glyph-name="38" unicode="&#xe038;" 
+d="M400 800c221 0 400 -179 400 -400s-179 -400 -400 -400s-400 179 -400 400s179 400 400 400zM600 622l-250 -250l-100 100l-72 -72l172 -172l322 322z" />
+    <glyph glyph-name="39" unicode="&#xe039;" 
+d="M400 800c221 0 400 -179 400 -400s-179 -400 -400 -400s-400 179 -400 400s179 400 400 400zM250 622l-72 -72l150 -150l-150 -150l72 -72l150 150l150 -150l72 72l-150 150l150 150l-72 72l-150 -150z" />
+    <glyph glyph-name="3a" unicode="&#xe03a;" 
+d="M350 800c28 0 50 -22 50 -50v-50h75c14 0 25 -11 25 -25v-75h-300v75c0 14 11 25 25 25h75v50c0 28 22 50 50 50zM25 700h75v-200h500v200h75c14 0 25 -11 25 -25v-650c0 -14 -11 -25 -25 -25h-650c-14 0 -25 11 -25 25v650c0 14 11 25 25 25z" />
+    <glyph glyph-name="3b" unicode="&#xe03b;" 
+d="M400 800c220 0 400 -180 400 -400s-180 -400 -400 -400s-400 180 -400 400s180 400 400 400zM400 700c-166 0 -300 -134 -300 -300s134 -300 300 -300s300 134 300 300s-134 300 -300 300zM350 600h100v-181c23 -24 47 -47 72 -69l-72 -72c-27 30 -55 59 -84 88l-16 12
+v222z" />
+    <glyph glyph-name="3c" unicode="&#xe03c;" 
+d="M450 800c138 0 250 -112 250 -250v-50c58 -21 100 -85 100 -150c0 -18 -3 -34 -9 -50h-191v50c0 83 -67 150 -150 150s-150 -67 -150 -150v-50h-272c-17 30 -28 63 -28 100c0 110 90 200 200 200c23 114 129 200 250 200zM434 400h3h4c3 0 6 1 9 1c28 0 50 -22 50 -50v-1
+v-150h150l-200 -200l-200 200h150v150v2c0 20 15 42 34 48z" />
+    <glyph glyph-name="3d" unicode="&#xe03d;" 
+d="M450 800c138 0 250 -112 250 -250v-50c58 -21 100 -85 100 -150c0 -18 -3 -34 -9 -50h-141l-200 200l-200 -200h-222c-17 30 -28 63 -28 100c0 110 90 200 200 200c23 114 129 200 250 200zM450 350l250 -250h-200v-50c0 -28 -22 -50 -50 -50s-50 22 -50 50v50h-200z" />
+    <glyph glyph-name="3e" unicode="&#xe03e;" 
+d="M450 700c138 0 250 -112 250 -250v-50c58 -21 100 -85 100 -150c0 -83 -67 -150 -150 -150h-450c-110 0 -200 90 -200 200s90 200 200 200c23 114 129 200 250 200z" />
+    <glyph glyph-name="3f" unicode="&#xe03f;" 
+d="M250 800c82 0 154 -40 200 -100c-143 0 -270 -85 -325 -209c-36 -10 -70 -25 -100 -47c-16 33 -25 67 -25 106c0 138 112 250 250 250zM450 600c138 0 250 -112 250 -250v-50c58 -21 100 -85 100 -150c0 -83 -67 -150 -150 -150h-450c-110 0 -200 90 -200 200
+s90 200 200 200c23 114 129 200 250 200z" />
+    <glyph glyph-name="40" unicode="&#xe040;" 
+d="M500 700h100l-300 -600h-100zM100 600h100l-100 -200l100 -200h-100l-100 200zM600 600h100l100 -200l-100 -200h-100l100 200z" />
+    <glyph glyph-name="41" unicode="&#xe041;" 
+d="M350 800h100l50 -119l28 -12l119 50l72 -72l-50 -119l12 -28l119 -50v-100l-119 -50l-12 -28l50 -119l-72 -72l-119 50l-28 -12l-50 -119h-100l-50 119l-28 12l-119 -50l-72 72l50 119l-12 28l-119 50v100l119 50l12 28l-50 119l72 72l119 -50l28 12zM400 550
+c-83 0 -150 -67 -150 -150s67 -150 150 -150s150 67 150 150s-67 150 -150 150z" />
+    <glyph glyph-name="42" unicode="&#xe042;" 
+d="M0 800h800v-200h-800v200zM200 500h400l-200 -200zM0 100h800v-100h-800v100z" />
+    <glyph glyph-name="43" unicode="&#xe043;" 
+d="M0 800h100v-800h-100v800zM600 800h200v-800h-200v800zM500 600v-400l-200 200z" />
+    <glyph glyph-name="44" unicode="&#xe044;" 
+d="M0 800h200v-800h-200v800zM700 800h100v-800h-100v800zM300 600l200 -200l-200 -200v400z" />
+    <glyph glyph-name="45" unicode="&#xe045;" 
+d="M0 800h800v-100h-800v100zM400 500l200 -200h-400zM0 200h800v-200h-800v200z" />
+    <glyph glyph-name="46" unicode="&#xe046;" 
+d="M150 700c83 0 150 -67 150 -150v-50h100v50c0 83 67 150 150 150s150 -67 150 -150s-67 -150 -150 -150h-50v-100h50c83 0 150 -67 150 -150s-67 -150 -150 -150s-150 67 -150 150v50h-100v-50c0 -83 -67 -150 -150 -150s-150 67 -150 150s67 150 150 150h50v100h-50
+c-83 0 -150 67 -150 150s67 150 150 150zM150 600c-28 0 -50 -22 -50 -50s22 -50 50 -50h50v50c0 28 -22 50 -50 50zM550 600c-28 0 -50 -22 -50 -50v-50h50c28 0 50 22 50 50s-22 50 -50 50zM300 400v-100h100v100h-100zM150 200c-28 0 -50 -22 -50 -50s22 -50 50 -50
+s50 22 50 50v50h-50zM500 200v-50c0 -28 22 -50 50 -50s50 22 50 50s-22 50 -50 50h-50z" />
+    <glyph glyph-name="47" unicode="&#xe047;" 
+d="M0 791c0 5 4 9 9 9h782c6 0 9 -4 9 -10v-790l-200 200h-591c-6 0 -9 3 -9 9v582z" />
+    <glyph glyph-name="48" unicode="&#xe048;" 
+d="M400 800c220 0 400 -180 400 -400s-180 -400 -400 -400s-400 180 -400 400s180 400 400 400zM400 700c-166 0 -300 -134 -300 -300s134 -300 300 -300s300 134 300 300s-134 300 -300 300zM600 600l-100 -300l-300 -100l100 300zM400 450c-28 0 -50 -22 -50 -50
+s22 -50 50 -50s50 22 50 50s-22 50 -50 50z" />
+    <glyph glyph-name="49" unicode="&#xe049;" 
+d="M400 800c220 0 400 -180 400 -400s-180 -400 -400 -400s-400 180 -400 400s180 400 400 400zM400 700v-600c166 0 300 134 300 300s-134 300 -300 300z" />
+    <glyph glyph-name="4a" unicode="&#xe04a;" 
+d="M0 800h800v-100h-800v100zM0 600h500v-100h-500v100zM0 300h800v-100h-800v100zM0 100h600v-100h-600v100zM750 100c28 0 50 -22 50 -50s-22 -50 -50 -50s-50 22 -50 50s22 50 50 50z" />
+    <glyph glyph-name="4b" unicode="&#xe04b;" 
+d="M25 700h750c14 0 25 -11 25 -25v-75h-800v75c0 14 11 25 25 25zM0 500h800v-375c0 -14 -11 -25 -25 -25h-750c-14 0 -25 11 -25 25v375zM100 300v-100h100v100h-100zM300 300v-100h100v100h-100z" />
+    <glyph glyph-name="4c" unicode="&#xe04c;" 
+d="M100 800h100v-100h450l100 100l50 -50l-100 -100v-450h100v-100h-100v-100h-100v100h-500v500h-100v100h100v100zM200 600v-350l350 350h-350zM600 550l-350 -350h350v350z" />
+    <glyph glyph-name="4d" unicode="&#xe04d;" 
+d="M400 800c220 0 400 -180 400 -400s-180 -400 -400 -400s-400 180 -400 400s180 400 400 400zM400 700c-166 0 -300 -134 -300 -300s134 -300 300 -300s300 134 300 300s-134 300 -300 300zM400 600c28 0 50 -22 50 -50s-22 -50 -50 -50s-50 22 -50 50s22 50 50 50z
+M200 452c0 20 15 42 34 48h3h3h8c12 0 28 -7 36 -16l91 -90l25 6c55 0 100 -45 100 -100s-45 -100 -100 -100s-100 45 -100 100l6 25l-90 91c-9 8 -16 24 -16 36zM550 500c28 0 50 -22 50 -50s-22 -50 -50 -50s-50 22 -50 50s22 50 50 50z" />
+    <glyph glyph-name="4e" unicode="&#xe04e;" 
+d="M300 800h200v-300h200l-300 -300l-300 300h200v300zM0 100h800v-100h-800v100z" />
+    <glyph glyph-name="4f" unicode="&#xe04f;" 
+d="M0 800h800v-100h-800v100zM400 600l300 -300h-200v-300h-200v300h-200z" />
+    <glyph glyph-name="50" unicode="&#xe050;" 
+d="M200 700h600v-600h-600l-200 300zM350 622l-72 -72l150 -150l-150 -150l72 -72l150 150l150 -150l72 72l-150 150l150 150l-72 72l-150 -150z" />
+    <glyph glyph-name="51" unicode="&#xe051;" 
+d="M400 700c220 0 400 -180 400 -400h-100c0 166 -134 300 -300 300s-300 -134 -300 -300h-100c0 220 180 400 400 400zM341 491l59 -88l59 88c81 -25 141 -101 141 -191c0 -110 -90 -200 -200 -200s-200 90 -200 200c0 90 60 166 141 191z" />
+    <glyph glyph-name="52" unicode="&#xe052;" 
+d="M0 800h300v-400h400v-400h-700v800zM400 800l300 -300h-300v300zM100 600v-100h100v100h-100zM100 400v-100h100v100h-100zM100 200v-100h400v100h-400z" />
+    <glyph glyph-name="53" unicode="&#xe053;" horiz-adv-x="600" 
+d="M200 700h100v-100h75c30 0 58 -6 81 -22s44 -44 44 -78v-100h-100v94c-4 3 -13 6 -25 6h-250c-14 0 -25 -11 -25 -25v-50c0 -15 20 -40 34 -44l257 -65c66 -16 109 -73 109 -141v-50c0 -68 -57 -125 -125 -125h-75v-100h-100v100h-75c-30 0 -58 6 -81 22s-44 44 -44 78
+v100h100v-94c4 -3 13 -6 25 -6h250c14 0 25 11 25 25v50c0 15 -20 40 -34 44l-257 65c-66 16 -109 73 -109 141v50c0 68 57 125 125 125h75v100z" />
+    <glyph glyph-name="54" unicode="&#xe054;" 
+d="M0 700h300v-300l-300 -300v600zM500 700h300v-300l-300 -300v600z" />
+    <glyph glyph-name="55" unicode="&#xe055;" 
+d="M300 700v-600h-300v300zM800 700v-600h-300v300z" />
+    <glyph glyph-name="56" unicode="&#xe056;" 
+d="M300 700v-100c-111 0 -200 -89 -200 -200h200v-300h-300v300c0 165 135 300 300 300zM800 700v-100c-111 0 -200 -89 -200 -200h200v-300h-300v300c0 165 135 300 300 300z" />
+    <glyph glyph-name="57" unicode="&#xe057;" 
+d="M0 700h300v-300c0 -165 -135 -300 -300 -300v100c111 0 200 89 200 200h-200v300zM500 700h300v-300c0 -165 -135 -300 -300 -300v100c111 0 200 89 200 200h-200v300z" />
+    <glyph glyph-name="58" unicode="&#xe058;" horiz-adv-x="600" 
+d="M300 800l34 -34c11 -11 266 -270 266 -488c0 -165 -135 -300 -300 -300s-300 135 -300 300c0 218 255 477 266 488zM150 328c-28 0 -50 -22 -50 -50c0 -110 90 -200 200 -200c28 0 50 22 50 50s-22 50 -50 50c-55 0 -100 45 -100 100c0 28 -22 50 -50 50z" />
+    <glyph glyph-name="59" unicode="&#xe059;" 
+d="M400 800l400 -500h-800zM0 200h800v-200h-800v200z" />
+    <glyph glyph-name="5a" unicode="&#xe05a;" horiz-adv-x="600" 
+d="M300 800l300 -300h-600zM0 300h600l-300 -300z" />
+    <glyph glyph-name="5b" unicode="&#xe05b;" 
+d="M0 500h200v-200h-200v200zM300 500h200v-200h-200v200zM600 500h200v-200h-200v200z" />
+    <glyph glyph-name="5c" unicode="&#xe05c;" 
+d="M0 700h800v-100l-400 -200l-400 200v100zM0 500l400 -200l400 200v-400h-800v400z" />
+    <glyph glyph-name="5d" unicode="&#xe05d;" 
+d="M400 800l400 -200v-600h-800v600zM400 688l-300 -150v-188l300 -150l300 150v188zM200 500h400v-100l-200 -100l-200 100v100z" />
+    <glyph glyph-name="5e" unicode="&#xe05e;" 
+d="M600 700c69 0 134 -19 191 -50l-16 -106c-49 35 -109 56 -175 56c-131 0 -240 -84 -281 -200h331l-16 -100h-334c0 -36 8 -68 19 -100h297l-16 -100h-222c55 -61 133 -100 222 -100c78 0 147 30 200 78v-122c-59 -35 -127 -56 -200 -56c-147 0 -274 82 -344 200h-256
+l19 100h197c-8 32 -16 66 -16 100h-200l25 100h191c45 172 198 300 384 300z" />
+    <glyph glyph-name="5f" unicode="&#xe05f;" 
+d="M0 700h700v-100h-700v100zM0 500h500v-100h-500v100zM0 300h800v-100h-800v100zM0 100h100v-100h-100v100zM200 100h100v-100h-100v100zM400 100h100v-100h-100v100z" />
+    <glyph glyph-name="60" unicode="&#xe060;" 
+d="M0 800h800v-100h-800v100zM200 600h400l-200 -200zM0 200h800v-200h-800v200z" />
+    <glyph glyph-name="61" unicode="&#xe061;" 
+d="M0 800h100v-800h-100v800zM600 800h200v-800h-200v800zM200 600l200 -200l-200 -200v400z" />
+    <glyph glyph-name="62" unicode="&#xe062;" 
+d="M0 800h200v-800h-200v800zM700 800h100v-800h-100v800zM600 600v-400l-200 200z" />
+    <glyph glyph-name="63" unicode="&#xe063;" 
+d="M0 800h800v-200h-800v200zM400 400l200 -200h-400zM0 100h800v-100h-800v100z" />
+    <glyph glyph-name="64" unicode="&#xe064;" 
+d="M0 800h200v-100h-100v-600h600v100h100v-200h-800v800zM400 800h400v-400l-150 150l-250 -250l-100 100l250 250z" />
+    <glyph glyph-name="65" unicode="&#xe065;" 
+d="M403 700c247 0 397 -300 397 -300s-150 -300 -397 -300c-253 0 -403 300 -403 300s150 300 403 300zM400 600c-110 0 -200 -90 -200 -200s90 -200 200 -200s200 90 200 200s-90 200 -200 200zM400 500c10 0 19 -3 28 -6c-16 -8 -28 -24 -28 -44c0 -28 22 -50 50 -50
+c20 0 36 12 44 28c3 -9 6 -18 6 -28c0 -55 -45 -100 -100 -100s-100 45 -100 100s45 100 100 100z" />
+    <glyph glyph-name="66" unicode="&#xe066;" horiz-adv-x="900" 
+d="M331 700h3h3c3 1 7 1 10 1c12 0 29 -8 37 -17l94 -93l66 65c57 57 155 57 212 0c58 -58 58 -154 0 -212l-65 -66l93 -94c10 -8 18 -25 18 -38c0 -28 -22 -50 -50 -50c-13 0 -32 9 -40 20l-62 65l-381 -381h-269v272l375 381l-63 63c-9 8 -16 24 -16 36c0 20 16 42 35 48z
+M447 481l-313 -315l128 -132l316 316z" />
+    <glyph glyph-name="67" unicode="&#xe067;" 
+d="M0 800h300v-400h400v-400h-700v800zM400 800l300 -300h-300v300z" />
+    <glyph glyph-name="68" unicode="&#xe068;" 
+d="M200 800c0 0 200 -100 200 -300s-298 -302 -200 -500c0 0 -200 100 -200 300s300 300 200 500zM500 500c0 0 200 -100 200 -300c0 -150 -60 -200 -100 -200h-300c0 200 300 300 200 500z" />
+    <glyph glyph-name="69" unicode="&#xe069;" 
+d="M0 800h100v-800h-100v800zM200 800h300v-100h300l-200 -203l200 -197h-400v100h-200v400z" />
+    <glyph glyph-name="6a" unicode="&#xe06a;" horiz-adv-x="400" 
+d="M150 800h150l-100 -200h200l-150 -300h150l-300 -300l-100 300h134l66 200h-200z" />
+    <glyph glyph-name="6b" unicode="&#xe06b;" 
+d="M0 800h300v-100h500v-100h-800v200zM0 500h800v-450c0 -28 -22 -50 -50 -50h-700c-28 0 -50 22 -50 50v450z" />
+    <glyph glyph-name="6c" unicode="&#xe06c;" 
+d="M150 800c83 0 150 -67 150 -150c0 -66 -41 -121 -100 -141v-118c15 5 33 9 50 9h200c28 0 50 22 50 50v59c-59 20 -100 75 -100 141c0 83 67 150 150 150s150 -67 150 -150c0 -66 -41 -121 -100 -141v-59c0 -82 -68 -150 -150 -150h-200c-14 0 -25 -7 -34 -16
+c50 -24 84 -74 84 -134c0 -83 -67 -150 -150 -150s-150 67 -150 150c0 66 41 121 100 141v218c-59 20 -100 75 -100 141c0 83 67 150 150 150z" />
+    <glyph glyph-name="6d" unicode="&#xe06d;" 
+d="M0 800h400l-150 -150l150 -150l-100 -100l-150 150l-150 -150v400zM500 400l150 -150l150 150v-400h-400l150 150l-150 150z" />
+    <glyph glyph-name="6e" unicode="&#xe06e;" 
+d="M100 800l150 -150l150 150v-400h-400l150 150l-150 150zM400 400h400l-150 -150l150 -150l-100 -100l-150 150l-150 -150v400z" />
+    <glyph glyph-name="6f" unicode="&#xe06f;" 
+d="M400 800c221 0 400 -179 400 -400s-179 -400 -400 -400s-400 179 -400 400s179 400 400 400zM400 700c-56 0 -108 -17 -153 -44l22 -19c33 -18 13 -48 -13 -59c-30 -13 -77 10 -65 -41c13 -55 -27 -3 -47 -15c-42 -26 49 -152 31 -156l-59 34c-8 0 -13 -5 -16 -10
+c1 -30 10 -57 19 -84c28 -11 77 -2 100 -25c47 -28 97 -115 75 -159c34 -13 68 -22 106 -22c101 0 193 48 247 125c3 24 -8 44 -50 44c-69 0 -156 13 -153 97c2 46 101 108 66 143c-30 30 12 39 12 66c0 37 -65 32 -69 50s20 36 41 56c-30 10 -60 19 -94 19zM631 591
+c-38 -11 -94 -35 -87 -53c6 -15 52 -1 65 -13c11 -10 16 -59 44 -31l22 22v3c-11 26 -26 50 -44 72z" />
+    <glyph glyph-name="70" unicode="&#xe070;" 
+d="M703 800l97 -100l-400 -400l-100 100l-200 -203l-100 100l300 303l100 -100zM0 100h800v-100h-800v100z" />
+    <glyph glyph-name="71" unicode="&#xe071;" 
+d="M0 700h100v-100h-100v100zM200 700h100v-100h-100v100zM400 700h100v-100h-100v100zM600 700h100v-100h-100v100zM0 500h100v-100h-100v100zM200 500h100v-100h-100v100zM400 500h100v-100h-100v100zM600 500h100v-100h-100v100zM0 300h100v-100h-100v100zM200 300h100
+v-100h-100v100zM400 300h100v-100h-100v100zM600 300h100v-100h-100v100zM0 100h100v-100h-100v100zM200 100h100v-100h-100v100zM400 100h100v-100h-100v100zM600 100h100v-100h-100v100z" />
+    <glyph glyph-name="72" unicode="&#xe072;" 
+d="M0 800h200v-200h-200v200zM300 800h200v-200h-200v200zM600 800h200v-200h-200v200zM0 500h200v-200h-200v200zM300 500h200v-200h-200v200zM600 500h200v-200h-200v200zM0 200h200v-200h-200v200zM300 200h200v-200h-200v200zM600 200h200v-200h-200v200z" />
+    <glyph glyph-name="73" unicode="&#xe073;" 
+d="M0 800h300v-300h-300v300zM500 800h300v-300h-300v300zM0 300h300v-300h-300v300zM500 300h300v-300h-300v300z" />
+    <glyph glyph-name="74" unicode="&#xe074;" 
+d="M19 800h662c11 0 19 -8 19 -19v-331c0 -28 -22 -50 -50 -50h-600c-28 0 -50 22 -50 50v331c0 11 8 19 19 19zM0 309c16 -6 32 -9 50 -9h600c18 0 34 3 50 9v-290c0 -11 -8 -19 -19 -19h-662c-11 0 -19 8 -19 19v290zM550 200c-28 0 -50 -22 -50 -50s22 -50 50 -50
+s50 22 50 50s-22 50 -50 50z" />
+    <glyph glyph-name="75" unicode="&#xe075;" 
+d="M0 700h300v-100h-50c-28 0 -50 -22 -50 -50v-150h300v150c0 28 -22 50 -50 50h-50v100h300v-100h-50c-28 0 -50 -22 -50 -50v-400c0 -28 22 -50 50 -50h50v-100h-300v100h50c28 0 50 22 50 50v150h-300v-150c0 -28 22 -50 50 -50h50v-100h-300v100h50c28 0 50 22 50 50
+v400c0 28 -22 50 -50 50h-50v100z" />
+    <glyph glyph-name="76" unicode="&#xe076;" 
+d="M400 700c165 0 300 -135 300 -300v-100h50c28 0 50 -22 50 -50v-200c0 -28 -22 -50 -50 -50h-100c-28 0 -50 22 -50 50v350c0 111 -89 200 -200 200s-200 -89 -200 -200v-350c0 -28 -22 -50 -50 -50h-100c-28 0 -50 22 -50 50v200c0 28 22 50 50 50h50v100
+c0 165 135 300 300 300z" />
+    <glyph glyph-name="77" unicode="&#xe077;" 
+d="M0 500c0 109 91 200 200 200s200 -91 200 -200c0 109 91 200 200 200s200 -91 200 -200c0 -55 -23 -105 -59 -141l-341 -340l-341 340c-36 36 -59 86 -59 141z" />
+    <glyph glyph-name="78" unicode="&#xe078;" 
+d="M400 700l400 -300l-100 3v-403h-200v200h-200v-200h-200v400h-100z" />
+    <glyph glyph-name="79" unicode="&#xe079;" 
+d="M0 800h800v-800h-800v800zM100 700v-300l100 100l400 -400h100v100l-200 200l100 100l100 -100v300h-600z" />
+    <glyph glyph-name="7a" unicode="&#xe07a;" 
+d="M19 800h762c11 0 19 -8 19 -19v-762c0 -11 -8 -19 -19 -19h-762c-11 0 -19 8 -19 19v762c0 11 8 19 19 19zM100 600v-300h100l100 -100h200l100 100h100v300h-600z" />
+    <glyph glyph-name="7b" unicode="&#xe07b;" 
+d="M200 600c80 0 142 -56 200 -122c58 66 119 122 200 122c131 0 200 -101 200 -200s-69 -200 -200 -200c-81 0 -142 56 -200 122c-58 -66 -121 -122 -200 -122c-131 0 -200 101 -200 200s69 200 200 200zM200 500c-74 0 -100 -54 -100 -100s26 -100 100 -100
+c42 0 88 47 134 100c-46 53 -92 100 -134 100zM600 500c-43 0 -88 -47 -134 -100c46 -53 91 -100 134 -100c74 0 100 54 100 100s-26 100 -100 100z" />
+    <glyph glyph-name="7c" unicode="&#xe07c;" horiz-adv-x="400" 
+d="M300 800c55 0 100 -45 100 -100s-45 -100 -100 -100s-100 45 -100 100s45 100 100 100zM150 550c83 0 150 -69 150 -150c0 -66 -100 -214 -100 -250c0 -28 22 -50 50 -50s50 22 50 50h100c0 -83 -67 -150 -150 -150s-150 64 -150 150s100 222 100 250s-22 50 -50 50
+s-50 -22 -50 -50h-100c0 83 67 150 150 150z" />
+    <glyph glyph-name="7d" unicode="&#xe07d;" 
+d="M200 800h500v-100h-122c-77 -197 -156 -392 -234 -588l-6 -12h162v-100h-500v100h122c77 197 156 392 234 588l7 12h-163v100z" />
+    <glyph glyph-name="7e" unicode="&#xe07e;" 
+d="M0 700h800v-100h-800v100zM0 500h800v-100h-800v100zM0 300h800v-100h-800v100zM100 100h600v-100h-600v100z" />
+    <glyph glyph-name="7f" unicode="&#xe07f;" 
+d="M0 700h800v-100h-800v100zM0 500h800v-100h-800v100zM0 300h800v-100h-800v100zM0 100h600v-100h-600v100z" />
+    <glyph glyph-name="80" unicode="&#xe080;" 
+d="M0 700h800v-100h-800v100zM0 500h800v-100h-800v100zM0 300h800v-100h-800v100zM200 100h600v-100h-600v100z" />
+    <glyph glyph-name="81" unicode="&#xe081;" 
+d="M550 800c138 0 250 -112 250 -250s-112 -250 -250 -250c-16 0 -32 0 -47 3l-3 -3v-100h-200v-200h-300v200l303 303c-3 15 -3 31 -3 47c0 138 112 250 250 250zM600 700c-55 0 -100 -45 -100 -100s45 -100 100 -100s100 45 100 100s-45 100 -100 100z" />
+    <glyph glyph-name="82" unicode="&#xe082;" 
+d="M134 600h3h4h4h5h500c28 0 50 -22 50 -50v-350h100v-150c0 -28 -22 -50 -50 -50h-700c-28 0 -50 22 -50 50v150h100v350v2c0 20 15 42 34 48zM200 500v-300h100v-100h200v100h100v300h-400z" />
+    <glyph glyph-name="83" unicode="&#xe083;" 
+d="M0 800h400v-400h-400v400zM500 600h100v-400h-400v100h300v300zM700 400h100v-400h-400v100h300v300z" />
+    <glyph glyph-name="84" unicode="&#xe084;" horiz-adv-x="600" 
+d="M337 694c6 4 12 7 21 7c28 0 50 -22 50 -50c0 -17 -12 -37 -27 -45l-300 -150c-8 -6 -21 -11 -31 -11c-28 0 -50 22 -50 50c0 21 16 44 37 49zM437 544c6 4 12 7 21 7c28 0 50 -22 50 -50c0 -17 -12 -37 -27 -45l-400 -200c-8 -6 -21 -11 -31 -11c-28 0 -50 22 -50 50
+c0 21 16 44 37 49zM437 344c6 4 12 7 21 7c28 0 50 -22 50 -50c0 -17 -12 -37 -27 -45l-106 -56c24 -4 43 -26 43 -50c0 -28 -23 -51 -51 -51c-2 0 -6 1 -8 1h-200c-26 1 -48 24 -48 50c0 16 12 36 26 44zM151 -50c0 23 20 50 46 50h3h4h5h100c28 0 50 -22 50 -50
+s-22 -50 -50 -50h-100c-2 0 -6 -1 -8 -1c-28 0 -50 23 -50 51z" />
+    <glyph glyph-name="85" unicode="&#xe085;" 
+d="M199 800h100v-200h-200v100h100v100zM586 797h1c18 1 38 1 56 -3c36 -8 69 -26 97 -54c78 -78 78 -203 0 -281l-150 -150c-8 -13 -28 -24 -43 -24c-28 0 -50 22 -50 50c0 15 11 35 24 43l150 150c40 40 39 105 0 144c-41 41 -110 34 -144 0l-44 -44
+c-8 -13 -27 -24 -42 -24c-28 0 -50 22 -50 50c0 15 11 35 24 43l43 44c32 33 72 53 128 56zM208 490c4 5 14 16 22 16h3c2 0 6 1 8 1c28 0 50 -22 50 -50c0 -11 -6 -27 -14 -35l-150 -150c-40 -40 -39 -105 0 -144c41 -41 110 -34 144 0l44 44c8 13 27 24 42 24
+c28 0 50 -22 50 -50c0 -15 -11 -35 -24 -43l-43 -44c-22 -22 -48 -37 -75 -47c-70 -25 -151 -9 -207 47c-78 78 -78 203 0 281zM499 200h200v-100h-100v-100h-100v200z" />
+    <glyph glyph-name="86" unicode="&#xe086;" 
+d="M586 797c18 1 39 1 57 -3c36 -8 69 -26 97 -54c78 -78 78 -203 0 -281l-150 -150c-62 -62 -132 -81 -182 -78s-69 17 -84 25s-26 27 -26 44c0 28 22 51 50 51c8 0 19 -3 26 -7c0 0 15 -11 41 -13s62 3 106 47l150 150c40 40 39 105 0 144c-41 41 -110 34 -144 0
+c-8 -13 -28 -24 -43 -24c-28 0 -50 22 -50 50c0 15 11 35 24 43c32 33 72 53 128 56zM386 566c50 -2 64 -17 85 -22s37 -28 37 -49c0 -28 -22 -50 -50 -50c-10 0 -23 5 -31 11c0 0 -19 9 -47 10s-63 -4 -103 -44l-150 -150c-40 -40 -39 -105 0 -144c41 -41 110 -34 144 0
+c8 13 27 24 42 24c28 0 50 -22 50 -50c0 -15 -10 -35 -23 -43c-22 -22 -48 -37 -75 -47c-70 -25 -151 -9 -207 47c-78 78 -78 203 0 281l150 150c60 60 128 78 178 76z" />
+    <glyph glyph-name="87" unicode="&#xe087;" 
+d="M0 700h300v-300h-300v300zM400 700h400v-100h-400v100zM400 500h300v-100h-300v100zM0 300h300v-300h-300v300zM400 300h400v-100h-400v100zM400 100h300v-100h-300v100z" />
+    <glyph glyph-name="88" unicode="&#xe088;" 
+d="M50 700c28 0 50 -22 50 -50s-22 -50 -50 -50s-50 22 -50 50s22 50 50 50zM200 700h600v-100h-600v100zM50 500c28 0 50 -22 50 -50s-22 -50 -50 -50s-50 22 -50 50s22 50 50 50zM200 500h600v-100h-600v100zM50 300c28 0 50 -22 50 -50s-22 -50 -50 -50s-50 22 -50 50
+s22 50 50 50zM200 300h600v-100h-600v100zM50 100c28 0 50 -22 50 -50s-22 -50 -50 -50s-50 22 -50 50s22 50 50 50zM200 100h600v-100h-600v100z" />
+    <glyph glyph-name="89" unicode="&#xe089;" 
+d="M800 800l-400 -800l-100 300l-300 100z" />
+    <glyph glyph-name="8a" unicode="&#xe08a;" horiz-adv-x="600" 
+d="M300 700c110 0 200 -90 200 -200v-100h100v-400h-600v400h100v100c0 110 90 200 200 200zM300 600c-56 0 -100 -44 -100 -100v-100h200v100c0 56 -44 100 -100 100z" />
+    <glyph glyph-name="8b" unicode="&#xe08b;" horiz-adv-x="600" 
+d="M300 800c110 0 200 -90 200 -200v-200h100v-400h-600v400h400v200c0 56 -44 100 -100 100s-100 -44 -100 -100h-100c0 110 90 200 200 200z" />
+    <glyph glyph-name="8c" unicode="&#xe08c;" 
+d="M400 700v-100c-111 0 -200 -89 -200 -200h100l-150 -200l-150 200h100c0 165 135 300 300 300zM650 600l150 -200h-100c0 -165 -135 -300 -300 -300v100c111 0 200 89 200 200h-100z" />
+    <glyph glyph-name="8d" unicode="&#xe08d;" 
+d="M100 800h600v-300h100l-150 -250l-150 250h100v200h-400v-100h-100v200zM150 550l150 -250h-100v-200h400v100h100v-200h-600v300h-100z" />
+    <glyph glyph-name="8e" unicode="&#xe08e;" 
+d="M600 700l200 -150l-200 -150v100h-500v-100h-100v100c0 55 45 100 100 100h500v100zM200 300v-100h500v100h100v-100c0 -55 -45 -100 -100 -100h-500v-100l-200 150z" />
+    <glyph glyph-name="8f" unicode="&#xe08f;" horiz-adv-x="900" 
+d="M350 800c193 0 350 -157 350 -350c0 -60 -17 -117 -44 -166c5 -3 12 -8 16 -12l100 -100c16 -16 30 -49 30 -72c0 -56 -46 -102 -102 -102c-23 0 -56 14 -72 30l-100 100c-4 3 -9 9 -12 13c-49 -26 -107 -41 -166 -41c-193 0 -350 157 -350 350s157 350 350 350zM350 200
+c142 0 250 108 250 250c0 139 -111 250 -250 250s-250 -111 -250 -250s111 -250 250 -250z" />
+    <glyph glyph-name="90" unicode="&#xe090;" horiz-adv-x="600" 
+d="M300 800c166 0 300 -134 300 -300c0 -200 -300 -500 -300 -500s-300 300 -300 500c0 166 134 300 300 300zM300 700c-110 0 -200 -90 -200 -200s90 -200 200 -200s200 90 200 200s-90 200 -200 200z" />
+    <glyph glyph-name="91" unicode="&#xe091;" horiz-adv-x="900" 
+d="M0 800h800v-541c1 -3 1 -8 1 -11s0 -7 -1 -10v-238h-800v800zM495 250c0 26 22 50 50 50h5h150v400h-600v-600h600v100h-150h-5c-28 0 -50 22 -50 50zM350 600c83 0 150 -67 150 -150c0 -100 -150 -250 -150 -250s-150 150 -150 250c0 83 67 150 150 150zM350 500
+c-28 0 -50 -22 -50 -50s22 -50 50 -50s50 22 50 50s-22 50 -50 50z" />
+    <glyph glyph-name="92" unicode="&#xe092;" horiz-adv-x="600" 
+d="M0 700h200v-600h-200v600zM400 700h200v-600h-200v600z" />
+    <glyph glyph-name="93" unicode="&#xe093;" horiz-adv-x="600" 
+d="M0 700l600 -300l-600 -300v600z" />
+    <glyph glyph-name="94" unicode="&#xe094;" horiz-adv-x="600" 
+d="M300 700c166 0 300 -134 300 -300s-134 -300 -300 -300s-300 134 -300 300s134 300 300 300z" />
+    <glyph glyph-name="95" unicode="&#xe095;" 
+d="M400 700v-600l-400 300zM400 400l400 300v-600z" />
+    <glyph glyph-name="96" unicode="&#xe096;" 
+d="M0 700l400 -300l-400 -300v600zM400 100v600l400 -300z" />
+    <glyph glyph-name="97" unicode="&#xe097;" 
+d="M0 700h200v-600h-200v600zM200 400l500 300v-600z" />
+    <glyph glyph-name="98" unicode="&#xe098;" 
+d="M0 700l500 -300l-500 -300v600zM500 100v600h200v-600h-200z" />
+    <glyph glyph-name="99" unicode="&#xe099;" horiz-adv-x="600" 
+d="M0 700h600v-600h-600v600z" />
+    <glyph glyph-name="9a" unicode="&#xe09a;" 
+d="M200 800h400v-200h200v-400h-200v-200h-400v200h-200v400h200v200z" />
+    <glyph glyph-name="9b" unicode="&#xe09b;" 
+d="M0 700h800v-100h-800v100zM0 403h800v-100h-800v100zM0 103h800v-100h-800v100z" />
+    <glyph glyph-name="9c" unicode="&#xe09c;" horiz-adv-x="600" 
+d="M278 700c7 2 13 4 22 4c55 0 100 -45 100 -100v-4v-200c0 -55 -45 -100 -100 -100s-100 45 -100 100v200v2c0 44 35 88 78 98zM34 500h4h3c3 0 6 1 9 1c28 0 50 -22 50 -50v-1v-50c0 -111 89 -200 200 -200s200 89 200 200v50c0 28 22 50 50 50s50 -22 50 -50v-50
+c0 -148 -109 -270 -250 -294v-106h50c55 0 100 -45 100 -100h-400c0 55 45 100 100 100h50v106c-141 24 -250 146 -250 294v50v2c0 20 15 42 34 48z" />
+    <glyph glyph-name="9d" unicode="&#xe09d;" 
+d="M0 500h800v-200h-800v200z" />
+    <glyph glyph-name="9e" unicode="&#xe09e;" 
+d="M34 700h4h3h4h5h700c28 0 50 -22 50 -50v-500c0 -28 -22 -50 -50 -50h-250v-100h100c55 0 100 -45 100 -100h-600c0 55 45 100 100 100h100v100h-250c-28 0 -50 22 -50 50v500v2c0 20 15 42 34 48zM100 600v-400h600v400h-600z" />
+    <glyph glyph-name="9f" unicode="&#xe09f;" 
+d="M272 700c-14 -40 -22 -83 -22 -128c0 -221 179 -400 400 -400c45 0 88 8 128 22c-53 -158 -202 -272 -378 -272c-221 0 -400 179 -400 400c0 176 114 325 272 378z" />
+    <glyph glyph-name="a0" unicode="&#xe0a0;" 
+d="M350 700l150 -150h-100v-150h150v100l150 -150l-150 -150v100h-150v-150h100l-150 -150l-150 150h100v150h-150v-100l-150 150l150 150v-100h150v150h-100z" />
+    <glyph glyph-name="a1" unicode="&#xe0a1;" 
+d="M800 800v-550c0 -83 -67 -150 -150 -150s-150 67 -150 150s67 150 150 150c17 0 35 -4 50 -9v206c-201 -6 -327 -27 -400 -50v-397c0 -83 -67 -150 -150 -150s-150 67 -150 150s67 150 150 150c17 0 35 -4 50 -9v409s100 100 600 100z" />
+    <glyph glyph-name="a2" unicode="&#xe0a2;" horiz-adv-x="700" 
+d="M499 700c51 0 102 -20 141 -59c78 -78 78 -203 0 -281l-250 -244c-48 -48 -127 -48 -175 0s-48 127 0 175l96 97l69 -69l-90 -94l-7 -3c-10 -10 -10 -28 0 -38s28 -10 38 0l250 247c37 40 39 102 0 141s-104 40 -144 0l-278 -275c-66 -69 -68 -179 0 -247
+c69 -69 181 -69 250 0l9 12l116 113l69 -69l-125 -125c-107 -107 -281 -107 -388 0s-107 281 0 388l278 272c39 39 90 59 141 59z" />
+    <glyph glyph-name="a3" unicode="&#xe0a3;" 
+d="M600 800l200 -200l-100 -100l-200 200zM400 600l200 -200l-400 -400h-200v200z" />
+    <glyph glyph-name="a4" unicode="&#xe0a4;" 
+d="M550 800c83 0 150 -90 150 -200s-67 -200 -150 -200c-22 0 -40 8 -59 19c6 26 9 52 9 81c0 84 -27 158 -72 212c27 52 71 88 122 88zM250 700c83 0 150 -90 150 -200s-67 -200 -150 -200s-150 90 -150 200s67 200 150 200zM725 384c44 -22 75 -66 75 -118v-166h-200v66
+c0 50 -17 96 -44 134c66 2 126 33 169 84zM75 284c45 -53 106 -84 175 -84s130 31 175 84c44 -22 75 -66 75 -118v-166h-500v166c0 52 31 96 75 118z" />
+    <glyph glyph-name="a5" unicode="&#xe0a5;" 
+d="M400 800c110 0 200 -112 200 -250s-90 -250 -200 -250s-200 112 -200 250s90 250 200 250zM191 300c54 -61 128 -100 209 -100s155 39 209 100c106 -5 191 -92 191 -200v-100h-800v100c0 108 85 195 191 200z" />
+    <glyph glyph-name="a6" unicode="&#xe0a6;" horiz-adv-x="600" 
+d="M19 800h462c11 0 19 -8 19 -19v-762c0 -11 -8 -19 -19 -19h-462c-11 0 -19 8 -19 19v762c0 11 8 19 19 19zM100 700v-500h300v500h-300zM250 150c-28 0 -50 -22 -50 -50s22 -50 50 -50s50 22 50 50s-22 50 -50 50z" />
+    <glyph glyph-name="a7" unicode="&#xe0a7;" 
+d="M350 800c17 0 34 -1 50 -3v-397l-297 297c63 64 150 103 247 103zM500 694c169 -25 300 -168 300 -344c0 -193 -157 -350 -350 -350c-85 0 -161 31 -222 81l272 272v341zM91 562l237 -234l-212 -212c-70 55 -116 138 -116 234c0 84 35 158 91 212z" />
+    <glyph glyph-name="a8" unicode="&#xe0a8;" 
+d="M92 650c0 23 20 50 46 50h3h4h5h400c28 0 50 -22 50 -50s-22 -50 -50 -50h-50v-200h100c55 0 100 -45 100 -100h-300v-300l-56 -100l-44 100v300h-300c0 55 45 100 100 100h100v200h-50c-2 0 -6 -1 -8 -1c-28 0 -50 23 -50 51z" />
+    <glyph glyph-name="a9" unicode="&#xe0a9;" 
+d="M400 800c221 0 400 -179 400 -400s-179 -400 -400 -400s-400 179 -400 400s179 400 400 400zM300 600v-400l300 200z" />
+    <glyph glyph-name="aa" unicode="&#xe0aa;" 
+d="M300 800h200v-300h300v-200h-300v-300h-200v300h-300v200h300v300z" />
+    <glyph glyph-name="ab" unicode="&#xe0ab;" 
+d="M300 800h100v-400h-100v400zM172 656l62 -78l-40 -31c-58 -46 -94 -117 -94 -197c0 -139 111 -250 250 -250s250 111 250 250c0 80 -39 151 -97 197l-37 31l62 78l38 -31c82 -64 134 -164 134 -275c0 -193 -157 -350 -350 -350s-350 157 -350 350c0 111 53 211 134 275z
+" />
+    <glyph glyph-name="ac" unicode="&#xe0ac;" 
+d="M200 800h400v-200h-400v200zM9 500h782c6 0 9 -3 9 -9v-282c0 -6 -3 -9 -9 -9h-91v200h-600v-200h-91c-6 0 -9 3 -9 9v282c0 6 3 9 9 9zM200 300h400v-300h-400v300z" />
+    <glyph glyph-name="ad" unicode="&#xe0ad;" 
+d="M0 700h100v-700h-100v700zM700 700h100v-700h-100v700zM200 600h200v-100h-200v100zM300 400h200v-100h-200v100zM400 200h200v-100h-200v100z" />
+    <glyph glyph-name="ae" unicode="&#xe0ae;" 
+d="M325 700c42 -141 87 -280 131 -419c29 74 59 148 88 222c30 -57 58 -114 87 -172h169v-100h-231l-13 28c-37 -92 -74 -184 -112 -275c-38 129 -79 257 -119 385c-42 -133 -83 -267 -125 -400c-28 88 -56 175 -84 262h-116v100h188l9 -34l3 -6c42 137 83 273 125 409z" />
+    <glyph glyph-name="af" unicode="&#xe0af;" 
+d="M200 600c0 57 43 100 100 100s100 -43 100 -100c0 -28 -18 -48 -28 -72c-3 -6 -3 -16 -3 -28h231v-231c12 0 22 0 28 3c24 10 44 28 72 28c57 0 100 -43 100 -100s-43 -100 -100 -100c-28 0 -48 18 -72 28c-6 3 -16 3 -28 3v-231h-231c0 12 0 22 3 28c10 24 28 44 28 72
+c0 57 -43 100 -100 100s-100 -43 -100 -100c0 -28 18 -48 28 -72c3 -6 3 -16 3 -28h-231v600h231c0 12 0 22 -3 28c-10 24 -28 44 -28 72z" />
+    <glyph glyph-name="b0" unicode="&#xe0b0;" horiz-adv-x="500" 
+d="M247 700c84 0 148 -20 191 -59s59 -93 59 -141c0 -117 -69 -181 -119 -225s-81 -67 -81 -150v-25h-100v25c0 117 65 181 115 225s85 67 85 150c0 25 -8 48 -28 66s-56 34 -122 34s-97 -18 -116 -37s-27 -43 -31 -69l-100 12c5 38 19 88 59 128s103 66 188 66zM197 0h100
+v-100h-100v100z" />
+    <glyph glyph-name="b1" unicode="&#xe0b1;" 
+d="M450 800c138 0 250 -112 250 -250v-50c58 -21 100 -85 100 -150c0 -69 -48 -127 -112 -144c-22 55 -75 94 -138 94c-20 0 -39 -5 -56 -12c-17 64 -75 112 -144 112s-127 -48 -144 -112c-17 7 -36 12 -56 12c-37 0 -71 -12 -97 -34c-33 36 -53 82 -53 134
+c0 110 90 200 200 200c23 114 129 200 250 200zM334 300h4h3c3 0 6 1 9 1c28 0 50 -22 50 -50v-1v-200c0 -28 -22 -50 -50 -50s-50 22 -50 50v200v2c0 20 15 42 34 48zM134 200h4h3c3 0 6 1 9 1c28 0 50 -22 50 -50v-1v-100c0 -28 -22 -50 -50 -50s-50 22 -50 50v100v2
+c0 20 15 42 34 48zM534 200h3h4c3 0 6 1 9 1c28 0 50 -22 50 -50v-1v-100c0 -28 -22 -50 -50 -50s-50 22 -50 50v100v2c0 20 15 42 34 48z" />
+    <glyph glyph-name="b2" unicode="&#xe0b2;" 
+d="M600 800l200 -150l-200 -150v100h-50l-153 -191l175 -206l6 -3h22v100l200 -150l-200 -150v100h-25c-35 0 -56 12 -78 38l-166 190l-153 -190c-22 -27 -43 -38 -78 -38h-100v100h100l166 206l-163 191l-3 3h-100v100h100c34 0 56 -12 78 -38l153 -178l141 178
+c22 27 43 38 78 38h50v100z" />
+    <glyph glyph-name="b3" unicode="&#xe0b3;" 
+d="M400 800c110 0 209 -47 281 -119l119 119v-300h-300l109 109c-54 55 -126 91 -209 91c-166 0 -300 -134 -300 -300s134 -300 300 -300c83 0 158 34 212 88l72 -72c-72 -72 -174 -116 -284 -116c-220 0 -400 180 -400 400s180 400 400 400z" />
+    <glyph glyph-name="b4" unicode="&#xe0b4;" 
+d="M400 800h400v-400l-166 166l-400 -400l166 -166h-400v400l166 -166l400 400z" />
+    <glyph glyph-name="b5" unicode="&#xe0b5;" horiz-adv-x="600" 
+d="M250 800l250 -300h-200v-200h200l-250 -300l-250 300h200v200h-200z" />
+    <glyph glyph-name="b6" unicode="&#xe0b6;" 
+d="M300 600v-200h200v200l300 -250l-300 -250v200h-200v-200l-300 250z" />
+    <glyph glyph-name="b7" unicode="&#xe0b7;" 
+d="M0 800c441 0 800 -359 800 -800h-200c0 333 -267 600 -600 600v200zM0 500c275 0 500 -225 500 -500h-200c0 167 -133 300 -300 300v200zM0 200c110 0 200 -90 200 -200h-200v200z" />
+    <glyph glyph-name="b8" unicode="&#xe0b8;" 
+d="M100 800c386 0 700 -314 700 -700h-100c0 332 -268 600 -600 600v100zM100 600c276 0 500 -224 500 -500h-100c0 222 -178 400 -400 400v100zM100 400c165 0 300 -135 300 -300h-100c0 111 -89 200 -200 200v100zM100 200c55 0 100 -45 100 -100s-45 -100 -100 -100
+s-100 45 -100 100s45 100 100 100z" />
+    <glyph glyph-name="b9" unicode="&#xe0b9;" 
+d="M300 800h400c55 0 100 -45 100 -100v-200h-400v150c0 28 -22 50 -50 50s-50 -22 -50 -50v-250h400v-300c0 -55 -45 -100 -100 -100h-500c-55 0 -100 45 -100 100v200h100v-150c0 -28 22 -50 50 -50s50 22 50 50v550c0 55 45 100 100 100z" />
+    <glyph glyph-name="ba" unicode="&#xe0ba;" 
+d="M75 700h225v-100h-200v-500h400v100h100v-125c0 -41 -34 -75 -75 -75h-450c-41 0 -75 34 -75 75v550c0 41 34 75 75 75zM600 700l200 -200l-200 -200v100h-200c-94 0 -173 -65 -194 -153c23 199 189 353 394 353v100z" />
+    <glyph glyph-name="bb" unicode="&#xe0bb;" 
+d="M500 700l300 -284l-300 -316v200h-100c-200 0 -348 -102 -400 -300c0 295 100 500 500 500v200z" />
+    <glyph glyph-name="bc" unicode="&#xe0bc;" 
+d="M381 791l19 9l19 -9c127 -53 253 -108 381 -160v-31c0 -166 -67 -313 -147 -419c-40 -53 -83 -97 -125 -128s-82 -53 -128 -53s-86 22 -128 53s-85 75 -125 128c-80 107 -147 253 -147 419v31c128 52 254 107 381 160zM400 100v591l-294 -122c8 -126 58 -243 122 -328
+c35 -46 73 -86 106 -110s62 -31 66 -31z" />
+    <glyph glyph-name="bd" unicode="&#xe0bd;" 
+d="M600 800h100v-800h-100v800zM400 700h100v-700h-100v700zM200 500h100v-500h-100v500zM0 300h100v-300h-100v300z" />
+    <glyph glyph-name="be" unicode="&#xe0be;" 
+d="M300 800h100v-200h200l100 -100l-100 -100h-200v-400h-100v500h-200l-100 100l100 100h200v100z" />
+    <glyph glyph-name="bf" unicode="&#xe0bf;" 
+d="M200 800h100v-600h200l-250 -200l-250 200h200v600zM400 800h200v-100h-200v100zM400 600h300v-100h-300v100zM400 400h400v-100h-400v100z" />
+    <glyph glyph-name="c0" unicode="&#xe0c0;" 
+d="M200 800h100v-600h200l-250 -200l-250 200h200v600zM400 800h400v-100h-400v100zM400 600h300v-100h-300v100zM400 400h200v-100h-200v100z" />
+    <glyph glyph-name="c1" unicode="&#xe0c1;" 
+d="M75 700h650c41 0 75 -34 75 -75v-550c0 -41 -34 -75 -75 -75h-650c-41 0 -75 34 -75 75v550c0 41 34 75 75 75zM100 600v-100h100v100h-100zM300 600v-100h400v100h-400zM100 400v-100h100v100h-100zM300 400v-100h400v100h-400zM100 200v-100h100v100h-100zM300 200
+v-100h400v100h-400z" />
+    <glyph glyph-name="c2" unicode="&#xe0c2;" 
+d="M400 800l100 -300h300l-250 -200l100 -300l-250 200l-250 -200l100 300l-250 200h300z" />
+    <glyph glyph-name="c3" unicode="&#xe0c3;" 
+d="M400 800c28 0 50 -22 50 -50s-22 -50 -50 -50s-50 22 -50 50s22 50 50 50zM150 700c28 0 50 -22 50 -50s-22 -50 -50 -50s-50 22 -50 50s22 50 50 50zM650 700c28 0 50 -22 50 -50s-22 -50 -50 -50s-50 22 -50 50s22 50 50 50zM400 600c110 0 200 -90 200 -200
+s-90 -200 -200 -200s-200 90 -200 200s90 200 200 200zM50 450c28 0 50 -22 50 -50s-22 -50 -50 -50s-50 22 -50 50s22 50 50 50zM750 450c28 0 50 -22 50 -50s-22 -50 -50 -50s-50 22 -50 50s22 50 50 50zM150 200c28 0 50 -22 50 -50s-22 -50 -50 -50s-50 22 -50 50
+s22 50 50 50zM650 200c28 0 50 -22 50 -50s-22 -50 -50 -50s-50 22 -50 50s22 50 50 50zM400 100c28 0 50 -22 50 -50s-22 -50 -50 -50s-50 22 -50 50s22 50 50 50z" />
+    <glyph glyph-name="c4" unicode="&#xe0c4;" 
+d="M34 800h632c18 0 34 -16 34 -34v-732c0 -18 -16 -34 -34 -34h-632c-18 0 -34 16 -34 34v732c0 18 16 34 34 34zM100 700v-500h500v500h-500zM350 150c-38 0 -63 -42 -44 -75s69 -33 88 0s-6 75 -44 75z" />
+    <glyph glyph-name="c5" unicode="&#xe0c5;" 
+d="M0 800h300l500 -500l-300 -300l-500 500v300zM200 700c-55 0 -100 -45 -100 -100s45 -100 100 -100s100 45 100 100s-45 100 -100 100z" />
+    <glyph glyph-name="c6" unicode="&#xe0c6;" 
+d="M0 600h200l300 -300l-200 -200l-300 300v200zM340 600h160l300 -300l-200 -200l-78 78l119 122zM150 500c-28 0 -50 -22 -50 -50s22 -50 50 -50s50 22 50 50s-22 50 -50 50z" />
+    <glyph glyph-name="c7" unicode="&#xe0c7;" 
+d="M400 800c220 0 400 -180 400 -400s-180 -400 -400 -400s-400 180 -400 400s180 400 400 400zM400 700c-166 0 -300 -134 -300 -300s134 -300 300 -300s300 134 300 300s-134 300 -300 300zM400 600c110 0 200 -90 200 -200s-90 -200 -200 -200s-200 90 -200 200
+s90 200 200 200zM400 500c-56 0 -100 -44 -100 -100s44 -100 100 -100s100 44 100 100s-44 100 -100 100z" />
+    <glyph glyph-name="c8" unicode="&#xe0c8;" 
+d="M0 700h559l-100 -100h-359v-500h500v159l100 100v-359h-700v700zM700 700l100 -100l-400 -400l-200 200l100 100l100 -100z" />
+    <glyph glyph-name="c9" unicode="&#xe0c9;" 
+d="M9 800h782c6 0 9 -3 9 -9v-782c0 -6 -3 -9 -9 -9h-782c-6 0 -9 3 -9 9v782c0 6 3 9 9 9zM150 722l-72 -72l100 -100l-100 -100l72 -72l172 172zM400 500v-100h300v100h-300z" />
+    <glyph glyph-name="ca" unicode="&#xe0ca;" 
+d="M0 800h800v-200h-50c0 55 -45 100 -100 100h-150v-550c0 -28 22 -50 50 -50h50v-100h-400v100h50c28 0 50 22 50 50v550h-150c-55 0 -100 -45 -100 -100h-50v200z" />
+    <glyph glyph-name="cb" unicode="&#xe0cb;" 
+d="M0 700h100v-400h-100v400zM200 700h350c21 0 39 -13 47 -31c0 0 103 -291 103 -319s-22 -50 -50 -50h-150c-28 0 -50 -25 -50 -50s39 -158 47 -184s-5 -55 -31 -63s-52 5 -66 31s-109 219 -128 238s-44 28 -72 28v400z" />
+    <glyph glyph-name="cc" unicode="&#xe0cc;" 
+d="M400 666c10 19 28 32 47 34l19 -3c26 -8 39 -37 31 -63s-47 -159 -47 -184s22 -50 50 -50h150c28 0 50 -22 50 -50s-103 -319 -103 -319c-8 -18 -26 -31 -47 -31h-350v400c28 0 53 9 72 28s114 212 128 238zM0 400h100v-400h-100v400z" />
+    <glyph glyph-name="cd" unicode="&#xe0cd;" 
+d="M200 700h300v-100h-100v-6c25 -4 50 -8 72 -16l-34 -94c-28 11 -58 16 -88 16c-139 0 -250 -111 -250 -250s111 -250 250 -250s250 111 250 250c0 31 -5 60 -16 88l91 37c14 -38 25 -81 25 -125c0 -193 -157 -350 -350 -350s-350 157 -350 350c0 176 130 323 300 347v3
+h-100v100zM700 584c0 0 -296 -348 -316 -368s-48 -20 -68 0s-20 48 0 68s384 300 384 300z" />
+    <glyph glyph-name="ce" unicode="&#xe0ce;" 
+d="M600 700l200 -150l-200 -150v100h-600v100h600v100zM200 300v-100h600v-100h-600v-100l-200 150z" />
+    <glyph glyph-name="cf" unicode="&#xe0cf;" 
+d="M300 800h100c55 0 100 -45 100 -100h100c55 0 100 -45 100 -100h-700c0 55 45 100 100 100h100c0 55 45 100 100 100zM100 500h100v-350c0 -28 22 -50 50 -50s50 22 50 50v350h100v-350c0 -28 22 -50 50 -50s50 22 50 50v350h100v-481c0 -11 -8 -19 -19 -19h-462
+c-11 0 -19 8 -19 19v481z" />
+    <glyph glyph-name="d0" unicode="&#xe0d0;" 
+d="M100 800h200v-400c0 -55 45 -100 100 -100s100 45 100 100v400h100v-400c0 -110 -90 -200 -200 -200h-50c-138 0 -250 90 -250 200v400zM0 100h700v-100h-700v100z" />
+    <glyph glyph-name="d1" unicode="&#xe0d1;" 
+d="M9 700h182c6 0 9 -3 9 -9v-482c0 -6 -3 -9 -9 -9h-182c-6 0 -9 3 -9 9v482c0 6 3 9 9 9zM609 700h182c6 0 9 -3 9 -9v-482c0 -6 -3 -9 -9 -9h-182c-6 0 -9 3 -9 9v482c0 6 3 9 9 9zM309 500h182c6 0 9 -3 9 -9v-282c0 -6 -3 -9 -9 -9h-182c-6 0 -9 3 -9 9v282
+c0 6 3 9 9 9zM0 100h800v-100h-800v100z" />
+    <glyph glyph-name="d2" unicode="&#xe0d2;" 
+d="M10 700h181c6 0 9 -3 9 -9v-191h-200v191c0 6 4 9 10 9zM610 700h181c6 0 9 -3 9 -9v-191h-200v191c0 6 5 9 10 9zM310 600h181c6 0 9 -3 9 -9v-91h-200v91c0 6 4 9 10 9zM0 400h800v-100h-800v100zM0 200h200v-191c0 -6 -3 -9 -9 -9h-182c-6 0 -9 3 -9 9v191zM300 200
+h200v-91c0 -6 -3 -9 -9 -9h-181c-6 0 -10 3 -10 9v91zM600 200h200v-191c0 -6 -3 -9 -9 -9h-181c-6 0 -10 3 -10 9v191z" />
+    <glyph glyph-name="d3" unicode="&#xe0d3;" 
+d="M0 700h800v-100h-800v100zM9 500h182c6 0 9 -3 9 -9v-482c0 -6 -3 -9 -9 -9h-182c-6 0 -9 3 -9 9v482c0 6 3 9 9 9zM309 500h182c6 0 9 -3 9 -9v-282c0 -6 -3 -9 -9 -9h-182c-6 0 -9 3 -9 9v282c0 6 3 9 9 9zM609 500h182c6 0 9 -3 9 -9v-482c0 -6 -3 -9 -9 -9h-182
+c-6 0 -9 3 -9 9v482c0 6 3 9 9 9z" />
+    <glyph glyph-name="d4" unicode="&#xe0d4;" 
+d="M50 600h500c28 0 50 -22 50 -50v-150l100 100h100v-300h-100l-100 100v-150c0 -28 -22 -50 -50 -50h-500c-28 0 -50 22 -50 50v400c0 28 22 50 50 50z" />
+    <glyph glyph-name="d5" unicode="&#xe0d5;" 
+d="M334 800h66v-800h-66l-134 200h-200v400h200zM500 600v100c26 0 52 -4 75 -10c130 -33 225 -150 225 -290s-95 -258 -225 -291h-3c-23 -6 -47 -9 -72 -9v100c17 0 34 2 50 6c86 22 150 100 150 194s-64 172 -150 194c-16 4 -33 6 -50 6zM500 500l25 -3
+c44 -11 75 -51 75 -97s-32 -86 -75 -97l-25 -3v200z" />
+    <glyph glyph-name="d6" unicode="&#xe0d6;" horiz-adv-x="600" 
+d="M334 800h66v-800h-66l-134 200h-200v400h200zM500 500l25 -3c44 -11 75 -51 75 -97s-32 -86 -75 -97l-25 -3v200z" />
+    <glyph glyph-name="d7" unicode="&#xe0d7;" horiz-adv-x="400" 
+d="M334 800h66v-800h-66l-134 200h-200v400h200z" />
+    <glyph glyph-name="d8" unicode="&#xe0d8;" 
+d="M309 800h82c6 0 10 -4 12 -9l294 -682l3 -19v-81c0 -6 -3 -9 -9 -9h-682c-6 0 -9 3 -9 9v81l3 19l294 682c2 5 6 9 12 9zM300 500v-200h100v200h-100zM300 200v-100h100v100h-100z" />
+    <glyph glyph-name="d9" unicode="&#xe0d9;" 
+d="M375 800c138 0 269 -39 378 -109l-53 -82c-93 60 -205 91 -325 91c-119 0 -229 -32 -322 -91l-53 82c109 70 237 109 375 109zM375 500c78 0 154 -23 216 -62l-53 -85c-46 30 -104 47 -163 47c-60 0 -112 -17 -159 -47l-54 85c62 40 134 62 213 62zM375 200
+c55 0 100 -45 100 -100s-45 -100 -100 -100s-100 45 -100 100s45 100 100 100z" />
+    <glyph glyph-name="da" unicode="&#xe0da;" horiz-adv-x="900" 
+d="M551 800c16 0 32 0 47 -3l-97 -97v-200h200l97 97c3 -15 3 -31 3 -47c0 -138 -112 -250 -250 -250c-32 0 -62 8 -90 19l-288 -291c-20 -20 -46 -28 -72 -28s-52 8 -72 28c-39 39 -39 105 0 144l291 287c-11 28 -19 59 -19 91c0 138 112 250 250 250zM101 150
+c-28 0 -50 -22 -50 -50s22 -50 50 -50s50 22 50 50s-22 50 -50 50z" />
+    <glyph glyph-name="db" unicode="&#xe0db;" 
+d="M141 700c84 -84 169 -167 253 -250c82 83 167 165 247 250l143 -141l-253 -253c84 -82 167 -166 253 -247l-143 -143c-81 86 -165 169 -247 253l-253 -253l-141 143c85 80 167 164 250 247c-83 84 -166 169 -250 253z" />
+    <glyph glyph-name="dc" unicode="&#xe0dc;" 
+d="M0 800h100l231 -300h38l231 300h100l-225 -300h225v-100h-300v-100h300v-100h-300v-200h-100v200h-300v100h300v100h-300v100h225z" />
+    <glyph glyph-name="dd" unicode="&#xe0dd;" horiz-adv-x="900" 
+d="M350 800c193 0 350 -157 350 -350c0 -61 -17 -119 -44 -169c4 -2 10 -6 13 -9l103 -100c16 -16 30 -49 30 -72c0 -56 -46 -102 -102 -102c-23 0 -56 14 -72 30l-100 103c-3 3 -7 9 -9 13c-50 -28 -108 -44 -169 -44c-193 0 -350 157 -350 350s157 350 350 350zM350 700
+c-139 0 -250 -111 -250 -250s111 -250 250 -250c62 0 119 23 163 60c7 11 19 25 31 31l3 3c34 43 53 97 53 156c0 139 -111 250 -250 250zM300 600h100v-100h100v-100h-100v-100h-100v100h-100v100h100v100z" />
+    <glyph glyph-name="de" unicode="&#xe0de;" horiz-adv-x="900" 
+d="M350 800c193 0 350 -157 350 -350c0 -61 -17 -119 -44 -169c4 -2 10 -6 13 -9l103 -100c16 -16 30 -49 30 -72c0 -56 -46 -102 -102 -102c-23 0 -56 14 -72 30l-100 103c-3 3 -7 9 -9 13c-50 -28 -108 -44 -169 -44c-193 0 -350 157 -350 350s157 350 350 350zM350 700
+c-139 0 -250 -111 -250 -250s111 -250 250 -250c62 0 119 23 163 60c7 11 19 25 31 31l3 3c34 43 53 97 53 156c0 139 -111 250 -250 250zM200 500h300v-100h-300v100z" />
+  </font>
+</defs></svg>

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web/wwwroot/css/open-iconic/icon-license.txt

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2014 Waybury
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web/wwwroot/css/receiver-extras.css

@@ -0,0 +1,88 @@
+/* Phase 5–6 additions for the Blazor receiver UI.
+   Lives next to receiver-site.css so the legacy MVC CSS stays untouched
+   and any tweaks specific to the Blazor flow are easy to spot. */
+
+.signature-pad-container {
+    display: flex;
+    flex-direction: column;
+}
+
+.signature-pad-canvas {
+    cursor: crosshair;
+}
+
+.signature-list {
+    margin: 0;
+    padding: 0;
+}
+
+.signature-item {
+    background-color: #fff;
+    transition: background-color 0.2s ease;
+}
+
+.signature-item.bg-success-subtle {
+    background-color: #d1e7dd !important;
+}
+
+/* Receiver-shell wraps every page that uses ReceiverLayout. */
+.receiver-shell {
+    min-height: 100vh;
+    display: flex;
+    flex-direction: column;
+}
+
+.receiver-shell > * {
+    flex: 1 0 auto;
+}
+
+.envelope-content {
+    flex-grow: 1;
+}
+
+/* Footer override for Blazor — the legacy CSS uses position:fixed,
+   which collides with the WebAssembly app shell. Keep it sticky but
+   not absolutely positioned so the page content remains scrollable. */
+footer.receiver-footer {
+    background-color: #001F61;
+    color: #fff;
+    font-family: 'Muli';
+    border-radius: 10px 10px 0 0;
+    padding: 0.5rem 1rem;
+    font-size: clamp(0.58rem, 1.5vw, 1rem);
+    display: flex;
+    flex-direction: row;
+    justify-content: space-around;
+    align-items: center;
+    flex-wrap: wrap;
+    gap: 0.5rem;
+}
+
+footer.receiver-footer a {
+    color: #FF7500;
+    text-decoration: none;
+}
+
+footer.receiver-footer .language-switcher {
+    background: transparent;
+    color: #fff;
+    border: 1px solid rgba(255, 255, 255, 0.4);
+    border-radius: 0.25rem;
+    padding: 0.15rem 0.5rem;
+}
+
+/* Cookie consent banner (Blazor counterpart of _CookieConsentPartial). */
+.receiver-cookie-banner {
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    z-index: 1100;
+    background-color: #f8f9fa;
+    border-top: 1px solid #ced4da;
+    padding: 0.75rem 1rem;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 1rem;
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web/wwwroot/css/receiver-site.css

@@ -0,0 +1,625 @@
+/*
+    Colors taken from:
+    https://tailwindcss.com/docs/customizing-colors#default-color-palette
+*/
+
+/* Toolbar Buttons */
+
+.navbar-toggler {
+    border: 0;
+}
+
+.material-symbols-outlined {
+    align-content: center;
+}
+
+.btn-group {
+    margin-right: 10vw;
+    margin-bottom: 10vh;
+}
+
+.btn_refresh, .btn_reject, .btn_complete {
+    height:2.5rem;
+}
+
+    .btn_complete .icon, .btn_reject .icon, .btn_refresh .icon {
+        width: 1.1rem;
+    }
+
+    .btn_complete span, .btn_reject span, .btn_refresh span {
+        vertical-align: middle;
+    }
+
+.button-finish {
+    color: #fff;
+    background-color: #0d6efd;
+    border-color: #0d6efd;
+}
+
+    .button-finish:hover {
+        color: #fff;
+        background-color: #0b5ed7;
+        border-color: #0a58ca;
+    }
+
+    .button-finish:focus {
+        box-shadow: 0 0 0 0.25rem rgba(49, 132, 253, 0.5);
+    }
+
+    .button-finish:active {
+        color: #fff;
+        background-color: #0a58ca;
+        border-color: #0a53be;
+        box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
+    }
+
+    .button-finish:disabled {
+        color: #fff;
+        background-color: #0d6efd;
+        border-color: #0d6efd;
+    }
+
+.button-reject {
+    color: #fff;
+    background-color: #dc3545;
+    border-color: #dc3545;
+}
+
+    .button-reject:hover {
+        color: #fff;
+        background-color: #bb2d3b;
+        border-color: #b02a37;
+    }
+
+    .button-reject:focus {
+        box-shadow: 0 0 0 0.25rem rgba(225, 83, 97, 0.5);
+    }
+
+    .button-reject:active {
+        color: #fff;
+        background-color: #b02a37;
+        border-color: #a52834;
+        box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
+    }
+
+    .button-reject:disabled {
+        color: #fff;
+        background-color: #dc3545;
+        border-color: #dc3545;
+    }
+
+.button-reset {
+    color: #fff;
+    background-color: #6c757d;
+    border-color: #6c757d;
+}
+
+    .button-reset:hover {
+        color: #fff;
+        background-color: #5c636a;
+        border-color: #565e64;
+    }
+
+    .button-reset:focus {
+        box-shadow: 0 0 0 0.25rem rgba(130, 138, 145, 0.5);
+    }
+
+    .button-reset:active {
+        color: #fff;
+        background-color: #565e64;
+        border-color: #51585e;
+        box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
+    }
+
+    .button-reset:disabled {
+        color: #fff;
+        background-color: #6c757d;
+        border-color: #6c757d;
+    }
+
+body {
+    background: #f8fcfc;
+    display: flex;
+    flex-direction: column;
+    height: 100vh;
+    margin: 0;
+}
+
+main {
+    display:flex;
+    margin: 0 0 0.5vh 0;
+}
+
+.home-description {
+    text-align: justify;
+    font-family: Consolas,Monaco,Lucida Console,Liberation Mono,DejaVu Sans Mono,Bitstream Vera Sans Mono,Courier New;
+    font-weight: 500;
+    font-size: .95em;
+    letter-spacing: -1px;
+    word-spacing: -2px;
+}
+
+.envelope-view {
+    display: flex; /* d-flex */
+    flex-direction: column; /* flex-column */
+    width: 100vw;
+    height: 95.9vh;
+}
+
+#app {
+    background: gray;
+    width: 100vw;
+    height: 100%;
+    flex-grow: 1;
+    border-width: 0;
+}
+
+footer {
+    height: 4vh;
+    min-height: 1.5rem;
+    background-color: #001F61;
+    border-radius: 10px 10px 0 0;
+    color: #fff;
+    font-family: 'Muli';
+    padding: 0.5vh 0;
+    position: fixed;
+    bottom: 0;
+    width: 100%;
+    z-index: 998;
+    border-width: 0;
+    font-size: clamp(0.58rem, 1.5vw, 1rem);
+    display: flex;
+    flex-direction: row;
+    justify-content: space-around;
+    align-items: center;
+}
+
+    footer * {
+        margin-left: clamp(0.5rem, 2vw, 1rem);
+    }
+
+    footer a {
+        color: #FF7500;
+        text-decoration: none;
+    }
+
+    footer .dropdown-toggle, footer .flag-dropdown, footer li {
+        margin: 0;
+        padding: 0;
+        border-width: 0;
+    }
+
+    footer .dropdown-menu a {
+        padding: 0.25rem 1rem 0.25rem 1rem;
+        margin-left: 0;
+        user-select: none;
+    }
+
+.page {
+    margin-top: 3rem;
+    background: white;
+    border-radius: 0.313rem;
+    box-shadow: rgba(9, 30, 66, 0.25) 0rem 0.25rem 0.5rem -0.125rem, rgba(9, 30, 66, 0.08) 0rem 0rem 0rem 0.063rem;
+    max-width: 40rem;
+}
+
+    .page section {
+        max-width: 30rem;
+        margin: 0 auto;
+    }
+
+    .page header .icon {
+        display: inline-block;
+        border-radius: 6.25rem;
+        padding: 0.938rem;
+        margin-bottom: 2rem;
+    }
+
+        .page header .icon.admin {
+            background-color: #331904;
+            color: #fecba1;
+        }
+
+        .page header .icon.locked {
+            background-color: #ffa407;
+            color: #000;
+        }
+
+            .page header .icon.locked.tfa {
+                background-color: #ff7207;
+                color: #000;
+            }
+
+        .page header .icon.signed {
+            background-color: #146c43;
+            color: #fff;
+        }
+
+        .page header .icon.rejected {
+            background-color: #e4d8d5;
+            color: #fff;
+        }
+
+        .page header .icon.expired {
+            background-color: rgba(228, 216, 213, 0.5);
+            color: #fff;
+        }
+
+    .page .form {
+        max-width: 30rem;
+        margin: 2rem auto;
+        display: flex;
+        gap: 1rem;
+    }
+
+#form-access-code > .input,
+#form-admin-password > .input {
+    flex-grow: 1;
+}
+
+#page-admin header .icon {
+    background-color: #331904;
+    color: #fecba1;
+}
+
+
+.envelope {
+    display: block;
+    border: 0.063rem solid #eee;
+    margin-bottom: 1rem;
+    padding: 0.5rem;
+}
+
+footer#page-footer {
+    color: #333;
+    max-width: 40rem;
+    margin-top: 1rem;
+    font-size: 0.85rem;
+}
+
+    footer#page-footer a,
+    footer#page-footer a:link,
+    footer#page-footer a:hover,
+    footer#page-footer a:visited,
+    footer#page-footer a:focus {
+        color: #444;
+    }
+
+.sender-card {
+    background-color: transparent;
+    border: none;
+}
+
+    .sender-card .row {
+        height: 7vh;
+    }
+
+    .sender-card img {
+        height: 7vh;
+        background-color: rgb(209, 207, 207);
+        border-radius: 3.125rem;
+    }
+
+.navbar .container {
+    display: flex;
+    padding: 0;
+    margin: 0;
+}
+
+.navbar-toggler {
+    padding: 0;
+    margin: 0;
+    width: 4rem;
+    left: 0;
+}
+
+.envelope-message {
+    position: absolute;
+    display: flex;
+    width: calc(100% - 8rem);
+    align-items: center;
+    justify-content: start;
+    margin-left: 4rem;
+}
+
+.envelope-message .icon {
+    margin-right: 0.5rem;
+}
+
+.envelope-message .message {
+    font-family: 'Roboto', sans-serif;
+    font-size: 16px;
+    font-weight: 550;
+}
+
+.logo {
+    width: 9rem;
+    position: absolute;
+    right: 0;
+    margin-right:2rem;
+}
+
+.none-display {
+    display: none
+}
+
+.dropdown-flag img, .img-flag {
+    width: 30%;
+    height: 70%;
+}
+
+.dropdown-flag {
+    height: 75%;
+    width: 75%;
+}
+
+/* CSS for custom class to increase dropdown height */
+.increase-dropdown-height {
+    min-height: 25rem; /* Optional, larger value for increased height */
+}
+
+
+/* Adjusting select2 width to fit within a specific form size */
+.dropdown-flag .select2-container {
+    width: 100% !important; /* Makes the container full width */
+    max-width: 11.25rem; /* Suitable maximum width for the form */
+}
+
+.lang-item {
+    font-size: 0.85rem;
+}
+
+#langDropdownMenuButton {
+    min-width: 4vw;
+}
+
+.highlight {
+    font-weight: 700;
+    font-size: 0.85rem;
+}
+
+.signature-process-title, .signature-process-name {
+    font-size: 1.125rem;
+}
+
+
+.mail-link {
+    color: black;
+    text-decoration: none;
+}
+
+.mail-link:hover {
+    text-decoration: underline;
+}
+
+#flex-action-panel {
+    z-index: 1050;
+}
+
+#form-access-code {
+    justify-content: space-evenly;
+}
+
+.access-code-form-floating {
+    display: flex;
+    justify-content: space-between;
+    flex-direction: row;
+    align-items: center;
+}
+
+    .access-code-form-floating button {
+        align-content: center;
+        border-bottom-left-radius: 0;
+        border-top-left-radius: 0;
+        margin:0;
+        height: 100%;
+    }
+
+    .access-code-form-floating input {
+        align-content: center;
+        border-bottom-right-radius: 0;
+        border-top-right-radius: 0;
+        border-right-width: 0;
+        width: 7rem;
+    }
+
+#access-code-error-message {
+    justify-content: center;
+    align-content: center;
+    margin: 1.5rem 7rem 0 7rem;
+    height: 2.5rem;
+}
+
+#sms-timer {
+    height: 3rem;
+    display: flex;
+    align-items: center;
+    font-family: 'Arial', sans-serif;
+    font-weight: bold;
+    color: #ffffff;
+    background-color: #007bff;
+    margin: 0 0 0 2rem;
+    border-radius: 8px;
+    text-align: center;
+}
+
+    #sms-timer:hover {
+        background-color: #0056b3;
+        cursor: pointer;
+    }
+
+.form-check.tfa-sms {
+    margin-left: 2rem;
+}
+
+    .form-check.tfa-sms .form-check-label {
+        font-size: 0.875rem;
+        font-weight: 500;
+        margin-left: -.1rem;
+    }
+
+/*.flag-dropdown button {
+    height: 100%;
+}*/
+
+.header-1 {
+    align-items: center;
+    justify-content: space-between;
+    margin-top: 0;
+    padding-top: 0;
+}
+
+.header-1 .text {
+    text-align: center;
+    margin-left: 1.5vw;
+        margin-top:0;
+    padding-top: 0;
+}
+
+.no-receiver-explanation {
+    padding: 2.5rem;
+}
+
+.ajs-message.ajs-custom {
+    margin: 0rem 0rem 0rem 0rem;
+    padding: 0rem 0rem 0rem 0rem;
+    width:50rem;
+}
+
+    .ajs-message.ajs-custom .alert {
+        display: flex;
+        flex-direction: row;
+    }
+
+    .ajs-message.ajs-custom span {
+        margin: 0 1rem 0 0;
+    }
+
+    .ajs-message.ajs-custom p {
+        margin: 0;
+        padding: 0;
+    }
+
+/* styles for mobile responsiveness */
+@media (max-height: 850px) {
+    .navbar .container {
+        display: flex;
+        padding: 0;
+        margin: 0;
+    }
+
+    .navbar-toggler {
+        padding: 0;
+        margin: 0;
+        width: 4rem;
+        left: 0;
+    }
+
+    .envelope-message {
+        width: calc(100% - 4rem -9rem);
+    }
+
+        .envelope-message .message {
+            font-size: 14px;
+            font-weight: 550;
+        }
+
+    .logo {
+        width: 9rem;
+        position: absolute;
+        right: 0;
+    }
+
+    .card-text, .card-text {
+        font-size: 0.6rem; /* Font size reduced */
+        margin: 0rem;
+        padding: 0rem;
+    }
+
+    .highlight {
+        font-weight: 700;
+        font-size: 0.5rem;
+    }
+
+    .signature-process-title, .signature-process-name {
+        font-size: 0.7rem;
+    }
+}
+
+@media (max-width: 767px) {
+    .navbar {
+        flex-direction: column;
+        align-items: flex-start;
+    }
+
+    .navbar-brand {
+        font-size: 0.5rem;
+        text-align: center;
+        overflow: hidden;
+        text-overflow: ellipsis;
+    }
+
+    .envelope-message {
+        width: calc(100% - 4rem - 4.5rem);
+        margin-left: 3rem;
+    }
+
+        .envelope-message .message {
+            font-size: 12px;
+            font-weight: 550;
+        }
+
+        .envelope-message .icon {
+            margin-right: 0.1rem;
+            font-size: 1rem
+        }
+
+    .logo {
+        width: 5rem;
+        right: 0;
+        margin-right: 1rem;
+    }
+
+    .btn_group {
+        position: fixed;
+        flex-direction: row;
+        bottom: 0.5rem;
+        right: 0.5rem;
+    }
+
+    .img-fluid {
+        width: 1.2rem;
+        height: 100%;
+        display: none;
+    }
+
+    .page {
+        margin-top: 1rem;
+        max-width: 90%;
+        padding: 0.5rem;
+    }
+
+        .page section {
+            max-width: 90%;
+        }
+
+    #form-access-code {
+        margin-left: 0;
+    }
+}
+
+@media (max-width: 1024px) {
+    #flex-action-panel, .btn-desktop {
+        display: none;
+    }
+}
+
+@media (max-height: 600px) {
+    .collapse {
+        height: 4rem;
+    }
+}
+
+#tfaRegStep .tfaQrCode {
+    width: 7rem;
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web/wwwroot/css/site.css

@@ -0,0 +1,60 @@
+@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');
+@import url('./icons.css');
+
+html, body {
+    display: flex;
+    flex-direction: column;
+    height: 100%;
+    overflow: hidden;
+    margin: 0;
+}
+
+.valid.modified:not([type=checkbox]) {
+    outline: 1px solid var(--dxds-color-border-success-default-rest);
+}
+
+.invalid {
+    outline: 1px solid var(--dxds-color-border-danger-default-rest);
+}
+
+.validation-message {
+    color: var(--dxds-color-content-danger-default-rest);
+}
+
+.button-link {
+    text-decoration: unset;
+}
+
+.title {
+    display: flex;
+    flex-direction: column;
+    gap: 0.5rem;
+    padding: 1rem 0;
+}
+
+.title.title-secondary {
+    padding: 0.313rem 0 0;
+    color: var(--dxds-color-content-secondary-default-rest);
+}
+
+.title-header-text {
+    font-size: var(--dxds-font-size-headline-lg);
+    font-weight: var(--dxds-font-weight-headline-default);
+    letter-spacing: var(--dxds-letter-spacing-headline-lg);
+    line-height: var(--dxds-line-height-headline-lg);
+}
+
+.title-content-text {
+    font-size: var(--dxds-font-size-base-lg);
+    font-weight: var(--dxds-font-weight-base-default);
+    letter-spacing: var(--dxds-letter-spacing-base-lg);
+    line-height: var(--dxds-line-height-base-lg);
+}
+
+.main-content {
+    align-items: center;
+    display: flex;
+    height: 100%;
+    justify-content: center;
+    width: 100%;
+}

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web/wwwroot/images/back.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+<path d="M12.3544 15.8529C12.1594 16.0485 11.8429 16.0491 11.6472 15.8542L6.16276 10.3892C5.94705 10.1743 5.94705 9.82495 6.16276 9.61L11.6472 4.14502C11.8429 3.95011 12.1594 3.95067 12.3544 4.14628C12.5493 4.34189 12.5487 4.65848 12.3531 4.85339L7.18851 9.99961L12.3531 15.1458C12.5487 15.3407 12.5493 15.6573 12.3544 15.8529Z"/>
+</svg>

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web/wwwroot/images/cards.svg

@@ -0,0 +1,43 @@
+<svg xmlns="http://www.w3.org/2000/svg">
+<symbol id="counter" viewBox="0 0 104 104">
+    <path d="M8 54H96V88C96 91.3137 93.3137 94 90 94H14C10.6863 94 8 91.3137 8 88V54Z" fill="#8E9195"/>
+    <rect x="8" y="12" width="88" height="80" rx="6" fill="#E1E2E4"/>
+    <path d="M8 18C8 14.6863 10.6863 12 14 12H90C93.3137 12 96 14.6863 96 18V28H8V18Z" fill="white"/>
+    <rect x="66" y="18" width="24" height="4" rx="2" fill="#8E9195"/>
+    <rect x="44" y="18" width="4" height="4" rx="2" fill="#8E9195"/>
+    <rect x="50" y="18" width="4" height="4" rx="2" fill="#8E9195"/>
+    <rect x="56" y="18" width="4" height="4" rx="2" fill="#8E9195"/>
+    <rect x="12" y="16" width="8" height="8" rx="4" fill="var(--bs-primary, var(--dxds-primary-90))" />
+    <path d="M35 44C35 41.7909 36.7909 40 39 40H65C67.2091 40 69 41.7909 69 44V76C69 78.2091 67.2091 80 65 80H39C36.7909 80 35 78.2091 35 76V44Z" fill="white"/>
+    <path d="M52.4983 72.77C54.2039 72.77 55.7046 72.471 57.0004 71.8729C58.3073 71.2748 59.3317 70.4442 60.0738 69.3809C60.8158 68.3177 61.1869 67.105 61.1869 65.7427V65.7095C61.1869 64.026 60.6497 62.6748 59.5754 61.6559C58.5011 60.637 57.0834 60.0555 55.3225 59.9115V59.8285C56.2971 59.6291 57.161 59.2802 57.9141 58.7818C58.6783 58.2724 59.2764 57.6411 59.7083 56.888C60.1513 56.1238 60.3728 55.2433 60.3728 54.2465V54.2133C60.3728 52.9839 60.0461 51.9041 59.3927 50.9737C58.7392 50.0434 57.82 49.318 56.6349 48.7974C55.4498 48.2658 54.0599 48 52.465 48C50.9034 48 49.5245 48.2769 48.3284 48.8307C47.1433 49.3733 46.1908 50.1431 45.471 51.1399C44.7621 52.1366 44.3413 53.3051 44.2084 54.6452L44.1917 54.8279H47.7137L47.7303 54.6618C47.8078 53.9198 48.0515 53.2774 48.4613 52.7347C48.8711 52.192 49.4193 51.7767 50.106 51.4887C50.7927 51.2008 51.579 51.0568 52.465 51.0568C53.3732 51.0568 54.1429 51.2008 54.7742 51.4887C55.4166 51.7656 55.8984 52.1754 56.2196 52.7181C56.5518 53.2608 56.718 53.9198 56.718 54.695V54.7283C56.718 55.4703 56.5241 56.1293 56.1365 56.7052C55.7599 57.2811 55.2228 57.7352 54.525 58.0675C53.8384 58.3887 53.0409 58.5493 52.1328 58.5493H49.3252V61.4732H52.2491C53.8439 61.4732 55.101 61.8386 56.0202 62.5696C56.9395 63.2895 57.3991 64.3251 57.3991 65.6762V65.7095C57.3991 66.4737 57.1942 67.1548 56.7844 67.7529C56.3746 68.3509 55.7987 68.8216 55.0567 69.165C54.3257 69.4972 53.4729 69.6634 52.4983 69.6634C51.5015 69.6634 50.6265 69.5083 49.8734 69.1982C49.1314 68.8881 48.5333 68.4617 48.0792 67.919C47.6362 67.3652 47.3759 66.7395 47.2984 66.0417L47.2818 65.859H43.6934L43.71 66.0583C43.8207 67.3652 44.2471 68.5281 44.9892 69.5471C45.7312 70.5549 46.7391 71.3468 48.0127 71.9227C49.2975 72.4876 50.7927 72.77 52.4983 72.77Z" fill="#2E3134"/>
+    <path fill-rule="evenodd" clip-rule="evenodd" d="M81.9999 52C86.4183 52 90 55.5817 90 60C90 64.4183 86.4183 68 81.9999 68C77.5817 68 74 64.4183 74 60C74 55.5817 77.5817 52 81.9999 52Z" fill="var(--bs-primary, var(--dxds-primary-90))" />
+    <path fill-rule="evenodd" clip-rule="evenodd" d="M83 56C83 55.4477 82.5523 55 82 55C81.4477 55 81 55.4477 81 56V59H78C77.4477 59 77 59.4477 77 60C77 60.5523 77.4477 61 78 61H81V64C81 64.5523 81.4477 65 82 65C82.5523 65 83 64.5523 83 64V61H86C86.5523 61 87 60.5523 87 60C87 59.4477 86.5523 59 86 59H83V56Z" fill="white"/>
+    <path fill-rule="evenodd" clip-rule="evenodd" d="M21.9999 52C26.4183 52 30 55.5817 30 60C30 64.4183 26.4183 68 21.9999 68C17.5817 68 14 64.4183 14 60C14 55.5817 17.5817 52 21.9999 52Z" fill="#C5C7C9"/>
+    <path d="M17 60C17 59.4477 17.4477 59 18 59H26C26.5523 59 27 59.4477 27 60C27 60.5523 26.5523 61 26 61H18C17.4477 61 17 60.5523 17 60Z" fill="white"/>
+</symbol>
+<symbol id="weather" viewBox="0 0 104 104">
+    <path d="M74.5994 18.1863L72 12L69.4006 18.1863C70.2494 18.0635 71.1173 18 72 18C72.8827 18 73.7506 18.0635 74.5994 18.1863Z" fill="#FFDA6A"/>
+    <path d="M76.4171 18.546C78.1282 18.9776 79.7418 19.6543 81.2185 20.5365L81.1844 13.8269L76.4171 18.546Z" fill="#FFDA6A"/>
+    <path d="M82.7568 21.5663C84.1524 22.6081 85.3919 23.8476 86.4337 25.2432L88.9706 19.0294L82.7568 21.5663Z" fill="#FFDA6A"/>
+    <path d="M87.4635 26.7815C88.3457 28.2582 89.0224 29.8718 89.454 31.5829L94.1731 26.8156L87.4635 26.7815Z" fill="#FFDA6A"/>
+    <path d="M89.8137 33.4006C89.9365 34.2494 90 35.1173 90 36C90 36.8827 89.9365 37.7506 89.8137 38.5994L96 36L89.8137 33.4006Z" fill="#FFDA6A"/>
+    <path d="M89.454 40.4171C89.0224 42.1282 88.3457 43.7418 87.4635 45.2185L94.1731 45.1844L89.454 40.4171Z" fill="#FFDA6A"/>
+    <path d="M86.4337 46.7568C85.3919 48.1524 84.1524 49.3919 82.7568 50.4337L88.9706 52.9706L86.4337 46.7568Z" fill="#FFDA6A"/>
+    <path d="M81.2185 51.4635C79.7418 52.3457 78.1282 53.0224 76.4171 53.454L81.1844 58.1731L81.2185 51.4635Z" fill="#FFDA6A"/>
+    <path d="M74.5994 53.8137C73.7506 53.9365 72.8827 54 72 54C71.1173 54 70.2494 53.9365 69.4006 53.8137L72 60L74.5994 53.8137Z" fill="#FFDA6A"/>
+    <path d="M67.5829 53.454C65.8718 53.0224 64.2582 52.3457 62.7815 51.4635L62.8156 58.1731L67.5829 53.454Z" fill="#FFDA6A"/>
+    <path d="M61.2432 50.4337C59.8476 49.3919 58.6081 48.1524 57.5663 46.7568L55.0294 52.9706L61.2432 50.4337Z" fill="#FFDA6A"/>
+    <path d="M56.5365 45.2185C55.6543 43.7418 54.9776 42.1282 54.546 40.4171L49.8269 45.1844L56.5365 45.2185Z" fill="#FFDA6A"/>
+    <path d="M54.1863 38.5994C54.0635 37.7506 54 36.8827 54 36C54 35.1173 54.0635 34.2494 54.1863 33.4006L48 36L54.1863 38.5994Z" fill="#FFDA6A"/>
+    <path d="M54.546 31.5829C54.9776 29.8718 55.6543 28.2582 56.5365 26.7815L49.8269 26.8156L54.546 31.5829Z" fill="#FFDA6A"/>
+    <path d="M57.5663 25.2432C58.6081 23.8476 59.8476 22.6081 61.2432 21.5663L55.0294 19.0294L57.5663 25.2432Z" fill="#FFDA6A"/>
+    <path d="M62.7815 20.5365L62.8156 13.8269L67.5829 18.546C65.8718 18.9776 64.2582 19.6543 62.7815 20.5365Z" fill="#FFDA6A"/>
+    <circle cx="72" cy="36" r="15" fill="#E8B249"/>
+    <path fill-rule="evenodd" clip-rule="evenodd" d="M27 54C27 66.7025 37.2975 77 50 77H80C88.8366 77 96 69.8366 96 61C96 52.1634 88.8366 45 80 45C77.0716 45 74.327 45.7867 71.9659 47.1603C69.0538 37.7978 60.3207 31 50 31C37.2975 31 27 41.2975 27 54Z" fill="#8E9195"/>
+    <path fill-rule="evenodd" clip-rule="evenodd" d="M27 52C27 64.7025 37.2975 75 50 75H80C88.8366 75 96 67.8366 96 59C96 50.1634 88.8366 43 80 43C77.0716 43 74.327 43.7867 71.9659 45.1603C69.0538 35.7978 60.3207 29 50 29C37.2975 29 27 39.2975 27 52Z" fill="#C5C7C9"/>
+    <path fill-rule="evenodd" clip-rule="evenodd" d="M56 88H21C13.8203 88 8 82.1797 8 75C8 67.8203 13.8203 62 21 62C21.1487 62 21.2968 62.0025 21.4443 62.0075C23.2605 53.9878 30.431 48 39 48C48.2764 48 55.9138 55.0171 56.8937 64.0328C63.1038 64.49 68 69.6732 68 76C68 82.6274 62.6274 88 56 88Z" fill="#8E9195"/>
+    <path fill-rule="evenodd" clip-rule="evenodd" d="M56 86H21C13.8203 86 8 80.1797 8 73C8 65.8203 13.8203 60 21 60C21.1487 60 21.2968 60.0025 21.4443 60.0075C23.2605 51.9878 30.431 46 39 46C48.2764 46 55.9138 53.0171 56.8937 62.0328C63.1038 62.49 68 67.6732 68 74C68 80.6274 62.6274 86 56 86Z" fill="#E1E2E4"/>
+    <path fill-rule="evenodd" clip-rule="evenodd" d="M78 76C78 67.1634 70.8366 60 62 60C54.4554 60 48.1304 65.2219 46.4422 72.2487C45.6537 72.0857 44.8368 72 44 72C37.3726 72 32 77.3726 32 84C32 90.6274 37.3726 96 44 96H78C83.5228 96 88 91.5228 88 86C88 80.4772 83.5228 76 78 76Z" fill="#8E9195"/>
+    <path fill-rule="evenodd" clip-rule="evenodd" d="M78 74C78 65.1634 70.8366 58 62 58C54.4554 58 48.1304 63.2219 46.4422 70.2487C45.6537 70.0857 44.8368 70 44 70C37.3726 70 32 75.3726 32 82C32 88.6274 37.3726 94 44 94H78C83.5229 94 88 89.5229 88 84C88 78.4771 83.5229 74 78 74Z" fill="white"/>
+</symbol>
+</svg>

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web/wwwroot/images/close.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+<path d="M4.08859 4.21569L4.14645 4.14645C4.32001 3.97288 4.58944 3.9536 4.78431 4.08859L4.85355 4.14645L10 9.293L15.1464 4.14645C15.32 3.97288 15.5894 3.9536 15.7843 4.08859L15.8536 4.14645C16.0271 4.32001 16.0464 4.58944 15.9114 4.78431L15.8536 4.85355L10.707 10L15.8536 15.1464C16.0271 15.32 16.0464 15.5894 15.9114 15.7843L15.8536 15.8536C15.68 16.0271 15.4106 16.0464 15.2157 15.9114L15.1464 15.8536L10 10.707L4.85355 15.8536C4.67999 16.0271 4.41056 16.0464 4.21569 15.9114L4.14645 15.8536C3.97288 15.68 3.9536 15.4106 4.08859 15.2157L4.14645 15.1464L9.293 10L4.14645 4.85355C3.97288 4.67999 3.9536 4.41056 4.08859 4.21569Z"/>
+</svg>

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web/wwwroot/images/demos.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+<path d="M7.5 2C7.77614 2 8 2.22386 8 2.5V4.5C8 4.77614 7.77614 5 7.5 5C7.22386 5 7 4.77614 7 4.5V2.5C7 2.22386 7.22386 2 7.5 2ZM3.61091 3.61091C3.80618 3.41565 4.12276 3.41565 4.31802 3.61091L5.73223 5.02513C5.9275 5.22039 5.9275 5.53697 5.73223 5.73223C5.53697 5.92749 5.22039 5.92749 5.02513 5.73223L3.61091 4.31802C3.41565 4.12276 3.41565 3.80617 3.61091 3.61091ZM11.3891 3.61091C11.5843 3.80617 11.5843 4.12276 11.3891 4.31802L9.97487 5.73223C9.77961 5.9275 9.46303 5.9275 9.26777 5.73223C9.0725 5.53697 9.0725 5.22039 9.26777 5.02513L10.682 3.61091C10.8772 3.41565 11.1938 3.41565 11.3891 3.61091ZM2 7.5C2 7.22386 2.22386 7 2.5 7H4.5C4.77614 7 5 7.22386 5 7.5C5 7.77614 4.77614 8 4.5 8H2.5C2.22386 8 2 7.77614 2 7.5ZM8.64019 7.2993C7.98886 6.75653 7 7.21968 7 8.06752V17.1693C7 18.0926 8.14454 18.5227 8.75258 17.8278L10.7787 15.5122C11.0635 15.1867 11.475 15 11.9075 15H15.119C16.0543 15 16.4777 13.8305 15.7592 13.2318L8.64019 7.2993ZM8 17.1693L8 8.06752L15.119 14H11.9075C11.1866 14 10.5008 14.3112 10.0261 14.8537L8 17.1693Z"/>
+</svg>

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web/wwwroot/images/doc.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+<path d="M5.5 5C5.22386 5 5 5.22386 5 5.5V7.5C5 7.77614 5.22386 8 5.5 8H12.5C12.7761 8 13 7.77614 13 7.5V5.5C13 5.22386 12.7761 5 12.5 5H5.5ZM6 7V6H12V7H6ZM3 4C3 2.89543 3.89543 2 5 2H13C14.1046 2 15 2.89543 15 4V16C15 17.1046 14.1046 18 13 18H5C3.89543 18 3 17.1046 3 16V4ZM5 3C4.44772 3 4 3.44772 4 4V16C4 16.5523 4.44772 17 5 17H13C13.5523 17 14 16.5523 14 16V4C14 3.44772 13.5523 3 13 3H5ZM16 6H16.5C16.7761 6 17 6.22386 17 6.5V8C17 8.27614 16.7761 8.5 16.5 8.5H16V6ZM16.5 9.5H16V12H16.5C16.7761 12 17 11.7761 17 11.5V10C17 9.72386 16.7761 9.5 16.5 9.5ZM16 13H16.5C16.7761 13 17 13.2239 17 13.5V15C17 15.2761 16.7761 15.5 16.5 15.5H16V13Z"/>
+</svg>

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web/wwwroot/images/logo.svg

@@ -0,0 +1,16 @@
+<svg viewBox="0 0 144 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M34.6184 3.1643C33.0578 3.1643 31.5947 3.31034 30.4731 3.50507V19.2779C31.3021 19.3753 32.4726 19.4726 33.9844 19.4726C36.7643 19.4726 39.0077 18.8398 40.4707 17.5254C41.69 16.4057 42.9092 14.4097 42.9092 10.9533C42.9092 8.03246 42.0313 6.08519 40.4707 4.81947C39.1052 3.74848 37.3007 3.1643 34.6184 3.1643ZM34.716 17.0385C34.2771 17.0385 33.8381 17.0385 33.5455 16.9899V5.74442C33.8869 5.69574 34.3746 5.59838 35.0086 5.59838C37.886 5.59838 39.6417 7.39959 39.6417 11.002C39.6417 15.2373 37.6421 17.0385 34.716 17.0385Z" fill="white"/>
+<path d="M49.7369 7.49696C46.323 7.49696 44.421 10.3692 44.421 13.7282C44.421 17.3306 46.4693 19.57 50.0783 19.57C51.5413 19.57 52.8581 19.3266 53.8335 18.8884L53.3946 16.7465C52.6143 17.0385 51.6876 17.2333 50.566 17.2333C48.9078 17.2333 47.4935 16.4544 47.396 14.4584H54.37C54.4187 14.1176 54.4675 13.6795 54.4675 13.2414C54.4187 9.4929 52.5655 7.49696 49.7369 7.49696ZM47.3472 12.3164C47.4447 11.1481 48.0787 9.63895 49.5418 9.63895C51.0536 9.63895 51.5413 11.0994 51.5413 12.3164H47.3472Z" fill="white"/>
+<path d="M63.0509 7.74037L61.5878 13.3874C61.3439 14.4097 61.1489 15.3347 60.9538 16.357H60.905C60.7099 15.3347 60.5149 14.4097 60.271 13.3874L58.7592 7.74037H55.4429L59.3444 19.3753H62.3193L66.2696 7.74037H63.0509Z" fill="white"/>
+<path d="M2.04062 18.2556C1.45539 18.9858 1.01647 19.6673 0.723857 20.2515C0.626318 20.3976 0.480011 20.8357 0.480011 21.1278V21.5659C0.480011 22.2961 1.06524 22.8803 1.79678 22.8803H22.0848C22.8163 22.8803 23.4015 22.2961 23.4015 21.5659V5.98783C12.2822 7.93509 5.552 13.9229 2.04062 18.2556Z" fill="white"/>
+<path d="M71.0978 12.3164H76.3649V9.78499H71.0978V5.89047H76.6575V3.31034H68.0253V19.3266H76.9989V16.7465H71.0978V12.3164Z" fill="white"/>
+<path d="M88.6547 7.74037H85.3872L84.363 9.83367C84.0704 10.4179 83.7778 11.0507 83.4851 11.6836H83.4364C83.1438 11.0994 82.8512 10.5152 82.5585 9.83367L81.4368 7.74037H78.023L81.4856 13.4848L77.9742 19.3753H81.2905L82.3635 17.1359C82.6561 16.5517 82.9487 15.9189 83.2413 15.286H83.2901C83.5827 15.9189 83.8753 16.503 84.1679 17.1359L85.3384 19.3753H88.801L85.2896 13.3874L88.6547 7.74037Z" fill="white"/>
+<path d="M96.5065 7.49696C94.9947 7.49696 93.8242 8.12982 93.0439 9.34686H92.9951L92.8488 7.74037H90.1665C90.2153 8.81136 90.2641 10.0284 90.2641 11.5375V24H93.3365V18.2069H93.3853C93.873 18.9858 94.8484 19.57 96.1164 19.57C98.4573 19.57 100.896 17.6714 100.896 13.4361C100.945 9.83367 99.0425 7.49696 96.5065 7.49696ZM95.4336 17.1359C94.4094 17.1359 93.3853 16.3083 93.3853 14.6531V12.4625C93.3853 11.0507 94.3119 9.93103 95.5311 9.93103C97.043 9.93103 97.8721 11.4402 97.8721 13.4848C97.8233 15.6268 96.9942 17.1359 95.4336 17.1359Z" fill="white"/>
+<path d="M105.919 9.73631H105.821L105.675 7.69168H103.042C103.09 8.714 103.139 9.88235 103.139 11.3428V19.3266H106.212V13.3387C106.212 11.3428 107.285 10.4179 108.65 10.4179C108.943 10.4179 109.235 10.4179 109.43 10.4665V7.54564C109.235 7.49696 109.04 7.49696 108.748 7.49696C107.675 7.49696 106.455 8.22718 105.919 9.73631Z" fill="white"/>
+<path d="M115.868 7.49696C112.454 7.49696 110.552 10.3692 110.552 13.7282C110.552 17.3306 112.6 19.57 116.209 19.57C117.672 19.57 118.989 19.3266 119.965 18.8884L119.526 16.7465C118.745 17.0385 117.819 17.2333 116.697 17.2333C115.039 17.2333 113.625 16.4544 113.527 14.4584H120.452C120.501 14.1176 120.55 13.6795 120.55 13.2414C120.55 9.4929 118.697 7.49696 115.868 7.49696ZM113.478 12.3164C113.576 11.1481 114.21 9.63894 115.673 9.63894C117.185 9.63894 117.672 11.0994 117.672 12.3164H113.478Z" fill="white"/>
+<path d="M126.938 12.3164C125.622 11.7323 125.183 11.4402 125.183 10.7586C125.183 10.1258 125.67 9.63894 126.646 9.63894C127.524 9.63894 128.353 9.97972 128.84 10.2231L129.426 8.03245C128.743 7.69168 127.719 7.39959 126.548 7.39959C123.964 7.39959 122.305 9.00609 122.305 11.0507C122.305 12.3164 123.086 13.5335 125.28 14.4097C126.548 14.9452 126.938 15.3347 126.938 16.0162C126.938 16.7465 126.402 17.1846 125.329 17.1846C124.354 17.1846 123.232 16.7465 122.598 16.4057L122.013 18.645C122.793 19.0832 124.012 19.4239 125.28 19.4239C128.206 19.4239 129.865 17.9635 129.865 15.7728C129.816 14.2637 128.938 13.144 126.938 12.3164Z" fill="white"/>
+<path d="M136.205 12.3164C134.888 11.7323 134.449 11.4402 134.449 10.7586C134.449 10.1258 134.937 9.63894 135.912 9.63894C136.79 9.63894 137.619 9.97972 138.107 10.2231L138.692 8.03245C138.009 7.69168 136.985 7.39959 135.814 7.39959C133.23 7.39959 131.572 9.00609 131.572 11.0507C131.572 12.3164 132.352 13.5335 134.546 14.4097C135.814 14.9452 136.205 15.3347 136.205 16.0162C136.205 16.7465 135.668 17.1846 134.595 17.1846C133.62 17.1846 132.498 16.7465 131.864 16.4057L131.279 18.645C132.059 19.0832 133.278 19.4239 134.546 19.4239C137.473 19.4239 139.131 17.9635 139.131 15.7728C139.082 14.2637 138.155 13.144 136.205 12.3164Z" fill="white"/>
+<path d="M22.0848 0H1.79678C1.06524 0 0.480011 0.584179 0.480011 1.3144V13.4361C4.47908 9.24949 11.6482 4.62475 22.5237 3.35903C22.8163 3.35903 23.4015 3.21298 23.4015 2.43408V1.3144C23.4015 0.584179 22.8163 0 22.0848 0Z" fill="white"/>
+<path d="M142.057 7.05882C142.398 6.96146 142.593 6.76674 142.593 6.47465C142.593 6.27992 142.545 6.13387 142.398 6.03651C142.252 5.93915 142.057 5.89047 141.764 5.89047H141.082V8.03246H141.52V7.15619H141.716C141.862 7.15619 141.959 7.25355 142.008 7.44828L142.203 7.98377H142.691L142.447 7.39959C142.301 7.20487 142.203 7.05882 142.057 7.05882ZM141.764 6.81542H141.472V6.18256H141.716C142.008 6.18256 142.106 6.27992 142.106 6.47465C142.106 6.57201 142.057 6.62069 142.008 6.71805C141.959 6.81542 141.911 6.81542 141.764 6.81542Z" fill="white"/>
+<path d="M143.032 5.74442C142.691 5.40365 142.301 5.25761 141.813 5.25761C141.325 5.25761 140.886 5.40365 140.594 5.74442C140.252 6.08519 140.106 6.47465 140.106 6.96146C140.106 7.44828 140.252 7.83773 140.594 8.1785C140.935 8.47059 141.325 8.66531 141.813 8.66531C142.301 8.66531 142.691 8.51927 143.032 8.1785C143.374 7.83773 143.52 7.44828 143.52 6.96146C143.52 6.47465 143.374 6.08519 143.032 5.74442ZM142.837 7.98377C142.545 8.27586 142.203 8.42191 141.813 8.42191C141.423 8.42191 141.082 8.27586 140.789 8.03245C140.496 7.74037 140.35 7.39959 140.35 7.01014C140.35 6.62069 140.496 6.27992 140.789 5.98783C141.082 5.69574 141.423 5.5497 141.813 5.5497C142.203 5.5497 142.593 5.69574 142.837 5.98783C143.13 6.27992 143.276 6.62069 143.276 7.01014C143.227 7.35091 143.081 7.69168 142.837 7.98377Z" fill="white"/>
+</svg>

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web/wwwroot/images/menu.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+<path d="M2 4.5C2 4.22386 2.22386 4 2.5 4H17.5C17.7761 4 18 4.22386 18 4.5C18 4.77614 17.7761 5 17.5 5H2.5C2.22386 5 2 4.77614 2 4.5ZM2 9.5C2 9.22386 2.22386 9 2.5 9H17.5C17.7761 9 18 9.22386 18 9.5C18 9.77614 17.7761 10 17.5 10H2.5C2.22386 10 2 9.77614 2 9.5ZM2.5 14C2.22386 14 2 14.2239 2 14.5C2 14.7761 2.22386 15 2.5 15H17.5C17.7761 15 18 14.7761 18 14.5C18 14.2239 17.7761 14 17.5 14H2.5Z"/>
+</svg>

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web/wwwroot/images/pages/counter.svg

@@ -0,0 +1,4 @@
+<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+<path d="M12 7C12.2761 7 12.4999 7.22394 12.5 7.5C12.5 7.77614 12.2761 8 12 8H9.24805L9.05859 9.74023C9.1367 9.73932 9.2198 9.73775 9.30469 9.7373C9.72449 9.73511 10.2541 9.74019 10.5254 9.77832C12.0975 9.99951 13.1926 11.4532 12.9717 13.0254C12.7506 14.5976 11.2969 15.6926 9.72461 15.4717C8.75136 15.3348 7.96091 14.7255 7.55273 13.9102C7.42918 13.6632 7.52946 13.3629 7.77637 13.2393C8.02327 13.1158 8.32368 13.216 8.44727 13.4629C8.71464 13.9967 9.23033 14.3924 9.86426 14.4814C10.8896 14.6254 11.8373 13.9111 11.9814 12.8857C12.1255 11.8604 11.4111 10.9127 10.3857 10.7686C10.2017 10.7427 9.75352 10.735 9.30957 10.7373C9.09662 10.7384 8.89716 10.7423 8.75098 10.7451C8.67802 10.7465 8.61837 10.7471 8.57715 10.748L8.53027 10.75H8.51367C8.36935 10.754 8.2307 10.695 8.13281 10.5889C8.03499 10.4828 7.98738 10.3398 8.00293 10.1963L8.30273 7.44629C8.3304 7.1927 8.54473 7.00009 8.7998 7H12Z"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M13.7559 2.0127C15.0164 2.14082 16 3.20566 16 4.5V15.5C16 16.8807 14.8807 18 13.5 18H6.5C5.11929 18 4 16.8807 4 15.5V4.5C4 3.11929 5.11929 2 6.5 2H13.5L13.7559 2.0127ZM6.5 3C5.67157 3 5 3.67157 5 4.5V15.5C5 16.3284 5.67157 17 6.5 17H13.5C14.3284 17 15 16.3284 15 15.5V4.5C15 3.67157 14.3284 3 13.5 3H12.8369C12.4546 4.15802 11.4097 5 10 5C9.13757 5 8.24072 4.71025 7.56543 3.95996C7.32396 3.69166 7.12023 3.37196 6.95605 3H6.5ZM8.27148 3C8.61688 3.59728 9.26022 4 10 4C10.8124 4 11.4337 3.60128 11.7549 3H8.27148Z"/>
+</svg>

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web/wwwroot/images/pages/document-pdf.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
+  <path d="M3 12C4.10457 12 5 12.8954 5 14C5 15.1046 4.10457 16 3 16H2V17.5C2 17.7761 1.77614 18 1.5 18C1.22386 18 1 17.7761 1 17.5V12.5C1 12.2239 1.22386 12 1.5 12H3ZM2 15H3C3.55228 15 4 14.5523 4 14C4 13.4477 3.55228 13 3 13H2V15ZM8 12C9.10457 12 10 12.8954 10 14V16C10 17.1046 9.10457 18 8 18H6.5C6.22386 18 6 17.7761 6 17.5V12.5C6 12.2239 6.22386 12 6.5 12H8ZM7 17H8C8.55228 17 9 16.5523 9 16V14C9 13.4477 8.55228 13 8 13H7V17ZM14.1006 12.0098C14.3286 12.0563 14.5 12.2583 14.5 12.5C14.5 12.7417 14.3286 12.9437 14.1006 12.9902L14 13H12V14.5H13.5C13.7761 14.5 14 14.7239 14 15C14 15.2761 13.7761 15.5 13.5 15.5H12V17.5C12 17.7761 11.7761 18 11.5 18C11.2239 18 11 17.7761 11 17.5V12.5C11 12.2239 11.2239 12 11.5 12H14L14.1006 12.0098ZM10.5859 2C10.9837 2.00004 11.3652 2.15818 11.6465 2.43945L15.5605 6.35352C15.8418 6.63478 16 7.01629 16 7.41406V16C16 17.1046 15.1046 18 14 18H12.9131C12.9685 17.8435 13 17.6755 13 17.5V17H14C14.5523 17 15 16.5523 15 16V13.6143C15.3063 13.3403 15.5 12.9436 15.5 12.5C15.5 12.0562 15.3063 11.6584 15 11.3838V8H11.5C10.6716 8 10 7.32843 10 6.5V3H6C5.44772 3 5 3.44772 5 4V11.6318C4.71042 11.3921 4.37137 11.211 4 11.1055V4C4 2.89543 4.89543 2 6 2H10.5859ZM11 6.5C11 6.77614 11.2239 7 11.5 7H14.793L11 3.20703V6.5Z"/>
+</svg>

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web/wwwroot/images/pages/home.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+<path d="M8.9975 2.38811C9.56767 1.87584 10.4323 1.87584 11.0025 2.38811L16.5025 7.32965C16.8191 7.61414 17 8.01977 17 8.44544V15.4996C17 16.328 16.3284 16.9996 15.5 16.9996H13C12.1716 16.9996 11.5 16.328 11.5 15.4996V11.9996C11.5 11.7234 11.2761 11.4996 11 11.4996H9C8.72386 11.4996 8.5 11.7234 8.5 11.9996V15.4996C8.5 16.328 7.82843 16.9996 7 16.9996H4.5C3.67157 16.9996 3 16.328 3 15.4996V8.44544C3 8.01977 3.18086 7.61414 3.4975 7.32965L8.9975 2.38811ZM10.3342 3.13197C10.1441 2.96122 9.85589 2.96122 9.66583 3.13197L4.16583 8.07351C4.06029 8.16834 4 8.30355 4 8.44544V15.4996C4 15.7757 4.22386 15.9996 4.5 15.9996H7C7.27614 15.9996 7.5 15.7757 7.5 15.4996V11.9996C7.5 11.1711 8.17157 10.4996 9 10.4996H11C11.8284 10.4996 12.5 11.1711 12.5 11.9996V15.4996C12.5 15.7757 12.7239 15.9996 13 15.9996H15.5C15.7761 15.9996 16 15.7757 16 15.4996V8.44544C16 8.30355 15.9397 8.16834 15.8342 8.07351L10.3342 3.13197Z"/>
+</svg>

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web/wwwroot/images/pages/weather.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+<path d="M11 7C13.4646 7 14.8627 8.5736 15.066 10.474L15.1282 10.474C16.7143 10.474 18 11.711 18 13.237C18 14.763 16.7143 16 15.1282 16H6.8718C5.28575 16 4.00001 14.763 4.00001 13.237C4.00001 11.711 5.28575 10.474 6.87182 10.474L6.934 10.474C7.13852 8.56111 8.53544 7 11 7ZM11 8C9.35057 8 7.9129 9.27029 7.9129 11.0249C7.9129 11.303 7.65892 11.5211 7.36809 11.5211L6.81819 11.5211C5.81403 11.5211 5.00001 12.2999 5.00001 13.2605C5.00001 14.2212 5.81403 15 6.81819 15H15.1818C16.186 15 17 14.2212 17 13.2605C17 12.2999 16.186 11.5211 15.1818 11.5211L14.6319 11.5211C14.3411 11.5211 14.0871 11.303 14.0871 11.0249C14.0871 9.24779 12.6494 8 11 8ZM3.80323 9.70081C3.88315 9.9329 3.78237 10.1835 3.57561 10.2995L3.49326 10.3364L2.69185 10.6123C2.43075 10.7022 2.14621 10.5634 2.05631 10.3023C1.97639 10.0702 2.07717 9.81963 2.28393 9.70366L2.36628 9.66678L3.16769 9.39083C3.42879 9.30093 3.71333 9.43971 3.80323 9.70081ZM8.91929 5.50023C9.25181 5.66241 9.54462 5.87337 9.79331 6.12029C9.38698 6.20342 9.00724 6.33003 8.65692 6.4951C8.60128 6.46105 8.54207 6.42885 8.48091 6.39902C7.34909 5.84699 5.98405 6.31701 5.43202 7.44884C5.04721 8.23783 5.15904 9.14013 5.6455 9.80137C5.31553 9.89962 5.00518 10.0425 4.72106 10.2221C4.124 9.29064 4.01237 8.07839 4.53323 7.01047C5.32736 5.38225 7.29107 4.70609 8.91929 5.50023ZM2.91582 5.66976L3.00013 5.70192L3.76194 6.07348C4.01013 6.19453 4.1132 6.49387 3.99215 6.74206C3.88455 6.96268 3.63608 7.06863 3.40788 7.00443L3.32357 6.97227L2.56176 6.60072C2.31357 6.47966 2.2105 6.18033 2.33155 5.93214C2.43915 5.71152 2.68762 5.60557 2.91582 5.66976ZM9.98918 3.2954C10.2098 3.403 10.3157 3.65147 10.2515 3.87967L10.2194 3.96398L9.84783 4.72579C9.72678 4.97398 9.42745 5.07705 9.17925 4.956C8.95863 4.8484 8.85268 4.59993 8.91688 4.37173L8.94904 4.28742L9.3206 3.52561C9.44165 3.27742 9.74098 3.17435 9.98918 3.2954ZM6.19931 3.26298L6.23619 3.34533L6.51213 4.14674C6.60204 4.40784 6.46326 4.69238 6.20216 4.78228C5.97007 4.8622 5.71946 4.76142 5.60349 4.55466L5.56662 4.47231L5.29067 3.6709C5.20077 3.4098 5.33955 3.12526 5.60064 3.03536C5.83273 2.95544 6.08334 3.05622 6.19931 3.26298Z"/>
+</svg>

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web/wwwroot/js/error-space.js

@@ -0,0 +1,77 @@
+function drawVisor() {
+    const canvas = document.getElementById('visor');
+    const ctx = canvas.getContext('2d');
+
+    ctx.beginPath();
+    ctx.moveTo(5, 45);
+    ctx.bezierCurveTo(15, 64, 45, 64, 55, 45);
+
+    ctx.lineTo(55, 20);
+    ctx.bezierCurveTo(55, 15, 50, 10, 45, 10);
+
+    ctx.lineTo(15, 10);
+
+    ctx.bezierCurveTo(15, 10, 5, 10, 5, 20);
+    ctx.lineTo(5, 45);
+
+    ctx.fillStyle = '#2f3640';
+    ctx.strokeStyle = '#f5f6fa';
+    ctx.fill();
+    ctx.stroke();
+}
+
+const cordCanvas = document.getElementById('cord');
+const ctx = cordCanvas.getContext('2d');
+
+let y1 = 160;
+let y2 = 100;
+let y3 = 100;
+
+let y1Forward = true;
+let y2Forward = false;
+let y3Forward = true;
+
+function animate() {
+    requestAnimationFrame(animate);
+    ctx.clearRect(0, 0, innerWidth, innerHeight);
+
+    ctx.beginPath();
+    ctx.moveTo(130, 170);
+    ctx.bezierCurveTo(250, y1, 345, y2, 400, y3);
+
+    ctx.strokeStyle = 'white';
+    ctx.lineWidth = 8;
+    ctx.stroke();
+
+
+    if (y1 === 100) {
+        y1Forward = true;
+    }
+
+    if (y1 === 300) {
+        y1Forward = false;
+    }
+
+    if (y2 === 100) {
+        y2Forward = true;
+    }
+
+    if (y2 === 310) {
+        y2Forward = false;
+    }
+
+    if (y3 === 100) {
+        y3Forward = true;
+    }
+
+    if (y3 === 317) {
+        y3Forward = false;
+    }
+
+    y1Forward ? y1 += 1 : y1 -= 1;
+    y2Forward ? y2 += 1 : y2 -= 1;
+    y3Forward ? y3 += 1 : y3 -= 1;
+}
+
+drawVisor();
+animate();

receiverUI/EnvelopeGenerator.ReceiverUI.Web/EnvelopeGenerator.ReceiverUI.Web/wwwroot/js/signature-pad.js

@@ -0,0 +1,114 @@
+// Minimal signature-pad implementation used by SignaturePadDialog.razor.
+// Exposes window.signaturePad with attach() / clear() / toDataUrl() / detach().
+//
+// Why a hand-rolled implementation instead of a library?
+//   • Zero external dependencies (no npm / no bundler).
+//   • Works identically under InteractiveServer and InteractiveWebAssembly
+//     because the Blazor side only calls four trivial JS functions.
+//   • Supports both mouse and pointer/touch events.
+window.signaturePad = (function () {
+    const instances = new Map();
+
+    function resize(canvas) {
+        // Backing store size must follow the DPR so the line stays crisp.
+        const ratio = window.devicePixelRatio || 1;
+        const rect = canvas.getBoundingClientRect();
+        canvas.width = Math.max(1, rect.width * ratio);
+        canvas.height = Math.max(1, rect.height * ratio);
+        const ctx = canvas.getContext('2d');
+        ctx.scale(ratio, ratio);
+        ctx.lineWidth = 2;
+        ctx.lineCap = 'round';
+        ctx.lineJoin = 'round';
+        ctx.strokeStyle = '#0d2540';
+    }
+
+    function attach(canvasId) {
+        const canvas = document.getElementById(canvasId);
+        if (!canvas) return false;
+        if (instances.has(canvasId)) detach(canvasId);
+
+        resize(canvas);
+        const ctx = canvas.getContext('2d');
+        let drawing = false;
+        let hasInk = false;
+        let last = { x: 0, y: 0 };
+
+        function pos(ev) {
+            const rect = canvas.getBoundingClientRect();
+            const clientX = ev.touches ? ev.touches[0].clientX : ev.clientX;
+            const clientY = ev.touches ? ev.touches[0].clientY : ev.clientY;
+            return { x: clientX - rect.left, y: clientY - rect.top };
+        }
+        function start(ev) {
+            ev.preventDefault();
+            drawing = true;
+            last = pos(ev);
+        }
+        function move(ev) {
+            if (!drawing) return;
+            ev.preventDefault();
+            const p = pos(ev);
+            ctx.beginPath();
+            ctx.moveTo(last.x, last.y);
+            ctx.lineTo(p.x, p.y);
+            ctx.stroke();
+            last = p;
+            hasInk = true;
+        }
+        function end() { drawing = false; }
+
+        const onResize = () => {
+            const data = canvas.toDataURL();
+            resize(canvas);
+            const img = new Image();
+            img.onload = () => ctx.drawImage(img, 0, 0, canvas.getBoundingClientRect().width, canvas.getBoundingClientRect().height);
+            img.src = data;
+        };
+
+        canvas.addEventListener('mousedown', start);
+        canvas.addEventListener('mousemove', move);
+        canvas.addEventListener('mouseup', end);
+        canvas.addEventListener('mouseleave', end);
+        canvas.addEventListener('touchstart', start, { passive: false });
+        canvas.addEventListener('touchmove', move, { passive: false });
+        canvas.addEventListener('touchend', end);
+        window.addEventListener('resize', onResize);
+
+        instances.set(canvasId, {
+            canvas, ctx,
+            hasInk: () => hasInk,
+            clear: () => { ctx.clearRect(0, 0, canvas.width, canvas.height); hasInk = false; },
+            toDataUrl: () => hasInk ? canvas.toDataURL('image/png') : null,
+            cleanup: () => {
+                canvas.removeEventListener('mousedown', start);
+                canvas.removeEventListener('mousemove', move);
+                canvas.removeEventListener('mouseup', end);
+                canvas.removeEventListener('mouseleave', end);
+                canvas.removeEventListener('touchstart', start);
+                canvas.removeEventListener('touchmove', move);
+                canvas.removeEventListener('touchend', end);
+                window.removeEventListener('resize', onResize);
+            }
+        });
+        return true;
+    }
+
+    function clear(canvasId) {
+        instances.get(canvasId)?.clear();
+    }
+
+    function toDataUrl(canvasId) {
+        return instances.get(canvasId)?.toDataUrl() ?? null;
+    }
+
+    function detach(canvasId) {
+        const inst = instances.get(canvasId);
+        if (inst) {
+            inst.cleanup();
+            instances.delete(canvasId);
+        }
+    }
+
+    return { attach, clear, toDataUrl, detach };
+})();