update

renderer/index.html

@@ -3,9 +3,13 @@
 <head>
   <meta charset="UTF-8" />
   <meta http-equiv="Content-Security-Policy" content="default-src 'self'; style-src 'self' 'unsafe-inline'; img-src 'self' data:;" />
-  <title>剪贴板历史</title>
-  <link rel="stylesheet" href="themes/fonts.css" />
+  <title>Clipboard</title>
+  <!-- tokens 必须在 fonts 之前：两者都定义 --font-ui/--font-mono，同特异性
+       后加载的赢。fonts 在后才能让 Inter/JetBrains Mono 进字体栈（tokens
+       注释「fonts.css 会覆盖这两个」的前提）；fonts 加载失败时 tokens 的
+       系统字体栈自然兜底。 -->
   <link rel="stylesheet" href="themes/tokens.css" />
+  <link rel="stylesheet" href="themes/fonts.css" />
   <link rel="stylesheet" href="themes/themes.css" />
   <link rel="stylesheet" href="themes/accents.css" />
   <link rel="stylesheet" href="styles.css" />
@@ -16,7 +20,7 @@
     <!-- 拖动区 -->
     <header id="drag-bar">
       <img id="app-icon" alt="" />
-      <h1 id="title">剪贴板历史</h1>
+      <h1 id="title">Clipboard</h1>
       <span id="ipc-status" class="ipc-dot" title="IPC 订阅状态" aria-label="IPC 状态"></span>
       <span class="spacer"></span>
       <button id="refresh-btn" class="icon-btn" title="刷新 (F5)" aria-label="刷新">
@@ -96,6 +100,11 @@
     </footer>
   </div>
 
+  <!-- 图片大图预览：点缩略图弹出，Esc / 点击任意处关闭 -->
+  <div id="lightbox" class="hidden" role="dialog" aria-modal="true" aria-label="图片大图预览" tabindex="-1">
+    <img id="lightbox-img" alt="图片大图预览" />
+  </div>
+
   <!-- 单条卡片模板 -->
   <template id="card-tpl">
     <li class="card" tabindex="0">