, Correçoes UX

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

@@ -5,10 +5,16 @@
   <div class="grid grid-cols-1 sm:grid-cols-[minmax(0,1fr)_minmax(0,280px)] gap-3">
     <div>
       <label class="block text-sm font-medium text-gray-300 mb-1.5">Buscar nesta folha</label>
-      <div class="flex gap-2">
+      <%# `min-w-0` no input é o que impede rolagem lateral no celular: um <input>
+          tem largura intrínseca (~20 caracteres) e `flex-1` NÃO encolhe abaixo
+          dela, porque o `min-width` padrão de um item flex é `auto`. Com o botão
+          ao lado, o par estourava para 487px numa tela de 393px e levava a página
+          junto. O `flex-wrap` é a segunda rede: em tela muito estreita o botão
+          desce em vez de espremer o campo. %>
+      <div class="flex flex-wrap gap-2">
         <input type="search" placeholder="NF, nome ou bairro/rua…"
                data-romaneio-target="busca" data-action="input->romaneio#filtrar"
-               class="flex-1 bg-[#1a1a1a] border border-white/10 rounded-xl px-3 py-3 text-white
+               class="flex-1 min-w-0 bg-[#1a1a1a] border border-white/10 rounded-xl px-3 py-3 text-white
                       placeholder-gray-600 focus:outline-none focus:border-orange-500 min-h-[48px]">
         <%# Rótulo que descreve o que o controle faz (diretriz 2): limpa a BUSCA,
             não o romaneio. %>