page CaptchaGate {
    state returnTo = ctx.url.searchParams.get("returnTo") || "/protected"

    seo {
        title = "Complete security verification"
        robots = "noindex,nofollow"
    }

    view {
        <main class="grid min-h-screen place-items-center bg-[var(--wrn-color-bg)] px-4 py-10 text-[var(--wrn-color-text)]">
            <form
                method="post"
                action="/api/page-grant"
                class="w-full max-w-xl rounded-2xl border border-[var(--wrn-color-border)] bg-[var(--wrn-color-surface)] p-5 shadow-[var(--wrn-shadow-1)] sm:p-7"
            >
                <input type="hidden" name="returnTo" value='{returnTo}' />

                <p class="mb-2 text-sm font-semibold text-[var(--wrn-color-primary)]">Protected page</p>
                <h1 class="m-0 text-2xl font-bold">Confirm you are human</h1>
                <p class="mb-5 mt-2 text-sm leading-6 text-[var(--wrn-color-muted)]">Complete this once to access protected showcase pages for 15 minutes.</p>

                <Captcha
                    endpoint="/api/captcha/challenge"
                    verifyEndpoint="/api/captcha/verify"
                    type="alphanumeric"
                    action="protected-page-access"
                    disturbance="50"
                    required="true"
                />

                <button type="submit" class="mt-4 h-11 w-full rounded-[var(--wrn-radius-sm)] bg-[var(--wrn-color-primary)] px-5 font-semibold text-[var(--wrn-color-primary-contrast)]">
                    Continue to protected page
                </button>
            </form>
        </main>
    }
}
