fix(ui): improve detail page mobile layout - smaller title, compact back button, action buttons in one row

app/static/style.css

@@ -218,6 +218,7 @@ code { background: var(--bg); padding: .15rem .4rem; border-radius: 4px; font-si
 .detail-title-row { display: flex; align-items: center; gap: .75rem; }
 .detail-title-row h1 { margin: 0; }
 .btn-back { padding: .35rem .6rem; font-size: 1rem; text-decoration: none; }
+.detail-actions { display: flex; gap: .4rem; flex-wrap: wrap; align-items: center; }
 
 /* Filter */
 .filter-bar { margin-bottom: 1.25rem; }
@@ -241,7 +242,9 @@ code { background: var(--bg); padding: .15rem .4rem; border-radius: 4px; font-si
     .recent-meta .recent-time { display: inline; }
     .recent-item { gap: .5rem; padding: .5rem; }
     .section-header { flex-direction: column; gap: .75rem; }
-    .section-header .btn { width: 100%; }
+    .section-header .btn { width: auto; }
+    .detail-title-row h1 { font-size: 1.2rem; }
+    .btn-back { padding: .25rem .5rem; font-size: .85rem; }
     .profile-grid { grid-template-columns: 1fr; }
     .profile-card-stats { gap: .75rem; flex-wrap: wrap; }
 }

app/templates/postcard_detail.html

@@ -6,7 +6,7 @@
         <a href="/profiles/{{ postcard.profile_id }}/postcards" class="btn btn-back">←</a>
         <h1>{{ postcard.card_number }}</h1>
     </div>
-    <div>
+    <div class="detail-actions">
         <a href="/postcards/{{ postcard.id }}/edit" class="btn">编辑</a>
         {% if postcard.status == 'sent' %}
         <form method="post" action="/postcards/{{ postcard.id }}/mark-delivered" class="inline">