.profile-form{background:#fefefe;border:2px solid #cfcfcf;border-radius:8px;max-width:420px;margin:50px auto auto;padding:24px}.profile-form h2{margin-bottom:16px;font-size:18px}.profile-form form{flex-direction:column;gap:16px;display:flex}.profile-form .field{flex-direction:column;gap:6px;display:flex}.profile-form .field input{border:1px solid #ccc;border-radius:4px;padding:10px}.profile-form .field input:focus{border-color:#4f46e5;outline:none}.profile-form .field.valid input{background:#f0fdf4;border-color:#16a34a}.profile-form .field.invalid input{background:#fef2f2;border-color:#dc2626}.profile-form .field small{font-size:12px}.profile-form .field .error{color:#dc2626}.profile-form button{color:#fff;cursor:pointer;background:#4f46e5;border:none;border-radius:4px;padding:12px}.profile-form button:disabled{opacity:.5;cursor:not-allowed}.strength{margin-top:6px}.strength .bar{background:#e5e7eb;border-radius:4px;height:6px;margin-bottom:4px;transition:width .3s}.strength .bar.bar-1{background:#dc2626;width:25%}.strength .bar.bar-2{background:#f59e0b;width:50%}.strength .bar.bar-3{background:#3b82f6;width:75%}.strength .bar.bar-4{background:#16a34a;width:100%}.strength span{font-size:12px}
