Theme Matrix + accents francais : refonte visuelle complete
- CSS : theme Matrix avec pluie binaire, scanlines CRT, glow verts, animations - HTML : ajout de tous les accents francais (entites HTML) - Canvas Matrix rain en arriere-plan - Nouvelles classes : glow-card, data-bg, matrix-quote, terminal-line, tags, status-dot - Suppression des tirets em et emojis
This commit is contained in:
461
css/custom.css
461
css/custom.css
@@ -1,36 +1,112 @@
|
|||||||
/* ============================================
|
/* ============================================
|
||||||
Theme personnalise : Hacker / Cybersecurite
|
Theme MATRIX : Cybersecurite / Lazarus
|
||||||
============================================ */
|
============================================ */
|
||||||
|
|
||||||
|
@import url('https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;700&family=Inter:wght@400;600;700&display=swap');
|
||||||
|
|
||||||
:root {
|
:root {
|
||||||
--color-bg: #0a0a0a;
|
--color-bg: #000000;
|
||||||
--color-bg-alt: #111111;
|
--color-bg-alt: #0a0f0a;
|
||||||
|
--color-bg-card: rgba(0, 20, 0, 0.6);
|
||||||
--color-green: #00ff41;
|
--color-green: #00ff41;
|
||||||
|
--color-green-dim: #00cc33;
|
||||||
|
--color-green-glow: rgba(0, 255, 65, 0.4);
|
||||||
|
--color-green-subtle: rgba(0, 255, 65, 0.08);
|
||||||
--color-red: #ff3333;
|
--color-red: #ff3333;
|
||||||
|
--color-red-glow: rgba(255, 51, 51, 0.4);
|
||||||
--color-cyan: #00e5ff;
|
--color-cyan: #00e5ff;
|
||||||
|
--color-cyan-glow: rgba(0, 229, 255, 0.3);
|
||||||
--color-yellow: #ffd600;
|
--color-yellow: #ffd600;
|
||||||
--color-text: #e0e0e0;
|
--color-text: #c0d0c0;
|
||||||
--color-muted: #888888;
|
--color-text-bright: #e0ffe0;
|
||||||
--color-border: #2a2a2a;
|
--color-muted: #4a6a4a;
|
||||||
|
--color-border: #0a3a0a;
|
||||||
--font-mono: 'Fira Code', 'Cascadia Code', 'Consolas', monospace;
|
--font-mono: 'Fira Code', 'Cascadia Code', 'Consolas', monospace;
|
||||||
--font-sans: 'Inter', 'Segoe UI', Arial, sans-serif;
|
--font-sans: 'Inter', 'Segoe UI', Arial, sans-serif;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ---- Arriere-plan global ---- */
|
/* ===================== KEYFRAMES ===================== */
|
||||||
|
|
||||||
|
@keyframes matrixGlow {
|
||||||
|
0%, 100% { text-shadow: 0 0 10px var(--color-green-glow), 0 0 20px var(--color-green-glow); }
|
||||||
|
50% { text-shadow: 0 0 20px var(--color-green), 0 0 40px var(--color-green-glow), 0 0 60px rgba(0,255,65,0.15); }
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes glitchColor {
|
||||||
|
0% { text-shadow: 2px 0 #ff0000, -2px 0 #00ffff; }
|
||||||
|
25% { text-shadow: -2px 0 #ff0000, 2px 0 #00ffff; }
|
||||||
|
50% { text-shadow: 2px 2px #ff0000, -2px -2px #00ffff; }
|
||||||
|
75% { text-shadow: -1px 2px #ff0000, 1px -2px #00ffff; }
|
||||||
|
100% { text-shadow: 2px 0 #ff0000, -2px 0 #00ffff; }
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes blink {
|
||||||
|
0%, 50% { opacity: 1; }
|
||||||
|
51%, 100% { opacity: 0; }
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes scanline {
|
||||||
|
0% { transform: translateY(-100%); }
|
||||||
|
100% { transform: translateY(100vh); }
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes fadeInUp {
|
||||||
|
from { opacity: 0; transform: translateY(30px); }
|
||||||
|
to { opacity: 1; transform: translateY(0); }
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes pulseGlow {
|
||||||
|
0%, 100% { box-shadow: 0 0 5px var(--color-green-glow), inset 0 0 5px rgba(0,255,65,0.05); }
|
||||||
|
50% { box-shadow: 0 0 20px var(--color-green-glow), 0 0 40px rgba(0,255,65,0.1), inset 0 0 10px rgba(0,255,65,0.08); }
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes redPulse {
|
||||||
|
0%, 100% { text-shadow: 0 0 10px var(--color-red-glow); }
|
||||||
|
50% { text-shadow: 0 0 30px var(--color-red), 0 0 60px var(--color-red-glow); }
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ===================== BASE ===================== */
|
||||||
|
|
||||||
.reveal {
|
.reveal {
|
||||||
background: var(--color-bg);
|
background: var(--color-bg);
|
||||||
color: var(--color-text);
|
color: var(--color-text);
|
||||||
font-family: var(--font-sans);
|
font-family: var(--font-sans);
|
||||||
}
|
}
|
||||||
|
|
||||||
.reveal .slides {
|
/* Scanlines CRT */
|
||||||
text-align: left;
|
.reveal::after {
|
||||||
|
content: '';
|
||||||
|
position: fixed;
|
||||||
|
top: 0; left: 0;
|
||||||
|
width: 100%; height: 100%;
|
||||||
|
pointer-events: none;
|
||||||
|
z-index: 9999;
|
||||||
|
background: repeating-linear-gradient(
|
||||||
|
0deg,
|
||||||
|
transparent, transparent 2px,
|
||||||
|
rgba(0, 255, 65, 0.018) 2px,
|
||||||
|
rgba(0, 255, 65, 0.018) 4px
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ---- Titres ---- */
|
/* Barre de scan lumineuse */
|
||||||
.reveal h1,
|
.reveal::before {
|
||||||
.reveal h2,
|
content: '';
|
||||||
.reveal h3 {
|
position: fixed;
|
||||||
|
top: 0; left: 0;
|
||||||
|
width: 100%; height: 6px;
|
||||||
|
background: linear-gradient(180deg, transparent, rgba(0,255,65,0.25), transparent);
|
||||||
|
z-index: 9998;
|
||||||
|
pointer-events: none;
|
||||||
|
animation: scanline 8s linear infinite;
|
||||||
|
opacity: 0.4;
|
||||||
|
}
|
||||||
|
|
||||||
|
.reveal .slides { text-align: left; }
|
||||||
|
|
||||||
|
/* ===================== TITRES + GLOW ===================== */
|
||||||
|
|
||||||
|
.reveal h1, .reveal h2, .reveal h3 {
|
||||||
color: var(--color-green);
|
color: var(--color-green);
|
||||||
font-family: var(--font-mono);
|
font-family: var(--font-mono);
|
||||||
text-transform: none;
|
text-transform: none;
|
||||||
@@ -39,96 +115,116 @@
|
|||||||
|
|
||||||
.reveal h1 {
|
.reveal h1 {
|
||||||
font-size: 2.2em;
|
font-size: 2.2em;
|
||||||
border-bottom: 3px solid var(--color-green);
|
border-bottom: 2px solid var(--color-green);
|
||||||
|
border-image: linear-gradient(90deg, var(--color-green), transparent) 1;
|
||||||
padding-bottom: 0.3em;
|
padding-bottom: 0.3em;
|
||||||
margin-bottom: 0.6em;
|
margin-bottom: 0.6em;
|
||||||
|
animation: matrixGlow 3s ease-in-out infinite;
|
||||||
}
|
}
|
||||||
|
|
||||||
.reveal h2 {
|
.reveal h2 {
|
||||||
font-size: 1.6em;
|
font-size: 1.6em;
|
||||||
margin-bottom: 0.5em;
|
margin-bottom: 0.5em;
|
||||||
|
text-shadow: 0 0 10px var(--color-green-glow);
|
||||||
}
|
}
|
||||||
|
|
||||||
.reveal h3 {
|
.reveal h3 {
|
||||||
font-size: 1.2em;
|
font-size: 1.2em;
|
||||||
color: var(--color-cyan);
|
color: var(--color-cyan);
|
||||||
|
text-shadow: 0 0 8px var(--color-cyan-glow);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ---- Texte ---- */
|
/* ===================== TEXTE ===================== */
|
||||||
.reveal p,
|
|
||||||
.reveal li {
|
.reveal p, .reveal li {
|
||||||
font-size: 0.85em;
|
font-size: 0.85em;
|
||||||
line-height: 1.7;
|
line-height: 1.7;
|
||||||
color: var(--color-text);
|
color: var(--color-text);
|
||||||
}
|
}
|
||||||
|
|
||||||
.reveal ul,
|
.reveal ul, .reveal ol { margin-left: 1em; }
|
||||||
.reveal ol {
|
.reveal li { margin-bottom: 0.4em; }
|
||||||
margin-left: 1em;
|
|
||||||
}
|
|
||||||
|
|
||||||
.reveal li {
|
/* Puces style terminal > */
|
||||||
margin-bottom: 0.4em;
|
.reveal ul > li {
|
||||||
|
list-style: none;
|
||||||
|
padding-left: 1.2em;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.reveal ul > li::before {
|
||||||
|
content: '>';
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
color: var(--color-green);
|
||||||
|
font-family: var(--font-mono);
|
||||||
|
font-weight: bold;
|
||||||
|
text-shadow: 0 0 4px var(--color-green-glow);
|
||||||
}
|
}
|
||||||
|
|
||||||
.reveal strong {
|
.reveal strong {
|
||||||
color: var(--color-green);
|
color: var(--color-green);
|
||||||
|
text-shadow: 0 0 6px var(--color-green-glow);
|
||||||
}
|
}
|
||||||
|
|
||||||
.reveal em {
|
.reveal em {
|
||||||
color: var(--color-cyan);
|
color: var(--color-cyan);
|
||||||
font-style: italic;
|
font-style: italic;
|
||||||
|
text-shadow: 0 0 4px var(--color-cyan-glow);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ---- Liens ---- */
|
/* ===================== LIENS ===================== */
|
||||||
|
|
||||||
.reveal a {
|
.reveal a {
|
||||||
color: var(--color-cyan);
|
color: var(--color-cyan);
|
||||||
text-decoration: underline;
|
text-decoration: underline;
|
||||||
text-underline-offset: 3px;
|
text-underline-offset: 3px;
|
||||||
|
text-shadow: 0 0 4px var(--color-cyan-glow);
|
||||||
}
|
}
|
||||||
|
|
||||||
.reveal a:hover {
|
.reveal a:hover {
|
||||||
color: var(--color-green);
|
color: var(--color-green);
|
||||||
|
text-shadow: 0 0 10px var(--color-green-glow);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ---- Code inline ---- */
|
/* ===================== CODE ===================== */
|
||||||
|
|
||||||
.reveal code {
|
.reveal code {
|
||||||
font-family: var(--font-mono);
|
font-family: var(--font-mono);
|
||||||
background: var(--color-bg-alt);
|
background: var(--color-bg-card);
|
||||||
border: 1px solid var(--color-border);
|
border: 1px solid var(--color-border);
|
||||||
border-radius: 4px;
|
border-radius: 4px;
|
||||||
padding: 0.15em 0.4em;
|
padding: 0.15em 0.4em;
|
||||||
font-size: 0.85em;
|
font-size: 0.85em;
|
||||||
color: var(--color-green);
|
color: var(--color-green);
|
||||||
|
text-shadow: 0 0 4px var(--color-green-glow);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ---- Blocs de code ---- */
|
|
||||||
.reveal pre {
|
.reveal pre {
|
||||||
background: var(--color-bg-alt);
|
background: var(--color-bg-card);
|
||||||
border: 1px solid var(--color-border);
|
border: 1px solid var(--color-green);
|
||||||
border-radius: 6px;
|
border-radius: 6px;
|
||||||
padding: 1em;
|
padding: 1em;
|
||||||
width: 100%;
|
width: 100%; box-sizing: border-box;
|
||||||
box-sizing: border-box;
|
box-shadow: 0 0 15px rgba(0,255,65,0.1), inset 0 0 30px rgba(0,0,0,0.5);
|
||||||
}
|
}
|
||||||
|
|
||||||
.reveal pre code {
|
.reveal pre code {
|
||||||
background: transparent;
|
background: transparent; border: none;
|
||||||
border: none;
|
padding: 0; font-size: 0.75em; line-height: 1.6;
|
||||||
padding: 0;
|
|
||||||
font-size: 0.75em;
|
|
||||||
line-height: 1.6;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ---- Slide de titre ---- */
|
/* ===================== SLIDE TITRE ===================== */
|
||||||
.reveal .title-slide {
|
|
||||||
text-align: center;
|
.reveal .title-slide { text-align: center; }
|
||||||
}
|
|
||||||
|
|
||||||
.reveal .title-slide h1 {
|
.reveal .title-slide h1 {
|
||||||
border-bottom: none;
|
border-bottom: none; border-image: none;
|
||||||
font-size: 2.6em;
|
font-size: 2.6em; margin-bottom: 0.3em;
|
||||||
margin-bottom: 0.3em;
|
animation: matrixGlow 2s ease-in-out infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Glitch au hover */
|
||||||
|
.reveal .title-slide h1:hover {
|
||||||
|
animation: glitchColor 0.3s steps(4) infinite, matrixGlow 2s ease-in-out infinite;
|
||||||
}
|
}
|
||||||
|
|
||||||
.reveal .title-slide .subtitle {
|
.reveal .title-slide .subtitle {
|
||||||
@@ -136,6 +232,15 @@
|
|||||||
font-size: 1.1em;
|
font-size: 1.1em;
|
||||||
font-family: var(--font-mono);
|
font-family: var(--font-mono);
|
||||||
margin-bottom: 1.5em;
|
margin-bottom: 1.5em;
|
||||||
|
text-shadow: 0 0 10px var(--color-cyan-glow);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Curseur clignotant */
|
||||||
|
.reveal .title-slide .subtitle::after {
|
||||||
|
content: '_';
|
||||||
|
animation: blink 1s step-end infinite;
|
||||||
|
color: var(--color-green);
|
||||||
|
margin-left: 2px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.reveal .title-slide .authors {
|
.reveal .title-slide .authors {
|
||||||
@@ -151,13 +256,14 @@
|
|||||||
font-family: var(--font-mono);
|
font-family: var(--font-mono);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ---- Classe utilitaire : alerte rouge ---- */
|
/* ===================== UTILITAIRES ===================== */
|
||||||
|
|
||||||
.reveal .alert {
|
.reveal .alert {
|
||||||
color: var(--color-red);
|
color: var(--color-red);
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
|
animation: redPulse 2s ease-in-out infinite;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ---- Classe utilitaire : chiffre mis en avant ---- */
|
|
||||||
.reveal .big-number {
|
.reveal .big-number {
|
||||||
font-size: 3em;
|
font-size: 3em;
|
||||||
font-family: var(--font-mono);
|
font-family: var(--font-mono);
|
||||||
@@ -165,9 +271,9 @@
|
|||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
margin: 0.5em 0;
|
margin: 0.5em 0;
|
||||||
|
text-shadow: 0 0 20px var(--color-red-glow), 0 0 40px rgba(255,51,51,0.15);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ---- Classe utilitaire : citation / source ---- */
|
|
||||||
.reveal .source {
|
.reveal .source {
|
||||||
font-size: 0.6em;
|
font-size: 0.6em;
|
||||||
color: var(--color-muted);
|
color: var(--color-muted);
|
||||||
@@ -175,41 +281,42 @@
|
|||||||
margin-top: 1em;
|
margin-top: 1em;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ---- Timeline ---- */
|
/* ===================== TIMELINE ===================== */
|
||||||
|
|
||||||
.reveal .timeline {
|
.reveal .timeline {
|
||||||
list-style: none;
|
list-style: none;
|
||||||
margin: 0;
|
margin: 0; padding: 0;
|
||||||
padding: 0;
|
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
.reveal .timeline::before {
|
.reveal .timeline::before {
|
||||||
content: '';
|
content: '';
|
||||||
position: absolute;
|
position: absolute; left: 8px; top: 0; bottom: 0;
|
||||||
left: 8px;
|
|
||||||
top: 0;
|
|
||||||
bottom: 0;
|
|
||||||
width: 2px;
|
width: 2px;
|
||||||
background: var(--color-green);
|
background: linear-gradient(180deg, transparent, var(--color-green), var(--color-red));
|
||||||
|
box-shadow: 0 0 8px var(--color-green-glow);
|
||||||
}
|
}
|
||||||
|
|
||||||
.reveal .timeline li {
|
.reveal .timeline li {
|
||||||
padding-left: 30px;
|
padding-left: 30px; position: relative;
|
||||||
position: relative;
|
margin-bottom: 0.6em; font-size: 0.8em;
|
||||||
margin-bottom: 0.6em;
|
list-style: none;
|
||||||
font-size: 0.8em;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.reveal .timeline li::before {
|
.reveal .timeline li::before {
|
||||||
content: '';
|
content: '';
|
||||||
position: absolute;
|
position: absolute; left: 3px; top: 0.45em;
|
||||||
left: 3px;
|
width: 12px; height: 12px; border-radius: 50%;
|
||||||
top: 0.45em;
|
|
||||||
width: 12px;
|
|
||||||
height: 12px;
|
|
||||||
border-radius: 50%;
|
|
||||||
background: var(--color-bg);
|
background: var(--color-bg);
|
||||||
border: 2px solid var(--color-green);
|
border: 2px solid var(--color-green);
|
||||||
|
box-shadow: 0 0 6px var(--color-green-glow);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Dernier point = rouge pulsant */
|
||||||
|
.reveal .timeline li:last-child::before {
|
||||||
|
border-color: var(--color-red);
|
||||||
|
box-shadow: 0 0 10px var(--color-red-glow), 0 0 20px rgba(255,51,51,0.2);
|
||||||
|
background: rgba(255,51,51,0.2);
|
||||||
}
|
}
|
||||||
|
|
||||||
.reveal .timeline .year {
|
.reveal .timeline .year {
|
||||||
@@ -217,101 +324,123 @@
|
|||||||
font-family: var(--font-mono);
|
font-family: var(--font-mono);
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
margin-right: 0.5em;
|
margin-right: 0.5em;
|
||||||
|
text-shadow: 0 0 4px var(--color-cyan-glow);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ---- Schema / Diagramme en blocs ---- */
|
/* ===================== DIAGRAMMES ===================== */
|
||||||
|
|
||||||
.reveal .diagram {
|
.reveal .diagram {
|
||||||
display: flex;
|
display: flex; align-items: center;
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
gap: 0.5em;
|
gap: 0.5em; margin: 1.5em 0; flex-wrap: wrap;
|
||||||
margin: 1.5em 0;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.reveal .diagram .box {
|
.reveal .diagram .box {
|
||||||
background: var(--color-bg-alt);
|
background: var(--color-bg-card);
|
||||||
border: 2px solid var(--color-green);
|
border: 2px solid var(--color-green);
|
||||||
border-radius: 6px;
|
border-radius: 6px;
|
||||||
padding: 0.6em 1em;
|
padding: 0.6em 1em;
|
||||||
font-family: var(--font-mono);
|
font-family: var(--font-mono); font-size: 0.7em;
|
||||||
font-size: 0.7em;
|
|
||||||
color: var(--color-green);
|
color: var(--color-green);
|
||||||
text-align: center;
|
text-align: center; min-width: 100px;
|
||||||
min-width: 100px;
|
box-shadow: 0 0 10px var(--color-green-glow), inset 0 0 15px rgba(0,255,65,0.03);
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.reveal .diagram .box:hover {
|
||||||
|
box-shadow: 0 0 25px var(--color-green-glow), 0 0 50px rgba(0,255,65,0.15);
|
||||||
|
transform: scale(1.05);
|
||||||
}
|
}
|
||||||
|
|
||||||
.reveal .diagram .box.red {
|
.reveal .diagram .box.red {
|
||||||
border-color: var(--color-red);
|
border-color: var(--color-red); color: var(--color-red);
|
||||||
color: var(--color-red);
|
box-shadow: 0 0 10px var(--color-red-glow);
|
||||||
|
}
|
||||||
|
.reveal .diagram .box.red:hover {
|
||||||
|
box-shadow: 0 0 25px var(--color-red-glow), 0 0 50px rgba(255,51,51,0.15);
|
||||||
}
|
}
|
||||||
|
|
||||||
.reveal .diagram .box.cyan {
|
.reveal .diagram .box.cyan {
|
||||||
border-color: var(--color-cyan);
|
border-color: var(--color-cyan); color: var(--color-cyan);
|
||||||
color: var(--color-cyan);
|
box-shadow: 0 0 10px var(--color-cyan-glow);
|
||||||
}
|
}
|
||||||
|
|
||||||
.reveal .diagram .arrow {
|
.reveal .diagram .arrow {
|
||||||
color: var(--color-muted);
|
color: var(--color-green-dim);
|
||||||
font-size: 1.5em;
|
font-size: 1.5em;
|
||||||
font-family: var(--font-mono);
|
font-family: var(--font-mono);
|
||||||
|
text-shadow: 0 0 8px var(--color-green-glow);
|
||||||
|
animation: matrixGlow 2s ease-in-out infinite;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ---- Grille 2 colonnes ---- */
|
/* ===================== LAYOUT ===================== */
|
||||||
|
|
||||||
.reveal .two-cols {
|
.reveal .two-cols {
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: 1fr 1fr;
|
grid-template-columns: 1fr 1fr;
|
||||||
gap: 2em;
|
gap: 2em; align-items: start;
|
||||||
align-items: start;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ---- Slide sommaire ---- */
|
/* ===================== SOMMAIRE ===================== */
|
||||||
|
|
||||||
.reveal .toc ol {
|
.reveal .toc ol {
|
||||||
list-style: decimal;
|
list-style: none;
|
||||||
|
counter-reset: toc-counter;
|
||||||
font-family: var(--font-mono);
|
font-family: var(--font-mono);
|
||||||
font-size: 0.85em;
|
font-size: 0.85em;
|
||||||
|
padding-left: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.reveal .toc ol li {
|
.reveal .toc ol li {
|
||||||
|
counter-increment: toc-counter;
|
||||||
margin-bottom: 0.5em;
|
margin-bottom: 0.5em;
|
||||||
color: var(--color-text);
|
color: var(--color-text);
|
||||||
|
padding-left: 2.5em;
|
||||||
|
position: relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ---- Barre de progression ---- */
|
.reveal .toc ol li::before {
|
||||||
.reveal .progress {
|
content: '[' counter(toc-counter, decimal-leading-zero) ']';
|
||||||
color: var(--color-green);
|
color: var(--color-green);
|
||||||
|
position: absolute; left: 0;
|
||||||
|
text-shadow: 0 0 4px var(--color-green-glow);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ===================== PROGRESS / SLIDE NUMBER ===================== */
|
||||||
|
|
||||||
|
.reveal .progress { color: var(--color-green); height: 3px; }
|
||||||
|
.reveal .progress span {
|
||||||
|
background: var(--color-green);
|
||||||
|
box-shadow: 0 0 10px var(--color-green), 0 0 20px var(--color-green-glow);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ---- Numeros de slide ---- */
|
|
||||||
.reveal .slide-number {
|
.reveal .slide-number {
|
||||||
font-family: var(--font-mono);
|
font-family: var(--font-mono);
|
||||||
font-size: 0.6em;
|
font-size: 0.6em;
|
||||||
color: var(--color-muted);
|
color: var(--color-green-dim);
|
||||||
|
background: transparent;
|
||||||
|
text-shadow: 0 0 4px var(--color-green-glow);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ---- Fragment animation ---- */
|
/* ===================== FRAGMENTS ===================== */
|
||||||
.reveal .fragment.highlight-green.visible {
|
|
||||||
color: var(--color-green);
|
|
||||||
}
|
|
||||||
|
|
||||||
.reveal .fragment.highlight-red.visible {
|
.reveal .fragment { transition: all 0.4s ease; }
|
||||||
color: var(--color-red);
|
.reveal .fragment.visible { animation: fadeInUp 0.5s ease forwards; }
|
||||||
}
|
.reveal .fragment.highlight-green.visible { color: var(--color-green); }
|
||||||
|
.reveal .fragment.highlight-red.visible { color: var(--color-red); }
|
||||||
|
|
||||||
/* ---- Table ---- */
|
/* ===================== TABLE ===================== */
|
||||||
.reveal table {
|
|
||||||
border-collapse: collapse;
|
.reveal table { border-collapse: collapse; width: 100%; font-size: 0.75em; }
|
||||||
width: 100%;
|
|
||||||
font-size: 0.75em;
|
|
||||||
}
|
|
||||||
|
|
||||||
.reveal table th {
|
.reveal table th {
|
||||||
background: var(--color-bg-alt);
|
background: var(--color-bg-card);
|
||||||
color: var(--color-green);
|
color: var(--color-green);
|
||||||
font-family: var(--font-mono);
|
font-family: var(--font-mono);
|
||||||
padding: 0.5em 0.8em;
|
padding: 0.5em 0.8em;
|
||||||
border-bottom: 2px solid var(--color-green);
|
border-bottom: 2px solid var(--color-green);
|
||||||
text-align: left;
|
text-align: left;
|
||||||
|
text-shadow: 0 0 4px var(--color-green-glow);
|
||||||
}
|
}
|
||||||
|
|
||||||
.reveal table td {
|
.reveal table td {
|
||||||
@@ -321,15 +450,125 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.reveal table tr:hover td {
|
.reveal table tr:hover td {
|
||||||
background: var(--color-bg-alt);
|
background: var(--color-bg-card);
|
||||||
|
color: var(--color-text-bright);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ---- Slide finale ---- */
|
/* ===================== SLIDE FINALE ===================== */
|
||||||
.reveal .end-slide {
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
.reveal .end-slide { text-align: center; }
|
||||||
.reveal .end-slide h1 {
|
.reveal .end-slide h1 {
|
||||||
border-bottom: none;
|
border-bottom: none; border-image: none;
|
||||||
font-size: 3em;
|
font-size: 3em;
|
||||||
|
animation: matrixGlow 1.5s ease-in-out infinite;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* ===================== GLOW CARD ===================== */
|
||||||
|
|
||||||
|
.reveal .glow-card {
|
||||||
|
background: var(--color-bg-card);
|
||||||
|
border: 1px solid var(--color-green);
|
||||||
|
border-radius: 8px;
|
||||||
|
padding: 1.2em 1.5em; margin: 1em 0;
|
||||||
|
box-shadow: 0 0 15px var(--color-green-glow), inset 0 0 30px rgba(0,0,0,0.5);
|
||||||
|
animation: pulseGlow 4s ease-in-out infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
.reveal .glow-card.red {
|
||||||
|
border-color: var(--color-red);
|
||||||
|
box-shadow: 0 0 15px var(--color-red-glow), inset 0 0 30px rgba(0,0,0,0.5);
|
||||||
|
}
|
||||||
|
.reveal .glow-card h3 { margin-top: 0; }
|
||||||
|
|
||||||
|
/* ===================== DATA BACKGROUND ===================== */
|
||||||
|
|
||||||
|
.reveal .data-bg { position: relative; overflow: hidden; }
|
||||||
|
.reveal .data-bg::before {
|
||||||
|
content: '01001100 01000001 01011010 01000001 01010010 01010101 01010011 00100000 01000010 01011001 01000010 01001001 01010100 00100000 00110001 00101110 00110101 01000010 ';
|
||||||
|
position: absolute; top: 0; left: 0;
|
||||||
|
width: 100%; height: 100%;
|
||||||
|
font-family: var(--font-mono); font-size: 0.5em;
|
||||||
|
color: rgba(0,255,65,0.04);
|
||||||
|
word-break: break-all; line-height: 1.8;
|
||||||
|
z-index: 0; pointer-events: none; overflow: hidden;
|
||||||
|
}
|
||||||
|
.reveal .data-bg > * { position: relative; z-index: 1; }
|
||||||
|
|
||||||
|
/* ===================== TERMINAL PROMPT ===================== */
|
||||||
|
|
||||||
|
.reveal .terminal-line {
|
||||||
|
font-family: var(--font-mono);
|
||||||
|
font-size: 0.8em;
|
||||||
|
color: var(--color-green);
|
||||||
|
margin: 0.3em 0;
|
||||||
|
}
|
||||||
|
.reveal .terminal-line::before {
|
||||||
|
content: 'root@lazarus:~$ ';
|
||||||
|
color: var(--color-muted);
|
||||||
|
}
|
||||||
|
.reveal .terminal-line::after {
|
||||||
|
content: '_';
|
||||||
|
animation: blink 1s step-end infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ===================== TAGS ===================== */
|
||||||
|
|
||||||
|
.reveal .tag {
|
||||||
|
display: inline-block;
|
||||||
|
font-family: var(--font-mono); font-size: 0.65em;
|
||||||
|
padding: 0.2em 0.6em; border-radius: 3px;
|
||||||
|
background: var(--color-bg-card);
|
||||||
|
border: 1px solid var(--color-green);
|
||||||
|
color: var(--color-green); margin: 0.15em;
|
||||||
|
text-shadow: 0 0 4px var(--color-green-glow);
|
||||||
|
}
|
||||||
|
.reveal .tag.red { border-color: var(--color-red); color: var(--color-red); }
|
||||||
|
.reveal .tag.cyan { border-color: var(--color-cyan); color: var(--color-cyan); }
|
||||||
|
|
||||||
|
/* ===================== SEPARATEUR ===================== */
|
||||||
|
|
||||||
|
.reveal .matrix-hr {
|
||||||
|
border: none; height: 1px;
|
||||||
|
background: linear-gradient(90deg, transparent, var(--color-green), transparent);
|
||||||
|
box-shadow: 0 0 10px var(--color-green-glow);
|
||||||
|
margin: 1.5em 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ===================== CITATION ===================== */
|
||||||
|
|
||||||
|
.reveal .matrix-quote {
|
||||||
|
border-left: 3px solid var(--color-green);
|
||||||
|
padding: 0.8em 1.2em; margin: 1em 0;
|
||||||
|
background: var(--color-bg-card);
|
||||||
|
font-style: italic; color: var(--color-text-bright);
|
||||||
|
box-shadow: inset 3px 0 15px rgba(0,255,65,0.05);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ===================== STATUS DOT ===================== */
|
||||||
|
|
||||||
|
.reveal .status-dot {
|
||||||
|
display: inline-block;
|
||||||
|
width: 8px; height: 8px; border-radius: 50%;
|
||||||
|
background: var(--color-green);
|
||||||
|
box-shadow: 0 0 6px var(--color-green);
|
||||||
|
animation: blink 1.5s step-end infinite;
|
||||||
|
margin-right: 6px; vertical-align: middle;
|
||||||
|
}
|
||||||
|
.reveal .status-dot.red {
|
||||||
|
background: var(--color-red);
|
||||||
|
box-shadow: 0 0 6px var(--color-red);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ===================== SECTIONS FADE ===================== */
|
||||||
|
|
||||||
|
.reveal section { animation: fadeInUp 0.6s ease forwards; }
|
||||||
|
|
||||||
|
/* ===================== RESPONSIVE ===================== */
|
||||||
|
|
||||||
|
@media (max-width: 800px) {
|
||||||
|
.reveal .two-cols { grid-template-columns: 1fr; gap: 1em; }
|
||||||
|
.reveal h1 { font-size: 1.6em; }
|
||||||
|
.reveal .big-number { font-size: 2em; }
|
||||||
|
.reveal .diagram { flex-direction: column; }
|
||||||
|
}
|
||||||
|
|
||||||
|
|||||||
339
index.html
339
index.html
@@ -1,4 +1,4 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="fr">
|
<html lang="fr">
|
||||||
<head>
|
<head>
|
||||||
<meta charset="utf-8">
|
<meta charset="utf-8">
|
||||||
@@ -12,24 +12,34 @@
|
|||||||
<!-- Highlight.js pour le code -->
|
<!-- Highlight.js pour le code -->
|
||||||
<link rel="stylesheet" href="node_modules/reveal.js/plugin/highlight/monokai.css">
|
<link rel="stylesheet" href="node_modules/reveal.js/plugin/highlight/monokai.css">
|
||||||
|
|
||||||
<!-- Theme personnalise -->
|
<!-- Thème personnalisé -->
|
||||||
<link rel="stylesheet" href="css/custom.css">
|
<link rel="stylesheet" href="css/custom.css">
|
||||||
|
|
||||||
<!-- Google Fonts -->
|
<!-- Canvas Matrix Rain -->
|
||||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
<style>
|
||||||
<link href="https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;700&family=Inter:wght@400;600;700&display=swap" rel="stylesheet">
|
#matrix-rain {
|
||||||
|
position: fixed;
|
||||||
|
top: 0; left: 0;
|
||||||
|
width: 100vw; height: 100vh;
|
||||||
|
z-index: 0;
|
||||||
|
pointer-events: none;
|
||||||
|
opacity: 0.12;
|
||||||
|
}
|
||||||
|
.reveal { position: relative; z-index: 1; }
|
||||||
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
<canvas id="matrix-rain"></canvas>
|
||||||
<div class="reveal">
|
<div class="reveal">
|
||||||
<div class="slides">
|
<div class="slides">
|
||||||
|
|
||||||
<!-- ============================================ -->
|
<!-- ============================================ -->
|
||||||
<!-- SLIDE 1 : Page de titre -->
|
<!-- SLIDE 1 : Page de titre -->
|
||||||
<!-- ============================================ -->
|
<!-- ============================================ -->
|
||||||
<section class="title-slide">
|
<section class="title-slide data-bg">
|
||||||
<h1>Le Groupe Lazarus<br>& le hack de Bybit</h1>
|
<h1>Le Groupe Lazarus<br>& le hack de Bybit</h1>
|
||||||
<div class="subtitle">Fevrier 2025 / 1,5 milliard de dollars en Ethereum</div>
|
<div class="subtitle">Février 2025 / 1,5 milliard de dollars en Ethereum</div>
|
||||||
<div class="authors">Presentation par [Prenom 1], [Prenom 2] et [Prenom 3]</div>
|
<div class="authors">Présentation par [Prénom 1], [Prénom 2] et [Prénom 3]</div>
|
||||||
<div class="date">2025 / 2026</div>
|
<div class="date">2025 / 2026</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
@@ -45,10 +55,10 @@
|
|||||||
<li>Le virage vers les cryptomonnaies</li>
|
<li>Le virage vers les cryptomonnaies</li>
|
||||||
<li>Bybit : la cible</li>
|
<li>Bybit : la cible</li>
|
||||||
<li>Anatomie technique de l'attaque</li>
|
<li>Anatomie technique de l'attaque</li>
|
||||||
<li>Impact sur le marche</li>
|
<li>Impact sur le marché</li>
|
||||||
<li>Reponse de Bybit et attribution</li>
|
<li>Réponse de Bybit et attribution</li>
|
||||||
<li>Se proteger contre ce type d'attaque</li>
|
<li>Se protéger contre ce type d'attaque</li>
|
||||||
<li>Enjeux geopolitiques</li>
|
<li>Enjeux géopolitiques</li>
|
||||||
<li>Conclusion</li>
|
<li>Conclusion</li>
|
||||||
</ol>
|
</ol>
|
||||||
</div>
|
</div>
|
||||||
@@ -57,30 +67,30 @@
|
|||||||
<!-- ============================================ -->
|
<!-- ============================================ -->
|
||||||
<!-- SLIDE 3 : Qui est le Groupe Lazarus ? -->
|
<!-- SLIDE 3 : Qui est le Groupe Lazarus ? -->
|
||||||
<!-- ============================================ -->
|
<!-- ============================================ -->
|
||||||
<section>
|
<section class="data-bg">
|
||||||
<h1>Qui est le Groupe Lazarus ?</h1>
|
<h1>Qui est le Groupe Lazarus ?</h1>
|
||||||
<div class="two-cols">
|
<div class="two-cols">
|
||||||
<div>
|
<div>
|
||||||
<p>Groupe de hackers etatique lie a la <strong>Coree du Nord</strong>, actif depuis <strong>2009</strong>.</p>
|
<p>Groupe de hackers étatique lié à la <strong>Corée du Nord</strong>, actif depuis <strong>2009</strong>.</p>
|
||||||
<p>Classe comme <em>Advanced Persistent Threat</em> (APT) par les agences de renseignement occidentales.</p>
|
<p>Classé comme <em>Advanced Persistent Threat</em> (APT) par les agences de renseignement occidentales.</p>
|
||||||
<p>Rattache au <strong>Reconnaissance General Bureau</strong> (renseignement militaire nord-coreen) et au <strong>Bureau 121</strong>, l'unite de cyberguerre.</p>
|
<p>Rattaché au <strong>Reconnaissance General Bureau</strong> (renseignement militaire nord-coréen) et au <strong>Bureau 121</strong>, l'unité de cyberguerre.</p>
|
||||||
<p>Compose de deux sous-groupes principaux :</p>
|
<p>Composé de deux sous-groupes principaux :</p>
|
||||||
<ul>
|
<ul>
|
||||||
<li><strong>BlueNorOff</strong> (APT38) : operations financieres</li>
|
<li><strong>BlueNorOff</strong> (APT38) : opérations financières</li>
|
||||||
<li><strong>AndAriel</strong> : espionnage cible sur la Coree du Sud</li>
|
<li><strong>AndAriel</strong> : espionnage ciblé sur la Corée du Sud</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<h3>Alias connus</h3>
|
<h3>Alias connus</h3>
|
||||||
<ul>
|
<p>
|
||||||
<li>Hidden Cobra (Dept. Homeland Security)</li>
|
<span class="tag">Hidden Cobra</span>
|
||||||
<li>ZINC / Diamond Sleet (Microsoft)</li>
|
<span class="tag cyan">ZINC / Diamond Sleet</span>
|
||||||
<li>APT38 (Mandiant)</li>
|
<span class="tag">APT38</span>
|
||||||
<li>Stardust Chollima (CrowdStrike)</li>
|
<span class="tag cyan">Stardust Chollima</span>
|
||||||
<li>Guardians of Peace</li>
|
<span class="tag">Guardians of Peace</span>
|
||||||
<li>NICKEL ACADEMY (Secureworks)</li>
|
<span class="tag cyan">NICKEL ACADEMY</span>
|
||||||
</ul>
|
</p>
|
||||||
<p class="source">Sources : MITRE ATT&CK G0032, US Treasury OFAC, Kaspersky</p>
|
<p class="source">Sources : MITRE ATT&CK G0032, US Treasury OFAC, Kaspersky</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
@@ -91,10 +101,10 @@
|
|||||||
<section>
|
<section>
|
||||||
<h1>Historique des attaques majeures</h1>
|
<h1>Historique des attaques majeures</h1>
|
||||||
<ul class="timeline">
|
<ul class="timeline">
|
||||||
<li><span class="year">2009</span> Operation Troy : attaques DDoS contre la Coree du Sud</li>
|
<li><span class="year">2009</span> Opération Troy : attaques DDoS contre la Corée du Sud</li>
|
||||||
<li><span class="year">2013</span> DarkSeoul : wiper contre banques et medias sud-coreens</li>
|
<li><span class="year">2013</span> DarkSeoul : wiper contre banques et médias sud-coréens</li>
|
||||||
<li><span class="year">2014</span> Hack de Sony Pictures : vol de donnees, destruction de systemes</li>
|
<li><span class="year">2014</span> Hack de Sony Pictures : vol de données, destruction de systèmes</li>
|
||||||
<li><span class="year">2016</span> Braquage de la Bangladesh Bank via SWIFT : <strong>81 M$</strong> voles</li>
|
<li><span class="year">2016</span> Braquage de la Bangladesh Bank via SWIFT : <strong>81 M$</strong> volés</li>
|
||||||
<li><span class="year">2017</span> WannaCry : ransomware mondial, 200 000 machines dans 150 pays</li>
|
<li><span class="year">2017</span> WannaCry : ransomware mondial, 200 000 machines dans 150 pays</li>
|
||||||
<li><span class="year">2022</span> Ronin Network (Axie Infinity) : <strong>620 M$</strong> en crypto</li>
|
<li><span class="year">2022</span> Ronin Network (Axie Infinity) : <strong>620 M$</strong> en crypto</li>
|
||||||
<li><span class="year">2022</span> Horizon Bridge (Harmony) : <strong>100 M$</strong></li>
|
<li><span class="year">2022</span> Horizon Bridge (Harmony) : <strong>100 M$</strong></li>
|
||||||
@@ -116,16 +126,16 @@
|
|||||||
<ul>
|
<ul>
|
||||||
<li>Les sanctions internationales (ONU, USA, UE) bloquent les circuits financiers classiques</li>
|
<li>Les sanctions internationales (ONU, USA, UE) bloquent les circuits financiers classiques</li>
|
||||||
<li>La blockchain offre un pseudo-anonymat exploitable avec des mixers et des bridges cross-chain</li>
|
<li>La blockchain offre un pseudo-anonymat exploitable avec des mixers et des bridges cross-chain</li>
|
||||||
<li>Les exchanges centralisees concentrent des milliards dans quelques wallets</li>
|
<li>Les exchanges centralisées concentrent des milliards dans quelques wallets</li>
|
||||||
<li>Les smart contracts tiers representent une surface d'attaque sous-estimee</li>
|
<li>Les smart contracts tiers représentent une surface d'attaque sous-estimée</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<h3>Estimation des vols</h3>
|
<h3>Estimation des vols</h3>
|
||||||
<div class="big-number">> 3 Md$</div>
|
<div class="big-number">> 3 Md$</div>
|
||||||
<p style="text-align:center;">voles en cryptomonnaies depuis 2017 par des groupes lies a la Coree du Nord.</p>
|
<p style="text-align:center;">volés en cryptomonnaies depuis 2017 par des groupes liés à la Corée du Nord.</p>
|
||||||
<p>Selon les estimations, les revenus issus du cybercrime representent environ <strong>50% des rentrees en devises etrangeres</strong> de la RPDC.</p>
|
<p>Selon les estimations, les revenus issus du cybercrime représentent environ <strong>50% des rentrées en devises étrangères</strong> de la RPDC.</p>
|
||||||
<p>Ces fonds financent directement les programmes nucleaire et balistique.</p>
|
<p>Ces fonds financent directement les programmes nucléaire et balistique.</p>
|
||||||
<p class="source">Sources : Chainalysis 2024 Crypto Crime Report, Nations Unies</p>
|
<p class="source">Sources : Chainalysis 2024 Crypto Crime Report, Nations Unies</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -138,23 +148,25 @@
|
|||||||
<h1>Bybit : la cible</h1>
|
<h1>Bybit : la cible</h1>
|
||||||
<div class="two-cols">
|
<div class="two-cols">
|
||||||
<div>
|
<div>
|
||||||
<ul>
|
<div class="glow-card">
|
||||||
<li>Fondee en 2018, basee a <strong>Dubai</strong></li>
|
<ul>
|
||||||
<li>2e exchange mondial par volume de trading au moment de l'attaque</li>
|
<li>Fondée en 2018, basée à <strong>Dubai</strong></li>
|
||||||
<li>Environ <strong>16 milliards de dollars</strong> d'actifs sous gestion</li>
|
<li><span class="status-dot"></span>2e exchange mondial par volume de trading au moment de l'attaque</li>
|
||||||
<li>Des millions d'utilisateurs dans le monde</li>
|
<li>Environ <strong>16 milliards de dollars</strong> d'actifs sous gestion</li>
|
||||||
</ul>
|
<li>Des millions d'utilisateurs dans le monde</li>
|
||||||
<p>L'attaque a cible le <strong>cold wallet Ethereum</strong> de Bybit, le coffre-fort hors ligne cense etre la couche de securite ultime.</p>
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div class="matrix-quote">L'attaque a ciblé le <strong>cold wallet Ethereum</strong> de Bybit, le coffre-fort hors ligne censé être la couche de sécurité ultime.</div>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<h3>Cold wallet vs Hot wallet</h3>
|
<h3>Cold wallet vs Hot wallet</h3>
|
||||||
<div class="diagram">
|
<div class="diagram">
|
||||||
<div class="box cyan">Hot Wallet<br><small>en ligne, rapide</small></div>
|
<div class="box cyan">Hot Wallet<br><small>en ligne, rapide</small></div>
|
||||||
<div class="arrow">←→</div>
|
<div class="arrow">←→</div>
|
||||||
<div class="box">Cold Wallet<br><small>hors ligne, securise</small></div>
|
<div class="box">Cold Wallet<br><small>hors ligne, sécurisé</small></div>
|
||||||
</div>
|
</div>
|
||||||
<p>Un cold wallet necessite plusieurs signatures (multisig) pour autoriser un transfert. En theorie, meme si un signataire est compromis, les fonds restent proteges.</p>
|
<p>Un cold wallet nécessite plusieurs signatures (multisig) pour autoriser un transfert. En théorie, même si un signataire est compromis, les fonds restent protégés.</p>
|
||||||
<p><strong>En theorie.</strong></p>
|
<p><strong>En théorie.</strong></p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
@@ -162,12 +174,11 @@
|
|||||||
<!-- ============================================ -->
|
<!-- ============================================ -->
|
||||||
<!-- SLIDE 7 : Anatomie technique 1/3 -->
|
<!-- SLIDE 7 : Anatomie technique 1/3 -->
|
||||||
<!-- ============================================ -->
|
<!-- ============================================ -->
|
||||||
<section>
|
<section class="data-bg">
|
||||||
<h1>Anatomie de l'attaque (1/3)</h1>
|
<h1>Anatomie de l'attaque (1/3)</h1>
|
||||||
<h2>Vecteur initial : Safe{Wallet}</h2>
|
<h2>Vecteur initial : Safe{Wallet}</h2>
|
||||||
<p><strong>Safe{Wallet}</strong> (anciennement Gnosis Safe) est un service tiers utilise par Bybit pour gerer la signature multiple (multisig) de ses cold wallets.</p>
|
<p><strong>Safe{Wallet}</strong> (anciennement Gnosis Safe) est un service tiers utilisé par Bybit pour gérer la signature multiple (multisig) de ses cold wallets.</p>
|
||||||
<p>Les attaquants ont compromis l'infrastructure de Safe{Wallet} elle-meme,
|
<p>Les attaquants ont compromis l'infrastructure de Safe{Wallet} elle-même, pas directement les systèmes de Bybit.</p>
|
||||||
pas directement les systemes de Bybit.</p>
|
|
||||||
<div class="diagram">
|
<div class="diagram">
|
||||||
<div class="box red">Lazarus</div>
|
<div class="box red">Lazarus</div>
|
||||||
<div class="arrow">→</div>
|
<div class="arrow">→</div>
|
||||||
@@ -177,8 +188,8 @@
|
|||||||
<div class="arrow">→</div>
|
<div class="arrow">→</div>
|
||||||
<div class="box cyan">Signataires<br>Bybit</div>
|
<div class="box cyan">Signataires<br>Bybit</div>
|
||||||
</div>
|
</div>
|
||||||
<p>Les signataires de Bybit ont vu une interface apparemment legitime. Ils ont approuve ce qui semblait etre une transaction de routine, mais le contenu reel de la transaction avait ete modifie cote serveur.</p>
|
<p>Les signataires de Bybit ont vu une interface apparemment légitime. Ils ont approuvé ce qui semblait être une transaction de routine, mais le contenu réel de la transaction avait été modifié côté serveur.</p>
|
||||||
<p class="source">Source : CoinTelegraph, Fevrier 2025</p>
|
<p class="source">Source : CoinTelegraph, Février 2025</p>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<!-- ============================================ -->
|
<!-- ============================================ -->
|
||||||
@@ -187,13 +198,15 @@
|
|||||||
<section>
|
<section>
|
||||||
<h1>Anatomie de l'attaque (2/3)</h1>
|
<h1>Anatomie de l'attaque (2/3)</h1>
|
||||||
<h2>Exploitation du smart contract</h2>
|
<h2>Exploitation du smart contract</h2>
|
||||||
<p>La fausse transaction approuvee par les signataires a modifie la logique du smart contract du cold wallet :</p>
|
<div class="glow-card">
|
||||||
<ol>
|
<p>La fausse transaction approuvée par les signataires a modifié la logique du smart contract du cold wallet :</p>
|
||||||
<li>Les signataires approuvent une transaction qui semble normale</li>
|
<ol>
|
||||||
<li class="fragment">La transaction reelle modifie le <em>implementation contract</em> du proxy wallet</li>
|
<li>Les signataires approuvent une transaction qui semble normale</li>
|
||||||
<li class="fragment">La nouvelle logique donne le controle total a l'attaquant</li>
|
<li class="fragment">La transaction réelle modifie le <em>implementation contract</em> du proxy wallet</li>
|
||||||
<li class="fragment">L'attaquant transfere ~400 000 ETH en une seule operation</li>
|
<li class="fragment">La nouvelle logique donne le contrôle total à l'attaquant</li>
|
||||||
</ol>
|
<li class="fragment">L'attaquant transfère ~400 000 ETH en une seule opération</li>
|
||||||
|
</ol>
|
||||||
|
</div>
|
||||||
<div class="fragment">
|
<div class="fragment">
|
||||||
<div class="big-number">~400 000 ETH</div>
|
<div class="big-number">~400 000 ETH</div>
|
||||||
<p style="text-align:center;">soit environ <strong>1,5 milliard de dollars</strong> au cours du jour</p>
|
<p style="text-align:center;">soit environ <strong>1,5 milliard de dollars</strong> au cours du jour</p>
|
||||||
@@ -207,9 +220,9 @@
|
|||||||
<section>
|
<section>
|
||||||
<h1>Anatomie de l'attaque (3/3)</h1>
|
<h1>Anatomie de l'attaque (3/3)</h1>
|
||||||
<h2>Phase de blanchiment</h2>
|
<h2>Phase de blanchiment</h2>
|
||||||
<p>Une fois les fonds transferes, les attaquants ont lance un processus de blanchiment sophistique et rapide :</p>
|
<p>Une fois les fonds transférés, les attaquants ont lancé un processus de blanchiment sophistiqué et rapide :</p>
|
||||||
<div class="diagram">
|
<div class="diagram">
|
||||||
<div class="box red">400K ETH<br>voles</div>
|
<div class="box red">400K ETH<br>volés</div>
|
||||||
<div class="arrow">→</div>
|
<div class="arrow">→</div>
|
||||||
<div class="box">Dispersion<br><small>multiples wallets</small></div>
|
<div class="box">Dispersion<br><small>multiples wallets</small></div>
|
||||||
<div class="arrow">→</div>
|
<div class="arrow">→</div>
|
||||||
@@ -220,102 +233,110 @@
|
|||||||
<div class="box cyan">Conversion<br>en BTC</div>
|
<div class="box cyan">Conversion<br>en BTC</div>
|
||||||
</div>
|
</div>
|
||||||
<ul>
|
<ul>
|
||||||
<li>Les fonds sont disperses vers des centaines de wallets intermediaires</li>
|
<li>Les fonds sont dispersés vers des centaines de wallets intermédiaires</li>
|
||||||
<li>Utilisation de <strong>mixers</strong> (protocoles de melange) pour brouiller l'origine</li>
|
<li>Utilisation de <strong>mixers</strong> (protocoles de mélange) pour brouiller l'origine</li>
|
||||||
<li>Passage par des <strong>bridges cross-chain</strong> (Ethereum vers d'autres blockchains)</li>
|
<li>Passage par des <strong>bridges cross-chain</strong> (Ethereum vers d'autres blockchains)</li>
|
||||||
<li>Conversion progressive en Bitcoin puis potentiellement en monnaie fiat via des exchanges non-regulees</li>
|
<li>Conversion progressive en Bitcoin puis potentiellement en monnaie fiat via des exchanges non régulées</li>
|
||||||
<li>Utilisation de DEX (exchanges decentralisees) pour eviter le KYC</li>
|
<li>Utilisation de DEX (exchanges décentralisées) pour éviter le KYC</li>
|
||||||
</ul>
|
</ul>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<!-- ============================================ -->
|
<!-- ============================================ -->
|
||||||
<!-- SLIDE 10 : Impact sur le marche -->
|
<!-- SLIDE 10 : Impact sur le marché -->
|
||||||
<!-- ============================================ -->
|
<!-- ============================================ -->
|
||||||
<section>
|
<section>
|
||||||
<h1>Impact sur le marche</h1>
|
<h1>Impact sur le marché</h1>
|
||||||
<div class="two-cols">
|
<div class="two-cols">
|
||||||
<div>
|
<div>
|
||||||
<h3>Chute des cours</h3>
|
<h3>Chute des cours</h3>
|
||||||
<div class="big-number" style="font-size:2em;">ETH : -20%</div>
|
<div class="glow-card red">
|
||||||
<p>Ethereum a perdu plus de 20% de sa valeur dans les heures suivant l'annonce du hack.</p>
|
<div class="big-number" style="font-size:2em;">ETH : -20%</div>
|
||||||
<div class="big-number" style="font-size:2em;">BTC < 90K$</div>
|
<p>Ethereum a perdu plus de 20% de sa valeur dans les heures suivant l'annonce du hack.</p>
|
||||||
<p>Le Bitcoin est passe sous la barre symbolique des 90 000 dollars.</p>
|
</div>
|
||||||
|
<div class="glow-card red">
|
||||||
|
<div class="big-number" style="font-size:2em;">BTC < 90K$</div>
|
||||||
|
<p>Le Bitcoin est passé sous la barre symbolique des 90 000 dollars.</p>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<h3>Effets en chaine</h3>
|
<h3>Effets en chaîne</h3>
|
||||||
<ul>
|
<ul>
|
||||||
<li>Ruee vers les retraits sur Bybit et d'autres exchanges</li>
|
<li>Ruée vers les retraits sur Bybit et d'autres exchanges</li>
|
||||||
<li>Plusieurs plateformes ont temporairement <strong>suspendu les retraits</strong></li>
|
<li>Plusieurs plateformes ont temporairement <strong>suspendu les retraits</strong></li>
|
||||||
<li>Panique generalisee sur les marches crypto</li>
|
<li>Panique généralisée sur les marchés crypto</li>
|
||||||
<li>Les regulateurs de plusieurs pays ont ouvert des enquetes sur la securite des exchanges</li>
|
<li>Les régulateurs de plusieurs pays ont ouvert des enquêtes sur la sécurité des exchanges</li>
|
||||||
<li>Remise en question de la fiabilite des solutions multisig tierces</li>
|
<li>Remise en question de la fiabilité des solutions multisig tierces</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<p class="source">Sources : CNA, CoinTelegraph, Fevrier 2025</p>
|
<p class="source">Sources : CNA, CoinTelegraph, Février 2025</p>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<!-- ============================================ -->
|
<!-- ============================================ -->
|
||||||
<!-- SLIDE 11 : Reponse de Bybit -->
|
<!-- SLIDE 11 : Réponse de Bybit -->
|
||||||
<!-- ============================================ -->
|
<!-- ============================================ -->
|
||||||
<section>
|
<section>
|
||||||
<h1>Reponse de Bybit</h1>
|
<h1>Réponse de Bybit</h1>
|
||||||
<ul>
|
<div class="glow-card">
|
||||||
<li><strong>Detection rapide</strong> : l'incident a ete identifie en quelques heures</li>
|
<ul>
|
||||||
<li><strong>Communication de crise</strong> : Bybit a publie des communiques transparents des le jour meme</li>
|
<li><span class="status-dot"></span><strong>Détection rapide</strong> : l'incident a été identifié en quelques heures</li>
|
||||||
<li><strong>Bounty program</strong> : une prime a ete offerte pour aider a tracer et recuperer les fonds</li>
|
<li><strong>Communication de crise</strong> : Bybit a publié des communiqués transparents dès le jour même</li>
|
||||||
<li class="fragment"><strong>ZachXBT</strong>, analyste blockchain independant, a identifie le Groupe Lazarus comme responsable en quelques heures, via des patterns de transactions reconnaissables</li>
|
<li><strong>Bounty program</strong> : une prime a été offerte pour aider à tracer et récupérer les fonds</li>
|
||||||
<li class="fragment"><strong>Arkham Intelligence</strong> a confirme l'attribution en tracant les wallets vers des adresses liees a des operations precedentes de Lazarus</li>
|
<li class="fragment"><strong>ZachXBT</strong>, analyste blockchain indépendant, a identifié le Groupe Lazarus comme responsable en quelques heures, via des patterns de transactions reconnaissables</li>
|
||||||
<li class="fragment">Le <strong>FBI</strong> a ensuite officiellement confirme l'implication de la Coree du Nord</li>
|
<li class="fragment"><strong>Arkham Intelligence</strong> a confirmé l'attribution en traçant les wallets vers des adresses liées à des opérations précédentes de Lazarus</li>
|
||||||
</ul>
|
<li class="fragment">Le <strong>FBI</strong> a ensuite officiellement confirmé l'implication de la Corée du Nord</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
<div class="fragment">
|
<div class="fragment">
|
||||||
<p>Bybit a declare etre reste <strong>solvable</strong> tout au long de la crise et a annonce avoir recupere une partie des fonds voles.</p>
|
<div class="matrix-quote">Bybit a déclaré être resté <strong>solvable</strong> tout au long de la crise et a annoncé avoir récupéré une partie des fonds volés.</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<!-- ============================================ -->
|
<!-- ============================================ -->
|
||||||
<!-- SLIDE 12 : Attribution a Lazarus -->
|
<!-- SLIDE 12 : Attribution à Lazarus -->
|
||||||
<!-- ============================================ -->
|
<!-- ============================================ -->
|
||||||
<section>
|
<section>
|
||||||
<h1>Attribution a Lazarus</h1>
|
<h1>Attribution à Lazarus</h1>
|
||||||
<h2>Comment sait-on que c'est eux ?</h2>
|
<h2>Comment sait-on que c'est eux ?</h2>
|
||||||
<div class="two-cols">
|
<div class="two-cols">
|
||||||
<div>
|
<div>
|
||||||
<h3>Indices techniques</h3>
|
<h3>Indices techniques</h3>
|
||||||
<ul>
|
<ul>
|
||||||
<li>Reutilisation de wallets lies a des hacks precedents (Axie Infinity, Horizon Bridge)</li>
|
<li>Réutilisation de wallets liés à des hacks précédents (Axie Infinity, Horizon Bridge)</li>
|
||||||
<li>Patterns de blanchiment identiques : meme sequence mixer/bridge/DEX</li>
|
<li>Patterns de blanchiment identiques : même séquence mixer/bridge/DEX</li>
|
||||||
<li>Infrastructure de commande et controle (C2) recoupee avec des operations anterieures</li>
|
<li>Infrastructure de commande et contrôle (C2) recoupée avec des opérations antérieures</li>
|
||||||
<li>Timing et methodes coherents avec le modus operandi de BlueNorOff</li>
|
<li>Timing et méthodes cohérents avec le modus operandi de BlueNorOff</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<h3>Confirmations officielles</h3>
|
<h3>Confirmations officielles</h3>
|
||||||
<ul>
|
<div class="matrix-quote">
|
||||||
<li><strong>ZachXBT</strong> : attribution publique en moins de 24h</li>
|
<ul>
|
||||||
<li><strong>Arkham Intelligence</strong> : analyse on-chain confirmant les liens</li>
|
<li><strong>ZachXBT</strong> : attribution publique en moins de 24h</li>
|
||||||
<li><strong>FBI</strong> : communique officiel confirmant l'implication de la RPDC</li>
|
<li><strong>Arkham Intelligence</strong> : analyse on-chain confirmant les liens</li>
|
||||||
<li><strong>Chainalysis</strong> et <strong>Elliptic</strong> : rapports detailles de tracage des fonds</li>
|
<li><strong>FBI</strong> : communiqué officiel confirmant l'implication de la RPDC</li>
|
||||||
</ul>
|
<li><strong>Chainalysis</strong> et <strong>Elliptic</strong> : rapports détaillés de traçage des fonds</li>
|
||||||
<p>L'attribution en cybersecurite est toujours delicate, mais le faisceau de preuves ici est particulierement solide.</p>
|
</ul>
|
||||||
|
</div>
|
||||||
|
<p>L'attribution en cybersécurité est toujours délicate, mais le faisceau de preuves ici est particulièrement solide.</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<!-- ============================================ -->
|
<!-- ============================================ -->
|
||||||
<!-- SLIDE 13 : Comment se proteger ? -->
|
<!-- SLIDE 13 : Comment se protéger ? -->
|
||||||
<!-- ============================================ -->
|
<!-- ============================================ -->
|
||||||
<section>
|
<section>
|
||||||
<h1>Comment se proteger ?</h1>
|
<h1>Comment se protéger ?</h1>
|
||||||
<div class="two-cols">
|
<div class="two-cols">
|
||||||
<div>
|
<div>
|
||||||
<h3>Pour les exchanges / entreprises</h3>
|
<h3>Pour les exchanges / entreprises</h3>
|
||||||
<ul>
|
<ul>
|
||||||
<li>Auditer regulierement les <strong>dependances tierces</strong> (supply chain security)</li>
|
<li>Auditer régulièrement les <strong>dépendances tierces</strong> (supply chain security)</li>
|
||||||
<li>Implementer une approche <strong>zero-trust</strong> pour les outils de signature</li>
|
<li>Implémenter une approche <strong>zero-trust</strong> pour les outils de signature</li>
|
||||||
<li>Verifier les transactions au niveau du hardware, pas seulement via une interface web</li>
|
<li>Vérifier les transactions au niveau du hardware, pas seulement via une interface web</li>
|
||||||
<li>Deployer du <strong>monitoring on-chain</strong> en temps reel pour detecter les mouvements anormaux</li>
|
<li>Déployer du <strong>monitoring on-chain</strong> en temps réel pour détecter les mouvements anormaux</li>
|
||||||
<li>Pratiquer des exercices de <strong>red team</strong> reguliers</li>
|
<li>Pratiquer des exercices de <strong>red team</strong> réguliers</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
@@ -324,40 +345,42 @@
|
|||||||
<li>Utiliser des <strong>hardware wallets</strong> (Ledger, Trezor) pour les fonds importants</li>
|
<li>Utiliser des <strong>hardware wallets</strong> (Ledger, Trezor) pour les fonds importants</li>
|
||||||
<li>Ne jamais laisser de grosses sommes sur un exchange</li>
|
<li>Ne jamais laisser de grosses sommes sur un exchange</li>
|
||||||
<li>Activer l'authentification multi-facteurs (MFA) partout</li>
|
<li>Activer l'authentification multi-facteurs (MFA) partout</li>
|
||||||
<li>Se mefier du <strong>phishing</strong> et de l'ingenierie sociale</li>
|
<li>Se méfier du <strong>phishing</strong> et de l'ingénierie sociale</li>
|
||||||
<li>Diversifier les lieux de stockage</li>
|
<li>Diversifier les lieux de stockage</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<p>La lecon principale de ce hack : <strong>la securite d'un systeme depend aussi de celle de ses prestataires</strong>.</p>
|
<hr class="matrix-hr">
|
||||||
|
<div class="matrix-quote">La leçon principale de ce hack : <strong>la sécurité d'un système dépend aussi de celle de ses prestataires</strong>.</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<!-- ============================================ -->
|
<!-- ============================================ -->
|
||||||
<!-- SLIDE 14 : Enjeux geopolitiques -->
|
<!-- SLIDE 14 : Enjeux géopolitiques -->
|
||||||
<!-- ============================================ -->
|
<!-- ============================================ -->
|
||||||
<section>
|
<section class="data-bg">
|
||||||
<h1>Enjeux geopolitiques</h1>
|
<h1>Enjeux géopolitiques</h1>
|
||||||
<div class="two-cols">
|
<div class="two-cols">
|
||||||
<div>
|
<div>
|
||||||
<h3>Financement etatique</h3>
|
<h3>Financement étatique</h3>
|
||||||
<p>Les fonds voles ne servent pas a enrichir des individus. Ils alimentent directement les programmes <strong>nucleaire</strong> et <strong>balistique</strong> de la Coree du Nord.</p>
|
<p>Les fonds volés ne servent pas à enrichir des individus. Ils alimentent directement les programmes <strong>nucléaire</strong> et <strong>balistique</strong> de la Corée du Nord.</p>
|
||||||
<p>Estimations :</p>
|
<div class="matrix-quote">
|
||||||
<ul>
|
<ul>
|
||||||
<li>~50% des revenus en devises de la RPDC proviendraient du cybercrime</li>
|
<li>~50% des revenus en devises de la RPDC proviendraient du cybercrime</li>
|
||||||
<li>Environ 1 700 membres dans la seule unite BlueNorOff</li>
|
<li>Environ 1 700 membres dans la seule unité BlueNorOff</li>
|
||||||
<li>Formation des hackers a l'universite Kim Chaek et au Mirim College, avec un passage a Shenyang (Chine)</li>
|
<li>Formation des hackers à l'université Kim Chaek et au Mirim College, avec un passage à Shenyang (Chine)</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<h3>Cyberguerre asymetrique</h3>
|
<h3>Cyberguerre asymétrique</h3>
|
||||||
<p>La Coree du Nord dispose de peu de ressources materielles mais presente une <strong>menace asymetrique</strong> considerable dans le cyberespace.</p>
|
<p>La Corée du Nord dispose de peu de ressources matérielles mais présente une <strong>menace asymétrique</strong> considérable dans le cyberespace.</p>
|
||||||
<ul>
|
<ul>
|
||||||
<li>Cout d'une operation cyber : faible</li>
|
<li>Coût d'une opération cyber : faible</li>
|
||||||
<li>Rendement potentiel : milliards de dollars</li>
|
<li>Rendement potentiel : milliards de dollars</li>
|
||||||
<li>Risque pour les operateurs : minimal (juridiction nord-coreenne)</li>
|
<li>Risque pour les opérateurs : minimal (juridiction nord-coréenne)</li>
|
||||||
<li>Difficulte d'attribution et de riposte pour les victimes</li>
|
<li>Difficulté d'attribution et de riposte pour les victimes</li>
|
||||||
</ul>
|
</ul>
|
||||||
<p>Les sanctions internationales sont contournees par le cyberespace.</p>
|
<p>Les sanctions internationales sont contournées par le cyberespace.</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<p class="source">Sources : US Army report 2020, Nations Unies, Recorded Future</p>
|
<p class="source">Sources : US Army report 2020, Nations Unies, Recorded Future</p>
|
||||||
@@ -369,13 +392,14 @@
|
|||||||
<section>
|
<section>
|
||||||
<h1>Conclusion</h1>
|
<h1>Conclusion</h1>
|
||||||
<ul>
|
<ul>
|
||||||
<li>Le Groupe Lazarus est l'une des menaces cyber les plus actives et les plus financierement devastatrices au monde</li>
|
<li>Le Groupe Lazarus est l'une des menaces cyber les plus actives et les plus financièrement dévastatrices au monde</li>
|
||||||
<li>Le hack de Bybit (fevrier 2025) est le plus gros vol de cryptomonnaies de l'histoire : <strong>1,5 milliard de dollars</strong></li>
|
<li>Le hack de Bybit (février 2025) est le plus gros vol de cryptomonnaies de l'histoire : <strong>1,5 milliard de dollars</strong></li>
|
||||||
<li>L'attaque a exploite une faiblesse dans un <strong>outil tiers</strong> (Safe{Wallet}), pas directement dans les systemes de Bybit</li>
|
<li>L'attaque a exploité une faiblesse dans un <strong>outil tiers</strong> (Safe{Wallet}), pas directement dans les systèmes de Bybit</li>
|
||||||
<li>La securite de la supply chain logicielle est un enjeu critique pour toute organisation</li>
|
<li>La sécurité de la supply chain logicielle est un enjeu critique pour toute organisation</li>
|
||||||
<li>Le cybercrime etatique nord-coreen represente un defi geopolitique majeur, a l'intersection de la cybersecurite, de la finance et des relations internationales</li>
|
<li>Le cybercrime étatique nord-coréen représente un défi géopolitique majeur, à l'intersection de la cybersécurité, de la finance et des relations internationales</li>
|
||||||
</ul>
|
</ul>
|
||||||
<p style="margin-top:1.5em;"><strong>En tant que futurs professionnels de l'informatique</strong>, comprendre ces attaques et les mecanismes de defense associes est essentiel, quelle que soit votre specialisation.</p>
|
<hr class="matrix-hr">
|
||||||
|
<p style="margin-top:1.5em;"><strong>En tant que futurs professionnels de l'informatique</strong>, comprendre ces attaques et les mécanismes de défense associés est essentiel, quelle que soit votre spécialisation.</p>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<!-- ============================================ -->
|
<!-- ============================================ -->
|
||||||
@@ -383,16 +407,16 @@
|
|||||||
<!-- ============================================ -->
|
<!-- ============================================ -->
|
||||||
<section class="end-slide">
|
<section class="end-slide">
|
||||||
<h1>Questions ?</h1>
|
<h1>Questions ?</h1>
|
||||||
<p style="margin-top:1em; color: var(--color-muted); font-family: var(--font-mono);">Merci de votre attention.</p>
|
<p class="terminal-line">echo "Merci de votre attention"</p>
|
||||||
<div style="margin-top:2em; text-align:left; max-width:600px; margin-left:auto; margin-right:auto;">
|
<div style="margin-top:2em; text-align:left; max-width:600px; margin-left:auto; margin-right:auto;">
|
||||||
<h3>Sources principales</h3>
|
<h3>Sources principales</h3>
|
||||||
<ul style="font-size:0.65em;">
|
<ul style="font-size:0.65em;">
|
||||||
<li>Wikipedia : Lazarus Group</li>
|
<li>Wikipedia : Lazarus Group</li>
|
||||||
<li>CoinTelegraph : "How the Bybit hack happened" (mars 2025)</li>
|
<li>CoinTelegraph : "How the Bybit hack happened" (mars 2025)</li>
|
||||||
<li>Arkham Intelligence : attribution Lazarus</li>
|
<li>Arkham Intelligence : attribution Lazarus</li>
|
||||||
<li>FBI : communique officiel (fevrier 2025)</li>
|
<li>FBI : communiqué officiel (février 2025)</li>
|
||||||
<li>Chainalysis : Crypto Crime Report 2024/2025</li>
|
<li>Chainalysis : Crypto Crime Report 2024/2025</li>
|
||||||
<li>MITRE ATT&CK : G0032 Lazarus Group</li>
|
<li>MITRE ATT&CK : G0032 Lazarus Group</li>
|
||||||
<li>US Army : "North Korean Tactics" (ATP 7-100.2, 2020)</li>
|
<li>US Army : "North Korean Tactics" (ATP 7-100.2, 2020)</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
@@ -417,6 +441,47 @@
|
|||||||
width: 1280,
|
width: 1280,
|
||||||
height: 720
|
height: 720
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// Matrix Rain Animation
|
||||||
|
(function() {
|
||||||
|
var canvas = document.getElementById('matrix-rain');
|
||||||
|
var ctx = canvas.getContext('2d');
|
||||||
|
|
||||||
|
function resize() {
|
||||||
|
canvas.width = window.innerWidth;
|
||||||
|
canvas.height = window.innerHeight;
|
||||||
|
}
|
||||||
|
resize();
|
||||||
|
window.addEventListener('resize', resize);
|
||||||
|
|
||||||
|
var chars = '01';
|
||||||
|
var fontSize = 14;
|
||||||
|
var columns = Math.floor(canvas.width / fontSize);
|
||||||
|
var drops = [];
|
||||||
|
|
||||||
|
for (var i = 0; i < columns; i++) {
|
||||||
|
drops[i] = Math.random() * canvas.height / fontSize;
|
||||||
|
}
|
||||||
|
|
||||||
|
function draw() {
|
||||||
|
ctx.fillStyle = 'rgba(0, 0, 0, 0.05)';
|
||||||
|
ctx.fillRect(0, 0, canvas.width, canvas.height);
|
||||||
|
ctx.fillStyle = '#00ff41';
|
||||||
|
ctx.font = fontSize + 'px monospace';
|
||||||
|
|
||||||
|
for (var i = 0; i < drops.length; i++) {
|
||||||
|
var text = chars.charAt(Math.floor(Math.random() * chars.length));
|
||||||
|
ctx.fillText(text, i * fontSize, drops[i] * fontSize);
|
||||||
|
|
||||||
|
if (drops[i] * fontSize > canvas.height && Math.random() > 0.975) {
|
||||||
|
drops[i] = 0;
|
||||||
|
}
|
||||||
|
drops[i]++;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
setInterval(draw, 50);
|
||||||
|
})();
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
Reference in New Issue
Block a user