diff --git a/src/client/Main.ts b/src/client/Main.ts
index f042d918c..68e16f421 100644
--- a/src/client/Main.ts
+++ b/src/client/Main.ts
@@ -11,7 +11,6 @@ import "./FlagInput";
 import { FlagInput } from "./FlagInput";
 import { GameStartingModal } from "./GameStartingModal";
 import "./GoogleAdElement";
-import { GutterAdModal } from "./GutterAdModal";
 import { HelpModal } from "./HelpModal";
 import { HostLobbyModal as HostPrivateLobbyModal } from "./HostLobbyModal";
 import { JoinPrivateLobbyModal } from "./JoinPrivateLobbyModal";
@@ -74,7 +73,6 @@ class Client {
   private joinModal: JoinPrivateLobbyModal;
   private publicLobby: PublicLobby;
   private userSettings: UserSettings = new UserSettings();
-  private gutterAdModal: GutterAdModal;
 
   constructor() {}
 
@@ -166,12 +164,6 @@ class Client {
       }
     });
 
-    this.gutterAdModal = document.querySelector(
-      "gutter-ad-modal",
-    ) as GutterAdModal;
-    this.gutterAdModal instanceof GutterAdModal;
-    this.gutterAdModal.show();
-
     // const ctModal = document.querySelector("chat-modal") as ChatModal;
     // ctModal instanceof ChatModal;
     // document.getElementById("chat-button").addEventListener("click", () => {
@@ -373,7 +365,6 @@ class Client {
       () => {
         this.joinModal.close();
         this.publicLobby.stop();
-        this.gutterAdModal.hide();
 
         try {
           window.PageOS.session.newPageView();
diff --git a/src/client/graphics/GameRenderer.ts b/src/client/graphics/GameRenderer.ts
index 9b5b7eff2..ce808df29 100644
--- a/src/client/graphics/GameRenderer.ts
+++ b/src/client/graphics/GameRenderer.ts
@@ -12,6 +12,7 @@ import { EmojiTable } from "./layers/EmojiTable";
 import { EventsDisplay } from "./layers/EventsDisplay";
 import { FxLayer } from "./layers/FxLayer";
 import { GameLeftSidebar } from "./layers/GameLeftSidebar";
+import { GutterAdModal } from "./layers/GutterAdModal";
 import { HeadsUpMessage } from "./layers/HeadsUpMessage";
 import { Layer } from "./layers/Layer";
 import { Leaderboard } from "./layers/Leaderboard";
@@ -205,6 +206,14 @@ export function createRenderer(
   }
   leftInGameAd.g = game;
 
+  const gutterAdModal = document.querySelector(
+    "gutter-ad-modal",
+  ) as GutterAdModal;
+  if (!(gutterAdModal instanceof GutterAdModal)) {
+    console.error("gutter ad modal not found");
+  }
+  gutterAdModal.eventBus = eventBus;
+
   const layers: Layer[] = [
     new TerrainLayer(game, transformHandler),
     new TerritoryLayer(game, eventBus, transformHandler),
@@ -241,6 +250,7 @@ export function createRenderer(
     unitInfoModal,
     multiTabModal,
     leftInGameAd,
+    gutterAdModal,
   ];
 
   return new GameRenderer(
diff --git a/src/client/GutterAdModal.ts b/src/client/graphics/layers/GutterAdModal.ts
similarity index 85%
rename from src/client/GutterAdModal.ts
rename to src/client/graphics/layers/GutterAdModal.ts
index 2fcaf0c9b..3c2c6dd24 100644
--- a/src/client/GutterAdModal.ts
+++ b/src/client/graphics/layers/GutterAdModal.ts
@@ -1,8 +1,16 @@
 import { LitElement, css, html } from "lit";
 import { customElement, state } from "lit/decorators.js";
+import { EventBus, GameEvent } from "../../../core/EventBus";
+import { Layer } from "./Layer";
+
+export class GutterAdModalEvent implements GameEvent {
+  constructor(public readonly isVisible: boolean) {}
+}
 
 @customElement("gutter-ad-modal")
-export class GutterAdModal extends LitElement {
+export class GutterAdModal extends LitElement implements Layer {
+  public eventBus: EventBus;
+
   @state()
   private isVisible: boolean = false;
 
@@ -20,6 +28,18 @@ export class GutterAdModal extends LitElement {
     return this;
   }
 
+  init() {
+    this.eventBus.on(GutterAdModalEvent, (event) => {
+      if (event.isVisible) {
+        this.show();
+      } else {
+        this.hide();
+      }
+    });
+  }
+
+  tick() {}
+
   static styles = css``;
 
   // Called after the component's DOM is first rendered
@@ -29,6 +49,7 @@ export class GutterAdModal extends LitElement {
   }
 
   public show(): void {
+    console.log("showing GutterAdModal");
     this.isVisible = true;
     this.requestUpdate();
 
@@ -39,6 +60,7 @@ export class GutterAdModal extends LitElement {
   }
 
   public hide(): void {
+    console.log("hiding GutterAdModal");
     this.isVisible = false;
     this.destroyAds();
     this.adLoaded = false;
diff --git a/src/client/graphics/layers/WinModal.ts b/src/client/graphics/layers/WinModal.ts
index ce705513d..93aac1c9f 100644
--- a/src/client/graphics/layers/WinModal.ts
+++ b/src/client/graphics/layers/WinModal.ts
@@ -5,6 +5,7 @@ import { EventBus } from "../../../core/EventBus";
 import { GameUpdateType } from "../../../core/game/GameUpdates";
 import { GameView } from "../../../core/game/GameView";
 import { SendWinnerEvent } from "../../Transport";
+import { GutterAdModalEvent } from "./GutterAdModal";
 import { Layer } from "./Layer";
 
 @customElement("win-modal")
@@ -171,11 +172,13 @@ export class WinModal extends LitElement implements Layer {
   show() {
     this.isVisible = true;
     this.requestUpdate();
+    this.eventBus.emit(new GutterAdModalEvent(true));
   }
 
   hide() {
     this.isVisible = false;
     this.requestUpdate();
+    this.eventBus.emit(new GutterAdModalEvent(false));
   }
 
   private _handleExit() {