From 29ee33fbbcb92e3cd0e96907f4b0cfbd81a39a7c Mon Sep 17 00:00:00 2001
From: Ruben <sneexy@disroot.org>
Date: Mon, 30 Jun 2025 17:33:06 -0500
Subject: [PATCH] optimize icons css

---
 _includes/layouts/donate/page.njk             |  10 +-
 _includes/layouts/error.njk                   |   8 +-
 _includes/layouts/footer.njk                  |  16 +-
 _includes/layouts/home.njk                    |  34 +-
 _includes/layouts/iceshrimp.njk               |  72 +-
 _includes/layouts/navbar.njk                  |  22 +-
 _includes/layouts/post.njk                    |  16 +-
 _includes/layouts/sharkey.njk                 |  62 +-
 _includes/layouts/sneexy/notebook.njk         |  14 +-
 _includes/layouts/sneexy/page.njk             |  88 +-
 _includes/layouts/sneexy/ruben/page-ruben.njk |  30 +-
 _includes/styles/base.css                     |   6 +-
 _includes/styles/icons.css                    | 839 ++----------------
 _includes/styles/navbar.css                   |   8 +-
 _includes/styles/windows.css                  |   4 +-
 15 files changed, 249 insertions(+), 980 deletions(-)

diff --git a/_includes/layouts/donate/page.njk b/_includes/layouts/donate/page.njk
index e0f770f..e9fd1cd 100644
--- a/_includes/layouts/donate/page.njk
+++ b/_includes/layouts/donate/page.njk
@@ -7,16 +7,16 @@ permalink: "/donate/"
 <!-- donation window -->
 <div id="donate" class="window">
     <div class="header">
-        <div class="icon" aria-hidden="true">
-            <span class="tabler--message-chatbot"></span>
+        <div class="titlebar-icon" aria-hidden="true">
+            <span class="icon tabler--message-chatbot"></span>
         </div>
         <a href="#donate">donate</a>
         <div class="window-buttons" aria-hidden="true">
-            <span class="tabler--minimize"></span>
-            <span class="tabler--maximize"></span>
+            <span class="icon tabler--minimize"></span>
+            <span class="icon tabler--maximize"></span>
         </div>
         <div class="close-button" aria-hidden="true">
-            <span class="tabler--x"></span>
+            <span class="icon tabler--x"></span>
         </div>
     </div>
 
diff --git a/_includes/layouts/error.njk b/_includes/layouts/error.njk
index fa65d81..5347429 100644
--- a/_includes/layouts/error.njk
+++ b/_includes/layouts/error.njk
@@ -7,15 +7,15 @@ layout: "layouts/base.njk"
 <details open id="404" class="window error">
     <summary>
         <div aria-hidden="true">
-            <span class="tabler--mood-sad-dizzy"></span>
+            <span class="icon tabler--mood-sad-dizzy"></span>
         </div>
         <a href="#404">Not found!</a>
         <div aria-hidden="true">
-            <span class="tabler--minimize"></span>
-            <span class="tabler--maximize"></span>
+            <span class="icon tabler--minimize"></span>
+            <span class="icon tabler--maximize"></span>
         </div>
         <div aria-hidden="true">
-            <span class="tabler--x"></span>
+            <span class="icon tabler--x"></span>
         </div>
     </summary>
 
diff --git a/_includes/layouts/footer.njk b/_includes/layouts/footer.njk
index 8b7def6..1fb37b9 100644
--- a/_includes/layouts/footer.njk
+++ b/_includes/layouts/footer.njk
@@ -6,15 +6,15 @@
         </div>
 
         <section>
-            <p class="fediring"><b><a href="https://fediring.net/previous?host=synth.download" aria-label="Previous"><span class="tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://fediring.net">Fediring</a> <a href="https://fediring.net/next?host=synth.download" aria-label="Next"><span class="tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
-            <p class="fediring"><b><a href="https://keithhacks.cyou/furryring.php?prev=synth.download" aria-label="Previous"><span class="tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://keithhacks.cyou/furryring.php">furryring</a> <a href="https://keithhacks.cyou/furryring.php?next=synth.download" aria-label="Next"><span class="tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
-            <p class="fediring"><b><a href="https://stellophiliac.github.io/roboring/sneexy/previous" aria-label="Previous"><span class="tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://stellophiliac.github.io/roboring">roboring</a> <a href="https://stellophiliac.github.io/roboring/sneexy/next" aria-label="Next"><span class="tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
+            <p class="fediring"><b><a href="https://fediring.net/previous?host=synth.download" aria-label="Previous"><span class="icon tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://fediring.net">Fediring</a> <a href="https://fediring.net/next?host=synth.download" aria-label="Next"><span class="icon tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
+            <p class="fediring"><b><a href="https://keithhacks.cyou/furryring.php?prev=synth.download" aria-label="Previous"><span class="icon tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://keithhacks.cyou/furryring.php">furryring</a> <a href="https://keithhacks.cyou/furryring.php?next=synth.download" aria-label="Next"><span class="icon tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
+            <p class="fediring"><b><a href="https://stellophiliac.github.io/roboring/sneexy/previous" aria-label="Previous"><span class="icon tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://stellophiliac.github.io/roboring">roboring</a> <a href="https://stellophiliac.github.io/roboring/sneexy/next" aria-label="Next"><span class="icon tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
             <section class="inner-footer">
-                <a href="https://forged.synth.download/sneexy/pages" style="background-color: color-mix(in srgb, var(--maroon) 25%, transparent); color: var(--maroon);" aria-label="Website source!"><span class="tabler--brand-git" style="pointer-events: none;"></span></a>
-                <a href="https://github.com/ayu-theme/ayu-colors" style="background-color: color-mix(in srgb, var(--accent) 25%, transparent); color: var(--accent);" aria-label="Ayu"><span class="tabler--palette" style="pointer-events: none;"></span></svg></a>
-                <a href="https://tabler.io" style="background-color: color-mix(in srgb, var(--blue) 25%, transparent); color: var(--blue);" aria-label="Tabler"><span class="tabler--brand-tabler" style="pointer-events: none;"></span></a>
-                <a href="https://www.jetbrains.com/lp/mono" style="background-color: color-mix(in srgb, var(--green) 25%, transparent); color: var(--green);" aria-label="JetBrains Mono"><span class="tabler--text-size" style="pointer-events: none;"></span></a>
-                <a href="https://www.lexend.com" style="background-color: color-mix(in srgb, var(--sapphire) 25%, transparent); color: var(--sapphire);" aria-label="Lexend"><span class="tabler--letter-case" style="pointer-events: none;"></span></i></a>
+                <a href="https://forged.synth.download/sneexy/pages" style="background-color: color-mix(in srgb, var(--maroon) 25%, transparent); color: var(--maroon);" aria-label="Website source!"><span class="icon tabler--brand-git" style="pointer-events: none;"></span></a>
+                <a href="https://github.com/ayu-theme/ayu-colors" style="background-color: color-mix(in srgb, var(--accent) 25%, transparent); color: var(--accent);" aria-label="Ayu"><span class="icon tabler--palette" style="pointer-events: none;"></span></svg></a>
+                <a href="https://tabler.io" style="background-color: color-mix(in srgb, var(--blue) 25%, transparent); color: var(--blue);" aria-label="Tabler"><span class="icon tabler--brand-tabler" style="pointer-events: none;"></span></a>
+                <a href="https://www.jetbrains.com/lp/mono" style="background-color: color-mix(in srgb, var(--green) 25%, transparent); color: var(--green);" aria-label="JetBrains Mono"><span class="icon tabler--text-size" style="pointer-events: none;"></span></a>
+                <a href="https://www.lexend.com" style="background-color: color-mix(in srgb, var(--sapphire) 25%, transparent); color: var(--sapphire);" aria-label="Lexend"><span class="icon tabler--letter-case" style="pointer-events: none;"></span></i></a>
             </section>
             <p style="padding-bottom: 14px;"><a href="https://synthspecies.com">Synth species</a> created by <a href="https://www.furaffinity.net/user/vader-san">Vader-San</a>, synth.download is not affiliated with the creator in any way.</p>
             <p>Made with <span class="rainbow">love</span>, <span class="rainbow">lack of sleep</span> and <span class="rainbow">procrastination</span></p>
diff --git a/_includes/layouts/home.njk b/_includes/layouts/home.njk
index 7884ec7..751fa18 100644
--- a/_includes/layouts/home.njk
+++ b/_includes/layouts/home.njk
@@ -7,16 +7,16 @@ permalink: "/index.html"
 <!-- simple site introduction -->
 <div id="site" class="window home">
     <div class="header">
-        <div class="icon" aria-hidden="true">
-            <span class="tabler--message-chatbot"></span>
+        <div class="titlebar-icon" aria-hidden="true">
+            <span class="icon tabler--message-chatbot"></span>
         </div>
         <a href="#site">Welcome!</a>
         <div class="window-buttons" aria-hidden="true">
-            <span class="tabler--minimize"></span>
-            <span class="tabler--maximize"></span>
+            <span class="icon tabler--minimize"></span>
+            <span class="icon tabler--maximize"></span>
         </div>
         <div class="close-button" aria-hidden="true">
-            <span class="tabler--x"></span>
+            <span class="icon tabler--x"></span>
         </div>
     </div>
 
@@ -31,7 +31,7 @@ permalink: "/index.html"
             <img src="/assets/buttons/synth.download.svg" alt="Synth.Download!">
         </button>
         <details class="styled">
-            <summary><span class="tabler--user"></span> Members <span class="tabler--arrow-autofit-height"></span></summary>
+            <summary><span class="icon tabler--user"></span> Members <span class="icon tabler--arrow-autofit-height"></span></summary>
             <section>
                 <p>Every user currently registered on the Synth.download tilde will be listed here. <small>Some users may not have pages yet and will lead to a blank page or a 404.</p></small>
                 <div class="card tilde-list">
@@ -40,34 +40,34 @@ permalink: "/index.html"
             </section>
         </details>
         <details class="styled">
-            <summary><span class="tabler--planet"></span> Services <span class="tabler--arrow-autofit-height"></span></summary>
+            <summary><span class="icon tabler--planet"></span> Services <span class="icon tabler--arrow-autofit-height"></span></summary>
             <section>
                 <div class="card redlib">
                     <h2><a href="https://reddit.synth.download">Redlib</a> <small>(Public)</small></h2>
                     <p>A simple alternative frontend for accessing <a href="https://reddit.com">Reddit</a> content.</p>
-                    <a class="button" href="https://reddit.synth.download"><span class="tabler--arrow-forward"></span> Go</a>
+                    <a class="button" href="https://reddit.synth.download"><span class="icon tabler--arrow-forward"></span> Go</a>
                 </div>
                 <div class="card sharkey">
                     <h2><a href="https://booping.synth.download">Sharkey</a></h2>
                     <p>Advanced social media software connected to the wider <a href="https://fediverse.info">Fediverse</a> (<a href="https://activitypub.rocks/">ActivityPub</a>), based on <a href="https://misskey-hub.net">Misskey</a> with <a href="https://docs.joinsharkey.org/docs/comparison/misskey">many improvements</a>.</p>
                     <p><i>Accounts from this instance shall be reached via @booping.synth.download</i></p>
