A new seed phrase comes in three steps: a heads-up, the words, then one word to pick. "Reintroduce the seed phrase preamble telling users to write it down but don't give it a warning icon … an intermediary step before we display the seed phrase … instead of verify and skip buttons just have a next and another intermediate step that asks for just the 5th seed word and gives a few options to click and also a skip button" (Adam, 2026-11-07). Creating a wallet (front door, Accounts, signInAnother) now opens on a plain note, "Next you'll see your seed phrase: 12 words … Write them down on paper, in order … make sure no one is looking", with Show seed phrase; the words page has one Next; the check asks "Which one is word #5?" with four of the phrase's own words as buttons (a wrong one turns red and says "Not that one"), Skip, and Show the words again. The gift claim's new-wallet backup gets the same three steps in place of its warning box and typed three-word check, and a sign-in's "Write down your recovery phrase" shows its explanation first and the words behind Show seed phrase (Later still on both). createStep starts at 'intro'; pickConfirm returns { index, options, wrong }

Co-Authored-By: Claude Opus 5.5 <[email protected]>
Claude-Session: https://claude.ai/code/session_01VMan6Ts5Tktega8VbLg31q

1 files changed, 4 insertions, 0 deletions

diff --git a/src/style.css b/src/style.css
index dfe9b9d..d753604 100644
--- a/src/style.css
+++ b/src/style.css
@@ -344,6 +344,10 @@ textarea.send-dest::placeholder { font-family: var(--sans); }
    eight-letter word ("resemble") pushed the third column out past the
    card's padding. The cells are a touch tighter so every BIP-39 word (eight
    letters at most) still fits whole in a third of a narrow card. */
+/* The one-word check after the phrase: four of its words, tap the right one. */
+.quiz-opts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
+.quiz-opt { font-family: var(--mono); font-size: 16px; padding: 14px 8px; }
+.quiz-opt.wrong { border-color: var(--red); color: var(--red); background: var(--red-soft); }
 .words { display: grid; grid-auto-flow: row; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
 .words .w {
   display: flex; align-items: baseline; gap: 5px; background: var(--surface2); min-width: 0;