html, body { height: 100%; }

body{
  margin:0;
  background: transparent; /* important: move the pretty stuff to the fixed layer */
  color: var(--text);
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
  line-height: 1.35;
  position: relative;
  min-height: 100vh;
}

/* Fixed full-viewport background layer (does not scroll) */
body::before{
  content:"";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;

  /* your existing gradient stack goes here */
  background:
    radial-gradient(1200px 700px at 20% 10%, rgba(255,46,166,.14), transparent 50%),
    radial-gradient(900px 600px at 75% 25%, rgba(124,60,255,.14), transparent 55%),
    radial-gradient(700px 500px at 40% 90%, rgba(34,197,94,.10), transparent 55%),
    var(--bg);

  /* optional but helps avoid banding on some displays */
  background-repeat: no-repeat;
  background-size: cover;
}

.ghost-entry{
  opacity: 0.55;
  filter: grayscale(0.2);
}