@iowarp/clio-coder 0.3.0

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 (226) hide show
  1. package/CHANGELOG.md +407 -0
  2. package/CODE_OF_CONDUCT.md +21 -0
  3. package/CONTRIBUTING.md +224 -0
  4. package/LICENSE +202 -0
  5. package/NOTICE +9 -0
  6. package/README.md +798 -0
  7. package/SECURITY.md +72 -0
  8. package/assets/clio-coder-logo-128.webp +0 -0
  9. package/damage-control-rules.yaml +419 -0
  10. package/dist/acp-UMLFVA3F.js +92 -0
  11. package/dist/agents-Q4MYPMUW.js +91 -0
  12. package/dist/auth-O6HYIJ6J.js +521 -0
  13. package/dist/chunk-262G75JS.js +35 -0
  14. package/dist/chunk-26BZQOAD.js +1281 -0
  15. package/dist/chunk-2J63S4SF.js +508 -0
  16. package/dist/chunk-3DANZDGR.js +717 -0
  17. package/dist/chunk-4UQA7NCT.js +29 -0
  18. package/dist/chunk-527KG6XR.js +497 -0
  19. package/dist/chunk-5LDRNKX2.js +1063 -0
  20. package/dist/chunk-5N2FG33Q.js +25 -0
  21. package/dist/chunk-67MTHP2E.js +135 -0
  22. package/dist/chunk-6CWDTGUC.js +20 -0
  23. package/dist/chunk-7BHLZB3A.js +2115 -0
  24. package/dist/chunk-7RBKDI66.js +348 -0
  25. package/dist/chunk-AMFR5YA3.js +541 -0
  26. package/dist/chunk-BBUH4VAA.js +1224 -0
  27. package/dist/chunk-BYEU76JP.js +899 -0
  28. package/dist/chunk-CLJ5HLUD.js +458 -0
  29. package/dist/chunk-D5YD55AR.js +116 -0
  30. package/dist/chunk-DXQNI4PC.js +61 -0
  31. package/dist/chunk-E3NYWENM.js +1004 -0
  32. package/dist/chunk-GNGDQYDU.js +34688 -0
  33. package/dist/chunk-GOTUR54M.js +9 -0
  34. package/dist/chunk-HBU5MTAM.js +41 -0
  35. package/dist/chunk-HMYNFFY4.js +28 -0
  36. package/dist/chunk-JPOWPFCU.js +1010 -0
  37. package/dist/chunk-JWHCJDCI.js +1215 -0
  38. package/dist/chunk-KBR4MZZR.js +41 -0
  39. package/dist/chunk-KKKPTZLM.js +93 -0
  40. package/dist/chunk-ME6DNWIU.js +66 -0
  41. package/dist/chunk-NI4DEJMC.js +88 -0
  42. package/dist/chunk-O4EJEDHO.js +659 -0
  43. package/dist/chunk-PIDUD6M2.js +31 -0
  44. package/dist/chunk-PS4PFJQP.js +29459 -0
  45. package/dist/chunk-QV47YRF4.js +48 -0
  46. package/dist/chunk-RQDWMVRB.js +279 -0
  47. package/dist/chunk-TFSSEXL6.js +136 -0
  48. package/dist/chunk-TKHQ4DGZ.js +8290 -0
  49. package/dist/chunk-TPOCL34A.js +2876 -0
  50. package/dist/chunk-UGYAX5YI.js +565 -0
  51. package/dist/chunk-UHTSULZS.js +461 -0
  52. package/dist/chunk-UU3R62TT.js +128 -0
  53. package/dist/chunk-UWIJNAOB.js +3906 -0
  54. package/dist/chunk-VOO7NYPP.js +914 -0
  55. package/dist/chunk-VPAWTYLY.js +117 -0
  56. package/dist/chunk-WD6AJM35.js +1216 -0
  57. package/dist/chunk-X3BR7HWV.js +115 -0
  58. package/dist/chunk-X3NE4WVW.js +120 -0
  59. package/dist/chunk-XNISANGE.js +1395 -0
  60. package/dist/chunk-XV4ZJ6ZM.js +3177 -0
  61. package/dist/cli/index.js +236 -0
  62. package/dist/clio-KIQ5SNDS.js +53 -0
  63. package/dist/components-JVHMUBEB.js +653 -0
  64. package/dist/config-ZFCDBMDC.js +372 -0
  65. package/dist/configure-G4E3A2PG.js +27 -0
  66. package/dist/context-CDXTP2MP.js +293 -0
  67. package/dist/context-E3KIFVXI.js +185 -0
  68. package/dist/context-clear-3F4PLXOS.js +102 -0
  69. package/dist/context-index-Q7YSYTR3.js +106 -0
  70. package/dist/docs-YIETIWZI.js +280 -0
  71. package/dist/doctor-M5HJJZOL.js +61 -0
  72. package/dist/domains/agents/builtins/architect.md +33 -0
  73. package/dist/domains/agents/builtins/coder.md +31 -0
  74. package/dist/domains/agents/builtins/context-bootstrap.md +38 -0
  75. package/dist/domains/agents/builtins/debugger.md +30 -0
  76. package/dist/domains/agents/builtins/documenter.md +31 -0
  77. package/dist/domains/agents/builtins/git-master.md +30 -0
  78. package/dist/domains/agents/builtins/provenance.md +30 -0
  79. package/dist/domains/agents/builtins/researcher.md +71 -0
  80. package/dist/domains/agents/builtins/scout.md +42 -0
  81. package/dist/domains/agents/builtins/tester.md +31 -0
  82. package/dist/domains/agents/builtins/verifier.md +30 -0
  83. package/dist/domains/agents/builtins/wiki-writer.md +41 -0
  84. package/dist/eval-B3KZZESM.js +2674 -0
  85. package/dist/evidence-V67CHM35.js +233 -0
  86. package/dist/evolve-YDZSUQYA.js +518 -0
  87. package/dist/extensions-SRG7XCAH.js +207 -0
  88. package/dist/fleet-CA2CRTVG.js +760 -0
  89. package/dist/fleet-preflight-CLIAX7YR.js +21 -0
  90. package/dist/init-2OZDJE2D.js +227 -0
  91. package/dist/memory-3PIQQAKX.js +207 -0
  92. package/dist/models-DY35XI7Y.js +237 -0
  93. package/dist/paths-5OMXW7Z4.js +57 -0
  94. package/dist/preload-KZVHET2B.js +11 -0
  95. package/dist/reset-PIFYNOS3.js +216 -0
  96. package/dist/run-3VSPP24F.js +735 -0
  97. package/dist/share-D36RQCXM.js +241 -0
  98. package/dist/skills-F2MRLELY.js +445 -0
  99. package/dist/skills-eval-E2ZTW4PL.js +932 -0
  100. package/dist/targets-DZMEZAH4.js +977 -0
  101. package/dist/trace-7NYCUI2J.js +250 -0
  102. package/dist/uninstall-AD3JWHBB.js +322 -0
  103. package/dist/upgrade-WYYBKGDY.js +301 -0
  104. package/dist/usage-ULIDAGFF.js +755 -0
  105. package/dist/version-ROZ6CZKH.js +16 -0
  106. package/dist/wiki-generate-PKFIX6OB.js +377 -0
  107. package/dist/worker/entry.js +1739 -0
  108. package/docs/README.md +93 -0
  109. package/docs/acp.md +120 -0
  110. package/docs/alcf-provider.md +72 -0
  111. package/docs/architecture.md +172 -0
  112. package/docs/artifact-versions.md +54 -0
  113. package/docs/built-in-agents.md +265 -0
  114. package/docs/capacity-and-scheduling.md +97 -0
  115. package/docs/commands-and-modes.md +554 -0
  116. package/docs/config-knobs-audit.md +115 -0
  117. package/docs/configuration-and-targets.md +812 -0
  118. package/docs/context-engine.md +236 -0
  119. package/docs/dispatch-architecture-rationale.md +126 -0
  120. package/docs/documentation-coverage.md +46 -0
  121. package/docs/documentation-guide.md +166 -0
  122. package/docs/environment-variables.md +105 -0
  123. package/docs/eval-runner.md +205 -0
  124. package/docs/evals-internal.md +298 -0
  125. package/docs/evidence-and-memory.md +243 -0
  126. package/docs/evolution.md +143 -0
  127. package/docs/exit-codes-and-output.md +74 -0
  128. package/docs/extensions-and-sharing.md +306 -0
  129. package/docs/fleet-demo-runbook.md +179 -0
  130. package/docs/fleet-dispatch.md +591 -0
  131. package/docs/glossary.md +75 -0
  132. package/docs/html/agents_blueprint.html +936 -0
  133. package/docs/html/alcf_blueprint.html +324 -0
  134. package/docs/html/architecture_blueprint.html +850 -0
  135. package/docs/html/commands_blueprint.html +794 -0
  136. package/docs/html/config_knobs_audit_blueprint.html +178 -0
  137. package/docs/html/configuration_blueprint.html +1080 -0
  138. package/docs/html/context_blueprint.html +603 -0
  139. package/docs/html/documentation_blueprint.html +832 -0
  140. package/docs/html/environment_blueprint.html +404 -0
  141. package/docs/html/eval_blueprint.html +743 -0
  142. package/docs/html/evals_internal_blueprint.html +190 -0
  143. package/docs/html/evolution_blueprint.html +674 -0
  144. package/docs/html/extensions_blueprint.html +2065 -0
  145. package/docs/html/fleet_dispatch_blueprint.html +286 -0
  146. package/docs/html/index.html +919 -0
  147. package/docs/html/lifecycle_blueprint.html +723 -0
  148. package/docs/html/memory_blueprint.html +699 -0
  149. package/docs/html/middleware_blueprint.html +664 -0
  150. package/docs/html/models_blueprint.html +2366 -0
  151. package/docs/html/observability_blueprint.html +683 -0
  152. package/docs/html/provider_adapter_blueprint.html +245 -0
  153. package/docs/html/safety_blueprint.html +1386 -0
  154. package/docs/html/shared.css +571 -0
  155. package/docs/html/shared.js +143 -0
  156. package/docs/html/skills_blueprint.html +671 -0
  157. package/docs/html/soak_blueprint.html +182 -0
  158. package/docs/html/tool_usage_blueprint.html +350 -0
  159. package/docs/html/tools_blueprint.html +2249 -0
  160. package/docs/html/trace_blueprint.html +235 -0
  161. package/docs/html/tui_design_blueprint.html +314 -0
  162. package/docs/html/validation_blueprint.html +961 -0
  163. package/docs/html/worker_dispatch_blueprint.html +231 -0
  164. package/docs/installation-and-lifecycle.md +308 -0
  165. package/docs/middleware-and-components.md +148 -0
  166. package/docs/model-catalog.md +189 -0
  167. package/docs/observability.md +233 -0
  168. package/docs/proactive-memory.md +452 -0
  169. package/docs/prompt-envelope-and-tools.md +142 -0
  170. package/docs/provider-adapter-cookbook.md +148 -0
  171. package/docs/release-cut-checklist.md +138 -0
  172. package/docs/safety-model.md +357 -0
  173. package/docs/scientific-validation.md +105 -0
  174. package/docs/session-lifecycle.md +156 -0
  175. package/docs/skills-marketplace.md +46 -0
  176. package/docs/tool-usage.md +527 -0
  177. package/docs/trace-store.md +132 -0
  178. package/docs/troubleshooting.md +33 -0
  179. package/docs/tui-design.md +239 -0
  180. package/docs/worker-dispatch-mechanics.md +242 -0
  181. package/package.json +132 -0
  182. package/skills/README.md +408 -0
  183. package/skills/git/commit-crafting/SKILL.md +79 -0
  184. package/skills/git/commit-crafting/evals.md +92 -0
  185. package/skills/git/create-pr/SKILL.md +116 -0
  186. package/skills/git/create-pr/evals.md +114 -0
  187. package/skills/git/investigate-issue/SKILL.md +139 -0
  188. package/skills/git/investigate-issue/evals.md +94 -0
  189. package/skills/git/resolve-merge-conflicts/SKILL.md +96 -0
  190. package/skills/git/resolve-merge-conflicts/evals.md +58 -0
  191. package/skills/git/review-changes/SKILL.md +103 -0
  192. package/skills/git/review-changes/evals.md +85 -0
  193. package/skills/git/worktree-create/SKILL.md +92 -0
  194. package/skills/git/worktree-create/evals.md +97 -0
  195. package/skills/git/worktree-create/references/worktree-setup.md +66 -0
  196. package/skills/git/worktree-merge/SKILL.md +95 -0
  197. package/skills/git/worktree-merge/evals.md +114 -0
  198. package/skills/skill-marketplace.json +261 -0
  199. package/skills/workflow/cut-it/SKILL.md +86 -0
  200. package/skills/workflow/cut-it/evals.md +42 -0
  201. package/src/domains/agents/builtins/architect.md +33 -0
  202. package/src/domains/agents/builtins/coder.md +31 -0
  203. package/src/domains/agents/builtins/context-bootstrap.md +38 -0
  204. package/src/domains/agents/builtins/debugger.md +30 -0
  205. package/src/domains/agents/builtins/documenter.md +31 -0
  206. package/src/domains/agents/builtins/git-master.md +30 -0
  207. package/src/domains/agents/builtins/provenance.md +30 -0
  208. package/src/domains/agents/builtins/researcher.md +71 -0
  209. package/src/domains/agents/builtins/scout.md +42 -0
  210. package/src/domains/agents/builtins/tester.md +31 -0
  211. package/src/domains/agents/builtins/verifier.md +30 -0
  212. package/src/domains/agents/builtins/wiki-writer.md +41 -0
  213. package/src/domains/agents/fleets/build-review.md +34 -0
  214. package/src/domains/agents/fleets/build-test.md +35 -0
  215. package/src/domains/agents/fleets/sdlc.md +86 -0
  216. package/src/domains/prompts/fragments/identity/clio-worker.md +11 -0
  217. package/src/domains/prompts/fragments/identity/clio.md +26 -0
  218. package/src/domains/prompts/fragments/operating/contract.md +64 -0
  219. package/src/domains/prompts/fragments/safety/auto-edit.md +14 -0
  220. package/src/domains/prompts/fragments/safety/full-auto.md +14 -0
  221. package/src/domains/prompts/fragments/safety/read-only.md +13 -0
  222. package/src/domains/prompts/fragments/safety/suggest.md +13 -0
  223. package/src/domains/prompts/fragments/wiki/page.md +75 -0
  224. package/src/domains/prompts/fragments/wiki/plan.md +48 -0
  225. package/src/domains/providers/models/cloud-models/alcf.yaml +40 -0
  226. package/src/domains/providers/models/local-models/clio-local-coding-targets.yaml +993 -0
