[hidden] { display: none !important; }
.registration-notice { padding: 14px 16px; border: 1px solid #e3d7ee; border-radius: 12px; background: #f5effb; color: #6d5683; font-size: var(--font-12); line-height: 1.8; margin: 18px 0 24px; }
.registration-error { font-size: var(--font-12); color: #a72f53; margin: 14px 0; line-height: 1.6; }
.registration-mobile { color: #5a199b; font-size: var(--font-14); margin: 18px 0; }
#signupForm .input-wrapper input { width: 100%; min-width: 0; }
#signupForm .input-wrapper { width: 100%; }
#signupForm .signin-button { margin-top: 14px; }
#signupCodeStep .otp-note { margin: 12px 0; }
.resident-details-page { padding: 120px 0 80px; background: #faf8fc; }
.resident-details-page > .container { max-width: 1000px; }
.resident-heading span { font-size: var(--font-12); letter-spacing: 1.5px; color: #9b7fd8; }
.resident-heading h1 { margin: 12px 0; color: #3d0075; font-size: clamp(var(--font-28), 4vw, var(--font-40)); line-height: 1.3; }
.resident-heading p { color: #6f7486; font-size: var(--font-14); }
.resident-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; padding: 0; list-style: none; margin: 28px 0; }
.resident-steps li { border-radius: 10px; background: #eee7f5; padding: 13px 10px; color: #8c7a9e; font-size: var(--font-12); text-align: center; }
.resident-steps li.active { background: #7b3fc0; color: white; }
#residentForm { padding: 35px; border: 1px solid #e9e1f1; border-radius: 20px; background: white; }
.resident-step h2 { color: #3d0075; font-size: var(--font-20); margin-bottom: 25px; }
.resident-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.resident-fields label, .resident-wide { display: grid; gap: 8px; font-size: var(--font-12); color: #514a71; min-width: 0; }
.resident-fields label { display: block; }
.resident-fields input, .resident-fields select, .resident-wide textarea { display: block; width: 100%; min-width: 0; border: 1px solid #dcccE9; border-radius: 10px; padding: 12px; font: inherit; background: #fff; color: #3d0075; margin-top: 8px; }
.resident-fields input[readonly] { background: #f5f0fa; }
.resident-wide { margin-top: 22px; }
.resident-hint { color: #8c7a9e; margin-top: 18px; font-size: var(--font-12); }
.resident-actions { display: flex; justify-content: space-between; gap: 12px; margin-top: 30px; }
.resident-button { display: inline-flex; align-items: center; justify-content: center; border: 1px solid #7b3fc0; border-radius: 10px; background: #7b3fc0; color: white; padding: 13px 20px; font: inherit; font-size: var(--font-12); cursor: pointer; text-decoration: none; }
.resident-button.secondary { background: white; color: #7b3fc0; }
.resident-consent { display: flex; align-items: start; gap: 10px; font-size: var(--font-12); line-height: 1.8; color: #514a71; margin-top: 28px; }
.resident-consent input { margin-top: 5px; flex-shrink: 0; }
#residentReview h3 { color: #7b3fc0; margin: 25px 0 15px; font-size: var(--font-16); }
#residentReview dl { display: grid; grid-template-columns: minmax(130px, 1fr) minmax(0, 2fr); gap: 10px 20px; padding-bottom: 20px; border-bottom: 1px solid #eee5f8; font-size: var(--font-12); }
#residentReview dt { color: #8c7a9e; }
#residentReview dd { color: #3d0075; margin: 0; overflow-wrap: anywhere; }
.resident-success { background: white; border: 1px solid #e9e1f1; border-radius: 20px; padding: 40px; text-align: center; }
.resident-success h2 { color: #3d0075; margin: 20px 0; }
.resident-success p { color: #6f7486; line-height: 1.8; margin: 16px 0; }
.resident-success-icon { display: grid; place-items: center; width: 70px; height: 70px; border-radius: 50%; background: #f1eaf9; color: #7b3fc0; font-size: var(--font-32); margin: auto; }
.resident-success .resident-button { margin: 8px; }
.resident-details-page input:focus-visible, .resident-details-page select:focus-visible, .resident-details-page textarea:focus-visible, .resident-button:focus-visible { outline: 3px solid #b69cdb; outline-offset: 2px; }
@media (max-width: 600px) { .resident-fields { grid-template-columns: minmax(0, 1fr); } #residentForm { padding: 24px 18px; } .resident-steps { gap: 6px; } .resident-steps li { font-size: var(--font-12); padding: 12px 5px; } .resident-actions { flex-wrap: wrap; } .resident-actions button { flex: 1; } #residentReview dl { grid-template-columns: minmax(0, 1fr); gap: 5px; } #residentReview dd { margin-bottom: 12px; } .resident-success { padding: 30px 20px; } }