/* ==========================================================================
   Pages au design "Corail" (même charte que le header)
   Listing : templates/listing.tpl + templates/includes/search.tpl (filtres)
   Fiche   : templates/sample-prenom.tpl
   Accueil, tops, articles, compte, listes, contact, outils, pages légales : voir la
   2e partie du fichier ("Composants communs" et sections suivantes).
   Chargé sur les pages listées dans templates/includes/header.tpl ($__corail).
   Comportements : theme/js/pages.js
   Mobile (< 820px) : une colonne, filtres repliés derrière un bouton,
   sommaire de la fiche en bandeau défilant.
   ========================================================================== */

body.is-corail{ background:#fbf8f6; }

.pg{
	--pg-ink:#2b2421; --pg-muted:#75685f; --pg-text2:#5c514b;
	--pg-coral:#e8604f; --pg-coral-d:#c2402f; --pg-coral-dd:#8f2d20;
	--pg-line:#efe6e1; --pg-line2:#e6dbd5; --pg-line3:#f1e9e5; --pg-dash:#ead9d2;
	--pg-tint:#fdece8; --pg-tint-bd:#f3cfc6; --pg-tint-line:#f3d3cb;
	--pg-field:#f5efeb; --pg-paper:#fbf8f6;
	--pg-f:#ca4b85; --pg-m:#1380c7; --pg-x:#825eb9;
	--pg-shadow:0 16px 30px -18px rgba(80,40,30,.4);
	max-width:1240px; margin:0 auto; padding:28px 24px 72px;
	font-family:'DM Sans',sans-serif; font-size:15px; line-height:1.5; color:var(--pg-ink);
}
@supports (color:oklch(0.6 0.17 355)){
	.pg{ --pg-f:oklch(0.6 0.17 355); --pg-m:oklch(0.58 0.14 245); --pg-x:oklch(0.56 0.14 300); }
}

/* Neutralise les styles globaux du thème (titres, p/ul à 1.2em, boutons bleus en majuscules, focus blanc) */
.pg *, .pg *::before, .pg *::after{ box-sizing:border-box; }
.pg h1, .pg h2, .pg h3{ margin:0; font-family:'Bricolage Grotesque',sans-serif; font-weight:800; line-height:1.1; color:var(--pg-ink); }
.pg p, .pg ul, .pg ol{ margin:0; font-size:inherit; line-height:inherit; }
.pg ul, .pg ol{ list-style:none; padding:0; }
.pg a, .pg a:hover, .pg a:focus{ color:inherit; text-decoration:none; }
.pg :where(button){ font:inherit; color:inherit; background:none; border:0; padding:0; margin:0; border-radius:0; text-transform:none;
	letter-spacing:normal; cursor:pointer; transition:none; box-shadow:none; min-width:0; height:auto; }
.pg img{ max-width:100%; height:auto; }
.pg :focus{ outline:none; }
.pg :focus-visible{ outline:2px solid var(--pg-coral); outline-offset:2px; }
.pg-sr{ position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

/* ---------- Fil d'Ariane (templates/includes/breadcrumb.tpl) ---------- */
.pg .breadcrumb{ display:flex; flex-wrap:wrap; align-items:center; gap:6px 8px; margin:0; padding:0; background:none; border:0; border-radius:0;
	font-size:13px; line-height:1.4; color:var(--pg-muted); }
.pg .breadcrumb > li{ display:inline-flex; align-items:center; gap:8px; margin:0; padding:0; font-size:13px; font-weight:400; }
.pg .breadcrumb > li + li::before{ content:'/'; padding:0; font-family:inherit; color:var(--pg-muted); }
.pg .breadcrumb a, .pg .breadcrumb a:focus{ color:var(--pg-muted); }
.pg .breadcrumb a:hover{ color:var(--pg-coral-d); }
.pg .breadcrumb > .active, .pg .breadcrumb strong{ color:var(--pg-ink); font-weight:600; }

/* ---------- Éléments communs ---------- */
.pg-sex{ flex:none; width:32px; height:32px; border-radius:50%; display:grid; place-items:center; color:#fff; font-size:16px; line-height:1; background:var(--pg-x); }
.pg-sex-f{ background:var(--pg-f); }
.pg-sex-m{ background:var(--pg-m); }

.pg-btn{ display:inline-flex; align-items:center; justify-content:center; gap:8px; border-radius:999px; padding:9px 16px;
	font-weight:600; font-size:14px; line-height:1.2; white-space:nowrap; }
.pg .pg-btn-coral, .pg .pg-btn-coral:focus{ background:var(--pg-coral-d); color:#fff; }
.pg .pg-btn-coral:hover{ background:var(--pg-coral-dd); color:#fff; }
.pg .pg-btn-dark, .pg .pg-btn-dark:focus{ background:var(--pg-ink); color:#fff; }
.pg .pg-btn-dark:hover{ background:#000; color:#fff; }
.pg input.pg-btn{ height:auto; width:auto; margin:0; border:0; font:inherit; font-weight:600; font-size:14px; line-height:1.2; text-transform:none; cursor:pointer; }

.pg-empty{ border:1.5px dashed var(--pg-dash); border-radius:20px; padding:18px 20px; color:var(--pg-muted); font-size:15px; }

/* Texte riche issu de l'éditeur du back-office */
.pg-prose{ font-size:16px; line-height:1.65; text-wrap:pretty; }
.pg-prose p{ margin:0 0 .9em; }
.pg-prose > :last-child, .pg-prose > :last-child > :last-child{ margin-bottom:0; }
.pg-prose h2, .pg-prose h3{ margin:1.4em 0 .5em; letter-spacing:-.02em; }
.pg-prose h2{ font-size:24px; }
.pg-prose h3{ font-size:19px; }
.pg-prose ul, .pg-prose ol{ margin:0 0 .9em; padding-left:1.3em; }
.pg-prose ul{ list-style:disc; }
.pg-prose ol{ list-style:decimal; }
.pg-prose li{ margin:.25em 0; }
.pg .pg-prose a{ color:var(--pg-coral-d); text-decoration:underline; text-decoration-color:var(--pg-tint-bd); text-underline-offset:3px; }
.pg .pg-prose a:hover{ color:var(--pg-coral-dd); text-decoration-color:currentColor; }
.pg-prose strong, .pg-prose b{ font-weight:700; }

/* ---------- Pagination ---------- */
.pg-pages{ display:flex; justify-content:center; align-items:center; gap:6px; margin-top:32px; flex-wrap:wrap; }
.pg-pnum, .pg-pbtn{ display:inline-flex; align-items:center; justify-content:center; gap:6px; height:42px; border-radius:999px;
	border:1px solid var(--pg-line2); background:#fff; color:var(--pg-ink); font-weight:600; font-size:14px; }
.pg-pnum{ min-width:42px; padding:0 8px; font-variant-numeric:tabular-nums; }
.pg-pbtn{ padding:0 16px; }
.pg a.pg-pnum:hover, .pg a.pg-pbtn:hover{ border-color:var(--pg-tint-bd); background:#fffaf8; }
.pg-pnum.is-current{ background:var(--pg-ink); border-color:var(--pg-ink); color:#fff; }
.pg-pbtn.is-off{ opacity:.4; }
.pg-pgap{ min-width:24px; text-align:center; color:var(--pg-muted); }
.pg-pinfo{ text-align:center; font-size:13px; color:var(--pg-muted); margin-top:12px; font-variant-numeric:tabular-nums; }
/* Grille des dizaines : --c colonnes (≤ 20) si la place le permet, sinon --cm (≤ 10) ; les centaines servent de repères */
.pg-pjump{ container-type:inline-size; margin-top:36px; }
.pg .pg-pjump-h{ display:flex; align-items:center; gap:14px; margin-bottom:14px; font-size:11.5px; font-weight:600; letter-spacing:.09em;
	text-transform:uppercase; color:var(--pg-muted); }
.pg-pjump-h::before, .pg-pjump-h::after{ content:''; flex:1; height:1px; background:var(--pg-line2); }
.pg-pjump-grid{ --cols:var(--cm); display:grid; grid-template-columns:repeat(var(--cols),minmax(0,1fr)); gap:4px;
	max-width:calc(var(--cols) * 52px); margin:0 auto; color:var(--pg-muted); }
@container (min-width:720px){ .pg-pjump-grid{ --cols:var(--c); } }
.pg-pjump-grid > *{ display:grid; place-items:center; height:32px; border-radius:10px; font-size:13px; font-variant-numeric:tabular-nums; }
.pg-pjump-grid .is-hundred{ color:var(--pg-ink); font-weight:700; }
.pg .pg-pjump-grid a:hover{ background:var(--pg-tint); color:var(--pg-coral-d); }
.pg-pjump-grid .is-current{ background:var(--pg-ink); color:#fff; font-weight:700; }
.pg-pages-coral .pg-pjump-grid .is-current{ background:var(--pg-coral); }

/* ==========================================================================
   Listing
   ========================================================================== */
.lp-head{ display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:20px; margin:14px 0 24px; }
.lp-head-t{ flex:1 1 100%; min-width:0; } /* titre sur toute la largeur, le CTA "créer un compte" passe dessous */
.lp-h1{ font-size:clamp(32px,5vw,54px); letter-spacing:-.035em; line-height:1.02; text-wrap:balance; }
.lp-count{ margin-top:10px; color:var(--pg-muted); font-size:15px; }
.lp-cta{ display:flex; align-items:center; gap:10px 14px; flex-wrap:wrap; background:var(--pg-tint); border-radius:18px; padding:10px 10px 10px 18px; font-size:14px; }
.lp-intro{ margin:0 0 28px; max-width:880px; }

.lp-layout{ display:grid; grid-template-columns:272px minmax(0,1fr); gap:28px; align-items:start; }
.lp-main{ min-width:0; container-type:inline-size; } /* conteneur : nombre de colonnes de .lp-grid */

/* --- Filtres --- */
.pg .lp-side-toggle{ display:none; }
/* Colonne collante sur ordinateur (position et top posés par theme/js/pages.js), sans barre de défilement
   interne : plus haute que la fenêtre, elle défile avec la page jusqu'à ce que son bas ou son haut apparaisse */
.lp-filters{ background:#fff; border:1px solid var(--pg-line); border-radius:24px; padding:6px 8px 10px; }
.lp-f-head{ display:flex; justify-content:space-between; align-items:center; gap:10px; padding:12px 10px; }
.lp-f-title{ display:flex; align-items:center; gap:8px; font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:18px; }
.lp-badge{ min-width:22px; height:22px; border-radius:999px; background:var(--pg-coral-d); color:#fff; font-family:'DM Sans',sans-serif;
	font-size:12px; font-weight:600; display:grid; place-items:center; padding:0 6px; }
.pg .lp-f-reset{ color:var(--pg-coral-d); font-size:13px; font-weight:600; }
.pg .lp-f-reset:hover{ color:var(--pg-coral-dd); }

.lp-g{ border-top:1px solid var(--pg-line3); }
.lp-g-h{ display:flex; align-items:center; gap:8px; padding:12px 10px; cursor:pointer; list-style:none; font-weight:600; font-size:14.5px; user-select:none; }
.lp-g-h::-webkit-details-marker{ display:none; }
.lp-g-h::marker{ content:''; }
.lp-g-h:hover .lp-g-t{ color:var(--pg-coral-d); }
.lp-g-t{ flex:1; min-width:0; }
.lp-g-sel{ font-size:12px; font-weight:600; background:var(--pg-tint); color:var(--pg-coral-dd); border-radius:999px; padding:3px 9px;
	max-width:120px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.lp-g[open] .lp-g-sel{ display:none; } /* groupe ouvert : la sélection est déjà visible dans la liste */
.lp-caret{ font-size:11px; color:var(--pg-muted); transition:transform .15s; }
.lp-g[open] .lp-caret{ transform:rotate(180deg); }
.lp-g-b{ padding:0 4px 12px; }

.pg .lp-g-q{ display:block; width:100%; max-width:none; height:36px; margin:0 0 6px; padding:0 10px; border:1px solid var(--pg-line2); border-radius:10px;
	background:var(--pg-paper); font:inherit; font-size:13.5px; color:var(--pg-ink); outline:none; }
.pg .lp-g-q:focus{ border-color:var(--pg-tint-bd) !important; background:#fff; }
.pg .lp-g-q[hidden]{ display:none; }

.lp-list{ display:flex; flex-direction:column; }
.pg .lp-li{ display:flex; justify-content:space-between; align-items:center; gap:8px; border-radius:10px; padding:7px 8px; font-size:14px; color:var(--pg-ink); }
.pg .lp-li:hover{ background:var(--pg-tint); color:var(--pg-ink); }
.pg .lp-li.is-on{ background:var(--pg-tint); color:var(--pg-coral-dd); font-weight:700; }
.lp-n{ font-size:12px; opacity:.6; font-variant-numeric:tabular-nums; }
.lp-li.is-on .lp-n::after{ content:' \2715'; }

.lp-cells{ display:grid; grid-template-columns:repeat(6,1fr); gap:4px; }
.lp-cells-7{ grid-template-columns:repeat(7,1fr); }
.pg .lp-cell{ height:34px; display:grid; place-items:center; border-radius:10px; border:1px solid var(--pg-line); background:var(--pg-paper);
	color:var(--pg-ink); font-weight:600; font-size:13px; }
.pg .lp-cell:hover{ background:var(--pg-tint); border-color:var(--pg-tint-bd); color:var(--pg-ink); }
.pg .lp-cell.is-on{ background:var(--pg-ink); border-color:var(--pg-ink); color:#fff; }

.lp-g .is-extra{ display:none; }
.lp-g.is-more .is-extra, .lp-g.is-search .is-extra{ display:block; }
.lp-g li[hidden]{ display:none !important; }
.lp-g.is-search .lp-more{ display:none; }
.pg .lp-more{ color:var(--pg-coral-d); font-weight:600; font-size:13px; padding:8px 8px 0; }
.pg .lp-more:hover{ color:var(--pg-coral-dd); }
.lp-g-empty{ font-size:13px; color:var(--pg-muted); padding:6px 8px; }
.lp-g-empty[hidden]{ display:none; }

/* --- Barre des filtres actifs --- */
.lp-bar{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-bottom:16px; }
.pg .lp-chip{ display:inline-flex; gap:8px; align-items:center; background:var(--pg-tint); color:var(--pg-coral-dd); border-radius:999px;
	padding:6px 8px 6px 12px; font-size:13px; font-weight:600; }
.pg .lp-chip:hover{ background:var(--pg-tint-bd); color:var(--pg-coral-dd); }
.lp-chip-x{ width:18px; height:18px; border-radius:50%; background:#fff; display:grid; place-items:center; font-size:11px; }
.pg .lp-clear{ font-size:13px; font-weight:600; color:var(--pg-muted); padding:6px 4px; }
.pg .lp-clear:hover{ color:var(--pg-coral-d); }

/* --- Cartes prénoms (displayPrenomCard) --- */
/* 4 colonnes, 2 si la colonne des résultats fait moins de 720px : avec un nombre de prénoms par page
   multiple de 4 (templates/headers/listing.php), chaque ligne est pleine. @media : navigateurs sans @container */
.lp-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
@media (min-width:1100px){ .lp-grid{ grid-template-columns:repeat(4,minmax(0,1fr)); } }
@container (min-width:720px){ .lp-grid{ grid-template-columns:repeat(4,minmax(0,1fr)); } }
.pc-li{ display:flex; min-width:0; }
.pg .pc{ flex:1; min-width:0; display:flex; flex-direction:column; gap:8px; min-height:188px; padding:18px; background:#fff; border:1px solid var(--pg-line);
	border-radius:22px; color:var(--pg-ink); transition:transform .15s, box-shadow .15s; }
.pg .pc:hover{ transform:translateY(-3px); box-shadow:var(--pg-shadow); color:var(--pg-ink); }
.pc-top{ display:flex; align-items:center; gap:8px; }
.pc-len{ margin-left:auto; font-size:12px; font-weight:600; color:var(--pg-muted); background:var(--pg-field); border-radius:999px; padding:4px 10px; white-space:nowrap; }
.pc-fav{ color:var(--pg-coral); font-size:16px; line-height:1; }
.pc-name{ margin-top:8px; font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:26px; letter-spacing:-.025em; line-height:1.05; overflow-wrap:break-word; }
.pc-desc{ font-size:14px; line-height:1.45; color:var(--pg-text2); text-wrap:pretty; }
.pc-cta{ margin-top:auto; font-size:13.5px; font-weight:600; color:var(--pg-coral-d); }
.lp-ad{ grid-column:1/-1; min-width:0; }
.lp-ad:empty, .pf-ad:empty{ display:none; }

.lp-empty{ border:1.5px dashed var(--pg-dash); border-radius:22px; padding:48px 24px; text-align:center; color:var(--pg-muted); }
.lp-empty .pg-btn{ margin-top:14px; }
.lp-body{ margin-top:48px; max-width:880px; }

/* ==========================================================================
   Fiche prénom
   ========================================================================== */
.pf{ padding-top:24px; }

/* --- Hero (1re ligne de .pf-layout, à droite du sommaire) --- */
.pf-hero{ background:var(--pg-tint); border-radius:32px; padding:clamp(22px,4vw,48px); display:flex; flex-direction:column; gap:28px; }
.pf-tags{ display:flex; gap:6px; flex-wrap:wrap; margin-bottom:18px; }
.pf-tag{ display:inline-flex; align-items:center; gap:5px; background:#fff; border-radius:999px; padding:6px 12px; font-size:13px; font-weight:500; }
.pf-tag-sex{ color:#fff; font-weight:600; background:var(--pg-x); }
.pf-sex-f .pf-tag-sex{ background:var(--pg-f); }
.pf-sex-m .pf-tag-sex{ background:var(--pg-m); }
.pf-tag-fav{ color:var(--pg-coral-dd); font-weight:600; }
/* La taille suit la longueur du prénom (--n) pour ne jamais déborder */
.pf .pf-name{ font-weight:800; letter-spacing:-.05em; line-height:.9; overflow-wrap:break-word;
	font-size:clamp(40px, min(9vw, calc((min(100vw, 1240px) - 420px) * 1.7 / var(--n, 8))), 120px); }
.pf-quote{ font-size:clamp(17px,2vw,21px); line-height:1.45; max-width:560px; margin-top:18px !important; text-wrap:pretty; }

.pf-stats{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px; }
.pf-stat{ background:#fff; border-radius:18px; padding:16px 18px; }
.pf-stat-v{ display:block; font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:30px; letter-spacing:-.03em; line-height:1.15; }
.pf-stat-k{ display:flex; align-items:center; gap:6px; font-size:13px; line-height:1.35; color:var(--pg-muted); margin-top:2px; }
.pf-flag{ flex:none; width:20px; height:14px; border-radius:3px; object-fit:cover; display:block; box-shadow:0 0 0 1px rgba(0,0,0,.08); }

.pf-votes{ display:flex; flex-wrap:wrap; gap:14px 32px; align-items:center; border-top:1px solid var(--pg-tint-line); padding-top:22px; }
.pf-vote{ display:flex; flex-wrap:wrap; align-items:center; gap:10px 14px; margin:0; }
.pf-vote-q{ font-weight:600; font-size:14.5px; }
.pf-vote-btns{ display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin:0; }
.pg .pf-chip{ display:inline-flex; align-items:center; gap:6px; height:40px; padding:0 16px; border-radius:999px; border:1px solid var(--pg-line2);
	background:#fff; color:var(--pg-ink); font-weight:600; font-size:14px; white-space:nowrap; }
.pg button.pf-chip:hover{ border-color:var(--pg-ink); }
.pg button.pf-chip:focus{ border-color:var(--pg-line2) !important; }
.pg button.pf-chip:focus-visible{ border-color:var(--pg-ink) !important; }
.pg .pf-chip.is-on{ background:var(--pg-ink); border-color:var(--pg-ink); color:#fff; }
.pf-chip b{ font-weight:500; opacity:.6; }
.pf-vote-note{ font-size:13px; color:var(--pg-muted); }

/* --- Mise en page : sommaire à gauche dès le hero, hero puis contenu à droite --- */
.pf-layout{ display:grid; grid-template-columns:230px minmax(0,1fr); gap:40px; margin-top:14px; align-items:start; }
.pf-layout > .pf-hero{ grid-column:2; grid-row:1; }
.pf-layout > .pf-side{ grid-column:1; grid-row:1 / span 2; }
.pf-layout > .pf-main{ grid-column:2; grid-row:2; }
.pf-side{ position:sticky; top:140px; max-height:calc(100vh - 160px); overflow:auto; overscroll-behavior:contain; display:flex; flex-direction:column; gap:2px; }
.pf-h{ font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--pg-muted); }
.pf-side > .pf-h{ margin:0 0 8px 12px; }
.pf-toc{ display:flex; flex-direction:column; gap:2px; }
.pg .pf-toc a{ display:flex; gap:10px; padding:8px 12px; border-radius:12px; font-size:14px; line-height:1.35; color:var(--pg-ink); }
.pg .pf-toc a:hover{ background:var(--pg-tint); }
.pf-toc-n{ flex:none; color:var(--pg-coral-d); font-weight:700; font-variant-numeric:tabular-nums; }
.pf-toc-n + span{ min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

.pf-main{ display:flex; flex-direction:column; gap:52px; min-width:0; }
.pf-sec{ min-width:0; }
.pf-h2{ font-size:clamp(24px,3vw,32px); letter-spacing:-.03em; margin-bottom:16px !important; text-wrap:balance; }
.pf-sub{ margin:-10px 0 16px !important; color:var(--pg-muted); font-size:14px; }
.pf-h3{ font-size:20px; letter-spacing:-.02em; margin-top:8px !important; }
.pf-card{ background:#fff; border:1px solid var(--pg-line); border-radius:24px; padding:24px; display:flex; flex-direction:column; gap:18px; min-width:0; }
.pf-none{ color:var(--pg-muted); font-size:15px; }
.pf-para + .pf-para{ margin-top:.9em; }
.pf-after{ margin-top:18px; }

/* --- Présentation --- */
.pf-intro{ display:flex; flex-direction:column; gap:16px; }
.pf-intro .pg-prose{ font-size:17px; }
.pf-basic{ font-size:15px; color:var(--pg-text2); }
.pf-links{ display:flex; gap:8px; flex-wrap:wrap; }
.pg .pf-link{ display:inline-flex; align-items:center; gap:6px; border:1px solid var(--pg-line2); background:#fff; border-radius:999px; padding:9px 14px;
	font-weight:600; font-size:13.5px; color:var(--pg-ink); }
.pg .pf-link:hover{ border-color:var(--pg-tint-bd); background:#fffaf8; color:var(--pg-ink); }
.pf-notice{ background:#e9f6ee; color:#1f6b41; border-radius:16px; padding:12px 16px; font-weight:600; font-size:14.5px; }
.pf-save{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; background:var(--pg-ink); color:#fff;
	border-radius:20px; padding:14px 14px 14px 20px; font-size:14.5px; margin:0; }
.pf-save-t{ flex:1 1 240px; }
.pf-save-f{ display:flex; gap:8px; flex-wrap:wrap; margin:0; }
.pg .pf-save select{ height:40px; max-width:100%; padding:0 34px 0 14px; border:0; border-radius:999px; background:#fff; color:var(--pg-ink); font:inherit; font-size:14px; }
.pg .pf-save select:focus{ border:0 !important; }
.pg .pf-save .pg-btn{ height:40px; }
.pg .pf-save .pg-btn-coral, .pg .pf-save .pg-btn-coral:focus{ background:var(--pg-coral); }
.pg .pf-save .pg-btn-coral:hover{ background:var(--pg-coral-d); }

/* --- Répartition par sexe --- */
.pf-split{ display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.pf-split-v{ font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:clamp(34px,5vw,48px); letter-spacing:-.03em; line-height:1.1; }
.pf-split-k{ color:var(--pg-muted); font-size:14px; }
.pf-split-f .pf-split-v{ color:var(--pg-f); }
.pf-split-m{ text-align:right; }
.pf-split-m .pf-split-v{ color:var(--pg-m); }
.pf-bar{ height:14px; border-radius:999px; background:var(--pg-m); overflow:hidden; display:flex; }
.pf-bar span{ background:var(--pg-f); border-right:2px solid #fff; }
.pf-split-txt{ display:flex; justify-content:space-between; gap:8px 24px; flex-wrap:wrap; font-size:13.5px; color:var(--pg-muted); }
.pf-split-txt p:last-child{ text-align:right; }

/* --- Chiffres et tendances (graphique SVG) --- */
.pf-tabs{ display:flex; gap:4px; background:var(--pg-field); border-radius:22px; padding:4px; align-self:flex-start; flex-wrap:wrap; }
.pg .pf-tab{ display:flex; align-items:center; gap:8px; border-radius:999px; padding:8px 16px; color:var(--pg-muted); font-weight:600; font-size:14px; }
.pg .pf-tab:hover{ color:var(--pg-ink); }
.pg .pf-tab.is-on{ background:#fff; color:var(--pg-ink); box-shadow:0 1px 3px rgba(60,30,20,.18); }
.pf-tabs[hidden]{ display:none; }
.pf-country{ display:flex; align-items:center; gap:8px; font-weight:700; font-size:15px; }
.pf-trend.is-tabbed .pf-country{ display:none; }
.pf-trend.is-tabbed .pf-panel:not(.is-on){ display:none; }
.pf-panel{ display:flex; flex-direction:column; gap:18px; }
.pf-panel + .pf-panel{ border-top:1px solid var(--pg-line3); padding-top:18px; }
.pf-trend.is-tabbed .pf-panel + .pf-panel{ border-top:0; padding-top:0; }
.pf-panel-t{ font-size:15px; line-height:1.6; color:var(--pg-text2); text-wrap:pretty; }
.pf-mini{ display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:10px; }
.pf-mini div{ background:var(--pg-paper); border-radius:16px; padding:14px; }
.pf-mini b{ display:block; font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:24px; line-height:1.2; }
.pf-mini span{ display:block; font-size:12.5px; line-height:1.35; color:var(--pg-muted); }

.pf-chart{ position:relative; height:250px; margin-top:18px; }
.pf-plot{ position:absolute; left:0; right:0; top:0; bottom:26px; touch-action:pan-y; }
.pf-plot svg{ position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.pf-area{ fill:rgba(232,96,79,.13); }
.pf-line{ fill:none; stroke:var(--pg-coral); stroke-width:2.5px; vector-effect:non-scaling-stroke; stroke-linejoin:round; }
.pf-grid{ position:absolute; left:0; right:0; border-top:1px dashed var(--pg-line); }
.pf-grid span{ position:absolute; right:0; top:-18px; font-size:11px; color:var(--pg-muted); }
.pf-grid-0{ border-top:1px solid var(--pg-line2); }
.pf-dot{ position:absolute; width:14px; height:14px; border-radius:50%; background:#fff; border:3px solid var(--pg-coral); transform:translate(-50%,-50%); pointer-events:none; }
.pf-tip{ position:absolute; transform:translate(-50%,-170%); background:var(--pg-ink); color:#fff; font-size:12px; font-weight:600; padding:5px 9px; border-radius:9px;
	white-space:nowrap; pointer-events:none; }
.pf-peak-r .pf-tip{ transform:translate(-88%,-170%); }
.pf-peak-l .pf-tip{ transform:translate(-12%,-170%); }
.pf-hover{ display:none; }
.pf-plot.is-hover .pf-peak{ display:none; }
.pf-plot.is-hover .pf-hover{ display:block; }
.pf-ticks{ position:absolute; left:0; right:0; bottom:0; height:18px; }
.pf-ticks span{ position:absolute; transform:translateX(-50%); font-size:11px; color:var(--pg-muted); }

/* --- Onglet « Tous les pays » : courbes de tous les pays sur un graphique (construit par theme/js/pages.js,
   couleur de chaque pays dans --c ; pointillés = pays qui ne publient qu'un top) --- */
.pf-tab-ico{ flex:none; width:20px; height:14px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.pf-all-bar{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px 16px; }
.pf-all-keys{ display:flex; flex-wrap:wrap; gap:6px; }
.pg .pf-key{ display:flex; align-items:center; gap:7px; border:1px solid var(--pg-line2); background:#fff; border-radius:999px; padding:6px 12px 6px 10px;
	font-size:13.5px; font-weight:600; color:var(--pg-ink); }
.pg .pf-key:hover{ border-color:#cdbfb7; }
.pg .pf-key[aria-pressed="false"]{ color:var(--pg-muted); background:var(--pg-paper); border-style:dashed; }
.pf-key[aria-pressed="false"] .pf-flag{ opacity:.45; filter:grayscale(1); }
.pf-key-l, .pf-mtip-r i{ flex:none; width:16px; height:3px; border-radius:2px; background:var(--c); }
.pf-key-l.is-dash, .pf-mtip-r i.is-dash{ background:repeating-linear-gradient(90deg, var(--c) 0 5px, transparent 5px 8px); }
.pf-key[aria-pressed="false"] .pf-key-l{ background:var(--pg-line2); }
.pf-all-modes{ display:flex; gap:2px; background:var(--pg-field); border-radius:999px; padding:3px; }
.pg .pf-mode{ border-radius:999px; padding:5px 12px; font-size:13px; font-weight:600; color:var(--pg-muted); white-space:nowrap; }
.pg .pf-mode:hover{ color:var(--pg-ink); }
.pg .pf-mode.is-on{ background:#fff; color:var(--pg-ink); box-shadow:0 1px 3px rgba(60,30,20,.18); }
.pf-all .pf-chart{ margin-top:0; }
.pf-mline{ fill:none; stroke:var(--c); stroke-width:2px; vector-effect:non-scaling-stroke; stroke-linejoin:round; stroke-linecap:round; }
.pf-mline.is-dash{ stroke-dasharray:6 4; }
.pf-cross{ position:absolute; top:0; bottom:0; border-left:1px solid rgba(43,36,33,.3); display:none; pointer-events:none; }
.pf-mdot{ position:absolute; width:11px; height:11px; border-radius:50%; background:#fff; border:2.5px solid var(--c); transform:translate(-50%,-50%);
	pointer-events:none; display:none; }
.pf-mtip{ position:absolute; top:0; z-index:2; background:#fff; border:1px solid var(--pg-line2); border-radius:12px; box-shadow:var(--pg-shadow);
	padding:8px 11px; font-size:12.5px; line-height:1.35; pointer-events:none; display:none; }
.pf-mplot.is-hover .pf-cross, .pf-mplot.is-hover .pf-mtip, .pf-mplot.is-hover .pf-mdot.is-on{ display:block; }
.pf-mtip-h{ font-weight:700; margin-bottom:5px; white-space:nowrap; }
.pf-mtip-h span{ font-weight:500; color:var(--pg-muted); }
.pf-mtip-r{ display:flex; align-items:center; gap:7px; white-space:nowrap; }
.pf-mtip-r + .pf-mtip-r{ margin-top:4px; }
.pf-mtip-r i{ width:12px; }
.pf-mtip-r .pf-flag{ width:16px; height:11px; border-radius:2px; }
.pf-mtip-r span{ flex:1; color:var(--pg-text2); padding-right:10px; }
.pf-mtip-r b{ font-weight:700; font-variant-numeric:tabular-nums; }
.pf-mtip-r small{ min-width:48px; text-align:right; font-size:11.5px; color:var(--pg-muted); font-variant-numeric:tabular-nums; }
.pf-all-note{ font-size:13px; line-height:1.55; color:var(--pg-muted); text-wrap:pretty; }

/* --- Étymologie, fête --- */
.pf-facts{ display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:10px; }
.pf-facts div{ border:1px solid var(--pg-line); border-radius:16px; padding:12px 14px; }
.pf-facts span{ display:block; font-size:12px; color:var(--pg-muted); }
.pf-facts b{ display:block; font-weight:700; margin-top:2px; }
.pf-fete{ flex-direction:row; align-items:center; flex-wrap:wrap; padding:20px 24px; }
.pf-day{ flex:none; min-width:76px; height:76px; padding:0 8px; border-radius:20px; background:var(--pg-tint); color:var(--pg-coral-dd);
	display:flex; flex-direction:column; align-items:center; justify-content:center; }
.pf-day b{ font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:30px; line-height:1; }
.pf-day span{ font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; margin-top:3px; }
.pf-fete .pg-prose{ flex:1 1 260px; font-size:15.5px; line-height:1.6; }

/* --- Célébrités --- */
.pf-celebs{ display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:10px; }
.pf-celeb{ background:#fff; border:1px solid var(--pg-line); border-radius:20px; padding:14px; display:flex; gap:12px; align-items:flex-start; min-width:0; }
.pf-ini{ flex:none; width:44px; height:44px; border-radius:50%; background:var(--pg-tint); color:var(--pg-coral-d); display:grid; place-items:center;
	font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:16px; }
.pf-celeb-n{ font-weight:700; font-size:15px; line-height:1.25; }
.pf-celeb-d{ font-size:12.5px; color:var(--pg-muted); margin-top:2px; }
.pf-celeb-t{ font-size:13.5px; line-height:1.5; color:var(--pg-text2); margin-top:6px; overflow-wrap:break-word; }

/* --- Prénoms composés, similaires, surnoms --- */
.pf-comps{ display:flex; gap:8px; flex-wrap:wrap; }
.pg .pf-comp{ display:inline-flex; gap:10px; align-items:center; background:#fff; border:1px solid var(--pg-line); border-radius:999px; padding:9px 14px 9px 16px;
	font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:16px; color:var(--pg-ink); }
.pg .pf-comp:hover{ border-color:var(--pg-tint-bd); background:#fffaf8; color:var(--pg-ink); }
.pf-comp span{ font-family:'DM Sans',sans-serif; font-size:12px; font-weight:500; color:var(--pg-muted); }

.pf-sims{ display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:10px; }
.pg .pf-simc{ display:flex; justify-content:space-between; align-items:center; gap:8px; background:#fff; border:1px solid var(--pg-line); border-radius:18px;
	padding:14px 16px; color:var(--pg-ink); min-width:0; }
.pg .pf-simc:hover{ border-color:var(--pg-tint-bd); background:#fffaf8; color:var(--pg-ink); }
.pf-simc-n{ display:block; font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:19px; line-height:1.2; overflow-wrap:break-word; }
.pf-simc-l{ font-size:12px; color:var(--pg-muted); }
.pf-simc .pg-sex{ width:28px; height:28px; font-size:14px; }

.pf-nicks{ display:flex; gap:8px; flex-wrap:wrap; }
.pf-nick{ background:var(--pg-tint); color:var(--pg-coral-dd); border-radius:999px; padding:9px 16px; font-weight:600; font-size:14.5px; }

/* --- FAQ --- */
.pf-faq{ background:#fff; border:1px solid var(--pg-line); border-radius:24px; padding:6px 22px; }
.pf-faq details{ border-bottom:1px solid var(--pg-line3); }
.pf-faq details:last-child{ border-bottom:0; }
.pf-faq summary{ display:flex; justify-content:space-between; align-items:center; gap:16px; padding:18px 0; cursor:pointer; list-style:none;
	font-weight:600; font-size:15.5px; line-height:1.4; }
.pf-faq summary::-webkit-details-marker{ display:none; }
.pf-faq summary::marker{ content:''; }
.pf-faq summary::after{ content:'+'; flex:none; width:28px; height:28px; border-radius:50%; background:var(--pg-field); display:grid; place-items:center; font-weight:500; }
.pf-faq details[open] summary::after{ content:'\2212'; }
.pf-faq-a{ margin:-4px 0 18px; color:var(--pg-text2); line-height:1.6; font-size:15px; }

/* --- Commentaires --- */
.pf-coms{ display:flex; flex-direction:column; gap:10px; }
.pf-com{ background:#fff; border:1px solid var(--pg-line); border-radius:20px; padding:16px 18px; display:flex; gap:14px; }
.pf-com .pf-ini{ width:38px; height:38px; font-family:'DM Sans',sans-serif; font-weight:700; font-size:15px; }
.pf-com-body{ min-width:0; }
.pf-com-a{ font-weight:700; font-size:14.5px; }
.pf-com-a span{ font-weight:400; color:var(--pg-muted); font-size:13px; }
.pf-com-t{ margin-top:4px !important; line-height:1.55; font-size:15px; overflow-wrap:break-word; }
.pf-count{ color:var(--pg-muted); font-weight:500; }
.pf-comform{ margin-top:16px; background:#fff; border:1px solid var(--pg-line); border-radius:24px; padding:20px; display:grid;
	grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:10px; }
.pg .pf-comform input[type="text"], .pg .pf-comform input[type="email"], .pg .pf-comform textarea{ width:100%; max-width:none; margin:0; border:1px solid var(--pg-line2);
	border-radius:14px; background:var(--pg-paper); color:var(--pg-ink); font:inherit; font-size:15px; line-height:1.4; }
.pg .pf-comform input[type="text"], .pg .pf-comform input[type="email"]{ height:46px; padding:0 14px; }
.pg .pf-comform textarea{ grid-column:1/-1; min-height:110px; height:auto; padding:12px 14px; resize:vertical; }
.pg .pf-comform input:focus, .pg .pf-comform textarea:focus{ border-color:var(--pg-tint-bd) !important; background:#fff; box-shadow:0 0 0 3px var(--pg-tint); }
.pf-comform .g-recaptcha{ grid-column:1/-1; min-height:78px; }
.pf-comform-f{ grid-column:1/-1; display:flex; justify-content:flex-end; }
.pg .pf-comform input[type="submit"]{ height:auto; width:auto; border:0; border-radius:999px; padding:12px 22px; background:var(--pg-coral-d); color:#fff;
	font:inherit; font-weight:600; font-size:15px; text-transform:none; cursor:pointer; }
.pg .pf-comform input[type="submit"]:hover{ background:var(--pg-coral-dd); }
.pf-msg{ grid-column:1/-1; font-weight:600; font-size:14.5px; margin:0; }
.pf-msg-err{ color:var(--pg-coral-d); }
.pf-msg-ok{ color:#1f6b41; }

/* --- Catégories --- */
.pf-cats{ display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:12px; }
.pg .pf-cat{ display:block; background:#fff; border:1px solid var(--pg-line); border-radius:22px; padding:8px 8px 14px; color:var(--pg-ink); transition:box-shadow .15s; }
.pg .pf-cat:hover{ box-shadow:var(--pg-shadow); color:var(--pg-ink); }
.pf-cat img{ display:block; width:100%; height:auto; aspect-ratio:4/3; object-fit:cover; border-radius:16px; background:var(--pg-field); }
.pf-cat-t{ display:block; font-weight:700; margin:12px 8px 0; line-height:1.3; }

.pf-ad{ min-width:0; }

/* ==========================================================================
   Mobile
   ========================================================================== */
@media (max-width:819px){
	.pg{ padding:20px 16px 56px; }
	.pf{ padding-top:20px; }

	.lp-layout{ grid-template-columns:minmax(0,1fr); gap:16px; }
	.lp-cta{ width:100%; }
	.pg .lp-side-toggle{ display:block; width:100%; height:48px; border:1.5px solid var(--pg-ink); background:#fff; border-radius:999px;
		font-weight:600; font-size:14.5px; color:var(--pg-ink); }
	.pg .lp-side-toggle:focus{ border-color:var(--pg-ink) !important; }
	.lp-filters{ display:none; margin-top:12px; }
	.lp-side.is-open .lp-filters{ display:block; }
	.lp-cells-7{ grid-template-columns:repeat(9,1fr); }
	.lp-grid{ gap:10px; }
	.pg .pc{ min-height:0; padding:16px; }
	.pc-name{ font-size:23px; }
	.pg-pbtn span{ display:none; }

	.pf-hero{ border-radius:26px; gap:22px; }
	.pf .pf-name{ font-size:clamp(34px, calc((100vw - 76px) * 1.7 / var(--n, 8)), 64px); }
	.pf-stats{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
	.pf-stat{ padding:12px 14px; border-radius:16px; }
	.pf-stat-v{ font-size:24px; }
	.pf-stat-k{ font-size:12.5px; align-items:flex-start; }
	.pf-stat-k .pf-flag{ margin-top:1px; }
	.pf-votes{ gap:16px; }

	.pf-layout{ grid-template-columns:minmax(0,1fr); gap:28px; }
	.pf-layout > .pf-hero, .pf-layout > .pf-side, .pf-layout > .pf-main{ grid-column:auto; grid-row:auto; }
	.pf-side{ position:static; max-height:none; overflow:visible; margin:0 -16px; }
	.pf-side > .pf-h, .pf-toc-n{ display:none; }
	.pf-toc{ flex-direction:row; gap:6px; overflow-x:auto; padding:0 16px 4px; scrollbar-width:none; -webkit-overflow-scrolling:touch; }
	.pf-toc::-webkit-scrollbar{ display:none; }
	.pg .pf-toc a{ flex:none; border:1px solid var(--pg-line2); background:#fff; border-radius:999px; padding:8px 14px; font-size:13.5px; white-space:nowrap; }
	.pf-main{ gap:44px; }
	.pf-card{ padding:18px; border-radius:20px; }
	.pf-faq{ padding:4px 18px; }
	.pf-chart{ height:210px; }
	.pg .pf-tab{ padding:7px 12px; gap:7px; }
	.pg .pf-key{ padding:5px 10px 5px 8px; gap:6px; font-size:13px; }
}

@media (prefers-reduced-motion:reduce){
	.pg .pc, .lp-caret{ transition:none; }
	.pg .pc:hover{ transform:none; }
}


/* ==========================================================================
   Composants communs (accueil, tops, articles, compte, listes, contact, outils, pages légales)
   ========================================================================== */
.pg-narrow{ max-width:1088px; }
.pg-xnarrow{ max-width:808px; }
.pg .pg-kicker{ font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--pg-coral-d); }
.pg .pg-h1{ font-size:clamp(34px,5vw,54px); letter-spacing:-.035em; line-height:1.02; text-wrap:balance; }
.pg .pg-h2{ font-size:clamp(26px,3.4vw,38px); letter-spacing:-.03em; line-height:1.05; text-wrap:balance; }
.pg .pg-h3{ font-size:24px; letter-spacing:-.03em; line-height:1.15; }
.pg-head{ display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:16px 20px; margin:14px 0 22px; }
.pg-head-t{ flex:1 1 460px; min-width:0; }
.pg .pg-head-d{ margin-top:10px !important; color:var(--pg-muted); font-size:15.5px; line-height:1.5; }
.pg-sh{ display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:12px 16px; margin-bottom:20px; }
.pg .pg-sh-d{ margin-top:8px !important; color:var(--pg-muted); font-size:15px; }
.pg-center{ display:flex; justify-content:center; margin-top:24px; }
.pg-center[hidden], .pg [hidden]{ display:none !important; }

/* Boutons */
.pg .pg-btn-lg{ padding:12px 24px; font-size:15px; }
.pg .pg-btn-xl{ height:52px; padding:0 26px; font-weight:700; font-size:15px; }
.pg .pg-btn-line, .pg .pg-btn-line:focus{ border:1.5px solid var(--pg-ink) !important; background:#fff; color:var(--pg-ink); padding:9px 18px; }
.pg .pg-btn-line:hover{ background:var(--pg-ink); color:#fff; }
.pg .pg-btn-line.pg-btn-lg{ padding:11px 24px; }
.pg .pg-btn-line-s, .pg .pg-btn-line-s:focus{ border:1px solid var(--pg-line2) !important; background:#fff; color:var(--pg-ink); padding:8px 14px; font-size:13.5px; }
.pg .pg-btn-line-s:hover{ border-color:var(--pg-tint-bd) !important; background:#fffaf8; color:var(--pg-ink); }
.pg .pg-btn-light, .pg .pg-btn-light:focus{ background:var(--pg-coral); color:#fff; }
.pg .pg-btn-light:hover{ background:#fff; color:var(--pg-ink); }
.pg .pg-btn-ghost{ background:none; color:var(--pg-muted); }
.pg .pg-btn-ghost:hover{ color:var(--pg-ink); }
.pg .pg-link, .pg .pg-link:focus{ color:var(--pg-coral-d); font-weight:600; font-size:14px; }
.pg .pg-link:hover{ color:var(--pg-coral-dd); }
.pg-arrow{ flex:none; width:38px; height:38px; border-radius:50%; background:var(--pg-ink); color:#fff; display:grid; place-items:center; font-size:16px; }
.pg .pg-round{ width:40px; height:40px; border-radius:50%; border:1px solid var(--pg-line2); background:#fff; color:var(--pg-ink); font-size:20px; line-height:1; display:grid; place-items:center; }
.pg .pg-round:hover{ border-color:var(--pg-ink); }
.pg .pg-round:focus{ border-color:var(--pg-line2) !important; }

/* Segments (onglets), pastilles, étiquettes */
.pg-seg{ display:flex; gap:4px; background:var(--pg-field); border-radius:999px; padding:4px; flex-wrap:wrap; }
.pg .pg-seg-i{ display:flex; align-items:center; justify-content:center; gap:8px; border-radius:999px; padding:9px 16px; color:var(--pg-muted);
	font-weight:600; font-size:14px; line-height:1.2; white-space:nowrap; }
.pg .pg-seg-i:hover{ color:var(--pg-ink); }
.pg .pg-seg-i.is-on{ background:#fff; color:var(--pg-ink); box-shadow:0 1px 3px rgba(60,30,20,.18); }
.pg-seg-i span{ font-size:12px; opacity:.65; }
.pg-seg-full{ flex-wrap:nowrap; }
.pg-seg-full .pg-seg-i{ flex:1; min-width:0; }
.pg-chips{ display:flex; flex-wrap:wrap; gap:6px; }
.pg .pg-chip{ display:inline-flex; align-items:center; gap:6px; height:38px; padding:0 14px; border-radius:999px; border:1px solid var(--pg-line2);
	background:#fff; color:var(--pg-ink); font-weight:600; font-size:13.5px; white-space:nowrap; }
.pg .pg-chip:hover{ border-color:var(--pg-ink); color:var(--pg-ink); }
.pg .pg-chip:focus{ border-color:var(--pg-line2) !important; }
.pg .pg-chip.is-on, .pg .pg-chip.is-on:focus{ background:var(--pg-ink); border-color:var(--pg-ink) !important; color:#fff; }
.pg-chip span{ font-size:12px; opacity:.65; }
.pg-tag{ display:inline-flex; align-items:center; gap:5px; align-self:flex-start; border-radius:999px; padding:4px 10px; background:var(--pg-field);
	color:var(--pg-text2); font-size:12px; font-weight:700; line-height:1.3; white-space:nowrap; }
.pg-tag-coral{ background:var(--pg-coral); color:#fff; }
.pg-tag-tint{ background:var(--pg-tint); color:var(--pg-coral-dd); }
.pg-tag-gold{ background:#feeec1; color:#724e00; }
.pg-pill{ display:inline-flex; align-items:center; gap:6px; background:#fff; border-radius:999px; padding:7px 13px; font-size:13.5px; font-weight:600; }
.pg-flag{ flex:none; width:20px; height:14px; border-radius:3px; object-fit:cover; display:block; box-shadow:0 0 0 1px rgba(0,0,0,.08); }
.pg-ic{ flex:none; width:40px; height:40px; border-radius:14px; background:var(--pg-tint); color:var(--pg-coral-d); display:grid; place-items:center; font-size:18px; }

/* Pastilles d'initiale (auteurs, membres) */
.pg-ini{ flex:none; width:30px; height:30px; border-radius:50%; background:var(--pg-tint); color:var(--pg-coral-d); display:grid; place-items:center;
	font-weight:700; font-size:13px; line-height:1; }
.pg-ini-s{ width:24px; height:24px; font-size:11px; }
.pg-ini-l{ width:36px; height:36px; font-size:15px; }
.pg-ini-w{ width:32px; height:32px; background:#fff; }
.pg-ini-xl{ width:52px; height:52px; background:#fff; font-weight:800; font-size:20px; }
.pg-sex-s{ width:22px; height:22px; font-size:12px; }
.pg-sex-ink{ background:var(--pg-ink); }

/* Cartes, encadrés */
.pg-card{ background:#fff; border:1px solid var(--pg-line); border-radius:28px; padding:clamp(20px,3vw,32px); display:flex; flex-direction:column; gap:16px; min-width:0; }
.pg-box{ background:#fff; border:1px solid var(--pg-line); border-radius:24px; padding:18px; }
.pg-box-h{ font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--pg-muted); margin-bottom:12px; }
.pg .pg-toc-a{ display:flex; gap:10px; padding:8px 10px; border-radius:12px; font-size:14px; line-height:1.35; color:var(--pg-ink); }
.pg .pg-toc-a:hover{ background:var(--pg-tint); color:var(--pg-ink); }
.pg-toc-n{ flex:none; color:var(--pg-coral-d); font-weight:700; font-variant-numeric:tabular-nums; }
.pg-dark-box{ background:var(--pg-ink); color:#fff; border-radius:24px; padding:20px; display:flex; flex-direction:column; align-items:flex-start; gap:12px; }
.pg .pg-dark-t{ font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:20px; line-height:1.2; }
.pg .pg-dark-d{ font-size:14px; line-height:1.5; color:#d9cdc6; }
.pg-dark-cta{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; background:var(--pg-ink); color:#fff;
	border-radius:22px; padding:16px 16px 16px 22px; }
.pg-dark-cta > span{ flex:1 1 200px; font-size:15px; line-height:1.4; }
.pg-alert{ border-radius:16px; padding:12px 16px; font-weight:600; font-size:14.5px; line-height:1.5; margin:0 0 16px; }
.pg-alert-err{ background:var(--pg-tint); color:var(--pg-coral-dd); }
.pg-alert-ok{ background:#e9f6ee; color:#1f6b41; }
.pg-alert-info{ background:#e1f1ff; color:#00457d; }
.pg .pg-saved{ font-size:13.5px; font-weight:600; color:#195c2e; }

/* Colonne principale + colonne latérale collante */
.pg-cols{ display:grid; grid-template-columns:minmax(0,1fr); gap:36px; align-items:start; }
.pg-cols-main{ min-width:0; }
.pg-aside{ display:flex; flex-direction:column; gap:16px; min-width:0; }
@media (min-width:1000px){
	.pg-cols{ grid-template-columns:minmax(0,1fr) 300px; }
	.pg-aside{ position:sticky; top:140px; }
}

/* Défilement horizontal (articles liés) */
.pg-track{ display:grid; grid-auto-flow:column; grid-auto-columns:min(78%,300px); gap:12px; overflow-x:auto; scroll-snap-type:x mandatory;
	scrollbar-width:none; padding-bottom:4px; }
.pg-track::-webkit-scrollbar{ display:none; }
.pg-scroll-btns{ display:flex; gap:6px; }

/* Formulaires */
.pg-form{ display:flex; flex-direction:column; gap:16px; margin:0; }
.pg-form-2{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr)); gap:14px; }
.pg-form-f{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.pg-field{ display:block; margin:0; }
.pg-label{ display:block; margin-bottom:6px; font-size:13px; font-weight:600; color:var(--pg-text2); }
.pg-label em{ font-weight:400; color:var(--pg-muted); }
.pg .pg-field input, .pg .pg-field select, .pg .pg-field textarea, .pg .ac-panel input, .pg .ac-panel select, .pg .ac-panel textarea, .pg .ln-note textarea, .pg .ln-note input{
	display:block; width:100%; max-width:none; height:50px; margin:0; padding:0 16px; border:1px solid var(--pg-line2); border-radius:14px;
	background:var(--pg-paper); color:var(--pg-ink); font:inherit; font-size:15px; line-height:1.4; outline:none; box-shadow:none; }
.pg .pg-field textarea, .pg .ac-panel textarea, .pg .ln-note textarea{ height:auto; min-height:120px; padding:12px 16px; resize:vertical; }
.pg .pg-field input:focus, .pg .pg-field select:focus, .pg .pg-field textarea:focus, .pg .ac-panel input:focus, .pg .ac-panel select:focus,
.pg .ac-panel textarea:focus, .pg .ln-note textarea:focus, .pg .ln-note input:focus{ border-color:var(--pg-tint-bd) !important; background:#fff; box-shadow:0 0 0 3px var(--pg-tint); }
.pg-pw{ position:relative; display:block; }
.pg .pg-pw input{ padding-right:96px; }
.pg .pg-pw-btn{ position:absolute; right:8px; top:8px; height:34px; padding:0 12px; border-radius:10px; background:#fff; color:var(--pg-text2); font-weight:600; font-size:12.5px; }
.pg .pg-pw-btn:hover{ color:var(--pg-ink); }
.pg .pg-hint{ display:block; margin-top:6px; font-size:12.5px; line-height:1.45; color:var(--pg-muted); }
.pg-check{ display:flex; gap:10px; align-items:flex-start; margin:0; font-size:14px; line-height:1.5; font-weight:400; color:var(--pg-text2); cursor:pointer; }
.pg .pg-check input{ flex:none; width:18px; height:18px; margin:2px 0 0; accent-color:var(--pg-coral-d); }
.pg .pg-legal{ font-size:13px; line-height:1.5; color:var(--pg-muted); }
.pg .g-recaptcha{ min-height:78px; }
.pg-sort{ display:flex; gap:8px; align-items:center; margin:0; font-size:13.5px; font-weight:400; color:var(--pg-muted); }
.pg .pg-sort select{ height:38px; margin:0; padding:0 12px; border:1px solid var(--pg-line2); border-radius:999px; background:#fff; color:var(--pg-ink); font:inherit; font-size:14px; }

/* "Voir plus" : éléments masqués au-delà de data-show (theme/js/pages.js) */
.pg-more-list > [hidden]{ display:none !important; }

/* ==========================================================================
   Accueil — templates/index.tpl
   ========================================================================== */
.hm{ display:flex; flex-direction:column; gap:64px; padding-top:24px; }
.hm-hero{ display:grid; grid-template-columns:minmax(0,1fr); gap:14px; }
.hm-hero-main{ position:relative; border-radius:32px; overflow:hidden; min-height:clamp(360px,42vw,480px); background:#f7ece8; display:flex; align-items:flex-end; }
.hm-photo{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:right center; }
.pg .hm-photo{ max-width:none; height:100%; }
.hm-hero-card{ position:relative; margin:clamp(16px,3vw,28px); background:#fff; border-radius:24px; padding:clamp(20px,3vw,32px); max-width:440px; }
.pg .hm-hero-t{ margin-top:10px !important; font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:clamp(40px,5.5vw,64px); letter-spacing:-.045em; line-height:.95; }
.pg .hm-hero-d{ margin:10px 0 20px !important; font-size:17px; color:var(--pg-text2); }
.hm-hero-side{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.pg .hm-tile{ position:relative; border-radius:28px; overflow:hidden; min-height:200px; background:#f7ece8; display:flex; align-items:flex-end; color:var(--pg-ink); transition:box-shadow .15s; }
.pg .hm-tile:hover{ box-shadow:0 18px 34px -20px rgba(80,40,30,.45); color:var(--pg-ink); }
.hm-tile-card{ position:relative; margin:14px; background:#fff; border-radius:18px; padding:14px 18px; display:flex; align-items:center; gap:18px; }
.hm-tile-t{ display:block; font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:22px; letter-spacing:-.02em; line-height:1.15; }
.hm-tile-d{ display:block; font-size:14px; color:var(--pg-muted); margin-top:2px; }
@media (min-width:1000px){
	.hm-hero{ grid-template-columns:minmax(0,2fr) minmax(0,1fr); }
	.hm-hero-side{ grid-template-columns:minmax(0,1fr); grid-template-rows:1fr 1fr; }
}
@media (max-width:559px){ .hm-hero-side{ grid-template-columns:minmax(0,1fr); } }

.hm-quick{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.pg .hm-q{ display:block; background:#fff; border:1px solid var(--pg-line); border-radius:24px; padding:8px 8px 18px; color:var(--pg-ink); transition:box-shadow .15s; }
.pg .hm-q:hover{ box-shadow:var(--pg-shadow); color:var(--pg-ink); }
.pg .hm-q img{ display:block; width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:18px; background:var(--pg-field); }
.hm-q-n{ display:block; margin:14px 10px 0; font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:28px; letter-spacing:-.03em; line-height:1.1; }
.hm-q-f{ color:var(--pg-f); } .hm-q-m{ color:var(--pg-m); } .hm-q-coral{ color:var(--pg-coral-d); } .hm-q-ink{ color:var(--pg-ink); }
.hm-q-l{ display:block; margin:2px 10px 0; font-weight:600; font-size:15px; line-height:1.35; }
@media (min-width:700px){ .hm-quick{ grid-template-columns:repeat(4,minmax(0,1fr)); } }

.hm-find{ background:var(--pg-ink); color:#fff; border-radius:32px; padding:clamp(24px,4vw,48px); display:flex; flex-direction:column; gap:22px; }
.pg .hm-find .pg-h2{ color:#fff; }
.pg .hm-find-d{ margin-top:10px !important; color:#d9cdc6; font-size:16px; line-height:1.5; max-width:620px; }
.hm-find-f{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr)); gap:10px; margin:0; }
.pg .hm-find-f select{ height:48px; min-width:0; width:100%; margin:0; padding:0 14px; border:0; border-radius:14px; background:#fff; color:var(--pg-ink); font:inherit; font-size:15px; }
.pg .hm-find-f select:focus{ border:0 !important; box-shadow:0 0 0 3px rgba(232,96,79,.45); }
.pg .hm-find-f button{ height:48px; border-radius:14px; background:var(--pg-coral); color:#fff; font-weight:700; font-size:15px; }
.pg .hm-find-f button:hover{ background:#fff; color:var(--pg-ink); }

/* « Choisir à deux » (includes/fcts_duo.php) : bandeau de présentation, illustration des deux cartes et du match */
.hm-duo{ display:grid; grid-template-columns:minmax(0,1fr); gap:28px 40px; align-items:center; background:var(--pg-tint); border-radius:32px;
	padding:clamp(24px,4vw,48px); overflow:hidden; }
@media (min-width:880px){ .hm-duo{ grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); } }
.hm-duo-t{ display:flex; flex-direction:column; align-items:flex-start; min-width:0; }
.hm-duo-k{ display:inline-flex; align-items:center; gap:7px; background:#fff; color:var(--pg-coral-d); border-radius:999px; padding:5px 12px;
	font-size:12.5px; font-weight:700; line-height:1.3; }
.hm-duo-k::before{ content:''; flex:none; width:7px; height:7px; border-radius:50%; background:var(--pg-coral); }
.pg .hm-duo .pg-h2{ margin-top:14px; }
.pg .hm-duo-d{ margin-top:10px; font-size:16.5px; line-height:1.55; color:var(--pg-text2); max-width:560px; text-wrap:pretty; }
.pg .hm-duo-steps{ display:flex; flex-wrap:wrap; gap:8px; margin-top:20px; }
.hm-duo-steps li{ display:inline-flex; align-items:center; gap:8px; background:#fff; border-radius:999px; padding:6px 14px 6px 6px; font-size:14px; font-weight:600; line-height:1.3; }
.hm-duo-steps b{ flex:none; width:24px; height:24px; border-radius:50%; background:var(--pg-coral); color:#fff; display:grid; place-items:center; font-size:12.5px; }
.pg .hm-duo-go{ margin-top:24px; }
.hm-duo-art{ position:relative; justify-self:center; width:100%; max-width:380px; height:270px; }
.hm-duo-c{ position:absolute; top:6px; width:58%; height:212px; display:flex; flex-direction:column; justify-content:space-between; gap:10px;
	background:#fff; border-radius:26px; padding:16px; box-shadow:0 18px 34px -18px rgba(80,40,30,.45); }
.hm-duo-c.is-l{ left:0; transform:rotate(-8deg); }
.hm-duo-c.is-r{ right:0; top:0; transform:rotate(7deg); }
.hm-duo-av{ width:32px; height:32px; border-radius:50%; display:grid; place-items:center; background:var(--pg-tint); color:var(--pg-coral-d);
	font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:15px; line-height:1; }
.is-r .hm-duo-av{ background:#e1f1ff; color:var(--pg-m); }
.hm-duo-n{ font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:42px; letter-spacing:-.04em; line-height:1; color:var(--pg-ink); }
.hm-duo-y{ align-self:flex-end; width:42px; height:42px; border-radius:50%; background:var(--pg-coral); color:#fff; display:grid; place-items:center; font-size:18px; line-height:1; }
.hm-duo-m{ position:absolute; left:50%; bottom:4px; transform:translateX(-50%) rotate(-2deg); background:var(--pg-ink); color:#fff; border-radius:999px;
	padding:11px 20px; font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:19px; letter-spacing:-.01em; line-height:1.2; white-space:nowrap;
	box-shadow:0 14px 26px -14px rgba(0,0,0,.6); }
@media (max-width:420px){ .hm-duo-art{ height:240px; } .hm-duo-c{ height:184px; } .hm-duo-n{ font-size:34px; } }

.hm-tiles{ display:grid; grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); gap:12px; }
.hm-tiles > li{ display:flex; min-width:0; }
.hm-ideas{ grid-template-columns:repeat(2,minmax(0,1fr)); }
@media (min-width:700px){ .hm-ideas{ grid-template-columns:repeat(6,minmax(0,1fr)); } }
.pg .ct{ flex:1; display:block; min-width:0; background:#fff; border:1px solid var(--pg-line); border-radius:20px; padding:6px 6px 12px; color:var(--pg-ink); transition:box-shadow .15s; }
.pg .ct:hover{ box-shadow:var(--pg-shadow); color:var(--pg-ink); }
.pg .ct img{ display:block; width:100%; aspect-ratio:1/1; object-fit:cover; border-radius:15px; background:var(--pg-field); }
.ct-t{ display:block; margin:10px 8px 0; font-weight:700; font-size:14.5px; line-height:1.3; }

.hm-about{ background:#fff; border:1px solid var(--pg-line); border-radius:32px; padding:clamp(24px,4vw,48px); display:grid; grid-template-columns:minmax(0,1fr); gap:24px 32px; }
.hm-about .pg-h2{ margin-top:10px !important; }
.pg .hm-about-t{ max-width:720px; font-size:16px; line-height:1.7; color:#4a403b; }
.hm-about-t strong, .hm-about-t b{ color:var(--pg-ink); }
.pg .hm-about-t a{ text-decoration-color:#f0b3a8; }
@media (min-width:1000px){ .hm-about{ grid-template-columns:minmax(0,1fr) minmax(0,2fr); } }

/* Derniers commentaires : une carte par fiche (prénom, extrait, auteur) */
.hm-coms{ display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr)); gap:16px; }
.hm-coms > li{ display:flex; min-width:0; }
.pg .hm-com{ flex:1; display:flex; flex-direction:column; gap:14px; min-width:0; background:#fff; border:1px solid var(--pg-line); border-radius:24px; padding:20px 20px 18px;
	color:var(--pg-ink); transition:transform .15s, box-shadow .15s; }
.pg .hm-com:hover{ transform:translateY(-3px); box-shadow:var(--pg-shadow); color:var(--pg-ink); }
.hm-com-h{ display:flex; align-items:center; gap:10px; }
.hm-com-n{ flex:1; min-width:0; font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:24px; letter-spacing:-.02em; line-height:1.1; overflow-wrap:break-word; }
.hm-com-h .pg-sex{ width:28px; height:28px; font-size:14px; }
.hm-com-h .pg-arrow{ width:32px; height:32px; font-size:14px; }
.hm-com-t{ flex:1; font-size:15px; line-height:1.55; color:var(--pg-text2); overflow-wrap:break-word; text-wrap:pretty;
	display:-webkit-box; -webkit-line-clamp:5; -webkit-box-orient:vertical; overflow:hidden; }
.hm-com-a{ display:flex; align-items:center; gap:10px; padding-top:14px; border-top:1px solid var(--pg-line); font-size:13.5px; line-height:1.35; min-width:0; }
.hm-com-a .pf-ini{ width:32px; height:32px; font-size:14px; }
.hm-com-a > span:last-child{ min-width:0; overflow-wrap:break-word; }
.hm-com-a > span:last-child > span{ color:var(--pg-muted); }

/* Bandeau d'inscription (visiteurs), sous le hero : collé au hero malgré l'écart entre sections de .hm */
.hm-join{ display:flex; flex-wrap:wrap; align-items:center; gap:14px 18px; background:var(--pg-tint); border:1px solid var(--pg-tint-bd); border-radius:24px; padding:14px 16px 14px 14px; }
.hm-hero + .hm-join{ margin-top:-50px; }
.hm-join-ic{ flex:none; width:46px; height:46px; border-radius:50%; background:var(--pg-coral); color:#fff; display:grid; place-items:center; font-size:19px; line-height:1; }
.hm-join-txt{ flex:1 1 320px; min-width:0; }
.pg .hm-join-t{ font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:19px; letter-spacing:-.02em; line-height:1.25; }
.hm-join-n{ display:inline-block; vertical-align:2px; margin-left:4px; background:#fff; color:var(--pg-coral-d); border-radius:999px; padding:2px 10px;
	font-family:'DM Sans',sans-serif; font-size:12px; font-weight:700; letter-spacing:0; white-space:nowrap; }
.pg .hm-join-d{ margin-top:2px; font-size:14.5px; line-height:1.45; color:var(--pg-text2); text-wrap:pretty; }
.hm-join-go{ display:flex; flex-wrap:wrap; align-items:center; gap:8px 16px; }
.pg .hm-join-in{ font-size:13.5px; color:var(--pg-text2); }
.pg .hm-join-in:hover{ color:var(--pg-coral-d); }
.hm-join-in u{ font-weight:600; text-decoration-color:var(--pg-tint-bd); text-underline-offset:3px; }
@media (max-width:819px){ .hm-hero + .hm-join{ margin-top:-36px; } }
@media (max-width:699px){
	.hm-join{ padding:14px; }
	.hm-join-ic{ width:40px; height:40px; font-size:17px; }
	.hm-join-txt{ flex-basis:calc(100% - 58px); }
	.hm-join-go{ width:100%; justify-content:center; }
	.hm-join-go .pg-btn{ flex:1 1 100%; }
}

/* Jeux et outils : jeux illustrés (getGameIllustration(), comme le méga-menu) + liste des outils (getTools()) */
.hm-play{ display:grid; grid-template-columns:minmax(0,1fr); gap:16px; }
@media (min-width:1000px){ .hm-play.has-games{ grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); } }
.hm-play-p{ display:flex; flex-direction:column; min-width:0; background:#fff; border:1px solid var(--pg-line); border-radius:28px; padding:20px; }
.hm-play-h{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; }
.hm-play-k{ display:inline-flex; align-items:center; gap:9px; font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:20px; letter-spacing:-.02em; line-height:1.2; }
.hm-play-k::before{ content:''; flex:none; width:8px; height:8px; border-radius:50%; background:var(--pg-coral); }
.hm-games{ flex:1; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); grid-auto-rows:1fr; gap:12px; }
.hm-games > li, .hm-tools > li{ display:flex; min-width:0; }
.pg .hm-game{ flex:1; display:flex; flex-direction:column; gap:4px; min-width:0; border:1px solid var(--pg-line); border-radius:20px; padding:8px 8px 14px; color:var(--pg-ink);
	transition:border-color .15s, box-shadow .15s; }
.pg .hm-game:hover{ border-color:var(--pg-tint-bd); box-shadow:var(--pg-shadow); color:var(--pg-ink); }
.hm-game-ill{ height:92px; margin-bottom:8px; border-radius:14px; background:var(--pg-tint); display:grid; place-items:center; transition:background .15s; }
.hm-game:hover .hm-game-ill{ background:#fbe1da; }
.hm-game-ill svg{ display:block; width:auto; height:48px; overflow:visible; }
.hm-game-ill .gm-ill-line{ fill:none; stroke:var(--pg-coral-d); stroke-width:4; stroke-linecap:round; stroke-linejoin:round; }
.hm-game-ill .gm-ill-fill{ fill:rgba(232,96,79,.18); }
.hm-game-ill .gm-ill-ink{ fill:var(--pg-ink); }
.hm-game-ill .gm-ill-coral{ fill:var(--pg-coral); }
.hm-game-ill .gm-ill-dot{ fill:#fff; stroke:var(--pg-coral-d); stroke-width:3; }
.hm-game-ill .gm-ill-text{ font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:18px; fill:var(--pg-ink); text-anchor:middle; }
.hm-game-t{ margin:0 6px; font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:17px; letter-spacing:-.015em; line-height:1.2; overflow-wrap:break-word; }
.hm-game-d{ margin:0 6px; font-size:13.5px; line-height:1.4; color:var(--pg-muted); text-wrap:pretty; }
.hm-tools{ display:grid; grid-template-columns:minmax(0,1fr); gap:2px; }
.hm-play:not(.has-games) .hm-tools{ grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr)); gap:6px 12px; }
.pg .hm-tool{ flex:1; display:flex; align-items:center; gap:14px; min-width:0; border-radius:16px; padding:8px 12px 8px 8px; color:var(--pg-ink); transition:background .15s; }
.pg .hm-tool:hover{ background:var(--pg-paper); color:var(--pg-ink); }
.hm-tool-ic{ flex:none; width:42px; height:42px; border-radius:14px; background:var(--pg-tint); color:var(--pg-coral-d); display:grid; place-items:center;
	font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:17px; line-height:1; }
.hm-tool-txt{ flex:1; min-width:0; }
.hm-tool-t{ display:block; font-weight:700; font-size:15px; line-height:1.3; }
.hm-tool-d{ display:block; margin-top:1px; font-size:13px; line-height:1.35; color:var(--pg-muted); }
.hm-tool-go{ flex:none; color:var(--pg-muted); transition:transform .15s, color .15s; }
.hm-tool:hover .hm-tool-go{ color:var(--pg-coral-d); transform:translateX(3px); }
@media (max-width:559px){
	.hm-play-p{ padding:14px; border-radius:24px; }
	.hm-games{ gap:8px; }
	.hm-game-ill{ height:76px; }
	.hm-game-ill svg{ height:40px; }
	.hm-game-t{ font-size:15.5px; }
	.hm-game-d{ font-size:13px; }
}

/* Cartes articles (displayPostCard) */
.ac-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,280px),1fr)); gap:16px; }
/* Accueil : 4 articles, en une rangée ou 2 x 2 (jamais 3 + 1) */
@media (min-width:560px){ .ac-grid.hm-posts{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (min-width:1100px){ .ac-grid.hm-posts{ grid-template-columns:repeat(4,minmax(0,1fr)); } }
.pg .ac{ display:flex; flex-direction:column; min-width:0; background:#fff; border:1px solid var(--pg-line); border-radius:24px; padding:8px 8px 20px; color:var(--pg-ink);
	transition:transform .15s, box-shadow .15s; }
.pg .ac:hover{ box-shadow:var(--pg-shadow); color:var(--pg-ink); }
.pg .ac-list:hover{ transform:translateY(-3px); }
.pg .ac-img{ display:block; width:100%; aspect-ratio:16/10; height:auto; object-fit:cover; border-radius:18px; background:var(--pg-field); }
.ac-body{ margin:14px 12px 0; display:flex; flex-direction:column; gap:8px; flex:1; min-width:0; }
.ac-date{ font-size:12.5px; color:var(--pg-muted); }
.ac-t{ font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:20px; line-height:1.2; letter-spacing:-.015em; text-wrap:balance; overflow-wrap:break-word; }
.ac-x{ font-size:14.5px; line-height:1.5; color:var(--pg-text2); }
.ac-more{ margin-top:4px; font-size:13.5px; font-weight:700; color:var(--pg-coral-d); }
.ac-tag{ align-self:flex-start; background:var(--pg-field); color:var(--pg-text2); border-radius:999px; padding:3px 9px; font-size:11.5px; font-weight:700; }
.ac-list .ac-body{ margin:14px 10px 0; }
.ac-list .ac-t{ font-size:19px; }
.ac-list .ac-x{ font-size:14px; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.ac-meta{ display:flex; align-items:center; gap:8px; margin-top:auto; padding-top:8px; font-size:12.5px; color:var(--pg-muted); }
.pg .ac-rel{ scroll-snap-align:start; border-radius:22px; padding:6px 6px 14px; }
.pg .ac-rel .ac-img{ border-radius:16px; }
.ac-rel .ac-body{ margin:12px 8px 0; gap:6px; }
.ac-rel .ac-t{ font-family:'DM Sans',sans-serif; font-size:15px; line-height:1.3; letter-spacing:0; }
.ac-rel .ac-date{ font-size:13px; }

/* ==========================================================================
   Tops prénoms — templates/top.tpl
   ========================================================================== */
.pg .pg-seg a.pg-seg-i:hover{ color:var(--pg-ink); }
.tp-globe{ flex:none; display:block; color:var(--pg-coral-d); }
.tp-nav{ background:#fff; border:1px solid var(--pg-line); border-radius:24px; padding:14px 16px; display:flex; flex-direction:column; gap:12px; margin-bottom:20px; }
.tp-nav-r{ display:flex; gap:10px; align-items:center; min-width:0; }
.tp-nav-y{ align-items:flex-start; border-top:1px solid var(--pg-line3); padding-top:12px; }
.tp-nav-y .tp-nav-h{ padding-top:11px; }
.tp-nav-h{ flex:none; width:74px; font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--pg-muted); }
.tp-decs{ display:flex; gap:4px; flex-wrap:wrap; min-width:0; }
.pg .tp-dec{ flex:none; height:34px; padding:0 12px; border-radius:999px; border:1px solid var(--pg-line2); background:#fff; color:var(--pg-ink); font-weight:600; font-size:13px; }
.pg .tp-dec:hover{ border-color:var(--pg-ink); }
.pg .tp-dec:focus{ border-color:var(--pg-line2) !important; }
.pg .tp-dec.is-on, .pg .tp-dec.is-on:focus{ background:var(--pg-ink); border-color:var(--pg-ink) !important; color:#fff; }
.tp-years{ display:flex; gap:4px; flex-wrap:wrap; }
.pg .tp-y{ display:inline-flex; align-items:center; height:38px; padding:0 14px; border-radius:12px; border:1px solid var(--pg-line2); background:#fff; color:var(--pg-ink);
	font-weight:700; font-size:14px; font-variant-numeric:tabular-nums; }
.pg .tp-y:hover{ border-color:var(--pg-ink); color:var(--pg-ink); }
.pg .tp-y.is-on{ background:var(--pg-ink); border-color:var(--pg-ink); color:#fff; }
.tp-stats{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr)); gap:12px; margin-bottom:20px; }
.tp-stat{ background:var(--pg-tint); border-radius:22px; padding:18px 22px; }
.tp-stat-k{ display:block; font-size:13px; font-weight:600; color:var(--pg-coral-dd); }
.tp-stat-v{ display:block; margin-top:4px; font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:clamp(28px,3.4vw,38px); letter-spacing:-.03em; line-height:1.1; }
/* Courbe des naissances par année, repère sur l'année affichée (includes/fcts_top_births.php, survol : pages.js) */
.tp-stats-evo .tp-stat{ display:flex; flex-direction:column; justify-content:center; }
.tp-evo{ grid-column:1 / -1; margin:0; background:#fff; border:1px solid var(--pg-line); border-radius:22px; padding:16px 20px 12px; min-width:0; }
@media (min-width:820px){
	.tp-stats-evo{ grid-template-columns:minmax(220px,290px) minmax(0,1fr); }
	.tp-stats-evo .tp-stat{ grid-column:1; }
	.tp-stats-evo .tp-evo{ grid-column:2; grid-row:1 / span 2; }
}
.tp-evo-h{ display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:4px 16px; }
.tp-evo-t{ font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--pg-muted); }
.tp-evo-leg{ display:flex; flex-wrap:wrap; gap:2px 12px; font-size:12.5px; color:var(--pg-text2); }
.tp-evo-leg > span{ display:inline-flex; align-items:center; gap:6px; }
.tp-evo-leg i, .tp-evo-tip i{ flex:none; width:10px; height:10px; border-radius:3px; background:var(--c); }
.tp-evo-chart{ position:relative; height:196px; margin-top:4px; }
.tp-evo-plot{ position:absolute; left:44px; right:4px; top:14px; bottom:26px; cursor:pointer; touch-action:pan-y; -webkit-tap-highlight-color:transparent; }
.tp-evo-plot svg{ position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.tp-evo-grid{ position:absolute; left:0; right:0; border-top:1px solid var(--pg-line3); pointer-events:none; }
.tp-evo-grid span{ position:absolute; right:100%; top:-8px; padding-right:8px; font-size:11px; line-height:14px; color:var(--pg-muted); white-space:nowrap; font-variant-numeric:tabular-nums; }
.tp-evo-grid-0{ border-top-color:var(--pg-line2); }
.tp-evo-area{ fill:var(--pg-coral); fill-opacity:.13; }
.tp-evo-line{ fill:none; stroke:var(--pg-coral); stroke-width:2px; vector-effect:non-scaling-stroke; stroke-linejoin:round; stroke-linecap:round; }
.tp-evo-stack .tp-evo-area{ fill:var(--c); fill-opacity:.28; }
.tp-evo-stack .tp-evo-line{ stroke:var(--c); stroke-width:1.5px; }
.tp-evo-mark{ position:absolute; top:0; bottom:0; width:0; margin-left:-1px; border-left:2px solid var(--pg-ink); pointer-events:none; }
.tp-evo-dot, .tp-evo-hdot{ position:absolute; width:12px; height:12px; border-radius:50%; background:var(--pg-ink); box-shadow:0 0 0 2px #fff; transform:translate(-50%,-50%); pointer-events:none; }
.tp-evo-ticks{ position:absolute; left:44px; right:4px; bottom:0; height:20px; }
.tp-evo-ticks span{ position:absolute; top:3px; transform:translateX(-50%); font-size:11px; line-height:14px; color:var(--pg-muted); font-variant-numeric:tabular-nums; white-space:nowrap; }
.tp-evo-ticks .tp-evo-yr{ top:0; padding:3px 8px; border-radius:999px; background:var(--pg-ink); color:#fff; font-weight:700; font-size:11.5px; box-shadow:0 0 0 3px #fff; z-index:1; }
.tp-evo-ticks .tp-evo-yr-r{ transform:translateX(-85%); }
.tp-evo-ticks .tp-evo-yr-l{ transform:translateX(-15%); }
.tp-evo-hline{ position:absolute; top:0; bottom:0; width:0; border-left:1px solid var(--pg-muted); opacity:.5; pointer-events:none; }
.tp-evo-hdot{ background:#fff; border:2.5px solid var(--pg-ink); }
.tp-evo-tip{ position:absolute; top:-6px; background:var(--pg-ink); color:#fff; font-size:12px; line-height:1.45; padding:6px 10px; border-radius:10px; white-space:nowrap;
	pointer-events:none; z-index:2; box-shadow:0 8px 20px -10px rgba(40,20,10,.5); font-variant-numeric:tabular-nums; }
.tp-evo-tip span{ display:flex; align-items:center; gap:6px; }
.tp-evo-tip em{ font-style:normal; }
.tp-evo-tip span b{ margin-left:auto; padding-left:10px; font-weight:600; }
.tp-evo-tip small{ display:block; margin-top:3px; font-size:11px; color:var(--pg-tint-bd); }
.tp-evo-hline, .tp-evo-hdot, .tp-evo-tip{ display:none; }
.tp-evo-plot.is-hover .tp-evo-hline, .tp-evo-plot.is-hover .tp-evo-hdot, .tp-evo-plot.is-hover .tp-evo-tip{ display:block; }
.tp-evo-data{ margin-top:6px; }
.pg .tp-evo-data summary{ width:fit-content; cursor:pointer; font-size:12.5px; font-weight:600; color:var(--pg-muted); }
.pg .tp-evo-data summary:hover{ color:var(--pg-ink); }
.tp-evo-tbl{ max-height:260px; overflow:auto; margin-top:8px; border-top:1px solid var(--pg-line3); }
.tp-evo-tbl table{ width:100%; border-collapse:collapse; font-size:13px; font-variant-numeric:tabular-nums; }
.tp-evo-tbl th, .tp-evo-tbl td{ padding:5px 8px; text-align:right; border-bottom:1px solid var(--pg-line3); white-space:nowrap; }
.tp-evo-tbl th:first-child{ text-align:left; }
.tp-evo-tbl thead th{ position:sticky; top:0; background:#fff; font-size:11.5px; font-weight:700; color:var(--pg-muted); }
.tp-evo-tbl tr.is-on{ background:var(--pg-tint); font-weight:700; }
@media (max-width:819px){
	.tp-evo{ padding:14px 14px 10px; border-radius:20px; }
	.tp-evo-chart{ height:176px; }
}
.tp-tabs{ margin-bottom:12px; }
.tp-sym-f{ color:var(--pg-f); } .tp-sym-m{ color:var(--pg-m); }
.tp-list{ background:#fff; border:1px solid var(--pg-line); border-radius:26px; padding:18px 14px 10px; min-width:0; }
.tp-list + .tp-list{ margin-top:14px; }
.tp-box.is-tabbed .tp-list:not(.is-on){ display:none; }
.tp-box.is-tabbed .tp-list + .tp-list{ margin-top:0; }
.pg .tp-list-h{ display:flex; align-items:center; gap:10px; margin:0 6px 10px; font-size:clamp(22px,2.6vw,28px); letter-spacing:-.03em; }
.tp-list-h .pg-sex{ width:30px; height:30px; font-size:14px; }
.tp-rows{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); grid-template-rows:repeat(var(--r3),auto); grid-auto-flow:column; column-gap:32px; }
.tp-rows > li{ min-width:0; }
.pg .tp-row{ display:grid; grid-template-columns:30px minmax(0,1fr) auto 64px; align-items:center; gap:10px; border-top:1px solid #f4ede9; padding:10px 6px; color:var(--pg-ink); }
.pg .tp-row:hover{ background:var(--pg-paper); color:var(--pg-ink); }
.pg .tp-row:hover .tp-name{ color:var(--pg-coral-d); }
.tp-rank{ width:26px; height:26px; border-radius:50%; display:grid; place-items:center; background:var(--pg-field); color:var(--pg-muted); font-weight:700; font-size:12.5px; font-variant-numeric:tabular-nums; }
.tp-medal{ position:relative; width:28px; height:28px; border-radius:50%; display:grid; place-items:center; }
.tp-medal svg{ width:17px; height:17px; display:block; fill:currentColor; }
.tp-medal span{ position:absolute; right:-3px; bottom:-3px; min-width:14px; height:14px; border-radius:999px; background:var(--pg-ink); color:#fff; font-size:9px; font-weight:700;
	display:grid; place-items:center; padding:0 3px; }
.tp-medal-gold{ background:#feeec1; color:#aa7e00; }
.tp-medal-silver{ background:#e9ebee; color:#7c8186; }
.tp-medal-bronze{ background:#fde2ce; color:#9e6033; }
.tp-name{ font-weight:700; font-size:15.5px; overflow-wrap:anywhere; }
.tp-births{ font-size:13px; color:var(--pg-muted); font-variant-numeric:tabular-nums; white-space:nowrap; }
.tp-trend{ justify-self:end; font-size:11.5px; font-weight:700; border-radius:999px; padding:3px 7px; white-space:nowrap; }
.tp-trend-up{ background:#d5f5da; color:#195c2e; }
.tp-trend-down{ background:var(--pg-tint); color:var(--pg-coral-dd); }
.tp-trend-eq{ background:var(--pg-field); color:var(--pg-muted); }
.tp-trend-none{ color:#9a8a82; }
.tp-trend-sex{ font-size:14px; padding:0 4px; }
.tp-trend-f{ color:var(--pg-f); } .tp-trend-m{ color:var(--pg-m); } .tp-trend-x{ color:var(--pg-x); }
.pg .tp-source{ margin:24px auto 0 !important; max-width:640px; text-align:center; font-size:13px; line-height:1.5; color:var(--pg-muted); }
@media (max-width:1099px){ .tp-rows{ grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:repeat(var(--r2),auto); } }
@media (max-width:699px){ .tp-rows{ grid-template-columns:minmax(0,1fr); grid-template-rows:none; grid-auto-flow:row; } }

/* ==========================================================================
   Articles — templates/blog.tpl
   ========================================================================== */
.pg .bl-feat{ display:grid; grid-template-columns:minmax(0,1fr); background:#fff; border:1px solid var(--pg-line); border-radius:32px; overflow:hidden; margin-bottom:32px;
	color:var(--pg-ink); transition:box-shadow .15s; }
.pg .bl-feat:hover{ box-shadow:0 20px 40px -24px rgba(80,40,30,.4); color:var(--pg-ink); }
.pg .bl-feat img{ display:block; width:100%; height:100%; min-height:260px; max-height:420px; object-fit:cover; background:var(--pg-field); }
.bl-feat-b{ padding:clamp(22px,3.5vw,40px); display:flex; flex-direction:column; gap:14px; justify-content:center; min-width:0; }
.bl-tags{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.bl-feat-t{ font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:clamp(26px,3.4vw,40px); letter-spacing:-.035em; line-height:1.05; text-wrap:balance; }
.bl-feat-x{ font-size:16px; line-height:1.6; color:var(--pg-text2); text-wrap:pretty; }
.bl-meta{ display:flex; align-items:center; gap:10px; font-size:13.5px; color:var(--pg-muted); }
.bl-meta strong{ color:var(--pg-ink); }
@media (min-width:860px){ .pg .bl-feat{ grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); } .pg .bl-feat img{ max-height:none; min-height:300px; } }
.bl-pop{ display:flex; flex-direction:column; gap:12px; }
.pg .bl-pop a{ display:grid; grid-template-columns:28px 64px minmax(0,1fr); gap:12px; align-items:center; color:var(--pg-ink); }
.pg .bl-pop a:hover{ color:var(--pg-coral-d); }
.bl-pop-n{ font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:22px; color:var(--pg-coral); }
.pg .bl-pop img{ display:block; width:64px; height:64px; object-fit:cover; border-radius:12px; background:var(--pg-field); }
.bl-pop-t{ font-weight:700; font-size:14px; line-height:1.3; }
.pg-pages-coral .pg-pnum.is-current{ background:var(--pg-coral); border-color:var(--pg-coral); }

.bl-art-head{ margin:18px 0 24px; display:flex; flex-direction:column; gap:14px; }
.pg .bl-art-h1{ font-size:clamp(32px,5vw,56px); letter-spacing:-.04em; }
.bl-art-meta{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.bl-share{ display:flex; gap:6px; align-items:center; }
.bl-share > span{ font-size:13px; color:var(--pg-muted); margin-right:4px; }
.pg .bl-share a{ width:38px; height:38px; border-radius:50%; border:1px solid var(--pg-line2); background:#fff; display:grid; place-items:center; color:var(--pg-ink); font-weight:700; font-size:13px; }
.pg .bl-share a:hover{ border-color:var(--pg-ink); background:var(--pg-ink); color:#fff; }
.pg .bl-hero{ display:block; width:100%; height:auto; aspect-ratio:21/9; object-fit:cover; border-radius:32px; margin-bottom:36px; background:var(--pg-field); }
.bl-art-main{ max-width:720px; display:flex; flex-direction:column; gap:18px; }
.pg .bl-prose{ font-size:17px; line-height:1.75; color:#3d3430; overflow-wrap:break-word; }
.pg .bl-prose > p:first-child{ font-size:19px; color:var(--pg-ink); }
.pg .bl-prose h2{ font-size:clamp(24px,3vw,30px); letter-spacing:-.03em; line-height:1.15; margin:1.3em 0 .5em; scroll-margin-top:150px; }
.pg .bl-prose h3{ font-size:21px; scroll-margin-top:150px; }
.pg .bl-prose img{ border-radius:18px; height:auto; }
.pg .bl-prose ol{ list-style:none; padding:0; counter-reset:bl; display:flex; flex-direction:column; gap:8px; }
.pg .bl-prose ol > li{ counter-increment:bl; position:relative; display:block; min-height:66px; margin:0; background:#fff; border:1px solid var(--pg-line);
	border-radius:18px; padding:14px 16px 14px 70px; font-size:15.5px; line-height:1.6; }
.pg .bl-prose ol > li::before{ content:counter(bl); position:absolute; left:16px; top:14px; width:36px; height:36px; border-radius:12px; background:var(--pg-tint); color:var(--pg-coral-d); display:grid; place-items:center;
	font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:17px; }
.pg .bl-prose table{ width:100%; border-collapse:collapse; font-size:15px; }
.pg .bl-prose td, .pg .bl-prose th{ border-bottom:1px solid var(--pg-line3); padding:8px 10px; text-align:left; }
.bl-author{ margin-top:20px; display:flex; align-items:center; gap:14px; background:var(--pg-tint); border-radius:22px; padding:18px 20px; }
.bl-author-k{ display:block; font-size:12.5px; font-weight:700; color:var(--pg-coral-dd); }
.bl-author-n{ display:block; font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:19px; }
.bl-author-d{ display:block; font-size:13.5px; color:var(--pg-text2); }
.bl-rel, .bl-coms{ margin-top:28px; min-width:0; }
.bl-rel-h{ display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:14px; }
.bl-coms > .pg-h3{ margin-bottom:14px; }
.bl-coms .pf-coms{ margin-bottom:14px; }
.pg .bl-coms-none{ font-size:14.5px; color:var(--pg-muted); }

/* ==========================================================================
   Compte (connexion, tableau de bord, paramètres) — templates/account*.tpl
   ========================================================================== */
.pg .ac-h1{ margin:14px 0 8px; }
.pg .ac-intro{ margin:0 0 24px !important; font-size:16px; color:var(--pg-text2); }
.pg .ac-intro strong{ color:var(--pg-ink); }
.ac-tiles{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr)); gap:14px; }
.pg .ac-tile{ display:flex; flex-direction:column; background:#fff; border:1px solid var(--pg-line); border-radius:28px; padding:8px; color:var(--pg-ink); transition:box-shadow .15s; }
.pg .ac-tile:hover{ box-shadow:0 18px 34px -20px rgba(80,40,30,.45); color:var(--pg-ink); }
.pg .ac-tile img{ display:block; width:100%; aspect-ratio:16/10; object-fit:cover; border-radius:22px; background:var(--pg-field); }
.ac-tile-b{ display:flex; justify-content:space-between; align-items:center; gap:12px; padding:16px 12px 10px; }
.ac-tile-t{ display:block; font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:22px; letter-spacing:-.02em; }
.ac-tile-d{ display:block; font-size:13.5px; color:var(--pg-muted); margin-top:2px; }
.ac-tile-out .ac-tile-t{ color:var(--pg-coral-d); }
.ac-tile-out .pg-arrow{ background:var(--pg-coral); }
.pg .ac-card .pg-h3{ font-size:26px; }
.ac-card .pg-alert{ margin:0; }

/* Connexion / inscription (visiteur) : présentation sur fond sombre + formulaire en onglets.
   Une colonne sous 900px (présentation au-dessus), maquette du sondage masquée sous 560px. */
.pg.ac-auth{ max-width:none; padding:0; display:grid; grid-template-columns:minmax(0,1fr); align-items:stretch; }
/* 2 colonnes : toute la hauteur de l'écran sous le header (127px sur 2 rangées) */
@media (min-width:900px){ .pg.ac-auth{ grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); min-height:calc(100vh - 127px); } }
.ac-hero{ position:relative; overflow:hidden; background:var(--pg-ink); color:#fff; padding:clamp(28px,5vw,72px); display:flex; flex-direction:column; justify-content:center; }
.ac-hero-in{ position:relative; width:100%; max-width:560px; margin:0 auto; display:flex; flex-direction:column; gap:30px; }
.ac-hero-in > *{ position:relative; }
.ac-hero-in > .ac-blob{ position:absolute; border-radius:50%; background:var(--pg-coral); pointer-events:none; }
.ac-blob-1{ right:-140px; top:-140px; width:420px; height:420px; opacity:.16; }
.ac-blob-2{ left:-120px; bottom:-160px; width:340px; height:340px; opacity:.08; }
.ac-free{ display:inline-flex; align-items:center; gap:8px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.14); border-radius:999px;
	padding:6px 12px; font-size:12.5px; font-weight:600; line-height:1.3; color:#f1e6e1; }
.ac-free::before{ content:''; flex:none; width:7px; height:7px; border-radius:50%; background:var(--pg-coral); }
.pg .ac-hero h1{ margin:16px 0 0; color:#fff; font-size:clamp(34px,4.6vw,54px); line-height:.98; letter-spacing:-.04em; text-wrap:balance; }
.ac-hero h1 span{ color:#ff8a78; }
.pg .ac-hero-p{ margin:14px 0 0; max-width:440px; font-size:16px; line-height:1.55; color:#d9ccc5; }
.ac-mock{ height:210px; }
.ac-mock-back{ position:absolute; left:4%; right:18%; top:22px; height:170px; background:var(--pg-tint); border-radius:22px; transform:rotate(-4deg); }
.ac-mock-card{ position:absolute; left:10%; right:6%; top:0; background:#fff; color:var(--pg-ink); border-radius:22px; padding:16px 18px;
	box-shadow:0 30px 50px -30px rgba(0,0,0,.7); display:flex; flex-direction:column; gap:10px; transform:rotate(1.5deg); }
.ac-mock-h{ display:flex; justify-content:space-between; align-items:center; gap:8px; }
.ac-mock-t{ min-width:0; font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:17px; line-height:1.2; }
.ac-mock-tag{ flex:none; font-size:11.5px; font-weight:700; background:var(--pg-tint); color:var(--pg-coral-dd); border-radius:999px; padding:3px 9px; white-space:nowrap; }
.ac-mock-r{ display:grid; grid-template-columns:62px minmax(0,1fr) 30px; gap:10px; align-items:center; font-size:13.5px; }
.ac-mock-r strong{ font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:16px; }
.ac-mock-r > span:last-child{ text-align:right; font-weight:700; color:var(--pg-text2); font-variant-numeric:tabular-nums; }
.ac-mock-bar{ display:block; height:8px; border-radius:999px; background:var(--pg-field); overflow:hidden; }
.ac-mock-bar span{ display:block; height:100%; border-radius:999px; }
.ac-mock-c1{ background:var(--pg-coral); }
.ac-mock-c2{ background:#f2a33a; }
.ac-mock-c3{ background:#2f9a6e; background:oklch(0.6 0.12 160); }
.ac-mock-vote{ position:absolute; right:2%; bottom:0; display:flex; align-items:center; gap:8px; background:var(--pg-coral); color:#fff; border-radius:999px;
	padding:8px 14px; font-weight:700; font-size:13.5px; line-height:1.3; box-shadow:0 12px 24px -12px rgba(232,96,79,.9); transform:rotate(-3deg); }
@media (max-width:559px){ .ac-mock{ display:none; } }
.ac-feats{ display:flex; flex-direction:column; gap:16px; }
.ac-feat{ display:grid; grid-template-columns:40px minmax(0,1fr); gap:14px; align-items:start; }
.ac-feat-ic{ width:40px; height:40px; border-radius:12px; background:rgba(232,96,79,.16); color:#ff8a78; display:grid; place-items:center; font-size:17px; line-height:1; }
.ac-feat-t{ display:block; font-weight:700; font-size:15.5px; color:#fff; }
.ac-feat-d{ display:block; margin-top:2px; font-size:14px; line-height:1.5; color:#c9bcb5; }
.ac-stats{ display:flex; gap:22px; flex-wrap:wrap; border-top:1px solid rgba(255,255,255,.12); padding-top:18px; }
.ac-stat-n{ font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:24px; line-height:1.25; }
.ac-stat-l{ font-size:12.5px; color:#c9bcb5; }
/* « Choisir à deux » mis en avant dans la présentation */
.pg .ac-duo{ display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:14px; align-items:center; padding:14px 16px; border-radius:20px;
	background:rgba(232,96,79,.14); border:1px solid rgba(255,138,120,.34); color:#fff; transition:background .15s; }
.pg .ac-duo:hover, .pg .ac-duo:focus{ background:rgba(232,96,79,.24); color:#fff; }
.ac-duo-pair{ display:flex; }
.ac-duo-pair span{ width:34px; height:34px; border-radius:50%; display:grid; place-items:center; font-size:14px; line-height:1; border:2px solid var(--pg-ink); }
.ac-duo-pair span:first-child{ background:var(--pg-tint); color:var(--pg-coral-d); }
.ac-duo-pair span + span{ margin-left:-10px; background:var(--pg-coral); color:#fff; }
.ac-duo-h{ display:flex; align-items:center; flex-wrap:wrap; gap:4px 8px; }
.ac-duo-t{ font-weight:700; font-size:15.5px; }
.ac-duo-k{ background:var(--pg-coral); color:#fff; border-radius:999px; padding:2px 8px; font-size:11px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; }
.ac-duo-d{ display:block; margin-top:2px; font-size:14px; line-height:1.5; color:#d9ccc5; }
.pg .ac-duo .pg-arrow{ width:34px; height:34px; font-size:15px; background:var(--pg-coral); }
/* Pas d'espace entre les deux panneaux et le pied de page */
.pg.ac-auth + .uf{ margin-top:0; border-top:1px solid var(--uf-sep); }
.ac-side{ background:#fff; padding:clamp(28px,5vw,72px); display:flex; flex-direction:column; justify-content:center; }
.ac-side-in{ width:100%; max-width:460px; margin:0 auto; display:flex; flex-direction:column; gap:18px; }
@media (min-width:900px){
	.ac-hero-in{ margin:0 0 0 auto; }
	.ac-side-in{ margin:0; }
}
.pg .ac-tabs .pg-seg-i{ padding:11px 8px; font-size:14.5px; }
.ac-forms{ display:flex; flex-direction:column; gap:48px; }
.ac-forms.is-tabbed[data-tab="login"] #signup, .ac-forms.is-tabbed[data-tab="signup"] #login{ display:none; }
.ac-pane{ display:flex; flex-direction:column; gap:16px; }
.pg .ac-pane-h h2{ font-size:30px; letter-spacing:-.03em; }
.pg .ac-pane-h p{ margin-top:4px; font-size:14.5px; color:var(--pg-muted); }
.ac-pane-hr{ display:flex; justify-content:space-between; align-items:flex-start; gap:10px; flex-wrap:wrap; }
.ac-pane .pg-alert{ margin:0; }
.ac-label-row{ display:flex; justify-content:space-between; align-items:baseline; gap:8px; margin-bottom:6px; }
.pg .ac-label-row .pg-label{ margin:0; }
.pg .ac-forgot, .pg .ac-forgot:focus{ font-size:12.5px; font-weight:600; color:var(--pg-coral-d); }
.pg .ac-forgot:hover{ color:var(--pg-coral-dd); }
.pg .ac-submit{ height:54px; font-size:15.5px; transition:opacity .15s; }
.ac-pane form:invalid .ac-submit{ opacity:.45; }
.ac-pane form:has(input:-webkit-autofill) .ac-submit{ opacity:1; }
.pg .ac-switch{ text-align:center; font-size:14px; color:var(--pg-text2); }
.pg .ac-switch a, .pg .ac-switch a:focus{ color:var(--pg-coral-d); font-weight:700; }
.pg .ac-switch a:hover{ color:var(--pg-coral-dd); }
.ac-set{ display:grid; grid-template-columns:minmax(0,1fr); gap:16px; align-items:start; }
@media (min-width:900px){ .ac-set{ grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); } }

/* Mes listes : création + tableau */
.ac-create{ margin-top:18px; background:var(--pg-tint); border-radius:28px; padding:clamp(18px,3vw,28px); display:flex; flex-direction:column; gap:14px; }
.ac-create-f{ display:flex; gap:10px; flex-wrap:wrap; margin:0; }
.pg .ac-create-f input, .pg .ac-create-f select{ height:50px; margin:0; padding:0 16px; border:1px solid #fff; border-radius:14px; background:#fff; color:var(--pg-ink);
	font:inherit; font-size:15px; outline:none; min-width:0; }
.pg .ac-create-f input{ flex:2 1 220px; }
.pg .ac-create-f select{ flex:1 1 160px; }
.pg .ac-create-f input:focus, .pg .ac-create-f select:focus{ border-color:var(--pg-tint-bd) !important; box-shadow:0 0 0 3px rgba(255,255,255,.7); }
.pg .ac-create-f .pg-btn{ height:50px; border-radius:14px; padding:0 22px; font-weight:700; font-size:15px; }
.ac-create-i{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr)); gap:10px; font-size:14px; line-height:1.5; color:var(--pg-text2); }
.ac-create-i p{ background:#fff; border-radius:16px; padding:12px 14px; }
.ac-lists-h{ display:flex; justify-content:space-between; align-items:baseline; gap:12px; margin:32px 0 12px; }
.ac-lists-h > span{ font-size:14px; color:var(--pg-muted); }
.ac-table{ background:#fff; border:1px solid var(--pg-line); border-radius:24px; overflow:hidden; }
.ac-table > * + *{ border-top:1px solid var(--pg-line3); }
.ac-tr{ display:grid; grid-template-columns:minmax(0,2.2fr) 90px 130px 130px 200px; gap:10px 12px; align-items:center; padding:14px 18px; }
.ac-tr-2{ grid-template-columns:minmax(0,1fr) auto; }
.ac-th{ padding:12px 18px; background:var(--pg-paper); font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--pg-muted); }
.ac-th span:last-child{ text-align:right; }
.pg .ac-name{ font-weight:700; font-size:15.5px; color:var(--pg-ink); overflow-wrap:anywhere; }
.pg .ac-name:hover{ color:var(--pg-coral-d); }
.ac-n{ font-size:14px; color:var(--pg-text2); font-variant-numeric:tabular-nums; }
.ac-n-l{ display:none; }
.ac-badge{ display:inline-block; border-radius:999px; padding:4px 10px; font-size:12px; font-weight:700; background:var(--pg-field); color:var(--pg-text2); white-space:nowrap; }
.ac-votes-1{ background:#feedc9; color:#724d0b; }
.ac-votes-2{ background:#d5f5da; color:#195c2e; }
.ac-public{ background:var(--pg-tint); color:var(--pg-coral-dd); }
.ac-acts{ display:flex; gap:4px; justify-content:flex-end; flex-wrap:wrap; }
.ac-ic svg{ width:16px; height:16px; display:block; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.pg .ac-ic{ width:34px; height:34px; border-radius:10px; border:1px solid var(--pg-line); background:#fff; color:var(--pg-ink); display:grid; place-items:center; font-size:15px; line-height:1; }
.pg .ac-ic:hover, .pg .ac-ic[aria-expanded="true"]{ background:var(--pg-tint); color:var(--pg-ink); }
.pg .ac-ic:focus{ border-color:var(--pg-line) !important; }
.pg .ac-ic-blue, .pg .ac-ic-blue:hover{ color:#0f68a2; }
.pg .ac-ic-red, .pg .ac-ic-red:hover{ color:var(--pg-coral-d); }
.ac-panel{ display:flex; flex-wrap:wrap; gap:10px; align-items:center; padding:14px 18px; background:#fffaf8; margin:0; }
.pg .ac-panel input, .pg .ac-panel select{ height:44px; }
.pg .ac-panel input[name="list_name"]{ flex:2 1 200px; width:auto; }
.pg .ac-panel select{ flex:1 1 170px; width:auto; }
.pg .ac-panel textarea{ flex:1 1 100%; min-height:70px; }
.ac-panel-f{ display:flex; gap:6px; flex-wrap:wrap; }
.ac-share{ flex-direction:column; align-items:stretch; gap:14px; }
.ac-share-r{ display:flex; flex-direction:column; gap:6px; margin:0; }
.ac-share-r .pg-label{ margin:0; }
.ac-copy{ display:flex; gap:8px; }
.pg .ac-copy input{ flex:1; min-width:0; }
.ac-none{ padding:28px 18px; text-align:center; color:var(--pg-muted); font-size:15px; }
.pg .ac-legend{ margin-top:12px !important; font-size:13px; line-height:1.5; color:var(--pg-muted); }
@media (max-width:759px){
	.ac-th{ display:none; }
	.ac-tr{ grid-template-columns:repeat(3,auto) minmax(0,1fr); }
	.ac-tr-2{ grid-template-columns:minmax(0,1fr); }
	.ac-name, .ac-acts{ grid-column:1/-1; }
	.ac-acts{ justify-content:flex-start; }
	.ac-n-l{ display:inline; }
}

/* ==========================================================================
   Listes de prénoms (communauté, mes listes) — community_lists.tpl, account_lists.tpl
   ========================================================================== */
.ln-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr)); gap:14px; align-items:start; }
.ln{ background:#fff; border:1px solid var(--pg-line); border-radius:24px; padding:18px 18px 16px; display:flex; flex-direction:column; gap:8px; min-width:0; }
.ln.is-mine{ border-color:#f3b8ad; }
.ln-top{ display:flex; justify-content:space-between; align-items:center; gap:8px; }
.pg .ln-name{ font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:26px; letter-spacing:-.03em; line-height:1.1; color:var(--pg-ink); overflow-wrap:anywhere; }
.pg .ln-name:hover{ color:var(--pg-coral-d); }
.ln-meta{ display:flex; gap:6px; align-items:center; flex-wrap:wrap; font-size:12.5px; color:var(--pg-muted); }
.pg .ln-desc{ font-size:14px; line-height:1.45; color:var(--pg-text2); text-wrap:pretty; }
.ln-poll{ display:flex; flex-direction:column; gap:6px; margin-top:4px; }
.ln-bar{ height:6px; border-radius:999px; background:var(--pg-field); overflow:hidden; }
.ln-bar span{ display:block; height:100%; background:var(--pg-coral); border-radius:999px; }
.ln-poll-f{ display:flex; justify-content:space-between; align-items:center; gap:8px; }
.ln-poll-f form{ margin:0; }
.ln-count{ font-size:13px; color:var(--pg-muted); }
.ln-count strong{ color:var(--pg-ink); }
.pg .ln-vote{ display:inline-flex; align-items:center; height:38px; padding:0 16px; border-radius:999px; border:1px solid var(--pg-ink); background:var(--pg-ink); color:#fff;
	font-weight:600; font-size:13.5px; white-space:nowrap; }
.pg .ln-vote:hover{ background:#000; color:#fff; }
.pg .ln-vote:focus{ border-color:var(--pg-ink) !important; }
.pg .ln-vote.is-on, .pg .ln-vote.is-on:hover{ background:var(--pg-tint); border-color:#f3b8ad; color:var(--pg-coral-dd); }
.ln-thumbs{ display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin-top:4px; }
.ln-thumbs form{ margin:0; }
.pg .ln-thumb{ display:inline-flex; align-items:center; gap:4px; height:36px; padding:0 12px; border-radius:999px; border:1px solid var(--pg-line2); background:#fff;
	color:var(--pg-ink); font-weight:600; font-size:13px; }
.pg button.ln-thumb:hover{ border-color:var(--pg-ink); }
.pg button.ln-thumb:focus{ border-color:var(--pg-line2) !important; }
.ln-thumb.is-on{ background:#d5f5da; border-color:#d5f5da; color:#195c2e; }
.ln-thumb.is-down{ background:var(--pg-field); border-color:var(--pg-field); color:var(--pg-text2); }
.pg .ln-rm{ align-self:flex-start; font-size:13px; font-weight:600; color:var(--pg-muted); text-decoration:underline; text-underline-offset:3px; }
.pg .ln-rm:hover{ color:var(--pg-coral-d); }
.ln-tools{ display:flex; gap:8px; flex-wrap:wrap; }
.pg .pg-head + .pg-hint{ margin:-8px 0 18px; }
.ln-sec{ margin-top:36px; display:flex; flex-direction:column; gap:12px; }
.ln-notes{ display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr)); gap:12px; }
.pg .ln-note{ border-radius:20px; padding:16px; gap:10px; margin:0; }
.ln-note-n{ font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:19px; }
.pg .ln-note textarea{ min-height:70px; }
.ln-note-f{ display:flex; gap:8px; flex-wrap:wrap; }
.pg .ln-note-f input{ flex:1 1 180px; width:auto; height:44px; }
.ln-more{ margin-top:36px; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px; background:var(--pg-tint); border-radius:24px; padding:20px 24px; }
.ln-more p{ margin-top:4px !important; font-size:14.5px; color:var(--pg-text2); }
.ln-more-f{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.ln-search{ display:flex; gap:6px; margin:0; }
.pg .ln-search input{ height:40px; margin:0; padding:0 16px; border:1px solid var(--pg-line2); border-radius:999px; background:#fff; color:var(--pg-ink); font:inherit; font-size:14px; }

.cl-head{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr)); gap:20px 40px; align-items:end; margin:14px 0 24px; }
.pg .cl-intro{ margin-top:12px !important; font-size:16px; line-height:1.6; color:var(--pg-text2); max-width:620px; text-wrap:pretty; }
.cl-poll-inline{ display:inline-flex; vertical-align:-3px; background:#fff; border:1px solid var(--pg-line); border-radius:6px; padding:2px 3px; }
.cl-poll-ic{ width:16px; height:16px; display:block; flex:none; }
.cl-bar{ display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:16px; }
.cl-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,270px),1fr)); gap:14px; }
.pg .cl-card{ display:flex; flex-direction:column; gap:12px; background:#fff; border:1px solid var(--pg-line); border-radius:24px; padding:18px; color:var(--pg-ink);
	transition:transform .15s, box-shadow .15s; }
.pg .cl-card:hover{ transform:translateY(-3px); box-shadow:var(--pg-shadow); color:var(--pg-ink); }
.cl-card-h{ display:flex; justify-content:space-between; align-items:flex-start; gap:10px; }
.cl-card-h > span:first-child{ min-width:0; }
.cl-card-t{ display:block; font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:20px; letter-spacing:-.02em; line-height:1.15; overflow-wrap:anywhere; }
.cl-card-n{ display:block; font-size:13px; color:var(--pg-muted); margin-top:4px; }
.cl-badge{ flex:none; display:inline-flex; align-items:center; gap:6px; background:var(--pg-tint); color:var(--pg-coral-dd); border-radius:999px; padding:5px 10px 5px 8px;
	font-size:12.5px; font-weight:700; white-space:nowrap; }
.cl-names{ display:flex; gap:5px; flex-wrap:wrap; }
.cl-name{ background:var(--pg-field); border-radius:999px; padding:4px 10px; font-size:13px; font-weight:600; }
.cl-name-f{ color:var(--pg-f); } .cl-name-m{ color:var(--pg-m); } .cl-name-x{ color:var(--pg-x); }
.cl-name-more{ padding:4px 6px; font-size:13px; color:var(--pg-muted); }
.cl-card-f{ display:flex; justify-content:space-between; align-items:center; gap:8px; margin-top:auto; border-top:1px solid #f4ede9; padding-top:12px; }
.cl-author{ display:flex; align-items:center; gap:8px; font-size:13px; color:var(--pg-muted); min-width:0; }
.cl-cta{ font-size:13px; font-weight:700; color:var(--pg-coral-d); white-space:nowrap; }
.cl-hero{ margin-top:14px; background:var(--pg-tint); border-radius:32px; padding:clamp(20px,3.5vw,40px); display:flex; flex-direction:column; gap:14px; }
.cl-by{ display:flex; align-items:center; gap:10px; font-size:14px; color:var(--pg-text2); }
.cl-by strong{ color:var(--pg-ink); }
.pg .cl-h1{ font-size:clamp(36px,5vw,58px); letter-spacing:-.04em; line-height:.98; }
.pg .cl-desc{ font-size:17px; line-height:1.55; color:#4a403b; text-wrap:pretty; max-width:760px; }
.cl-hero-f{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.cl-grow{ flex:1; }
.cl-res{ margin-top:28px; display:grid; grid-template-columns:minmax(0,1fr); gap:32px; align-items:end; }
.pg .cl-res-h{ margin:6px 0 4px; }
.cl-podium{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; align-items:end; margin-top:22px; }
.cl-pod{ display:flex; flex-direction:column; align-items:center; gap:8px; min-width:0; }
.cl-pod .tp-medal{ width:40px; height:40px; }
.cl-pod .tp-medal svg{ width:22px; height:22px; }
.pg .cl-pod-n{ font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:clamp(16px,2vw,22px); letter-spacing:-.02em; text-align:center; overflow-wrap:anywhere; color:var(--pg-ink); }
.cl-pod-v{ font-size:12.5px; color:var(--pg-muted); }
.cl-pod-b{ width:100%; border-radius:16px 16px 6px 6px; display:flex; justify-content:center; padding-top:10px; font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:22px;
	background:var(--pg-tint); color:var(--pg-coral-d); }
.cl-pod-1 .cl-pod-b{ height:120px; background:var(--pg-coral); color:#fff; }
.cl-pod-2 .cl-pod-b{ height:88px; }
.cl-pod-3 .cl-pod-b{ height:64px; }
.cl-rank{ display:flex; flex-direction:column; gap:10px; }
.cl-rank li{ display:grid; grid-template-columns:24px minmax(70px,120px) minmax(0,1fr) 72px; gap:10px; align-items:center; }
.cl-rank-n{ font-weight:700; font-size:13px; color:var(--pg-muted); font-variant-numeric:tabular-nums; }
.cl-rank-p{ display:flex; align-items:center; gap:6px; min-width:0; font-weight:700; font-size:15px; }
.cl-rank-p span:last-child{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cl-dot{ flex:none; width:8px; height:8px; border-radius:50%; background:var(--pg-x); }
.cl-dot-f{ background:var(--pg-f); } .cl-dot-m{ background:var(--pg-m); }
.cl-rank-bar{ height:26px; border-radius:8px; background:var(--pg-field); overflow:hidden; }
.cl-rank-bar span{ display:block; height:100%; border-radius:8px; background:#f3b8ad; }
.cl-rank-bar span.is-first{ background:var(--pg-coral); }
.cl-rank-v{ text-align:right; font-size:13px; font-variant-numeric:tabular-nums; white-space:nowrap; }
.cl-rank-v span{ color:var(--pg-muted); }
.cl-sh{ margin:28px 0 16px; align-items:center; }
@media (min-width:900px){ .cl-res{ grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); } }

/* ==========================================================================
   Contact — templates/contact.tpl
   ========================================================================== */
.pg .ct-card{ margin-top:18px; border-radius:32px; padding:clamp(22px,4vw,48px); gap:18px; }
.pg .ct-h1{ font-size:clamp(32px,4.5vw,48px); }
.pg .ct-intro{ margin-top:8px !important; font-size:15.5px; color:var(--pg-muted); }
.ct-f{ display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; }
.ct-sent{ background:#d8f9dd; color:#09471f; border-radius:20px; padding:22px; display:flex; flex-direction:column; gap:10px; font-size:15px; line-height:1.5; }
.pg .ct-sent-t{ font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:22px; }
.pg .ct-again, .pg .ct-again:hover{ align-self:flex-start; border:1px solid currentColor; background:transparent; color:inherit; padding:8px 14px; font-size:13.5px; }

/* ==========================================================================
   Compatibilité prénoms — templates/tools_compatibility_names.tpl
   ========================================================================== */
.pg .cp-intro{ margin:0 0 22px !important; font-size:16.5px; line-height:1.55; color:var(--pg-text2); }
.cp-tool{ background:var(--pg-tint); border-radius:32px; padding:clamp(16px,3vw,28px); }
.cp-form{ display:flex; flex-direction:column; gap:16px; margin:0; }
.cp-modes{ order:-1; }
.cp-row{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.pg .cp-row input{ flex:1 1 180px; min-width:0; height:54px; margin:0; padding:0 18px; border:0; border-radius:16px; background:#fff; color:var(--pg-ink); font:inherit;
	font-size:17px; font-weight:600; outline:none; }
.pg .cp-row input:focus{ border:0 !important; box-shadow:0 0 0 3px var(--pg-tint-bd); }
.cp-join{ flex:none; width:40px; height:40px; border-radius:50%; background:#fff; color:var(--pg-coral); display:grid; place-items:center; font-size:18px; }
.pg .cp-go{ flex:0 1 auto; height:54px; padding:0 28px; border-radius:16px; background:var(--pg-coral-d); color:#fff; font-weight:700; font-size:16px; }
.pg .cp-go:hover{ background:var(--pg-coral-dd); }
.pg .cp-reset{ flex:none; height:54px; padding:0 18px; border:1.5px solid var(--pg-ink); border-radius:16px; background:#fff; color:var(--pg-ink); font-weight:600; font-size:15px;
	display:flex; align-items:center; gap:6px; }
.pg .cp-reset:hover{ background:var(--pg-ink); color:#fff; }
.cp-res{ background:#fff; border-radius:24px; padding:clamp(18px,3vw,28px); display:grid; grid-template-columns:minmax(0,1fr); gap:28px; align-items:center; }
.cp-ring{ width:190px; height:190px; margin:0 auto; border-radius:50%; background:conic-gradient(var(--pg-coral) var(--deg), var(--pg-field) 0); display:grid; place-items:center; }
.cp-ring > div{ width:150px; height:150px; border-radius:50%; background:#fff; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.cp-score{ font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:52px; letter-spacing:-.04em; line-height:1; }
.cp-score-l{ font-size:12.5px; font-weight:600; color:var(--pg-muted); margin-top:4px; }
.cp-res-b{ display:flex; flex-direction:column; gap:14px; min-width:0; }
.pg .cp-names{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:clamp(26px,3.4vw,36px);
	letter-spacing:-.03em; line-height:1.1; overflow-wrap:anywhere; }
.cp-names-j{ color:var(--pg-coral); font-size:.7em; }
.cp-verdict{ align-self:flex-start; border-radius:999px; padding:6px 14px; font-weight:700; font-size:14px; }
.cp-v-green{ background:#d5f5da; color:#115629; }
.cp-v-tint{ background:var(--pg-tint); color:var(--pg-coral-dd); }
.cp-v-yellow{ background:#feedc9; color:#724d0b; }
.cp-v-field{ background:var(--pg-field); color:var(--pg-text2); }
.pg .cp-text{ font-size:15.5px; line-height:1.6; color:#4a403b; }
.cp-nums{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.cp-nums div{ background:var(--pg-paper); border-radius:14px; padding:10px 12px; min-width:0; }
.cp-nums span{ display:block; font-size:12px; color:var(--pg-muted); overflow-wrap:anywhere; }
.cp-nums b{ display:block; font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:22px; }
.cp-links{ display:flex; gap:8px; flex-wrap:wrap; }
.cp-ex{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; font-size:13.5px; color:var(--pg-text2); }
.cp-ex > span{ font-weight:600; }
.pg .cp-ex button{ background:#fff; border-radius:999px; padding:7px 12px; font-weight:600; font-size:13px; color:var(--pg-ink); }
.pg .cp-ex button:hover{ background:var(--pg-ink); color:#fff; }
.cp-warn{ margin-top:18px; display:flex; gap:16px; align-items:flex-start; background:#fff; border:1px solid var(--pg-line); border-radius:22px; padding:18px 20px; }
.cp-warn-ic{ flex:none; width:36px; height:36px; border-radius:50%; background:var(--pg-m); color:#fff; display:grid; place-items:center; font-weight:800; font-size:18px; }
.cp-warn p{ font-size:15px; line-height:1.6; color:#4a403b; }
.cp-warn strong, .cp-warn b{ color:var(--pg-ink); }
.pg .cp-seo{ margin-top:52px; max-width:760px; font-size:16px; color:#4a403b; }
.pg .cp-seo h2{ font-size:clamp(24px,3vw,32px); letter-spacing:-.03em; margin-top:0; }
.cp-cards{ margin-top:22px; display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr)); gap:14px; }
.pg .cp-card{ border-radius:24px; padding:22px; gap:10px; }
.pg .cp-card-t{ font-weight:700; font-size:20px; letter-spacing:-.02em; }
.pg .cp-card-x{ font-size:15px; color:#4a403b; }
@media (min-width:760px){ .cp-res{ grid-template-columns:220px minmax(0,1fr); } }

/* ==========================================================================
   Pages légales (mentions légales, confidentialité) — templates/includes/legal_page.tpl
   ========================================================================== */
.pg.lg{ max-width:1148px; }
.pg .lg-h1{ margin:14px 0 8px; }
.pg .lg-upd{ margin:0 0 28px !important; font-size:14.5px; color:var(--pg-muted); }
.lg-todo{ background:var(--pg-tint); color:var(--pg-coral-dd); border-radius:6px; padding:1px 6px; font-weight:600; }
.lg-layout{ display:grid; grid-template-columns:minmax(0,1fr); gap:40px; align-items:start; margin-top:22px; }
.pg .lg-upd + .lg-layout{ margin-top:0; }
.lg-toc{ display:none; }
.lg-main{ display:flex; flex-direction:column; gap:14px; min-width:0; }
.pg .lg-sec{ border-radius:24px; padding:clamp(18px,3vw,28px); gap:12px; scroll-margin-top:150px; }
.lg-sec-h{ display:flex; gap:12px; align-items:baseline; }
.lg-n{ font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:15px; color:var(--pg-coral-d); }
.pg .lg-h2{ font-size:clamp(22px,2.6vw,28px); letter-spacing:-.03em; }
.pg .lg-prose{ font-size:16px; line-height:1.7; color:#3d3430; }
.lg-row{ display:grid; grid-template-columns:minmax(120px,200px) minmax(0,1fr); gap:4px 16px; padding:10px 0; border-top:1px solid #f4ede9; font-size:15px; line-height:1.5; }
.lg-row > span:first-child{ color:var(--pg-muted); }
.lg-rows{ margin-top:4px; }
@media (min-width:820px){
	.lg-layout{ grid-template-columns:240px minmax(0,1fr); }
	.lg-toc{ display:block; position:sticky; top:140px; padding:16px; }
}

/* ==========================================================================
   Mobile (compléments des sections ci-dessus)
   ========================================================================== */
@media (max-width:819px){
	.hm{ gap:48px; padding-top:20px; }
	.hm-tiles{ grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); }
	.hm-ideas{ grid-template-columns:repeat(2,minmax(0,1fr)); }
	.tp-nav{ padding:12px 14px; }
	.tp-nav-h{ width:auto; min-width:64px; }
	.tp-decs{ flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; -webkit-overflow-scrolling:touch; }
	.tp-decs::-webkit-scrollbar{ display:none; }
	.tp-nav-y{ flex-direction:column; gap:8px; }
	.tp-nav-y .tp-nav-h{ padding-top:0; }
	.pg-seg-full .pg-seg-i{ padding:9px 10px; }
	.pg .tp-row{ grid-template-columns:30px minmax(0,1fr) auto 56px; gap:8px; }
	.pg-dark-cta{ padding:16px; }
	.bl-art-meta{ align-items:flex-start; }
	.pg .bl-hero{ border-radius:24px; margin-bottom:24px; aspect-ratio:16/9; }
	.pg .bl-prose{ font-size:16.5px; }
	.pg .bl-prose > p:first-child{ font-size:18px; }
	.cp-nums{ grid-template-columns:minmax(0,1fr); }
	.cp-nums div{ display:flex; justify-content:space-between; align-items:center; gap:10px; }
	.pg .cp-go{ flex:1 1 100%; }
	.pg .cp-reset{ flex:1 1 100%; justify-content:center; }
	.cl-rank li{ grid-template-columns:22px minmax(60px,96px) minmax(0,1fr) 64px; gap:8px; }
	.lg-row{ grid-template-columns:minmax(0,1fr); }
}

@media (prefers-reduced-motion:reduce){
	.pg .ac, .pg .cl-card, .pg .hm-q, .pg .ct, .pg .hm-tile{ transition:none; }
	.pg .ac-list:hover, .pg .cl-card:hover{ transform:none; }
}

/* ==========================================================================
   Fiche prénom : carte des naissances par département (unprenom.fr)
   Balisage : templates/sample-prenom.tpl (.dm) ; comportements : theme/js/dept-map.js ;
   contours : theme/images/departements.svg. Les 6 couleurs de .dm-ramp servent aussi à la carte.
   ========================================================================== */
.dm{ --dm-none:#ebe5e1; container-type:inline-size; }
.dm-bar{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.dm-modes{ display:flex; gap:8px; flex-wrap:wrap; }
.dm-modes[hidden], .dm-years[hidden], .dm-nonel[hidden]{ display:none; }
.pg .dm-mode{ border:1px solid var(--pg-line2); background:#fff; color:var(--pg-ink); border-radius:999px; padding:7px 14px;
	font-weight:600; font-size:13.5px; line-height:1.3; }
.pg .dm-mode:hover{ border-color:var(--pg-ink); }
.pg .dm-mode.is-on{ background:var(--pg-ink); border-color:var(--pg-ink); color:#fff; }
.dm-period{ margin-left:auto; font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:22px; letter-spacing:-.02em; font-variant-numeric:tabular-nums; }
.dm-years{ display:flex; flex-direction:column; gap:10px; margin-top:-8px; }
.dm-slide{ display:flex; align-items:center; gap:12px; }
.pg .dm-step{ flex:none; width:40px; padding:7px 0; text-align:center; }
.dm-range{ flex:1; min-width:0; margin:0; accent-color:var(--pg-coral-d); cursor:pointer; }
.dm-chips{ display:flex; gap:4px; flex-wrap:wrap; }
.pg .dm-chip{ border-radius:8px; padding:4px 8px; font-size:12.5px; font-weight:600; color:var(--pg-muted); font-variant-numeric:tabular-nums; }
.pg .dm-chip:hover{ color:var(--pg-ink); }
.pg .dm-chip.is-on{ background:var(--pg-tint); color:var(--pg-coral-dd); }
.dm-grid{ display:grid; grid-template-columns:minmax(0,1fr); gap:24px; align-items:center; }
@container (min-width:560px){ .dm-grid{ grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); } }
.dm-mapw{ position:relative; min-width:0; }
.dm-map{ aspect-ratio:1040 / 1128; display:grid; place-items:center; color:var(--pg-muted); font-size:14px; transition:opacity .15s; }
.dm.is-loading .dm-map{ opacity:.5; }
.dm-map svg{ display:block; width:100%; height:100%; }
.dm-map path{ fill:var(--dm-none); stroke:#fff; stroke-width:.8px; vector-effect:non-scaling-stroke; stroke-linejoin:round; cursor:pointer; }
.dm-map path.is-hover{ stroke:var(--pg-ink); stroke-width:1.6px; }
.dm-box{ fill:var(--pg-paper); }
.dm-tip{ position:absolute; left:0; top:0; z-index:2; pointer-events:none; opacity:0; transition:opacity .12s; transform:translate(-50%,-115%);
	background:var(--pg-ink); color:#fff; border-radius:12px; padding:8px 12px; font-size:13px; line-height:1.35; white-space:nowrap;
	box-shadow:0 10px 24px -12px rgba(0,0,0,.5); }
.dm-tip.is-on{ opacity:1; }
.dm-side{ display:flex; flex-direction:column; gap:18px; min-width:0; }
.pg .dm-h{ margin:0 0 8px; font-family:inherit; font-size:12px; font-weight:700; letter-spacing:.06em; line-height:1.4; text-transform:uppercase; color:var(--pg-muted); }
.dm-ramp{ display:flex; gap:2px; }
.dm-ramp span{ flex:1; height:10px; }
.dm-ramp span:first-child{ border-radius:999px 0 0 999px; }
.dm-ramp span:last-child{ border-radius:0 999px 999px 0; }
.dm-ramp span:nth-child(1){ background:#fdf2ee; }
.dm-ramp span:nth-child(2){ background:#f9d5ca; }
.dm-ramp span:nth-child(3){ background:#f2ab98; }
.dm-ramp span:nth-child(4){ background:#e8604f; }
.dm-ramp span:nth-child(5){ background:#c2402f; }
.dm-ramp span:nth-child(6){ background:#8f2d20; }
.dm-scale{ display:flex; justify-content:space-between; font-size:12px; color:var(--pg-muted); margin-top:4px; }
.dm-nonel{ display:flex; align-items:center; gap:6px; font-size:12px; color:var(--pg-muted); margin-top:8px; }
.dm-nonel span{ width:14px; height:10px; border-radius:3px; background:var(--dm-none); }
.dm-top{ display:flex; flex-direction:column; gap:6px; }
.dm-top li{ display:grid; grid-template-columns:24px minmax(0,1fr) auto; gap:10px; align-items:center; background:var(--pg-paper); border-radius:12px; padding:9px 12px; }
.dm-top li.is-first{ background:var(--pg-tint); }
.dm-top li.dm-empty{ display:block; color:var(--pg-muted); font-size:14px; }
.dm-rk{ font-family:'Bricolage Grotesque',sans-serif; font-weight:800; color:var(--pg-muted); }
.is-first .dm-rk{ color:var(--pg-coral-d); }
.dm-nm{ font-weight:600; font-size:14.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dm-nm span{ color:#9a8a82; font-weight:500; }
.dm-v{ font-weight:700; font-size:14px; font-variant-numeric:tabular-nums; }
.dm-src{ font-size:12px; color:var(--pg-muted); }
@media (prefers-reduced-motion:reduce){ .dm-map, .dm-tip{ transition:none; } }

/* --- Le prénom X en chiffres (templates/includes/portrait.tpl, includes/fcts_portrait.php) --- */
.pt-txt{ font-size:16px; }
.pt-facts{ display:grid; grid-template-columns:repeat(auto-fit,minmax(128px,1fr)); gap:10px; margin:0; }
.pt-facts > div{ background:var(--pg-paper); border-radius:16px; padding:14px; min-width:0; }
.pt-facts dt{ font-size:12px; font-weight:600; line-height:1.35; color:var(--pg-muted); }
.pt-facts dd{ margin:0; }
.pt-facts .pt-v{ font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:22px; line-height:1.2; margin-top:4px; overflow-wrap:break-word; }
.pt-facts .pt-n{ font-size:12.5px; line-height:1.35; color:var(--pg-muted); margin-top:2px; }
.pt-mates{ margin-top:26px; }
@media (max-width:480px){ .pt-facts .pt-v{ font-size:19px; } }
.pt-mates .pf-h3{ margin-bottom:6px !important; }
.pt-mates .pf-sub{ margin:0 0 12px !important; }