
@font-face{font-family:"Fraunces";src:url(/fonts/fraunces.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"Karla";src:url(/fonts/karla-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Karla";src:url(/fonts/karla-500.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Karla";src:url(/fonts/karla-600.woff2) format("woff2");font-weight:600 700;font-display:swap}
@font-face{font-family:"JetBrains Mono";src:url(/fonts/jetbrains-mono-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"JetBrains Mono";src:url(/fonts/jetbrains-mono-500.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"JetBrains Mono";src:url(/fonts/jetbrains-mono-600.woff2) format("woff2");font-weight:600 700;font-display:swap}

:root{--sauge:#6B9C8C;--cuivre:#B99B72;--terre:#A9696D;--encre:#F6F7FA;--fond:#101114;--fond2:#191B20;--c:var(--sauge)}
*{box-sizing:border-box}
/* Vu depuis l'application Android : aucun lien de paiement externe
   (Google Play l'interdit). Voir SCRIPT_DETECTION_APPLI plus haut. */
.en-appli .lien-soutenir{display:none}
body{margin:0;background:var(--fond);color:var(--encre);font:400 17px/1.65 Karla,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
/* Fond en halos (20/09, meme refonte que public/index.html - repris a
   l'identique pour que les pages Worker (archives/pays/statistiques/
   methode) ne detonnent pas visuellement avec l'accueil).
   20/09 (suite) : encore plus fondus (opacite .06->.04, flou 120->150px,
   degrade etale a 82%) et reactifs au defilement via --halo-y/--halo-op,
   mises a jour par SCRIPT_HALO_DEFILEMENT plus bas - meme logique et memes
   valeurs que public/index.html, voir son commentaire pour le detail. */
.fondu-page{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;
  --halo-y:0px;--halo-op:1}
.fondu-page::before,.fondu-page::after{content:"";position:absolute;
  width:60vw;height:60vw;border-radius:50%;filter:blur(150px);
  opacity:calc(.04 * var(--halo-op));transition:transform 1s cubic-bezier(.2,.7,.3,1)}
.fondu-page::before{left:-18vw;top:-14vw;background:radial-gradient(circle,#22D3EE,transparent 82%);
  transform:translateY(var(--halo-y))}
.fondu-page::after{right:-18vw;bottom:-10vw;background:radial-gradient(circle,#3B82F6,transparent 82%);
  transform:translateY(calc(var(--halo-y) * -0.65))}
.fondu-page .grain{position:absolute;inset:0;opacity:.05;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
@media(max-width:700px){.fondu-page{display:none}}
@media(prefers-reduced-motion:reduce){.fondu-page::before,.fondu-page::after{transition:none}}
a{color:inherit}
h1,h2,h3,.marque{font-family:Fraunces,Georgia,serif;font-weight:600;line-height:1.2}
.chiffre{font-family:"JetBrains Mono",ui-monospace,monospace}
.entete{max-width:44rem;margin:0 auto;padding:3rem 1.25rem 1.5rem}
.marque{display:inline-flex;align-items:center;gap:.45rem;text-decoration:none;font-size:1.05rem;letter-spacing:.04em;opacity:.75;margin-bottom:2rem}
.marque svg{flex-shrink:0}
.entete h1{font-size:clamp(1.9rem,5vw,2.7rem);margin:0}
.entete .date{opacity:.6;margin:.4rem 0 1.5rem}
.periode-selecteur{display:inline-flex;gap:.3rem;margin:0 0 1.5rem;
  border:1px solid rgba(246,247,250,.2);border-radius:99px;padding:.15rem}
.periode-selecteur a{padding:.2rem .65rem;border-radius:99px;font-weight:600;
  font-size:.78rem;letter-spacing:.02em;text-decoration:none;opacity:.75}
.periode-selecteur a:hover{opacity:1}
.periode-selecteur a[aria-current]{background:rgba(246,247,250,.5);color:var(--fond);opacity:1}
.pastilles{display:flex;gap:1.25rem;flex-wrap:wrap}
.pastille{display:flex;align-items:center;gap:.5rem;font-size:.92rem;opacity:.9}
.pastille .rond{width:.7rem;height:.7rem;border-radius:50%;background:var(--c);display:inline-block;flex:none}
.jours .rond{width:.7rem;height:.7rem;border-radius:50%;background:var(--cv,var(--c));display:inline-block;flex:none}
.ecart{margin:1.25rem 0 0;opacity:.7;font-style:italic}
.frise{max-width:44rem;margin:0 auto;padding:1.5rem 1.25rem;border-top:1px solid rgba(246,247,250,.12);
  border-image:linear-gradient(90deg,transparent,rgba(246,247,250,.12) 15%,rgba(246,247,250,.12) 85%,transparent) 1}
.frise h2{font-size:.8rem;text-transform:uppercase;letter-spacing:.12em;opacity:.66;margin:0 0 .75rem;font-family:Karla,sans-serif;font-weight:600}
.jalons{display:flex;gap:3px;flex-wrap:wrap}
.jalon{display:block;padding:3px 1px;position:relative}
.jalon span{display:block;width:9px;height:22px;border-radius:2px;background:var(--c);opacity:.82;transition:opacity .15s}
.jalon:hover span,.jalon.actif span{opacity:1}
.jalon.actif span{box-shadow:0 0 0 2px var(--encre)}
/* 20/09 : un peu d'animation sur les pages archives/jour/statistiques,
   demandee par Benjamin ("rendre le site plus vivant") - meme technique
   que .point-strate/.ascenseur-poignee sur index.html (pseudo-element
   anime en transform+opacity, compose par le GPU, pas de cout de repaint
   recurrent). Seule la journee actuellement affichee pulse - un repere
   discret, pas une animation generalisee a toute la frise. */
.jalon.actif::after{content:"";position:absolute;inset:1px -1px;
  border-radius:2px;border:1px solid var(--encre);
  animation:pulse-jalon 2.4s ease-in-out infinite;pointer-events:none}
@keyframes pulse-jalon{
  0%{transform:scaleY(1);opacity:.6}
  50%,100%{transform:scaleY(1.25);opacity:0}
}
@media(prefers-reduced-motion:reduce){.jalon.actif::after{animation:none}}
.corps{max-width:44rem;margin:0 auto;padding:0 1.25rem 3rem}
.onglet,.indicateurs{margin:3rem 0 0}
.bandeau{background:var(--fond2);border-left:4px solid var(--c);border-radius:.4rem;padding:1.1rem 1.25rem 1.1rem 1.1rem;margin-bottom:1.5rem}
.bandeau h2{margin:0;font-size:1.35rem;color:var(--c)}
.bandeau p{margin:.35rem 0 0;font-size:.95rem;opacity:.9}

/* Grille "Indicateurs" : regroupe Marches, Cyber et les nouvelles
   sources deterministes (Catastrophes/GDACS, Espace/NOAA,
   Connectivite/IODA) en cartes compactes plutot qu'en sections pleine
   largeur empilees, pour garder la page courte. auto-fit/minmax laisse
   1 ou 2 colonnes s'installer seules selon la largeur de .corps. */
.bandeau-neutre{border-bottom:1px solid rgba(246,247,250,.14);
  padding-bottom:.6rem;margin-bottom:.3rem}
.bandeau-neutre h2{margin:0;font-size:1.35rem}
.grille-indicateurs{display:grid;
  grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));
  gap:1.1rem;margin-top:1.4rem}
.carte-indicateur{display:block;border:1px solid rgba(246,247,250,.14);
  border-radius:.6rem;padding:1.2rem 1.3rem;min-width:0}
.carte-indicateur .bandeau{padding:.7rem .9rem;margin-bottom:1rem}
.carte-indicateur .bandeau h2{font-size:1.05rem;display:flex;align-items:baseline;
  justify-content:space-between;gap:.5rem}
.stat-variation{font-family:"JetBrains Mono",ui-monospace,monospace;font-size:.78rem;font-weight:600}
.carte-indicateur .chapeau{font-size:.82rem;margin-bottom:.9rem}
.carte-indicateur table{font-size:.85rem}
.lanes{margin-bottom:1rem}
.lane{display:flex;align-items:center;gap:.9rem;margin-bottom:.5rem}
.lane-nom{width:9.5rem;flex:none;font-size:.82rem;opacity:.7}
.lane-cases{display:flex;gap:2px;flex-wrap:wrap}
.case{width:8px;height:16px;border-radius:2px;background:var(--c);display:inline-block}
.mini-graphe{width:100%;height:5.5rem;display:block;margin:.5rem 0 .7rem}
/* Boite plus haute pour les courbes (grille + reperes de dates, voir
   svgLigne()) : sans texte, les barres n'en ont pas besoin. Rapport
   largeur/hauteur choisi proche de celui du viewBox de svgLigne
   (640x220, ~2.9:1) pour qu'un preserveAspectRatio par defaut (donc pas
   d'etirement du texte) ne laisse quasiment pas de marge morte sur la
   largeur reelle d'une carte (~300px ici). */
.mini-graphe-ligne{height:8.5rem}
/* Affordance de survol/appui (20/09/2026, a la demande de Benjamin, en
   deux temps : "pas assez voyant" puis "inutilisable au telephone" - un
   <title> SVG natif ne se declenche pas de facon fiable au toucher, quel
   que soit son style CSS). Le point visible de chaque journee grossit et
   s'eclaircit au survol/focus de sa cible, chaque colonne de barre
   s'eclaircit de meme - et surtout, scriptLectureGraphiques() (voir plus
   bas) ecrit la valeur en clair dans .lecture-valeur au clic, au
   toucher, au survol ET au focus clavier : la seule des quatre voies qui
   marche vraiment sur mobile est le clic/toucher. */
.pt-cible,.barre-cible,.zone-lecture{cursor:pointer;pointer-events:all}
.pt-point{opacity:.55;transition:r .12s ease,opacity .12s ease,filter .12s ease}
.pt-extreme{opacity:1}
/* Grossissement plus marque (20/09/2026, retour de Benjamin, deux fois :
   "encore agrandir le point") - r presque quintuple (2 -> 9.5, extreme
   3 -> 9.5) et une lueur (drop-shadow) pour que le point actif ressorte
   nettement du reste de la courbe. Cette regle CSS ne s'applique qu'aux
   navigateurs qui supportent "r" comme propriete CSS (Safari ne le
   fait pas de facon fiable) - le vrai grossissement, garanti partout,
   est pilote en JS par agrandir() dans scriptLectureGraphiques() plus
   bas ; cette regle reste comme filet pour la souris sur les
   navigateurs qui la supportent, avant meme que le JS reagisse. */
.pt-groupe:hover .pt-point,.pt-groupe:focus-within .pt-point,.pt-groupe.pt-actif .pt-point{
  r:9.5;opacity:1;filter:drop-shadow(0 0 5px rgba(246,247,250,.9))}
.mini-graphe rect.barre{transition:filter .12s ease}
.barre-groupe:hover rect.barre,.barre-groupe:focus-within rect.barre,.barre-groupe.barre-actif rect.barre{filter:brightness(1.5)}
.pt-cible:focus-visible,.barre-cible:focus-visible{outline:2px solid var(--encre);outline-offset:1px}
/* Encart de lecture : rempli par scriptLectureGraphiques() au clic/
   toucher/survol/focus d'un point ou d'une barre - c'est LA reponse
   visible a "quelle est la valeur de ce jour-la", contrairement a
   l'infobulle native qui ne s'affiche pas de facon fiable au toucher.
   Contenu par defaut = invite a interagir (voir stats.lectureDefaut). */
.lecture-valeur{font-family:"JetBrains Mono",ui-monospace,monospace;
  font-size:.85rem;font-weight:600;margin:.7rem 0 .3rem;padding:.5rem .7rem;
  border-radius:.4rem;background:var(--fond);border-left:3px solid var(--c);
  opacity:.75;transition:opacity .12s ease}
.lecture-valeur.actif{opacity:1}
.stat-resume{font-size:.8rem;opacity:.7;margin:0}
/* Indice textuel explicite (20/09/2026, retour de Benjamin : le survol
   n'etait pas assez evident) - meme registre que .chapeau des "Couleurs
   par jour" ("Survolez-la pour la date exacte"), juste un ton plus
   discret puisqu'il ne porte pas d'information de contenu. */
.stat-aide{font-size:.78rem;opacity:.66;margin:-.4rem 0 1rem;font-style:italic}
.stat-detail-lien{display:inline-block;margin-top:.6rem;font-size:.82rem}
.fil-ariane{font-size:.8rem;opacity:.6;margin:.3rem 0 0}
.fil-ariane a{color:inherit}
.carte-indicateur-detail .mini-graphe,.carte-indicateur-detail .mini-graphe-ligne{height:11rem}
@media(max-width:560px){
  .carte-indicateur-detail .mini-graphe,.carte-indicateur-detail .mini-graphe-ligne{height:8rem}
}
@media(max-width:560px){
  .lane{flex-direction:column;align-items:flex-start;gap:.3rem}
  .lane-nom{width:auto}
}
.liste-sobre{list-style:none;padding:0;margin:0}
.liste-sobre li{padding:.55rem 0;border-top:1px solid rgba(246,247,250,.1);
  font-size:.85rem;opacity:.85}
.liste-sobre li:first-child{border-top:0}
.liste-sobre b{font-weight:600;opacity:1}
.point{display:inline-block;width:.5rem;height:.5rem;border-radius:50%;
  background:var(--c);vertical-align:middle;margin-right:.4rem}
.evenement{padding:1.5rem 0;border-top:1px solid rgba(246,247,250,.1)}
.evenement:first-of-type{border-top:0}
.entete-evenement{display:flex;align-items:flex-start;justify-content:space-between;gap:.7rem}
.evenement h3{font-size:1.2rem;margin:0}
.entete-actions{display:flex;align-items:center;gap:.5rem;flex:none;padding-top:.15rem}
.badge-sources{font-size:.72rem;opacity:.6;white-space:nowrap}
.lien-article{flex:none;width:1.8rem;height:1.8rem;border-radius:50%;
  border:1px solid rgba(246,247,250,.25);background:none;color:var(--encre);
  font-size:.8rem;line-height:1;cursor:pointer;opacity:.75;transition:.18s}
.lien-article:hover,.lien-article:focus-visible{opacity:1;border-color:var(--encre)}
.lien-article.copie{opacity:1;color:var(--sauge);border-color:var(--sauge)}
.lieux{margin:.5rem 0 .6rem;display:flex;gap:.4rem;flex-wrap:wrap}
/* Badges pleins, colores par la couleur de l'evenement (--c) : date, rubrique
   et pays sont un classement, pas un lien externe. Meme logique de badge
   plein que .cve-score, pour que la couleur (vert/orange/rouge) saute aux
   yeux et se distingue nettement des sources en bas (voir .references). */
/* Pastille teintee, pas en aplat plein : meme traitement que .niveau dans
   public/index.html (deja valide par Benjamin) - fond tres leger de la
   couleur, texte dans la couleur, aucune bordure. Un aplat plein "criait"
   a l'ecran, la teinte legere reste lisible et beaucoup plus sobre. */
.lieu{font-size:.78rem;font-weight:600;letter-spacing:.03em;padding:.15rem .6rem;
  border:none;border-radius:1rem;background:color-mix(in srgb, var(--c) 16%, transparent);
  color:var(--c);text-decoration:none;transition:.18s;opacity:1}
a.lieu:hover,a.lieu:focus-visible{background:color-mix(in srgb, var(--c) 26%, transparent)}
.resume{margin:0 0 .75rem}
.pourquoi{margin:0 0 .9rem;font-size:.95rem;opacity:.8;background:var(--fond2);padding:.85rem 1rem;border-radius:.45rem;border-left:3px solid var(--c)}
/* Sources : forme carree (pas une pilule) et icone de lien en tete, pour ne
   jamais se confondre avec les badges .lieu ci-dessus, meme d'un coup d'oeil
   sur mobile. Neutres (pas de couleur --c) : ce sont des liens sortants, pas
   un classement editorial. */
.references{list-style:none;padding:0;margin:0;display:flex;gap:.5rem;flex-wrap:wrap}
.references a{font-size:.82rem;text-decoration:none;padding:.2rem .6rem;border:1px solid rgba(246,247,250,.2);border-radius:.35rem;opacity:.8;display:inline-flex;align-items:center;gap:.3rem}
.references a:hover{opacity:1;border-color:var(--encre)}
.references a::before{content:"🔗";font-size:.85em}
.marches table{width:100%;border-collapse:collapse;font-size:.95rem}
.marches th[scope=row]{text-align:left;font-weight:400;padding:.55rem 0}
.marches td{text-align:right;padding:.55rem 0}
.marches thead th{font-size:.75rem;text-transform:uppercase;letter-spacing:.1em;opacity:.66;text-align:right;padding-bottom:.5rem}
.marches thead th:first-child{text-align:left}
.marches tbody tr{border-top:1px solid rgba(246,247,250,.1)}
.hausse{color:#34D399}.baisse{color:#F87171}
.cve{border-top:1px solid rgba(246,247,250,.1);padding:1.25rem 0}
.cve:first-of-type{border-top:0}
.cve-entete{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;margin-bottom:.4rem}
.cve-id{font-family:"JetBrains Mono",monospace;font-size:.82rem;opacity:.75}
.cve-score{font-size:.68rem;letter-spacing:.06em;text-transform:uppercase;border-radius:1rem;padding:.2rem .55rem;background:color-mix(in srgb, var(--c) 18%, transparent);color:var(--c);font-weight:600}
.cve-titre{font-weight:600;margin:0 0 .3rem}
.cve-detail{opacity:.75;font-size:.9rem;margin:0 0 .5rem}
.cve-lien{font-size:.85rem;text-decoration:none;opacity:.75;border-bottom:1px solid rgba(246,247,250,.2)}
.cve-lien:hover{opacity:1}
.avertissement{font-size:.78rem;opacity:.66;margin-top:1.25rem;line-height:1.5}
.navigation{max-width:44rem;margin:0 auto;padding:2rem 1.25rem;display:flex;justify-content:space-between;gap:1rem;border-top:1px solid rgba(246,247,250,.12);
  border-image:linear-gradient(90deg,transparent,rgba(246,247,250,.12) 15%,rgba(246,247,250,.12) 85%,transparent) 1;font-size:.92rem}
.navigation a{text-decoration:none;opacity:.75}
.navigation a:hover{opacity:1}
.archives .mois{margin:0 0 2.5rem}
.archives h2{font-size:1.15rem;margin:0 0 .9rem;opacity:.8}
.jours{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(11rem,1fr));gap:.35rem}
/* 20/09 : bordure d'accent + legere elevation au survol ajoutees (page
   jugee "austere" par Benjamin) - reprend exactement le traitement deja
   utilise pour .pays-liste a un peu plus bas, pour que les deux pages se
   ressemblent. */
.jours a{display:flex;align-items:center;gap:.55rem;text-decoration:none;
  padding:.45rem .6rem;border-radius:.35rem;opacity:.85;
  border:1px solid rgba(246,247,250,.1);border-left:3px solid var(--c);
  transition:.18s}
.jours a:hover{background:var(--fond2);opacity:1;border-color:rgba(246,247,250,.22);
  border-left-color:var(--c);transform:translateY(-1px)}
.pays-recherche{display:block;width:100%;box-sizing:border-box;background:var(--fond2);
  border:1px solid rgba(246,247,250,.14);color:var(--encre);border-radius:.4rem;
  padding:.6rem .85rem;font:400 .95rem/1.4 Karla,system-ui,sans-serif;margin:0 0 1.75rem}
.pays-recherche::placeholder{color:var(--encre);opacity:.66}
.pays-recherche:focus{outline:none;border-color:var(--encre)}
.pays-aucun-resultat{opacity:.6;font-size:.9rem;margin:0 0 1.5rem}
.pays-groupe{margin:0 0 2rem}
.pays-groupe h2{font-size:.8rem;text-transform:uppercase;letter-spacing:.12em;opacity:.66;
  margin:0 0 .75rem;font-family:Karla,sans-serif;font-weight:600}
.pays-liste{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(13rem,1fr));gap:.35rem}
.pays-liste a{display:flex;align-items:center;justify-content:space-between;gap:.6rem;text-decoration:none;
  padding:.55rem .75rem .55rem .65rem;border-radius:.35rem;opacity:.85;
  border:1px solid rgba(246,247,250,.1);border-left:3px solid var(--c);transition:.18s}
.pays-liste a:hover{background:var(--fond2);opacity:1;border-color:rgba(246,247,250,.22);
  border-left-color:var(--c);transform:translateY(-1px)}
.compte{font-family:"JetBrains Mono",ui-monospace,monospace;font-size:.78rem;opacity:.66}
/* Meme pastille teintee que .lieu (page pays uniquement, la date y tient
   lieu de premiere etiquette du groupe). */
.jour-lien{font-size:.78rem;font-weight:600;letter-spacing:.03em;padding:.15rem .6rem;
  border:none;border-radius:1rem;background:color-mix(in srgb, var(--c) 16%, transparent);
  color:var(--c);text-decoration:none;opacity:1}
.jour-lien:hover{background:color-mix(in srgb, var(--c) 26%, transparent)}
.pied{max-width:44rem;margin:0 auto;padding:2rem 1.25rem 4rem;font-size:.85rem;opacity:.66}
.pied a{text-decoration:none}
.langue-selecteur{display:inline-flex;gap:.3rem;margin-left:.6rem;
  border:1px solid rgba(246,247,250,.2);border-radius:99px;padding:.15rem}
.langue-selecteur a{padding:.15rem .5rem;border-radius:99px;font-weight:600;
  font-size:.78rem;letter-spacing:.02em}
.langue-selecteur a[aria-current]{background:rgba(246,247,250,.5);color:var(--fond)}
.visuellement-cache{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
/* 20/09 : animation d'entree, reprise a l'identique de index.html
   (.strates y utilise deja exactement ceci) - Benjamin trouvait les pages
   archives/pays/statistiques "austeres", sans rien qui bouge a l'arrivee
   sur la page. Appliquee au niveau des sections (un mois d'archives, une
   zone geographique, un bloc de la page stats), jamais ligne par ligne :
   meme granularite que sur l'accueil, pas une animation generalisee a
   chaque lien. */
.apparait{animation:monte .5s cubic-bezier(.2,.7,.3,1) backwards}
@keyframes monte{from{opacity:0;transform:translateY(10px)}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}.apparait{animation:none}}
/* =====================================================================
   24/09 - pages Archives / News par pays / Statistiques en "vitrine"
   Demande de Benjamin : que ces trois onglets ne fassent plus "onglets
   de seconde zone", et qu'ils s'adaptent a la largeur de l'ecran (ils
   restaient coinces dans une colonne de 44rem, meme sur un grand ecran).
   - barre de navigation commune, collante (navSite()) ;
   - conteneur .large (72rem) pour ces trois pages - les pages de lecture
     (journee, methode, fiche pays, detail d'indicateur) gardent leur
     colonne etroite, plus confortable pour lire du texte ;
   - tuiles de chiffres cles, calendrier des archives, podium et
     repartition par zone des pays, frise statistique pleine largeur ;
   - animations d'entree en cascade (transform/opacity uniquement),
     coupees sous prefers-reduced-motion.
   Couleurs : trio sourd (PALETTE) pour les surfaces et liseres, trio vif
   (PALETTE_VIF) seulement pour les petits elements (traits du
   calendrier, cases de la frise, puces) - meme regle que partout ailleurs.
   ===================================================================== */
.nav-site{position:sticky;top:0;z-index:30;background:rgba(16,17,20,.78);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(246,247,250,.08)}
.nav-dedans{max-width:72rem;margin:0 auto;padding:.65rem 1.25rem;display:flex;align-items:center;gap:1.6rem}
.nav-marque{display:inline-flex;align-items:center;gap:.45rem;text-decoration:none;flex:none;
  font:600 1.02rem/1 Fraunces,Georgia,serif;letter-spacing:.04em}
.nav-liens{display:flex;gap:.3rem;overflow-x:auto;scrollbar-width:none;margin-left:auto}
.nav-liens::-webkit-scrollbar{display:none}
.nav-liens a{flex:none;text-decoration:none;font-size:.86rem;font-weight:600;padding:.42rem .75rem;
  border-radius:999px;opacity:.65;transition:opacity .15s,background .15s}
.nav-liens a:hover{opacity:1;background:rgba(246,247,250,.06)}
.nav-liens a[aria-current]{opacity:1;background:rgba(246,247,250,.1);
  box-shadow:inset 0 0 0 1px rgba(246,247,250,.14)}
/* 24/09 (audit) : meme trait en degrade "Ocean" que la nav de l'accueil,
   pour que les deux menus parlent la meme langue visuelle. */
.nav-liens a{position:relative}
.nav-liens a::after{content:"";position:absolute;left:.75rem;right:.75rem;bottom:.16rem;height:2px;
  border-radius:2px;background:linear-gradient(90deg,#22D3EE,#3B82F6);transform:scaleX(0);
  transform-origin:left;transition:transform .25s}
.nav-liens a:hover::after,.nav-liens a:focus-visible::after{transform:scaleX(1)}
.nav-liens a[aria-current]::after{transform:scaleX(1);opacity:.8}
.nav-court{display:none}
.entete > .marque{display:none}
.entete{padding-top:2.6rem}
.entete.large,.corps.large{max-width:72rem}
.entete.large h1{font-size:clamp(2.2rem,5.5vw,3.4rem);letter-spacing:-.01em}
.legende-page{font-size:.86rem;opacity:.66;margin:1.2rem 0 0;max-width:48rem}
.surtitre{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;opacity:.66;margin:0 0 .8rem;font-weight:600}

/* Tuiles de chiffres cles */
.kpis-page{display:grid;grid-template-columns:repeat(auto-fit,minmax(10.5rem,1fr));gap:.8rem;margin:.6rem 0 1rem}
.kpi-page{border:1px solid rgba(246,247,250,.1);border-radius:.8rem;padding:1rem 1.1rem;
  background:linear-gradient(180deg,rgba(246,247,250,.035),transparent)}
.kpi-valeur{display:block;font:600 1.9rem/1.05 "JetBrains Mono",ui-monospace,monospace;letter-spacing:-.03em;
  font-variant-numeric:tabular-nums}
.kpi-valeur.teinte{color:var(--k)}
.kpi-libelle{display:block;margin-top:.45rem;font-size:.76rem;opacity:.66}

/* Archives : un calendrier par mois */
.archives .mois{margin:0 0 3rem}
.mois-tete{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;flex-wrap:wrap;
  margin:0 0 .9rem;padding-bottom:.6rem;border-bottom:1px solid rgba(246,247,250,.1)}
.archives .mois-tete h2{margin:0;opacity:1;font-size:1.5rem;text-transform:capitalize}
.mois-bilan{display:flex;gap:.9rem;flex-wrap:wrap}
.bilan-puce{display:inline-flex;align-items:center;gap:.4rem;font-size:.8rem;opacity:.75}
.bilan-puce i{width:.55rem;height:.55rem;border-radius:2px;background:var(--c)}
.bilan-puce b{font-family:"JetBrains Mono",monospace;font-weight:600}
.cal-semaine,.cal{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:.5rem}
.cal-semaine{margin-bottom:.45rem}
.cal-semaine li{font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;opacity:.66;padding-left:.2rem}
.cal li{min-width:0}
.cal-jour,.cal-absent{position:relative;display:flex;flex-direction:column;justify-content:space-between;
  height:5.6rem;border-radius:.6rem;padding:.55rem .65rem;text-decoration:none}
.cal-jour{border:1px solid rgba(246,247,250,.1);border-top:2px solid var(--c);
  background:linear-gradient(180deg,color-mix(in srgb,var(--c) 10%,transparent),rgba(246,247,250,.015) 70%);
  transition:transform .2s,border-color .2s,box-shadow .25s}
.cal-jour:hover,.cal-jour:focus-visible{transform:translateY(-3px);border-color:rgba(246,247,250,.28);
  border-top-color:var(--c);box-shadow:0 16px 30px -18px rgba(0,0,0,.8)}
.cal-jour.ici{box-shadow:0 0 0 2px var(--encre)}
.cal-absent{border:1px dashed rgba(246,247,250,.07);opacity:.35}
.cal-absent.futur{opacity:.18}
.cal-num{font:600 1.15rem/1 Fraunces,Georgia,serif}
.cal-pays{font-size:.68rem;opacity:.66;margin-top:.25rem}
.cal-traits{display:flex;flex-direction:column;gap:3px;margin-top:auto}
.cal-traits i{display:block;height:4px;border-radius:2px;background:var(--s);opacity:.9}

/* News par pays */
.pays-vitrine{margin:0 0 2.2rem}
.pays-vitrine[hidden]{display:none}
.podium{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:.9rem;margin:0 0 2rem}
.podium-carte{position:relative;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto auto;
  column-gap:.9rem;align-items:center;text-decoration:none;padding:1.1rem 1.2rem 1.2rem;border-radius:.9rem;
  border:1px solid rgba(246,247,250,.1);border-top:2px solid var(--c);overflow:hidden;
  background:linear-gradient(180deg,color-mix(in srgb,var(--c) 11%,transparent),transparent 75%);
  transition:transform .2s,border-color .2s,box-shadow .25s}
.podium-carte:hover{transform:translateY(-3px);border-color:rgba(246,247,250,.26);border-top-color:var(--c);
  box-shadow:0 18px 36px -20px rgba(0,0,0,.8)}
.podium-rang{position:absolute;top:.8rem;right:1rem;font:600 .8rem/1 "JetBrains Mono",monospace;opacity:.66}
.podium-drapeau{grid-row:1 / span 2;font-size:2.3rem;line-height:1}
.podium-nom{font:600 1.35rem/1.15 Fraunces,Georgia,serif}
.podium-zone{font-size:.74rem;opacity:.66;letter-spacing:.06em}
.podium-compte{grid-column:1 / -1;margin-top:.9rem;font-size:.82rem;opacity:.75}
.podium-compte b{font:600 1.5rem/1 "JetBrains Mono",monospace;margin-right:.25rem}
.podium-carte .jauge-fine{grid-column:1 / -1;margin-top:.7rem}
.jauge-fine{display:block;height:3px;border-radius:2px;background:rgba(246,247,250,.07);overflow:hidden}
.jauge-fine i{display:block;height:100%;width:var(--p);background:var(--c);border-radius:2px;transform-origin:0 50%}
.zones-barre{display:flex;height:.7rem;border-radius:999px;overflow:hidden;gap:2px;background:rgba(246,247,250,.05)}
.zones-barre i{display:block;width:var(--p);background:var(--c);transform-origin:0 50%}
.zones-legende{display:flex;flex-wrap:wrap;gap:.4rem 1.2rem;margin-top:.8rem}
.zones-legende a{display:inline-flex;align-items:center;gap:.45rem;font-size:.82rem;text-decoration:none;opacity:.75}
.zones-legende a:hover{opacity:1}
.zones-legende i{width:.6rem;height:.6rem;border-radius:2px;background:var(--c)}
.zones-legende b{font-family:"JetBrains Mono",monospace;font-weight:600;font-size:.76rem;opacity:.7}
.recherche-cadre{position:relative;margin:0 0 2rem}
.recherche-cadre svg{position:absolute;left:.95rem;top:50%;transform:translateY(-50%);opacity:.45;pointer-events:none}
.recherche-cadre .pays-recherche{margin:0;padding:.8rem 1rem .8rem 2.7rem;border-radius:.7rem;font-size:1rem}
.pays-groupe{scroll-margin-top:5rem}
.pays-groupe h2{display:flex;align-items:center;gap:.55rem;font-size:.78rem}
.pays-groupe h2 i{width:.6rem;height:.6rem;border-radius:2px;background:var(--z)}
.pays-groupe h2 .compte{opacity:.8}
.pays-liste{grid-template-columns:repeat(auto-fill,minmax(14.5rem,1fr));gap:.55rem}
.pays-liste a{display:grid;grid-template-columns:auto 1fr auto;row-gap:.5rem;column-gap:.6rem;
  padding:.7rem .85rem .75rem;border-radius:.6rem;border-left:1px solid rgba(246,247,250,.1);border-top:2px solid var(--c);
  background:rgba(246,247,250,.02)}
.pays-liste a:hover{border-left-color:rgba(246,247,250,.22);border-top-color:var(--c);transform:translateY(-2px)}
.pays-liste .jauge-fine{grid-column:1 / -1}
.pays-nom{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.drapeau{line-height:1;display:inline-flex;align-items:center}
.drapeau-img{width:1.33em;height:1em;border-radius:2px;object-fit:cover;box-shadow:0 0 0 1px rgba(246,247,250,.1);vertical-align:-.12em}

/* Statistiques */
.lanes-cadre{border:1px solid rgba(246,247,250,.08);border-radius:.8rem;padding:1.2rem 1.2rem .9rem;
  background:rgba(246,247,250,.015);overflow-x:auto}
.lane{display:grid;grid-template-columns:9.5rem minmax(0,1fr) 5.5rem;align-items:center;gap:1rem}
.lane-cases{display:grid;grid-template-columns:repeat(var(--n),minmax(3px,24px));gap:3px}
.case{width:auto;height:22px;border-radius:3px;opacity:.9;transition:transform .15s,filter .15s}
.case:hover{transform:scaleY(1.12);filter:brightness(1.25)}
.lane-part{font:600 .74rem/1 "JetBrains Mono",monospace;opacity:.6;text-align:right}
.lane-axe{display:flex;justify-content:space-between;width:min(100%,calc(var(--n) * 27px));
  font-size:.7rem;opacity:.66;margin-top:-.1rem}
.grille-indicateurs{grid-template-columns:repeat(auto-fit,minmax(min(100%,21rem),1fr));gap:1.1rem}
.corps.large .carte-indicateur{border-radius:.9rem;padding:1.3rem 1.4rem;
  background:linear-gradient(180deg,rgba(246,247,250,.03),transparent 40%);
  transition:transform .2s,border-color .2s,box-shadow .25s}
.corps.large .carte-indicateur:hover{transform:translateY(-3px);border-color:rgba(246,247,250,.24);
  box-shadow:0 20px 40px -24px rgba(0,0,0,.8)}
.corps.large .mini-graphe-ligne{height:auto;aspect-ratio:640 / 220}
.corps.large .mini-graphe{height:6.5rem}
.corps.large .periode-selecteur{margin-bottom:1.6rem}
.corps.large .bandeau-neutre h2,.entete.large + .corps .bandeau-neutre h2{font-size:1.5rem}
.corps.large .lanes{margin-bottom:2.8rem}

@media(max-width:700px){
  .nav-dedans{gap:.8rem;padding:.55rem 1rem}
  .nav-marque span{display:none}
  .nav-liens{gap:.1rem}
  .nav-liens a{font-size:.78rem;padding:.36rem .46rem}
  .nav-long{display:none}
  .nav-court{display:inline}
  .kpis-page{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kpi-valeur{font-size:1.45rem}
  .cal-semaine,.cal{gap:.28rem}
  .cal-jour,.cal-absent{height:3.6rem;padding:.35rem .38rem;border-radius:.45rem}
  .cal-num{font-size:.92rem}
  .cal-pays{display:none}
  .cal-traits i{height:3px}
  .cal-semaine li{font-size:.58rem;letter-spacing:.02em;padding:0;text-align:center}
  .lane{grid-template-columns:1fr auto;gap:.35rem .8rem}
  .lane-nom{grid-column:1;width:auto}
  .lane-part{grid-column:2;grid-row:1}
  .lane-cases{grid-column:1 / -1;grid-template-columns:repeat(var(--n),minmax(2px,1fr));gap:2px}
  .case{height:20px}
  .lane-axe-ligne .lane-nom,.lane-axe-ligne .lane-part{display:none}
  .lane-axe{grid-column:1 / -1;width:100%}
}
@media (prefers-reduced-motion:no-preference){
  .cal-jour{animation:case-pop .45s cubic-bezier(.2,.8,.3,1.2) backwards;animation-delay:calc(.15s + var(--i) * 14ms)}
  .lane .case{animation:case-monte .4s cubic-bezier(.2,.8,.3,1.2) backwards;animation-delay:calc(.2s + var(--i) * 12ms)}
  .jauge-fine i,.zones-barre i{animation:jauge-pousse 1s cubic-bezier(.2,.8,.2,1) backwards;animation-delay:.35s}
  .pays-liste a{animation:case-pop .45s ease-out backwards;animation-delay:calc(.1s + var(--i) * 25ms)}
}
@keyframes case-pop{from{opacity:0;transform:translateY(8px) scale(.96)}}
@keyframes case-monte{from{opacity:0;transform:scaleY(.2)}}
@keyframes jauge-pousse{from{transform:scaleX(0)}}
/* Pages de detail d'une serie (24/09, "vitrine") */
.graphe-mobile{display:none}
@media(max-width:640px){.graphe-large{display:none}.graphe-mobile{display:block}
  .corps.large .carte-indicateur-detail .graphe-mobile .mini-graphe-ligne{aspect-ratio:600 / 440}
  .carte-indicateur-detail{padding:1.1rem 1rem}}
.carte-indicateur-detail{padding:1.5rem 1.6rem;border-radius:1rem;
  background:linear-gradient(180deg,color-mix(in srgb,var(--t,#F6F7FA) 5%,transparent),transparent 45%)}
.corps.large .carte-indicateur-detail .mini-graphe-ligne{height:auto;aspect-ratio:1000 / 320}
.corps.large .carte-indicateur-detail .mini-graphe:not(.mini-graphe-ligne){height:14rem}
.carte-indicateur-detail .bandeau{border-left-color:var(--t,var(--c))}
.carte-indicateur-detail .bandeau h2{color:var(--encre)}
.detail-grille{display:grid;grid-template-columns:minmax(0,2fr) minmax(16rem,1fr);gap:1.6rem;margin-top:2.4rem;align-items:start}
.tableau-detail .marches table{font-size:.92rem}
.tableau-detail thead th{position:sticky;top:3.4rem;background:var(--fond);z-index:1}
.tableau-detail tbody tr{transition:background .15s}
.tableau-detail tbody tr:hover{background:rgba(246,247,250,.03)}
.tableau-detail th[scope=row] a{text-decoration:none}
.tableau-detail th[scope=row] a:hover{text-decoration:underline}
.ecart-cellule{width:11rem}
.ecart-contenu{display:inline-flex;align-items:center;gap:.6rem;justify-content:flex-end;font-family:"JetBrains Mono",monospace;font-size:.82rem}
.var-barre{position:relative;display:inline-block;width:3.2rem;height:.32rem;border-radius:999px;background:rgba(246,247,250,.07)}
.var-barre::after{content:"";position:absolute;left:50%;top:-3px;bottom:-3px;width:1px;background:rgba(246,247,250,.25)}
.var-barre i{position:absolute;top:0;bottom:0;border-radius:999px;background:rgba(246,247,250,.45)}
.var-barre i.pos{left:50%;width:calc(var(--v) * 50%);transform-origin:0 50%}
.var-barre i.neg{right:50%;width:calc(var(--v) * -50%);transform-origin:100% 50%}
.var-barre i.hausse{background:#7CC2A4}.var-barre i.baisse{background:#D98E8E}
.var-barre i::before{content:none}
.tableau-detail .hausse,.encart-detail .hausse{color:#7CC2A4}
.tableau-detail .baisse,.encart-detail .baisse{color:#D98E8E}
.neutre{opacity:.75}
.detail-cote{position:sticky;top:4.4rem;display:flex;flex-direction:column;gap:1rem}
.encart-detail{border:1px solid rgba(246,247,250,.1);border-radius:.8rem;padding:1rem 1.1rem;
  background:linear-gradient(180deg,rgba(246,247,250,.03),transparent)}
.encart-detail h3{font:600 .72rem/1.3 Karla,sans-serif;letter-spacing:.14em;text-transform:uppercase;opacity:.66;margin:0 0 .6rem}
.encart-detail ul{list-style:none;padding:0;margin:0}
.encart-detail li{display:flex;justify-content:space-between;gap:.8rem;padding:.5rem 0;border-top:1px solid rgba(246,247,250,.07);font-size:.88rem}
.encart-detail li:first-child{border-top:0}
.encart-detail li a{text-decoration:none;opacity:.85}
.encart-detail li a:hover{opacity:1;text-decoration:underline}
.encart-detail li b{font-family:"JetBrains Mono",monospace;font-weight:600;font-size:.82rem;white-space:nowrap}
.autres-series{display:flex;flex-direction:column;gap:.45rem}
.autres-series a{text-decoration:none;font-size:.88rem;opacity:.75}
.autres-series a:hover{opacity:1}
@media(max-width:860px){
  .detail-grille{grid-template-columns:1fr}
  .detail-cote{position:static}
  .ecart-cellule{width:auto}
  .var-barre{width:2.2rem}
}
@media (prefers-reduced-motion:no-preference){
  .carte-indicateur-detail .aire{animation:aire-monte 1.2s ease-out backwards;animation-delay:.5s}
  .carte-indicateur-detail .trace{animation:revele-trace 1.4s cubic-bezier(.4,0,.2,1) backwards;animation-delay:.2s}
  .tableau-detail .var-barre i{animation:jauge-pousse .9s cubic-bezier(.2,.8,.2,1) backwards;animation-delay:.5s}
}
@keyframes aire-monte{from{opacity:0}}
@keyframes revele-trace{from{clip-path:inset(-10% 100% -10% 0)}to{clip-path:inset(-10% 0 -10% 0)}}

/* =====================================================================
   Pages datees "facon journal" (24/09, audit) - meme mise en page que
   les articles de l'accueil (public/index.html, chantier 34) : un
   article "A la une" en deux colonnes avec sa carte, puis les breves en
   cases sur deux colonnes, carte en tete, "Lire la suite" pour le
   pourquoi et les sources.
   ===================================================================== */
.corps-journal{max-width:64rem}
.journal{--filet:rgba(246,247,250,.14);--encre-douce:rgba(246,247,250,.66);--encre-faible:rgba(246,247,250,.55);--terre-claire:#22242B}
.journal .carte{display:block;width:100%;aspect-ratio:300 / 143;border:1px solid var(--filet);border-radius:.6rem;overflow:hidden;background:#191B20;transition:border-color .18s}
.journal .carte svg{display:block;width:100%;height:100%}
.journal .impulsion{transform-box:fill-box;transform-origin:center;stroke-width:1.5;pointer-events:none;
  animation:evt-pulse 2.8s ease-in-out infinite;animation-play-state:paused}
.journal .carte.en-vue .impulsion{animation-play-state:running}
@keyframes evt-pulse{0%{transform:scale(1);opacity:.6}70%,100%{transform:scale(2.6);opacity:0}}
.evt{position:relative;border:1px solid var(--filet);border-radius:1rem;
  background:linear-gradient(180deg,rgba(246,247,250,.025),transparent 60%);
  transition:border-color .2s,box-shadow .25s,transform .2s}
.evt:hover{border-color:rgba(246,247,250,.22);box-shadow:0 20px 40px -26px rgba(0,0,0,.85)}
.evt-carte{display:block;border-radius:.6rem}
a.evt-carte:hover .carte{border-color:var(--encre-douce)}
.evt-haut{display:flex;align-items:baseline;gap:.9rem;margin-bottom:.6rem}
.evt-num{font:600 1.5rem/1 Fraunces,Georgia,serif;color:var(--c);flex:none}
.evt h3{font:600 1.15rem/1.35 Karla,sans-serif;margin:0}
.evt-resume{margin:0 0 .9rem;line-height:1.65}
.evt-pourquoi{border-radius:.7rem;padding:.85rem 1rem;background:rgba(246,247,250,.035);
  border:1px solid rgba(246,247,250,.07);margin-bottom:.9rem}
.evt-pourquoi b{display:block;font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:var(--c);margin-bottom:.35rem}
.evt-pourquoi p{margin:0;color:var(--encre-douce);font-size:.95rem;line-height:1.6}
.evt-lbl{display:block;font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:var(--encre-faible);margin-bottom:.4rem}
.evt-pays-liste{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem}
.evt-pays{display:inline-flex;align-items:center;gap:.35rem;font-size:.84rem;text-decoration:none;color:var(--encre);
  padding:.22rem .6rem;border-radius:999px;background:rgba(246,247,250,.05);border:1px solid var(--filet);transition:.18s}
a.evt-pays:hover,a.evt-pays:focus-visible{border-color:var(--encre-douce)}
.journal .sources{display:flex;flex-wrap:wrap;gap:.5rem}
.journal .sources a{font-size:.78rem;text-decoration:none;color:var(--encre-douce);border:1px solid var(--filet);
  border-radius:999px;padding:.32rem .8rem;transition:.18s}
.journal .sources a:hover,.journal .sources a:focus-visible{color:var(--encre);border-color:var(--encre-douce);background:var(--terre-claire)}
.journal .sources a::after{content:" ↗";font-size:.7em;opacity:.6}
.evt.une{display:grid;grid-template-columns:minmax(0,1fr) 20rem;gap:2rem;padding:1.8rem 1.9rem;
  border-left:3px solid var(--c);margin:1.2rem 0 1.1rem;
  background:linear-gradient(90deg,color-mix(in srgb,var(--c) 7%,transparent),transparent 55%)}
.une-tag{display:inline-block;font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;font-weight:700;color:var(--v);margin-bottom:.7rem}
.une .evt-num{font-size:2rem}
.une h3{font:600 1.6rem/1.22 Fraunces,Georgia,serif}
.une .evt-resume{font-size:1.05rem}
.evt-cote{display:flex;flex-direction:column;gap:1rem}
.evt-cote-bas{display:flex;justify-content:space-between;align-items:flex-end;gap:.8rem}
.breves{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.1rem;align-items:start;margin-bottom:1rem}
/* 24/09 : plus de lisere colore au-dessus des breves (Benjamin : "to much"
   repete sur chaque case). La couleur de la rubrique reste portee par le
   numero et par l'article a la une. */
.evt.breve{display:flex;flex-direction:column;padding:1rem 1rem 0}
.breve .evt-carte{margin-bottom:1rem}
.breve .carte{aspect-ratio:auto;height:8.5rem}
.breve .evt-haut,.breve .evt-resume,.evt-plus{padding:0 .2rem}
.breve .evt-resume{font-size:.95rem;color:var(--encre-douce);
  display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.breve.ouvert .evt-resume{display:block;color:var(--encre)}
.evt-plus{display:none}
.breve.ouvert .evt-plus{display:block;animation:evt-entre .35s ease-out}
@keyframes evt-entre{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.evt-sources{margin-bottom:1rem}
.evt-bas{display:flex;justify-content:space-between;align-items:center;gap:.6rem;flex-wrap:wrap;
  margin-top:auto;padding:.8rem .2rem .9rem;border-top:1px solid rgba(246,247,250,.07)}
.evt-nb{font-size:.76rem;color:var(--encre-faible);margin-left:.2rem}
.evt-actions{display:flex;align-items:center;gap:.5rem}
.evt-deplier{font:600 .78rem Karla,system-ui,sans-serif;color:var(--encre);background:rgba(246,247,250,.04);
  border:1px solid var(--filet);border-radius:999px;padding:.4rem .85rem;cursor:pointer;transition:.18s}
.evt-deplier:hover,.evt-deplier:focus-visible{border-color:var(--encre-douce);background:var(--terre-claire)}
.evt:target{border-color:var(--v);box-shadow:0 0 0 2px color-mix(in srgb,var(--v) 30%,transparent)}
@media(max-width:860px){
  .evt.une{grid-template-columns:1fr;gap:1.2rem;padding:1.3rem 1.2rem}
  .une h3{font-size:1.35rem}
  .breves{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:no-preference){.evt:hover{transform:translateY(-2px)}}
@media (prefers-reduced-motion:reduce){.journal .impulsion{animation:none}.breve.ouvert .evt-plus{animation:none}}
@media (pointer:coarse){
  .journal .sources a,.evt-pays{min-height:44px}
  .evt-deplier{min-height:44px}
  .lien-article{width:2.75rem;height:2.75rem}
}

/* =====================================================================
   Indice de risque (25/09/2026) - /statistiques et pages pays.
   --k : teinte vive du niveau (calme/tension/crise).
   ===================================================================== */
.risque{margin-bottom:2.6rem}
.risque h3{font:600 .72rem/1.3 Karla,sans-serif;letter-spacing:.14em;text-transform:uppercase;opacity:.66;margin:0 0 .8rem}
.risque .chapeau a{color:inherit}
.rq-haut{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:1.1rem;margin:1.2rem 0}
.rq-jauge,.rq-decomp,.rq-carte-bloc,.rq-listes>div,.risque-pays{border:1px solid rgba(246,247,250,.1);border-radius:1rem;padding:1.3rem 1.4rem;
  background:linear-gradient(160deg,color-mix(in srgb,var(--k,#F6F7FA) 9%,rgba(246,247,250,.02)),rgba(246,247,250,.015) 60%)}
.rq-surtitre,.rq-sous-titre{display:block;font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;opacity:.66;font-weight:600}
.rq-score{display:flex;align-items:baseline;gap:.3rem;margin:.35rem 0 .2rem}
.rq-valeur{font:600 clamp(3rem,7vw,4.4rem)/1 Fraunces,Georgia,serif;color:var(--k)}
.rq-sur{font:500 1rem "JetBrains Mono",monospace;opacity:.55}
.rq-niveau{display:inline-block;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--k);
  padding:.28rem .7rem;border-radius:999px;background:color-mix(in srgb,var(--k) 16%,transparent)}
.rq-couverture{font-size:.78rem;opacity:.6;margin:.6rem 0 0}
.rq-courbe{margin-top:1.1rem}
.rq-courbe svg,.rp-courbe svg{display:block;width:100%;height:auto;margin-top:.4rem}
.rq-decomp ul{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}
.rq-dom{display:grid;grid-template-columns:minmax(0,14rem) minmax(0,1fr) 3.2rem;align-items:center;gap:.7rem;font-size:.86rem}
.rq-dom-nom{display:flex;align-items:center;gap:.5rem;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rq-dom-nom i{flex:none;width:.55rem;height:.55rem;border-radius:50%;background:var(--v,rgba(246,247,250,.25))}
.rq-dom-nom small{font:500 .64rem "JetBrains Mono",monospace;opacity:.5;margin-left:.2rem}
.rq-dom-barre{height:.45rem;border-radius:999px;background:rgba(246,247,250,.06);overflow:hidden}
.rq-dom-barre b{display:block;height:100%;border-radius:999px;background:var(--s)}
.rq-dom-pts{font:600 .78rem "JetBrains Mono",monospace;text-align:right;opacity:.85}
.rq-dom.absent{opacity:.5}
.rq-dom-na{font-style:italic;font-size:.74rem;opacity:.8;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.corps.large .rq-courbe .mini-graphe-ligne,.corps .rp-courbe .mini-graphe-ligne{width:100%;height:auto;aspect-ratio:auto;margin:.4rem 0 0}
.rq-carte-bloc{margin-bottom:1.1rem}
.rq-carte-bloc .chapeau{font-size:.88rem;line-height:1.6;opacity:.8;margin:0 0 .4rem}
.rq-carte{display:block;width:100%;height:auto;margin-top:.4rem}
.rq-point{stroke:#101114;stroke-width:1;opacity:.92;transition:opacity .15s}
a:hover .rq-point,a:focus-visible .rq-point{opacity:1;stroke:#F6F7FA;stroke-width:1.6}
.rq-legende{display:flex;align-items:center;gap:.35rem;font-size:.76rem;opacity:.7;margin:.6rem 0 0;flex-wrap:wrap}
.rq-legende i{width:.6rem;height:.6rem;border-radius:50%;background:var(--k)}
.rq-legende i:last-of-type{margin-right:.4rem}
.rq-listes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.1rem}
.rq-compte{font:600 .72rem "JetBrains Mono",monospace;opacity:.8;margin-left:.3rem}
.rq-pastilles{display:flex;flex-wrap:wrap;gap:.45rem}
.rq-pays{display:inline-flex;align-items:center;gap:.45rem;font-size:.84rem;text-decoration:none;color:var(--encre);
  padding:.3rem .45rem .3rem .6rem;border-radius:999px;border:1px solid color-mix(in srgb,var(--k) 35%,transparent);
  background:color-mix(in srgb,var(--k) 10%,transparent);transition:.15s}
a.rq-pays:hover,a.rq-pays:focus-visible{background:color-mix(in srgb,var(--k) 20%,transparent)}
.rq-pays b{font:600 .72rem "JetBrains Mono",monospace;color:var(--k);background:rgba(10,11,14,.45);padding:.12rem .4rem;border-radius:999px}
.rq-pays em{font:600 .7rem "JetBrains Mono",monospace;font-style:normal}
.rq-pays em.hausse{color:#D98E8E}.rq-pays em.baisse{color:#7CC2A4}
.rq-vide{font-size:.84rem;opacity:.6;margin:0}
.risque-pays{display:grid;grid-template-columns:auto minmax(0,1fr);gap:1.6rem;margin:0 0 2rem}
.rp-score{display:flex;flex-direction:column;align-items:flex-start}
.rp-detail p{margin:0 0 .8rem;font-size:.92rem;line-height:1.55}
.rp-pts{font:600 .76rem "JetBrains Mono",monospace;opacity:.75;margin-left:.3rem}
.rp-avis{font-size:.86rem;opacity:.75}
.rp-barre{display:flex;height:.5rem;border-radius:999px;background:rgba(246,247,250,.06);overflow:hidden;margin:.3rem 0 1rem}
.rp-barre .st{background:color-mix(in srgb,var(--k) 55%,transparent)}.rp-barre .cj{background:var(--k)}
.rp-facteur{display:inline-flex;align-items:center;gap:.35rem;font-size:.8rem;padding:.22rem .6rem;border-radius:999px;margin:.3rem .3rem 0 0;
  background:rgba(246,247,250,.05);border:1px solid rgba(246,247,250,.1)}
.rp-facteur b{font:600 .7rem "JetBrains Mono",monospace;color:var(--k)}
.rp-courbe{margin:.4rem 0 .9rem}
.rp-note{font-size:.78rem!important;opacity:.62}
.rp-note a{color:inherit;white-space:nowrap}
.rp-resume{margin:1.3rem 0 0;display:grid;gap:.7rem;min-width:9rem}
.rp-resume div{display:flex;flex-direction:column;gap:.15rem}
.rp-resume dt{font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;opacity:.6;font-weight:600}
.rp-resume dd{margin:0;font-size:.88rem}
.rp-resume dd b{font:600 1rem "JetBrains Mono",monospace;color:var(--encre)}
.rp-resume sup{font-size:.62em}
.rp-resume small{opacity:.6;font-size:.74rem}
.rp-var{font:600 .82rem "JetBrains Mono",monospace;opacity:.9}
.rp-var.hausse{color:#D98E8E}.rp-var.baisse{color:#7CC2A4}.rp-var.stable{opacity:.65}
.rp-legende{display:flex;flex-wrap:wrap;gap:.3rem 1rem;margin:-.6rem 0 1rem!important;font-size:.74rem!important;opacity:.7}
.rp-legende span{display:inline-flex;align-items:center;gap:.35rem}
.rp-legende i{width:.7rem;height:.45rem;border-radius:2px;background:rgba(246,247,250,.1)}
.rp-legende i.st{background:color-mix(in srgb,var(--k) 55%,transparent)}.rp-legende i.cj{background:var(--k)}
.rp-legende .rp-reste{opacity:.7}
.rp-courbe .lecture-valeur{margin:.3rem 0 0!important;font-size:.78rem!important;opacity:.7}
.rp-niveaux{display:flex;flex-wrap:wrap;gap:.3rem .9rem;margin:.35rem 0 0!important;font-size:.72rem!important;opacity:.7}
.rp-niveaux span{display:inline-flex;align-items:center;gap:.35rem}
.rp-niveaux i{width:.55rem;height:.55rem;border-radius:2px;background:var(--k);opacity:.75}
.pays-section-titre{font-size:1.15rem;margin:0 0 .9rem}
.fil-pays{margin:2.4rem 0 0}
.frise-citations{margin:0 0 1.2rem;padding:1rem 1.1rem;border-radius:12px;background:rgba(246,247,250,.03);border:1px solid rgba(246,247,250,.08)}
.fc-entete{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;margin-bottom:.6rem}
.fc-compte{font:600 .74rem "JetBrains Mono",monospace;opacity:.75;white-space:nowrap}
@media(max-width:480px){.fc-entete{flex-direction:column;gap:.2rem}}
.fc-cases{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:3px}
.fc-case{height:26px;border-radius:3px;background:rgba(246,247,250,.07);display:block}
.fc-case.cite{background:var(--c);opacity:.9;transition:transform .15s,filter .15s}
.fc-case.cite:hover,.fc-case.cite:focus-visible{transform:scaleY(1.12);filter:brightness(1.25)}
.fc-dates{display:flex;justify-content:space-between;font-size:.7rem;opacity:.55;margin-top:.4rem}
.mois-titre{font:600 .72rem "JetBrains Mono",monospace;letter-spacing:.12em;text-transform:uppercase;opacity:.8;
  margin:1.8rem 0 0;padding:0 0 .6rem;border-bottom:1px solid rgba(246,247,250,.14);display:flex;justify-content:space-between;gap:1rem}
.mois-titre span{opacity:.6;letter-spacing:.04em;text-transform:none;font-weight:400}
.mois-titre + .evenement{border-top:0}
.evenement[id]{scroll-margin-top:5rem}
.voisins{margin:2.6rem 0 0;padding-top:1.6rem;border-top:1px solid rgba(246,247,250,.1)}
.voisins-intro{font-size:.85rem;opacity:.7;margin:-.4rem 0 .9rem}
.voisins .rp-note{margin:.9rem 0 0}
@media(max-width:860px){.rp-resume{grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem 1.2rem;margin-top:1rem}}
@media(max-width:640px){.fc-case{height:22px}.fc-cases{gap:2px}}
/* Page pays, adaptation a la largeur (25/09/2026) : meme gabarit large
   (72rem) que Statistiques et Archives. Trois paliers :
   - >= 1100px : bloc risque sur trois colonnes (note | detail | courbe),
     fil d'actualite a gauche et encart "Avant de partir" colle a droite ;
   - 700-1099px : une colonne, bloc risque note | detail, courbe dessous ;
   - < 700px : tout empile (regles mobiles existantes). */
.navigation.page-pays{max-width:72rem}
.corps.page-pays .risque-pays{padding:1.6rem 1.8rem}
/* Sous 1100px, "Avant de partir" passe AVANT le fil (sinon il finit
   tout en bas, apres des dizaines d'articles). */
.pays-grille{display:flex;flex-direction:column}
.pays-cote{order:-1}
.pays-cote .avant-partir{margin:0}
@media(min-width:900px){
  .corps.page-pays .rp-detail{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);column-gap:2.2rem;align-content:start}
  .corps.page-pays .rp-detail > *{grid-column:1}
  .corps.page-pays .rp-detail > .rp-courbe{grid-column:2;grid-row:1 / span 6;margin:0}
}
@media(min-width:700px) and (max-width:899px){
  .corps.page-pays .rp-courbe .mini-graphe-ligne{max-width:32rem}
}
@media(min-width:1100px){
  .corps.page-pays .risque-pays{grid-template-columns:13rem minmax(0,1fr);gap:2.2rem}
  .corps.page-pays .rp-score .rq-valeur{font-size:5.2rem}
  .pays-grille{display:grid;grid-template-columns:minmax(0,1fr) 21rem;gap:3rem;align-items:start}
  .pays-grille .fil-pays{min-width:0}
  .pays-cote{position:sticky;top:5.5rem;order:0}
  .pays-cote .avant-partir{margin:2.4rem 0 0}
  .pays-cote .ap-liens{grid-template-columns:1fr}
  .corps.page-pays .fc-case{height:30px}
}
@media(min-width:700px) and (max-width:1099px){
  .corps.page-pays .risque-pays{grid-template-columns:11rem minmax(0,1fr);gap:1.6rem}
  .corps.page-pays .rp-resume{grid-template-columns:1fr;margin-top:1.3rem}
}
@media(max-width:699px){
  .corps.page-pays .risque-pays{padding:1.2rem 1.1rem}
}
.avant-partir{margin:0 0 2rem;padding:1.2rem 1.3rem;border-radius:14px;background:rgba(246,247,250,.03);border:1px solid rgba(246,247,250,.09)}
.avant-partir h2{margin:0 0 .45rem;font-size:1.05rem}
.ap-intro{margin:0 0 .9rem;font-size:.88rem;line-height:1.55;opacity:.8}
.ap-liens{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}
.ap-lien{display:flex;flex-direction:column;gap:.25rem;padding:.85rem 1rem;border-radius:10px;text-decoration:none;color:var(--encre);
  background:rgba(246,247,250,.04);border:1px solid rgba(246,247,250,.1);transition:background .15s,border-color .15s}
.ap-lien:hover,.ap-lien:focus-visible{background:rgba(246,247,250,.08);border-color:rgba(246,247,250,.22)}
.ap-lien strong{font-size:.95rem;line-height:1.35}
.ap-lien strong::after{content:" ↗";opacity:.55;font-weight:400}
.ap-source{font:600 .68rem "JetBrains Mono",monospace;letter-spacing:.06em;text-transform:uppercase;opacity:.6}
.ap-texte{font-size:.82rem;line-height:1.5;opacity:.72}
.ap-note{margin:.8rem 0 0;font-size:.76rem;opacity:.58}
@media(max-width:640px){.ap-liens{grid-template-columns:1fr}.avant-partir{padding:1rem}}
.methode h2{margin:2rem 0 .8rem;font-size:1.3rem}
@media(max-width:860px){
  .rq-haut,.rq-listes{grid-template-columns:1fr}
  .risque-pays{grid-template-columns:1fr;gap:1rem}
}
@media(max-width:520px){
  .rq-dom{grid-template-columns:minmax(0,1fr) 4.5rem 2.8rem;gap:.5rem;font-size:.8rem}
  .rq-dom-nom small{display:none}
  .rq-point{transform-box:fill-box;transform-origin:center;transform:scale(1.6)}
  .rq-jauge,.rq-decomp,.rq-carte-bloc,.rq-listes>div,.risque-pays{padding:1.05rem 1rem}
}

.rq-reconstitue{font-size:.78rem;line-height:1.55;opacity:.62;margin:.2rem 0 1rem;padding-left:.8rem;border-left:2px solid rgba(246,247,250,.15)}
.rq-vers-carte{margin:1.2rem 0 0}
.rq-vers-carte a{font-weight:600;text-decoration:none;border-bottom:1px solid rgba(246,247,250,.3)}
.detail-attente{margin:1.2rem 0;padding:2.2rem 1rem;text-align:center;font-size:.92rem;opacity:.7;
  border:1px dashed rgba(246,247,250,.15);border-radius:.8rem}

.rq-lien{display:inline-block;margin-top:1rem;font-size:.86rem;font-weight:600;text-decoration:none;border-bottom:1px solid rgba(246,247,250,.3)}
.rq-lien:hover,.rq-lien:focus-visible{border-bottom-color:var(--k,#F6F7FA)}
.rq-lien-h3{float:right;font-size:.7rem;letter-spacing:.06em;text-transform:none;font-weight:600;text-decoration:none;opacity:.9;border-bottom:1px solid rgba(246,247,250,.3)}
