/* Nouveau menu des jeux de jeux-geographiques.com (maquette, 25/10/2026) — _GESTION IA/_interface/_menus/jgm/
   Tout est sous #jgm (ajouté à la fin du <body> par jgm.js) pour ne pas toucher au reste de la page.
   Les entrées du haut (.jgm-top) restent dans la barre du site et prennent son style. */
#jgm{--jgm-bleu:#1988d0;--jgm-panneau:#2a4655;--jgm-liste:#223a48;--jgm-survol:#304e5f;--jgm-texte:#e8eef2;--jgm-doux:#9fb0ba;
  --jgm-titre-col:#8fd0ff;--jgm-filet:#4a5c66;--jgm-pastille:#f5a623;--jgm-bulle:#eaf0f6;
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:14px;line-height:1.4}
#jgm *{box-sizing:border-box}
#jgm h4,#jgm h5,#jgm i,#jgm small{font-style:normal}
#jgm button{font:inherit;cursor:pointer;margin:0}

/* ---------- ordinateur : panneau sous la barre du site */
#jgm-panneau{position:absolute;z-index:1000;display:none}
#jgm-panneau.on{display:block}
/* fond plein #2a4655 (#33434c du site un peu plus saturé, U 25/10/2026 ; essais à 90 et 80 % avec flou, revenu à 100 %) ; la colonne des rubriques est assombrie par-dessus */
#jgm .jgm-v2{display:grid;grid-template-columns:250px 1fr;background:#2a4655;color:var(--jgm-texte);border-radius:0 0 12px 12px;
  overflow:hidden;min-height:420px;box-shadow:0 14px 30px rgba(0,0,0,.28)}
/* ouverture : le panneau se déploie vers le bas (U 25/10/2026) */
#jgm .jgm-v2.jgm-deploie{animation:jgmDeploie .28s cubic-bezier(.2,.8,.3,1)}
@keyframes jgmDeploie{from{clip-path:inset(0 0 100% 0 round 0 0 12px 12px);transform:translateY(-8px)}to{clip-path:inset(0 0 0 0 round 0 0 12px 12px);transform:none}}
@media (prefers-reduced-motion:reduce){#jgm .jgm-v2.jgm-deploie{animation:none}}
/* filigrane : méridiens et parallèles tous les 10° + terres, même blanc sans addition, orthographique centrée sur 55° E / 37° N (Europe visible) (generer_filigrane.py), 1600 px, à 12 % en overlay (7 % jusqu'au 26/10), centré sur le coin inférieur droit du panneau (U 25/10/2026) */
#jgm .jgm-v2{position:relative}
#jgm .jgm-v2:before{content:"";position:absolute;right:-800px;bottom:-800px;width:1600px;height:1600px;background:url(filigrane_graticule.png) no-repeat center/contain;opacity:.12;mix-blend-mode:overlay;pointer-events:none}
#jgm .jgm-v2>*{position:relative}
#jgm .jgm-v2>ul{list-style:none;margin:0;padding:12px 10px;background:#223946;overflow:auto}   /* opaque (= #2a4655 + noir 18 %) : pas de filigrane sous les rubriques */
#jgm .jgm-v2 li{margin:0;padding:0}
#jgm .jgm-v2 li button{width:100%;display:flex;align-items:center;gap:8px;border:0;background:none;padding:8px 10px;border-radius:8px;
  text-align:left;color:var(--jgm-texte);font-weight:600;font-size:14px}
