/* ==========================================================================
   Train Rouge — Albums photo (grille, album à la une, saisie du code, galerie, visionneuse)
   Les jetons --tr-* viennent du thème ; les valeurs de repli suivent la charte (mode clair).
   Tailles en rem : les réglages A− A A+ s'appliquent.
   ========================================================================== */

/* L'attribut hidden l'emporte toujours sur nos display. */
:where(.tr-albums, .tr-album-une, .tr-demande-code, .tr-album) [hidden] { display: none !important; }

/* ---- Replis à spécificité nulle (le thème les remplace dès qu'il les définit) ---- */
:where(.tr-albums, .tr-album-une, .tr-demande-code, .tr-album) :where(.tr-btn) {
	display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
	min-height: 3rem; padding: .75rem 1.5rem; border-radius: 999px; border: 2px solid transparent;
	font: 700 1rem/1.25 var(--tr-police-texte, "Atkinson Hyperlegible Next", system-ui, sans-serif);
	text-decoration: none; cursor: pointer; transition: background-color .2s, color .2s, border-color .2s;
}
:where(.tr-albums, .tr-album-une, .tr-demande-code, .tr-album) :where(.tr-btn--l) { min-height: 3.5rem; padding: .875rem 1.75rem; font-size: 1.125rem; }
:where(.tr-albums, .tr-album-une, .tr-demande-code, .tr-album) :where(.tr-btn--primaire) { background: var(--tr-action-primaire, #A3141E); color: var(--tr-texte-inverse, #fff); }
:where(.tr-albums, .tr-album-une, .tr-demande-code, .tr-album) :where(.tr-btn--primaire:hover) { background: var(--tr-action-primaire-survol, #8F111A); }
:where(.tr-albums, .tr-album-une, .tr-demande-code, .tr-album) :where(.tr-btn--secondaire) { background: transparent; color: var(--tr-action-secondaire, #24255D); border-color: currentColor; }
:where(.tr-albums, .tr-album-une, .tr-demande-code, .tr-album) :where(.tr-btn--contour-clair) { background: transparent; color: var(--tr-texte-inverse, #fff); border-color: currentColor; }
:where(.tr-albums, .tr-album-une, .tr-demande-code, .tr-album) :where(.tr-btn--lien) { min-height: 2rem; padding: .25rem 0; border: 0; color: var(--tr-texte-accent, #A3141E); background: none; }
:where(.tr-albums, .tr-album-une, .tr-demande-code, .tr-album) :where(.tr-badge) {
	display: inline-flex; align-items: center; gap: .375rem; width: fit-content; margin: 0; padding: .3rem .75rem;
	border-radius: 999px; font: 700 .9375rem/1.3 var(--tr-police-texte, system-ui, sans-serif);
	background: var(--tr-fond-accent-doux, #FEF2F2); color: var(--tr-texte-accent, #A3141E);
}
:where(.tr-albums, .tr-album-une, .tr-demande-code, .tr-album) :where(.tr-badge--succes) { background: var(--tr-statut-succes-doux, #EAF6F0); color: var(--tr-statut-succes, #0F5A3A); }
:where(.tr-albums, .tr-album-une, .tr-demande-code, .tr-album) :where(.tr-badge--lumiere) { background: var(--tr-fond-lumiere-vif, #F68E1E); color: var(--tr-texte-sur-lumiere, #16173F); }
:where(.tr-albums, .tr-album-une, .tr-demande-code, .tr-album) :where(.tr-badge--sombre, .tr-badge--verre) { background: rgba(15, 16, 51, .82); color: #fff; }
:where(.tr-albums, .tr-album-une, .tr-demande-code, .tr-album) :where(.tr-chips) { display: flex; flex-wrap: wrap; gap: .5rem; }
:where(.tr-albums, .tr-album) :where(.tr-chip) {
	display: inline-flex; align-items: center; min-height: 2.75rem; padding: .5rem 1rem; border-radius: 999px;
	border: 1px solid var(--tr-bordure-defaut, #E4E2DC); background: var(--tr-fond-carte, #fff); color: var(--tr-texte-marque, #24255D);
	font: 700 .9375rem/1.2 var(--tr-police-texte, system-ui, sans-serif); text-decoration: none; cursor: pointer;
}
:where(.tr-albums, .tr-album) :where(.tr-chip.is-selected, .tr-chip[aria-pressed="true"]) { background: var(--tr-fond-marque, #24255D); border-color: var(--tr-fond-marque, #24255D); color: var(--tr-texte-inverse, #fff); }
:where(.tr-albums, .tr-album-une, .tr-demande-code, .tr-album) :where(.tr-pastille) {
	display: inline-grid; place-items: center; flex: none; width: 2.75rem; height: 2.75rem; border-radius: 50%;
	background: var(--tr-fond-accent-doux, #FEF2F2); color: var(--tr-icone-accent, #A3141E);
}
:where(.tr-albums, .tr-album-une, .tr-demande-code, .tr-album) :where(.tr-surtitre) {
	display: flex; align-items: center; gap: .75rem; margin: 0 0 .75rem; color: var(--tr-texte-accent, #A3141E);
	font: 700 .9375rem/1.4 var(--tr-police-texte, system-ui, sans-serif); letter-spacing: .1em; text-transform: uppercase;
}
:where(.tr-albums, .tr-album-une, .tr-demande-code, .tr-album) :where(.tr-surtitre)::before { content: ""; width: 1.75rem; height: .25rem; border-radius: 2px; background: currentColor; }
:where(.tr-albums, .tr-album-une, .tr-demande-code, .tr-album) :where(.tr-notice) {
	display: flex; gap: .75rem; align-items: flex-start; padding: 1rem 1.25rem; border-radius: var(--tr-rayon-m, 14px);
	background: var(--tr-statut-info-doux, #EEF3FB); color: var(--tr-texte-principal, #1C1D3A);
}
:where(.tr-albums, .tr-album-une, .tr-demande-code, .tr-album) :where(.tr-notice--succes) { background: var(--tr-statut-succes-doux, #EAF6F0); }
:where(.tr-albums, .tr-album-une, .tr-demande-code, .tr-album) :where(.tr-notice--erreur) { background: var(--tr-fond-accent-doux, #FEF2F2); }
:where(.tr-albums, .tr-album-une, .tr-demande-code, .tr-album) :where(.tr-notice p) { margin: 0; }
:where(.tr-albums, .tr-album-une, .tr-demande-code, .tr-album) :where(.tr-entete) { margin-bottom: 0; }
:where(.tr-albums, .tr-album-une, .tr-demande-code, .tr-album) :where(.tr-entete__titre) {
	margin: 0 0 .75rem; color: var(--tr-texte-marque, #24255D);
	font: 700 clamp(1.875rem, 1.2rem + 1.6vw, 2.75rem)/1.18 var(--tr-police-titres, "Bricolage Grotesque", system-ui, sans-serif); letter-spacing: -.01em;
}
:where(.tr-albums, .tr-album-une, .tr-demande-code, .tr-album) :where(.tr-entete__intro) { margin: 0; max-width: 46rem; color: var(--tr-texte-secondaire, #45465F); font-size: 1.125rem; line-height: 1.6; }
.tr-album .tr-fil-ariane ol { display: flex; flex-wrap: wrap; gap: .25rem .5rem; margin: 0 0 1.25rem; padding: 0; list-style: none; font-size: .9375rem; color: var(--tr-texte-discret, #4C4E66); }
.tr-album .tr-fil-ariane li + li::before { content: "›"; margin-right: .5rem; }
.tr-album .tr-fil-ariane a { color: inherit; }
.tr-album .tr-fil-ariane--clair ol { color: var(--tr-texte-inverse, #fff); }
.tr-albums .tr-icone, .tr-album-une .tr-icone, .tr-demande-code .tr-icone, .tr-album .tr-icone { flex: none; }

/* ==========================================================================
   Grille d'albums (widget tr-albums)
   ========================================================================== */
.tr-albums__entete { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1rem 2rem; margin-bottom: 2rem; }
.tr-albums__compte { margin: .25rem 0 0; color: var(--tr-texte-discret, #4C4E66); font-size: .9375rem; }
.tr-albums__grille { display: grid; grid-template-columns: repeat(var(--tr-colonnes, 3), minmax(0, 1fr)); gap: 1.5rem; margin: 0; padding: 0; list-style: none; }
.tr-albums__grille--2 { --tr-colonnes: 2; }
.tr-albums__grille--4 { --tr-colonnes: 4; }
.tr-albums__grille > li { display: flex; }
.tr-albums__plus { display: flex; justify-content: center; margin: 2.5rem 0 0; }

.tr-album-carte {
	position: relative; display: flex; flex-direction: column; width: 100%; overflow: hidden;
	border-radius: var(--tr-rayon-l, 20px); background: var(--tr-fond-carte, #fff);
	box-shadow: var(--tr-ombre-carte, 0 12px 32px rgba(36, 37, 93, .09)); border: 1px solid var(--tr-bordure-defaut, #E4E2DC);
}
.tr-album-carte__media { position: relative; aspect-ratio: 3 / 2; overflow: hidden; background: var(--tr-fond-marque, #24255D); }
.tr-album-carte__media img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.tr-album-carte__media--floue img { transform: scale(1.06); }
.tr-album-carte__media::after { content: ""; position: absolute; inset: auto 0 0; height: 55%; background: linear-gradient(to top, rgba(10, 11, 36, .78), transparent); pointer-events: none; }
.tr-album-carte__vide { display: grid; place-items: center; height: 100%; color: var(--tr-texte-inverse-doux, #C9CAE3); }
.tr-album-carte__badge { position: absolute; top: .875rem; left: .875rem; z-index: 1; }
.tr-album-carte__compteur { position: absolute; left: 1rem; bottom: .75rem; z-index: 1; display: inline-flex; align-items: center; gap: .375rem; color: #fff; font-weight: 700; font-size: .9375rem; }
.tr-album-carte__corps { display: flex; flex: 1; flex-direction: column; align-items: flex-start; gap: .5rem; padding: 1.25rem 1.25rem 1.5rem; }
.tr-album-carte__titre { margin: 0; font: 600 1.375rem/1.3 var(--tr-police-titres, "Bricolage Grotesque", system-ui, sans-serif); color: var(--tr-texte-marque, #24255D); }
.tr-album-carte__lien { color: inherit; text-decoration: none; }
.tr-album-carte__lien::after { content: ""; position: absolute; inset: 0; z-index: 2; border-radius: inherit; }
.tr-album-carte__lien:focus-visible { outline: none; }
.tr-album-carte:has(.tr-album-carte__lien:focus-visible) { outline: 3px solid var(--tr-focus-anneau, #24255D); outline-offset: 3px; }
.tr-album-carte__meta { margin: 0 0 .5rem; color: var(--tr-texte-discret, #4C4E66); font-size: .9375rem; line-height: 1.5; }
.tr-album-carte__action { margin-top: auto; }
.tr-album-carte:hover .tr-album-carte__media img { transform: scale(1.03); }
.tr-album-carte:hover .tr-album-carte__media--floue img { transform: scale(1.08); }

/* ==========================================================================
   Album à la une (widget tr-album-une)
   ========================================================================== */
.tr-album-une__entete { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1rem 2rem; margin-bottom: 2rem; }
.tr-album-une__carte {
	display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr); overflow: hidden;
	border-radius: var(--tr-rayon-xl, 28px); background: var(--tr-fond-marque-fonce, #16173F); color: var(--tr-texte-inverse, #fff);
	box-shadow: var(--tr-ombre-flottante, 0 24px 56px rgba(36, 37, 93, .18));
}
.tr-album-une__media { position: relative; min-height: 22rem; overflow: hidden; background: var(--tr-fond-marque, #24255D); }
.tr-album-une__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.tr-album-une__media--floue img { transform: scale(1.08); }
.tr-album-une__media--floue::after { content: ""; position: absolute; inset: 0; background: rgba(15, 16, 51, .35); }
.tr-album-une__verrou { position: absolute; inset: 0; z-index: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .875rem; font-weight: 700; color: #fff; text-shadow: 0 1px 3px rgba(0, 0, 0, .45); }
.tr-album-une__cadenas { display: grid; place-items: center; width: 4.5rem; height: 4.5rem; border-radius: 50%; background: rgba(255, 255, 255, .16); border: 2px solid rgba(255, 255, 255, .7); }
.tr-album-une__corps { display: flex; flex-direction: column; align-items: flex-start; gap: .875rem; padding: clamp(1.5rem, 1rem + 2vw, 2.5rem); }
.tr-album-une__titre { margin: 0; color: var(--tr-texte-inverse, #fff); font: 700 clamp(1.75rem, 1.2rem + 1.4vw, 2.5rem)/1.15 var(--tr-police-titres, "Bricolage Grotesque", system-ui, sans-serif); }
.tr-album-une__theme { margin: 0; color: var(--tr-texte-lumiere, #FBB86A); font: italic 1.375rem/1.4 var(--tr-police-citation, Fraunces, Georgia, serif); }
.tr-album-une__infos { display: grid; gap: .5rem; margin: .25rem 0 .5rem; padding: 0; list-style: none; color: var(--tr-texte-inverse-doux, #C9CAE3); font-size: 1rem; }
.tr-album-une__infos li { display: flex; align-items: center; gap: .625rem; }
.tr-album-une__infos .tr-icone { color: var(--tr-icone-lumiere, #F68E1E); }
.tr-album-une__actions { margin: .25rem 0 0; }
.tr-album-une__demande { margin: 0; }
.tr-album-une__demande a { display: inline-flex; align-items: center; gap: .375rem; min-height: 2.75rem; color: var(--tr-texte-lumiere, #FBB86A); font-weight: 700; }

/* ==========================================================================
   Demande de code (widget tr-demande-code)
   ========================================================================== */
.tr-demande-code { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 2rem clamp(2rem, 4vw, 4rem); align-items: center; scroll-margin-top: 7rem; }
.tr-demande-code__points { display: grid; gap: 1rem; margin: 1.75rem 0 0; padding: 0; list-style: none; }
.tr-demande-code__points li { display: flex; align-items: center; gap: .875rem; color: var(--tr-texte-secondaire, #45465F); line-height: 1.5; }
.tr-demande-code__points .tr-pastille { width: 2.25rem; height: 2.25rem; background: var(--tr-fond-froid, #F2F2F9); color: var(--tr-icone-marque, #24255D); }
.tr-demande-code__cadre { padding: clamp(1.5rem, 1rem + 2vw, 2.25rem); border-radius: var(--tr-rayon-xl, 28px); background: var(--tr-fond-doux, #FBF7F1); }
.tr-demande-code__titre { margin: 0 0 1.25rem; color: var(--tr-texte-marque, #24255D); font: 600 1.375rem/1.3 var(--tr-police-titres, "Bricolage Grotesque", system-ui, sans-serif); }

/* ==========================================================================
   Page d'album verrouillée : saisie du code
   ========================================================================== */
.tr-album-verrou { position: relative; isolation: isolate; overflow: hidden; padding: clamp(1.5rem, 1rem + 3vw, 3.5rem) 0 clamp(3rem, 2rem + 4vw, 6rem); background: var(--tr-fond-marque, #24255D); }
.tr-album-verrou__fond { position: absolute; inset: -2rem; z-index: -2; background: var(--tr-fond-marque, #24255D) center / cover no-repeat; transform: scale(1.05); }
.tr-album-verrou::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(15, 16, 51, .72), rgba(15, 16, 51, .86)); }
.tr-album-verrou__conteneur { display: flex; flex-direction: column; align-items: center; }
.tr-album-verrou__conteneur > .tr-fil-ariane { align-self: stretch; }
.tr-code {
	position: relative; display: flex; flex-direction: column; align-items: center; width: min(100%, 31rem); text-align: center;
	padding: clamp(1.75rem, 1.2rem + 2vw, 2.75rem) clamp(1.25rem, .75rem + 2vw, 2.5rem) 2rem;
	border-radius: var(--tr-rayon-xl, 28px); background: var(--tr-fond-carte, #fff); color: var(--tr-texte-principal, #1C1D3A);
	box-shadow: var(--tr-ombre-flottante, 0 24px 56px rgba(36, 37, 93, .18));
}
.tr-code__fermer { position: absolute; top: 1rem; right: 1rem; display: grid; place-items: center; width: 3rem; height: 3rem; border-radius: 50%; background: var(--tr-fond-froid, #F2F2F9); color: var(--tr-texte-marque, #24255D); }
.tr-code__pastille { width: 4rem; height: 4rem; margin-bottom: 1rem; }
.tr-code__surtitre { justify-content: center; }
.tr-code__surtitre::before { display: none; }
.tr-code__titre { margin: 0; color: var(--tr-texte-marque, #24255D); font: 700 clamp(1.75rem, 1.4rem + 1vw, 2.125rem)/1.2 var(--tr-police-titres, "Bricolage Grotesque", system-ui, sans-serif); }
.tr-code__theme { margin: .375rem 0 0; color: var(--tr-texte-marque, #24255D); font: italic 1.25rem/1.45 var(--tr-police-citation, Fraunces, Georgia, serif); }
.tr-code__consigne { margin: 1rem 0 1.25rem; color: var(--tr-texte-secondaire, #45465F); line-height: 1.55; }
.tr-code__form { display: flex; flex-direction: column; align-items: center; gap: .625rem; width: 100%; }
.tr-code__label { font-weight: 700; color: var(--tr-texte-principal, #1C1D3A); }
.tr-code__cases { position: relative; display: flex; justify-content: center; gap: .5rem; width: 100%; }
.tr-code__champ {
	width: 100%; max-width: 20rem; min-height: 3.5rem; padding: .5rem 1rem; border: 2px solid var(--tr-bordure-forte, #24255D); border-radius: var(--tr-rayon-m, 14px);
	font: 700 1.75rem/1 var(--tr-police-titres, "Bricolage Grotesque", system-ui, sans-serif); letter-spacing: .5em; text-align: center; color: var(--tr-texte-marque, #24255D); background: var(--tr-fond-carte, #fff);
}
.tr-code__case { display: none; }
/* Amélioration progressive : 6 cases visibles, un seul vrai champ (lecteurs d'écran, collage, saisie automatique du code). */
.tr-code__cases.is-actif .tr-code__champ {
	position: absolute; inset: 0; max-width: none; margin: 0 auto; opacity: 0; color: transparent; caret-color: transparent; cursor: text; z-index: 1;
}
.tr-code__cases.is-actif .tr-code__case {
	display: grid; place-items: center; width: clamp(2.75rem, 12vw, 3.5rem); height: clamp(3.25rem, 14vw, 4rem);
	border: 2px solid var(--tr-bordure-defaut, #E4E2DC); border-radius: var(--tr-rayon-m, 14px); background: var(--tr-fond-carte, #fff);
	color: var(--tr-texte-marque, #24255D); font: 700 1.75rem/1 var(--tr-police-titres, "Bricolage Grotesque", system-ui, sans-serif);
}
.tr-code__cases.is-actif .tr-code__case.is-courante { border-color: var(--tr-action-primaire, #A3141E); box-shadow: 0 0 0 3px var(--tr-fond-accent-doux, #FEF2F2); }
.tr-code__cases.is-actif:focus-within .tr-code__case.is-courante::after { content: ""; width: 2px; height: 1.6rem; background: var(--tr-texte-marque, #24255D); animation: tr-clignote 1s steps(2) infinite; }
.tr-code__cases.is-actif:focus-within { outline: 3px solid var(--tr-focus-anneau, #24255D); outline-offset: 6px; border-radius: 18px; }
.tr-code--erreur .tr-code__case { border-color: var(--tr-bordure-accent, #BC1823) !important; color: var(--tr-texte-accent, #A3141E); }
@keyframes tr-clignote { to { visibility: hidden; } }
.tr-code__aide { margin: 0; color: var(--tr-texte-discret, #4C4E66); font-size: .9375rem; }
.tr-code__erreur { display: flex; gap: .5rem; align-items: flex-start; margin: 0; color: var(--tr-texte-accent, #A3141E); font-size: .9375rem; text-align: left; }
.tr-code__souvenir { display: inline-flex; align-items: center; gap: .625rem; margin: .5rem 0; min-height: 3rem; color: var(--tr-texte-secondaire, #45465F); text-align: left; cursor: pointer; }
.tr-code__souvenir input { width: 1.375rem; height: 1.375rem; accent-color: var(--tr-action-primaire, #A3141E); }
.tr-code__piege { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.tr-code__valider { width: 100%; }
.tr-code__lien { margin: .75rem 0 0; }
.tr-code__actions { margin: 1rem 0 0; }
.tr-code__notice { width: 100%; margin-top: 1rem; text-align: left; }
.tr-code__note { display: flex; gap: .5rem; margin: 1.25rem 0 0; padding-top: 1.25rem; border-top: 1px solid var(--tr-bordure-defaut, #E4E2DC); color: var(--tr-texte-discret, #4C4E66); font-size: .9375rem; text-align: left; }

/* ==========================================================================
   Page d'album ouverte
   ========================================================================== */
.tr-album-entete { padding-top: clamp(1.5rem, 1rem + 2vw, 2.5rem); padding-bottom: clamp(2rem, 1.5rem + 2vw, 3rem); }
.tr-album-entete__bienvenue { margin-bottom: 1.5rem; }
.tr-album-entete__grille { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1.5rem 2rem; }
.tr-album-entete__texte { display: flex; flex-direction: column; align-items: flex-start; gap: .75rem; }
.tr-album-entete__titre { margin: 0; color: var(--tr-texte-marque, #24255D); font: 800 clamp(2.25rem, 1.6rem + 2vw, 3.5rem)/1.1 var(--tr-police-titres, "Bricolage Grotesque", system-ui, sans-serif); letter-spacing: -.015em; }
.tr-album-entete__theme { margin: 0; color: var(--tr-texte-secondaire, #45465F); font-size: 1.125rem; }
.tr-album-entete__theme .tr-citation { font: italic 1.375rem/1.4 var(--tr-police-citation, Fraunces, Georgia, serif); color: var(--tr-texte-marque, #24255D); }
.tr-album-entete__infos { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; margin: 0; padding: 0; list-style: none; color: var(--tr-texte-secondaire, #45465F); font-size: .9375rem; }
.tr-album-entete__infos li { display: inline-flex; align-items: center; gap: .4rem; }
.tr-album-entete__infos .tr-icone { color: var(--tr-icone-accent, #A3141E); }
.tr-album-entete__actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: .75rem 1rem; }
.tr-album-entete__zip { display: inline-flex; align-items: center; gap: .5rem; margin: 0; color: var(--tr-texte-secondaire, #45465F); font-size: .9375rem; }
.tr-btn__detail { font-weight: 400; }

.tr-album-galerie__filtres { margin-bottom: 1.5rem; }
.tr-galerie { columns: 4 15rem; column-gap: 1rem; margin: 0; padding: 0; list-style: none; }
.tr-galerie__item { position: relative; break-inside: avoid; margin: 0 0 1rem; border-radius: var(--tr-rayon-m, 14px); overflow: hidden; background: var(--tr-fond-froid, #F2F2F9); }
.tr-galerie__item[hidden] { display: none; }
.tr-galerie__lien { display: block; color: inherit; }
.tr-galerie__lien img { display: block; width: 100%; height: auto; transition: transform .35s, filter .2s; }
.tr-galerie__lien:hover img { transform: scale(1.025); }
.tr-galerie__lien:focus-visible { outline: 3px solid var(--tr-focus-anneau, #24255D); outline-offset: -3px; }
.tr-galerie__video { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .5rem; padding: 1rem; text-align: center; color: #fff; background: linear-gradient(135deg, var(--tr-fond-marque, #24255D), var(--tr-fond-marque-fonce, #16173F)); font-size: .9375rem; }
.tr-galerie__telecharger {
	position: absolute; top: .625rem; right: .625rem; display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: 50%;
	background: rgba(255, 255, 255, .94); color: var(--tr-texte-marque, #24255D); box-shadow: 0 2px 8px rgba(0, 0, 0, .18);
	opacity: 0; transition: opacity .2s;
}
.tr-galerie__item:hover .tr-galerie__telecharger, .tr-galerie__telecharger:focus-visible, .tr-galerie__item:focus-within .tr-galerie__telecharger { opacity: 1; }
@media (hover: none) { .tr-galerie__telecharger { opacity: 1; } }
.tr-galerie__case { position: absolute; top: .625rem; left: .625rem; z-index: 2; display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: 50%; background: rgba(255, 255, 255, .94); cursor: pointer; }
.tr-galerie__case input { width: 1.375rem; height: 1.375rem; margin: 0; accent-color: var(--tr-action-primaire, #A3141E); cursor: pointer; }
.tr-galerie__item.is-selectionne { outline: 4px solid var(--tr-action-primaire, #A3141E); outline-offset: -4px; }
.tr-album--selection .tr-galerie__telecharger { display: none; }
.tr-galerie__plus { display: flex; flex-direction: column; align-items: center; gap: .75rem; margin-top: 1.5rem; }
.tr-galerie__compte { margin: 0; color: var(--tr-texte-discret, #4C4E66); font-size: .9375rem; }

.tr-album-infos { padding-top: 0; }
.tr-album-infos__grille { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; }
.tr-album-infos__cadre { display: flex; gap: 1rem; align-items: flex-start; padding: 1.5rem; border-radius: var(--tr-rayon-l, 20px); background: var(--tr-statut-info-doux, #EEF3FB); }
.tr-album-infos__cadre--telecharger { background: var(--tr-fond-lumiere, #FFF6EB); }
.tr-album-infos__cadre .tr-pastille { background: var(--tr-fond-carte, #fff); color: var(--tr-icone-marque, #24255D); }
.tr-album-infos__cadre--telecharger .tr-pastille { color: var(--tr-icone-accent, #A3141E); }
.tr-album-infos__titre { margin: 0 0 .375rem; color: var(--tr-texte-marque, #24255D); font: 600 1.25rem/1.3 var(--tr-police-titres, "Bricolage Grotesque", system-ui, sans-serif); }
.tr-album-infos__cadre p { margin: 0 0 .5rem; color: var(--tr-texte-secondaire, #45465F); line-height: 1.6; }
.tr-album-infos__cadre p:last-child { margin-bottom: 0; }
.tr-album-infos__cadre a:not(.tr-btn) { color: var(--tr-texte-accent, #A3141E); font-weight: 700; }

/* Barre de sélection */
.tr-selection {
	position: fixed; left: 50%; bottom: max(1rem, env(safe-area-inset-bottom)); z-index: 50; transform: translateX(-50%);
	display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .75rem 1rem; width: max-content; max-width: calc(100vw - 2rem);
	padding: .75rem 1rem .75rem 1.25rem; border-radius: 999px; background: var(--tr-fond-marque-fonce, #16173F); color: #fff; box-shadow: var(--tr-ombre-flottante, 0 24px 56px rgba(36, 37, 93, .18));
}
.tr-selection[hidden] { display: none; }
.tr-selection__nombre { display: inline-flex; align-items: center; gap: .5rem; margin: 0; font-weight: 700; }
.tr-selection__nombre .tr-icone { color: var(--tr-icone-lumiere, #F68E1E); }

/* Visionneuse */
.tr-visionneuse { width: 100vw; max-width: none; height: 100dvh; max-height: none; margin: 0; padding: 0; border: 0; background: rgba(10, 11, 36, .97); color: #fff; overflow: hidden; }
.tr-visionneuse::backdrop { background: rgba(10, 11, 36, .9); }
.tr-visionneuse[open] { display: grid; grid-template-rows: auto 1fr; }
.tr-visionneuse__barre { display: flex; align-items: center; gap: .75rem; padding: .75rem 1rem; }
.tr-visionneuse__titre { flex: 1; margin: 0; font-size: 1rem; line-height: 1.4; }
.tr-visionneuse__bouton {
	display: inline-flex; align-items: center; gap: .5rem; min-height: 3rem; padding: .5rem 1rem; border: 2px solid rgba(255, 255, 255, .7); border-radius: 999px;
	background: transparent; color: #fff; font: 700 1rem/1 var(--tr-police-texte, system-ui, sans-serif); text-decoration: none; cursor: pointer;
}
.tr-visionneuse__bouton:hover { background: rgba(255, 255, 255, .12); }
.tr-visionneuse__scene { position: relative; display: grid; place-items: center; min-height: 0; padding: 0 4.5rem 1.5rem; }
.tr-visionneuse__image, .tr-visionneuse__video { max-width: 100%; max-height: calc(100dvh - 6rem); object-fit: contain; border-radius: 6px; }
.tr-visionneuse__nav {
	position: absolute; top: 50%; display: grid; place-items: center; width: 3.5rem; height: 3.5rem; border: 0; border-radius: 50%;
	background: rgba(255, 255, 255, .14); color: #fff; cursor: pointer; transform: translateY(-50%);
}
.tr-visionneuse__nav:hover { background: rgba(255, 255, 255, .26); }
.tr-visionneuse__nav--prec { left: 1rem; }
.tr-visionneuse__nav--suiv { right: 1rem; }
.tr-visionneuse :focus-visible { outline: 3px solid #fff; outline-offset: 3px; }

/* ==========================================================================
   Adaptations
   ========================================================================== */
@media (max-width: 1024px) {
	.tr-albums__grille { --tr-colonnes: 2; }
	.tr-album-une__carte { grid-template-columns: 1fr; }
	.tr-album-une__media { min-height: 15rem; }
}
@media (max-width: 760px) {
	.tr-albums__grille { --tr-colonnes: 1; gap: 1rem; }
	.tr-album-infos__grille { grid-template-columns: 1fr; }
	.tr-demande-code { grid-template-columns: 1fr; }
	.tr-galerie { columns: 2; column-gap: .625rem; }
	.tr-galerie__item { margin-bottom: .625rem; border-radius: 12px; }
	.tr-album-entete__actions { justify-content: flex-start; width: 100%; }
	.tr-album-entete__actions .tr-btn { flex: 1 1 auto; }
	.tr-visionneuse__scene { padding: 0 .5rem 5.5rem; }
	.tr-visionneuse__nav { top: auto; bottom: 1rem; transform: none; }
	.tr-visionneuse__nav--prec { left: calc(50% - 4.25rem); }
	.tr-visionneuse__nav--suiv { right: calc(50% - 4.25rem); }
	.tr-visionneuse__bouton span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
	.tr-selection { border-radius: 20px; }
}
@media (prefers-reduced-motion: reduce) {
	.tr-album-carte__media img, .tr-galerie__lien img { transition: none; }
	.tr-code__case.is-courante::after { animation: none; }
}
@media print {
	.tr-galerie__telecharger, .tr-galerie__case, .tr-selection, .tr-visionneuse { display: none !important; }
}

/* Astra souligne tous les liens du contenu (.ast-single-post .entry-content a) : pas sur nos cartes et boutons. */
body .entry-content :is(.tr-albums, .tr-album-une, .tr-demande-code) a:is(.tr-btn, .tr-album-carte__lien):not(:hover, :focus-visible) { text-decoration: none; }
body .entry-content .tr-album-une__demande a:not(:hover, :focus-visible) { text-decoration: none; }

/* ---------- C1 (pages plus courtes, maquette mobile 20:9814) ---------- */
@media (max-width: 760px) {
	/* Cartes d'albums en lignes compactes : vignette à gauche ; statut (« Album protégé / public »), titre et date à droite. */
	.tr-albums__entete { margin-bottom: 1.25rem; }
	.tr-albums__grille { gap: .75rem; }
	.tr-album-carte { display: grid; grid-template-columns: 6rem minmax(0, 1fr); grid-template-rows: auto 1fr; grid-template-areas: "vignette statut" "vignette corps"; border-radius: var(--tr-rayon-m, 14px); box-shadow: none; }
	.tr-album-carte__media { display: contents; }
	.tr-album-carte__media > img, .tr-album-carte__vide { grid-area: vignette; width: 100%; height: 100%; min-height: 6.5rem; object-fit: cover; transform: none !important; background: var(--tr-fond-marque, #24255D); }
	.tr-album-carte__badge { grid-area: statut; position: static; justify-self: start; margin: .75rem 1rem 0; }
	.tr-album-carte__media::after, .tr-album-carte__compteur { display: none; }
	.tr-album-carte__corps { grid-area: corps; gap: .25rem; padding: .375rem 1rem .875rem; }
	.tr-album-carte__titre { font-size: 1.125rem; }
	.tr-album-carte__meta { margin: 0 0 .375rem; }
	.tr-albums__plus { margin-top: 1.5rem; }
	/* Album à la une plus court. */
	.tr-album-une__entete { margin-bottom: 1.25rem; }
	.tr-album-une__media { min-height: 9rem; }
	.tr-album-une__corps { gap: .625rem; padding: 1.25rem; }
	.tr-album-une__theme { font-size: 1.125rem; }
	.tr-album-une__infos { margin: 0; }
}
@media (max-width: 760px) {
	/* C1 : lignes d'albums sans bouton (toute la carte est un lien). */
	.tr-album-carte__action { display: none; }
	.tr-album-carte__meta { margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
	.tr-album-une__media { min-height: 7.5rem; }
}

/* C1 : « .entry-content p » (Astra, 1,6 em) et les marges de titres du thème parent l'emportaient sur les « margin: 0 » du module et s'ajoutaient aux espacements (gap). */
.tr-album-une .tr-album-une__corps > :is(p, ul, h2, h3, h4), .tr-album-carte .tr-album-carte__titre, .tr-demande-code .tr-demande-code__cadre > :is(p, h2, h3, h4) { margin-bottom: 0; }
.tr-album-une .tr-album-une__infos { margin-top: 0; padding: 0; }
.tr-album-carte .tr-album-carte__meta { margin-bottom: .5rem; }
@media (max-width: 760px) { .tr-album-carte .tr-album-carte__meta { margin-bottom: 0; } }
/* C1 : badges et compteur dans la photo, à 24 px du bord (règle commune aux images). */
@media (min-width: 761px) { .tr-album-carte .tr-album-carte__badge { top: 1.5rem; left: 1.5rem; } .tr-album-carte .tr-album-carte__compteur { left: 1.5rem; bottom: 1.5rem; } }
