STYLED - Flatten media picker and use a two-column media layout

Fix the deeply nested cards in the project form (screenshot: Cover Media >
Cover > preview card, with duplicate labels):

- MediaFieldPicker no longer wraps itself in AppCards. It renders one flat
  bordered box laid out in two columns (preview | controls), dropping two
  nested card layers and the duplicate title.
- Cover Media and Assets now sit side by side in a two-column grid instead
  of stacked with a separator.

All 375 tests pass; tsc and eslint clean.

components/admin/portfolio-project-form.tsx

@@ -36,7 +36,6 @@ import { Button } from "@/components/ui/button";
 import { Checkbox } from "@/components/ui/checkbox";
 import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
-import { Separator } from "@/components/ui/separator";
 import {
   Select,
   SelectContent,
@@ -1072,7 +1071,8 @@ export function PortfolioProjectForm({
 
         <div>
           <AppCard level={3} padding="md">
-            <section className="space-y-5">
+            <div className="grid gap-6 lg:grid-cols-2">
+              <section className="space-y-4">
               <SectionHeader
                 title="Cover Media"
                 description="Wähle das Titelbild, das das Projekt in Listen repräsentiert."
@@ -1090,9 +1090,9 @@ export function PortfolioProjectForm({
                 clearLabel="Remove Cover"
                 emptyValue={{ mode: "upload", assetId: "", url: "", label: "" }}
               />
+              </section>
 
-              <Separator />
-
+              <section className="space-y-4">
               <SectionHeader
                 title="Assets"
                 description="Optional — Galeriebilder mit lokalisiertem Alt-Text."
@@ -1221,7 +1221,8 @@ export function PortfolioProjectForm({
                   })}
                 </Accordion>
               )}
-            </section>
+              </section>
+            </div>
           </AppCard>
         </div>
       </div>