From bc7fe43e1291463c12aa714435b860988ec201d2 Mon Sep 17 00:00:00 2001
From: dalfuss <webstuff@dalfuss.net>
Date: Tue, 17 Mar 2026 10:12:00 +0100
Subject: [PATCH 1/4] switched to svg sprites & cleaned up code

---
 assets/css/style.css |   4 +
 index.html           | 286 ++++++++++++++++++++++++++-----------------
 2 files changed, 178 insertions(+), 112 deletions(-)

diff --git a/assets/css/style.css b/assets/css/style.css
index e02ca8f..d0924e7 100644
--- a/assets/css/style.css
+++ b/assets/css/style.css
@@ -953,6 +953,10 @@ hr {
     text-wrap: balance;
 }
 
+svg {
+    fill: currentColor;
+}
+
 /*-----------------------parallax-----------------------*/
 /* credits: https://www.youtube.com/watch?v=aywzn9cf-_U */
 #stars1 {
diff --git a/index.html b/index.html
index 039872d..b8910b4 100644
--- a/index.html
+++ b/index.html
@@ -12,8 +12,7 @@
     <link rel="me" href="https://vt.social/@JaxOffTV">
     </link>
     <title>JaxOff Links</title>
-    <link href="https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100..900;1,100..900&display=swap"
-        rel="stylesheet">
+    <link href="https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">
     <script src="https://kit.fontawesome.com/14a35c233c.js" crossorigin="anonymous"></script>
 
 
@@ -48,9 +47,7 @@
             <h1 class="page-text-color page-text-font mt-16 text-center">JaxOff 🌸💦</h1>
             <p class="description">
                 Elftwink VTuber :3 <br>
-                <img class="flag" src="./assets/images/pansexual.svg" /> <img class="flag"
-                    src="./assets/images/enby.svg" /> <img class="flag" src="./assets/images/trans.svg" /> <img
-                    class="flag" src="./assets/images/prog.svg" />
+                <img class="flag" src="./assets/images/pansexual.svg" /> <img class="flag" src="./assets/images/enby.svg" /> <img class="flag" src="./assets/images/trans.svg" /> <img class="flag" src="./assets/images/prog.svg" />
             </p>
 
             <a id="merch">
@@ -59,29 +56,11 @@
                 </h1>
                 <div class="page-item-wrap relative">
                     <div class="page-item flex-both-center absolute"></div>
-                    <a target="_blank" class="page-item-each py-10 flex-both-center daki" href="https://11tw.ink/daki"
-                        data-id="261685" data-type="page_item">
-                        <?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools --><svg
-                            class="link-each-image" width="800px" height="800px" viewBox="0 0 128 128"
-                            xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
-                            aria-hidden="true" role="img" class="iconify iconify--noto"
-                            preserveAspectRatio="xMidYMid meet">
-                            <path
-                                d="M20.03 25.81L9.22 32.96S7.67 36 9.77 46.29s11.58 30.65 30.67 49.97c16.47 16.66 35.7 24.78 52.61 25.65s25.04-10.06 25.04-10.06L20.03 25.81z"
-                                fill="#8e2f97"></path>
-                            <path
-                                d="M29.28 20.58l-9.25 15.96s5.82 21.19 15.63 34.38c10.64 14.3 22.81 26.72 41.88 36.41c16.27 8.27 31.49 11.41 31.49 11.41s9.93-3.97 13.89-14.98c3.77-10.48-1.22-21.97-8.37-27.55s-21.46-9.03-34.5-15.96c-13.83-7.35-24.08-15.94-33.14-25.7c-5.67-6.1-6.98-8.7-7.17-9.8c-.09-.52-.42-.96-.92-1.12l-9.54-3.05z"
-                                fill="#a057a1"></path>
-                            <path
-                                d="M22.71 38.01l-.81 5.74s1.47 1.95 3.23 1.8c1.76-.15 4.47-4.68 5.15-7.77c1-4.52.46-7.04.46-7.04s3.52 1.84 8.8 1.07c5.28-.77 7.96-3.75 8.65-5.28c.69-1.53.54-3.22-.23-3.6c-.77-.38-4.52 1.3-4.52 1.3l-11.94-.46l-11.33 3.29l2.54 10.95z"
-                                fill="#bdcf46"></path>
-                            <path
-                                d="M3 46.41s-1.59.6-1.11 2.36c.34 1.22 3.26 3.15 7.15 1.2s6.37-7.12 7.34-9.57c1.6-4.06 2.3-6.85 2.3-6.85l-5.4-3.2l-4.8 11.55S6.32 45.55 3 46.41z"
-                                fill="#bdcf46"></path>
-                            <path
-                                d="M11.01 20.2s-3.24-5.33-3.6-8.51c-.3-2.7.96-4.37 1.61-5.2c1-1.28 3.09-2.11 4.46-1.38c1.7.9 1.68 2.62 2.79 4.85s3.02 5.59 3.02 5.59s3.84-1.22 9.41.71s8.03 4.44 11.45 5.41c3.42.97 7.6-.31 7.82 1.27S42.69 27.78 37.93 28s-7.73-2.45-9.37-1.41c-1.64 1.04-.36 7.38-1.83 11.91c-1.17 3.6-4.06 5.41-4.81 5.31c-.13-.02-3.48-5.17-4.14-6.58c-.67-1.41-1.93-4.98-3.79-2.23c-1.86 2.75-1.47 6.91-5.13 10.11c-2.71 2.37-5.38 2.16-5.98 1.51c-.19-.21 2.38-2 2.38-4.16s-.62-10.37.5-14.39c1.48-5.35 5.25-7.87 5.25-7.87z"
-                                fill="#6f9823"></path>
+                    <a target="_blank" class="page-item-each py-10 flex-both-center daki" href="https://11tw.ink/daki" data-id="261685" data-type="page_item">
+                        <svg class="link-each-image">
+                            <use href="#eggplant"></use>
                         </svg>
+
                         <span class="item-title text-center">[18+] JAXOFF DAKIMAKURA OMG</span>
                     </a>
                 </div>
@@ -96,117 +75,109 @@
             <div class="page-item-wrap relative">
                 <div class="page-item flex-both-center absolute"></div>
                 <a target="_blank" class="page-item-each py-10 flex-both-center twitch" href="https://jaxoff.tv">
-                    <svg class="link-each-image" fill="currentColor" xmlns="http://www.w3.org/2000/svg"
-                        viewBox="0 0 512 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.-->
-                        <path
-                            d="M391.2 103.5H352.5v109.7h38.6zM285 103H246.4V212.8H285zM120.8 0 24.3 91.4V420.6H140.1V512l96.5-91.4h77.3L487.7 256V0zM449.1 237.8l-77.2 73.1H294.6l-67.6 64v-64H140.1V36.6H449.1z" />
+                    <svg class="link-each-image">
+                        <use href="#svg-twitch"></use>
                     </svg>
+
                     <span class="item-title text-center">Twitch</span>
                 </a>
             </div>
+
             <div class="page-item-wrap relative">
                 <div class="page-item flex-both-center absolute"></div>
-                <a target="_blank" class="page-item-each py-10 flex-both-center discord"
-                    href="https://11tw.ink/discord">
-                    <svg class="link-each-image" fill="currentColor" xmlns="http://www.w3.org/2000/svg"
-                        viewBox="0 0 640 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.-->
-                        <path
-                            d="M524.5 69.8a1.5 1.5 0 0 0 -.8-.7A485.1 485.1 0 0 0 404.1 32a1.8 1.8 0 0 0 -1.9 .9 337.5 337.5 0 0 0 -14.9 30.6 447.8 447.8 0 0 0 -134.4 0 309.5 309.5 0 0 0 -15.1-30.6 1.9 1.9 0 0 0 -1.9-.9A483.7 483.7 0 0 0 116.1 69.1a1.7 1.7 0 0 0 -.8 .7C39.1 183.7 18.2 294.7 28.4 404.4a2 2 0 0 0 .8 1.4A487.7 487.7 0 0 0 176 479.9a1.9 1.9 0 0 0 2.1-.7A348.2 348.2 0 0 0 208.1 430.4a1.9 1.9 0 0 0 -1-2.6 321.2 321.2 0 0 1 -45.9-21.9 1.9 1.9 0 0 1 -.2-3.1c3.1-2.3 6.2-4.7 9.1-7.1a1.8 1.8 0 0 1 1.9-.3c96.2 43.9 200.4 43.9 295.5 0a1.8 1.8 0 0 1 1.9 .2c2.9 2.4 6 4.9 9.1 7.2a1.9 1.9 0 0 1 -.2 3.1 301.4 301.4 0 0 1 -45.9 21.8 1.9 1.9 0 0 0 -1 2.6 391.1 391.1 0 0 0 30 48.8 1.9 1.9 0 0 0 2.1 .7A486 486 0 0 0 610.7 405.7a1.9 1.9 0 0 0 .8-1.4C623.7 277.6 590.9 167.5 524.5 69.8zM222.5 337.6c-29 0-52.8-26.6-52.8-59.2S193.1 219.1 222.5 219.1c29.7 0 53.3 26.8 52.8 59.2C275.3 311 251.9 337.6 222.5 337.6zm195.4 0c-29 0-52.8-26.6-52.8-59.2S388.4 219.1 417.9 219.1c29.7 0 53.3 26.8 52.8 59.2C470.7 311 447.5 337.6 417.9 337.6z" />
+                <a target="_blank" class="page-item-each py-10 flex-both-center discord" href="https://11tw.ink/discord">
+                    <svg class="link-each-image">
+                        <use href="#svg-discord"></use>
                     </svg>
