/* Mesh gradient (round 30 r.163–184, round 31 r.105–118): the layer behind x-sc.mesh. sc-mesh.js draws
   the canvas (WebGL) or sets .is-css with --sc-mesh-c1..5; the fade runs into --sc-mesh-ground of the parent,
   which the runtime also reads as the shader base; --sc-mesh-lift is the soft lift above that base.
   Tokens only, no colour literals. */

.sc-creator-stage {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    --sc-mesh-ground: var(--sc-color-black);
}
html[data-sc-theme="light"] .sc-creator-stage {
    --sc-mesh-ground: var(--sc-color-white);
}

.sc-mesh {
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    contain: strict;
    --sc-mesh-lift: var(--sc-color-surface);
}
html[data-sc-theme="light"] .sc-mesh {
    --sc-mesh-lift: var(--sc-color-bg-light);
}
.sc-mesh canvas {
    width: 100%;
    height: 100%;
    display: block;
}
.sc-mesh::after {
    content: "";
    position: absolute;
    inset: 0;
}
.sc-mesh[data-sc-mesh-fade="bottom"]::after {
    background: linear-gradient(to bottom, transparent 50%, var(--sc-mesh-ground));
}
.sc-mesh[data-sc-mesh-fade="top"]::after {
    background: linear-gradient(to top, transparent 50%, var(--sc-mesh-ground));
}

/* No WebGL: layered radial gradients on the same five colours. */
.sc-mesh.is-css {
    background:
        radial-gradient(50% 60% at 15% 20%, var(--sc-mesh-c1), transparent),
        radial-gradient(45% 55% at 85% 25%, var(--sc-mesh-c2), transparent),
        radial-gradient(50% 60% at 30% 85%, var(--sc-mesh-c3), transparent),
        radial-gradient(45% 55% at 80% 80%, var(--sc-mesh-c4), transparent),
        radial-gradient(15% 20% at 55% 50%, var(--sc-mesh-c5), transparent),
        var(--sc-mesh-ground);
}
.sc-mesh.is-css canvas {
    display: none;
}