Kundenansicht neu E-Fix F3b: Safe-Area links und rechts in Hülle, öffentlichen Seiten und Chat-Vollbild

dashboard.html und die öffentlichen Seiten setzen viewport-fit=cover, aber kein Rand nutzte env(safe-area-inset-left|right): Im Querformat
am iPhone rutschten die ersten Zeichen unter Notch und Insel. Kopf, Hauptseite, Blatt, Streifen, Konto-Sheet, Fehlerzeile, Leiste, Banner und die
Sperre sowie Login, Rechtsseiten, Auftrag, Offline-Seite und die Kopfzeile des Chat-Vollbilds bauen ihre Ränder jetzt mit
max(Wert, env(safe-area-inset-left|right)). Am Desktop und ohne Notch ändert sich nichts (Inset 0). Pins in test/knEfixCss.test.js.

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>

public/neu/oeffentlich/oeffentlich.css

@@ -14,10 +14,10 @@
 
 /* ------------------------------------------------------------------ Anmeldung --- */
 .kn-login-seite { min-height: 100svh; }
-.kn-login-kopf { position: fixed; top: 0; left: 0; right: 0; z-index: 2; padding: calc(24px + env(safe-area-inset-top)) 24px 16px; pointer-events: none; }
+.kn-login-kopf { position: fixed; top: 0; left: 0; right: 0; z-index: 2; padding: calc(24px + env(safe-area-inset-top)) max(24px, env(safe-area-inset-right)) 16px max(24px, env(safe-area-inset-left)); pointer-events: none; }
 .kn-login-logo { pointer-events: auto; font-size: 18px; line-height: 24px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
 .kn-seite a.kn-login-logo { text-decoration: none; }
-.kn-login-haupt { min-height: 100svh; display: flex; align-items: center; justify-content: center; padding: calc(88px + env(safe-area-inset-top)) 24px calc(40px + env(safe-area-inset-bottom)); }
+.kn-login-haupt { min-height: 100svh; display: flex; align-items: center; justify-content: center; padding: calc(88px + env(safe-area-inset-top)) max(24px, env(safe-area-inset-right)) calc(40px + env(safe-area-inset-bottom)) max(24px, env(safe-area-inset-left)); }
 .kn-login-spalte { width: 100%; max-width: 360px; }
 .kn-login-marke { display: none; }
 .kn-login-titel { margin: 0 0 24px; font-size: 22px; line-height: 28px; font-weight: 700; letter-spacing: -.02em; }
@@ -50,7 +50,7 @@
 }
 
 /* ------------------------------------------------------------------ Kündigen und Widerrufen (schlicht) --- */
-.kn-recht main { max-width: 620px; margin: 0 auto; padding: 48px 20px 80px; }
+.kn-recht main { max-width: 620px; margin: 0 auto; padding: 48px max(20px, env(safe-area-inset-right)) 80px max(20px, env(safe-area-inset-left)); }
 .kn-recht h1 { margin: 0 0 8px; font-size: 28px; line-height: 34px; font-weight: 700; letter-spacing: -.02em; }
 .kn-recht h2 { margin: 0 0 12px; font-size: 18px; line-height: 26px; font-weight: 600; }
 .kn-markenzeile { margin-bottom: 8px; font-size: 13px; font-weight: 700; letter-spacing: .12em; color: var(--kn-text-2); }
@@ -140,7 +140,7 @@ body.ab-seite {
   font: 16px/1.55 var(--kn-font); -webkit-text-size-adjust: 100%; -webkit-font-smoothing: antialiased;
 }
 .ab-seite .hidden { display: none !important; }
-.ab-seite .ab-innen { max-width: 40rem; margin: 0 auto; padding: 0 16px; box-sizing: border-box; width: 100%; }
+.ab-seite .ab-innen { max-width: 40rem; margin: 0 auto; padding: 0 max(16px, env(safe-area-inset-right)) 0 max(16px, env(safe-area-inset-left)); box-sizing: border-box; width: 100%; }
 .ab-seite .ab-kopf { padding: max(20px, env(safe-area-inset-top)) 0 12px; }
 .ab-seite .ab-kopf .ab-innen { display: flex; align-items: center; gap: 10px; }
 .ab-seite .ab-logo { width: 36px; height: 36px; border-radius: 6px; display: block; }
@@ -234,7 +234,7 @@ body.ab-seite {
 .ab-app-back { display: none; }
 @media (display-mode: standalone) {
   .ab-app-back {
-    display: inline-block; margin: calc(env(safe-area-inset-top) + 12px) 16px 0; font-size: 15px; font-weight: 600; color: var(--ab-text); text-decoration: none;
+    display: inline-block; margin: calc(env(safe-area-inset-top) + 12px) max(16px, env(safe-area-inset-right)) 0 max(16px, env(safe-area-inset-left)); font-size: 15px; font-weight: 600; color: var(--ab-text); text-decoration: none;
   }
   .ab-seite .ab-kopf { padding-top: 12px; }
 }

public/neu/oeffentlich/offline.html

@@ -9,7 +9,7 @@
   <style>
     html, body { height: 100%; margin: 0; }
     body {
-      display: grid; place-items: center; padding: 24px; box-sizing: border-box;
+      display: grid; place-items: center; padding: 24px max(24px, env(safe-area-inset-right)) 24px max(24px, env(safe-area-inset-left)); box-sizing: border-box;
       background: #fff; color: #1a1f36;
       font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
       text-align: center; line-height: 1.5; -webkit-font-smoothing: antialiased;