feat(environment): add adaptive atmospheric fog

src/hooks/debug/useEnvironmentDebug.ts

@@ -1,7 +1,9 @@
 import { CLOUD_BOUNDS } from "@/data/world/cloudConfig";
+import { FOG_BOUNDS, type FogMode } from "@/data/world/fogConfig";
 import { WIND_BOUNDS } from "@/data/world/windConfig";
 import { useDebugFolder } from "@/hooks/debug/useDebugFolder";
 import { useWorldSettingsStore } from "@/managers/stores/useWorldSettingsStore";
+import { Debug } from "@/utils/debug/Debug";
 
 export function useEnvironmentDebug(): void {
   useDebugFolder("Dynamic Wind", (folder) => {
@@ -49,13 +51,39 @@ export function useEnvironmentDebug(): void {
   });
 
   useDebugFolder("Environment", (folder) => {
-    const { clouds, graphics, setClouds, setDynamicClouds } =
+    Debug.getInstance().addFogControl(folder);
+
+    const { clouds, fog, graphics, setClouds, setDynamicClouds, setFog } =
       useWorldSettingsStore.getState();
     const controls = {
       ...clouds,
+      ...fog,
       dynamicClouds: graphics.dynamicClouds,
     };
 
+    folder
+      .add(controls, "mode", { Linear: "linear", Exp2: "exp2" })
+      .name("Fog mode")
+      .onChange((mode: FogMode) => setFog({ mode }));
+
+    folder
+      .add(controls, "near", FOG_BOUNDS.near.min, FOG_BOUNDS.near.max)
+      .step(FOG_BOUNDS.near.step)
+      .name("Fog near")
+      .onChange((near: number) => setFog({ near }));
+
+    folder
+      .add(controls, "far", FOG_BOUNDS.far.min, FOG_BOUNDS.far.max)
+      .step(FOG_BOUNDS.far.step)
+      .name("Fog far")
+      .onChange((far: number) => setFog({ far }));
+
+    folder
+      .add(controls, "density", FOG_BOUNDS.density.min, FOG_BOUNDS.density.max)
+      .step(FOG_BOUNDS.density.step)
+      .name("Fog density")
+      .onChange((density: number) => setFog({ density }));
+
     folder
       .add(controls, "dynamicClouds")
       .name("Clouds")

src/hooks/debug/useMapPerformanceDebug.ts

@@ -1,5 +1,4 @@
 import { useDebugFolder } from "@/hooks/debug/useDebugFolder";
-import { Debug } from "@/utils/debug/Debug";
 import {
   MAP_PERFORMANCE_GROUP_NAMES,
   MAP_PERFORMANCE_MODEL_NAMES,
@@ -16,8 +15,6 @@ function toLabel(value: string): string {
 
 export function useMapPerformanceDebug(): void {
   useDebugFolder("Map", (folder) => {
-    Debug.getInstance().addFogControl(folder);
-
     const {
       groups,
       models,

src/hooks/world/useFogSettings.ts

@@ -0,0 +1,10 @@
+import { useWorldSettingsStore } from "@/managers/stores/useWorldSettingsStore";
+import type { FogState } from "@/data/world/fogConfig";
+
+export function useFogSettings(): FogState {
+  return useWorldSettingsStore((state) => state.fog);
+}
+
+export function useSetFogSettings(): (fog: Partial<FogState>) => void {
+  return useWorldSettingsStore((state) => state.setFog);
+}