diff --git a/package-lock.json b/package-lock.json
index 45b57010..24031fad 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -15,11 +15,7 @@
         "@11ty/eleventy-img": "^3.1.8",
         "@11ty/eleventy-plugin-rss": "^1.2.0",
         "@11ty/eleventy-plugin-syntaxhighlight": "^5.0.0",
-        "@catppuccin/tailwindcss": "^0.1.6",
         "@rknightuk/eleventy-plugin-post-graph": "^1.0.4",
-        "@tailwindcss/aspect-ratio": "^0.4.2",
-        "@tailwindcss/line-clamp": "^0.4.4",
-        "@tailwindcss/typography": "^0.5.10",
         "autoprefixer": "^10.4.16",
         "child_process": "^1.0.2",
         "clean-css": "^5.3.3",
@@ -42,8 +38,6 @@
         "sanitize-html": "^2.11.0",
         "slugify": "^1.6.6",
         "striptags": "^3.2.0",
-        "tailwind-scrollbar": "^3.0.5",
-        "tailwindcss": "^3.4.0",
         "writing-stats": "^1.0.6"
       }
     },
@@ -281,18 +275,6 @@
         "url": "https://opencollective.com/11ty"
       }
     },
-    "node_modules/@alloc/quick-lru": {
-      "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/@alloc/quick-lru/-/quick-lru-5.2.0.tgz",
-      "integrity": "sha512-UrcABB+4bUrFABwbluTIBErXwvbsU/V7TZWfmbgJfbkwiBuziS9gxdODUyuiecfdGQ85jglMW6juS3+z5TsKLw==",
-      "dev": true,
-      "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
-      }
-    },
     "node_modules/@babel/helper-string-parser": {
       "version": "7.23.4",
       "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.23.4.tgz",
@@ -337,15 +319,6 @@
         "node": ">=6.9.0"
       }
     },
-    "node_modules/@catppuccin/tailwindcss": {
-      "version": "0.1.6",
-      "resolved": "https://registry.npmjs.org/@catppuccin/tailwindcss/-/tailwindcss-0.1.6.tgz",
-      "integrity": "sha512-V+Y0AwZ5SSyvOVAcDl7Ng30xy+m82OKnEJ+9+kcZZ7lRyXuZrAb2GScdq9XR3v+ggt8qiZ/G4TvaC9cJ88AAXA==",
-      "dev": true,
-      "peerDependencies": {
-        "tailwindcss": ">=3.0.0"
-      }
-    },
     "node_modules/@iarna/toml": {
       "version": "2.2.5",
       "resolved": "https://registry.npmjs.org/@iarna/toml/-/toml-2.2.5.tgz",
@@ -910,39 +883,6 @@
       "integrity": "sha512-+9jVqKhRSpsc591z5vX+X5Yyw+he/HCB4iQ/RYxw35CEPaY1gnsNE43nf9n9AaYjAQrTiI/mOwKUKdUs9vf7Xg==",
       "dev": true
     },
-    "node_modules/@tailwindcss/aspect-ratio": {
-      "version": "0.4.2",
-      "resolved": "https://registry.npmjs.org/@tailwindcss/aspect-ratio/-/aspect-ratio-0.4.2.tgz",
-      "integrity": "sha512-8QPrypskfBa7QIMuKHg2TA7BqES6vhBrDLOv8Unb6FcFyd3TjKbc6lcmb9UPQHxfl24sXoJ41ux/H7qQQvfaSQ==",
-      "dev": true,
-      "peerDependencies": {
-        "tailwindcss": ">=2.0.0 || >=3.0.0 || >=3.0.0-alpha.1"
-      }
-    },
-    "node_modules/@tailwindcss/line-clamp": {
-      "version": "0.4.4",
-      "resolved": "https://registry.npmjs.org/@tailwindcss/line-clamp/-/line-clamp-0.4.4.tgz",
-      "integrity": "sha512-5U6SY5z8N42VtrCrKlsTAA35gy2VSyYtHWCsg1H87NU1SXnEfekTVlrga9fzUDrrHcGi2Lb5KenUWb4lRQT5/g==",
-      "dev": true,
-      "peerDependencies": {
-        "tailwindcss": ">=2.0.0 || >=3.0.0 || >=3.0.0-alpha.1"
-      }
-    },
-    "node_modules/@tailwindcss/typography": {
-      "version": "0.5.10",
-      "resolved": "https://registry.npmjs.org/@tailwindcss/typography/-/typography-0.5.10.tgz",
-      "integrity": "sha512-Pe8BuPJQJd3FfRnm6H0ulKIGoMEQS+Vq01R6M5aCrFB/ccR/shT+0kXLjouGC1gFLm9hopTFN+DMP0pfwRWzPw==",
-      "dev": true,
-      "dependencies": {
-        "lodash.castarray": "^4.4.0",
-        "lodash.isplainobject": "^4.0.6",
-        "lodash.merge": "^4.6.2",
-        "postcss-selector-parser": "6.0.10"
-      },
-      "peerDependencies": {
-        "tailwindcss": ">=3.0.0 || insiders"
-      }
-    },
     "node_modules/@types/cookie": {
       "version": "0.4.1",
       "resolved": "https://registry.npmjs.org/@types/cookie/-/cookie-0.4.1.tgz",
@@ -1102,12 +1042,6 @@
         "node": ">= 8"
       }
     },
-    "node_modules/arg": {
-      "version": "5.0.2",
-      "resolved": "https://registry.npmjs.org/arg/-/arg-5.0.2.tgz",
-      "integrity": "sha512-PYjyFOLKQ9y57JvQ6QLo8dAgNqswh8M1RMJYdQduT6xbWSgK36P/Z/v+p888pM69jMMfS8Xd8F6I1kQ/I9HUGg==",
-      "dev": true
-    },
     "node_modules/argparse": {
       "version": "1.0.10",
       "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.10.tgz",
@@ -1562,15 +1496,6 @@
         "tslib": "^2.0.3"
       }
     },
-    "node_modules/camelcase-css": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/camelcase-css/-/camelcase-css-2.0.1.tgz",
-      "integrity": "sha512-QOSvevhslijgYwRx6Rv7zKdMF8lbRmx+uQGx2+vDc+KI/eBnsy9kit5aj23AgGu3pa4t9AgwbnXWqS+iOY+2aA==",
-      "dev": true,
-      "engines": {
-        "node": ">= 6"
-      }
-    },
     "node_modules/caniuse-lite": {
       "version": "1.0.30001571",
       "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001571.tgz",
@@ -2003,18 +1928,6 @@
         "node": ">= 8"
       }
     },
-    "node_modules/cssesc": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz",
-      "integrity": "sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==",
-      "dev": true,
-      "bin": {
-        "cssesc": "bin/cssesc"
-      },
-      "engines": {
-        "node": ">=4"
-      }
-    },
     "node_modules/cssstyle": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/cssstyle/-/cssstyle-3.0.0.tgz",
@@ -2164,18 +2077,6 @@
         "node": ">= 0.8.0"
       }
     },
-    "node_modules/didyoumean": {
-      "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/didyoumean/-/didyoumean-1.2.2.tgz",
-      "integrity": "sha512-gxtyfqMg7GKyhQmb056K7M3xszy/myH8w+B4RT+QXBQsvAOdc3XymqDDPHx1BgPgsdAA5SIifona89YtRATDzw==",
-      "dev": true
-    },
-    "node_modules/dlv": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/dlv/-/dlv-1.1.3.tgz",
-      "integrity": "sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA==",
-      "dev": true
-    },
     "node_modules/doctypes": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/doctypes/-/doctypes-1.1.0.tgz",
@@ -3881,15 +3782,6 @@
         "node": "*"
       }
     },
-    "node_modules/jiti": {
-      "version": "1.21.0",
-      "resolved": "https://registry.npmjs.org/jiti/-/jiti-1.21.0.tgz",
-      "integrity": "sha512-gFqAIbuKyyso/3G2qhiO2OM6shY6EPP/R0+mkDbyspxKazh8BXDC5FiFsUjlczgdNz/vfra0da2y+aHrusLG/Q==",
-      "dev": true,
-      "bin": {
-        "jiti": "bin/jiti.js"
-      }
-    },
     "node_modules/js-beautify": {
       "version": "1.14.11",
       "resolved": "https://registry.npmjs.org/js-beautify/-/js-beautify-1.14.11.tgz",
@@ -4036,27 +3928,12 @@
         "node": ">=6"
       }
     },
-    "node_modules/lilconfig": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/lilconfig/-/lilconfig-2.1.0.tgz",
-      "integrity": "sha512-utWOt/GHzuUxnLKxB6dk81RoOeoNeHgbrXiuGk4yyF5qlRz+iIVWu56E2fqGHFrXz0QNUhLB/8nKqvRH66JKGQ==",
-      "dev": true,
-      "engines": {
-        "node": ">=10"
-      }
-    },
     "node_modules/limiter": {
       "version": "1.1.5",
       "resolved": "https://registry.npmjs.org/limiter/-/limiter-1.1.5.tgz",
       "integrity": "sha512-FWWMIEOxz3GwUI4Ts/IvgVy6LPvoMPgjMdQ185nN6psJyBJ4yOpzqm695/h5umdLJg2vW3GR5iG11MAkR2AzJA==",
       "dev": true
     },
-    "node_modules/lines-and-columns": {
-      "version": "1.2.4",
-      "resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.2.4.tgz",
-      "integrity": "sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==",
-      "dev": true
-    },
     "node_modules/linkify-it": {
       "version": "5.0.0",
       "resolved": "https://registry.npmjs.org/linkify-it/-/linkify-it-5.0.0.tgz",
@@ -4250,12 +4127,6 @@
       "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
       "dev": true
     },
-    "node_modules/lodash.castarray": {
-      "version": "4.4.0",
-      "resolved": "https://registry.npmjs.org/lodash.castarray/-/lodash.castarray-4.4.0.tgz",
-      "integrity": "sha512-aVx8ztPv7/2ULbArGJ2Y42bG1mEQ5mGjpdvrbJcJFU3TbYybe+QlLS4pst9zV52ymy2in1KpFPiZnAOATxD4+Q==",
-      "dev": true
-    },
     "node_modules/lodash.deburr": {
       "version": "4.1.0",
       "resolved": "https://registry.npmjs.org/lodash.deburr/-/lodash.deburr-4.1.0.tgz",
@@ -4268,18 +4139,6 @@
       "integrity": "sha512-7FGG40uhC8Mm633uKW1r58aElFlBlxCrg9JfSi3P6aYiWmfiWF0PgMd86ZUsxE5GwWPdHoS2+48bwTh2VPkIQA==",
       "dev": true
     },
-    "node_modules/lodash.isplainobject": {
-      "version": "4.0.6",
-      "resolved": "https://registry.npmjs.org/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz",
-      "integrity": "sha512-oSXzaWypCMHkPC3NvBEaPHf0KsA5mvPrOPgQWDsbg8n7orZ290M0BmC/jgRZ4vcJ6DTAhjrsSYgdsW/F+MFOBA==",
-      "dev": true
-    },
-    "node_modules/lodash.merge": {
-      "version": "4.6.2",
-      "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.2.tgz",
-      "integrity": "sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==",
-      "dev": true
-    },
     "node_modules/lower-case": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/lower-case/-/lower-case-2.0.2.tgz",
@@ -4729,23 +4588,6 @@
         "mustache": "bin/mustache"
       }
     },
-    "node_modules/mz": {
-      "version": "2.7.0",
-      "resolved": "https://registry.npmjs.org/mz/-/mz-2.7.0.tgz",
-      "integrity": "sha512-z81GNO7nnYMEhrGh9LeymoE4+Yr0Wn5McHIZMK5cfQCl+NDX08sCZgUc9/6MHni9IWuFLm1Z3HTCXu2z9fN62Q==",
-      "dev": true,
-      "dependencies": {
-        "any-promise": "^1.0.0",
-        "object-assign": "^4.0.1",
-        "thenify-all": "^1.0.0"
-      }
-    },
-    "node_modules/mz/node_modules/any-promise": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/any-promise/-/any-promise-1.3.0.tgz",
-      "integrity": "sha512-7UvmKalWRt1wgjL1RrGxoSJW/0QZFIegpeGvZG9kjp8vrRu55XTHbwnqq2GpXm9uLbcuhxm3IqX9OB4MZR1b2A==",
-      "dev": true
-    },
     "node_modules/nanoid": {
       "version": "3.3.7",
       "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.7.tgz",
@@ -4954,15 +4796,6 @@
         "node": ">=0.10.0"
       }
     },
-    "node_modules/object-hash": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/object-hash/-/object-hash-3.0.0.tgz",
-      "integrity": "sha512-RSn9F68PjH9HqtltsSnqYC1XXoWe9Bju5+213R98cNGttag9q9yAOTzdbsqvIa7aNm5WffBZFpWYr2aWrklWAw==",
-      "dev": true,
-      "engines": {
-        "node": ">= 6"
-      }
-    },
     "node_modules/on-finished": {
       "version": "2.4.1",
       "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.4.1.tgz",
@@ -5181,15 +5014,6 @@
         "node": ">=0.10.0"
       }
     },
-    "node_modules/pirates": {
-      "version": "4.0.6",
-      "resolved": "https://registry.npmjs.org/pirates/-/pirates-4.0.6.tgz",
-      "integrity": "sha512-saLsH7WeYYPiD25LDuLRRY/i+6HaPYr6G1OUlN39otzkSTxKnubR9RTxS3/Kk50s1g2JTgFwWQDQyplC5/SHZg==",
-      "dev": true,
-      "engines": {
-        "node": ">= 6"
-      }
-    },
     "node_modules/please-upgrade-node": {
       "version": "3.2.0",
       "resolved": "https://registry.npmjs.org/please-upgrade-node/-/please-upgrade-node-3.2.0.tgz",
@@ -5250,131 +5074,6 @@
         "node": "^10 || ^12 || >=14"
       }
     },
-    "node_modules/postcss-import": {
-      "version": "15.1.0",
-      "resolved": "https://registry.npmjs.org/postcss-import/-/postcss-import-15.1.0.tgz",
-      "integrity": "sha512-hpr+J05B2FVYUAXHeK1YyI267J/dDDhMU6B6civm8hSY1jYJnBXxzKDKDswzJmtLHryrjhnDjqqp/49t8FALew==",
-      "dev": true,
-      "dependencies": {
-        "postcss-value-parser": "^4.0.0",
-        "read-cache": "^1.0.0",
-        "resolve": "^1.1.7"
-      },
-      "engines": {
-        "node": ">=14.0.0"
-      },
-      "peerDependencies": {
-        "postcss": "^8.0.0"
-      }
-    },
-    "node_modules/postcss-js": {
-      "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/postcss-js/-/postcss-js-4.0.1.tgz",
-      "integrity": "sha512-dDLF8pEO191hJMtlHFPRa8xsizHaM82MLfNkUHdUtVEV3tgTp5oj+8qbEqYM57SLfc74KSbw//4SeJma2LRVIw==",
-      "dev": true,
-      "dependencies": {
-        "camelcase-css": "^2.0.1"
-      },
-      "engines": {
-        "node": "^12 || ^14 || >= 16"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/postcss/"
-      },
-      "peerDependencies": {
-        "postcss": "^8.4.21"
-      }
-    },
-    "node_modules/postcss-load-config": {
-      "version": "4.0.2",
-      "resolved": "https://registry.npmjs.org/postcss-load-config/-/postcss-load-config-4.0.2.tgz",
-      "integrity": "sha512-bSVhyJGL00wMVoPUzAVAnbEoWyqRxkjv64tUl427SKnPrENtq6hJwUojroMz2VB+Q1edmi4IfrAPpami5VVgMQ==",
-      "dev": true,
-      "funding": [
-        {
-          "type": "opencollective",
-          "url": "https://opencollective.com/postcss/"
-        },
-        {
-          "type": "github",
-          "url": "https://github.com/sponsors/ai"
-        }
-      ],
-      "dependencies": {
-        "lilconfig": "^3.0.0",
-        "yaml": "^2.3.4"
-      },
-      "engines": {
-        "node": ">= 14"
-      },
-      "peerDependencies": {
-        "postcss": ">=8.0.9",
-        "ts-node": ">=9.0.0"
-      },
-      "peerDependenciesMeta": {
-        "postcss": {
-          "optional": true
-        },
-        "ts-node": {
-          "optional": true
-        }
-      }
-    },
-    "node_modules/postcss-load-config/node_modules/lilconfig": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/lilconfig/-/lilconfig-3.0.0.tgz",
-      "integrity": "sha512-K2U4W2Ff5ibV7j7ydLr+zLAkIg5JJ4lPn1Ltsdt+Tz/IjQ8buJ55pZAxoP34lqIiwtF9iAvtLv3JGv7CAyAg+g==",
-      "dev": true,
-      "engines": {
-        "node": ">=14"
-      }
-    },
-    "node_modules/postcss-nested": {
-      "version": "6.0.1",
-      "resolved": "https://registry.npmjs.org/postcss-nested/-/postcss-nested-6.0.1.tgz",
-      "integrity": "sha512-mEp4xPMi5bSWiMbsgoPfcP74lsWLHkQbZc3sY+jWYd65CUwXrUaTp0fmNpa01ZcETKlIgUdFN/MpS2xZtqL9dQ==",
-      "dev": true,
-      "dependencies": {
-        "postcss-selector-parser": "^6.0.11"
-      },
-      "engines": {
-        "node": ">=12.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/postcss/"
-      },
-      "peerDependencies": {
-        "postcss": "^8.2.14"
-      }
-    },
-    "node_modules/postcss-nested/node_modules/postcss-selector-parser": {
-      "version": "6.0.13",
-      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.13.tgz",
-      "integrity": "sha512-EaV1Gl4mUEV4ddhDnv/xtj7sxwrwxdetHdWUGnT4VJQf+4d05v6lHYZr8N573k5Z0BViss7BDhfWtKS3+sfAqQ==",
-      "dev": true,
-      "dependencies": {
-        "cssesc": "^3.0.0",
-        "util-deprecate": "^1.0.2"
-      },
-      "engines": {
-        "node": ">=4"
-      }
-    },
-    "node_modules/postcss-selector-parser": {
-      "version": "6.0.10",
-      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.10.tgz",
-      "integrity": "sha512-IQ7TZdoaqbT+LCpShg46jnZVlhWD2w6iQYAcYXfHARZ7X1t/UGhhceQDs5X0cGqKvYlHNOuv7Oa1xmb0oQuA3w==",
-      "dev": true,
-      "dependencies": {
-        "cssesc": "^3.0.0",
-        "util-deprecate": "^1.0.2"
-      },
-      "engines": {
-        "node": ">=4"
-      }
-    },
     "node_modules/postcss-value-parser": {
       "version": "4.2.0",
       "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz",
@@ -5805,15 +5504,6 @@
         "node": ">=0.10.0"
       }
     },
-    "node_modules/read-cache": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz",
-      "integrity": "sha512-Owdv/Ft7IjOgm/i0xvNDZ1LrRANRfew4b2prF3OWMQLxLfu3bS8FVhCsrSCMK4lR56Y9ya+AThoTpDCTxCmpRA==",
-      "dev": true,
-      "dependencies": {
-        "pify": "^2.3.0"
-      }
-    },
     "node_modules/readable-stream": {
       "version": "3.6.2",
       "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.2.tgz",
@@ -6957,79 +6647,6 @@
       "integrity": "sha512-J8bbNyKKXl5qYcR36TIO8W3mVGVHrmmxsd5PAItGkmyzwJvybiw2IVq5nqd0i4LSNSkB/sx9VHllbfFdr9k1JA==",
       "dev": true
     },
-    "node_modules/sucrase": {
-      "version": "3.34.0",
-      "resolved": "https://registry.npmjs.org/sucrase/-/sucrase-3.34.0.tgz",
-      "integrity": "sha512-70/LQEZ07TEcxiU2dz51FKaE6hCTWC6vr7FOk3Gr0U60C3shtAN+H+BFr9XlYe5xqf3RA8nrc+VIwzCfnxuXJw==",
-      "dev": true,
-      "dependencies": {
-        "@jridgewell/gen-mapping": "^0.3.2",
-        "commander": "^4.0.0",
-        "glob": "7.1.6",
-        "lines-and-columns": "^1.1.6",
-        "mz": "^2.7.0",
-        "pirates": "^4.0.1",
-        "ts-interface-checker": "^0.1.9"
-      },
-      "bin": {
-        "sucrase": "bin/sucrase",
-        "sucrase-node": "bin/sucrase-node"
-      },
-      "engines": {
-        "node": ">=8"
-      }
-    },
-    "node_modules/sucrase/node_modules/brace-expansion": {
-      "version": "1.1.11",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
-      "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==",
-      "dev": true,
-      "dependencies": {
-        "balanced-match": "^1.0.0",
-        "concat-map": "0.0.1"
-      }
-    },
-    "node_modules/sucrase/node_modules/commander": {
-      "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/commander/-/commander-4.1.1.tgz",
-      "integrity": "sha512-NOKm8xhkzAjzFx8B2v5OAHT+u5pRQc2UCa2Vq9jYL/31o2wi9mxBA7LIFs3sV5VSC49z6pEhfbMULvShKj26WA==",
-      "dev": true,
-      "engines": {
-        "node": ">= 6"
-      }
-    },
-    "node_modules/sucrase/node_modules/glob": {
-      "version": "7.1.6",
-      "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.6.tgz",
-      "integrity": "sha512-LwaxwyZ72Lk7vZINtNNrywX0ZuLyStrdDtabefZKAY5ZGJhVtgdznluResxNmPitE0SAO+O26sWTHeKSI2wMBA==",
-      "dev": true,
-      "dependencies": {
-        "fs.realpath": "^1.0.0",
-        "inflight": "^1.0.4",
-        "inherits": "2",
-        "minimatch": "^3.0.4",
-        "once": "^1.3.0",
-        "path-is-absolute": "^1.0.0"
-      },
-      "engines": {
-        "node": "*"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
-    "node_modules/sucrase/node_modules/minimatch": {
-      "version": "3.1.2",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz",
-      "integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==",
-      "dev": true,
-      "dependencies": {
-        "brace-expansion": "^1.1.7"
-      },
-      "engines": {
-        "node": "*"
-      }
-    },
     "node_modules/supports-color": {
       "version": "7.2.0",
       "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
@@ -7060,80 +6677,6 @@
       "integrity": "sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw==",
       "dev": true
     },
-    "node_modules/tailwind-scrollbar": {
-      "version": "3.0.5",
-      "resolved": "https://registry.npmjs.org/tailwind-scrollbar/-/tailwind-scrollbar-3.0.5.tgz",
-      "integrity": "sha512-0ZwxTivevqq9BY9fRP9zDjHl7Tu+J5giBGbln+0O1R/7nHtBUKnjQcA1aTIhK7Oyjp6Uc/Dj6/dn8Dq58k5Uww==",
-      "dev": true,
-      "engines": {
-        "node": ">=12.13.0"
-      },
-      "peerDependencies": {
-        "tailwindcss": "3.x"
-      }
-    },
-    "node_modules/tailwindcss": {
-      "version": "3.4.0",
-      "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.4.0.tgz",
-      "integrity": "sha512-VigzymniH77knD1dryXbyxR+ePHihHociZbXnLZHUyzf2MMs2ZVqlUrZ3FvpXP8pno9JzmILt1sZPD19M3IxtA==",
-      "dev": true,
-      "dependencies": {
-        "@alloc/quick-lru": "^5.2.0",
-        "arg": "^5.0.2",
-        "chokidar": "^3.5.3",
-        "didyoumean": "^1.2.2",
-        "dlv": "^1.1.3",
-        "fast-glob": "^3.3.0",
-        "glob-parent": "^6.0.2",
-        "is-glob": "^4.0.3",
-        "jiti": "^1.19.1",
-        "lilconfig": "^2.1.0",
-        "micromatch": "^4.0.5",
-        "normalize-path": "^3.0.0",
-        "object-hash": "^3.0.0",
-        "picocolors": "^1.0.0",
-        "postcss": "^8.4.23",
-        "postcss-import": "^15.1.0",
-        "postcss-js": "^4.0.1",
-        "postcss-load-config": "^4.0.1",
-        "postcss-nested": "^6.0.1",
-        "postcss-selector-parser": "^6.0.11",
-        "resolve": "^1.22.2",
-        "sucrase": "^3.32.0"
-      },
-      "bin": {
-        "tailwind": "lib/cli.js",
-        "tailwindcss": "lib/cli.js"
-      },
-      "engines": {
-        "node": ">=14.0.0"
-      }
-    },
-    "node_modules/tailwindcss/node_modules/glob-parent": {
-      "version": "6.0.2",
-      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-6.0.2.tgz",
-      "integrity": "sha512-XxwI8EOhVQgWp6iDL+3b0r86f4d6AX6zSU55HfB4ydCEuXLXc5FcYeOu+nnGftS4TEju/11rt4KJPTMgbfmv4A==",
-      "dev": true,
-      "dependencies": {
-        "is-glob": "^4.0.3"
-      },
-      "engines": {
-        "node": ">=10.13.0"
-      }
-    },
-    "node_modules/tailwindcss/node_modules/postcss-selector-parser": {
-      "version": "6.0.13",
-      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.13.tgz",
-      "integrity": "sha512-EaV1Gl4mUEV4ddhDnv/xtj7sxwrwxdetHdWUGnT4VJQf+4d05v6lHYZr8N573k5Z0BViss7BDhfWtKS3+sfAqQ==",
-      "dev": true,
-      "dependencies": {
-        "cssesc": "^3.0.0",
-        "util-deprecate": "^1.0.2"
-      },
-      "engines": {
-        "node": ">=4"
-      }
-    },
     "node_modules/tar-fs": {
       "version": "3.0.4",
       "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-3.0.4.tgz",
@@ -7180,33 +6723,6 @@
       "integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==",
       "dev": true
     },
-    "node_modules/thenify": {
-      "version": "3.3.1",
-      "resolved": "https://registry.npmjs.org/thenify/-/thenify-3.3.1.tgz",
-      "integrity": "sha512-RVZSIV5IG10Hk3enotrhvz0T9em6cyHBLkH/YAZuKqd8hRkKhSfCGIcP2KUY0EPxndzANBmNllzWPwak+bheSw==",
-      "dev": true,
-      "dependencies": {
-        "any-promise": "^1.0.0"
-      }
-    },
-    "node_modules/thenify-all": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/thenify-all/-/thenify-all-1.6.0.tgz",
-      "integrity": "sha512-RNxQH/qI8/t3thXJDwcstUO4zeqo64+Uy/+sNVRBx4Xn2OX+OZ9oP+iJnNFqplFra2ZUVeKCSa2oVWi3T4uVmA==",
-      "dev": true,
-      "dependencies": {
-        "thenify": ">= 3.1.0 < 4"
-      },
-      "engines": {
-        "node": ">=0.8"
-      }
-    },
-    "node_modules/thenify/node_modules/any-promise": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/any-promise/-/any-promise-1.3.0.tgz",
-      "integrity": "sha512-7UvmKalWRt1wgjL1RrGxoSJW/0QZFIegpeGvZG9kjp8vrRu55XTHbwnqq2GpXm9uLbcuhxm3IqX9OB4MZR1b2A==",
-      "dev": true
-    },
     "node_modules/to-fast-properties": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-2.0.0.tgz",