#jgm .jgm-v2 li button span{flex:1}
#jgm .jgm-v2 li button:hover{background:var(--jgm-survol)}
#jgm .jgm-v2 li button.on{background:var(--jgm-bleu);color:#fff}
#jgm .jgm-v2 li button small{font-weight:600;color:#c3d0d8;background:rgba(255,255,255,.1);border-radius:999px;padding:0 7px;font-size:11px}
#jgm .jgm-v2 li button.on small{background:rgba(255,255,255,.25);color:#fff}
#jgm .jgm-pt{flex:none;width:7px;height:7px;border-radius:50%;background:var(--jgm-pastille)}
/* rappel du titre du menu en haut de la barre des rubriques : Noto Sans (police des vignettes, thumbs.css) gras, bleu clair #8fd0ff à 35 % (U 25/10/2026) */
#jgm .jgm-v2 li.jgm-titre{font-family:"JGT Noto Sans",Tahoma,Verdana,sans-serif;font-size:30px;line-height:1.1;font-weight:700;text-transform:uppercase;color:rgba(143,208,255,.35);padding:6px 10px 18px;letter-spacing:-.3px}
#jgm .jgm-v2 li.jgm-sep{font-size:11px;text-transform:uppercase;letter-spacing:.8px;color:#8fa3ae;padding:14px 10px 4px;font-weight:700}
#jgm .jgm-droite{padding:20px 24px 26px;position:relative;overflow:auto}
#jgm h4.jgm-h4{margin:0 0 14px;padding-right:120px;font-size:18px;font-weight:700;color:#fff;line-height:1.3;font-family:inherit}
#jgm h4.jgm-h4 small{color:var(--jgm-doux);font-weight:400;font-size:13px;margin-left:8px}
#jgm h4.jgm-h4 i{display:block;font-style:normal;font-weight:400;font-size:13px;color:var(--jgm-doux);margin-top:2px}
#jgm .jgm-grille{columns:4 200px;column-gap:16px;max-width:880px}
#jgm .jgm-grille .jgm-mt{margin-bottom:10px;break-inside:avoid}
#jgm .jgm-cols{display:flex;flex-wrap:wrap;gap:22px 16px;align-items:flex-start}
#jgm .jgm-pile{width:200px;display:flex;flex-direction:column;gap:18px}
#jgm .jgm-col{display:flex;flex-direction:column;gap:10px}
#jgm h5.jgm-h5{margin:0;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:var(--jgm-titre-col);padding-bottom:5px;
  border-bottom:1px solid var(--jgm-filet);min-height:20px;line-height:1.2;font-family:inherit}
#jgm .jgm-esp{height:4px}
#jgm .jgm-grille .jgm-esp{margin-bottom:10px;break-inside:avoid}

/* vignettes */
#jgm a.jgm-mt{position:relative;display:block;width:200px;height:40px;border-radius:10px;flex:none;text-decoration:none;
  transition:transform .12s,box-shadow .12s,filter .12s}
#jgm a.jgm-mt:hover{transform:translateY(-2px);box-shadow:0 4px 0 rgba(0,0,0,.25);filter:brightness(1.07)}
#jgm a.jgm-mt:focus-visible{outline:3px solid #ffd54a;outline-offset:2px}
#jgm .jgm-rub{position:absolute;left:0;top:0;z-index:2;width:150px;height:30px;pointer-events:none;
  background:url(game_thumb_is_new_tiny.png) no-repeat;background-size:150px 30px}
#jgm .jgm-rub.maj{background-image:url(game_thumb_is_new_version_tiny.png)}

/* entrée du haut dont le menu est ouvert : blanc sur gris sombre (couleur du panneau) */
.jgm-li.open>a.jgm-top,.jgm-li.open>a.jgm-top:hover,.jgm-li.open>a.jgm-top:focus{background:#2a4655!important;color:#fff!important}

/* étoiles du joueur (en bas à gauche de la vignette, comme sur le site) : contour bleu foncé de 1 px au lieu du fond bleu transparent */
#jgm .jgm-et{position:absolute;left:5px;bottom:-5px;z-index:3;display:flex;gap:1px;font-size:17px;line-height:1;pointer-events:none}   /* centrées sous l'image (60 px) */
/* étoiles en SVG : le trait de contour ne remplit pas l'intérieur (avec des ombres de texte, le gris à 70 % laissait voir le bleu du contour) */
#jgm .jgm-et svg{display:block;width:17px;height:16px;overflow:visible}
#jgm .jgm-et path{fill:#FEE145;stroke:rgba(10,58,115,.9);stroke-width:1.1px;vector-effect:non-scaling-stroke;stroke-linejoin:round}   /* contour bleu foncé à 90 % */
#jgm .jgm-et .jgm-et-non path{fill:rgba(236,240,244,.5);stroke:rgba(10,58,115,.7)}   /* non gagnées : gris clair à 50 %, contour à 70 % */

/* bouton de taille (texte + vignettes) */
#jgm .jgm-taille{position:absolute;top:16px;right:18px;display:flex;align-items:flex-end;gap:2px;background:var(--jgm-liste);border-radius:9px;padding:3px}
#jgm .jgm-taille button{border:0;background:none;color:#c3d0d8;border-radius:6px;width:30px;height:28px;font-weight:700;line-height:1;padding:0}
#jgm .jgm-taille button:nth-child(1){font-size:12px}
#jgm .jgm-taille button:nth-child(2){font-size:15px}
#jgm .jgm-taille button:nth-child(3){font-size:19px}
#jgm .jgm-taille button.on{background:var(--jgm-bleu);color:#fff}
#jgm .jgm-taille button:hover:not(.on){background:var(--jgm-survol)}

/* bouton des bulles d'aide (à gauche du bouton de taille) : les masque ou les remet, mémorisé (localStorage jg_menu_bulles) */
#jgm .jgm-outils{position:absolute;top:16px;right:18px;display:flex;gap:8px;align-items:stretch}
#jgm .jgm-outils .jgm-taille{position:static}
#jgm .jgm-bulles{display:flex;align-items:center;justify-content:center;border:0;background:var(--jgm-liste);color:#c3d0d8;border-radius:9px;width:40px;padding:0}
#jgm .jgm-bulles:hover{color:#fff;background:#304e5f}
#jgm .jgm-bulles svg{display:block}


/* bulle d'aide */
#jgm-bulle{position:fixed;z-index:1100;left:0;top:0;width:max-content;background:var(--jgm-bulle);color:#1f2a36;border-radius:12px;
  font-family:"JGT Noto Sans",-apple-system,"Segoe UI",Roboto,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  font-size:13px;line-height:1.5;font-weight:400;box-shadow:0 6px 16px rgba(0,25,45,.3),0 0 0 1px rgba(0,25,45,.06);pointer-events:none;
  opacity:0;transform:translateY(4px);transition:opacity .13s,transform .13s}