+
                     <span class="item-title text-center">Discord Server</span>
                 </a>
             </div>
+
             <div class="page-item-wrap relative">
                 <div class="page-item flex-both-center absolute"></div>
                 <a target="_blank" class="page-item-each py-10 flex-both-center mastodon" href="https://11tw.ink/fedi">
-                    <svg class="link-each-image" viewBox="0 0 74 79" fill="currentColor"
-                        xmlns="http://www.w3.org/2000/svg">
-                        <path
-                            d="M73.7014 17.9592C72.5616 9.62034 65.1774 3.04876 56.424 1.77536C54.9472 1.56019 49.3517 0.7771 36.3901 0.7771H36.2933C23.3281 0.7771 20.5465 1.56019 19.0697 1.77536C10.56 3.01348 2.78877 8.91838 0.903306 17.356C-0.00357857 21.5113 -0.100361 26.1181 0.068112 30.3439C0.308275 36.404 0.354874 42.4535 0.91406 48.489C1.30064 52.498 1.97502 56.4751 2.93215 60.3905C4.72441 67.6217 11.9795 73.6395 19.0876 76.0945C26.6979 78.6548 34.8821 79.0799 42.724 77.3221C43.5866 77.1245 44.4398 76.8953 45.2833 76.6342C47.1867 76.0381 49.4199 75.3714 51.0616 74.2003C51.0841 74.1839 51.1026 74.1627 51.1156 74.1382C51.1286 74.1138 51.1359 74.0868 51.1368 74.0592V68.2108C51.1364 68.185 51.1302 68.1596 51.1185 68.1365C51.1069 68.1134 51.0902 68.0932 51.0695 68.0773C51.0489 68.0614 51.0249 68.0503 50.9994 68.0447C50.9738 68.0391 50.9473 68.0392 50.9218 68.045C45.8976 69.226 40.7491 69.818 35.5836 69.8087C26.694 69.8087 24.3031 65.6569 23.6184 63.9285C23.0681 62.4347 22.7186 60.8764 22.5789 59.2934C22.5775 59.2669 22.5825 59.2403 22.5934 59.216C22.6043 59.1916 22.621 59.1702 22.6419 59.1533C22.6629 59.1365 22.6876 59.1248 22.714 59.1191C22.7404 59.1134 22.7678 59.1139 22.794 59.1206C27.7345 60.2936 32.799 60.8856 37.8813 60.8843C39.1036 60.8843 40.3223 60.8843 41.5447 60.8526C46.6562 60.7115 52.0437 60.454 57.0728 59.4874C57.1983 59.4628 57.3237 59.4416 57.4313 59.4098C65.3638 57.9107 72.9128 53.2051 73.6799 41.2895C73.7086 40.8204 73.7803 36.3758 73.7803 35.889C73.7839 34.2347 74.3216 24.1533 73.7014 17.9592ZM61.4925 47.6918H53.1514V27.5855C53.1514 23.3526 51.3591 21.1938 47.7136 21.1938C43.7061 21.1938 41.6988 23.7476 41.6988 28.7919V39.7974H33.4078V28.7919C33.4078 23.7476 31.3969 21.1938 27.3894 21.1938C23.7654 21.1938 21.9552 23.3526 21.9516 27.5855V47.6918H13.6176V26.9752C13.6176 22.7423 14.7157 19.3795 16.9118 16.8868C19.1772 14.4 22.1488 13.1231 25.8373 13.1231C30.1064 13.1231 33.3325 14.7386 35.4832 17.9662L37.5587 21.3949L39.6377 17.9662C41.7884 14.7386 45.0145 13.1231 49.2765 13.1231C52.9614 13.1231 55.9329 14.4 58.2055 16.8868C60.4017 19.3772 61.4997 22.74 61.4997 26.9752L61.4925 47.6918Z"
-                            fill="inherit" />
+                    <svg class="link-each-image">
+                        <use href="#svg-mastodon"></use>
                     </svg>
+
                     <span class="item-title text-center">Fedi / Mastodon</span>
                 </a>
             </div>
+
             <div class="page-item-wrap relative">
                 <div class="page-item flex-both-center absolute"></div>
                 <a target="_blank" class="page-item-each py-10 flex-both-center bluesky" href="https://11tw.ink/bsky">
-                    <svg class="link-each-image" fill="currentColor" xmlns="http://www.w3.org/2000/svg"
-                        viewBox="0 0 640 640"><!--!Font Awesome Free v7.1.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2026 Fonticons, Inc.-->
-                        <path
-                            d="M439.8 358.7C436.5 358.3 433.1 357.9 429.8 357.4C433.2 357.8 436.5 358.3 439.8 358.7zM320 291.1C293.9 240.4 222.9 145.9 156.9 99.3C93.6 54.6 69.5 62.3 53.6 69.5C35.3 77.8 32 105.9 32 122.4C32 138.9 41.1 258 47 277.9C66.5 343.6 136.1 365.8 200.2 358.6C203.5 358.1 206.8 357.7 210.2 357.2C206.9 357.7 203.6 358.2 200.2 358.6C106.3 372.6 22.9 406.8 132.3 528.5C252.6 653.1 297.1 501.8 320 425.1C342.9 501.8 369.2 647.6 505.6 528.5C608 425.1 533.7 372.5 439.8 358.6C436.5 358.2 433.1 357.8 429.8 357.3C433.2 357.7 436.5 358.2 439.8 358.6C503.9 365.7 573.4 343.5 593 277.9C598.9 258 608 139 608 122.4C608 105.8 604.7 77.7 586.4 69.5C570.6 62.4 546.4 54.6 483.2 99.3C417.1 145.9 346.1 240.4 320 291.1z" />
+                    <svg class="link-each-image">
+                        <use href="#svg-bsky"></use>
                     </svg>
+
                     <span class="item-title text-center">Bluesky</span>
                 </a>
             </div>
+
             <div class="page-item-wrap relative">
                 <div class="page-item flex-both-center absolute"></div>
-                <a target="_blank" class="page-item-each py-10 flex-both-center anilist"
-                    href="https://11tw.ink/anilist">
-                    <svg class="link-each-image" fill="currentColor" width="800px" height="800px" viewBox="0 0 24 24"
-                        role="img" xmlns="http://www.w3.org/2000/svg">
-                        <path
-                            d="M6.361 2.943 0 21.056h4.942l1.077-3.133H11.4l1.052 3.133H22.9c.71 0 1.1-.392 1.1-1.101V17.53c0-.71-.39-1.101-1.1-1.101h-6.483V4.045c0-.71-.392-1.102-1.101-1.102h-2.422c-.71 0-1.101.392-1.101 1.102v1.064l-.758-2.166zm2.324 5.948 1.688 5.018H7.144z" />
+                <a target="_blank" class="page-item-each py-10 flex-both-center anilist" href="https://11tw.ink/anilist">
+                    <svg class="link-each-image">
+                        <use href="#svg-anilist"></use>
                     </svg>
+
                     <span class="item-title text-center">Anilist</span>
                 </a>
             </div>
+
             <div class="page-item-wrap relative">
                 <div class="page-item flex-both-center absolute"></div>
