, Correçoes UX

app/views/admin/romaneios/_veiculos.html.erb

@@ -4,10 +4,29 @@
     paradas cada um tem, que é justamente a conferência que ele faz antes de
     mandar imprimir.
 
-    Adapta ao dispositivo (diretriz 3): no celular vira faixa horizontal, porque
-    72 itens empilhados empurrariam a tabela para fora da primeira tela; no
-    desktop é coluna com rolagem própria, do lado da tabela. %>
-<div class="bg-[#111] border border-white/5 rounded-2xl p-4 space-y-3">
+    ── NO CELULAR É UM BLOCO RECOLHIDO (diretriz 3) ───────────────────────────
+    Aberto, este painel tem os 72 carros mais o campo de motorista e três botões:
+    media 1.160px de altura e empurrava a EDIÇÃO — busca, campo PLANO e a tabela
+    de paradas — para 1.330px e 1.533px de rolagem, ou seja, duas telas abaixo do
+    que o operador foi fazer ali. Medido em 28/08/2026 no iPhone.
+
+    Recolhido, o <summary> mostra o que importa de relance (carro atual e quantas
+    paradas) e a edição sobe para a primeira tela. Um toque abre a lista inteira.
+
+    NO DESKTOP NADA MUDA: o <summary> some (`lg:hidden`) e o conteúdo é forçado a
+    aparecer com `lg:block`, que vence o "esconder" nativo do <details> fechado —
+    continua a coluna sempre aberta ao lado da tabela. %>
+<details class="bg-[#111] border border-white/5 rounded-2xl overflow-hidden">
+  <summary class="lg:hidden cursor-pointer list-none min-h-[56px] px-4 py-3 flex items-center gap-3
+                  text-white hover:bg-white/5">
+    <span class="font-semibold truncate"><%= @veiculo %></span>
+    <span class="text-xs px-2 py-0.5 rounded-lg bg-white/5 text-gray-400 shrink-0">
+      <%= @romaneio.contagem_por_veiculo[@veiculo].to_i %> paradas
+    </span>
+    <span class="ml-auto text-xs text-orange-400 shrink-0">trocar veículo</span>
+  </summary>
+
+  <div class="lg:block p-4 space-y-3">
   <div class="flex items-center justify-between">
     <h2 class="text-white font-semibold text-sm">Veículos</h2>
     <span class="text-xs text-gray-500"><%= @veiculos.size %> no plano</span>
@@ -108,4 +127,5 @@
       </span>
     <% end %>
   </div>
-</div>
+  </div>
+</details>