diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
index d1c31e1..8919d86 100644
--- a/.github/workflows/ci.yml
+++ b/.github/workflows/ci.yml
@@ -87,6 +87,9 @@ jobs:
         with:
           python-version: '3.12'
 
+      - name: Tokens visuais (web e Windows) gerados de tools/tokens.json
+        run: python3 tools/generate-tokens.py --check
+
       - name: Dependências do E2E (pyftpdlib, 7-Zip com RAR)
         run: |
           pip install pyftpdlib
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 78ff738..0a85da6 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -11,6 +11,21 @@ All notable changes to Ferry are documented here. The format follows [Keep a Cha
 
 ## [Unreleased]
 
+### Changed
+
+- Redesigned interface (web and Windows), keeping the dark identity: the **Queue** is now grouped into *Needs you* (error, PKG uploaded, check on PS5, pending password), *Sending*, *Queued* and *Finished* (collapsed by default, with **Clear finished** in the group header). Idle cards are compact and only show numbers that mean something; the active card keeps %, MB/s and time remaining.
+- Queue header with overall progress and the estimated finish time (only when every item has a known size).
+- PS5 status moved from the sidebar footer to a badge at the top of every page.
+- **Settings** split into sections with an index that follows scrolling (PS5, Destinations, Transfer, Passwords, Notifications, General; on Windows also Power). A single scroll with the scrollbar at the window edge; the passwords box grows with its content instead of scrolling on its own in the middle of the screen.
+- Mobile: brand and tabs on one line, compact cards and a fixed **Add files** button at the bottom.
+- Colors and sizes come from one file (`tools/tokens.json`) for web and Windows; CI flags drift.
+
+### Fixed
+
+- Web: repeated password requests for the same game (e.g. after a wrong password) stacked identical notices; the existing notice is now refreshed. Error and PKG notices get **View**, which jumps to the card.
+- Web: long Windows paths were shown with the `\\?\` prefix; they are now shown without it (the saved value is unchanged).
+- Web: the queue rewrote every card on each update; now only changed cards are (≈6× faster with 200 games).
+
 ## [1.6.2-beta.1] - 2026-10-07
 
 ### Added
diff --git a/CHANGELOG.pt-BR.md b/CHANGELOG.pt-BR.md
index e2b5aec..1d62a42 100644
--- a/CHANGELOG.pt-BR.md
+++ b/CHANGELOG.pt-BR.md
@@ -11,6 +11,21 @@ Todas as mudanças relevantes do Ferry ficam aqui. O formato segue o [Keep a Cha
 
 ## [Não lançado]
 
+### Alterado
+
+- Interface redesenhada (web e Windows), mantendo a identidade escura: a **Fila** agora é agrupada em *Precisa de você* (erro, PKG enviado, verifique no PS5, senha pendente), *Enviando*, *Na fila* e *Concluídos* (recolhido por padrão, com **Limpar concluídos** no cabeçalho do grupo). Cartões parados ficam compactos e só mostram números que dizem algo; o ativo mantém %, MB/s e tempo restante.
+- Cabeçalho da Fila com o progresso total e o horário previsto de término (só quando todos os itens têm tamanho conhecido).
+- Status do PS5 saiu do rodapé da barra lateral e virou um selo no topo de todas as páginas.
+- **Configurações** em seções com índice que acompanha a rolagem (PS5, Destinos, Envio, Senhas, Avisos, Geral; no Windows também Energia). Uma rolagem só, com a barra na borda da janela; a caixa de senhas cresce com o conteúdo em vez de rolar sozinha no meio da tela.
+- Celular: marca e abas numa linha, cartões compactos e botão **Adicionar arquivos** fixo no rodapé.
+- Cores e medidas vêm de um arquivo só (`tools/tokens.json`) para web e Windows; a CI acusa divergência.
+
+### Corrigido
+
+- Web: pedidos repetidos de senha para o mesmo jogo (ex.: depois de uma senha incorreta) empilhavam avisos iguais; agora o aviso existente é renovado. Avisos de erro e de PKG ganham **Ver**, que leva ao cartão.
+- Web: caminhos longos do Windows apareciam com o prefixo `\\?\`; agora aparecem sem ele (o valor salvo não muda).
+- Web: a fila reescrevia todos os cartões a cada atualização; agora só os que mudaram (≈6× mais rápido com 200 jogos).
+
 ## [1.6.2-beta.1] - 2026-10-07
 
 ### Adicionado
diff --git a/README.es.md b/README.es.md
index e0ef743..cf736b5 100644
--- a/README.es.md
+++ b/README.es.md
@@ -62,7 +62,7 @@ Abre `http://<ip-del-servidor>:8021`. La primera vez, la página pide crear el u
 ## Cómo usar
 
 1. Ejecuta un payload de FTP en la PS5 (**ftpsrv**, puerto 2121, o el FTP de **etaHEN**, puerto 1337).
-2. Abre la app → **Configurações** (Ajustes): IP de la PS5, puerto, destino (**M.2** `/mnt/ext1/homebrew` o **SSD interno** `/data/homebrew`). Todo se guarda solo. El pie de la barra lateral muestra si la PS5 está en línea.
+2. Abre la app → **Configurações** (Ajustes): IP de la PS5, puerto, destino (**M.2** `/mnt/ext1/homebrew` o **SSD interno** `/data/homebrew`). Todo se guarda solo. El sello en la parte superior de cada página muestra si la PS5 está en línea.
 3. En **Fila** (Cola), haz clic en el centro de la pantalla (abre el selector de archivos) o arrastra los archivos a la ventana. Selecciona **todas las partes** a la vez.
 4. Listo: cuando estén todas las partes, el juego se extrae y se envía a `<destino>/<carpeta del juego>`.
 
diff --git a/README.md b/README.md
index 42f56a8..70ba31f 100644
--- a/README.md
+++ b/README.md
@@ -62,7 +62,7 @@ Open `http://<server-ip>:8021`. On first open the page asks you to create a user
 ## How to use
 
 1. Run an FTP payload on the PS5 (**ftpsrv**, port 2121, or **etaHEN**'s FTP, port 1337).
-2. Open **Settings**: PS5 IP, port, destination (**M.2** `/mnt/ext1/homebrew` or **internal SSD** `/data/homebrew`). Everything saves automatically. The bottom of the sidebar shows whether the PS5 is online.
+2. Open **Settings**: PS5 IP, port, destination (**M.2** `/mnt/ext1/homebrew` or **internal SSD** `/data/homebrew`). Everything saves automatically. The badge at the top of every page shows whether the PS5 is online.
 3. In **Queue**, click the middle of the screen (opens the file picker) or drag the files onto the window. Select **all parts** at once.
 4. Done: once every part is present, the game is extracted and sent to `<destination>/<game folder>`.
 
diff --git a/README.pt-BR.md b/README.pt-BR.md
index 5552da7..abb7ead 100644
--- a/README.pt-BR.md
+++ b/README.pt-BR.md
@@ -62,7 +62,7 @@ Abra `http://<ip-do-servidor>:8021`. Na primeira abertura a página pede para cr
 ## Como usar
 
 1. Rode o payload de FTP no PS5 (**ftpsrv**, porta 2121, ou o FTP do **etaHEN**, porta 1337).
-2. Abra o app → **Configurações**: IP do PS5, porta, destino (**M.2** `/mnt/ext1/homebrew` ou **SSD interno** `/data/homebrew`). Tudo salva sozinho. O pé da barra lateral mostra se o PS5 está online.
+2. Abra o app → **Configurações**: IP do PS5, porta, destino (**M.2** `/mnt/ext1/homebrew` ou **SSD interno** `/data/homebrew`). Tudo salva sozinho. O selo no topo de todas as páginas mostra se o PS5 está online.
 3. Na **Fila**, clique no centro da tela (abre o seletor do Windows) ou arraste os arquivos para a janela. Selecione **todas as partes** de uma vez.
 4. Pronto: quando todas as partes estiverem presentes, o jogo é extraído e enviado para `<destino>/<pasta do jogo>`.
 
diff --git a/app/App.xaml b/app/App.xaml
index 3cd719a..86cea27 100644
--- a/app/App.xaml
+++ b/app/App.xaml
@@ -1,29 +1,50 @@
 <Application x:Class="Ferry.App"
              xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
              xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+             xmlns:sys="clr-namespace:System;assembly=mscorlib"
+             xmlns:local="clr-namespace:Ferry"
              ThemeMode="Dark"
              StartupUri="MainWindow.xaml">
     <Application.Resources>
         <!-- "PlayStation noir": preto-azulado, quase monocromático, um acento (azul). Verde/vermelho/âmbar só para estado. -->
-        <Color x:Key="AccentColor">#6F97FF</Color>
+        <!-- tokens:start (gerado por tools/generate-tokens.py a partir de tools/tokens.json; não editar à mão) -->
+        <Color x:Key="BgColor">#0A0D12</Color>
+        <Color x:Key="SideColor">#0D1117</Color>
+        <Color x:Key="HoverColor">#0F141B</Color>
+        <Color x:Key="FieldColor">#121821</Color>
+        <Color x:Key="LineColor">#1B222D</Color>
+        <Color x:Key="Line2Color">#29323F</Color>
         <Color x:Key="TextColor">#E9EDF3</Color>
         <Color x:Key="Text2Color">#A9B3C2</Color>
+        <Color x:Key="MutedColor">#8490A2</Color>
+        <Color x:Key="IdleColor">#4A5363</Color>
+        <Color x:Key="AccentColor">#6F97FF</Color>
+        <Color x:Key="AccentTextColor">#9DB8FF</Color>
         <Color x:Key="GreenColor">#4ADE80</Color>
         <Color x:Key="RedColor">#FF7A7A</Color>
         <Color x:Key="AmberColor">#F2B84B</Color>
-        <SolidColorBrush x:Key="Bg" Color="#0A0D12"/>
-        <SolidColorBrush x:Key="Side" Color="#0D1117"/>
-        <SolidColorBrush x:Key="Hover" Color="#0F141B"/>
-        <SolidColorBrush x:Key="Line" Color="#1B222D"/>
-        <SolidColorBrush x:Key="Line2" Color="#29323F"/>
+        <SolidColorBrush x:Key="Bg" Color="{StaticResource BgColor}"/>
+        <SolidColorBrush x:Key="Side" Color="{StaticResource SideColor}"/>
+        <SolidColorBrush x:Key="Hover" Color="{StaticResource HoverColor}"/>
+        <SolidColorBrush x:Key="Field" Color="{StaticResource FieldColor}"/>
+        <SolidColorBrush x:Key="Line" Color="{StaticResource LineColor}"/>
+        <SolidColorBrush x:Key="Line2" Color="{StaticResource Line2Color}"/>
         <SolidColorBrush x:Key="Text" Color="{StaticResource TextColor}"/>
         <SolidColorBrush x:Key="Text2" Color="{StaticResource Text2Color}"/>
-        <SolidColorBrush x:Key="Muted" Color="#8490A2"/>
+        <SolidColorBrush x:Key="Muted" Color="{StaticResource MutedColor}"/>
+        <SolidColorBrush x:Key="Idle" Color="{StaticResource IdleColor}"/>
         <SolidColorBrush x:Key="Accent" Color="{StaticResource AccentColor}"/>
-        <SolidColorBrush x:Key="AccentText" Color="#9DB8FF"/>
+        <SolidColorBrush x:Key="AccentText" Color="{StaticResource AccentTextColor}"/>
         <SolidColorBrush x:Key="Green" Color="{StaticResource GreenColor}"/>
         <SolidColorBrush x:Key="Red" Color="{StaticResource RedColor}"/>
         <SolidColorBrush x:Key="Amber" Color="{StaticResource AmberColor}"/>
+        <sys:Double x:Key="PageTitleSize">34</sys:Double>
+        <sys:Double x:Key="JobTitleSize">22</sys:Double>
+        <sys:Double x:Key="JobTitleActiveSize">26</sys:Double>
+        <sys:Double x:Key="StatSize">28</sys:Double>
+        <sys:Double x:Key="LabelSize">13</sys:Double>
+        <sys:Double x:Key="RadiusSize">6</sys:Double>
+        <!-- tokens:end -->
 
         <!-- controles Fluent (slider, checkbox, foco da caixa de texto) no acento do Ferry, não no do Windows -->
         <Color x:Key="SystemAccentColor">#6F97FF</Color>
@@ -47,6 +68,8 @@
         <FontFamily x:Key="ContentControlThemeFontFamily">pack://application:,,,/Ferry;component/fonts/#Geist</FontFamily>
         <FontFamily x:Key="Icons">Segoe Fluent Icons, Segoe MDL2 Assets</FontFamily>
         <BooleanToVisibilityConverter x:Key="Vis"/>
+        <local:JobGroupConverter x:Key="JobGroup"/>
+        <local:GroupTitleConverter x:Key="GroupTitleText"/>
 
         <!-- foco do teclado: contorno claro, visível no fundo escuro -->
         <Style x:Key="Focus">
@@ -210,16 +233,50 @@
             </Setter>
         </Style>
 
+        <!-- título de seção das Configurações -->
         <Style x:Key="GroupTitle" TargetType="TextBlock">
-            <Setter Property="FontSize" Value="13"/>
+            <Setter Property="FontSize" Value="22"/>
             <Setter Property="FontWeight" Value="SemiBold"/>
             <Setter Property="Foreground" Value="{StaticResource Text}"/>
-            <Setter Property="Margin" Value="0,0,0,12"/>
+            <Setter Property="Margin" Value="0,0,0,16"/>
+        </Style>
+        <!-- subgrupo dentro da seção: versalete discreto -->
+        <Style x:Key="SubTitle" TargetType="TextBlock">
+            <Setter Property="FontSize" Value="12"/>
+            <Setter Property="FontWeight" Value="SemiBold"/>
+            <Setter Property="Typography.Capitals" Value="AllSmallCaps"/>
+            <Setter Property="Foreground" Value="{StaticResource Text2}"/>
+            <Setter Property="Margin" Value="0,0,0,10"/>
         </Style>
         <Style x:Key="Group" TargetType="Border">
             <Setter Property="BorderBrush" Value="{StaticResource Line}"/>
             <Setter Property="BorderThickness" Value="0,0,0,1"/>
-            <Setter Property="Padding" Value="0,16"/>
+            <Setter Property="Padding" Value="0,28"/>
+        </Style>
+
+        <!-- índice das Configurações: fio à esquerda; a seção visível ganha o acento -->
+        <Style x:Key="SectionItem" TargetType="RadioButton">
+            <Setter Property="Foreground" Value="{StaticResource Muted}"/>
+            <Setter Property="FontSize" Value="14"/>
+            <Setter Property="Cursor" Value="Hand"/>
+            <Setter Property="FocusVisualStyle" Value="{StaticResource Focus}"/>
+            <Setter Property="Template">
+                <Setter.Value>
+                    <ControlTemplate TargetType="RadioButton">
+                        <Border x:Name="Bd" Background="Transparent" BorderBrush="{StaticResource Line}" BorderThickness="2,0,0,0" Padding="12,8">
+                            <ContentPresenter VerticalAlignment="Center"/>
+                        </Border>
+                        <ControlTemplate.Triggers>
+                            <Trigger Property="IsMouseOver" Value="True"><Setter Property="Foreground" Value="{StaticResource Text2}"/></Trigger>
+                            <Trigger Property="IsChecked" Value="True">
+                                <Setter TargetName="Bd" Property="BorderBrush" Value="{StaticResource Accent}"/>
+                                <Setter Property="Foreground" Value="{StaticResource Text}"/>
+                                <Setter Property="FontWeight" Value="SemiBold"/>
+                            </Trigger>
+                        </ControlTemplate.Triggers>
+                    </ControlTemplate>
+                </Setter.Value>
+            </Setter>
         </Style>
         <Style x:Key="Label" TargetType="TextBlock">
             <Setter Property="Foreground" Value="{StaticResource Muted}"/>
diff --git a/app/MainWindow.xaml b/app/MainWindow.xaml
index acea091..3f5fc23 100644
--- a/app/MainWindow.xaml
+++ b/app/MainWindow.xaml
@@ -24,27 +24,6 @@
                     <TextBlock Text="{text:Loc ui.tagline}" FontSize="11" Foreground="{StaticResource Muted}" Margin="52,0,0,0"/>
                 </StackPanel>
 
-                <!-- status do PS5: texto, sem cartão -->
-                <StackPanel DockPanel.Dock="Bottom">
-                    <StackPanel Orientation="Horizontal">
-                        <Ellipse x:Name="StatusDot" Width="7" Height="7" Fill="{StaticResource Muted}" VerticalAlignment="Center"/>
-                        <TextBlock x:Name="StatusTitle" Text="{text:Loc ui.untested}" FontWeight="SemiBold" Margin="8,0,0,0"/>
-                    </StackPanel>
-                    <TextBlock x:Name="StatusHost" FontSize="17" FontWeight="SemiBold" Margin="0,8,0,0" TextTrimming="CharacterEllipsis"/>
-                    <TextBlock x:Name="StatusDest" Foreground="{StaticResource Muted}" FontSize="12.5" Margin="0,2,0,0" TextTrimming="CharacterEllipsis"/>
-                    <!-- PS5 achado na rede: só oferece, nunca troca sozinho -->
-                    <Border x:Name="FoundBar" Visibility="Collapsed" BorderBrush="{StaticResource Accent}" BorderThickness="1" CornerRadius="4" Padding="12" Margin="0,14,0,0">
-                        <StackPanel>
-                            <TextBlock x:Name="FoundText" FontSize="12.5" Foreground="{StaticResource Text}" TextWrapping="Wrap"/>
-                            <StackPanel Orientation="Horizontal" Margin="0,10,0,0">
-                                <Button Content="{text:Loc ui.useFound}" Style="{StaticResource Primary}" Height="30" Padding="12,0" Click="OnUseFound"/>
-                                <Button Content="{text:Loc ui.ignore}" Style="{StaticResource LinkBtn}" Margin="14,0,0,0" VerticalAlignment="Center" Click="OnDismissFound"/>
-                            </StackPanel>
-                        </StackPanel>
-                    </Border>
-                    <Button x:Name="SideTestBtn" Content="{text:Loc ui.test}" Style="{StaticResource LinkBtn}" Margin="0,12,0,0" Click="OnTest"/>
-                </StackPanel>
-
                 <StackPanel Margin="0,40,0,0">
                     <RadioButton x:Name="NavQueue" Style="{StaticResource NavItem}" GroupName="nav" IsChecked="True" Checked="OnNav">
                         <DockPanel>
@@ -61,13 +40,33 @@
         </Border>
 
         <!-- ============ CONTEÚDO ============ -->
-        <Grid Grid.Column="1" Margin="32,26,32,20">
+        <Grid Grid.Column="1" Margin="32,12,32,20">
             <Grid.RowDefinitions>
+                <RowDefinition Height="Auto"/>
                 <RowDefinition Height="Auto"/>
                 <RowDefinition Height="*"/>
             </Grid.RowDefinitions>
+            <!-- status do PS5 no topo de todas as páginas (e o PS5 achado na rede: só oferece, nunca troca sozinho) -->
+            <StackPanel Orientation="Horizontal" HorizontalAlignment="Right" Margin="0,0,0,8">
+                <Border x:Name="FoundBar" Visibility="Collapsed" BorderBrush="{StaticResource Accent}" BorderThickness="1" CornerRadius="16" Padding="14,4,6,4" Margin="0,0,12,0">
+                    <StackPanel Orientation="Horizontal">
+                        <TextBlock x:Name="FoundText" FontSize="12.5" Foreground="{StaticResource Text}" VerticalAlignment="Center"/>
+                        <Button Content="{text:Loc ui.useFound}" Style="{StaticResource Primary}" Height="26" Padding="10,0" Margin="12,0,0,0" Click="OnUseFound"/>
+                        <Button Content="{text:Loc ui.ignore}" Style="{StaticResource LinkBtn}" Margin="12,0,8,0" VerticalAlignment="Center" Click="OnDismissFound"/>
+                    </StackPanel>
+                </Border>
+                <Border BorderBrush="{StaticResource Line}" BorderThickness="1" CornerRadius="16" Padding="12,6" AutomationProperties.LiveSetting="Polite">
+                    <StackPanel Orientation="Horizontal">
+                        <Ellipse x:Name="StatusDot" Width="8" Height="8" Fill="{StaticResource Idle}" VerticalAlignment="Center"/>
+                        <TextBlock x:Name="StatusTitle" Text="{text:Loc ui.untested}" FontWeight="SemiBold" FontSize="12.5" Margin="8,0,0,0" VerticalAlignment="Center"/>
+                        <TextBlock x:Name="StatusHost" FontWeight="SemiBold" FontSize="12.5" Margin="10,0,0,0" VerticalAlignment="Center"/>
+                        <TextBlock x:Name="StatusDest" Foreground="{StaticResource Muted}" FontSize="12.5" Margin="10,0,0,0" MaxWidth="220" TextTrimming="CharacterEllipsis" VerticalAlignment="Center"/>
+                        <Button x:Name="SideTestBtn" Content="{text:Loc ui.test}" Style="{StaticResource LinkBtn}" Margin="12,0,0,0" VerticalAlignment="Center" Click="OnTest"/>
+                    </StackPanel>
+                </Border>
+            </StackPanel>
             <!-- aviso de desligamento armado: só aparece enquanto o desligamento está armado -->
-            <Border x:Name="PowerBanner" Visibility="Collapsed" BorderBrush="{StaticResource Accent}" BorderThickness="1" CornerRadius="4" Padding="14,10" Margin="0,0,0,18">
+            <Border x:Name="PowerBanner" Grid.Row="1" Visibility="Collapsed" BorderBrush="{StaticResource Accent}" BorderThickness="1" CornerRadius="4" Padding="14,10" Margin="0,0,0,18">
                 <DockPanel>
                     <Button x:Name="CancelShutdownBtn" DockPanel.Dock="Right" Content="{text:Loc app.cancelShutdown}" Style="{StaticResource Btn}"
                             Click="OnCancelShutdown" Margin="12,0,0,0" AutomationProperties.Name="{text:Loc app.cancelShutdown}"/>
@@ -76,13 +75,20 @@
             </Border>
 
             <!-- == FILA == -->
-            <Grid x:Name="QueuePage" Grid.Row="1">
+            <Grid x:Name="QueuePage" Grid.Row="2">
                 <Grid.RowDefinitions>
                     <RowDefinition Height="Auto"/>
                     <RowDefinition Height="*"/>
                 </Grid.RowDefinitions>
                 <Border BorderBrush="{StaticResource Line2}" BorderThickness="0,0,0,1" Padding="0,0,0,18">
                     <DockPanel>
+                        <!-- progresso da fila inteira (itens enviando e na fila) e término previsto -->
+                        <DockPanel x:Name="OverallPanel" DockPanel.Dock="Bottom" Margin="0,16,0,0" Visibility="Collapsed">
+                            <TextBlock DockPanel.Dock="Right" FontSize="13" Foreground="{StaticResource Text2}" Margin="16,0,0,0" VerticalAlignment="Center">
+                                <Run x:Name="OverallAmount"/><Run x:Name="OverallEta"/>
+                            </TextBlock>
+                            <ProgressBar x:Name="OverallBar" Height="4" Maximum="100" Background="{StaticResource Line}" Foreground="{StaticResource Accent}" BorderThickness="0" VerticalAlignment="Center" IsTabStop="False"/>
+                        </DockPanel>
                         <StackPanel DockPanel.Dock="Right" Orientation="Horizontal" VerticalAlignment="Bottom">
                             <!-- velocidade total agora -->
                             <StackPanel x:Name="SpeedPill" Margin="0,0,24,0" Visibility="Collapsed" VerticalAlignment="Bottom">
@@ -91,7 +97,6 @@
                                 </TextBlock>
                                 <TextBlock Text="{text:Loc ui.totalNow}" FontSize="12" Foreground="{StaticResource Muted}" HorizontalAlignment="Right" Margin="0,4,0,0"/>
                             </StackPanel>
-                            <Button x:Name="ClearBtn" Content="{text:Loc ui.clearDone}" Style="{StaticResource Btn}" Margin="0,0,8,0" Click="OnClearFinished" Visibility="Collapsed"/>
                             <Button Style="{StaticResource Primary}" Click="OnPickFiles">
                                 <StackPanel Orientation="Horizontal">
                                     <TextBlock Text="&#xE710;" FontFamily="{StaticResource Icons}" FontSize="12" VerticalAlignment="Center"/>
@@ -100,7 +105,7 @@
                             </Button>
                         </StackPanel>
                         <StackPanel VerticalAlignment="Bottom">
-                            <TextBlock Text="{text:Loc ui.queue}" FontSize="34" FontWeight="SemiBold" LineHeight="34" LineStackingStrategy="BlockLineHeight"/>
+                            <TextBlock Text="{text:Loc ui.queue}" FontSize="{StaticResource PageTitleSize}" FontWeight="SemiBold" LineHeight="34" LineStackingStrategy="BlockLineHeight"/>
                             <TextBlock x:Name="SummaryText" Foreground="{StaticResource Muted}" FontSize="13" Margin="0,8,0,0" Text="{text:Loc ui.emptyQueue}"/>
                         </StackPanel>
                     </DockPanel>
@@ -121,14 +126,97 @@
                     </StackPanel>
                 </Grid>
 
-                <ScrollViewer Grid.Row="1" VerticalScrollBarVisibility="Auto" Focusable="False">
-                    <ItemsControl x:Name="JobList" Focusable="False">
+                <ScrollViewer Grid.Row="1" Margin="0,0,-32,-20" Padding="0,0,32,20" VerticalScrollBarVisibility="Auto" Focusable="False">
+                    <ItemsControl x:Name="JobList" Focusable="False" ButtonBase.Click="OnQueueButton">
+                        <!-- grupos: Precisa de você → Enviando → Na fila → Concluídos (recolhido por padrão) -->
+                        <ItemsControl.GroupStyle>
+                            <GroupStyle>
+                                <GroupStyle.ContainerStyle>
+                                    <Style TargetType="GroupItem">
+                                        <Setter Property="Margin" Value="0,18,0,0"/>
+                                        <Setter Property="Template">
+                                            <Setter.Value>
+                                                <ControlTemplate TargetType="GroupItem">
+                                                    <StackPanel>
+                                                        <Border BorderBrush="{StaticResource Line}" BorderThickness="0,0,0,1" Padding="0,0,0,8">
+                                                            <StackPanel Orientation="Horizontal">
+                                                                <TextBlock x:Name="GroupTitle" FontSize="12" FontWeight="SemiBold" Foreground="{StaticResource Text2}">
+                                                                    <TextBlock.Text>
+                                                                        <MultiBinding Converter="{StaticResource GroupTitleText}">
+                                                                            <Binding Path="Name"/>
+                                                                            <Binding Path="Locale" Source="{x:Static text:WpfText.Current}"/>
+                                                                        </MultiBinding>
+                                                                    </TextBlock.Text>
+                                                                </TextBlock>
+                                                                <TextBlock Text="{Binding ItemCount}" FontSize="12" Foreground="{StaticResource Muted}" Margin="10,0,0,0"/>
+                                                            </StackPanel>
+                                                        </Border>
+                                                        <ItemsPresenter/>
+                                                    </StackPanel>
+                                                    <ControlTemplate.Triggers>
+                                                        <DataTrigger Binding="{Binding Name}" Value="attention">
+                                                            <Setter TargetName="GroupTitle" Property="Foreground" Value="{StaticResource Amber}"/>
+                                                        </DataTrigger>
+                                                    </ControlTemplate.Triggers>
+                                                </ControlTemplate>
+                                            </Setter.Value>
+                                        </Setter>
+                                        <Style.Triggers>
+                                            <DataTrigger Binding="{Binding Name}" Value="done">
+                                                <Setter Property="Template">
+                                                    <Setter.Value>
+                                                        <ControlTemplate TargetType="GroupItem">
+                                                            <StackPanel>
+                                                                <Border BorderBrush="{StaticResource Line}" BorderThickness="0,0,0,1" Padding="0,0,0,6">
+                                                                    <DockPanel>
+                                                                        <Button DockPanel.Dock="Right" Content="{text:Loc ui.clearDone}" Style="{StaticResource LinkBtn}" VerticalAlignment="Center" Tag="clear-finished"/>
+                                                                        <ToggleButton x:Name="DoneToggle" HorizontalAlignment="Left" Cursor="Hand" FocusVisualStyle="{StaticResource Focus}"
+                                                                                      IsChecked="{Binding DoneExpanded, Source={x:Static text:QueueGroups.Current}, Mode=TwoWay}"
+                                                                                      AutomationProperties.Name="{text:Loc ui.group.done}">
+                                                                            <ToggleButton.Template>
+                                                                                <ControlTemplate TargetType="ToggleButton">
+                                                                                    <StackPanel Orientation="Horizontal" Background="Transparent">
+                                                                                        <TextBlock x:Name="Chevron" Text="&#xE76C;" FontFamily="{StaticResource Icons}" FontSize="10" Foreground="{StaticResource Muted}" VerticalAlignment="Center" RenderTransformOrigin="0.5,0.5">
+                                                                                            <TextBlock.RenderTransform><RotateTransform Angle="0"/></TextBlock.RenderTransform>
+                                                                                        </TextBlock>
+                                                                                        <ContentPresenter Margin="8,0,0,0" VerticalAlignment="Center"/>
+                                                                                    </StackPanel>
+                                                                                    <ControlTemplate.Triggers>
+                                                                                        <Trigger Property="IsChecked" Value="True"><Setter TargetName="Chevron" Property="RenderTransform"><Setter.Value><RotateTransform Angle="90"/></Setter.Value></Setter></Trigger>
+                                                                                    </ControlTemplate.Triggers>
+                                                                                </ControlTemplate>
+                                                                            </ToggleButton.Template>
+                                                                            <StackPanel Orientation="Horizontal">
+                                                                                <TextBlock FontSize="12" FontWeight="SemiBold" Foreground="{StaticResource Text2}">
+                                                                                    <TextBlock.Text>
+                                                                                        <MultiBinding Converter="{StaticResource GroupTitleText}">
+                                                                                            <Binding Path="Name"/>
+                                                                                            <Binding Path="Locale" Source="{x:Static text:WpfText.Current}"/>
+                                                                                        </MultiBinding>
+                                                                                    </TextBlock.Text>
+                                                                                </TextBlock>
+                                                                                <TextBlock Text="{Binding ItemCount}" FontSize="12" Foreground="{StaticResource Muted}" Margin="10,0,0,0"/>
+                                                                            </StackPanel>
+                                                                        </ToggleButton>
+                                                                    </DockPanel>
+                                                                </Border>
+                                                                <ItemsPresenter Visibility="{Binding DoneExpanded, Source={x:Static text:QueueGroups.Current}, Converter={StaticResource Vis}}"/>
+                                                            </StackPanel>
+                                                        </ControlTemplate>
+                                                    </Setter.Value>
+                                                </Setter>
+                                            </DataTrigger>
+                                        </Style.Triggers>
+                                    </Style>
+                                </GroupStyle.ContainerStyle>
+                            </GroupStyle>
+                        </ItemsControl.GroupStyle>
                         <ItemsControl.ItemTemplate>
                             <DataTemplate DataType="{x:Type local:Job}">
                                 <Border x:Name="Row" Background="Transparent" BorderBrush="{StaticResource Line}" BorderThickness="0,0,0,1" Padding="0,18,4,8">
                                     <Grid>
                                         <Grid.ColumnDefinitions>
-                                            <ColumnDefinition Width="88"/>
+                                            <ColumnDefinition Width="Auto"/>
                                             <ColumnDefinition Width="*"/>
                                             <ColumnDefinition Width="96"/>
                                             <ColumnDefinition Width="104"/>
@@ -140,13 +228,16 @@
                                             <RowDefinition Height="Auto"/>
                                         </Grid.RowDefinitions>
 
-                                        <!-- capa (sem capa, o nome do arquivo ocupa o lugar dela em tipografia grande) -->
+                                        <!-- precisa de você: fio na cor do estado à esquerda -->
+                                        <Rectangle x:Name="Mark" Grid.RowSpan="2" Width="2" HorizontalAlignment="Left" Margin="-14,0,0,0" Visibility="Collapsed"
+                                                   Fill="{Binding Foreground, ElementName=Bar}"/>
+                                        <!-- capa (sem capa, o título ocupa o lugar dela) -->
                                         <Image x:Name="Cover" Width="88" Height="88" Stretch="UniformToFill" VerticalAlignment="Top" Source="{Binding Icon}">
                                             <Image.Clip><RectangleGeometry Rect="0,0,88,88" RadiusX="3" RadiusY="3"/></Image.Clip>
                                         </Image>
 
                                         <StackPanel x:Name="Info" Grid.Column="1" Margin="20,0,16,0" VerticalAlignment="Center">
-                                            <TextBlock x:Name="TitleText" FontSize="22" FontWeight="SemiBold" TextTrimming="CharacterEllipsis">
+                                            <TextBlock x:Name="TitleText" FontSize="{StaticResource JobTitleSize}" FontWeight="SemiBold" TextTrimming="CharacterEllipsis">
                                                 <TextBlock.Style>
                                                     <Style TargetType="TextBlock">
                                                         <Setter Property="Text" Value="{Binding Title}"/>
@@ -157,6 +248,8 @@
                                                 </TextBlock.Style>
                                             </TextBlock>
                                             <WrapPanel Margin="0,5,0,0">
+                                                <!-- estado como etiqueta: ponto na cor da travessia + texto -->
+                                                <Ellipse x:Name="StageDot" Width="7" Height="7" Margin="0,0,7,0" VerticalAlignment="Center" Fill="{Binding Foreground, ElementName=Bar}"/>
                                                 <TextBlock x:Name="StageLbl" Text="{text:JobText Stage}" FontSize="12.5" FontWeight="SemiBold" Foreground="{StaticResource Text2}" Margin="0,0,14,0"/>
                                                 <TextBlock x:Name="IdLbl" Text="{Binding TitleId}" FontSize="12.5" Foreground="{StaticResource Muted}" Margin="0,0,14,0"/>
                                                 <TextBlock Text="{Binding Package.Format}" FontSize="12.5" Foreground="{StaticResource Muted}" Margin="0,0,14,0"/>
@@ -191,7 +284,14 @@
                                         <StackPanel Grid.Column="5" Orientation="Horizontal" VerticalAlignment="Center" Margin="16,0,0,0">
                                             <Button Style="{StaticResource IconButton}" Content="&#xE769;" ToolTip="{text:Loc ui.pause}" AutomationProperties.Name="{text:Loc ui.pause}" Click="OnPause" Visibility="{Binding CanPause, Converter={StaticResource Vis}}"/>
                                             <Button Style="{StaticResource IconButton}" Content="&#xE768;" ToolTip="{text:Loc ui.resume}" AutomationProperties.Name="{text:Loc ui.resume}" Click="OnResume" Visibility="{Binding CanResume, Converter={StaticResource Vis}}"/>
-                                            <Button Style="{StaticResource IconButton}" Content="&#xE72C;" ToolTip="{text:Loc ui.retryHint}" AutomationProperties.Name="{text:Loc ui.retry}" Click="OnRetry" Foreground="{StaticResource Text}" Visibility="{Binding CanRetry, Converter={StaticResource Vis}}"/>
+                                            <Button x:Name="RetryIconBtn" Style="{StaticResource IconButton}" Content="&#xE72C;" ToolTip="{text:Loc ui.retryHint}" AutomationProperties.Name="{text:Loc ui.retry}" Click="OnRetry" Foreground="{StaticResource Text}" Visibility="{Binding CanRetry, Converter={StaticResource Vis}}"/>
+                                            <!-- com erro, "Tentar de novo" é a ação principal, com texto -->
+                                            <Button x:Name="RetryTextBtn" Style="{StaticResource Btn}" ToolTip="{text:Loc ui.retryHint}" Click="OnRetry" Margin="0,0,6,0" Visibility="Collapsed">
+                                                <StackPanel Orientation="Horizontal">
+                                                    <TextBlock Text="&#xE72C;" FontFamily="{StaticResource Icons}" FontSize="12" VerticalAlignment="Center"/>
+                                                    <TextBlock Text="{text:Loc ui.retry}" Margin="8,0,0,0"/>
+                                                </StackPanel>
+                                            </Button>
                                             <Button Style="{StaticResource IconButton}" Content="&#xE711;" ToolTip="{text:Loc ui.cancel}" AutomationProperties.Name="{text:Loc ui.cancel}" Click="OnCancel" Visibility="{Binding CanCancel, Converter={StaticResource Vis}}"/>
                                             <Button Style="{StaticResource IconButton}" Content="&#xE74D;" ToolTip="{text:Loc ui.remove}" AutomationProperties.Name="{text:Loc ui.remove}" Click="OnRemove"/>
                                         </StackPanel>
@@ -199,7 +299,7 @@
                                         <!-- a travessia: anima suave até o valor novo (OnProgress) -->
                                         <ProgressBar x:Name="Bar" Grid.Row="1" Grid.ColumnSpan="6" Style="{StaticResource Bar}" Margin="0,16,0,0"
                                                      Tag="{Binding Progress, NotifyOnTargetUpdated=True}" Binding.TargetUpdated="OnProgress">
-                                            <ProgressBar.Foreground><SolidColorBrush Color="#4A5363"/></ProgressBar.Foreground>
+                                            <ProgressBar.Foreground><SolidColorBrush Color="{StaticResource IdleColor}"/></ProgressBar.Foreground>
                                         </ProgressBar>
                                     </Grid>
                                 </Border>
@@ -212,16 +312,53 @@
                                         <Setter TargetName="Info" Property="Grid.Column" Value="0"/>
                                         <Setter TargetName="Info" Property="Grid.ColumnSpan" Value="2"/>
                                         <Setter TargetName="Info" Property="Margin" Value="0,0,16,0"/>
-                                        <Setter TargetName="TitleText" Property="FontSize" Value="30"/>
                                     </DataTrigger>
                                     <DataTrigger Binding="{Binding TitleId}" Value=""><Setter TargetName="IdLbl" Property="Visibility" Value="Collapsed"/></DataTrigger>
                                     <DataTrigger Binding="{Binding Amount}" Value=""><Setter TargetName="AmountLbl" Property="Visibility" Value="Collapsed"/></DataTrigger>
                                     <DataTrigger Binding="{text:JobText Detail}" Value=""><Setter TargetName="DetailText" Property="Visibility" Value="Collapsed"/></DataTrigger>
                                     <DataTrigger Binding="{Binding CurrentFile}" Value=""><Setter TargetName="FileLbl" Property="Visibility" Value="Collapsed"/></DataTrigger>
+                                    <!-- números só quando dizem algo: o ativo mostra os três; parado com progresso, só o % -->
+                                    <DataTrigger Binding="{Binding IsActive}" Value="True">
+                                        <Setter TargetName="TitleText" Property="FontSize" Value="{StaticResource JobTitleActiveSize}"/>
+                                    </DataTrigger>
                                     <DataTrigger Binding="{Binding IsActive}" Value="False">
-                                        <Setter TargetName="PctCell" Property="TextElement.Foreground" Value="{StaticResource Muted}"/>
-                                        <Setter TargetName="RateCell" Property="TextElement.Foreground" Value="{StaticResource Muted}"/>
-                                        <Setter TargetName="EtaCell" Property="TextElement.Foreground" Value="{StaticResource Muted}"/>
+                                        <Setter TargetName="PctCell" Property="TextElement.Foreground" Value="{StaticResource Text2}"/>
+                                        <Setter TargetName="RateCell" Property="Visibility" Value="Collapsed"/>
+                                        <Setter TargetName="EtaCell" Property="Visibility" Value="Collapsed"/>
+                                    </DataTrigger>
+                                    <MultiDataTrigger>
+                                        <MultiDataTrigger.Conditions><Condition Binding="{Binding IsActive}" Value="False"/><Condition Binding="{Binding Progress}" Value="0"/></MultiDataTrigger.Conditions>
+                                        <Setter TargetName="PctCell" Property="Visibility" Value="Collapsed"/>
+                                        <Setter TargetName="Bar" Property="Visibility" Value="Collapsed"/>
+                                    </MultiDataTrigger>
+                                    <MultiDataTrigger>
+                                        <MultiDataTrigger.Conditions><Condition Binding="{Binding IsActive}" Value="False"/><Condition Binding="{Binding Progress}" Value="100"/></MultiDataTrigger.Conditions>
+                                        <Setter TargetName="Bar" Property="Visibility" Value="Collapsed"/>
+                                    </MultiDataTrigger>
+                                    <!-- grupo do cartão: compacto na fila e nos concluídos; marcado em "precisa de você" -->
+                                    <DataTrigger Binding="{Binding Converter={StaticResource JobGroup}}" Value="attention">
+                                        <Setter TargetName="Mark" Property="Visibility" Value="Visible"/>
+                                        <Setter TargetName="Row" Property="Padding" Value="14,18,4,8"/>
+                                        <Setter TargetName="PctCell" Property="Visibility" Value="Collapsed"/>
+                                    </DataTrigger>
+                                    <DataTrigger Binding="{Binding Converter={StaticResource JobGroup}}" Value="queue">
+                                        <Setter TargetName="Row" Property="Padding" Value="0,12,4,8"/>
+                                        <Setter TargetName="Cover" Property="Width" Value="44"/>
+                                        <Setter TargetName="Cover" Property="Height" Value="44"/>
+                                        <Setter TargetName="Info" Property="Margin" Value="14,0,16,0"/>
+                                        <Setter TargetName="TitleText" Property="FontSize" Value="16"/>
+                                        <Setter TargetName="FileLbl" Property="Visibility" Value="Collapsed"/>
+                                    </DataTrigger>
+                                    <DataTrigger Binding="{Binding Converter={StaticResource JobGroup}}" Value="done">
+                                        <Setter TargetName="Row" Property="Padding" Value="0,12,4,12"/>
+                                        <Setter TargetName="Cover" Property="Width" Value="44"/>
+                                        <Setter TargetName="Cover" Property="Height" Value="44"/>
+                                        <Setter TargetName="Info" Property="Margin" Value="14,0,16,0"/>
+                                        <Setter TargetName="TitleText" Property="FontSize" Value="16"/>
+                                        <Setter TargetName="TitleText" Property="Foreground" Value="{StaticResource Text2}"/>
+                                        <Setter TargetName="FileLbl" Property="Visibility" Value="Collapsed"/>
+                                        <Setter TargetName="PctCell" Property="Visibility" Value="Collapsed"/>
+                                        <Setter TargetName="Bar" Property="Visibility" Value="Collapsed"/>
                                     </DataTrigger>
                                     <DataTrigger Binding="{Binding CanSendNow}" Value="True">
                                         <Setter TargetName="RateCell" Property="Visibility" Value="Collapsed"/>
@@ -230,13 +367,13 @@
 
                                     <!-- estado: cor do rótulo e transição de cor da travessia -->
                                     <DataTrigger Binding="{Binding Stage}" Value="AguardandoPartes">
-                                        <DataTrigger.EnterActions><BeginStoryboard><Storyboard><ColorAnimation Storyboard.TargetName="Bar" Storyboard.TargetProperty="(ProgressBar.Foreground).(SolidColorBrush.Color)" To="#4A5363" Duration="0:0:0.3"/></Storyboard></BeginStoryboard></DataTrigger.EnterActions>
+                                        <DataTrigger.EnterActions><BeginStoryboard><Storyboard><ColorAnimation Storyboard.TargetName="Bar" Storyboard.TargetProperty="(ProgressBar.Foreground).(SolidColorBrush.Color)" To="{StaticResource IdleColor}" Duration="0:0:0.3"/></Storyboard></BeginStoryboard></DataTrigger.EnterActions>
                                     </DataTrigger>
                                     <DataTrigger Binding="{Binding Stage}" Value="NaFila">
-                                        <DataTrigger.EnterActions><BeginStoryboard><Storyboard><ColorAnimation Storyboard.TargetName="Bar" Storyboard.TargetProperty="(ProgressBar.Foreground).(SolidColorBrush.Color)" To="#4A5363" Duration="0:0:0.3"/></Storyboard></BeginStoryboard></DataTrigger.EnterActions>
+                                        <DataTrigger.EnterActions><BeginStoryboard><Storyboard><ColorAnimation Storyboard.TargetName="Bar" Storyboard.TargetProperty="(ProgressBar.Foreground).(SolidColorBrush.Color)" To="{StaticResource IdleColor}" Duration="0:0:0.3"/></Storyboard></BeginStoryboard></DataTrigger.EnterActions>
                                     </DataTrigger>
                                     <DataTrigger Binding="{Binding Stage}" Value="Cancelado">
-                                        <DataTrigger.EnterActions><BeginStoryboard><Storyboard><ColorAnimation Storyboard.TargetName="Bar" Storyboard.TargetProperty="(ProgressBar.Foreground).(SolidColorBrush.Color)" To="#4A5363" Duration="0:0:0.3"/></Storyboard></BeginStoryboard></DataTrigger.EnterActions>
+                                        <DataTrigger.EnterActions><BeginStoryboard><Storyboard><ColorAnimation Storyboard.TargetName="Bar" Storyboard.TargetProperty="(ProgressBar.Foreground).(SolidColorBrush.Color)" To="{StaticResource IdleColor}" Duration="0:0:0.3"/></Storyboard></BeginStoryboard></DataTrigger.EnterActions>
                                     </DataTrigger>
                                     <DataTrigger Binding="{Binding Stage}" Value="Extraindo">
                                         <Setter TargetName="StageLbl" Property="Foreground" Value="{StaticResource AccentText}"/>
@@ -279,7 +416,12 @@
                                         <Setter TargetName="StageLbl" Property="Foreground" Value="{StaticResource Amber}"/>
                                         <DataTrigger.EnterActions><BeginStoryboard><Storyboard><ColorAnimation Storyboard.TargetName="Bar" Storyboard.TargetProperty="(ProgressBar.Foreground).(SolidColorBrush.Color)" To="{StaticResource AmberColor}" Duration="0:0:0.3"/></Storyboard></BeginStoryboard></DataTrigger.EnterActions>
                                     </DataTrigger>
+                                    <DataTrigger Binding="{Binding Stage}" Value="AguardandoPartes">
+                                        <Setter TargetName="PctCell" Property="Visibility" Value="Collapsed"/>
+                                    </DataTrigger>
                                     <DataTrigger Binding="{Binding Stage}" Value="Erro">
+                                        <Setter TargetName="RetryIconBtn" Property="Visibility" Value="Collapsed"/>
+                                        <Setter TargetName="RetryTextBtn" Property="Visibility" Value="Visible"/>
                                         <Setter TargetName="StageLbl" Property="Foreground" Value="{StaticResource Red}"/>
                                         <Setter TargetName="DetailText" Property="Foreground" Value="{StaticResource Red}"/>
                                         <Setter TargetName="DetailText" Property="TextWrapping" Value="Wrap"/>
@@ -300,31 +442,35 @@
                 </Border>
             </Grid>
 
-            <!-- == CONFIGURAÇÕES: duas colunas, sem rolar no tamanho padrão (rola só se a janela ficar menor) == -->
-            <ScrollViewer x:Name="SettingsPage" Grid.Row="1" VerticalScrollBarVisibility="Auto" Visibility="Collapsed" Focusable="False">
-                <Grid x:Name="SettingsPanel" MinHeight="800" Binding.SourceUpdated="OnSourceUpdated">
-                    <Grid.RowDefinitions>
-                        <RowDefinition Height="Auto"/>
-                        <RowDefinition Height="*"/>
-                    </Grid.RowDefinitions>
-                    <Border BorderBrush="{StaticResource Line2}" BorderThickness="0,0,0,1" Padding="0,0,0,18">
-                        <DockPanel>
-                            <TextBlock DockPanel.Dock="Right" Text="{text:Loc ui.autosaved}" Foreground="{StaticResource Muted}" FontSize="13" VerticalAlignment="Bottom"/>
-                            <TextBlock Text="{text:Loc ui.settings}" FontSize="34" FontWeight="SemiBold" LineHeight="34" LineStackingStrategy="BlockLineHeight"/>
-                        </DockPanel>
-                    </Border>
-
-                    <Grid Grid.Row="1" Margin="0,4,0,0">
-                        <Grid.ColumnDefinitions>
-                            <ColumnDefinition Width="*"/>
-                            <ColumnDefinition Width="40"/>
-                            <ColumnDefinition Width="*"/>
-                        </Grid.ColumnDefinitions>
-
-                        <!-- esquerda: conexão e destino -->
-                        <StackPanel>
-
-                            <Border Style="{StaticResource Group}">
+            <!-- == CONFIGURAÇÕES: índice fixo à esquerda, seções numa coluna (cada seção cabe na tela no tamanho padrão) == -->
+            <Grid x:Name="SettingsPage" Grid.Row="2" Visibility="Collapsed">
+                <Grid.RowDefinitions>
+                    <RowDefinition Height="Auto"/>
+                    <RowDefinition Height="*"/>
+                </Grid.RowDefinitions>
+                <Border BorderBrush="{StaticResource Line2}" BorderThickness="0,0,0,1" Padding="0,0,0,18">
+                    <DockPanel>
+                        <TextBlock DockPanel.Dock="Right" Text="{text:Loc ui.autosaved}" Foreground="{StaticResource Muted}" FontSize="13" VerticalAlignment="Bottom"/>
+                        <TextBlock Text="{text:Loc ui.settings}" FontSize="{StaticResource PageTitleSize}" FontWeight="SemiBold" LineHeight="34" LineStackingStrategy="BlockLineHeight"/>
+                    </DockPanel>
+                </Border>
+                <Grid Grid.Row="1">
+                    <Grid.ColumnDefinitions>
+                        <ColumnDefinition Width="170"/>
+                        <ColumnDefinition Width="*"/>
+                    </Grid.ColumnDefinitions>
+                    <StackPanel x:Name="SectionNav" Margin="0,20,24,0" AutomationProperties.Name="{text:Loc ui.sections}">
+                        <RadioButton Style="{StaticResource SectionItem}" GroupName="sections" Tag="SecPs5" Content="{text:Loc app.ps5}" Click="OnSectionNav" IsChecked="True"/>
+                        <RadioButton Style="{StaticResource SectionItem}" GroupName="sections" Tag="SecDestinations" Content="{text:Loc ui.section.destinations}" Click="OnSectionNav"/>
+                        <RadioButton Style="{StaticResource SectionItem}" GroupName="sections" Tag="SecTransfer" Content="{text:Loc ui.transfer}" Click="OnSectionNav"/>
+                        <RadioButton Style="{StaticResource SectionItem}" GroupName="sections" Tag="SecPower" Content="{text:Loc app.power}" Click="OnSectionNav"/>
+                        <RadioButton Style="{StaticResource SectionItem}" GroupName="sections" Tag="SecPasswords" Content="{text:Loc ui.knownPasswords}" Click="OnSectionNav"/>
+                        <RadioButton Style="{StaticResource SectionItem}" GroupName="sections" Tag="SecNotices" Content="{text:Loc ui.section.notices}" Click="OnSectionNav"/>
+                        <RadioButton Style="{StaticResource SectionItem}" GroupName="sections" Tag="SecGeneral" Content="{text:Loc ui.section.general}" Click="OnSectionNav"/>
+                    </StackPanel>
+                    <ScrollViewer x:Name="SettingsScroll" Grid.Column="1" Margin="0,0,-32,-20" Padding="0,0,32,20" VerticalScrollBarVisibility="Auto" Focusable="False" ScrollChanged="OnSettingsScroll">
+                        <StackPanel x:Name="SettingsPanel" MaxWidth="760" HorizontalAlignment="Left" Binding.SourceUpdated="OnSourceUpdated">
+                            <Border x:Name="SecPs5" Style="{StaticResource Group}">
                                 <StackPanel>
                                     <TextBlock Text="{text:Loc app.ps5}" Style="{StaticResource GroupTitle}"/>
                                     <TextBlock Text="{text:Loc ui.host}" Style="{StaticResource Label}"/>
@@ -354,7 +500,7 @@
                                     </DockPanel>
                                 </StackPanel>
                             </Border>
-                            <Border Style="{StaticResource Group}" BorderThickness="0">
+                            <Border x:Name="SecDestinations" Style="{StaticResource Group}">
                                 <StackPanel>
                                     <TextBlock Text="{text:Loc ui.destination}" Style="{StaticResource GroupTitle}"/>
                                     <TextBlock Text="{text:Loc ui.gamesFolder}" Style="{StaticResource Label}"
@@ -370,6 +516,7 @@
                                                ToolTip="{text:Loc app.exfatHint}"/>
                                     <TextBox x:Name="ImageBox" TextChanged="OnImageDirChanged" AutomationProperties.Name="{text:Loc app.exfatFolder}"/>
                                     <TextBlock x:Name="ImageHint" Style="{StaticResource Hint}" Foreground="{StaticResource Red}" Visibility="Collapsed"/>
+                                    <Border BorderBrush="{StaticResource Line}" BorderThickness="0,1,0,0" Margin="0,24,0,0" Padding="0,16,0,0"><TextBlock Text="{text:Loc ui.section.packages}" Style="{StaticResource SubTitle}"/></Border>
                                     <TextBlock Text="{text:Loc ui.pkgDir}" Style="{StaticResource Label}" Margin="0,12,0,5"/>
                                     <TextBox x:Name="PkgBox" TextChanged="OnPkgDirChanged" AutomationProperties.Name="{text:Loc ui.pkgDir}"/>
                                     <TextBlock x:Name="PkgHint" Style="{StaticResource Hint}" Foreground="{StaticResource Red}" Visibility="Collapsed"/>
@@ -401,7 +548,52 @@
                                     </DockPanel>
                                 </StackPanel>
                             </Border>
-                            <Border Style="{StaticResource Group}" BorderThickness="0">
+                            <Border x:Name="SecTransfer" Style="{StaticResource Group}">
+                                <StackPanel>
+                                    <TextBlock Text="{text:Loc ui.transfer}" Style="{StaticResource GroupTitle}"/>
+                                    <TextBlock Text="{text:Loc ui.connections}" Style="{StaticResource Label}"
+                                               ToolTip="{text:Loc app.connectionsHint}"/>
+                                    <DockPanel>
+                                        <TextBlock DockPanel.Dock="Right" Text="{Binding Connections}" Width="28" TextAlignment="Right" VerticalAlignment="Center" FontWeight="SemiBold" FontSize="15"/>
+                                        <Slider Minimum="1" Maximum="8" IsSnapToTickEnabled="True" TickFrequency="1" Value="{Binding Connections, NotifyOnSourceUpdated=True}" VerticalAlignment="Center" AutomationProperties.Name="{text:Loc ui.connections}"/>
+                                    </DockPanel>
+                                    <CheckBox Margin="0,12,0,0" Content="{text:Loc ui.deleteOriginal}" IsChecked="{Binding DeleteOriginal, NotifyOnSourceUpdated=True}"/>
+                                    <CheckBox Margin="0,10,0,0" Content="{text:Loc ui.autoClearFinished}" IsChecked="{Binding AutoClearFinished, NotifyOnSourceUpdated=True}"/>
+                                    <TextBlock Text="{text:Loc ui.pkgRetentionHint}" Style="{StaticResource Hint}"/>
+                                    <StackPanel Margin="0,24,0,0">
+                                        <Border BorderBrush="{StaticResource Line}" BorderThickness="0,1,0,0" Padding="0,16,0,0"><TextBlock Text="{text:Loc ui.watchFolder}" Style="{StaticResource SubTitle}"/></Border>
+                                        <DockPanel>
+                                            <Button DockPanel.Dock="Right" Content="{text:Loc app.choose}" Style="{StaticResource Btn}" Margin="10,0,0,0" Click="OnPickFolder"/>
+                                            <TextBox x:Name="FolderBox" TextChanged="OnFolderChanged" AutomationProperties.Name="{text:Loc ui.watchFolder}"/>
+                                        </DockPanel>
+                                        <TextBlock x:Name="FolderHint" Style="{StaticResource Hint}" Foreground="{StaticResource Red}" Visibility="Collapsed"/>
+                                        <TextBlock Style="{StaticResource Hint}" Text="{text:Loc app.watchHint}"/>
+                                    </StackPanel>
+                                </StackPanel>
+                            </Border>
+                            <Border x:Name="SecPower" Style="{StaticResource Group}">
+                                <StackPanel>
+                                    <TextBlock Text="{text:Loc app.power}" Style="{StaticResource GroupTitle}"/>
+                                    <CheckBox x:Name="ShutdownAfterBox" Content="{text:Loc app.shutdownAfter}" Checked="OnShutdownAfterChanged" Unchecked="OnShutdownAfterChanged"
+                                              AutomationProperties.Name="{text:Loc app.shutdownAfter}"/>
+                                    <TextBlock x:Name="PowerStatusText" Style="{StaticResource Hint}" AutomationProperties.LiveSetting="Polite"/>
+                                    <TextBlock Text="{text:Loc app.powerHint}" Style="{StaticResource Hint}"/>
+                                    <CheckBox x:Name="KeepAwakeBox" Content="{text:Loc app.keepAwake}" Margin="0,12,0,0"
+                                              Checked="OnKeepAwakeChanged" Unchecked="OnKeepAwakeChanged" AutomationProperties.Name="{text:Loc app.keepAwake}"/>
+                                </StackPanel>
+                            </Border>
+                            <Border x:Name="SecPasswords" Style="{StaticResource Group}">
+                                <StackPanel>
+                                    <TextBlock Style="{StaticResource GroupTitle}">
+                                        <Run Text="{text:Loc ui.knownPasswords}"/><Run Text="{text:Loc app.passwordsHint}" FontWeight="Normal" FontSize="12" Foreground="{StaticResource Muted}"/>
+                                    </TextBlock>
+                                    <TextBox x:Name="PwList" AcceptsReturn="True" TextWrapping="NoWrap" VerticalContentAlignment="Top" MinHeight="140"
+                                             VerticalScrollBarVisibility="Disabled" HorizontalScrollBarVisibility="Auto" TextChanged="OnPwListChanged"
+                                             AutomationProperties.Name="{text:Loc ui.knownPasswords}"
+                                             ToolTip="{text:Loc app.passwordsTooltip}"/>
+                                </StackPanel>
+                            </Border>
+                            <Border x:Name="SecNotices" Style="{StaticResource Group}">
                                 <StackPanel>
                                     <TextBlock Text="{text:Loc ui.webhook}" Style="{StaticResource GroupTitle}"/>
                                     <CheckBox x:Name="WebhookEnabledBox" Content="{text:Loc ui.webhookEnabled}" Checked="OnWebhookEnabledChanged" Unchecked="OnWebhookEnabledChanged"/>
@@ -421,18 +613,7 @@
                                     </DockPanel>
                                 </StackPanel>
                             </Border>
-                        </StackPanel>
-
-                        <!-- direita: pasta monitorada, envio e senhas (a caixa de senhas estica até o fim) -->
-                        <Grid Grid.Column="2">
-                            <Grid.RowDefinitions>
-                                <RowDefinition Height="Auto"/>
-                                <RowDefinition Height="Auto"/>
-                                <RowDefinition Height="Auto"/>
-                                <RowDefinition Height="Auto"/>
-                                <RowDefinition Height="*"/>
-                            </Grid.RowDefinitions>
-                            <Border Style="{StaticResource Group}">
+                            <Border x:Name="SecGeneral" Style="{StaticResource Group}">
                                 <StackPanel>
                                     <TextBlock Text="{text:Loc ui.language}" Style="{StaticResource GroupTitle}"/>
                                     <ComboBox x:Name="LanguageBox" SelectionChanged="OnLanguageChanged" AutomationProperties.Name="{text:Loc ui.language}">
@@ -443,58 +624,13 @@
                                     <TextBlock Text="{text:Loc app.languageHint}" Style="{StaticResource Hint}"/>
                                 </StackPanel>
                             </Border>
-                            <Border Grid.Row="1" Style="{StaticResource Group}">
-                                <StackPanel>
-                                    <TextBlock Text="{text:Loc ui.watchFolder}" Style="{StaticResource GroupTitle}"/>
-                                    <DockPanel>
-                                        <Button DockPanel.Dock="Right" Content="{text:Loc app.choose}" Style="{StaticResource Btn}" Margin="10,0,0,0" Click="OnPickFolder"/>
-                                        <TextBox x:Name="FolderBox" TextChanged="OnFolderChanged" AutomationProperties.Name="{text:Loc ui.watchFolder}"/>
-                                    </DockPanel>
-                                    <TextBlock x:Name="FolderHint" Style="{StaticResource Hint}" Foreground="{StaticResource Red}" Visibility="Collapsed"/>
-                                    <TextBlock Style="{StaticResource Hint}" Text="{text:Loc app.watchHint}"/>
-                                </StackPanel>
-                            </Border>
-                            <Border Grid.Row="2" Style="{StaticResource Group}">
-                                <StackPanel>
-                                    <TextBlock Text="{text:Loc ui.transfer}" Style="{StaticResource GroupTitle}"/>
-                                    <TextBlock Text="{text:Loc ui.connections}" Style="{StaticResource Label}"
-                                               ToolTip="{text:Loc app.connectionsHint}"/>
-                                    <DockPanel>
-                                        <TextBlock DockPanel.Dock="Right" Text="{Binding Connections}" Width="28" TextAlignment="Right" VerticalAlignment="Center" FontWeight="SemiBold" FontSize="15"/>
-                                        <Slider Minimum="1" Maximum="8" IsSnapToTickEnabled="True" TickFrequency="1" Value="{Binding Connections, NotifyOnSourceUpdated=True}" VerticalAlignment="Center" AutomationProperties.Name="{text:Loc ui.connections}"/>
-                                    </DockPanel>
-                                    <CheckBox Margin="0,12,0,0" Content="{text:Loc ui.deleteOriginal}" IsChecked="{Binding DeleteOriginal, NotifyOnSourceUpdated=True}"/>
-                                    <CheckBox Margin="0,10,0,0" Content="{text:Loc ui.autoClearFinished}" IsChecked="{Binding AutoClearFinished, NotifyOnSourceUpdated=True}"/>
-                                    <TextBlock Text="{text:Loc ui.pkgRetentionHint}" Style="{StaticResource Hint}"/>
-                                </StackPanel>
-                            </Border>
-                            <Border Grid.Row="3" Style="{StaticResource Group}">
-                                <StackPanel>
-                                    <TextBlock Text="{text:Loc app.power}" Style="{StaticResource GroupTitle}"/>
-                                    <CheckBox x:Name="ShutdownAfterBox" Content="{text:Loc app.shutdownAfter}" Checked="OnShutdownAfterChanged" Unchecked="OnShutdownAfterChanged"
-                                              AutomationProperties.Name="{text:Loc app.shutdownAfter}"/>
-                                    <TextBlock x:Name="PowerStatusText" Style="{StaticResource Hint}" AutomationProperties.LiveSetting="Polite"/>
-                                    <TextBlock Text="{text:Loc app.powerHint}" Style="{StaticResource Hint}"/>
-                                    <CheckBox x:Name="KeepAwakeBox" Content="{text:Loc app.keepAwake}" Margin="0,12,0,0"
-                                              Checked="OnKeepAwakeChanged" Unchecked="OnKeepAwakeChanged" AutomationProperties.Name="{text:Loc app.keepAwake}"/>
-                                </StackPanel>
-                            </Border>
-                            <DockPanel Grid.Row="4" Margin="0,16,0,0">
-                                <TextBlock DockPanel.Dock="Top" Style="{StaticResource GroupTitle}">
-                                    <Run Text="{text:Loc ui.knownPasswords}"/><Run Text="{text:Loc app.passwordsHint}" FontWeight="Normal" FontSize="12" Foreground="{StaticResource Muted}"/>
-                                </TextBlock>
-                                <TextBox x:Name="PwList" AcceptsReturn="True" TextWrapping="NoWrap" VerticalContentAlignment="Top"
-                                         VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto" TextChanged="OnPwListChanged"
-                                         AutomationProperties.Name="{text:Loc ui.knownPasswords}"
-                                         ToolTip="{text:Loc app.passwordsTooltip}"/>
-                            </DockPanel>
-                        </Grid>
-                    </Grid>
+                        </StackPanel>
+                    </ScrollViewer>
                 </Grid>
-            </ScrollViewer>
+            </Grid>
 
             <!-- == LOG == -->
-            <DockPanel x:Name="LogPage" Grid.Row="1" Visibility="Collapsed">
+            <DockPanel x:Name="LogPage" Grid.Row="2" Visibility="Collapsed">
                 <Border DockPanel.Dock="Top" BorderBrush="{StaticResource Line2}" BorderThickness="0,0,0,1" Padding="0,0,0,18" Margin="0,0,0,18">
                     <DockPanel>
                         <StackPanel DockPanel.Dock="Right" Orientation="Horizontal" VerticalAlignment="Bottom">
diff --git a/app/MainWindow.xaml.cs b/app/MainWindow.xaml.cs
index 4fec573..764b5e0 100644
--- a/app/MainWindow.xaml.cs
+++ b/app/MainWindow.xaml.cs
@@ -24,6 +24,8 @@ public partial class MainWindow : Window
     WindowState _restoredState = WindowState.Normal;
     bool _loading; // preenchendo os campos por código: não conta como edição do usuário
     (string Ip, int Port)? _found; // PS5 achado na varredura, aguardando "Usar este"
+    ListCollectionView? _queueView;
+    List<(Job Job, string Group)> _grouped = [];
 
     public MainWindow() : this(new WindowsPowerService()) { }
 
@@ -73,7 +75,10 @@ public MainWindow(IPowerService power, TimeProvider? clock = null, bool startEng
             });
         };
         BindingOperations.EnableCollectionSynchronization(_engine.Jobs, _engine.Lock);
