:root { color-scheme: dark; background: #000; }
* { box-sizing: border-box; }
body { margin: 0; min-width: 0; font-family: Tahoma, "MS Sans Serif", Arial, sans-serif; }
[hidden] { display: none !important; }
.lune { min-height: 100vh; min-height: 100svh; }
.lune::before {
  content: "";
  position: fixed;
  inset: 0;
  background: linear-gradient(rgb(0 0 0 / 80%), rgb(0 0 0 / 80%)),
    url("images/la-lune.png") center / cover no-repeat;
  pointer-events: none;
}
.fenetres { position: fixed; inset: 0; pointer-events: none; }
.fenetre95 {
  position: absolute;
  left: calc(50% + var(--x));
  top: calc(50% + var(--y));
  width: calc(100% - 60px);
  max-width: 330px;
  transform: translate(-50%, -50%);
  padding: 3px;
  color-scheme: light;
  color: #000;
  background: #c0c0c0;
  border: 2px solid;
  border-color: #dfdfdf #000 #000 #dfdfdf;
  box-shadow: inset 1px 1px #fff, inset -1px -1px #808080, 3px 3px #000;
  pointer-events: auto;
  animation: erreur95 .18s steps(3, end) both;
}
.bandeau95 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 25px;
  padding: 3px 3px 3px 5px;
  background: #000080;
  color: #fff;
  font-size: 12px;
  line-height: 1.3;
  font-weight: bold;
}
.titre95 { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.bouton95 {
  padding: 4px 12px;
  border: 2px solid;
  border-color: #fff #000 #000 #fff;
  border-radius: 0;
  box-shadow: inset 1px 1px #dfdfdf, inset -1px -1px #808080;
  background: #c0c0c0;
  color: #000;
  font: 13px/1.25 Tahoma, "MS Sans Serif", Arial, sans-serif;
  cursor: pointer;
}
.bouton95:active {
  border-color: #000 #fff #fff #000;
  box-shadow: inset 1px 1px #808080;
}
.bouton95:focus-visible { outline: 1px dotted #000; outline-offset: -5px; }
.fermer95 { flex-shrink: 0; width: 20px; height: 19px; padding: 0; font: bold 18px/13px Arial, sans-serif; }
.contenu95 { display: flex; align-items: flex-start; gap: 14px; padding: 22px 14px 18px; }
.icone95 {
  display: grid;
  place-items: center;
  flex-shrink: 0;
  width: 30px;
  height: 30px;
  border: 1px solid #800000;
  border-radius: 50%;
  background: #f00;
  color: #fff;
  font: bold 33px/1 Arial, sans-serif;
  box-shadow: 1px 1px #808080;
}
.texte95 { margin: 0; font-size: 13px; line-height: 1.45; }
.actions95 { display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; padding: 0 12px 14px; }
.actions95 .bouton95 { min-width: 76px; min-height: 28px; }
.relancer { position: fixed; bottom: max(32px, env(safe-area-inset-bottom)); left: 50%; transform: translateX(-50%); white-space: nowrap; }
.annonce { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
@keyframes erreur95 {
  0% { transform: translate(-50%, calc(-50% + 8px)); }
  65% { transform: translate(-50%, calc(-50% - 3px)); }
  100% { transform: translate(-50%, -50%); }
}
@media (prefers-reduced-motion: reduce) { .fenetre95 { animation: none; } }