From 8d8f6e353c099be72f38808bcc9d7e25a412a2fd Mon Sep 17 00:00:00 2001
From: Angel M Miguel <angel@endor.dev>
Date: Thu, 12 Feb 2026 08:30:41 +0100
Subject: [PATCH] feat: add icon library and new icons

---
 packages/web/package.json                     |   2 +
 packages/web/src/app.d.ts                     |   2 +
 packages/web/src/lib/components/Header.svelte |  12 +-
 .../lib/components/LogsLocationModal.svelte   | 102 ++---------
 .../web/src/lib/components/SessionItem.svelte |   7 +-
 .../src/lib/components/SidebarFooter.svelte   |  30 +---
 .../web/src/lib/components/UploadZone.svelte  |  38 +---
 .../lib/components/modals/ShareModal.svelte   | 163 +++---------------
 .../lib/components/viewer/FilterBar.svelte    |  16 +-
 .../viewer/entries/AssistantMessage.svelte    |  15 +-
 .../viewer/entries/SubagentEntry.svelte       |  15 +-
 .../viewer/entries/SystemMessage.svelte       |  15 +-
 .../viewer/entries/ToolCallEntry.svelte       |  15 +-
 .../components/viewer/panel/FileList.svelte   |  30 +---
 .../viewer/panel/SessionActions.svelte        |  30 +---
 .../viewer/panel/SessionInfo.svelte           |   7 +-
 packages/web/vite.config.ts                   |   3 +-
 pnpm-lock.yaml                                | 123 +++++++++++++
 18 files changed, 199 insertions(+), 426 deletions(-)

diff --git a/packages/web/package.json b/packages/web/package.json
index b39893f..c78380a 100644
--- a/packages/web/package.json
+++ b/packages/web/package.json
@@ -20,6 +20,7 @@
     "posthog-js": "^1.345.2"
   },
   "devDependencies": {
+    "@iconify-json/dinkie-icons": "^1.2.0",
     "@sveltejs/adapter-cloudflare": "^7.2.6",
     "@sveltejs/adapter-node": "^5.5.2",
     "@sveltejs/kit": "^2.50.1",
@@ -30,6 +31,7 @@
     "svelte-check": "^4.3.5",
     "tailwindcss": "^4.1.18",
     "typescript": "^5.9.3",
+    "unplugin-icons": "^23.0.1",
     "vite": "^7.3.1"
   }
 }