-                    <a class="button" href="https://booping.synth.download"><span class="tabler--arrow-forward"></span> Go</a>
+                    <a class="button" href="https://booping.synth.download"><span class="icon tabler--arrow-forward"></span> Go</a>
                 </div>
                 <div class="card iceshrimp">
                     <h2><a href="https://beeping.synth.download">Iceshrimp</a></h2>
                     <p>Another advanced social media software connected to the wider <a href="https://fediverse.info">Fediverse</a> (<a href="https://activitypub.rocks/">ActivityPub</a>), provided as an alternative for those who dislike the Misskey experience or prefer the Mastodon compatibility.</p>
                     <p><i>Accounts from this instance shall be reached via @synth.download</i></p>
-                    <a class="button" href="https://beeping.synth.download"><span class="tabler--arrow-forward"></span> Go</a>
+                    <a class="button" href="https://beeping.synth.download"><span class="icon tabler--arrow-forward"></span> Go</a>
                 </div>
                 <div class="card ask-js">
                     <h2><a href="https://asking.synth.download">Ask-js</a></h2>
                     <p>Platform for receiving and answering anonymous questions and answers.</p>
-                    <a class="button" href="https://asking.synth.download"><span class="tabler--arrow-forward"></span> Go</a>
+                    <a class="button" href="https://asking.synth.download"><span class="icon tabler--arrow-forward"></span> Go</a>
                 </div>
                 <div class="card forgejo">
                     <h2><a href="https://forged.synth.download">Forgejo</a></h2>
                     <p>A home for Git repositories.</p>
-                    <a class="button" href="https://forged.synth.download"><span class="tabler--arrow-forward"></span> Go</a>
+                    <a class="button" href="https://forged.synth.download"><span class="icon tabler--arrow-forward"></span> Go</a>
                 </div>
                 <div class="card pds">
                     <h2>PDS</h2>
@@ -85,27 +85,27 @@ permalink: "/index.html"
                 <div class="card freshrss">
                     <h2><a href="https://rss.synth.download">FreshRSS</a></h2>
                     <p>Online RSS and Atom compatible feed reader.</p>
-                    <a class="button" href="https://rss.synth.download"><span class="tabler--arrow-forward"></span> Go</a>
+                    <a class="button" href="https://rss.synth.download"><span class="icon tabler--arrow-forward"></span> Go</a>
                 </div>
                 <div class="card vaultwarden">
                     <h2><a href="https://vault.synth.download">Vaultwarden</a></h2>
                     <p>Bitwarden-compatible password manager with 2FA support and all that good stuff.</p>
-                    <a class="button" href="https://vault.synth.download"><span class="tabler--arrow-forward"></span> Go</a>
+                    <a class="button" href="https://vault.synth.download"><span class="icon tabler--arrow-forward"></span> Go</a>
                 </div>
                 <div class="card zitadel">
                     <h2><a href="https://auth.synth.download">ZITADEL</a></h2>
                     <p>Our authenticator to access multiple services using one account... or an attempt to. Currently only used for FreshRSS and Forgejo, and hoping to expand more with this.</p>
-                    <a class="button" href="https://auth.synth.download"><span class="tabler--arrow-forward"></span> Go</a>
+                    <a class="button" href="https://auth.synth.download"><span class="icon tabler--arrow-forward"></span> Go</a>
                 </div>
                 <div class="card last dark-room">
                     <h2><a href="https://adarkroom.synth.download">A Dark Room</a></h2>
                     <p>Just a fun mirror of <a href="https://adarkroom.doublespeakgames.com">A Dark Room</a>, a minimalist and dark text adventure-like game.</p>
-                    <a class="button" href="https://adarkroom.synth.download"><span class="tabler--arrow-forward"></span> Go</a>
+                    <a class="button" href="https://adarkroom.synth.download"><span class="icon tabler--arrow-forward"></span> Go</a>
                 </div>
             </section>
         </details>
         <details class="styled last">
-            <summary><span class="tabler--help"></span> Questions & Answers <span class="tabler--arrow-autofit-height"></span></summary>
+            <summary><span class="icon tabler--help"></span> Questions & Answers <span class="icon tabler--arrow-autofit-height"></span></summary>
             <section>
                 <p>As answered by <a href="/~sneexy">~sneexy</a>, the sysadmin of Synth.download.</p>
                 <div class="card question">
diff --git a/_includes/layouts/iceshrimp.njk b/_includes/layouts/iceshrimp.njk
index 643884a..614419c 100644
--- a/_includes/layouts/iceshrimp.njk
+++ b/_includes/layouts/iceshrimp.njk
@@ -7,39 +7,39 @@ permalink: "/iceshrimp/"
 <!-- iceshrimp introduction -->
 <div id="iceshrimp" class="window">
     <div class="header">
-        <div class="icon" aria-hidden="true">
-            <span class="tabler--universe"></span>
+        <div class="titlebar-icon" aria-hidden="true">
+            <span class="icon tabler--universe"></span>
         </div>
         <a href="#iceshrimp">Icesynth!</a>
         <div class="window-buttons" aria-hidden="true">
-            <span class="tabler--minimize"></span>
-            <span class="tabler--maximize"></span>
+            <span class="icon tabler--minimize"></span>
+            <span class="icon tabler--maximize"></span>
         </div>
         <div class="close-button" aria-hidden="true">
-            <span class="tabler--x"></span>
+            <span class="icon tabler--x"></span>
         </div>
     </div>
 
     <section style="text-align:center;">
         <h1><a href="https://iceshrimp.net" target="_blank" style="vertical-align:middle;"><img src="/assets/isnet.png" alt="Iceshrimp.NET source" style="height:2rem;margin-right:.4rem;border-radius:.2rem" /></a>Icesynth!</h1>
         <p>Beep! A small instance themed around <a href="https://synthspecies.com">synths</a>, but accepts all. <small>Not to be confused with our <a href="/sharkey">Sharkey</a> instance.</small></p>
-        <p><a class="button" href="https://beeping.synth.download/login"><span class="tabler--login"></span> Log in</a> <a class="button" href="https://beeping.synth.download/register"><span class="tabler--user-plus"></span> Register</a></p>
+        <p><a class="button" href="https://beeping.synth.download/login"><span class="icon tabler--login"></span> Log in</a> <a class="button" href="https://beeping.synth.download/register"><span class="icon tabler--user-plus"></span> Register</a></p>
     </section>
 </div>
 
 <!-- information -->
 <div id="information" class="window">
     <div class="header">
-        <div class="icon" aria-hidden="true">
-            <span class="tabler--info-circle"></span>
+        <div class="titlebar-icon" aria-hidden="true">
+            <span class="icon tabler--info-circle"></span>
         </div>
         <a href="#information">Instance information</a>
         <div class="window-buttons" aria-hidden="true">
-            <span class="tabler--minimize"></span>
-            <span class="tabler--maximize"></span>
+            <span class="icon tabler--minimize"></span>
+            <span class="icon tabler--maximize"></span>
         </div>
         <div class="close-button" aria-hidden="true">
-            <span class="tabler--x"></span>
+            <span class="icon tabler--x"></span>
         </div>
     </div>
 
@@ -60,16 +60,16 @@ permalink: "/iceshrimp/"
 <!-- instance features -->
 <div id="features" class="window">
     <div class="header">
-        <div class="icon" aria-hidden="true">
-            <span class="tabler--info-circle"></span>
+        <div class="titlebar-icon" aria-hidden="true">
+            <span class="icon tabler--info-circle"></span>
         </div>
         <a href="#features">Features</a>
         <div class="window-buttons" aria-hidden="true">
-            <span class="tabler--minimize"></span>
-            <span class="tabler--maximize"></span>
+            <span class="icon tabler--minimize"></span>
+            <span class="icon tabler--maximize"></span>
         </div>
         <div class="close-button" aria-hidden="true">
-            <span class="tabler--x"></span>
+            <span class="icon tabler--x"></span>
         </div>
     </div>
 
@@ -99,16 +99,16 @@ permalink: "/iceshrimp/"
 <!-- instance rules -->
 <div id="rules" class="window">
     <div class="header">
-        <div class="icon" aria-hidden="true">
-            <span class="tabler--info-circle"></span>
+        <div class="titlebar-icon" aria-hidden="true">
+            <span class="icon tabler--info-circle"></span>
         </div>
         <a href="#rules">Rules</a>
         <div class="window-buttons" aria-hidden="true">
-            <span class="tabler--minimize"></span>
-            <span class="tabler--maximize"></span>
+            <span class="icon tabler--minimize"></span>
+            <span class="icon tabler--maximize"></span>
         </div>
         <div class="close-button" aria-hidden="true">
-            <span class="tabler--x"></span>
+            <span class="icon tabler--x"></span>
         </div>
     </div>
 
@@ -147,16 +147,16 @@ permalink: "/iceshrimp/"
 <!-- alternative frontends -->
 <div id="frontends" class="window">
     <div class="header">
-        <div class="icon" aria-hidden="true">
-            <span class="tabler--info-circle"></span>
+        <div class="titlebar-icon" aria-hidden="true">
+            <span class="icon tabler--info-circle"></span>
         </div>
         <a href="#frontends">Alternative frontends</a>
         <div class="window-buttons" aria-hidden="true">
-            <span class="tabler--minimize"></span>
-            <span class="tabler--maximize"></span>
+            <span class="icon tabler--minimize"></span>
+            <span class="icon tabler--maximize"></span>
         </div>
         <div class="close-button" aria-hidden="true">
-            <span class="tabler--x"></span>
+            <span class="icon tabler--x"></span>
         </div>
     </div>
 
@@ -195,16 +195,16 @@ permalink: "/iceshrimp/"
 <!-- bubble timeline -->
 <div id="bubble" class="window">
     <div class="header">
-        <div class="icon" aria-hidden="true">
-            <span class="tabler--info-circle"></span>
+        <div class="titlebar-icon" aria-hidden="true">
+            <span class="icon tabler--info-circle"></span>
         </div>
         <a href="#bubble">Bubble timeline</a>
         <div class="window-buttons" aria-hidden="true">
-            <span class="tabler--minimize"></span>
-            <span class="tabler--maximize"></span>
+            <span class="icon tabler--minimize"></span>
+            <span class="icon tabler--maximize"></span>
         </div>
         <div class="close-button" aria-hidden="true">
-            <span class="tabler--x"></span>
+            <span class="icon tabler--x"></span>
         </div>
     </div>
 
@@ -345,16 +345,16 @@ permalink: "/iceshrimp/"
 <!-- moderation-->
 <div id="moderation" class="window">
     <div class="header">
-        <div class="icon" aria-hidden="true">
-            <span class="tabler--info-circle"></span>
+        <div class="titlebar-icon" aria-hidden="true">
+            <span class="icon tabler--info-circle"></span>
         </div>
         <a href="#moderation">Moderation</a>
         <div class="window-buttons" aria-hidden="true">
-            <span class="tabler--minimize"></span>
-            <span class="tabler--maximize"></span>
+            <span class="icon tabler--minimize"></span>
+            <span class="icon tabler--maximize"></span>
         </div>
         <div class="close-button" aria-hidden="true">
-            <span class="tabler--x"></span>
+            <span class="icon tabler--x"></span>
         </div>
     </div>
 
diff --git a/_includes/layouts/navbar.njk b/_includes/layouts/navbar.njk
index ee0f37f..b3cf234 100644
--- a/_includes/layouts/navbar.njk
+++ b/_includes/layouts/navbar.njk
@@ -8,23 +8,23 @@
         </label>
         <ul>
             <li class="nav-home">
