"Verify this device" redesign (#30596)

* add variant of ResetIdentityBody for when the user has no verif. methods

* no longer distinguish between the using having a passphrase or not

* use vertical stack of buttons via EncryptionCard

and update wording

* swap logic order to match rendering order

* use the same dialog when no verification options available

* make it agree with the design more

* allow signing out on initial login

* apply styling changes and remove duplicate elements

* fix and add tests

* add missing snapshot

* Apply suggestions from code review

Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>

* use a boolean property to disable blurring instead of adding a class

* change string identifiers

* apply changes from review -- simplify logic

* change class name to avoid confusion

---------

Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>

res/css/views/auth/_AuthPage.pcss

@@ -19,7 +19,6 @@ Please see LICENSE files in the repository root for full details.
     display: flex;
     margin: 100px auto auto;
     border-radius: 4px;
-    box-shadow: 0 2px 4px 0 rgb(0, 0, 0, 0.33);
     background-color: $authpage-modal-bg-color;
 
     @media only screen and (max-height: 768px) {
@@ -29,4 +28,9 @@ Please see LICENSE files in the repository root for full details.
     @media only screen and (max-width: 480px) {
         margin-top: 0;
     }
+
+    /* Apply a blurred shadow around the modal */
+    &.mx_AuthPage_modal_withBlur {
+        box-shadow: 0 2px 4px 0 rgb(0, 0, 0, 0.33);
+    }
 }

res/css/views/auth/_CompleteSecurityBody.pcss

@@ -8,11 +8,10 @@ Please see LICENSE files in the repository root for full details.
 */
 
 .mx_CompleteSecurityBody {
-    width: 600px;
     color: $authpage-primary-color;
     background-color: $background;
     border-radius: 4px;
-    padding: 20px;
+    padding: 20px 20px 60px 20px;
     box-sizing: border-box;
 
     h2 {