:root {
  --brc-rouge: #FB090B;
  --brc-rouge-sombre: #C10709;

  --fond: #FFFFFF;
  --fond-doux: #F4F4F4;
  --texte: #111111;
  --texte-doux: #555555;
  --bord: #e2e2e2;
  --bord-champ: #cfcfcf;

  --topbar-fond: #111111;
  --topbar-texte: #FFFFFF;

  --radius: 10px;
  --ombre: 0 2px 10px rgba(17, 17, 17, 0.08);
}

@media (prefers-color-scheme: dark) {
  :root {
    --fond: #171717;
    --fond-doux: #232323;
    --texte: #ECECEC;
    --texte-doux: #A8A8A8;
    --bord: #343434;
    --bord-champ: #4A4A4A;
    --ombre: 0 2px 12px rgba(0, 0, 0, 0.55);
  }
}

:root { color-scheme: light dark; }

* { box-sizing: border-box; }

html, body {
  margin: 0;
  min-height: 100%;
}

body {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  color: var(--texte);
  background: var(--fond);
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

p, .sous-titre, .mention-rgpd, .lede, .cv-titre { text-wrap: pretty; }

.topbar {
  background: var(--topbar-fond);
  color: var(--topbar-texte);
  border-bottom: 4px solid var(--brc-rouge);
}
.topbar-inner {
  max-width: 960px;
  margin: 0 auto;
  padding: 0.9rem 1.2rem;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
}
.logo {
  font-weight: 800;
  font-size: 1.35rem;
  letter-spacing: 0.02em;
}
.logo-accent { color: var(--brc-rouge); }
.tagline-top {
  font-size: 0.8rem;
  color: #bbbbbb;
}

.hero {
  flex: 1;
  max-width: 960px;
  margin: 0 auto;
  padding: 3.5rem 1.2rem 4rem;
  text-align: center;
}
.eyebrow {
  display: inline-block;
  color: var(--brc-rouge);
  font-weight: 700;
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  margin: 0 0 1rem;
}
.hero h1 {
  font-size: clamp(1.7rem, 4.5vw, 2.6rem);
  line-height: 1.2;
  margin: 0 0 1rem;
}
.lede {
  color: var(--texte-doux);
  font-size: 1.05rem;
  max-width: 34rem;
  margin: 0 auto 2rem;
  line-height: 1.6;
}
.status-pill {
  display: inline-block;
  background: var(--fond-doux);
  border: 1px solid var(--bord);
  border-radius: 999px;
  padding: 0.5rem 1.1rem;
  font-size: 0.9rem;
  color: var(--texte);
}

.footer {
  background: var(--fond-doux);
  border-top: 1px solid var(--bord);
  text-align: center;
  padding: 1rem;
  font-size: 0.8rem;
  color: var(--texte-doux);
}

.btn {
  display: inline-block;
  background: var(--brc-rouge);
  color: #FFFFFF;
  border: none;
  border-radius: var(--radius);
  padding: 0.7rem 1.4rem;
  font-size: 1rem;
  font-weight: 700;
  cursor: pointer;
  text-decoration: none;
  transition: background 0.15s ease;
}
.btn:hover, .btn:focus-visible { background: var(--brc-rouge-sombre); }
.btn:focus-visible { outline: 3px solid var(--texte); outline-offset: 2px; }

.btn-secondaire {
  background: var(--fond);
  color: var(--texte);
  border: 2px solid var(--texte);
}
.btn-secondaire:hover, .btn-secondaire:focus-visible {
  background: var(--texte);
  color: var(--fond);
}

@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; }
}

.nav-actions {
  display: flex;
  gap: 0.6rem;
  align-items: center;
}
.nav-lien {
  color: var(--topbar-texte);
  text-decoration: none;
  font-size: 0.9rem;
  font-weight: 600;
  padding: 0.35rem 0.8rem;
  border: 1px solid #444;
  border-radius: 999px;
}
.nav-lien:hover, .nav-lien:focus-visible { border-color: var(--brc-rouge); }

.actions-hero {
  display: flex;
  gap: 0.8rem;
  justify-content: center;
  flex-wrap: wrap;
  margin-bottom: 2rem;
}

