From 2f55846f7026f8e74b791294f3369666f756741c Mon Sep 17 00:00:00 2001
From: Oleksandr Kozachuk <201152+ok2@users.noreply.github.com>
Date: Tue, 9 Jun 2026 23:31:46 +0200
Subject: [PATCH] helwasm: Stored button matches Correct (filled ocean);
 refocus console after pass modal

- is-stored now uses the same filled-ocean look as is-correct, so both confirmed
  states read identically
- closing the pass overlay (Set or Cancel) returns focus to the command line
---
 helwasm/index.html |  2 ++
 helwasm/style.css  | 10 +++++-----
 2 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/helwasm/index.html b/helwasm/index.html
index 5641fa9..a30d645 100644
--- a/helwasm/index.html
+++ b/helwasm/index.html
@@ -440,6 +440,7 @@
         const pw = $("#passInput").value;
         $("#passModal").classList.remove("show");
         $("#passInput").value = "";
+        $("#cin").focus(); // return to the command line after the overlay closes
         if (name == null) return;
         appendLine('<span class="cmd">&gt; pass ' + esc(name) + "</span>");
         if (!pw) {
@@ -504,6 +505,7 @@
           passPending = null;
           $("#passModal").classList.remove("show");
           $("#passInput").value = "";
+          $("#cin").focus();
         };
 
         const ci = $("#cin");
diff --git a/helwasm/style.css b/helwasm/style.css
index bae8ebf..241c28c 100644
--- a/helwasm/style.css
+++ b/helwasm/style.css
@@ -181,13 +181,13 @@ input.mask.revealed { -webkit-text-security: none; }
 .btn.ghost { background: transparent; color: var(--ocean); }
 .btn.ghost:hover { background: rgba(27, 65, 97, 0.06); color: var(--ocean); border-color: var(--ocean); }
 .btn.small { padding: 7px 15px; font-size: 13px; }
-/* "Mark correct" toggle: filled ocean once the master is remembered-correct. */
-.btn.small.is-correct { background: var(--ocean); color: var(--cream); border-color: var(--ocean); }
+/* Confirmed states ("Correct ✓" / "Stored ✓"): same filled-ocean look for both. */
+.btn.small.is-correct,
+.btn.small.is-stored { background: var(--ocean); color: var(--cream); border-color: var(--ocean); }
 .btn.small.is-correct:hover { background: var(--deep); border-color: var(--deep); }
 .btn:disabled { opacity: .4; cursor: not-allowed; pointer-events: none; }
-/* "Stored ✓": not an action (disabled), but shown as a confirmed ocean outline
-   rather than the dimmed disabled look. */
-.btn.small.is-stored { opacity: 1; background: transparent; color: var(--ocean); border-color: var(--ocean); }
+/* is-stored is disabled (re-storing is a no-op); keep it fully opaque, not dimmed. */
+.btn.small.is-stored { opacity: 1; }
 
 /* Quick-gen result row */
 .result {