/**
 * Soft Gradient Motion — Mode CSS (M22.5)
 *
 * Ergänzt Core-CSS um modus-spezifische Weichheit. Dieser Modus ist
 * bewusst ruhig/luxuriös: keine dominanten Linien, kein Warp, sanftes
 * additives Farbflächen-Driften.
 *
 * Der zusätzliche CSS-Filter verstärkt den volumetrischen Eindruck ohne
 * zusätzliche Draw-Calls — unabhängig vom --scene-blur-Preset-Wert.
 * Bei reduced-motion bleibt der Base-Layer alleine sichtbar; das ist
 * ebenfalls bewusst ruhig und repräsentativ für den Modus-Charakter.
 */

.scl-scene[data-scene-mode="soft_gradient_motion"] .scl-scene__canvas {
	/* Die Farbflächen werden per Canvas als weichgeblurtes radial gradient
	   gezeichnet. Ein zusätzlicher leichter CSS-Blur mischt Nachbarflächen
	   zusätzlich — erzeugt den atmosphärischen Film-Look. */
	filter: blur(min(18px, calc(var(--scene-blur, 8px) * 1.1))) saturate(1.02);
	opacity: 0.95;
}

/* Base-Layer in diesem Modus leicht stärker sichtbar (der Motion-Layer ist
   dezent; Base muss den visuellen Unterton tragen). */
.scl-scene[data-scene-mode="soft_gradient_motion"] .scl-scene__base {
	opacity: 0.9;
}

@media (max-width: 720px) {
	.scl-scene[data-scene-mode="soft_gradient_motion"] .scl-scene__canvas {
		filter: blur(min(10px, calc(var(--scene-blur, 8px) * 0.7))) saturate(1.01);
	}
}

@media (prefers-reduced-motion: reduce) {
	.scl-scene[data-scene-mode="soft_gradient_motion"] .scl-scene__canvas {
		display: none !important;
	}
}
