/* Single-draw-call particle zero. The original painted canvas stays underneath
   as a fallback and is hidden only after WebGL renders successfully. */
.zero-webgl {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 0;
  width: 142cqw;
  height: 142cqh;
  display: block;
  translate: -50% -50%;
  opacity: var(--mesh-opacity, .22);
  pointer-events: none;
  will-change: transform, opacity;
  /* Position and geometry share the renderer transition clock. */
}
.zero-webgl.is-ready { animation: webgl-zero-arrive 1.4s ease-out both; }
.zero-webgl.is-still { will-change: auto; }
@keyframes webgl-zero-arrive {
  from { opacity: 0; scale: .985; }
  to { opacity: var(--mesh-opacity, .22); scale: 1; }
}
.zero-fallback-hidden { opacity: 0 !important; animation: none !important; }
@media (max-width:760px) {
  .zero-webgl { width: 156cqw; height: 156cqh; opacity: var(--mesh-opacity, .22); }
  @keyframes webgl-zero-arrive { from { opacity: 0; scale: .985; } to { opacity: var(--mesh-opacity, .22); scale: 1; } }
}
@media (prefers-reduced-motion:reduce) {
  .zero-webgl { animation: none !important; transition: none !important; opacity: var(--mesh-opacity, .55); will-change: auto; }
}