@@ -7270,12 +6786,6 @@
         "node": ">=18"
       }
     },
-    "node_modules/ts-interface-checker": {
-      "version": "0.1.13",
-      "resolved": "https://registry.npmjs.org/ts-interface-checker/-/ts-interface-checker-0.1.13.tgz",
-      "integrity": "sha512-Y/arvbn+rrz3JCKl9C4kVNfTfSm2/mEp5FSz5EsZSANGPSlQrpRI5M4PKF+mJnE52jOO90PnPSc3Ur3bTQw0gA==",
-      "dev": true
-    },
     "node_modules/tslib": {
       "version": "2.6.2",
       "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
@@ -7687,15 +7197,6 @@
       "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
       "dev": true
     },
-    "node_modules/yaml": {
-      "version": "2.3.4",
-      "resolved": "https://registry.npmjs.org/yaml/-/yaml-2.3.4.tgz",
-      "integrity": "sha512-8aAvwVUSHpfEqTQ4w/KMlf3HcRdt50E5ODIQJBw1fQ5RL34xabzxtUlzTXVqc4rkZsPbvrXKWnABCD7kWSmocA==",
-      "dev": true,
-      "engines": {
-        "node": ">= 14"
-      }
-    },
     "node_modules/yargs": {
       "version": "17.7.2",
       "resolved": "https://registry.npmjs.org/yargs/-/yargs-17.7.2.tgz",
diff --git a/package.json b/package.json
index 58b4810e..5fa07af2 100644
--- a/package.json
+++ b/package.json
@@ -1,14 +1,14 @@
 {
   "name": "coryd.dev",
-  "version": "3.0.2",
+  "version": "4.0.0",
   "description": "The source for my personal site, blog and portfolio. Built using 11ty and hosted on Netlify.",
   "type": "module",
   "scripts": {
-    "start": "ELEVENTY_PRODUCTION=false eleventy --serve && NODE_ENV=development npx tailwindcss -i ./tailwind.css -o src/assets/styles/tailwind.css && rm -rf .cache",
-    "debug": "DEBUG=Eleventy* npx @11ty/eleventy --serve && NODE_ENV=development npx tailwindcss -i ./tailwind.css -o src/styles/tailwind.css",
+    "start": "ELEVENTY_PRODUCTION=false eleventy --serve",
+    "debug": "DEBUG=Eleventy* npx @11ty/eleventy --serve",
     "lint": "eslint .",
     "lint:fix": "eslint . --fix",
-    "build": "ELEVENTY_PRODUCTION=true eleventy && NODE_ENV=production npx tailwindcss -i ./tailwind.css -c ./tailwind.config.js -o src/styles/tailwind.css --minify"
+    "build": "ELEVENTY_PRODUCTION=true eleventy"
   },
   "keywords": [
     "11ty",
@@ -23,11 +23,7 @@
     "@11ty/eleventy-img": "^3.1.8",
     "@11ty/eleventy-plugin-rss": "^1.2.0",
     "@11ty/eleventy-plugin-syntaxhighlight": "^5.0.0",
-    "@catppuccin/tailwindcss": "^0.1.6",
     "@rknightuk/eleventy-plugin-post-graph": "^1.0.4",
-    "@tailwindcss/aspect-ratio": "^0.4.2",
-    "@tailwindcss/line-clamp": "^0.4.4",
-    "@tailwindcss/typography": "^0.5.10",
     "autoprefixer": "^10.4.16",
     "child_process": "^1.0.2",
     "clean-css": "^5.3.3",
@@ -50,8 +46,6 @@
     "sanitize-html": "^2.11.0",
     "slugify": "^1.6.6",
     "striptags": "^3.2.0",
-    "tailwind-scrollbar": "^3.0.5",
-    "tailwindcss": "^3.4.0",
     "writing-stats": "^1.0.6"
   }
 }
diff --git a/src/_includes/base.liquid b/src/_includes/base.liquid
index cb019671..a518fd27 100644
--- a/src/_includes/base.liquid
+++ b/src/_includes/base.liquid
@@ -1,6 +1,6 @@
 {%- capture fullUrl %}{{ meta.url }}{{ page.url }}{% endcapture -%}
 <!doctype html>
-<html class="scrollbar-thin scrollbar-thumb-blue-600 dark:scrollbar-thumb-blue-400 scrollbar-track-blue-100" lang="en">
+<html lang="en">
   <head>
     <title>{%- if title %}{{ title }} • {% endif -%}{{ meta.siteName }}</title>
     <meta charset="utf-8">
@@ -31,9 +31,11 @@
       type="image/svg+xml">
     <link href="/assets/icons/apple-touch-icon.png?v={% assetHash %}" rel="apple-touch-icon">
     {% capture css %}
-      {% render "../assets/styles/prism.css" %}
+      {% render "../assets/styles/ml.css" %}
       {% render "../assets/styles/silka.css" %}
-      {% render "../assets/styles/tailwind.css" %}
+      {% render "../assets/styles/yt-lite.css" %}
+      {% render "../assets/styles/prism.css" %}
+      {% render "../assets/styles/index.css" %}
     {% endcapture %}
     <style>
       {{ css | cssmin }}
@@ -110,7 +112,7 @@
       </style>
     </noscript>
   </head>
-  <body class="dark:text-white bg-white dark:bg-gray-900 font-sans text-gray-800 scrollbar-thin scrollbar-thumb-blue-600 dark:scrollbar-thumb-blue-400 scrollbar-track-blue-100">
+  <body>
     {{ content }}
     {% capture js %}
       {% render "../assets/scripts/script.js" %}
diff --git a/src/_includes/default.liquid b/src/_includes/default.liquid
index 56bd18c7..1e5f5d1f 100644
--- a/src/_includes/default.liquid
+++ b/src/_includes/default.liquid
@@ -2,6 +2,6 @@
 layout: main
 ---
 {% render "partials/header.liquid", meta: meta, page: page, nav: nav %}
-<div class="pt-8 prose dark:prose-invert hover:prose-a:text-blue-800 dark:hover:prose-a:text-blue-200 max-w-full">
+<div class="default__wrapper">
   {{ content }}
 </div>
\ No newline at end of file
diff --git a/src/_includes/main.liquid b/src/_includes/main.liquid
index 90ab8afd..98eb0ae5 100644
--- a/src/_includes/main.liquid
+++ b/src/_includes/main.liquid
@@ -1,8 +1,8 @@
 ---
 layout: base
 ---
-<div class="min-h-screen flex flex-col">
-  <main class="flex-1 w-10/12 max-w-screen-sm md:max-w-screen-md mx-auto">
+<div class="main__wrapper">
+  <main>
     {{ content }}
   </main>
   {% render "partials/footer.liquid", page: page, nav: nav %}
diff --git a/src/_includes/now.liquid b/src/_includes/now.liquid
index 774dff84..808f2346 100644
--- a/src/_includes/now.liquid
+++ b/src/_includes/now.liquid
@@ -10,6 +10,8 @@ layout: main
 {% render "partials/now/links.liquid", links:links %}
 {% render "partials/now/media-grid.liquid", data:movies, icon: "movie", title: "Movies", shape: "vertical", count: 6 %}
 {% render "partials/now/media-grid.liquid", data:tv, icon: "device-tv", title: "TV", shape: "vertical", count: 6 %}
-<p class="text-xs text-center pt-6">This is a
+<p class="now__explainer text-center">
+  This is a
   <a href="https://nownownow.com/about">now page</a>, and if you have your own site,
-  <a href="https://nownownow.com/about">you should make one too</a>.</p>
+  <a href="https://nownownow.com/about">you should make one too</a>.
+</p>
diff --git a/src/_includes/partials/author.liquid b/src/_includes/partials/author.liquid
index 8bad7de1..e73b3c46 100644
--- a/src/_includes/partials/author.liquid
+++ b/src/_includes/partials/author.liquid
@@ -1,9 +1,9 @@
-<div class="mt-12 pt-12 pb-8 border-t border-gray-200 dark:border-gray-700 flex flex-col md:flex-row justify-between items-center">
-  <div class="flex flex-col mb-4 md:mb-0 md:flex-row items-center flex-1">
-    <div class="border border-blue-600 dark:border-blue-400 bg-white rounded-full overflow-hidden mb-4 md:mb-0 md:mr-4 [&>*]:h-20 [&>*]:w-20 flex flex-col items-center">
-      {% image './src/assets/img/avatar.webp', meta.siteName, 'inline-block' %}
+<div class="author__wrapper">
+  <div class="avatar__wrapper">
+    <div class="avatar__wrapper--interior">
+      {% image './src/assets/img/avatar.webp', meta.siteName, 'author-avatar' %}
     </div>
-    <span class="text-lg font-medium">{{ meta.siteName }}</span>
+    <span>{{ meta.siteName }}</span>
   </div>
-  <p class="text-sm flex-1">{{ meta.siteDescription }}</p>
+  <p class="description__wrapper">{{ meta.siteDescription }}</p>
 </div>
\ No newline at end of file
diff --git a/src/_includes/partials/footer.liquid b/src/_includes/partials/footer.liquid
index 3a3eecab..6be1e090 100644
--- a/src/_includes/partials/footer.liquid
+++ b/src/_includes/partials/footer.liquid
@@ -1,13 +1,13 @@
 <footer>
-  <div class="mt-8 pt-8 pb-4 flex gap-2 md:gap-3 justify-center w-full">
+  <nav class="social__main">
     {% for link in nav.social %}
       {% render "partials/nav/linked-icon.liquid", name: link.name, link: link.url, icon: link.icon %}
     {% endfor %}
-  </div>
-  <div class="flex justify-center text-sm text-gray-500 dark:text-gray-100 pb-8 text-center">
+  </nav>
+  <nav class="links__secondary">
     {% for link in nav.footer %}
       {% render "partials/nav/link.liquid", page: page, link: link.name, icon: link.icon %}
-      {% if not forloop.last %}<span class="mx-1">•</span>{% endif %}
+      {% if not forloop.last %}<span>•</span>{% endif %}
     {% endfor %}
-  </div>
+  </nav>
 </footer>
diff --git a/src/_includes/partials/header.liquid b/src/_includes/partials/header.liquid
index 5e07214f..ba58922b 100644
--- a/src/_includes/partials/header.liquid
+++ b/src/_includes/partials/header.liquid
@@ -1,6 +1,6 @@
-<div class="flex flex-col md:flex-row md:items-center md:justify-between pt-5 md:pt-10">
-  <h1 class="text-2xl md:text-3xl font-black leading-tight pb-5 md:pb-0">
-    <a class="text-gray-700 dark:text-white" href="/">{{ meta.siteName }}</a>
+<div class="main__title">
+  <h1>
+    <a href="/">{{ meta.siteName }}</a>
   </h1>
   {% render "partials/nav/menu.liquid", page: page, nav: nav %}
 </div>
\ No newline at end of file
diff --git a/src/_includes/partials/nav/link.liquid b/src/_includes/partials/nav/link.liquid
index 4b7f546c..939f0a3a 100644
--- a/src/_includes/partials/nav/link.liquid
+++ b/src/_includes/partials/nav/link.liquid
@@ -1,6 +1,6 @@
 {%- capture pageUrl %}/{{ link | downcase }}/{% endcapture -%}
 {% if pageUrl contains page.fileSlug and page.fileSlug %}
-  <span class="cursor-not-allowed active">
+  <span class="active">
     {% if icon %}
       {% tablericon icon link %}
     {% else %}
@@ -8,11 +8,13 @@
     {% endif %}
   </span>
 {% else %}
-  <a class="text-gray-700 hover:text-blue-800 dark:text-white dark:hover:text-blue-200 !no-underline" href="/{{ link | downcase }}">
-    {% if icon %}
+  {% if icon %}
+    <a class="link--icon" href="/{{ link | downcase }}">
       {% tablericon icon link %}
-    {% else %}
+    </a>
+  {% else %}
+    <a href="/{{ link | downcase }}">
       {{ link }}
-    {% endif %}
-  </a>
+    </a>
+  {% endif %}
 {% endif %}
\ No newline at end of file
diff --git a/src/_includes/partials/nav/linked-icon.liquid b/src/_includes/partials/nav/linked-icon.liquid
index 210ff0fa..d75a76cc 100644
--- a/src/_includes/partials/nav/linked-icon.liquid
+++ b/src/_includes/partials/nav/linked-icon.liquid
@@ -1,5 +1,5 @@
 <a
-  class="[&>svg]:h-6 [&>svg]:w-6 link--icon"
+  class="link--icon"
   href="{{ link }}"
   rel="me"
   title="{{ name }}">
diff --git a/src/_includes/partials/nav/menu.liquid b/src/_includes/partials/nav/menu.liquid
index 0c7a4829..eb9df011 100644
--- a/src/_includes/partials/nav/menu.liquid
+++ b/src/_includes/partials/nav/menu.liquid
@@ -1,7 +1,7 @@
 <nav>
-  <ul class="flex">
+  <ul>
     {% for link in nav.menu %}
-      <li{% if not forloop.last %} class="mr-4"{% endif %}>
+      <li>
         {% render "partials/nav/link.liquid", page: page, link: link.name, icon: link.icon %}
       </li>
     {% endfor %}
diff --git a/src/_includes/partials/now/albumReleases.liquid b/src/_includes/partials/now/albumReleases.liquid
index 91d8c47e..fcdbaa91 100644
--- a/src/_includes/partials/now/albumReleases.liquid
+++ b/src/_includes/partials/now/albumReleases.liquid
@@ -1,12 +1,12 @@
 {% if albumReleases.size > 0 %}
-  <h2 class="[&>svg]:h-5 [&>svg]:w-5 [&>svg]:md:h-7 [&>svg]:md:w-7 [&>svg]:-mt-1 [&>svg]:md:-mt-1.5 [&>svg]:inline icon--bold m-0 text-xl font-black leading-tight tracking-normal dark:text-white md:text-2xl mt-8 mb-4">
+  <h2 class="now__section--header">
     {% tablericon "calendar-time" "Anticipated albums" %}
     Anticipated albums
   </h2>
-  <ul class="list-inside list-disc pl-5 md:pl-10">
+  <ul>
     {% for album in albumReleases %}
-      <li class="mt-1.5 mb-2">
-        <span class="font-bold">{{ album.date | readableDate }}: </span>
+      <li>
+        <strong>{{ album.date | readableDate }}: </strong>
         <a href="https://{{album.url}}" title="{{album.title | escape}}">
           {{album.title}}
         </a>
diff --git a/src/_includes/partials/now/links.liquid b/src/_includes/partials/now/links.liquid
index e796dab1..fb2f1e03 100644
--- a/src/_includes/partials/now/links.liquid
+++ b/src/_includes/partials/now/links.liquid
@@ -1,11 +1,11 @@
 {% if links.size > 0 %}
-  <h2 class="[&>svg]:h-5 [&>svg]:w-5 [&>svg]:md:h-7 [&>svg]:md:w-7 [&>svg]:-mt-1 [&>svg]:md:-mt-1.5 [&>svg]:inline icon--bold m-0 text-xl font-black leading-tight tracking-normal dark:text-white md:text-2xl mt-8 mb-4">
+  <h2 class="now__section--header">
     {% tablericon "link" "Links" %}
     Links
   </h2>
-  <ul class="list-inside list-disc pl-5 md:pl-10">
+  <ul>
     {% for link in links limit: 5 %}
-      <li class="mt-1.5 mb-2">
+      <li>
         <a href="{{link.url}}" title="{{link.title | escape}}">
           {{ link.title }}
         </a>
diff --git a/src/_includes/partials/now/media-grid.liquid b/src/_includes/partials/now/media-grid.liquid
index 111d5927..fe3eaff4 100644
--- a/src/_includes/partials/now/media-grid.liquid
+++ b/src/_includes/partials/now/media-grid.liquid
@@ -1,36 +1,36 @@
 {% if data.size > 0 %}
   {% assign media = data | normalizeMedia %}
-  <h2 class="[&>svg]:h-5 [&>svg]:w-5 [&>svg]:md:h-7 [&>svg]:md:w-7 [&>svg]:-mt-1 [&>svg]:md:-mt-1.5 [&>svg]:inline icon--bold m-0 text-xl font-black leading-tight tracking-normal dark:text-white md:text-2xl mt-8 mb-4">
+  <h2 class="now__section--header">
     {% tablericon icon title %}
     {{ title }}
   </h2>
-  <div class="grid gap-2 {% if shape == 'square' %}grid-cols-2 md:grid-cols-4{% else %}grid-cols-3 md:grid-cols-6{% endif %} not-prose">
+  <div class="media__grid {% if shape == 'square' %}square{% else %}vertical{% endif %}">
     {% for item in media limit: count %}
       {% assign alt = item.alt | strip %}
       <a href="{{ item.url | stripUtm }}" title="{{ alt | escape }}">
-        <div class="relative block h-full rounded-lg overflow-hidden"{% if shape != 'square' %} style="max-width:226px"{% endif %}>
-          <div class="absolute left-0 top-0 h-full w-full rounded-lg border border-blue-600 hover:border-blue-800 dark:border-blue-400 dark:hover:border-blue-200 ease-in-out duration-300{% if item.subtext %} bg-cover-gradient{% endif %}"></div>
-          <div class="absolute px-1.5 bottom-2 drop-shadow-md w-full">
+        <div class="item__wrapper"{% if shape != 'square' %} style="max-width:226px"{% endif %}>
+          <div class="item__cover{% if item.subtext %} gradient{% endif %}"></div>
+          <div class="item__meta-text">
             {% if item.title %}
-              <div class="text-xs font-bold text-white line-clamp-2">{{ item.title }}</div>
+              <div class="header">{{ item.title }}</div>
             {% endif %}
             {% if item.percentage %}
               {% render "partials/now/progress-bar.liquid", percentage:item.percentage %}
             {% endif %}
             {% if item.subtext %}
-              <div class="text-xs text-white line-clamp-2">
+              <div class="subheader">
                 {{ item.subtext }}
               </div>
             {% endif %}
           </div>
-          {%- capture loadingStrategy %}
-            {% if loading %}
+          {%- capture loadingStrategy -%}
+            {%- if loading -%}
               {{ loading }}
-            {% else %}
+            {%- else -%}
               'lazy'
-            {% endif %}
-          {% endcapture -%}
-          {% image item.image, alt, 'rounded-lg w-full h-full [&>*]:w-full [&>*]:h-full', loadingStrategy %}
+            {%- endif -%}
+          {%- endcapture -%}
+          {% image item.image, alt, 'item__image', loadingStrategy %}
         </div>
       </a>
     {% endfor %}
diff --git a/src/_includes/partials/now/playing.liquid b/src/_includes/partials/now/playing.liquid
index 073ffd8c..3b51701f 100644
--- a/src/_includes/partials/now/playing.liquid
+++ b/src/_includes/partials/now/playing.liquid
@@ -1,4 +1,4 @@
-<p id="now-playing" class="client-side mb-0 flex flex-row items-start md:items-center">
+<p id="now-playing" class="now-playing client-side">
   <span id="now-playing-loading" class="icon--spin">
     {% tablericon 'loader-2' 'Loading...' %}
   </span>
diff --git a/src/_includes/partials/now/progress-bar.liquid b/src/_includes/partials/now/progress-bar.liquid
index ee546f96..71a85feb 100644
--- a/src/_includes/partials/now/progress-bar.liquid
+++ b/src/_includes/partials/now/progress-bar.liquid
@@ -1,5 +1,5 @@
 {% if percentage %}
-<div class="overflow-hidden h-4 my-1 w-full flex rounded-lg bg-gray-200/60">
-  <div style="width:{{ percentage }}" class="shadow-none flex flex-col whitespace-nowrap justify-center bg-blue-600 dark:bg-blue-400"></div>
+<div class="progress-bar__wrapper">
+  <div style="width:{{ percentage }}" class="progress-bar shadow-none flex flex-col whitespace-nowrap justify-center bg-blue-600 dark:bg-blue-400"></div>
 </div>
 {% endif %}
\ No newline at end of file
diff --git a/src/_includes/partials/now/topper.liquid b/src/_includes/partials/now/topper.liquid
index bedc984b..5d4a27b8 100644
--- a/src/_includes/partials/now/topper.liquid
+++ b/src/_includes/partials/now/topper.liquid
@@ -1,8 +1,6 @@
-<div class="border-b border-gray-200 dark:border-gray-700 mb-8 pb-8">
-  <h2 class="m-0 mb-4 inline">
-    <a class="text-gray-700 dark:text-white text-xl font-black leading-tight tracking-normal md:text-2xl no-underline not-prose" href="/now">
-      Now
-    </a>
+<div class="now__topper">
+  <h2>
+    <a href="/now">Now</a>
   </h2>
   <div class="dark:text-white text-gray-800">
     <p>I'm a software developer in Camarillo, California. I enjoy hanging out with my beautiful family and 4 rescue dogs, technology, automation,
diff --git a/src/_includes/partials/paginator.liquid b/src/_includes/partials/paginator.liquid
index dbf10f44..9c3b8bf0 100644
--- a/src/_includes/partials/paginator.liquid
+++ b/src/_includes/partials/paginator.liquid
@@ -1,13 +1,13 @@
-<nav class="flex justify-between mt-8 items-center">
+<nav class="pagination">
   {% if pagination.href.previous %}
     <a href="{{ pagination.href.previous }}">
-      <button class="py-2 pr-4 dark:text-blue-400 text-blue-600" aria-label="Previous page [&>svg]:h-5 [&>svg]:w-5">
+      <button aria-label="Previous page [&>svg]:h-5 [&>svg]:w-5">
         {% tablericon "arrow-left" "Previous" %}
       </button>
     </a>
   {% else %}
     <button
-      class="py-2 pr-4 cursor-not-allowed disabled:opacity-50 [&>svg]:h-5 [&>svg]:w-5"
+      class="disabled"
       aria-label="Previous page (disabled)"
       disabled>
       {% tablericon "arrow-left" "Prevous" %}
@@ -18,13 +18,13 @@
   </div>
   {% if pagination.href.next %}
     <a href="{{ pagination.href.next }}">
-      <button class="py-2 pl-4 dark:text-blue-400 text-blue-600 [&>svg]:h-5 [&>svg]:w-5" aria-label="Next page">
+      <button aria-label="Next page">
         {% tablericon "arrow-right" "Next" %}
       </button>
     </a>
   {% else %}
     <button
-      class="py-2 pl-4 cursor-not-allowed disabled:opacity-50 [&>svg]:h-5 [&>svg]:w-5"
+      class="disabled"
       aria-label="Next page (disabled)"
       disabled>
       {% tablericon "arrow-right" "Next" %}
diff --git a/src/_includes/partials/popular-posts.liquid b/src/_includes/partials/popular-posts.liquid
index c0afc16a..7ff6f220 100644
--- a/src/_includes/partials/popular-posts.liquid
+++ b/src/_includes/partials/popular-posts.liquid
@@ -1,16 +1,16 @@
 {% assign posts = posts | getPopularPosts: analytics %}
-<div class="not-prose">
-  <h2 class="[&>svg]:h-5 [&>svg]:w-5 [&>svg]:md:h-7 [&>svg]:md:w-7 [&>svg]:inline icon--bold m-0 text-xl flex flex-row items-center font-black leading-tight tracking-normal dark:text-white md:text-2xl mt-8 mb-4">
+<div class="popular-posts">
+  <h2>
     {% tablericon "flame" "Popular" %}
     Popular posts
   </h2>
-  <ul class="list-inside list-disc pl-5 md:pl-10">
+  <ul>
     {% for post in posts limit: 5 %}
-      <li class="mt-1.5 mb-2">
+      <li>
         <a href="{{post.url}}" title="{{ post.data.title | escape}}">
           {{ post.data.title }}
         </a>
       </li>
     {% endfor %}
   </ul>
-</div>
+</div>
\ No newline at end of file
diff --git a/src/_includes/partials/post-tags.liquid b/src/_includes/partials/post-tags.liquid
index 3b09ae61..957ac3d6 100644
--- a/src/_includes/partials/post-tags.liquid
+++ b/src/_includes/partials/post-tags.liquid
@@ -1,11 +1,9 @@
-<div class="mt-8">
-  {% for tag in tags %}
-    {% if tag != "posts" %}
-      <a href="/tags/{{ tag }}">
-        <div
-          class="pill--button pill--button__small"
-          data-pagefind-filter="tags">{{ tag }}</div>
-      </a>
-    {% endif %}
-  {% endfor %}
-</div>
\ No newline at end of file
+{% for tag in tags %}
+  {% if tag != "posts" %}
+    <a href="/tags/{{ tag }}">
+      <div
+        class="pill--button pill--button__small"
+        data-pagefind-filter="tags">{{ tag }}</div>
+    </a>
+  {% endif %}
+{% endfor %}
\ No newline at end of file
diff --git a/src/_includes/partials/webmentions/comments.liquid b/src/_includes/partials/webmentions/comments.liquid
index 4ba11c52..38c766fe 100644
--- a/src/_includes/partials/webmentions/comments.liquid
+++ b/src/_includes/partials/webmentions/comments.liquid
@@ -1,18 +1,18 @@
 {% if mentions['in-reply-to'].size > 0 %}
-  <h2 class="text-lg md:text-xl font-black leading-tight dark:text-white">Comments</h2>
-  <div class="mt-4 mb-4 flex flex-col items-center not-prose">
+  <h2>Comments</h2>
+  <div class="interaction__wrapper comments">
     {% for mention in mentions['in-reply-to'] %}
-      <div class="border-bottom flex flex-row items-center border-gray-100 pb-4 w-full">
-        <div class="group flex flex-row space-between items-center">
+      <div class="comment__wrapper">
+        <div class="comment__wrapper--interior">
           <a href={{mention.url}}>
-            <div class="bg-gray-900 dark:bg-white h-14 w-14 border-4 border-white dark:border-gray-900 transition-all ease-in-out duration-300 group-hover:border-blue-800 dark:group-hover:border-blue-200 rounded-full overflow-hidden">
-                {% image mention.author.photo, mention.author.name %}
+            <div class="avatar__wrapper">
+                {% image mention.author.photo, mention.author.name, 'avatar__wrapper-image' %}
             </div>
           </a>
-          <div class="ml-3">
-            <a class="text-gray-700 dark:text-white" href={{mention.url}}>
-              <p class="text-sm group-hover:text-blue-800 dark:group-hover:text-blue-200">{{ mention.content.text }}</p>
-              <p class="mt-1 text-xs group-hover:text-blue-800 dark:group-hover:text-blue-200">{{ mention.published | isoDateOnly }}</p>
+          <div class="comment">
+            <a href={{mention.url}}>
+              <p>{{ mention.content.text }}</p>
+              <time>{{ mention.published | isoDateOnly }}</time>
             </a>
           </div>
         </div>
diff --git a/src/_includes/partials/webmentions/container.liquid b/src/_includes/partials/webmentions/container.liquid
index 80386206..ef7450f9 100644
--- a/src/_includes/partials/webmentions/container.liquid
+++ b/src/_includes/partials/webmentions/container.liquid
@@ -1,5 +1,5 @@
 {% if webmentions %}
-  <div class="border-t border-gray-200 mt-12 pt-12 dark:border-gray-700">
+  <div class="webmentions__wrapper">
     {% assign mentions = webmentions.mentions | webmentionsByUrl: page.url %}
     {% render "partials/webmentions/interaction.liquid", mentions: mentions, type: 'repost-of' %}
     {% render "partials/webmentions/interaction.liquid", mentions: mentions, type: 'like-of' %}
diff --git a/src/_includes/partials/webmentions/interaction.liquid b/src/_includes/partials/webmentions/interaction.liquid
index 0413ccb0..95966025 100644
--- a/src/_includes/partials/webmentions/interaction.liquid
+++ b/src/_includes/partials/webmentions/interaction.liquid
@@ -6,14 +6,14 @@
   {% endif %}
 {% endcapture -%}
 {% if mentions[type].size > 0 %}
-  <h2 class="text-lg md:text-xl font-black leading-tight dark:text-white">{{ title }}</h2>
-  <div class="flex flex-row items-center mt-4 mb-6">
-    <ul class="ml-3 flex flex-row flex-wrap">
+  <h2>{{ title }}</h2>
+  <div class="interaction__wrapper">
+    <ul>
       {% for mention in mentions[type] %}
-        <li class="-ml-3 inline">
+        <li>
           <a href={{mention.url}}>
-            <div class="bg-gray-900 dark:bg-white h-14 w-14 border-4 border-white dark:border-gray-900 transition-all ease-in-out duration-300 hover:border-blue-800 dark:hover:border-blue-200 rounded-full overflow-hidden">
-              {% image mention.author.photo, mention.author.name %}
+            <div class="avatar__wrapper">
+              {% image mention.author.photo, mention.author.name, 'avatar__wrapper-image' %}
             </div>
           </a>
         </li>
diff --git a/src/_includes/partials/webmentions/links.liquid b/src/_includes/partials/webmentions/links.liquid
index 5d1f85b4..fcd1bac3 100644
--- a/src/_includes/partials/webmentions/links.liquid
+++ b/src/_includes/partials/webmentions/links.liquid
@@ -1,10 +1,10 @@
 {% if mentions['link-to'].size > 0 %}
-  <h2 class="text-lg md:text-xl font-black leading-tight dark:text-white">Links</h2>
-  <div class="mt-2.5 flex flex-col not-prose">
-    <ul class="list-inside list-disc pl-5 md:pl-10">
+  <h2>Links</h2>
+  <div class="interaction__wrapper">
+    <ul>
       {% for mention in mentions['link-to'] %}
-        <li class="mt-1.5 mb-2">
-          <a href="{{ mention.url }}" class="text-blue-600 hover:text-blue-600 dark:text-blue-400 dark:hover:text-blue-200">
+        <li>
+          <a href="{{ mention.url }}">
             {{ mention.name }}
           </a>
         </li>
diff --git a/src/_includes/post.liquid b/src/_includes/post.liquid
index d213f964..e6cf6f3f 100644
--- a/src/_includes/post.liquid
+++ b/src/_includes/post.liquid
@@ -6,18 +6,18 @@ schema: blog
 <article class="h-entry" data-pagefind-body>
   {% if link %}
     <a class="no-underline" href="{{ link }}">
-      <h2 class="[&>svg]:h-5 [&>svg]:w-5 [&>svg]:md:h-7 [&>svg]:md:w-7 [&>svg]:-mt-1 [&>svg]:md:-mt-1.5 [&>svg]:inline icon--bold p-name m-0 text-xl font-black leading-tight tracking-normal hover:text-blue-800 text-gray-800 dark:text-white dark:hover:text-blue-200 md:text-2xl ease-in-out duration-300 pt-8" data-pagefind-meta="title">
+      <h2 data-pagefind-meta="title">
         {% tablericon 'link' title %}
         {{ title }}
       </h2>
     </a>
   {% else %}
-    <h2 class="p-name text-xl md:text-2xl font-black leading-tight dark:text-white pt-8" data-pagefind-meta="title">{{ title }}</h2>
+    <h2 class="p-name" data-pagefind-meta="title">{{ title }}</h2>
   {% endif %}
   <span class="p-author h-card hidden">{{ meta.author }}</span>
-  <time class="mt-2 mb-6 block text-sm dt-published" datetime="{{ date }}">{{ date | readableDate }}</time>
+  <time class="dt-published" datetime="{{ date }}">{{ date | readableDate }}</time>
   <div class="p-summary hidden">{{ post_excerpt | markdown }}</div>
-  <div class="e-content prose dark:prose-invert hover:prose-a:text-blue-800 dark:hover:prose-a:text-blue-200  max-w-full text-gray-800 dark:text-white">
+  <div class="e-content">
     {{ content }}
   </div>
 </article>
diff --git a/src/_includes/webrings/css-joy.liquid b/src/_includes/webrings/css-joy.liquid
index 9f953c8a..8c194528 100644
--- a/src/_includes/webrings/css-joy.liquid
+++ b/src/_includes/webrings/css-joy.liquid
@@ -1,19 +1,16 @@
-<div class="mb-4">
+<div class="webring__wrapper">
   <a class="no-underline" href="https://cs.sjoy.lol">
-    <h3 class="m-0 text-xl font-bold leading-tight tracking-normal dark:text-white md:text-2xl mb-6 text-center">
-      CSS JOY Webring
-    </h3>
+    <h3 class="text-center">CSS JOY Webring</h3>
   </a>
-  <div class="flex flex-row justify-center items-center">
-    <a class="[&>svg]:h-5 [&>svg]:w-5 link--icon" href="https://webri.ng/webring/cssjoy/previous?via=https://coryd.dev/webrings">
+  <div class="webring__centered">
+    <a href="https://webri.ng/webring/cssjoy/previous?via=https://coryd.dev/webrings">
       {% tablericon "arrow-left" "Previous site" %}
     </a>
-    <div class="flex justify-center">
-      <a href="https://webri.ng/webring/cssjoy/random?via=https://coryd.dev/webrings" class="[&>svg]:h-6 [&>svg]:w-6 icon--bold mx-4 flex flex-row items-center font-semibold p-2 rounded-full !no-underline !text-white dark:text-gray-900 bg-blue-600 dark:bg-blue-400 hover:bg-blue-800 dark:hover:bg-blue-200">
-        {% tablericon "dice-3" "Random site" %}
-      </a>
-    </div>
-    <a class="[&>svg]:h-5 [&>svg]:w-5 link--icon" href="https://webri.ng/webring/cssjoy/next?via=https://coryd.dev/webrings">
+    <a class="pill--button" href="https://webri.ng/webring/cssjoy/random?via=https://coryd.dev/webrings">
+      {% tablericon "dice-3" "Random site" %}
+      Random
+    </a>
+    <a href="https://webri.ng/webring/cssjoy/next?via=https://coryd.dev/webrings">
       {% tablericon "arrow-right" "Next site" %}
     </a>
   </div>
diff --git a/src/_includes/webrings/the-claw.liquid b/src/_includes/webrings/the-claw.liquid
index 88f4ea1c..aae8e319 100644
--- a/src/_includes/webrings/the-claw.liquid
+++ b/src/_includes/webrings/the-claw.liquid
@@ -1,17 +1,11 @@
-<div class="mb-4">
-  <div class="w-full flex justify-center">
+<div class="webring__wrapper">
+  <div class="webring__centered">
     {% image './src/assets/img/webrings/theclaw.png', 'The Claw Webring' %}
   </div>
-  <h3 class="m-0 text-xl font-bold leading-tight tracking-normal dark:text-white md:text-2xl mb-6 text-center">
-    The Claw Webring
-  </h3>
-  <div class="flex justify-center">
-    <a href="https://github.com/whitep4nth3r/the-claw-webring" class="flex flex-row items-start md:items-center font-semibold py-2 px-4 rounded-full !no-underline !text-white dark:text-gray-900 bg-blue-600 dark:bg-blue-400 hover:bg-blue-800 dark:hover:bg-blue-200">
-        <span class="[&>svg]:h-5 [&>svg]:w-5 icon--bold pt-1 md:pt-0 mr-1">
-          {% tablericon "user-plus" "Join!" %}
-        </span>
-      <span>Join!</span>
+  <h3 class="text-center">The Claw Webring</h3>
+  <div class="webring__centered">
+    <a href="https://github.com/whitep4nth3r/the-claw-webring" class="pill--button">
+      {% tablericon "user-plus" "Join!" %} Join!
     </a>
   </div>
-</div>
-
+</div>
\ No newline at end of file
diff --git a/src/assets/styles/index.css b/src/assets/styles/index.css
new file mode 100644
index 00000000..8ca13332
--- /dev/null
+++ b/src/assets/styles/index.css
@@ -0,0 +1,1304 @@
+:root {
+  /* colors */
+  --blue-50: #eff5ff;
+  --blue-100: #dbe8fe;
+  --blue-200: #bfd7fe;
+  --blue-300: #93bbfd;
+  --blue-400: #609afa;
+  --blue-500: #3b82f6;
+  --blue-600: #2570eb;
+  --blue-700: #1d64d8;
+  --blue-800: #1e55af;
+  --blue-900: #1e478a;
+  --blue-950: #172e54;
+  --gray-50: #f6f7f8;
+  --gray-100: #eaecef;
+  --gray-200: #d9dee4;
+  --gray-300: #b8c2cc;
+  --gray-400: #a0adba;
+  --gray-500: #8996a8;
+  --gray-600: #778399;
+  --gray-700: #6b748a;
+  --gray-800: #5a6173;
+  --gray-900: #4b515d;
+  --gray-950: #30333b;
+  --white: #fff;
+  --black: #000;
+
+  /* fonts */
+  --font-sans: silka, Inter, Roboto, 'Helvetica Neue', 'Arial Nova', 'Nimbus Sans', Arial, system-ui, sans-serif;
+  --font-mono: ml, ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace;
+
+  /* text */
+  --font-size-xs: .75rem;
+  --line-height-xs: 1rem;
+
+  --font-size-sm: .875rem;
+  --line-height-sm: 1.25rem;
+
+  --font-size-base: 1rem;
+  --line-height-base: 1.5rem;
+
+  --font-size-lg: 1.125rem;
+  --line-height-lg: 1.75rem;
+
+  --font-size-xl: 1.25rem;
+  --line-height-xl: 1.75rem;
+
+  --font-size-2xl: 1.5rem;
+  --line-height-2xl: 2rem;
+
+  --font-size-3xl: 1.875rem;
+  --line-height-3xl: 2.25rem;
+
+  /* radii */
+  --rounded-none: 0;
+  --rounded-sm: .125rem;
+  --rounded: .25rem;
+  --rounded-md: .375rem;
+  --rounded-lg: .5rem;
+  --rounded-full: 9999px;
+
+  /* transitions */
+  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+@keyframes spin {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+body {
+  --pagefind-ui-primary: var(--blue-600);
+  --pagefind-ui-text: var(--black);
+  --pagefind-ui-background: var(--white);
+  --pagefind-ui-border: var(--gray-200);
+  --pagefind-ui-tag: var(--gray-200);
+  --pagefind-ui-border-width: 1px;
+  --pagefind-ui-border-radius: 0;
+  --pagefind-ui-image-border-radius: 0;
+  --pagefind-ui-image-box-ratio: 3 / 2;
+  --pagefind-ui-font: var(--font-sans);
+}
+
+body,
+html {
+  font-size: var(--font-size-base);
+  line-height: var(--line-height-base);
+  font-family: var(--font-sans);
+  color: var(--black);
+  background: var(--white);
+  margin: 0;
+}
+
+body svg,
+html svg {
+  stroke: var(--black);
+}
+
+::-moz-selection {
+  color: var(--white);
+  background: var(--blue-600);
+}
+
+::selection {
+  color: var(--white);
+  background: var(--blue-600);
+}
+
+p {
+  line-height: var(--line-height-lg);
+  margin-top: 1.25rem;
+  margin-bottom: 1.25rem;
+}
+
+blockquote {
+  font-style: italic;
+  margin: 1.25rem 0;
+  padding-left: .875rem;
+  border-left: 4px solid var(--gray-400);
+}
+
+a {
+  color: var(--blue-600);
+  transition-property: color, fill;
+}
+
+a:hover,
+a:focus,
+a:active {
+  color: var(--blue-800);
+}
+
+a > svg {
+  stroke: var(--blue-600);
+  transition-property: stroke;
+}
+
+a > svg:hover,
+a > svg:focus,
+a > svg:active {
+  stroke: var(--blue-800);
+}
+
+strong {
+  font-weight: 700;
+}
+
+/* headers */
+h1, h2, h3, h4, h5, h6 {
+  font-weight: 900;
+}
+
+h1 > svg,
+h2 > svg,
+h3 > svg,
+h4 > svg,
+h5 > svg,
+h6 > svg {
+  margin-right: .25rem;
+  stroke-width: 2 !important;
+}
+
+hr {
+  height: 1px;
+  background-color: var(--gray-200);
+  width: 100%;
+  border: 0;
+}
+
+hr.large__spacing {
+  margin-top: 2.5rem;
+  margin-bottom: 2.5rem;
+}
+
+hr.footnotes-sep {
+  margin-top: 2.5rem;
+  margin-bottom: 2.5rem;
+}
+
+/* layout */
+.main__wrapper {
+  display: flex;
+  flex-direction: column;
+  min-height: 100vh;
+}
+
+main {
+  flex: 1 1 0%;
+  width: 80%;
+  margin-left: auto;
+  margin-right: auto;
+}
+
+.default__wrapper {
+  padding-top: 2rem;
+}
+
+/* header */
+.main__title {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  padding-top: 1.25rem;
+}
+
+.main__title h1 {
+  line-height: 1.25;
+  margin: 0;
+  padding-bottom: .625rem;
+  font-size: var(--font-size-2xl);
+  line-height: var(--line-height-2xl);
+}
+
+article a h2 {
+  line-height: var(--line-height-2xl);
+}
+
+.main__title h1 a,
+.now__topper h2 a,
+article a h2,
+footer .links__secondary a {
+  color: var(--black);
+  stroke: var(--black);
+  text-decoration: none;
+}
+
+.main__title h1 a:hover,
+.main__title h1 a:focus,
+.main__title h1 a:active,
+.now__topper h2 a:hover,
+.now__topper h2 a:focus,
+.now__topper h2 a:active,
+article a h2:hover,
+article a h2:focus,
+article a h2:active,
+footer .links__secondary a:hover,
+footer .links__secondary a:focus,
+footer .links__secondary a:active {
+  color: var(--blue-800);
+}
+
+.now__topper,
+article {
+  border-bottom: 1px solid var(--gray-200);
+  margin-bottom: 2rem;
+  padding-bottom: 2rem;
+}
+
+.now__topper h2 {
+  font-size: var(--font-size-xl);
+  line-height: var(--line-height-xl);
+  display: inline;
+  line-height: 1.25;
+  margin-bottom: 1rem;
+}
+
+/* nav */
+nav ul {
+  display: flex;
+  margin: 0;
+  padding: 0;
+  flex-direction: row;
+  align-items: center;
+  list-style: none;
+}
+
+nav ul li {
+  margin-right: 1rem;
+}
+
+nav ul li a {
+  color: var(--black);
+  text-decoration: none !important;
+}
+
+nav svg {
+  stroke: var(--black);
+  margin-top: .125rem;
+}
+
+nav ul li:last-child {
+  margin-right: 0;
+}
+
+.active,
+.active svg {
+  color: var(--blue-600);
+  stroke: var(--blue-600);
+  cursor: not-allowed;
+}
+
+.link--icon {
+  stroke: var(--black);
+}
+
+.link--icon:hover,
+.link--icon:active,
+.link--icon:focus {
+  stroke: var(--blue-800);
+}
+
+.pagination {
+  justify-content: space-between;
+}
+
+.pagination button {
+  appearance: none;
+  background: none;
+  border: none;
+  cursor: pointer;
+}
+
+.pagination button > svg {
+  stroke: var(--blue-600);
+  transition-property: stroke;
+}
+
+.pagination button > svg:hover,
+.pagination button > svg:focus,
+.pagination button > svg:active {
+  stroke: var(--blue-800);
+}
+
+.pagination button.disabled > svg,
+.pagination button.disabled > svg:hover,
+.pagination button.disabled > svg:focus,
+.pagination button.disabled > svg:active {
+  stroke: var(--black);
+  opacity: .5;
+  cursor: not-allowed;
+}
+
+.pagination .previous {
+  padding-right: 1rem;
+  padding-top: .5rem;
+  padding-bottom: .5rem;
+}
+
+footer .social__main,
+footer .links__secondary {
+  display: flex;
+  flex-direction: row;
+  justify-content: center;
+}
+
+footer .social__main {
+  gap: 0.5rem;
+  margin-top: 2rem;
+  padding-top: 2rem;
+  padding-bottom: 1rem;
+  width: 100%;
+}
+
+footer .social__main svg {
+  margin-top: 0;
+}
+
+footer .social__main a {
+  width: 1.5rem;
+  height: 1.5rem;
+}
+
+footer .links__secondary {
+  font-size: var(--font-size-sm);
+  line-height: var(--line-height-sm);
+  text-align: center;
+  padding-bottom: 2rem;
+}
+
+footer .links__secondary span {
+  margin-left: .375rem;
+  margin-right: .375rem;
+}
+
+.header-anchor {
+  text-decoration: none !important;
+}
+
+h1 > a.header-anchor {
+  font-weight: 900;
+}
+
+h2 > a.header-anchor {
+  font-weight: 700;
+}
+
+.highlight-text {
+  color: var(--white);
+  padding: .125rem;
+  background-color: var(--blue-600);
+}
+
+p > a,
+span > a,
+blockquote > a,
+li > a {
+  text-decoration: underline !important;
+}
+
+code {
+  font-family: var(--font-mono);
+  padding: .125rem;
+  color: var(--white);
+  background-color: var(--black);
+}
+
+/* buttons */
+.pill--button {
+  appearance: none;
+  font-size: var(--font-size-base);
+  line-height: var(--line-height-base);
+  font-weight: 700;
+  border-radius: var(--rounded-full);
+  padding-top: .5rem;
+  padding-bottom: .5rem;
+  padding-left: 1rem;
+  padding-right: 1rem;
+  margin-right: .25rem;
+  margin-bottom: .75rem;
+  border: none;
+  color: var(--white);
+  cursor: pointer;
+  text-decoration: none;
+  background-color: var(--blue-600);
+  transition-property: background-color;
+  display: inline-flex;
+  flex-direction: row;
+  justify-content: center;
+}
+
+.pill--button > svg {
+  stroke: var(--white);
+  margin-right: .25rem;
+  stroke-width: 2 !important;
+}
+
+.pill--button.pill--button__small {
+  padding-top: .25rem;
+  padding-bottom: .25rem;
+  padding-left: .5rem;
+  padding-right: .5rem;
+  margin-right: .5rem;
+  margin-bottom: .5rem;
+  font-size: var(--font-size-sm);
+  line-height: var(--line-height-sm);
+  display: inline-block;
+}
+
+.pill--button:hover,
+.pill--button:active,
+.pill--button:focus {
+  color: var(--white);
+  background-color: var(--blue-800) !important;
+}
+
+/* articles */
+article h2 {
+  margin-bottom: .5rem;
+}
+
+article time {
+  font-size: var(--font-size-sm);
+  line-height: var(--line-height-sm);
+}
+
+article .read-more > svg {
+  height: 1rem;
+  width: 1rem;
+  margin-left: .125rem;
+}
+
+/* search */
+.pagefind-ui__search-input {
+  font-weight: 400 !important;
+  border-radius: var(--rounded-sm);
+  background-color: var(--white);
+  width: 100%;
+  outline: none;
+  border: 1px solid var(--blue-600);
+}
+
+.pagefind-ui__search-input:focus {
+  border: 1px solid var(--blue-800);
+}
+
+.pagefind-ui__form mark {
+  color: var(--white);
+  background: var(--blue-600);
+}
+
+.pagefind-ui__form .pagefind-ui__result-link {
+  color: var(--blue-600);
+}
+
+.pagefind-ui__form .pagefind-ui__result-link:hover,
+.pagefind-ui__form .pagefind-ui__result-link:focus,
+.pagefind-ui__form .pagefind-ui__result-link:active {
+  color: var(--blue-800);
+}
+
+/* statistics */
+.post-graph {
+  margin-top: 1.25rem;
+  margin-bottom: 1.25rem;
+}
+
+.post-graph__wrapper {
+  position: relative;
+  display: flex;
+  align-items: center;
+  height: 2rem;
+  margin-bottom: .375rem;
+}
+
+.post-graph__progress {
+  background-color: var(--blue-600);
+  height: 100%;
+}
+
+.post-graph__year {
+  font-family: var(--font-mono)
+}
+
+.post-graph__progress,
+.post-graph__data {
+  margin-left: .625rem;
+}
+
+/* icons */
+[data-tablericon-name] {
+  stroke-width: 1.4;
+}
+
+.icon--bold > svg {
+  stroke-width: 2;
+}
+
+.icon--spin > svg {
+  animation: spin 1s linear infinite;
+}
+
+.link--icon svg {
+  color: var(--gray-200);
+}
+
+.link--icon:hover svg {
+  color: var(--blue-200);
+}
+
+.link--icon svg,
+.pagination button > svg {
+  transition-property: stroke;
+}
+
+/* lists */
+ul, ol {
+  padding-left: 1.25rem;
+  list-style-position: inside;
+}
+
+.footnotes-list {
+  margin-bottom: 0 !important;
+  padding-left: 0 !important;
+}
+
+.footnotes-list li:last-child {
+  margin-bottom: 0;
+}
+
+.footnote-item > p {
+  display: inline;
+}
+
+ul li,
+ol li {
+  margin-top: .375rem;
+  margin-bottom: .5rem;
+}
+
+/* images */
+.image__banner {
+  overflow: hidden;
+  border: 1px solid var(--blue-600);
+  border-radius: var(--rounded-lg);
+}
+
+.image__banner,
+.image__banner > * {
+  display: block;
+  width: 100%;
+}
+
+.image__banner > * {
+  height: auto;
+}
+
+/* about */
+.avatar__wrapper {
+  justify-content: center;
+  width: 100%;
+  margin-bottom: 1.5rem;
+}
+
+.avatar {
+  width: 16rem;
+  height: 16rem;
+  border: 1px solid var(--blue-600);
+  border-radius: var(--rounded-full);
+  display: flex;
+  justify-content: center;
+  padding: 1rem;
+  background-color: var(--white);
+  overflow: hidden;
+}
+
+.avatar > * {
+  width: 100%;
+  height: 100%;
+}
+
+/* contact */
+.contact__wrapper {
+  display: flex;
+  flex-direction: column;
+}
+
+.contact__wrapper textarea {
+  height: 10rem;
+  resize: none;
+}
+
+.contact__wrapper .column.contact__description {
+  margin-bottom: 1.5rem;
+}
+
+.contact__wrapper .column.contact__description p:first-child {
+  margin-top: 0;
+}
+
+/* now */
+.now__section--header {
+  margin-top: 2rem;
+}
+
+.now__section--text {
+  padding-left: 1rem;
+}
+
+.now__section--text p {
+  margin-top: .25rem;
+  margin-bottom: .25rem;
+}
+
+.now__section--text p > svg {
+  display: inline;
+  vertical-align: middle;
+  height: 1.25rem;
+  width: 1.25rem;
+}
+
+.now__explainer {
+  font-size: var(--font-size-xs);
+  line-height: var(--line-height-xs);
+  padding-top: 1rem;
+}
+
+.media__grid {
+  display: grid;
+  gap: .5rem;
+}
+
+.media__grid.square {
+  grid-template-columns: repeat(2,minmax(0,1fr));
+}
+
+.media__grid.vertical {
+  grid-template-columns: repeat(3,minmax(0,1fr));
+}
+
+.media__grid .item__wrapper {
+  position: relative;
+  overflow: hidden;
+  height: 100%;
+  width: 100%;
+  border: 1px solid var(--blue-600);
+  border-radius: var(--rounded-lg);
+}
+
+.media__grid .item__wrapper:hover {
+  border-color: var(--blue-800)
+}
+
+.media__grid .item__cover {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  border-radius: var(--rounded-sm);
+}
+
+.media__grid .item__cover.gradient {
+  background-image: linear-gradient(180deg,transparent 0,rgba(0,0,0,.15) 70%,rgba(0,0,0,.5));
+}
+
+.media__grid .item__meta-text {
+  position: absolute;
+  padding-left: .375rem;
+  padding-right: .375rem;
+  width: 90%;
+  bottom: .375rem;
+}
+
+.media__grid .item__meta-text .header,
+.media__grid .item__meta-text .subheader {
+  font-size: var(--font-size-xs);
+  line-height: var(--line-height-xs);
+  color: var(--white);
+  overflow: visible;
+  display: -webkit-box;
+  text-shadow: rgba(0, 0, 0, 0.7) 0px 0px 10px;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
+}
+
+.media__grid .item__meta-text .header {
+  font-weight: 700;
+}
+
+.media__grid .item__image,
+.media__grid .item__image > * {
+  width: 100%;
+  height: 100%;
+}
+
+/* 404 */
+.four-oh-four__wrapper .image__banner {
+  margin-bottom: 1.25rem;
+}
+
+.four-oh-four__wrapper a {
+  margin-bottom: 1.25rem;
+}
+
+/* pages */
+.page__header {
+  font-size: var(--font-size-2xl);
+  line-height: var(--line-height-2xl);
+  margin-top: 0;
+}
+
+/* widgets */
+.now-playing {
+  margin-bottom: 0;
+}
+
+.popular-posts h2 {
+  margin-top: 2rem;
+  margin-bottom: 1rem;
+}
+
+.webmentions__wrapper {
+  border-top: 1px solid var(--gray-200);
+  margin-top: 1.5rem;
+  padding-top: 3rem;
+}
+
+.webmentions__wrapper .interaction__wrapper.comments {
+  flex-direction: column;
+}
+
+.webmentions__wrapper .interaction__wrapper {
+  margin-top: 1rem;
+  margin-bottom: 1.5rem;
+}
+
+.webmentions__wrapper .interaction__wrapper .comment__wrapper {
+  width: 100%;
+  padding-bottom: 1rem;
+}
+
+.webmentions__wrapper .interaction__wrapper .comment__wrapper--interior {
+  justify-content: space-between;
+}
+
+.webmentions__wrapper .interaction__wrapper .comment__wrapper--interior .comment {
+  margin-left: .75rem;
+}
+
+.webmentions__wrapper .interaction__wrapper .comment__wrapper--interior .comment a {
+  color: var(--black);
+  text-decoration: none;
+}
+
+.webmentions__wrapper .interaction__wrapper .comment__wrapper--interior .comment p {
+  font-size: var(--font-size-sm);
+  line-height: var(--line-height-sm);
+  margin: 0;
+}
+
+.webmentions__wrapper .interaction__wrapper .comment__wrapper--interior .comment time {
+  font-size: var(--font-size-xs);
+  line-height: var(--line-height-xs);
+  margin-top: .25rem;
+}
+
+.webmentions__wrapper .interaction__wrapper ul {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  margin: 0 0 0 .75rem;
+  padding: 0;
+  list-style: none;
+}
+
+.webmentions__wrapper .interaction__wrapper li {
+  margin-left: -.75rem;
+  height: 3.5rem;
+}
+
+.webmentions__wrapper .interaction__wrapper .avatar__wrapper {
+  background-color: var(--black);
+  width: 3.5rem;
+  height: 3.5rem;
+  margin-bottom: 0;
+  border-radius: var(--rounded-full);
+  overflow: hidden;
+  border: 4px solid var(--white);
+}
+
+.webmentions__wrapper .interaction__wrapper .avatar__wrapper:hover {
+  border-color: var(--blue-800);
+}
+
+.webmentions__wrapper .interaction__wrapper .avatar__wrapper .avatar__wrapper-image > * {
+  width: 100%;
+  height: 100%;
+  border-radius: var(--rounded-full);
+}
+
+.author__wrapper {
+  margin-top: 3rem;
+  padding-top: 3rem;
+  padding-bottom: 2rem;
+  border-top: 1px solid var(--gray-200);
+  justify-content: space-between;
+}
+
+.author__wrapper,
+.author__wrapper > .avatar__wrapper,
+.webmentions__wrapper .interaction__wrapper .avatar__wrapper > picture {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+.author__wrapper > .avatar__wrapper {
+  margin-bottom: 1rem;
+}
+
+.author__wrapper > .avatar__wrapper .avatar__wrapper--interior {
+  border: 1px solid var(--blue-600);
+  border-radius: var(--rounded-full);
+  overflow: hidden;
+  margin-bottom: 1rem;
+  margin-right: 0;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+.author__wrapper > .avatar__wrapper .avatar__wrapper--interior,
+.author__wrapper > .avatar__wrapper .avatar__wrapper--interior .author-avatar > * {
+  width: 5rem;
+  height: 5rem;
+}
+
+.author__wrapper > .avatar__wrapper span {
+  font-size: var(--font-size-lg);
+  line-height: var(--line-height-lg);
+}
+
+.author__wrapper > .avatar__wrapper,
+.author__wrapper > .description__wrapper {
+  flex: 1 1 0%;
+}
+
+.author__wrapper > .description__wrapper {
+  font-size: var(--font-size-sm);
+  line-height: var(--line-height-sm);
+  margin-top: 0;
+}
+
+.progress-bar__wrapper {
+  overflow: hidden;
+  background-color: rgba(217, 222, 228, .6);
+  border-radius: var(--rounded-lg);
+  height: 1rem;
+  width: 100%;
+  margin-top: .25rem;
+  margin-bottom: .25rem;
+  display: flex;
+}
+
+.progress-bar {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  white-space: nowrap;
+  background-color: var(--blue-600);
+}
+
+.webring__wrapper {
+  margin-top: 3rem;
+  margin-bottom: 2.5rem;
+}
+
+.webring__wrapper > .webring__centered {
+  justify-content: center;
+}
+
+/* inputs */
+input[type="text"],
+input[type="email"],
+textarea {
+  color: var(--black);
+  background-color: var(--white);
+  width: 100%;
+  outline: none;
+  border: 1px solid var(--blue-600);
+  padding: .5rem;
+  margin-bottom: 1.5rem;
+  font-size: var(--font-size-base);
+  line-height: var(--line-height-base);
+}
+
+input[type="text"]:focus,
+input[type="email"]:focus,
+textarea:focus {
+  border: 1px solid var(--blue-800);
+}
+
+/* utilities */
+.hidden {
+  display: none;
+}
+
+.no-underline {
+  text-decoration: none !important;
+}
+
+.text-center {
+  text-align: center;
+}
+
+/* flex layout */
+.read-more,
+.pagination,
+article h2,
+.now__section--header,
+.avatar__wrapper,
+.popular-posts h2,
+.webmentions__wrapper .interaction__wrapper,
+.webmentions__wrapper .interaction__wrapper .comment__wrapper,
+.webmentions__wrapper .interaction__wrapper .comment__wrapper--interior,
+.webring__wrapper > .webring__centered {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+}
+
+/* transitions */
+a,
+a > svg,
+.webmentions__wrapper .interaction__wrapper .avatar__wrapper,
+.media__grid .item__wrapper,
+.pagefind-ui__search-input,
+.link--icon svg,
+.pagination button > svg,
+.pill--button,
+input[type="text"],
+input[type="email"],
+textarea {
+  transition-timing-function: var(--ease-in-out);
+  transition-duration: 300ms;
+}
+
+.webmentions__wrapper .interaction__wrapper .avatar__wrapper,
+.media__grid .item__wrapper,
+.pagefind-ui__search-input,
+input[type="text"],
+input[type="email"],
+textarea {
+  transition-property: border-color;
+}
+
+/* screens: small */
+@media screen and (min-width: 640px) {
+  main {
+    max-width: 640px;
+  }
+}
+
+/* screens: md */
+@media screen and (min-width: 768px) {
+  .main__title {
+    flex-direction: row;
+    align-items: center;
+    justify-content: space-between;
+    padding-top: 2.5rem;
+  }
+
+  .main__title h1 {
+    padding-bottom: 0;
+    font-size: var(--font-size-3xl);
+    line-height: var(--line-height-3xl);
+  }
+
+  .now__topper h2 {
+    font-size: var(--font-size-2xl);
+    line-height: var(--line-height-2xl);
+  }
+
+  .avatar {
+    width: 24rem;
+    height: 24rem;
+  }
+
+  main {
+    max-width: 768px;
+  }
+
+  .page__header {
+    font-size: var(--font-size-3xl);
+    line-height: var(--line-height-3xl);
+  }
+
+  /* lists */
+  ul, ol {
+    padding-left: 2.5rem;
+  }
+
+  footer .social__main {
+    gap: .75rem;
+  }
+
+  /* now */
+  .now__section--text {
+    padding-left: 2rem;
+  }
+
+  .media__grid.square {
+    grid-template-columns: repeat(4,minmax(0,1fr));
+  }
+
+  .media__grid.vertical {
+    grid-template-columns: repeat(6,minmax(0,1fr));
+  }
+
+  /* contact */
+  .contact__wrapper {
+    flex-direction: row;
+  }
+
+  .contact__wrapper .column {
+    width: 50%;
+  }
+
+  .contact__wrapper .column.contact__description {
+    padding-right: 1.5rem;
+    margin-bottom: 0;
+  }
+
+  /* widgets */
+  .author__wrapper,
+  .author__wrapper > .avatar__wrapper {
+    flex-direction: row;
+  }
+
+  .author__wrapper > .avatar__wrapper {
+    justify-content: start;
+  }
+
+  .author__wrapper > .avatar__wrapper {
+    margin-bottom: 0;
+  }
+
+  .author__wrapper > .avatar__wrapper .avatar__wrapper--interior {
+    margin-bottom: 0;
+    margin-right: 1rem;
+  }
+}
+
+/* dark theme */
+@media (prefers-color-scheme: dark) {
+  body {
+    --pagefind-ui-primary: var(--blue-400);
+    --pagefind-ui-text: var(--white);
+    --pagefind-ui-background: var(--black);
+    --pagefind-ui-border: var(--gray-900);
+    --pagefind-ui-tag: var(--gray-900);
+  }
+
+  body,
+  html {
+    color: var(--white);
+    background-color: var(--black);
+  }
+
+  body svg,
+  html svg {
+    stroke: var(--white)
+  }
+
+  ::-moz-selection {
+    background: var(--blue-400);
+  }
+
+  ::selection {
+    background: var(--blue-400);
+  }
+
+  .main__title h1 a {
+    color: var(--white);
+  }
+
+  a {
+    color: var(--blue-400);
+    stroke: var(--blue-400);
+  }
+
+  a:hover,
+  a:focus,
+  a:active {
+    color: var(--blue-200);
+  }
+
+  hr {
+    background-color: var(--gray-900);
+  }
+
+  .now__topper,
+  article {
+    border-color: var(--gray-900)
+  }
+
+  .main__title h1 a,
+  .now__topper h2 a,
+  article a h2,
+  footer .links__secondary a {
+    color: var(--white);
+    stroke: var(--white);
+  }
+
+  .main__title h1 a:hover,
+  .main__title h1 a:focus,
+  .main__title h1 a:active,
+  .now__topper h2 a:hover,
+  .now__topper h2 a:focus,
+  .now__topper h2 a:active,
+  article a h2:hover,
+  article a h2:focus,
+  article a h2:active,
+  footer .links__secondary a:hover,
+  footer .links__secondary a:focus,
+  footer .links__secondary a:active {
+    color: var(--blue-200);
+  }
+
+  code {
+    color: var(--black);
+    background-color: var(--white);
+  }
+
+  /* nav */
+  nav ul li a {
+    color: var(--white);
+  }
+
+  .active,
+  .active svg {
+    color: var(--blue-400);
+    stroke: var(--blue-400);
+  }
+
+  .pagination button > svg {
+    stroke: var(--blue-400)
+  }
+
+  .pagination button > svg:hover,
+  .pagination button > svg:focus,
+  .pagination button > svg:active {
+    stroke: var(--blue-200);
+  }
+
+  .pagination button.disabled > svg,
+  .pagination button.disabled > svg:hover,
+  .pagination button.disabled > svg:focus,
+  .pagination button.disabled > svg:active {
+    stroke: var(--white);
+  }
+
+  /* search */
+  .pagefind-ui__search-input {
+    border-color: var(--blue-400);
+    background-color: var(--black);
+  }
+
+  .pagefind-ui__form mark {
+    background: var(--blue-400);
+  }
+
+  .pagefind-ui__form .pagefind-ui__result-link {
+    color: var(--blue-400);
+  }
+
+  .pagefind-ui__form .pagefind-ui__result-link:hover,
+  .pagefind-ui__form .pagefind-ui__result-link:focus,
+  .pagefind-ui__form .pagefind-ui__result-link:active {
+    color: var(--blue-200);
+  }
+
+  /* inputs */
+  input[type="text"],
+  input[type="email"],
+  textarea {
+    color: var(--white);
+    background-color: var(--black);
+  }
+
+  /* buttons */
+  .pill--button {
+    background: var(--blue-400);
+  }
+
+  .pill--button:hover,
+  .pill--button:active,
+  .pill--button:focus {
+    background: var(--blue-200);
+  }
+
+  .link--icon {
+    stroke: var(--white);
+  }
+
+  .link--icon:hover,
+  .link--icon:active,
+  .link--icon:focus {
+    stroke: var(--blue-200);
+  }
+
+  /* now */
+  .media__grid .item__wrapper {
+    border-color: var(--blue-400);
+  }
+
+  .media__grid .item__wrapper:hover {
+    border-color: var(--blue-200)
+  }
+
+  /* images */
+  .image__banner {
+    border: 1px solid var(--blue-400);
+  }
+
+  .post-graph__progress {
+    background-color: var(--blue-400);
+  }
+
+  /* widgets */
+  .author__wrapper {
+    border-color: var(--gray-900)
+  }
+
+  .webmentions__wrapper {
+    border-color: var(--gray-900);
+  }
+
+  .webmentions__wrapper .interaction__wrapper .avatar__wrapper {
+    background-color: var(--white);
+    border-color: var(--black);
+  }
+
+  .webmentions__wrapper .interaction__wrapper .avatar__wrapper:hover {
+    border-color: var(--blue-200);
+  }
+
+  .webmentions__wrapper .interaction__wrapper .comment__wrapper--interior .comment a {
+    color: var(--white);
+  }
+
+  .progress-bar {
+    background-color: var(--blue-400);
+  }
+
+  /* utilities */
+  .highlight-text {
+    background-color: var(--blue-400);
+  }
+}
diff --git a/src/assets/styles/ml.css b/src/assets/styles/ml.css
new file mode 100644
index 00000000..1aa0648b
--- /dev/null
+++ b/src/assets/styles/ml.css
@@ -0,0 +1,7 @@
+@font-face {
+  src: url(data:font/woff2;base64,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) format("woff2");
+  font-family: ml;
+  font-weight: 100 900;
+  font-style: normal;
+  unicode-range: U+0020-007F;
+}
\ No newline at end of file
diff --git a/src/assets/styles/prism.css b/src/assets/styles/prism.css
index 8749e24f..273840eb 100644
--- a/src/assets/styles/prism.css
+++ b/src/assets/styles/prism.css
@@ -6,7 +6,7 @@ pre[class*='language-'] {
   color: #d9e0ee;
   background: none;
   text-shadow: 0 1px rgba(0, 0, 0, 0.3);
-  font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace;
+  font-family: ml, ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace;
   text-align: left;
   white-space: pre;
   word-spacing: normal;
diff --git a/src/assets/styles/tailwind.css b/src/assets/styles/tailwind.css
deleted file mode 100644
index feba09e5..00000000
--- a/src/assets/styles/tailwind.css
+++ /dev/null
@@ -1,2710 +0,0 @@
-/*
-! tailwindcss v3.4.0 | MIT License | https://tailwindcss.com
-*/
-
-/*
-1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
-2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
-*/
-
-*,
-::before,
-::after {
-  box-sizing: border-box;
-  /* 1 */
-  border-width: 0;
-  /* 2 */
-  border-style: solid;
-  /* 2 */
-  border-color: #e5e7eb;
-  /* 2 */
-}
-
-::before,
-::after {
-  --tw-content: '';
-}
-
-/*
-1. Use a consistent sensible line-height in all browsers.
-2. Prevent adjustments of font size after orientation changes in iOS.
-3. Use a more readable tab size.
-4. Use the user's configured `sans` font-family by default.
-5. Use the user's configured `sans` font-feature-settings by default.
-6. Use the user's configured `sans` font-variation-settings by default.
-7. Disable tap highlights on iOS
-*/
-
-html,
-:host {
-  line-height: 1.5;
-  /* 1 */
-  -webkit-text-size-adjust: 100%;
-  /* 2 */
-  -moz-tab-size: 4;
-  /* 3 */
-  -o-tab-size: 4;
-     tab-size: 4;
-  /* 3 */
-  font-family: silka, Inter, Roboto, Helvetica Neue, Arial Nova, Nimbus Sans, Arial, system-ui, sans-serif;
-  /* 4 */
-  font-feature-settings: normal;
-  /* 5 */
-  font-variation-settings: normal;
-  /* 6 */
-  -webkit-tap-highlight-color: transparent;
-  /* 7 */
-}
-
-/*
-1. Remove the margin in all browsers.
-2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
-*/
-
-body {
-  margin: 0;
-  /* 1 */
-  line-height: inherit;
-  /* 2 */
-}
-
-/*
-1. Add the correct height in Firefox.
-2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
-3. Ensure horizontal rules are visible by default.
-*/
-
-hr {
-  height: 0;
-  /* 1 */
-  color: inherit;
-  /* 2 */
-  border-top-width: 1px;
-  /* 3 */
-}
-
-/*
-Add the correct text decoration in Chrome, Edge, and Safari.
-*/
-
-abbr:where([title]) {
-  -webkit-text-decoration: underline dotted;
-          text-decoration: underline dotted;
-}
-
-/*
-Remove the default font size and weight for headings.
-*/
-
-h1,
-h2,
-h3,
-h4,
-h5,
-h6 {
-  font-size: inherit;
-  font-weight: inherit;
-}
-
-/*
-Reset links to optimize for opt-in styling instead of opt-out.
-*/
-
-a {
-  color: inherit;
-  text-decoration: inherit;
-}
-
-/*
-Add the correct font weight in Edge and Safari.
-*/
-
-b,
-strong {
-  font-weight: bolder;
-}
-
-/*
-1. Use the user's configured `mono` font-family by default.
-2. Use the user's configured `mono` font-feature-settings by default.
-3. Use the user's configured `mono` font-variation-settings by default.
-4. Correct the odd `em` font sizing in all browsers.
-*/
-
-code,
-kbd,
-samp,
-pre {
-  font-family: ui-monospace, Cascadia Code, Source Code Pro, Menlo, Consolas, DejaVu Sans Mono, monospace;
-  /* 1 */
-  font-feature-settings: normal;
-  /* 2 */
-  font-variation-settings: normal;
-  /* 3 */
-  font-size: 1em;
-  /* 4 */
-}
-
-/*
-Add the correct font size in all browsers.
-*/
-
-small {
-  font-size: 80%;
-}
-
-/*
-Prevent `sub` and `sup` elements from affecting the line height in all browsers.
-*/
-
-sub,
-sup {
-  font-size: 75%;
-  line-height: 0;
-  position: relative;
-  vertical-align: baseline;
-}
-
-sub {
-  bottom: -0.25em;
-}
-
-sup {
-  top: -0.5em;
-}
-
-/*
-1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
-2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
-3. Remove gaps between table borders by default.
-*/
-
-table {
-  text-indent: 0;
-  /* 1 */
-  border-color: inherit;
-  /* 2 */
-  border-collapse: collapse;
-  /* 3 */
-}
-
-/*
-1. Change the font styles in all browsers.
-2. Remove the margin in Firefox and Safari.
-3. Remove default padding in all browsers.
-*/
-
-button,
-input,
-optgroup,
-select,
-textarea {
-  font-family: inherit;
-  /* 1 */
-  font-feature-settings: inherit;
-  /* 1 */
-  font-variation-settings: inherit;
-  /* 1 */
-  font-size: 100%;
-  /* 1 */
-  font-weight: inherit;
-  /* 1 */
-  line-height: inherit;
-  /* 1 */
-  color: inherit;
-  /* 1 */
-  margin: 0;
-  /* 2 */
-  padding: 0;
-  /* 3 */
-}
-
-/*
-Remove the inheritance of text transform in Edge and Firefox.
-*/
-
-button,
-select {
-  text-transform: none;
-}
-
-/*
-1. Correct the inability to style clickable types in iOS and Safari.
-2. Remove default button styles.
-*/
-
-button,
-[type='button'],
-[type='reset'],
-[type='submit'] {
-  -webkit-appearance: button;
-  /* 1 */
-  background-color: transparent;
-  /* 2 */
-  background-image: none;
-  /* 2 */
-}
-
-/*
-Use the modern Firefox focus style for all focusable elements.
-*/
-
-:-moz-focusring {
-  outline: auto;
-}
-
-/*
-Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
-*/
-
-:-moz-ui-invalid {
-  box-shadow: none;
-}
-
-/*
-Add the correct vertical alignment in Chrome and Firefox.
-*/
-
-progress {
-  vertical-align: baseline;
-}
-
-/*
-Correct the cursor style of increment and decrement buttons in Safari.
-*/
-
-::-webkit-inner-spin-button,
-::-webkit-outer-spin-button {
-  height: auto;
-}
-
-/*
-1. Correct the odd appearance in Chrome and Safari.
-2. Correct the outline style in Safari.
-*/
-
-[type='search'] {
-  -webkit-appearance: textfield;
-  /* 1 */
-  outline-offset: -2px;
-  /* 2 */
-}
-
-/*
-Remove the inner padding in Chrome and Safari on macOS.
-*/
-
-::-webkit-search-decoration {
-  -webkit-appearance: none;
-}
-
-/*
-1. Correct the inability to style clickable types in iOS and Safari.
-2. Change font properties to `inherit` in Safari.
-*/
-
-::-webkit-file-upload-button {
-  -webkit-appearance: button;
-  /* 1 */
-  font: inherit;
-  /* 2 */
-}
-
-/*
-Add the correct display in Chrome and Safari.
-*/
-
-summary {
-  display: list-item;
-}
-
-/*
-Removes the default spacing and border for appropriate elements.
-*/
-
-blockquote,
-dl,
-dd,
-h1,
-h2,
-h3,
-h4,
-h5,
-h6,
-hr,
-figure,
-p,
-pre {
-  margin: 0;
-}
-
-fieldset {
-  margin: 0;
-  padding: 0;
-}
-
-legend {
-  padding: 0;
-}
-
-ol,
-ul,
-menu {
-  list-style: none;
-  margin: 0;
-  padding: 0;
-}
-
-/*
-Reset default styling for dialogs.
-*/
-
-dialog {
-  padding: 0;
-}
-
-/*
-Prevent resizing textareas horizontally by default.
-*/
-
-textarea {
-  resize: vertical;
-}
-
-/*
-1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
-2. Set the default placeholder color to the user's configured gray 400 color.
-*/
-
-input::-moz-placeholder, textarea::-moz-placeholder {
-  opacity: 1;
-  /* 1 */
-  color: #9ca3af;
-  /* 2 */
-}
-
-input::placeholder,
-textarea::placeholder {
-  opacity: 1;
-  /* 1 */
-  color: #9ca3af;
-  /* 2 */
-}
-
-/*
-Set the default cursor for buttons.
-*/
-
-button,
-[role="button"] {
-  cursor: pointer;
-}
-
-/*
-Make sure disabled buttons don't get the pointer cursor.
-*/
-
-:disabled {
-  cursor: default;
-}
-
-/*
-1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
-2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
-   This can trigger a poorly considered lint error in some tools but is included by design.
-*/
-
-img,
-svg,
-video,
-canvas,
-audio,
-iframe,
-embed,
-object {
-  display: block;
-  /* 1 */
-  vertical-align: middle;
-  /* 2 */
-}
-
-/*
-Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
-*/
-
-img,
-video {
-  max-width: 100%;
-  height: auto;
-}
-
-/* Make elements with the HTML hidden attribute stay hidden by default */
-
-[hidden] {
-  display: none;
-}
-
-* {
-  scrollbar-color: initial;
-  scrollbar-width: initial;
-}
-
-*, ::before, ::after {
-  --tw-border-spacing-x: 0;
-  --tw-border-spacing-y: 0;
-  --tw-translate-x: 0;
-  --tw-translate-y: 0;
-  --tw-rotate: 0;
-  --tw-skew-x: 0;
-  --tw-skew-y: 0;
-  --tw-scale-x: 1;
-  --tw-scale-y: 1;
-  --tw-pan-x:  ;
-  --tw-pan-y:  ;
-  --tw-pinch-zoom:  ;
-  --tw-scroll-snap-strictness: proximity;
-  --tw-gradient-from-position:  ;
-  --tw-gradient-via-position:  ;
-  --tw-gradient-to-position:  ;
-  --tw-ordinal:  ;
-  --tw-slashed-zero:  ;
-  --tw-numeric-figure:  ;
-  --tw-numeric-spacing:  ;
-  --tw-numeric-fraction:  ;
-  --tw-ring-inset:  ;
-  --tw-ring-offset-width: 0px;
-  --tw-ring-offset-color: #fff;
-  --tw-ring-color: rgb(59 130 246 / 0.5);
-  --tw-ring-offset-shadow: 0 0 #0000;
-  --tw-ring-shadow: 0 0 #0000;
-  --tw-shadow: 0 0 #0000;
-  --tw-shadow-colored: 0 0 #0000;
-  --tw-blur:  ;
-  --tw-brightness:  ;
-  --tw-contrast:  ;
-  --tw-grayscale:  ;
-  --tw-hue-rotate:  ;
-  --tw-invert:  ;
-  --tw-saturate:  ;
-  --tw-sepia:  ;
-  --tw-drop-shadow:  ;
-  --tw-backdrop-blur:  ;
-  --tw-backdrop-brightness:  ;
-  --tw-backdrop-contrast:  ;
-  --tw-backdrop-grayscale:  ;
-  --tw-backdrop-hue-rotate:  ;
-  --tw-backdrop-invert:  ;
-  --tw-backdrop-opacity:  ;
-  --tw-backdrop-saturate:  ;
-  --tw-backdrop-sepia:  ;
-}
-
-::backdrop {
-  --tw-border-spacing-x: 0;
-  --tw-border-spacing-y: 0;
-  --tw-translate-x: 0;
-  --tw-translate-y: 0;
-  --tw-rotate: 0;
-  --tw-skew-x: 0;
-  --tw-skew-y: 0;
-  --tw-scale-x: 1;
-  --tw-scale-y: 1;
-  --tw-pan-x:  ;
-  --tw-pan-y:  ;
-  --tw-pinch-zoom:  ;
-  --tw-scroll-snap-strictness: proximity;
-  --tw-gradient-from-position:  ;
-  --tw-gradient-via-position:  ;
-  --tw-gradient-to-position:  ;
-  --tw-ordinal:  ;
-  --tw-slashed-zero:  ;
-  --tw-numeric-figure:  ;
-  --tw-numeric-spacing:  ;
-  --tw-numeric-fraction:  ;
-  --tw-ring-inset:  ;
-  --tw-ring-offset-width: 0px;
-  --tw-ring-offset-color: #fff;
-  --tw-ring-color: rgb(59 130 246 / 0.5);
-  --tw-ring-offset-shadow: 0 0 #0000;
-  --tw-ring-shadow: 0 0 #0000;
-  --tw-shadow: 0 0 #0000;
-  --tw-shadow-colored: 0 0 #0000;
-  --tw-blur:  ;
-  --tw-brightness:  ;
-  --tw-contrast:  ;
-  --tw-grayscale:  ;
-  --tw-hue-rotate:  ;
-  --tw-invert:  ;
-  --tw-saturate:  ;
-  --tw-sepia:  ;
-  --tw-drop-shadow:  ;
-  --tw-backdrop-blur:  ;
-  --tw-backdrop-brightness:  ;
-  --tw-backdrop-contrast:  ;
-  --tw-backdrop-grayscale:  ;
-  --tw-backdrop-hue-rotate:  ;
-  --tw-backdrop-invert:  ;
-  --tw-backdrop-opacity:  ;
-  --tw-backdrop-saturate:  ;
-  --tw-backdrop-sepia:  ;
-}
-
-.container {
-  width: 100%;
-}
-
-@media (min-width: 640px) {
-  .container {
-    max-width: 640px;
-  }
-}
-
-@media (min-width: 768px) {
-  .container {
-    max-width: 768px;
-  }
-}
-
-@media (min-width: 1024px) {
-  .container {
-    max-width: 1024px;
-  }
-}
-
-@media (min-width: 1280px) {
-  .container {
-    max-width: 1280px;
-  }
-}
-
-@media (min-width: 1536px) {
-  .container {
-    max-width: 1536px;
-  }
-}
-
-.prose {
-  color: var(--tw-prose-body);
-  max-width: 65ch;
-}
-
-.prose :where(p):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  margin-top: 1.25em;
-  margin-bottom: 1.25em;
-}
-
-.prose :where([class~="lead"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  color: var(--tw-prose-lead);
-  font-size: 1.25em;
-  line-height: 1.6;
-  margin-top: 1.2em;
-  margin-bottom: 1.2em;
-}
-
-.prose :where(a):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  color: var(--tw-prose-links);
-  text-decoration: underline;
-  font-weight: 500;
-}
-
-.prose :where(strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  color: var(--tw-prose-bold);
-  font-weight: 600;
-}
-
-.prose :where(a strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  color: inherit;
-}
-
-.prose :where(blockquote strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  color: inherit;
-}
-
-.prose :where(thead th strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  color: inherit;
-}
-
-.prose :where(ol):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  list-style-type: decimal;
-  margin-top: 1.25em;
-  margin-bottom: 1.25em;
-  padding-left: 1.625em;
-}
-
-.prose :where(ol[type="A"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  list-style-type: upper-alpha;
-}
-
-.prose :where(ol[type="a"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  list-style-type: lower-alpha;
-}
-
-.prose :where(ol[type="A" s]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  list-style-type: upper-alpha;
-}
-
-.prose :where(ol[type="a" s]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  list-style-type: lower-alpha;
-}
-
-.prose :where(ol[type="I"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  list-style-type: upper-roman;
-}
-
-.prose :where(ol[type="i"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  list-style-type: lower-roman;
-}
-
-.prose :where(ol[type="I" s]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  list-style-type: upper-roman;
-}
-
-.prose :where(ol[type="i" s]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  list-style-type: lower-roman;
-}
-
-.prose :where(ol[type="1"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  list-style-type: decimal;
-}
-
-.prose :where(ul):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  list-style-type: disc;
-  margin-top: 1.25em;
-  margin-bottom: 1.25em;
-  padding-left: 1.625em;
-}
-
-.prose :where(ol > li):not(:where([class~="not-prose"],[class~="not-prose"] *))::marker {
-  font-weight: 400;
-  color: var(--tw-prose-counters);
-}
-
-.prose :where(ul > li):not(:where([class~="not-prose"],[class~="not-prose"] *))::marker {
-  color: var(--tw-prose-bullets);
-}
-
-.prose :where(dt):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  color: var(--tw-prose-headings);
-  font-weight: 600;
-  margin-top: 1.25em;
-}
-
-.prose :where(hr):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  border-color: var(--tw-prose-hr);
-  border-top-width: 1px;
-  margin-top: 3em;
-  margin-bottom: 3em;
-}
-
-.prose :where(blockquote):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  font-weight: 500;
-  font-style: italic;
-  color: var(--tw-prose-quotes);
-  border-left-width: 0.25rem;
-  border-left-color: var(--tw-prose-quote-borders);
-  quotes: "\201C""\201D""\2018""\2019";
-  margin-top: 1.6em;
-  margin-bottom: 1.6em;
-  padding-left: 1em;
-}
-
-.prose :where(blockquote p:first-of-type):not(:where([class~="not-prose"],[class~="not-prose"] *))::before {
-  content: open-quote;
-}
-
-.prose :where(blockquote p:last-of-type):not(:where([class~="not-prose"],[class~="not-prose"] *))::after {
-  content: close-quote;
-}
-
-.prose :where(h1):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  color: var(--tw-prose-headings);
-  font-weight: 800;
-  font-size: 2.25em;
-  margin-top: 0;
-  margin-bottom: 0.8888889em;
-  line-height: 1.1111111;
-}
-
-.prose :where(h1 strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  font-weight: 900;
-  color: inherit;
-}
-
-.prose :where(h2):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  color: var(--tw-prose-headings);
-  font-weight: 700;
-  font-size: 1.5em;
-  margin-top: 2em;
-  margin-bottom: 1em;
-  line-height: 1.3333333;
-}
-
-.prose :where(h2 strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  font-weight: 800;
-  color: inherit;
-}
-
-.prose :where(h3):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  color: var(--tw-prose-headings);
-  font-weight: 600;
-  font-size: 1.25em;
-  margin-top: 1.6em;
-  margin-bottom: 0.6em;
-  line-height: 1.6;
-}
-
-.prose :where(h3 strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  font-weight: 700;
-  color: inherit;
-}
-
-.prose :where(h4):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  color: var(--tw-prose-headings);
-  font-weight: 600;
-  margin-top: 1.5em;
-  margin-bottom: 0.5em;
-  line-height: 1.5;
-}
-
-.prose :where(h4 strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  font-weight: 700;
-  color: inherit;
-}
-
-.prose :where(img):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  margin-top: 2em;
-  margin-bottom: 2em;
-}
-
-.prose :where(picture):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  display: block;
-  margin-top: 2em;
-  margin-bottom: 2em;
-}
-
-.prose :where(kbd):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  font-weight: 500;
-  font-family: inherit;
-  color: var(--tw-prose-kbd);
-  box-shadow: 0 0 0 1px rgb(var(--tw-prose-kbd-shadows) / 10%), 0 3px 0 rgb(var(--tw-prose-kbd-shadows) / 10%);
-  font-size: 0.875em;
-  border-radius: 0.3125rem;
-  padding-top: 0.1875em;
-  padding-right: 0.375em;
-  padding-bottom: 0.1875em;
-  padding-left: 0.375em;
-}
-
-.prose :where(code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  color: var(--tw-prose-code);
-  font-weight: 600;
-  font-size: 0.875em;
-}
-
-.prose :where(code):not(:where([class~="not-prose"],[class~="not-prose"] *))::before {
-  content: "`";
-}
-
-.prose :where(code):not(:where([class~="not-prose"],[class~="not-prose"] *))::after {
-  content: "`";
-}
-
-.prose :where(a code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  color: inherit;
-}
-
-.prose :where(h1 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  color: inherit;
-}
-
-.prose :where(h2 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  color: inherit;
-  font-size: 0.875em;
-}
-
-.prose :where(h3 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  color: inherit;
-  font-size: 0.9em;
-}
-
-.prose :where(h4 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  color: inherit;
-}
-
-.prose :where(blockquote code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  color: inherit;
-}
-
-.prose :where(thead th code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  color: inherit;
-}
-
-.prose :where(pre):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  color: var(--tw-prose-pre-code);
-  background-color: var(--tw-prose-pre-bg);
-  overflow-x: auto;
-  font-weight: 400;
-  font-size: 0.875em;
-  line-height: 1.7142857;
-  margin-top: 1.7142857em;
-  margin-bottom: 1.7142857em;
-  border-radius: 0.375rem;
-  padding-top: 0.8571429em;
-  padding-right: 1.1428571em;
-  padding-bottom: 0.8571429em;
-  padding-left: 1.1428571em;
-}
-
-.prose :where(pre code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  background-color: transparent;
-  border-width: 0;
-  border-radius: 0;
-  padding: 0;
-  font-weight: inherit;
-  color: inherit;
-  font-size: inherit;
-  font-family: inherit;
-  line-height: inherit;
-}
-
-.prose :where(pre code):not(:where([class~="not-prose"],[class~="not-prose"] *))::before {
-  content: none;
-}
-
-.prose :where(pre code):not(:where([class~="not-prose"],[class~="not-prose"] *))::after {
-  content: none;
-}
-
-.prose :where(table):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  width: 100%;
-  table-layout: auto;
-  text-align: left;
-  margin-top: 2em;
-  margin-bottom: 2em;
-  font-size: 0.875em;
-  line-height: 1.7142857;
-}
-
-.prose :where(thead):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  border-bottom-width: 1px;
-  border-bottom-color: var(--tw-prose-th-borders);
-}
-
-.prose :where(thead th):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  color: var(--tw-prose-headings);
-  font-weight: 600;
-  vertical-align: bottom;
-  padding-right: 0.5714286em;
-  padding-bottom: 0.5714286em;
-  padding-left: 0.5714286em;
-}
-
-.prose :where(tbody tr):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  border-bottom-width: 1px;
-  border-bottom-color: var(--tw-prose-td-borders);
-}
-
-.prose :where(tbody tr:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  border-bottom-width: 0;
-}
-
-.prose :where(tbody td):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  vertical-align: baseline;
-}
-
-.prose :where(tfoot):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  border-top-width: 1px;
-  border-top-color: var(--tw-prose-th-borders);
-}
-
-.prose :where(tfoot td):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  vertical-align: top;
-}
-
-.prose :where(figure > *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  margin-top: 0;
-  margin-bottom: 0;
-}
-
-.prose :where(figcaption):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  color: var(--tw-prose-captions);
-  font-size: 0.875em;
-  line-height: 1.4285714;
-  margin-top: 0.8571429em;
-}
-
-.prose {
-  --tw-prose-body: #374151;
-  --tw-prose-headings: #111827;
-  --tw-prose-lead: #4b5563;
-  --tw-prose-links: #111827;
-  --tw-prose-bold: #111827;
-  --tw-prose-counters: #6b7280;
-  --tw-prose-bullets: #d1d5db;
-  --tw-prose-hr: #e5e7eb;
-  --tw-prose-quotes: #111827;
-  --tw-prose-quote-borders: #e5e7eb;
-  --tw-prose-captions: #6b7280;
-  --tw-prose-kbd: #111827;
-  --tw-prose-kbd-shadows: 17 24 39;
-  --tw-prose-code: #111827;
-  --tw-prose-pre-code: #e5e7eb;
-  --tw-prose-pre-bg: #1f2937;
-  --tw-prose-th-borders: #d1d5db;
-  --tw-prose-td-borders: #e5e7eb;
-  --tw-prose-invert-body: #d1d5db;
-  --tw-prose-invert-headings: #fff;
-  --tw-prose-invert-lead: #9ca3af;
-  --tw-prose-invert-links: #fff;
-  --tw-prose-invert-bold: #fff;
-  --tw-prose-invert-counters: #9ca3af;
-  --tw-prose-invert-bullets: #4b5563;
-  --tw-prose-invert-hr: #374151;
-  --tw-prose-invert-quotes: #f3f4f6;
-  --tw-prose-invert-quote-borders: #374151;
-  --tw-prose-invert-captions: #9ca3af;
-  --tw-prose-invert-kbd: #fff;
-  --tw-prose-invert-kbd-shadows: 255 255 255;
-  --tw-prose-invert-code: #fff;
-  --tw-prose-invert-pre-code: #d1d5db;
-  --tw-prose-invert-pre-bg: rgb(0 0 0 / 50%);
-  --tw-prose-invert-th-borders: #4b5563;
-  --tw-prose-invert-td-borders: #374151;
-  font-size: 1rem;
-  line-height: 1.75;
-}
-
-.prose :where(picture > img):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  margin-top: 0;
-  margin-bottom: 0;
-}
-
-.prose :where(video):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  margin-top: 2em;
-  margin-bottom: 2em;
-}
-
-.prose :where(li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  margin-top: 0.5em;
-  margin-bottom: 0.5em;
-}
-
-.prose :where(ol > li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  padding-left: 0.375em;
-}
-
-.prose :where(ul > li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  padding-left: 0.375em;
-}
-
-.prose :where(.prose > ul > li p):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  margin-top: 0.75em;
-  margin-bottom: 0.75em;
-}
-
-.prose :where(.prose > ul > li > *:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  margin-top: 1.25em;
-}
-
-.prose :where(.prose > ul > li > *:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  margin-bottom: 1.25em;
-}
-
-.prose :where(.prose > ol > li > *:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  margin-top: 1.25em;
-}
-
-.prose :where(.prose > ol > li > *:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  margin-bottom: 1.25em;
-}
-
-.prose :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  margin-top: 0.75em;
-  margin-bottom: 0.75em;
-}
-
-.prose :where(dl):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  margin-top: 1.25em;
-  margin-bottom: 1.25em;
-}
-
-.prose :where(dd):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  margin-top: 0.5em;
-  padding-left: 1.625em;
-}
-
-.prose :where(hr + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  margin-top: 0;
-}
-
-.prose :where(h2 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  margin-top: 0;
-}
-
-.prose :where(h3 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  margin-top: 0;
-}
-
-.prose :where(h4 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  margin-top: 0;
-}
-
-.prose :where(thead th:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  padding-left: 0;
-}
-
-.prose :where(thead th:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  padding-right: 0;
-}
-
-.prose :where(tbody td, tfoot td):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  padding-top: 0.5714286em;
-  padding-right: 0.5714286em;
-  padding-bottom: 0.5714286em;
-  padding-left: 0.5714286em;
-}
-
-.prose :where(tbody td:first-child, tfoot td:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  padding-left: 0;
-}
-
-.prose :where(tbody td:last-child, tfoot td:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  padding-right: 0;
-}
-
-.prose :where(figure):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  margin-top: 2em;
-  margin-bottom: 2em;
-}
-
-.prose :where(.prose > :first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  margin-top: 0;
-}
-
-.prose :where(.prose > :last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-  margin-bottom: 0;
-}
-
-.visible {
-  visibility: visible;
-}
-
-.collapse {
-  visibility: collapse;
-}
-
-.static {
-  position: static;
-}
-
-.fixed {
-  position: fixed;
-}
-
-.absolute {
-  position: absolute;
-}
-
-.relative {
-  position: relative;
-}
-
-.sticky {
-  position: sticky;
-}
-
-.bottom-2 {
-  bottom: 0.5rem;
-}
-
-.left-0 {
-  left: 0px;
-}
-
-.left-1 {
-  left: 0.25rem;
-}
-
-.top-0 {
-  top: 0px;
-}
-
-.m-0 {
-  margin: 0px;
-}
-
-.mx-1 {
-  margin-left: 0.25rem;
-  margin-right: 0.25rem;
-}
-
-.mx-4 {
-  margin-left: 1rem;
-  margin-right: 1rem;
-}
-
-.mx-auto {
-  margin-left: auto;
-  margin-right: auto;
-}
-
-.my-1 {
-  margin-top: 0.25rem;
-  margin-bottom: 0.25rem;
-}
-
-.my-12 {
-  margin-top: 3rem;
-  margin-bottom: 3rem;
-}
-
-.my-2 {
-  margin-top: 0.5rem;
-  margin-bottom: 0.5rem;
-}
-
-.-ml-2 {
-  margin-left: -0.5rem;
-}
-
-.-ml-3 {
-  margin-left: -0.75rem;
-}
-
-.mb-0 {
-  margin-bottom: 0px;
-}
-
-.mb-2 {
-  margin-bottom: 0.5rem;
-}
-
-.mb-4 {
-  margin-bottom: 1rem;
-}
-
-.mb-6 {
-  margin-bottom: 1.5rem;
-}
-
-.mb-8 {
-  margin-bottom: 2rem;
-}
-
-.ml-1 {
-  margin-left: 0.25rem;
-}
-
-.ml-2 {
-  margin-left: 0.5rem;
-}
-
-.ml-3 {
-  margin-left: 0.75rem;
-}
-
-.mr-1 {
-  margin-right: 0.25rem;
-}
-
-.mr-2 {
-  margin-right: 0.5rem;
-}
-
-.mr-4 {
-  margin-right: 1rem;
-}
-
-.mt-0 {
-  margin-top: 0px;
-}
-
-.mt-1 {
-  margin-top: 0.25rem;
-}
-
-.mt-1\.5 {
-  margin-top: 0.375rem;
-}
-
-.mt-12 {
-  margin-top: 3rem;
-}
-
-.mt-2 {
-  margin-top: 0.5rem;
-}
-
-.mt-2\.5 {
-  margin-top: 0.625rem;
-}
-
-.mt-3 {
-  margin-top: 0.75rem;
-}
-
-.mt-4 {
-  margin-top: 1rem;
-}
-
-.mt-6 {
-  margin-top: 1.5rem;
-}
-
-.mt-8 {
-  margin-top: 2rem;
-}
-
-.line-clamp-2 {
-  overflow: hidden;
-  display: -webkit-box;
-  -webkit-box-orient: vertical;
-  -webkit-line-clamp: 2;
-}
-
-.block {
-  display: block;
-}
-
-.inline-block {
-  display: inline-block;
-}
-
-.inline {
-  display: inline;
-}
-
-.flex {
-  display: flex;
-}
-
-.grid {
-  display: grid;
-}
-
-.contents {
-  display: contents;
-}
-
-.hidden {
-  display: none;
-}
-
-.h-10 {
-  height: 2.5rem;
-}
-
-.h-12 {
-  height: 3rem;
-}
-
-.h-14 {
-  height: 3.5rem;
-}
-
-.h-4 {
-  height: 1rem;
-}
-
-.h-40 {
-  height: 10rem;
-}
-
-.h-5 {
-  height: 1.25rem;
-}
-
-.h-6 {
-  height: 1.5rem;
-}
-
-.h-64 {
-  height: 16rem;
-}
-
-.h-full {
-  height: 100%;
-}
-
-.min-h-screen {
-  min-height: 100vh;
-}
-
-.w-1\/2 {
-  width: 50%;
-}
-
-.w-10 {
-  width: 2.5rem;
-}
-
-.w-10\/12 {
-  width: 83.333333%;
-}
-
-.w-12 {
-  width: 3rem;
-}
-
-.w-14 {
-  width: 3.5rem;
-}
-
-.w-5 {
-  width: 1.25rem;
-}
-
-.w-6 {
-  width: 1.5rem;
-}
-
-.w-64 {
-  width: 16rem;
-}
-
-.w-full {
-  width: 100%;
-}
-
-.max-w-full {
-  max-width: 100%;
-}
-
-.max-w-screen-sm {
-  max-width: 640px;
-}
-
-.flex-1 {
-  flex: 1 1 0%;
-}
-
-.flex-none {
-  flex: none;
-}
-
-.grow {
-  flex-grow: 1;
-}
-
-.transform {
-  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
-}
-
-.cursor-not-allowed {
-  cursor: not-allowed;
-}
-
-.resize-none {
-  resize: none;
-}
-
-.list-inside {
-  list-style-position: inside;
-}
-
-.list-disc {
-  list-style-type: disc;
-}
-
-.appearance-none {
-  -webkit-appearance: none;
-     -moz-appearance: none;
-          appearance: none;
-}
-
-.grid-cols-2 {
-  grid-template-columns: repeat(2, minmax(0, 1fr));
-}
-
-.grid-cols-3 {
-  grid-template-columns: repeat(3, minmax(0, 1fr));
-}
-
-.flex-row {
-  flex-direction: row;
-}
-
-.flex-col {
-  flex-direction: column;
-}
-
-.flex-wrap {
-  flex-wrap: wrap;
-}
-
-.items-start {
-  align-items: flex-start;
-}
-
-.items-center {
-  align-items: center;
-}
-
-.justify-center {
-  justify-content: center;
-}
-
-.justify-between {
-  justify-content: space-between;
-}
-
-.gap-2 {
-  gap: 0.5rem;
-}
-
-.space-y-2 > :not([hidden]) ~ :not([hidden]) {
-  --tw-space-y-reverse: 0;
-  margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
-  margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
-}
-
-.divide-y > :not([hidden]) ~ :not([hidden]) {
-  --tw-divide-y-reverse: 0;
-  border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
-  border-bottom-width: calc(1px * var(--tw-divide-y-reverse));
-}
-
-.divide-gray-200 > :not([hidden]) ~ :not([hidden]) {
-  --tw-divide-opacity: 1;
-  border-color: rgb(229 231 235 / var(--tw-divide-opacity));
-}
-
-.overflow-hidden {
-  overflow: hidden;
-}
-
-.whitespace-nowrap {
-  white-space: nowrap;
-}
-
-.rounded-full {
-  border-radius: 9999px;
-}
-
-.rounded-lg {
-  border-radius: 0.5rem;
-}
-
-.rounded-sm {
-  border-radius: 0.125rem;
-}
-
-.border {
-  border-width: 1px;
-}
-
-.border-4 {
-  border-width: 4px;
-}
-
-.border-b {
-  border-bottom-width: 1px;
-}
-
-.border-t {
-  border-top-width: 1px;
-}
-
-.border-blue-500 {
-  --tw-border-opacity: 1;
-  border-color: rgb(59 130 246 / var(--tw-border-opacity));
-}
-
-.border-blue-600 {
-  --tw-border-opacity: 1;
-  border-color: rgb(37 99 235 / var(--tw-border-opacity));
-}
-
-.border-gray-100 {
-  --tw-border-opacity: 1;
-  border-color: rgb(243 244 246 / var(--tw-border-opacity));
-}
-
-.border-gray-200 {
-  --tw-border-opacity: 1;
-  border-color: rgb(229 231 235 / var(--tw-border-opacity));
-}
-
-.border-white {
-  --tw-border-opacity: 1;
-  border-color: rgb(255 255 255 / var(--tw-border-opacity));
-}
-
-.bg-blue-500 {
-  --tw-bg-opacity: 1;
-  background-color: rgb(59 130 246 / var(--tw-bg-opacity));
-}
-
-.bg-blue-600 {
-  --tw-bg-opacity: 1;
-  background-color: rgb(37 99 235 / var(--tw-bg-opacity));
-}
-
-.bg-gray-200\/60 {
-  background-color: rgb(229 231 235 / 0.6);
-}
-
-.bg-gray-900 {
-  --tw-bg-opacity: 1;
-  background-color: rgb(17 24 39 / var(--tw-bg-opacity));
-}
-
-.bg-white {
-  --tw-bg-opacity: 1;
-  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
-}
-
-.bg-cover-gradient {
-  background-image: linear-gradient(180deg,transparent 0,rgba(0,0,0,.15) 70%,rgba(0,0,0,.5));
-}
-
-.p-2 {
-  padding: 0.5rem;
-}
-
-.p-4 {
-  padding: 1rem;
-}
-
-.px-1 {
-  padding-left: 0.25rem;
-  padding-right: 0.25rem;
-}
-
-.px-1\.5 {
-  padding-left: 0.375rem;
-  padding-right: 0.375rem;
-}
-
-.px-4 {
-  padding-left: 1rem;
-  padding-right: 1rem;
-}
-
-.py-2 {
-  padding-top: 0.5rem;
-  padding-bottom: 0.5rem;
-}
-
-.pb-4 {
-  padding-bottom: 1rem;
-}
-
-.pb-5 {
-  padding-bottom: 1.25rem;
-}
-
-.pb-8 {
-  padding-bottom: 2rem;
-}
-
-.pl-4 {
-  padding-left: 1rem;
-}
-
-.pl-5 {
-  padding-left: 1.25rem;
-}
-
-.pr-4 {
-  padding-right: 1rem;
-}
-
-.pt-1 {
-  padding-top: 0.25rem;
-}
-
-.pt-12 {
-  padding-top: 3rem;
-}
-
-.pt-14 {
-  padding-top: 3.5rem;
-}
-
-.pt-2 {
-  padding-top: 0.5rem;
-}
-
-.pt-3 {
-  padding-top: 0.75rem;
-}
-
-.pt-4 {
-  padding-top: 1rem;
-}
-
-.pt-5 {
-  padding-top: 1.25rem;
-}
-
-.pt-6 {
-  padding-top: 1.5rem;
-}
-
-.pt-8 {
-  padding-top: 2rem;
-}
-
-.text-center {
-  text-align: center;
-}
-
-.font-sans {
-  font-family: silka, Inter, Roboto, Helvetica Neue, Arial Nova, Nimbus Sans, Arial, system-ui, sans-serif;
-}
-
-.text-2xl {
-  font-size: 1.5rem;
-  line-height: 2rem;
-}
-
-.text-3xl {
-  font-size: 1.875rem;
-  line-height: 2.25rem;
-}
-
-.text-4xl {
-  font-size: 2.25rem;
-  line-height: 2.5rem;
-}
-
-.text-lg {
-  font-size: 1.125rem;
-  line-height: 1.75rem;
-}
-
-.text-sm {
-  font-size: 0.875rem;
-  line-height: 1.25rem;
-}
-
-.text-xl {
-  font-size: 1.25rem;
-  line-height: 1.75rem;
-}
-
-.text-xs {
-  font-size: 0.75rem;
-  line-height: 1rem;
-}
-
-.font-black {
-  font-weight: 900;
-}
-
-.font-bold {
-  font-weight: 700;
-}
-
-.font-extrabold {
-  font-weight: 800;
-}
-
-.font-medium {
-  font-weight: 500;
-}
-
-.font-normal {
-  font-weight: 400;
-}
-
-.font-semibold {
-  font-weight: 600;
-}
-
-.lowercase {
-  text-transform: lowercase;
-}
-
-.leading-7 {
-  line-height: 1.75rem;
-}
-
-.leading-9 {
-  line-height: 2.25rem;
-}
-
-.leading-tight {
-  line-height: 1.25;
-}
-
-.tracking-normal {
-  letter-spacing: 0em;
-}
-
-.tracking-tight {
-  letter-spacing: -0.025em;
-}
-
-.\!text-white {
-  --tw-text-opacity: 1 !important;
-  color: rgb(255 255 255 / var(--tw-text-opacity)) !important;
-}
-
-.text-blue-500 {
-  --tw-text-opacity: 1;
-  color: rgb(59 130 246 / var(--tw-text-opacity));
-}
-
-.text-blue-600 {
-  --tw-text-opacity: 1;
-  color: rgb(37 99 235 / var(--tw-text-opacity));
-}
-
-.text-gray-500 {
-  --tw-text-opacity: 1;
-  color: rgb(107 114 128 / var(--tw-text-opacity));
-}
-
-.text-gray-700 {
-  --tw-text-opacity: 1;
-  color: rgb(55 65 81 / var(--tw-text-opacity));
-}
-
-.text-gray-800 {
-  --tw-text-opacity: 1;
-  color: rgb(31 41 55 / var(--tw-text-opacity));
-}
-
-.text-gray-900 {
-  --tw-text-opacity: 1;
-  color: rgb(17 24 39 / var(--tw-text-opacity));
-}
-
-.text-white {
-  --tw-text-opacity: 1;
-  color: rgb(255 255 255 / var(--tw-text-opacity));
-}
-
-.\!no-underline {
-  text-decoration-line: none !important;
-}
-
-.no-underline {
-  text-decoration-line: none;
-}
-
-.shadow-none {
-  --tw-shadow: 0 0 #0000;
-  --tw-shadow-colored: 0 0 #0000;
-  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
-}
-
-.outline-none {
-  outline: 2px solid transparent;
-  outline-offset: 2px;
-}
-
-.ring {
-  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
-  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);
-  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
-}
-
-.drop-shadow-md {
-  --tw-drop-shadow: drop-shadow(0 4px 3px rgb(0 0 0 / 0.07)) drop-shadow(0 2px 2px rgb(0 0 0 / 0.06));
-  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
-}
-
-.filter {
-  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
-}
-
-.transition {
-  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
-  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
-  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
-  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
-  transition-duration: 150ms;
-}
-
-.transition-all {
-  transition-property: all;
-  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
-  transition-duration: 150ms;
-}
-
-.transition-colors {
-  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
-  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
-  transition-duration: 150ms;
-}
-
-.duration-300 {
-  transition-duration: 300ms;
-}
-
-.ease-in-out {
-  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
-}
-
-.line-clamp-2 {
-  overflow: hidden;
-  display: -webkit-box;
-  -webkit-box-orient: vertical;
-  -webkit-line-clamp: 2;
-}
-
-.scrollbar-thin {
-  scrollbar-color: var(--scrollbar-thumb, initial) var(--scrollbar-track, initial);
-}
-
-.scrollbar-thin::-webkit-scrollbar-track {
-  background-color: var(--scrollbar-track);
-  border-radius: var(--scrollbar-track-radius);
-}
-
-.scrollbar-thin::-webkit-scrollbar-track:hover {
-  background-color: var(--scrollbar-track-hover, var(--scrollbar-track));
-}
-
-.scrollbar-thin::-webkit-scrollbar-track:active {
-  background-color: var(--scrollbar-track-active, var(--scrollbar-track-hover, var(--scrollbar-track)));
-}
-
-.scrollbar-thin::-webkit-scrollbar-thumb {
-  background-color: var(--scrollbar-thumb);
-  border-radius: var(--scrollbar-thumb-radius);
-}
-
-.scrollbar-thin::-webkit-scrollbar-thumb:hover {
-  background-color: var(--scrollbar-thumb-hover, var(--scrollbar-thumb));
-}
-
-.scrollbar-thin::-webkit-scrollbar-thumb:active {
-  background-color: var(--scrollbar-thumb-active, var(--scrollbar-thumb-hover, var(--scrollbar-thumb)));
-}
-
-.scrollbar-thin::-webkit-scrollbar-corner {
-  background-color: var(--scrollbar-corner);
-  border-radius: var(--scrollbar-corner-radius);
-}
-
-.scrollbar-thin::-webkit-scrollbar-corner:hover {
-  background-color: var(--scrollbar-corner-hover, var(--scrollbar-corner));
-}
-
-.scrollbar-thin::-webkit-scrollbar-corner:active {
-  background-color: var(--scrollbar-corner-active, var(--scrollbar-corner-hover, var(--scrollbar-corner)));
-}
-
-.scrollbar-thin {
-  scrollbar-width: thin;
-}
-
-.scrollbar-thin::-webkit-scrollbar {
-  display: block;
-  width: 8px;
-  height: 8px;
-}
-
-.scrollbar-track-blue-100 {
-  --scrollbar-track: #dbeafe !important;
-}
-
-.scrollbar-thumb-blue-600 {
-  --scrollbar-thumb: #2563eb !important;
-}
-
-body {
-  --pagefind-ui-primary: #2563eb;
-  --pagefind-ui-text: #1f2937;
-  --pagefind-ui-background: #fff;
-  --pagefind-ui-border: #e5e7eb;
-  --pagefind-ui-tag: #e5e7eb;
-  --pagefind-ui-border-width: 2px;
-  --pagefind-ui-border-radius: 8px;
-  --pagefind-ui-image-border-radius: 8px;
-  --pagefind-ui-image-box-ratio: 3 / 2;
-  --pagefind-ui-font: sans-serif;
-}
-
-body,
-html {
-  font-family: silka, Inter, Roboto, Helvetica Neue, Arial Nova, Nimbus Sans, Arial, system-ui, sans-serif;
-  color: #111827;
-}
-
-.pagefind-ui__form mark {
-  color: #fff !important;
-  background: #2563eb !important;
-}
-
-.pagefind-ui__form .pagefind-ui__result-link {
-  color: #2563eb !important;
-  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important;
-  transition-duration: 300ms !important;
-}
-
-.pagefind-ui__form .pagefind-ui__result-link:hover,
-.pagefind-ui__form .pagefind-ui__result-link:focus,
-.pagefind-ui__form .pagefind-ui__result-link:active {
-  color: #2563eb !important;
-}
-
-::-moz-selection {
-  color: #fff;
-  background: #2563eb;
-}
-
-::selection {
-  color: #fff;
-  background: #2563eb;
-}
-
-.active,
-.active svg {
-  color: #2563eb;
-}
-
-.header-anchor {
-  text-decoration: none !important;
-}
-
-h1 > a.header-anchor {
-  font-weight: 800;
-}
-
-h2 > a.header-anchor {
-  font-weight: 700;
-}
-
-a,
-.prose a {
-  color: #2563eb;
-  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
-  transition-duration: 300ms;
-}
-
-a:hover,
-a:focus,
-a:active,
-.prose a:hover,
-.prose a:focus,
-.prose a:active {
-  color: #1e40af;
-}
-
-.highlight-text {
-  --tw-text-opacity: 1;
-  color: rgb(255 255 255 / var(--tw-text-opacity));
-  padding: 0.125rem;
-  background-color: #2563eb;
-}
-
-p > a,
-span > a,
-blockquote > a,
-li > a {
-  text-decoration: underline !important;
-}
-
-code {
-  font-family: ui-monospace, Cascadia Code, Source Code Pro, Menlo, Consolas, DejaVu Sans Mono, monospace;
-  --tw-text-opacity: 1;
-  color: rgb(249 250 251 / var(--tw-text-opacity));
-  padding: 0.25rem;
-}
-
-pre {
-  border: 1px solid #374151;
-  border-radius: 0 !important;
-  scrollbar-color: var(--scrollbar-thumb, initial) var(--scrollbar-track, initial);
-}
-
-pre::-webkit-scrollbar-track {
-  background-color: var(--scrollbar-track);
-  border-radius: var(--scrollbar-track-radius);
-}
-
-pre::-webkit-scrollbar-track:hover {
-  background-color: var(--scrollbar-track-hover, var(--scrollbar-track));
-}
-
-pre::-webkit-scrollbar-track:active {
-  background-color: var(--scrollbar-track-active, var(--scrollbar-track-hover, var(--scrollbar-track)));
-}
-
-pre::-webkit-scrollbar-thumb {
-  background-color: var(--scrollbar-thumb);
-  border-radius: var(--scrollbar-thumb-radius);
-}
-
-pre::-webkit-scrollbar-thumb:hover {
-  background-color: var(--scrollbar-thumb-hover, var(--scrollbar-thumb));
-}
-
-pre::-webkit-scrollbar-thumb:active {
-  background-color: var(--scrollbar-thumb-active, var(--scrollbar-thumb-hover, var(--scrollbar-thumb)));
-}
-
-pre::-webkit-scrollbar-corner {
-  background-color: var(--scrollbar-corner);
-  border-radius: var(--scrollbar-corner-radius);
-}
-
-pre::-webkit-scrollbar-corner:hover {
-  background-color: var(--scrollbar-corner-hover, var(--scrollbar-corner));
-}
-
-pre::-webkit-scrollbar-corner:active {
-  background-color: var(--scrollbar-corner-active, var(--scrollbar-corner-hover, var(--scrollbar-corner)));
-}
-
-pre {
-  scrollbar-width: thin;
-}
-
-pre::-webkit-scrollbar {
-  display: block;
-  width: 8px;
-  height: 8px;
-}
-
-pre {
-  --scrollbar-thumb: #2563eb;
-  --scrollbar-track: #dbeafe;
-}
-
-.pill--button {
-  -webkit-appearance: none !important;
-     -moz-appearance: none !important;
-          appearance: none !important;
-  font-weight: 600;
-  padding-top: 0.5rem;
-  padding-bottom: 0.5rem;
-  padding-left: 1rem;
-  padding-right: 1rem;
-  margin-right: 0.25rem;
-  margin-bottom: 0.75rem;
-  border-radius: 9999px;
-  --tw-text-opacity: 1;
-  color: rgb(255 255 255 / var(--tw-text-opacity));
-  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
-  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
-  transition-duration: 300ms;
-  background-color: #2563eb !important;
-}
-
-.pill--button.pill--button__small {
-  padding-top: 0.25rem;
-  padding-bottom: 0.25rem;
-  padding-left: 0.5rem;
-  padding-right: 0.5rem;
-  margin-right: 0.5rem;
-  margin-bottom: 0.5rem;
-  font-size: 0.875rem;
-  line-height: 1.25rem;
-  display: inline-block;
-}
-
-.pill--button:hover,
-.pill--button:active,
-.pill--button:focus {
-  background-color: #1e40af !important;
-}
-
-[data-tablericon-name] {
-  stroke-width: 1.4;
-}
-
-.icon--bold > svg {
-  stroke-width: 2;
-}
-
-.link--icon > svg {
-  color: #374151;
-  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
-  transition-duration: 300ms;
-}
-
-.link--icon:hover > svg {
-  color: #2563eb;
-}
-
-@keyframes spin {
-  to {
-    transform: rotate(360deg);
-  }
-}
-
-.icon--spin > svg {
-  animation: spin 1s linear infinite;
-}
-
-.icon--inline > svg {
-  display: inline;
-}
-
-.pagefind-ui__search-input {
-  width: 100% !important;
-  outline: 2px solid transparent !important;
-  outline-offset: 2px !important;
-  --tw-bg-opacity: 1 !important;
-  background-color: rgb(255 255 255 / var(--tw-bg-opacity)) !important;
-  border-radius: 0.125rem !important;
-  border-width: 1px !important;
-  --tw-border-opacity: 1 !important;
-  border-color: rgb(37 99 235 / var(--tw-border-opacity)) !important;
-  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke !important;
-  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important;
-  transition-duration: 300ms !important;
-}
-
-.pagefind-ui__search-input:focus {
-  --tw-border-opacity: 1 !important;
-  border-color: rgb(30 64 175 / var(--tw-border-opacity)) !important;
-}
-
-.post-graph {
-  margin-top: 1.25rem;
-  margin-bottom: 1.25rem;
-}
-
-.post-graph__wrapper {
-  position: relative;
-  height: 2rem;
-  margin-bottom: 0.375rem;
-  display: flex;
-  align-items: center;
-}
-
-.post-graph__progress {
-  --tw-bg-opacity: 1;
-  background-color: rgb(37 99 235 / var(--tw-bg-opacity));
-  height: 100%;
-}
-
-.post-graph__year {
-  font-family: ui-monospace, Cascadia Code, Source Code Pro, Menlo, Consolas, DejaVu Sans Mono, monospace;
-}
-
-.post-graph__progress,
-.post-graph__data {
-  margin-left: 0.625rem;
-}
-
-@media (prefers-color-scheme: dark) {
-  body {
-    --pagefind-ui-primary: #60a5fa;
-    --pagefind-ui-text: #fff;
-    --pagefind-ui-background: #111827;
-    --pagefind-ui-border: #374151;
-    --pagefind-ui-tag: #374151;
-  }
-
-  a,
-  .prose a {
-    color: #60a5fa;
-  }
-
-  a:hover,
-  a:focus,
-  a:active,
-  .prose a:hover,
-  .prose a:focus,
-  .prose a:active {
-    color: #bfdbfe;
-  }
-
-  .highlight-text {
-    background-color: #60a5fa;
-  }
-
-  .link--icon svg {
-    color: #e5e7eb;
-  }
-
-  .link--icon:hover svg {
-    color: #bfdbfe;
-  }
-
-  .pagefind-ui__form mark {
-    background: #60a5fa !important;
-  }
-
-  .pagefind-ui__form .pagefind-ui__result-link {
-    color: #60a5fa !important;
-  }
-
-  .pagefind-ui__form .pagefind-ui__result-link:hover,
-  .pagefind-ui__form .pagefind-ui__result-link:focus,
-  .pagefind-ui__form .pagefind-ui__result-link:active {
-    color: #2563eb !important;
-  }
-
-  ::-moz-selection {
-    background: #60a5fa;
-  }
-
-  ::selection {
-    background: #60a5fa;
-  }
-
-  .active,
-  .active svg {
-    color: #60a5fa;
-  }
-
-  pre {
-    --scrollbar-thumb: #60a5fa;
-  }
-
-  .pill--button {
-    color: #fff;
-    background: #60a5fa;
-  }
-
-  .pill--button:hover,
-  .pill--button:active,
-  .pill--button:focus {
-    background: #bfdbfe;
-  }
-
-  .pagefind-ui__search-input {
-    --tw-border-opacity: 1 !important;
-    border-color: rgb(96 165 250 / var(--tw-border-opacity)) !important;
-    --tw-bg-opacity: 1 !important;
-    background-color: rgb(17 24 39 / var(--tw-bg-opacity)) !important;
-  }
-
-  .pagefind-ui__search-input:focus {
-    --tw-border-opacity: 1 !important;
-    border-color: rgb(191 219 254 / var(--tw-border-opacity)) !important;
-  }
-
-  .post-graph__progress {
-    --tw-bg-opacity: 1;
-    background-color: rgb(96 165 250 / var(--tw-bg-opacity));
-  }
-
-  .dark\:prose-invert {
-    --tw-prose-body: var(--tw-prose-invert-body);
-    --tw-prose-headings: var(--tw-prose-invert-headings);
-    --tw-prose-lead: var(--tw-prose-invert-lead);
-    --tw-prose-links: var(--tw-prose-invert-links);
-    --tw-prose-bold: var(--tw-prose-invert-bold);
-    --tw-prose-counters: var(--tw-prose-invert-counters);
-    --tw-prose-bullets: var(--tw-prose-invert-bullets);
-    --tw-prose-hr: var(--tw-prose-invert-hr);
-    --tw-prose-quotes: var(--tw-prose-invert-quotes);
-    --tw-prose-quote-borders: var(--tw-prose-invert-quote-borders);
-    --tw-prose-captions: var(--tw-prose-invert-captions);
-    --tw-prose-kbd: var(--tw-prose-invert-kbd);
-    --tw-prose-kbd-shadows: var(--tw-prose-invert-kbd-shadows);
-    --tw-prose-code: var(--tw-prose-invert-code);
-    --tw-prose-pre-code: var(--tw-prose-invert-pre-code);
-    --tw-prose-pre-bg: var(--tw-prose-invert-pre-bg);
-    --tw-prose-th-borders: var(--tw-prose-invert-th-borders);
-    --tw-prose-td-borders: var(--tw-prose-invert-td-borders);
-  }
-}
-
-.group:hover .group-hover\:border-blue-500 {
-  --tw-border-opacity: 1;
-  border-color: rgb(59 130 246 / var(--tw-border-opacity));
-}
-
-.group:hover .group-hover\:border-blue-800 {
-  --tw-border-opacity: 1;
-  border-color: rgb(30 64 175 / var(--tw-border-opacity));
-}
-
-.group:hover .group-hover\:text-blue-500 {
-  --tw-text-opacity: 1;
-  color: rgb(59 130 246 / var(--tw-text-opacity));
-}
-
-.group:hover .group-hover\:text-blue-800 {
-  --tw-text-opacity: 1;
-  color: rgb(30 64 175 / var(--tw-text-opacity));
-}
-
-.hover\:border-blue-500:hover {
-  --tw-border-opacity: 1;
-  border-color: rgb(59 130 246 / var(--tw-border-opacity));
-}
-
-.hover\:border-blue-800:hover {
-  --tw-border-opacity: 1;
-  border-color: rgb(30 64 175 / var(--tw-border-opacity));
-}
-
-.hover\:bg-blue-500:hover {
-  --tw-bg-opacity: 1;
-  background-color: rgb(59 130 246 / var(--tw-bg-opacity));
-}
-
-.hover\:bg-blue-800:hover {
-  --tw-bg-opacity: 1;
-  background-color: rgb(30 64 175 / var(--tw-bg-opacity));
-}
-
-.hover\:text-blue-600:hover {
-  --tw-text-opacity: 1;
-  color: rgb(37 99 235 / var(--tw-text-opacity));
-}
-
-.hover\:text-blue-800:hover {
-  --tw-text-opacity: 1;
-  color: rgb(30 64 175 / var(--tw-text-opacity));
-}
-
-.hover\:prose-a\:text-blue-800 :is(:where(a):not(:where([class~="not-prose"],[class~="not-prose"] *))):hover {
-  --tw-text-opacity: 1;
-  color: rgb(30 64 175 / var(--tw-text-opacity));
-}
-
-.focus\:border-blue-800:focus {
-  --tw-border-opacity: 1;
-  border-color: rgb(30 64 175 / var(--tw-border-opacity));
-}
-
-.focus-visible\:bg-blue-400:focus-visible {
-  --tw-bg-opacity: 1;
-  background-color: rgb(96 165 250 / var(--tw-bg-opacity));
-}
-
-.focus-visible\:outline-none:focus-visible {
-  outline: 2px solid transparent;
-  outline-offset: 2px;
-}
-
-.disabled\:opacity-50:disabled {
-  opacity: 0.5;
-}
-
-@media (min-width: 640px) {
-  .sm\:text-2xl {
-    font-size: 1.5rem;
-    line-height: 2rem;
-  }
-
-  .sm\:text-4xl {
-    font-size: 2.25rem;
-    line-height: 2.5rem;
-  }
-
-  .sm\:leading-10 {
-    line-height: 2.5rem;
-  }
-}
-
-@media (min-width: 768px) {
-  .md\:mb-0 {
-    margin-bottom: 0px;
-  }
-
-  .md\:mr-4 {
-    margin-right: 1rem;
-  }
-
-  .md\:mt-0 {
-    margin-top: 0px;
-  }
-
-  .md\:block {
-    display: block;
-  }
-
-  .md\:h-96 {
-    height: 24rem;
-  }
-
-  .md\:w-1\/2 {
-    width: 50%;
-  }
-
-  .md\:w-96 {
-    width: 24rem;
-  }
-
-  .md\:max-w-screen-md {
-    max-width: 768px;
-  }
-
-  .md\:grid-cols-4 {
-    grid-template-columns: repeat(4, minmax(0, 1fr));
-  }
-
-  .md\:grid-cols-6 {
-    grid-template-columns: repeat(6, minmax(0, 1fr));
-  }
-
-  .md\:flex-row {
-    flex-direction: row;
-  }
-
-  .md\:items-center {
-    align-items: center;
-  }
-
-  .md\:justify-between {
-    justify-content: space-between;
-  }
-
-  .md\:gap-3 {
-    gap: 0.75rem;
-  }
-
-  .md\:space-y-5 > :not([hidden]) ~ :not([hidden]) {
-    --tw-space-y-reverse: 0;
-    margin-top: calc(1.25rem * calc(1 - var(--tw-space-y-reverse)));
-    margin-bottom: calc(1.25rem * var(--tw-space-y-reverse));
-  }
-
-  .md\:pb-0 {
-    padding-bottom: 0px;
-  }
-
-  .md\:pl-10 {
-    padding-left: 2.5rem;
-  }
-
-  .md\:pl-8 {
-    padding-left: 2rem;
-  }
-
-  .md\:pr-6 {
-    padding-right: 1.5rem;
-  }
-
-  .md\:pt-0 {
-    padding-top: 0px;
-  }
-
-  .md\:pt-10 {
-    padding-top: 2.5rem;
-  }
-
-  .md\:text-2xl {
-    font-size: 1.5rem;
-    line-height: 2rem;
-  }
-
-  .md\:text-3xl {
-    font-size: 1.875rem;
-    line-height: 2.25rem;
-  }
-
-  .md\:text-4xl {
-    font-size: 2.25rem;
-    line-height: 2.5rem;
-  }
-
-  .md\:text-6xl {
-    font-size: 3.75rem;
-    line-height: 1;
-  }
-
-  .md\:text-xl {
-    font-size: 1.25rem;
-    line-height: 1.75rem;
-  }
-
-  .md\:leading-10 {
-    line-height: 2.5rem;
-  }
-
-  .md\:leading-14 {
-    line-height: 3.5rem;
-  }
-}
-
-@media (prefers-color-scheme: dark) {
-  .dark\:divide-gray-700 > :not([hidden]) ~ :not([hidden]) {
-    --tw-divide-opacity: 1;
-    border-color: rgb(55 65 81 / var(--tw-divide-opacity));
-  }
-
-  .dark\:border-blue-400 {
-    --tw-border-opacity: 1;
-    border-color: rgb(96 165 250 / var(--tw-border-opacity));
-  }
-
-  .dark\:border-gray-500 {
-    --tw-border-opacity: 1;
-    border-color: rgb(107 114 128 / var(--tw-border-opacity));
-  }
-
-  .dark\:border-gray-700 {
-    --tw-border-opacity: 1;
-    border-color: rgb(55 65 81 / var(--tw-border-opacity));
-  }
-
-  .dark\:border-gray-900 {
-    --tw-border-opacity: 1;
-    border-color: rgb(17 24 39 / var(--tw-border-opacity));
-  }
-
-  .dark\:bg-blue-400 {
-    --tw-bg-opacity: 1;
-    background-color: rgb(96 165 250 / var(--tw-bg-opacity));
-  }
-
-  .dark\:bg-gray-900 {
-    --tw-bg-opacity: 1;
-    background-color: rgb(17 24 39 / var(--tw-bg-opacity));
-  }
-
-  .dark\:bg-white {
-    --tw-bg-opacity: 1;
-    background-color: rgb(255 255 255 / var(--tw-bg-opacity));
-  }
-
-  .dark\:text-blue-400 {
-    --tw-text-opacity: 1;
-    color: rgb(96 165 250 / var(--tw-text-opacity));
-  }
-
-  .dark\:text-gray-100 {
-    --tw-text-opacity: 1;
-    color: rgb(243 244 246 / var(--tw-text-opacity));
-  }
-
-  .dark\:text-gray-900 {
-    --tw-text-opacity: 1;
-    color: rgb(17 24 39 / var(--tw-text-opacity));
-  }
-
-  .dark\:text-white {
-    --tw-text-opacity: 1;
-    color: rgb(255 255 255 / var(--tw-text-opacity));
-  }
-
-  .dark\:scrollbar-thumb-blue-400 {
-    --scrollbar-thumb: #60a5fa !important;
-  }
-
-  .group:hover .dark\:group-hover\:border-blue-200 {
-    --tw-border-opacity: 1;
-    border-color: rgb(191 219 254 / var(--tw-border-opacity));
-  }
-
-  .group:hover .dark\:group-hover\:border-blue-300 {
-    --tw-border-opacity: 1;
-    border-color: rgb(147 197 253 / var(--tw-border-opacity));
-  }
-
-  .group:hover .dark\:group-hover\:text-blue-200 {
-    --tw-text-opacity: 1;
-    color: rgb(191 219 254 / var(--tw-text-opacity));
-  }
-
-  .group:hover .dark\:group-hover\:text-blue-300 {
-    --tw-text-opacity: 1;
-    color: rgb(147 197 253 / var(--tw-text-opacity));
-  }
-
-  .dark\:hover\:border-blue-200:hover {
-    --tw-border-opacity: 1;
-    border-color: rgb(191 219 254 / var(--tw-border-opacity));
-  }
-
-  .dark\:hover\:border-blue-300:hover {
-    --tw-border-opacity: 1;
-    border-color: rgb(147 197 253 / var(--tw-border-opacity));
-  }
-
-  .dark\:hover\:border-blue-500:hover {
-    --tw-border-opacity: 1;
-    border-color: rgb(59 130 246 / var(--tw-border-opacity));
-  }
-
-  .dark\:hover\:bg-blue-200:hover {
-    --tw-bg-opacity: 1;
-    background-color: rgb(191 219 254 / var(--tw-bg-opacity));
-  }
-
-  .dark\:hover\:bg-blue-300:hover {
-    --tw-bg-opacity: 1;
-    background-color: rgb(147 197 253 / var(--tw-bg-opacity));
-  }
-
-  .dark\:hover\:text-blue-200:hover {
-    --tw-text-opacity: 1;
-    color: rgb(191 219 254 / var(--tw-text-opacity));
-  }
-
-  .dark\:hover\:text-blue-400:hover {
-    --tw-text-opacity: 1;
-    color: rgb(96 165 250 / var(--tw-text-opacity));
-  }
-
-  .dark\:hover\:prose-a\:text-blue-200 :is(:where(a):not(:where([class~="not-prose"],[class~="not-prose"] *))):hover {
-    --tw-text-opacity: 1;
-    color: rgb(191 219 254 / var(--tw-text-opacity));
-  }
-
-  .dark\:focus\:border-blue-200:focus {
-    --tw-border-opacity: 1;
-    border-color: rgb(191 219 254 / var(--tw-border-opacity));
-  }
-}
-
-.\[\&\>\*\]\:h-20>* {
-  height: 5rem;
-}
-
-.\[\&\>\*\]\:h-auto>* {
-  height: auto;
-}
-
-.\[\&\>\*\]\:h-full>* {
-  height: 100%;
-}
-
-.\[\&\>\*\]\:w-20>* {
-  width: 5rem;
-}
-
-.\[\&\>\*\]\:w-full>* {
-  width: 100%;
-}
-
-.\[\&\>svg\]\:-mt-1>svg {
-  margin-top: -0.25rem;
-}
-
-.\[\&\>svg\]\:inline>svg {
-  display: inline;
-}
-
-.\[\&\>svg\]\:h-5>svg {
-  height: 1.25rem;
-}
-
-.\[\&\>svg\]\:h-6>svg {
-  height: 1.5rem;
-}
-
-.\[\&\>svg\]\:h-7>svg {
-  height: 1.75rem;
-}
-
-.\[\&\>svg\]\:w-5>svg {
-  width: 1.25rem;
-}
-
-.\[\&\>svg\]\:w-6>svg {
-  width: 1.5rem;
-}
-
-.\[\&\>svg\]\:w-7>svg {
-  width: 1.75rem;
-}
-
-@media (min-width: 768px) {
-  .\[\&\>svg\]\:md\:-mt-1\.5>svg {
-    margin-top: -0.375rem;
-  }
-
-  .\[\&\>svg\]\:md\:h-7>svg {
-    height: 1.75rem;
-  }
-
-  .\[\&\>svg\]\:md\:w-7>svg {
-    width: 1.75rem;
-  }
-}
diff --git a/src/index.html b/src/index.html
index c871d10e..2b57d387 100644
--- a/src/index.html
+++ b/src/index.html
@@ -24,35 +24,19 @@ meta:
 
 {% if pagination.pageNumber == 0 %}{% include "partials/now/topper.liquid" status:status %}{% endif %} {% for post in pagination.items %} {% if post.data.published %}
 <article class="h-entry">