#jgm-bulle.bas{transform:translateY(-4px)}
#jgm-bulle.on{opacity:1;transform:none}
#jgm-bulle:after{content:"";position:absolute;left:calc(var(--fx, 50%) - 6px);width:12px;height:12px;background:var(--jgm-bulle);transform:rotate(45deg);border-radius:2px}
#jgm-bulle.haut:after{bottom:-5px}
#jgm-bulle.bas:after{top:-5px}
#jgm-bulle .jgm-b-in{position:relative;max-width:300px;padding:11px 14px 12px}
#jgm-bulle .jgm-b-rub{position:absolute;left:0;top:0;z-index:2;width:185px;height:37px;background:url(game_thumb_is_new_tiny.png) no-repeat;background-size:185px 37px}   /* jeu nouveau : bandeau dans le coin */
/* niveau du jeu : dégradé en haut à droite de l'image (celui des vignettes, inversé) */
#jgm-bulle .jgm-b-niv{position:absolute;top:11px;right:14px;width:160px;height:22px;border-radius:0 8px 0 0}
/* mot en Noto Sans gras italique ; dessous, une ombre rouge sans décalage fondue en mode « screen » */
#jgm-bulle .jgm-b-niv:before,#jgm-bulle .jgm-b-niv:after{content:attr(data-t);position:absolute;right:10px;top:0;font:italic 700 14px/22px "JGT Noto Sans",-apple-system,Arial,sans-serif;letter-spacing:.8px;text-transform:uppercase;color:#163d74}   /* bleu foncé (U 25/10/2026) */
#jgm-bulle .jgm-b-niv:before{text-shadow:0 0 3px #ff1a1a,0 0 6px #ff1a1a;mix-blend-mode:screen}
#jgm-bulle .jgm-b-niv.exp{background:linear-gradient(270deg,#f9aa67 0,#f2b27a 60px,rgba(242,178,122,0) 160px)}
#jgm-bulle .jgm-b-niv.jr{background:linear-gradient(270deg,#f1f8d7 0,#eef0d4 60px,rgba(238,240,212,0) 160px)}
#jgm-bulle .jgm-b-niv.pre{background:linear-gradient(270deg,#f7a9ff 0,#f6b4ff 60px,rgba(246,180,255,0) 160px)}
#jgm-bulle .jgm-b-rub.maj{background-image:url(game_thumb_is_new_version_tiny.png)}   /* jeu refait : « Nouvelle version » */
#jgm-bulle.avec-img .jgm-b-in{width:300px}
#jgm-bulle img{display:block;width:272px;height:172px;border-radius:8px;margin:0 0 9px;background:#d5e1ec;object-fit:cover}
#jgm-bulle .jgm-b-t{font-weight:700;font-size:14px;line-height:1.3;color:#0f5f96;margin-bottom:4px}
#jgm-bulle p{margin:0;font-weight:400}

