Rangement dossier

meilleure arborescence
This commit is contained in:
2026-06-01 12:42:46 +02:00
parent e4f0a60395
commit ae361a3319
12 changed files with 920 additions and 0 deletions

View File

@@ -0,0 +1,920 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Vespa velutina — Invasion de France</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/4.4.1/chart.umd.min.js"></script>
<style>
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Source+Serif+4:ital,wght@0,300;0,400;0,600;1,300&family=IBM+Plex+Mono:wght@400;500&display=swap');
:root {
--bg: #f8f6f1;
--surface: #ffffff;
--surface2: #f2efe8;
--accent: #b8860b;
--accent2: #c94f1a;
--text: #1a1a14;
--muted: #7a7060;
--verified: #2d7a4a;
--estimated: #b8860b;
--projected: #c94f1a;
--border: #ddd8cc;
--official: #1a4a8a;
}
* { margin: 0; padding: 0; box-sizing: border-box; }
body {
background: var(--bg);
color: var(--text);
font-family: 'Source Serif 4', Georgia, serif;
min-height: 100vh;
}
@media print {
.no-print { display: none !important; }
body { background: white; }
.card, .kpi { break-inside: avoid; }
}
/* HEADER */
.header {
background: var(--surface);
border-bottom: 2px solid var(--accent);
padding: 32px 48px 24px;
display: grid;
grid-template-columns: 1fr auto;
gap: 16px;
align-items: end;
}
.header-species {
font-family: 'IBM Plex Mono', monospace;
font-size: 11px;
letter-spacing: 0.12em;
color: var(--accent);
text-transform: uppercase;
margin-bottom: 8px;
}
.header-title {
font-family: 'Bebas Neue', sans-serif;
font-size: 58px;
line-height: 0.92;
letter-spacing: 0.02em;
color: var(--text);
}
.header-title span { color: var(--accent); }
.header-subtitle {
margin-top: 10px;
font-size: 14px;
font-weight: 300;
font-style: italic;
color: var(--muted);
line-height: 1.5;
}
.header-right {
display: flex;
flex-direction: column;
align-items: flex-end;
gap: 10px;
}
.badge-year {
font-family: 'Bebas Neue', sans-serif;
font-size: 80px;
line-height: 1;
color: var(--accent2);
opacity: 0.15;
text-align: right;
}
.badge-label {
font-family: 'IBM Plex Mono', monospace;
font-size: 10px;
color: var(--muted);
letter-spacing: 0.1em;
}
.btn-print {
font-family: 'IBM Plex Mono', monospace;
font-size: 10px;
letter-spacing: 0.08em;
text-transform: uppercase;
background: var(--surface2);
border: 1px solid var(--border);
color: var(--muted);
padding: 7px 14px;
cursor: pointer;
border-radius: 1px;
transition: border-color 0.15s, color 0.15s;
}
.btn-print:hover { border-color: var(--accent); color: var(--accent); }
/* MAIN GRID */
.main {
padding: 32px 48px;
display: grid;
grid-template-columns: 1fr 1fr;
gap: 24px;
}
.card {
background: var(--surface);
border: 1px solid var(--border);
border-radius: 2px;
padding: 24px;
}
.card-full { grid-column: 1 / -1; }
.card-title {
font-family: 'IBM Plex Mono', monospace;
font-size: 10px;
letter-spacing: 0.14em;
text-transform: uppercase;
color: var(--accent);
margin-bottom: 4px;
}
.card-heading {
font-family: 'Bebas Neue', sans-serif;
font-size: 22px;
letter-spacing: 0.04em;
color: var(--text);
margin-bottom: 16px;
padding-bottom: 12px;
border-bottom: 1px solid var(--border);
}
/* CHARTS */
.chart-wrap { position: relative; height: 280px; }
.chart-wrap-sm { position: relative; height: 210px; }
/* LEGEND */
.legend { display: flex; gap: 20px; margin-top: 14px; flex-wrap: wrap; }
.legend-item {
display: flex;
align-items: center;
gap: 7px;
font-family: 'IBM Plex Mono', monospace;
font-size: 10px;
color: var(--muted);
letter-spacing: 0.06em;
}
.legend-dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
.legend-dash {
width: 20px; height: 2px; flex-shrink: 0;
background: repeating-linear-gradient(to right, var(--projected) 0, var(--projected) 4px, transparent 4px, transparent 8px);
}
/* MILESTONES */
.milestones { position: relative; padding-left: 24px; }
.milestones::before {
content: '';
position: absolute;
left: 6px; top: 8px; bottom: 8px;
width: 2px;
background: linear-gradient(to bottom, var(--accent2), var(--accent), var(--official));
}
.milestone {
position: relative;
margin-bottom: 16px;
opacity: 0;
transform: translateX(-8px);
animation: fadeSlide 0.4s ease forwards;
}
.milestone:nth-child(1) { animation-delay: 0.05s; }
.milestone:nth-child(2) { animation-delay: 0.15s; }
.milestone:nth-child(3) { animation-delay: 0.25s; }
.milestone:nth-child(4) { animation-delay: 0.35s; }
.milestone:nth-child(5) { animation-delay: 0.45s; }
.milestone:nth-child(6) { animation-delay: 0.55s; }
.milestone:nth-child(7) { animation-delay: 0.65s; }
.milestone:nth-child(8) { animation-delay: 0.75s; }
.milestone:nth-child(9) { animation-delay: 0.85s; }
@keyframes fadeSlide { to { opacity: 1; transform: translateX(0); } }
.milestone::before {
content: '';
position: absolute;
left: -20px; top: 5px;
width: 8px; height: 8px;
border-radius: 50%;
background: var(--accent);
border: 2px solid var(--bg);
}
.milestone.est::before { background: var(--estimated); }
.milestone.projected::before { background: var(--projected); }
.milestone.official::before { background: var(--official); }
.milestone-year {
font-family: 'Bebas Neue', sans-serif;
font-size: 18px;
color: var(--accent);
line-height: 1;
}
.milestone.est .milestone-year { color: var(--estimated); }
.milestone.projected .milestone-year { color: var(--projected); }
.milestone.official .milestone-year { color: var(--official); }
.milestone-text { font-size: 12.5px; font-weight: 300; color: var(--text); line-height: 1.4; margin-top: 2px; }
.milestone-source { font-family: 'IBM Plex Mono', monospace; font-size: 9px; color: var(--muted); margin-top: 3px; }
/* KPI CARDS */
.kpis {
display: grid;
grid-template-columns: repeat(5, 1fr);
gap: 12px;
grid-column: 1 / -1;
}
.kpi {
background: var(--surface2);
border: 1px solid var(--border);
border-radius: 2px;
padding: 16px 20px;
position: relative;
overflow: hidden;
}
.kpi::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px; }
.kpi.k-verified::before { background: var(--verified); }
.kpi.k-est::before { background: var(--estimated); }
.kpi.k-proj::before { background: var(--projected); }
.kpi.k-official::before { background: var(--official); }
.kpi-label {
font-family: 'IBM Plex Mono', monospace;
font-size: 9px;
letter-spacing: 0.12em;
text-transform: uppercase;
color: var(--muted);
margin-bottom: 6px;
}
.kpi-value { font-family: 'Bebas Neue', sans-serif; font-size: 32px; line-height: 1; color: var(--text); }
.kpi-unit { font-size: 12px; font-weight: 300; color: var(--muted); margin-top: 3px; font-style: italic; }
/* ALERT */
.alert {
grid-column: 1 / -1;
background: rgba(201,79,26,0.06);
border: 1px solid rgba(201,79,26,0.28);
border-left: 3px solid var(--projected);
padding: 14px 20px;
border-radius: 2px;
display: flex;
gap: 14px;
align-items: flex-start;
}
.alert.a-official {
background: rgba(26,74,138,0.05);
border: 1px solid rgba(26,74,138,0.22);
border-left-color: var(--official);
}
.alert-icon { font-size: 20px; flex-shrink: 0; margin-top: 1px; }
.alert-body { font-size: 12.5px; font-weight: 300; line-height: 1.55; color: var(--text); }
.alert-body strong { font-weight: 600; color: var(--projected); }
.alert.a-official .alert-body strong { color: var(--official); }
/* PLAN NATIONAL BANNER */
.plan-banner {
grid-column: 1 / -1;
background: linear-gradient(135deg, #152f5c 0%, #1a4a8a 100%);
border-radius: 2px;
padding: 22px 28px;
display: grid;
grid-template-columns: auto 1fr auto;
gap: 22px;
align-items: center;
}
.plan-logo {
font-family: 'Bebas Neue', sans-serif;
font-size: 12px;
letter-spacing: 0.1em;
color: rgba(255,255,255,0.4);
writing-mode: vertical-rl;
transform: rotate(180deg);
}
.plan-tag {
font-family: 'IBM Plex Mono', monospace;
font-size: 9px;
letter-spacing: 0.12em;
text-transform: uppercase;
color: rgba(255,255,255,0.5);
margin-bottom: 8px;
}
.plan-title {
font-family: 'Bebas Neue', sans-serif;
font-size: 26px;
color: #fff;
line-height: 1.1;
margin-bottom: 10px;
}
.plan-title span { color: #f5c842; }
.plan-text {
font-size: 12px;
font-weight: 300;
color: rgba(255,255,255,0.78);
line-height: 1.6;
}
.plan-text strong { color: #f5c842; font-weight: 600; }
.plan-kpis { display: flex; flex-direction: column; gap: 12px; align-items: flex-end; }
.plan-kpi { text-align: right; }
.plan-kpi-val { font-family: 'Bebas Neue', sans-serif; font-size: 30px; color: #f5c842; line-height: 1; }
.plan-kpi-lbl { font-family: 'IBM Plex Mono', monospace; font-size: 8px; color: rgba(255,255,255,0.5); letter-spacing: 0.08em; text-transform: uppercase; }
/* IMPACT GRID */
.impact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 4px; }
.impact-item {
padding: 12px 14px;
background: var(--surface2);
border: 1px solid var(--border);
border-radius: 2px;
}
.impact-val { font-family: 'Bebas Neue', sans-serif; font-size: 30px; line-height: 1; color: var(--text); }
.impact-label { font-size: 11.5px; font-weight: 300; color: var(--muted); line-height: 1.4; margin-top: 3px; }
.impact-source { font-family: 'IBM Plex Mono', monospace; font-size: 8.5px; color: rgba(0,0,0,0.25); margin-top: 5px; }
/* MAP */
.map-card {
grid-column: 1 / -1;
background: var(--surface);
border: 1px solid var(--border);
border-radius: 2px;
overflow: hidden;
}
.map-header {
padding: 18px 24px 14px;
border-bottom: 1px solid var(--border);
display: flex;
justify-content: space-between;
align-items: flex-end;
}
.map-frame-wrap {
position: relative;
width: 100%;
height: 430px;
background: var(--surface2);
}
.map-frame-wrap iframe { width: 100%; height: 100%; border: none; display: block; }
.map-overlay {
position: absolute;
bottom: 12px;
left: 50%;
transform: translateX(-50%);
background: rgba(255,255,255,0.9);
border: 1px solid var(--border);
padding: 5px 14px;
border-radius: 2px;
font-family: 'IBM Plex Mono', monospace;
font-size: 9px;
color: var(--muted);
white-space: nowrap;
pointer-events: none;
}
.map-footer {
padding: 12px 24px;
border-top: 1px solid var(--border);
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
gap: 12px;
}
.map-credit { font-family: 'IBM Plex Mono', monospace; font-size: 9px; color: var(--muted); }
.map-link {
font-family: 'IBM Plex Mono', monospace;
font-size: 9px;
color: var(--accent);
text-decoration: none;
border-bottom: 1px solid rgba(184,134,11,0.3);
transition: border-color 0.15s;
}
.map-link:hover { border-color: var(--accent); }
/* DATA QUALITY */
.data-quality { display: flex; gap: 16px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--border); flex-wrap: wrap; }
.dq-item { display: flex; align-items: center; gap: 8px; font-family: 'IBM Plex Mono', monospace; font-size: 10px; color: var(--muted); }
.dq-block { width: 12px; height: 12px; border-radius: 1px; flex-shrink: 0; }
/* SOURCES */
.sources {
border-top: 1px solid var(--border);
padding: 20px 48px;
display: flex;
gap: 16px;
flex-wrap: wrap;
align-items: center;
background: var(--surface);
}
.sources-label {
font-family: 'IBM Plex Mono', monospace;
font-size: 9px;
letter-spacing: 0.12em;
text-transform: uppercase;
color: var(--muted);
flex-shrink: 0;
}
.source-chip {
font-family: 'IBM Plex Mono', monospace;
font-size: 9px;
color: var(--muted);
background: var(--surface2);
border: 1px solid var(--border);
padding: 3px 8px;
border-radius: 1px;
text-decoration: none;
transition: background 0.15s, border-color 0.15s, color 0.15s;
}
a.source-chip:hover { background: var(--bg); border-color: var(--accent); color: var(--accent); }
.source-chip.verified { border-color: rgba(45,122,74,0.4); color: var(--verified); }
a.source-chip.verified:hover { border-color: var(--verified); color: var(--verified); }
.source-chip.official { border-color: rgba(26,74,138,0.4); color: var(--official); }
a.source-chip.official:hover { border-color: var(--official); color: var(--official); }
</style>
</head>
<body>
<!-- ═══ HEADER ═══════════════════════════════════════════════════════════════ -->
<div class="header">
<div>
<div class="header-species">Vespa velutina nigrithorax · Espèce exotique envahissante · Danger sanitaire 2ème catégorie depuis 2012</div>
<div class="header-title">FRELON<br><span>ASIATIQUE</span><br>EN FRANCE</div>
<div class="header-subtitle">Vingt ans d'invasion : données épidémiologiques, estimations de population, plan national 2026</div>
</div>
<div class="header-right">
<div>
<div class="badge-year">20</div>
<div class="badge-year" style="margin-top:-20px">ANS</div>
<div class="badge-label" style="text-align:right">D'INVASION · 20042026</div>
</div>
<button class="btn-print no-print" onclick="window.print()">⎙ Imprimer / PDF</button>
</div>
</div>
<!-- ═══ KPI ROW ════════════════════════════════════════════════════════════ -->
<div class="main" style="padding-bottom:0;">
<div class="kpis">
<div class="kpi k-verified">
<div class="kpi-label">Départements touchés · 2026</div>
<div class="kpi-value">101/101</div>
<div class="kpi-unit">tous les dép. métropolitains</div>
</div>
<div class="kpi k-est">
<div class="kpi-label">Nids signalés / an · 202425</div>
<div class="kpi-value">1315k</div>
<div class="kpi-unit">nids déclarés (510% du réel)</div>
</div>
<div class="kpi k-est">
<div class="kpi-label">Nids estimés en France · 2024</div>
<div class="kpi-value">~500k</div>
<div class="kpi-unit">ordre de grandeur · extrapolation</div>
</div>
<div class="kpi k-proj">
<div class="kpi-label">Pertes filière apicole / an</div>
<div class="kpi-value">98M€</div>
<div class="kpi-unit">pertes estimées (UNAF)</div>
</div>
<div class="kpi k-official">
<div class="kpi-label">Plan national 2026 · budget</div>
<div class="kpi-value">3M€</div>
<div class="kpi-unit">par an sur 6 ans · Ministère TE</div>
</div>
</div>
</div>
<!-- ═══ PLAN NATIONAL ══════════════════════════════════════════════════════ -->
<div class="main" style="padding-top:16px; padding-bottom:0;">
<div class="plan-banner">
<div class="plan-logo">OFFICIEL</div>
<div>
<div class="plan-tag">Dossier de presse officiel · Ministère de la Transition Écologique · 27 mars 2026</div>
<div class="plan-title">Plan National de Lutte<br>contre le <span>Frelon Asiatique</span></div>
<div class="plan-text">
Présenté dans les Vosges par le ministre Mathieu Lefèvre, en application de la <strong>loi n°2025-237 du 14 mars 2025</strong>.
Le plan acte officiellement que <strong>l'éradication n'est plus envisageable</strong>.
La stratégie repose désormais sur la limitation des impacts :
piégeage sélectif, destruction de nids par des professionnels,
protection des ruchers (muselières, harpes), déclaration obligatoire des nids.
Un guichet collectivités / associations a ouvert le <strong>1er mai 2026</strong>.
L'espèce a atteint <strong>9 pays européens</strong>, dont la Hongrie en 2024.
</div>
</div>
<div class="plan-kpis">
<div class="plan-kpi">
<div class="plan-kpi-val">9</div>
<div class="plan-kpi-lbl">pays européens<br>concernés</div>
</div>
<div class="plan-kpi">
<div class="plan-kpi-val">40%</div>
<div class="plan-kpi-lbl">abeilles dans<br>l'alimentation</div>
</div>
<div class="plan-kpi">
<div class="plan-kpi-val">30%</div>
<div class="plan-kpi-lbl">colonies pouvant<br>disparaître/an</div>
</div>
</div>
</div>
</div>
<!-- ═══ CHARTS ══════════════════════════════════════════════════════════════ -->
<div class="main" style="padding-top:16px;">
<!-- CHART 1 : DÉPARTEMENTS -->
<div class="card">
<div class="card-title">Expansion géographique</div>
<div class="card-heading">Départements colonisés par année</div>
<div class="chart-wrap"><canvas id="deptChart"></canvas></div>
<div class="legend">
<div class="legend-item"><div class="legend-dot" style="background:var(--verified)"></div>Données vérifiées (MNHN/INPN)</div>
<div class="legend-item"><div class="legend-dot" style="background:var(--estimated)"></div>Sources consolidées</div>
</div>
<div class="data-quality">
<div class="dq-item"><div class="dq-block" style="background:var(--verified)"></div>Publications scientifiques</div>
<div class="dq-item"><div class="dq-block" style="background:var(--estimated)"></div>AN / rapports officiels</div>
</div>
</div>
<!-- CHART 2 : NIDS + PROJECTION -->
<div class="card">
<div class="card-title">Pression d'infestation</div>
<div class="card-heading">Nids signalés, estimés & projection</div>
<div class="chart-wrap"><canvas id="nidsChart"></canvas></div>
<div class="legend">
<div class="legend-item"><div class="legend-dot" style="background:var(--verified)"></div>Signalements confirmés</div>
<div class="legend-item"><div class="legend-dot" style="background:rgba(184,134,11,0.45)"></div>Estimation totale (×3050)</div>
<div class="legend-item"><div class="legend-dash"></div>Tendance +1520%/an</div>
</div>
<div class="data-quality">
<div class="dq-item"><div class="dq-block" style="background:rgba(45,122,74,0.4); border:1px solid var(--verified)"></div>Seuls 510% des nids réels sont signalés</div>
</div>
</div>
<!-- CHART 3 : MANCHE -->
<div class="card">
<div class="card-title">Zoom département · Données annuelles continues</div>
<div class="card-heading">Nids localisés — Manche (50) · 20222024</div>
<div class="chart-wrap-sm"><canvas id="mancheChart"></canvas></div>
<div style="margin-top:10px; font-size:12px; font-weight:300; color:var(--muted); line-height:1.5;">
Seul département avec une série annuelle continue publiée. La baisse 2022→2024 illustre une possible saturation locale combinée à l'intensification de la lutte collective (FDGDON 50). À ne pas généraliser à l'échelle nationale.
</div>
<div class="data-quality">
<div class="dq-item"><div class="dq-block" style="background:var(--verified)"></div>Source : FDGDON Manche — bilans annuels publiés</div>
</div>
</div>
<!-- IMPACT ABEILLES -->
<div class="card">
<div class="card-title">Impact filière apicole & biodiversité</div>
<div class="card-heading">Chiffres clés — dossier officiel mars 2026</div>
<div class="impact-grid">
<div class="impact-item">
<div class="impact-val" style="color:var(--projected)">40%</div>
<div class="impact-label">des proies capturées sont des abeilles domestiques</div>
<div class="impact-source">Plan national · MNHN</div>
</div>
<div class="impact-item">
<div class="impact-val" style="color:var(--projected)">20%</div>
<div class="impact-label">taux de mortalité des abeilles causé par le frelon asiatique</div>
<div class="impact-source">Dossier de presse officiel mars 2026</div>
</div>
<div class="impact-item">
<div class="impact-val" style="color:var(--estimated)">30%</div>
<div class="impact-label">des colonies peuvent disparaître à l'échelle nationale chaque année dans les cas les plus sévères</div>
<div class="impact-source">Plan national mars 2026</div>
</div>
<div class="impact-item">
<div class="impact-val" style="color:var(--estimated)">10 kg</div>
<div class="impact-label">d'insectes consommés par nid sur une saison, soit >100 000 individus</div>
<div class="impact-source">UNAF / Plan national 2026</div>
</div>
<div class="impact-item" style="grid-column:1/-1;">
<div class="impact-val" style="color:var(--verified); font-size:22px">85% de l'alimentation</div>
<div class="impact-label">est composée d'abeilles, guêpes et mouches — dont 40% d'abeilles domestiques. Les 60% restants : diptères, hyménoptères, lépidoptères — autant de pollinisateurs sauvages déjà en déclin documenté en Europe.</div>
<div class="impact-source">Dossier de presse — Ministère de la Transition Écologique, mars 2026</div>
</div>
</div>
</div>
<!-- MILESTONES -->
<div class="card">
<div class="card-title">Chronologie clé</div>
<div class="card-heading">Jalons de l'invasion & réponse institutionnelle</div>
<div class="milestones">
<div class="milestone">
<div class="milestone-year">2004</div>
<div class="milestone-text">2 premiers nids, Lot-et-Garonne. Introduction via poteries chinoises. Une unique reine fécondée à l'origine de toute l'invasion.</div>
<div class="milestone-source">SOURCE : INPN/MNHN (Rome & Villemant, 2006) · Dossier de presse officiel 2026</div>
</div>
<div class="milestone">
<div class="milestone-year">2006</div>
<div class="milestone-text">13 départements touchés. Premiers signalements apiculteurs. Progression : ~78 km/an.</div>
<div class="milestone-source">SOURCE : MNHN / INPN</div>
</div>
<div class="milestone est">
<div class="milestone-year">2010</div>
<div class="milestone-text">~40 départements. Milliers de nids estimés. Premiers nids en Espagne (Pays basque).</div>
<div class="milestone-source">SOURCE : PAT Frelons / AAAFA</div>
</div>
<div class="milestone">
<div class="milestone-year">2012</div>
<div class="milestone-text">56 départements. Classé espèce exotique envahissante et danger sanitaire 2ème catégorie.</div>
<div class="milestone-source">SOURCE : Assemblée nationale Q5422 / Code rural</div>
</div>
<div class="milestone est">
<div class="milestone-year">2015</div>
<div class="milestone-text">~75 départements. Centaines de milliers de nids. Présence en 5 pays européens.</div>
<div class="milestone-source">SOURCE : PAT Frelons / MNHN</div>
</div>
<div class="milestone">
<div class="milestone-year">202022</div>
<div class="milestone-text">Quasi-totalité du territoire colonisé. Manche : 9 924 nids signalés en 2022 (pic). Plan OVS/FREDON publié.</div>
<div class="milestone-source">SOURCE : FREDON France / FDGDON Manche</div>
</div>
<div class="milestone est">
<div class="milestone-year">202324</div>
<div class="milestone-text">7 500 → 13 000 nids signalés (+78%). ~500 000 nids estimés. Hongrie atteinte. 9 pays européens.</div>
<div class="milestone-source">SOURCE : SignalNids / plateforme nationale / Dossier presse officiel 2026</div>
</div>
<div class="milestone official">
<div class="milestone-year">Mars 2025</div>
<div class="milestone-text">Loi n°2025-237 : déclaration des nids obligatoire. 12M€ de compensations aux apiculteurs.</div>
<div class="milestone-source">SOURCE : Légifrance — Loi n°2025-237 du 14 mars 2025</div>
</div>
<div class="milestone official">
<div class="milestone-year">Mars 2026</div>
<div class="milestone-text">Plan national lancé : 3M€/an sur 6 ans. Réseau de référents départementaux. Guichet dédié ouvert le 1er mai. Éradication officiellement écartée.</div>
<div class="milestone-source">SOURCE : Dossier de presse — Ministère de la Transition Écologique</div>
</div>
</div>
</div>
<!-- BIOLOGIE -->
<div class="card">
<div class="card-title">Biologie de la colonisation</div>
<div class="card-heading">Pourquoi la population ne plafonne pas</div>
<div style="display:grid; gap:12px; margin-top:4px;">
<div style="display:flex; gap:12px; align-items:flex-start; padding:12px; background:var(--surface2); border:1px solid var(--border); border-left:3px solid var(--accent);">
<div style="font-size:22px;flex-shrink:0">🐝</div>
<div>
<div style="font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);margin-bottom:4px">Reproduction explosive</div>
<div style="font-size:12px;font-weight:300;line-height:1.5;color:var(--text)">Chaque nid mature libère <strong style="color:var(--accent)">500 à 1 500 reines fondatrices</strong> par saison (Rome et al., 2015). Mortalité printanière élevée, mais le surplus compense très largement.</div>
</div>
</div>
<div style="display:flex; gap:12px; align-items:flex-start; padding:12px; background:var(--surface2); border:1px solid var(--border); border-left:3px solid var(--estimated);">
<div style="font-size:22px;flex-shrink:0">📊</div>
<div>
<div style="font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--estimated);margin-bottom:4px">Production par nid</div>
<div style="font-size:12px;font-weight:300;line-height:1.5;color:var(--text)">Jusqu'à <strong style="color:var(--estimated)">13 000 individus</strong> sur la saison (max 2 000 adultes simultanés en octobre). Taille corrélée au nombre d'individus (MNHN, 2015).</div>
</div>
</div>
<div style="display:flex; gap:12px; align-items:flex-start; padding:12px; background:var(--surface2); border:1px solid var(--border); border-left:3px solid var(--verified);">
<div style="font-size:22px;flex-shrink:0">🌍</div>
<div>
<div style="font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--verified);margin-bottom:4px">Absence de prédateurs spécifiques</div>
<div style="font-size:12px;font-weight:300;line-height:1.5;color:var(--text)">Confirmé par le plan national 2026. Grande plasticité écologique : urbain, rural, altitude croissante avec le réchauffement climatique.</div>
</div>
</div>
<div style="display:flex; gap:12px; align-items:flex-start; padding:12px; background:var(--surface2); border:1px solid var(--border); border-left:3px solid var(--projected);">
<div style="font-size:22px;flex-shrink:0">⚠️</div>
<div>
<div style="font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--projected);margin-bottom:4px">Piégeage : efficacité très limitée</div>
<div style="font-size:12px;font-weight:300;line-height:1.5;color:var(--text)">MNHN/ITSAP : piégeage printanier laisse place à d'autres fondatrices. <strong style="color:var(--projected)">>99%</strong> des captures sont des insectes non-cibles (pièges bouteille). Le plan 2026 impose les pièges sélectifs.</div>
</div>
</div>
</div>
<div class="alert" style="margin-top:16px;">
<div class="alert-icon">🔬</div>
<div class="alert-body">
<strong>Aucun plafond démographique identifié à ce jour.</strong> Le dossier officiel de mars 2026 confirme que l'éradication n'est plus envisageable. Les modèles prévoient une invasion quasi-totale de l'Europe occidentale d'ici 10 ans (CNRS).
</div>
</div>
</div>
<!-- CARTE SIGNALNIDS -->
<div class="map-card no-print">
<div class="map-header">
<div>
<div class="card-title" style="margin-bottom:4px">Carte de signalement en temps réel</div>
<div class="card-heading" style="margin-bottom:0;border-bottom:none;padding-bottom:0">Nids déclarés — SignalNids.fr</div>
</div>
<a class="map-link" href="https://signalnids.fr/carte/" target="_blank" rel="noopener">Ouvrir la carte complète ↗</a>
</div>
<div class="map-frame-wrap">
<iframe
src="https://signalnids.fr/carte/"
title="Carte interactive des nids de frelons asiatiques — SignalNids.fr"
loading="lazy"
sandbox="allow-scripts allow-same-origin allow-forms allow-popups"
></iframe>
<div class="map-overlay">Carte interactive · Cliquer pour interagir · Données temps réel : SignalNids.fr</div>
</div>
<div class="map-footer">
<div class="map-credit">Source : <strong>SignalNids.fr</strong> · Plateforme de signalement participatif · Mise à jour en temps réel · Données non officielles</div>
<a class="map-link" href="https://signalnids.fr/carte/" target="_blank" rel="noopener">signalnids.fr/carte/ ↗</a>
</div>
</div>
<!-- ALERTE MÉTHODOLOGIQUE -->
<div class="alert" style="grid-column:1/-1; margin:0;">
<div class="alert-icon">📌</div>
<div class="alert-body">
<strong>Limites méthodologiques :</strong> les données de signalement ne représentent que 5 à 10% des nids réels. Il n'existe pas de comptage national exhaustif. Les estimations de population totale sont des extrapolations — ordres de grandeur, non des valeurs précises. Sources primaires scientifiques : INPN/MNHN (Rome, Villemant et al.) · Données officielles : Dossier de presse Plan national — Ministère de la Transition Écologique, mars 2026.
</div>
</div>
</div><!-- /main -->
<!-- ═══ SOURCES ═════════════════════════════════════════════════════════════ -->
<div class="sources">
<div class="sources-label">Sources</div>
<a class="source-chip verified" href="https://frelonasiatique.mnhn.fr/" target="_blank" rel="noopener">MNHN/INPN · Rome &amp; Villemant</a>
<a class="source-chip official" href="https://www.ecologie.gouv.fr/politiques-publiques/produits-biocides" target="_blank" rel="noopener">Plan national · Ministère TE · Mars 2026</a>
<a class="source-chip verified" href="https://questions.assemblee-nationale.fr/q16/16-5422QE.htm" target="_blank" rel="noopener">Assemblée nationale Q16-5422</a>
<a class="source-chip verified" href="https://www.inee.cnrs.fr/fr/cnrsinfo/invasion-du-frelon-asiatique-en-france-le-cout-de-la-lutte" target="_blank" rel="noopener">CNRS Écologie &amp; Environnement</a>
<a class="source-chip" href="https://www.fdgdon50.com/Frelons-asiatiques" target="_blank" rel="noopener">FDGDON Manche · bilans annuels</a>
<a class="source-chip" href="https://www.patfrelons.fr/evolution-du-frelon-asiatique-en-france-et-en-europe/" target="_blank" rel="noopener">PAT Frelons</a>
<a class="source-chip" href="https://signalnids.fr/journal/frelon-asiatique-chiffres-2026/" target="_blank" rel="noopener">SignalNids.fr</a>
<a class="source-chip" href="https://frelonasiatique.mnhn.fr/plan-national-de-lutte-des-ovs-2024/" target="_blank" rel="noopener">FREDON France / GDS France</a>
<a class="source-chip official" href="https://www.legifrance.gouv.fr/jorf/id/JORFTEXT000051254501" target="_blank" rel="noopener">Loi n°2025-237 · 14 mars 2025</a>
<a class="source-chip" href="https://www.plateforme-esa.fr/fr/frelon-asiatique" target="_blank" rel="noopener">ITSAP / Plateforme ESA</a>
</div>
<script>
// ═══ CHART 1 — DÉPARTEMENTS ════════════════════════════════════════════════
new Chart(document.getElementById('deptChart').getContext('2d'), {
type: 'bar',
data: {
labels: [2004,2006,2008,2010,2012,2014,2016,2018,2020,2022,2025],
datasets: [{
data: [1,13,30,40,56,67,78,88,95,100,101],
backgroundColor: [2004,2006,2008,2010,2012,2014,2016,2018,2020,2022,2025].map(y => y<=2020?'rgba(45,122,74,0.75)':'rgba(184,134,11,0.75)'),
borderColor: [2004,2006,2008,2010,2012,2014,2016,2018,2020,2022,2025].map(y => y<=2020?'#2d7a4a':'#b8860b'),
borderWidth: 1.5, borderRadius: 1
}]
},
options: {
responsive: true, maintainAspectRatio: false,
plugins: {
legend: { display: false },
tooltip: {
backgroundColor:'#fff', borderColor:'#ddd8cc', borderWidth:1,
titleColor:'#b8860b', bodyColor:'#1a1a14',
titleFont:{family:"'IBM Plex Mono',monospace",size:10},
bodyFont:{family:"'Source Serif 4',serif",size:12},
callbacks: {
title: i => `Année ${i[0].label}`,
label: i => ` ${i.raw} départements / 101`,
afterLabel: i => i.label<=2020 ? ' ✓ Source : MNHN/INPN' : ' ~ Sources multiples consolidées'
}
}
},
scales: {
x: { grid:{color:'rgba(0,0,0,0.07)'}, ticks:{color:'#7a7060',font:{family:"'IBM Plex Mono',monospace",size:9}}, border:{color:'#ddd8cc'} },
y: { min:0, max:101, grid:{color:'rgba(0,0,0,0.07)'}, ticks:{color:'#7a7060',font:{family:"'IBM Plex Mono',monospace",size:9}, callback:v=>v+' dép.'}, border:{color:'#ddd8cc'} }
}
}
});
// ═══ CHART 2 — NIDS + PROJECTION ══════════════════════════════════════════
new Chart(document.getElementById('nidsChart').getContext('2d'), {
type: 'bar',
data: {
labels: [2020,2021,2022,2023,2024,2025,2026],
datasets: [
{
type:'bar', label:'Signalements confirmés',
data:[null,null,null,7500,13000,14000,null],
backgroundColor:'rgba(45,122,74,0.75)', borderColor:'#2d7a4a',
borderWidth:1.5, borderRadius:1, yAxisID:'y', order:2
},
{
type:'bar', label:'Estimation totale 2024',
data:[null,null,null,null,500000,null,null],
backgroundColor:'rgba(184,134,11,0.13)', borderColor:'rgba(184,134,11,0.5)',
borderWidth:1.5, borderRadius:1, yAxisID:'y', order:3
},
{
type:'bar', label:'Projection 2026',
data:[null,null,null,null,null,null,300000],
backgroundColor:'rgba(201,79,26,0.13)', borderColor:'rgba(201,79,26,0.55)',
borderWidth:1.5, borderRadius:1, yAxisID:'y', order:4
},
{
type:'line', label:'Tendance +15-20%/an',
data:[null,null,null,7500,13000,15000,17500],
borderColor:'rgba(201,79,26,0.65)', borderWidth:2, borderDash:[5,4],
pointBackgroundColor:'rgba(201,79,26,0.7)',
pointRadius:[0,0,0,4,4,4,4], pointHoverRadius:6,
fill:false, tension:0.35, yAxisID:'y', order:1
}
]
},
options: {
responsive:true, maintainAspectRatio:false,
plugins: {
legend:{display:false},
tooltip:{
backgroundColor:'#fff', borderColor:'#ddd8cc', borderWidth:1,
titleColor:'#b8860b', bodyColor:'#1a1a14',
titleFont:{family:"'IBM Plex Mono',monospace",size:10},
bodyFont:{family:"'Source Serif 4',serif",size:11},
callbacks: {
title: i => `Année ${i[0].label}`,
label: item => {
if(item.raw===null||item.raw===undefined) return null;
const k = item.raw>=1000 ? `${(item.raw/1000).toFixed(0)}k` : item.raw;
return [' Signalés : ',' Estimés totaux : ~',' Projection : ~',' Tendance : ~'][item.datasetIndex]+k+' nids';
},
afterLabel: item => {
if(item.datasetIndex===1) return ' ⚠ Extrapolation — non officiel';
if(item.datasetIndex===2) return ' ⚠ Projection — non officielle';
return '';
}
},
filter: item => item.raw!==null && item.raw!==undefined
}
},
scales: {
x: { grid:{color:'rgba(0,0,0,0.07)'}, ticks:{color:'#7a7060',font:{family:"'IBM Plex Mono',monospace",size:9}}, border:{color:'#ddd8cc'} },
y: { min:0, grid:{color:'rgba(0,0,0,0.07)'}, ticks:{color:'#7a7060',font:{family:"'IBM Plex Mono',monospace",size:9}, callback:v=>v>=1000?`${(v/1000).toFixed(0)}k`:v}, border:{color:'#ddd8cc'} }
}
}
});
// ═══ CHART 3 — MANCHE ══════════════════════════════════════════════════════
new Chart(document.getElementById('mancheChart').getContext('2d'), {
type: 'bar',
data: {
labels: ['2022','2023','2024'],
datasets: [{
data: [9924,7077,5083],
backgroundColor: ['rgba(201,79,26,0.7)','rgba(45,122,74,0.65)','rgba(45,122,74,0.65)'],
borderColor: ['#c94f1a','#2d7a4a','#2d7a4a'],
borderWidth:1.5, borderRadius:1
}]
},
options: {
responsive:true, maintainAspectRatio:false,
plugins: {
legend:{display:false},
tooltip:{
backgroundColor:'#fff', borderColor:'#ddd8cc', borderWidth:1,
titleColor:'#b8860b', bodyColor:'#1a1a14',
titleFont:{family:"'IBM Plex Mono',monospace",size:10},
bodyFont:{family:"'Source Serif 4',serif",size:12},
callbacks:{
title: i => `Manche (50) — ${i[0].label}`,
label: item => ` ${item.raw.toLocaleString('fr-FR')} nids localisés & signalés`,
afterLabel: () => ' Source : FDGDON Manche — bilan annuel'
}
}
},
scales: {
x: { grid:{color:'rgba(0,0,0,0.07)'}, ticks:{color:'#7a7060',font:{family:"'IBM Plex Mono',monospace",size:9}}, border:{color:'#ddd8cc'} },
y: { min:0, grid:{color:'rgba(0,0,0,0.07)'}, ticks:{color:'#7a7060',font:{family:"'IBM Plex Mono',monospace",size:9}, callback:v=>v.toLocaleString('fr-FR')}, border:{color:'#ddd8cc'} }
}
}
});
</script>
</body>
</html>

Binary file not shown.

BIN
files.zip

Binary file not shown.