-  <div
-    class="mb-8 border-b border-gray-200 pb-4 text-gray-800 dark:border-gray-700 dark:text-white"
-  >
-    <a class="no-underline" href="{% if post.data.link %}{{ post.data.link }}{% else %}{{ post.url }}{% endif %}">
-      {% if post.data.link %}
-        <h2 class="[&>svg]:h-5 [&>svg]:w-5 [&>svg]:md:h-7 [&>svg]:md:w-7 [&>svg]:-mt-1 [&>svg]:md:-mt-1.5 [&>svg]:inline icon--bold p-name m-0 text-xl font-black leading-tight tracking-normal hover:text-blue-800 dark:text-white dark:hover:text-blue-200 md:text-2xl ease-in-out duration-300">
-          {% tablericon 'link' post.data.title %}
-          {{ post.data.title }}
-        </h2>
-      {% else %}
-        <h2
-          class="p-name m-0 text-xl font-black leading-tight tracking-normal hover:text-blue-800 dark:text-white dark:hover:text-blue-200 md:text-2xl ease-in-out duration-300"
-        >
-          {{ post.data.title }}
-        </h2>
-      {% endif %}
+    <a class="no-underline" href="{{ post.url }}">
+      <h2>
+        {{ post.data.title }}
+      </h2>
     </a>
     <span class="p-author h-card hidden">{{ meta.siteName }}</span>
