/* La jauge de définition du LiDAR (src/topo-definition.js) : dans la vue 3D, à la place du segment, et dans la fenêtre
   qui précède l'ouverture. Un curseur à quatre crans, le cran nommé au-dessus, son effet dessous. */
.tdf-jauge { --tdf-encre: var(--encre); --tdf-attenue: var(--attenue); --tdf-piste: var(--filet-fort); }
.tp .tdf-jauge { --tdf-encre: var(--tp-encre); --tdf-attenue: rgb(var(--tp-v) / .55); --tdf-piste: rgb(var(--tp-v) / .16); }
.tdf-tete { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; font-size: var(--t-12); color: var(--tdf-attenue); }
.tdf-tete b { margin-left: auto; font-size: var(--t-13); font-weight: 500; color: var(--tdf-encre); }
.tdf-tete [data-tp-precision-plus] { flex: none; width: 28px; height: 28px; padding: 0; border: 0; border-radius: var(--r-bouton); background: none; color: var(--tdf-attenue); }
.tdf-tete [data-tp-precision-plus][aria-pressed="true"] { color: var(--tdf-encre); background: rgb(var(--tp-v) / .1); }
.tdf-curseur { -webkit-appearance: none; appearance: none; display: block; width: 100%; height: 28px; margin: 0; background: transparent; cursor: pointer; --tdf-part: 100%; }
.tdf-curseur::-webkit-slider-runnable-track { height: 3px; border-radius: var(--r-fin); background: linear-gradient(to right, var(--tdf-encre) var(--tdf-part), var(--tdf-piste) var(--tdf-part)); }
.tdf-curseur::-moz-range-track { height: 3px; border-radius: var(--r-fin); background: var(--tdf-piste); }
.tdf-curseur::-moz-range-progress { height: 3px; border-radius: var(--r-fin); background: var(--tdf-encre); }
.tdf-curseur::-webkit-slider-thumb { -webkit-appearance: none; width: 20px; height: 20px; margin-top: -8.5px; border-radius: 50%; background: #FFFFFF; box-shadow: 0 1px 3px rgba(0, 0, 0, .35), 0 0 0 .5px rgba(0, 0, 0, .1); }
.tdf-curseur::-moz-range-thumb { width: 20px; height: 20px; border: 0; border-radius: 50%; background: #FFFFFF; box-shadow: 0 1px 3px rgba(0, 0, 0, .35); }
.tdf-crans { display: flex; justify-content: space-between; margin-top: 2px; font-size: var(--t-11); color: var(--tdf-attenue); }
.tdf-effet { margin: 6px 0 0; font-size: var(--t-12); line-height: 1.4; color: var(--tdf-attenue); }
.tdf-libre .tdf-curseur { opacity: .4; }   /* réglage libre (⋯) en cours : la jauge n'a pas de cran */
/* dans la vue 3D : la jauge prend la place du segment */
.tp .tp-precision.tdf-remplace { display: none !important; }
.tp .tdf-dans-tp { padding: 4px 4px 2px; }
@media (pointer: coarse), (max-width: 899px) { .tdf-curseur { height: 44px; } }
/* la fenêtre avant d'entrer */
.tdf-fond { position: fixed; inset: 0; z-index: 2200; display: grid; place-items: center; padding: 16px; background: var(--voile-tiroir); }
.tdf-fenetre { width: min(380px, 100%); display: flex; flex-direction: column; gap: 14px; padding: 16px 16px 14px; border-radius: var(--r-panneau); background: var(--panneau); color: var(--encre); box-shadow: var(--menu-ombre), var(--verre-filet); }
.tdf-haut { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.tdf-haut b { display: block; font-size: var(--t-17); font-weight: 600; }
.tdf-haut small { display: block; margin-top: 2px; font-size: var(--t-12); color: var(--attenue); }
.tdf-pied { display: flex; justify-content: flex-end; gap: 8px; }
@media all /* la mise en page du téléphone, au bureau aussi (Henri, 30/10/2026 : « épure le lidar comme la version téléphonique ») */ {
  .tdf-fond { place-items: end stretch; padding: 0 8px calc(env(safe-area-inset-bottom) + 8px); }
  .tdf-fenetre { width: 100%; }
  /* au bureau la fenêtre ne prend plus toute la largeur (Henri, 07/11/2026) : une feuille de 380 px, centrée en bas */
  @media (min-width: 900px) { .tdf-fond { place-items: end center; } .tdf-fenetre { width: min(380px, 100%); } }
  .tdf-pied .bouton { flex: 1; }
}
.tdf-curseur:focus-visible { outline: 2px solid var(--tdf-attenue); outline-offset: 2px; border-radius: var(--r-bouton); }
/* au bureau, la jauge tient dans la barre du bas de la vue 3D, à côté des couleurs */
@media (min-width: 900px) { .tp .tdf-dans-tp { width: 280px; flex: none; } }
.tdf-fenetre .tdf-points .tdf-crans { justify-content: space-between; }