bar graph fix

app/auth/page.tsx

@@ -1,6 +1,7 @@
 "use client";
 import { useState, useEffect } from "react";
 import { useRouter } from "next/navigation";
+import HelpTooltip from "../components/HelpTooltip";
 
 function b64uToBuf(b64u: string): ArrayBuffer {
 	const b64 = b64u.replace(/-/g, "+").replace(/_/g, "/");
@@ -190,20 +191,22 @@ export default function AuthPage() {
 						<p className="text-[13px] text-red-400 mb-4">{error}</p>
 					)}
 
-					<button
-						type="submit"
-						disabled={busy}
-						className={`w-full py-2.5 rounded-xl text-md border border-blue/30 text-white font-[600] tracking-wide transition-colors ${
-							busy
-								? "bg-blue/40 cursor-not-allowed"
-								: "bg-blue hover:bg-blue/80 cursor-pointer"
-						}`}
-					>
+					<HelpTooltip text="Submit your username and password, then touch your YubiKey when prompted to complete sign-in." block>
+						<button
+							type="submit"
+							disabled={busy}
+							className={`w-full py-2.5 rounded-xl text-md border border-blue/30 text-white font-[600] tracking-wide transition-colors ${
+								busy
+									? "bg-blue/40 cursor-not-allowed"
+									: "bg-blue hover:bg-blue/80 cursor-pointer"
+							}`}
+						>
 						{status === "idle" && "Sign in"}
 						{status === "checking" && "Checking…"}
 						{status === "waiting_yubikey" && "Waiting for YubiKey…"}
 						{status === "verifying" && "Verifying…"}
 					</button>
+					</HelpTooltip>
 				</form>
 			</div>
 		</main>