-        JobList.ItemsSource = _engine.Jobs;
+        // fila em grupos (Precisa de você → Enviando → Na fila → Concluídos), na ordem do motor dentro de cada grupo
+        _queueView = (ListCollectionView)CollectionViewSource.GetDefaultView(_engine.Jobs);
+        _queueView.GroupDescriptions.Add(new PropertyGroupDescription(null, new JobGroupConverter()));
+        JobList.ItemsSource = _queueView;
         _engine.Restore();
         _powerSession = new(_engine.Jobs, _engine.Lock, power, clock, _engine.ObserveWork);
 
@@ -180,13 +185,62 @@ void RefreshSummary()
         SpeedPill.Visibility = rate > 0 ? Visibility.Visible : Visibility.Collapsed;
         var sz = WpfText.Current.Size((long)rate).Split(' ');
         (SpeedText.Text, SpeedUnit.Text) = (sz[0], " " + sz[1] + "/s");
-        ClearBtn.Visibility = done + requested > 0 ? Visibility.Visible : Visibility.Collapsed;
         EmptyHint.Visibility = jobs.Count == 0 ? Visibility.Visible : Visibility.Collapsed;
+        RegroupQueue(jobs);
+        RefreshOverall(jobs, rate);
         var pending = jobs.Count - done - requested;
         QueueBadge.Visibility = pending > 0 ? Visibility.Visible : Visibility.Collapsed;
         QueueBadgeText.Text = pending.ToString(WpfText.Current.Culture);
     }
 
