/* pool-gags.css — estilos de los gags de Pool (pool_gags.js), 2026-10-04.
   Una sola capa fija con pointer-events apagados (solo la burbuja de pregunta recibe clics). Todo se apaga con movimiento reducido
   (pool_gags.js ni siquiera arranca un gag en ese caso). */
.tz-pg-capa { position: fixed; inset: 0; z-index: 905; pointer-events: none; overflow: hidden; }
.tz-pg-capa svg { position: absolute; overflow: visible; }
.tz-pg-tentaculo, .tz-pg-tajo, .tz-pg-hilo { left: 0; top: 0; width: 100%; height: 100%; }
.tz-pg-espadas { width: 200px; height: 120px; }
.tz-pg-grieta { width: 120px; height: 120px; }
.tz-pg-grieta path { fill: none; stroke: rgba(255, 255, 255, .85); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; filter: drop-shadow(0 0 1px rgba(0, 0, 0, .6)); }
.tz-pg-onda { position: absolute; width: 90px; height: 90px; border-radius: 50%; border: 3px solid rgba(255, 255, 255, .85); box-shadow: 0 0 18px rgba(255, 255, 255, .45), inset 0 0 14px rgba(255, 255, 255, .25); }
.tz-pg-particula { position: absolute; display: block; border-radius: 50%; background: currentColor; will-change: transform, opacity; }
.tz-pg-particula.tz-pg-cuadro { border-radius: 2px; }
.tz-pg-particula.tz-pg-glifo { background: none; border-radius: 0; line-height: 1; }

.tz-pg-burbuja { position: absolute; max-width: min(260px, calc(100vw - 24px)); padding: 9px 12px; border-radius: 12px; font-size: 13px; line-height: 1.4;
  color: var(--color-text); background: var(--tz-panel, #fff); border: 1px solid var(--pool-ambar, #d4a24c); box-shadow: var(--shadow-md, 0 6px 18px rgba(0, 0, 0, .25)); }
.tz-pg-burbuja::after { content: ""; position: absolute; right: 30px; bottom: -7px; width: 12px; height: 12px; background: var(--tz-panel, #fff);
  border-right: 1px solid var(--pool-ambar, #d4a24c); border-bottom: 1px solid var(--pool-ambar, #d4a24c); transform: rotate(45deg); }
.tz-pg-burbuja.tz-pg-pregunta { pointer-events: auto; }
.tz-pg-botones { display: flex; gap: 6px; margin-top: 8px; flex-wrap: wrap; }
.tz-pg-botones button { font: inherit; font-size: 12px; cursor: pointer; padding: 4px 10px; border-radius: 999px; color: var(--color-text); background: transparent; border: 1px solid var(--pool-ambar, #d4a24c); }
.tz-pg-botones button:hover { background: color-mix(in srgb, var(--pool-ambar, #d4a24c) 22%, transparent); }
.tz-pg-botones button:focus-visible { outline: 2px solid var(--color-accent); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { .tz-pg-capa { display: none; } }

/* Sombra de contacto de Pool durante saltos y vuelos (se encoge y aclara con la altura). */
.tz-pg-sombra { position: absolute; width: 74px; height: 12px; margin-left: 0; border-radius: 50%; will-change: transform, opacity;
  background: radial-gradient(closest-side, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0)); }