-    <div class="my-2 text-sm">
-      <time class="dt-published" datetime="{{ post.date }}">
-        {{ post.date | date: "%m.%Y" }} {% if post.data.link %} • <a class="flex-none font-normal no-underline" href="{{ post.url }}">Permalink</a>{% endif %}
-      </time>
-    </div>
-    <p class="p-summary mt-0">{{ post.data.post_excerpt | markdown }}</p>
-    {% unless post.data.link %}
-      <div class="mt-4 flex items-center justify-between">
-        <a class="flex-none font-normal no-underline" href="{{ post.url }}">Read more &rarr;</a>
-      </div>
-    {% endunless %}
-  </div>
+    <time class="dt-published" datetime="{{ post.date }}">
+      {{ post.date | date: "%m.%Y" }}
+    </time>
+    <p class="p-summary">{{ post.data.post_excerpt | markdown }}</p>
+    <a class="no-underline read-more" href="{{ post.url }}">
+      Read more
+      {% tablericon "arrow-right" "Read more" %}
+  </a>
 </article>
 {% endif %} {% endfor %} {% include "partials/paginator.liquid" %}
diff --git a/src/pages/404.html b/src/pages/404.html
index 01807a82..b8e0ca00 100644
--- a/src/pages/404.html
+++ b/src/pages/404.html
@@ -3,30 +3,20 @@ title: 404
 layout: default
 permalink: /404.html
 ---
