@font-face{font-family:'Caveat';src:url('/assets/caveat.woff2') format('woff2');
 font-weight:600 700;font-display:swap}
:root{--fond:#111114;--carte:#1a1a1f;--texte:#e8e6e1;--doux:#9a968e;--trait:#2a2a30;--fort:#fff;--texte2:#c8c5be;--texte3:#d6d3cc;--date:#8a867d;--carte2:#16161a}
html.jour{--fond:#f7f6f3;--carte:#ffffff;--texte:#1a1a1c;--doux:#6f6b63;--trait:#e3e1da;--fort:#000;--texte2:#3f3d38;--texte3:#2e2c28;--date:#7a766d;--carte2:#eceae5}
/* thème Animal Crossing (New Horizons) : papier crème/sable, vert feuille Nook,
   brun bois, les codes couleurs des menus du jeu (Vincent 12/08) */
html.ac{--fond:#f3e7cf;--carte:#fbf6e4;--texte:#584826;--doux:#9a8a60;--trait:#ddcfa2;--fort:#4e8a2a;--texte2:#6d5b34;--texte3:#4a3c1f;--date:#8a7a4e;--carte2:#e8dfbe}
/* --- thème Animal Crossing : plus fun (texture pointillée + touches colorées façon patterns du jeu) --- */
.logo .logo-ac,.mini-logo.logo-ac{display:none}   /* logo AC masqué partout SAUF thème ac (spécificité > .logo img) */
html.ac .logo-std,html.ac .mini-logo.logo-std{display:none}
html.ac .logo .logo-ac{display:block;width:18rem;max-width:70vw;height:auto;margin:0 auto}
html.ac .mini-logo.logo-ac{display:inline-block}
html.ac header{background:var(--fond);padding-top:.9rem}   /* en-tête uni (sans pois) + marge réduite au-dessus du logo AC */
html.ac body{background-color:var(--fond);
 background-image:radial-gradient(rgba(120,180,80,.11) 1.7px,transparent 1.8px),
                  radial-gradient(rgba(232,178,64,.09) 1.7px,transparent 1.8px);
 background-size:26px 26px,26px 26px;background-position:0 0,13px 13px}
html.ac .carte{border-radius:16px;box-shadow:0 3px 0 rgba(120,90,50,.12)}
html.ac .grille-photos img,html.ac .grille-autres .carte{border-radius:14px}
/* AC : le liseret (::before) et le coin badge (::after) suivent le rayon arrondi */
html.ac .carte::before{border-radius:16px}
html.ac .carte::after{border-radius:0 16px 0 0}
html.ac .grille-autres .carte::before{border-radius:14px}
html.ac .grille-autres .carte::after{border-radius:0 14px 0 0}
html.ac .section,html.ac .autres-t,html.ac .fin-t{color:#4e8a2a}
html.ac .date{color:#c9772f}
html.ac .menu a.on{border-bottom-color:#5aa02c}
html.ac h1.titre-modele{color:#4e6b22}
html.ac .badge{background:#5aa02c;color:#fff}
html.ac .deb{filter:saturate(1.3)}
html.ac .barre-fin{background:linear-gradient(90deg,#7cc242,#e8b240,#5ab4c4,#e07a7a);height:3px;border:0;opacity:.7}
/* police Animal Crossing (FinkHeavy = police du logo du jeu) pour menu + titres */
@font-face{font-family:'FinkHeavy';src:url('/assets/finkheavy.woff2') format('woff2'),url('/assets/finkheavy.ttf') format('truetype');font-display:swap}
html.ac .menu a,html.ac h1,html.ac h2,html.ac h3,html.ac .titre-modele,html.ac .seance,html.ac .section,html.ac .autres-t,html.ac .fin-t,html.ac .sel-theme{font-family:'FinkHeavy',-apple-system,system-ui,sans-serif}
html.jour .logo img,html.jour .mini-logo{filter:invert(1)}
/* ===== thème « Pingoo Park 2002 » (Vincent 14/08) — recréé d'après la home
   d'époque : fond bleu pâle #d9e9f4, barres de titre #336699 à texte blanc,
   corps de tableaux #f3f3f3, bordures #003366, liens #336699, champs #b0cedb,
   police Arial, coins nets, dates en bleu #336699 (Vincent n'aime pas le rouge).
   S'applique à www ET book. */
html.p2002{--fond:#dae8f3;--carte:#f3f3f3;--texte:#000;--doux:#336699;--trait:#003366;--fort:#003366;--texte2:#1a4a72;--texte3:#000;--date:#336699;--carte2:#e7f0f8}
/* logo d'époque : montré uniquement en thème 2002 */
.logo .logo-2002,.mini-logo.logo-2002{display:none}
html.p2002 .logo-std,html.p2002 .mini-logo.logo-std{display:none}
html.p2002 .logo .logo-2002{display:block;width:30rem;max-width:90vw;height:auto;margin:0 auto}
html.p2002 .mini-logo.logo-2002{display:inline-block;width:12rem;opacity:.85}
/* ambiance générale : Arial + coins nets partout */
html.p2002 body{font-family:Arial,Helvetica,'Liberation Sans',sans-serif}
html.p2002 .carte,html.p2002 .cote-bloc,html.p2002 .appel-modeles,html.p2002 .canal,
html.p2002 .grille-autres .carte,html.p2002 label.tri select,html.p2002 .cherche input,
html.p2002 select.langue,html.p2002 .sel-theme,html.p2002 .cherche-blog,html.p2002 p.liens a,
html.p2002 .modes button{border-radius:0!important}
html.p2002 .carte,html.p2002 .cote-bloc,html.p2002 .appel-modeles,html.p2002 .canal{
  border:1px solid var(--trait);background:var(--carte)}
html.p2002 .carte img,html.p2002 .grille-photos img,html.p2002 .carte.billet img,
html.p2002 .grille-autres .carte img{border-radius:0}
html.p2002 .carte::before{border-radius:0}
html.p2002 .carte::after{border-radius:0}
/* barres de titre bleues façon 2002 (blocs pleine largeur, texte blanc) */
html.p2002 .section,html.p2002 .autres-t,html.p2002 .fin-t{
  background:#336699;color:#fff;padding:.3rem .65rem;font-weight:bold;font-size:.82rem;
  border:0;border-radius:0;display:block}
html.p2002 .cote-bloc h3{background:#336699;color:#fff;margin:-.9rem -1rem .7rem;
  padding:.38rem .7rem;font-size:.85rem;border-radius:0}
/* liens, menu, titres, dates */
html.p2002 a{color:#336699}
html.p2002 a:hover{color:#003366;text-decoration:underline}
/* les cartes-vignettes (articles/shootings) ne se soulignent PAS au survol :
   on garde le comportement du thème classique (Vincent 14/08) */
html.p2002 a.carte:hover,html.p2002 a.carte:hover h2,html.p2002 a.carte:hover *{text-decoration:none}
html.p2002 .menu a{color:#336699}
html.p2002 .menu a.on{color:#003366;border-bottom-color:#336699}
html.p2002 h1,html.p2002 h2,html.p2002 h3,html.p2002 .titre-modele{color:#003366}
html.p2002 h1.titre-modele{color:#003366}
html.p2002 .date{color:#336699}
/* champs de saisie couleur d'époque */
html.p2002 input,html.p2002 .cherche input,html.p2002 .cherche-blog{
  background:#b0cedb;color:#000;border:1px solid #003366;border-radius:0}
/* filet de fin bleu, badges bleus */
html.p2002 .barre-fin{background:#336699;height:2px;border:0;opacity:1}
html.p2002 .badge{background:#336699;color:#fff}
/* bouton de mode ACTIF : fond bleu titre + texte blanc (sinon noir sur marine = illisible) */
html.p2002 .modes button.ici{background:#336699;color:#fff}
/* ===== thème « Gally 2007 » (Vincent 14/08) — d'après le blog Pingoo de 2008 :
   cadre bleu marine #171925, colonne de contenu blanche, liens bleu roi, menu vert,
   listes sidebar violettes, en-têtes de section avec glaçon 🧊, séparateurs pointillés,
   et une BANNIÈRE Gally tirée au hasard à chaque page (14 dessins). www ET book. */
html.gally2007{--fond:#171925;--carte:#ffffff;--texte:#333;--doux:#2b4f99;--trait:#d6d9e2;--fort:#14264a;--texte2:#555;--texte3:#333;--date:#888;--carte2:#f2f5fb}
html.gally2007 body{background:#171925;font-family:'Lucida Grande','Segoe UI',Verdana,Arial,sans-serif}
/* colonne blanche centrée sur le cadre marine (le contenu de 2008 vivait dans une boîte blanche) */
html.gally2007 header{background:#fff;max-width:1000px;margin:1.2rem auto 0;padding:1rem 1.4rem .6rem}
html.gally2007 main{background:#fff;max-width:1000px;margin:0 auto 1.6rem;padding:1rem 1.6rem 2.2rem}
/* le fil de navigation et le retour-blog font PARTIE de la colonne blanche
   (sinon ils flottent sur le marine, hors cadre) — même largeur, sans marge marine */
html.gally2007 nav.fil,html.gally2007 .retour-blog-l{
  background:#fff;max-width:1000px;margin:0 auto;padding:.5rem 1.6rem .3rem}
/* liens bleu roi, menu vert, titres bleus */
html.gally2007 a{color:#2b4f99}
html.gally2007 a:hover{color:#14264a;text-decoration:underline}
html.gally2007 a.carte:hover,html.gally2007 a.carte:hover *{text-decoration:none}
html.gally2007 .menu a{color:#2e6b52;font-weight:bold}
html.gally2007 .menu a.on{color:#1c4a37;border-bottom-color:#2e6b52}
html.gally2007 h1,html.gally2007 h2,html.gally2007 h3,html.gally2007 .titre-modele{color:#2b4f99}
/* cartes : léger cadre gris pour se détacher du blanc, coins nets */
html.gally2007 .carte,html.gally2007 .cote-bloc,html.gally2007 .grille-autres .carte{
  background:#fff;border:1px solid #d6d9e2;border-radius:0}
html.gally2007 .carte img,html.gally2007 .grille-photos img,html.gally2007 .carte.billet img,
html.gally2007 .grille-autres .carte img{border-radius:0}
html.gally2007 .carte::before{border-radius:0}html.gally2007 .carte::after{border-radius:0}
/* en-têtes de section avec un glaçon, façon 2008 */
html.gally2007 .section,html.gally2007 .autres-t,html.gally2007 .fin-t{color:#14264a;font-weight:bold}
html.gally2007 .cote-bloc h3{color:#14264a}
html.gally2007 .cote-bloc h3::before,html.gally2007 .section::before{content:"🧊 "}
/* liens de listes du blog (RSS) en violet, dates grises, filet pointillé */
html.gally2007 .d-liste a{color:#8a7ec8}
html.gally2007 .date{color:#888}
html.gally2007 .barre-fin{background:none;border:0;border-top:1px dashed #cfd3dd;height:0;opacity:1}
/* champs de la sidebar blog (recherche + langue) : ils héritent de --fond (marine) → forcés en blanc */
html.gally2007 .cherche-blog,html.gally2007 .sel-langue-blog{background:#fff;color:#333;border-color:#cfd3dd}
/* la barre du haut (thème/boss/connexion) est sur le marine → texte clair */
html.gally2007 .topbar,html.gally2007 .coin-gauche #panic{color:#aeb6c8}
/* bannière Gally aléatoire (src posé en JS) : montrée uniquement en thème gally2007 */
.logo .logo-gally2007,.mini-logo.logo-gally2007{display:none}
html.gally2007 .logo-std,html.gally2007 .mini-logo.logo-std{display:none}
html.gally2007 .logo .logo-gally2007{display:block;width:950px;max-width:100%;height:auto;margin:0 auto}
html.gally2007 .mini-logo.logo-gally2007{display:inline-block;width:16rem}
/* petit « Pingoo.com » en surbrillance dans le coin bas-gauche de la bannière,
   lisible sur bannière claire OU foncée (contour noir + halo), sans toucher aux images */
html.gally2007 .logo{position:relative;display:block;width:950px;max-width:100%;margin:0 auto}
html.gally2007 .logo::after{content:"Pingoo.com";position:absolute;left:.55rem;bottom:.45rem;
 font:700 1rem/1 Arial,Helvetica,sans-serif;color:#fff;letter-spacing:.02em;pointer-events:none;
 text-shadow:0 0 2px #000,0 0 4px #000,1px 1px 0 #000,-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000}
/* ===== thème « Garko 2009 » (classe p2009 ; Vincent 14/08) — frais, Web 2.0 2009 :
   fond menthe clair en dégradé, cartes blanches ARRONDIES + ombres douces, accents
   turquoise & corail, titres/menu en écriture manuscrite (Caveat) façon doodles des
   bannières. Bannière tirée au hasard à chaque page (47 visuels). www ET book. */
html.p2009{--fond:#e6f3ee;--carte:#ffffff;--texte:#2b3b38;--doux:#12a48c;--trait:#dcebe5;--fort:#0c8f79;--texte2:#4c5f5a;--texte3:#2b3b38;--date:#f4728e;--carte2:#f0f9f5}
html.p2009 body{background:linear-gradient(180deg,#edf7f3 0%,#e2f0eb 100%) fixed;
  font-family:'Segoe UI','Helvetica Neue',Arial,sans-serif}
/* menu, en-têtes de section et nom de modèle en manuscrit (esprit doodle) */
html.p2009 .menu a,html.p2009 .titre-modele,html.p2009 .section,html.p2009 .autres-t,
html.p2009 .fin-t,html.p2009 .cote-bloc h3{font-family:'Caveat','Segoe UI',cursive}
html.p2009 .menu a{font-size:1.5rem;color:#12a48c;font-weight:700}
html.p2009 .menu a.on{color:#0c8f79;border-bottom:2px solid #f4728e}
html.p2009 .titre-modele{color:#0c8f79;font-size:2.4rem}
html.p2009 .section,html.p2009 .autres-t,html.p2009 .fin-t,html.p2009 .cote-bloc h3{color:#0c8f79;font-size:1.55rem}
/* liens turquoise, survol corail ; titres de cartes en turquoise (police normale = lisible) */
html.p2009 a{color:#12a48c}
html.p2009 a:hover{color:#e85b7c}
html.p2009 a.carte:hover,html.p2009 a.carte:hover *{text-decoration:none}
html.p2009 h2,html.p2009 h3{color:#0c8f79}
/* cartes blanches arrondies + ombre douce (Web 2.0) */
html.p2009 .carte,html.p2009 .cote-bloc,html.p2009 .appel-modeles,html.p2009 .canal,
html.p2009 .grille-autres .carte{background:#fff;border:1px solid #e0efe9;border-radius:16px;
  box-shadow:0 4px 16px rgba(18,120,100,.10)}
html.p2009 .carte img,html.p2009 .grille-photos img,html.p2009 .carte.billet img{border-radius:14px 14px 0 0}
html.p2009 .grille-autres .carte img{border-radius:14px}
html.p2009 .carte::before{border-radius:16px}html.p2009 .carte::after{border-radius:0 16px 0 0}
/* champs & boutons arrondis pilule, frais */
html.p2009 .cherche input,html.p2009 .cherche-blog,html.p2009 select.langue,html.p2009 .sel-langue-blog,
html.p2009 label.tri select,html.p2009 .modes button{border-radius:99px;border:1px solid #cfe6df;background:#fff;color:#2b3b38}
html.p2009 .modes button.ici{background:#12a48c;color:#fff}
html.p2009 .date{color:#f4728e}
html.p2009 .barre-fin{background:linear-gradient(90deg,#12a48c,#7ad0c0,#f4728e);height:3px;border:0;opacity:.85}
/* bannière aléatoire (src posé en JS), arrondie + ombre douce */
.logo .logo-p2009,.mini-logo.logo-p2009{display:none}
html.p2009 .logo-std,html.p2009 .mini-logo.logo-std{display:none}
html.p2009 .logo .logo-p2009{display:block;width:950px;max-width:96vw;height:auto;margin:0 auto;
  border-radius:14px;box-shadow:0 6px 22px rgba(0,0,0,.14)}
html.p2009 .mini-logo.logo-p2009{display:inline-block;width:16rem;border-radius:10px}
/* ===== thème « Severance » (clé sev ; Vincent 15/08) — l'esthétique Lumon :
   vert menthe glacial, blanc clinique, Helvetica, plaques de porte « COLD HARBOR »
   (titres en capitales espacées sur plaque blanche), vert sombre des cloisons. */
html.sev{--fond:#ccdcd2;--carte:#f2f6f3;--texte:#17211b;--doux:#4a6456;--trait:#a9bfb2;--fort:#1d4033;--texte2:#31473c;--texte3:#17211b;--date:#5c7d70;--carte2:#e3ece6}
html.sev body{background:linear-gradient(180deg,#d3e1d8 0%,#c3d5c9 100%) fixed;
  font-family:'Helvetica Neue',Helvetica,Arial,sans-serif}
/* menu façon signalétique Lumon : capitales espacées */
html.sev .menu a{text-transform:uppercase;letter-spacing:.14em;font-size:.82rem;color:#1d4033;font-weight:600}
html.sev .menu a.on{color:#17211b;border-bottom:2px solid #1d4033}
/* titres de section = plaques de porte (blanc, filet sombre, capitales espacées) */
html.sev .section,html.sev .autres-t,html.sev .fin-t{
  display:inline-block;background:#fbfdfc;border:1.5px solid #17211b;border-radius:3px;
  padding:.3rem .9rem;color:#17211b;text-transform:uppercase;letter-spacing:.2em;
  font-size:.78rem;font-weight:600}
html.sev .cote-bloc h3{background:#fbfdfc;border:1.5px solid #17211b;border-radius:3px;
  padding:.3rem .7rem;color:#17211b;text-transform:uppercase;letter-spacing:.16em;
  font-size:.72rem;font-weight:600;display:inline-block}
/* cartes cliniques : blanc verdâtre, coins presque nets, filet discret */
html.sev .carte,html.sev .cote-bloc,html.sev .appel-modeles,html.sev .canal,
html.sev .grille-autres .carte{background:#f2f6f3;border:1px solid #a9bfb2;border-radius:4px}
html.sev .carte img,html.sev .grille-photos img,html.sev .carte.billet img,
html.sev .grille-autres .carte img{border-radius:3px}
html.sev .carte::before{border-radius:4px}html.sev .carte::after{border-radius:0 4px 0 0}
html.sev h1,html.sev h2,html.sev h3,html.sev .titre-modele{color:#1d4033}
html.sev a{color:#1d4033}
html.sev a:hover{color:#17211b}
html.sev a.carte:hover,html.sev a.carte:hover *{text-decoration:none}
html.sev .modes button.ici{background:#1d4033;color:#f2f6f3}
html.sev .barre-fin{background:#1d4033;height:2px;border:0;opacity:1}
html.sev .badge{background:#1d4033;color:#fff}
/* détails : dates en bleu froid « terminal », survol CRT des vignettes, sélection */
html.sev .date{color:#4a7d8c}
html.sev .grille-photos img:hover,html.sev .carte:hover img{
  filter:saturate(.85) contrast(1.06);box-shadow:0 0 0 2px #9fc6d0,0 0 14px rgba(120,180,195,.55)}
html.sev ::selection{background:#1d4033;color:#e7f2ec}
html.sev .cherche input,html.sev .cherche-blog,html.sev select.langue,html.sev .sel-langue-blog,
html.sev label.tri select{background:#fbfdfc;border:1px solid #17211b;border-radius:3px;color:#17211b}
/* logo Severance (title card) : montré seulement en thème sev */
.logo .logo-sev,.mini-logo.logo-sev{display:none}
html.sev .logo-std,html.sev .mini-logo.logo-std{display:none}
html.sev .logo .logo-sev{display:block;width:21rem;max-width:80vw;height:auto;margin:0 auto;border-radius:6px}
html.sev .mini-logo.logo-sev{display:inline-block;width:9rem;border-radius:4px}
/* ===== thème « Winamp » (clé winamp ; Vincent 15/08) — le skin classique :
   acier sombre bleuté, biseaux gris, barres de titre en dégradé, vert LCD de la
   playlist, or de l'éclair. It really whips the llama's ass. */
html.winamp{--fond:#1a1a24;--carte:#232331;--texte:#d8dbe6;--doux:#8f93a8;--trait:#3c3c52;--fort:#ffbf3f;--texte2:#b8bccc;--texte3:#d8dbe6;--date:#00e05a;--carte2:#1d1d29}
html.winamp body{background:#1a1a24;font-family:Tahoma,Verdana,'Helvetica Neue',sans-serif}
/* barres de titre Winamp : dégradé acier + texte doré, petites capitales */
html.winamp .section,html.winamp .autres-t,html.winamp .fin-t,html.winamp .cote-bloc h3{
  display:block;background:linear-gradient(180deg,#41415c,#26263a);color:#ffbf3f;
  border:1px solid #52526e;border-radius:4px;padding:.32rem .7rem;
  text-transform:uppercase;letter-spacing:.1em;font-size:.74rem;font-weight:700}
/* cartes biseautées façon fenêtre de skin */
html.winamp .carte,html.winamp .cote-bloc,html.winamp .appel-modeles,html.winamp .canal,
html.winamp .grille-autres .carte{background:#232331;border:1px solid #454560;border-radius:6px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.09),0 2px 6px rgba(0,0,0,.4)}
html.winamp h1,html.winamp h2,html.winamp h3,html.winamp .titre-modele{color:#ffbf3f}
html.winamp a{color:#e8b34a}
html.winamp a:hover{color:#ffd24a}
html.winamp a.carte:hover,html.winamp a.carte:hover *{text-decoration:none}
html.winamp .menu a{color:#d8dbe6;font-weight:700}
html.winamp .menu a.on{color:#ffd24a;border-bottom-color:#ffbf3f}
/* la playlist : dates et compteurs en vert LCD monospace */
html.winamp .date{color:#00e05a;font-family:Menlo,Consolas,monospace;font-size:.78rem}
html.winamp .modes button.ici{background:linear-gradient(180deg,#ffd24a,#e8952f);color:#1a1a24;font-weight:700}
html.winamp .barre-fin{background:linear-gradient(90deg,#ffd24a,#f7a832);height:3px;border:0;opacity:1}
html.winamp .badge{background:#f7a832;color:#1a1a24}
html.winamp ::selection{background:#00e05a;color:#0a0a0f}
html.winamp .cherche input,html.winamp .cherche-blog,html.winamp select.langue,
html.winamp .sel-langue-blog,html.winamp label.tri select{
  background:#12121a;border:1px solid #454560;color:#00e05a;font-family:Menlo,Consolas,monospace}
/* logo Winamp (losange éclair + PINGOO or) — montré seulement en thème winamp */
.logo .logo-winamp,.mini-logo.logo-winamp{display:none}
html.winamp .logo-std,html.winamp .mini-logo.logo-std{display:none}
html.winamp .logo .logo-winamp{display:block;width:26rem;max-width:88vw;height:auto;margin:0 auto}
html.winamp .mini-logo.logo-winamp{display:inline-block;width:11rem}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}
body{background:var(--fond);color:var(--texte);font:16px/1.6 -apple-system,'Helvetica Neue',sans-serif}
img,video{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}
a{color:inherit;text-decoration:none}
header{padding:2.2rem 2rem 1.2rem;max-width:1200px;margin:0 auto}
.logo{display:block;line-height:1;text-align:center}
.logo img{width:21rem;max-width:80vw;display:block;margin:0 auto}
header p{color:var(--doux);margin-top:.45rem;font-size:.95rem}
nav.fil{padding:0 2rem;max-width:1200px;margin:0 auto 1rem;color:var(--doux);font-size:.9rem}
nav.fil a:hover{color:var(--texte)}
main{max-width:1200px;margin:0 auto;padding:0 2rem 1rem}
.grille-modeles{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1.2rem}
.carte{background:var(--carte);border-radius:10px;overflow:hidden;transition:transform .18s;position:relative}
.carte:hover{transform:translateY(-3px)}
.carte img{width:100%;aspect-ratio:3/4;object-fit:cover;display:block}
.carte.soon{cursor:default}
.carte.soon:hover{transform:none}
.carte.soon img{filter:grayscale(1) brightness(.55)}
.carte img.floue{filter:blur(22px) saturate(.8);transform:scale(1.12)}
.carte.soon img.floue{filter:blur(22px) grayscale(1) brightness(.55);transform:scale(1.12)}
.carte.soon .badge{position:absolute;top:.8rem;left:50%;transform:translateX(-50%);
 white-space:nowrap;background:rgba(10,10,12,.78);border:1px solid var(--trait);
 color:#e8e6e1;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;
 padding:.35rem .9rem;border-radius:99px}
.carte .infos{padding:.8rem 1rem 1rem}
.carte .infos h2{font-size:1.05rem;font-weight:500}
.carte .coeur{color:var(--fort);font-size:.7em;vertical-align:middle}
.carte .infos p{color:var(--doux);font-size:.85rem}
h2.seance{font-weight:400;margin:2.4rem 0 .3rem;font-size:1.2rem}
h2.seance.grand{font-size:1.75rem;font-weight:500}
h2.seance .lieu{font-size:1.2rem;font-weight:400;color:var(--texte2)}
/* titre d'une page modèle : GRAND et CENTRÉ, police par défaut du site ; cœur
   (modèle « à ♥ ») de la même couleur que le texte (Vincent 11/08) */
.titre-modele{text-align:center;font-size:2.4rem;font-weight:600;
 line-height:1.15;margin:.2rem 0 1.3rem}
.titre-modele .coeur{color:var(--texte);font-size:.5em;vertical-align:middle;
 margin-left:.15em;font-weight:400}
p.sous{color:var(--doux);font-size:.9rem;margin-bottom:.6rem}
.date{color:var(--date)}
p.sous a{text-decoration:underline;text-underline-offset:3px}
p.sous a:hover{color:var(--fort)}
p.descr{color:var(--texte2);font-size:.95rem;max-width:46rem;margin-bottom:1.2rem;
 border-left:2px solid var(--trait);padding-left:1rem;font-style:italic}
h3.section{font-weight:400;color:var(--doux);font-size:.95rem;letter-spacing:.18em;
 text-transform:uppercase;margin:1.8rem 0 .7rem}
p.matos{color:var(--doux);font-size:.88rem;margin:-.3rem 0 .9rem}
p.matos a{text-decoration:underline;text-underline-offset:3px}
p.matos a:hover{color:var(--fort)}
p.liens{display:flex;flex-wrap:wrap;gap:.5rem;margin:-.4rem 0 1.2rem;align-items:center}
p.liens .qui{color:var(--doux);font-size:.9rem;margin-right:.3rem}
p.liens a{font-size:.85rem;color:var(--texte);border:1px solid var(--trait);
 border-radius:99px;padding:.32rem .95rem;background:var(--carte);
 display:inline-flex;align-items:center;gap:.45rem}
p.liens a svg{width:14px;height:14px}
p.liens a:hover{border-color:var(--doux)}
p.liens a.lien-membre{display:none}
html.membre-ok p.liens a.lien-membre{display:inline-flex}
.grille-photos.coulisses{grid-template-columns:repeat(auto-fill,minmax(130px,1fr))}
.grille-photos.coulisses img{filter:saturate(.85)}
.grille-videos{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:.6rem}
.grille-videos video{width:100%;border-radius:6px;background:#000}
.grille-videos .v-wrap,.article .video-locale{position:relative}
.v-full{position:absolute;top:.45rem;right:.45rem;z-index:2;border:0;border-radius:7px;background:rgba(0,0,0,.55);color:#fff;font-size:1.05rem;line-height:1;padding:.4rem .55rem;cursor:pointer;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);opacity:.9}
.v-full:hover{background:rgba(0,0,0,.82);opacity:1}
[dir=rtl] .v-full{right:auto;left:.45rem}
/* bonus/vidéos d'un set LIBRE réservés aux INSCRITS : le contenu sous le voile
   est déjà un vrai fichier flou ; le voile ajoute l'invite + capte les clics vers
   la page d'inscription. Retiré (display:none) pour les inscrits via .inscrit-ok. */
.bloc-inscrit{position:relative}
.voile-inscrit{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
 text-align:center;padding:1rem;background:rgba(20,18,16,.28);color:#fff;font-size:.9rem;
 font-weight:500;letter-spacing:.01em;text-decoration:none;border-radius:8px;
 -webkit-backdrop-filter:blur(1.5px);backdrop-filter:blur(1.5px)}
.voile-inscrit span{max-width:22rem;line-height:1.5;text-shadow:0 1px 8px rgba(0,0,0,.6)}
.voile-inscrit:hover{background:rgba(20,18,16,.4)}
html.inscrit-ok .voile-inscrit{display:none}
.autres-t{margin-top:2.2rem}
.grille-autres{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:.55rem}
.grille-autres .carte{border-radius:8px;overflow:hidden}
.grille-autres .carte img{width:100%;aspect-ratio:3/4;object-fit:cover;display:block}
.grille-autres .mini-cap{padding:.3rem .4rem .15rem;font-size:.72rem;line-height:1.25;color:var(--texte2)}
.grille-autres .mini-cap .d{color:var(--date)}
.grille-autres .carte::after{font-size:.82rem;width:auto;height:auto;padding:.1rem .32rem;border-radius:0 8px 0 8px}
.grille-autres .carte.soon .badge{font-size:.58rem;padding:.15rem .45rem;top:.4rem;letter-spacing:0}
.grille-photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:.55rem}
.grille-photos img{width:100%;aspect-ratio:1;object-fit:cover;display:block;border-radius:6px;cursor:zoom-in;transition:opacity .15s}
.grille-photos img:focus-visible{outline:3px solid var(--fort);outline-offset:2px}
.astuce-swipe{display:none;position:fixed;left:50%;bottom:calc(1.5rem + env(safe-area-inset-bottom,0));transform:translateX(-50%);z-index:6;background:rgba(0,0,0,.62);color:#fff;font-size:.8rem;padding:.5rem 1.1rem;border-radius:14px;pointer-events:none;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);text-align:center;line-height:1.7;white-space:nowrap;opacity:0;max-width:92vw}
@media (hover:none) and (pointer:coarse){#voile.ouvert .astuce-swipe{display:block}}
#voile.ouvert .astuce-swipe.m{animation:astuceSwipe 3.2s ease forwards}
@keyframes astuceSwipe{0%{opacity:0;transform:translateX(-50%) translateY(8px)}12%{opacity:1;transform:translateX(-50%) translateY(0)}70%{opacity:1}100%{opacity:0}}
.grille-photos img:hover{opacity:.82}
#voile{position:fixed;inset:0;background:rgba(8,8,10,.97);display:none;z-index:10;
 align-items:center;justify-content:center;flex-direction:column}
#voile.ouvert{display:flex}
/* carte de fin de carrousel (autres shootings / autres modèles) */
#fincarte{display:none;position:absolute;inset:0;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:4.4rem 1rem 2.4rem;z-index:4}
#voile.fin #fincarte{display:block}
#voile.fin .zone{pointer-events:none}
#voile.fin .astuce-swipe{display:none}
#fincarte .fin-t{color:#fff;text-align:center;font-size:1.12rem;font-weight:500;margin:.2rem 0 1.15rem;text-shadow:0 1px 8px rgba(0,0,0,.5)}
#fincarte .grille-autres{max-width:620px;margin:0 auto}
#fincarte .carte{background:rgba(255,255,255,.06)}
#fincarte .mini-cap{color:#e8e8e8}
#fincarte .mini-cap .d{color:#b3b3b3}
#fincarte .fin-retour{display:block;text-align:center;max-width:620px;margin:1.5rem auto 0;color:#cfcfcf;font-size:.92rem;text-decoration:none}
#fincarte .fin-retour:hover{color:#fff;text-decoration:underline}
#voile img{max-width:94vw;max-height:88vh;object-fit:contain}
/* le voile est TOUJOURS sombre → couleurs FIXES claires (pas var(--fort) qui,
   en thème clair, est sombre et fait « disparaître » au survol). Survol discret
   = blanc 72 % → blanc pur. Le compteur (#cpt) n'est pas cliquable : pas de
   curseur ni de changement au survol. */
#voile .barre{position:fixed;top:1rem;right:1.4rem;display:flex;gap:1.1rem;align-items:center;color:rgba(255,255,255,.72);font-size:1.15rem;z-index:12}
#voile .barre span{padding:.4rem .6rem}
#voile #cpt{cursor:default}
#voile #fermer{cursor:pointer;transition:color .15s}
#voile #fermer:hover{color:#fff}
#voile .barre a#wall{display:none;font-size:.8rem;color:rgba(255,255,255,.72);padding:.4rem .2rem;letter-spacing:.01em;transition:color .15s}
#voile .barre a#wall:hover{color:#fff}
#voile .zone{position:fixed;top:5rem;bottom:0;width:34%;cursor:pointer}
#voile .zone.g{left:0}#voile .zone.d{right:0}
/* mobile : zones latérales étroites → large centre pour le double-tap zoom.
   Zoomé : les zones ne captent plus le toucher (on peut déplacer librement). */
@media (hover:none) and (pointer:coarse){#voile .zone{width:19%}}
#voile.zoome .zone{pointer-events:none}
#voile .fleche{position:fixed;top:50%;transform:translateY(-50%);z-index:11;
 font-size:2.6rem;color:rgba(255,255,255,.72);cursor:pointer;padding:1.2rem .9rem;
 user-select:none;line-height:1;transition:color .15s}
#voile .fleche:hover{color:#fff}
#voile .fleche.g{left:.4rem}#voile .fleche.d{right:.4rem}
@media(max-width:600px){#voile .fleche{font-size:2rem;padding:1rem .5rem}}
.cherche{margin:0 0 1.4rem;position:relative;text-align:center}
.ligne-vues{display:flex;align-items:center;gap:.7rem;justify-content:center;margin-bottom:.7rem;flex-wrap:wrap}
.barre-bloc{margin:1.2rem auto}
.ligne-vign{display:flex;align-items:center;gap:.45rem;justify-content:center;margin-top:.7rem}
.ligne-vues .modes button{padding:.35rem .7rem}
.ligne-cherche{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap;justify-content:center}
.ligne-cherche input{flex:0 1 auto;width:16.5rem;max-width:82vw}
label.tri{display:inline-flex;align-items:center;gap:.4rem;white-space:nowrap}
label.tri select{background:var(--carte);color:var(--texte);border:1px solid var(--trait);
 border-radius:8px;padding:.35rem .6rem;font-size:.85rem;cursor:pointer;appearance:none;-webkit-appearance:none}
label.tri select:hover{border-color:var(--doux)}
.cherche input{width:100%;max-width:30rem;background:var(--carte);border:1px solid var(--trait);
 border-radius:99px;padding:.6rem 1.2rem;color:var(--texte);font-size:16px;outline:none}
.cherche input:focus{border-color:var(--doux)}
.contact-tete{display:flex;align-items:center;gap:1.4rem;margin:0 auto 1.5rem;max-width:46rem}
.contact-tete .moi{width:9.5rem;border-radius:16px;flex-shrink:0}
@media(max-width:600px){.contact-tete{flex-direction:column;align-items:flex-start}
.contact-tete .moi{align-self:center}
.contact-tete .moi{width:8rem;border-radius:50%;aspect-ratio:1;object-fit:cover}}
.appel-modeles{background:var(--carte);border:1px solid var(--trait);border-radius:12px;
 padding:1rem 1.3rem;margin:0 auto 1.6rem;max-width:46rem;font-size:.98rem;line-height:1.55}
.grille-contact{display:grid;grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));
 gap:.8rem;max-width:52rem;margin:0 auto 1.6rem}
.canal{display:flex;align-items:center;gap:.8rem;background:var(--carte);
 border:1px solid var(--trait);border-radius:12px;padding:.85rem 1rem;transition:border-color .15s}
.canal:hover{border-color:var(--doux)}
.canal svg{width:22px;height:22px;flex-shrink:0;color:var(--doux)}
.canal .c-nom{font-weight:600}
.canal .c-id{color:var(--doux);font-size:.85rem;margin-left:auto;min-width:0;
 overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
footer{text-align:center;color:var(--doux);font-size:.8rem;padding:2rem}
.findepage{text-align:center;margin-top:1.2rem}
.barre-fin{border:none;height:1px;max-width:520px;margin:0 auto 1.8rem;
 background:linear-gradient(90deg,transparent,var(--doux),transparent);opacity:.5}
.mini-logo{width:8.5rem;opacity:.55;transition:opacity .2s}
.mini-logo:hover{opacity:.9}
footer.suivre{padding:1.2rem 2rem .2rem;font-size:.9rem}
footer.suivre a{color:var(--texte);text-decoration:underline;text-underline-offset:3px}
footer.suivre .ligne-contact{display:inline-block;margin-top:.55rem}
footer.suivre a:hover{color:var(--fort)}
@media(max-width:600px){header,main,nav.fil,.retour-blog-l{padding-left:1rem;padding-right:1rem}
.sousligne{justify-content:flex-start}
.sousligne .grp:last-child{margin-left:auto}
.tri .chlangue{display:none}
.ligne-vues .modes{display:flex}
.logo{display:block;text-align:center}
.logo img{margin:0 auto}
.grille-modeles{grid-template-columns:repeat(3,1fr);gap:.5rem}
.grille-modeles.listing-sets{grid-template-columns:repeat(2,1fr);gap:.7rem}
/* badge « bientôt disponible » : dans les grilles home en 3 COLONNES (À venir,
   modèles soon), la carte est trop étroite pour le badge sur une ligne → il était
   coupé (Vincent 12/08). On le laisse passer sur 2 lignes, plus petit. N'affecte
   PAS les pages modèle (2 col, .listing-sets) ni le desktop. */
.grille-modeles:not(.listing-sets) .carte.soon .badge{white-space:normal;
 font-size:.6rem;letter-spacing:.03em;padding:.2rem .5rem;top:.45rem;
 max-width:calc(100% - .7rem);line-height:1.15}
.carte .infos{padding:.4rem .5rem .55rem}
.carte .infos h2{font-size:.82rem}
.carte .infos p{font-size:.62rem}}

.grille-billets{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1.2rem}
/* home blog : grille d'articles + colonne de droite */
.blog-home{display:grid;grid-template-columns:minmax(0,1fr) 20rem;gap:2rem;align-items:start}
.blog-main{min-width:0}
.blog-cote{display:flex;flex-direction:column;gap:1.1rem}
.cote-bloc{background:var(--carte);border:1px solid var(--trait);border-radius:12px;padding:.9rem 1rem}
.cote-bloc h3{font-size:.92rem;font-weight:600;margin:0 0 .6rem;color:var(--doux)}
.cherche-blog{width:100%;box-sizing:border-box;font-size:16px;padding:.5rem .7rem;border:1px solid var(--trait);border-radius:8px;background:var(--fond);color:var(--texte)}
.cherche-res{margin-top:.5rem;display:flex;flex-direction:column;gap:.05rem;max-height:15rem;overflow:auto}
.cherche-res a{font-size:.84rem;color:var(--texte2);text-decoration:none;padding:.32rem .3rem;border-radius:6px;line-height:1.3}
.cherche-res a:hover{background:var(--carte2);color:var(--texte)}
.derniers-wrap{display:flex;flex-direction:column;gap:.85rem}
.d-titre{font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;color:var(--doux)}
a.d-titre{text-decoration:none;display:inline-block}
a.d-titre:hover{color:var(--texte);text-decoration:underline}
.d-liste{list-style:none;margin:.35rem 0 0;padding:0;display:flex;flex-direction:column;gap:.5rem}
.d-liste a{display:flex;gap:.55rem;align-items:center;text-decoration:none;color:var(--doux);font-size:.82rem;line-height:1.25}
.d-liste a:hover{color:var(--texte)}
.d-liste img{width:3.4rem;height:2.2rem;object-fit:cover;border-radius:5px;flex:none}
.cote-social{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}
.soc{display:flex;align-items:center;justify-content:center;padding:.55rem;border-radius:9px;text-decoration:none;font-size:.85rem;font-weight:600;color:#fff;transition:transform .1s ease,filter .15s}
.soc:hover{filter:brightness(1.1);transform:translateY(-1px)}
.soc.ig{background:linear-gradient(45deg,#f9ce34,#ee2a7b 55%,#6228d7)}
.soc.x{background:#0f1419}
.soc.pat{background:#f96854}
.soc.tt{background:#111;box-shadow:inset 2px 0 0 #25f4ee,inset -2px 0 0 #fe2c55}
.cote-tg,.cote-contact,.cote-matos{display:block;text-align:center;font-weight:500;color:var(--doux);text-decoration:none}
.cote-tg:hover,.cote-contact:hover,.cote-matos:hover{color:var(--fort)}
/* la home blog a son sélecteur de langue dans la colonne → masquer le doublon du header */
body:has(.blog-home) .coin-langue{display:none}
.sel-langue-blog{width:100%;box-sizing:border-box;font-size:.9rem;padding:.45rem;border:1px solid var(--trait);border-radius:8px;background:var(--fond);color:var(--texte);cursor:pointer}
@media(max-width:820px){.blog-home{grid-template-columns:1fr}.blog-cote{position:static}}
/* Panic mode : bouton 😱 + faux tableur Excel plein écran (boss key) */
.coin-gauche #panic{cursor:pointer;text-decoration:none;font-size:.72rem;color:var(--doux);line-height:1;margin-left:.5rem;vertical-align:middle;white-space:nowrap}
.coin-gauche #panic:hover{color:var(--texte)}
#faux-excel{display:none;position:fixed;inset:0;z-index:99999;background:#fff;color:#000;font:12px/1.4 'Segoe UI',Calibri,Arial,sans-serif;overflow:auto;-webkit-text-size-adjust:100%}
#faux-excel .xl-ruban{background:#217346;color:#fff;padding:.45rem .9rem;display:flex;gap:1.25rem;align-items:center;font-size:13px;flex-wrap:wrap}
#faux-excel .xl-ruban b{font-weight:600}
#faux-excel .xl-onglets{background:#f3f2f1;border-bottom:1px solid #d0cfce;padding:.3rem .9rem;display:flex;gap:1.1rem;color:#555}
#faux-excel .xl-onglets .actif{color:#217346;font-weight:600;border-bottom:2px solid #217346}
#faux-excel .xl-formule{display:flex;align-items:center;gap:.6rem;padding:.28rem .9rem;border-bottom:1px solid #d0cfce;color:#333}
#faux-excel .xl-formule .nom-case{border:1px solid #d0cfce;padding:.12rem .7rem;min-width:2.6rem;text-align:center;background:#fff}
#faux-excel table{border-collapse:collapse;width:100%;table-layout:auto;background:#fff}
#faux-excel th,#faux-excel td{border:1px solid #dcdcdc;padding:.1rem .45rem;height:1.45rem;overflow:hidden;white-space:nowrap;text-align:left;font-weight:400}
#faux-excel thead th,#faux-excel td.xl-rownum{background:#f3f2f1;color:#777;text-align:center;font-weight:600}
#faux-excel td.num{text-align:right;font-variant-numeric:tabular-nums}
#faux-excel .barre-etat{position:sticky;bottom:0;background:#217346;color:#fff;padding:.25rem .9rem;font-size:11px;display:flex;gap:1.3rem;justify-content:flex-end;flex-wrap:wrap}
.carte.billet img{aspect-ratio:16/10;object-fit:cover}
/* teaser d'un test publié ailleurs (Korben, Mac4ever…) : pastille (10/08) */
.carte.billet{position:relative}
.tag-test,.tag-shooting{position:absolute;top:.55rem;left:.55rem;z-index:1;
 background:rgba(20,20,24,.82);color:#fff;font-size:.72rem;font-weight:500;
 padding:.2rem .55rem;border-radius:99px;backdrop-filter:blur(3px);
 letter-spacing:.02em;max-width:calc(100% - 1.1rem);overflow:hidden;
 text-overflow:ellipsis;white-space:nowrap}
.tag-shooting{background:rgba(95,158,95,.92)}   /* vert = shooting photo */
a.src-test{display:inline-block;margin-left:.7rem;font-size:.82rem;
 background:var(--carte2);color:var(--doux);border:1px solid var(--trait);
 border-radius:99px;padding:.15rem .7rem;text-decoration:none;vertical-align:middle}
a.src-test:hover{color:var(--texte);border-color:var(--doux)}
.carte.billet .sans-image{aspect-ratio:16/10;display:flex;align-items:center;
 justify-content:center;font-size:2.4rem;color:var(--doux);background:var(--carte2)}
.carte.billet .infos h2{font-size:1.08rem;font-weight:500;line-height:1.35}
.carte.billet .date{font-size:.8rem;margin:.25rem 0 .45rem}
.carte.billet .extrait{color:var(--doux);font-size:.88rem;line-height:1.5}
nav.pages-blog{margin:2rem 0 1rem;text-align:center;font-size:.95rem}
nav.pages-blog a,nav.pages-blog .ici{display:inline-block;min-width:2.2rem;
 padding:.35rem .5rem;border-radius:8px;border:1px solid var(--trait);margin:0 .15rem}
nav.pages-blog a:hover{border-color:var(--doux)}
nav.pages-blog .ici{background:var(--carte);color:var(--fort);border-color:var(--doux)}
nav.pages-blog .ell{display:inline-block;min-width:1.4rem;color:var(--doux);margin:0 .1rem}
nav.pages-blog a.fleche{font-size:1.05rem;line-height:1}
.article{max-width:46rem;margin:0 auto}
.article p{margin:0 0 1.05rem;color:var(--texte3)}
.article h2{font-size:1.35rem;font-weight:500;margin:1.9rem 0 .8rem}
.article ul{margin:0 0 1.05rem;padding-left:1.4rem;color:var(--texte3)}
.article li{margin-bottom:.35rem}
.article blockquote{border-left:2px solid var(--trait);padding-left:1rem;
 color:var(--doux);font-style:italic;margin:0 0 1.05rem}
.article blockquote.tiktok-embed{border:0;padding:0;margin:1.4rem auto;font-style:normal}
.article a{text-decoration:underline;text-underline-offset:3px}
.article a:hover{color:var(--fort)}
.article figure{margin:1.4rem 0}
.article figure img{max-width:100%;border-radius:8px;display:block;margin:0 auto}
/* visuel PRINCIPAL (1re figure) : bannière rectangulaire uniforme, moins haute */
.article figure:first-of-type{margin:1.1rem 0 1.6rem}
.article figure:first-of-type img{width:100%;aspect-ratio:16/9;object-fit:cover;max-height:23rem}
/* images inline : jamais démesurées en hauteur (gardent leur ratio, centrées) */
.article figure:not(:first-of-type) img{max-height:28rem;width:auto}
.article figcaption{color:var(--doux);font-size:.85rem;margin-top:.45rem;text-align:center}
.article .video-cadre{position:relative;aspect-ratio:16/9;margin:1.4rem 0}
.article .video-cadre iframe{position:absolute;inset:0;width:100%;height:100%;
 border:0;border-radius:8px;background:#000}
.article .video-locale video{width:100%;border-radius:8px;background:#000;display:block}
p.retour-blog{max-width:46rem;margin:2rem auto 1rem}
.article .signature{margin-top:1.8rem;color:var(--doux);font-size:.92rem;font-style:italic}
.nav-articles{display:flex;justify-content:space-between;gap:1rem;margin-top:1.6rem;
 padding-top:1rem;border-top:1px solid var(--trait);font-size:.9rem}
.nav-articles a{color:var(--doux)}.nav-articles a:hover{color:var(--texte)}
.nav-articles .nav-suiv{margin-left:auto}
.article .signature a{color:var(--texte);text-decoration:underline;text-underline-offset:3px;font-style:normal}
/* boutons de partage en fin d'article (15/08) */
.partage{display:flex;flex-wrap:wrap;align-items:center;gap:.45rem;margin-top:1.1rem}
.partage .p-lbl{color:var(--doux);font-size:.85rem;margin-right:.15rem}
.partage a{font-size:.8rem;color:var(--texte);border:1px solid var(--trait);border-radius:99px;
 padding:.28rem .8rem;background:var(--carte);text-decoration:none}
.partage a:hover{border-color:var(--doux)}
p.retour-blog a{color:var(--doux)}
p.retour-blog a:hover{color:var(--fort)}
/* la page « membres » : colonne centrée */
.page-membre{max-width:46rem;margin:0 auto}
.bloc-connexion{background:var(--carte);border:1px solid var(--trait);border-radius:12px;
 padding:1.1rem 1.3rem;margin:0 0 1.6rem}
.bloc-connexion.deja{border-color:#9fd49b}
.co-lbl{font-weight:600;font-size:1rem;margin:0 0 .7rem}
/* « Ou avec un simple e-mail » : trait AU-DESSUS seulement (Vincent 14/08) */
.co-sous{color:var(--texte);font-size:.9rem;border-top:1px solid var(--trait);padding:.6rem 0 0;margin:1rem 0 .5rem}
/* colonne gauche : phrase d'avantage sous un trait ; colonne droite : trait sous la note */
.co-desc{color:var(--doux);font-size:.88rem;line-height:1.5;border-top:1px solid var(--trait);padding-top:.85rem;margin-top:.9rem}
.co-note{border-bottom:1px solid var(--trait);padding-bottom:.9rem;margin-bottom:.2rem}
.co-relier{font-size:.82rem;font-style:italic;margin:.5rem 0 0}
.co-relier a{color:var(--doux);text-decoration:underline;text-underline-offset:2px}
/* connexion en 2 colonnes (cellules blanches) : Premium (gauche) / Gratuit (droite) */
.co-intro{font-weight:600;font-size:1.5rem;text-align:center;margin:0 0 1.1rem}
.co-colonnes{display:grid;grid-template-columns:1fr 1fr;gap:1rem;align-items:stretch}
@media(max-width:560px){.co-colonnes{grid-template-columns:1fr}}
.co-col{background:var(--carte);border:1px solid var(--trait);border-radius:12px;padding:1.2rem 1.3rem;text-align:center;display:flex;flex-direction:column}
.co-col.premium{border:2px solid #e3b84e}   /* liseret doré autour de la cellule Premium */
/* photo qui remplit le bas de la colonne Premium pour égaliser les hauteurs (Vincent 14/08) */
.co-photo{margin-top:auto;flex:1 1 auto;min-height:7rem;overflow:hidden;border-radius:8px}
.co-photo img{width:100%;height:100%;object-fit:cover;display:block}
@media(max-width:560px){.co-photo{min-height:9rem}}
.co-col .bm-btn{text-decoration:none}
.co-col .co-form{justify-content:center}
.co-oauth{display:flex;gap:.5rem;flex-wrap:wrap;margin:.2rem 0 0}
.co-form{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center;margin-top:.2rem}
.co-form input{flex:1;min-width:10rem;padding:.5rem .8rem;border-radius:8px;
 border:1px solid var(--trait);background:var(--fond);color:var(--texte);
 font-size:.9rem;outline:none}
.co-form input:focus{border-color:#e3b84e}
.bandeau-membre{background:var(--carte);border:1px solid #e3b84e;border-radius:12px;
 padding:1.1rem 1.3rem;margin:0 auto 1.3rem;max-width:34rem;text-align:center}
.bm-titre{font-size:1rem;margin-bottom:.75rem}
.bm-actions{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:.9rem;justify-content:center}
.bm-btn{border:1px solid var(--trait);border-radius:99px;padding:.42rem 1.1rem;
 font-size:.9rem;background:none;color:var(--texte);cursor:pointer}
.bm-btn:hover{border-color:var(--doux)}
.bm-btn.abo{background:var(--texte);color:var(--fond);border-color:var(--texte);font-weight:500}
.bm-code{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center;justify-content:center;
 border-top:1px solid var(--trait);padding-top:.9rem}
.bm-code input[type=text]{flex:1;min-width:9rem;background:var(--fond);
 border:1px solid var(--trait);border-radius:99px;color:var(--texte);
 padding:.42rem 1rem;font-size:.9rem;outline:none}
.bm-code input[type=text]:focus{border-color:#e3b84e}
/* la page « Devenir membre » du blog (10/08/2026) */
.grille-chiffres{display:grid;grid-template-columns:repeat(auto-fit,minmax(8.2rem,1fr));
 gap:.9rem;margin:1.5rem 0;max-width:46rem}
.chiffre{background:var(--carte);border:1px solid var(--trait);border-radius:12px;
 padding:1rem .6rem;text-align:center}
.chiffre b{display:block;font-size:1.85rem;font-weight:600;color:#e3b84e}
.chiffre span{font-size:.78rem;color:var(--doux);letter-spacing:.03em}
.gains-t{font-size:1.02rem;margin:1.7rem 0 .4rem}
.liste-gains{list-style:none;padding:0;margin:.4rem 0;max-width:46rem}
.liste-gains li{background:var(--carte);border:1px solid var(--trait);
 border-radius:12px;padding:.8rem 1.05rem;margin:.55rem 0;line-height:1.5}
/* tableau comparatif de la page membres */
.tab-wrap{overflow-x:auto;max-width:46rem;margin:.4rem 0 1.2rem}
table.compare{width:100%;border-collapse:collapse;font-size:.92rem}
table.compare th,table.compare td{padding:.55rem .5rem;border-bottom:1px solid var(--trait);
 text-align:center;vertical-align:middle}
table.compare thead th{font-weight:600;color:var(--texte);white-space:nowrap}
table.compare tbody th{text-align:left;font-weight:400;color:var(--texte2);padding-right:.9rem}
[dir=rtl] table.compare tbody th{text-align:right;padding-right:.5rem;padding-left:.9rem}
table.compare .oui{color:var(--fort);font-weight:700}
table.compare .non{color:var(--doux)}
table.compare .col-abo{background:var(--carte)}
.etapes{margin:.4rem 0 0 1.2rem;padding:0;max-width:44rem}
.etapes li{margin:.6rem 0;line-height:1.55}
[dir=rtl] .etapes{margin:.4rem 1.2rem 0 0}
.boutons-membre{display:flex;gap:.7rem;flex-wrap:wrap;margin:1.7rem 0 .4rem}
.boutons-membre .bm-btn{text-decoration:none}
/* page teaser d'un article réservé aux membres (apercu.html) : le début visible,
   fondu vers le fond, puis le mur d'abonnement */
.gate-fade{position:relative;max-height:22rem;overflow:hidden}
.gate-fade::after{content:"";position:absolute;left:0;right:0;bottom:0;height:9rem;
 background:linear-gradient(transparent,var(--fond));pointer-events:none}
.gate-art{margin:-2rem 0 1.6rem;position:relative;z-index:1;padding:1.5rem 1.6rem;
 border:2px solid #e3b84e;border-radius:12px;background:var(--carte2);text-align:center}
.gate-art h3{margin-bottom:.5rem}
.gate-art .bm-btn{display:inline-block;margin-top:.9rem;text-decoration:none}
/* variante « connecté en gratuit » : réservé aux abonnés PAYANTS Patreon.
   Par défaut (anonyme) on montre .gate-anon ; un inscrit (gratuit ou +) voit .gate-inscrit. */
.gate-inscrit{display:none}
html.inscrit-ok .gate-anon{display:none}
html.inscrit-ok .gate-inscrit{display:block}
.gate-inscrit p{margin-bottom:.2rem}
/* page /membres/ adaptative : un hero par état de connexion (Vincent 14/08) */
.etat-gratuit,.etat-premium{display:none}
html.inscrit-ok .etat-visiteur{display:none}
html.inscrit-ok:not(.membre-ok) .etat-gratuit{display:block}
html.membre-ok .etat-premium{display:block}
html.inscrit-ok .visiteurs-only{display:none}
.bloc-etat{background:var(--carte);border:1px solid var(--trait);border-radius:12px;padding:1.2rem 1.4rem;margin-bottom:1.3rem}
.pourquoi-membre{color:var(--doux);font-size:.85rem;text-align:center;margin-top:1.1rem}
/* la passerelle « d'autres shootings sont réservés » ne se montre pas aux
   membres payants (classe posée par le JS via /membre/etat) */
.membre-ok p.decouvre{display:none}
.grille-apercu{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:.55rem}
.grille-apercu img{width:100%;aspect-ratio:1;object-fit:cover;display:block;border-radius:6px}
.grille-apercu a{display:block;position:relative}
.grille-apercu a:hover img{opacity:.85}
.grille-apercu a::after{content:"🔒";position:absolute;top:0;right:0;
 width:2.3rem;height:2.3rem;font-size:.7rem;line-height:1;
 display:flex;align-items:flex-start;justify-content:flex-end;
 padding:.22rem .26rem 0 0;box-sizing:border-box;
 background:linear-gradient(135deg,#f7dd8f 0%,#e3b84e 55%,#b9862a 100%);
 clip-path:polygon(0 0,100% 0,100% 100%);border-radius:0 6px 0 0;
 box-shadow:-1px 1px 4px rgba(0,0,0,.35)}
[dir=rtl] .grille-apercu a::after{right:auto;left:0;
 clip-path:polygon(0 0,100% 0,0 100%);border-radius:6px 0 0 0;
 justify-content:flex-start;padding:.22rem 0 0 .26rem}
.carte.membre::after,.carte.g-membre::after{content:"🔒";position:absolute;top:0;right:0;
 width:2.3rem;height:2.3rem;font-size:.7rem;line-height:1;
 display:flex;align-items:flex-start;justify-content:flex-end;
 padding:.22rem .26rem 0 0;box-sizing:border-box;
 background:linear-gradient(135deg,#f7dd8f 0%,#e3b84e 55%,#b9862a 100%);
 clip-path:polygon(0 0,100% 0,100% 100%);border-radius:0 10px 0 0;
 box-shadow:-1px 1px 4px rgba(0,0,0,.35);z-index:1}
[dir=rtl] .carte.membre::after,[dir=rtl] .carte.g-membre::after{right:auto;left:0;
 clip-path:polygon(0 0,100% 0,0 100%);border-radius:10px 0 0 0;
 justify-content:flex-start;padding:.22rem 0 0 .26rem}
/* membre connecté : même coin doré mais CADENAS OUVERT = débloqué,
   + liseret doré (les deux essais de Vincent, 09/08) */
html.membre-ok .carte.membre::after,html.membre-ok .carte.g-membre::after{content:"⭐"}
.carte.membre::before{content:"";position:absolute;inset:0;
 border:2px solid #e3b84e;border-radius:10px;pointer-events:none;z-index:1}
/* sets GRATUITS pour tous : liseret vert clair + coin cadeau (09/08) */
.carte.libre::before{content:"";position:absolute;inset:0;
 border:2px solid #9fd49b;border-radius:10px;pointer-events:none;z-index:1}
.carte.libre::after,.carte.g-libre::after{content:"👁️";position:absolute;top:0;right:0;
 width:2.3rem;height:2.3rem;font-size:.7rem;line-height:1;
 display:flex;align-items:flex-start;justify-content:flex-end;
 padding:.22rem .26rem 0 0;box-sizing:border-box;
 background:linear-gradient(135deg,#d9f2cf 0%,#9fd49b 55%,#5f9e5f 100%);
 clip-path:polygon(0 0,100% 0,100% 100%);border-radius:0 10px 0 0;
 box-shadow:-1px 1px 4px rgba(0,0,0,.35);z-index:1}
[dir=rtl] .carte.libre::after,[dir=rtl] .carte.g-libre::after{right:auto;left:0;
 clip-path:polygon(0 0,100% 0,0 100%);border-radius:10px 0 0 0;
 justify-content:flex-start;padding:.22rem 0 0 .26rem}
/* « à venir » (soon) : liseret noir, sans coin (09/08) */
.carte.soon::before{content:"";position:absolute;inset:0;
 border:2px solid #000;border-radius:10px;pointer-events:none;z-index:1}
/* « Par modèles » : liseret NEUTRE, sans coin d'accès (Vincent 11/08) — le code
   couleur vert/doré ne s'affiche qu'en « Par shooting » (1 carte = 1 séance),
   pour ne plus dérouter avec un même visuel qui change de couleur entre vues. */
.carte.g-modele::before{content:"";position:absolute;inset:0;
 border:1px solid var(--trait);border-radius:10px;pointer-events:none;z-index:1}
/* page d'un set membre (vue par un membre) : marqueur « débloqué » subtil */
h2.seance .deb{font-size:.55em;vertical-align:middle;opacity:.9}
p.descr.or{border-left-color:#e3b84e}
[dir=rtl] p.descr.or{border-left-color:var(--trait);border-right-color:#e3b84e}
p.descr.vert{border-left-color:#9fd49b}
[dir=rtl] p.descr.vert{border-left-color:var(--trait);border-right-color:#9fd49b}
/* le coin haut-droit : décompte du code + lien de connexion, discrets */
.coin-haut{position:absolute;top:.55rem;right:.9rem;display:flex;gap:.35rem;
 align-items:center;font-size:.72rem;color:var(--doux);
 letter-spacing:.04em;z-index:5;max-width:96vw;flex-wrap:wrap;justify-content:flex-end}
.coin-haut a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.coin-haut a:hover{color:var(--texte)}
.coin-haut a.pourquoi{text-decoration:none;opacity:.7;font-size:.66rem;margin-left:0}
.coin-haut a.pourquoi:hover{opacity:1}
[dir=rtl] .coin-haut{right:auto;left:.9rem}
/* le toggle jour/nuit vit seul en haut à GAUCHE (Vincent 09/08) */
.coin-gauche{position:absolute;top:.55rem;left:.9rem;z-index:5;
 font-size:.72rem;color:var(--doux);letter-spacing:.04em}
.coin-gauche a.tg-theme{color:inherit;text-decoration:none}
.coin-gauche a.tg-theme:hover{color:var(--texte)}
.coin-gauche .sel-theme{font-family:inherit;font-size:.72rem;color:var(--doux);background:var(--carte);border:1px solid var(--trait);border-radius:8px;padding:.2rem .35rem;cursor:pointer;max-width:10rem}
.coin-gauche .sel-theme:hover{color:var(--texte);border-color:var(--doux)}
[dir=rtl] .coin-gauche{left:auto;right:.9rem}
/* barre de header unifiée : thème + Boss Key à gauche, connexion à droite,
   fond légèrement différent (Vincent 12/08) */
.topbar{display:flex;align-items:center;justify-content:space-between;gap:.5rem .9rem;flex-wrap:wrap;padding:.5rem .95rem;background:var(--carte2);border-bottom:1px solid var(--trait)}
/* « retour au blog » : inséré (via JS) juste au-dessus du fil d'ariane, seulement si on vient du blog.
   Le wrapper reprend la MÊME colonne que nav.fil pour un alignement parfait à gauche du fil. */
.retour-blog-l{max-width:1200px;margin:0 auto;padding:0 2rem}
.retour-blog{display:inline-block;margin:.2rem 0 .5rem;background:var(--carte2);border:1px solid var(--trait);color:var(--texte);padding:.38rem .85rem;border-radius:99px;text-decoration:none;font-size:.82rem}
.retour-blog:hover{border-color:var(--doux);color:var(--fort)}
.topbar .coin-gauche,.topbar .coin-haut{position:static;top:auto;left:auto;right:auto;max-width:none}
.topbar .coin-gauche{display:flex;align-items:center;gap:.55rem}
.topbar .coin-haut{margin:0}
/* stats admin dans le mini-header (posé par JS via /membre/etat, admin seulement).
   Desktop : visible. Mobile : uniquement s'il y a la place (paysage), sinon masqué. */
.topstats{display:inline-flex;align-items:center;gap:.4rem;font-size:.74rem;color:var(--texte2);text-decoration:none;white-space:nowrap;font-variant-numeric:tabular-nums;letter-spacing:.02em;margin-right:.2rem}
.topstats:hover{color:var(--fort)}
.topstats .pt{color:#e0956b;font-size:1.05em;line-height:1}
.coin-haut a.topstats{text-decoration:none}
@media(max-width:560px){.topstats{display:none}}
/* sans session : le mode Adulte est verrouillé (grisé, infobulle) — le
   toggle est réservé aux CONNECTÉS, même sans abonnement (Vincent 09/08) */
.mode.off-nsfw{opacity:.45;cursor:not-allowed}
#bulle-nsfw{position:fixed;top:1rem;left:50%;transform:translateX(-50%);
 background:var(--carte);border:1px solid #e3b84e;border-radius:99px;
 padding:.55rem 1.3rem;font-size:.85rem;z-index:99;white-space:nowrap;
 max-width:92vw;overflow:hidden;text-overflow:ellipsis;
 box-shadow:0 4px 18px rgba(0,0,0,.5)}
#bulle-nsfw:hover{border-color:#f7dd8f}
nav.voisins{display:flex;justify-content:space-between;gap:1rem;margin:2.2rem 0 .4rem;
 color:var(--doux);font-size:.92rem}
nav.voisins a:hover{color:var(--texte)}
p.decouvre{color:var(--doux);font-size:.88rem;margin:1.4rem 0 .3rem}
p.decouvre a{text-decoration:underline;text-underline-offset:3px}
p.decouvre a:hover{color:var(--texte)}
#haut{position:fixed;bottom:1.2rem;right:1.2rem;width:2.7rem;height:2.7rem;
 border-radius:50%;background:var(--carte);border:1px solid var(--trait);
 color:var(--texte);font-size:1.15rem;opacity:0;pointer-events:none;
 transition:opacity .25s;z-index:50;cursor:pointer}
#haut.vu{opacity:.92;pointer-events:auto}
#haut:hover{border-color:var(--doux)}
[dir=rtl] #haut{right:auto;left:1.2rem}
@media(max-width:640px){#bulle-nsfw{white-space:normal;text-align:center;
 width:88vw;border-radius:18px;line-height:1.4;text-overflow:clip;overflow:visible}}
.grille-apercu .v-flou .lecture{position:absolute;inset:0;display:flex;align-items:center;
 justify-content:center;font-size:2rem;color:#fff;text-shadow:0 0 12px #000}
[dir=rtl] .article ul{padding-left:0;padding-right:1.4rem}
[dir=rtl] .article blockquote{border-left:none;border-right:2px solid var(--trait);
 padding-left:0;padding-right:1rem}

.menu{position:relative;text-align:center;margin:.9rem 0 .2rem;color:var(--trait);font-size:1.15rem;letter-spacing:.07em}
.coin-langue{position:absolute;right:0;top:50%;transform:translateY(-50%)}
.langue-mini{display:none}
@media(max-width:700px){
.coin-langue .langue{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer}
.coin-langue{width:2.4rem;height:2rem;line-height:2rem;text-align:center}
.langue-mini{display:inline;font-size:1.35rem}}
.menu .off{color:var(--date);cursor:default}
.menu a.on{color:var(--texte);border-bottom:1px solid var(--doux);padding-bottom:2px}
.menu a.lien{color:var(--doux)}
.menu a.lien:hover{color:var(--texte)}
.sousligne{display:flex;justify-content:flex-end;align-items:center;gap:.6rem;margin-top:.45rem;flex-wrap:wrap}
.grp{display:inline-flex;align-items:center;gap:.45rem;white-space:nowrap}
.chlangue{color:var(--doux);font-size:.8rem;white-space:nowrap}
.modes{display:inline-flex;border:1px solid var(--trait);border-radius:99px;overflow:hidden;margin-right:.6rem}
.modes button{background:var(--carte);color:var(--doux);border:none;padding:.35rem .8rem;
 font-size:.8rem;cursor:pointer;white-space:nowrap}
.modes button.ici{background:var(--trait);color:var(--texte)}
.modes button:hover{color:var(--texte)}
.tri-sets{text-align:center;margin:.1rem 0 1.4rem}
.tri-sets .modes{margin-right:0}
select.langue{background:var(--carte);color:var(--texte);border:1px solid var(--trait);
 border-radius:8px;padding:.35rem .6rem;font-size:.85rem;cursor:pointer;
 -webkit-appearance:none;appearance:none}
select.langue:hover{border-color:var(--doux)}
[dir=rtl] p.descr{border-left:none;border-right:2px solid var(--trait);
 padding-left:0;padding-right:1rem}