diff --git a/packages/page-controller/src/mask/SimulatorMask.module.css b/packages/page-controller/src/mask/SimulatorMask.module.css
index fec892d..7b73e05 100644
--- a/packages/page-controller/src/mask/SimulatorMask.module.css
+++ b/packages/page-controller/src/mask/SimulatorMask.module.css
@@ -7,3 +7,7 @@
 
 	display: none;
 }
+
+.wrapper.visible {
+	display: block;
+}
diff --git a/packages/page-controller/src/mask/SimulatorMask.ts b/packages/page-controller/src/mask/SimulatorMask.ts
index 2971db2..eb13eb6 100644
--- a/packages/page-controller/src/mask/SimulatorMask.ts
+++ b/packages/page-controller/src/mask/SimulatorMask.ts
@@ -151,7 +151,7 @@ export class SimulatorMask {
 		this.motion?.start()
 		this.motion?.fadeIn()
 
-		this.wrapper.style.display = 'block'
+		this.wrapper.classList.add(styles.visible)
 
 		// Initialize cursor position
 		this.#currentCursorX = window.innerWidth / 2
@@ -172,7 +172,7 @@ export class SimulatorMask {
 		this.#cursor.classList.remove(cursorStyles.clicking)
 
 		setTimeout(() => {
-			this.wrapper.style.display = 'none'
+			this.wrapper.classList.remove(styles.visible)
 		}, 800) // Match the animation duration
 	}