:root{
  --papier:#F7F4EE; --encre:#161513; --accent:#BE7B4A;
  --sable:#E6DACB; --sombre:#191815; --gris:#777; --gris2:#999;
  --marge:4.16%;
  --col:calc((100% - 2 * var(--marge)) / 12);
  --t-nom:clamp(2.6rem, 8vw, 5.8rem);
  --t-h1:clamp(1.4rem, 2.9vw, 2.3rem);
  --t-h2:clamp(1rem, 1.5vw, 1.15rem);
  --t-corps:0.95rem;
  --t-label:0.62rem;
  --ease:cubic-bezier(.3,.34,0,.86);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--papier); color:var(--encre);
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
  font-size:var(--t-corps); line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
img{display:block; max-width:100%; height:auto}
a{color:inherit; text-decoration:none}
h1,h2,h3{margin:0; font-weight:400}

/* ---------- etiquettes mono ---------- */
.label{
  font-family:"SFMono-Regular",Menlo,Consolas,monospace;
  font-size:var(--t-label); letter-spacing:.14em; text-transform:uppercase;
  color:var(--gris); display:block; margin-bottom:1.4rem;
}
section{position:relative}
.bloc{padding:8vh var(--marge)}

/* ---------- barre de navigation ---------- */
.barre{
  position:fixed; inset:0 0 auto 0; z-index:60;
  display:flex; justify-content:space-between; align-items:center;
  padding:1.1rem var(--marge);
  mix-blend-mode:difference; color:#fff;
  font-family:"SFMono-Regular",Menlo,Consolas,monospace;
  font-size:var(--t-label); letter-spacing:.14em; text-transform:uppercase;
}
.barre ul{display:flex; gap:1.6rem; list-style:none; margin:0; padding:0}
.barre .langues{display:flex; gap:.9rem; opacity:.75}

/* ---------- chargeur concu (mecanisme 3+4) ---------- */
.chargeur{
  position:fixed; inset:0; z-index:200; background:var(--sombre); color:var(--papier);
  display:flex; flex-direction:column; justify-content:flex-end;
  padding:var(--marge); transition:opacity .5s var(--ease), visibility .5s;
}
.chargeur.fini{opacity:0; visibility:hidden}
.chargeur__nom{font-size:var(--t-h1); font-style:italic; margin-bottom:1.2rem}
.chargeur__bas{display:flex; justify-content:space-between; align-items:baseline;
  border-top:1px solid rgba(247,244,238,.25); padding-top:.9rem}
.chargeur__mot{font-family:"SFMono-Regular",Menlo,Consolas,monospace;
  font-size:var(--t-label); letter-spacing:.14em; text-transform:uppercase; opacity:.7}
.chargeur__fil{position:absolute; left:0; bottom:0; height:2px; background:var(--accent); width:0;
  transition:width .3s linear}

/* ---------- ouverture ---------- */
.ouverture{height:100vh; min-height:560px; overflow:hidden; display:flex; align-items:flex-end}
.ouverture__img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  z-index:0; transform:scale(1.15)}
.ouverture::after{
  content:""; position:absolute; inset:0; z-index:1;
  background:linear-gradient(to top, rgba(12,11,10,.97) 0%, rgba(12,11,10,.86) 26%,
             rgba(12,11,10,.58) 48%, rgba(12,11,10,.22) 72%, rgba(12,11,10,.08) 100%);
}
.ouverture__texte{
  position:relative; z-index:2; padding:0 var(--marge) 9vh; width:100%;
  color:#fff; display:grid; grid-template-columns:repeat(12,1fr); column-gap:0;
}
.ouverture__col{grid-column:1 / span 7}
.ouverture__nom{
  font-family:Georgia,"Times New Roman",serif; font-style:italic;
  font-size:var(--t-nom); line-height:.98; letter-spacing:-.02em; margin-bottom:1.6rem;
}
.ouverture__phrase{
  font-size:var(--t-h2); color:#fff; opacity:.92; margin-bottom:2.2rem;
  max-width:34ch; line-height:1.45;
}
/* VALEURS VERROUILLEES — ne jamais toucher */
.tagline{font-size:0.7rem; color:#999; letter-spacing:.16em; text-transform:uppercase;
  font-family:"SFMono-Regular",Menlo,Consolas,monospace; margin-bottom:1.5rem}
