/* Rendering hints for shared animated elements and scrolling surfaces. */

.particle {
  will-change: transform, opacity;
  transform: translateZ(0);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

canvas {
  will-change: transform;
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
  image-rendering: optimizeSpeed;
  image-rendering: -webkit-optimize-contrast;
}

.btn:hover {
  will-change: transform, box-shadow;
}

.fixed,
[style*='position: fixed'],
[style*='position: sticky'] {
  will-change: auto;
  transform: translateZ(0);
}

svg[class*='animate'] {
  will-change: transform;
  transform: translateZ(0);
}

[style*='overflow: auto'],
[style*='overflow: scroll'] {
  will-change: scroll-position;
  -webkit-overflow-scrolling: touch;
}

[style*='backdrop-filter']:not(.liquid-glass-card):not(.lg-card):not(.neural-card-inner) {
  will-change: backdrop-filter;
  transform: translateZ(0);
}

@media (max-width: 768px) {
  [style*='position: fixed'],
  [style*='position:fixed'] {
    transform: translateZ(0);
    -webkit-transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
  }

  .particle {
    will-change: auto;
  }
}