diff --git a/src/panels/lovelace/cards/hui-gauge-card.ts b/src/panels/lovelace/cards/hui-gauge-card.ts
index dd72db1355..27c1f1bb28 100644
--- a/src/panels/lovelace/cards/hui-gauge-card.ts
+++ b/src/panels/lovelace/cards/hui-gauge-card.ts
@@ -104,10 +104,7 @@ class HuiGaugeCard extends LitElement implements LovelaceCard {
 
     return html`
       ${this.renderStyle()}
-      <ha-card
-        @click="${this._handleClick}"
-        style="${styleMap({ "--base-unit": this._computeBaseUnit() })}"
-      >
+      <ha-card @click="${this._handleClick}">
         ${
           error
             ? html`
@@ -150,6 +147,15 @@ class HuiGaugeCard extends LitElement implements LovelaceCard {
     return hasConfigOrEntityChanged(this, changedProps);
   }
 
+  protected firstUpdated(): void {
+    (this.shadowRoot!.querySelector(
+      "ha-card"
+    )! as HTMLElement).style.setProperty(
+      "--base-unit",
+      this._computeBaseUnit()
+    );
+  }
+
   protected updated(changedProps: PropertyValues): void {
     super.updated(changedProps);
     if (!this._config || !this.hass) {