diff --git a/css/leptonChrome.css b/css/leptonChrome.css
index 9e3e3fa..90e935b 100644
--- a/css/leptonChrome.css
+++ b/css/leptonChrome.css
@@ -4382,7 +4382,9 @@
       height: auto !important;
     }
     :root[uidensity="touch"] #urlbar[breakout] {
-      top: calc((var(--urlbar-toolbar-height) - var(--urlbar-height)) / 2 + 1px) !important;
+      top: calc(
+        (var(--urlbar-toolbar-height, var(--urlbar-container-height)) - var(--urlbar-height)) / 2 + 1px
+      ) !important;
     }
     /* spread menu */
     :root:not([uidensity]) .urlbarView-row {
@@ -4401,7 +4403,7 @@
 }
 @supports -moz-bool-pref("userChrome.padding.urlView_expanding") or -moz-bool-pref("userChrome.urlView.as_commandbar") {
   #urlbar[breakout][breakout-extend] {
-    top: calc((var(--urlbar-toolbar-height) - var(--urlbar-height)) / 2) !important;
+    top: calc((var(--urlbar-toolbar-height, var(--urlbar-container-height)) - var(--urlbar-height)) / 2) !important;
     left: 0 !important;
     width: 100% !important;
   }
@@ -18052,7 +18054,9 @@
     height: auto !important;
   }
   :root[uidensity="touch"] #urlbar[breakout] {
-    top: calc((var(--urlbar-toolbar-height) - var(--urlbar-height)) / 2 + 1px) !important;
+    top: calc(
+      (var(--urlbar-toolbar-height, var(--urlbar-container-height)) - var(--urlbar-height)) / 2 + 1px
+    ) !important;
   }
   /* spread menu */
   :root:not([uidensity]) .urlbarView-row {
@@ -18070,7 +18074,7 @@
 }
 @media (-moz-bool-pref: "userChrome.padding.urlView_expanding"), (-moz-bool-pref: "userChrome.urlView.as_commandbar") {
   #urlbar[breakout][breakout-extend] {
-    top: calc((var(--urlbar-toolbar-height) - var(--urlbar-height)) / 2) !important;
+    top: calc((var(--urlbar-toolbar-height, var(--urlbar-container-height)) - var(--urlbar-height)) / 2) !important;
     left: 0 !important;
     width: 100% !important;
   }
diff --git a/css/leptonChromeESR.css b/css/leptonChromeESR.css
index d0180f9..f2fe381 100644
--- a/css/leptonChromeESR.css
+++ b/css/leptonChromeESR.css
@@ -4727,7 +4727,9 @@
       height: auto !important;
     }
     :root[uidensity="touch"] #urlbar[breakout] {
-      top: calc((var(--urlbar-toolbar-height) - var(--urlbar-height)) / 2 + 1px) !important;
+      top: calc(
+        (var(--urlbar-toolbar-height, var(--urlbar-container-height)) - var(--urlbar-height)) / 2 + 1px
+      ) !important;
     }
     /* spread menu */
     :root:not([uidensity]) .urlbarView-row {
@@ -4746,7 +4748,7 @@
 }
 @supports -moz-bool-pref("userChrome.padding.urlView_expanding") or -moz-bool-pref("userChrome.urlView.as_commandbar") {
   #urlbar[breakout][breakout-extend] {
-    top: calc((var(--urlbar-toolbar-height) - var(--urlbar-height)) / 2) !important;
+    top: calc((var(--urlbar-toolbar-height, var(--urlbar-container-height)) - var(--urlbar-height)) / 2) !important;
     left: 0 !important;
     width: 100% !important;
   }
diff --git a/src/padding/_index.scss b/src/padding/_index.scss
index 542d889..5f13bfa 100644
--- a/src/padding/_index.scss
+++ b/src/padding/_index.scss
@@ -51,7 +51,7 @@
 }
 @include Option("userChrome.padding.urlView_expanding", "userChrome.urlView.as_commandbar") {
   #urlbar[breakout][breakout-extend] {
-    top: calc((var(--urlbar-toolbar-height) - var(--urlbar-height)) / 2) !important;
+    top: calc((var(--urlbar-toolbar-height, var(--urlbar-container-height)) - var(--urlbar-height)) / 2) !important;
     left: 0 !important;
     width: 100% !important;
   }
diff --git a/src/padding/_urlbar.scss b/src/padding/_urlbar.scss
index 35d8953..eadc489 100644
--- a/src/padding/_urlbar.scss
+++ b/src/padding/_urlbar.scss
@@ -25,7 +25,9 @@
     }
   }
   :root[uidensity="touch"] & {
-    top: calc((var(--urlbar-toolbar-height) - var(--urlbar-height)) / 2 + 1px) !important;
+    // Fallback #881
+    top: calc((var(--urlbar-toolbar-height, var(--urlbar-container-height))
+               - var(--urlbar-height)) / 2 + 1px) !important;
   }
 }