Update documentation and add new screenshot showcasing scene switching

- Add new screenshot (docs/new_home.png) showing scene switching buttons
- Update README.md with new screenshot and scene control features
- Update CLAUDE.md with comprehensive scene switching documentation
- Update SaT.json with latest OBS configuration

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>

CLAUDE.md

@@ -64,7 +64,7 @@ This is a Next.js web application (branded as "Live Stream Manager") that contro
    - Glass morphism effects with proper backdrop blur
    - Distinctive active navigation states for clear wayfinding
 
-5. **Screen Position Management**: Seven distinct screen positions (large, left, right, topLeft, topRight, bottomLeft, bottomRight) with individual source control
+5. **Screen Position Management**: Seven distinct screen positions (large, left, right, top_left, top_right, bottom_left, bottom_right) with individual source control
 
 6. **Real-time Status Monitoring**: Footer component polls OBS status every 30 seconds showing connection, streaming, and recording status
 
@@ -74,6 +74,8 @@ This is a Next.js web application (branded as "Live Stream Manager") that contro
 
 9. **Stream Deletion with Confirmation**: Safe deletion workflow that removes streams from both OBS and database with user confirmation prompts
 
+10. **OBS Scene Control**: Direct scene switching controls with dynamic state tracking and real-time synchronization between UI and OBS
+
 ### Environment Configuration
 - `FILE_DIRECTORY`: Directory for database and text files (default: ./files)
 - `OBS_WEBSOCKET_HOST`: OBS WebSocket host (default: 127.0.0.1)
@@ -112,6 +114,10 @@ This is a Next.js web application (branded as "Live Stream Manager") that contro
 - `POST /api/syncGroups` - Synchronize all teams with OBS groups
 - `GET /api/verifyGroups` - Verify database groups exist in OBS with UUID tracking
 
+#### OBS Scene Control
+- `POST /api/setScene` - Switch OBS to specified scene layout (1-Screen, 2-Screen, 4-Screen)
+- `GET /api/getCurrentScene` - Get currently active OBS scene for state synchronization
+
 #### System Status
 - `GET /api/obsStatus` - Real-time OBS connection and streaming status
 
@@ -222,6 +228,16 @@ See [OBS Setup Guide](./docs/OBS_SETUP.md) for detailed configuration instructio
   - ⚠️ "Not found in OBS" - Group in database but missing from OBS
 - **System Scene Protection**: Infrastructure scenes (1-Screen, 2-Screen, 4-Screen, Starting, Ending, Audio, Movies, Resources) excluded from orphaned cleanup
 
+### OBS Scene Control
+- **Dynamic Scene Switching**: Direct control of OBS scene layouts (1-Screen, 2-Screen, 4-Screen) from the main interface
+- **Real-time State Tracking**: Buttons dynamically show active/inactive states based on current OBS scene
+- **Visual State Indicators**: 
+  - Active buttons: Green/yellow gradient with "Active: X-Screen" text
+  - Inactive buttons: Blue/cyan gradient with "Switch to X-Screen" text
+- **Optimistic UI Updates**: Immediate visual feedback when switching scenes
+- **Glass Morphism Integration**: Scene buttons styled consistently with existing design system
+- **Toast Feedback**: Success/error notifications for scene switching operations
+
 ### User Experience Improvements
 - **Toast Notifications**: Real-time feedback for all operations (success/error/info)
 - **Form Validation**: Client-side validation with immediate error feedback

README.md

@@ -3,10 +3,11 @@
 A professional [Next.js](https://nextjs.org) web application for managing live streams and controlling multiple OBS [Source Switchers](https://github.com/exeldro/obs-source-switcher) with real-time WebSocket integration and modern glass morphism UI.
 
 
-![alt text](image.png)
+![Live Stream Manager Interface](docs/new_home.png)
 
 ## Features
 
+- **OBS Scene Control**: Switch between OBS layouts (1-Screen, 2-Screen, 4-Screen) with dynamic button states
 - **Multi-Screen Source Control**: Manage 7 different screen positions (large, left, right, and 4 corners)
 - **Real-time OBS Integration**: WebSocket connection with live status monitoring
 - **Enhanced Stream Management**: Create, edit, and delete streams with comprehensive OBS cleanup
@@ -145,6 +146,10 @@ npm run type-check   # TypeScript validation
   - Identifies name mismatches
   - Shows sync status for all teams
 
+### OBS Scene Control
+- `POST /api/setScene` - Switch OBS to specified scene (1-Screen, 2-Screen, 4-Screen)
+- `GET /api/getCurrentScene` - Get currently active OBS scene
+
 ### System Status
 - `GET /api/obsStatus` - Real-time OBS connection, streaming, and recording status