@vitronai/alethia 0.3.8 → 0.3.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (20) hide show
  1. package/README.md +46 -11
  2. package/demo/README.md +58 -35
  3. package/demo/admin-panel.html +1 -1
  4. package/demo/agent-oversight.html +237 -0
  5. package/demo/crypto-readiness.html +237 -0
  6. package/demo/ea1-stress-test.html +200 -0
  7. package/demo/financial-dashboard.html +1 -1
  8. package/demo/incident-response.html +267 -0
  9. package/demo/nist-compliance.html +129 -0
  10. package/demo/threat-intel.html +301 -0
  11. package/demo/wcag-audit.html +113 -0
  12. package/dist/index.js +25 -2
  13. package/dist/index.js.map +1 -1
  14. package/package.json +2 -2
  15. package/demo/cookie-banner.html +0 -66
  16. package/demo/ecommerce.html +0 -88
  17. package/demo/form-validation.html +0 -113
  18. package/demo/signup-form.html +0 -70
  19. package/demo/spa-loading.html +0 -64
  20. package/demo/todo-app.html +0 -51
package/demo/incident-response.html ADDED
@@ -0,0 +1,267 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <title>SIEM — Incident Response Console</title>
5
+ <style>
6
+ * { box-sizing: border-box; margin: 0; padding: 0; }
7
+ body { font-family: 'SF Mono', 'Fira Code', monospace; background: #080c14; color: #c8d6e5; min-height: 100vh; padding: 1rem; font-size: 0.85rem; }
8
+ .header { display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #1a2744; padding-bottom: 0.8rem; margin-bottom: 1rem; }
9
+ .header h1 { font-size: 1.1rem; color: #e2e8f0; font-weight: 600; }
10
+ .severity-critical { color: #ff4444; font-weight: 700; animation: pulse 1.5s ease-in-out infinite; }
11
+ @keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }
12
+ .severity-high { color: #ff8c00; }
13
+ .severity-medium { color: #ffd700; }
14
+ .severity-low { color: #00bfff; }
15
+ .status-bar { display: flex; gap: 2rem; color: #5a7a9e; font-size: 0.75rem; }
16
+ .grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
17
+ .panel { background: #0d1525; border: 1px solid #1a2744; border-radius: 8px; padding: 1rem; }
18
+ .panel h2 { font-size: 0.9rem; color: #7eb8da; margin-bottom: 0.8rem; text-transform: uppercase; letter-spacing: 0.08em; }
19
+ .alert-row { display: flex; justify-content: space-between; align-items: center; padding: 0.5rem 0; border-bottom: 1px solid #111d30; }
20
+ .alert-row:last-child { border-bottom: none; }
21
+ .alert-info { display: flex; flex-direction: column; gap: 0.15rem; }
22
+ .alert-id { color: #5a7a9e; font-size: 0.7rem; }
23
+ .alert-msg { color: #c8d6e5; }
24
+ .alert-source { color: #5a7a9e; font-size: 0.7rem; }
25
+ .actions { display: flex; gap: 0.4rem; }
26
+ button { padding: 0.3rem 0.6rem; border-radius: 4px; border: 1px solid #1a2744; background: #111d30; color: #7eb8da; cursor: pointer; font: inherit; font-size: 0.75rem; }
27
+ button:hover { border-color: #3a8fd4; }
28
+ .btn-acknowledge { border-color: #00bfff; color: #00bfff; }
29
+ .btn-escalate { border-color: #ff8c00; color: #ff8c00; }
30
+ .btn-isolate { border-color: #ff4444; color: #ff4444; }
31
+ .btn-quarantine { border-color: #ff4444; color: #ff4444; background: #1a0808; }
32
+ .log-feed { max-height: 200px; overflow-y: auto; font-size: 0.75rem; }
33
+ .log-entry { padding: 0.2rem 0; display: flex; gap: 0.6rem; }
34
+ .log-ts { color: #3a5570; min-width: 80px; }
35
+ .log-level-crit { color: #ff4444; }
36
+ .log-level-warn { color: #ffd700; }
37
+ .log-level-info { color: #00bfff; }
38
+ .ioc-list { list-style: none; }
39
+ .ioc-item { padding: 0.4rem 0; border-bottom: 1px solid #111d30; display: flex; justify-content: space-between; }
40
+ .ioc-value { color: #ff8c00; }
41
+ .ioc-type { color: #5a7a9e; font-size: 0.7rem; }
42
+ .timeline { list-style: none; position: relative; padding-left: 1.2rem; }
43
+ .timeline::before { content: ''; position: absolute; left: 4px; top: 0; bottom: 0; width: 1px; background: #1a2744; }
44
+ .timeline li { padding: 0.4rem 0; position: relative; }
45
+ .timeline li::before { content: ''; position: absolute; left: -1.2rem; top: 0.55rem; width: 8px; height: 8px; border-radius: 50%; background: #1a2744; border: 1px solid #3a5570; }
46
+ .timeline li.active::before { background: #ff4444; border-color: #ff4444; box-shadow: 0 0 6px #ff4444; }
47
+ .host-card { background: #111d30; border: 1px solid #1a2744; border-radius: 6px; padding: 0.6rem; margin-bottom: 0.5rem; }
48
+ .host-name { color: #e2e8f0; font-weight: 600; }
49
+ .host-ip { color: #5a7a9e; }
50
+ .host-status { display: inline-block; padding: 0.1rem 0.4rem; border-radius: 3px; font-size: 0.7rem; }
51
+ .host-compromised { background: #1a0808; color: #ff4444; border: 1px solid #ff4444; }
52
+ .host-at-risk { background: #1a1400; color: #ffd700; border: 1px solid #ffd700; }
53
+ .host-clean { background: #001a0a; color: #00cc66; border: 1px solid #00cc66; }
54
+ .modal { display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.8); z-index: 100; align-items: center; justify-content: center; }
55
+ .modal.visible { display: flex; }
56
+ .modal-content { background: #0d1525; border: 1px solid #ff4444; border-radius: 8px; padding: 1.5rem; max-width: 420px; }
57
+ .modal-content h3 { color: #ff4444; margin-bottom: 0.6rem; }
58
+ .modal-content p { color: #7eb8da; margin-bottom: 1rem; font-size: 0.85rem; line-height: 1.5; }
59
+ .modal-actions { display: flex; gap: 0.6rem; justify-content: flex-end; }
60
+ .btn-cancel { background: #111d30; color: #7eb8da; }
61
+ .btn-confirm-isolate { background: #1a0808; border-color: #ff4444; color: #ff4444; font-weight: 700; }
62
+ .response-banner { display: none; padding: 0.6rem 1rem; border-radius: 6px; margin-bottom: 1rem; font-weight: 600; }
63
+ .response-banner.visible { display: block; }
64
+ .response-success { background: #001a0a; border: 1px solid #00cc66; color: #00cc66; }
65
+ .response-escalated { background: #1a1400; border: 1px solid #ffd700; color: #ffd700; }
66
+ </style>
67
+ </head>
68
+ <body>
69
+ <div class="header">
70
+ <div>
71
+ <h1>Incident Response Console</h1>
72
+ <div class="status-bar">
73
+ <span>Analyst: soc-analyst-4 &bull; Shift: Night</span>
74
+ <span>Active incidents: 3</span>
75
+ <span>Mean time to respond: 4m 12s</span>
76
+ </div>
77
+ </div>
78
+ <span class="severity-critical">CRITICAL INCIDENT ACTIVE</span>
79
+ </div>
80
+
81
+ <div id="response-banner" class="response-banner"></div>
82
+
83
+ <div class="grid">
84
+ <div class="panel">
85
+ <h2>Active Alerts</h2>
86
+ <div class="alert-row">
87
+ <div class="alert-info">
88
+ <span class="alert-id">INC-2026-0847</span>
89
+ <span class="alert-msg"><span class="severity-critical">CRITICAL</span> — Lateral movement detected: WORKSTATION-14 → DC-PRIMARY</span>
90
+ <span class="alert-source">Source: EDR &bull; MITRE: T1021.002</span>
91
+ </div>
92
+ <div class="actions">
93
+ <button class="btn-acknowledge" id="ack-847">Acknowledge</button>
94
+ <button class="btn-escalate" id="esc-847">Escalate</button>
95
+ </div>
96
+ </div>
97
+ <div class="alert-row">
98
+ <div class="alert-info">
99
+ <span class="alert-id">INC-2026-0848</span>
100
+ <span class="alert-msg"><span class="severity-high">HIGH</span> — Credential dump attempt: lsass.exe memory access</span>
101
+ <span class="alert-source">Source: EDR &bull; MITRE: T1003.001</span>
102
+ </div>
103
+ <div class="actions">
104
+ <button class="btn-acknowledge" id="ack-848">Acknowledge</button>
105
+ </div>
106
+ </div>
107
+ <div class="alert-row">
108
+ <div class="alert-info">
109
+ <span class="alert-id">INC-2026-0849</span>
110
+ <span class="alert-msg"><span class="severity-medium">MEDIUM</span> — Unusual outbound DNS: TXT queries to .xyz domain</span>
111
+ <span class="alert-source">Source: NDR &bull; MITRE: T1071.004</span>
112
+ </div>
113
+ <div class="actions">
114
+ <button class="btn-acknowledge" id="ack-849">Acknowledge</button>
115
+ </div>
116
+ </div>
117
+ </div>
118
+
119
+ <div class="panel">
120
+ <h2>Affected Hosts</h2>
121
+ <div class="host-card">
122
+ <div style="display:flex;justify-content:space-between;align-items:center">
123
+ <div><span class="host-name">WORKSTATION-14</span> <span class="host-ip">10.0.4.14</span></div>
124
+ <span class="host-status host-compromised">COMPROMISED</span>
125
+ </div>
126
+ <div class="actions" style="margin-top:0.5rem">
127
+ <button class="btn-isolate" id="isolate-ws14">Isolate from Network</button>
128
+ <button class="btn-quarantine" id="quarantine-ws14">Quarantine &amp; Image</button>
129
+ </div>
130
+ </div>
131
+ <div class="host-card">
132
+ <div style="display:flex;justify-content:space-between;align-items:center">
133
+ <div><span class="host-name">DC-PRIMARY</span> <span class="host-ip">10.0.1.1</span></div>
134
+ <span class="host-status host-at-risk">AT RISK</span>
135
+ </div>
136
+ <div class="actions" style="margin-top:0.5rem">
137
+ <button class="btn-isolate" id="isolate-dc">Isolate from Network</button>
138
+ </div>
139
+ </div>
140
+ <div class="host-card">
141
+ <div style="display:flex;justify-content:space-between;align-items:center">
142
+ <div><span class="host-name">FILE-SERVER-02</span> <span class="host-ip">10.0.2.8</span></div>
143
+ <span class="host-status host-clean">CLEAN</span>
144
+ </div>
145
+ </div>
146
+ </div>
147
+
148
+ <div class="panel">
149
+ <h2>Indicators of Compromise</h2>
150
+ <ul class="ioc-list">
151
+ <li class="ioc-item"><span class="ioc-value">185.220.101.42</span><span class="ioc-type">C2 IP</span></li>
152
+ <li class="ioc-item"><span class="ioc-value">evil-update.xyz</span><span class="ioc-type">C2 Domain</span></li>
153
+ <li class="ioc-item"><span class="ioc-value">a3f2b8c1...d94e</span><span class="ioc-type">Malware SHA-256</span></li>
154
+ <li class="ioc-item"><span class="ioc-value">svchost-update.exe</span><span class="ioc-type">Process Name</span></li>
155
+ <li class="ioc-item"><span class="ioc-value">HKLM\Software\MalRun</span><span class="ioc-type">Registry Key</span></li>
156
+ </ul>
157
+ </div>
158
+
159
+ <div class="panel">
160
+ <h2>Attack Timeline</h2>
161
+ <ul class="timeline">
162
+ <li>09:14:22 — Initial phishing email delivered to user jsmith</li>
163
+ <li>09:18:45 — Malicious attachment opened on WORKSTATION-14</li>
164
+ <li>09:19:02 — Payload executed: svchost-update.exe</li>
165
+ <li>09:22:18 — C2 beacon established to 185.220.101.42</li>
166
+ <li>09:34:11 — Credential dump: lsass.exe memory access</li>
167
+ <li class="active">09:41:33 — Lateral movement to DC-PRIMARY via SMB</li>
168
+ <li>09:42:07 — DNS exfiltration attempt to evil-update.xyz</li>
169
+ </ul>
170
+ </div>
171
+ </div>
172
+
173
+ <div class="panel" style="margin-top:1rem">
174
+ <h2>Live Event Feed</h2>
175
+ <div class="log-feed" id="log-feed">
176
+ <div class="log-entry"><span class="log-ts">09:42:07</span><span class="log-level-crit">CRIT</span> DNS exfiltration: TXT query to evil-update.xyz from 10.0.4.14</div>
177
+ <div class="log-entry"><span class="log-ts">09:41:33</span><span class="log-level-crit">CRIT</span> SMB lateral movement: 10.0.4.14 → 10.0.1.1 using stolen creds</div>
178
+ <div class="log-entry"><span class="log-ts">09:34:11</span><span class="log-level-warn">WARN</span> Credential access: lsass.exe memory read by svchost-update.exe</div>
179
+ <div class="log-entry"><span class="log-ts">09:22:18</span><span class="log-level-warn">WARN</span> C2 beacon: HTTPS POST to 185.220.101.42:443 every 30s</div>
180
+ <div class="log-entry"><span class="log-ts">09:19:02</span><span class="log-level-info">INFO</span> Process start: svchost-update.exe (PID 4892) on WORKSTATION-14</div>
181
+ </div>
182
+ </div>
183
+
184
+ <div id="isolate-modal" class="modal">
185
+ <div class="modal-content">
186
+ <h3>Confirm Network Isolation</h3>
187
+ <p id="isolate-modal-text">This will immediately sever all network connectivity for the target host. Active sessions will be terminated. This action is logged and requires SOC manager approval for reversal.</p>
188
+ <div class="modal-actions">
189
+ <button class="btn-cancel" id="cancel-isolate">Cancel</button>
190
+ <button class="btn-confirm-isolate" id="confirm-isolate">Confirm Isolation</button>
191
+ </div>
192
+ </div>
193
+ </div>
194
+
195
+ <script>
196
+ var isolateTarget = '';
197
+ document.getElementById('ack-847').addEventListener('click', function() {
198
+ this.textContent = 'Acknowledged';
199
+ this.disabled = true;
200
+ this.style.borderColor = '#00cc66';
201
+ this.style.color = '#00cc66';
202
+ addLog('INFO', 'INC-2026-0847 acknowledged by soc-analyst-4');
203
+ });
204
+ document.getElementById('ack-848').addEventListener('click', function() {
205
+ this.textContent = 'Acknowledged';
206
+ this.disabled = true;
207
+ this.style.borderColor = '#00cc66';
208
+ this.style.color = '#00cc66';
209
+ addLog('INFO', 'INC-2026-0848 acknowledged by soc-analyst-4');
210
+ });
211
+ document.getElementById('ack-849').addEventListener('click', function() {
212
+ this.textContent = 'Acknowledged';
213
+ this.disabled = true;
214
+ this.style.borderColor = '#00cc66';
215
+ this.style.color = '#00cc66';
216
+ addLog('INFO', 'INC-2026-0849 acknowledged by soc-analyst-4');
217
+ });
218
+ document.getElementById('esc-847').addEventListener('click', function() {
219
+ var banner = document.getElementById('response-banner');
220
+ banner.className = 'response-banner visible response-escalated';
221
+ banner.textContent = 'INC-2026-0847 escalated to SOC Manager. ETA: 2 minutes.';
222
+ this.textContent = 'Escalated';
223
+ this.disabled = true;
224
+ addLog('WARN', 'INC-2026-0847 escalated to SOC Manager by soc-analyst-4');
225
+ });
226
+ document.getElementById('isolate-ws14').addEventListener('click', function() {
227
+ isolateTarget = 'WORKSTATION-14';
228
+ document.getElementById('isolate-modal-text').textContent =
229
+ 'This will immediately sever all network connectivity for WORKSTATION-14 (10.0.4.14). Active sessions will be terminated. This action is logged and requires SOC manager approval for reversal.';
230
+ document.getElementById('isolate-modal').classList.add('visible');
231
+ });
232
+ document.getElementById('isolate-dc').addEventListener('click', function() {
233
+ isolateTarget = 'DC-PRIMARY';
234
+ document.getElementById('isolate-modal-text').textContent =
235
+ 'WARNING: Isolating DC-PRIMARY (10.0.1.1) will affect all Active Directory authentication. This will immediately sever all network connectivity. This action is logged and requires SOC manager approval for reversal.';
236
+ document.getElementById('isolate-modal').classList.add('visible');
237
+ });
238
+ document.getElementById('quarantine-ws14').addEventListener('click', function() {
239
+ isolateTarget = 'WORKSTATION-14';
240
+ document.getElementById('isolate-modal-text').textContent =
241
+ 'This will isolate WORKSTATION-14, capture a forensic disk image, and quarantine the host for analysis. The host will be offline until forensic review is complete.';
242
+ document.getElementById('isolate-modal').classList.add('visible');
243
+ });
244
+ document.getElementById('cancel-isolate').addEventListener('click', function() {
245
+ document.getElementById('isolate-modal').classList.remove('visible');
246
+ addLog('INFO', 'Isolation cancelled for ' + isolateTarget);
247
+ });
248
+ document.getElementById('confirm-isolate').addEventListener('click', function() {
249
+ document.getElementById('isolate-modal').classList.remove('visible');
250
+ var banner = document.getElementById('response-banner');
251
+ banner.className = 'response-banner visible response-success';
252
+ banner.textContent = isolateTarget + ' isolated from network. Forensic imaging initiated.';
253
+ addLog('CRIT', isolateTarget + ' network isolation executed by soc-analyst-4');
254
+ });
255
+ function addLog(level, msg) {
256
+ var feed = document.getElementById('log-feed');
257
+ var entry = document.createElement('div');
258
+ entry.className = 'log-entry';
259
+ var now = new Date();
260
+ var ts = now.toTimeString().slice(0, 8);
261
+ var cls = level === 'CRIT' ? 'log-level-crit' : level === 'WARN' ? 'log-level-warn' : 'log-level-info';
262
+ entry.innerHTML = '<span class="log-ts">' + ts + '</span><span class="' + cls + '">' + level + '</span> ' + msg;
263
+ feed.insertBefore(entry, feed.firstChild);
264
+ }
265
+ </script>
266
+ </body>
267
+ </html>
package/demo/nist-compliance.html ADDED
@@ -0,0 +1,129 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <title>Federal Asset Management System</title>
5
+ <style>
6
+ * { box-sizing: border-box; margin: 0; padding: 0; }
7
+ body { font-family: 'SF Mono', monospace; background: #080c14; color: #c8d6e5; min-height: 100vh; padding: 1.5rem; font-size: 0.85rem; }
8
+ h1 { font-size: 1.2rem; color: #e2e8f0; margin-bottom: 0.3rem; }
9
+ .subtitle { color: #5a7a9e; font-size: 0.8rem; margin-bottom: 1.5rem; }
10
+ .grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
11
+ .panel { background: #0d1525; border: 1px solid #1a2744; border-radius: 8px; padding: 1rem; }
12
+ .panel h2 { font-size: 0.85rem; color: #7eb8da; margin-bottom: 0.8rem; text-transform: uppercase; letter-spacing: 0.08em; }
13
+ .full-width { grid-column: 1 / -1; }
14
+ .finding { padding: 0.5rem 0; border-bottom: 1px solid #111d30; }
15
+ .finding:last-child { border-bottom: none; }
16
+ .finding-control { font-size: 0.7rem; color: #ff8c00; font-weight: 700; }
17
+ .finding-desc { color: #c8d6e5; margin-top: 0.15rem; }
18
+ .expect-flag { font-size: 0.7rem; padding: 0.15rem 0.5rem; border-radius: 3px; background: #1a0808; color: #ff4444; border: 1px solid #ff4444; display: inline-block; margin-top: 0.3rem; }
19
+ .expect-pass { font-size: 0.7rem; padding: 0.15rem 0.5rem; border-radius: 3px; background: #001a0a; color: #00cc66; border: 1px solid #00cc66; display: inline-block; margin-top: 0.3rem; }
20
+ input, select { padding: 0.35rem 0.5rem; border-radius: 4px; border: 1px solid #1a2744; background: #111d30; color: #e2e8f0; font: inherit; font-size: 0.8rem; width: 200px; margin: 0.2rem 0; display: block; }
21
+ button { padding: 0.35rem 0.7rem; border-radius: 4px; border: 1px solid #1a2744; background: #111d30; color: #7eb8da; cursor: pointer; font: inherit; font-size: 0.75rem; margin: 0.2rem 0; }
22
+ .error-leak { color: #ff4444; font-family: monospace; font-size: 0.75rem; background: #1a0808; padding: 0.5rem; border-radius: 4px; margin-top: 0.3rem; border: 1px solid #331111; }
23
+ table { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin-top: 0.5rem; }
24
+ th { text-align: left; padding: 0.4rem; color: #5a7a9e; border-bottom: 1px solid #1a2744; }
25
+ td { padding: 0.4rem; border-bottom: 1px solid #111d30; }
26
+ .score-bar { display: flex; gap: 1.5rem; padding: 0.8rem; background: #111d30; border-radius: 8px; border: 1px solid #1a2744; margin-bottom: 1rem; }
27
+ .score-label { color: #5a7a9e; font-size: 0.8rem; }
28
+ .score-value { font-size: 1.8rem; font-weight: 700; }
29
+ .score-bad { color: #ff4444; }
30
+ </style>
31
+ </head>
32
+ <body>
33
+ <h1>NIST 800-53 Compliance Audit — Negative Test</h1>
34
+ <p class="subtitle">This page deliberately violates NIST SP 800-53 Rev. 5 web application security controls. Alethia's compliance audit should flag all violations.</p>
35
+
36
+ <div class="score-bar">
37
+ <div><span class="score-label">Expected NIST findings:</span> <span class="score-value score-bad">6+</span></div>
38
+ <div><span class="score-label">Controls tested:</span> <span class="score-value" style="color:#7eb8da">7</span></div>
39
+ </div>
40
+
41
+ <div class="grid">
42
+ <div class="panel">
43
+ <h2>AC-7: No Login Attempt Limiting</h2>
44
+ <div class="finding">
45
+ <span class="finding-control">VIOLATION: AC-7</span>
46
+ <div class="finding-desc">Login form with no lockout after failed attempts</div>
47
+ <span class="expect-flag">SHOULD FLAG</span>
48
+ </div>
49
+ <form>
50
+ <input type="text" placeholder="Username" />
51
+ <input type="password" placeholder="Password" aria-label="Password" />
52
+ <button type="button">Sign In</button>
53
+ </form>
54
+ </div>
55
+
56
+ <div class="panel">
57
+ <h2>AC-8: No Security Banner</h2>
58
+ <div class="finding">
59
+ <span class="finding-control">VIOLATION: AC-8</span>
60
+ <div class="finding-desc">Federal system without system use notification or classification banner</div>
61
+ <span class="expect-flag">SHOULD FLAG</span>
62
+ </div>
63
+ <p style="color:#5a7a9e;font-size:0.75rem;margin-top:0.5rem">This page has no classification banner, no authorized use warning, and no consent notice — required for all federal information systems.</p>
64
+ </div>
65
+
66
+ <div class="panel">
67
+ <h2>AC-12: No Session Timeout</h2>
68
+ <div class="finding">
69
+ <span class="finding-control">VIOLATION: AC-12</span>
70
+ <div class="finding-desc">No session timeout or inactivity lock mechanism</div>
71
+ <span class="expect-flag">SHOULD FLAG</span>
72
+ </div>
73
+ <p style="color:#5a7a9e;font-size:0.75rem;margin-top:0.5rem">Sessions persist indefinitely. No meta refresh, no session timer, no inactivity warning. NIST requires automatic termination after a defined period.</p>
74
+ </div>
75
+
76
+ <div class="panel">
77
+ <h2>SI-10: Missing Input Validation</h2>
78
+ <div class="finding">
79
+ <span class="finding-control">VIOLATION: SI-10</span>
80
+ <div class="finding-desc">Form fields without validation constraints</div>
81
+ <span class="expect-flag">SHOULD FLAG</span>
82
+ </div>
83
+ <input type="email" placeholder="Email — no pattern, no required" />
84
+ <input type="tel" placeholder="Phone — no pattern, no maxlength" />
85
+ <input type="text" placeholder="SSN — no maxlength, no pattern" />
86
+ <input type="text" placeholder="Notes — unrestricted input" />
87
+ </div>
88
+
89
+ <div class="panel">
90
+ <h2>SI-11: Information Leakage in Errors</h2>
91
+ <div class="finding">
92
+ <span class="finding-control">VIOLATION: SI-11</span>
93
+ <div class="finding-desc">Error messages expose internal implementation details</div>
94
+ <span class="expect-flag">SHOULD FLAG</span>
95
+ </div>
96
+ <div class="error-leak" role="alert">
97
+ Error: Unhandled exception at line 247 in /app/controllers/UserController.js
98
+ SQL query failed: SELECT * FROM users WHERE id = '${input}'
99
+ Stack trace: at UserController.findById (UserController.js:247)
100
+ </div>
101
+ </div>
102
+
103
+ <div class="panel">
104
+ <h2>IA-6: Unmasked Password Fields</h2>
105
+ <div class="finding">
106
+ <span class="finding-control">VIOLATION: IA-6</span>
107
+ <div class="finding-desc">Credential fields not masked — passwords visible in plaintext</div>
108
+ <span class="expect-flag">SHOULD FLAG</span>
109
+ </div>
110
+ <input type="text" placeholder="API Secret Key" name="secret" aria-label="API Secret" />
111
+ <input type="text" placeholder="Database Password" name="password" aria-label="Database Password" />
112
+ </div>
113
+
114
+ <div class="panel full-width">
115
+ <h2>Compliant Controls (should NOT be flagged)</h2>
116
+ <table>
117
+ <thead><tr><th>Control</th><th>Implementation</th><th>Status</th></tr></thead>
118
+ <tbody>
119
+ <tr><td>SC-13</td><td>All forms use relative URLs (no insecure HTTP)</td><td style="color:#00cc66">PASS</td></tr>
120
+ <tr><td>AU-2</td><td>Audit log present on page</td><td style="color:#00cc66">PASS</td></tr>
121
+ </tbody>
122
+ </table>
123
+ <div class="audit-log" style="margin-top:0.5rem;font-size:0.7rem;color:#3a5570;padding:0.4rem;background:#0a0e14;border-radius:4px">
124
+ [2026-04-10T21:14:22Z] Page accessed by compliance-auditor | [2026-04-10T21:14:28Z] Audit scan initiated
125
+ </div>
126
+ </div>
127
+ </div>
128
+ </body>
129
+ </html>