From c9fd1bdaaa201d3500240f1c36851e183bd0683a Mon Sep 17 00:00:00 2001
From: gramps <gramps@llamachile.shop>
Date: Sun, 30 Aug 2026 20:09:46 -0700
Subject: [PATCH] =?UTF-8?q?refactor:=20extract=20LeftPanel=20out=20of=20Ma?=
 =?UTF-8?q?inWindow.xaml=20=E2=80=94=20Phase=202,=20Commit=2017?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

LeftPanel.xaml(.cs) takes the Row 1 Col 0 panel (layers + properties editor and
the live chat list). All property-editor/chat handlers moved into the control
(SourceNameBox edit, AddSourceButton menu, chat autoscroll self-subscribed on
Loaded, mirror/clip-shape, remove-source, background capture change/refresh,
opacity slider label, list drag-to-reorder, snapshot revert/accept family).

Window keeps only shell + routing: ctor wiring (_leftPanel), geometry, hotkeys,
taskbar overlay, BackToAbout, Window_PreviewMouseLeftButtonDown (uses
_leftPanel.IsClickInside), UpdateSelectionOverlay (calls _leftPanel.OnSelectionChanged).

Zero behavior change; build 0 warnings; 246 pass, only the 2 known failures.
Docs: ViewModels/index.md Phase 2 tracker updated in same commit.
---
 Controls/LeftPanel.xaml    | 499 +++++++++++++++++++++++++++++++++++++
 Controls/LeftPanel.xaml.cs | 310 +++++++++++++++++++++++
 MainWindow.xaml            | 493 +-----------------------------------
 MainWindow.xaml.cs         | 284 +--------------------
 ViewModels/index.md        |   3 +-
 5 files changed, 816 insertions(+), 773 deletions(-)
 create mode 100644 Controls/LeftPanel.xaml
 create mode 100644 Controls/LeftPanel.xaml.cs

