/* Navigation unifiée v2, lot 1. Tout est sous body.nv2 : sans le drapeau, aucune règle ne s'applique.
   La barre actuelle reste dans le DOM (masquée) ; la largeur de 220 px et le seuil de 900 px sont ceux
   de la barre latérale existante, dont les marges de contenu et d'écrans plein écran sont réutilisées. */

/* --nv2-rail-l : largeur du rail à gauche (ordinateur) = 236 px comme la maquette ; la barre d'origine (styles.css) reste à 220 px */
body.nv2 { --nv2-rail-l: 236px; }
body.nv2 .bottom-tab-bar { display: none !important; }

body.nv2 #nv2-nav {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 9995;
  display: flex;
  align-items: stretch;
  background: var(--color-card, #fff);
  border-top: 1px solid var(--color-border, rgba(6, 23, 45, .12));
  padding-bottom: env(safe-area-inset-bottom, 0);
}
body.nv2 #nv2-nav .nv2-rubriques { display: flex; flex: 1 1 auto; min-width: 0; }
body.nv2 #nv2-nav .nv2-util { display: none; }

body.nv2 #nv2-nav button {
  font: inherit;
  cursor: pointer;
  color: var(--color-text-secondary, #445468);
  background: none;
  border: 0;
  min-height: 44px;
  min-width: 44px;
  display: flex;
  align-items: center;
  gap: 8px;
}
body.nv2 #nv2-nav .nv2-rub {
  flex: 1 1 0;
  flex-direction: column;
  justify-content: center;
  gap: 2px;
  padding: 6px 2px;
  font-size: 12px;
  font-weight: 600;
}
body.nv2 #nv2-nav .nv2-rub[aria-current="page"] { color: var(--color-primary, #2d6a4f); font-weight: 800; }
body.nv2 #nv2-nav .nv2-rub[aria-current="page"] span { text-decoration: underline; text-underline-offset: 3px; }

/* Saisir ma journée : bouton rond posé sur la barre (téléphone) */
body.nv2 #nv2-nav .nv2-saisie {
  position: absolute;
  right: 14px;
  bottom: calc(100% + 12px);
  width: 56px; height: 56px;
  border-radius: 28px;
  justify-content: center;
  background: var(--color-primary, #2d6a4f);
  color: #fff;
  box-shadow: 0 4px 14px rgba(6, 23, 45, .25);
}
body.nv2 #nv2-nav .nv2-saisie span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
body.nv2 #nv2-nav .nv2-saisie[aria-current="page"] { outline: 3px solid #2C6E7A; outline-offset: 2px; }

