余白：手机端文章去卡片 + 信息流元信息下移 + 标签统一为纯文本 #标签

信息流（首页）
- 元信息（类型 / 日期 / 时长 / 字数）从标题上方挪到摘要之后，和标签同一块：
  卡片开头只留标题摘要，读完再看「什么时候、多长」
- 标签去掉 chip 样式，改为纯文本 #标签（# 走 ::before，链接的可读名仍是标签本身）；
  原来那排药丸看着能点，其实是卡片链接里的 span，点哪儿都进文章
- .card .tags / .note .tags 间距 6px -> 14px，配合纯文本

文章详情页
- 手机上不再套卡片：.article-layout 28px + .paper 22px + 卡片边框三层一共
  吃掉约 84px，390 屏上正文只剩 275px；平铺后 330px。同时关掉卡片右上角
  那团强调色渐晕（::before，卡片没了就只剩一块脏）。桌面 / 平板仍是卡片
- 底部标签跟信息流统一成纯文本 #标签，并去掉「标签」二字的小标
  （有 # 就是标签，再来两个字是重复）
- 详情页的标签是链接，补 padding:6px 0 —— 12.5px 裸文字按下去只有 ~18px 高，
  手机上不好点；不画背景不画边框，观感不变

标签样式只有 home.css 一处 .tg，信息流与详情页共用。

验证：headless Chromium 从站上量取计算样式 + 截图（390 / 1280）
- 详情页手机：paper bg=透明 border=0 radius=0 shadow=none padding=0，::before=none，
  正文 330px；桌面：bg=#fffefb border=1px radius=20px padding=48px，::before=block
- .end 子元素只剩 [A.tg, A.tg]；.tg 12.5px / padding 0 / ::before "#"；gap 14px
- 公网 138.2.17.73:8080 产物 md5 与磁盘一致；npm run build 无警告

frontend/src/ui/yohaku/article.css

@@ -69,9 +69,13 @@ html[data-ui='vivid'] .prose blockquote {margin:1.8em 0;padding:16px 20px;
 html[data-ui='vivid'] .prose ul {padding-left:1.3em}
 html[data-ui='vivid'] .prose li {margin-bottom:.55em}
 html[data-ui='vivid'] .prose hr {border:0;border-top:1px dashed var(--line-strong);margin:2.5em 0}
+/* 标签用 home.css 里那个共用的 .tg（纯文本 #标签），不加自己的一套。
+   「标签」二字的小标也去掉了：有 # 就是标签，再来两个字是重复。
+   这里只补一点纵向内边距 —— 详情页的标签是链接，12.5px 裸文字只有 ~18px 高，
+   手机上不好点；不画背景不画边框，观感不变。 */
 html[data-ui='vivid'] .paper .end {margin-top:40px;padding-top:24px;border-top:1px dashed var(--line-strong);
-  display:flex;gap:8px;flex-wrap:wrap;align-items:center;}
-html[data-ui='vivid'] .paper .end .lbl {font-size:12px;color:var(--muted);font-weight:700;margin-right:4px}
+  display:flex;gap:14px;flex-wrap:wrap;align-items:center;}
+html[data-ui='vivid'] .paper .end .tg {padding:6px 0}
 html[data-ui='vivid'] .back {display:inline-flex;align-items:center;gap:6px;
   font-size:13px;font-weight:700;color:var(--accent);
   margin-bottom:20px;padding:6px 0;