.page-etroite {
  flex: 1;
  width: 100%;
  max-width: 480px;
  margin: 0 auto;
  padding: 2.2rem 1.2rem 3rem;
}
.carte {
  background: var(--fond);
  border: 1px solid var(--bord);
  border-radius: var(--radius);
  box-shadow: var(--ombre);
  padding: 1.6rem 1.4rem;
}
.carte h1 {
  font-size: 1.45rem;
  margin: 0 0 0.4rem;
}
.sous-titre {
  color: var(--texte-doux);
  font-size: 0.95rem;
  margin: 0 0 1.4rem;
  line-height: 1.5;
}

.champ { margin-bottom: 1rem; }
.champ label {
  display: block;
  font-weight: 600;
  font-size: 0.9rem;
  margin-bottom: 0.3rem;
}
.champ .optionnel {
  font-weight: 400;
  color: var(--texte-doux);
  font-size: 0.8rem;
}
.champ input[type="text"],
.champ input[type="email"],
.champ input[type="tel"] {
  width: 100%;
  padding: 0.65rem 0.8rem;
  font-size: 1rem;
  border: 1.5px solid var(--bord-champ);
  border-radius: var(--radius);
  background: var(--fond);
  color: var(--texte);
}
.champ input:focus-visible {
  outline: none;
  border-color: var(--brc-rouge);
  box-shadow: 0 0 0 3px rgba(251, 9, 11, 0.15);
}

.consentement {
  display: flex;
  gap: 0.6rem;
  align-items: flex-start;
  background: var(--fond-doux);
  border: 1px solid var(--bord);
  border-radius: var(--radius);
  padding: 0.8rem;
  margin: 1.2rem 0;
  font-size: 0.85rem;
  line-height: 1.5;
  color: var(--texte);
}
.consentement input[type="checkbox"] {
  margin-top: 0.2rem;
  width: 1.1rem;
  height: 1.1rem;
  accent-color: var(--brc-rouge);
  flex-shrink: 0;
}
.mention-rgpd {
  font-size: 0.78rem;
  color: var(--texte-doux);
  line-height: 1.5;
  margin-top: 1.2rem;
}

.btn-large { width: 100%; padding: 0.8rem 1rem; font-size: 1.05rem; }

