#editor-original-image {
  position: absolute;
  inset: 0;
  z-index: 3;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

#editor-divider,
#editor-slider {
  z-index: 4;
}

.model-progress {
  width: 100%;
  height: 6px;
  margin: 18px 0 12px;
  overflow: hidden;
  border-radius: 999px;
  background: #e3e4df;
}

.model-progress span {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: #3157ff;
  transition: width 180ms ease;
}

#loading-dialog .loading-detail {
  margin-bottom: 0;
  font-size: 12px;
  color: #74756f;
}

/* The homepage no longer offers the pre-made sample entry point. */
#try-demo,
.upload-card > .or {
  display: none !important;
}

@media (max-width: 760px) {
  /* Export only appears after processing succeeds. */
  .mobile-download:disabled {
    display: none !important;
  }

  /*
   * The hero comparison used to place an invisible range input across the
   * entire shoe image. On phones that made ordinary vertical scrolling grab
   * the comparison by accident. Keep the slider interactive only in a narrow
   * touch rail centred on the visible divider / arrow handle.
   */
  #hero-compare #hero-slider {
    top: 0;
    bottom: 0;
    right: auto;
    left: var(--split, 50%);
    width: 44px;
    height: 100%;
    transform: translateX(-50%);
    margin: 0;
    touch-action: none;
  }
}
