diff --git a/src/scripts/settings/userSettings.js b/src/scripts/settings/userSettings.js
index 762b896380..fc37907854 100644
--- a/src/scripts/settings/userSettings.js
+++ b/src/scripts/settings/userSettings.js
@@ -21,9 +21,6 @@ const defaultSubtitleAppearanceSettings = {
 
 export class UserSettings {
     constructor() {
-        this._userSetPromise = new Promise(resolve => {
-            this._userSetPromiseResolve = resolve;
-        });
     }
 
     /**
@@ -39,11 +36,6 @@ export class UserSettings {
         this.currentUserId = userId;
         this.currentApiClient = apiClient;
 
-        if (this._userSetPromiseResolve) {
-            this._userSetPromiseResolve();
-            this._userSetPromiseResolve = null;
-        }
-
         if (!userId) {
             this.displayPrefs = null;
             return Promise.resolve();
@@ -67,14 +59,6 @@ export class UserSettings {
         this.displayPrefs = instance.getData();
     }
 
-    /**
-     * Allows waiting until the user id is set.
-     * @returns {Promise}
-     */
-    userIsSet() {
-        return this._userSetPromise;
-    }
-
     // FIXME: 'appSettings.set' doesn't return any value
     /**
      * Set value of setting.
diff --git a/src/scripts/site.js b/src/scripts/site.js
index cbc80389c2..83eadbf229 100644
--- a/src/scripts/site.js
+++ b/src/scripts/site.js
@@ -176,7 +176,7 @@ function initSyncPlay() {
     Events.on(ServerConnections, 'apiclientcreated', (e, newApiClient) => SyncPlay.Manager.init(newApiClient));
 }
 
-function onAppReady() {
+async function onAppReady() {
     console.debug('begin onAppReady');
 
     console.debug('onAppReady: loading dependencies');
@@ -217,57 +217,66 @@ function onAppReady() {
         }
     }
 
-    let cssHasLoadedTrigger;
-    const cssHasLoadedPromise = new Promise(resolve => {
-        cssHasLoadedTrigger = resolve;
-    });
-
     const apiClient = ServerConnections.currentApiClient();
     if (apiClient) {
-        fetch(apiClient.getUrl('Branding/Css'))
+        const updateStyle = (css) => {
+            let style = document.querySelector('#cssBranding');
+            if (!style) {
+                // Inject the branding css as a dom element in body so it will take
+                // precedence over other stylesheets
+                style = document.createElement('style');
+                style.id = 'cssBranding';
+                document.body.appendChild(style);
+            }
+            style.textContent = css;
+        };
+
+        const style = fetch(apiClient.getUrl('Branding/Css'))
             .then(function(response) {
                 if (!response.ok) {
                     throw new Error(response.status + ' ' + response.statusText);
                 }
                 return response.text();
             })
-            .then(function(css) {
-                let style = document.querySelector('#cssBranding');
-                if (!style) {
-                    // Inject the branding css as a dom element in body so it will take
-                    // precedence over other stylesheets
-                    style = document.createElement('style');
-                    style.id = 'cssBranding';
-                    document.body.appendChild(style);
-                }
-                style.textContent = css;
-                cssHasLoadedTrigger(style);
-            })
             .catch(function(err) {
                 console.warn('Error applying custom css', err);
             });
-    }
 
-    currentSettings.userIsSet().then(() => {
-        if (currentSettings.disableCustomCss()) {
-            cssHasLoadedPromise.then(style => {
-                style.textContent = '';
-            });
-        }
-
-        const localCss = currentSettings.customCss();
-        if (localCss) {
-            let style = document.querySelector('#localCssBranding');
-            if (!style) {
-                // Inject the branding css as a dom element in body so it will take
-                // precedence over other stylesheets
-                style = document.createElement('style');
-                style.id = 'localCssBranding';
-                document.body.appendChild(style);
+        const handleStyleChange = async () => {
+            if (currentSettings.disableCustomCss()) {
+                updateStyle('');
+            } else {
+                updateStyle(await style);
             }
-            style.textContent = localCss;
-        }
-    });
+
+            const localCss = currentSettings.customCss();
+            let localStyle = document.querySelector('#localCssBranding');
+            if (localCss) {
+                if (!localStyle) {
+                    // Inject the branding css as a dom element in body so it will take
+                    // precedence over other stylesheets
+                    localStyle = document.createElement('style');
+                    localStyle.id = 'localCssBranding';
+                    document.body.appendChild(localStyle);
+                }
+                localStyle.textContent = localCss;
+            } else {
+                if (localStyle) {
+                    localStyle.textContent = '';
+                }
+            }
+        };
+
+        Events.on(ServerConnections, 'localusersignedin', handleStyleChange);
+        Events.on(ServerConnections, 'localusersignedout', handleStyleChange);
+        Events.on(currentSettings, 'change', (e, prop) => {
+            if (prop == 'disableCustomCss' || prop == 'customCss') {
+                handleStyleChange();
+            }
+        });
+
+        style.then(updateStyle);
+    }
 }
 
 function registerServiceWorker() {