/* =============================================================================
   LE VOILE D'OUVERTURE — `OUV-1`, 14/09/2026.

   David : *« il faut que l'ouverture de la caisse devienne obligatoire, on ne
   peut pas voir le hub si la caisse n'est pas ouverte. Donc à l'ouverture,
   écran semi-opaque verre poncé, et écran d'ouverture de caisse. Une fois le
   montant de la caisse inscrit, on peut accéder au hub. »*

   ⚠️  C'EST UN GARDE-FOU POSÉ SUR SA DEMANDE, mot pour mot — pas une précaution
       de l'opérateur. Il ne se retire pas sans qu'il le dise.

   Le voile est visible dès le premier octet du HTML (pas de `hidden` dans le
   balisage) : le Hub n'apparaît jamais, même une seconde, avant que la caisse
   ait dit qu'elle est ouverte. `ouverture.js` le lève.

   ⚠️  `z-index: 150` — SOUS le clavier tactile (200, `clavier.css`) : le pavé
       doit pouvoir monter par-dessus le voile pour taper le fond de caisse. Et
       au-dessus de tout le reste de l'accueil (45 au plus haut).
   ============================================================================= */
#ouverture {
  position: fixed; inset: 0; z-index: 150;
  display: flex; align-items: center; justify-content: center;
  padding: 20px;
  background: rgba(8, 13, 22, 0.55);
  /* Le verre poncé : on devine le Hub, on ne le lit pas. */
  backdrop-filter: blur(14px) saturate(0.8);
  -webkit-backdrop-filter: blur(14px) saturate(0.8);
}
/* `display: flex` battrait `[hidden]` — `B000-D480`, quatre fois mesuré. */
#ouverture[hidden] { display: none; }

.ouverture-boite {
  background: var(--bleu);
  border: 1px solid var(--bleu-clair); border-radius: 14px;
  padding: 22px 24px; width: 520px; max-width: 100%;
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.55);
}
.ouverture-boite.large { width: 980px; }
.ouverture-boite[hidden] { display: none; }
.ouverture-boite h2 { margin: 0 0 8px; }
.ouverture-boite .note { margin: 0 0 14px; color: var(--gris); font-size: 0.92rem; line-height: 1.5; }

.ouverture-ligne { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.ouverture-ligne label { font-weight: 700; color: var(--or); }
/* Le montant se lit de loin, et se tape au doigt : gros, haut, chiffres à
   chasse fixe. `dir="ltr"` : un montant ne se retourne pas en hébreu. */
#ouverture-fond {
  flex: 0 0 200px; min-height: var(--cible);
  font-size: 1.6rem; font-variant-numeric: tabular-nums;
  padding: 0 14px; border-radius: 8px;
  border: 1px solid var(--bleu-clair); background: var(--fond); color: var(--texte);
}
.ouverture-actions { display: flex; gap: 10px; justify-content: flex-end; margin-top: 18px; }
/* `.bouton` est `inline-flex` et `.ouverture-ligne` est `flex` : sans ces deux
   lignes, `hidden` ne cacherait ni le formulaire ni « Réessayer » (`B000-D480`). */
.ouverture-ligne[hidden], .ouverture-actions .bouton[hidden] { display: none; }