page AccountPage {
  state user = ctx.user
  seo { title = "Account" }
  view {
    <main class="min-h-screen bg-[var(--wrn-color-bg)] p-6 text-[var(--wrn-color-text)]">
      <div class="mx-auto max-w-3xl">
        <h1 class="text-3xl font-bold">Account security</h1>
        <p class="text-[var(--wrn-color-muted)]">Signed in as {user.displayName || user.username || user.id}</p>
        <div class="mt-8 grid gap-5">
          <AccountStatus status='{user.status}' />
          <PasskeyButton mode="register" />
          <form method="post" action="/api/auth/logout" data-schema="auth-empty" novalidate>
            <p data-error="_form" role="alert" class="mb-3 hidden text-sm text-[var(--wrn-color-danger)]"></p>
            <button type="submit" class="h-11 rounded-[var(--wrn-radius-sm)] bg-[var(--wrn-color-danger)] px-5 font-semibold text-white disabled:cursor-wait disabled:opacity-60">Sign out</button>
          </form>
        </div>
      </div>
    </main>
  }
}