Type Mismatch in Error Handling with Effect.catchTag

export const runEffect = <A, E>(
  eff: Effect.Effect<A, E | Unauthorized, AppRuntimeContext>
): Promise<A> => {
  const x = eff.pipe(
    Effect.catchTag("@app/Unauthorized", () =>
      NextResponse.json({ error: "Unauthorized" }, { status: 401 })
    )
  );

  return AppRuntime.runPromise(x);
};

export type AppRuntimeContext = Layer.Layer.Success<typeof StaticServicesLayer>;

No overload matches this call.
  Overload 1 of 2, '(args_0: "@app/Unauthorized", f: (e: Extract<NoInfer<Unauthorized | E>, { _tag: "@app/Unauthorized"; }>) => Effect<unknown, unknown, unknown>): <A, R>(self: Effect<...>) => Effect<...>', gave the following error.
    Type 'NextResponse<{ error: string; }>' is missing the following properties from type 'Effect<unknown, unknown, unknown>': [Symbol.iterator], [EffectTypeId], pipe, [SinkTypeId], and 2 more.
  Overload 2 of 2, '(self: Effect<unknown, unknown, unknown>, ...args: [never, ...never[], f: (e: never) => Effect<unknown, unknown, unknown>]): Effect<unknown, unknown, unknown>', gave the following error.
    Argument of type 'string' is not assignable to parameter of type 'Effect<unknown, unknown, unknown>'