-                <a target="_blank" class="page-item-each py-10 flex-both-center instagram"
-                    href="https://11tw.ink/insta">
-                    <svg class="link-each-image" fill="currentColor" xmlns="http://www.w3.org/2000/svg"
-                        viewBox="0 0 448 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.-->
-                        <path
-                            d="M224.1 141c-63.6 0-114.9 51.3-114.9 114.9s51.3 114.9 114.9 114.9S339 319.5 339 255.9 287.7 141 224.1 141zm0 189.6c-41.1 0-74.7-33.5-74.7-74.7s33.5-74.7 74.7-74.7 74.7 33.5 74.7 74.7-33.6 74.7-74.7 74.7zm146.4-194.3c0 14.9-12 26.8-26.8 26.8-14.9 0-26.8-12-26.8-26.8s12-26.8 26.8-26.8 26.8 12 26.8 26.8zm76.1 27.2c-1.7-35.9-9.9-67.7-36.2-93.9-26.2-26.2-58-34.4-93.9-36.2-37-2.1-147.9-2.1-184.9 0-35.8 1.7-67.6 9.9-93.9 36.1s-34.4 58-36.2 93.9c-2.1 37-2.1 147.9 0 184.9 1.7 35.9 9.9 67.7 36.2 93.9s58 34.4 93.9 36.2c37 2.1 147.9 2.1 184.9 0 35.9-1.7 67.7-9.9 93.9-36.2 26.2-26.2 34.4-58 36.2-93.9 2.1-37 2.1-147.8 0-184.8zM398.8 388c-7.8 19.6-22.9 34.7-42.6 42.6-29.5 11.7-99.5 9-132.1 9s-102.7 2.6-132.1-9c-19.6-7.8-34.7-22.9-42.6-42.6-11.7-29.5-9-99.5-9-132.1s-2.6-102.7 9-132.1c7.8-19.6 22.9-34.7 42.6-42.6 29.5-11.7 99.5-9 132.1-9s102.7-2.6 132.1 9c19.6 7.8 34.7 22.9 42.6 42.6 11.7 29.5 9 99.5 9 132.1s2.7 102.7-9 132.1z" />
+                <a target="_blank" class="page-item-each py-10 flex-both-center instagram" href="https://11tw.ink/insta">
+                    <svg class="link-each-image">
+                        <use href="#svg-instagram"></use>
                     </svg>
+
                     <span class="item-title text-center">Instagram</span>
                 </a>
             </div>
+
             <div class="page-item-wrap relative">
                 <div class="page-item flex-both-center absolute"></div>
-                <a target="_blank" class="page-item-each py-10 flex-both-center youtube"
-                    href="https://11tw.ink/youtube">
-                    <svg class="link-each-image" fill="currentColor" xmlns="http://www.w3.org/2000/svg"
-                        viewBox="0 0 576 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.-->
-                        <path
-                            d="M549.7 124.1c-6.3-23.7-24.8-42.3-48.3-48.6C458.8 64 288 64 288 64S117.2 64 74.6 75.5c-23.5 6.3-42 24.9-48.3 48.6-11.4 42.9-11.4 132.3-11.4 132.3s0 89.4 11.4 132.3c6.3 23.7 24.8 41.5 48.3 47.8C117.2 448 288 448 288 448s170.8 0 213.4-11.5c23.5-6.3 42-24.2 48.3-47.8 11.4-42.9 11.4-132.3 11.4-132.3s0-89.4-11.4-132.3zm-317.5 213.5V175.2l142.7 81.2-142.7 81.2z" />
+                <a target="_blank" class="page-item-each py-10 flex-both-center youtube" href="https://11tw.ink/youtube">
+                    <svg class="link-each-image">
+                        <use href="#svg-youtube"></use>
                     </svg>
+
                     <span class=" item-title text-center">YouTube</span>
                 </a>
             </div>
+
             <div class="page-item-wrap relative">
                 <div class="page-item flex-both-center absolute"></div>
                 <a target="_blank" class="page-item-each py-10 flex-both-center tiktok" href="https://11tw.ink/tiktok">
-                    <svg class="link-each-image" fill="currentColor" xmlns="http://www.w3.org/2000/svg"
-                        viewBox="0 0 448 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.-->
-                        <path
-                            d="M448 209.9a210.1 210.1 0 0 1 -122.8-39.3V349.4A162.6 162.6 0 1 1 185 188.3V278.2a74.6 74.6 0 1 0 52.2 71.2V0l88 0a121.2 121.2 0 0 0 1.9 22.2h0A122.2 122.2 0 0 0 381 102.4a121.4 121.4 0 0 0 67 20.1z" />
+                    <svg class="link-each-image">
+                        <use href="#svg-tiktok"></use>
                     </svg>
+
                     <span class="item-title text-center">TikTok</span>
                 </a>
             </div>
+
             <div class="page-item-wrap relative">
                 <div class="page-item flex-both-center absolute"></div>
-                <a target="_blank" class="page-item-each py-10 flex-both-center throne"
-                    href="https://11tw.ink/wishlist">
-                    <svg class="link-each-image" viewBox="0 0 597 503" fill="currentColor"
-                        xmlns="http://www.w3.org/2000/svg">
-                        <path
-                            d="M422.563 264.121C420.516 268.265 417.821 272.01 414.583 275.296L314.398 377.979C309.788 382.703 305.509 389.303 298.908 389.303V389.303V389.303C292.075 389.303 287.716 382.349 282.943 377.459L183.191 275.275C182.669 274.773 182.105 274.166 181.582 273.559C170.385 260.982 168.233 242.818 176.13 227.333L289.152 5.471C291.345 2.05999 294.938 0.134766 298.908 0.134766C302.877 0.134766 306.45 2.03907 308.539 5.24081L365.185 116.454L421.832 227.667C427.786 239.323 428.058 252.967 422.563 264.121ZM302.334 456.435L20.1346 169.011L19.2363 168.09C17.1472 166.416 14.7447 165.558 12.1541 165.558C8.37283 165.704 5.05112 167.358 3.00377 170.078C1.08177 172.631 0.517709 175.937 1.39514 179.453L83.5188 462.566C85.4825 469.325 88.658 475.603 93.0243 481.17C93.5466 481.881 94.1315 482.572 94.6956 483.241C104.452 494.563 119.159 500.778 134.41 500.778C140.322 500.778 146.318 499.857 152.126 497.89C194.41 483.869 238.678 476.001 283.803 474.557C287.627 474.264 291.429 474.034 295.21 473.845C298.344 473.678 301.248 472.171 303.128 469.723C304.987 467.337 305.698 464.324 305.133 461.415C304.778 459.678 303.838 458.004 302.355 456.456L302.334 456.435ZM591.845 167.315C591.845 167.324 591.835 167.33 591.828 167.324C588.258 164.889 583.711 165.039 578.955 167.881V167.881C578.179 168.353 577.464 168.921 576.827 169.57L335.133 416.172C331.101 420.274 331.08 426.719 335.092 430.821L377.375 474.138C382.389 479.286 388.824 482.802 396.031 484.33C415.21 488.368 434.242 493.684 452.626 500.108C456.888 501.594 461.338 502.326 465.808 502.326C471.344 502.326 476.881 501.196 482.166 498.936C491.275 495.211 499.151 489.331 504.938 481.902C509.262 476.357 512.479 470.079 514.464 463.257L596.609 180.018C596.943 178.7 597.068 177.381 596.964 176.251C596.964 172.658 595.049 169.316 591.863 167.306C591.855 167.301 591.845 167.306 591.845 167.315V167.315Z" />
+                <a target="_blank" class="page-item-each py-10 flex-both-center throne" href="https://11tw.ink/wishlist">
+                    <svg class="link-each-image">
+                        <use href="#svg-throne"></use>
                     </svg>
+
                     <span class="item-title text-center">Wishlist</span>
                 </a>
             </div>
+
             <div class="page-item-wrap relative">
                 <div class="page-item flex-both-center absolute"></div>