.bio{max-width:560px; line-height:1.6; font-size:0.58rem; color:#777; margin:0}
.bio p{margin:0 0 .95rem}
.bio p:last-child{margin-bottom:0}

/* ---------- manifeste : colonne etroite, forte indentation ---------- */
.manifeste{background:var(--papier); min-height:86vh; display:flex; flex-direction:column;
  justify-content:center}
.manifeste__grille{display:grid; grid-template-columns:repeat(12,1fr)}
.manifeste__txt{grid-column:3 / span 7; font-size:clamp(1.5rem, 3.2vw, 2.7rem);
  line-height:1.22; letter-spacing:-.018em}
.manifeste__note{grid-column:3 / span 5; margin-top:2.4rem; color:var(--gris); font-size:.88rem; line-height:1.65}

/* ---------- selection : modules asymetriques 72.7 / 27.3 ---------- */
.selection{background:var(--sable)}
.piece{display:grid; grid-template-columns:repeat(12,1fr); align-items:end; gap:1.6vw;
  padding:3.2vh var(--marge)}
.piece__img{grid-column:1 / span 8; position:relative; overflow:hidden}
.piece__img img{width:100%; aspect-ratio:16/9; object-fit:cover}
.piece__img{--p:0}
.piece:nth-child(even) .piece__img{grid-column:5 / span 8; order:2}
.piece:nth-child(even) .piece__txt{grid-column:1 / span 3; order:1}
.piece__txt{grid-column:9 / span 4; padding-bottom:.4rem}
.piece__num{font-family:"SFMono-Regular",Menlo,Consolas,monospace; font-size:var(--t-label);
  letter-spacing:.14em; color:var(--gris); display:block; margin-bottom:.7rem}
.piece__titre{font-size:var(--t-h1); line-height:1.08; letter-spacing:-.015em; margin-bottom:.8rem}
.piece__ar{font-size:.95rem; color:var(--gris); margin-bottom:1rem; direction:rtl}
.piece__meta{font-size:.78rem; color:var(--gris); line-height:1.55}

/* ---------- recit : defilement HORIZONTAL (mecanisme 5) ---------- */
.recit{background:var(--sombre); color:var(--papier); padding:10vh 0 8vh}
.recit .label{color:rgba(247,244,238,.6); padding:0 var(--marge); margin-bottom:0}
.recit__entete{display:flex; justify-content:space-between; align-items:baseline;
  padding:0 var(--marge); margin-bottom:3vh}
.recit__compteur{font-family:"SFMono-Regular",Menlo,Consolas,monospace;
  font-size:var(--t-label); letter-spacing:.14em; color:rgba(247,244,238,.6)}
.recit__suite{display:flex; justify-content:space-between; align-items:baseline;
  padding:2.4vh var(--marge) 0}
.recit__phrase{font-size:var(--t-h2); max-width:30ch; line-height:1.4; color:rgba(247,244,238,.86)}
.recit__aide{font-family:"SFMono-Regular",Menlo,Consolas,monospace; font-size:var(--t-label);
  letter-spacing:.14em; color:rgba(247,244,238,.5); text-transform:uppercase}
.recit__piste{
  display:flex; gap:1.4vw; overflow-x:auto; scroll-snap-type:x mandatory;
  padding:0 var(--marge) 1rem; scrollbar-width:none;
}
.recit__piste::-webkit-scrollbar{display:none}
.recit__plan{flex:0 0 58vw; scroll-snap-align:center; margin:0}
.recit__plan img{width:100%; aspect-ratio:16/9; object-fit:cover; background:#221f1a}
.recit__plan figcaption{font-family:"SFMono-Regular",Menlo,Consolas,monospace;
  font-size:var(--t-label); letter-spacing:.12em; text-transform:uppercase;
  color:rgba(247,244,238,.55); margin-top:.8rem}

/* ---------- travaux : index numerote + deux modes ---------- */
.travaux{background:var(--papier)}
.travaux__entete{display:flex; justify-content:space-between; align-items:flex-end;
  flex-wrap:wrap; gap:1.5rem; margin-bottom:3.5vh}
.bascule{display:flex; gap:0; border:1px solid rgba(22,21,19,.25); border-radius:999px; overflow:hidden}
.bascule button{
  appearance:none; border:0; background:transparent; cursor:pointer;
  font-family:"SFMono-Regular",Menlo,Consolas,monospace; font-size:var(--t-label);
  letter-spacing:.14em; text-transform:uppercase; color:var(--encre);
  padding:.6rem 1.15rem; opacity:.55;
}
.bascule button[aria-pressed="true"]{background:var(--encre); color:var(--papier); opacity:1}

.chapitre{margin-bottom:3vh}
.chapitre__annee{
  font-family:"SFMono-Regular",Menlo,Consolas,monospace; font-size:var(--t-label);
  letter-spacing:.16em; color:var(--gris); display:flex; align-items:center; gap:1rem;
  padding-top:1.1rem; border-top:1px solid rgba(22,21,19,.18); margin-bottom:1.6rem;
}
.entree{
  display:grid; grid-template-columns:repeat(12,1fr); gap:1.6vw; align-items:center;
  padding:1.15rem 0; border-bottom:1px solid rgba(22,21,19,.07);
}
.entree__num{grid-column:1 / span 1; font-family:"SFMono-Regular",Menlo,Consolas,monospace;
  font-size:var(--t-label); letter-spacing:.1em; color:var(--accent); padding-top:.35rem}
.entree__corps{grid-column:2 / span 6}
.entree__titre{font-size:clamp(1.05rem, 1.7vw, 1.5rem); line-height:1.15; letter-spacing:-.01em}
.entree__raison{font-size:.8rem; color:var(--gris); line-height:1.55; margin-top:.35rem}
.entree__ar{font-size:.8rem; color:var(--gris2); direction:rtl; margin-top:.15rem}
.entree__an{grid-column:8 / span 2; font-family:"SFMono-Regular",Menlo,Consolas,monospace;
  font-size:var(--t-label); letter-spacing:.12em; color:var(--gris); text-align:right; padding-top:.35rem}
.entree__vignette{grid-column:10 / span 3; justify-self:stretch}
.entree__vignette img{width:100%; aspect-ratio:16/9; object-fit:cover}
.entree.verrouille .entree__titre::after{
  content:" ⚿"; font-size:.75em; color:var(--accent); letter-spacing:0;
}
.entree.verrouille{cursor:pointer}
/* projet verrouille : hachures a la place de l'image, jamais l'image */
.entree.verrouille .entree__vignette{
  width:100%; aspect-ratio:16/9;
  background:repeating-linear-gradient(45deg, rgba(22,21,19,.09) 0 6px, transparent 6px 12px);
  border:1px solid rgba(22,21,19,.12);
}
.entree.verrouille.ouvert .entree__vignette{background:none; border:0}
.entree.verrouille.ouvert .entree__vignette img{width:100%; aspect-ratio:16/9; object-fit:cover}
/* mode INDEX : liste dense, aucune image */
.travaux.index .entree__vignette{display:none}
.travaux.index .entree{padding:.5rem 0}
.travaux.index .entree__corps{grid-column:2 / span 8}
.travaux.index .entree__titre{font-size:1rem}

/* ---------- publicite : en DERNIER, fond sable profond ---------- */
.publicite{background:#C9A882}
.publicite .label{color:rgba(22,21,19,.55)}
.publicite__grille{display:grid; grid-template-columns:repeat(12,1fr); gap:1.6vw}
.pub{grid-column:span 4}
.pub img{width:100%; aspect-ratio:16/9; object-fit:cover}
.pub h3{font-size:var(--t-h2); margin-top:.9rem; line-height:1.2}
.pub p{font-size:.76rem; color:rgba(22,21,19,.7); margin:.35rem 0 0; line-height:1.5}

/* ---------- contact ---------- */
.contact{background:var(--sombre); color:var(--papier); padding:14vh var(--marge)}
.contact__grille{display:grid; grid-template-columns:repeat(12,1fr); gap:2vw}
.contact__titre{grid-column:1 / span 6; font-family:Georgia,"Times New Roman",serif;
  font-style:italic; font-size:var(--t-h1); line-height:1.15}
.contact__liens{grid-column:8 / span 5; font-family:"SFMono-Regular",Menlo,Consolas,monospace;
  font-size:var(--t-label); letter-spacing:.14em; text-transform:uppercase; line-height:2.4}
.contact__liens a{border-bottom:1px solid rgba(247,244,238,.3); padding-bottom:.2rem}
.contact__liens li{list-style:none}
.contact__liens ul{margin:0; padding:0}

/* ---------- pied ---------- */
.pied{
  background:var(--sombre); color:rgba(247,244,238,.5); border-top:1px solid rgba(247,244,238,.12);
  padding:2.2rem var(--marge); display:flex; justify-content:space-between; flex-wrap:wrap; gap:1rem;
  font-family:"SFMono-Regular",Menlo,Consolas,monospace;
  font-size:var(--t-label); letter-spacing:.12em; text-transform:uppercase;
}

/* ---------- apparitions (natives, infra-seuil) ---------- */
.rev{opacity:0; transform:translateY(32px);
  transition:opacity .9s var(--ease), transform .9s var(--ease); transition-delay:var(--d,0s)}
.rev.vu{opacity:1; transform:none}

/* ---------- transitions de page (CSS View Transitions) ---------- */
@view-transition{navigation:auto}

/* ---------- travaux : GALERIE editoriale (plus aucune table) ---------- */
.galerie{display:grid; grid-template-columns:repeat(12,1fr); gap:0}
.vue{margin:0; position:relative; background:var(--noir)}
.vue--plein{grid-column:1 / -1}
.vue--gauche{grid-column:1 / span 7}
.vue--droite{grid-column:6 / span 7}
.vue--gauche{margin-bottom:2px}
.vue--droite{margin-bottom:2px}
.vue__lien{display:block; position:relative; overflow:hidden}
.vue img{width:100%; aspect-ratio:16/9; object-fit:cover}
.vue--plein img{aspect-ratio:21/9}
.vue__legende{
  position:absolute; left:0; right:0; bottom:0;
  padding:1.5rem var(--marge) 1.3rem;
  display:flex; align-items:baseline; gap:1.1rem; flex-wrap:wrap;
  background:linear-gradient(to top, rgba(11,11,10,.94) 0%, rgba(11,11,10,.7) 48%, rgba(11,11,10,0) 100%);
}
.vue__num{font-family:"SFMono-Regular",Menlo,Consolas,monospace; font-size:var(--t-label);
  letter-spacing:.14em; color:var(--gris); padding-bottom:.35rem}
.vue__titre{font-family:var(--serif); font-weight:400; font-size:clamp(1.3rem,2.4vw,2.3rem);
  line-height:1.04; margin:0; letter-spacing:-.015em}
.vue__ar{font-size:.92rem; color:var(--gris)}
.vue__meta{font-family:"SFMono-Regular",Menlo,Consolas,monospace; font-size:var(--t-label);
  letter-spacing:.12em; color:var(--gris); margin-left:auto; text-align:right; padding-bottom:.4rem}
.vue.verrouille .vue__titre::after{content:" \26BF"; font-size:.8em; color:var(--gris)}
.vue.verrouille .vue__lien{
  display:block; aspect-ratio:16/9;
  background:repeating-linear-gradient(45deg, rgba(237,234,228,.08) 0 8px, transparent 8px 16px);
}
.vue.verrouille{cursor:pointer}
/* les publicites sont en 16/9, meme en pleine largeur */
.publicite .vue--plein img{aspect-ratio:16/9}
.publicite .vue__titre{font-size:clamp(1.2rem,2.1vw,1.9rem)}

/* la galerie est le mode par defaut ; la liste dense n'apparait qu'en mode Index */
.travaux .liste{display:none}
.travaux.index .galerie{display:none}
.travaux.index .liste{display:block}

/* ============================================================
   COUCHE 2 — typographie reelle, palette alternee, mouvement
   ============================================================ */
@font-face{font-family:'Instrument Serif';src:url('/assets/fonts/instrument-normal-400.woff2') format('woff2');
  font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Instrument Serif';src:url('/assets/fonts/instrument-italic-400.woff2') format('woff2');
  font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:'Inter VF';src:url('/assets/fonts/inter-normal-300_700.woff2') format('woff2');
  font-weight:300 700;font-style:normal;font-display:swap}

:root{
  --serif:'Instrument Serif',Georgia,'Times New Roman',serif;
  --txt:'Inter VF',Inter,system-ui,-apple-system,sans-serif;
  --encre:#191713; --papier:#F6F2EA; --atelier:#E7DFD0;
  --sable:#CBA97F; --olive:#22281A; --sombre:#14120F; --accent:#B4653A;
  --t-nom:clamp(3rem, 9.5vw, 7.6rem);
  --t-h1:clamp(1.5rem, 3.4vw, 2.9rem);
  --t-h2:clamp(1rem, 1.5vw, 1.2rem);
}
body{font-family:var(--txt); font-weight:340; letter-spacing:.004em}

/* le serif editorial porte le nom et les titres */
.ouverture__nom,.piece__titre,.entree__titre,.contact__titre{
  font-family:var(--serif); font-weight:400; letter-spacing:-.015em;
}
.ouverture__nom{font-style:italic; line-height:.92; text-shadow:0 2px 44px rgba(0,0,0,.4)}
.entree__titre{font-size:clamp(1.25rem, 2.1vw, 1.85rem); line-height:1.12}
.piece__titre{font-size:clamp(1.6rem, 3vw, 2.6rem); line-height:1.05}

/* palette alternee : un registre par section */
.manifeste{background:var(--atelier)}
.selection{background:var(--papier)}
.recit{background:var(--sombre)}
.travaux{background:var(--atelier)}
.publicite{background:var(--sable)}
.contact{background:var(--olive)}
.pied{background:var(--olive); border-top-color:rgba(246,242,234,.14)}

.label{font-size:.66rem; letter-spacing:.18em}
.chapitre__annee{color:#867c6c; border-top-color:rgba(25,23,19,.22)}
.entree{border-bottom-color:rgba(25,23,19,.1)}
.entree__num{color:var(--accent)}
.entree__vignette img{border:1px solid rgba(25,23,19,.08)}
.contact__titre{font-style:italic}

/* ouverture : deux couches en fondu croise, jamais via le noir */
.ouverture__img{opacity:0; transition:opacity 1.8s cubic-bezier(.4,0,.2,1)}
.ouverture__img.actif{opacity:1}

/* selection : une piece sur deux sort du cadre vers la gauche */
.piece:nth-child(even) .piece__img{grid-column:1 / span 8; margin-left:calc(-1 * var(--marge))}
.piece:nth-child(even) .piece__txt{grid-column:9 / span 4; order:2}
.piece:nth-child(odd) .piece__img{grid-column:5 / span 8}
.piece:nth-child(odd) .piece__txt{grid-column:1 / span 3; order:1}

/* recit : le plan au centre respire, les autres s'effacent */
.recit__plan{transition:opacity .55s ease}
.recit__plan:not(.centre){opacity:.42}
.recit__plan.centre{opacity:1}

/* apparitions : un peu plus lentes, plus poses */
.rev{transition-duration:1.15s, 1.15s}

@media (prefers-reduced-motion: reduce){
  .rev{opacity:1; transform:none; transition:none}
  .ouverture__img{transform:none}
}
@media (max-width: 900px){
  .ouverture__col, .manifeste__txt, .manifeste__note{grid-column:1 / span 12}
  .piece__img, .piece:nth-child(even) .piece__img{grid-column:1 / span 12}
  .piece__txt, .piece:nth-child(even) .piece__txt{grid-column:1 / span 12; order:3; margin-top:1rem}
  .recit__plan{flex-basis:84vw}
  .entree__corps{grid-column:2 / span 9}
  .entree__an{grid-column:2 / span 9; text-align:left; padding-top:.2rem}
  .entree__vignette{grid-column:2 / span 3; justify-self:start; margin-top:.6rem}
  .pub{grid-column:span 6}
  .contact__titre, .contact__liens{grid-column:1 / span 12}
}

/* ============================================================
   REGLE MAISON — tous les fonds en noir, aucune autre couleur.
   Aucune teinte chaude, aucun accent colore. Monochrome.
   ============================================================ */
:root{
  --noir:#0B0B0A; --clair:#EDEAE4; --gris:#8A857C; --gris2:#6B675F;
  --papier:var(--noir); --atelier:var(--noir); --sable:var(--noir);
  --olive:var(--noir); --sombre:var(--noir); --encre:var(--clair);
  --accent:var(--clair);
}
/* la nav commune aux pages secondaires (cv, about, pages projet, versions en/ar) */
#nav{position:fixed; top:0; left:0; right:0; z-index:60; display:flex; align-items:center;
  justify-content:space-between; padding:1.1rem var(--marge);
  mix-blend-mode:difference; color:#fff}
#nav .logo{font-family:var(--serif); font-size:1.15rem; letter-spacing:.02em; text-decoration:none; color:#fff}
#nav ul{display:flex; gap:1.5rem; list-style:none; margin:0; padding:0; align-items:center}
#nav ul a{font-family:"SFMono-Regular",Menlo,Consolas,monospace; font-size:.66rem;
  letter-spacing:.16em; text-transform:uppercase; color:#fff; text-decoration:none; opacity:.82}
#nav ul a:hover{opacity:1}
#nav .lang-switch{display:flex; gap:.55rem; align-items:center}
#nav .lang-switch a{font-size:.62rem; letter-spacing:.08em; color:#fff; opacity:.5}
#nav .lang-switch a:hover{opacity:.9}
#nav .lang-active{opacity:1 !important; text-decoration:underline; text-underline-offset:3px}
/* .logo doit rester lisible : il n'est pas dans un <li> */
#nav > .logo{margin-right:auto}

html,body{background:var(--noir)!important; color:var(--clair)}
section,main,article,figure,header,footer,nav,div.bloc,
.manifeste,.selection,.recit,.travaux,.publicite,.contact,.pied,
.chapitre,.entree,.piece,.pub{background:var(--noir) !important}
.ouverture{background:var(--noir) !important}

/* plus aucun accent colore : le gris remplace le terracotta */
.label,.entree__num,.chapitre__annee,.entree__an,.entree__raison,
.piece__num,.piece__meta,.piece__ar,.pub p,.recit__aide,.recit__compteur,
.contact__liens,.pied,.recit__plan figcaption,.chargeur__mot{
  color:var(--gris) !important;
}
.entree.verrouille .entree__titre::after{color:var(--gris) !important}

/* surfaces claires -> surfaces sombres */
.bascule{border-color:rgba(237,234,228,.24) !important}
.bascule button{color:var(--clair) !important; background:transparent !important}
.bascule button[aria-pressed="true"]{background:var(--clair) !important; color:var(--noir) !important}
.chapitre__annee{border-top-color:rgba(237,234,228,.18) !important}
.entree{border-bottom-color:rgba(237,234,228,.1) !important}
.entree__vignette img{border-color:rgba(237,234,228,.1) !important}
.entree.verrouille .entree__vignette{
  background:repeating-linear-gradient(45deg, rgba(237,234,228,.1) 0 6px, transparent 6px 12px) !important;
  border-color:rgba(237,234,228,.14) !important;
}
.recit__plan img,.ouverture__img{background:#131211}

/* la barre : plus de melange de couleurs, blanc franc degrade */
.barre{
  mix-blend-mode:normal !important; color:var(--clair) !important;
  background:linear-gradient(to bottom, rgba(11,11,10,.78), rgba(11,11,10,0)) !important;
}
.barre a{color:var(--clair)}

/* valeurs VERROUILLEES, conservees telles quelles */
.tagline{color:#999 !important}
.bio{color:#777 !important}

/* ---- reprise des pages existantes (cv, about, works) ---- */
img[style]{max-width:100% !important; height:auto !important}
h1,h2,h3{font-family:var(--serif) !important; color:var(--clair) !important}
a{color:inherit}
hr{border-color:rgba(237,234,228,.15)}
table{border-color:rgba(237,234,228,.15)}

/* la bascule : un contour, pas un aplat clair */
.bascule button[aria-pressed="true"]{
  background:rgba(237,234,228,.1) !important; color:var(--clair) !important;
  box-shadow:inset 0 0 0 1px rgba(237,234,228,.5);
}
/* visionneuse des pages projet : controles sombres, plus de #EFEFEF */
button.lb-close,button.lb-nav,.lb-close,.lb-nav,.lb-prev,.lb-next{
  background:rgba(11,11,10,.78) !important; color:var(--clair) !important;
  border-color:rgba(237,234,228,.22) !important;
}
.lb-close:hover,.lb-nav:hover{background:rgba(237,234,228,.14) !important}
/* la ligne de progression du chargeur reste claire : c'est du monochrome, pas une couleur */
.chargeur__fil{background:var(--clair) !important}