.alerte {
  border-radius: var(--radius);
  padding: 0.8rem 1rem;
  font-size: 0.92rem;
  line-height: 1.5;
  margin-bottom: 1rem;
  display: none;
}
.alerte.visible { display: block; }
.alerte-erreur { background: #FDECEC; border: 1px solid var(--brc-rouge); color: #8f0506; }
.alerte-succes { background: #EDF7EE; border: 1px solid #2e7d32; color: #1d5220; }

.lien-bascule {
  text-align: center;
  font-size: 0.9rem;
  margin-top: 1.2rem;
  color: var(--texte-doux);
}
.lien-bascule a { color: var(--brc-rouge); font-weight: 600; }

.info-ligne {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.65rem 0;
  border-bottom: 1px solid var(--bord);
  font-size: 0.95rem;
}
.info-ligne:last-of-type { border-bottom: none; }
.info-ligne .etiquette { color: var(--texte-doux); }
.info-ligne .valeur { font-weight: 600; text-align: right; word-break: break-word; }

.zone-danger {
  margin-top: 1.6rem;
  border: 1px solid var(--brc-rouge);
  border-radius: var(--radius);
  padding: 1rem 1.2rem;
}
.zone-danger h2 {
  font-size: 1rem;
  color: var(--brc-rouge);
  margin: 0 0 0.4rem;
}
.zone-danger p {
  font-size: 0.85rem;
  color: var(--texte-doux);
  margin: 0 0 0.9rem;
  line-height: 1.5;
}
.btn-danger {
  background: var(--fond);
  color: var(--brc-rouge);
  border: 2px solid var(--brc-rouge);
}
.btn-danger:hover, .btn-danger:focus-visible {
  background: var(--brc-rouge);
  color: #FFFFFF;
}

.logo-lien { text-decoration: none; }
.logo-mark {
  font-weight: 800;
  font-size: 1.3rem;
  letter-spacing: 0.5px;
  color: var(--topbar-texte);
  white-space: nowrap;
}
.logo-mark b { color: var(--brc-rouge); font-weight: 800; }

.page-moyenne {
  flex: 1;
  width: 100%;
  max-width: 720px;
  margin: 0 auto;
  padding: 2.2rem 1.2rem 3rem;
}
.champ select, .champ textarea {
  width: 100%;
  padding: 0.65rem 0.8rem;
  font-size: 1rem;
  border: 1.5px solid var(--bord-champ);
  border-radius: var(--radius);
  background: var(--fond);
  color: var(--texte);
  font-family: inherit;
}
.champ textarea { min-height: 110px; resize: vertical; }
.champ select:focus-visible, .champ textarea:focus-visible {
  outline: none;
  border-color: var(--brc-rouge);
  box-shadow: 0 0 0 3px rgba(251, 9, 11, 0.15);
}
.rangee { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1rem; }
@media (max-width: 540px) { .rangee { grid-template-columns: 1fr; } }

.encart-avertissement {
  background: #FFF7E6;
  border: 1px solid #E6A700;
  border-radius: var(--radius);
  padding: 0.8rem 1rem;
  font-size: 0.85rem;
  line-height: 1.55;
  margin: 0.8rem 0;
}
.encart-avertissement strong { color: #8a6400; }

.grille-previews {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
  gap: 0.6rem;
  margin: 0.8rem 0;
}
.vignette {
  position: relative;
  aspect-ratio: 1;
  border-radius: var(--radius);
  overflow: hidden;
  border: 1px solid var(--bord);
  background: var(--fond-doux);
}
.vignette img { width: 100%; height: 100%; object-fit: cover; display: block; }
.vignette .retirer {
  position: absolute;
  top: 4px; right: 4px;
  width: 24px; height: 24px;
  border-radius: 50%;
  border: none;
  background: rgba(17,17,17,0.85);
  color: #fff;
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
}
.vignette .retirer:hover { background: var(--brc-rouge); }

.liste-annonces { display: flex; flex-direction: column; gap: 1rem; }
.carte-annonce {
  display: flex;
  gap: 1rem;
  background: var(--fond);
  border: 1px solid var(--bord);
  border-radius: var(--radius);
  box-shadow: var(--ombre);
  padding: 0.9rem;
}
.carte-annonce .miniature {
  width: 96px; height: 96px;
  flex-shrink: 0;
  border-radius: var(--radius);
  overflow: hidden;
  background: var(--fond-doux);
  display: flex; align-items: center; justify-content: center;
  color: var(--texte-doux);
  font-size: 0.75rem;
}
.carte-annonce .miniature img { width: 100%; height: 100%; object-fit: cover; }
.carte-annonce .corps { flex: 1; min-width: 0; }
.carte-annonce h3 { margin: 0 0 0.25rem; font-size: 1.05rem; }
.carte-annonce .prix { font-weight: 800; color: var(--texte); }
.carte-annonce .meta { font-size: 0.82rem; color: var(--texte-doux); margin: 0.2rem 0 0.6rem; overflow-wrap: anywhere; }
.actions-annonce { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.btn-petit {
  font-size: 0.8rem;
  padding: 0.35rem 0.7rem;
  border-radius: 8px;
  border: 1.5px solid var(--bord-champ);
  background: var(--fond);
  color: var(--texte);
  cursor: pointer;
  text-decoration: none;
}
.btn-petit:hover { border-color: var(--brc-rouge); color: var(--brc-rouge); }
.btn-petit.danger { border-color: var(--brc-rouge); color: var(--brc-rouge); }
.btn-petit.danger:hover { background: var(--brc-rouge); color: #fff; }

.badge {
  display: inline-block;
  font-size: 0.72rem;
  font-weight: 700;
  padding: 0.15rem 0.55rem;
  border-radius: 999px;
  vertical-align: middle;
  margin-left: 0.4rem;
}
.badge-en_vente  { background: #EDF7EE; color: #1d5220; border: 1px solid #2e7d32; }
.badge-reservee  { background: #FFF7E6; color: #8a6400; border: 1px solid #E6A700; }
.badge-vendue    { background: #ECEFF7; color: #23407a; border: 1px solid #3B5BA5; }
.badge-retiree, .badge-expiree { background: #F1F1F1; color: #666; border: 1px solid #bbb; }

.entete-page {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
  margin-bottom: 1.2rem;
}
.entete-page h1 { margin: 0; font-size: 1.45rem; }

.vide {
  text-align: center;
  color: var(--texte-doux);
  padding: 2.5rem 1rem;
  border: 1.5px dashed var(--bord);
  border-radius: var(--radius);
}

@media (max-width: 600px) {
  html { font-size: 18.5px; }

  html, body { overflow-x: hidden; }

  .page-etroite, .page-moyenne { padding: 1rem 0.6rem 2.4rem; }
  .carte { padding: 1.2rem 0.9rem; }
  .carte h1 { font-size: 1.5rem; }
  .topbar-inner { padding: 0.8rem 0.9rem; }
  .logo-mark { font-size: 1.4rem; }
  .hero { padding: 2.2rem 1rem 2.6rem; }
  .hero h1 { font-size: 1.6rem; line-height: 1.25; }
  .lede { font-size: 1rem; }

  .btn-petit { font-size: 0.92rem; padding: 0.55rem 0.9rem; }
  .nav-lien { font-size: 0.95rem; padding: 0.45rem 0.9rem; }
  .badge { font-size: 0.78rem; }
  .info-ligne { font-size: 1rem; padding: 0.75rem 0; }
  .meta { font-size: 0.9rem; }
  .consentement, .encart-avertissement { font-size: 0.92rem; }
  .mention-rgpd { font-size: 0.85rem; }

  .carte-annonce { flex-direction: column; }
  .carte-annonce .miniature { width: 100%; height: 180px; }
}

input, select, textarea { font-size: max(1rem, 16px); }

.bandeau-intro {
  max-width: 960px;
  margin: 0 auto;
  padding: 1.6rem 1.2rem 0.4rem;
  text-align: center;
}
.bandeau-intro h1 { font-size: clamp(1.3rem, 3.5vw, 1.8rem); margin: 0 0 0.4rem; }
.bandeau-intro p { color: var(--texte-doux); font-size: 0.95rem; margin: 0 0 1rem; line-height: 1.5; }

.page-vitrine {
  flex: 1;
  width: 100%;
  max-width: 960px;
  margin: 0 auto;
  padding: 0.6rem 1rem 3rem;
}

.filtres {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.6rem;
  margin: 0.8rem 0 1.4rem;
}
@media (max-width: 700px) { .filtres { grid-template-columns: 1fr 1fr; } }
.filtres select, .filtres input {
  width: 100%;
  padding: 0.55rem 0.7rem;
  border: 1.5px solid var(--bord-champ);
  border-radius: var(--radius);
  background: var(--fond);
  color: var(--texte);
  font-family: inherit;
}
.compteur-resultats {
  color: var(--texte-doux);
  font-size: 0.88rem;
  margin: 0 0 1rem;
}

.grille-vitrine {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
  gap: 0.9rem;
}
@media (max-width: 420px) { .grille-vitrine { grid-template-columns: 1fr 1fr; gap: 0.7rem; } }

.carte-vitrine {
  position: relative;
  display: block;
  background: var(--fond);
  border: 1px solid var(--bord);
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--ombre);
  text-decoration: none;
  color: inherit;
}
.carte-vitrine:hover, .carte-vitrine:focus-visible { border-color: var(--brc-rouge); }
.cv-photo {
  aspect-ratio: 1;
  background: var(--fond-doux);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--texte-doux);
  font-size: 0.8rem;
  overflow: hidden;
}
.cv-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cv-corps { padding: 0.6rem 0.7rem 0.75rem; }
.cv-prix { font-weight: 800; font-size: 1.05rem; }
.cv-titre {
  font-size: 0.9rem;
  line-height: 1.3;
  margin: 0.15rem 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.cv-meta { font-size: 0.78rem; color: var(--texte-doux); }

.carte-vitrine.est-reservee .cv-photo,
.carte-vitrine.est-reservee .cv-corps { filter: grayscale(1); opacity: 0.55; }
.badge-flottant {
  position: absolute;
  top: 8px; left: 8px;
  z-index: 1;
  margin: 0;
}

.fil-retour {
  display: inline-block;
  color: var(--texte-doux);
  text-decoration: none;
  font-size: 0.9rem;
  margin-bottom: 0.8rem;
}
.fil-retour:hover { color: var(--brc-rouge); }

.carrousel {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  border-radius: var(--radius);
  background: var(--fond-doux);
  border: 1px solid var(--bord);
  -webkit-overflow-scrolling: touch;
}
.carrousel img {
  width: 100%;
  flex-shrink: 0;
  scroll-snap-align: center;
  object-fit: contain;
  max-height: 70vh;
  display: block;
}
.carrousel-indic {
  text-align: center;
  color: var(--texte-doux);
  font-size: 0.82rem;
  margin: 0.4rem 0 1rem;
}

.fiche-prix { font-size: 1.7rem; font-weight: 800; margin: 0.8rem 0 0.2rem; }
.fiche-titre { font-size: 1.25rem; margin: 0 0 0.8rem; line-height: 1.3; }
.etiquettes { display: flex; flex-wrap: wrap; gap: 0.45rem; margin: 0 0 1rem; }
.etiquette {
  background: var(--fond-doux);
  border: 1px solid var(--bord);
  border-radius: 999px;
  font-size: 0.82rem;
  padding: 0.25rem 0.7rem;
  color: var(--texte);
}
.fiche-description {
  white-space: pre-wrap;
  line-height: 1.6;
  margin: 0 0 1.4rem;
}
.fiche-vendeur {
  background: var(--fond-doux);
  border: 1px solid var(--bord);
  border-radius: var(--radius);
  padding: 0.9rem 1rem;
  font-size: 0.92rem;
  margin-bottom: 1rem;
}
.bandeau-reserve {
  background: #FFF7E6;
  border: 1px solid #E6A700;
  color: #8a6400;
  border-radius: var(--radius);
  padding: 0.7rem 1rem;
  font-size: 0.9rem;
  margin-bottom: 1rem;
}

@media (prefers-color-scheme: dark) {
  .alerte-erreur { background: #3a1414; border-color: #a33; color: #f5b5b5; }
  .alerte-succes { background: #14301b; border-color: #2e7d32; color: #a9dcae; }
  .encart-avertissement, .bandeau-reserve { background: #332a10; border-color: #a98410; color: #e8c96a; }
  .encart-avertissement strong { color: #f0d47a; }
  .badge-en_vente { background: #14301b; color: #a9dcae; }
  .badge-reservee { background: #332a10; color: #e8c96a; }
  .badge-vendue { background: #16233d; color: #a9c1ec; }
  .badge-retiree, .badge-expiree { background: #2a2a2a; color: #999; border-color: #555; }
  .zone-danger { border-color: #a33; }
  .vignette .retirer { background: rgba(0, 0, 0, 0.75); }
}

.btn-like {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  background: var(--fond);
  border: 1.5px solid var(--bord);
  border-radius: 999px;
  padding: 0.35rem 0.75rem;
  cursor: pointer;
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--texte);
  transition: border-color 0.15s ease, transform 0.1s ease;
}
.btn-like:hover { border-color: var(--brc-rouge); }
.btn-like:active { transform: scale(0.94); }
.btn-like svg { width: 20px; height: 20px; display: block; }
.btn-like .forme { fill: none; stroke: var(--texte-doux); stroke-width: 1.6; transition: fill 0.15s ease, stroke 0.15s ease; }
.btn-like.aime .forme { fill: var(--brc-rouge); stroke: var(--brc-rouge); }
.btn-like.aime { border-color: var(--brc-rouge); color: var(--brc-rouge); }

.cv-like {
  position: absolute;
  top: 8px; right: 8px;
  z-index: 1;
  background: color-mix(in srgb, var(--fond) 88%, transparent);
  backdrop-filter: blur(3px);
  padding: 0.28rem 0.6rem;
  font-size: 0.82rem;
}

.stats-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
  gap: 0.6rem;
  margin: 0 0 1.4rem;
}
.stat-carte {
  background: var(--fond);
  border: 1px solid var(--bord);
  border-radius: var(--radius);
  padding: 0.7rem 0.6rem;
  text-align: center;
}
.stat-carte .valeur { font-size: 1.5rem; font-weight: 800; display: block; }
.stat-carte .intitule { font-size: 0.75rem; color: var(--texte-doux); }

.suggestion-email {
  display: none;
  margin: 0.45rem 0 0;
  padding: 0.5rem 0.7rem;
  font-size: 0.85rem;
  line-height: 1.45;
  background: #FFF7E6;
  border: 1px solid #E6A700;
  border-radius: var(--radius);
  color: #8a6400;
}
.lien-correction {
  background: none;
  border: none;
  padding: 0;
  font: inherit;
  font-weight: 700;
  color: var(--brc-rouge);
  text-decoration: underline;
  cursor: pointer;
}
.rappel-adresse {
  display: none;
  margin: 0 0 1rem;
  font-size: 0.88rem;
  line-height: 1.5;
  color: var(--texte-doux);
}
@media (prefers-color-scheme: dark) {
  .suggestion-email { background: #332a10; border-color: #a98410; color: #e8c96a; }
}

.bandeau-installation {
  display: none;
  align-items: center;
  gap: 0.7rem;
  max-width: 960px;
  margin: 0 auto 0.4rem;
  padding: 0.6rem 1rem;
  background: var(--fond-doux);
  border: 1px solid var(--bord);
  border-radius: var(--radius);
  font-size: 0.88rem;
  line-height: 1.4;
}
.bandeau-installation .inst-texte { flex: 1; min-width: 0; }
.bandeau-installation .inst-action { flex-shrink: 0; white-space: nowrap; }
.bandeau-installation .inst-fermer {
  flex-shrink: 0;
  background: none;
  border: none;
  color: var(--texte-doux);
  font-size: 1rem;
  line-height: 1;
  padding: 0.3rem;
  cursor: pointer;
}
.bandeau-installation .inst-fermer:hover { color: var(--brc-rouge); }
@media (max-width: 600px) {
  .bandeau-installation { margin: 0 0.6rem 0.4rem; }
}

.page-texte h1 { font-size: 1.5rem; margin: 0 0 0.4rem; }
.page-texte h2 {
  font-size: 1.15rem;
  margin: 2rem 0 0.6rem;
  padding-top: 1.2rem;
  border-top: 1px solid var(--bord);
}
.page-texte h3 { font-size: 1rem; margin: 1.4rem 0 0.4rem; }
.page-texte p, .page-texte li { line-height: 1.65; }
.page-texte ul, .page-texte ol { padding-left: 1.3rem; }
.page-texte li { margin-bottom: 0.4rem; }
.page-texte a { color: var(--brc-rouge); }

.tableau-simple {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.92rem;
  margin: 0.8rem 0 0.4rem;
}
.tableau-simple th, .tableau-simple td {
  text-align: left;
  padding: 0.5rem 0.6rem;
  border-bottom: 1px solid var(--bord);
  vertical-align: top;
}
.tableau-simple th { background: var(--fond-doux); font-size: 0.85rem; }
.tableau-simple td:first-child { white-space: nowrap; }
@media (max-width: 520px) {
  .tableau-simple td:first-child { white-space: normal; }
}

.footer .pied-liens {
  margin: 0.4rem 0 0;
  font-size: 0.85rem;
  line-height: 1.5;
}
.footer .lien-pied { color: inherit; text-decoration: underline; }
.footer .lien-pied:hover { color: var(--brc-rouge); }

.modale {
  width: calc(100% - 2rem);
  max-width: 520px;
  padding: 1.3rem 1.2rem;
  border: 1px solid var(--bord);
  border-radius: var(--radius);
  background: var(--fond);
  color: var(--texte);
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);
}
.modale::backdrop { background: rgba(0, 0, 0, 0.55); }
.modale-entete {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}
.modale-entete h2 { margin: 0; font-size: 1.15rem; }
.modale-fermer {
  flex-shrink: 0;
  background: none;
  border: none;
  color: var(--texte-doux);
  font-size: 1.1rem;
  line-height: 1;
  padding: 0.3rem;
  cursor: pointer;
}
.modale-fermer:hover { color: var(--brc-rouge); }
@media (max-width: 600px) {
  .modale { padding: 1.1rem 0.9rem; }
}