Refactor signature handling with SignatureCaptureDto

Introduced a new `SignatureCaptureDto` model to encapsulate
signature-related data and metadata, replacing the previous
`SignatureCapture` type in `EnvelopeViewer.razor`.

- Added `SignatureCaptureDto` in `SignatureCaptureDto.cs` with
  properties for signature image, signer name, position, and place.
- Updated `_capturedSignature` to use `SignatureCaptureDto` for
  consistency and maintainability.
- Refactored signature capture logic to initialize
  `SignatureCaptureDto` using object initializer syntax.
- Improved code clarity with detailed XML documentation for
  `SignatureCaptureDto`.

These changes enhance maintainability, readability, and ensure
a centralized model for signature-related data.

COPILOT_CONTEXT_EN.md

@@ -0,0 +1,946 @@
+# EnvelopeGenerator — Copilot Context Notes (English)
+
+## Purpose
+A digital document signing system. Senders upload PDFs and place signature annotation fields via PSPDFKit (EnvelopeGenerator.Web). Receivers open the document in a Blazor WASM viewer, confirm each signature field via a checkbox overlay, draw/type/upload their signature, and export the stamped PDF.
+
+---
+
+## Solution Structure
+
+| Project | Target | Description |
+|---|---|---|
+| `EnvelopeGenerator.API` | net8.0 | ASP.NET Core Web API. Receiver auth (cookie), annotation reading, PDF serving. |
+| `EnvelopeGenerator.ReceiverUI` | net8.0 WASM | Blazor WebAssembly. Receiver UI. YARP proxies API calls. |
+| `EnvelopeGenerator.Web` | net7/8/9 | Razor Pages. Sender UI + PSPDFKit annotation placement. |
+| `EnvelopeGenerator.Application` | multi | MediatR CQRS handlers. |
+| `EnvelopeGenerator.Domain` | multi | Domain models, constants, interfaces. |
+| `EnvelopeGenerator.Infrastructure` | multi | EF Core repos, DB context. |
+| `EnvelopeGenerator.PdfEditor` | multi | iText7 utilities. NOT used in ReceiverUI flow. |
+| `EnvelopeGenerator.DependencyInjection` | multi | DI registration helpers. |
+| VB.NET projects (Service/Form/BBTests) | net462 | Legacy. Do NOT touch. |
+
+---
+
+## Key Files
+
+| File | Purpose |
+|---|---|
+| `ReceiverUI/Pages/EnvelopeViewer.razor` | **NEW** PDF.js-based viewer (`/envelope/{key}`). Replaces ReportViewer.razor. Simple read-only PDF viewing with zoom/navigation. |
+| `ReceiverUI/Pages/ReportViewer.razor` | **LEGACY** DevExpress-based signing page (`/receiver/{key}`). Still used for signature workflow. Will be deprecated. |
+| `ReceiverUI/wwwroot/js/pdf-viewer.js` | **NEW** PDF.js wrapper: rendering, zoom, pagination, mouse wheel control. |
+| `ReceiverUI/wwwroot/js/receiver-signature.js` | JS: checkbox overlay, signature pad (draw/type/image). |
+| `ReceiverUI/wwwroot/css/envelope-viewer.css` | **NEW** Styles for EnvelopeViewer.razor (external CSS, not inline). |
+| `ReceiverUI/wwwroot/fake-data/annotations.json` | Dev-mode fake annotations (YARP proxy target). |
+| `ReceiverUI/Models/AnnotationDto.cs` | Annotation position model. All properties non-nullable. |
+| `ReceiverUI/Services/AnnotationService.cs` | Fetches `List<AnnotationDto>` from API or fake-data. |
+| `ReceiverUI/Services/DocumentService.cs` | Fetches PDF bytes from API. |
+| `ReceiverUI/Services/AuthService.cs` | Manages receiver session cookie. |
+| `API/Controllers/AnnotationController.cs` | GET `api/Annotation/{key}` ? annotation list. |
+| `API/Controllers/DocumentController.cs` | GET `api/Document/{key}` ? PDF bytes. |
+
+---
+
+## SignatureDto / AnnotationDto — Coordinate System
+
+**Database Storage Format:** INCHES (GdPicture14 native unit)  
+**Origin:** Top-left corner of page  
+**Axes:** X increases rightward, Y increases downward
+
+### Source Evidence (VB.NET Legacy Code)
+
+```vb
+' From: EnvelopeGenerator.Form/frmFieldEditor.vb
+' GdPicture14.Annotations.AnnotationStickyNote
+
+'Breite und Höhe in Inches (4,5*5cm)
+Private Const SIGNATURE_WIDTH As Single = 1.77   ' 1.77 inches = 4.5cm
+Private Const SIGNATURE_HEIGHT As Single = 1.96  ' 1.96 inches = 5cm
+
+Sub LoadAnnotation(pElement As Signature, ...)
+    oAnnotation.Left = CSng(pElement.X)      ' Direct assignment ? INCHES
+    oAnnotation.Top = CSng(pElement.Y)
+    oAnnotation.Width = CSng(pElement.Width)
+    oAnnotation.Height = CSng(pElement.Height)
+End Sub
+```
+
+### Conversion Formulas
+
+```
+Inches ? DevExpress (DX):  x_DX = x_inches * 100.0
+                          y_DX = y_inches * 100.0
+
+Inches ? PDF Points:       x_pt = x_inches * 72.0
+                          y_pt = x_inches * 72.0
+
+Inches ? PDF.js Canvas:    normalize to [0,1], then scale to pixels
+                          x_norm = x_inches / pageWidth_inches
+                          y_norm = y_inches / pageHeight_inches
+                          x_px = x_norm * canvasWidth * scale * dpr
+                          y_px = y_norm * canvasHeight * scale * dpr
+```
+
+### Unit Comparison Table
+
+| System | Unit | Origin | Conversion from INCHES |
+|--------|------|--------|------------------------|
+| **GdPicture14** (Source) | **Inches** | Top-left | Database format (no conversion) |
+| DevExpress (LEGACY) | 1/100 inch (DX) | Top-left | `x_DX = x_inches * 100` |
+| PDF.js (NEW) | Pixels | Top-left | `normalize ? scale` |
+| PDF Points (iText7) | Points (1/72") | **Bottom-left** | `x_pt = x_inches * 72` + Y-flip |
+| PSPDFKit (Web) | Points (1/72") | Top-left | `x_pt = x_inches * 72` |
+
+**A4 Page Dimensions:**
+- Width: 8.27 inches = 595 points = 827 DX units
+- Height: 11.69 inches = 842 points = 1169 DX units
+
+---
+
+## EnvelopeViewer (NEW) — PDF.js Read-Only Viewer
+
+**Route:** `/envelope/{EnvelopeKey}`  
+**Purpose:** Modern, high-performance PDF viewing without signing functionality.  
+**Technology:** PDF.js 3.11.174 + custom JavaScript + configurable quality settings
+
+### Architecture
+
+**Blazor Component (`EnvelopeViewer.razor`):**
+- Fetches PDF via `DocumentService.GetDocumentAsync(EnvelopeKey)`
+- Converts to base64 data URL: `data:application/pdf;base64,{base64}`
+- Initializes PDF.js viewer via JSInterop with `DotNetObjectReference` for callbacks
+- Quality settings loaded from `appsettings.json` via `IOptions<PdfViewerOptions>`
+- Thumbnail sidebar with resizable splitter (150px-400px, localStorage persistence)
+- CSS externalized to `envelope-viewer.css`
+
+**JavaScript (`pdf-viewer.js`):**
+```javascript
+window.pdfViewer = {
+    qualityOptions,              // Configurable from appsettings.json
+    setQualityOptions(options),  // Dynamic quality update
+    initialize(canvasId, pdfDataUrl, dotNetRef),
+    renderPage(num),
+    renderThumbnail(pageNum, canvasId),
+    attachWheelEvent(),          // Ctrl+Wheel zoom (configurable step)
+    zoomIn(), zoomOut(),         // Configurable step percentage
+    dispose()
+}
+```
+
+**Options (`PdfViewerOptions.cs`):**
+```csharp
+public class PdfViewerOptions {
+    public double ThumbnailBaseScale { get; set; } = 0.75;      // 0.2-1.5
+    public bool ThumbnailEnableHiDPI { get; set; } = true;
+    public double ThumbnailMaxDPR { get; set; } = 2.0;          // 1.0-3.0
+    public bool MainCanvasEnableHiDPI { get; set; } = true;
+    public double MainCanvasMaxDPR { get; set; } = 2.0;
+    public bool EnableSmoothZoom { get; set; } = true;
+    public int ZoomTransitionDuration { get; set; } = 150;      // ms
+    public double RenderingOpacity { get; set; } = 0.85;        // 0.0-1.0
+    public int ThumbnailRenderDelay { get; set; } = 50;         // ms
+    public int ZoomStepPercentage { get; set; } = 5;            // 1-50%
+}
+```
+
+### Configuration (appsettings.json)
+
+**Location:** `EnvelopeGenerator.ReceiverUI/wwwroot/appsettings.json`
+
+```json
+{
+  "PdfViewer": {
+    "ThumbnailBaseScale": 0.75,
+    "ThumbnailEnableHiDPI": true,
+    "ThumbnailMaxDPR": 2.0,
+    "MainCanvasEnableHiDPI": true,
+    "MainCanvasMaxDPR": 2.0,
+    "EnableSmoothZoom": true,
+    "ZoomTransitionDuration": 150,
+    "RenderingOpacity": 0.85,
+    "ThumbnailRenderDelay": 50,
+    "ZoomStepPercentage": 5
+  }
+}
+```
+
+**Usage:** Edit file ? F5 (browser refresh) ? new settings applied
+
+**Presets:**
+- **High Quality**: `ThumbnailBaseScale: 1.0, MaxDPR: 3.0` (powerful devices)
+- **Balanced**: Default values (recommended)
+- **Performance**: `ThumbnailBaseScale: 0.5, EnableHiDPI: false` (mobile/low-end)
+
+---
+
+### Features
+
+1. **HiDPI/Retina Support** ? 4x quality on Retina displays
+2. **Configurable Quality** ? All parameters in appsettings.json
+3. **Unlimited Zoom** ? 50%-300%, configurable step (default 5%)
+4. **Global Ctrl+Wheel Zoom** ? Works anywhere on page
+5. **Thumbnail Sidebar** ? Resizable (150-400px), high-quality rendering
+6. **Smooth Transitions** ? Configurable fade effect
+7. **Responsive Design** ? Desktop/mobile adaptive layout
+
+---
+
+### Features
+
+1. **Unlimited Zoom:**
+   - Canvas size not restricted by `max-width`
+   - Frame stays fixed, scroll bars appear automatically
+   - `text-align: center` for small sizes, full scroll for zoomed views
+
+2. **Global Mouse Wheel Zoom:**
+   - Event listener on `document.body` (works anywhere on page)
+   - `Ctrl + Mouse Wheel` triggers `zoomIn()`/`zoomOut()`
+   - Calls `dotNetReference.invokeMethodAsync('OnZoomChanged', scale)` to update Blazor UI
+   - `{ passive: false }` to enable `preventDefault()`
+
+3. **Render Task Cancellation:**
+   - Stores `currentRenderTask` to cancel previous render if new one starts
+   - Catches `RenderingCancelledException` to avoid console errors
+   - Queue system (`pageNumPending`) for rapid page changes
+
+4. **Thumbnail Sidebar:**
+   - Left panel with page previews (sequential rendering, 50ms delay)
+   - Click to navigate to specific page
+   - Active page highlighted with gradient border
+   - No header/title (maximizes thumbnail space)
+   - Toggle button in toolbar to show/hide
+
+5. **Resizable Splitter:**
+   - 4px draggable divider between thumbnails and canvas
+   - Min width: 150px, Max width: 400px
+   - Visual feedback: gradient on hover/active
+   - User preference saved to localStorage (`envelopeViewer_thumbnailWidth`)
+   - Global mouse events (works anywhere during drag)
+   - `col-resize` cursor (?) for intuitive UX
+
+6. **Flex Layout:**
+   - Thumbnails and canvas in same container (`.pdf-frame`)
+   - `display: flex, flex-direction: row, align-items: stretch`
+   - Perfect vertical alignment (same top/bottom position)
+   - Responsive: column layout on mobile (<768px)
+
+7. **Responsive Design:**
+   - Desktop: 90% width, 1200px max
+   - Mobile: 95% width, adjusted heights, thumbnails collapse to top
+   - Adaptive padding and font sizes
+
+### Initialization Flow
+
+```csharp
+OnInitializedAsync():
+  1. Fetch PDF bytes from DocumentService
+  2. Convert to base64 data URL
+  3. Set _isLoading = false
+
+OnAfterRenderAsync(firstRender):
+  1. Load saved thumbnail width from localStorage
+  2. Create DotNetObjectReference
+  3. Send PdfViewerOptions to JavaScript
+  4. Initialize PDF.js viewer
+  5. Attach splitter resize listeners
+  6. Render thumbnails sequentially (configurable delay)
+```
+
+**User Interactions:**
+- Zoom: Buttons/Ctrl+Wheel/Slider ? configurable step percentage
+- Pages: Buttons/Input/Thumbnails ? navigate
+- Sidebar: Toggle button ? show/hide thumbnails
+- Splitter: Drag ? resize sidebar (150-400px)
+
+**Cleanup:**
+```csharp
+DisposeAsync():
+  - Dispose PDF.js viewer
+  - Detach event listeners
+  - Dispose DotNetObjectReference
+```
+
+---
+
+### Key Differences from ReportViewer
+
+| Feature | EnvelopeViewer (NEW) | ReportViewer (LEGACY) |
+|---------|----------------------|------------------------|
+| Technology | PDF.js + Canvas | DevExpress XtraReports |
+| Route | `/envelope/{key}` | `/receiver/{key}` |
+| Purpose | Read-only viewing | Signature workflow |
+| Dependencies | PDF.js CDN | DevExpress NuGet packages |
+| Zoom | Unlimited, smooth | Report viewer default |
+| Mouse Wheel | Custom Ctrl+Wheel | Browser default |
+| File Size | Minimal (JS + CSS) | Heavy (DX libs) |
+| Maintenance | Simple, standard web | Complex, vendor-specific |
+
+---
+
+## ReceiverUI Signing Flow (ReportViewer.razor — LEGACY)
+
+### On Load (`OnInitializedAsync`)
+1. `AuthService.CheckEnvelopeAccessAsync` ? redirect to login if unauthorized
+2. `AnnotationService.GetAnnotationsAsync` ? fills `_annotations`
+3. `DocumentService.GetDocumentAsync` ? fills `_basePdfBytes` (real mode)
+4. `BuildFreshBaseReport()` ? `XtraReport` for `DxReportViewer`
+
+### Signature Popup
+- Tabs: Draw / Text / Image
+- Fields: full name (required), position (optional), place (required)
+- Saved to `_capturedSignature` record
+- If annotations exist ? popup closes ? JS checkbox overlays installed
+
+### JS Checkbox Overlay (`receiver-signature.js`)
+- `receiverSignature.installAnnotationCheckboxes(annotations, checkedIds, dotNetRef)`
+- One `.annot-sig-cb-wrapper` div per annotation, absolutely positioned over viewer scroll container
+- Position: `left = pageRect.left + ann.x * scaleX`, `top = pageRect.top + ann.y * scaleY`
+  - `scaleX = pagePixelWidth / 827`, `scaleY = pagePixelHeight / 1169`
+- Click ? `dotNetRef.invokeMethodAsync('OnAnnotationToggled', id, checked)`
+
+### Apply Signatures ("Unterschriften anwenden" — `SubmitSignaturesAsync`)
+
+**Real PDF mode (`_basePdfBytes` is set):**
+- Calls `StampSignaturesOnPdf` using **iText7** directly on PDF bytes
+- Coordinate conversion: `xPt = ann.X * (72/100)`, `yPt = pageHeight - ann.Y * (72/100) - sigHeight` (Y flip: DX top-down ? PDF bottom-up)
+- Returns stamped bytes ? loaded into new `XtraReport` with `XRPdfContent`
+- Viewer refreshed with `ViewerKey++`
+
+**Dev/fake mode (`_basePdfBytes` is null):**
+- Falls back to `AddSignatureAtAnnotation` (XtraReports DetailBand + BeforePrint counter)
+- This is intentionally left as a dev fallback only
+
+### Export
+- `reportViewer.ExportToAsync(ExportFormat.Pdf)`
+
+---
+
+## StampSignaturesOnPdf — iText7 Implementation
+
+```csharp
+// Located in ReportViewer.razor @code section
+// Called by SubmitSignaturesAsync when _basePdfBytes is available
+
+static byte[] StampSignaturesOnPdf(
+    byte[] sourcePdfBytes, byte[] signatureImageBytes,
+    string signerFullName, string signerPosition, string signaturePlace,
+    IReadOnlyList<AnnotationDto> annotations)
+{
+    // Opens PDF with PdfReader/PdfWriter
+    // For each annotation:
+    //   pageNum = ann.Page (clamped to totalPages)
+    //   xPt = ann.X * (72f/100f)
+    //   imgBottomY = pageHeight - ann.Y * (72f/100f) - sigHeightPt  ? Y-axis flip
+    //   PdfCanvas.AddImageFittedIntoRectangle(imageData, rect, false)
+    //   Separator line at bottom of image
+    //   Canvas text block below separator (font: Helvetica 7pt, color: RGB(73,80,87))
+    // Returns stamped byte[]
+}
+```
+
+---
+
+## BuildFreshBaseReport()
+
+```csharp
+// Real PDF mode:
+var report = new XtraReport();
+var detail = new DetailBand();
+report.Bands.Add(detail);
+detail.Controls.Add(new XRPdfContent { Source = _basePdfBytes, GenerateOwnPages = true });
+return report;
+
+// Dev/fake mode: returns pre-built report from ReportStorage
+```
+
+---
+
+## NuGet Packages in ReceiverUI
+
+| Package | Version | Purpose |
+|---|---|---|
+| `DevExpress.Blazor.Reporting.Viewer` | 25.2.3 | DxReportViewer (LEGACY, used in ReportViewer.razor) |
+| `DevExpress.Blazor.PdfViewer` | 25.2.3 | PDF viewer (not used in EnvelopeViewer) |
+| `DevExpress.Drawing.Skia` | 25.2.3 | Drawing backend |
+| `itext` | 8.0.5 | PDF stamping (iText7) |
+| `SkiaSharp.*` | 3.119.1 | WASM native rendering |
+
+**External CDN (EnvelopeViewer):**
+- PDF.js 3.11.174 (via `https://cdnjs.cloudflare.com/ajax/libs/pdf.js/3.11.174/pdf.min.js`)
+- PDF.js Worker (`pdf.worker.min.js`)
+
+---
+
+## Mistakes History — Do NOT Repeat
+
+| Mistake | Why Wrong | Session |
+|---|---|---|
+| `BottomMarginBand` for per-page signatures | Repeats on every page; Y offset wrong | 4 |
+| `imageY = (page-1) * 1169 + ann.Y` | Inflates DetailBand; 35 pages ? 140 pages | 8 |
+| `e.Graph?.PrintingSystem` in BeforePrint | `Graph` not on `CancelEventArgs` | 5 |
+| `ctrl.Report?.PrintingSystem` | `PrintingSystem` not on `XtraReportBase` in WASM | — |
+| Adding stamp endpoint to `DocumentController` | Not needed; stamping is done client-side in ReceiverUI | — |
+| iText7 via API (server-side) | Unnecessary; iText7 runs fine in WASM directly | 10 |
+| **PDF.js: Hardcoded quality values** | **Use appsettings.json for configurability** | **11** |
+| **PDF.js: Hardcoded zoom step (1%)** | **Too granular; use configurable percentage** | **11** |
+| **Toolbar: Complex left/center/right layout** | **User wants simple horizontal layout; failed multiple times to implement** | **11** |
+| **Zoom label: Badge style (gradient/border/padding)** | **Over-designed; user prefers simple text label** | **11** |
+| **Attempting to "improve" simple designs** | **User requests simplicity; AI keeps over-engineering** | **11** |
+| **Ignoring explicit "revert" instructions** | **User said revert toolbar, AI tried to fix CSS instead of reverting HTML structure** | **11** |
+
+---
+
+## DevExpress Article (2023-08-28) — Why It Does NOT Apply
+
+The article describes **X.509 cryptographic digital signatures** via `PdfDocumentSigner` + `Pkcs7Signer`.  
+Our use case is **visual/image stamping** at specific page coordinates — different problem, different API.  
+`XRPdfSignature` in the article requires pre-placed fields in the report designer, not runtime coordinates.
+
+---
+
+## Layout Architecture (EnvelopeViewer)
+
+### HTML Structure
+```html
+<div class="pdf-viewer-container">
+  <div class="pdf-toolbar">
+    <!-- Zoom, page navigation, thumbnail toggle -->
+  </div>
+  
+  <div class="pdf-frame">
+    @if (_showThumbnails) {
+      <div class="pdf-thumbnails" style="width: @(_thumbnailWidth)px">
+        <!-- Page previews -->
+      </div>
+      <div class="pdf-splitter" @onmousedown="OnSplitterMouseDown">
+        <!-- Resizable divider -->
+      </div>
+    }
+    <div class="pdf-canvas-wrapper">
+      <canvas id="pdf-canvas" class="pdf-canvas"></canvas>
+    </div>
+  </div>
+</div>
+```
+
+### CSS Flexbox Layout
+```css
+.pdf-frame {
+  display: flex;
+  flex-direction: row;        /* Side-by-side */
+  align-items: stretch;       /* Same height */
+  overflow: hidden;
+}
+
+.pdf-thumbnails {
+  flex-shrink: 0;             /* Fixed width */
+  width: 260px;               /* Dynamic via inline style */
+  border-right: none;         /* Seamless join with splitter */
+}
+
+.pdf-splitter {
+  width: 4px;
+  cursor: col-resize;
+  flex-shrink: 0;
+}
+
+.pdf-canvas-wrapper {
+  flex: 1;                    /* Fill remaining space */
+  overflow: auto;             /* Scrollable for zoom */
+  padding: 2rem;
+  text-align: center;
+}
+```
+
+### Resizable Splitter Workflow
+```
+1. User hovers splitter ? cursor: col-resize (?)
+2. Mouse down ? OnSplitterMouseDown(e)
+   - _isResizing = true
+   - Store start position (clientX) and width
+   - Add 'resizing' class to body (prevent text selection)
+   - Call pdfViewer.startResize()
+
+3. Mouse move (global) ? OnSplitterMouseMove(clientX)
+   - Calculate delta = clientX - startX
+   - newWidth = startWidth + delta
+   - Clamp to 150-400px range
+   - Update _thumbnailWidth
+   - StateHasChanged() for reactive UI
+
+4. Mouse up (global) ? OnSplitterMouseUp()
+   - _isResizing = false
+   - Remove 'resizing' class
+   - Save to localStorage("envelopeViewer_thumbnailWidth")
+```
+
+### Responsive Behavior
+- **Desktop (>768px)**: Flex row, side-by-side
+- **Mobile (?768px)**: Flex column, thumbnails on top
+- **Thumbnail toggle**: Controlled by `@if (_showThumbnails)` in Razor markup
+
+---
+
+## Signature Buttons in EnvelopeViewer — Interactive Overlay System
+
+**Purpose:** Render clickable "Unterschreiben" (Sign) buttons on PDF canvas at signature field positions fetched from database.
+
+### Architecture
+
+**Blazor Component (`EnvelopeViewer.razor`):**
+```csharp
+IReadOnlyList<SignatureDto> _signatures = [];
+
+protected override async Task OnInitializedAsync() {
+    var signatures = await SignatureService.GetAsync(EnvelopeKey);
+    _signatures = signatures.Convert(UnitOfLength.Point);  // INCHES ? POINTS
+}
+
+async Task RenderSignatureButtonsAsync() {
+    await JSRuntime.InvokeVoidAsync("pdfViewer.renderSignatureButtons", 
+        _signatures, _currentPage, _dotNetRef);
+}
+
+[JSInvokable]
+public void OnSignatureButtonClick(int signatureId) {
+    Console.WriteLine($"Signature #{signatureId} signed");
+}
+```
+
+**JavaScript (`pdf-viewer.js`):**
+```javascript
+renderSignatureButtons(signatures, currentPageNum, dotNetRef) {
+    this.clearSignatureButtons();  // Remove old buttons
+    
+    const pageSignatures = signatures.filter(sig => sig.page === currentPageNum);
+    const signatureLayer = document.getElementById('pdf-signature-layer');
+    
+    pageSignatures.forEach(sig => {
+        // Convert POINTS to display pixels
+        const xPx = sig.x * this.scale;  // sig.x already in PDF POINTS
+        const yPx = sig.y * this.scale;
+        
+        const button = document.createElement('button');
+        button.className = 'signature-button';
+        button.style.left = `${xPx}px`;
+        button.style.top = `${yPx}px`;
+        button.style.width = '150px';
+        button.style.height = '60px';
+        
+        // German text + pen icon
+        button.innerHTML = `
+            <div>Unterschreiben</div>
+            <svg>...</svg>
+        `;
+        
+        button.addEventListener('click', () => {
+            this.dotNetReference.invokeMethodAsync('OnSignatureButtonClick', sig.id);
+        });
+        
+        signatureLayer.appendChild(button);
+        this.signatureButtons.push(button);
+    });
+}
+
+clearSignatureButtons() {
+    this.signatureButtons.forEach(btn => btn.parentNode?.removeChild(btn));
+    this.signatureButtons = [];
+}
+```
+
+**HTML Structure:**
+```html
+<div class="pdf-page-container">
+    <canvas id="pdf-canvas"></canvas>
+    <div id="pdf-text-layer"></div>
+    <div id="pdf-signature-layer"></div>  <!-- NEW -->
+</div>
+```
+
+**CSS (`envelope-viewer.css`):**
+```css
+.pdf-signature-layer {
+    position: absolute;
+    left: 0; top: 0; right: 0; bottom: 0;
+    overflow: visible;
+    pointer-events: none;  /* Pass clicks through to canvas */
+    z-index: 20;
+}
+
+.signature-button {
+    pointer-events: auto;  /* Re-enable for buttons */
+    position: absolute;
+    width: 150px; height: 60px;
+    background: linear-gradient(135deg, #4F46E5 0%, #4338CA 100%);
+    color: white;
+    border: none;
+    border-radius: 8px;
+    cursor: pointer;
+    /* Hover: scale(1.05), shadow, darker gradient */
+}
+```
+
+### Rendering Triggers
+
+1. **Initial Load:** After PDF renders (`OnAfterRenderAsync`)
+2. **Page Change:** `NextPage()`, `PreviousPage()`, `GoToPageFromThumbnail()`
+3. **Zoom Change:** `OnZoomChanged()` (re-calculates pixel positions)
+
+### Coordinate Conversion Flow
+
+```
+Database (INCHES)
+  ? SignatureService.GetAsync()
+SignatureDto.X/Y (INCHES)
+  ? .Convert(UnitOfLength.Point)
+SignatureDto.X/Y (PDF POINTS, × 72)
+  ? JavaScript
+Display Pixels (× this.scale)
+  ? CSS
+button.style.left/top
+```
+
+**Example Calculation:**
+- Database: `X = 1.5 inches, Y = 2.0 inches`
+- After conversion: `X = 108 points, Y = 144 points` (× 72)
+- At scale 1.5: `X = 162px, Y = 216px`
+- Button positioned at `left: 162px, top: 216px`
+
+### Button Design
+
+**Visual Spec:**
+- **Size:** 150px × 60px
+- **Background:** Purple gradient `#4F46E5` ? `#4338CA` (hover: darker)
+- **Text:** "Unterschreiben" (18px, bold, white)
+- **Icon:** Pen SVG (24px white)
+- **Effects:**
+  - Hover: `scale(1.05)` + shadow `0 4px 12px rgba(79, 70, 229, 0.4)`
+  - Active: `scale(0.98)`
+  - Focus: `2px solid #7e22ce` outline
+
+**Accessibility:**
+- `tabindex="0"` for keyboard navigation
+- Focus outline for keyboard users
+- Click handler with semantic button element
+
+---
+
+## Signature Workflow in EnvelopeViewer — NEW Implementation (Session 13-14)
+
+**IMPORTANT: iText7 NOT USED in EnvelopeViewer**
+- **Reason:** GPL license incompatibility (requires source code sharing)
+- **Alternative:** Client-side signature overlay system (HTML + Canvas API)
+- **Export:** Signatures are visual overlays only, NOT stamped on PDF bytes
+- **Future:** Consider PSPDFKit or commercial PDF library for actual PDF stamping
+
+### Signature Data Structure
+
+**Captured Signature (`SignatureCaptureDto`):**
+```csharp
+// Model: EnvelopeGenerator.ReceiverUI/Models/SignatureCaptureDto.cs
+public sealed record SignatureCaptureDto
+{
+    public required string DataUrl { get; init; }      // base64 PNG: "data:image/png;base64,iVBORw0KG..."
+    public required string FullName { get; init; }     // Required: "Max Mustermann"
+    public string Position { get; init; } = string.Empty;  // Optional: "Geschäftsführer"
+    public required string Place { get; init; }        // Required: "Berlin"
+}
+
+// Usage in components:
+SignatureCaptureDto? _capturedSignature;
+
+// Initialization with object initializer (required properties):
+_capturedSignature = new SignatureCaptureDto
+{
+    DataUrl = signatureDataUrl,
+    FullName = _signerFullName.Trim(),
+    Position = _signerPosition.Trim(),
+    Place = _signaturePlace.Trim()
+};
+```
+
+**Applied Signature (HTML Overlay):**
+```html
+<div class="applied-signature" data-signature-id="42" style="left: 162px; top: 216px;">
+    <img src="data:image/png;base64,..." />  <!-- Signature image (max 70px height) -->
+    <div style="border-top: 1px solid #495057;"></div>  <!-- Separator line -->
+    <div style="font-size: 9px; color: #495057;">
+        <strong>Max Mustermann</strong>     <!-- Name (bold, #212529) -->
+        <br>Geschäftsführer                <!-- Position (optional) -->
+        <br>Berlin, 26.01.2025              <!-- Place, Date (dd.MM.yyyy) -->
+    </div>
+</div>
+```
+
+### Complete Workflow (Session 14 Update)
+
+**Step 1: Page Load & Automatic Popup**
+```csharp
+protected override async Task OnInitializedAsync() {
+    // ... load PDF and signatures ...
+    
+    // Open signature popup automatically
+    _activeSignatureTab = SignatureTabDraw;
+    _signaturePopupVisible = true;
+    _popupValidationMessage = null;
+}
+```
+
+**Features:**
+- Opens automatically on page load (no manual trigger needed)
+- Cannot be closed manually (no X button, ESC disabled, no outside-click)
+- User MUST create signature before viewing PDF
+
+**Step 2: Signature Creation Popup (DxPopup)**
+
+**Tabs:**
+1. **Zeichnen (Draw):** Canvas-based signature pad (`receiver-signature.js`)
+   - Touch-friendly: `touch-action: none`
+   - Line width: 2.5px, black (`#111`)
+   - Canvas: 560×180px, rounded corners, shadow
+
+2. **Text:** Type signature with font selection
+   - Fonts: Brush Script, Segoe Script, Lucida Handwriting, Comic Sans, Cursive
+   - Real-time preview on canvas
+
+3. **Bild (Image):** Upload PNG/JPG/WebP
+   - File input with preview
+   - Auto-resize to fit canvas
+
+**Required Fields:**
+- ? **Vor- und Nachname** (Full Name) — Red asterisk `*`
+- ? **Ort** (Place) — Red asterisk `*`
+- ? **Position** — Optional, gray "(optional)" label
+
+**Validation:**
+```csharp
+async Task SaveSignatureAsync() {
+    if (string.IsNullOrWhiteSpace(_signerFullName)) {
+        _popupValidationMessage = "Bitte geben Sie Vor- und Nachname ein.";
+        return;
+    }
+    if (string.IsNullOrWhiteSpace(_signaturePlace)) {
+        _popupValidationMessage = "Bitte geben Sie den Ort ein.";
+        return;
+    }
+    var signatureDataUrl = await GetActiveSignatureDataUrlAsync();
+    if (string.IsNullOrWhiteSpace(signatureDataUrl)) {
+        _popupValidationMessage = "Die Unterschrift ist erforderlich.";
+        return;
+    }
+    
+    // Save to session state
+    _capturedSignature = new(signatureDataUrl, _signerFullName.Trim(), 
+                            _signerPosition.Trim(), _signaturePlace.Trim());
+    _signaturePopupVisible = false;
+}
+```
+
+**Design (Modern & Clean):**
+- **Tabs:** Purple active state (`#4F46E5`), 3px bottom border
+- **Inputs:** 2px solid border (`#e9ecef`), 6px border-radius, consistent padding
+- **Canvas:** Light shadow (`0 1px 3px rgba(0,0,0,0.1)`), rounded corners
+- **Buttons:**
+  - **Erneuern:** Outline secondary with refresh icon
+  - **Speichern:** Purple gradient + checkmark icon + shadow
+- **Error:** Red left border (`4px solid #dc3545`), light red background (`#fee`)
+
+**Step 3: PDF Viewing with Signature Buttons**
+
+After popup closes:
+```csharp
+protected override async Task OnAfterRenderAsync(bool firstRender) {
+    // ... PDF initialization ...
+    
+    await RenderSignatureButtonsAsync();  // Render "Unterschreiben" buttons
+}
+```
+
+**Buttons appear at signature field positions:**
+- Purple gradient background
+- "Unterschreiben" text + pen icon
+- Hover: scale(1.05) + darker color
+- Positioned using PDF POINTS ? display pixels conversion
+
+**Step 4: Apply Signature (Click "Unterschreiben")**
+
+**C# Handler:**
+```csharp
+[JSInvokable]
+public async Task OnSignatureButtonClick(int signatureId) {
+    if (_capturedSignature == null) return;
+    
+    await JSRuntime.InvokeVoidAsync("pdfViewer.applySignature", 
+        signatureId, 
+        _capturedSignature.DataUrl,
+        _capturedSignature.FullName,
+        _capturedSignature.Position,
+        _capturedSignature.Place);
+}
+```
+
+**JavaScript Implementation:**
+```javascript
+async applySignature(signatureId, signatureDataUrl, fullName, position, place) {
+    // 1. Find and remove button
+    const button = this.signatureButtons.find(btn => 
+        btn.getAttribute('data-signature-id') == signatureId);
+    button.parentNode.removeChild(button);
+    
+    // 2. Create signature container (German standard format)
+    const signatureContainer = document.createElement('div');
+    signatureContainer.className = 'applied-signature';
+    signatureContainer.style.position = 'absolute';
+    signatureContainer.style.left = button.style.left;  // Same position as button
+    signatureContainer.style.top = button.style.top;
+    signatureContainer.style.width = '230px';
+    signatureContainer.style.backgroundColor = '#f8f9fa';
+    signatureContainer.style.border = '1px solid #dee2e6';
+    signatureContainer.style.borderRadius = '6px';
+    signatureContainer.style.padding = '12px';
+    
+    // 3. Add signature image
+    const img = document.createElement('img');
+    img.src = signatureDataUrl;
+    img.style.width = '100%';
+    img.style.maxHeight = '70px';
+    img.style.objectFit = 'contain';
+    
+    // 4. Add separator line (German standard)
+    const separator = document.createElement('div');
+    separator.style.borderTop = '1px solid #495057';
+    separator.style.marginTop = '6px';
+    separator.style.marginBottom = '8px';
+    
+    // 5. Add text information
+    const today = new Date();
+    const dateStr = today.toLocaleDateString('de-DE', { 
+        day: '2-digit', month: '2-digit', year: 'numeric' 
+    });  // "26.01.2025"
+    
+    const infoHtml = [
+        `<strong>${this.escapeHtml(fullName)}</strong>`,
+        position ? this.escapeHtml(position) : null,
+        `${this.escapeHtml(place)}, ${dateStr}`
+    ].filter(x => x).join('<br>');
+    
+    const info = document.createElement('div');
+    info.style.fontSize = '9px';
+    info.style.color = '#495057';
+    info.innerHTML = infoHtml;
+    
+    // 6. Assemble and add to layer
+    signatureContainer.appendChild(img);
+    signatureContainer.appendChild(separator);
+    signatureContainer.appendChild(info);
+    
+    document.getElementById('pdf-signature-layer').appendChild(signatureContainer);
+}
+```
+
+**German Standard Layout:**
+```
+???????????????????????????????
+?  [Signature Image]          ?  ? Base64 PNG, max 70px height
+?                             ?
+???????????????????????????????  ? 1px separator (#495057)
+?                             ?
+?  Max Mustermann (Bold)      ?  ? Name (font-weight: 600, #212529)
+?  Geschäftsführer            ?  ? Position (optional, normal weight)
+?  Berlin, 26.01.2025         ?  ? Place, Date (dd.MM.yyyy)
+?                             ?
+???????????????????????????????
+```
+
+**Step 5: Persistence & Re-rendering**
+
+- **Zoom/Page Change:** Applied signatures re-render automatically
+- **Session State:** `_capturedSignature` stored in Blazor component
+- **Limitation:** Lost on page refresh (no server-side storage)
+- **Future:** Export to PDF with actual byte stamping (requires non-GPL library)
+
+**Security:**
+```javascript
+escapeHtml(text) {
+    const div = document.createElement('div');
+    div.textContent = text;  // Browser auto-escapes
+    return div.innerHTML;
+}
+```
+Protects against XSS attacks from malicious input in Name/Position/Place fields.
+
+---
+
+### Popup Design Specification
+
+**DxPopup Properties:**
+```razor
+<DxPopup @bind-Visible="_signaturePopupVisible"
+         HeaderText="Unterschrift erstellen"
+         Width="620px"
+         MaxWidth="95vw"
+         ShowFooter="true"       <!-- REQUIRED for buttons to appear -->
+         CloseOnOutsideClick="false"
+         ShowCloseButton="false"  <!-- No X button -->
+         CloseOnEscape="false">  <!-- ESC disabled -->
+```
+
+**Tab Design:**
+- **Active Tab:** `border-bottom: 3px solid #4F46E5; color: #4F46E5; font-weight: 600;`
+- **Inactive Tab:** `color: #6c757d;`
+- **Tab Bar:** `border-bottom: 2px solid #e9ecef;`
+
+**Input Styling:**
+```css
+input, select {
+    border: 2px solid #e9ecef;
+    border-radius: 6px;
+    padding: 0.625rem;
+}
+```
+
+**Canvas Styling:**
+```css
+canvas {
+    border: 2px solid #e9ecef;
+    border-radius: 8px;
+    background: white;
+    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
+}
+```
+
+**Button Styling:**
+```css
+/* Erneuern (Renew) */
+.btn-outline-secondary {
+    border-radius: 6px;
+    padding: 0.625rem 1.25rem;
+    font-weight: 500;
+}
+
+/* Speichern (Save) */
+.btn-primary {
+    background: linear-gradient(135deg, #4F46E5 0%, #4338CA 100%);
+    border: none;
+    border-radius: 6px;
+    padding: 0.625rem 2rem;
+    font-weight: 600;
+    box-shadow: 0 2px 4px rgba(79, 70, 229, 0.3);
+}
+```
+
+**Future Enhancement Required:**
+- Replace iText7 with commercial PDF library (e.g., PSPDFKit, Syncfusion)
+- Or use server-side stamping with Azure PDF Services
+- Or accept GPL license and open-source the stamping code
+
+---
+
+
+
+
+
+
+
+
+
+

EnvelopeGenerator.API/Controllers/AnnotationController.cs

@@ -1,16 +1,19 @@
 using DigitalData.Core.Abstraction.Application.DTO;
 using DigitalData.Core.Exceptions;
+using EnvelopeGenerator.API.Extensions;
+using EnvelopeGenerator.Application.Common.Dto;
 using EnvelopeGenerator.Application.Common.Extensions;
 using EnvelopeGenerator.Application.Common.Interfaces.Services;
 using EnvelopeGenerator.Application.Common.Notifications.DocSigned;
+using EnvelopeGenerator.Application.Documents.Queries;
 using EnvelopeGenerator.Application.EnvelopeReceivers.Queries;
 using EnvelopeGenerator.Application.Histories.Queries;
 using EnvelopeGenerator.Domain.Constants;
-using EnvelopeGenerator.API.Extensions;
 using MediatR;
 using Microsoft.AspNetCore.Authentication;
 using Microsoft.AspNetCore.Authentication.Cookies;
 using Microsoft.AspNetCore.Authorization;
+using Microsoft.AspNetCore.Components.Forms;
 using Microsoft.AspNetCore.Mvc;
 
 namespace EnvelopeGenerator.API.Controllers;

EnvelopeGenerator.API/Controllers/AuthController.cs

@@ -1,3 +1,4 @@
+using DigitalData.Auth.Claims;
 using EnvelopeGenerator.API.Controllers.Interfaces;
 using EnvelopeGenerator.API.Models;
 using EnvelopeGenerator.Domain.Constants;
@@ -73,4 +74,44 @@ public partial class AuthController(IOptions<AuthTokenKeys> authTokenKeyOptions,
         => role is not null && !User.IsInRole(role)
             ? Unauthorized()
             : Ok();
+
+    /// <summary>
+    /// Checks whether the caller holds a valid per-envelope receiver token for the given envelope key.
+    /// The request must carry a cookie named <c>AuthTokenSignFLOWReceiver.{envelopeKey}</c>.
+    /// </summary>
+    /// <param name="envelopeKey">The unique envelope key extracted from the route.</param>
+    /// <response code="200">Valid per-envelope token found.</response>
+    /// <response code="401">Token is missing, expired or invalid.</response>
+    [ProducesResponseType(typeof(void), StatusCodes.Status200OK)]
+    [ProducesResponseType(typeof(void), StatusCodes.Status401Unauthorized)]
+    [Authorize(Policy = AuthPolicy.Receiver)]
+    [HttpGet("check/envelope/{envelopeKey}")]
+    public IActionResult CheckEnvelopeReceiver([FromRoute] string envelopeKey) => Ok();
+
+    /// <summary>
+    /// Removes the per-envelope receiver cookie for the given envelope key.
+    /// </summary>
+    /// <param name="envelopeKey">The unique envelope key whose cookie should be deleted.</param>
+    /// <response code="200">Cookie successfully deleted.</response>
+    [ProducesResponseType(typeof(void), StatusCodes.Status200OK)]
+    [HttpPost("logout/envelope/{envelopeKey}")]
+    public IActionResult LogoutEnvelopeReceiver([FromRoute] string envelopeKey)
+    {
+        var cookieName = CookieNames.GetEnvelopeReceiverCookieName(authTokenKeys.Cookie, envelopeKey);
+        Response.Cookies.Delete(cookieName);
+        return Ok();
+    }
+
+    /// <summary>
+    /// Removes all per-envelope receiver cookies from the current request.
+    /// </summary>
+    /// <response code="200">All envelope receiver cookies successfully deleted.</response>
+    [ProducesResponseType(typeof(void), StatusCodes.Status200OK)]
+    [HttpPost("logout/envelope")]
+    public IActionResult LogoutAllEnvelopeReceivers()
+    {
+        foreach (var cookieName in Request.Cookies.Keys.Where(k => CookieNames.IsEnvelopeReceiverCookie(k, authTokenKeys.Cookie)))
+            Response.Cookies.Delete(cookieName);
+        return Ok();
+    }
 }

EnvelopeGenerator.API/Controllers/DocumentController.cs

@@ -1,3 +1,4 @@
+using DigitalData.Auth.Claims;
 using EnvelopeGenerator.API.Controllers.Interfaces;
 using EnvelopeGenerator.API.Extensions;
 using EnvelopeGenerator.Application.Documents.Queries;
@@ -14,10 +15,9 @@ namespace EnvelopeGenerator.API.Controllers;
 /// <remarks>
 /// Initializes a new instance of the <see cref="DocumentController"/> class.
 /// </remarks>
-[Authorize]
 [ApiController]
 [Route("api/[controller]")]
-public class DocumentController(IMediator mediator, IAuthorizationService authService) : ControllerBase, IAuthController
+public class DocumentController(IMediator mediator, IAuthorizationService authService, ILogger<DocumentController> logger) : ControllerBase, IAuthController
 {
     /// <summary>
     /// 
@@ -60,4 +60,25 @@ public class DocumentController(IMediator mediator, IAuthorizationService authSe
 
         return Unauthorized();
     }
-}
+
+    /// <summary>
+    /// Gets the document for the specified envelope key.
+    /// </summary>
+    /// <param name="envelopeKey"></param>
+    /// <param name="cancel"></param>
+    /// <returns></returns>
+    [Authorize(Policy = AuthPolicy.Receiver)]
+    [HttpGet("{envelopeKey}")]
+    public async Task<IActionResult> GetDocumentOfReceiver(string envelopeKey, CancellationToken cancel)
+    {
+        int envelopeId = User.GetEnvelopeIdOfReceiver();
+
+        var senderDoc = await mediator.Send(new ReadDocumentQuery() { EnvelopeId = envelopeId }, cancel);
+
+        if (senderDoc.ByteData is not byte[] senderDocByte)
+            return NotFound("Document is empty.");
+
+        Response.Headers.ContentDisposition = $"inline; filename=\"{envelopeKey}.pdf\"";
+        return File(senderDocByte, "application/pdf");
+    }
+}

EnvelopeGenerator.API/Controllers/EnvelopeController.cs

@@ -98,7 +98,7 @@ public class EnvelopeController : ControllerBase
     [HttpPost]
     public async Task<IActionResult> CreateAsync([FromBody] CreateEnvelopeCommand command)
     {
-        var res = await _mediator.Send(command.Authorize(User.GetId()));
+        var res = await _mediator.Send(command.WithAuth(User.GetId()));
 
         if (res is null)
         {

EnvelopeGenerator.API/Controllers/EnvelopeReceiverController.cs

@@ -14,6 +14,7 @@ using EnvelopeGenerator.Application.Common.SQL;
 using EnvelopeGenerator.Application.Common.Dto.Receiver;
 using EnvelopeGenerator.Application.Common.Interfaces.SQLExecutor;
 using EnvelopeGenerator.API.Extensions;
+using EnvelopeGenerator.Domain.Constants;
 
 namespace EnvelopeGenerator.API.Controllers;
 
@@ -73,6 +74,24 @@ public class EnvelopeReceiverController : ControllerBase
         return Ok(result);
     }
 
+    /// <summary>
+    /// 
+    /// </summary>
+    /// <param name="envelopeKey"></param>
+    /// <param name="cancel"></param>
+    /// <returns></returns>
+    [Authorize(Policy = AuthPolicy.Receiver)]
+    [HttpGet("{envelopeKey}")]
+    public async Task<IActionResult> GetEnvelopeReceiverOfReceiver([FromRoute] string envelopeKey, CancellationToken cancel)
+    {
+        var er = await _mediator.Send(new ReadEnvelopeReceiverQuery()
+        {
+            Key = envelopeKey
+        }, cancel);
+
+        return Ok(er.SingleOrDefault());
+    }
+
     /// <summary>
     /// Ruft den Namen des zuletzt verwendeten Empfängers basierend auf der angegebenen E-Mail-Adresse ab.
     /// </summary>

EnvelopeGenerator.API/Controllers/SignatureController.cs

@@ -0,0 +1,57 @@
+using EnvelopeGenerator.API.Extensions;
+using EnvelopeGenerator.Application.Common.Dto;
+using EnvelopeGenerator.Application.Common.Extensions;
+using EnvelopeGenerator.Application.Documents.Queries;
+using EnvelopeGenerator.Domain.Constants;
+using MediatR;
+using Microsoft.AspNetCore.Authorization;
+using Microsoft.AspNetCore.Mvc;
+
+namespace EnvelopeGenerator.API.Controllers;
+
+/// <summary>
+/// 
+/// </summary>
+[Authorize(Policy = AuthPolicy.Receiver)]
+[ApiController]
+[Route("api/[controller]")]
+public class SignatureController : ControllerBase
+{
+    private readonly IMediator _mediator;
+
+    /// <summary>
+    /// Initializes a new instance of <see cref="SignatureController"/>.
+    /// </summary>
+    public SignatureController(IMediator mediator)
+    {
+        _mediator = mediator;
+    }
+
+    //TODO: update to use signature query
+    /// <summary>
+    /// 
+    /// </summary>
+    /// <param name="envelopeKey"></param>
+    /// <param name="cancel"></param>
+    /// <returns></returns>
+    [Authorize(Policy = AuthPolicy.Receiver)]
+    [HttpGet("{envelopeKey}")]
+    public async Task<IActionResult> GetAnnotsOfReceiver(string envelopeKey, CancellationToken cancel)
+    {
+        int envelopeId = User.GetEnvelopeIdOfReceiver();
+
+        int receiverId = User.GetReceiverIdOfReceiver();
+
+        var doc = await _mediator.Send(new ReadDocumentQuery() { EnvelopeId = envelopeId }, cancel);
+
+        if (doc.Elements is not IEnumerable<SignatureDto> docSignatures)
+            return NotFound("Document is empty.");
+
+        var rcvSignatures = docSignatures.Where(s => s.ReceiverId == receiverId).ToList();
+
+        if (rcvSignatures is null)
+            return NotFound("No signatures found for the current receiver.");
+        else
+            return Ok(rcvSignatures);
+    }
+}

EnvelopeGenerator.API/Documentation/AuthProxyDocumentFilter.cs

@@ -16,6 +16,12 @@ public sealed class AuthProxyDocumentFilter : IDocumentFilter
     /// <param name="swaggerDoc"></param>
     /// <param name="context"></param>
     public void Apply(OpenApiDocument swaggerDoc, DocumentFilterContext context)
+    {
+        AddLoginOperation(swaggerDoc, context);
+        AddEnvelopeReceiverLoginOperation(swaggerDoc, context);
+    }
+
+    private static void AddLoginOperation(OpenApiDocument swaggerDoc, DocumentFilterContext context)
     {
         const string path = "/api/auth";
 
@@ -67,4 +73,51 @@ public sealed class AuthProxyDocumentFilter : IDocumentFilter
             }
         };
     }
+
+    private static void AddEnvelopeReceiverLoginOperation(OpenApiDocument swaggerDoc, DocumentFilterContext context)
+    {
+        const string path = "/api/Auth/envelope-receiver/{key}";
+
+        var bodySchema = context.SchemaGenerator.GenerateSchema(typeof(EnvelopeReceiverLogin), context.SchemaRepository);
+
+        var operation = new OpenApiOperation
+        {
+            Summary = "Envelope receiver login (auth-hub proxy)",
+            Description = "Proxies the envelope receiver login to the auth service. " +
+                          "The `cookie` query parameter is always forwarded as `true` so the auth service sets the per-envelope cookie automatically.",
+            Tags = [new() { Name = "Auth" }],
+            Parameters =
+            {
+                new OpenApiParameter
+                {
+                    Name = "key",
+                    In = ParameterLocation.Path,
+                    Required = true,
+                    Schema = new OpenApiSchema { Type = "string" },
+                    Description = "The unique envelope receiver key."
+                }
+            },
+            RequestBody = new OpenApiRequestBody
+            {
+                Required = false,
+                Content =
+                {
+                    ["multipart/form-data"] = new OpenApiMediaType { Schema = bodySchema }
+                }
+            },
+            Responses =
+            {
+                ["200"] = new OpenApiResponse { Description = "OK – per-envelope cookie set by auth service." },
+                ["401"] = new OpenApiResponse { Description = "Unauthorized – invalid or missing access code." }
+            }
+        };
+
+        swaggerDoc.Paths[path] = new OpenApiPathItem
+        {
+            Operations =
+            {
+                [OperationType.Post] = operation
+            }
+        };
+    }
 }

EnvelopeGenerator.API/EnvelopeGenerator.API.csproj

@@ -1,7 +1,7 @@
 <Project Sdk="Microsoft.NET.Sdk.Web">
 
   <PropertyGroup>
-    <TargetFrameworks>net9.0</TargetFrameworks>
+    <TargetFrameworks>net8.0</TargetFrameworks>
     <Nullable>enable</Nullable>
     <ImplicitUsings>enable</ImplicitUsings>
     <GenerateDocumentationFile>true</GenerateDocumentationFile>
@@ -10,9 +10,9 @@
     <Authors>Digital Data GmbH</Authors>
     <Company>Digital Data GmbH</Company>
     <Product>EnvelopeGenerator.GeneratorAPI</Product>
-    <Version>1.2.3</Version>
+    <Version>1.4.0</Version>
-    <FileVersion>1.2.3</FileVersion>
+    <FileVersion>1.4.0</FileVersion>
-    <AssemblyVersion>1.2.3</AssemblyVersion>
+    <AssemblyVersion>1.4.0</AssemblyVersion>
     <PackageOutputPath>Copyright © 2025 Digital Data GmbH. All rights reserved.</PackageOutputPath>
 	<DocumentationFile>bin\$(Configuration)\$(TargetFramework)\$(AssemblyName).xml</DocumentationFile>
   </PropertyGroup>
@@ -30,11 +30,16 @@
 
   <ItemGroup>
     <PackageReference Include="AspNetCore.Scalar" Version="1.1.8" />
+    <PackageReference Include="DigitalData.Auth.Claims" Version="1.0.3" />
     <PackageReference Include="DigitalData.Auth.Client" Version="1.3.7" />
     <PackageReference Include="DigitalData.Core.API" Version="2.2.1" />
     <PackageReference Include="HtmlSanitizer" Version="9.0.892" />
-    <PackageReference Include="Microsoft.AspNetCore.OpenApi" Version="9.0.4" />
+    <PackageReference Include="itext" Version="8.0.5" />
-    <PackageReference Include="Microsoft.EntityFrameworkCore.SqlServer" Version="9.0.6" />
+    <PackageReference Include="itext.bouncy-castle-adapter" Version="8.0.5" />
+    <PackageReference Include="Microsoft.AspNetCore.OpenApi" Version="9.0.4" Condition="'$(TargetFramework)' == 'net9.0'" />
+    <PackageReference Include="Microsoft.AspNetCore.OpenApi" Version="8.0.11" Condition="'$(TargetFramework)' == 'net8.0'" />
+    <PackageReference Include="Microsoft.EntityFrameworkCore.SqlServer" Version="9.0.6" Condition="'$(TargetFramework)' == 'net9.0'" />
+    <PackageReference Include="Microsoft.EntityFrameworkCore.SqlServer" Version="8.0.17" Condition="'$(TargetFramework)' == 'net8.0'" />
     <PackageReference Include="Microsoft.Identity.Client" Version="4.82.1" />
     <PackageReference Include="NLog" Version="5.2.5" />
     <PackageReference Include="NLog.Web.AspNetCore" Version="5.3.0" />
@@ -71,6 +76,7 @@
     <ProjectReference Include="..\EnvelopeGenerator.Application\EnvelopeGenerator.Application.csproj" />
     <ProjectReference Include="..\EnvelopeGenerator.Domain\EnvelopeGenerator.Domain.csproj" />
     <ProjectReference Include="..\EnvelopeGenerator.Infrastructure\EnvelopeGenerator.Infrastructure.csproj" />
+    <ProjectReference Include="..\EnvelopeGenerator.PdfEditor\EnvelopeGenerator.PdfEditor.csproj" />
   </ItemGroup>
 
 </Project>

EnvelopeGenerator.API/Extensions/ReceiverClaimExtensions.cs

@@ -11,6 +11,11 @@ namespace EnvelopeGenerator.API.Extensions;
 /// </summary>
 public static class ReceiverClaimExtensions
 {
+    private static readonly string[] EnvelopeIdClaimTypes = [EnvelopeClaimTypes.Id, "envelope_id", "EnvelopeId"];
+    private static readonly string[] ReceiverIdClaimTypes = ["receiver_id", "ReceiverId"];
+    private static readonly string[] EnvelopeUuidClaimTypes = [ClaimTypes.NameIdentifier, "envelope_uuid", "EnvelopeUuid"];
+    private static readonly string[] ReceiverSignatureClaimTypes = [ClaimTypes.Hash, "receiver_sig", "ReceiverSignature"];
+
     private static string GetRequiredClaimOfReceiver(this ClaimsPrincipal user, string claimType)
     {
         var value = user.FindFirstValue(claimType);
@@ -27,15 +32,32 @@ public static class ReceiverClaimExtensions
         throw new InvalidOperationException(message);
     }
 
+    private static string GetRequiredClaimOfReceiver(this ClaimsPrincipal user, params string[] claimTypes)
+    {
+        foreach (var claimType in claimTypes.Where(t => !string.IsNullOrWhiteSpace(t)).Distinct())
+        {
+            var value = user.FindFirstValue(claimType);
+            if (!string.IsNullOrWhiteSpace(value))
+                return value;
+        }
+
+        var identity = user.Identity;
+        var principalName = identity?.Name ?? "(anonymous)";
+        var authType = identity?.AuthenticationType ?? "(none)";
+        var availableClaims = string.Join(", ", user.Claims.Select(c => $"{c.Type}={c.Value}"));
+        var message = $"Required claim(s) '{string.Join("', '", claimTypes)}' are missing for user '{principalName}' (auth: {authType}). Available claims: [{availableClaims}].";
+        throw new InvalidOperationException(message);
+    }
+
     /// <summary>
     /// Gets the authenticated envelope UUID from the claims.
     /// </summary>
-    public static string GetEnvelopeUuidOfReceiver(this ClaimsPrincipal user) => user.GetRequiredClaimOfReceiver(ClaimTypes.NameIdentifier);
+    public static string GetEnvelopeUuidOfReceiver(this ClaimsPrincipal user) => user.GetRequiredClaimOfReceiver(EnvelopeUuidClaimTypes);
 
     /// <summary>
     /// Gets the authenticated receiver signature from the claims.
     /// </summary>
-    public static string GetReceiverSignatureOfReceiver(this ClaimsPrincipal user) => user.GetRequiredClaimOfReceiver(ClaimTypes.Hash);
+    public static string GetReceiverSignatureOfReceiver(this ClaimsPrincipal user) => user.GetRequiredClaimOfReceiver(ReceiverSignatureClaimTypes);
 
     /// <summary>
     /// Gets the authenticated receiver display name from the claims.
@@ -57,15 +79,32 @@ public static class ReceiverClaimExtensions
     /// </summary>
     public static int GetEnvelopeIdOfReceiver(this ClaimsPrincipal user)
     {
-        var envIdStr = user.GetRequiredClaimOfReceiver(EnvelopeClaimTypes.Id);
+        var envIdStr = user.GetRequiredClaimOfReceiver(EnvelopeIdClaimTypes);
         if (!int.TryParse(envIdStr, out var envId))
         {
-            throw new InvalidOperationException($"Claim '{EnvelopeClaimTypes.Id}' is not a valid integer.");
+            throw new InvalidOperationException($"Claim '{"envelope_id"}' is not a valid integer.");
         }
 
         return envId;
     }
 
+    /// <summary>
+    /// 
+    /// </summary>
+    /// <param name="user"></param>
+    /// <returns></returns>
+    /// <exception cref="InvalidOperationException"></exception>
+    public static int GetReceiverIdOfReceiver(this ClaimsPrincipal user)
+    {
+        var rcvIdStr = user.GetRequiredClaimOfReceiver(ReceiverIdClaimTypes);
+        if (!int.TryParse(rcvIdStr, out var rcvId))
+        {
+            throw new InvalidOperationException($"Claim '{"receiver_id"}' is not a valid integer.");
+        }
+
+        return rcvId;
+    }
+
     /// <summary>
     /// Signs in an envelope receiver using cookie authentication and attaches envelope claims.
     /// </summary>

EnvelopeGenerator.API/Models/EnvelopeReceiverLogin.cs

@@ -0,0 +1,7 @@
+namespace EnvelopeGenerator.API.Models;
+
+/// <summary>
+/// Request body for the envelope-receiver login endpoint.
+/// </summary>
+/// <param name="AccessCode">The access code sent to the receiver.</param>
+public record EnvelopeReceiverLogin(string? AccessCode = null);

EnvelopeGenerator.API/Program.cs

@@ -19,6 +19,7 @@ using DigitalData.Core.Abstractions.Security.Extensions;
 using EnvelopeGenerator.API.Middleware;
 using NLog.Web;
 using NLog;
+using DigitalData.Auth.Claims;
 
 var logger = LogManager.Setup().LoadConfigurationFromAppSettings().GetCurrentClassLogger();
 logger.Info("Logging initialized!");
@@ -110,9 +111,11 @@ try
 
         options.DocumentFilter<EnvelopeGenerator.API.Documentation.AuthProxyDocumentFilter>();
     });
+#if NET9_0_OR_GREATER
     builder.Services.AddOpenApi();
+#endif
 
-    //AddEF Core dbcontext
+    //Add EF Core dbcontext
     var useDbMigration = Environment.GetEnvironmentVariable("MIGRATION_TEST_MODE") == true.ToString() || config.GetValue<bool>("UseDbMigration");
     var cnnStrName = useDbMigration ? "DbMigrationTest" : "Default";
     var connStr = config.GetConnectionString(cnnStrName)
@@ -126,6 +129,9 @@ try
 
     var authTokenKeys = config.GetOrDefault<AuthTokenKeys>();
 
+    // Scheme name used for per-envelope receiver JWT authentication.
+    const string EnvelopeReceiverScheme = "EnvelopeReceiverJwt";
+
     builder.Services.AddAuthentication(options =>
     {
         options.DefaultAuthenticateScheme = JwtBearerDefaults.AuthenticationScheme;
@@ -163,6 +169,61 @@ try
                     return Task.CompletedTask;
                 }
             };
+        })
+        // Per-envelope receiver scheme: reads the JWT from the cookie named
+        // AuthTokenSignFLOWReceiver.{envelope_key} where envelope_key is the
+        // last path segment of the request URL.
+        // This enables simultaneous authentication for multiple envelopes
+        // within the same browser session.
+        .AddJwtBearer(EnvelopeReceiverScheme, opt =>
+        {
+            opt.TokenValidationParameters = new TokenValidationParameters
+            {
+                ValidateIssuerSigningKey = true,
+                IssuerSigningKeyResolver = (token, securityToken, identifier, parameters) =>
+                {
+                    var clientParams = deferredProvider.GetOptions<ClientParams>();
+                    var publicKey = clientParams!.PublicKeys.Get(authTokenKeys.Issuer, authTokenKeys.Audience);
+                    return [publicKey.SecurityKey];
+                },
+                ValidateIssuer = true,
+                ValidIssuer = authTokenKeys.Issuer,
+                ValidateAudience = true,
+                ValidAudience = authTokenKeys.Audience,
+            };
+
+            opt.Events = new JwtBearerEvents
+            {
+                OnMessageReceived = context =>
+                {
+                    var paths = context.Request.Path.Value?.Split('/', StringSplitOptions.RemoveEmptyEntries);
+
+                    // Derive the envelope key from the last route segment: /{envelope_key}
+                    var envelopeKey = paths?.LastOrDefault();
+
+                    if (envelopeKey is not null)
+                    {
+                        var cookieName = CookieNames.GetEnvelopeReceiverCookieName(authTokenKeys.Cookie, envelopeKey);
+                        if (context.Request.Cookies.TryGetValue(cookieName, out var cookieToken) && cookieToken is not null)
+                            context.Token = cookieToken;
+                    }
+
+                    return Task.CompletedTask;
+                },
+                OnTokenValidated = context =>
+                {
+                    var paths = context.Request.Path.Value?.Split('/', StringSplitOptions.RemoveEmptyEntries);
+                    var envelopeKey = paths?.LastOrDefault();
+
+                    var sub = context.Principal?.FindFirst(System.Security.Claims.ClaimTypes.NameIdentifier)?.Value
+                           ?? context.Principal?.FindFirst("sub")?.Value;
+
+                    if (envelopeKey is null || sub != envelopeKey)
+                        context.Fail("Envelope key in the path does not match the token subject.");
+
+                    return Task.CompletedTask;
+                }
+            };
         });
 
     // Authentication
@@ -182,8 +243,13 @@ try
             policy.RequireRole(Role.Sender, Role.Receiver.Full))
         .AddPolicy(AuthPolicy.Sender, policy =>
             policy.RequireRole(Role.Sender))
+        // Per-envelope policy: uses the dedicated EnvelopeReceiverJwt scheme so it
+        // never conflicts with the default JwtBearer scheme.
         .AddPolicy(AuthPolicy.Receiver, policy =>
-            policy.RequireRole(Role.Receiver.Full))
+            policy
+                .AddAuthenticationSchemes(EnvelopeReceiverScheme)
+                .RequireAuthenticatedUser()
+            .RequireRole(Role.Receiver.Full, "receiver"))
         .AddPolicy(AuthPolicy.ReceiverTFA, policy =>
             policy.RequireRole(Role.Receiver.TFA));
 
@@ -224,7 +290,9 @@ try
 
     app.UseMiddleware<ExceptionHandlingMiddleware>();
 
+#if NET9_0_OR_GREATER
     app.MapOpenApi();
+#endif
 
     // Configure the HTTP request pipeline.
     if (app.Environment.IsDevelopment() || (app.IsDevOrDiP() && config.GetValue<bool>("UseSwagger")))
@@ -258,9 +326,11 @@ try
     app.UseAuthentication();
     app.UseAuthorization();
 
-    app.MapReverseProxy();
     app.MapControllers();
 
+    // Catch-all YARP proxy — only forward requests that are not swagger/scalar/openapi paths.
+    app.MapReverseProxy();
+
     app.Run();
 }
 catch (Exception ex)

EnvelopeGenerator.API/Properties/PublishProfiles/IISProfileNet8.pubxml

@@ -0,0 +1,20 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+https://go.microsoft.com/fwlink/?LinkID=208121.
+-->
+<Project>
+  <PropertyGroup>
+    <WebPublishMethod>Package</WebPublishMethod>
+    <LastUsedBuildConfiguration>Release</LastUsedBuildConfiguration>
+    <LastUsedPlatform>Any CPU</LastUsedPlatform>
+    <SiteUrlToLaunchAfterPublish />
+    <LaunchSiteAfterPublish>true</LaunchSiteAfterPublish>
+    <ExcludeApp_Data>false</ExcludeApp_Data>
+    <ProjectGuid>5e0e17c0-ff5a-4246-bf87-1add85376a27</ProjectGuid>
+    <DesktopBuildPackageLocation>M:\App&amp;Service\0 DD - Smart UP\signFLOW\API\net8\$(Version)\EnvelopeGenerator.API.zip</DesktopBuildPackageLocation>
+    <PackageAsSingleFile>true</PackageAsSingleFile>
+    <DeployIisAppPath>EnvelopeGenerator</DeployIisAppPath>
+    <_TargetId>IISWebDeployPackage</_TargetId>
+    <TargetFramework>net8.0</TargetFramework>
+  </PropertyGroup>
+</Project>

EnvelopeGenerator.API/appsettings.Development.json

@@ -1,10 +1,21 @@
 {
-  "Logging": {
+"Logging": {
-    "LogLevel": {
+  "LogLevel": {
-      "Default": "Information",
+    "Default": "Information",
-      "Microsoft.AspNetCore": "Warning"
+    "Microsoft.AspNetCore": "Warning"
+  }
+},
+"ReverseProxy": {
+  "Clusters": {
+    "receiver-ui": {
+      "Destinations": {
+        "primary": {
+          "Address": "https://localhost:52936"
+        }
+      }
     }
-  },
+  }
+},
   "AuthClientParams": {
     "Url": "http://172.24.12.39:9090/auth-hub",
     "PublicKeys": [

EnvelopeGenerator.API/appsettings.json

@@ -1,6 +1,6 @@
 {
   "UseSwagger": true,
-  "UseDbMigration": true,
+  "UseDbMigration": false,
   "DiPMode": true,
   "Logging": {
     "LogLevel": {

EnvelopeGenerator.API/yarp.json

@@ -1,18 +1,168 @@
 {
-  "ReverseProxy": {
+"ReverseProxy": {
-    "Routes": {
+  "Routes": {
-      "auth-login": {
+    "receiver-ui-receiver": {
-        "ClusterId": "auth-hub",
+      "ClusterId": "receiver-ui",
-        "Match": {
+      "Order": 100,
-          "Path": "/api/auth",
+      "Match": {
-          "Methods": [ "POST" ]
+        "Path": "/receiver/{**catch-all}",
-        },
+        "Methods": [ "GET", "HEAD" ]
-        "Transforms": [
-          { "PathSet": "/api/auth/sign-flow" }
-        ]
       }
     },
+    "receiver-ui-login": {
+      "ClusterId": "receiver-ui",
+      "Order": 100,
+      "Match": {
+        "Path": "/login/{**catch-all}",
+        "Methods": [ "GET", "HEAD" ]
+      }
+    },
+    "receiver-ui-sender": {
+      "ClusterId": "receiver-ui",
+      "Order": 100,
+      "Match": {
+        "Path": "/sender/{**catch-all}",
+        "Methods": [ "GET", "HEAD" ]
+      }
+    },
+    "receiver-ui-envelope": {
+      "ClusterId": "receiver-ui",
+      "Order": 100,
+      "Match": {
+        "Path": "/envelope/{EnvelopeKey}",
+        "Methods": [ "GET", "HEAD" ]
+      },
+      "Transforms": [
+        { "PathSet": "/index.html" }
+      ]
+    },
+    "receiver-ui-blazor-framework": {
+      "ClusterId": "receiver-ui",
+      "Order": 50,
+      "Match": {
+        "Path": "/_framework/{**catch-all}",
+        "Methods": [ "GET", "HEAD" ]
+      }
+    },
+    "receiver-ui-blazor-content": {
+      "ClusterId": "receiver-ui",
+      "Order": 50,
+      "Match": {
+        "Path": "/_content/{**catch-all}",
+        "Methods": [ "GET", "HEAD" ]
+      }
+    },
+    "receiver-ui-static-css": {
+      "ClusterId": "receiver-ui",
+      "Order": 200,
+      "Match": {
+        "Path": "/css/{**catch-all}",
+        "Methods": [ "GET", "HEAD" ]
+      },
+      "Transforms": [
+        {
+          "ResponseHeader": "Cache-Control",
+          "Set": "no-cache, no-store, must-revalidate",
+          "When": "Always"
+        }
+      ]
+    },
+    "receiver-ui-static-js": {
+      "ClusterId": "receiver-ui",
+      "Order": 200,
+      "Match": {
+        "Path": "/js/{**catch-all}",
+        "Methods": [ "GET", "HEAD" ]
+      },
+      "Transforms": [
+        {
+          "ResponseHeader": "Cache-Control",
+          "Set": "no-cache, no-store, must-revalidate",
+          "When": "Always"
+        }
+      ]
+    },
+    "receiver-ui-fake-data": {
+      "ClusterId": "receiver-ui",
+      "Order": 200,
+      "Match": {
+        "Path": "/fake-data/{**catch-all}",
+        "Methods": [ "GET", "HEAD" ]
+      }
+    },
+    "receiver-ui-appsettings": {
+      "ClusterId": "receiver-ui",
+      "Order": 50,
+      "Match": {
+        "Path": "/appsettings.json",
+        "Methods": [ "GET", "HEAD" ]
+      }
+    },
+    "receiver-ui-appsettings-dev": {
+      "ClusterId": "receiver-ui",
+      "Order": 50,
+      "Match": {
+        "Path": "/appsettings.Development.json",
+        "Methods": [ "GET", "HEAD" ]
+      }
+    },
+    "receiver-ui-styles": {
+      "ClusterId": "receiver-ui",
+      "Order": 50,
+      "Match": {
+        "Path": "/EnvelopeGenerator.ReceiverUI.styles.css",
+        "Methods": [ "GET", "HEAD" ]
+      }
+    },
+    "receiver-ui-fonts": {
+      "ClusterId": "receiver-ui",
+      "Order": 200,
+      "Match": {
+        "Path": "/fonts/{**catch-all}",
+        "Methods": [ "GET", "HEAD" ]
+      }
+    },
+    "receiver-ui-images": {
+      "ClusterId": "receiver-ui",
+      "Order": 200,
+      "Match": {
+        "Path": "/images/{**catch-all}",
+        "Methods": [ "GET", "HEAD" ]
+      }
+    },
+    "auth-login": {
+      "ClusterId": "auth-hub",
+      "Match": {
+        "Path": "/api/auth",
+        "Methods": [ "POST" ]
+      },
+      "Transforms": [
+        { "PathSet": "/api/auth/sign-flow" }
+      ]
+    },
+    "auth-envelope-receiver-login": {
+      "ClusterId": "auth-hub",
+      "Match": {
+        "Path": "/api/Auth/envelope-receiver/{key}",
+        "Methods": [ "POST" ]
+      },
+      "Transforms": [
+        { "PathPattern": "/api/auth/envelope-receiver/{key}" },
+        {
+          "QueryValueParameter": "cookie",
+          "Set": "true"
+        }
+      ]
+    }
+  },
     "Clusters": {
+      "receiver-ui": {
+        "Destinations": {
+          "primary": {
+            "Address": "https://localhost:52936"
+          }
+        }
+      },
       "auth-hub": {
         "Destinations": {
           "primary": {
@@ -23,3 +173,4 @@
     }
   }
 }
+

EnvelopeGenerator.Application/Common/Dto/AnnotationDto.cs

@@ -8,42 +8,77 @@ public record AnnotationCreateDto
     /// <summary>
     /// 
     /// </summary>
-    public int ElementId { get; init; }
+    public long Id { get; set; }
 
     /// <summary>
     /// 
     /// </summary>
-    public string Name { get; init; } = null!;
+    [Obsolete("Not required for DevExpress")]
+    public int ElementId { get; init; } = -1;
 
     /// <summary>
     /// 
     /// </summary>
-    public string Value { get; init; } = null!;
+    [Obsolete("Not required for DevExpress")]
+    public string Name { get; init; } = string.Empty;
 
     /// <summary>
     /// 
     /// </summary>
-    public string Type { get; init; } = null!;
+    [Obsolete("Not required for DevExpress")]
+    public string Value { get; init; } = string.Empty;
 
     /// <summary>
     /// 
     /// </summary>
+    [Obsolete("Not required for DevExpress")]
+    public string Type { get; init; } = string.Empty;
+
+    /// <summary>
+    /// Horizontal position of the signature field on the page.
+    /// <br/><br/>
+    /// <b>Unit:</b> INCHES (GdPicture14 native), origin at the <b>top-left</b> corner of the page, X increases to the right.
+    /// <br/>
+    /// <b>Conversion to DevExpress:</b> Multiply by 100 (DX uses 1/100 inch).
+    /// Convert: <c>xDX = xInches * 100.0</c>
+    /// <br/>
+    /// <b>Conversion to PDF Points:</b> Multiply by 72 (PSPDFKit, iText7 use 1/72 inch).
+    /// Convert: <c>xPt = xInches * 72.0</c>
+    /// </summary>
     public double? X { get; init; }
 
     /// <summary>
-    /// 
+    /// Vertical position of the signature field on the page.
+    /// <br/><br/>
+    /// <b>Unit:</b> INCHES (GdPicture14 native), origin at the <b>top-left</b> corner of the page, Y increases downward.
+    /// <br/>
+    /// <b>Conversion to DevExpress:</b> Multiply by 100 (DX uses 1/100 inch).
+    /// Convert: <c>yDX = yInches * 100.0</c>
+    /// <br/>
+    /// <b>Conversion to PDF Points (top-left origin):</b> Multiply by 72.
+    /// Convert: <c>yPt = yInches * 72.0</c>
+    /// <br/>
+    /// <b>Conversion to PDF Points (bottom-left origin - iText7):</b> Y-flip required.
+    /// Convert: <c>yPt = (pageHeightInches - yInches - elemHeightInches) * 72.0</c>
     /// </summary>
     public double? Y { get; init; }
 
     /// <summary>
     /// 
     /// </summary>
+    [Obsolete("Not required for DevExpress")]
     public double? Width { get; init; }
 
     /// <summary>
     /// 
     /// </summary>
+    [Obsolete("Not required for DevExpress")]
     public double? Height { get; init; }
+
+    /// <summary>
+    /// Added to eliminate the need for SignatureDto in DevExpress 
+    /// </summary>
+    public int? Page { get; init; }
 }
 
 /// <summary>

EnvelopeGenerator.Application/Common/Dto/SignatureDto.cs

@@ -1,4 +1,5 @@
-using EnvelopeGenerator.Domain.Interfaces;
+using EnvelopeGenerator.Domain.Constants;
+using EnvelopeGenerator.Domain.Interfaces;
 using Microsoft.AspNetCore.Mvc;
 
 namespace EnvelopeGenerator.Application.Common.Dto;
@@ -93,4 +94,14 @@ public class SignatureDto : ISignature
     /// Gets or sets the left position of the element (in layout terms).
     /// </summary>
     public double Left => X;
+
+    /// <summary>
+    /// 
+    /// </summary>
+    public IEnumerable<AnnotationDto>? Annotations { get; set; }
+
+    /// <summary>
+    /// 
+    /// </summary>
+    public SenderAppType SenderAppType { get; set; } = SenderAppType.LegacyFormApp;
 }

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/Documents/Queries/ReadDocumentQuery.cs

@@ -53,14 +53,17 @@ public class ReadDocumentQueryHandler : IRequestHandler<ReadDocumentQuery, Docum
     /// </exception>
     public async Task<DocumentDto> Handle(ReadDocumentQuery query, CancellationToken cancel)
     {
+        var docQuery = _repo.Query.Include(doc => doc.Elements).ThenInclude(e => e.Annotations);
+
         if (query.Id is not null)
         {
-            var doc = await _repo.Query.Where(d => d.Id == query.Id).FirstOrDefaultAsync(cancel);
+            var doc = await docQuery.Where(d => d.Id == query.Id).FirstOrDefaultAsync(cancel);
+            
             return _mapper.Map<DocumentDto>(doc);
         }            
         else if (query.EnvelopeId is not null)
         {
-            var doc = await _repo.Query.Where(d => d.EnvelopeId == query.EnvelopeId).FirstOrDefaultAsync(cancel);
+            var doc = await docQuery.Where(d => d.EnvelopeId == query.EnvelopeId).FirstOrDefaultAsync(cancel);
             return _mapper.Map<DocumentDto>(doc);
         }
 

EnvelopeGenerator.Application/EnvelopeReceivers/Queries/ReadEnvelopeReceiverSecretQuery.cs

@@ -0,0 +1,127 @@
+using AutoMapper;
+using DigitalData.Core.Abstraction.Application.Repository;
+using EnvelopeGenerator.Application.Envelopes.Queries;
+using EnvelopeGenerator.Application.Receivers.Queries;
+using MediatR;
+using EnvelopeGenerator.Domain.Entities;
+using Microsoft.EntityFrameworkCore;
+using EnvelopeGenerator.Application.Common.Dto.EnvelopeReceiver;
+using EnvelopeGenerator.Application.Common.Query;
+using EnvelopeGenerator.Application.Common.Extensions;
+
+namespace EnvelopeGenerator.Application.EnvelopeReceivers.Queries;
+
+/// <summary>
+/// Represents a query for reading an envelope receiver including sensitive fields
+/// (access code, phone number) that are excluded from the standard <see cref="ReadEnvelopeReceiverQuery"/>.
+/// </summary>
+/// <remarks>
+/// Returns a single <see cref="EnvelopeReceiverSecretDto"/> matched by UUID and receiver signature.
+/// Equivalent to the legacy <c>ReadWithSecretByUuidSignatureAsync</c> service method.
+/// </remarks>
+public record ReadEnvelopeReceiverSecretQuery
+    : EnvelopeReceiverQueryBase<ReadEnvelopeQuery, ReadReceiverQuery>,
+      IRequest<EnvelopeReceiverSecretDto?>;
+
+/// <summary>
+/// Extension methods for dispatching <see cref="ReadEnvelopeReceiverSecretQuery"/> via <see cref="IMediator"/>.
+/// </summary>
+public static class ReadEnvelopeReceiverSecretQueryExtensions
+{
+    /// <summary>
+    /// Sends a <see cref="ReadEnvelopeReceiverSecretQuery"/> using the composite key (uuid::signature).
+    /// </summary>
+    /// <param name="mediator">The mediator instance.</param>
+    /// <param name="key">Composite key in the format <c>uuid::signature</c>.</param>
+    /// <param name="cancel">Cancellation token.</param>
+    /// <returns>The matching <see cref="EnvelopeReceiverSecretDto"/>, or <c>null</c> if not found.</returns>
+    public static Task<EnvelopeReceiverSecretDto?> ReadEnvelopeReceiverSecretAsync(
+        this IMediator mediator,
+        string key,
+        CancellationToken cancel = default)
+        => mediator.Send(new ReadEnvelopeReceiverSecretQuery { Key = key }, cancel);
+
+    /// <summary>
+    /// Sends a <see cref="ReadEnvelopeReceiverSecretQuery"/> using UUID and receiver signature.
+    /// </summary>
+    /// <param name="mediator">The mediator instance.</param>
+    /// <param name="uuid">Envelope UUID.</param>
+    /// <param name="signature">Receiver signature.</param>
+    /// <param name="cancel">Cancellation token.</param>
+    /// <returns>The matching <see cref="EnvelopeReceiverSecretDto"/>, or <c>null</c> if not found.</returns>
+    public static Task<EnvelopeReceiverSecretDto?> ReadEnvelopeReceiverSecretAsync(
+        this IMediator mediator,
+        string uuid,
+        string signature,
+        CancellationToken cancel = default)
+    {
+        var q = new ReadEnvelopeReceiverSecretQuery();
+        q.Envelope.Uuid = uuid;
+        q.Receiver.Signature = signature;
+        return mediator.Send(q, cancel);
+    }
+
+    /// <summary>
+    /// Handles <see cref="ReadEnvelopeReceiverSecretQuery"/> and returns a
+    /// <see cref="EnvelopeReceiverSecretDto"/> containing sensitive fields.
+    /// </summary>
+    public class ReadEnvelopeReceiverSecretQueryHandler
+        : IRequestHandler<ReadEnvelopeReceiverSecretQuery, EnvelopeReceiverSecretDto?>
+    {
+        private readonly IRepository<EnvelopeReceiver> _repo;
+        private readonly IRepository<Receiver> _rcvRepo;
+        private readonly IMapper _mapper;
+
+        /// <summary>
+        /// Initializes a new instance of <see cref="ReadEnvelopeReceiverSecretQueryHandler"/>.
+        /// </summary>
+        /// <param name="envelopeReceiver">Repository for <see cref="EnvelopeReceiver"/>.</param>
+        /// <param name="rcvRepo">Repository for <see cref="Receiver"/>.</param>
+        /// <param name="mapper">AutoMapper instance.</param>
+        public ReadEnvelopeReceiverSecretQueryHandler(
+            IRepository<EnvelopeReceiver> envelopeReceiver,
+            IRepository<Receiver> rcvRepo,
+            IMapper mapper)
+        {
+            _repo = envelopeReceiver;
+            _rcvRepo = rcvRepo;
+            _mapper = mapper;
+        }
+
+        /// <summary>
+        /// Handles the query and returns the matching <see cref="EnvelopeReceiverSecretDto"/>.
+        /// </summary>
+        /// <param name="request">The query containing filter criteria.</param>
+        /// <param name="cancel">Cancellation token.</param>
+        /// <returns>
+        /// The matched <see cref="EnvelopeReceiverSecretDto"/>, or <c>null</c> if no record is found.
+        /// </returns>
+        public async Task<EnvelopeReceiverSecretDto?> Handle(
+            ReadEnvelopeReceiverSecretQuery request,
+            CancellationToken cancel)
+        {
+            var q = _repo.Query.Where(request, notnull: false);
+
+            var envRcvs = await q
+                .Include(er => er.Envelope).ThenInclude(e => e!.Documents!).ThenInclude(d => d.Elements)
+                .Include(er => er.Envelope).ThenInclude(e => e!.Histories)
+                .Include(er => er.Envelope).ThenInclude(e => e!.User)
+                .Include(er => er.Receiver)
+                .ToListAsync(cancel);
+
+            if (request.Receiver.HasAnyCriteria && envRcvs.Count != 0)
+            {
+                var receiver = await _rcvRepo.Query.Where(request.Receiver).FirstAsync(cancel);
+
+                foreach (var item in envRcvs)
+                    item.Envelope?.Documents?.FirstOrDefault()?.Elements?.RemoveAll(s => s.ReceiverId != receiver.Id);
+            }
+
+            var envRcv = envRcvs.FirstOrDefault();
+            if (envRcv is null)
+                return null;
+
+            return _mapper.Map<EnvelopeReceiverSecretDto>(envRcv);
+        }
+    }
+}

EnvelopeGenerator.Application/Envelopes/Commands/CreateEnvelopeCommand.cs

@@ -40,10 +40,10 @@ public record CreateEnvelopeCommand : IRequest<EnvelopeDto?>
     /// </summary>
     /// <param name="userId"></param>
     /// <returns></returns>
-    public bool Authorize(int userId)
+    public CreateEnvelopeCommand WithAuth(int userId)
     {
         UserId = userId;
-        return true;
+        return this;
     }
 
     /// <summary>

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.DependencyInjection/DependencyInjection.cs

@@ -0,0 +1,145 @@
+using Microsoft.Extensions.Configuration;
+using Microsoft.Extensions.DependencyInjection;
+using EnvelopeGenerator.Application;
+using EnvelopeGenerator.Application.Common.Interfaces.Services;
+using EnvelopeGenerator.Application.Services;
+using EnvelopeGenerator.Infrastructure;
+using DigitalData.EmailProfilerDispatcher;
+using DigitalData.UserManager.DependencyInjection;
+
+namespace EnvelopeGenerator.DependencyInjection;
+
+/// <summary>
+/// Controls which optional services are registered by <see cref="DependencyInjection.AddEnvelopeGenerator"/>.
+/// All flags default to <c>true</c>. Set a flag to <c>false</c> if the consuming project
+/// already registers that service itself or simply does not need it.
+/// </summary>
+public sealed class EnvelopeGeneratorOptions
+{
+    /// <summary>Calls <c>AddHttpContextAccessor()</c>. Default: <c>true</c>.</summary>
+    public bool AddHttpContextAccessor { get; set; } = true;
+
+    /// <summary>
+    /// Calls <c>AddDistributedSqlServerCache()</c> with the supplied <see cref="SqlCacheOptions"/>.
+    /// Requires <see cref="SqlCacheOptions"/> to be configured. Default: <c>true</c>.
+    /// </summary>
+    public bool AddDistributedSqlServerCache { get; set; } = true;
+
+    /// <summary>
+    /// Options for the distributed SQL Server cache.
+    /// Required when <see cref="AddDistributedSqlServerCache"/> is <c>true</c>.
+    /// </summary>
+    public SqlCacheOptions? SqlCacheOptions { get; set; }
+
+    /// <summary>Calls <c>AddDispatcher&lt;TDbContext&gt;()</c>. Default: <c>true</c>.</summary>
+    public bool AddDispatcher { get; set; } = true;
+
+    /// <summary>Calls <c>AddMemoryCache()</c>. Default: <c>true</c>.</summary>
+    public bool AddMemoryCache { get; set; } = true;
+
+    /// <summary>Calls <c>AddUserManager&lt;TDbContext&gt;()</c>. Default: <c>true</c>.</summary>
+    public bool AddUserManager { get; set; } = true;
+}
+
+/// <summary>Options for <c>AddDistributedSqlServerCache</c>.</summary>
+public sealed class SqlCacheOptions
+{
+    /// <summary>SQL Server connection string.</summary>
+    public string ConnectionString { get; set; } = string.Empty;
+
+    /// <summary>Schema name. Default: <c>dbo</c>.</summary>
+    public string SchemaName { get; set; } = "dbo";
+
+    /// <summary>Table name. Default: <c>TBDD_CACHE</c>.</summary>
+    public string TableName { get; set; } = "TBDD_CACHE";
+}
+
+/// <summary>
+/// Extension methods for registering EnvelopeGenerator services into an <see cref="IServiceCollection"/>.
+/// Use <see cref="AddEnvelopeGenerator{TDbContext}"/> as the single entry-point for projects that need both the
+/// application layer (MediatR, AutoMapper, CRUD services, configuration sections) and the infrastructure
+/// layer (repositories, DbContext, SQL executors).
+/// For projects that do not need a database (e.g. lightweight API gateways or unit-test hosts), use
+/// <see cref="AddEnvelopeGeneratorCore"/> to register only the application layer.
+/// </summary>
+public static class DependencyInjection
+{
+    /// <summary>
+    /// Registers the full EnvelopeGenerator stack using <see cref="EGDbContext"/> as the DbContext type.
+    /// </summary>
+    public static IServiceCollection AddEnvelopeGenerator(
+        this IServiceCollection services,
+        IConfiguration configuration,
+        Action<EnvelopeGenerator.Infrastructure.DependencyInjection.Config>? infrastructureOptions = null,
+        Action<EnvelopeGeneratorOptions>? options = null)
+    {
+        var opt = new EnvelopeGeneratorOptions();
+        options?.Invoke(opt);
+
+#pragma warning disable CS0618
+        // Application layer: CRUD services, MediatR, AutoMapper, configuration sections.
+        services.AddEnvelopeGeneratorServices(configuration);
+
+        // Infrastructure layer: repositories, DbContext, Dapper type maps, SQL executors.
+        services.AddEnvelopeGeneratorInfrastructureServices(cfg =>
+        {
+            infrastructureOptions?.Invoke(cfg);
+        });
+#pragma warning restore CS0618
+
+        if (opt.AddHttpContextAccessor)
+            services.AddHttpContextAccessor();
+
+        if (opt.AddDistributedSqlServerCache && opt.SqlCacheOptions is { } cacheOpts)
+            services.AddDistributedSqlServerCache(o =>
+            {
+                o.ConnectionString = cacheOpts.ConnectionString;
+                o.SchemaName = cacheOpts.SchemaName;
+                o.TableName = cacheOpts.TableName;
+            });
+
+        if (opt.AddDispatcher)
+            services.AddDispatcher<EGDbContext>();
+
+        if (opt.AddMemoryCache)
+            services.AddMemoryCache();
+
+#pragma warning disable CS0618
+        if (opt.AddUserManager)
+            services.AddUserManager<EGDbContext>();
+#pragma warning restore CS0618
+
+        return services;
+    }
+
+    /// <summary>
+    /// Registers only the <em>application</em> layer services (MediatR handlers, AutoMapper profiles,
+    /// CRUD services, configuration sections) without any infrastructure / database dependencies.
+    /// </summary>
+    /// <param name="services">Service collection to register services into.</param>
+    /// <param name="configuration">Application configuration used to bind application-level option sections.</param>
+    /// <returns>The updated <see cref="IServiceCollection"/>.</returns>
+#pragma warning disable CS0618
+    public static IServiceCollection AddEnvelopeGeneratorCore(
+        this IServiceCollection services,
+        IConfiguration configuration)
+    {
+        services.AddEnvelopeGeneratorServices(configuration);
+        return services;
+    }
+#pragma warning restore CS0618
+
+    /// <summary>
+    /// Registers <see cref="EnvelopeMailService"/> as the <see cref="IEnvelopeMailService"/> scoped
+    /// implementation.
+    /// </summary>
+    /// <param name="services">Service collection to register services into.</param>
+    /// <returns>The updated <see cref="IServiceCollection"/>.</returns>
+#pragma warning disable CS0618
+    public static IServiceCollection AddEnvelopeMailService(this IServiceCollection services)
+    {
+        services.AddScoped<IEnvelopeMailService, EnvelopeMailService>();
+        return services;
+    }
+#pragma warning restore CS0618
+}

EnvelopeGenerator.DependencyInjection/EnvelopeGenerator.DependencyInjection.csproj

@@ -0,0 +1,176 @@
+<Project Sdk="Microsoft.NET.Sdk">
+
+  <PropertyGroup>
+    <TargetFrameworks>net7.0;net8.0;net9.0</TargetFrameworks>
+    <ImplicitUsings>enable</ImplicitUsings>
+    <Nullable>enable</Nullable>
+
+    <!-- NuGet package metadata -->
+    <PackageId>EnvelopeGenerator</PackageId>
+    <Authors>Digital Data GmbH</Authors>
+    <Company>Digital Data GmbH</Company>
+    <Product>EnvelopeGenerator</Product>
+    <Description>
+      Envelope Generator ist eine Bibliothek zur Verwaltung und Verarbeitung digitaler Umschläge (Envelopes).
+      Dieses Paket enthält die Dependency-Injection-Erweiterungsmethoden und bündelt die Application-
+      sowie Infrastructure-Schicht in einer einzigen NuGet-Referenz.
+    </Description>
+    <Copyright>Copyright 2024 Digital Data GmbH</Copyright>
+    <RepositoryUrl>http://git.dd:3000/AppStd/EnvelopeGenerator.git</RepositoryUrl>
+    <PackageTags>digital data envelope generator di dependency injection</PackageTags>
+    <PackageRequireLicenseAcceptance>false</PackageRequireLicenseAcceptance>
+    <Version>1.2.0.3</Version>
+    <AssemblyVersion>1.2.0.3</AssemblyVersion>
+    <FileVersion>1.2.0.3</FileVersion>
+    <GeneratePackageOnBuild>false</GeneratePackageOnBuild>
+  </PropertyGroup>
+
+  <!-- ASP.NET Core shared framework (AddHttpContextAccessor, AddMemoryCache, etc.) -->
+  <ItemGroup>
+    <FrameworkReference Include="Microsoft.AspNetCore.App" />
+  </ItemGroup>
+
+  <!--
+    All dependencies are declared here.
+    Because Application and Infrastructure DLLs are bundled via PrivateAssets=all,
+    their PackageReferences have been moved to this project so that the correct
+    dependencies are written to the nuspec and a consuming project works with
+    a single package install.
+  -->
+  <ItemGroup>
+    <!-- DigitalData BaGet packages -->
+    <PackageReference Include="DigitalData.Core.Abstraction.Application" Version="1.6.0" />
+    <PackageReference Include="DigitalData.Core.Application" Version="3.4.0" />
+    <PackageReference Include="DigitalData.Core.Client" Version="2.1.0" />
+    <PackageReference Include="DigitalData.Core.Exceptions" Version="1.1.0" />
+    <PackageReference Include="DigitalData.Core.Infrastructure" Version="2.6.1" />
+    <PackageReference Include="DigitalData.EmailProfilerDispatcher" Version="3.1.1" />
+    <PackageReference Include="UserManager" Version="1.1.3" />
+
+    <!-- ORM / Database -->
+    <PackageReference Include="Dapper" Version="2.1.66" />
+    <PackageReference Include="Microsoft.Data.SqlClient" Version="5.2.2" />
+
+    <!-- Application services -->
+    <PackageReference Include="MediatR" Version="12.5.0" />
+    <PackageReference Include="QRCoder" Version="1.6.0" />
+    <PackageReference Include="QRCoder-ImageSharp" Version="0.10.0" />
+    <PackageReference Include="QuestPDF" Version="2025.7.1" />
+    <PackageReference Include="Otp.NET" Version="1.4.0" />
+
+    <!-- Security / Identity -->
+    <PackageReference Include="Microsoft.Identity.Client" Version="4.82.1" />
+
+    <!-- Utilities -->
+    <PackageReference Include="HtmlSanitizer" Version="9.0.892" />
+    <PackageReference Include="SixLabors.ImageSharp" Version="3.1.12" />
+    <PackageReference Include="System.Formats.Asn1" Version="10.0.3" />
+    <PackageReference Include="System.Security.AccessControl" Version="6.0.1" />
+
+    <!-- DI abstractions -->
+    <PackageReference Include="Microsoft.Extensions.Configuration.Abstractions" Version="9.0.6" />
+    <PackageReference Include="Microsoft.Extensions.DependencyInjection.Abstractions" Version="9.0.6" />
+  </ItemGroup>
+
+  <!-- TFM-specific packages -->
+  <ItemGroup Condition="'$(TargetFramework)' == 'net7.0'">
+    <PackageReference Include="AutoMapper" Version="13.0.1" />
+    <PackageReference Include="CommandDotNet" Version="7.0.5" />
+    <PackageReference Include="Microsoft.AspNetCore.Authentication.JwtBearer" Version="7.0.20" />
+    <PackageReference Include="Microsoft.Extensions.Caching.SqlServer" Version="7.0.20" />
+    <PackageReference Include="Microsoft.EntityFrameworkCore" Version="7.0.20" />
+    <PackageReference Include="Microsoft.EntityFrameworkCore.Relational" Version="7.0.20" />
+    <PackageReference Include="Microsoft.EntityFrameworkCore.SqlServer" Version="7.0.20" />
+  </ItemGroup>
+
+  <ItemGroup Condition="'$(TargetFramework)' == 'net8.0'">
+    <PackageReference Include="AutoMapper" Version="14.0.0" />
+    <PackageReference Include="CommandDotNet" Version="8.1.1" />
+    <PackageReference Include="Microsoft.AspNetCore.Authentication.JwtBearer" Version="8.0.17" />
+    <PackageReference Include="Microsoft.Extensions.Caching.SqlServer" Version="8.0.17" />
+    <PackageReference Include="Microsoft.EntityFrameworkCore" Version="8.0.17" />
+    <PackageReference Include="Microsoft.EntityFrameworkCore.Relational" Version="8.0.17" />
+    <PackageReference Include="Microsoft.EntityFrameworkCore.SqlServer" Version="8.0.17" />
+  </ItemGroup>
+
+  <ItemGroup Condition="'$(TargetFramework)' == 'net9.0'">
+    <PackageReference Include="AutoMapper" Version="14.0.0" />
+    <PackageReference Include="CommandDotNet" Version="8.1.1" />
+    <PackageReference Include="Microsoft.AspNetCore.Authentication.JwtBearer" Version="9.0.6" />
+    <PackageReference Include="Microsoft.Extensions.Caching.SqlServer" Version="9.0.6" />
+    <PackageReference Include="Microsoft.EntityFrameworkCore" Version="9.0.6" />
+    <PackageReference Include="Microsoft.EntityFrameworkCore.Relational" Version="9.0.6" />
+    <PackageReference Include="Microsoft.EntityFrameworkCore.SqlServer" Version="9.0.6" />
+  </ItemGroup>
+
+  <ItemGroup>
+    <ProjectReference Include="..\EnvelopeGenerator.Application\EnvelopeGenerator.Application.csproj">
+      <PrivateAssets>all</PrivateAssets>
+    </ProjectReference>
+    <ProjectReference Include="..\EnvelopeGenerator.Domain\EnvelopeGenerator.Domain.csproj">
+      <PrivateAssets>all</PrivateAssets>
+    </ProjectReference>
+    <ProjectReference Include="..\EnvelopeGenerator.Infrastructure\EnvelopeGenerator.Infrastructure.csproj">
+      <PrivateAssets>all</PrivateAssets>
+    </ProjectReference>
+  </ItemGroup>
+
+  <!-- Bundle dependency DLLs into the package lib folder -->
+  <Target Name="IncludeDependencyDlls" BeforeTargets="_GetPackageFiles">
+    <ItemGroup>
+      <_DepDlls Include="&#xD;&#xA;        ..\EnvelopeGenerator.Application\bin\$(Configuration)\%(ProjectReference.TargetFramework)\EnvelopeGenerator.Application.dll;&#xD;&#xA;        ..\EnvelopeGenerator.Domain\bin\$(Configuration)\%(ProjectReference.TargetFramework)\EnvelopeGenerator.Domain.dll;&#xD;&#xA;        ..\EnvelopeGenerator.Infrastructure\bin\$(Configuration)\%(ProjectReference.TargetFramework)\EnvelopeGenerator.Infrastructure.dll" />
+    </ItemGroup>
+  </Target>
+
+  <!--
+    Rebuild all dependency projects for every TFM before packing so that
+    the DLLs bundled into the package are always up-to-date.
+    Run with: dotnet pack -c Release
+  -->
+  <Target Name="RebuildDependenciesBeforePack" BeforeTargets="GenerateNuspec">
+    <MSBuild Projects="..\EnvelopeGenerator.Application\EnvelopeGenerator.Application.csproj"
+             Targets="Build"
+             Properties="Configuration=$(Configuration);TargetFramework=net7.0" />
+    <MSBuild Projects="..\EnvelopeGenerator.Application\EnvelopeGenerator.Application.csproj"
+             Targets="Build"
+             Properties="Configuration=$(Configuration);TargetFramework=net8.0" />
+    <MSBuild Projects="..\EnvelopeGenerator.Application\EnvelopeGenerator.Application.csproj"
+             Targets="Build"
+             Properties="Configuration=$(Configuration);TargetFramework=net9.0" />
+
+    <MSBuild Projects="..\EnvelopeGenerator.Domain\EnvelopeGenerator.Domain.csproj"
+             Targets="Build"
+             Properties="Configuration=$(Configuration);TargetFramework=net7.0" />
+    <MSBuild Projects="..\EnvelopeGenerator.Domain\EnvelopeGenerator.Domain.csproj"
+             Targets="Build"
+             Properties="Configuration=$(Configuration);TargetFramework=net8.0" />
+    <MSBuild Projects="..\EnvelopeGenerator.Domain\EnvelopeGenerator.Domain.csproj"
+             Targets="Build"
+             Properties="Configuration=$(Configuration);TargetFramework=net9.0" />
+
+    <MSBuild Projects="..\EnvelopeGenerator.Infrastructure\EnvelopeGenerator.Infrastructure.csproj"
+             Targets="Build"
+             Properties="Configuration=$(Configuration);TargetFramework=net7.0" />
+    <MSBuild Projects="..\EnvelopeGenerator.Infrastructure\EnvelopeGenerator.Infrastructure.csproj"
+             Targets="Build"
+             Properties="Configuration=$(Configuration);TargetFramework=net8.0" />
+    <MSBuild Projects="..\EnvelopeGenerator.Infrastructure\EnvelopeGenerator.Infrastructure.csproj"
+             Targets="Build"
+             Properties="Configuration=$(Configuration);TargetFramework=net9.0" />
+  </Target>
+
+  <Target Name="BundleReferencedDlls" AfterTargets="Build">
+    <ItemGroup>
+      <BuildOutputInPackage Include="..\EnvelopeGenerator.Application\bin\$(Configuration)\net7.0\EnvelopeGenerator.Application.dll" TargetFramework="net7.0" />
+      <BuildOutputInPackage Include="..\EnvelopeGenerator.Application\bin\$(Configuration)\net8.0\EnvelopeGenerator.Application.dll" TargetFramework="net8.0" />
+      <BuildOutputInPackage Include="..\EnvelopeGenerator.Application\bin\$(Configuration)\net9.0\EnvelopeGenerator.Application.dll" TargetFramework="net9.0" />
+      <BuildOutputInPackage Include="..\EnvelopeGenerator.Domain\bin\$(Configuration)\net7.0\EnvelopeGenerator.Domain.dll" TargetFramework="net7.0" />
+      <BuildOutputInPackage Include="..\EnvelopeGenerator.Domain\bin\$(Configuration)\net8.0\EnvelopeGenerator.Domain.dll" TargetFramework="net8.0" />
+      <BuildOutputInPackage Include="..\EnvelopeGenerator.Domain\bin\$(Configuration)\net9.0\EnvelopeGenerator.Domain.dll" TargetFramework="net9.0" />
+      <BuildOutputInPackage Include="..\EnvelopeGenerator.Infrastructure\bin\$(Configuration)\net7.0\EnvelopeGenerator.Infrastructure.dll" TargetFramework="net7.0" />
+      <BuildOutputInPackage Include="..\EnvelopeGenerator.Infrastructure\bin\$(Configuration)\net8.0\EnvelopeGenerator.Infrastructure.dll" TargetFramework="net8.0" />
+      <BuildOutputInPackage Include="..\EnvelopeGenerator.Infrastructure\bin\$(Configuration)\net9.0\EnvelopeGenerator.Infrastructure.dll" TargetFramework="net9.0" />
+    </ItemGroup>
+  </Target>
+
+</Project>

EnvelopeGenerator.Domain/Constants/SenderAppType.cs

@@ -0,0 +1,8 @@
+namespace EnvelopeGenerator.Domain.Constants
+{
+    public enum SenderAppType
+    {
+        LegacyFormApp = 0,
+        ReceiverUIBlazorApp = 1
+    }
+}

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.ReceiverUI/App.razor

@@ -0,0 +1,10 @@
+<Router AppAssembly="@typeof(Program).Assembly">
+    <Found Context="routeData">
+        <RouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)" />
+    </Found>
+    <NotFound>
+        <LayoutView Layout="@typeof(MainLayout)">
+            <p>Sorry, there's nothing at this address.</p>
+        </LayoutView>
+    </NotFound>
+</Router>

EnvelopeGenerator.ReceiverUI/Data/Adjustment.cs

@@ -0,0 +1,44 @@
+namespace EnvelopeGenerator.ReceiverUI.Data {
+    public class Adjustment
+    {
+        public static Adjustment CreateBalanceForward(DateTime dt, int random)
+        {
+            var rnd = new DeterministicRandom(random);
+            Adjustment res = new Adjustment();
+            res.currentDateTime = dt;
+            res.currentDescription = "Balance Forward";
+            res.currentAmount = rnd.Random(10, 300) * 10;
+            return res;
+        }
+        public static Adjustment CreatePayment(DateTime dt, int random)
+        {
+            var rnd = new DeterministicRandom(random);
+            Adjustment res = new Adjustment();
+            res.currentDateTime = dt;
+            res.currentDescription = "Payment";
+            res.currentAmount = -rnd.Random(1, 40) * 10;
+            return res;
+        }
+        public static Adjustment CreateCharge(DateTime dt, int random)
+        {
+            var rnd = new DeterministicRandom(random);
+            Adjustment res = new Adjustment();
+            res.currentDateTime = dt;
+            res.currentDescription = rnd.GetRandomItem(bills);
+            res.currentAmount = rnd.Random(10, 50) * 10;
+            return res;
+        }
+
+        DateTime currentDateTime;
+        string currentDescription = "";
+        double currentAmount = 0;
+        static readonly string[] bills = new string[] { "Bill - Insurance", "Bill - Electricity", "Bill - Rent", "Bill - Phone", "Bill - Office Supplies" };
+        public DateTime Date { get { return currentDateTime; } }
+        public string Description { get { return currentDescription; } }
+        public double Amount { get { return currentAmount; } }
+
+        public Adjustment()
+        {
+        }
+    }
+}

EnvelopeGenerator.ReceiverUI/Data/Customer.cs

@@ -0,0 +1,64 @@
+using DevExpress.DataAccess.Sql;
+using DevExpress.DataAccess.Sql.DataApi;
+
+namespace EnvelopeGenerator.ReceiverUI.Data {
+    public class Customer {
+        static List<Customer> currentCustomers = new List<Customer>();
+
+        public static List<Customer> Customers { get { return currentCustomers; } }
+        static Customer() {
+            try {
+                SqlDataSource ds = new SqlDataSource("NWindConnectionString");
+                SelectQuery query = SelectQueryFluentBuilder
+                    .AddTable("Customers")
+                    .SelectAllColumns()
+                    .Build("Customers");
+                ds.Queries.Add(query);
+                ds.RebuildResultSchema();
+                ds.Fill();
+                ITable src = ds.Result["Customers"];
+                foreach(var row in src) {
+                    currentCustomers.Add(new Customer() {
+                        CustomerID = row.GetValue<string>("CustomerID"),
+                        Address = row.GetValue<string>("Address"),
+                        CompanyName = row.GetValue<string>("CompanyName"),
+                        ContactName = row.GetValue<string>("ContactName"),
+                        ContactTitle = row.GetValue<string>("ContactTitle"),
+                        Country = row.GetValue<string>("Country"),
+                        City = row.GetValue<string>("City"),
+                        Fax = row.GetValue<string>("Fax"),
+                        Phone = row.GetValue<string>("Phone"),
+                        PostalCode = row.GetValue<string>("PostalCode"),
+                        Region = row.GetValue<string>("Region")
+                    });
+                }
+            } catch {
+                currentCustomers.Add(new Customer() { 
+                    Address = "Obere Str. 57",
+                    City = "Berlin",
+                    CompanyName = "Alfreds Futterkiste",
+                    ContactName = "Maria Anders",
+                    ContactTitle = "Sales Representative",
+                    Country = "Germany",
+                    CustomerID = "ALFKI",
+                    Fax = "030-0076545",
+                    Phone = "030-0074321",
+                    PostalCode = "12209"
+                });
+            }
+        }
+
+        public string CustomerID { get; set; }
+        public string CompanyName { get; set; }
+        public string ContactName { get; set; }
+        public string ContactTitle { get; set; }
+        public string Address { get; set; }
+        public string City { get; set; }
+        public string PostalCode { get; set; }
+        public string Region { get; set; }
+        public string Country { get; set; }
+        public string Phone { get; set; }
+        public string Fax { get; set; }
+
+    }
+}

EnvelopeGenerator.ReceiverUI/Data/DataItem.cs

@@ -0,0 +1,71 @@
+namespace EnvelopeGenerator.ReceiverUI.Data {
+    public class DataItem {
+        static readonly string[] accountType = new string[] { "Energy", "Manufacturing", "Estate", "Food", "Services" };
+        public string CustomerID { get; set; }
+        public string CompanyName { get; set; }
+        public string ContactName { get; set; }
+        public string ContactTitle { get; set; }
+        public string Address { get; set; }
+        public string City { get; set; }
+        public string PostalCode { get; set; }
+        public string Region { get; set; }
+        public string Country { get; set; }
+        public string Phone { get; set; }
+        public string Fax { get; set; }
+        public string Email { get; set; }
+        public string Invoice { get; set; }
+        public string CustomerAccount { get; set; }
+        public string CustomerIdentifiers { get; set; }
+        public DateTime BillingDate { get; set; }
+        public DateTime BillingPeriodStart { get; set; }
+        public DateTime BillingPeriodEnd { get; set; }
+        public string Terms { get; set; }
+        public string TermsID { get; set; }
+        public Adjustment[] Adjustments { get; set; }
+
+        public DataItem(int i) {
+            var rnd = new DeterministicRandom(i);
+            Customer c = rnd.GetRandomItem(Customer.Customers);
+            CustomerID = c.CustomerID;
+            CompanyName = c.CompanyName;
+            ContactName = c.ContactName;
+            ContactTitle = c.ContactTitle;
+            Address = c.Address;
+            City = c.City;
+            PostalCode = c.PostalCode;
+            Region = c.Region;
+            Country = c.Country;
+            Phone = c.Phone;
+            Fax = c.Fax;
+            Email = ContactName.Split(' ')[0].Replace(' ', '.').ToLower() + "@" + CompanyName.Split(' ')[0].ToLower() + ".com";
+            Invoice = string.Format("{0}{1}-{2}", rnd.RandomChar, rnd.Random(100, 1000), rnd.Random(100, 1000));
+            CustomerAccount = rnd.GetRandomItem(accountType);
+            CustomerIdentifiers = string.Format("{0}-{1}", rnd.Random(1000, 10000), rnd.Random(10, 100));
+            BillingPeriodStart = rnd.RandomTime();
+            BillingPeriodEnd = rnd.RandomTime(BillingPeriodStart, 7 * 24, 30 * 24);
+            BillingDate = rnd.RandomTime(BillingPeriodEnd, 7 * 24, 30 * 24);
+            Term currentTerm = rnd.GetRandomItem(Term.Terms);
+            Terms = currentTerm.Name;
+
+            int adjustmentsCount = rnd.Random(6) + 4;
+            Adjustments = new Adjustment[adjustmentsCount];
+            int h = (int)((BillingPeriodEnd - BillingPeriodStart).TotalHours / adjustmentsCount);
+
+            Adjustments[0] = Adjustment.CreateBalanceForward(rnd.RandomTime(BillingPeriodStart, 0, h), rnd.Random(10000));
+
+            int[] items = rnd.RandomList(adjustmentsCount - 1, 2);
+
+            for(int j = 1; j < Adjustments.Length; j++) {
+                DateTime nextDate = rnd.RandomTime(BillingPeriodStart.AddHours(h * j), 0, h);
+                    switch(items[j - 1]) {
+                        case 0:
+                            Adjustments[j] = Adjustment.CreateCharge(nextDate, rnd.Random(10000));
+                            break;
+                        case 1:
+                            Adjustments[j] = Adjustment.CreatePayment(nextDate, rnd.Random(10000));
+                            break;
+                    }
+            }
+        }
+    }
+}

EnvelopeGenerator.ReceiverUI/Data/DataItemList.cs

@@ -0,0 +1,70 @@
+using System.Collections;
+
+namespace EnvelopeGenerator.ReceiverUI.Data {
+    public class DataItemList : IList<DataItem>, IList {
+        readonly int rowCount;
+
+        public DataItem this[int index] { get { return new DataItem(index); } set { } }
+        public int Count { get { return rowCount; } }
+        public bool IsReadOnly { get { return false; } }
+        public bool IsFixedSize { get { return false; } }
+        public object SyncRoot { get { return true; } }
+        public bool IsSynchronized { get { return true; } }
+        object IList.this[int index] { get { return new DataItem(index); } set { } }
+
+        public DataItemList(int rowCount) {
+            this.rowCount = rowCount;
+        }
+        public IEnumerator<DataItem> GetEnumerator() {
+            throw new NotImplementedException();
+        }
+        public int Add(object value) {
+            throw new NotImplementedException();
+        }
+        public bool Contains(object value) {
+            throw new NotImplementedException();
+        }
+        public void Clear() {
+            throw new NotImplementedException();
+        }
+        public int IndexOf(object value) {
+            throw new NotImplementedException();
+        }
+        public void Insert(int index, object value) {
+            throw new NotImplementedException();
+        }
+        public void Remove(object value) {
+            throw new NotImplementedException();
+        }
+        public void RemoveAt(int index) {
+            throw new NotImplementedException();
+        }
+        public void CopyTo(Array array, int index) {
+            throw new NotImplementedException();
+        }
+        IEnumerator IEnumerable.GetEnumerator() {
+            throw new NotImplementedException();
+        }
+        public int IndexOf(DataItem item) {
+            throw new NotImplementedException();
+        }
+        public void Insert(int index, DataItem item) {
+            throw new NotImplementedException();
+        }
+        public void Add(DataItem item) {
+            throw new NotImplementedException();
+        }
+        public bool Contains(DataItem item) {
+            throw new NotImplementedException();
+        }
+        public void CopyTo(DataItem[] array, int arrayIndex) {
+            throw new NotImplementedException();
+        }
+        public bool Remove(DataItem item) {
+            throw new NotImplementedException();
+        }
+        void ICollection<DataItem>.CopyTo(DataItem[] array, int arrayIndex) {
+            CopyTo(array, arrayIndex);
+        }
+    }
+}

EnvelopeGenerator.ReceiverUI/Data/DeterministicRandom.cs

@@ -0,0 +1,60 @@
+namespace EnvelopeGenerator.ReceiverUI.Data {
+    class DeterministicRandom {
+        const int randomCount = 10000;
+        static readonly int[] deterministicRandomNumbers;
+        static readonly DateTime time;
+        int rnd;
+        int Next {
+            get {
+                rnd = deterministicRandomNumbers[rnd % randomCount];
+                return rnd;
+            }
+        }
+        public char RandomChar {
+            get {
+                return (char)((int)'A' + Random(0, 26));
+            }
+        }
+        public int[] RandomList(int count, int to) {
+            int[] res = new int[count];
+            for(int i = 0; i < Math.Min(count, to); i++)
+                res[i] = i;
+            for(int i = to; i < count; i++)
+                res[i] = Random(to);
+
+            for(int i = 0; i < count; i++) {
+                int ind = Random(count);
+                int temp = res[ind];
+                res[ind] = res[i];
+                res[i] = temp;
+            }
+            return res;
+        }
+        public int Random(int to) {
+            return Random(0, to);
+        }
+        public int Random(int from, int to) {
+            return Next % Math.Max(1, to - from) + from;
+        }
+        public T GetRandomItem<T>(IList<T> list) {
+            return list[Next % list.Count];
+        }
+        public DateTime RandomTime() {
+            return RandomTime(time, 0, 30 * 24);
+        }
+        public DateTime RandomTime(DateTime from, int fromHours, int toHours) {
+            return from.AddHours(Next % (toHours - fromHours) + fromHours);
+        }
+
+        static DeterministicRandom() {
+            time = DateTime.Now.AddDays(-62);
+            Random currentRandom = new Random(randomCount);
+            deterministicRandomNumbers = new int[randomCount];
+            for(int i = 0; i < randomCount; i++)
+                deterministicRandomNumbers[i] = currentRandom.Next(randomCount);
+        }
+        public DeterministicRandom(int i) {
+            this.rnd = i + (i >> 10) + (i >> 20);
+        }
+    }
+}

EnvelopeGenerator.ReceiverUI/Data/Term.cs

@@ -0,0 +1,15 @@
+namespace EnvelopeGenerator.ReceiverUI.Data {
+    public struct Term {
+        public static readonly Term[] Terms = new Term[] {
+            new Term("Payment seven days after invoice date" ),
+            new Term("Payment ten days after invoice date" ),
+            new Term("End of month" ),
+            new Term("21st of the month following invoice date" ),
+        };
+        readonly string currentName;
+        public string Name { get { return currentName; } }
+        public Term(string currentName) {
+            this.currentName = currentName;
+        }
+    }
+}

EnvelopeGenerator.ReceiverUI/EnvelopeGenerator.ReceiverUI.csproj

@@ -0,0 +1,51 @@
+<Project Sdk="Microsoft.NET.Sdk.BlazorWebAssembly">
+  <PropertyGroup>
+    <TargetFramework>net8.0</TargetFramework>
+    <ImplicitUsings>enable</ImplicitUsings>
+    <WasmBuildNative>true</WasmBuildNative>
+	<InvariantGlobalization>false</InvariantGlobalization>
+	<BlazorWebAssemblyLoadAllGlobalizationData>true</BlazorWebAssemblyLoadAllGlobalizationData>
+	  
+	<Nullable>enable</Nullable>
+	<PackageId>EnvelopeGenerator.ReceiverUI</PackageId>
+	<Authors>Digital Data GmbH</Authors>
+	<Company>Digital Data GmbH</Company>
+	<Product>EnvelopeGenerator.ReceiverUI</Product>
+	<PackageIcon>Assets\icon.ico</PackageIcon>
+	<PackageTags>digital data envelope generator web</PackageTags>
+	<Description>EnvelopeGenerator.ReceiverUI is a Blazor WebAssembly 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>
+	<Version>1.4.1</Version>
+	<!-- NuGet package version -->
+	<AssemblyVersion>1.4.1.0</AssemblyVersion>
+	<!-- Assembly version for API compatibility -->
+	<FileVersion>1.4.1.0</FileVersion>
+	<!-- Windows file version -->
+	<Copyright>Copyright © 2026 Digital Data GmbH. All rights reserved.</Copyright>
+	  
+  </PropertyGroup>
+  <ItemGroup>
+    <PackageReference Include="DevExpress.Blazor.PdfViewer" Version="25.2.3" />
+    <PackageReference Include="DevExpress.Blazor.Reporting.JSBasedControls" Version="25.2.3" />
+    <PackageReference Include="DevExpress.Blazor.Reporting.Viewer" Version="25.2.3" />
+    <PackageReference Include="DevExpress.Drawing.Skia" Version="25.2.3" />
+    <PackageReference Include="HarfBuzzSharp.NativeAssets.WebAssembly" Version="8.3.1.2" />
+    <PackageReference Include="SkiaSharp.NativeAssets.WebAssembly" Version="3.119.1" />
+    <PackageReference Include="SkiaSharp.Views.Blazor" Version="3.119.1" />
+    <NativeFileReference Include="$(HarfBuzzSharpStaticLibraryPath)\2.0.23\*.a" />
+  </ItemGroup>
+  <ItemGroup>
+    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="8.0.11" />
+    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="8.0.11" PrivateAssets="all" />
+  </ItemGroup>
+  <ItemGroup>
+    <Folder Include="Properties\PublishProfiles\" />
+  </ItemGroup>
+  <ItemGroup>
+    <Content Update="wwwroot\docs\privacy-policy.en-US.html">
+      <CopyToOutputDirectory>Always</CopyToOutputDirectory>
+    </Content>
+    <Content Update="wwwroot\docs\privacy-policy.fr-FR.html">
+      <CopyToOutputDirectory>Always</CopyToOutputDirectory>
+    </Content>
+  </ItemGroup>
+</Project>

EnvelopeGenerator.ReceiverUI/Models/AnnotationDto.cs

@@ -0,0 +1,32 @@
+namespace EnvelopeGenerator.ReceiverUI.Models;
+
+/// <summary>
+/// Represents a pre-assigned signature annotation position on a specific page.
+/// <br/><br/>
+/// <b>Coordinate unit (X, Y):</b> Inches (GdPicture14 native unit),
+/// origin at the <b>top-left</b> corner of the page, both axes increase downward/rightward.
+/// <br/><br/>
+/// <b>Conversion to DevExpress:</b> Multiply by 100 (DX uses 1/100 inch).
+/// Convert: <c>xDX = xInches * 100.0</c>
+/// <br/>
+/// <b>Conversion to PDF Points:</b> Multiply by 72 (1 inch = 72 points).
+/// Convert: <c>xPt = xInches * 72.0</c>
+/// <br/>
+/// <b>Y-axis for PDF (bottom-left origin):</b> Flip required for iText7.
+/// Convert: <c>yPt = (pageHeightInches - yInches - elemHeightInches) * 72.0</c>
+/// </summary>
+[Obsolete("Use SignatureDto with SignatureService.")]
+public record AnnotationDto
+{
+    /// <summary>Unique identifier of the annotation.</summary>
+    public long Id { get; init; }
+
+    /// <summary>1-based page number within the document.</summary>
+    public int Page { get; init; }
+
+    /// <summary>Horizontal position in INCHES from the left edge of the page.</summary>
+    public double X { get; init; }
+
+    /// <summary>Vertical position in INCHES from the top edge of the page.</summary>
+    public double Y { get; init; }
+}

EnvelopeGenerator.ReceiverUI/Models/Constants/SenderAppType.cs

@@ -0,0 +1,8 @@
+namespace EnvelopeGenerator.ReceiverUI.Models.Constants
+{
+    public enum SenderAppType
+    {
+        LegacyFormApp = 0,
+        ReceiverUIBlazorApp = 1
+    }
+}

EnvelopeGenerator.ReceiverUI/Models/Constants/UnitOfLength.cs

@@ -0,0 +1,65 @@
+namespace EnvelopeGenerator.ReceiverUI.Models.Constants;
+
+/// <summary>
+/// Represents the unit of measurement for coordinate values in signature positioning.
+/// Used for converting coordinates between different systems (GdPicture14, PDF.js, iText7).
+/// </summary>
+public enum UnitOfLength
+{
+    /// <summary>
+    /// Inch unit (1 inch = 25.4 mm).
+    /// This is the native unit used by GdPicture14 (EnvelopeGenerator.Form - Legacy VB.NET app).
+    /// Database stores all coordinates (X, Y, Width, Height) in INCHES.
+    /// </summary>
+    /// <remarks>
+    /// <b>Source:</b> GdPicture14.Annotations.AnnotationStickyNote uses INCHES natively.
+    /// <br/>
+    /// <b>Evidence:</b> VB.NET code directly assigns database values to annotation properties without conversion:
+    /// <code>
+    /// oAnnotation.Left = CSng(pElement.X)   ' Direct assignment → INCHES
+    /// oAnnotation.Top = CSng(pElement.Y)
+    /// </code>
+    /// <b>Standard Page Dimensions:</b>
+    /// <list type="bullet">
+    ///   <item>A4: 8.27" × 11.69" (210mm × 297mm)</item>
+    ///   <item>Letter: 8.5" × 11"</item>
+    /// </list>
+    /// </remarks>
+    Inch = 0,
+
+    /// <summary>
+    /// PDF Point unit (1 point = 1/72 inch).
+    /// This is the standard unit used by PDF specification and PDF.js viewer.
+    /// </summary>
+    /// <remarks>
+    /// <b>Definition:</b> According to PDF specification and Microsoft documentation:
+    /// <br/>
+    /// <i>"PDF pages are sized in point units. 1 pt == 1/72 inch"</i>
+    /// <br/><br/>
+    /// <b>Conversion Formula:</b>
+    /// <code>
+    /// points = inches * 72.0
+    /// inches = points / 72.0
+    /// </code>
+    /// <b>Important:</b> Point ≠ Pixel!
+    /// <list type="bullet">
+    ///   <item><b>Point (pt):</b> Device-independent unit (always 1/72 inch)</item>
+    ///   <item><b>Pixel (px):</b> Device-dependent unit (varies with screen DPI)</item>
+    ///   <item>At 72 DPI: 1 point = 1 pixel (coincidence)</item>
+    ///   <item>At 96 DPI: 1 point ≈ 1.33 pixels</item>
+    ///   <item>At 300 DPI: 1 point ≈ 4.17 pixels</item>
+    /// </list>
+    /// <b>Standard Page Dimensions (in points):</b>
+    /// <list type="bullet">
+    ///   <item>A4: 595 × 842 points (8.27" × 11.69" × 72)</item>
+    ///   <item>Letter: 612 × 792 points (8.5" × 11" × 72)</item>
+    /// </list>
+    /// <b>Usage in EnvelopeGenerator:</b>
+    /// <list type="bullet">
+    ///   <item>PDF.js viewer expects coordinates in points</item>
+    ///   <item>iText7 library uses points for PDF manipulation</item>
+    ///   <item>PSPDFKit (Web) uses points for annotation placement</item>
+    /// </list>
+    /// </remarks>
+    Point
+}

EnvelopeGenerator.ReceiverUI/Models/EnvelopeReceiverDto.cs

@@ -0,0 +1,106 @@
+namespace EnvelopeGenerator.ReceiverUI.Models;
+
+/// <summary>
+/// Client-side model for the envelope receiver returned by
+/// <c>GET api/EnvelopeReceiver/{envelopeKey}</c>.
+/// </summary>
+public record EnvelopeReceiverDto
+{
+    public int EnvelopeId { get; init; }
+    public int ReceiverId { get; init; }
+    public int Sequence { get; init; }
+
+    public string? Name { get; init; }
+    public string? JobTitle { get; init; }
+    public string? CompanyName { get; init; }
+    public string? PrivateMessage { get; init; }
+
+    public DateTime AddedWhen { get; init; }
+    public DateTime? ChangedWhen { get; init; }
+    public bool HasPhoneNumber { get; init; }
+
+    public EnvelopeClientDto? Envelope { get; init; }
+    public ReceiverClientDto? Receiver { get; init; }
+}
+
+/// <summary>
+/// Client-side model for the envelope data embedded in <see cref="EnvelopeReceiverDto"/>.
+/// </summary>
+public record EnvelopeClientDto
+{
+    public int Id { get; init; }
+    public int UserId { get; init; }
+    public int Status { get; init; }
+    public string StatusName { get; init; } = string.Empty;
+    public string Uuid { get; init; } = string.Empty;
+    public string Title { get; init; } = string.Empty;
+    public string Message { get; init; } = string.Empty;
+    public DateTime AddedWhen { get; init; }
+    public DateTime? ChangedWhen { get; init; }
+    public string Language { get; init; } = "de-DE";
+    public int? EnvelopeTypeId { get; init; }
+    public string? EnvelopeTypeTitle { get; init; }
+    public int? ContractType { get; init; }
+    public int? CertificationType { get; init; }
+    public bool UseAccessCode { get; init; }
+    public bool TFAEnabled { get; init; }
+    public IEnumerable<DocumentClientDto>? Documents { get; init; }
+    public EnvelopeSenderDto? User { get; init; }
+}
+
+/// <summary>
+/// Sender (user) information embedded in <see cref="EnvelopeClientDto"/>.
+/// </summary>
+public record EnvelopeSenderDto
+{
+    public int Id { get; init; }
+    public string? Username { get; init; }
+    public string? FullName { get; init; }
+    public string? Email { get; init; }
+}
+
+/// <summary>
+/// Client-side model for a document embedded in <see cref="EnvelopeClientDto"/>.
+/// </summary>
+public record DocumentClientDto
+{
+    public int Id { get; init; }
+    public int EnvelopeId { get; init; }
+    public DateTime AddedWhen { get; init; }
+    public IEnumerable<SignatureClientDto>? Elements { get; init; }
+}
+
+/// <summary>
+/// Client-side model for a signature/annotation element embedded in <see cref="DocumentClientDto"/>.
+/// </summary>
+public record SignatureClientDto
+{
+    public int Id { get; init; }
+    public int DocumentId { get; init; }
+    public int ReceiverId { get; init; }
+    public int ElementType { get; init; }
+    public double X { get; init; }
+    public double Y { get; init; }
+    public double Width { get; init; }
+    public double Height { get; init; }
+    public int Page { get; init; }
+    public bool Required { get; init; }
+    public string? Tooltip { get; init; }
+    public bool ReadOnly { get; init; }
+    public int AnnotationIndex { get; init; }
+    public DateTime AddedWhen { get; init; }
+    public DateTime? ChangedWhen { get; init; }
+}
+
+/// <summary>
+/// Client-side model for the receiver data embedded in <see cref="EnvelopeReceiverDto"/>.
+/// </summary>
+public record ReceiverClientDto
+{
+    public int Id { get; init; }
+    public string? EmailAddress { get; init; }
+    public string? Signature { get; init; }
+    public DateTime AddedWhen { get; init; }
+    public DateTime? TfaRegDeadline { get; init; }
+}
+

EnvelopeGenerator.ReceiverUI/Models/SignatureCaptureDto.cs

@@ -0,0 +1,62 @@
+namespace EnvelopeGenerator.ReceiverUI.Models;
+
+/// <summary>
+/// Represents a captured signature with metadata created by the receiver in the signature popup.
+/// This model holds the signature image (as base64 data URL) along with signer information
+/// used for rendering applied signatures on the PDF canvas.
+/// </summary>
+/// <remarks>
+/// <b>Used in:</b> EnvelopeViewer.razor signature popup workflow
+/// <br/>
+/// <b>Creation:</b> User draws/types/uploads signature and fills required fields
+/// <br/>
+/// <b>Storage:</b> Session-only (Blazor component state, lost on page refresh)
+/// <br/>
+/// <b>Rendering:</b> Applied signatures display: Image + Separator + Name/Position/Place/Date
+/// </remarks>
+public sealed record SignatureCaptureDto
+{
+    /// <summary>
+    /// Base64-encoded data URL of the signature image.
+    /// <br/>
+    /// <b>Format:</b> <c>data:image/png;base64,iVBORw0KG...</c>
+    /// <br/>
+    /// <b>Source:</b> Canvas.toDataURL() from signature pad (draw/text/image tabs)
+    /// <br/>
+    /// <b>Usage:</b> Set as <c>img.src</c> in applied signature overlay
+    /// </summary>
+    public required string DataUrl { get; init; }
+
+    /// <summary>
+    /// Full name of the signer (first and last name).
+    /// <br/>
+    /// <b>Required:</b> Yes (validated in popup)
+    /// <br/>
+    /// <b>Display:</b> Bold text in applied signature block
+    /// <br/>
+    /// <b>Example:</b> "Max Mustermann"
+    /// </summary>
+    public required string FullName { get; init; }
+
+    /// <summary>
+    /// Job title or position of the signer.
+    /// <br/>
+    /// <b>Required:</b> No (optional field)
+    /// <br/>
+    /// <b>Display:</b> Normal weight text between name and place/date
+    /// <br/>
+    /// <b>Example:</b> "Geschäftsführer" or empty string
+    /// </summary>
+    public string Position { get; init; } = string.Empty;
+
+    /// <summary>
+    /// Location/place where the signature was created.
+    /// <br/>
+    /// <b>Required:</b> Yes (validated in popup)
+    /// <br/>
+    /// <b>Display:</b> Shown with current date in German format (dd.MM.yyyy)
+    /// <br/>
+    /// <b>Example:</b> "Berlin" ? rendered as "Berlin, 26.01.2025"
+    /// </summary>
+    public required string Place { get; init; }
+}

EnvelopeGenerator.ReceiverUI/Models/SignatureDto.cs

@@ -0,0 +1,101 @@
+using EnvelopeGenerator.ReceiverUI.Models.Constants;
+
+namespace EnvelopeGenerator.ReceiverUI.Models;
+
+/// <summary>
+/// Represents a signature position on a PDF page.
+/// Coordinates stored in INCHES (GdPicture14 native unit).
+/// Origin: Top-left corner, X increases right, Y increases down.
+/// </summary>
+public class SignatureDto
+{
+    /// <summary>Unique identifier.</summary>
+    public int Id { get; init; }
+
+    private double _x;
+    private double _y;
+
+    /// <summary>Horizontal position in INCHES from left edge.</summary>
+    public double X 
+    { 
+        get => _x * Factor;
+        init => _x = value; 
+    }
+
+    /// <summary>Vertical position in INCHES from top edge.</summary>
+    public double Y 
+    { 
+        get => _y * Factor;
+        init => _y = value; 
+    }
+
+    /// <summary>1-based page number.</summary>
+    public int Page { get; init; }
+
+    /// <summary>Sender application type that created this signature.</summary>
+    public SenderAppType SenderAppType { get; init; }
+
+    private UnitOfLength _unitOfLength;
+
+    public SignatureDto Convert(UnitOfLength unitOfLength)
+    {
+        _unitOfLength = unitOfLength;
+        return this;
+    }
+
+    public double Factor
+    {
+        get
+        {
+            if (SenderAppType != SenderAppType.LegacyFormApp)
+            {
+                throw new NotImplementedException(
+                    $"SenderAppType '{SenderAppType}' is not yet implemented. " +
+                    $"Currently, only '{nameof(SenderAppType.LegacyFormApp)}' is supported. " +
+                    $"Future implementations will handle '{nameof(SenderAppType.ReceiverUIBlazorApp)}' and other types.");
+            }
+
+            // LegacyFormApp uses GdPicture14 with INCHES
+            return _unitOfLength switch
+            {
+                UnitOfLength.Inch => 1.0,   // No conversion needed: INCHES → INCHES
+                UnitOfLength.Point => 72.0, // INCHES → PDF Points: 1 inch = 72 points (PDF standard, NOT pixels!)
+                _ => throw new InvalidOperationException(
+                    $"Unknown UnitOfLength: {_unitOfLength}. Expected '{nameof(UnitOfLength.Inch)}' or '{nameof(UnitOfLength.Point)}'.")
+            };
+        }
+    }
+}
+
+public static class SignatureDtoExtensions
+{
+    /// <summary>
+    /// Converts all signatures in the collection to the specified unit of length.
+    /// </summary>
+    /// <typeparam name="T">Type of the collection (IEnumerable, List, etc.)</typeparam>
+    /// <param name="signatures">Collection of SignatureDto objects to convert.</param>
+    /// <param name="unitOfLength">Target unit of measurement (Inch or Point).</param>
+    /// <returns>The same collection with all signatures converted to the specified unit.</returns>
+    /// <exception cref="ArgumentNullException">Thrown when signatures collection is null.</exception>
+    /// <remarks>
+    /// <b>Usage:</b>
+    /// <code>
+    /// var signatures = await SignatureService.GetAsync(envelopeKey);
+    /// var convertedSignatures = signatures.ConvertAll(UnitOfLength.Point);
+    /// </code>
+    /// <b>Note:</b> This method modifies each SignatureDto object in place and returns the same collection.
+    /// </remarks>
+    public static T Convert<T>(this T signatures, UnitOfLength unitOfLength) 
+        where T : IEnumerable<SignatureDto>
+    {
+        if (signatures == null)
+            throw new ArgumentNullException(nameof(signatures));
+
+        foreach (var signature in signatures)
+        {
+            signature.Convert(unitOfLength);
+        }
+
+        return signatures;
+    }
+}

EnvelopeGenerator.ReceiverUI/NOTICE.txt

@@ -0,0 +1,12 @@
+The following open source libraries are used and included within thеse sample/demonstration projects:
+
+Bootstrap (Open Source – MIT License)
+Copyright (c) 2011-2021 Twitter, Inc. / Copyright (c) 2011-2021 The Bootstrap Authors
+https://github.com/twbs/bootstrap/blob/main/LICENSE
+
+open-iconic (Open Source – MIT License and SIL Open Font License)
+Copyright (c) 2014 Waybury
+https://github.com/iconic/open-iconic/blob/master/ICON-LICENSE
+https://github.com/iconic/open-iconic/blob/master/FONT-LICENSE
+
+The open source libraries included in these sample/demonstration projects are done so pursuant to each individual open source library license and subject to the disclaimers and limitations on liability set forth in each open source library license.

EnvelopeGenerator.ReceiverUI/Options/ApiOptions.cs

@@ -0,0 +1,10 @@
+namespace EnvelopeGenerator.ReceiverUI.Options;
+
+public class ApiOptions
+{
+    public const string SectionName = "Api";
+
+    public string BaseUrl { get; set; } = string.Empty;
+
+    public bool ForceToUseFakeDocument { get; set; } = false;
+}

EnvelopeGenerator.ReceiverUI/Options/PdfViewerOptions.cs

@@ -0,0 +1,71 @@
+namespace EnvelopeGenerator.ReceiverUI.Options;
+
+public class PdfViewerOptions
+{
+    public const string SectionName = "PdfViewer";
+
+    /// <summary>
+    /// Base scale for thumbnail rendering (0.2 - 1.5 recommended)
+    /// Higher values = better quality but slower rendering
+    /// Default: 0.75
+    /// </summary>
+    public double ThumbnailBaseScale { get; set; } = 0.75;
+
+    /// <summary>
+    /// Enable HiDPI/Retina support for thumbnails
+    /// Default: true
+    /// </summary>
+    public bool ThumbnailEnableHiDPI { get; set; } = true;
+
+    /// <summary>
+    /// Maximum device pixel ratio multiplier for thumbnails (1.0 - 3.0)
+    /// Caps DPR to avoid excessive memory usage on 4K+ displays
+    /// Default: 2.0
+    /// </summary>
+    public double ThumbnailMaxDPR { get; set; } = 2.0;
+
+    /// <summary>
+    /// Enable HiDPI/Retina support for main PDF canvas
+    /// Default: true
+    /// </summary>
+    public bool MainCanvasEnableHiDPI { get; set; } = true;
+
+    /// <summary>
+    /// Maximum device pixel ratio multiplier for main canvas (1.0 - 3.0)
+    /// Default: 2.0
+    /// </summary>
+    public double MainCanvasMaxDPR { get; set; } = 2.0;
+
+    /// <summary>
+    /// Enable smooth zoom transition (fade effect)
+    /// Default: true
+    /// </summary>
+    public bool EnableSmoothZoom { get; set; } = true;
+
+    /// <summary>
+    /// Zoom transition duration in milliseconds (50 - 500)
+    /// Default: 150
+    /// </summary>
+    public int ZoomTransitionDuration { get; set; } = 150;
+
+    /// <summary>
+    /// Opacity during rendering (0.0 - 1.0)
+    /// Lower values = more visible fade effect
+    /// Default: 0.85
+    /// </summary>
+    public double RenderingOpacity { get; set; } = 0.85;
+
+    /// <summary>
+    /// Delay between thumbnail renders in milliseconds (10 - 200)
+    /// Higher values = less browser stress, slower initial load
+    /// Default: 50
+    /// </summary>
+    public int ThumbnailRenderDelay { get; set; } = 50;
+
+    /// <summary>
+    /// Zoom step percentage (1 - 50)
+    /// Controls how much zoom changes per click or scroll
+    /// Default: 5 (5% per step)
+    /// </summary>
+    public int ZoomStepPercentage { get; set; } = 5;
+}

EnvelopeGenerator.ReceiverUI/Pages/DocumentViewer.razor

@@ -0,0 +1,5 @@
+@page "/documentviewer"
+
+<DxDocumentViewer ReportName="LargeDatasetReport" CssClass="dx-blazor-reporting-container" Height="@null" Width="@null">
+    <DxDocumentViewerTabPanelSettings Width="340" />
+</DxDocumentViewer>

EnvelopeGenerator.ReceiverUI/Pages/EnvelopeViewer.razor

@@ -0,0 +1,968 @@
+@page "/envelope/{EnvelopeKey}"
+@using EnvelopeGenerator.ReceiverUI.Models
+@using EnvelopeGenerator.ReceiverUI.Models.Constants
+@using EnvelopeGenerator.ReceiverUI.Services
+@using Microsoft.Extensions.Options
+@using EnvelopeGenerator.ReceiverUI.Options
+@using Microsoft.JSInterop
+@using DevExpress.Blazor
+@inject DocumentService DocumentService
+@inject NavigationManager Navigation
+@inject IOptions<ApiOptions> AppOptions
+@inject IOptions<PdfViewerOptions> PdfViewerOptions
+@inject IJSRuntime JSRuntime
+@inject SignatureService SignatureService
+@inject EnvelopeGenerator.ReceiverUI.Services.AuthService AuthService
+@inject EnvelopeGenerator.ReceiverUI.Services.EnvelopeReceiverService EnvelopeReceiverService
+@inject AppVersionService AppVersion
+@implements IAsyncDisposable
+
+<link href="_content/DevExpress.Blazor.Themes/blazing-berry.bs5.min.css" rel="stylesheet" />
+<link href="@AppVersion.GetVersionedUrl("css/envelope-viewer.css")" rel="stylesheet" />
+<link href="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/3.11.174/pdf_viewer.min.css" rel="stylesheet" />
+<script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/3.11.174/pdf.min.js"></script>
+<script src="@AppVersion.GetVersionedUrl("js/pdf-viewer.js")"></script>
+<script src="@AppVersion.GetVersionedUrl("js/receiver-signature.js")"></script>
+
+<div class="envelope-viewer-layout">
+<div class="envelope-action-bar">
+    <div class="envelope-action-bar__inner" style="flex-direction: column; align-items: stretch; padding: 0.35rem 1.5rem; gap: 0.35rem;">
+        @* Row 1: Title + Sender + Badges + Logout *@
+        <div style="display: flex; align-items: center; justify-content: space-between; gap: 1rem;">
+            @* Left: Title + Sender *@
+            <div style="flex: 0 1 auto; min-width: 0; display: flex; align-items: center; gap: 0.75rem;">
+                @if (_envelopeReceiver is not null) {
+                    <div style="font-size: 0.9rem; font-weight: 600; color: #1f2937; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;">
+                        @(_envelopeReceiver.Envelope?.Title ?? "Dokument")
+                    </div>
+                    @if (!string.IsNullOrWhiteSpace(_envelopeReceiver.Envelope?.User?.FullName) || !string.IsNullOrWhiteSpace(_envelopeReceiver.Envelope?.User?.Email)) {
+                        <span style="font-size: 0.7rem; color: #6b7280; white-space: nowrap;">
+                            Von 
+                            @if (!string.IsNullOrWhiteSpace(_envelopeReceiver.Envelope?.User?.FullName)) {
+                                <span style="font-weight: 500; color: #374151;">@_envelopeReceiver.Envelope.User.FullName</span>
+                            }
+                            @if (!string.IsNullOrWhiteSpace(_envelopeReceiver.Envelope?.User?.Email)) {
+                                <span>&lt;@_envelopeReceiver.Envelope.User.Email&gt;</span>
+                            }
+                            @if (_envelopeReceiver.Envelope?.AddedWhen != null) {
+                                <span>&nbsp;·&nbsp;@_envelopeReceiver.Envelope.AddedWhen.ToString("dd.MM.yyyy")</span>
+                            }
+                        </span>
+                    }
+                } else {
+                    <div style="font-size: 0.9rem; font-weight: 600; color: #1f2937;">Dokumentenansicht</div>
+                }
+            </div>
+
+            @* Right: Badges + Logout *@
+            <div class="d-flex align-items-center" style="gap: 0.75rem; flex: 0 0 auto;">
+            @if (_envelopeReceiver is not null) {
+                <div class="d-flex flex-wrap align-items-center" style="gap: 0.3rem; font-size: 0.7rem;">
+                    @if (!string.IsNullOrWhiteSpace(_envelopeReceiver.Name)) {
+                        <span style="display: inline-flex; align-items: center; padding: 0.125rem 0.4rem; background: #f3f4f6; border-radius: 0.25rem; color: #374151; white-space: nowrap;">
+                            <svg xmlns="http://www.w3.org/2000/svg" width="9" height="9" fill="currentColor" class="me-1" viewBox="0 0 16 16">
+                                <path d="M8 8a3 3 0 1 0 0-6 3 3 0 0 0 0 6Zm2-3a2 2 0 1 1-4 0 2 2 0 0 1 4 0Zm4 8c0 1-1 1-1 1H3s-1 0-1-1 1-4 6-4 6 3 6 4Z"/>
+                            </svg>
+                            @_envelopeReceiver.Name
+                        </span>
+                    }
+                    @if (!string.IsNullOrWhiteSpace(_envelopeReceiver.Envelope?.User?.FullName)) {
+                        <span style="display: inline-flex; align-items-center; padding: 0.15rem 0.5rem; background: #f3f4f6; border-radius: 0.25rem; color: #6b7280; white-space: nowrap;">
+                            Von @_envelopeReceiver.Envelope.User.FullName
+                        </span>
+                    }
+                    @{
+                        int sigCount = _signatures.Count;
+                    }
+                    @if (sigCount > 0) {
+                        <span style="display: inline-flex; align-items: center; padding: 0.125rem 0.4rem; background: #ede9fe; border-radius: 0.25rem; color: #6d28d9; font-weight: 500; white-space: nowrap;">
+                            <svg xmlns="http://www.w3.org/2000/svg" width="9" height="9" fill="currentColor" class="me-1" viewBox="0 0 16 16">
+                                <path d="M12.146.146a.5.5 0 0 1 .708 0l3 3a.5.5 0 0 1 0 .708l-10 10a.5.5 0 0 1-.168.11l-5 2a.5.5 0 0 1-.65-.65l2-5a.5.5 0 0 1 .11-.168l10-10zM11.207 2.5 13.5 4.793 14.793 3.5 12.5 1.207 11.207 2.5zm1.586 3L10.5 3.207 4 9.707V10h.5a.5.5 0 0 1 .5.5v.5h.5a.5.5 0 0 1 .5.5v.5h.293l6.5-6.5zm-9.761 5.175-.106.106-1.528 3.821 3.821-1.528.106-.106A.5.5 0 0 1 5 12.5V12h-.5a.5.5 0 0 1-.5-.5V11h-.5a.5.5 0 0 1-.468-.325z"/>
+                            </svg>
+                            @sigCount
+                        </span>
+                    }
+                    @if (_envelopeReceiver.Envelope?.UseAccessCode == true) {
+                        <span style="display: inline-flex; align-items: center; padding: 0.125rem 0.4rem; background: #fef3c7; border-radius: 0.25rem; color: #92400e; font-weight: 500; white-space: nowrap;">
+                            <svg xmlns="http://www.w3.org/2000/svg" width="9" height="9" fill="currentColor" class="me-1" viewBox="0 0 16 16">
+                                <path d="M8 1a2 2 0 0 1 2 2v4H6V3a2 2 0 0 1 2-2zm3 6V3a3 3 0 0 0-6 0v4a2 2 0 0 0-2 2v5a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2z"/>
+                            </svg>
+                            Code
+                        </span>
+                    }
+                    @if (_envelopeReceiver.Envelope?.TFAEnabled == true) {
+                        <span style="display: inline-flex; align-items: center; padding: 0.125rem 0.4rem; background: #dbeafe; border-radius: 0.25rem; color: #1e40af; font-weight: 500; white-space: nowrap;">
+                            <svg xmlns="http://www.w3.org/2000/svg" width="9" height="9" fill="currentColor" class="me-1" viewBox="0 0 16 16">
+                                <path d="M5.338 1.59a61.44 61.44 0 0 0-2.837.856.481.481 0 0 0-.328.39c-.554 4.157.726 7.19 2.253 9.188a10.725 10.725 0 0 0 2.287 2.233c.346.244.652.42.893.533.12.057.218.095.293.118a.55.55 0 0 0 .101.025.615.615 0 0 0 .1-.025c.076-.023.174-.061.294-.118.24-.113.547-.29.893-.533a10.726 10.726 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.775 11.775 0 0 1-2.517 2.453 7.159 7.159 0 0 1-1.048.625c-.28.132-.581.24-.829.24s-.548-.108-.829-.24a7.158 7.158 0 0 1-1.048-.625 11.777 11.777 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 62.456 62.456 0 0 1 5.072.56z"/>
+                                <path d="M10.854 5.146a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708 0l-1.5-1.5a.5.5 0 1 1 .708-.708L7.5 7.793l2.646-2.647a.5.5 0 0 1 .708 0z"/>
+                            </svg>
+                            2FA
+                        </span>
+                    }
+                </div>
+
+            }
+
+                @* Logout button *@
+                @if (!string.IsNullOrWhiteSpace(EnvelopeKey)) {
+                    <button class="pdf-toolbar__btn" @onclick="LogoutAsync" disabled="@_isLoggingOut" title="Abmelden" style="flex-shrink: 0;">
+                        @if (_isLoggingOut) {
+                            <span class="spinner-border spinner-border-sm" role="status" aria-hidden="true" style="width: 14px; height: 14px;"></span>
+                        } else {
+                            <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" fill="currentColor" viewBox="0 0 16 16">
+                                <path fill-rule="evenodd" d="M10 12.5a.5.5 0 0 1-.5.5h-8a.5.5 0 0 1-.5-.5v-9a.5.5 0 0 1 .5-.5h8a.5.5 0 0 1 .5.5v2a.5.5 0 0 0 1 0v-2A1.5 1.5 0 0 0 9.5 2h-8A1.5 1.5 0 0 0 0 3.5v9A1.5 1.5 0 0 0 1.5 14h8a1.5 1.5 0 0 0 1.5-1.5v-2a.5.5 0 0 0-1 0v2z"/>
+                                <path fill-rule="evenodd" d="M15.854 8.354a.5.5 0 0 0 0-.708l-3-3a.5.5 0 0 0-.708.708L14.293 7.5H5.5a.5.5 0 0 0 0 1h8.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3z"/>
+                            </svg>
+                        }
+                    </button>
+                }
+            </div>
+        </div>
+
+        @* Row 2: Messages (visible text) *@
+        @if (_envelopeReceiver is not null && (!string.IsNullOrWhiteSpace(_envelopeReceiver.Envelope?.Message) || !string.IsNullOrWhiteSpace(_envelopeReceiver.PrivateMessage))) {
+            <div style="display: flex; align-items: flex-start; gap: 0.5rem; font-size: 0.7rem; padding-top: 0.15rem; border-top: 1px solid #e5e7eb;">
+                @if (!string.IsNullOrWhiteSpace(_envelopeReceiver.Envelope?.Message)) {
+                    <div style="flex: 1; min-width: 0; padding: 0.2rem 0.4rem; background: #f9fafb; border-radius: 0.25rem; border-left: 2px solid #9ca3af; display: flex; align-items: flex-start; gap: 0.25rem;">
+                        <span style="font-weight: 500; color: #374151; flex-shrink: 0;">📧</span>
+                        <span style="color: #6b7280; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">@_envelopeReceiver.Envelope.Message</span>
+                    </div>
+                }
+                @if (!string.IsNullOrWhiteSpace(_envelopeReceiver.PrivateMessage)) {
+                    <div style="flex: 1; min-width: 0; padding: 0.2rem 0.4rem; background: #fef3c7; border-radius: 0.25rem; border-left: 2px solid #f59e0b; display: flex; align-items: flex-start; gap: 0.25rem;">
+                        <span style="font-weight: 500; color: #92400e; flex-shrink: 0;">🔒</span>
+                        <span style="color: #92400e; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">@_envelopeReceiver.PrivateMessage</span>
+                    </div>
+                }
+            </div>
+        }
+    </div>
+</div>
+
+<div class="envelope-content">
+        @if (_isLoading) {
+            <div class="d-flex justify-content-center align-items-center h-100">
+                <div class="text-center">
+                    <div class="spinner-border text-white mb-3" style="width: 3.5rem; height: 3.5rem;" role="status">
+                        <span class="visually-hidden">L<>dt...</span>
+                    </div>
+                    <p class="text-white fw-semibold">Dokument wird geladen...</p>
+                </div>
+            </div>
+        } else if (_errorMessage is not null) {
+            <div class="error-container">
+                <div class="alert alert-danger shadow-lg">
+                    <div class="d-flex align-items-start">
+                        <svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor" class="me-3 flex-shrink-0" viewBox="0 0 16 16">
+                            <path d="M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z"/>
+                            <path d="M7.002 11a1 1 0 1 1 2 0 1 1 0 0 1-2 0zM7.1 4.995a.905.905 0 1 1 1.8 0l-.35 3.507a.552.552 0 0 1-1.1 0L7.1 4.995z"/>
+                        </svg>
+                        <div>
+                            <h5 class="mb-2">Fehler beim Laden des Dokuments</h5>
+                            <p class="mb-0">@_errorMessage</p>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        } else if (!string.IsNullOrWhiteSpace(_pdfDataUrl)) {
+            <div class="pdf-viewer-container">
+                @if (_pdfLoaded) {
+                    <div class="pdf-toolbar">
+                        <div class="pdf-toolbar__section">
+                            <button class="pdf-toolbar__btn pdf-toolbar__btn--toggle" @onclick="ToggleThumbnails" title="@(_showThumbnails ? "Seitenleiste ausblenden" : "Seitenleiste einblenden")">
+                                <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" fill="currentColor" viewBox="0 0 16 16">
+                                    <path d="M1 2.5A1.5 1.5 0 0 1 2.5 1h3A1.5 1.5 0 0 1 7 2.5v3A1.5 1.5 0 0 1 5.5 7h-3A1.5 1.5 0 0 1 1 5.5v-3zm8 0A1.5 1.5 0 0 1 10.5 1h3A1.5 1.5 0 0 1 15 2.5v3A1.5 1.5 0 0 1 13.5 7h-3A1.5 1.5 0 0 1 9 5.5v-3zm-8 8A1.5 1.5 0 0 1 2.5 9h3A1.5 1.5 0 0 1 7 10.5v3A1.5 1.5 0 0 1 5.5 15h-3A1.5 1.5 0 0 1 1 13.5v-3zm8 0A1.5 1.5 0 0 1 10.5 9h3a1.5 1.5 0 0 1 1.5 1.5v3a1.5 1.5 0 0 1-1.5 1.5h-3A1.5 1.5 0 0 1 9 13.5v-3z"/>
+                                </svg>
+                            </button>
+                        </div>
+
+                        <div class="pdf-toolbar__divider"></div>
+
+                        <div class="pdf-toolbar__section">
+                            <button class="pdf-toolbar__btn" @onclick="PreviousPage" disabled="@(_currentPage <= 1)" title="Vorherige Seite">
+                                <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" fill="currentColor" viewBox="0 0 16 16">
+                                    <path fill-rule="evenodd" d="M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z"/>
+                                </svg>
+                            </button>
+                            <div class="pdf-toolbar__page-input-group">
+                                <input type="number" class="pdf-toolbar__page-input" min="1" max="@_totalPages" value="@_currentPage" @onchange="OnPageInputChanged" />
+                                <span class="pdf-toolbar__page-total">/ @_totalPages</span>
+                            </div>
+                            <button class="pdf-toolbar__btn" @onclick="NextPage" disabled="@(_currentPage >= _totalPages)" title="Nächste Seite">
+                                <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" fill="currentColor" viewBox="0 0 16 16">
+                                    <path fill-rule="evenodd" d="M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z"/>
+                                </svg>
+                            </button>
+                        </div>
+
+                        <div class="pdf-toolbar__divider"></div>
+
+                        <div class="pdf-toolbar__section pdf-toolbar__zoom-section">
+                            <button class="pdf-toolbar__btn" @onclick="ZoomOut" disabled="@(_currentZoom <= 50)" title="Verkleinern">
+                                <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" fill="currentColor" viewBox="0 0 16 16">
+                                    <path d="M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0zM4 6a.5.5 0 0 0 0 1h5a.5.5 0 0 0 0-1H4z"/>
+                                </svg>
+                            </button>
+                            <div class="pdf-toolbar__zoom-slider-container">
+                                <input type="range" class="pdf-toolbar__zoom-slider" min="50" max="300" step="@(PdfViewerOptions.Value.ZoomStepPercentage)" value="@_currentZoom" @oninput="OnZoomSliderChanged" title="@(_currentZoom)%" />
+                                <div class="pdf-toolbar__zoom-label">@(_currentZoom)%</div>
+                            </div>
+                            <button class="pdf-toolbar__btn" @onclick="ZoomIn" disabled="@(_currentZoom >= 300)" title="Vergrößern">
+                                <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" fill="currentColor" viewBox="0 0 16 16">
+                                    <path d="M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0zM6.5 3a.5.5 0 0 0-1 0v2.5H3a.5.5 0 0 0 0 1h2.5V9a.5.5 0 0 0 1 0V6.5H9a.5.5 0 0 0 0-1H6.5V3z"/>
+                                </svg>
+                            </button>
+                        </div>
+
+                        <div class="pdf-toolbar__divider"></div>
+
+                        @if (_totalSignatures > 0) {
+                            <div class="pdf-toolbar__section pdf-toolbar__signature-nav">
+                                <button class="pdf-toolbar__btn pdf-toolbar__btn--signature-nav" 
+                                        @onclick="GoToPreviousSignature" 
+                                        disabled="@(_totalSignatures == 0)"
+                                        title="Vorherige Unterschrift">
+                                    <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" fill="currentColor" viewBox="0 0 16 16">
+                                        <path fill-rule="evenodd" d="M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z"/>
+                                    </svg>
+                                </button>
+                                
+                                <div class="pdf-toolbar__signature-counter">
+                                    <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" fill="currentColor" class="me-1" viewBox="0 0 16 16">
+                                        <path d="M12.146.146a.5.5 0 0 1 .708 0l3 3a.5.5 0 0 1 0 .708l-10 10a.5.5 0 0 1-.168.11l-5 2a.5.5 0 0 1-.65-.65l2-5a.5.5 0 0 1 .11-.168l10-10zM11.207 2.5 13.5 4.793 14.793 3.5 12.5 1.207 11.207 2.5zm1.586 3L10.5 3.207 4 9.707V10h.5a.5.5 0 0 1 .5.5v.5h.5a.5.5 0 0 1 .5.5v.5h.293l6.5-6.5zm-9.761 5.175-.106.106-1.528 3.821 3.821-1.528.106-.106A.5.5 0 0 1 5 12.5V12h-.5a.5.5 0 0 1-.5-.5V11h-.5a.5.5 0 0 1-.468-.325z"/>
+                                    </svg>
+                                    <span class="pdf-toolbar__signature-counter-text">
+                                        @if (_currentSignatureIndex > 0) {
+                                            <span style="color: #4F46E5; font-weight: 600;">#@_currentSignatureIndex</span>
+                                            <span style="opacity: 0.4; margin: 0 0.35rem;">|</span>
+                                        }
+                                        <strong style="color: @(_unsignedSignatures > 0 ? "#4F46E5" : "#10b981");">@_signedSignatures</strong>
+                                        <span style="opacity: 0.6;">&nbsp;/&nbsp;</span>
+                                        <span>@_totalSignatures</span>
+                                    </span>
+                                    @if (_unsignedSignatures > 0) {
+                                        <span class="pdf-toolbar__signature-badge">@_unsignedSignatures offen</span>
+                                    } else {
+                                        <span class="pdf-toolbar__signature-badge pdf-toolbar__signature-badge--complete">✓ Komplett</span>
+                                    }
+                                </div>
+                                
+                                <button class="pdf-toolbar__btn pdf-toolbar__btn--signature-nav" 
+                                        @onclick="GoToNextSignature" 
+                                        disabled="@(_totalSignatures == 0)"
+                                        title="Nächste Unterschrift">
+                                    <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" fill="currentColor" viewBox="0 0 16 16">
+                                        <path fill-rule="evenodd" d="M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z"/>
+                                    </svg>
+                                </button>
+                            </div>
+
+                            <div class="pdf-toolbar__divider"></div>
+
+                            @* Reset button - only show when signatures are signed *@
+                            @if (_signedSignatures > 0) {
+                                <div class="pdf-toolbar__section">
+                                    <button class="pdf-toolbar__btn pdf-toolbar__btn--reset" 
+                                            @onclick="RestartSigning" 
+                                            title="Unterschriften zurücksetzen">
+                                        <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" fill="currentColor" viewBox="0 0 16 16">
+                                            <path fill-rule="evenodd" d="M8 3a5 5 0 1 0 4.546 2.914.5.5 0 0 1 .908-.417A6 6 0 1 1 8 2v1z"/>
+                                            <path d="M8 4.466V.534a.25.25 0 0 1 .41-.192l2.36 1.966c.12.1.12.284 0 .384L8.41 4.658A.25.25 0 0 1 8 4.466z"/>
+                                        </svg>
+                                    </button>
+                                </div>
+                            }
+                        }
+                    </div>
+                }
+                <div class="pdf-frame">
+                    @if (_pdfLoaded && _showThumbnails) {
+                        <!-- PDF Thumbnail Sidebar -->
+                        <div class="pdf-thumbnails" style="width: @(_thumbnailWidth)px">
+                            <div class="pdf-thumbnails__content">
+                                @for (int i = 1; i <= _totalPages; i++) {
+                                    var pageNum = i;
+                                    <div class="pdf-thumbnail @(pageNum == _currentPage ? "pdf-thumbnail--active" : "")" @onclick="() => GoToPageFromThumbnail(pageNum)">
+                                        <div class="pdf-thumbnail__preview">
+                                            <canvas id="thumb-canvas-@pageNum" class="pdf-thumbnail__canvas"></canvas>
+                                        </div>
+                                        <div class="pdf-thumbnail__label">@pageNum</div>
+                                    </div>
+                                }
+                            </div>
+                        </div>
+                        <!-- Resizable Splitter -->
+                        <div class="pdf-splitter @(_isResizing ? "resizing" : "")" 
+                             @onmousedown="OnSplitterMouseDown"
+                             @onmousedown:preventDefault="true">
+                        </div>
+                    }
+                    <div class="pdf-canvas-wrapper">
+                        <div class="pdf-page-container">
+                            <canvas id="pdf-canvas" class="pdf-canvas"></canvas>
+                            <div id="pdf-text-layer" class="pdf-text-layer"></div>
+                            <div id="pdf-signature-layer" class="pdf-signature-layer"></div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        } else {
+            <div class="error-container">
+                <div class="alert alert-warning shadow-lg">
+                    <div class="d-flex align-items-center">
+                        <svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor" class="me-3" viewBox="0 0 16 16">
+                            <path d="M8.982 1.566a1.13 1.13 0 0 0-1.96 0L.165 13.233c-.457.778.091 1.767.98 1.767h13.713c.889 0 1.438-.99.98-1.767L8.982 1.566zM8 5c.535 0 .954.462.9.995l-.35 3.507a.552.552 0 0 1-1.1 0L7.1 5.995A.905.905 0 0 1 8 5zm.002 6a1 1 0 1 1 0 2 1 1 0 0 1 0-2z"/>
+                        </svg>
+                        <span class="fs-5">Dokument konnte nicht geladen werden.</span>
+                    </div>
+                </div>
+            </div>
+        }
+    </div>
+</div>
+
+<DxPopup @bind-Visible="_signaturePopupVisible"
+HeaderText="Unterschrift erstellen"
+Width="620px"
+MaxWidth="95vw"
+ShowFooter="true"
+CloseOnOutsideClick="false"
+ShowCloseButton="false"
+CloseOnEscape="false"
+Shown="OnPopupShownAsync">
+    <BodyContentTemplate>
+        <ul class="nav nav-tabs mb-3" style="border-bottom: 2px solid #e9ecef;">
+            <li class="nav-item">
+                <button type="button" 
+                        class="nav-link @(_activeSignatureTab == SignatureTabDraw ? "active" : "")" 
+                        style="@(_activeSignatureTab == SignatureTabDraw ? "border-bottom: 3px solid #4F46E5; color: #4F46E5; font-weight: 600;" : "color: #6c757d;")"
+                        @onclick="() => SetSignatureTabAsync(SignatureTabDraw)">
+                    Zeichnen
+                </button>
+            </li>
+            <li class="nav-item">
+                <button type="button" 
+                        class="nav-link @(_activeSignatureTab == SignatureTabText ? "active" : "")"
+                        style="@(_activeSignatureTab == SignatureTabText ? "border-bottom: 3px solid #4F46E5; color: #4F46E5; font-weight: 600;" : "color: #6c757d;")"
+                        @onclick="() => SetSignatureTabAsync(SignatureTabText)">
+                    Text
+                </button>
+            </li>
+            <li class="nav-item">
+                <button type="button" 
+                        class="nav-link @(_activeSignatureTab == SignatureTabImage ? "active" : "")"
+                        style="@(_activeSignatureTab == SignatureTabImage ? "border-bottom: 3px solid #4F46E5; color: #4F46E5; font-weight: 600;" : "color: #6c757d;")"
+                        @onclick="() => SetSignatureTabAsync(SignatureTabImage)">
+                    Bild
+                </button>
+            </li>
+        </ul>
+
+        @if(_activeSignatureTab == SignatureTabDraw) {
+            <p style="color: #6c757d; font-size: 0.875rem; margin-bottom: 0.75rem;">Bitte unterschreiben Sie im folgenden Feld.</p>
+            <canvas id="envelope-signature-pad" 
+                    width="560" 
+                    height="180" 
+                    style="border: 2px solid #e9ecef; border-radius: 8px; background: white; width: 100%; max-width: 560px; touch-action: none; box-shadow: 0 1px 3px rgba(0,0,0,0.1);"></canvas>
+        } else if(_activeSignatureTab == SignatureTabText) {
+            <p style="color: #6c757d; font-size: 0.875rem; margin-bottom: 0.75rem;">Geben Sie Ihre Unterschrift als Text ein und wählen Sie eine Schriftart.</p>
+            <div class="row g-3 mb-3">
+                <div class="col-12 col-md-7">
+                    <input class="form-control" 
+                           placeholder="Ihre Unterschrift" 
+                           value="@_typedSignatureText" 
+                           @oninput="OnTypedSignatureChanged"
+                           style="border: 2px solid #e9ecef; border-radius: 6px; padding: 0.625rem;" />
+                </div>
+                <div class="col-12 col-md-5">
+                    <select class="form-select" 
+                            value="@_typedSignatureFont" 
+                            @onchange="OnTypedSignatureFontChanged"
+                            style="border: 2px solid #e9ecef; border-radius: 6px; padding: 0.625rem;">
+                        @foreach(var font in TypedSignatureFonts) {
+                            <option value="@font.Value" style="font-family: @font.Value">@font.Text</option>
+                        }
+                    </select>
+                </div>
+            </div>
+            <canvas id="envelope-typed-signature-pad" 
+                    width="560" 
+                    height="180" 
+                    style="border: 2px solid #e9ecef; border-radius: 8px; background: white; width: 100%; max-width: 560px; box-shadow: 0 1px 3px rgba(0,0,0,0.1);"></canvas>
+        } else {
+            <p style="color: #6c757d; font-size: 0.875rem; margin-bottom: 0.75rem;">Laden Sie ein Bild Ihrer Unterschrift hoch.</p>
+            <input id="envelope-signature-image-input" 
+                   class="form-control mb-3" 
+                   type="file" 
+                   accept="image/png,image/jpeg,image/webp"
+                   style="border: 2px solid #e9ecef; border-radius: 6px; padding: 0.625rem;" />
+            <canvas id="envelope-image-signature-pad" 
+                    width="560" 
+                    height="180" 
+                    style="border: 2px solid #e9ecef; border-radius: 8px; background: white; width: 100%; max-width: 560px; box-shadow: 0 1px 3px rgba(0,0,0,0.1);"></canvas>
+        }
+
+        <div style="border-top: 2px solid #e9ecef; margin-top: 1.5rem; padding-top: 1.5rem;">
+            <div class="row g-3">
+                <div class="col-12 col-md-6">
+                    <label class="form-label" for="envelope-signer-name" style="font-size: 0.875rem; font-weight: 500; color: #495057;">
+                        Vor- und Nachname <span style="color: #dc3545;">*</span>
+                    </label>
+                    <input id="envelope-signer-name" 
+                           class="form-control" 
+                           value="@_signerFullName" 
+                           @oninput="args => _signerFullName = args.Value?.ToString() ?? string.Empty"
+                           style="border: 2px solid #e9ecef; border-radius: 6px; padding: 0.625rem;" />
+                </div>
+                <div class="col-12 col-md-6">
+                    <label class="form-label" for="envelope-signer-position" style="font-size: 0.875rem; font-weight: 500; color: #495057;">
+                        Position <span style="color: #6c757d; font-weight: 400;">(optional)</span>
+                    </label>
+                    <input id="envelope-signer-position" 
+                           class="form-control" 
+                           value="@_signerPosition" 
+                           @oninput="args => _signerPosition = args.Value?.ToString() ?? string.Empty"
+                           style="border: 2px solid #e9ecef; border-radius: 6px; padding: 0.625rem;" />
+                </div>
+                <div class="col-12 col-md-6">
+                    <label class="form-label" for="envelope-signature-place" style="font-size: 0.875rem; font-weight: 500; color: #495057;">
+                        Ort <span style="color: #dc3545;">*</span>
+                    </label>
+                    <input id="envelope-signature-place" 
+                           class="form-control" 
+                           value="@_signaturePlace" 
+                           @oninput="args => _signaturePlace = args.Value?.ToString() ?? string.Empty"
+                           style="border: 2px solid #e9ecef; border-radius: 6px; padding: 0.625rem;" />
+                </div>
+            </div>
+        </div>
+
+        @if(!string.IsNullOrWhiteSpace(_popupValidationMessage)) {
+            <div style="background: #fee; border-left: 4px solid #dc3545; padding: 0.75rem 1rem; margin-top: 1rem; border-radius: 4px;">
+                <span style="color: #dc3545; font-size: 0.875rem; font-weight: 500;">@_popupValidationMessage</span>
+            </div>
+        }
+    </BodyContentTemplate>
+    <FooterContentTemplate>
+        <div class="d-flex gap-2 justify-content-between w-100" style="padding: 0.5rem 0;">
+            <button class="btn btn-outline-secondary" 
+                    @onclick="RenewSignatureAsync"
+                    style="border-radius: 6px; padding: 0.625rem 1.25rem; font-weight: 500;">
+                <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" fill="currentColor" class="me-1" viewBox="0 0 16 16">
+                    <path fill-rule="evenodd" d="M8 3a5 5 0 1 0 4.546 2.914.5.5 0 0 1 .908-.417A6 6 0 1 1 8 2v1z"/>
+                    <path d="M8 4.466V.534a.25.25 0 0 1 .41-.192l2.36 1.966c.12.1.12.284 0 .384L8.41 4.658A.25.25 0 0 1 8 4.466z"/>
+                </svg>
+                Erneuern
+            </button>
+            <button class="btn btn-primary" 
+                    @onclick="SaveSignatureAsync"
+                    style="background: linear-gradient(135deg, #4F46E5 0%, #4338CA 100%); border: none; border-radius: 6px; padding: 0.625rem 2rem; font-weight: 600; box-shadow: 0 2px 4px rgba(79, 70, 229, 0.3);">
+                <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" fill="currentColor" class="me-1" viewBox="0 0 16 16">
+                    <path d="M13.854 3.646a.5.5 0 0 1 0 .708l-7 7a.5.5 0 0 1-.708 0l-3.5-3.5a.5.5 0 1 1 .708-.708L6.5 10.293l6.646-6.647a.5.5 0 0 1 .708 0z"/>
+                </svg>
+                Speichern
+            </button>
+        </div>
+    </FooterContentTemplate>
+</DxPopup>
+
+@code {
+// Signature tab constants
+const string SignatureTabDraw = "draw";
+const string SignatureTabText = "text";
+const string SignatureTabImage = "image";
+const string DrawCanvasId = "envelope-signature-pad";
+const string TypedCanvasId = "envelope-typed-signature-pad";
+const string ImageInputId = "envelope-signature-image-input";
+const string ImageCanvasId = "envelope-image-signature-pad";
+
+readonly (string Text, string Value)[] TypedSignatureFonts = {
+    ("Brush Script", "'Brush Script MT', cursive"),
+    ("Segoe Script", "'Segoe Script', cursive"),
+    ("Lucida Handwriting", "'Lucida Handwriting', cursive"),
+    ("Comic Sans", "'Comic Sans MS', cursive"),
+    ("Cursive", "cursive")
+};
+
+[Parameter] public string? EnvelopeKey { get; set; }
+
+bool _isLoading = true;
+string? _errorMessage;
+string? _pdfDataUrl;
+bool _pdfLoaded = false;
+int _currentPage = 1;
+int _totalPages = 0;
+int _currentZoom = 150;
+bool _showThumbnails = true;
+bool _isLoggingOut = false;
+DotNetObjectReference<EnvelopeViewer>? _dotNetRef;
+IReadOnlyList<SignatureDto> _signatures = [];
+EnvelopeReceiverDto? _envelopeReceiver;
+
+// Signature navigation state
+int _totalSignatures = 0;
+int _signedSignatures = 0;
+int _unsignedSignatures = 0;
+int _currentSignatureIndex = 0;  // Şu an hangi imzada (1-based)
+
+// Signature state
+SignatureCaptureDto? _capturedSignature;
+bool _signaturePopupVisible = false;
+string? _popupValidationMessage;
+string _activeSignatureTab = SignatureTabDraw;
+string _typedSignatureText = string.Empty;
+string _typedSignatureFont = "'Brush Script MT', cursive";
+string _signerFullName = string.Empty;
+string _signerPosition = string.Empty;
+string _signaturePlace = string.Empty;
+
+// Resizable splitter state
+int _thumbnailWidth = 260;
+bool _isResizing = false;
+int _resizeStartX = 0;
+int _resizeStartWidth = 0;
+const int MinThumbnailWidth = 150;
+const int MaxThumbnailWidth = 400;
+
+    async Task LogoutAsync() {
+        if (string.IsNullOrWhiteSpace(EnvelopeKey) || _isLoggingOut) return;
+        _isLoggingOut = true;
+        await InvokeAsync(StateHasChanged);
+        await AuthService.LogoutEnvelopeReceiverAsync(EnvelopeKey);
+        Navigation.NavigateTo($"/login/{Uri.EscapeDataString(EnvelopeKey)}", forceLoad: true);
+    }
+
+    protected override async Task OnInitializedAsync() {
+        if (string.IsNullOrWhiteSpace(EnvelopeKey)) {
+            _errorMessage = "Envelope-Schlüssel fehlt.";
+            _isLoading = false;
+            return;
+        }
+
+        // Check authentication
+        var hasAccess = await AuthService.CheckEnvelopeAccessAsync(EnvelopeKey);
+        if (!hasAccess) {
+            Navigation.NavigateTo($"/login/{Uri.EscapeDataString(EnvelopeKey)}");
+            return;
+        }
+
+        try {
+            var (pdfBytes, statusCode) = await DocumentService.GetDocumentAsync(EnvelopeKey);
+
+            if (pdfBytes is { Length: > 0 }) {
+                var base64 = Convert.ToBase64String(pdfBytes);
+                _pdfDataUrl = $"data:application/pdf;base64,{base64}";
+            } else {
+                _errorMessage = $"Dokument konnte nicht geladen werden. HTTP Status: {statusCode}";
+            }
+
+            var signatures = await SignatureService.GetAsync(EnvelopeKey);
+            _signatures = signatures.Convert(UnitOfLength.Point);
+
+            _envelopeReceiver = await EnvelopeReceiverService.GetAsync(EnvelopeKey);
+
+            await JSRuntime.InvokeVoidAsync("console.log", "Loaded signatures:", _signatures);
+
+            // Open signature popup on page load
+            _activeSignatureTab = SignatureTabDraw;
+            _signaturePopupVisible = true;
+            _popupValidationMessage = null;
+
+        } catch (Exception ex) {
+            _errorMessage = $"Fehler: {ex.Message}";
+        }
+
+        _isLoading = false;
+        await InvokeAsync(StateHasChanged);
+    }
+
+    protected override async Task OnAfterRenderAsync(bool firstRender) {
+        if (firstRender) {
+            // Load saved thumbnail width from localStorage
+            try {
+                var savedWidth = await JSRuntime.InvokeAsync<string>("localStorage.getItem", "envelopeViewer_thumbnailWidth");
+                if (!string.IsNullOrEmpty(savedWidth) && int.TryParse(savedWidth, out var width)) {
+                    _thumbnailWidth = Math.Clamp(width, MinThumbnailWidth, MaxThumbnailWidth);
+                    await InvokeAsync(StateHasChanged);
+                }
+            } catch {
+                // Ignore localStorage errors
+            }
+        }
+
+        if (!_pdfLoaded && !string.IsNullOrWhiteSpace(_pdfDataUrl)) {
+            await Task.Delay(500);
+            
+            try {
+                _dotNetRef = DotNetObjectReference.Create(this);
+                
+                // Send quality options to JavaScript
+                var options = PdfViewerOptions.Value;
+                await JSRuntime.InvokeVoidAsync("pdfViewer.setQualityOptions", new
+                {
+                    options.ThumbnailBaseScale,
+                    options.ThumbnailEnableHiDPI,
+                    options.ThumbnailMaxDPR,
+                    options.MainCanvasEnableHiDPI,
+                    options.MainCanvasMaxDPR,
+                    options.EnableSmoothZoom,
+                    options.ZoomTransitionDuration,
+                    options.RenderingOpacity,
+                    options.ZoomStepPercentage
+                });
+                
+                var success = await JSRuntime.InvokeAsync<bool>("pdfViewer.initialize", "pdf-canvas", _pdfDataUrl, _dotNetRef);
+                
+                if (success) {
+                    _pdfLoaded = true;
+                    _totalPages = await JSRuntime.InvokeAsync<int>("pdfViewer.getTotalPages");
+                    _currentPage = await JSRuntime.InvokeAsync<int>("pdfViewer.getCurrentPage");
+                    
+                    // Attach resize listeners
+                    await JSRuntime.InvokeVoidAsync("pdfViewer.attachResizeListeners", _dotNetRef);
+                    
+                    
+                    await InvokeAsync(StateHasChanged);
+                    
+                    // Wait for DOM to be ready, then render thumbnails
+                    await Task.Delay(100);
+                    await RenderThumbnailsAsync();
+                    
+                    // Render signature buttons
+                    await RenderSignatureButtonsAsync();
+                }
+            } catch (Exception ex) {
+                _errorMessage = $"PDF.js Fehler: {ex.Message}";
+                await InvokeAsync(StateHasChanged);
+            }
+        }
+    }
+
+    [JSInvokable]
+    public async Task OnZoomChanged(double scale)
+    {
+        _currentZoom = (int)(scale * 100);
+        await InvokeAsync(StateHasChanged);
+        
+        // Small delay for canvas render to complete (reduced from 100ms to 10ms)
+        await Task.Delay(10);
+        await RenderSignatureButtonsAsync();
+    }
+
+    async Task NextPage() {
+        if (await JSRuntime.InvokeAsync<bool>("pdfViewer.nextPage")) {
+            _currentPage = await JSRuntime.InvokeAsync<int>("pdfViewer.getCurrentPage");
+            await RenderSignatureButtonsAsync();
+        }
+    }
+
+    async Task PreviousPage() {
+        if (await JSRuntime.InvokeAsync<bool>("pdfViewer.previousPage")) {
+            _currentPage = await JSRuntime.InvokeAsync<int>("pdfViewer.getCurrentPage");
+            await RenderSignatureButtonsAsync();
+        }
+    }
+
+    async Task ZoomIn() {
+        if (_currentZoom >= 300) return;
+        await JSRuntime.InvokeVoidAsync("pdfViewer.zoomIn");
+        var scale = await JSRuntime.InvokeAsync<double>("pdfViewer.getScale");
+        _currentZoom = (int)(scale * 100);
+        
+        // Update signature overlay positions after zoom
+        await RenderSignatureButtonsAsync();
+    }
+
+    async Task ZoomOut() {
+        if (_currentZoom <= 50) return;
+        await JSRuntime.InvokeVoidAsync("pdfViewer.zoomOut");
+        var scale = await JSRuntime.InvokeAsync<double>("pdfViewer.getScale");
+        _currentZoom = (int)(scale * 100);
+        
+        // Update signature overlay positions after zoom
+        await RenderSignatureButtonsAsync();
+    }
+
+    async Task SetZoom(int percentage) {
+        var scale = percentage / 100.0;
+        await JSRuntime.InvokeVoidAsync("pdfViewer.setScale", scale);
+        _currentZoom = percentage;
+    }
+
+    async Task OnZoomSliderChanged(ChangeEventArgs e) {
+        if (int.TryParse(e.Value?.ToString(), out var zoom)) {
+            await SetZoom(zoom);
+            
+            // Update signature overlay positions after zoom
+            await RenderSignatureButtonsAsync();
+        }
+    }
+
+    async Task OnPageInputChanged(ChangeEventArgs e) {
+        if (int.TryParse(e.Value?.ToString(), out var pageNum) && pageNum >= 1 && pageNum <= _totalPages) {
+            if (await JSRuntime.InvokeAsync<bool>("pdfViewer.goToPage", pageNum)) {
+                _currentPage = pageNum;
+            }
+        }
+    }
+
+    async Task FitToWidth() {
+        await JSRuntime.InvokeVoidAsync("pdfViewer.fitToWidth");
+        var scale = await JSRuntime.InvokeAsync<double>("pdfViewer.getScale");
+        _currentZoom = (int)(scale * 100);
+    }
+
+    async Task ToggleThumbnails() {
+        _showThumbnails = !_showThumbnails;
+        
+        // Re-render thumbnails when showing them
+        if (_showThumbnails && _pdfLoaded) {
+            await InvokeAsync(StateHasChanged); // Force UI update first
+            await Task.Delay(150); // Wait for DOM to render canvas elements
+            await RenderThumbnailsAsync();
+        }
+    }
+
+    async Task GoToPageFromThumbnail(int pageNum) {
+        if (await JSRuntime.InvokeAsync<bool>("pdfViewer.goToPage", pageNum)) {
+            _currentPage = pageNum;
+            await RenderSignatureButtonsAsync();
+        }
+    }
+
+    async Task RenderSignatureButtonsAsync() {
+        if (_signatures.Count == 0 || !_pdfLoaded) return;
+
+        try {
+            await JSRuntime.InvokeVoidAsync("pdfViewer.renderSignatureButtons", _signatures, _currentPage, _dotNetRef);
+            await UpdateSignatureCounterAsync();
+        } catch (Exception ex) {
+            System.Diagnostics.Debug.WriteLine($"Signature button rendering error: {ex.Message}");
+        }
+    }
+
+    [JSInvokable]
+    public async Task OnSignatureButtonClick(int signatureId) {
+        if (_capturedSignature == null) {
+            // No signature captured yet - should not happen as popup is shown on page load
+            return;
+        }
+
+        // Apply signature to PDF canvas
+        await JSRuntime.InvokeVoidAsync("pdfViewer.applySignature", 
+            signatureId, 
+            _capturedSignature.DataUrl,
+            _capturedSignature.FullName,
+            _capturedSignature.Position,
+            _capturedSignature.Place);
+        
+        // Update counter
+        await UpdateSignatureCounterAsync();
+    }
+
+    [JSInvokable]
+    public async Task OnSignatureNavChanged() {
+        await UpdateSignatureCounterAsync();
+    }
+
+    [JSInvokable]
+    public async Task OnPageChangedBySignatureNav(int newPage) {
+        _currentPage = newPage;
+        await RenderSignatureButtonsAsync();
+    }
+
+    async Task UpdateSignatureCounterAsync() {
+        try {
+            var state = await JSRuntime.InvokeAsync<SignatureNavState>("pdfViewer.getSignatureNavState");
+            _totalSignatures = state.Total;
+            _signedSignatures = state.Signed;
+            _unsignedSignatures = state.Unsigned;
+            _currentSignatureIndex = state.CurrentIndex;  // Şu an hangi imzada
+            await InvokeAsync(StateHasChanged);
+        } catch {
+            // Ignore errors during counter update
+        }
+    }
+
+    async Task GoToPreviousSignature() {
+        await JSRuntime.InvokeVoidAsync("pdfViewer.goToPreviousSignature", _dotNetRef);
+    }
+
+    async Task GoToNextSignature() {
+        await JSRuntime.InvokeVoidAsync("pdfViewer.goToNextSignature", _dotNetRef);
+    }
+
+    void RestartSigning() {
+        // Force page reload to reset all signatures and state
+        Navigation.NavigateTo(Navigation.Uri, forceLoad: true);
+    }
+
+    record SignatureNavState(int Total, int Signed, int Unsigned, int CurrentIndex, bool CanGoPrev, bool CanGoNext);
+
+    // Signature popup methods
+    void OpenSignaturePopup() {
+        _activeSignatureTab = SignatureTabDraw;
+        _signaturePopupVisible = true;
+        _popupValidationMessage = null;
+    }
+
+    async Task OnPopupShownAsync() {
+        await InitializeActiveSignatureTabAsync();
+    }
+
+    async Task SetSignatureTabAsync(string tab) {
+        _activeSignatureTab = tab;
+        _popupValidationMessage = null;
+        await InvokeAsync(StateHasChanged);
+        await Task.Delay(50);
+        await InitializeActiveSignatureTabAsync();
+    }
+
+    async Task InitializeActiveSignatureTabAsync() {
+        if(_activeSignatureTab == SignatureTabDraw) {
+            await JSRuntime.InvokeVoidAsync("receiverSignature.initialize", DrawCanvasId);
+        } else if(_activeSignatureTab == SignatureTabText) {
+            await JSRuntime.InvokeVoidAsync("receiverSignature.initializeTyped", TypedCanvasId);
+            await RenderTypedSignatureAsync();
+        } else {
+            await JSRuntime.InvokeVoidAsync("receiverSignature.initializeImage", ImageInputId, ImageCanvasId);
+        }
+    }
+
+    async Task RenewSignatureAsync() {
+        _popupValidationMessage = null;
+
+        if(_activeSignatureTab == SignatureTabDraw) {
+            await JSRuntime.InvokeVoidAsync("receiverSignature.clear", DrawCanvasId);
+        } else if(_activeSignatureTab == SignatureTabText) {
+            _typedSignatureText = string.Empty;
+            await JSRuntime.InvokeVoidAsync("receiverSignature.clearTyped", TypedCanvasId);
+        } else {
+            await JSRuntime.InvokeVoidAsync("receiverSignature.clearImage", ImageInputId, ImageCanvasId);
+        }
+    }
+
+    async Task OnTypedSignatureChanged(Microsoft.AspNetCore.Components.ChangeEventArgs args) {
+        _typedSignatureText = args.Value?.ToString() ?? string.Empty;
+        await RenderTypedSignatureAsync();
+    }
+
+    async Task OnTypedSignatureFontChanged(Microsoft.AspNetCore.Components.ChangeEventArgs args) {
+        _typedSignatureFont = args.Value?.ToString() ?? _typedSignatureFont;
+        await RenderTypedSignatureAsync();
+    }
+
+    async Task RenderTypedSignatureAsync() {
+        await JSRuntime.InvokeVoidAsync("receiverSignature.renderTypedSignature", TypedCanvasId, _typedSignatureText, _typedSignatureFont);
+    }
+
+    async Task SaveSignatureAsync() {
+        if (string.IsNullOrWhiteSpace(_signerFullName)) {
+            _popupValidationMessage = "Bitte geben Sie Vor- und Nachname ein.";
+            return;
+        }
+        if (string.IsNullOrWhiteSpace(_signaturePlace)) {
+            _popupValidationMessage = "Bitte geben Sie den Ort ein.";
+            return;
+        }
+        var signatureDataUrl = await GetActiveSignatureDataUrlAsync();
+        if (string.IsNullOrWhiteSpace(signatureDataUrl)) {
+            _popupValidationMessage = "Die Unterschrift ist erforderlich.";
+            return;
+        }
+
+        _popupValidationMessage = null;
+        _capturedSignature = new SignatureCaptureDto
+        {
+            DataUrl = signatureDataUrl,
+            FullName = _signerFullName.Trim(),
+            Position = _signerPosition.Trim(),
+            Place = _signaturePlace.Trim()
+        };
+        _signaturePopupVisible = false;
+        
+        await InvokeAsync(StateHasChanged);
+        Console.WriteLine($"Signature saved: {_signerFullName}, {_signaturePlace}");
+    }
+
+    async Task<string?> GetActiveSignatureDataUrlAsync() {
+        if(_activeSignatureTab == SignatureTabDraw)
+            return await JSRuntime.InvokeAsync<string?>("receiverSignature.getDataUrl", DrawCanvasId);
+
+        if(_activeSignatureTab == SignatureTabText) {
+            await RenderTypedSignatureAsync();
+            return await JSRuntime.InvokeAsync<string?>("receiverSignature.getTypedDataUrl", TypedCanvasId);
+        }
+
+        return await JSRuntime.InvokeAsync<string?>("receiverSignature.getImageDataUrl", ImageCanvasId);
+    }
+
+    async Task RenderThumbnailsAsync() {
+        try {
+            var delay = PdfViewerOptions.Value.ThumbnailRenderDelay;
+            
+            // Sequential rendering to avoid overwhelming the browser
+            for (int i = 1; i <= _totalPages; i++) {
+                await JSRuntime.InvokeVoidAsync("pdfViewer.renderThumbnail", i, $"thumb-canvas-{i}");
+                
+                // Configurable delay between renders
+                if (i < _totalPages) {
+                    await Task.Delay(delay);
+                }
+            }
+        } catch (Exception ex) {
+            // Thumbnail rendering is not critical
+            System.Diagnostics.Debug.WriteLine($"Thumbnail rendering error: {ex.Message}");
+        }
+    }
+
+    // Resizable splitter methods
+    void OnSplitterMouseDown(MouseEventArgs e) {
+        _isResizing = true;
+        _resizeStartX = (int)e.ClientX;
+        _resizeStartWidth = _thumbnailWidth;
+        
+        // Add resizing class to body to prevent text selection
+        _ = JSRuntime.InvokeVoidAsync("eval", "document.body.classList.add('resizing')");
+        _ = JSRuntime.InvokeVoidAsync("pdfViewer.startResize");
+    }
+
+    [JSInvokable]
+    public async Task OnSplitterMouseMove(int clientX) {
+        if (!_isResizing) return;
+
+        var delta = clientX - _resizeStartX;
+        var newWidth = _resizeStartWidth + delta;
+        
+        // Clamp to min/max
+        _thumbnailWidth = Math.Clamp(newWidth, MinThumbnailWidth, MaxThumbnailWidth);
+        
+        await InvokeAsync(StateHasChanged);
+    }
+
+    [JSInvokable]
+    public async Task OnSplitterMouseUp() {
+        if (!_isResizing) return;
+        
+        _isResizing = false;
+        
+        // Remove resizing class from body
+        await JSRuntime.InvokeVoidAsync("eval", "document.body.classList.remove('resizing')");
+        
+        // Save preference to localStorage
+        await JSRuntime.InvokeVoidAsync("localStorage.setItem", "envelopeViewer_thumbnailWidth", _thumbnailWidth.ToString());
+        
+        await InvokeAsync(StateHasChanged);
+    }
+
+    public async ValueTask DisposeAsync() {
+        if (_pdfLoaded) {
+            try {
+                await JSRuntime.InvokeVoidAsync("pdfViewer.dispose");
+            } catch {
+                // Ignore errors during disposal
+            }
+        }
+        _dotNetRef?.Dispose();
+    }
+}

EnvelopeGenerator.ReceiverUI/Pages/Index.razor

@@ -0,0 +1,71 @@
+@page "/"
+@inject IJSRuntime JS
+
+<link href="_content/DevExpress.Blazor.Themes/blazing-berry.bs5.min.css" rel="stylesheet" />
+
+<div class="home-page-wrapper">
+
+    <div class="home-hero-header">
+        <div class="home-hero-header__inner">
+            <svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" fill="currentColor" class="home-hero-header__icon" viewBox="0 0 16 16">
+                <path d="M0 4a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V4Zm2-1a1 1 0 0 0-1 1v.217l7 4.2 7-4.2V4a1 1 0 0 0-1-1H2Zm13 2.383-4.708 2.825L15 11.105V5.383Zm-.034 6.876-5.64-3.471L8 9.583l-1.326-.795-5.64 3.47A1 1 0 0 0 2 13h12a1 1 0 0 0 .966-.741ZM1 11.105l4.708-2.897L1 5.383v5.722Z"/>
+            </svg>
+            <div>
+                <h1 class="home-hero-header__title">SignFlow</h1>
+                <p class="home-hero-header__subtitle">Willkommen im eSign-Portal</p>
+            </div>
+        </div>
+    </div>
+
+    <div class="home-content">
+        <div class="home-card card shadow border-0">
+            <div class="card-body p-4 p-md-5">
+
+                <p class="text-muted mb-4" style="font-size: 0.92rem; line-height: 1.7; text-align: justify; text-align-last: left; min-height: calc(0.92rem * 1.7 * 9);">
+                    <span id="home-description"></span>
+                </p>
+
+                <div class="mt-4 pt-3 border-top">
+                    <div class="d-flex flex-wrap justify-content-center gap-3">
+                        <div class="home-feature-badge">
+                            <svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" fill="currentColor" class="me-1" viewBox="0 0 16 16">
+                                <path d="M8 1a2 2 0 0 1 2 2v4H6V3a2 2 0 0 1 2-2zm3 6V3a3 3 0 0 0-6 0v4a2 2 0 0 0-2 2v5a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2z"/>
+                            </svg>
+                            Sicherer Zugang
+                        </div>
+                        <div class="home-feature-badge">
+                            <svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" fill="currentColor" class="me-1" viewBox="0 0 16 16">
+                                <path d="M13.854 3.646a.5.5 0 0 1 0 .708l-7 7a.5.5 0 0 1-.708 0l-3.5-3.5a.5.5 0 1 1 .708-.708L6.5 10.293l6.646-6.647a.5.5 0 0 1 .708 0z"/>
+                            </svg>
+                            Digitale Unterschrift
+                        </div>
+                        <div class="home-feature-badge">
+                            <svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" fill="currentColor" class="me-1" viewBox="0 0 16 16">
+                                <path d="M.5 9.9a.5.5 0 0 1 .5.5v2.5a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-2.5a.5.5 0 0 1 1 0v2.5a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2v-2.5a.5.5 0 0 1 .5-.5z"/>
+                                <path d="M7.646 11.854a.5.5 0 0 0 .708 0l3-3a.5.5 0 0 0-.708-.708L8.5 10.293V1.5a.5.5 0 0 0-1 0v8.793L5.354 8.146a.5.5 0 1 0-.708.708l3 3z"/>
+                            </svg>
+                            PDF-Export
+                        </div>
+                    </div>
+                </div>
+
+            </div>
+        </div>
+    </div>
+
+</div>
+
+@code {
+    private const string HomePageDescription =
+        "Das digitale Unterschriftenportal ist eine Plattform, die entwickelt wurde, um Ihre Dokumente sicher zu unterschreiben und zu verwalten. " +
+        "Mit seiner benutzerfreundlichen Oberfläche können Sie Ihre Dokumente schnell hochladen, die Unterschriftsprozesse verfolgen und Ihre digitalen Unterschriftenanwendungen einfach durchführen. " +
+        "Dieses Portal beschleunigt Ihren Arbeitsablauf mit rechtlich gültigen Unterschriften und erhöht gleichzeitig die Sicherheit Ihrer Dokumente.";
+
+    protected override async Task OnAfterRenderAsync(bool firstRender)
+    {
+        if (firstRender)
+        {
+            await JS.InvokeVoidAsync("receiverSignature.startTyped", "home-description", HomePageDescription, 15);
+        }
+    }
+}

EnvelopeGenerator.ReceiverUI/Pages/Login.razor

@@ -0,0 +1,158 @@
+@page "/login/{EnvelopeKey}"
+@using EnvelopeGenerator.ReceiverUI.Services
+@inject AuthService AuthService
+@inject NavigationManager Navigation
+
+<link href="_content/DevExpress.Blazor.Themes/blazing-berry.bs5.min.css" rel="stylesheet" />
+
+<div class="login-page-wrapper d-flex align-items-center justify-content-center min-vh-100">
+    <div class="login-card card shadow border-0" style="max-width: 440px; width: 100%;">
+
+        <div class="card-header text-white text-center py-4 border-0" style="background: linear-gradient(135deg, #2c3e50 0%, #3498db 100%); border-radius: calc(0.375rem - 1px) calc(0.375rem - 1px) 0 0;">
+            <div class="mb-2">
+                <svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" fill="currentColor" viewBox="0 0 16 16">
+                    <path d="M8 1a2 2 0 0 1 2 2v4H6V3a2 2 0 0 1 2-2zm3 6V3a3 3 0 0 0-6 0v4a2 2 0 0 0-2 2v5a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2z"/>
+                </svg>
+            </div>
+            <h5 class="mb-0 fw-semibold">Dokument öffnen</h5>
+            <p class="mb-0 mt-1 opacity-75" style="font-size: 0.85rem;">Sicherer Zugang mit Zugangscode</p>
+        </div>
+
+        <div class="card-body p-4">
+
+            <p class="text-muted mb-4" style="font-size: 0.875rem; line-height: 1.5;">
+                Bitte geben Sie den Zugangscode ein, den Sie per E-Mail erhalten haben, um das Dokument sicher zu öffnen.
+            </p>
+
+            @if (LoginResult == EnvelopeLoginResult.NotFound) {
+                <div class="alert alert-warning d-flex align-items-start gap-2 py-2" role="alert">
+                    <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" fill="currentColor" class="flex-shrink-0 mt-1" viewBox="0 0 16 16">
+                        <path d="M8.982 1.566a1.13 1.13 0 0 0-1.96 0L.165 13.233c-.457.778.091 1.767.98 1.767h13.713c.889 0 1.438-.99.98-1.767L8.982 1.566zM8 5c.535 0 .954.462.9.995l-.35 3.507a.552.552 0 0 1-1.1 0L7.1 5.995A.905.905 0 0 1 8 5zm.002 6a1 1 0 1 1 0 2 1 1 0 0 1 0-2z"/>
+                    </svg>
+                    <div>
+                        <strong>Dokument nicht gefunden.</strong><br />
+                        <span style="font-size:0.85rem;">Der angegebene Zugangscode konnte keinem Dokument zugeordnet werden. Bitte prüfen Sie den Link in Ihrer E-Mail.</span>
+                    </div>
+                </div>
+            } else if (LoginResult == EnvelopeLoginResult.InvalidCode) {
+                <div class="alert alert-danger d-flex align-items-start gap-2 py-2" role="alert">
+                    <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" fill="currentColor" class="flex-shrink-0 mt-1" viewBox="0 0 16 16">
+                        <path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM5.354 4.646a.5.5 0 1 0-.708.708L7.293 8l-2.647 2.646a.5.5 0 0 0 .708.708L8 8.707l2.646 2.647a.5.5 0 0 0 .708-.708L8.707 8l2.647-2.646a.5.5 0 0 0-.708-.708L8 7.293 5.354 4.646z"/>
+                    </svg>
+                    <div>
+                        <strong>Ungültiger Zugangscode.</strong><br />
+                        <span style="font-size:0.85rem;">Der eingegebene Code ist falsch. Bitte versuchen Sie es erneut.</span>
+                    </div>
+                </div>
+            } else if (LoginResult == EnvelopeLoginResult.Error) {
+                <div class="alert alert-secondary d-flex align-items-start gap-2 py-2" role="alert">
+                    <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" fill="currentColor" class="flex-shrink-0 mt-1" viewBox="0 0 16 16">
+                        <path d="M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z"/>
+                        <path d="M7.002 11a1 1 0 1 1 2 0 1 1 0 0 1-2 0zM7.1 4.995a.905.905 0 1 1 1.8 0l-.35 3.507a.552.552 0 0 1-1.1 0L7.1 4.995z"/>
+                    </svg>
+                    <div>
+                        <strong>Serverfehler.</strong><br />
+                        <span style="font-size:0.85rem;">Ein unerwarteter Fehler ist aufgetreten. Bitte versuchen Sie es später erneut.</span>
+                    </div>
+                </div>
+            }
+
+            <div class="mb-4">
+                <label class="form-label fw-medium" for="login-access-code">
+                    Zugangscode
+                    <span class="text-danger ms-1">*</span>
+                </label>
+                <div class="input-group">
+                    <span class="input-group-text bg-light border-end-0">
+                        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="#6c757d" viewBox="0 0 16 16">
+                            <path d="M3.5 11.5a3.5 3.5 0 1 1 3.163-5H14L15.5 8 14 9.5l-1-1-1 1-1-1-1 1-1-1-1.837 1.337A3.5 3.5 0 0 1 3.5 11.5zm0-1a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5z"/>
+                        </svg>
+                    </span>
+                    <input id="login-access-code"
+                           type="@(ShowCode ? "text" : "password")"
+                           class="form-control border-start-0 border-end-0 @(LoginResult == EnvelopeLoginResult.InvalidCode ? "is-invalid" : null)"
+                           placeholder="Zugangscode eingeben"
+                           @bind="AccessCode"
+                           @bind:event="oninput"
+                           @onkeydown="OnKeyDownAsync"
+                           disabled="@IsLoading"
+                           autocomplete="one-time-code" />
+                    <button type="button"
+                            class="btn btn-outline-secondary border-start-0"
+                            style="border-left: none;"
+                            tabindex="-1"
+                            @onclick="() => ShowCode = !ShowCode">
+                        @if (ShowCode) {
+                            <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
+                                <path d="M13.359 11.238C15.06 9.72 16 8 16 8s-3-5.5-8-5.5a7.028 7.028 0 0 0-2.79.588l.77.771A5.944 5.944 0 0 1 8 3.5c2.12 0 3.879 1.168 5.168 2.457A13.134 13.134 0 0 1 14.828 8c-.058.087-.122.183-.195.288-.335.48-.83 1.12-1.465 1.755-.165.165-.337.328-.517.486l.708.709z"/>
+                                <path d="M11.297 9.176a3.5 3.5 0 0 0-4.474-4.474l.823.823a2.5 2.5 0 0 1 2.829 2.829l.822.822zm-2.943 1.299.822.822a3.5 3.5 0 0 1-4.474-4.474l.823.823a2.5 2.5 0 0 0 2.829 2.829z"/>
+                                <path d="M3.35 5.47c-.18.16-.353.322-.518.487A13.134 13.134 0 0 0 1.172 8l.195.288c.335.48.83 1.12 1.465 1.755C4.121 11.332 5.881 12.5 8 12.5c.716 0 1.39-.133 2.02-.36l.77.772A7.029 7.029 0 0 1 8 13.5C3 13.5 0 8 0 8s.939-1.721 2.641-3.238l.708.709z"/>
+                                <path fill-rule="evenodd" d="M13.646 14.354l-12-12 .708-.708 12 12-.708.708z"/>
+                            </svg>
+                        } else {
+                            <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
+                                <path d="M16 8s-3-5.5-8-5.5S0 8 0 8s3 5.5 8 5.5S16 8 16 8zM1.173 8a13.133 13.133 0 0 1 1.66-2.043C4.12 4.668 5.88 3.5 8 3.5c2.12 0 3.879 1.168 5.168 2.457A13.133 13.133 0 0 1 14.828 8c-.058.087-.122.183-.195.288-.335.48-.83 1.12-1.465 1.755C11.879 11.332 10.119 12.5 8 12.5c-2.12 0-3.879-1.168-5.168-2.457A13.134 13.134 0 0 1 1.172 8z"/>
+                                <path d="M8 5.5a2.5 2.5 0 1 0 0 5 2.5 2.5 0 0 0 0-5zM4.5 8a3.5 3.5 0 1 1 7 0 3.5 3.5 0 0 1-7 0z"/>
+                            </svg>
+                        }
+                    </button>
+                </div>
+            </div>
+
+            <button class="btn btn-primary w-100 py-2 fw-medium"
+                    style="background: linear-gradient(135deg, #2c3e50 0%, #3498db 100%); border: none;"
+                    @onclick="SubmitAsync"
+                    disabled="@(IsLoading || string.IsNullOrWhiteSpace(AccessCode))">
+                @if (IsLoading) {
+                    <span class="spinner-border spinner-border-sm me-2" role="status" aria-hidden="true"></span>
+                    <span>Überprüfen …</span>
+                } else {
+                    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="me-2" viewBox="0 0 16 16">
+                        <path d="M8 1a2 2 0 0 1 2 2v4H6V3a2 2 0 0 1 2-2zm3 6V3a3 3 0 0 0-6 0v4a2 2 0 0 0-2 2v5a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2z"/>
+                    </svg>
+                    <span>Dokument öffnen</span>
+                }
+            </button>
+
+        </div>
+
+        <div class="card-footer text-center text-muted py-3 border-0 bg-transparent" style="font-size: 0.78rem;">
+            Bei Problemen wenden Sie sich bitte an den Absender des Dokuments.
+        </div>
+
+    </div>
+</div>
+
+@code {
+    [Parameter] public string EnvelopeKey { get; set; } = string.Empty;
+
+    string AccessCode = string.Empty;
+    bool ShowCode;
+    bool IsLoading;
+    EnvelopeLoginResult? LoginResult;
+
+    async Task OnKeyDownAsync(Microsoft.AspNetCore.Components.Web.KeyboardEventArgs e) {
+        if (e.Key == "Enter")
+            await SubmitAsync();
+    }
+
+    async Task SubmitAsync() {
+        if (string.IsNullOrWhiteSpace(AccessCode) || IsLoading) return;
+
+        IsLoading = true;
+        LoginResult = null;
+        await InvokeAsync(StateHasChanged);
+
+        var result = await AuthService.LoginEnvelopeReceiverAsync(EnvelopeKey, AccessCode.Trim());
+
+        if (result == EnvelopeLoginResult.Success) {
+            Navigation.NavigateTo($"/envelope/{Uri.EscapeDataString(EnvelopeKey)}", forceLoad: true);
+            return;
+        }
+
+        LoginResult = result;
+        IsLoading = false;
+        await InvokeAsync(StateHasChanged);
+    }
+}
+

EnvelopeGenerator.ReceiverUI/Pages/ReportDesigner.razor

@@ -0,0 +1,19 @@
+@page "/sender"
+@using DevExpress.DataAccess.Json;
+@using EnvelopeGenerator.ReceiverUI.Services;
+
+<DxReportDesigner ReportName="LargeDatasetReport" CssClass="dx-blazor-reporting-container" Height="@null" Width="@null" AllowMDI="true" DataSources="DataSources">
+    <DxReportDesignerWizardSettings UseFullscreenWizard="true" />
+</DxReportDesigner>
+
+@code {
+    Dictionary<string, object> DataSources = new Dictionary<string, object>();
+    protected override async Task OnInitializedAsync() {
+        await base.OnInitializedAsync();
+        var connection = CustomDataSourceWizardJsonDataConnectionStorage.GetDefaultConnection();
+        JsonDataSource jsonDataSource = new JsonDataSource();
+        jsonDataSource.JsonSource = connection.GetJsonSource();
+        await jsonDataSource.FillAsync();
+        DataSources.Add("Northwind", jsonDataSource);
+    }
+}

EnvelopeGenerator.ReceiverUI/Pages/ReportViewer.razor

@@ -0,0 +1,735 @@
+@page "/receiver/{EnvelopeKey}"
+@page "/report-viewer/{EnvelopeKey}"
+@using System.Drawing
+@using DevExpress.Blazor
+@using DevExpress.Drawing
+@using DevExpress.Utils
+@using DevExpress.XtraPrinting
+@using DevExpress.XtraPrinting.Drawing
+@using Microsoft.JSInterop
+@using XtraReport = DevExpress.XtraReports.UI.XtraReport
+@using BottomMarginBand = DevExpress.XtraReports.UI.BottomMarginBand
+@using XRLabel = DevExpress.XtraReports.UI.XRLabel
+@using XRPictureBox = DevExpress.XtraReports.UI.XRPictureBox
+@using XRControl = DevExpress.XtraReports.UI.XRControl
+@using ImageSizeMode = DevExpress.XtraPrinting.ImageSizeMode
+@using EnvelopeGenerator.ReceiverUI.Services
+@using DevExpress.Blazor.Reporting
+@using Microsoft.Extensions.Options
+@using EnvelopeGenerator.ReceiverUI.Options
+@using EnvelopeGenerator.ReceiverUI.Models
+@implements IDisposable
+@inject IJSRuntime JSRuntime
+@inject AnnotationService AnnotationService
+@inject IOptions<ApiOptions> AppOptions
+@inject NavigationManager Navigation
+@inject InMemoryReportStorageWebExtension ReportStorage
+@inject EnvelopeGenerator.ReceiverUI.Services.DocumentService DocumentService
+@inject EnvelopeGenerator.ReceiverUI.Services.AuthService AuthService
+@inject EnvelopeGenerator.ReceiverUI.Services.EnvelopeReceiverService EnvelopeReceiverService
+
+<link href="_content/DevExpress.Blazor.Themes/blazing-berry.bs5.min.css" rel="stylesheet" />
+<link href="_content/DevExpress.Blazor.Reporting.Viewer/css/dx-blazor-reporting-components.bs5.css" rel="stylesheet" />
+
+<div class="receiver-page-layout">
+
+<div class="receiver-signature-panel">
+
+@* ?? Envelope info header ???????????????????????????????????????????????? *@
+@if (_envelopeReceiver is not null) {
+<div class="receiver-info-header">
+    <div class="receiver-info-header__gradient">
+        <div class="receiver-info-header__left">
+            <svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" fill="currentColor" class="receiver-info-header__icon" viewBox="0 0 16 16">
+                <path d="M0 4a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V4Zm2-1a1 1 0 0 0-1 1v.217l7 4.2 7-4.2V4a1 1 0 0 0-1-1H2Zm13 2.383-4.708 2.825L15 11.105V5.383Zm-.034 6.876-5.64-3.471L8 9.583l-1.326-.795-5.64 3.47A1 1 0 0 0 2 13h12a1 1 0 0 0 .966-.741ZM1 11.105l4.708-2.897L1 5.383v5.722Z"/>
+            </svg>
+            <div>
+                <div class="receiver-info-header__title">@(_envelopeReceiver.Envelope?.Title ?? "Dokument")</div>
+                @if (!string.IsNullOrWhiteSpace(_envelopeReceiver.Envelope?.User?.FullName) || !string.IsNullOrWhiteSpace(_envelopeReceiver.Envelope?.User?.Email)) {
+                    <div class="receiver-info-header__sender">
+                        Von
+                        @if (!string.IsNullOrWhiteSpace(_envelopeReceiver.Envelope?.User?.FullName)) {
+                            <strong>@_envelopeReceiver.Envelope!.User!.FullName</strong>
+                        }
+                        @if (!string.IsNullOrWhiteSpace(_envelopeReceiver.Envelope?.User?.Email)) {
+                            <span class="opacity-75">&lt;@_envelopeReceiver.Envelope!.User!.Email&gt;</span>
+                        }
+                        &nbsp;&middot;&nbsp; @_envelopeReceiver.Envelope?.AddedWhen.ToString("dd.MM.yyyy")
+                    </div>
+                }
+            </div>
+        </div>
+        <div class="receiver-info-header__badges">
+            @if (!string.IsNullOrWhiteSpace(_envelopeReceiver.Name)) {
+                <span class="receiver-info-badge">
+                    <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="currentColor" class="me-1" viewBox="0 0 16 16">
+                        <path d="M8 8a3 3 0 1 0 0-6 3 3 0 0 0 0 6Zm2-3a2 2 0 1 1-4 0 2 2 0 0 1 4 0Zm4 8c0 1-1 1-1 1H3s-1 0-1-1 1-4 6-4 6 3 6 4Z"/>
+                    </svg>
+                    @_envelopeReceiver.Name
+                </span>
+            }
+            @if (!string.IsNullOrWhiteSpace(_envelopeReceiver.CompanyName)) {
+                <span class="receiver-info-badge">
+                    <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="currentColor" class="me-1" viewBox="0 0 16 16">
+                        <path d="M14.763.075A.5.5 0 0 1 15 .5v15a.5.5 0 0 1-.5.5h-3a.5.5 0 0 1-.5-.5V14h-1v1.5a.5.5 0 0 1-.5.5h-9a.5.5 0 0 1-.5-.5V10a.5.5 0 0 1 .342-.474L6 7.64V4.5a.5.5 0 0 1 .276-.447l8-4a.5.5 0 0 1 .487.022Z"/>
+                    </svg>
+                    @_envelopeReceiver.CompanyName
+                </span>
+            }
+            @if (!string.IsNullOrWhiteSpace(_envelopeReceiver.JobTitle)) {
+                <span class="receiver-info-badge receiver-info-badge--muted">@_envelopeReceiver.JobTitle</span>
+            }
+            @{
+                var docElements = _envelopeReceiver.Envelope?.Documents?.FirstOrDefault()?.Elements;
+                int sigCount = docElements?.Count() ?? _annotations.Count;
+            }
+            @if (sigCount > 0) {
+                <span class="receiver-info-badge receiver-info-badge--accent">
+                    <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="currentColor" class="me-1" viewBox="0 0 16 16">
+                        <path d="M12.146.146a.5.5 0 0 1 .708 0l3 3a.5.5 0 0 1 0 .708l-10 10a.5.5 0 0 1-.168.11l-5 2a.5.5 0 0 1-.65-.65l2-5a.5.5 0 0 1 .11-.168l10-10zM11.207 2.5 13.5 4.793 14.793 3.5 12.5 1.207 11.207 2.5zm1.586 3L10.5 3.207 4 9.707V10h.5a.5.5 0 0 1 .5.5v.5h.5a.5.5 0 0 1 .5.5v.5h.293l6.5-6.5zm-9.761 5.175-.106.106-1.528 3.821 3.821-1.528.106-.106A.5.5 0 0 1 5 12.5V12h-.5a.5.5 0 0 1-.5-.5V11h-.5a.5.5 0 0 1-.468-.325z"/>
+                    </svg>
+                    @sigCount @(sigCount == 1 ? "Unterschriftsfeld" : "Unterschriftsfelder")
+                </span>
+            }
+        </div>
+    </div>
+    @if (!string.IsNullOrWhiteSpace(_envelopeReceiver.Envelope?.Message)) {
+        <div class="receiver-info-message">@_envelopeReceiver.Envelope!.Message</div>
+    }
+    @if (!string.IsNullOrWhiteSpace(_envelopeReceiver.PrivateMessage)) {
+        <div class="receiver-info-private-message">
+            <svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" fill="currentColor" class="me-1 flex-shrink-0" viewBox="0 0 16 16">
+                <path d="M8 1a2 2 0 0 1 2 2v4H6V3a2 2 0 0 1 2-2zm3 6V3a3 3 0 0 0-6 0v4a2 2 0 0 0-2 2v5a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2z"/>
+            </svg>
+            @_envelopeReceiver.PrivateMessage
+        </div>
+    }
+</div>
+}
+
+@* ?? Signature action bar ???????????????????????????????????????????????? *@
+<div class="receiver-action-bar">
+    <div class="receiver-action-bar__inner">
+        <button class="btn btn-sm @(_capturedSignature is not null ? "btn-outline-success" : "btn-primary")" @onclick="OpenSignaturePopupAsync">
+            @if (_capturedSignature is not null) {
+                <svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" fill="currentColor" class="me-1" viewBox="0 0 16 16">
+                    <path d="M13.854 3.646a.5.5 0 0 1 0 .708l-7 7a.5.5 0 0 1-.708 0l-3.5-3.5a.5.5 0 1 1 .708-.708L6.5 10.293l6.646-6.647a.5.5 0 0 1 .708 0z"/>
+                </svg>
+                <span>Unterschrift gespeichert</span>
+            } else {
+                <svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" fill="currentColor" class="me-1" viewBox="0 0 16 16">
+                    <path d="M12.146.146a.5.5 0 0 1 .708 0l3 3a.5.5 0 0 1 0 .708l-10 10a.5.5 0 0 1-.168.11l-5 2a.5.5 0 0 1-.65-.65l2-5a.5.5 0 0 1 .11-.168l10-10zM11.207 2.5 13.5 4.793 14.793 3.5 12.5 1.207 11.207 2.5zm1.586 3L10.5 3.207 4 9.707V10h.5a.5.5 0 0 1 .5.5v.5h.5a.5.5 0 0 1 .5.5v.5h.293l6.5-6.5zm-9.761 5.175-.106.106-1.528 3.821 3.821-1.528.106-.106A.5.5 0 0 1 5 12.5V12h-.5a.5.5 0 0 1-.5-.5V11h-.5a.5.5 0 0 1-.468-.325z"/>
+                </svg>
+                <span>Unterschrift erstellen</span>
+            }
+        </button>
+
+        @if (_annotations.Count > 0 && !SignatureApplied) {
+            <div class="receiver-action-bar__progress">
+                <div class="progress" style="height:5px; min-width:70px; width:90px;">
+                    <div class="progress-bar @(_checkedAnnotations.Count == _annotations.Count ? "bg-success" : "bg-primary")"
+                         style="width:@(_annotations.Count > 0 ? (_checkedAnnotations.Count * 100 / _annotations.Count) : 0)%"
+                         role="progressbar"></div>
+                </div>
+                <span class="text-muted" style="font-size:0.75rem;">
+                    @_checkedAnnotations.Count&thinsp;/&thinsp;@_annotations.Count
+                    Seite@(AnnotationPages.Count() == 1 ? "" : "n")&nbsp;@string.Join(",", AnnotationPages)
+                </span>
+                @if (_capturedSignature is null) {
+                    <span class="text-muted fst-italic" style="font-size:0.72rem;">Zuerst Unterschrift erstellen</span>
+                } else if (_checkedAnnotations.Count == _annotations.Count) {
+                    <span class="text-success fw-semibold" style="font-size:0.72rem;">&#10003; Wird angewendet&hellip;</span>
+                }
+            </div>
+        }
+
+        @if (!string.IsNullOrWhiteSpace(SignatureValidationMessage)) {
+            <span class="text-danger" style="font-size:0.78rem;">@SignatureValidationMessage</span>
+        }
+        @if (SignatureApplied) {
+            <span class="text-success" style="font-size:0.78rem;">
+                <svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" fill="currentColor" class="me-1" viewBox="0 0 16 16">
+                    <path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z"/>
+                </svg>
+                Unterschrift angewendet
+            </span>
+        }
+
+        <div class="ms-auto d-flex align-items-center gap-2">
+            <button class="btn btn-sm btn-success" disabled="@(!SignatureApplied)" @onclick="ExportSignedPdfAsync">
+                <svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" fill="currentColor" class="me-1" viewBox="0 0 16 16">
+                    <path d="M.5 9.9a.5.5 0 0 1 .5.5v2.5a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-2.5a.5.5 0 0 1 1 0v2.5a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2v-2.5a.5.5 0 0 1 .5-.5z"/>
+                    <path d="M7.646 11.854a.5.5 0 0 0 .708 0l3-3a.5.5 0 0 0-.708-.708L8.5 10.293V1.5a.5.5 0 0 0-1 0v8.793L5.354 8.146a.5.5 0 1 0-.708.708l3 3z"/>
+                </svg>
+                PDF exportieren
+            </button>
+            @if (!string.IsNullOrWhiteSpace(EnvelopeKey)) {
+                <button class="btn btn-sm btn-outline-danger" @onclick="LogoutAsync" disabled="@IsLoggingOut" title="Abmelden">
+                    @if (IsLoggingOut) {
+                        <span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
+                    } else {
+                        <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" fill="currentColor" viewBox="0 0 16 16">
+                            <path fill-rule="evenodd" d="M10 12.5a.5.5 0 0 1-.5.5h-8a.5.5 0 0 1-.5-.5v-9a.5.5 0 0 1 .5-.5h8a.5.5 0 0 1 .5.5v2a.5.5 0 0 0 1 0v-2A1.5 1.5 0 0 0 9.5 2h-8A1.5 1.5 0 0 0 0 3.5v9A1.5 1.5 0 0 0 1.5 14h8a1.5 1.5 0 0 0 1.5-1.5v-2a.5.5 0 0 0-1 0v2z"/>
+                            <path fill-rule="evenodd" d="M15.854 8.354a.5.5 0 0 0 0-.708l-3-3a.5.5 0 0 0-.708.708L14.293 7.5H5.5a.5.5 0 0 0 0 1h8.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3z"/>
+                        </svg>
+                    }
+                </button>
+            }
+        </div>
+    </div>
+</div>
+
+</div>
+
+<DxPopup @bind-Visible="SignaturePopupVisible"
+HeaderText="Unterschrift erfassen"
+Width="620px"
+ShowFooter="true"
+CloseOnEscape="false"
+ShowCloseButton="false"
+CloseOnOutsideClick="false"
+Shown="OnPopupShownAsync">
+    <BodyContentTemplate>
+        <ul class="nav nav-tabs mb-3">
+            <li class="nav-item">
+                <button type="button" class="nav-link @(ActiveSignatureTab == SignatureTabDraw ? "active" : null)" @onclick="() => SetSignatureTabAsync(SignatureTabDraw)">Zeichnen</button>
+            </li>
+            <li class="nav-item">
+                <button type="button" class="nav-link @(ActiveSignatureTab == SignatureTabText ? "active" : null)" @onclick="() => SetSignatureTabAsync(SignatureTabText)">Text</button>
+            </li>
+            <li class="nav-item">
+                <button type="button" class="nav-link @(ActiveSignatureTab == SignatureTabImage ? "active" : null)" @onclick="() => SetSignatureTabAsync(SignatureTabImage)">Bild</button>
+            </li>
+        </ul>
+
+        @if(ActiveSignatureTab == SignatureTabDraw) {
+            <p class="text-muted mb-2">Bitte unterschreiben Sie im folgenden Feld.</p>
+            <canvas id="receiver-signature-pad" width="520" height="160" class="border rounded bg-white w-100" style="max-width: 520px; touch-action: none;"></canvas>
+        } else if(ActiveSignatureTab == SignatureTabText) {
+            <p class="text-muted mb-2">Geben Sie Ihre Unterschrift als Text ein und waehlen Sie eine Schriftart.</p>
+            <div class="row g-2 mb-2">
+                <div class="col-12 col-md-7">
+                    <input class="form-control" placeholder="Ihre Unterschrift" value="@TypedSignatureText" @oninput="OnTypedSignatureChanged" />
+                </div>
+                <div class="col-12 col-md-5">
+                    <select class="form-select" value="@TypedSignatureFont" @onchange="OnTypedSignatureFontChanged">
+                        @foreach(var font in TypedSignatureFonts) {
+                            <option value="@font.Value" style="font-family: @font.Value">@font.Text</option>
+                        }
+                    </select>
+                </div>
+            </div>
+            <canvas id="receiver-typed-signature-pad" width="520" height="160" class="border rounded bg-white w-100" style="max-width: 520px;"></canvas>
+        } else {
+            <p class="text-muted mb-2">Laden Sie ein Bild Ihrer Unterschrift hoch.</p>
+            <input id="receiver-signature-image-input" class="form-control mb-2" type="file" accept="image/png,image/jpeg,image/webp" />
+            <canvas id="receiver-image-signature-pad" width="520" height="160" class="border rounded bg-white w-100" style="max-width: 520px;"></canvas>
+        }
+
+
+        <div class="border-top mt-3 pt-3">
+            <p class="text-muted mb-2">Bitte geben Sie die folgenden Angaben ein. Das Datum wird automatisch hinzugefuegt.</p>
+            <div class="row g-2">
+                <div class="col-12 col-md-6">
+                    <label class="form-label" for="receiver-signer-name">Vor- und Nachname *</label>
+                    <input id="receiver-signer-name" class="form-control" value="@SignerFullName" @oninput="args => SignerFullName = args.Value?.ToString() ?? string.Empty" />
+                </div>
+                <div class="col-12 col-md-6">
+                    <label class="form-label" for="receiver-signer-position">Position</label>
+                    <input id="receiver-signer-position" class="form-control" value="@SignerPosition" @oninput="args => SignerPosition = args.Value?.ToString() ?? string.Empty" />
+                </div>
+                <div class="col-12 col-md-6">
+                    <label class="form-label" for="receiver-signature-place">Ort *</label>
+                    <input id="receiver-signature-place" class="form-control" value="@SignaturePlace" @oninput="args => SignaturePlace = args.Value?.ToString() ?? string.Empty" />
+                </div>
+            </div>
+        </div>
+
+        @if(!string.IsNullOrWhiteSpace(PopupValidationMessage)) {
+            <div class="text-danger mt-2">@PopupValidationMessage</div>
+        }
+    </BodyContentTemplate>
+    <FooterContentTemplate>
+        <div class="d-flex gap-2 flex-wrap justify-content-end w-100">
+            <button class="btn btn-outline-secondary" @onclick="RenewSignatureAsync">Unterschrift erneuern</button>
+            <button class="btn btn-primary" @onclick="SaveSignatureAsync">Speichern</button>
+        </div>
+    </FooterContentTemplate>
+</DxPopup>
+
+<div class="receiver-viewer-wrapper">
+@if(Report is not null) {
+    <DxReportViewer @key="ViewerKey" @ref="reportViewer" Report="Report" RootCssClasses="w-100 h-100" Zoom="1.3" />
+}
+</div>
+
+</div>
+
+@code {
+
+    const string SignatureTabDraw = "draw";
+    const string SignatureTabText = "text";
+    const string SignatureTabImage = "image";
+    const string DrawCanvasId = "receiver-signature-pad";
+    const string TypedCanvasId = "receiver-typed-signature-pad";
+    const string ImageInputId = "receiver-signature-image-input";
+    const string ImageCanvasId = "receiver-image-signature-pad";
+
+    readonly (string Text, string Value)[] TypedSignatureFonts = {
+    ("Brush Script", "'Brush Script MT', cursive"),
+    ("Segoe Script", "'Segoe Script', cursive"),
+    ("Lucida Handwriting", "'Lucida Handwriting', cursive"),
+    ("Comic Sans", "'Comic Sans MS', cursive"),
+    ("Cursive", "cursive")
+};
+
+    [Parameter] public string EnvelopeKey { get; set; } = string.Empty;
+
+    DxReportViewer? reportViewer;
+    XtraReport? Report;
+    bool SignatureApplied;
+    bool SignaturePopupVisible;
+    string? SignatureValidationMessage;
+    string? PopupValidationMessage;
+    string ActiveSignatureTab = SignatureTabDraw;
+    string TypedSignatureText = string.Empty;
+    string TypedSignatureFont = "'Brush Script MT', cursive";
+    string SignerFullName = string.Empty;
+    string SignerPosition = string.Empty;
+    string SignaturePlace = string.Empty;
+    int ViewerKey;
+    bool IsLoggingOut;
+
+    IReadOnlyList<AnnotationDto> _annotations = [];
+    IEnumerable<int> AnnotationPages => _annotations.Select(a => a.Page).Distinct().OrderBy(p => p);
+    EnvelopeReceiverDto? _envelopeReceiver;
+    record SignatureCapture(string DataUrl, string FullName, string Position, string Place);
+    SignatureCapture? _capturedSignature;
+    byte[]? _basePdfBytes;
+    // annotation IDs the user has checked via overlay checkboxes
+    readonly HashSet<long> _checkedAnnotations = [];
+    DotNetObjectReference<ReportViewer>? _dotNetRef;
+    int _lastOverlayViewerKey = -1;
+
+    async Task LogoutAsync() {
+        if (string.IsNullOrWhiteSpace(EnvelopeKey) || IsLoggingOut) return;
+        IsLoggingOut = true;
+        await InvokeAsync(StateHasChanged);
+        await AuthService.LogoutEnvelopeReceiverAsync(EnvelopeKey);
+        Navigation.NavigateTo($"/login/{Uri.EscapeDataString(EnvelopeKey)}", forceLoad: true);
+    }
+
+    protected override async Task OnInitializedAsync() {
+
+        // ? REDIRECT: /receiver/{key} -> /envelope/{key} (NEW PDF.js viewer)
+        if (!string.IsNullOrWhiteSpace(EnvelopeKey)) {
+            Navigation.NavigateTo($"/envelope/{Uri.EscapeDataString(EnvelopeKey)}", forceLoad: false);
+            return;
+        }
+
+        if (!string.IsNullOrWhiteSpace(EnvelopeKey)) {
+            var hasAccess = await AuthService.CheckEnvelopeAccessAsync(EnvelopeKey);
+            if (!hasAccess) {
+                Navigation.NavigateTo($"/login/{Uri.EscapeDataString(EnvelopeKey)}");
+                return;
+            }
+            else
+            {
+                ActiveSignatureTab = SignatureTabDraw;
+                SignaturePopupVisible = true;
+                SignatureValidationMessage = null;
+                PopupValidationMessage = null;
+            }
+        }
+
+        _annotations = await AnnotationService.GetAnnotationsAsync(EnvelopeKey ?? "fake");
+        _envelopeReceiver = await EnvelopeReceiverService.GetAsync(EnvelopeKey ?? "fake");
+
+        if (!AppOptions.Value.ForceToUseFakeDocument && !string.IsNullOrWhiteSpace(EnvelopeKey)) {
+            var (pdfBytes, _) = await DocumentService.GetDocumentAsync(EnvelopeKey);
+            if (pdfBytes is { Length: > 0 })
+                _basePdfBytes = pdfBytes;
+        }
+
+        var initialReport = BuildFreshBaseReport();
+        Report = initialReport;
+    }
+
+    protected override async Task OnAfterRenderAsync(bool firstRender) {
+        if (firstRender)
+            _dotNetRef = DotNetObjectReference.Create(this);
+
+
+        if (Report is not null && _annotations.Count > 0
+            && _capturedSignature is not null && !SignatureApplied
+            && _lastOverlayViewerKey != ViewerKey) {
+            _lastOverlayViewerKey = ViewerKey;
+            await JSRuntime.InvokeVoidAsync(
+                "receiverSignature.installAnnotationCheckboxes",
+                _annotations, _checkedAnnotations.ToArray(), _dotNetRef);
+        }
+    }
+
+    [JSInvokable]
+    public async Task OnAnnotationToggled(long annotationId, bool isChecked) {
+        if (isChecked)
+            _checkedAnnotations.Add(annotationId);
+        else
+            _checkedAnnotations.Remove(annotationId);
+        await InvokeAsync(StateHasChanged);
+
+        if (_capturedSignature is not null
+            && !SignatureApplied
+            && _annotations.Count > 0
+            && _checkedAnnotations.Count == _annotations.Count) {
+            // K?sa bekleme: kullan?c? son tick'in görsel feedback'ini görsün
+            await Task.Delay(400);
+            await SubmitSignaturesAsync();
+        }
+    }
+
+    void OpenSignaturePopupAsync() {
+        ActiveSignatureTab = SignatureTabDraw;
+        SignaturePopupVisible = true;
+        SignatureValidationMessage = null;
+        PopupValidationMessage = null;
+    }
+
+    async Task OnPopupShownAsync() {
+        await InitializeActiveSignatureTabAsync();
+    }
+
+    async Task SetSignatureTabAsync(string tab) {
+        ActiveSignatureTab = tab;
+        PopupValidationMessage = null;
+        await InvokeAsync(StateHasChanged);
+        await Task.Delay(50);
+        await InitializeActiveSignatureTabAsync();
+    }
+
+    async Task InitializeActiveSignatureTabAsync() {
+        if(ActiveSignatureTab == SignatureTabDraw) {
+            await JSRuntime.InvokeVoidAsync("receiverSignature.initialize", DrawCanvasId);
+        } else if(ActiveSignatureTab == SignatureTabText) {
+            await JSRuntime.InvokeVoidAsync("receiverSignature.initializeTyped", TypedCanvasId);
+            await RenderTypedSignatureAsync();
+        } else {
+            await JSRuntime.InvokeVoidAsync("receiverSignature.initializeImage", ImageInputId, ImageCanvasId);
+        }
+    }
+
+    async Task RenewSignatureAsync() {
+        PopupValidationMessage = null;
+
+        if(ActiveSignatureTab == SignatureTabDraw) {
+            await JSRuntime.InvokeVoidAsync("receiverSignature.clear", DrawCanvasId);
+        } else if(ActiveSignatureTab == SignatureTabText) {
+            TypedSignatureText = string.Empty;
+            await JSRuntime.InvokeVoidAsync("receiverSignature.clearTyped", TypedCanvasId);
+        } else {
+            await JSRuntime.InvokeVoidAsync("receiverSignature.clearImage", ImageInputId, ImageCanvasId);
+        }
+    }
+
+    void CloseSignaturePopup() {
+        PopupValidationMessage = null;
+        SignaturePopupVisible = false;
+    }
+
+    async Task OnTypedSignatureChanged(Microsoft.AspNetCore.Components.ChangeEventArgs args) {
+        TypedSignatureText = args.Value?.ToString() ?? string.Empty;
+        await RenderTypedSignatureAsync();
+    }
+
+    async Task OnTypedSignatureFontChanged(Microsoft.AspNetCore.Components.ChangeEventArgs args) {
+        TypedSignatureFont = args.Value?.ToString() ?? TypedSignatureFont;
+        await RenderTypedSignatureAsync();
+    }
+
+    async Task RenderTypedSignatureAsync() {
+        await JSRuntime.InvokeVoidAsync("receiverSignature.renderTypedSignature", TypedCanvasId, TypedSignatureText, TypedSignatureFont);
+    }
+
+    async Task SaveSignatureAsync() {
+        if (string.IsNullOrWhiteSpace(SignerFullName)) {
+            PopupValidationMessage = "Bitte geben Sie Vor- und Nachname ein.";
+            return;
+        }
+        if (string.IsNullOrWhiteSpace(SignaturePlace)) {
+            PopupValidationMessage = "Bitte geben Sie den Ort ein.";
+            return;
+        }
+        var signatureDataUrl = await GetActiveSignatureDataUrlAsync();
+        if (string.IsNullOrWhiteSpace(signatureDataUrl)) {
+            PopupValidationMessage = "Die Unterschrift ist fuer den PDF-Export erforderlich.";
+            return;
+        }
+
+        PopupValidationMessage = null;
+        SignatureValidationMessage = null;
+        _capturedSignature = new(signatureDataUrl, SignerFullName.Trim(), SignerPosition.Trim(), SignaturePlace.Trim());
+
+        // If no annotations, apply immediately (no checkbox step needed)
+        if (_annotations.Count == 0) {
+            var freshReport = BuildFreshBaseReport();
+            AddSignature(freshReport, _capturedSignature.DataUrl, _capturedSignature.FullName, _capturedSignature.Position, _capturedSignature.Place);
+            Report = freshReport;
+            SignatureApplied = true;
+            SignaturePopupVisible = false;
+            ViewerKey++;
+            return;
+        }
+
+        // Close popup; checkboxes will appear on the PDF via OnAfterRenderAsync
+        SignaturePopupVisible = false;
+        _lastOverlayViewerKey = -1; // force overlay reinstall
+        await InvokeAsync(StateHasChanged);
+    }
+
+    async Task SubmitSignaturesAsync() {
+        if (_checkedAnnotations.Count == 0) {
+            SignatureValidationMessage = "Bitte markieren Sie mindestens ein Unterschriftsfeld im Dokument.";
+            return;
+        }
+        if (_checkedAnnotations.Count < _annotations.Count) {
+            SignatureValidationMessage = $"Bitte markieren Sie alle {_annotations.Count} Unterschriftsfelder. Noch {_annotations.Count - _checkedAnnotations.Count} offen.";
+            return;
+        }
+
+        SignatureValidationMessage = null;
+        var freshReport = BuildFreshBaseReport();
+        foreach (var ann in _annotations)
+            AddSignatureAtAnnotation(freshReport, ann, _capturedSignature!.DataUrl, _capturedSignature.FullName, _capturedSignature.Position, _capturedSignature.Place);
+
+        Report = freshReport;
+        SignatureApplied = true;
+        ViewerKey++;
+        await InvokeAsync(StateHasChanged);
+    }
+
+    async Task<string?> GetActiveSignatureDataUrlAsync() {
+        if(ActiveSignatureTab == SignatureTabDraw)
+            return await JSRuntime.InvokeAsync<string?>("receiverSignature.getDataUrl", DrawCanvasId);
+
+        if(ActiveSignatureTab == SignatureTabText) {
+            await RenderTypedSignatureAsync();
+            return await JSRuntime.InvokeAsync<string?>("receiverSignature.getTypedDataUrl", TypedCanvasId);
+        }
+
+        return await JSRuntime.InvokeAsync<string?>("receiverSignature.getImageDataUrl", ImageCanvasId);
+    }
+
+    async Task ExportSignedPdfAsync() {
+        if(!SignatureApplied || Report is null) {
+            SignatureValidationMessage = "Bitte fuegen Sie die Unterschrift zuerst zum Bericht hinzu.";
+            return;
+        }
+
+        try {
+            SignatureValidationMessage = null;
+            await reportViewer!.ExportToAsync(ExportFormat.Pdf);
+        } catch(Exception) {
+            SignatureValidationMessage = "Das signierte PDF konnte nicht exportiert werden. Bitte laden Sie die Seite neu und versuchen Sie es erneut.";
+        }
+    }
+
+    XtraReport BuildFreshBaseReport() {
+        if (_basePdfBytes is { Length: > 0 }) {
+            var report = new XtraReport();
+            var detail = new DevExpress.XtraReports.UI.DetailBand();
+            report.Bands.Add(detail);
+            detail.Controls.Add(new DevExpress.XtraReports.UI.XRPdfContent { Source = _basePdfBytes, GenerateOwnPages = true });
+            return report;
+        }
+        return CreateReportInstance();
+    }
+
+    static void AddAnnotationPlaceholders(XtraReport report, IReadOnlyList<AnnotationDto> annotations) {
+        var bottomMargin = report.Bands.OfType<BottomMarginBand>().FirstOrDefault();
+        if (bottomMargin is null) {
+            bottomMargin = new BottomMarginBand();
+            report.Bands.Add(bottomMargin);
+        }
+
+        const float sigWidth      = 230F;
+        const float sigHeight     = 154F;
+        const float bottomPad     = 6F;
+        const float defaultTopPad = 8F;
+        const float maxBandHeight = 210F;
+
+        float requiredHeight = defaultTopPad + sigHeight + bottomPad;
+        bottomMargin.HeightF = Math.Min(maxBandHeight, Math.Max(bottomMargin.HeightF, requiredHeight));
+        float topPad = Math.Max(0F, bottomMargin.HeightF - bottomPad - sigHeight);
+
+        foreach (var ann in annotations) {
+            float sigX  = (float)(ann.X);
+            var annotId = ann.Id.ToString();
+
+            var placeholder = new XRLabel {
+                Name          = $"receiverSignaturePlaceholder_{annotId}",
+                Text          = "\u270e Bitte unterschreiben",
+                BoundsF       = new RectangleF(sigX, topPad, sigWidth, sigHeight),
+                Borders       = BorderSide.All,
+                BorderColor   = System.Drawing.Color.FromArgb(230, 81, 0),
+                BackColor     = System.Drawing.Color.FromArgb(30, 255, 236, 153),
+                Font          = new DXFont("Open Sans", 10F, DXFontStyle.Regular),
+                ForeColor     = System.Drawing.Color.FromArgb(94, 38, 0),
+                TextAlignment = TextAlignment.MiddleCenter
+            };
+
+            bottomMargin.Controls.Add(placeholder);
+        }
+    }
+
+    XtraReport CreateReportInstance() {
+        return ReportStorage.TryGetReport("LargeDatasetReport", out var savedReport)
+            ? savedReport
+            : PredefinedReports.ReportsFactory.GetReport("LargeDatasetReport");
+    }
+
+    static void AddSignature(XtraReport report, string signatureDataUrl, string signerFullName, string signerPosition, string signaturePlace) {
+        var imageBytes = Convert.FromBase64String(signatureDataUrl[(signatureDataUrl.IndexOf(',') + 1)..]);
+        using var imageStream = new MemoryStream(imageBytes);
+        var imageSource = new ImageSource(DXImage.FromStream(imageStream));
+        var bottomMargin = report.Bands.OfType<BottomMarginBand>().FirstOrDefault();
+
+        if(bottomMargin is null) {
+            bottomMargin = new BottomMarginBand();
+            report.Bands.Add(bottomMargin);
+        }
+
+        RemoveExistingSignature(bottomMargin);
+
+        // Layout constants
+        const float sigX         = 390F;
+        const float sigWidth     = 230F;
+        const float sigImgHeight = 70F;
+        const float infoHeight   = 65F;  // up to 4 lines at 8pt
+        const float innerGap     = 5F;
+        const float bottomPad    = 6F;
+        const float defaultTopPad = 8F;
+        const float maxBandHeight = 210F;
+
+        float requiredHeight = defaultTopPad + sigImgHeight + innerGap + infoHeight + bottomPad;
+
+        // Grow band if needed, but cap at maxBandHeight to avoid overlapping page content
+        bottomMargin.HeightF = Math.Min(maxBandHeight, Math.Max(bottomMargin.HeightF, requiredHeight));
+
+        // If band is tighter than required, compress top padding so content still fits
+        float topPad = Math.Max(0F, bottomMargin.HeightF - bottomPad - infoHeight - innerGap - sigImgHeight);
+
+        float imageY = topPad;
+        float labelY = imageY + sigImgHeight + innerGap;
+
+        var signatureInformation = string.IsNullOrWhiteSpace(signerPosition)
+            ? $"{signerFullName}\n{signaturePlace}, {DateTime.Now:d}"
+            : $"{signerFullName}\n{signerPosition}\n{signaturePlace}, {DateTime.Now:d}";
+
+        var signature = new XRPictureBox {
+            Name = "receiverSignatureImage",
+            ImageSource = imageSource,
+            BoundsF = new RectangleF(sigX, imageY, sigWidth, sigImgHeight),
+            Sizing = ImageSizeMode.ZoomImage,
+            Borders = BorderSide.Bottom,
+            BorderColor = System.Drawing.Color.FromArgb(73, 80, 87)
+        };
+
+        var signatureLabel = new XRLabel {
+            Name = "receiverSignatureLabel",
+            Text = signatureInformation,
+            Multiline = true,
+            BoundsF = new RectangleF(sigX, labelY, sigWidth, infoHeight),
+            Font = new DXFont("Open Sans", 8F, DXFontStyle.Regular),
+            ForeColor = System.Drawing.Color.FromArgb(73, 80, 87),
+            TextAlignment = TextAlignment.TopLeft
+        };
+
+        bottomMargin.Controls.AddRange(new XRControl[] { signature, signatureLabel });
+    }
+
+    static void RemoveExistingSignature(BottomMarginBand bottomMargin) {
+        var controls = bottomMargin.Controls
+            .Cast<XRControl>()
+            .Where(control => control.Name is "receiverSignatureLabel" or "receiverSignatureImage")
+            .ToArray();
+
+        foreach(var control in controls)
+            bottomMargin.Controls.Remove(control);
+    }
+
+    static void AddSignatureAtAnnotation(XtraReport report, AnnotationDto? annotation, string signatureDataUrl, string signerFullName, string signerPosition, string signaturePlace) {
+        var imageBytes = Convert.FromBase64String(signatureDataUrl[(signatureDataUrl.IndexOf(',') + 1)..]);
+        using var imageStream = new MemoryStream(imageBytes);
+        var imageSource = new ImageSource(DXImage.FromStream(imageStream));
+
+        var detail = report.Bands.OfType<DevExpress.XtraReports.UI.DetailBand>().FirstOrDefault();
+        if (detail is null) return;
+
+        var annotId = annotation?.Id.ToString() ?? "0";
+        RemoveExistingSignatureById(detail, annotId);
+
+        const float sigWidth     = 230F;
+        const float sigImgHeight = 70F;
+        const float infoHeight   = 48.75F;
+        const float innerGap     = 5F;
+
+        float sigX   = (float)(annotation?.X ?? 390.0);
+        float imageY = (float)(annotation?.Y ?? 900.0);
+        float labelY = imageY + sigImgHeight + innerGap;
+        int targetPage = annotation?.Page ?? 1;
+
+        var signatureInformation = string.IsNullOrWhiteSpace(signerPosition)
+            ? $"{signerFullName}\n{signaturePlace}, {DateTime.Now:d}"
+            : $"{signerFullName}\n{signerPosition}\n{signaturePlace}, {DateTime.Now:d}";
+
+        var signature = new XRPictureBox {
+            Name        = $"receiverSignatureImage_{annotId}",
+            ImageSource = imageSource,
+            BoundsF     = new RectangleF(sigX, imageY, sigWidth, sigImgHeight),
+            Sizing      = ImageSizeMode.ZoomImage,
+            Borders     = BorderSide.Bottom,
+            BorderColor = System.Drawing.Color.FromArgb(73, 80, 87),
+            BackColor = Color.FromArgb(219, 219, 219)
+        };
+
+        var signatureLabel = new XRLabel {
+            Name          = $"receiverSignatureLabel_{annotId}",
+            Text          = signatureInformation,
+            Multiline     = true,
+            BoundsF       = new RectangleF(sigX, labelY - 5, sigWidth, infoHeight),
+            Font          = new DXFont("Open Sans", 8F, DXFontStyle.Regular),
+            ForeColor     = System.Drawing.Color.FromArgb(73, 80, 87),
+            TextAlignment = TextAlignment.TopCenter,
+            BackColor = Color.FromArgb(219, 219, 219)
+        };
+
+        // Show each control only on the target page using an independent print counter
+        int sigPrintCount = 0;
+        signature.BeforePrint += (_, e) => {
+            sigPrintCount++;
+            e.Cancel = sigPrintCount != targetPage;
+        };
+
+        int lblPrintCount = 0;
+        signatureLabel.BeforePrint += (_, e) => {
+            lblPrintCount++;
+            e.Cancel = lblPrintCount != targetPage;
+        };
+
+        detail.Controls.AddRange(new XRControl[] { signature, signatureLabel });
+    }
+
+    static void RemoveExistingSignatureById(DevExpress.XtraReports.UI.DetailBand detail, string annotId) {
+        var controls = detail.Controls
+            .Cast<XRControl>()
+            .Where(c => c.Name == $"receiverSignatureImage_{annotId}" || c.Name == $"receiverSignatureLabel_{annotId}")
+            .ToArray();
+        foreach (var c in controls)
+            detail.Controls.Remove(c);
+    }
+
+    public void Dispose() {
+        _dotNetRef?.Dispose();
+    }
+}
+

EnvelopeGenerator.ReceiverUI/Pages/TestViewer.razor

@@ -0,0 +1,81 @@
+@page "/test"
+@using System.Drawing
+@using DevExpress.Drawing
+@using DevExpress.Utils
+@using DevExpress.XtraPrinting
+@using DevExpress.XtraPrinting.Drawing
+@using XtraReport = DevExpress.XtraReports.UI.XtraReport
+@using BottomMarginBand = DevExpress.XtraReports.UI.BottomMarginBand
+@using XRLabel = DevExpress.XtraReports.UI.XRLabel
+@using XRPictureBox = DevExpress.XtraReports.UI.XRPictureBox
+@using XRControl = DevExpress.XtraReports.UI.XRControl
+@using ImageSizeMode = DevExpress.XtraPrinting.ImageSizeMode
+@using EnvelopeGenerator.ReceiverUI.Services
+@using DevExpress.Blazor.Reporting
+@inject IJSRuntime JSRuntime
+@inject InMemoryReportStorageWebExtension ReportStorage
+@inject EnvelopeGenerator.ReceiverUI.Services.DocumentService DocumentService
+@inject Microsoft.Extensions.Configuration.IConfiguration Configuration
+@inject HttpClient Http
+@using System;
+
+<link href="_content/DevExpress.Blazor.Themes/blazing-berry.bs5.min.css" rel="stylesheet" />
+<link href="_content/DevExpress.Blazor.Reporting.Viewer/css/dx-blazor-reporting-components.bs5.css" rel="stylesheet" />
+
+<div class="receiver-page-layout">
+
+<div class="receiver-viewer-wrapper">
+        <embed class="w-100 h-50" src="/docs/Document.pdf" type="application/pdf" />
+        @if (PdfBytes is { Length: > 0 }) {
+            <DxPdfViewer DocumentContent="PdfBytes" CssClass="w-100 h-50" />
+        }
+        else{
+            <div>Not found</div>
+        }
+</div>
+
+</div>
+
+@code {
+
+    const string SignatureTabDraw = "draw";
+    const string SignatureTabText = "text";
+    const string SignatureTabImage = "image";
+    const string DrawCanvasId = "receiver-signature-pad";
+    const string TypedCanvasId = "receiver-typed-signature-pad";
+    const string ImageInputId = "receiver-signature-image-input";
+    const string ImageCanvasId = "receiver-image-signature-pad";
+
+    readonly (string Text, string Value)[] TypedSignatureFonts = {
+        ("Brush Script", "'Brush Script MT', cursive"),
+        ("Segoe Script", "'Segoe Script', cursive"),
+        ("Lucida Handwriting", "'Lucida Handwriting', cursive"),
+        ("Comic Sans", "'Comic Sans MS', cursive"),
+        ("Cursive", "cursive")
+    };
+
+    [Parameter] public string? EnvelopeKey { get; set; }
+
+    DxReportViewer? reportViewer;
+    XtraReport? Report;
+    string PdfViewerUrl = string.Empty;
+    byte[]? PdfBytes;
+    byte[]? SignedPdfBytes;
+    bool SignatureApplied;
+    bool SignaturePopupVisible;
+    string? PopupValidationMessage;
+    string ActiveSignatureTab = SignatureTabDraw;
+    string TypedSignatureText = string.Empty;
+    string TypedSignatureFont = "'Brush Script MT', cursive";
+    string SignerFullName = string.Empty;
+    string SignerPosition = string.Empty;
+    string SignaturePlace = string.Empty;
+    int ViewerKey;
+
+    protected override async Task OnInitializedAsync() {
+        PdfBytes = await Http.GetByteArrayAsync("/docs/Document.pdf");
+    }
+
+
+}
+

EnvelopeGenerator.ReceiverUI/PredefinedReports/Report.resx

@@ -0,0 +1,123 @@
+<?xml version="1.0" encoding="utf-8"?>
+<root>
+  <!-- 
+    Microsoft ResX Schema 
+    
+    Version 2.0
+    
+    The primary goals of this format is to allow a simple XML format 
+    that is mostly human readable. The generation and parsing of the 
+    various data types are done through the TypeConverter classes 
+    associated with the data types.
+    
+    Example:
+    
+    ... ado.net/XML headers & schema ...
+    <resheader name="resmimetype">text/microsoft-resx</resheader>
+    <resheader name="version">2.0</resheader>
+    <resheader name="reader">System.Resources.ResXResourceReader, System.Windows.Forms, ...</resheader>
+    <resheader name="writer">System.Resources.ResXResourceWriter, System.Windows.Forms, ...</resheader>
+    <data name="Name1"><value>this is my long string</value><comment>this is a comment</comment></data>
+    <data name="Color1" type="System.Drawing.Color, System.Drawing">Blue</data>
+    <data name="Bitmap1" mimetype="application/x-microsoft.net.object.binary.base64">
+        <value>[base64 mime encoded serialized .NET Framework object]</value>
+    </data>
+    <data name="Icon1" type="System.Drawing.Icon, System.Drawing" mimetype="application/x-microsoft.net.object.bytearray.base64">
+        <value>[base64 mime encoded string representing a byte array form of the .NET Framework object]</value>
+        <comment>This is a comment</comment>
+    </data>
+                
+    There are any number of "resheader" rows that contain simple 
+    name/value pairs.
+    
+    Each data row contains a name, and value. The row also contains a 
+    type or mimetype. Type corresponds to a .NET class that support 
+    text/value conversion through the TypeConverter architecture. 
+    Classes that don't support this are serialized and stored with the 
+    mimetype set.
+    
+    The mimetype is used for serialized objects, and tells the 
+    ResXResourceReader how to depersist the object. This is currently not 
+    extensible. For a given mimetype the value must be set accordingly:
+    
+    Note - application/x-microsoft.net.object.binary.base64 is the format 
+    that the ResXResourceWriter will generate, however the reader can 
+    read any of the formats listed below.
+    
+    mimetype: application/x-microsoft.net.object.binary.base64
+    value   : The object must be serialized with 
+            : System.Runtime.Serialization.Formatters.Binary.BinaryFormatter
+            : and then encoded with base64 encoding.
+    
+    mimetype: application/x-microsoft.net.object.soap.base64
+    value   : The object must be serialized with 
+            : System.Runtime.Serialization.Formatters.Soap.SoapFormatter
+            : and then encoded with base64 encoding.
+
+    mimetype: application/x-microsoft.net.object.bytearray.base64
+    value   : The object must be serialized into a byte array 
+            : using a System.ComponentModel.TypeConverter
+            : and then encoded with base64 encoding.
+    -->
+  <xsd:schema id="root" xmlns="" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:msdata="urn:schemas-microsoft-com:xml-msdata">
+    <xsd:import namespace="http://www.w3.org/XML/1998/namespace" />
+    <xsd:element name="root" msdata:IsDataSet="true">
+      <xsd:complexType>
+        <xsd:choice maxOccurs="unbounded">
+          <xsd:element name="metadata">
+            <xsd:complexType>
+              <xsd:sequence>
+                <xsd:element name="value" type="xsd:string" minOccurs="0" />
+              </xsd:sequence>
+              <xsd:attribute name="name" use="required" type="xsd:string" />
+              <xsd:attribute name="type" type="xsd:string" />
+              <xsd:attribute name="mimetype" type="xsd:string" />
+              <xsd:attribute ref="xml:space" />
+            </xsd:complexType>
+          </xsd:element>
+          <xsd:element name="assembly">
+            <xsd:complexType>
+              <xsd:attribute name="alias" type="xsd:string" />
+              <xsd:attribute name="name" type="xsd:string" />
+            </xsd:complexType>
+          </xsd:element>
+          <xsd:element name="data">
+            <xsd:complexType>
+              <xsd:sequence>
+                <xsd:element name="value" type="xsd:string" minOccurs="0" msdata:Ordinal="1" />
+                <xsd:element name="comment" type="xsd:string" minOccurs="0" msdata:Ordinal="2" />
+              </xsd:sequence>
+              <xsd:attribute name="name" type="xsd:string" use="required" msdata:Ordinal="1" />
+              <xsd:attribute name="type" type="xsd:string" msdata:Ordinal="3" />
+              <xsd:attribute name="mimetype" type="xsd:string" msdata:Ordinal="4" />
+              <xsd:attribute ref="xml:space" />
+            </xsd:complexType>
+          </xsd:element>
+          <xsd:element name="resheader">
+            <xsd:complexType>
+              <xsd:sequence>
+                <xsd:element name="value" type="xsd:string" minOccurs="0" msdata:Ordinal="1" />
+              </xsd:sequence>
+              <xsd:attribute name="name" type="xsd:string" use="required" />
+            </xsd:complexType>
+          </xsd:element>
+        </xsd:choice>
+      </xsd:complexType>
+    </xsd:element>
+  </xsd:schema>
+  <resheader name="resmimetype">
+    <value>text/microsoft-resx</value>
+  </resheader>
+  <resheader name="version">
+    <value>2.0</value>
+  </resheader>
+  <resheader name="reader">
+    <value>System.Resources.ResXResourceReader, System.Windows.Forms, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089</value>
+  </resheader>
+  <resheader name="writer">
+    <value>System.Resources.ResXResourceWriter, System.Windows.Forms, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089</value>
+  </resheader>
+  <metadata name="objectDataSource1.TrayLocation" type="System.Drawing.Point, System.Drawing, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a">
+    <value>17, 17</value>
+  </metadata>
+</root>

EnvelopeGenerator.ReceiverUI/PredefinedReports/ReportsFactory.cs

@@ -0,0 +1,14 @@
+using DevExpress.XtraReports.UI;
+
+namespace EnvelopeGenerator.ReceiverUI.PredefinedReports {
+    public static class ReportsFactory
+    {
+        public static readonly Dictionary<string, Func<XtraReport>> Reports = new() {
+            ["LargeDatasetReport"] = () => new PredefinedReports.Report()
+        };
+
+        public static XtraReport GetReport(string reportName) {
+            return Reports[reportName]();
+        }
+    }
+}

EnvelopeGenerator.ReceiverUI/Program.cs

@@ -0,0 +1,44 @@
+using Microsoft.AspNetCore.Components.WebAssembly.Hosting;
+using Microsoft.AspNetCore.Components.Web;
+using EnvelopeGenerator.ReceiverUI;
+using DevExpress.DataAccess.Web;
+using EnvelopeGenerator.ReceiverUI.Services;
+using EnvelopeGenerator.ReceiverUI.Options;
+using DevExpress.XtraReports.Services;
+using DevExpress.Blazor.Reporting;
+using DevExpress.XtraReports.Web.Extensions;
+
+var builder = WebAssemblyHostBuilder.CreateDefault(args);
+builder.RootComponents.Add<App>("#app");
+builder.RootComponents.Add<HeadOutlet>("head::after");
+builder.Services.AddScoped(sp => new HttpClient { BaseAddress = new Uri(builder.HostEnvironment.BaseAddress) });
+builder.Services.Configure<ApiOptions>(opts =>
+builder.Configuration.GetSection(ApiOptions.SectionName).Bind(opts));
+builder.Services.Configure<PdfViewerOptions>(opts =>
+builder.Configuration.GetSection(PdfViewerOptions.SectionName).Bind(opts));
+builder.Services.AddScoped<EnvelopeGenerator.ReceiverUI.Services.DocumentService>();
+builder.Services.AddScoped<EnvelopeGenerator.ReceiverUI.Services.AuthService>();
+builder.Services.AddScoped<EnvelopeGenerator.ReceiverUI.Services.AnnotationService>();
+builder.Services.AddScoped<EnvelopeGenerator.ReceiverUI.Services.EnvelopeReceiverService>();
+builder.Services.AddScoped<EnvelopeGenerator.ReceiverUI.Services.SignatureService>();
+builder.Services.AddSingleton<EnvelopeGenerator.ReceiverUI.Services.AppVersionService>();
+
+builder.Services.AddDevExpressWebAssemblyBlazorReportViewer();
+builder.Services.AddDevExpressWebAssemblyBlazorPdfViewer();
+
+builder.Services.AddDevExpressBlazorReportingWebAssembly(configure => {
+    configure.UseDevelopmentMode();
+});
+builder.Services.AddScoped<IDataSourceWizardJsonConnectionStorage, CustomDataSourceWizardJsonDataConnectionStorage>();
+builder.Services.AddScoped<IJsonDataConnectionProviderFactory, CustomJsonDataConnectionProviderFactory>();
+builder.Services.AddScoped<IObjectDataSourceWizardTypeProvider, ObjectDataSourceWizardCustomTypeProvider>();
+DevExpress.Utils.DeserializationSettings.RegisterTrustedClass(typeof(EnvelopeGenerator.ReceiverUI.Data.DataItemList));
+DevExpress.Utils.DeserializationSettings.RegisterTrustedClass(typeof(EnvelopeGenerator.ReceiverUI.PredefinedReports.Report));
+builder.Services.AddSingleton<InMemoryReportStorageWebExtension>();
+builder.Services.AddSingleton<ReportStorageWebExtension>(sp => sp.GetRequiredService<InMemoryReportStorageWebExtension>());
+builder.Services.AddScoped<IReportProviderAsync, CustomReportProvider>();
+ReportStorageWebExtension.RegisterExtensionGlobal(new InMemoryReportStorageWebExtension());
+
+var host = builder.Build();
+await FontLoader.LoadFonts(host.Services.GetRequiredService<HttpClient>(), new List<string> { "opensans.ttf" });
+await host.RunAsync();

EnvelopeGenerator.ReceiverUI/Properties/PublishProfiles/IISProfile.pubxml

@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- https://go.microsoft.com/fwlink/?LinkID=208121. -->
+<Project>
+  <PropertyGroup>
+    <WebPublishMethod>Package</WebPublishMethod>
+    <LastUsedBuildConfiguration>Release</LastUsedBuildConfiguration>
+    <LastUsedPlatform>Any CPU</LastUsedPlatform>
+    <SiteUrlToLaunchAfterPublish />
+    <LaunchSiteAfterPublish>true</LaunchSiteAfterPublish>
+    <ExcludeApp_Data>false</ExcludeApp_Data>
+    <ProjectGuid>fb2d306b-1042-4a70-31ed-f991a1599371</ProjectGuid>
+    <DesktopBuildPackageLocation>M:\App&amp;Service\0 DD - Smart UP\signFLOW\ReceiverUI\net8\$(Version)\EnvelopeGenerator.ReceiverUI.zip</DesktopBuildPackageLocation>
+    <PackageAsSingleFile>true</PackageAsSingleFile>
+    <DeployIisAppPath>EnvelopeGenerator.ReceiverUI</DeployIisAppPath>
+    <_TargetId>IISWebDeployPackage</_TargetId>
+  </PropertyGroup>
+</Project>

EnvelopeGenerator.ReceiverUI/Properties/launchSettings.json

@@ -0,0 +1,12 @@
+{
+  "profiles": {
+    "EnvelopeGenerator.ReceiverUI": {
+      "commandName": "Project",
+      "launchBrowser": true,
+      "environmentVariables": {
+        "ASPNETCORE_ENVIRONMENT": "Development"
+      },
+      "applicationUrl": "https://localhost:52936;http://localhost:52937"
+    }
+  }
+}

EnvelopeGenerator.ReceiverUI/Services/AnnotationService.cs

@@ -0,0 +1,33 @@
+using System.Net.Http.Json;
+using System.Text.Json;
+using EnvelopeGenerator.ReceiverUI.Models;
+using EnvelopeGenerator.ReceiverUI.Options;
+using Microsoft.Extensions.Options;
+
+namespace EnvelopeGenerator.ReceiverUI.Services;
+
+/// <summary>
+/// Retrieves annotation positions from the API.
+/// The URL is composed as <c>{BaseUrl}/api/Annotation/{envelopeKey}</c>.
+/// During development, <c>BaseUrl</c> is empty so the request resolves to the
+/// YARP-proxied route on the same origin, which currently serves
+/// <c>fake-data/annotations.json</c>. To switch to real data, update the
+/// YARP route in <c>yarp.json</c> — no code change required.
+/// </summary>
+[Obsolete("Use SignatureService.")]
+public class AnnotationService(HttpClient http, IOptions<ApiOptions> apiOptions)
+{
+    private static readonly JsonSerializerOptions _jsonOptions = new(JsonSerializerDefaults.Web);
+
+    public async Task<IReadOnlyList<AnnotationDto>> GetAnnotationsAsync(string envelopeKey, CancellationToken cancel = default)
+    {
+        var url = $"{apiOptions.Value.BaseUrl}/api/Annotation/{Uri.EscapeDataString(envelopeKey)}";
+        var response = await http.GetAsync(url, cancel);
+
+        if (!response.IsSuccessStatusCode)
+            return [];
+
+        var result = await response.Content.ReadFromJsonAsync<List<AnnotationDto>>(_jsonOptions, cancel);
+        return result ?? [];
+    }
+}

EnvelopeGenerator.ReceiverUI/Services/AppVersionService.cs

@@ -0,0 +1,26 @@
+namespace EnvelopeGenerator.ReceiverUI.Services;
+
+/// <summary>
+/// Provides application version for cache busting static assets.
+/// Version is automatically incremented on each build via AssemblyVersion.
+/// </summary>
+public class AppVersionService
+{
+    /// <summary>
+    /// Current application version (e.g., "1.0.0.0")
+    /// </summary>
+    public string Version { get; }
+
+    public AppVersionService()
+    {
+        // Get version from assembly metadata
+        Version = typeof(AppVersionService).Assembly.GetName().Version?.ToString() ?? "1.0.0.0";
+    }
+
+    /// <summary>
+    /// Generates versioned URL for static assets (cache busting)
+    /// </summary>
+    /// <param name="path">Asset path (e.g., "css/envelope-viewer.css")</param>
+    /// <returns>Versioned URL (e.g., "css/envelope-viewer.css?v=1.0.0.0")</returns>
+    public string GetVersionedUrl(string path) => $"{path}?v={Version}";
+}

EnvelopeGenerator.ReceiverUI/Services/AuthService.cs

@@ -0,0 +1,57 @@
+using System.Net;
+using EnvelopeGenerator.ReceiverUI.Options;
+using Microsoft.Extensions.Options;
+
+namespace EnvelopeGenerator.ReceiverUI.Services;
+
+public enum EnvelopeLoginResult { Success, InvalidCode, NotFound, Error }
+
+public class AuthService(HttpClient http, IOptions<ApiOptions> apiOptions)
+{
+    private readonly ApiOptions _api = apiOptions.Value;
+
+    /// <summary>
+    /// Checks whether the current user holds a valid receiver token for the given envelope key.
+    /// Calls GET /api/auth/check/envelope/{envelopeKey}.
+    /// </summary>
+    public async Task<bool> CheckEnvelopeAccessAsync(string envelopeKey, CancellationToken cancel = default)
+    {
+        var response = await http.GetAsync($"{_api.BaseUrl}/api/auth/check/envelope/{Uri.EscapeDataString(envelopeKey)}", cancel);
+        return response.StatusCode == HttpStatusCode.OK;
+    }
+
+    /// <summary>
+    /// Submits the access code for the given envelope key.
+    /// Calls POST /api/Auth/envelope-receiver/{key} with multipart/form-data.
+    /// On success the API sets an authentication cookie automatically.
+    /// </summary>
+    public async Task<EnvelopeLoginResult> LoginEnvelopeReceiverAsync(string envelopeKey, string accessCode, CancellationToken cancel = default)
+    {
+        var form = new MultipartFormDataContent();
+        form.Add(new StringContent(accessCode), "AccessCode");
+
+        var response = await http.PostAsync(
+            $"{_api.BaseUrl}/api/Auth/envelope-receiver/{Uri.EscapeDataString(envelopeKey)}",
+            form, cancel);
+
+        return response.StatusCode switch
+        {
+            HttpStatusCode.OK => EnvelopeLoginResult.Success,
+            HttpStatusCode.Unauthorized => EnvelopeLoginResult.InvalidCode,
+            HttpStatusCode.NotFound => EnvelopeLoginResult.NotFound,
+            _ => EnvelopeLoginResult.Error
+        };
+    }
+
+    /// <summary>
+    /// Removes the per-envelope receiver cookie for the given envelope key.
+    /// Calls POST /api/auth/logout/envelope/{envelopeKey}.
+    /// </summary>
+    public async Task<bool> LogoutEnvelopeReceiverAsync(string envelopeKey, CancellationToken cancel = default)
+    {
+        var response = await http.PostAsync(
+            $"{_api.BaseUrl}/api/auth/logout/envelope/{Uri.EscapeDataString(envelopeKey)}",
+            null, cancel);
+        return response.IsSuccessStatusCode;
+    }
+}

EnvelopeGenerator.ReceiverUI/Services/CustomDataSourceWizardJsonDataConnectionStorage.cs

@@ -0,0 +1,40 @@
+using DevExpress.DataAccess.Json;
+using DevExpress.DataAccess.Web;
+using DevExpress.DataAccess.Wizard.Services;
+
+namespace EnvelopeGenerator.ReceiverUI.Services
+{
+    public class CustomDataSourceWizardJsonDataConnectionStorage : IDataSourceWizardJsonConnectionStorage
+    {
+        public static JsonDataConnection GetDefaultConnection() {
+            var uriJsonSource = new UriJsonSource() {
+                Uri = new Uri(@"https://raw.githubusercontent.com/DevExpress-Examples/DataSources/master/JSON/customers.json"),
+            };
+            return new JsonDataConnection(uriJsonSource) { StoreConnectionNameOnly = true, Name = "NWindProductsJson" };
+        }
+        public static List<JsonDataConnection> GetConnections() {
+            var connections = new List<JsonDataConnection> {
+                GetDefaultConnection()
+            };
+            return connections;
+        }
+
+        bool IJsonConnectionStorageService.CanSaveConnection => false;
+        bool IJsonConnectionStorageService.ContainsConnection(string connectionName) {
+            return GetConnections().Any(x => x.Name == connectionName);
+        }
+
+        IEnumerable<JsonDataConnection> IJsonConnectionStorageService.GetConnections() {
+            return GetConnections();
+        }
+
+        JsonDataConnection IJsonDataConnectionProviderService.GetJsonDataConnection(string name) {
+            var connection = GetConnections().FirstOrDefault(x => x.Name == name);
+            if(connection == null)
+                throw new InvalidOperationException();
+            return connection;
+        }
+
+        void IJsonConnectionStorageService.SaveConnection(string connectionName, JsonDataConnection connection, bool saveCredentials) { }
+    }
+}

EnvelopeGenerator.ReceiverUI/Services/CustomJsonDataConnectionProviderFactory.cs

@@ -0,0 +1,24 @@
+using DevExpress.DataAccess.Json;
+using DevExpress.DataAccess.Web;
+namespace EnvelopeGenerator.ReceiverUI.Services
+{
+    public class CustomJsonDataConnectionProviderFactory : IJsonDataConnectionProviderFactory {
+        public IJsonDataConnectionProviderService Create() {
+            return new WebDocumentViewerJsonDataConnectionProvider(CustomDataSourceWizardJsonDataConnectionStorage.GetConnections());
+        }
+    }
+
+    public class WebDocumentViewerJsonDataConnectionProvider : IJsonDataConnectionProviderService
+    {
+        readonly List<JsonDataConnection> jsonDataConnections;
+        public WebDocumentViewerJsonDataConnectionProvider(List<JsonDataConnection> jsonDataConnections) {
+            this.jsonDataConnections = jsonDataConnections;
+        }
+        public JsonDataConnection GetJsonDataConnection(string name) {
+            var connection = jsonDataConnections.FirstOrDefault(x => x.Name == name);
+            if(connection == null)
+                throw new InvalidOperationException();
+            return connection;
+        }
+    }
+}

EnvelopeGenerator.ReceiverUI/Services/CustomReportProvider.cs

@@ -0,0 +1,21 @@
+using DevExpress.XtraReports.UI;
+using DevExpress.XtraReports.Services;
+using EnvelopeGenerator.ReceiverUI.PredefinedReports;
+
+namespace EnvelopeGenerator.ReceiverUI.Services
+{
+    public class CustomReportProvider : IReportProviderAsync {
+        private readonly InMemoryReportStorageWebExtension reportStorage;
+
+        public CustomReportProvider(InMemoryReportStorageWebExtension reportStorage) {
+            this.reportStorage = reportStorage;
+        }
+
+        public Task<XtraReport> GetReportAsync(string id, ReportProviderContext context) {
+            if(reportStorage.TryGetReport(id, out var savedReport))
+                return Task.FromResult(savedReport);
+
+            return Task.FromResult(ReportsFactory.GetReport(id));
+        }
+    }
+}

EnvelopeGenerator.ReceiverUI/Services/DocumentService.cs

@@ -0,0 +1,27 @@
+using System.Net;
+using System.Net.Http;
+using Microsoft.Extensions.Options;
+using EnvelopeGenerator.ReceiverUI.Options;
+
+namespace EnvelopeGenerator.ReceiverUI.Services;
+
+public class DocumentService(HttpClient http, IOptions<ApiOptions> apiOptions)
+{
+    private readonly ApiOptions _api = apiOptions.Value;
+
+    /// <summary>
+    /// Fetches the PDF bytes for the given envelope key from the API.
+    /// Returns null bytes with the HTTP status code on failure.
+    /// </summary>
+    public async Task<(byte[]? Bytes, HttpStatusCode StatusCode)> GetDocumentAsync(string envelopeKey, CancellationToken cancel = default)
+    {
+        var response = await http.GetAsync($"{_api.BaseUrl}/api/Document/{Uri.EscapeDataString(envelopeKey)}", cancel);
+
+        if (!response.IsSuccessStatusCode)
+            return (null, response.StatusCode);
+
+        var bytes = await response.Content.ReadAsByteArrayAsync(cancel);
+        return (bytes, response.StatusCode);
+    }
+}
+

EnvelopeGenerator.ReceiverUI/Services/EnvelopeReceiverService.cs

@@ -0,0 +1,27 @@
+using System.Net.Http.Json;
+using System.Text.Json;
+using EnvelopeGenerator.ReceiverUI.Models;
+using EnvelopeGenerator.ReceiverUI.Options;
+using Microsoft.Extensions.Options;
+
+namespace EnvelopeGenerator.ReceiverUI.Services;
+
+/// <summary>
+/// Retrieves the <see cref="EnvelopeReceiverDto"/> for the authenticated receiver
+/// from <c>GET api/EnvelopeReceiver/{envelopeKey}</c>.
+/// </summary>
+public class EnvelopeReceiverService(HttpClient http, IOptions<ApiOptions> apiOptions)
+{
+    private static readonly JsonSerializerOptions _jsonOptions = new(JsonSerializerDefaults.Web);
+
+    public async Task<EnvelopeReceiverDto?> GetAsync(string envelopeKey, CancellationToken cancel = default)
+    {
+        var url = $"{apiOptions.Value.BaseUrl}/api/EnvelopeReceiver/{Uri.EscapeDataString(envelopeKey)}";
+        var response = await http.GetAsync(url, cancel);
+
+        if (!response.IsSuccessStatusCode)
+            return null;
+
+        return await response.Content.ReadFromJsonAsync<EnvelopeReceiverDto>(_jsonOptions, cancel);
+    }
+}

EnvelopeGenerator.ReceiverUI/Services/FontLoader.cs

@@ -0,0 +1,12 @@
+using DevExpress.Drawing;
+
+namespace EnvelopeGenerator.ReceiverUI.Services {
+    public static class FontLoader {
+        public async static Task LoadFonts(HttpClient httpClient, List<string> fontNames) {
+            foreach(var fontName in fontNames) {
+                var fontBytes = await httpClient.GetByteArrayAsync($"fonts/{fontName}");
+                DXFontRepository.Instance.AddFont(fontBytes);
+            }
+        }
+    }
+}

EnvelopeGenerator.ReceiverUI/Services/InMemoryReportStorageWebExtension.cs

@@ -0,0 +1,83 @@
+using DevExpress.XtraReports.UI;
+using DevExpress.XtraReports.Web.Extensions;
+using EnvelopeGenerator.ReceiverUI.PredefinedReports;
+
+namespace EnvelopeGenerator.ReceiverUI.Services;
+
+public class InMemoryReportStorageWebExtension : ReportStorageWebExtension
+{
+    private const string DefaultReportName = "LargeDatasetReport";
+    private static readonly Dictionary<string, byte[]> Reports = new(StringComparer.OrdinalIgnoreCase);
+
+    public override bool CanSetData(string url) => IsValidUrl(url);
+
+    public override byte[] GetData(string url)
+    {
+        url = NormalizeUrl(url);
+
+        if (Reports.TryGetValue(url, out var reportLayout))
+            return reportLayout;
+
+        if (ReportsFactory.Reports.TryGetValue(url, out var reportFactory))
+            return SaveReport(reportFactory());
+
+        throw new DevExpress.XtraReports.Web.ClientControls.FaultException($"Report '{url}' was not found.");
+    }
+
+    public override Dictionary<string, string> GetUrls()
+    {
+        var urls = ReportsFactory.Reports.Keys
+            .Concat(Reports.Keys)
+            .Distinct(StringComparer.OrdinalIgnoreCase)
+            .ToDictionary(name => name, name => name, StringComparer.OrdinalIgnoreCase);
+
+        return urls;
+    }
+
+    public override bool IsValidUrl(string url)
+    {
+        return !string.IsNullOrWhiteSpace(url)
+            && url.IndexOfAny(Path.GetInvalidFileNameChars()) < 0;
+    }
+
+    public override void SetData(XtraReport report, string url)
+    {
+        url = NormalizeUrl(url);
+        Reports[url] = SaveReport(report);
+    }
+
+    public override string SetNewData(XtraReport report, string defaultUrl)
+    {
+        var url = NormalizeUrl(defaultUrl);
+        Reports[url] = SaveReport(report);
+        return url;
+    }
+
+    public bool TryGetReport(string url, out XtraReport report)
+    {
+        url = NormalizeUrl(url);
+
+        if (!Reports.ContainsKey(url))
+        {
+            report = null!;
+            return false;
+        }
+
+        using var stream = new MemoryStream(Reports[url]);
+        report = XtraReport.FromXmlStream(stream, true);
+        report.Name = url;
+        return true;
+    }
+
+    private static string NormalizeUrl(string url)
+    {
+        return string.IsNullOrWhiteSpace(url) ? DefaultReportName : url;
+    }
+
+    private static byte[] SaveReport(XtraReport report)
+    {
+        using var stream = new MemoryStream();
+        report.SaveLayoutToXml(stream);
+        return stream.ToArray();
+    }
+}

EnvelopeGenerator.ReceiverUI/Services/ObjectDataSourceWizardCustomTypeProvider.cs

@@ -0,0 +1,9 @@
+using DevExpress.DataAccess.Web;
+
+namespace EnvelopeGenerator.ReceiverUI.Services {
+    public class ObjectDataSourceWizardCustomTypeProvider : IObjectDataSourceWizardTypeProvider {
+        public IEnumerable<Type> GetAvailableTypes(string context) {
+            return new[] { typeof(Data.DataItemList) };
+        }
+    }
+}

EnvelopeGenerator.ReceiverUI/Services/SignatureService.cs

@@ -0,0 +1,24 @@
+using System.Net.Http.Json;
+using System.Text.Json;
+using EnvelopeGenerator.ReceiverUI.Models;
+using EnvelopeGenerator.ReceiverUI.Options;
+using Microsoft.Extensions.Options;
+
+namespace EnvelopeGenerator.ReceiverUI.Services;
+
+public class SignatureService(HttpClient http, IOptions<ApiOptions> apiOptions)
+{
+    private static readonly JsonSerializerOptions _jsonOptions = new(JsonSerializerDefaults.Web);
+
+    public async Task<IReadOnlyList<SignatureDto>> GetAsync(string envelopeKey, CancellationToken cancel = default)
+    {
+        var url = $"{apiOptions.Value.BaseUrl}/api/Signature/{Uri.EscapeDataString(envelopeKey)}";
+        var response = await http.GetAsync(url, cancel);
+
+        if (!response.IsSuccessStatusCode)
+            throw new HttpRequestException($"Failed to retrieve signatures for envelope {envelopeKey}: {response.StatusCode} {response.ReasonPhrase}");
+
+        var result = await response.Content.ReadFromJsonAsync<List<SignatureDto>>(_jsonOptions, cancel);
+        return result ?? [];
+    }
+}

EnvelopeGenerator.ReceiverUI/Shared/Header.razor

@@ -0,0 +1,21 @@
+<nav class="navbar header-navbar p-0">
+    <button class="navbar-toggler bg-primary d-block" @onclick="OnToggleClick">
+        <span class="navbar-toggler-icon"></span>
+    </button>
+    <div class="ms-3 fw-bold title pe-4">EnvelopeGenerator.ReceiverUI</div>
+</nav>
+
+@code {
+    [Parameter] public bool ToggleOn { get; set; }
+    [Parameter] public EventCallback<bool> ToggleOnChanged { get; set; }
+
+    async Task OnToggleClick() => await Toggle();
+
+    async Task Toggle(bool? value = null) {
+        var newValue = value ?? !ToggleOn;
+        if(ToggleOn != newValue) {
+            ToggleOn = newValue;
+            await ToggleOnChanged.InvokeAsync(ToggleOn);
+        }
+    }
+}

EnvelopeGenerator.ReceiverUI/Shared/Header.razor.css

@@ -0,0 +1,39 @@
+.navbar.header-navbar {
+    flex-grow: 0;
+    flex-wrap: nowrap;
+    border: none;
+    background-color: inherit;
+    border-radius: 0;
+    height: 3.5rem;
+    min-height: 3.5rem;
+    box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.12);
+    justify-content: flex-start;
+}
+
+.header-navbar .navbar-toggler {
+    outline: none;
+    border-radius: 0;
+    padding-left: .75rem;
+    padding-right: .75rem;
+    box-shadow: none;
+    align-self: stretch;
+}
+
+.header-navbar .navbar-toggler .navbar-toggler-icon {
+    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,255,255, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
+    background-color: transparent !important;
+    height: 2rem;
+    width: 2rem;
+}
+
+.title {
+    font-size: 1.1rem;
+    text-overflow: ellipsis;
+    overflow: hidden;
+}
+
+@media (max-width: 350px) {
+    .title {
+        font-size: inherit;
+    }
+}

EnvelopeGenerator.ReceiverUI/Shared/MainLayout.razor

@@ -0,0 +1,27 @@
+@using EnvelopeGenerator.ReceiverUI.Services;
+@inherits LayoutComponentBase
+
+<div class="page">
+<main>
+        <article class="content">
+            @Body
+        </article>
+    </main>
+    <footer class="receiver-footer">
+        <span>&copy; SignFlow 2023-2024 <a href="https://digitaldata.works" target="_blank" rel="noopener">Digital Data GmbH</a></span>
+        <span class="receiver-footer__sep">&#124;</span>
+        <a href="docs/privacy-policy.de-DE.html" target="_blank" rel="noopener">Datenschutz</a>
+    </footer>
+</div>
+
+@code {
+    [Inject] HttpClient Http { get; set; }
+    List<string> RequiredFonts = new() {
+        "opensans.ttf"
+    };
+
+    protected async override Task OnInitializedAsync() {
+        await FontLoader.LoadFonts(Http, RequiredFonts);
+        await base.OnInitializedAsync();
+    }
+}

EnvelopeGenerator.ReceiverUI/Shared/MainLayout.razor.css

@@ -0,0 +1,17 @@
+.page {
+    position: relative;
+    display: flex;
+    flex-direction: column;
+    overflow: auto;
+}
+
+main {
+    flex: 1;
+    margin: 0;
+    padding: 0;
+}
+
+article {
+    padding: 0 !important;
+    margin: 0 !important;
+}

EnvelopeGenerator.ReceiverUI/Shared/NavMenu.razor

@@ -0,0 +1,46 @@
+<div class="top-row ps-3 navbar navbar-dark">
+    <div class="container-fluid">
+        <a class="navbar-brand" href="">EnvelopeGenerator.ReceiverUI</a>
+        <button title="Navigation menu" class="navbar-toggler" @onclick="ToggleNavMenu">
+            <span class="navbar-toggler-icon"></span>
+        </button>
+    </div>
+</div>
+
+<div class="@NavMenuCssClass" @onclick="ToggleNavMenu">
+    <nav class="flex-column">
+        @*
+        <div class="nav-item px-3">
+            <NavLink class="nav-link" href="" Match="NavLinkMatch.All">
+                <span class="oi oi-home" aria-hidden="true"></span> Home
+            </NavLink>
+        </div>
+        <div class="nav-item px-3">
+            <NavLink class="nav-link" href="documentviewer">
+                <span class="oi oi-plus" aria-hidden="true"></span> Document Viewer (JS-Based)
+            </NavLink>
+        </div>
+        *@
+        <div class="nav-item px-3">
+            <NavLink class="nav-link" href="receiver">
+                <span class="oi oi-plus" aria-hidden="true"></span> Empfänger-UI
+            </NavLink>
+        </div>
+        <div class="nav-item px-3">
+            <NavLink class="nav-link" href="sender">
+                <span class="oi oi-plus" aria-hidden="true"></span> Umschlag-UI
+            </NavLink>
+        </div>
+    </nav>
+</div>
+
+@code {
+    private bool collapseNavMenu = true;
+
+    private string NavMenuCssClass => collapseNavMenu ? "collapse" : null;
+
+    private void ToggleNavMenu()
+    {
+        collapseNavMenu = !collapseNavMenu;
+    }
+}

EnvelopeGenerator.ReceiverUI/Shared/NavMenu.razor.css

@@ -0,0 +1,63 @@
+.navbar-toggler {
+    background-color: rgba(255, 255, 255, 0.1);
+}
+
+.top-row {
+    height: 3.5rem;
+    background-color: rgba(0,0,0,0.4);
+}
+
+.navbar-brand {
+    font-size: 1.1rem;
+}
+
+.oi {
+    width: 2rem;
+    font-size: 1.1rem;
+    vertical-align: text-top;
+    top: -2px;
+}
+
+.nav-item {
+    font-size: 0.9rem;
+    padding-bottom: 0.5rem;
+}
+
+    .nav-item:first-of-type {
+        padding-top: 1rem;
+    }
+
+    .nav-item:last-of-type {
+        padding-bottom: 1rem;
+    }
+
+    .nav-item ::deep a {
+        color: #d7d7d7;
+        border-radius: 4px;
+        height: 3rem;
+        display: flex;
+        align-items: center;
+        line-height: 3rem;
+        white-space: nowrap;
+    }
+
+.nav-item ::deep a.active {
+    background-color: rgba(255,255,255,0.25);
+    color: white;
+}
+
+.nav-item ::deep a:hover {
+    background-color: rgba(255,255,255,0.1);
+    color: white;
+}
+
+@media (min-width: 641px) {
+    .navbar-toggler {
+        display: none;
+    }
+
+    .sidebar .collapse {
+        /* Never collapse the sidebar for wide screens */
+        display: block;
+    }
+}

EnvelopeGenerator.ReceiverUI/_Imports.razor

@@ -0,0 +1,10 @@
+@using System.Net.Http
+@using Microsoft.AspNetCore.Components.Forms
+@using Microsoft.AspNetCore.Components.Routing
+@using Microsoft.AspNetCore.Components.Web
+@using Microsoft.JSInterop
+@using EnvelopeGenerator.ReceiverUI
+@using EnvelopeGenerator.ReceiverUI.Shared
+@using DevExpress.Blazor.Reporting
+@using DevExpress.Blazor.PdfViewer
+@using DevExpress.Blazor

EnvelopeGenerator.ReceiverUI/appsettings.Development.json

@@ -0,0 +1,10 @@
+{
+  "Logging": {
+    "IncludeScopes": false,
+    "LogLevel": {
+      "Default": "Information",
+      "System": "Information",
+      "Microsoft": "Information"
+    }
+  }
+}

EnvelopeGenerator.ReceiverUI/appsettings.json

@@ -0,0 +1,10 @@
+{
+  "Logging": {
+    "LogLevel": {
+      "Default": "Information",
+      "Microsoft": "Warning",
+      "Microsoft.Hosting.Lifetime": "Information",
+      "DevExpress": "Warning"
+    }
+  }
+}

EnvelopeGenerator.ReceiverUI/wwwroot/appsettings.json

@@ -0,0 +1,18 @@
+{
+  "Api": {
+    "BaseUrl": "",
+    "ForceToUseFakeDocument": false
+  },
+  "PdfViewer": {
+    "ThumbnailBaseScale": 0.75,
+    "ThumbnailEnableHiDPI": true,
+    "ThumbnailMaxDPR": 2.0,
+    "MainCanvasEnableHiDPI": true,
+    "MainCanvasMaxDPR": 2.0,
+    "EnableSmoothZoom": true,
+    "ZoomTransitionDuration": 900,
+    "RenderingOpacity": 0.85,
+    "ThumbnailRenderDelay": 50,
+    "ZoomStepPercentage": 5
+  }
+}

EnvelopeGenerator.ReceiverUI/wwwroot/browserNotSupported.html

@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <link href="_content/DevExpress.Blazor.Themes/blazing-berry.bs5.min.css" rel="stylesheet" />
+
+</head>
+<body>
+    <div class="d-flex flex-column justify-content-center align-items-center vh-100">
+        <div class="d-flex">
+            <img class="mt-2 me-4" src="images/sad.svg" width="60" height="60" />
+            <div>
+                <div class="h1">Your browser is not supported.</div>
+                <p style="font-size: 1rem; opacity: 0.75;" class="m-0">In .NET 5.0, Blazor does not support Microsoft Internet Explorer and Microsoft Edge Legacy (refer to <a target="_blank" href="https://docs.devexpress.com/Blazor/401588/common-concepts/supported-browsers">Supported Browsers</a>).<br />Please use a different browser to run EnvelopeGenerator.ReceiverUI.</p>
+            </div>
+        </div>
+    </div>
+</body>
+</html>

EnvelopeGenerator.ReceiverUI/wwwroot/css/app.css

@@ -0,0 +1,368 @@
+@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');
+
+html, body {
+    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
+    padding: 0;
+    margin: 0;
+    width: 100%;
+}
+
+html, body {
+    height: 100%;
+    overflow: hidden;
+}
+
+main, .page {
+    margin: 0;
+    padding: 0;
+    width: 100%;
+}
+
+article {
+    height: calc(100vh - 36px);
+    display: flex;
+    flex-direction: column;
+    overflow-y: auto;
+    padding: 0 !important;
+    margin: 0 !important;
+}
+
+.receiver-page-layout {
+    display: flex;
+    flex-direction: column;
+    height: 100%;
+    overflow: hidden;
+}
+
+.receiver-signature-panel {
+    flex: 0 0 auto;
+}
+
+.receiver-viewer-wrapper {
+    flex: 1 1 0;
+    min-height: 0;
+    overflow: hidden;
+}
+
+.valid.modified:not([type=checkbox]) {
+    outline: 1px solid #26b050;
+}
+
+.invalid {
+    outline: 1px solid red;
+}
+
+.validation-message {
+    color: red;
+}
+
+#blazor-error-ui {
+    background: lightyellow;
+    bottom: 0;
+    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
+    display: none;
+    left: 0;
+    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
+    position: fixed;
+    width: 100%;
+    z-index: 1000;
+}
+
+#blazor-error-ui .dismiss {
+    cursor: pointer;
+    position: absolute;
+    right: 0.75rem;
+    top: 0.5rem;
+}
+
+.dx-blazor-reporting-container {
+    height: calc(100vh - 166px) !important;
+    width: 100% !important;
+}
+
+/* ── Force DevExpress viewer pages into a single centered column ─────────── */
+.dxbrv-report-preview-content {
+    display: flex !important;
+    flex-direction: column !important;
+    align-items: center !important;
+}
+
+/* ── Annotation signature checkbox overlays ─────────────────────────────── */
+.annot-sig-cb-wrapper {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 8px;
+    border-radius: 6px;
+    font-size: 0.75rem;
+    font-weight: 600;
+    font-family: "Segoe UI", Arial, sans-serif;
+    padding: 0 12px;
+    overflow: hidden;
+    cursor: pointer;
+    user-select: none;
+    background: linear-gradient(135deg, #2c3e50 0%, #3498db 100%);
+    border: none;
+    color: #ffffff;
+    box-shadow: 0 2px 8px rgba(44, 62, 80, 0.35);
+    transition: box-shadow 0.18s, filter 0.18s;
+}
+
+.annot-sig-cb-wrapper:hover {
+    filter: brightness(1.12);
+    box-shadow: 0 4px 14px rgba(44, 62, 80, 0.45);
+}
+
+.annot-sig-cb-wrapper--checked {
+    background: linear-gradient(135deg, #1a6b2a 0%, #27ae60 100%);
+    box-shadow: 0 2px 8px rgba(26, 107, 42, 0.35);
+}
+
+.annot-sig-cb-wrapper--checked:hover {
+    filter: brightness(1.1);
+    box-shadow: 0 4px 14px rgba(26, 107, 42, 0.45);
+}
+
+.annot-sig-cb {
+    display: none;
+}
+
+.annot-sig-cb__label {
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    pointer-events: none;
+    letter-spacing: 0.01em;
+}
+
+/* ── Envelope info header ────────────────────────────────────────────────── */
+.receiver-info-header {
+    border-bottom: 1px solid rgba(0,0,0,.08);
+}
+
+.receiver-info-header__gradient {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    flex-wrap: wrap;
+    gap: 8px;
+    padding: 10px 16px 8px;
+    background: linear-gradient(135deg, #2c3e50 0%, #3498db 100%);
+    color: #fff;
+}
+
+.receiver-info-header__left {
+    display: flex;
+    align-items: center;
+    gap: 10px;
+    min-width: 0;
+}
+
+.receiver-info-header__icon {
+    flex-shrink: 0;
+    opacity: .85;
+}
+
+.receiver-info-header__title {
+    font-size: 0.92rem;
+    font-weight: 600;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    max-width: 340px;
+}
+
+.receiver-info-header__sender {
+    font-size: 0.72rem;
+    opacity: .8;
+    margin-top: 1px;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    max-width: 400px;
+}
+
+.receiver-info-header__badges {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 5px;
+    align-items: center;
+}
+
+.receiver-info-badge {
+    display: inline-flex;
+    align-items: center;
+    background: rgba(255,255,255,.18);
+    color: #fff;
+    border-radius: 20px;
+    padding: 2px 9px;
+    font-size: 0.70rem;
+    font-weight: 500;
+    white-space: nowrap;
+}
+
+.receiver-info-badge--muted {
+    background: rgba(255,255,255,.10);
+    opacity: .8;
+}
+
+.receiver-info-badge--accent {
+    background: rgba(39,174,96,.35);
+    border: 1px solid rgba(39,174,96,.5);
+}
+
+.receiver-info-message {
+    padding: 7px 16px;
+    font-size: 0.78rem;
+    color: #444;
+    border-bottom: 1px solid rgba(0,0,0,.05);
+    white-space: pre-wrap;
+    line-height: 1.45;
+}
+
+.receiver-info-private-message {
+    display: flex;
+    align-items: flex-start;
+    gap: 4px;
+    padding: 5px 16px 6px;
+    font-size: 0.75rem;
+    color: #5a5a72;
+    background: #f8f7ff;
+    border-top: 1px solid rgba(90,80,180,.12);
+}
+
+/* ── Signature action bar ────────────────────────────────────────────────── */
+.receiver-action-bar {
+    border-bottom: 1px solid rgba(0,0,0,.08);
+    background: #fff;
+}
+
+.receiver-action-bar__inner {
+    display: flex;
+    align-items: center;
+    flex-wrap: wrap;
+    gap: 10px;
+    padding: 7px 14px;
+}
+
+.receiver-action-bar__progress {
+    display: flex;
+    align-items: center;
+    gap: 7px;
+    flex-wrap: wrap;
+}
+
+/* ── Home page ───────────────────────────────────────────────────────────── */
+.home-page-wrapper {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    min-height: calc(100vh - 36px);
+    background: linear-gradient(160deg, #1e2e3e 0%, #2c3e50 40%, #3498db 100%);
+    padding-bottom: 36px;
+}
+
+.home-hero-header {
+    width: 100%;
+    padding: 48px 24px 36px;
+    text-align: center;
+}
+
+.home-hero-header__inner {
+    display: inline-flex;
+    align-items: center;
+    gap: 20px;
+    color: #fff;
+}
+
+.home-hero-header__icon {
+    opacity: 0.90;
+    flex-shrink: 0;
+}
+
+.home-hero-header__title {
+    font-size: 2rem;
+    font-weight: 700;
+    margin: 0;
+    color: #fff;
+    letter-spacing: 0.02em;
+}
+
+.home-hero-header__subtitle {
+    font-size: 0.92rem;
+    margin: 4px 0 0;
+    color: rgba(255,255,255,0.75);
+}
+
+.home-content {
+    width: 100%;
+    max-width: 520px;
+    padding: 0 16px;
+}
+
+.home-card {
+    border-radius: 12px !important;
+    overflow: hidden;
+}
+
+.home-btn-primary {
+    background: linear-gradient(135deg, #2c3e50 0%, #3498db 100%);
+    border: none;
+    color: #fff;
+    font-weight: 500;
+    border-radius: 8px;
+    transition: filter 0.15s, box-shadow 0.15s;
+    box-shadow: 0 2px 10px rgba(44,62,80,0.30);
+}
+
+.home-btn-primary:hover {
+    filter: brightness(1.12);
+    box-shadow: 0 4px 16px rgba(44,62,80,0.40);
+    color: #fff;
+}
+
+.home-feature-badge {
+    display: inline-flex;
+    align-items: center;
+    background: rgba(52,152,219,0.10);
+    color: #3498db;
+    border: 1px solid rgba(52,152,219,0.25);
+    border-radius: 20px;
+    padding: 4px 12px;
+    font-size: 0.75rem;
+    font-weight: 500;
+}
+
+/* ── Footer ──────────────────────────────────────────────────────────────── */
+.receiver-footer {
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    height: 36px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 10px;
+    padding: 0 20px;
+    background: linear-gradient(135deg, #2c3e50 0%, #3498db 100%);
+    color: rgba(255, 255, 255, 0.75);
+    font-size: 0.72rem;
+    z-index: 100;
+    flex-shrink: 0;
+}
+
+.receiver-footer a {
+    color: rgba(255, 255, 255, 0.90);
+    text-decoration: none;
+    transition: color 0.15s;
+}
+
+.receiver-footer a:hover {
+    color: #ffffff;
+    text-decoration: underline;
+}
+
+.receiver-footer__sep {
+    opacity: 0.4;
+}

EnvelopeGenerator.ReceiverUI/wwwroot/css/envelope-viewer.css

@@ -0,0 +1,705 @@
+.envelope-viewer-layout {
+    display: flex;
+    flex-direction: column;
+    height: 100vh;
+    overflow: hidden;
+    background: linear-gradient(135deg, #1e3c72 0%, #2a5298 50%, #7e22ce 100%);
+}
+
+.envelope-action-bar {
+    background: rgba(255, 255, 255, 0.95);
+    backdrop-filter: blur(20px);
+    border-bottom: 3px solid rgba(126, 34, 206, 0.3);
+    padding: 1.25rem 2rem;
+    flex-shrink: 0;
+    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
+}
+
+.envelope-action-bar__inner {
+    max-width: 1600px;
+    margin: 0 auto;
+    display: flex;
+    align-items: center;
+    gap: 2rem;
+}
+
+.envelope-logo svg {
+    filter: drop-shadow(0 2px 4px rgba(126, 34, 206, 0.3));
+    color: #7e22ce;
+}
+
+.envelope-title {
+    font-size: 1.125rem;
+    font-weight: 700;
+    color: #1e293b;
+    letter-spacing: -0.025em;
+}
+
+.envelope-key {
+    font-size: 0.8125rem;
+    color: #64748b;
+    font-family: 'SF Mono', 'Monaco', 'Consolas', monospace;
+    font-weight: 500;
+    margin-top: 0.25rem;
+}
+
+.envelope-content {
+    flex: 1;
+    min-height: 0;
+    padding: 1.5rem;
+    position: relative;
+    overflow: auto;
+}
+
+.pdf-viewer-container {
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 1rem;
+}
+
+.pdf-thumbnails {
+    position: relative;
+    width: 260px;
+    background: rgba(255, 255, 255, 0.98);
+    backdrop-filter: blur(20px);
+    border-radius: 16px 0 0 16px;
+    box-shadow: 
+        0 8px 32px rgba(0, 0, 0, 0.12),
+        0 0 0 1px rgba(126, 34, 206, 0.1);
+    border: 1px solid rgba(126, 34, 206, 0.15);
+    border-right: none;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+    flex-shrink: 0;
+}
+
+.pdf-thumbnails__content {
+    flex: 1;
+    overflow-y: auto;
+    overflow-x: hidden;
+    padding: 1rem;
+    display: flex;
+    flex-direction: column;
+    gap: 0.75rem;
+}
+
+.pdf-thumbnails__content::-webkit-scrollbar {
+    width: 6px;
+}
+
+.pdf-thumbnails__content::-webkit-scrollbar-track {
+    background: rgba(0, 0, 0, 0.05);
+    border-radius: 3px;
+}
+
+.pdf-thumbnails__content::-webkit-scrollbar-thumb {
+    background: linear-gradient(135deg, #7e22ce 0%, #2a5298 100%);
+    border-radius: 3px;
+}
+
+.pdf-thumbnails__content::-webkit-scrollbar-thumb:hover {
+    background: linear-gradient(135deg, #6b1cb0 0%, #1e3a72 100%);
+}
+
+.pdf-splitter {
+    width: 4px;
+    background: transparent;
+    cursor: col-resize;
+    flex-shrink: 0;
+    position: relative;
+    transition: background 0.2s ease;
+    z-index: 10;
+    user-select: none;
+}
+
+.pdf-splitter::before {
+    content: '';
+    position: absolute;
+    left: -4px;
+    right: -4px;
+    top: 0;
+    bottom: 0;
+    /* Enlarged hitbox for easier grabbing */
+}
+
+.pdf-splitter:hover,
+.pdf-splitter.resizing {
+    background: linear-gradient(90deg, 
+        rgba(126, 34, 206, 0.4) 0%, 
+        rgba(42, 82, 152, 0.4) 100%);
+}
+
+.pdf-splitter:active {
+    background: linear-gradient(90deg, 
+        rgba(126, 34, 206, 0.6) 0%, 
+        rgba(42, 82, 152, 0.6) 100%);
+}
+
+/* Prevent text selection during resize */
+body.resizing {
+    user-select: none;
+    cursor: col-resize !important;
+}
+
+.pdf-thumbnail {
+    cursor: pointer;
+    border-radius: 8px;
+    overflow: hidden;
+    background: white;
+    border: 2px solid transparent;
+    transition: all 0.2s ease;
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
+}
+
+.pdf-thumbnail:hover {
+    border-color: rgba(126, 34, 206, 0.3);
+    box-shadow: 0 4px 16px rgba(126, 34, 206, 0.2);
+    transform: translateY(-2px);
+}
+
+.pdf-thumbnail--active {
+    border-color: #7e22ce;
+    box-shadow: 
+        0 4px 16px rgba(126, 34, 206, 0.3),
+        0 0 0 3px rgba(126, 34, 206, 0.1);
+}
+
+.pdf-thumbnail__preview {
+    width: 100%;
+    aspect-ratio: 210 / 297;
+    background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    overflow: hidden;
+}
+
+.pdf-thumbnail__canvas {
+    width: 100%;
+    height: 100%;
+    object-fit: contain;
+    object-position: center;
+    image-rendering: -webkit-optimize-contrast;
+    image-rendering: crisp-edges;
+}
+
+.pdf-thumbnail__label {
+    padding: 0.5rem;
+    text-align: center;
+    font-size: 0.75rem;
+    font-weight: 600;
+    color: #64748b;
+    background: rgba(126, 34, 206, 0.03);
+    border-top: 1px solid rgba(126, 34, 206, 0.1);
+}
+
+.pdf-thumbnail--active .pdf-thumbnail__label {
+    background: linear-gradient(135deg, rgba(126, 34, 206, 0.1) 0%, rgba(42, 82, 152, 0.1) 100%);
+    color: #7e22ce;
+    font-weight: 700;
+}
+
+.pdf-toolbar__btn--toggle {
+    background: linear-gradient(135deg, rgba(126, 34, 206, 0.08) 0%, rgba(42, 82, 152, 0.08) 100%);
+    border-color: rgba(126, 34, 206, 0.25);
+}
+
+.pdf-toolbar__btn--toggle:hover:not(:disabled) {
+    background: linear-gradient(135deg, rgba(126, 34, 206, 0.15) 0%, rgba(42, 82, 152, 0.15) 100%);
+    border-color: rgba(126, 34, 206, 0.5);
+}
+
+.pdf-toolbar {
+    background: rgba(255, 255, 255, 0.98);
+    backdrop-filter: blur(20px);
+    border-radius: 12px;
+    padding: 0.75rem 1.5rem;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 1.5rem;
+    box-shadow: 
+        0 4px 16px rgba(0, 0, 0, 0.1),
+        0 0 0 1px rgba(126, 34, 206, 0.1);
+    border: 1px solid rgba(126, 34, 206, 0.15);
+    flex-shrink: 0;
+    width: 95%;
+}
+
+.pdf-toolbar__section {
+    display: flex;
+    align-items: center;
+    gap: 0.5rem;
+    flex-shrink: 0;
+}
+
+.pdf-toolbar__zoom-section {
+    gap: 0.75rem;
+    flex: 1;
+    max-width: 400px;
+    min-width: 280px;
+    justify-content: center;
+}
+
+.pdf-toolbar__divider {
+    width: 1px;
+    height: 32px;
+    background: linear-gradient(180deg, transparent 0%, rgba(126, 34, 206, 0.2) 50%, transparent 100%);
+}
+
+.pdf-toolbar__btn {
+    background: linear-gradient(135deg, rgba(126, 34, 206, 0.05) 0%, rgba(42, 82, 152, 0.05) 100%);
+    border: 1px solid rgba(126, 34, 206, 0.2);
+    border-radius: 8px;
+    padding: 0.5rem;
+    cursor: pointer;
+    transition: all 0.2s ease;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: #1e293b;
+    min-width: 34px;
+    min-height: 34px;
+}
+
+.pdf-toolbar__btn:hover:not(:disabled) {
+    background: linear-gradient(135deg, rgba(126, 34, 206, 0.1) 0%, rgba(42, 82, 152, 0.1) 100%);
+    border-color: rgba(126, 34, 206, 0.4);
+    transform: translateY(-1px);
+    box-shadow: 0 4px 12px rgba(126, 34, 206, 0.2);
+}
+
+.pdf-toolbar__btn:active:not(:disabled) {
+    transform: translateY(0);
+    box-shadow: 0 2px 6px rgba(126, 34, 206, 0.15);
+}
+
+.pdf-toolbar__btn:disabled {
+    opacity: 0.4;
+    cursor: not-allowed;
+    background: rgba(0, 0, 0, 0.02);
+    border-color: rgba(0, 0, 0, 0.1);
+}
+
+.pdf-toolbar__btn--preset {
+    padding: 0.5rem 0.875rem;
+    font-size: 0.813rem;
+    font-weight: 600;
+    color: #475569;
+    min-width: auto;
+    white-space: nowrap;
+}
+
+.pdf-toolbar__btn--preset svg {
+    flex-shrink: 0;
+}
+
+.pdf-toolbar__page-input-group {
+    display: flex;
+    align-items: center;
+    gap: 0.375rem;
+    background: white;
+    border: 1px solid rgba(126, 34, 206, 0.2);
+    border-radius: 8px;
+    padding: 0.25rem 0.625rem;
+}
+
+.pdf-toolbar__page-input {
+    width: 48px;
+    border: none;
+    outline: none;
+    text-align: center;
+    font-size: 0.875rem;
+    font-weight: 600;
+    color: #1e293b;
+    background: transparent;
+    -moz-appearance: textfield;
+}
+
+.pdf-toolbar__page-input::-webkit-outer-spin-button,
+.pdf-toolbar__page-input::-webkit-inner-spin-button {
+    -webkit-appearance: none;
+    margin: 0;
+}
+
+.pdf-toolbar__page-total {
+    font-size: 0.875rem;
+    font-weight: 500;
+    color: #64748b;
+}
+
+.pdf-toolbar__zoom-slider-container {
+    position: relative;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 0.25rem;
+}
+
+.pdf-toolbar__zoom-slider {
+    -webkit-appearance: none;
+    width: 100%;
+    min-width: 180px;
+    max-width: 350px;
+    height: 6px;
+    border-radius: 3px;
+    background: linear-gradient(90deg, 
+        rgba(126, 34, 206, 0.1) 0%, 
+        rgba(126, 34, 206, 0.2) 50%, 
+        rgba(126, 34, 206, 0.1) 100%);
+    outline: none;
+    cursor: pointer;
+}
+
+.pdf-toolbar__zoom-slider::-webkit-slider-thumb {
+    -webkit-appearance: none;
+    appearance: none;
+    width: 18px;
+    height: 18px;
+    border-radius: 50%;
+    background: linear-gradient(135deg, #7e22ce 0%, #2a5298 100%);
+    cursor: pointer;
+    box-shadow: 0 2px 8px rgba(126, 34, 206, 0.3);
+    transition: all 0.2s ease;
+}
+
+.pdf-toolbar__zoom-slider::-webkit-slider-thumb:hover {
+    transform: scale(1.15);
+    box-shadow: 0 4px 12px rgba(126, 34, 206, 0.4);
+}
+
+.pdf-toolbar__zoom-slider::-moz-range-thumb {
+    width: 18px;
+    height: 18px;
+    border-radius: 50%;
+    background: linear-gradient(135deg, #7e22ce 0%, #2a5298 100%);
+    cursor: pointer;
+    border: none;
+    box-shadow: 0 2px 8px rgba(126, 34, 206, 0.3);
+    transition: all 0.2s ease;
+}
+
+.pdf-toolbar__zoom-slider::-moz-range-thumb:hover {
+    transform: scale(1.15);
+    box-shadow: 0 4px 12px rgba(126, 34, 206, 0.4);
+}
+
+.pdf-toolbar__zoom-label {
+    font-size: 0.75rem;
+    font-weight: 700;
+    color: #7e22ce;
+    letter-spacing: 0.025em;
+    min-width: 45px;
+    text-align: center;
+}
+
+/* Signature Navigation Styles */
+.pdf-toolbar__signature-nav {
+    display: flex;
+    align-items: center;
+    gap: 0.375rem;
+    background: linear-gradient(135deg, rgba(126, 34, 206, 0.05) 0%, rgba(42, 82, 152, 0.05) 100%);
+    border: 1px solid rgba(126, 34, 206, 0.2);
+    border-radius: 10px;
+    padding: 0.25rem 0.5rem;
+    flex-shrink: 0;
+}
+
+.pdf-toolbar__btn--signature-nav {
+    min-width: 30px;
+    min-height: 30px;
+    padding: 0.25rem;
+    background: white;
+    border: 1px solid rgba(126, 34, 206, 0.25);
+}
+
+.pdf-toolbar__btn--signature-nav:hover:not(:disabled) {
+    background: linear-gradient(135deg, #7e22ce 0%, #2a5298 100%);
+    border-color: transparent;
+}
+
+.pdf-toolbar__btn--signature-nav:hover:not(:disabled) svg {
+    color: white;
+}
+
+.pdf-toolbar__signature-counter {
+    display: flex;
+    align-items: center;
+    gap: 0.375rem;
+    padding: 0 0.375rem;
+}
+
+.pdf-toolbar__signature-counter svg {
+    color: #7e22ce;
+    flex-shrink: 0;
+}
+
+.pdf-toolbar__signature-counter-text {
+    font-size: 0.8125rem;
+    font-weight: 600;
+    color: #1e293b;
+    white-space: nowrap;
+}
+
+.pdf-toolbar__signature-badge {
+    font-size: 0.625rem;
+    font-weight: 700;
+    padding: 0.1875rem 0.5rem;
+    border-radius: 5px;
+    background: linear-gradient(135deg, rgba(126, 34, 206, 0.1) 0%, rgba(42, 82, 152, 0.1) 100%);
+    color: #7e22ce;
+    text-transform: uppercase;
+    letter-spacing: 0.05em;
+    white-space: nowrap;
+}
+
+.pdf-toolbar__signature-badge--complete {
+    background: linear-gradient(135deg, rgba(16, 185, 129, 0.1) 0%, rgba(5, 150, 105, 0.1) 100%);
+    color: #059669;
+}
+
+/* Reset Button Styles */
+.pdf-toolbar__btn--reset {
+    background: linear-gradient(135deg, rgba(239, 68, 68, 0.08) 0%, rgba(220, 38, 38, 0.08) 100%);
+    border-color: rgba(239, 68, 68, 0.3);
+    color: #dc2626;
+}
+
+.pdf-toolbar__btn--reset:hover:not(:disabled) {
+    background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
+    border-color: transparent;
+    color: white;
+    transform: translateY(-1px);
+    box-shadow: 0 4px 12px rgba(239, 68, 68, 0.3);
+}
+
+.pdf-toolbar__btn--reset svg {
+    transition: color 0.2s ease;
+}
+
+.pdf-toolbar__btn--reset:hover:not(:disabled) svg {
+    color: white;
+}
+
+.pdf-frame {
+    background: white;
+    border-radius: 16px;
+    box-shadow: 
+        0 25px 50px -12px rgba(0, 0, 0, 0.25),
+        0 0 0 1px rgba(255, 255, 255, 0.1);
+    overflow: hidden;
+    position: relative;
+    flex: 1;
+    width: 95%;
+    display: flex;
+    flex-direction: row;
+    align-items: stretch;
+}
+
+.pdf-frame::before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    height: 4px;
+    background: linear-gradient(90deg, #7e22ce 0%, #2a5298 100%);
+    z-index: 1;
+    border-radius: 16px 16px 0 0;
+}
+
+.pdf-canvas-wrapper {
+    flex: 1;
+    overflow: auto;
+    padding: 2rem;
+    text-align: center;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: flex-start;
+}
+
+.pdf-page-container {
+    position: relative;
+    display: inline-block;
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+}
+
+.pdf-canvas {
+    display: block;
+    vertical-align: top;
+    image-rendering: -webkit-optimize-contrast;
+    image-rendering: crisp-edges;
+    transition: opacity 0.15s ease-out;
+}
+
+.pdf-canvas.rendering {
+    opacity: 0;
+}
+
+.pdf-text-layer {
+    position: absolute;
+    left: 0;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    overflow: hidden;
+    opacity: 1;
+    line-height: 1.0;
+    pointer-events: auto;
+}
+
+.pdf-text-layer > span {
+    color: transparent;
+    position: absolute;
+    white-space: pre;
+    cursor: text;
+    transform-origin: 0% 0%;
+}
+
+.pdf-text-layer ::selection {
+    background: rgba(126, 34, 206, 0.3);
+}
+
+.pdf-text-layer ::-moz-selection {
+    background: rgba(126, 34, 206, 0.3);
+}
+
+.pdf-signature-layer {
+    position: absolute;
+    left: 0;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    overflow: visible;
+    pointer-events: none;
+    z-index: 20;
+}
+
+.pdf-signature-layer .signature-button {
+    pointer-events: auto;
+}
+
+.signature-button {
+    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
+}
+
+.signature-button:focus {
+    outline: 2px solid #7e22ce;
+    outline-offset: 2px;
+}
+
+.signature-button:active {
+    transform: scale(0.98);
+}
+
+.error-container {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: 100%;
+    padding: 2rem;
+}
+
+.alert {
+    border-radius: 12px;
+    border: none;
+    padding: 2rem;
+    max-width: 600px;
+}
+
+.alert-danger {
+    background: linear-gradient(135deg, #fff1f2 0%, #ffe4e6 100%);
+    color: #be123c;
+    border-left: 4px solid #e11d48;
+}
+
+.alert-warning {
+    background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%);
+    color: #92400e;
+    border-left: 4px solid #f59e0b;
+}
+
+.spinner-border {
+    border-width: 0.35rem;
+}
+
+@media (max-width: 768px) {
+.envelope-content {
+    padding: 0.75rem;
+}
+
+.pdf-thumbnails {
+    width: 180px;
+    border-radius: 0 0 0 16px;
+}
+
+.pdf-thumbnails__content {
+    padding: 0.75rem;
+    gap: 0.5rem;
+}
+
+.pdf-toolbar {
+    flex-wrap: wrap;
+    padding: 0.625rem 1rem;
+    gap: 0.75rem;
+    width: 98%;
+    justify-content: center;
+}
+
+.pdf-toolbar__divider {
+    display: none;
+}
+
+.pdf-toolbar__zoom-section {
+    width: 100%;
+    max-width: 100%;
+}
+
+.pdf-toolbar__zoom-slider {
+    min-width: 150px;
+}
+
+.pdf-toolbar__btn--preset {
+    padding: 0.425rem 0.75rem;
+    font-size: 0.75rem;
+}
+
+.pdf-frame {
+    border-radius: 12px;
+    width: 98%;
+    flex-direction: column;
+}
+
+.pdf-canvas-wrapper {
+    padding: 1rem;
+}
+
+    .envelope-action-bar {
+        padding: 1rem 1.25rem;
+    }
+
+    .envelope-action-bar__inner {
+        flex-wrap: wrap;
+    }
+
+    .envelope-title {
+        font-size: 1rem;
+    }
+
+    .envelope-key {
+        font-size: 0.75rem;
+    }
+
+    .envelope-logo svg {
+        width: 20px;
+        height: 20px;
+    }
+
+    .alert {
+        padding: 1.5rem;
+    }
+}

EnvelopeGenerator.ReceiverUI/wwwroot/css/open-iconic/FONT-LICENSE

@@ -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.

EnvelopeGenerator.ReceiverUI/wwwroot/css/open-iconic/ICON-LICENSE

@@ -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.

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

@@ -0,0 +1,114 @@
+[Open Iconic v1.1.1](https://github.com/iconic/open-iconic)
+===========
+
+### Open Iconic is the open source sibling of [Iconic](https://github.com/iconic/open-iconic). It is a hyper-legible collection of 223 icons with a tiny footprint—ready to use with Bootstrap and Foundation. [View the collection](https://github.com/iconic/open-iconic)
+
+
+
+## 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](https://github.com/iconic/open-iconic) and [Reference](https://github.com/iconic/open-iconic) 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).

EnvelopeGenerator.ReceiverUI/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>

EnvelopeGenerator.ReceiverUI/wwwroot/css/privacy-policy.css

@@ -0,0 +1,41 @@
+body {
+    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+    line-height: 1.6;
+    margin: 1.25rem;
+    background-color: #f4f4f4;
+}
+
+header {
+    text-align: center;
+    margin: 0rem 10rem 3rem 10rem;
+    box-shadow: 0 .25rem .5rem rgba(0, 0, 0, 0.1);
+}
+
+h1 {
+    color: #333;
+}
+
+h2 {
+    color: #0056b3;
+}
+
+section {
+    background-color: white;
+    padding: 1.25rem;
+    border-radius: 0.5rem;
+    box-shadow: 0 .25rem .5rem rgba(0, 0, 0, 0.1);
+    margin: 0rem 10rem 3rem 10rem
+}
+
+ul {
+    list-style: disc inside;
+}
+
+a {
+    color: #0056b3;
+    text-decoration: none;
+}
+
+a:hover {
+    text-decoration: underline;
+}

EnvelopeGenerator.ReceiverUI/wwwroot/css/privacy-policy.min.css

@@ -0,0 +1 @@
+body{font-family:system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen,Ubuntu,Cantarell,'Open Sans','Helvetica Neue',sans-serif;line-height:1.6;margin:1.25rem;background-color:#f4f4f4}header{text-align:center;margin:0 10rem 3rem 10rem;box-shadow:0 .25rem .5rem rgba(0,0,0,.1)}h1{color:#333}h2{color:#0056b3}section{background-color:#fff;padding:1.25rem;border-radius:.5rem;box-shadow:0 .25rem .5rem rgba(0,0,0,.1);margin:0 10rem 3rem 10rem}ul{list-style:disc inside}a{color:#0056b3;text-decoration:none}a:hover{text-decoration:underline}