diff --git a/frontend/src/lib/components/header/CompanyBanner.svelte b/frontend/src/lib/components/header/CompanyBanner.svelte
index b4a743d..0673e22 100644
--- a/frontend/src/lib/components/header/CompanyBanner.svelte
+++ b/frontend/src/lib/components/header/CompanyBanner.svelte
@@ -1,6 +1,7 @@
 <script>
 	import { AppStateService } from '$lib/service/appState';
 	import { onMount } from 'svelte';
+	import { showIsLoading } from '$lib/store/loading';
 
 	let context = {
 		current: '',
@@ -20,34 +21,72 @@
 			unsub();
 		};
 	});
+
+	// exit to global context
+	function exitCompanyView() {
+		showIsLoading();
+		appState.clearContext();
+		localStorage.setItem('context', '');
+		location.reload();
+	}
+
+	$: isCompanyView = context.current === AppStateService.CONTEXT.COMPANY && context.companyName;
 </script>
 
-{#if context.current === AppStateService.CONTEXT.COMPANY && context.companyName}
-	<div
-		class="sticky top-0 w-full bg-blue-900 dark:bg-gradient-to-r dark:from-emerald-700 dark:to-teal-700 border-b border-blue-800/50 dark:border-emerald-600/50 z-30"
-	>
-		<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
-			<div class="flex items-center justify-center py-1">
-				<div class="flex items-center space-x-2 text-xs">
-					<svg
-						class="w-3 h-3 text-blue-100 dark:text-emerald-100"
-						fill="none"
-						stroke="currentColor"
-						viewBox="0 0 24 24"
-					>
+{#if isCompanyView}
+	<!-- top banner -->
+	<div class="w-full h-9 bg-active-blue dark:bg-active-blue z-30 company-banner">
+		<div class="h-full max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+			<div class="flex items-center justify-center gap-4 h-full">
+				<div class="flex items-center space-x-2">
+					<span class="text-white/70 font-medium text-sm"> Viewing as </span>
+					<span class="text-white font-semibold text-sm">
+						{context.companyName}
+					</span>
+				</div>
+
+				<!-- exit button -->
+				<button
+					on:click={exitCompanyView}
+					class="flex items-center gap-1 px-2 py-0.5 text-white/50 hover:text-white/80 text-xs transition-colors duration-200"
+					title="Exit company view"
+				>
+					<svg class="w-3.5 h-3.5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
 						<path
 							stroke-linecap="round"
 							stroke-linejoin="round"
 							stroke-width="2"
-							d="M19 21V5a2 2 0 00-2-2H7a2 2 0 00-2 2v16m14 0h2m-2 0h-5m-9 0H3m2 0h5M9 7h1m-1 4h1m4-4h1m-1 4h1m-5 10v-5a1 1 0 011-1h2a1 1 0 011 1v5m-4 0h4"
+							d="M6 18L18 6M6 6l12 12"
 						></path>
 					</svg>
-					<span class="text-blue-100 dark:text-emerald-100 font-medium">Viewing as:</span>
-					<span class="text-white dark:text-white font-semibold">
-						{context.companyName}
-					</span>
-				</div>
+				</button>
 			</div>
 		</div>
 	</div>
 {/if}
+
+<!-- border frame around entire viewport when in company view -->
+{#if isCompanyView}
+	<div class="company-view-frame"></div>
+{/if}
+
+<style>
+	.company-banner {
+		box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
+	}
+
+	.company-view-frame {
+		position: fixed;
+		top: 0;
+		left: 0;
+		right: 0;
+		bottom: 0;
+		border: 3px solid #1e3fa8;
+		pointer-events: none;
+		z-index: 9999;
+	}
+
+	:global(.dark) .company-view-frame {
+		border-color: #1e3fa8;
+	}
+</style>
diff --git a/frontend/src/lib/components/header/DesktopMenu.svelte b/frontend/src/lib/components/header/DesktopMenu.svelte
index 51694d6..83a4957 100644
--- a/frontend/src/lib/components/header/DesktopMenu.svelte
+++ b/frontend/src/lib/components/header/DesktopMenu.svelte
@@ -195,8 +195,8 @@
 		class:transition-all={!instantCollapse}
 		class:w-40={isExpanded}
 		class:w-12={!isExpanded}
-		class:!top-[89px]={hasCompanySelected}
-		class:!max-h-[calc(100vh-6rem)]={hasCompanySelected}
+		class:!top-[100px]={hasCompanySelected}
+		class:!max-h-[calc(100vh-100px)]={hasCompanySelected}
 	>
 		{#if !isPinned}
 			<div
diff --git a/frontend/src/lib/service/appState.js b/frontend/src/lib/service/appState.js
index a1633c3..46743ad 100644
--- a/frontend/src/lib/service/appState.js
+++ b/frontend/src/lib/service/appState.js
@@ -104,18 +104,16 @@ export class AppStateService {
 	}
 
 	clearContext() {
-		/*
-        this.#_store.update(state => {
-            return {
-                ...state,
-                context: {
-                    current: AppStateService.CONTEXT.SHARED,
-                    companyName: null,
-                    companyID: null
-                }
-            }
-        })
-        */
+		this.#_store.update((state) => {
+			return {
+				...state,
+				context: {
+					current: AppStateService.CONTEXT.SHARED,
+					companyName: null,
+					companyID: null
+				}
+			};
+		});
 	}
 
 	/**