:root{
/* Grain — fine, light, colour-matched specks. On the "lumière naia" page, gradients, glows and photos. Never inside glass panels, never on flat fills.
   Usage: background: var(--grain), radial-gradient(...); */
--grain:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='1.4' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.62  0 0 0 0 0.86  0 0 0 0 0.1  0 0 0 2.2 -0.88'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>"); /* @kind other */
--grain-light:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='1.2' numOctaves='1' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 1 -0.56'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>"); /* @kind other */
--grain-strong:var(--grain); /* @kind other */
/* Signature grained glow (white core → pastel → vert edge), as in the social post */
--glow-grained:var(--grain), radial-gradient(circle at 50% 50%, #FFFFFF 0%, #F3FDE4 30%, #E4FDB8 58%, #CFF77A 100%); /* @kind other */

/* Liquid glass — pills/buttons over grained glows or photos, and content panels on the "lumière naia" page. No grain inside. */
--glass-blur:blur(12px) saturate(160%); /* @kind other */
--glass-light-bg:linear-gradient(180deg,rgba(255,255,255,.55) 0%,rgba(255,255,255,.2) 100%);
--glass-light-border:rgba(255,255,255,.8);
--glass-dark-bg:linear-gradient(180deg,rgba(246,242,231,.24) 0%,rgba(246,242,231,.08) 100%);
--glass-dark-border:rgba(246,242,231,.5);
--glass-highlight:inset 0 1px 0 rgba(255,255,255,.9); /* @kind shadow */
--glass-highlight-dark:inset 0 1px 0 rgba(255,255,255,.35); /* @kind shadow */

/* Page « lumière naia » — default document background: near-white green base + three diffuse asymmetric spots. Add the grain layer on top with var(--grain-page): neutral prune specks, sparse (see PageLight). */
--page-light-base:#FAFEF0;
--page-light:radial-gradient(ellipse 70% 55% at 88% 12%, rgba(228,253,184,.5) 0%, rgba(228,253,184,0) 70%), radial-gradient(ellipse 60% 50% at 8% 78%, rgba(246,242,231,.9) 0%, rgba(246,242,231,0) 70%), radial-gradient(ellipse 55% 45% at 70% 95%, rgba(193,242,0,.05) 0%, rgba(193,242,0,0) 70%), #FAFEF0; /* @kind other */
--grain-page:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='1.3' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.22  0 0 0 0 0.18  0 0 0 0 0.2  0 0 0 1.1 -0.52'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>"); /* @kind other */
--page-grain-size:160px; /* @kind other */
--page-grain-opacity:.7; /* @kind other */

/* Glass panel — content blocks on the "lumière naia" page. Near-uniform fill, a more transparent band at the bottom (glass thickness), bright white rim + white halo, very light prune drop shadow. */
--glass-panel:linear-gradient(180deg, rgba(255,255,255,.74) 0%, rgba(255,255,255,.64) 55%, rgba(255,255,255,.58) calc(100% - 22px), rgba(255,255,255,.30) calc(100% - 7px), rgba(255,255,255,.42) 100%); /* @kind other */
--glass-panel-border:rgba(255,255,255,.95);
--glass-panel-radius:20px;
--glass-panel-shadow:inset 0 1px 0 rgba(255,255,255,1), inset 0 -1px 0 rgba(255,255,255,.85), inset 0 -6px 10px -6px rgba(255,255,255,.9), inset 1px 0 0 rgba(255,255,255,.5), inset -1px 0 0 rgba(255,255,255,.5), 0 0 0 .5px rgba(255,255,255,.8), 0 0 14px rgba(255,255,255,.65), 0 2px 6px -2px rgba(57,45,50,.08), 0 12px 28px -14px rgba(57,45,50,.16); /* @kind shadow */
--glass-panel-blur:blur(12px) saturate(160%); /* @kind other */
}
/* Print / PDF fallback: same gradient, no blur */
@media print{:root{
--glass-panel-blur:none; /* @kind other */
--glass-blur:none; /* @kind other */
}}