-
-{% image './src/assets/img/404.jpg', title, 'border border-blue-600 dark:border-blue-400 rounded-lg overflow-hidden [&>*]:w-full' %}
-<div class="text-center w-full">
-  <h2
-    class="m-0 text-4xl font-black leading-tight tracking-normal dark:text-white md:text-6xl mb-4"
-  >
-    {{ title }}
-  </h2>
-  <h3
-    class="m-0 text-xl font-bold leading-tight tracking-normal dark:text-white md:text-2xl mb-6"
-  >
-    What kind of idiots do you have working here?
-  </h3>
-  <div class="flex justify-center">
-    <a
-      href="/"
-      class="[&>svg]:h-5 [&>svg]:w-5 [&>svg]:inline icon--bold font-semibold py-2 px-4 rounded-full !no-underline !text-white dark:text-gray-900 bg-blue-600 dark:bg-blue-400 hover:bg-blue-800 dark:hover:bg-blue-200"
-    >
-      {% tablericon "receipt-2" "Receipt" %} Skip out on the room service bill
-    </a>
+<div class="four-oh-four__wrapper">
+  {% image './src/assets/img/404.jpg', title, 'image__banner' %}
+  <div class="text-center">
+    <h2 class="page__header">{{ title }}</h2>
+    <h3>What kind of idiots do you have working here?</h3>
+    <div class="flex justify-center">
+      <a href="/" class="pill--button">
+        {% tablericon "receipt-2" "Receipt" %} Skip out on the room service bill
+      </a>
+    </div>
   </div>
