修改完成

pages/auth/a01-entry.vue

@@ -374,19 +374,17 @@ const prepareAgreement = () => showFeedback("协议页面准备中");
 
 <style scoped lang="scss">
 .auth-page {
-  position: relative;
   box-sizing: border-box;
   width: 100%;
   height: 100dvh;
   min-height: 100%;
-  overflow-x: hidden;
   overflow-y: auto;
   background: #f7f0e5;
   color: #493323;
 }
 
 .page-canvas {
-  position: relative;
+  display: grid;
   box-sizing: border-box;
   width: 100%;
   min-height: calc(1665rpx + env(safe-area-inset-bottom));
@@ -394,28 +392,28 @@ const prepareAgreement = () => showFeedback("协议页面准备中");
 }
 
 .page-backdrop {
-  position: absolute;
   z-index: 0;
-  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;
 }
 
 .login-content {
-  position: relative;
   z-index: 2;
+  grid-area: 1 / 1;
   box-sizing: border-box;
   width: 100%;
   padding: 480rpx 64rpx 34rpx;
@@ -426,7 +424,7 @@ const prepareAgreement = () => showFeedback("协议页面准备中");
   flex-direction: column;
   align-items: center;
   justify-content: center;
-  height: 142rpx;
+  min-height: 142rpx;
 }
 
 .login-title {
@@ -452,7 +450,6 @@ const prepareAgreement = () => showFeedback("协议页面准备中");
 }
 
 .login-tab {
-  position: relative;
   display: flex;
   flex: 1;
   align-items: center;
@@ -464,30 +461,21 @@ const prepareAgreement = () => showFeedback("协议页面准备中");
 }
 
 .login-tab:first-child::before {
-  position: absolute;
-  top: 50%;
-  right: 0;
-  width: 1rpx;
-  height: 36rpx;
-  background: rgba(176, 120, 52, 0.58);
-  content: "";
-  transform: translateY(-50%);
+  content: none;
+}
+.login-tab:first-child {
+  border-right: 1rpx solid rgba(176, 120, 52, 0.58);
 }
 
 .login-tab.active {
+  background: linear-gradient(#ad160d, #ad160d) center bottom /
+    calc(100% - 116rpx) 5rpx no-repeat;
   color: #a9160d;
   font-weight: 700;
 }
 
 .login-tab.active::after {
-  position: absolute;
-  right: 58rpx;
-  bottom: 0;
-  left: 58rpx;
-  height: 5rpx;
-  border-radius: 5rpx;
-  background: #ad160d;
-  content: "";
+  content: none;
 }
 
 .form-content {
@@ -518,7 +506,7 @@ const prepareAgreement = () => showFeedback("协议页面准备中");
 .auth-input {
   flex: 1;
   min-width: 0;
-  height: 104rpx;
+  min-height: 104rpx;
   color: #493323;
   font-size: 40rpx;
 }
@@ -550,7 +538,6 @@ const prepareAgreement = () => showFeedback("协议页面准备中");
   min-height: 88rpx;
   color: #a9160d;
   font-size: 32rpx;
-  white-space: nowrap;
 }
 
 .form-secondary-row {
@@ -570,28 +557,24 @@ const prepareAgreement = () => showFeedback("协议页面准备中");
 
 .login-submit,
 .wechat-login {
-  position: relative;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  overflow: hidden;
+  display: grid;
+  place-items: center;
 }
 
 .login-submit {
-  height: 92rpx;
+  min-height: 92rpx;
 }
 
 .button-skin {
-  position: absolute;
-  inset: 0;
+  grid-area: 1 / 1;
   width: 100%;
   height: 100%;
   pointer-events: none;
 }
 
 .login-submit__copy {
-  position: relative;
   z-index: 1;
+  grid-area: 1 / 1;
   color: #fffaf1;
   font-size: 52rpx;
   letter-spacing: 8rpx;
@@ -600,7 +583,7 @@ const prepareAgreement = () => showFeedback("协议页面准备中");
 .other-login-divider {
   display: flex;
   align-items: center;
-  height: 100rpx;
+  min-height: 100rpx;
   color: #9f6a27;
   font-size: 32rpx;
   white-space: nowrap;
@@ -625,16 +608,16 @@ const prepareAgreement = () => showFeedback("协议页面准备中");
 }
 
 .wechat-login {
-  height: 100rpx;
+  min-height: 100rpx;
   color: #493323;
   font-size: 40rpx;
   letter-spacing: 3rpx;
 }
 
 .wechat-login__content {
-  position: relative;
   z-index: 1;
   display: flex;
+  grid-area: 1 / 1;
   align-items: center;
   justify-content: center;
 }
@@ -689,7 +672,6 @@ const prepareAgreement = () => showFeedback("协议页面准备中");
   flex: 0 1 auto;
   align-items: center;
   min-width: 0;
-  white-space: nowrap;
 }
 
 .agreement-link {
@@ -750,7 +732,6 @@ const prepareAgreement = () => showFeedback("协议页面准备中");
 }
 
 .feedback-toast__copy {
-  position: relative;
   z-index: 1;
   padding: 16rpx 36rpx;
   color: #5c4330;
@@ -770,26 +751,27 @@ const prepareAgreement = () => showFeedback("协议页面准备中");
 }
 
 .verification-dialog {
-  position: relative;
+  display: grid;
   width: 620rpx;
-  height: 520rpx;
+  min-height: 520rpx;
+  max-height: calc(100vh - 80rpx);
 }
 
 .verification-dialog__skin {
-  position: absolute;
-  inset: 0;
+  grid-area: 1 / 1;
   width: 100%;
   height: 100%;
 }
 
 .verification-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: 90rpx 64rpx 54rpx;
 }