diff --git a/Controls/LeftPanel.xaml b/Controls/LeftPanel.xaml
new file mode 100644
index 0000000..03d252f
--- /dev/null
+++ b/Controls/LeftPanel.xaml
@@ -0,0 +1,499 @@
+<UserControl x:Class="ytLive.Controls.LeftPanel"
+             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+             xmlns:Helpers="clr-namespace:ytLive.Helpers"
+             xmlns:models="clr-namespace:ytLive.Models">
+    <Border Background="#16213e" CornerRadius="6" Padding="12">
+                <Grid>
+                    <Grid.RowDefinitions>
+                        <RowDefinition Height="*"/>
+                    </Grid.RowDefinitions>
+
+                    <!-- Edit mode (offline): layers + properties -->
+                    <Grid Grid.Row="0" Visibility="{Binding IsEditMode, Converter={StaticResource BoolToVis}}">
+                        <Grid.RowDefinitions>
+                            <RowDefinition Height="Auto"/>
+                            <RowDefinition Height="Auto"/>
+                            <RowDefinition Height="Auto"/>
+                            <RowDefinition Height="Auto"/>
+                            <RowDefinition Height="Auto"/>
+                            <RowDefinition Height="*"/>
+                        </Grid.RowDefinitions>
+
+                        <!-- LAYERS header + Add button -->
+                        <StackPanel Grid.Row="0" Orientation="Horizontal" Margin="0,8,0,0">
+                            <TextBlock Text="LAYERS" Style="{StaticResource SectionHeader}" VerticalAlignment="Center"/>
+                            <Button ToolTip="Add Layer" Style="{StaticResource IconButton}" Margin="4,-4,0,0"
+                                Click="AddSourceButton_Click">
+                            <Button.ContextMenu>
+                                <ContextMenu DataContext="{Binding PlacementTarget.DataContext, RelativeSource={RelativeSource Self}}">
+                                    <MenuItem Header="Webcam" Command="{Binding AddWebcamCommand}"
+                                              IsEnabled="{Binding CanAddWebcam}"
+                                              ToolTip="One webcam at a time — it's already in your stream"/>
+                                    <MenuItem Header="Image" Command="{Binding AddImageCommand}"/>
+                                    <MenuItem Header="Text" Command="{Binding AddSourceCommand}" CommandParameter="{x:Static models:SourceType.TextOverlay}"/>
+                                    <MenuItem Header="Countdown" Command="{Binding AddSourceCommand}" CommandParameter="{x:Static models:SourceType.Countdown}"
+                                              Visibility="{Binding IsCountdownAvailable, Converter={StaticResource BoolToVis}}"
+                                              ToolTip="Timer overlay — Starting and BRB screens only"/>
+                                    <MenuItem Header="Web Resource" Command="{Binding AddSourceCommand}" CommandParameter="{x:Static models:SourceType.WebSource}"
+                                              ToolTip="Embedded web page — set URI in Properties panel"/>
+                                    <MenuItem Header="YouTube Chat" Command="{Binding AddSourceCommand}" CommandParameter="{x:Static models:SourceType.ChatBox}"
+                                              IsEnabled="{Binding CanAddYouTubeChat}"
+                                              ToolTip="One chat layer at a time — it's already in your stream"/>
+                                </ContextMenu>
+                            </Button.ContextMenu>
+                            <Path Data="M12,4 L12,20 M4,12 L20,12" Stroke="#e94560" StrokeThickness="2"
+                                  Width="14" Height="14" Stretch="Uniform"/>
+                        </Button>
+                    </StackPanel>
+
+                    <Helpers:FocusPreservingListBox x:Name="SourceList" Grid.Row="1" Background="Transparent" BorderThickness="0"
+                             ItemsSource="{Binding StagedScene.Elements}"
+                             SelectedItem="{Binding SelectedElement, Mode=TwoWay}"
+                             PreviewMouseLeftButtonDown="List_PreviewMouseLeftButtonDown"
+                             PreviewMouseMove="List_PreviewMouseMove"
+                             PreviewMouseLeftButtonUp="List_PreviewMouseLeftButtonUp"
+                             Foreground="#e0e0e0" FontSize="13">
+                        <Helpers:FocusPreservingListBox.ItemContainerStyle>
+                            <Style TargetType="ListBoxItem" BasedOn="{StaticResource YtListBoxItem}">
+                                <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
+                                <Style.Triggers>
+                                    <DataTrigger Binding="{Binding IsVisible}" Value="False">
+                                        <Setter Property="Opacity" Value="0.45"/>
+                                    </DataTrigger>
+                                </Style.Triggers>
+                            </Style>
+                        </Helpers:FocusPreservingListBox.ItemContainerStyle>
+                        <ListBox.ItemTemplate>
+                            <DataTemplate>
+                                <Grid Margin="0,2"
+                                      Tag="{Binding DataContext.CanChangeBackground, RelativeSource={RelativeSource AncestorType=Window}}">
+                                    <Grid.ColumnDefinitions>
+                                        <ColumnDefinition Width="*"/>
+                                        <ColumnDefinition Width="Auto"/>
+                                        <ColumnDefinition Width="Auto"/>
+                                        <ColumnDefinition Width="Auto"/>
+                                    </Grid.ColumnDefinitions>
+
+                                    <Grid.ContextMenu>
+                                        <ContextMenu DataContext="{Binding PlacementTarget.DataContext, RelativeSource={RelativeSource Self}}">
+                                            <MenuItem Header="Change Capture…" Click="BackgroundMenu_ChangeCapture">
+                                                <MenuItem.Visibility>
+                                                    <MultiBinding Converter="{StaticResource AllTrueToVis}">
+                                                        <Binding Path="IsBackground"/>
+                                                        <Binding Path="PlacementTarget.Tag" RelativeSource="{RelativeSource AncestorType={x:Type ContextMenu}}"/>
+                                                    </MultiBinding>
+                                                </MenuItem.Visibility>
+                                            </MenuItem>
+                                            <MenuItem Header="Refresh Capture" Click="BackgroundMenu_RefreshCapture">
+                                                <MenuItem.Visibility>
+                                                    <MultiBinding Converter="{StaticResource AllTrueToVis}">
+                                                        <Binding Path="IsBackground"/>
+                                                        <Binding Path="PlacementTarget.Tag" RelativeSource="{RelativeSource AncestorType={x:Type ContextMenu}}"/>
+                                                    </MultiBinding>
+                                                </MenuItem.Visibility>
+                                            </MenuItem>
+                                            <Separator>
+                                                <Separator.Visibility>
+                                                    <MultiBinding Converter="{StaticResource AllTrueToVis}">
+                                                        <Binding Path="IsBackground"/>
+                                                        <Binding Path="PlacementTarget.Tag" RelativeSource="{RelativeSource AncestorType={x:Type ContextMenu}}"/>
+                                                    </MultiBinding>
+                                                </Separator.Visibility>
+                                            </Separator>
+                                            <MenuItem Header="Remove Layer" Click="SourceMenu_Remove"
+                                                      Visibility="{Binding IsBackground, Converter={StaticResource InverseBoolToVis}}"/>
+                                        </ContextMenu>
+                                    </Grid.ContextMenu>
+
+                                    <TextBlock Grid.Column="0" Text="{Binding Name}" VerticalAlignment="Center"
+                                               Padding="4,2" TextTrimming="CharacterEllipsis">
+                                        <TextBlock.Style>
+                                            <Style TargetType="TextBlock">
+                                                <Setter Property="Visibility" Value="Visible"/>
+                                                <Style.Triggers>
+                                                    <DataTrigger Binding="{Binding IsEditing}" Value="True">
+                                                        <Setter Property="Visibility" Value="Collapsed"/>
+                                                    </DataTrigger>
+                                                </Style.Triggers>
+                                            </Style>
+                                        </TextBlock.Style>
+                                    </TextBlock>
+
+                                    <TextBox Grid.Column="0" Text="{Binding Name, UpdateSourceTrigger=PropertyChanged}"
+                                             Background="#0f3460" Foreground="#e0e0e0" BorderThickness="0"
+                                             Padding="4,2" VerticalContentAlignment="Center"
+                                             IsVisibleChanged="SourceNameBox_IsVisibleChanged"
+                                             KeyDown="SourceNameBox_KeyDown" LostFocus="SourceNameBox_LostFocus">
+                                        <TextBox.Style>
+                                            <Style TargetType="TextBox">
+                                                <Setter Property="Visibility" Value="Collapsed"/>
+                                                <Style.Triggers>
+                                                    <DataTrigger Binding="{Binding IsEditing}" Value="True">
+                                                        <Setter Property="Visibility" Value="Visible"/>
+                                                    </DataTrigger>
+                                                </Style.Triggers>
+                                            </Style>
+                                        </TextBox.Style>
+                                    </TextBox>
+
+                                    <Button Grid.Column="1" ToolTip="Edit Layer Name"
+                                            Command="{Binding DataContext.EditElementCommand, RelativeSource={RelativeSource AncestorType=ListBox}}"
+                                            CommandParameter="{Binding}" Style="{StaticResource IconButton}">
+                                        <Path Data="M3,17.25V21h3.75L17.81,9.94l-3.75,-3.75L3,17.25zM20.71,7.04c0.39,-0.39 0.39,-1.02 0,-1.41l-2.34,-2.34c-0.39,-0.39 -1.02,-0.39 -1.41,0l-1.83,1.83 3.75,3.75 1.83,-1.83z"
+                                              Fill="#d0d0d0" Width="13" Height="13" Stretch="Uniform"/>
+                                    </Button>
+
+                                    <Button Grid.Column="2" Style="{StaticResource EyeButton}"
+                                            Command="{Binding DataContext.ToggleElementVisibilityCommand, RelativeSource={RelativeSource AncestorType=ListBox}}"
+                                            CommandParameter="{Binding}">
+                                        <Path Style="{StaticResource EyeIconStyle}" Fill="#d0d0d0"
+                                              Width="13" Height="13" Stretch="Uniform"/>
+                                    </Button>
+
+                                    <Button Grid.Column="3" ToolTip="Remove Layer"
+                                            Command="{Binding DataContext.RemoveSourceCommand, RelativeSource={RelativeSource AncestorType=ListBox}}"
+                                            CommandParameter="{Binding}" Style="{StaticResource IconButton}"
+                                            Visibility="{Binding IsBackground, Converter={StaticResource HiddenBoolToVis}}">
+                                        <Path Data="M6,19c0,1.1 0.9,2 2,2h8c1.1,0 2,-0.9 2,-2V7H6v12zM19,4h-3.5l-1,-1h-5l-1,1H5v2h14V4z"
+                                              Fill="#d0d0d0" Width="13" Height="13" Stretch="Uniform"/>
+                                    </Button>
+                                </Grid>
+                            </DataTemplate>
+                        </ListBox.ItemTemplate>
+                    </Helpers:FocusPreservingListBox>
+
+                            <TextBlock Grid.Row="2" Text="No layers yet" Foreground="#555" FontSize="12"
+                               HorizontalAlignment="Center" VerticalAlignment="Center"
+                               Visibility="{Binding ShowSourcesEmptyHint, Converter={StaticResource BoolToVis}}"/>
+
+                    <!-- ELEMENTS panel: per-element config beneath Sources.
+                         Collapses entirely when no element is selected. -->
+                    <Rectangle Grid.Row="3" Height="1" Fill="#2c3a5c" Margin="0,10,0,2"
+                               Visibility="{Binding SelectedElement, Converter={StaticResource NotNullToVis}}"/>
+                    <StackPanel Grid.Row="4" Orientation="Horizontal" Margin="0,8,0,0"
+                                Visibility="{Binding SelectedElement, Converter={StaticResource NotNullToVis}}">
+                        <TextBlock Text="PROPERTIES" Style="{StaticResource SectionHeader}" VerticalAlignment="Center"/>
+                    </StackPanel>
+                    <ScrollViewer x:Name="ElementsScrollViewer" Grid.Row="5" VerticalScrollBarVisibility="Auto" Background="Transparent"
+                                  Visibility="{Binding SelectedElement, Converter={StaticResource NotNullToVis}}">
+                        <StackPanel x:Name="ElementsPanel" Margin="0,4,0,0">
+                            <!-- Opacity + mirror/shape (draggable elements: image, webcam) -->
+                            <StackPanel Visibility="{Binding SelectedElement.IsDraggable, Converter={StaticResource BoolToVis}}" Margin="0,0,0,8">
+                                <StackPanel Visibility="{Binding SelectedElement.IsChatBox, Converter={StaticResource InverseBoolToVis}}">
+                                    <TextBlock Text="Opacity" Foreground="#a0a0b0" FontSize="11" Margin="0,0,0,2"/>
+                                    <DockPanel Margin="0,0,0,6">
+                                        <TextBlock x:Name="OpacityValueText" Text="100%" Foreground="#a0a0b0" FontSize="11"
+                                                   DockPanel.Dock="Right" VerticalAlignment="Center" Margin="8,0,0,0" Width="32"/>
+                                        <Slider x:Name="OpacitySlider" Width="120" Minimum="0" Maximum="1"
+                                                Value="{Binding SelectedElement.Opacity, Mode=TwoWay}"
+                                                ValueChanged="OpacitySlider_ValueChanged" VerticalAlignment="Center"/>
+                                    </DockPanel>
+                                </StackPanel>
+                                <StackPanel Orientation="Horizontal" Margin="0,0,0,4"
+                                            Visibility="{Binding IsWebcamSelected, Converter={StaticResource BoolToVis}}">
+                                    <Button Content="{Binding SelectedElement.MirrorButtonText}"
+                                            Style="{StaticResource YtButtonSecondary}" Padding="10,4"
+                                            Click="MirrorButton_Click"/>
+                                    <Button Content="{Binding SelectedElement.ShapeButtonText}"
+                                            Style="{StaticResource YtButtonSecondary}" Padding="10,4"
+                                            Margin="8,0,0,0" Click="ShapeButton_Click"/>
+                                </StackPanel>
+                                <TextBlock Text="Drag to move · drag the corner dot to resize"
+                                           Foreground="#a0a0b0" FontSize="10" Margin="0,2,0,0"/>
+                            </StackPanel>
+
+                            <!-- Webcam border config -->
+                            <StackPanel Visibility="{Binding SelectedElement.IsWebcam, Converter={StaticResource BoolToVis}}" Margin="0,0,0,8">
+                                <TextBlock Text="Border Color" Foreground="#a0a0b0" FontSize="11" Margin="0,0,0,2"/>
+                                <DockPanel Margin="0,0,0,6">
+                                    <Button DockPanel.Dock="Right" Content="..." Width="24" Height="24"
+                                            Click="WebcamBorderColorPicker_Click" Margin="4,0,0,0"
+                                            ToolTip="Pick color"/>
+                                    <TextBox Text="{Binding SelectedElement.BorderColor, UpdateSourceTrigger=PropertyChanged}"
+                                             Background="#0f3460" Foreground="#e0d0e0" BorderThickness="1"
+                                             BorderBrush="#2c3a5c" Padding="4,2" FontSize="12"
+                                             MaxLength="7" ToolTip="#RRGGBB"/>
+                                </DockPanel>
+                                <TextBlock Text="Border Thickness" Foreground="#a0a0b0" FontSize="11" Margin="0,0,0,2"/>
+                                <DockPanel Margin="0,0,0,6">
+                                    <Button DockPanel.Dock="Right" Style="{StaticResource IconButton}"
+                                            Width="22" Height="22" Margin="4,0,0,0"
+                                            Click="WebcamBorderAccept_Click">
+                                        <Path Data="M4,9 L8,14 L16,4" Stroke="#22c55e" StrokeThickness="2"
+                                              Width="14" Height="14" Stretch="Uniform"/>
+                                    </Button>
+                                    <Button DockPanel.Dock="Right" Style="{StaticResource IconButton}"
+                                            Width="22" Height="22" ToolTip="Revert"
+                                            Click="WebcamBorderRevert_Click" Margin="4,0,0,0">
+                                        <Path Data="M5,5 L15,15 M15,5 L5,15" Stroke="#e94560" StrokeThickness="2"
+                                              Width="14" Height="14" Stretch="Uniform"/>
+                                    </Button>
+                                    <Slider DockPanel.Dock="Left" Width="120" Minimum="0" Maximum="10"
+                                            Value="{Binding SelectedElement.BorderWidth, Mode=TwoWay}"
+                                            VerticalAlignment="Center" TickFrequency="1" IsSnapToTickEnabled="True"/>
+                                    <TextBlock Text="{Binding SelectedElement.BorderWidth}" Foreground="#a0a0b0" FontSize="11"
+                                               VerticalAlignment="Center" Margin="8,0,0,0" Width="20"/>
+                                </DockPanel>
+                            </StackPanel>
+
+                            <!-- Countdown config -->
+                            <StackPanel Visibility="{Binding SelectedElement.IsCountdown, Converter={StaticResource BoolToVis}}" Margin="0,0,0,8">
+                                <TextBlock Text="Timer (minutes)" Foreground="#a0a0b0" FontSize="11" Margin="0,0,0,2"/>
+                                <DockPanel Margin="0,0,0,6">
+                                    <Button DockPanel.Dock="Right" Style="{StaticResource IconButton}"
+                                            Width="22" Height="22" Margin="4,0,0,0"
+                                            Click="CountdownAccept_Click">
+                                        <Path Data="M4,9 L8,14 L16,4" Stroke="#22c55e" StrokeThickness="2"
+                                              Width="14" Height="14" Stretch="Uniform"/>
+                                    </Button>
+                                    <Button DockPanel.Dock="Right" Style="{StaticResource IconButton}"
+                                            Width="22" Height="22" ToolTip="Revert"
+                                            Click="CountdownRevert_Click" Margin="4,0,0,0">
+                                        <Path Data="M5,5 L15,15 M15,5 L5,15" Stroke="#e94560" StrokeThickness="2"
+                                              Width="14" Height="14" Stretch="Uniform"/>
+                                    </Button>
+                                    <Slider DockPanel.Dock="Left" Width="120" Minimum="1" Maximum="60"
+                                            Value="{Binding SelectedElement.TimerMinutes, Mode=TwoWay}"
+                                            VerticalAlignment="Center" TickFrequency="1" IsSnapToTickEnabled="True"/>
+                                    <TextBlock Text="{Binding SelectedElement.TimerMinutes}" Foreground="#a0a0b0" FontSize="11"
+                                               VerticalAlignment="Center" Margin="8,0,0,0" Width="20"/>
+                                </DockPanel>
+                            </StackPanel>
+
+                            <!-- Web source config -->
+                            <StackPanel Visibility="{Binding SelectedElement.IsWebSource, Converter={StaticResource BoolToVis}}" Margin="0,0,0,8">
+                                <TextBlock Text="Geometry" Foreground="#a0a0b0" FontSize="11" FontWeight="SemiBold" Margin="0,0,0,4"/>
+                                <DockPanel Margin="0,0,0,4">
+                                    <TextBlock DockPanel.Dock="Left" Text="X" Foreground="#a0a0b0" FontSize="11" VerticalAlignment="Center" Width="16"/>
+                                    <TextBox Text="{Binding SelectedElement.X, UpdateSourceTrigger=PropertyChanged, StringFormat=F0}"
+                                             Background="#0f3460" Foreground="#e0d0e0" BorderThickness="1"
+                                             BorderBrush="#2c3a5c" Padding="4,2" FontSize="12"/>
+                                    <TextBlock DockPanel.Dock="Left" Text="  Y" Foreground="#a0a0b0" FontSize="11" VerticalAlignment="Center" Width="20" Margin="8,0,0,0"/>
+                                    <TextBox Text="{Binding SelectedElement.Y, UpdateSourceTrigger=PropertyChanged, StringFormat=F0}"
+                                             Background="#0f3460" Foreground="#e0d0e0" BorderThickness="1"
+                                             BorderBrush="#2c3a5c" Padding="4,2" FontSize="12"/>
+                                </DockPanel>
+                                <DockPanel Margin="0,0,0,4">
+                                    <TextBlock DockPanel.Dock="Left" Text="W" Foreground="#a0a0b0" FontSize="11" VerticalAlignment="Center" Width="16"/>
+                                    <TextBox Text="{Binding SelectedElement.Width, UpdateSourceTrigger=PropertyChanged, StringFormat=F0}"
+                                             Background="#0f3460" Foreground="#e0d0e0" BorderThickness="1"
+                                             BorderBrush="#2c3a5c" Padding="4,2" FontSize="12"/>
+                                    <TextBlock DockPanel.Dock="Left" Text="  H" Foreground="#a0a0b0" FontSize="11" VerticalAlignment="Center" Width="20" Margin="8,0,0,0"/>
+                                    <TextBox Text="{Binding SelectedElement.Height, UpdateSourceTrigger=PropertyChanged, StringFormat=F0}"
+                                             Background="#0f3460" Foreground="#e0d0e0" BorderThickness="1"
+                                             BorderBrush="#2c3a5c" Padding="4,2" FontSize="12"/>
+                                </DockPanel>
+                                <TextBlock Text="URI" Foreground="#a0a0b0" FontSize="11" Margin="0,0,0,2"/>
+                                <DockPanel>
+                                    <Button DockPanel.Dock="Right" Style="{StaticResource IconButton}"
+                                            Width="22" Height="22" Margin="4,0,0,0" IsTabStop="False"
+                                            Click="WebAccept_Click">
+                                        <Path Data="M4,9 L8,14 L16,4" Stroke="#22c55e" StrokeThickness="2"
+                                              Width="14" Height="14" Stretch="Uniform"/>
+                                    </Button>
+                                    <Button DockPanel.Dock="Right" Style="{StaticResource IconButton}"
+                                            Width="22" Height="22" ToolTip="Revert" IsTabStop="False"
+                                            Click="WebRevert_Click" Margin="4,0,0,0">
+                                        <Path Data="M5,5 L15,15 M15,5 L5,15" Stroke="#e94560" StrokeThickness="2"
+                                              Width="14" Height="14" Stretch="Uniform"/>
+                                    </Button>
+                                    <TextBox Text="{Binding SelectedElement.WebUri, UpdateSourceTrigger=PropertyChanged}"
+                                             Background="#0f3460" Foreground="#e0d0e0" BorderThickness="1"
+                                             BorderBrush="#2c3a5c" Padding="4,2" FontSize="12"
+                                             ToolTip="https://example.com"/>
+                                </DockPanel>
+                            </StackPanel>
+
+                            <!-- Chat box config -->
+                            <StackPanel Visibility="{Binding SelectedElement.IsChatBox, Converter={StaticResource BoolToVis}}" Margin="0,0,0,8">
+                                <TextBlock Text="Chat Overlay" Foreground="#a0a0b0" FontSize="11" FontWeight="SemiBold" Margin="0,0,0,6"/>
+
+                                <!-- Font Size -->
+                                <DockPanel Margin="0,0,0,4">
+                                    <TextBlock DockPanel.Dock="Left" Text="Font Size" Foreground="#a0a0b0" FontSize="11" VerticalAlignment="Center" Width="70"/>
+                                    <Slider x:Name="ChatFontSizeSlider" Width="120" Minimum="8" Maximum="72" TickFrequency="2" IsSnapToTickEnabled="True"
+                                            Value="{Binding SelectedElement.ChatFontSize, Mode=TwoWay}"
+                                            VerticalAlignment="Center"/>
+                                    <TextBlock DockPanel.Dock="Right" Text="{Binding SelectedElement.ChatFontSize, StringFormat={}{0:0}}" Foreground="#e0e0e0" FontSize="11" Margin="6,0,0,0" VerticalAlignment="Center" Width="24"/>
+                                </DockPanel>
+
+                                <!-- Font Family -->
+                                <DockPanel Margin="0,0,0,4">
+                                    <TextBlock DockPanel.Dock="Left" Text="Font" Foreground="#a0a0b0" FontSize="11" VerticalAlignment="Center" Width="70"/>
+                                    <ComboBox SelectedValue="{Binding SelectedElement.ChatFontFamily, Mode=TwoWay}"
+                                              SelectedValuePath="Content"
+                                              Background="#0f3460" Foreground="#e0e0e0" FontSize="11"
+                                              Width="140" VerticalAlignment="Center">
+                                        <ComboBoxItem Content="Segoe UI"/>
+                                        <ComboBoxItem Content="Arial"/>
+                                        <ComboBoxItem Content="Consolas"/>
+                                        <ComboBoxItem Content="Courier New"/>
+                                        <ComboBoxItem Content="Comic Sans MS"/>
+                                        <ComboBoxItem Content="Mouse Memoirs"/>
+                                    </ComboBox>
+                                </DockPanel>
+
+                                <!-- Font Color -->
+                                <DockPanel Margin="0,0,0,4">
+                                    <TextBlock DockPanel.Dock="Left" Text="Font Color" Foreground="#a0a0b0" FontSize="11" VerticalAlignment="Center" Width="70"/>
+                                    <TextBox Text="{Binding SelectedElement.ChatFontColor, UpdateSourceTrigger=PropertyChanged}"
+                                             Background="#0f3460" Foreground="#e0e0e0" BorderThickness="1"
+                                             BorderBrush="#2c3a5c" Padding="4,2" FontSize="11" Width="80"/>
+                                </DockPanel>
+
+                                <!-- Member Color -->
+                                <DockPanel Margin="0,0,0,4">
+                                    <TextBlock DockPanel.Dock="Left" Text="Member" Foreground="#a0a0b0" FontSize="11" VerticalAlignment="Center" Width="70"/>
+                                    <TextBox Text="{Binding SelectedElement.ChatMemberColor, UpdateSourceTrigger=PropertyChanged}"
+                                             Background="#0f3460" Foreground="#e0e0e0" BorderThickness="1"
+                                             BorderBrush="#2c3a5c" Padding="4,2" FontSize="11" Width="80"/>
+                                </DockPanel>
+
+                                <!-- Super Chat Color -->
+                                <DockPanel Margin="0,0,0,4">
+                                    <TextBlock DockPanel.Dock="Left" Text="Super Chat" Foreground="#a0a0b0" FontSize="11" VerticalAlignment="Center" Width="70"/>
+                                    <TextBox Text="{Binding SelectedElement.ChatSuperChatColor, UpdateSourceTrigger=PropertyChanged}"
+                                             Background="#0f3460" Foreground="#e0e0e0" BorderThickness="1"
+                                             BorderBrush="#2c3a5c" Padding="4,2" FontSize="11" Width="80"/>
+                                </DockPanel>
+
+                                <!-- Max Messages -->
+                                <DockPanel Margin="0,0,0,4">
+                                    <TextBlock DockPanel.Dock="Left" Text="Max Msgs" Foreground="#a0a0b0" FontSize="11" VerticalAlignment="Center" Width="70"/>
+                                    <Slider x:Name="ChatMaxMsgsSlider" Width="120" Minimum="1" Maximum="20" TickFrequency="1" IsSnapToTickEnabled="True"
+                                            Value="{Binding SelectedElement.ChatMaxMessages, Mode=TwoWay}"
+                                            VerticalAlignment="Center"/>
+                                    <TextBlock DockPanel.Dock="Right" Text="{Binding SelectedElement.ChatMaxMessages}" Foreground="#e0e0e0" FontSize="11" Margin="6,0,0,0" VerticalAlignment="Center" Width="24"/>
+                                </DockPanel>
+
+                                <!-- Background Color -->
+                                <DockPanel Margin="0,0,0,4">
+                                    <TextBlock DockPanel.Dock="Left" Text="Background" Foreground="#a0a0b0" FontSize="11" VerticalAlignment="Center" Width="70"/>
+                                    <TextBox Text="{Binding SelectedElement.ChatBackgroundColor, UpdateSourceTrigger=PropertyChanged}"
+                                             Background="#0f3460" Foreground="#e0e0e0" BorderThickness="1"
+                                             BorderBrush="#2c3a5c" Padding="4,2" FontSize="11" Width="80"/>
+                                </DockPanel>
+
+                                <!-- Background Opacity -->
+                                <DockPanel Margin="0,0,0,4">
+                                    <TextBlock DockPanel.Dock="Left" Text="Bg Opacity" Foreground="#a0a0b0" FontSize="11" VerticalAlignment="Center" Width="70"/>
+                                    <Slider x:Name="ChatBgOpacitySlider" Width="120" Minimum="0" Maximum="1"
+                                            Value="{Binding SelectedElement.ChatBackgroundOpacity, Mode=TwoWay}"
+                                            VerticalAlignment="Center"/>
+                                    <TextBlock DockPanel.Dock="Right" Text="{Binding SelectedElement.ChatBackgroundOpacity, StringFormat={}{0:0%}}" Foreground="#e0e0e0" FontSize="11" Margin="6,0,0,0" VerticalAlignment="Center" Width="32"/>
+                                </DockPanel>
+
+                                <!-- Fade After (seconds) -->
+                                <DockPanel Margin="0,0,0,4">
+                                    <TextBlock DockPanel.Dock="Left" Text="Fade After" Foreground="#a0a0b0" FontSize="11" VerticalAlignment="Center" Width="70"/>
+                                    <Slider x:Name="ChatFadeSlider" Width="120" Minimum="0" Maximum="60" TickFrequency="5" IsSnapToTickEnabled="True"
+                                            Value="{Binding SelectedElement.ChatFadeSeconds, Mode=TwoWay}"
+                                            VerticalAlignment="Center"/>
+                                    <TextBlock DockPanel.Dock="Right" Text="{Binding SelectedElement.ChatFadeSeconds, StringFormat='{}{0}s'}" Foreground="#e0e0e0" FontSize="11" Margin="6,0,0,0" VerticalAlignment="Center" Width="28"/>
+                                </DockPanel>
+
+                                <!-- Toggles -->
+                                <CheckBox Content="Show timestamps" Foreground="#a0a0b0" FontSize="11" Margin="0,4,0,2"
+                                          IsChecked="{Binding SelectedElement.ChatShowTimestamps, Mode=TwoWay}"/>
+                                <CheckBox Content="Show badges" Foreground="#a0a0b0" FontSize="11" Margin="0,0,0,2"
+                                          IsChecked="{Binding SelectedElement.ChatShowBadges, Mode=TwoWay}"/>
+                            </StackPanel>
+
+                            <!-- Background properties -->
+                            <StackPanel Margin="0,8,0,0"
+                                        Visibility="{Binding SelectedElement.IsBackground, Converter={StaticResource BoolToVis}}">
+                                <TextBlock Text="Background" Style="{StaticResource SubHeader}"/>
+                                <StackPanel Margin="4,0,0,0">
+                                    <StackPanel Orientation="Horizontal" Margin="0,0,0,8">
+                                        <TextBlock Text="Use default background:" Foreground="#a0a0b0" FontSize="11" VerticalAlignment="Center"/>
+                                        <ToggleButton Style="{StaticResource PillToggle}"
+                                                      IsChecked="{Binding SelectedElement.UseDefaultBackground, Mode=TwoWay}"
+                                                      Margin="8,0,0,0"/>
+                                    </StackPanel>
+                                    <Grid Margin="0,0,0,4"
+                                          Visibility="{Binding SelectedElement.UseDefaultBackground, Converter={StaticResource InverseBoolToVis}}">
+                                        <Grid.ColumnDefinitions>
+                                            <ColumnDefinition Width="*"/>
+                                            <ColumnDefinition Width="Auto"/>
+                                        </Grid.ColumnDefinitions>
+                                        <TextBox Grid.Column="0" Text="{Binding SelectedElement.CustomBackgroundPath, Mode=OneWay}"
+                                                  IsReadOnly="True" Background="#0f3460" Foreground="#a0a0b0"
+                                                  FontSize="11" VerticalAlignment="Center"/>
+                                        <Button Grid.Column="1" Content="Browse…" Command="{Binding BrowseBackgroundCommand}"
+                                                Style="{StaticResource YtButtonSecondary}" Margin="4,0,0,0" Padding="8,2"/>
+                                    </Grid>
+                                    <TextBlock Text="{Binding BackgroundSizeMismatchText}"
+                                               Foreground="#ef4444" FontSize="11" TextWrapping="Wrap"
+                                               Margin="0,4,0,0"
+                                               Visibility="{Binding BackgroundSizeMismatch, Converter={StaticResource BoolToVis}}"/>
+                                </StackPanel>
+                            </StackPanel>
+                        </StackPanel>
+                    </ScrollViewer>
+                </Grid>
+
+                <!-- Live mode: YouTube Live Chat (entire left panel replaced) -->
+                <Grid Grid.Row="0" Visibility="{Binding IsEditMode, Converter={StaticResource InverseBoolToVis}}">
+                    <Grid.RowDefinitions>
+                        <RowDefinition Height="Auto"/>
+                        <RowDefinition Height="*"/>
+                    </Grid.RowDefinitions>
+
+                    <TextBlock Grid.Row="0" Text="LIVE CHAT" Style="{StaticResource SectionHeader}"/>
+
+                    <!-- Inactive overlay (shown when NOT live) -->
+                    <StackPanel Grid.Row="1" VerticalAlignment="Center" HorizontalAlignment="Center"
+                                Visibility="{Binding ShowChatInactiveMessage, Converter={StaticResource BoolToVis}}">
+                        <TextBlock Text="Chat is inactive" Foreground="#a0a0b0" FontSize="13"
+                                   HorizontalAlignment="Center" Margin="0,0,0,4"/>
+                        <TextBlock Text="Chat becomes active once LlamaCasty is connected and streaming on YouTube."
+                                   Foreground="#666" FontSize="11" TextWrapping="Wrap"
+                                   HorizontalAlignment="Center" TextAlignment="Center" MaxWidth="240"/>
+                    </StackPanel>
+
+                    <!-- Message feed (shown when live) -->
+                    <ListBox Grid.Row="1" Background="Transparent" BorderThickness="0"
+                             ItemsSource="{Binding ChatMessages}"
+                             ItemContainerStyle="{StaticResource YtListBoxItem}"
+                             Visibility="{Binding ShowChatInactiveMessage, Converter={StaticResource InverseBoolToVis}}"
+                             x:Name="ChatListBox">
+                        <ListBox.ItemTemplate><DataTemplate>
+                            <Border x:Name="MessageBorder" Padding="6,4" CornerRadius="4">
+                                <Border.Style>
+                                    <Style TargetType="Border">
+                                        <Setter Property="Background" Value="Transparent"/>
+                                        <Style.Triggers>
+                                            <DataTrigger Binding="{Binding IsSuperChat}" Value="True">
+                                                <Setter Property="Background" Value="#2a1a0a"/>
+                                                <Setter Property="BorderBrush" Value="#eab308"/>
+                                                <Setter Property="BorderThickness" Value="1,0,1,0"/>
+                                            </DataTrigger>
+                                        </Style.Triggers>
+                                    </Style>
+                                </Border.Style>
+                                <StackPanel>
+                                    <StackPanel Orientation="Horizontal" Margin="0,0,0,2">
+                                        <TextBlock Text="&#x2B50;" FontSize="10" Margin="0,0,4,0"
+                                                   VerticalAlignment="Center"
+                                                   Visibility="{Binding IsMember, Converter={StaticResource BoolToVis}}"/>
+                                        <TextBlock Text="{Binding AuthorName}" Foreground="#e94560"
+                                                   FontWeight="Bold" FontSize="12" VerticalAlignment="Center"/>
+                                        <TextBlock Text="{Binding SuperChatAmount, StringFormat=${0:F2}}"
+                                                   Foreground="#eab308" FontWeight="Bold" FontSize="12"
+                                                   Margin="8,0,0,0" VerticalAlignment="Center"
+                                                   Visibility="{Binding IsSuperChat, Converter={StaticResource BoolToVis}}"/>
+                                        <TextBlock Text="{Binding SuperChatCurrency}" Foreground="#eab308"
+                                                   FontSize="11" Margin="2,0,0,0" VerticalAlignment="Center"
+                                                   Visibility="{Binding IsSuperChat, Converter={StaticResource BoolToVis}}"/>
+                                    </StackPanel>
+                                    <TextBlock Text="{Binding Message}" Foreground="#e0e0e0"
+                                               TextWrapping="Wrap" Margin="0,2,0,0"/>
+                                </StackPanel>
+                            </Border>
+                        </DataTemplate></ListBox.ItemTemplate>
+                    </ListBox>
+                </Grid>
+            </Grid>
+    </Border>
+</UserControl>
diff --git a/Controls/LeftPanel.xaml.cs b/Controls/LeftPanel.xaml.cs
new file mode 100644
index 0000000..f67187d
--- /dev/null
+++ b/Controls/LeftPanel.xaml.cs
@@ -0,0 +1,310 @@
+using System.Collections;
+using System.Windows;
+using System.Windows.Controls;
+using System.Windows.Input;
+using System.Windows.Media;
+using ytLive.Models;
+using ytLive.ViewModels;
+
+namespace ytLive.Controls;
+
+public partial class LeftPanel : UserControl
+{
+    private Models.SceneElement? _snapshotElement;
+    private string _snapshotBorderColor = string.Empty;
+    private int _snapshotBorderWidth;
+    private int _snapshotTimerMinutes = 15;
+    private string? _snapshotWebUri;
+
+    private Point _dragStartPoint;
+    private int _dragIndex = -1;
+    private bool _isDragging;
+    private object? _lastHoveredItem;
+
+    public LeftPanel()
+    {
+        InitializeComponent();
+        Loaded += (_, _) =>
+        {
+            if (DataContext is MainViewModel vm)
+                vm.ChatMessages.CollectionChanged += OnChatMessagesChanged;
+        };
+        Unloaded += (_, _) =>
+        {
+            if (DataContext is MainViewModel vm)
+                vm.ChatMessages.CollectionChanged -= OnChatMessagesChanged;
+        };
+    }
+
+    // Called by the window's UpdateSelectionOverlay (edit mode only).
+    public void OnSelectionChanged(MainViewModel vm)
+    {
+        if (vm.SelectedElement is { } s && PreviewPane.IsDraggableElement(s))
+            OpacityValueText.Text = $"{Math.Round(s.Opacity * 100)}%";
+        TakeSnapshot(vm);
+    }
+
+    // Deselection guard: true when the click is inside the source list or the
+    // element property scroller (window's Window_PreviewMouseLeftButtonDown).
+    public bool IsClickInside(DependencyObject original)
+        => IsDescendantOf(original, SourceList) || IsDescendantOf(original, ElementsScrollViewer);
+
+    private static bool IsDescendantOf(DependencyObject? child, DependencyObject ancestor)
+    {
+        while (child != null && !ReferenceEquals(child, ancestor))
+        {
+            child = child is Visual or System.Windows.Media.Media3D.Visual3D
+                ? VisualTreeHelper.GetParent(child)
+                : LogicalTreeHelper.GetParent(child);
+        }
+        return child != null;
+    }
+
+    private void SourceNameBox_IsVisibleChanged(object sender, DependencyPropertyChangedEventArgs e)
+    {
+        if (sender is TextBox { IsVisible: true } box)
+        {
+            box.Focus();
+            box.SelectAll();
+        }
+    }
+
+    private void AddSourceButton_Click(object sender, RoutedEventArgs e)
+    {
+        if (sender is Button { ContextMenu: { } menu } button)
+        {
+            menu.PlacementTarget = button;
+            menu.Placement = System.Windows.Controls.Primitives.PlacementMode.Bottom;
+            menu.IsOpen = true;
+        }
+    }
+
+    private void OnChatMessagesChanged(object? sender, System.Collections.Specialized.NotifyCollectionChangedEventArgs e)
+    {
+        if (e.Action == System.Collections.Specialized.NotifyCollectionChangedAction.Add)
+        {
+            ChatListBox.ScrollIntoView(ChatListBox.Items[^1]);
+        }
+    }
+
+    private void MirrorButton_Click(object sender, RoutedEventArgs e)
+    {
+        if ((DataContext as MainViewModel)?.SelectedElement is WebcamSceneConfig webcam)
+            webcam.IsMirrored = !webcam.IsMirrored;
+    }
+
+    private void ShapeButton_Click(object sender, RoutedEventArgs e)
+    {
+        if ((DataContext as MainViewModel)?.SelectedElement is WebcamSceneConfig webcam)
+            webcam.ToggleClipShape();
+    }
+
+    private void SourceMenu_Remove(object sender, RoutedEventArgs e)
+    {
+        if (sender is MenuItem { DataContext: SceneElement element } && DataContext is MainViewModel vm)
+            vm.RemoveSourceCommand.Execute(element);
+    }
+
+    private void BackgroundMenu_ChangeCapture(object sender, RoutedEventArgs e)
+    {
+        _ = (DataContext as MainViewModel)?.ChangeBackgroundCaptureAsync();
+    }
+
+    private void BackgroundMenu_RefreshCapture(object sender, RoutedEventArgs e)
+    {
+        (DataContext as MainViewModel)?.RefreshBackgroundAutoCapture();
+    }
+
+    private void OpacitySlider_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
+        => OpacityValueText.Text = $"{Math.Round(e.NewValue * 100)}%";
+
+    private void SourceNameBox_KeyDown(object sender, KeyEventArgs e)
+    {
+        if (e.Key is Key.Enter or Key.Escape)
+        {
+            CommitSourceEdit(sender);
+            e.Handled = true;
+        }
+    }
+
+    private void SourceNameBox_LostFocus(object sender, RoutedEventArgs e)
+    {
+        CommitSourceEdit(sender);
+    }
+
+    private static void CommitSourceEdit(object sender)
+    {
+        if (sender is FrameworkElement { DataContext: SceneElement element })
+            element.IsEditing = false;
+    }
+
+    // ─── List drag-to-reorder (scenes list + sources list) ───
+    private void List_PreviewMouseLeftButtonDown(object sender, MouseButtonEventArgs e)
+    {
+        var listBox = (ListBox)sender;
+        var item = FindItemContainerAt(listBox, e.GetPosition(listBox));
+        if (item == null)
+        {
+            if (ReferenceEquals(listBox, SourceList))
+                (DataContext as MainViewModel)!.SelectedElement = null;
+            _dragIndex = -1;
+            return;
+        }
+        if (listBox.ItemsSource is not IList items || items.Count == 0)
+        {
+            _dragIndex = -1;
+            return;
+        }
+        _dragIndex = listBox.Items.IndexOf(item.DataContext);
+        _dragStartPoint = e.GetPosition(listBox);
+        _isDragging = false;
+        _lastHoveredItem = null;
+    }
+
+    private void List_PreviewMouseMove(object sender, MouseEventArgs e)
+    {
+        if (_dragIndex < 0) return;
+        var listBox = (ListBox)sender;
+        if (e.LeftButton != MouseButtonState.Pressed || listBox.ItemsSource is not IList items)
+        {
+            EndListDrag(listBox);
+            return;
+        }
+
+        var position = e.GetPosition(listBox);
+        if (!_isDragging)
+        {
+            if (Math.Abs(position.X - _dragStartPoint.X) < SystemParameters.MinimumHorizontalDragDistance &&
+                Math.Abs(position.Y - _dragStartPoint.Y) < SystemParameters.MinimumVerticalDragDistance)
+                return;
+            _isDragging = true;
+            listBox.CaptureMouse();
+        }
+
+        var item = FindItemContainerAt(listBox, position);
+        if (item == null) return;
+
+        var targetItem = item.DataContext;
+        if (ReferenceEquals(targetItem, items[_dragIndex]) || ReferenceEquals(targetItem, _lastHoveredItem))
+            return;
+
+        var targetIndex = listBox.Items.IndexOf(targetItem);
+        if (targetIndex < 0) return;
+
+        var dragged = items[_dragIndex];
+        items.RemoveAt(_dragIndex);
+        items.Insert(targetIndex, dragged);
+        _dragIndex = targetIndex;
+        _lastHoveredItem = targetItem;
+    }
+
+    private void List_PreviewMouseLeftButtonUp(object sender, MouseButtonEventArgs e)
+    {
+        EndListDrag((ListBox)sender);
+    }
+
+    private void EndListDrag(ListBox listBox)
+    {
+        if (_isDragging)
+            listBox.ReleaseMouseCapture();
+        _dragIndex = -1;
+        _isDragging = false;
+        _lastHoveredItem = null;
+    }
+
+    private static ListBoxItem? FindItemContainerAt(ListBox listBox, Point position)
+    {
+        var hit = listBox.InputHitTest(position) as DependencyObject;
+        while (hit != null && hit != listBox)
+        {
+            if (hit is ListBoxItem item) return item;
+            hit = VisualTreeHelper.GetParent(hit);
+        }
+        return null;
+    }
+
+    private void TakeSnapshot(MainViewModel vm)
+    {
+        if (vm.SelectedElement is Models.Source src)
+        {
+            _snapshotElement = src;
+            _snapshotBorderColor = src.BorderColor;
+            _snapshotBorderWidth = src.BorderWidth;
+            _snapshotTimerMinutes = src.TimerMinutes;
+            _snapshotWebUri = src.WebUri;
+        }
+    }
+
+    private void WebcamBorderColorPicker_Click(object sender, RoutedEventArgs e)
+    {
+        if ((DataContext as MainViewModel)?.SelectedElement is not SceneElement src) return;
+        if (sender is FrameworkElement fe && fe.ContextMenu == null)
+        {
+            var menu = new System.Windows.Controls.ContextMenu();
+            string[] colors = ["#FFFFFF", "#000000", "#FF0000", "#00FF00", "#0000FF",
+                               "#FFFF00", "#FF00FF", "#00FFFF", "#FF8800", "#8800FF",
+                               "#e94560", "#22c55e", "#3b82f6", "#f59e0b"];
+            foreach (var c in colors)
+            {
+                var item = new System.Windows.Controls.MenuItem { Header = c, ToolTip = c };
+                var brush = new System.Windows.Media.SolidColorBrush(
+                    (System.Windows.Media.Color)System.Windows.Media.ColorConverter.ConvertFromString(c));
+                item.Icon = new System.Windows.Controls.Border
+                {
+                    Width = 16, Height = 16,
+                    Background = brush,
+                    CornerRadius = new System.Windows.CornerRadius(2)
+                };
+                var color = c;
+                item.Click += (_, _) => src.BorderColor = color;
+                menu.Items.Add(item);
+            }
+            fe.ContextMenu = menu;
+        }
+        if (sender is FrameworkElement fe2)
+            fe2.ContextMenu.IsOpen = true;
+    }
+
+    private void WebcamBorderRevert_Click(object sender, RoutedEventArgs e)
+    {
+        if (_snapshotElement is Models.Source src)
+        {
+            src.BorderColor = _snapshotBorderColor;
+            src.BorderWidth = _snapshotBorderWidth;
+        }
+    }
+
+    private void WebcamBorderAccept_Click(object sender, RoutedEventArgs e)
+    {
+        if (_snapshotElement is Models.Source src)
+        {
+            _snapshotBorderColor = src.BorderColor;
+            _snapshotBorderWidth = src.BorderWidth;
+        }
+    }
+
+    private void CountdownRevert_Click(object sender, RoutedEventArgs e)
+    {
+        if (_snapshotElement is Models.Source src)
+            src.TimerMinutes = _snapshotTimerMinutes;
+    }
+
+    private void CountdownAccept_Click(object sender, RoutedEventArgs e)
+    {
+        if (_snapshotElement is Models.Source src)
+            _snapshotTimerMinutes = src.TimerMinutes;
+    }
+
+    private void WebRevert_Click(object sender, RoutedEventArgs e)
+    {
+        if (_snapshotElement is Models.Source src)
+            src.WebUri = string.Empty;
+        _snapshotWebUri = string.Empty;
+    }
+
+    private void WebAccept_Click(object sender, RoutedEventArgs e)
+    {
+        if (_snapshotElement is Models.Source src)
+            _snapshotWebUri = src.WebUri;
+    }
+}
diff --git a/MainWindow.xaml b/MainWindow.xaml
index 905ed84..7ed8818 100644
--- a/MainWindow.xaml
+++ b/MainWindow.xaml
@@ -98,499 +98,8 @@
             <!-- LEFT PANEL: one panel, two states.
                  Offline (edit mode): LAYERS + PROPERTIES
                  Live/Recording: YouTube Live Chat -->
