Mobile zooming fixes

src/style.css

@@ -2,25 +2,22 @@
     font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
     line-height: 1.5;
     font-weight: 400;
-
     color: var(--text-color);
-
-
     font-synthesis: none;
     text-rendering: optimizeLegibility;
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
-    --link-color: oklch(68% 0.1707 0);
-    --text-color: black;
+    --link-color: oklch(68% .1707 0);
+    --text-color: black
 }
 
 body,
 html {
-    block-size: 100svb;
-    inline-size: 100svi;
+    inline-size: 100%;
+    block-size: 100%;
     margin: 0;
     padding: 0;
-    overflow: hidden;
+    overflow: hidden
 }
 
 #app {
@@ -28,34 +25,36 @@ html {
     block-size: 100%;
     display: flex;
     margin: 0;
+    padding: 0;
+    position: relative;
     align-items: center;
     justify-content: center;
     flex-direction: column;
-    overflow: hidden;
+    overflow: hidden
 }
 
 h1 {
     font-size: 1.5rem;
-    margin-block: 0.5rem;
+    margin-block: .5rem
 }
 
 p {
     font-size: 1.5rem;
     margin: 0;
     text-align: justify;
-    inline-size: 100%;
+    inline-size: 100%
 }
 
 a {
     color: var(--link-color);
     text-decoration: none;
-    transition: 0.2s text-shadow, 0.2s transform;
-    display: inline-block;
+    transition: .2s text-shadow, .2s transform;
+    display: inline-block
+}
 
-    &:hover {
-        text-shadow: 0rem 0rem 1rem var(--link-color);
-        transform: rotateZ(-3deg);
-    }
+a:hover {
+    text-shadow: 0rem 0rem 1rem var(--link-color);
+    transform: rotate(-3deg)
 }
 
 img {
@@ -63,18 +62,16 @@ img {
     position: absolute;
     inline-size: 10%;
     z-index: -1;
-    min-inline-size: 10rem;
+    min-inline-size: 10rem
 }
 
 .text {
     display: flex;
     flex-direction: column;
     align-items: center;
-    background: white;
+    background: #fff;
     border: 1px solid black;
-    box-shadow: 0rem 0rem 1.5rem white;
-    /* box-shadow: 0rem 0rem 1rem rgba(0, 0, 0, 0.2); */
-    /* border-radius: 0.5rem; */
-    padding: 0.8rem 1.6rem;
-    inline-size: clamp(20rem, 30%, 40rem);
+    box-shadow: 0 0 1.5rem #fff;
+    padding: .8rem 1.6rem;
+    inline-size: clamp(20rem, 30%, 40rem)
 }