diff --git a/frontend/src/assets/folder.svg b/frontend/src/assets/folder.svg
index 435c981..feed8f6 100644
--- a/frontend/src/assets/folder.svg
+++ b/frontend/src/assets/folder.svg
@@ -1,14 +1,11 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <svg viewBox="0 0 128 128" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-    <linearGradient id="a" gradientTransform="matrix(0.45451 0 0 0.455522 -1210.292114 616.172607)" gradientUnits="userSpaceOnUse" x1="2689.251953" x2="2918.069824" y1="-1106.802979" y2="-1106.802979">
-        <stop offset="0" stop-color="#62a0ea"/>
-        <stop offset="0.0576991" stop-color="#afd4ff"/>
-        <stop offset="0.122204" stop-color="#62a0ea"/>
-        <stop offset="0.873306" stop-color="#62a0ea"/>
-        <stop offset="0.955997" stop-color="#c0d5ea"/>
-        <stop offset="1" stop-color="#62a0ea"/>
+    <linearGradient id="folderGradient" gradientTransform="matrix(0.45451 0 0 0.455522 -1210.292114 616.172607)" gradientUnits="userSpaceOnUse" x1="2689.251953" x2="2918.069824" y1="-1106.802979" y2="-1106.802979">
+        <stop offset="0" stop-color="var(--folder-icon-back, #62a0ea)"/>
+        <stop offset="0.5" stop-color="var(--folder-icon-mid, #afd4ff)"/>
+        <stop offset="1" stop-color="var(--folder-icon-front, #62a0ea)"/>
     </linearGradient>
-    <path d="m 21.976562 12 c -5.527343 0 -9.976562 4.460938 -9.976562 10 v 86.03125 c 0 5.542969 4.449219 10 9.976562 10 h 84.042969 c 5.53125 0 9.980469 -4.457031 9.980469 -10 v -72.085938 c 0 -6.628906 -5.359375 -12 -11.972656 -12 h -46.027344 c -2.453125 0 -4.695312 -1.386718 -5.796875 -3.582031 l -1.503906 -2.992187 c -1.65625 -3.292969 -5.019531 -5.371094 -8.699219 -5.371094 z m 0 0" fill="#438de6"/>
-    <path d="m 65.976562 36 c -2.746093 0 -5.226562 1.101562 -7.027343 2.890625 c -2.273438 2.253906 -5.382813 5.109375 -8.632813 5.109375 h -28.339844 c -5.527343 0 -9.976562 4.460938 -9.976562 10 v 54.03125 c 0 5.542969 4.449219 10 9.976562 10 h 84.042969 c 5.53125 0 9.980469 -4.457031 9.980469 -10 v -62.03125 c 0 -5.539062 -4.449219 -10 -9.980469 -10 z m 0 0" fill="url(#a)"/>
-    <path d="m 65.976562 32 c -2.746093 0 -5.226562 1.101562 -7.027343 2.890625 c -2.273438 2.253906 -5.382813 5.109375 -8.632813 5.109375 h -28.339844 c -5.527343 0 -9.976562 4.460938 -9.976562 10 v 55.976562 c 0 5.539063 4.449219 10 9.976562 10 h 84.042969 c 5.53125 0 9.980469 -4.460937 9.980469 -10 v -63.976562 c 0 -5.539062 -4.449219 -10 -9.980469 -10 z m 0 0" fill="#a4caee"/>
+    <path d="m 21.976562 12 c -5.527343 0 -9.976562 4.460938 -9.976562 10 v 86.03125 c 0 5.542969 4.449219 10 9.976562 10 h 84.042969 c 5.53125 0 9.980469 -4.457031 9.980469 -10 v -72.085938 c 0 -6.628906 -5.359375 -12 -11.972656 -12 h -46.027344 c -2.453125 0 -4.695312 -1.386718 -5.796875 -3.582031 l -1.503906 -2.992187 c -1.65625 -3.292969 -5.019531 -5.371094 -8.699219 -5.371094 z m 0 0" fill="var(--folder-icon-back, #438de6)"/>
+    <path d="m 65.976562 36 c -2.746093 0 -5.226562 1.101562 -7.027343 2.890625 c -2.273438 2.253906 -5.382813 5.109375 -8.632813 5.109375 h -28.339844 c -5.527343 0 -9.976562 4.460938 -9.976562 10 v 54.03125 c 0 5.542969 4.449219 10 9.976562 10 h 84.042969 c 5.53125 0 9.980469 -4.457031 9.980469 -10 v -62.03125 c 0 -5.539062 -4.449219 -10 -9.980469 -10 z m 0 0" fill="url(#folderGradient)"/>
+    <path d="m 65.976562 32 c -2.746093 0 -5.226562 1.101562 -7.027343 2.890625 c -2.273438 2.253906 -5.382813 5.109375 -8.632813 5.109375 h -28.339844 c -5.527343 0 -9.976562 4.460938 -9.976562 10 v 55.976562 c 0 5.539063 4.449219 10 9.976562 10 h 84.042969 c 5.53125 0 9.980469 -4.460937 9.980469 -10 v -63.976562 c 0 -5.539062 -4.449219 -10 -9.980469 -10 z m 0 0" fill="var(--folder-icon-front, #a4caee)"/>
 </svg>