-                <a href="/"><span class="tabler--home"></span> <span class="text">Home</span></a>
+                <a href="/"><span class="icon tabler--home"></span> <span class="text">Home</span></a>
             </li>
             <li class="nav-webmaster">
-                <a href="/~sneexy"><span class="tabler--user"></span> <span class="text">The webmaster</span></a>
+                <a href="/~sneexy"><span class="icon tabler--user"></span> <span class="text">The webmaster</span></a>
             </li>
             <li class="nav-donate">
-                <a href="/donate"><span class="tabler--currency-dollar"></span> <span class="text">Donate</span></a>
+                <a href="/donate"><span class="icon tabler--currency-dollar"></span> <span class="text">Donate</span></a>
             </li>
         </ul>
     </div>
-    <a class="nav-base nav-left nav-links nav-home" href="/"><span class="tabler--home"></span> <span class="text">Home</span></a>
-    <a class="nav-base nav-left nav-links nav-webmaster" href="/~sneexy"><span class="tabler--user"></span> <span class="text">The webmaster</span></a>
-    <a class="nav-base nav-left nav-links nav-donate" href="/donate"><span class="tabler--currency-dollar"></span> <span class="text">Donate</span></a>
+    <a class="nav-base nav-left nav-links nav-home" href="/"><span class="icon tabler--home"></span> <span class="text">Home</span></a>
+    <a class="nav-base nav-left nav-links nav-webmaster" href="/~sneexy"><span class="icon tabler--user"></span> <span class="text">The webmaster</span></a>
+    <a class="nav-base nav-left nav-links nav-donate" href="/donate"><span class="icon tabler--currency-dollar"></span> <span class="text">Donate</span></a>
     <div class="nav-base nav-right nav-settings">
         <input type="checkbox" id="nav-settings-menu" value="" name="nav-settings-menu">
         <label aria-label="Settings" for="nav-settings-menu" data-toggle="nav-settings">
-            <span class="tabler--settings">
+            <span class="icon tabler--settings">
         </label>
         <ul>
             <li>
@@ -106,9 +106,9 @@
     </div>
     
     <p aria-hidden="true" class="nav-base nav-right nav-systray">
-        <span class="tabler--bell"></span>
-        <span class="tabler--volume"></span>
-        <span class="tabler--wifi"></span>
-        <span class="tabler--battery-filled"></span>
+        <span class="icon tabler--bell"></span>
+        <span class="icon tabler--volume"></span>
+        <span class="icon tabler--wifi"></span>
+        <span class="icon tabler--battery-filled"></span>
     </p>
 </nav>
\ No newline at end of file
diff --git a/_includes/layouts/post.njk b/_includes/layouts/post.njk
index e638a4f..45b6d99 100644
--- a/_includes/layouts/post.njk
+++ b/_includes/layouts/post.njk
@@ -9,15 +9,15 @@ permalink: "/notebook/{{ date }}-{{ title | slugify }}/"
 <details open id="information" class="window">
     <summary>
         <div aria-hidden="true">
-            <span class="tabler--info-circle"></span>
+            <span class="icon tabler--info-circle"></span>
         </div>
         <a href="#information">information</a>
         <div aria-hidden="true">
-            <span class="tabler--minimize"></span>
-            <span class="tabler--maximize"></span>
+            <span class="icon tabler--minimize"></span>
+            <span class="icon tabler--maximize"></span>
         </div>
         <div aria-hidden="true">
-            <span class="tabler--x"></span>
+            <span class="icon tabler--x"></span>
         </div>
     </summary>
 
@@ -34,15 +34,15 @@ permalink: "/notebook/{{ date }}-{{ title | slugify }}/"
 <details open id="post" class="window">
     <summary>
         <div aria-hidden="true">
-            <span class="tabler--article"></span>
+            <span class="icon tabler--article"></span>
         </div>
         <a href="#post">{{ title or metadata.title }}</a>
         <div aria-hidden="true">
-            <span class="tabler--minimize"></span>
-            <span class="tabler--maximize"></span>
+            <span class="icon tabler--minimize"></span>
+            <span class="icon tabler--maximize"></span>
         </div>
         <div aria-hidden="true">
-            <span class="tabler--x"></span>
+            <span class="icon tabler--x"></span>
         </div>
     </summary>
 
diff --git a/_includes/layouts/sharkey.njk b/_includes/layouts/sharkey.njk
index 6d6b5fc..a1c3619 100644
--- a/_includes/layouts/sharkey.njk
+++ b/_includes/layouts/sharkey.njk
@@ -7,39 +7,39 @@ permalink: "/sharkey/"
 <!-- sharkey introduction -->
 <div id="sharkey" class="window">
     <div class="header">
-        <div class="icon" aria-hidden="true">
-            <span class="tabler--universe"></span>
+        <div class="titlebar-icon" aria-hidden="true">
+            <span class="icon tabler--universe"></span>
         </div>
         <a href="#sharkey">Beepkey!</a>
         <div class="window-buttons" aria-hidden="true">
-            <span class="tabler--minimize"></span>
-            <span class="tabler--maximize"></span>
+            <span class="icon tabler--minimize"></span>
+            <span class="icon tabler--maximize"></span>
         </div>
         <div class="close-button" aria-hidden="true">
-            <span class="tabler--x"></span>
+            <span class="icon tabler--x"></span>
         </div>
     </div>
 
     <section style="text-align:center;">
         <h1><a href="https://joinsharkey.org" target="_blank" style="vertical-align:middle;"><img src="/assets/sharkey_sh.svg" alt="Sharkey's website" style="height:2rem;margin-right:.4rem;border-radius:.2rem" /></a>Beepkey!</h1>
         <p>Beep! A small instance themed around <a href="https://synthspecies.com">synths</a>, but accepts all. <small>Not to be confused with our <a href="/iceshrimp">Iceshrimp</a> instance.</small></p>
-        <p><a class="button" href="https://booping.synth.download"><span class="tabler--external-link"></span> Visit</a></p>
+        <p><a class="button" href="https://booping.synth.download"><span class="icon tabler--external-link"></span> Visit</a></p>
     </section>
 </div>
 
 <!-- information -->
 <div id="information" class="window">
     <div class="header">
-        <div class="icon" aria-hidden="true">
-            <span class="tabler--info-circle"></span>
+        <div class="titlebar-icon" aria-hidden="true">
+            <span class="icon tabler--info-circle"></span>
         </div>
         <a href="#information">Instance information</a>
         <div class="window-buttons" aria-hidden="true">
-            <span class="tabler--minimize"></span>
-            <span class="tabler--maximize"></span>
+            <span class="icon tabler--minimize"></span>
+            <span class="icon tabler--maximize"></span>
         </div>
         <div class="close-button" aria-hidden="true">
-            <span class="tabler--x"></span>
+            <span class="icon tabler--x"></span>
         </div>
     </div>
 
@@ -61,16 +61,16 @@ permalink: "/sharkey/"
 <!-- instance features -->
 <div id="features" class="window">
     <div class="header">
-        <div class="icon" aria-hidden="true">
-            <span class="tabler--info-circle"></span>
+        <div class="titlebar-icon" aria-hidden="true">
+            <span class="icon tabler--info-circle"></span>
         </div>
         <a href="#features">Features</a>
         <div class="window-buttons" aria-hidden="true">
-            <span class="tabler--minimize"></span>
-            <span class="tabler--maximize"></span>
+            <span class="icon tabler--minimize"></span>
+            <span class="icon tabler--maximize"></span>
         </div>
         <div class="close-button" aria-hidden="true">
-            <span class="tabler--x"></span>
+            <span class="icon tabler--x"></span>
         </div>
     </div>
 
@@ -100,16 +100,16 @@ permalink: "/sharkey/"
 <!-- instance rules -->
 <div id="rules" class="window">
     <div class="header">
-        <div class="icon" aria-hidden="true">
-            <span class="tabler--info-circle"></span>
+        <div class="titlebar-icon" aria-hidden="true">
+            <span class="icon tabler--info-circle"></span>
         </div>
         <a href="#rules">Rules</a>
         <div class="window-buttons" aria-hidden="true">
-            <span class="tabler--minimize"></span>
-            <span class="tabler--maximize"></span>
+            <span class="icon tabler--minimize"></span>
+            <span class="icon tabler--maximize"></span>
         </div>
         <div class="close-button" aria-hidden="true">
-            <span class="tabler--x"></span>
+            <span class="icon tabler--x"></span>
         </div>
     </div>
 
@@ -148,16 +148,16 @@ permalink: "/sharkey/"
 <!-- bubble timeline -->
 <div id="bubble" class="window">
     <div class="header">
-        <div class="icon" aria-hidden="true">
-            <span class="tabler--info-circle"></span>
+        <div class="titlebar-icon" aria-hidden="true">
+            <span class="icon tabler--info-circle"></span>
         </div>
         <a href="#bubble">Bubble timeline</a>
         <div class="window-buttons" aria-hidden="true">
-            <span class="tabler--minimize"></span>
-            <span class="tabler--maximize"></span>
+            <span class="icon tabler--minimize"></span>
+            <span class="icon tabler--maximize"></span>
         </div>
         <div class="close-button" aria-hidden="true">
-            <span class="tabler--x"></span>
+            <span class="icon tabler--x"></span>
         </div>
     </div>
 
@@ -298,16 +298,16 @@ permalink: "/sharkey/"
 <!-- moderation-->
 <div id="moderation" class="window">
     <div class="header">
-        <div class="icon" aria-hidden="true">
-            <span class="tabler--info-circle"></span>
+        <div class="titlebar-icon" aria-hidden="true">
+            <span class="icon tabler--info-circle"></span>
         </div>
         <a href="#moderation">Moderation</a>
         <div class="window-buttons" aria-hidden="true">
-            <span class="tabler--minimize"></span>
-            <span class="tabler--maximize"></span>
+            <span class="icon tabler--minimize"></span>
+            <span class="icon tabler--maximize"></span>
         </div>
         <div class="close-button" aria-hidden="true">
-            <span class="tabler--x"></span>
+            <span class="icon tabler--x"></span>
         </div>
     </div>
 
diff --git a/_includes/layouts/sneexy/notebook.njk b/_includes/layouts/sneexy/notebook.njk
index 0f5b4dc..8d76767 100644
--- a/_includes/layouts/sneexy/notebook.njk
+++ b/_includes/layouts/sneexy/notebook.njk
@@ -9,27 +9,27 @@ permalink: "/notebook/"
 <!-- notebook index -->
 <div id="notebook" class="window">
     <div class="header">
-        <div class="icon" aria-hidden="true">
-            <span class="tabler--article"></span>
+        <div class="titlebar-icon" aria-hidden="true">
+            <span class="icon tabler--article"></span>
         </div>
         <a href="#notebook">Notebook</a>
         <div class="window-buttons" aria-hidden="true">
-            <span class="tabler--minimize"></span>
-            <span class="tabler--maximize"></span>
+            <span class="icon tabler--minimize"></span>
+            <span class="icon tabler--maximize"></span>
         </div>
         <div class="close-button" aria-hidden="true">
-            <span class="tabler--x"></span>
+            <span class="icon tabler--x"></span>
         </div>
     </div>
 
     <section data-pagefind-body>
         <div id="search"></div>