-            <Border Grid.Row="1" Grid.Column="0" Background="#16213e" CornerRadius="6" Padding="12">
-                <Grid>
-                    <Grid.RowDefinitions>
-                        <RowDefinition Height="*"/>
-                    </Grid.RowDefinitions>
+            <controls:LeftPanel x:Name="LeftPanel" Grid.Row="1" Grid.Column="0"/>
 
-                    <!-- Edit mode (offline): layers + properties -->
-                    <Grid Grid.Row="0" Visibility="{Binding IsEditMode, Converter={StaticResource BoolToVis}}">
-                        <Grid.RowDefinitions>
-                            <RowDefinition Height="Auto"/>
-                            <RowDefinition Height="Auto"/>
-                            <RowDefinition Height="Auto"/>
-                            <RowDefinition Height="Auto"/>
-                            <RowDefinition Height="Auto"/>
-                            <RowDefinition Height="*"/>
-                        </Grid.RowDefinitions>
-
-                        <!-- LAYERS header + Add button -->
-                        <StackPanel Grid.Row="0" Orientation="Horizontal" Margin="0,8,0,0">
-                            <TextBlock Text="LAYERS" Style="{StaticResource SectionHeader}" VerticalAlignment="Center"/>
-                            <Button ToolTip="Add Layer" Style="{StaticResource IconButton}" Margin="4,-4,0,0"
-                                Click="AddSourceButton_Click">
-                            <Button.ContextMenu>
-                                <ContextMenu DataContext="{Binding PlacementTarget.DataContext, RelativeSource={RelativeSource Self}}">
-                                    <MenuItem Header="Webcam" Command="{Binding AddWebcamCommand}"
-                                              IsEnabled="{Binding CanAddWebcam}"
-                                              ToolTip="One webcam at a time — it's already in your stream"/>
-                                    <MenuItem Header="Image" Command="{Binding AddImageCommand}"/>
-                                    <MenuItem Header="Text" Command="{Binding AddSourceCommand}" CommandParameter="{x:Static models:SourceType.TextOverlay}"/>
-                                    <MenuItem Header="Countdown" Command="{Binding AddSourceCommand}" CommandParameter="{x:Static models:SourceType.Countdown}"
-                                              Visibility="{Binding IsCountdownAvailable, Converter={StaticResource BoolToVis}}"
-                                              ToolTip="Timer overlay — Starting and BRB screens only"/>
-                                    <MenuItem Header="Web Resource" Command="{Binding AddSourceCommand}" CommandParameter="{x:Static models:SourceType.WebSource}"
-                                              ToolTip="Embedded web page — set URI in Properties panel"/>
-                                    <MenuItem Header="YouTube Chat" Command="{Binding AddSourceCommand}" CommandParameter="{x:Static models:SourceType.ChatBox}"
-                                              IsEnabled="{Binding CanAddYouTubeChat}"
-                                              ToolTip="One chat layer at a time — it's already in your stream"/>
-                                </ContextMenu>
-                            </Button.ContextMenu>
-                            <Path Data="M12,4 L12,20 M4,12 L20,12" Stroke="#e94560" StrokeThickness="2"
-                                  Width="14" Height="14" Stretch="Uniform"/>
-                        </Button>
-                    </StackPanel>
-
-                    <Helpers:FocusPreservingListBox x:Name="SourceList" Grid.Row="1" Background="Transparent" BorderThickness="0"
-                             ItemsSource="{Binding StagedScene.Elements}"
-                             SelectedItem="{Binding SelectedElement, Mode=TwoWay}"
-                             PreviewMouseLeftButtonDown="List_PreviewMouseLeftButtonDown"
-                             PreviewMouseMove="List_PreviewMouseMove"
-                             PreviewMouseLeftButtonUp="List_PreviewMouseLeftButtonUp"
-                             Foreground="#e0e0e0" FontSize="13">
-                        <Helpers:FocusPreservingListBox.ItemContainerStyle>
-                            <Style TargetType="ListBoxItem" BasedOn="{StaticResource YtListBoxItem}">
-                                <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
-                                <Style.Triggers>
-                                    <DataTrigger Binding="{Binding IsVisible}" Value="False">
-                                        <Setter Property="Opacity" Value="0.45"/>
-                                    </DataTrigger>
-                                </Style.Triggers>
-                            </Style>
-                        </Helpers:FocusPreservingListBox.ItemContainerStyle>
-                        <ListBox.ItemTemplate>
-                            <DataTemplate>
-                                <Grid Margin="0,2"
-                                      Tag="{Binding DataContext.CanChangeBackground, RelativeSource={RelativeSource AncestorType=Window}}">
-                                    <Grid.ColumnDefinitions>
-                                        <ColumnDefinition Width="*"/>
-                                        <ColumnDefinition Width="Auto"/>
-                                        <ColumnDefinition Width="Auto"/>
-                                        <ColumnDefinition Width="Auto"/>
-                                    </Grid.ColumnDefinitions>
-
-                                    <Grid.ContextMenu>
-                                        <ContextMenu DataContext="{Binding PlacementTarget.DataContext, RelativeSource={RelativeSource Self}}">
-                                            <MenuItem Header="Change Capture…" Click="BackgroundMenu_ChangeCapture">
-                                                <MenuItem.Visibility>
-                                                    <MultiBinding Converter="{StaticResource AllTrueToVis}">
-                                                        <Binding Path="IsBackground"/>
-                                                        <Binding Path="PlacementTarget.Tag" RelativeSource="{RelativeSource AncestorType={x:Type ContextMenu}}"/>
-                                                    </MultiBinding>
-                                                </MenuItem.Visibility>
-                                            </MenuItem>
-                                            <MenuItem Header="Refresh Capture" Click="BackgroundMenu_RefreshCapture">
-                                                <MenuItem.Visibility>
-                                                    <MultiBinding Converter="{StaticResource AllTrueToVis}">
-                                                        <Binding Path="IsBackground"/>
-                                                        <Binding Path="PlacementTarget.Tag" RelativeSource="{RelativeSource AncestorType={x:Type ContextMenu}}"/>
-                                                    </MultiBinding>
-                                                </MenuItem.Visibility>
-                                            </MenuItem>
-                                            <Separator>
-                                                <Separator.Visibility>
-                                                    <MultiBinding Converter="{StaticResource AllTrueToVis}">
-                                                        <Binding Path="IsBackground"/>
-                                                        <Binding Path="PlacementTarget.Tag" RelativeSource="{RelativeSource AncestorType={x:Type ContextMenu}}"/>
-                                                    </MultiBinding>
-                                                </Separator.Visibility>
-                                            </Separator>
-                                            <MenuItem Header="Remove Layer" Click="SourceMenu_Remove"
-                                                      Visibility="{Binding IsBackground, Converter={StaticResource InverseBoolToVis}}"/>
-                                        </ContextMenu>
-                                    </Grid.ContextMenu>
-
-                                    <TextBlock Grid.Column="0" Text="{Binding Name}" VerticalAlignment="Center"
-                                               Padding="4,2" TextTrimming="CharacterEllipsis">
-                                        <TextBlock.Style>
-                                            <Style TargetType="TextBlock">
-                                                <Setter Property="Visibility" Value="Visible"/>
-                                                <Style.Triggers>
-                                                    <DataTrigger Binding="{Binding IsEditing}" Value="True">
-                                                        <Setter Property="Visibility" Value="Collapsed"/>
-                                                    </DataTrigger>
-                                                </Style.Triggers>
-                                            </Style>
-                                        </TextBlock.Style>
-                                    </TextBlock>
-
-                                    <TextBox Grid.Column="0" Text="{Binding Name, UpdateSourceTrigger=PropertyChanged}"
-                                             Background="#0f3460" Foreground="#e0e0e0" BorderThickness="0"
-                                             Padding="4,2" VerticalContentAlignment="Center"
-                                             IsVisibleChanged="SourceNameBox_IsVisibleChanged"
-                                             KeyDown="SourceNameBox_KeyDown" LostFocus="SourceNameBox_LostFocus">
-                                        <TextBox.Style>
-                                            <Style TargetType="TextBox">
-                                                <Setter Property="Visibility" Value="Collapsed"/>
-                                                <Style.Triggers>
-                                                    <DataTrigger Binding="{Binding IsEditing}" Value="True">
-                                                        <Setter Property="Visibility" Value="Visible"/>
-                                                    </DataTrigger>
-                                                </Style.Triggers>
-                                            </Style>
-                                        </TextBox.Style>
-                                    </TextBox>
-
-                                    <Button Grid.Column="1" ToolTip="Edit Layer Name"
-                                            Command="{Binding DataContext.EditElementCommand, RelativeSource={RelativeSource AncestorType=ListBox}}"
-                                            CommandParameter="{Binding}" Style="{StaticResource IconButton}">
-                                        <Path Data="M3,17.25V21h3.75L17.81,9.94l-3.75,-3.75L3,17.25zM20.71,7.04c0.39,-0.39 0.39,-1.02 0,-1.41l-2.34,-2.34c-0.39,-0.39 -1.02,-0.39 -1.41,0l-1.83,1.83 3.75,3.75 1.83,-1.83z"
-                                              Fill="#d0d0d0" Width="13" Height="13" Stretch="Uniform"/>
-                                    </Button>
-
-                                    <Button Grid.Column="2" Style="{StaticResource EyeButton}"
-                                            Command="{Binding DataContext.ToggleElementVisibilityCommand, RelativeSource={RelativeSource AncestorType=ListBox}}"
-                                            CommandParameter="{Binding}">
-                                        <Path Style="{StaticResource EyeIconStyle}" Fill="#d0d0d0"
-                                              Width="13" Height="13" Stretch="Uniform"/>
-                                    </Button>
-
-                                    <Button Grid.Column="3" ToolTip="Remove Layer"
-                                            Command="{Binding DataContext.RemoveSourceCommand, RelativeSource={RelativeSource AncestorType=ListBox}}"
-                                            CommandParameter="{Binding}" Style="{StaticResource IconButton}"
-                                            Visibility="{Binding IsBackground, Converter={StaticResource HiddenBoolToVis}}">
-                                        <Path Data="M6,19c0,1.1 0.9,2 2,2h8c1.1,0 2,-0.9 2,-2V7H6v12zM19,4h-3.5l-1,-1h-5l-1,1H5v2h14V4z"
-                                              Fill="#d0d0d0" Width="13" Height="13" Stretch="Uniform"/>
-                                    </Button>
-                                </Grid>
-                            </DataTemplate>
-                        </ListBox.ItemTemplate>
-                    </Helpers:FocusPreservingListBox>
-
-                            <TextBlock Grid.Row="2" Text="No layers yet" Foreground="#555" FontSize="12"
-                               HorizontalAlignment="Center" VerticalAlignment="Center"
-                               Visibility="{Binding ShowSourcesEmptyHint, Converter={StaticResource BoolToVis}}"/>
-
-                    <!-- ELEMENTS panel: per-element config beneath Sources.
-                         Collapses entirely when no element is selected. -->
-                    <Rectangle Grid.Row="3" Height="1" Fill="#2c3a5c" Margin="0,10,0,2"
-                               Visibility="{Binding SelectedElement, Converter={StaticResource NotNullToVis}}"/>
-                    <StackPanel Grid.Row="4" Orientation="Horizontal" Margin="0,8,0,0"
-                                Visibility="{Binding SelectedElement, Converter={StaticResource NotNullToVis}}">
-                        <TextBlock Text="PROPERTIES" Style="{StaticResource SectionHeader}" VerticalAlignment="Center"/>
-                    </StackPanel>
-                    <ScrollViewer x:Name="ElementsScrollViewer" Grid.Row="5" VerticalScrollBarVisibility="Auto" Background="Transparent"
-                                  Visibility="{Binding SelectedElement, Converter={StaticResource NotNullToVis}}">
-                        <StackPanel x:Name="ElementsPanel" Margin="0,4,0,0">
-                            <!-- Opacity + mirror/shape (draggable elements: image, webcam) -->
-                            <StackPanel Visibility="{Binding SelectedElement.IsDraggable, Converter={StaticResource BoolToVis}}" Margin="0,0,0,8">
-                                <StackPanel Visibility="{Binding SelectedElement.IsChatBox, Converter={StaticResource InverseBoolToVis}}">
-                                    <TextBlock Text="Opacity" Foreground="#a0a0b0" FontSize="11" Margin="0,0,0,2"/>
-                                    <DockPanel Margin="0,0,0,6">
-                                        <TextBlock x:Name="OpacityValueText" Text="100%" Foreground="#a0a0b0" FontSize="11"
-                                                   DockPanel.Dock="Right" VerticalAlignment="Center" Margin="8,0,0,0" Width="32"/>
-                                        <Slider x:Name="OpacitySlider" Width="120" Minimum="0" Maximum="1"
-                                                Value="{Binding SelectedElement.Opacity, Mode=TwoWay}"
-                                                ValueChanged="OpacitySlider_ValueChanged" VerticalAlignment="Center"/>
-                                    </DockPanel>
-                                </StackPanel>
-                                <StackPanel Orientation="Horizontal" Margin="0,0,0,4"
-                                            Visibility="{Binding IsWebcamSelected, Converter={StaticResource BoolToVis}}">
-                                    <Button Content="{Binding SelectedElement.MirrorButtonText}"
-                                            Style="{StaticResource YtButtonSecondary}" Padding="10,4"
-                                            Click="MirrorButton_Click"/>
-                                    <Button Content="{Binding SelectedElement.ShapeButtonText}"
-                                            Style="{StaticResource YtButtonSecondary}" Padding="10,4"
-                                            Margin="8,0,0,0" Click="ShapeButton_Click"/>
-                                </StackPanel>
-                                <TextBlock Text="Drag to move · drag the corner dot to resize"
-                                           Foreground="#a0a0b0" FontSize="10" Margin="0,2,0,0"/>
-                            </StackPanel>
-
-                            <!-- Webcam border config -->
-                            <StackPanel Visibility="{Binding SelectedElement.IsWebcam, Converter={StaticResource BoolToVis}}" Margin="0,0,0,8">
-                                <TextBlock Text="Border Color" Foreground="#a0a0b0" FontSize="11" Margin="0,0,0,2"/>
-                                <DockPanel Margin="0,0,0,6">
-                                    <Button DockPanel.Dock="Right" Content="..." Width="24" Height="24"
-                                            Click="WebcamBorderColorPicker_Click" Margin="4,0,0,0"
-                                            ToolTip="Pick color"/>
-                                    <TextBox Text="{Binding SelectedElement.BorderColor, UpdateSourceTrigger=PropertyChanged}"
-                                             Background="#0f3460" Foreground="#e0d0e0" BorderThickness="1"
-                                             BorderBrush="#2c3a5c" Padding="4,2" FontSize="12"
-                                             MaxLength="7" ToolTip="#RRGGBB"/>
-                                </DockPanel>
-                                <TextBlock Text="Border Thickness" Foreground="#a0a0b0" FontSize="11" Margin="0,0,0,2"/>
-                                <DockPanel Margin="0,0,0,6">
-                                    <Button DockPanel.Dock="Right" Style="{StaticResource IconButton}"
-                                            Width="22" Height="22" Margin="4,0,0,0"
-                                            Click="WebcamBorderAccept_Click">
-                                        <Path Data="M4,9 L8,14 L16,4" Stroke="#22c55e" StrokeThickness="2"
-                                              Width="14" Height="14" Stretch="Uniform"/>
-                                    </Button>
-                                    <Button DockPanel.Dock="Right" Style="{StaticResource IconButton}"
-                                            Width="22" Height="22" ToolTip="Revert"
-                                            Click="WebcamBorderRevert_Click" Margin="4,0,0,0">
-                                        <Path Data="M5,5 L15,15 M15,5 L5,15" Stroke="#e94560" StrokeThickness="2"
-                                              Width="14" Height="14" Stretch="Uniform"/>
-                                    </Button>
-                                    <Slider DockPanel.Dock="Left" Width="120" Minimum="0" Maximum="10"
-                                            Value="{Binding SelectedElement.BorderWidth, Mode=TwoWay}"
-                                            VerticalAlignment="Center" TickFrequency="1" IsSnapToTickEnabled="True"/>
-                                    <TextBlock Text="{Binding SelectedElement.BorderWidth}" Foreground="#a0a0b0" FontSize="11"
-                                               VerticalAlignment="Center" Margin="8,0,0,0" Width="20"/>
-                                </DockPanel>
-                            </StackPanel>
-
-                            <!-- Countdown config -->
-                            <StackPanel Visibility="{Binding SelectedElement.IsCountdown, Converter={StaticResource BoolToVis}}" Margin="0,0,0,8">
-                                <TextBlock Text="Timer (minutes)" Foreground="#a0a0b0" FontSize="11" Margin="0,0,0,2"/>
-                                <DockPanel Margin="0,0,0,6">
-                                    <Button DockPanel.Dock="Right" Style="{StaticResource IconButton}"
-                                            Width="22" Height="22" Margin="4,0,0,0"
-                                            Click="CountdownAccept_Click">
-                                        <Path Data="M4,9 L8,14 L16,4" Stroke="#22c55e" StrokeThickness="2"
-                                              Width="14" Height="14" Stretch="Uniform"/>
-                                    </Button>
-                                    <Button DockPanel.Dock="Right" Style="{StaticResource IconButton}"
-                                            Width="22" Height="22" ToolTip="Revert"
-                                            Click="CountdownRevert_Click" Margin="4,0,0,0">
-                                        <Path Data="M5,5 L15,15 M15,5 L5,15" Stroke="#e94560" StrokeThickness="2"
-                                              Width="14" Height="14" Stretch="Uniform"/>
-                                    </Button>
-                                    <Slider DockPanel.Dock="Left" Width="120" Minimum="1" Maximum="60"
-                                            Value="{Binding SelectedElement.TimerMinutes, Mode=TwoWay}"
-                                            VerticalAlignment="Center" TickFrequency="1" IsSnapToTickEnabled="True"/>
-                                    <TextBlock Text="{Binding SelectedElement.TimerMinutes}" Foreground="#a0a0b0" FontSize="11"
-                                               VerticalAlignment="Center" Margin="8,0,0,0" Width="20"/>
-                                </DockPanel>
-                            </StackPanel>
-
-                            <!-- Web source config -->
-                            <StackPanel Visibility="{Binding SelectedElement.IsWebSource, Converter={StaticResource BoolToVis}}" Margin="0,0,0,8">
-                                <TextBlock Text="Geometry" Foreground="#a0a0b0" FontSize="11" FontWeight="SemiBold" Margin="0,0,0,4"/>
-                                <DockPanel Margin="0,0,0,4">
-                                    <TextBlock DockPanel.Dock="Left" Text="X" Foreground="#a0a0b0" FontSize="11" VerticalAlignment="Center" Width="16"/>
-                                    <TextBox Text="{Binding SelectedElement.X, UpdateSourceTrigger=PropertyChanged, StringFormat=F0}"
-                                             Background="#0f3460" Foreground="#e0d0e0" BorderThickness="1"
-                                             BorderBrush="#2c3a5c" Padding="4,2" FontSize="12"/>
-                                    <TextBlock DockPanel.Dock="Left" Text="  Y" Foreground="#a0a0b0" FontSize="11" VerticalAlignment="Center" Width="20" Margin="8,0,0,0"/>
-                                    <TextBox Text="{Binding SelectedElement.Y, UpdateSourceTrigger=PropertyChanged, StringFormat=F0}"
-                                             Background="#0f3460" Foreground="#e0d0e0" BorderThickness="1"
-                                             BorderBrush="#2c3a5c" Padding="4,2" FontSize="12"/>
-                                </DockPanel>
-                                <DockPanel Margin="0,0,0,4">
-                                    <TextBlock DockPanel.Dock="Left" Text="W" Foreground="#a0a0b0" FontSize="11" VerticalAlignment="Center" Width="16"/>
-                                    <TextBox Text="{Binding SelectedElement.Width, UpdateSourceTrigger=PropertyChanged, StringFormat=F0}"
-                                             Background="#0f3460" Foreground="#e0d0e0" BorderThickness="1"
-                                             BorderBrush="#2c3a5c" Padding="4,2" FontSize="12"/>
-                                    <TextBlock DockPanel.Dock="Left" Text="  H" Foreground="#a0a0b0" FontSize="11" VerticalAlignment="Center" Width="20" Margin="8,0,0,0"/>
-                                    <TextBox Text="{Binding SelectedElement.Height, UpdateSourceTrigger=PropertyChanged, StringFormat=F0}"
-                                             Background="#0f3460" Foreground="#e0d0e0" BorderThickness="1"
-                                             BorderBrush="#2c3a5c" Padding="4,2" FontSize="12"/>
-                                </DockPanel>
-                                <TextBlock Text="URI" Foreground="#a0a0b0" FontSize="11" Margin="0,0,0,2"/>
-                                <DockPanel>
-                                    <Button DockPanel.Dock="Right" Style="{StaticResource IconButton}"
-                                            Width="22" Height="22" Margin="4,0,0,0" IsTabStop="False"
-                                            Click="WebAccept_Click">
-                                        <Path Data="M4,9 L8,14 L16,4" Stroke="#22c55e" StrokeThickness="2"
-                                              Width="14" Height="14" Stretch="Uniform"/>
-                                    </Button>
-                                    <Button DockPanel.Dock="Right" Style="{StaticResource IconButton}"
-                                            Width="22" Height="22" ToolTip="Revert" IsTabStop="False"
-                                            Click="WebRevert_Click" Margin="4,0,0,0">
-                                        <Path Data="M5,5 L15,15 M15,5 L5,15" Stroke="#e94560" StrokeThickness="2"
-                                              Width="14" Height="14" Stretch="Uniform"/>
-                                    </Button>
-                                    <TextBox Text="{Binding SelectedElement.WebUri, UpdateSourceTrigger=PropertyChanged}"
-                                             Background="#0f3460" Foreground="#e0d0e0" BorderThickness="1"
-                                             BorderBrush="#2c3a5c" Padding="4,2" FontSize="12"
-                                             ToolTip="https://example.com"/>
-                                </DockPanel>
-                            </StackPanel>
-
-                            <!-- Chat box config -->
-                            <StackPanel Visibility="{Binding SelectedElement.IsChatBox, Converter={StaticResource BoolToVis}}" Margin="0,0,0,8">
-                                <TextBlock Text="Chat Overlay" Foreground="#a0a0b0" FontSize="11" FontWeight="SemiBold" Margin="0,0,0,6"/>
-
-                                <!-- Font Size -->
-                                <DockPanel Margin="0,0,0,4">
-                                    <TextBlock DockPanel.Dock="Left" Text="Font Size" Foreground="#a0a0b0" FontSize="11" VerticalAlignment="Center" Width="70"/>
-                                    <Slider x:Name="ChatFontSizeSlider" Width="120" Minimum="8" Maximum="72" TickFrequency="2" IsSnapToTickEnabled="True"
-                                            Value="{Binding SelectedElement.ChatFontSize, Mode=TwoWay}"
-                                            VerticalAlignment="Center"/>
-                                    <TextBlock DockPanel.Dock="Right" Text="{Binding SelectedElement.ChatFontSize, StringFormat={}{0:0}}" Foreground="#e0e0e0" FontSize="11" Margin="6,0,0,0" VerticalAlignment="Center" Width="24"/>
-                                </DockPanel>
-
-                                <!-- Font Family -->
-                                <DockPanel Margin="0,0,0,4">
-                                    <TextBlock DockPanel.Dock="Left" Text="Font" Foreground="#a0a0b0" FontSize="11" VerticalAlignment="Center" Width="70"/>
-                                    <ComboBox SelectedValue="{Binding SelectedElement.ChatFontFamily, Mode=TwoWay}"
-                                              SelectedValuePath="Content"
-                                              Background="#0f3460" Foreground="#e0e0e0" FontSize="11"
-                                              Width="140" VerticalAlignment="Center">
-                                        <ComboBoxItem Content="Segoe UI"/>
-                                        <ComboBoxItem Content="Arial"/>
-                                        <ComboBoxItem Content="Consolas"/>
-                                        <ComboBoxItem Content="Courier New"/>
-                                        <ComboBoxItem Content="Comic Sans MS"/>
-                                        <ComboBoxItem Content="Mouse Memoirs"/>
-                                    </ComboBox>
-                                </DockPanel>
-
-                                <!-- Font Color -->
-                                <DockPanel Margin="0,0,0,4">
-                                    <TextBlock DockPanel.Dock="Left" Text="Font Color" Foreground="#a0a0b0" FontSize="11" VerticalAlignment="Center" Width="70"/>
-                                    <TextBox Text="{Binding SelectedElement.ChatFontColor, UpdateSourceTrigger=PropertyChanged}"
-                                             Background="#0f3460" Foreground="#e0e0e0" BorderThickness="1"
-                                             BorderBrush="#2c3a5c" Padding="4,2" FontSize="11" Width="80"/>
-                                </DockPanel>
-
-                                <!-- Member Color -->
-                                <DockPanel Margin="0,0,0,4">
-                                    <TextBlock DockPanel.Dock="Left" Text="Member" Foreground="#a0a0b0" FontSize="11" VerticalAlignment="Center" Width="70"/>
-                                    <TextBox Text="{Binding SelectedElement.ChatMemberColor, UpdateSourceTrigger=PropertyChanged}"
-                                             Background="#0f3460" Foreground="#e0e0e0" BorderThickness="1"
-                                             BorderBrush="#2c3a5c" Padding="4,2" FontSize="11" Width="80"/>
-                                </DockPanel>
-
-                                <!-- Super Chat Color -->
-                                <DockPanel Margin="0,0,0,4">
-                                    <TextBlock DockPanel.Dock="Left" Text="Super Chat" Foreground="#a0a0b0" FontSize="11" VerticalAlignment="Center" Width="70"/>
-                                    <TextBox Text="{Binding SelectedElement.ChatSuperChatColor, UpdateSourceTrigger=PropertyChanged}"
-                                             Background="#0f3460" Foreground="#e0e0e0" BorderThickness="1"
-                                             BorderBrush="#2c3a5c" Padding="4,2" FontSize="11" Width="80"/>
-                                </DockPanel>
-
-                                <!-- Max Messages -->
-                                <DockPanel Margin="0,0,0,4">
-                                    <TextBlock DockPanel.Dock="Left" Text="Max Msgs" Foreground="#a0a0b0" FontSize="11" VerticalAlignment="Center" Width="70"/>
-                                    <Slider x:Name="ChatMaxMsgsSlider" Width="120" Minimum="1" Maximum="20" TickFrequency="1" IsSnapToTickEnabled="True"
-                                            Value="{Binding SelectedElement.ChatMaxMessages, Mode=TwoWay}"
-                                            VerticalAlignment="Center"/>
-                                    <TextBlock DockPanel.Dock="Right" Text="{Binding SelectedElement.ChatMaxMessages}" Foreground="#e0e0e0" FontSize="11" Margin="6,0,0,0" VerticalAlignment="Center" Width="24"/>
-                                </DockPanel>
-
-                                <!-- Background Color -->
-                                <DockPanel Margin="0,0,0,4">
-                                    <TextBlock DockPanel.Dock="Left" Text="Background" Foreground="#a0a0b0" FontSize="11" VerticalAlignment="Center" Width="70"/>
-                                    <TextBox Text="{Binding SelectedElement.ChatBackgroundColor, UpdateSourceTrigger=PropertyChanged}"
-                                             Background="#0f3460" Foreground="#e0e0e0" BorderThickness="1"
-                                             BorderBrush="#2c3a5c" Padding="4,2" FontSize="11" Width="80"/>
-                                </DockPanel>
-
-                                <!-- Background Opacity -->
-                                <DockPanel Margin="0,0,0,4">
-                                    <TextBlock DockPanel.Dock="Left" Text="Bg Opacity" Foreground="#a0a0b0" FontSize="11" VerticalAlignment="Center" Width="70"/>
-                                    <Slider x:Name="ChatBgOpacitySlider" Width="120" Minimum="0" Maximum="1"
-                                            Value="{Binding SelectedElement.ChatBackgroundOpacity, Mode=TwoWay}"
-                                            VerticalAlignment="Center"/>
-                                    <TextBlock DockPanel.Dock="Right" Text="{Binding SelectedElement.ChatBackgroundOpacity, StringFormat={}{0:0%}}" Foreground="#e0e0e0" FontSize="11" Margin="6,0,0,0" VerticalAlignment="Center" Width="32"/>
-                                </DockPanel>
-
-                                <!-- Fade After (seconds) -->
-                                <DockPanel Margin="0,0,0,4">
-                                    <TextBlock DockPanel.Dock="Left" Text="Fade After" Foreground="#a0a0b0" FontSize="11" VerticalAlignment="Center" Width="70"/>
-                                    <Slider x:Name="ChatFadeSlider" Width="120" Minimum="0" Maximum="60" TickFrequency="5" IsSnapToTickEnabled="True"
-                                            Value="{Binding SelectedElement.ChatFadeSeconds, Mode=TwoWay}"
-                                            VerticalAlignment="Center"/>
-                                    <TextBlock DockPanel.Dock="Right" Text="{Binding SelectedElement.ChatFadeSeconds, StringFormat='{}{0}s'}" Foreground="#e0e0e0" FontSize="11" Margin="6,0,0,0" VerticalAlignment="Center" Width="28"/>
-                                </DockPanel>
-
-                                <!-- Toggles -->
-                                <CheckBox Content="Show timestamps" Foreground="#a0a0b0" FontSize="11" Margin="0,4,0,2"
-                                          IsChecked="{Binding SelectedElement.ChatShowTimestamps, Mode=TwoWay}"/>
-                                <CheckBox Content="Show badges" Foreground="#a0a0b0" FontSize="11" Margin="0,0,0,2"
-                                          IsChecked="{Binding SelectedElement.ChatShowBadges, Mode=TwoWay}"/>
-                            </StackPanel>
-
-                            <!-- Background properties -->
-                            <StackPanel Margin="0,8,0,0"
-                                        Visibility="{Binding SelectedElement.IsBackground, Converter={StaticResource BoolToVis}}">
-                                <TextBlock Text="Background" Style="{StaticResource SubHeader}"/>
-                                <StackPanel Margin="4,0,0,0">
-                                    <StackPanel Orientation="Horizontal" Margin="0,0,0,8">
-                                        <TextBlock Text="Use default background:" Foreground="#a0a0b0" FontSize="11" VerticalAlignment="Center"/>
-                                        <ToggleButton Style="{StaticResource PillToggle}"
-                                                      IsChecked="{Binding SelectedElement.UseDefaultBackground, Mode=TwoWay}"
-                                                      Margin="8,0,0,0"/>
-                                    </StackPanel>
-                                    <Grid Margin="0,0,0,4"
-                                          Visibility="{Binding SelectedElement.UseDefaultBackground, Converter={StaticResource InverseBoolToVis}}">
-                                        <Grid.ColumnDefinitions>
-                                            <ColumnDefinition Width="*"/>
-                                            <ColumnDefinition Width="Auto"/>
-                                        </Grid.ColumnDefinitions>
-                                        <TextBox Grid.Column="0" Text="{Binding SelectedElement.CustomBackgroundPath, Mode=OneWay}"
-                                                  IsReadOnly="True" Background="#0f3460" Foreground="#a0a0b0"
-                                                  FontSize="11" VerticalAlignment="Center"/>
-                                        <Button Grid.Column="1" Content="Browse…" Command="{Binding BrowseBackgroundCommand}"
-                                                Style="{StaticResource YtButtonSecondary}" Margin="4,0,0,0" Padding="8,2"/>
-                                    </Grid>
-                                    <TextBlock Text="{Binding BackgroundSizeMismatchText}"
-                                               Foreground="#ef4444" FontSize="11" TextWrapping="Wrap"
-                                               Margin="0,4,0,0"
-                                               Visibility="{Binding BackgroundSizeMismatch, Converter={StaticResource BoolToVis}}"/>
-                                </StackPanel>
-                            </StackPanel>
-                        </StackPanel>
-                    </ScrollViewer>
-                </Grid>
-
-                <!-- Live mode: YouTube Live Chat (entire left panel replaced) -->
-                <Grid Grid.Row="0" Visibility="{Binding IsEditMode, Converter={StaticResource InverseBoolToVis}}">
-                    <Grid.RowDefinitions>
-                        <RowDefinition Height="Auto"/>
-                        <RowDefinition Height="*"/>
-                    </Grid.RowDefinitions>
-
-                    <TextBlock Grid.Row="0" Text="LIVE CHAT" Style="{StaticResource SectionHeader}"/>
-
-                    <!-- Inactive overlay (shown when NOT live) -->
-                    <StackPanel Grid.Row="1" VerticalAlignment="Center" HorizontalAlignment="Center"
-                                Visibility="{Binding ShowChatInactiveMessage, Converter={StaticResource BoolToVis}}">
-                        <TextBlock Text="Chat is inactive" Foreground="#a0a0b0" FontSize="13"
-                                   HorizontalAlignment="Center" Margin="0,0,0,4"/>
-                        <TextBlock Text="Chat becomes active once LlamaCasty is connected and streaming on YouTube."
-                                   Foreground="#666" FontSize="11" TextWrapping="Wrap"
-                                   HorizontalAlignment="Center" TextAlignment="Center" MaxWidth="240"/>
-                    </StackPanel>
-
-                    <!-- Message feed (shown when live) -->
-                    <ListBox Grid.Row="1" Background="Transparent" BorderThickness="0"
-                             ItemsSource="{Binding ChatMessages}"
-                             ItemContainerStyle="{StaticResource YtListBoxItem}"
-                             Visibility="{Binding ShowChatInactiveMessage, Converter={StaticResource InverseBoolToVis}}"
-                             x:Name="ChatListBox">
-                        <ListBox.ItemTemplate><DataTemplate>
-                            <Border x:Name="MessageBorder" Padding="6,4" CornerRadius="4">
-                                <Border.Style>
-                                    <Style TargetType="Border">
-                                        <Setter Property="Background" Value="Transparent"/>
-                                        <Style.Triggers>
-                                            <DataTrigger Binding="{Binding IsSuperChat}" Value="True">
-                                                <Setter Property="Background" Value="#2a1a0a"/>
-                                                <Setter Property="BorderBrush" Value="#eab308"/>
-                                                <Setter Property="BorderThickness" Value="1,0,1,0"/>
-                                            </DataTrigger>
-                                        </Style.Triggers>
-                                    </Style>
-                                </Border.Style>
-                                <StackPanel>
-                                    <StackPanel Orientation="Horizontal" Margin="0,0,0,2">
-                                        <TextBlock Text="&#x2B50;" FontSize="10" Margin="0,0,4,0"
-                                                   VerticalAlignment="Center"
-                                                   Visibility="{Binding IsMember, Converter={StaticResource BoolToVis}}"/>
-                                        <TextBlock Text="{Binding AuthorName}" Foreground="#e94560"
-                                                   FontWeight="Bold" FontSize="12" VerticalAlignment="Center"/>
-                                        <TextBlock Text="{Binding SuperChatAmount, StringFormat=${0:F2}}"
-                                                   Foreground="#eab308" FontWeight="Bold" FontSize="12"
-                                                   Margin="8,0,0,0" VerticalAlignment="Center"
-                                                   Visibility="{Binding IsSuperChat, Converter={StaticResource BoolToVis}}"/>
-                                        <TextBlock Text="{Binding SuperChatCurrency}" Foreground="#eab308"
-                                                   FontSize="11" Margin="2,0,0,0" VerticalAlignment="Center"
-                                                   Visibility="{Binding IsSuperChat, Converter={StaticResource BoolToVis}}"/>
-                                    </StackPanel>
-                                    <TextBlock Text="{Binding Message}" Foreground="#e0e0e0"
-                                               TextWrapping="Wrap" Margin="0,2,0,0"/>
-                                </StackPanel>
-                            </Border>
-                        </DataTemplate></ListBox.ItemTemplate>
-                    </ListBox>
-                </Grid>
-            </Grid>
-            </Border>
 
             <!-- CENTER: Preview Area -->
             <controls:PreviewPane x:Name="PreviewPane" Grid.Row="1" Grid.Column="1"/>
