/* PromptSaar smooth-scroll and rendering performance */

html{
  scroll-behavior:smooth;
  -webkit-text-size-adjust:100%;
}

body{
  overscroll-behavior-x:none;
  touch-action:pan-y pinch-zoom;
  -webkit-overflow-scrolling:touch;
}

#promptGrid,
.related-grid{
  contain:layout style;
}

.prompt-card,
.related-item{
  content-visibility:auto;
  contain-intrinsic-size:0 420px;
  contain:layout paint style;
  transform:translateZ(0);
  backface-visibility:hidden;
}

.prompt-card img,
.related-item img{
  backface-visibility:hidden;
}

.prompt-card.will-animate{
  transition:
    opacity .17s cubic-bezier(.22,.61,.36,1),
    transform .17s cubic-bezier(.22,.61,.36,1) !important;
  transition-delay:var(--reveal-delay,0ms) !important;
}

#homeLoader{
  min-height:28px;
  contain:layout paint;
}

@media(max-width:700px){
  /* Blur is expensive while scrolling on mobile. Keep the same glass look,
     but use a solid translucent layer for smoother movement. */
  .prompt-overlay-model{
    -webkit-backdrop-filter:none !important;
    backdrop-filter:none !important;
    background:rgba(45,47,54,.66) !important;
  }

  .prompt-card:hover .prompt-media img,
  .related-item:hover img{
    transform:none !important;
  }
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .prompt-card.will-animate{
    transition:none !important;
    transform:none !important;
  }
}