-        <h1><a href="#notebook">Notebook</a> <a href="./rss.xml"><span class="tabler--rss" style="transform: scale(1.5) translateY(.5rem);"></span></a></h1>
+        <h1><a href="#notebook">Notebook</a> <a href="./rss.xml"><span class="icon tabler--rss" style="transform: scale(1.5) translateY(.5rem);"></span></a></h1>
         <h2><b>NOTE:</b> This page is still heavily a work in progress, nothing on here is functional or what is meant to be.</h2>
         <p>A public facing journal for myself, as probably the best way to put it. A blog-ish, writeup-ish, rant-ish place to dump personal thoughts and such into for <a href="/~sneexy">myself</a>.</p>
         <span class="seperator"></span>
         <details open class="notebook article-category">
-            <summary><span class="tabler--arrow-autofit-height"></span> test</summary>
+            <summary><span class="icon tabler--arrow-autofit-height"></span> test</summary>
 
             {%- for knowledgebase in collections.knowledgebase %}
                 <div class="article-card">
diff --git a/_includes/layouts/sneexy/page.njk b/_includes/layouts/sneexy/page.njk
index da4ed4e..cff4a28 100644
--- a/_includes/layouts/sneexy/page.njk
+++ b/_includes/layouts/sneexy/page.njk
@@ -7,16 +7,16 @@ permalink: "/~sneexy/"
 <!-- simple introduction -->
 <div id="sneexy" class="window">
     <div class="header">
-        <div class="icon" aria-hidden="true">
-            <span class="tabler--user"></span>
+        <div class="titlebar-icon" aria-hidden="true">
+            <span class="icon tabler--user"></span>
         </div>
         <a href="#sneexy">Sneexy info</a>
         <div class="window-buttons" aria-hidden="true">
-            <span class="tabler--minimize"></span>
-            <span class="tabler--maximize"></span>
+            <span class="icon tabler--minimize"></span>
+            <span class="icon tabler--maximize"></span>
         </div>
         <div class="close-button" aria-hidden="true">
-            <span class="tabler--x"></span>
+            <span class="icon tabler--x"></span>
         </div>
     </div>
 
@@ -32,19 +32,19 @@ permalink: "/~sneexy/"
             <div style="grid-area: pronouns;">
                 <p>Pronouns</p>
                 <ul>
-                    <li style="color: var(--green);"><span class="tabler--thumb-up" alt="Preferred!"></span> he/him</li>
-                    <li style="color: var(--green);"><span class="tabler--thumb-up" alt="Preferred!"></span> it/its</li>
-                    <li><span class="tabler--thumb-up" alt="Acceptable,"></span> they/them</li>
-                    <li style="color: var(--red);"><small><span class="tabler--thumb-down" alt="Unacceptable," style="transform: scale(.9) translateY(.2rem);"></span> anything else</small></li>
+                    <li style="color: var(--green);"><span class="icon tabler--thumb-up" alt="Preferred!"></span> he/him</li>
+                    <li style="color: var(--green);"><span class="icon tabler--thumb-up" alt="Preferred!"></span> it/its</li>
+                    <li><span class="icon tabler--thumb-up" alt="Acceptable,"></span> they/them</li>
+                    <li style="color: var(--red);"><small><span class="icon tabler--thumb-down" alt="Unacceptable," style="transform: scale(.9) translateY(.2rem);"></span> anything else</small></li>
                 </ul>
             </div>
             <div style="grid-area: names;">
                 <p>Names</p>
                 <ul>
-                    <li style="color: var(--green);"><span class="tabler--thumb-up" alt="Preferred!"></span> ruben</li>
-                    <li><span class="tabler--thumb-up" alt="Acceptable,"></span> sneexy, sneex*</li>
-                    <li style="color: var(--yellow);"><small><span class="tabler--user-heart" alt="Only if we're close friends!" style="transform: scale(.9) translateY(.2rem);"></span> rube, rubie (ruby)</small></li>
-                    <li style="color: var(--red);"><small><span class="tabler--thumb-down" alt="Unacceptable," style="transform: scale(.9) translateY(.2rem);"></span> variations/anything else</small></li>
+                    <li style="color: var(--green);"><span class="icon tabler--thumb-up" alt="Preferred!"></span> ruben</li>
+                    <li><span class="icon tabler--thumb-up" alt="Acceptable,"></span> sneexy, sneex*</li>
+                    <li style="color: var(--yellow);"><small><span class="icon tabler--user-heart" alt="Only if we're close friends!" style="transform: scale(.9) translateY(.2rem);"></span> rube, rubie (ruby)</small></li>
+                    <li style="color: var(--red);"><small><span class="icon tabler--thumb-down" alt="Unacceptable," style="transform: scale(.9) translateY(.2rem);"></span> variations/anything else</small></li>
                 </ul>
             </div>
         </div>
@@ -54,27 +54,27 @@ permalink: "/~sneexy/"
 <!-- about me -->
 <div id="about-me" class="window">
     <div class="header">
-        <div class="icon" aria-hidden="true">
-            <span class="tabler--info-circle"></span>
+        <div class="titlebar-icon" aria-hidden="true">
+            <span class="icon tabler--info-circle"></span>
         </div>
         <a href="#about-me">About me</a>
         <div class="window-buttons" aria-hidden="true">
-            <span class="tabler--minimize"></span>
-            <span class="tabler--maximize"></span>
+            <span class="icon tabler--minimize"></span>
+            <span class="icon tabler--maximize"></span>
         </div>
         <div class="close-button" aria-hidden="true">
-            <span class="tabler--x"></span>
+            <span class="icon tabler--x"></span>
         </div>
     </div>
 
     <section>
         <h2><a href="#about-me">about me</a></h2>
         <p>I'm just another <span class="rainbow">gay</span> Synth on the internet, <small>a zoomer, established 2006</small>. I'm autistic and have ADHD, and those two blended together are both a blessing and a curse. I like big round things, as in, bellies and such related content, but I'll try my best to minimize that here and/or content warn such things whenever I do bring them up. Don't worry, the rest of this page is safe for work</p>
-        <p>I sometimes have really bad mental health moments and intense mood swings, so please excuse me in those regards. Thanks. <span class="tabler--heart" style="background-color: var(--accent) !important;"></span></p>
+        <p>I sometimes have really bad mental health moments and intense mood swings, so please excuse me in those regards. Thanks. <span class="icon tabler--heart" style="background-color: var(--accent) !important;"></span></p>
         <p>I consider myself to be a <span style="text-transform: capitalize;">professional computer toucher<span aria-hidden="true">™</span></span>, and try my best to poke at computers or anything related to weird tech that interest me. I would say I've messed enough in a good share of both software and hardware related things. <small>Probably not now that I think about it, but I'm willing to learn more... whenever I can.</small></p>
         <p>I'm a nerd with <a href="https://en.wikipedia.org/wiki/Free_and_open-source_software">Free and Open Source</a> stuff and also caring about my privacy whenever possible <small>considering that it doesn't really seem to exist at all in the modern world, anyways</small>. I also like messing around with Linux, trying a bit of <a style="text-transform: none;" href="https://archlinux.org">Arch</a> and a little bit of <a style="text-transform: none;" href="https://nixos.org">NixOS</a>, but found comfort with <a style="text-transform: none;" href="https://fedoraproject.org">Fedora</a>. <small>If you're interested, I'm currently running my own customized varient of <a style="text-transform: none;" href="https://fedoraproject.org/atomic-desktops/kinoite">Fedora Kinoite</a> made with <a style="text-transform: none;" href="https://blue-build.org">BlueBuild</a> that <a href="https://github.com/sneexy-boi/bluebuild-custom">you can find here</a>.</small> I'm not going to shove these down anyone's throat, and if you're someone who does that, kindly get away from me.</p>
         <p>Despite what is mentioned above, I'm not really a programmer, <span style="text-transform: none;">IT support</span> guy, some professional info-sec person or anything like that. My knowledge is honestly quite limited. At most, I personally mainly know just enough Bash to make jank scripts, HTML and CSS, and a good amount of Linux and Docker/Podman to let me survive. As much as I'd like to learn to expand, I've tried Python before with full intention and motivation of properly learning it to make things and it just didn't stick at all for me, and considering that was with <i>Python</i>, I'm goign to assume my limits in terms of handling things are pretty low.</p>
-        <p>I also run synth.download! The thing you're looking at! Made with love and containers. <span class="tabler--heart" style="background-color: var(--red) !important;"></span></p>
+        <p>I also run synth.download! The thing you're looking at! Made with love and containers. <span class="icon tabler--heart" style="background-color: var(--red) !important;"></span></p>
         <p>I <i>absolutely</i> despise capitalism with every single fiber in my living synthentic body.</span>
         <p>In case it wasn't obvious or clear somehow at this point, I'm a furry. Well, if I consider myself to even fit within that space or if I do want to participate within the "furry" community, but I think I fit into that label enough to be considered one. <small>Being a human fucking <span style="text-transform: none;">SUCKS</span>, although I don't think I fully consider myself "therian" exactly.</small></p>
         <p><span style="text-transform: none;">Certified<span aria-hidden="true">™</span> idiot</span> <small>(although I think this one is obvious)</small></p>
@@ -86,16 +86,16 @@ permalink: "/~sneexy/"
 <!-- socials -->
 <div id="links" class="window">
     <div class="header">
-        <div class="icon" aria-hidden="true">
-            <span class="tabler--link"></span>
+        <div class="titlebar-icon" aria-hidden="true">
+            <span class="icon tabler--link"></span>
         </div>
         <a href="#links">links</a>
         <div class="window-buttons" aria-hidden="true">
-            <span class="tabler--minimize"></span>
-            <span class="tabler--maximize"></span>
+            <span class="icon tabler--minimize"></span>
+            <span class="icon tabler--maximize"></span>
         </div>
         <div class="close-button" aria-hidden="true">
-            <span class="tabler--x"></span>
+            <span class="icon tabler--x"></span>
         </div>
     </div>
 
@@ -103,16 +103,16 @@ permalink: "/~sneexy/"
         <h2><a href="#links">Links</a></h2>
         <p>My links to all of my public facing socials and contacts. If I know you well, you may ask me for anything more private, like Signal or Matrix, etc. <small>The fastest way to get this is by checking my <i>followers only</i> pinned post if you follow me/we're mutuals on the Fediverse.</small></span></p>
         <div class="socials-contacts-list">