diff --git a/MainWindow.xaml.cs b/MainWindow.xaml.cs
index 967be1f..7d5021b 100644
--- a/MainWindow.xaml.cs
+++ b/MainWindow.xaml.cs
@@ -1,12 +1,10 @@
 using System;
-using System.Collections;
 using System.ComponentModel;
 using System.Windows;
 using System.Windows.Controls;
 using System.Windows.Input;
 using System.Windows.Media;
 using ytLive.Helpers;
-using ytLive.Models;
 using ytLive.ViewModels;
 
 namespace ytLive;
@@ -16,6 +14,7 @@ public partial class MainWindow : Window
     private readonly MainViewModel _viewModel;
     private Controls.TopBar _topBar = null!;
     private Controls.PreviewPane _previewPane = null!;
+    private Controls.LeftPanel _leftPanel = null!;
 
     public MainWindow()
     {
@@ -25,9 +24,9 @@ public partial class MainWindow : Window
         _viewModel = (MainViewModel)DataContext;
         _viewModel.InitWebView2(WebViewHostPanel);
         _viewModel.PropertyChanged += OnViewModelPropertyChanged;
-        _viewModel.ChatMessages.CollectionChanged += OnChatMessagesChanged;
         _topBar = (Controls.TopBar)FindName("TopBar")!;
         _previewPane = (Controls.PreviewPane)FindName("PreviewPane")!;
+        _leftPanel = (Controls.LeftPanel)FindName("LeftPanel")!;
         UpdateTaskbarOverlay();
         UpdateSelectionOverlay();
         _topBar.RefreshAvatar();
@@ -136,15 +135,6 @@ public partial class MainWindow : Window
             : null;
     }
 
