"box-shadow: inset paints outside the element in Razor panels"

• A box-shadow: inset meant to darken a panel's inner edges instead renders as a halo around the panel.
• Scaled up to a full-screen inset vignette (the classic screen-edge darkening), it renders nothing at all — silently, no error, no console warning, just an absent effect.

In s&box Razor panels, box-shadow with the inset keyword paints outside the element — inset is effectively ignored rather than weakly supported. The shadow is drawn as an ordinary outer shadow, so:

• On a small element, the "inner darkening" you asked for appears as an outer halo.
• On a full-screen element, there is no room outside it to draw an outer shadow, so the effect simply vanishes.

Do not build vignettes or inner glows from box-shadow: inset. Build them from linear-gradient bands layered as a background or overlay — a radial or directional gradient renders reliably.

// DOESN'T WORK — inset is ignored, paints outside:
.panel {
    box-shadow: inset 0 0 40px rgba(black, 0.6); // outer halo, or nothing full-screen
}

// WORKS — gradient bands as an overlay give the inner-darkening look:
.vignette-overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    background: linear-gradient(to right, rgba(black, 0.6), transparent 12%, transparent 88%, rgba(black, 0.6)),
                linear-gradient(to bottom, rgba(black, 0.6), transparent 12%, transparent 88%, rgba(black, 0.6));
    pointer-events: none;
}

Layering the horizontal and vertical gradients gives you edge-darkening on all four sides; tune the band widths and opacity to taste. For a soft circular vignette, a single radial gradient (transparent center → dark edge) works the same way.

inset shadows require the renderer to draw the shadow clipped to the element's interior; the s&box Razor shadow path doesn't honor that flag, so it falls back to an outer shadow (which has nowhere to go on a full-bleed element). A gradient is a plain paint into the element's own box, with no dependency on inset-shadow support — so it renders wherever the element does, at any size, including full-screen.