feat: strengthen Screen 9 justification validation to 12 chars + two-word minimum

- Replaces the 5-char floor with: length >= 12 AND includes at least one space,
  preventing single-word garbage responses (e.g. "idk", "good") from passing
- Displays inline hint 'Please provide a brief, complete sentence.' when input
  is non-empty but does not yet meet the criteria
- Adds #justification-hint <p> element to index.html (Screen 9)
- Adds .input-hint style (amber, 0.8rem) to style.css
- Caches justificationHint in experiment.js DOM map
- Updates METHODS.md Data Quality section to reflect new threshold

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

Author: hashexplaindata

code/experiment.js

@@ -289,6 +289,7 @@ const DOM = {
     trialCounter: document.getElementById('trial-counter'),
     progressFill: document.getElementById('progress-fill'),
     textareaJustification: document.getElementById('semantic-justification'),
+    justificationHint:     document.getElementById('justification-hint'),
     btnFinalize: document.getElementById('btn-finalize'),
     syncStatus: document.getElementById('sync-status'),
     finalActions: document.getElementById('final-actions'),
@@ -343,8 +344,17 @@ function init() {
     });
 
     // Screen 9 Events
+    // NOTE: The threshold (12 chars + at least one space) is intentional and must NOT be raised further.
+    // A higher threshold increases study abandonment at the final screen, immediately
+    // before the Firebase payload fires. Low-effort responses are expected and will be
+    // filtered analytically via cosine-similarity scoring during NLP post-processing.
     DOM.textareaJustification.addEventListener('input', (e) => {
-        DOM.btnFinalize.disabled = e.target.value.trim().length < 5;
+        const val = e.target.value.trim();
+        const valid = val.length >= 12 && val.includes(' ');
+        DOM.btnFinalize.disabled = !valid;
+        DOM.justificationHint.textContent = val.length > 0 && !valid
+            ? 'Please provide a brief, complete sentence.'
+            : '';
     });
 
     DOM.btnFinalize.addEventListener('click', () => {

code/index.html

@@ -106,6 +106,7 @@ <h2>Strategic Rationalization</h2>
                 <p class="instruction">In one sentence, what was your primary strategy for choosing between the layouts?</p>
 
                 <textarea id="semantic-justification" placeholder="My strategy was based on..." maxlength="280"></textarea>
+                <p id="justification-hint" class="input-hint"></p>
 
                 <button id="btn-finalize" class="btn-primary" disabled>Complete Diagnostic</button>
             </div>

code/style.css

@@ -295,13 +295,21 @@ textarea {
     font-family: inherit;
     font-size: 1rem;
     resize: none;
-    margin-bottom: 1.5rem;
+    margin-bottom: 0.4rem;
     outline: none;
     transition: border-color 0.3s ease;
 }
 
 textarea:focus { border-color: var(--accent-blue); }
 
+.input-hint {
+    min-height: 1.1rem;
+    margin: 0 0 1rem;
+    font-size: 0.8rem;
+    color: #f5a623;
+    text-align: left;
+}
+
 /* --- Screen 10: Outro --- */
 .success-card { text-align: center; }
 .success-icon {

docs/METHODS.md

@@ -75,7 +75,7 @@ Each pair shared identical layout and functionality, differing only in a single
 
 ### Semantic Justification Field (Screen 9)
 
-The in-app UI enforces a 5-character minimum on the free-text justification input before the "Complete Diagnostic" button is enabled. This threshold was intentionally set low to avoid study abandonment at the final step immediately before the Firebase payload fires — a higher character floor would increase drop-off without meaningfully improving response quality.
+The in-app UI enforces a minimum of 12 characters **and** at least one space (requiring a minimum of two words) on the free-text justification input before the "Complete Diagnostic" button is enabled. If the input does not meet these criteria, the UI displays: *"Please provide a brief, complete sentence."* This threshold was set to discourage single-word garbage responses (e.g., "idk", "good") while remaining low enough to avoid study abandonment at the final step immediately before the Firebase payload fires.
 
 **Known risk:** Mobile keyboard friction will motivate a subset of participants to satisfy the minimum with low-effort, non-informative responses (e.g., "idk", "good", "it looked better").