修复密码显隐按钮遮挡文字编辑区

app/assets/styles/blank.DOa3C9wi.css

@@ -92,17 +92,10 @@
 .auth-card .p-password {
   font-size: 1em;
 }
-.auth-card .p-password-input {
-  padding-inline-end: 44px;
-}
 .auth-card .p-inputtext::placeholder {
   color: var(--p-text-muted-color);
   opacity: 1;
 }
-.auth-card .p-password-toggle-mask-icon {
-  width: 18px;
-  height: 18px;
-}
 .auth-card .p-button {
   min-height: 44px;
   font-size: 1em;

app/components/PasswordField.vue

@@ -68,15 +68,24 @@ async function togglePassword(callback) {
 </template>
 
 <style scoped>
+.password-field {
+  --password-toggle-size: 44px;
+}
+/* PrimeVue公开的输入样式类位于子组件内；操作宽度与逻辑末端留白必须同源，避免文字被按钮截获。 */
+.password-field:has(.password-toggle) :deep(.p-password-input) {
+  padding-inline-end: calc(
+    var(--password-toggle-size) + var(--p-form-field-padding-x)
+  );
+}
 .password-field .password-toggle {
   position: absolute;
   inset-block: 0;
   inset-inline-end: 0;
   display: grid;
   place-items: center;
-  width: 44px;
-  height: 100%;
-  min-height: 0;
+  inline-size: var(--password-toggle-size);
+  block-size: 100%;
+  min-block-size: 0;
   margin: 0;
   padding: 0;
   color: var(--p-text-muted-color);