diff --git a/src/systems/ui/modals.js b/src/systems/ui/modals.js
index 51b1827..1e43847 100644
--- a/src/systems/ui/modals.js
+++ b/src/systems/ui/modals.js
@@ -46,6 +46,12 @@ export class DiceModal {
     open() {
         if (this.isAnimating) return;
 
+        // CRITICAL: Move modal to document.body on first use to escape any container constraints
+        if (this.modal.parentElement?.tagName !== 'BODY') {
+            document.body.appendChild(this.modal);
+            console.log('[DiceModal] Moved modal to document.body to ensure proper viewport positioning');
+        }
+
         // Apply theme
         const theme = extensionSettings.theme;
         this.modal.setAttribute('data-theme', theme);
diff --git a/style.css b/style.css
index 137229d..e805904 100644
--- a/style.css
+++ b/style.css
@@ -3685,6 +3685,19 @@ body:has(.rpg-panel.rpg-position-left) #sheld {
     }
 }
 
+/* Mobile Enhancement (768px and below) */
+@media (max-width: 768px) {
+    /* Fix viewport height for mobile browsers with dynamic toolbars */
+    .rpg-dice-popup {
+        height: 100dvh; /* Dynamic viewport height accounts for mobile browser chrome */
+        --modal-max-height: 70dvh; /* Use dynamic viewport height */
+    }
+
+    .rpg-dice-popup-content {
+        max-height: var(--modal-max-height);
+    }
+}
+
 /* ============================================
    HTML PROMPT TOGGLE
    ============================================ */