/* Site-wide subtle backdrop for username.md.
   Layered: two soft accent radial glows + a 1px grid.
   Adapts to light/dark via prefers-color-scheme.
   Applied as body::before (z-index:-1) so it sits behind content
   but above body's flat background color. pointer-events:none so
   it never intercepts clicks. */

/* Ensure body forms a stacking context so z-index:-1 on the pseudo-
   element paints between body's background and its content — not
   behind body's background layer. */
body { isolation: isolate; }

body::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image:
    radial-gradient(circle at 20% 15%, rgba(108, 99, 255, 0.05), transparent 45%),
    radial-gradient(circle at 80% 30%, rgba(8, 145, 178, 0.04), transparent 45%),
    linear-gradient(to right, rgba(15, 23, 42, 0.035) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(15, 23, 42, 0.035) 1px, transparent 1px);
  background-size: auto, auto, 44px 44px, 44px 44px;
}

@media (prefers-color-scheme: dark) {
  body::before {
    background-image:
      radial-gradient(circle at 20% 15%, rgba(108, 99, 255, 0.14), transparent 45%),
      radial-gradient(circle at 80% 30%, rgba(34, 211, 238, 0.08), transparent 45%),
      linear-gradient(to right, rgba(255, 255, 255, 0.035) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(255, 255, 255, 0.035) 1px, transparent 1px);
    background-size: auto, auto, 44px 44px, 44px 44px;
  }
}