/* Headline hover: a soft pool of colour follows the pointer and drifts (woroglobal.com
   final build, headline-liquid). Driven by motion.js, which sets --liquid-x/y and
   --flow-x/y on the heading under the pointer. The rest of the text stays ink. */
body main :is(h1,h2,h3).liquid-active, body .lsx-h.liquid-active {
  background-image:
    radial-gradient(ellipse 60px 65px at calc(var(--liquid-x) + var(--flow-x)) calc(var(--liquid-y) + var(--flow-y)), #ef729c 0%, #c657a3 24%, transparent 100%),
    radial-gradient(ellipse 85px 70px at calc(var(--liquid-x) - 27px) calc(var(--liquid-y) - var(--flow-y)), #638bec 0%, #6151b0 32%, transparent 100%),
    radial-gradient(ellipse 80px 65px at calc(var(--liquid-x) + 33px) calc(var(--liquid-y) + var(--flow-y)), #ffb300 0%, #bd6041 35%, transparent 100%);
  background-color: var(--liquid-base, #111111);
  background-clip: text; -webkit-background-clip: text;
  color: transparent; -webkit-text-fill-color: transparent;
}
body main :is(h1,h2,h3).liquid-active :is(em,span), body .lsx-h.liquid-active :is(em,span) { color: inherit; background: none; -webkit-text-fill-color: inherit; }
@media (forced-colors: active) { body main :is(h1,h2,h3).liquid-active, body .lsx-h.liquid-active { background: none; color: CanvasText; -webkit-text-fill-color: CanvasText; } }
/* The footer switch for visitors who want less motion. */
[data-motion-toggle] { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; text-decoration: underline; text-underline-offset: 4px; }