@layer properties,theme,base;@layer components{.hero-backdrop__fallback{background:var(--semantic-color-canvas-inverse);position:absolute;inset:0}.hero-backdrop__vignette{pointer-events:none;background:radial-gradient(ellipse 66% 72% at 52% 52%, transparent 32%, var(--component-hero-scrim-ring-1) 58%, var(--component-hero-scrim-ring-2) 92%, var(--component-hero-scrim-ring-3) 100%), linear-gradient(to bottom, var(--component-hero-scrim-top), transparent 24%), linear-gradient(to top, var(--component-hero-scrim-bottom), transparent 24%);position:absolute;inset:0}@media not all and (min-width:1280px){.hero-backdrop__vignette{background:radial-gradient(ellipse 118% 70% at 50% 52%, transparent 30%, var(--component-hero-scrim-compact-ring-1) 64%, var(--component-hero-scrim-compact-ring-2) 100%), linear-gradient(to bottom, var(--component-hero-scrim-compact-top), transparent 20%), linear-gradient(to top, var(--component-hero-scrim-compact-bottom), transparent 22%)}}}