/* mode-leger.css : la feuille du mode léger. Elle ne s'applique que sous html.mode-leger (posée par mode-leger.js).
 * Chaque effet retiré a son secours léger juste à côté. */

/* 1. WebGL coupé : le canvas disparaît, son conteneur prend un dégradé d'encre qui rappelle la scène.
 *    La couleur se règle avec --ml-fond-1 / --ml-fond-2 / --ml-halo sur le conteneur. */
html.mode-leger canvas[data-ml-sans-gl] { display: none !important; }
html.mode-leger :has(> canvas[data-ml-sans-gl]) {
  background:
    radial-gradient(ellipse 38% 26% at 50% 46%, var(--ml-halo, rgba(248, 220, 195, .55)) 0, transparent 62%),
    radial-gradient(ellipse 70% 60% at 50% 50%, var(--ml-fond-2, #1a1f4d) 0, var(--ml-fond-1, #070816) 78%);
}

/* 2. Verre dépoli retiré, remplacé par un fond plus opaque (le texte reste lisible sans le flou). Le fond reprend la couleur de l'élément (--ml-bg posée par le script), donc le thème clair ou sombre est respecté ; --ml-verre n'est qu'un dernier recours.
 *    Seuls les éléments repérés par mode-leger.js (data-ml-verre) sont touchés : jamais un flou retiré sans secours.
 *    Les flous décoratifs (filter: blur) gardent leur aspect avec un rayon divisé par 4 (posé en ligne par le script). */
html.mode-leger [data-ml-verre] {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  background-color: var(--ml-bg, var(--ml-verre, rgba(12, 14, 34, .94))) !important;
}

/* 3. Pause de ce qui sort de l'écran : animations CSS arrêtées, rien ne se calcule hors champ */
html.mode-leger .ml-hors,
html.mode-leger .ml-hors * {
  animation-play-state: paused !important;
}
html.mode-leger .ml-hors canvas { visibility: hidden; }