docs: require Tabler icons for all icons

Replace the 📌/🔄 emoji with inline Tabler SVGs colored via --color-accent
to match the note-header icons, and reword the always-latest description so
the two options no longer share the same em-dash phrasing.

CLAUDE.md

@@ -38,6 +38,10 @@ Tailwind v4 uses the modern CSS-based config in `src/styles/app.css`:
 - DaisyUI configured via `@plugin 'daisyui' { themes: retro --default, coffee --prefersdark; }`
 - `@tailwindcss/typography` for prose styling
 
+### Icons
+
+Use [Tabler icons](https://tabler.io/icons) for every icon. Paste the outline SVG inline and keep `stroke="currentColor"` so it inherits color from its parent (icons in the note header render in `--color-accent`).
+
 ### Directory Structure
 
 ```sh

src/components/ShareNote.vue

@@ -90,7 +90,25 @@ const copy = async (url: string, label: string) => {
         class="share-option"
         @click="copy(snapshotUrl(), 'Snapshot')"
       >
-        <span class="share-option-icon">📌</span>
+        <span class="share-option-icon">
+          <svg
+            xmlns="http://www.w3.org/2000/svg"
+            class="icon icon-tabler icon-tabler-pin"
+            width="24"
+            height="24"
+            viewBox="0 0 24 24"
+            stroke-width="1.5"
+            stroke="currentColor"
+            fill="none"
+            stroke-linecap="round"
+            stroke-linejoin="round"
+          >
+            <path stroke="none" d="M0 0h24v24H0z" fill="none" />
+            <path d="M15 4.5l-4 4l-4 1.5l-1.5 1.5l7 7l1.5 -1.5l1.5 -4l4 -4" />
+            <path d="M9 15l-4.5 4.5" />
+            <path d="M14.5 4l5.5 5.5" />
+          </svg>
+        </span>
         <span class="share-option-text">
           <span class="share-option-title">This exact version</span>
           <span class="share-option-desc">
@@ -105,11 +123,28 @@ const copy = async (url: string, label: string) => {
         class="share-option"
         @click="copy(livingUrl(), 'Always-latest')"
       >
-        <span class="share-option-icon">🔄</span>
+        <span class="share-option-icon">
+          <svg
+            xmlns="http://www.w3.org/2000/svg"
+            class="icon icon-tabler icon-tabler-repeat"
+            width="24"
+            height="24"
+            viewBox="0 0 24 24"
+            stroke-width="1.5"
+            stroke="currentColor"
+            fill="none"
+            stroke-linecap="round"
+            stroke-linejoin="round"
+          >
+            <path stroke="none" d="M0 0h24v24H0z" fill="none" />
+            <path d="M4 12v-3a3 3 0 0 1 3 -3h13m-3 -3l3 3l-3 3" />
+            <path d="M20 12v3a3 3 0 0 1 -3 3h-13m3 3l-3 -3l3 -3" />
+          </svg>
+        </span>
         <span class="share-option-text">
           <span class="share-option-title">Always latest</span>
           <span class="share-option-desc">
-            Follows these notes — the reader gets the current version.
+            Follows these notes, so the reader always sees the current version.
           </span>
         </span>
       </button>
@@ -147,8 +182,8 @@ const copy = async (url: string, label: string) => {
 }
 
 .share-option-icon {
-  font-size: 1.4rem;
+  flex-shrink: 0;
-  line-height: 1.6rem;
+  color: var(--color-accent);
 }
 
 .share-option-text {