-                <a target="_blank" class="page-item-each py-10 flex-both-center spotify"
-                    href="https://11tw.ink/playlist">
-                    <svg class="link-each-image" viewBox="0 0 168 168" fill="currentColor"
-                        xmlns="http://www.w3.org/2000/svg">
-                        <path
-                            d="m83.996 0.277c-46.249 0-83.743 37.493-83.743 83.742 0 46.251 37.494 83.741 83.743 83.741 46.254 0 83.744-37.49 83.744-83.741 0-46.246-37.49-83.738-83.745-83.738l0.001-0.004zm38.404 120.78c-1.5 2.46-4.72 3.24-7.18 1.73-19.662-12.01-44.414-14.73-73.564-8.07-2.809 0.64-5.609-1.12-6.249-3.93-0.643-2.81 1.11-5.61 3.926-6.25 31.9-7.291 59.263-4.15 81.337 9.34 2.46 1.51 3.24 4.72 1.73 7.18zm10.25-22.805c-1.89 3.075-5.91 4.045-8.98 2.155-22.51-13.839-56.823-17.846-83.448-9.764-3.453 1.043-7.1-0.903-8.148-4.35-1.04-3.453 0.907-7.093 4.354-8.143 30.413-9.228 68.222-4.758 94.072 11.127 3.07 1.89 4.04 5.91 2.15 8.976v-0.001zm0.88-23.744c-26.99-16.031-71.52-17.505-97.289-9.684-4.138 1.255-8.514-1.081-9.768-5.219-1.254-4.14 1.08-8.513 5.221-9.771 29.581-8.98 78.756-7.245 109.83 11.202 3.73 2.209 4.95 7.016 2.74 10.733-2.2 3.722-7.02 4.949-10.73 2.739z" />
+                <a target="_blank" class="page-item-each py-10 flex-both-center spotify" href="https://11tw.ink/playlist">
+                    <svg class="link-each-image">
+                        <use href="#svg-spotify">
                     </svg>
+
                     <span class="item-title text-center">Spotify Stream Playlist</span>
                 </a>
             </div>
@@ -221,52 +192,57 @@
             <div class="page-item-wrap relative">
                 <div class="page-item flex-both-center absolute"></div>
                 <a target="_blank" class="page-item-each py-10 flex-both-center references" href="https://11tw.ink/ref">
-                    <svg class="link-each-image" fill="currentColor" xmlns="http://www.w3.org/2000/svg"
-                        viewBox="0 0 640 640"><!--!Font Awesome Free v7.2.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2026 Fonticons, Inc.-->
-                        <path
-                            d="M512.5 74.3 291.1 222c-29.1 19.4-47.6 50.9-50.6 85.3 62.3 12.8 111.4 61.9 124.3 124.3 34.5-3 65.9-21.5 85.3-50.6l147.6-221.5c6.7-10.1 10.3-21.9 10.3-34.1 0-33.9-27.5-61.4-61.4-61.4-12.1 0-24 3.6-34.1 10.3M320 464c0-61.9-50.1-112-112-112S96 402.1 96 464c0 3.9.2 7.8.6 11.6 1.8 17.5-10.2 36.4-27.8 36.4H64c-17.7 0-32 14.3-32 32s14.3 32 32 32h144c61.9 0 112-50.1 112-112" />
-                    </svg> <span class="item-title text-center">Design Reference</span>
+                    <svg class="link-each-image">
+                        <use href="#svg-paintbrush"></use>
+                    </svg>
+
+                    <span class="item-title text-center">Design Reference</span>
                 </a>
             </div>
+
             <div class="page-item-wrap relative">
                 <div class="page-item flex-both-center absolute"></div>
                 <a target="_blank" class="page-item-each py-10 flex-both-center credit" href="https://credit.11tw.ink">
-                    <svg class="link-each-image" fill="currentcolor" xmlns="http://www.w3.org/2000/svg"
-                        viewBox="0 0 640 640"><!--!Font Awesome Free v7.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.-->
-                        <path
-                            d="M128 160C128 124.7 156.7 96 192 96L512 96C547.3 96 576 124.7 576 160L576 416C576 451.3 547.3 480 512 480L192 480C156.7 480 128 451.3 128 416L128 160zM56 192C69.3 192 80 202.7 80 216L80 512C80 520.8 87.2 528 96 528L456 528C469.3 528 480 538.7 480 552C480 565.3 469.3 576 456 576L96 576C60.7 576 32 547.3 32 512L32 216C32 202.7 42.7 192 56 192zM224 224C241.7 224 256 209.7 256 192C256 174.3 241.7 160 224 160C206.3 160 192 174.3 192 192C192 209.7 206.3 224 224 224zM420.5 235.5C416.1 228.4 408.4 224 400 224C391.6 224 383.9 228.4 379.5 235.5L323.2 327.6L298.7 297C294.1 291.3 287.3 288 280 288C272.7 288 265.8 291.3 261.3 297L197.3 377C191.5 384.2 190.4 394.1 194.4 402.4C198.4 410.7 206.8 416 216 416L488 416C496.7 416 504.7 411.3 508.9 403.7C513.1 396.1 513 386.9 508.4 379.4L420.4 235.4z" />
+                    <svg class="link-each-image">
+                        <use href="#svg-images"></use>
                     </svg>
+
                     <span class="item-title text-center">Artist Credit</span>
                 </a>
             </div>
+
             <div class="page-item-wrap relative">
                 <div class="page-item flex-both-center absolute"></div>
                 <a target="_blank" class="page-item-each py-10 flex-both-center colours" href="https://c.11tw.ink">
-                    <svg class="link-each-image" fill="currentcolor" xmlns="http://www.w3.org/2000/svg"
-                        viewBox="0 0 640 640"><!--!Font Awesome Free v7.2.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2026 Fonticons, Inc.-->
-                        <path
-                            d="M576 320v2.7c-.4 36.5-33.6 61.3-70.1 61.3H408c-26.5 0-48 21.5-48 48 0 3.4.4 6.7 1 9.9 2.1 10.2 6.5 20 10.8 29.9 6.1 13.8 12.1 27.5 12.1 42 0 31.8-21.6 60.7-53.4 62-3.5.1-7 .2-10.6.2-141.4 0-256-114.6-256-256S178.6 64 320 64s256 114.6 256 256m-384 32c0-17.7-14.3-32-32-32s-32 14.3-32 32 14.3 32 32 32 32-14.3 32-32m0-96c17.7 0 32-14.3 32-32s-14.3-32-32-32-32 14.3-32 32 14.3 32 32 32m160-96c0-17.7-14.3-32-32-32s-32 14.3-32 32 14.3 32 32 32 32-14.3 32-32m96 96c17.7 0 32-14.3 32-32s-14.3-32-32-32-32 14.3-32 32 14.3 32 32 32" />
+                    <svg class="link-each-image">
+                        <use href="#svg-palette"></use>
                     </svg>
+
                     <span class="item-title text-center">Colours</span>
                 </a>
             </div>
+
+
             <br>
+
+
             <hr>
+
+
             <a id="Events">
                 <h1 class="separator" title="Events">
                     Events
                 </h1>
-                <p>
-                    <div class="row">
-                        <div class="column ConYes">Safe</div>
-                        <div class="column ConProb">Wahrscheinlich</div>
-                        <div class="column ConProbNo">Wahrscheinlich nicht</div>
-                    </div>
-                </p>
-
-
             </a>
 
+            <p>
+            <div class="row">
+                <div class="column ConYes">Safe</div>
+                <div class="column ConProb">Wahrscheinlich</div>
+                <div class="column ConProbNo">Wahrscheinlich nicht</div>
+            </div>
+            </p>
+
             <a id="Events/Feb2026">
                 <h2 class="separator" title="Events">
                     Februar 2026
@@ -275,8 +251,7 @@
 
             <div class="page-item-wrap relative">
                 <div class="page-item flex-both-center absolute"></div>
-                <a target="_blank" class="page-item-each py-10 flex-both-center ConYes"
-                    href="https://www.dedeco-online.de">
+                <a target="_blank" class="page-item-each py-10 flex-both-center ConYes" href="https://www.dedeco-online.de">
                     <span class="item-title text-center">DeDeCo // Dresden // 13.02.-15.02.2026</span>
                 </a>
             </div>
@@ -289,8 +264,7 @@
 
             <div class="page-item-wrap relative">
                 <div class="page-item flex-both-center absolute"></div>
-                <a target="_blank" class="page-item-each py-10 flex-both-center ConYes"
-                    href="https://www.nonki-con.de/">
+                <a target="_blank" class="page-item-each py-10 flex-both-center ConYes" href="https://www.nonki-con.de/">
                     <span class="item-title text-center">NonkiCon // Speyer // 16.-17.05.2026</span>
                 </a>
             </div>
@@ -315,8 +289,7 @@
             </div>
             <div class="page-item-wrap relative">
                 <div class="page-item flex-both-center absolute"></div>
-                <a target="_blank" class="page-item-each py-10 flex-both-center ConProb"
-                    href="https://www.wiemaikai.de/">
+                <a target="_blank" class="page-item-each py-10 flex-both-center ConProb" href="https://www.wiemaikai.de/">
                     <span class="item-title text-center">Wie.MAI.KAI // Flörsheim am Main // 13.-14.06.2026</span>
                 </a>
             </div>
@@ -348,8 +321,7 @@
 
             <div class="page-item-wrap relative">
                 <div class="page-item flex-both-center absolute"></div>