-            <a class="fedi-icon" href="https://booping.synth.download/@sneexy" style="background-color: color-mix(in srgb, var(--orange) 25%, transparent); color: var(--orange);" aria-label="Fediverse/Mastodon"><span class="tabler--universe" style="pointer-events: none;"></span></a>
-            <a class="fedi-icon-2" href="https://booping.synth.download/@sneexy" style="background-color: color-mix(in srgb, var(--teal) 25%, transparent); color: var(--teal);" aria-label="Fediverse/Mastodon" aria-hidden="true"><span class="tabler--brand-mastodon" style="pointer-events: none;"></span></a>
-            <a href="mailto:&#x73;&#x6e;&#x65;&#x65;&#x78;&#x79;&#x40;&#x73;&#x79;&#x6e;&#x74;&#x68;&#x2e;&#x64;&#x6f;&#x77;&#x6e;&#x6c;&#x6f;&#x61;&#x64;" style="background-color: color-mix(in srgb, var(--red) 25%, transparent); color: var(--red);" aria-label="Email"><span class="tabler--mail" style="pointer-events: none;"></span></a>
-            <a href="https://listenbrainz.org/user/Sneexy" style="background-color: color-mix(in srgb, var(--sapphire) 25%, transparent); color: var(--sapphire);" aria-label="ListenBraniz"><span class="tabler--brand-metabrainz" style="pointer-events: none;"></span></a>
-            <a href="https://www.last.fm/user/sneexy_is_gay" style="background-color: color-mix(in srgb, var(--red) 25%, transparent); color: var(--red);" aria-label="Last.fm"><span class="tabler--brand-lastfm" style="pointer-events: none;"></span></a>
-            <a href="https://git.gay/sneexy" style="background-color: color-mix(in srgb, var(--maroon) 25%, transparent); color: var(--maroon);" aria-label="Git"><span class="tabler--brand-git" style="pointer-events: none;"></span></a>
-            <a href="https://github.com/sneexy-boi" style="background-color: color-mix(in srgb, var(--lavender) 25%, transparent); color: var(--lavender);" aria-label="GitHub"><span class="tabler--brand-github" style="pointer-events: none;"></span></a>
-            <a href="https://archive.org/details/@sneexy" style="background-color: color-mix(in srgb, var(--foreground) 25%, transparent); color: var(--foreground);" aria-label="Internet Archive"><span class="tabler--building-bank" style="pointer-events: none;"></span></a>
+            <a class="fedi-icon" href="https://booping.synth.download/@sneexy" style="background-color: color-mix(in srgb, var(--orange) 25%, transparent); color: var(--orange);" aria-label="Fediverse/Mastodon"><span class="icon tabler--universe" style="pointer-events: none;"></span></a>
+            <a class="fedi-icon-2" href="https://booping.synth.download/@sneexy" style="background-color: color-mix(in srgb, var(--teal) 25%, transparent); color: var(--teal);" aria-label="Fediverse/Mastodon" aria-hidden="true"><span class="icon tabler--brand-mastodon" style="pointer-events: none;"></span></a>
+            <a href="mailto:&#x73;&#x6e;&#x65;&#x65;&#x78;&#x79;&#x40;&#x73;&#x79;&#x6e;&#x74;&#x68;&#x2e;&#x64;&#x6f;&#x77;&#x6e;&#x6c;&#x6f;&#x61;&#x64;" style="background-color: color-mix(in srgb, var(--red) 25%, transparent); color: var(--red);" aria-label="Email"><span class="icon tabler--mail" style="pointer-events: none;"></span></a>
+            <a href="https://listenbrainz.org/user/Sneexy" style="background-color: color-mix(in srgb, var(--sapphire) 25%, transparent); color: var(--sapphire);" aria-label="ListenBraniz"><span class="icon tabler--brand-metabrainz" style="pointer-events: none;"></span></a>
+            <a href="https://www.last.fm/user/sneexy_is_gay" style="background-color: color-mix(in srgb, var(--red) 25%, transparent); color: var(--red);" aria-label="Last.fm"><span class="icon tabler--brand-lastfm" style="pointer-events: none;"></span></a>
+            <a href="https://git.gay/sneexy" style="background-color: color-mix(in srgb, var(--maroon) 25%, transparent); color: var(--maroon);" aria-label="Git"><span class="icon tabler--brand-git" style="pointer-events: none;"></span></a>
+            <a href="https://github.com/sneexy-boi" style="background-color: color-mix(in srgb, var(--lavender) 25%, transparent); color: var(--lavender);" aria-label="GitHub"><span class="icon tabler--brand-github" style="pointer-events: none;"></span></a>
+            <a href="https://archive.org/details/@sneexy" style="background-color: color-mix(in srgb, var(--foreground) 25%, transparent); color: var(--foreground);" aria-label="Internet Archive"><span class="icon tabler--building-bank" style="pointer-events: none;"></span></a>
         </div>
-        <p><span class="tabler--corner-down-right"></span> You may observe my Fediverse activity below:</p>
+        <p><span class="icon tabler--corner-down-right"></span> You may observe my Fediverse activity below:</p>
         <iframe aria-hidden="true" src="https://booping.synth.download/embed/user-timeline/9zy33jqk7ljg0001?header=false&maxHeight=800&rounded=false&border=false" data-misskey-embed-id="v1_902c0e81-d9d7-4c03-af0e-a6e71c21e95b" loading="lazy" referrerpolicy="strict-origin-when-cross-origin" style="border: none; width: 100%; max-width: 500px; height: 300px; color-scheme: light dark;"></iframe>
     </section>
 </div>
@@ -120,16 +120,16 @@ permalink: "/~sneexy/"
 <!-- buttons -->
 <div id="buttons" class="window home">
     <div class="header">
-        <div class="icon" aria-hidden="true">
-            <span class="tabler--link"></span>
+        <div class="titlebar-icon" aria-hidden="true">
+            <span class="icon tabler--link"></span>
         </div>
         <a href="#buttons">Buttons</a>
         <div class="window-buttons" aria-hidden="true">
-            <span class="tabler--minimize"></span>
-            <span class="tabler--maximize"></span>
+            <span class="icon tabler--minimize"></span>
+            <span class="icon tabler--maximize"></span>
         </div>
         <div class="close-button" aria-hidden="true">
-            <span class="tabler--x"></span>
+            <span class="icon tabler--x"></span>
         </div>
     </div>
 
@@ -245,16 +245,16 @@ permalink: "/~sneexy/"
 <!-- "fun" facts -->
 <div id="fun-facts" class="window">
     <div class="header">
-        <div class="icon" aria-hidden="true">
-            <span class="tabler--mood-empty"></span>
+        <div class="titlebar-icon" aria-hidden="true">
+            <span class="icon tabler--mood-empty"></span>
         </div>
         <a href="#fun-facts">"Fun" facts</a>
         <div class="window-buttons" aria-hidden="true">
-            <span class="tabler--minimize"></span>
-            <span class="tabler--maximize"></span>
+            <span class="icon tabler--minimize"></span>
+            <span class="icon tabler--maximize"></span>
         </div>
         <div class="close-button" aria-hidden="true">
-            <span class="tabler--x"></span>
+            <span class="icon tabler--x"></span>
         </div>
     </div>
 
diff --git a/_includes/layouts/sneexy/ruben/page-ruben.njk b/_includes/layouts/sneexy/ruben/page-ruben.njk
index 28a1186..2da4d5e 100644
--- a/_includes/layouts/sneexy/ruben/page-ruben.njk
+++ b/_includes/layouts/sneexy/ruben/page-ruben.njk
@@ -7,16 +7,16 @@ permalink: "/~sneexy/ruben/"
 <!-- intro -->
 <div id="intro" class="window">
     <div class="header">
-        <div class="icon" aria-hidden="true">
-            <span class="tabler--robot-face"></span>
+        <div class="titlebar-icon" aria-hidden="true">
+            <span class="icon tabler--robot-face"></span>
         </div>
         <a href="#intro">ruben's introduction</a>
         <div class="window-buttons" aria-hidden="true">
-            <span class="tabler--minimize"></span>
-            <span class="tabler--maximize"></span>
+            <span class="icon tabler--minimize"></span>
+            <span class="icon tabler--maximize"></span>
         </div>
         <div class="close-button" aria-hidden="true">
-            <span class="tabler--x"></span>
+            <span class="icon tabler--x"></span>
         </div>
     </div>
 
@@ -47,16 +47,16 @@ permalink: "/~sneexy/ruben/"
 <!-- features -->
 <div id="features" class="window">
     <div class="header">
-        <div class="icon" aria-hidden="true">
-            <span class="tabler--notes"></span>
+        <div class="titlebar-icon" aria-hidden="true">
+            <span class="icon tabler--notes"></span>
         </div>
         <a href="#features">features</a>
         <div class="window-buttons" aria-hidden="true">
-            <span class="tabler--minimize"></span>
-            <span class="tabler--maximize"></span>
+            <span class="icon tabler--minimize"></span>
+            <span class="icon tabler--maximize"></span>
         </div>
         <div class="close-button" aria-hidden="true">
-            <span class="tabler--x"></span>
+            <span class="icon tabler--x"></span>
         </div>
     </div>
 
@@ -109,16 +109,16 @@ permalink: "/~sneexy/ruben/"
 <!-- personality -->
 <div id="personality" class="window">
     <div class="header">
-        <div class="icon" aria-hidden="true">
-            <span class="tabler--mood-look-up"></span>
+        <div class="titlebar-icon" aria-hidden="true">
+            <span class="icon tabler--mood-look-up"></span>
         </div>
         <a href="#personality">personality</a>
         <div class="window-buttons" aria-hidden="true">
-            <span class="tabler--minimize"></span>
-            <span class="tabler--maximize"></span>
+            <span class="icon tabler--minimize"></span>
+            <span class="icon tabler--maximize"></span>
         </div>
         <div class="close-button" aria-hidden="true">
-            <span class="tabler--x"></span>
+            <span class="icon tabler--x"></span>
         </div>
     </div>
 
