Add client-side note encryption

- WebCrypto keyring (PBKDF2 600k + AES-GCM master key) and per-note/per-image keys
- Encrypt/decrypt commands convert the note and its own images, deleting the originals
- Unlock, setup and change-password dialogs; manual lock; lock on page close
- Encrypted images are decrypted to blob URLs; pasted images are encrypted before upload
- Rewrite image links in the browser when renaming an encrypted note
- Skip local drafts for encrypted notes and confirm before closing with unsaved changes
- Show encrypted notes as locked with an explanation outside secure contexts

web/src/app/TreeNode.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { computed, nextTick, ref, watch } from 'vue'
 import Icon from './Icon.vue'
-import { basename, joinPath } from './paths'
+import { basename, isEncrypted, joinPath, noteTitle } from './paths'
 import { expanded, type TreeNode } from './tree'
 import { createFolder, createNote, move, openNote, remove, renameTarget, ws } from './workspace'
 
@@ -26,7 +26,7 @@ watch(
   isRenaming,
   async (on) => {
     if (!on) return
-    draft.value = props.node.dir ? props.node.name : props.node.name.replace(/\.md$/, '')
+    draft.value = props.node.dir ? props.node.name : noteTitle(props.node.name)
     await nextTick()
     input.value?.focus()
     input.value?.select()
@@ -104,7 +104,8 @@ function onDrop(e: DragEvent) {
         @keydown.esc.prevent="cancelRename"
         @blur="commitRename"
       />
-      <span v-else class="rm-tree-name">{{ node.dir ? node.name : node.name.replace(/\.md$/, '') }}</span>
+      <span v-else class="rm-tree-name">{{ node.dir ? node.name : noteTitle(node.name) }}</span>
+      <Icon v-if="!isRenaming && isEncrypted(node.path)" name="lock" :size="12" class="rm-lock-icon" />
       <button class="rm-icon-btn rm-tree-more" title="更多操作" @click.stop="menuOpen = !menuOpen">
         <Icon name="more" />
       </button>