/* Observatoire électoral du Millénaire, compléments de la page d'accueil.
   Ajoutés à la V0 à facettes pour la production : drapeaux servis comme
   fichiers (une seule copie par pays, aucun identifiant SVG dupliqué dans la
   page), repère des pays trop petits pour la géométrie au 1/110 000 000,
   liste des derniers scrutins clos, pied de page. */

.ccard-drapeau img,.cal-drap img,.explo-fv-drap img{width:100%;height:100%;display:block;object-fit:cover}
.ccard-visuel .point{fill:#c7ccd6}
.ccard.n-recense .point{fill:#8b9ab8}
.ccard.n-suivi .point{fill:#5f82b8}
.ccard.n-modelise .point{fill:var(--rouge)}
.ccard-visuel .petit{font:500 7px var(--mono);fill:var(--gris);letter-spacing:.04em}

.fac-note .rien{color:#8b96a8}

.clos-liste{margin-top:14px;border-top:1px solid #3c527a;padding-top:12px}
.clos-liste>h4{font:600 10px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:#a8b4c8;margin:0 0 8px}
.clos-ligne{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.08);
  color:#dfe4ec;text-decoration:none;font-size:13px}
.clos-ligne:last-child{border-bottom:0}
.clos-ligne:hover b{text-decoration:underline}
.clos-ligne b{color:#fff;font-weight:600}
.clos-ligne .quand{font:500 11px var(--mono);color:#a8b4c8}
.clos-ligne .mesure{font:500 11px var(--mono);color:#e7ecf4}
.clos-ligne .statut{font:500 10px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:#7f8ca4}
.clos-ligne .nr{color:#e8b64a}

.pied{padding:20px 24px 28px;font:400 11px/1.6 var(--txt);color:var(--gris)}
.pied p{margin:0 0 6px;max-width:90ch}
.pied a{color:var(--marine2)}

/* ============================================================
   Frise des douze mois, sous la carte d'entrée. Reste visible quand le
   texte de l'entrée s'efface au défilement, comme le bouton du calendrier.
   ============================================================ */
.frise-mois{position:absolute;z-index:3;left:50%;bottom:22px;transform:translateX(-50%);width:min(820px,94vw);
  background:rgba(8,13,24,.72);backdrop-filter:blur(6px);border:1px solid rgba(216,182,112,.22);border-radius:14px;padding:10px 14px 8px}
.fm-tete{display:flex;align-items:center;gap:12px;margin-bottom:6px}
.fm-titre{font:600 9.5px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:#e7b96a}
.fm-etat{font:500 11px var(--mono);color:#c9d1e0;margin-right:auto}
.fm-lecture{font:700 10px var(--txt);letter-spacing:.06em;text-transform:uppercase;color:#0b1220;background:#fff;border:0;border-radius:999px;
  padding:6px 12px;cursor:pointer}
.fm-lecture[aria-pressed="true"]{background:#e7b96a}
.fm-piste{display:flex;gap:4px;touch-action:none;user-select:none}
.fm-mois{flex:1;min-width:0;background:transparent;border:0;border-radius:8px;padding:4px 2px 2px;cursor:pointer;
  display:flex;flex-direction:column;align-items:center;gap:2px;color:#8b96a8;transition:background .15s}
.fm-mois:hover:not(:disabled),.fm-mois:focus-visible{background:rgba(255,255,255,.08);outline:none}
.fm-mois:disabled{cursor:default;opacity:.45}
.fm-col{height:38px;width:100%;display:flex;align-items:flex-end;justify-content:center}
.fm-barre{display:block;width:62%;max-width:26px;background:rgba(216,182,112,.55);border-radius:4px 4px 0 0;transition:background .15s,height .3s}
.fm-mois.on .fm-barre{background:#e7b96a}
.fm-mois.on{background:rgba(231,185,106,.12);color:#fff}
.fm-n{font:600 10px var(--mono);color:inherit}
.fm-lab{font:500 9px var(--mono);letter-spacing:.04em;text-transform:uppercase;color:inherit;white-space:nowrap}

.fac-scene svg .fac-contour,.fac-scene svg .fac-rayons{transition:opacity .25s,stroke .25s,filter .25s}
.fac-scene svg.filtre-mois .fac-contour{opacity:.22}
.fac-scene svg.filtre-mois .fac-rayons{opacity:.15}
.fac-scene svg.filtre-mois .fac-contour.dans-mois{opacity:1;stroke:#fff;stroke-width:1.4;filter:drop-shadow(0 0 7px rgba(231,185,106,.75))}
.fac-note .jx{color:#e7b96a}

.carrousel .ccard{transition:transform .18s ease,box-shadow .18s ease,opacity .25s}
.carrousel.filtre-mois .ccard{opacity:.4}
.carrousel.filtre-mois .ccard.mois-on{opacity:1;box-shadow:0 0 0 2px #e7b96a,0 12px 24px rgba(22,41,77,.14)}

@media(max-width:900px){
  .frise-mois{order:3;position:relative;left:auto;bottom:auto;transform:none;margin:18px auto 0;width:min(94vw,560px)}
  .fm-lab{font-size:8px}
  .fm-col{height:30px}
}

/* ============================================================
   Volet latéral d'un pays. Panneau à droite sur grand écran, feuille
   qui monte du bas sur mobile.
   ============================================================ */
.volet{position:fixed;inset:0;z-index:300}
.volet[hidden]{display:none}
.volet-fond{position:absolute;inset:0;background:rgba(8,14,26,.55);opacity:0;transition:opacity .2s}
.volet-panneau{position:absolute;top:0;right:0;bottom:0;width:min(440px,100vw);background:#fff;box-shadow:-24px 0 60px rgba(8,14,26,.35);
  transform:translateX(100%);transition:transform .22s ease;display:flex;flex-direction:column;border-left:4px solid var(--rouge)}
.volet.on .volet-fond{opacity:1}
.volet.on .volet-panneau{transform:none}
.volet-fermer{position:absolute;top:12px;right:12px;width:34px;height:34px;border-radius:50%;border:1px solid var(--trait);background:#fff;
  font-size:18px;line-height:1;cursor:pointer;color:var(--marine)}
.volet-corps{overflow-y:auto;padding:26px 24px 30px;display:flex;flex-direction:column;gap:10px}
.volet-corps .pays{font:700 22px var(--txt);color:var(--marine);display:block;margin:0 0 4px}
.volet-corps .explo-fiche-lien{margin-top:10px}
body.volet-ouvert{overflow:hidden}
.vl-titre{font:600 9.5px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--gris);margin:12px 0 2px}
.vl-scrutin,.vl-clos{display:flex;flex-direction:column;gap:5px;padding:12px 14px;border:1px solid var(--trait);border-radius:10px;
  text-decoration:none;color:var(--marine);transition:border-color .15s,background .15s}
.vl-scrutin:hover,.vl-clos:hover{border-color:var(--marine2);background:#f7f9fc}
.vl-scrutin.n-modelise{border-left:3px solid var(--rouge)}
.vl-scrutin.n-suivi{border-left:3px solid var(--marine2)}
.vl-scrutin.vise{box-shadow:0 0 0 2px #e7b96a}
.vl-scrutin .quoi,.vl-clos .quoi{font-size:12.5px;color:#3d4757;line-height:1.35}
.vl-scrutin .quand,.vl-clos .quand{font:500 11px var(--mono);color:var(--gris)}
.vl-scrutin .proba,.vl-scrutin .agr,.vl-scrutin .rien{margin-top:4px;border-top:1px solid var(--trait);padding-top:8px;display:flex;align-items:center;gap:6px}
.vl-scrutin .agr .bar{display:flex;height:8px;flex:1;overflow:hidden}
.vl-scrutin .agr .bar i{display:block;height:8px}
.vl-scrutin .agr .t{font:500 10px var(--mono);color:var(--gris)}
.vl-clos .mesure{font:500 11px var(--mono);color:var(--marine)}
.vl-clos .mesure.nr{color:#9a6a12}
.vl-clos .statut{font:500 10px var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--gris)}
.vl-rien{font-size:13px;color:var(--gris)}
@media(max-width:640px){
  .volet-panneau{top:auto;left:0;width:100%;height:82vh;border-left:0;border-top:4px solid var(--rouge);border-radius:18px 18px 0 0;transform:translateY(100%)}
}

/* ============================================================
   Nos prévisions face aux résultats : points et intervalles.
   Couleurs d'état validées contre le fond #16294d ; l'état est aussi porté
   par la forme (point plein, losange creux) et par le texte de chaque ligne.
   ============================================================ */
.justesse{margin-top:16px;background:rgba(255,255,255,.03);border:1px solid #3c527a;border-radius:12px;padding:16px 16px 12px}
.justesse>h4{font:600 10px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:#e7b96a;margin:0 0 6px}
.js-total{color:#dfe4ec;font-size:13.5px;margin:0 0 12px;max-width:80ch}
.jo-liste{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.jo{font:600 11.5px var(--txt);color:#c9d1e0;background:transparent;border:1px solid #3c527a;border-radius:999px;padding:6px 12px;cursor:pointer}
.jo.on{background:#fff;color:var(--marine);border-color:#fff}
.jl{display:flex;flex-wrap:wrap;gap:6px 16px;font:500 10.5px var(--mono);color:#a8b4c8;margin:4px 0 10px}
.jl span{display:inline-flex;align-items:center;gap:6px}
.jl i{display:inline-block}
.jl-dans{width:10px;height:10px;border-radius:50%;background:#5b98d4}
.jl-hors{width:9px;height:9px;border:2px solid #e25c68;transform:rotate(45deg)}
.jl-centre{width:2px;height:12px;background:#fff}
.jl-iv{width:18px;height:2px;background:#a8b4c8}
.jp-tete{color:#c9d1e0;font-size:12.5px;margin:0 0 8px}
.jp-tete b{color:#fff}
.jp-tete a{color:#e7b96a}
.jm{display:flex;gap:4px;margin-bottom:6px}
.jmb{font:600 10px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:#a8b4c8;background:transparent;border:1px solid #3c527a;
  border-radius:6px;padding:4px 9px;cursor:pointer}
.jmb.on{color:var(--marine);background:#dfe4ec;border-color:#dfe4ec}
.jg{width:100%;height:auto;display:block}
.jg-grille{stroke:rgba(255,255,255,.08);stroke-width:1}
.jg-axe{font:500 10px var(--mono);fill:#7f8ca4}
.jg-parti{font:600 12px var(--txt);fill:#fff}
.jg-val{font:500 11px var(--mono);fill:#c9d1e0}
.jg-iv{stroke:#a8b4c8;stroke-width:2;stroke-linecap:round}
.jg-centre{stroke:#fff;stroke-width:2}
.jg-cible{fill:transparent}
.jg-ligne:hover .jg-cible,.jg-ligne:focus .jg-cible{fill:rgba(255,255,255,.06)}
.jg-ligne:focus{outline:none}

.jt{margin-top:8px;color:#c9d1e0;font-size:12px}
.jt summary{cursor:pointer;font:600 10px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:#a8b4c8}
.jt table{width:100%;border-collapse:collapse;margin-top:8px;font-size:12px}
.jt th{text-align:left;font:600 9.5px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:#a8b4c8;border-bottom:1px solid #3c527a;padding:5px 6px}
.jt td{padding:5px 6px;border-bottom:1px solid rgba(255,255,255,.06)}
.jt-src{font-size:11px;color:#7f8ca4;margin-top:6px}
@media(prefers-reduced-motion:reduce){
  .volet-panneau,.volet-fond,.fm-barre,.fac-scene svg .fac-contour,.carrousel .ccard{transition:none}
}
.fm-lab .l-court{display:none}
@media(max-width:640px){
  .fm-titre{display:none}
  .fm-tete{gap:8px}
  .fm-etat{font-size:10px}
  .fm-lecture{padding:6px 10px;font-size:9px;white-space:nowrap}
  .fm-piste{gap:1px}
  .fm-lab .l-long{display:none}
  .fm-lab .l-court{display:inline;font-size:8px;letter-spacing:0}
  .jg-parts,.jg-sieges{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .jg{min-width:540px}
}