-                <a target="_blank" class="page-item-each py-10 flex-both-center ConProb"
-                    href="https://www.main-matsuri.com/">
+                <a target="_blank" class="page-item-each py-10 flex-both-center ConProb" href="https://www.main-matsuri.com/">
                     <span class="item-title text-center">Main Matsuri // Offenbach // 14.-16.08.2026</span>
                 </a>
             </div>
@@ -362,8 +334,7 @@
 
             <div class="page-item-wrap relative">
                 <div class="page-item flex-both-center absolute"></div>
-                <a target="_blank" class="page-item-each py-10 flex-both-center ConProb"
-                    href="https://www.connichi.de/">
+                <a target="_blank" class="page-item-each py-10 flex-both-center ConProb" href="https://www.connichi.de/">
                     <span class="item-title text-center">Connichi // Wiesbaden // 4.-6.09.2026</span>
                 </a>
             </div>
@@ -377,6 +348,97 @@
             <script>document.write(new Date().getFullYear())</script>
         </p>
     </footer>
+
+
+    <!-- SVG Dump -->
+    <svg style="display: none;">
+
+        <!-- Eggplant -->
+
+        <symbol id="eggplant" viewBox="0 0 128 128">
+            <path d="M20.03 25.81L9.22 32.96S7.67 36 9.77 46.29s11.58 30.65 30.67 49.97c16.47 16.66 35.7 24.78 52.61 25.65s25.04-10.06 25.04-10.06L20.03 25.81z" fill="#8e2f97"></path>
+            <path d="M29.28 20.58l-9.25 15.96s5.82 21.19 15.63 34.38c10.64 14.3 22.81 26.72 41.88 36.41c16.27 8.27 31.49 11.41 31.49 11.41s9.93-3.97 13.89-14.98c3.77-10.48-1.22-21.97-8.37-27.55s-21.46-9.03-34.5-15.96c-13.83-7.35-24.08-15.94-33.14-25.7c-5.67-6.1-6.98-8.7-7.17-9.8c-.09-.52-.42-.96-.92-1.12l-9.54-3.05z" fill="#a057a1"></path>
+            <path d="M22.71 38.01l-.81 5.74s1.47 1.95 3.23 1.8c1.76-.15 4.47-4.68 5.15-7.77c1-4.52.46-7.04.46-7.04s3.52 1.84 8.8 1.07c5.28-.77 7.96-3.75 8.65-5.28c.69-1.53.54-3.22-.23-3.6c-.77-.38-4.52 1.3-4.52 1.3l-11.94-.46l-11.33 3.29l2.54 10.95z" fill="#bdcf46"></path>
+            <path d="M3 46.41s-1.59.6-1.11 2.36c.34 1.22 3.26 3.15 7.15 1.2s6.37-7.12 7.34-9.57c1.6-4.06 2.3-6.85 2.3-6.85l-5.4-3.2l-4.8 11.55S6.32 45.55 3 46.41z" fill="#bdcf46"></path>
+            <path d="M11.01 20.2s-3.24-5.33-3.6-8.51c-.3-2.7.96-4.37 1.61-5.2c1-1.28 3.09-2.11 4.46-1.38c1.7.9 1.68 2.62 2.79 4.85s3.02 5.59 3.02 5.59s3.84-1.22 9.41.71s8.03 4.44 11.45 5.41c3.42.97 7.6-.31 7.82 1.27S42.69 27.78 37.93 28s-7.73-2.45-9.37-1.41c-1.64 1.04-.36 7.38-1.83 11.91c-1.17 3.6-4.06 5.41-4.81 5.31c-.13-.02-3.48-5.17-4.14-6.58c-.67-1.41-1.93-4.98-3.79-2.23c-1.86 2.75-1.47 6.91-5.13 10.11c-2.71 2.37-5.38 2.16-5.98 1.51c-.19-.21 2.38-2 2.38-4.16s-.62-10.37.5-14.39c1.48-5.35 5.25-7.87 5.25-7.87z" fill="#6f9823"></path>
+        </symbol>
+
+        <!-- Twitch -->
+        <symbol id="svg-twitch" viewBox="0 0 32 32">
+            <path d="m26.711 14.929-4.284 4.284h-4.285l-3.749 3.749v-3.749h-4.82V3.146h17.138zM8.502 1.004 3.146 6.36v19.279h6.427v5.356l5.356-5.356h4.284l9.641-9.64V1.003zm12.854 5.891h2.142v6.427h-2.142zm-5.892 0h2.143v6.427h-2.144z" />
+        </symbol>
+
+        <!-- Discord -->
+        <symbol id="svg-discord" viewBox="0 0 126.644 96">
+            <path d="M81.15 0a74 74 0 0 0-3.36 6.794 97.9 97.9 0 0 0-28.994 0A68 68 0 0 0 45.437 0a105.6 105.6 0 0 0-26.14 8.057C2.779 32.53-1.691 56.373.53 79.887a105 105 0 0 0 32.05 16.088 77 77 0 0 0 6.87-11.063c-3.738-1.389-7.35-3.131-10.81-5.152.91-.657 1.794-1.338 2.653-1.995a75.26 75.26 0 0 0 64.075 0c.86.707 1.743 1.389 2.652 1.995a69 69 0 0 1-10.835 5.178A77 77 0 0 0 94.056 96a105 105 0 0 0 32.051-16.063c2.626-27.277-4.496-50.917-18.817-71.855A104 104 0 0 0 81.175.05zM42.28 65.414c-6.238 0-11.416-5.657-11.416-12.653s4.976-12.679 11.391-12.679 11.517 5.708 11.416 12.679c-.101 6.97-5.026 12.653-11.39 12.653m42.078 0c-6.264 0-11.391-5.657-11.391-12.653s4.975-12.679 11.39-12.679S95.85 45.79 95.749 52.761c-.1 6.97-5.026 12.653-11.39 12.653" />
+        </symbol>
+
+        <!-- Mastodon -->
+        <symbol id="svg-mastodon" viewBox="0 0 74 79">
+            <path fill="inherit" d="M73.701 17.432c-1.14-8.38-8.524-14.985-17.277-16.265C54.947.951 49.352.164 36.39.164h-.097C23.328.164 20.547.95 19.07 1.167 10.56 2.411 2.789 8.346.903 16.826-.004 21.002-.1 25.632.068 29.879c.24 6.09.287 12.17.846 18.237a85 85 0 0 0 2.018 11.96c1.792 7.268 9.048 13.316 16.156 15.784 7.61 2.573 15.794 3 23.636 1.234a35 35 0 0 0 2.56-.692c1.903-.599 4.136-1.269 5.778-2.446a.18.18 0 0 0 .075-.142v-5.877a.17.17 0 0 0-.138-.167.2.2 0 0 0-.077 0 66.2 66.2 0 0 1-15.338 1.773c-8.89 0-11.28-4.173-11.966-5.91-.55-1.502-.9-3.068-1.04-4.659a.17.17 0 0 1 .136-.175.2.2 0 0 1 .08.002 65 65 0 0 0 15.087 1.772c1.223 0 2.441 0 3.664-.032 5.111-.141 10.499-.4 15.528-1.372.125-.024.25-.046.358-.078 7.933-1.506 15.482-6.236 16.249-18.211.029-.472.1-4.939.1-5.428.004-1.662.542-11.794-.079-18.02M61.493 47.314H53.15V27.107c0-4.254-1.792-6.424-5.437-6.424-4.008 0-6.015 2.567-6.015 7.636V39.38h-8.291V28.32c0-5.07-2.011-7.637-6.019-7.637-3.624 0-5.434 2.17-5.437 6.424v20.207h-8.334v-20.82q0-6.381 3.294-10.14c2.265-2.499 5.237-3.782 8.925-3.782 4.27 0 7.496 1.624 9.646 4.867l2.076 3.446 2.079-3.446c2.15-3.244 5.377-4.867 9.639-4.867 3.684 0 6.656 1.283 8.929 3.783Q61.5 20.108 61.5 26.494z" />
+        </symbol>
+
+        <!-- Bluesky -->
+        <symbol id="svg-bsky" viewBox="0 0 600 530">
+            <path d="M135.72 44.03C202.216 93.951 273.74 195.17 300 249.49c26.262-54.316 97.782-155.54 164.28-205.46C512.26 8.009 590-19.862 590 68.825c0 17.712-10.155 148.79-16.111 170.07-20.703 73.984-96.144 92.854-163.25 81.433 117.3 19.964 147.14 86.092 82.697 152.22-122.39 125.59-175.91-31.511-189.63-71.766-2.514-7.38-3.69-10.832-3.708-7.896-.017-2.936-1.193.516-3.707 7.896-13.714 40.255-67.233 197.36-189.63 71.766-64.444-66.128-34.605-132.26 82.697-152.22-67.108 11.421-142.55-7.45-163.25-81.433C20.15 217.613 9.997 86.535 9.997 68.825c0-88.687 77.742-60.816 125.72-24.795z" />
+        </symbol>
+
+        <!-- Anilist -->
+        <symbol id="svg-anilist" viewBox="0 0 24 24">
+            <path d="M6.361 2.943 0 21.056h4.942l1.077-3.133H11.4l1.052 3.133H22.9c.71 0 1.1-.392 1.1-1.101V17.53c0-.71-.39-1.101-1.1-1.101h-6.483V4.045c0-.71-.392-1.102-1.101-1.102h-2.422c-.71 0-1.101.392-1.101 1.102v1.064l-.758-2.166zm2.324 5.948 1.688 5.018H7.144z" />
+        </symbol>
+
+
+        <!-- Instagram -->
+        <symbol id="svg-instagram" viewBox="0 0 512 512">
+            <path d="M256 49.471c67.266 0 75.233.257 101.8 1.469 24.562 1.121 37.9 5.224 46.778 8.674a78.05 78.05 0 0 1 28.966 18.845 78.05 78.05 0 0 1 18.845 28.966c3.45 8.877 7.554 22.216 8.674 46.778 1.212 26.565 1.469 34.532 1.469 101.8s-.257 75.233-1.469 101.8c-1.121 24.562-5.225 37.9-8.674 46.778a83.43 83.43 0 0 1-47.811 47.811c-8.877 3.45-22.216 7.554-46.778 8.674-26.56 1.212-34.527 1.469-101.8 1.469s-75.237-.257-101.8-1.469c-24.562-1.121-37.9-5.225-46.778-8.674a78.05 78.05 0 0 1-28.966-18.845 78.05 78.05 0 0 1-18.845-28.966c-3.45-8.877-7.554-22.216-8.674-46.778-1.212-26.564-1.469-34.532-1.469-101.8s.257-75.233 1.469-101.8c1.121-24.562 5.224-37.9 8.674-46.778a78.05 78.05 0 0 1 18.847-28.967 78.05 78.05 0 0 1 28.966-18.845c8.877-3.45 22.216-7.554 46.778-8.674 26.565-1.212 34.532-1.469 101.8-1.469m0-45.391c-68.418 0-77 .29-103.866 1.516-26.815 1.224-45.127 5.482-61.151 11.71a123.5 123.5 0 0 0-44.62 29.057A123.5 123.5 0 0 0 17.3 90.982c-6.223 16.025-10.481 34.337-11.7 61.152C4.369 179 4.079 187.582 4.079 256s.29 77 1.521 103.866c1.224 26.815 5.482 45.127 11.71 61.151a123.5 123.5 0 0 0 29.057 44.62 123.5 123.5 0 0 0 44.62 29.057c16.025 6.228 34.337 10.486 61.151 11.71 26.87 1.226 35.449 1.516 103.866 1.516s77-.29 103.866-1.516c26.815-1.224 45.127-5.482 61.151-11.71a128.82 128.82 0 0 0 73.677-73.677c6.228-16.025 10.486-34.337 11.71-61.151 1.226-26.87 1.516-35.449 1.516-103.866s-.29-77-1.516-103.866c-1.224-26.815-5.482-45.127-11.71-61.151a123.5 123.5 0 0 0-29.057-44.62A123.5 123.5 0 0 0 421.018 17.3c-16.025-6.223-34.337-10.481-61.152-11.7C333 4.369 324.418 4.079 256 4.079Z" />
+            <path d="M256 126.635A129.365 129.365 0 1 0 385.365 256 129.365 129.365 0 0 0 256 126.635m0 213.338A83.973 83.973 0 1 1 339.974 256 83.974 83.974 0 0 1 256 339.973" />
+            <circle cx="390.476" cy="121.524" r="30.23" />
+        </symbol>
+
+
+        <!-- YouTube -->
+        <symbol id="svg-youtube" viewBox="0 0 71.412 50">
+            <path d="M35.705 0S13.354 0 7.765 1.47c-3 .824-5.47 3.295-6.294 6.354C0 13.413 0 25 0 25s0 11.647 1.47 17.176a8.95 8.95 0 0 0 6.296 6.295c5.647 1.53 27.94 1.53 27.94 1.53s22.353 0 27.941-1.471a8.95 8.95 0 0 0 6.295-6.295c1.47-5.589 1.47-17.176 1.47-17.176s.06-11.646-1.47-17.235a8.95 8.95 0 0 0-6.295-6.295C58.059 0 35.705 0 35.705 0m-7.117 14.295L47.176 25 28.588 35.705z" />
+        </symbol>
+
+
+        <!-- TikTok -->
+        <symbol id="svg-tiktok" viewBox="0 0 448 512">
+            <path d="M448 209.9a210.1 210.1 0 0 1 -122.8-39.3V349.4A162.6 162.6 0 1 1 185 188.3V278.2a74.6 74.6 0 1 0 52.2 71.2V0l88 0a121.2 121.2 0 0 0 1.9 22.2h0A122.2 122.2 0 0 0 381 102.4a121.4 121.4 0 0 0 67 20.1z" />
+        </symbol>
+
+
+        <!-- Throne -->
+        <symbol id="svg-throne" viewBox="0 0 597 503">
+            <path d="M422.563 264.121a43.1 43.1 0 0 1-7.98 11.175L314.398 377.979c-4.61 4.724-8.889 11.324-15.49 11.324-6.833 0-11.192-6.954-15.965-11.844l-99.752-102.184a26 26 0 0 1-1.609-1.716c-11.197-12.577-13.349-30.741-5.452-46.226L289.152 5.471c2.193-3.411 5.786-5.336 9.756-5.336 3.969 0 7.542 1.904 9.631 5.106l56.646 111.213 56.647 111.213c5.954 11.656 6.226 25.3.731 36.454M302.334 456.435l-282.2-287.424-.898-.921c-2.089-1.674-4.491-2.532-7.082-2.532-3.781.146-7.103 1.8-9.15 4.52-1.922 2.553-2.486 5.859-1.609 9.375L83.52 462.566c1.963 6.759 5.139 13.037 9.505 18.604.523.711 1.108 1.402 1.672 2.071 9.756 11.322 24.463 17.537 39.714 17.537 5.912 0 11.908-.921 17.716-2.888 42.284-14.021 86.552-21.889 131.677-23.333 3.824-.293 7.626-.523 11.407-.712 3.134-.167 6.038-1.674 7.918-4.122a10.3 10.3 0 0 0 2.005-8.308c-.355-1.737-1.295-3.411-2.778-4.959zm289.511-289.12c0 .009-.01.015-.017.009-3.57-2.435-8.117-2.285-12.873.557a11 11 0 0 0-2.128 1.689L335.133 416.172c-4.032 4.102-4.053 10.547-.041 14.649l42.283 43.317c5.014 5.148 11.449 8.664 18.656 10.192a459 459 0 0 1 56.595 15.778 40 40 0 0 0 13.182 2.218c5.536 0 11.073-1.13 16.358-3.39 9.109-3.725 16.985-9.605 22.772-17.034a55.4 55.4 0 0 0 9.526-18.645l82.145-283.239c.334-1.318.459-2.637.355-3.767 0-3.593-1.915-6.935-5.101-8.945-.008-.005-.018 0-.018.009" />
+        </symbol>
+
+        <!-- Spotify -->
+        <symbol id="svg-spotify" viewBox="0 0 168 168">
+            <path d="M83.996.277C37.747.277.253 37.77.253 84.019c0 46.251 37.494 83.741 83.743 83.741 46.254 0 83.744-37.49 83.744-83.741 0-46.246-37.49-83.738-83.745-83.738zm38.404 120.78a5.217 5.217 0 0 1-7.18 1.73c-19.662-12.01-44.414-14.73-73.564-8.07a5.22 5.22 0 0 1-6.249-3.93 5.213 5.213 0 0 1 3.926-6.25c31.9-7.291 59.263-4.15 81.337 9.34 2.46 1.51 3.24 4.72 1.73 7.18m10.25-22.805c-1.89 3.075-5.91 4.045-8.98 2.155-22.51-13.839-56.823-17.846-83.448-9.764-3.453 1.043-7.1-.903-8.148-4.35a6.54 6.54 0 0 1 4.354-8.143c30.413-9.228 68.222-4.758 94.072 11.127 3.07 1.89 4.04 5.91 2.15 8.976zm.88-23.744c-26.99-16.031-71.52-17.505-97.289-9.684-4.138 1.255-8.514-1.081-9.768-5.219a7.835 7.835 0 0 1 5.221-9.771c29.581-8.98 78.756-7.245 109.83 11.202a7.823 7.823 0 0 1 2.74 10.733c-2.2 3.722-7.02 4.949-10.73 2.739z" />
+        </symbol>
+
+        <!-- Paintbrush -->
+        <symbol id="svg-paintbrush" viewBox="0 0 640 640">
+            <path d="M512.5 74.3 291.1 222c-29.1 19.4-47.6 50.9-50.6 85.3 62.3 12.8 111.4 61.9 124.3 124.3 34.5-3 65.9-21.5 85.3-50.6l147.6-221.5c6.7-10.1 10.3-21.9 10.3-34.1 0-33.9-27.5-61.4-61.4-61.4-12.1 0-24 3.6-34.1 10.3M320 464c0-61.9-50.1-112-112-112S96 402.1 96 464c0 3.9.2 7.8.6 11.6 1.8 17.5-10.2 36.4-27.8 36.4H64c-17.7 0-32 14.3-32 32s14.3 32 32 32h144c61.9 0 112-50.1 112-112" />
+        </symbol>
+
+
+        <!-- Images -->
+        <symbol id="svg-images" viewBox="0 0 640 640">
+            <path d="M128 160C128 124.7 156.7 96 192 96L512 96C547.3 96 576 124.7 576 160L576 416C576 451.3 547.3 480 512 480L192 480C156.7 480 128 451.3 128 416L128 160zM56 192C69.3 192 80 202.7 80 216L80 512C80 520.8 87.2 528 96 528L456 528C469.3 528 480 538.7 480 552C480 565.3 469.3 576 456 576L96 576C60.7 576 32 547.3 32 512L32 216C32 202.7 42.7 192 56 192zM224 224C241.7 224 256 209.7 256 192C256 174.3 241.7 160 224 160C206.3 160 192 174.3 192 192C192 209.7 206.3 224 224 224zM420.5 235.5C416.1 228.4 408.4 224 400 224C391.6 224 383.9 228.4 379.5 235.5L323.2 327.6L298.7 297C294.1 291.3 287.3 288 280 288C272.7 288 265.8 291.3 261.3 297L197.3 377C191.5 384.2 190.4 394.1 194.4 402.4C198.4 410.7 206.8 416 216 416L488 416C496.7 416 504.7 411.3 508.9 403.7C513.1 396.1 513 386.9 508.4 379.4L420.4 235.4z" />
+        </symbol>
+
+        <!-- Palette -->
+        <symbol id="svg-palette" viewBox="0 0 640 640">
+            <path d="M576 320v2.7c-.4 36.5-33.6 61.3-70.1 61.3H408c-26.5 0-48 21.5-48 48 0 3.4.4 6.7 1 9.9 2.1 10.2 6.5 20 10.8 29.9 6.1 13.8 12.1 27.5 12.1 42 0 31.8-21.6 60.7-53.4 62-3.5.1-7 .2-10.6.2-141.4 0-256-114.6-256-256S178.6 64 320 64s256 114.6 256 256m-384 32c0-17.7-14.3-32-32-32s-32 14.3-32 32 14.3 32 32 32 32-14.3 32-32m0-96c17.7 0 32-14.3 32-32s-14.3-32-32-32-32 14.3-32 32 14.3 32 32 32m160-96c0-17.7-14.3-32-32-32s-32 14.3-32 32 14.3 32 32 32 32-14.3 32-32m96 96c17.7 0 32-14.3 32-32s-14.3-32-32-32-32 14.3-32 32 14.3 32 32 32" />
+        </symbol>
+
+
+
+    </svg>
+
 </body>
 
 <!--

