@elevasis/ui 2.41.0 → 2.42.0

package/dist/chunk-WLOQ4IBG.js

@@ -1,654 +0,0 @@
-import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
-import { useComputedColorScheme } from '@mantine/core';
-
-// src/components/layout/backgrounds/AmbientBloomGrid.tsx
-var STYLE = `
-  .elevasis-ambient-bloom-grid {
-    display: none;
-    position: fixed;
-    inset: 0;
-    pointer-events: none;
-    overflow: hidden;
-  }
-  [data-mantine-color-scheme="dark"] .elevasis-ambient-bloom-grid {
-    display: block;
-  }
-  [data-mantine-color-scheme="dark"] .elevasis-ambient-bloom-grid-lobe {
-    mix-blend-mode: screen;
-  }
-  @keyframes elevasis-ambient-bloom-grid-horizon {
-    0%, 100% { transform: translate(0, 0) scale(1); }
-    50% { transform: translate(0, -1.5%) scale(1.05); }
-  }
-  @keyframes elevasis-ambient-bloom-grid-rim-left {
-    0%, 100% { transform: rotate(68deg) translate(0, 0) scale(1); }
-    50% { transform: rotate(68deg) translate(-2%, 3%) scale(1.06); }
-  }
-  @keyframes elevasis-ambient-bloom-grid-rim-right {
-    0%, 100% { transform: rotate(-68deg) translate(0, 0) scale(1); }
-    50% { transform: rotate(-68deg) translate(2%, 3%) scale(1.06); }
-  }
-  @media (prefers-reduced-motion: reduce) {
-    .elevasis-ambient-bloom-grid-lobe { animation: none !important; }
-  }
-`;
-var HORIZON = { width: 140, height: 85, bottom: -18, left: -20 };
-var RIM = { width: 160, height: 220, top: -100, offset: -75 };
-function AmbientBloomGrid({
-  color = "var(--color-primary)",
-  intensity = 0.1,
-  size = 1
-}) {
-  const horizonPct = `${Math.round(intensity * 100)}%`;
-  const rimPct = `${Math.round(intensity * 65)}%`;
-  const h = {
-    width: `${HORIZON.width * size}%`,
-    height: `${HORIZON.height * size}%`,
-    bottom: `${HORIZON.bottom * size}%`,
-    left: `${HORIZON.left * size}%`
-  };
-  const r = {
-    width: `${RIM.width * size}%`,
-    height: `${RIM.height * size}%`,
-    top: `${RIM.top * size}%`,
-    offset: `${RIM.offset * size}%`
-  };
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx("style", { children: STYLE }),
-    /* @__PURE__ */ jsxs("div", { className: "elevasis-ambient-bloom-grid", "aria-hidden": "true", children: [
-      /* @__PURE__ */ jsx(
-        "div",
-        {
-          className: "elevasis-ambient-bloom-grid-lobe",
-          style: {
-            position: "absolute",
-            bottom: h.bottom,
-            left: h.left,
-            width: h.width,
-            height: h.height,
-            background: `radial-gradient(ellipse 55% 55% at 50% 100%, color-mix(in srgb, ${color} ${horizonPct}, transparent) 0%, transparent 65%)`,
-            filter: "blur(80px)",
-            animation: "elevasis-ambient-bloom-grid-horizon 30s ease-in-out infinite",
-            willChange: "transform",
-            transformOrigin: "center center"
-          }
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        "div",
-        {
-          className: "elevasis-ambient-bloom-grid-lobe",
-          style: {
-            position: "absolute",
-            top: r.top,
-            left: r.offset,
-            width: r.width,
-            height: r.height,
-            background: `radial-gradient(ellipse 35% 55% at center, color-mix(in srgb, ${color} ${rimPct}, transparent) 0%, transparent 62%)`,
-            filter: "blur(95px)",
-            animation: "elevasis-ambient-bloom-grid-rim-left 38s ease-in-out infinite",
-            willChange: "transform",
-            transformOrigin: "center center"
-          }
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        "div",
-        {
-          className: "elevasis-ambient-bloom-grid-lobe",
-          style: {
-            position: "absolute",
-            top: r.top,
-            right: r.offset,
-            width: r.width,
-            height: r.height,
-            background: `radial-gradient(ellipse 35% 55% at center, color-mix(in srgb, ${color} ${rimPct}, transparent) 0%, transparent 62%)`,
-            filter: "blur(95px)",
-            animation: "elevasis-ambient-bloom-grid-rim-right 34s ease-in-out infinite",
-            willChange: "transform",
-            transformOrigin: "center center"
-          }
-        }
-      )
-    ] })
-  ] });
-}
-var SUBTLE_DEFAULT_GLOW = "color-mix(in srgb, color-mix(in srgb, var(--color-primary) 20%, var(--color-border)) 30%, transparent)";
-var PROMINENT_DEFAULT_GLOW = "color-mix(in srgb, var(--color-primary) 22%, transparent)";
-function PerspectiveGrid({
-  glowColor: glowColorProp,
-  lineColor: lineColorProp,
-  prominentGlow = false,
-  lineIntensity = 100,
-  glowIntensity = 100,
-  className
-}) {
-  const rawLineColor = lineColorProp ?? "color-mix(in srgb, var(--color-text-subtle) 7%, transparent)";
-  const lineColor = lineIntensity < 100 ? `color-mix(in srgb, ${rawLineColor} ${lineIntensity}%, transparent)` : rawLineColor;
-  const rawGlowColor = glowColorProp ?? (prominentGlow ? PROMINENT_DEFAULT_GLOW : SUBTLE_DEFAULT_GLOW);
-  const glowColor = glowIntensity < 100 ? `color-mix(in srgb, ${rawGlowColor} ${glowIntensity}%, transparent)` : rawGlowColor;
-  const glowHeight = prominentGlow ? "70%" : "60%";
-  const glowGradient = prominentGlow ? `radial-gradient(ellipse 100% 80% at 50% 110%, ${glowColor} -10%, transparent 50%)` : `radial-gradient(ellipse 90% 75% at 50% 112%, ${glowColor} -15%, transparent 45%)`;
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      className,
-      style: {
-        position: "absolute",
-        inset: 0,
-        pointerEvents: "none",
-        overflow: "hidden",
-        perspective: "500px"
-      },
-      children: [
-        /* @__PURE__ */ jsx(
-          "div",
-          {
-            style: {
-              position: "absolute",
-              bottom: 0,
-              left: "50%",
-              transform: "translateX(-50%)",
-              width: "100%",
-              height: glowHeight,
-              background: glowGradient,
-              pointerEvents: "none"
-            }
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          "div",
-          {
-            style: {
-              position: "absolute",
-              left: "-50%",
-              right: "-50%",
-              bottom: 0,
-              height: "70%",
-              backgroundImage: `
-            linear-gradient(${lineColor} 2px, transparent 1px),
-            linear-gradient(90deg, ${lineColor} 2px, transparent 1px)
-          `,
-              backgroundSize: "120px 100px",
-              transform: "rotateX(60deg)",
-              transformOrigin: "bottom center",
-              maskImage: "linear-gradient(to bottom, transparent 0%, black 100%, black 100%, transparent 100%)",
-              WebkitMaskImage: "linear-gradient(to bottom, transparent 0%, black 100%, black 100%, transparent 100%)"
-            }
-          }
-        )
-      ]
-    }
-  );
-}
-var KEYFRAMES = `
-@keyframes elevasis-glow-drift {
-  0% { transform: translateY(0) scale(1); opacity: 1; }
-  20% { transform: translateY(-8%) scale(1.12); opacity: 0.7; }
-  40% { transform: translateY(3%) scale(0.92); opacity: 1; }
-  60% { transform: translateY(5%) scale(1.08); opacity: 0.8; }
-  80% { transform: translateY(-4%) scale(0.95); opacity: 0.9; }
-  100% { transform: translateY(0) scale(1); opacity: 1; }
-}
-@keyframes elevasis-glow-drift-alt {
-  0% { transform: translateY(0) scale(1); opacity: 0.8; }
-  25% { transform: translateY(6%) scale(0.9); opacity: 1; }
-  50% { transform: translateY(-7%) scale(1.15); opacity: 0.7; }
-  75% { transform: translateY(-5%) scale(1.05); opacity: 0.9; }
-  100% { transform: translateY(0) scale(1); opacity: 0.8; }
-}
-@keyframes elevasis-glow-drift-slow {
-  0% { transform: translateY(0) scale(1); opacity: 0.9; }
-  33% { transform: translateY(-4%) scale(1.1); opacity: 0.6; }
-  66% { transform: translateY(6%) scale(0.88); opacity: 1; }
-  100% { transform: translateY(0) scale(1); opacity: 0.9; }
-}
-`;
-function RadiantGlow({
-  color = "var(--color-primary)",
-  opacity = 1,
-  className
-}) {
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      className,
-      style: {
-        position: "absolute",
-        inset: 0,
-        pointerEvents: "none",
-        overflow: "clip",
-        opacity
-      },
-      children: [
-        /* @__PURE__ */ jsx("style", { children: KEYFRAMES }),
-        /* @__PURE__ */ jsx(
-          "div",
-          {
-            style: {
-              position: "absolute",
-              top: "-80%",
-              left: "50%",
-              transform: "translateX(-50%)",
-              width: "200%",
-              height: "200%",
-              background: `radial-gradient(ellipse at center, color-mix(in srgb, ${color} 0.8%, transparent) 0%, transparent 70%)`,
-              animation: "elevasis-glow-drift 20s ease-in-out infinite",
-              willChange: "transform"
-            }
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          "div",
-          {
-            style: {
-              position: "absolute",
-              bottom: "-70%",
-              left: "50%",
-              transform: "translateX(-50%)",
-              width: "180%",
-              height: "180%",
-              background: `radial-gradient(ellipse at center, color-mix(in srgb, ${color} 0.6%, transparent) 0%, transparent 65%)`,
-              animation: "elevasis-glow-drift-alt 24s ease-in-out infinite",
-              willChange: "transform"
-            }
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          "div",
-          {
-            style: {
-              position: "absolute",
-              top: "-20%",
-              left: "50%",
-              transform: "translateX(-50%)",
-              width: "120%",
-              height: "120%",
-              background: `radial-gradient(ellipse at center, color-mix(in srgb, ${color} 0.6%, transparent) 0%, transparent 60%)`,
-              animation: "elevasis-glow-drift-slow 28s ease-in-out infinite",
-              willChange: "transform"
-            }
-          }
-        )
-      ]
-    }
-  );
-}
-var KEYFRAMES2 = `
-@keyframes elevasis-orb-float-0 {
-  0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.5; }
-  25% { transform: translate(12vw, -8vh) scale(1.2); opacity: 0.8; }
-  50% { transform: translate(-5vw, -15vh) scale(0.9); opacity: 0.4; }
-  75% { transform: translate(8vw, 5vh) scale(1.1); opacity: 0.7; }
-}
-@keyframes elevasis-orb-float-1 {
-  0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.6; }
-  30% { transform: translate(-10vw, 6vh) scale(0.85); opacity: 0.3; }
-  60% { transform: translate(7vw, 12vh) scale(1.15); opacity: 0.7; }
-}
-@keyframes elevasis-orb-float-2 {
-  0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.4; }
-  20% { transform: translate(6vw, 10vh) scale(1.3); opacity: 0.7; }
-  50% { transform: translate(-8vw, -4vh) scale(0.8); opacity: 0.3; }
-  80% { transform: translate(3vw, -12vh) scale(1.1); opacity: 0.6; }
-}
-`;
-var ORB_CONFIGS = [
-  { top: "10%", left: "15%", size: "25vw", anim: "elevasis-orb-float-0", dur: "22s" },
-  { top: "60%", left: "70%", size: "30vw", anim: "elevasis-orb-float-1", dur: "28s" },
-  { top: "30%", left: "50%", size: "20vw", anim: "elevasis-orb-float-2", dur: "32s" },
-  { top: "75%", left: "20%", size: "22vw", anim: "elevasis-orb-float-0", dur: "26s" },
-  { top: "5%", left: "75%", size: "18vw", anim: "elevasis-orb-float-1", dur: "30s" },
-  { top: "45%", left: "5%", size: "24vw", anim: "elevasis-orb-float-2", dur: "24s" }
-];
-function FloatingOrbs({
-  color = "var(--color-primary)",
-  count = 6,
-  className
-}) {
-  const orbs = ORB_CONFIGS.slice(0, count);
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      className,
-      style: {
-        position: "absolute",
-        inset: 0,
-        pointerEvents: "none",
-        overflow: "clip"
-      },
-      children: [
-        /* @__PURE__ */ jsx("style", { children: KEYFRAMES2 }),
-        orbs.map((orb, i) => /* @__PURE__ */ jsx(
-          "div",
-          {
-            style: {
-              position: "absolute",
-              top: orb.top,
-              left: orb.left,
-              width: orb.size,
-              height: orb.size,
-              borderRadius: "50%",
-              background: `radial-gradient(circle at center, color-mix(in srgb, ${color} 3%, transparent) 0%, transparent 70%)`,
-              filter: "blur(40px)",
-              animation: `${orb.anim} ${orb.dur} ease-in-out infinite`,
-              willChange: "transform, opacity"
-            }
-          },
-          i
-        ))
-      ]
-    }
-  );
-}
-var KEYFRAMES3 = `
-@keyframes elevasis-grain-shift {
-  0%, 100% { transform: translate(0, 0); }
-  10% { transform: translate(-2%, -3%); }
-  20% { transform: translate(3%, 1%); }
-  30% { transform: translate(-1%, 4%); }
-  40% { transform: translate(4%, -2%); }
-  50% { transform: translate(-3%, 2%); }
-  60% { transform: translate(2%, -4%); }
-  70% { transform: translate(-4%, 1%); }
-  80% { transform: translate(1%, 3%); }
-  90% { transform: translate(3%, -1%); }
-}
-`;
-function FilmGrain({ darkOpacity = 0.02, lightOpacity = 0.06, className }) {
-  const colorScheme = useComputedColorScheme();
-  const opacity = colorScheme === "dark" ? darkOpacity : lightOpacity;
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      className,
-      style: {
-        position: "absolute",
-        inset: 0,
-        pointerEvents: "none",
-        overflow: "clip",
-        opacity,
-        mixBlendMode: colorScheme === "dark" ? "screen" : "multiply"
-      },
-      children: [
-        /* @__PURE__ */ jsx("style", { children: KEYFRAMES3 }),
-        /* @__PURE__ */ jsx("svg", { style: { position: "absolute", width: 0, height: 0 }, children: /* @__PURE__ */ jsx("filter", { id: "elevasis-grain", children: /* @__PURE__ */ jsx("feTurbulence", { type: "fractalNoise", baseFrequency: "0.65", numOctaves: "3", stitchTiles: "stitch" }) }) }),
-        /* @__PURE__ */ jsx(
-          "div",
-          {
-            style: {
-              position: "absolute",
-              inset: "-50%",
-              width: "200%",
-              height: "200%",
-              filter: "url(#elevasis-grain)",
-              animation: "elevasis-grain-shift 0.8s steps(4) infinite",
-              willChange: "transform"
-            }
-          }
-        )
-      ]
-    }
-  );
-}
-function AppBackground({
-  children,
-  gridGlowColor,
-  gridGlowIntensity
-}) {
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(PerspectiveGrid, { glowColor: gridGlowColor, glowIntensity: gridGlowIntensity }),
-    /* @__PURE__ */ jsx(RadiantGlow, {}),
-    /* @__PURE__ */ jsx(FloatingOrbs, {}),
-    /* @__PURE__ */ jsx(FilmGrain, {}),
-    children
-  ] });
-}
-var MOTE_COUNT = 4;
-var randRange = (min, max) => min + Math.random() * (max - min);
-var MOTES = Array.from({ length: MOTE_COUNT }, () => {
-  const size = randRange(2, 16);
-  const duration = randRange(50, 90);
-  return {
-    left: randRange(0, 100),
-    size,
-    blur: size / 2,
-    duration,
-    delay: -randRange(0, duration),
-    drift: randRange(-22, 22),
-    pulse: randRange(3, 9),
-    pulseDelay: -randRange(0, 5)
-  };
-});
-var STYLE2 = `
-  @keyframes elevasis-mote-rise {
-    0%   { transform: translate3d(0, 0, 0); opacity: 0; }
-    12%  { opacity: 1; }
-    70%  { opacity: 0.85; }
-    100% { transform: translate3d(var(--mote-drift, 0px), -85vh, 0); opacity: 0; }
-  }
-  @keyframes elevasis-mote-pulse {
-    0%, 100% {
-      transform: scale(0.75);
-      filter: blur(var(--mote-blur, 2px)) brightness(0.8);
-    }
-    50% {
-      transform: scale(1.35);
-      filter: blur(calc(var(--mote-blur, 2px) * 1.4)) brightness(1.4);
-    }
-  }
-  @media (prefers-reduced-motion: reduce) {
-    .elevasis-floating-mote,
-    .elevasis-floating-mote-inner {
-      animation: none;
-    }
-    .elevasis-floating-mote {
-      opacity: 0;
-    }
-  }
-`;
-function FloatingMotes({
-  coreColor = "var(--color-primary)",
-  haloColor = "color-mix(in srgb, var(--color-primary) 35%, transparent)",
-  bottom = "0"
-}) {
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx("style", { children: STYLE2 }),
-    /* @__PURE__ */ jsx("div", { "aria-hidden": "true", style: { position: "absolute", inset: 0, pointerEvents: "none", overflow: "hidden" }, children: MOTES.map((mote, i) => /* @__PURE__ */ jsx(
-      "div",
-      {
-        className: "elevasis-floating-mote",
-        style: {
-          position: "absolute",
-          bottom,
-          left: `${mote.left}%`,
-          width: `${mote.size}px`,
-          height: `${mote.size}px`,
-          opacity: 0,
-          transform: "translate3d(0, 0, 0)",
-          animation: `elevasis-mote-rise ${mote.duration}s ease-in-out infinite`,
-          animationDelay: `${mote.delay}s`,
-          willChange: "transform, opacity",
-          ["--mote-drift"]: `${mote.drift}px`,
-          ["--mote-blur"]: `${mote.blur}px`
-        },
-        children: /* @__PURE__ */ jsx(
-          "div",
-          {
-            className: "elevasis-floating-mote-inner",
-            style: {
-              width: "100%",
-              height: "100%",
-              borderRadius: "50%",
-              background: `radial-gradient(circle, ${coreColor} 0%, ${haloColor} 45%, transparent 75%)`,
-              filter: `blur(${mote.blur}px)`,
-              animation: `elevasis-mote-pulse ${mote.pulse}s ease-in-out infinite`,
-              animationDelay: `${mote.pulseDelay}s`,
-              willChange: "transform, filter"
-            }
-          }
-        )
-      },
-      i
-    )) })
-  ] });
-}
-function CyberBackground({
-  variant,
-  perspectiveGridRadialGlowIntensity,
-  perspectiveGridLineIntensity
-}) {
-  const defaultIntensity = variant === "chrome" ? 22 : variant === "void" ? 24 : variant === "volt" ? 25 : 28;
-  const intensity = perspectiveGridRadialGlowIntensity ?? defaultIntensity;
-  const glowColor = `color-mix(in srgb, var(--color-primary) ${intensity}%, transparent)`;
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(
-      PerspectiveGrid,
-      {
-        lineColor: "var(--color-border)",
-        prominentGlow: true,
-        glowColor,
-        lineIntensity: perspectiveGridLineIntensity
-      }
-    ),
-    /* @__PURE__ */ jsx(RadiantGlow, {}),
-    /* @__PURE__ */ jsx(FloatingOrbs, {}),
-    /* @__PURE__ */ jsx(FloatingMotes, {}),
-    /* @__PURE__ */ jsx(FilmGrain, {})
-  ] });
-}
-var STYLE3 = `
-  div[style*="var(--color-background)"][style*="100vh"] {
-    background-color: transparent !important;
-    isolation: isolate;
-  }
-  .wavy-bg-root {
-    position: absolute;
-    inset: 0;
-    z-index: -1;
-    overflow: hidden;
-    pointer-events: none;
-    background: var(--color-background);
-  }
-  /* Variant palettes (light mode defaults) */
-  .wavy-bg-root[data-variant="nirvana"] {
-    --wavy-wave-front: #fde8e0;
-    --wavy-wave-back: #fef2ec;
-    --wavy-mote-core: rgba(253, 205, 170, 0.85);
-    --wavy-mote-halo: rgba(253, 205, 170, 0.3);
-  }
-  .wavy-bg-root[data-variant="wave"] {
-    --wavy-wave-front: #dbeafe;
-    --wavy-wave-back: #eef4ff;
-    --wavy-mote-core: rgba(125, 180, 255, 0.85);
-    --wavy-mote-halo: rgba(125, 180, 255, 0.3);
-  }
-  .wavy-bg-root[data-variant="honey"] {
-    --wavy-wave-front: #fbeed3;
-    --wavy-wave-back: #fdf5e0;
-    --wavy-mote-core: rgba(230, 170, 50, 0.85);
-    --wavy-mote-halo: rgba(230, 170, 50, 0.3);
-  }
-  .wavy-bg-root[data-variant="canopy"] {
-    --wavy-wave-front: #dcebdf;
-    --wavy-wave-back: #e6f0e8;
-    --wavy-mote-core: rgba(140, 205, 155, 0.85);
-    --wavy-mote-halo: rgba(140, 205, 155, 0.3);
-  }
-  .wavy-bg-root[data-variant="quarry"] {
-    --wavy-wave-front: #dde0e4;
-    --wavy-wave-back: #e6e9ed;
-    --wavy-mote-core: rgba(150, 158, 170, 0.85);
-    --wavy-mote-halo: rgba(150, 158, 170, 0.3);
-  }
-  /* Variant palettes (dark mode overrides) */
-  [data-mantine-color-scheme="dark"] .wavy-bg-root[data-variant="nirvana"] {
-    --wavy-wave-front: #140804;
-    --wavy-wave-back: #0a0402;
-    --wavy-mote-core: rgba(180, 110, 70, 0.4);
-    --wavy-mote-halo: rgba(180, 110, 70, 0.12);
-  }
-  [data-mantine-color-scheme="dark"] .wavy-bg-root[data-variant="wave"] {
-    --wavy-wave-front: #050e1c;
-    --wavy-wave-back: #030812;
-    --wavy-mote-core: rgba(90, 160, 230, 0.4);
-    --wavy-mote-halo: rgba(90, 160, 230, 0.12);
-  }
-  [data-mantine-color-scheme="dark"] .wavy-bg-root[data-variant="honey"] {
-    --wavy-wave-front: #120e05;
-    --wavy-wave-back: #080502;
-    --wavy-mote-core: rgba(232, 168, 32, 0.4);
-    --wavy-mote-halo: rgba(232, 168, 32, 0.12);
-  }
-  [data-mantine-color-scheme="dark"] .wavy-bg-root[data-variant="canopy"] {
-    --wavy-wave-front: #060f09;
-    --wavy-wave-back: #030805;
-    --wavy-mote-core: rgba(74, 168, 96, 0.4);
-    --wavy-mote-halo: rgba(74, 168, 96, 0.12);
-  }
-  [data-mantine-color-scheme="dark"] .wavy-bg-root[data-variant="quarry"] {
-    --wavy-wave-front: #0d0c0a;
-    --wavy-wave-back: #070605;
-    --wavy-mote-core: rgba(168, 164, 156, 0.4);
-    --wavy-mote-halo: rgba(168, 164, 156, 0.12);
-  }
-  .wavy-bg-layer {
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 200%;
-    height: 100%;
-    will-change: transform;
-  }
-  .wavy-bg-layer svg {
-    display: block;
-    width: 100%;
-    height: 100%;
-  }
-  @keyframes wavy-drift {
-    from { transform: translateX(0); }
-    to   { transform: translateX(-50%); }
-  }
-  .wavy-bg-layer-back {
-    animation: wavy-drift 105s linear infinite;
-  }
-  .wavy-bg-layer-front {
-    animation: wavy-drift 63s linear infinite;
-  }
-  .wavy-bg-wave-back {
-    fill: var(--wavy-wave-back);
-  }
-  .wavy-bg-wave-front {
-    fill: var(--wavy-wave-front);
-  }
-  @media (prefers-reduced-motion: reduce) {
-    .wavy-bg-layer-back,
-    .wavy-bg-layer-front {
-      animation: none;
-    }
-  }
-`;
-function WaveBackground({ variant }) {
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx("style", { children: STYLE3 }),
-    /* @__PURE__ */ jsxs("div", { className: "wavy-bg-root", "data-variant": variant, children: [
-      /* @__PURE__ */ jsx("div", { className: "wavy-bg-layer wavy-bg-layer-back", children: /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 3200 900", preserveAspectRatio: "none", children: /* @__PURE__ */ jsx(
-        "path",
-        {
-          className: "wavy-bg-wave-back",
-          d: "M0,340 C260,200 520,220 820,340 C1100,480 1340,440 1600,340 C1860,200 2120,220 2420,340 C2700,480 2940,440 3200,340 L3200,900 L0,900 Z"
-        }
-      ) }) }),
-      /* @__PURE__ */ jsx("div", { className: "wavy-bg-layer wavy-bg-layer-front", children: /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 3200 900", preserveAspectRatio: "none", children: /* @__PURE__ */ jsx(
-        "path",
-        {
-          className: "wavy-bg-wave-front",
-          d: "M0,640 C280,540 520,560 820,680 C1100,790 1340,760 1600,640 C1880,540 2120,560 2420,680 C2700,790 2940,760 3200,640 L3200,900 L0,900 Z"
-        }
-      ) }) }),
-      /* @__PURE__ */ jsx(FloatingMotes, { coreColor: "var(--wavy-mote-core)", haloColor: "var(--wavy-mote-halo)", bottom: "18%" })
-    ] })
-  ] });
-}
-
-export { AmbientBloomGrid, AppBackground, CyberBackground, FilmGrain, FloatingMotes, FloatingOrbs, PerspectiveGrid, RadiantGlow, WaveBackground };