/* Outil · Boîtiers (Camera sensors) : seulement ce qui lui est propre (le reste vient de app/kit.css).
   Préfixe des classes : bt-
   À gauche : les boîtiers en tuiles, regroupés par marque (zone fixe qui défile ; grisés hors de la marque ou de la recherche).
   À droite : la recherche, les marques, la fiche (5 lignes fixes, un exemple), le lien Crop factor. Au téléphone : recherche
   et marques d'abord. */
.bt .outil-fixe { align-items: stretch; }
.bt-zone { height: 520px; overflow-y: auto; overscroll-behavior: contain; padding: 4px 4px 12px; display: flex; flex-direction: column; gap: 18px; scroll-behavior: smooth; }
.bt-marque .groupe { margin-bottom: 8px; }
.bt-tuiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
@media (min-width: 960px) { .bt-tuiles { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.bt-tuile { height: 58px; border: 0; border-radius: 12px; background: transparent; box-shadow: inset 0 0 0 1px var(--filet-doux); padding: 8px 12px; cursor: pointer;
  display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 4px; text-align: left; transition: background .3s var(--courbe), box-shadow .3s var(--courbe), opacity .3s var(--courbe); }
.bt-tuile b { font: 600 13px/1.2 var(--corps); color: var(--papier); max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bt-tuile span { font: 500 10.5px/1.2 var(--mono); letter-spacing: .04em; color: var(--texte2); }
.bt-tuile:hover { background: rgba(242, 240, 235, .04); }
.bt-tuile[aria-pressed="true"] { background: rgba(242, 240, 235, .08); box-shadow: inset 0 0 0 1px var(--papier); }
.bt-tuile.bt-eteint { opacity: .22; }
.bt-info { flex: none; height: 1lh; margin: 0; }
.bt-maj { flex: none; margin: -10px 0 0; text-align: center; font: 500 10.5px/1.3 var(--mono); letter-spacing: .04em; color: var(--texte2); opacity: .7; }

.bt-marques { flex-wrap: wrap; }
.bt-fiche { display: flex; flex-direction: column; gap: 10px; }
.bt-tete { display: flex; align-items: center; gap: 12px; height: 34px; }
.bt-tete h3 { margin: 0; font: 700 22px/1.1 var(--display); letter-spacing: -.02em; color: var(--papier); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bt-fait { height: 46px; cursor: default; }
.bt-fait .val { white-space: normal; text-align: right; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
.bt-exemple { margin: 0; height: 2lh; font: 400 13.5px/1.5 var(--corps); color: var(--texte2); }
.bt-liens { display: flex; justify-content: center; }
@media (max-width: 959px) {
  .bt [data-recherche], .bt-marques { order: -1; }
  .bt-zone { height: 360px; }
}