feat: graph T° interactif + widget iframe + MF auth + E2E Playwright

Graph T° (TemperatureChartInteractive.astro) :
- Onglets 24 h / 7 j / 30 j (toggle JS, séries serialisées au SSR)
- Hover vertical line + tooltip valeurs
- Overlay normales mois en pointillé (TX orange, TN bleu)
- Onglet 24 h dispo seulement si l'API MF a répondu (best-effort)

Météo France OAuth2 (lib/meteofrance-auth.ts + observations.ts) :
- client_credentials avec refresh auto, cache token Valkey
- Fallback METEOFRANCE_STATIC_TOKEN pour debug
- /synop endpoint pour 24h horaires par station SYNOP du dept
- Mapping dept → station SYNOP la plus proche (src/data/stations-synop.json)
- En attente de creds : SDK skip silencieusement, l'onglet 24h n'apparaît pas

Widget iframe (/embed/dept/[code] + /embed doc) :
- Layout minimal sans header/footer global
- Réutilisable via iframe avec une ligne
- Page /embed avec snippet copier-coller + aperçu live

Tests E2E Playwright (tests/e2e/) :
- home (carte 96 paths, tooltip dept, navigation)
- api (health, vigilance, vigilance/dept)
- departement (tabs période, DROM notice, 404)
- static pages (a-propos, mentions, dependances, soutenir, conseils, embed)
- embed widget (rendu minimal, headers X-Frame OK)
- 20+ tests, run via pnpm test:e2e (live) ou test:e2e:local

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

src/pages/embed/dept/[code].astro

@@ -0,0 +1,79 @@
+---
+import Embed from '../../../layouts/Embed.astro';
+import VigilanceChip from '../../../components/VigilanceChip.astro';
+import { getVigilanceSnapshot, alertsForDepartement, maxColorByDepartement } from '../../../lib/vigilance';
+import { getDepartement, isDrom } from '../../../lib/departements';
+import { COLORS } from '../../../lib/phenomena';
+
+export const prerender = false;
+
+const { code } = Astro.params;
+const dept = code ? getDepartement(code.toUpperCase()) : undefined;
+if (!dept) {
+  return new Response('not found', { status: 404 });
+}
+
+let alerts = [] as Awaited<ReturnType<typeof alertsForDepartement>>;
+let maxColor = 1;
+let error: string | null = null;
+if (!isDrom(dept.code)) {
+  try {
+    const snap = await getVigilanceSnapshot();
+    alerts = alertsForDepartement(snap, dept.code, 'J').sort((a, b) => b.colorId - a.colorId);
+    maxColor = maxColorByDepartement(snap, 'J').get(dept.code) ?? 1;
+  } catch (e) {
+    error = (e as Error).message;
+  }
+}
+
+const color = COLORS[maxColor as 1 | 2 | 3 | 4];
+const siteUrl = `https://info-canicule.nocleus.com/departement/${dept.code}`;
+---
+
+<Embed title={`Vigilance ${dept.name} — Info Canicule`}>
+  <article class="rounded-lg border border-slate-200 bg-white p-4 shadow-sm">
+    <header class="flex items-center justify-between gap-3 border-b border-slate-100 pb-2">
+      <div>
+        <h1 class="text-base font-semibold text-slate-900">{dept.name}</h1>
+        <p class="text-xs text-slate-500">Vigilance Météo France · dept {dept.code}</p>
+      </div>
+      <div
+        class="rounded px-2 py-1 text-xs font-semibold"
+        style={`background:${color.hex}; color:${maxColor >= 3 ? '#fff' : '#1e293b'}`}
+      >
+        {color.name.toUpperCase()}
+      </div>
+    </header>
+
+    {error && (
+      <p class="mt-2 text-xs text-red-700">Données indisponibles.</p>
+    )}
+
+    {isDrom(dept.code) && (
+      <p class="mt-2 text-xs text-amber-800">
+        Vigilance Outre-mer non couverte par cette source.
+        <a href="https://vigilance.meteofrance.fr/" rel="noopener" class="text-canicule-700">Source officielle ↗</a>
+      </p>
+    )}
+
+    {!error && !isDrom(dept.code) && alerts.length === 0 && (
+      <p class="mt-2 text-xs text-green-700">Aucune vigilance particulière aujourd'hui.</p>
+    )}
+
+    {alerts.length > 0 && (
+      <ul class="mt-2 space-y-1">
+        {alerts.map((a) => (
+          <li>
+            <VigilanceChip colorId={a.colorId} phenomenonId={a.phenomenonId} />
+          </li>
+        ))}
+      </ul>
+    )}
+
+    <footer class="mt-3 border-t border-slate-100 pt-2 text-right text-xs">
+      <a href={siteUrl} target="_top" rel="noopener" class="text-canicule-700">
+        Détail sur info-canicule.nocleus.com →
+      </a>
+    </footer>
+  </article>
+</Embed>