/* Palette reprise de rops-online.be : vert profond #31494A, beiges chauds, blanc */
:root {
  --bg: #f8f7f6;
  --panel: #ffffff;
  --ink: #202020;
  --muted: #7d7a74;
  --accent: #31494a;
  --accent-dark: #24393a;
  --border: #e9e5e2;
  --hover: #f2f0ee;
}
* { box-sizing: border-box; }
body { margin: 0; font-family: -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; background: var(--bg); color: var(--ink); font-size: 14px; }
a { color: var(--accent-dark); text-decoration: none; }
a:hover { text-decoration: underline; }

/* ---------- Navigation latérale (logique Backtibel, identité Rops) ---------- */
body { display: flex; min-height: 100vh; }
.sidenav { width: 236px; flex: none; background: #31494a; display: flex; flex-direction: column; padding: 14px 0 10px; position: sticky; top: 0; height: 100vh; overflow-y: auto; z-index: 60; }
.brand { display: flex; align-items: center; gap: 10px; padding: 2px 14px 12px; text-decoration: none; }
.brand:hover { text-decoration: none; }
.brand .mark { width: 34px; height: 34px; border-radius: 9px; background: rgba(255, 255, 255, .12); display: grid; place-items: center; color: #fff; flex: none; }
.brand .who { min-width: 0; }
.brand .nom { font-weight: 700; font-size: 15px; line-height: 1.2; color: #fff; display: block; }
.brand .nom i { color: #cfd9d9; }
.brand .inst { font-size: 11px; color: #9db0b0; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sidenav .grp { font-size: 10px; text-transform: uppercase; letter-spacing: .07em; color: #8ea3a3; padding: 14px 18px 5px; font-weight: 600; }
.sidenav .items { flex: 1; }
a.item { display: flex; align-items: center; gap: 11px; margin: 1px 8px; padding: 8px 10px; border-radius: 8px; color: #c3d0d0; text-decoration: none; font-size: 13.5px; position: relative; }
a.item .ico { width: 20px; flex: none; display: inline-flex; }
a.item:hover { background: rgba(255, 255, 255, .06); color: #fff; text-decoration: none; }
a.item.on { background: #3e5a5b; color: #fff; font-weight: 600; }
a.item.on .ico { color: #fff; }
a.item.on::before { content: ""; position: absolute; left: -8px; top: 8px; bottom: 8px; width: 3px; border-radius: 0 3px 3px 0; background: #fff; }
.pastille { margin-left: auto; background: #7f2d24; color: #f3d9d6; font-size: 11px; font-weight: 700; padding: 1px 7px; border-radius: 9px; }
.sidenav .pied { border-top: 1px solid rgba(255, 255, 255, .14); padding: 10px 8px 2px; margin-top: 6px; }
.compte { display: flex; align-items: center; gap: 10px; padding: 6px 10px; }
.compte .avatar { width: 30px; height: 30px; border-radius: 50%; background: #fff; color: #31494a; flex: none; display: grid; place-items: center; font-size: 12px; font-weight: 700; }
.compte .n { font-size: 13px; line-height: 1.2; color: #fff; }
.compte .r { font-size: 11px; color: #9db0b0; }
.compte .sortie { margin-left: auto; color: #cfd9d9; display: inline-flex; padding: 6px; border-radius: 7px; }
.compte .sortie:hover { background: rgba(255, 255, 255, .12); color: #fff; text-decoration: none; }
.topbar { display: none; }
.voile { display: none; }
main.container { flex: 1; min-width: 0; }
@media (min-width: 901px) {
  .rops-hdr { width: auto; margin-left: -16px; margin-right: -16px; }
  .liseuse-retour { left: 250px; }
}
@media (max-width: 900px) {
  body { display: block; }
  .sidenav { position: fixed; top: 0; bottom: 0; left: 0; height: auto; width: 264px; transform: translateX(-100%); transition: transform .22s cubic-bezier(.4, 0, .2, 1); z-index: 120; box-shadow: 14px 0 34px rgba(0, 0, 0, .35); padding-top: max(14px, env(safe-area-inset-top)); }
  .sidenav.open { transform: none; }
  .topbar { display: flex; align-items: center; gap: 12px; background: #31494a; color: #fff; padding: 10px 12px; padding-top: calc(env(safe-area-inset-top) + 10px); padding-bottom: 12px; position: sticky; top: 0; z-index: 90; box-shadow: 0 1px 6px rgba(0, 0, 0, .18); }
  .topbar .burger { width: 38px; height: 38px; border-radius: 9px; background: rgba(255, 255, 255, .12); color: #fff; border: none; display: grid; place-items: center; cursor: pointer; flex: none; }
  .topbar .t { font-weight: 600; font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .voile { display: block; position: fixed; inset: 0; background: rgba(10, 18, 18, .55); opacity: 0; pointer-events: none; transition: opacity .18s; z-index: 110; }
  .voile.on { opacity: 1; pointer-events: auto; }
  a.item { font-size: 15px; padding: 10px; }
}

.container { max-width: 1200px; margin: 0 auto; padding: 24px 16px 60px; }
h1 { font-size: 24px; font-weight: 650; margin: 8px 0 16px; }
h2 { font-size: 17px; font-weight: 650; margin: 28px 0 10px; }
.breadcrumb { color: var(--muted); margin: 0; }
.muted { color: var(--muted); }
.small { font-size: 12px; }
.accent { color: var(--accent); }
.prewrap { white-space: pre-wrap; }

.cards { display: flex; gap: 12px; flex-wrap: wrap; margin: 16px 0; }
.card { background: var(--panel); border: 1px solid var(--border); border-radius: 10px; padding: 14px 20px; min-width: 130px; color: var(--ink); text-decoration: none; }
.card:hover { text-decoration: none; border-color: var(--accent); }
.card .num { font-size: 20px; font-weight: 700; color: var(--accent-dark); }

table { width: 100%; border-collapse: collapse; background: var(--panel); border: 1px solid var(--border); border-radius: 10px; overflow: hidden; }
th, td { text-align: left; padding: 9px 12px; border-bottom: 1px solid var(--border); vertical-align: top; }
th { background: #f2f0ee; font-weight: 650; font-size: 12.5px; text-transform: uppercase; letter-spacing: .03em; color: #4c4b48; user-select: none; }
th a { color: inherit; text-decoration: none; display: block; }
th a:hover { text-decoration: underline; }
tbody tr:hover { background: var(--hover); }
td.r, th.r { text-align: right; white-space: nowrap; }
.actions { display: flex; gap: 6px; flex-wrap: wrap; }
.actions form { display: inline-flex; gap: 4px; }

.filters { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; background: var(--panel); border: 1px solid var(--border); border-radius: 10px; padding: 12px; margin-bottom: 12px; }
input, select { padding: 8px 10px; border: 1px solid var(--border); border-radius: 7px; font-size: 14px; background: #fff; color: var(--ink); }
input:focus, select:focus { outline: 2px solid #9db8b8; border-color: var(--accent); }
.filters input[type="text"] { flex: 1; min-width: 220px; }

.btn { display: inline-block; padding: 8px 14px; border: 1px solid var(--border); background: #fff; color: var(--ink); border-radius: 7px; cursor: pointer; font-size: 14px; text-decoration: none; }
.btn:hover { background: var(--hover); text-decoration: none; }
.btn-primary { background: var(--accent); border-color: var(--accent); color: #fff; }
.btn-primary:hover { background: var(--accent-dark); }
.btn-sm { padding: 4px 10px; font-size: 12.5px; }
.btn-danger { color: #8c2f26; border-color: #d9b3ae; }
.btn-danger:hover { background: #f3d9d6; }
.export-btns { display: flex; gap: 8px; justify-content: flex-end; margin-bottom: 8px; }

.pagination { display: flex; gap: 16px; align-items: center; justify-content: center; padding: 16px; color: var(--muted); }

dl { display: grid; grid-template-columns: 160px 1fr; gap: 6px 12px; margin: 0; }
dt { color: var(--muted); }
dd { margin: 0; }
.detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.detail-grid section { background: var(--panel); border: 1px solid var(--border); border-radius: 10px; padding: 16px 20px; }
.detail-grid h2 { margin-top: 0; }
@media (max-width: 800px) { .detail-grid { grid-template-columns: 1fr; } }

.badge { display: inline-block; padding: 2px 9px; border-radius: 20px; font-size: 12px; background: #e9e5e2; }
.badge-green { background: #dcedd8; color: #2c5e26; }
.badge-red { background: #f3d9d6; color: #8c2f26; }
.badge-blue { background: #dae4f0; color: #2b4e79; }
.badge-vente { display: inline-block; padding: 3px 12px; border-radius: 20px; background: #31494A; color: #fff; font-size: 13px; font-weight: 600; margin-right: 6px; vertical-align: middle; }
.badge-vente a { color: #fff; text-decoration: none; }

.alert { padding: 10px 14px; border-radius: 8px; margin: 12px 0; }
.alert-error { background: #f3d9d6; color: #8c2f26; }
.alert-ok { background: #dcedd8; color: #2c5e26; }

.auth-box { max-width: 400px; margin: 8vh auto; background: var(--panel); border: 1px solid var(--border); border-radius: 12px; padding: 32px; text-align: center; }
.auth-box h1 { margin-top: 0; }
.auth-box form { display: flex; flex-direction: column; gap: 14px; text-align: left; margin-top: 12px; }
.auth-box label { display: flex; flex-direction: column; gap: 5px; font-weight: 600; font-size: 13px; }
.auth-box .qr { width: 200px; height: 200px; margin: 8px auto; display: block; }
code { background: #f2f0ee; padding: 2px 6px; border-radius: 5px; font-size: 12px; }

.thumbcell { width: 64px; padding: 4px 6px !important; }
.thumb { width: 56px; height: 56px; object-fit: cover; border-radius: 6px; display: block; background: #eee9df; }
.gallery { display: flex; flex-wrap: wrap; gap: 10px; margin: 14px 0 20px; }
.gallery img { height: 170px; border-radius: 8px; border: 1px solid var(--border); background: #fff; }
@media (max-width: 800px) { .gallery img { height: 110px; } }
.fiabilite { display: flex; align-items: center; gap: 10px; margin: 8px 0 0; }
.jauge { width: 100%; height: 10px; background: #eee9df; border-radius: 6px; overflow: hidden; }
.jauge-fill { height: 100%; border-radius: 6px; }
.jauge-fill.ok { background: #5a8f57; }
.jauge-fill.moyen { background: #c9a13f; }
.jauge-fill.bas { background: #c0645a; }
.verif-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px; margin: 16px 0; }
.verif-card { background: var(--panel); border: 1px solid var(--border); border-radius: 10px; overflow: hidden; display: flex; gap: 10px; padding: 10px; }
.verif-card img { width: 110px; height: 110px; object-fit: cover; border-radius: 8px; background: #eee9df; }
.verif-card .titre { font-size: 13px; margin: 2px 0 4px; }
.verif-card .actions { display: flex; gap: 6px; margin-top: 6px; }

.tabs { display: flex; gap: 6px; border-bottom: 2px solid var(--border); margin: 16px 0 18px; flex-wrap: wrap; }
.tabs .tab { appearance: none; background: none; border: none; border-bottom: 3px solid transparent; margin-bottom: -2px; padding: 10px 16px; font-size: 15px; font-weight: 600; color: var(--muted); cursor: pointer; display: inline-flex; align-items: center; gap: 8px; }
.tabs .tab:hover { color: var(--ink); }
.tabs .tab.active { color: var(--accent-dark); border-bottom-color: var(--accent); }
@media (max-width: 800px) { .tabs .tab { padding: 8px 10px; font-size: 13.5px; } }

.dropzone { display: flex; flex-direction: column; align-items: center; gap: 4px; margin: 10px 0 4px; padding: 18px 14px; border: 2px dashed var(--border); border-radius: 10px; background: var(--panel); cursor: pointer; text-align: center; }
.dropzone:hover, .dropzone.over { border-color: var(--accent); background: var(--hover); }
.dropzone.busy { opacity: .6; pointer-events: none; }
.dropzone #dz-status { color: var(--accent-dark); }

.version-card { background: var(--panel); border: 1px solid var(--border); border-radius: 10px; padding: 14px 22px; margin-bottom: 14px; }
.version-card h2 { margin: 4px 0 8px; }
.version-card ul { margin: 6px 0; padding-left: 22px; }
.version-card li { margin: 4px 0; }

.lot-layout { display: grid; grid-template-columns: minmax(0, 560px) 1fr; gap: 24px; align-items: start; margin: 14px 0 20px; }
.lot-info { display: flex; flex-direction: column; gap: 20px; }
.lot-info section { background: var(--panel); border: 1px solid var(--border); border-radius: 10px; padding: 16px 20px; }
.lot-info h2 { margin-top: 0; }
.no-photo-big { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; height: 320px; background: var(--panel); border: 1px solid var(--border); border-radius: 10px; }
.no-photo-big img { width: 90px; height: 90px; opacity: .8; }
@media (max-width: 900px) { .lot-layout { grid-template-columns: 1fr; } }

.osd-wrap { max-width: 560px; margin: 0; }
.osd-bar { display: inline-flex; gap: 1px; margin-bottom: 0; }
.osd-bar button { width: 46px; height: 46px; background: #3e4f4d; border: none; cursor: pointer; display: flex; align-items: center; justify-content: center; padding: 0; }
.osd-bar button:hover { background: #55706d; }
.osd-bar button:focus { outline: none; }
.osd-bar button svg { width: 22px; height: 22px; fill: none; stroke: #fff; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
#lot-viewer { width: 100%; height: 420px; background: transparent; }
@media (max-width: 800px) { .osd-wrap { max-width: 100%; } #lot-viewer { height: 300px; } .osd-bar button { width: 40px; height: 40px; } }

/* Ligne d'en-tête de groupe (tableaux d'enchères groupés par vente) */
.groupe-vente td { background: #efece6; font-weight: 600; font-size: 12.5px; padding: 6px 9px; border-top: 1px solid var(--border); }
.table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.table-scroll table { min-width: 1150px; font-size: 13px; }
.table-scroll th, .table-scroll td { padding: 7px 9px; }

.charts-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 16px 0 24px; }
.chart-box { background: var(--panel); border: 1px solid var(--border); border-radius: 10px; padding: 14px 16px; }
.chart-box h2 { margin: 0 0 8px; text-align: center; }
@media (max-width: 900px) { .charts-grid { grid-template-columns: 1fr; } }

tr.ligne-gagnante { background: #dcedd8 !important; }
tr.ligne-gagnante td { border-bottom-color: #bcd8b6; }

/* ---------- Catalogues PDF ---------- */
/* Header repris tel quel du site catalogues.rops-online.be (CSS d'origine, adapté au conteneur) */
.rops-hdr { background: #fff; color: #31494a; text-align: left; position: relative;
  margin-top: -24px; width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); margin-bottom: 18px; }
.rops-hdr *, .rops-hdr *::before, .rops-hdr *::after { box-sizing: border-box; }
.rops-hdr a { text-decoration: none; }
.rops-hdr__top { position: relative; z-index: 2; }
/* positions calées sur le header de www.rops-online.be (conteneur 1264px centré,
   logo au bord gauche à 24px du haut, cœur à ~107px du bord droit) */
.rops-hdr__inner { position: relative; max-width: 1264px; margin: 0 auto; padding: 0;
  min-height: 100px; display: flex; align-items: center; justify-content: flex-end; }
.rops-hdr__brand { position: absolute; left: 0; top: 24px; z-index: 5; display: inline-flex; align-items: center; }
/* même boîte que sur rops-online.be (209×116, SVG centré) pour un logo au pixel près */
.rops-hdr__logo { height: 116px; width: 209px; display: block; }
.rops-hdr__actions { display: flex; align-items: center; gap: 16px; margin-right: 107px; }
.rops-hdr__icon { display: inline-flex; align-items: center; justify-content: center; color: #31494a;
  font-size: 26px; line-height: 1; padding: 4px; margin-top: 16px; }
.rops-hdr__icon svg { width: 26px; height: 26px; }
@media (max-width: 1330px) { .rops-hdr__inner { padding: 0 32px; } .rops-hdr__brand { left: 32px; } .rops-hdr__actions { margin-right: 0; } }
.rops-hdr__icon:hover { opacity: .65; }
.rops-hdr__foot { position: relative; z-index: 1; height: 57px; border-top: 1px solid rgba(49, 73, 74, .1); }
@media (max-width: 991px) {
  .rops-hdr__inner { padding: 10px 16px; min-height: 0; }
  .rops-hdr__brand { position: static; left: auto; top: auto; margin-right: auto; }
  .rops-hdr__logo { height: 70px; }
  .rops-hdr__foot { height: 0; }
}
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
/* Boutons aux couleurs rops-online.be : plein / contour vert profond */
.cat-actions .btn { border: 1px solid var(--accent); color: var(--accent); background: #fff; border-radius: 4px; }
.cat-actions .btn:first-child { background: var(--accent); color: #fff; }
.cat-actions .btn:hover { background: var(--accent-dark); border-color: var(--accent-dark); color: #fff; }
.cat-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 18px; }
.cat-card { background: #fff; border: 1px solid #e6e2d8; border-radius: 8px; overflow: hidden; display: flex; flex-direction: column; }
.cat-card > a { display: block; background: #f4f2ec; }
.cat-card img, .cat-placeholder { width: 100%; aspect-ratio: 210/297; object-fit: cover; display: block; }
.cat-placeholder { display: flex; align-items: center; justify-content: center; color: #b7ac8e; font-weight: 700; font-size: 22px; }
.cat-card img { transition: transform .15s; }
.cat-card > a:hover img { transform: scale(1.03); }
.cat-body { padding: 10px 12px 12px; display: flex; flex-direction: column; gap: 5px; flex: 1; }
.cat-titre { font-weight: 600; font-size: 13.5px; line-height: 1.3; }
.cat-actions { display: flex; gap: 6px; flex-wrap: wrap; margin-top: auto; }
.cat-vente { display: flex; gap: 14px; align-items: flex-start; background: #fff; border: 1px solid #e6e2d8; border-radius: 8px; padding: 12px; margin: 10px 0; }
.cat-vente img, .cat-vente .cat-placeholder { width: 90px; aspect-ratio: 210/297; object-fit: cover; border-radius: 4px; border: 1px solid #eee; }
.liseuse { width: 100%; height: calc(100vh - 220px); min-height: 480px; border: 1px solid #e6e2d8; border-radius: 8px; background: #f4f2ec; }
/* Liseuse 3D FlipBook (mêmes composants que catalogues.rops-online.be) */
.pdfcontainer { width: 100%; height: calc(100vh - 230px); min-height: 520px; border-radius: 8px; overflow: hidden; }
/* Bouton retour flottant, au-dessus de la liseuse (lien relatif : valable sur les deux domaines) */
.liseuse-retour { position: fixed; top: 64px; left: 14px; z-index: 2147483000;
  background: #31494a; color: #fff !important; padding: 8px 14px; border-radius: 20px;
  font-size: 13.5px; text-decoration: none !important; box-shadow: 0 2px 8px rgba(0,0,0,.25); }
.liseuse-retour:hover { background: #24393a; }
.cat-upload { display: flex; gap: 10px; flex-wrap: wrap; align-items: flex-end; margin-top: 8px; }
.cat-upload label { display: flex; flex-direction: column; gap: 3px; font-size: 12.5px; color: #6b6552; }

/* ---------- Photos à valider (candidats CLIP) ---------- */
.attente-grille { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; }
.attente-carte { background: var(--panel); border: 1px solid var(--border); border-radius: 10px; overflow: hidden; display: flex; }
.attente-carte img { width: 140px; height: 140px; object-fit: cover; display: block; background: var(--hover); }
.attente-infos { padding: 10px 12px; display: flex; flex-direction: column; gap: 4px; flex: 1; }

/* ---------- Impression / export PDF ---------- */
.print-only { display: none; }
.print-anon { display: none; } /* version anonymisée, visible uniquement à l'impression */
@media print {
  .print-only { display: block; }
  /* Documents liés : saut de page avant la section et entre chaque document */
  .doc-lie { break-before: page; page-break-before: always; }
  .sidenav, .topbar, .voile, .filters, .no-print, .photo-admin, .export-btns, .pagination, .osd-bar { display: none !important; }
  /* l'enchère maximum ne sort jamais sur papier/PDF (écran uniquement) */
  .col-max { display: none !important; }
  /* le lien « copier » à côté des e-mails n'a pas de sens sur papier/PDF */
  .copy-email { display: none !important; }
  /* Anonymisation PDF : noms masqués (ex. j***x), colonnes e-mail/contact et localité non imprimées */
  .print-anon { display: inline; }
  .col-contact, .col-localite { display: none !important; }
  /* boutons d'action (ex. « Ouvrir dans Odoo ») : pas de sens sur papier/PDF */
  .btn { display: none !important; }
  /* tableaux : plus de largeur minimale ni de défilement — tout doit tenir sur la page */
  .table-scroll { overflow: visible; }
  .table-scroll table, table { min-width: 0; width: 100%; font-size: 10px; }
  .table-scroll th, .table-scroll td, th, td { padding: 4px 5px; white-space: normal !important; word-break: break-word; }
  .badge { padding: 1px 6px; font-size: 9.5px; }
  .container { max-width: 100%; padding: 0; }
  .lot-layout { grid-template-columns: 1fr 1fr; }
  #lot-viewer { height: 300px; }
  body { display: block; background: #fff; font-size: 12px; }
  a { color: inherit; text-decoration: none; }
}

/* ---------- Mobile ---------- */
@media (max-width: 800px) {
  .container { padding: 14px 10px 50px; }
  h1 { font-size: 20px; }
  h2 { font-size: 15.5px; }
  /* les grands tableaux défilent horizontalement sans étirer la page */
  table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .filters { padding: 8px; gap: 6px; }
  .filters input[type="text"] { min-width: 150px; }
  .cards { gap: 8px; }
  .card { padding: 10px 14px; min-width: 100px; }
  .card .num { font-size: 16px; }
  dl { grid-template-columns: 110px 1fr; gap: 5px 8px; }
  .export-btns { justify-content: flex-start; }
  .auth-box { margin: 4vh auto; padding: 22px; }
}


/* Encadre du suivi de la vente en cours (page Stats) : bien separe des ventes cloturees */
.suivi-live {
  background: #eef5ee;
  border: 1px solid #bcd8bc;
  border-left: 5px solid #5a8f57;
  border-radius: 10px;
  padding: 16px 18px 6px;
  margin: 4px 0 10px;
}
.suivi-live .chart-box { background: #fff; }

/* ---------- Pages légales publiques : /confidentialite, /support ---------- */
/* Lisibles sans être connecté : ni menu ni tableaux, seulement du texte. */
.legal { max-width: 46rem; margin: 0 auto; padding: 1.5rem 0 3rem; line-height: 1.65; }
.legal h1 { margin: 0 0 .25rem; }
.legal h2 { margin: 2rem 0 .5rem; font-size: 1.05rem; border-bottom: 1px solid var(--border); padding-bottom: .35rem; }
.legal p, .legal ul { margin: .6rem 0; }
.legal ul { padding-left: 1.2rem; }
.legal li { margin: .35rem 0; }
.legal a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }

/* Bandeau de mise à jour de l'application de bureau (fenêtre Electron seulement) */
.alert-info { background: #e8eef5; color: #274866; border: 1px solid #ccdaea; }
.maj-desktop { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; }
.maj-desktop .btn { margin-left: auto; white-space: nowrap; }
/* Page de connexion : la boîte d'info se cale sur la largeur du formulaire,
   juste au-dessus, et lui reprend sa marge haute. */
.maj-desktop:has(+ .auth-box) { max-width: 400px; margin: 8vh auto 14px; }
.maj-desktop + .auth-box { margin-top: 0; }
/* la fenêtre Electron descend jusqu'à 480 px : .container y perd son padding */
@media (max-width: 900px) { .maj-desktop { margin-left: 12px; margin-right: 12px; } }