lumiere mobile: fix overflow, style ⋮ button, show tile actions on touch

1. Page width overflow: stack lumiere-header as column on mobile so
   lumiere-header-actions (flex-shrink:0) no longer forces the container
   wider than the viewport. Search form and new-project button each take
   full width on their own line.

2. ⋮ button in compact row: override dropdown-table-button-toggle inside
   lumiere-compact-actions with Lumière-palette colours and tighter
   padding, replacing the table-context styling.

3. Tile view action strip: add @media (hover: none) rule so
   lumiere-card-actions is always opacity:1 on touch devices (phones have
   no cursor, so the hover-reveal pattern is unusable).

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

services/web/frontend/stylesheets/pages/project-list-lumiere.scss

@@ -863,6 +863,25 @@ $lum-noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' wi
         background: rgba($lum-teal, 0.09) !important;
       }
     }
+
+    // ⋮ dropdown toggle — restyled from the table variant to match Lumière
+    .dropdown-table-button-toggle {
+      padding: 0.2rem 0.35rem;
+      border-radius: 6px;
+      background: transparent;
+      border: none;
+      color: $lum-text-muted;
+      line-height: 1;
+      transition: background-color 0.15s ease, color 0.15s ease;
+
+      &:hover,
+      &:focus,
+      &[aria-expanded='true'] {
+        background: rgba($lum-teal, 0.09);
+        color: $lum-teal;
+        outline: none;
+      }
+    }
   }
 
   .lumiere-compact-row:hover .lumiere-compact-actions .action-btn,
@@ -874,6 +893,26 @@ $lum-noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' wi
 
   @media (max-width: 767px) {
 
+    // Stack the header vertically so nothing overflows the viewport width.
+    // Without this, lumiere-header-actions (flex-shrink:0) forces the flex
+    // container wider than the screen.
+    .lumiere-header {
+      flex-direction: column;
+      align-items: stretch;
+      gap: 0.5rem;
+    }
+
+    .lumiere-header-actions {
+      width: 100%;
+      flex-shrink: 1;
+      min-width: 0;
+
+      form.project-search {
+        flex: 1;
+        min-width: 0;
+      }
+    }
+
     // Compact row: 2-line layout
     // Row 1: [checkbox] [name+tags]  [⋮ action]
     // Row 2: [checkbox] [format · owner · date]
@@ -930,6 +969,14 @@ $lum-noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' wi
     }
   }
 
+  // ── Touch devices: card actions always visible (no hover cursor on phones) ──
+
+  @media (hover: none) {
+    .lumiere-card-actions {
+      opacity: 1;
+    }
+  }
+
   // ── Mobile toolbar: filter pills + zoom control ───────────────────────────
 
   .lumiere-mobile-toolbar {