+  <hr />
+  {% render "partials/popular-posts.liquid", posts: collections.posts, analytics: analytics %}
 </div>
-<hr />
-{% render "partials/popular-posts.liquid", posts: collections.posts, analytics: analytics %}
 <script>
   document.addEventListener('DOMContentLoaded', function () {
     plausible('404', { props: { path: document.location.pathname } })
diff --git a/src/pages/about.md b/src/pages/about.md
index 5c984675..fa55a89f 100644
--- a/src/pages/about.md
+++ b/src/pages/about.md
@@ -3,14 +3,13 @@ title: About
 layout: default
 permalink: /about.html
 ---
-
-<div class="flex items-center justify-center w-full not-prose mb-6">
-  <div class="border border-blue-600 dark:border-blue-400 bg-white rounded-full overflow-hidden p-4 w-64 h-64 md:w-96 md:h-96 flex items-center [&>*]:w-full [&>*]:h-auto">
+<div class="avatar__wrapper">
+  <div class="avatar">
     {% capture about_alt %}{{ meta.siteName }} - image by David Neal / @reverentgeek{% endcapture %}
     {% image './src/assets/img/avatar.webp', about_alt %}
   </div>
 </div>
-<h1 class="text-xxl font-black -leading-tight tracking-normal dark:text-white md:text-3xl text-center">Hi, I'm Cory</h1>
+<h2 class="page__header text-center">Hi, I'm Cory</h2>
 
 I'm a software developer in Camarillo, California. I enjoy hanging out with my beautiful family and 4 rescue dogs, technology, automation, [music](https://last.fm/user/coryd_), writing, [reading](https://app.thestorygraph.com/profile/coryd), [tv](https://trakt.tv/users/cdransf) and [movies](https://trakt.tv/users/cdransf).
 
diff --git a/src/pages/blogroll.md b/src/pages/blogroll.md
index ba75c6e0..8aa723d9 100644
--- a/src/pages/blogroll.md
+++ b/src/pages/blogroll.md
@@ -4,12 +4,7 @@ layout: default
 permalink: /blogroll.html
 description: 'These are awesome blogs that I enjoy and you may enjoy too.'
 ---
-
-<h2
-  class="m-0 text-xl font-black leading-tight tracking-normal dark:text-white md:text-2xl mb-2"
->
-  {{ title }}
-</h2>
+<h2 class="page__header">{{ title }}</h2>
 
 - [Ashur Cabrera](https://multiline.co/mment)
 - [Chris Burnell](https://chrisburnell.com)
diff --git a/src/pages/contact-success.html b/src/pages/contact-success.html
index 120a5976..966a0b0f 100644
--- a/src/pages/contact-success.html
+++ b/src/pages/contact-success.html
@@ -4,25 +4,12 @@ layout: default
 permalink: /contact/success.html
 ---
 
-<div class="text-center w-full">
-  <h2
-    class="m-0 text-4xl font-black leading-tight tracking-normal dark:text-white md:text-6xl mb-4"
-  >
-    {{ title }}
-  </h2>
-  <h3
-    class="m-0 text-xl font-bold leading-tight tracking-normal dark:text-white md:text-2xl mb-6"
-  >
-    I'll be in touch soon!
-  </h3>
-  <div class="flex justify-center">
-    <a
-      href="/"
-      class="[&>svg]:h-5 [&>svg]:w-5 [&>svg]:inline icon--bold font-semibold py-2 px-4 rounded-full !no-underline !text-white dark:text-gray-900 bg-blue-600 dark:bg-blue-400 hover:bg-blue-800 dark:hover:bg-blue-200"
-    >
-      {% tablericon "home-2" "Home" %} Head home
-    </a>
-  </div>
+<div class="text-center">
+  <h2>{{ title }}</h2>
+  <h3>I'll be in touch soon!</h3>
+  <a href="/" class="pill--button">
+    {% tablericon "home-2" "Home" %} Head home
+  </a>
 </div>
-<hr />
+<hr class="large__spacing" />
 {% render "partials/popular-posts.liquid", posts: collections.posts, analytics: analytics %}
\ No newline at end of file
diff --git a/src/pages/contact.md b/src/pages/contact.md
index 3815bc94..eb7bef61 100644
--- a/src/pages/contact.md
+++ b/src/pages/contact.md
@@ -4,16 +4,10 @@ layout: default
 permalink: /contact.html
 description: 'How to contact me.'
 ---
-
-<h2
-  class="m-0 text-xl font-black leading-tight tracking-normal dark:text-white md:text-2xl mb-2"
->
-  {{ title }}
-</h2>
-
-<div class="flex flex-col md:flex-row">
-  <div class="w-full md:w-1/2 md:pr-6">
-    <p class="mt-0">Fill out the form to get in touch. Or I've got other options 👇🏻</p>
+<h2 class="page__header">{{ title }}</h2>
+<div class="contact__wrapper">
+  <div class="column contact__description">
+    <p>Fill out the form to get in touch. Or I've got other options 👇🏻</p>
     <ul>
       <li>Ping me on <a href="https://social.lol/@cory">Mastodon</a></li>
       <li>Message me on Signal or iMessage (if you have my phone number)</li>
@@ -21,19 +15,19 @@ description: 'How to contact me.'
       <li>File an issue on the appropriate repo over at <a href="https://github.com/cdransf">GitHub</a></li>
     </ul>
   </div>
-  <form class="mt-3 md:mt-0 flex flex-col items-center justify-center w-full md:w-1/2" method="POST" action="/contact/success" name="contact" netlify netlify-honeypot="bot-field">
+  <form class="column" method="POST" action="/contact/success" name="contact" netlify netlify-honeypot="bot-field">
     <label class="hidden">
       Don't fill this out if you're human: <input name="bot-field" />
     </label>
-    <label class="w-full">
+    <label>
       <span class="hidden">Name</span>
-      <input type="text" name="name" placeholder="Name" class="w-full outline-none bg-white dark:bg-gray-900 p-2 mb-6 rounded-sm border border-blue-600 focus:border-blue-800 dark:border-blue-400 dark:focus:border-blue-200 transition-colors ease-in-out duration-300" required />
+      <input type="text" name="name" placeholder="Name" required />
     </label>
-    <label class="w-full">
+    <label>
       <span class="hidden">Email</span>
-      <input type="email" name="email" placeholder="Email" class="w-full outline-none bg-white dark:bg-gray-900 p-2 mb-6 rounded-sm border border-blue-600 focus:border-blue-800 dark:border-blue-400 dark:focus:border-blue-200 transition-colors ease-in-out duration-300" required />
+      <input type="email" name="email" placeholder="Email" required />
     </label>
-    <textarea name="message" placeholder="Message"  class="w-full h-40 resize-none outline-none bg-white dark:bg-gray-900 p-2 mb-6 rounded-sm border border-blue-600 focus:border-blue-800 dark:border-blue-400 dark:focus:border-blue-200 transition-colors ease-in-out duration-300" required></textarea>
-    <button class="pill--button w-1/2" type="submit">Send message</button>
+    <textarea name="message" placeholder="Message" required></textarea>
+    <button class="pill--button" type="submit">Send message</button>
   </form>
 </div>
diff --git a/src/pages/feeds.md b/src/pages/feeds.md
index 17aec7cb..15fe8197 100644
--- a/src/pages/feeds.md
+++ b/src/pages/feeds.md
@@ -5,13 +5,9 @@ permalink: /feeds.html
 description: 'Content feeds exposed by and generated from my site.'
 ---
 
-<h2
-class="m-0 text-xl font-black leading-tight tracking-normal dark:text-white md:text-2xl mb-2"
->
-{{ title }}
-</h2>
+<h2 class="page__header">{{ title }}</h2>
 
-These are web feeds, also known as [RSS](https://en.wikipedia.org/wiki/RSS) or [Atom](<https://en.wikipedia.org/wiki/Atom_(web_standard)>) feeds. Subscribe by copying the URL from the address bar into your newsreader. Visit [About Feeds](https://aboutfeeds.com) to get started with newsreaders and subscribing. It's free.
+These are web feeds, also known as [RSS](https://en.wikipedia.org/wiki/RSS) or [Atom](https://en.wikipedia.org/wiki/Atom_(web_standard)) feeds. Subscribe by copying the URL from the address bar into your newsreader. Visit [About Feeds](https://aboutfeeds.com) to get started with newsreaders and subscribing. It's free.
 
 - Posts ([RSS](https://feedpress.me/coryd) • [JSON](https://feedpress.me/coryd.json)): posts from my site.
 - Links ([RSS](https://feedpress.me/coryd-links) • [JSON](https://feedpress.me/coryd-links.json)): links I've liked.
diff --git a/src/pages/now.html b/src/pages/now.html
index 8b77060a..7aec5b5c 100644
--- a/src/pages/now.html
+++ b/src/pages/now.html
@@ -4,31 +4,31 @@ layout: now
 permalink: /now.html
 description: "See what I'm doing now."
 ---
-<h2 class="[&>svg]:h-5 [&>svg]:w-5 [&>svg]:md:h-7 [&>svg]:md:w-7 [&>svg]:-mt-1 [&>svg]:md:-mt-1.5 [&>svg]:inline icon--bold m-0 text-xl font-black leading-tight tracking-normal dark:text-white md:text-2xl mt-8 mb-4">
+<h2 class="now__section--header">
   {% tablericon "clock-heart" "Currently" %}
   Currently
 </h2>
-<div class="pl-4 md:pl-8">
+<div class="now__section--text">
     {% render "partials/now/status.liquid", status:status %}
-  <p class="my-2 [&>svg]:h-5 [&>svg]:w-5 [&>svg]:inline">
+  <p>
     {% tablericon "map-2" "Map" %}
     Living in Camarillo, California with my beautiful family, 4 rescue dogs and a guinea pig.
   </p>
-  <p class="my-2 [&>svg]:h-5 [&>svg]:w-5 [&>svg]:inline">
+  <p>
     {% tablericon "play-basketball" "NBA - Lakers" %}
     Rooting for the <a href="https://lakers.com">Lakers</a>. 💜💛
   </p>
 </div>
-<h2 class="[&>svg]:h-5 [&>svg]:w-5 [&>svg]:md:h-7 [&>svg]:md:w-7 [&>svg]:-mt-1 [&>svg]:md:-mt-1.5 [&>svg]:inline icon--bold m-0 text-xl font-black leading-tight tracking-normal dark:text-white md:text-2xl mt-8 mb-4">
+<h2 class="now__section--header">
   {% tablericon "terminal-2" "Making" %}
   Making
 </h2>
-<div class="pl-4 md:pl-8">
-  <p class="my-2 [&>svg]:h-5 [&>svg]:w-5 [&>svg]:inline">
+<div class="now__section--text">
+  <p>
     {% tablericon "code" "Hacking" %}
     Hacking away on projects like this page, my <a href="/">blog</a>, and whatever else I can find time for.
   </p>
-  <p class="my-2 [&>svg]:h-5 [&>svg]:w-5 [&>svg]:inline">
+  <p>
     {% tablericon "hand-stop" "Ad and tracker-blocking" %}
     Assembling lists of <a href="https://github.com/cdransf/awesome-adblock">ad and tracker-blocking tools</a>.
   </p>
diff --git a/src/pages/referrals.md b/src/pages/referrals.md
index 812b7173..8bea80fb 100644
--- a/src/pages/referrals.md
+++ b/src/pages/referrals.md
@@ -4,12 +4,7 @@ layout: default
 permalink: /referrals.html
 description: 'Referral links for services that I use.'
 ---
-
-<h2
-  class="m-0 text-xl font-black leading-tight tracking-normal dark:text-white md:text-2xl mb-2"
->
-  {{ title }}
-</h2>
+<h2 class="page__header">{{ title }}</h2>
 
 Referral links for services I use. I save some money, and you do as well if you choose to use them.
 
diff --git a/src/pages/stats.html b/src/pages/stats.html
index 0cd216a5..f30a1c3a 100644
--- a/src/pages/stats.html
+++ b/src/pages/stats.html
@@ -6,10 +6,10 @@ permalink: /stats.html
 <p>My first post was published on <strong class="highlight-text">{{ collections.postStats.firstPostDate | dateToReadableDate }}</strong> and my most recent one was published on <strong class="highlight-text">{{ collections.postStats.lastPostDate | dateToReadableDate }}</strong>. I've published <strong class="highlight-text">{{ collections.postStats.postCount }} posts</strong> containing <strong class="highlight-text">{{ collections.postStats.totalWordCount }} words</strong> and <strong class="highlight-text">{{ collections.postStats.totalCodeBlockCount }} code samples</strong>.</p>
 <p>Posts have, on average, <strong class="highlight-text">{{ collections.postStats.avgWordCount | round }} words</strong> and a gap of <strong class="highlight-text">{{ collections.postStats.avgDays | round }} days</strong> between them.</p>
 <h2>Popular posts</h2>
-<ol class="list-inside pl-5 md:pl-10">
+<ol>
   {% assign posts = collections.posts | getPopularPosts: analytics %}
   {% for post in posts limit: 10 %}
-  <li class="mt-1.5 mb-2">
+  <li>
     <a href="{{post.url}}" title="{{ post.data.title | escape}}">
       {{ post.data.title }}
     </a>
diff --git a/src/pages/tagList.md b/src/pages/tagList.md
index 3bf5938c..9b9f0208 100644
--- a/src/pages/tagList.md
+++ b/src/pages/tagList.md
@@ -11,24 +11,19 @@ templateEngineOverride: liquid,md
 ---
 {% assign posts = collections[tag] | reverse %}
 {% for post in posts %}
-<div class="mb-8 border-b border-gray-200 pb-4 dark:border-gray-700">
-  <a class="!no-underline" href="{{ post.url }}">
-    <h2
-      class="m-0 text-xl font-black leading-tight tracking-normal dark:text-white md:text-2xl"
-    >
-      {{ post.data.title }}
-    </h2>
+<article class="h-entry">
+  <a class="no-underline" href="{{ post.url }}">
+    <h2>{{ post.data.title }}</h2>
   </a>
-  <div class="my-2 text-sm">
-    <time class="dt-published" datetime="{{ post.date }}">
-      {{ post.date | date: "%m.%Y" }}
-    </time>
-  </div>
-  {% if post.data.post_excerpt %}
-  <p class="p-summary mt-0">{{ post.data.post_excerpt | markdown }}</p>
-  {% endif %}
-  <div class="mt-4 flex items-center justify-between">
-    <a class="flex-none font-normal !no-underline" href="{{ post.url }}">Read more &rarr;</a>
-  </div>
-</div>
+  <time class="dt-published" datetime="{{ post.date }}">
+    {{ post.date | date: "%m.%Y" }}
+  </time>
+  {%- if post.data.post_excerpt %}
+    <p class="p-summary">{{ post.data.post_excerpt | markdown }}</p>
+  {% endif -%}
+  <a class="no-underline read-more" href="{{ post.url }}">
+    Read more
+    {% tablericon "arrow-right" "Read more" %}
+  </a>
+</article>
 {% endfor %}
diff --git a/src/pages/tags.md b/src/pages/tags.md
index 49f5dcc9..48eb0b04 100644
--- a/src/pages/tags.md
+++ b/src/pages/tags.md
@@ -6,7 +6,7 @@ permalink: /tags.html
 ---
 {% for tag in collections.tagList %}
 <span>
-  <a href="/tags/{{ tag }}" class="!no-underline">
+  <a href="/tags/{{ tag }}" class="no-underline">
     <button class="pill--button">
       {{ tag }}
     </button>
diff --git a/src/pages/uses.md b/src/pages/uses.md
index 273cbeae..edf18c06 100644
--- a/src/pages/uses.md
+++ b/src/pages/uses.md
@@ -5,18 +5,13 @@ permalink: /uses.html
 description: 'Software, tools and services that I use regularly.'
 image: https://coryd.dev/assets/img/pages/uses.jpg
 ---
-
-<h2
-  class="m-0 text-xl font-black leading-tight tracking-normal dark:text-white md:text-2xl mb-2"
->
-  {{ title }}
-</h2>
+<h2 class="page__header">{{ title }}</h2>
 
 Software and services that I use for work and my own enjoyment.
 
-{% image 'https://coryd.dev/assets/img/pages/uses.jpg', 'My desk', 'border border-blue-600 dark:border-blue-400 rounded-lg overflow-hidden [&>*]:w-full', 'eager' %}
+{% image 'https://coryd.dev/assets/img/pages/uses.jpg', 'My desk', 'image__banner', 'eager' %}
 
-<h3 className="text-xl font-extrabold leading-9 tracking-tight text-gray-900 dark:text-gray-100 sm:text-2xl sm:leading-10 md:text-4xl md:leading-14">Computer setup</h3>
+<h3>Computer setup</h3>
 
 - Midnight MacBook Air (2022 - M2)
 - 27" Dell Monitor
@@ -25,22 +20,22 @@ Software and services that I use for work and my own enjoyment.
 - Homepod Mini for audio
 - Raspberry Pi for Homebridge
 
-<h3 className="text-xl font-extrabold leading-9 tracking-tight text-gray-900 dark:text-gray-100 sm:text-2xl sm:leading-10 md:text-4xl md:leading-14">Desk and chair</h3>
+<h3>Desk and chair</h3>
 
 - My desk is a custom made corner desk I bought on Etsy years ago. It's sturdy, has tons of storage and finally arrived with a chip on the surface to add some character after the first one got lost by the freight company on the journey from Michigan to Los Angeles. I probably _wouldn't_ repeat the experience, but I do love the desk.
 - [Herman Miller Aeron chair](https://www.hermanmiller.com/products/seating/office-chairs/aeron-chairs/): it's pretty comfortable and makes swiveling around my corner desk easy.
 
-<h3 className="text-xl font-extrabold leading-9 tracking-tight text-gray-900 dark:text-gray-100 sm:text-2xl sm:leading-10 md:text-4xl md:leading-14">macOS + iOS</h3>
+<h3>macOS + iOS</h3>
 
 - [Bear](https://bear.app): native, fast and flexible — it's a breeze to use across Apple's ecosystem.
 - [Fantastical](https://flexibits.com/fantastical): the best and most powerful calendaring app for the Apple ecosystem, bar none.
 - [Ivory](https://tapbots.com/ivory): a beautifully designed and extremely well built Mastodon app — I use it as my go-to client across all of my devices.
 
-<h3 className="text-xl font-extrabold leading-9 tracking-tight text-gray-900 dark:text-gray-100 sm:text-2xl sm:leading-10 md:text-4xl md:leading-14">iOS</h3>
+<h3>iOS</h3>
 
 - [FontCase](https://apps.apple.com/us/app/fontcase-manage-your-type/id1205074470): for managing/installing fonts.
 
-<h3 className="text-xl font-extrabold leading-9 tracking-tight text-gray-900 dark:text-gray-100 sm:text-2xl sm:leading-10 md:text-4xl md:leading-14">macOS</h3>
+<h3>macOS</h3>
 
 - [Gmail Desktop](https://github.com/timche/gmail-desktop): yes it's Electron, but it's thoughtfully developed and built (be sure to opt into the latest beta updates ahead of the next major version).
 - [Rectangle](https://rectangleapp.com): to quickly move around/organize/snap application windows. Using a Mac without it now feels like it's broken.
@@ -52,14 +47,14 @@ Software and services that I use for work and my own enjoyment.
 - [SoundSource](https://rogueamoeba.com/soundsource): a handy utility for better, more granular control on macOS.
 - [Sleeve](https://replay.software/sleeve): a lightweight music controller (that also supports scrobbling).
 
-<h3 className="text-xl font-extrabold leading-9 tracking-tight text-gray-900 dark:text-gray-100 sm:text-2xl sm:leading-10 md:text-4xl md:leading-14">Dev tools</h3>
+<h3>Dev tools</h3>
 
 - [Visual Studio Code](https://code.visualstudio.com): the reigning industry standard for web development work.
 - [iTerm2](https://iterm2.com): a more configurable terminal than the one macOS ships with. I've used it for a long time now and it's still my go-to.
 - [Catppuccin](https://github.com/catppuccin): nearly as ubiquitous as Dracula but lighter and more playful, I've started using this theme wherever I'm looking at/reading/writing code.
 - [Mono Lisa](https://monolisa.dev): a relatively new find, I've been enjoying how pleasant and readable this font is (and have even gone so far as to install it on iOS via [FontCase](https://apps.apple.com/us/app/fontcase-manage-your-type/id1205074470)).
 
-<h3 className="text-xl font-extrabold leading-9 tracking-tight text-gray-900 dark:text-gray-100 sm:text-2xl sm:leading-10 md:text-4xl md:leading-14">Services</h3>
+<h3>Services</h3>
 
 - [Gmail](https://www.google.com/gmail/about): it's exceedingly well established and Google's apps are so ubiquitous that it's hard to avoid.
 - <a class="plausible-event-name=NextDNS+referral" href="https://nextdns.io/?from=m56mt3z6">NextDNS</a>: a privacy-focused, set it and forget it DNS service. I use their security features on my home network and a profile with strict ad-blocking rules on all of my devices.
diff --git a/src/posts/2023/displaying-listening-data-from-apple-music-using-musickit.md b/src/posts/2023/displaying-listening-data-from-apple-music-using-musickit.md
index 579ba72a..d49cbbf2 100644
--- a/src/posts/2023/displaying-listening-data-from-apple-music-using-musickit.md
+++ b/src/posts/2023/displaying-listening-data-from-apple-music-using-musickit.md
@@ -205,7 +205,7 @@ The templating for my site is all written in [liquid.js](https://liquidjs.com) a
 
 We have an object containing arrays of objects — we iterate through each object for the appropriate section (tracks aren't displayed at the moment) and build the resulting display[^3]. This isn't perfect by any means, but, it does provide a nice little visualization of what I'm listening to and `240` tracks feels adequate as a rolling window into that activity.
 
-{% image 'https://cdn.coryd.dev/blog/albums-artists.jpg', 'Albums and artists', 'border border-blue-600 dark:border-blue-400 rounded-lg overflow-hidden [&>*]:w-full' %}
+{% image 'https://cdn.coryd.dev/blog/albums-artists.jpg', 'Albums and artists', 'image__banner' %}
 
 [^1]: There are some good options to do this, but there aren't a _ton_ and the age of some of the apps is concerning. [Marvis](https://appaddy.wixsite.com/marvis) is far and away your best choice here.
 [^2]: Making sure that you update the values you obtained, including the path to your downloaded `.p8` file.
diff --git a/src/posts/2023/fastmail-handling-inbound-email-with-regex-filters-now-with-chatgpt.md b/src/posts/2023/fastmail-handling-inbound-email-with-regex-filters-now-with-chatgpt.md
index 460938eb..84693af6 100644
--- a/src/posts/2023/fastmail-handling-inbound-email-with-regex-filters-now-with-chatgpt.md
+++ b/src/posts/2023/fastmail-handling-inbound-email-with-regex-filters-now-with-chatgpt.md
@@ -11,7 +11,7 @@ I've been using Fastmail for years now and have explored a number of different a
 
 For now, I've approached filtering my mail by applying regular expressions to reasonably broad categories of incoming mail[^2]. My thinking with this approach is that will scale better over the long term by applying heuristics to common phrases and patterns in incoming mail without the need to apply rules to senders on a per address or domain basis.
 
-{% image 'https://cdn.coryd.dev/blog/fastmail-workflow.jpg', 'A diagram of my Fastmail workflow', 'border border-blue-600 dark:border-blue-400 rounded-lg overflow-hidden [&>*]:w-full' %}
+{% image 'https://cdn.coryd.dev/blog/fastmail-workflow.jpg', 'A diagram of my Fastmail workflow', 'image__banner' %}
 
 ## Alias-specific rules
 
diff --git a/src/posts/2023/from-ics-to-json-surfacing-anticipated-albums.md b/src/posts/2023/from-ics-to-json-surfacing-anticipated-albums.md
index 4e56755c..3195c2a9 100644
--- a/src/posts/2023/from-ics-to-json-surfacing-anticipated-albums.md
+++ b/src/posts/2023/from-ics-to-json-surfacing-anticipated-albums.md
@@ -47,16 +47,16 @@ Rendering the output is as simple as:
 
 ```liquid
 {% if albumReleases.size > 0 %}
-  <h2 class="m-0 text-xl flex flex-row items-center font-black leading-tight tracking-normal dark:text-white md:text-2xl mt-8 mb-4 [&>svg]:h-7 [&>svg]:w-7">
-    {% tablericon "calendar" "Albums I'm looking forward to" %}
-    <div class="ml-1">Albums I'm looking forward to</div>
+  <h2 class="now__section--header">
+    {% tablericon "calendar-time" "Anticipated albums" %}
+    Anticipated albums
   </h2>
-  <ul class="list-inside list-disc pl-5 md:pl-10">
+  <ul>
     {% for album in albumReleases %}
-      <li class="mt-1.5 mb-2">
-        <span class="font-bold">{{ album.startDate | readableDate }}: </span>
-        <a href="https://{{album.location}}" title="{{album.summary | escape}}">
-          {{album.summary}}
+      <li>
+        <strong>{{ album.date | readableDate }}: </strong>
+        <a href="https://{{album.url}}" title="{{album.title | escape}}">
+          {{album.title}}
         </a>
       </li>
     {% endfor %}
@@ -66,6 +66,6 @@ Rendering the output is as simple as:
 
 {% endraw %}
 Leaving us with:
-{% image 'https://cdn.coryd.dev/blog/album-releases.jpg', 'Albums I\'m looking forward to', 'border border-blue-600 dark:border-blue-400 rounded-lg overflow-hidden [&>*]:w-full' %}
+{% image 'https://cdn.coryd.dev/blog/album-releases.jpg', 'Albums I\'m looking forward to', 'image__banner' %}
 
 [^1]: At this point, a dev playground.
diff --git a/src/posts/2023/it-is-possible-to-both-stream-and-buy-music.md b/src/posts/2023/it-is-possible-to-both-stream-and-buy-music.md
index cf6c5e4d..29d34d0c 100644
--- a/src/posts/2023/it-is-possible-to-both-stream-and-buy-music.md
+++ b/src/posts/2023/it-is-possible-to-both-stream-and-buy-music.md
@@ -5,8 +5,8 @@ description: "I've been streaming music again in part (and I know this is ridicu
 draft: false
 tags:
   - music
-link: https://pxlnv.com/linklog/stream-buy-music/
 ---
+**[Via Pixel Envy](https://pxlnv.com/linklog/stream-buy-music/)**    
 > Streaming services are all the piracy with none of the guilt. It is a broken model that is only slightly better than when this stuff came through illicit downloads from risky places. If someone can buy music outright, artists will benefit, but I cannot see how it implicitly makes them a better music enjoyer.
 
 [I've been streaming music again](https://coryd.dev/posts/2023/i-dont-want-streaming-music/) in part (and I know this is ridiculous) because Spotify is ubiquitous, well-integrated and has a — well — [API that's usable for my purposes](https://coryd.dev/posts/2023/road-to-madness-apple-music-charts/). I still buy music I stream from Bandcamp and archive it and I still buy too many shirts to support bands (I also import missing music into playlists and playlist folders as an analog to albums). I've also been able to scrobble listens more reliably and found some really great bands like [PUP](https://open.spotify.com/artist/6A7uqgC2N1nUhrCLAytHxN). We'll see if it lasts, but it feels like a good balance for now.<!-- excerpt -->
diff --git a/src/posts/2023/migrating-your-letterboxd-data.md b/src/posts/2023/migrating-your-letterboxd-data.md
index 2f2cb777..e3eedf71 100644
--- a/src/posts/2023/migrating-your-letterboxd-data.md
+++ b/src/posts/2023/migrating-your-letterboxd-data.md
@@ -6,8 +6,8 @@ draft: false
 tags:
   - development
   - tech
-link: https://github.com/jensb89/trakt---letterboxd-import
 ---
+**[Via GitHub](https://github.com/jensb89/trakt---letterboxd-import)**    
 In case you missed the news [Letterboxd was acquired](https://www.nytimes.com/2023/09/29/business/media/letterboxd-new-owner.html) and, assurances about nothing changing quickly followed. But, I think it's safe to say we've seen this movie before.<!-- excerpt -->
 
 I went ahead and migrated my watch history from Letterboxd over to [Trakt](https://trakt.tv), which I already use to keep track of the TV shows I'm watching. To do this I used [a tool](https://github.com/jensb89/trakt---letterboxd-import) written by [Jens Brauer](https://github.com/jensb89). Run through the steps in the README and you should be able to export your data from the newly acquired service[^1].
diff --git a/src/posts/2023/now-page-grouping-episodes-of-same-show.md b/src/posts/2023/now-page-grouping-episodes-of-same-show.md
index 591ea8c8..97c5e3bd 100644
--- a/src/posts/2023/now-page-grouping-episodes-of-same-show.md
+++ b/src/posts/2023/now-page-grouping-episodes-of-same-show.md
@@ -14,7 +14,7 @@ I made a minor update to how I'm normalizing TV data for display on my now page.
 
 By _minor_ I mean one of those things that may well break inexplicably depending on where the data lands. Instead of returning a normalized array based directly off the data returned by [Trakt](https://trakt.tv)'s API I'm instead collecting episodes in an array, checking as I iterate through the response to see if an episode of the same show exists and replacing that object with a mutated object designed to display the range of episodes watched for the show.
 
-{% image 'https://cdn.coryd.dev/blog/grouped-tv.jpg', 'Grouped TV episodes', 'border border-blue-600 dark:border-blue-400 rounded-lg overflow-hidden [&>*]:w-full' %}
+{% image 'https://cdn.coryd.dev/blog/grouped-tv.jpg', 'Grouped TV episodes', 'image__banner' %}
 
 {% raw %}
 
diff --git a/src/posts/2023/now-playing-eleventy-netlify-edge-functions-emoji.md b/src/posts/2023/now-playing-eleventy-netlify-edge-functions-emoji.md
index 0c0588a3..ee6dd17b 100644
--- a/src/posts/2023/now-playing-eleventy-netlify-edge-functions-emoji.md
+++ b/src/posts/2023/now-playing-eleventy-netlify-edge-functions-emoji.md
@@ -169,6 +169,6 @@ Finally, if the page this all lives on is loaded by a client without JavaScript
 
 All of this, yields the single line at the bottom of this image — updated on each visit.
 
-{% image 'https://cdn.coryd.dev/blog/now-playing.jpg', 'Now playing', 'border border-blue-600 dark:border-blue-400 rounded-lg overflow-hidden [&>*]:w-full' %}
+{% image 'https://cdn.coryd.dev/blog/now-playing.jpg', 'Now playing', 'image__banner' %}
 
 [^1]: Plus explicit conditions matching David Bowie and Minor Threat.
diff --git a/src/posts/2023/optimizing-for-performance-with-eleventy.md b/src/posts/2023/optimizing-for-performance-with-eleventy.md
index 61967bb8..5f2cbb16 100644
--- a/src/posts/2023/optimizing-for-performance-with-eleventy.md
+++ b/src/posts/2023/optimizing-for-performance-with-eleventy.md
@@ -141,6 +141,6 @@ For this page in particular, the images that are rendered above the fold are set
 
 All of these boilerplate steps leave us with a quick to load, accessible and resilient site:
 
-{% image 'https://cdn.coryd.dev/blog/page-speed.jpg', 'Pagespeed scores for coryd.dev/now', 'border border-blue-600 dark:border-blue-400 rounded-lg overflow-hidden [&>*]:w-full' %}
+{% image 'https://cdn.coryd.dev/blog/page-speed.jpg', 'Pagespeed scores for coryd.dev/now', 'image__banner' %}
 
 [^1]: It's easy, flexible and helps mitigate my lack of an eye for design by providing safe baselines.
diff --git a/src/posts/2023/road-to-madness-apple-music-charts.md b/src/posts/2023/road-to-madness-apple-music-charts.md
index 333e3278..aa2e001f 100644
--- a/src/posts/2023/road-to-madness-apple-music-charts.md
+++ b/src/posts/2023/road-to-madness-apple-music-charts.md
@@ -134,7 +134,7 @@ _Cool_[^4]. GitHub triggers a rebuild of the site every hour, Netlify builds it,
 
 There are some significant issues with this approach: it doesn't capture listens to an album in a loop (like me playing the new Outer Heaven record today — hails 🤘). It can get wonky when my diff function hits a track order that elicits a false positive return value.
 
-{% image 'https://cdn.coryd.dev/blog/charlie.jpg', 'Charlie Day standing in front of charts', 'border border-blue-600 dark:border-blue-400 rounded-lg overflow-hidden [&>*]:w-full' %}
+{% image 'https://cdn.coryd.dev/blog/charlie.jpg', 'Charlie Day standing in front of charts', 'image__banner' %}
 
 "But Cory there's last.fm." I hear this, I love last.fm, but I've got concerns about its age, ownership and maintenance. I don't want to be on the wrong end of a scream test when the wrong (right?) server rack gets decommissioned.
 
diff --git a/tailwind.config.js b/tailwind.config.js
deleted file mode 100644
index 5539fd8c..00000000
--- a/tailwind.config.js
+++ /dev/null
@@ -1,42 +0,0 @@
-module.exports = {
-  theme: {
-    extend: {
-      spacing: {
-        '9/16': '56.25%',
-      },
-      lineHeight: {
-        11: '2.75rem',
-        12: '3rem',
-        13: '3.25rem',
-        14: '3.5rem',
-      },
-      fontFamily: {
-        sans: ['silka', 'Inter', 'Roboto', 'Helvetica Neue', 'Arial Nova', 'Nimbus Sans', 'Arial', 'system-ui', 'sans-serif'],
-        mono: [
-          'ui-monospace',
-          'Cascadia Code',
-          'Source Code Pro',
-          'Menlo',
-          'Consolas',
-          'DejaVu Sans Mono',
-          'monospace',
-        ],
-      },
-      backgroundImage: {
-        'cover-gradient':
-          'linear-gradient(180deg,transparent 0,rgba(0,0,0,.15) 70%,rgba(0,0,0,.5))',
-      },
-    },
-  },
-  corePlugins: {
-    aspectRatio: false,
-  },
-  plugins: [
-    require('@tailwindcss/typography'),
-    require('@tailwindcss/line-clamp'),
-    require('@catppuccin/tailwindcss'),
-    require('@tailwindcss/aspect-ratio'),
-    require('tailwind-scrollbar'),
-  ],
-  content: ['./src/**/*.md', './src/**/*.html', './src/_includes/**/*.liquid'],
-}
diff --git a/tailwind.css b/tailwind.css
deleted file mode 100644
index cd940a38..00000000
--- a/tailwind.css
+++ /dev/null
@@ -1,298 +0,0 @@
-@tailwind base;
-@tailwind components;
-@tailwind utilities;
-
-body {
-  --pagefind-ui-primary: theme(colors.blue.600);
-  --pagefind-ui-text: theme(colors.gray.800);
-  --pagefind-ui-background: theme(colors.white);
-  --pagefind-ui-border: theme(colors.gray.200);
-  --pagefind-ui-tag: theme(colors.gray.200);
-  --pagefind-ui-border-width: 2px;
-  --pagefind-ui-border-radius: 8px;
-  --pagefind-ui-image-border-radius: 8px;
-  --pagefind-ui-image-box-ratio: 3 / 2;
-  --pagefind-ui-font: sans-serif;
-}
-
-body,
-html {
-  @apply font-sans;
-  color: theme(colors.gray.900);
-}
-
-.pagefind-ui__form mark {
-  color: theme(colors.white) !important;
-  background: theme(colors.blue.600) !important;
-}
-
-.pagefind-ui__form .pagefind-ui__result-link {
-  color: theme(colors.blue.600) !important;
-  @apply !ease-in-out;
-  @apply !duration-300;
-}
-
-.pagefind-ui__form .pagefind-ui__result-link:hover,
-.pagefind-ui__form .pagefind-ui__result-link:focus,
-.pagefind-ui__form .pagefind-ui__result-link:active {
-  color: theme(colors.blue.600) !important;
-}
-
-::-moz-selection {
-  color: theme(colors.white);
-  background: theme(colors.blue.600);
-}
-
-::selection {
-  color: theme(colors.white);
-  background: theme(colors.blue.600);
-}
-
-.active,
-.active svg {
-  color: theme(colors.blue.600);
-}
-
-.header-anchor {
-  text-decoration: none !important;
-}
-
-h1 > a.header-anchor {
-  font-weight: 800;
-}
-
-h2 > a.header-anchor {
-  font-weight: 700;
-}
-
-a,
-.prose a {
-  color: theme(colors.blue.600);
-  @apply ease-in-out;
-  @apply duration-300;
-}
-
-a:hover,
-a:focus,
-a:active,
-.prose a:hover,
-.prose a:focus,
-.prose a:active {
-  color: theme(colors.blue.800);
-}
-
-.highlight-text {
-  @apply text-white;
-  @apply p-0.5;
-  background-color: theme(colors.blue.600);
-}
-
-p > a,
-span > a,
-blockquote > a,
-li > a {
-  text-decoration: underline !important;
-}
-
-code {
-  @apply font-mono;
-  @apply text-gray-50;
-  padding: 0.25rem;
-}
-
-pre {
-  border: 1px solid theme(colors.gray.700);
-  border-radius: 0 !important;
-  @apply scrollbar-thin;
-  @apply scrollbar-thumb-blue-600;
-  @apply scrollbar-track-blue-100;
-}
-
-.pill--button {
-  @apply !appearance-none;
-  @apply font-semibold;
-  @apply py-2;
-  @apply px-4;
-  @apply mr-1;
-  @apply mb-3;
-  @apply rounded-full;
-  @apply text-white;
-  @apply transition-colors;
-  @apply ease-in-out;
-  @apply duration-300;
-  background-color: theme(colors.blue.600) !important;
-}
-
-.pill--button.pill--button__small {
-  @apply py-1;
-  @apply px-2;
-  @apply mr-2;
-  @apply mb-2;
-  @apply text-sm;
-  @apply inline-block;
-}
-
-.pill--button:hover,
-.pill--button:active,
-.pill--button:focus {
-  background-color: theme(colors.blue.800) !important;
-}
-
-[data-tablericon-name] {
-  stroke-width: 1.4;
-}
-
-.icon--bold > svg {
-  stroke-width: 2;
-}
-
-.link--icon > svg {
-  color: theme(colors.gray.700);
-  @apply ease-in-out;
-  @apply duration-300;
-}
-
-.link--icon:hover > svg {
-  color: theme(colors.blue.600);
-}
-
-.icon--spin > svg {
-  @apply animate-spin;
-}
-
-.icon--inline > svg {
-  @apply inline;
-}
-
-.pagefind-ui__search-input {
-  @apply !w-full;
-  @apply !outline-none;
-  @apply !bg-white;
-  @apply !rounded-sm;
-  @apply !border;
-  @apply !border-blue-600;
-  @apply !transition-colors;
-  @apply !ease-in-out;
-  @apply !duration-300;
-}
-
-.pagefind-ui__search-input:focus {
-  @apply !border-blue-800;
-}
-
-.post-graph {
-  @apply my-5;
-}
-
-.post-graph__wrapper {
-  @apply relative;
-  @apply h-8;
-  @apply mb-1.5;
-  @apply flex;
-  @apply items-center;
-}
-
-.post-graph__progress {
-  @apply bg-blue-600;
-  @apply h-full;
-}
-
-.post-graph__year {
-  @apply font-mono;
-}
-
-.post-graph__progress,
-.post-graph__data {
-  @apply ml-2.5;
-}
-
-@media (prefers-color-scheme: dark) {
-  body {
-    --pagefind-ui-primary: theme(colors.blue.400);
-    --pagefind-ui-text: theme(colors.white);
-    --pagefind-ui-background: theme(colors.gray.900);
-    --pagefind-ui-border: theme(colors.gray.700);
-    --pagefind-ui-tag: theme(colors.gray.700);
-  }
-
-  a,
-  .prose a {
-    color: theme(colors.blue.400);
-  }
-
-  a:hover,
-  a:focus,
-  a:active,
-  .prose a:hover,
-  .prose a:focus,
-  .prose a:active {
-    color: theme(colors.blue.200);
-  }
-
-  .highlight-text {
-    background-color: theme(colors.blue.400);
-  }
-
-  .link--icon svg {
-    color: theme(colors.gray.200);
-  }
-
-  .link--icon:hover svg {
-    color: theme(colors.blue.200);
-  }
-
-  .pagefind-ui__form mark {
-    background: theme(colors.blue.400) !important;
-  }
-
-  .pagefind-ui__form .pagefind-ui__result-link {
-    color: theme(colors.blue.400) !important;
-  }
-
-  .pagefind-ui__form .pagefind-ui__result-link:hover,
-  .pagefind-ui__form .pagefind-ui__result-link:focus,
-  .pagefind-ui__form .pagefind-ui__result-link:active {
-    color: theme(colors.blue.600) !important;
-  }
-
-  ::-moz-selection {
-    background: theme(colors.blue.400);
-  }
-
-  ::selection {
-    background: theme(colors.blue.400);
-  }
-
-  .active,
-  .active svg {
-    color: theme(colors.blue.400);
-  }
-
-  pre {
-    @apply scrollbar-thumb-blue-400;
-  }
-
-  .pill--button {
-    color: theme(colors.white);
-    background: theme(colors.blue.400);
-  }
-
-  .pill--button:hover,
-  .pill--button:active,
-  .pill--button:focus {
-    background: theme(colors.blue.200);
-  }
-
-  .pagefind-ui__search-input {
-    @apply !border-blue-400;
-    @apply !bg-gray-900
-  }
-
-  .pagefind-ui__search-input:focus {
-    @apply !border-blue-200
-  }
-
-  .post-graph__progress {
-    @apply bg-blue-400;
-  }
-}