/* ───── agua (fx/water.js): capa WebGL hermana de #pond, en la misma caja; sólo se ve mientras hay ondas ───── */
html.fx-water #pond-water { position: fixed; inset: 0; width: 100%; height: 100%; z-index: 0; display: block; pointer-events: none; visibility: hidden; }
html.fx-water #pond-water.on { visibility: visible; }
/* mientras el agua está a la vista, el 2D sigue dibujando (es la fuente de la textura) y recibiendo el puntero: sólo deja
   de verse. Opacidad y no visibility: con visibility: hidden dejaría de recibir los clics que tiran comida */
html.fx-water #pond.under-water { opacity: 0 !important; }