/* Outil · Labo (Darkroom) : seulement ce qui lui est propre (le reste vient de app/kit.css).
   Préfixe des classes : lb-
   À gauche : l'aperçu (zone fixe, damier sombre derrière : la transparence du Polaroid), la ligne d'info, ‹ Exporter PNG ›
   (‹ › passent d'une photo à l'autre pour la date et le Polaroid). À droite : les photos (ajouter, depuis une vidéo, vider),
   le mode, son panneau (les quatre empilés dans la même case). */
.lb .outil-fixe { align-items: stretch; }
.lb-zone { position: relative; height: 460px; border-radius: 14px; display: grid; place-items: center; overflow: hidden; box-shadow: inset 0 0 0 1px var(--filet-doux);
  background-color: #1d1b19; background-image: conic-gradient(#232120 25%, transparent 0 50%, #232120 0 75%, transparent 0); background-size: 18px 18px; }
.lb-zone.survol { box-shadow: inset 0 0 0 1.5px var(--orange); }
.lb-zone canvas { display: block; }
.lb[data-mode="planche"] .lb-zone canvas { cursor: pointer; }
.lb-vide { position: absolute; inset: 0; margin: 0; display: grid; place-items: center; font: var(--valeur); letter-spacing: .06em; color: var(--texte2); }
.lb-vide[hidden] { display: none; }
.lb-info { flex: none; height: 1lh; margin: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.lb-actions { display: flex; justify-content: center; align-items: center; gap: 12px; }
.lb-pas { width: 38px; height: 38px; }
.lb-pas:disabled { opacity: .25; }
.lb .pastille { cursor: pointer; }
.lb .pastille:hover { translate: none; }
.lb .pastille:disabled { opacity: .3; cursor: default; }
.lb-photos { display: flex; flex-direction: column; gap: 10px; }
.lb-photos-tete { display: flex; justify-content: space-between; align-items: baseline; }
.lb-photos-tete .groupe { padding: 0; }
.lb-compte { font: 500 12px/1.2 var(--mono); color: var(--papier); }
.lb-boutons { display: flex; flex-wrap: wrap; gap: 8px; }
.lb-modes button { padding-inline: 4px; }
.lb-panneaux { display: grid; }
.lb-panneau { grid-area: 1 / 1; display: flex; flex-direction: column; gap: 14px; }
.lb-panneau[hidden] { display: flex; visibility: hidden; }
.lb-source { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; align-items: end; }
.lb-source .saisie { color-scheme: dark; }
.lb-source .saisie:disabled { opacity: .3; }
.lb-note { margin: 0; font: 400 13px/1.5 var(--corps); color: var(--texte2); }
@media (max-width: 959px) {
  .lb-zone { height: 320px; }
  .lb-source { grid-template-columns: 1fr; }
}