-    private void SourceNameBox_IsVisibleChanged(object sender, DependencyPropertyChangedEventArgs e)
-    {
-        if (sender is TextBox { IsVisible: true } box)
-        {
-            box.Focus();
-            box.SelectAll();
-        }
-    }
-
     private void BackToAbout_Click(object sender, RoutedEventArgs e)
     {
         if (DataContext is ViewModels.MainViewModel vm)
@@ -154,17 +144,6 @@ public partial class MainWindow : Window
         }
     }
 
-    private void AddSourceButton_Click(object sender, RoutedEventArgs e)
-    {
-        if (sender is Button { ContextMenu: { } menu } button)
-        {
-            menu.PlacementTarget = button;
-            menu.Placement = System.Windows.Controls.Primitives.PlacementMode.Bottom;
-            menu.IsOpen = true;
-        }
-    }
-
-
     private void Window_PreviewMouseLeftButtonDown(object sender, MouseButtonEventArgs e)
     {
         if (e.OriginalSource is not DependencyObject original) return;
@@ -172,22 +151,10 @@ public partial class MainWindow : Window
         if (form.IsDrawerOpen && !_previewPane.IsClickInsideDrawer(original))
             form.CloseDrawerCommand.Execute(null);
         if (_previewPane.IsClickInsidePreview(original)) return;
-        if (IsDescendantOf(original, SourceList)) return;
-        if (IsDescendantOf(original, ElementsScrollViewer)) return;
+        if (_leftPanel.IsClickInside(original)) return;
         _viewModel.SelectedElement = null;
     }
 
