
  /* Carnet du foyer — maquette validée le 26/09. Palette du thème courant.
     Titres en DM Sans 600, plus en Georgia (CHANTIER-THEMES § 5.7). */
  #carnet { font-size: max(18px, var(--t-corps)); line-height: 1.55; }
  #carnet h1, #carnet h2, #carnet h3, #carnet p { margin: 0; }
  #carnet .cn-nav { min-width: 48px; min-height: 48px; height: auto; padding: 10px 18px; font: inherit; white-space: normal; text-align: center; border-radius: 12px; background: var(--panel); overflow-wrap: anywhere; }
  #carnet .cn-nav:disabled { opacity: .65; cursor: wait; }
  #carnet .cn-principal, #carnet .cn-filtres [aria-pressed="true"] { background: var(--accent); color: var(--on-accent); border-color: var(--accent); }
  #carnet :is(button, a, input, select, textarea):focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }
  #carnet .cn-head { border-bottom: 1px solid var(--line2); flex: none; }
  #carnet .cn-espace { flex: 1; min-width: 0; overflow-wrap: anywhere; font-weight: 600; }
  #carnet .cn-page { flex: 1; min-height: 0; overflow-y: auto; padding: 28px 6px; }
  #carnet .cn-largeur { max-width: 1200px; margin: auto; }
  #carnet .cn-intro { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 26px; margin-bottom: 28px; }
  #carnet .cn-intro > div { flex: 1 1 360px; max-width: 640px; }
  #carnet .cn-intro > button { flex: none; }
  #carnet #cn-titre { font: 600 clamp(36px, 4vw, 56px)/1.12 var(--police); letter-spacing: -.035em; margin: 12px 0 18px; }
  #carnet .cn-etiquette { color: var(--muted); font-size: 16px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; }
  #carnet .cn-secondaire, #carnet .cn-lien, #carnet .cn-aide { color: var(--muted); }
  #carnet .cn-occasion { display: flex; align-items: center; gap: 22px; padding: 22px; margin-bottom: 32px; background: var(--panel); border: 1px solid var(--line2); border-left: 5px solid var(--accent); border-radius: 16px; }
  #carnet .cn-occasion h2 { font-size: var(--t-question); }
  #carnet .cn-occasion-texte { flex: 1; min-width: 0; overflow-wrap: anywhere; }
  #carnet .cn-occasion button { max-width: 45%; }
  #carnet .cn-date { min-width: 70px; text-align: center; color: var(--accent); font-size: 16px; }
  #carnet .cn-date strong { display: block; font: 600 38px/1.1 var(--police); }
  #carnet .cn-outils { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 18px; margin-bottom: 22px; }
  #carnet .cn-recherche { flex: 1; max-width: 440px; min-width: min(100%, 250px); display: grid; gap: 7px; font-weight: 600; }
  #carnet .cn-filtres, #carnet .cn-actions { display: flex; flex-wrap: wrap; gap: 10px; }
  #carnet .cn-liste-titre { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; margin: 0 0 18px; }
  #carnet .cn-liste-titre h2 { font-size: 24px; }
  #carnet .cn-grille { display: grid; gap: 18px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); }
  #carnet .cn-carte { min-width: 0; padding: 24px; border: 1px solid var(--line2); border-radius: var(--r-cadre); background: var(--panel); display: flex; flex-direction: column; gap: 16px; }
  #carnet .cn-tete { display: flex; align-items: center; gap: 16px; }
  #carnet .cn-qui { min-width: 0; }
  #carnet .cn-prenom { font-size: var(--t-question); line-height: 1.3; }
  #carnet .cn-carte p, #carnet h2, #carnet h3 { overflow-wrap: anywhere; }
  #carnet .cn-visage { display: grid; place-items: center; width: 64px; height: 64px; flex: 0 0 64px; border-radius: 50%; object-fit: cover; font: 600 30px var(--police); background: var(--panel2); color: var(--accent); }
  #carnet .cn-anniv { color: var(--accent); }
  #carnet .cn-allergies { padding: 12px 14px; border-left: 3px solid var(--etat-att); border-radius: var(--r-fin); background: color-mix(in srgb, var(--etat-att) 9%, var(--panel)); overflow-wrap: anywhere; }
  #carnet .cn-allergies strong { display: block; }
  #carnet .cn-ouvrir { width: 100%; margin-top: auto; justify-content: space-between; gap: 12px; text-align: left; }
  #carnet .cn-vide { text-align: center; padding: 36px 20px; border: 1px dashed var(--line2); border-radius: var(--r-cadre); background: var(--panel); }
  #carnet .cn-vide p { margin: 12px 0 22px; }
  #carnet .cn-pied { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 22px; margin-top: 30px; padding-top: 24px; border-top: 1px solid var(--line2); }
  #carnet .cn-pied p { max-width: 540px; }
  #carnet .cn-msg { color: var(--etat-mal); margin: 16px 0; }
  #carnet .cn-msg.info { color: var(--accent); }
  /* La feuille reste dans #carnet : masquer l'outil masque aussi sa fiche. */
  #carnet .cn-voile { position: absolute; inset: 0; z-index: 5; padding: max(16px, var(--safe-t)) max(16px, var(--safe-r)) max(16px, var(--safe-b)) max(16px, var(--safe-l)); display: flex; background: color-mix(in srgb, var(--veil) 75%, transparent); }
  #carnet .cn-feuille { width: min(680px, 100%); max-height: 100%; overflow-y: auto; margin: auto; padding: 28px; border: 1px solid var(--line2); border-radius: var(--r-cadre); background: var(--panel); color: var(--text); }
  #carnet .cn-fiche-head { display: flex; align-items: start; justify-content: space-between; gap: 16px; margin-bottom: 24px; }
  #carnet .cn-fiche-head h2 { font: 600 36px/1.15 var(--police); }
  #carnet .cn-fiche-head p { margin-top: 8px; }
  #carnet .cn-fiche-head button { flex: none; }
  #carnet .cn-details { margin: 24px 0; }
  #carnet .cn-ligne { margin-top: 20px; }
  #carnet .cn-ligne dt { color: var(--muted); font-size: 16px; }
  #carnet .cn-ligne dd { margin: 3px 0 0; white-space: pre-wrap; overflow-wrap: anywhere; }
  #carnet .cn-ligne .itin-btn { min-height: 48px; min-width: 48px; }
  #carnet .cn-form-grille { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
  #carnet .cn-champ { display: grid; gap: 7px; min-width: 0; font-weight: 600; }
  #carnet .cn-large { grid-column: 1 / -1; }
  #carnet input, #carnet select, #carnet textarea { width: 100%; min-width: 0; min-height: 48px; padding: 11px 14px; border: 1px solid var(--line2); border-radius: var(--r-objet); font: inherit; font-size: var(--t-chiffre); font-weight: 400; color: var(--text); background: var(--panel); }
  #carnet input::placeholder { color: var(--muted); opacity: 1; }
  #carnet textarea { min-height: 100px; resize: vertical; }
  #carnet .cn-aide, #carnet .cn-form-actions { margin-top: 22px; }
  #carnet .cn-retirer { color: var(--etat-mal); margin-top: 22px; }
  #carnet .cn-erreur { color: var(--etat-mal); margin-top: 20px; }
  #carnet #cn-confirm-texte { margin: 16px 0 22px; }
  #carnet [hidden], #carnet .cn-occasion[hidden], #carnet .cn-voile[hidden] { display: none; }
  @media (max-width: 620px) {
    #carnet .cn-page { padding: 24px 2px; }
    #carnet .cn-intro { display: block; }
    #carnet .cn-intro > button { width: 100%; margin-top: 22px; }
    #carnet .cn-occasion { padding: 18px; gap: 14px; flex-wrap: wrap; }
    #carnet .cn-occasion button { width: 100%; max-width: none; }
    #carnet .cn-grille { grid-template-columns: 1fr; }
    #carnet .cn-carte { padding: 22px; }
    #carnet .cn-pied .cn-actions { width: 100%; }
    #carnet .cn-pied a { flex: 1; }
    #carnet .cn-feuille { padding: 20px; }
    #carnet .cn-fiche-head h2 { font-size: var(--t-question); }
    #carnet .cn-form-grille { grid-template-columns: 1fr; }
    #carnet .cn-large { grid-column: auto; }
  }
