midas-mcp 5.43.11 → 5.44.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.
@@ -0,0 +1,1177 @@
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>Midas - Everything you vibecode turns to gold</title>
7
+ <link rel="preconnect" href="https://fonts.googleapis.com">
8
+ <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
9
+ <link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600&family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
10
+ <style>
11
+ * {
12
+ margin: 0;
13
+ padding: 0;
14
+ box-sizing: border-box;
15
+ }
16
+
17
+ :root {
18
+ --gold: #d4af37;
19
+ --gold-light: #f0d060;
20
+ --gold-dark: #8b7355;
21
+ --matrix: #22c55e;
22
+ --matrix-dim: #166534;
23
+ --bg: #0a0a0a;
24
+ --bg-card: #111111;
25
+ --text: #e5e5e5;
26
+ --text-dim: #666666;
27
+ --border: #222222;
28
+ --code-bg: #0d0d0d;
29
+ }
30
+
31
+ body {
32
+ font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
33
+ background: var(--bg);
34
+ color: var(--text);
35
+ line-height: 1.6;
36
+ min-height: 100vh;
37
+ overflow-x: hidden;
38
+ }
39
+
40
+ /* Matrix rain background */
41
+ .matrix-bg {
42
+ position: fixed;
43
+ top: 0;
44
+ left: 0;
45
+ width: 100%;
46
+ height: 100%;
47
+ pointer-events: none;
48
+ opacity: 0.08;
49
+ z-index: 0;
50
+ font-family: 'JetBrains Mono', monospace;
51
+ font-size: 14px;
52
+ color: var(--matrix);
53
+ overflow: hidden;
54
+ }
55
+
56
+ .matrix-column {
57
+ position: absolute;
58
+ top: -100%;
59
+ animation: matrix-fall linear infinite;
60
+ white-space: nowrap;
61
+ writing-mode: vertical-rl;
62
+ text-orientation: upright;
63
+ }
64
+
65
+ @keyframes matrix-fall {
66
+ 0% { transform: translateY(-100%); }
67
+ 100% { transform: translateY(200vh); }
68
+ }
69
+
70
+ .container {
71
+ max-width: 900px;
72
+ margin: 0 auto;
73
+ padding: 80px 24px;
74
+ position: relative;
75
+ z-index: 1;
76
+ }
77
+
78
+ /* Logo */
79
+ .logo {
80
+ display: flex;
81
+ align-items: center;
82
+ justify-content: center;
83
+ gap: 16px;
84
+ margin-bottom: 24px;
85
+ }
86
+
87
+ .logo-icon {
88
+ width: 56px;
89
+ height: 56px;
90
+ position: relative;
91
+ }
92
+
93
+ .logo-icon svg {
94
+ width: 100%;
95
+ height: 100%;
96
+ }
97
+
98
+ .logo-text {
99
+ font-family: 'JetBrains Mono', monospace;
100
+ font-size: 42px;
101
+ font-weight: 600;
102
+ letter-spacing: -2px;
103
+ background: linear-gradient(135deg, var(--gold) 0%, var(--gold-light) 50%, var(--gold) 100%);
104
+ -webkit-background-clip: text;
105
+ -webkit-text-fill-color: transparent;
106
+ background-clip: text;
107
+ }
108
+
109
+ /* Hero */
110
+ .hero {
111
+ text-align: center;
112
+ margin-bottom: 100px;
113
+ }
114
+
115
+ .tagline {
116
+ font-family: 'JetBrains Mono', monospace;
117
+ font-size: 15px;
118
+ color: var(--text-dim);
119
+ margin-bottom: 48px;
120
+ letter-spacing: 1px;
121
+ }
122
+
123
+ .tagline .decrypt {
124
+ display: inline-block;
125
+ position: relative;
126
+ }
127
+
128
+ .hero-description {
129
+ font-size: 18px;
130
+ color: var(--text);
131
+ max-width: 540px;
132
+ margin: 0 auto;
133
+ opacity: 0.9;
134
+ }
135
+
136
+ /* Decrypt animation */
137
+ .decrypt-text {
138
+ font-family: 'JetBrains Mono', monospace;
139
+ position: relative;
140
+ }
141
+
142
+ .decrypt-text::after {
143
+ content: attr(data-text);
144
+ position: absolute;
145
+ left: 0;
146
+ top: 0;
147
+ color: var(--matrix);
148
+ animation: decrypt 2s steps(20) forwards;
149
+ overflow: hidden;
150
+ white-space: nowrap;
151
+ }
152
+
153
+ @keyframes decrypt {
154
+ 0% { width: 100%; }
155
+ 100% { width: 0%; }
156
+ }
157
+
158
+ /* Setup Section */
159
+ .setup {
160
+ margin-bottom: 80px;
161
+ }
162
+
163
+ .section-label {
164
+ font-family: 'JetBrains Mono', monospace;
165
+ font-size: 11px;
166
+ text-transform: uppercase;
167
+ letter-spacing: 3px;
168
+ color: var(--gold);
169
+ margin-bottom: 32px;
170
+ text-align: center;
171
+ opacity: 0.8;
172
+ }
173
+
174
+ .setup-grid {
175
+ display: grid;
176
+ grid-template-columns: 1fr;
177
+ gap: 20px;
178
+ }
179
+
180
+ @media (min-width: 700px) {
181
+ .setup-grid {
182
+ grid-template-columns: 1fr 1fr;
183
+ }
184
+ }
185
+
186
+ .setup-card {
187
+ background: var(--bg-card);
188
+ border: 1px solid var(--border);
189
+ border-radius: 8px;
190
+ padding: 28px;
191
+ transition: border-color 0.3s, box-shadow 0.3s;
192
+ }
193
+
194
+ .setup-card:hover {
195
+ border-color: var(--gold);
196
+ box-shadow: 0 0 30px rgba(212, 175, 55, 0.15);
197
+ }
198
+
199
+ .setup-card h3 {
200
+ font-family: 'JetBrains Mono', monospace;
201
+ font-size: 11px;
202
+ text-transform: uppercase;
203
+ letter-spacing: 2px;
204
+ color: var(--text-dim);
205
+ margin-bottom: 20px;
206
+ display: flex;
207
+ align-items: center;
208
+ gap: 10px;
209
+ }
210
+
211
+ .setup-card h3::before {
212
+ content: '';
213
+ width: 8px;
214
+ height: 8px;
215
+ background: #22c55e;
216
+ border-radius: 50%;
217
+ box-shadow: 0 0 6px rgba(34, 197, 94, 0.5);
218
+ }
219
+
220
+ .code-block {
221
+ background: var(--code-bg);
222
+ border: 1px solid #27272a;
223
+ border-radius: 6px;
224
+ padding: 20px;
225
+ overflow-x: auto;
226
+ position: relative;
227
+ }
228
+
229
+ .code-block code {
230
+ font-family: 'JetBrains Mono', monospace;
231
+ font-size: 13px;
232
+ color: #e4e4e7;
233
+ line-height: 1.6;
234
+ white-space: pre;
235
+ display: block;
236
+ }
237
+
238
+ .code-block-json {
239
+ padding: 16px 20px;
240
+ }
241
+
242
+ .code-block-json code {
243
+ font-size: 12px;
244
+ line-height: 1.5;
245
+ }
246
+
247
+ .code-block .comment {
248
+ color: #71717a;
249
+ }
250
+
251
+ .code-block .string {
252
+ color: #fbbf24;
253
+ }
254
+
255
+ .code-block .key {
256
+ color: #e4e4e7;
257
+ }
258
+
259
+ .code-block .punctuation {
260
+ color: #a1a1aa;
261
+ }
262
+
263
+ .terminal-prompt {
264
+ color: #22c55e;
265
+ user-select: none;
266
+ }
267
+
268
+ .command {
269
+ color: #e4e4e7;
270
+ }
271
+
272
+ .copy-btn {
273
+ position: absolute;
274
+ top: 12px;
275
+ right: 12px;
276
+ background: #27272a;
277
+ border: 1px solid #3f3f46;
278
+ color: #a1a1aa;
279
+ padding: 6px 12px;
280
+ border-radius: 4px;
281
+ font-family: 'JetBrains Mono', monospace;
282
+ font-size: 10px;
283
+ letter-spacing: 1px;
284
+ text-transform: uppercase;
285
+ cursor: pointer;
286
+ transition: all 0.2s;
287
+ }
288
+
289
+ .copy-btn:hover {
290
+ border-color: #fbbf24;
291
+ color: #fbbf24;
292
+ }
293
+
294
+ .setup-note {
295
+ font-family: 'JetBrains Mono', monospace;
296
+ font-size: 11px;
297
+ color: var(--text-dim);
298
+ margin-top: 16px;
299
+ opacity: 0.7;
300
+ }
301
+
302
+ /* Features */
303
+ .features {
304
+ display: grid;
305
+ grid-template-columns: repeat(3, 1fr);
306
+ gap: 1px;
307
+ background: var(--border);
308
+ border: 1px solid var(--border);
309
+ border-radius: 8px;
310
+ overflow: hidden;
311
+ margin-bottom: 80px;
312
+ }
313
+
314
+ @media (max-width: 700px) {
315
+ .features {
316
+ grid-template-columns: 1fr;
317
+ }
318
+ }
319
+
320
+ .feature {
321
+ background: var(--bg-card);
322
+ padding: 32px 24px;
323
+ text-align: center;
324
+ }
325
+
326
+ .feature-number {
327
+ font-family: 'JetBrains Mono', monospace;
328
+ font-size: 11px;
329
+ color: var(--gold);
330
+ margin-bottom: 12px;
331
+ letter-spacing: 2px;
332
+ }
333
+
334
+ .feature h4 {
335
+ font-size: 15px;
336
+ font-weight: 600;
337
+ margin-bottom: 8px;
338
+ color: var(--text);
339
+ }
340
+
341
+ .feature p {
342
+ font-family: 'JetBrains Mono', monospace;
343
+ font-size: 11px;
344
+ color: var(--text-dim);
345
+ line-height: 1.7;
346
+ }
347
+
348
+ /* CTA */
349
+ .cta {
350
+ text-align: center;
351
+ }
352
+
353
+ .cta-buttons {
354
+ display: flex;
355
+ gap: 16px;
356
+ justify-content: center;
357
+ flex-wrap: wrap;
358
+ }
359
+
360
+ .btn {
361
+ display: inline-flex;
362
+ align-items: center;
363
+ gap: 10px;
364
+ padding: 14px 28px;
365
+ border-radius: 6px;
366
+ font-family: 'JetBrains Mono', monospace;
367
+ font-size: 12px;
368
+ font-weight: 500;
369
+ letter-spacing: 1px;
370
+ text-transform: uppercase;
371
+ text-decoration: none;
372
+ transition: all 0.3s;
373
+ border: 1px solid transparent;
374
+ }
375
+
376
+ .btn-primary {
377
+ background: linear-gradient(135deg, var(--gold) 0%, var(--gold-dark) 100%);
378
+ color: #000;
379
+ }
380
+
381
+ .btn-primary:hover {
382
+ box-shadow: 0 0 30px rgba(212, 175, 55, 0.3);
383
+ transform: translateY(-2px);
384
+ }
385
+
386
+ .btn-secondary {
387
+ background: transparent;
388
+ color: var(--text);
389
+ border-color: var(--border);
390
+ }
391
+
392
+ .btn-secondary:hover {
393
+ border-color: var(--gold);
394
+ color: var(--gold);
395
+ }
396
+
397
+ /* Footer */
398
+ footer {
399
+ text-align: center;
400
+ padding: 60px 24px;
401
+ font-family: 'JetBrains Mono', monospace;
402
+ font-size: 11px;
403
+ color: var(--text-dim);
404
+ letter-spacing: 1px;
405
+ }
406
+
407
+ footer a {
408
+ color: var(--text-dim);
409
+ text-decoration: none;
410
+ transition: color 0.2s;
411
+ }
412
+
413
+ footer a:hover {
414
+ color: var(--gold);
415
+ }
416
+
417
+ /* Glow effect on scroll */
418
+ .glow-line {
419
+ position: fixed;
420
+ top: 0;
421
+ left: 0;
422
+ right: 0;
423
+ height: 2px;
424
+ background: linear-gradient(90deg, transparent, var(--gold), transparent);
425
+ opacity: 0.8;
426
+ z-index: 100;
427
+ }
428
+
429
+ /* What It Does Section */
430
+ .what-it-does {
431
+ margin-bottom: 80px;
432
+ }
433
+
434
+ .what-grid {
435
+ display: grid;
436
+ grid-template-columns: repeat(2, 1fr);
437
+ gap: 20px;
438
+ }
439
+
440
+ @media (max-width: 700px) {
441
+ .what-grid {
442
+ grid-template-columns: 1fr;
443
+ }
444
+ }
445
+
446
+ .what-item {
447
+ background: var(--bg-card);
448
+ border: 1px solid var(--border);
449
+ border-radius: 8px;
450
+ padding: 24px;
451
+ }
452
+
453
+ .what-icon {
454
+ font-family: 'JetBrains Mono', monospace;
455
+ font-size: 12px;
456
+ color: var(--gold);
457
+ display: block;
458
+ margin-bottom: 12px;
459
+ }
460
+
461
+ .what-item p {
462
+ font-size: 14px;
463
+ color: var(--text-dim);
464
+ line-height: 1.6;
465
+ }
466
+
467
+ /* Lifecycle Section */
468
+ .lifecycle {
469
+ margin-bottom: 80px;
470
+ }
471
+
472
+ .lifecycle-phases {
473
+ display: flex;
474
+ align-items: center;
475
+ justify-content: center;
476
+ gap: 16px;
477
+ flex-wrap: wrap;
478
+ }
479
+
480
+ .phase {
481
+ background: var(--bg-card);
482
+ border: 1px solid var(--border);
483
+ border-radius: 8px;
484
+ padding: 20px 24px;
485
+ text-align: center;
486
+ min-width: 160px;
487
+ }
488
+
489
+ .phase-name {
490
+ font-family: 'JetBrains Mono', monospace;
491
+ font-size: 13px;
492
+ font-weight: 600;
493
+ color: var(--gold);
494
+ display: block;
495
+ margin-bottom: 8px;
496
+ text-transform: uppercase;
497
+ letter-spacing: 1px;
498
+ }
499
+
500
+ .phase-steps {
501
+ font-size: 10px;
502
+ color: var(--text-dim);
503
+ line-height: 1.6;
504
+ }
505
+
506
+ .phase-arrow {
507
+ width: 24px;
508
+ height: 2px;
509
+ background: var(--border);
510
+ position: relative;
511
+ }
512
+
513
+ .phase-arrow::after {
514
+ content: '';
515
+ position: absolute;
516
+ right: 0;
517
+ top: -4px;
518
+ border: 5px solid transparent;
519
+ border-left-color: var(--border);
520
+ }
521
+
522
+ @media (max-width: 900px) {
523
+ .phase-arrow {
524
+ display: none;
525
+ }
526
+ .lifecycle-phases {
527
+ flex-direction: column;
528
+ }
529
+ .phase {
530
+ width: 100%;
531
+ }
532
+ }
533
+
534
+ /* Principles Section */
535
+ .principles {
536
+ margin-bottom: 80px;
537
+ }
538
+
539
+ .principles-grid {
540
+ display: grid;
541
+ grid-template-columns: repeat(3, 1fr);
542
+ gap: 20px;
543
+ }
544
+
545
+ @media (max-width: 700px) {
546
+ .principles-grid {
547
+ grid-template-columns: 1fr;
548
+ }
549
+ }
550
+
551
+ .principle {
552
+ background: var(--bg-card);
553
+ border: 1px solid var(--border);
554
+ border-radius: 8px;
555
+ padding: 28px;
556
+ }
557
+
558
+ .principle h4 {
559
+ font-family: 'JetBrains Mono', monospace;
560
+ font-size: 13px;
561
+ font-weight: 600;
562
+ margin-bottom: 12px;
563
+ color: var(--gold);
564
+ }
565
+
566
+ .principle-desc {
567
+ font-size: 14px;
568
+ color: var(--text-dim);
569
+ margin-bottom: 16px;
570
+ line-height: 1.6;
571
+ }
572
+
573
+ .principle-formula {
574
+ font-family: 'JetBrains Mono', monospace;
575
+ font-size: 11px;
576
+ color: var(--matrix);
577
+ background: var(--code-bg);
578
+ padding: 8px 12px;
579
+ border-radius: 4px;
580
+ display: block;
581
+ }
582
+
583
+ /* Ingredients Section */
584
+ .ingredients {
585
+ margin-bottom: 80px;
586
+ }
587
+
588
+ .ingredients-subtitle {
589
+ text-align: center;
590
+ font-size: 14px;
591
+ color: var(--text-dim);
592
+ margin-bottom: 32px;
593
+ }
594
+
595
+ .ingredients-grid {
596
+ display: grid;
597
+ grid-template-columns: repeat(4, 1fr);
598
+ gap: 16px;
599
+ }
600
+
601
+ @media (max-width: 800px) {
602
+ .ingredients-grid {
603
+ grid-template-columns: repeat(2, 1fr);
604
+ }
605
+ }
606
+
607
+ @media (max-width: 500px) {
608
+ .ingredients-grid {
609
+ grid-template-columns: 1fr;
610
+ }
611
+ }
612
+
613
+ .ingredient-level {
614
+ background: var(--bg-card);
615
+ border: 1px solid var(--border);
616
+ border-radius: 8px;
617
+ padding: 20px;
618
+ text-align: center;
619
+ }
620
+
621
+ .level-badge {
622
+ font-family: 'JetBrains Mono', monospace;
623
+ font-size: 18px;
624
+ font-weight: 600;
625
+ display: block;
626
+ margin-bottom: 8px;
627
+ }
628
+
629
+ .level-functional { color: #3b82f6; }
630
+ .level-integrated { color: #8b5cf6; }
631
+ .level-protected { color: #f59e0b; }
632
+ .level-production { color: #22c55e; }
633
+
634
+ .level-name {
635
+ font-size: 13px;
636
+ font-weight: 600;
637
+ color: var(--text);
638
+ display: block;
639
+ margin-bottom: 8px;
640
+ }
641
+
642
+ .level-desc {
643
+ font-size: 11px;
644
+ color: var(--text-dim);
645
+ }
646
+
647
+ /* Tools List Section */
648
+ .tools-list {
649
+ margin-bottom: 80px;
650
+ }
651
+
652
+ .tools-grid {
653
+ display: grid;
654
+ grid-template-columns: repeat(3, 1fr);
655
+ gap: 16px;
656
+ }
657
+
658
+ @media (max-width: 800px) {
659
+ .tools-grid {
660
+ grid-template-columns: repeat(2, 1fr);
661
+ }
662
+ }
663
+
664
+ @media (max-width: 500px) {
665
+ .tools-grid {
666
+ grid-template-columns: 1fr;
667
+ }
668
+ }
669
+
670
+ .tool-category {
671
+ background: var(--bg-card);
672
+ border: 1px solid var(--border);
673
+ border-radius: 8px;
674
+ padding: 20px;
675
+ }
676
+
677
+ .tool-category h4 {
678
+ font-family: 'JetBrains Mono', monospace;
679
+ font-size: 11px;
680
+ text-transform: uppercase;
681
+ letter-spacing: 1px;
682
+ color: var(--gold);
683
+ margin-bottom: 12px;
684
+ }
685
+
686
+ .tool-names {
687
+ font-size: 11px;
688
+ color: var(--text-dim);
689
+ line-height: 1.8;
690
+ font-family: 'JetBrains Mono', monospace;
691
+ }
692
+
693
+ /* TUI Section */
694
+ .tui-section {
695
+ margin-bottom: 80px;
696
+ }
697
+
698
+ .tui-content {
699
+ background: var(--bg-card);
700
+ border: 1px solid var(--border);
701
+ border-radius: 8px;
702
+ padding: 32px;
703
+ }
704
+
705
+ .tui-preview {
706
+ text-align: center;
707
+ margin-bottom: 24px;
708
+ padding-bottom: 24px;
709
+ border-bottom: 1px solid var(--border);
710
+ }
711
+
712
+ .tui-command {
713
+ font-family: 'JetBrains Mono', monospace;
714
+ font-size: 18px;
715
+ color: var(--matrix);
716
+ display: block;
717
+ margin-bottom: 8px;
718
+ }
719
+
720
+ .tui-desc {
721
+ font-size: 13px;
722
+ color: var(--text-dim);
723
+ }
724
+
725
+ .tui-features {
726
+ display: grid;
727
+ grid-template-columns: repeat(4, 1fr);
728
+ gap: 16px;
729
+ }
730
+
731
+ @media (max-width: 700px) {
732
+ .tui-features {
733
+ grid-template-columns: repeat(2, 1fr);
734
+ }
735
+ }
736
+
737
+ .tui-feature {
738
+ text-align: center;
739
+ }
740
+
741
+ .tui-key {
742
+ font-family: 'JetBrains Mono', monospace;
743
+ font-size: 14px;
744
+ color: var(--gold);
745
+ display: block;
746
+ margin-bottom: 4px;
747
+ }
748
+
749
+ .tui-feature span:last-child {
750
+ font-size: 12px;
751
+ color: var(--text-dim);
752
+ }
753
+
754
+ /* How It Works Section */
755
+ .how-works {
756
+ margin-bottom: 80px;
757
+ }
758
+
759
+ .how-steps {
760
+ display: flex;
761
+ flex-direction: column;
762
+ gap: 20px;
763
+ }
764
+
765
+ .how-step {
766
+ display: flex;
767
+ align-items: flex-start;
768
+ gap: 20px;
769
+ background: var(--bg-card);
770
+ border: 1px solid var(--border);
771
+ border-radius: 8px;
772
+ padding: 24px;
773
+ }
774
+
775
+ .how-number {
776
+ font-family: 'JetBrains Mono', monospace;
777
+ font-size: 24px;
778
+ font-weight: 600;
779
+ color: var(--gold);
780
+ min-width: 40px;
781
+ }
782
+
783
+ .how-text h4 {
784
+ font-size: 15px;
785
+ font-weight: 600;
786
+ color: var(--text);
787
+ margin-bottom: 4px;
788
+ }
789
+
790
+ .how-text p {
791
+ font-size: 14px;
792
+ color: var(--text-dim);
793
+ }
794
+
795
+ /* CTA spacing adjustment */
796
+ .cta {
797
+ padding-top: 40px;
798
+ border-top: 1px solid var(--border);
799
+ }
800
+ </style>
801
+ </head>
802
+ <body>
803
+ <div class="glow-line"></div>
804
+
805
+ <!-- Matrix background -->
806
+ <div class="matrix-bg" id="matrix"></div>
807
+
808
+ <div class="container">
809
+ <!-- Hero -->
810
+ <section class="hero">
811
+ <div class="logo">
812
+ <div class="logo-icon">
813
+ <svg viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg">
814
+ <path d="M50 5L90 25V75L50 95L10 75V25L50 5Z" stroke="url(#gold-gradient)" stroke-width="2" fill="none"/>
815
+ <path d="M50 20L75 35V65L50 80L25 65V35L50 20Z" stroke="url(#gold-gradient)" stroke-width="1.5" fill="none" opacity="0.6"/>
816
+ <circle cx="50" cy="50" r="8" fill="url(#gold-gradient)"/>
817
+ <defs>
818
+ <linearGradient id="gold-gradient" x1="0%" y1="0%" x2="100%" y2="100%">
819
+ <stop offset="0%" stop-color="#c9a227"/>
820
+ <stop offset="50%" stop-color="#e8d48b"/>
821
+ <stop offset="100%" stop-color="#c9a227"/>
822
+ </linearGradient>
823
+ </defs>
824
+ </svg>
825
+ </div>
826
+ <span class="logo-text">midas</span>
827
+ </div>
828
+
829
+ <p class="tagline">
830
+ <span class="decrypt-text" data-text="/////////////////">everything you vibecode turns to gold</span>
831
+ </p>
832
+
833
+ <p class="hero-description">
834
+ An AI coach that guides you through planning, building, and shipping production-ready code.
835
+ </p>
836
+ </section>
837
+
838
+ <!-- Setup -->
839
+ <section class="setup">
840
+ <p class="section-label">Initialize</p>
841
+
842
+ <div class="setup-grid">
843
+ <!-- Terminal Option -->
844
+ <div class="setup-card">
845
+ <h3>Run Instantly</h3>
846
+ <div class="code-block">
847
+ <button class="copy-btn" onclick="copyCode(this, 'npx --yes midas-mcp@latest')">Copy</button>
848
+ <code><span class="terminal-prompt">$</span> <span class="command">npx --yes midas-mcp@latest</span></code>
849
+ </div>
850
+ <p class="setup-note">No install required</p>
851
+ </div>
852
+
853
+ <!-- Cursor Option -->
854
+ <div class="setup-card">
855
+ <h3>Add to Cursor</h3>
856
+ <div class="code-block code-block-json">
857
+ <button class="copy-btn" onclick="copyJson()">Copy</button>
858
+ <code><span class="comment">// ~/.cursor/mcp.json</span>
859
+ <span class="punctuation">{</span>
860
+ <span class="key">"mcpServers"</span><span class="punctuation">:</span> <span class="punctuation">{</span>
861
+ <span class="key">"midas"</span><span class="punctuation">:</span> <span class="punctuation">{</span>
862
+ <span class="key">"command"</span><span class="punctuation">:</span> <span class="string">"npx"</span><span class="punctuation">,</span>
863
+ <span class="key">"args"</span><span class="punctuation">:</span> <span class="punctuation">[</span><span class="string">"midas-mcp@latest"</span><span class="punctuation">,</span> <span class="string">"server"</span><span class="punctuation">]</span>
864
+ <span class="punctuation">}</span>
865
+ <span class="punctuation">}</span>
866
+ <span class="punctuation">}</span></code>
867
+ </div>
868
+ <p class="setup-note">Always uses latest version</p>
869
+ </div>
870
+ </div>
871
+ </section>
872
+
873
+ <!-- Features -->
874
+ <section class="features">
875
+ <div class="feature">
876
+ <p class="feature-number">01</p>
877
+ <h4>Plan First</h4>
878
+ <p>Brainlift / PRD / Gameplan</p>
879
+ </div>
880
+ <div class="feature">
881
+ <p class="feature-number">02</p>
882
+ <h4>7-Step Build</h4>
883
+ <p>Rules / Index / Read / Research / Implement / Test / Debug</p>
884
+ </div>
885
+ <div class="feature">
886
+ <p class="feature-number">03</p>
887
+ <h4>Ship Ready</h4>
888
+ <p>12 ingredients audit</p>
889
+ </div>
890
+ </section>
891
+
892
+ <!-- What Midas Does -->
893
+ <section class="what-it-does">
894
+ <p class="section-label">What Midas Does</p>
895
+ <div class="what-grid">
896
+ <div class="what-item">
897
+ <span class="what-icon">midas_analyze</span>
898
+ <p>AI reads your codebase, docs, git history, and determines exactly where you are in the development lifecycle</p>
899
+ </div>
900
+ <div class="what-item">
901
+ <span class="what-icon">midas_suggest_prompt</span>
902
+ <p>Generates the exact next prompt you should paste into Cursor based on your current phase and context</p>
903
+ </div>
904
+ <div class="what-item">
905
+ <span class="what-icon">midas_verify</span>
906
+ <p>Runs build, tests, and lint. Auto-advances phase when gates pass. Blocks advancement when they fail.</p>
907
+ </div>
908
+ <div class="what-item">
909
+ <span class="what-icon">midas_journal</span>
910
+ <p>Saves full conversations to a project journal. AI loads context from previous sessions automatically.</p>
911
+ </div>
912
+ </div>
913
+ </section>
914
+
915
+ <!-- Full Lifecycle -->
916
+ <section class="lifecycle">
917
+ <p class="section-label">The Development Lifecycle</p>
918
+ <div class="lifecycle-phases">
919
+ <div class="phase">
920
+ <span class="phase-name">Plan</span>
921
+ <span class="phase-steps">IDEA / RESEARCH / BRAINLIFT / PRD / GAMEPLAN</span>
922
+ </div>
923
+ <div class="phase-arrow"></div>
924
+ <div class="phase">
925
+ <span class="phase-name">Build</span>
926
+ <span class="phase-steps">RULES / INDEX / READ / RESEARCH / IMPLEMENT / TEST / DEBUG</span>
927
+ </div>
928
+ <div class="phase-arrow"></div>
929
+ <div class="phase">
930
+ <span class="phase-name">Ship</span>
931
+ <span class="phase-steps">REVIEW / DEPLOY / MONITOR</span>
932
+ </div>
933
+ <div class="phase-arrow"></div>
934
+ <div class="phase">
935
+ <span class="phase-name">Grow</span>
936
+ <span class="phase-steps">Graduation checklist for getting users</span>
937
+ </div>
938
+ </div>
939
+ </section>
940
+
941
+ <!-- When Stuck -->
942
+ <section class="principles">
943
+ <p class="section-label">When Things Go Wrong</p>
944
+ <div class="principles-grid">
945
+ <div class="principle">
946
+ <h4>midas_oneshot</h4>
947
+ <p class="principle-desc">Retry after an error. Constructs prompt with original, error, and "avoid this" context.</p>
948
+ <code class="principle-formula">Original + Error + Avoid = Works</code>
949
+ </div>
950
+ <div class="principle">
951
+ <h4>midas_tornado</h4>
952
+ <p class="principle-desc">Stuck on same error 3x? Triggers the debugging cycle that actually works.</p>
953
+ <code class="principle-formula">Research → Logs → Tests → Repeat</code>
954
+ </div>
955
+ <div class="principle">
956
+ <h4>midas_horizon</h4>
957
+ <p class="principle-desc">AI output doesn't fit? Expand horizontal context: integrations, patterns, constraints.</p>
958
+ <code class="principle-formula">Wrong output? Widen context.</code>
959
+ </div>
960
+ </div>
961
+ </section>
962
+
963
+ <!-- 12 Ingredients -->
964
+ <section class="ingredients">
965
+ <p class="section-label">midas_audit: 12 Ingredients</p>
966
+ <p class="ingredients-subtitle">Scores your project against 12 production readiness ingredients</p>
967
+ <div class="ingredients-grid">
968
+ <div class="ingredient-level">
969
+ <span class="level-badge level-functional">1-4</span>
970
+ <span class="level-name">Functional</span>
971
+ <span class="level-desc">Frontend / Backend / Database / Auth</span>
972
+ </div>
973
+ <div class="ingredient-level">
974
+ <span class="level-badge level-integrated">5-7</span>
975
+ <span class="level-name">Integrated</span>
976
+ <span class="level-desc">APIs / State / Design</span>
977
+ </div>
978
+ <div class="ingredient-level">
979
+ <span class="level-badge level-protected">8-10</span>
980
+ <span class="level-name">Protected</span>
981
+ <span class="level-desc">Testing / Security / Error Handling</span>
982
+ </div>
983
+ <div class="ingredient-level">
984
+ <span class="level-badge level-production">11-12</span>
985
+ <span class="level-name">Production</span>
986
+ <span class="level-desc">Version Control / Deployment</span>
987
+ </div>
988
+ </div>
989
+ </section>
990
+
991
+ <!-- Tools Available -->
992
+ <section class="tools-list">
993
+ <p class="section-label">37+ MCP Tools</p>
994
+ <div class="tools-grid">
995
+ <div class="tool-category">
996
+ <h4>Phase Management</h4>
997
+ <p class="tool-names">midas_analyze, midas_suggest_prompt, midas_advance_phase, midas_set_phase, midas_get_phase</p>
998
+ </div>
999
+ <div class="tool-category">
1000
+ <h4>Verification</h4>
1001
+ <p class="tool-names">midas_verify, midas_validate_gates, midas_completeness, midas_preflight</p>
1002
+ </div>
1003
+ <div class="tool-category">
1004
+ <h4>Debugging</h4>
1005
+ <p class="tool-names">midas_oneshot, midas_tornado, midas_horizon, midas_record_error, midas_unstuck</p>
1006
+ </div>
1007
+ <div class="tool-category">
1008
+ <h4>Code Quality</h4>
1009
+ <p class="tool-names">midas_audit, midas_complexity, midas_simplify, midas_vuln_scan, midas_scan_debt</p>
1010
+ </div>
1011
+ <div class="tool-category">
1012
+ <h4>Documentation</h4>
1013
+ <p class="tool-names">midas_journal_save, midas_journal_list, midas_journal_search, midas_check_docs</p>
1014
+ </div>
1015
+ <div class="tool-category">
1016
+ <h4>Project Tracking</h4>
1017
+ <p class="tool-names">midas_gameplan_analyze, midas_gameplan_progress, midas_scope_creep</p>
1018
+ </div>
1019
+ </div>
1020
+ </section>
1021
+
1022
+ <!-- TUI Mode -->
1023
+ <section class="tui-section">
1024
+ <p class="section-label">Interactive TUI</p>
1025
+ <div class="tui-content">
1026
+ <div class="tui-preview">
1027
+ <code class="tui-command">npx midas-mcp</code>
1028
+ <p class="tui-desc">Launch the terminal UI for visual coaching</p>
1029
+ </div>
1030
+ <div class="tui-features">
1031
+ <div class="tui-feature">
1032
+ <span class="tui-key">[c]</span>
1033
+ <span>Copy suggested prompt</span>
1034
+ </div>
1035
+ <div class="tui-feature">
1036
+ <span class="tui-key">[r]</span>
1037
+ <span>Re-analyze project</span>
1038
+ </div>
1039
+ <div class="tui-feature">
1040
+ <span class="tui-key">[v]</span>
1041
+ <span>Run verification gates</span>
1042
+ </div>
1043
+ <div class="tui-feature">
1044
+ <span class="tui-key">[y]</span>
1045
+ <span>Preflight ship checks</span>
1046
+ </div>
1047
+ </div>
1048
+ </div>
1049
+ </section>
1050
+
1051
+ <!-- How It Works -->
1052
+ <section class="how-works">
1053
+ <p class="section-label">How It Works</p>
1054
+ <div class="how-steps">
1055
+ <div class="how-step">
1056
+ <span class="how-number">1</span>
1057
+ <div class="how-text">
1058
+ <h4>Cursor loads Midas as MCP server</h4>
1059
+ <p>37 tools become available to the AI automatically</p>
1060
+ </div>
1061
+ </div>
1062
+ <div class="how-step">
1063
+ <span class="how-number">2</span>
1064
+ <div class="how-text">
1065
+ <h4>AI calls midas_analyze on your project</h4>
1066
+ <p>Reads codebase, docs, git history, determines current phase</p>
1067
+ </div>
1068
+ </div>
1069
+ <div class="how-step">
1070
+ <span class="how-number">3</span>
1071
+ <div class="how-text">
1072
+ <h4>Midas returns phase-aware guidance</h4>
1073
+ <p>What's done, what's next, exact prompt to paste</p>
1074
+ </div>
1075
+ </div>
1076
+ <div class="how-step">
1077
+ <span class="how-number">4</span>
1078
+ <div class="how-text">
1079
+ <h4>Auto-advances when gates pass</h4>
1080
+ <p>Build/test/lint must pass before moving forward</p>
1081
+ </div>
1082
+ </div>
1083
+ </div>
1084
+ </section>
1085
+
1086
+ <!-- CTA -->
1087
+ <section class="cta">
1088
+ <div class="cta-buttons">
1089
+ <a href="https://www.npmjs.com/package/midas-mcp" class="btn btn-primary">
1090
+ View on npm
1091
+ </a>
1092
+ <a href="https://github.com/christiancattaneo/midas-mcp" class="btn btn-secondary">
1093
+ GitHub
1094
+ </a>
1095
+ </div>
1096
+ </section>
1097
+ </div>
1098
+
1099
+ <footer>
1100
+ <p>MIT License</p>
1101
+ </footer>
1102
+
1103
+ <script>
1104
+ // Matrix rain effect
1105
+ function createMatrixRain() {
1106
+ const matrix = document.getElementById('matrix');
1107
+ const chars = 'MIDAS01アイウエオカキクケコ金黄';
1108
+ const columns = Math.floor(window.innerWidth / 20);
1109
+
1110
+ for (let i = 0; i < columns; i++) {
1111
+ const column = document.createElement('div');
1112
+ column.className = 'matrix-column';
1113
+ column.style.left = (i * 20) + 'px';
1114
+ column.style.animationDuration = (Math.random() * 4 + 4) + 's';
1115
+ column.style.animationDelay = (Math.random() * 4) + 's';
1116
+
1117
+ let text = '';
1118
+ for (let j = 0; j < 50; j++) {
1119
+ text += chars[Math.floor(Math.random() * chars.length)] + '\n';
1120
+ }
1121
+ column.textContent = text;
1122
+ matrix.appendChild(column);
1123
+ }
1124
+ }
1125
+
1126
+ createMatrixRain();
1127
+
1128
+ // Decrypt animation
1129
+ function decryptText() {
1130
+ const el = document.querySelector('.decrypt-text');
1131
+ const finalText = el.textContent;
1132
+ const chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789@#$%&';
1133
+ let iterations = 0;
1134
+
1135
+ const interval = setInterval(() => {
1136
+ el.textContent = finalText
1137
+ .split('')
1138
+ .map((char, i) => {
1139
+ if (i < iterations) return finalText[i];
1140
+ if (char === ' ') return ' ';
1141
+ return chars[Math.floor(Math.random() * chars.length)];
1142
+ })
1143
+ .join('');
1144
+
1145
+ iterations += 1/3;
1146
+ if (iterations >= finalText.length) clearInterval(interval);
1147
+ }, 30);
1148
+ }
1149
+
1150
+ setTimeout(decryptText, 500);
1151
+
1152
+ // Copy functions
1153
+ function copyCode(btn, text) {
1154
+ navigator.clipboard.writeText(text).then(() => {
1155
+ btn.textContent = 'Copied';
1156
+ setTimeout(() => btn.textContent = 'Copy', 2000);
1157
+ });
1158
+ }
1159
+
1160
+ function copyJson() {
1161
+ const json = `{
1162
+ "mcpServers": {
1163
+ "midas": {
1164
+ "command": "npx",
1165
+ "args": ["midas-mcp@latest", "server"]
1166
+ }
1167
+ }
1168
+ }`;
1169
+ navigator.clipboard.writeText(json).then(() => {
1170
+ const btn = document.querySelector('.setup-card:last-child .copy-btn');
1171
+ btn.textContent = 'Copied';
1172
+ setTimeout(() => btn.textContent = 'Copy', 2000);
1173
+ });
1174
+ }
1175
+ </script>
1176
+ </body>
1177
+ </html>