diff --git a/index.html b/index.html
index 795748b..77588ba 100644
--- a/index.html
+++ b/index.html
@@ -2,7 +2,7 @@
 <html lang="en">
 <head>
     <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover">
     <title>Pop! Pop! Pop!</title>
     <style>
         body {
@@ -13,7 +13,7 @@
             display: flex;
             justify-content: center;
             align-items: center;
-            height: 100vh;
+            height: 100dvh;
             width: 100vw;
         }
         canvas {
diff --git a/src/main.ts b/src/main.ts
index b89f286..1353289 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -105,8 +105,10 @@ class PopScene extends Phaser.Scene {
 
 const config = {
     type: Phaser.AUTO,
-    width: window.innerWidth,
-    height: window.innerHeight,
+    scale: {
+        mode: Phaser.Scale.RESIZE,
+        autoCenter: Phaser.Scale.CENTER_BOTH,
+    },
     parent: 'game-container',
     scene: [PopScene],
     physics: {