/* ---------- téléphone : écran plein, menus → rubriques → jeux */
#jgm-mobile{position:fixed;inset:0;z-index:1200;display:none;flex-direction:column;background:var(--jgm-panneau);color:var(--jgm-texte)}
#jgm-mobile.on{display:flex}
html.jgm-bloque,html.jgm-bloque body{overflow:hidden}
#jgm .jgm-m-haut{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;background:#fff;border-bottom:1px solid #dde4ec;flex:none}
#jgm .jgm-m-haut b{color:#1f2a36;font-size:16px}
#jgm .jgm-m-haut button{border:0;background:none;font-size:26px;color:var(--jgm-bleu);padding:0 4px;line-height:1}
#jgm .jgm-m-rech{display:flex;gap:8px;padding:10px 12px;background:var(--jgm-liste);flex:none}
#jgm .jgm-m-rech input{flex:1;min-width:0;border:0;border-radius:10px;padding:10px 12px;font-size:16px;background:var(--jgm-survol);color:#fff;font-family:inherit}
#jgm .jgm-m-rech input::placeholder{color:var(--jgm-doux)}
#jgm .jgm-m-rech button{flex:none;border:0;border-radius:10px;background:var(--jgm-survol);color:#fff;font-weight:700;width:52px;font-size:15px;line-height:1}
#jgm .jgm-m-rech button span{font-size:20px}
#jgm .jgm-m-rech button.on{background:var(--jgm-bleu)}
#jgm .jgm-m-ecran{flex:1;overflow:auto;-webkit-overflow-scrolling:touch}
#jgm .jgm-niv{padding:6px 12px 40px}
#jgm .jgm-niv.anim{animation:jgmGlisse .18s ease-out}
@keyframes jgmGlisse{from{transform:translateX(24px);opacity:.3}to{transform:none;opacity:1}}
#jgm .jgm-m-titre{font-size:20px;font-weight:700;color:#fff;margin:10px 4px}
#jgm .jgm-m-titre small{font-size:13px;font-weight:400;color:var(--jgm-doux);margin-left:6px}
#jgm .jgm-m-st{color:var(--jgm-doux);font-size:13px;margin:-6px 4px 10px}
#jgm .jgm-m-it{width:100%;display:flex;align-items:center;gap:10px;border:0;background:var(--jgm-liste);color:var(--jgm-texte);border-radius:12px;
  padding:14px;margin-bottom:6px;font-size:16px;font-weight:600;text-align:left}
#jgm .jgm-m-it span{flex:1}
#jgm .jgm-m-it small{font-weight:600;color:#c3d0d8;background:rgba(255,255,255,.1);border-radius:999px;padding:1px 8px;font-size:12px}
#jgm .jgm-m-it b{color:#8fa3ae;font-size:20px;font-weight:400;line-height:1}
#jgm .jgm-m-it.nv{color:#4ade80}
#jgm .jgm-m-sep{font-size:11px;text-transform:uppercase;letter-spacing:.8px;color:#8fa3ae;font-weight:700;margin:16px 6px 6px}
#jgm .jgm-m-ret{border:0;background:none;color:var(--jgm-titre-col);font-size:15px;padding:10px 4px 2px;font-weight:600}
#jgm .jgm-m-ecran h5.jgm-h5{margin:16px 4px 8px}
#jgm .jgm-m-g{display:grid;grid-template-columns:1fr 1fr;gap:9px 10px;justify-items:center}
#jgm .jgm-m-g .jgm-mt{zoom:.84}
#jgm .jgm-m-g .jgm-esp{grid-column:1/-1;height:4px}
#jgm .jgm-niv.grand .jgm-m-g{grid-template-columns:1fr}
#jgm .jgm-niv.grand .jgm-m-g .jgm-mt{zoom:1}
#jgm .jgm-m-res{font-size:12px;color:var(--jgm-doux);margin:14px 4px 0}

/* étiquette discrète « page de test » */
#jgm-test{position:fixed;left:10px;bottom:10px;z-index:900;background:#1f2a36;color:#fff;font:600 12px/1.2 -apple-system,"Segoe UI",Arial,sans-serif;
  padding:6px 10px;border-radius:8px;opacity:.85;pointer-events:none}