diff --git a/favicon/128.png b/favicon/128.png
deleted file mode 100644
index f39b12f..0000000
Binary files a/favicon/128.png and /dev/null differ
diff --git a/favicon/32.png b/favicon/32.png
index ed70152..ff96f8b 100644
Binary files a/favicon/32.png and b/favicon/32.png differ
diff --git a/favicon/64.png b/favicon/64.png
index 8ca6c82..7e501cd 100644
Binary files a/favicon/64.png and b/favicon/64.png differ
diff --git a/favicon/supercardinality.svg b/favicon/supercardinality.svg
new file mode 100644
index 0000000..7cc7377
--- /dev/null
+++ b/favicon/supercardinality.svg
@@ -0,0 +1,40 @@
+<?xml version="1.0" encoding="UTF-8"?>
+
+<svg viewBox="0 0 100 100" version="1.1" id="svg1" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg">
+  <defs>
+    <linearGradient id="gold-light" x1="0" y1="0" x2="1" y2="1">
+      <stop offset="0%" stop-color="#f7e3a1"/>
+      <stop offset="100%" stop-color="#dcae44"/>
+    </linearGradient>
+    <linearGradient id="gold-dark" x1="0" y1="0" x2="1" y2="1">
+      <stop offset="0%" stop-color="#a87c26"/>
+      <stop offset="100%" stop-color="#6b4713"/>
+    </linearGradient>
+    <filter id="glow-blur"><feGaussianBlur stdDeviation="5"/></filter>
+    <mask id="uc-mask">
+      <rect width="100" height="100" fill="white"></rect>
+    </mask>
+    <g id="rose-large-arm">
+      <path d="M 50 1 L 60 40 L 50 50 Z" fill="url(#gold-light)"/>
+      <path d="M 50 1 L 40 40 L 50 50 Z" fill="url(#gold-dark)"/>
+      <path d="M 50 1 L 60 40 L 50 50 L 40 40 Z" fill="none" stroke="black" stroke-width="0.5" />
+    </g>
+    <g id="rose-small-arm">
+      <path d="M 50 80 L 55 60 L 50 50 Z" fill="url(#gold-dark)"/>
+      <path d="M 50 80 L 45 60 L 50 50 Z" fill="url(#gold-dark)"/>
+      <path d="M 50 80 L 45 60 L 50 50 L 55 60 Z" fill="none" stroke="black" stroke-width="0.5" />
+    </g>
+    <g id="compass-rose">
+      <use href="#rose-small-arm"/>
+      <use href="#rose-small-arm" transform="rotate(120 50 50)"/>
+      <use href="#rose-small-arm" transform="rotate(240 50 50)"/>
+      <use href="#rose-large-arm"/>
+      <use href="#rose-large-arm" transform="rotate(120 50 50)"/>
+      <use href="#rose-large-arm" transform="rotate(240 50 50)"/>
+    </g>
+  </defs>
+  <circle cx="50" cy="50" r="40" fill="url(#gold-light)" opacity="0.15" filter="url(#glow-blur)"></circle>
+  <g mask="url(#uc-mask)"><use href="#compass-rose"></use></g>
+  <circle cx="50" cy="50" r="10" fill="url(#gold-light)" stroke="black" stroke-width="0.5"></circle>
+  <path d="M 55 45 A 5 3.9 0 1 0 50 50 A 5 3.9 0 1 1 45 55" stroke="url(#gold-dark)" fill="none" stroke-width="2" />
+</svg>
diff --git a/styles.css b/styles.css
index affd3a4..b80390d 100644
--- a/styles.css
+++ b/styles.css
@@ -203,8 +203,9 @@ footer {
 }
 
 .divider-gem {
-  width: 0.8rem;
-  height: 0.8rem;
-  background: linear-gradient(135deg, var(--gold), var(--gold-dark));
-  transform: rotate(45deg);
+  width: 3rem;
+  height: 3rem;
+  background-image: url("favicon/64.png");
+  background-position: center;
+  background-size: contain;
 }