body.nv2 #nv2-nav button:focus-visible,
body.nv2 .nv2-onglet:focus-visible,
body.nv2 .nv2-pill:focus-visible,
body.nv2 #nv2-titre:focus-visible,
body.nv2 .nv2-saisie--page:focus-visible { outline: 3px solid #2C6E7A; outline-offset: 2px; }

/* Bandeau sous la rubrique : titre, onglets (4 au plus), pills */
body.nv2 .nv2-sous {
  position: sticky;
  top: 0;
  z-index: 40;
  background: var(--color-bg, #F6F7F4);
  padding: 10px 16px 6px;
  border-bottom: 1px solid var(--color-border, rgba(6, 23, 45, .1));
}
body.nv2 .nv2-titre { margin: 0 0 6px; font-size: 20px; font-weight: 800; color: var(--color-text, #06172D); }
body.nv2 .nv2-onglets, body.nv2 .nv2-pills { display: flex; flex-wrap: wrap; gap: 8px; }
body.nv2 .nv2-pills { margin-top: 8px; }
body.nv2 .nv2-onglet, body.nv2 .nv2-pill {
  font: inherit;
  font-size: 14px;
  min-height: 44px;
  padding: 8px 14px;
  border-radius: 22px;
  cursor: pointer;
  color: var(--color-text-secondary, #445468);
  background: none;
  border: 1.5px solid rgba(6, 23, 45, .15);
}
body.nv2 .nv2-onglet[aria-current="page"], body.nv2 .nv2-pill[aria-current="page"] {
  background: #2d6a4f; color: #fff; border-color: #2d6a4f; font-weight: 700;
}
body.nv2 .nv2-pill { min-height: 44px; font-size: 13px; }

body.nv2 .nv2-note { margin: 8px 0 0; font-size: 14px; line-height: 1.45; color: var(--color-text-secondary, #445468); }
body.nv2 .nv2-note[hidden] { display: none; }

/* Rubrique vide */
body.nv2 .nv2-vide { padding: 28px 16px; max-width: 560px; }
body.nv2 .nv2-vide h2 { margin: 0 0 10px; font-size: 20px; }
body.nv2 .nv2-vide p { margin: 0 0 10px; line-height: 1.5; color: var(--color-text-secondary, #445468); }
body.nv2 .nv2-saisie--page {
  font: inherit; font-weight: 700; min-height: 44px; padding: 8px 18px; border: 0; border-radius: 22px;
  background: var(--color-primary, #2d6a4f); color: #fff; cursor: pointer;
  display: inline-flex; align-items: center; gap: 8px;
}

/* Ordinateur : rail à gauche (236 px, --nv2-rail-l) */
@media (min-width: 900px) {
  body.nv2 #nv2-nav {
    top: 0; right: auto; bottom: 0;
    width: var(--nv2-rail-l);
    flex-direction: column;
    border-top: 0;
    border-right: 1px solid var(--color-border, rgba(6, 23, 45, .12));
    padding: 16px 10px;
    overflow-y: auto;
  }
  body.nv2 #nv2-nav .nv2-rubriques { flex: 0 0 auto; flex-direction: column; gap: 4px; margin-top: 12px; }
  body.nv2 #nv2-nav .nv2-rub {
    flex-direction: row; justify-content: flex-start; gap: 10px;
    padding: 10px 12px; font-size: 15px; border-radius: 10px; text-align: left;
  }
  body.nv2 #nv2-nav .nv2-rub[aria-current="page"] { background: rgba(45, 106, 79, .1); }
  body.nv2 #nv2-nav .nv2-rub[aria-current="page"] span { text-decoration: none; }
  body.nv2 #nv2-nav .nv2-saisie {
    position: static; width: 100%; height: auto; min-height: 44px;
    border-radius: 22px; padding: 10px 14px; justify-content: center; box-shadow: none;
  }
  body.nv2 #nv2-nav .nv2-saisie span { position: static; width: auto; height: auto; clip: auto; overflow: visible; white-space: normal; font-weight: 700; }
  body.nv2 #nv2-nav .nv2-util { display: flex; flex-direction: column; gap: 2px; margin-top: auto; padding-top: 12px; border-top: 1px solid var(--color-border, rgba(6, 23, 45, .1)); }
  body.nv2 #nv2-nav .nv2-u { padding: 8px 12px; font-size: 14px; border-radius: 10px; }
  /* le bandeau est DANS .container, qui porte déjà la marge du rail : pas de seconde marge */
  body.nv2 .nv2-sous { margin-left: 0; }
}

@media (prefers-reduced-motion: no-preference) {
  body.nv2 .nv2-onglet, body.nv2 .nv2-pill, body.nv2 #nv2-nav button { transition: background 150ms, color 150ms; }
}

/* Mode sombre : variables existantes ; fond du bandeau et de la barre sans gris hexadécimal direct */
html.dark body.nv2 #nv2-nav { background: var(--color-card); }
html.dark body.nv2 .nv2-sous { background: var(--color-bg); }
html.dark body.nv2 .nv2-onglet, html.dark body.nv2 .nv2-pill { color: var(--color-text-secondary); border-color: var(--color-border); }
html.dark body.nv2 .nv2-onglet[aria-current="page"], html.dark body.nv2 .nv2-pill[aria-current="page"] { color: #fff; }
/* Vert primaire clair du mode sombre : texte foncé (le blanc n'y fait que 2,4:1) */
html.dark body.nv2 #nv2-nav .nv2-saisie, html.dark body.nv2 .nv2-saisie--page { color: var(--color-bg); }

/* Lot 2 : feuille de saisie courte et aide clavier (tokens existants, px, 44 px de cible) */
body.nv2 .nv2-feuille {
  position: fixed; inset: 0; z-index: 9995; display: flex; align-items: flex-end; justify-content: center;
  background: rgba(11, 27, 52, .4); padding: 16px;
}
body.nv2 .nv2-feuille-c {
  width: 100%; max-width: 420px; background: var(--color-card); color: var(--color-text);
  border-radius: 16px; padding: 20px; box-shadow: 0 8px 40px rgba(11, 27, 52, .12);
}
body.nv2 .nv2-feuille-c h2 { margin: 0 0 12px; font-size: 18px; }
body.nv2 .nv2-feuille-c p { margin: 0 0 10px; font-size: 14px; }
body.nv2 .nv2-feuille-deja { color: var(--color-text-secondary); }
body.nv2 .nv2-niveaux { display: flex; flex-direction: column; gap: 8px; margin-bottom: 12px; }
body.nv2 .nv2-niveau {
  min-height: 44px; padding: 10px 12px; font-size: 15px; text-align: left; cursor: pointer;
  background: transparent; color: var(--color-text); border: 1px solid var(--color-border); border-radius: 10px;
}
body.nv2 .nv2-niveau:focus-visible, body.nv2 .nv2-feuille-lien:focus-visible { outline: 3px solid #2C6E7A; outline-offset: 2px; }
body.nv2 .nv2-feuille-msg { min-height: 20px; font-weight: 600; }
body.nv2 .nv2-feuille-bas { display: flex; justify-content: space-between; gap: 12px; }
body.nv2 .nv2-feuille-lien {
  min-height: 44px; padding: 8px 4px; font-size: 14px; cursor: pointer;
  background: none; border: none; color: var(--color-primary); text-decoration: underline;
}
@media (min-width: 900px) { body.nv2 .nv2-feuille { align-items: center; } }

/* Lot 3 : cartes d'Accueil du README rapprochées des blocs existants (classes seulement, jamais de préférence écrite).
   Seuils : bilan d'hier ≥ 1 jour, avancement du dossier ≥ 3, raccourcis ≥ 7, conseil / actualités ≥ 14. */
body.nv2:not(.nv2-n1) #accueil-delta-hier { display: none !important; }
body.nv2:not(.nv2-n3) #accueil-profil-incomplet { display: none !important; }
body.nv2:not(.nv2-n7) #accueil-shortcuts-zone { display: none !important; }
body.nv2:not(.nv2-n14) #accueil-conseil-jour-card { display: none !important; }

/* Rubrique vide : l'écran précédent est masqué, seule la page « Rien à voir ici » reste (audit croisé lot 3) */
body.nv2.nv2-vide-actif .panel.active { display: none !important; }

/* Lot 4 : sélecteur de menu (rail sur ordinateur, bandeau sur téléphone), toast, fenêtre « Ajouter un module » */
body.nv2 .nv2-menu { display: flex; flex-direction: column; gap: 6px; }
body.nv2 .nv2-menu--rail { display: none; }
body.nv2 .nv2-menu--sous { padding: 8px 16px 0; }
body.nv2 .nv2-menu-l { font-size: 13px; font-weight: 600; color: var(--color-text-secondary, #445468); }
body.nv2 .nv2-menu-sel {
  min-height: 44px; padding: 8px 10px; font: inherit; font-size: 15px; border-radius: 12px;
  border: 1px solid var(--color-border, #DDE4DF); background: var(--color-card, #fff); color: var(--color-text, #06172D);
}
body.nv2 .nv2-menu-sel:focus-visible, body.nv2 .nv2-ajout:focus-visible { outline: 3px solid #2C6E7A; outline-offset: 2px; }
body.nv2 .nv2-menu-desc { margin: 0; font-size: 14px; line-height: 1.4; color: var(--color-text-secondary, #445468); }
body.nv2 .nv2-ajout {
  min-height: 44px; padding: 8px 4px; font: inherit; font-size: 14px; text-align: left; cursor: pointer;
  background: none; border: none; color: var(--color-primary, #2d6a4f); text-decoration: underline;
}
body.nv2 .nv2-ajout[hidden], body.nv2 #nv2-nav .nv2-ajout[hidden] { display: none !important; }
body.nv2 .nv2-secondaire { background: transparent; color: var(--color-primary, #2d6a4f); border: 2px solid var(--color-primary, #2d6a4f); margin-left: 8px; }
body.nv2 .nv2-toast {
  position: fixed; left: 50%; bottom: 96px; transform: translateX(-50%); z-index: 9995;
  max-width: calc(100% - 32px); padding: 10px 16px; border-radius: 14px; font-size: 14px;
  background: var(--color-text, #06172D); color: var(--color-card, #fff);
  opacity: 0; pointer-events: none;
}
body.nv2 .nv2-toast[data-visible] { opacity: 1; }
body.nv2 .nv2-feuille-c--haute { max-height: calc(100vh - 32px); overflow-y: auto; max-width: 560px; }
body.nv2 .nv2-ajout-r { margin: 16px 0 6px; font-size: 15px; }
body.nv2 .nv2-ajout-l { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 0; border-top: 1px solid var(--color-border, #DDE4DF); }
body.nv2 .nv2-ajout-t { display: flex; flex-direction: column; gap: 2px; font-size: 14px; }
body.nv2 .nv2-ajout-t span { color: var(--color-text-secondary, #445468); }
body.nv2 .nv2-ajout-b { flex: 0 0 auto; min-width: 96px; text-align: center; }
@media (min-width: 900px) {
  body.nv2 .nv2-menu--rail { display: flex; margin-top: 12px; }
  body.nv2 .nv2-menu--sous { display: none; }
  body.nv2 .nv2-toast { bottom: 24px; }
}
@media (prefers-reduced-motion: no-preference) {
  body.nv2 .nv2-toast { transition: opacity 200ms; }
}
html.dark body.nv2 .nv2-secondaire { color: var(--color-text, #fff); border-color: var(--color-text, #fff); }

/* Lot 5 : éditeur « Organiser le menu » */
body.nv2 .nv2-feuille-c--large { max-width: 760px; }
body.nv2 .nv2-ed-ligne { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 8px 0; }
body.nv2 .nv2-ed-champ {
  min-height: 44px; padding: 8px 10px; font: inherit; font-size: 15px; border-radius: 12px; min-width: 0;
  border: 1px solid var(--color-border, #DDE4DF); background: var(--color-card, #fff); color: var(--color-text, #06172D);
}
body.nv2 .nv2-ed-champ:focus-visible, body.nv2 .nv2-ed-b:focus-visible { outline: 3px solid #2C6E7A; outline-offset: 2px; }
body.nv2 .nv2-ed-rub { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 18px 0 6px; padding-bottom: 6px; border-bottom: 2px solid var(--color-border, #DDE4DF); }
body.nv2 .nv2-ed-rub strong { flex: 1 1 auto; font-size: 16px; }
body.nv2 .nv2-ed-onglet, body.nv2 .nv2-ed-page { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 6px 0; }
body.nv2 .nv2-ed-onglet { margin-left: 14px; font-weight: 700; }
body.nv2 .nv2-ed-page { margin-left: 42px; }
body.nv2 .nv2-ed-poignee { cursor: grab; padding: 8px; font-size: 18px; color: var(--color-text-secondary, #445468); user-select: none; }
body.nv2 .nv2-ed-b { min-width: 44px; padding: 6px 10px; font-size: 13px; }
body.nv2 .nv2-ed-case { display: block; padding: 6px 0; font-size: 14px; }
body.nv2 .nv2-ed-case input { width: 20px; height: 20px; vertical-align: middle; }
body.nv2 .nv2-ed-pied { justify-content: space-between; margin-top: 18px; }
body.nv2 .nv2-ed-alerte { color: var(--color-warning, #8F5A0A); }
body.nv2 .nv2-ed-bandeau { padding: 8px 10px; border-radius: 10px; background: var(--color-primary-soft, #E8F4ED); }
body.nv2 .nv2-orga { text-decoration: underline; }

/* Lot 6 : visite guidée plein écran, en-tête et pied collants */
body.nv2 .nv2-visite {
  position: fixed; inset: 0; z-index: 9995; display: flex; flex-direction: column;
  background: var(--color-bg, #F6F7F4); color: var(--color-text, #06172D);
}
body.nv2 .nv2-visite-tete, body.nv2 .nv2-visite-pied {
  flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 12px 16px; background: var(--color-card, #fff);
}
body.nv2 .nv2-visite-tete { border-bottom: 1px solid var(--color-border, #DDE4DF); }
body.nv2 .nv2-visite-pied { border-top: 1px solid var(--color-border, #DDE4DF); }
body.nv2 .nv2-visite-c { flex: 1 1 auto; overflow-y: auto; width: 100%; max-width: 640px; margin: 0 auto; padding: 24px 16px; box-sizing: border-box; }
body.nv2 .nv2-visite-c h2 { margin: 0 0 14px; font-size: 26px; font-weight: 800; letter-spacing: -.01em; }
body.nv2 .nv2-visite-c h2:focus { outline: none; }
body.nv2 .nv2-visite-c p, body.nv2 .nv2-visite-l { font-size: 17px; line-height: 1.55; margin: 0 0 12px; }
body.nv2 .nv2-visite-l { padding-left: 22px; }
body.nv2 .nv2-visite-l li { margin-bottom: 8px; }
body.nv2 .nv2-visite-n { font-size: 14px; color: var(--color-text-secondary, #445468); }
body.nv2 .nv2-visite-pied-d { display: flex; gap: 6px; }
body.nv2 .nv2-visite-point { width: 10px; height: 10px; border-radius: 50%; background: var(--color-border, #DDE4DF); }
body.nv2 .nv2-visite-point[data-actif] { background: var(--color-primary, #2d6a4f); }
body.nv2 .nv2-visite-suiv {
  font: inherit; font-weight: 700; min-height: 44px; padding: 8px 20px; border: 0; border-radius: 22px;
  background: var(--color-primary, #2d6a4f); color: #fff; cursor: pointer;
}
body.nv2 .nv2-visite-suiv:focus-visible { outline: 3px solid #2C6E7A; outline-offset: 2px; }
body.nv2 .nv2-visite-guide { align-self: center; margin: 4px 0 12px; }
body.nv2 .nv2-visite-guide[hidden] { display: none; }
body.nv2 .nv2-visite-pied button[disabled] { opacity: .45; cursor: default; }
html.dark body.nv2 .nv2-visite-suiv { color: var(--color-bg); }

/* région d'annonce persistante de l'éditeur : lue par les lecteurs d'écran, invisible */
body.nv2 .nv2-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Habillage du contenant (retour d'essai : le rail convient, le contenu est à améliorer).
   Pur CSS sous body.nv2 : aucun écran, aucune donnée, aucun comportement modifié.
   Largeur du contenu : volontairement NON touchée. La colonne d'Accueil est plafonnée à 720 px par
   la doctrine desktop existante (« démarrer à gauche, plafonner en largeur », styles.css) ; l'élargir
   est une décision de conception, pas un habillage. */
/* Le sélecteur d'Accueil d'origine (Aujourd'hui, Ressentis, Capteurs, Météo) double les onglets v2 :
   les pages Ressentis, Capteurs et Météo vivent dans Suivi. Il reste dans le DOM (le code s'en sert) ;
   !important : son style en ligne (display:flex) gagne sinon. */
body.nv2 #accueil-hero-mode-toggle { display: none !important; }
/* La salutation d'origine n'a de sens que sur Accueil. */
body.nv2:not([data-nv2-rub="Accueil"]) header h1 { display: none; }

/* Habillage, 2e passe : surtitre de rubrique, titre de page et sa phrase, partage, onglets soulignés (cible : prototype). */
body.nv2 .nv2-titre {
  margin: 0; font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
  color: var(--color-text-secondary, #445468);
}
body.nv2 .nv2-page-tete { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin: 4px 0 10px; }
body.nv2 .nv2-page { margin: 0; font-size: 28px; line-height: 1.15; font-weight: 800; letter-spacing: -.02em; color: var(--color-text, #06172D); }
body.nv2 .nv2-page:empty, body.nv2 .nv2-phrase:empty { display: none; }
body.nv2 .nv2-phrase { margin: 4px 0 0; font-size: 15px; line-height: 1.4; color: var(--color-text-secondary, #445468); }
body.nv2 .nv2-cta {
  flex: 0 0 auto; min-height: 44px; padding: 8px 16px; font: inherit; font-size: 14px; font-weight: 700; cursor: pointer;
  background: transparent; color: var(--color-primary, #2d6a4f); border: 2px solid var(--color-primary, #2d6a4f); border-radius: 16px;
}
body.nv2 .nv2-cta[hidden] { display: none; }
/* actions de la page : groupées à droite, hauteur du plus grand (maquette : flex, gap 12) */
body.nv2 .nv2-page-act { display: flex; flex-wrap: wrap; gap: 12px; align-items: stretch; justify-content: flex-end; }
body.nv2 .nv2-page-act:not(:has(> :not([hidden]))) { display: none; }
body.nv2 .nv2-cta:focus-visible { outline: 3px solid #2C6E7A; outline-offset: 2px; }
/* onglets soulignés (au lieu de pastilles pleines) */
body.nv2 .nv2-onglets { gap: 20px; border-bottom: 1px solid var(--color-border, rgba(6, 23, 45, .12)); padding: 0; overflow-x: auto; }
body.nv2 .nv2-onglet {
  background: transparent; border: 0; border-bottom: 3px solid transparent; border-radius: 0;
  padding: 10px 2px; min-height: 44px; font-size: 16px; font-weight: 600; color: var(--color-text-secondary, #445468);
}
body.nv2 .nv2-onglet[aria-current="page"] { background: transparent; color: var(--color-primary, #2d6a4f); border-bottom-color: var(--color-primary, #2d6a4f); }
html.dark body.nv2 .nv2-onglet[aria-current="page"] { color: var(--color-text, #fff); border-bottom-color: var(--color-primary, #5FBF92); }
html.dark body.nv2 .nv2-cta { color: var(--color-text, #fff); border-color: var(--color-text, #fff); }
/* « Ajouter » (maquette : bouton plein, 48 px, rayon 16, raccourci N en pastille) */
body.nv2 .nv2-cta.nv2-cta--prim { display: inline-flex; align-items: center; gap: 10px; min-height: 48px; padding: 0 22px; font-size: 16px;
  background: var(--color-primary, #2d6a4f); color: #fff; border: 1px solid var(--color-primary, #2d6a4f); }
body.nv2 .nv2-cta--prim[hidden] { display: none; }
body.nv2 .nv2-cta--prim:hover { filter: brightness(.92); }
body.nv2 .nv2-cta--prim kbd { line-height: normal; font-family: ui-monospace, Menlo, monospace; font-size: 13px; padding: 0 7px; border-radius: 6px; background: rgba(255, 255, 255, .12); color: #fff; }
html.dark body.nv2 .nv2-cta.nv2-cta--prim { color: #06172D; border-color: #5FBF92; background: #5FBF92; }
html.dark body.nv2 .nv2-cta--prim kbd { background: rgba(0, 0, 0, .18); color: inherit; }
@media (max-width: 899px) { body.nv2 .nv2-cta--prim kbd { display: none; } }
@media (min-width: 900px) {
  /* le bandeau, devenu plus haut, défile avec la page (le prototype n'a pas de bandeau collant) */
  body.nv2 .nv2-sous { position: static; border-bottom: 0; }
  body.nv2 .nv2-page { font-size: 34px; }
  body.nv2 .nv2-cta { font-size: 16px; padding: 0 18px; }
}
@media (max-width: 899px) {
  body.nv2 .nv2-phrase { display: none; }
  body.nv2 .nv2-page { font-size: 22px; }
  body.nv2 .nv2-page-tete { flex-wrap: wrap; align-items: flex-start; }
}

/* Jetons de la maquette (mesurés le 16/10/2026, 1440 px) : titre de rubrique, titre et phrase de page, onglets soulignés, pastilles.
   Clair : texte #06172D / #445468, filets #DDE4DF, vert #2D6A4F sur #E8F4ED. Sombre : texte #ECEDEE / #A7ADB3, filets #2C2F33, vert #5FBF92 sur #15291F. */
@media (min-width: 900px) {
  body.nv2 .nv2-titre { font-size: 13px; line-height: 1.5; letter-spacing: .1em; }
  body.nv2 .nv2-page-tete { margin: 0 0 19px; }
  body.nv2 .nv2-page { margin: 2px 0 4px; line-height: 1.1; }
  body.nv2 .nv2-phrase { margin: 0; font-size: 17px; line-height: 1.5; }
  body.nv2 .nv2-onglets { gap: 4px; border-bottom-color: #DDE4DF; }
  body.nv2 .nv2-onglet { padding: 0 16px; min-height: 46px; margin-bottom: -1px; font-weight: 500; }
  body.nv2 .nv2-onglet[aria-current="page"] { font-weight: 700; }
  body.nv2 .nv2-pills { margin-top: 24px; gap: 8px; }
  body.nv2 .nv2-pill { padding: 0 16px; min-height: 44px; font-size: 15px; font-weight: 600; border: 2px solid #DDE4DF; border-radius: 999px; background: #fff; color: #06172D; }
  body.nv2 .nv2-pill[aria-current="page"] { background: #E8F4ED; border-color: #2D6A4F; color: #2D6A4F; font-weight: 600; }
  html.dark body.nv2 .nv2-onglets { border-bottom-color: #2C2F33; }
  html.dark body.nv2 .nv2-onglet { color: #A7ADB3; border-bottom-color: transparent; }
  html.dark body.nv2 .nv2-onglet[aria-current="page"] { color: #5FBF92; border-bottom-color: #5FBF92; }
  html.dark body.nv2 .nv2-pill { background: #1A1C1F; border-color: #2C2F33; color: #ECEDEE; }
  html.dark body.nv2 .nv2-pill[aria-current="page"] { background: #15291F; border-color: #5FBF92; color: #5FBF92; }
  /* cadre (rail, barre du haut, actions) : le sombre de la maquette, mesuré (le sombre des écrans d'origine garde ses propres jetons) */
  html.dark body.nv2 .nv2-cta:not(.nv2-cta--prim):not(.nv2-cta--sec) { color: #5FBF92; border-color: #5FBF92; }
  html.dark body.nv2 #nv2-nav .nv2-rub, html.dark body.nv2 #nv2-nav .nv2-u { color: #A7ADB3; }
  html.dark body.nv2 #nv2-nav .nv2-rub[aria-current="page"] { background: #15291F; border-left-color: #5FBF92; color: #5FBF92; }
  html.dark body.nv2 #nv2-nav .nv2-saisie { background: #5FBF92; color: #06172D; }
  html.dark body.nv2 .nv2-recherche { background: #111214; border-color: #2C2F33; color: #A7ADB3; }
}
/* Habillage, 3e passe : cadre de focus autour du texte seul, onglets sur une ligne défilante, menu compact sur téléphone. */
body.nv2 .nv2-titre { display: inline-block; max-width: 100%; }
body.nv2 .nv2-onglets { flex-wrap: nowrap; }
body.nv2 .nv2-onglet { white-space: nowrap; flex: 0 0 auto; }
@media (max-width: 899px) {
  body.nv2 .nv2-menu--sous .nv2-menu-desc { display: none; }
  body.nv2 .nv2-menu--sous { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 4px 16px; }
  body.nv2 .nv2-menu--sous .nv2-menu-l { flex: 0 0 100%; }
  body.nv2 .nv2-menu--sous .nv2-menu-sel { flex: 1 1 100%; }
}

/* Point 1 (alignement sur la maquette) : pas de barre d'onglets pour un seul onglet. */
body.nv2 .nv2-onglets[hidden] { display: none; }

/* Point 2 : en-tête de la maquette (ordinateur) : fil d'Ariane et palette de recherche à la place des pastilles
   rondes, de l'icône de synchronisation et de la boussole d'origine. Notifications, Réglages, Thème et Compte
   restent en bas du rail. Téléphone : en-tête d'origine conservé (c'est le seul accès à Réglages et Thème). */
body.nv2 .nv2-topbar { display: none; }
body.nv2 header h1 { display: none; }
body.nv2 .nv2-badge {
  margin-left: auto; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 10px; box-sizing: border-box;
  background: #8F5A0A; color: #fff; font-size: 12px; font-weight: 700; line-height: 20px; text-align: center;
}
body.nv2 .nv2-badge[hidden] { display: none; }
body.nv2 .nv2-page { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (min-width: 900px) {
  body.nv2 .nv2-topbar {
    display: flex; align-items: center; justify-content: space-between; gap: 16px;
    padding: 14px 0; margin-bottom: 4px; border-bottom: 1px solid var(--color-border, rgba(6, 23, 45, .1));
  }
  body.nv2 .nv2-fil { font-size: 15px; color: var(--color-text-secondary, #445468); }
  body.nv2 .nv2-fil strong { color: var(--color-text, #06172D); }
  body.nv2 .nv2-recherche {
    display: flex; align-items: center; gap: 10px; min-height: 44px; width: min(420px, 100%); padding: 6px 12px;
    background: var(--color-card, #fff); color: var(--color-text-secondary, #445468); font: inherit; font-size: 15px; text-align: left;
    border: 1px solid var(--color-border, rgba(6, 23, 45, .15)); border-radius: 14px; cursor: pointer;
  }
  body.nv2 .nv2-recherche:focus-visible { outline: 3px solid #2C6E7A; outline-offset: 2px; }
  body.nv2 .nv2-recherche svg { flex: 0 0 auto; }
  body.nv2 .nv2-recherche-t { flex: 1 1 auto; }
  body.nv2 .nv2-recherche kbd {
    flex: 0 0 auto; min-width: 22px; padding: 1px 6px; font: inherit; font-size: 12px; text-align: center;
    border: 1px solid var(--color-border, rgba(6, 23, 45, .2)); border-radius: 6px;
  }
  /* l'en-tête d'origine : on garde l'élément (panneau des notifications, sélecteur d'Accueil, salutation) ; on retire
     la première ligne (boussole, date, compte, synchronisation, pastilles rondes) */
  body.nv2 header.header { padding: 0; min-height: 0; }
  /* !important : la ligne porte un display:flex en ligne */
  body.nv2 header.header > div:first-child { display: none !important; }
  /* le panneau des notifications s'ouvre à droite du rail, plus sous des pastilles qui n'existent plus */
  body.nv2 #cloche-panel { position: fixed; top: 64px; left: var(--nv2-rail-l); right: auto; width: min(380px, calc(100vw - var(--nv2-rail-l) - 24px)); z-index: 9994; }
}
/* palette de recherche */
body.nv2 .nv2-feuille--haut { align-items: flex-start; padding-top: 12vh; }
body.nv2 .nv2-rech-champ { width: 100%; box-sizing: border-box; font-size: 17px; }
body.nv2 .nv2-rech-liste { list-style: none; margin: 10px 0; padding: 0; max-height: 52vh; overflow-y: auto; }
body.nv2 .nv2-res {
  display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border-radius: 10px; cursor: pointer;
  border: 1px solid transparent;
}
body.nv2 .nv2-res[aria-selected="true"], body.nv2 .nv2-res:hover { background: var(--color-primary-soft, #E8F4ED); border-color: var(--color-primary, #2d6a4f); }
body.nv2 .nv2-res-t { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
body.nv2 .nv2-res-t span, body.nv2 .nv2-res-p { font-size: 13px; color: var(--color-text-secondary, #445468); }
body.nv2 .nv2-res-vide { cursor: default; color: var(--color-text-secondary, #445468); }

/* Point 3 : « Ajouter un module » et « Organiser ce menu » : entrées du rail, même gabarit que Notifications,
   Réglages, Compte, Thème (icône + libellé), plus des liens soulignés. Cadenas hors Boussole+. */
body.nv2 #nv2-nav .nv2-u .nv2-cadenas { margin-left: auto; display: inline-flex; color: var(--color-text-secondary, #445468); }
body.nv2 #nv2-nav .nv2-u .nv2-cadenas[hidden] { display: none; }
body.nv2 #nv2-nav .nv2-u .nv2-cadenas svg { width: 16px; height: 16px; }
body.nv2 #nv2-nav .nv2-u[hidden] { display: none !important; }

/* Point 4 : textes. La description du menu est inscrite comme les autres blocs du rail ; les titres de carte en
   capitales qui répètent le titre de la page sont masqués (le titre de la page suffit). */
body.nv2 .nv2-menu--rail .nv2-menu-desc { padding: 0 12px; }
body.nv2 .nv2-menu--rail .nv2-menu-l { padding: 0 12px; }
body.nv2.hero-mode-weather #accueil-meteo-card .focus-head { display: none; }
body.nv2 #accueil-ressentis-details .focus-head,
body.nv2 #accueil-capteurs-details .focus-head { display: none; }

/* Point 6 : mise en page. UN SEUL alignement pour toutes les pages et tous les écrans plein écran : le contenu est CENTRÉ
   dans un cadre commun (--nv2-cadre, 1280 px au plus, 32 px de marge au minimum de chaque côté de la zone à droite du rail).
   Pages (Accueil, Suivi, Articles) et écrans plein écran (Dossier, Rendez-vous, Journal) partagent donc le même bord gauche,
   le même bord droit et la même barre du haut. Remplace, sous la v2 seulement, le plafond de 720 px de la doctrine desktop d'origine. */
@media (min-width: 900px) {
  /* --nv2-gout : marge de chaque côté du cadre (32 px au minimum), la même pour la page, la barre du haut, le pied de page et
     les écrans plein écran. !important : les règles de styles.css qui plafonnent .container par onglet (body:has(#panel-…)) ont
     une spécificité plus haute. */
  body.nv2 { --nv2-cadre: 1280px; --nv2-gout: max(32px, calc((100vw - var(--nv2-rail-l) - var(--nv2-cadre)) / 2)); }
  body.nv2 .container,
  body.nv2:has(#panel-today.active) .container {
    max-width: none !important;
    margin-left: var(--nv2-rail-l);
    margin-right: 0;
    padding-left: var(--nv2-gout) !important;
    padding-right: var(--nv2-gout) !important;
    box-sizing: border-box;
  }
  /* les cartes pleine largeur ne s'étirent pas au-delà du cadre ; un plafond plus étroit (Journal : 640 px) garde le bord
     gauche du cadre, jamais un centrage propre à l'écran */
  body.nv2 .container > .panel { max-width: var(--nv2-cadre); }
  /* bandeau aligné sur la barre du haut et les cartes */
  body.nv2 .nv2-sous { padding-left: 0; padding-right: 0; }
  /* panneaux hors .container (Découvrir, Favoris, Mon compte, Rechercher) : même bord gauche que les autres pages */
  body.nv2 #panel-decouvrir .discover-shell,
  body.nv2 #panel-favoris,
  body.nv2 #panel-moncompte,
  body.nv2 #panel-recherche {
    margin-left: var(--nv2-rail-l); margin-right: 0; box-sizing: border-box;
    padding-left: var(--nv2-gout); padding-right: var(--nv2-gout);
  }
  body.nv2 #panel-decouvrir .discover-shell,
  body.nv2 #panel-recherche { max-width: none; }
  body.nv2 #panel-favoris, body.nv2 #panel-moncompte { max-width: calc(640px + 2 * var(--nv2-gout)); }
}

/* Écarts de la maquette : marque et intitulé de groupe du rail, barre du haut pleine largeur, raccourcis du
   pied de page, « Options de l'écran » en haut à droite d'Accueil. Ordinateur seulement ; téléphone inchangé. */
body.nv2 .nv2-marque, body.nv2 .nv2-groupe, body.nv2 .nv2-pied, body.nv2 #nv2-options { display: none; }
@media (min-width: 900px) {
  body.nv2 .nv2-marque {
    display: flex; align-items: center; gap: 10px; padding: 4px 10px 14px;
    color: var(--color-primary, #2d6a4f); font-size: 18px; font-weight: 800; letter-spacing: -.01em;
  }
  body.nv2 .nv2-marque span { color: var(--color-text, #06172D); }
  body.nv2 .nv2-groupe {
    display: block; margin-top: 14px; padding: 0 14px 4px;
    font-size: 13px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--color-text-secondary, #445468);
  }
  body.nv2 #nv2-options:not([hidden]) { display: inline-flex; align-items: center; }
  /* barre du haut : de bord à bord de la zone à droite du rail, fond de carte et filet (maquette) ; fil d'Ariane et recherche
     sur les bords du cadre (% = largeur du contenu de .container, la barre en déborde de 32 px de chaque côté) */
  body.nv2 .nv2-topbar {
    margin-left: calc(-1 * var(--nv2-gout)); margin-right: calc(-1 * var(--nv2-gout));
    padding-left: var(--nv2-gout); padding-right: var(--nv2-gout);
    background: var(--color-card, #fff); margin-top: -16px; margin-bottom: 16px;
  }
}

/* Alignement fin sur la maquette (valeurs relevées sur la maquette gelée) : jetons du rail et de la boussole, entrées du rail à 16 px
   avec liseré d'état, marque, bouton « Saisir ma journée », recherche, « Options de l'écran », barre fixe du bas.
   Ordinateur seulement. Largeur du rail : 236 px (--nv2-rail-l), voir le bloc « Rail de 236 px » en fin de fichier. */
body.nv2 { --nv2-rail: #FBFBFA; --nv2-disque: #06172D; --nv2-disque-trait: transparent; }
html.dark body.nv2 { --nv2-rail: #16171A; --nv2-disque: #22303F; --nv2-disque-trait: #6E877D; }
body.nv2 .nv2-disque { fill: var(--nv2-disque); stroke: var(--nv2-disque-trait); }
@media (min-width: 900px) {
  body.nv2 #nv2-nav { background: var(--nv2-rail); padding: 20px 8px 12px; }
  html.dark body.nv2 #nv2-nav { background: var(--nv2-rail); }
  body.nv2 .nv2-marque { padding: 4px 10px 14px; gap: 10px; font-size: 23px; letter-spacing: -.01em; font-weight: 400; color: inherit; }
  body.nv2 .nv2-marque span { color: inherit; }
  body.nv2 .nv2-marque .nv2-mot-my { font-style: italic; font-weight: 500; color: var(--color-text, #06172D); }
  body.nv2 .nv2-marque .nv2-mot-b { font-weight: 700; color: var(--color-primary, #2d6a4f); }
  html.dark body.nv2 .nv2-marque .nv2-mot-b { color: var(--color-primary, #5FBF92); }
  body.nv2 #nv2-nav .nv2-saisie { min-height: 48px; border-radius: 16px; margin: 0 2px 14px; width: auto; padding: 0 14px; }
  body.nv2 #nv2-nav .nv2-rub, body.nv2 #nv2-nav .nv2-u {
    min-height: 44px; gap: 10px; padding: 0 12px; font-size: 16px; font-weight: 500; text-align: left; white-space: nowrap;
    border-left: 4px solid transparent; border-radius: 4px 12px 12px 4px; color: var(--color-text-secondary, #445468);
  }
  body.nv2 #nv2-nav .nv2-rub[aria-current="page"] {
    background: var(--color-primary-soft, #E8F4ED); border-left-color: var(--color-primary, #2d6a4f);
    color: var(--color-primary, #2d6a4f); font-weight: 700;
  }
  body.nv2 #nv2-nav .nv2-util { border-top: 0; gap: 4px; }
  body.nv2 #nv2-nav .nv2-u:hover, body.nv2 #nv2-nav .nv2-rub:hover { filter: brightness(.96); }
  body.nv2 .nv2-recherche { width: min(380px, 36vw); border-radius: 12px; background: var(--color-bg, #F6F7F4); padding: 0 14px; }
  body.nv2 .nv2-recherche:hover { border-color: var(--color-primary, #2d6a4f); }
  /* « Options de l'écran » : bouton blanc à liseré et chevron (maquette) */
  body.nv2 #nv2-options.nv2-cta--sec {
    min-height: 44px; padding: 0 16px; border: 1px solid var(--color-border, #DDE4DF); border-radius: 12px;
    background: var(--color-card, #fff); color: var(--color-text, #06172D); font-size: 15px; font-weight: 600; gap: 6px;
  }
  body.nv2 #nv2-options.nv2-cta--sec::after { content: "\25BE"; }
  body.nv2 #nv2-options.nv2-cta--sec[aria-expanded="true"]::after { content: "\25B4"; }
  html.dark body.nv2 #nv2-options.nv2-cta--sec { color: var(--color-text, #ECEDEE); border-color: var(--color-border, #2C2F33); }
  /* barre fixe du bas, à droite du rail */
  body.nv2 .nv2-pied {
    display: flex; flex-wrap: wrap; align-items: center; gap: 4px 20px; position: fixed; left: var(--nv2-rail-l); right: 0; bottom: 0; z-index: 9000;
    padding: 10px var(--nv2-gout); background: var(--color-card, #fff); border-top: 1px solid var(--color-border, #DDE4DF);
    font-size: 13px; color: var(--color-text-secondary, #445468);
  }
  body.nv2 .nv2-pied p { margin: 0; }
  body.nv2 .nv2-raccourcis { display: flex; align-items: center; gap: 4px 8px; }
  body.nv2 .nv2-raccourcis kbd {
    min-width: 22px; padding: 1px 6px; font: inherit; font-size: 13px; text-align: center;
    border: 1px solid var(--color-border, #DDE4DF); border-radius: 6px;
  }
  body.nv2 .nv2-raccourcis kbd:not(:first-child) { margin-left: 12px; }
  body.nv2 .nv2-pied-mention { flex: 1; text-align: right; }
  /* le contenu et le pied de page d'origine ne passent pas sous la barre */
  body.nv2 { padding-bottom: 48px; }
}

/* Lot 1 du cadre (écarts MESURÉS maquette / app à 1440 px, clair et sombre : docs/nav-v2/ecarts-mesures.md).
   Ordinateur seulement ; téléphone inchangé. Largeur du rail : 236 px (--nv2-rail-l). */
@media (min-width: 900px) {
  body.nv2 #nv2-nav { padding: 20px 12px 12px; }
  /* entrées : texte à 64 px du bord du rail (marge de 14 px, icône de 22 px, 12 px d'écart) */
  body.nv2 #nv2-nav .nv2-rub, body.nv2 #nv2-nav .nv2-u { gap: 12px; padding: 0 14px; }
  body.nv2 #nv2-nav .nv2-rub svg, body.nv2 #nv2-nav .nv2-u svg { flex: 0 0 22px; }
  body.nv2 #nv2-nav .nv2-u { gap: 10px; } /* rail de 236 px : « Organiser ce menu » tient dans la marge */
  /* « Saisir ma journée » : libellé seul (le « + » de l'app ne figure pas dans la maquette) */
  body.nv2 #nv2-nav .nv2-saisie svg { display: none; }
  body.nv2 #nv2-nav .nv2-saisie { justify-content: center; font-size: 16px; font-weight: 700; }
  /* bloc Menu : intitulé léger, aide sur deux lignes, filet avant « Mon espace » */
  body.nv2 .nv2-menu--rail { margin-top: 0; gap: 4px; }
  body.nv2 .nv2-menu--rail .nv2-menu-l { padding: 0 4px; font-size: 13px; font-weight: 400; }
  body.nv2 .nv2-menu--rail .nv2-menu-desc { padding: 0 4px 14px; font-size: 13px; line-height: 1.4; }
  body.nv2 .nv2-menu--rail .nv2-menu-sel { border-radius: 8px; font-size: 15px; }
  body.nv2 .nv2-groupe {
    margin: 0 -12px 0; padding: 16px 26px 8px; border-top: 1px solid var(--color-border, #DDE4DF);
  }
  /* titre de page : remonté sous la barre du haut, phrase à 17 px */
  body.nv2 .nv2-phrase { font-size: 17px; }
  body.nv2 .nv2-sous { margin-top: -20px; }
  /* barre du bas : même hauteur que la maquette */
  body.nv2 .nv2-pied { line-height: 19.5px; }
  body.nv2 .nv2-raccourcis { gap: 0 8px; }
  body.nv2 .nv2-raccourcis kbd { padding: 1px 7px; }
}

/* Lot 2 du cadre : barre du haut collante, et écrans plein écran des pages v2 (Dossier, Traitements, Partage, analyses)
   ouverts SOUS elle et au-dessus de la barre du bas, comme la maquette (en-tête et pied toujours visibles). Les autres
   fenêtres (Réglages, Journal, consultation) gardent leur pleine hauteur : le fil d'Ariane ne les décrit pas. */
@media (min-width: 900px) {
  body.nv2 .nv2-topbar { position: sticky; top: 0; z-index: 9000; }
  body.nv2 [id^="suivi-overlay-"],
  body.nv2 #expl-overlay-bilan-bio {
    top: 73px !important; bottom: calc(var(--nv2-pied-h, 41px) - 1px) !important; height: auto !important;
  }
}

/* Lot 3 du cadre : en-tête de page commun sur les écrans plein écran des pages v2 (Dossier, Rendez-vous, Traitements,
   Partage, analyses). L'en-tête v2 (surtitre, titre, phrase, onglets, partage) reste affiché au-dessus de l'écran ouvert ;
   la ligne d'en-tête d'origine de l'écran (Retour, onglets internes, partage du dossier) est CONSERVÉE : certains onglets
   internes n'ont pas de page v2 équivalente dans le menu. Hauteur de fenêtre inférieure à 800 px : l'en-tête v2 n'est pas
   affiché (l'écran garde alors toute sa hauteur utile). Ordinateur seulement. */
@media (min-width: 900px) and (min-height: 800px) {
  body.nv2:has([id^="suivi-overlay-"].expl-overlay-open) .nv2-sous,
  body.nv2:has(#expl-overlay-bilan-bio.expl-overlay-open) .nv2-sous {
    position: fixed; top: 73px; left: var(--nv2-rail-l); right: 0; z-index: 9991; margin: 0; box-sizing: border-box;
    padding: 24px var(--nv2-gout) 0; background: var(--color-bg, #F6F7F4);
    border-bottom: 1px solid var(--color-border, #DDE4DF);
  }
  body.nv2:has([id^="suivi-overlay-"].expl-overlay-open) [id^="suivi-overlay-"],
  body.nv2:has(#expl-overlay-bilan-bio.expl-overlay-open) #expl-overlay-bilan-bio {
    top: calc(73px + var(--nv2-sous-h, 0px)) !important;
  }
}
@media (min-width: 900px) {
  /* colonne de l'écran dans le même cadre que les pages (marge de 32 px au minimum), plus de plafond à 960 px */
  body.nv2 [id^="suivi-overlay-"] .expl-sheet,
  body.nv2 #suivi-overlay-dossier .expl-sheet,
  body.nv2 #expl-overlay-bilan-bio .expl-sheet {
    max-width: none; width: auto;
    margin: 0 calc(var(--nv2-gout) - 16px); /* 16 px = marge intérieure de l'écran : cartes et titre au bord gauche du cadre */
  }
}

/* fenêtres d'information de l'app ouvertes par-dessus un écran plein écran : au-dessus de l'en-tête de page fixe */
@media (min-width: 900px) {
  body.nv2 #changelog-modal, body.nv2 #modal-dictee { z-index: 9992; }
}

/* Colonne de droite des écrans plein écran (maquette) : « À ton rythme » et « Ce qui est déjà là ». Grand écran seulement
   (1280 px de large, 800 px de haut), quand l'en-tête de page fixe est affiché ; sinon la colonne reste cachée et l'écran
   garde toute sa largeur. */
body.nv2 .nv2-colonne { display: none; }
@media (min-width: 1280px) and (min-height: 800px) {
  body.nv2:has([id^="suivi-overlay-"].expl-overlay-open) .nv2-colonne,
  body.nv2:has(#expl-overlay-bilan-bio.expl-overlay-open) .nv2-colonne {
    display: flex; flex-direction: column; gap: 16px; position: fixed; z-index: 9991; right: var(--nv2-gout); width: 320px;
    top: calc(73px + var(--nv2-sous-h, 0px) + 16px); max-height: calc(100vh - 73px - var(--nv2-sous-h, 0px) - 80px); overflow-y: auto;
  }
  body.nv2:has([id^="suivi-overlay-"].expl-overlay-open) [id^="suivi-overlay-"] .expl-sheet,
  body.nv2:has(#expl-overlay-bilan-bio.expl-overlay-open) #expl-overlay-bilan-bio .expl-sheet {
    margin-right: calc(var(--nv2-gout) + 344px) !important;
  }
  body.nv2 .nv2-colonne p { margin: 0; }
  body.nv2 .nv2-col-rythme { padding: 20px; border-radius: 20px; background: var(--color-primary-soft, #E8F4ED); }
  body.nv2 .nv2-col-kicker { font-size: 13px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--color-primary, #2d6a4f); }
  body.nv2 .nv2-col-titre { margin-top: 6px; font-size: 22px; line-height: 1.2; font-weight: 800; letter-spacing: -.01em; color: var(--color-text, #06172D); }
  body.nv2 .nv2-col-titre--p { margin-top: 0; font-size: 16px; font-weight: 700; letter-spacing: 0; }
  body.nv2 .nv2-col-texte { margin-top: 8px; font-size: 16px; line-height: 1.5; color: var(--color-text, #06172D); }
  body.nv2 .nv2-col-deja { padding: 20px; border-radius: 20px; background: var(--color-card, #fff); border: 1px solid var(--color-border, #DDE4DF); }
  body.nv2 .nv2-col-liste { list-style: none; margin: 12px 0 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
  body.nv2 .nv2-col-liste li { display: flex; justify-content: space-between; gap: 12px; font-size: 15px; color: var(--color-text, #06172D); }
  body.nv2 .nv2-col-etat { font-weight: 400; color: var(--color-text-secondary, #445468); }
  body.nv2 .nv2-col-etat[data-ok] { font-weight: 700; color: var(--color-primary, #2d6a4f); }
}

/* Colonne de droite sur les PAGES (Accueil, Articles, Ressentis, Tendances, Mesures, Météo, Réglages…) : « À ton rythme » et « Ce qui est déjà là »,
   comme les écrans Dossier et Rendez-vous (maquette : colonne de 320 px à 24 px du contenu, 796 px de colonne de page à 1440 px).
   Même condition que sur les écrans : 1280 px de large et 800 px de haut au moins ; en dessous, la page garde toute sa largeur. Quand un
   écran plein écran est ouvert, c'est SA règle (plus haut) qui s'applique ; sous une fenêtre (z-index 50), la colonne reste derrière. */
@media (min-width: 1280px) and (min-height: 800px) {
  body.nv2:not(:has([id^="suivi-overlay-"].expl-overlay-open)):not(:has(#expl-overlay-bilan-bio.expl-overlay-open)):not(:has(#journal-overlay-food:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#journal-overlay-events:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#journal-overlay-triggers:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#journal-overlay-pacing:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#journal-overlay-sommeil-details:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#overlay-consultation-express:not([style*="display:none"]):not([style*="display: none"]))) .nv2-colonne {
    display: flex; flex-direction: column; gap: 16px; position: fixed; z-index: 50; right: var(--nv2-gout); width: 320px;
    top: calc(73px + var(--nv2-sous-h, 0px) + 16px); max-height: calc(100vh - 73px - var(--nv2-sous-h, 0px) - 140px); overflow-y: auto;
  }
  body.nv2:not(:has([id^="suivi-overlay-"].expl-overlay-open)):not(:has(#expl-overlay-bilan-bio.expl-overlay-open)):not(:has(#journal-overlay-food:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#journal-overlay-events:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#journal-overlay-triggers:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#journal-overlay-pacing:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#journal-overlay-sommeil-details:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#overlay-consultation-express:not([style*="display:none"]):not([style*="display: none"]))) .container,
  body.nv2:not(:has([id^="suivi-overlay-"].expl-overlay-open)):not(:has(#expl-overlay-bilan-bio.expl-overlay-open)):not(:has(#journal-overlay-food:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#journal-overlay-events:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#journal-overlay-triggers:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#journal-overlay-pacing:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#journal-overlay-sommeil-details:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#overlay-consultation-express:not([style*="display:none"]):not([style*="display: none"]))):has(#panel-today.active) .container { padding-right: calc(var(--nv2-gout) + 344px) !important; }
  /* panneaux hors .container (Articles, Favoris, Mon compte, Recherche) : même place laissée à la colonne */
  body.nv2:not(:has([id^="suivi-overlay-"].expl-overlay-open)):not(:has(#expl-overlay-bilan-bio.expl-overlay-open)):not(:has(#journal-overlay-food:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#journal-overlay-events:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#journal-overlay-triggers:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#journal-overlay-pacing:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#journal-overlay-sommeil-details:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#overlay-consultation-express:not([style*="display:none"]):not([style*="display: none"]))) #panel-decouvrir .discover-shell,
  body.nv2:not(:has([id^="suivi-overlay-"].expl-overlay-open)):not(:has(#expl-overlay-bilan-bio.expl-overlay-open)):not(:has(#journal-overlay-food:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#journal-overlay-events:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#journal-overlay-triggers:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#journal-overlay-pacing:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#journal-overlay-sommeil-details:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#overlay-consultation-express:not([style*="display:none"]):not([style*="display: none"]))) #panel-favoris,
  body.nv2:not(:has([id^="suivi-overlay-"].expl-overlay-open)):not(:has(#expl-overlay-bilan-bio.expl-overlay-open)):not(:has(#journal-overlay-food:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#journal-overlay-events:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#journal-overlay-triggers:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#journal-overlay-pacing:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#journal-overlay-sommeil-details:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#overlay-consultation-express:not([style*="display:none"]):not([style*="display: none"]))) #panel-moncompte,
  body.nv2:not(:has([id^="suivi-overlay-"].expl-overlay-open)):not(:has(#expl-overlay-bilan-bio.expl-overlay-open)):not(:has(#journal-overlay-food:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#journal-overlay-events:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#journal-overlay-triggers:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#journal-overlay-pacing:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#journal-overlay-sommeil-details:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#overlay-consultation-express:not([style*="display:none"]):not([style*="display: none"]))) #panel-recherche { padding-right: calc(var(--nv2-gout) + 344px); }
  /* le bandeau d'en-tête reste sur toute la largeur du cadre (le bouton de partage au bord droit) */
  body.nv2:not(:has([id^="suivi-overlay-"].expl-overlay-open)):not(:has(#expl-overlay-bilan-bio.expl-overlay-open)):not(:has(#journal-overlay-food:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#journal-overlay-events:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#journal-overlay-triggers:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#journal-overlay-pacing:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#journal-overlay-sommeil-details:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#overlay-consultation-express:not([style*="display:none"]):not([style*="display: none"]))) .nv2-sous { margin-right: -344px; }
  body.nv2:not(:has([id^="suivi-overlay-"].expl-overlay-open)):not(:has(#expl-overlay-bilan-bio.expl-overlay-open)):not(:has(#journal-overlay-food:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#journal-overlay-events:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#journal-overlay-triggers:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#journal-overlay-pacing:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#journal-overlay-sommeil-details:not([style*="display:none"]):not([style*="display: none"]))):not(:has(#overlay-consultation-express:not([style*="display:none"]):not([style*="display: none"]))) .nv2-topbar { margin-right: calc(-1 * var(--nv2-gout) - 344px); padding-right: var(--nv2-gout); }
}

/* Autres écrans plein écran (Journal alimentaire, événements, facteurs, activité et repos ; consultation express ; fenêtres
   d'analyses) : même bord gauche que les pages et les écrans Dossier / Consultations. Ils étaient « collés au rail », donc
   décalés de la colonne des pages (retour d'essai 16/10/2026 : « soit on centre pour tout, soit on aligne pour tout »). */
@media (min-width: 900px) {
  body.nv2 .expl-overlay .expl-sheet,
  body.nv2 .j-overlay-win,
  body.nv2 #overlay-consultation-express .ce-overlay-shell { margin-left: calc(var(--nv2-gout) - 16px) !important; }
}

/* Écrans plein écran restés en colonne étroite (Journal alimentaire, Pacing, Sommeil, événements, facteurs, consultation express,
   analyses) : styles.css les plafonne à 720 px et les colle à gauche, d'où une colonne étroite sur un grand vide à droite
   (retour d'essai 16/10/2026 : « pas alignés au centre, sans cadre blanc autour du contenu »). Même cadre que les pages et que
   l'écran Dossier : toute la largeur du cadre commun (--nv2-cadre), centrée, avec la même marge de chaque côté ; le contenu
   reste dans ses cartes blanches, comme la maquette. Les écrans Dossier / Rendez-vous (colonne de droite) gardent leur marge
   droite propre (règle plus spécifique plus haut). */
@media (min-width: 900px) {
  body.nv2 .expl-overlay .expl-sheet,
  body.nv2 .j-overlay-win,
  body.nv2 #overlay-consultation-express .ce-overlay-shell {
    max-width: none !important; width: auto !important; margin-right: calc(var(--nv2-gout) - 16px) !important;
  }
}

/* Lot 4 du cadre : les écrans du Journal ouverts DEPUIS LE MENU (Journal alimentaire, événements, facteurs, Pacing, Sommeil) et
   la consultation express gardent, comme Dossier et Rendez-vous, la barre du haut (fil d'Ariane, recherche) et l'en-tête de page
   (surtitre, titre, phrase, onglets) : ils s'ouvrent SOUS elle et au-dessus de la barre du bas (retour d'essai 16/10/2026 :
   « il leur manque la barre de recherche, le titre de la page, la navigation conforme »). Classe nv2-ouvre-{écran} posée par
   nav_v2.js quand la page affichée dans l'en-tête OUVRE cet écran : un écran ouvert par un autre chemin (Réglages, lien interne)
   garde sa pleine hauteur ET son bouton « retour », qui reste alors l'unique accès. Leur bouton « retour » est masqué sinon (fil
   d'Ariane et rail le remplacent) ; la rangée qui porte aussi les onglets (événements) ou le choix du jour (Pacing) reste.
   Même condition que les autres écrans : ordinateur, 800 px de haut au moins. */
@media (min-width: 900px) and (min-height: 800px) {
  body.nv2.nv2-ouvre-food:has(#journal-overlay-food:not([style*="display:none"]):not([style*="display: none"])) .nv2-sous,
  body.nv2.nv2-ouvre-events:has(#journal-overlay-events:not([style*="display:none"]):not([style*="display: none"])) .nv2-sous,
  body.nv2.nv2-ouvre-triggers:has(#journal-overlay-triggers:not([style*="display:none"]):not([style*="display: none"])) .nv2-sous,
  body.nv2.nv2-ouvre-pacing:has(#journal-overlay-pacing:not([style*="display:none"]):not([style*="display: none"])) .nv2-sous,
  body.nv2.nv2-ouvre-sommeil:has(#journal-overlay-sommeil-details:not([style*="display:none"]):not([style*="display: none"])) .nv2-sous,
  body.nv2.nv2-ouvre-ce:has(#overlay-consultation-express:not([style*="display:none"]):not([style*="display: none"])) .nv2-sous {
    position: fixed; top: 73px; left: var(--nv2-rail-l); right: 0; z-index: 9991; margin: 0; box-sizing: border-box;
    padding: 24px var(--nv2-gout) 0; background: var(--color-bg, #F6F7F4);
    border-bottom: 1px solid var(--color-border, #DDE4DF);
  }
  body.nv2.nv2-ouvre-food #journal-overlay-food:not([style*="display:none"]):not([style*="display: none"]),
  body.nv2.nv2-ouvre-events #journal-overlay-events:not([style*="display:none"]):not([style*="display: none"]),
  body.nv2.nv2-ouvre-triggers #journal-overlay-triggers:not([style*="display:none"]):not([style*="display: none"]),
  body.nv2.nv2-ouvre-pacing #journal-overlay-pacing:not([style*="display:none"]):not([style*="display: none"]),
  body.nv2.nv2-ouvre-sommeil #journal-overlay-sommeil-details:not([style*="display:none"]):not([style*="display: none"]),
  body.nv2.nv2-ouvre-ce #overlay-consultation-express:not([style*="display:none"]):not([style*="display: none"]) {
    top: calc(73px + var(--nv2-sous-h, 0px)) !important; bottom: calc(var(--nv2-pied-h, 41px) - 1px) !important; height: auto !important;
  }
  body.nv2.nv2-ouvre-food #journal-overlay-food:not([style*="display:none"]):not([style*="display: none"]) div:has(> [data-app-action="journal-close"]:only-child),
  body.nv2.nv2-ouvre-events #journal-overlay-events:not([style*="display:none"]):not([style*="display: none"]) div:has(> [data-app-action="journal-close"]:only-child),
  body.nv2.nv2-ouvre-triggers #journal-overlay-triggers:not([style*="display:none"]):not([style*="display: none"]) div:has(> [data-app-action="journal-close"]:only-child),
  body.nv2.nv2-ouvre-pacing #journal-overlay-pacing:not([style*="display:none"]):not([style*="display: none"]) div:has(> [data-app-action="journal-close"]:only-child),
  body.nv2.nv2-ouvre-sommeil #journal-overlay-sommeil-details:not([style*="display:none"]):not([style*="display: none"]) div:has(> [data-app-action="journal-close"]:only-child),
  body.nv2.nv2-ouvre-ce #overlay-consultation-express:not([style*="display:none"]):not([style*="display: none"]) div:has(> [data-app-action="close-consultation-express"]:only-child) { display: none !important; }
}

/* Doublon de navigation (retour d'essai 16/10/2026) : sous l'en-tête de page v2, l'écran plein écran Dossier ou Consultations
   n'affiche plus SON retour (« ‹ Dossier › Mon dossier », dont le libellé suivait la page précédente) ni SA rangée d'onglets
   (Mon histoire / Mes documents / Mes questions ; Rendez-vous / Comptes-rendus / Praticiens) quand le menu actif offre une page v2
   pour chacun de ses onglets (classe posée par nav_v2.js : nv2-couvre-dossier, nv2-couvre-rdv). Même condition que l'en-tête fixe
   (ordinateur, 800 px de haut au moins) : en dessous, l'en-tête v2 n'est pas affiché et la rangée d'origine reste l'unique accès.
   Le bouton de partage de « Mon histoire » (copier, PDF) reste : ce n'est pas le partage du dossier de l'en-tête. */
@media (min-width: 900px) and (min-height: 800px) {
  body.nv2.nv2-couvre-dossier #suivi-overlay-dossier .expl-close-btn,
  body.nv2.nv2-couvre-dossier #suivi-overlay-dossier .expl-inner-tabs { display: none; }
  body.nv2.nv2-couvre-dossier #suivi-overlay-dossier .expl-sheet-header > div:first-child { justify-content: flex-end; }
  body.nv2.nv2-couvre-rdv #suivi-overlay-rdv .expl-sheet-header { display: none; }
}

/* Rail de 236 px (maquette ; avant : 220 px de la barre d'origine). Les écrans plein écran et fenêtres de styles.css (règles
   `left: 220px !important` posées pour la barre d'origine) sont décalés de la largeur du rail v2 : même liste de sélecteurs,
   préfixée body.nv2 pour gagner à !important égal. Les fenêtres ouvertes par le code (left posé en ligne) lisent la largeur
   par window.sidebarWidthPx() (app.js, focus_widget.js). Ordinateur seulement ; téléphone et barre d'origine inchangés. */
@media (min-width: 900px) {
  body.nv2 [id^="params-overlay-"],
  body.nv2 [id^="expl-overlay-"],
  body.nv2 [id^="suivi-overlay-"],
  body.nv2 #overlay-consultation-express,
  body.nv2 #overlay-data-quality,
  body.nv2 .j-overlay-bg,
  body.nv2 .trt-fullscreen,
  body.nv2 .modal-overlay,
  body.nv2 #what-happens-modal,
  body.nv2 #daily-guide-modal,
  body.nv2 #modal-focus-assistant,
  body.nv2 #modal-focus-config,
  body.nv2 #modal-capteurs-config,
  body.nv2 .modal-profil-overlay,
  body.nv2 #mode-presentation,
  body.nv2 #auth-modal,
  body.nv2 #changelog-modal,
  body.nv2 #modal-import-preview,
  body.nv2 #modal-dictee,
  body.nv2 #modal-feedback,
  body.nv2 #modal-attach-doc-bilan,
  body.nv2 #modal-edit-bilan,
  body.nv2 #modal-parcours-pro,
  body.nv2 #modal-bilans-prescrits,
  body.nv2 #symptoms-manager-modal,
  body.nv2 #sym-gestion-modal,
  body.nv2 #symptom-detail-modal,
  body.nv2 #iac-modal,
  body.nv2 #iac-consent-modal,
  body.nv2 #prepa-consultation-modal,
  body.nv2 #backup-nudge-modal,
  body.nv2 #sbs-bilan-modal,
  body.nv2 .modal,
  body.nv2 #paywall-overlay,
  body.nv2 #sw-update-banner { left: var(--nv2-rail-l) !important; }
  body.nv2 #accueil-medecin-overlay { left: var(--nv2-rail-l); }
  body.nv2 #banner-install { margin-left: var(--nv2-rail-l); }
  body.nv2 #onboarding-guide-overlay { padding-left: var(--nv2-rail-l); }
}

/* Cartes d'Accueil sur deux colonnes (maquette : « Ta journée » et « Ma boussole du jour » côte à côte, 24 px entre elles).
   Grille sur le panneau actif seulement, à partir de 1180 px de large (colonnes de 428 px au moins, mesuré à 1180 px). Chaque carte occupe la
   largeur entière SAUF les petites cartes listées, qui se placent deux par ligne dans l'ordre d'affichage (propriété order).
   Les cartes masquées (display: none) ne comptent pas. Téléphone, tablette et fenêtres plus étroites : colonne unique inchangée. */
@media (min-width: 1180px) {
  body.nv2 #panel-today.active {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 24px; align-items: start;
  }
  body.nv2 #panel-today.active > *,
  body.nv2 #panel-today.active > #accueil-aujourdhui-card > * { grid-column: 1 / -1; }
  body.nv2 #panel-today.active > #accueil-aujourdhui-card > .auj-follow-card,
  body.nv2 #panel-today.active > #daily-guide-card,
  body.nv2 #panel-today.active > #accueil-shortcuts-zone,
  body.nv2 #panel-today.active > #accueil-conseil-jour-card { grid-column: auto; }
}

/* Icônes de trait à la place des emojis : même taille que le texte, alignées sur la ligne, couleur du texte */
body.nv2 .nv2-ico { display: inline-flex; vertical-align: -3px; margin-right: 6px; line-height: 1; pointer-events: none; }
body.nv2 .nv2-ico:last-child { margin-right: 0; }
body.nv2 .nv2-ico svg { display: block; }

/* Téléphone : le bas de page ne passe plus sous la barre ni sous le bouton rond « Saisir ma journée » (56 px posé 12 px au-dessus de la barre),
   et le bouton « Donner un retour » (fixe, en bas à droite) ne se cache plus dessous : il se pose au-dessus, centré sur lui. */
@media (max-width: 899px) {
  body.nv2 { padding-bottom: calc(var(--nv2-nav-h, 56px) + 12px + 56px + 12px + 44px + 12px); }
  body.nv2 #fab-feedback {
    bottom: calc(var(--nv2-nav-h, 56px) + 12px + 56px + 12px) !important;
    right: max(20px, calc(env(safe-area-inset-right, 0px) + 20px)) !important;
  }
  body.nv2 #nv2-nav .nv2-saisie { right: max(14px, calc(env(safe-area-inset-right, 0px) + 14px)); }
}

/* Téléphone : aucun libellé coupé en silence. Les onglets passent à la ligne (comme la maquette : flex-wrap: wrap) au lieu de défiler hors
   écran sans signal ; les sous-titres de module (nowrap + points de suspension dans la feuille d'origine) passent à la ligne. */
@media (max-width: 899px) {
  body.nv2 .nv2-onglets { flex-wrap: wrap; overflow-x: visible; row-gap: 0; }
  body.nv2 .mod-sub { white-space: normal; overflow: visible; text-overflow: clip; }
}

/* Liste des événements marquants : pastille « Saisi par toi » sur chaque fiche (la liste elle-même est celle de l'écran d'origine). Construite
   seulement avec body.nv2 (app.js) : drapeau éteint, la fiche est celle d'avant. */
body.nv2 .ev-source {
  display: inline-block; margin-left: 8px; padding: 1px 8px; border-radius: 999px; vertical-align: middle;
  font-size: 12px; font-weight: 600; line-height: 1.5; color: var(--color-primary); background: var(--color-primary-light);
}
html.dark body.nv2 .ev-source { color: var(--color-text, #e5e7eb); background: var(--color-primary-bg-active); }

/* Page Sommeil : liste en lecture seule des notes déjà écrites (30 derniers jours). */
body.nv2 #sommeil-notes-liste, body.nv2 #nv2-declencheurs-liste { margin-bottom: 14px; }
body.nv2 .nv2-notes-titre { margin: 0 0 8px; font-size: 15px; font-weight: 700; color: var(--color-text, #1f2937); }
body.nv2 .nv2-notes-vide { margin: 0; font-size: 14px; color: var(--color-text-secondary, #6b7280); }
body.nv2 .nv2-notes-liste { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
body.nv2 .nv2-notes-liste li { background: var(--color-card, #fff); border: 1px solid rgba(6,23,45,.08); border-radius: 12px; padding: 10px 12px; }
body.nv2 .nv2-notes-texte { font-size: 14px; line-height: 1.5; overflow-wrap: anywhere; white-space: pre-line; }
body.nv2 .nv2-notes-repere { margin-top: 4px; font-size: 13px; color: var(--color-text-secondary, #6b7280); }

/* Page Adaptations : pastille « Saisi par toi » ajoutée sous chaque fiche de la liste d'origine. */
body.nv2 .nv2-saisi { margin-top: 6px; }

/* Page Pacing : pastille « Saisi par toi » à côté du titre de la liste cochée par la personne (jamais sur la Stabilité du jour, calculée). */
body.nv2 .nv2-saisi-titre { margin-left: 8px; vertical-align: middle; }