+    // O grupo depende do estado; a lista só é reorganizada quando algum jogo muda de grupo ou de posição
+    // (recriar os cartões a cada tique perderia a animação da barra e o foco do teclado).
+    void RegroupQueue(List<Job> jobs)
+    {
+        if (_queueView == null) return;
+        var grouped = jobs.Select(j => (j, QueueGroups.Of(j))).ToList();
+        if (grouped.SequenceEqual(_grouped)) return;
+        _grouped = grouped;
+        _queueView.CustomSort = new QueueGroups.Sort(jobs.Select((job, index) => (job, index)).ToDictionary(x => x.job, x => x.index));
+    }
+
+    // Progresso da fila: bytes dos itens enviando/na fila. Término previsto só com todos os tamanhos conhecidos e velocidade.
+    void RefreshOverall(List<Job> jobs, double rate)
+    {
+        var pending = jobs.Where(j => QueueGroups.Of(j) is "active" or "queue").ToList();
+        var known = pending.Where(j => j.TotalBytes > 0).ToList();
+        OverallPanel.Visibility = pending.Count >= 2 && known.Count > 0 ? Visibility.Visible : Visibility.Collapsed;
+        if (OverallPanel.Visibility != Visibility.Visible) return;
+        long total = known.Sum(j => j.TotalBytes), sent = known.Sum(j => Math.Min(j.DoneBytes, j.TotalBytes));
+        OverallBar.Value = total > 0 ? sent * 100.0 / total : 0;
+        OverallAmount.Text = T("ui.amount", WpfText.Current.Size(sent), WpfText.Current.Size(total));
+        OverallEta.Text = rate > 0 && known.Count == pending.Count
+            ? " · " + T("ui.finishesAt", DateTime.Now.AddSeconds((total - sent) / rate).ToString("t", WpfText.Current.Culture))
+            : "";
+    }
+
+    // índice das Configurações: o clique rola até a seção; a rolagem marca a seção visível
+    void OnSectionNav(object s, RoutedEventArgs e)
+    {
+        if (s is not RadioButton { Tag: string name } || FindName(name) is not FrameworkElement section) return;
+        var top = section.TransformToAncestor(SettingsScroll).Transform(new Point(0, 0)).Y;
+        SettingsScroll.ScrollToVerticalOffset(SettingsScroll.VerticalOffset + top);
+    }
+
+    void OnSettingsScroll(object s, ScrollChangedEventArgs e)
+    {
+        if (SectionNav == null || !SettingsScroll.IsVisible) return;
+        RadioButton? current = null;
+        var line = SettingsScroll.ViewportHeight * 0.3;
+        foreach (RadioButton item in SectionNav.Children)
+        {
+            if (FindName((string)item.Tag) is not FrameworkElement section || !section.IsVisible) continue;
+            if (current == null || section.TransformToAncestor(SettingsScroll).Transform(new Point(0, 0)).Y <= line) current = item;
+        }
+        if (SettingsScroll.VerticalOffset >= SettingsScroll.ScrollableHeight - 1 && SectionNav.Children.Count > 0) current = (RadioButton)SectionNav.Children[^1];
+        if (current != null && current.IsChecked != true) current.IsChecked = true;
+    }
+
     void RefreshPower()
     {
         _powerSession.Tick();
@@ -402,6 +456,7 @@ void UpdateStatusCard()
     {
         StatusHost.Text = $"{_settings.Host}:{_settings.Port}";
         StatusDest.Text = _settings.RemoteDir;
+        StatusDest.ToolTip = _settings.RemoteDir;
         EmptyDest.Text = $"PS5 · {_settings.Host}";
     }
 
@@ -545,6 +600,8 @@ void OnProgress(object s, DataTransferEventArgs e)
             new System.Windows.Media.Animation.DoubleAnimation(v, TimeSpan.FromMilliseconds(ms)) { EasingFunction = new System.Windows.Media.Animation.QuadraticEase { EasingMode = System.Windows.Media.Animation.EasingMode.EaseOut } });
     }
     void OnClearFinished(object s, RoutedEventArgs e) => _engine.ClearFinished();
+    // "Limpar concluídos" fica no cabeçalho do grupo (modelo de estilo não aceita Click direto)
+    void OnQueueButton(object s, RoutedEventArgs e) { if (e.OriginalSource is Button { Tag: "clear-finished" }) _engine.ClearFinished(); }
 
     void OnDragEnter(object s, DragEventArgs e)
     {
diff --git a/app/QueueGroups.cs b/app/QueueGroups.cs
new file mode 100644
index 0000000..5cadb8f
--- /dev/null
+++ b/app/QueueGroups.cs
@@ -0,0 +1,58 @@
+using System.Collections;
+using System.ComponentModel;
+using System.Globalization;
+using System.Windows.Data;
+
+namespace Ferry;
+
+/// Fila em grupos, igual à web: Precisa de você → Enviando → Na fila → Concluídos.
+/// A ordem dentro de cada grupo é a do motor (a que o usuário escolheu com "Transferir agora").
+public sealed class QueueGroups : INotifyPropertyChanged
+{
+    public static QueueGroups Current { get; } = new();
+    public static readonly string[] Order = ["attention", "active", "queue", "done"];
+    public event PropertyChangedEventHandler? PropertyChanged;
+
+    bool _doneExpanded;
+    /// Concluídos começam recolhidos; a escolha vale enquanto o app está aberto (sobrevive à reorganização dos grupos).
+    public bool DoneExpanded
+    {
+        get => _doneExpanded;
+        set { if (_doneExpanded == value) return; _doneExpanded = value; PropertyChanged?.Invoke(this, new(nameof(DoneExpanded))); }
+    }
+
+    public static string Of(Job job) => job.Stage switch
+    {
+        Stage.Erro or Stage.PacotePronto or Stage.VerifiqueNoPs5 => "attention",
+        _ when job.IsActive => "active",
+        Stage.Extraindo or Stage.Enviando or Stage.SolicitandoInstalacao => "active",
+        Stage.Verificado or Stage.InstalacaoSolicitada => "done",
+        _ => "queue",
+    };
+
+    /// Posição de cada jogo na fila do motor quando o grupo foi calculado; jogo novo vai para o fim até o próximo cálculo.
+    public sealed class Sort(IReadOnlyDictionary<Job, int> positions) : IComparer
+    {
+        public int Compare(object? x, object? y)
+        {
+            if (x is not Job a || y is not Job b) return 0;
+            var byGroup = Array.IndexOf(Order, Of(a)).CompareTo(Array.IndexOf(Order, Of(b)));
+            return byGroup != 0 ? byGroup : Position(a).CompareTo(Position(b));
+        }
+        int Position(Job job) => positions.TryGetValue(job, out var index) ? index : int.MaxValue;
+    }
+}
+
+public sealed class JobGroupConverter : IValueConverter
+{
+    public object Convert(object value, Type targetType, object parameter, CultureInfo culture) => value is Job job ? QueueGroups.Of(job) : "";
+    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture) => throw new NotSupportedException();
+}
+
+/// Título do grupo no idioma atual (muda junto com o idioma, sem recriar a lista).
+public sealed class GroupTitleConverter : IMultiValueConverter
+{
+    public object Convert(object[] values, Type targetType, object parameter, CultureInfo culture) =>
+        values[0] is string key ? WpfText.Current.T("ui.group." + key) : "";
+    public object[] ConvertBack(object value, Type[] targetTypes, object parameter, CultureInfo culture) => throw new NotSupportedException();
+}
diff --git a/docs/ROADMAP.md b/docs/ROADMAP.md
index c41549b..9938acf 100644
--- a/docs/ROADMAP.md
+++ b/docs/ROADMAP.md
@@ -4,6 +4,8 @@
 
 > **Reavaliação em 01/10/2026:** a próxima proposta passa a ser [retirar PKG por FTP + DPI por caminho local e adotar USB/PKG Manager](plans/next/remover-pkg-ftp-e-adotar-pkg-manager.md), após o usuário reportar que o método atual não resolve seu cenário. Ainda não implementada. O diagnóstico da Fase 6.1 abaixo precisa ser revisto para excluir essa premissa; o restante registra o planejamento de 30/09.
 
+> **Redesenho (14/10/2026):** [redesenho da interface](plans/next/redesenho-interface.md) — Fila por grupos, métricas por estado, Configurações por seções e tokens únicos web/WPF. Implementado na PR bps2414/ferry#3, aguardando revisão; a seção de destinos PKG muda de novo com o plano do PKG Manager.
+
 Reavaliado em 2026-09-30. Ordem: lógica → UI/marca → self-hosted (Docker) → inglês → webhook → PKG/fPKG → diagnóstico de serviços e destinos. RAR progressivo passa a prova técnica futura; payload fica fora da próxima fase.
 
 Estado: Fases 1, 1.5, 2 e 3 concluídas (a 3 saiu na release `v1.3.0-beta.1`). **Fases 5, 5.1 e 6 implementadas. A fase 6 cobre PKG solto e um PKG por ZIP/RAR/7z; instalação real ainda exige validação no PS5. Próxima fase proposta: 6.1, diagnóstico sem payload, ainda não implementada. Publicação depende da CI.** Pesquisa primária e ranking em [PESQUISA-CENARIO-PS5-2026-09.md](PESQUISA-CENARIO-PS5-2026-09.md); contrato futuro em [proxima-fase-sem-payload.md](plans/next/proxima-fase-sem-payload.md). A rodada de UX Windows foi integrada e validada localmente: [opções de energia da sessão](UX-PRODUTO.md) e [resultados](RELATORIO-PRODUTO-2026-09.md).
diff --git a/docs/plans/next/redesenho-interface.md b/docs/plans/next/redesenho-interface.md
new file mode 100644
index 0000000..9a6183e
--- /dev/null
+++ b/docs/plans/next/redesenho-interface.md
@@ -0,0 +1,168 @@
+# Redesenho da interface — Fila, Configurações, celular e Windows
+
+Data: **2026-10-14**. Estado: **implementado em 2026-10-14** (PR bps2414/ferry#3). Desvios em relação ao plano no fim do documento. Base analisada: `fab0939`. Escopo: interface web (`web/ui`) e app Windows (`app/MainWindow.xaml`, `app/App.xaml`). Evidência: capturas do E2E web (`e2e/web/report/pt-BR`), da rodada de energia (`e2e/windows/report/power-pt-BR.png`) e `docs/screenshots`.
+
+## Decisão de direção
+
+**Evoluir, não trocar a identidade.** A direção da Fase 2 continua válida e é o que diferencia o Ferry: "PlayStation noir" editorial, quase monocromático, um acento azul `#6F97FF`, Geist, números grandes, Fila "Régua" com a barra como travessia, logo Travessia. Continua proibido: glow, gradiente roxo-azul, vidro fosco, cara de template.
+
+O que muda é a **densidade de informação e a hierarquia**: a Régua foi desenhada para um jogo enviando e hoje a fila mostra muitos estados (aguardando partes, pausado, erro, concluído, PKG). Cada estado recebe o mesmo layout de quatro colunas, e o resultado é ruído.
+
+## Problemas encontrados
+
+### Fila
+
+1. **Colunas vazias em todo card.** Card aguardando, pausado, com erro ou concluído mostra `0,0% / — MB/s / — restante`. Em 5 cards concluídos/PKG (captura `11-pkg`) são 10 traços e 5 "100,0%" que não dizem nada além de "terminou".
+2. **Hierarquia invertida.** Sem capa o título passa de 22 px para 30 px (`.job.nocover .title`): `Kestrel_Run_v1.02`, que só espera uma parte, fica maior que o jogo que está enviando.
+3. **Sem ordem por urgência.** Erros e pedidos de senha aparecem onde estiverem na lista (o erro de senha incorreta ficou no fim em `fila.png`). Concluídos ocupam o mesmo espaço que o envio ativo.
+4. **Estado só por texto colorido pequeno** (12,5–13 px). A barra repete a cor, mas em card parado a barra vazia com seta não comunica "pausado" vs "aguardando".
+5. **Ações espalhadas.** "Transferir agora" é um botão grande no lugar das métricas; "Solicitar instalação" ocupa três colunas; os ícones ficam à direita. No celular os ícones caem numa linha própria, isolada.
+6. **Cabeçalho pobre para fila longa.** Há velocidade total, mas não progresso total nem previsão de término da fila — justamente o que importa para quem arma "desligar ao terminar".
+
+### Avisos
+
+7. **Toasts duplicados**: "Senha necessária / W1 precisa de senha" aparece duas vezes (`05-enviando`). O toast de senha não tem ação; o usuário precisa achar o card.
+
+### Casca e status
+
+8. **Status do PS5 longe do trabalho.** Fica no rodapé da barra lateral; o cartão "Achei um PS5 em…" disputa espaço com ele. No celular vira uma linha espremida acima das abas.
+9. **Caminho com prefixo `\\?\`** aparece cru no vazio e nas Configurações (`03-fila-vazia`, `02-configuracoes`) quando o servidor roda em Windows.
+
+### Configurações
+
+10. **Uma página longa com rolagem** em duas colunas, contrariando "Configurações sem rolagem" da Fase 2. Conexão, destinos, PKG/DPI, webhook, envio, senhas, idioma e conta estão no mesmo plano; Idioma e Conta ficam colados no fim.
+11. **Resultados de teste inline** em texto verde/vermelho longo ao lado do botão, quebrando o grid.
+12. **Seção PKG vai mudar**: o [plano do PKG Manager](remover-pkg-ftp-e-adotar-pkg-manager.md) remove destino PKG interno, DPI e instalação automática. Redesenhar essa seção agora seria trabalho jogado fora.
+
+### Windows
+
+13. ~~**Energia empurra a fila para baixo.**~~ A captura `power-pt-BR.png` era anterior a `0ca8baf`, que já levou as opções para Configurações → Energia; o topo só mostra a faixa da contagem. Nada a mudar aqui além de dar a Energia uma seção própria no índice.
+
+### Celular
+
+14. Cada card ocupa ≈300 px de altura (título, estado, detalhe truncado, métricas, linha de ações, barra). Cinco jogos = três telas de rolagem. "Limpar concluídos" e "Adicionar arquivos" empilhados no topo.
+
+### Manutenção
+
+15. **Tokens duplicados à mão** entre `web/ui/app.css` e `app/App.xaml` ("mesmos tokens do App.xaml" é só um comentário). Qualquer redesenho dobra o risco de divergência.
+
+## Proposta
+
+### 1. Fila por grupos
+
+Ordem fixa, cabeçalho de grupo discreto (rótulo + contagem), grupos vazios somem:
+
+| Grupo | Conteúdo | Formato do card |
+|---|---|---|
+| **Precisa de você** | senha pendente, erro, partes faltando há muito tempo, "Verifique no PS5" | completo, com ação principal visível (Digitar senha / Tentar de novo / Ver partes) |
+| **Enviando** | ativo | Régua completa: capa, título, %, MB/s, restante, barra |
+| **Na fila** | aguardando, pausado, aguardando partes | compacto (1 linha + barra fina): título, estado, `x GB de y GB`, ações |
+| **Concluídos** | concluído, instalação solicitada | **recolhido por padrão** (cabeçalho com contagem); aberto, linha única sem barra; "Limpar" no cabeçalho do grupo |
+
+A ordem dentro de "Na fila" continua a do motor (não reordenar o que o usuário escolheu com "Transferir agora").
+
+### 2. Métricas só quando significam algo
+
+- Ativo: as três colunas como hoje.
+- Pausado/na fila com progresso: só `%` (sem MB/s/restante).
+- Aguardando partes: no lugar das colunas, "faltando part3.rar" em destaque.
+- Concluído: sem colunas; um "✓ enviado às 14:32" curto.
+- Título com tamanho fixo (22 px web/WPF) com ou sem capa; o ativo pode ganhar 26 px.
+
+### 3. Estado como etiqueta
+
+Rótulo de estado com ponto colorido + texto (verde/âmbar/vermelho/azul), mesmo tamanho em todos os cards. A barra do card parado usa traço tracejado ou cor `--idle`, sem a seta de travessia; a seta fica reservada para o que está atravessando.
+
+### 4. Ações em um lugar
+
+Uma ação principal por estado em botão de texto (Transferir agora, Digitar senha, Tentar de novo, Abrir PKG Manager quando aplicável) + ícones secundários (pausar/retomar, cancelar, remover). No celular, ícones na mesma linha do estado, alvo mínimo 44 px.
+
+### 5. Cabeçalho da Fila
+
+`Fila` + resumo + **barra agregada** (bytes enviados / total dos itens não concluídos) + velocidade total + **término previsto** (só quando houver ETA de todos os itens ativos/na fila; senão omitir — não inventar número). Botão "Adicionar arquivos" permanece como primário.
+
+### 6. Avisos
+
+Deduplicar toasts por `(evento, job)`; toast de senha com botão **Digitar senha** que abre o diálogo; erro com **Ver** que rola até o card. Manter `aria-live`.
+
+### 7. Casca
+
+- Status do PS5 como **chip no topo do conteúdo** (ponto + host + destino; clique = testar conexão), igual em desktop e celular. Barra lateral fica só com marca e navegação.
+- "Achei um PS5" vira faixa no topo das Configurações e chip temporário no topo da Fila.
+- Exibir caminhos sem o prefixo `\\?\` (só apresentação; o valor salvo não muda).
+
+### 8. Configurações por seções
+
+Navegação secundária à esquerda do conteúdo (no celular, lista que abre cada seção). Cada seção cabe numa tela sem rolagem em 1440×900:
+
+1. **PS5** — IP/nome, Procurar na rede, porta, usuário, senha, Testar conexão.
+2. **Destinos** — pasta dos jogos (M.2/SSD/outra), imagens ShadowMount+. PKG entra aqui depois do plano do PKG Manager (porta 8844, Abrir gerenciador).
+3. **Envio** — conexões paralelas, apagar originais, pasta monitorada.
+4. **Senhas conhecidas**.
+5. **Avisos** — webhook (web e Windows), notificações do navegador.
+6. **Geral** — idioma; conta/sair (web).
+
+Resultado de teste vira **linha de status** abaixo do grupo (ícone + texto curto + horário), já preparando o diagnóstico da [Fase 6.1](proxima-fase-sem-payload.md). "Salvas automaticamente" continua no cabeçalho, com estado de erro quando o salvamento falhar.
+
+### 9. Windows: energia compacta
+
+Trocar as duas caixas por um controle **"Ao terminar"** no cabeçalho da Fila (botão com menu: Não fazer nada / Desligar este PC; checkbox Impedir suspensão). Estado armado vira chip ("Desligar ao terminar · cancelar"). A contagem de 60 s continua como **faixa** acima da Fila, como hoje (`PowerBanner`). A ressalva sobre PKG aparece só quando houver PKG na fila. **Contratos de energia não mudam** (sessão atual, bloqueios, 60 s, `shutdown /s /t 0`) — é só apresentação.
+
+### 10. Celular
+
+Cards compactos dos grupos 1 e 3 (≈72 px), concluídos recolhidos, chip de status no topo, abas fixas, **botão "Adicionar" fixo no rodapé da tela** (aprovado); no celular ele substitui o do cabeçalho. Meta: 5 jogos em uma tela de 390×844.
+
+### 11. Fonte única de tokens
+
+`tools/tokens.json` (cores, raios, tamanhos de texto) gerando o bloco `:root` de `app.css` e os `SolidColorBrush`/`sys:Double` de `App.xaml`, no mesmo estilo de `tools/generate-brand.py`. A CI falha se o gerado divergir do versionado.
+
+## Fora do escopo
+
+- Tema claro, nova marca/logo, nova fonte, animações além das existentes.
+- Mudar comportamento de fila, retomada, energia, webhook ou PKG. Mudanças de PKG seguem o plano próprio.
+- Reordenar a fila por arrastar, perfis de vários consoles, telemetria.
+
+## Fases de implementação
+
+| # | Entrega | Depende de | Validação |
+|---|---|---|---|
+| R1 | Tokens únicos + componentes base (etiqueta de estado, card compacto, cabeçalho de grupo, chip de status) | — | CI de tokens; E2E web atual sem regressão |
+| R2 | Fila web: grupos, métricas por estado, ações, cabeçalho agregado, toasts | R1 | E2E web pt-BR/en + novas capturas por estado |
+| R3 | Configurações web por seções; prefixo `\\?\` | R1; **após Etapa 1 do PKG Manager** para a seção Destinos | E2E web (login, webhook, PKG) |
+| R4 | Paridade WPF: Fila, Configurações e energia compacta | R2, R3 | `e2e/windows` (`--power` e padrão), capturas pt-BR/en |
+| R5 | Celular e acessibilidade: alvos 44 px, foco, leitores de tela (`aria-live`, `AutomationProperties`), contraste ≥ 4,5:1 para texto (o `--idle` `#4A5363` tem ≈2,5:1 sobre `--bg` e só pode ser usado em elementos não textuais) | R2, R3 | captura 390×844; verificação de contraste; teclado |
+
+R2 e R3 podem andar em paralelo. R4 só depois de a web estabilizar, para não redesenhar duas vezes.
+
+## Cuidados com testes existentes
+
+O E2E web localiza cards por `.job` + `.title` e lê `.pct .v` (`e2e/web/web.mjs`), além de IDs como `#authTitle` e `[data-set=…]`. Manter essas classes/IDs, ou atualizar o harness no mesmo commit. O WPF usa `x:Name` nos templates (`StageLbl`, `PctCell`, `SendNowBtn`…) — mesmo cuidado. As chaves `data-i18n` existentes ficam; textos novos entram em `web/ui/locales/*.json` e `app/locales/*.json` nos dois idiomas.
+
+## Critérios de pronto
+
+- Fila com 1 envio, 2 na fila, 1 erro e 5 concluídos cabe em 1440×900 sem rolagem e o erro aparece primeiro.
+- Nenhum card não ativo mostra `—` em métricas.
+- 5 jogos visíveis em 390×844.
+- Cada seção de Configurações cabe em 1440×900.
+- Energia armada ocupa no máximo uma linha fora da contagem.
+- Tokens web/WPF gerados de uma fonte, verificados na CI.
+- E2E web e Windows passando nos dois idiomas, com capturas novas em `e2e/*/report`.
+
+## Decisões do usuário (2026-10-14)
+
+1. Concluídos **recolhidos por padrão**.
+2. Botão **"Adicionar" fixo no rodapé** no celular: aprovado.
+3. **Sem mockups (R0)**: implementar direto a partir deste plano; a revisão visual acontece nas capturas do E2E de cada fase.
+
+## Resultado da implementação (2026-10-14)
+
+Validação: E2E web local em pt-BR e en (114 verificações, nenhuma falha), contratos de localização (1852), `tools/generate-tokens.py --check`, compilação WPF. O E2E WPF roda na CI Windows da PR. Capturas antes/depois e medidas: `docs/redesign/` (geradas por `e2e/web/showcase.mjs`).
+
+Desvios conscientes:
+
+- **Configurações**: em vez de uma seção por tela, todas as seções numa coluna com índice fixo que acompanha a rolagem. Mantém todos os campos no DOM/árvore visual (os testes web e WPF continuam preenchendo campos diretamente) e evita esconder um campo com erro de validação. Uma rolagem só, com a barra na borda da janela; a caixa de senhas cresce com o conteúdo (relato do usuário: barra de rolagem no meio da tela e hierarquia fraca).
+- **Concluído**: sem "enviado às HH:MM" — o motor não guarda o horário de conclusão; mostra o tamanho e o detalhe.
+- **Aviso de senha**: sem botão "Digitar senha"; o diálogo já abre sozinho. A correção foi juntar avisos repetidos do mesmo jogo.
+- **"Partes faltando há muito tempo"** não entra em *Precisa de você*: não há horário da última parte no estado.
+- **Windows**: energia continua em Configurações (já estava desde `0ca8baf`), agora com seção própria no índice.
+- **Desempenho (web)**: a fila deixou de reescrever todos os cartões a cada atualização do SSE; só os que mudaram.
diff --git a/docs/redesign/antes/en-configuracoes-celular.png b/docs/redesign/antes/en-configuracoes-celular.png
new file mode 100644
index 0000000..40a7a84
Binary files /dev/null and b/docs/redesign/antes/en-configuracoes-celular.png differ
diff --git a/docs/redesign/antes/en-configuracoes-desktop.png b/docs/redesign/antes/en-configuracoes-desktop.png
new file mode 100644
index 0000000..b4bfa27
Binary files /dev/null and b/docs/redesign/antes/en-configuracoes-desktop.png differ
diff --git a/docs/redesign/antes/en-fila-celular-inteira.png b/docs/redesign/antes/en-fila-celular-inteira.png
new file mode 100644
index 0000000..cb33b86
Binary files /dev/null and b/docs/redesign/antes/en-fila-celular-inteira.png differ
diff --git a/docs/redesign/antes/en-fila-celular.png b/docs/redesign/antes/en-fila-celular.png
new file mode 100644
index 0000000..97dd963
Binary files /dev/null and b/docs/redesign/antes/en-fila-celular.png differ
diff --git a/docs/redesign/antes/en-fila-desktop.png b/docs/redesign/antes/en-fila-desktop.png
new file mode 100644
index 0000000..82e352d
Binary files /dev/null and b/docs/redesign/antes/en-fila-desktop.png differ
diff --git a/docs/redesign/antes/medidas.json b/docs/redesign/antes/medidas.json
new file mode 100644
index 0000000..a172f0a
--- /dev/null
+++ b/docs/redesign/antes/medidas.json
@@ -0,0 +1,14 @@
+{
+  "pt-BR desktop altura da fila (px)": 1391,
+  "pt-BR desktop altura das configurações (px)": 1693,
+  "pt-BR celular altura da fila (px)": 2666,
+  "pt-BR celular altura das configurações (px)": 3051,
+  "en desktop altura da fila (px)": 1391,
+  "en desktop altura das configurações (px)": 1693,
+  "en celular altura da fila (px)": 2645,
+  "en celular altura das configurações (px)": 2976,
+  "avisos na tela para 2 pedidos de senha do mesmo jogo": 2,
+  "render 200 jogos — mediana (ms)": 13.3,
+  "render 200 jogos — p95 (ms)": 19.8,
+  "elementos no DOM com 200 jogos": 9779
+}
diff --git a/docs/redesign/antes/pt-BR-avisos-repetidos.png b/docs/redesign/antes/pt-BR-avisos-repetidos.png
new file mode 100644
index 0000000..e87cf22
Binary files /dev/null and b/docs/redesign/antes/pt-BR-avisos-repetidos.png differ
diff --git a/docs/redesign/antes/pt-BR-configuracoes-celular.png b/docs/redesign/antes/pt-BR-configuracoes-celular.png
new file mode 100644
index 0000000..98f0990
Binary files /dev/null and b/docs/redesign/antes/pt-BR-configuracoes-celular.png differ
diff --git a/docs/redesign/antes/pt-BR-configuracoes-desktop.png b/docs/redesign/antes/pt-BR-configuracoes-desktop.png
new file mode 100644
index 0000000..920eed5
Binary files /dev/null and b/docs/redesign/antes/pt-BR-configuracoes-desktop.png differ
diff --git a/docs/redesign/antes/pt-BR-fila-celular-inteira.png b/docs/redesign/antes/pt-BR-fila-celular-inteira.png
new file mode 100644
index 0000000..ebe30e0
Binary files /dev/null and b/docs/redesign/antes/pt-BR-fila-celular-inteira.png differ
diff --git a/docs/redesign/antes/pt-BR-fila-celular.png b/docs/redesign/antes/pt-BR-fila-celular.png
new file mode 100644
index 0000000..7eec7e8
Binary files /dev/null and b/docs/redesign/antes/pt-BR-fila-celular.png differ
diff --git a/docs/redesign/antes/pt-BR-fila-desktop.png b/docs/redesign/antes/pt-BR-fila-desktop.png
new file mode 100644
index 0000000..2c6a772
Binary files /dev/null and b/docs/redesign/antes/pt-BR-fila-desktop.png differ
diff --git a/docs/redesign/depois/en-configuracoes-celular.png b/docs/redesign/depois/en-configuracoes-celular.png
new file mode 100644
index 0000000..b3d2e55
Binary files /dev/null and b/docs/redesign/depois/en-configuracoes-celular.png differ
diff --git a/docs/redesign/depois/en-configuracoes-desktop.png b/docs/redesign/depois/en-configuracoes-desktop.png
new file mode 100644
index 0000000..c88ae66
Binary files /dev/null and b/docs/redesign/depois/en-configuracoes-desktop.png differ
diff --git a/docs/redesign/depois/en-fila-celular-concluidos-abertos.png b/docs/redesign/depois/en-fila-celular-concluidos-abertos.png
new file mode 100644
index 0000000..81de45a
Binary files /dev/null and b/docs/redesign/depois/en-fila-celular-concluidos-abertos.png differ
diff --git a/docs/redesign/depois/en-fila-celular-inteira.png b/docs/redesign/depois/en-fila-celular-inteira.png
new file mode 100644
index 0000000..4c1d405
Binary files /dev/null and b/docs/redesign/depois/en-fila-celular-inteira.png differ
diff --git a/docs/redesign/depois/en-fila-celular.png b/docs/redesign/depois/en-fila-celular.png
new file mode 100644
index 0000000..88dd4bd
Binary files /dev/null and b/docs/redesign/depois/en-fila-celular.png differ
diff --git a/docs/redesign/depois/en-fila-desktop-concluidos-abertos.png b/docs/redesign/depois/en-fila-desktop-concluidos-abertos.png
new file mode 100644
index 0000000..5b10627
Binary files /dev/null and b/docs/redesign/depois/en-fila-desktop-concluidos-abertos.png differ
diff --git a/docs/redesign/depois/en-fila-desktop.png b/docs/redesign/depois/en-fila-desktop.png
new file mode 100644
index 0000000..08d12d1
Binary files /dev/null and b/docs/redesign/depois/en-fila-desktop.png differ
diff --git a/docs/redesign/depois/medidas.json b/docs/redesign/depois/medidas.json
new file mode 100644
index 0000000..233d7cd
--- /dev/null
+++ b/docs/redesign/depois/medidas.json
@@ -0,0 +1,14 @@
+{
+  "pt-BR desktop altura da fila (px)": 900,
+  "pt-BR desktop altura das configurações (px)": 3514,
+  "pt-BR celular altura da fila (px)": 1238,
+  "pt-BR celular altura das configurações (px)": 3910,
+  "en desktop altura da fila (px)": 900,
+  "en desktop altura das configurações (px)": 3495,
+  "en celular altura da fila (px)": 1238,
+  "en celular altura das configurações (px)": 3893,
+  "avisos na tela para 2 pedidos de senha do mesmo jogo": 1,
+  "render 200 jogos — mediana (ms)": 2.2,
+  "render 200 jogos — p95 (ms)": 3.4,
+  "elementos no DOM com 200 jogos": 10026
+}
diff --git a/docs/redesign/depois/pt-BR-avisos-repetidos.png b/docs/redesign/depois/pt-BR-avisos-repetidos.png
new file mode 100644
index 0000000..9ec1d01
Binary files /dev/null and b/docs/redesign/depois/pt-BR-avisos-repetidos.png differ
diff --git a/docs/redesign/depois/pt-BR-configuracoes-celular.png b/docs/redesign/depois/pt-BR-configuracoes-celular.png
new file mode 100644
index 0000000..1b433de
Binary files /dev/null and b/docs/redesign/depois/pt-BR-configuracoes-celular.png differ
diff --git a/docs/redesign/depois/pt-BR-configuracoes-desktop.png b/docs/redesign/depois/pt-BR-configuracoes-desktop.png
new file mode 100644
index 0000000..befda60
Binary files /dev/null and b/docs/redesign/depois/pt-BR-configuracoes-desktop.png differ
diff --git a/docs/redesign/depois/pt-BR-fila-celular-concluidos-abertos.png b/docs/redesign/depois/pt-BR-fila-celular-concluidos-abertos.png
new file mode 100644
index 0000000..cf277e0
Binary files /dev/null and b/docs/redesign/depois/pt-BR-fila-celular-concluidos-abertos.png differ
diff --git a/docs/redesign/depois/pt-BR-fila-celular-inteira.png b/docs/redesign/depois/pt-BR-fila-celular-inteira.png
new file mode 100644
index 0000000..6fd9c22
Binary files /dev/null and b/docs/redesign/depois/pt-BR-fila-celular-inteira.png differ
diff --git a/docs/redesign/depois/pt-BR-fila-celular.png b/docs/redesign/depois/pt-BR-fila-celular.png
new file mode 100644
index 0000000..55bd5d7
Binary files /dev/null and b/docs/redesign/depois/pt-BR-fila-celular.png differ
diff --git a/docs/redesign/depois/pt-BR-fila-desktop-concluidos-abertos.png b/docs/redesign/depois/pt-BR-fila-desktop-concluidos-abertos.png
new file mode 100644
index 0000000..00c4ea2
Binary files /dev/null and b/docs/redesign/depois/pt-BR-fila-desktop-concluidos-abertos.png differ
diff --git a/docs/redesign/depois/pt-BR-fila-desktop.png b/docs/redesign/depois/pt-BR-fila-desktop.png
new file mode 100644
index 0000000..b129643
Binary files /dev/null and b/docs/redesign/depois/pt-BR-fila-desktop.png differ
diff --git a/e2e/ResumeChecks.cs b/e2e/ResumeChecks.cs
index c94bb9b..8bb610f 100644
--- a/e2e/ResumeChecks.cs
+++ b/e2e/ResumeChecks.cs
@@ -73,7 +73,7 @@ static async Task Recovery(string root, string work, string fault)
                 catch (SocketException) { await Task.Delay(50, stop.Token); }
             }
             var commandFile = Path.Combine(remoteRoot, "commands.txt");
