Harden help overlay viewport fit on small iOS screens

patterns/vsf-card-listen-fundamentalanalyse-drawer.html

@@ -458,8 +458,12 @@
           return;
         }
 
+        const viewportWidth = window.visualViewport
+          ? window.visualViewport.width
+          : window.innerWidth;
+
         const panelRect = panel.getBoundingClientRect();
-        if (panelRect.right > window.innerWidth) {
+        if (panelRect.right > viewportWidth) {
           wrap.dataset.align = 'right';
         }
 

styles/10-components-interactive-elements.css

@@ -1008,9 +1008,10 @@
       left: 0;
       z-index: var(--layer-pulldown-panel);
       display: none;
-      width: var(--layout-help-panel-width);
-      max-width: calc(100vw - (2 * var(--spacing-large)));
+      width: min(var(--layout-help-panel-width), calc(100dvw - (2 * var(--spacing-large))));
+      max-width: calc(100dvw - (2 * var(--spacing-large)));
       box-sizing: border-box;
+      overflow-wrap: anywhere;
       padding: var(--spacing-large);
       border-radius: var(--radius-card);
       color: var(--text-help-panel);