带图短文桌面端左右分栏：文字 2/5、图 3/5，图不再全宽铺开吃高度；窄屏维持堆叠

frontend/src/ui/yohaku/YohakuFeed.vue

@@ -54,8 +54,8 @@ const shortTitle = (p) => plain(p.content_html).slice(0, 40) + '…'
         </div>
       </RouterLink>
 
-      <!-- 短文：纸条，正文直接铺开 -->
-      <RouterLink v-else class="note" :to="`/post/${encodeURIComponent(p.slug)}`">
+      <!-- 短文：纸条，正文直接铺开；带图时桌面端左右分栏（.split，见 home.css） -->
+      <RouterLink v-else class="note" :class="{ split: p.images && p.images.length > 0 }" :to="`/post/${encodeURIComponent(p.slug)}`">
         <div class="body" v-html="thumbifyHtml(p.content_html)" />
         <!-- 短文配图：Twitter 式网格（快发盒上传）；点图开预览（不跳详情） -->
         <div

frontend/src/ui/yohaku/home.css

@@ -154,6 +154,23 @@ html[data-ui='vivid'] .note .imgs.n2 {grid-template-rows:minmax(0,1fr);}
 html[data-ui='vivid'] .note .imgs.n3,
 html[data-ui='vivid'] .note .imgs.n4 {grid-template-rows:minmax(0,1fr) minmax(0,1fr);}
 html[data-ui='vivid'] .note .imgs.n3 img:first-child {grid-row:span 2;}
+/* 桌面端带图短文：文字、图片各占一半，图片不再因全宽铺开而吃高度——
+   半宽下沿用各 n* 自己的 2:1 容器比例，高度自动减半。meta/标签铺整行垫在
+   卡片底部：若让图跨多行去对齐左列内容，grid 会把跨行项的富余高度摊到
+   各 auto 行里，左列出现行间空隙。n1 没有自己的容器比例，这里补 2:1。
+   窄屏退回上下堆叠（图紧跟正文），≤720px 不分栏。 */
+@media (min-width:721px) {
+  html[data-ui='vivid'] .note.split {display:grid;grid-template-columns:2fr 3fr;
+    column-gap:18px;row-gap:10px;}
+  html[data-ui='vivid'] .note.split .body {grid-column:1;grid-row:1;}
+  html[data-ui='vivid'] .note.split .imgs {grid-column:2;grid-row:1;
+    margin-top:0;align-self:start;}
+  html[data-ui='vivid'] .note.split .imgs.n1 {aspect-ratio:2/1;
+    grid-template-rows:minmax(0,1fr);}
+  html[data-ui='vivid'] .note.split .link-card,
+  html[data-ui='vivid'] .note.split .meta,
+  html[data-ui='vivid'] .note.split .tags {grid-column:1 / -1;margin-top:0;}
+}
 html[data-ui='vivid'] .note .tags {display:flex;gap:14px;flex-wrap:wrap;margin-top:8px}
 html[data-ui='vivid'] .pager {display:flex;gap:8px;align-items:center;justify-content:center;
   margin-top:36px;flex-wrap:wrap;}