-    private static bool IsDescendantOf(DependencyObject? child, DependencyObject ancestor)
-    {
-        while (child != null && !ReferenceEquals(child, ancestor))
-        {
-            child = child is System.Windows.Media.Visual or System.Windows.Media.Media3D.Visual3D
-                ? VisualTreeHelper.GetParent(child)
-                : LogicalTreeHelper.GetParent(child);
-        }
-        return child != null;
-    }
-
     private void UpdateSelectionOverlay()
     {
         if (!_viewModel.IsEditMode)
@@ -197,249 +164,6 @@ public partial class MainWindow : Window
         }
         var selected = _viewModel.SelectedElement is { } s && Controls.PreviewPane.IsDraggableElement(s);
         _previewPane.UpdateSelectionOverlay(selected);
-        if (selected)
-            OpacityValueText.Text = $"{Math.Round(_viewModel.SelectedElement!.Opacity * 100)}%";
-        TakeSnapshot();
-    }
-
-    private void OnChatMessagesChanged(object? sender, System.Collections.Specialized.NotifyCollectionChangedEventArgs e)
-    {
-        if (e.Action == System.Collections.Specialized.NotifyCollectionChangedAction.Add)
-        {
-            ChatListBox.ScrollIntoView(ChatListBox.Items[^1]);
-        }
-    }
-
-    private void MirrorButton_Click(object sender, RoutedEventArgs e)
-    {
-        if (_viewModel.SelectedElement is WebcamSceneConfig webcam)
-            webcam.IsMirrored = !webcam.IsMirrored;
-    }
-
-    private void ShapeButton_Click(object sender, RoutedEventArgs e)
-    {
-        if (_viewModel.SelectedElement is WebcamSceneConfig webcam)
-            webcam.ToggleClipShape();
-    }
-
-    private void SourceMenu_Remove(object sender, RoutedEventArgs e)
-    {
-        if (sender is MenuItem { DataContext: SceneElement element })
-            _viewModel.RemoveSourceCommand.Execute(element);
-    }
-
-    private void BackgroundMenu_ChangeCapture(object sender, RoutedEventArgs e)
-    {
-        _ = _viewModel.ChangeBackgroundCaptureAsync();
-    }
-
-    private void BackgroundMenu_RefreshCapture(object sender, RoutedEventArgs e)
-    {
-        _viewModel.RefreshBackgroundAutoCapture();
-    }
-
-    private void OpacitySlider_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
-        => OpacityValueText.Text = $"{Math.Round(e.NewValue * 100)}%";
-
-
-    private void SourceNameBox_KeyDown(object sender, KeyEventArgs e)
-    {
-        if (e.Key is Key.Enter or Key.Escape)
-        {
-            CommitSourceEdit(sender);
-            e.Handled = true;
-        }
-    }
-
-    private void SourceNameBox_LostFocus(object sender, RoutedEventArgs e)
-    {
-        CommitSourceEdit(sender);
-    }
-
-    private static void CommitSourceEdit(object sender)
-    {
-        if (sender is FrameworkElement { DataContext: SceneElement element })
-            element.IsEditing = false;
-    }
-
-    // ─── List drag-to-reorder (scenes list + sources list) ───
-    private Point _dragStartPoint;
-    private int _dragIndex = -1;
-    private bool _isDragging;
-    private object? _lastHoveredItem;
-
-    private void List_PreviewMouseLeftButtonDown(object sender, MouseButtonEventArgs e)
-    {
-        var listBox = (ListBox)sender;
-        var item = FindItemContainerAt(listBox, e.GetPosition(listBox));
-        if (item == null)
-        {
-            if (ReferenceEquals(listBox, SourceList))
-                _viewModel.SelectedElement = null;
-            _dragIndex = -1;
-            return;
-        }
-        if (listBox.ItemsSource is not IList items || items.Count == 0)
-        {
-            _dragIndex = -1;
-            return;
-        }
-        _dragIndex = listBox.Items.IndexOf(item.DataContext);
-        _dragStartPoint = e.GetPosition(listBox);
-        _isDragging = false;
-        _lastHoveredItem = null;
-    }
-
-    private void List_PreviewMouseMove(object sender, MouseEventArgs e)
-    {
-        if (_dragIndex < 0) return;
-        var listBox = (ListBox)sender;
-        if (e.LeftButton != MouseButtonState.Pressed || listBox.ItemsSource is not IList items)
-        {
-            EndListDrag(listBox);
-            return;
-        }
-
-        var position = e.GetPosition(listBox);
-        if (!_isDragging)
-        {
-            if (Math.Abs(position.X - _dragStartPoint.X) < SystemParameters.MinimumHorizontalDragDistance &&
-                Math.Abs(position.Y - _dragStartPoint.Y) < SystemParameters.MinimumVerticalDragDistance)
-                return;
-            _isDragging = true;
-            listBox.CaptureMouse();
-        }
-
-        var item = FindItemContainerAt(listBox, position);
-        if (item == null) return;
-
-        var targetItem = item.DataContext;
-        if (ReferenceEquals(targetItem, items[_dragIndex]) || ReferenceEquals(targetItem, _lastHoveredItem))
-            return;
-
-        var targetIndex = listBox.Items.IndexOf(targetItem);
-        if (targetIndex < 0) return;
-
-        var dragged = items[_dragIndex];
-        items.RemoveAt(_dragIndex);
-        items.Insert(targetIndex, dragged);
-        _dragIndex = targetIndex;
-        _lastHoveredItem = targetItem;
-    }
-
-    private void List_PreviewMouseLeftButtonUp(object sender, MouseButtonEventArgs e)
-    {
-        EndListDrag((ListBox)sender);
-    }
-
-    private void EndListDrag(ListBox listBox)
-    {
-        if (_isDragging)
-            listBox.ReleaseMouseCapture();
-        _dragIndex = -1;
-        _isDragging = false;
-        _lastHoveredItem = null;
-    }
-
-    private static ListBoxItem? FindItemContainerAt(ListBox listBox, Point position)
-    {
-        var hit = listBox.InputHitTest(position) as DependencyObject;
-        while (hit != null && hit != listBox)
-        {
-            if (hit is ListBoxItem item) return item;
-            hit = VisualTreeHelper.GetParent(hit);
-        }
-        return null;
-    }
-
-    private Models.SceneElement? _snapshotElement;
-    private string _snapshotBorderColor = string.Empty;
-    private int _snapshotBorderWidth;
-    private int _snapshotTimerMinutes = 15;
-    private string? _snapshotWebUri;
-
-    private void TakeSnapshot()
-    {
-        if (_viewModel.SelectedElement is Models.Source src)
-        {
-            _snapshotElement = src;
-            _snapshotBorderColor = src.BorderColor;
-            _snapshotBorderWidth = src.BorderWidth;
-            _snapshotTimerMinutes = src.TimerMinutes;
-            _snapshotWebUri = src.WebUri;
-        }
-    }
-
-    private void WebcamBorderColorPicker_Click(object sender, RoutedEventArgs e)
-    {
-        if (_viewModel.SelectedElement is not SceneElement src) return;
-        if (sender is FrameworkElement fe && fe.ContextMenu == null)
-        {
-            var menu = new System.Windows.Controls.ContextMenu();
-            string[] colors = ["#FFFFFF", "#000000", "#FF0000", "#00FF00", "#0000FF",
-                               "#FFFF00", "#FF00FF", "#00FFFF", "#FF8800", "#8800FF",
-                               "#e94560", "#22c55e", "#3b82f6", "#f59e0b"];
-            foreach (var c in colors)
-            {
-                var item = new System.Windows.Controls.MenuItem { Header = c, ToolTip = c };
-                var brush = new System.Windows.Media.SolidColorBrush(
-                    (System.Windows.Media.Color)System.Windows.Media.ColorConverter.ConvertFromString(c));
-                item.Icon = new System.Windows.Controls.Border
-                {
-                    Width = 16, Height = 16,
-                    Background = brush,
-                    CornerRadius = new System.Windows.CornerRadius(2)
-                };
-                var color = c;
-                item.Click += (_, _) => src.BorderColor = color;
-                menu.Items.Add(item);
-            }
-            fe.ContextMenu = menu;
-        }
-        if (sender is FrameworkElement fe2)
-            fe2.ContextMenu.IsOpen = true;
-    }
-
-    private void WebcamBorderRevert_Click(object sender, RoutedEventArgs e)
-    {
-        if (_snapshotElement is Models.Source src)
-        {
-            src.BorderColor = _snapshotBorderColor;
-            src.BorderWidth = _snapshotBorderWidth;
-        }
-    }
-
-    private void WebcamBorderAccept_Click(object sender, RoutedEventArgs e)
-    {
-        if (_snapshotElement is Models.Source src)
-        {
-            _snapshotBorderColor = src.BorderColor;
-            _snapshotBorderWidth = src.BorderWidth;
-        }
-    }
-
-    private void CountdownRevert_Click(object sender, RoutedEventArgs e)
-    {
-        if (_snapshotElement is Models.Source src)
-            src.TimerMinutes = _snapshotTimerMinutes;
-    }
-
-    private void CountdownAccept_Click(object sender, RoutedEventArgs e)
-    {
-        if (_snapshotElement is Models.Source src)
-            _snapshotTimerMinutes = src.TimerMinutes;
-    }
-
-    private void WebRevert_Click(object sender, RoutedEventArgs e)
-    {
-        if (_snapshotElement is Models.Source src)
-            src.WebUri = string.Empty;
-        _snapshotWebUri = string.Empty;
-    }
-
-    private void WebAccept_Click(object sender, RoutedEventArgs e)
-    {
-        if (_snapshotElement is Models.Source src)
-            _snapshotWebUri = src.WebUri;
+        _leftPanel.OnSelectionChanged(_viewModel);
     }
 }
