From fc9f756d5213a9237db02d9469c6df70c145c1d0 Mon Sep 17 00:00:00 2001
From: hypercross <helios.tnak@gmail.com>
Date: Sat, 15 Aug 2026 12:25:18 +0800
Subject: [PATCH] feat(web): add tone mapping and brightness to 3D scene

The EffectComposer disables three's tone mapping, leaving colors flat and washed out. Add ACES filmic tone mapping plus a small brightness lift so cards match their source images.
---
 apps/web/package.json                     | 1 +
 apps/web/src/components/viewers/Scene.tsx | 5 ++++-
 pnpm-lock.yaml                            | 3 +++
 3 files changed, 8 insertions(+), 1 deletion(-)

diff --git a/apps/web/package.json b/apps/web/package.json
index 2706a67..9d56c50 100644
--- a/apps/web/package.json
+++ b/apps/web/package.json
@@ -25,6 +25,7 @@
     "@tts/http": "workspace:*",
     "@tts/tabletop": "workspace:*",
     "bson": "^7.3.1",
+    "postprocessing": "^6.36.6",
     "react": "^19.2.8",
     "react-dom": "^19.2.8",
     "react-router-dom": "^7.18.2",
diff --git a/apps/web/src/components/viewers/Scene.tsx b/apps/web/src/components/viewers/Scene.tsx
index 118857b..b559a33 100644
--- a/apps/web/src/components/viewers/Scene.tsx
+++ b/apps/web/src/components/viewers/Scene.tsx
@@ -2,7 +2,8 @@ import { Suspense, useEffect, useRef, useState, type ReactNode } from 'react';
 import { Icon } from '@iconify/react';
 import { Canvas } from '@react-three/fiber';
 import { Bounds, ContactShadows, OrbitControls, useProgress } from '@react-three/drei';
-import { EffectComposer, Vignette } from '@react-three/postprocessing';
+import { BrightnessContrast, EffectComposer, ToneMapping, Vignette } from '@react-three/postprocessing';
+import { ToneMappingMode } from 'postprocessing';
 
 /**
  * Shared 3D scene wrapper for object viewers. Provides a consistent camera,
@@ -120,6 +121,8 @@ export default function Scene({
         />
 
         <EffectComposer>
+          <ToneMapping mode={ToneMappingMode.ACES_FILMIC} />
+          <BrightnessContrast brightness={0.06} contrast={0} />
           <Vignette eskil={false} offset={0.25} darkness={0.6} />
         </EffectComposer>
       </Canvas>
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 1efa206..f5995eb 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -102,6 +102,9 @@ importers:
       bson:
         specifier: ^7.3.1
         version: 7.3.1
+      postprocessing:
+        specifier: ^6.36.6
+        version: 6.39.4(three@0.185.1)
       react:
         specifier: ^19.2.8
         version: 19.2.8