diff --git a/packages/web/src/app.d.ts b/packages/web/src/app.d.ts
index 520c421..bf7d82e 100644
--- a/packages/web/src/app.d.ts
+++ b/packages/web/src/app.d.ts
@@ -1,3 +1,5 @@
+/// <reference types="unplugin-icons/types/svelte" />
+
 // See https://svelte.dev/docs/kit/types#app.d.ts
 // for information about these interfaces
 declare global {
diff --git a/packages/web/src/lib/components/Header.svelte b/packages/web/src/lib/components/Header.svelte
index b9a3136..8315d0e 100644
--- a/packages/web/src/lib/components/Header.svelte
+++ b/packages/web/src/lib/components/Header.svelte
@@ -1,4 +1,5 @@
 <script lang="ts">
+import StarIcon from 'virtual:icons/dinkie-icons/white-medium-star';
 import logo from '$lib/assets/logo.svg';
 </script>
 
@@ -45,16 +46,7 @@ import logo from '$lib/assets/logo.svg';
       rel="noopener noreferrer"
       class="inline-flex items-center gap-1.5 px-3 py-1 rounded border border-edge hover:border-accent/50 hover:text-accent transition-all duration-200"
     >
-      <svg
-        class="w-4 h-4"
-        viewBox="0 0 24 24"
-        fill="currentColor"
-        aria-hidden="true"
-      >
-        <path
-          d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z"
-        />
-      </svg>
+      <StarIcon />
       Star on GitHub
     </a>
   </nav>
diff --git a/packages/web/src/lib/components/LogsLocationModal.svelte b/packages/web/src/lib/components/LogsLocationModal.svelte
index df00aaf..ea3b7c5 100644
--- a/packages/web/src/lib/components/LogsLocationModal.svelte
+++ b/packages/web/src/lib/components/LogsLocationModal.svelte
@@ -1,4 +1,8 @@
 <script lang="ts">
+import ClipboardIcon from 'virtual:icons/dinkie-icons/clipboard';
+import CloseIcon from 'virtual:icons/dinkie-icons/diagonal-cross';
+import CheckIcon from 'virtual:icons/dinkie-icons/white-heavy-check-mark';
+
 interface Props {
   open: boolean;
   onClose: () => void;
@@ -197,19 +201,7 @@ const currentAgentName = $derived(
           onclick={onClose}
           aria-label="Close modal"
         >
-          <svg
-            class="w-5 h-5"
-            fill="none"
-            viewBox="0 0 24 24"
-            stroke="currentColor"
-            stroke-width="2"
-          >
-            <path
-              stroke-linecap="round"
-              stroke-linejoin="round"
-              d="M6 18L18 6M6 6l12 12"
-            />
-          </svg>
+          <CloseIcon class="w-5 h-5" />
         </button>
       </div>
 
@@ -278,33 +270,9 @@ const currentAgentName = $derived(
                     title="Copy path"
                   >
                     {#if copied}
-                      <svg
-                        class="w-4 h-4 text-status-success"
-                        fill="none"
-                        viewBox="0 0 24 24"
-                        stroke="currentColor"
-                        stroke-width="2"
-                      >
-                        <path
-                          stroke-linecap="round"
-                          stroke-linejoin="round"
-                          d="M5 13l4 4L19 7"
-                        />
-                      </svg>
+                      <CheckIcon class="w-4 h-4 text-status-success" />
                     {:else}
-                      <svg
-                        class="w-4 h-4"
-                        fill="none"
-                        viewBox="0 0 24 24"
-                        stroke="currentColor"
-                        stroke-width="2"
-                      >
-                        <path
-                          stroke-linecap="round"
-                          stroke-linejoin="round"
-                          d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"
-                        />
-                      </svg>
+                      <ClipboardIcon class="w-4 h-4" />
                     {/if}
                   </button>
                 </div>
@@ -340,33 +308,9 @@ const currentAgentName = $derived(
                 title="Copy command"
               >
                 {#if copiedExport}
-                  <svg
-                    class="w-4 h-4 text-status-success"
-                    fill="none"
-                    viewBox="0 0 24 24"
-                    stroke="currentColor"
-                    stroke-width="2"
-                  >
-                    <path
-                      stroke-linecap="round"
-                      stroke-linejoin="round"
-                      d="M5 13l4 4L19 7"
-                    />
-                  </svg>
+                  <CheckIcon class="w-4 h-4 text-status-success" />
                 {:else}
-                  <svg
-                    class="w-4 h-4"
-                    fill="none"
-                    viewBox="0 0 24 24"
-                    stroke="currentColor"
-                    stroke-width="2"
-                  >
-                    <path
-                      stroke-linecap="round"
-                      stroke-linejoin="round"
-                      d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"
-                    />
-                  </svg>
+                  <ClipboardIcon class="w-4 h-4" />
                 {/if}
               </button>
             </div>
@@ -389,33 +333,9 @@ const currentAgentName = $derived(
                 title="Copy command"
               >
                 {#if copiedServe}
-                  <svg
-                    class="w-4 h-4 text-status-success"
-                    fill="none"
-                    viewBox="0 0 24 24"
-                    stroke="currentColor"
-                    stroke-width="2"
-                  >
-                    <path
-                      stroke-linecap="round"
-                      stroke-linejoin="round"
-                      d="M5 13l4 4L19 7"
-                    />
-                  </svg>
+                  <CheckIcon class="w-4 h-4 text-status-success" />
                 {:else}
-                  <svg
-                    class="w-4 h-4"
-                    fill="none"
-                    viewBox="0 0 24 24"
-                    stroke="currentColor"
-                    stroke-width="2"
-                  >
-                    <path
-                      stroke-linecap="round"
-                      stroke-linejoin="round"
-                      d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"
-                    />
-                  </svg>
+                  <ClipboardIcon class="w-4 h-4" />
                 {/if}
               </button>
             </div>
diff --git a/packages/web/src/lib/components/SessionItem.svelte b/packages/web/src/lib/components/SessionItem.svelte
index d90b106..4d9e7b8 100644
--- a/packages/web/src/lib/components/SessionItem.svelte
+++ b/packages/web/src/lib/components/SessionItem.svelte
@@ -1,4 +1,5 @@
 <script lang="ts">
+import GithubIcon from 'virtual:icons/dinkie-icons/github';
 import type { SessionMeta } from '$lib/types';
 
 interface Props {
@@ -86,11 +87,7 @@ function handleRemove(e: MouseEvent) {
       {/if}
       {#if isGist}
         <span class="flex items-center gap-1 text-muted/70">
-          <svg class="w-3 h-3" viewBox="0 0 24 24" fill="currentColor">
-            <path
-              d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"
-            />
-          </svg>
+          <GithubIcon class="w-3 h-3" />
           gist
         </span>
       {/if}
diff --git a/packages/web/src/lib/components/SidebarFooter.svelte b/packages/web/src/lib/components/SidebarFooter.svelte
index 09fcd19..59a3360 100644
--- a/packages/web/src/lib/components/SidebarFooter.svelte
+++ b/packages/web/src/lib/components/SidebarFooter.svelte
@@ -1,4 +1,6 @@
 <script lang="ts">
+import DeleteIcon from 'virtual:icons/dinkie-icons/diagonal-cross';
+import ShieldIcon from 'virtual:icons/dinkie-icons/shield';
 import ConfirmationModal from '$lib/components/modals/ConfirmationModal.svelte';
 import { isLocal } from '$lib/features';
 
@@ -26,19 +28,7 @@ function handleCancelClear() {
 
 <div class="border-t border-edge px-3 py-3 space-y-3">
   <div class="flex items-start gap-2 text-xs text-muted">
-    <svg
-      class="w-4 h-4 shrink-0 mt-0.5"
-      fill="none"
-      viewBox="0 0 24 24"
-      stroke="currentColor"
-      stroke-width="1.5"
-    >
-      <path
-        stroke-linecap="round"
-        stroke-linejoin="round"
-        d="M9 12.75 11.25 15 15 9.75m-3-7.036A11.959 11.959 0 0 1 3.598 6 11.99 11.99 0 0 0 3 9.749c0 5.592 3.824 10.29 9 11.623 5.176-1.332 9-6.03 9-11.622 0-1.31-.21-2.571-.598-3.751h-.152c-3.196 0-6.1-1.248-8.25-3.285Z"
-      />
-    </svg>
+    <ShieldIcon class="w-4 h-4 shrink-0 mt-0.5" />
     {#if isLocal}
       <span>sessions are loaded from your local machine.</span>
     {:else}
@@ -52,19 +42,7 @@ function handleCancelClear() {
     class="w-full flex items-center justify-center gap-2 px-3 py-1.5 text-xs text-muted border border-edge rounded hover:text-red-400 hover:border-red-400/50 transition-colors cursor-pointer"
     onclick={handleClearClick}
   >
-    <svg
-      class="w-3.5 h-3.5"
-      fill="none"
-      viewBox="0 0 24 24"
-      stroke="currentColor"
-      stroke-width="1.5"
-    >
-      <path
-        stroke-linecap="round"
-        stroke-linejoin="round"
-        d="m14.74 9-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 0 1-2.244 2.077H8.084a2.25 2.25 0 0 1-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 0 0-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 0 1 3.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 0 0-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 0 0-7.5 0"
-      />
-    </svg>
+    <DeleteIcon class="w-3.5 h-3.5" />
     {isLocal ? 'clear cached sessions' : 'clear local data'}
   </button>
 </div>
diff --git a/packages/web/src/lib/components/UploadZone.svelte b/packages/web/src/lib/components/UploadZone.svelte
index 10ada1d..69d259d 100644
--- a/packages/web/src/lib/components/UploadZone.svelte
+++ b/packages/web/src/lib/components/UploadZone.svelte
@@ -1,4 +1,7 @@
 <script lang="ts">
+import DownloadIcon from 'virtual:icons/dinkie-icons/download';
+import FolderIcon from 'virtual:icons/dinkie-icons/file-folder';
+import GithubIcon from 'virtual:icons/dinkie-icons/github';
 import LogsLocationModal from './LogsLocationModal.svelte';
 
 interface Props {
@@ -92,19 +95,7 @@ function handleFileChange(e: Event) {
     ondragover={handleDragOver}
     ondrop={handleDrop}
   >
-    <svg
-      class="w-10 h-10 text-muted"
-      fill="none"
-      viewBox="0 0 24 24"
-      stroke="currentColor"
-      stroke-width="1"
-    >
-      <path
-        stroke-linecap="round"
-        stroke-linejoin="round"
-        d="M3 16.5v2.25A2.25 2.25 0 0 0 5.25 21h13.5A2.25 2.25 0 0 0 21 18.75V16.5m-13.5-9L12 3m0 0 4.5 4.5M12 3v13.5"
-      />
-    </svg>
+    <DownloadIcon class="w-10 h-10 text-muted rotate-180" />
 
     <div class="text-center space-y-2">
       <h2 class="text-foreground-bright font-bold text-base">
@@ -124,19 +115,7 @@ function handleFileChange(e: Event) {
       class="flex items-center gap-2 px-6 py-2 text-sm border border-edge rounded hover:border-foreground/30 hover:text-foreground-bright transition-colors cursor-pointer text-foreground"
       onclick={() => fileInput.click()}
     >
-      <svg
-        class="w-4 h-4"
-        fill="none"
-        viewBox="0 0 24 24"
-        stroke="currentColor"
-        stroke-width="1.5"
-      >
-        <path
-          stroke-linecap="round"
-          stroke-linejoin="round"
-          d="M3.75 9.776c.112-.017.227-.026.344-.026h15.812c.117 0 .232.009.344.026m-16.5 0a2.25 2.25 0 0 0-1.883 2.542l.857 6a2.25 2.25 0 0 0 2.227 1.932H19.05a2.25 2.25 0 0 0 2.227-1.932l.857-6a2.25 2.25 0 0 0-1.883-2.542m-16.5 0V6A2.25 2.25 0 0 1 6 3.75h3.879a1.5 1.5 0 0 1 1.06.44l2.122 2.12a1.5 1.5 0 0 0 1.06.44H18A2.25 2.25 0 0 1 20.25 9v.776"
-        />
-      </svg>
+      <FolderIcon class="w-4 h-4" />
       browse files
     </button>
     <input
@@ -186,12 +165,7 @@ function handleFileChange(e: Event) {
                 ></path>
               </svg>
             {:else}
-              <!-- GitHub icon -->
-              <svg class="w-4 h-4" viewBox="0 0 24 24" fill="currentColor">
-                <path
-                  d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"
-                />
-              </svg>
+              <GithubIcon class="w-4 h-4" />
             {/if}
             load gist
           </button>
diff --git a/packages/web/src/lib/components/modals/ShareModal.svelte b/packages/web/src/lib/components/modals/ShareModal.svelte
index 1394935..561a3af 100644
--- a/packages/web/src/lib/components/modals/ShareModal.svelte
+++ b/packages/web/src/lib/components/modals/ShareModal.svelte
@@ -1,4 +1,11 @@
 <script lang="ts">
+import InfoIcon from 'virtual:icons/dinkie-icons/circled-information-source';
+import ClipboardIcon from 'virtual:icons/dinkie-icons/clipboard';
+import CloseIcon from 'virtual:icons/dinkie-icons/diagonal-cross';
+import LinkIcon from 'virtual:icons/dinkie-icons/link-symbol';
+import ChevronIcon from 'virtual:icons/dinkie-icons/right-black-triangle';
+import ShieldIcon from 'virtual:icons/dinkie-icons/shield';
+import CheckIcon from 'virtual:icons/dinkie-icons/white-heavy-check-mark';
 import type { SessionMeta } from '$lib/types';
 
 interface Props {
@@ -120,19 +127,7 @@ async function copyUrl() {
           onclick={onClose}
           aria-label="Close modal"
         >
-          <svg
-            class="w-5 h-5"
-            fill="none"
-            viewBox="0 0 24 24"
-            stroke="currentColor"
-            stroke-width="2"
-          >
-            <path
-              stroke-linecap="round"
-              stroke-linejoin="round"
-              d="M6 18L18 6M6 6l12 12"
-            />
-          </svg>
+          <CloseIcon class="w-5 h-5" />
         </button>
       </div>
 
@@ -159,51 +154,15 @@ async function copyUrl() {
               title="Copy URL"
             >
               {#if copied}
-                <svg
-                  class="w-4 h-4 text-status-success"
-                  fill="none"
-                  viewBox="0 0 24 24"
-                  stroke="currentColor"
-                  stroke-width="2"
-                >
-                  <path
-                    stroke-linecap="round"
-                    stroke-linejoin="round"
-                    d="M5 13l4 4L19 7"
-                  />
-                </svg>
+                <CheckIcon class="w-4 h-4 text-status-success" />
               {:else}
-                <svg
-                  class="w-4 h-4"
-                  fill="none"
-                  viewBox="0 0 24 24"
-                  stroke="currentColor"
-                  stroke-width="2"
-                >
-                  <path
-                    stroke-linecap="round"
-                    stroke-linejoin="round"
-                    d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"
-                  />
-                </svg>
+                <ClipboardIcon class="w-4 h-4" />
               {/if}
             </button>
           </div>
 
           <p class="text-xs text-muted/60 flex items-center gap-1.5">
-            <svg
-              class="w-3.5 h-3.5"
-              fill="none"
-              viewBox="0 0 24 24"
-              stroke="currentColor"
-              stroke-width="1.5"
-            >
-              <path
-                stroke-linecap="round"
-                stroke-linejoin="round"
-                d="M12 9v3.75m9-.75a9 9 0 1 1-18 0 9 9 0 0 1 18 0Zm-9 3.75h.008v.008H12v-.008Z"
-              />
-            </svg>
+            <InfoIcon class="w-3.5 h-3.5" />
             anyone with this link can view this session
           </p>
         {:else}
@@ -230,33 +189,9 @@ async function copyUrl() {
                   title="Copy command"
                 >
                   {#if copiedCmd}
-                    <svg
-                      class="w-4 h-4 text-status-success"
-                      fill="none"
-                      viewBox="0 0 24 24"
-                      stroke="currentColor"
-                      stroke-width="2"
-                    >
-                      <path
-                        stroke-linecap="round"
-                        stroke-linejoin="round"
-                        d="M5 13l4 4L19 7"
-                      />
-                    </svg>
+                    <CheckIcon class="w-4 h-4 text-status-success" />
                   {:else}
-                    <svg
-                      class="w-4 h-4"
-                      fill="none"
-                      viewBox="0 0 24 24"
-                      stroke="currentColor"
-                      stroke-width="2"
-                    >
-                      <path
-                        stroke-linecap="round"
-                        stroke-linejoin="round"
-                        d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"
-                      />
-                    </svg>
+                    <ClipboardIcon class="w-4 h-4" />
                   {/if}
                 </button>
               </div>
@@ -269,19 +204,7 @@ async function copyUrl() {
             <div
               class="flex items-start gap-2 bg-accent/[0.04] border border-accent/15 rounded px-3 py-2.5"
             >
-              <svg
-                class="w-4 h-4 text-accent shrink-0 mt-0.5"
-                fill="none"
-                viewBox="0 0 24 24"
-                stroke="currentColor"
-                stroke-width="1.5"
-              >
-                <path
-                  stroke-linecap="round"
-                  stroke-linejoin="round"
-                  d="M9 12.75 11.25 15 15 9.75m-3-7.036A11.959 11.959 0 0 1 3.598 6 11.99 11.99 0 0 0 3 9.749c0 5.592 3.824 10.29 9 11.623 5.176-1.332 9-6.03 9-11.622 0-1.31-.21-2.571-.598-3.751h-.152c-3.196 0-6.1-1.248-8.25-3.285Z"
-                />
-              </svg>
+              <ShieldIcon class="w-4 h-4 text-accent shrink-0 mt-0.5" />
               <p class="text-xs text-muted leading-relaxed">
                 Includes built-in
                 <span class="text-accent">anonymization tools</span> to strip
@@ -296,19 +219,9 @@ async function copyUrl() {
                 onclick={() => (manualExpanded = !manualExpanded)}
               >
                 <span>Sharing it manually</span>
-                <svg
-                  class="w-4 h-4 transition-transform {manualExpanded ? 'rotate-180' : ''}"
-                  fill="none"
-                  viewBox="0 0 24 24"
-                  stroke="currentColor"
-                  stroke-width="2"
-                >
-                  <path
-                    stroke-linecap="round"
-                    stroke-linejoin="round"
-                    d="m19.5 8.25-7.5 7.5-7.5-7.5"
-                  />
-                </svg>
+                <ChevronIcon
+                  class="w-4 h-4 transition-transform {manualExpanded ? 'rotate-180' : 'rotate-90'}"
+                />
               </button>
               {#if manualExpanded}
                 <div class="px-3 pb-3 space-y-4 border-t border-edge pt-3">
@@ -326,19 +239,7 @@ async function copyUrl() {
                     rel="noopener noreferrer"
                     class="inline-flex items-center gap-2 text-accent hover:text-accent/80 text-sm transition-colors"
                   >
-                    <svg
-                      class="w-4 h-4"
-                      fill="none"
-                      viewBox="0 0 24 24"
-                      stroke="currentColor"
-                      stroke-width="2"
-                    >
-                      <path
-                        stroke-linecap="round"
-                        stroke-linejoin="round"
-                        d="M13.5 6H5.25A2.25 2.25 0 0 0 3 8.25v10.5A2.25 2.25 0 0 0 5.25 21h10.5A2.25 2.25 0 0 0 18 18.75V10.5m-10.5 6L21 3m0 0h-5.25M21 3v5.25"
-                      />
-                    </svg>
+                    <LinkIcon class="w-4 h-4" />
                     create a new gist on github
                   </a>
 
@@ -370,33 +271,9 @@ async function copyUrl() {
                           title="Copy share link"
                         >
                           {#if copiedManualLink}
-                            <svg
-                              class="w-4 h-4 text-status-success"
-                              fill="none"
-                              viewBox="0 0 24 24"
-                              stroke="currentColor"
-                              stroke-width="2"
-                            >
-                              <path
-                                stroke-linecap="round"
-                                stroke-linejoin="round"
-                                d="M5 13l4 4L19 7"
-                              />
-                            </svg>
+                            <CheckIcon class="w-4 h-4 text-status-success" />
                           {:else}
-                            <svg
-                              class="w-4 h-4"
-                              fill="none"
-                              viewBox="0 0 24 24"
-                              stroke="currentColor"
-                              stroke-width="2"
-                            >
-                              <path
-                                stroke-linecap="round"
-                                stroke-linejoin="round"
-                                d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"
-                              />
-                            </svg>
+                            <ClipboardIcon class="w-4 h-4" />
                           {/if}
                         </button>
                       </div>
diff --git a/packages/web/src/lib/components/viewer/FilterBar.svelte b/packages/web/src/lib/components/viewer/FilterBar.svelte
index 6155748..bf9b706 100644
--- a/packages/web/src/lib/components/viewer/FilterBar.svelte
+++ b/packages/web/src/lib/components/viewer/FilterBar.svelte
@@ -1,4 +1,6 @@
 <script lang="ts">
+import SearchIcon from 'virtual:icons/dinkie-icons/right-magnifying-glass';
+
 interface Props {
   value: string;
 }
@@ -7,19 +9,7 @@ let { value = $bindable() }: Props = $props();
 </script>
 
 <div class="flex items-center gap-2 px-4 py-3 border-b border-edge">
-  <svg
-    class="w-4 h-4 text-muted shrink-0"
-    fill="none"
-    viewBox="0 0 24 24"
-    stroke="currentColor"
-    stroke-width="1.5"
-  >
-    <path
-      stroke-linecap="round"
-      stroke-linejoin="round"
-      d="m21 21-5.197-5.197m0 0A7.5 7.5 0 1 0 5.196 5.196a7.5 7.5 0 0 0 10.607 10.607Z"
-    />
-  </svg>
+  <SearchIcon class="w-4 h-4 text-muted shrink-0" />
   <input
     type="text"
     bind:value
diff --git a/packages/web/src/lib/components/viewer/entries/AssistantMessage.svelte b/packages/web/src/lib/components/viewer/entries/AssistantMessage.svelte
index 4eb7d7f..374ffe0 100644
--- a/packages/web/src/lib/components/viewer/entries/AssistantMessage.svelte
+++ b/packages/web/src/lib/components/viewer/entries/AssistantMessage.svelte
@@ -1,4 +1,5 @@
 <script lang="ts">
+import ChevronIcon from 'virtual:icons/dinkie-icons/right-black-triangle';
 import Markdown from '$lib/components/Markdown.svelte';
 import type { AssistantEntry } from '$lib/types/timeline';
 
@@ -33,19 +34,9 @@ function formatTime(date: Date): string {
       class="flex items-center gap-1.5 text-xs text-muted mb-2 hover:text-foreground transition-colors"
       onclick={() => (showThinking = !showThinking)}
     >
-      <svg
+      <ChevronIcon
         class="w-3 h-3 transition-transform {showThinking ? 'rotate-90' : ''}"
-        fill="none"
-        viewBox="0 0 24 24"
-        stroke="currentColor"
-        stroke-width="2"
-      >
-        <path
-          stroke-linecap="round"
-          stroke-linejoin="round"
-          d="m8.25 4.5 7.5 7.5-7.5 7.5"
-        />
-      </svg>
+      />
       {entry.thinking.isEncrypted ? '// encrypted reasoning' : '// thinking'}
     </button>
     {#if showThinking && entry.thinking.text}
diff --git a/packages/web/src/lib/components/viewer/entries/SubagentEntry.svelte b/packages/web/src/lib/components/viewer/entries/SubagentEntry.svelte
index 8762355..e1a964b 100644
--- a/packages/web/src/lib/components/viewer/entries/SubagentEntry.svelte
+++ b/packages/web/src/lib/components/viewer/entries/SubagentEntry.svelte
@@ -1,4 +1,5 @@
 <script lang="ts">
+import ChevronIcon from 'virtual:icons/dinkie-icons/right-black-triangle';
 import type { SubagentEntry as SubagentType } from '$lib/types/timeline';
 
 interface Props {
@@ -64,19 +65,9 @@ function formatTokens(n: number): string {
     {#if !expanded}
       <span class="text-muted truncate flex-1 ml-1">// {stepCount} steps</span>
     {/if}
-    <svg
+    <ChevronIcon
       class="w-3 h-3 text-muted ml-auto shrink-0 transition-transform {expanded ? 'rotate-90' : ''}"
-      fill="none"
-      viewBox="0 0 24 24"
-      stroke="currentColor"
-      stroke-width="2"
-    >
-      <path
-        stroke-linecap="round"
-        stroke-linejoin="round"
-        d="m8.25 4.5 7.5 7.5-7.5 7.5"
-      />
-    </svg>
+    />
   </button>
 
   <!-- Expanded detail -->
diff --git a/packages/web/src/lib/components/viewer/entries/SystemMessage.svelte b/packages/web/src/lib/components/viewer/entries/SystemMessage.svelte
index 85a0af0..92f7631 100644
--- a/packages/web/src/lib/components/viewer/entries/SystemMessage.svelte
+++ b/packages/web/src/lib/components/viewer/entries/SystemMessage.svelte
@@ -1,4 +1,5 @@
 <script lang="ts">
+import ChevronIcon from 'virtual:icons/dinkie-icons/right-black-triangle';
 import type { SystemEntry } from '$lib/types/timeline';
 
 interface Props {
@@ -13,19 +14,9 @@ let expanded = $state(false);
   class="flex items-center gap-2 px-4 py-1.5 w-full text-left text-xs text-muted hover:text-foreground/70 transition-colors"
   onclick={() => (expanded = !expanded)}
 >
-  <svg
+  <ChevronIcon
     class="w-3 h-3 shrink-0 transition-transform {expanded ? 'rotate-90' : ''}"
-    fill="none"
-    viewBox="0 0 24 24"
-    stroke="currentColor"
-    stroke-width="2"
-  >
-    <path
-      stroke-linecap="round"
-      stroke-linejoin="round"
-      d="m8.25 4.5 7.5 7.5-7.5 7.5"
-    />
-  </svg>
+  />
   <span>// system</span>
 </button>
 
diff --git a/packages/web/src/lib/components/viewer/entries/ToolCallEntry.svelte b/packages/web/src/lib/components/viewer/entries/ToolCallEntry.svelte
index 2ebb621..c4192a6 100644
--- a/packages/web/src/lib/components/viewer/entries/ToolCallEntry.svelte
+++ b/packages/web/src/lib/components/viewer/entries/ToolCallEntry.svelte
@@ -1,4 +1,5 @@
 <script lang="ts">
+import ChevronIcon from 'virtual:icons/dinkie-icons/right-black-triangle';
 import type { ToolCallEntry as ToolCallType } from '$lib/types/timeline';
 
 interface Props {
@@ -69,19 +70,9 @@ const headerSummary = $derived.by((): string => {
     {#if headerSummary && !expanded}
       <span class="text-muted truncate flex-1 ml-1">// {headerSummary}</span>
     {/if}
-    <svg
+    <ChevronIcon
       class="w-3 h-3 text-muted ml-auto shrink-0 transition-transform {expanded ? 'rotate-90' : ''}"
-      fill="none"
-      viewBox="0 0 24 24"
-      stroke="currentColor"
-      stroke-width="2"
-    >
-      <path
-        stroke-linecap="round"
-        stroke-linejoin="round"
-        d="m8.25 4.5 7.5 7.5-7.5 7.5"
-      />
-    </svg>
+    />
   </button>
 
   <!-- Expanded detail: two-column layout -->
diff --git a/packages/web/src/lib/components/viewer/panel/FileList.svelte b/packages/web/src/lib/components/viewer/panel/FileList.svelte
index 6bfaef2..1ea2332 100644
--- a/packages/web/src/lib/components/viewer/panel/FileList.svelte
+++ b/packages/web/src/lib/components/viewer/panel/FileList.svelte
@@ -1,4 +1,6 @@
 <script lang="ts">
+import FileIcon from 'virtual:icons/dinkie-icons/page-facing-up';
+import PencilIcon from 'virtual:icons/dinkie-icons/pencil';
 import type { FileEntry } from '$lib/types/timeline';
 
 interface Props {
@@ -25,19 +27,7 @@ function basename(path: string): string {
         <div class="space-y-1">
           {#each readFiles as file}
             <div class="flex items-center gap-2 text-sm">
-              <svg
-                class="w-3.5 h-3.5 text-muted shrink-0"
-                fill="none"
-                viewBox="0 0 24 24"
-                stroke="currentColor"
-                stroke-width="1.5"
-              >
-                <path
-                  stroke-linecap="round"
-                  stroke-linejoin="round"
-                  d="M19.5 14.25v-2.625a3.375 3.375 0 0 0-3.375-3.375h-1.5A1.125 1.125 0 0 1 13.5 7.125v-1.5a3.375 3.375 0 0 0-3.375-3.375H8.25m2.25 0H5.625c-.621 0-1.125.504-1.125 1.125v17.25c0 .621.504 1.125 1.125 1.125h12.75c.621 0 1.125-.504 1.125-1.125V11.25a9 9 0 0 0-9-9Z"
-                />
-              </svg>
+              <FileIcon class="w-3.5 h-3.5 text-muted shrink-0" />
               <span class="text-foreground truncate" title={file.path}
                 >{basename(file.path)}</span
               >
@@ -53,19 +43,7 @@ function basename(path: string): string {
         <div class="space-y-1">
           {#each editedFiles as file}
             <div class="flex items-center gap-2 text-sm">
-              <svg
-                class="w-3.5 h-3.5 text-muted shrink-0"
-                fill="none"
-                viewBox="0 0 24 24"
-                stroke="currentColor"
-                stroke-width="1.5"
-              >
-                <path
-                  stroke-linecap="round"
-                  stroke-linejoin="round"
-                  d="m16.862 4.487 1.687-1.688a1.875 1.875 0 1 1 2.652 2.652L10.582 16.07a4.5 4.5 0 0 1-1.897 1.13L6 18l.8-2.685a4.5 4.5 0 0 1 1.13-1.897l8.932-8.931Zm0 0L19.5 7.125M18 14v4.75A2.25 2.25 0 0 1 15.75 21H5.25A2.25 2.25 0 0 1 3 18.75V8.25A2.25 2.25 0 0 1 5.25 6H10"
-                />
-              </svg>
+              <PencilIcon class="w-3.5 h-3.5 text-muted shrink-0" />
               <span class="text-foreground truncate" title={file.path}
                 >{basename(file.path)}</span
               >
diff --git a/packages/web/src/lib/components/viewer/panel/SessionActions.svelte b/packages/web/src/lib/components/viewer/panel/SessionActions.svelte
index 73c7293..61c09de 100644
--- a/packages/web/src/lib/components/viewer/panel/SessionActions.svelte
+++ b/packages/web/src/lib/components/viewer/panel/SessionActions.svelte
@@ -1,4 +1,6 @@
 <script lang="ts">
+import DeleteIcon from 'virtual:icons/dinkie-icons/diagonal-cross';
+import ShareIcon from 'virtual:icons/dinkie-icons/share';
 import type { SessionMeta } from '$lib/types';
 
 interface Props {
@@ -16,19 +18,7 @@ let { meta, onDelete, onShare }: Props = $props();
     onclick={onDelete}
     title="Delete session"
   >
-    <svg
-      class="w-3.5 h-3.5"
-      fill="none"
-      viewBox="0 0 24 24"
-      stroke="currentColor"
-      stroke-width="1.5"
-    >
-      <path
-        stroke-linecap="round"
-        stroke-linejoin="round"
-        d="m14.74 9-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 0 1-2.244 2.077H8.084a2.25 2.25 0 0 1-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 0 0-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 0 1 3.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 0 0-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 0 0-7.5 0"
-      />
-    </svg>
+    <DeleteIcon class="w-3.5 h-3.5" />
     delete
   </button>
   <button
@@ -36,19 +26,7 @@ let { meta, onDelete, onShare }: Props = $props();
     onclick={onShare}
     title="Share session"
   >
-    <svg
-      class="w-3.5 h-3.5"
-      fill="none"
-      viewBox="0 0 24 24"
-      stroke="currentColor"
-      stroke-width="1.5"
-    >
-      <path
-        stroke-linecap="round"
-        stroke-linejoin="round"
-        d="M7.217 10.907a2.25 2.25 0 1 0 0 2.186m0-2.186c.18.324.283.696.283 1.093s-.103.77-.283 1.093m0-2.186 9.566-5.314m-9.566 7.5 9.566 5.314m0 0a2.25 2.25 0 1 0 3.935 2.186 2.25 2.25 0 0 0-3.935-2.186Zm0-12.814a2.25 2.25 0 1 0 3.933-2.185 2.25 2.25 0 0 0-3.933 2.185Z"
-      />
-    </svg>
+    <ShareIcon class="w-3.5 h-3.5" />
     share
   </button>
 </div>
diff --git a/packages/web/src/lib/components/viewer/panel/SessionInfo.svelte b/packages/web/src/lib/components/viewer/panel/SessionInfo.svelte
index 50362bc..3501246 100644
--- a/packages/web/src/lib/components/viewer/panel/SessionInfo.svelte
+++ b/packages/web/src/lib/components/viewer/panel/SessionInfo.svelte
@@ -1,4 +1,5 @@
 <script lang="ts">
+import GithubIcon from 'virtual:icons/dinkie-icons/github';
 import type { SessionMeta } from '$lib/types';
 import type { ParsedSession } from '$lib/types/timeline';
 
@@ -84,11 +85,7 @@ const messageCount = $derived(
           rel="noopener noreferrer"
           class="text-accent hover:underline flex items-center gap-1"
         >
-          <svg class="w-3 h-3" viewBox="0 0 24 24" fill="currentColor">
-            <path
-              d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"
-            />
-          </svg>
+          <GithubIcon class="w-3 h-3" />
           {gistSource.owner ?? 'gist'}
         </a>
       {:else}
diff --git a/packages/web/vite.config.ts b/packages/web/vite.config.ts
index 256fea0..654d77d 100644
--- a/packages/web/vite.config.ts
+++ b/packages/web/vite.config.ts
@@ -1,9 +1,10 @@
 import { sveltekit } from '@sveltejs/kit/vite';
 import tailwindcss from '@tailwindcss/vite';
+import Icons from 'unplugin-icons/vite';
 import { defineConfig } from 'vite';
 
 export default defineConfig({
-  plugins: [tailwindcss(), sveltekit()],
+  plugins: [tailwindcss(), sveltekit(), Icons({ compiler: 'svelte' })],
   ssr: {
     noExternal: true,
   },
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 323dc96..cac8125 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -61,6 +61,9 @@ importers:
         specifier: ^1.345.2
         version: 1.345.2
     devDependencies:
+      '@iconify-json/dinkie-icons':
+        specifier: ^1.2.0
+        version: 1.2.0
       '@sveltejs/adapter-cloudflare':
         specifier: ^7.2.6
         version: 7.2.6(@sveltejs/kit@2.50.2(@opentelemetry/api@1.9.0)(@sveltejs/vite-plugin-svelte@6.2.4(svelte@5.49.2)(vite@7.3.1(@types/node@25.2.2)(jiti@2.6.1)(lightningcss@1.30.2)(tsx@4.21.0)))(svelte@5.49.2)(typescript@5.9.3)(vite@7.3.1(@types/node@25.2.2)(jiti@2.6.1)(lightningcss@1.30.2)(tsx@4.21.0)))(wrangler@4.63.0(@cloudflare/workers-types@4.20260207.0))
@@ -91,12 +94,18 @@ importers:
       typescript:
         specifier: ^5.9.3
         version: 5.9.3
+      unplugin-icons:
+        specifier: ^23.0.1
+        version: 23.0.1(svelte@5.49.2)
       vite:
         specifier: ^7.3.1
         version: 7.3.1(@types/node@25.2.2)(jiti@2.6.1)(lightningcss@1.30.2)(tsx@4.21.0)
 
 packages:
 
+  '@antfu/install-pkg@1.1.0':
+    resolution: {integrity: sha512-MGQsmw10ZyI+EJo45CdSER4zEb+p31LpDAFp2Z3gkSd1yqVZGi0Ebx++YTEMonJy4oChEMLsxZ64j8FH6sSqtQ==}
+
   '@biomejs/biome@2.3.14':
     resolution: {integrity: sha512-QMT6QviX0WqXJCaiqVMiBUCr5WRQ1iFSjvOLoTk6auKukJMvnMzWucXpwZB0e8F00/1/BsS9DzcKgWH+CLqVuA==}
     engines: {node: '>=14.21.3'}
@@ -521,6 +530,15 @@ packages:
     cpu: [x64]
     os: [win32]
 
+  '@iconify-json/dinkie-icons@1.2.0':
+    resolution: {integrity: sha512-/RSAjK6twyEOKfW9FddZDP+EPMeSIocb4Y4Zq2Y2IbqUxYmNHqXtxidVioBzpv+a3JeiQ61ARlRKtCQ0BqSGpA==}
+
+  '@iconify/types@2.0.0':
+    resolution: {integrity: sha512-+wluvCrRhXrhyOmRDJ3q8mux9JkKy5SJ/v8ol2tu4FVjyYvtEzkc/3pK15ET6RKg4b4w4BmTk1+gsCUhf21Ykg==}
+
+  '@iconify/utils@3.1.0':
+    resolution: {integrity: sha512-Zlzem1ZXhI1iHeeERabLNzBHdOa4VhQbqAcOQaMKuTuyZCpwKbC2R4Dd0Zo3g9EAc+Y4fiarO8HIHRAth7+skw==}
+
   '@img/colour@1.0.0':
     resolution: {integrity: sha512-A5P/LfWGFSl6nsckYtjw9da+19jB8hkJ6ACTGcDfEJ0aE+l2n2El7dsVM7UVHZQ9s2lmYMWlrS21YLy2IR1LUw==}
     engines: {node: '>=18'}
@@ -1167,6 +1185,9 @@ packages:
   confbox@0.1.8:
     resolution: {integrity: sha512-RMtmw0iFkeR4YV+fUOSucriAQNb9g8zFR52MWCtl+cCZOFRNL6zeB395vPzFhEjjn4fMxXudmELnl/KF/WrK6w==}
 
+  confbox@0.2.4:
+    resolution: {integrity: sha512-ysOGlgTFbN2/Y6Cg3Iye8YKulHw+R2fNXHrgSmXISQdMnomY6eNDprVdW9R5xBguEqI954+S6709UyiO7B+6OQ==}
+
   consola@3.4.2:
     resolution: {integrity: sha512-5IKcdX0nnYavi6G7TtOhwkYzyjfJlatbjMjuLSfE2kYT5pMDOilZ4OvMhi637CcDICTmz3wARPoyhqyX1Y+XvA==}
     engines: {node: ^14.18.0 || >=16.10.0}
@@ -1235,6 +1256,9 @@ packages:
   estree-walker@2.0.2:
     resolution: {integrity: sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==}
 
+  exsolve@1.0.8:
+    resolution: {integrity: sha512-LmDxfWXwcTArk8fUEnOfSZpHOJ6zOMUJKOtFLFqJLoKJetuQG874Uc7/Kki7zFLzYybmZhp1M7+98pfMqeX8yA==}
+
   fdir@6.5.0:
     resolution: {integrity: sha512-tIbYtZbucOs0BRGqPJkshJUYdL+SDH7dVM8gjy+ERp3WAUjLEFJE+02kanyHtwjWOnwrKYBiwAmM0p4kLJAnXg==}
     engines: {node: '>=12.0.0'}
@@ -1431,6 +1455,10 @@ packages:
     resolution: {integrity: sha512-IXO6OCs9yg8tMKzfPZ1YmheJbZCiEsnBdcB03l0OcfK9prKnJb96siuHCr5Fl37/yo9DnKU+TLpxzTUspw9shg==}
     engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
 
+  local-pkg@1.1.2:
+    resolution: {integrity: sha512-arhlxbFRmoQHl33a0Zkle/YWlmNwoyt6QNZEIJcqNbdrsix5Lvc4HyyI3EnwxTYlZYc32EbYrQ8SzEZ7dqgg9A==}
+    engines: {node: '>=14'}
+
   locate-character@3.0.0:
     resolution: {integrity: sha512-SW13ws7BjaeJ6p7Q6CO2nchbYEc3X3J6WrmTTDto7yMPqVSZTUyY5Tjbid+Ab8gLnATtygYtiDIJGQRRn2ZOiA==}
 
@@ -1479,6 +1507,9 @@ packages:
   obug@2.1.1:
     resolution: {integrity: sha512-uTqF9MuPraAQ+IsnPf366RG4cP9RtUi7MLO1N3KEc+wb0a6yKpeL0lmk2IB1jY5KHPAlTc6T/JRdC/YqxHNwkQ==}
 
+  package-manager-detector@1.6.0:
+    resolution: {integrity: sha512-61A5ThoTiDG/C8s8UMZwSorAGwMJ0ERVGj2OjoW5pAalsNOg15+iQiPzrLJ4jhZ1HJzmC2PIHT2oEiH3R5fzNA==}
+
   path-key@3.1.1:
     resolution: {integrity: sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==}
     engines: {node: '>=8'}
@@ -1506,6 +1537,9 @@ packages:
   pkg-types@1.3.1:
     resolution: {integrity: sha512-/Jm5M4RvtBFVkKWRu2BLUTNP8/M2a+UwuAX+ae4770q1qVGtfjG+WTCupoZixokjmHiry8uI+dlY8KXYV5HVVQ==}
 
+  pkg-types@2.3.0:
+    resolution: {integrity: sha512-SIqCzDRg0s9npO5XQ3tNZioRY1uK06lA41ynBC1YmFTmnY6FjUjVt6s4LoADmwoig1qqD0oK8h1p/8mlMx8Oig==}
+
   postcss-load-config@6.0.1:
     resolution: {integrity: sha512-oPtTM4oerL+UXmx+93ytZVN82RrlY/wPUV8IeDxFrzIjXOLF1pN+EmKPLbubvKHT2HC20xXsCAH2Z+CKV6Oz/g==}
     engines: {node: '>= 18'}
@@ -1538,6 +1572,9 @@ packages:
     resolution: {integrity: sha512-CvexbZtbov6jW2eXAvLukXjXUW1TzFaivC46BpWc/3BpcCysb5Vffu+B3XHMm8lVEuy2Mm4XGex8hBSg1yapPg==}
     engines: {node: '>=12.0.0'}
 
+  quansync@0.2.11:
+    resolution: {integrity: sha512-AifT7QEbW9Nri4tAwR5M/uzpBuqfZf+zwaEM/QkzEjj7NBuFD2rBuy0K3dE+8wltbezDV7JMA0WfnCPYRSYbXA==}
+
   query-selector-shadow-dom@1.0.1:
     resolution: {integrity: sha512-lT5yCqEBgfoMYpf3F2xQRK7zEr1rhIIZuceDK6+xRkJQ4NMbHTwXqk4NkwDwQMNqXgG9r9fyHnzwNVs6zV5KRw==}
 
@@ -1647,6 +1684,10 @@ packages:
   tinyexec@0.3.2:
     resolution: {integrity: sha512-KQQR9yN7R5+OSwaK0XQoj22pwHoTlgYqmUscPYoknOoWCWfj/5/ABTMRi69FrKU5ffPVh5QcFikpWJI/P1ocHA==}
 
+  tinyexec@1.0.2:
+    resolution: {integrity: sha512-W/KYk+NFhkmsYpuHq5JykngiOCnxeVL8v8dFnqxSD8qEEdRfXk1SDM6JzNqcERbcGYj9tMrDQBYV9cjgnunFIg==}
+    engines: {node: '>=18'}
+
   tinyglobby@0.2.15:
     resolution: {integrity: sha512-j2Zq4NyQYG5XMST4cbs02Ak8iJUdxRM0XI5QyxXuZOzKOINmWurp3smXu3y5wDcJrptwpSjgXHzIQxR0omXljQ==}
     engines: {node: '>=12.0.0'}
@@ -1707,6 +1748,27 @@ packages:
   unenv@2.0.0-rc.24:
     resolution: {integrity: sha512-i7qRCmY42zmCwnYlh9H2SvLEypEFGye5iRmEMKjcGi7zk9UquigRjFtTLz0TYqr0ZGLZhaMHl/foy1bZR+Cwlw==}
 
+  unplugin-icons@23.0.1:
+    resolution: {integrity: sha512-rv0XEJepajKzDLvRUWASM8K+8+/CCfZn2jtogXqg6RIp7kpatRc/aFrVJn8ANQA09e++lPEEv9yX8cC9enc+QQ==}
+    peerDependencies:
+      '@svgr/core': '>=7.0.0'
+      '@svgx/core': ^1.0.1
+      '@vue/compiler-sfc': ^3.0.2
+      svelte: ^3.0.0 || ^4.0.0 || ^5.0.0
+    peerDependenciesMeta:
+      '@svgr/core':
+        optional: true
+      '@svgx/core':
+        optional: true
+      '@vue/compiler-sfc':
+        optional: true
+      svelte:
+        optional: true
+
+  unplugin@2.3.11:
+    resolution: {integrity: sha512-5uKD0nqiYVzlmCRs01Fhs2BdkEgBS3SAVP6ndrBsuK42iC2+JHyxM05Rm9G8+5mkmRtzMZGY8Ct5+mliZxU/Ww==}
+    engines: {node: '>=18.12.0'}
+
   vite@7.3.1:
     resolution: {integrity: sha512-w+N7Hifpc3gRjZ63vYBXA56dvvRlNWRczTdmCBBa+CotUzAPf5b7YMdMR/8CQoeYE5LX3W4wj6RYTgonm1b9DA==}
     engines: {node: ^20.19.0 || >=22.12.0}
@@ -1758,6 +1820,9 @@ packages:
   web-vitals@5.1.0:
     resolution: {integrity: sha512-ArI3kx5jI0atlTtmV0fWU3fjpLmq/nD3Zr1iFFlJLaqa5wLBkUSzINwBPySCX/8jRyjlmy1Volw1kz1g9XE4Jg==}
 
+  webpack-virtual-modules@0.6.2:
+    resolution: {integrity: sha512-66/V2i5hQanC51vBQKPH4aI8NMAcBW59FVBs+rC7eGHupMyfn34q7rZIE+ETlJ+XTevqfUhVVBgSUNSW2flEUQ==}
+
   which@2.0.2:
     resolution: {integrity: sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==}
     engines: {node: '>= 8'}
@@ -1805,6 +1870,11 @@ packages:
 
 snapshots:
 
+  '@antfu/install-pkg@1.1.0':
+    dependencies:
+      package-manager-detector: 1.6.0
+      tinyexec: 1.0.2
+
   '@biomejs/biome@2.3.14':
     optionalDependencies:
       '@biomejs/cli-darwin-arm64': 2.3.14
@@ -2041,6 +2111,18 @@ snapshots:
   '@esbuild/win32-x64@0.27.2':
     optional: true
 
+  '@iconify-json/dinkie-icons@1.2.0':
+    dependencies:
+      '@iconify/types': 2.0.0
+
+  '@iconify/types@2.0.0': {}
+
+  '@iconify/utils@3.1.0':
+    dependencies:
+      '@antfu/install-pkg': 1.1.0
+      '@iconify/types': 2.0.0
+      mlly: 1.8.0
+
   '@img/colour@1.0.0': {}
 
   '@img/sharp-darwin-arm64@0.34.5':
@@ -2565,6 +2647,8 @@ snapshots:
 
   confbox@0.1.8: {}
 
+  confbox@0.2.4: {}
+
   consola@3.4.2: {}
 
   cookie@0.6.0: {}
@@ -2666,6 +2750,8 @@ snapshots:
 
   estree-walker@2.0.2: {}
 
+  exsolve@1.0.8: {}
+
   fdir@6.5.0(picomatch@4.0.3):
     optionalDependencies:
       picomatch: 4.0.3
@@ -2813,6 +2899,12 @@ snapshots:
 
   load-tsconfig@0.2.5: {}
 
+  local-pkg@1.1.2:
+    dependencies:
+      mlly: 1.8.0
+      pkg-types: 2.3.0
+      quansync: 0.2.11
+
   locate-character@3.0.0: {}
 
   long@5.3.2: {}
@@ -2860,6 +2952,8 @@ snapshots:
 
   obug@2.1.1: {}
 
+  package-manager-detector@1.6.0: {}
+
   path-key@3.1.1: {}
 
   path-parse@1.0.7: {}
@@ -2880,6 +2974,12 @@ snapshots:
       mlly: 1.8.0
       pathe: 2.0.3
 
+  pkg-types@2.3.0:
+    dependencies:
+      confbox: 0.2.4
+      exsolve: 1.0.8
+      pathe: 2.0.3
+
   postcss-load-config@6.0.1(jiti@2.6.1)(postcss@8.5.6)(tsx@4.21.0):
     dependencies:
       lilconfig: 3.1.3
@@ -2927,6 +3027,8 @@ snapshots:
       '@types/node': 25.2.2
       long: 5.3.2
 
+  quansync@0.2.11: {}
+
   query-selector-shadow-dom@1.0.1: {}
 
   readdirp@4.1.2: {}
@@ -3089,6 +3191,8 @@ snapshots:
 
   tinyexec@0.3.2: {}
 
+  tinyexec@1.0.2: {}
+
   tinyglobby@0.2.15:
     dependencies:
       fdir: 6.5.0(picomatch@4.0.3)
@@ -3150,6 +3254,23 @@ snapshots:
     dependencies:
       pathe: 2.0.3
 
+  unplugin-icons@23.0.1(svelte@5.49.2):
+    dependencies:
+      '@antfu/install-pkg': 1.1.0
+      '@iconify/utils': 3.1.0
+      local-pkg: 1.1.2
+      obug: 2.1.1
+      unplugin: 2.3.11
+    optionalDependencies:
+      svelte: 5.49.2
+
+  unplugin@2.3.11:
+    dependencies:
+      '@jridgewell/remapping': 2.3.5
+      acorn: 8.15.0
+      picomatch: 4.0.3
+      webpack-virtual-modules: 0.6.2
+
   vite@7.3.1(@types/node@25.2.2)(jiti@2.6.1)(lightningcss@1.30.2)(tsx@4.21.0):
     dependencies:
       esbuild: 0.27.2
@@ -3171,6 +3292,8 @@ snapshots:
 
   web-vitals@5.1.0: {}
 
+  webpack-virtual-modules@0.6.2: {}
+
   which@2.0.2:
     dependencies:
       isexe: 2.0.0