diff --git a/EnvelopeGenerator.ReceiverUI/Pages/EnvelopeViewer.razor b/EnvelopeGenerator.ReceiverUI/Pages/EnvelopeViewer.razor
index dcdf9971..9f5a7293 100644
--- a/EnvelopeGenerator.ReceiverUI/Pages/EnvelopeViewer.razor
+++ b/EnvelopeGenerator.ReceiverUI/Pages/EnvelopeViewer.razor
@@ -60,29 +60,6 @@
         } else if (!string.IsNullOrWhiteSpace(_pdfDataUrl)) {
             <div class="pdf-viewer-container">
                 @if (_pdfLoaded) {
-                    <!-- PDF Thumbnail Sidebar -->
-                    <div class="pdf-thumbnails @(_showThumbnails ? "pdf-thumbnails--visible" : "")">
-                        <div class="pdf-thumbnails__header">
-                            <span class="pdf-thumbnails__title">Seiten</span>
-                            <button class="pdf-thumbnails__close" @onclick="ToggleThumbnails" title="Seitenleiste schließen">
-                                <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
-                                    <path d="M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 0 1 0-.708z"/>
-                                </svg>
-                            </button>
-                        </div>
-                        <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>
-
                     <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")">
@@ -151,7 +128,33 @@
                     </div>
                 }
                 <div class="pdf-frame">
-                    <canvas id="pdf-canvas" class="pdf-canvas"></canvas>
+                    @if (_pdfLoaded && _showThumbnails) {
+                        <!-- PDF Thumbnail Sidebar -->
+                        <div class="pdf-thumbnails">
+                            <div class="pdf-thumbnails__header">
+                                <span class="pdf-thumbnails__title">Seiten</span>
+                                <button class="pdf-thumbnails__close" @onclick="ToggleThumbnails" title="Seitenleiste schließen">
+                                    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
+                                        <path d="M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 0 1 0-.708z"/>
+                                    </svg>
+                                </button>
+                            </div>
+                            <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>
+                    }
+                    <div class="pdf-canvas-wrapper">
+                        <canvas id="pdf-canvas" class="pdf-canvas"></canvas>
+                    </div>
                 </div>
             </div>
         } else {
diff --git a/EnvelopeGenerator.ReceiverUI/wwwroot/css/envelope-viewer.css b/EnvelopeGenerator.ReceiverUI/wwwroot/css/envelope-viewer.css
index c89cee4c..82913155 100644
--- a/EnvelopeGenerator.ReceiverUI/wwwroot/css/envelope-viewer.css
+++ b/EnvelopeGenerator.ReceiverUI/wwwroot/css/envelope-viewer.css
@@ -56,34 +56,28 @@
     display: flex;
     flex-direction: column;
     align-items: center;
-    justify-content: flex-start;
-    padding: 0;
     gap: 1rem;
-    position: relative;
 }
 
 .pdf-thumbnails {
-    position: absolute;
-    left: -280px;
-    top: 0;
-    bottom: 0;
+    position: relative;
     width: 260px;
     background: rgba(255, 255, 255, 0.98);
     backdrop-filter: blur(20px);
-    border-radius: 16px;
+    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);
-    transition: left 0.3s cubic-bezier(0.4, 0, 0.2, 1);
-    z-index: 100;
+    border-right: none;
     display: flex;
     flex-direction: column;
     overflow: hidden;
+    flex-shrink: 0;
 }
 
 .pdf-thumbnails--visible {
-    left: 0;
+    /* No longer needed - visibility controlled by @if in Razor */
 }
 
 .pdf-thumbnails__header {
@@ -397,13 +391,14 @@
     box-shadow: 
         0 25px 50px -12px rgba(0, 0, 0, 0.25),
         0 0 0 1px rgba(255, 255, 255, 0.1);
-    overflow: auto;
+    overflow: hidden;
     position: relative;
-    padding: 2rem;
     flex: 1;
     width: 90%;
     max-width: 1200px;
-    text-align: center;
+    display: flex;
+    flex-direction: row;
+    align-items: stretch;
 }
 
 .pdf-frame::before {
@@ -418,6 +413,17 @@
     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-canvas {
     display: inline-block;
     box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
@@ -456,46 +462,49 @@
 }
 
 @media (max-width: 768px) {
-    .envelope-content {
-        padding: 0.75rem;
-    }
+.envelope-content {
+    padding: 0.75rem;
+}
 
-    .pdf-thumbnails {
-        width: 200px;
-        left: -220px;
-        border-radius: 0 16px 16px 0;
-    }
+.pdf-thumbnails {
+    width: 180px;
+    border-radius: 0 0 0 16px;
+}
 
-    .pdf-thumbnails__content {
-        padding: 0.75rem;
-        gap: 0.5rem;
-    }
+.pdf-thumbnails__content {
+    padding: 0.75rem;
+    gap: 0.5rem;
+}
 
-    .pdf-toolbar {
-        flex-wrap: wrap;
-        padding: 0.625rem 1rem;
-        gap: 0.625rem;
-        max-width: 98%;
-    }
+.pdf-toolbar {
+    flex-wrap: wrap;
+    padding: 0.625rem 1rem;
+    gap: 0.625rem;
+    max-width: 98%;
+}
 
-    .pdf-toolbar__divider {
-        display: none;
-    }
+.pdf-toolbar__divider {
+    display: none;
+}
 
-    .pdf-toolbar__zoom-slider {
-        width: 100px;
-    }
+.pdf-toolbar__zoom-slider {
+    width: 100px;
+}
 
-    .pdf-toolbar__btn--preset {
-        padding: 0.425rem 0.75rem;
-        font-size: 0.75rem;
-    }
+.pdf-toolbar__btn--preset {
+    padding: 0.425rem 0.75rem;
+    font-size: 0.75rem;
+}
 
-    .pdf-frame {
-        border-radius: 12px;
-        padding: 1rem;
-        width: 95%;
-    }
+.pdf-frame {
+    border-radius: 12px;
+    width: 95%;
+    flex-direction: column;
+}
+
+.pdf-canvas-wrapper {
+    padding: 1rem;
+}
 
     .envelope-action-bar {
         padding: 1rem 1.25rem;