修改完成

pages/auth/a06-auth-status.vue

@@ -204,62 +204,61 @@ const goBack = () => uni.navigateBack();
 
 <style scoped lang="scss">
 .auth-page {
-  position: relative;
   width: 100%;
   height: 100dvh;
   min-height: 100%;
-  overflow-x: hidden;
   overflow-y: auto;
   background: #f7f0e4;
   color: #493323;
 }
 
 .page-canvas {
-  position: relative;
+  display: grid;
   box-sizing: border-box;
   width: 100%;
   min-height: calc(1665rpx + env(safe-area-inset-bottom));
   padding-bottom: env(safe-area-inset-bottom);
 }
 .page-backdrop {
-  position: absolute;
-  inset: 0 0 auto;
+  grid-area: 1 / 1;
+  align-self: start;
   width: 100%;
   height: 1665rpx;
   pointer-events: none;
 }
 .brand-seal {
-  position: absolute;
   z-index: 1;
-  top: 64rpx;
-  left: 50%;
+  grid-area: 1 / 1;
+  align-self: start;
+  justify-self: center;
   width: 184rpx;
   height: 221rpx;
-  transform: translateX(-50%);
+  margin-top: 64rpx;
   pointer-events: none;
 }
 .status-content {
-  position: relative;
   z-index: 2;
+  grid-area: 1 / 1;
   box-sizing: border-box;
   padding: 430rpx 64rpx 46rpx;
 }
 .page-heading {
-  position: relative;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
+  display: grid;
+  grid-template-rows: auto auto auto;
+  justify-items: center;
   min-height: 154rpx;
 }
 .back-button {
-  position: absolute;
-  top: 10rpx;
-  left: 0;
   display: flex;
+  grid-row: 1 / -1;
+  grid-column: 1;
+  align-self: start;
+  justify-self: start;
   align-items: center;
   justify-content: center;
   width: 88rpx;
   height: 88rpx;
+  margin-top: 10rpx;
 }
 .back-button__icon {
   width: 42rpx;
@@ -267,18 +266,21 @@ const goBack = () => uni.navigateBack();
   transform: scaleX(-1);
 }
 .page-title {
+  grid-row: 1;
   color: #9f170f;
   font-size: 66rpx;
   font-weight: 700;
   letter-spacing: 7rpx;
 }
 .page-subtitle {
+  grid-row: 2;
   margin-top: 12rpx;
   color: #806c58;
   font-size: 25rpx;
   letter-spacing: 1rpx;
 }
 .status-divider {
+  grid-row: 3;
   width: 300rpx;
   height: 50rpx;
   margin-top: 2rpx;
@@ -344,24 +346,20 @@ const goBack = () => uni.navigateBack();
 }
 
 .status-primary {
-  position: relative;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  height: 104rpx;
+  display: grid;
+  place-items: center;
+  min-height: 104rpx;
   margin-top: 28rpx;
-  overflow: hidden;
 }
 .status-primary__skin,
 .recovery-action__skin {
-  position: absolute;
-  inset: 0;
+  grid-area: 1 / 1;
   width: 100%;
   height: 100%;
 }
 .status-primary__copy {
-  position: relative;
   z-index: 1;
+  grid-area: 1 / 1;
   color: #fffaf0;
   font-size: 38rpx;
   letter-spacing: 5rpx;
@@ -387,24 +385,25 @@ const goBack = () => uni.navigateBack();
   background: rgba(35, 18, 10, 0.62);
 }
 .recovery-dialog {
-  position: relative;
+  display: grid;
   width: 620rpx;
-  height: 520rpx;
+  min-height: 520rpx;
+  max-height: calc(100vh - 80rpx);
 }
 .recovery-dialog__skin {
-  position: absolute;
-  inset: 0;
+  grid-area: 1 / 1;
   width: 100%;
   height: 100%;
 }
 .recovery-dialog__content {
-  position: relative;
   z-index: 1;
   display: flex;
+  grid-area: 1 / 1;
   flex-direction: column;
   align-items: center;
   box-sizing: border-box;
-  height: 100%;
+  min-height: 100%;
+  overflow-y: auto;
   padding: 58rpx 58rpx 36rpx;
   text-align: center;
 }
@@ -427,18 +426,15 @@ const goBack = () => uni.navigateBack();
   line-height: 31rpx;
 }
 .recovery-action {
-  position: relative;
-  display: flex;
-  align-items: center;
-  justify-content: center;
+  display: grid;
+  place-items: center;
   width: 100%;
-  height: 80rpx;
+  min-height: 80rpx;
   margin-top: 22rpx;
-  overflow: hidden;
 }
 .recovery-action__copy {
-  position: relative;
   z-index: 1;
+  grid-area: 1 / 1;
   color: #fffaf0;
   font-size: 29rpx;
   letter-spacing: 4rpx;