.gen { padding: 40px 20px 72px; }
.gen h1 { font-size: clamp(28px, 4vw, 40px); }
.gen-bloc { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 24px; margin: 0 0 24px; }
.gen-bloc h2 { display: flex; align-items: center; gap: 12px; font-size: 22px; }
.gen-bloc h2 .step-num { margin: 0; }
.gen-grille { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px 16px; }
.gen-grille label, .gen-import { display: block; font-weight: 600; font-size: 14px; }
.gen-grille label > input, .gen-grille label > select, .gen-grille label > textarea, .gen-import > input { display: block; margin-top: 5px; }
.gen-grille .large { grid-column: 1 / -1; }
.gen-grille input, .gen-grille select, .gen-grille textarea, .gen-import input {
  font: inherit; font-weight: 400; padding: 10px 12px; border-radius: 10px; border: 1px solid #cbd5e1; width: 100%; background: #fff; }
.gen-grille input:invalid:not(:placeholder-shown) { border-color: #d97706; }
.gen-liste { display: grid; gap: 8px; margin: 12px 0 16px; }
.gen-liste label { display: flex; gap: 12px; align-items: center; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; font-size: 15px; }
.gen-liste small { color: var(--muted); display: block; }
.gen-ajout { margin: 8px 0 16px; border: none; padding: 0; }
.gen-ajout summary { font-size: 15px; }
.gen-ajout form { margin-top: 12px; }
.apercu { margin-top: 20px; display: grid; gap: 20px; justify-items: center; }
.apercu .lettre { box-shadow: var(--shadow); border: 1px solid var(--line); }
.vide { background: #fdf1de; color: #7a4a00; padding: 0 3px; border-radius: 3px; }

/* La lettre (A4) */
.lettre { width: 210mm; min-height: 297mm; padding: 15mm 20mm; box-sizing: border-box; position: relative; background: #fff;
  font-family: Georgia, "Times New Roman", serif; font-size: 11pt; color: #111; }
.lettre .entete { font-size: 9.5pt; line-height: 1.4; }
.lettre .entete small { font-size: 8pt; color: #444; }
.lettre .dest { position: absolute; left: 110mm; top: 50mm; width: 85mm; line-height: 1.45; }
.lettre .date { margin-top: 62mm; text-align: right; }
.lettre p { line-height: 1.5; margin: 0 0 3.5mm; }
.lettre .signature { margin-top: 8mm; }
.lettre .mention { position: absolute; bottom: 12mm; left: 20mm; right: 20mm; font-size: 7.5pt; color: #555; }
@media (max-width: 900px) { .apercu { overflow-x: auto; justify-items: start; } .gen-grille { grid-template-columns: 1fr; } }

@media print {
  @page { size: A4; margin: 0; }
  body > *:not(main), .gen > *:not(.gen-bloc:last-of-type), .gen-bloc:last-of-type > *:not(.apercu) { display: none !important; }
  .gen, .gen-bloc:last-of-type { padding: 0; margin: 0; border: 0; }
  .apercu { display: block; margin: 0; }
  .apercu .lettre { box-shadow: none; border: 0; page-break-after: always; break-after: page; }
  .vide { background: none; }
}