/* Refonte D2 au téléphone et à la tablette en portrait (moins de 900 px) : mesures de la maquette D2-mobile.
 * html.d2-tel (src/d2-noyau.js) ; html.d2-tab à partir de 600 px (iPad en portrait). Jetons : src/jetons.css.
 */
html { --d2-sa-t: env(safe-area-inset-top); --d2-sa-b: env(safe-area-inset-bottom); --d2-ombre: 0 8px 28px rgba(0, 0, 0, .10), 0 1px 3px rgba(0, 0, 0, .06); --d2-feuille: #FFFFFF; }
html:is([data-theme="sombre"], [data-theme="dark"]) { --d2-ombre: 0 8px 28px rgba(0, 0, 0, .45); --d2-feuille: #161719; }
.d2-tel-tete, .d2-tel-plus, .d2-flottants, .d2-actions-tel, .d2-kp-tel-tete, .d2-voile-tel { display: none; }
@media (max-width: 899px) {
  /* ── ce que la refonte remplace au téléphone : caché, le code reste ── */
  html.d2-tel body.page-app :is(.ct-barre, .ct-resume, .commandes, .barre-fiche, .bulle-parcelle, .panneau-ouvrir, .legende-carte) { display: none !important; }
  html.d2-tel body.page-app > #carte .maplibregl-ctrl-group { display: none !important; }
  html.d2-tel.d2-sans-feuille body.page-app > .feuille { visibility: hidden !important; pointer-events: none !important; }
  html.d2-tel .d2-cmd, html.d2-tel .d2-infobulle, html.d2-tel .d2-situ-grand, html.d2-tel .d2-voile { display: none !important; }
  html.d2-tel body.page-app > #carte .maplibregl-ctrl-bottom-right, html.d2-tel body.page-app > #carte .maplibregl-ctrl-bottom-left { bottom: var(--d2-bas, 0px); transition: bottom .3s cubic-bezier(.32, .72, 0, 1); }
  html.d2-tel body.page-app .maplibregl-ctrl-attrib { font-size: var(--t-10) !important; background: var(--etiquette-fond) !important; color: var(--attenue) !important; }

  /* ── la recherche en capsule ── */
  html.d2-tel body.page-app > .haut { position: absolute !important; z-index: 20; left: 10px !important; right: 10px !important; top: calc(var(--d2-sa-t) + 8px) !important; margin: 0 !important; padding: 0 !important; width: auto !important; }
  html.d2-tel.d2-tab body.page-app > .haut { right: auto !important; width: 420px !important; }
  html.d2-tel body.page-app > .haut .recherche { height: 48px !important; border-radius: 24px !important; background: var(--verre) !important; -webkit-backdrop-filter: blur(20px) saturate(1.4); backdrop-filter: blur(20px) saturate(1.4); box-shadow: var(--d2-ombre) !important; border: 0 !important; padding: 0 4px !important; }
  html.d2-tel body.page-app > .haut .recherche input { font-size: 16px; }
  html.d2-tel body.page-app > .haut :is(.puces, kbd, .raccourci, .recherche-avancee) { display: none !important; }

  /* ── boutons ronds ── */
  html.d2-tel .d2-flottants { display: grid; position: absolute; z-index: 20; right: 10px; top: calc(var(--d2-sa-t) + 66px); gap: 8px; }
  html.d2-tel.d2-tab .d2-flottants { top: calc(var(--d2-sa-t) + 12px); right: 12px; }
  html.d2-tel.d2-tab .d2-flottants .d2-rond { display: none; }
  .d2-rond, .d2-pile { background: var(--verre); -webkit-backdrop-filter: blur(20px) saturate(1.4); backdrop-filter: blur(20px) saturate(1.4); box-shadow: var(--d2-ombre); color: var(--encre); }
  .d2-rond { width: 44px; height: 44px; border-radius: 22px; display: grid; place-items: center; }
  .d2-rond svg.i, .d2-pile svg.i { width: 18px; height: 18px; }
  .d2-pile { border-radius: 22px; display: grid; }
  .d2-pile button { width: 44px; height: 44px; display: grid; place-items: center; color: var(--encre); }
  .d2-pile hr { width: 20px; margin: 0 auto; border: 0; border-top: 1px solid var(--filet); }

  /* ── la fiche : feuille du bas à trois crans ── */
  html.d2-tel .d2-fiche { left: 0; right: 0; top: auto; width: auto; bottom: calc(62px + var(--d2-sa-b)); height: var(--h-plein, 70vh); border-radius: 14px 14px 0 0; background: var(--d2-feuille); -webkit-backdrop-filter: none; backdrop-filter: none;
    box-shadow: 0 -1px 0 var(--filet), 0 -8px 30px rgba(0, 0, 0, .12); transform: translate3d(0, var(--y, 100%), 0); opacity: 1; transition: none; z-index: 25; }
  html.d2-tel .d2-fiche.anim { transition: transform .35s cubic-bezier(.32, .72, 0, 1); }
  html.d2-tel .d2-fiche.cache { transform: translate3d(0, calc(var(--h-plein, 70vh) + 160px), 0); }
  /* iPad en portrait : la même feuille à crans, 420 px, posée à droite au-dessus de sa barre d'actions (maquette .m-tab) */
  html.d2-tel.d2-tab .d2-fiche { left: auto; right: 12px; width: min(420px, calc(100% - 24px)); bottom: calc(12px + 62px); border-radius: 16px 16px 0 0; box-shadow: var(--d2-ombre); }
  html.d2-tel .d2-tel-tete { display: block; flex: none; padding: 0 16px; touch-action: none; cursor: grab; }
  .d2-grabber { height: 22px; display: grid; place-items: center; }
  .d2-grabber i { width: 36px; height: 5px; border-radius: var(--r-fin); background: var(--filet-fort); }
  .d2-f-haut { display: flex; align-items: flex-start; gap: 8px; }
  .d2-f-haut .t { flex: 1; min-width: 0; }
  .d2-tel-surt { font-size: var(--t-12); font-weight: 500; color: var(--attenue); }
  .d2-f-haut h1 { margin: 1px 0 0; font-size: var(--t-17); font-weight: 600; line-height: 1.2; letter-spacing: -.01em; color: var(--encre); }
  .d2-f-haut .lieu { font-size: var(--t-12); color: var(--attenue); margin-top: 1px; }
  .d2-fermer-rond { width: 44px; height: 44px; margin: -8px; border-radius: var(--r-bouton); background: none !important; display: grid; place-items: center; color: var(--attenue) !important; flex: none; } /* la croix nue, 44 px d'appui (lot 1, 28/10/2026) */
  .d2-tel-cles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 12px 0 0; border-top: 1px solid var(--filet); }
  .d2-tel-cle { padding: 10px 8px 12px 10px; border-left: 1px solid var(--filet); min-width: 0; }
  .d2-tel-cle:first-child { border-left: 0; padding-left: 0; }
  .d2-tel-cle .l { font-size: var(--t-11); font-weight: 500; color: var(--attenue); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .d2-tel-cle .v { font-size: var(--t-22); font-weight: 500; line-height: 1.15; margin-top: 2px; font-variant-numeric: tabular-nums; white-space: nowrap; letter-spacing: -.01em; color: var(--encre); overflow: hidden; text-overflow: ellipsis; }
  .d2-tel-cle .v small { font-size: var(--t-12); font-weight: 400; color: var(--attenue); margin-left: 2px; letter-spacing: 0; }
  .d2-tel-cle .v .prix { color: var(--vente); } /* pas --vente-terrain : vert sauge du seul type Terrain depuis le 25/10/2026 */
  html:not([data-theme="sombre"]):not([data-theme="dark"]) .d2-tel-cle .v .prix { color: var(--encre); }
  .d2-tel-cle .p { font-size: var(--t-12); color: var(--attenue); margin-top: 1px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  /* ce que le bureau seul montre */
  html.d2-tel .d2-fiche :is(.d2-surt, .d2-titre-page, [data-cles], [data-mesure], [data-releve], .d2-fiche-pied) { display: none !important; }
  html.d2-tel .d2-fiche-corps { padding: 0 16px 24px; overscroll-behavior: contain; touch-action: pan-y; }
  html.d2-tel .d2-f-onglets { top: 0; margin: 0 -16px; padding: 0 8px; gap: 0; border-top: 1px solid var(--filet); background: var(--d2-feuille); }
  html.d2-tel .d2-f-onglets.colle { background: var(--d2-feuille); }
  html.d2-tel .d2-f-onglet { flex: 1; height: auto; min-height: 44px; padding: 0 !important; white-space: nowrap; }
  html.d2-tel .d2-f-onglet[aria-selected="true"]::after { left: 24%; right: 24%; }
  html.d2-tel .d2-f-vue { padding-top: 14px; }
  html.d2-tel .d2-tel-plus { display: block; }
  .d2-bloc { margin-top: 18px; }
  .d2-bloc h3 { margin: 0 0 8px; font-size: var(--t-12); font-weight: 600; display: flex; align-items: baseline; gap: 8px; color: var(--encre); }
  .d2-bloc h3 .esp { flex: 1; }
  .d2-lien { font-size: var(--t-12) !important; font-weight: 400; color: var(--encre) !important; text-decoration: underline; text-underline-offset: 2px; }
  .d2-note-tel { font-size: var(--t-12); color: var(--discret); margin: 6px 0 0; line-height: 1.45; }
  .d2-repart .d2-rbarre { display: flex; height: 6px; border-radius: var(--r-fin); overflow: hidden; gap: 1px; }
  .d2-repart .d2-rbarre i { display: block; height: 100%; }
  .d2-repart ul { list-style: none; margin: 8px 0 0; padding: 0; }
  .d2-repart li { display: grid; grid-template-columns: 10px 1fr auto 44px; gap: 8px; align-items: center; min-height: 26px; font-size: var(--t-12); color: var(--encre); }
  .d2-repart li i { width: 9px; height: 9px; border-radius: var(--r-fin); }
  .d2-repart li .s { font-variant-numeric: tabular-nums; color: var(--attenue); text-align: right; }
  .d2-repart li .pct { font-variant-numeric: tabular-nums; text-align: right; }
  .d2-repart + .d2-repart { margin-top: 14px; }
  .d2-repart .tt { font-size: var(--t-11); font-weight: 500; color: var(--attenue); margin-bottom: 6px; }
  .d2-releve-tel { border-top: 1px solid var(--filet); }
  .d2-releve-tel div { padding: 9px 0; }
  .d2-recal { display: inline-flex; align-items: center; gap: 6px; font-size: var(--t-12); color: var(--attenue); margin-top: 8px; }
  .d2-recal i { width: 5px; height: 5px; border-radius: 50%; background: var(--discret); }
  .d2-situ-tel { position: relative; height: 150px; border-radius: var(--r-carte); overflow: hidden; background: #ECEBE8; }
  .d2-situ-tel .carte-situ { position: absolute; inset: 0; }
  .d2-situ-tel .d2-situ-ech { position: absolute; z-index: 2; left: 8px; bottom: 6px; font-size: var(--t-10); color: #5b5b60; background: rgba(255, 255, 255, .86); border-radius: var(--r-fin); padding: 0 5px; }
  .d2-situ-texte { font-size: var(--t-12); color: var(--attenue); margin-top: 8px; }
  .d2-situ-texte b { color: var(--encre); font-weight: 500; }
  html.d2-tel .d2-statut { min-height: 28px; }
  html.d2-tel [data-an-plier] span { display: none; }
  html.d2-tel .d2-statut button { width: 36px; height: 44px; justify-content: center; }
  html.d2-tel .d2-synthese { margin: 12px 0 0; padding-top: 12px; border-top: 1px solid var(--filet); }
  .d2-v-histo-tel svg { height: 86px; }
  .d2-ventes-tel { list-style: none; margin: 4px 0 0; padding: 0; }
  .d2-ventes-tel li { display: grid; grid-template-columns: 1fr auto; gap: 2px 12px; padding: 9px 0; border-top: 1px solid var(--filet); }
  .d2-ventes-tel .a { font-size: var(--t-13); font-variant-numeric: tabular-nums; color: var(--encre); }
  .d2-ventes-tel .b { font-size: var(--t-13); text-align: right; font-weight: 500; font-variant-numeric: tabular-nums; color: var(--encre); }
  .d2-ventes-tel :is(.c, .d) { font-size: var(--t-12); color: var(--attenue); font-variant-numeric: tabular-nums; }
  .d2-ventes-tel .d { text-align: right; }

  /* ── la barre d'actions ── */
  html.d2-tel .d2-actions-tel { display: grid; position: absolute; z-index: 26; left: 0; right: 0; bottom: 0; height: calc(62px + var(--d2-sa-b)); padding: 6px 8px var(--d2-sa-b); background: var(--d2-feuille);
    border-top: 1px solid var(--filet); grid-template-columns: 1.25fr 1fr 1fr 1fr 1fr; gap: 2px; transition: transform .35s cubic-bezier(.32, .72, 0, 1); }
  html.d2-tel.d2-tab .d2-actions-tel { left: auto; right: 12px; width: min(420px, calc(100% - 24px)); bottom: 12px; height: 62px; padding-bottom: 6px; border-radius: 0 0 16px 16px; }
  html.d2-tel .d2-actions-tel.cachees { transform: translateY(110%); }
  html.d2-tel.d2-tab .d2-actions-tel.cachees { transform: translateY(calc(100% + 24px)); }
  .d2-act { min-height: 48px; border-radius: var(--r-moyen); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; font-size: var(--t-11) !important; color: var(--encre) !important; white-space: nowrap; }
  .d2-act svg.i { width: 19px; height: 19px; }
  .d2-act:active { background: var(--survol) !important; }
  .d2-act.prim { background: var(--plein) !important; color: var(--plein-texte) !important; font-weight: 500; }

  /* ── le panneau de la carte : feuille au téléphone, flottant à la tablette ── */
  html.d2-tel .d2-voile-tel { display: block; position: absolute; inset: 0; z-index: 40; background: rgba(0, 0, 0, .18); opacity: 0; pointer-events: none; transition: opacity .3s; }
  html.d2-tel .d2-voile-tel.ouvert { opacity: 1; pointer-events: auto; }
  html.d2-tel:not(.d2-tab) .d2-kp { left: 0; right: 0; top: auto; bottom: 0; width: auto; max-height: 72%; z-index: 41; border-radius: 14px 14px 0 0; background: var(--d2-feuille); -webkit-backdrop-filter: none; backdrop-filter: none; box-shadow: var(--d2-ombre);
    transform: translateY(105%); transition: transform .35s cubic-bezier(.32, .72, 0, 1); padding-bottom: var(--d2-sa-b); }
  html.d2-tel:not(.d2-tab) .d2-kp.tel-ouvert { transform: none; }
  html.d2-tel:not(.d2-tab) .d2-kp .d2-kp-tete { display: none !important; }
  html.d2-tel:not(.d2-tab) .d2-kp.reduit .d2-kp-corps { display: block; }
  html.d2-tel:not(.d2-tab) .d2-kp-tel-tete { display: block; flex: none; padding: 0 16px 10px; }
  .d2-kp-tel-tete .ligne { display: flex; align-items: center; gap: 8px; }
  .d2-kp-tel-tete h2 { margin: 0; flex: 1; font-size: var(--t-15); font-weight: 600; color: var(--encre); }
  /* les onglets du panneau deviennent le sélecteur de la feuille */
  html.d2-tel:not(.d2-tab) .d2-kp-onglets { margin: 0 16px; padding: 2px; gap: 2px; border: 0; border-radius: var(--r-moyen); background: var(--actif); grid-template-columns: repeat(4, 1fr); }
  html.d2-tel:not(.d2-tab) .d2-kp-onglet { height: auto; min-height: 32px; border-radius: var(--r-bouton); font-size: var(--t-12); color: var(--attenue); }
  html.d2-tel:not(.d2-tab) .d2-kp-onglet svg { display: none; }
  html.d2-tel:not(.d2-tab) .d2-kp-onglet[aria-selected="true"], html.d2-tel:not(.d2-tab) .d2-kp.reduit .d2-kp-onglet[aria-selected="true"] { background: var(--panneau); color: var(--encre); font-weight: 500; box-shadow: 0 1px 3px rgba(0, 0, 0, .12); }
  html.d2-tel:not(.d2-tab):is([data-theme="sombre"], [data-theme="dark"]) .d2-kp-onglet[aria-selected="true"] { background: rgba(255, 255, 255, .14); box-shadow: none; }
  html.d2-tel:not(.d2-tab) .d2-kp-onglet[aria-selected="true"]::after { display: none; }
  html.d2-tel:not(.d2-tab) .d2-kp-corps { padding: 12px 16px 16px; }
  html.d2-tel:not(.d2-tab) .d2-couche { min-height: 52px; }
  html.d2-tel:not(.d2-tab) .d2-puce { min-height: 36px; padding: 0 14px !important; border-radius: 18px; font-size: var(--t-13) !important; }
  html.d2-tel:not(.d2-tab) .d2-fond-opt { min-height: 60px; }
  html.d2-tel.d2-tab .d2-kp { top: calc(var(--d2-sa-t) + 68px); left: 12px; z-index: 22; }
  /* contrôles iOS de la maquette dans la feuille : interrupteurs 51 × 31 à la place des yeux, pastilles pleines, poignées de 24 px */
  html.d2-tel:not(.d2-tab) .d2-kp .d2-oeil { width: 51px; height: 31px; border-radius: var(--r-panneau); background: var(--actif); position: relative; flex: none; transition: background .2s; }
  html.d2-tel:not(.d2-tab) .d2-kp .d2-oeil svg { display: none; }
  html.d2-tel:not(.d2-tab) .d2-kp .d2-oeil::after { content: ""; position: absolute; top: 2px; left: 2px; width: 27px; height: 27px; border-radius: 50%; background: #fff; box-shadow: 0 2px 4px rgba(0, 0, 0, .18); transition: transform .25s cubic-bezier(.32, .72, 0, 1); }
  html.d2-tel:not(.d2-tab) .d2-kp .d2-oeil[aria-pressed="true"] { background: #34C759; }
  html.d2-tel:not(.d2-tab):is([data-theme="sombre"], [data-theme="dark"]) .d2-kp .d2-oeil[aria-pressed="true"] { background: #8FB98A; }
  html.d2-tel:not(.d2-tab) .d2-kp .d2-oeil[aria-pressed="true"]::after { transform: translateX(20px); }
  html.d2-tel:not(.d2-tab) .d2-kp .d2-couche { border-top: 1px solid var(--filet); border-radius: 0; padding-left: 0; }
  html.d2-tel:not(.d2-tab) .d2-kp .d2-inter { width: 51px; height: 31px; border-radius: var(--r-panneau); }
  html.d2-tel:not(.d2-tab) .d2-kp .d2-inter::after { width: 27px; height: 27px; box-shadow: 0 2px 4px rgba(0, 0, 0, .18); }
  html.d2-tel:not(.d2-tab) .d2-kp .d2-inter[aria-checked="true"] { background: #34C759 !important; }
  html.d2-tel:not(.d2-tab):is([data-theme="sombre"], [data-theme="dark"]) .d2-kp .d2-inter[aria-checked="true"] { background: #8FB98A !important; }
  html.d2-tel:not(.d2-tab) .d2-kp .d2-inter[aria-checked="true"]::after { transform: translateX(20px); background: #fff; }
  html.d2-tel:not(.d2-tab) .d2-kp .d2-puce[aria-pressed="true"] { background: var(--encre) !important; color: var(--d2-feuille) !important; }
  html.d2-tel:not(.d2-tab) .d2-kp .d2-curseur { height: 32px; }
  html.d2-tel:not(.d2-tab) .d2-kp .d2-curseur :is(.rail, .plage) { top: 15px; height: 2px; }
  html.d2-tel:not(.d2-tab) .d2-kp .d2-curseur .poignee { top: 4px; width: 24px; height: 24px; margin-left: -12px; background: #fff; box-shadow: 0 1px 4px rgba(0, 0, 0, .25); }
  html.d2-tel:not(.d2-tab) .d2-kp [data-vue="filtres"] .d2-note, html.d2-tel:not(.d2-tab) .d2-kp .d2-frise .d2-frise-tete { display: none; }
  html.d2-tel:not(.d2-tab) .d2-kp .d2-champs2 { display: none; }
  /* la frise, dans Filtres, au téléphone */
  html.d2-tel .d2-frise { left: 12px; right: 12px; bottom: calc(var(--d2-bas, 0px) + 12px); }
  html.d2-tel:not(.d2-tab) .d2-kp .d2-frise { position: static; margin: 4px 6px 0; padding: 0; background: none; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
  html.d2-tel:not(.d2-tab) .d2-kp:not([data-onglet="filtres"]) .d2-frise { display: none; }
  html.d2-tel:not(.d2-tab) body.page-app > .d2-frise { display: none; }
  html.d2-tel.d2-tab .d2-frise { display: none; }
  /* étiquettes de la carte, au doigt : numéros sans fond, comme la maquette */
  html.d2-tel .d2-etq { padding: 2px 5px; border-radius: var(--r-fin); line-height: 16px; }
  html.d2-tel .d2-num:not(.sel) { background: none; padding: 0; line-height: 14px; color: var(--attenue); }
  html.d2-tel .d2-num.ame:not(.sel) { color: var(--attenue); }
}
@media (max-width: 899px) {
  /* le nom de la parcelle, au doigt : l'étiquette pleine du thème, comme la maquette D2-mobile */
  html.d2-tel .d2-num.sel { background: var(--etiquette-fond); color: var(--etiquette-texte); font-size: var(--t-12); font-weight: 500; line-height: 16px; padding: 2px 5px; border-radius: var(--r-fin); }
}
/* un rapport ouvert passe devant la feuille de la fiche et la barre d'actions (z-index 25-26) : il restait dessous au téléphone */
html.d2-tel body.rapport-ouvert .rapport { z-index: 60; }
/* Le menu « Rapport » de la fiche au téléphone (src/d2-fiche.js, menuAuTelephone) : toute la largeur, toute la hauteur libre
   au-dessus de la barre d'actions, et un fondu en bas tant qu'il reste des entrées à faire défiler. */
html.d2-tel .menu-flottant[data-mf-tel] { left: 8px !important; right: 8px !important; width: auto; max-height: calc(100dvh - var(--mf-bas, 90px) - env(safe-area-inset-top, 0px) - 8px); overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
html.d2-tel .menu-flottant[data-mf-tel] button { min-height: 44px; }
html.d2-tel .menu-flottant[data-mf-tel][data-mf-suite] { -webkit-mask-image: linear-gradient(#000 calc(100% - 44px), transparent); mask-image: linear-gradient(#000 calc(100% - 44px), transparent); }