Advanced Settings: add visual feedback on Apply (temporary glow + 'Applied' label) and busy lock

css/style.css

@@ -1818,6 +1818,7 @@ button:hover {
     letter-spacing: .3px;
     min-width: 48ch;
     justify-content: center;
+    text-align: center;
 }
 
 .randomizer-button::after {
@@ -1956,6 +1957,8 @@ button:hover {
 
 .unicode-panel-content { padding: 12px; overflow-y: auto; }
 .unicode-panel-header .close-button { background: transparent; border: none; color: var(--text-color); cursor: pointer; padding: 4px; }
+.apply-status { color:#69f0ae; opacity:.9; }
+.apply-steg-options.applied { border-color:#2e7d32; box-shadow: 0 0 12px rgba(105,240,174,.35) inset, 0 0 16px rgba(105,240,174,.2); }
 
 /* Fluid UX: reduce scroll fatigue during repeated actions */
 html {

index.html

@@ -745,7 +745,7 @@
                                             :title="'Click to apply random transforms to each word!'"
                                         >
                                             <i class="fas fa-wand-magic-sparkles"></i>
-                                            {{ transform.name }}
+                                            !RANDOMIZE!
                                             <small class="transform-preview">
                                                 🌀 Each word = different transform!
                                             </small>
@@ -920,7 +920,10 @@
                         <option value="">None</option>
                     </select>
                 </label>
-                <button class="apply-steg-options" @click="applyUnicodeOptions">Apply</button>
+                <div style="display:flex; align-items:center; gap:10px;">
+                    <button class="apply-steg-options" :class="{ applied: unicodeApplyFlash }" :disabled="unicodeApplyBusy" @click="applyUnicodeOptions">Apply</button>
+                    <small v-if="unicodeApplyFlash" class="apply-status">Applied</small>
+                </div>
                 <small class="steg-note">These options affect Unicode-based steganography encoding/decoding.</small>
             </div>
         </div>

js/app.js

@@ -100,6 +100,8 @@ window.app = new Vue({
         maxHistoryItems: 10,
         showCopyHistory: false,
         showUnicodePanel: false,
+        unicodeApplyBusy: false,
+        unicodeApplyFlash: false,
 
         // Danger zone controls
         showDangerModal: false,
@@ -115,6 +117,8 @@ window.app = new Vue({
             }
         },
         applyUnicodeOptions() {
+            if (this.unicodeApplyBusy) return;
+            this.unicodeApplyBusy = true;
             try {
                 const initSel = document.querySelector('.steg-initial-presentation');
                 const vs0Sel = document.querySelector('.steg-vs-zero');
@@ -134,14 +138,16 @@ window.app = new Vue({
                         bitOrder: orderSel && orderSel.value || 'msb',
                         trailingZW: trailSel && trailSel.value || ''
                     });
+                    this.unicodeApplyFlash = true;
                     this.showNotification('<i class="fas fa-sliders-h"></i> Advanced settings applied', 'success');
+                    setTimeout(()=>{ this.unicodeApplyFlash = false; }, 1200);
                 } else {
                     this.showNotification('<i class="fas fa-exclamation-triangle"></i> Engine missing setOptions()', 'warning');
                 }
             } catch (e) {
                 console.error('Apply Unicode options error', e);
                 this.showNotification('<i class="fas fa-exclamation-triangle"></i> Failed to apply settings', 'error');
-            }
+            } finally { this.unicodeApplyBusy = false; }
         },
         // Focus an element without causing the page to scroll
         focusWithoutScroll(el) {