feat: refine trust controls and harden BitLogin

components/login-modal.html

@@ -47,8 +47,8 @@
     >
       <div class="space-y-2 text-left">
         <p class="text-sm text-text-muted">
-          Sign in with a login name and password that works the same on every
-          BitLogin site, or use one of the other options below.
+          Use BitLogin for a password-style sign-in, or connect the Nostr
+          identity you already use. Both keep you in control of your keys.
         </p>
       </div>
 
@@ -63,6 +63,12 @@
         id="bitloginMount"
         class="rounded-3xl border border-border bg-overlay-panel-soft/90 p-4 shadow-lg backdrop-blur-sm sm:p-5"
       >
+        <div class="mb-3 space-y-1">
+          <h3 class="text-base font-semibold text-text">BitLogin</h3>
+          <p class="text-sm text-text-muted">
+            A portable login name and password for BitLogin-enabled sites.
+          </p>
+        </div>
         <bitlogin-auth
           id="bitloginWidget"
           vault-relays="wss://relay.damus.io,wss://nos.lol,wss://relay.nostr.band,wss://nostr.wine,wss://relay.snort.social"
@@ -70,27 +76,28 @@
         ></bitlogin-auth>
       </div>
 
-      <details class="space-y-3">
-        <summary class="cursor-pointer text-sm font-semibold text-text-muted hover:text-text">
-          Other login options
-        </summary>
-        <section
-          class="mt-3 space-y-5 rounded-3xl border border-border bg-overlay-panel-soft/90 p-4 shadow-lg backdrop-blur-sm sm:p-5"
-        >
-          <div class="space-y-1">
-            <h3 class="text-base font-semibold text-text">Available methods</h3>
-            <p class="text-sm text-text-muted">
-              Pick the option that matches how you manage your Nostr identity.
-            </p>
-          </div>
+      <section
+        class="space-y-5 rounded-3xl border border-accent/40 bg-overlay-panel-soft/90 p-4 shadow-lg backdrop-blur-sm sm:p-5"
+        aria-labelledby="nostrLoginOptionsTitle"
+      >
+        <div class="space-y-1">
+          <p class="text-xs font-semibold uppercase tracking-wide text-accent">
+            Nostr sign-in
+          </p>
+          <h3 id="nostrLoginOptionsTitle" class="text-base font-semibold text-text">
+            Use your existing Nostr identity
+          </h3>
+          <p class="text-sm text-text-muted">
+            Browser extension (NIP-07), remote signer (NIP-46), or your own key.
+          </p>
+        </div>
 
-          <!-- Login provider buttons are rendered dynamically -->
-          <div
-            data-login-providers
-            class="grid auto-rows-fr gap-4 sm:grid-cols-2 xl:grid-cols-3"
-          ></div>
-        </section>
-      </details>
+        <!-- Login provider buttons are rendered dynamically -->
+        <div
+          data-login-providers
+          class="grid auto-rows-fr gap-4 sm:grid-cols-2 xl:grid-cols-3"
+        ></div>
+      </section>
 
       <div class="space-y-3">
         <div class="space-y-1 text-left">