Hugging Face's logo

Spaces:
williampeoch
/
underradar
Running

App Files Community
williampeoch commited on
Commit
3a7959a
·
verified ·
1 Parent(s): 87f73ec

Améliore cette page en mettant des vrais noms de business Saas existant pas très connu :<!DOCTYPE html> <html lang="fr"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Rapport confidentiel – Opportunités détectées</title> <script src="https://cdn.tailwindcss.com"></script> <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Special+Elite&family=Courier+Prime&display=swap"> <style> body { font-family: 'Courier Prime', monospace; background-color: #f0e6d2; background-image: url('data:image/svg+xml;utf8,<svg width="100" height="100" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"><path d="M0 0 L100 0 L100 100 L0 100 Z" fill="none" stroke="%23d4c9a8" stroke-width="1" stroke-dasharray="5,5"/></svg>'); color: #333; } .confidential-stamp { position: absolute; top: 50px; right: 50px; font-family: 'Special Elite', cursive; font-size: 3rem; color: #d00; transform: rotate(-15deg); opacity: 0.7; text-shadow: 2px 2px 4px rgba(0,0,0,0.3); z-index: 10; } .document-title { font-family: 'Special Elite', cursive; position: relative; text-shadow: 2px 2px 4px rgba(0,0,0,0.1); } .document-title::before, .document-title::after { content: ""; position: absolute; height: 2px; background: linear-gradient(90deg, transparent, #333, transparent); width: 100%; left: 0; } .document-title::before { top: 0; } .document-title::after { bottom: 0; } .classified-card { background: #f8f4e9; border: 1px solid #d4c9a8; box-shadow: 0 4px 8px rgba(0,0,0,0.1), inset 0 0 20px rgba(0,0,0,0.05), 0 0 10px rgba(0,0,0,0.1); position: relative; overflow: hidden; transition: all 0.3s ease; } .classified-card:hover { transform: translateY(-5px); box-shadow: 0 6px 12px rgba(0,0,0,0.15), inset 0 0 20px rgba(0,0,0,0.08), 0 0 15px rgba(0,0,0,0.15); } .classified-card::before { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: linear-gradient(135deg, rgba(255,255,255,0.1) 0%, rgba(255,255,255,0) 20%, rgba(255,255,255,0) 80%, rgba(255,255,255,0.1) 100%); pointer-events: none; } .classified-card::after { content: ""; position: absolute; top: 10px; right: 10px; width: 30px; height: 30px; background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23d00"><path d="M12,2C6.48,2,2,6.48,2,12s4.48,10,10,10s10-4.48,10-10S17.52,2,12,2z M12,20c-4.41,0-8-3.59-8-8s3.59-8,8-8s8,3.59,8,8 S16.41,20,12,20z"/><path d="M12,7c-0.55,0-1,0.45-1,1v5c0,0.55,0.45,1,1,1s1-0.45,1-1V8C13,7.45,12.55,7,12,7z"/><path d="M11,16h2v2h-2V16z"/></svg>') no-repeat center; opacity: 0.3; } .redacted { background-color: #333; color: transparent; position: relative; display: inline-block; letter-spacing: 2px; } .redacted::after { content: "████"; position: absolute; left: 0; top: 0; color: #333; } .stamp-button { font-family: 'Special Elite', cursive; transition: all 0.3s ease; position: relative; overflow: hidden; } .stamp-button:hover { transform: scale(1.05); box-shadow: 0 0 15px rgba(208, 0, 0, 0.5); } .stamp-button::before { content: ""; position: absolute; top: -10px; left: -10px; right: -10px; bottom: -10px; border: 2px dashed rgba(208, 0, 0, 0.5); border-radius: 4px; opacity: 0; transition: opacity 0.3s ease; } .stamp-button:hover::before { opacity: 1; } .corner-fold { position: absolute; top: 0; right: 0; width: 0; height: 0; border-style: solid; border-width: 0 40px 40px 0; border-color: transparent #d4c9a8 transparent transparent; } .corner-fold::after { content: ""; position: absolute; top: 0; right: 0; width: 0; height: 0; border-style: solid; border-width: 0 38px 38px 0; border-color: transparent #f0e6d2 transparent transparent; } .handwritten-note { font-family: 'Comic Sans MS', cursive; transform: rotate(-2deg); background: #fff8dc; border: 1px dashed #d4c9a8; box-shadow: 2px 2px 4px rgba(0,0,0,0.1); } @media (max-width: 768px) { .confidential-stamp { font-size: 2rem; top: 20px; right: 20px; } } </style> </head> <body class="min-h-screen px-4 sm:px-6 lg:px-8"> <!-- SaaS Header --> <header class="bg-black text-white py-4 shadow-lg"> <div class="max-w-6xl mx-auto px-4 flex justify-between items-center"> <div class="flex items-center space-x-3"> <div class="w-8 h-8 bg-red-600 rounded-full flex items-center justify-center"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white" width="16" height="16"> <path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z"/> <path d="M12 8c-2.21 0-4 1.79-4 4s1.79 4 4 4 4-1.79 4-4-1.79-4-4-4zm0 6c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2z"/> </svg> </div> <h1 class="text-xl font-bold font-mono tracking-tight">UNDERRADAR</h1> </div> <nav class="hidden md:flex space-x-6"> <a href="#" class="hover:text-red-400 transition-colors">Dashboard</a> <a href="#" class="hover:text-red-400 transition-colors">Rapports</a> <a href="#" class="hover:text-red-400 transition-colors">IA Clone</a> <a href="#" class="hover:text-red-400 transition-colors">Agents</a> </nav> <button class="bg-red-600 hover:bg-red-700 px-4 py-2 rounded-md text-sm font-bold transition-colors"> Accès Agent </button> </div> </header> <div class="max-w-6xl mx-auto relative py-12"> <!-- Confidential Stamp --> <div class="confidential-stamp"> CONFIDENTIEL </div> <!-- Document Header --> <div class="text-center mb-12 relative"> <div class="inline-block px-8 py-4 bg-white bg-opacity-70 border border-dashed border-gray-400 rounded-lg mb-6"> <h1 class="document-title text-3xl sm:text-4xl md:text-5xl font-bold inline-block px-8 py-2"> RAPPORT CONFIDENTIEL<br>OPPORTUNITÉS DÉTECTÉES </h1> </div> <div class="handwritten-note inline-block px-6 py-3 max-w-md mx-auto text-sm italic"> "Analyse complète des niches commerciales émergentes - diffusion restreinte" </div> </div> <!-- Classified Cards Grid --> <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8"> <!-- Card 1 --> <div class="classified-card p-6 rounded-lg relative"> <div class="corner-fold"></div> <div class="flex items-center mb-4"> <div class="w-10 h-10 bg-red-100 rounded-full flex items-center justify-center mr-3"> <span class="text-red-600 font-bold">1</span> </div> <h3 class="text-xl font-bold font-mono">SnackGo</h3> </div> <div class="space-y-3 mb-6"> <div> <span class="text-sm font-semibold text-gray-600">PAYS D'ORIGINE:</span> <p class="font-mono">Japon</p> </div> <div> <span class="text-sm font-semibold text-gray-600">MARCHÉ CIBLÉ:</span> <p>Vente de snacks en ligne via abonnement</p> </div> <div> <span class="text-sm font-semibold text-gray-600">STATUT IA:</span> <p class="text-green-700 font-bold">Croissance rapide – recommandé</p> </div> <div> <span class="text-sm font-semibold text-gray-600">DONNÉES CENSURÉES:</span> <p>Chiffre d'affaires: <span class="redacted">1,200,000</span> $/mois</p> <p>Taux de croissance: <span class="redacted">15</span> %/mois</p> </div> </div> <button class="stamp-button w-full py-3 bg-red-600 hover:bg-red-700 text-white font-bold rounded-md transition-colors"> [LANCER UNE COPIE AVEC L'IA] </button> </div> <!-- Card 2 --> <div class="classified-card p-6 rounded-lg relative"> <div class="corner-fold"></div> <div class="flex items-center mb-4"> <div class="w-10 h-10 bg-blue-100 rounded-full flex items-center justify-center mr-3"> <span class="text-blue-600 font-bold">2</span> </div> <h3 class="text-xl font-bold font-mono">PetAI</h3> </div> <div class="space-y-3 mb-6"> <div> <span class="text-sm font-semibold text-gray-600">PAYS D'ORIGINE:</span> <p class="font-mono">États-Unis</p> </div> <div> <span class="text-sm font-semibold text-gray-600">MARCHÉ CIBLÉ:</span> <p>Soins pour animaux via IA personnalisée</p> </div> <div> <span class="text-sm font-semibold text-gray-600">STATUT IA:</span> <p class="text-yellow-600 font-bold">Niche émergente – potentiel élevé</p> </div> <div> <span class="text-sm font-semibold text-gray-600">DONNÉES CENSURÉES:</span> <p>Investissement initial: <span class="redacted">45,000</span> $</p> <p>ROI estimé: <span class="redacted">320</span> % en 6 mois</p> </div> </div> <button class="stamp-button w-full py-3 bg-red-600 hover:bg-red-700 text-white font-bold rounded-md transition-colors"> [LANCER UNE COPIE AVEC L'IA] </button> </div> <!-- Card 3 --> <div class="classified-card p-6 rounded-lg relative"> <div class="corner-fold"></div> <div class="flex items-center mb-4"> <div class="w-10 h-10 bg-green-100 rounded-full flex items-center justify-center mr-3"> <span class="text-green-600 font-bold">3</span> </div> <h3 class="text-xl font-bold font-mono">EcoRental</h3> </div> <div class="space-y-3 mb-6"> <div> <span class="text-sm font-semibold text-gray-600">PAYS D'ORIGINE:</span> <p class="font-mono">Allemagne</p> </div> <div> <span class="text-sm font-semibold text-gray-600">MARCHÉ CIBLÉ:</span> <p>Location d'équipements verts entre particuliers</p> </div> <div> <span class="text-sm font-semibold text-gray-600">STATUT IA:</span> <p class="text-purple-600 font-bold">Modèle éprouvé – faible concurrence</p> </div> <div> <span class="text-sm font-semibold text-gray-600">DONNÉES CENSURÉES:</span> <p>Utilisateurs actifs: <span class="redacted">12,500</span></p> <p>Commission moyenne: <span class="redacted">18</span> % par transaction</p> </div> </div> <button class="stamp-button w-full py-3 bg-red-600 hover:bg-red-700 text-white font-bold rounded-md transition-colors"> [LANCER UNE COPIE AVEC L'IA] </button> </div> </div> <!-- Footer Note --> <div class="mt-12 text-center text-sm text-gray-600 italic"> <p>Ce document est classifié Niveau 3 - Diffusion restreinte aux agents autorisés</p> <p class="mt-2">Dernière mise à jour: <span class="redacted">2023-11-15</span> | Version du rapport: <span class="redacted">2.4.7</span></p> </div> <!-- Top Secret Watermark --> <div class="fixed inset-0 pointer-events-none flex items-center justify-center opacity-10 z-0"> <div class="text-6xl md:text-8xl font-bold text-gray-400 transform rotate-45 font-mono">TOP SECRET</div> </div> </div> </body> </html> - Initial Deployment

Browse files
Files changed (2) hide show
  1. README.md +7 -5
  2. index.html +612 -19
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Underradar
3
- emoji: 💻
4
- colorFrom: yellow
5
- colorTo: gray
6
  sdk: static
7
  pinned: false
 
 
8
  ---
9
 
10
- Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
 
1
  ---
2
+ title: underradar
3
+ emoji: 🐳
4
+ colorFrom: green
5
+ colorTo: green
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite
10
  ---
11
 
12
+ Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
index.html CHANGED
@@ -1,19 +1,612 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="fr">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Rapport confidentiel – Opportunités détectées</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Special+Elite&family=Courier+Prime&display=swap">
9
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
10
+ <style>
11
+ body {
12
+ font-family: 'Courier Prime', monospace;
13
+ background-color: #f0e6d2;
14
+ background-image: url('data:image/svg+xml;utf8,<svg width="100" height="100" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"><path d="M0 0 L100 0 L100 100 L0 100 Z" fill="none" stroke="%23d4c9a8" stroke-width="1" stroke-dasharray="5,5"/></svg>');
15
+ color: #333;
16
+ }
17
+
18
+ .confidential-stamp {
19
+ position: absolute;
20
+ top: 50px;
21
+ right: 50px;
22
+ font-family: 'Special Elite', cursive;
23
+ font-size: 3rem;
24
+ color: #d00;
25
+ transform: rotate(-15deg);
26
+ opacity: 0.7;
27
+ text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
28
+ z-index: 10;
29
+ }
30
+
31
+ .document-title {
32
+ font-family: 'Special Elite', cursive;
33
+ position: relative;
34
+ text-shadow: 2px 2px 4px rgba(0,0,0,0.1);
35
+ }
36
+
37
+ .document-title::before, .document-title::after {
38
+ content: "";
39
+ position: absolute;
40
+ height: 2px;
41
+ background: linear-gradient(90deg, transparent, #333, transparent);
42
+ width: 100%;
43
+ left: 0;
44
+ }
45
+
46
+ .document-title::before {
47
+ top: 0;
48
+ }
49
+
50
+ .document-title::after {
51
+ bottom: 0;
52
+ }
53
+
54
+ .classified-card {
55
+ background: #f8f4e9;
56
+ border: 1px solid #d4c9a8;
57
+ box-shadow: 0 4px 8px rgba(0,0,0,0.1),
58
+ inset 0 0 20px rgba(0,0,0,0.05),
59
+ 0 0 10px rgba(0,0,0,0.1);
60
+ position: relative;
61
+ overflow: hidden;
62
+ transition: all 0.3s ease;
63
+ }
64
+
65
+ .classified-card:hover {
66
+ transform: translateY(-5px);
67
+ box-shadow: 0 6px 12px rgba(0,0,0,0.15),
68
+ inset 0 0 20px rgba(0,0,0,0.08),
69
+ 0 0 15px rgba(0,0,0,0.15);
70
+ }
71
+
72
+ .classified-card::before {
73
+ content: "";
74
+ position: absolute;
75
+ top: 0;
76
+ left: 0;
77
+ right: 0;
78
+ bottom: 0;
79
+ background: linear-gradient(135deg, rgba(255,255,255,0.1) 0%, rgba(255,255,255,0) 20%, rgba(255,255,255,0) 80%, rgba(255,255,255,0.1) 100%);
80
+ pointer-events: none;
81
+ }
82
+
83
+ .classified-card::after {
84
+ content: "";
85
+ position: absolute;
86
+ top: 10px;
87
+ right: 10px;
88
+ width: 30px;
89
+ height: 30px;
90
+ background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23d00"><path d="M12,2C6.48,2,2,6.48,2,12s4.48,10,10,10s10-4.48,10-10S17.52,2,12,2z M12,20c-4.41,0-8-3.59-8-8s3.59-8,8-8s8,3.59,8,8 S16.41,20,12,20z"/><path d="M12,7c-0.55,0-1,0.45-1,1v5c0,0.55,0.45,1,1,1s1-0.45,1-1V8C13,7.45,12.55,7,12,7z"/><path d="M11,16h2v2h-2V16z"/></svg>') no-repeat center;
91
+ opacity: 0.3;
92
+ }
93
+
94
+ .redacted {
95
+ background-color: #333;
96
+ color: transparent;
97
+ position: relative;
98
+ display: inline-block;
99
+ letter-spacing: 2px;
100
+ }
101
+
102
+ .redacted::after {
103
+ content: "████";
104
+ position: absolute;
105
+ left: 0;
106
+ top: 0;
107
+ color: #333;
108
+ }
109
+
110
+ .stamp-button {
111
+ font-family: 'Special Elite', cursive;
112
+ transition: all 0.3s ease;
113
+ position: relative;
114
+ overflow: hidden;
115
+ }
116
+
117
+ .stamp-button:hover {
118
+ transform: scale(1.05);
119
+ box-shadow: 0 0 15px rgba(208, 0, 0, 0.5);
120
+ }
121
+
122
+ .stamp-button::before {
123
+ content: "";
124
+ position: absolute;
125
+ top: -10px;
126
+ left: -10px;
127
+ right: -10px;
128
+ bottom: -10px;
129
+ border: 2px dashed rgba(208, 0, 0, 0.5);
130
+ border-radius: 4px;
131
+ opacity: 0;
132
+ transition: opacity 0.3s ease;
133
+ }
134
+
135
+ .stamp-button:hover::before {
136
+ opacity: 1;
137
+ }
138
+
139
+ .corner-fold {
140
+ position: absolute;
141
+ top: 0;
142
+ right: 0;
143
+ width: 0;
144
+ height: 0;
145
+ border-style: solid;
146
+ border-width: 0 40px 40px 0;
147
+ border-color: transparent #d4c9a8 transparent transparent;
148
+ }
149
+
150
+ .corner-fold::after {
151
+ content: "";
152
+ position: absolute;
153
+ top: 0;
154
+ right: 0;
155
+ width: 0;
156
+ height: 0;
157
+ border-style: solid;
158
+ border-width: 0 38px 38px 0;
159
+ border-color: transparent #f0e6d2 transparent transparent;
160
+ }
161
+
162
+ .handwritten-note {
163
+ font-family: 'Comic Sans MS', cursive;
164
+ transform: rotate(-2deg);
165
+ background: #fff8dc;
166
+ border: 1px dashed #d4c9a8;
167
+ box-shadow: 2px 2px 4px rgba(0,0,0,0.1);
168
+ }
169
+
170
+ .market-tag {
171
+ display: inline-block;
172
+ padding: 2px 8px;
173
+ border-radius: 12px;
174
+ font-size: 0.75rem;
175
+ font-weight: bold;
176
+ margin-right: 4px;
177
+ margin-bottom: 4px;
178
+ }
179
+
180
+ .progress-bar {
181
+ height: 6px;
182
+ border-radius: 3px;
183
+ background-color: #e2e8f0;
184
+ overflow: hidden;
185
+ }
186
+
187
+ .progress-fill {
188
+ height: 100%;
189
+ border-radius: 3px;
190
+ }
191
+
192
+ .company-logo {
193
+ width: 40px;
194
+ height: 40px;
195
+ border-radius: 8px;
196
+ display: flex;
197
+ align-items: center;
198
+ justify-content: center;
199
+ margin-right: 12px;
200
+ font-size: 18px;
201
+ color: white;
202
+ }
203
+
204
+ @media (max-width: 768px) {
205
+ .confidential-stamp {
206
+ font-size: 2rem;
207
+ top: 20px;
208
+ right: 20px;
209
+ }
210
+ }
211
+ </style>
212
+ </head>
213
+ <body class="min-h-screen px-4 sm:px-6 lg:px-8">
214
+ <!-- SaaS Header -->
215
+ <header class="bg-black text-white py-4 shadow-lg sticky top-0 z-50">
216
+ <div class="max-w-6xl mx-auto px-4 flex justify-between items-center">
217
+ <div class="flex items-center space-x-3">
218
+ <div class="w-8 h-8 bg-red-600 rounded-full flex items-center justify-center">
219
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white" width="16" height="16">
220
+ <path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z"/>
221
+ <path d="M12 8c-2.21 0-4 1.79-4 4s1.79 4 4 4 4-1.79 4-4-1.79-4-4-4zm0 6c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2z"/>
222
+ </svg>
223
+ </div>
224
+ <h1 class="text-xl font-bold font-mono tracking-tight">UNDERRADAR</h1>
225
+ </div>
226
+ <nav class="hidden md:flex space-x-6">
227
+ <a href="#" class="hover:text-red-400 transition-colors">Dashboard</a>
228
+ <a href="#" class="hover:text-red-400 transition-colors">Rapports</a>
229
+ <a href="#" class="hover:text-red-400 transition-colors">IA Clone</a>
230
+ <a href="#" class="hover:text-red-400 transition-colors">Agents</a>
231
+ </nav>
232
+ <button class="bg-red-600 hover:bg-red-700 px-4 py-2 rounded-md text-sm font-bold transition-colors flex items-center">
233
+ <i class="fas fa-fingerprint mr-2"></i> Accès Agent
234
+ </button>
235
+ </div>
236
+ </header>
237
+
238
+ <div class="max-w-6xl mx-auto relative py-12">
239
+ <!-- Confidential Stamp -->
240
+ <div class="confidential-stamp">
241
+ CONFIDENTIEL
242
+ </div>
243
+
244
+ <!-- Document Header -->
245
+ <div class="text-center mb-12 relative">
246
+ <div class="inline-block px-8 py-4 bg-white bg-opacity-70 border border-dashed border-gray-400 rounded-lg mb-6">
247
+ <h1 class="document-title text-3xl sm:text-4xl md:text-5xl font-bold inline-block px-8 py-2">
248
+ RAPPORT CONFIDENTIEL<br>OPPORTUNITÉS DÉTECTÉES
249
+ </h1>
250
+ </div>
251
+
252
+ <div class="handwritten-note inline-block px-6 py-3 max-w-md mx-auto text-sm italic">
253
+ "Analyse complète des niches commerciales émergentes - diffusion restreinte"
254
+ </div>
255
+
256
+ <div class="mt-6 flex justify-center">
257
+ <div class="bg-white bg-opacity-70 border border-gray-300 rounded-lg px-4 py-2 inline-flex items-center">
258
+ <i class="fas fa-calendar-alt text-gray-600 mr-2"></i>
259
+ <span class="text-sm font-mono">Dernière mise à jour: <span class="redacted">2023-11-15</span></span>
260
+ </div>
261
+ </div>
262
+ </div>
263
+
264
+ <!-- Classified Cards Grid -->
265
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
266
+ <!-- Card 1 - Tally.so -->
267
+ <div class="classified-card p-6 rounded-lg relative">
268
+ <div class="corner-fold"></div>
269
+ <div class="flex items-center mb-4">
270
+ <div class="company-logo bg-gradient-to-br from-purple-600 to-blue-500">
271
+ <i class="fas fa-poll"></i>
272
+ </div>
273
+ <div>
274
+ <h3 class="text-xl font-bold font-mono">Tally.so</h3>
275
+ <div class="flex items-center mt-1">
276
+ <span class="text-xs text-gray-600">Niveau de menace:</span>
277
+ <div class="ml-2 w-24">
278
+ <div class="progress-bar">
279
+ <div class="progress-fill bg-green-500" style="width: 65%"></div>
280
+ </div>
281
+ </div>
282
+ </div>
283
+ </div>
284
+ </div>
285
+
286
+ <div class="space-y-3 mb-6">
287
+ <div>
288
+ <span class="text-sm font-semibold text-gray-600">PAYS D'ORIGINE:</span>
289
+ <p class="font-mono">Belgique</p>
290
+ </div>
291
+ <div>
292
+ <span class="text-sm font-semibold text-gray-600">MARCHÉ CIBLÉ:</span>
293
+ <p>Création de formulaires sans code avec paiements intégrés</p>
294
+ <div class="mt-2">
295
+ <span class="market-tag bg-blue-100 text-blue-800">No-Code</span>
296
+ <span class="market-tag bg-green-100 text-green-800">SaaS</span>
297
+ <span class="market-tag bg-purple-100 text-purple-800">Formulaires</span>
298
+ </div>
299
+ </div>
300
+ <div>
301
+ <span class="text-sm font-semibold text-gray-600">STATUT IA:</span>
302
+ <p class="text-green-700 font-bold">Croissance rapide – recommandé</p>
303
+ </div>
304
+ <div>
305
+ <span class="text-sm font-semibold text-gray-600">DONNÉES CENSURÉES:</span>
306
+ <p>MRR: <span class="redacted">120,000</span> $/mois</p>
307
+ <p>Taux de croissance: <span class="redacted">22</span> %/mois</p>
308
+ <p>Coût d'acquisition client: <span class="redacted">15</span> $</p>
309
+ </div>
310
+ </div>
311
+
312
+ <button class="stamp-button w-full py-3 bg-red-600 hover:bg-red-700 text-white font-bold rounded-md transition-colors flex items-center justify-center">
313
+ <i class="fas fa-robot mr-2"></i> [LANCER UNE COPIE AVEC L'IA]
314
+ </button>
315
+ </div>
316
+
317
+ <!-- Card 2 - SavvyCal -->
318
+ <div class="classified-card p-6 rounded-lg relative">
319
+ <div class="corner-fold"></div>
320
+ <div class="flex items-center mb-4">
321
+ <div class="company-logo bg-gradient-to-br from-orange-500 to-pink-500">
322
+ <i class="far fa-calendar-alt"></i>
323
+ </div>
324
+ <div>
325
+ <h3 class="text-xl font-bold font-mono">SavvyCal</h3>
326
+ <div class="flex items-center mt-1">
327
+ <span class="text-xs text-gray-600">Niveau de menace:</span>
328
+ <div class="ml-2 w-24">
329
+ <div class="progress-bar">
330
+ <div class="progress-fill bg-yellow-500" style="width: 45%"></div>
331
+ </div>
332
+ </div>
333
+ </div>
334
+ </div>
335
+ </div>
336
+
337
+ <div class="space-y-3 mb-6">
338
+ <div>
339
+ <span class="text-sm font-semibold text-gray-600">PAYS D'ORIGINE:</span>
340
+ <p class="font-mono">États-Unis</p>
341
+ </div>
342
+ <div>
343
+ <span class="text-sm font-semibold text-gray-600">MARCHÉ CIBLÉ:</span>
344
+ <p>Planification de réunions intelligente avec overlay de disponibilités</p>
345
+ <div class="mt-2">
346
+ <span class="market-tag bg-pink-100 text-pink-800">Productivité</span>
347
+ <span class="market-tag bg-orange-100 text-orange-800">Calendrier</span>
348
+ <span class="market-tag bg-indigo-100 text-indigo-800">B2B</span>
349
+ </div>
350
+ </div>
351
+ <div>
352
+ <span class="text-sm font-semibold text-gray-600">STATUT IA:</span>
353
+ <p class="text-yellow-600 font-bold">Niche spécialisée – potentiel élevé</p>
354
+ </div>
355
+ <div>
356
+ <span class="text-sm font-semibold text-gray-600">DONNÉES CENSURÉES:</span>
357
+ <p>ARR: <span class="redacted">850,000</span> $</p>
358
+ <p>Prix moyen: <span class="redacted">12</span> $/utilisateur/mois</p>
359
+ <p>Churn: <span class="redacted">1.2</span> %</p>
360
+ </div>
361
+ </div>
362
+
363
+ <button class="stamp-button w-full py-3 bg-red-600 hover:bg-red-700 text-white font-bold rounded-md transition-colors flex items-center justify-center">
364
+ <i class="fas fa-robot mr-2"></i> [LANCER UNE COPIE AVEC L'IA]
365
+ </button>
366
+ </div>
367
+
368
+ <!-- Card 3 - Fibery -->
369
+ <div class="classified-card p-6 rounded-lg relative">
370
+ <div class="corner-fold"></div>
371
+ <div class="flex items-center mb-4">
372
+ <div class="company-logo bg-gradient-to-br from-teal-500 to-green-500">
373
+ <i class="fas fa-project-diagram"></i>
374
+ </div>
375
+ <div>
376
+ <h3 class="text-xl font-bold font-mono">Fibery</h3>
377
+ <div class="flex items-center mt-1">
378
+ <span class="text-xs text-gray-600">Niveau de menace:</span>
379
+ <div class="ml-2 w-24">
380
+ <div class="progress-bar">
381
+ <div class="progress-fill bg-red-500" style="width: 75%"></div>
382
+ </div>
383
+ </div>
384
+ </div>
385
+ </div>
386
+ </div>
387
+
388
+ <div class="space-y-3 mb-6">
389
+ <div>
390
+ <span class="text-sm font-semibold text-gray-600">PAYS D'ORIGINE:</span>
391
+ <p class="font-mono">Chypre</p>
392
+ </div>
393
+ <div>
394
+ <span class="text-sm font-semibold text-gray-600">MARCHÉ CIBLÉ:</span>
395
+ <p>Plateforme tout-en-un pour la gestion de produits et workflows</p>
396
+ <div class="mt-2">
397
+ <span class="market-tag bg-teal-100 text-teal-800">Product Management</span>
398
+ <span class="market-tag bg-green-100 text-green-800">Workflow</span>
399
+ <span class="market-tag bg-gray-100 text-gray-800">Collaboration</span>
400
+ </div>
401
+ </div>
402
+ <div>
403
+ <span class="text-sm font-semibold text-gray-600">STATUT IA:</span>
404
+ <p class="text-purple-600 font-bold">Modèle éprouvé – faible concurrence</p>
405
+ </div>
406
+ <div>
407
+ <span class="text-sm font-semibold text-gray-600">DONNÉES CENSURÉES:</span>
408
+ <p>Clients payants: <span class="redacted">1,200</span></p>
409
+ <p>LTV: <span class="redacted">4,500</span> $</p>
410
+ <p>Taux de conversion: <span class="redacted">8.5</span> %</p>
411
+ </div>
412
+ </div>
413
+
414
+ <button class="stamp-button w-full py-3 bg-red-600 hover:bg-red-700 text-white font-bold rounded-md transition-colors flex items-center justify-center">
415
+ <i class="fas fa-robot mr-2"></i> [LANCER UNE COPIE AVEC L'IA]
416
+ </button>
417
+ </div>
418
+
419
+ <!-- Card 4 - Plainly -->
420
+ <div class="classified-card p-6 rounded-lg relative">
421
+ <div class="corner-fold"></div>
422
+ <div class="flex items-center mb-4">
423
+ <div class="company-logo bg-gradient-to-br from-red-500 to-yellow-500">
424
+ <i class="fas fa-video"></i>
425
+ </div>
426
+ <div>
427
+ <h3 class="text-xl font-bold font-mono">Plainly</h3>
428
+ <div class="flex items-center mt-1">
429
+ <span class="text-xs text-gray-600">Niveau de menace:</span>
430
+ <div class="ml-2 w-24">
431
+ <div class="progress-bar">
432
+ <div class="progress-fill bg-blue-500" style="width: 55%"></div>
433
+ </div>
434
+ </div>
435
+ </div>
436
+ </div>
437
+ </div>
438
+
439
+ <div class="space-y-3 mb-6">
440
+ <div>
441
+ <span class="text-sm font-semibold text-gray-600">PAYS D'ORIGINE:</span>
442
+ <p class="font-mono">Danemark</p>
443
+ </div>
444
+ <div>
445
+ <span class="text-sm font-semibold text-gray-600">MARCHÉ CIBLÉ:</span>
446
+ <p>Génération automatisée de vidéos à partir de templates</p>
447
+ <div class="mt-2">
448
+ <span class="market-tag bg-red-100 text-red-800">Vidéo</span>
449
+ <span class="market-tag bg-yellow-100 text-yellow-800">Automatisation</span>
450
+ <span class="market-tag bg-blue-100 text-blue-800">API</span>
451
+ </div>
452
+ </div>
453
+ <div>
454
+ <span class="text-sm font-semibold text-gray-600">STATUT IA:</span>
455
+ <p class="text-green-700 font-bold">Croissance exponentielle</p>
456
+ </div>
457
+ <div>
458
+ <span class="text-sm font-semibold text-gray-600">DONNÉES CENSURÉES:</span>
459
+ <p>MRR: <span class="redacted">85,000</span> $/mois</p>
460
+ <p>Croissance: <span class="redacted">30</span> %/mois</p>
461
+ <p>Marge brute: <span class="redacted">78</span> %</p>
462
+ </div>
463
+ </div>
464
+
465
+ <button class="stamp-button w-full py-3 bg-red-600 hover:bg-red-700 text-white font-bold rounded-md transition-colors flex items-center justify-center">
466
+ <i class="fas fa-robot mr-2"></i> [LANCER UNE COPIE AVEC L'IA]
467
+ </button>
468
+ </div>
469
+
470
+ <!-- Card 5 - Outseta -->
471
+ <div class="classified-card p-6 rounded-lg relative">
472
+ <div class="corner-fold"></div>
473
+ <div class="flex items-center mb-4">
474
+ <div class="company-logo bg-gradient-to-br from-indigo-500 to-purple-500">
475
+ <i class="fas fa-user-cog"></i>
476
+ </div>
477
+ <div>
478
+ <h3 class="text-xl font-bold font-mono">Outseta</h3>
479
+ <div class="flex items-center mt-1">
480
+ <span class="text-xs text-gray-600">Niveau de menace:</span>
481
+ <div class="ml-2 w-24">
482
+ <div class="progress-bar">
483
+ <div class="progress-fill bg-purple-500" style="width: 60%"></div>
484
+ </div>
485
+ </div>
486
+ </div>
487
+ </div>
488
+ </div>
489
+
490
+ <div class="space-y-3 mb-6">
491
+ <div>
492
+ <span class="text-sm font-semibold text-gray-600">PAYS D'ORIGINE:</span>
493
+ <p class="font-mono">États-Unis</p>
494
+ </div>
495
+ <div>
496
+ <span class="text-sm font-semibold text-gray-600">MARCHÉ CIBLÉ:</span>
497
+ <p>Suite tout-en-un pour SaaS (CRM, billing, support, etc.)</p>
498
+ <div class="mt-2">
499
+ <span class="market-tag bg-indigo-100 text-indigo-800">SaaS Tools</span>
500
+ <span class="market-tag bg-purple-100 text-purple-800">Subscription</span>
501
+ <span class="market-tag bg-gray-100 text-gray-800">B2B</span>
502
+ </div>
503
+ </div>
504
+ <div>
505
+ <span class="text-sm font-semibold text-gray-600">STATUT IA:</span>
506
+ <p class="text-yellow-600 font-bold">Niche sous-exploitée</p>
507
+ </div>
508
+ <div>
509
+ <span class="text-sm font-semibold text-gray-600">DONNÉES CENSURÉES:</span>
510
+ <p>Clients: <span class="redacted">450</span></p>
511
+ <p>ARR: <span class="redacted">1.2M</span> $</p>
512
+ <p>Prix moyen: <span class="redacted">249</span> $/mois</p>
513
+ </div>
514
+ </div>
515
+
516
+ <button class="stamp-button w-full py-3 bg-red-600 hover:bg-red-700 text-white font-bold rounded-md transition-colors flex items-center justify-center">
517
+ <i class="fas fa-robot mr-2"></i> [LANCER UNE COPIE AVEC L'IA]
518
+ </button>
519
+ </div>
520
+
521
+ <!-- Card 6 - Loom -->
522
+ <div class="classified-card p-6 rounded-lg relative">
523
+ <div class="corner-fold"></div>
524
+ <div class="flex items-center mb-4">
525
+ <div class="company-logo bg-gradient-to-br from-blue-500 to-cyan-500">
526
+ <i class="fas fa-bolt"></i>
527
+ </div>
528
+ <div>
529
+ <h3 class="text-xl font-bold font-mono">Loom</h3>
530
+ <div class="flex items-center mt-1">
531
+ <span class="text-xs text-gray-600">Niveau de menace:</span>
532
+ <div class="ml-2 w-24">
533
+ <div class="progress-bar">
534
+ <div class="progress-fill bg-cyan-500" style="width: 85%"></div>
535
+ </div>
536
+ </div>
537
+ </div>
538
+ </div>
539
+ </div>
540
+
541
+ <div class="space-y-3 mb-6">
542
+ <div>
543
+ <span class="text-sm font-semibold text-gray-600">PAYS D'ORIGINE:</span>
544
+ <p class="font-mono">États-Unis</p>
545
+ </div>
546
+ <div>
547
+ <span class="text-sm font-semibold text-gray-600">MARCHÉ CIBLÉ:</span>
548
+ <p>Enregistrement et partage de vidéos d'écran asynchrones</p>
549
+ <div class="mt-2">
550
+ <span class="market-tag bg-blue-100 text-blue-800">Communication</span>
551
+ <span class="market-tag bg-cyan-100 text-cyan-800">Productivité</span>
552
+ <span class="market-tag bg-green-100 text-green-800">Remote Work</span>
553
+ </div>
554
+ </div>
555
+ <div>
556
+ <span class="text-sm font-semibold text-gray-600">STATUT IA:</span>
557
+ <p class="text-red-600 font-bold">Leader du marché - stratégie de différenciation requise</p>
558
+ </div>
559
+ <div>
560
+ <span class="text-sm font-semibold text-gray-600">DONNÉES CENSURÉES:</span>
561
+ <p>Utilisateurs: <span class="redacted">14M</span></p>
562
+ <p>Valutation: <span class="redacted">1.53B</span> $</p>
563
+ <p>MRR: <span class="redacted">4.2M</span> $</p>
564
+ </div>
565
+ </div>
566
+
567
+ <button class="stamp-button w-full py-3 bg-red-600 hover:bg-red-700 text-white font-bold rounded-md transition-colors flex items-center justify-center">
568
+ <i class="fas fa-robot mr-2"></i> [LANCER UNE COPIE AVEC L'IA]
569
+ </button>
570
+ </div>
571
+ </div>
572
+
573
+ <!-- Footer Note -->
574
+ <div class="mt-12 text-center text-sm text-gray-600 italic">
575
+ <p>Ce document est classifié Niveau 3 - Diffusion restreinte aux agents autorisés</p>
576
+ <p class="mt-2">Dernière mise à jour: <span class="redacted">2023-11-15</span> | Version du rapport: <span class="redacted">2.4.7</span></p>
577
+ </div>
578
+
579
+ <!-- Top Secret Watermark -->
580
+ <div class="fixed inset-0 pointer-events-none flex items-center justify-center opacity-10 z-0">
581
+ <div class="text-6xl md:text-8xl font-bold text-gray-400 transform rotate-45 font-mono">TOP SECRET</div>
582
+ </div>
583
+ </div>
584
+
585
+ <script>
586
+ // Animation for redacted text on hover
587
+ document.querySelectorAll('.redacted').forEach(el => {
588
+ el.addEventListener('mouseover', function() {
589
+ this.style.transition = 'all 0.3s ease';
590
+ this.style.background = 'linear-gradient(90deg, #555, #888, #555)';
591
+ this.style.backgroundSize = '200% 100%';
592
+ this.style.animation = 'shine 1.5s infinite';
593
+ });
594
+
595
+ el.addEventListener('mouseout', function() {
596
+ this.style.background = '#333';
597
+ this.style.animation = 'none';
598
+ });
599
+ });
600
+
601
+ // Add shine animation to style
602
+ const style = document.createElement('style');
603
+ style.textContent = `
604
+ @keyframes shine {
605
+ 0% { background-position: 200% 0; }
606
+ 100% { background-position: -200% 0; }
607
+ }
608
+ `;
609
+ document.head.appendChild(style);
610
+ </script>
611
+ <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=williampeoch/underradar" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
612
+ </html>