diff --git a/dailyjs/shared/components/Card/Card.js b/dailyjs/shared/components/Card/Card.js
index 2d66eee..40e6954 100644
--- a/dailyjs/shared/components/Card/Card.js
+++ b/dailyjs/shared/components/Card/Card.js
@@ -26,6 +26,7 @@ export const CardHeader = ({ children }) => (
       h2 {
         font-size: 1.375rem;
         margin: 0px;
+        color: var(--text-default);
       }
 
       & + :global(.card-body) {
diff --git a/dailyjs/shared/hooks/useCallUI.js b/dailyjs/shared/hooks/useCallUI.js
index 45ecc3f..a6d4c8e 100644
--- a/dailyjs/shared/hooks/useCallUI.js
+++ b/dailyjs/shared/hooks/useCallUI.js
@@ -74,8 +74,14 @@ export const useCallUI = ({
     }
 
     return (
-      <MessageCard error header="An error occured">
-        An unknown error has occured in the call loop. This should not happen!
+      <MessageCard
+        error
+        header="An unknown error occured"
+        onBack={() => window.location.reload()}
+      >
+        A fatal error occured in the call loop. Please check you have entered a
+        valid <code>DAILY_DOMAIN</code> and <code>DAILY_API_KEY</code>{' '}
+        environmental variables.
       </MessageCard>
     );
   }, [