diff --git a/ViewModels/index.md b/ViewModels/index.md
index 3e9df15..457c356 100644
--- a/ViewModels/index.md
+++ b/ViewModels/index.md
@@ -58,7 +58,8 @@ Progress (Commit N/12 · tag):
 - [x] **Commit 13 · `refactor-commit-13`** — **HealthBanner** → `Controls/HealthBanner.xaml` (Row 1). Also promoted the 7 value↔visibility converters out of `MainWindow.Window.Resources` into `Themes/Controls.xaml` so extracted controls can resolve them (app-level, not window-level).
 - [x] **Commit 14 · `refactor-commit-14`** — **TopBar** → `Controls/TopBar.xaml(.cs)` (Row 0: logo, REC/ON-AIR pills + signs, avatar, Sign In/Start/End buttons). Avatar fetch moved (async-preserved) into the control; window exposes `_topBar.RefreshAvatar()` invoked on `IsConnected`/`AccountAvatarUrl` changes.
 - [x] **Commit 15 · `refactor-commit-15`** — **PreviewPane** → `Controls/PreviewPane.xaml(.cs)` (Row 1 Col 1 center preview pane). Moved the 1920×1080 canvas (OverlayCanvas/SelectionOverlay/BrandFlashLayer/SocialBarElement), text pull-out, and the live-controls row (TRAX/game/mic meters + sliders + speakers + socials button). Code-behind moved: preview drag/select/resize/hit-test (Preview_Mouse*, HitHandle, HitElement), webcam-context-menu handlers (WebcamMenu_*), social-bar glow (SocialBar_*, SocialsButton_*, SocialGlowTick), audio sliders/speakers (VolumeSlider_*, GameVolumeSlider_*, MicSpeaker_*, GameSpeaker_*, SetSliderValueFromClick, FindParent), TraxButton_*. Window keeps the source-list left panel + thumbnail strip + edit UI, and routes selection-overlay via `_previewPane.UpdateSelectionOverlay(bool)` plus `_previewPane.IsClickInsidePreview/Drawer`. `BackgroundMenu_*` stayed in the window (used by the left-panel source context menu).