diff --git a/_includes/styles/base.css b/_includes/styles/base.css
index c3616c8..fc2541a 100644
--- a/_includes/styles/base.css
+++ b/_includes/styles/base.css
@@ -255,7 +255,7 @@ li,
 button {
     font-size: 1.125rem;
 
-    [class^="tabler--"] {
+    .icon {
         transform: scale(1.13);
     }
 }
@@ -619,7 +619,7 @@ html[data-theme="dark"] {
                         text-shadow: unset;
                     }
 
-                    [class^="tabler--"] {
+                    .icon {
                         padding-right: .3em;
                         transition: .2s all;
                     }
@@ -628,7 +628,7 @@ html[data-theme="dark"] {
                 li:hover {
                     transition: .2s all;
 
-                    [class^="tabler--"] {
+                    .icon {
                         transform: scale(2.5) translateX(-.1rem) translateY(.1rem) rotate(15deg);
                         transition: .2s all;
                     }
diff --git a/_includes/styles/icons.css b/_includes/styles/icons.css
index a89dda7..74b2ffd 100644
--- a/_includes/styles/icons.css
+++ b/_includes/styles/icons.css
@@ -7,328 +7,11 @@
 /  ╰─────────────────────────╯
 /  icons - tabler icons done through css, generate via https://icon-sets.iconify.design/tabler */
 
-/* ti-accessible */
-.tabler--accessible {
+.icon {
     display: inline-block;
     width: 1.3rem;
     height: 1.3rem;
     vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M3 12a9 9 0 1 0 18 0a9 9 0 1 0-18 0'/%3E%3Cpath d='m10 16.5l2-3l2 3m-2-3v-2l3-1m-6 0l3 1'/%3E%3Ccircle cx='12' cy='7.5' r='.5' fill='%23000'/%3E%3C/g%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-settings */
-.tabler--settings {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 0 0 2.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 0 0 1.065 2.572c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 0 0-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 0 0-2.572 1.065c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 0 0-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 0 0-1.065-2.572c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 0 0 1.066-2.573c-.94-1.543.826-3.31 2.37-2.37c1 .608 2.296.07 2.572-1.065'/%3E%3Cpath d='M9 12a3 3 0 1 0 6 0a3 3 0 0 0-6 0'/%3E%3C/g%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-grid-dots */
-.tabler--grid-dots {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 5a1 1 0 1 0 2 0a1 1 0 1 0-2 0m7 0a1 1 0 1 0 2 0a1 1 0 1 0-2 0m7 0a1 1 0 1 0 2 0a1 1 0 1 0-2 0M4 12a1 1 0 1 0 2 0a1 1 0 1 0-2 0m7 0a1 1 0 1 0 2 0a1 1 0 1 0-2 0m7 0a1 1 0 1 0 2 0a1 1 0 1 0-2 0M4 19a1 1 0 1 0 2 0a1 1 0 1 0-2 0m7 0a1 1 0 1 0 2 0a1 1 0 1 0-2 0m7 0a1 1 0 1 0 2 0a1 1 0 1 0-2 0'/%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-home */
-.tabler--home {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M5 12H3l9-9l9 9h-2M5 12v7a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2v-7'/%3E%3Cpath d='M9 21v-6a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2v6'/%3E%3C/g%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-user */
-.tabler--user {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M8 7a4 4 0 1 0 8 0a4 4 0 0 0-8 0M6 21v-2a4 4 0 0 1 4-4h4a4 4 0 0 1 4 4v2'/%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-article */
-.tabler--article {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M3 6a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2zm4 2h10M7 12h10M7 16h10'/%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-notebook */
-.tabler--notebook {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M6 4h11a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H6a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1m3 0v18m4-14h2m-2 4h2'/%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-link */
-.tabler--link {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m9 15l6-6m-4-3l.463-.536a5 5 0 0 1 7.071 7.072L18 13m-5 5l-.397.534a5.07 5.07 0 0 1-7.127 0a4.97 4.97 0 0 1 0-7.071L6 11'/%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-bell */
-.tabler--bell {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M10 5a2 2 0 1 1 4 0a7 7 0 0 1 4 6v3a4 4 0 0 0 2 3H4a4 4 0 0 0 2-3v-3a7 7 0 0 1 4-6M9 17v1a3 3 0 0 0 6 0v-1'/%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-volume */
-.tabler--volume {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M15 8a5 5 0 0 1 0 8m2.7-11a9 9 0 0 1 0 14M6 15H4a1 1 0 0 1-1-1v-4a1 1 0 0 1 1-1h2l3.5-4.5A.8.8 0 0 1 11 5v14a.8.8 0 0 1-1.5.5z'/%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-wifi */
-.tabler--wifi {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M12 18h.01m-2.838-2.828a4 4 0 0 1 5.656 0m-8.485-2.829a8 8 0 0 1 11.314 0'/%3E%3Cpath d='M3.515 9.515c4.686-4.687 12.284-4.687 17 0'/%3E%3C/g%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-battery-filled */
-.tabler--battery-filled {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M17 6a3 3 0 0 1 2.995 2.824L20 9v.086l.052.019a1.5 1.5 0 0 1 .941 1.25L21 10.5v3a1.5 1.5 0 0 1-.948 1.395l-.052.018V15a3 3 0 0 1-2.824 2.995L17 18H6a3 3 0 0 1-2.995-2.824L3 15V9a3 3 0 0 1 2.824-2.995L6 6z'/%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-arrow-forward */
-.tabler--arrow-forward {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m15 11l4 4l-4 4m4-4H8a4 4 0 0 1 0-8h1'/%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-arrow-right */
-.tabler--arrow-right {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 12h14m-6 6l6-6m-6-6l6 6'/%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-arrow-left */
-.tabler--arrow-left {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 12h14M5 12l6 6m-6-6l6-6'/%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-palette */
-.tabler--palette {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M12 21a9 9 0 0 1 0-18c4.97 0 9 3.582 9 8c0 1.06-.474 2.078-1.318 2.828S17.693 15 16.5 15H14a2 2 0 0 0-1 3.75A1.3 1.3 0 0 1 12 21'/%3E%3Cpath d='M7.5 10.5a1 1 0 1 0 2 0a1 1 0 1 0-2 0m4-3a1 1 0 1 0 2 0a1 1 0 1 0-2 0m4 3a1 1 0 1 0 2 0a1 1 0 1 0-2 0'/%3E%3C/g%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-brand-tabler */
-.tabler--brand-tabler {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='m8 9l3 3l-3 3m5 0h3'/%3E%3Cpath d='M3 7a4 4 0 0 1 4-4h10a4 4 0 0 1 4 4v10a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4z'/%3E%3C/g%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-text-size */
-.tabler--text-size {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M3 7V5h13v2m-6-2v14m2 0H8m7-6v-1h6v1m-3-1v7m-1 0h2'/%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-letter-case */
-.tabler--letter-case {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M14 15.5a3.5 3.5 0 1 0 7 0a3.5 3.5 0 1 0-7 0M3 19V8.5a3.5 3.5 0 0 1 7 0V19m-7-6h7m11-1v7'/%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-minimize */
-.tabler--minimize {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M15 19v-2a2 2 0 0 1 2-2h2M15 5v2a2 2 0 0 0 2 2h2M5 15h2a2 2 0 0 1 2 2v2M5 9h2a2 2 0 0 0 2-2V5'/%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-maximize */
-.tabler--maximize {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8V6a2 2 0 0 1 2-2h2M4 16v2a2 2 0 0 0 2 2h2m8-16h2a2 2 0 0 1 2 2v2m-4 12h2a2 2 0 0 0 2-2v-2'/%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-  }
-/* ti-x */
-.tabler--x {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M18 6L6 18M6 6l12 12'/%3E%3C/svg%3E");
     background-color: currentColor;
     -webkit-mask-image: var(--svg);
     mask-image: var(--svg);
@@ -338,470 +21,56 @@
     mask-size: 100% 100%;
 }
 
-/* ============== */
-
-/* ti-corner-down-right */
-.tabler--corner-down-right {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M6 6v6a3 3 0 0 0 3 3h10l-4-4m0 8l4-4'/%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-message-chatbot */
-.tabler--message-chatbot {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M18 4a3 3 0 0 1 3 3v8a3 3 0 0 1-3 3h-5l-5 3v-3H6a3 3 0 0 1-3-3V7a3 3 0 0 1 3-3zM9.5 9h.01m4.99 0h.01'/%3E%3Cpath d='M9.5 13a3.5 3.5 0 0 0 5 0'/%3E%3C/g%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-link */
-.tabler--link {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m9 15l6-6m-4-3l.463-.536a5 5 0 0 1 7.071 7.072L18 13m-5 5l-.397.534a5.07 5.07 0 0 1-7.127 0a4.97 4.97 0 0 1 0-7.071L6 11'/%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-info-circle */
-.tabler--info-circle {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M3 12a9 9 0 1 0 18 0a9 9 0 0 0-18 0m9-3h.01'/%3E%3Cpath d='M11 12h1v4h1'/%3E%3C/g%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-mood-empty */
-.tabler--mood-empty {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M3 12a9 9 0 1 0 18 0a9 9 0 1 0-18 0m6-2h.01M15 10h.01M9 15h6'/%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-user-heart */
-.tabler--user-heart {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M8 7a4 4 0 1 0 8 0a4 4 0 0 0-8 0M6 21v-2a4 4 0 0 1 4-4h.5m7.5 7l3.35-3.284a2.143 2.143 0 0 0 .005-3.071a2.24 2.24 0 0 0-3.129-.006l-.224.22l-.223-.22a2.24 2.24 0 0 0-3.128-.006a2.143 2.143 0 0 0-.006 3.071z'/%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-user-plus */
-.tabler--user-plus {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M8 7a4 4 0 1 0 8 0a4 4 0 0 0-8 0m8 12h6m-3-3v6M6 21v-2a4 4 0 0 1 4-4h4'/%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-heart */
-.tabler--heart {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19.5 12.572L12 20l-7.5-7.428A5 5 0 1 1 12 6.006a5 5 0 1 1 7.5 6.572'/%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-thumb-up */
-.tabler--thumb-up {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M7 11v8a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1v-7a1 1 0 0 1 1-1za4 4 0 0 0 4-4V6a2 2 0 0 1 4 0v5h3a2 2 0 0 1 2 2l-1 5a2 3 0 0 1-2 2h-7a3 3 0 0 1-3-3'/%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-thumb-down */
-.tabler--thumb-down {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M7 13V5a1 1 0 0 0-1-1H4a1 1 0 0 0-1 1v7a1 1 0 0 0 1 1za4 4 0 0 1 4 4v1a2 2 0 0 0 4 0v-5h3a2 2 0 0 0 2-2l-1-5a2 3 0 0 0-2-2h-7a3 3 0 0 0-3 3'/%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-universe */
-.tabler--universe {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M7.027 11.477a5 5 0 1 0 5.496-4.45a4.95 4.95 0 0 0-3.088.681'/%3E%3Cpath d='M5.636 5.636a9 9 0 1 0 3.555-2.188'/%3E%3Cpath d='M17 5a1 1 0 1 0 2 0a1 1 0 1 0-2 0m-6 7a1 1 0 1 0 2 0a1 1 0 1 0-2 0m-3 4a1 1 0 1 0 2 0a1 1 0 1 0-2 0'/%3E%3C/g%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-brand-mastodon */
-.tabler--brand-mastodon {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M18.648 15.254C16.832 17.017 12 16.88 12 16.88a18.3 18.3 0 0 1-3.288-.256q1.69 2.977 8.982 2.475c-1.945 2.013-13.598 5.257-13.668-7.636L4 10.309c0-3.036.023-4.115 1.352-5.633C7.023 2.766 12 3.01 12 3.01s4.977-.243 6.648 1.667C19.977 6.195 20 7.274 20 10.31s-.456 4.074-1.352 4.944'/%3E%3Cpath d='M12 11.204V8.278C12 7.02 11.105 6 10 6S8 7.02 8 8.278V13m4-4.722C12 7.02 12.895 6 14 6s2 1.02 2 2.278V13'/%3E%3C/g%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-mail */
-.tabler--mail {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M3 7a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z'/%3E%3Cpath d='m3 7l9 6l9-6'/%3E%3C/g%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-brand-metabrainz */
-.tabler--brand-metabrainz {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M3 7v10l7 4V3zm18 0v10l-7 4V3z'/%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-brand-lastfm */
-.tabler--brand-lastfm {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M20 8c-.83-1-1.388-1-2-1s-2 .271-2 2s1.384 2.233 3 3s2.125 1.812 2 3s-1 2-3 2s-3-1-3.5-2s-1.585-4.78-2.497-6a5 5 0 1 0-1 7'/%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-brand-git */
-.tabler--brand-git {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M15 12a1 1 0 1 0 2 0a1 1 0 1 0-2 0m-4-4a1 1 0 1 0 2 0a1 1 0 1 0-2 0m0 8a1 1 0 1 0 2 0a1 1 0 1 0-2 0m1-1V9m3 2l-2-2m-2-2L9.1 5.1'/%3E%3Cpath d='m13.446 2.6l7.955 7.954a2.045 2.045 0 0 1 0 2.892l-7.955 7.955a2.045 2.045 0 0 1-2.892 0l-7.955-7.955a2.045 2.045 0 0 1 0-2.892l7.955-7.955a2.045 2.045 0 0 1 2.892 0z'/%3E%3C/g%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-brand-github */
-.tabler--brand-github {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M9 19c-4.3 1.4-4.3-2.5-6-3m12 5v-3.5c0-1 .1-1.4-.5-2c2.8-.3 5.5-1.4 5.5-6a4.6 4.6 0 0 0-1.3-3.2a4.2 4.2 0 0 0-.1-3.2s-1.1-.3-3.5 1.3a12.3 12.3 0 0 0-6.2 0C6.5 2.8 5.4 3.1 5.4 3.1a4.2 4.2 0 0 0-.1 3.2A4.6 4.6 0 0 0 4 9.5c0 4.6 2.7 5.7 5.5 6c-.6.6-.6 1.2-.5 2V21'/%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-building-bank */
-.tabler--building-bank {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M3 21h18M3 10h18M5 6l7-3l7 3M4 10v11m16-11v11M8 14v3m4-3v3m4-3v3'/%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-article */
-.tabler--article {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M3 6a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2zm4 2h10M7 12h10M7 16h10'/%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-rss */
-.tabler--rss {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 19a1 1 0 1 0 2 0a1 1 0 1 0-2 0M4 4a16 16 0 0 1 16 16M4 11a9 9 0 0 1 9 9'/%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-robot-face */
-.tabler--robot-face {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M6 5h12a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V7a2 2 0 0 1 2-2'/%3E%3Cpath d='M9 16q1.5 1 3 1c1.5 0 2-.333 3-1M9 7L8 3m7 4l1-4m-7 9v-1m6 1v-1'/%3E%3C/g%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-note */
-.tabler--notes {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2zm4 2h6m-6 4h6m-6 4h4'/%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-mood-look-up */
-.tabler--mood-look-up {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M3 12a9 9 0 1 0 18 0a9 9 0 0 0-18 0m6-4h.01M15 8h.01M11 12h2'/%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-mood-sad-dizzy */
-.tabler--mood-sad-dizzy {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M3 12a9 9 0 1 0 18 0a9 9 0 1 0-18 0'/%3E%3Cpath d='M14.5 16.05a3.5 3.5 0 0 0-5 0M8 9l2 2m0-2l-2 2m6-2l2 2m0-2l-2 2'/%3E%3C/g%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-arrow-autofit-height */
-.tabler--arrow-autofit-height {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M12 20H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h6m6 10v7m0-18v7m-3 8l3 3l3-3M15 6l3-3l3 3'/%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-currency-dollar */
-.tabler--currency-dollar {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M16.7 8A3 3 0 0 0 14 6h-4a3 3 0 0 0 0 6h4a3 3 0 0 1 0 6h-4a3 3 0 0 1-2.7-2M12 3v3m0 12v3'/%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-planet */
-.tabler--planet {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M18.816 13.58c2.292 2.138 3.546 4 3.092 4.9c-.745 1.46-5.783-.259-11.255-3.838c-5.47-3.579-9.304-7.664-8.56-9.123c.464-.91 2.926-.444 5.803.805'/%3E%3Cpath d='M5 12a7 7 0 1 0 14 0a7 7 0 1 0-14 0'/%3E%3C/g%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-help */
-.tabler--help {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M3 12a9 9 0 1 0 18 0a9 9 0 1 0-18 0m9 5v.01'/%3E%3Cpath d='M12 13.5a1.5 1.5 0 0 1 1-1.5a2.6 2.6 0 1 0-3-4'/%3E%3C/g%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-mood-smile */
-.tabler--mood-smile {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M3 12a9 9 0 1 0 18 0a9 9 0 1 0-18 0m6-2h.01M15 10h.01'/%3E%3Cpath d='M9.5 15a3.5 3.5 0 0 0 5 0'/%3E%3C/g%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-login */
-.tabler--login {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M15 8V6a2 2 0 0 0-2-2H6a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h7a2 2 0 0 0 2-2v-2'/%3E%3Cpath d='M21 12H8l3-3m0 6l-3-3'/%3E%3C/g%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
-/* ti-external-link */
-.tabler--external-link {
-    display: inline-block;
-    width: 1.3rem;
-    height: 1.3rem;
-    vertical-align: top;
-    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M12 6H6a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2v-6m-7 1l9-9m-5 0h5v5'/%3E%3C/svg%3E");
-    background-color: currentColor;
-    -webkit-mask-image: var(--svg);
-    mask-image: var(--svg);
-    -webkit-mask-repeat: no-repeat;
-    mask-repeat: no-repeat;
-    -webkit-mask-size: 100% 100%;
-    mask-size: 100% 100%;
-}
\ No newline at end of file
+.tabler--accessible { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M3 12a9 9 0 1 0 18 0a9 9 0 1 0-18 0'/%3E%3Cpath d='m10 16.5l2-3l2 3m-2-3v-2l3-1m-6 0l3 1'/%3E%3Ccircle cx='12' cy='7.5' r='.5' fill='%23000'/%3E%3C/g%3E%3C/svg%3E"); }
+.tabler--arrow-autofit-height { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M12 20H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h6m6 10v7m0-18v7m-3 8l3 3l3-3M15 6l3-3l3 3'/%3E%3C/svg%3E"); }
+.tabler--arrow-forward { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m15 11l4 4l-4 4m4-4H8a4 4 0 0 1 0-8h1'/%3E%3C/svg%3E"); }
+.tabler--arrow-left { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 12h14M5 12l6 6m-6-6l6-6'/%3E%3C/svg%3E"); }
+.tabler--arrow-right { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 12h14m-6 6l6-6m-6-6l6 6'/%3E%3C/svg%3E"); }
+.tabler--article { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M3 6a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2zm4 2h10M7 12h10M7 16h10'/%3E%3C/svg%3E"); }
+.tabler--article { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M3 6a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2zm4 2h10M7 12h10M7 16h10'/%3E%3C/svg%3E"); }
+.tabler--battery-filled { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M17 6a3 3 0 0 1 2.995 2.824L20 9v.086l.052.019a1.5 1.5 0 0 1 .941 1.25L21 10.5v3a1.5 1.5 0 0 1-.948 1.395l-.052.018V15a3 3 0 0 1-2.824 2.995L17 18H6a3 3 0 0 1-2.995-2.824L3 15V9a3 3 0 0 1 2.824-2.995L6 6z'/%3E%3C/svg%3E"); }
+.tabler--bell { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M10 5a2 2 0 1 1 4 0a7 7 0 0 1 4 6v3a4 4 0 0 0 2 3H4a4 4 0 0 0 2-3v-3a7 7 0 0 1 4-6M9 17v1a3 3 0 0 0 6 0v-1'/%3E%3C/svg%3E"); }
+.tabler--brand-git { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M15 12a1 1 0 1 0 2 0a1 1 0 1 0-2 0m-4-4a1 1 0 1 0 2 0a1 1 0 1 0-2 0m0 8a1 1 0 1 0 2 0a1 1 0 1 0-2 0m1-1V9m3 2l-2-2m-2-2L9.1 5.1'/%3E%3Cpath d='m13.446 2.6l7.955 7.954a2.045 2.045 0 0 1 0 2.892l-7.955 7.955a2.045 2.045 0 0 1-2.892 0l-7.955-7.955a2.045 2.045 0 0 1 0-2.892l7.955-7.955a2.045 2.045 0 0 1 2.892 0z'/%3E%3C/g%3E%3C/svg%3E"); }
+.tabler--brand-github { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M9 19c-4.3 1.4-4.3-2.5-6-3m12 5v-3.5c0-1 .1-1.4-.5-2c2.8-.3 5.5-1.4 5.5-6a4.6 4.6 0 0 0-1.3-3.2a4.2 4.2 0 0 0-.1-3.2s-1.1-.3-3.5 1.3a12.3 12.3 0 0 0-6.2 0C6.5 2.8 5.4 3.1 5.4 3.1a4.2 4.2 0 0 0-.1 3.2A4.6 4.6 0 0 0 4 9.5c0 4.6 2.7 5.7 5.5 6c-.6.6-.6 1.2-.5 2V21'/%3E%3C/svg%3E"); }
+.tabler--brand-lastfm { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M20 8c-.83-1-1.388-1-2-1s-2 .271-2 2s1.384 2.233 3 3s2.125 1.812 2 3s-1 2-3 2s-3-1-3.5-2s-1.585-4.78-2.497-6a5 5 0 1 0-1 7'/%3E%3C/svg%3E"); }
+.tabler--brand-mastodon { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M18.648 15.254C16.832 17.017 12 16.88 12 16.88a18.3 18.3 0 0 1-3.288-.256q1.69 2.977 8.982 2.475c-1.945 2.013-13.598 5.257-13.668-7.636L4 10.309c0-3.036.023-4.115 1.352-5.633C7.023 2.766 12 3.01 12 3.01s4.977-.243 6.648 1.667C19.977 6.195 20 7.274 20 10.31s-.456 4.074-1.352 4.944'/%3E%3Cpath d='M12 11.204V8.278C12 7.02 11.105 6 10 6S8 7.02 8 8.278V13m4-4.722C12 7.02 12.895 6 14 6s2 1.02 2 2.278V13'/%3E%3C/g%3E%3C/svg%3E"); }
+.tabler--brand-metabrainz { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M3 7v10l7 4V3zm18 0v10l-7 4V3z'/%3E%3C/svg%3E"); }
+.tabler--brand-tabler { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='m8 9l3 3l-3 3m5 0h3'/%3E%3Cpath d='M3 7a4 4 0 0 1 4-4h10a4 4 0 0 1 4 4v10a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4z'/%3E%3C/g%3E%3C/svg%3E"); }
+.tabler--building-bank { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M3 21h18M3 10h18M5 6l7-3l7 3M4 10v11m16-11v11M8 14v3m4-3v3m4-3v3'/%3E%3C/svg%3E"); }
+.tabler--corner-down-right { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M6 6v6a3 3 0 0 0 3 3h10l-4-4m0 8l4-4'/%3E%3C/svg%3E"); }
+.tabler--currency-dollar { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M16.7 8A3 3 0 0 0 14 6h-4a3 3 0 0 0 0 6h4a3 3 0 0 1 0 6h-4a3 3 0 0 1-2.7-2M12 3v3m0 12v3'/%3E%3C/svg%3E"); }
+.tabler--external-link { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M12 6H6a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2v-6m-7 1l9-9m-5 0h5v5'/%3E%3C/svg%3E"); }
+.tabler--grid-dots { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 5a1 1 0 1 0 2 0a1 1 0 1 0-2 0m7 0a1 1 0 1 0 2 0a1 1 0 1 0-2 0m7 0a1 1 0 1 0 2 0a1 1 0 1 0-2 0M4 12a1 1 0 1 0 2 0a1 1 0 1 0-2 0m7 0a1 1 0 1 0 2 0a1 1 0 1 0-2 0m7 0a1 1 0 1 0 2 0a1 1 0 1 0-2 0M4 19a1 1 0 1 0 2 0a1 1 0 1 0-2 0m7 0a1 1 0 1 0 2 0a1 1 0 1 0-2 0m7 0a1 1 0 1 0 2 0a1 1 0 1 0-2 0'/%3E%3C/svg%3E"); }
+.tabler--heart { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19.5 12.572L12 20l-7.5-7.428A5 5 0 1 1 12 6.006a5 5 0 1 1 7.5 6.572'/%3E%3C/svg%3E"); }
+.tabler--help { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M3 12a9 9 0 1 0 18 0a9 9 0 1 0-18 0m9 5v.01'/%3E%3Cpath d='M12 13.5a1.5 1.5 0 0 1 1-1.5a2.6 2.6 0 1 0-3-4'/%3E%3C/g%3E%3C/svg%3E"); }
+.tabler--home { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M5 12H3l9-9l9 9h-2M5 12v7a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2v-7'/%3E%3Cpath d='M9 21v-6a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2v6'/%3E%3C/g%3E%3C/svg%3E"); }
+.tabler--info-circle { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M3 12a9 9 0 1 0 18 0a9 9 0 0 0-18 0m9-3h.01'/%3E%3Cpath d='M11 12h1v4h1'/%3E%3C/g%3E%3C/svg%3E"); }
+.tabler--letter-case { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M14 15.5a3.5 3.5 0 1 0 7 0a3.5 3.5 0 1 0-7 0M3 19V8.5a3.5 3.5 0 0 1 7 0V19m-7-6h7m11-1v7'/%3E%3C/svg%3E"); }
+.tabler--link { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m9 15l6-6m-4-3l.463-.536a5 5 0 0 1 7.071 7.072L18 13m-5 5l-.397.534a5.07 5.07 0 0 1-7.127 0a4.97 4.97 0 0 1 0-7.071L6 11'/%3E%3C/svg%3E"); }
+.tabler--link { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m9 15l6-6m-4-3l.463-.536a5 5 0 0 1 7.071 7.072L18 13m-5 5l-.397.534a5.07 5.07 0 0 1-7.127 0a4.97 4.97 0 0 1 0-7.071L6 11'/%3E%3C/svg%3E"); }
+.tabler--login { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M15 8V6a2 2 0 0 0-2-2H6a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h7a2 2 0 0 0 2-2v-2'/%3E%3Cpath d='M21 12H8l3-3m0 6l-3-3'/%3E%3C/g%3E%3C/svg%3E");}
+.tabler--mail { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M3 7a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z'/%3E%3Cpath d='m3 7l9 6l9-6'/%3E%3C/g%3E%3C/svg%3E"); }
+.tabler--maximize { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8V6a2 2 0 0 1 2-2h2M4 16v2a2 2 0 0 0 2 2h2m8-16h2a2 2 0 0 1 2 2v2m-4 12h2a2 2 0 0 0 2-2v-2'/%3E%3C/svg%3E"); }
+.tabler--message-chatbot { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M18 4a3 3 0 0 1 3 3v8a3 3 0 0 1-3 3h-5l-5 3v-3H6a3 3 0 0 1-3-3V7a3 3 0 0 1 3-3zM9.5 9h.01m4.99 0h.01'/%3E%3Cpath d='M9.5 13a3.5 3.5 0 0 0 5 0'/%3E%3C/g%3E%3C/svg%3E"); }
+.tabler--minimize { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M15 19v-2a2 2 0 0 1 2-2h2M15 5v2a2 2 0 0 0 2 2h2M5 15h2a2 2 0 0 1 2 2v2M5 9h2a2 2 0 0 0 2-2V5'/%3E%3C/svg%3E"); }
+.tabler--mood-empty { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M3 12a9 9 0 1 0 18 0a9 9 0 1 0-18 0m6-2h.01M15 10h.01M9 15h6'/%3E%3C/svg%3E"); }
+.tabler--mood-look-up { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M3 12a9 9 0 1 0 18 0a9 9 0 0 0-18 0m6-4h.01M15 8h.01M11 12h2'/%3E%3C/svg%3E"); }
+.tabler--mood-sad-dizzy { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M3 12a9 9 0 1 0 18 0a9 9 0 1 0-18 0'/%3E%3Cpath d='M14.5 16.05a3.5 3.5 0 0 0-5 0M8 9l2 2m0-2l-2 2m6-2l2 2m0-2l-2 2'/%3E%3C/g%3E%3C/svg%3E"); }
+.tabler--mood-smile { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M3 12a9 9 0 1 0 18 0a9 9 0 1 0-18 0m6-2h.01M15 10h.01'/%3E%3Cpath d='M9.5 15a3.5 3.5 0 0 0 5 0'/%3E%3C/g%3E%3C/svg%3E"); }
+.tabler--notebook { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M6 4h11a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H6a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1m3 0v18m4-14h2m-2 4h2'/%3E%3C/svg%3E"); }
+.tabler--notes { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2zm4 2h6m-6 4h6m-6 4h4'/%3E%3C/svg%3E"); }
+.tabler--palette { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M12 21a9 9 0 0 1 0-18c4.97 0 9 3.582 9 8c0 1.06-.474 2.078-1.318 2.828S17.693 15 16.5 15H14a2 2 0 0 0-1 3.75A1.3 1.3 0 0 1 12 21'/%3E%3Cpath d='M7.5 10.5a1 1 0 1 0 2 0a1 1 0 1 0-2 0m4-3a1 1 0 1 0 2 0a1 1 0 1 0-2 0m4 3a1 1 0 1 0 2 0a1 1 0 1 0-2 0'/%3E%3C/g%3E%3C/svg%3E"); }
+.tabler--planet { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M18.816 13.58c2.292 2.138 3.546 4 3.092 4.9c-.745 1.46-5.783-.259-11.255-3.838c-5.47-3.579-9.304-7.664-8.56-9.123c.464-.91 2.926-.444 5.803.805'/%3E%3Cpath d='M5 12a7 7 0 1 0 14 0a7 7 0 1 0-14 0'/%3E%3C/g%3E%3C/svg%3E"); }
+.tabler--robot-face { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M6 5h12a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V7a2 2 0 0 1 2-2'/%3E%3Cpath d='M9 16q1.5 1 3 1c1.5 0 2-.333 3-1M9 7L8 3m7 4l1-4m-7 9v-1m6 1v-1'/%3E%3C/g%3E%3C/svg%3E"); }
+.tabler--rss { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 19a1 1 0 1 0 2 0a1 1 0 1 0-2 0M4 4a16 16 0 0 1 16 16M4 11a9 9 0 0 1 9 9'/%3E%3C/svg%3E"); }
+.tabler--settings { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 0 0 2.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 0 0 1.065 2.572c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 0 0-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 0 0-2.572 1.065c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 0 0-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 0 0-1.065-2.572c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 0 0 1.066-2.573c-.94-1.543.826-3.31 2.37-2.37c1 .608 2.296.07 2.572-1.065'/%3E%3Cpath d='M9 12a3 3 0 1 0 6 0a3 3 0 0 0-6 0'/%3E%3C/g%3E%3C/svg%3E"); }
+.tabler--text-size { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M3 7V5h13v2m-6-2v14m2 0H8m7-6v-1h6v1m-3-1v7m-1 0h2'/%3E%3C/svg%3E"); }
+.tabler--thumb-down { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M7 13V5a1 1 0 0 0-1-1H4a1 1 0 0 0-1 1v7a1 1 0 0 0 1 1za4 4 0 0 1 4 4v1a2 2 0 0 0 4 0v-5h3a2 2 0 0 0 2-2l-1-5a2 3 0 0 0-2-2h-7a3 3 0 0 0-3 3'/%3E%3C/svg%3E"); }
+.tabler--thumb-up { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M7 11v8a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1v-7a1 1 0 0 1 1-1za4 4 0 0 0 4-4V6a2 2 0 0 1 4 0v5h3a2 2 0 0 1 2 2l-1 5a2 3 0 0 1-2 2h-7a3 3 0 0 1-3-3'/%3E%3C/svg%3E"); }
+.tabler--universe { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M7.027 11.477a5 5 0 1 0 5.496-4.45a4.95 4.95 0 0 0-3.088.681'/%3E%3Cpath d='M5.636 5.636a9 9 0 1 0 3.555-2.188'/%3E%3Cpath d='M17 5a1 1 0 1 0 2 0a1 1 0 1 0-2 0m-6 7a1 1 0 1 0 2 0a1 1 0 1 0-2 0m-3 4a1 1 0 1 0 2 0a1 1 0 1 0-2 0'/%3E%3C/g%3E%3C/svg%3E"); }
+.tabler--user { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M8 7a4 4 0 1 0 8 0a4 4 0 0 0-8 0M6 21v-2a4 4 0 0 1 4-4h4a4 4 0 0 1 4 4v2'/%3E%3C/svg%3E"); }
+.tabler--user-heart { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M8 7a4 4 0 1 0 8 0a4 4 0 0 0-8 0M6 21v-2a4 4 0 0 1 4-4h.5m7.5 7l3.35-3.284a2.143 2.143 0 0 0 .005-3.071a2.24 2.24 0 0 0-3.129-.006l-.224.22l-.223-.22a2.24 2.24 0 0 0-3.128-.006a2.143 2.143 0 0 0-.006 3.071z'/%3E%3C/svg%3E"); }
+.tabler--user-plus { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M8 7a4 4 0 1 0 8 0a4 4 0 0 0-8 0m8 12h6m-3-3v6M6 21v-2a4 4 0 0 1 4-4h4'/%3E%3C/svg%3E"); }
+.tabler--volume { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M15 8a5 5 0 0 1 0 8m2.7-11a9 9 0 0 1 0 14M6 15H4a1 1 0 0 1-1-1v-4a1 1 0 0 1 1-1h2l3.5-4.5A.8.8 0 0 1 11 5v14a.8.8 0 0 1-1.5.5z'/%3E%3C/svg%3E"); }
+.tabler--wifi { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M12 18h.01m-2.838-2.828a4 4 0 0 1 5.656 0m-8.485-2.829a8 8 0 0 1 11.314 0'/%3E%3Cpath d='M3.515 9.515c4.686-4.687 12.284-4.687 17 0'/%3E%3C/g%3E%3C/svg%3E"); }
+.tabler--x { --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M18 6L6 18M6 6l12 12'/%3E%3C/svg%3E"); }
\ No newline at end of file
diff --git a/_includes/styles/navbar.css b/_includes/styles/navbar.css
index 745c48e..293f1ac 100644
--- a/_includes/styles/navbar.css
+++ b/_includes/styles/navbar.css
@@ -87,7 +87,7 @@
             white-space: nowrap;
         }
 
-        [class^="tabler--"] {
+        .icon {
             transform: scale(1.1);
             transition: all .3s;
         }
@@ -104,7 +104,7 @@
             transition: all .3s;
         }
 
-        [class^="tabler--"] {
+        .icon {
             transform: scale(5) translateY(.9rem) translateX(.4rem) rotate(10deg);
             transition: all .3s;
         }
@@ -174,7 +174,7 @@
             padding: .3rem .5rem !important;
             position: relative;
 
-            [class^="tabler--"] {
+            .icon {
                 padding: 0 .5rem !important;
                 pointer-events: none;
                 transform: translateY(.1rem) scale(1.5);
@@ -183,7 +183,7 @@
         }
 
         label[data-toggle="nav-settings"]:hover {
-            [class^="tabler--"] {
+            .icon {
                 transform: translateY(.1rem) scale(1.5) rotate(360deg);
                 transition: all 1.3s;
             }
diff --git a/_includes/styles/windows.css b/_includes/styles/windows.css
index b591878..d3dd9a5 100644
--- a/_includes/styles/windows.css
+++ b/_includes/styles/windows.css
@@ -17,7 +17,7 @@
         text-align: center;
         vertical-align: middle;
 
-        .icon {
+        .titlebar-icon {
             background: color-mix(in srgb, var(--accent) 40%, transparent);
             padding: .4rem .4rem .2rem 1rem;
             border-right: .2rem solid var(--accent);
@@ -40,7 +40,7 @@
             text-decoration: underline;
         }
 
-        [class^="tabler--"] {
+        .icon {
             transform: scale(1.1);
         }