/* tableau-vivant.css : Mon EAU Nette & ma Ville (build 585)
   Sorti de index.html pour servir aussi au site complet (Pierre, 09/10, 08h36) :
   une seule feuille pour le tableau vivant, deux pages qui la partagent. */
/* ══ LE TABLEAU VIVANT, build 500 ═══════════════════════════════════════
   Toutes les tailles sont en cqw, largeur du tableau : les encarts gardent
   leur place sur la photo du plus petit téléphone à l'écran de bureau.
   Zones repérées sur une grille posée sur l'image (en % de la hauteur) :
   ciel 0 à 18, village à gauche 20 à 40, fillette à droite 38 à 52,
   verre 50 à 70, lettrage au centre 22 à 67 (jamais recouvert). */
.tv{position:relative;margin:22px auto 6px;max-width:520px;aspect-ratio:900/1124;
  container-type:inline-size;border-radius:18px;overflow:hidden;
  box-shadow:0 12px 34px rgba(10,27,42,.38);text-align:left;isolation:isolate}
.tv picture,.tv img{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:cover;z-index:-2}
.tv::before,.tv::after{content:"";position:absolute;left:0;right:0;pointer-events:none;z-index:-1}
.tv::before{top:0;height:24%;background:linear-gradient(180deg,rgba(6,16,26,.42),rgba(6,16,26,0))}
.tv::after{bottom:0;height:34%;background:linear-gradient(0deg,rgba(6,16,26,.72),rgba(6,16,26,0))}
.tv-glace{position:absolute;margin:0;border:1px solid rgba(255,255,255,.22);border-radius:3cqw;
  background:rgba(8,22,34,.60);-webkit-backdrop-filter:blur(7px) saturate(1.25);backdrop-filter:blur(7px) saturate(1.25);
  color:#fff;font-family:Poppins,system-ui,sans-serif;font-size:clamp(9.5px,3cqw,14.5px);line-height:1.3;
  padding:2cqw 2.6cqw;text-align:left;box-shadow:0 4px 16px rgba(0,0,0,.28)}