-- [x] **Commit 16 · `refactor-commit-16`** — **SceneThumbnailStrip** → `Controls/SceneThumbnailStrip.xaml(.cs)` (Row 0 scene-picker strip). `Thumbnail_MouseLeftButtonDown` moved into the control (transitions via `DataContext.TransitionToScene`). Pending: left scene/chat panel, overlay host.
+- [x] **Commit 16 · `refactor-commit-16`** — **SceneThumbnailStrip** → `Controls/SceneThumbnailStrip.xaml(.cs)` (Row 0 scene-picker strip). `Thumbnail_MouseLeftButtonDown` moved into the control (transitions via `DataContext.TransitionToScene`).
+- [x] **Commit 17 · `refactor-commit-17`** — **LeftPanel** → `Controls/LeftPanel.xaml(.cs)` (Row 1 Col 0 left panel: layers/properties edit UI + live chat list). Moved ALL property-editor and chat handlers: `SourceNameBox_*`/`CommitSourceEdit`, `AddSourceButton_Click`, `OnChatMessagesChanged` (now self-subscribed on Loaded), `MirrorButton_Click`, `ShapeButton_Click`, `SourceMenu_Remove`, `BackgroundMenu_*`, `OpacitySlider_ValueChanged`, list drag-to-reorder (`_dragStartPoint`+`List_Preview*`+`EndListDrag`+`FindItemContainerAt`), and the snapshot family (`TakeSnapshot`, `WebcamBorder*`, `Countdown*`, `Web*`). Window exposes via `_leftPanel.IsClickInside(original)` (deselect guard) and `_leftPanel.OnSelectionChanged(vm)` (opacity label + snapshot). Pending: overlay host region.
 
 The partial `.cs` files land next to `MainViewModel.cs` in this folder as the split
 proceeds; each partial carries its own `using`s and re-declares nothing from core.
\ No newline at end of file