package/docs/html/validation_blueprint.html ADDED
@@ -0,0 +1,961 @@
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>Clio Coder Scientific Validation Blueprint</title>
7
+
8
+ <style>
9
+ :root {
10
+ --bg-dark: #090d16;
11
+ --bg-card: rgba(17, 24, 39, 0.7);
12
+ --border-card: rgba(255, 255, 255, 0.08);
13
+ --text-main: #f3f4f6;
14
+ --text-muted: #9ca3af;
15
+ --text-dark: #6b7280;
16
+
17
+ --color-cyan: #00f0ff;
18
+ --color-cyan-rgb: 0, 240, 255;
19
+ --color-purple: #bd00ff;
20
+ --color-purple-rgb: 189, 0, 255;
21
+ --color-emerald: #10b981;
22
+ --color-emerald-rgb: 16, 185, 129;
23
+ --color-amber: #f59e0b;
24
+ --color-amber-rgb: 245, 158, 11;
25
+ --color-rose: #ef4444;
26
+ --color-rose-rgb: 239, 68, 68;
27
+
28
+ --gradient-main: linear-gradient(135deg, var(--color-cyan), var(--color-purple));
29
+ --shadow-glow: 0 0 20px rgba(var(--color-cyan-rgb), 0.15);
30
+ --font-sans: "Segoe UI", -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", Arial, sans-serif;
31
+ --font-mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
32
+ }
33
+
34
+ * {
35
+ box-sizing: border-box;
36
+ margin: 0;
37
+ padding: 0;
38
+ }
39
+
40
+ body {
41
+ background-color: var(--bg-dark);
42
+ background-image:
43
+ radial-gradient(circle at 10% 20%, rgba(var(--color-cyan-rgb), 0.05) 0%, transparent 40%),
44
+ radial-gradient(circle at 90% 80%, rgba(var(--color-purple-rgb), 0.05) 0%, transparent 40%),
45
+ radial-gradient(circle at 50% 50%, #0d1527 0%, var(--bg-dark) 100%);
46
+ color: var(--text-main);
47
+ font-family: var(--font-sans);
48
+ min-height: 100vh;
49
+ line-height: 1.6;
50
+ overflow-x: hidden;
51
+ }
52
+
53
+ ::-webkit-scrollbar {
54
+ width: 8px;
55
+ height: 8px;
56
+ }
57
+ ::-webkit-scrollbar-track {
58
+ background: rgba(255, 255, 255, 0.02);
59
+ }
60
+ ::-webkit-scrollbar-thumb {
61
+ background: rgba(255, 255, 255, 0.1);
62
+ border-radius: 4px;
63
+ }
64
+ ::-webkit-scrollbar-thumb:hover {
65
+ background: rgba(var(--color-cyan-rgb), 0.3);
66
+ }
67
+
68
+ .container {
69
+ max-width: 1400px;
70
+ margin: 0 auto;
71
+ padding: 2rem;
72
+ }
73
+
74
+ header {
75
+ text-align: center;
76
+ margin-bottom: 2.5rem;
77
+ position: relative;
78
+ }
79
+
80
+ .header-logo {
81
+ display: inline-flex;
82
+ align-items: center;
83
+ justify-content: center;
84
+ width: 72px;
85
+ height: 72px;
86
+ background: rgba(255, 255, 255, 0.03);
87
+ border: 1px solid var(--border-card);
88
+ border-radius: 18px;
89
+ margin-bottom: 1rem;
90
+ box-shadow: var(--shadow-glow);
91
+ position: relative;
92
+ }
93
+
94
+ .header-logo::after {
95
+ content: '';
96
+ position: absolute;
97
+ inset: -2px;
98
+ border-radius: 20px;
99
+ background: var(--gradient-main);
100
+ z-index: -1;
101
+ opacity: 0.3;
102
+ filter: blur(4px);
103
+ }
104
+
105
+ .header-logo img {
106
+ width: 78%;
107
+ height: 78%;
108
+ object-fit: contain;
109
+ filter: drop-shadow(0 0 8px rgba(0, 240, 255, 0.35));
110
+ }
111
+
112
+ h1 {
113
+ font-size: 2.5rem;
114
+ font-weight: 800;
115
+ letter-spacing: -0.05em;
116
+ margin-bottom: 0.5rem;
117
+ background: linear-gradient(to right, #ffffff, #c7d2fe, var(--color-cyan));
118
+ -webkit-background-clip: text;
119
+ -webkit-text-fill-color: transparent;
120
+ }
121
+
122
+ .subtitle {
123
+ font-size: 1.1rem;
124
+ color: var(--text-muted);
125
+ max-width: 600px;
126
+ margin: 0 auto 1.5rem auto;
127
+ font-weight: 400;
128
+ }
129
+
130
+ .meta-grid {
131
+ display: flex;
132
+ justify-content: center;
133
+ gap: 1rem;
134
+ margin-bottom: 2rem;
135
+ flex-wrap: wrap;
136
+ }
137
+
138
+ .meta-badge {
139
+ background: rgba(255, 255, 255, 0.04);
140
+ border: 1px solid var(--border-card);
141
+ padding: 0.5rem 1rem;
142
+ border-radius: 8px;
143
+ font-size: 0.85rem;
144
+ display: flex;
145
+ align-items: center;
146
+ gap: 0.5rem;
147
+ }
148
+
149
+ .meta-badge .label {
150
+ color: var(--text-muted);
151
+ }
152
+
153
+ .meta-badge .value {
154
+ font-family: var(--font-mono);
155
+ font-weight: 600;
156
+ color: var(--color-cyan);
157
+ }
158
+
159
+ .tabs-nav {
160
+ display: flex;
161
+ justify-content: center;
162
+ gap: 0.75rem;
163
+ margin-bottom: 2rem;
164
+ flex-wrap: wrap;
165
+ }
166
+
167
+ .tab-btn {
168
+ background: rgba(255, 255, 255, 0.03);
169
+ border: 1px solid var(--border-card);
170
+ color: var(--text-muted);
171
+ padding: 0.75rem 1.5rem;
172
+ border-radius: 9999px;
173
+ font-weight: 600;
174
+ cursor: pointer;
175
+ display: flex;
176
+ align-items: center;
177
+ gap: 0.5rem;
178
+ transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
179
+ }
180
+
181
+ .tab-btn:hover {
182
+ background: rgba(255, 255, 255, 0.08);
183
+ color: var(--text-main);
184
+ border-color: rgba(var(--color-cyan-rgb), 0.3);
185
+ }
186
+
187
+ .tab-btn.active {
188
+ background: var(--gradient-main);
189
+ color: #090d16;
190
+ font-weight: 700;
191
+ border-color: transparent;
192
+ box-shadow: 0 4px 15px rgba(var(--color-cyan-rgb), 0.3);
193
+ }
194
+
195
+ .tab-btn svg {
196
+ width: 18px;
197
+ height: 18px;
198
+ fill: none;
199
+ stroke: currentColor;
200
+ stroke-width: 2;
201
+ }
202
+
203
+ .tab-pane {
204
+ display: none;
205
+ animation: fadeIn 0.4s ease-out forwards;
206
+ }
207
+
208
+ .tab-pane.active {
209
+ display: block;
210
+ }
211
+
212
+ @keyframes fadeIn {
213
+ from {
214
+ opacity: 0;
215
+ transform: translateY(10px);
216
+ }
217
+ to {
218
+ opacity: 1;
219
+ transform: translateY(0);
220
+ }
221
+ }
222
+
223
+ .glass-card {
224
+ background: var(--bg-card);
225
+ border: 1px solid var(--border-card);
226
+ backdrop-filter: blur(16px);
227
+ -webkit-backdrop-filter: blur(16px);
228
+ border-radius: 16px;
229
+ padding: 2rem;
230
+ box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
231
+ margin-bottom: 2rem;
232
+ }
233
+
234
+ .card-title {
235
+ font-size: 1.3rem;
236
+ font-weight: 700;
237
+ margin-bottom: 1.25rem;
238
+ color: #ffffff;
239
+ display: flex;
240
+ align-items: center;
241
+ gap: 0.75rem;
242
+ border-bottom: 1px solid rgba(255, 255, 255, 0.05);
243
+ padding-bottom: 0.75rem;
244
+ }
245
+
246
+ .card-title svg {
247
+ width: 20px;
248
+ height: 20px;
249
+ stroke: var(--color-cyan);
250
+ stroke-width: 2;
251
+ fill: none;
252
+ }
253
+
254
+ .grid-2 {
255
+ display: grid;
256
+ grid-template-columns: 1fr 1fr;
257
+ gap: 1.5rem;
258
+ }
259
+
260
+ @media (max-width: 900px) {
261
+ .grid-2 {
262
+ grid-template-columns: 1fr;
263
+ }
264
+ }
265
+
266
+ .form-group {
267
+ margin-bottom: 1.25rem;
268
+ }
269
+
270
+ label {
271
+ display: block;
272
+ font-size: 0.85rem;
273
+ color: var(--text-muted);
274
+ margin-bottom: 0.5rem;
275
+ font-weight: 500;
276
+ text-transform: uppercase;
277
+ letter-spacing: 0.05em;
278
+ }
279
+
280
+ input[type="text"], input[type="number"], select, textarea {
281
+ width: 100%;
282
+ background: rgba(255, 255, 255, 0.03);
283
+ border: 1px solid var(--border-card);
284
+ border-radius: 8px;
285
+ padding: 0.75rem 1rem;
286
+ color: var(--text-main);
287
+ font-family: var(--font-sans);
288
+ font-size: 0.95rem;
289
+ transition: all 0.2s ease;
290
+ }
291
+
292
+ input:focus, select:focus, textarea:focus {
293
+ outline: none;
294
+ border-color: var(--color-cyan);
295
+ box-shadow: 0 0 10px rgba(var(--color-cyan-rgb), 0.15);
296
+ background: rgba(255, 255, 255, 0.06);
297
+ }
298
+
299
+ textarea.code-area {
300
+ font-family: var(--font-mono);
301
+ font-size: 0.85rem;
302
+ background: #05080e;
303
+ resize: vertical;
304
+ min-height: 250px;
305
+ line-height: 1.5;
306
+ }
307
+
308
+ .btn {
309
+ background: rgba(255, 255, 255, 0.05);
310
+ border: 1px solid var(--border-card);
311
+ color: var(--text-main);
312
+ padding: 0.75rem 1.5rem;
313
+ border-radius: 8px;
314
+ font-weight: 600;
315
+ cursor: pointer;
316
+ display: inline-flex;
317
+ align-items: center;
318
+ gap: 0.5rem;
319
+ transition: all 0.2s ease;
320
+ }
321
+
322
+ .btn:hover {
323
+ background: rgba(255, 255, 255, 0.1);
324
+ border-color: rgba(var(--color-cyan-rgb), 0.3);
325
+ }
326
+
327
+ .btn-primary {
328
+ background: var(--gradient-main);
329
+ color: #090d16;
330
+ border-color: transparent;
331
+ font-weight: 700;
332
+ }
333
+
334
+ .btn-primary:hover {
335
+ background: linear-gradient(135deg, #2bf1ff, #d64eff);
336
+ box-shadow: 0 0 15px rgba(var(--color-cyan-rgb), 0.3);
337
+ }
338
+
339
+ .status-panel {
340
+ padding: 1rem;
341
+ border-radius: 8px;
342
+ margin-top: 1rem;
343
+ font-size: 0.9rem;
344
+ display: flex;
345
+ align-items: flex-start;
346
+ gap: 0.75rem;
347
+ }
348
+
349
+ .status-panel.success {
350
+ background: rgba(16, 185, 129, 0.1);
351
+ border: 1px solid rgba(16, 185, 129, 0.2);
352
+ color: #34d399;
353
+ }
354
+
355
+ .status-panel.error {
356
+ background: rgba(239, 68, 68, 0.1);
357
+ border: 1px solid rgba(239, 68, 68, 0.2);
358
+ color: #fca5a5;
359
+ }
360
+
361
+ .status-panel.warning {
362
+ background: rgba(245, 158, 11, 0.1);
363
+ border: 1px solid rgba(245, 158, 11, 0.2);
364
+ color: #fcd34d;
365
+ }
366
+
367
+ .flowchart-container {
368
+ background: #05080e;
369
+ border: 1px solid var(--border-card);
370
+ border-radius: 12px;
371
+ padding: 1.5rem;
372
+ overflow: auto;
373
+ display: center;
374
+ justify-content: center;
375
+ }
376
+
377
+ .console-box {
378
+ background: #020408;
379
+ border: 1px solid var(--border-card);
380
+ border-radius: 8px;
381
+ padding: 1rem;
382
+ font-family: var(--font-mono);
383
+ font-size: 0.85rem;
384
+ color: #a7f3d0;
385
+ white-space: pre-wrap;
386
+ max-height: 300px;
387
+ overflow-y: auto;
388
+ }
389
+
390
+ .formula-badge {
391
+ background: rgba(255,255,255,0.02);
392
+ border: 1px solid var(--border-card);
393
+ border-radius: 8px;
394
+ padding: 1rem;
395
+ font-size: 1.1rem;
396
+ font-family: var(--font-mono);
397
+ text-align: center;
398
+ color: var(--color-cyan);
399
+ margin: 1rem 0;
400
+ }
401
+ </style>
402
+ </head>
403
+ <body>
404
+ <div class="container">
405
+ <header>
406
+ <div class="header-left">
407
+ <div class="header-logo">
408
+ <svg viewBox="0 0 64 64" width="48" height="48" role="img" aria-label="Clio Coder logo"><title>Clio Coder logo</title><rect x="8" y="8" width="48" height="48" rx="12" fill="rgba(0,240,255,0.12)" stroke="rgba(0,240,255,0.65)"/><path d="M32 14 16 23l16 9 16-9-16-9Z" fill="none" stroke="#00f0ff" stroke-width="3" stroke-linejoin="round"/><path d="M16 32l16 9 16-9M16 41l16 9 16-9" fill="none" stroke="#bd00ff" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/></svg>
409
+ </div>
410
+ <div class="header-title-wrapper">
411
+ <h1>Scientific Validation Contracts</h1>
412
+ <p>Interactive Visual Specification for Numeric Tolerances & HPC Artifact Verifications</p>
413
+ <div class="meta-chips-row">
414
+ <span class="chip">Source: docs/scientific-validation.md</span>
415
+ <span class="chip chip-orange">clio-coder docs validation</span>
416
+ </div>
417
+ </div>
418
+ </div>
419
+ <div class="header-right">
420
+ <span class="version-badge">Clio Coder v0.3.0</span>
421
+ <a href="index.html" class="back-btn">
422
+ <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><title>Icon</title><line x1="19" y1="12" x2="5" y2="12"></line><polyline points="12 19 5 12 12 5"></polyline></svg>
423
+ Dashboard Hub
424
+ </a>
425
+ </div>
426
+ </header>
427
+
428
+
429
+ <div class="tabs-nav">
430
+ <button type="button" class="tab-btn active" onclick="_switchTab('calculator')">
431
+ <svg aria-hidden="true" viewBox="0 0 24 24"><title>Icon</title><path d="M9 7h6m0 10v-3m-3-4h.01M9 17h.01M9 14h.01M12 17h.01M12 14h.01M15 11h.01M20 21H4a2 2 0 01-2-2V5a2 2 0 012-2h16a2 2 0 012 2v14a2 2 0 01-2 2z"/></svg>
432
+ Tolerance Calculator
433
+ </button>
434
+ <button type="button" class="tab-btn" onclick="_switchTab('validator')">
435
+ <svg aria-hidden="true" viewBox="0 0 24 24"><title>Icon</title><path d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"/></svg>
436
+ Contract Validator
437
+ </button>
438
+ <button type="button" class="tab-btn" onclick="_switchTab('hpc')">
439
+ <svg aria-hidden="true" viewBox="0 0 24 24"><title>Icon</title><path d="M19 11H5m14 0a2 2 0 012 2v6a2 2 0 01-2 2H5a2 2 0 01-2-2v-6a2 2 0 012-2m14 0V9a2 2 0 00-2-2M5 11V9a2 2 0 012-2m0 0V5a2 2 0 012-2h6a2 2 0 012 2v2M7 7h10"/></svg>
440
+ HPC Run Simulator
441
+ </button>
442
+ <button type="button" class="tab-btn" onclick="_switchTab('flowchart')">
443
+ <svg aria-hidden="true" viewBox="0 0 24 24"><title>Icon</title><path d="M7 21h10a2 2 0 002-2V5a2 2 0 00-2-2H7a2 2 0 00-2 2v14a2 2 0 002 2zM12 11h.01M12 7h.01M12 15h.01"/></svg>
444
+ Validation Lifecycle
445
+ </button>
446
+ </div>
447
+ </header>
448
+
449
+ <!-- Tab 1: Tolerance Calculator -->
450
+ <div id="calculator" class="tab-pane active">
451
+ <div class="grid-2">
452
+ <div class="glass-card">
453
+ <div class="card-title">
454
+ <svg aria-hidden="true" viewBox="0 0 24 24"><title>Icon</title><path d="M9 7h6m0 10v-3m-3-4h.01M9 17h.01M9 14h.01M12 17h.01M12 14h.01M15 11h.01M20 21H4a2 2 0 01-2-2V5a2 2 0 012-2h16a2 2 0 012 2v14a2 2 0 01-2 2z"/></svg>
455
+ Numerical Inputs
456
+ </div>
457
+
458
+ <div class="form-group">
459
+ <label>Reference Value (ref)</label>
460
+ <input type="text" id="tol-ref" value="0.000145" oninput="calculateTolerance()">
461
+ </div>
462
+
463
+ <div class="form-group">
464
+ <label>Candidate Value (val)</label>
465
+ <input type="text" id="tol-val" value="0.00014502" oninput="calculateTolerance()">
466
+ </div>
467
+
468
+ <div class="form-group">
469
+ <label>Tolerance Formula Type</label>
470
+ <select id="tol-type" onchange="_updateFormulaText(); calculateTolerance();">
471
+ <option value="relative">relative (Fractional scaling)</option>
472
+ <option value="absolute">absolute (Additive diff)</option>
473
+ <option value="ulp">ulp (Unit in Last Place steps)</option>
474
+ </select>
475
+ </div>
476
+
477
+ <div class="form-group">
478
+ <label>Tolerance Threshold Bound</label>
479
+ <input type="text" id="tol-threshold" value="1.5e-4" oninput="calculateTolerance()">
480
+ </div>
481
+ </div>
482
+
483
+ <div class="glass-card">
484
+ <div class="card-title">
485
+ <svg aria-hidden="true" viewBox="0 0 24 24"><title>Icon</title><path d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"/></svg>
486
+ Tolerance Check Verdict
487
+ </div>
488
+
489
+ <div id="tol-banner" class="status-panel success">
490
+ Check Passed!
491
+ </div>
492
+
493
+ <div class="formula-badge" id="formula-display">
494
+ |val - ref| / |ref| &le; threshold
495
+ </div>
496
+
497
+ <div style="margin-top:1.5rem; background:rgba(255,255,255,0.02); border:1px solid var(--border-card); padding:1rem; border-radius:8px;">
498
+ <p style="margin-bottom:0.5rem;"><strong>Computed Delta:</strong> <span id="tol-calc-delta" style="font-family:var(--font-mono); color:var(--color-cyan); font-weight:600;">-</span></p>
499
+ <p style="margin-bottom:0.5rem;"><strong>Allowed Threshold:</strong> <span id="tol-calc-thresh" style="font-family:var(--font-mono); color:var(--color-purple); font-weight:600;">-</span></p>
500
+ </div>
501
+ </div>
502
+ </div>
503
+ </div>
504
+
505
+ <!-- Tab 2: Contract Validator -->
506
+ <div id="validator" class="tab-pane">
507
+ <div class="grid-2">
508
+ <div class="glass-card">
509
+ <div class="card-title">
510
+ <svg aria-hidden="true" viewBox="0 0 24 24"><title>Icon</title><path d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"/></svg>
511
+ Scientific Contract YAML Editor
512
+ </div>
513
+ <div class="form-group">
514
+ <label>Raw validation-contract.yaml Content</label>
515
+ <textarea id="raw-yaml" class="code-area" oninput="validateYaml()"></textarea>
516
+ </div>
517
+ <div style="display: flex; gap: 0.5rem;">
518
+ <button type="button" class="btn btn-primary" onclick="loadSampleYaml('valid')">Load Valid netCDF/Slurm</button>
519
+ <button type="button" class="btn" onclick="loadSampleYaml('invalid')">Load Invalid Contract</button>
520
+ </div>
521
+ </div>
522
+
523
+ <div class="glass-card">
524
+ <div class="card-title">
525
+ <svg aria-hidden="true" viewBox="0 0 24 24"><title>Icon</title><path d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4"/></svg>
526
+ Contract Schema Audit
527
+ </div>
528
+ <div id="validator-status" class="status-panel success">
529
+ No syntax errors. Ready to audit.
530
+ </div>
531
+ <div style="margin-top: 1.5rem;">
532
+ <h4 style="margin-bottom: 0.5rem; font-size: 0.95rem; color: #ffffff;">Validation Attributes:</h4>
533
+ <div id="contract-properties" style="display: flex; flex-direction: column; gap: 0.5rem;">
534
+ <!-- Dynamic metrics badges -->
535
+ </div>
536
+ </div>
537
+ </div>
538
+ </div>
539
+ </div>
540
+
541
+ <!-- Tab 3: HPC Run Simulator -->
542
+ <div id="hpc" class="tab-pane">
543
+ <div class="grid-2">
544
+ <div class="glass-card">
545
+ <div class="card-title">
546
+ <svg aria-hidden="true" viewBox="0 0 24 24"><title>Icon</title><path d="M12 6V4m0 2a2 2 0 100 4m0-4a2 2 0 110 4m-6 8a2 2 0 100-4m0 4a2 2 0 110-4m0 4v2m0-6V4m6 6v10m6-2a2 2 0 100-4m0 4a2 2 0 110-4m0 4v2m0-6V4"/></svg>
547
+ HPC Queue & Cluster Setup
548
+ </div>
549
+
550
+ <div class="form-group">
551
+ <label>Runtime Scheduler Kind</label>
552
+ <select id="hpc-kind">
553
+ <option value="slurm">Slurm (sbatch queue manager)</option>
554
+ <option value="mpi">MPI rank-sensitive (mpirun launcher)</option>
555
+ <option value="local">Local execution (direct process)</option>
556
+ </select>
557
+ </div>
558
+
559
+ <div class="grid-2" style="gap:1rem; margin-bottom:0;">
560
+ <div class="form-group">
561
+ <label>Nodes allocation</label>
562
+ <input type="number" id="hpc-nodes" value="4">
563
+ </div>
564
+ <div class="form-group">
565
+ <label>Ranks count</label>
566
+ <input type="number" id="hpc-ranks" value="64">
567
+ </div>
568
+ </div>
569
+
570
+ <div class="form-group">
571
+ <label>Environment Modules (One per line)</label>
572
+ <textarea id="hpc-modules" style="font-family:var(--font-mono); min-height:80px;">intel/2024
573
+ openmpi/5.0
574
+ netcdf-c/4.9</textarea>
575
+ </div>
576
+
577
+ <div class="form-group">
578
+ <label>Target Scientific Artifact Output Path</label>
579
+ <input type="text" id="hpc-path" value="out/region_west.nc">
580
+ </div>
581
+
582
+ <div style="margin-bottom: 1.5rem;">
583
+ <label style="text-transform:none; font-size:0.9rem; display:flex; align-items:center; gap:0.5rem; color:var(--text-main)">
584
+ <input type="checkbox" id="hpc-preserve" checked> Preserve Output (prevent manual cleanup scripts from deleting checkpoints)
585
+ </label>
586
+ </div>
587
+
588
+ <button type="button" class="btn btn-primary" style="width:100%; justify-content:center;" onclick="_simulateHpcRun()">
589
+ Submit sbatch Job & Validate
590
+ </button>
591
+ </div>
592
+
593
+ <div class="glass-card">
594
+ <div class="card-title">
595
+ <svg aria-hidden="true" viewBox="0 0 24 24"><title>Icon</title><path d="M8 9l3 3-3 3m5 0h3M5 20h14a2 2 0 002-2V6a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z"/></svg>
596
+ HPC Cluster Job Logs & Advisory Receipt
597
+ </div>
598
+
599
+ <div id="hpc-banner" class="status-panel success" style="display:none;">
600
+ Validation Finished.
601
+ </div>
602
+
603
+ <div id="hpc-details" style="margin-top: 1rem; display:none;">
604
+ <div style="background: rgba(255, 255, 255, 0.02); border: 1px solid var(--border-card); padding: 1.25rem; border-radius: 8px; margin-bottom: 1rem;">
605
+ <p style="margin-bottom:0.5rem;"><strong>Slurm Job ID:</strong> <span id="res-jobid" style="font-family:var(--font-mono);">SBATCH-48195</span></p>
606
+ <p style="margin-bottom:0.5rem;"><strong>Scientific Validator:</strong> <span id="res-verdict" style="color:#34d399; font-weight:700;">PASSED (Advisory)</span></p>
607
+ <p style="margin-bottom:0.5rem;"><strong>Artifact Safeguard:</strong> <span id="res-preserve" style="font-family:var(--font-mono);">-</span></p>
608
+ </div>
609
+
610
+ <h4 style="margin-bottom: 0.5rem; font-size: 0.95rem; color:#ffffff;">HPC Cluster stdout/stderr:</h4>
611
+ <div class="console-box" id="hpc-log">
612
+ <!-- Logs go here -->
613
+ </div>
614
+ </div>
615
+
616
+ <div id="hpc-placeholder" style="text-align: center; color: var(--text-dark); padding: 5rem 1rem;">
617
+ Submit the job simulation on the left to review module loads, job submission queue, post-execution check triggers, and advisory receipts.
618
+ </div>
619
+ </div>
620
+ </div>
621
+ </div>
622
+
623
+ <!-- Tab 4: Validation Lifecycle -->
624
+ <div id="flowchart" class="tab-pane">
625
+ <div class="glass-card">
626
+ <div class="card-title">
627
+ <svg aria-hidden="true" viewBox="0 0 24 24"><title>Icon</title><path d="M13 10V3L4 14h7v7l9-11h-7z"/></svg>
628
+ HPC Validation Contract Workflow
629
+ </div>
630
+ <div class="flowchart-container">
631
+ <p style="margin-bottom:1.5rem; font-size:0.925rem; color:var(--text-muted);">
632
+ Scientific validations execute in four distinct stages. The Slurm/MPI queue manager submits jobs to execute the simulations. Post-run modules are loaded to run validation commands and check tolerances. The validation results generate advisory receipts while checkpoint policies preserve state. Finally, the artifacts and logs are transferred via <strong>Globus endpoints</strong> to high-performance facilities like <strong>Argonne ALCF</strong>.
633
+ </p>
634
+ <svg aria-hidden="true" width="850" height="420" viewBox="0 0 850 420" style="background:#020408; border-radius:10px;"><title>Icon</title>
635
+ <defs>
636
+ <marker id="arrow" viewBox="0 0 10 10" refX="5" refY="5" markerWidth="6" markerHeight="6" orient="auto-start-reverse">
637
+ <path d="M 0 0 L 10 5 L 0 10 z" fill="#00f0ff" />
638
+ </marker>
639
+ <filter id="glow-cyan" x="-20%" y="-20%" width="140%" height="140%">
640
+ <feGaussianBlur stdDeviation="4" result="blur" />
641
+ <feComposite in="SourceGraphic" in2="blur" operator="over" />
642
+ </filter>
643
+ </defs>
644
+
645
+ <!-- Grid background -->
646
+ <path d="M 0 0 L 850 0 M 0 40 L 850 40 M 0 80 L 850 80 M 0 120 L 850 120 M 0 160 L 850 160 M 0 200 L 850 200 M 0 240 L 850 240 M 0 280 L 850 280 M 0 320 L 850 320 M 0 360 L 850 360 M 0 400 L 850 400" stroke="rgba(255,255,255,0.02)" stroke-width="1" />
647
+ <path d="M 0 0 L 0 420 M 50 0 L 50 420 M 100 0 L 100 420 M 150 0 L 150 420 M 200 0 L 200 420 M 250 0 L 250 420 M 300 0 L 300 420 M 350 0 L 350 420 M 400 0 L 400 420 M 450 0 L 450 420 M 500 0 L 500 420 M 550 0 L 550 420 M 600 0 L 600 420 M 650 0 L 650 420 M 700 0 L 700 420 M 750 0 L 750 420 M 800 0 L 800 420" stroke="rgba(255,255,255,0.02)" stroke-width="1" />
648
+
649
+ <!-- STAGE 1: SUBMIT -->
650
+ <g transform="translate(10, 40)">
651
+ <rect x="10" y="20" width="160" height="280" rx="8" fill="rgba(255,255,255,0.01)" stroke="rgba(255,255,255,0.05)" />
652
+ <text x="90" y="45" fill="var(--text-dark)" font-size="11" font-weight="700" text-anchor="middle" letter-spacing="1">1. JOB QUEUE</text>
653
+
654
+ <rect x="25" y="80" width="130" height="60" rx="6" fill="#111827" stroke="rgba(255,255,255,0.1)" />
655
+ <text x="90" y="105" fill="#fff" font-size="11" font-weight="600" text-anchor="middle">sbatch Submission</text>
656
+ <text x="90" y="123" fill="var(--text-muted)" font-size="9" text-anchor="middle">Slurm / MPI run launcher</text>
657
+
658
+ <rect x="25" y="180" width="130" height="60" rx="6" fill="#111827" stroke="rgba(255,255,255,0.1)" />
659
+ <text x="90" y="205" fill="#fff" font-size="11" font-weight="600" text-anchor="middle">Simulation Exec</text>
660
+ <text x="90" y="223" fill="var(--text-muted)" font-size="9" text-anchor="middle">Writes NetCDF output</text>
661
+ </g>
662
+
663
+ <!-- STAGE 2: POST RUN CONTRACT VALIDATOR -->
664
+ <g transform="translate(200, 40)">
665
+ <rect x="10" y="20" width="200" height="280" rx="8" fill="rgba(0, 240, 255, 0.03)" stroke="var(--color-cyan)" stroke-width="1.5" filter="url(#glow-cyan)" />
666
+ <text x="110" y="45" fill="var(--color-cyan)" font-size="12" font-weight="700" text-anchor="middle" letter-spacing="1">2. POST-RUN AUDIT</text>
667
+
668
+ <!-- module load -->
669
+ <rect x="25" y="80" width="170" height="50" rx="6" fill="#111827" stroke="rgba(255,255,255,0.1)" />
670
+ <text x="110" y="105" fill="#fff" font-size="11" text-anchor="middle">Module Loading</text>
671
+ <text x="110" y="120" fill="var(--text-muted)" font-size="9" text-anchor="middle">Loads intel, MPI, netCDF-c</text>
672
+
673
+ <!-- checks -->
674
+ <rect x="25" y="170" width="170" height="60" rx="6" fill="#111827" stroke="rgba(255,255,255,0.1)" />
675
+ <text x="110" y="195" fill="#fff" font-size="11" text-anchor="middle">Numerical Checkers</text>
676
+ <text x="110" y="213" fill="var(--text-muted)" font-size="9" text-anchor="middle">Relative/Absolute tolerances</text>
677
+ </g>
678
+
679
+ <!-- STAGE 3: RECEIPT -->
680
+ <g transform="translate(430, 40)">
681
+ <rect x="10" y="20" width="180" height="280" rx="8" fill="rgba(255,255,255,0.01)" stroke="rgba(255,255,255,0.05)" />
682
+ <text x="100" y="45" fill="var(--text-dark)" font-size="11" font-weight="700" text-anchor="middle" letter-spacing="1">3. RECEIPT</text>
683
+
684
+ <rect x="25" y="80" width="150" height="60" rx="6" fill="rgba(16, 185, 129, 0.05)" stroke="var(--color-emerald)" stroke-width="1" />
685
+ <text x="100" y="105" fill="var(--color-emerald)" font-size="11" font-weight="700" text-anchor="middle">Advisory Receipt</text>
686
+ <text x="100" y="123" fill="var(--text-muted)" font-size="9" text-anchor="middle">Validates dimensions & grid</text>
687
+
688
+ <!-- Preserve Checkpoint -->
689
+ <rect x="25" y="170" width="150" height="60" rx="6" fill="rgba(189, 0, 255, 0.05)" stroke="var(--color-purple)" stroke-width="1" />
690
+ <text x="100" y="195" fill="var(--color-purple)" font-size="11" font-weight="700" text-anchor="middle">Safe Checkpoint</text>
691
+ <text x="100" y="213" fill="var(--text-muted)" font-size="9" text-anchor="middle">Preserves state from cleanups</text>
692
+ </g>
693
+
694
+ <!-- STAGE 4: ARCHIVE & PROVENANCE -->
695
+ <g transform="translate(640, 40)">
696
+ <rect x="10" y="20" width="180" height="280" rx="8" fill="rgba(255,255,255,0.01)" stroke="rgba(255,255,255,0.05)" />
697
+ <text x="100" y="45" fill="var(--text-dark)" font-size="11" font-weight="700" text-anchor="middle" letter-spacing="1">4. ARCHIVE</text>
698
+
699
+ <rect x="25" y="80" width="150" height="60" rx="6" fill="#111827" stroke="rgba(255,255,255,0.1)" />
700
+ <text x="100" y="105" fill="#fff" font-size="11" font-weight="600" text-anchor="middle">Globus Transfer</text>
701
+ <text x="100" y="123" fill="var(--text-muted)" font-size="9" text-anchor="middle">Secure cluster endpoints</text>
702
+
703
+ <rect x="25" y="170" width="150" height="60" rx="6" fill="#111827" stroke="rgba(255,255,255,0.1)" />
704
+ <text x="100" y="195" fill="#fff" font-size="11" font-weight="600" text-anchor="middle">ALCF Catalog</text>
705
+ <text x="100" y="213" fill="var(--text-muted)" font-size="9" text-anchor="middle">Science model provenance</text>
706
+ </g>
707
+
708
+ <!-- Connections -->
709
+ <path d="M 180 140 L 210 140" stroke="#00f0ff" stroke-width="1.5" marker-end="url(#arrow)" fill="none" />
710
+ <path d="M 410 140 L 440 140" stroke="#00f0ff" stroke-width="1.5" marker-end="url(#arrow)" fill="none" />
711
+ <path d="M 620 140 L 650 140" stroke="#00f0ff" stroke-width="1.5" marker-end="url(#arrow)" fill="none" />
712
+ </svg>
713
+ </div>
714
+ </div>
715
+ </div>
716
+ </div>
717
+
718
+ <script>
719
+ function _switchTab(tabId) {
720
+ document.querySelectorAll('.tab-pane').forEach(el => { el.classList.remove('active'); });
721
+ document.querySelectorAll('.tab-btn').forEach(el => { el.classList.remove('active'); });
722
+
723
+ document.getElementById(tabId).classList.add('active');
724
+ event.currentTarget.classList.add('active');
725
+ }
726
+
727
+ // Tolerance calculator
728
+ function calculateTolerance() {
729
+ const ref = parseFloat(document.getElementById('tol-ref').value) || 0;
730
+ const val = parseFloat(document.getElementById('tol-val').value) || 0;
731
+ const type = document.getElementById('tol-type').value;
732
+ const threshStr = document.getElementById('tol-threshold').value;
733
+ const threshold = parseFloat(threshStr) || 0;
734
+
735
+ let delta = 0;
736
+ let pass = false;
737
+
738
+ if (type === 'relative') {
739
+ delta = Math.abs(val - ref) / Math.abs(ref);
740
+ pass = delta <= threshold;
741
+ } else if (type === 'absolute') {
742
+ delta = Math.abs(val - ref);
743
+ pass = delta <= threshold;
744
+ } else if (type === 'ulp') {
745
+ // Mock ULP calculation for standard JS float64 difference representation steps
746
+ const view = new DataView(new ArrayBuffer(8));
747
+ view.setFloat64(0, ref);
748
+ const refInt = view.getBigUint64(0);
749
+ view.setFloat64(0, val);
750
+ const valInt = view.getBigUint64(0);
751
+
752
+ // Compute integer steps
753
+ const steps = Number(valInt > refInt ? valInt - refInt : refInt - valInt);
754
+ delta = steps;
755
+ pass = steps <= threshold;
756
+ }
757
+
758
+ const banner = document.getElementById('tol-banner');
759
+ const deltaEl = document.getElementById('tol-calc-delta');
760
+ const threshEl = document.getElementById('tol-calc-thresh');
761
+
762
+ deltaEl.textContent = delta.toExponential(6);
763
+ threshEl.textContent = threshold.toExponential(6);
764
+
765
+ if (pass) {
766
+ banner.className = 'status-panel success';
767
+ banner.textContent = 'Tolerance Check: PASSED. Candidate output falls within mathematical bounds.';
768
+ } else {
769
+ banner.className = 'status-panel error';
770
+ banner.textContent = 'Tolerance Check: FAILED. High deviation detected. Potential regression or crash.';
771
+ }
772
+ }
773
+
774
+ function _updateFormulaText() {
775
+ const type = document.getElementById('tol-type').value;
776
+ const display = document.getElementById('formula-display');
777
+ const thresholdInput = document.getElementById('tol-threshold');
778
+
779
+ if (type === 'relative') {
780
+ display.innerHTML = '|val - ref| / |ref| &le; threshold';
781
+ thresholdInput.value = '1e-6';
782
+ } else if (type === 'absolute') {
783
+ display.innerHTML = '|val - ref| &le; threshold';
784
+ thresholdInput.value = '1e-9';
785
+ } else if (type === 'ulp') {
786
+ display.innerHTML = 'StepsBetween(val, ref) &le; ULP_steps';
787
+ thresholdInput.value = '4';
788
+ }
789
+ }
790
+
791
+ // YAML Validation
792
+ const validSample = `version: 1
793
+ task: "Regenerate the regional climate output and confirm grid metadata."
794
+ runtime:
795
+ kind: slurm
796
+ nodes: 4
797
+ ranks: 64
798
+ walltime: "01:30:00"
799
+ modules:
800
+ - "intel/2024"
801
+ - "openmpi/5.0"
802
+ - "netcdf-c/4.9"
803
+ artifacts:
804
+ - path: out/region_west.nc
805
+ format: NetCDF
806
+ expected_dimensions:
807
+ time: 8760
808
+ lat: 360
809
+ lon: 720
810
+ expected_attributes:
811
+ Conventions: "CF-1.10"
812
+ numerical_tolerances:
813
+ relative: 1.0e-6
814
+ preserve: false
815
+ validators:
816
+ - "ncdump -h out/region_west.nc"
817
+ - "python tools/check_grid.py out/region_west.nc"`;
818
+
819
+ const invalidSample = `version: "abc" # Error: must be 1
820
+ task: "Missing artifacts list"
821
+ runtime:
822
+ kind: slurm
823
+ artifacts: [] # Error: must be non-empty list`;
824
+
825
+ function loadSampleYaml(type) {
826
+ if (type === 'valid') {
827
+ document.getElementById('raw-yaml').value = validSample;
828
+ } else {
829
+ document.getElementById('raw-yaml').value = invalidSample;
830
+ }
831
+ validateYaml();
832
+ }
833
+
834
+ function validateYaml() {
835
+ const text = document.getElementById('raw-yaml').value;
836
+ const statusPanel = document.getElementById('validator-status');
837
+ const propertiesList = document.getElementById('contract-properties');
838
+ propertiesList.innerHTML = '';
839
+
840
+ if (!text.trim()) {
841
+ statusPanel.className = 'status-panel warning';
842
+ statusPanel.textContent = 'Contract is empty. Write or load a sample YAML.';
843
+ return;
844
+ }
845
+
846
+ try {
847
+ const lines = text.split('\n');
848
+ const errors = [];
849
+ let version = null;
850
+ let artifactCount = 0;
851
+ let modulesCount = 0;
852
+
853
+ lines.forEach((line, idx) => {
854
+ const trimmed = line.trim();
855
+ if (trimmed.startsWith('#') || !trimmed) return;
856
+
857
+ const parts = trimmed.split(':');
858
+ if (parts.length >= 2) {
859
+ const key = parts[0].trim();
860
+ const val = parts[1].split('#')[0].trim();
861
+
862
+ if (key === 'version') {
863
+ version = val;
864
+ if (val !== '1') {
865
+ errors.push(`Line ${idx+1}: Contract schema version must be exactly 1`);
866
+ }
867
+ }
868
+ if (trimmed.startsWith('- path:')) {
869
+ artifactCount++;
870
+ }
871
+ if (trimmed.startsWith('- "intel') || trimmed.startsWith('- "openmpi') || trimmed.startsWith('- "netcdf')) {
872
+ modulesCount++;
873
+ }
874
+ }
875
+ });
876
+
877
+ if (errors.length > 0) {
878
+ statusPanel.className = 'status-panel error';
879
+ statusPanel.innerHTML = `<strong>Contract Schema Failures:</strong><ul style="margin-left: 1.5rem; margin-top:0.5rem;">${errors.map(e => `<li>${e}</li>`).join('')}</ul>`;
880
+ } else {
881
+ statusPanel.className = 'status-panel success';
882
+ statusPanel.innerHTML = `<strong>Success:</strong> Scientific Validation Contract is valid. Ready to be saved alongside research code.`;
883
+
884
+ addPropertyBadge('Contract Version', version || '1', 'cyan');
885
+ addPropertyBadge('Validated Artifacts', artifactCount || '1', 'purple');
886
+ addPropertyBadge('Cluster Modules', modulesCount || '3', 'emerald');
887
+ }
888
+ } catch (err) {
889
+ statusPanel.className = 'status-panel error';
890
+ statusPanel.textContent = `Parse Error: ${err.message}`;
891
+ }
892
+ }
893
+
894
+ function addPropertyBadge(label, val, color) {
895
+ const container = document.getElementById('contract-properties');
896
+ const item = document.createElement('div');
897
+ item.className = 'meta-badge';
898
+ item.style.borderLeft = `3px solid var(--color-${color})`;
899
+ item.innerHTML = `<span class="label">${label}:</span> <span class="value" style="color:var(--color-${color})">${val}</span>`;
900
+ container.appendChild(item);
901
+ }
902
+
903
+ // HPC Run Simulator
904
+ function _simulateHpcRun() {
905
+ document.getElementById('hpc-placeholder').style.display = 'none';
906
+ document.getElementById('hpc-details').style.display = 'block';
907
+ const banner = document.getElementById('hpc-banner');
908
+ banner.style.display = 'flex';
909
+
910
+ const kind = document.getElementById('hpc-kind').value;
911
+ const nodes = document.getElementById('hpc-nodes').value;
912
+ const ranks = document.getElementById('hpc-ranks').value;
913
+ const path = document.getElementById('hpc-path').value;
914
+ const preserve = document.getElementById('hpc-preserve').checked;
915
+ const modules = document.getElementById('hpc-modules').value.split('\n').filter(m => m.trim());
916
+
917
+ const logs = [];
918
+ logs.push(`[info] [scientific-executor] Parsing validation contract...`);
919
+ logs.push(`[info] Target environment declared: nodes=${nodes}, ranks=${ranks}, runtime=${kind}`);
920
+
921
+ modules.forEach(m => {
922
+ logs.push(`[info] [module-manager] Loading dependency module: ${m}`);
923
+ });
924
+
925
+ logs.push(`\n[sbatch-agent] Submitting simulation script to cluster queue...`);
926
+ logs.push(`[sbatch-agent] Job submitted successfully. Assigned ID: SBATCH-48195`);
927
+ logs.push(`[sbatch-agent] Job status: PENDING -> RUNNING`);
928
+
929
+ logs.push(`\n[cluster-node] Execution started on ranks [0..${ranks-1}]`);
930
+ logs.push(`[cluster-node] Simulation output written to filesystem.`);
931
+ logs.push(`[sbatch-agent] Job completed with exit status 0 (Success).`);
932
+
933
+ logs.push(`\n[scientific-executor] Commencing post-execution validation...`);
934
+ logs.push(`[info] Validating artifact at path: "${path}"`);
935
+ logs.push(`[info] format netCDF: checking coordinates dimensions (time: 8760, lat: 360, lon: 720)`);
936
+ logs.push(`[success] Dimensions match expectations.`);
937
+ logs.push(`[info] Running validator: "python tools/check_grid.py ${path}"`);
938
+ logs.push(`[success] check_grid.py completed successfully. Grid metadata matches CF-1.10 Conventions.`);
939
+
940
+ if (preserve) {
941
+ logs.push(`[safeguard] Checked 'preserve: true'. Output file registered in session state. Hard cleanups will protect this path.`);
942
+ document.getElementById('res-preserve').textContent = 'PRESERVED (Stateful)';
943
+ document.getElementById('res-preserve').style.color = '#bd00ff';
944
+ } else {
945
+ logs.push(`[safeguard] Checked 'preserve: false'. Temp/restart files eligible for standard session cleanups.`);
946
+ document.getElementById('res-preserve').textContent = 'ELIGIBLE FOR CLEANUP';
947
+ document.getElementById('res-preserve').style.color = 'var(--text-muted)';
948
+ }
949
+
950
+ logs.push(`[success] validation run finished. Advisory receipt created.`);
951
+
952
+ document.getElementById('hpc-log').textContent = logs.join('\n');
953
+ }
954
+
955
+ window.onload = () => {
956
+ calculateTolerance();
957
+ loadSampleYaml('valid');
958
+ }
959
+ </script>
960
+ </body>
961
+ </html>