Based on the information provided in your question, it seems you're encountering issues with the OAuth flow implementation in your custom UI. Let's address the two main errors you're experiencing: 1. Invalid Scope Error: This error suggests that the OAuth 2.0 client is not configured to request the scopes you're trying to use. To resolve this, you need to ensure that the client is allowed to request the scopes you're including in your request. As mentioned in the [OAuth2 authorization code flow documentation](https://www.ory.sh/docs/oauth2-oidc/authorization-code-flow#step-1-get-the-users-permission), you need to configure the client with the appropriate scopes. When creating or updating your OAuth 2.0 client, make sure to include all the scopes you intend to use (e.g., 'openid', 'offline_access', 'email', 'profile') in the client configuration. 2. CSRF Error: The CSRF (Cross-Site Request Forgery) error indicates that the request is missing the required CSRF token. This is a security measure to prevent unauthorized requests. To resolve this, you need to ensure that you're properly handling CSRF protection in your custom UI. As explained in the [CSRF troubleshooting guide](https://www.ory.sh/docs/troubleshooting/csrf#ory-oauth2), you should: - Make sure you're not running the OAuth2 flow in separate browsers or incognito mode. - Avoid running multiple OAuth2 flows simultaneously in the same browser. - Ensure you're not using AJAX to call

/oauth2/auth

. This endpoint should only be accessed via a normal browser request. Additionally, when implementing your custom UI, you need to include the CSRF token in your requests. Here's an example of how to map UI nodes for CSRF protection:

javascript filterNodesByGroups({   nodes: flow.ui.nodes,   groups: ["default"],   attributes: ["hidden"], }).map((node) => {   if (     isUiNodeInputAttributes(node.attributes) &&     (node.attributes as UiNodeInputAttributes).type === "hidden" &&     (node.attributes as UiNodeInputAttributes).name === "csrf_token"   ) {     return (       <input         type={node.attributes.type}         name={node.attributes.name}         value={node.attributes.value}       />     )   } })

This code snippet is from the [Kratos custom UI integration basics](https://www.ory.sh/docs/kratos/bring-your-own-ui/custom-ui-basic-integration#debug) documentation. Lastly, make sure you're following the correct flow steps as outlined in the [OAuth2 login and consent flow documentation](https://www.ory.sh/docs/oauth2-oidc/custom-login-consent/flow#flow-steps). This will help ensure you're handling the login challenge and verifier correctly. If you're still encountering issues after addressing these points, you may need to review your implementation in more detail or consult the Ory community for further assistance.