button.tv-glace{cursor:pointer;transition:transform .18s ease,border-color .18s ease}
button.tv-glace:hover{border-color:rgba(232,193,90,.75)}
button.tv-glace:active{transform:scale(.98)}
.tv button:focus-visible,.tv a:focus-visible{outline:3px solid var(--or);outline-offset:2px}
.tv-glace>span{display:block}
.tv .tv-eti{font-size:.78em;letter-spacing:.12em;text-transform:uppercase;color:#E8C15C;font-weight:600}

/* Le ciel : la ville */
.tv-plaque{top:2%;left:50%;transform:translateX(-50%);width:max-content;min-width:44%;max-width:64%;text-align:center;padding:1.6cqw 3.6cqw 1.5cqw}
.tv-plaque:active{transform:translateX(-50%) scale(.98)}
.tv .tv-ville{font-size:1.6em;font-weight:700;line-height:1.2;margin-top:.1em;overflow-wrap:anywhere}
.tv .tv-dep{display:inline;color:#E8C15C;font-weight:600;font-size:.62em;letter-spacing:.06em}
.tv .tv-compte{display:flex;flex-wrap:nowrap;justify-content:center;gap:.35em;margin-top:.3em}
.tv .tv-compte:empty{display:none}
.tv .tv-nbres,.tv .tv-nbcap{display:inline-flex;align-items:center;gap:.25em;border-radius:999px;padding:.12em .65em;
  font-weight:800;font-size:.8em;line-height:1.35;white-space:nowrap}
.tv .tv-nbres{background:#E8C15A;color:#0A1B2A}
.tv .tv-nbcap{background:rgba(79,179,232,.18);color:#DDF1FC;border:1px solid rgba(79,179,232,.55);cursor:pointer}
.tv .tv-nbcap[hidden]{display:none}
.tv .tv-reseau{font-size:.8em;color:#CFE3F1;margin-top:.3em;line-height:1.35;overflow-wrap:anywhere;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tv .tv-res-eti{color:#E8C15C;font-weight:700}
.tv .tv-chg{display:inline;font-size:.5em;color:#9DB0BE;vertical-align:middle;margin-left:.4em}
.tv[data-etat="invite"] .tv-ville{font-size:1.2em;font-weight:600}
.tv-lueur{position:absolute!important;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(100deg,transparent 30%,rgba(232,193,90,.28) 50%,transparent 70%);
  background-size:250% 100%;animation:tvLueur 1.3s linear infinite}
@keyframes tvLueur{from{background-position:150% 0}to{background-position:-50% 0}}

/* Le village : l'historique */
.tv-histo{left:2%;top:20%;width:25.5%;padding:1.7cqw 2.2cqw}
.tv .tv-gros{font-size:1.45em;font-weight:700;line-height:1.15;margin-top:.15em;font-variant-numeric:tabular-nums}
.tv .tv-ligne{font-size:.88em;margin-top:.2em;color:#CFE3F1}
.tv .tv-ligne.ok{color:#7FD8A8}.tv .tv-ligne.att{color:#E8C15C}.tv .tv-ligne.al{color:#F0918A}
.tv .tv-sp{margin-top:.4em;height:6cqw}
.tv-sp svg{display:block;width:100%;height:100%;overflow:visible}
.tv-sp-trait{fill:none;stroke:#4FB3E8;stroke-width:1.6;vector-effect:non-scaling-stroke;stroke-linejoin:round}
.tv-sp-bb{stroke:#E8C15C;stroke-width:1;stroke-dasharray:3 3;vector-effect:non-scaling-stroke}
.tv-sp-pt{fill:#fff}
.tv .tv-sp-leg{display:flex!important;justify-content:space-between;font-size:.7em;color:#9DB0BE;margin-top:.2em}
.tv .tv-gros small{font-size:.55em;font-weight:600;color:#CFE3F1;margin-left:.25em}

/* La fillette : les deux verdicts */
.tv-verdicts{right:2%;top:39.5%;width:27%;padding:1.3cqw 2.2cqw}
.tv .tv-v{padding:.35em 0}
.tv .tv-v+.tv-v{border-top:1px solid rgba(255,255,255,.16)}
.tv .tv-qui{display:block;font-size:.78em;letter-spacing:.08em;text-transform:uppercase;color:#9DB0BE}
.tv .tv-v:first-child .tv-qui{color:#E8C15C}
.tv .tv-etat{display:block;font-weight:700;font-size:1.02em;line-height:1.2}
.tv .tv-etat.ok{color:#7FD8A8}.tv .tv-etat.att{color:#E8C15C}.tv .tv-etat.al{color:#F0918A}
.capsule .etat.det-violet{color:#C9A7F5}.capsule .etat.det-noir{color:#fff;background:#000;border:1px solid #E26D6D;border-radius:8px;display:inline-block;padding:0 .35em}
.dep-liste .dep-nom{color:inherit;text-decoration:none;border-bottom:1px dotted rgba(255,255,255,.5)}
.dep-liste .dep-est{color:#E6C76A;font-weight:600;text-decoration:none;border-bottom:1px dotted #E6C76A}
.dep-liste .dep-fourchette{display:block;margin-top:3px;font-size:12px}
.dep-liste .dep-fourchette a{color:#4FB3E8;text-decoration:none;font-weight:500}
.est-lien{color:var(--eau);font-weight:600;text-decoration:none;border-bottom:1px dotted var(--eau)}
.det-liste{list-style:none;margin:8px 0 0;padding:0;font-size:13px;line-height:1.45;color:#C9DCE8;text-align:left}.det-liste li{padding:3px 0;border-top:1px solid rgba(255,255,255,.1)}.det-liste a{color:#E6C76A;font-weight:600;text-decoration:none}
.tv .tv-etat.violet{color:#C9A7F5}.tv .tv-etat.noir{color:#fff;background:#000;border:1px solid #E26D6D;border-radius:6px;padding:0 .3em}

/* Le verre : un anneau qui respire, et son encart */
.tv-anneau{position:absolute;left:85.2%;top:60%;width:15cqw;height:15cqw;transform:translate(-50%,-50%);
  border-radius:50%;border:2px solid rgba(232,193,90,.85);background:transparent;cursor:pointer;padding:0;
  animation:tvRespire 2.6s ease-in-out infinite}
@keyframes tvRespire{0%,100%{box-shadow:0 0 0 0 rgba(232,193,90,.45)}50%{box-shadow:0 0 0 2.4cqw rgba(232,193,90,0)}}
.tv-verre{right:2%;bottom:calc(2% + max(44px,11cqw) + 1.6cqw);width:27%;padding:1.6cqw 2.2cqw}
.tv .tv-verre-nom{font-size:.9em;color:#CFE3F1;margin-top:.15em}
.tv .tv-verre-v{font-size:1.6em;font-weight:700;line-height:1.15;font-variant-numeric:tabular-nums}
.tv[data-etat="invite"] .tv-verre-v{font-size:1.05em;font-weight:600;color:#CFE3F1}
.tv .tv-u{display:inline;font-size:.55em;font-weight:400;color:#CFE3F1}
.tv .tv-barre{height:1.3cqw;border-radius:9px;background:rgba(255,255,255,.18);margin:.45em 0 .3em;overflow:hidden}
.tv .tv-rempli{display:block;height:100%;border-radius:inherit;background:#7FD8A8;transition:width .9s cubic-bezier(.22,1,.36,1)}
.tv .tv-rempli.att{background:#E8C15C}.tv .tv-rempli.al{background:#F0918A}
.tv .tv-verre-rep{font-size:.82em;color:#fff}
.tv .tv-date{font-size:.72em;color:#9DB0BE;margin-top:.15em}

/* Le bas : le message qui tourne et le bouton */
.tv-msg{left:2%;right:31%;bottom:calc(2% + max(44px,11cqw) + 1.6cqw);padding:1.6cqw 2.4cqw}
.tv-msg-texte{font-size:.95em;line-height:1.36;display:-webkit-box!important;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.tv-msg-texte.entre{animation:tvEntre .5s ease both}
@keyframes tvEntre{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.tv .tv-msg-pied{display:flex;justify-content:space-between;align-items:center;gap:6px;margin-top:.1em}
.tv-msg-lien{color:#8FD0F2;font-size:.85em;font-weight:600;text-decoration:underline;text-underline-offset:2px;
  min-height:24px;display:inline-flex;align-items:center}
.tv-msg-suiv{margin-left:auto;background:none;border:0;color:#9DB0BE;font:600 .82em Poppins,sans-serif;
  cursor:pointer;min-height:24px;padding:0 0 0 6px}
.tv-cherche{position:absolute;left:2%;right:2%;bottom:2%;min-height:44px;height:11cqw;
  border:0;border-radius:3cqw;cursor:pointer;background:linear-gradient(180deg,#E3BA4A,#C9A227);color:#0A1B2A;
  font:700 clamp(14px,4.3cqw,19px) Poppins,system-ui,sans-serif;box-shadow:0 6px 20px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.45)}
.tv-cherche:hover{filter:brightness(1.05)}

/* L'arrivée d'une ville : les encarts s'allument l'un après l'autre */
.tv.allume .tv-glace{animation:tvAllume .55s cubic-bezier(.22,1,.36,1) both}
.tv.allume .tv-histo{animation-delay:.08s}.tv.allume .tv-verdicts{animation-delay:.16s}
.tv.allume .tv-verre{animation-delay:.24s}.tv.allume .tv-msg{animation-delay:.32s}
@keyframes tvAllume{from{opacity:0;translate:0 6px}to{opacity:1;translate:0 0}}
@media (prefers-reduced-motion:reduce){.tv-anneau,.tv-lueur,.tv.allume .tv-glace,.tv-msg-texte.entre{animation:none}}
/* Sous 340 px, la police plancher grossit les encarts : on retire le
   superflu pour que « & ma Ville » et le verre restent à découvert. */
@container (max-width:340px){
  .tv-msg-texte{-webkit-line-clamp:2}
  .tv .tv-date,.tv .tv-sp-leg{display:none!important}
  .tv-histo{width:27%}
}
@media print{.tv-cherche,.tv-anneau,.tv-msg{display:none}}

/* Build 585 · le grand tableau du site complet (Pierre, 09/10, 08h36 : « agrandir
   l'image et inclure les données dedans, mettre Mon EAU Nette & ma Ville en avant »).
   Plus large que l'accueil, mais jamais plus haut que l'écran : on le voit en entier. */
.tv.tv-grand{max-width:min(100%,860px,calc((100svh - 150px) * .8007));margin:14px auto 6px}
.tv-grand .tv-glace{font-size:clamp(9.5px,3cqw,22px)}
.tv-grand .tv-cherche{font-size:clamp(14px,4.3cqw,26px)}
.tv .tv-lu{display:block;font-size:.72em;color:#B9CFDE;margin-top:.25em;letter-spacing:.02em;text-transform:none}
.tv-legende{text-align:center;font-family:'Lora',Georgia,serif;font-style:italic;color:#61727f;font-size:12.5px;line-height:1.6;margin:4px auto 10px;padding:0 14px}
.tv-legende a{color:#8D721B;font-weight:600;text-decoration:none}
.tv-grand .tv-eau-etiq{font-size:clamp(11.5px,2.3cqw,18px)!important;padding:.45em .95em!important}
.tv.tv-grand{width:calc(100% - 24px)}
@media (min-width:700px){.tv.tv-grand{width:auto}}
/* le site complet borne « figure img » à 96 px sur téléphone : le tableau n'est pas une vignette */
.tv picture,.tv img{max-height:none;max-width:none}

/* Build 589 · Pierre (09/10, 09h54) : « le cadre rouge qui déborde, c'est pas super ; on peut mieux harmoniser ».
   Le cadre autour du mot EAU devient un halo de la couleur de l'alarme, sans bord : il ne coupe plus les encarts.
   La zone qu'on touche se resserre sur le mot, elle ne chevauche plus aucun encart (règle C3). */
.tv .tv-eau{left:29%!important;width:42%!important}
.tv .tv-eau-anneau{inset:-10% -2%!important;border:0!important;border-radius:50%!important;
  background:radial-gradient(closest-side,color-mix(in srgb,var(--tv-eau) 60%,transparent),color-mix(in srgb,var(--tv-eau) 18%,transparent) 62%,transparent)!important;
  mix-blend-mode:screen;filter:blur(3px);opacity:.75}
/* L'aluminium dans le verre : la jauge va jusqu'à l'alarme (50), un trait blanc marque le repère 20 */
.tv .tv-barre-alu{position:relative;overflow:visible}
.tv .tv-barre-alu .tv-rempli{border-radius:9px}
.tv .tv-repere{position:absolute;top:-35%;bottom:-35%;width:2px;margin-left:-1px;background:#fff;opacity:.85;border-radius:1px}
.tv .tv-verre-rep.ok{color:#7FD8A8}.tv .tv-verre-rep.att{color:#E8C15C}.tv .tv-verre-rep.al{color:#F0918A;font-weight:700}
.tv .tv-ref{display:block;font-size:.7em;color:#9DB0BE;margin-top:.1em}
/* Lecture bébé : le biberon monte en haut à gauche, l'historique passe à droite */
body.profil-bebe .tv .tv-verdicts{left:2%;right:auto;top:20%}
body.profil-bebe .tv .tv-histo{left:auto;right:2%;top:39.5%;width:27%}
/* L'anneau doré du verre chevauchait l'encart des verdicts (et en doublait le geste) : il s'efface, l'encart du verre suffit */
.tv .tv-anneau{display:none}

/* Build 590 · « À surveiller ici » : trois lignes, une pastille de couleur chacune */
.tv .tv-surv{display:flex!important;flex-direction:column;gap:.18em;margin-top:.25em}
.tv .tv-sv{display:flex!important;align-items:baseline;justify-content:space-between;gap:.3em;line-height:1.2}
.tv .tv-sv-n{display:flex;align-items:center;gap:.3em;font-size:.82em;color:#CFE3F1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tv .tv-sv-n::before{content:"";flex:0 0 auto;width:.62em;height:.62em;border-radius:50%;background:#7FD8A8}
.tv .tv-sv.att .tv-sv-n::before{background:#E8C15C}.tv .tv-sv.violet .tv-sv-n::before{background:#B07CF0}
.tv .tv-sv.al .tv-sv-n::before{background:#F0918A;box-shadow:0 0 0 2px rgba(240,145,138,.35)}
.tv .tv-sv-v{font-weight:700;font-size:1em;white-space:nowrap;font-variant-numeric:tabular-nums}
.tv .tv-sv.att .tv-sv-v{color:#E8C15C}.tv .tv-sv.violet .tv-sv-v{color:#C9A7F5}.tv .tv-sv.al .tv-sv-v{color:#F0918A}
.tv .tv-sv-v .tv-u{font-size:.62em}
.tv .tv-sv-res{display:block;font-size:.68em;color:#9DB0BE;margin:-.1em 0 .1em}
.tv .tv-sv-rien{display:block;font-size:.7em;color:#9DB0BE;margin-top:.15em}
/* l'encart « À surveiller ici » porte trois noms entiers : il s'élargit, le message se resserre d'autant */
.tv .tv-verre{width:33%}
.tv .tv-msg{right:37%}
.tv .tv-sv{flex-wrap:wrap;row-gap:0}
.tv .tv-sv-n{font-size:.78em;overflow:visible;white-space:nowrap}
.tv .tv-sv-v{margin-left:auto}

/* ══ Build 604 · Ce qui dépasse pour un biberon, sous l'image ═══════════════
   Pierre (09/10, 16h16) : « tu dis ce qui dépasse et tu dis les taux ».
   Même verre dépoli que les encarts de l'image, posé juste dessous, pleine
   largeur. Rose en lecture bébé, ambre sinon : les bébés d'abord (L1).     */
.tv-bib{box-sizing:border-box;width:100%;max-width:520px;margin:10px auto 0;padding:14px 16px 12px;
  background:linear-gradient(160deg,rgba(16,40,61,.96),rgba(10,27,42,.98));color:#F2F7FA;
  border:1.5px solid rgba(255,255,255,.22);border-radius:16px;font-family:'Poppins',system-ui,sans-serif;text-align:left}
.tv-bib.al{border-color:#F4A6C0;box-shadow:0 0 0 1px rgba(244,166,192,.35),0 8px 24px rgba(10,27,42,.35)}
.tv-bib.att{border-color:#E8C15C}
.tv-bib.ok{border-color:#6CCB8E}
.tv-bib h3{margin:0 0 10px;font-size:15.5px;font-weight:700;line-height:1.3;display:flex;align-items:center;gap:8px;color:#fff}
.tv-bib.al h3{color:#FFD3E0}
.tv-bib-ic{font-size:20px;line-height:1}
.tv-bib-p{display:block;font-family:'Lora',Georgia,serif;font-size:14px;color:#CFE0EA;line-height:1.5}
.tv-bib-l{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.tv-bib-l li{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:10px 12px}
.tv-bib-t{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}
.tv-bib-n{font-size:16px;font-weight:700;color:#fff}
.tv-bib-tri{flex:0 0 auto;font-weight:800;font-size:13px;letter-spacing:.02em;padding:4px 10px;border-radius:8px;
  clip-path:polygon(8% 0,92% 0,100% 100%,0 100%);background:#E8C15C;color:#0A1B2A}
.tv-bib-tri.al{background:#FF7A59;color:#0A1B2A}
.tv-bib-g{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.tv-bib-c{min-width:0;background:rgba(10,27,42,.55);border-radius:9px;padding:7px 8px;display:flex;flex-direction:column;gap:2px}
.tv-bib-c.der{box-shadow:inset 0 0 0 1.5px #F4A6C0}
.tv-bib-c.max{box-shadow:inset 0 0 0 1.5px #FF7A59}
.tv-bib-c.rep{box-shadow:inset 0 0 0 1px rgba(255,255,255,.25)}
.tv-bib-v{font-size:16px;font-weight:700;color:#fff;font-variant-numeric:tabular-nums;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tv-bib-m{font-size:11px;color:#AFC3D0;line-height:1.3}
.tv-bib-pied{display:block;margin-top:10px;font-family:'Lora',Georgia,serif;font-size:13px;color:#CFE0EA;line-height:1.5}
.tv-bib-pied a{color:#8FD0F2;font-weight:700;text-decoration:underline;text-underline-offset:2px;display:inline-block;padding:6px 0;min-height:32px}
@media (max-width:560px){
  .tv-bib{padding:12px 12px 10px;border-radius:14px}
  .tv-bib-g{grid-template-columns:1fr 1fr}
  .tv-bib-v{font-size:15px}
}
.tv.tv-grand + .tv-bib{max-width:min(100%,860px)}
.tv-bib-aussi{display:block;margin-top:9px;font-size:13px;color:#E8C15C;line-height:1.45}
.tv-bib-aussi-t{font-weight:700;color:#F2D98A}

/* ══ Build 605 · A, B, C, D, E, H dans le bloc biberon ═══════════════════ */
.tv-bib-jg{display:block;margin:12px 2px 4px}
.tv-bib-jb{position:relative;display:block;height:12px;border-radius:6px;
  background:linear-gradient(90deg,#2E9E6B 0,#2E9E6B calc(var(--rep) - 22%),#E8C15C calc(var(--rep) - 4%),#E8C15C var(--rep),#FF7A59 calc(var(--rep) + 1%),#FF7A59 100%)}
.tv-bib-jm{position:absolute;top:-6px;width:4px;height:24px;border-radius:2px;transform:translateX(-50%);background:#fff}
.tv-bib-jm.der{background:#F4A6C0;box-shadow:0 0 0 2px #0A1B2A}
.tv-bib-jm.max{background:#FF7A59;box-shadow:0 0 0 2px #fff}
.tv-bib-jl{display:flex;justify-content:space-between;gap:8px;margin-top:8px;font-size:11.5px;color:#DCE7EE}
.tv-bib-jl .rep{color:#fff}.tv-bib-jl .der{color:#F4A6C0;font-weight:700}.tv-bib-jl .max{color:#FF7A59;font-weight:700}
.tv-bib-pa{display:flex;flex-wrap:wrap;align-items:center;gap:4px;margin:10px 0 0}
.tv-bib-pt{width:16px;height:16px;border-radius:50%;background:#2E9E6B;border:2px solid rgba(255,255,255,.25);display:inline-block}
.tv-bib-pt.hors{background:#FF7A59}
.tv-bib-pl{width:100%;font-size:12.5px;color:#DCE7EE;margin-top:2px}
.tv-bib-dq{display:block;margin:10px 0 0;font-size:13px;color:#DCE7EE;line-height:1.45}
.tv-bib-dq.ok{color:#6CCB8E}
.tv-bib-dq-g{font-size:20px;font-weight:800;color:#fff}
.tv-bib-bb{display:block;margin:10px 0 0;padding:9px 11px;border-radius:9px;background:rgba(255,255,255,.07);font-size:13px;color:#DCE7EE;line-height:1.45}
.tv-bib-bb-g{font-size:19px;font-weight:800;color:#fff}
.tv-bib-bb-n{display:block;font-size:11px;color:#AFC3D0;margin-top:3px;font-style:italic}
.tv-bib-pq{display:block;margin:10px 0 2px;font-family:'Lora',Georgia,serif;font-size:13.5px;color:#DCE7EE;line-height:1.5}
.tv-bib-pq-t{font-family:'Poppins',system-ui,sans-serif;font-weight:700;color:#F2D98A}
.tv-bib-pq a{color:#8FD0F2;font-weight:700;text-decoration:underline;text-underline-offset:2px}
.tv-bib-partage{display:block;margin-top:12px}
.tv-bib-btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 16px;border-radius:10px;border:0;cursor:pointer;
  background:#E6C76A;color:#0A1B2A;font:700 14px/1.2 'Poppins',system-ui,sans-serif;text-decoration:none;margin:0 8px 8px 0}
.tv-bib-btn:focus-visible{outline:3px solid #fff;outline-offset:2px}
.tv-bib-partage-etat{display:block;margin-top:6px;font-size:12.5px;color:#DCE7EE}

/* ══ Build 606 · le graphique de l'année et l'impact sur 1, 2, 3 ans ═══════ */
.tv-bib-grw{display:block;margin:12px 0 0}
.tv-bib-gr{display:block;width:100%;height:auto;background:rgba(10,27,42,.5);border-radius:10px}
.tv-bib-gm{font:600 10px 'Poppins',system-ui,sans-serif;fill:#AFC3D0}
.tv-bib-gv{font:700 10.5px 'Poppins',system-ui,sans-serif;fill:#DCE7EE}
.tv-bib-gv.hors{fill:#FFB59E}
.tv-bib-gr-rep{font:600 10px 'Poppins',system-ui,sans-serif;fill:#fff}
.tv-bib-imp{display:block;margin:10px 0 0;padding:10px 11px;border-radius:9px;background:rgba(255,122,89,.12);border:1px solid rgba(255,122,89,.35)}
.tv-bib-imp-t{display:block;font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#FFB59E;margin-bottom:8px}
.tv-bib-imp-g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.tv-bib-imp-c{display:flex;flex-direction:column;gap:1px;background:rgba(10,27,42,.55);border-radius:8px;padding:8px 6px;text-align:center;min-width:0}
.tv-bib-imp-an{font-size:12px;font-weight:700;color:#fff;margin-bottom:3px}
.tv-bib-imp-v{font-size:17px;font-weight:800;color:#fff;line-height:1.1;font-variant-numeric:tabular-nums;white-space:nowrap}
.tv-bib-imp-v.plus{color:#FF7A59;margin-top:5px}
.tv-bib-imp-m{font-size:10.5px;color:#AFC3D0;line-height:1.25}
.tv-bib-gr-rep,.tv-bib-gv{paint-order:stroke;stroke:#0A1B2A;stroke-width:3px;stroke-linejoin:round}

/* ══ Build 607 · « Et ce soir, je mets quoi dans le biberon ? » ══════════ */
.tv-bib-imp{background:rgba(255,255,255,.05);border-color:rgba(230,199,106,.45)}
.tv-bib-imp-t{color:#F2D98A;font-size:13px;letter-spacing:.04em;text-transform:none}
.tv-bib-imp-s{display:block;font-size:12.5px;color:#DCE7EE;margin:-2px 0 8px}
.tv-bib-imp-sel{display:flex;gap:6px;margin-bottom:8px}
.tv-bib-imp-b{font:700 12.5px/1 'Poppins',system-ui,sans-serif;min-height:36px;padding:0 14px;border-radius:999px;border:1.5px solid rgba(255,255,255,.3);background:none;color:#fff;cursor:pointer}
.tv-bib-imp-b[aria-pressed="true"]{background:#E6C76A;border-color:#E6C76A;color:#0A1B2A}
.tv-bib-imp-b:focus-visible{outline:3px solid #fff;outline-offset:2px}
.tv-bib-imp-c{text-align:left;padding:9px 9px 8px;gap:2px}
.tv-bib-imp-c.ici{box-shadow:inset 0 0 0 1.5px #FF7A59}
.tv-bib-imp-c.bout{box-shadow:inset 0 0 0 1.5px #8FD0F2}
.tv-bib-imp-c.osmo{box-shadow:inset 0 0 0 1.5px #6CCB8E}
.tv-bib-imp-n{font-size:11px;font-weight:700;color:#fff;line-height:1.25;min-height:28px}
.tv-bib-imp-c.ici .tv-bib-imp-v{color:#FF7A59}.tv-bib-imp-c.bout .tv-bib-imp-v{color:#8FD0F2}.tv-bib-imp-c.osmo .tv-bib-imp-v{color:#6CCB8E}
.tv-bib-imp-v{font-size:19px}
.tv-bib-imp-moins{display:inline-block;margin-top:4px;font-size:12px;font-weight:800;color:#0A1B2A;background:#6CCB8E;border-radius:6px;padding:2px 7px;align-self:flex-start}
.tv-bib-imp-c.bout .tv-bib-imp-moins{background:#8FD0F2}
.tv-bib-imp-a{display:inline-block;margin-top:7px;padding:8px 0;min-height:36px;color:#F2D98A;font-weight:700;font-size:12px;text-decoration:underline;text-underline-offset:2px}
.tv-bib-imp-pq{display:block;margin-top:10px;font-family:'Lora',Georgia,serif;font-size:13px;color:#DCE7EE;line-height:1.5}
.tv-bib-imp-pq a{color:#8FD0F2;font-weight:700;text-decoration:underline;text-underline-offset:2px}
@media (max-width:420px){.tv-bib-imp-g{grid-template-columns:1fr}.tv-bib-imp-c{display:grid;grid-template-columns:1fr auto;grid-template-areas:"n v" "m v" "moins v" "a a";align-items:center;column-gap:10px}
  .tv-bib-imp-n{grid-area:n;min-height:0}.tv-bib-imp-v{grid-area:v;font-size:22px;text-align:right}.tv-bib-imp-m{grid-area:m}.tv-bib-imp-moins{grid-area:moins;justify-self:start}.tv-bib-imp-a{grid-area:a;margin-top:2px}}

/* ══ Build 608 · prix, poids à porter, barres, et la signature du bloc ═════ */
.tv-bib-imp-tete{display:flex;align-items:center;gap:8px;grid-area:n}
.tv-bib-imp-ic{font-size:20px;line-height:1}
.tv-bib-imp-l{display:flex;align-items:baseline;gap:8px;grid-area:v;justify-content:flex-end}
.tv-bib-imp-barre{display:block;height:6px;border-radius:3px;background:rgba(255,255,255,.12);grid-area:b;margin:4px 0 2px;overflow:hidden}
.tv-bib-imp-rempli{display:block;height:100%;border-radius:3px;background:currentColor}
.tv-bib-imp-c.ici .tv-bib-imp-rempli{background:#FF7A59}.tv-bib-imp-c.bout .tv-bib-imp-rempli{background:#8FD0F2}.tv-bib-imp-c.osmo .tv-bib-imp-rempli{background:#6CCB8E}
.tv-bib-imp-moins{margin-top:0}
.tv-bib-imp-px{display:block;grid-area:p;font-size:12px;color:#DCE7EE;line-height:1.4;margin-top:4px}
.tv-bib-imp-px-v{font-weight:800;color:#F2D98A;font-size:14px}
.tv-bib-imp-plus{display:block;margin-top:10px;font-size:12.5px;color:#DCE7EE;line-height:1.6}
.tv-bib-imp-plus-t{font-weight:700;color:#F2D98A}
.tv-bib-imp-plus a{color:#8FD0F2;text-decoration:underline;text-underline-offset:2px;display:inline-block;padding:4px 0}
@media (max-width:420px){.tv-bib-imp-c{grid-template-columns:1fr auto;grid-template-areas:"n v" "b b" "m m" "p p" "a a"}.tv-bib-imp-n{min-height:0}}
@media (min-width:421px){.tv-bib-imp-c{display:flex;flex-direction:column}.tv-bib-imp-l{justify-content:flex-start}}

.tv-bib-sig{display:block;margin:14px -4px 0;padding:12px 12px 10px;border-radius:12px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14)}
.tv-bib-sig-g{display:block;margin-bottom:8px}
.tv-bib-sig-marque{display:block;font-family:'Poppins',system-ui,sans-serif;font-weight:800;font-size:16px;line-height:1.2;color:#fff;margin-bottom:3px}
.tv-bib-sig-marque .eau{color:#8FD0F2}.tv-bib-sig-marque .nette{color:#E6C76A}.tv-bib-sig-marque .ville{font-style:italic;font-weight:600;color:#DCE7EE;font-size:14px}.tv-bib-sig-marque .q{color:#AFC3D0}
.tv-bib-sig-l{display:block;font-size:12px;color:#DCE7EE;line-height:1.45}
.tv-bib-sig-b{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.tv-bib-sig-btn{display:flex;align-items:center;justify-content:center;min-height:44px;padding:4px 6px;border-radius:9px;border:1.5px solid rgba(255,255,255,.28);background:rgba(10,27,42,.5);
  color:#fff;font:700 12px/1.2 'Poppins',system-ui,sans-serif;text-decoration:none;cursor:pointer;text-align:center;white-space:nowrap}
.tv-bib-sig-btn:hover{border-color:#E6C76A}
.tv-bib-sig-btn:focus-visible{outline:3px solid #E6C76A;outline-offset:2px}
@media (max-width:560px){.tv-bib-sig-b{grid-template-columns:1fr 1fr}.tv-bib-sig-btn{white-space:normal}}

/* ══ Build 609 · l'empreinte de la bouteille, à la fin ════════════════════ */
.tv-bib-emp{display:block;margin-top:12px;padding:11px 11px 10px;border-radius:10px;background:rgba(10,27,42,.55);border:1px solid rgba(255,255,255,.14)}
.tv-bib-emp-t{display:block;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#AFC3D0;margin-bottom:8px;line-height:1.35}
.tv-bib-emp-g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.tv-bib-emp-c{display:flex;flex-direction:column;align-items:center;text-align:center;gap:2px;background:rgba(255,255,255,.06);border-radius:8px;padding:8px 4px;min-width:0}
.tv-bib-emp-ic{font-size:18px;line-height:1}
.tv-bib-emp-v{font-size:14px;font-weight:800;color:#fff;line-height:1.15}
.tv-bib-emp-m{font-size:10.5px;color:#AFC3D0;line-height:1.25}
.tv-bib-emp-ch{display:block;margin-top:9px;font-family:'Lora',Georgia,serif;font-size:13px;color:#DCE7EE;line-height:1.5}
.tv-bib-emp-a{display:inline-block;margin-top:6px;padding:6px 0;color:#8FD0F2;font-weight:700;font-size:12.5px;text-decoration:underline;text-underline-offset:2px}
@media (max-width:360px){.tv-bib-emp-g{grid-template-columns:1fr 1fr}}

/* ══ Build 609 · le tampon complet : QR, source, version, capture propre ══ */
.tv-bib-sig.avec-qr{display:grid;grid-template-columns:1fr auto;grid-template-areas:"g qr" "l l" "b b";column-gap:12px;align-items:start}
.tv-bib-sig.avec-qr .tv-bib-sig-g{grid-area:g;min-width:0}
.tv-bib-sig.avec-qr .tv-bib-sig-b{grid-area:b;margin-top:10px}
.tv-bib-sig-qr{grid-area:qr;display:flex;flex-direction:column;align-items:center;gap:4px;width:112px}
.tv-bib-sig-qr canvas{width:104px;height:104px;border-radius:8px;background:#fff;padding:0;image-rendering:pixelated}
.tv-bib-sig-qr-m{font-size:10px;color:#AFC3D0;text-align:center;line-height:1.25}
.tv-bib-sig-l a{color:#8FD0F2;text-decoration:underline;text-underline-offset:2px}
.men-sig-legal{grid-area:l;color:#AFC3D0;font-size:11px;font-style:italic;font-family:'Lora',Georgia,serif;margin-top:4px}
.tv-bib-sig-b{grid-template-columns:repeat(5,minmax(0,1fr))}
.tv-bib-sig-avis{display:block;margin-top:8px;font-size:12.5px;color:#F2D98A;font-weight:700}
@media (max-width:560px){.tv-bib-sig-b{grid-template-columns:1fr 1fr 1fr}.tv-bib-sig-btn{font-size:11.5px;padding:4px 4px}}
@media (max-width:360px){.tv-bib-sig.avec-qr{grid-template-columns:1fr;grid-template-areas:"g" "qr" "l" "b"}.tv-bib-sig-qr{width:auto}}

/* ══ Build 610 · votre impact, et « tout d'un coup » ═══════════════════════ */
.tv-bib-emp-s{display:block;font-size:13px;color:#DCE7EE;margin:-2px 0 8px;line-height:1.45}
.tv-bib-tdc{display:block;margin-top:12px}
.tv-bib-tdc-img{display:block;width:min(100%,260px);height:auto;border-radius:10px;border:1px solid rgba(255,255,255,.25);margin:8px 0}
/* garde-fous : la page stylise tous les li, ul, details et summary */
.tv-bib ul,.tv-bib ol{list-style:none;margin:0;padding:0}
.tv-bib li{background:none;box-shadow:none;border:0;border-radius:0;margin:0;padding:0;color:#DCE7EE;font-size:13px;line-height:1.45}
.tv-bib .tv-bib-l>li{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:10px 12px}
.tv-bib li::before,.tv-bib li::marker{content:none;display:none}
.tv-bib details{margin:0;padding:0;background:none;border:0}
.tv-bib .tv-bib-ech{margin-top:10px;border:1px solid rgba(255,255,255,.16);background:rgba(10,27,42,.45)}
.tv-bib summary{font:700 13.5px/1.3 'Poppins',system-ui,sans-serif;color:#fff;background:none;border:0}
.tv-bib .tv-bib-ech-l li{display:flex;gap:9px;padding:0;font-size:12.5px}
.tv-bib .tv-bib-ech-t,.tv-bib .tv-bib-ech-v{color:#fff}
.tv-bib .tv-bib-ech-s{color:#AFC3D0;font-weight:500}
.tv-bib .tv-bib-ech-pt{display:inline-block;flex:0 0 12px;width:12px;height:12px;border-radius:50%;margin-top:4px}
.tv-bib .tv-bib-ech-x{display:block;min-width:0}
.tv-bib-ech-dep{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:6px;background:#FF7A59;color:#0A1B2A;font-size:11px;font-weight:800;vertical-align:1px}
.tv-bib summary{flex-direction:column;align-items:flex-start;gap:2px;position:relative;padding-right:28px}
.tv-bib-ech summary::after{position:absolute;right:12px;top:12px;margin:0}
/* ══ Build 613 · deux unités, une seule eau (µS/cm et mg/L) ══════════════ */
.tv-bib-eq{display:block;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;color:#8FD0F2;line-height:1.2;margin-top:1px}
.tv-bib .tv-bib-uni{margin-top:10px;border:1px solid rgba(143,208,242,.35);background:rgba(10,27,42,.45);border-radius:10px;padding:0}
.tv-bib .tv-bib-uni>summary{list-style:none;cursor:pointer;padding:10px 12px;display:flex;flex-direction:column;gap:2px;min-height:44px;box-sizing:border-box}
.tv-bib .tv-bib-uni>summary::-webkit-details-marker{display:none}
.tv-bib .tv-bib-uni>summary::before{content:none}
.tv-bib-uni summary::after{position:absolute;right:12px;top:12px;margin:0}
.tv-bib .tv-bib-uni-t{font-weight:800;font-size:15px;color:#8FD0F2}
.tv-bib .tv-bib-uni-s{font-size:12.5px;color:#AFC3D0}
.tv-bib .tv-bib-uni-s{padding-right:16px}
.tv-bib .tv-bib-uni-l{list-style:none;margin:0;padding:0 12px 12px;display:flex;flex-direction:column;gap:10px}
.tv-bib .tv-bib-uni-l li{display:flex;gap:9px;align-items:flex-start;margin:0;padding:0;background:none;box-shadow:none;border:0;font-size:13.5px;line-height:1.5;color:#DCE7EE}
.tv-bib .tv-bib-uni-l li::before{content:none}
.tv-bib .tv-bib-uni-ic{flex:0 0 auto;font-size:18px;line-height:1.3}
.tv-bib .tv-bib-uni-x{min-width:0}
.tv-bib .tv-bib-uni-v{font-weight:700;color:#fff}
.tv-bib .tv-bib-uni-x a{color:#8FD0F2;text-decoration:underline;text-underline-offset:2px;display:inline;padding:0;font-size:inherit}
.tv-bib .tv-bib-uni-x a:focus-visible{outline:2px solid #E6C76A;outline-offset:2px}

/* Build 641 · le jour, l'altitude, l'air, sous le nom de la ville */
.tv .tv-jour{display:flex;flex-wrap:wrap;justify-content:center;gap:.2em .7em;margin-top:.25em;font-size:.74em;color:#C9D7E2;font-variant-numeric:tabular-nums;letter-spacing:.02em}
.tv .tv-jour [hidden]{display:none}
.tv .tv-j-air.ok{color:#7FD8A8}.tv .tv-j-air.att{color:#E8C15C}.tv .tv-j-air.al{color:#F0918A;font-weight:600}

/* Build 642 · les repères de la commune dans la plaque, à sa taille */

/* Build 643 · la bande des repères, sous l'image : rien ne chevauche plus rien */
.tv-reperes{margin:10px auto 0;max-width:860px;padding:10px 14px;border-radius:18px;background:linear-gradient(180deg,rgba(10,27,42,.92),rgba(7,19,31,.92));border:1px solid rgba(232,193,92,.35);box-shadow:0 8px 24px rgba(0,0,0,.25);font-family:Poppins,system-ui,sans-serif;box-sizing:border-box}
.tv-reperes .tv-jour{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px 8px;margin:0;font-size:13px;color:#DCE7F0}
.tv-reperes .tv-j-h{flex-basis:100%;text-align:center;font:700 12px Poppins,sans-serif;color:#E8C15C;letter-spacing:.12em;text-transform:uppercase;margin-bottom:2px}
.tv-reperes .tv-faits{display:contents}
.tv-reperes .tv-faits li{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1)}
.hero>#tv-reperes{order:8}
body.ville-choisie .hero>#tv-reperes{order:8}

/* Build 644 · limites en vert, références en rouge, biberon en rose */
.tv .tv-l-pc{font-weight:800;font-variant-numeric:tabular-nums}
.tv .tv-ligne.tv-l-lim.ok{color:#7FD8A8}.tv .tv-ligne.tv-l-lim.al{color:#F0918A}
.tv .tv-ligne.tv-l-ref{color:#FF8A80}
.tv .tv-ligne.tv-l-bb{color:#F4A6C0}