-            await Until(() => File.Exists(commandFile) && File.ReadAllLines(commandFile).LastOrDefault() == "CLOSE 0", stop.Token);
+            await Until(() => File.Exists(commandFile) && CommandLog(commandFile).LastOrDefault() == "CLOSE 0", stop.Token);
             var settings = new Settings { Host = "127.0.0.1", Port = port, User = "ps5", Password = "ps5pass", InputFolder = input, ImageDir = "/images", Connections = 3, DeleteOriginal = false };
             if (fault is "replay" or "cancel-replay")
             {
@@ -98,8 +98,8 @@ static async Task Recovery(string root, string work, string fault)
                 Check(job.Stage == Stage.Verificado, fault + " transfer completes");
                 Check(SHA256.HashData(File.ReadAllBytes(Path.Combine(remote, "Image.exfat"))).SequenceEqual(SHA256.HashData(payload)), fault + " final content hash matches");
             }
-            await Until(() => File.ReadAllLines(Path.Combine(remoteRoot, "commands.txt")).LastOrDefault() == "CLOSE 0", stop.Token);
-            var commands = File.ReadAllLines(Path.Combine(remoteRoot, "commands.txt"));
+            await Until(() => CommandLog(Path.Combine(remoteRoot, "commands.txt")).LastOrDefault() == "CLOSE 0", stop.Token);
+            var commands = CommandLog(Path.Combine(remoteRoot, "commands.txt"));
             var stor = commands.Count(l => l.StartsWith("STOR "));
             var appe = commands.Count(l => l.StartsWith("APPE "));
             if (fault is "reset" or "temporary")
@@ -128,6 +128,22 @@ static async Task Until(Func<bool> predicate, CancellationToken ct)
         while (!predicate()) await Task.Delay(50, ct);
     }
 
