/* v3-galerie.css : la galerie de fiches illustrées, commune aux articles.

   Née dans v3-souplesse.css pour les 25 fiches de méthode (« Les méthodes, en
   images »). Le 13/09, l'article « récupération » reçoit à son tour une galerie
   (les moyens de récupération en photos) : les règles sortent donc de la
   feuille de « souplesse » pour une feuille COMMUNE, chargée par page.py dans
   chaque article. Une fiche = `.rc-gcard` avec une classe nue de verdict
   (`ok`, `mid`, `weak`, `no`, `none`), une vignette `.rc-gimg` qui porte la
   photo `.rc-gphoto`, une pastille `.rc-vbadge.v-*`, puis le corps `.rc-gbody`.
   Les règles sont copiées telles quelles : même spécificité, même ordre. */

/* ═══ 3. LA PASTILLE DE VERDICT ═════════════════════════════════════════════
   Elle sert deux fois : en tête de colonne du tableau, et sur chaque fiche de
   méthode. Une seule définition, donc, sans sélecteur de contexte.

   Le registre est celui des en-têtes de tableau de l'article (.gk-recup th) :
   très petit, capitales, fortement interlettré. C'est ce qui la fait lire
   comme une étiquette et pas comme un bouton. */
.gk-recup .rc-vbadge {
  display: inline-block; padding: 4px 8px;
  font: 600 9.5px/1 var(--rc-body); letter-spacing: .14em; text-transform: uppercase;
  white-space: nowrap;
}
.gk-recup .rc-vbadge.v-ok   { background: var(--rc-green-soft); color: var(--rc-green); }
.gk-recup .rc-vbadge.v-mid  { background: var(--rc-blue-soft);  color: var(--rc-blue); }
.gk-recup .rc-vbadge.v-weak { background: rgba(200, 170, 110, .16); color: var(--rc-gold); }
.gk-recup .rc-vbadge.v-no   { background: var(--rc-red-soft);   color: var(--rc-red); }
/* « Jamais testé » : pas de teinte, juste un filet. Un aplat, même neutre,
   aurait donné à l'absence de preuve le même poids visuel qu'un verdict. */
.gk-recup .rc-vbadge.v-none {
  background: none; color: var(--rc-ink-3);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .14);
}


/* ═══ 4. LES FICHES DE MÉTHODE (chapitres 04 et 05) ═════════════════════════
   Une vignette dessinée, un verdict, le protocole, la preuve, et la requête à
   taper pour trouver une vraie photo. Le script en produit vingt-cinq. */

.gk-recup .rc-gallery {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(min(280px, 100%), 1fr));
  gap: 14px; margin: 20px 0;
}

.gk-recup .rc-gcard {
  display: flex; flex-direction: column; overflow: hidden;
  background: linear-gradient(150deg, rgba(255, 255, 255, .06), rgba(255, 255, 255, .02));
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .10);
}

/* La vignette : un fond très légèrement plus clair que la fiche, pour que le
   pictogramme au trait clair ait quelque chose sous lui et ne flotte pas. */
.gk-recup .rc-gimg {
  padding: 10px; background: rgba(255, 255, 255, .035);
  border-bottom: 1px solid rgba(255, 255, 255, .10);
}
/* Validé et invalidé teintent le fond de la vignette : on voit le verdict de
   la fiche avant d'avoir lu un mot. Les trois niveaux intermédiaires gardent
   le fond neutre, sinon la grille entière devient un vitrail. */
.gk-recup .rc-gcard.ok .rc-gimg { background: var(--rc-green-soft); }
.gk-recup .rc-gcard.no .rc-gimg { background: var(--rc-red-soft); }

.gk-recup .rc-gbody { padding: 14px 16px 16px; }
.gk-recup .rc-gcard h4 {
  margin: 8px 0 6px; font: 600 14px/1.35 var(--rc-body); color: #F2F4FA;
  letter-spacing: .01em;
}
.gk-recup .rc-ghow,
.gk-recup .rc-gev { font: 400 12.5px/1.5 var(--rc-body); margin: 6px 0 0; }
.gk-recup .rc-ghow { color: rgba(255, 255, 255, .80); }
/* « Comment : » est une étiquette, pas un mot du texte : or, comme tous les
   intitulés de l'article. */
.gk-recup .rc-ghow b { color: var(--rc-gold); font-weight: 600; }
/* la preuve passe derrière le protocole : c'est la justification, pas la
   consigne. Elle porte les renvois [n], déjà stylés par v3-recup.css. */
.gk-recup .rc-gev { color: rgba(255, 255, 255, .62); }
/* la requête à taper : monospace, le registre « donnée brute » de l'article */
.gk-recup .rc-gq {
  margin: 10px 0 0; font: 400 10.5px/1.4 var(--rc-mono); color: var(--rc-ink-3);
}



/* ── La photo de pose, à la place du pictogramme ────────────────────────────
   Les fiches montraient un bonhomme en bâtons dessiné en SVG. Depuis le 13/09
   elles portent une vraie photo, tirée dans Figma dans le même monde que le
   reste (mur bleu nuit, parquet, dobok blanc à col noir). Le pictogramme reste
   dans le script : une pose sans photo retombe dessus, la vignette n'est jamais
   vide. Les deux occupent la même boîte carrée, donc rien ne bouge autour. */
.gk-recup .rc-gimg .rc-gphoto {
  display: block; width: 100%; height: 100%;
  object-fit: cover; object-position: center;
}
/* une méthode invalidée reste grisée, comme son pictogramme l'était */
.gk-recup .rc-gcard.no .rc-gphoto { filter: grayscale(.55) brightness(.82); }

/* ── La galerie des moyens de récupération (#rc-gal-moyens) ─────────────────
   Elle vit dans la colonne de texte d'un chapitre à deux colonnes (la planche
   du mollet est épinglée à gauche), pas dans un chapitre pleine largeur comme
   les fiches de souplesse. Une seule fiche par rangée y faisait une vignette
   de 530 px de côté et une colonne de huit écrans : deux par rangée. Sur
   téléphone, une seule, comme partout. */
.gk-recup #rc-gal-moyens { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 620px) {
  .gk-recup #rc-gal-moyens { grid-template-columns: 1fr; }
}