From be2078779d884bc7db98636300c8ff1a11bb833f Mon Sep 17 00:00:00 2001
From: Oleksandr Kozachuk <201152+ok2@users.noreply.github.com>
Date: Mon, 8 Jun 2026 22:12:53 +0200
Subject: [PATCH] web: quick-gen result scales + wraps on small screens

The result password was a fixed 19px with white-space:pre, so it overflowed the
card on phones. Scope .result .secret to a dynamic font (clamp 13-19px, ~15px at
390px) that wraps (pre-wrap + overflow-wrap:anywhere + min-width:0). Desktop is
unchanged (fits one line at 19px); the console gen-table keeps its pre alignment.
---
 helwasm/style.css | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/helwasm/style.css b/helwasm/style.css
index c10cb33..cb4c8d8 100644
--- a/helwasm/style.css
+++ b/helwasm/style.css
@@ -181,6 +181,10 @@ input.mask { -webkit-text-security: disc; }
 .result .tag { font-family: var(--mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.1em; color: var(--muted); }
 .result .actions { margin-left: auto; display: flex; gap: 8px; }
 .result .len { font-family: var(--mono); font-size: 11px; color: var(--muted); }
+/* Quick-gen result: dynamic font (scales down on narrow phones) and wraps so a
+   long password stays inside the card. min-width:0 lets it shrink/wrap within
+   the flex row. Scoped so the console table keeps its fixed-width alignment. */
+.result .secret { font-size: clamp(13px, 4vw, 19px); white-space: pre-wrap; overflow-wrap: anywhere; min-width: 0; }
 
 /* Secret rendering: real text in the DOM, visually masked. Click toggles.
    Mask via -webkit-text-security on the MONO font so each disc keeps the mono