[data-visual-style="pearl"],
[data-item-style="pearl"],
[data-slide-style="pearl"] {
--vs-matiere: color-mix(in oklab, var(--color-highlight) 10%, white);
--vs-encre: 0;
}
@supports (color: oklch(from red 0.5 min(c, 0.1) h)) {
[data-visual-style="pearl"],
[data-item-style="pearl"],
[data-slide-style="pearl"] {
--_vs-pearl-lait: oklch(from var(--color-highlight) 0.972 min(c, 0.018) h);
--_vs-pearl-irise: oklch(from var(--color-accent) var(--vs-palier-nacre-l) min(c, var(--vs-palier-nacre-c)) h);
--_vs-pearl-frais: oklch(from var(--color-primary) var(--vs-palier-nacre-l) min(c, var(--vs-palier-nacre-c)) h);
--_vs-pearl-modele: oklch(from var(--color-secondary) var(--vs-palier-ombre-l) min(c, var(--vs-palier-ombre-c)) h);
--_vs-pearl-eclat: oklch(from var(--color-highlight) var(--vs-palier-eclat-l) min(c, var(--vs-palier-eclat-c)) h);
--vs-matiere:
radial-gradient(ellipse 96% 170% at -8% -68% in srgb,
transparent 61%,
color-mix(in oklab, var(--_vs-pearl-eclat) 95%, transparent) 65%,
color-mix(in oklab, var(--_vs-pearl-eclat) 26%, transparent) 74%,
transparent 83%),
radial-gradient(ellipse 95% 150% at 95% 138% in srgb,
var(--_vs-pearl-irise) 0%,
transparent 68%),
radial-gradient(ellipse 100% 90% at 8% 14% in srgb,
var(--_vs-pearl-frais),
transparent 75%),
radial-gradient(ellipse at 92% -5% in srgb,
var(--_vs-pearl-modele),
transparent 72%),
var(--_vs-pearl-lait);
--vs-border: color-mix(in oklab, var(--_vs-pearl-lait) 50%, transparent);
}
}