feat: email and password login

frontend/src/styles/dialogs.css

@@ -1,5 +1,3 @@
-
-
 .dialog-skeleton {
   display: grid;
   gap: 12px;
@@ -12,11 +10,8 @@
   display: grid;
   align-items: center;
   justify-items: center;
-  padding:
-    max(14px, env(safe-area-inset-top))
-    max(14px, env(safe-area-inset-right))
-    max(14px, env(safe-area-inset-bottom))
-    max(14px, env(safe-area-inset-left));
+  padding: max(14px, env(safe-area-inset-top)) max(14px, env(safe-area-inset-right))
+    max(14px, env(safe-area-inset-bottom)) max(14px, env(safe-area-inset-left));
   overflow: hidden;
   isolation: isolate;
 }
@@ -116,6 +111,26 @@
   min-height: 0;
 }
 
+.password-code-fullscreen {
+  position: fixed;
+  inset: 0;
+  z-index: 220;
+  background: var(--bg);
+  overflow-y: auto;
+  overscroll-behavior: contain;
+  animation: password-code-fullscreen-enter 0.2s ease-out both;
+}
+
+@keyframes password-code-fullscreen-enter {
+  from {
+    opacity: 0;
+  }
+
+  to {
+    opacity: 1;
+  }
+}
+
 @media (min-width: 720px) {
   .dialog-card {
     border-radius: var(--radius-lg);