-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
897 lines (815 loc) · 46.9 KB
/
index.html
File metadata and controls
897 lines (815 loc) · 46.9 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
821
822
823
824
825
826
827
828
829
830
831
832
833
834
835
836
837
838
839
840
841
842
843
844
845
846
847
848
849
850
851
852
853
854
855
856
857
858
859
860
861
862
863
864
865
866
867
868
869
870
871
872
873
874
875
876
877
878
879
880
881
882
883
884
885
886
887
888
889
890
891
892
893
894
895
896
897
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
<meta name="color-scheme" content="dark" />
<meta name="theme-color" content="#000000" />
<!-- ============================================================
CUSTOMIZE: SITE IDENTITY & SEO
Replace all instances of:
- "SCQCS" with your project name
- "scqcs.com" with your domain
- "ERRERLabs" with your organization name
- Descriptions with your project's description
============================================================ -->
<title>SCQCS — Schrödinger's Cat Quantum Cryptography & Security</title>
<meta name="description" content="SCQCS is a privacy-first security framework built on append-only logging, sealed storage, and accountable access patterns." />
<meta property="og:title" content="SCQCS — Schrödinger's Cat Quantum Cryptography & Security" />
<meta property="og:description" content="A privacy-first security framework. Append-only logs. Sealed storage. Access that leaves receipts." />
<meta property="og:type" content="website" />
<meta property="og:url" content="https://scqcs.com" />
<meta property="og:image" content="https://scqcs.com/assets/scqcs-poster.jpeg" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="SCQCS — Privacy-first Security Framework" />
<meta name="twitter:description" content="Sealed until observed. Observation leaves receipts." />
<meta name="twitter:image" content="https://scqcs.com/assets/scqcs-poster.jpeg" />
<link rel="canonical" href="https://scqcs.com/" />
<!-- Additional SEO -->
<meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1" />
<meta name="author" content="ERRERLabs" />
<meta name="keywords" content="SCQCS, security framework, privacy-first, append-only logging, sealed storage, accountable access, cryptographic security, zero-trust, quantum cryptography, ERRERLabs" />
<meta name="subject" content="Privacy-first Security Framework" />
<meta name="classification" content="Security, Cryptography, Privacy" />
<!-- ============================================================
CUSTOMIZE: JSON-LD STRUCTURED DATA
Update all fields below with your project's information.
This helps search engines understand your site.
============================================================ -->
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "SoftwareApplication",
"name": "SCQCS",
"alternateName": "Schrödinger's Cat Quantum Cryptography & Security",
"applicationCategory": "SecurityApplication",
"operatingSystem": "Cross-platform",
"description": "SCQCS is a privacy-first security framework built on append-only logging, sealed storage, and accountable access patterns. It defines architectural patterns for systems where privacy and auditability must coexist.",
"url": "https://scqcs.com",
"image": "https://scqcs.com/assets/scqcs-poster.jpeg",
"author": {
"@type": "Organization",
"name": "ERRERLabs",
"url": "https://github.com/kmay89"
},
"isAccessibleForFree": true,
"license": "https://scqcs.com/#legal",
"featureList": [
"Append-only logging with cryptographic chaining",
"Sealed storage with minimal metadata exposure",
"Accountable break-glass access patterns",
"Cryptographic agility for algorithm rotation",
"Local-first architecture support",
"Adversarial insider threat modeling"
],
"keywords": "security framework, privacy-first, append-only logging, sealed storage, accountable access, cryptographic security, zero-trust"
}
</script>
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "Organization",
"name": "ERRERLabs",
"url": "https://github.com/kmay89",
"logo": "https://scqcs.com/assets/android-chrome-512x512.png",
"sameAs": [],
"knowsAbout": ["Cryptography", "Privacy", "Security Architecture", "Zero-Trust Systems"]
}
</script>
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "WebPage",
"name": "SCQCS — Schrödinger's Cat Quantum Cryptography & Security",
"description": "A privacy-first security framework. Append-only logs. Sealed storage. Access that leaves receipts.",
"url": "https://scqcs.com",
"mainEntity": {
"@type": "SoftwareApplication",
"name": "SCQCS"
},
"speakable": {
"@type": "SpeakableSpecification",
"cssSelector": [".hero-title", ".hero-subtitle", ".section-title", ".section-description"]
}
}
</script>
<!-- Favicons -->
<link rel="apple-touch-icon" sizes="180x180" href="assets/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="assets/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="assets/favicon-16x16.png">
<link rel="icon" href="assets/favicon.ico">
<link rel="manifest" href="site.webmanifest">
<!-- Resource hints for performance -->
<link rel="preconnect" href="https://fonts.googleapis.com" crossorigin>
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="dns-prefetch" href="https://fonts.googleapis.com">
<link rel="dns-prefetch" href="https://fonts.gstatic.com">
<!-- Font preload for better loading performance (replaces @import) -->
<link rel="preload" href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap" as="style" onload="this.onload=null;this.rel='stylesheet'">
<noscript><link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap"></noscript>
<!-- Transparency -->
<link rel="author" href="humans.txt">
<link rel="stylesheet" href="styles.css">
</head>
<body>
<!-- ============================================================
CUSTOMIZE: NAVIGATION
Update nav links to match your sections. Keep the structure
but change link text and href targets.
============================================================ -->
<nav id="nav">
<div class="nav-inner">
<div class="logo-group">
<a href="#" class="logo" data-sound="hover">
<div class="logo-icon">
<svg viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg" aria-label="SCQCS">
<rect x="6" y="6" width="28" height="28" stroke="white" stroke-width="2.5" fill="none"/>
</svg>
</div>
<span class="logo-text scintillate"><span>S</span><span>C</span><span>Q</span><span>C</span><span>S</span></span>
</a>
<div class="health-indicator" title="Framework documentation online">
<span class="health-dot"></span>
<span>Online</span>
</div>
<div class="no-cookies-tag" title="No cookies, analytics, or tracking">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<circle cx="12" cy="12" r="10"/>
<path d="M4.93 4.93l14.14 14.14"/>
</svg>
<span>No cookies</span>
</div>
</div>
<div class="nav-links">
<a href="#what" class="nav-link" data-sound="click">About</a>
<a href="#principles" class="nav-link" data-sound="click">Principles</a>
<a href="#architecture" class="nav-link" data-sound="click">Architecture</a>
<a href="#ecosystem" class="nav-link" data-sound="click">Ecosystem</a>
<a href="#template" class="nav-cta interactive" data-sound="click">Use Template</a>
</div>
<!-- Mobile hamburger button -->
<button class="hamburger" id="hamburger" aria-label="Toggle navigation menu" aria-expanded="false">
<span class="hamburger-line"></span>
<span class="hamburger-line"></span>
<span class="hamburger-line"></span>
</button>
</div>
<div class="scroll-progress" id="scroll-progress"></div>
</nav>
<!-- Mobile navigation overlay -->
<div class="mobile-nav" id="mobile-nav">
<div class="mobile-nav-links">
<a href="#what" class="mobile-nav-link" data-sound="click">About</a>
<a href="#principles" class="mobile-nav-link" data-sound="click">Principles</a>
<a href="#architecture" class="mobile-nav-link" data-sound="click">Architecture</a>
<a href="#ecosystem" class="mobile-nav-link" data-sound="click">Ecosystem</a>
<a href="#template" class="mobile-nav-cta" data-sound="click">Use Template</a>
</div>
</div>
<!-- ============================================================
CUSTOMIZE: HERO SECTION
Replace the hero content with your project's main message:
- Video/poster: Replace assets/scqcs-hero.mp4 and assets/scqcs-poster.jpeg
- Badge text: Your project's tagline
- Title: Your main headline
- Subtitle: Brief description of what you offer
- Buttons: Adjust CTAs to match your sections
============================================================ -->
<section class="hero">
<div class="hero-bg"></div>
<div class="hero-content">
<!-- Video/Logo Animation - Above text, contained -->
<div class="hero-video-container">
<video class="hero-video" autoplay muted loop playsinline preload="metadata" poster="assets/scqcs-poster.jpeg">
<source src="assets/scqcs-hero.mp4" type="video/mp4" />
</video>
<div class="hero-video-glow"></div>
</div>
<div class="hero-badge">
<span class="hero-badge-dot"></span>
<span>Privacy-first security framework</span>
</div>
<h1 class="hero-title">
<span class="hero-title-gradient">Sealed until observed.</span><br>
Observation leaves receipts.
</h1>
<p class="hero-subtitle">
SCQCS defines patterns for append-only logging, sealed storage, and accountable access. A framework for systems where privacy and auditability must coexist.
</p>
<div class="hero-buttons">
<a href="#what" class="btn btn-primary interactive" data-sound="click">
Learn the framework
<svg class="btn-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M12 5v14M19 12l-7 7-7-7"/>
</svg>
</a>
<a href="#ecosystem" class="btn btn-secondary interactive" data-sound="click">
See implementations
<svg class="btn-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M7 17L17 7M7 7h10v10"/>
</svg>
</a>
</div>
<a href="#template" class="hero-cta-secondary interactive" data-sound="click">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M13 2L3 14h9l-1 8 10-12h-9l1-8z"/>
</svg>
Launch secure in minutes
</a>
<div class="hero-ai-prompt-wrapper">
<div class="hero-ai-prompt">
<div class="hero-ai-prompt-chrome">
<span class="hero-ai-prompt-chrome-dot"></span>
<span class="hero-ai-prompt-chrome-dot"></span>
<span class="hero-ai-prompt-chrome-dot"></span>
<span class="hero-ai-prompt-chrome-title">AI Assistant</span>
</div>
<div class="hero-ai-prompt-content">
<button class="ai-prompt-copy interactive" data-sound="click">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<rect x="9" y="9" width="13" height="13" rx="2" ry="2"/>
<path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"/>
</svg>
<span class="copy-text">Copy prompt</span>
<span class="copied-text">Paste into your AI!</span>
</button>
<div class="ai-prompt-text">
<span class="prompt-label">></span>
<span class="ai-prompt-llm">
<span class="ai-prompt-llm-inner">
<span class="ai-prompt-llm-item">Claude</span>
<span class="ai-prompt-llm-item">ChatGPT</span>
<span class="ai-prompt-llm-item">Gemini</span>
<span class="ai-prompt-llm-item">Qwen</span>
<span class="ai-prompt-llm-item">Claude</span>
</span>
</span>
<span>, use </span>
<span class="ai-prompt-url">github.com/kmay89/SCQCS</span>
<span class="ai-prompt-action"> to build me a site about </span>
<span class="ai-prompt-placeholder">your idea here</span>
</div>
</div>
</div>
</div>
</div>
<div class="scroll-indicator" data-sound="click">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M12 5v14M19 12l-7 7-7-7"/>
</svg>
</div>
</section>
<!-- ============================================================
CUSTOMIZE: ABOUT SECTION (id="what")
Replace with your project's introduction:
- Section label, title, and description
- Image: Replace assets/android-chrome-512x512.png with your logo
============================================================ -->
<section class="what-section" id="what">
<div class="section-inner">
<div class="what-grid">
<div class="what-content reveal">
<span class="section-label">The Framework</span>
<h2 class="section-title">What is SCQCS?</h2>
<h3>Schrödinger's Cat Quantum Cryptography & Security</h3>
<p>
SCQCS is a set of architectural patterns and security principles for building systems that need both privacy and accountability. Named after the famous thought experiment, it embodies a core insight: <strong>data should remain sealed until deliberately observed—and observation should leave auditable evidence</strong>.
</p>
<p>
The framework provides guidance for implementing append-only event chains, sealed vault storage, controlled "break-glass" access, and cryptographic agility. It's designed for systems where you need to prove what happened without enabling surveillance.
</p>
<p>
SCQCS is <strong>not a product</strong>—it's a philosophy and pattern library. Implementations may vary in how they apply these principles to their specific domains.
</p>
</div>
<div class="what-visual reveal reveal-delay-1">
<img src="assets/android-chrome-512x512.png" alt="SCQCS Canary - The Witness" loading="lazy" decoding="async">
</div>
</div>
</div>
</section>
<!-- ============================================================
CUSTOMIZE: FEATURES/PATTERNS SECTION
Replace with your project's core features or offerings.
Keep the card structure (.card class) for consistent styling.
Each card has: icon, title, description.
============================================================ -->
<section class="patterns-section">
<div class="section-inner">
<div class="text-center">
<span class="section-label reveal">Core Patterns</span>
<h2 class="section-title reveal reveal-delay-1">Three pillars of accountable privacy</h2>
<p class="section-description reveal reveal-delay-2 mx-auto">
These patterns form the foundation of any SCQCS-aligned system.
</p>
</div>
<div class="patterns-grid">
<div class="card card--centered card--lift card--shadow pattern-card reveal interactive quantum-border" data-sound="hover">
<div class="pattern-icon">📜</div>
<h3 class="pattern-title">Append-only logging</h3>
<p class="pattern-text">Events chain forward cryptographically. Modifications become detectable. Deletions become evident. History becomes verifiable.</p>
</div>
<div class="card card--centered card--lift card--shadow pattern-card reveal reveal-delay-1 interactive quantum-border" data-sound="hover">
<div class="pattern-icon">🔐</div>
<h3 class="pattern-title">Sealed storage</h3>
<p class="pattern-text">Data encrypted at rest with minimal metadata exposure. Designed for retention without sprawl, access without surveillance.</p>
</div>
<div class="card card--centered card--lift card--shadow pattern-card reveal reveal-delay-2 interactive quantum-border" data-sound="hover">
<div class="pattern-icon">🚨</div>
<h3 class="pattern-title">Accountable access</h3>
<p class="pattern-text">Emergency access patterns that are scoped, logged, and attributable. Exceptions exist—but they leave durable, tamper-evident receipts.</p>
</div>
</div>
</div>
</section>
<!-- ============================================================
CUSTOMIZE: PRINCIPLES/VALUES SECTION (id="principles")
Replace with your project's guiding principles or values.
Each card has: number, title, description, tags.
============================================================ -->
<section class="principles-section" id="principles">
<div class="section-inner">
<span class="section-label reveal">Principles</span>
<h2 class="section-title reveal reveal-delay-1">Security is architecture</h2>
<p class="section-description reveal reveal-delay-2">
These constraints shape every design decision from day one.
</p>
<div class="principles-grid">
<div class="card card--dark card--lift principle-card reveal interactive quantum-border" data-sound="hover">
<span class="principle-number">01</span>
<h3 class="principle-title">Witness, not watcher</h3>
<p class="principle-text">Support evidence without enabling surveillance. Collect only what's necessary. Resist scope creep.</p>
<div class="principle-tags">
<span class="principle-tag">data-minimization</span>
<span class="principle-tag">purpose-limitation</span>
</div>
</div>
<div class="card card--dark card--lift principle-card reveal reveal-delay-1 interactive quantum-border" data-sound="hover">
<span class="principle-number">02</span>
<h3 class="principle-title">Audit over trust</h3>
<p class="principle-text">Cryptographic proofs outlast policies and good intentions. Make integrity verifiable.</p>
<div class="principle-tags">
<span class="principle-tag">tamper-evident</span>
<span class="principle-tag">verifiable</span>
</div>
</div>
<div class="card card--dark card--lift principle-card reveal reveal-delay-2 interactive quantum-border" data-sound="hover">
<span class="principle-number">03</span>
<h3 class="principle-title">Exceptions leave fingerprints</h3>
<p class="principle-text">Emergency access exists—but every use is remembered. Attribution is automatic and durable.</p>
<div class="principle-tags">
<span class="principle-tag">least-privilege</span>
<span class="principle-tag">attribution</span>
</div>
</div>
<div class="card card--dark card--lift principle-card reveal reveal-delay-3 interactive quantum-border" data-sound="hover">
<span class="principle-number">04</span>
<h3 class="principle-title">Plan for rotation</h3>
<p class="principle-text">Algorithms weaken. Keys expire. Build migration paths from day one.</p>
<div class="principle-tags">
<span class="principle-tag">crypto-agility</span>
<span class="principle-tag">key-rotation</span>
</div>
</div>
<div class="card card--dark card--lift principle-card reveal reveal-delay-4 interactive quantum-border" data-sound="hover">
<span class="principle-number">05</span>
<h3 class="principle-title">Local-first when possible</h3>
<p class="principle-text">Every external dependency is attack surface. Minimize egress. Maximize autonomy.</p>
<div class="principle-tags">
<span class="principle-tag">local-first</span>
<span class="principle-tag">explicit-egress</span>
</div>
</div>
<div class="card card--dark card--lift principle-card reveal interactive quantum-border" data-sound="hover">
<span class="principle-number">06</span>
<h3 class="principle-title">Design for distrust</h3>
<p class="principle-text">The threat model includes insiders. Make misuse architecturally difficult, not just prohibited.</p>
<div class="principle-tags">
<span class="principle-tag">zero-trust</span>
<span class="principle-tag">defense-in-depth</span>
</div>
</div>
</div>
</div>
</section>
<!-- ============================================================
CUSTOMIZE: ARCHITECTURE/HOW IT WORKS SECTION (id="architecture")
Replace with technical details or how your product works.
============================================================ -->
<section class="architecture-section" id="architecture">
<div class="section-inner">
<span class="section-label reveal">Reference Architecture</span>
<h2 class="section-title reveal reveal-delay-1">Contract-first patterns</h2>
<p class="section-description reveal reveal-delay-2">
SCQCS defines interfaces and behaviors, not implementations. Here's the mental model.
</p>
<div class="arch-grid">
<div class="arch-visual reveal">
<div class="arch-header">
<h3 class="arch-header-title">Evidence envelope model</h3>
<p class="arch-header-text">Each record is an envelope containing minimal metadata, content digests, and policy tags. Envelopes chain forward—making modifications detectable and deletions evident.</p>
</div>
<div class="arch-code">
<div><span class="dim">record:</span> <span class="warn">ENVELOPE</span> <span class="dim">type=</span><span class="val">event</span> <span class="dim">scope=</span><span class="val">local</span></div>
<div><span class="dim">vault:</span> <span class="key">ciphertext</span>=… <span class="dim">kdf=</span>… <span class="dim">policy=</span><span class="val">minimize</span></div>
<div><span class="dim">chain:</span> <span class="key">prev_hash</span>=… <span class="dim">hash=</span><span class="ok">VALID</span> <span class="dim">sig=</span><span class="ok">VALID</span></div>
<div><span class="dim">access:</span> <span class="key">break_glass</span>=<span class="bad">false</span> <span class="dim">export=</span><span class="bad">none</span></div>
</div>
</div>
<div class="arch-sidebar">
<div class="card arch-card reveal reveal-delay-1">
<h4 class="arch-card-title">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"/>
</svg>
Design assumptions
</h4>
<p class="arch-card-text">SCQCS patterns assume adversarial conditions by default.</p>
<ul class="arch-list">
<li><span class="check">✓</span> Hostile network paths</li>
<li><span class="check">✓</span> Compromised endpoints</li>
<li><span class="check">✓</span> Insider threats</li>
<li><span class="check">✓</span> Algorithm deprecation</li>
</ul>
</div>
<div class="card arch-card reveal reveal-delay-2">
<h4 class="arch-card-title">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<circle cx="12" cy="12" r="10"/>
<path d="M12 8v4M12 16h.01"/>
</svg>
Important limitations
</h4>
<ul class="arch-list">
<li><span class="cross">✗</span> Not a compliance certification</li>
<li><span class="cross">✗</span> Not legal advice</li>
<li><span class="cross">✗</span> Not a security guarantee</li>
<li><span class="cross">✗</span> Implementation-dependent</li>
</ul>
</div>
</div>
</div>
</div>
</section>
<!-- ============================================================
CUSTOMIZE: SPECIAL FEATURE SECTION (id="breakglass")
Replace with a highlight feature or unique selling point.
Or remove this section if not needed.
============================================================ -->
<section class="breakglass-section" id="breakglass">
<div class="section-inner">
<span class="section-label reveal">Access Patterns</span>
<h2 class="section-title reveal reveal-delay-1">Break-glass with receipts</h2>
<p class="section-description reveal reveal-delay-2">
Emergency access is sometimes necessary. SCQCS defines patterns that make it deliberate, scoped, and durably recorded.
</p>
<div class="breakglass-visual reveal">
<div class="breakglass-header">
<div class="breakglass-icon">🔓</div>
<h3 class="breakglass-title">Accountable exception handling</h3>
<p class="breakglass-subtitle">Three properties every break-glass implementation should enforce</p>
</div>
<div class="breakglass-steps">
<div class="card card--centered card--lift breakglass-step interactive" data-sound="hover">
<div class="step-number">01</div>
<h4 class="step-title">Scoped by default</h4>
<p class="step-text">Access should be constrained to minimum necessary scope—time range, record types, and purpose.</p>
</div>
<div class="card card--centered card--lift breakglass-step interactive" data-sound="hover">
<div class="step-number">02</div>
<h4 class="step-title">Multi-party when appropriate</h4>
<p class="step-text">Consider requiring multiple approvals or split keys. Single-actor access is a design choice, not a default.</p>
</div>
<div class="card card--centered card--lift breakglass-step interactive" data-sound="hover">
<div class="step-number">03</div>
<h4 class="step-title">Durable attribution</h4>
<p class="step-text">Every access creates a tamper-evident receipt: who, when, justification, scope, and outcomes.</p>
</div>
</div>
</div>
</div>
</section>
<!-- ============================================================
CUSTOMIZE: ECOSYSTEM/RELATED PROJECTS SECTION (id="ecosystem")
Replace with your related projects, integrations, or partners.
Or remove if not applicable.
============================================================ -->
<section class="ecosystem-section" id="ecosystem">
<div class="section-inner">
<span class="section-label reveal">Ecosystem</span>
<h2 class="section-title reveal reveal-delay-1">Implementations & resources</h2>
<p class="section-description reveal reveal-delay-2">
SCQCS principles are being applied in various contexts. Here are some related projects.
</p>
<div class="ecosystem-grid">
<div class="card card--lift ecosystem-card reveal interactive quantum-border" data-sound="hover">
<div class="ecosystem-icon">👁️</div>
<h3>SecuraCV</h3>
<p>A privacy-preserving computer vision framework that outputs semantic events instead of storing video. Uses SCQCS patterns for its witness kernel and vault architecture.</p>
<a href="https://securacv.netlify.app" class="ecosystem-link" target="_blank" rel="noopener noreferrer" data-sound="click">
Learn more
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M7 17L17 7M7 7h10v10"/>
</svg>
</a>
</div>
<div class="card card--lift ecosystem-card reveal reveal-delay-1 interactive quantum-border" data-sound="hover">
<div class="ecosystem-icon">🔬</div>
<h3>Open Source</h3>
<p>SCQCS patterns and implementations are developed in the open. Explore the code, contribute improvements, or fork for your own projects.</p>
<a href="https://github.com/kmay89" class="ecosystem-link" target="_blank" rel="noopener noreferrer" data-sound="click">
View on GitHub
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M7 17L17 7M7 7h10v10"/>
</svg>
</a>
</div>
<div class="card card--lift ecosystem-card reveal reveal-delay-2 interactive quantum-border" id="contact" data-sound="hover">
<div class="ecosystem-icon">💬</div>
<h3>Get involved</h3>
<p>Interested in applying SCQCS patterns to your work? Building something that needs accountable privacy? Contact channels coming soon.</p>
<span class="ecosystem-link ecosystem-link--disabled">
Coming soon
</span>
</div>
</div>
</div>
</section>
<!-- ============================================================
CUSTOMIZE: CTA/GETTING STARTED SECTION (id="template")
Replace with your call-to-action, getting started guide,
or signup section. Or remove if not needed.
============================================================ -->
<section class="template-section" id="template">
<div class="section-inner">
<span class="section-label reveal">Open Source</span>
<h2 class="section-title reveal reveal-delay-1">Use this as a template</h2>
<p class="section-description reveal reveal-delay-2">
This repository is designed to be forked and adapted. Get a secure, privacy-respecting static site in minutes.
</p>
<div class="ai-prompt-display reveal reveal-delay-3">
<button class="ai-prompt-copy interactive" data-sound="click">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<rect x="9" y="9" width="13" height="13" rx="2" ry="2"/>
<path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"/>
</svg>
<span class="copy-text">Copy prompt</span>
<span class="copied-text">Paste into your AI!</span>
</button>
<div class="ai-prompt-text">
<span class="prompt-label">></span>
<span class="ai-prompt-llm">
<span class="ai-prompt-llm-inner">
<span class="ai-prompt-llm-item">Claude</span>
<span class="ai-prompt-llm-item">ChatGPT</span>
<span class="ai-prompt-llm-item">Gemini</span>
<span class="ai-prompt-llm-item">Qwen</span>
<span class="ai-prompt-llm-item">Claude</span>
</span>
</span>
<span>, use </span>
<span class="ai-prompt-url">github.com/kmay89/SCQCS</span>
<span class="ai-prompt-action"> to build me a site about </span>
<span class="ai-prompt-placeholder">your idea here</span>
</div>
</div>
<div class="template-hero reveal">
<div class="template-header">
<div class="template-header-text">
<h3>Production-ready security defaults</h3>
<p>Fork the GitHub repo, customize the content, deploy to Netlify. All security headers, SEO optimization, and privacy best practices are already configured.</p>
</div>
<a href="https://github.com/kmay89/SCQCS" class="template-cta interactive" target="_blank" rel="noopener noreferrer" data-sound="click">
View on GitHub
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M7 17L17 7M7 7h10v10"/>
</svg>
</a>
</div>
<div class="template-steps">
<div class="template-step interactive quantum-border" data-sound="hover">
<div class="template-step-number">1</div>
<h4>Fork the repo</h4>
<p>Clone or fork from GitHub to get all files and configurations.</p>
</div>
<div class="template-step interactive quantum-border" data-sound="hover">
<div class="template-step-number">2</div>
<h4>Customize content</h4>
<p>Replace scqcs.com with your domain throughout all files.</p>
</div>
<div class="template-step interactive quantum-border" data-sound="hover">
<div class="template-step-number">3</div>
<h4>Update security.txt</h4>
<p>Add your security contact info and policy links.</p>
</div>
<div class="template-step interactive quantum-border" data-sound="hover">
<div class="template-step-number">4</div>
<h4>Deploy to Netlify</h4>
<p>Connect to Netlify for free HTTPS, CDN, and automatic deploys.</p>
</div>
</div>
<div class="template-includes">
<h4>What's included — free privacy tools</h4>
<div class="template-include-item">
<div class="template-include-icon"><span>🛡️</span></div>
<div class="template-include-text">
<strong>_headers</strong>
<span>A+ security headers: CSP, HSTS, COOP, COEP, Permissions-Policy</span>
</div>
</div>
<div class="template-include-item">
<div class="template-include-icon"><span>🔒</span></div>
<div class="template-include-text">
<strong>security.txt</strong>
<span>RFC 9116 compliant vulnerability disclosure policy</span>
</div>
</div>
<div class="template-include-item">
<div class="template-include-icon"><span>🤖</span></div>
<div class="template-include-text">
<strong>robots.txt + llms.txt</strong>
<span>AI crawler directives and LLM-readable documentation</span>
</div>
</div>
<div class="template-include-item">
<div class="template-include-icon"><span>🔍</span></div>
<div class="template-include-text">
<strong>SEO optimized</strong>
<span>Meta tags, Open Graph, Twitter Cards, JSON-LD structured data</span>
</div>
</div>
<div class="template-include-item">
<div class="template-include-icon"><span>📋</span></div>
<div class="template-include-text">
<strong>Preflight checklist</strong>
<span>Runnable pre-deploy audit with copy-paste commands</span>
</div>
</div>
<div class="template-include-item">
<div class="template-include-icon"><span>📖</span></div>
<div class="template-include-text">
<strong>Complete documentation</strong>
<span>Getting started guide, security reference, contribution guidelines</span>
</div>
</div>
<div class="template-include-item">
<div class="template-include-icon"><span>🚫</span></div>
<div class="template-include-text">
<strong>Zero tracking</strong>
<span>No cookies, no analytics, no localStorage — verified clean</span>
</div>
</div>
<div class="template-include-item">
<div class="template-include-icon"><span>⚡</span></div>
<div class="template-include-text">
<strong>Production ready</strong>
<span>Responsive design, accessibility, performance optimized</span>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- ============================================================
CUSTOMIZE: LEGAL SECTION (id="legal")
Update legal content for your organization:
- Privacy notice
- Terms & disclaimers
- Compliance frameworks (if applicable)
- Intellectual property / copyright
============================================================ -->
<section class="legal-section" id="legal">
<div class="section-inner">
<span class="section-label reveal">Transparency</span>
<h2 class="section-title reveal reveal-delay-1">Legal & disclaimers</h2>
<div class="legal-notice reveal reveal-delay-2">
<p><strong>Important:</strong> SCQCS is a set of design patterns and principles—not a product, service, or certification. Any claims about security, privacy, or compliance depend entirely on how these patterns are implemented and operated. This documentation describes <em>design intent</em>, not guarantees.</p>
</div>
<div class="legal-stack">
<details class="legal-drawer reveal" data-sound="drawer">
<summary>Privacy notice</summary>
<div class="legal-drawer-content">
<h4>What this site collects</h4>
<p>This website is a static document. It does not collect personal data, use analytics, set cookies, or phone home. If you're viewing this on a hosted server, that server may log standard HTTP request data (IP address, user agent, timestamps). We don't control what hosting providers log.</p>
<h4>What SCQCS implementations collect</h4>
<p>Varies entirely by implementation. SCQCS defines <em>patterns</em> for data minimization—whether any specific system follows them is a matter for that system's documentation and audit.</p>
<h4>Third-party resources</h4>
<p>This page loads Google Fonts. No other third-party resources are requested. If this page is embedded elsewhere, that host's practices apply.</p>
</div>
</details>
<details class="legal-drawer reveal reveal-delay-1" data-sound="drawer">
<summary>Terms & disclaimers</summary>
<div class="legal-drawer-content">
<h4>No warranties</h4>
<p>All materials are provided "as is" without warranties of any kind, express or implied, including but not limited to warranties of merchantability, fitness for a particular purpose, security, or non-infringement.</p>
<h4>Not legal or security advice</h4>
<p>Nothing here constitutes legal advice, security certification, or compliance guidance. Consult qualified professionals for your jurisdiction and use case.</p>
<h4>Implementation responsibility</h4>
<p>Security depends on correct implementation, operational practices, threat modeling, and ongoing maintenance. Patterns described here may be implemented incorrectly, incompletely, or inappropriately.</p>
<h4>Acceptable use</h4>
<p>Do not use SCQCS patterns to build covert surveillance systems, stalk or harass individuals, or claim certifications or audits without published evidence.</p>
</div>
</details>
<details class="legal-drawer reveal reveal-delay-2" data-sound="drawer">
<summary>Cryptography statement</summary>
<div class="legal-drawer-content">
<h4>Crypto agility</h4>
<p>SCQCS patterns are designed for cryptographic agility—the ability to upgrade, replace, or migrate cryptographic primitives over time. This is a design principle, not a feature guarantee.</p>
<h4>Post-quantum considerations</h4>
<p>The framework anticipates migration to post-quantum cryptographic standards as they mature. This does not imply current quantum-resistance or any specific timeline for adoption.</p>
<h4>No certification claims</h4>
<p>SCQCS does not claim compliance with FIPS, Common Criteria, or any other certification standard. Implementations seeking certification must undergo independent evaluation.</p>
<h4>Algorithm selection</h4>
<p>Choice of specific cryptographic algorithms is an implementation decision. SCQCS patterns work with various primitives—selection should be based on current best practices, threat models, and compliance requirements.</p>
</div>
</details>
<details class="legal-drawer reveal reveal-delay-3" data-sound="drawer">
<summary>Intellectual property</summary>
<div class="legal-drawer-content">
<h4>Copyright</h4>
<p>© <span id="year"></span> ERRERLabs. Documentation and website content are provided for informational purposes.</p>
<h4>Trademarks</h4>
<p>SCQCS, SecuraCV, and ERRERLabs are identifiers used by their respective projects. Other trademarks belong to their respective owners.</p>
<h4>Open source</h4>
<p>Where code is released as open source, it is governed by the license in its repository. This documentation does not modify those terms.</p>
<h4>Pattern usage</h4>
<p>The architectural patterns described here may be implemented freely. Attribution is appreciated but not required.</p>
</div>
</details>
<details class="legal-drawer reveal reveal-delay-4" data-sound="drawer">
<summary>Compliance frameworks</summary>
<div class="legal-drawer-content">
<h4>Framework alignment—not certification</h4>
<p>SCQCS patterns are designed with privacy and security regulations in mind. However, <strong>pattern alignment is not compliance</strong>. Actual compliance requires implementation audits, organizational controls, legal review, and often third-party certification. The following describes how SCQCS design principles <strong>support</strong> compliance efforts—not replace them.</p>
<h4>HIPAA (Health Insurance Portability and Accountability Act)</h4>
<p>SCQCS patterns support HIPAA's technical safeguards through: audit controls (append-only logging creates tamper-evident access records), access controls (accountable access with break-glass procedures), and integrity controls (sealed storage protects data at rest). Implementations handling Protected Health Information (PHI) must conduct a formal risk assessment, execute Business Associate Agreements where required, and implement administrative and physical safeguards beyond technical patterns.</p>
<h4>GDPR (General Data Protection Regulation)</h4>
<p>SCQCS's privacy-first design aligns with GDPR principles: data minimization (collect only what's necessary), purpose limitation (design for specific, disclosed purposes), and accountability (audit trails demonstrate compliance). The framework supports rights like access and erasure through its transparent architecture. Implementations must still establish lawful basis for processing, appoint Data Protection Officers where required, and implement data subject request procedures.</p>
<h4>ISO 27001</h4>
<p>SCQCS patterns support several ISO 27001 control objectives: A.12 (Operations security) through comprehensive logging, A.9 (Access control) through accountable access and break-glass procedures, A.10 (Cryptography) through crypto-agile design, and A.18 (Compliance) through built-in audit capabilities. Certification requires a complete Information Security Management System (ISMS), risk assessment methodology, and ongoing management review—far beyond any single framework's patterns.</p>
<h4>SOC 2</h4>
<p>SCQCS design principles map to SOC 2 Trust Services Criteria: Security (access controls, encryption), Availability (designed for resilience), Confidentiality (sealed storage, minimal exposure), and Privacy (data minimization, purpose limitation). SOC 2 attestation requires independent auditor examination of your specific implementation, controls documentation, and evidence of consistent operation over time.</p>
<h4>Compliance is a journey</h4>
<p>These frameworks share common themes that SCQCS addresses by design: know what data you have, control who accesses it, log what happens, and be able to prove it. But compliance is organizational, not just technical. Consult qualified legal and compliance professionals for your specific regulatory obligations.</p>
</div>
</details>
</div>
</div>
</section>
<!-- ============================================================
CUSTOMIZE: FOOTER
Update with your branding, links, and copyright info.
============================================================ -->
<footer>
<div class="footer-inner">
<div class="footer-brand">
<div class="footer-logo">
<div class="footer-logo-icon">
<svg viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg" aria-label="SCQCS">
<rect x="6" y="6" width="28" height="28" stroke="white" stroke-width="2.5" fill="none"/>
</svg>
</div>
<span class="footer-logo-text scintillate"><span>S</span><span>C</span><span>Q</span><span>C</span><span>S</span></span>
</div>
<p class="footer-description">
Schrödinger's Cat Quantum Cryptography & Security. A privacy-first framework for accountable systems.
</p>
</div>
<div class="footer-column">
<h4>Framework</h4>
<ul class="footer-links">
<li><a href="#what" data-sound="click">About</a></li>
<li><a href="#principles" data-sound="click">Principles</a></li>
<li><a href="#architecture" data-sound="click">Architecture</a></li>
<li><a href="#breakglass" data-sound="click">Break-glass</a></li>
</ul>
</div>
<div class="footer-column">
<h4>Ecosystem</h4>
<ul class="footer-links">
<li><a href="https://securacv.netlify.app" target="_blank" rel="noopener noreferrer" data-sound="click">SecuraCV</a></li>
<li><a href="https://github.com/kmay89/SCQCS" target="_blank" rel="noopener noreferrer" data-sound="click">GitHub</a></li>
<li><a href="#template" data-sound="click">Use Template</a></li>
</ul>
</div>
<div class="footer-column">
<h4>Legal</h4>
<ul class="footer-links">
<li><a href="#legal" data-sound="click">Privacy notice</a></li>
<li><a href="#legal" data-sound="click">Terms</a></li>
<li><a href="#legal" data-sound="click">Disclaimers</a></li>
</ul>
</div>
</div>
<div class="footer-bottom">
<p class="footer-copyright">© <span id="footer-year"></span> ERRERLabs. Patterns provided as-is.</p>
<div class="footer-legal-links">
<a href="#legal" data-sound="click">Privacy</a>
<a href="#legal" data-sound="click">Terms</a>
<a href="#legal" data-sound="click">Disclaimers</a>
</div>
</div>
</footer>
<script src="main.js"></script>
</body>
</html>