/* Enveloppe de ces deux pages uniquement ; aucun style commun redéfini. */
#tp-cm-page { grid-column: 1 / -1; grid-row: 6; order: 8; margin: 0; --tp-cm-marge-page: 14px; --tp-cm-espace-annonce: 150px; --tp-cm-largeur-annonce: 160px; --tp-cm-fond-cadre: #f8f7ef; padding: 0 var(--tp-cm-marge-page) 24px; min-width: 0; background: transparent; }
#tp-cm-page .tp-cm-fil { text-align: left; color: #ffffcc; font: 14px/1.6 Helvetica, Arial, sans-serif; margin: 0 0 14px calc(20px - var(--tp-cm-marge-page)); overflow-wrap: anywhere; }
#tp-cm-page .tp-cm-cadre { box-sizing: border-box; min-width: 0; padding: 24px; border-radius: 12px; background: var(--tp-cm-fond-cadre); }
#tp-cm-page .tp-cm-titre { font: bold clamp(1.25rem, 2.2vw, 1.625rem)/1.3 Arial, sans-serif; text-align: left; color: var(--tp-cm-ink); margin: 0 0 20px; padding: 0; }
/* Cadre clair commun ; l'annonce reste distincte du plateau interactif, à 150 px. */
#tp-cm-page .tp-cm-jeu-layout { margin: 0; }
#tp-cm-page .tp-cm-jeu-layout > .tp-construction-proto { box-sizing: border-box; min-width: 0; width: 100%; max-width: none; margin: 0; background: var(--tp-cm-white); }
#tp-cm-page .tp-cm-annonce-gauche { display: none; width: 160px; padding: 0; background: transparent; text-align: center; }
#tp-cm-page .tp-cm-annonce-gauche .tp-ad-label { display: block; margin-bottom: 8px; color: var(--tp-cm-muted); font: 12px/1.4 Arial, sans-serif; }
#tp-cm-page .tp-cm-annonce-gauche .pubVerticaleGauche { width: 160px; height: 600px; margin: 0; }
#tp-cm-page .tp-cm-annonce-verticale-factice { box-sizing: border-box; display: grid; place-content: center; width: 160px; height: 600px; padding: 8px; border: 1px solid #c9cec3; color: #51584e; background: #eeeee9; font: 14px/1.5 Arial, sans-serif; }
@media (min-width: 1100px) {
 #tp-cm-page .tp-cm-titre { margin-left: calc(var(--tp-cm-largeur-annonce) + var(--tp-cm-espace-annonce)); }
 #tp-cm-page .tp-cm-cadre-erreur .tp-cm-titre { margin-left: 0; }
 #tp-cm-page .tp-cm-jeu-layout { display: grid; grid-template-columns: var(--tp-cm-largeur-annonce) minmax(0, 1fr); column-gap: var(--tp-cm-espace-annonce); }
 #tp-cm-page .tp-cm-jeu-layout > .tp-construction-proto { grid-column: 2; grid-row: 1; }
 #tp-cm-page .tp-cm-annonce-gauche { display: block; grid-column: 1; grid-row: 1; align-self: center; }
}
#tp-cm-page .tp-construction-proto a[data-action] { display: inline-flex; align-items: center; justify-content: center; gap: .5em; box-sizing: border-box; min-height: 52px; padding: 12px 22px; color: #fff; background: var(--tp-cm-green); border: 2px solid var(--tp-cm-green-dark); border-radius: var(--tp-cm-radius); font: bold 1.1rem/1.4 var(--tp-cm-font); text-decoration: none; cursor: pointer; }
#tp-cm-page .tp-construction-proto a[data-action]:hover { background: var(--tp-cm-green-dark); }
#tp-cm-page .tp-cm-annonce-bas { margin-top: 160px; text-align: center; }
#tp-cm-page .tp-cm-annonce-bas > p { color: #ffffcc; font: 12px Arial, sans-serif; text-align: center; }
#tp-cm-page .tp-cm-annonce-factice { min-height: 90px; padding: 15px; box-sizing: border-box; display: grid; place-items: center; color: #374151; background: #eee; border: 1px dashed #777; font: 14px Arial, sans-serif; }
#tp-cm-page .tp-cm-erreur { padding: 24px; color: #243e4b; background: #fffdf7; border-radius: 12px; }
#tp-cm-page [hidden] { display: none !important; }
@media (max-width: 600px) {
 #tp-cm-page { --tp-cm-marge-page: 8px; }
 #tp-cm-page .tp-construction-proto a[data-action] { width: 100%; }
 #tp-cm-page .tp-cm-cadre { padding: 16px 12px; }
}

/* Réglages limités à ces pages hôtes ; les feuilles publicitaires communes restent intactes. */
#tp-cm-page .tp-construction-proto h2 { font-size: clamp(1.25rem, 2vw, 1.5rem); }
#tp-cm-page .tp-cm-annonce-bas .tp-cm-annonce-factice { width: 90%; min-height: 280px; margin: 15px auto; }
.tp-cm-hote #affichage728x90 .tp-cm-ad-label { display: block; text-align: center; color: #ffffcc; font: 12px/1.4 Arial, sans-serif; }
.tp-cm-hote #affichage728x90 .pubHorizontaleHeader { width: 728px; height: 90px; }
.tp-cm-hote #affichage728x90 .tp-cm-header-factice { box-sizing: border-box; display: grid; place-items: center; border: 1px dashed #ffffcc; color: #ffffcc; font: 14px/1.5 Arial, sans-serif; }
/* Ne pas comprimer le bloc fixe de 728 px dans une colonne devenue trop étroite. */
@media (max-width: 1199px) {
 .tp-cm-hote #affichage728x90 { display: none; }
}
