feat(atalk): 评论区美化——CSS 加载缺陷修复与 tokens 主题接管（T2）

- 缺陷修复（op-gitea 车道发现）：Artalk JS 不自动注入样式，评论区自
  上线起一直跑 UA 默认样式——mount() 补挂 dist/Artalk.css，onload 后
  init（失败降级不阻塞评论可用）
- 主题接管：18 个 --at-color-* 变量全套映射站点 tokens（var() 引用，
  明暗随 [data-theme] 自动翻转）；init 锁 darkMode:false 防双暗叠加
- 气质层：8px 圆角/squircle 头像/时间戳与 UA 转 JetBrains Mono/
  正文链接 underline 纪律/弹层选择器 body 前缀提特异性

验证: build 23 页 exit 0；--at-color-main:var(--accent) 入产物；
      生产页注入同款 CSS 探针矩阵全中（亮 #3454d1/暗 #8ea2ff）；
      双态截图 /tmp/e2e-shots/at-polish-{light,dark}.png 待视觉终审

Spec: 2026-10-25_add-media-and-polish

Co-authored-by: GLM-5.3

content/posts/media-sample.md

@@ -0,0 +1,32 @@
+---
+title: "媒体支持样例"
+pubDate: 2026-10-25
+category: tech
+tags: [test, hidden]
+# 视觉/管线测试样张：draft:true 会被 getStaticPaths 全链路过滤（无静态产物），
+# 故用非 draft + hidden 标记保证 /archives/media-sample/ 产物存在；视觉测试完成后应删除本篇
+draft: false
+---
+
+本篇为三媒管线样张：验证 markdown 图片、HTML5 视频/音频在构建链路中的处理，供视觉回归与多端适配测试使用（hidden 标记，勿收录）。
+
+## 图片（markdown 语法，构建期经 sharp 优化）
+
+![样例照片](./assets/media-sample/sample-photo.jpg)
+
+*图注写法：斜体单独成段，photos 目录样片副本（1600×2400 竖幅）。*
+
+## 视频（raw HTML，H.264 320×240，ffmpeg testsrc2 生成）
+
+<!-- 视/音频走 public/media/ 绝对路径：raw HTML 相对引用不经打包器（曾实测 404），
+     与写作指南“大视频走仓外 store 的 /media/ 命名空间”对齐 -->
+
+<video controls preload="metadata" width="320" height="240" src="/media/media-sample/sample-video.mp4"></video>
+
+*原生 <video> 控件，无 JS；源文件 45KB，faststart 已开启。*
+
+## 音频（raw HTML，440Hz 正弦波 mp3）
+
+<audio controls preload="metadata" src="/media/media-sample/sample-audio.mp3"></audio>
+
+*原生 <audio> 控件；源文件 18KB。*