From 074eeb057f04986a1b11bfb4e8c303270aae951d Mon Sep 17 00:00:00 2001
From: dalfuss <webstuff@dalfuss.net>
Date: Tue, 17 Mar 2026 10:23:53 +0100
Subject: [PATCH 2/4] switched background to jaxtavi

---
 assets/css/style.css    |  24 +++++++-
 assets/js/background.js | 119 ++++++++++++++++++++++++++++++++++++++++
 index.html              |  17 +++---
 3 files changed, 150 insertions(+), 10 deletions(-)
 create mode 100644 assets/js/background.js

diff --git a/assets/css/style.css b/assets/css/style.css
index d0924e7..e67236a 100644
--- a/assets/css/style.css
+++ b/assets/css/style.css
@@ -1,10 +1,20 @@
+:root {
+  --primary-pink: #F5A9B8;
+  --primary-blue: #5BCFFA;
+  --white: #FFFFFF;
+  --dark-bg: #161618;
+  --gray-blue: #A8C5DB;
+  --dark-blue: #12354B;
+  --dark-teal: #12404B;
+  
+}
+
 display-imagebody,html{
     -ms-scroll-chaining:none;
     overscroll-behavior:none;
     margin:0;
     padding:0;
-    background-image: url(../images/background.webp);
-    background-color: black;
+    background-color: var(--dark-bg);
     background-size: cover;
     background-attachment: fixed;
     font-family: "Noto Sans", serif;
@@ -29,6 +39,16 @@ display-imagebody,html{
     to{background-position:100px 0}
 }
 
+.background-canvas {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  z-index: -1;
+  pointer-events: none;
+}
+
 .min-h-full{
     min-height:100vh
 }
diff --git a/assets/js/background.js b/assets/js/background.js
new file mode 100644
index 0000000..34f08ab
--- /dev/null
+++ b/assets/js/background.js
@@ -0,0 +1,119 @@
+(() => {
+  document.addEventListener("DOMContentLoaded", () => {
+    const canvas = document.getElementById("backgroundCanvas");
+    if (!canvas) return;
+
+    if (window.matchMedia("(prefers-reduced-motion: reduce)").matches) return;
+
+    const ctx = canvas.getContext("2d", { alpha: true, desynchronized: true });
+
+    const isMobile = window.matchMedia("(max-width: 768px)").matches;
+    const DPR_CAP = Math.min(1.5, isMobile ? 1.0 : 1.25);
+
+    const getOrbCount = () => {
+      const baseCount = Math.floor((window.innerWidth * window.innerHeight) / 40000);
+      return Math.min(Math.max(baseCount, isMobile ? 15 : 25), isMobile ? 30 : 50);
+    };
+
+    const R_MIN = isMobile ? 3 : 4;
+    const R_MAX = isMobile ? 8 : 12;
+    const SPEED = isMobile ? 0.08 : 0.12;
+
+    const PINK = [245, 169, 184];
+    const BLUE = [91, 207, 250];
+
+    let w = 0, h = 0, dpr = 1;
+    let orbs = [];
+    let raf = 0;
+    let last = 0;
+
+    function resize() {
+      w = window.innerWidth;
+      h = window.innerHeight;
+
+      dpr = Math.min(DPR_CAP, window.devicePixelRatio || 1);
+      canvas.width = Math.floor(w * dpr);
+      canvas.height = Math.floor(h * dpr);
+      canvas.style.width = w + "px";
+      canvas.style.height = h + "px";
+
+      ctx.setTransform(dpr, 0, 0, dpr, 0, 0);
+      createOrbs();
+      last = 0;
+    }
+
+    function createOrbs() {
+      const count = getOrbCount();
+      orbs = new Array(count);
+      
+      for (let i = 0; i < count; i++) {
+        const r = Math.random() * (R_MAX - R_MIN) + R_MIN;
+        const color = Math.random() > 0.5 ? PINK : BLUE;
+        orbs[i] = {
+          x: Math.random() * w,
+          y: Math.random() * h,
+          r,
+          a: Math.random() * 0.15 + 0.4,
+          vx: (Math.random() - 0.5) * SPEED,
+          vy: (Math.random() - 0.5) * SPEED,
+          color: color
+        };
+      }
+    }
+
+    function step() {
+      ctx.clearRect(0, 0, w, h);
+
+      for (let i = 0; i < orbs.length; i++) {
+        const o = orbs[i];
+        o.x += o.vx;
+        o.y += o.vy;
+
+        const margin = o.r * 3;
+        if (o.x < -margin) o.x = w + margin;
+        else if (o.x > w + margin) o.x = -margin;
+        if (o.y < -margin) o.y = h + margin;
+        else if (o.y > h + margin) o.y = -margin;
+
+        ctx.beginPath();
+        ctx.arc(o.x, o.y, o.r, 0, Math.PI * 2);
+        ctx.fillStyle = `rgba(${o.color[0]}, ${o.color[1]}, ${o.color[2]}, ${o.a})`;
+        ctx.fill();
+      }
+    }
+
+    function tick(now) {
+      if (document.hidden) {
+        raf = 0;
+        return;
+      }
+
+      if (!last) last = now;
+      if (now - last >= 16) {
+        last = now;
+        step();
+      }
+
+      raf = requestAnimationFrame(tick);
+    }
+
+    let resizeTimer;
+    window.addEventListener("resize", () => {
+      clearTimeout(resizeTimer);
+      resizeTimer = setTimeout(resize, 150);
+    }, { passive: true });
+
+    document.addEventListener("visibilitychange", () => {
+      if (document.hidden) {
+        cancelAnimationFrame(raf);
+        raf = 0;
+      } else if (!raf) {
+        last = 0;
+        raf = requestAnimationFrame(tick);
+      }
+    });
+
+    resize();
+    raf = requestAnimationFrame(tick);
+  });
+})();
\ No newline at end of file
diff --git a/index.html b/index.html
index b8910b4..96a601b 100644
--- a/index.html
+++ b/index.html
@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html lang="en">
+<html lang="de">
 
 <head>
     <meta charset="utf-8">
@@ -13,7 +13,7 @@
     </link>
     <title>JaxOff Links</title>
     <link href="https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">
-    <script src="https://kit.fontawesome.com/14a35c233c.js" crossorigin="anonymous"></script>
+    
 
 
     <!-- Open Graph -->
@@ -32,13 +32,14 @@
 </head>
 
 <body>
-    <!-- Snowfall Background Animation -->
+    <!-- Snowfall Background Animation
     <section class="animated-background">
         <div id="stars1"></div>
         <div id="stars2"></div>
         <div id="stars3"></div>
     </section>
-    <!-- End of Snowfall Background Animation -->
+    End of Snowfall Background Animation -->
+    <canvas class="background-canvas" id="backgroundCanvas" aria-hidden="true"></canvas>
 
     <div class="min-h-full flex-h-center" id="background_div">
         <div class="mt-48 page-full-wrap relative ">
@@ -202,7 +203,7 @@
 
             <div class="page-item-wrap relative">
                 <div class="page-item flex-both-center absolute"></div>
-                <a target="_blank" class="page-item-each py-10 flex-both-center credit" href="https://credit.11tw.ink">
+                <a class="page-item-each py-10 flex-both-center credit" href="https://credit.11tw.ink">
                     <svg class="link-each-image">
                         <use href="#svg-images"></use>
                     </svg>
@@ -213,7 +214,7 @@
 
             <div class="page-item-wrap relative">
                 <div class="page-item flex-both-center absolute"></div>
-                <a target="_blank" class="page-item-each py-10 flex-both-center colours" href="https://c.11tw.ink">
+                <a class="page-item-each py-10 flex-both-center colours" href="https://c.11tw.ink">
                     <svg class="link-each-image">
                         <use href="#svg-palette"></use>
                     </svg>
@@ -349,6 +350,7 @@
         </p>
     </footer>
 
+    <script src="./assets/js/background.js" defer></script>
 
     <!-- SVG Dump -->
     <svg style="display: none;">
@@ -435,10 +437,9 @@
             <path d="M576 320v2.7c-.4 36.5-33.6 61.3-70.1 61.3H408c-26.5 0-48 21.5-48 48 0 3.4.4 6.7 1 9.9 2.1 10.2 6.5 20 10.8 29.9 6.1 13.8 12.1 27.5 12.1 42 0 31.8-21.6 60.7-53.4 62-3.5.1-7 .2-10.6.2-141.4 0-256-114.6-256-256S178.6 64 320 64s256 114.6 256 256m-384 32c0-17.7-14.3-32-32-32s-32 14.3-32 32 14.3 32 32 32 32-14.3 32-32m0-96c17.7 0 32-14.3 32-32s-14.3-32-32-32-32 14.3-32 32 14.3 32 32 32m160-96c0-17.7-14.3-32-32-32s-32 14.3-32 32 14.3 32 32 32 32-14.3 32-32m96 96c17.7 0 32-14.3 32-32s-14.3-32-32-32-32 14.3-32 32 14.3 32 32 32" />
         </symbol>
 
-
-
     </svg>
 
+
 </body>
 
 <!--

From 1dd71a0dda6792a4a3bf1b4c15cfb0110bfad092 Mon Sep 17 00:00:00 2001
From: dalfuss <webstuff@dalfuss.net>
Date: Tue, 17 Mar 2026 10:28:52 +0100
Subject: [PATCH 3/4] fixed colours for 'design reference'

---
 assets/css/sites.css | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/assets/css/sites.css b/assets/css/sites.css
index 47e1e63..59088db 100644
--- a/assets/css/sites.css
+++ b/assets/css/sites.css
@@ -1404,7 +1404,7 @@ List is not yet complete.
 }
 
 .references {
-    background: linear-gradient(145deg, #f5a9b8 0%, #e4b1c1 25%, #d2b8ca 50%, #bebfd2 75%, #a8c5db 100%);
+    background: linear-gradient(140deg, #f5a9b8 0%, #f5bbc6 13%, #f5cdd4 25%, #f3dee2 38%, #f0f0f0 50%, #dee5eb 63%, #ccdae6 75%, #bad0e0 88%, #a8c5db 100%);
     color: #222222;
 }
 

From b11dd255a98d562d7c0b74683dc45df048a34b48 Mon Sep 17 00:00:00 2001
From: dalfuss <webstuff@dalfuss.net>
Date: Tue, 17 Mar 2026 10:50:49 +0100
Subject: [PATCH 4/4] updated Events

---
 index.html | 23 +++++------------------
 1 file changed, 5 insertions(+), 18 deletions(-)

diff --git a/index.html b/index.html
index 96a601b..81a593e 100644
--- a/index.html
+++ b/index.html
@@ -13,7 +13,7 @@
     </link>
     <title>JaxOff Links</title>
     <link href="https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">
-    
+
 
 
     <!-- Open Graph -->
@@ -197,7 +197,7 @@
                         <use href="#svg-paintbrush"></use>
                     </svg>
 
-                    <span class="item-title text-center">Design Reference</span>
+                    <span class="item-title text-center">Jax' Refsheet (VSONA)</span>
                 </a>
             </div>
 
@@ -219,7 +219,7 @@
                         <use href="#svg-palette"></use>
                     </svg>
 
-                    <span class="item-title text-center">Colours</span>
+                    <span class="item-title text-center">11twink Colours</span>
                 </a>
             </div>
 
@@ -244,19 +244,6 @@
             </div>
             </p>
 
-            <a id="Events/Feb2026">
-                <h2 class="separator" title="Events">
-                    Februar 2026
-                </h2>
-            </a>
-
-            <div class="page-item-wrap relative">
-                <div class="page-item flex-both-center absolute"></div>
-                <a target="_blank" class="page-item-each py-10 flex-both-center ConYes" href="https://www.dedeco-online.de">
-                    <span class="item-title text-center">DeDeCo // Dresden // 13.02.-15.02.2026</span>
-                </a>
-            </div>
-
             <a id="Events/May2026">
                 <h2 class="separator" title="Events">
                     Mai 2026
@@ -290,7 +277,7 @@
             </div>
             <div class="page-item-wrap relative">
                 <div class="page-item flex-both-center absolute"></div>
-                <a target="_blank" class="page-item-each py-10 flex-both-center ConProb" href="https://www.wiemaikai.de/">
+                <a target="_blank" class="page-item-each py-10 flex-both-center ConYes" href="https://www.wiemaikai.de/">
                     <span class="item-title text-center">Wie.MAI.KAI // Flörsheim am Main // 13.-14.06.2026</span>
                 </a>
             </div>
@@ -309,7 +296,7 @@
             </div>
             <div class="page-item-wrap relative">
                 <div class="page-item flex-both-center absolute"></div>
-                <a target="_blank" class="page-item-each py-10 flex-both-center ConProb" href="https://animagic.de/">
+                <a target="_blank" class="page-item-each py-10 flex-both-center ConYes" href="https://animagic.de/">
                     <span class="item-title text-center">AnimagiC // Mannheim // 31.07.-02.08.2026</span>
                 </a>
             </div>