diff --git a/frontend/src/styles.css b/frontend/src/styles.css
index 4bff9a8..57eb6a1 100644
--- a/frontend/src/styles.css
+++ b/frontend/src/styles.css
@@ -1,11 +1,11 @@
 :root {
   color-scheme: light dark;
 
-  --neutral-hue: 200deg;
-  --foreground-hue-offset: 70deg;
+  --neutral-hue: 260deg;
+  --foreground-hue-offset: 10deg;
   --accent-hue-offset: -20deg;
-  --dark-hue-offset: 60deg;
-  --dark-foreground-hue-offset: 70deg;
+  --dark-hue-offset: 30deg;
+  --dark-foreground-hue-offset: 10deg;
 
   /* --- Neutrals --- */
   --bg: oklch(0.97 0.001 var(--neutral-hue));
@@ -21,6 +21,14 @@
   --accent-hover: oklch(0.70 0.02 calc(var(--neutral-hue) + var(--foreground-hue-offset) + var(--accent-hue-offset)));
   --on-accent: oklch(1 0 0);
 
+  --folder-icon-back: color-mix(in oklch, var(--accent) 78%, black 8%);
+  --folder-icon-mid: color-mix(in oklch, var(--accent) 60%, white 30%);
+  --folder-icon-front: color-mix(in oklch, var(--accent) 42%, white 58%);
+
+  --success-hue: 140deg;
+  --warning-hue: 85deg;
+  --danger-hue: 25deg;
+
   --accent-soft: color-mix(in oklch, var(--accent) 12%, transparent);
   --accent-elevated: color-mix(in oklch, var(--accent) 16%, transparent);
   --accent-elevated-strong: color-mix(in oklch, var(--accent) 22%, transparent);
@@ -55,9 +63,9 @@
   --overlay-shadow: color-mix(in oklch, oklch(0.22 0.015 calc(var(--neutral-hue) + var(--foreground-hue-offset) - 5deg)) 18%, transparent);
 
   /* --- Semantic colors --- */
-  --success: oklch(0.62 0.18 calc(var(--neutral-hue) + 90deg));
-  --warning: oklch(0.72 0.17 calc(var(--neutral-hue) - 5deg));
-  --danger: oklch(0.60 0.18 calc(var(--neutral-hue) - 65deg));
+  --success: oklch(0.68 0.16 var(--success-hue));
+  --warning: oklch(0.76 0.17 var(--warning-hue));
+  --danger: oklch(0.64 0.2 var(--danger-hue));
 
   --success-subtle: color-mix(in oklch, var(--success) 12%, transparent);
   --warning-subtle: color-mix(in oklch, var(--warning) 12%, transparent);
@@ -107,6 +115,10 @@
     --accent-hover: oklch(0.82 0.16 calc(var(--dark-foreground-hue) + var(--accent-hue-offset)));
     --on-accent: oklch(0.15 0.015 var(--dark-foreground-hue));
 
+    --folder-icon-back: color-mix(in oklch, var(--accent) 72%, black 12%);
+    --folder-icon-mid: color-mix(in oklch, var(--accent) 50%, white 24%);
+    --folder-icon-front: color-mix(in oklch, var(--accent) 30%, white 50%);
+
     --accent-soft: color-mix(in oklch, var(--accent) 22%, transparent);
     --accent-elevated: color-mix(in oklch, var(--accent) 28%, transparent);
     --accent-elevated-strong: color-mix(in oklch, var(--accent) 38%, transparent);
@@ -136,9 +148,9 @@
     --overlay-backdrop: color-mix(in oklch, oklch(0.1 0.015 var(--dark-neutral-hue)) 70%, transparent);
     --overlay-shadow: color-mix(in oklch, oklch(0.12 0.015 var(--dark-neutral-hue)) 55%, transparent);
 
-    --success: oklch(0.72 0.16 180deg);
-    --warning: oklch(0.79 0.16 80deg);
-    --danger: oklch(0.7 0.16 25deg);
+    --success: oklch(0.62 0.16 var(--success-hue));
+    --warning: oklch(0.68 0.17 var(--warning-hue));
+    --danger: oklch(0.60 0.2 var(--danger-hue));
 
     --success-subtle: color-mix(in oklch, var(--success) 20%, transparent);
     --warning-subtle: color-mix(in oklch, var(--warning) 20%, transparent);
@@ -1101,6 +1113,7 @@ button.danger:hover:not([disabled]) {
   list-style: none;
   margin: 0;
   padding: 0;
+  overflow: hidden;
 }
 
 .folder-node {