caustino commited on
Commit
dfb856c
·
verified ·
1 Parent(s): b05b71f

Upload folder using huggingface_hub

Browse files
Files changed (1) hide show
  1. index.html +745 -19
index.html CHANGED
@@ -1,19 +1,745 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>CINP-2024-X1 UOSE — Policy Blueprint & Technical Dossier</title>
7
+ <link rel="preconnect" href="https://fonts.googleapis.com">
8
+ <link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&family=IBM+Plex+Sans:wght@300;400;500;600;700&family=IBM+Plex+Serif:wght@400;600;700&display=swap" rel="stylesheet">
9
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css">
10
+ <style>
11
+ :root {
12
+ --navy: #1a2a4a;
13
+ --navy-deep: #0d1a2f;
14
+ --navy-light: #2a3f6a;
15
+ --slate: #4a5568;
16
+ --teal: #0891b2;
17
+ --teal-light: #22d3ee;
18
+ --amber: #d97706;
19
+ --amber-light: #fbbf24;
20
+ --crimson: #dc2626;
21
+ --emerald: #059669;
22
+ --purple: #8b5cf6;
23
+ --bg: #f9fafb;
24
+ --bg-alt: #f1f5f9;
25
+ --card: #ffffff;
26
+ --border: #e2e8f0;
27
+ --text: #1e293b;
28
+ --text-muted: #64748b;
29
+ --mono: 'IBM Plex Mono', monospace;
30
+ --sans: 'IBM Plex Sans', sans-serif;
31
+ --serif: 'IBM Plex Serif', serif;
32
+ --shadow-sm: 0 1px 2px rgba(26,42,74,0.06);
33
+ --shadow-md: 0 4px 12px rgba(26,42,74,0.08);
34
+ --shadow-lg: 0 8px 30px rgba(26,42,74,0.12);
35
+ }
36
+
37
+ *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
38
+
39
+ html { scroll-behavior: smooth; font-size: 16px; }
40
+
41
+ body {
42
+ font-family: var(--sans);
43
+ color: var(--text);
44
+ background: var(--bg);
45
+ line-height: 1.7;
46
+ -webkit-font-smoothing: antialiased;
47
+ }
48
+
49
+ /* Scrollbar */
50
+ ::-webkit-scrollbar { width: 6px; }
51
+ ::-webkit-scrollbar-track { background: var(--bg-alt); }
52
+ ::-webkit-scrollbar-thumb { background: var(--slate); border-radius: 3px; }
53
+
54
+ /* Skip link */
55
+ .skip-link {
56
+ position: absolute; top: -100%; left: 16px;
57
+ background: var(--navy); color: #fff; padding: 8px 16px; z-index: 9999;
58
+ font-size: 14px; border-radius: 0 0 8px 8px;
59
+ }
60
+ .skip-link:focus { top: 0; }
61
+
62
+ /* Top bar */
63
+ .topbar {
64
+ position: fixed; top: 0; left: 0; right: 0; z-index: 100;
65
+ background: var(--navy-deep); border-bottom: 1px solid rgba(255,255,255,0.08);
66
+ height: 56px; display: flex; align-items: center; padding: 0 24px;
67
+ backdrop-filter: blur(12px);
68
+ }
69
+ .topbar-brand {
70
+ font-family: var(--mono); font-size: 13px; color: var(--teal-light);
71
+ letter-spacing: 0.05em; display: flex; align-items: center; gap: 10px;
72
+ }
73
+ .topbar-brand i { font-size: 16px; }
74
+ .topbar-right { margin-left: auto; display: flex; align-items: center; gap: 16px; }
75
+ .topbar-link {
76
+ color: rgba(255,255,255,0.6); font-size: 12px; font-family: var(--mono);
77
+ text-decoration: none; letter-spacing: 0.03em; transition: color 0.2s;
78
+ }
79
+ .topbar-link:hover { color: var(--teal-light); }
80
+ .anycoder-link {
81
+ color: var(--teal-light); font-family: var(--mono); font-size: 12px;
82
+ text-decoration: none; font-weight: 600; letter-spacing: 0.04em;
83
+ border: 1px solid rgba(34,211,238,0.3); padding: 3px 10px; border-radius: 4px;
84
+ transition: all 0.2s;
85
+ }
86
+ .anycoder-link:hover { background: rgba(34,211,238,0.1); border-color: var(--teal-light); }
87
+
88
+ /* Layout */
89
+ .layout {
90
+ display: grid;
91
+ grid-template-columns: 260px 1fr;
92
+ margin-top: 56px;
93
+ min-height: calc(100vh - 56px);
94
+ }
95
+
96
+ /* Sidebar */
97
+ .sidebar {
98
+ position: sticky; top: 56px; height: calc(100vh - 56px);
99
+ overflow-y: auto; background: var(--navy-deep);
100
+ border-right: 1px solid rgba(255,255,255,0.06);
101
+ padding: 20px 0; scrollbar-width: thin;
102
+ scrollbar-color: var(--navy-light) transparent;
103
+ }
104
+ .sidebar::-webkit-scrollbar { width: 4px; }
105
+ .sidebar::-webkit-scrollbar-thumb { background: var(--navy-light); border-radius: 2px; }
106
+
107
+ .sidebar-section { margin-bottom: 16px; }
108
+ .sidebar-section-title {
109
+ font-family: var(--mono); font-size: 10px; font-weight: 600;
110
+ color: rgba(255,255,255,0.35); letter-spacing: 0.12em;
111
+ padding: 8px 20px 4px; text-transform: uppercase;
112
+ }
113
+ .sidebar-link {
114
+ display: flex; align-items: center; gap: 8px;
115
+ padding: 6px 20px; font-size: 13px; color: rgba(255,255,255,0.55);
116
+ text-decoration: none; transition: all 0.2s; border-left: 2px solid transparent;
117
+ font-family: var(--sans);
118
+ }
119
+ .sidebar-link:hover {
120
+ color: rgba(255,255,255,0.9); background: rgba(255,255,255,0.04);
121
+ border-left-color: rgba(34,211,238,0.3);
122
+ }
123
+ .sidebar-link.active {
124
+ color: var(--teal-light); border-left-color: var(--teal);
125
+ background: rgba(8,145,178,0.08);
126
+ }
127
+ .sidebar-link i { font-size: 11px; width: 16px; text-align: center; }
128
+
129
+ /* Main content */
130
+ .main {
131
+ padding: 40px 48px 80px;
132
+ max-width: 960px;
133
+ }
134
+
135
+ /* Section headers */
136
+ .section-anchor { scroll-margin-top: 72px; }
137
+
138
+ .mem-header {
139
+ background: linear-gradient(135deg, var(--navy-deep) 0%, var(--navy) 100%);
140
+ color: #fff; padding: 48px 48px 40px; margin: -40px -48px 40px;
141
+ border-bottom: 3px solid var(--teal);
142
+ }
143
+ .mem-to {
144
+ font-family: var(--mono); font-size: 12px; color: rgba(255,255,255,0.5);
145
+ letter-spacing: 0.06em; margin-bottom: 4px;
146
+ }
147
+ .mem-to span { color: rgba(255,255,255,0.8); }
148
+ .mem-subject {
149
+ font-family: var(--serif); font-size: 28px; font-weight: 700;
150
+ line-height: 1.25; margin: 16px 0 12px; color: #fff;
151
+ }
152
+ .mem-meta {
153
+ display: flex; flex-wrap: wrap; gap: 20px;
154
+ font-family: var(--mono); font-size: 11px; color: rgba(255,255,255,0.45);
155
+ }
156
+ .mem-meta-item { display: flex; gap: 6px; }
157
+ .mem-meta-item strong { color: rgba(255,255,255,0.7); font-weight: 500; }
158
+ .mem-classification {
159
+ display: inline-flex; align-items: center; gap: 6px;
160
+ background: var(--crimson); color: #fff; font-family: var(--mono);
161
+ font-size: 10px; font-weight: 600; padding: 3px 10px; border-radius: 3px;
162
+ letter-spacing: 0.08em; margin-top: 12px;
163
+ }
164
+
165
+ /* Headings */
166
+ h2 {
167
+ font-family: var(--serif); font-size: 24px; font-weight: 700;
168
+ color: var(--navy); margin: 48px 0 20px; padding-bottom: 12px;
169
+ border-bottom: 2px solid var(--border); line-height: 1.3;
170
+ }
171
+ h2 .section-num {
172
+ font-family: var(--mono); font-size: 14px; color: var(--teal);
173
+ font-weight: 600; display: block; margin-bottom: 4px;
174
+ }
175
+ h3 {
176
+ font-family: var(--serif); font-size: 18px; font-weight: 600;
177
+ color: var(--navy); margin: 32px 0 12px; line-height: 1.35;
178
+ }
179
+ h4 {
180
+ font-family: var(--sans); font-size: 15px; font-weight: 600;
181
+ color: var(--slate); margin: 24px 0 8px;
182
+ }
183
+
184
+ p { margin-bottom: 16px; }
185
+ strong { font-weight: 600; }
186
+
187
+ /* Cards */
188
+ .card {
189
+ background: var(--card); border: 1px solid var(--border);
190
+ border-radius: 8px; padding: 24px; margin: 20px 0;
191
+ box-shadow: var(--shadow-sm);
192
+ }
193
+ .card-accent {
194
+ border-left: 3px solid var(--teal);
195
+ }
196
+ .card-warn {
197
+ border-left: 3px solid var(--amber);
198
+ background: linear-gradient(90deg, rgba(217,119,6,0.04) 0%, var(--card) 100%);
199
+ }
200
+ .card-critical {
201
+ border-left: 3px solid var(--crimson);
202
+ background: linear-gradient(90deg, rgba(220,38,38,0.04) 0%, var(--card) 100%);
203
+ }
204
+
205
+ /* Code/ASCII blocks */
206
+ .code-block {
207
+ background: var(--navy-deep); color: rgba(255,255,255,0.82);
208
+ font-family: var(--mono); font-size: 12.5px; line-height: 1.65;
209
+ padding: 20px 24px; border-radius: 8px; overflow-x: auto;
210
+ margin: 16px 0; white-space: pre; border: 1px solid rgba(255,255,255,0.06);
211
+ }
212
+ .code-block .accent { color: var(--teal-light); }
213
+ .code-block .warn { color: var(--amber-light); }
214
+ .code-block .critical { color: #f87171; }
215
+ .code-block .success { color: #34d399; }
216
+
217
+ /* Inline code */
218
+ code {
219
+ font-family: var(--mono); font-size: 0.88em;
220
+ background: var(--bg-alt); color: var(--navy);
221
+ padding: 2px 6px; border-radius: 3px;
222
+ }
223
+
224
+ /* Lists */
225
+ .styled-list {
226
+ list-style: none; padding: 0; margin: 16px 0;
227
+ }
228
+ .styled-list li {
229
+ padding: 8px 0 8px 24px; position: relative;
230
+ border-bottom: 1px solid var(--bg-alt);
231
+ }
232
+ .styled-list li::before {
233
+ content: ''; position: absolute; left: 0; top: 16px;
234
+ width: 8px; height: 8px; border-radius: 50%;
235
+ background: var(--teal); opacity: 0.6;
236
+ }
237
+
238
+ /* Budget bars */
239
+ .budget-item {
240
+ margin: 12px 0; display: grid; grid-template-columns: 1fr auto;
241
+ gap: 8px; align-items: center;
242
+ }
243
+ .budget-label {
244
+ font-family: var(--mono); font-size: 12px; color: var(--text-muted);
245
+ }
246
+ .budget-amount {
247
+ font-family: var(--mono); font-size: 13px; font-weight: 600;
248
+ color: var(--navy); text-align: right;
249
+ }
250
+ .budget-bar-wrap {
251
+ grid-column: 1 / -1; height: 8px; background: var(--bg-alt);
252
+ border-radius: 4px; overflow: hidden;
253
+ }
254
+ .budget-bar {
255
+ height: 100%; border-radius: 4px; transition: width 1.2s cubic-bezier(0.22,1,0.36,1);
256
+ width: 0;
257
+ }
258
+
259
+ /* Stats row */
260
+ .stats-row {
261
+ display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
262
+ gap: 16px; margin: 20px 0;
263
+ }
264
+ .stat-card {
265
+ background: var(--card); border: 1px solid var(--border);
266
+ border-radius: 8px; padding: 16px 20px; text-align: center;
267
+ box-shadow: var(--shadow-sm);
268
+ }
269
+ .stat-value {
270
+ font-family: var(--mono); font-size: 28px; font-weight: 700;
271
+ color: var(--navy); line-height: 1.1;
272
+ }
273
+ .stat-value.teal { color: var(--teal); }
274
+ .stat-value.amber { color: var(--amber); }
275
+ .stat-value.emerald { color: var(--emerald); }
276
+ .stat-label {
277
+ font-size: 12px; color: var(--text-muted); margin-top: 4px;
278
+ font-family: var(--mono); letter-spacing: 0.02em;
279
+ }
280
+
281
+ /* Table */
282
+ .data-table {
283
+ width: 100%; border-collapse: collapse; margin: 16px 0;
284
+ font-size: 13px;
285
+ }
286
+ .data-table th {
287
+ font-family: var(--mono); font-size: 11px; font-weight: 600;
288
+ color: var(--text-muted); text-align: left; padding: 10px 12px;
289
+ border-bottom: 2px solid var(--border); letter-spacing: 0.04em;
290
+ text-transform: uppercase;
291
+ }
292
+ .data-table td {
293
+ padding: 10px 12px; border-bottom: 1px solid var(--bg-alt);
294
+ vertical-align: top;
295
+ }
296
+ .data-table tr:hover td { background: rgba(8,145,178,0.03); }
297
+ .data-table .mono { font-family: var(--mono); font-size: 12px; }
298
+
299
+ /* Badge */
300
+ .badge {
301
+ display: inline-flex; align-items: center; gap: 4px;
302
+ font-family: var(--mono); font-size: 10px; font-weight: 600;
303
+ padding: 2px 8px; border-radius: 3px; letter-spacing: 0.04em;
304
+ }
305
+ .badge-teal { background: rgba(8,145,178,0.1); color: var(--teal); }
306
+ .badge-amber { background: rgba(217,119,6,0.1); color: var(--amber); }
307
+ .badge-crimson { background: rgba(220,38,38,0.1); color: var(--crimson); }
308
+ .badge-emerald { background: rgba(5,150,105,0.1); color: var(--emerald); }
309
+ .badge-purple { background: rgba(139,92,246,0.1); color: var(--purple); }
310
+
311
+ /* Tooltip */
312
+ .tip {
313
+ position: relative; cursor: help;
314
+ border-bottom: 1px dotted var(--teal);
315
+ }
316
+ .tip::after {
317
+ content: attr(data-tip); position: absolute; bottom: 100%; left: 50%;
318
+ transform: translateX(-50%) translateY(-4px);
319
+ background: var(--navy-deep); color: rgba(255,255,255,0.9);
320
+ font-family: var(--mono); font-size: 11px; padding: 6px 10px;
321
+ border-radius: 4px; white-space: nowrap; pointer-events: none;
322
+ opacity: 0; transition: opacity 0.2s, transform 0.2s; z-index: 50;
323
+ }
324
+ .tip:hover::after { opacity: 1; transform: translateX(-50%) translateY(-8px); }
325
+
326
+ /* Layer diagram */
327
+ .layer-stack {
328
+ display: flex; flex-direction: column; gap: 3px; margin: 20px 0;
329
+ }
330
+ .layer-item {
331
+ padding: 10px 16px; border-radius: 4px; font-family: var(--mono);
332
+ font-size: 12px; display: flex; align-items: center; gap: 10px;
333
+ transition: transform 0.2s, box-shadow 0.2s; cursor: default;
334
+ }
335
+ .layer-item:hover { transform: translateX(4px); box-shadow: var(--shadow-md); }
336
+ .layer-num {
337
+ font-weight: 700; min-width: 24px; text-align: center;
338
+ padding: 2px 6px; border-radius: 3px; font-size: 11px;
339
+ }
340
+
341
+ /* Flow diagram */
342
+ .flow-chain {
343
+ display: flex; align-items: center; gap: 4px; flex-wrap: wrap;
344
+ margin: 16px 0; padding: 16px; background: var(--bg-alt);
345
+ border-radius: 8px; border: 1px solid var(--border);
346
+ }
347
+ .flow-node {
348
+ font-family: var(--mono); font-size: 11px; padding: 6px 12px;
349
+ background: var(--card); border: 1px solid var(--border);
350
+ border-radius: 4px; white-space: nowrap;
351
+ }
352
+ .flow-arrow {
353
+ color: var(--teal); font-size: 14px;
354
+ }
355
+
356
+ /* Reveal animation */
357
+ .reveal {
358
+ opacity: 0; transform: translateY(20px);
359
+ transition: opacity 0.6s ease, transform 0.6s ease;
360
+ }
361
+ .reveal.visible { opacity: 1; transform: translateY(0); }
362
+
363
+ /* SVG container */
364
+ .svg-container {
365
+ margin: 24px 0; border-radius: 8px; overflow: hidden;
366
+ border: 1px solid var(--border); background: #0A0F1D;
367
+ }
368
+ .svg-container svg { width: 100%; height: auto; display: block; }
369
+
370
+ /* Genotype highlight */
371
+ .genotype {
372
+ font-family: var(--mono); font-size: 0.9em;
373
+ background: rgba(139,92,246,0.1); color: var(--purple);
374
+ padding: 2px 6px; border-radius: 3px; font-weight: 500;
375
+ }
376
+
377
+ /* Claim list */
378
+ .claim-list { counter-reset: claim; list-style: none; padding: 0; }
379
+ .claim-list li {
380
+ counter-increment: claim; padding: 12px 16px 12px 48px;
381
+ position: relative; margin-bottom: 8px; background: var(--bg-alt);
382
+ border-radius: 6px; border: 1px solid var(--border);
383
+ font-size: 14px; line-height: 1.6;
384
+ }
385
+ .claim-list li::before {
386
+ content: counter(claim); position: absolute; left: 12px; top: 12px;
387
+ font-family: var(--mono); font-size: 12px; font-weight: 700;
388
+ color: var(--teal); background: rgba(8,145,178,0.1);
389
+ width: 24px; height: 24px; border-radius: 50%;
390
+ display: flex; align-items: center; justify-content: center;
391
+ }
392
+
393
+ /* Collapsible */
394
+ .collapsible-header {
395
+ display: flex; align-items: center; gap: 8px; cursor: pointer;
396
+ padding: 12px 16px; background: var(--bg-alt); border: 1px solid var(--border);
397
+ border-radius: 6px; font-family: var(--sans); font-weight: 600;
398
+ font-size: 14px; color: var(--navy); transition: background 0.2s;
399
+ user-select: none;
400
+ }
401
+ .collapsible-header:hover { background: var(--border); }
402
+ .collapsible-header i { transition: transform 0.3s; font-size: 12px; color: var(--teal); }
403
+ .collapsible-header.open i { transform: rotate(90deg); }
404
+ .collapsible-body {
405
+ max-height: 0; overflow: hidden; transition: max-height 0.4s ease, padding 0.3s;
406
+ padding: 0 16px; border-left: 2px solid var(--teal); margin-left: 8px;
407
+ }
408
+ .collapsible-body.open { max-height: 2000px; padding: 16px; }
409
+
410
+ /* Footer */
411
+ .doc-footer {
412
+ margin-top: 64px; padding: 24px 0; border-top: 2px solid var(--border);
413
+ font-family: var(--mono); font-size: 11px; color: var(--text-muted);
414
+ display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px;
415
+ }
416
+
417
+ /* Mobile sidebar toggle */
418
+ .sidebar-toggle {
419
+ display: none; position: fixed; bottom: 20px; right: 20px; z-index: 101;
420
+ width: 48px; height: 48px; border-radius: 50%; background: var(--navy);
421
+ color: #fff; border: none; font-size: 18px; cursor: pointer;
422
+ box-shadow: var(--shadow-lg); transition: transform 0.2s;
423
+ }
424
+ .sidebar-toggle:hover { transform: scale(1.08); }
425
+
426
+ /* Responsive */
427
+ @media (max-width: 900px) {
428
+ .layout { grid-template-columns: 1fr; }
429
+ .sidebar {
430
+ position: fixed; left: -280px; top: 56px; width: 280px;
431
+ z-index: 99; transition: left 0.3s ease;
432
+ box-shadow: var(--shadow-lg);
433
+ }
434
+ .sidebar.open { left: 0; }
435
+ .sidebar-toggle { display: flex; align-items: center; justify-content: center; }
436
+ .main { padding: 24px 20px 60px; }
437
+ .mem-header { padding: 32px 20px 28px; margin: -24px -20px 24px; }
438
+ .mem-subject { font-size: 22px; }
439
+ h2 { font-size: 20px; }
440
+ .stats-row { grid-template-columns: repeat(2, 1fr); }
441
+ .code-block { font-size: 11px; padding: 14px 16px; }
442
+ }
443
+
444
+ @media (max-width: 500px) {
445
+ .stats-row { grid-template-columns: 1fr; }
446
+ .flow-chain { flex-direction: column; align-items: stretch; }
447
+ .flow-arrow { transform: rotate(90deg); text-align: center; }
448
+ }
449
+
450
+ /* Print */
451
+ @media print {
452
+ .topbar, .sidebar, .sidebar-toggle { display: none !important; }
453
+ .layout { grid-template-columns: 1fr; }
454
+ .main { padding: 20px; max-width: 100%; }
455
+ .reveal { opacity: 1 !important; transform: none !important; }
456
+ }
457
+ </style>
458
+ </head>
459
+ <body>
460
+ <a href="#main-content" class="skip-link">Skip to main content</a>
461
+
462
+ <!-- Top Bar -->
463
+ <header class="topbar" role="banner">
464
+ <div class="topbar-brand">
465
+ <i class="fas fa-shield-halved"></i>
466
+ CINP-2024-X1 UOSE — INTEGRATED DOSSIER
467
+ </div>
468
+ <div class="topbar-right">
469
+ <a href="#section-budget" class="topbar-link">$243M BUDGET</a>
470
+ <a href="#section-fda" class="topbar-link">FDA TRACK</a>
471
+ <a href="#section-patent" class="topbar-link">USPTO</a>
472
+ <a href="https://huggingface.co/spaces/akhaliq/anycoder" class="anycoder-link" target="_blank" rel="noopener">Built with anycoder</a>
473
+ </div>
474
+ </header>
475
+
476
+ <div class="layout">
477
+ <!-- Sidebar Navigation -->
478
+ <nav class="sidebar" role="navigation" aria-label="Section navigation">
479
+ <div class="sidebar-section">
480
+ <div class="sidebar-section-title">Memorandum</div>
481
+ <a href="#section-exec" class="sidebar-link"><i class="fas fa-file-lines"></i> Executive Summary</a>
482
+ <a href="#section-crisis" class="sidebar-link"><i class="fas fa-triangle-exclamation"></i> Constitutional Crisis</a>
483
+ <a href="#section-cognitive" class="sidebar-link"><i class="fas fa-brain"></i> Cognitive Wall</a>
484
+ <a href="#section-sovereign" class="sidebar-link"><i class="fas fa-robot"></i> Sovereign AI</a>
485
+ <a href="#section-osip" class="sidebar-link"><i class="fas fa-link"></i> OpenSSA Pipeline</a>
486
+ <a href="#section-bsbs" class="sidebar-link"><i class="fas fa-solar-panel"></i> BSBS Utility</a>
487
+ <a href="#section-budget" class="sidebar-link"><i class="fas fa-chart-bar"></i> Budget Blueprint</a>
488
+ </div>
489
+ <div class="sidebar-section">
490
+ <div class="sidebar-section-title">Technical Dossier</div>
491
+ <a href="#section-arch" class="sidebar-link"><i class="fas fa-microchip"></i> System Architecture</a>
492
+ <a href="#section-layers" class="sidebar-link"><i class="fas fa-layer-group"></i> 7-Layer Stack</a>
493
+ <a href="#section-uose" class="sidebar-link"><i class="fas fa-atom"></i> UOSE Engine</a>
494
+ <a href="#section-nep" class="sidebar-link"><i class="fas fa-bolt"></i> NEP Dark Mode</a>
495
+ <a href="#section-neurograi" class="sidebar-link"><i class="fas fa-circle-nodes"></i> Neurograi</a>
496
+ </div>
497
+ <div class="sidebar-section">
498
+ <div class="sidebar-section-title">Regulatory & IP</div>
499
+ <a href="#section-fda" class="sidebar-link"><i class="fas fa-hospital"></i> FDA Strategy</a>
500
+ <a href="#section-patent" class="sidebar-link"><i class="fas fa-stamp"></i> Patent Claims</a>
501
+ <a href="#section-harmoni" class="sidebar-link"><i class="fas fa-wave-square"></i> HARMONI-X</a>
502
+ <a href="#section-ids" class="sidebar-link"><i class="fas fa-book-open"></i> IDS Filing</a>
503
+ <a href="#section-security" class="sidebar-link"><i class="fas fa-lock"></i> PQC Security</a>
504
+ </div>
505
+ <div class="sidebar-section">
506
+ <div class="sidebar-section-title">Appendices</div>
507
+ <a href="#section-svg" class="sidebar-link"><i class="fas fa-image"></i> System Rendering</a>
508
+ <a href="#section-mfg" class="sidebar-link"><i class="fas fa-industry"></i> Manufacturing</a>
509
+ <a href="#section-clinical" class="sidebar-link"><i class="fas fa-user-doctor"></i> Clinical Protocol</a>
510
+ </div>
511
+ </nav>
512
+
513
+ <!-- Main Content -->
514
+ <main class="main" id="main-content" role="main">
515
+
516
+ <!-- Memorandum Header -->
517
+ <div class="mem-header reveal">
518
+ <div class="mem-to">TO: <span>Candidates for Legislative Offices, Regional Representatives, and Digital Reform Advocates</span></div>
519
+ <div class="mem-to">FROM: <span>Office of Caustin Lee McLaughlin, Systems Architect & Technical Researcher</span></div>
520
+ <div class="mem-to">DATE: <span>May 27, 2026</span></div>
521
+ <h1 class="mem-subject">Policy Blueprint for Data-Driven Governance, Sovereign AI Infrastructure, and Constitutional Administrative Access</h1>
522
+ <div class="mem-meta">
523
+ <div class="mem-meta-item"><strong>CLASS:</strong> CONFIDENTIAL</div>
524
+ <div class="mem-meta-item"><strong>PROJECT:</strong> SUPERPOSITION-CINP-EXP</div>
525
+ <div class="mem-meta-item"><strong>REV:</strong> FINAL-SUBMIT</div>
526
+ </div>
527
+ <div class="mem-classification"><i class="fas fa-lock"></i> PROPRIETARY / TRADE SECRET</div>
528
+ </div>
529
+
530
+ <!-- Section: Executive Summary -->
531
+ <section id="section-exec" class="section-anchor reveal">
532
+ <h2><span class="section-num">SECTION I</span>Executive Summary</h2>
533
+ <p>Modern governance requires moving past outdated administrative methods and embracing data-driven systems, secure technical platforms, and clear constitutional boundaries. This memorandum provides an actionable, evidence-based policy framework derived directly from active federal litigation filings, empirical public health data analysis, and advanced engineering blueprints.</p>
534
+ <p>By combining cutting-edge genomics, secure software systems, localized microgrids, and quantum-resistant cryptographic security, this framework outlines how legislative reforms can protect civil liberties, eliminate administrative backlogs, and ensure equitable access to public services.</p>
535
+ <div class="stats-row">
536
+ <div class="stat-card">
537
+ <div class="stat-value teal">$243M</div>
538
+ <div class="stat-label">EMERGENCY ALLOCATION</div>
539
+ </div>
540
+ <div class="stat-card">
541
+ <div class="stat-value amber">13M+</div>
542
+ <div class="stat-label">PEAK BENEFICIARIES</div>
543
+ </div>
544
+ <div class="stat-card">
545
+ <div class="stat-value">600 MW</div>
546
+ <div class="stat-label">SOLAR TARGET</div>
547
+ </div>
548
+ <div class="stat-card">
549
+ <div class="stat-value emerald">1 GWh</div>
550
+ <div class="stat-label">BATTERY STORAGE</div>
551
+ </div>
552
+ </div>
553
+ </section>
554
+
555
+ <!-- Section: Constitutional Crisis -->
556
+ <section id="section-crisis" class="section-anchor reveal">
557
+ <h2><span class="section-num">SECTION I.1</span>The Constitutional Crisis of Administrative Exclusion & Structural Barriers</h2>
558
+ <p>Modern administrative frameworks and complex online legal procedures create a major barrier—a <strong>"Cognitive Wall"</strong>—for individuals with specific neurogenetic profiles. Navigating unaccommodated, confusing administrative processes places a significant cognitive and metabolic strain on individuals with verified neurogenetic variations.</p>
559
+ </section>
560
+
561
+ <!-- Section: Cognitive Wall -->
562
+ <section id="section-cognitive" class="section-anchor reveal">
563
+ <h3>The "Cognitive Wall" and Barriers to Equal Justice</h3>
564
+ <p>Individuals with homozygous variations like the <span class="genotype">COMT rs4680 (Val/Val)</span> genotype experience significantly accelerated dopamine clearance in the prefrontal cortex under high stress. This leads to rapid mental exhaustion and concentration fatigue within an hour of intense effort.</p>
565
+
566
+ <div class="code-block"><span class="accent">+-----------------------------------------------------------+</span>
567
+ <span class="accent">|</span> THE ADMINISTRATIVE COGNITIVE WALL <span class="accent">|</span>
568
+ <span class="accent">+-----------------------------------------------------------+</span>
569
+ |
570
+ v
571
+ <span class="accent">+-----------------------------------------------------------+</span>
572
+ <span class="accent">|</span> COMPLEX ADMINISTRATIVE ARCHITECTURE & LEGAL PROCEDURES <span class="accent">|</span>
573
+ <span class="accent">+-----------------------------------------------------------+</span>
574
+ |
575
+ +---------------------+---------------------+
576
+ | |
577
+ v v
578
+ <span class="warn">[COMT rs4680 Val/Val Locus]</span> <span class="warn">[FKBP5 rs1360780 Locus]</span>
579
+ Hyper-accelerated dopamine clearance Altered glucocorticoid sensitivity;
580
+ and rapid exhaustion under high stress. extreme physiological stress reactivity.
581
+ | |
582
+ +---------------------+---------------------+
583
+ |
584
+ v
585
+ <span class="critical">+-----------------------------------------------------------+</span>
586
+ <span class="critical">|</span> DENIAL OF SYSTEMIC DUE PROCESS AND COURT ACCESS <span class="critical">|</span>
587
+ <span class="critical">|</span> -> Requires Sovereign AI Assistive Platforms (GovLLM) <span class="critical">|</span>
588
+ <span class="critical">+-----------------------------------------------------------+</span></div>
589
+
590
+ <div class="card card-warn">
591
+ <h4><i class="fas fa-exclamation-triangle" style="color:var(--amber);margin-right:6px;"></i> The "Subscription Tax" on Justice</h4>
592
+ <p>Requiring individuals to rely on private, paywalled commercial AI models introduces an unfair financial hurdle on access to justice. When layered with other common genetic variants, such as density reductions in striatal receptors (<span class="genotype">ANKK1 rs1800497</span>) or transcription changes in receptor promoters (<span class="genotype">DRD2 rs1800955</span>), these conditions manifest as real biological constraints on working memory, sequential task management, and attention gating.</p>
593
+ </div>
594
+
595
+ <h4>Public Benefit Delays and Unlawful Collections</h4>
596
+ <div class="card card-accent">
597
+ <ul class="styled-list">
598
+ <li><strong>Peak and Decline:</strong> Program usage rose from the mid-1990s, peaked between 2015–2017 at over 13 million recipients, and has steadily declined due to shifting administrative rules and processing delays.</li>
599
+ <li><strong>Declining Approval Rates:</strong> Overall program approval rates have dropped over time, fluctuating between 46% and 78% (averaging roughly 62%).</li>
600
+ <li><strong>Unlawful Collections:</strong> Government agencies routinely bypass <code>42 U.S.C. § 404(b)</code>, which explicitly bars the recovery of alleged overpayments from individuals who are not at fault when recovery defeats the purpose of the program.</li>
601
+ </ul>
602
+ </div>
603
+ </section>
604
+
605
+ <!-- Section: Sovereign AI -->
606
+ <section id="section-sovereign" class="section-anchor reveal">
607
+ <h2><span class="section-num">SECTION II</span>Sovereign AI as an Essential Accessibility Tool</h2>
608
+ <p>To tear down the "Cognitive Wall," legislative frameworks must mandate that local, open-source, and secure Large Language Model platforms (<strong>GovLLM / GPRS-Secure++</strong>) be recognized as standard assistive tools under Title II of the Americans with Disabilities Act (ADA) and Section 504 of the Rehabilitation Act.</p>
609
+
610
+ <div class="code-block"><span class="accent"> [SECURE GOVLLM SYSTEM ENCLAVE]</span>
611
+ |
612
+ v
613
+ <span class="accent">[HYBRID QUANTUM-RESISTANT TRANSPORT INTERFACE]</span>
614
+ (Encrypted via Kyber-1024 / Dilithium-3 Standards)
615
+ |
616
+ +---------------------+---------------------+
617
+ | |
618
+ v v
619
+ <span class="success">[STATELESS INFERENCE PIPELINE]</span> <span class="success">[ZERO-RETENTION DATA MASKING]</span>
620
+ Provides secure text simplification Guarantees that user queries are
621
+ and document structure translation. never retained for external training.</div>
622
+
623
+ <div class="card card-accent">
624
+ <h4>GovLLM Secure Transaction Protocol</h4>
625
+ <ul class="styled-list">
626
+ <li><strong>Sovereign Client Interface:</strong> Provides integrated text simplification, clarity enhancements, and structured memory support directly within public domains.</li>
627
+ <li><strong>Post-Quantum Encrypted Transport Envelope:</strong> Every interaction is isolated and protected using <code>Kyber-1024</code> Key Encapsulation Mechanisms in transit and at rest.</li>
628
+ <li><strong>Air-Gapped Inference Enclaves:</strong> The system operates within zero-telemetry, stateless environments validated by <code>Dilithium-3</code> cryptographic signatures.</li>
629
+ </ul>
630
+ </div>
631
+ </section>
632
+
633
+ <!-- Section: OSI-P -->
634
+ <section id="section-osip" class="section-anchor reveal">
635
+ <h2><span class="section-num">SECTION III</span>The OpenSSA Integrity Pipeline (OSI-P) and Clinical Validation</h2>
636
+ <p>To eliminate long processing lines and make public assistance decisions more objective, agencies must adopt the <strong>OpenSSA Integrity Pipeline (OSI-P)</strong>. This computer-implemented method automates the collection and review of medical and scientific information, building an un-alterable, verifiable record of eligibility.</p>
637
+
638
+ <div class="code-block"><span class="accent">+-----------------------------------------------------------+</span>
639
+ <span class="accent">|</span> OPENSSA INTEGRITY PIPELINE (OSI-P) CORE <span class="accent">|</span>
640
+ <span class="accent">+-----------------------------------------------------------+</span>
641
+ |
642
+ v
643
+ <span class="accent">+-----------------------------------------------------------+</span>
644
+ <span class="accent">|</span> RECEIVE SOURCE DOCUMENT -> CALCULATE DETERMINISTIC HASH <span class="accent">|</span>
645
+ <span class="accent">+-----------------------------------------------------------+</span>
646
+ |
647
+ v
648
+ <span class="accent">+-----------------------------------------------------------+</span>
649
+ <span class="accent">|</span> EXTRACT SEPARATE VECTOR EMBEDDINGS (TEXT CHUNKS & IMAGES) <span class="accent">|</span>
650
+ <span class="accent">+-----------------------------------------------------------+</span>
651
+ |
652
+ v
653
+ <span class="accent">+-----------------------------------------------------------+</span>
654
+ <span class="accent">|</span> GENERATE RETRIEVAL TRACE LINKING RETRIEVED TEXT TO HASH <span class="accent">|</span>
655
+ <span class="accent">+-----------------------------------------------------------+</span>
656
+ |
657
+ v
658
+ <span class="accent">+-----------------------------------------------------------+</span>
659
+ <span class="accent">|</span> RUN CROSS-MODAL VALIDATION OF DRAFT SCHEME AGAINST IMAGES <span class="accent">|</span>
660
+ <span class="accent">+-----------------------------------------------------------+</span>
661
+ |
662
+ v
663
+ <span class="accent">+-----------------------------------------------------------+</span>
664
+ <span class="accent">|</span> OUTPUT AUDIT BUNDLE WITH NINE AUTOMATED DETAILED REPORTS <span class="accent">|</span>
665
+ <span class="accent">+-----------------------------------------------------------+</span></div>
666
+
667
+ <div class="card">
668
+ <h4>OSI-P Pipeline Stages</h4>
669
+ <ol class="styled-list">
670
+ <li><strong>Deterministic Ingestion:</strong> Calculates an immutable cryptographic hash of the source document.</li>
671
+ <li><strong>Cross-Modal Embedding Generation:</strong> Creates vector embeddings from text segments and separate embeddings from image files.</li>
672
+ <li><strong>Verifiable Retrieval Trace:</strong> Connects every piece of extracted text directly back to the original cryptographic hash.</li>
673
+ <li><strong>Cross-Modal Consistency Verification:</strong> Uses an advanced language model to run cross-modal checks validating the drafted summary against visual data.</li>
674
+ <li><strong>Nine-Report Audit Package:</strong> Automatically generates nine distinct, verifiable reports ensuring absolute clarity and transparency.</li>
675
+ <li><strong>Edge Execution Efficiency:</strong> Deploys on low-power, CPU-centric local computing using optimized quantized models.</li>
676
+ </ol>
677
+ </div>
678
+ </section>
679
+
680
+ <!-- Section: BSBS -->
681
+ <section id="section-bsbs" class="section-anchor reveal">
682
+ <h2><span class="section-num">SECTION IV</span>The Baltimore Solar & Battery Service (BSBS) Utility Model</h2>
683
+ <p>True data-driven leadership must apply innovative technology to resolve immediate physical infrastructure and environmental challenges. The <strong>BSBS</strong> provides an immediately implementable, self-funding model designed to establish energy independence across historic urban neighborhoods.</p>
684
+
685
+ <div class="stats-row">
686
+ <div class="stat-card">
687
+ <div class="stat-value teal">30-40%</div>
688
+ <div class="stat-label">COST REDUCTION</div>
689
+ </div>
690
+ <div class="stat-card">
691
+ <div class="stat-value">600 MW</div>
692
+ <div class="stat-label">SOLAR GENERATION</div>
693
+ </div>
694
+ <div class="stat-card">
695
+ <div class="stat-value emerald">1 GWh</div>
696
+ <div class="stat-label">BATTERY STORAGE</div>
697
+ </div>
698
+ <div class="stat-card">
699
+ <div class="stat-value amber">$0</div>
700
+ <div class="stat-label">DOWN PAYMENT</div>
701
+ </div>
702
+ </div>
703
+
704
+ <div class="card card-accent">
705
+ <h4><i class="fas fa-home" style="color:var(--teal);margin-right:6px;"></i> The Rowhouse Advantage</h4>
706
+ <p>By capitalizing on the shared roof lines and uniform architecture of urban rowhomes, the BSBS model creates an interconnected, decentralized microgrid network. This shared setup lowers installation, wiring, and structural engineering overhead by <strong>30% to 40%</strong> compared to isolated residential solar projects.</p>
707
+ <p>The program uses a publicly structured utility design that requires <strong>no upfront costs</strong> from residents. The system funds its own expansion through long-term energy savings and virtual power plant grid coordination, ensuring equitable access to clean energy across lower-income areas.</p>
708
+ </div>
709
+ </section>
710
+
711
+ <!-- Section: Budget -->
712
+ <section id="section-budget" class="section-anchor reveal">
713
+ <h2><span class="section-num">SECTION V</span>Emergency Modernization & Program Budget Blueprint</h2>
714
+ <p>To fully implement these secure upgrades, remove digital bottlenecks, and ensure reliable access to public services, we propose a targeted <strong>$243,000,000 Emergency Program Allocation</strong>.</p>
715
+
716
+ <div id="budget-chart" class="card" style="padding:28px;">
717
+ <h4 style="margin-bottom:20px;">Emergency Program Capital Allocation ($243,000,000)</h4>
718
+ <div class="budget-item">
719
+ <div class="budget-label">[1.0] Cryptographic Overhaul (PQC Architecture)</div>
720
+ <div class="budget-amount">$48.5M</div>
721
+ <div class="budget-bar-wrap"><div class="budget-bar" data-width="79.5" style="background:linear-gradient(90deg,#0891b2,#22d3ee);"></div></div>
722
+ </div>
723
+ <div class="budget-item">
724
+ <div class="budget-label">[2.0] Automated Genomic Ingestion Core</div>
725
+ <div class="budget-amount">$62.0M</div>
726
+ <div class="budget-bar-wrap"><div class="budget-bar" data-width="100" style="background:linear-gradient(90deg,#1a2a4a,#4a90e2);"></div></div>
727
+ </div>
728
+ <div class="budget-item">
729
+ <div class="budget-label">[3.0] Processing Hardware Infrastructure</div>
730
+ <div class="budget-amount">$44.0M</div>
731
+ <div class="budget-bar-wrap"><div class="budget-bar" data-width="71" style="background:linear-gradient(90deg,#059669,#34d399);"></div></div>
732
+ </div>
733
+ <div class="budget-item">
734
+ <div class="budget-label">[4.0] Front-End Accessibility Portals</div>
735
+ <div class="budget-amount">$31.5M</div>
736
+ <div class="budget-bar-wrap"><div class="budget-bar" data-width="50.8" style="background:linear-gradient(90deg,#8b5cf6,#a78bfa);"></div></div>
737
+ </div>
738
+ <div class="budget-item">
739
+ <div class="budget-label">[5.0] Privacy Act Compliance & Auditing</div>
740
+ <div class="budget-amount">$39.5M</div>
741
+ <div class="budget-bar-wrap"><div class="budget-bar" data-width="63.7" style="background:linear-gradient(90deg,#d97706,#fbbf24);"></div></div>
742
+ </div>
743
+ <div class="budget-item">
744
+ <div class="budget-label">[6.0] Technical Operations Contingency</div>
745
+ <div class="budget-amount">$