+    // O FTP falso (Python) acrescenta linhas ao log enquanto o teste lê; no Windows a leitura concorrente pode
+    // falhar com violação de compartilhamento. Tenta de novo em vez de derrubar o teste.
+    static string[] CommandLog(string path)
+    {
+        for (var attempt = 0; ; attempt++)
+        {
+            try
+            {
+                using var stream = new FileStream(path, FileMode.Open, FileAccess.Read, FileShare.ReadWrite | FileShare.Delete);
+                using var reader = new StreamReader(stream);
+                return reader.ReadToEnd().Split('\n', StringSplitOptions.RemoveEmptyEntries).Select(l => l.TrimEnd('\r')).ToArray();
+            }
+            catch (IOException) when (attempt < 100) { Thread.Sleep(20); }
+        }
+    }
+
     static async Task RateBaseline()
     {
         var job = new Job { Key = "rate", Name = "rate" };
@@ -152,7 +168,7 @@ static async Task Replay(Settings settings, byte[] payload, string partial, stri
             await src.Reading.Task.WaitAsync(stop);
             Check(reported == 4 << 20, "partial bytes are credited before archive replay starts");
             Check(reread == 0, "archive replay reports preparation before blocking on decompression");
-            var commands = File.ReadAllLines(Path.Combine(remoteRoot, "commands.txt"));
+            var commands = CommandLog(Path.Combine(remoteRoot, "commands.txt"));
             Check(commands.Last() == "CLOSE 0", "archive replay opens no idle FTP sessions");
             if (cancel)
             {
diff --git a/e2e/web/report/en/01-criar-acesso.png b/e2e/web/report/en/01-criar-acesso.png
index 8d9b07b..44f4cef 100644
Binary files a/e2e/web/report/en/01-criar-acesso.png and b/e2e/web/report/en/01-criar-acesso.png differ
diff --git a/e2e/web/report/en/02-configuracoes.png b/e2e/web/report/en/02-configuracoes.png
index fae18b4..fe96e34 100644
Binary files a/e2e/web/report/en/02-configuracoes.png and b/e2e/web/report/en/02-configuracoes.png differ
diff --git a/e2e/web/report/en/03-fila-vazia.png b/e2e/web/report/en/03-fila-vazia.png
index 579b7aa..2851686 100644
Binary files a/e2e/web/report/en/03-fila-vazia.png and b/e2e/web/report/en/03-fila-vazia.png differ
diff --git a/e2e/web/report/en/04-senha.png b/e2e/web/report/en/04-senha.png
index 4ec39a1..ad17863 100644
Binary files a/e2e/web/report/en/04-senha.png and b/e2e/web/report/en/04-senha.png differ
diff --git a/e2e/web/report/en/05-enviando.png b/e2e/web/report/en/05-enviando.png
deleted file mode 100644
index f937f4a..0000000
Binary files a/e2e/web/report/en/05-enviando.png and /dev/null differ
diff --git a/e2e/web/report/en/06-concluido.png b/e2e/web/report/en/06-concluido.png
index 52dbeee..327dcfe 100644
Binary files a/e2e/web/report/en/06-concluido.png and b/e2e/web/report/en/06-concluido.png differ
diff --git a/e2e/web/report/en/07-pausado.png b/e2e/web/report/en/07-pausado.png
index cd02769..dd77865 100644
Binary files a/e2e/web/report/en/07-pausado.png and b/e2e/web/report/en/07-pausado.png differ
diff --git a/e2e/web/report/en/08-entrar.png b/e2e/web/report/en/08-entrar.png
index 990243e..768f38c 100644
Binary files a/e2e/web/report/en/08-entrar.png and b/e2e/web/report/en/08-entrar.png differ
diff --git a/e2e/web/report/en/09-celular.png b/e2e/web/report/en/09-celular.png
index 6fd0205..d3e6087 100644
Binary files a/e2e/web/report/en/09-celular.png and b/e2e/web/report/en/09-celular.png differ
diff --git a/e2e/web/report/en/10-webhook.png b/e2e/web/report/en/10-webhook.png
index a0cd356..669d00d 100644
Binary files a/e2e/web/report/en/10-webhook.png and b/e2e/web/report/en/10-webhook.png differ
diff --git a/e2e/web/report/en/11-pkg.png b/e2e/web/report/en/11-pkg.png
index 757a7ee..101f39f 100644
Binary files a/e2e/web/report/en/11-pkg.png and b/e2e/web/report/en/11-pkg.png differ
diff --git a/e2e/web/report/pt-BR/01-criar-acesso.png b/e2e/web/report/pt-BR/01-criar-acesso.png
index c6f6696..5f3d879 100644
Binary files a/e2e/web/report/pt-BR/01-criar-acesso.png and b/e2e/web/report/pt-BR/01-criar-acesso.png differ
diff --git a/e2e/web/report/pt-BR/02-configuracoes.png b/e2e/web/report/pt-BR/02-configuracoes.png
index 89d2e3a..9266ac8 100644
Binary files a/e2e/web/report/pt-BR/02-configuracoes.png and b/e2e/web/report/pt-BR/02-configuracoes.png differ
diff --git a/e2e/web/report/pt-BR/03-fila-vazia.png b/e2e/web/report/pt-BR/03-fila-vazia.png
index 1e75f8c..39825fc 100644
Binary files a/e2e/web/report/pt-BR/03-fila-vazia.png and b/e2e/web/report/pt-BR/03-fila-vazia.png differ
diff --git a/e2e/web/report/pt-BR/04-senha.png b/e2e/web/report/pt-BR/04-senha.png
index bda0899..b29bdd2 100644
Binary files a/e2e/web/report/pt-BR/04-senha.png and b/e2e/web/report/pt-BR/04-senha.png differ
diff --git a/e2e/web/report/pt-BR/05-enviando.png b/e2e/web/report/pt-BR/05-enviando.png
index 6667f99..098dec7 100644
Binary files a/e2e/web/report/pt-BR/05-enviando.png and b/e2e/web/report/pt-BR/05-enviando.png differ
diff --git a/e2e/web/report/pt-BR/06-concluido.png b/e2e/web/report/pt-BR/06-concluido.png
index 5f8378c..260691e 100644
Binary files a/e2e/web/report/pt-BR/06-concluido.png and b/e2e/web/report/pt-BR/06-concluido.png differ
diff --git a/e2e/web/report/pt-BR/07-pausado.png b/e2e/web/report/pt-BR/07-pausado.png
index 3cf7c37..7303bcf 100644
Binary files a/e2e/web/report/pt-BR/07-pausado.png and b/e2e/web/report/pt-BR/07-pausado.png differ
diff --git a/e2e/web/report/pt-BR/08-entrar.png b/e2e/web/report/pt-BR/08-entrar.png
index 63e5368..4f257cc 100644
Binary files a/e2e/web/report/pt-BR/08-entrar.png and b/e2e/web/report/pt-BR/08-entrar.png differ
diff --git a/e2e/web/report/pt-BR/09-celular.png b/e2e/web/report/pt-BR/09-celular.png
index f51c5f5..7b6ca3c 100644
Binary files a/e2e/web/report/pt-BR/09-celular.png and b/e2e/web/report/pt-BR/09-celular.png differ
diff --git a/e2e/web/report/pt-BR/10-webhook.png b/e2e/web/report/pt-BR/10-webhook.png
index 7c19ab4..2722a84 100644
Binary files a/e2e/web/report/pt-BR/10-webhook.png and b/e2e/web/report/pt-BR/10-webhook.png differ
diff --git a/e2e/web/report/pt-BR/11-pkg.png b/e2e/web/report/pt-BR/11-pkg.png
index 883041e..606107a 100644
Binary files a/e2e/web/report/pt-BR/11-pkg.png and b/e2e/web/report/pt-BR/11-pkg.png differ
diff --git a/e2e/web/showcase.mjs b/e2e/web/showcase.mjs
new file mode 100644
index 0000000..6c262e7
--- /dev/null
+++ b/e2e/web/showcase.mjs
@@ -0,0 +1,164 @@
+// Vitrine da interface web: sobe o servidor local, cria o acesso e injeta na Fila um estado fixo com todos os casos
+// (erro, PKG pronto, enviando, pausado, aguardando partes, concluídos). Gera capturas comparáveis entre versões e mede a
+// renderização da fila. Não testa comportamento — isso é o web.mjs.
+//
+// Uso: dotnet build web -c Release && (cd e2e/web && node showcase.mjs [pasta-de-saída])
+//      FERRY_WEB_DLL=<outro ferry.dll> compara outra versão com o mesmo estado.
+import { chromium } from "playwright";
+import { spawn } from "node:child_process";
+import fs from "node:fs";
+import net from "node:net";
+import os from "node:os";
+import path from "node:path";
+
+const root = path.resolve(import.meta.dirname, "..", "..");
+const out = path.resolve(process.argv[2] || path.join(root, "e2e", "web", "report", "showcase"));
+const dll = process.env.FERRY_WEB_DLL || path.join(root, "web", "bin", "Release", "net10.0", "ferry.dll");
+if (!fs.existsSync(dll)) throw new Error("Build web Release first: " + dll);
+fs.mkdirSync(out, { recursive: true });
+const data = fs.mkdtempSync(path.join(os.tmpdir(), "ferry-showcase-"));
+const port = await new Promise(r => { const s = net.createServer().listen(0, "127.0.0.1", () => { const p = s.address().port; s.close(() => r(p)); }); });
+const server = spawn("dotnet", [dll], { env: { ...process.env, FERRY_DATA: data, FERRY_GAMES: path.join(data, "games"), FERRY_PORT: String(port) }, stdio: "ignore" });
+process.once("exit", () => server.kill());
+const base = `http://127.0.0.1:${port}`;
+for (let i = 0; ; i++) {
+  try { if ((await fetch(base + "/")).ok) break; } catch { }
+  if (i > 300) throw new Error("server did not start");
+  await new Promise(r => setTimeout(r, 100));
+}
+
+const GB = 2 ** 30;
+const job = (id, o) => ({
+  id, name: o.name ?? o.title, title: o.title ?? "", titleId: o.titleId ?? "", packageFormat: o.packageFormat ?? null, stage: o.stage,
+  stageText: "", stageMessage: null, detail: o.detail ?? "", detailMessage: null, currentFile: o.file ?? "",
+  progress: o.progress ?? 0, amount: "", rateValue: "", rateUnit: "", etaValue: "", etaUnit: "",
+  doneBytes: Math.round((o.total ?? 0) * (o.progress ?? 0) / 100), totalBytes: o.total ?? 0, rate: o.rate ?? 0, secondsRemaining: o.eta ?? null,
+  icon: o.icon ? 1 : 0, isActive: !!o.active, canPause: !!o.active, canResume: o.stage === "Pausado", canCancel: !["Verificado", "InstalacaoSolicitada", "Erro"].includes(o.stage),
+  canRetry: o.stage === "Erro", canSendNow: o.stage === "Pausado" || o.stage === "NaFila", canRequestInstall: o.stage === "PacotePronto",
+});
+const texts = {
+  "pt-BR": { parts: "faltando part3.rar", wrong: "Senha incorreta. Use Tentar de novo para digitar outra.", pkg: "PKG enviado para /data/etaHEN/pkgs. Solicite a instalação ou abra o Package Installer no PS5.", done: "Enviado e conferido antes de reabrir", req: "Solicitação aceita. Acompanhe a instalação no PS5." },
+  en: { parts: "missing part3.rar", wrong: "Incorrect password. Use Retry to enter another one.", pkg: "PKG sent to /data/etaHEN/pkgs. Request installation or open Package Installer on the PS5.", done: "Sent and verified before reopening", req: "Request accepted. Follow the installation on the PS5." },
+};
+function state(locale, extra = {}) {
+  const x = texts[locale];
+  const jobs = [
+    job("kestrel", { name: "Kestrel_Run_v1.02", stage: "AguardandoPartes", detail: x.parts }),
+    job("hollow", { title: "Hollow Meridian", titleId: "PPSA04512", stage: "Enviando", active: true, progress: 62.4, total: 29.2 * GB, rate: 87.3 * 2 ** 20, eta: 129, icon: "sun", file: "Image0/data/level_07.pak" }),
+    job("ashen", { title: "Ashen Tide", titleId: "PPSA07731", stage: "Pausado", progress: 18, total: 41.87 * GB, icon: "tide" }),
+    job("blue", { name: "Blue_Harbor_v1.00.rar", stage: "Erro", detail: x.wrong }),
+    job("pkgweb", { name: "PKGWEB", packageFormat: "PS4 / CNT", stage: "PacotePronto", progress: 100, total: 3.1 * GB, detail: x.pkg }),
+    job("north", { title: "Northbound", titleId: "PPSA01180", stage: "Verificado", progress: 100, total: 12.4 * GB, icon: "north", detail: x.done }),
+    job("imgw", { name: "IMGW", stage: "Verificado", progress: 100, total: 0.4 * GB, detail: x.done }),
+    job("pkgarch", { name: "PKGARCH", packageFormat: "PS4 / CNT", stage: "InstalacaoSolicitada", progress: 100, total: 2.2 * GB, detail: x.req }),
+    job("w1", { title: "Jogo Web", titleId: "PPSA09001", stage: "Verificado", progress: 100, total: 0.12 * GB, icon: "sun", detail: x.done }),
+    ...(extra.jobs || []),
+  ];
+  const count = (...s) => jobs.filter(j => s.includes(j.stage)).length;
+  return {
+    language: locale, jobs, password: extra.password ?? null,
+    summary: { sending: count("Extraindo", "Enviando"), queued: count("NaFila", "AguardandoPartes", "Pausado"), done: count("Verificado"), requested: count("InstalacaoSolicitada"),
+      ready: count("PacotePronto"), submitting: 0, unknown: 0, errors: count("Erro"), rate: jobs.filter(j => j.isActive).reduce((a, j) => a + j.rate, 0) },
+    ps5: { host: "192.168.1.50", port: 2121, remoteDir: "/mnt/ext1/homebrew", status: "online", message: "", messageData: null, found: null },
+  };
+}
+const covers = {
+  sun: `<rect width="64" height="64" fill="#13263b"/><circle cx="40" cy="30" r="12" fill="#e9a54f"/><path d="M0 34h64" stroke="#e9a54f"/><path d="M6 34l8-10 6 6 5-8 8 12z" fill="#0c1826"/>`,
+  tide: `<rect width="64" height="64" fill="#26262a"/><rect x="14" y="10" width="3" height="26" fill="#cbbba5"/><rect x="20" y="16" width="3" height="20" fill="#8d806f"/><path d="M0 44q16-8 32 0t32 0v20H0z" fill="#3a3a40"/>`,
+  north: `<rect width="64" height="64" fill="#1b2b33"/><path d="M0 50 22 18l12 16 8-10 22 26z" fill="#d7e3ea"/><path d="M0 50 22 18l6 8-10 24z" fill="#9fb3bf"/>`,
+};
+
+const browser = await chromium.launch();
+const results = {};
+async function session(locale, viewport, events) {
+  const ctx = await browser.newContext({ viewport, locale, deviceScaleFactor: 1 });
+  const page = await ctx.newPage();
+  await page.route("**/api/jobs/*/icon*", route => {
+    const id = route.request().url().split("/api/jobs/")[1].split("/")[0];
+    const art = { hollow: covers.sun, ashen: covers.tide, north: covers.north, w1: covers.sun }[id] || covers.north;
+    route.fulfill({ contentType: "image/svg+xml", body: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64">${art}</svg>` });
+  });
+  await page.route("**/api/events", route => route.fulfill({ status: 200, contentType: "text/event-stream", headers: { "Cache-Control": "no-cache" }, body: events() }));
+  await ctx.addCookies([{ name: cookieName, value: cookieValue, url: base }]);
+  return { ctx, page };
+}
+const sse = (name, payload) => `event: ${name}\ndata: ${JSON.stringify(payload)}\n\nretry: 600000\n\n`;
+
+// acesso e configurações reais (só a fila é injetada)
+const setup = await fetch(base + "/api/auth/setup", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ user: "admin", password: "showcase-pass" }) });
+const cookie = setup.headers.get("set-cookie").split(";")[0];
+await fetch(base + "/api/settings", { method: "PUT", headers: { "Content-Type": "application/json", cookie }, body: JSON.stringify({ host: "192.168.1.50", port: 2121 }) });
+const [cookieName, cookieValue] = cookie.split("=");
+
+const perfOnly = process.env.SHOWCASE_PERF_ONLY === "1";
+for (const locale of perfOnly ? [] : ["pt-BR", "en"]) {
+  await fetch(base + "/api/settings", { method: "PUT", headers: { "Content-Type": "application/json", cookie }, body: JSON.stringify({ language: locale }) });
+  for (const [label, viewport] of [["desktop", { width: 1440, height: 900 }], ["celular", { width: 390, height: 844 }]]) {
+    const { ctx, page } = await session(locale, viewport, () => sse("state", state(locale)));
+    await page.goto(base + "/");
+    await page.locator(".job").first().waitFor({ state: "attached" });
+    await page.waitForTimeout(3000); // a marca termina a animação de entrada
+    await page.screenshot({ path: path.join(out, `${locale}-fila-${label}.png`) });
+    // na página inteira, o botão fixo do rodapé cairia no meio da imagem; a captura da tela já o mostra
+    const hideFab = async hidden => page.evaluate(h => { for (const el of document.querySelectorAll(".fab")) el.style.visibility = h ? "hidden" : ""; }, hidden);
+    if (label === "celular") { await hideFab(true); await page.screenshot({ path: path.join(out, `${locale}-fila-${label}-inteira.png`), fullPage: true }); await hideFab(false); }
+    // a fila inteira: quanto rola para ver tudo (concluídos recolhidos contam como uma linha)
+    results[`${locale} ${label} altura da fila (px)`] = await page.evaluate(() => document.documentElement.scrollHeight);
+    const toggle = page.locator("#doneToggle");
+    if (await toggle.count()) {
+      await toggle.click(); await page.waitForTimeout(250);
+      if (label === "celular") await hideFab(true);
+      await page.screenshot({ path: path.join(out, `${locale}-fila-${label}-concluidos-abertos.png`), fullPage: true });
+      await hideFab(false);
+      await toggle.click(); // volta ao padrão (recolhido) para a próxima abertura
+    }
+    await page.click('.nav[data-page="settings"]');
+    await page.evaluate(() => scrollTo(0, 0));
+    await page.waitForTimeout(300);
+    await page.screenshot({ path: path.join(out, `${locale}-configuracoes-${label}.png`) });
+    results[`${locale} ${label} altura das configurações (px)`] = await page.evaluate(() => document.documentElement.scrollHeight);
+    await ctx.close();
+  }
+}
+
+// avisos repetidos: senha pedida duas vezes para o mesmo jogo (a segunda depois de uma senha incorreta)
+if (!perfOnly) {
+  const locale = "pt-BR";
+  const notice = seq => sse("notice", { seq, kind: "password", titleMessage: { key: "web.passwordTitle", args: [] }, textMessage: { key: "web.passwordText", args: ["Blue_Harbor_v1.00.rar"] }, title: "", text: "", jobId: "blue" });
+  const { ctx, page } = await session(locale, { width: 1440, height: 900 }, () => sse("state", state(locale)) + notice(1) + notice(2));
+  await page.goto(base + "/");
+  await page.locator(".toast").first().waitFor();
+  await page.waitForTimeout(300);
+  results["avisos na tela para 2 pedidos de senha do mesmo jogo"] = await page.locator(".toast").count();
+  await page.screenshot({ path: path.join(out, `${locale}-avisos-repetidos.png`) });
+  await ctx.close();
+}
+
+// desempenho: render() com 200 jogos, 300 atualizações de progresso (o SSE manda até 4/s); as 20 primeiras aquecem
+{
+  const locale = "pt-BR";
+  const big = state(locale, { jobs: Array.from({ length: 191 }, (_, i) => job("bulk" + i, { name: `Jogo_${String(i).padStart(3, "0")}.rar`, stage: i % 3 ? "NaFila" : "Verificado", progress: i % 3 ? 0 : 100, total: (i + 1) * 0.1 * GB })) });
+  const { ctx, page } = await session(locale, { width: 1440, height: 900 }, () => sse("state", state(locale)));
+  await page.goto(base + "/");
+  await page.locator(".job").first().waitFor({ state: "attached" });
+  const perf = await page.evaluate(big => {
+    render(big);
+    const times = [];
+    for (let i = 0; i < 320; i++) {
+      big.jobs[1].progress = 62.4 + i / 10; big.jobs[1].doneBytes += 2 ** 20 * 20;
+      const t0 = performance.now(); render(big); document.body.offsetHeight; if (i >= 20) times.push(performance.now() - t0);
+    }
+    times.sort((a, b) => a - b);
+    return { median: times[150], p95: times[285], nodes: document.querySelectorAll("*").length, rows: document.querySelectorAll(".job").length };
+  }, big);
+  results["render 200 jogos — mediana (ms)"] = +perf.median.toFixed(2);
+  results["render 200 jogos — p95 (ms)"] = +perf.p95.toFixed(2);
+  results["elementos no DOM com 200 jogos"] = perf.nodes;
+  await ctx.close();
+}
+
+await browser.close();
+server.kill();
+fs.writeFileSync(path.join(out, "medidas.json"), JSON.stringify(results, null, 2) + "\n");
+console.log(JSON.stringify(results, null, 2));
+fs.rmSync(data, { recursive: true, force: true });
diff --git a/e2e/web/web.mjs b/e2e/web/web.mjs
index 3e58baa..6283505 100644
--- a/e2e/web/web.mjs
+++ b/e2e/web/web.mjs
@@ -182,11 +182,11 @@ const startServer = () => {
   server.stdout.on("data", d => serverLog.push(d.toString()));
   server.stderr.on("data", d => serverLog.push(d.toString()));
 };
-const stopServer = async () => {
+const stopServer = async (signal = "SIGTERM") => {
   if (!localMode) { try { docker("rm", "-f", name); } catch { } return; }
   if (!server || server.exitCode !== null) return;
   const closed = new Promise(resolve => server.once("exit", resolve));
-  server.kill();
+  server.kill(signal);
   await closed;
 };
 startServer();
@@ -304,6 +304,15 @@ try {
   await until(async () => (await page.locator("#statusTitle").textContent()) === "PS5 online", 5000, "cartão PS5 online");
   shotsTaken.config = await shot("02-configuracoes");
   check("Testar conexão", true, test);
+  // sem resposta do servidor (rede caiu): o resultado diz isso em vez de ficar em "Testando…", sem erro solto na página
+  const errorsBefore = pageErrors.length;
+  await page.route("**/api/ps5/test", route => route.abort("connectionreset"));
+  await page.click("#testBtn");
+  const offline = await until(async () => await page.locator("#testResult").evaluate(el => el.classList.contains("fail")) && await page.locator("#testResult").textContent(), 5000, "teste sem resposta do servidor");
+  await page.unroute("**/api/ps5/test");
+  check("Teste sem resposta do servidor não fica preso", offline.includes(locale === "en" ? "No response from the Ferry server" : "Sem resposta do servidor Ferry") && await page.locator("#testBtn").isEnabled() && pageErrors.length === errorsBefore, offline);
+  await page.click("#testBtn");
+  await until(async () => (await page.locator("#testResult").textContent()).startsWith(expected.connected), 15000, "teste de conexão de novo");
   const originalLines = await (await page.request.get(base + "/api/log")).json();
   const translatedLog = locale === "en" ? "Teste de conexão:" : "Connection test:";
   await switchLanguage(locale === "en" ? "pt-BR" : "en");
@@ -463,7 +472,7 @@ try {
   check("Reinício interrompe uma transferência ainda incompleta", cut > 0 && cut < fs.statSync(imgw).size && hookEvents("completed", "IMGW").length === 0);
   // A graceful Docker stop can finish FTP while shutdown discards best-effort notifications.
   // Kill immediately so this test exercises recovery and a new completion after reopening.
-  if (localMode) { await stopServer(); startServer(); } else { docker("kill", "--signal", "KILL", name); docker("start", name); }
+  if (localMode) { await stopServer("SIGKILL"); startServer(); } else { docker("kill", "--signal", "KILL", name); docker("start", name); }
   await until(up200, 30000, "container de volta");
   await until(async () => (await stage("IMGW")) === "Verificado", 180000, "IMGW concluído depois de reiniciar");
   const stillIn = await page.locator("#shell").isVisible() && !(await page.locator("#auth").isVisible());
@@ -568,7 +577,7 @@ try {
   check("PKG compactado chega íntegro, sem sucesso em resposta perdida", dpiRequests.at(-1)?.hash === sha(pkg)
     && fs.existsSync(path.join(games, "PKGARCH.zip")) && hookEvents("installation_requested", "PKGARCH").length === 0);
   const requestsBefore = dpiRequests.length;
-  if (localMode) { await stopServer(); startServer(); } else { docker("kill", "--signal", "KILL", name); docker("start", name); }
+  if (localMode) { await stopServer("SIGKILL"); startServer(); } else { docker("kill", "--signal", "KILL", name); docker("start", name); }
   await until(up200, 30000, "servidor reiniciado com PKG");
   await page.reload();
   await until(async () => await stage("PKGARCH") === "VerifiqueNoPs5" && await stage("PKGWEB") === "InstalacaoSolicitada", 15000, "PKGs restaurados");
diff --git a/e2e/windows/Program.cs b/e2e/windows/Program.cs
index 851ad6c..46b8150 100644
--- a/e2e/windows/Program.cs
+++ b/e2e/windows/Program.cs
@@ -252,6 +252,11 @@ static void PackageTransfer(MainWindow window, string data, string root)
             Assert(job!.Stage == Stage.InstalacaoSolicitada, "WPF package accepted: " + job.Detail);
             Assert(received.Count == 1 && received.Single().Hash.SequenceEqual(SHA256.HashData(bytes)), "WPF package hash before DPI");
             Assert(File.Exists(source), "WPF retains PKG original despite DeleteOriginal");
+            // a instalação solicitada vai para Concluídos, que começa recolhido; abre o grupo para ler o cartão
+            Invoke(window, "RefreshSummary");
+            Assert(QueueGroups.Of(job) == "done" && !QueueGroups.Current.DoneExpanded, "requested installation moves to collapsed Finished group");
+            QueueGroups.Current.DoneExpanded = true;
+            Pump();
             foreach (var locale in new[] { "pt-BR", "en" })
             {
                 SelectLanguage(window, locale);
diff --git a/e2e_report_web.md b/e2e_report_web.md
index abd4f8b..afc5502 100644
--- a/e2e_report_web.md
+++ b/e2e_report_web.md
@@ -1,9 +1,9 @@
 # Relatório E2E web — Ferry self-hosted (pt-BR)
 
-- Data: 2026-09-30 17:23:35 UTC
-- Resultado geral: **PASSOU**  (87s)
+- Data: 2026-10-14 00:58:18 UTC
+- Resultado geral: **PASSOU**  (93s)
 - Servidor: DLL local .NET, dados isolados; Chromium (Playwright). Docker não exercitado nesta rodada.
-- PS5 falso: pyftpdlib imitando o ftpsrv novo (com APPE), 40 MB/s por conexão; arquivos de teste gerados com 7-Zip 24.07 (x64) : Copyright (c) 1999-2024 Igor Pavlov : 2024-06-19
+- PS5 falso: pyftpdlib imitando o ftpsrv novo (com APPE), 40 MB/s por conexão; arquivos de teste gerados com 7-Zip 23.01 (x64) : Copyright (c) 1999-2023 Igor Pavlov : 2023-06-20
 
 | Verificação | Resultado |
 |---|---|
@@ -20,8 +20,9 @@
 | Primeira abertura cria o usuário | ✅ tela "Criar acesso", senha curta: "A senha precisa ter pelo menos 8 caracteres.", auth.json criado |
 | Idioma inválido não altera preferência | ✅  |
 | Escolha explícita precede navegador | ✅  |
-| Configurações salvam sozinhas e recusam o inválido | ✅ porta "abc" → "A porta é um número de 1 a 65535." (continuou 2121); host/porta/usuário/senha salvos; pasta monitorada = \\?\C:\Users\ADMINI~1\AppData\Local\Temp\ferry-web-e2e-pt-BR\games; GET atrasado 1,5 s não desfez o que foi digitado=true |
+| Configurações salvam sozinhas e recusam o inválido | ✅ porta "abc" → "A porta é um número de 1 a 65535." (continuou 2121); host/porta/usuário/senha salvos; pasta monitorada = /tmp/ferry-web-e2e-pt-BR/games; GET atrasado 1,5 s não desfez o que foi digitado=true |
 | Testar conexão | ✅ Conectado, mas /mnt/ext1/homebrew não existe (será criado no envio). |
+| Teste sem resposta do servidor não fica preso | ✅ Sem resposta do servidor Ferry (Failed to fetch). Confira a conexão e tente de novo. |
 | Log já recebido muda de idioma sem perder sequência | ✅  |
 | Testar aguarda a URL salva e funciona desligado | ✅  |
 | API valida serviço e tipo do interruptor | ✅  |
@@ -33,19 +34,20 @@
 | Idioma durante upload preserva campo editado | ✅  |
 | Webhook de senha chega antes da resposta ao diálogo | ✅  |
 | Idioma preserva diálogo e senha digitada | ✅  |
-| Upload pelo navegador → senha no navegador → envio ao PS5 | ✅ 8 volumes .7z enviados pela página; diálogo "Arquivo protegido por senha", 1ª senha errada → "Senha incorreta", 2ª certa; estado Verificado (/mnt/ext1/homebrew/PPSA09001-Jogo Web); 7/7 SHA-256 iguais; capa e PPSA09001; senha entrou nas senhas conhecidas=true; cartão durante o envio "(o envio acabou antes de pegar o meio)" |
+| Upload pelo navegador → senha no navegador → envio ao PS5 | ✅ 8 volumes .7z enviados pela página; diálogo "Arquivo protegido por senha", 1ª senha errada → "Senha incorreta", 2ª certa; estado Verificado (/mnt/ext1/homebrew/PPSA09001-Jogo Web); 7/7 SHA-256 iguais; capa e PPSA09001; senha entrou nas senhas conhecidas=true; cartão durante o envio "PS5 online" |
 | Webhook de senha sem resposta não bloqueia diálogo nem FTP | ✅  |
 | Webhook contém evento, jogo e idioma sem repetir senha incorreta | ✅  |
 | Idioma preserva card pausado e progresso | ✅  |
 | Idioma durante transferência mantém andamento | ✅  |
 | Reinício interrompe uma transferência ainda incompleta | ✅  |
 | Idioma persiste após reiniciar e recarregar | ✅  |
-| Pausar e retomar pela página | ✅ congelou em 21.8% por 1,5 s e retomou |
-| Reiniciar o servidor local no meio do envio | ✅ reinício da DLL local em 64.2% (337797925 bytes no PS5); voltou sozinho, continuou com APPE (2x após reabrir), hash confere, sem .ferry-part; login continuou valendo=true; Jogo Web continuou Verificado ("Enviado e conferido antes de reabrir") sem reenviar nada |
+| Pausar e retomar pela página | ✅ congelou em 22.5% por 1,5 s e retomou |
+| Reiniciar o servidor local no meio do envio | ✅ reinício da DLL local em 42% (251852176 bytes no PS5); voltou sozinho, continuou com APPE (2x após reabrir), hash confere, sem .ferry-part; login continuou valendo=true; Jogo Web continuou Verificado ("Enviado e conferido antes de reabrir") sem reenviar nada |
 | Webhook persiste ao reiniciar e não repete conclusão restaurada | ✅  |
 | Upload continua de onde parou | ✅ 1º bloco (16 MB) pela API; bloco repetido → 409; parcial não entrou na fila=true; a página continuou do byte 16777216 (3 bloco(s)); arquivo no servidor e no PS5 com o mesmo hash |
 | Adicionar de novo um jogo concluído | ✅ reenvio pela página começou do byte 0 (4 blocos, sem pular por ter o mesmo tamanho); o card voltou para a fila e parou em "Jogo já instalado no PS5 — o loader pode…" |
 | Webhook de erro não exporta senha nem diagnósticos brutos | ✅  |
+| Guia DPI acessível e traduzido | ✅  |
 | Porta DPI inválida preserva configuração | ✅  |
 | Teste DPI não instala | ✅  |
 | Modo padrão apenas envia, zero solicitações DPI | ✅  |
@@ -71,6 +73,7 @@
 ![10-webhook](e2e/web/report/pt-BR/10-webhook.png)
 ![03-fila-vazia](e2e/web/report/pt-BR/03-fila-vazia.png)
 ![04-senha](e2e/web/report/pt-BR/04-senha.png)
+![05-enviando](e2e/web/report/pt-BR/05-enviando.png)
 ![06-concluido](e2e/web/report/pt-BR/06-concluido.png)
 ![07-pausado](e2e/web/report/pt-BR/07-pausado.png)
 ![11-pkg](e2e/web/report/pt-BR/11-pkg.png)
@@ -82,10 +85,10 @@ Repetir: `dotnet build web -c Release`; em `e2e/web`, `npm ci`, `npx playwright
 
 # Relatório E2E web — Ferry self-hosted (en)
 
-- Data: 2026-09-30 17:25:01 UTC
-- Resultado geral: **PASSOU**  (85s)
+- Data: 2026-10-14 00:59:47 UTC
+- Resultado geral: **PASSOU**  (88s)
 - Servidor: DLL local .NET, dados isolados; Chromium (Playwright). Docker não exercitado nesta rodada.
-- PS5 falso: pyftpdlib imitando o ftpsrv novo (com APPE), 40 MB/s por conexão; arquivos de teste gerados com 7-Zip 24.07 (x64) : Copyright (c) 1999-2024 Igor Pavlov : 2024-06-19
+- PS5 falso: pyftpdlib imitando o ftpsrv novo (com APPE), 40 MB/s por conexão; arquivos de teste gerados com 7-Zip 23.01 (x64) : Copyright (c) 1999-2023 Igor Pavlov : 2023-06-20
 
 | Verificação | Resultado |
 |---|---|
@@ -102,8 +105,9 @@ Repetir: `dotnet build web -c Release`; em `e2e/web`, `npm ci`, `npx playwright
 | Primeira abertura cria o usuário | ✅ tela "Create access", senha curta: "The password must have at least 8 characters.", auth.json criado |
 | Idioma inválido não altera preferência | ✅  |
 | Escolha explícita precede navegador | ✅  |
-| Configurações salvam sozinhas e recusam o inválido | ✅ porta "abc" → "The port must be a number from 1 to 65535." (continuou 2121); host/porta/usuário/senha salvos; pasta monitorada = \\?\C:\Users\ADMINI~1\AppData\Local\Temp\ferry-web-e2e-en\games; GET atrasado 1,5 s não desfez o que foi digitado=true |
+| Configurações salvam sozinhas e recusam o inválido | ✅ porta "abc" → "The port must be a number from 1 to 65535." (continuou 2121); host/porta/usuário/senha salvos; pasta monitorada = /tmp/ferry-web-e2e-en/games; GET atrasado 1,5 s não desfez o que foi digitado=true |
 | Testar conexão | ✅ Connected, but /mnt/ext1/homebrew does not exist (it will be created during transfer). |
+| Teste sem resposta do servidor não fica preso | ✅ No response from the Ferry server (Failed to fetch). Check the connection and try again. |
 | Log já recebido muda de idioma sem perder sequência | ✅  |
 | Testar aguarda a URL salva e funciona desligado | ✅  |
 | API valida serviço e tipo do interruptor | ✅  |
@@ -115,19 +119,20 @@ Repetir: `dotnet build web -c Release`; em `e2e/web`, `npm ci`, `npx playwright
 | Idioma durante upload preserva campo editado | ✅  |
 | Webhook de senha chega antes da resposta ao diálogo | ✅  |
 | Idioma preserva diálogo e senha digitada | ✅  |
-| Upload pelo navegador → senha no navegador → envio ao PS5 | ✅ 8 volumes .7z enviados pela página; diálogo "Password-protected archive", 1ª senha errada → "Senha incorreta", 2ª certa; estado Verificado (/mnt/ext1/homebrew/PPSA09001-Jogo Web); 7/7 SHA-256 iguais; capa e PPSA09001; senha entrou nas senhas conhecidas=true; cartão durante o envio "PS5 online" |
+| Upload pelo navegador → senha no navegador → envio ao PS5 | ✅ 8 volumes .7z enviados pela página; diálogo "Password-protected archive", 1ª senha errada → "Senha incorreta", 2ª certa; estado Verificado (/mnt/ext1/homebrew/PPSA09001-Jogo Web); 7/7 SHA-256 iguais; capa e PPSA09001; senha entrou nas senhas conhecidas=true; cartão durante o envio "(o envio acabou antes de pegar o meio)" |
 | Webhook de senha sem resposta não bloqueia diálogo nem FTP | ✅  |
 | Webhook contém evento, jogo e idioma sem repetir senha incorreta | ✅  |
 | Idioma preserva card pausado e progresso | ✅  |
 | Idioma durante transferência mantém andamento | ✅  |
 | Reinício interrompe uma transferência ainda incompleta | ✅  |
 | Idioma persiste após reiniciar e recarregar | ✅  |
-| Pausar e retomar pela página | ✅ congelou em 21.8% por 1,5 s e retomou |
-| Reiniciar o servidor local no meio do envio | ✅ reinício da DLL local em 64.2% (337799624 bytes no PS5); voltou sozinho, continuou com APPE (2x após reabrir), hash confere, sem .ferry-part; login continuou valendo=true; Jogo Web continuou Verificado ("Sent and verified before reopening") sem reenviar nada |
+| Pausar e retomar pela página | ✅ congelou em 22.5% por 1,5 s e retomou |
+| Reiniciar o servidor local no meio do envio | ✅ reinício da DLL local em 41.9% (251754141 bytes no PS5); voltou sozinho, continuou com APPE (2x após reabrir), hash confere, sem .ferry-part; login continuou valendo=true; Jogo Web continuou Verificado ("Sent and verified before reopening") sem reenviar nada |
 | Webhook persiste ao reiniciar e não repete conclusão restaurada | ✅  |
 | Upload continua de onde parou | ✅ 1º bloco (16 MB) pela API; bloco repetido → 409; parcial não entrou na fila=true; a página continuou do byte 16777216 (3 bloco(s)); arquivo no servidor e no PS5 com o mesmo hash |
 | Adicionar de novo um jogo concluído | ✅ reenvio pela página começou do byte 0 (4 blocos, sem pular por ter o mesmo tamanho); o card voltou para a fila e parou em "Game already installed on the PS5 — the …" |
 | Webhook de erro não exporta senha nem diagnósticos brutos | ✅  |
+| Guia DPI acessível e traduzido | ✅  |
 | Porta DPI inválida preserva configuração | ✅  |
 | Teste DPI não instala | ✅  |
 | Modo padrão apenas envia, zero solicitações DPI | ✅  |
@@ -153,7 +158,6 @@ Repetir: `dotnet build web -c Release`; em `e2e/web`, `npm ci`, `npx playwright
 ![10-webhook](e2e/web/report/en/10-webhook.png)
 ![03-fila-vazia](e2e/web/report/en/03-fila-vazia.png)
 ![04-senha](e2e/web/report/en/04-senha.png)
-![05-enviando](e2e/web/report/en/05-enviando.png)
 ![06-concluido](e2e/web/report/en/06-concluido.png)
 ![07-pausado](e2e/web/report/en/07-pausado.png)
 ![11-pkg](e2e/web/report/en/11-pkg.png)
diff --git a/e2e_report_web_en.md b/e2e_report_web_en.md
index eaa364e..e41bf21 100644
--- a/e2e_report_web_en.md
+++ b/e2e_report_web_en.md
@@ -1,9 +1,9 @@
 # Relatório E2E web — Ferry self-hosted (en)
 
-- Data: 2026-09-30 17:25:01 UTC
-- Resultado geral: **PASSOU**  (85s)
+- Data: 2026-10-14 00:59:47 UTC
+- Resultado geral: **PASSOU**  (88s)
 - Servidor: DLL local .NET, dados isolados; Chromium (Playwright). Docker não exercitado nesta rodada.
-- PS5 falso: pyftpdlib imitando o ftpsrv novo (com APPE), 40 MB/s por conexão; arquivos de teste gerados com 7-Zip 24.07 (x64) : Copyright (c) 1999-2024 Igor Pavlov : 2024-06-19
+- PS5 falso: pyftpdlib imitando o ftpsrv novo (com APPE), 40 MB/s por conexão; arquivos de teste gerados com 7-Zip 23.01 (x64) : Copyright (c) 1999-2023 Igor Pavlov : 2023-06-20
 
 | Verificação | Resultado |
 |---|---|
@@ -20,8 +20,9 @@
 | Primeira abertura cria o usuário | ✅ tela "Create access", senha curta: "The password must have at least 8 characters.", auth.json criado |
 | Idioma inválido não altera preferência | ✅  |
 | Escolha explícita precede navegador | ✅  |
-| Configurações salvam sozinhas e recusam o inválido | ✅ porta "abc" → "The port must be a number from 1 to 65535." (continuou 2121); host/porta/usuário/senha salvos; pasta monitorada = \\?\C:\Users\ADMINI~1\AppData\Local\Temp\ferry-web-e2e-en\games; GET atrasado 1,5 s não desfez o que foi digitado=true |
+| Configurações salvam sozinhas e recusam o inválido | ✅ porta "abc" → "The port must be a number from 1 to 65535." (continuou 2121); host/porta/usuário/senha salvos; pasta monitorada = /tmp/ferry-web-e2e-en/games; GET atrasado 1,5 s não desfez o que foi digitado=true |
 | Testar conexão | ✅ Connected, but /mnt/ext1/homebrew does not exist (it will be created during transfer). |
+| Teste sem resposta do servidor não fica preso | ✅ No response from the Ferry server (Failed to fetch). Check the connection and try again. |
 | Log já recebido muda de idioma sem perder sequência | ✅  |
 | Testar aguarda a URL salva e funciona desligado | ✅  |
 | API valida serviço e tipo do interruptor | ✅  |
@@ -33,19 +34,20 @@
 | Idioma durante upload preserva campo editado | ✅  |
 | Webhook de senha chega antes da resposta ao diálogo | ✅  |
 | Idioma preserva diálogo e senha digitada | ✅  |
-| Upload pelo navegador → senha no navegador → envio ao PS5 | ✅ 8 volumes .7z enviados pela página; diálogo "Password-protected archive", 1ª senha errada → "Senha incorreta", 2ª certa; estado Verificado (/mnt/ext1/homebrew/PPSA09001-Jogo Web); 7/7 SHA-256 iguais; capa e PPSA09001; senha entrou nas senhas conhecidas=true; cartão durante o envio "PS5 online" |
+| Upload pelo navegador → senha no navegador → envio ao PS5 | ✅ 8 volumes .7z enviados pela página; diálogo "Password-protected archive", 1ª senha errada → "Senha incorreta", 2ª certa; estado Verificado (/mnt/ext1/homebrew/PPSA09001-Jogo Web); 7/7 SHA-256 iguais; capa e PPSA09001; senha entrou nas senhas conhecidas=true; cartão durante o envio "(o envio acabou antes de pegar o meio)" |
 | Webhook de senha sem resposta não bloqueia diálogo nem FTP | ✅  |
 | Webhook contém evento, jogo e idioma sem repetir senha incorreta | ✅  |
 | Idioma preserva card pausado e progresso | ✅  |
 | Idioma durante transferência mantém andamento | ✅  |
 | Reinício interrompe uma transferência ainda incompleta | ✅  |
 | Idioma persiste após reiniciar e recarregar | ✅  |
-| Pausar e retomar pela página | ✅ congelou em 21.8% por 1,5 s e retomou |
-| Reiniciar o servidor local no meio do envio | ✅ reinício da DLL local em 64.2% (337799624 bytes no PS5); voltou sozinho, continuou com APPE (2x após reabrir), hash confere, sem .ferry-part; login continuou valendo=true; Jogo Web continuou Verificado ("Sent and verified before reopening") sem reenviar nada |
+| Pausar e retomar pela página | ✅ congelou em 22.5% por 1,5 s e retomou |
+| Reiniciar o servidor local no meio do envio | ✅ reinício da DLL local em 41.9% (251754141 bytes no PS5); voltou sozinho, continuou com APPE (2x após reabrir), hash confere, sem .ferry-part; login continuou valendo=true; Jogo Web continuou Verificado ("Sent and verified before reopening") sem reenviar nada |
 | Webhook persiste ao reiniciar e não repete conclusão restaurada | ✅  |
 | Upload continua de onde parou | ✅ 1º bloco (16 MB) pela API; bloco repetido → 409; parcial não entrou na fila=true; a página continuou do byte 16777216 (3 bloco(s)); arquivo no servidor e no PS5 com o mesmo hash |
 | Adicionar de novo um jogo concluído | ✅ reenvio pela página começou do byte 0 (4 blocos, sem pular por ter o mesmo tamanho); o card voltou para a fila e parou em "Game already installed on the PS5 — the …" |
 | Webhook de erro não exporta senha nem diagnósticos brutos | ✅  |
+| Guia DPI acessível e traduzido | ✅  |
 | Porta DPI inválida preserva configuração | ✅  |
 | Teste DPI não instala | ✅  |
 | Modo padrão apenas envia, zero solicitações DPI | ✅  |
@@ -71,7 +73,6 @@
 ![10-webhook](e2e/web/report/en/10-webhook.png)
 ![03-fila-vazia](e2e/web/report/en/03-fila-vazia.png)
 ![04-senha](e2e/web/report/en/04-senha.png)
-![05-enviando](e2e/web/report/en/05-enviando.png)
 ![06-concluido](e2e/web/report/en/06-concluido.png)
 ![07-pausado](e2e/web/report/en/07-pausado.png)
 ![11-pkg](e2e/web/report/en/11-pkg.png)
diff --git a/e2e_report_web_pt-BR.md b/e2e_report_web_pt-BR.md
index a1a20fe..471bb11 100644
--- a/e2e_report_web_pt-BR.md
+++ b/e2e_report_web_pt-BR.md
@@ -1,9 +1,9 @@
 # Relatório E2E web — Ferry self-hosted (pt-BR)
 
-- Data: 2026-09-30 17:23:35 UTC
-- Resultado geral: **PASSOU**  (87s)
+- Data: 2026-10-14 00:58:18 UTC
+- Resultado geral: **PASSOU**  (93s)
 - Servidor: DLL local .NET, dados isolados; Chromium (Playwright). Docker não exercitado nesta rodada.
-- PS5 falso: pyftpdlib imitando o ftpsrv novo (com APPE), 40 MB/s por conexão; arquivos de teste gerados com 7-Zip 24.07 (x64) : Copyright (c) 1999-2024 Igor Pavlov : 2024-06-19
+- PS5 falso: pyftpdlib imitando o ftpsrv novo (com APPE), 40 MB/s por conexão; arquivos de teste gerados com 7-Zip 23.01 (x64) : Copyright (c) 1999-2023 Igor Pavlov : 2023-06-20
 
 | Verificação | Resultado |
 |---|---|
@@ -20,8 +20,9 @@
 | Primeira abertura cria o usuário | ✅ tela "Criar acesso", senha curta: "A senha precisa ter pelo menos 8 caracteres.", auth.json criado |
 | Idioma inválido não altera preferência | ✅  |
 | Escolha explícita precede navegador | ✅  |
-| Configurações salvam sozinhas e recusam o inválido | ✅ porta "abc" → "A porta é um número de 1 a 65535." (continuou 2121); host/porta/usuário/senha salvos; pasta monitorada = \\?\C:\Users\ADMINI~1\AppData\Local\Temp\ferry-web-e2e-pt-BR\games; GET atrasado 1,5 s não desfez o que foi digitado=true |
+| Configurações salvam sozinhas e recusam o inválido | ✅ porta "abc" → "A porta é um número de 1 a 65535." (continuou 2121); host/porta/usuário/senha salvos; pasta monitorada = /tmp/ferry-web-e2e-pt-BR/games; GET atrasado 1,5 s não desfez o que foi digitado=true |
 | Testar conexão | ✅ Conectado, mas /mnt/ext1/homebrew não existe (será criado no envio). |
+| Teste sem resposta do servidor não fica preso | ✅ Sem resposta do servidor Ferry (Failed to fetch). Confira a conexão e tente de novo. |
 | Log já recebido muda de idioma sem perder sequência | ✅  |
 | Testar aguarda a URL salva e funciona desligado | ✅  |
 | API valida serviço e tipo do interruptor | ✅  |
@@ -33,19 +34,20 @@
 | Idioma durante upload preserva campo editado | ✅  |
 | Webhook de senha chega antes da resposta ao diálogo | ✅  |
 | Idioma preserva diálogo e senha digitada | ✅  |
-| Upload pelo navegador → senha no navegador → envio ao PS5 | ✅ 8 volumes .7z enviados pela página; diálogo "Arquivo protegido por senha", 1ª senha errada → "Senha incorreta", 2ª certa; estado Verificado (/mnt/ext1/homebrew/PPSA09001-Jogo Web); 7/7 SHA-256 iguais; capa e PPSA09001; senha entrou nas senhas conhecidas=true; cartão durante o envio "(o envio acabou antes de pegar o meio)" |
+| Upload pelo navegador → senha no navegador → envio ao PS5 | ✅ 8 volumes .7z enviados pela página; diálogo "Arquivo protegido por senha", 1ª senha errada → "Senha incorreta", 2ª certa; estado Verificado (/mnt/ext1/homebrew/PPSA09001-Jogo Web); 7/7 SHA-256 iguais; capa e PPSA09001; senha entrou nas senhas conhecidas=true; cartão durante o envio "PS5 online" |
 | Webhook de senha sem resposta não bloqueia diálogo nem FTP | ✅  |
 | Webhook contém evento, jogo e idioma sem repetir senha incorreta | ✅  |
 | Idioma preserva card pausado e progresso | ✅  |
 | Idioma durante transferência mantém andamento | ✅  |
 | Reinício interrompe uma transferência ainda incompleta | ✅  |
 | Idioma persiste após reiniciar e recarregar | ✅  |
-| Pausar e retomar pela página | ✅ congelou em 21.8% por 1,5 s e retomou |
-| Reiniciar o servidor local no meio do envio | ✅ reinício da DLL local em 64.2% (337797925 bytes no PS5); voltou sozinho, continuou com APPE (2x após reabrir), hash confere, sem .ferry-part; login continuou valendo=true; Jogo Web continuou Verificado ("Enviado e conferido antes de reabrir") sem reenviar nada |
+| Pausar e retomar pela página | ✅ congelou em 22.5% por 1,5 s e retomou |
+| Reiniciar o servidor local no meio do envio | ✅ reinício da DLL local em 42% (251852176 bytes no PS5); voltou sozinho, continuou com APPE (2x após reabrir), hash confere, sem .ferry-part; login continuou valendo=true; Jogo Web continuou Verificado ("Enviado e conferido antes de reabrir") sem reenviar nada |
 | Webhook persiste ao reiniciar e não repete conclusão restaurada | ✅  |
 | Upload continua de onde parou | ✅ 1º bloco (16 MB) pela API; bloco repetido → 409; parcial não entrou na fila=true; a página continuou do byte 16777216 (3 bloco(s)); arquivo no servidor e no PS5 com o mesmo hash |
 | Adicionar de novo um jogo concluído | ✅ reenvio pela página começou do byte 0 (4 blocos, sem pular por ter o mesmo tamanho); o card voltou para a fila e parou em "Jogo já instalado no PS5 — o loader pode…" |
 | Webhook de erro não exporta senha nem diagnósticos brutos | ✅  |
+| Guia DPI acessível e traduzido | ✅  |
 | Porta DPI inválida preserva configuração | ✅  |
 | Teste DPI não instala | ✅  |
 | Modo padrão apenas envia, zero solicitações DPI | ✅  |
@@ -71,6 +73,7 @@
 ![10-webhook](e2e/web/report/pt-BR/10-webhook.png)
 ![03-fila-vazia](e2e/web/report/pt-BR/03-fila-vazia.png)
 ![04-senha](e2e/web/report/pt-BR/04-senha.png)
+![05-enviando](e2e/web/report/pt-BR/05-enviando.png)
 ![06-concluido](e2e/web/report/pt-BR/06-concluido.png)
 ![07-pausado](e2e/web/report/pt-BR/07-pausado.png)
 ![11-pkg](e2e/web/report/pt-BR/11-pkg.png)
diff --git a/tools/generate-tokens.py b/tools/generate-tokens.py
new file mode 100644
index 0000000..aab0bb2
--- /dev/null
+++ b/tools/generate-tokens.py
@@ -0,0 +1,69 @@
+#!/usr/bin/env python3
+"""Gera os tokens visuais da web e do Windows a partir de tools/tokens.json.
+
+Uso: python3 tools/generate-tokens.py           # reescreve os blocos gerados
+     python3 tools/generate-tokens.py --check   # falha se algum bloco estiver desatualizado (CI)
+"""
+import json
+import re
+import sys
+from pathlib import Path
+
+ROOT = Path(__file__).resolve().parent.parent
+TOKENS = json.loads((ROOT / "tools" / "tokens.json").read_text(encoding="utf-8"))
+
+
+def pascal(name: str) -> str:
+    return "".join(part[:1].upper() + part[1:] for part in name.split("-"))
+
+
+def css_block() -> str:
+    colors = TOKENS["colors"]
+    sizes = TOKENS["sizes"]
+    lines = ["  " + " ".join(f"--{k}: {v};" for k, v in list(colors.items())[i:i + 6]) for i in range(0, len(colors), 6)]
+    lines.append("  " + " ".join(f"--{k}: {v}px;" for k, v in sizes.items()))
+    return "\n".join(lines)
+
+
+def xaml_block() -> str:
+    indent = " " * 8
+    out = []
+    for k, v in TOKENS["colors"].items():
+        out.append(f'{indent}<Color x:Key="{pascal(k)}Color">{v}</Color>')
+    for k in TOKENS["colors"]:
+        out.append(f'{indent}<SolidColorBrush x:Key="{pascal(k)}" Color="{{StaticResource {pascal(k)}Color}}"/>')
+    for k, v in TOKENS["sizes"].items():
+        out.append(f'{indent}<sys:Double x:Key="{pascal(k)}Size">{v}</sys:Double>')
+    return "\n".join(out)
+
+
+TARGETS = [
+    (ROOT / "web" / "ui" / "app.css", re.compile(r"(/\* tokens:start[^\n]*\*/\n)(.*?)(\n\s*/\* tokens:end \*/)", re.S), css_block),
+    (ROOT / "app" / "App.xaml", re.compile(r"(<!-- tokens:start[^\n]*-->\n)(.*?)(\n\s*<!-- tokens:end -->)", re.S), xaml_block),
+]
+
+
+def main() -> int:
+    check = "--check" in sys.argv[1:]
+    stale = []
+    for path, pattern, build in TARGETS:
+        source = path.read_text(encoding="utf-8")
+        match = pattern.search(source)
+        if not match:
+            print(f"{path.relative_to(ROOT)}: marcadores tokens:start/tokens:end ausentes", file=sys.stderr)
+            return 1
+        updated = source[:match.start(2)] + build() + source[match.end(2):]
+        if updated == source:
+            continue
+        stale.append(path.relative_to(ROOT))
+        if not check:
+            path.write_text(updated, encoding="utf-8", newline="")
+    if check and stale:
+        print("Tokens desatualizados (rode python3 tools/generate-tokens.py): " + ", ".join(map(str, stale)), file=sys.stderr)
+        return 1
+    print("Tokens " + ("conferidos" if check else "gerados") + ".")
+    return 0
+
+
+if __name__ == "__main__":
+    sys.exit(main())
diff --git a/tools/tokens.json b/tools/tokens.json
new file mode 100644
index 0000000..36aa9e6
--- /dev/null
+++ b/tools/tokens.json
@@ -0,0 +1,28 @@
+{
+  "$comment": "Fonte única das cores e medidas da web (web/ui/app.css) e do Windows (app/App.xaml). Depois de editar: python3 tools/generate-tokens.py",
+  "colors": {
+    "bg": "#0A0D12",
+    "side": "#0D1117",
+    "hover": "#0F141B",
+    "field": "#121821",
+    "line": "#1B222D",
+    "line2": "#29323F",
+    "text": "#E9EDF3",
+    "text2": "#A9B3C2",
+    "muted": "#8490A2",
+    "idle": "#4A5363",
+    "accent": "#6F97FF",
+    "accent-text": "#9DB8FF",
+    "green": "#4ADE80",
+    "red": "#FF7A7A",
+    "amber": "#F2B84B"
+  },
+  "sizes": {
+    "page-title": 34,
+    "job-title": 22,
+    "job-title-active": 26,
+    "stat": 28,
+    "label": 13,
+    "radius": 6
+  }
+}
diff --git a/web/Hub.cs b/web/Hub.cs
index e670882..fd90e30 100644
--- a/web/Hub.cs
+++ b/web/Hub.cs
@@ -19,7 +19,7 @@ public record Line(long Seq, string Time, Message Message)
     {
         public string Text => $"{Time}  {Message.Render()}";
     }
-    public record Notice(long Seq, string Kind, Message TitleMessage, Message TextMessage)
+    public record Notice(long Seq, string Kind, Message TitleMessage, Message TextMessage, string? JobId)
     {
         public string Title => TitleMessage.Render();
         public string Text => TextMessage.Render();
@@ -43,11 +43,12 @@ public void Log(Message msg)
     public List<Line> LogSince(long seq) { lock (_log) return _log.Where(l => l.Seq > seq).ToList(); }
     public void ClearLog() { lock (_log) _log.Clear(); }
 
-    void Notify(string kind, Message title, Message text)
+    // JobId: a página junta avisos repetidos do mesmo jogo e oferece "Ver" no cartão
+    void Notify(string kind, Message title, Message text, Job? job = null)
     {
         lock (_notices)
         {
-            _notices.Add(new(Interlocked.Increment(ref _seq), kind, title, text));
+            _notices.Add(new(Interlocked.Increment(ref _seq), kind, title, text, job == null ? null : Id(job)));
             if (_notices.Count > 100) _notices.RemoveAt(0);
         }
     }
@@ -57,11 +58,11 @@ void Notify(string kind, Message title, Message text)
 
     public void OnDone(Job job)
     {
-        if (job.Stage == Stage.Verificado) Notify("done", new("web.doneTitle"), new("web.doneText", job.Title != "" ? job.Title : job.Name));
-        else if (job.Stage == Stage.PacotePronto) Notify("package_ready", new("web.packageReadyTitle"), job.DetailMessage ?? new("web.packageReadyText", job.Title != "" ? job.Title : job.Name));
-        else if (job.Stage == Stage.InstalacaoSolicitada) Notify("installation_requested", new("web.installationTitle"), new("web.installationText", job.Title != "" ? job.Title : job.Name));
-        else if (job.Stage == Stage.VerifiqueNoPs5) Notify("unknown", new("web.installationUnknownTitle"), new("web.installationUnknownText", job.Title != "" ? job.Title : job.Name));
-        else Notify("error", new("web.errorTitle"), new("web.errorText", job.Name, job.DetailMessage ?? new Message("core.raw", Short(job.Detail))));
+        if (job.Stage == Stage.Verificado) Notify("done", new("web.doneTitle"), new("web.doneText", job.Title != "" ? job.Title : job.Name), job);
+        else if (job.Stage == Stage.PacotePronto) Notify("package_ready", new("web.packageReadyTitle"), job.DetailMessage ?? new("web.packageReadyText", job.Title != "" ? job.Title : job.Name), job);
+        else if (job.Stage == Stage.InstalacaoSolicitada) Notify("installation_requested", new("web.installationTitle"), new("web.installationText", job.Title != "" ? job.Title : job.Name), job);
+        else if (job.Stage == Stage.VerifiqueNoPs5) Notify("unknown", new("web.installationUnknownTitle"), new("web.installationUnknownText", job.Title != "" ? job.Title : job.Name), job);
+        else Notify("error", new("web.errorTitle"), new("web.errorText", job.Name, job.DetailMessage ?? new Message("core.raw", Short(job.Detail))), job);
     }
 
     static string Short(string s)
@@ -78,7 +79,7 @@ record Ask(long Seq, Job Job, bool Wrong, TaskCompletionSource<string?> Answer);
     {
         var ask = new Ask(Interlocked.Increment(ref _seq), job, job.ArchivePassword != null, new(TaskCreationOptions.RunContinuationsAsynchronously));
         _asks[Id(job)] = ask;
-        Notify("password", new("web.passwordTitle"), new("web.passwordText", job.Name));
+        Notify("password", new("web.passwordTitle"), new("web.passwordText", job.Name), job);
         return ask.Answer.Task;
     }
 
diff --git a/web/ui/app.css b/web/ui/app.css
index 7febeee..deedbcd 100644
--- a/web/ui/app.css
+++ b/web/ui/app.css
@@ -1,13 +1,16 @@
 /* "PlayStation noir": preto-azulado, quase monocromático, um acento (azul). Verde/vermelho/âmbar só para estado.
-   Mesmos tokens do App.xaml do app Windows. */
+   Cores e medidas vêm de tools/tokens.json (as mesmas do App.xaml do app Windows). */
 @font-face { font-family: Geist; src: url(fonts/Geist-Regular.ttf) format("truetype"); font-weight: 400; font-display: swap; }
 @font-face { font-family: Geist; src: url(fonts/Geist-Medium.ttf) format("truetype"); font-weight: 500; font-display: swap; }
 @font-face { font-family: Geist; src: url(fonts/Geist-SemiBold.ttf) format("truetype"); font-weight: 600; font-display: swap; }
 
 :root {
+  /* tokens:start (gerado por tools/generate-tokens.py a partir de tools/tokens.json; não editar à mão) */
   --bg: #0A0D12; --side: #0D1117; --hover: #0F141B; --field: #121821; --line: #1B222D; --line2: #29323F;
-  --text: #E9EDF3; --text2: #A9B3C2; --muted: #8490A2; --idle: #4A5363;
-  --accent: #6F97FF; --accent-text: #9DB8FF; --green: #4ADE80; --red: #FF7A7A; --amber: #F2B84B;
+  --text: #E9EDF3; --text2: #A9B3C2; --muted: #8490A2; --idle: #4A5363; --accent: #6F97FF; --accent-text: #9DB8FF;
+  --green: #4ADE80; --red: #FF7A7A; --amber: #F2B84B;
+  --page-title: 34px; --job-title: 22px; --job-title-active: 26px; --stat: 28px; --label: 13px; --radius: 6px;
+  /* tokens:end */
   color-scheme: dark;
 }
 * { box-sizing: border-box; }
@@ -81,9 +84,9 @@ hr { border: 0; border-top: 1px solid var(--line); margin: 24px 0; }
 .auth-card #authHint { margin-top: 6px; font-size: 14px; }
 .auth-card .error { min-height: 22px; margin: 14px 0 8px; font-size: 14px; }
 
-/* ---------- casca: barra lateral + conteúdo ---------- */
-.shell { display: grid; grid-template-columns: 232px 1fr; min-height: 100%; }
-.side { background: var(--side); border-right: 1px solid var(--line); padding: 24px 22px 22px; display: flex; flex-direction: column; position: sticky; top: 0; height: 100vh; }
+/* ---------- casca: barra lateral (marca + navegação) + conteúdo com o status do PS5 no topo ---------- */
+.shell { display: grid; grid-template-columns: 216px 1fr; min-height: 100%; }
+.side { background: var(--side); border-right: 1px solid var(--line); padding: 24px 20px 22px; display: flex; flex-direction: column; position: sticky; top: 0; height: 100vh; }
 nav { margin-top: 44px; display: flex; flex-direction: column; }
 .nav {
   display: flex; align-items: center; gap: 10px; background: none; border: 0; border-bottom: 1px solid var(--line);
@@ -93,32 +96,53 @@ nav { margin-top: 44px; display: flex; flex-direction: column; }
 .nav.on { color: var(--text); font-weight: 600; }
 .nav.on::before { content: ""; width: 6px; height: 6px; background: var(--accent); }
 .badge { margin-left: auto; font-weight: 400; color: var(--text2); }
-.side-bottom { margin-top: auto; display: flex; flex-direction: column; gap: 24px; }
-.found { border: 1px solid var(--line2); border-radius: 6px; padding: 14px; display: flex; flex-direction: column; gap: 10px; font-size: 14px; }
-.found .row { align-items: center; }
-.status { display: flex; flex-direction: column; gap: 6px; }
-.status-title { display: flex; align-items: center; gap: 8px; font-size: 14px; }
-.dot { width: 8px; height: 8px; border-radius: 50%; background: var(--idle); }
+
+.content { padding: 12px 32px 40px; min-width: 0; }
+.topbar { display: flex; align-items: center; justify-content: flex-end; gap: 12px 20px; flex-wrap: wrap; min-height: 34px; margin-bottom: 8px; }
+.status { display: flex; align-items: center; gap: 8px; font-size: 13px; min-width: 0; padding: 6px 12px; border: 1px solid var(--line); border-radius: 999px; }
+.status b { font-weight: 600; white-space: nowrap; }
+.status-host { font-weight: 600; color: var(--text); white-space: nowrap; }
+.status-dest { color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
+.status .link { font-size: 13px; margin-left: 4px; white-space: nowrap; }
+.dot { width: 8px; height: 8px; border-radius: 50%; background: var(--idle); flex: 0 0 auto; }
 .dot.online { background: var(--green); } .dot.offline { background: var(--red); } .dot.testing { background: var(--amber); }
-.status-host { font-size: 18px; font-weight: 600; margin-top: 4px; }
-.status .link { align-self: flex-start; margin-top: 8px; font-size: 14px; }
+.found { order: -1; display: flex; align-items: center; gap: 12px; font-size: 13px; padding: 6px 8px 6px 14px; border: 1px solid var(--accent); border-radius: 999px; }
+.found p { white-space: nowrap; }
 
-.content { padding: 24px 32px 40px; min-width: 0; }
-.head { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; padding-bottom: 20px; border-bottom: 1px solid var(--line); }
-.head h1 { font-size: 34px; font-weight: 600; line-height: 1; }
-.head p { margin-top: 10px; font-size: 13px; }
+.head { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 16px 24px; padding-bottom: 20px; border-bottom: 1px solid var(--line); }
+.head h1 { font-size: var(--page-title); font-weight: 600; line-height: 1; }
+.head p { margin-top: 10px; font-size: var(--label); }
 .head-right { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; justify-content: flex-end; }
 .head-right .primary { padding: 9px 16px; font-size: 15px; }
-.speed { text-align: right; margin-right: 16px; }
+.speed { text-align: right; margin-right: 12px; }
 .speed .num { font-size: 30px; font-weight: 600; line-height: 1; }
 .speed .unit { font-size: 14px; color: var(--muted); margin-left: 4px; }
 .speed small { font-size: 12px; }
 
-/* ---------- fila: "Régua" (linhas por fio, números em colunas fixas, barra = travessia) ---------- */
+/* progresso da fila inteira: bytes enviados dos itens ainda não concluídos + término previsto */
+.overall { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 16px; }
+.overall-bar { height: 4px; background: var(--line); border-radius: 2px; overflow: hidden; }
+.overall-bar i { display: block; height: 100%; width: 0; background: var(--accent); transition: width .35s ease-out; }
+.overall p { margin: 0; font-size: var(--label); color: var(--text2); white-space: nowrap; }
+.overall #overallEta:not(:empty)::before { content: " · "; color: var(--muted); }
+
+/* ---------- fila em grupos: Precisa de você → Enviando → Na fila → Concluídos ---------- */
+.group { margin-top: 18px; }
+.group-head { display: flex; align-items: center; gap: 10px; padding-bottom: 8px; border-bottom: 1px solid var(--line); }
+.group-head h2 { font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--text2); }
+.group-head .count { font-size: 12px; color: var(--muted); }
+.group[data-group=attention] .group-head h2 { color: var(--amber); }
+.group-toggle { display: flex; align-items: center; gap: 8px; background: none; border: 0; padding: 4px 0; cursor: pointer; color: inherit; }
+.group-toggle .chev { width: 14px; height: 14px; color: var(--muted); transition: transform .2s; transform: rotate(90deg); }
+.group.collapsed .chev { transform: rotate(0); }
+.group.collapsed .group-list { display: none; }
+.group-head .link { margin-left: auto; font-size: 13px; color: var(--text2); }
+
+/* cartão completo: "Régua" (números em colunas fixas, barra = travessia) */
 .job {
   --c: var(--idle);
   display: grid; grid-template-columns: 88px minmax(0, 1fr) 96px 104px 118px auto; grid-template-areas: "cover info pct rate eta acts" "bar bar bar bar bar bar";
-  column-gap: 0; align-items: center; padding: 18px 4px 8px 0; border-bottom: 1px solid var(--line);
+  column-gap: 0; align-items: center; padding: 18px 4px 10px 0; border-bottom: 1px solid var(--line);
 }
 .job:hover { background: var(--hover); }
 .job .cover { grid-area: cover; width: 88px; height: 88px; object-fit: cover; border-radius: 3px; background: var(--line); }
@@ -126,27 +150,33 @@ nav { margin-top: 44px; display: flex; flex-direction: column; }
 .job.nocover { grid-template-areas: "info info pct rate eta acts" "bar bar bar bar bar bar"; }
 .job.nocover .cover { display: none; }
 .job.nocover .info { padding-left: 0; }
-.job .title { font-size: 22px; font-weight: 600; line-height: 1.15; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-.job.nocover .title { font-size: 30px; }
-.job .meta { display: flex; flex-wrap: wrap; gap: 2px 14px; margin-top: 5px; font-size: 13px; }
-.job .stage { color: var(--text2); font-weight: 600; }
+.job .title { font-size: var(--job-title); font-weight: 600; line-height: 1.15; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.job.active .title { font-size: var(--job-title-active); }
+.job .meta { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 14px; margin-top: 6px; font-size: var(--label); }
+/* estado como etiqueta: ponto na cor do estado + texto */
+.job .stage { display: inline-flex; align-items: center; gap: 7px; color: var(--text2); font-weight: 600; }
+.job .stage::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--c); flex: 0 0 auto; }
 .job .tid, .job .package-format, .job .amount, .job .detail, .job .file { color: var(--muted); }
-.job .detail, .job .file { font-size: 13px; margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.job .detail, .job .file { font-size: var(--label); margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
 .job .detail:empty, .job .file:empty, .job .tid:empty, .job .package-format:empty, .job .amount:empty { display: none; }
 .stat { text-align: right; }
-.stat .v { font-size: 28px; font-weight: 600; line-height: 1.1; }
+.stat .v { font-size: var(--stat); font-weight: 600; line-height: 1.1; }
 .stat .u { font-size: 13px; font-weight: 500; color: var(--muted); }
 .stat small { display: block; font-size: 12px; margin-top: 3px; }
 .pct { grid-area: pct; } .rate { grid-area: rate; } .eta { grid-area: eta; }
-.job:not(.active) .stat { color: var(--muted); }
-.job .sendnow { grid-area: rate / rate / rate / eta; justify-self: end; font-size: 15px; padding: 8px 16px; }
+.job:not(.active) .stat { color: var(--text2); }
+.job .sendnow { grid-area: rate / rate / rate / eta; justify-self: end; font-size: 14px; padding: 7px 14px; }
 .job .install { grid-area: pct / pct / pct / eta; justify-self: end; font-size: 14px; padding: 8px 12px; white-space: normal; }
-.job .acts { grid-area: acts; display: flex; gap: 4px; margin-left: 16px; }
+.job .acts { grid-area: acts; display: flex; align-items: center; gap: 4px; margin-left: 16px; }
 .job .acts .icon { width: 36px; height: 36px; }
-.job .acts svg { width: 16px; height: 16px; }
+.job .acts svg { width: 16px; height: 16px; flex: 0 0 auto; }
+.job .acts .lbl { display: none; }
+/* com erro, "Tentar de novo" vira a ação principal, com texto */
+.job[data-stage=Erro] [data-act=retry] { width: auto; padding: 0 14px; gap: 8px; display: inline-flex; border: 1px solid var(--line2); font-size: 14px; font-weight: 500; color: var(--text); margin-right: 6px; }
+.job[data-stage=Erro] [data-act=retry] .lbl { display: inline; }
 
-/* a travessia: cais nas pontas, fio, seta na ponta do progresso */
-.bar { grid-area: bar; display: flex; align-items: center; height: 12px; margin-top: 16px; }
+/* a travessia: cais nas pontas, fio, seta na ponta do progresso (só no que está atravessando) */
+.bar { grid-area: bar; display: flex; align-items: center; height: 12px; margin-top: 14px; }
 .bar > i { width: 2px; height: 12px; background: var(--line2); }
 .track { flex: 1; position: relative; height: 12px; margin: 0 12px 0 6px; }
 .track::before { content: ""; position: absolute; left: 0; right: 0; top: 5px; height: 2px; background: var(--line); }
@@ -156,21 +186,52 @@ nav { margin-top: 44px; display: flex; flex-direction: column; }
   content: ""; position: absolute; right: -5px; top: 2px; width: 6px; height: 6px;
   border-top: 2px solid var(--c); border-right: 2px solid var(--c); transform: rotate(45deg); transition: border-color .3s;
 }
+.job:not(.active) .fill::after { display: none; }
+.job.nobar .bar { display: none; }
+
+/* precisa de você: cartão completo, marcado na borda */
+.job[data-group=attention] { border-left: 2px solid var(--c); padding-left: 16px; }
+.job[data-group=attention] .detail { white-space: normal; color: var(--text2); }
+
+/* na fila e concluídos: cartão compacto, uma linha + barra fina */
+.job.compact { grid-template-columns: 44px minmax(0, 1fr) auto auto auto; grid-template-areas: "cover info pct send acts" "cover bar bar bar bar"; padding: 12px 4px 10px 0; }
+.job.compact.nocover { grid-template-areas: "info info pct send acts" "bar bar bar bar bar"; }
+.job.compact .cover { width: 44px; height: 44px; align-self: start; }
+.job.compact .info { padding: 0 16px 0 14px; display: grid; grid-template-columns: minmax(0, auto) minmax(0, 1fr); align-items: baseline; column-gap: 14px; }
+.job.compact.nocover .info { padding-left: 0; }
+.job.compact .title { font-size: 16px; grid-row: 1; }
+.job.compact .meta { margin: 0; grid-row: 1; flex-wrap: nowrap; overflow: hidden; white-space: nowrap; }
+.job.compact .detail { grid-column: 1 / -1; grid-row: 2; margin-top: 3px; }
+.job.compact .file { display: none; }
+.job.compact .stat .v { font-size: 18px; }
+.job.compact .stat small { display: none; }
+.job.compact .rate, .job.compact .eta { display: none; }
+.job.compact .sendnow { grid-area: send; justify-self: end; margin-left: 16px; }
+.job.compact .bar { margin-top: 8px; height: 6px; }
+.job.compact .bar > i { display: none; }
+.job.compact .track { margin: 0; height: 6px; }
+.job.compact .track::before, .job.compact .fill::before { top: 2px; }
+.job.compact .fill { height: 6px; }
+.job[data-group=done] .bar { display: none; }
+.job[data-group=done] { grid-template-areas: "cover info pct send acts"; padding-bottom: 12px; }
+.job[data-group=done].nocover { grid-template-areas: "info info pct send acts"; }
+.job[data-group=done] .title { color: var(--text2); }
 
 .job[data-stage=Extraindo], .job[data-stage=Enviando] { --c: var(--accent); }
 .job[data-stage=Extraindo] .stage, .job[data-stage=Enviando] .stage { color: var(--accent-text); }
 .job[data-stage=Verificado] { --c: var(--green); } .job[data-stage=Verificado] .stage { color: var(--green); }
 .job[data-stage=Pausado] { --c: var(--amber); } .job[data-stage=Pausado] .stage { color: var(--amber); }
 .job[data-stage=Erro] { --c: var(--red); } .job[data-stage=Erro] .stage, .job[data-stage=Erro] .detail { color: var(--red); }
-.job[data-stage=Erro] .detail { white-space: normal; }
 .job[data-stage=InstalacaoSolicitada] { --c: var(--green); }
 .job[data-stage=InstalacaoSolicitada] .stage { color: var(--green); }
 .job[data-stage=PacotePronto], .job[data-stage=VerifiqueNoPs5] { --c: var(--amber); }
 .job[data-stage=PacotePronto] .stage, .job[data-stage=VerifiqueNoPs5] .stage { color: var(--amber); }
-.job[data-stage=VerifiqueNoPs5] .detail { white-space: normal; }
 .job[data-stage=PacotePronto] .detail { white-space: pre-line; overflow-wrap: anywhere; }
 .job[data-stage=SolicitandoInstalacao] { --c: var(--accent); }
 .job[data-stage=SolicitandoInstalacao] .stage { color: var(--accent-text); }
+.job[data-password] { --c: var(--amber); }
+.job.flash { animation: flash 1.2s ease-out; }
+@keyframes flash { from { background: var(--line2); } to { background: transparent; } }
 
 /* envios do navegador */
 .upload { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 24px; padding: 18px 0; border-bottom: 1px solid var(--line); }
@@ -181,20 +242,40 @@ nav { margin-top: 44px; display: flex; flex-direction: column; }
 .upload .up-bar i { position: absolute; left: 0; top: 0; bottom: 0; background: var(--accent); transition: width .35s ease-out; }
 .upload.fail .up-detail { color: var(--red); }
 
-.empty { padding: 96px 0 24px; max-width: 900px; }
+/* vazio: a página toda é a área de soltar */
+.empty { padding: 48px 0 24px; cursor: pointer; }
+.empty-drop { border: 1px dashed var(--line2); border-radius: var(--radius); padding: 56px 48px; max-width: 920px; }
+.empty:hover .empty-drop { border-color: var(--accent); }
 .empty h2 { font-size: 56px; font-weight: 600; line-height: 1.05; }
 .empty p { margin-top: 16px; font-size: 15px; color: var(--text2); max-width: 640px; }
-.empty .muted { color: var(--muted); }
-.empty .exts { color: var(--muted); font-size: 14px; margin-top: 36px; }
+.empty .muted { color: var(--muted); overflow-wrap: anywhere; }
+.empty .exts { color: var(--text2); font-size: 14px; margin-top: 36px; }
 #page-queue { cursor: default; }
+.fab { display: none; }
 
-/* ---------- configurações ---------- */
-.cols { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; padding-top: 24px; }
-.col h3 { font-size: 14px; font-weight: 600; margin-bottom: 4px; }
-.col h3 small { font-weight: 400; margin-left: 10px; font-size: 13px; }
-.test { align-items: center; margin-top: 18px; }
-.test-result { font-size: 14px; }
-.test-result.ok { color: var(--green); } .test-result.fail { color: var(--red); }
+/* ---------- configurações: índice fixo + seções ---------- */
+.settings { display: grid; grid-template-columns: 180px minmax(0, 760px); gap: 40px; padding-top: 8px; }
+.set-nav { position: sticky; top: 16px; align-self: start; margin: 16px 0 0; display: flex; flex-direction: column; }
+.set-nav a { color: var(--muted); text-decoration: none; font-size: 14px; padding: 8px 0 8px 12px; border-left: 2px solid var(--line); }
+.set-nav a:hover { color: var(--text2); }
+.set-nav a.on { color: var(--text); border-left-color: var(--accent); font-weight: 600; }
+/* hierarquia: título da seção grande; subgrupo em versalete discreto com fio; rótulo do campo em cinza */
+.set-section { padding: 32px 0 36px; border-bottom: 1px solid var(--line); scroll-margin-top: 16px; }
+.set-section:first-child { padding-top: 20px; }
+.set-section:last-child { border-bottom: 0; min-height: calc(100vh - 120px); }
+.set-section h2 { font-size: 22px; font-weight: 600; line-height: 1.2; margin-bottom: 8px; }
+.set-section h3 { font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--text2); margin-top: 32px; padding-top: 18px; border-top: 1px solid var(--line); }
+.set-section h2 + .hint { margin-top: 0; }
+.set-section h2 + h3 { margin-top: 12px; padding-top: 0; border-top: 0; }
+/* a caixa de senhas cresce com o conteúdo: uma rolagem só, a da página */
+.set-section textarea { margin-top: 12px; min-height: 140px; field-sizing: content; resize: none; overflow: hidden; }
+.test { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin-top: 18px; }
+/* resultado de teste: linha de status curta, com ponto de estado */
+.test-result { font-size: 14px; color: var(--text2); display: flex; gap: 8px; align-items: baseline; flex: 1 1 260px; min-width: 0; }
+.test-result:empty { display: none; }
+.test-result::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--idle); flex: 0 0 auto; transform: translateY(-1px); }
+.test-result.ok { color: var(--green); } .test-result.ok::before { background: var(--green); }
+.test-result.fail, .test-result.error { color: var(--red); } .test-result.fail::before, .test-result.error::before { background: var(--red); }
 .dpi-help { margin-top: 12px; font-size: 13px; color: var(--text2); }
 .dpi-help summary { cursor: pointer; color: var(--text); }
 .dpi-help ol { margin: 10px 0 0; padding-left: 22px; }
@@ -202,14 +283,16 @@ nav { margin-top: 44px; display: flex; flex-direction: column; }
 .dpi-help p { overflow-wrap: anywhere; }
 
 /* ---------- log ---------- */
-.log { margin: 24px 0 0; padding: 18px; background: var(--side); border: 1px solid var(--line); border-radius: 4px; min-height: 60vh; max-height: calc(100vh - 190px); overflow: auto; font: 13px/1.6 ui-monospace, "Cascadia Mono", Consolas, monospace; color: var(--text2); white-space: pre-wrap; word-break: break-word; }
+.log { margin: 24px 0 0; padding: 18px; background: var(--side); border: 1px solid var(--line); border-radius: 4px; min-height: 60vh; max-height: calc(100vh - 220px); overflow: auto; font: 13px/1.6 ui-monospace, "Cascadia Mono", Consolas, monospace; color: var(--text2); white-space: pre-wrap; word-break: break-word; }
 
 /* ---------- arrastar, avisos, diálogo ---------- */
 .drop { position: fixed; inset: 0; background: rgba(10, 13, 18, .92); display: grid; place-items: center; z-index: 20; border: 2px dashed var(--accent); pointer-events: none; }
 .drop h2 { font-size: 40px; font-weight: 600; padding: 16px; text-align: center; }
 .toasts { position: fixed; right: 16px; bottom: 16px; display: flex; flex-direction: column; gap: 10px; z-index: 30; max-width: min(420px, calc(100vw - 32px)); }
-.toast { background: var(--side); border: 1px solid var(--line2); border-left: 3px solid var(--accent); border-radius: 6px; padding: 12px 16px; font-size: 14px; }
-.toast b { display: block; margin-bottom: 2px; }
+.toast { background: var(--side); border: 1px solid var(--line2); border-left: 3px solid var(--accent); border-radius: 6px; padding: 12px 16px; font-size: 14px; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 14px; align-items: center; }
+.toast b { display: block; }
+.toast > span { grid-column: 1; }
+.toast .btn { grid-column: 2; grid-row: 1 / span 2; }
 .toast.done { border-left-color: var(--green); } .toast.error { border-left-color: var(--red); } .toast.password { border-left-color: var(--amber); }
 .toast.installation_requested { border-left-color: var(--green); } .toast.unknown { border-left-color: var(--amber); }
 .toast.package_ready { border-left-color: var(--green); }
@@ -222,51 +305,83 @@ dialog input { margin: 14px 0 18px; }
 
 /* ---------- telas menores ---------- */
 @media (max-width: 1100px) {
-  .job { grid-template-columns: 72px minmax(0, 1fr) 84px 92px 104px auto; }
-  .job .cover { width: 72px; height: 72px; }
+  .job:not(.compact) { grid-template-columns: 72px minmax(0, 1fr) 84px 92px 104px auto; }
+  .job:not(.compact) .cover { width: 72px; height: 72px; }
   .stat .v { font-size: 24px; }
   .job .acts { margin-left: 8px; }
+  .settings { grid-template-columns: 150px minmax(0, 1fr); gap: 28px; }
 }
 @media (max-width: 900px) {
   .shell { grid-template-columns: 1fr; }
-  .side { position: static; height: auto; padding: 16px; border-right: 0; border-bottom: 1px solid var(--line); flex-direction: row; flex-wrap: wrap; align-items: center; gap: 12px 24px; }
-  .brand .logo { width: 32px; height: 32px; }
-  nav { margin: 0; flex-direction: row; gap: 20px; order: 3; width: 100%; }
-  .nav { border: 0; padding: 4px 0; font-size: 16px; }
-  .side-bottom { margin: 0 0 0 auto; flex-direction: row; align-items: center; gap: 16px; }
-  .status { flex-direction: row; align-items: center; gap: 12px; }
-  .status-title { font-size: 14px; } .status-host { font-size: 14px; margin: 0; } #statusDest { display: none; }
-  .status .link { margin: 0; font-size: 14px; }
-  .found { padding: 8px 12px; }
-  .content { padding: 20px 16px 40px; }
-  .head { flex-wrap: wrap; align-items: flex-start; padding-bottom: 20px; }
-  .head h1 { font-size: 34px; }
-  .head p { font-size: 14px; margin-top: 8px; }
-  .head-right { justify-content: flex-start; }
-  .head-right .primary { font-size: 15px; padding: 10px 16px; }
-  .speed { margin-right: 8px; text-align: left; } .speed .num { font-size: 28px; } .speed .unit { font-size: 14px; } .speed small { font-size: 12px; }
-  .cols { grid-template-columns: 1fr; gap: 0; }
-  .cols .col + .col { border-top: 1px solid var(--line); margin-top: 24px; padding-top: 24px; }
-  .job {
-    grid-template-columns: 64px minmax(0, 1fr) auto; row-gap: 14px; padding: 18px 0 10px;
-    grid-template-areas: "cover info info" "stats stats stats" "acts acts acts" "bar bar bar";
+  .side { position: sticky; top: 0; z-index: 10; height: auto; padding: 0 16px; border-right: 0; border-bottom: 1px solid var(--line); flex-direction: row; align-items: center; gap: 18px; }
+  .brand .logo { width: 28px; height: 28px; }
+  .brand-copy { display: none; }
+  nav { margin: 0; flex-direction: row; gap: 20px; }
+  .nav { border: 0; border-bottom: 2px solid transparent; padding: 8px 0 10px; font-size: 15px; min-height: 44px; }
+  .nav.on { border-bottom-color: var(--accent); }
+  .nav.on::before { display: none; }
+  .content { padding: 12px 16px 96px; }
+  .topbar { justify-content: flex-start; margin-bottom: 12px; }
+  .status { flex-wrap: wrap; border-radius: 8px; width: 100%; }
+  .status-dest { display: none; }
+  .status .link { margin-left: auto; min-height: 32px; }
+  .found { width: 100%; border-radius: 8px; flex-wrap: wrap; }
+  .found p { white-space: normal; flex: 1 1 100%; }
+  .head { grid-template-columns: 1fr auto; padding-bottom: 14px; }
+  .head h1 { font-size: 28px; }
+  .head p { font-size: 13px; margin-top: 6px; }
+  #summary { display: none; } /* no celular, as contagens ficam nos títulos dos grupos */
+  .head-right #addBtn { display: none; }
+  .speed { margin: 0; } .speed .num { font-size: 22px; } .speed small { font-size: 11px; }
+  .fab { display: inline-flex; position: fixed; left: 16px; right: 16px; bottom: max(16px, env(safe-area-inset-bottom)); z-index: 15; min-height: 48px; font-size: 16px; box-shadow: 0 0 0 6px var(--bg); }
+  .toasts { bottom: 84px; }
+  .group { margin-top: 16px; }
+
+  /* cartão completo no celular: título + ações em cima, números numa linha, barra */
+  .job:not(.compact), .job.nocover:not(.compact) {
+    grid-template-columns: repeat(3, minmax(0, 1fr)) auto; row-gap: 10px; padding: 14px 0 10px;
+    grid-template-areas: "info info info acts" "pct rate eta eta" "bar bar bar bar";
   }
-  .job.nocover { grid-template-areas: "info info info" "stats stats stats" "acts acts acts" "bar bar bar"; }
-  .job .cover { width: 64px; height: 64px; }
-  .job .info { padding: 0 0 0 14px; }
-  .job .title { font-size: 20px; } .job.nocover .title { font-size: 24px; }
-  .job .meta, .job .detail, .job .file { font-size: 13px; }
-  .pct, .rate, .eta { grid-area: auto; }
-  .job .stat { grid-row: 2; text-align: left; }
-  .job .pct { grid-column: 1 / 2; } .job .rate { grid-column: 2 / 3; justify-self: center; } .job .eta { grid-column: 3 / 4; text-align: right; }
-  .stat .v { font-size: 24px; } .stat .u { font-size: 13px; } .stat small { font-size: 12px; }
-  .job .sendnow { grid-area: auto; grid-row: 2; grid-column: 2 / 4; justify-self: end; font-size: 14px; padding: 8px 14px; }
-  .job .install { grid-area: auto; grid-row: 2; grid-column: 1 / 4; justify-self: end; max-width: 100%; }
-  .job .acts { margin: 0; justify-content: flex-end; }
+  .job:not(.compact) .cover, .job.nocover .cover { display: none; }
+  .job .info, .job.nocover .info { padding: 0; }
+  .job .title, .job.active .title { font-size: 19px; }
+  .job .acts { margin: 0; align-self: start; }
+  .job .acts .icon { width: 44px; height: 44px; }
+  .job .stat { text-align: left; }
+  .job .rate { justify-self: center; text-align: center; } .job .eta { text-align: right; }
+  .job .acts .lbl { display: none !important; }
+  .job[data-stage=Erro] [data-act=retry] { width: 44px; padding: 0; justify-content: center; margin: 0; }
+  .stat .v { font-size: 22px; } .stat small { font-size: 11px; }
+  .job .sendnow { grid-area: auto; grid-row: 2; grid-column: 1 / 5; justify-self: end; }
+  .job .install { grid-area: auto; grid-row: 2; grid-column: 1 / 5; justify-self: start; max-width: 100%; }
+  .job[data-group=attention] { padding-left: 12px; }
   .bar { margin-top: 0; }
-  .empty { padding-top: 48px; } .empty h2 { font-size: 38px; } .empty p { font-size: 15px; }
+
+  /* compacto no celular: ~70 px por jogo */
+  .job.compact, .job.compact.nocover { grid-template-columns: minmax(0, 1fr) auto auto; grid-template-areas: "info pct acts" "bar bar bar"; row-gap: 6px; padding: 10px 0 8px; }
+  .job.compact .cover { display: none; }
+  .job.compact .info { padding: 0; grid-template-columns: minmax(0, 1fr); }
+  .job.compact .title { font-size: 15px; }
+  .job.compact .meta { grid-row: 2; margin-top: 3px; }
+  .job.compact .tid { display: none; }
+  .job.compact .detail { grid-row: 3; }
+  .job.compact .stat { grid-row: 1; grid-area: pct; text-align: right; }
+  .job.compact .stat .v { font-size: 15px; }
+  .job.compact .sendnow { grid-area: auto; grid-row: 3; grid-column: 1 / 4; justify-self: start; margin: 4px 0 0; min-height: 40px; }
+  .job.compact .acts .icon { width: 40px; height: 40px; }
+  .job[data-group=done], .job[data-group=done].nocover { grid-template-areas: "info pct acts"; }
+  .job.compact .stat.pct { grid-area: pct; }
+
+  .empty { padding-top: 8px; } .empty-drop { padding: 28px 20px; } .empty h2 { font-size: 34px; } .empty p { font-size: 15px; }
+  .settings { grid-template-columns: 1fr; gap: 0; }
+  .set-nav { position: sticky; top: 45px; z-index: 5; flex-direction: row; gap: 4px; overflow-x: auto; margin: 0 -16px; padding: 8px 16px; background: var(--bg); border-bottom: 1px solid var(--line); scrollbar-width: none; }
+  .set-nav a { border: 1px solid var(--line2); border-radius: 999px; padding: 6px 12px; white-space: nowrap; font-size: 13px; }
+  .set-nav a.on { border-color: var(--accent); }
+  .set-section { scroll-margin-top: 160px; }
   .port, .preset { width: 120px; }
   .row-2 { flex-wrap: wrap; }
+  .log { max-height: none; min-height: 50vh; }
 }
 /* The language preference shares the existing field sizing on narrow screens. */
 .language select { width: 100%; max-width: 280px; }
+@media (prefers-reduced-motion: reduce) { .fill, .fill::before, .overall-bar i, .upload .up-bar i { transition: none; } .job.flash { animation: none; } }
diff --git a/web/ui/app.js b/web/ui/app.js
index cbd3250..b8d537c 100644
--- a/web/ui/app.js
+++ b/web/ui/app.js
@@ -119,16 +119,27 @@ function render(s, acceptLanguage = true) {
     if (document.activeElement !== select) select.value = s.language;
     return;
   }
-  const box = $("#jobs");
+  const groups = {};
+  for (const section of $$("#jobs .group")) groups[section.dataset.group] = { section, list: $(".group-list", section), items: [] };
   const seen = new Set();
-  s.jobs.forEach((j, i) => {
+  for (const j of s.jobs) {
     seen.add(j.id);
     let el = rows.get(j.id);
     if (!el) { el = newRow(j.id); rows.set(j.id, el); }
-    fillRow(el, j);
-    if (box.children[i] !== el) box.insertBefore(el, box.children[i] || null);
-  });
+    const group = groupOf(j, s), asking = s.password?.id === j.id;
+    // o SSE manda a fila inteira a cada mudança; só reescreve o cartão cujo jogo, grupo ou idioma mudou
+    const key = locale + "|" + group + "|" + asking + "|" + JSON.stringify(j);
+    if (el._key !== key) { fillRow(el, j, group, asking); el._key = key; }
+    groups[group].items.push(el);
+  }
   for (const [id, el] of rows) if (!seen.has(id)) { el.remove(); rows.delete(id); }
+  // a ordem dentro de cada grupo é a do motor (a que o usuário escolheu com "Transferir agora")
+  for (const { section, list, items } of Object.values(groups)) {
+    items.forEach((el, i) => { if (list.children[i] !== el) list.insertBefore(el, list.children[i] || null); });
+    section.hidden = items.length === 0;
+    text($(".count", section), items.length ? fmt(items.length, 0) : "");
+  }
+  renderOverall(s);
 
   const m = s.summary, parts = [];
   if (m.sending) parts.push(t("ui.sending", fmt(m.sending, 0)));
@@ -147,15 +158,15 @@ function render(s, acceptLanguage = true) {
   $("#badge").hidden = pending <= 0;
   $("#badge").textContent = pending;
   $("#empty").hidden = s.jobs.length > 0 || uploads.size > 0;
-  $("#emptyFolder").textContent = settings.inputFolder ? t("ui.watchFolderPath", settings.inputFolder) : "";
+  $("#emptyFolder").textContent = settings.inputFolder ? t("ui.watchFolderPath", displayPath(settings.inputFolder)) : "";
   document.title = m.sending ? `Ferry · ${fmt1.format(s.jobs.find(j => j.isActive)?.progress ?? 0)}%` : "Ferry";
 
-  // cartão do PS5 na barra lateral
+  // status do PS5 no topo do conteúdo
   const p = s.ps5;
   $("#dot").className = "dot " + p.status;
   $("#statusTitle").textContent = t({ online: "ui.online", offline: "ui.offline", testing: "ui.testing" }[p.status] || "ui.untested");
   $("#statusHost").textContent = `${p.host}:${p.port}`;
-  $("#statusDest").textContent = p.remoteDir;
+  $("#statusDest").textContent = displayPath(p.remoteDir);
   $("#found").hidden = !p.found;
   if (p.found) $("#foundText").textContent = t("ui.found", p.found);
   password(s.password);
@@ -176,9 +187,21 @@ function newRow(id) {
   return el;
 }
 
-function fillRow(el, j) {
+// Precisa de você → Enviando → Na fila → Concluídos
+function groupOf(j, s) {
+  if (s.password?.id === j.id || j.stage === "Erro" || j.stage === "PacotePronto" || j.stage === "VerifiqueNoPs5") return "attention";
+  if (j.isActive || j.stage === "Extraindo" || j.stage === "Enviando" || j.stage === "SolicitandoInstalacao") return "active";
+  if (j.stage === "Verificado" || j.stage === "InstalacaoSolicitada") return "done";
+  return "queue";
+}
+
+function fillRow(el, j, group, asking) {
   el.dataset.stage = j.stage;
+  el.dataset.group = group;
+  el.toggleAttribute("data-password", asking);
   el.classList.toggle("active", j.isActive);
+  el.classList.toggle("compact", group === "queue" || group === "done");
+  el.classList.toggle("nobar", !j.isActive && !(j.progress > 0 && j.progress < 100)); // barra vazia ou cheia de quem está parado não diz nada
   el.classList.toggle("nocover", !j.icon);
   const img = $(".cover", el);
   if (j.icon && img.dataset.v !== String(j.icon)) { img.dataset.v = j.icon; img.src = `/api/jobs/${j.id}/icon?v=${j.icon}`; }
@@ -187,7 +210,7 @@ function fillRow(el, j) {
   text($(".stage", el), j.stageMessage ? renderMessage(j.stageMessage) : t("ui.stage." + j.stage));
   text($(".tid", el), j.titleId);
   text($(".package-format", el), j.packageFormat);
-  text($(".amount", el), j.totalBytes > 0 ? t("ui.amount", size(j.doneBytes).join(" "), size(j.totalBytes).join(" ")) : "");
+  text($(".amount", el), !(j.totalBytes > 0) ? "" : group === "done" ? size(j.totalBytes).join(" ") : t("ui.amount", size(j.doneBytes).join(" "), size(j.totalBytes).join(" ")));
   text($(".detail", el), renderMessage(j.detailMessage || j.detail));
   $(".detail", el).title = renderMessage(j.detailMessage || j.detail);
   text($(".file", el), j.currentFile);
@@ -196,8 +219,10 @@ function fillRow(el, j) {
   text($(".rate .v", el), rv); text($(".rate .u", el), ru + "/s");
   const [ev, eu] = remaining(j.secondsRemaining);
   text($(".eta .v", el), ev); text($(".eta .u", el), eu);
-  $(".rate", el).hidden = $(".eta", el).hidden = j.canSendNow || j.canRequestInstall;
-  $(".pct", el).hidden = !!j.canRequestInstall;
+  // números só quando dizem algo: o ativo mostra os três; parado com progresso, só o %; o resto, nenhum
+  const showPct = group === "active" || (group === "queue" && j.progress > 0 && j.stage !== "AguardandoPartes");
+  $(".rate", el).hidden = $(".eta", el).hidden = group !== "active" || j.canSendNow || j.canRequestInstall;
+  $(".pct", el).hidden = !showPct || !!j.canRequestInstall;
   $(".sendnow", el).hidden = !j.canSendNow;
   $(".install", el).hidden = !j.canRequestInstall;
   text($(".install", el), t(j.stage === "VerifiqueNoPs5" ? "ui.resendInstall" : "ui.requestInstall"));
@@ -206,6 +231,24 @@ function fillRow(el, j) {
   $(".fill", el).style.width = j.progress + "%";
 }
 
+// Progresso da fila: bytes dos itens enviando/na fila. O término previsto só aparece quando todos têm tamanho conhecido
+// e há velocidade; senão, nada de número inventado.
+function renderOverall(s) {
+  const pending = s.jobs.filter(j => { const g = groupOf(j, s); return g === "active" || g === "queue"; });
+  const known = pending.filter(j => j.totalBytes > 0);
+  $("#overall").hidden = pending.length < 2 || known.length === 0;
+  if ($("#overall").hidden) return;
+  const total = known.reduce((a, j) => a + j.totalBytes, 0), done = known.reduce((a, j) => a + Math.min(j.doneBytes, j.totalBytes), 0);
+  $("#overallFill").style.width = (total ? done * 100 / total : 0) + "%";
+  text($("#overallAmount"), t("ui.amount", size(done).join(" "), size(total).join(" ")));
+  const rate = s.summary.rate;
+  const eta = rate > 0 && known.length === pending.length ? new Date(Date.now() + (total - done) / rate * 1000) : null;
+  text($("#overallEta"), eta ? t("ui.finishesAt", eta.toLocaleTimeString(locale, { hour: "2-digit", minute: "2-digit" })) : "");
+}
+
+// Caminhos longos do Windows chegam com o prefixo \\?\ (ou \\?\UNC\); só a exibição o esconde, o valor salvo não muda.
+function displayPath(p) { return String(p ?? "").replace(/^\\\\\?\\UNC\\/i, "\\\\").replace(/^\\\\\?\\/, ""); }
+
 function text(el, v) { v = v ?? ""; if (el.textContent !== v) el.textContent = v; }
 
 function size(b) {
@@ -225,6 +268,14 @@ function remaining(seconds) {
 }
 
 $("#clearDone").addEventListener("click", () => api("POST", "/api/jobs/clear-finished"));
+// Concluídos começam recolhidos; a escolha fica neste navegador.
+function setDoneOpen(open, remember = true) {
+  $('.group[data-group="done"]').classList.toggle("collapsed", !open);
+  $("#doneToggle").setAttribute("aria-expanded", String(open));
+  if (remember) try { localStorage.setItem("ferry.doneOpen", open ? "1" : "0"); } catch { }
+}
+try { setDoneOpen(localStorage.getItem("ferry.doneOpen") === "1", false); } catch { setDoneOpen(false, false); }
+$("#doneToggle").addEventListener("click", () => setDoneOpen($("#doneToggle").getAttribute("aria-expanded") !== "true"));
 
 // ---------- senha do arquivo (no lugar do diálogo do app Windows) ----------
 let asking = null, answered = 0; // seq do pedido aberto / do último respondido (não reabre enquanto o servidor processa)
@@ -381,6 +432,29 @@ $("#webhookTestBtn").addEventListener("click", async () => {
   finally { button.disabled = false; }
 });
 
+// índice das Configurações: rola até a seção e acompanha a rolagem
+const sectionLinks = $$(".set-nav a");
+function markSection(id) { sectionLinks.forEach(a => a.classList.toggle("on", a.getAttribute("href") === "#" + id)); }
+sectionLinks.forEach(a => a.addEventListener("click", e => {
+  e.preventDefault();
+  const id = a.getAttribute("href").slice(1);
+  $("#" + id).scrollIntoView({ behavior: matchMedia("(prefers-reduced-motion: reduce)").matches ? "auto" : "smooth", block: "start" });
+  markSection(id);
+}));
+let spyQueued = false;
+addEventListener("scroll", () => {
+  if (spyQueued || $("#page-settings").hidden) return;
+  spyQueued = true;
+  requestAnimationFrame(() => {
+    spyQueued = false;
+    const line = innerHeight * 0.3;
+    let current = $$(".set-section")[0];
+    for (const section of $$(".set-section")) if (section.getBoundingClientRect().top <= line) current = section;
+    if (innerHeight + scrollY >= document.documentElement.scrollHeight - 4) current = $$(".set-section").at(-1);
+    markSection(current.id);
+  });
+}, { passive: true });
+
 $("#preset").addEventListener("change", () => {
   const v = $("#preset").value;
   if (!v) return;
@@ -389,6 +463,8 @@ $("#preset").addEventListener("change", () => {
   queueSave("remoteDir", el);
 });
 
+// Sem resposta do servidor (rede caiu, servidor reiniciando) o fetch rejeita com TypeError: diz isso em vez de ficar em "Testando…".
+const requestFailure = error => error instanceof TypeError ? message("ui.requestFailed", error.message) : errorMessage(error);
 async function test() {
   $("#testBtn").disabled = true;
   $("#testResult").className = "test-result";
@@ -397,7 +473,8 @@ async function test() {
     const r = await api("POST", "/api/ps5/test");
     bindText($("#testResult"), r.messageData || r.message);
     $("#testResult").classList.add(r.ok ? "ok" : "fail");
-  } finally { $("#testBtn").disabled = false; }
+  } catch (error) { $("#testResult").classList.add("fail"); bindText($("#testResult"), requestFailure(error)); }
+  finally { $("#testBtn").disabled = false; }
 }
 $("#testBtn").addEventListener("click", test);
 $("#sideTest").addEventListener("click", test);
@@ -406,6 +483,7 @@ $("#findBtn").addEventListener("click", async () => {
   $("#testResult").className = "test-result";
   bindText($("#testResult"), message("ui.searching"));
   try { const r = await api("POST", "/api/ps5/discover"); bindText($("#testResult"), r.messageData || r.message); }
+  catch (error) { $("#testResult").classList.add("fail"); bindText($("#testResult"), requestFailure(error)); }
   finally { $("#findBtn").disabled = false; }
 });
 $("#useFound").addEventListener("click", async () => {
@@ -439,16 +517,38 @@ $("#copyLog").addEventListener("click", async () => {
 // ---------- avisos: na página sempre; do sistema quando o navegador deixa (https ou localhost) ----------
 function notice(n) {
   const title = n.titleMessage || n.title, body = n.textMessage || n.text;
-  toast(n.kind, title, body);
+  toast(n.kind, title, body, n.jobId);
   if (document.hidden && "Notification" in window && Notification.permission === "granted") new Notification(renderMessage(title), { body: renderMessage(body), icon: "logo.svg" });
 }
-function toast(kind, title, body) {
-  const t = document.createElement("div");
-  t.className = "toast " + kind;
-  const b = document.createElement("b"); bindText(b, title); t.append(b);
-  const detail = document.createElement("span"); bindText(detail, body); t.append(detail);
-  $("#toasts").append(t);
-  setTimeout(() => { localizedText.delete(b); localizedText.delete(detail); t.remove(); }, 6000);
+// Um aviso por jogo e tipo: um pedido repetido (ex.: senha incorreta pede de novo) renova o que já está na tela.
+function toast(kind, title, body, jobId) {
+  const key = kind + "|" + (jobId || JSON.stringify([title, body]));
+  const close = el => { localizedText.delete(el._title); localizedText.delete(el._detail); el.remove(); };
+  const existing = [...$("#toasts").children].find(el => el.dataset.key === key);
+  if (existing) { bindText(existing._title, title); bindText(existing._detail, body); clearTimeout(existing._timer); existing._timer = setTimeout(() => close(existing), 6000); return; }
+  const el = document.createElement("div");
+  el.className = "toast " + kind;
+  el.dataset.key = key;
+  el._title = document.createElement("b"); bindText(el._title, title); el.append(el._title);
+  el._detail = document.createElement("span"); bindText(el._detail, body); el.append(el._detail);
+  if (jobId && (kind === "error" || kind === "unknown" || kind === "package_ready")) {
+    const view = document.createElement("button");
+    view.className = "btn small";
+    view.dataset.i18n = "ui.view";
+    view.textContent = t("ui.view");
+    view.addEventListener("click", () => { showJob(jobId); close(el); });
+    el.append(view);
+  }
+  $("#toasts").append(el);
+  el._timer = setTimeout(() => close(el), 6000);
+}
+function showJob(id) {
+  const row = rows.get(id);
+  if (!row) return;
+  showPage("queue");
+  if (row.dataset.group === "done") setDoneOpen(true);
+  row.scrollIntoView({ block: "center", behavior: matchMedia("(prefers-reduced-motion: reduce)").matches ? "auto" : "smooth" });
+  row.classList.remove("flash"); void row.offsetWidth; row.classList.add("flash");
 }
 function refreshNotify() {
   const can = "Notification" in window && window.isSecureContext;
@@ -463,6 +563,7 @@ const uploads = new Map();
 let uploading = Promise.resolve();
 
 $("#addBtn").addEventListener("click", () => $("#fileInput").click());
+$("#addFab").addEventListener("click", () => $("#fileInput").click());
 $("#empty").addEventListener("click", () => $("#fileInput").click());
 $("#fileInput").addEventListener("change", e => { addUploads([...e.target.files]); e.target.value = ""; });
 
diff --git a/web/ui/index.html b/web/ui/index.html
index bc63677..a8a8505 100644
--- a/web/ui/index.html
+++ b/web/ui/index.html
@@ -19,6 +19,7 @@
   <symbol id="i-retry" viewBox="0 0 16 16"><path d="M13 8a5 5 0 1 1-1.6-3.7M13 2.5v2.8h-2.8" fill="none" stroke="currentColor" stroke-width="1.3" stroke-linecap="round"/></symbol>
   <symbol id="i-x" viewBox="0 0 16 16"><path d="m3.5 3.5 9 9m0-9-9 9" fill="none" stroke="currentColor" stroke-width="1.3"/></symbol>
   <symbol id="i-trash" viewBox="0 0 16 16"><path d="M2.5 4h11M6 4V2.5h4V4M4 4l.7 9.5h6.6L12 4M6.6 6.5v5M9.4 6.5v5" fill="none" stroke="currentColor" stroke-width="1.2" stroke-linejoin="round"/></symbol>
+  <symbol id="i-chev" viewBox="0 0 16 16"><path d="m6 3.5 4.5 4.5L6 12.5" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></symbol>
   <symbol id="i-plus" viewBox="0 0 16 16"><path d="M8 2.5v11M2.5 8h11" fill="none" stroke="currentColor" stroke-width="1.5"/></symbol>
 </svg>
 
@@ -91,143 +92,177 @@ <h1 id="authTitle"><span data-i18n="ui.login">Entrar</span></h1>
       <button class="nav" data-page="settings"><span data-i18n="ui.settings">Configurações</span></button>
       <button class="nav" data-page="log"><span data-i18n="ui.log">Log</span></button>
     </nav>
-    <div class="side-bottom">
+  </aside>
+
+  <main class="content">
+    <div class="topbar">
+      <div class="status" role="status" aria-live="polite">
+        <i id="dot" class="dot"></i><b id="statusTitle"><span data-i18n="ui.untested">PS5 não testado</span></b>
+        <span id="statusHost" class="status-host"></span><span id="statusDest" class="status-dest"></span>
+        <button id="sideTest" class="link"><span data-i18n="ui.test">Testar conexão</span></button>
+      </div>
       <div id="found" class="found" hidden>
         <p id="foundText"></p>
-        <div class="row"><button id="useFound" class="btn small"><span data-i18n="ui.useFound">Usar este</span></button><button id="dismissFound" class="link"><span data-i18n="ui.ignore">Ignorar</span></button></div>
-      </div>
-      <div class="status">
-        <div class="status-title"><i id="dot" class="dot"></i><b id="statusTitle"><span data-i18n="ui.untested">PS5 não testado</span></b></div>
-        <div id="statusHost" class="status-host"></div>
-        <div id="statusDest" class="muted"></div>
-        <button id="sideTest" class="link"><span data-i18n="ui.test">Testar conexão</span></button>
+        <button id="useFound" class="btn small"><span data-i18n="ui.useFound">Usar este</span></button><button id="dismissFound" class="link"><span data-i18n="ui.ignore">Ignorar</span></button>
       </div>
     </div>
-  </aside>
-
-  <main class="content">
     <!-- Fila -->
     <section id="page-queue" class="page">
       <header class="head">
-        <div>
+        <div class="head-left">
           <h1><span data-i18n="ui.queue">Fila</span></h1>
           <p id="summary" class="muted"><span data-i18n="ui.emptyQueue">Nenhum jogo na fila</span></p>
         </div>
         <div class="head-right">
           <div id="speed" class="speed" hidden><div><span id="speedVal" class="num"></span><span id="speedUnit" class="unit"></span></div><small><span data-i18n="ui.totalNow">total agora</span></small></div>
-          <button id="clearDone" class="btn" hidden><span data-i18n="ui.clearDone">Limpar concluídos</span></button>
           <button id="addBtn" class="primary"><svg class="ic"><use href="#i-plus"/></svg><span data-i18n="ui.addFiles">Adicionar arquivos</span></button>
           <input id="fileInput" type="file" multiple hidden>
         </div>
+        <div id="overall" class="overall" hidden>
+          <div class="overall-bar"><i id="overallFill"></i></div>
+          <p><span id="overallAmount"></span><span id="overallEta"></span></p>
+        </div>
       </header>
       <div id="uploads"></div>
-      <div id="jobs"></div>
+      <div id="jobs">
+        <section class="group" data-group="attention" hidden><header class="group-head"><h2><span data-i18n="ui.group.attention">Precisa de você</span></h2><span class="count"></span></header><div class="group-list"></div></section>
+        <section class="group" data-group="active" hidden><header class="group-head"><h2><span data-i18n="ui.group.active">Enviando</span></h2><span class="count"></span></header><div class="group-list"></div></section>
+        <section class="group" data-group="queue" hidden><header class="group-head"><h2><span data-i18n="ui.group.queue">Na fila</span></h2><span class="count"></span></header><div class="group-list"></div></section>
+        <section class="group collapsed" data-group="done" hidden>
+          <header class="group-head">
+            <button id="doneToggle" class="group-toggle" aria-expanded="false" aria-controls="doneList"><svg class="chev"><use href="#i-chev"/></svg><h2><span data-i18n="ui.group.done">Concluídos</span></h2><span class="count"></span></button>
+            <button id="clearDone" class="link" hidden><span data-i18n="ui.clearDone">Limpar concluídos</span></button>
+          </header>
+          <div id="doneList" class="group-list"></div>
+        </section>
+      </div>
       <div id="empty" class="empty" hidden>
-        <h2><span data-i18n="ui.emptyTitle">Nada na travessia.</span></h2>
-        <p><span data-i18n="ui.emptyHint">Arraste os arquivos do jogo para esta página ou clique para escolher. Selecione todas as partes de uma vez: elas sobem para o servidor e entram na fila quando todas chegarem.</span></p>
-        <p id="emptyFolder" class="muted"></p>
-        <p class="exts">.zip &nbsp; .rar &nbsp; .7z &nbsp; .001 &nbsp; .z01 &nbsp; .part1.rar &nbsp; .r00 &nbsp; .pkg &nbsp; .exfat &nbsp; .ffpkg &nbsp; .ffpfs &nbsp; .ffpfsc</p>
+        <div class="empty-drop">
+          <h2><span data-i18n="ui.emptyTitle">Nada na travessia.</span></h2>
+          <p><span data-i18n="ui.emptyHint">Arraste os arquivos do jogo para esta página ou clique para escolher. Selecione todas as partes de uma vez: elas sobem para o servidor e entram na fila quando todas chegarem.</span></p>
+          <p id="emptyFolder" class="muted"></p>
+          <p class="exts">.zip &nbsp; .rar &nbsp; .7z &nbsp; .001 &nbsp; .z01 &nbsp; .part1.rar &nbsp; .r00 &nbsp; .pkg &nbsp; .exfat &nbsp; .ffpkg &nbsp; .ffpfs &nbsp; .ffpfsc</p>
+        </div>
       </div>
+      <button id="addFab" class="primary fab" aria-label="Adicionar arquivos" data-i18n-aria-label="ui.addFiles"><svg class="ic"><use href="#i-plus"/></svg><span data-i18n="ui.addFiles">Adicionar arquivos</span></button>
     </section>
 
-    <!-- Configurações -->
+    <!-- Configurações: seções numa coluna, com índice fixo ao lado -->
     <section id="page-settings" class="page" hidden>
       <header class="head">
         <h1><span data-i18n="ui.settings">Configurações</span></h1>
         <p class="muted"><span data-i18n="ui.autosaved">Salvas automaticamente</span></p>
       </header>
-      <div class="cols">
-        <div class="col">
-          <h3>PS5</h3>
-          <div class="row-2">
-            <label class="field grow"><span><span data-i18n="ui.host">IP ou nome</span></span><input data-set="host" autocomplete="off" spellcheck="false"></label>
-            <button id="findBtn" class="btn"><span data-i18n="ui.discover">Procurar na rede</span></button>
-          </div>
-          <p class="hint error" data-err="host"></p>
-          <div class="row-2">
-            <label class="field port"><span><span data-i18n="ui.port">Porta</span></span><input data-set="port" inputmode="numeric"></label>
-            <label class="field grow"><span><span data-i18n="ui.user">Usuário</span></span><input data-set="user" autocomplete="off" spellcheck="false"></label>
-          </div>
-          <p class="hint error" data-err="port"></p>
-          <p class="hint"><span data-i18n="ui.ftpHint">ftpsrv usa 2121 · etaHEN usa 1337</span></p>
-          <label class="field"><span><span data-i18n="ui.ftpPassword">Senha do FTP</span></span><input data-set="password" type="password" autocomplete="off"></label>
-          <div class="row-2 test">
-            <button id="testBtn" class="btn"><span data-i18n="ui.test">Testar conexão</span></button>
-            <p id="testResult" class="test-result"></p>
-          </div>
+      <div class="settings">
+        <nav class="set-nav" aria-label="Seções" data-i18n-aria-label="ui.sections">
+          <a href="#set-ps5" class="on">PS5</a>
+          <a href="#set-destinations" data-i18n="ui.section.destinations">Destinos</a>
+          <a href="#set-transfer" data-i18n="ui.transfer">Envio</a>
+          <a href="#set-passwords" data-i18n="ui.knownPasswords">Senhas conhecidas</a>
+          <a href="#set-notices" data-i18n="ui.section.notices">Avisos</a>
+          <a href="#set-general" data-i18n="ui.section.general">Geral</a>
+        </nav>
+        <div class="set-body">
+          <section id="set-ps5" class="set-section">
+            <h2>PS5</h2>
+            <div class="row-2">
+              <label class="field grow"><span><span data-i18n="ui.host">IP ou nome</span></span><input data-set="host" autocomplete="off" spellcheck="false"></label>
+              <button id="findBtn" class="btn"><span data-i18n="ui.discover">Procurar na rede</span></button>
+            </div>
+            <p class="hint error" data-err="host"></p>
+            <div class="row-2">
+              <label class="field port"><span><span data-i18n="ui.port">Porta</span></span><input data-set="port" inputmode="numeric"></label>
+              <label class="field grow"><span><span data-i18n="ui.user">Usuário</span></span><input data-set="user" autocomplete="off" spellcheck="false"></label>
+            </div>
+            <p class="hint error" data-err="port"></p>
+            <p class="hint"><span data-i18n="ui.ftpHint">ftpsrv usa 2121 · etaHEN usa 1337</span></p>
+            <label class="field"><span><span data-i18n="ui.ftpPassword">Senha do FTP</span></span><input data-set="password" type="password" autocomplete="off"></label>
+            <div class="test">
+              <button id="testBtn" class="btn"><span data-i18n="ui.test">Testar conexão</span></button>
+              <p id="testResult" class="test-result" role="status" aria-live="polite"></p>
+            </div>
+          </section>
 
-          <hr>
-          <h3><span data-i18n="ui.destination">Destino no PS5</span></h3>
-          <div class="row-2">
-            <label class="field preset"><span><span data-i18n="ui.gamesFolder">Pasta dos jogos</span></span>
-              <select id="preset"><option value="/mnt/ext1/homebrew">M.2</option><option value="/data/homebrew" data-i18n="ui.internalSsd">SSD interno</option><option value="" data-i18n="ui.other">Outra</option></select>
-            </label>
-            <label class="field grow"><span>&nbsp;</span><input data-set="remoteDir" spellcheck="false" aria-label="Pasta dos jogos no PS5" data-i18n-aria-label="ui.gamesFolderAria"></label>
-          </div>
-          <p class="hint error" data-err="remoteDir"></p>
-          <label class="field"><span><span data-i18n="ui.exfat">Imagens .exfat (ShadowMount+)</span></span><input data-set="imageDir" spellcheck="false"></label>
-          <p class="hint error" data-err="imageDir"></p>
-          <label class="field"><span data-i18n="ui.pkgDir">Pasta dos PKGs no PS5</span><input data-set="pkgDir" spellcheck="false"></label>
-          <p class="hint error" data-err="pkgDir"></p>
-          <p class="hint" data-i18n="ui.pkgHint"></p>
-          <p class="hint" data-i18n="ui.pkgSpaceHint"></p>
-          <p class="hint" data-i18n="ui.pkgCompatibilityHint"></p>
-          <label class="check"><input data-set="autoInstallPackages" type="checkbox"><span data-i18n="ui.autoInstallPackages">Solicitar instalação automaticamente pelo DPI</span></label>
-          <p class="hint error" data-err="autoInstallPackages"></p>
-          <p class="hint" data-i18n="ui.autoInstallPackagesHint"></p>
-          <label class="field port"><span data-i18n="ui.dpiPort">Porta DPI</span><input data-set="dpiPort" inputmode="numeric"></label>
-          <p class="hint error" data-err="dpiPort"></p>
-          <p class="hint" data-i18n="ui.dpiHint"></p>
-          <details id="dpiHelp" class="dpi-help">
-            <summary data-i18n="ui.dpiHelpTitle">Como ativar o DPI?</summary>
-            <ol><li data-i18n="ui.dpiHelpStep1"></li><li data-i18n="ui.dpiHelpStep2"></li><li data-i18n="ui.dpiHelpStep3"></li></ol>
-            <p class="hint" data-i18n="ui.dpiHelpConfig"></p>
-            <p class="hint" data-i18n="ui.dpiHelpV2"></p>
-            <p class="hint" data-i18n="ui.dpiHelpCompatibility"></p>
-          </details>
-          <div class="row-2 test"><button id="dpiTestBtn" class="btn" data-i18n="ui.dpiTest">Testar DPI</button><p id="dpiTestResult" class="test-result" role="status" aria-live="polite"></p></div>
-          <hr>
-          <h3 data-i18n="ui.webhook">Webhook</h3>
-          <label class="check"><input data-set="webhookEnabled" type="checkbox"><span data-i18n="ui.webhookEnabled">Ativar avisos por webhook</span></label>
-          <p class="hint error" data-err="webhookEnabled"></p>
-          <label class="field"><span data-i18n="ui.webhookService">Serviço</span>
-            <select data-set="webhookKind"><option value="generic" data-i18n="ui.webhookGeneric">JSON genérico</option><option value="discord">Discord</option><option value="ntfy">ntfy</option></select>
-          </label>
-          <p class="hint error" data-err="webhookKind"></p>
-          <label class="field"><span data-i18n="ui.webhookUrl">URL do webhook ou tópico ntfy</span><input data-set="webhookUrl" type="password" autocomplete="off" spellcheck="false"></label>
-          <p class="hint error" data-err="webhookUrl"></p>
-          <p class="hint" data-i18n="ui.webhookHint">Avisa mesmo com o navegador fechado.</p>
-          <p class="hint" data-i18n="ui.webhookLocaleHint">Em Automático, usa o idioma deste navegador ao configurar.</p>
-          <div class="row-2"><button id="webhookTestBtn" class="btn" data-i18n="ui.webhookTest">Testar webhook</button><p id="webhookTestResult" class="hint grow" role="status" aria-live="polite"></p></div>
-        </div>
+          <section id="set-destinations" class="set-section">
+            <h2 data-i18n="ui.section.destinations">Destinos</h2>
+            <div class="row-2">
+              <label class="field preset"><span><span data-i18n="ui.gamesFolder">Pasta dos jogos</span></span>
+                <select id="preset"><option value="/mnt/ext1/homebrew">M.2</option><option value="/data/homebrew" data-i18n="ui.internalSsd">SSD interno</option><option value="" data-i18n="ui.other">Outra</option></select>
+              </label>
+              <label class="field grow"><span>&nbsp;</span><input data-set="remoteDir" spellcheck="false" aria-label="Pasta dos jogos no PS5" data-i18n-aria-label="ui.gamesFolderAria"></label>
+            </div>
+            <p class="hint error" data-err="remoteDir"></p>
+            <label class="field"><span><span data-i18n="ui.exfat">Imagens .exfat (ShadowMount+)</span></span><input data-set="imageDir" spellcheck="false"></label>
+            <p class="hint error" data-err="imageDir"></p>
+            <h3 data-i18n="ui.section.packages">Pacotes PKG</h3>
+            <label class="field"><span data-i18n="ui.pkgDir">Pasta dos PKGs no PS5</span><input data-set="pkgDir" spellcheck="false"></label>
+            <p class="hint error" data-err="pkgDir"></p>
+            <p class="hint" data-i18n="ui.pkgHint"></p>
+            <p class="hint" data-i18n="ui.pkgSpaceHint"></p>
+            <p class="hint" data-i18n="ui.pkgCompatibilityHint"></p>
+            <label class="check"><input data-set="autoInstallPackages" type="checkbox"><span data-i18n="ui.autoInstallPackages">Solicitar instalação automaticamente pelo DPI</span></label>
+            <p class="hint error" data-err="autoInstallPackages"></p>
+            <p class="hint" data-i18n="ui.autoInstallPackagesHint"></p>
+            <label class="field port"><span data-i18n="ui.dpiPort">Porta DPI</span><input data-set="dpiPort" inputmode="numeric"></label>
+            <p class="hint error" data-err="dpiPort"></p>
+            <p class="hint" data-i18n="ui.dpiHint"></p>
+            <details id="dpiHelp" class="dpi-help">
+              <summary data-i18n="ui.dpiHelpTitle">Como ativar o DPI?</summary>
+              <ol><li data-i18n="ui.dpiHelpStep1"></li><li data-i18n="ui.dpiHelpStep2"></li><li data-i18n="ui.dpiHelpStep3"></li></ol>
+              <p class="hint" data-i18n="ui.dpiHelpConfig"></p>
+              <p class="hint" data-i18n="ui.dpiHelpV2"></p>
+              <p class="hint" data-i18n="ui.dpiHelpCompatibility"></p>
+            </details>
+            <div class="test"><button id="dpiTestBtn" class="btn" data-i18n="ui.dpiTest">Testar DPI</button><p id="dpiTestResult" class="test-result" role="status" aria-live="polite"></p></div>
+          </section>
 
-        <div class="col">
-          <h3><span data-i18n="ui.watchFolder">Pasta monitorada</span></h3>
-          <label class="field"><span><span data-i18n="ui.serverPath">Caminho no servidor</span></span><input data-set="inputFolder" spellcheck="false" placeholder="/games"></label>
-          <p class="hint error" data-err="inputFolder"></p>
-          <p class="hint"><span data-i18n="ui.watchHint">Opcional. Jogos que chegarem aqui entram na fila sozinhos, quando todas as partes chegarem. Os arquivos enviados pelo navegador também são gravados aqui (sem ela, na pasta de dados).</span></p>
+          <section id="set-transfer" class="set-section">
+            <h2 data-i18n="ui.transfer">Envio</h2>
+            <label class="field"><span><span data-i18n="ui.connections">Conexões paralelas</span></span>
+              <span class="range"><input data-set="connections" type="range" min="1" max="8" step="1"><b id="connVal"></b></span>
+            </label>
+            <label class="check"><input data-set="deleteOriginal" type="checkbox"><span><span data-i18n="ui.deleteOriginal">Apagar as partes originais depois do envio conferido</span></span></label>
+            <label class="check"><input data-set="autoClearFinished" type="checkbox"><span><span data-i18n="ui.autoClearFinished">Remover concluídos da fila automaticamente</span></span></label>
+            <p class="hint" data-i18n="ui.pkgRetentionHint"></p>
+            <h3><span data-i18n="ui.watchFolder">Pasta monitorada</span></h3>
+            <label class="field"><span><span data-i18n="ui.serverPath">Caminho no servidor</span></span><input data-set="inputFolder" spellcheck="false" placeholder="/games"></label>
+            <p class="hint error" data-err="inputFolder"></p>
+            <p class="hint"><span data-i18n="ui.watchHint">Opcional. Jogos que chegarem aqui entram na fila sozinhos, quando todas as partes chegarem. Os arquivos enviados pelo navegador também são gravados aqui (sem ela, na pasta de dados).</span></p>
+          </section>
 
-          <hr>
-          <h3><span data-i18n="ui.transfer">Envio</span></h3>
-          <label class="field"><span><span data-i18n="ui.connections">Conexões paralelas</span></span>
-            <span class="range"><input data-set="connections" type="range" min="1" max="8" step="1"><b id="connVal"></b></span>
-          </label>
-          <label class="check"><input data-set="deleteOriginal" type="checkbox"><span><span data-i18n="ui.deleteOriginal">Apagar as partes originais depois do envio conferido</span></span></label>
-          <label class="check"><input data-set="autoClearFinished" type="checkbox"><span><span data-i18n="ui.autoClearFinished">Remover concluídos da fila automaticamente</span></span></label>
-          <p class="hint" data-i18n="ui.pkgRetentionHint"></p>
+          <section id="set-passwords" class="set-section">
+            <h2><span data-i18n="ui.knownPasswords">Senhas conhecidas</span></h2>
+            <p class="hint"><span data-i18n="ui.passwordsHint">uma por linha, testadas antes de perguntar</span></p>
+            <textarea data-set="knownPasswords" rows="6" spellcheck="false" aria-label="Senhas conhecidas" data-i18n-aria-label="ui.knownPasswords"></textarea>
+          </section>
 
-          <hr>
-          <h3><span data-i18n="ui.knownPasswords">Senhas conhecidas</span> <small><span data-i18n="ui.passwordsHint">uma por linha, testadas antes de perguntar</span></small></h3>
-          <textarea data-set="knownPasswords" rows="6" spellcheck="false" aria-label="Senhas conhecidas" data-i18n-aria-label="ui.knownPasswords"></textarea>
+          <section id="set-notices" class="set-section">
+            <h2 data-i18n="ui.section.notices">Avisos</h2>
+            <h3 data-i18n="ui.webhook">Webhook</h3>
+            <label class="check"><input data-set="webhookEnabled" type="checkbox"><span data-i18n="ui.webhookEnabled">Ativar avisos por webhook</span></label>
+            <p class="hint error" data-err="webhookEnabled"></p>
+            <label class="field"><span data-i18n="ui.webhookService">Serviço</span>
+              <select data-set="webhookKind"><option value="generic" data-i18n="ui.webhookGeneric">JSON genérico</option><option value="discord">Discord</option><option value="ntfy">ntfy</option></select>
+            </label>
+            <p class="hint error" data-err="webhookKind"></p>
+            <label class="field"><span data-i18n="ui.webhookUrl">URL do webhook ou tópico ntfy</span><input data-set="webhookUrl" type="password" autocomplete="off" spellcheck="false"></label>
+            <p class="hint error" data-err="webhookUrl"></p>
+            <p class="hint" data-i18n="ui.webhookHint">Avisa mesmo com o navegador fechado.</p>
+            <p class="hint" data-i18n="ui.webhookLocaleHint">Em Automático, usa o idioma deste navegador ao configurar.</p>
+            <div class="test"><button id="webhookTestBtn" class="btn" data-i18n="ui.webhookTest">Testar webhook</button><p id="webhookTestResult" class="test-result" role="status" aria-live="polite"></p></div>
+            <h3 data-i18n="ui.section.browser">Navegador</h3>
+            <div class="row-2"><p id="notifyText" class="muted grow"></p><button id="notifyBtn" class="btn" hidden><span data-i18n="ui.enableNotices">Ativar avisos</span></button></div>
+          </section>
 
-          <hr>
-          <label class="field language"><span data-i18n="ui.language">Idioma</span>
-            <select data-set="language"><option value="auto" data-i18n="ui.languageAuto">Automático</option><option value="pt-BR" lang="pt-BR">Português (Brasil)</option><option value="en" lang="en">English</option></select>
-          </label>
-          <p class="hint error" data-err="language"></p>
-          <h3><span data-i18n="ui.account">Conta</span></h3>
-          <div class="row-2"><p class="muted grow"><span data-i18n="ui.signedIn">Entrou como</span> <b id="whoami"></b>.</p><button id="logout" class="btn"><span data-i18n="ui.logout">Sair</span></button></div>
-          <div class="row-2"><p id="notifyText" class="muted grow"></p><button id="notifyBtn" class="btn" hidden><span data-i18n="ui.enableNotices">Ativar avisos</span></button></div>
+          <section id="set-general" class="set-section">
+            <h2 data-i18n="ui.section.general">Geral</h2>
+            <label class="field language"><span data-i18n="ui.language">Idioma</span>
+              <select data-set="language"><option value="auto" data-i18n="ui.languageAuto">Automático</option><option value="pt-BR" lang="pt-BR">Português (Brasil)</option><option value="en" lang="en">English</option></select>
+            </label>
+            <p class="hint error" data-err="language"></p>
+            <h3><span data-i18n="ui.account">Conta</span></h3>
+            <div class="row-2"><p class="muted grow"><span data-i18n="ui.signedIn">Entrou como</span> <b id="whoami"></b>.</p><button id="logout" class="btn"><span data-i18n="ui.logout">Sair</span></button></div>
+          </section>
         </div>
       </div>
     </section>
@@ -272,7 +307,7 @@ <h2 class="title"></h2>
     <div class="acts">
       <button class="icon" data-act="pause" title="Pausar" data-i18n-title="ui.pause" aria-label="Pausar" data-i18n-aria-label="ui.pause"><svg><use href="#i-pause"/></svg></button>
       <button class="icon" data-act="resume" title="Retomar" data-i18n-title="ui.resume" aria-label="Retomar" data-i18n-aria-label="ui.resume"><svg><use href="#i-play"/></svg></button>
-      <button class="icon strong" data-act="retry" title="Tentar de novo (pede a senha de novo se estiver errada)" data-i18n-title="ui.retryHint" aria-label="Tentar de novo" data-i18n-aria-label="ui.retry"><svg><use href="#i-retry"/></svg></button>
+      <button class="icon strong" data-act="retry" title="Tentar de novo (pede a senha de novo se estiver errada)" data-i18n-title="ui.retryHint" aria-label="Tentar de novo" data-i18n-aria-label="ui.retry"><svg><use href="#i-retry"/></svg><span class="lbl" data-i18n="ui.retry">Tentar de novo</span></button>
       <button class="icon" data-act="cancel" title="Cancelar" data-i18n-title="ui.cancel" aria-label="Cancelar" data-i18n-aria-label="ui.cancel"><svg><use href="#i-x"/></svg></button>
       <button class="icon" data-act="remove" title="Remover da fila" data-i18n-title="ui.remove" aria-label="Remover da fila" data-i18n-aria-label="ui.remove"><svg><use href="#i-trash"/></svg></button>
     </div>
diff --git a/web/ui/locales/en.json b/web/ui/locales/en.json
index 98e866e..b7cedaa 100644
--- a/web/ui/locales/en.json
+++ b/web/ui/locales/en.json
@@ -151,5 +151,18 @@
   "ui.dpiHelpStep3": "Then enable Request installation automatically via DPI for new uploads, or use the DPI button on an uploaded package.",
   "ui.dpiHelpConfig": "Alternatively, set DPI=1 in /data/etaHEN/config.ini and reload etaHEN to apply it. You can leave automatic mode off and install on PS5 instead.",
   "ui.dpiHelpV2": "Ferry uses DPI v1 on port 9090. Direct Package Installer V2 on port 12800 is a separate service; some firmware versions require it for ★ Custom Background Package Installer.",
-  "ui.dpiHelpCompatibility": "Options and support depend on the etaHEN version and console firmware. Check the instructions for your version; an open port does not confirm installation compatibility."
+  "ui.dpiHelpCompatibility": "Options and support depend on the etaHEN version and console firmware. Check the instructions for your version; an open port does not confirm installation compatibility.",
+  "ui.group.attention": "Needs you",
+  "ui.group.active": "Sending",
+  "ui.group.queue": "Queued",
+  "ui.group.done": "Finished",
+  "ui.finishesAt": "done around {0}",
+  "ui.view": "View",
+  "ui.sections": "Sections",
+  "ui.section.destinations": "Destinations",
+  "ui.section.packages": "PKG packages",
+  "ui.section.notices": "Notifications",
+  "ui.section.browser": "Browser",
+  "ui.section.general": "General",
+  "ui.requestFailed": "No response from the Ferry server ({0}). Check the connection and try again."
 }
diff --git a/web/ui/locales/pt-BR.json b/web/ui/locales/pt-BR.json
index be2276d..767a630 100644
--- a/web/ui/locales/pt-BR.json
+++ b/web/ui/locales/pt-BR.json
@@ -151,5 +151,18 @@
   "ui.dpiHelpStep3": "Depois, ative Solicitar instalação automaticamente pelo DPI para novos envios ou use o botão DPI de um pacote já enviado.",
   "ui.dpiHelpConfig": "Alternativa: em /data/etaHEN/config.ini, configure DPI=1 e recarregue o etaHEN para aplicar. Se preferir, deixe o automático desligado e instale pelo PS5.",
   "ui.dpiHelpV2": "O Ferry usa o DPI v1, porta 9090. Direct Package Installer V2, porta 12800, é outro serviço; em alguns firmwares ele é necessário para ★ Custom Background Package Installer.",
-  "ui.dpiHelpCompatibility": "As opções e o suporte dependem da versão do etaHEN e do firmware do console. Confira as instruções da versão que você usa; porta aberta não confirma compatibilidade de instalação."
+  "ui.dpiHelpCompatibility": "As opções e o suporte dependem da versão do etaHEN e do firmware do console. Confira as instruções da versão que você usa; porta aberta não confirma compatibilidade de instalação.",
+  "ui.group.attention": "Precisa de você",
+  "ui.group.active": "Enviando",
+  "ui.group.queue": "Na fila",
+  "ui.group.done": "Concluídos",
+  "ui.finishesAt": "termina por volta de {0}",
+  "ui.view": "Ver",
+  "ui.sections": "Seções",
+  "ui.section.destinations": "Destinos",
+  "ui.section.packages": "Pacotes PKG",
+  "ui.section.notices": "Avisos",
+  "ui.section.browser": "Navegador",
+  "ui.section.general": "Geral",
+  "ui.requestFailed": "Sem resposta do servidor Ferry ({0}). Confira a conexão e tente de novo."
 }