.spray-intro {
  --intro-ready: 1;
  position: fixed;
  inset: 0;
  z-index: 100;
  overflow: hidden;
  background: #f1c3c4;
  isolation: isolate;
  overscroll-behavior: contain;
  touch-action: none;
}
.spray-intro[hidden] { display: none; }
.spray-intro__bottle,
.spray-intro__logo {
  position: absolute;
  display: block;
  pointer-events: none;
}
.spray-intro__bottle {
  transform-origin: 0 0;
  will-change: transform, opacity;
}
.spray-intro__bottle img,
.spray-intro__logo img {
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  display: block;
}
.spray-intro__bottle img { object-fit: contain; }
.spray-intro__logo { opacity: 0; }
.spray-intro__mist {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  pointer-events: none;
}
.spray-intro__skip {
  position: absolute;
  right: max(20px, env(safe-area-inset-right));
  top: max(20px, env(safe-area-inset-top));
  z-index: 3;
  padding: 9px 17px;
  border: 1px solid #a5707c;
  border-radius: 30px;
  color: #55353e;
  background: #fff3f6d9;
  font: 700 13px Quicksand, sans-serif;
  cursor: pointer;
}
.spray-intro__skip:hover { background: #fff3f6; }
@media (prefers-reduced-motion: reduce) {
  .spray-intro { display: none !important; }
}
