diff --git a/package-lock.json b/package-lock.json
index d83076d1..35be8f39 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -41,7 +41,7 @@
         "ng2-charts": "^4.1.1",
         "ngx-bootstrap": "^10.3.0",
         "ngx-markdown": "^15.1.2",
-        "oidc-client-ts": "^2.2.2",
+        "oidc-client-ts": "^3.1.0",
         "rxjs": "^7.8.0",
         "toastify-js": "^1.12.0",
         "tslib": "^2.1.0",
@@ -5044,10 +5044,6 @@
         "node": ">= 8"
       }
     },
-    "node_modules/crypto-js": {
-      "version": "4.2.0",
-      "license": "MIT"
-    },
     "node_modules/css-loader": {
       "version": "6.7.3",
       "dev": true,
@@ -7815,7 +7811,9 @@
       }
     },
     "node_modules/http-proxy-middleware": {
-      "version": "2.0.6",
+      "version": "2.0.7",
+      "resolved": "https://registry.npmjs.org/http-proxy-middleware/-/http-proxy-middleware-2.0.7.tgz",
+      "integrity": "sha512-fgVY8AV7qU7z/MmXJ/rxwbrtQH4jBQ9m7kp3llF0liB7glmFeVZFBepQb32T3y8n8k2+AEYuMPCpinYW+/CuRA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -8752,8 +8750,13 @@
       "license": "MIT"
     },
     "node_modules/jwt-decode": {
-      "version": "3.1.2",
-      "license": "MIT"
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/jwt-decode/-/jwt-decode-4.0.0.tgz",
+      "integrity": "sha512-+KJGIyHgkGuIq3IEBNftfhW/LfWhXUIY6OmyVWjliu5KH1y0fw7VQ8YndE2O4qZdMSd9SqbnC8GOcZEy0Om7sA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      }
     },
     "node_modules/karma": {
       "version": "6.4.1",
@@ -10405,14 +10408,15 @@
       "license": "MIT"
     },
     "node_modules/oidc-client-ts": {
-      "version": "2.2.2",
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/oidc-client-ts/-/oidc-client-ts-3.1.0.tgz",
+      "integrity": "sha512-IDopEXjiwjkmJLYZo6BTlvwOtnlSniWZkKZoXforC/oLZHC9wkIxd25Kwtmo5yKFMMVcsp3JY6bhcNJqdYk8+g==",
       "license": "Apache-2.0",
       "dependencies": {
-        "crypto-js": "^4.1.1",
-        "jwt-decode": "^3.1.2"
+        "jwt-decode": "^4.0.0"
       },
       "engines": {
-        "node": ">=12.13.0"
+        "node": ">=18"
       }
     },
     "node_modules/on-finished": {
diff --git a/package.json b/package.json
index 685c09c4..b947a0a9 100644
--- a/package.json
+++ b/package.json
@@ -45,7 +45,7 @@
     "ng2-charts": "^4.1.1",
     "ngx-bootstrap": "^10.3.0",
     "ngx-markdown": "^15.1.2",
-    "oidc-client-ts": "^2.2.2",
+    "oidc-client-ts": "^3.1.0",
     "rxjs": "^7.8.0",
     "toastify-js": "^1.12.0",
     "tslib": "^2.1.0",
diff --git a/projects/gameboard-mks/src/styles.scss b/projects/gameboard-mks/src/styles.scss
index 83cdcb27..84d28abe 100644
--- a/projects/gameboard-mks/src/styles.scss
+++ b/projects/gameboard-mks/src/styles.scss
@@ -1,6 +1,6 @@
 $primary: #181866;
 $primary-hover: #131398;
-$danger: #A41E25;
+$danger: #a41e25;
 $success: #41ad57;
 $light: #f8f9fa;
 $gray-200: #333;
@@ -11,7 +11,8 @@ $bg-tools: #444;
 body {
   background-color: $dark;
   color: $light;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica,
+    Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
   font-size: 18px;
   box-sizing: border-box;
   -webkit-font-smoothing: antialiased;
@@ -75,9 +76,11 @@ button {
   border: none;
   cursor: default;
 }
+
 button:hover {
-  background-color: $primary-hover
+  background-color: $primary-hover;
 }
+
 .btn-lg {
   margin: 8px;
   padding: 32px;
@@ -96,7 +99,8 @@ button:hover {
   }
 }
 app-spinner {
-  svg path, svg rect {
+  svg path,
+  svg rect {
     fill: $primary;
   }
 }
@@ -109,12 +113,12 @@ app-spinner {
   color: $light;
 }
 textarea {
-    background-color: $gray-200;
-    color: $gray-800;
+  background-color: $gray-200;
+  color: $gray-800;
 }
 textarea:focus {
-    background-color: $gray-200;
-    color: $gray-800;
+  background-color: $gray-200;
+  color: $gray-800;
 }
 input.form-check-input {
   background-color: $gray-200;
diff --git a/projects/gameboard-ui/src/app/admin/challenge-browser/challenge-browser.component.html b/projects/gameboard-ui/src/app/admin/challenge-browser/challenge-browser.component.html
index 89efa34a..f1e93f7e 100644
--- a/projects/gameboard-ui/src/app/admin/challenge-browser/challenge-browser.component.html
+++ b/projects/gameboard-ui/src/app/admin/challenge-browser/challenge-browser.component.html
@@ -93,7 +93,7 @@ <h4 class="mt-4">Challenge</h4>
 
 <ng-template #gameEngineAuditNotLoaded>
   <div *ngIf="selected && !selected.archived && !isLoadingAuditFromGameEngine"
-    class="btn btn-link text-info cursor-pointer py-0 px-0" (click)="auditFromGameEngine(selected.id)">
+    class="btn btn-link text-success cursor-pointer py-0 px-0" (click)="auditFromGameEngine(selected.id)">
     Audit from game engine?
   </div>
 
diff --git a/projects/gameboard-ui/src/app/admin/components/active-challenges-modal/active-challenges-modal.component.html b/projects/gameboard-ui/src/app/admin/components/active-challenges-modal/active-challenges-modal.component.html
index 05fc143c..d8ac41e6 100644
--- a/projects/gameboard-ui/src/app/admin/components/active-challenges-modal/active-challenges-modal.component.html
+++ b/projects/gameboard-ui/src/app/admin/components/active-challenges-modal/active-challenges-modal.component.html
@@ -106,11 +106,11 @@ <h5 class="overflow-ellipsis">
 </div>
 
 <ng-template #noChallenges>
-    <div class="text-center gray-text fs-11">There aren't any active challenges of this type right now.</div>
+    <div class="text-center text-muted fs-11">There aren't any active challenges of this type right now.</div>
 </ng-template>
 
 <ng-template #noMatchingChallenges>
-    <div class="text-center gray-text fs-11">None of the active challenges match your search.</div>
+    <div class="text-center text-muted fs-11">None of the active challenges match your search.</div>
 </ng-template>
 
 <ng-template #loading>
diff --git a/projects/gameboard-ui/src/app/admin/components/active-teams-modal/active-teams-modal.component.html b/projects/gameboard-ui/src/app/admin/components/active-teams-modal/active-teams-modal.component.html
index f0211a4e..b7448e46 100644
--- a/projects/gameboard-ui/src/app/admin/components/active-teams-modal/active-teams-modal.component.html
+++ b/projects/gameboard-ui/src/app/admin/components/active-teams-modal/active-teams-modal.component.html
@@ -104,11 +104,11 @@ <h6 class="game-link m-0">
 </div>
 
 <ng-template #noTeams>
-    <div class="text-center gray-text fs-11">There aren't any active teams right now.</div>
+    <div class="text-center text-muted fs-11">There aren't any active teams right now.</div>
 </ng-template>
 
 <ng-template #noMatchingTeams>
-    <div class="text-center gray-text fs-11">There aren't any active teams which match your search.</div>
+    <div class="text-center text-muted fs-11">There aren't any active teams which match your search.</div>
 </ng-template>
 
 <ng-template #loading>
diff --git a/projects/gameboard-ui/src/app/admin/components/admin-enroll-team-modal/admin-enroll-team-modal.component.html b/projects/gameboard-ui/src/app/admin/components/admin-enroll-team-modal/admin-enroll-team-modal.component.html
index dd6cccec..fcd47f0a 100644
--- a/projects/gameboard-ui/src/app/admin/components/admin-enroll-team-modal/admin-enroll-team-modal.component.html
+++ b/projects/gameboard-ui/src/app/admin/components/admin-enroll-team-modal/admin-enroll-team-modal.component.html
@@ -36,7 +36,7 @@
 
 <ng-template #noResults class="text-center">
     <div class="text-center my-3">
-        <em class="gray-text">Use the box above to search for the user(s) you want to enroll in this game.</em>
+        <em class="text-muted">Use the box above to search for the user(s) you want to enroll in this game.</em>
     </div>
 </ng-template>
 
@@ -46,7 +46,7 @@
             size="tiny"></app-avatar>
         <div class="user-info">
             <div>{{ user.name }}</div>
-            <em class="gray-text fs-08">{{ user.id | slice:0:8}}</em>
+            <em class="text-muted fs-08">{{ user.id | slice:0:8}}</em>
         </div>
     </div>
 </ng-template>
diff --git a/projects/gameboard-ui/src/app/admin/dashboard/dashboard.component.html b/projects/gameboard-ui/src/app/admin/dashboard/dashboard.component.html
index d34b9a48..0cc4fc86 100644
--- a/projects/gameboard-ui/src/app/admin/dashboard/dashboard.component.html
+++ b/projects/gameboard-ui/src/app/admin/dashboard/dashboard.component.html
@@ -29,7 +29,7 @@
     <div class="pb-0 pt-1 my-0 py-0">
       <div class="text-white float-right auto-h d-flex align-items-center my-0 py-0">
         <label class="py-0 my-0">Cards</label>
-        <label class="btn text-info my-0 py-0" btnCheckbox id="isPublished-input" name="isPublished"
+        <label class="btn text-success my-0 py-0" btnCheckbox id="isPublished-input" name="isPublished"
           (click)="toggleViewMode()">
           <fa-icon *ngIf="!tableView" [icon]="faToggleOff" size="lg"></fa-icon>
           <fa-icon *ngIf="tableView" [icon]="faToggleOn" size="lg"></fa-icon>
@@ -44,14 +44,14 @@
     <ng-container *ngIf="!tableView">
       <div *appIfHasPermission="'Games_CreateEditDelete'"
         class="new-game-controls card col-3 my-3 bg-transparent d-flex flex-column align-items-center">
-        <button class="btn btn-info flex-grow-1 w-100" (click)="create()">
+        <button class="btn btn-success flex-grow-1 w-100" (click)="create()">
           <fa-icon [icon]="faPlus"></fa-icon>
           <span>New Game</span>
         </button>
 
         <p class="mt-2">OR</p>
 
-        <button class="btn btn-info flex-grow-1 w-100" (click)="handleImportYamlClick()">
+        <button class="btn btn-success flex-grow-1 w-100" (click)="handleImportYamlClick()">
           <fa-icon [icon]="fa.barsStaggered"></fa-icon>
           <span>Import From YAML</span>
         </button>
@@ -62,7 +62,7 @@
           <div class="dropzone-target h-100 d-flex flex-column align-items-center justify-content-center">
             <div class="text-center">
               Upload or drop a YAML file
-              <em class="d-block fs-09 gray-text">(must be an array of games)</em>
+              <em class="d-block fs-09 text-muted">(must be an array of games)</em>
             </div>
           </div>
         </app-dropzone>
diff --git a/projects/gameboard-ui/src/app/api/toc.service.ts b/projects/gameboard-ui/src/app/api/toc.service.ts
index 04aba6d3..50d44f6f 100644
--- a/projects/gameboard-ui/src/app/api/toc.service.ts
+++ b/projects/gameboard-ui/src/app/api/toc.service.ts
@@ -21,16 +21,16 @@ export class TocService {
     private log: LogService
   ) {
     const tag = `?t=${new Date().valueOf()}`;
-    const tocUrl = `${config.tochost}/${config.settings.tocfile + ''}${tag}`;
+    const tocUrl = `${config.tochost}/${config.environment.settings.tocfile + ''}${tag}`;
     let url = config.tochost;
 
     // include toc folder
-    const i = config.settings.tocfile?.lastIndexOf('/') || 0;
+    const i = config.environment.settings.tocfile?.lastIndexOf('/') || 0;
     if (i > 0) {
-      url += `/${config.settings.tocfile?.substring(0, i)}`;
+      url += `/${config.environment.settings.tocfile?.substring(0, i)}`;
     }
 
-    if (!!config.settings.tocfile) {
+    if (!!config.environment.settings.tocfile) {
       this.toc$ = http.get<string[]>(tocUrl).pipe(
         catchError(err => {
           // don't report error here - ops will know what the 404 means
diff --git a/projects/gameboard-ui/src/app/app.component.ts b/projects/gameboard-ui/src/app/app.component.ts
index d73f65bd..ff3d51c5 100644
--- a/projects/gameboard-ui/src/app/app.component.ts
+++ b/projects/gameboard-ui/src/app/app.component.ts
@@ -1,12 +1,13 @@
 // Copyright 2021 Carnegie Mellon University. All Rights Reserved.
 // Released under a MIT (SEI)-style license. See LICENSE.md in the project root for license information.
 
-import { Component, Inject, OnInit } from '@angular/core';
+import { DOCUMENT } from '@angular/common';
+import { Component, inject, Inject, OnInit } from '@angular/core';
+import { Title } from '@angular/platform-browser';
 import { Observable } from 'rxjs';
 import { LayoutService } from './utility/layout.service';
 import { ConfigService } from './utility/config.service';
-import { DOCUMENT } from '@angular/common';
-import { Title } from '@angular/platform-browser';
+import { AuthService } from './utility/auth.service';
 
 @Component({
   selector: 'app-root',
@@ -14,22 +15,34 @@ import { Title } from '@angular/platform-browser';
   styleUrls: ['./app.component.scss']
 })
 export class AppComponent implements OnInit {
-  protected customBackground = "";
+  private auth = inject(AuthService);
+  private config = inject(ConfigService);
+  private autoLogin: {
+    enabled: boolean;
+    tried: boolean;
+  };
+
+  protected customBackground = "custom-bg-black";
   stickyMenu$: Observable<boolean>;
 
   constructor(
     layoutService: LayoutService,
-    private config: ConfigService,
     private title: Title,
     @Inject(DOCUMENT) private document: Document) {
+    this.autoLogin = { enabled: this.config.environment.settings.oidc.autoLogin, tried: false };
     this.stickyMenu$ = layoutService.stickyMenu$;
   }
 
-  ngOnInit(): void {
-    this.title.setTitle(this.config.settings.appname || 'Gameboard');
-    if (this.config.settings.custom_background) {
-      this.document.body.classList.add(this.config.settings.custom_background);
-      this.customBackground = this.config.settings.custom_background || 'custom-bg-black';
+  async ngOnInit() {
+    this.title.setTitle(this.config.environment.settings.appname || 'Gameboard');
+    if (this.config.environment.settings.custom_background) {
+      this.document.body.classList.add(this.config.environment.settings.custom_background);
+      this.customBackground = this.config.environment.settings.custom_background || this.customBackground;
+    }
+
+    if (this.autoLogin.enabled && !this.autoLogin.tried && !await this.auth.isLoggedIn()) {
+      this.autoLogin.tried = true;
+      await this.auth.login();
     }
   }
 }
diff --git a/projects/gameboard-ui/src/app/app.module.ts b/projects/gameboard-ui/src/app/app.module.ts
index 8d2f0d36..c1ddd806 100644
--- a/projects/gameboard-ui/src/app/app.module.ts
+++ b/projects/gameboard-ui/src/app/app.module.ts
@@ -34,6 +34,7 @@ import { GameboardSignalRHubsComponent } from './components/gameboard-signalr-hu
 import { SignalRService } from './services/signalR/signalr.service';
 import { LogService } from './services/log.service';
 import { SystemNotificationsModule } from './system-notifications/system-notifications.module';
+import { UserNavItemComponent } from './standalone/user/components/user-nav-item/user-nav-item.component';
 
 @NgModule({
   declarations: [
@@ -59,6 +60,9 @@ import { SystemNotificationsModule } from './system-notifications/system-notific
     ModalModule.forRoot(),
     BsDropdownModule.forRoot(),
     ProgressbarModule.forRoot(),
+
+    // standalones
+    UserNavItemComponent
   ],
   providers: [
     {
diff --git a/projects/gameboard-ui/src/app/components/nav/nav.component.html b/projects/gameboard-ui/src/app/components/nav/nav.component.html
index c19b2f7f..43f4387e 100644
--- a/projects/gameboard-ui/src/app/components/nav/nav.component.html
+++ b/projects/gameboard-ui/src/app/components/nav/nav.component.html
@@ -22,7 +22,7 @@
             <ng-container *ngIf="(user$ | async)?.id">
                 <a *appIfHasPermission="'Admin_View'" class="btn btn-link text-success mx-1"
                     routerLinkActive="text-info" [routerLink]="['/admin']">Admin</a>
-                <a class="btn btn-link text-success mx-1" (click)="logout()">Log out</a>
+                <a class="btn btn-link text-success mx-1" (click)="handleLogOut()">Log out</a>
             </ng-container>
         </ng-container>
     </div>
@@ -71,7 +71,7 @@
                     </a>
                 </li>
                 <li *ngIf="user?.id">
-                    <a (click)="logout()">Log out</a>
+                    <a (click)="handleLogOut()">Log out</a>
                 </li>
             </ng-container>
         </ul>
@@ -79,5 +79,5 @@
 </nav>
 
 <ng-template #unauthed>
-    <a class="btn btn-link text-success mx-1" routerLinkActive="text-info" [routerLink]="profileUrl">Log in</a>
+    <div role="button" class="btn btn-link text-success mx-1" (click)="handleLogIn()">Log in</div>
 </ng-template>
diff --git a/projects/gameboard-ui/src/app/components/nav/nav.component.scss b/projects/gameboard-ui/src/app/components/nav/nav.component.scss
index ba775bd8..3cabc4d8 100644
--- a/projects/gameboard-ui/src/app/components/nav/nav.component.scss
+++ b/projects/gameboard-ui/src/app/components/nav/nav.component.scss
@@ -1,3 +1,5 @@
+@import "../../../scss/variables";
+
 @media (max-width: 800px) {
   .nav-sm {
     display: flex;
@@ -5,7 +7,6 @@
     .badge {
       display: inline-block;
       font-size: 0.5rem !important;
-      // margin-right: 12px;
     }
 
     li {
@@ -27,9 +28,16 @@
     display: block;
 
     .nav-items {
-      a {
+      a,
+      div[role="button"] {
         display: block;
         font-size: 1.5rem;
+
+        &.active {
+          color: $body-color !important;
+          font-weight: bolder;
+          text-decoration: underline;
+        }
       }
     }
 
diff --git a/projects/gameboard-ui/src/app/components/nav/nav.component.ts b/projects/gameboard-ui/src/app/components/nav/nav.component.ts
index dd96e260..465ce4cf 100644
--- a/projects/gameboard-ui/src/app/components/nav/nav.component.ts
+++ b/projects/gameboard-ui/src/app/components/nav/nav.component.ts
@@ -1,12 +1,13 @@
+import { Observable } from 'rxjs';
 import { TocFile, TocService } from '@/api/toc.service';
 import { ApiUser } from '@/api/user-models';
 import { UserService as LocalUser } from '@/utility/user.service';
 import { PracticeService } from '@/services/practice.service';
 import { UnsubscriberService } from '@/services/unsubscriber.service';
-import { Component, OnInit } from '@angular/core';
-import { Observable } from 'rxjs';
-import { RouterService } from '@/services/router.service';
+import { Component, inject, OnInit } from '@angular/core';
 import { fa } from '@/services/font-awesome.service';
+import { AuthService } from '@/utility/auth.service';
+import { RouterService } from '@/services/router.service';
 
 @Component({
   selector: 'app-nav',
@@ -15,6 +16,9 @@ import { fa } from '@/services/font-awesome.service';
   providers: [UnsubscriberService]
 })
 export class AppNavComponent implements OnInit {
+  private authService = inject(AuthService);
+  private routerService = inject(RouterService);
+
   user$!: Observable<ApiUser | null>;
   toc$!: Observable<TocFile[]>;
   customBackground = "";
@@ -23,12 +27,11 @@ export class AppNavComponent implements OnInit {
   protected fa = fa;
   protected isCollapsed = false;
   protected isPracticeModeEnabled = false;
-  protected profileUrl?: string;
+  protected profileUrl = "";
 
   constructor(
     private localUser: LocalUser,
     private practiceService: PracticeService,
-    private routerService: RouterService,
     private toc: TocService,
     private unsub: UnsubscriberService
   ) { }
@@ -46,7 +49,11 @@ export class AppNavComponent implements OnInit {
     this.isPracticeModeEnabled = isEnabled;
   }
 
-  logout(): void {
-    this.localUser.logout();
+  protected async handleLogIn() {
+    await this.authService.login();
+  }
+
+  protected handleLogOut() {
+    this.authService.logout();
   }
 }
diff --git a/projects/gameboard-ui/src/app/components/sponsor-select-banner/sponsor-select-banner.component.ts b/projects/gameboard-ui/src/app/components/sponsor-select-banner/sponsor-select-banner.component.ts
index f880c1ad..16ca71bb 100644
--- a/projects/gameboard-ui/src/app/components/sponsor-select-banner/sponsor-select-banner.component.ts
+++ b/projects/gameboard-ui/src/app/components/sponsor-select-banner/sponsor-select-banner.component.ts
@@ -31,7 +31,7 @@ export class SponsorSelectBannerComponent {
     localUserService: LocalUserService,
     logService: LogService,
     routerService: RouterService) {
-    this.appName = config.settings.appname || this.appName;
+    this.appName = config.environment.settings.appname || this.appName;
     this.profileUrl = routerService.getProfileUrl();
 
     if (!this.profileUrl) {
diff --git a/projects/gameboard-ui/src/app/core/components/avatar/avatar.component.scss b/projects/gameboard-ui/src/app/core/components/avatar/avatar.component.scss
index d0edfce4..5d27884d 100644
--- a/projects/gameboard-ui/src/app/core/components/avatar/avatar.component.scss
+++ b/projects/gameboard-ui/src/app/core/components/avatar/avatar.component.scss
@@ -1,6 +1,11 @@
 @use "sass:map";
 @import "../../../../scss/player-avatars";
 
+:host {
+  display: flex;
+  align-items: center;
+}
+
 .avatar-container {
   aspect-ratio: 1 / 1;
   background: no-repeat center center;
@@ -10,5 +15,4 @@
   border-radius: 50%;
   clip-path: circle(50% at 50% 50%);
   display: inline-block;
-  object-fit: cover;
 }
diff --git a/projects/gameboard-ui/src/app/core/components/avatar/avatar.component.ts b/projects/gameboard-ui/src/app/core/components/avatar/avatar.component.ts
index 17acf94a..5960492d 100644
--- a/projects/gameboard-ui/src/app/core/components/avatar/avatar.component.ts
+++ b/projects/gameboard-ui/src/app/core/components/avatar/avatar.component.ts
@@ -1,5 +1,6 @@
 import { Component, ElementRef, Input, OnChanges, SimpleChanges, ViewChild } from '@angular/core';
 import { SafeUrl } from '@angular/platform-browser';
+import { PlacementForBs5 } from 'ngx-bootstrap/positioning';
 
 export type AvatarSize = 'tiny' | 'small' | 'medium' | 'large';
 
@@ -10,12 +11,13 @@ export type AvatarSize = 'tiny' | 'small' | 'medium' | 'large';
     <ng-template #tolTemplate>
       <ng-content [select]="avatarTooltip"></ng-content>
     </ng-template>
-    <div [class]="'avatar-container avatar-size ' + this.sizeClass" [style.background-image]="escapedImgUrl" [tooltip]="tolTemplate"></div>
+    <div [class]="'avatar-container avatar-size ' + this.sizeClass" [style.background-image]="escapedImgUrl" [tooltip]="tolTemplate" [placement]="tooltipPlacement"></div>
   `,
 })
 export class AvatarComponent implements OnChanges {
   @Input() imageUrl?: SafeUrl;
   @Input() size: AvatarSize = "medium";
+  @Input() tooltipPlacement = PlacementForBs5.top;
 
   @ViewChild("searchBox") searchBox?: ElementRef<Input>;
 
diff --git a/projects/gameboard-ui/src/app/core/components/modal/modal-confirm.component.ts b/projects/gameboard-ui/src/app/core/components/modal/modal-confirm.component.ts
index 87f06f22..de698bbf 100644
--- a/projects/gameboard-ui/src/app/core/components/modal/modal-confirm.component.ts
+++ b/projects/gameboard-ui/src/app/core/components/modal/modal-confirm.component.ts
@@ -9,7 +9,7 @@ import { ModalConfirmConfig } from '@/core/components/modal/modal.models';
       <div class="modal-header">
           <div class="titles-container">
             <h4 class="modal-title pull-left">{{ context.title }}</h4>
-            <h5 *ngIf="context.subtitle" class="gray-text">{{ context.subtitle }}</h5>
+            <h5 *ngIf="context.subtitle" class="text-muted">{{ context.subtitle }}</h5>
           </div>
           <button *ngIf="!context.hideCancel" type="button" class="btn-close close pull-right" aria-label="Close" (click)="cancel()">
               <span aria-hidden="true" class="visually-hidden">&times;</span>
diff --git a/projects/gameboard-ui/src/app/core/core.module.ts b/projects/gameboard-ui/src/app/core/core.module.ts
index 6ec66458..24453911 100644
--- a/projects/gameboard-ui/src/app/core/core.module.ts
+++ b/projects/gameboard-ui/src/app/core/core.module.ts
@@ -125,6 +125,7 @@ import { AuthInterceptor } from '@/utility/auth.interceptor';
 import { ObserverConsoleComponent } from './components/observer-console/observer-console.component';
 import { TicketLabelPickerComponent } from './components/ticket-label-picker/ticket-label-picker.component';
 import { GameMapImageUrlPipe } from './pipes/game-map-image-url.pipe';
+import { UserNavItemComponent } from '@/standalone/user/components/user-nav-item/user-nav-item.component';
 
 const PUBLIC_DECLARATIONS = [
   AbsoluteValuePipe,
@@ -281,9 +282,10 @@ const RELAYED_MODULES = [
     IfHasPermissionDirective
   ],
   exports: [
+    CommonModule,
     ...RELAYED_MODULES,
     ...PUBLIC_DECLARATIONS,
-    IfHasPermissionDirective
+    IfHasPermissionDirective,
   ]
 })
 export class CoreModule { }
diff --git a/projects/gameboard-ui/src/app/core/pipes/countdown-color.pipe.ts b/projects/gameboard-ui/src/app/core/pipes/countdown-color.pipe.ts
index 08298a68..11ade07d 100644
--- a/projects/gameboard-ui/src/app/core/pipes/countdown-color.pipe.ts
+++ b/projects/gameboard-ui/src/app/core/pipes/countdown-color.pipe.ts
@@ -6,8 +6,8 @@ export class CountdownColorPipe implements PipeTransform {
   startSecondsAtMinute: number = 5; // default to 5 minutes
 
   constructor(config?: ConfigService) {
-    if ((config?.settings.countdownStartSecondsAtMinute ?? 0) > 0) // lowest allowed setting is 1 min
-      this.startSecondsAtMinute = config?.settings.countdownStartSecondsAtMinute!;
+    if ((config?.environment.settings.countdownStartSecondsAtMinute ?? 0) > 0) // lowest allowed setting is 1 min
+      this.startSecondsAtMinute = config?.environment.settings.countdownStartSecondsAtMinute!;
   }
 
   transform(value: number | undefined, ...args: unknown[]): string {
diff --git a/projects/gameboard-ui/src/app/core/pipes/countdown.pipe.ts b/projects/gameboard-ui/src/app/core/pipes/countdown.pipe.ts
index 72c2b55f..067733fd 100644
--- a/projects/gameboard-ui/src/app/core/pipes/countdown.pipe.ts
+++ b/projects/gameboard-ui/src/app/core/pipes/countdown.pipe.ts
@@ -9,8 +9,8 @@ export class CountdownPipe implements PipeTransform {
   startSecondsAtMinute = 5; // default to 5 minutes
 
   constructor(config?: ConfigService) {
-    if ((config?.settings.countdownStartSecondsAtMinute ?? 0) > 0) // lowest allowed setting is 1 min
-      this.startSecondsAtMinute = config?.settings.countdownStartSecondsAtMinute!;
+    if ((config?.environment.settings.countdownStartSecondsAtMinute ?? 0) > 0) // lowest allowed setting is 1 min
+      this.startSecondsAtMinute = config?.environment.settings.countdownStartSecondsAtMinute!;
   }
 
   transform(value: number | null | undefined): string {
diff --git a/projects/gameboard-ui/src/app/event-horizon/components/event-horizon-modal/event-horizon-modal.component.ts b/projects/gameboard-ui/src/app/event-horizon/components/event-horizon-modal/event-horizon-modal.component.ts
index 400625bd..5a0e1185 100644
--- a/projects/gameboard-ui/src/app/event-horizon/components/event-horizon-modal/event-horizon-modal.component.ts
+++ b/projects/gameboard-ui/src/app/event-horizon/components/event-horizon-modal/event-horizon-modal.component.ts
@@ -8,7 +8,7 @@ import { Component } from '@angular/core';
       <div class="modal-header">
           <div class="titles-container">
             <h4 class="modal-title pull-left">{{ team?.name }}</h4>
-            <h5 class="gray-text">Challenge Timeline: {{game?.name}}</h5>
+            <h5 class="text-muted">Challenge Timeline: {{game?.name}}</h5>
           </div>
           <button type="button" class="btn-close close pull-right" aria-label="Close" (click)="close()">
               <span aria-hidden="true" class="visually-hidden">&times;</span>
diff --git a/projects/gameboard-ui/src/app/game/components/session-start-countdown/session-start-countdown.component.html b/projects/gameboard-ui/src/app/game/components/session-start-countdown/session-start-countdown.component.html
index b1ec5a93..62201ef0 100644
--- a/projects/gameboard-ui/src/app/game/components/session-start-countdown/session-start-countdown.component.html
+++ b/projects/gameboard-ui/src/app/game/components/session-start-countdown/session-start-countdown.component.html
@@ -4,7 +4,7 @@
         <app-game-card [game]="ctx.game"></app-game-card>
     </div>
     <div class="game-detail-panel">
-        <h2 class="gray-text fw-bold">Your game is starting...</h2>
+        <h2 class="text-muted fw-bold">Your game is starting...</h2>
         <h1>{{ctx.game.name}}</h1>
         <div class="detail-badges">
             <ul>
diff --git a/projects/gameboard-ui/src/app/game/pages/gameboard-page/gameboard-page.component.html b/projects/gameboard-ui/src/app/game/pages/gameboard-page/gameboard-page.component.html
index 87a816e3..7ebd7d24 100644
--- a/projects/gameboard-ui/src/app/game/pages/gameboard-page/gameboard-page.component.html
+++ b/projects/gameboard-ui/src/app/game/pages/gameboard-page/gameboard-page.component.html
@@ -20,7 +20,7 @@
 
     <div>
       <div class="col m-2 p-4">
-        <h3 class="font-weight-bold gray-text">To start a challenge, click a circle on the below gameboard:</h3>
+        <h3 class="font-weight-bold text-muted">To start a challenge, click a circle on the below gameboard:</h3>
       </div>
       <div class="row justify-content-center">
         <div class="mapbox col m-4 p-4">
diff --git a/projects/gameboard-ui/src/app/home/home-page/home-page.component.ts b/projects/gameboard-ui/src/app/home/home-page/home-page.component.ts
index 3d7e700f..8fbf1cde 100644
--- a/projects/gameboard-ui/src/app/home/home-page/home-page.component.ts
+++ b/projects/gameboard-ui/src/app/home/home-page/home-page.component.ts
@@ -13,6 +13,6 @@ export class HomePageComponent {
   appname = '';
 
   constructor(config: ConfigService) {
-    this.appname = config.settings.appname || 'Gameboard';
+    this.appname = config.environment.settings.appname || 'Gameboard';
   }
 }
diff --git a/projects/gameboard-ui/src/app/home/home.module.ts b/projects/gameboard-ui/src/app/home/home.module.ts
index c3286b70..919a63e5 100644
--- a/projects/gameboard-ui/src/app/home/home.module.ts
+++ b/projects/gameboard-ui/src/app/home/home.module.ts
@@ -46,7 +46,7 @@ import { RegistrationTypeToIsOpenPipe } from './pipes/registration-type-to-is-op
     CoreModule,
     UtilityModule,
     FontAwesomeModule,
-    MarkdownModule
+    MarkdownModule,
   ]
 })
 export class HomeModule { }
diff --git a/projects/gameboard-ui/src/app/home/oidc/oidc.component.ts b/projects/gameboard-ui/src/app/home/oidc/oidc.component.ts
index 00e559db..7eb5d314 100644
--- a/projects/gameboard-ui/src/app/home/oidc/oidc.component.ts
+++ b/projects/gameboard-ui/src/app/home/oidc/oidc.component.ts
@@ -1,7 +1,7 @@
 // Copyright 2021 Carnegie Mellon University. All Rights Reserved.
 // Released under a MIT (SEI)-style license. See LICENSE.md in the project root for license information.
 
-import { Component } from '@angular/core';
+import { Component, inject, OnInit } from '@angular/core';
 import { Router } from '@angular/router';
 import { timer } from 'rxjs';
 import { AuthService } from '../../utility/auth.service';
@@ -12,26 +12,32 @@ import { LogService } from '../../services/log.service';
   templateUrl: './oidc.component.html',
   styleUrls: ['./oidc.component.scss']
 })
-export class OidcComponent {
-  message = '';
+export class OidcComponent implements OnInit {
+  private authService = inject(AuthService);
+  private log = inject(LogService);
+  private router = inject(Router);
 
-  constructor(
-    auth: AuthService,
-    log: LogService,
-    router: Router,
-  ) {
+  protected message = '';
 
-    auth.externalLoginCallback().then(
-      (user) => {
+  async ngOnInit() {
+    try {
+      const user = await this.authService.loginCallback();
+
+      if (user) {
+        this.log.logInfo("User authed", user);
+      }
+
+      const redirectToUrl = (user?.state as any)?.redirectTo?.toString();
+      if (redirectToUrl) {
         timer(500).subscribe(() => {
-          router.navigateByUrl("" + user.state || '/');
+          this.router.navigateByUrl(redirectToUrl);
         });
-      },
-      (err) => {
-        const message = (err.error || err).message;
-        log.logError("Error on OIDC callback:", message, err);
-        this.message = message;
       }
-    );
+    }
+    catch (err) {
+      const message = (err as any)?.message || err;
+      this.log.logError("Error on OIDC callback:", message, err);
+      this.message = message;
+    }
   }
 }
diff --git a/projects/gameboard-ui/src/app/prac/components/practice-challenge-list/practice-challenge-list.component.html b/projects/gameboard-ui/src/app/prac/components/practice-challenge-list/practice-challenge-list.component.html
index 06ef2357..307d3fc0 100644
--- a/projects/gameboard-ui/src/app/prac/components/practice-challenge-list/practice-challenge-list.component.html
+++ b/projects/gameboard-ui/src/app/prac/components/practice-challenge-list/practice-challenge-list.component.html
@@ -9,7 +9,11 @@ <h1 class="mb-4">Practice Area</h1>
         <ng-container *ngIf="!(localUser$ | async)">
             <alert type="warning">
                 You haven't logged in yet - you'll need to do so before you can play practice challenges.
-                <a [routerLink]="profileRouterLink">Log in</a> to start honing your skills!
+                <span role="button" class="fw-bold text-underline cursor-pointer" (click)="handleLogIn()">
+                    Log in
+                </span>
+
+                to start honing your skills!
             </alert>
         </ng-container>
         <ng-container *ngIf="(localUser$ | async) && !(hasSponsor$ | async)">
@@ -28,7 +32,7 @@ <h2>Need a place to start?</h2>
                 [searches]="suggestedSearches"></app-suggested-searches>
         </div>
 
-        <div class="input-group input-group-sm col-5 ml-auto mb-2 pr-0 mt-5">
+        <div class="input-group input-group-sm col-5 ml-auto mb-4 pr-0 mt-5">
             <app-share-button class="d-block mr-1" size="small" [disabled]="!term"
                 message="Copied a link to this search to your clipboard."
                 tooltip="Copy a link to this search"></app-share-button>
diff --git a/projects/gameboard-ui/src/app/prac/components/practice-challenge-list/practice-challenge-list.component.ts b/projects/gameboard-ui/src/app/prac/components/practice-challenge-list/practice-challenge-list.component.ts
index 507ce3fa..81c8bfe8 100644
--- a/projects/gameboard-ui/src/app/prac/components/practice-challenge-list/practice-challenge-list.component.ts
+++ b/projects/gameboard-ui/src/app/prac/components/practice-challenge-list/practice-challenge-list.component.ts
@@ -10,6 +10,7 @@ import { UserService as LocalUserService } from "@/utility/user.service";
 import { slug } from '@/../tools/functions';
 import { ApiUser } from '@/api/user-models';
 import { UnsubscriberService } from '@/services/unsubscriber.service';
+import { AuthService } from '@/utility/auth.service';
 
 @Component({
   selector: 'app-practice-challenge-list',
@@ -43,6 +44,7 @@ export class PracticeChallengeListComponent {
     localUser: LocalUserService,
     route: ActivatedRoute,
     private api: PracticeService,
+    private authService: AuthService,
     private routerService: RouterService,
     private unsub: UnsubscriberService
   ) {
@@ -99,4 +101,8 @@ export class PracticeChallengeListComponent {
       }
     });
   }
+
+  protected async handleLogIn() {
+    await this.authService.login(this.routerService.getPracticeAreaUrl().toString());
+  }
 }
diff --git a/projects/gameboard-ui/src/app/prac/components/practice-challenge-solved-modal/practice-challenge-solved-modal.component.html b/projects/gameboard-ui/src/app/prac/components/practice-challenge-solved-modal/practice-challenge-solved-modal.component.html
index 8c78633f..27fc7306 100644
--- a/projects/gameboard-ui/src/app/prac/components/practice-challenge-solved-modal/practice-challenge-solved-modal.component.html
+++ b/projects/gameboard-ui/src/app/prac/components/practice-challenge-solved-modal/practice-challenge-solved-modal.component.html
@@ -30,7 +30,7 @@ <h2>Congratulations!</h2>
             <hr />
 
             <p>
-                <em class="gray-text">NOTE: </em>Your certificate displays the time you spent solving the challenge.
+                <em class="text-muted">NOTE: </em>Your certificate displays the time you spent solving the challenge.
                 This time is based on your <strong>first</strong> completion of a given challenge. Subsequent attempts
                 don't change your solve time.
             </p>
diff --git a/projects/gameboard-ui/src/app/prac/components/practice-page/practice-page.component.ts b/projects/gameboard-ui/src/app/prac/components/practice-page/practice-page.component.ts
index 6ad1beae..05b60cc8 100644
--- a/projects/gameboard-ui/src/app/prac/components/practice-page/practice-page.component.ts
+++ b/projects/gameboard-ui/src/app/prac/components/practice-page/practice-page.component.ts
@@ -11,6 +11,6 @@ export class PracticePageComponent {
 
   constructor(
     configService: ConfigService) {
-    this.appName = configService.settings.appname || "Gameboard";
+    this.appName = configService.environment.settings.appname || "Gameboard";
   }
 }
diff --git a/projects/gameboard-ui/src/app/reports/components/reports/report-base.component.ts b/projects/gameboard-ui/src/app/reports/components/reports/report-base.component.ts
index b564c6c9..703e579a 100644
--- a/projects/gameboard-ui/src/app/reports/components/reports/report-base.component.ts
+++ b/projects/gameboard-ui/src/app/reports/components/reports/report-base.component.ts
@@ -1,4 +1,4 @@
-import { Component, OnInit, inject } from "@angular/core";
+import { Component, inject } from "@angular/core";
 import { ReportViewUpdate } from "../../reports-models";
 import { ActiveReportService } from "@/reports/services/active-report.service";
 import { PagingArgs } from "@/api/models";
diff --git a/projects/gameboard-ui/src/app/services/external-game.service.ts b/projects/gameboard-ui/src/app/services/external-game.service.ts
index 78d2d4a3..cd40e10d 100644
--- a/projects/gameboard-ui/src/app/services/external-game.service.ts
+++ b/projects/gameboard-ui/src/app/services/external-game.service.ts
@@ -38,7 +38,7 @@ export class ExternalGameService {
     this.log.logInfo(`Retrieved external game data:`, externalTeamData);
 
     this.log.logInfo("Resolving OIDC storage keys...");
-    const oidcLink = `oidc.user:${this.config.settings.oidc.authority}:${this.config.settings.oidc.client_id}`;
+    const oidcLink = `oidc.user:${this.config.environment.settings.oidc.authority}:${this.config.environment.settings.oidc.client_id}`;
 
     this.log.logInfo("Committing external url and OIDC key to local storage", externalTeamData.externalUrl, oidcLink);
     this.storage.addArbitrary(teamNamespaceKeyName, JSON.stringify({
diff --git a/projects/gameboard-ui/src/app/services/router.service.ts b/projects/gameboard-ui/src/app/services/router.service.ts
index ad9a3737..b5493f82 100644
--- a/projects/gameboard-ui/src/app/services/router.service.ts
+++ b/projects/gameboard-ui/src/app/services/router.service.ts
@@ -10,6 +10,7 @@ import { ConfigService } from '@/utility/config.service';
 import { UserService as LocalUser } from '@/utility/user.service';
 import { slug } from "@/../tools/functions";
 import { GameCenterTab } from '@/admin/components/game-center/game-center.models';
+import { WindowService } from './window.service';
 
 export interface QueryParamsUpdate {
   parameters?: Params,
@@ -25,8 +26,9 @@ export class RouterService implements OnDestroy {
     private config: ConfigService,
     private localUser: LocalUser,
     public route: ActivatedRoute,
-    public router: Router,
-    private objectService: ObjectService) { }
+    private router: Router,
+    private objectService: ObjectService,
+    private windowService: WindowService) { }
 
   public getCurrentPathBase(): string {
     const urlTree = this.router.parseUrl(this.router.url);
@@ -60,6 +62,14 @@ export class RouterService implements OnDestroy {
     return `/user/${localUserId}/certificates/${mode}/${challengeSpecOrGameId}`;
   }
 
+  public getCertificateListUrl() {
+    return "user/certificates";
+  }
+
+  public getLocation() {
+    return this.router.url;
+  }
+
   public getGameCenterUrl(gameId: string, tab?: GameCenterTab) {
     return this.router.parseUrl(`/admin/game/${gameId}` + (tab ? '/' + tab : ""));
   }
@@ -72,8 +82,18 @@ export class RouterService implements OnDestroy {
     return `admin/observer/teams/${gameId}?search=${teamId}`;
   }
 
-  public getPracticeAreaWithSearchUrl(searchTerm: string) {
-    return this.router.createUrlTree(["practice"], { queryParams: { term: searchTerm } });
+  public getPlayHistoryUrl() {
+    return "user/profile/history";
+  }
+
+  public getPracticeAreaUrl(searchTerm?: string) {
+    const params: Params = {};
+
+    if (searchTerm) {
+      params.term = searchTerm;
+    }
+
+    return this.router.createUrlTree(["practice"], { queryParams: params });
   }
 
   public getProfileUrl() {
@@ -97,7 +117,7 @@ export class RouterService implements OnDestroy {
   }
 
   public toPracticeAreaWithSearch(search: string) {
-    return this.router.navigateByUrl(this.getPracticeAreaWithSearchUrl(search));
+    return this.router.navigateByUrl(this.getPracticeAreaUrl(search));
   }
 
   public toPracticeCertificates() {
diff --git a/projects/gameboard-ui/src/app/standalone/components/game-info-bubbles/game-info-bubbles.component.ts b/projects/gameboard-ui/src/app/standalone/components/game-info-bubbles/game-info-bubbles.component.ts
index 8e71ea5b..07af8cfc 100644
--- a/projects/gameboard-ui/src/app/standalone/components/game-info-bubbles/game-info-bubbles.component.ts
+++ b/projects/gameboard-ui/src/app/standalone/components/game-info-bubbles/game-info-bubbles.component.ts
@@ -31,7 +31,7 @@ export interface GameInfoBubbleProperties {
   ],
   styles: [
     "fa-icon { vertical-align: middle; }",
-    "li { margin-right: 1rem; padding: 0; text-align: center; vertical-align: middle; }",
+    "li { display: block; margin-right: 1rem; padding: 0; text-align: center; vertical-align: middle; }",
     "img { object-fit: contain }",
     ".team-icon path { stroke: #00ffff; fill: #00ffff } "
   ],
diff --git a/projects/gameboard-ui/src/app/standalone/directives/if-has-permission.directive.ts b/projects/gameboard-ui/src/app/standalone/directives/if-has-permission.directive.ts
index d0ac0328..db1095f6 100644
--- a/projects/gameboard-ui/src/app/standalone/directives/if-has-permission.directive.ts
+++ b/projects/gameboard-ui/src/app/standalone/directives/if-has-permission.directive.ts
@@ -1,12 +1,12 @@
 import { Directive, Input, OnChanges, SimpleChanges, TemplateRef, ViewContainerRef } from '@angular/core';
-import { UserService } from '@/utility/user.service';
+import { UserService as LocalUserService } from '@/utility/user.service';
 import { UserRolePermissionKey } from '@/api/user-role-permissions.models';
 import { UnsubscriberService } from '@/services/unsubscriber.service';
 import { UserRolePermissionsService } from '@/api/user-role-permissions.service';
 import { ApiUser } from '@/api/user-models';
 
 @Directive({
-  providers: [UnsubscriberService, UserService],
+  providers: [UnsubscriberService, LocalUserService],
   selector: '[appIfHasPermission]',
   standalone: true
 })
@@ -15,7 +15,7 @@ export class IfHasPermissionDirective implements OnChanges {
   @Input('[appIfHasPermission]') private requiredPermission?: UserRolePermissionKey;
 
   constructor(
-    private localUser: UserService,
+    private localUser: LocalUserService,
     private permissionsService: UserRolePermissionsService,
     private templateRef: TemplateRef<any>,
     private unsub: UnsubscriberService,
diff --git a/projects/gameboard-ui/src/app/standalone/user/components/user-nav-item/user-nav-item.component.html b/projects/gameboard-ui/src/app/standalone/user/components/user-nav-item/user-nav-item.component.html
new file mode 100644
index 00000000..131c0595
--- /dev/null
+++ b/projects/gameboard-ui/src/app/standalone/user/components/user-nav-item/user-nav-item.component.html
@@ -0,0 +1,43 @@
+<div class="btn-group" dropdown *ngIf="localUser$ | async as localUser; else unauthed">
+    <button [routerLink]="profileLinks?.profile" type="button" class="btn btn-success">
+        <div class="d-flex align-items-center">
+            <app-avatar class="mr-2" size="tiny" [imageUrl]="localUser.sponsor | sponsorToLogoUri">
+                <div avatarTooltip>
+                    <div>{{ localUser.sponsor.name }}</div>
+                </div>
+            </app-avatar>
+            <div class="nav-link-text">
+                Hi,
+                <strong>{{localUser.approvedName}}</strong>!
+            </div>
+        </div>
+    </button>
+    <button id="button-split" type="button" dropdownToggle class="btn btn-success dropdown-toggle dropdown-toggle-split"
+        aria-controls="dropdown-split">
+        <span class="caret"></span>
+        <span class="sr-only visually-hidden">User Menu</span>
+    </button>
+    <ul id="dropdown-split" *dropdownMenu class="dropdown-menu width-100" role="menu" aria-labelledby="button-split">
+        <ng-container *ngIf="profileLinks">
+            <li role="menuitem">
+                <a [routerLink]="profileLinks.profile" class="dropdown-item">Name &amp; Sponsor</a>
+            </li>
+            <li role="menuitem">
+                <a [routerLink]="profileLinks.certificates" class="dropdown-item">Certificates</a>
+            </li>
+            <li role="menuitem">
+                <a [routerLink]="profileLinks.history" class="dropdown-item">History</a>
+            </li>
+        </ng-container>
+        <li class="divider dropdown-divider"></li>
+        <li role="menuitem">
+            <span class="dropdown-item cursor-pointer" (click)="handleLogOut()">Log out</span>
+        </li>
+    </ul>
+</div>
+
+<ng-template #unauthed>
+    <a class="nav-link-text cursor-pointer mr-2" (click)="handleLogIn()">
+        Log in
+    </a>
+</ng-template>
diff --git a/projects/gameboard-ui/src/app/standalone/user/components/user-nav-item/user-nav-item.component.scss b/projects/gameboard-ui/src/app/standalone/user/components/user-nav-item/user-nav-item.component.scss
new file mode 100644
index 00000000..686d200b
--- /dev/null
+++ b/projects/gameboard-ui/src/app/standalone/user/components/user-nav-item/user-nav-item.component.scss
@@ -0,0 +1,11 @@
+@import "../../../../../scss/variables";
+
+.nav-link-text {
+  display: block;
+  font-size: 1.5rem;
+
+  a.active {
+    color: $body-color !important;
+    text-decoration: underline;
+  }
+}
diff --git a/projects/gameboard-ui/src/app/standalone/user/components/user-nav-item/user-nav-item.component.ts b/projects/gameboard-ui/src/app/standalone/user/components/user-nav-item/user-nav-item.component.ts
new file mode 100644
index 00000000..d0f00546
--- /dev/null
+++ b/projects/gameboard-ui/src/app/standalone/user/components/user-nav-item/user-nav-item.component.ts
@@ -0,0 +1,53 @@
+import { Component, inject, OnInit } from '@angular/core';
+import { RouterModule } from '@angular/router';
+import { CoreModule } from '@/core/core.module';
+import { RouterService } from '@/services/router.service';
+import { AuthService } from '@/utility/auth.service';
+import { UserService as LocalUserService } from '@/utility/user.service';
+import { ModalConfirmService } from '@/services/modal-confirm.service';
+
+@Component({
+  selector: 'app-user-nav-item',
+  standalone: true,
+  imports: [
+    CoreModule,
+    RouterModule,
+  ],
+  templateUrl: './user-nav-item.component.html',
+  styleUrls: ['./user-nav-item.component.scss']
+})
+export class UserNavItemComponent implements OnInit {
+  private authService = inject(AuthService);
+  private localUser = inject(LocalUserService);
+  private modalService = inject(ModalConfirmService);
+  private routerService = inject(RouterService);
+
+  protected localUser$ = this.localUser.user$.asObservable();
+  protected profileLinks?: {
+    certificates: string;
+    history: string;
+    profile: string;
+  };
+
+  async ngOnInit() {
+    this.profileLinks = {
+      certificates: this.routerService.getCertificateListUrl(),
+      history: this.routerService.getPlayHistoryUrl(),
+      profile: this.routerService.getProfileUrl()
+    };
+  }
+
+  protected async handleLogIn() {
+    await this.authService.login(this.routerService.getLocation());
+  }
+
+  protected handleLogOut() {
+    this.modalService.openConfirm({
+      title: "Log out?",
+      subtitle: this.localUser.user$.value?.approvedName || "",
+      bodyContent: "Everyone needs a break. Are you sure you want to **log out** now?",
+      renderBodyAsMarkdown: true,
+      onConfirm: () => this.authService.logout()
+    });
+  }
+}
diff --git a/projects/gameboard-ui/src/app/support/components/ticket-support-tools/ticket-support-tools.component.ts b/projects/gameboard-ui/src/app/support/components/ticket-support-tools/ticket-support-tools.component.ts
index 6e45ecc5..d4698ec3 100644
--- a/projects/gameboard-ui/src/app/support/components/ticket-support-tools/ticket-support-tools.component.ts
+++ b/projects/gameboard-ui/src/app/support/components/ticket-support-tools/ticket-support-tools.component.ts
@@ -61,7 +61,7 @@ export interface TicketSupportToolsContext {
     </li>
   </ul>
   <ng-template #noGameContext>
-    <div class="gray-text">
+    <div class="text-muted">
       Attach this ticket to a game or challenge to use these tools.
     </div>
   </ng-template>
diff --git a/projects/gameboard-ui/src/app/users/components/practice-certificates/practice-certificates.component.html b/projects/gameboard-ui/src/app/users/components/practice-certificates/practice-certificates.component.html
index e1af7f56..c0e9f6d4 100644
--- a/projects/gameboard-ui/src/app/users/components/practice-certificates/practice-certificates.component.html
+++ b/projects/gameboard-ui/src/app/users/components/practice-certificates/practice-certificates.component.html
@@ -47,7 +47,7 @@
 </ng-template>
 
 <ng-template #noCertificates>
-    <p class="text-center gray-text">
+    <p class="text-center text-muted">
         You haven't earned any practice challenge certificates yet. Why not head over to
         <a [routerLink]="['/practice']">the Practice area</a> and try a challenge or two?
     </p>
diff --git a/projects/gameboard-ui/src/app/users/components/profile-editor/profile-editor.component.html b/projects/gameboard-ui/src/app/users/components/profile-editor/profile-editor.component.html
index 58f11e4b..a4e211f6 100644
--- a/projects/gameboard-ui/src/app/users/components/profile-editor/profile-editor.component.html
+++ b/projects/gameboard-ui/src/app/users/components/profile-editor/profile-editor.component.html
@@ -9,7 +9,6 @@ <h2>Your display name</h2>
             Choose a <em>default</em> name for public display that is suitable for all audiences. This name will apply
             to <em>all new games</em>, but you can customize it during registration.
         </div>
-        <br>
 
         <ng-container *ngIf="currentUser.name && currentUser.name !== currentUser.approvedName">
             <ng-container *ngIf="currentUser.nameStatus == 'pending' && currentUser.name != disallowedName">
diff --git a/projects/gameboard-ui/src/app/users/components/profile-editor/profile-editor.component.ts b/projects/gameboard-ui/src/app/users/components/profile-editor/profile-editor.component.ts
index 7eab1d02..21733e51 100644
--- a/projects/gameboard-ui/src/app/users/components/profile-editor/profile-editor.component.ts
+++ b/projects/gameboard-ui/src/app/users/components/profile-editor/profile-editor.component.ts
@@ -54,8 +54,6 @@ export class ProfileEditorComponent {
         }
       })
     );
-
-    this.userSvc.refresh();
   }
 
   async updateUserName(name: string): Promise<void> {
diff --git a/projects/gameboard-ui/src/app/users/components/settings/settings.component.html b/projects/gameboard-ui/src/app/users/components/settings/settings.component.html
index 54588ac5..3a546fd0 100644
--- a/projects/gameboard-ui/src/app/users/components/settings/settings.component.html
+++ b/projects/gameboard-ui/src/app/users/components/settings/settings.component.html
@@ -15,7 +15,7 @@ <h3>Browser Notifications</h3>
 
         <button class="btn btn-lg btn-success my-4" (click)="showTestNotification()">Show a test notification</button>
 
-        <p class="fs-09 gray-text">
+        <p class="fs-09 text-muted">
             Still not seeing notifications? Some operating systems require you to specifically enable notifications from
             your browser application in order to see them. Refer to vendor-maintained documentation for
 
diff --git a/projects/gameboard-ui/src/app/users/components/user-page/user-page.component.ts b/projects/gameboard-ui/src/app/users/components/user-page/user-page.component.ts
index bf74641a..96bf1912 100644
--- a/projects/gameboard-ui/src/app/users/components/user-page/user-page.component.ts
+++ b/projects/gameboard-ui/src/app/users/components/user-page/user-page.component.ts
@@ -16,6 +16,6 @@ export class UserPageComponent {
   constructor(
     config: ConfigService,
     localUser: LocalUserService) {
-    this.appName = config.settings.appname || "Gameboard";
+    this.appName = config.environment.settings.appname || "Gameboard";
   }
 }
diff --git a/projects/gameboard-ui/src/app/utility/auth.guard.ts b/projects/gameboard-ui/src/app/utility/auth.guard.ts
index bdf06277..961f3a11 100644
--- a/projects/gameboard-ui/src/app/utility/auth.guard.ts
+++ b/projects/gameboard-ui/src/app/utility/auth.guard.ts
@@ -29,8 +29,7 @@ export class AuthGuard implements CanActivate, CanActivateChild {
   private validateAuth(url: string): Observable<boolean | UrlTree> {
     return this.auth.tokenState$.pipe(
       map(t => t === AuthTokenState.valid),
-      tap(v => this.auth.redirectUrl = v ? this.auth.redirectUrl : url),
-      map(v => v ? v : this.router.parseUrl('/login'))
+      map(v => v ? v : this.router.parseUrl(`/login?redirectTo=${url}`))
     );
   }
 }
diff --git a/projects/gameboard-ui/src/app/utility/auth.interceptor.ts b/projects/gameboard-ui/src/app/utility/auth.interceptor.ts
index 38d8d3bf..e5535002 100644
--- a/projects/gameboard-ui/src/app/utility/auth.interceptor.ts
+++ b/projects/gameboard-ui/src/app/utility/auth.interceptor.ts
@@ -1,14 +1,14 @@
 // Copyright 2021 Carnegie Mellon University. All Rights Reserved.
 // Released under a MIT (SEI)-style license. See LICENSE.md in the project root for license information.
 
-import { Injectable, Injector } from '@angular/core';
+import { inject, Injectable } from '@angular/core';
 import { HttpEvent, HttpInterceptor, HttpHandler, HttpRequest } from '@angular/common/http';
 import { Observable } from 'rxjs';
 import { AuthService } from './auth.service';
 
 @Injectable()
 export class AuthInterceptor implements HttpInterceptor {
-    constructor(private injector: Injector) { }
+    private _authService = inject(AuthService);
 
     intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
         if (req.url.match(/assets/)) {
@@ -18,7 +18,7 @@ export class AuthInterceptor implements HttpInterceptor {
         return next.handle(
             req.clone({
                 setHeaders: {
-                    Authorization: this.injector.get(AuthService).auth_header()
+                    Authorization: this._authService.auth_header()
                 }
             })
         );
diff --git a/projects/gameboard-ui/src/app/utility/auth.service.ts b/projects/gameboard-ui/src/app/utility/auth.service.ts
index 7bd37a33..cf77d3e4 100644
--- a/projects/gameboard-ui/src/app/utility/auth.service.ts
+++ b/projects/gameboard-ui/src/app/utility/auth.service.ts
@@ -3,10 +3,11 @@
 
 import { Injectable } from '@angular/core';
 import { UserManager, UserManagerSettings, User, WebStorageStateStore, Log } from 'oidc-client-ts';
-import { BehaviorSubject, Observable, firstValueFrom } from 'rxjs';
+import { BehaviorSubject, Observable, timer } from 'rxjs';
 import { distinctUntilChanged, filter } from 'rxjs/operators';
-import { ConfigService, Settings } from './config.service';
+import { ConfigService } from './config.service';
 import { LogService } from '../services/log.service';
+import { EnvironmentSettings } from '../../environments/environment-typed';
 
 export enum AuthTokenState {
   unknown = 'unknown' as any,
@@ -20,7 +21,6 @@ export enum AuthTokenState {
 export class AuthService {
   mgr!: UserManager;
   authority = '';
-  redirectUrl = '';
   lastCall = 0;
   renewIfActiveSeconds = 0;
   oidcUser: (User | null) = null;
@@ -32,17 +32,22 @@ export class AuthService {
     private config: ConfigService,
     private log: LogService
   ) {
-    config.settings$.pipe(filter(s => !!s.oidc.authority)).subscribe((s: Settings) => {
+    config.settings$.pipe(filter(s => !!s.oidc.authority)).subscribe((s: EnvironmentSettings) => {
       if (s.oidc.debug) {
         Log.setLevel(Log.DEBUG);
         Log.setLogger(console);
       }
 
       this.authority = s
-        .oidc?.authority?.replace(/https?:\/\//, '').split('/').reverse().pop() || 'Identity Provider';
+        .oidc
+        ?.authority
+        ?.replace(/https?:\/\//, '')
+        .split('/')
+        .reverse()
+        .pop() || 'Identity Provider';
 
       if (s.oidc.useLocalStorage) {
-        (s.oidc.userStore as any) = new WebStorageStateStore({});
+        s.oidc.userStore = new WebStorageStateStore({});
       }
 
       this.mgr = new UserManager(s.oidc || {} as UserManagerSettings);
@@ -57,26 +62,58 @@ export class AuthService {
     });
   }
 
-  isAuthenticated(): Promise<boolean> {
-    const state = this._tokenState$.getValue();
-    return Promise.resolve(state === AuthTokenState.valid || state === AuthTokenState.expiring);
-  }
-
-  access_token(): string | null {
-    return ((this.oidcUser)
-      ? this.oidcUser.access_token
-      : null);
-  }
-
   auth_header(): string {
-    this.markAction();
+    this.lastCall = Date.now();
     return ((this.oidcUser)
       ? this.oidcUser.token_type + ' ' + this.oidcUser.access_token
       : 'no_token');
   }
 
-  markAction(): void {
-    this.lastCall = Date.now();
+  async login(redirectUrl?: string): Promise<void> {
+    const currentUrl = this.config.currentPath
+      .replace(/login$/, '')
+      .replace(/forbidden$/, '');
+
+    this.expireToken();
+    await this.mgr.signinRedirect({ state: { redirectTo: redirectUrl || currentUrl } });
+  }
+
+  async loginCallback(url?: string): Promise<User> {
+    return await this.mgr.signinRedirectCallback(url);
+  }
+
+  async isLoggedIn() {
+    try {
+      const session = await this.mgr.querySessionStatus();
+    }
+    catch (err) {
+      return false;
+    }
+
+    return true;
+  }
+
+  logout(): void {
+    if (this.oidcUser && this._tokenState$.getValue() === AuthTokenState.valid) {
+      if (this.config.environment.settings.oidc.autoLogout) {
+        this.mgr.signoutRedirect()
+          .then(() => { })
+          .catch(err => {
+            this.log.logError(`Error on logout: ${err.text()}`);
+          });
+      } else {
+        this.onTokenExpired();
+      }
+    }
+  }
+
+  silentLogin(): void {
+    this.mgr.signinSilent()
+      .catch(err => this.expireToken());
+  }
+
+  expireToken(): void {
+    this.mgr.removeUser();
   }
 
   private onTokenLoaded(user: (User | null)): void {
@@ -108,45 +145,11 @@ export class AuthService {
   }
 
   private onRenewError(err: Error): void {
+    this.log.logWarning(`Token renew error: ${JSON.stringify(err)}`);
     this.expireToken();
   }
 
   private onUserSignedIn(): void {
     this.log.logInfo("User signed in", this.oidcUser);
   }
-
-  externalLogin(url: string): void {
-    const currentUrl = this.config.currentPath
-      .replace(/login$/, '')
-      .replace(/forbidden$/, '');
-
-    this.expireToken();
-
-    this.mgr.signinRedirect({ state: this.redirectUrl || currentUrl })
-      .then(() => this.log.logInfo("User authenticated", this.oidcUser))
-      .catch(err => this.log.logError(err));
-  }
-
-  async externalLoginCallback(url?: string): Promise<User> {
-    return await this.mgr.signinRedirectCallback(url);
-  }
-
-  logout(): void {
-    if (this.oidcUser && this._tokenState$.getValue() === AuthTokenState.valid) {
-      this.mgr.signoutRedirect()
-        .then(() => { })
-        .catch(err => {
-          this.log.logError(`Error on logout: ${err.text()}`);
-        });
-    }
-  }
-
-  silentLogin(): void {
-    this.mgr.signinSilent()
-      .catch(err => this.expireToken());
-  }
-
-  expireToken(): void {
-    this.mgr.removeUser();
-  }
 }
diff --git a/projects/gameboard-ui/src/app/utility/components/login/login.component.ts b/projects/gameboard-ui/src/app/utility/components/login/login.component.ts
index bcbe1f0b..fcbf3c0a 100644
--- a/projects/gameboard-ui/src/app/utility/components/login/login.component.ts
+++ b/projects/gameboard-ui/src/app/utility/components/login/login.component.ts
@@ -3,7 +3,8 @@
 
 import { Component, } from '@angular/core';
 import { fa } from '@/services/font-awesome.service';
-import { AuthService, AuthTokenState } from '@/utility/auth.service';
+import { AuthService } from '@/utility/auth.service';
+import { ActivatedRoute } from '@angular/router';
 
 @Component({
   selector: 'app-login',
@@ -16,12 +17,13 @@ export class LoginComponent {
   working = false;
 
   constructor(
-    private auth: AuthService) {
+    private auth: AuthService,
+    private route: ActivatedRoute) {
     this.authority = auth.authority;
   }
 
-  login(): void {
+  async login(): Promise<void> {
     this.working = true;
-    this.auth.externalLogin(this.auth.redirectUrl);
+    await this.auth.login(this.route.snapshot.queryParamMap.get("redirectTo") || "/");
   }
 }
diff --git a/projects/gameboard-ui/src/app/utility/config.service.ts b/projects/gameboard-ui/src/app/utility/config.service.ts
index a1f8b5ee..a71e0bdd 100644
--- a/projects/gameboard-ui/src/app/utility/config.service.ts
+++ b/projects/gameboard-ui/src/app/utility/config.service.ts
@@ -12,6 +12,7 @@ import { LocalStorageService, StorageKey } from '../services/local-storage.servi
 import { LogService } from '../services/log.service';
 import { VmState } from '@/api/board-models';
 import { BrowserService } from '@/services/browser.service';
+import { Environment, EnvironmentSettings } from '../../environments/environment-typed';
 
 @Injectable({ providedIn: 'root' })
 export class ConfigService {
@@ -19,10 +20,10 @@ export class ConfigService {
   private url = environment.settingsJson;
   private restorationComplete = false;
   basehref = '';
-  settings: Settings = environment.settings;
+  environment: Environment = environment;
   local: LocalAppSettings = {};
   absoluteUrl = '';
-  settings$ = new BehaviorSubject<Settings>(this.settings);
+  settings$ = new BehaviorSubject<EnvironmentSettings>(this.environment.settings);
   sidebar$ = new Subject<boolean>();
 
   get lastUrl(): string {
@@ -91,7 +92,7 @@ export class ConfigService {
   }
 
   get apphost(): string {
-    let path = this.settings.apphost || this.basehref;
+    let path = this.environment.settings.apphost || this.basehref;
     if (!path.endsWith('/')) {
       path += '/';
     }
@@ -99,11 +100,11 @@ export class ConfigService {
   }
 
   get appName(): string {
-    return this.settings.appname || "Gameboard";
+    return this.environment.settings.appname || "Gameboard";
   }
 
   get mkshost(): string {
-    let path = this.settings.mkshost || `${this.basehref}mks`;
+    let path = this.environment.settings.mkshost || `${this.basehref}mks`;
     if (!path.endsWith('/')) {
       path += '/';
     }
@@ -111,15 +112,15 @@ export class ConfigService {
   }
 
   get imagehost(): string {
-    return this.settings.imghost || `${this.basehref}img`;
+    return this.environment.settings.imghost || `${this.basehref}img`;
   }
 
   get tochost(): string {
-    return this.settings.tochost || `${this.basehref}docs`;
+    return this.environment.settings.tochost || `${this.basehref}docs`;
   }
 
   get supporthost(): string {
-    return this.settings.supporthost || `${this.basehref}supportfiles`;
+    return this.environment.settings.supporthost || `${this.basehref}supportfiles`;
   }
 
   get shortdate_formatter(): any {
@@ -138,24 +139,24 @@ export class ConfigService {
     return new Date(this.local.lastSeenSupport!);
   }
 
-  load(): Observable<Settings> {
+  load(): Observable<EnvironmentSettings> {
     if (!environment.settingsJson) {
-      return of({} as Settings);
+      return of({} as EnvironmentSettings);
     }
 
-    return this.http.get<Settings>(this.basehref + this.url)
+    return this.http.get<EnvironmentSettings>(this.basehref + this.url)
       .pipe(
         catchError((err: Error) => {
-          return of({} as Settings);
+          return of({} as EnvironmentSettings);
         }),
         tap(s => {
           if (!s || Object.keys(s).length == 0) {
             this.log.logError(`Unable to load settings file from url ${this.basehref + this.url}`);
           }
           if (s) {
-            this.settings = { ...this.settings, ...s };
-            this.settings.oidc = { ...this.settings.oidc, ...s.oidc };
-            this.settings$.next(this.settings);
+            this.environment.settings = { ...this.environment.settings, ...s };
+            this.environment.settings.oidc = { ...this.environment.settings.oidc, ...s.oidc };
+            this.settings$.next(this.environment.settings);
           }
         })
       );
@@ -207,23 +208,12 @@ export interface LocalAppSettings {
   ticketOrderDesc?: boolean;
 }
 
-export interface Settings {
-  appname?: string;
-  apphost?: string;
-  mkshost?: string;
-  imghost?: string;
-  tochost?: string;
-  supporthost?: string;
-  tocfile?: string;
-  custom_background?: string;
-  countdownStartSecondsAtMinute?: number;
-  oidc: AppUserManagerSettings;
-}
-
 export interface AppUserManagerSettings extends UserManagerSettings {
   authority: string;
+  autoLogin: boolean;
+  autoLogout: boolean;
   client_id: string;
+  debug?: boolean;
   redirect_uri: string;
   useLocalStorage?: boolean;
-  debug?: boolean;
 }
diff --git a/projects/gameboard-ui/src/app/utility/user.service.ts b/projects/gameboard-ui/src/app/utility/user.service.ts
index 5bac1bbe..6120e1c4 100644
--- a/projects/gameboard-ui/src/app/utility/user.service.ts
+++ b/projects/gameboard-ui/src/app/utility/user.service.ts
@@ -49,12 +49,11 @@ export class UserService implements OnDestroy {
 
     auth.tokenState$.pipe(
       filter(t => t === AuthTokenState.expired),
-      tap(() => auth.redirectUrl = config.currentPath),
       switchMap(() => api.logout()),
       tap(() => this.log.logInfo("token expired"))
     ).subscribe(() => {
       this.user$.next(null);
-      router.navigate(['/login']);
+      router.navigate(['/login'], { queryParams: { redirectTo: config.currentPath } });
     });
 
     // log the login event for the current user (we track date of last login and total login count)
diff --git a/projects/gameboard-ui/src/assets/img/favicon/android-chrome-192x192.png b/projects/gameboard-ui/src/assets/img/favicon/android-chrome-192x192.png
new file mode 100644
index 00000000..088bcfea
Binary files /dev/null and b/projects/gameboard-ui/src/assets/img/favicon/android-chrome-192x192.png differ
diff --git a/projects/gameboard-ui/src/assets/img/favicon/android-chrome-512x512.png b/projects/gameboard-ui/src/assets/img/favicon/android-chrome-512x512.png
new file mode 100644
index 00000000..757f2735
Binary files /dev/null and b/projects/gameboard-ui/src/assets/img/favicon/android-chrome-512x512.png differ
diff --git a/projects/gameboard-ui/src/assets/img/favicon/apple-touch-icon.png b/projects/gameboard-ui/src/assets/img/favicon/apple-touch-icon.png
new file mode 100644
index 00000000..ac9574b6
Binary files /dev/null and b/projects/gameboard-ui/src/assets/img/favicon/apple-touch-icon.png differ
diff --git a/projects/gameboard-ui/src/assets/img/favicon/favicon-16x16.png b/projects/gameboard-ui/src/assets/img/favicon/favicon-16x16.png
new file mode 100644
index 00000000..3cc430ab
Binary files /dev/null and b/projects/gameboard-ui/src/assets/img/favicon/favicon-16x16.png differ
diff --git a/projects/gameboard-ui/src/assets/img/favicon/favicon-32x32.png b/projects/gameboard-ui/src/assets/img/favicon/favicon-32x32.png
new file mode 100644
index 00000000..8b91031e
Binary files /dev/null and b/projects/gameboard-ui/src/assets/img/favicon/favicon-32x32.png differ
diff --git a/projects/gameboard-ui/src/assets/img/favicon/favicon.ico b/projects/gameboard-ui/src/assets/img/favicon/favicon.ico
new file mode 100644
index 00000000..f9abddcd
Binary files /dev/null and b/projects/gameboard-ui/src/assets/img/favicon/favicon.ico differ
diff --git a/projects/gameboard-ui/src/assets/img/favicon/site.webmanifest b/projects/gameboard-ui/src/assets/img/favicon/site.webmanifest
new file mode 100644
index 00000000..45dc8a20
--- /dev/null
+++ b/projects/gameboard-ui/src/assets/img/favicon/site.webmanifest
@@ -0,0 +1 @@
+{"name":"","short_name":"","icons":[{"src":"/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],"theme_color":"#ffffff","background_color":"#ffffff","display":"standalone"}
\ No newline at end of file
diff --git a/projects/gameboard-ui/src/environments/environment-typed.ts b/projects/gameboard-ui/src/environments/environment-typed.ts
index 0a3f927c..6109a848 100644
--- a/projects/gameboard-ui/src/environments/environment-typed.ts
+++ b/projects/gameboard-ui/src/environments/environment-typed.ts
@@ -1,27 +1,22 @@
+import { AppUserManagerSettings } from "@/utility/config.service";
+
 export interface Environment {
     production: boolean;
     settingsJson?: string;
-    settings: {
-        appname: string,
-        apphost: string,
-        basehref?: string,
-        mkshost: string,
-        imghost: string,
-        tochost: string,
-        supporthost: string,
-        tocfile?: string,
-        countdownStartSecondsAtMinute: number,
-        custom_background?: string,
-        isProduction: boolean,
-        oidc: {
-            client_id: string,
-            authority: string,
-            redirect_uri: string,
-            silent_redirect_uri?: string,
-            response_type?: string,
-            scope?: string,
-            loadUserInfo?: boolean,
-            useLocalStorage?: boolean
-        }
-    }
+    settings: EnvironmentSettings;
+}
+
+export interface EnvironmentSettings {
+    appname: string;
+    apphost: string;
+    basehref?: string;
+    countdownStartSecondsAtMinute: number;
+    custom_background?: string;
+    imghost: string;
+    isProduction: boolean;
+    mkshost: string;
+    oidc: AppUserManagerSettings;
+    supporthost: string;
+    tochost: string;
+    tocfile?: string;
 }
diff --git a/projects/gameboard-ui/src/environments/environment.prod.ts b/projects/gameboard-ui/src/environments/environment.prod.ts
index d0a3dcee..e2dda753 100644
--- a/projects/gameboard-ui/src/environments/environment.prod.ts
+++ b/projects/gameboard-ui/src/environments/environment.prod.ts
@@ -16,8 +16,10 @@ export const environment: Environment = {
     custom_background: '',
     oidc: {
       authority: '',
+      autoLogin: false,
+      autoLogout: true,
       client_id: '',
       redirect_uri: ''
-    }
+    },
   }
 };
diff --git a/projects/gameboard-ui/src/environments/environment.ts b/projects/gameboard-ui/src/environments/environment.ts
index 8407c33d..85852e6a 100644
--- a/projects/gameboard-ui/src/environments/environment.ts
+++ b/projects/gameboard-ui/src/environments/environment.ts
@@ -15,14 +15,16 @@ export const environment: Environment = {
     custom_background: 'custom-bg-blue',
     isProduction: false,
     oidc: {
-      client_id: 'dev.gameboard.web',
       authority: 'http://localhost:8080/realms/foundry',
+      autoLogin: false,
+      autoLogout: false,
+      client_id: 'dev.gameboard.web',
       redirect_uri: 'http://localhost:4202/oidc',
       silent_redirect_uri: 'http://localhost:4202/assets/oidc-silent.html',
       response_type: 'code',
       scope: 'openid profile gameboard-api',
       loadUserInfo: true,
       useLocalStorage: true
-    }
+    },
   }
 };
diff --git a/projects/gameboard-ui/src/index.html b/projects/gameboard-ui/src/index.html
index 6263ef25..3ea4d7d1 100644
--- a/projects/gameboard-ui/src/index.html
+++ b/projects/gameboard-ui/src/index.html
@@ -6,7 +6,10 @@
   <title>Gameboard</title>
   <base href="/">
   <meta name="viewport" content="width=device-width, initial-scale=1">
-  <link rel="icon" type="image/x-icon" href="favicon.ico">
+  <link rel="apple-touch-icon" sizes="180x180" href="/assets/img/favicon/apple-touch-icon.png">
+  <link rel="icon" type="image/png" sizes="32x32" href="/assets/img/favicon/favicon-32x32.png">
+  <link rel="icon" type="image/png" sizes="16x16" href="/assets/img/favicon/favicon-16x16.png">
+  <link rel="manifest" href="/assets/img/favicon/site.webmanifest">
 </head>
 
 <body>
diff --git a/projects/gameboard-ui/src/styles.scss b/projects/gameboard-ui/src/styles.scss
index a2ee56cb..47715fa4 100644
--- a/projects/gameboard-ui/src/styles.scss
+++ b/projects/gameboard-ui/src/styles.scss
@@ -273,6 +273,11 @@ table.gameboard-table {
   }
 }
 
+.dropdown-item:hover,
+.dropdown-item:focus {
+  background-color: theme-color("success");
+}
+
 .form-group {
   padding: 1.5rem;
   margin-bottom: 0.5rem;
@@ -325,10 +330,6 @@ app-spinner svg.default-theme {
   }
 }
 
-.gray-text {
-  color: #888888;
-}
-
 .text-black {
   color: black;
 }