Refonte : templates, balades, photos web, aperçus, carte globale

- Mise en page sortie du Python : Scripts/templates/ (Jinja2 + CSS/JS
  communs copiés dans assets/ de chaque voyage)
- Voyages rangés dans un sous-dossier (Balades/…) : rubriques sur
  l'accueil, 2 plus récents par rubrique, pages voyages.html et
  balades.html
- prepare_web.py : photos allégées (photos_web/) et images d'aperçu
  des vidéos (apercus/)
- Voyage d'une seule journée : la page du voyage est la carte du jour
- Carte globale de l'accueil (OpenStreetMap) : voyages du site + cartes
  Google My Maps récupérées (mymaps.txt, _mymaps/), moto par voyage
  (moto.txt)
- KML par voyage pour My Maps
- compress.sh : réencode une sortie illisible (encodage interrompu) ;
  repli automatique sur l'autre qualité dans la page
- Corrections : CSV vide (voyage sans photo), racine de genere_site.sh,
  fichiers ._ de macOS
- README réécrit, commentaires allégés

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Mf2kATMtqVABHSYdxJMnim

Scripts/templates/fragments.html

@@ -0,0 +1,95 @@
+{#- =============================================================================
+    Morceaux de HTML insérés par genere_carte.py dans les pages folium.
+    Échappement automatique : seules les variables marquées |safe passent telles
+    quelles. Les chemins arrivent déjà encodés pour les URL (quote()).
+    Les styles sont dans carte.css, le comportement dans carte.js.
+    ============================================================================= -#}
+
+{# Feuille de style et script communs, avec un numéro de version pour que les
+   navigateurs ne gardent pas une ancienne copie en cache. #}
+{% macro entete(prefixe, version) -%}
+<link rel="stylesheet" href="{{ prefixe }}assets/carte.css?v={{ version }}">
+<script src="{{ prefixe }}assets/carte.js?v={{ version }}"></script>
+{%- endmacro %}
+
+
+{% macro epingle(couleur, icone) -%}
+<div class="pin" style="--c:{{ couleur }}"><div class="pin-tete"><i class="fa fa-{{ icone }}"></i></div><div class="pin-tige"></div></div>
+{%- endmacro %}
+
+
+{# Popup affichée au clic sur la trace d'une journée (carte générale). #}
+{% macro popup_trace(jour, couleur, lien) -%}
+<div class="popup-trace"><b>📅 {{ jour }}</b><br><a class="btn-jour" style="--c:{{ couleur }}" href="{{ lien }}" target="_top">Détails</a></div>
+{%- endmacro %}
+
+
+{# photos : liste de {nom, src (version web), href (original)} #}
+{% macro popup_photos(photos) -%}
+<div class="slider-container">
+  <div class="slides">
+  {%- for p in photos %}
+    <div class="slide"{% if not loop.first %} style="display:none"{% endif %}>
+      <div class="file-header">{{ p.nom }}</div>
+      <a href="{{ p.href }}" target="_blank"><img src="{{ p.src }}" alt="{{ p.nom }}" loading="lazy"></a>
+    </div>
+  {%- endfor %}
+  </div>
+  {%- if photos|length > 1 %}
+  <button class="nav-btn prev" onclick="moveSlide(this, -1)">&#10094;</button>
+  <button class="nav-btn next" onclick="moveSlide(this, 1)">&#10095;</button>
+  <div class="slide-counter">1/{{ photos|length }}</div>
+  {%- endif %}
+</div>
+{%- endmacro %}
+
+
+{# 720p H.264 chargé par défaut (lisible partout), 1080p HEVC à la demande.
+   preload="none" : rien n'est téléchargé avant l'ouverture de la popup. #}
+{% macro popup_video(nom, mobile, hd, apercu) -%}
+<div class="popup-video">
+  <div class="header-row">
+    <span class="file-name" title="{{ nom }}">{{ nom }}</span>
+    <div class="quality-controls">
+      <span class="quality-btn active-720" data-src="{{ mobile }}" onclick="changeQuality(this)">720p</span>
+      <span class="quality-btn" data-hevc="1" data-src="{{ hd }}" onclick="changeQuality(this)">1080p</span>
+    </div>
+  </div>
+  <video controls playsinline webkit-playsinline preload="none" src="{{ mobile }}" data-fallback="{{ mobile }}"
+         {%- if apercu %} data-poster="{{ apercu }}"{% endif %}></video>
+  <div class="hevc-note">Le 1080p est encodé en H.265/HEVC, que ce navigateur ne sait pas décoder.
+    La lecture en 720p fonctionne normalement ; pour la haute définition, utilise Safari, Chrome ou Edge.</div>
+</div>
+{%- endmacro %}
+
+
+{# contenu : HTML du récit (voyage.md converti), déjà prêt. #}
+{% macro journal(contenu) -%}
+<div id="journal-panel">
+  <button class="close-btn" onclick="toggleJournal(false)">&times;</button>
+  <div class="journal-content">{{ contenu|safe }}</div>
+</div>
+<button class="btn-flottant btn-journal" onclick="toggleJournal(true)">📖 Journal</button>
+{%- endmacro %}
+
+
+{% macro bouton_accueil(lien) -%}
+<a class="btn-flottant btn-accueil" href="{{ lien }}" target="_top">🏠 Accueil</a>
+{%- endmacro %}
+
+
+{% macro bouton_gpx(lien, libelle) -%}
+<a class="btn-flottant btn-gpx" href="{{ lien }}" download>{{ libelle }}</a>
+{%- endmacro %}
+
+
+{# jours : liste de {libelle, lien, couleur} #}
+{% macro barre_jours(retour, jours) -%}
+<nav class="sidebar">
+  <a class="btn-retour" href="{{ retour }}" target="_top">⬅ Retour</a>
+  <div class="sidebar-titre">PAR JOURS</div>
+  {%- for j in jours %}
+  <a class="jour" style="--c:{{ j.couleur }}" href="{{ j.lien }}" target="_top">{{ j.libelle }}</a>
+  {%- endfor %}
+</nav>
+{%- endmacro %}