diff --git a/.eleventy.js b/.eleventy.js
index b788742..aa2abe7 100644
--- a/.eleventy.js
+++ b/.eleventy.js
@@ -1,168 +1,190 @@
-import dotenv from "dotenv"
-import fs from "fs"
-import path from "path"
-import { DateTime } from "luxon"
-import hljs from "highlight.js"
-import markdownIt from "markdown-it"
-import anchor from "markdown-it-anchor"
-import bracketedSpans from "markdown-it-bracketed-spans"
-import attrs from "markdown-it-attrs"
-import toc from "markdown-it-table-of-contents"
-import mark from "markdown-it-mark"
-import rssPlugin from "@11ty/eleventy-plugin-rss"
-
-dotenv.config()
-
-export default function (eleventyConfig) {
-  const isDevelopment = process.env.NODE_ENV === "development"
-  const markdownItConfig = markdownIt({
-    html: true,
-    linkify: true,
-    typographer: true,
-    highlight: function (str, lang) {
-      if (lang && hljs.getLanguage(lang)) {
-        try {
-          return hljs.highlight(str, { language: lang }).value
-        } catch (__) { }
-      }
-      return ""
-    },
-  })
-    .use(anchor, {
-      permalink: anchor.permalink.linkAfterHeader({
-        style: "visually-hidden",
-        assistiveText: (title) => `Link to heading “${title}”`,
-        visuallyHiddenClass: "sr-only",
-        wrapper: ['<div class="header-wrapper">', '</div>'],
-      }),
-    })
-    .use(bracketedSpans)
-    .use(attrs, {
-      leftDelimiter: "{",
-      rightDelimiter: "}",
-      allowedAttributes: [],
-    })
-    .use(toc, {
-      includeLevel: [1, 2, 3],
-      containerHeaderHtml: `<div class="toc-container-header">Table of Contents</div>`,
-    })
-    .use(mark)
-
-  eleventyConfig.setLibrary("md", markdownItConfig)
-  eleventyConfig.addGlobalData("isDevelopment", isDevelopment)
-
-  eleventyConfig.addPlugin(rssPlugin, {
-    posthtmlRenderOptions: {
-      closingSingleTag: "default",
-    },
-  })
-
-  eleventyConfig.addPassthroughCopy({
-    "src/assets/*.pdf": "assets",
-    "src/assets/images": "images",
-    "src/assets/js/*": "js",
-    "src/admin/*": "admin",
-    "settings.json": "settings.json",
-    "src/robots.txt": "robots.txt"
-  })
-
-  eleventyConfig.addFilter("postDate", (dateObj) => {
-    if (typeof dateObj !== "object") dateObj = new Date(dateObj)
-    return DateTime.fromJSDate(dateObj).toLocaleString(DateTime.DATE_MED)
-  })
-
-  eleventyConfig.addFilter("reverseGroupedPosts", (object) =>
-    Object.entries(object).sort((a, b) => b[0] - a[0])
-  )
-
-  eleventyConfig.addFilter("htmlDateString", (dateObj) => {
-    let date = new Date(dateObj)
-    return date.toISOString()
-  })
-
-  eleventyConfig.addFilter("postYear", (dateObj) => {
-    return DateTime.fromJSDate(dateObj).toLocaleString({ year: "numeric" })
-  })
-
-  eleventyConfig.addFilter("sliceRecent", (array) => {
-    return array.slice(0, 3)
-  })
-
-  eleventyConfig.addFilter("clipText", (string, size = 12, separator = "-") => {
-    return string.split(separator).splice(0, size).join(separator)
-  })
-
-  eleventyConfig.addFilter("serializeTitle", (string, yearSplice = 2) => {
-    const titleParts = string.split("-")
-    const [year, ...title] = titleParts
-    const titleInitials = title.map((title) => title.split("")[0]).join("")
-    const yearSuffix = year.slice(-yearSplice)
-
-    return `${yearSuffix}-${titleInitials}`
-  })
-
-  eleventyConfig.addFilter("development", (link) => {
-    return isDevelopment ? "/" : link
-  })
-
-  eleventyConfig.addFilter("breakLine", (string, cutAt = 3, maxSize = 30) => {
-    const titleWords = string.split(" ")
-    const titleLength = string.length
-    const titlePreview = titleWords.slice(0, cutAt).join(" ")
-    const titleRemaining = titleWords.slice(cutAt).join(" ")
-
-    const hasTitleRemaining = !!titleRemaining
-    const formattedTitleWithBreak = hasTitleRemaining
-      ? `${titlePreview}<br/>${titleRemaining}`
-      : titlePreview
-
-    return titleLength <= maxSize || !hasTitleRemaining
-      ? string
-      : formattedTitleWithBreak
-  })
-
-  eleventyConfig.addFilter("svg", (fileName, index) => {
-    const filePath = path.join(process.cwd(), "src/assets/svg", fileName)
-    try {
-      let svgContent = fs.readFileSync(filePath, "utf8")
-      if (index) {
-        svgContent = svgContent.replace(
-          "<svg",
-          `<svg data-animation="fade-in" data-delay=${index}`
-        )
-      }
-      return svgContent
-    } catch (error) {
-      return `<!-- SVG ${fileName} not found -->`
-    }
-  })
-
-  eleventyConfig.addFilter("renderMarkdown", (text) => {
-    return markdownItConfig.render(text)
-  })
-
-  eleventyConfig.addFilter("renderMarkdownInline", (text) => {
-    return markdownItConfig.renderInline(text)
-  })
-
-  eleventyConfig.addFilter("featuredDate", (string) => {
-    let date = new Date(string)
-    return date.toLocaleDateString("en-us", {
-      year: "numeric",
-      month: "short",
-      day: "numeric",
-    })
-  })
-
-  return {
-    templateFormats: ["md", "njk", "html", "liquid"],
-    markdownTemplateEngine: "liquid",
-    htmlTemplateEngine: "njk",
-    dataTemplateEngine: "njk",
-    dir: {
-      data: "_data",
-      input: "src",
-      output: "public",
-    },
-  }
+import fs from "fs"
+import path from "path"
+import dotenv from "dotenv"
+import { DateTime } from "luxon"
+import highlight from "highlight.js"
+import highlightDiff from "highlightjs-code-diff"
+import highlightjsLines from "./lib/highlightjs-lines.js"
+import markdownIt from "markdown-it"
+import anchor from "markdown-it-anchor"
+import bracketedSpans from "markdown-it-bracketed-spans"
+import attrs from "markdown-it-attrs"
+import toc from "markdown-it-table-of-contents"
+import mark from "markdown-it-mark"
+import { eleventyImageTransformPlugin } from "@11ty/eleventy-img"
+import rssPlugin from "@11ty/eleventy-plugin-rss"
+import link from "./src/_data/link.json" with {type: 'json'}
+dotenv.config()
+
+export default function (eleventyConfig) {
+  const isDevelopment = process.env.NODE_ENV === "development"
+  const hljs = highlightjsLines(highlightDiff(highlight))
+  const markdownItConfig = markdownIt({
+    html: true,
+    linkify: true,
+    typographer: true,
+    highlight: function (str, lang) {
+      const processLang = lang.replace("diff:", "")
+      if (lang && hljs.getLanguage(processLang)) {
+        try {
+          const returnValue = hljs.highlight(str, { language: lang }).value
+          return returnValue
+        } catch (__) { }
+      }
+      return ""
+    },
+  })
+    .use(anchor, {
+      permalink: anchor.permalink.linkAfterHeader({
+        style: "visually-hidden",
+        assistiveText: (title) => `Link to heading “${title}”`,
+        visuallyHiddenClass: "sr-only",
+        wrapper: ['<div class="header-wrapper">', '</div>'],
+      }),
+    })
+    .use(bracketedSpans)
+    .use(attrs, {
+      leftDelimiter: "{",
+      rightDelimiter: "}",
+      allowedAttributes: [],
+    })
+    .use(toc, {
+      includeLevel: [1, 2, 3],
+      containerHeaderHtml: `<div class="toc-container-header">Table of Contents</div>`,
+    })
+    .use(mark)
+
+  eleventyConfig.setLibrary("md", markdownItConfig)
+  eleventyConfig.addGlobalData("isDevelopment", isDevelopment)
+
+  eleventyConfig.addPlugin(rssPlugin, {
+    posthtmlRenderOptions: {
+      closingSingleTag: "default",
+    },
+  })
+
+  eleventyConfig.addPlugin(eleventyImageTransformPlugin, {
+    outputDir: "./images"
+  });
+
+  eleventyConfig.addPassthroughCopy({
+    "src/assets/*.pdf": "assets",
+    "src/assets/images": "images",
+    "src/admin/*": "admin",
+    "settings.json": "settings.json",
+    "src/robots.txt": "robots.txt",
+    "src/*.xsl": "/"
+  })
+
+  if (isDevelopment) {
+    eleventyConfig.addPassthroughCopy({
+      "src/assets/js": "js",
+    })
+  }
+
+  eleventyConfig.addFilter("postDate", (dateObj) => {
+    if (typeof dateObj !== "object") dateObj = new Date(dateObj)
+    return DateTime.fromJSDate(dateObj).toLocaleString(DateTime.DATE_MED)
+  })
+
+  eleventyConfig.addFilter("reverseGroupedPosts", (object) =>
+    Object.entries(object).sort((a, b) => b[0] - a[0])
+  )
+
+  eleventyConfig.addFilter("htmlDateString", (dateObj) => {
+    let date = new Date(dateObj)
+    return date.toISOString()
+  })
+
+  eleventyConfig.addFilter("convertToValidURL", (url) => {
+    if (url.startsWith('http')) return url
+    const validURL = new URL(url.replace("\/assets\/",""), (isDevelopment) ? "http://localhost" : link.website)
+    return validURL
+  })
+
+  eleventyConfig.addFilter("postYear", (dateObj) => {
+    return DateTime.fromJSDate(dateObj).toLocaleString({ year: "numeric" })
+  })
+
+  eleventyConfig.addFilter("sliceRecent", (array) => {
+    return array.slice(0, 3)
+  })
+
+  eleventyConfig.addFilter("clipText", (string, size = 12, separator = "-") => {
+    return string.split(separator).splice(0, size).join(separator)
+  })
+
+  eleventyConfig.addFilter("serializeTitle", (string, yearSplice = 2) => {
+    const titleParts = string.split("-")
+    const [year, ...title] = titleParts
+    const titleInitials = title.map((title) => title.split("")[0]).join("")
+    const yearSuffix = year.slice(-yearSplice)
+
+    return `${yearSuffix}-${titleInitials}`
+  })
+
+  eleventyConfig.addFilter("development", (link) => {
+    return isDevelopment ? "/" : link
+  })
+
+  eleventyConfig.addFilter("breakLine", (string, cutAt = 3, maxSize = 30) => {
+    const titleWords = string.split(" ")
+    const titleLength = string.length
+    const titlePreview = titleWords.slice(0, cutAt).join(" ")
+    const titleRemaining = titleWords.slice(cutAt).join(" ")
+
+    const hasTitleRemaining = !!titleRemaining
+    const formattedTitleWithBreak = hasTitleRemaining
+      ? `${titlePreview}<br/>${titleRemaining}`
+      : titlePreview
+
+    return titleLength <= maxSize || !hasTitleRemaining
+      ? string
+      : formattedTitleWithBreak
+  })
+
+  eleventyConfig.addFilter("svg", (fileName, index) => {
+    const filePath = path.join(process.cwd(), "src/assets/svg", fileName)
+    try {
+      let svgContent = fs.readFileSync(filePath, "utf8")
+      if (index) {
+        svgContent = svgContent.replace(
+          "<svg",
+          `<svg data-animation="fade-in" data-delay=${index}`
+        )
+      }
+      return svgContent
+    } catch (error) {
+      return `<!-- SVG ${fileName} not found -->`
+    }
+  })
+
+  eleventyConfig.addFilter("renderMarkdown", (text) => {
+    return markdownItConfig.render(text)
+  })
+
+  eleventyConfig.addFilter("renderMarkdownInline", (text) => {
+    return markdownItConfig.renderInline(text)
+  })
+
+  eleventyConfig.addFilter("featuredDate", (string) => {
+    let date = new Date(string)
+    return date.toLocaleDateString("en-us", {
+      year: "numeric",
+      month: "short",
+      day: "numeric",
+    })
+  })
+
+  return {
+    templateFormats: ["md", "njk", "html", "liquid"],
+    markdownTemplateEngine: "liquid",
+    htmlTemplateEngine: "njk",
+    dataTemplateEngine: "njk",
+    dir: {
+      data: "_data",
+      input: "src",
+      output: "public",
+    },
+  }
 }
\ No newline at end of file
diff --git a/.gitattributes b/.gitattributes
new file mode 100644
index 0000000..a5ad5f2
--- /dev/null
+++ b/.gitattributes
@@ -0,0 +1 @@
+src/pretty-atom-feed.xsl linguist-vendored
\ No newline at end of file
diff --git a/.github/workflows/highlightjs-lines.yml b/.github/workflows/highlightjs-lines.yml
new file mode 100644
index 0000000..4a28bd1
--- /dev/null
+++ b/.github/workflows/highlightjs-lines.yml
@@ -0,0 +1,25 @@
+name: Highlightjs-lines Test
+
+on:
+  push:
+    branches: [ "main" ]
+  pull_request:
+    branches: [ "main" ]
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+
+    strategy:
+      matrix:
+        node-version: [20.x, 22.x, 24.x]
+
+    steps:
+    - uses: actions/checkout@v4
+    - name: Use Node.js ${{ matrix.node-version }}
+      uses: actions/setup-node@v4
+      with:
+        node-version: ${{ matrix.node-version }}
+        cache: 'npm'
+    - run: npm install
+    - run: npm test
diff --git a/.github/workflows/playwright.yml b/.github/workflows/playwright.yml
new file mode 100644
index 0000000..3eb1314
--- /dev/null
+++ b/.github/workflows/playwright.yml
@@ -0,0 +1,27 @@
+name: Playwright Tests
+on:
+  push:
+    branches: [ main, master ]
+  pull_request:
+    branches: [ main, master ]
+jobs:
+  test:
+    timeout-minutes: 60
+    runs-on: ubuntu-latest
+    steps:
+    - uses: actions/checkout@v4
+    - uses: actions/setup-node@v4
+      with:
+        node-version: lts/*
+    - name: Install dependencies
+      run: npm ci
+    - name: Install Playwright Browsers
+      run: npx playwright install --with-deps
+    - name: Run Playwright tests
+      run: npx playwright test
+    - uses: actions/upload-artifact@v4
+      if: ${{ !cancelled() }}
+      with:
+        name: playwright-report
+        path: playwright-report/
+        retention-days: 30
diff --git a/.gitignore b/.gitignore
index 427103d..60b0dd0 100644
--- a/.gitignore
+++ b/.gitignore
@@ -6,4 +6,13 @@
 /public
 .vscode
 
-# /src/blog/example/*
\ No newline at end of file
+# /src/blog/example/*
+
+.cache
+
+# Playwright
+node_modules/
+/test-results/
+/playwright-report/
+/blob-report/
+/playwright/.cache/
diff --git a/.prettierignore b/.prettierignore
new file mode 100644
index 0000000..d2ba654
--- /dev/null
+++ b/.prettierignore
@@ -0,0 +1,6 @@
+/node_modules
+.env
+.vscode
+.cache
+/**/sitemap.njk
+/**/feed.njk
diff --git a/.prettierrc b/.prettierrc
index f00e0b0..6a63f7b 100644
--- a/.prettierrc
+++ b/.prettierrc
@@ -1,6 +1,8 @@
 {
-    "trailingComma": "es5",
-    "tabWidth": 2,
-    "semi": false,
-    "singleQuote": true
-  }
\ No newline at end of file
+  "trailingComma": "es5",
+  "tabWidth": 2,
+  "semi": false,
+  "singleQuote": true,
+  "singleAttributePerLine": false,
+  "bracketSameLine": true
+}
diff --git a/LICENSE b/LICENSE
index ce6324d..5fffaf6 100644
--- a/LICENSE
+++ b/LICENSE
@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2021 Stevarth
+Copyright (c) 2025 Stevarth
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal
diff --git a/README.abs-ID.md b/README.abs-ID.md
index ad31804..5fa83a1 100644
--- a/README.abs-ID.md
+++ b/README.abs-ID.md
@@ -10,6 +10,11 @@ en: This documents is not updated to the latest version. please read the english
 [![Repository Forks](https://img.shields.io/github/forks/EmptyWork/emptywork.github.io?style=for-the-badge)]()
 [![License](https://img.shields.io/github/license/EmptyWork/emptywork.github.io?style=for-the-badge)](https://github.com/EmptyWork/emptywork.github.io/blob/master/LICENSE)
 [![Netlify Status](https://img.shields.io/netlify/08d2d578-7470-4e65-8067-93ab5e09f671?style=for-the-badge)](https://app.netlify.com/sites/emptywork/deploys)
+![Playwright Test](https://img.shields.io/github/actions/workflow/status/emptywork/emptywork.github.io/playwright.yml?style=for-the-badge&label=Playwright%20Test)
+
+---
+
+![Highlightjs-lines Test](https://img.shields.io/github/actions/workflow/status/emptywork/emptywork.github.io/highlightjs-lines.yml?style=for-the-badge&label=Highlightjs-lines%20Test)
 
 [**⚠Laporkan Bug**](https://github.com/EmptyWork/emptywork.github.io/issues/new) — [**📧Minta Fitur**](https://github.com/EmptyWork/emptywork.github.io/issues/new)
 
diff --git a/README.id-ID.md b/README.id-ID.md
index 1e883d3..6f67035 100644
--- a/README.id-ID.md
+++ b/README.id-ID.md
@@ -10,6 +10,11 @@ en: This documents is not updated to the latest version. please read the english
 [![Repository Forks](https://img.shields.io/github/forks/EmptyWork/emptywork.github.io?style=for-the-badge)]()
 [![License](https://img.shields.io/github/license/EmptyWork/emptywork.github.io?style=for-the-badge)](https://github.com/EmptyWork/emptywork.github.io/blob/master/LICENSE)
 [![Netlify Status](https://img.shields.io/netlify/08d2d578-7470-4e65-8067-93ab5e09f671?style=for-the-badge)](https://app.netlify.com/sites/emptywork/deploys)
+![Playwright Test](https://img.shields.io/github/actions/workflow/status/emptywork/emptywork.github.io/playwright.yml?style=for-the-badge&label=Playwright%20Test)
+
+---
+
+![Highlightjs-lines Test](https://img.shields.io/github/actions/workflow/status/emptywork/emptywork.github.io/highlightjs-lines.yml?style=for-the-badge&label=Highlightjs-lines%20Test)
 
 [**⚠Laporkan Bug**](https://github.com/EmptyWork/emptywork.github.io/issues/new) — [**📧Minta Fitur**](https://github.com/EmptyWork/emptywork.github.io/issues/new)
 
diff --git a/README.md b/README.md
index 7c7e07a..936ee69 100644
--- a/README.md
+++ b/README.md
@@ -4,6 +4,11 @@
 [![Repository Forks](https://img.shields.io/github/forks/EmptyWork/emptywork.github.io?style=for-the-badge)]()
 [![License](https://img.shields.io/github/license/EmptyWork/emptywork.github.io?style=for-the-badge)](https://github.com/EmptyWork/emptywork.github.io/blob/master/LICENSE)
 [![Netlify Status](https://img.shields.io/netlify/08d2d578-7470-4e65-8067-93ab5e09f671?style=for-the-badge)](https://app.netlify.com/sites/emptywork/deploys)
+![Playwright Test](https://img.shields.io/github/actions/workflow/status/emptywork/emptywork.github.io/playwright.yml?style=for-the-badge&label=Playwright%20Test)
+
+---
+
+![Highlightjs-lines Test](https://img.shields.io/github/actions/workflow/status/emptywork/emptywork.github.io/highlightjs-lines.yml?style=for-the-badge&label=Highlightjs-lines%20Test)
 
 [**⚠ Report Bug**](https://github.com/EmptyWork/emptywork.github.io/issues/new) — [**📧 Request Feature**](https://github.com/EmptyWork/emptywork.github.io/issues/new)
 
diff --git a/archives/error.scss b/archives/error.scss
deleted file mode 100644
index 9780e4e..0000000
--- a/archives/error.scss
+++ /dev/null
@@ -1,14 +0,0 @@
-@import './modules/vars';
-@import './modules/mixin';
-@import './modules/global';
-
-@import './modules/component/preload';
-
-@import './modules/header';
-@import './modules/component/nav';
-@import './modules/component/title';
-@import './modules/main';
-@import './modules/footer';
-
-@import './modules/component/contact';
-@import './modules/component/error';
diff --git a/archives/modules/_footer.scss b/archives/modules/_footer.scss
deleted file mode 100644
index 0c2cf20..0000000
--- a/archives/modules/_footer.scss
+++ /dev/null
@@ -1,70 +0,0 @@
-.footer {
-  background-color: var(--clr-background);
-  color: var(--clr-foreground);
-  padding: 0.8rem;
-
-  .brand {
-    display: flex;
-    gap: 0.5rem;
-    width: max-content;
-
-    &-title {
-      font-size: 1.3rem;
-      font-weight: 700;
-    }
-
-    &-logo {
-      display: flex;
-      align-items: center;
-    }
-  }
-
-  &-top {
-    padding: 0.8rem;
-    padding-top: 3rem;
-    font-size: 2rem;
-    max-width: 35ch;
-    line-height: 1.2;
-    position: relative;
-    isolation: isolate;
-
-    &::before {
-      content: '"';
-      position: absolute;
-      font-size: 4em;
-      left: 0;
-      top: 0;
-      color: var(--clr-background-800);
-      font-weight: 600;
-      user-select: none;
-      z-index: -1;
-    }
-  }
-
-  &-bottom {
-    padding: 0.8rem;
-    text-align: left;
-    display: flex;
-    flex-direction: column;
-    gap: 0.3em;
-  }
-
-  &-container {
-    max-width: 64rem;
-    margin: 0 auto;
-  }
-
-  .copyright {
-    font-size: 0.9rem;
-    margin: 1rem auto;
-    text-align: left;
-    border: 0.0625rem solid var(--clr-foreground);
-    width: 100%;
-    max-width: max-content;
-    padding: 0.2rem 2rem;
-
-    @include breakpoint-up('medium') {
-      flex-direction: row;
-    }
-  }
-}
diff --git a/archives/modules/_global.scss b/archives/modules/_global.scss
deleted file mode 100644
index 93455cf..0000000
--- a/archives/modules/_global.scss
+++ /dev/null
@@ -1,163 +0,0 @@
-html {
-  scroll-behavior: smooth;
-  scroll-padding-top: 10rem;
-  scroll-padding-bottom: 10rem;
-}
-
-html:root {
-  .themes {
-    background-color: #ffc107;
-    color: #7e620e;
-  }
-
-  [data-moon] {
-    display: none;
-  }
-
-  [data-sun] {
-    display: block;
-  }
-
-  &[data-theme="dark"] {
-    .themes {
-      background-color: var(--clr-accent);
-      color: var(--clr-accent-dark);
-    }
-
-    [data-sun] {
-      display: none;
-    }
-
-    [data-moon] {
-      display: block;
-    }
-  }
-}
-
-*,
-*:is(::after, ::before) {
-  box-sizing: border-box;
-  margin: 0;
-  padding: 0;
-}
-
-body {
-  display: flex;
-  flex-direction: column;
-  min-height: 100vh;
-  background-color: var(--clr-background-900);
-  font-family: 'Montserrat', sans-serif;
-  color: var(--clr-foreground);
-  line-height: 1.6;
-  overflow-x: hidden;
-}
-
-a,
-a:is(:active, :hover, :focus-visible) {
-  color: inherit;
-  text-decoration: none;
-}
-
-a:is(:hover, :focus-visible) {
-  color: var(--clr-accent);
-}
-
-a[href] {
-  position: relative;
-
-  .new-tab-warning {
-    position: absolute;
-    width: max-content;
-    background-color: hsl(0, 0%, 13%);
-    font-weight: normal;
-    letter-spacing: normal;
-    color: var(--clr-white) !important;
-    padding: 0.3rem;
-    font-size: 0.7rem;
-    border-radius: 0.3rem;
-    margin-top: 0.5rem;
-    top: 100%;
-    left: 0;
-    visibility: hidden;
-    pointer-events: none;
-    text-transform: capitalize;
-    transition: all 300ms ease-out;
-    translate: 0 -0.3rem;
-    z-index: 90;
-    user-select: none;
-  }
-
-  &:focus-visible {
-    .new-tab-warning {
-      visibility: visible;
-      translate: 0 0;
-    }
-  }
-}
-
-::selection {
-  background-color: var(--clr-accent);
-  color: var(--clr-white);
-}
-
-.t-all {
-  transition: all 300ms ease-in;
-}
-
-.no-scroll {
-  @include breakpoint-down('small') {
-    overflow: hidden !important;
-
-    :is(header, main, footer) {
-      visibility: hidden;
-      user-select: none;
-    }
-  }
-}
-
-.not-loaded {
-  overflow: hidden;
-
-  :is(header, main, footer, nav) {
-    visibility: hidden;
-    user-select: none;
-  }
-}
-
-:is(ul, li) {
-  margin: 0;
-  padding: 0;
-}
-
-li {
-  list-style: none;
-}
-
-*:focus-visible {
-  outline: 0.125rem solid var(--clr-accent-dark);
-}
-
-.highlight {
-  background-color: var(--clr-black);
-  padding: 0.2rem 0.6rem;
-  color: var(--clr-white);
-
-  &:is(:hover, :focus) {
-    color: var(--clr-white);
-  }
-}
-
-.header-link__access {
-  text-decoration: none !important;
-}
-
-.sr-only {
-  border: 0;
-  clip: rect(0 0 0 0);
-  height: 0.0625rem;
-  margin: -0.0625rem;
-  overflow: hidden;
-  padding: 0;
-  position: absolute;
-  width: 0.0625rem;
-}
\ No newline at end of file
diff --git a/archives/modules/_header.scss b/archives/modules/_header.scss
deleted file mode 100644
index d86013c..0000000
--- a/archives/modules/_header.scss
+++ /dev/null
@@ -1,21 +0,0 @@
-.header {
-  &_article {
-    all: unset;
-    position: relative;
-    width: 100vw;
-    aspect-ratio: 16/9;
-    height: fit-content;
-    max-height: 60vh;
-    overflow: hidden;
-    margin: 0 auto;
-
-    img {
-      top: 50%;
-      translate: 0 -50%;
-      position: absolute;
-      aspect-ratio: 16 / 9;
-      width: 100%;
-      height: auto;
-    }
-  }
-}
diff --git a/archives/modules/_main.scss b/archives/modules/_main.scss
deleted file mode 100644
index 4ed5feb..0000000
--- a/archives/modules/_main.scss
+++ /dev/null
@@ -1,174 +0,0 @@
-.main {
-  background-color: var(--clr-background-900);
-  flex: 1 0 auto;
-  display: flex;
-  flex-direction: column;
-  gap: 6rem;
-  overflow: hidden;
-
-  &-container {
-    max-width: 64rem;
-    margin: 0 auto;
-    padding: 3rem 2rem;
-    width: 100%;
-  }
-
-  .section {
-    &-more {
-      display: block;
-      width: 100%;
-      padding: 1em;
-      border: 0.0625em solid var(--clr-foreground);
-      margin-top: 1em;
-      border-radius: 0.3em;
-
-      &:is(:hover, :focus) {
-        background-color: var(--clr-accent);
-        border-color: var(--clr-accent-light);
-        color: var(--clr-white);
-      }
-    }
-
-    &-header {
-      display: flex;
-      flex-direction: row;
-      align-items: center;
-      z-index: 3;
-      gap: 2em;
-      font-size: 1.2rem;
-      text-transform: uppercase;
-      letter-spacing: 0.1em;
-
-      .header-title {
-        display: flex;
-        line-height: 1;
-        gap: 0.6em;
-
-        a {
-          height: max-content;
-        }
-      }
-
-      span {
-        text-transform: none;
-        letter-spacing: 0;
-      }
-
-      @include breakpoint-down('large') {
-        flex-direction: column;
-        align-items: flex-start;
-        gap: 0;
-
-        span {
-          &::before {
-            display: none;
-          }
-        }
-      }
-
-      .header-desc {
-        display: block;
-        position: relative;
-        font-size: 0.9rem;
-        color: var(--clr-foreground-700);
-
-        &::before {
-          content: '';
-          position: absolute;
-          left: 0;
-          border: 0.1875em solid var(--clr-foreground);
-          top: 50%;
-          translate: 0 -50%;
-          margin-left: -1em;
-          border-radius: 50%;
-        }
-      }
-    }
-  }
-}
-
-.blog {
-  .main-container {
-    padding-inline: 0;
-
-    >*:not(ul) {
-      width: min(min(100vw - 4rem, 60rem), 58rem);
-      margin-inline: auto;
-    }
-  }
-}
-
-.work {
-  position: relative;
-  isolation: isolate;
-  padding-top: 4rem;
-
-  &-svg {
-    &_bottom {
-      position: absolute;
-      bottom: calc(-0.0625em - 6em);
-      z-index: -1;
-      color: var(--clr-background);
-    }
-  }
-
-  .section-header {
-    width: min(min(100vw - 4rem, 60rem), 58rem);
-    margin: auto;
-  }
-
-  .section-more {
-    margin: auto;
-    margin-top: -2em;
-    display: block;
-    width: min(min(calc(100vw - 4rem), 60rem), 58rem);
-    padding: 1em;
-    background-color: var(--clr-background);
-    border: 0.0625em solid var(--clr-background-900);
-    border-radius: 0.3em;
-
-    &:is(:hover, :focus) {
-      background-color: var(--clr-accent);
-      border-color: var(--clr-accent-light);
-      color: var(--clr-white);
-    }
-  }
-
-  @include breakpoint-down('medium') {
-    .main-container {
-      padding-inline: 0;
-    }
-  }
-}
-
-.contact {
-  .form-input {
-    display: flex;
-    flex-direction: column;
-
-    &__captcha {
-      margin-top: 1rem;
-      margin-bottom: 1rem;
-    }
-
-    label {
-      margin: 2em 0 0.5em 0;
-    }
-
-    input,
-    textarea {
-      width: 100%;
-      padding: 1rem;
-      border: none;
-      background-color: var(--clr-background);
-      color: var(--clr-foreground-900);
-      resize: none;
-    }
-
-    input[type='submit'] {
-      border: none;
-      color: var(--clr-white);
-      background-color: var(--clr-accent);
-    }
-  }
-}
\ No newline at end of file
diff --git a/archives/modules/_mixin.scss b/archives/modules/_mixin.scss
deleted file mode 100644
index c081666..0000000
--- a/archives/modules/_mixin.scss
+++ /dev/null
@@ -1,23 +0,0 @@
-$breakpoints-up: (
-  'medium': '40em',
-  'large': '64em',
-  'xlarge': '87.5em',
-);
-
-$breakpoints-down: (
-  'small': '39.9375em',
-  'medium': '63.9375em',
-  'large': '87.4375em',
-);
-
-@mixin breakpoint-up($size) {
-  @media screen and (min-width: map-get($breakpoints-up, $size)) {
-    @content;
-  }
-}
-
-@mixin breakpoint-down($size) {
-  @media screen and (max-width: map-get($breakpoints-down, $size)) {
-    @content;
-  }
-}
diff --git a/archives/modules/_vars.scss b/archives/modules/_vars.scss
deleted file mode 100644
index d5efc55..0000000
--- a/archives/modules/_vars.scss
+++ /dev/null
@@ -1,72 +0,0 @@
-html:root {
-  --_h: 270;
-  --_hs: var(--_h) 20%;
-  --clr-accent: hsl(var(--_h), 50%, 40%);
-  --clr-accent-light: hsl(var(--_h), 84%, 72%);
-  --clr-accent-dark: hsl(var(--_h), 71%, 22%);
-  --clr-complementary: hsl(90, 50%, 40%);
-
-  --clr-href: hsl(var(--_h), 80%, 50%);
-  --clr-href-visited: hsl(var(--_h), 70%, 22%);
-
-  --clr-background: hsl(var(--_hs) 95%);
-  --clr-background-900: hsl(var(--_hs) 88%);
-  --clr-background-800: hsl(var(--_hs) 75%);
-  --clr-background-700: hsl(var(--_hs) 63%);
-  --clr-foreground: hsl(var(--_hs) 10%);
-  --clr-foreground-900: hsl(var(--_hs) 13%);
-  --clr-foreground-800: hsl(var(--_hs) 25%);
-  --clr-foreground-700: hsl(var(--_hs) 38%);
-
-  --clr-disabled-text: hsl(var(--_hs) 50%);
-  --clr-white: hsl(var(--_hs) 100%);
-  --clr-black: hsl(var(--_hs) 0%);
-  --clr-black-light: hsl(var(--_hs) 13%);
-
-  --clr-red: hsl(357, 70%, 41%);
-  --clr-red-dark: hsl(357, 70%, 30%);
-
-  --bx-shadow-two-side: 0 0.3125rem 0.625rem hsla(var(--_hs) 0%, 0.2),
-    -0.3125rem -0.3125rem 0.625rem hsla(var(--_hs) 100%, 0.8);
-  --table-header: hsl(270, 80%, 30%);
-
-  &[data-theme=sunglow] {
-    --clr-accent: hsl(40, 56%, 40%);
-    --clr-accent-light: hsl(40, 56%, 72%);
-    --clr-accent-dark: hsl(40, 56%, 22%);
-
-    --clr-href: hsl(40, 56%, 72%);
-    --clr-href-visited: hsl(40, 56%, 22%);
-
-    --clr-background: hsl(40, 56%, 95%);
-    --clr-background-900: hsl(40, 56%, 88%);
-    --clr-background-800: hsl(40, 56%, 75%);
-    --clr-background-700: hsl(40, 56%, 63%);
-    --clr-foreground: hsl(40, 56%, 10%);
-    --clr-foreground-900: hsl(40, 56%, 13%);
-    --clr-foreground-800: hsl(40, 56%, 25%);
-    --clr-foreground-700: hsl(40, 56%, 38%);
-
-    &[data-theme=dark] {
-      --clr-href: hsl(40, 56%, 72%);
-      --clr-href-visited: hsl(40, 56%, 40%);
-    }
-  }
-
-  &[data-theme=dark] {
-    --clr-href: hsl(var(--_h), 84%, 72%);
-    --clr-href-visited: hsl(var(--_h), 50%, 40%);
-    --clr-background: hsl(var(--_hs) 10%);
-    --clr-background-900: hsl(var(--_hs) 13%);
-    --clr-background-800: hsl(var(--_hs) 25%);
-    --clr-background-700: hsl(var(--_hs) 38%);
-    --clr-foreground: hsl(var(--_hs) 95%);
-    --clr-foreground-900: hsl(var(--_hs) 88%);
-    --clr-foreground-800: hsl(var(--_hs) 75%);
-    --clr-foreground-700: hsl(var(--_hs) 63%);
-
-    --bx-shadow-two-side: 0 0.3125rem 0.625rem rgb(0 0 0 / 20%),
-      -0.3125rem -0.3125rem 0.625rem rgb(58 58 58 / 63%);
-    --table-header: var(--clr-accent-light);
-  }
-}
\ No newline at end of file
diff --git a/archives/modules/component/_aboutme.scss b/archives/modules/component/_aboutme.scss
deleted file mode 100644
index 169e393..0000000
--- a/archives/modules/component/_aboutme.scss
+++ /dev/null
@@ -1,305 +0,0 @@
-.aboutme {
-  background-color: var(--clr-accent);
-  color: var(--clr-white);
-
-  .adds {
-    font-size: 0.9rem;
-    padding: 1rem;
-
-    .new-line {
-      margin-top: 0.5em;
-    }
-  }
-
-  a {
-    text-decoration: underline;
-    text-underline-offset: 0.4rem;
-  }
-
-  a:hover,
-  a:focus-visible {
-    color: #d0d0d0;
-  }
-
-  ::selection {
-    background-color: #333333;
-  }
-
-  .extra {
-    text-transform: uppercase;
-    letter-spacing: 0.1rem;
-  }
-
-  .main-container {
-    display: flex;
-    flex-direction: column;
-  }
-
-  .flex {
-    display: flex;
-    flex-direction: row;
-    border-radius: 0.3rem;
-    margin-top: 1rem;
-
-    &-header {
-      display: flex;
-      padding: 0.5rem 1rem;
-      width: 100%;
-      justify-content: space-between;
-      box-shadow: 0 0.3125rem 0.625rem hsla(0, 0%, 0%, 0.4);
-      flex: 0 0 auto;
-
-      span[aria-hidden=true] {
-        display: block;
-        margin-top: 0.3rem;
-      }
-
-      div {
-        display: flex;
-        align-items: center;
-        font-weight: 600;
-        gap: 0.2rem;
-
-        .dot {
-          height: 0.9375rem;
-          width: 0.9375rem;
-          background-color: hsl(0, 100%, 43%);
-          border-radius: 50%;
-
-          &:first-of-type {
-            background-color: green;
-          }
-
-          &:nth-of-type(2) {
-            background-color: yellow;
-          }
-        }
-      }
-    }
-
-    .lists {
-      display: flex;
-      justify-content: space-around;
-      width: 100%;
-    }
-
-    &.tools {
-      background-color: hsl(0, 0%, 13%);
-      box-shadow: 0 0.3125rem 0.625rem hsla(0, 0%, 0%, 0.4);
-      margin-bottom: -9rem;
-      z-index: 2;
-
-      h2 {
-        padding: 1rem;
-      }
-
-      .lists {
-        background-color: hsl(0, 0%, 11%);
-        border-radius: 0.3rem;
-        padding: 2rem;
-      }
-    }
-
-    &.languages {
-      filter: brightness(110%);
-      box-shadow: inset 0 0.3125rem 0.625rem hsla(0, 0%, 0%, 0.4);
-      background-color: var(--clr-accent-dark);
-      padding: 2rem;
-
-      .header-title {
-        gap: 1em;
-        display: flex;
-      }
-
-      h2 {
-        padding: 1rem 0;
-      }
-
-      ul {
-        margin-top: 0.2rem;
-      }
-
-      .lists {
-        overflow: unset;
-        height: fit-content;
-      }
-    }
-
-    &:not(:first-of-type) {
-      margin-top: 5rem;
-      justify-content: space-around;
-      flex-direction: column;
-
-      ul {
-        font-size: 1.1rem;
-        font-weight: 600;
-
-        li {
-          font-weight: 500;
-          font-size: 1rem;
-          margin-top: 0.5rem;
-
-          &:first-of-type {
-            font-weight: 600;
-          }
-
-          &:nth-child(2) {
-            margin-top: 0.5rem;
-          }
-        }
-      }
-
-      @include breakpoint-down('medium') {
-        align-items: flex-start;
-
-        .lists {
-          flex-direction: column;
-        }
-
-        ul>li {
-          display: inline-block;
-          margin-top: 0;
-        }
-      }
-    }
-
-    @include breakpoint-down('medium') {
-      flex-direction: column;
-      align-items: center;
-    }
-  }
-
-  .data {
-    position: relative;
-    min-width: 25rem;
-    height: 20rem;
-
-    @include breakpoint-down('medium') {
-      width: 100%;
-      max-width: 25rem;
-      min-width: unset;
-    }
-
-    &:hover {
-      .note {
-        scale: 1.1;
-      }
-    }
-
-    &::before {
-      content: '';
-      position: absolute;
-      width: 100%;
-      height: 100%;
-      background-color: hsl(0, 100%, 43%);
-      left: -0.7rem;
-      border-radius: 40% 20% / 10%;
-    }
-  }
-
-  .explain {
-    display: flex;
-    align-items: center;
-    margin-top: 1rem;
-    padding: 1rem;
-    font-size: 1.2rem;
-
-    @include breakpoint-up('large') {
-      padding-left: 3rem;
-    }
-  }
-
-  .note {
-    rotate: -3deg;
-  }
-}
-
-.note {
-  color: var(--clr-white);
-  display: flex;
-  flex: 0 0 auto;
-  position: relative;
-  width: min(25rem, 100%);
-  flex-direction: column;
-  background-color: hsl(0, 0%, 13%);
-  border-radius: 0.6rem;
-  box-shadow: 0 0.3125rem 0.625rem hsla(0, 0%, 0%, 0.4);
-  height: max(20rem, 100%);
-  transition: all 300ms ease-in-out;
-
-  article {
-    padding: 1rem;
-    z-index: 80;
-  }
-
-  &>svg {
-    position: absolute;
-    right: 0.1rem;
-    bottom: 0.1rem;
-    color: hsl(0, 0%, 11%);
-  }
-
-  article {
-    padding: 1rem;
-    height: 100%;
-    overflow-y: auto;
-
-    scrollbar-width: none;
-
-    &::-webkit-scrollbar {
-      width: 0;
-    }
-
-    li {
-      padding-left: 0.6rem;
-    }
-  }
-
-  &-heading {
-    font-weight: 600;
-    display: block;
-    text-transform: uppercase;
-    letter-spacing: 0.1em;
-    line-height: 1.2;
-  }
-
-  &-subheading {
-    font-style: italic;
-  }
-
-  li {
-    font-size: 0.85em;
-  }
-
-  &-header {
-    display: flex;
-    height: 2.5rem;
-    padding: 0 1rem;
-    width: 100%;
-    justify-content: space-between;
-    box-shadow: 0 0.3125rem 0.625rem hsla(0, 0%, 0%, 0.4);
-    flex: 0 0 auto;
-
-    div {
-      display: flex;
-      align-items: center;
-      font-weight: 600;
-      gap: 0.2rem;
-
-      .dot {
-        height: 0.9375rem;
-        width: 0.9375rem;
-        background-color: hsl(0, 100%, 43%);
-        border-radius: 50%;
-
-        &:first-of-type {
-          background-color: green;
-        }
-
-        &:nth-of-type(2) {
-          background-color: yellow;
-        }
-      }
-    }
-  }
-}
\ No newline at end of file
diff --git a/archives/modules/component/_animation.scss b/archives/modules/component/_animation.scss
deleted file mode 100644
index 5b19ab2..0000000
--- a/archives/modules/component/_animation.scss
+++ /dev/null
@@ -1,59 +0,0 @@
-[data-animation] {
-  opacity: 0;
-  transition: translate var(--_translate, 1s) ease-in-out, scale var(--_scale, 1s) ease-in-out, rotate var(--_rotate, 1s) ease-in-out, opacity var(--_opacity, 1s) ease-in-out;
-}
-
-[data-animation='fade-in'] {
-  translate: 0 4em;
-}
-
-[data-animation='right-show'] {
-  translate: -5em 0;
-}
-
-[data-animation='top-show'] {
-  translate: 0 -5em;
-}
-
-[data-animation='bottom-show'] {
-  translate: 0 5em;
-}
-
-[data-animation='left-show'] {
-  translate: 5em 0;
-}
-
-[data-animation='prototype-card'] {
-  translate: -5em 0;
-
-  &:nth-of-type(odd) {
-    translate: 5em 0;
-  }
-}
-
-.has-been-animated {
-  opacity: unset;
-  scale: unset;
-  rotate: unset;
-  translate: unset !important;
-}
-
-@media (prefers-reduced-motion) {
-  .prototype-reader,
-  .data {
-    transform: unset !important;
-  }
-
-  *,
-  *::after,
-  *::before {
-    animation: unset !important;
-    rotate: 0deg !important;
-    translate: 0em 0em !important;
-  }
-
-  [data-animation] {
-    translate: unset !important;
-    opacity: 1 !important;
-  }
-}
\ No newline at end of file
diff --git a/archives/modules/component/_article.scss b/archives/modules/component/_article.scss
deleted file mode 100644
index 6db37d7..0000000
--- a/archives/modules/component/_article.scss
+++ /dev/null
@@ -1,432 +0,0 @@
-.article {
-  --_article-color: hsla(270, 50%, 40%, 0.5);
-  -webkit-text-size-adjust: 100%;
-  -ms-text-size-adjust: 100%;
-  color: var(--clr-foreground-900);
-  background-color: var(--clr-background-900);
-  line-height: 2;
-  margin: auto;
-
-  main {
-    position: relative;
-
-    .table-of-contents {
-      position: absolute;
-      top: 0;
-      right: 0;
-
-      @include breakpoint-down('medium') {
-        position: unset;
-      }
-    }
-  }
-
-
-  a {
-    font-weight: 600;
-    color: var(--clr-href);
-
-    &:not(.header-anchor, .breadcrumb) {
-      text-decoration: 0.0625em underline var(--clr-href);
-      text-underline-offset: 0.35em;
-    }
-
-    &:hover {
-      color: var(--clr-href-visited);
-    }
-
-    &:focus-visible {
-      outline: thin dotted;
-    }
-
-    &:hover,
-    &:active {
-      outline: 0;
-    }
-  }
-
-  span {
-
-    a:hover,
-    a:visited,
-    a:active,
-    a:focus-visible {
-      color: var(--clr-href);
-    }
-  }
-
-  ::selection {
-    background: var(--clr-accent-dark);
-    color: var(--clr-white);
-  }
-
-  a::selection {
-    background: var(--clr-accent-dark);
-    color: var(--clr-white);
-  }
-
-  :is(p:not(:first-of-type), table, blockquote) {
-    max-width: 60ch;
-  }
-
-  p {
-    margin: 1rem 0;
-  }
-
-  img {
-    max-width: 100%;
-  }
-
-  h1,
-  h2,
-  h3,
-  h4,
-  h5,
-  h6 {
-    font-weight: 600;
-    color: var(--clr-foreground-900);
-    padding: 1rem 0;
-    line-height: 1.1em;
-  }
-
-  h4,
-  h5,
-  h6 {
-    font-weight: bold;
-  }
-
-  h1 {
-    font-size: 2.5rem;
-  }
-
-  h2 {
-    font-size: 2rem;
-  }
-
-  h3 {
-    font-size: 1.5rem;
-  }
-
-  h4 {
-    font-size: 1.2rem;
-  }
-
-  h5 {
-    font-size: 1rem;
-  }
-
-  h6 {
-    font-size: 0.9rem;
-  }
-
-  blockquote {
-    color: var(--clr-foreground-900);
-    margin: 0;
-    padding-left: 2em;
-    border-left: 0.5em var(--clr-accent) solid;
-  }
-
-  hr {
-    display: block;
-    height: 0.15em;
-    border: 0;
-    border-top: 0.0625em solid var(--clr-accent);
-    border-bottom: 0.0625em solid var(--clr-accent-light);
-    margin: 1em 0;
-    padding: 0;
-  }
-
-  pre,
-  code,
-  kbd,
-  samp {
-    padding: 0 0.3em;
-    font-family: monospace, "Trebuchet MS", "Lucida Sans Unicode", "Lucida Grande", "Lucida Sans", Arial, sans-serif;
-    // font-size: 0.8rem;
-    // line-height: 1.4;
-  }
-
-  pre {
-    border: 0.1rem solid var(--_article-color);
-    // background-color: var(--_article-color);
-    border-radius: 0.5rem;
-    padding: 1rem;
-    white-space: pre;
-    white-space: pre-wrap;
-    word-wrap: break-word;
-
-    code {
-      box-shadow: none;
-      background-color: transparent;
-    }
-  }
-
-  b,
-  strong {
-    font-weight: bold;
-    color: var(--clr-foreground-900);
-  }
-
-  dfn {
-    font-style: italic;
-  }
-
-  ins {
-    background: #ff9;
-    color: #000;
-    text-decoration: none;
-  }
-
-  mark {
-    background-color: var(--clr-black);
-    color: var(--clr-white);
-
-    &:is(:hover, :focus) {
-      color: var(--clr-white);
-    }
-  }
-
-  sub,
-  sup {
-    font-size: 75%;
-    line-height: 0;
-    position: relative;
-    vertical-align: baseline;
-
-    >a {
-      text-decoration: none !important;
-    }
-  }
-
-  sup {
-    top: -0.5rem;
-  }
-
-  sub {
-    bottom: -0.25rem;
-  }
-
-  ul,
-  ol {
-    margin: 1em 0;
-    padding: 0 0 0 2rem;
-  }
-
-  ul li {
-    list-style-type: disc;
-  }
-
-  ol li {
-    list-style-type: decimal;
-  }
-
-  li p:last-child {
-    margin: 0;
-  }
-
-  dd {
-    margin: 0 0 0 2rem;
-  }
-
-  img {
-    border: 0;
-    vertical-align: middle;
-  }
-
-  table {
-    border-collapse: collapse;
-    overflow-x: scroll;
-    border-spacing: 0;
-    width: 100%;
-    background-color: var(--clr-background);
-    border-radius: 0.5rem;
-    overflow: hidden;
-
-    td,
-    th {
-      padding: 0.4rem 0.8rem;
-    }
-
-    tr {
-      :is(td, th):first-child {
-        text-align: center;
-      }
-    }
-
-    th {
-      background-color: var(--_article-color);
-      color: var(--table-header);
-      // border-bottom: 0.25rem solid var(--clr-accent);
-    }
-
-    td {
-      vertical-align: top;
-    }
-
-    &.properties {
-      th {
-        border-bottom: 0.0625rem solid var(--clr-background-800);
-        border-left: 0.25rem solid var(--clr-accent);
-      }
-    }
-  }
-
-  .table-of-contents {
-    .toc-container-header {
-      font-weight: 700;
-    }
-
-    ul {
-      margin: 0;
-
-      li {
-        margin-top: 0.15em;
-        list-style: circle;
-      }
-    }
-  }
-
-  @media print {
-    * {
-      background: transparent !important;
-      color: var(--clr-accent-dark) !important;
-      filter: none !important;
-      -ms-filter: none !important;
-    }
-
-    body {
-      font-size: 12pt;
-      max-width: 100%;
-    }
-
-    a,
-    a:visited {
-      text-decoration: underline;
-    }
-
-    hr {
-      height: 0.0625em;
-      border: 0;
-      border-bottom: 0.0625em solid var(--clr-accent-dark);
-    }
-
-    a[href]:after {
-      content: ' (' attr(href) ')';
-    }
-
-    abbr[title]:after {
-      content: ' (' attr(title) ')';
-    }
-
-    .ir a:after,
-    a[href^='javascript:']:after,
-    a[href^='#']:after {
-      content: '';
-    }
-
-    pre,
-    blockquote {
-      border: 0.0625em solid #999;
-      padding-right: 1em;
-      page-break-inside: avoid;
-    }
-
-    tr,
-    img {
-      page-break-inside: avoid;
-    }
-
-    img {
-      max-width: 100% !important;
-    }
-
-    @page :left {
-      margin: 15mm 20mm 15mm 10mm;
-    }
-
-    @page :right {
-      margin: 15mm 10mm 15mm 20mm;
-    }
-
-    p,
-    h2,
-    h3 {
-      orphans: 3;
-      widows: 3;
-    }
-
-    h2,
-    h3 {
-      page-break-after: avoid;
-    }
-  }
-
-  &-flex_list {
-    flex-wrap: wrap;
-    gap: 0.5em;
-    display: flex;
-    margin: unset !important;
-    padding: unset !important;
-  }
-
-  &-detail {
-    &_list {
-      flex-wrap: wrap;
-      gap: 0.5em;
-      display: flex;
-      margin: unset !important;
-      padding: unset !important;
-    }
-
-    &_item {
-      font-size: 0.9rem;
-      gap: 0.5em;
-      border-radius: 0.3em;
-      padding: 0.4em;
-      display: flex;
-      color: var(--clr-foreground);
-      border: 0.0625em solid var(--clr-foreground);
-      align-items: center;
-
-      &:first-of-type {
-        border: none;
-        color: var(--clr-white);
-        box-shadow: 0 0.3125rem 0.625rem hsla(0, 0%, 0%, 0.4);
-        background-color: var(--clr-accent-light);
-        background-image: linear-gradient(45deg,
-            var(--clr-accent-dark),
-            var(--clr-accent));
-      }
-
-      &_svg {
-        width: 1.2rem;
-      }
-    }
-  }
-
-  &-summary {
-    font-style: italic;
-    font-size: 1.2rem;
-    color: var(--clr-foreground-700);
-  }
-
-  .more {
-    display: grid;
-    grid-template-columns: repeat(auto-fit, minmax(min(20em, 60ch), 29.5rem));
-    margin-top: 1em;
-    gap: 1em;
-
-    div {
-      padding: 1rem;
-      background: var(--clr-background);
-
-      a {
-        display: block;
-        text-overflow: ellipsis;
-        overflow: hidden;
-        white-space: nowrap;
-      }
-    }
-
-  }
-}
\ No newline at end of file
diff --git a/archives/modules/component/_card.scss b/archives/modules/component/_card.scss
deleted file mode 100644
index dde106a..0000000
--- a/archives/modules/component/_card.scss
+++ /dev/null
@@ -1,226 +0,0 @@
-.card {
-  background-color: #333333;
-  background-image: linear-gradient(transparent, var(--clr-accent-dark));
-  background-position: center;
-  background-size: cover;
-  background-clip: border-box;
-  box-shadow: 0 0.3125rem 0.625rem hsla(0, 0%, 0%, 0.4);
-  border-radius: 0.3rem;
-  padding: 10rem 0 0;
-  width: 28ch;
-  position: relative;
-  isolation: isolate;
-  flex: 0 0 auto;
-  scroll-snap-align: center;
-  color: var(--clr-white);
-
-  &:hover,
-  &:has(:focus) {
-    scale: 1.1;
-    z-index: 10;
-  }
-
-  &-image {
-    position: absolute;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    z-index: -1;
-    left: 0;
-    right: 0;
-    top: 0;
-    bottom: 0;
-    height: 100%;
-    width: 100%;
-    border-radius: 0.3rem;
-    overflow: hidden;
-
-    &::after {
-      content: '';
-      position: absolute;
-      left: 0;
-      right: 0;
-      bottom: 0;
-      top: 0;
-      background-image: linear-gradient(transparent, var(--clr-accent-dark));
-    }
-  }
-
-  &-background {
-    height: inherit;
-    width: fit-content;
-  }
-
-  &-empty {
-    width: calc(100% - 4rem);
-    padding: 2rem;
-    box-shadow: var(--bx-shadow-two-side);
-    background: var(--clr-background-900);
-    color: var(--clr-foreground-700);
-
-    &:hover,
-    &:focus-visible {
-      scale: 1;
-    }
-  }
-
-  &s {
-    display: flex;
-    flex-wrap: wrap;
-    gap: 1rem;
-    margin-top: 2rem;
-    scrollbar-width: none;
-
-    &.nocentered {
-      justify-content: flex-start;
-    }
-
-    &-more {
-      width: 100%;
-    }
-
-    &.cards-horizontal {
-      padding: 2rem 2rem 4.5rem 2rem;
-      scroll-snap-type: x proximity;
-      overflow-y: hidden;
-
-
-      &::-webkit-scrollbar {
-        width: 0;
-        height: 0;
-      }
-    }
-
-    @include breakpoint-down('medium') {
-      &.cards-horizontal {
-        flex-wrap: nowrap;
-        overflow-x: auto;
-      }
-    }
-
-    @include breakpoint-up('medium') {
-      &.cards-horizontal {
-        flex-wrap: nowrap;
-        overflow-x: auto;
-
-      }
-      
-      &-more {
-        justify-content: space-evenly;
-      }
-    }
-  }
-
-  &-body {
-    background-image: linear-gradient(hsla(0, 0%, 0%, 0),
-        hsla(0, 0%, 0%, 0.4) 10%,
-        hsla(0, 0%, 0%, 1));
-    height: 100%;
-    display: flex;
-    flex-direction: column;
-    border-radius: 0.3rem;
-
-    header,
-    .description-area {
-      flex: 0 0 auto;
-      padding: 0 1.5rem;
-    }
-
-    header {
-      h3 {
-        text-overflow: ellipsis;
-        overflow: hidden;
-        white-space: nowrap;
-      }
-    }
-
-    .description-area {
-      height: 3.2rem;
-      overflow: hidden;
-    }
-
-    h2 {
-      font-size: 1.2rem;
-      text-overflow: ellipsis;
-      overflow: hidden;
-      white-space: nowrap;
-    }
-
-    .card-time {
-      display: block;
-      color: var(--clr-accent-light);
-      font-weight: 600;
-      margin-bottom: 1rem;
-      margin-top: 0.3rem;
-      font-size: 0.8rem;
-      padding: 0.2rem 1rem 0.2rem 0;
-      width: fit-content;
-      border-radius: 0.3em;
-      background-color: transparent;
-      background-image: linear-gradient(90deg,
-          hsl(270deg 71% 22% / 0%),
-          var(--clr-accent));
-    }
-
-    .more-links {
-      display: flex;
-      flex: 1 0 auto;
-      align-items: flex-end;
-      width: 100%;
-      justify-content: space-between;
-
-      .disabled {
-        display: block;
-        margin-top: 1rem;
-        padding: 1rem 1.25rem;
-        color: var(--clr-disabled-text);
-        cursor: not-allowed;
-        user-select: none;
-      }
-
-      a {
-        display: flex;
-        margin-top: 1rem;
-        padding: 1rem 1.5rem;
-        user-select: none;
-        position: relative;
-        z-index: 10;
-        gap: 0.3rem;
-
-        svg {
-          flex: 0 0 auto;
-          height: 1.5rem;
-        }
-
-        &:hover,
-        &:focus-visible {
-          color: var(--clr-white);
-
-          &::before {
-            width: 100%;
-          }
-        }
-
-        &:focus {
-          .new-tab-warning {
-            box-shadow: 0 0.3125rem 0.625rem hsla(0, 0%, 0%, 0.4);
-            visibility: visible;
-          }
-        }
-
-        &::before {
-          content: '';
-          position: absolute;
-          width: 0%;
-          left: 0;
-          margin-top: -1rem;
-          background-color: var(--clr-accent);
-          height: 100%;
-          transition: all 150ms ease-in;
-          border-radius: 0.3rem;
-          z-index: -1;
-        }
-      }
-    }
-  }
-}
\ No newline at end of file
diff --git a/archives/modules/component/_clients.scss b/archives/modules/component/_clients.scss
deleted file mode 100644
index ca00cd8..0000000
--- a/archives/modules/component/_clients.scss
+++ /dev/null
@@ -1,17 +0,0 @@
-.clients {
-  background-color: var(--clr-background);
-  margin-bottom: -6em;
-
-  &-list {
-    padding: 2em;
-    display: flex;
-    flex-wrap: wrap;
-    align-items: center;
-    justify-content: center;
-    gap: 2em;
-
-    svg {
-      max-height: 5em;
-    }
-  }
-}
diff --git a/archives/modules/component/_contact.scss b/archives/modules/component/_contact.scss
deleted file mode 100644
index 17389b8..0000000
--- a/archives/modules/component/_contact.scss
+++ /dev/null
@@ -1,182 +0,0 @@
-.contact {
-  .form-input {
-    display: flex;
-    flex-direction: column;
-
-    &__captcha {
-      margin-top: 1rem;
-      margin-bottom: 1rem;
-    }
-
-    label {
-      margin: 2em 0 0.5em 0;
-    }
-
-    input,
-    textarea {
-      width: 100%;
-      padding: 1rem;
-      border: none;
-      background-color: var(--clr-background);
-      color: var(--clr-foreground-900);
-      resize: none;
-    }
-
-    input[type='submit'] {
-      border: none;
-      color: var(--clr-white);
-      background-color: var(--clr-accent);
-    }
-  }
-
-  &-container {
-    --_main-color: var(--clr-background);
-    --_transparent-limit: 30%;
-
-    display: grid;
-    gap: 0.5rem;
-
-    .contact-summary {
-      background-color: var(--_main-color);
-      padding: 2rem;
-      // border: 0.0625rem solid var(--clr-background-800);
-      border-radius: 0.5em;
-      margin-top: 2em;
-
-      sup {
-        font-size: 0.6em;
-      }
-
-      a {
-        color: var(--clr-accent-light);
-        text-decoration: underline;
-        text-underline-offset: 0.2em;
-        font-weight: 500;
-        transition: text-underline-offset 100ms ease-in-out;
-
-        &:is(:hover, :focus) {
-          text-underline-offset: 0.3em;
-        }
-      }
-    }
-
-    .social {
-      &-container {
-        --_size: 20em;
-        --_minGridSize: min(var(--_size), calc(100% - 4rem + 0.5rem));
-        --_minMax: minmax(var(--_minGridSize), 1fr);
-        --_gridSize: repeat(auto-fit, var(--_minMax));
-        display: grid;
-        grid-template-columns: var(--_gridSize);
-        gap: 0.5rem;
-
-        &__small {
-          --_size: 18em;
-
-          .social-item {
-            aspect-ratio: unset;
-            padding: 1em;
-
-            &-text {
-
-              h2 {
-                font-size: 0.9em;
-              }
-            }
-          }
-        }
-
-        li:nth-of-type(odd) {
-          .social-item {
-            grid-template-areas: "text text";
-          }
-        }
-
-      }
-
-      &-item {
-        --_disabledColor: var(--clr-background-800);
-        aspect-ratio: 3/1;
-        border: 0.0625rem solid var(--_disabledColor);
-        border-radius: 0.5em;
-        overflow: hidden;
-        color: var(--_disabledColor);
-        cursor: not-allowed;
-
-        &[href] {
-          border: 0.0625rem solid var(--_main-color);
-          cursor: pointer;
-          color: var(--clr-foreground);
-        }
-
-        user-select: none;
-        display: grid;
-        grid-template-columns: repeat(2, 1fr);
-        grid-template-areas: "text text";
-        align-items: center;
-        justify-content: space-around;
-        position: relative;
-        padding: 2em;
-
-        &-text {
-          font-variant: all-small-caps;
-          font-weight: 700;
-          font-size: 1.2rem;
-          grid-area: text;
-          text-align: center;
-          z-index: 99;
-
-          h2 {
-            font-size: inherit;
-            line-height: 1;
-          }
-
-          span {
-            font-size: 0.8rem;
-            font-style: italic;
-            color: var(--clr-foreground-700);
-            font-weight: 500;
-            font-variant: normal;
-            text-transform: lowercase;
-          }
-        }
-
-        svg {
-          position: absolute;
-          color: var(--clr-background-800);
-          z-index: 0;
-          bottom: -80%;
-          left: -20%;
-          height: 160%;
-        }
-
-        * {
-          z-index: 4;
-          text-overflow: ellipsis;
-          overflow: hidden;
-          white-space: nowrap;
-        }
-
-        &[href]::after {
-          content: "";
-          position: absolute;
-          background-image: linear-gradient(-45deg, var(--clr-accent) 2%, transparent var(--_transparent-limit), var(--_main-color));
-          width: 300%;
-          aspect-ratio: 1/1;
-          z-index: 1;
-          transition: width 250ms ease-in-out;
-        }
-
-        &[href]:is(:hover, :focus) {
-          color: inherit;
-
-          outline-offset: 0.1em;
-
-          &::after {
-            width: 100%;
-          }
-        }
-      }
-    }
-  }
-}
\ No newline at end of file
diff --git a/archives/modules/component/_error.scss b/archives/modules/component/_error.scss
deleted file mode 100644
index fd23b3d..0000000
--- a/archives/modules/component/_error.scss
+++ /dev/null
@@ -1,120 +0,0 @@
-.error {
-  &-container {
-    @extend .contact-container;
-  }
-
-  &-summary {
-    @extend .contact-summary;
-
-    h2 {
-      line-height: 1;
-      font-size: 1.8rem;
-      font-variant: all-small-caps;
-      margin-bottom: 1rem;
-    }
-  }
-
-  &-decorative {
-    aspect-ratio: 10/1;
-    width: 100%;
-    margin-bottom: 1em;
-    border-radius: 0.7em;
-    background-image: linear-gradient(-45deg, var(--clr-accent) 2%, transparent var(--_transparent-limit), var(--clr-accent));
-    position: relative;
-    box-shadow: inset 0 0.3125rem 0.625rem hsla(0, 0%, 0%, 0.5);
-
-    .decorative {
-      user-select: none;
-      position: absolute;
-      filter: drop-shadow(0 0.3125rem 0.625rem hsla(0, 0%, 0%, 0.5));
-
-      &-left {
-        position: absolute;
-        font-size: 9rem;
-        font-variant: all-small-caps;
-        font-weight: 900;
-        height: 100%;
-
-        animation: bounce-up-down 1.5s infinite forwards;
-
-        @include breakpoint-down('small') {
-          font-size: 7rem;
-        }
-      }
-
-      &-exclamation {
-        top: 50%;
-        translate: 0% -50%;
-        rotate: -20deg;
-      }
-
-      &-question {
-        top: 0%;
-        left: 0.2em;
-        translate: 0% -50%;
-        rotate: 15deg;
-      }
-    }
-
-    svg {
-      position: absolute;
-      aspect-ratio: 1/1;
-      height: 120%;
-      width: auto;
-      rotate: -20deg;
-      top: 50%;
-      right: 0;
-      translate: 0% -50%;
-      animation: svg-move 4s infinite forwards;
-
-      filter: drop-shadow(0 0.3125rem 0.625rem hsla(0, 0%, 0%, 0.5));
-    }
-
-    @include breakpoint-down('small') {
-      aspect-ratio: 4/1;
-    }
-
-    @keyframes svg-move {
-      40% {
-        rotate: 30deg;
-      }
-
-      50% {
-        rotate: 20deg;
-      }
-
-      90% {
-        rotate: -30deg;
-      }
-
-      100% {
-        rotate: -20deg;
-      }
-    }
-
-    @keyframes bounce-up-down {
-      50% {
-        margin-top: -0.6rem;
-        rotate: 2deg;
-      }
-
-      100% {
-        margin-top: 0;
-        rotate: 0;
-      }
-    }
-  }
-
-  &-button {
-    @extend .social-container;
-    @extend .social-container__small;
-
-    li:first-of-type .error-link:first-of-type:after {
-      background-image: linear-gradient(-45deg, var(--clr-accent) 2%, transparent var(--_transparent-limit), var(--clr-accent));
-    }
-  }
-
-  &-link {
-    @extend .social-item;
-  }
-}
\ No newline at end of file
diff --git a/archives/modules/component/_featured.scss b/archives/modules/component/_featured.scss
deleted file mode 100644
index cde7a6a..0000000
--- a/archives/modules/component/_featured.scss
+++ /dev/null
@@ -1,204 +0,0 @@
-.featured {
-  --clr-variant: var(--clr-accent);
-  --clr-variant-dark: var(--clr-accent-dark);
-
-  &.red {
-    --clr-variant: var(--clr-red);
-    --clr-variant-dark: var(--clr-red-dark);
-  }
-
-  &-container {
-    display: flex;
-    flex-direction: column;
-    position: relative;
-    justify-content: space-between;
-    overflow: hidden;
-    margin: 2em auto;
-    margin-top: 5em;
-    border-radius: 0.3em;
-    padding: 0;
-    background-color: transparent;
-    min-height: 20rem;
-    margin-bottom: -5rem;
-    // border: 0.0625em solid var(--clr-background);
-    // box-shadow: 0 0.3125rem 0.625rem rgb(0 0 0 / 40%)
-    box-shadow: 0 0.625rem 1.25rem hsla(0, 0%, 0%, 0.4);
-
-    @include breakpoint-down('medium') {
-      width: calc(100% - 2em);
-    }
-  }
-
-  &-right {
-    display: flex;
-    padding: 2em;
-    background-color: var(--clr-variant);
-    flex: 1 auto;
-    position: relative;
-    justify-content: center;
-    align-items: center;
-
-    @include breakpoint-down('small') {
-      min-height: 10em;
-    }
-
-    img {
-      all: unset;
-      overflow: clip !important;
-      width: min(100%, 26.1875rem);
-      aspect-ratio: 1/1;
-    }
-
-    #svg {
-      position: absolute;
-      bottom: 0;
-      left: 0;
-    }
-  }
-
-  &-left {
-    color: var(--clr-white);
-    padding: 2em;
-    width: min(90ch, 100%);
-    background-color: var(--clr-variant-dark);
-
-    >.featured-header {
-      display: flex;
-      flex-direction: column;
-      margin-bottom: 1em;
-      gap: 0.5em;
-      align-items: flex-start;
-    }
-  }
-
-  &-header {
-    &_project-name {
-      border-radius: 0.3em;
-      background-color: var(--clr-variant);
-      background-image: linear-gradient(90deg,
-          var(--clr-variant-dark),
-          var(--clr-variant));
-      padding: 1em;
-      width: 100%;
-
-      p:last-of-type {
-        font-size: 0.8em;
-      }
-    }
-  }
-
-  &-main {
-    &>* {
-      max-width: 45ch;
-    }
-
-    &_tag {
-      border-radius: 0.3em;
-      padding: 0.5em 1.5em;
-      color: var(--clr-white);
-      border: 0.0625em solid var(--clr-white);
-      user-select: none;
-      pointer-events: none;
-      width: fit-content;
-      font-size: 0.7rem;
-
-      &-area {
-        display: flex;
-        margin-top: 2em;
-        gap: 0.5em;
-        flex-wrap: wrap;
-      }
-    }
-  }
-
-  &-body {
-    display: flex;
-    position: relative;
-    flex: 1 1 auto;
-
-    @include breakpoint-down('small') {
-      flex-direction: column-reverse;
-    }
-  }
-
-  &-footer {
-    padding: 1em 2em;
-    display: flex;
-    justify-content: flex-end;
-    background-color: var(--clr-black-light);
-    gap: 0.4rem;
-    flex-wrap: wrap;
-
-    p {
-      border-radius: 0.3em;
-      padding: 0.5em 1.5em;
-      color: var(--clr-white);
-      border: 0.0625em solid var(--clr-white);
-      user-select: none;
-      pointer-events: none;
-      width: fit-content;
-      font-size: 0.9rem;
-
-      &:first-of-type {
-        border: none;
-        color: var(--clr-white);
-        background: var(--clr-variant-dark);
-        background-image: linear-gradient(-90deg,
-            var(--clr-variant),
-            var(--clr-variant-dark));
-      }
-
-      @include breakpoint-down('small') {
-        width: 100%;
-      }
-    }
-  }
-
-  &-background {
-    position: absolute;
-    left: 0;
-    bottom: 0;
-    right: 0;
-    width: 100%;
-    user-select: none;
-    pointer-events: none;
-  }
-
-  &-external {
-    &_link {
-      display: flex;
-      align-items: center;
-      gap: 0.5em;
-      padding: 0.5em;
-      margin-top: 1em;
-      border-radius: 0.3em;
-      font-size: 1.2rem;
-      color: var(--clr-white);
-      border: none;
-      background: var(--clr-black-light);
-
-      svg {
-        width: 1.2em;
-        height: 1.2em;
-      }
-
-      &:is(:hover, :focus) {
-        color: var(--clr-white);
-        outline: 0.0625em solid var(--clr-background);
-      }
-    }
-  }
-
-  &-tag {
-    border-radius: 0.3em;
-    position: absolute;
-    right: 1em;
-    top: 1em;
-    padding: 0.2em 0.5em;
-    z-index: 10;
-    font-weight: 500;
-    background-color: var(--clr-black-light);
-    color: var(--clr-white);
-    // box-shadow: 0 0.625rem 1.25rem hsla(270, 71%, 22%, 0.2);
-  }
-}
\ No newline at end of file
diff --git a/archives/modules/component/_hero.scss b/archives/modules/component/_hero.scss
deleted file mode 100644
index 21821fe..0000000
--- a/archives/modules/component/_hero.scss
+++ /dev/null
@@ -1,88 +0,0 @@
-.hero {
-  overflow: hidden;
-  display: flex;
-  isolation: isolate;
-  align-items: center;
-  justify-content: center;
-  flex-direction: column;
-  background-color: var(--clr-background);
-  height: 80dvh;
-  z-index: 3;
-  position: relative;
-
-  @include breakpoint-down('medium') {
-    height: 100%;
-  }
-
-  &-decoration {
-    --width: 95vmin;
-    --increase: 1.2;
-    --duration: 12s;
-    --delay: calc((var(--duration) * 0.1));
-    position: absolute;
-    right: calc(var(--width) / -2);
-    bottom: calc(var(--width) / -2);
-    z-index: -1;
-    width: var(--width);
-    aspect-ratio: 1/1;
-    border-radius: 50%;
-    background-color: var(--clr-accent);
-    animation: twiching var(--duration) var(--delay) infinite;
-  }
-
-  @keyframes twiching {
-    50% {
-      width: calc(var(--width) * var(--increase));
-    }
-  }
-
-  &-bigger {
-    --width: 120vmin;
-    --increase: 2;
-    --duration: 10s;
-    --delay: calc((var(--duration) * 0.2));
-    background-color: transparent;
-    border: max(0.5vmin, 0.125rem) solid var(--clr-accent);
-  }
-
-  .decoration {
-    position: absolute;
-    width: 100%;
-    height: 100%;
-    user-select: none;
-    pointer-events: none;
-
-    .relative {
-      position: relative;
-    }
-  }
-
-  &-svg {
-    &_bottom {
-      z-index: -1;
-      position: absolute;
-      bottom: 0;
-      margin-bottom: -.625rem;
-      left: 0;
-      width: 100%;
-      overflow: hidden;
-      line-height: 0;
-      transform: rotate(180deg);
-
-      svg {
-        position: relative;
-        display: block;
-        width: calc(100% + 0.08125rem);
-        height: 9.375rem;
-
-        @include breakpoint-down('small') {
-          height: 3.125rem;
-        }
-      }
-
-      .shape-fill {
-        fill: var(--clr-background-900);
-      }
-    }
-  }
-}
\ No newline at end of file
diff --git a/archives/modules/component/_nav.scss b/archives/modules/component/_nav.scss
deleted file mode 100644
index f8ff033..0000000
--- a/archives/modules/component/_nav.scss
+++ /dev/null
@@ -1,191 +0,0 @@
-.nav {
-  background-color: var(--clr-background);
-  flex-grow: 0;
-  flex-shrink: 0;
-  position: sticky;
-  top: 0;
-  padding: 0.8rem;
-  z-index: 20;
-
-  &-container {
-    width: 100%;
-    max-width: 64rem;
-    margin: 0 auto;
-    gap: 1rem;
-    display: flex;
-    flex-wrap: wrap;
-    align-items: center;
-    justify-content: space-between;
-
-    .menubar {
-      font-weight: 600;
-      flex: 1;
-      justify-content: flex-end;
-    }
-  }
-
-  &-skipto {
-    background-color: var(--clr-accent);
-    color: var(--clr-white);
-    display: flex;
-    padding: 0 0.3rem;
-    align-self: center;
-    scale: 0 1;
-    order: 2;
-    transform-origin: left;
-    transition: scale 200ms ease;
-
-    &:focus {
-      color: var(--clr-white);
-      scale: 1;
-    }
-  }
-
-  .leftside {
-    display: flex;
-    gap: 1rem;
-  }
-
-  .rightside {
-    display: flex;
-    gap: 0.2rem;
-  }
-
-  .brand {
-    display: flex;
-    gap: 0.5rem;
-    flex: 1 0 auto;
-    order: 1;
-
-    &-title {
-      font-size: 1.3rem;
-      font-weight: 700;
-    }
-
-    &-logo {
-      display: flex;
-      align-items: center;
-    }
-  }
-
-  .themes {
-    transition: background-color 200ms ease-in;
-    border-radius: 50%;
-  }
-
-  .themes,
-  &-mobile {
-    cursor: pointer;
-    background: none;
-    border: none;
-    display: block;
-    height: 2rem;
-    width: 2rem;
-    padding: 0.4rem;
-    color: inherit;
-
-    svg {
-      width: 100%;
-      height: 100%;
-    }
-
-    &__section {
-      margin-top: 3.605625rem;
-      right: 0;
-      position: fixed;
-      top: 0;
-      left: 0;
-      height: calc(100% - 3.605625rem);
-      background-color: var(--clr-background);
-      color: var(--clr-foreground);
-      z-index: 20;
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-      gap: 2rem;
-      justify-content: center;
-
-      &.not-showing {
-        height: 0%;
-        overflow-y: hidden;
-        visibility: hidden;
-      }
-
-      @include breakpoint-up('medium') {
-        height: 0%;
-        overflow-y: hidden;
-        visibility: hidden;
-      }
-
-      li {
-        width: 100%;
-        list-style: none;
-
-        a {
-          display: block;
-          text-transform: uppercase;
-          height: 5em;
-
-          div {
-            position: absolute;
-            left: 50%;
-            top: 50%;
-            translate: -50% -50%;
-          }
-
-          &:is(:hover, :focus) {
-            font-weight: 700;
-          }
-        }
-      }
-    }
-  }
-
-  &-mobile {
-    @include breakpoint-up('medium') {
-      display: none;
-    }
-  }
-
-  ul {
-    display: none;
-    gap: 1rem;
-    align-items: center;
-
-    @include breakpoint-up('medium') {
-      display: flex;
-    }
-
-    li {
-      list-style: none;
-      text-transform: uppercase;
-      letter-spacing: 0rem;
-
-      a {
-        position: relative;
-        z-index: 1;
-        transition: color 300ms 150ms ease-in;
-
-        &:hover,
-        &:focus-visible {
-          color: var(--clr-white);
-          z-index: 1;
-
-          &::before {
-            width: 100%;
-          }
-        }
-
-        &::before {
-          content: '';
-          position: absolute;
-          width: 0%;
-          background-color: var(--clr-accent);
-          height: 110%;
-          transition: all 150ms ease-in;
-          z-index: -1;
-        }
-      }
-    }
-  }
-}
\ No newline at end of file
diff --git a/archives/modules/component/_partof.scss b/archives/modules/component/_partof.scss
deleted file mode 100644
index 6cc1e54..0000000
--- a/archives/modules/component/_partof.scss
+++ /dev/null
@@ -1,168 +0,0 @@
-.part-of {
-  background-color: var(--clr-background);
-  width: 100%;
-  margin-bottom: -6em;
-  padding-bottom: 4em;
-  position: relative;
-  isolation: isolate;
-
-  .description {
-    font-size: 0.9rem;
-  }
-
-  &-more {
-    display: block;
-    width: 100%;
-    padding: 1em;
-    background-color: var(--clr-background);
-    border: 0.0625em solid var(--clr-background-900);
-    margin-top: 1em;
-    border-radius: 0.3em;
-
-    &:is(:hover, :focus) {
-      background-color: var(--clr-accent);
-      border-color: var(--clr-accent-light);
-      color: var(--clr-white);
-    }
-  }
-
-  &-container {
-    max-width: 64rem;
-    margin: 0 auto;
-    padding: 3em 2em 2em 2em;
-    width: 100%;
-
-    h2 {
-      text-transform: uppercase;
-      letter-spacing: 0.1em;
-
-      @include breakpoint-down('medium') {
-        margin-bottom: 0.5em;
-      }
-    }
-
-    .organization {
-      &-container {
-        margin-top: 1em;
-        display: grid;
-        gap: 1em;
-        grid-template-columns: repeat(auto-fit, minmax(min(20rem, 100%), 1fr));
-
-        svg {
-          max-height: 8em;
-
-          @include breakpoint-down('medium') {
-            max-width: 100%;
-            margin-top: 2em;
-          }
-        }
-      }
-
-      &-item {
-        border: 0.0625em solid var(--clr-background-900);
-        border-radius: 0.3em;
-        padding: 1em;
-        position: relative;
-        background: var(--clr-background);
-
-        &.full {
-          grid-column: 1 / -1;
-          display: flex;
-          align-items: center;
-          gap: 1em;
-
-          svg {
-            flex: 0 0 auto;
-          }
-
-          .organization-content {
-            flex: 1 auto;
-            margin-top: 2em;
-          }
-
-          @include breakpoint-down('medium') {
-            flex-direction: column;
-          }
-        }
-      }
-
-      &-desc {
-        margin-bottom: 1em;
-      }
-
-      &-position {
-        display: flex;
-        flex-direction: row;
-        flex-wrap: wrap;
-        gap: 0.5em;
-
-        span {
-          border-radius: 0.3em;
-          padding: 0.5em 1.5em;
-          color: var(--clr-foreground);
-          border: 0.0625em solid var(--clr-foreground);
-          align-items: center;
-          gap: 0.4rem;
-          user-select: none;
-          pointer-events: none;
-
-          &:first-of-type {
-            border: none;
-            color: var(--clr-white);
-            background: var(--clr-accent-dark);
-            background-image: linear-gradient(
-              -90deg,
-              var(--clr-accent),
-              var(--clr-accent-dark)
-            );
-            background-size: 400%;
-            animation: positionanimate 1s infinite alternate;
-          }
-        }
-      }
-
-      &-join {
-        display: flex;
-        flex-direction: row;
-        color: var(--clr-foreground);
-        border: 0.0625em solid var(--clr-foreground);
-        border-radius: 0.3em;
-        padding: 0.5em 1.5em;
-        align-items: center;
-        width: fit-content;
-        position: absolute;
-        right: 1em;
-        font-size: 0.8rem;
-        top: 1em;
-        user-select: none;
-        pointer-events: none;
-      }
-    }
-  }
-
-  &-svg {
-    &_bottom {
-      position: absolute;
-      bottom: -0.0625em;
-      z-index: -1;
-      color: var(--clr-accent);
-
-      @include breakpoint-up('medium') {
-        bottom: -4.0625em;
-      }
-
-      @include breakpoint-up('large') {
-        bottom: -8.0625em;
-      }
-    }
-  }
-}
-
-@keyframes positionanimate {
-  0% {
-    background-position: left;
-  }
-  100% {
-    background-position: right;
-  }
-}
diff --git a/archives/modules/component/_post.scss b/archives/modules/component/_post.scss
deleted file mode 100644
index 5c8d496..0000000
--- a/archives/modules/component/_post.scss
+++ /dev/null
@@ -1,79 +0,0 @@
-.post {
-  &s {
-    margin-top: 2.5rem;
-
-    &-yeargroup {
-      margin-bottom: 0.5em;
-    }
-
-    &-detail {
-      margin-top: 1rem;
-      margin-left: 2rem;
-      background-color: var(--clr-background);
-      color: var(--clr-foreground-700);
-      border: 0.0625em solid var(--clr-background-900);
-      padding: 1rem;
-      border-radius: 0.3rem;
-
-      @include breakpoint-down('small') {
-        margin-inline: 0;
-      }
-
-      &_header {
-        font-size: 1.6rem;
-        line-height: 1.1;
-        margin-bottom: 0.5em;
-        display: block;
-        font-weight: 600;
-        color: var(--clr-foreground);
-      }
-
-      &_accent {
-        color: var(--clr-white);
-        margin-bottom: 1em;
-        width: fit-content;
-        flex-wrap: wrap;
-        gap: 0.5em;
-        display: flex;
-
-        &-item {
-          font-size: 0.9rem;
-          gap: 0.5em;
-          border-radius: 0.3em;
-          padding: 0.4em;
-          display: flex;
-          color: var(--clr-foreground);
-          border: 0.0625em solid var(--clr-foreground);
-          align-items: center;
-
-          &_filled {
-            border: none;
-            color: var(--clr-white);
-            box-shadow: 0 0.3125rem 0.625rem hsla(0, 0%, 0%, 0.4);
-            background-color: var(--clr-accent-light);
-            background-image: linear-gradient(45deg,
-                var(--clr-accent-dark),
-                var(--clr-accent));
-          }
-        }
-      }
-
-      &_svg {
-        width: 1.5em;
-        height: fit-content;
-      }
-    }
-
-    &-list {
-      margin: 0;
-    }
-
-    &:not(:first-of-type) {
-      margin-top: 1.5rem;
-    }
-
-    &:is(:last-of-type) {
-      margin-bottom: 1.5rem;
-    }
-  }
-}
\ No newline at end of file
diff --git a/archives/modules/component/_preload.scss b/archives/modules/component/_preload.scss
deleted file mode 100644
index 485b280..0000000
--- a/archives/modules/component/_preload.scss
+++ /dev/null
@@ -1,55 +0,0 @@
-.preload {
-  position: fixed;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  background-color: var(--clr-background);
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  height: 100dvh;
-  z-index: 999;
-  flex-direction: column;
-  translate: 0 0;
-  opacity: 1;
-  transition: transform 1s ease-in-out;
-
-  svg {
-    rotate: 0deg;
-    max-width: 10em;
-    animation: preload 2s infinite;
-  }
-
-  &-text {
-    margin-top: 1em;
-    max-width: 30ch;
-    text-align: center;
-  }
-
-  &.hidden {
-    translate: 0 -100vh;
-  }
-
-  &.disabled {
-    display: none;
-  }
-}
-
-@keyframes preload {
-  25% {
-    rotate: 15deg;
-  }
-
-  50% {
-    rotate: 0deg;
-  }
-
-  75% {
-    rotate: -15deg;
-  }
-
-  100% {
-    rotate: 0deg;
-  }
-}
diff --git a/archives/modules/component/_prototype.scss b/archives/modules/component/_prototype.scss
deleted file mode 100644
index 777d4e3..0000000
--- a/archives/modules/component/_prototype.scss
+++ /dev/null
@@ -1,259 +0,0 @@
-.prototype {
-  margin-top: 4rem;
-  position: relative;
-  isolation: isolate;
-
-  &s {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    flex-wrap: wrap;
-    justify-content: center;
-    gap: 7rem;
-
-    @include breakpoint-up('large') {
-      margin: 3rem;
-    }
-
-    @include breakpoint-down('medium') {
-      flex-direction: row;
-    }
-  }
-
-  &-header {
-    margin-bottom: 1rem;
-  }
-
-  &-card {
-    align-items: center;
-    display: flex;
-    border-radius: 0.3rem;
-    width: 100%;
-
-    &:first-of-type {
-      @include breakpoint-down('medium') {
-        margin-top: 2em;
-      }
-    }
-
-    @include breakpoint-down('medium') {
-      flex-direction: column;
-    }
-
-    &:nth-of-type(odd) {
-      .prototype-header {
-        order: 2;
-
-        &::before {
-          background-color: var(--clr-accent-dark);
-          rotate: -6deg;
-        }
-
-        @include breakpoint-down('medium') {
-          order: 0;
-        }
-      }
-
-      .prototype-description {
-        .text {
-          padding: 1rem;
-          padding-right: 2rem;
-        }
-
-        .links {
-          justify-content: flex-start;
-          padding-left: 1rem;
-        }
-      }
-    }
-  }
-
-  &-description {
-    flex: 1 1 auto;
-    z-index: 5;
-
-    ul {
-      li {
-        margin-top: 0.3rem;
-      }
-    }
-
-    .text {
-      padding: 1rem;
-      padding-left: 2rem;
-
-      .language {
-        display: inline-block;
-        padding: 0 0.1rem;
-        background-color: var(--clr-accent-dark);
-        color: var(--clr-white);
-        border-radius: 0.3rem;
-        user-select: none;
-        font-size: 0.8rem;
-      }
-
-      @include breakpoint-down('medium') {
-        padding-left: 0;
-      }
-
-      ul {
-        margin-top: 0.8rem;
-        border-radius: 0.3rem;
-        background-color: hsl(0, 0%, 10%);
-        padding: 1rem;
-        box-shadow: inset 0 0.3125rem 0.625rem hsla(0, 0%, 0%, 0.4);
-      }
-    }
-
-    .links {
-      display: flex;
-      align-items: flex-end;
-      justify-content: flex-end;
-      padding-right: 1rem;
-
-      a {
-        background-color: var(--clr-accent);
-        color: var(--clr-white);
-        padding: 0.5rem 1rem;
-        border-radius: 0.3rem;
-        transition: all 300ms ease-out;
-        display: flex;
-
-        svg {
-          flex: 0 0 auto;
-          height: 1.5rem;
-        }
-
-        &:hover {
-          filter: brightness(120%);
-        }
-      }
-    }
-
-    &_header {
-      display: flex;
-      margin-bottom: 1em;
-      gap: 0.5em;
-      font-weight: 700;
-      align-items: center;
-      line-height: 1.2;
-    }
-  }
-
-  &-more {
-    display: flex;
-    flex-wrap: wrap;
-    gap: 0.4rem;
-
-    i {
-      display: inline-block;
-      font-style: normal;
-      padding: 0.2rem 0.7rem;
-      background-color: var(--clr-background-900);
-      border-radius: 0.3rem;
-
-      &.error {
-        background-color: hsl(0, 100%, 43%);
-        color: var(--clr-white);
-      }
-
-      &.active {
-        background-color: #067e06;
-        color: var(--clr-white);
-      }
-    }
-
-    .status {
-      background-image: linear-gradient(
-        -90deg,
-        var(--clr-accent),
-        var(--clr-accent-dark)
-      );
-      padding: 0 0.7rem;
-      display: flex;
-      align-items: center;
-      border-radius: 0.3rem;
-      color: white;
-      margin-right: 0.3rem;
-    }
-  }
-
-  &-header {
-    flex: 0 0 auto;
-    position: relative;
-    width: 25rem;
-    height: 20rem;
-    color: var(--clr-white);
-
-    @include breakpoint-down('medium') {
-      width: 100%;
-      max-width: 25rem;
-    }
-
-    &:hover {
-      .note {
-        scale: 1.1;
-      }
-    }
-
-    &::before {
-      content: '';
-      position: absolute;
-      width: 100%;
-      height: 100%;
-      rotate: 6deg;
-      background: var(--clr-accent);
-      left: -0.7rem;
-      border-radius: 40% 20% / 10%;
-    }
-  }
-
-  .note {
-    article {
-      padding: 1rem;
-      height: 100%;
-      overflow-y: auto;
-      scrollbar-width: none;
-      position: relative;
-
-      &::-webkit-scrollbar {
-        width: 0;
-      }
-    }
-
-    pre {
-      overflow: scroll;
-      &::-webkit-scrollbar {
-        width: 0;
-      }
-    }
-  }
-
-  &-svg {
-    &_top {
-      position: absolute;
-      top: -16.0625em;
-      z-index: -1;
-      color: var(--clr-accent);
-
-      @include breakpoint-up('large') {
-        top: -20.0625em;
-      }
-
-      @include breakpoint-down('small') {
-        top: -10em;
-      }
-
-      @include breakpoint-up('xlarge') {
-        top: -25em;
-      }
-    }
-
-    &_bottom {
-      position: absolute;
-      bottom: -0.0625em;
-      z-index: -1;
-      color: var(--clr-background);
-    }
-  }
-}
diff --git a/archives/modules/component/_title.scss b/archives/modules/component/_title.scss
deleted file mode 100644
index 2ab2c8d..0000000
--- a/archives/modules/component/_title.scss
+++ /dev/null
@@ -1,338 +0,0 @@
-.title {
-  &-container {
-    display: flex;
-    gap: 2rem;
-    max-width: 70rem;
-    padding: 3rem 2rem;
-    align-items: flex-start;
-    z-index: 0;
-
-    @include breakpoint-up('large') {
-      // background-color: var(--clr-background);
-      border-radius: 0.3em;
-    }
-
-    .title {
-      &-left {
-        flex: 1 0 auto;
-        max-width: 45ch;
-      }
-
-      &-right {
-        position: relative;
-        width: 25rem;
-        height: 20rem;
-
-        @include breakpoint-down('medium') {
-          width: 100%;
-        }
-
-        &:hover {
-          .note.has-been-animated {
-            rotate: 0deg;
-            scale: 1.1;
-          }
-        }
-
-        .note.has-been-animated {
-          rotate: 3deg;
-          --_scale: 300ms;
-          --_rotate: 700ms;
-        }
-
-        .note {
-          rotate: -10deg;
-        }
-
-        &::before {
-          rotate: 9deg;
-          content: '';
-          position: absolute;
-          width: 100%;
-          height: 100%;
-          background-color: var(--clr-complementary);
-          left: -0.7rem;
-          border-radius: 40% 20% / 90%;
-          animation: rolling 3s infinite ease-in;
-        }
-
-        @keyframes rolling {
-          50% {
-            rotate: -9deg;
-            scale: 1.01;
-          }
-        }
-      }
-    }
-
-    @include breakpoint-down('medium') {
-      flex-direction: column-reverse;
-    }
-  }
-
-  &-side {
-    &_top {
-      display: flex;
-      flex: 0 0 auto;
-      flex-direction: column;
-      gap: 0.4rem;
-      width: 100%;
-    }
-
-    &_bottom {
-      width: 100%;
-      font-size: 1.2rem;
-
-      h2 {
-        margin-bottom: 0.5rem;
-        text-transform: uppercase;
-        letter-spacing: 0.1rem;
-
-        @include breakpoint-down('small') {
-          font-size: 1.2rem;
-        }
-      }
-
-      .status-area {
-        display: flex;
-        align-items: center;
-        justify-content: flex-start;
-        gap: 0.5em;
-        font-size: 1rem;
-        margin-bottom: 0.5em;
-
-        >.status-icon {
-          width: 0.75em;
-          height: 0.75em;
-          background-color: var(--clr-accent);
-          border-radius: 50%;
-        }
-
-        .status-hoverable {
-          position: relative;
-          cursor: pointer;
-
-          &:is(:hover, :focus),
-          &:has(:is(:hover, :focus)) {
-            .status-card {
-              visibility: visible;
-              user-select: text;
-              pointer-events: unset;
-              translate: -50% 0%;
-            }
-          }
-
-          .status-card {
-            visibility: hidden;
-            user-select: none;
-            pointer-events: none;
-            background-color: var(--clr-background);
-            box-shadow: 0 0.625rem 1.25rem hsla(0, 0%, 0%, 0.4);
-            // box-shadow: 0 0.625rem 1.25rem hsla(270, 71%, 22%, 0.7);
-            padding: 1em;
-            left: 50%;
-            border-radius: 0.2em;
-            width: 25ch;
-            position: absolute;
-            z-index: 70;
-            margin-top: 0.2em;
-            translate: -50% 20%;
-            transition: all 200ms ease-in-out;
-
-            &-header {
-              font-size: 0.9em;
-              letter-spacing: normal;
-              margin-bottom: unset;
-            }
-
-            &-body {
-              margin-top: 1em;
-              display: flex;
-              gap: 1em;
-
-              .status-card-left {
-                display: flex;
-                align-items: center;
-                justify-content: center;
-                background-color: var(--clr-foreground-900);
-                border-radius: 0.4em;
-                width: 6ch;
-                height: 6ch;
-                flex: 0 0 auto;
-
-                svg {
-                  width: 75%;
-                  height: 75%;
-                }
-              }
-
-              .status-card-right {
-                font-size: 0.7em;
-                font-weight: normal;
-              }
-            }
-
-            &-button {
-              text-align: center;
-              font-weight: normal;
-              display: block;
-              width: 100%;
-              margin-top: 1em;
-              font-size: 0.9em;
-              background-color: var(--clr-accent);
-              padding: 0.4em;
-              border-radius: 0.2em;
-              color: var(--clr-white);
-
-              &:is(:hover, :focus) {
-                background-color: var(--clr-accent-dark);
-                color: var(--clr-white);
-              }
-            }
-
-            &:is(:hover, :focus) {
-              visibility: visible;
-              user-select: text;
-              pointer-events: unset;
-              translate: -50% 0%;
-            }
-          }
-        }
-      }
-    }
-  }
-
-  &-link {
-    display: block;
-    width: max-content;
-  }
-
-  &-activity {
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    margin-bottom: -0.4rem;
-
-    &__details {
-      margin-left: 0.4rem;
-      font-weight: 300;
-      user-select: none;
-      color: var(--clr-foreground-900);
-
-      #month {
-        font-weight: 600;
-      }
-
-
-      #activity {
-        display: inline-block;
-        position: relative;
-        font-weight: 400;
-        z-index: 0;
-
-        &::before {
-          content: '';
-          position: absolute;
-          width: 70%;
-          height: 0.2rem;
-          bottom: 0;
-          border-bottom: 0.1rem dashed var(--clr-accent);
-        }
-      }
-    }
-
-    #year,
-    svg,
-    #month {
-      color: var(--clr-foreground-900)
-    }
-
-    svg {
-      width: 1.2rem;
-    }
-  }
-
-  &-text {
-    font-size: 2.4rem;
-    font-weight: 700;
-    margin-left: -0.1rem;
-    transition: font-size 300ms ease-in;
-  }
-
-  &-action {
-    display: flex;
-    flex-direction: row;
-    margin-top: 1.2rem;
-    color: var(--clr-white);
-    background: var(--clr-accent-dark);
-    background-image: linear-gradient(-90deg,
-        var(--clr-accent),
-        var(--clr-accent-dark));
-    border-radius: 0.3rem;
-    padding: 0.5rem 1.5rem;
-    align-items: center;
-    gap: 0.4rem;
-    cursor: pointer;
-    font-size: 1.3rem;
-    transition: all 300ms ease-out;
-
-    &:hover,
-    &:focus-visible {
-      color: hsl(0, 0%, 80%);
-      background-color: var(--clr-accent);
-      filter: brightness(140%);
-      box-shadow: 0 0.3125rem 0.625rem hsla(0, 0%, 0%, 0.4);
-      scale: 1.04;
-    }
-
-    svg {
-      height: 1.3rem;
-      width: 1.3rem;
-    }
-
-    &[disabled] {
-      cursor: not-allowed;
-
-      &:hover {
-        scale: 0.96;
-        box-shadow: inset 0 0.3125rem 0.625rem hsla(0, 0%, 0%, 0.4);
-        filter: grayscale(100);
-      }
-    }
-
-    &.secondary {
-      background-color: var(--clr-background-800);
-      color: var(--clr-foreground-800);
-      background-image: none;
-      box-shadow: none;
-
-      &:hover,
-      &:focus-visible {
-        filter: brightness(100%);
-        scale: 0.98;
-      }
-    }
-
-    &__group {
-      display: flex;
-      gap: 0.6rem;
-    }
-  }
-
-  &-submenu {
-    display: flex;
-    position: relative;
-    margin-top: -0.4rem;
-    margin-left: 0.4rem;
-    align-items: center;
-    gap: 0.3rem;
-    color: var(--clr-foreground-800);
-    user-select: none;
-    z-index: 0;
-
-    svg {
-      height: 1rem;
-      rotate: 180deg;
-    }
-  }
-}
\ No newline at end of file
diff --git a/archives/style.scss b/archives/style.scss
deleted file mode 100644
index 5dec5b8..0000000
--- a/archives/style.scss
+++ /dev/null
@@ -1,25 +0,0 @@
-@import './modules/vars';
-@import './modules/mixin';
-@import './modules/global';
-
-@import './modules/header';
-@import './modules/component/nav';
-@import './modules/component/title';
-@import './modules/main';
-@import './modules/footer';
-
-@import './modules/component/prototype';
-@import './modules/component/card';
-@import './modules/component/partof';
-@import './modules/component/preload';
-
-@import './modules/component/aboutme';
-@import './modules/component/hero';
-@import './modules/component/featured';
-@import './modules/component/post';
-@import './modules/component/article';
-@import './modules/component/clients';
-@import './modules/component/animation';
-@import './modules/component/contact';
-
-@import './modules/component/error';
\ No newline at end of file
diff --git a/bin/ewTools.class.js b/bin/ewTools.class.js
new file mode 100644
index 0000000..e89e095
--- /dev/null
+++ b/bin/ewTools.class.js
@@ -0,0 +1,228 @@
+import fs from "fs"
+import path from "path"
+import dotenv from "dotenv"
+import chalk from "chalk"
+
+class Configuration {
+    static load() {
+        dotenv.config()
+    }
+
+    static get(key) {
+        Configuration.load()
+        return process.env[key]
+    }
+}
+
+class Logger {
+    static isDevelopment = Configuration.get("TOOLS_ENV") === "development"
+    static debugModeSuffix = chalk.gray(`[debug]`)
+    static Types = Object.freeze({
+        INFO: "Info",
+        WARN: "Warning",
+        ERROR: "Error",
+        EMPTY: ""
+    })
+
+    static log(text, type = Logger.Types.EMPTY) {
+        const typeFormatted = type ? `${type}:` : ""
+        if (this.isDevelopment) console.log(`${Ewtools.programSuffix}${this.debugModeSuffix} ${typeFormatted}`, text)
+    }
+}
+
+class FlagsProcessor {
+    static formatFlagsString(args) {
+        if (!Array.isArray(args) || args.length === 0) return ""
+        let isPreviousDump = false
+
+        return args.map((token, index) => {
+            if (index === 0) return token
+            if (token.startsWith("-") || isPreviousDump) {
+                if (token.includes("dump")) { isPreviousDump = true } else { isPreviousDump = false }
+                return "+" + token
+            }
+
+            return ";" + token
+        }).join("")
+    }
+
+    static parseFlags(flags) {
+        const paramWithValue = flags.split("+")
+        const flagsObject = {}
+        paramWithValue.forEach(token => {
+            let [attr, value] = token.split(";")
+            if (!value) value = true
+            if (attr.startsWith("--")) {
+                flagsObject[attr.slice(2)] = value
+            } else {
+                flagsObject[attr.slice(1)] = value
+            }
+        })
+        return flagsObject
+    }
+}
+
+class FileHandler {
+    static ActionTypes = Object.freeze({ MAKE: "make", DELETE: "delete", REMOVE: "remove" })
+    static EntityTypes = Object.freeze({ BLOG: "blog", PROJECT: "project", PROTOTYPE: "prototype" })
+
+    static generateFilePath(title, type, flags) {
+        let date = flags.d || new Date().toISOString()
+        const [year, month, day] = date.split("T")[0].split("-")
+
+        if (!(year && month && day)) {
+            console.log("Invalid date format. Please provide -d yyyy-mm-dd")
+            process.exit(1)
+        }
+
+        const formattedDate = type === this.EntityTypes.PROTOTYPE ? year : `${year}-${month}-${day}`
+        const filename = `${formattedDate}-${title.replace(/\s+/g, "-").toLowerCase()}.md`.replace(/[<>:"\/\\|?*]+/g, "")
+        const filepath = path.join(process.cwd(), `src/articles/${type}`, filename)
+
+        return { filename, filepath }
+    }
+
+    static handleError(error, filename, { type, action = this.ActionTypes.MAKE }) {
+        if (error) return console.error(`${Ewtools.programSuffix} Error creating file: ${error.message}`)
+        console.log(`${Ewtools.programSuffix} File "${type}/${filename}" ${action === this.ActionTypes.MAKE ? "created" : "removed"} successfully.`)
+    }
+
+    static generateFile(title, entityType, flags, getContentFunction) {
+        const { filename, filepath } = this.generateFilePath(title, entityType, flags)
+        const content = getContentFunction(title, flags)
+        fs.writeFile(filepath, content, (error) => this.handleError(error, filename, { type: entityType }))
+    }
+
+    static removeFile(title, entityType, flags) {
+        const { filename, filepath } = this.generateFilePath(title, entityType, flags)
+        fs.rm(filepath, (error) => this.handleError(error, filename, { type: entityType, action: this.ActionTypes.DELETE }))
+    }
+
+    static getAllActionTypes() {
+        return Object.values(this.ActionTypes).map((action, index, arr) => (index === arr.length - 1 ? ` and \`${action}\`` : ` \`${action}\`,`)).join("")
+    }
+
+    static getAllEntityTypes() {
+        return Object.values(this.EntityTypes).map((entity, index, arr) => (index === arr.length - 1 ? ` and \`${entity}\`` : ` \`${entity}\`,`)).join("")
+    }
+}
+
+class ContentGenerator {
+    static tagsHandler(tags) {
+        return typeof tags === "string" ? tags.split(",").map(tag => `\n  - ${tag}`).join("") : ""
+    }
+
+    static getDefaultBlogContent(title, flags = {}) {
+        return `---
+title: ${title}
+description: 
+author: 
+draft: true
+date: ${new Date().toISOString()}
+tags:
+  - post${ContentGenerator.tagsHandler(flags.t)}
+---\n`
+    }
+
+    static getDefaultProjectContent(title, flags = {}) {
+        return `---
+title: ${title}
+description:
+date:
+endDate:
+image:
+linkDemo:
+linkCode:
+tags:
+  - project${ContentGenerator.tagsHandler(flags.t)}
+---\n`
+    }
+
+    static getDefaultPrototypeContent(title, flags = {}) {
+        return `---
+title: ${title}
+status: 1
+description: 
+date:
+linkDemo: 
+language: 
+code: |-
+tags:
+  - prototype${ContentGenerator.tagsHandler(flags.t)}
+---\n`
+    }
+}
+
+class Ewtools {
+    static programSuffix = `${chalk.gray(`[`)}${chalk.green(`EwT`)}${chalk.gray(`/bin]`)}`
+
+    constructor(args) {
+        this.args = args
+        this.command = args[0]
+        this.title = args[1]
+        this.restArgs = args.slice(2)
+        this.flags = FlagsProcessor.parseFlags(FlagsProcessor.formatFlagsString(this.restArgs))
+        this.action = this.command.split(":")[0]
+        this.type = this.command.split(":")[1]
+    }
+
+    validateArgs() {
+        if (this.args.length < 2) {
+            console.log(`${Ewtools.programSuffix} Usage: ${chalk.green(`./ewtools.bat make:blog "title"`)}`)
+            process.exit(1)
+        }
+    }
+
+    execute() {
+        this.validateArgs()
+        Logger.log(this.args, Logger.Types.INFO)
+        Logger.log(this.flags, Logger.Types.INFO)
+        Logger.log(FlagsProcessor.formatFlagsString(this.restArgs), Logger.Types.INFO)
+
+        if (!this.flags.dump && !this.flags.dp) switch (this.action) {
+            case FileHandler.ActionTypes.MAKE:
+                this.handleMake()
+                break
+
+            case FileHandler.ActionTypes.REMOVE:
+            case FileHandler.ActionTypes.DELETE:
+                this.handleDelete()
+                break
+
+            default:
+                console.log(`${Ewtools.programSuffix} Invalid Action. Valid Actions: ${chalk.green(FileHandler.getAllActionTypes())}`)
+        }
+    }
+
+    handleMake() {
+        switch (this.type) {
+            case FileHandler.EntityTypes.BLOG:
+                FileHandler.generateFile(this.title, this.type, this.flags, ContentGenerator.getDefaultBlogContent)
+                break
+
+            case FileHandler.EntityTypes.PROJECT:
+                FileHandler.generateFile(this.title, this.type, this.flags, ContentGenerator.getDefaultProjectContent)
+                break
+
+            case FileHandler.EntityTypes.PROTOTYPE:
+                FileHandler.generateFile(this.title, this.type, this.flags, ContentGenerator.getDefaultPrototypeContent)
+                break
+
+            default:
+                console.log(`${Ewtools.programSuffix} Invalid Type, Valid Types: ${chalk.green(FileHandler.getAllEntityTypes())}`)
+        }
+    }
+
+    handleDelete() {
+        if (this.type === "" || this.type === undefined) return console.log(`${Ewtools.programSuffix} Invalid Type, Valid Types: ${chalk.green(FileHandler.getAllEntityTypes())}`)
+        FileHandler.removeFile(this.title, this.type, this.flags)
+    }
+}
+
+const args = process.argv.slice(2)
+
+if (args.length <= 0) {
+    console.log(`${Ewtools.programSuffix} Usage: ${chalk.green(`./ewtools.bat make:blog "title"`)}`)
+} else {
+    new Ewtools(args).execute()
+}
\ No newline at end of file
diff --git a/bin/ewTools.js b/bin/ewTools.js
new file mode 100644
index 0000000..4cf7ccb
--- /dev/null
+++ b/bin/ewTools.js
@@ -0,0 +1,199 @@
+import fs from "fs"
+import path from "path"
+import dotenv from "dotenv"
+import chalk from "chalk"
+
+dotenv.config()
+const programSuffix = `${chalk.gray(`[`)}${chalk.green(`EwT`)}${chalk.gray(`/bin]`)}`
+const debugModeSuffix = chalk.gray(`[debug]`)
+const isDevelopment = process.env.TOOLS_ENV === "development"
+const LoggerType = Object.freeze({
+    INFO: "Info",
+    WARN: "Warning",
+    ERROR: "Error",
+    EMPTY: ""
+})
+
+const getAllActionTypes = () => Object.values(ActionTypes).map((action, index, arr) => (index === arr.length - 1 ? ` and \`${action}\`` : ` \`${action}\`,`)).join("")
+
+const getAllEntityTypes = () => Object.values(EntityTypes).map((entity, index, arr) => (index === arr.length - 1 ? ` and \`${entity}\`` : ` \`${entity}\`,`)).join("")
+
+const Logger = (text, type = LoggerType.EMPTY) => {
+    const typeFormatted = (type === LoggerType.EMPTY) ? `${type}` : `${type}:`
+    if (isDevelopment) console.log(`${programSuffix}${debugModeSuffix} ${typeFormatted}`, text)
+}
+
+const formatFlagsString = (args) => {
+    if (!Array.isArray(args) || args.length === 0) return "";
+    let isPreviousDump = false
+
+    return args.map((token, index) => {
+        if (index === 0) return token
+        if (token.startsWith("-") || isPreviousDump) {
+            if (token.includes("dump")) { isPreviousDump = true } else { isPreviousDump = false }
+            return "+" + token
+        }
+
+        return ";" + token
+    }).join("")
+}
+
+const flagsHandler = (flags) => {
+    const paramWithValue = flags.split("+")
+    const flagsObject = {}
+    paramWithValue.forEach(token => {
+        let [attr, value] = token.split(";")
+        if (!value) value = true
+        if (attr.startsWith("--")) {
+            flagsObject[attr.slice(2)] = value
+        } else {
+            flagsObject[attr.slice(1)] = value
+        }
+    })
+    return flagsObject
+}
+
+const args = process.argv.slice(2)
+if (args.length <= 0) {
+    console.log(`${programSuffix} Usage: ${chalk.green(`./ewtools.bat make:blog "title"`)}`)
+    process.exit()
+}
+const [command, title, ...restArgs] = args
+const [action, type] = command.split(':')
+const formattedFlags = formatFlagsString(restArgs)
+const flagsObject = flagsHandler(formattedFlags)
+Logger(args, LoggerType.INFO)
+Logger(flagsObject, LoggerType.INFO)
+Logger(formattedFlags, LoggerType.INFO)
+
+const ActionTypes = Object.freeze({
+    MAKE: "make",
+    DELETE: "delete",
+    REMOVE: "remove"
+})
+
+const EntityTypes = Object.freeze({
+    BLOG: "blog",
+    PROJECT: "project",
+    PROTOTYPE: "prototype"
+})
+
+if (args.length < 2) {
+    console.log(`${programSuffix} Usage: ${chalk.green(`./ewtools.bat make:blog "title"`)}`)
+    process.exit(1)
+}
+
+const handleError = (error, filename, { type, action = ActionTypes.MAKE } = {}) => {
+    if (error) return console.error(`${programSuffix} Error creating file: ${error.message}`)
+    const currentAction = (action === ActionTypes.MAKE) ? "created" : "removed"
+    console.log(`${programSuffix} File "${type}/${filename}" ${currentAction} successfully.`)
+}
+
+const generateFile = (title, entityType, getContent) => {
+    const { filename, filepath } = generateFilePath(title, entityType)
+    const content = getContent(title, flagsObject)
+    fs.writeFile(filepath, content, error => handleError(error, filename, { type: entityType }))
+}
+
+const generateBlogFile = (title) => generateFile(title, EntityTypes.BLOG, getDefaultBlogContent)
+
+const generateProjectFile = (title) => generateFile(title, EntityTypes.PROJECT, getDefaultProjectContent)
+
+const generatePrototypeFile = (title) => generateFile(title, EntityTypes.PROTOTYPE, getDefaultPrototypeContent)
+
+const removeFile = (title, entityType) => {
+    const { filename, filepath } = generateFilePath(title, entityType)
+    fs.rm(filepath, (error) => handleError(error, filename, { action: ActionTypes.DELETE, type: entityType }))
+}
+
+const generateFilePath = (title, type) => {
+    let date = flagsObject.d || new Date().toISOString()
+    const [year, month, day] = date.split("T")[0].split("-")
+    if (!(year && month && day)) {
+        console.log(`${programSuffix} Invalid date format. Please provide -d yyyy-mm-dd`)
+        process.exit(1)
+    }
+    const formattedDate = type === EntityTypes.PROTOTYPE ? year : `${year}-${month}-${day}`
+    const filename = `${formattedDate}-${title.replace(/\s+/g, "-").toLowerCase()}.md`.replace(/[<>:"\/\\|?*]+/g, "")
+    const filepath = path.join(process.cwd(), `src/articles/${type}`, filename)
+
+    return { filename, filepath }
+}
+
+const tagsHandler = (tags) => typeof tags === "string" ? tags.split(",").map(tag => `\n  - ${tag}`).join("") : ""
+
+const getDefaultBlogContent = (title, flags = {}) => `---
+title: ${title}
+description: 
+author: 
+draft: true
+date: ${new Date().toISOString()}
+tags:
+  - post${tagsHandler(flags.t)}
+---\n`
+const getDefaultProjectContent = (title, flags = {}) => `---
+title: ${title}
+description:
+date:
+endDate:
+image:
+linkDemo:
+linkCode:
+tags:
+  - project${tagsHandler(flags.t)}
+---\n`
+const getDefaultPrototypeContent = (title, flags = {}) => `---
+title: ${title}
+status: 1
+description: 
+date:
+linkDemo: 
+language: 
+code: |-
+tags:
+  - prototype${tagsHandler(flags.t)}
+---\n`
+
+const handleMake = (type, title) => {
+    switch (type) {
+        case EntityTypes.BLOG:
+            generateBlogFile(title)
+            break
+        case EntityTypes.PROJECT:
+            generateProjectFile(title)
+            break
+        case EntityTypes.PROTOTYPE:
+            generatePrototypeFile(title)
+            break
+        default:
+            console.log(`${programSuffix} Invalid Type, Valid Types: ${getAllEntityTypes()}`)
+    }
+}
+
+const handleDelete = (type, title) => {
+    switch (type) {
+        case EntityTypes.BLOG:
+            removeFile(title, EntityTypes.BLOG)
+            break
+        case EntityTypes.PROJECT:
+            removeFile(title, EntityTypes.PROJECT)
+            break
+        case EntityTypes.PROTOTYPE:
+            removeFile(title, EntityTypes.PROTOTYPE)
+            break
+        default:
+            console.log(`${programSuffix} Invalid Type, Valid Types: ${getAllEntityTypes()}`)
+    }
+}
+
+if (!flagsObject.dump && !flagsObject.dp) switch (action) {
+    case ActionTypes.MAKE:
+        handleMake(type, title)
+        break
+    case ActionTypes.DELETE:
+    case ActionTypes.REMOVE:
+        handleDelete(type, title)
+        break
+    default:
+        console.log(`${programSuffix} Invalid Action. Valid Actions: ${getAllActionTypes()}`)
+}
diff --git a/bin/minify.js b/bin/minify.js
new file mode 100644
index 0000000..e919b8e
--- /dev/null
+++ b/bin/minify.js
@@ -0,0 +1,25 @@
+import { glob } from "glob";
+import chalk from "chalk";
+import { execSync } from "child_process";
+import path from "path";
+import fs from "fs";
+
+const files = glob.sync("src/assets/js/*.js");
+console.log(
+    `${chalk.gray(`[`)}${chalk.green(`Ew`)}${chalk.gray(`/Terser]`)}`,
+    chalk.white(`Minifying ${files.length} file(s)`)
+);
+for (const file of files) {
+    const out = path.join("public/js", path.basename(file));
+    fs.mkdirSync(path.dirname(out), { recursive: true });
+    execSync(`terser "${file}" -o "${out}" -c -m`);
+    console.log(
+        `${chalk.gray(`[`)}${chalk.green(`Ew`)}${chalk.gray(`/Terser]`)}`,
+        chalk.white(`Writing ${out}`),
+        chalk.gray(`from ${file}`)
+    );
+}
+console.log(
+    `${chalk.gray(`[`)}${chalk.green(`Ew`)}${chalk.gray(`/Terser]`)}`,
+    chalk.white(`Minification complete ${files.length} file(s)`)
+);
\ No newline at end of file
diff --git a/ewtools.bat b/ewtools.bat
new file mode 100644
index 0000000..cd8f9a7
--- /dev/null
+++ b/ewtools.bat
@@ -0,0 +1,3 @@
+@echo off
+set SCRIPT_DIR=%~dp0
+node %SCRIPT_DIR%/bin/ewTools.js %*
\ No newline at end of file
diff --git a/ewtools.class.bat b/ewtools.class.bat
new file mode 100644
index 0000000..122f965
--- /dev/null
+++ b/ewtools.class.bat
@@ -0,0 +1,3 @@
+@echo off
+set SCRIPT_DIR=%~dp0
+node %SCRIPT_DIR%/bin/ewTools.class.js %*
\ No newline at end of file
diff --git a/lib/highlightjs-lines.js b/lib/highlightjs-lines.js
new file mode 100644
index 0000000..f972dfb
--- /dev/null
+++ b/lib/highlightjs-lines.js
@@ -0,0 +1,43 @@
+/**
+ * This will convert every lines that is not
+ * starts with - or + (diff-support) to be encase 
+ * inside a div with the class of hljs-line
+ * 
+ * @param {*} hljs 
+ * @returns 
+ */
+
+export default function (hljs) {
+    function highlight(code, options) {
+        const result = hljs.highlight(code, { ...options, language: options.language })
+        const lines = result.value.split('\n')
+
+        const processedLines = lines.map(line => {
+            const hasAddition = line.startsWith(`<span class="hljs-addition">+`)
+            const hasDeletion = line.startsWith(`<span class="hljs-deletion">-`)
+            const isEmpty = line === ""
+            let outputLine = line.replace("+ ", "<span class='hljs-indicator'>+</span>").replace("- ", "<span class='hljs-indicator'>-</span>");
+            if (!isEmpty && !hasAddition && !hasDeletion) {
+                outputLine = `<span class="hljs-line">${line}</span>`
+            }
+
+            return outputLine
+        }).join('\n')
+
+        return {
+            ...result,
+            code,
+            value: processedLines,
+            language: options.language
+        }
+    }
+
+    return {
+        ...hljs,
+        highlight(codeOrLanguageName, optionsOrCode, ignoreIllegals = false) {
+            return typeof optionsOrCode === 'string'
+                ? highlight(optionsOrCode, { language: codeOrLanguageName, ignoreIllegals })
+                : highlight(codeOrLanguageName, optionsOrCode)
+        }
+    }
+}
\ No newline at end of file
diff --git a/lib/highlightjs-lines.test.js b/lib/highlightjs-lines.test.js
new file mode 100644
index 0000000..b7793b4
--- /dev/null
+++ b/lib/highlightjs-lines.test.js
@@ -0,0 +1,122 @@
+import highlight from "highlight.js"
+import highlightjsLines from "./highlightjs-lines.js"
+import highlightDiff from "highlightjs-code-diff"
+import markdownIt from "markdown-it"
+import { describe, it } from 'node:test'
+import assert from "node:assert"
+
+const hljsLinesWithDiff = highlightjsLines(highlightDiff(highlight))
+const hljsLines = highlightjsLines(highlight)
+
+describe('Highlight Lines using Markdown With Diff', () => {
+    const mIt = markdownIt({
+        html: true,
+        linkify: true,
+        typographer: true,
+        highlight: function (str, lang) {
+            if (lang) {
+                try {
+                    return hljsLinesWithDiff.highlight(str, { language: lang }).value
+                } catch (__) { }
+            }
+            return ""
+        }
+    })
+    it('Test With Diff (Deletion)', () => {
+        const data = `
+\`\`\`diff:js
+- setTimeout(() => throw new Error(),0)
+\`\`\`
+`
+        const value = mIt.render(data)
+        assert.strictEqual(value, `<pre><code class="language-diff:js"><span class="hljs-deletion"><span class='hljs-indicator'>-</span><span class="hljs-built_in">setTimeout</span>(<span class="hljs-function">() =&gt;</span> <span class="hljs-keyword">throw</span> <span class="hljs-keyword">new</span> <span class="hljs-title class_">Error</span>(),<span class="hljs-number">0</span>)</span>\n</code></pre>\n`)
+    })
+    it('Test With Diff (Addition)', () => {
+        const data = `
+\`\`\`diff:js
++ setTimeout(() => throw new Error(),0)
+\`\`\`
+`
+        const value = mIt.render(data)
+        assert.strictEqual(value, `<pre><code class="language-diff:js"><span class="hljs-addition"><span class='hljs-indicator'>+</span><span class="hljs-built_in">setTimeout</span>(<span class="hljs-function">() =&gt;</span> <span class="hljs-keyword">throw</span> <span class="hljs-keyword">new</span> <span class="hljs-title class_">Error</span>(),<span class="hljs-number">0</span>)</span>\n</code></pre>\n`)
+    })
+    it('Normal Test', () => {
+        const data = `
+\`\`\`js
+let time = new Date()
+\`\`\`
+`
+        const value = mIt.render(data)
+        assert.strictEqual(value, `<pre><code class="language-js"><span class="hljs-line"><span class="hljs-keyword">let</span> time = <span class="hljs-keyword">new</span> <span class="hljs-title class_">Date</span>()</span>\n</code></pre>\n`)
+    })
+})
+
+describe("Highlight Lines with Diff", async (t) => {
+    it("Test With Diff (Deletion)", () => {
+        const code = ` function helloWorld () {
+-  return 'Hello'
+ }
+`
+        const { value } = hljsLinesWithDiff.highlight(code, { language: 'diff:js' })
+        assert.strictEqual(value, `<span class="hljs-line"> <span class="hljs-keyword">function</span> <span class="hljs-title function_">helloWorld</span> (<span class="hljs-params"></span>) {</span>
+<span class="hljs-deletion"><span class='hljs-indicator'>-</span> <span class="hljs-keyword">return</span> <span class="hljs-string">&#x27;Hello&#x27;</span></span>
+<span class="hljs-line"> }</span>\n`)
+    })
+    it("Test With Diff (Addition)", () => {
+        const code = ` function helloWorld () {
++  return 'Hello, world!'
+ }
+`
+        const { value } = hljsLinesWithDiff.highlight(code, { language: 'diff:js' })
+        assert.strictEqual(value, `<span class="hljs-line"> <span class="hljs-keyword">function</span> <span class="hljs-title function_">helloWorld</span> (<span class="hljs-params"></span>) {</span>
+<span class="hljs-addition"><span class='hljs-indicator'>+</span> <span class="hljs-keyword">return</span> <span class="hljs-string">&#x27;Hello, world!&#x27;</span></span>
+<span class="hljs-line"> }</span>\n`)
+    })
+    it("Normal Test", () => {
+        const code = ` function helloWorld () {
+   return 'Hello'
+   return 'Hello, world!'
+ }
+`
+        const { value } = hljsLinesWithDiff.highlight(code, { language: 'diff:js' })
+        assert.strictEqual(value, `<span class="hljs-line"> <span class="hljs-keyword">function</span> <span class="hljs-title function_">helloWorld</span> (<span class="hljs-params"></span>) {</span>
+<span class="hljs-line">   <span class="hljs-keyword">return</span> <span class="hljs-string">&#x27;Hello&#x27;</span></span>
+<span class="hljs-line">   <span class="hljs-keyword">return</span> <span class="hljs-string">&#x27;Hello, world!&#x27;</span></span>
+<span class="hljs-line"> }</span>\n`)
+    })
+})
+
+describe("Highlight Lines", async (t) => {
+    it("Test With Diff (Deletion)", () => {
+        const code = ` function helloWorld () {
+-  return 'Hello'
+ }
+`
+        const { value } = hljsLines.highlight(code, { language: 'js' })
+        assert.strictEqual(value, `<span class="hljs-line"> <span class="hljs-keyword">function</span> <span class="hljs-title function_">helloWorld</span> (<span class="hljs-params"></span>) {</span>
+<span class="hljs-line">-  <span class="hljs-keyword">return</span> <span class="hljs-string">&#x27;Hello&#x27;</span></span>
+<span class="hljs-line"> }</span>\n`)
+    })
+    it("Test With Diff (Addition)", () => {
+        const code = ` function helloWorld () {
++  return 'Hello, world!'
+ }
+`
+        const { value } = hljsLines.highlight(code, { language: 'js' })
+        assert.strictEqual(value, `<span class="hljs-line"> <span class="hljs-keyword">function</span> <span class="hljs-title function_">helloWorld</span> (<span class="hljs-params"></span>) {</span>
+<span class="hljs-line">+  <span class="hljs-keyword">return</span> <span class="hljs-string">&#x27;Hello, world!&#x27;</span></span>
+<span class="hljs-line"> }</span>\n`)
+    })
+    it("Normal Test", () => {
+        const code = ` function helloWorld () {
+   return 'Hello'
+   return 'Hello, world!'
+ }
+`
+        const { value } = hljsLines.highlight(code, { language: 'js' })
+        assert.strictEqual(value, `<span class="hljs-line"> <span class="hljs-keyword">function</span> <span class="hljs-title function_">helloWorld</span> (<span class="hljs-params"></span>) {</span>
+<span class="hljs-line">   <span class="hljs-keyword">return</span> <span class="hljs-string">&#x27;Hello&#x27;</span></span>
+<span class="hljs-line">   <span class="hljs-keyword">return</span> <span class="hljs-string">&#x27;Hello, world!&#x27;</span></span>
+<span class="hljs-line"> }</span>\n`)
+    })
+})
\ No newline at end of file
diff --git a/package-lock.json b/package-lock.json
index 8a08ccc..3ac0b9b 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -9,24 +9,32 @@
       "version": "1.0.0",
       "license": "MIT",
       "dependencies": {
+        "@11ty/eleventy-img": "^6.0.4",
+        "chalk": "^5.4.1",
         "dotenv": "^16.5.0",
+        "glob": "^11.0.3",
         "highlight.js": "^11.5.1",
+        "highlightjs-code-diff": "^1.0.0",
         "markdown-it-anchor": "^9.2.0",
         "markdown-it-attrs": "^4.1.4",
         "markdown-it-bracketed-spans": "^1.0.1",
         "markdown-it-mark": "^4.0.0",
         "markdown-it-table-of-contents": "^0.9.0",
         "npm-run-all": "^4.1.5",
-        "sass": "^1.49.8"
+        "sass": "1.89.2",
+        "terser": "^5.42.0"
       },
       "devDependencies": {
         "@11ty/eleventy": "^3.1.1",
         "@11ty/eleventy-plugin-rss": "^2.0.4",
+        "@playwright/test": "^1.53.1",
+        "@types/node": "^24.0.7",
         "autoprefixer": "^10.4.21",
-        "postcss": "^8.4.31",
+        "postcss": "^8.5.5",
         "postcss-cli": "^11.0.1",
         "postcss-import": "^16.1.0",
-        "postcss-nested": "^7.0.2"
+        "postcss-nested": "^7.0.2",
+        "prettier": "^3.5.3"
       }
     },
     "node_modules/@11ty/dependency-tree": {
@@ -53,9 +61,9 @@
       }
     },
     "node_modules/@11ty/eleventy": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/@11ty/eleventy/-/eleventy-3.1.1.tgz",
-      "integrity": "sha512-nsMCW44WSYzpi6JSQ1ar/wlotj/2cxuP4AABX5Dxqwol3IQ3SkEMgcAugP1t1mthv5I0kIB9lql1Jv/lhUHIkg==",
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/@11ty/eleventy/-/eleventy-3.1.2.tgz",
+      "integrity": "sha512-IcsDlbXnBf8cHzbM1YBv3JcTyLB35EK88QexmVyFdVJVgUU6bh9g687rpxryJirHzo06PuwnYaEEdVZQfIgRGg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -66,13 +74,13 @@
         "@11ty/eleventy-utils": "^2.0.7",
         "@11ty/lodash-custom": "^4.17.21",
         "@11ty/posthtml-urls": "^1.0.1",
-        "@11ty/recursive-copy": "^4.0.1",
+        "@11ty/recursive-copy": "^4.0.2",
         "@sindresorhus/slugify": "^2.2.1",
         "bcp-47-normalize": "^2.3.0",
         "chokidar": "^3.6.0",
         "debug": "^4.4.1",
         "dependency-graph": "^1.0.0",
-        "entities": "^6.0.0",
+        "entities": "^6.0.1",
         "filesize": "^10.1.6",
         "gray-matter": "^4.0.3",
         "iso-639-1": "^3.1.5",
@@ -135,6 +143,49 @@
         "url": "https://opencollective.com/11ty"
       }
     },
+    "node_modules/@11ty/eleventy-fetch": {
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/@11ty/eleventy-fetch/-/eleventy-fetch-5.1.0.tgz",
+      "integrity": "sha512-gSmCA3olJxRwtTkXyS+KIanq1kEufCC+JsHyTa7ta5NqmeUQlWA8zEngtXrDl+ebrAvFz2bNaxLd+0ERpnnSPQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@11ty/eleventy-utils": "^2.0.7",
+        "@rgrove/parse-xml": "^4.2.0",
+        "debug": "^4.4.0",
+        "flatted": "^3.3.3",
+        "p-queue": "6.6.2"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/11ty"
+      }
+    },
+    "node_modules/@11ty/eleventy-img": {
+      "version": "6.0.4",
+      "resolved": "https://registry.npmjs.org/@11ty/eleventy-img/-/eleventy-img-6.0.4.tgz",
+      "integrity": "sha512-jSy9BmubVs0mN76dcXWfSYDgRU+1+/rq/SxUR3MgIvTUAJRDop5pFW+Z1f56CDcOlEHaiPqHgnfOlqRmJvXl7g==",
+      "license": "MIT",
+      "dependencies": {
+        "@11ty/eleventy-fetch": "^5.1.0",
+        "@11ty/eleventy-utils": "^2.0.7",
+        "brotli-size": "^4.0.0",
+        "debug": "^4.4.0",
+        "entities": "^6.0.0",
+        "image-size": "^1.2.1",
+        "p-queue": "^6.6.2",
+        "sharp": "^0.33.5"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/11ty"
+      }
+    },
     "node_modules/@11ty/eleventy-plugin-bundle": {
       "version": "3.0.6",
       "resolved": "https://registry.npmjs.org/@11ty/eleventy-plugin-bundle/-/eleventy-plugin-bundle-3.0.6.tgz",
@@ -175,7 +226,6 @@
       "version": "2.0.7",
       "resolved": "https://registry.npmjs.org/@11ty/eleventy-utils/-/eleventy-utils-2.0.7.tgz",
       "integrity": "sha512-6QE+duqSQ0GY9rENXYb4iPR4AYGdrFpqnmi59tFp9VrleOl0QSh8VlBr2yd6dlhkdtj7904poZW5PvGr9cMiJQ==",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=18"
@@ -216,9 +266,9 @@
       }
     },
     "node_modules/@11ty/recursive-copy": {
-      "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/@11ty/recursive-copy/-/recursive-copy-4.0.1.tgz",
-      "integrity": "sha512-Zsg1xgfdVTMKNPj9o4FZeYa73dFZRX856CL4LsmqPMvDr0TuIK4cH9CVWJyf0OkNmM8GmlibGX18fF0B75Rn1w==",
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/@11ty/recursive-copy/-/recursive-copy-4.0.2.tgz",
+      "integrity": "sha512-174nFXxL/6KcYbLYpra+q3nDbfKxLxRTNVY1atq2M1pYYiPfHse++3IFNl8mjPFsd7y2qQjxLORzIjHMjL3NDQ==",
       "dev": true,
       "license": "ISC",
       "dependencies": {
@@ -231,6 +281,473 @@
         "node": ">=18"
       }
     },
+    "node_modules/@emnapi/runtime": {
+      "version": "1.4.3",
+      "resolved": "https://registry.npmjs.org/@emnapi/runtime/-/runtime-1.4.3.tgz",
+      "integrity": "sha512-pBPWdu6MLKROBX05wSNKcNb++m5Er+KQ9QkB+WVM+pW2Kx9hoSrVTnu3BdkI5eBLZoKu/J6mW/B6i6bJB2ytXQ==",
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "tslib": "^2.4.0"
+      }
+    },
+    "node_modules/@img/sharp-darwin-arm64": {
+      "version": "0.33.5",
+      "resolved": "https://registry.npmjs.org/@img/sharp-darwin-arm64/-/sharp-darwin-arm64-0.33.5.tgz",
+      "integrity": "sha512-UT4p+iz/2H4twwAoLCqfA9UH5pI6DggwKEGuaPy7nCVQ8ZsiY5PIcrRvD1DzuY3qYL07NtIQcWnBSY/heikIFQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      },
+      "optionalDependencies": {
+        "@img/sharp-libvips-darwin-arm64": "1.0.4"
+      }
+    },
+    "node_modules/@img/sharp-darwin-x64": {
+      "version": "0.33.5",
+      "resolved": "https://registry.npmjs.org/@img/sharp-darwin-x64/-/sharp-darwin-x64-0.33.5.tgz",
+      "integrity": "sha512-fyHac4jIc1ANYGRDxtiqelIbdWkIuQaI84Mv45KvGRRxSAa7o7d1ZKAOBaYbnepLC1WqxfpimdeWfvqqSGwR2Q==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      },
+      "optionalDependencies": {
+        "@img/sharp-libvips-darwin-x64": "1.0.4"
+      }
+    },
+    "node_modules/@img/sharp-libvips-darwin-arm64": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-darwin-arm64/-/sharp-libvips-darwin-arm64-1.0.4.tgz",
+      "integrity": "sha512-XblONe153h0O2zuFfTAbQYAX2JhYmDHeWikp1LM9Hul9gVPjFY427k6dFEcOL72O01QxQsWi761svJ/ev9xEDg==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "LGPL-3.0-or-later",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      }
+    },
+    "node_modules/@img/sharp-libvips-darwin-x64": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-darwin-x64/-/sharp-libvips-darwin-x64-1.0.4.tgz",
+      "integrity": "sha512-xnGR8YuZYfJGmWPvmlunFaWJsb9T/AO2ykoP3Fz/0X5XV2aoYBPkX6xqCQvUTKKiLddarLaxpzNe+b1hjeWHAQ==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "LGPL-3.0-or-later",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      }
+    },
+    "node_modules/@img/sharp-libvips-linux-arm": {
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-arm/-/sharp-libvips-linux-arm-1.0.5.tgz",
+      "integrity": "sha512-gvcC4ACAOPRNATg/ov8/MnbxFDJqf/pDePbBnuBDcjsI8PssmjoKMAz4LtLaVi+OnSb5FK/yIOamqDwGmXW32g==",
+      "cpu": [
+        "arm"
+      ],
+      "license": "LGPL-3.0-or-later",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      }
+    },
+    "node_modules/@img/sharp-libvips-linux-arm64": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-arm64/-/sharp-libvips-linux-arm64-1.0.4.tgz",
+      "integrity": "sha512-9B+taZ8DlyyqzZQnoeIvDVR/2F4EbMepXMc/NdVbkzsJbzkUjhXv/70GQJ7tdLA4YJgNP25zukcxpX2/SueNrA==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "LGPL-3.0-or-later",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      }
+    },
+    "node_modules/@img/sharp-libvips-linux-s390x": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-s390x/-/sharp-libvips-linux-s390x-1.0.4.tgz",
+      "integrity": "sha512-u7Wz6ntiSSgGSGcjZ55im6uvTrOxSIS8/dgoVMoiGE9I6JAfU50yH5BoDlYA1tcuGS7g/QNtetJnxA6QEsCVTA==",
+      "cpu": [
+        "s390x"
+      ],
+      "license": "LGPL-3.0-or-later",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      }
+    },
+    "node_modules/@img/sharp-libvips-linux-x64": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-x64/-/sharp-libvips-linux-x64-1.0.4.tgz",
+      "integrity": "sha512-MmWmQ3iPFZr0Iev+BAgVMb3ZyC4KeFc3jFxnNbEPas60e1cIfevbtuyf9nDGIzOaW9PdnDciJm+wFFaTlj5xYw==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "LGPL-3.0-or-later",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      }
+    },
+    "node_modules/@img/sharp-libvips-linuxmusl-arm64": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linuxmusl-arm64/-/sharp-libvips-linuxmusl-arm64-1.0.4.tgz",
+      "integrity": "sha512-9Ti+BbTYDcsbp4wfYib8Ctm1ilkugkA/uscUn6UXK1ldpC1JjiXbLfFZtRlBhjPZ5o1NCLiDbg8fhUPKStHoTA==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "LGPL-3.0-or-later",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      }
+    },
+    "node_modules/@img/sharp-libvips-linuxmusl-x64": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linuxmusl-x64/-/sharp-libvips-linuxmusl-x64-1.0.4.tgz",
+      "integrity": "sha512-viYN1KX9m+/hGkJtvYYp+CCLgnJXwiQB39damAO7WMdKWlIhmYTfHjwSbQeUK/20vY154mwezd9HflVFM1wVSw==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "LGPL-3.0-or-later",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      }
+    },
+    "node_modules/@img/sharp-linux-arm": {
+      "version": "0.33.5",
+      "resolved": "https://registry.npmjs.org/@img/sharp-linux-arm/-/sharp-linux-arm-0.33.5.tgz",
+      "integrity": "sha512-JTS1eldqZbJxjvKaAkxhZmBqPRGmxgu+qFKSInv8moZ2AmT5Yib3EQ1c6gp493HvrvV8QgdOXdyaIBrhvFhBMQ==",
+      "cpu": [
+        "arm"
+      ],
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      },
+      "optionalDependencies": {
+        "@img/sharp-libvips-linux-arm": "1.0.5"
+      }
+    },
+    "node_modules/@img/sharp-linux-arm64": {
+      "version": "0.33.5",
+      "resolved": "https://registry.npmjs.org/@img/sharp-linux-arm64/-/sharp-linux-arm64-0.33.5.tgz",
+      "integrity": "sha512-JMVv+AMRyGOHtO1RFBiJy/MBsgz0x4AWrT6QoEVVTyh1E39TrCUpTRI7mx9VksGX4awWASxqCYLCV4wBZHAYxA==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      },
+      "optionalDependencies": {
+        "@img/sharp-libvips-linux-arm64": "1.0.4"
+      }
+    },
+    "node_modules/@img/sharp-linux-s390x": {
+      "version": "0.33.5",
+      "resolved": "https://registry.npmjs.org/@img/sharp-linux-s390x/-/sharp-linux-s390x-0.33.5.tgz",
+      "integrity": "sha512-y/5PCd+mP4CA/sPDKl2961b+C9d+vPAveS33s6Z3zfASk2j5upL6fXVPZi7ztePZ5CuH+1kW8JtvxgbuXHRa4Q==",
+      "cpu": [
+        "s390x"
+      ],
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      },
+      "optionalDependencies": {
+        "@img/sharp-libvips-linux-s390x": "1.0.4"
+      }
+    },
+    "node_modules/@img/sharp-linux-x64": {
+      "version": "0.33.5",
+      "resolved": "https://registry.npmjs.org/@img/sharp-linux-x64/-/sharp-linux-x64-0.33.5.tgz",
+      "integrity": "sha512-opC+Ok5pRNAzuvq1AG0ar+1owsu842/Ab+4qvU879ippJBHvyY5n2mxF1izXqkPYlGuP/M556uh53jRLJmzTWA==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      },
+      "optionalDependencies": {
+        "@img/sharp-libvips-linux-x64": "1.0.4"
+      }
+    },
+    "node_modules/@img/sharp-linuxmusl-arm64": {
+      "version": "0.33.5",
+      "resolved": "https://registry.npmjs.org/@img/sharp-linuxmusl-arm64/-/sharp-linuxmusl-arm64-0.33.5.tgz",
+      "integrity": "sha512-XrHMZwGQGvJg2V/oRSUfSAfjfPxO+4DkiRh6p2AFjLQztWUuY/o8Mq0eMQVIY7HJ1CDQUJlxGGZRw1a5bqmd1g==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      },
+      "optionalDependencies": {
+        "@img/sharp-libvips-linuxmusl-arm64": "1.0.4"
+      }
+    },
+    "node_modules/@img/sharp-linuxmusl-x64": {
+      "version": "0.33.5",
+      "resolved": "https://registry.npmjs.org/@img/sharp-linuxmusl-x64/-/sharp-linuxmusl-x64-0.33.5.tgz",
+      "integrity": "sha512-WT+d/cgqKkkKySYmqoZ8y3pxx7lx9vVejxW/W4DOFMYVSkErR+w7mf2u8m/y4+xHe7yY9DAXQMWQhpnMuFfScw==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      },
+      "optionalDependencies": {
+        "@img/sharp-libvips-linuxmusl-x64": "1.0.4"
+      }
+    },
+    "node_modules/@img/sharp-wasm32": {
+      "version": "0.33.5",
+      "resolved": "https://registry.npmjs.org/@img/sharp-wasm32/-/sharp-wasm32-0.33.5.tgz",
+      "integrity": "sha512-ykUW4LVGaMcU9lu9thv85CbRMAwfeadCJHRsg2GmeRa/cJxsVY9Rbd57JcMxBkKHag5U/x7TSBpScF4U8ElVzg==",
+      "cpu": [
+        "wasm32"
+      ],
+      "license": "Apache-2.0 AND LGPL-3.0-or-later AND MIT",
+      "optional": true,
+      "dependencies": {
+        "@emnapi/runtime": "^1.2.0"
+      },
+      "engines": {
+        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      }
+    },
+    "node_modules/@img/sharp-win32-ia32": {
+      "version": "0.33.5",
+      "resolved": "https://registry.npmjs.org/@img/sharp-win32-ia32/-/sharp-win32-ia32-0.33.5.tgz",
+      "integrity": "sha512-T36PblLaTwuVJ/zw/LaH0PdZkRz5rd3SmMHX8GSmR7vtNSP5Z6bQkExdSK7xGWyxLw4sUknBuugTelgw2faBbQ==",
+      "cpu": [
+        "ia32"
+      ],
+      "license": "Apache-2.0 AND LGPL-3.0-or-later",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      }
+    },
+    "node_modules/@img/sharp-win32-x64": {
+      "version": "0.33.5",
+      "resolved": "https://registry.npmjs.org/@img/sharp-win32-x64/-/sharp-win32-x64-0.33.5.tgz",
+      "integrity": "sha512-MpY/o8/8kj+EcnxwvrP4aTJSWw/aZ7JIGR4aBeZkZw5B7/Jn+tY9/VNwtcoGmdT7GfggGIU4kygOMSbYnOrAbg==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "Apache-2.0 AND LGPL-3.0-or-later",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      }
+    },
+    "node_modules/@isaacs/balanced-match": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/@isaacs/balanced-match/-/balanced-match-4.0.1.tgz",
+      "integrity": "sha512-yzMTt9lEb8Gv7zRioUilSglI0c0smZ9k5D65677DLWLtWJaXIS3CqcGyUFByYKlnUj6TkjLVs54fBl6+TiGQDQ==",
+      "license": "MIT",
+      "engines": {
+        "node": "20 || >=22"
+      }
+    },
+    "node_modules/@isaacs/brace-expansion": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/@isaacs/brace-expansion/-/brace-expansion-5.0.0.tgz",
+      "integrity": "sha512-ZT55BDLV0yv0RBm2czMiZ+SqCGO7AvmOM3G/w2xhVPH+te0aKgFjmBvGlL1dH+ql2tgGO3MVrbb3jCKyvpgnxA==",
+      "license": "MIT",
+      "dependencies": {
+        "@isaacs/balanced-match": "^4.0.1"
+      },
+      "engines": {
+        "node": "20 || >=22"
+      }
+    },
+    "node_modules/@isaacs/cliui": {
+      "version": "8.0.2",
+      "resolved": "https://registry.npmjs.org/@isaacs/cliui/-/cliui-8.0.2.tgz",
+      "integrity": "sha512-O8jcjabXaleOG9DQ0+ARXWZBTfnP4WNAqzuiJK7ll44AmxGKv/J2M4TPjxjY3znBCfvBXFzucm1twdyFybFqEA==",
+      "license": "ISC",
+      "dependencies": {
+        "string-width": "^5.1.2",
+        "string-width-cjs": "npm:string-width@^4.2.0",
+        "strip-ansi": "^7.0.1",
+        "strip-ansi-cjs": "npm:strip-ansi@^6.0.1",
+        "wrap-ansi": "^8.1.0",
+        "wrap-ansi-cjs": "npm:wrap-ansi@^7.0.0"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@jridgewell/gen-mapping": {
+      "version": "0.3.8",
+      "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.8.tgz",
+      "integrity": "sha512-imAbBGkb+ebQyxKgzv5Hu2nmROxoDOXHh80evxdoXNOrvAnVx7zimzc1Oo5h9RlfV4vPXaE2iM5pOFbvOCClWA==",
+      "license": "MIT",
+      "dependencies": {
+        "@jridgewell/set-array": "^1.2.1",
+        "@jridgewell/sourcemap-codec": "^1.4.10",
+        "@jridgewell/trace-mapping": "^0.3.24"
+      },
+      "engines": {
+        "node": ">=6.0.0"
+      }
+    },
+    "node_modules/@jridgewell/resolve-uri": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.2.tgz",
+      "integrity": "sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.0.0"
+      }
+    },
+    "node_modules/@jridgewell/set-array": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/@jridgewell/set-array/-/set-array-1.2.1.tgz",
+      "integrity": "sha512-R8gLRTZeyp03ymzP/6Lil/28tGeGEzhx1q2k703KGWRAI1VdvPIXdG70VJc2pAMw3NA6JKL5hhFu1sJX0Mnn/A==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.0.0"
+      }
+    },
+    "node_modules/@jridgewell/source-map": {
+      "version": "0.3.6",
+      "resolved": "https://registry.npmjs.org/@jridgewell/source-map/-/source-map-0.3.6.tgz",
+      "integrity": "sha512-1ZJTZebgqllO79ue2bm3rIGud/bOe0pP5BjSRCRxxYkEZS8STV7zN84UBbiYu7jy+eCKSnVIUgoWWE/tt+shMQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@jridgewell/gen-mapping": "^0.3.5",
+        "@jridgewell/trace-mapping": "^0.3.25"
+      }
+    },
+    "node_modules/@jridgewell/sourcemap-codec": {
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.0.tgz",
+      "integrity": "sha512-gv3ZRaISU3fjPAgNsriBRqGWQL6quFx04YMPW/zD8XMLsU32mhCCbfbO6KZFLjvYpCZ8zyDEgqsgf+PwPaM7GQ==",
+      "license": "MIT"
+    },
+    "node_modules/@jridgewell/trace-mapping": {
+      "version": "0.3.25",
+      "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.25.tgz",
+      "integrity": "sha512-vNk6aEwybGtawWmy/PzwnGDOjCkLWSD2wqvjGGAgOAwCGWySYXfYoxt00IJkTF+8Lb57DwOb3Aa0o9CApepiYQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@jridgewell/resolve-uri": "^3.1.0",
+        "@jridgewell/sourcemap-codec": "^1.4.14"
+      }
+    },
     "node_modules/@parcel/watcher": {
       "version": "2.5.1",
       "resolved": "https://registry.npmjs.org/@parcel/watcher/-/watcher-2.5.1.tgz",
@@ -527,6 +1044,31 @@
         "url": "https://opencollective.com/parcel"
       }
     },
+    "node_modules/@playwright/test": {
+      "version": "1.53.1",
+      "resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.53.1.tgz",
+      "integrity": "sha512-Z4c23LHV0muZ8hfv4jw6HngPJkbbtZxTkxPNIg7cJcTc9C28N/p2q7g3JZS2SiKBBHJ3uM1dgDye66bB7LEk5w==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "playwright": "1.53.1"
+      },
+      "bin": {
+        "playwright": "cli.js"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@rgrove/parse-xml": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/@rgrove/parse-xml/-/parse-xml-4.2.0.tgz",
+      "integrity": "sha512-UuBOt7BOsKVOkFXRe4Ypd/lADuNIfqJXv8GvHqtXaTYXPPKkj2nS2zPllVsrtRjcomDhIJVBnZwfmlI222WH8g==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
     "node_modules/@sindresorhus/slugify": {
       "version": "2.2.1",
       "resolved": "https://registry.npmjs.org/@sindresorhus/slugify/-/slugify-2.2.1.tgz",
@@ -585,6 +1127,16 @@
       "license": "MIT",
       "peer": true
     },
+    "node_modules/@types/node": {
+      "version": "24.0.7",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-24.0.7.tgz",
+      "integrity": "sha512-YIEUUr4yf8q8oQoXPpSlnvKNVKDQlPMWrmOcgzoduo7kvA2UF0/BwJ/eMKFTiTtkNL17I0M6Xe2tvwFU7be6iw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "undici-types": "~7.8.0"
+      }
+    },
     "node_modules/a-sync-waterfall": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/a-sync-waterfall/-/a-sync-waterfall-1.0.1.tgz",
@@ -593,10 +1145,9 @@
       "license": "MIT"
     },
     "node_modules/acorn": {
-      "version": "8.14.1",
-      "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.14.1.tgz",
-      "integrity": "sha512-OvQ/2pUDKmgfCg++xsTX1wGxfTaszcHVcTctW4UJB4hibJx2HXxxO5UmVgyjMa+ZDsiaf5wWLXYpRWMmBI0QHg==",
-      "dev": true,
+      "version": "8.15.0",
+      "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.15.0.tgz",
+      "integrity": "sha512-NZyJarBfL7nWwIq+FDL6Zp/yHEhePMNnnJ0y3qfieCrmNvYct8uvtiV41UvlSe6apAfk0fY1FbWx+NwfmpvtTg==",
       "license": "MIT",
       "bin": {
         "acorn": "bin/acorn"
@@ -619,13 +1170,15 @@
       }
     },
     "node_modules/ansi-regex": {
-      "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
-      "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
-      "dev": true,
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.1.0.tgz",
+      "integrity": "sha512-7HSX4QQb4CspciLpVFwyRe79O3xsIZDDLER21kERQ71oaPodF8jL725AgJMFAYbooIqolJoRLuM81SpeUkpkvA==",
       "license": "MIT",
       "engines": {
-        "node": ">=8"
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-regex?sponsor=1"
       }
     },
     "node_modules/ansi-styles": {
@@ -884,9 +1437,9 @@
       }
     },
     "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==",
+      "version": "1.1.12",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.12.tgz",
+      "integrity": "sha512-9T9UjW3r0UW5c1Q7GTwllptXwhvYmEzFhzMfZ9H7FQWt+uZePjZPjBP/W1ZEyZ1twGWom5/56TF4lPcqjnDHcg==",
       "license": "MIT",
       "dependencies": {
         "balanced-match": "^1.0.0",
@@ -906,10 +1459,22 @@
         "node": ">=8"
       }
     },
+    "node_modules/brotli-size": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/brotli-size/-/brotli-size-4.0.0.tgz",
+      "integrity": "sha512-uA9fOtlTRC0iqKfzff1W34DXUA3GyVqbUaeo3Rw3d4gd1eavKVCETXrn3NzO74W+UVkG3UHu8WxUi+XvKI/huA==",
+      "license": "MIT",
+      "dependencies": {
+        "duplexer": "0.1.1"
+      },
+      "engines": {
+        "node": ">= 10.16.0"
+      }
+    },
     "node_modules/browserslist": {
-      "version": "4.25.0",
-      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.25.0.tgz",
-      "integrity": "sha512-PJ8gYKeS5e/whHBh8xrwYK+dAvEj7JXtz6uTucnMRB8OiGTsKccFekoRrjajPBHV8oOY+2tI4uxeceSimKwMFA==",
+      "version": "4.25.1",
+      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.25.1.tgz",
+      "integrity": "sha512-KGj0KoOMXLpSNkkEI6Z6mShmQy0bc1I+T7K9N81k4WWMrfz+6fQ6es80B/YLAeRoKvjYE1YSHHOW1qe9xIVzHw==",
       "dev": true,
       "funding": [
         {
@@ -927,8 +1492,8 @@
       ],
       "license": "MIT",
       "dependencies": {
-        "caniuse-lite": "^1.0.30001718",
-        "electron-to-chromium": "^1.5.160",
+        "caniuse-lite": "^1.0.30001726",
+        "electron-to-chromium": "^1.5.173",
         "node-releases": "^2.0.19",
         "update-browserslist-db": "^1.1.3"
       },
@@ -939,6 +1504,12 @@
         "node": "^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7"
       }
     },
+    "node_modules/buffer-from": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/buffer-from/-/buffer-from-1.1.2.tgz",
+      "integrity": "sha512-E+XQCRwSbaaiChtv6k6Dwgc+bx+Bs6vuKJHHl5kox/BaKbhiXzqQOwK4cO22yElGp2OCmjwVhT3HmxgyPGnJfQ==",
+      "license": "MIT"
+    },
     "node_modules/call-bind": {
       "version": "1.0.8",
       "resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.8.tgz",
@@ -987,9 +1558,9 @@
       }
     },
     "node_modules/caniuse-lite": {
-      "version": "1.0.30001721",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001721.tgz",
-      "integrity": "sha512-cOuvmUVtKrtEaoKiO0rSc29jcjwMwX5tOHDy4MgVFEWiUXj4uBMJkwI8MDySkgXidpMiHUcviogAvFi4pA2hDQ==",
+      "version": "1.0.30001726",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001726.tgz",
+      "integrity": "sha512-VQAUIUzBiZ/UnlM28fSp2CRF3ivUn1BWEvxMcVTNwpw91Py1pGbPIyIKtd+tzct9C3ouceCVdGAXxZOpZAsgdw==",
       "dev": true,
       "funding": [
         {
@@ -1008,26 +1579,15 @@
       "license": "CC-BY-4.0"
     },
     "node_modules/chalk": {
-      "version": "2.4.2",
-      "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
-      "integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==",
-      "license": "MIT",
-      "dependencies": {
-        "ansi-styles": "^3.2.1",
-        "escape-string-regexp": "^1.0.5",
-        "supports-color": "^5.3.0"
-      },
-      "engines": {
-        "node": ">=4"
-      }
-    },
-    "node_modules/chalk/node_modules/escape-string-regexp": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
-      "integrity": "sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==",
+      "version": "5.4.1",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-5.4.1.tgz",
+      "integrity": "sha512-zgVZuo2WcZgfUEmsn6eO3kINexW8RAE4maiQ8QNs8CtpPCSyMiYsULR3HQYkm3w8FIA3SberyMJMSldGsW+U3w==",
       "license": "MIT",
       "engines": {
-        "node": ">=0.8.0"
+        "node": "^12.17.0 || ^14.13 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/chalk?sponsor=1"
       }
     },
     "node_modules/chokidar": {
@@ -1070,6 +1630,118 @@
         "node": ">=12"
       }
     },
+    "node_modules/cliui/node_modules/ansi-regex": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
+      "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/cliui/node_modules/ansi-styles": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
+      "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "color-convert": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
+    "node_modules/cliui/node_modules/color-convert": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
+      "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "color-name": "~1.1.4"
+      },
+      "engines": {
+        "node": ">=7.0.0"
+      }
+    },
+    "node_modules/cliui/node_modules/color-name": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
+      "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/cliui/node_modules/emoji-regex": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
+      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/cliui/node_modules/string-width": {
+      "version": "4.2.3",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
+      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "emoji-regex": "^8.0.0",
+        "is-fullwidth-code-point": "^3.0.0",
+        "strip-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/cliui/node_modules/strip-ansi": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
+      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-regex": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/cliui/node_modules/wrap-ansi": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
+      "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^4.0.0",
+        "string-width": "^4.1.0",
+        "strip-ansi": "^6.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
+      }
+    },
+    "node_modules/color": {
+      "version": "4.2.3",
+      "resolved": "https://registry.npmjs.org/color/-/color-4.2.3.tgz",
+      "integrity": "sha512-1rXeuUUiGGrykh+CeBdu5Ie7OJwinCgQY0bc7GCRxy5xVHy+moaqkpL/jqQq0MtQOeYcrqEz4abc5f0KtU7W4A==",
+      "license": "MIT",
+      "dependencies": {
+        "color-convert": "^2.0.1",
+        "color-string": "^1.9.0"
+      },
+      "engines": {
+        "node": ">=12.5.0"
+      }
+    },
     "node_modules/color-convert": {
       "version": "1.9.3",
       "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
@@ -1085,6 +1757,34 @@
       "integrity": "sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw==",
       "license": "MIT"
     },
+    "node_modules/color-string": {
+      "version": "1.9.1",
+      "resolved": "https://registry.npmjs.org/color-string/-/color-string-1.9.1.tgz",
+      "integrity": "sha512-shrVawQFojnZv6xM40anx4CkoDP+fZsw/ZerEMsW/pyzsRbElpsL/DBVW7q3ExxwusdNXI3lXpuhEZkzs8p5Eg==",
+      "license": "MIT",
+      "dependencies": {
+        "color-name": "^1.0.0",
+        "simple-swizzle": "^0.2.2"
+      }
+    },
+    "node_modules/color/node_modules/color-convert": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
+      "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+      "license": "MIT",
+      "dependencies": {
+        "color-name": "~1.1.4"
+      },
+      "engines": {
+        "node": ">=7.0.0"
+      }
+    },
+    "node_modules/color/node_modules/color-name": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
+      "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
+      "license": "MIT"
+    },
     "node_modules/commander": {
       "version": "10.0.1",
       "resolved": "https://registry.npmjs.org/commander/-/commander-10.0.1.tgz",
@@ -1102,28 +1802,17 @@
       "license": "MIT"
     },
     "node_modules/cross-spawn": {
-      "version": "6.0.6",
-      "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-6.0.6.tgz",
-      "integrity": "sha512-VqCUuhcd1iB+dsv8gxPttb5iZh/D0iubSP21g36KXdEuf6I5JiioesUVjpCdHV9MZRUfVFlvwtIUyPfxo5trtw==",
+      "version": "7.0.6",
+      "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.6.tgz",
+      "integrity": "sha512-uV2QOWP2nWzsy2aMp8aRibhi9dlzF5Hgh5SHaB9OiTGEyDTiJJyx0uy51QXdyWbtAHNua4XJzUKca3OzKUd3vA==",
       "license": "MIT",
       "dependencies": {
-        "nice-try": "^1.0.4",
-        "path-key": "^2.0.1",
-        "semver": "^5.5.0",
-        "shebang-command": "^1.2.0",
-        "which": "^1.2.9"
+        "path-key": "^3.1.0",
+        "shebang-command": "^2.0.0",
+        "which": "^2.0.1"
       },
       "engines": {
-        "node": ">=4.8"
-      }
-    },
-    "node_modules/cross-spawn/node_modules/semver": {
-      "version": "5.7.2",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.2.tgz",
-      "integrity": "sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==",
-      "license": "ISC",
-      "bin": {
-        "semver": "bin/semver"
+        "node": ">= 8"
       }
     },
     "node_modules/cssesc": {
@@ -1194,7 +1883,6 @@
       "version": "4.4.1",
       "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.1.tgz",
       "integrity": "sha512-KcKCqiftBJcZr++7ykoDIEwSa3XWowTfNPo92BYxjXiyYEVrUQh2aLyhxBCwww+heortUFxEJYcRzosstTEBYQ==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "ms": "^2.1.3"
@@ -1345,9 +2033,9 @@
       }
     },
     "node_modules/dotenv": {
-      "version": "16.5.0",
-      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-16.5.0.tgz",
-      "integrity": "sha512-m/C+AwOAr9/W1UOIZUo232ejMNnJAJtYQjUbHoNTBNTJSvqzzDh7vnrei3o3r3m9blf6ZoDkvcw0VmozNRFJxg==",
+      "version": "16.6.0",
+      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-16.6.0.tgz",
+      "integrity": "sha512-Omf1L8paOy2VJhILjyhrhqwLIdstqm1BvcDPKg4NGAlkwEu9ODyrFbvk8UymUOMCT+HXo31jg1lArIrVAAhuGA==",
       "license": "BSD-2-Clause",
       "engines": {
         "node": ">=12"
@@ -1370,6 +2058,17 @@
         "node": ">= 0.4"
       }
     },
+    "node_modules/duplexer": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.1.tgz",
+      "integrity": "sha512-sxNZ+ljy+RA1maXoUReeqBBpBC6RLKmg5ewzV+x+mSETmWNoKdZN6vcQjpFROemza23hGFskJtFNoUWUaQ+R4Q=="
+    },
+    "node_modules/eastasianwidth": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/eastasianwidth/-/eastasianwidth-0.2.0.tgz",
+      "integrity": "sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==",
+      "license": "MIT"
+    },
     "node_modules/ee-first": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
@@ -1378,17 +2077,16 @@
       "license": "MIT"
     },
     "node_modules/electron-to-chromium": {
-      "version": "1.5.165",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.165.tgz",
-      "integrity": "sha512-naiMx1Z6Nb2TxPU6fiFrUrDTjyPMLdTtaOd2oLmG8zVSg2hCWGkhPyxwk+qRmZ1ytwVqUv0u7ZcDA5+ALhaUtw==",
+      "version": "1.5.176",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.176.tgz",
+      "integrity": "sha512-2nDK9orkm7M9ZZkjO3PjbEd3VUulQLyg5T9O3enJdFvUg46Hzd4DUvTvAuEgbdHYXyFsiG4A5sO9IzToMH1cDg==",
       "dev": true,
       "license": "ISC"
     },
     "node_modules/emoji-regex": {
-      "version": "8.0.0",
-      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
-      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
-      "dev": true,
+      "version": "9.2.2",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-9.2.2.tgz",
+      "integrity": "sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==",
       "license": "MIT"
     },
     "node_modules/encodeurl": {
@@ -1402,10 +2100,9 @@
       }
     },
     "node_modules/entities": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/entities/-/entities-6.0.0.tgz",
-      "integrity": "sha512-aKstq2TDOndCn4diEyp9Uq/Flu2i1GlLkc6XIDQSDMuaFE3OPW5OphLCyQ5SpSJZTb4reN+kTcYru5yIfXoRPw==",
-      "dev": true,
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/entities/-/entities-6.0.1.tgz",
+      "integrity": "sha512-aN97NXWF6AWBTahfVOIrB/NShkzi5H7F9r1s9mD3cDj4Ko5f2qhhVoYMibXF7GlLveb/D2ioWay8lxI97Ven3g==",
       "license": "BSD-2-Clause",
       "engines": {
         "node": ">=0.12"
@@ -1640,6 +2337,12 @@
         "node": ">= 8"
       }
     },
+    "node_modules/eventemitter3": {
+      "version": "4.0.7",
+      "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-4.0.7.tgz",
+      "integrity": "sha512-8guHBZCwKnFhYdHr2ysuRWErTwhoN2X8XELRlrRwpmfeY2jjuUN4taQMsULKUVo1K4DvZl+0pgfyoysHxvmvEw==",
+      "license": "MIT"
+    },
     "node_modules/extend-shallow": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz",
@@ -1654,9 +2357,9 @@
       }
     },
     "node_modules/fdir": {
-      "version": "6.4.5",
-      "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.4.5.tgz",
-      "integrity": "sha512-4BG7puHpVsIYxZUbiUE3RqGloLaSSwzYie5jvasC4LWuBWzZawynvYouhjbQKw2JuIGYdm0DzIxl8iVidKlUEw==",
+      "version": "6.4.6",
+      "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.4.6.tgz",
+      "integrity": "sha512-hiFoqpyZcfNm1yc4u8oWCf9A2c4D3QjCrks3zmoVKVxpQRzmPNar1hUJcBG2RQHvEVGDN+Jm81ZheVLAQMK6+w==",
       "dev": true,
       "license": "MIT",
       "peerDependencies": {
@@ -1727,6 +2430,12 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/flatted": {
+      "version": "3.3.3",
+      "resolved": "https://registry.npmjs.org/flatted/-/flatted-3.3.3.tgz",
+      "integrity": "sha512-GX+ysw4PBCz0PzosHDepZGANEuFCMLrnRTiEy9McGjmkCQYwRq4A/X786G/fjM/+OjsWSU1ZrY5qyARZmO/uwg==",
+      "license": "ISC"
+    },
     "node_modules/for-each": {
       "version": "0.3.5",
       "resolved": "https://registry.npmjs.org/for-each/-/for-each-0.3.5.tgz",
@@ -1742,6 +2451,22 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/foreground-child": {
+      "version": "3.3.1",
+      "resolved": "https://registry.npmjs.org/foreground-child/-/foreground-child-3.3.1.tgz",
+      "integrity": "sha512-gIXjKqtFuWEgzFRJA9WCQeSJLZDjgJUOMCMzxtvFq/37KojM1BFGufqsCy0r4qSQmYLsZYMeyRqzIWOMup03sw==",
+      "license": "ISC",
+      "dependencies": {
+        "cross-spawn": "^7.0.6",
+        "signal-exit": "^4.0.1"
+      },
+      "engines": {
+        "node": ">=14"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
     "node_modules/fraction.js": {
       "version": "4.3.7",
       "resolved": "https://registry.npmjs.org/fraction.js/-/fraction.js-4.3.7.tgz",
@@ -1898,6 +2623,29 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/glob": {
+      "version": "11.0.3",
+      "resolved": "https://registry.npmjs.org/glob/-/glob-11.0.3.tgz",
+      "integrity": "sha512-2Nim7dha1KVkaiF4q6Dj+ngPPMdfvLJEOpZk/jKiUAkqKebpGAWQXAq9z1xu9HKu5lWfqw/FASuccEjyznjPaA==",
+      "license": "ISC",
+      "dependencies": {
+        "foreground-child": "^3.3.1",
+        "jackspeak": "^4.1.1",
+        "minimatch": "^10.0.3",
+        "minipass": "^7.1.2",
+        "package-json-from-dist": "^1.0.0",
+        "path-scurry": "^2.0.0"
+      },
+      "bin": {
+        "glob": "dist/esm/bin.mjs"
+      },
+      "engines": {
+        "node": "20 || >=22"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
     "node_modules/glob-parent": {
       "version": "5.1.2",
       "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
@@ -2081,6 +2829,12 @@
         "node": ">=12.0.0"
       }
     },
+    "node_modules/highlightjs-code-diff": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/highlightjs-code-diff/-/highlightjs-code-diff-1.0.0.tgz",
+      "integrity": "sha512-45hH1HHPNmnnUyG1IaiUdfe2Bz7cKDOD/WuwvVBd34jYi1/xh2eHlbumvhL+ky6d0HSGGCBP7COYB/+351rXrg==",
+      "license": "Unlicense"
+    },
     "node_modules/hosted-git-info": {
       "version": "2.8.9",
       "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.8.9.tgz",
@@ -2147,11 +2901,31 @@
         "node": ">= 0.8"
       }
     },
+    "node_modules/image-size": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/image-size/-/image-size-1.2.1.tgz",
+      "integrity": "sha512-rH+46sQJ2dlwfjfhCyNx5thzrv+dtmBIhPHk0zgRUukHzZ/kRueTJXoYYsclBaKcSMBWuGbOFXtioLpzTb5euw==",
+      "license": "MIT",
+      "dependencies": {
+        "queue": "6.0.2"
+      },
+      "bin": {
+        "image-size": "bin/image-size.js"
+      },
+      "engines": {
+        "node": ">=16.x"
+      }
+    },
+    "node_modules/immutable": {
+      "version": "5.1.3",
+      "resolved": "https://registry.npmjs.org/immutable/-/immutable-5.1.3.tgz",
+      "integrity": "sha512-+chQdDfvscSF1SJqv2gn4SRO2ZyS3xL3r7IW/wWEEzrzLisnOlKiQu5ytC/BVNcS15C39WT2Hg/bjKjDMcu+zg==",
+      "license": "MIT"
+    },
     "node_modules/inherits": {
       "version": "2.0.4",
       "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz",
       "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==",
-      "dev": true,
       "license": "ISC"
     },
     "node_modules/internal-slot": {
@@ -2390,7 +3164,6 @@
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
       "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
-      "dev": true,
       "license": "MIT",
       "engines": {
         "node": ">=8"
@@ -2620,6 +3393,12 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/isarray": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/isarray/-/isarray-2.0.5.tgz",
+      "integrity": "sha512-xHjhDr3cNBK0BzdUJSPXZntQUx/mwMS5Rw4A7lPJ90XGAO6ISP/ePDNuo0vhqOZU+UD5JoodwCAAoZQd3FeAKw==",
+      "license": "MIT"
+    },
     "node_modules/isexe": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
@@ -2636,6 +3415,21 @@
         "node": ">=6.0"
       }
     },
+    "node_modules/jackspeak": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/jackspeak/-/jackspeak-4.1.1.tgz",
+      "integrity": "sha512-zptv57P3GpL+O0I7VdMJNBZCu+BPHVQUk55Ft8/QCJjTVxrnJHuVuX/0Bl2A6/+2oyR/ZMEuFKwmzqqZ/U5nPQ==",
+      "license": "BlueOak-1.0.0",
+      "dependencies": {
+        "@isaacs/cliui": "^8.0.2"
+      },
+      "engines": {
+        "node": "20 || >=22"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
     "node_modules/js-yaml": {
       "version": "4.1.0",
       "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.1.0.tgz",
@@ -2763,19 +3557,24 @@
         "node": ">=4"
       }
     },
-    "node_modules/load-json-file/node_modules/parse-json": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-4.0.0.tgz",
-      "integrity": "sha512-aOIos8bujGN93/8Ox/jPLh7RwVnPEysynVFE+fQZyg6jKELEHwzgKdLRFHUgXJL6kylijVSBC4BvN9OmsB48Rw==",
+    "node_modules/load-json-file/node_modules/pify": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/pify/-/pify-3.0.0.tgz",
+      "integrity": "sha512-C3FsVNH1udSEX48gGX1xfvwTWfsYWj5U+8/uK15BGzIGrKoUpghX8hWZwa/OFnakBiiVNmBvemTJR5mcy7iPcg==",
       "license": "MIT",
-      "dependencies": {
-        "error-ex": "^1.3.1",
-        "json-parse-better-errors": "^1.0.1"
-      },
       "engines": {
         "node": ">=4"
       }
     },
+    "node_modules/lru-cache": {
+      "version": "11.1.0",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-11.1.0.tgz",
+      "integrity": "sha512-QIXZUBJUx+2zHUdQujWejBkcD9+cs94tLn0+YL8UrCh+D5sCXZ4c7LaEH48pNwRY3MLDgqUFyhlCyjJPf1WP0A==",
+      "license": "ISC",
+      "engines": {
+        "node": "20 || >=22"
+      }
+    },
     "node_modules/luxon": {
       "version": "3.6.1",
       "resolved": "https://registry.npmjs.org/luxon/-/luxon-3.6.1.tgz",
@@ -2874,13 +3673,26 @@
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "array-differ": "^1.0.0",
-        "array-union": "^1.0.1",
-        "arrify": "^1.0.0",
-        "minimatch": "^3.0.0"
+        "array-differ": "^1.0.0",
+        "array-union": "^1.0.1",
+        "arrify": "^1.0.0",
+        "minimatch": "^3.0.0"
+      },
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/maximatch/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,
+      "license": "ISC",
+      "dependencies": {
+        "brace-expansion": "^1.1.7"
       },
       "engines": {
-        "node": ">=0.10.0"
+        "node": "*"
       }
     },
     "node_modules/mdurl": {
@@ -2961,15 +3773,18 @@
       }
     },
     "node_modules/minimatch": {
-      "version": "3.1.2",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz",
-      "integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==",
+      "version": "10.0.3",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-10.0.3.tgz",
+      "integrity": "sha512-IPZ167aShDZZUMdRk66cyQAW3qr0WzbHkPdMYa8bzZhlHhO3jALbKdxcaak7W9FfT2rZNpQuUu4Od7ILEpXSaw==",
       "license": "ISC",
       "dependencies": {
-        "brace-expansion": "^1.1.7"
+        "@isaacs/brace-expansion": "^5.0.0"
       },
       "engines": {
-        "node": "*"
+        "node": "20 || >=22"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
       }
     },
     "node_modules/minimist": {
@@ -2986,7 +3801,6 @@
       "version": "7.1.2",
       "resolved": "https://registry.npmjs.org/minipass/-/minipass-7.1.2.tgz",
       "integrity": "sha512-qOOzS1cBTWYF4BH8fVePDBOO9iptMnGUEZwNc/cMWnTV2nVLZ7VoNWEPHkYczZA0pdoA7dl6e7FL659nX9S2aw==",
-      "dev": true,
       "license": "ISC",
       "engines": {
         "node": ">=16 || 14 >=14.17"
@@ -3010,7 +3824,6 @@
       "version": "2.1.3",
       "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz",
       "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/nanoid": {
@@ -3130,6 +3943,108 @@
         "node": ">= 4"
       }
     },
+    "node_modules/npm-run-all/node_modules/chalk": {
+      "version": "2.4.2",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
+      "integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==",
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^3.2.1",
+        "escape-string-regexp": "^1.0.5",
+        "supports-color": "^5.3.0"
+      },
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/npm-run-all/node_modules/cross-spawn": {
+      "version": "6.0.6",
+      "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-6.0.6.tgz",
+      "integrity": "sha512-VqCUuhcd1iB+dsv8gxPttb5iZh/D0iubSP21g36KXdEuf6I5JiioesUVjpCdHV9MZRUfVFlvwtIUyPfxo5trtw==",
+      "license": "MIT",
+      "dependencies": {
+        "nice-try": "^1.0.4",
+        "path-key": "^2.0.1",
+        "semver": "^5.5.0",
+        "shebang-command": "^1.2.0",
+        "which": "^1.2.9"
+      },
+      "engines": {
+        "node": ">=4.8"
+      }
+    },
+    "node_modules/npm-run-all/node_modules/escape-string-regexp": {
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
+      "integrity": "sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.8.0"
+      }
+    },
+    "node_modules/npm-run-all/node_modules/minimatch": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz",
+      "integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==",
+      "license": "ISC",
+      "dependencies": {
+        "brace-expansion": "^1.1.7"
+      },
+      "engines": {
+        "node": "*"
+      }
+    },
+    "node_modules/npm-run-all/node_modules/path-key": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/path-key/-/path-key-2.0.1.tgz",
+      "integrity": "sha512-fEHGKCSmUSDPv4uoj8AlD+joPlq3peND+HRYyxFz4KPw4z926S/b8rIuFs2FYJg3BwsxJf6A9/3eIdLaYC+9Dw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/npm-run-all/node_modules/semver": {
+      "version": "5.7.2",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.2.tgz",
+      "integrity": "sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==",
+      "license": "ISC",
+      "bin": {
+        "semver": "bin/semver"
+      }
+    },
+    "node_modules/npm-run-all/node_modules/shebang-command": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-1.2.0.tgz",
+      "integrity": "sha512-EV3L1+UQWGor21OmnvojK36mhg+TyIKDh3iFBKBohr5xeXIhNBcx8oWdgkTEEQ+BEFFYdLRuqMfd5L84N1V5Vg==",
+      "license": "MIT",
+      "dependencies": {
+        "shebang-regex": "^1.0.0"
+      },
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/npm-run-all/node_modules/shebang-regex": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/shebang-regex/-/shebang-regex-1.0.0.tgz",
+      "integrity": "sha512-wpoSFAxys6b2a2wHZ1XpDSgD7N9iVjg29Ph9uV/uaP9Ex/KXlkTZTeddxDPSYQpgvzKLGJke2UU0AzoGCjNIvQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/npm-run-all/node_modules/which": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/which/-/which-1.3.1.tgz",
+      "integrity": "sha512-HxJdYWq1MTIQbJ3nw0cqssHoTNU267KlrDuGZ1WYlxDStUtKUhOaJmh112/TZmHxxUfuJqPXSOm7tDyas0OSIQ==",
+      "license": "ISC",
+      "dependencies": {
+        "isexe": "^2.0.0"
+      },
+      "bin": {
+        "which": "bin/which"
+      }
+    },
     "node_modules/nunjucks": {
       "version": "3.2.4",
       "resolved": "https://registry.npmjs.org/nunjucks/-/nunjucks-3.2.4.tgz",
@@ -3237,6 +4152,62 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/p-finally": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/p-finally/-/p-finally-1.0.0.tgz",
+      "integrity": "sha512-LICb2p9CB7FS+0eR1oqWnHhp0FljGLZCWBE9aix0Uye9W8LTQPwMTYVGWQWIw9RdQiDg4+epXQODwIYJtSJaow==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/p-queue": {
+      "version": "6.6.2",
+      "resolved": "https://registry.npmjs.org/p-queue/-/p-queue-6.6.2.tgz",
+      "integrity": "sha512-RwFpb72c/BhQLEXIZ5K2e+AhgNVmIejGlTgiB9MzZ0e93GRvqZ7uSi0dvRF7/XIXDeNkra2fNHBxTyPDGySpjQ==",
+      "license": "MIT",
+      "dependencies": {
+        "eventemitter3": "^4.0.4",
+        "p-timeout": "^3.2.0"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/p-timeout": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/p-timeout/-/p-timeout-3.2.0.tgz",
+      "integrity": "sha512-rhIwUycgwwKcP9yTOOFK/AKsAopjjCakVqLHePO3CC6Mir1Z99xT+R63jZxAT5lFZLa2inS5h+ZS2GvR99/FBg==",
+      "license": "MIT",
+      "dependencies": {
+        "p-finally": "^1.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/package-json-from-dist": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/package-json-from-dist/-/package-json-from-dist-1.0.1.tgz",
+      "integrity": "sha512-UEZIS3/by4OC8vL3P2dTXRETpebLI2NiI5vIrjaD/5UtrkFX/tNbwjTSRAGC/+7CAo2pIcBaRgWmcBBHcsaCIw==",
+      "license": "BlueOak-1.0.0"
+    },
+    "node_modules/parse-json": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-4.0.0.tgz",
+      "integrity": "sha512-aOIos8bujGN93/8Ox/jPLh7RwVnPEysynVFE+fQZyg6jKELEHwzgKdLRFHUgXJL6kylijVSBC4BvN9OmsB48Rw==",
+      "license": "MIT",
+      "dependencies": {
+        "error-ex": "^1.3.1",
+        "json-parse-better-errors": "^1.0.1"
+      },
+      "engines": {
+        "node": ">=4"
+      }
+    },
     "node_modules/parse-srcset": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/parse-srcset/-/parse-srcset-1.0.2.tgz",
@@ -3255,12 +4226,12 @@
       }
     },
     "node_modules/path-key": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/path-key/-/path-key-2.0.1.tgz",
-      "integrity": "sha512-fEHGKCSmUSDPv4uoj8AlD+joPlq3peND+HRYyxFz4KPw4z926S/b8rIuFs2FYJg3BwsxJf6A9/3eIdLaYC+9Dw==",
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/path-key/-/path-key-3.1.1.tgz",
+      "integrity": "sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==",
       "license": "MIT",
       "engines": {
-        "node": ">=4"
+        "node": ">=8"
       }
     },
     "node_modules/path-parse": {
@@ -3269,6 +4240,43 @@
       "integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==",
       "license": "MIT"
     },
+    "node_modules/path-scurry": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/path-scurry/-/path-scurry-2.0.0.tgz",
+      "integrity": "sha512-ypGJsmGtdXUOeM5u93TyeIEfEhM6s+ljAhrk5vAvSx8uyY/02OvrZnA0YNGUrPXfpJMgI1ODd3nwz8Npx4O4cg==",
+      "license": "BlueOak-1.0.0",
+      "dependencies": {
+        "lru-cache": "^11.0.0",
+        "minipass": "^7.1.2"
+      },
+      "engines": {
+        "node": "20 || >=22"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
+    "node_modules/path-type": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/path-type/-/path-type-3.0.0.tgz",
+      "integrity": "sha512-T2ZUsdZFHgA3u4e5PfPbjd7HDDpxPnQb5jN0SrDsjNSuVXHJqtwTnWqG0B1jZrgmJ/7lj1EmVIByWt1gxGkWvg==",
+      "license": "MIT",
+      "dependencies": {
+        "pify": "^3.0.0"
+      },
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/path-type/node_modules/pify": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/pify/-/pify-3.0.0.tgz",
+      "integrity": "sha512-C3FsVNH1udSEX48gGX1xfvwTWfsYWj5U+8/uK15BGzIGrKoUpghX8hWZwa/OFnakBiiVNmBvemTJR5mcy7iPcg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=4"
+      }
+    },
     "node_modules/picocolors": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.1.1.tgz",
@@ -3302,12 +4310,60 @@
       }
     },
     "node_modules/pify": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/pify/-/pify-3.0.0.tgz",
-      "integrity": "sha512-C3FsVNH1udSEX48gGX1xfvwTWfsYWj5U+8/uK15BGzIGrKoUpghX8hWZwa/OFnakBiiVNmBvemTJR5mcy7iPcg==",
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
+      "integrity": "sha512-udgsAY+fTnvv7kI7aaxbqwWNb0AHiB0qBO89PZKPkoTmGOgdbrHDKD+0B2X4uTfJ/FT1R09r9gTsjUjNJotuog==",
+      "dev": true,
       "license": "MIT",
       "engines": {
-        "node": ">=4"
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/playwright": {
+      "version": "1.53.1",
+      "resolved": "https://registry.npmjs.org/playwright/-/playwright-1.53.1.tgz",
+      "integrity": "sha512-LJ13YLr/ocweuwxyGf1XNFWIU4M2zUSo149Qbp+A4cpwDjsxRPj7k6H25LBrEHiEwxvRbD8HdwvQmRMSvquhYw==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "playwright-core": "1.53.1"
+      },
+      "bin": {
+        "playwright": "cli.js"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "optionalDependencies": {
+        "fsevents": "2.3.2"
+      }
+    },
+    "node_modules/playwright-core": {
+      "version": "1.53.1",
+      "resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.53.1.tgz",
+      "integrity": "sha512-Z46Oq7tLAyT0lGoFx4DOuB1IA9D1TPj0QkYxpPVUnGDqHHvDpCftu1J2hM2PiWsNMoZh8+LQaarAWcDfPBc6zg==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "bin": {
+        "playwright-core": "cli.js"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/playwright/node_modules/fsevents": {
+      "version": "2.3.2",
+      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
+      "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
+      "dev": true,
+      "hasInstallScript": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
       }
     },
     "node_modules/please-upgrade-node": {
@@ -3330,9 +4386,9 @@
       }
     },
     "node_modules/postcss": {
-      "version": "8.5.4",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.4.tgz",
-      "integrity": "sha512-QSa9EBe+uwlGTFmHsPKokv3B/oEMQZxfqW0QqNCyhpa6mB1afzulwn8hihglqAb2pOw+BJgNlmXQ8la2VeHB7w==",
+      "version": "8.5.6",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.6.tgz",
+      "integrity": "sha512-3Ybi1tAuwAP9s0r1UQ2J4n5Y0G05bJkpUIO0/bI9MhwmD70S5aTWbXGBwxHrelT+XM1k6dM0pk+SwNkpTRN7Pg==",
       "dev": true,
       "funding": [
         {
@@ -3401,9 +4457,9 @@
       }
     },
     "node_modules/postcss-import": {
-      "version": "16.1.0",
-      "resolved": "https://registry.npmjs.org/postcss-import/-/postcss-import-16.1.0.tgz",
-      "integrity": "sha512-7hsAZ4xGXl4MW+OKEWCnF6T5jqBw80/EE9aXg1r2yyn1RsVEU8EtKXbijEODa+rg7iih4bKf7vlvTGYR4CnPNg==",
+      "version": "16.1.1",
+      "resolved": "https://registry.npmjs.org/postcss-import/-/postcss-import-16.1.1.tgz",
+      "integrity": "sha512-2xVS1NCZAfjtVdvXiyegxzJ447GyqCeEI5V7ApgQVOWnros1p5lGNovJNapwPpMombyFBfqDwt7AD3n2l0KOfQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3585,6 +4641,22 @@
         "node": ">=12"
       }
     },
+    "node_modules/prettier": {
+      "version": "3.6.2",
+      "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.6.2.tgz",
+      "integrity": "sha512-I7AIg5boAr5R0FFtJ6rCfD+LFsWHp81dolrFD8S79U9tb8Az2nGrJncnMSnys+bpQJfRUzqs9hnA81OAA3hCuQ==",
+      "dev": true,
+      "license": "MIT",
+      "bin": {
+        "prettier": "bin/prettier.cjs"
+      },
+      "engines": {
+        "node": ">=14"
+      },
+      "funding": {
+        "url": "https://github.com/prettier/prettier?sponsor=1"
+      }
+    },
     "node_modules/pretty-hrtime": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/pretty-hrtime/-/pretty-hrtime-1.0.3.tgz",
@@ -3611,6 +4683,15 @@
         "node": ">=6"
       }
     },
+    "node_modules/queue": {
+      "version": "6.0.2",
+      "resolved": "https://registry.npmjs.org/queue/-/queue-6.0.2.tgz",
+      "integrity": "sha512-iHZWu+q3IdFZFX36ro/lKBkSvfkztY5Y7HMiPlOUjhupPcG2JMfst2KKEpu5XndviX/3UhFbRngUPNKtgvtZiA==",
+      "license": "MIT",
+      "dependencies": {
+        "inherits": "~2.0.3"
+      }
+    },
     "node_modules/range-parser": {
       "version": "1.2.1",
       "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.2.1.tgz",
@@ -3631,37 +4712,15 @@
         "pify": "^2.3.0"
       }
     },
-    "node_modules/read-cache/node_modules/pify": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
-      "integrity": "sha512-udgsAY+fTnvv7kI7aaxbqwWNb0AHiB0qBO89PZKPkoTmGOgdbrHDKD+0B2X4uTfJ/FT1R09r9gTsjUjNJotuog==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=0.10.0"
-      }
-    },
     "node_modules/read-pkg": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-3.0.0.tgz",
       "integrity": "sha512-BLq/cCO9two+lBgiTYNqD6GdtK8s4NpaWrl6/rCO9w0TUS8oJl7cmToOZfRYllKTISY6nt1U7jQ53brmKqY6BA==",
       "license": "MIT",
       "dependencies": {
-        "load-json-file": "^4.0.0",
-        "normalize-package-data": "^2.3.2",
-        "path-type": "^3.0.0"
-      },
-      "engines": {
-        "node": ">=4"
-      }
-    },
-    "node_modules/read-pkg/node_modules/path-type": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/path-type/-/path-type-3.0.0.tgz",
-      "integrity": "sha512-T2ZUsdZFHgA3u4e5PfPbjd7HDDpxPnQb5jN0SrDsjNSuVXHJqtwTnWqG0B1jZrgmJ/7lj1EmVIByWt1gxGkWvg==",
-      "license": "MIT",
-      "dependencies": {
-        "pify": "^3.0.0"
+        "load-json-file": "^4.0.0",
+        "normalize-package-data": "^2.3.2",
+        "path-type": "^3.0.0"
       },
       "engines": {
         "node": ">=4"
@@ -3784,12 +4843,6 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/safe-array-concat/node_modules/isarray": {
-      "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/isarray/-/isarray-2.0.5.tgz",
-      "integrity": "sha512-xHjhDr3cNBK0BzdUJSPXZntQUx/mwMS5Rw4A7lPJ90XGAO6ISP/ePDNuo0vhqOZU+UD5JoodwCAAoZQd3FeAKw==",
-      "license": "MIT"
-    },
     "node_modules/safe-push-apply": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/safe-push-apply/-/safe-push-apply-1.0.0.tgz",
@@ -3806,12 +4859,6 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/safe-push-apply/node_modules/isarray": {
-      "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/isarray/-/isarray-2.0.5.tgz",
-      "integrity": "sha512-xHjhDr3cNBK0BzdUJSPXZntQUx/mwMS5Rw4A7lPJ90XGAO6ISP/ePDNuo0vhqOZU+UD5JoodwCAAoZQd3FeAKw==",
-      "license": "MIT"
-    },
     "node_modules/safe-regex-test": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/safe-regex-test/-/safe-regex-test-1.1.0.tgz",
@@ -3830,9 +4877,9 @@
       }
     },
     "node_modules/sass": {
-      "version": "1.89.1",
-      "resolved": "https://registry.npmjs.org/sass/-/sass-1.89.1.tgz",
-      "integrity": "sha512-eMLLkl+qz7tx/0cJ9wI+w09GQ2zodTkcE/aVfywwdlRcI3EO19xGnbmJwg/JMIm+5MxVJ6outddLZ4Von4E++Q==",
+      "version": "1.89.2",
+      "resolved": "https://registry.npmjs.org/sass/-/sass-1.89.2.tgz",
+      "integrity": "sha512-xCmtksBKd/jdJ9Bt9p7nPKiuqrlBMBuuGkQlkhZjjQk3Ty48lv93k5Dq6OPkKt4XwxDJ7tvlfrTa1MPA9bf+QA==",
       "license": "MIT",
       "dependencies": {
         "chokidar": "^4.0.0",
@@ -3864,12 +4911,6 @@
         "url": "https://paulmillr.com/funding/"
       }
     },
-    "node_modules/sass/node_modules/immutable": {
-      "version": "5.1.2",
-      "resolved": "https://registry.npmjs.org/immutable/-/immutable-5.1.2.tgz",
-      "integrity": "sha512-qHKXW1q6liAk1Oys6umoaZbDRqjcjgSrbnrifHsfsttza7zcvRAsL7mMV6xWcyhwQy7Xj5v4hhbr6b+iDYwlmQ==",
-      "license": "MIT"
-    },
     "node_modules/sass/node_modules/readdirp": {
       "version": "4.1.2",
       "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-4.1.2.tgz",
@@ -3901,7 +4942,6 @@
       "version": "7.7.2",
       "resolved": "https://registry.npmjs.org/semver/-/semver-7.7.2.tgz",
       "integrity": "sha512-RF0Fw+rO5AMf9MAyaRXI4AV0Ulj5lMHqVxxdSgiVbixSCXoEmmX/jk0CuJw4+3SqroYO9VoUh+HcuJivvtJemA==",
-      "dev": true,
       "license": "ISC",
       "bin": {
         "semver": "bin/semver.js"
@@ -3993,25 +5033,73 @@
       "dev": true,
       "license": "ISC"
     },
+    "node_modules/sharp": {
+      "version": "0.33.5",
+      "resolved": "https://registry.npmjs.org/sharp/-/sharp-0.33.5.tgz",
+      "integrity": "sha512-haPVm1EkS9pgvHrQ/F3Xy+hgcuMV0Wm9vfIBSiwZ05k+xgb0PkBQpGsAA/oWdDobNaZTH5ppvHtzCFbnSEwHVw==",
+      "hasInstallScript": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "color": "^4.2.3",
+        "detect-libc": "^2.0.3",
+        "semver": "^7.6.3"
+      },
+      "engines": {
+        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      },
+      "optionalDependencies": {
+        "@img/sharp-darwin-arm64": "0.33.5",
+        "@img/sharp-darwin-x64": "0.33.5",
+        "@img/sharp-libvips-darwin-arm64": "1.0.4",
+        "@img/sharp-libvips-darwin-x64": "1.0.4",
+        "@img/sharp-libvips-linux-arm": "1.0.5",
+        "@img/sharp-libvips-linux-arm64": "1.0.4",
+        "@img/sharp-libvips-linux-s390x": "1.0.4",
+        "@img/sharp-libvips-linux-x64": "1.0.4",
+        "@img/sharp-libvips-linuxmusl-arm64": "1.0.4",
+        "@img/sharp-libvips-linuxmusl-x64": "1.0.4",
+        "@img/sharp-linux-arm": "0.33.5",
+        "@img/sharp-linux-arm64": "0.33.5",
+        "@img/sharp-linux-s390x": "0.33.5",
+        "@img/sharp-linux-x64": "0.33.5",
+        "@img/sharp-linuxmusl-arm64": "0.33.5",
+        "@img/sharp-linuxmusl-x64": "0.33.5",
+        "@img/sharp-wasm32": "0.33.5",
+        "@img/sharp-win32-ia32": "0.33.5",
+        "@img/sharp-win32-x64": "0.33.5"
+      }
+    },
+    "node_modules/sharp/node_modules/detect-libc": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.0.4.tgz",
+      "integrity": "sha512-3UDv+G9CsCKO1WKMGw9fwq/SWJYbI0c5Y7LU1AXYoDdbhE2AHQ6N6Nb34sG8Fj7T5APy8qXDCKuuIHd1BR0tVA==",
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/shebang-command": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-1.2.0.tgz",
-      "integrity": "sha512-EV3L1+UQWGor21OmnvojK36mhg+TyIKDh3iFBKBohr5xeXIhNBcx8oWdgkTEEQ+BEFFYdLRuqMfd5L84N1V5Vg==",
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz",
+      "integrity": "sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==",
       "license": "MIT",
       "dependencies": {
-        "shebang-regex": "^1.0.0"
+        "shebang-regex": "^3.0.0"
       },
       "engines": {
-        "node": ">=0.10.0"
+        "node": ">=8"
       }
     },
     "node_modules/shebang-regex": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/shebang-regex/-/shebang-regex-1.0.0.tgz",
-      "integrity": "sha512-wpoSFAxys6b2a2wHZ1XpDSgD7N9iVjg29Ph9uV/uaP9Ex/KXlkTZTeddxDPSYQpgvzKLGJke2UU0AzoGCjNIvQ==",
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/shebang-regex/-/shebang-regex-3.0.0.tgz",
+      "integrity": "sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==",
       "license": "MIT",
       "engines": {
-        "node": ">=0.10.0"
+        "node": ">=8"
       }
     },
     "node_modules/shell-quote": {
@@ -4098,6 +5186,33 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/signal-exit": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-4.1.0.tgz",
+      "integrity": "sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=14"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
+    "node_modules/simple-swizzle": {
+      "version": "0.2.2",
+      "resolved": "https://registry.npmjs.org/simple-swizzle/-/simple-swizzle-0.2.2.tgz",
+      "integrity": "sha512-JA//kQgZtbuY83m+xT+tXJkmJncGMTFT+C+g2h2R9uxkYIrE2yy9sgmcLhCnw57/WSD+Eh3J97FPEDFnbXnDUg==",
+      "license": "MIT",
+      "dependencies": {
+        "is-arrayish": "^0.3.1"
+      }
+    },
+    "node_modules/simple-swizzle/node_modules/is-arrayish": {
+      "version": "0.3.2",
+      "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.3.2.tgz",
+      "integrity": "sha512-eVRqCvVlZbuw3GrM63ovNSNAeA1K16kaR/LRY/92w0zxQ5/1YzwblUX652i4Xs9RwAGjW9d9y6X88t8OaAJfWQ==",
+      "license": "MIT"
+    },
     "node_modules/slash": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
@@ -4118,6 +5233,15 @@
         "node": ">=8.0.0"
       }
     },
+    "node_modules/source-map": {
+      "version": "0.6.1",
+      "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
+      "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
+      "license": "BSD-3-Clause",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
     "node_modules/source-map-js": {
       "version": "1.2.1",
       "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz",
@@ -4127,6 +5251,16 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/source-map-support": {
+      "version": "0.5.21",
+      "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.21.tgz",
+      "integrity": "sha512-uBHU3L3czsIyYXKX88fdrGovxdSCoTGDRZ6SYXtSRxLZUzHg5P/66Ht6uoUlHu9EZod+inXhKo3qQgwXUT/y1w==",
+      "license": "MIT",
+      "dependencies": {
+        "buffer-from": "^1.0.0",
+        "source-map": "^0.6.0"
+      }
+    },
     "node_modules/spdx-correct": {
       "version": "3.2.0",
       "resolved": "https://registry.npmjs.org/spdx-correct/-/spdx-correct-3.2.0.tgz",
@@ -4203,10 +5337,27 @@
       }
     },
     "node_modules/string-width": {
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-5.1.2.tgz",
+      "integrity": "sha512-HnLOCR3vjcY8beoNLtcjZ5/nxn2afmME6lhrDrebokqMap+XbeW8n9TXpPDOqdGK5qcI3oT0GKTW6wC7EMiVqA==",
+      "license": "MIT",
+      "dependencies": {
+        "eastasianwidth": "^0.2.0",
+        "emoji-regex": "^9.2.2",
+        "strip-ansi": "^7.0.1"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/string-width-cjs": {
+      "name": "string-width",
       "version": "4.2.3",
       "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
       "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "emoji-regex": "^8.0.0",
@@ -4217,6 +5368,33 @@
         "node": ">=8"
       }
     },
+    "node_modules/string-width-cjs/node_modules/ansi-regex": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
+      "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/string-width-cjs/node_modules/emoji-regex": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
+      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
+      "license": "MIT"
+    },
+    "node_modules/string-width-cjs/node_modules/strip-ansi": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
+      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+      "license": "MIT",
+      "dependencies": {
+        "ansi-regex": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/string.prototype.padend": {
       "version": "3.1.6",
       "resolved": "https://registry.npmjs.org/string.prototype.padend/-/string.prototype.padend-3.1.6.tgz",
@@ -4292,10 +5470,25 @@
       }
     },
     "node_modules/strip-ansi": {
+      "version": "7.1.0",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-7.1.0.tgz",
+      "integrity": "sha512-iq6eVVI64nQQTRYq2KtEg2d2uU7LElhTJwsH4YzIHZshxlgZms/wIc4VoDQTlG/IvVIrBKG06CrZnp0qv7hkcQ==",
+      "license": "MIT",
+      "dependencies": {
+        "ansi-regex": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/strip-ansi?sponsor=1"
+      }
+    },
+    "node_modules/strip-ansi-cjs": {
+      "name": "strip-ansi",
       "version": "6.0.1",
       "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
       "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "ansi-regex": "^5.0.1"
@@ -4304,6 +5497,15 @@
         "node": ">=8"
       }
     },
+    "node_modules/strip-ansi-cjs/node_modules/ansi-regex": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
+      "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/strip-bom": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-3.0.0.tgz",
@@ -4347,6 +5549,30 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/terser": {
+      "version": "5.43.1",
+      "resolved": "https://registry.npmjs.org/terser/-/terser-5.43.1.tgz",
+      "integrity": "sha512-+6erLbBm0+LROX2sPXlUYx/ux5PyE9K/a92Wrt6oA+WDAoFTdpHE5tCYCI5PNzq2y8df4rA+QgHLJuR4jNymsg==",
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "@jridgewell/source-map": "^0.3.3",
+        "acorn": "^8.14.0",
+        "commander": "^2.20.0",
+        "source-map-support": "~0.5.20"
+      },
+      "bin": {
+        "terser": "bin/terser"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/terser/node_modules/commander": {
+      "version": "2.20.3",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz",
+      "integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==",
+      "license": "MIT"
+    },
     "node_modules/thenby": {
       "version": "1.3.4",
       "resolved": "https://registry.npmjs.org/thenby/-/thenby-1.3.4.tgz",
@@ -4394,6 +5620,13 @@
         "node": ">=0.6"
       }
     },
+    "node_modules/tslib": {
+      "version": "2.8.1",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
+      "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==",
+      "license": "0BSD",
+      "optional": true
+    },
     "node_modules/typed-array-buffer": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/typed-array-buffer/-/typed-array-buffer-1.0.3.tgz",
@@ -4492,6 +5725,13 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/undici-types": {
+      "version": "7.8.0",
+      "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-7.8.0.tgz",
+      "integrity": "sha512-9UJ2xGDvQ43tYyVMpuHlsgApydB8ZKfVYTsLDhXkFL/6gfkp+U8xTGdh8pMJv1SpZna0zxG1DwsKZsreLbXBxw==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/universalify": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.1.tgz",
@@ -4568,15 +5808,18 @@
       }
     },
     "node_modules/which": {
-      "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/which/-/which-1.3.1.tgz",
-      "integrity": "sha512-HxJdYWq1MTIQbJ3nw0cqssHoTNU267KlrDuGZ1WYlxDStUtKUhOaJmh112/TZmHxxUfuJqPXSOm7tDyas0OSIQ==",
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz",
+      "integrity": "sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==",
       "license": "ISC",
       "dependencies": {
         "isexe": "^2.0.0"
       },
       "bin": {
-        "which": "bin/which"
+        "node-which": "bin/node-which"
+      },
+      "engines": {
+        "node": ">= 8"
       }
     },
     "node_modules/which-boxed-primitive": {
@@ -4625,12 +5868,6 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/which-builtin-type/node_modules/isarray": {
-      "version": "2.0.5",
-      "resolved": "https://registry.npmjs.org/isarray/-/isarray-2.0.5.tgz",
-      "integrity": "sha512-xHjhDr3cNBK0BzdUJSPXZntQUx/mwMS5Rw4A7lPJ90XGAO6ISP/ePDNuo0vhqOZU+UD5JoodwCAAoZQd3FeAKw==",
-      "license": "MIT"
-    },
     "node_modules/which-collection": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/which-collection/-/which-collection-1.0.2.tgz",
@@ -4671,10 +5908,27 @@
       }
     },
     "node_modules/wrap-ansi": {
+      "version": "8.1.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-8.1.0.tgz",
+      "integrity": "sha512-si7QWI6zUMq56bESFvagtmzMdGOtoxfR+Sez11Mobfc7tm+VkUckk9bW2UeffTGVUbOksxmSw0AA2gs8g71NCQ==",
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^6.1.0",
+        "string-width": "^5.0.1",
+        "strip-ansi": "^7.0.1"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
+      }
+    },
+    "node_modules/wrap-ansi-cjs": {
+      "name": "wrap-ansi",
       "version": "7.0.0",
       "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
       "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "ansi-styles": "^4.0.0",
@@ -4688,11 +5942,19 @@
         "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
       }
     },
-    "node_modules/wrap-ansi/node_modules/ansi-styles": {
+    "node_modules/wrap-ansi-cjs/node_modules/ansi-regex": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
+      "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/wrap-ansi-cjs/node_modules/ansi-styles": {
       "version": "4.3.0",
       "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
       "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "color-convert": "^2.0.1"
@@ -4704,11 +5966,10 @@
         "url": "https://github.com/chalk/ansi-styles?sponsor=1"
       }
     },
-    "node_modules/wrap-ansi/node_modules/color-convert": {
+    "node_modules/wrap-ansi-cjs/node_modules/color-convert": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
       "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "color-name": "~1.1.4"
@@ -4717,13 +5978,56 @@
         "node": ">=7.0.0"
       }
     },
-    "node_modules/wrap-ansi/node_modules/color-name": {
+    "node_modules/wrap-ansi-cjs/node_modules/color-name": {
       "version": "1.1.4",
       "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
       "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
-      "dev": true,
       "license": "MIT"
     },
+    "node_modules/wrap-ansi-cjs/node_modules/emoji-regex": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
+      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
+      "license": "MIT"
+    },
+    "node_modules/wrap-ansi-cjs/node_modules/string-width": {
+      "version": "4.2.3",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
+      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+      "license": "MIT",
+      "dependencies": {
+        "emoji-regex": "^8.0.0",
+        "is-fullwidth-code-point": "^3.0.0",
+        "strip-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/wrap-ansi-cjs/node_modules/strip-ansi": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
+      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+      "license": "MIT",
+      "dependencies": {
+        "ansi-regex": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/wrap-ansi/node_modules/ansi-styles": {
+      "version": "6.2.1",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-6.2.1.tgz",
+      "integrity": "sha512-bN798gFfQX+viw3R7yrGWRqnrN2oRkEkUjjl4JNn4E8GxxbjtG3FbrEIIY3l8/hrwUwIeCZvi4QuOTP4MErVug==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
     "node_modules/ws": {
       "version": "8.18.2",
       "resolved": "https://registry.npmjs.org/ws/-/ws-8.18.2.tgz",
@@ -4797,6 +6101,51 @@
       "engines": {
         "node": ">=12"
       }
+    },
+    "node_modules/yargs/node_modules/ansi-regex": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
+      "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/yargs/node_modules/emoji-regex": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
+      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/yargs/node_modules/string-width": {
+      "version": "4.2.3",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
+      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "emoji-regex": "^8.0.0",
+        "is-fullwidth-code-point": "^3.0.0",
+        "strip-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/yargs/node_modules/strip-ansi": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
+      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-regex": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
     }
   }
 }
diff --git a/package.json b/package.json
index c9ed8c5..fb7a5a6 100644
--- a/package.json
+++ b/package.json
@@ -6,15 +6,19 @@
   "type": "module",
   "scripts": {
     "sass": "sass --no-source-map src/assets/scss/:public/css/",
-    "sass:compressed": "sass --style=compressed --no-source-map src/assets/scss:public/css/",
-    "postcss": "postcss public/css/*.css --use autoprefixer postcss-import postcss-nested --dir public/css",
+    "sass:compressed": "sass --no-source-map --style=compressed src/assets/scss:public/css/",
+    "postcss": "postcss public/css/*.css --use postcss-import autoprefixer postcss-nested --no-map --dir public/css",
+    "minify:js": "node bin/minify.js",
+    "prettify:html": "prettier --write public/**/*.html --ignore-path .prettierignore",
     "watch": "npm-run-all --parallel watch:*",
     "watch:eleventy": "eleventy --serve",
     "watch:sass": "npm run sass:compressed -- --watch",
     "watch:postcss": "npm run postcss -- --watch",
-    "build": "npm run sass:compressed && npm run postcss && eleventy",
-    "start": "npm-run-all sass:compressed postcss --parallel watch:*",
-    "dev": "npm run watch"
+    "build": "npm run sass:compressed && npm run postcss && npm run minify:js && eleventy && npm run prettify:html",
+    "start": "npm-run-all --parallel watch:eleventy",
+    "dev": "npm run watch",
+    "test:highlightjs-lines": "node ./lib/highlightjs-lines.test.js",
+    "test": "node --test"
   },
   "repository": {
     "type": "git",
@@ -30,21 +34,29 @@
   "devDependencies": {
     "@11ty/eleventy": "^3.1.1",
     "@11ty/eleventy-plugin-rss": "^2.0.4",
-    "postcss": "^8.4.31",
-    "postcss-cli": "^11.0.1",
+    "@playwright/test": "^1.53.1",
+    "@types/node": "^24.0.7",
     "autoprefixer": "^10.4.21",
+    "postcss": "^8.5.5",
+    "postcss-cli": "^11.0.1",
     "postcss-import": "^16.1.0",
-    "postcss-nested": "^7.0.2"
+    "postcss-nested": "^7.0.2",
+    "prettier": "^3.5.3"
   },
   "dependencies": {
+    "@11ty/eleventy-img": "^6.0.4",
+    "chalk": "^5.4.1",
     "dotenv": "^16.5.0",
+    "glob": "^11.0.3",
     "highlight.js": "^11.5.1",
+    "highlightjs-code-diff": "^1.0.0",
     "markdown-it-anchor": "^9.2.0",
     "markdown-it-attrs": "^4.1.4",
     "markdown-it-bracketed-spans": "^1.0.1",
     "markdown-it-mark": "^4.0.0",
     "markdown-it-table-of-contents": "^0.9.0",
     "npm-run-all": "^4.1.5",
-    "sass": "^1.49.8"
+    "sass": "1.89.2",
+    "terser": "^5.42.0"
   }
 }
diff --git a/playwright.config.ts b/playwright.config.ts
new file mode 100644
index 0000000..4c09e71
--- /dev/null
+++ b/playwright.config.ts
@@ -0,0 +1,35 @@
+import { defineConfig, devices } from '@playwright/test';
+
+const localhost = "http://localhost:8080"
+
+export default defineConfig({
+  testDir: './tests',
+  fullyParallel: true,
+  forbidOnly: !!process.env.CI,
+  retries: process.env.CI ? 2 : 0,
+  workers: process.env.CI ? 1 : undefined,
+  reporter: [['html', { open: 'never' }]],
+  use: {
+    baseURL: localhost,
+    trace: 'on-first-retry',
+  },
+  projects: [
+    {
+      name: 'chromium',
+      use: { ...devices['Desktop Chrome'] },
+    },
+    {
+      name: 'firefox',
+      use: { ...devices['Desktop Firefox'] },
+    },
+    {
+      name: 'webkit',
+      use: { ...devices['Desktop Safari'] },
+    },
+  ],
+  webServer: {
+    command: 'npm start',
+    url: localhost,
+    reuseExistingServer: !process.env.CI,
+  },
+});
diff --git a/settings.example.json b/settings.example.json
index a8d6b26..403a8b7 100644
--- a/settings.example.json
+++ b/settings.example.json
@@ -15,6 +15,5 @@
       "startHour": 11,
       "endHour": 14
     }
-  ],
-  "colorScheme": "default"
+  ]
 }
diff --git a/settings.json b/settings.json
index e51c930..b4f3269 100644
--- a/settings.json
+++ b/settings.json
@@ -25,6 +25,5 @@
       "startHour": 7,
       "endHour": 17
     }
-  ],
-  "colorScheme": "default"
+  ]
 }
diff --git a/src/_includes/article.njk b/src/_includes/article.njk
deleted file mode 100644
index 8f28fb6..0000000
--- a/src/_includes/article.njk
+++ /dev/null
@@ -1,61 +0,0 @@
----
-layout: 'layouts/secondary.njk'
-style: 'article.css'
----
-{% set previousPost = collections.post | getPreviousCollectionItem(page) %}
-{% set nextPost = collections.post | getNextCollectionItem(page) %}
-
-<header class="header header_article">
-  <img width="1920" height="1080" loading="lazy" src="{{ image }}" alt="{{ title }}">
-</header>
-<main class="main">
-  <div class="main-container">
-    <article class="article">
-      <header>
-        <span>
-          <a class="breadcrumb" href="/">Home</a> ›
-          <a class="breadcrumb" href="/blog">Blog</a> › {{ title }}
-        </span>
-        <h1 class="article-title" id="{{ title | slug }}">{{ title }}</h1>
-        <p class="article-summary">{{ description }}</p>
-        <div class="article-detail_list article-flex_list">
-          <div class="article-detail_item">
-            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
-              stroke="currentColor" class="article-detail_item_svg">
-              <path stroke-linecap="round" stroke-linejoin="round"
-                d="M15.75 6a3.75 3.75 0 11-7.5 0 3.75 3.75 0 017.5 0zM4.501 20.118a7.5 7.5 0 0114.998 0A17.933 17.933 0 0112 21.75c-2.676 0-5.216-.584-7.499-1.632z" />
-            </svg>
-            {{ author }}
-          </div>
-          <div class="article-detail_item">
-            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
-              stroke="currentColor" class="article-detail_item_svg">
-              <path stroke-linecap="round" stroke-linejoin="round"
-                d="M6.75 3v2.25M17.25 3v2.25M3 18.75V7.5a2.25 2.25 0 012.25-2.25h13.5A2.25 2.25 0 0121 7.5v11.25m-18 0A2.25 2.25 0 005.25 21h13.5A2.25 2.25 0 0021 18.75m-18 0v-7.5A2.25 2.25 0 015.25 9h13.5A2.25 2.25 0 0121 11.25v7.5" />
-            </svg>
-            <time datetime="{{ date | htmlDateString }}">{{ date | postDate }}</time>
-          </div>
-        </div>
-      </header>
-      <main id="main">
-        {{ content | safe }}
-      </main>
-      <section class="more">
-        {% if nextPost %}
-        <div class="more-next">
-          ← Next Post<br /> <a href="{{ nextPost.url }}">{{ nextPost.data.title }}
-          </a>
-        </div>
-        {% endif %}
-        {% if previousPost %}
-        <div class="more-previous">
-          Previous Post →<br /> <a href="{{ previousPost.url }}">{{ previousPost.data.title }}
-          </a>
-        </div>
-        {% endif %}
-      </section>
-    </article>
-  </div>
-</main>
-
-<script src="/js/blog.js"></script>
\ No newline at end of file
diff --git a/src/_includes/components/meta.njk b/src/_includes/components/meta.njk
index 226da33..151537e 100644
--- a/src/_includes/components/meta.njk
+++ b/src/_includes/components/meta.njk
@@ -2,65 +2,78 @@
 <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 <meta http-equiv="X-UA-Compatible" content="ie=edge" />
 <meta name="theme-color" content="#000000" />
-<meta name="google-site-verification" content="QdJZEMLWFpqAkaOxsDd2zR4mzmtW7VN07LemJCDZuD0" />
-
+<meta name="google-site-verification"
+      content="QdJZEMLWFpqAkaOxsDd2zR4mzmtW7VN07LemJCDZuD0" />
 {% if author %}
-<meta name="author" content="{{ author }}" />
+      <meta name="author" content="{{ author }}" />
 {% else %}
-<meta name="author" content="EmptyWork" />
+      <meta name="author" content="EmptyWork" />
 {% endif %}
 <meta name="keywords"
-  content="EmptyWork, Portofolio, Seorang Web Developer, Web Developer, HTML5, CSS3, Javascript, Stevarth, Ambon" />
+      content="EmptyWork, Portofolio, Seorang Web Developer, Web Developer, HTML5, CSS3, Javascript, Stevarth, Ambon" />
 <meta property="og:locale" content="en_US" />
 <meta property="og:type" content="website" />
-
 {% if description %}
-<meta name="description" content="{{ description }}" />
-<meta property="og:description" content="{{ description }}" />
-<meta itemprop="description" content="{{ description }}">
-<meta name="twitter:description" content="{{ description }}">
+      <meta name="description" content="{{ description }}" />
+      <meta property="og:description" content="{{ description }}" />
+      <meta itemprop="description" content="{{ description }}" />
+      <meta name="twitter:description" content="{{ description }}" />
 {% else %}
-<meta name="description"
-  content="EmptyWork's portofolio, I am passionate about making web more accessible for everyone, with that in mind I focused on learning about Accessibility (A11y) and UI/UX Development." />
-<meta property="og:description"
-  content="EmptyWork's portofolio, I am passionate about making web more accessible for everyone, with that in mind I focused on learning about Accessibility (A11y) and UI/UX Development." />
-<meta itemprop="description"
-  content="EmptyWork's portofolio, I am passionate about making web more accessible for everyone, with that in mind I focused on learning about Accessibility (A11y) and UI/UX Development.">
-<meta name="twitter:description"
-  content="EmptyWork's portofolio, I am passionate about making web more accessible for everyone, with that in mind I focused on learning about Accessibility (A11y) and UI/UX Development.">
+      <meta name="description"
+            content="EmptyWork's portofolio, I am passionate about making web more accessible for everyone, with that in mind I focused on learning about Accessibility (A11y) and UI/UX Development." />
+      <meta property="og:description"
+            content="EmptyWork's portofolio, I am passionate about making web more accessible for everyone, with that in mind I focused on learning about Accessibility (A11y) and UI/UX Development." />
+      <meta itemprop="description"
+            content="EmptyWork's portofolio, I am passionate about making web more accessible for everyone, with that in mind I focused on learning about Accessibility (A11y) and UI/UX Development." />
+      <meta name="twitter:description"
+            content="EmptyWork's portofolio, I am passionate about making web more accessible for everyone, with that in mind I focused on learning about Accessibility (A11y) and UI/UX Development." />
 {% endif %}
-
 <meta property="og:url" content="https://emptywork.my.id" />
 <meta property="og:site_name" content="EmptyWork" />
-
 {% if image %}
-<meta property="og:image" content="{{ image }}" />
-<meta itemprop="image" content="{{ image }}">
-<meta name="twitter:image" content="{{ image }}">
+      <meta property="og:image" content="{{ image | convertToValidURL }}" />
+      <meta itemprop="image" content="{{ image | convertToValidURL }}" />
+      <meta name="twitter:image" content="{{ image | convertToValidURL }}" />
 {% else %}
-<meta itemprop="image" content="/images/emptywork.my.id-secondary-banner.png">
-<meta property="og:image" content="/images/emptywork.my.id-secondary-banner.png" />
-<meta name="twitter:image" content="/images/emptywork.my.id-secondary-banner.png">
+      <meta itemprop="image"
+            content="{{ link.website | development }}/images/emptywork.my.id-secondary-banner.png" />
+      <meta property="og:image"
+            content="{{ link.website | development }}/images/emptywork.my.id-secondary-banner.png" />
+      <meta name="twitter:image"
+            content="{{ link.website | development }}/images/emptywork.my.id-secondary-banner.png" />
 {% endif %}
-
 <meta name="twitter:card" content="summary_large_image" />
 {% if title %}
-<meta property="og:title" content="{{ title }}" />
-<meta name="twitter:title" content="{{ title }}">
-<meta itemprop="name" content="{{ title }}">
+      <meta property="og:title" content="{{ title }}" />
+      <meta name="twitter:title" content="{{ title }}" />
+      <meta itemprop="name" content="{{ title }}" />
 {% else %}
-<meta property="og:title" content="Emptywork" />
-<meta name="twitter:title" content="Emptywork">
-<meta itemprop="name" content="Emptywork">
+      <meta property="og:title" content="Emptywork" />
+      <meta name="twitter:title" content="Emptywork" />
+      <meta itemprop="name" content="Emptywork" />
 {% endif %}
-<link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png">
-<link rel="icon" type="image/png" sizes="32x32" href="/images/favicon-32x32.png">
-<link rel="icon" type="image/png" sizes="194x194" href="/images/favicon-194x194.png">
-<link rel="icon" type="image/png" sizes="192x192" href="/images/android-chrome-192x192.png">
-<link rel="icon" type="image/png" sizes="16x16" href="/images/favicon-16x16.png">
-<link rel="manifest" href="/images/site.webmanifest">
-<link rel="mask-icon" href="/images/safari-pinned-tab.svg" color="#242424">
-<link rel="shortcut icon" href="/images/favicon.ico">
-<meta name="msapplication-TileColor" content="#242424">
-<meta name="msapplication-TileImage" content="/images/mstile-144x144.png">
-<meta name="msapplication-config" content="/images/browserconfig.xml">
\ No newline at end of file
+<link rel="apple-touch-icon"
+      sizes="180x180"
+      href="/images/apple-touch-icon.png" />
+<link rel="icon"
+      type="image/png"
+      sizes="32x32"
+      href="/images/favicon-32x32.png" />
+<link rel="icon"
+      type="image/png"
+      sizes="194x194"
+      href="/images/favicon-194x194.png" />
+<link rel="icon"
+      type="image/png"
+      sizes="192x192"
+      href="/images/android-chrome-192x192.png" />
+<link rel="icon"
+      type="image/png"
+      sizes="16x16"
+      href="/images/favicon-16x16.png" />
+<link rel="manifest" href="/images/site.webmanifest" />
+<link rel="mask-icon" href="/images/safari-pinned-tab.svg" color="#242424" />
+<link rel="shortcut icon" href="/images/favicon.ico" />
+<meta name="msapplication-TileColor" content="#242424" />
+<meta name="msapplication-TileImage" content="/images/mstile-144x144.png" />
+<meta name="msapplication-config" content="/images/browserconfig.xml" />
diff --git a/src/_includes/components/nav.njk b/src/_includes/components/nav.njk
index b8dc780..1934fce 100644
--- a/src/_includes/components/nav.njk
+++ b/src/_includes/components/nav.njk
@@ -1,8 +1,12 @@
 <nav class="nav t-all">
+  <div class="nav-skip">
+    <a class="nav-skipto" href="#main">Skip to Main</a>
+  </div>
   <div class="nav-container">
     <div class="leftside">
-      <a class="nav-skipto" href="#main">Skip to Main</a>
-      <a class="brand" aria-labelledby="emptywork-logo-text" href="{{ link.website | development }}">
+      <a class="brand"
+         aria-labelledby="emptywork-logo-text"
+         href="{{ link.website | development }}">
         <div class="brand-logo">
           {{ footer.brand.svg | svg | safe }}
           <span aria-hidden="true" id="emptywork-logo-text" class="sr-only">Logo of EmptyWork</span>
@@ -22,41 +26,59 @@
     </ul>
     <div class="rightside">
       <button class="themes" aria-label="Switch the theme" data-theme-button>
-        <svg data-sun fill="none" style="margin-bottom: -0.0625rem" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" aria-label="Icon of sun">
-          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16 12a4 4 0 11-8 0 4 4 0 018 0z"></path>
+        <svg data-sun
+             fill="none"
+             style="margin-bottom: -0.0625rem"
+             stroke="currentColor"
+             viewBox="0 0 24 24"
+             xmlns="http://www.w3.org/2000/svg"
+             aria-label="Icon of sun">
+          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16 12a4 4 0 11-8 0 4 4 0 018 0z">
+          </path>
         </svg>
-        <svg data-moon fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" aria-label="Icon of moon">
+        <svg data-moon
+             fill="currentColor"
+             viewBox="0 0 20 20"
+             xmlns="http://www.w3.org/2000/svg"
+             aria-label="Icon of moon">
           <path d="M17.293 13.293A8 8 0 016.707 2.707a8.001 8.001 0 1010.586 10.586z"></path>
         </svg>
       </button>
-      <button aria-label="Open the mobile menu" aria-haspopup="true" aria-controls="mobile-menu-list" class="nav-mobile nav-mobile__tick" data-mobile-menu-button>
-        <svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" aria-label="Icon for menu hamburger">
+      <button aria-label="Open the mobile menu"
+              aria-haspopup="true"
+              aria-controls="mobile-menu-list"
+              class="nav-mobile nav-mobile__tick"
+              data-mobile-menu-button>
+        <svg fill="none"
+             stroke="currentColor"
+             viewBox="0 0 24 24"
+             xmlns="http://www.w3.org/2000/svg"
+             aria-label="Icon for menu hamburger">
           <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path>
         </svg>
       </button>
     </div>
   </div>
 </nav>
-<ul id="mobile-menu-list" class="not-showing nav-mobile__section t-all" data-mobile-menu-section aria-label="List of mobile menu" role="menu">
+<ul id="mobile-menu-list"
+    class="not-showing nav-mobile__section t-all"
+    data-mobile-menu-section
+    aria-label="List of mobile menu"
+    aria-hidden="true"
+    role="menu">
   <li data-mobile-menu-button role="menuitem">
     <a href="/">
-      <div>
-        Home
-      </div>
+      <div>Home</div>
     </a>
   </li>
   <li data-mobile-menu-button role="menuitem">
     <a href="/blog">
-      <div>
-        Blog
-      </div>
+      <div>Blog</div>
     </a>
   </li>
   <li data-mobile-menu-button role="menuitem">
     <a href="/contact">
-      <div>
-        Contact
-      </div>
+      <div>Contact</div>
     </a>
   </li>
-</ul>
\ No newline at end of file
+</ul>
diff --git a/src/_includes/components/snippets/article.njk b/src/_includes/components/snippets/post-card.njk
similarity index 100%
rename from src/_includes/components/snippets/article.njk
rename to src/_includes/components/snippets/post-card.njk
diff --git a/src/_includes/components/snippets/project.njk b/src/_includes/components/snippets/project-card.njk
similarity index 94%
rename from src/_includes/components/snippets/project.njk
rename to src/_includes/components/snippets/project-card.njk
index 71e3df9..5ec8129 100644
--- a/src/_includes/components/snippets/project.njk
+++ b/src/_includes/components/snippets/project-card.njk
@@ -4,9 +4,11 @@
   {% if project.data.image %}
     <div class="card-image">
       <img class="card-background"
-           width="100"
-           height="100"
+           eleventy:output="/images/"
+           width="400"
+           height="400"
            loading="lazy"
+           decoding="async"
            src="{{ project.data.image }}"
            alt="Image of {{ project.data.title }}">
     </div>
diff --git a/src/_includes/components/snippets/prototype.njk b/src/_includes/components/snippets/prototype-card.njk
similarity index 100%
rename from src/_includes/components/snippets/prototype.njk
rename to src/_includes/components/snippets/prototype-card.njk
diff --git a/src/_includes/layouts/article.njk b/src/_includes/layouts/article.njk
new file mode 100644
index 0000000..6e963bd
--- /dev/null
+++ b/src/_includes/layouts/article.njk
@@ -0,0 +1,88 @@
+---
+layout: 'layouts/secondary.njk'
+styles: 
+  - 'article.css'
+  - 'highlight.css'
+---
+
+{% set previousPost = collections.post | getPreviousCollectionItem(page) %}
+{% set nextPost = collections.post | getNextCollectionItem(page) %}
+<header class="header header_article">
+  <img width="1920"
+       height="1080"
+       loading="lazy"
+       src="{{ image }}"
+       alt="{{ title }}">
+</header>
+<main class="main">
+  <div class="main-container">
+    <article class="article">
+      <header>
+        <span>
+          <a class="breadcrumb" href="/">Home</a> ›
+          <a class="breadcrumb" href="/blog">Blog</a> › <span aria-current="page">{{ title }}</span>
+        </span>
+        <h1 class="article-title" id="{{ title | slug }}">{{ title }}</h1>
+        <p class="article-summary">{{ description }}</p>
+        <div class="article-detail_list article-flex_list">
+          <div class="article-detail_item">
+            <svg xmlns="http://www.w3.org/2000/svg"
+                 fill="none"
+                 viewBox="0 0 24 24"
+                 stroke-width="1.5"
+                 stroke="currentColor"
+                 class="article-detail_item_svg">
+              <path stroke-linecap="round" stroke-linejoin="round" d="M15.75 6a3.75 3.75 0 11-7.5 0 3.75 3.75 0 017.5 0zM4.501 20.118a7.5 7.5 0 0114.998 0A17.933 17.933 0 0112 21.75c-2.676 0-5.216-.584-7.499-1.632z" />
+            </svg>
+            {{ author }}
+          </div>
+          <div class="article-detail_item">
+            <svg xmlns="http://www.w3.org/2000/svg"
+                 fill="none"
+                 viewBox="0 0 24 24"
+                 stroke-width="1.5"
+                 stroke="currentColor"
+                 class="article-detail_item_svg">
+              <path stroke-linecap="round" stroke-linejoin="round" d="M6.75 3v2.25M17.25 3v2.25M3 18.75V7.5a2.25 2.25 0 012.25-2.25h13.5A2.25 2.25 0 0121 7.5v11.25m-18 0A2.25 2.25 0 005.25 21h13.5A2.25 2.25 0 0021 18.75m-18 0v-7.5A2.25 2.25 0 015.25 9h13.5A2.25 2.25 0 0121 11.25v7.5" />
+            </svg>
+            <time datetime="{{ date | htmlDateString }}">{{ date | postDate }}</time>
+          </div>
+        </div>
+      </header>
+      <main id="main">
+        {{ content | safe }}
+      </main>
+      <section class="more">
+        {% if not nextPost.data.draft and nextPost %}
+          <div class="more-next">
+            ← Next Post
+            <br />
+            <a href="{{ nextPost.url }}">{{ nextPost.data.title }}</a>
+          </div>
+        {% endif %}
+        {% if nextPost and isDevelopment and nextPost.data.draft %}
+          <div class="more-next">
+            ← Next Post <i>(Draft)</i>
+            <br />
+            <a href="{{ nextPost.url }}">{{ nextPost.data.title }}</a>
+          </div>
+        {% endif %}
+        {% if not previousPost.data.draft and previousPost %}
+          <div class="more-previous">
+            Previous Post →
+            <br />
+            <a href="{{ previousPost.url }}">{{ previousPost.data.title }}</a>
+          </div>
+        {% endif %}
+        {% if previousPost and isDevelopment and previousPost.data.draft %}
+          <div class="more-next">
+            Previous Post <i>(Draft)</i> →
+            <br />
+            <a href="{{ previousPost.url }}">{{ previousPost.data.title }}</a>
+          </div>
+        {% endif %}
+      </section>
+    </article>
+  </div>
+</main>
+<script src="/js/blog.js"></script>
diff --git a/src/_includes/layouts/secondary.njk b/src/_includes/layouts/secondary.njk
index 8576138..6553648 100644
--- a/src/_includes/layouts/secondary.njk
+++ b/src/_includes/layouts/secondary.njk
@@ -11,11 +11,13 @@
           rel="stylesheet" />
     {% if style %}
       <link rel="stylesheet" href="/css/{{ style }}" />
+    {% elif styles %}
+      {% for style in styles %}
+      <link rel="stylesheet" href="/css/{{ style }}" />
+      {% endfor %}
     {% else %}
       <link rel="stylesheet" href="/css/style.css" />
     {% endif %}
-    <link rel="stylesheet"
-          href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.11.1/styles/night-owl.min.css">
     <script src="/js/loadTheme.js" defer></script>
     <script src="/js/redirect.js" defer></script>
   </head>
diff --git a/src/_includes/sections/featured.njk b/src/_includes/sections/featured.njk
index faacd69..5cf7f83 100644
--- a/src/_includes/sections/featured.njk
+++ b/src/_includes/sections/featured.njk
@@ -1,57 +1,57 @@
-<section aria-labelledby="featured" class="featured red">
-  <div class="main-container featured-container" data-animation="fade-in">
-    <div class="featured-body">
-      <time datetime="{{ featured.date | htmlDateString }}" class="featured-tag">
-        {{ featured.date | featuredDate }}
-      </time>
-      <div class="featured-left">
-        <header class="section-header featured-header">
-          <div class="header-title">
-            <a class="header-title__link" href="#featured">
-              <span aria-hidden="true">#</span>
-              <span class="sr-only">Link to heading "featured"</span>
-            </a>
-            <h2 id="featured">Featured Project</h2>
-          </div>
-          <span class="featured-header_project-name">
-            <h3>{{ featured.title }}</h3>
-            {{ featured.subtitle | renderMarkdown | safe }}
-          </span>
-        </header>
-        <main class="featured-main">
-          <p>{{ featured.summary }}</p>
-          <p class="featured-main_tag-area">
-            {% for tag in featured.tags %}<span class="featured-main_tag">{{ tag }}</span>{% endfor %}
-          </p>
-        </main>
-        <footer class="featured-external">
-          <a href="{{ featured.demoLink }}"
-             target="_blank"
-             aria-label="View featured project BikeForRupiah"
-             rel="noopener noreferrer"
-             class="featured-external_link">
-            <svg fill="currentColor"
-                 aria-label="Icon for demo link"
-                 viewBox="0 0 20 20"
-                 xmlns="http://www.w3.org/2000/svg">
-              <path d="M11 3a1 1 0 100 2h2.586l-6.293 6.293a1 1 0 101.414 1.414L15 6.414V9a1 1 0 102 0V4a1 1 0 00-1-1h-5z"></path>
-              <path d="M5 5a2 2 0 00-2 2v8a2 2 0 002 2h8a2 2 0 002-2v-3a1 1 0 10-2 0v3H5V7h3a1 1 0 000-2H5z"></path>
-            </svg>
-            <span aria-hidden="true">View Project</span>
-          </a>
-        </footer>
-      </div>
-      <div class="featured-right">
-        <img src="./images/bikeforrupiah.png"
-             width="100"
-             height="100"
-             alt=""
-             srcset="">
-      </div>
-    </div>
-    <footer class="featured-footer">
-      <p>📦 Featured</p>
-      <p>🎧 Recent Work</p>
-    </footer>
-  </div>
-</section>
+<section aria-labelledby="featured" class="featured red">
+  <div class="main-container featured-container" data-animation="fade-in">
+    <div class="featured-body">
+      <time datetime="{{ featured.date | htmlDateString }}" class="featured-tag">
+        {{ featured.date | featuredDate }}
+      </time>
+      <div class="featured-left">
+        <header class="section-header featured-header">
+          <div class="header-title">
+            <a class="header-title__link" href="#featured">
+              <span aria-hidden="true">#</span>
+              <span class="sr-only">Link to heading "featured"</span>
+            </a>
+            <h2 id="featured">Featured Project</h2>
+          </div>
+          <span class="featured-header_project-name">
+            <h3>{{ featured.title }}</h3>
+            {{ featured.subtitle | renderMarkdown | safe }}
+          </span>
+        </header>
+        <main class="featured-main">
+          <p>{{ featured.summary }}</p>
+          <p class="featured-main_tag-area">
+            {% for tag in featured.tags %}<span class="featured-main_tag">{{ tag }}</span>{% endfor %}
+          </p>
+        </main>
+        <footer class="featured-external">
+          <a href="{{ featured.demoLink }}"
+             target="_blank"
+             aria-label="View featured project BikeForRupiah"
+             rel="noopener noreferrer"
+             class="featured-external_link">
+            <svg fill="currentColor"
+                 aria-label="Icon for demo link"
+                 viewBox="0 0 20 20"
+                 xmlns="http://www.w3.org/2000/svg">
+              <path d="M11 3a1 1 0 100 2h2.586l-6.293 6.293a1 1 0 101.414 1.414L15 6.414V9a1 1 0 102 0V4a1 1 0 00-1-1h-5z"></path>
+              <path d="M5 5a2 2 0 00-2 2v8a2 2 0 002 2h8a2 2 0 002-2v-3a1 1 0 10-2 0v3H5V7h3a1 1 0 000-2H5z"></path>
+            </svg>
+            <span aria-hidden="true">View Project</span>
+          </a>
+        </footer>
+      </div>
+      <div class="featured-right">
+        <img src="/assets/images/bikeforrupiah.png"
+             width="400"
+             height="400"
+             alt=""
+             srcset="">
+      </div>
+    </div>
+    <footer class="featured-footer">
+      <p>📦 Featured</p>
+      <p>🎧 Recent Work</p>
+    </footer>
+  </div>
+</section>
diff --git a/src/_includes/sections/hero.njk b/src/_includes/sections/hero.njk
index 8bde749..31fd9e0 100644
--- a/src/_includes/sections/hero.njk
+++ b/src/_includes/sections/hero.njk
@@ -78,10 +78,10 @@
         <ul class="title-action__group">
           <li data-animation="left-show" data-delay="2">
             <a href="./assets/Curriculum Vitae.pdf"
-               aria-label="Open PDF of my Curriculum Vitae"
+               aria-label="Download my Curriculum Vitae"
                target="_blank"
                rel="noopener noreferrer"
-               class="title-action">
+               class="title-action" download>
               <svg fill="currentColor"
                    viewBox="0 0 20 20"
                    xmlns="http://www.w3.org/2000/svg"
diff --git a/src/_includes/sections/preload.njk b/src/_includes/sections/preload.njk
index 0b97ce3..5906945 100644
--- a/src/_includes/sections/preload.njk
+++ b/src/_includes/sections/preload.njk
@@ -1,9 +1,4 @@
 <section class="preload">
-  <svg viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg" aria-label="EmptyWork's Logo">
-    <path
-      d="M11.65 8.42634L14.8715 5.20767L18.1667 8.50567V14.2517L14.7667 17.6517V10.1178L11.65 13.2345V15.1017L8.24998 18.5017V16.6345L7.39998 17.4845V12.6763L8.24998 11.8263V7.00117L11.65 3.60117V8.42634Z" />
-    <path d="M7.23 17.6573L7.4 17.4845V19.3517L4 22.7517V5.18501H7.4V12.6763L4.82733 15.2518L7.23 17.6573Z" />
-    <path d="M14.472 0L21 6.52801V11.3362L18.1667 8.50284V5.18501H14.8913L14.8715 5.20484L12.0665 2.40267L14.472 0Z" />
-  </svg>
+  {{ "logo.svg" | svg | safe }}
   <span class="preload-text">Sit tight, the page you trying to access is currently being load</span>
 </section>
\ No newline at end of file
diff --git a/src/_includes/sections/prototypes.njk b/src/_includes/sections/prototypes.njk
index 9513d7b..cb072f1 100644
--- a/src/_includes/sections/prototypes.njk
+++ b/src/_includes/sections/prototypes.njk
@@ -1,35 +1,35 @@
-<section aria-labelledby="prototypes" class="prototype">
-  <svg class="prototype-svg_top"
-       id="svg-prototype-top"
-       viewBox="0 0 1440 400"
-       xmlns="http://www.w3.org/2000/svg">
-    <path d="M 0,400 C 0,400 0,133 0,133 C 284.5,111.5 569,90 809,90 C 1049,90 1244.5,111.5 1440,133 C 1440,133 1440,400 1440,400 Z" stroke="none" stroke-width="0" fill="currentColor" fill-opacity="0.53" class="transition-all duration-300 ease-in-out delay-150 path-0" transform="rotate(-180 720 200)">
-    </path>
-    <path d="M 0,400 C 0,400 0,266 0,266 C 241.5,270 483,274 723,274 C 963,274 1201.5,270 1440,266 C 1440,266 1440,400 1440,400 Z" stroke="none" stroke-width="0" fill="currentColor" fill-opacity="1" class="transition-all duration-300 ease-in-out delay-150 path-1" transform="rotate(-180 720 200)">
-    </path>
-  </svg>
-  <div class="main-container">
-    <header class="section-header" data-animation="fade-in">
-      <div class="header-title">
-        <a class="header-title__link" href="#prototypes">
-          <span aria-hidden="true">#</span>
-          <span class="sr-only">Link to heading "prototype"</span>
-        </a>
-        <h2 id="prototypes">Prototype</h2>
-      </div>
-      <span class="header-desc">Prototypes that I do while learning new thing.</span>
-    </header>
-    <ul class="prototypes">
-      {%- for post in collections.prototype | reverse -%}
-        {% include "components/snippets/prototype.njk" %}
-      {%- endfor -%}
-    </ul>
-  </div>
-  <svg class="prototype-svg_bottom"
-       id="svg-prototype-bottom"
-       viewBox="0 0 1440 400"
-       xmlns="http://www.w3.org/2000/svg">
-    <path d="M 0,400 C 0,400 0,200 0,200 C 257,219.5 514,239 754,239 C 994,239 1217,219.5 1440,200 C 1440,200 1440,400 1440,400 Z" stroke="none" stroke-width="0" fill="currentColor" fill-opacity="1" class="transition-all duration-300 ease-in-out delay-150 path-0">
-    </path>
-  </svg>
-</section>
+<section aria-labelledby="prototypes" class="prototype">
+  <svg class="prototype-svg_top"
+       id="svg-prototype-top"
+       viewBox="0 0 1440 400"
+       xmlns="http://www.w3.org/2000/svg">
+    <path d="M 0,400 C 0,400 0,133 0,133 C 284.5,111.5 569,90 809,90 C 1049,90 1244.5,111.5 1440,133 C 1440,133 1440,400 1440,400 Z" stroke="none" stroke-width="0" fill="currentColor" fill-opacity="0.53" class="transition-all duration-300 ease-in-out delay-150 path-0" transform="rotate(-180 720 200)">
+    </path>
+    <path d="M 0,400 C 0,400 0,266 0,266 C 241.5,270 483,274 723,274 C 963,274 1201.5,270 1440,266 C 1440,266 1440,400 1440,400 Z" stroke="none" stroke-width="0" fill="currentColor" fill-opacity="1" class="transition-all duration-300 ease-in-out delay-150 path-1" transform="rotate(-180 720 200)">
+    </path>
+  </svg>
+  <div class="main-container">
+    <header class="section-header" data-animation="fade-in">
+      <div class="header-title">
+        <a class="header-title__link" href="#prototypes">
+          <span aria-hidden="true">#</span>
+          <span class="sr-only">Link to heading "prototype"</span>
+        </a>
+        <h2 id="prototypes">Prototype</h2>
+      </div>
+      <span class="header-desc">Prototypes that I do while learning new thing.</span>
+    </header>
+    <ul class="prototypes">
+      {%- for post in collections.prototype | reverse -%}
+        {% include "components/snippets/prototype-card.njk" %}
+      {%- endfor -%}
+    </ul>
+  </div>
+  <svg class="prototype-svg_bottom"
+       id="svg-prototype-bottom"
+       viewBox="0 0 1440 400"
+       xmlns="http://www.w3.org/2000/svg">
+    <path d="M 0,400 C 0,400 0,200 0,200 C 257,219.5 514,239 754,239 C 994,239 1217,219.5 1440,200 C 1440,200 1440,400 1440,400 Z" stroke="none" stroke-width="0" fill="currentColor" fill-opacity="1" class="transition-all duration-300 ease-in-out delay-150 path-0">
+    </path>
+  </svg>
+</section>
diff --git a/src/_includes/sections/work.njk b/src/_includes/sections/work.njk
index 2750857..9052776 100644
--- a/src/_includes/sections/work.njk
+++ b/src/_includes/sections/work.njk
@@ -1,42 +1,40 @@
-<section aria-labelledby="work" class="work">
-  <div class="main-container to-be-animate">
-    <header class="section-header" data-animation="right-show">
-      <div class="header-title">
-        <a class="header-title__link" href="#work">
-          <span aria-hidden="true">#</span>
-          <span class="sr-only">Link to heading "work"</span>
-        </a>
-        <h2 id="work">Work</h2>
-      </div>
-      <span class="header-desc">Projects that I participated on or worked on.</span>
-    </header>
-    {% set lengthProjects = collections.project | length %}
-    {% if lengthProjects > 2 %}
-      <ul class="cards cards-horizontal cards-more">
-        {% set reverseProjects = collections.project | reverse %}
-        {% set projects = reverseProjects | sliceRecent %}
-      {% else %}
-        <ul class="cards cards-horizontal">
-          {% set projects = collections.project | reverse %}
-        {% endif %}
-        {%- for project in projects -%}
-          {% include 'components/snippets/project.njk' %}
-        {%- endfor -%}
-      </ul>
-      {% if lengthProjects > 3 %}
-        <a href="{{ link.github }}?tab=repositories"
-           target="_blank"
-           rel="noopener noreferrer"
-           class="section-more"
-           data-animation="fade-in"
-           aria-label="See more of my works in Github">See more in Github...</a>
-      {% endif %}
-    </div>
-    <svg class="work-svg_bottom"
-         id="svg-work"
-         viewBox="0 0 1440 400"
-         xmlns="http://www.w3.org/2000/svg">
-      <path d="M 0,400 C 0,400 0,200 0,200 C 164.8,235.2 329.6,270.4 500,259 C 670.4,247.6 846.4000000000001,189.60000000000002 1004,172 C 1161.6,154.39999999999998 1300.8,177.2 1440,200 C 1440,200 1440,400 1440,400 Z" stroke="none" stroke-width="0" fill="currentColor" fill-opacity="1" class="transition-all duration-300 ease-in-out delay-150 path-0">
-      </path>
-    </svg>
-  </section>
+<section aria-labelledby="work" class="work">
+  <div class="main-container to-be-animate">
+    <header class="section-header" data-animation="right-show">
+      <div class="header-title">
+        <a class="header-title__link" href="#work">
+          <span aria-hidden="true">#</span>
+          <span class="sr-only">Link to heading "work"</span>
+        </a>
+        <h2 id="work">Work</h2>
+      </div>
+      <span class="header-desc">Projects that I participated on or worked on.</span>
+    </header>
+    {% set lengthProjects = collections.project | length %}
+    {% set reverseProjects = collections.project | reverse %}
+    {% set projects = reverseProjects %}
+    <ul class="cards cards-horizontal{% if lengthProjects > 2 %} cards-more{% endif %}">
+      {% if lengthProjects > 2 %}
+        {% set projects = reverseProjects | sliceRecent %}
+      {% endif %}
+      {%- for project in projects -%}
+        {% include "components/snippets/project-card.njk" %}
+      {%- endfor -%}
+    </ul>
+    {% if lengthProjects > 3 %}
+      <a href="{{ link.github }}?tab=repositories"
+         target="_blank"
+         rel="noopener noreferrer"
+         class="section-more"
+         data-animation="fade-in"
+         aria-label="See more of my works in Github">See more in Github...</a>
+    {% endif %}
+  </div>
+  <svg class="work-svg_bottom"
+       id="svg-work"
+       viewBox="0 0 1440 400"
+       xmlns="http://www.w3.org/2000/svg">
+    <path d="M 0,400 C 0,400 0,200 0,200 C 164.8,235.2 329.6,270.4 500,259 C 670.4,247.6 846.4000000000001,189.60000000000002 1004,172 C 1161.6,154.39999999999998 1300.8,177.2 1440,200 C 1440,200 1440,400 1440,400 Z" stroke="none" stroke-width="0" fill="currentColor" fill-opacity="1" class="transition-all duration-300 ease-in-out delay-150 path-0">
+    </path>
+  </svg>
+</section>
diff --git a/src/admin/config.yml b/src/admin/config.yml
index e7ed0ea..987d464 100644
--- a/src/admin/config.yml
+++ b/src/admin/config.yml
@@ -2,7 +2,7 @@ backend:
   name: git-gateway
   branch: main
 media_folder: 'src/assets/images/'
-public_folder: '/images/'
+public_folder: '/assets/images/'
 collections:
   - name: 'blog'
     label: 'Blog'
diff --git a/src/articles/blog/2021-12-26-formatting-testing.md b/src/articles/blog/2021-12-26-formatting-testing.md
new file mode 100644
index 0000000..2c3cf87
--- /dev/null
+++ b/src/articles/blog/2021-12-26-formatting-testing.md
@@ -0,0 +1,186 @@
+---
+title: Formatting test for Markdown
+description: The purpose of this file is to test all the markdown support and syntaxs
+author: EmptyWork
+draft: false
+date: 2021-12-26T09:30:51.516Z
+tags:
+  - post
+  - html
+  - javascript
+  - markdown
+---
+
+[[toc]]
+
+# Main header
+
+> Another example of the formatting, this is what supposed to be a blockqoute ==This is an example of the highlight=={.highlight}
+
+## Code snippet
+
+> You can only do this if you have certain understanding regarding how to do the thing that are meant to be that thing.
+>
+> > `this is an inline-quote` does it works? click here to [jump to code-snippet-2](#code-snippet-2), or you can just scroll down, also you can hover on the code blocks.
+> >
+> > ```bash
+> > npm run install && npm run update
+> > ```
+> >
+> > > This a blockqoute inside a blockqoute inside a blockquote, it is a `block-ception`
+> > >
+> > > ```js
+> > > const isDarkThemePreferred =
+> > >   !localStorage.theme &&
+> > >   window.matchMedia('(prefers-color-scheme: dark)').matches
+> > > const dataset = document.documentElement.dataset // Getting all dataset
+> > > ```
+
+### Secondary header
+
+The markdown is being handle by the markdown-it and eleventy, while some extra works is being done by vanila javascript.
+
+```sql
+SELECT * FROM `ikan`;
+```
+
+```sql
+DROP table `ikan`;
+```
+
+#### Code snippet
+
+```python
+def greet(name):
+  print(f"Hello, {name}! Welcome to the Markdown formatting test.")
+
+greet("Visitor")
+```
+
+Here is a simple JavaScript function that adds two numbers and logs the result.
+
+### Code snippet 2
+
+```javascript
+function add(a, b) {
+  return a + b
+}
+
+console.log(add(2, 3)) // Output: 5
+```
+
+Here is a simple JavaScript function that adds two numbers and logs the result.
+
+```js
+const schedulerLoader = (schedules = {}) => {
+  let time = new Date()
+  let currentTime = time.getUTCHours() + 9
+  if (currentTime > 23) currentTime -= 23
+
+  if (replaceStatus) replaceStatus.textContent = 'Idle'
+
+  setTimeout(() => {
+    for (let i = 0; i < schedules.length; i++) {
+      let { day, endHour, startHour } = schedules[i]
+      if (!replaceStatus) return
+
+      if (days[currentDay] === toCapitalizeWord(day)) {
+        if (currentTime > startHour && currentTime < endHour) {
+          replaceStatus.textContent = 'Studying'
+        }
+        break
+      }
+      replaceStatus.textContent = 'Idle'
+    }
+  }, 0)
+}
+```
+
+```diff:js
+const schedulerLoader = (schedules = {}) => {
+  let time = new Date()
+  let currentTime = time.getUTCHours() + 9
+  if (currentTime > 23) currentTime -= 23
+
+  if (replaceStatus) replaceStatus.textContent = 'Idle'
+-  setTimeout(() => throw new Error(),0)
++  setTimeout(() => {
++    for (let i = 0; i < schedules.length; i++) {
++      let { day, endHour, startHour } = schedules[i]
++      if (!replaceStatus) return
++
++      if (days[currentDay] === toCapitalizeWord(day)) {
++        if (currentTime > startHour && currentTime < endHour) {
++          replaceStatus.textContent = 'Studying'
++        }
++        break
++      }
++      replaceStatus.textContent = 'Idle'
++    }
++  }, 0)
+```
+
+```md
+├─ docs
+│  ├─ .vuepress
+│  │  └─ config.js
+│  └─ README.md
+└─ package.json
+```
+And this is an example of markdown list:
+
+```md
+- line
+- line
+- line
+  1. stop it
+  2. what
+  3. don't worry
+```
+
+- line
+- line
+  - another list
+  - what is this?
+- line
+  1. stop it
+  2. what
+  3. don't worry
+
+#### Code snippet 3
+
+```js
+const Logger = (text, type = LoggerType.EMPTY) => {
+  const typeFormatted = type === LoggerType.EMPTY ? `${type}` : `${type}:`
+  if (isDevelopment) console.log(`${typeFormatted}`, text)
+}
+```
+
+##### Last line header
+
+```css
+#body {
+  color: red;
+}
+```
+
+Another test with json <kbd>c + d</kbd> <kbd>control + d</kbd> or <kbd>meta + d</kbd>.
+
+```json
+{
+  "id": "s9RT21XS8399#!821838"
+}
+```
+
+What about error? you can do a combo of <kbd>Shift + A</kbd>, with this as the sole purpose of testing any random stuff.
+
+### Secondary header
+
+[#code-snippet](#code-snippet-1) is type of reference that we needs<sup>[[1]](#code-snippet-5)</sup>.
+
+## Table?
+
+| Side            | Face                                           | Timeline              |
+| --------------- | ---------------------------------------------- | --------------------- |
+| Side            | Another one bites the dust                     | <sup>2025-02-01</sup> |
+| For The Emperor | Light up the sky with the flame of the emperor |                       |
diff --git a/src/articles/blog/2022-04-13-accessibility-the-future-of-web-development.md b/src/articles/blog/2022-04-13-accessibility-the-future-of-web-development.md
index 129f497..643bb4f 100644
--- a/src/articles/blog/2022-04-13-accessibility-the-future-of-web-development.md
+++ b/src/articles/blog/2022-04-13-accessibility-the-future-of-web-development.md
@@ -8,7 +8,7 @@ draft: false
 date: 2022-04-13T04:05:25.911Z
 tags:
   - post
-image: /images/accessibility.png
+image: /assets/images/accessibility.png
 ---
 
 [[toc]]
diff --git a/src/articles/blog/2023-16-09-handling-file-from-php-javascript.md b/src/articles/blog/2023-16-09-handling-file-from-php-javascript.md
new file mode 100644
index 0000000..b63f232
--- /dev/null
+++ b/src/articles/blog/2023-16-09-handling-file-from-php-javascript.md
@@ -0,0 +1,22 @@
+---
+title: Handling file from PHP to Javascript
+description: One of the problem with using PHP and Javascript, is that handling
+  file(s) by both of the language(s) at the same time.
+author: EmptyWork
+draft: true
+date: 2023-09-16T10:11:37.394Z
+tags:
+  - post
+  - thesis
+  - javascript
+  - php
+image: /assets/images/sunlight-landscape-forest-sunset-hill-nature-5912-wallhere.com.jpg
+---
+
+[[toc]]
+
+> As one of the requirement for me to get my bachelor degree on _Computer Science_, I created [_Accessibility Testing Program (ATP)_](https://github.com/EmptyWork/lighthouse-accessibility-thesis) to help me concurrently testing multiple website using Google Lighthouse.
+
+The problem arose when I was trying to implemented GUI for my current _ATP_<sup>[[1]](#definition)</sup>,
+
+<!-- > [_Accessibility Testing Program (ATP)_](https://github.com/EmptyWork/lighthouse-accessibility-thesis) is a program that made by me as part of my Thesis for my _Computer Science_ bachelor degree. -->
diff --git a/src/articles/blog/blog.json b/src/articles/blog/blog.json
index f12ff44..60fe54a 100644
--- a/src/articles/blog/blog.json
+++ b/src/articles/blog/blog.json
@@ -1,7 +1,7 @@
 {
-  "layout": "article.njk",
+  "layout": "layouts/article.njk",
   "tags": "post",
   "author": "EmptyWork",
-  "image": "/images/emptywork.my.id-default-post.jpg",
+  "image": "/assets/images/emptywork.my.id-default-post.jpg",
   "draft": true
 }
diff --git a/src/articles/project/2021-10-29-jobfair-website.md b/src/articles/project/2021-10-29-jobfair-website.md
index 22413d3..d413a68 100644
--- a/src/articles/project/2021-10-29-jobfair-website.md
+++ b/src/articles/project/2021-10-29-jobfair-website.md
@@ -4,7 +4,7 @@ author: EmptyWork
 date: 2021-05-01
 endDate: false
 tags: ['project']
-image: /images/jobfair.jpg
+image: /assets/images/jobfair.jpg
 description: An website that aim to help Ambonese looking for their new opportunties
 linkDemo: https://jobfair-gpmsyaloom.herokuapp.com/
 linkCode: false
diff --git a/src/articles/project/2021-10-29-ukimexpo2019-website.md b/src/articles/project/2021-10-29-ukimexpo2019-website.md
index e25bd2f..bd08f8f 100644
--- a/src/articles/project/2021-10-29-ukimexpo2019-website.md
+++ b/src/articles/project/2021-10-29-ukimexpo2019-website.md
@@ -4,7 +4,7 @@ author: EmptyWork
 date: 2019-10-11
 endDate: 2019-10-28
 tags: ['project']
-image: /images/expo.jpg
+image: /assets/images/expo.jpg
 description: A showcase website for promoting Informatics Faculty of Christian University of Indonesia, Moluccas
 linkDemo: https://emptywork.github.io/UKIMexpo/
 linkCode: https://github.com/EmptyWork/UKIMexpo
diff --git a/src/articles/project/2022-04-13-event-betaqris-website.md b/src/articles/project/2022-04-13-event-betaqris-website.md
index be5b777..bc454be 100644
--- a/src/articles/project/2022-04-13-event-betaqris-website.md
+++ b/src/articles/project/2022-04-13-event-betaqris-website.md
@@ -7,7 +7,7 @@ date: 2022-03-25T03:41:29.743Z
 endDate: 2022-04-06T03:41:29.825Z
 tags:
   - project
-image: /images/278038707_1063095627615778_2238829942384153761_n.jpg
+image: /assets/images/278038707_1063095627615778_2238829942384153761_n.jpg
 linkDemo: https://web.archive.org/web/20220909003651/https://betaqris.com/
 linkCode: https://www.instagram.com/p/CcAk3nbL3MX/
 ---
diff --git a/src/articles/project/2023-05-20-event-ambonfunrun-website.md b/src/articles/project/2023-05-20-event-ambonfunrun-website.md
index 2060525..6c9a85b 100644
--- a/src/articles/project/2023-05-20-event-ambonfunrun-website.md
+++ b/src/articles/project/2023-05-20-event-ambonfunrun-website.md
@@ -7,7 +7,7 @@ date: 2023-05-10T15:41:29.743Z
 endDate: 2023-05-20T09:41:29.825Z
 tags:
   - project
-image: /images/345349877_1186703082083563_922805273957392018_n.jpg
-linkDemo: https://ambonfunrun.com
+image: /assets/images/345349877_1186703082083563_922805273957392018_n.jpg
+linkDemo: https://web.archive.org/web/20230804130617/https://ambonfunrun.com/
 linkCode: https://www.instagram.com/p/CsBBHTardh9/
 ---
diff --git a/src/assets/Curriculum Vitae.pdf b/src/assets/Curriculum Vitae.pdf
index a9f4eea..909ffca 100644
Binary files a/src/assets/Curriculum Vitae.pdf and b/src/assets/Curriculum Vitae.pdf differ
diff --git a/src/assets/images/sunlight-landscape-forest-sunset-hill-nature-5912-wallhere.com.jpg b/src/assets/images/sunlight-landscape-forest-sunset-hill-nature-5912-wallhere.com.jpg
new file mode 100644
index 0000000..ffd1a7b
Binary files /dev/null and b/src/assets/images/sunlight-landscape-forest-sunset-hill-nature-5912-wallhere.com.jpg differ
diff --git a/src/assets/js/blog.js b/src/assets/js/blog.js
index 102fa2d..038836e 100644
--- a/src/assets/js/blog.js
+++ b/src/assets/js/blog.js
@@ -1,2 +1,271 @@
+const keyboardSymbols = {
+    CTRL: '⌃',
+    CONTROL: '⌃',
+    SHIFT: '⇧',
+    ALT: '⎇',
+    META: '⌘',
+    ENTER: '⏎',
+    ESC: '⎋',
+    TAB: '⇥',
+    BACKSPACE: '⌫',
+    DELETE: '⌦',
+    ARROWUP: '↑',
+    ARROWDOWN: '↓',
+    ARROWLEFT: '←',
+    ARROWRIGHT: '→',
+    PAGEUP: '⇞',
+    PAGEDOWN: '⇟',
+    HOME: '↖',
+    END: '↘',
+    SPACE: '␣'
+}
+
+document.querySelectorAll('kbd').forEach(kbd => {
+    let gotSymbol = false
+    const originalText = kbd.innerHTML
+    const text = originalText.split(" ")
+    // console.log(text)
+    const newText = text.map(text => {
+        text = text.trim()
+        if (keyboardSymbols[text.toUpperCase()]) {
+            text = keyboardSymbols[text.toUpperCase()]
+            gotSymbol = true
+        }
+        return text
+    })
+    if (!gotSymbol) return kbd.innerHTML = originalText
+    kbd.innerHTML = newText.join(" ")
+    kbd.setAttribute('aria-label', `Keyboard shortcut: ${originalText}`)
+})
+
+const getCodeType = pre => {
+    if (!pre.firstChild && !pre.firstChild.classList) return null
+    return Array.from(pre.firstChild.classList).find(cls => cls.startsWith('language-'))
+}
+
+const createToolsContainer = (language, codeContent) => {
+    const toolsContainer = document.createElement('div')
+    const pre = codeContent?.parentElement
+    const parentOfPre = pre?.parentElement
+    let expandButton = null
+    let ariaLabel = pre?.getAttribute('aria-label') || 'Code block'
+
+    const codeTypeDiv = createTypeDiv(language)
+    const copyButton = createCopyButton(codeContent)
+    if (parentOfPre.nodeName.toLowerCase() !== "blockquote") {
+        expandButton = createExpandButton(toolsContainer)
+    }
+
+    toolsContainer.className = 'tools-container'
+    ariaLabel += `, ${copyButton.getAttribute('aria-label')}`
+
+    toolsContainer.appendChild(codeTypeDiv)
+    toolsContainer.appendChild(copyButton)
+    if (expandButton) {
+        toolsContainer.appendChild(expandButton)
+        ariaLabel += `, ${expandButton.getAttribute('aria-label')}`
+    }
+
+    pre.setAttribute('aria-label', ariaLabel)
+    return toolsContainer
+}
+
+const createExpandablePre = (pre) => {
+    pre.className = 'expandable'
+    pre.setAttribute('tabindex', '0')
+    pre.setAttribute('role', 'region')
+    pre.addEventListener('keydown', (event) => {
+        const expandOption = pre.querySelector('#expand-option')
+        if (event.key === 'Enter') {
+            if (!expandOption) return
+            if (event.target.id === 'copy-option') return
+            event.currentTarget.classList.toggle('expanded')
+            pre.querySelector('#expand-option').firstChild.innerText =
+                pre.classList.contains('expanded') ? 'Collapse' : 'Expand'
+        }
+
+        if (event.key === 'c' && event.ctrlKey) {
+            const copyButton = pre.querySelector('#copy-option')
+            if (copyButton) copyButton.click()
+        }
+    })
+    return pre
+}
+
+const createExpandButton = (container) => {
+    const expandButton = createInteractiveButton({
+        text: 'Expand',
+        id: 'expand-option',
+        label: 'Press Enter to expand code block or collapse it',
+        defaultState: false,
+    })
+    const shortcut = createKeyboardShortcut({
+        keyCode: 'Enter',
+    })
+
+    expandButton.addEventListener('click', () => {
+        if (!container.parentElement.classList.contains('expanded')) {
+            container.parentElement.classList.add('expanded')
+            expandButton.firstChild.innerText = 'Collapse'
+            expandButton.setAttribute('aria-pressed', 'true')
+        } else {
+            container.parentElement.classList.remove('expanded')
+            expandButton.firstChild.innerText = 'Expand'
+            expandButton.setAttribute('aria-pressed', 'false')
+        }
+    })
+
+    expandButton.addEventListener('keydown', (event) => {
+        if (event.key === 'Enter') {
+            event.currentTarget.click()
+        }
+    })
+
+    expandButton.appendChild(shortcut)
+
+    return expandButton
+}
+
+const createTypeDiv = language => {
+    const typeDiv = document.createElement('div')
+    typeDiv.className = 'code-type'
+    typeDiv.innerText = language || 'Code'
+    return typeDiv
+}
+
+const createCopyButton = codeContent => {
+    const shortcut = createKeyboardShortcut({
+        keyCode: 'c',
+        keyModifier: 'Ctrl'
+    })
+    const copyButton = createInteractiveButton({
+        text: 'Copy',
+        id: 'copy-option',
+        label: 'Press Control + C to copy code to clipboard',
+        defaultState: false,
+    })
+
+    copyButton.addEventListener('click', () => {
+        navigator.clipboard.writeText(codeContent.textContent)
+            .then(() => {
+                copyButton.firstChild.innerText = 'Copied!'
+                setTimeout(() => {
+                    copyButton.firstChild.innerText = 'Copy'
+                }, 2000)
+            })
+            .catch(err => {
+                console.error('Failed to copy text: ', err)
+                copyButton.firstChild.innerText = 'Error'
+            })
+    })
+    copyButton.addEventListener('keydown', (event) => {
+        if (event.key === 'Enter') {
+            copyButton.click()
+        }
+    })
+
+    copyButton.appendChild(shortcut)
+
+    return copyButton
+}
+
+const createKeyboardShortcut = ({ keyCode, keyModifier }) => {
+    const shortcut = document.createElement('kbd')
+    const keyCodeElement = document.createElement('span')
+    let keyModifierElement
+
+    switch (keyModifier) {
+        case 'Ctrl':
+            keyModifierElement = createKeyboardModifier({
+                keyboardSymbol: getKeyboardCode("Ctrl"),
+                keyboardModifier: 'Control'
+            })
+            break;
+        case 'Shift':
+            keyModifierElement = createKeyboardModifier({
+                keyboardSymbol: getKeyboardCode("Shift"),
+                keyboardModifier: 'Shift'
+            })
+            break;
+    }
+
+    keyCodeElement.className = 'key-code'
+    keyCodeElement.innerText = getKeyboardCode(keyCode)
+
+    shortcut.className = 'keyboard-shortcut'
+    if (keyModifier) shortcut.appendChild(keyModifierElement)
+    shortcut.appendChild(keyCodeElement)
+    return shortcut
+}
+
+const getKeyboardCode = (text) => {
+    return keyboardSymbols[text.toUpperCase()] || text
+}
+
+const createKeyboardModifier = ({ keyboardSymbol, keyboardModifier }) => {
+    const keyModifierElement = document.createElement('span')
+    const keyModifierText = document.createElement('span')
+    const keyModifierSymbol = document.createElement('span')
+
+    keyModifierElement.className = 'key-modifier'
+
+    keyModifierText.innerText = keyboardModifier ?? 'Control'
+    keyModifierText.className = 'sr-only'
+
+    keyModifierSymbol.innerText = keyboardSymbol ?? '⌃'
+    keyModifierSymbol.ariaHidden = true
+
+    keyModifierElement.appendChild(keyModifierText)
+    keyModifierElement.appendChild(keyModifierSymbol)
+
+    return keyModifierElement
+}
+
+const createInteractiveButton = ({ text, id, label, defaultState } = {}) => {
+    const button = document.createElement('button')
+    const buttonText = document.createElement('span')
+    buttonText.innerText = text || 'Button'
+    button.id = id || 'interactive-button'
+    button.setAttribute('aria-label', label || 'Interactive button')
+    button.setAttribute('aria-pressed', defaultState ? 'true' : 'false')
+    button.appendChild(buttonText)
+    return button
+}
+
+const enhancePreElement = pre => {
+    const codeType = getCodeType(pre)
+    if (codeType) pre.setAttribute('data-language', codeType.replace('language-', ''))
+
+    const codeContent = pre.querySelector('code')
+    const language = pre.getAttribute('data-language')
+    const toolsContainer = createToolsContainer(language, codeContent)
+
+    createExpandablePre(pre)
+    pre.insertBefore(toolsContainer, pre.firstChild)
+}
+
+const checkTableOfContents = () => {
+    const toc = document.getElementById("main").querySelector(".table-of-contents")
+    const skipToMain = document.querySelector('a[href="#main"]')
+    const navSkip = document.querySelector(".nav-skip")
+    if (!toc) return
+
+    let nextCandidate = toc?.nextElementSibling
+    nextCandidate.id = "pass-toc"
+
+    const skipLink = createSkipLink(nextCandidate.id)
+    navSkip.insertBefore(skipLink, skipToMain.nextSibling)
+}
+
+const createSkipLink = (id, text = "Skip pass the Table of Contents") => {
+    const skipLink = document.createElement('a')
+    skipLink.className = 'nav-skipto'
+    skipLink.href = `#${id}`
+    skipLink.innerText = text
+    return skipLink
+}
+
+document.querySelectorAll('pre').forEach(enhancePreElement)
+checkTableOfContents()
 Array.from(document.links).filter(link => link.hostname != window.location.hostname)
-    .forEach(link => link.target = '_blank')
\ No newline at end of file
+    .forEach(link => link.target = '_blank')
diff --git a/src/assets/js/main.js b/src/assets/js/main.js
index f891c8d..76e3801 100644
--- a/src/assets/js/main.js
+++ b/src/assets/js/main.js
@@ -1,224 +1,235 @@
-/**
- * Fetching data from the said url
- * @param {string} url
- */
-const dataLoader = async (url) => {
-  const response = await fetch(url)
-  const data = await response.json()
-  if (response) {
-    schedulerLoader(data.schedules)
-    schemeLoader(data.colorScheme)
-  }
-}
-
-dataLoader('/settings.json')
-
-const schemeLoader = (scheme) => {
-  localStorage.scheme = scheme
-}
-
-/**
- * Mobile hamburger menu logic
- */
-const mobileButtons = document.querySelectorAll('[data-mobile-menu-button]')
-const mobileMenuSection = document.querySelector('[data-mobile-menu-section]')
-const mobileMenuLinks = document.querySelectorAll('body>ul>li')
-const documentBody = document.body
-
-mobileButtons.forEach((button) => {
-  button.addEventListener('click', () => {
-    if (!mobileMenuSection.classList.contains('not-showing')) return setHidden()
-    return setShowing()
-  })
-})
-
-const setShowing = () => {
-  mobileButtons[0].setAttribute('aria-label', 'Close the mobile menu')
-  mobileMenuSection.classList.remove('not-showing')
-  setTimeout(() => documentBody.classList.add('no-scroll'), 300)
-}
-
-const setHidden = () => {
-  mobileButtons[0].setAttribute('aria-label', 'Open the mobile menu')
-  mobileMenuSection.classList.add('not-showing')
-  documentBody.classList.remove('no-scroll')
-}
-
-/**
- * Capitalize the word
- * @param {string} string
- */
-
-const toCapitalizeWord = (string) => {
-  return string[0].toUpperCase() + string.substring(1)
-}
-
-/**
- * Changing the theme based on user toggle
- */
-const themesButton = document.querySelector('[data-theme-button]')
-
-const themeHandler = () => {
-  if (document.documentElement.dataset.theme !== "dark") return setDark()
-  return setLight()
-}
-
-themesButton?.addEventListener('click', themeHandler)
-
-const setLight = () => {
-  document.documentElement.dataset.theme = "light"
-  themesButton.setAttribute('aria-label', 'Switch to dark mode')
-  localStorage.theme = 'light'
-}
-
-const setDark = () => {
-  document.documentElement.dataset.theme = "dark"
-  themesButton.setAttribute('aria-label', 'Switch to light mode')
-  localStorage.theme = 'dark'
-}
-
-/**
- * Printing details on console
- */
-
-console.log(
-  "%cEmptywork Console%c\nemptywork dot github dot io%c\n emptywork dot github dot io%c\nEnd of Console%c\n NOTE %c DON'T COPY ANY CODE INTO HERE",
-  'background-color:#cecece; margin: 0.15em; padding: 0.1em; border-radius: 0.2em; color:transparent; font-size:1rem',
-  'background-color:rebeccapurple; margin: 0.15em; padding: 0.1em; border-radius: 0.2em; color:transparent; font-size:1rem',
-  'font-size:1.2rem',
-  'background-color:#cecece; margin: 0.15em; padding: 0.1em; border-radius: 0.2em; color:transparent; font-size:1rem',
-  'background-color:rebeccapurple; margin: 0.15em; padding: 0.1em; border-radius: 0.2em; font-size:1rem',
-  'color: rebeccapurple; font-size: 1.1rem'
-)
-
-/**
- * Global Variables for Date related functions
- */
-const days = [
-  'Sunday',
-  'Monday',
-  'Tuesday',
-  'Wednesday',
-  'Thursday',
-  'Friday',
-  'Saturday',
-]
-
-const months = [
-  'January',
-  'Febuary',
-  'March',
-  'April',
-  'May',
-  'June',
-  'July',
-  'August',
-  'September',
-  'October',
-  'November',
-  'December',
-]
-
-const replaceStatus = document.querySelector('#activity')
-const replaceMonth = document.querySelector('#month')
-const replaceYear = document.querySelector('#year')
-
-const currentDate = new Date()
-const currentDay = currentDate.getDay()
-const currentMonth = currentDate.getMonth()
-const currentYear = currentDate.getFullYear()
-
-if (replaceMonth) replaceMonth.textContent = months[currentMonth]
-if (replaceYear) replaceYear.textContent = currentYear
-
-/**
- * Updating activity status based on array of schedule
- * @param {array} schedules
- */
-
-const schedulerLoader = (schedules = {}) => {
-  let time = new Date()
-  let currentTime = time.getUTCHours() + 9
-  if (currentTime > 23) currentTime -= 23
-
-  if (replaceStatus) replaceStatus.textContent = 'Idle'
-
-  setTimeout(() => {
-    for (let i = 0; i < schedules.length; i++) {
-      let { day, endHour, startHour } = schedules[i]
-      if (!replaceStatus) return
-
-      if (days[currentDay] === toCapitalizeWord(day)) {
-        if (currentTime > startHour && currentTime < endHour) {
-          replaceStatus.textContent = 'Studying'
-        }
-        break
-      }
-      replaceStatus.textContent = 'Idle'
-    }
-  }, 0)
-}
-
-// Injecting #main to main that doesn't have #main
-const mainElement =
-  document.querySelector('#main') ?? document.querySelector('.main')
-mainElement.id = 'main'
-
-/**
- * Preload
- */
-
-const preloadElement = document.querySelector('.preload')
-const delayElements = document.querySelectorAll('[data-delay]')
-
-delayElements?.forEach(
-  (el) => (el.style.transitionDelay = `${parseInt(el.dataset.delay) * 100}ms`)
-)
-
-const observer = new IntersectionObserver((entires) =>
-  entires.forEach((entry) => {
-    if (entry.isIntersecting)
-      return entry.target.classList.add('has-been-animated')
-    return entry.target.classList.remove('has-been-animated')
-  })
-)
-
-const toBeAnimateElements = document.querySelectorAll('[data-animation]')
-
-const removeElementAnimated = ({ timeout, targetElement }) => {
-  const timeoutDelay = timeout + timeout * 1.5
-  setTimeout(() => targetElement?.classList.add('hidden'), timeout)
-  setTimeout(() => targetElement?.classList.add('disabled'), timeoutDelay)
-  setTimeout(
-    () => toBeAnimateElements?.forEach((el) => observer.observe(el)),
-    timeout
-  )
-}
-
-const loadedDocumentBody = () => {
-  if (!documentBody.classList.contains('not-loaded')) return
-  removeElementAnimated({
-    targetElement: preloadElement,
-    timeout: 1000,
-  })
-  documentBody.classList.remove('not-loaded')
-}
-
-window.addEventListener('load', loadedDocumentBody, false)
-
-const makeExternalWarningForExternalLink = (parentElement) => {
-  const warningElement = document.createElement('span')
-  warningElement.classList.add('new-tab-warning')
-  warningElement.textContent = 'Open a new tab'
-  parentElement.appendChild(warningElement)
-}
-
-const makeA11yExternalLink = (externalLink) => {
-  const linkWarning = externalLink.querySelector('.new-tab-warning')
-  if (linkWarning) return
-  return makeExternalWarningForExternalLink(externalLink)
-}
-
-for (const externalLink of document.querySelectorAll('[target=_blank]')) {
-  makeA11yExternalLink(externalLink)
-}
+/**
+ * Fetching data from the said url
+ * @param {string} url
+ */
+const dataLoader = async (url) => {
+  const response = await fetch(url)
+  const data = await response.json()
+  if (response) {
+    schedulerLoader(data.schedules)
+    schemeLoader(data.colorScheme)
+  }
+}
+
+dataLoader('/settings.json')
+
+const schemeLoader = (scheme) => {
+  localStorage.scheme = scheme
+}
+
+/**
+ * Mobile hamburger menu logic
+ */
+const mobileButtons = document.querySelectorAll('[data-mobile-menu-button]')
+const mobileMenuSection = document.querySelector('[data-mobile-menu-section]')
+const mobileMenuLinks = document.querySelectorAll('body>ul>li')
+const documentBody = document.body
+
+mobileButtons.forEach((button) => {
+  button.addEventListener('click', () => {
+    if (!mobileMenuSection.classList.contains('not-showing')) return setHidden()
+    return setShowing()
+  })
+})
+
+const setShowing = () => {
+  mobileButtons[0].setAttribute('aria-label', 'Close the mobile menu')
+  mobileButtons[0].setAttribute('aria-expanded', 'true')
+  mobileMenuSection.setAttribute('aria-hidden', 'false')
+  mobileMenuSection.classList.remove('not-showing')
+  setTimeout(() => documentBody.classList.add('no-scroll'), 300)
+}
+
+const setHidden = () => {
+  mobileButtons[0].setAttribute('aria-label', 'Open the mobile menu')
+  mobileButtons[0].setAttribute('aria-expanded', 'false')
+  mobileMenuSection.setAttribute('aria-hidden', 'true')
+  mobileMenuSection.classList.add('not-showing')
+  documentBody.classList.remove('no-scroll')
+}
+
+/**
+ * Capitalize the word
+ * @param {string} string
+ */
+
+const toCapitalizeWord = (string) => {
+  return string[0].toUpperCase() + string.substring(1)
+}
+
+/**
+ * Changing the theme based on user toggle
+ */
+const themesButton = document.querySelector('[data-theme-button]')
+
+const themeHandler = () => {
+  if (document.documentElement.dataset.theme !== "dark") return setDark()
+  return setLight()
+}
+
+themesButton?.addEventListener('click', themeHandler)
+
+const setLight = () => {
+  document.documentElement.dataset.theme = "light"
+  themesButton.setAttribute('aria-label', 'Switch to dark mode')
+  localStorage.theme = 'light'
+}
+
+const setDark = () => {
+  document.documentElement.dataset.theme = "dark"
+  themesButton.setAttribute('aria-label', 'Switch to light mode')
+  localStorage.theme = 'dark'
+}
+
+/**
+ * Printing details on console
+ */
+
+console.log(
+  "%cEmptywork Console%c\nemptywork dot github dot io%c\n emptywork dot github dot io%c\nEnd of Console%c\n NOTE %c DON'T COPY ANY CODE INTO HERE",
+  'background-color:#cecece; margin: 0.15em; padding: 0.1em; border-radius: 0.2em; color:transparent; font-size:1rem',
+  'background-color:rebeccapurple; margin: 0.15em; padding: 0.1em; border-radius: 0.2em; color:transparent; font-size:1rem',
+  'font-size:1.2rem',
+  'background-color:#cecece; margin: 0.15em; padding: 0.1em; border-radius: 0.2em; color:transparent; font-size:1rem',
+  'background-color:rebeccapurple; margin: 0.15em; padding: 0.1em; border-radius: 0.2em; font-size:1rem',
+  'color: rebeccapurple; font-size: 1.1rem'
+)
+
+/**
+ * Global Variables for Date related functions
+ */
+const days = [
+  'Sunday',
+  'Monday',
+  'Tuesday',
+  'Wednesday',
+  'Thursday',
+  'Friday',
+  'Saturday',
+]
+
+const months = [
+  'January',
+  'Febuary',
+  'March',
+  'April',
+  'May',
+  'June',
+  'July',
+  'August',
+  'September',
+  'October',
+  'November',
+  'December',
+]
+
+const replaceStatus = document.querySelector('#activity')
+const replaceMonth = document.querySelector('#month')
+const replaceYear = document.querySelector('#year')
+
+const currentDate = new Date()
+const currentDay = currentDate.getDay()
+const currentMonth = currentDate.getMonth()
+const currentYear = currentDate.getFullYear()
+
+if (replaceMonth) replaceMonth.textContent = months[currentMonth]
+if (replaceYear) replaceYear.textContent = currentYear
+
+/**
+ * Updating activity status based on array of schedule
+ * @param {array} schedules
+ */
+
+const schedulerLoader = (schedules = {}) => {
+  let time = new Date()
+  let currentTime = time.getUTCHours() + 9
+  if (currentTime > 23) currentTime -= 23
+
+  if (replaceStatus) replaceStatus.textContent = 'Idle'
+
+  setTimeout(() => {
+    schedules.forEach(schedule => {
+      let { day, endHour, startHour } = schedule
+      if (!replaceStatus) return
+      if (days[currentDay] === toCapitalizeWord(day)) {
+        if (currentTime > startHour && currentTime < endHour) {
+          replaceStatus.textContent = 'Studying'
+        }
+        return
+      }
+      replaceStatus.textContent = 'Idle'
+    })
+  }, 0)
+}
+
+// Injecting #main to main that doesn't have #main
+const mainElement =
+  document.querySelector('#main') ?? document.querySelector('.main')
+mainElement.id = 'main'
+
+/**
+ * Preload
+ */
+
+const preloadElement = document.querySelector('.preload')
+const delayElements = document.querySelectorAll('[data-delay]')
+
+delayElements?.forEach(
+  (el) => {
+    let delayModifier = 0
+    const parentElement = el.parentElement
+    const getAmountOfDelayElems = parentElement.querySelectorAll('[data-delay]').length
+    if (!parentElement.hasAttribute("data-delay-parent")) parentElement.setAttribute('data-delay-parent', true)
+    delayModifier = getAmountOfDelayElems
+
+    el.setAttribute("data-transition-delay", `${parseInt(el.dataset.delay) * 50 * (delayModifier / 2)}ms`)
+  }
+)
+
+const observer = new IntersectionObserver((entires) =>
+  entires.forEach((entry) => {
+    if (entry.isIntersecting)
+      return entry.target.setAttribute('data-has-been-animated', true)
+    return entry.target.removeAttribute('data-has-been-animated')
+  })
+)
+
+const toBeAnimateElements = document.querySelectorAll('[data-animation]')
+
+const removeElementAnimated = ({ timeout, targetElement }) => {
+  const timeoutDelay = timeout + timeout * 1.5
+  setTimeout(() => targetElement?.classList.add('hidden'), timeout)
+  setTimeout(() => targetElement?.classList.add('disabled'), timeoutDelay)
+  setTimeout(
+    () => toBeAnimateElements?.forEach((el) => observer.observe(el)),
+    timeout
+  )
+}
+
+const loadedDocumentBody = () => {
+  if (!documentBody.classList.contains('not-loaded')) return
+  removeElementAnimated({
+    targetElement: preloadElement,
+    timeout: 1000,
+  })
+  documentBody.classList.remove('not-loaded')
+}
+
+window.addEventListener('load', loadedDocumentBody, false)
+
+const makeExternalWarningForExternalLink = (parentElement) => {
+  const warningElement = document.createElement('span')
+  warningElement.classList.add('new-tab-warning')
+  warningElement.textContent = 'Open a new tab'
+  parentElement.appendChild(warningElement)
+}
+
+const makeA11yExternalLink = (externalLink) => {
+  const linkWarning = externalLink.querySelector('.new-tab-warning')
+  if (linkWarning) return
+  return makeExternalWarningForExternalLink(externalLink)
+}
+
+for (const externalLink of document.querySelectorAll('[target=_blank]')) {
+  makeA11yExternalLink(externalLink)
+}
diff --git a/src/assets/scss/abstracts/_typography.scss b/src/assets/scss/abstracts/_typography.scss
new file mode 100644
index 0000000..3133e47
--- /dev/null
+++ b/src/assets/scss/abstracts/_typography.scss
@@ -0,0 +1,7 @@
+.font-montserrat {
+    font-family: 'Montserrat', sans-serif;
+}
+
+.font-monospace {
+    font-family: monospace, "Trebuchet MS", "Lucida Sans Unicode", "Lucida Grande", "Lucida Sans", Arial, sans-serif;
+}
\ No newline at end of file
diff --git a/src/assets/scss/abstracts/_vars.scss b/src/assets/scss/abstracts/_vars.scss
index 9c240f6..19740bb 100644
--- a/src/assets/scss/abstracts/_vars.scss
+++ b/src/assets/scss/abstracts/_vars.scss
@@ -29,7 +29,7 @@ html:root {
 
   --bx-shadow-two-side: 0 0.3125rem 0.625rem hsla(var(--_hs) 0%, 0.2),
     -0.3125rem -0.3125rem 0.625rem hsla(var(--_hs) 100%, 0.8);
-  --table-header: hsl(var(--_hs) 30%);
+  --table-header: var(--clr-accent-light);
 
   &[data-color-scheme=sunglow] {
     --_h: 34;
@@ -53,6 +53,7 @@ html:root {
     --_h: 140;
     --_s: 10%;
     --clr-complementary: hsl(20, 50%, 40%);
+    --clr-href: hsl(var(--_h), 40%, 50%);
   }
 
   &[data-theme=dark] {
@@ -69,6 +70,5 @@ html:root {
 
     --bx-shadow-two-side: 0 0.3125rem 0.625rem rgb(0 0 0 / 20%),
       -0.3125rem -0.3125rem 0.625rem rgb(58 58 58 / 63%);
-    --table-header: var(--clr-accent-light);
   }
 }
\ No newline at end of file
diff --git a/src/assets/scss/base/_global.scss b/src/assets/scss/base/_global.scss
index 4fce297..d5abc99 100644
--- a/src/assets/scss/base/_global.scss
+++ b/src/assets/scss/base/_global.scss
@@ -1,4 +1,5 @@
 @use "../abstracts/_mixin" as mix;
+@use "../abstracts/typography";
 
 html {
   scroll-behavior: smooth;
@@ -44,11 +45,12 @@ html:root {
 }
 
 body {
+  @extend .font-montserrat;
+
   display: flex;
   flex-direction: column;
   min-height: 100vh;
   background-color: var(--clr-background-900);
-  font-family: 'Montserrat', sans-serif;
   color: var(--clr-foreground);
   line-height: 1.6;
   overflow-x: hidden;
@@ -155,7 +157,7 @@ li {
 
 .sr-only {
   border: 0;
-  clip: rect(0 0 0 0);
+  clip-path: rect(0 0 0 0);
   height: 0.0625rem;
   margin: -0.0625rem;
   overflow: hidden;
diff --git a/src/assets/scss/components/_animation.scss b/src/assets/scss/components/_animation.scss
index 5b19ab2..78ac97f 100644
--- a/src/assets/scss/components/_animation.scss
+++ b/src/assets/scss/components/_animation.scss
@@ -1,6 +1,7 @@
 [data-animation] {
   opacity: 0;
   transition: translate var(--_translate, 1s) ease-in-out, scale var(--_scale, 1s) ease-in-out, rotate var(--_rotate, 1s) ease-in-out, opacity var(--_opacity, 1s) ease-in-out;
+  transition-delay: attr(data-transition-delay, 0ms);
 }
 
 [data-animation='fade-in'] {
@@ -31,7 +32,7 @@
   }
 }
 
-.has-been-animated {
+.has-been-animated, [data-has-been-animated] {
   opacity: unset;
   scale: unset;
   rotate: unset;
diff --git a/src/assets/scss/components/_card.scss b/src/assets/scss/components/_card.scss
index e7ab333..ad70b05 100644
--- a/src/assets/scss/components/_card.scss
+++ b/src/assets/scss/components/_card.scss
@@ -38,6 +38,13 @@
     border-radius: 0.3rem;
     overflow: hidden;
 
+    picture {
+      height: 100%;
+      object-fit: cover;
+      object-position: center;
+      border-radius: 0.3rem;
+    }
+
     &::after {
       content: '';
       position: absolute;
diff --git a/src/assets/scss/components/_featured.scss b/src/assets/scss/components/_featured.scss
index 34b5b78..52b4038 100644
--- a/src/assets/scss/components/_featured.scss
+++ b/src/assets/scss/components/_featured.scss
@@ -37,6 +37,7 @@
     background-color: var(--clr-variant);
     flex: 1 auto;
     position: relative;
+    width: fit-content;
     justify-content: center;
     align-items: center;
 
@@ -44,11 +45,18 @@
       min-height: 10em;
     }
 
-    img {
-      all: unset;
+    picture {
       overflow: clip !important;
       width: min(100%, 26.1875rem);
       aspect-ratio: 1/1;
+
+      img {
+        width: 100%;
+        height: 100%;
+        object-fit: cover;
+        object-position: center;
+        border-radius: 0.3em;
+      }
     }
 
     #svg {
diff --git a/src/assets/scss/components/_hero.scss b/src/assets/scss/components/_hero.scss
index d124865..dcea8b1 100644
--- a/src/assets/scss/components/_hero.scss
+++ b/src/assets/scss/components/_hero.scss
@@ -17,32 +17,32 @@
   }
 
   &-decoration {
-    --width: 95vmin;
-    --increase: 1.2;
-    --duration: 12s;
-    --delay: calc((var(--duration) * 0.1));
+    --_width: 95vmin;
+    --_increase: 1.2;
+    --_duration: 12s;
+    --_delay: calc((var(--_duration) * 0.1));
     position: absolute;
-    right: calc(var(--width) / -2);
-    bottom: calc(var(--width) / -2);
+    right: calc(var(--_width) / -2);
+    bottom: calc(var(--_width) / -2);
     z-index: -1;
-    width: var(--width);
+    width: var(--_width);
     aspect-ratio: 1/1;
     border-radius: 50%;
     background-color: var(--clr-accent);
-    animation: twiching var(--duration) var(--delay) infinite;
+    animation: twiching var(--_duration) var(--_delay) infinite;
   }
 
   @keyframes twiching {
     50% {
-      width: calc(var(--width) * var(--increase));
+      width: calc(var(--_width) * var(--_increase));
     }
   }
 
   &-bigger {
-    --width: 120vmin;
-    --increase: 2;
-    --duration: 10s;
-    --delay: calc((var(--duration) * 0.2));
+    --_width: 120vmin;
+    --_increase: 2;
+    --_duration: 10s;
+    --_delay: calc((var(--_duration) * 0.2));
     background-color: transparent;
     border: max(0.5vmin, 0.125rem) solid var(--clr-accent);
   }
diff --git a/src/assets/scss/components/_nav.scss b/src/assets/scss/components/_nav.scss
index 5d3b4ae..73cf2e6 100644
--- a/src/assets/scss/components/_nav.scss
+++ b/src/assets/scss/components/_nav.scss
@@ -6,10 +6,22 @@
   flex-shrink: 0;
   position: sticky;
   top: 0;
-  padding: 0.8rem;
   z-index: 20;
 
+  &-skip {
+    position: relative;
+    width: 100%;
+    height: 0;
+    transition: height 200ms ease;
+    justify-content: center;
+
+    &:has(:focus) {
+      height: calc(1em + 0.6em);
+    }
+  }
+
   &-container {
+    padding: 0.8rem;
     width: 100%;
     max-width: 64rem;
     margin: 0 auto;
@@ -29,17 +41,22 @@
   &-skipto {
     background-color: var(--clr-accent);
     color: var(--clr-white);
-    display: flex;
     padding: 0 0.3rem;
-    align-self: center;
-    scale: 0 1;
-    order: 2;
-    transform-origin: left;
-    transition: scale 200ms ease;
+    position: absolute !important;
+    left: 0;
+    right: 0;
+    top: 0;
+    width: 100%;
+    height: max-content;
+    text-align: center;
+    opacity: 0;
+    transition: opacity 200ms ease;
+    pointer-events: none;
 
     &:focus {
+      pointer-events: unset;
+      opacity: 1;
       color: var(--clr-white);
-      scale: 1;
     }
   }
 
diff --git a/src/assets/scss/components/_note.scss b/src/assets/scss/components/_note.scss
index 7400033..0ad4982 100644
--- a/src/assets/scss/components/_note.scss
+++ b/src/assets/scss/components/_note.scss
@@ -1,4 +1,3 @@
-
 .note {
   color: var(--clr-white);
   display: flex;
diff --git a/src/assets/scss/components/_partof.scss b/src/assets/scss/components/_partof.scss
index 0946bb6..4e559d1 100644
--- a/src/assets/scss/components/_partof.scss
+++ b/src/assets/scss/components/_partof.scss
@@ -34,7 +34,7 @@
     padding: 3em 2em 2em 2em;
     width: 100%;
 
-    h2 {
+    .header-title {
       text-transform: uppercase;
       letter-spacing: 0.1em;
 
@@ -112,11 +112,9 @@
             border: none;
             color: var(--clr-white);
             background: var(--clr-accent-dark);
-            background-image: linear-gradient(
-              -90deg,
-              var(--clr-accent),
-              var(--clr-accent-dark)
-            );
+            background-image: linear-gradient(-90deg,
+                var(--clr-accent),
+                var(--clr-accent-dark));
             background-size: 400%;
             animation: positionanimate 1s infinite alternate;
           }
@@ -164,7 +162,8 @@
   0% {
     background-position: left;
   }
+
   100% {
     background-position: right;
   }
-}
+}
\ No newline at end of file
diff --git a/src/assets/scss/components/_post.scss b/src/assets/scss/components/_post.scss
index ca5fac1..563c2ae 100644
--- a/src/assets/scss/components/_post.scss
+++ b/src/assets/scss/components/_post.scss
@@ -34,6 +34,7 @@
         color: var(--clr-white);
         margin-bottom: 1em;
         width: fit-content;
+        height: fit-content;
         flex-wrap: wrap;
         gap: .5em;
         display: flex;
diff --git a/src/assets/scss/components/_preload.scss b/src/assets/scss/components/_preload.scss
index 485b280..ecbbc40 100644
--- a/src/assets/scss/components/_preload.scss
+++ b/src/assets/scss/components/_preload.scss
@@ -17,7 +17,8 @@
 
   svg {
     rotate: 0deg;
-    max-width: 10em;
+    width: min(10em, 100%);
+    height: min(10em, 100%);
     animation: preload 2s infinite;
   }
 
@@ -52,4 +53,4 @@
   100% {
     rotate: 0deg;
   }
-}
+}
\ No newline at end of file
diff --git a/src/assets/scss/components/_prototype.scss b/src/assets/scss/components/_prototype.scss
index 43da82b..1d2907a 100644
--- a/src/assets/scss/components/_prototype.scss
+++ b/src/assets/scss/components/_prototype.scss
@@ -156,7 +156,7 @@
       background-color: var(--_item-color);
       background-image: linear-gradient(90deg, var(--_item-color), var(--clr-accent) var(--_range));
       border-radius: 0.3rem;
-      
+
       &:is(.error, .active) {
         --_range: 400%;
         color: var(--clr-white);
@@ -165,18 +165,16 @@
       &.error {
         --_item-color: hsl(0, 70%, 43%);
       }
-      
+
       &.active {
         --_item-color: hsl(120, 70%, 26%);
       }
     }
 
     .status {
-      background-image: linear-gradient(
-        -90deg,
-        var(--clr-accent),
-        var(--clr-accent-dark)
-      );
+      background-image: linear-gradient(-90deg,
+          var(--clr-accent),
+          var(--clr-accent-dark));
       padding: 0 0.7rem;
       display: flex;
       align-items: center;
@@ -224,14 +222,18 @@
       scrollbar-width: none;
       position: relative;
 
-      &::-webkit-scrollbar {
+      &::-webkit-scrollbar,
+      &::-webkit-scrollbar:vertical {
         width: 0;
       }
     }
 
     pre {
       overflow: scroll;
-      &::-webkit-scrollbar {
+      scrollbar-width: none;
+
+      &::-webkit-scrollbar,
+      &::-webkit-scrollbar:vertical {
         width: 0;
       }
     }
@@ -264,4 +266,4 @@
       color: var(--clr-background);
     }
   }
-}
+}
\ No newline at end of file
diff --git a/src/assets/scss/components/_title.scss b/src/assets/scss/components/_title.scss
index 193bfd2..5173f5d 100644
--- a/src/assets/scss/components/_title.scss
+++ b/src/assets/scss/components/_title.scss
@@ -30,13 +30,13 @@
         }
 
         &:hover {
-          .note.has-been-animated {
+          .note:is([data-has-been-animated], .has-been-animated) {
             rotate: 0deg;
             scale: 1.1;
           }
         }
 
-        .note.has-been-animated {
+        .note:is([data-has-been-animated], .has-been-animated) {
           rotate: 3deg;
           --_scale: 300ms;
           --_rotate: 700ms;
diff --git a/src/assets/scss/highlight.scss b/src/assets/scss/highlight.scss
new file mode 100644
index 0000000..b60866d
--- /dev/null
+++ b/src/assets/scss/highlight.scss
@@ -0,0 +1,140 @@
+pre code.hljs {
+    display: block;
+    overflow-x: auto;
+    padding: 1em
+}
+
+code.hljs {
+    padding: 3px 5px
+}
+
+/*!
+  Theme: Tokyo-night-Dark
+  origin: https://github.com/enkia/tokyo-night-vscode-theme
+  Description: Original highlight.js style
+  Author: (c) Henri Vandersleyen <hvandersleyen@gmail.com>
+  License: see project LICENSE
+  Touched: 2022
+*/
+.hljs-comment,
+.hljs-meta {
+    color: #565f89
+}
+
+.hljs-deletion,
+.hljs-doctag,
+.hljs-regexp,
+.hljs-selector-attr,
+.hljs-selector-class,
+.hljs-selector-id,
+.hljs-selector-pseudo,
+.hljs-tag,
+.hljs-template-tag,
+.hljs-variable.language_ {
+    color: #f7768e
+}
+
+.hljs-link,
+.hljs-literal,
+.hljs-number,
+.hljs-params,
+.hljs-template-variable,
+.hljs-type,
+.hljs-variable {
+    color: #ff9e64
+}
+
+.hljs-attribute,
+.hljs-built_in {
+    color: #e0af68
+}
+
+.hljs-keyword,
+.hljs-property,
+.hljs-subst,
+.hljs-title,
+.hljs-title.class_,
+.hljs-title.class_.inherited__,
+.hljs-title.function_ {
+    color: #7dcfff
+}
+
+.hljs-selector-tag {
+    color: #73daca
+}
+
+.hljs-addition,
+.hljs-bullet,
+.hljs-quote,
+.hljs-string,
+.hljs-symbol {
+    color: #9ece6a
+}
+
+.hljs-code,
+.hljs-formula,
+.hljs-section {
+    color: #7aa2f7
+}
+
+.hljs-attr,
+.hljs-char.escape_,
+.hljs-keyword,
+.hljs-name,
+.hljs-operator {
+    color: #bb9af7
+}
+
+.hljs-punctuation {
+    color: #c0caf5
+}
+
+.hljs {
+    background: #1a1b26;
+    color: #9aa5ce
+}
+
+.hljs-emphasis {
+    font-style: italic
+}
+
+.hljs-strong {
+    font-weight: 700
+}
+
+/*!
+  Author: (c) EmptyWork <contact@emptywork.my.id>
+  Touched: 2025
+
+  Additional styling for diff support
+*/
+
+.hljs-line,
+.hljs-addition,
+.hljs-deletion {
+    --_distance: 1em;
+    --_border: 0em;
+    --_offset: 0.61875em;
+    display: inline-block;
+    width: calc(100% + calc(var(--_distance) * 2));
+    margin-inline: calc(var(--_distance) * -1);
+    padding-inline: 1em;
+    padding-left: calc(0.5em - var(--_border) + var(--_offset));
+}
+
+.hljs-addition,
+.hljs-deletion {
+    --_border: 0.25em;
+    --_offset: 0em;
+    --_color: 349, 89%, 72%;
+    background-color: hsl(var(--_color), 0.2);
+    border-left: var(--_border) solid hsl(var(--_color), 0.2);
+}
+
+.hljs-addition {
+    --_color: 89, 51%, 61%;
+}
+
+.hljs-deletion {
+    --_color: 349, 89%, 72%;
+}
\ No newline at end of file
diff --git a/src/assets/scss/layouts/_footer.scss b/src/assets/scss/layouts/_footer.scss
index d5107a1..c5df4bd 100644
--- a/src/assets/scss/layouts/_footer.scss
+++ b/src/assets/scss/layouts/_footer.scss
@@ -69,4 +69,4 @@
       flex-direction: row;
     }
   }
-}
+}
\ No newline at end of file
diff --git a/src/assets/scss/layouts/_header.scss b/src/assets/scss/layouts/_header.scss
index d86013c..999e15b 100644
--- a/src/assets/scss/layouts/_header.scss
+++ b/src/assets/scss/layouts/_header.scss
@@ -18,4 +18,4 @@
       height: auto;
     }
   }
-}
+}
\ No newline at end of file
diff --git a/src/assets/scss/pages/_article.scss b/src/assets/scss/pages/_article.scss
index 4f8f154..c924c57 100644
--- a/src/assets/scss/pages/_article.scss
+++ b/src/assets/scss/pages/_article.scss
@@ -1,7 +1,12 @@
 @use "../abstracts/mixin" as mix;
+@use "../abstracts/typography";
 
 .article {
   --_l: 20%;
+  --_bh: calc(var(--_h) - 8);
+  --_background: hsla(var(--_h), 20%, 20%, 0.5);
+  --_blockquote-color: hsla(var(--_h), 90%, 20%, 0.8);
+  --_drop-shadow-color: hsla(var(--_bh), 71%, 22%, 40%);
   --_article-color: hsla(var(--_hs), var(--_l), 0.5);
   -webkit-text-size-adjust: 100%;
   -ms-text-size-adjust: 100%;
@@ -11,6 +16,7 @@
   margin: auto;
 
   main {
+    margin-top: 1em;
     position: relative;
 
     .table-of-contents {
@@ -48,6 +54,10 @@
     }
   }
 
+  pre+pre {
+    margin-top: 0.5em;
+  }
+
   span {
 
     a:hover,
@@ -149,10 +159,63 @@
   }
 
   blockquote {
-    color: var(--clr-foreground-900);
+    padding: .5em;
+    background-color: var(--_blockquote-color);
+    color: var(--clr-white);
     margin: 0;
     padding-left: 2em;
     border-left: 0.5em var(--clr-accent) solid;
+    border-radius: 0.5em;
+    box-shadow: 0px 3px 10px 0px var(--_drop-shadow-color);
+
+    .tools-container {
+      kbd {
+        color: var(--clr-white);
+        background-color: var(--clr-accent);
+      }
+
+      #expand-option {
+        display: none;
+      }
+    }
+
+    pre,
+    code,
+    kbd,
+    samp {
+      display: inline-block;
+      align-items: center;
+      background-color: hsl(var(--_hs) 10%);
+      color: var(--clr-white);
+      padding: 0.2em 0.4em;
+      border-radius: 0.3em;
+    }
+
+    pre {
+      @include mix.breakpoint-down("small") {
+        &::after {
+          content: "";
+          position: absolute;
+          right: 0;
+          top: 0;
+          bottom: 0;
+          background: linear-gradient(90deg, transparent, hsl(var(--_hs) 6%));
+          width: 2em;
+        }
+      }
+    }
+
+    a {
+      --_normal-color: var(--clr-accent-light);
+      --_hover-color: var(--clr-white);
+      color: var(--_normal-color);
+      text-decoration-color: var(--_normal-color);
+
+      &:hover {
+        color: var(--_hover-color);
+        text-decoration-color: var(--_hover-color);
+      }
+    }
   }
 
   hr {
@@ -169,24 +232,117 @@
   code,
   kbd,
   samp {
-    padding: 0 0.3em;
-    font-family: monospace, "Trebuchet MS", "Lucida Sans Unicode", "Lucida Grande", "Lucida Sans", Arial, sans-serif;
-    // font-size: 0.8rem;
+    @extend .font-monospace;
+    position: relative;
     line-height: 1.4;
   }
 
+  kbd {
+    display: inline-block;
+    align-items: center;
+    width: max-content;
+    font-size: 0.8rem;
+    color: var(--clr-white);
+    background-color: var(--clr-accent);
+    padding: 0.2em 0.4em;
+    border-radius: 0.3em;
+  }
+
   pre {
-    border: 0.1rem solid var(--_article-color);
-    background-color: hsl(0, 3%, 12%);
+    border: 0.1rem solid var(--_background);
+    background-color: hsl(var(--_hs) 10%);
     border-radius: 0.5rem;
     padding: 1rem;
     white-space: pre;
     white-space: pre-wrap;
     word-wrap: break-word;
+    overflow: hidden;
+    width: min(80ch, 100%);
+    transition: width 0.3s ease-in-out;
+
+    &.expanded {
+      width: 100%;
+    }
+
+    .tools-container {
+      display: flex;
+      position: absolute;
+      z-index: 10;
+      padding-left: 0.5em;
+      opacity: 0;
+      top: 0;
+      backdrop-filter: blur(0.125rem);
+      right: 0;
+      margin-top: -2rem;
+      flex-direction: row;
+      align-items: center;
+      background-color: var(--_background);
+      color: var(--clr-white);
+      transition: margin-top 0.2s ease, opacity 0.3s ease;
+
+      .code-type {
+        margin-right: 0.5em;
+      }
+
+      .keyboard-shortcut {
+        display: flex;
+        gap: 0.2em;
+      }
+
+      @include mix.breakpoint-down('medium') {
+        #expand-option {
+          display: none;
+        }
+      }
+
+      button {
+        gap: 0.5em;
+        align-items: center;
+        display: flex;
+        padding: 0.5em;
+        background: transparent;
+        border: none;
+        cursor: pointer;
+        background-color: var(--_background);
+        color: var(--clr-accent-light);
+
+        &:is(:hover, :focus, :active) {
+          color: var(--clr-accent);
+        }
+      }
+    }
+
+    &:hover {
+      outline: 0.125rem solid var(--clr-accent-dark);
+    }
+
+    &:hover,
+    &:focus,
+    &:has(:hover, :focus) {
+      .tools-container {
+        margin-top: 0;
+        opacity: 1;
+
+        @starting-style {
+          opacity: 0;
+          margin-top: -2rem;
+        }
+      }
+    }
 
     code {
+      color: var(--clr-white);
       box-shadow: none;
-      background-color: transparent;
+      width: 100%;
+
+      .hljs-comment,
+      .hljs-meta {
+        color: hsl(230, 100%, 89%, 0.9)
+      }
+
+      @include mix.breakpoint-down('small') {
+        overflow-x: auto;
+      }
     }
   }
 
@@ -267,7 +423,8 @@
     overflow-x: scroll;
     border-spacing: 0;
     width: 100%;
-    background-color: var(--clr-background);
+    background-color: hsl(var(--_hs) 10%);
+    color: var(--clr-white);
     border-radius: 0.5rem;
     overflow: hidden;
 
diff --git a/src/blog.njk b/src/blog.njk
index 32d9c29..067a2ef 100644
--- a/src/blog.njk
+++ b/src/blog.njk
@@ -1,150 +1,149 @@
----
-title : 'Recent Articles - Blog | EmptyWork'
-description : "List of all articles that was written by me, its mostly contain topics about Accessibility, PHP, HTML, CSS and Fullstack development"
-layout: 'layouts/secondary.njk'
-style: 'blog.css'
----
-
-{% set posts = [] %}
-{% set recentPosts = [] %}
-{% for post in collections.post | reverse %}
-  {% if not post.data.draft %}
-    {% set postDate = {
-          year: post.data.date | postYear,
-          fullDate: post.data.date
-        } %}
-    {% set _ = posts.push({
-          title: post.data.title,
-          url: post.url,
-          date: postDate,
-          desc: post.data.description,
-          author: post.data.author,
-          slug: post.fileSlug
-        }) %}
-    {% set _ = recentPosts.push({
-          title: post.data.title,
-          description: post.data.description,
-          url: post.url,
-          slug: post.fileSlug,
-          author: post.data.author,
-          date: post.data.date,
-          image: post.data.image
-        }) %}
-  {% endif %}
-  {% if isDevelopment and post.data.draft %}
-    {% set postDate = {
-          year: post.data.date | postYear,
-          fullDate: post.data.date
-        } %}
-    {% set _ = posts.push({
-          title: post.data.title,
-          url: post.url,
-          date: postDate,
-          desc: post.data.description,
-          author: post.data.author,
-          slug: post.fileSlug
-        }) %}
-    {% set _ = recentPosts.push({
-          title: post.data.title,
-          description: post.data.description,
-          url: post.url,
-          slug: post.fileSlug,
-          author: post.data.author,
-          date: post.data.date,
-          image: post.data.image
-        }) %}
-  {% endif %}
-{% endfor %}
-{% if recentPosts | length > 3 %}
-  {% set recentPosts = recentPosts | sliceRecent %}
-{% endif %}
-<main id="main" class="main  blog">
-  <section aria-labelledby="article" class="articles">
-    <div class="main-container">
-      <header class="section-header" data-animation="fade-in">
-        <span>
-          <a class="breadcrumb" href="/">Home</a> ›
-          <a class="breadcrumb" aria-current="page" href="/blog">Blog</a>
-        </span>
-        <div class="header-title">
-          <a class="header-title__link" href="#article">
-            <span aria-hidden="true">#</span>
-            <span class="sr-only">Link to heading "recent articles"</span>
-          </a>
-          <h1 id="article">Articles</h1>
-        </div>
-      </header>
-      <section aria-label="Recent Articles">
-        <ul class="cards cards-horizontal{% if lengthRecentPosts == 3 %} cards-3-item{% endif %}">
-          {%- for post in recentPosts -%}
-            {% include "components/snippets/article.njk" %}
-          {% else %}
-            <li class="card card-empty" role="card">
-              <h2>You haven't post anything yet.</h2>
-              It seems like there is no article right now...
-            </li>
-          {%- endfor -%}
-        </ul>
-      </section>
-      {% set groupedPosts = posts | groupby("date.year") %}
-      {% for year, posts in groupedPosts | reverseGroupedPosts %}
-        <section class="posts" aria-label="Posts from {{ year }}">
-          <h2 class="posts-yeargroup"
-              data-animation="fade-in"
-              data-delay="{{ loop.index }}">{{ year }}</h2>
-          <ul class="posts-list">
-            {% for post in posts %}
-              <li class="posts-detail"
-                  data-animation="prototype-card"
-                  data-delay="{{ loop.index + 0.5 | float }}"
-                  aria-label="Summary from {{ post.title }}">
-                <p class="posts-detail_accent">
-                  <time class="posts-detail_accent-item posts-detail_accent-item_filled"
-                        datetime="{{ post.date.fullDate | htmlDateString }}">
-                    <svg xmlns="http://www.w3.org/2000/svg"
-                         class="posts-detail_svg"
-                         fill="none"
-                         viewBox="0 0 24 24"
-                         stroke="currentColor"
-                         stroke-width="2">
-                      <path stroke-linecap="round" stroke-linejoin="round" d="M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z" />
-                    </svg>
-                    {{ post.date.fullDate | postDate }}
-                  </time>
-                  <span class="posts-detail_accent-item">
-                    <svg xmlns="http://www.w3.org/2000/svg"
-                         fill="none"
-                         viewBox="0 0 24 24"
-                         stroke-width="1.5"
-                         stroke="currentColor"
-                         class="posts-detail_svg">
-                      <path stroke-linecap="round" stroke-linejoin="round" d="M15.75 6a3.75 3.75 0 11-7.5 0 3.75 3.75 0 017.5 0zM4.501 20.118a7.5 7.5 0 0114.998 0A17.933 17.933 0 0112 21.75c-2.676 0-5.216-.584-7.499-1.632z" />
-                    </svg>
-                    {{ post.author }}
-                  </span>
-                </p>
-                <p class="posts-detail_header">
-                  <a href="{{ post.url }}">
-                    <span aria-labelledby="{{ post.slug }}" aria-hidden="true">#</span>
-                    {# <span class="sr-only" id="{{ post.slug }}-sr-only">{{ post.title }}</span> #}
-                    <span id="{{ post.slug }}">{{ post.title }}</span>
-                  </a>
-                </p>
-                <p>{{ post.desc | truncate(60) }}</p>
-              </li>
-            {% endfor %}
-          </ul>
-        </section>
-      {% endfor %}
-    </div>
-  </section>
-</main>
-<script>
-  let links = document.links
-  for (link of links) {
-    if (document.location.hostname == 'localhost') break
-    let regex = /\/articles\/blog/g
-    const currentHref = link.href
-    if (currentHref.includes("/articles/blog")) link.href = currentHref.replace(regex, "/blog")
-  }
-</script>
+---
+title : 'Recent Articles - Blog | EmptyWork'
+description : "List of all articles that was written by me, its mostly contain topics about Accessibility, PHP, HTML, CSS and Fullstack development"
+layout: 'layouts/secondary.njk'
+style: 'blog.css'
+---
+
+{% set posts = [] %}
+{% set recentPosts = [] %}
+{% for post in collections.post | reverse %}
+  {% if not post.data.draft %}
+    {% set postDate = {
+          year: post.data.date | postYear,
+          fullDate: post.data.date
+        } %}
+    {% set _ = posts.push({
+          title: post.data.title,
+          url: post.url,
+          date: postDate,
+          desc: post.data.description,
+          author: post.data.author,
+          slug: post.fileSlug
+        }) %}
+    {% set _ = recentPosts.push({
+          title: post.data.title,
+          description: post.data.description,
+          url: post.url,
+          slug: post.fileSlug,
+          author: post.data.author,
+          date: post.data.date,
+          image: post.data.image
+        }) %}
+  {% endif %}
+  {% if isDevelopment and post.data.draft %}
+    {% set postDate = {
+          year: post.data.date | postYear,
+          fullDate: post.data.date
+        } %}
+    {% set _ = posts.push({
+          title: post.data.title,
+          url: post.url,
+          date: postDate,
+          desc: post.data.description,
+          author: post.data.author,
+          slug: post.fileSlug
+        }) %}
+    {% set _ = recentPosts.push({
+          title: post.data.title,
+          description: post.data.description,
+          url: post.url,
+          slug: post.fileSlug,
+          author: post.data.author,
+          date: post.data.date,
+          image: post.data.image
+        }) %}
+  {% endif %}
+{% endfor %}
+{% if recentPosts | length > 3 %}
+  {% set recentPosts = recentPosts | sliceRecent %}
+{% endif %}
+<main id="main" class="main  blog">
+  <section aria-labelledby="article" class="articles">
+    <div class="main-container">
+      <header class="section-header" data-animation="fade-in">
+        <span>
+          <a class="breadcrumb" href="/">Home</a> ›
+          <a class="breadcrumb" aria-current="page" href="/blog">Blog</a>
+        </span>
+        <div class="header-title">
+          <a class="header-title__link" href="#article">
+            <span aria-hidden="true">#</span>
+            <span class="sr-only">Link to heading "recent articles"</span>
+          </a>
+          <h1 id="article">Articles</h1>
+        </div>
+      </header>
+      <section aria-label="Recent Articles">
+        <ul class="cards cards-horizontal{% if lengthRecentPosts == 3 %} cards-3-item{% endif %}">
+          {%- for post in recentPosts -%}
+            {% include "components/snippets/post-card.njk" %}
+          {% else %}
+            <li class="card card-empty" role="card">
+              <h2>You haven't post anything yet.</h2>
+              It seems like there is no article right now...
+            </li>
+          {%- endfor -%}
+        </ul>
+      </section>
+      {% set groupedPosts = posts | groupby("date.year") %}
+      {% for year, posts in groupedPosts | reverseGroupedPosts %}
+        <section class="posts" aria-label="Posts from {{ year }}">
+          <h2 class="posts-yeargroup"
+              data-animation="fade-in"
+              data-delay="{{ loop.index }}">{{ year }}</h2>
+          <ul class="posts-list">
+            {% for post in posts %}
+              <li class="posts-detail"
+                  data-animation="prototype-card"
+                  data-delay="{{ loop.index + 0.5 | float }}"
+                  aria-label="Summary from {{ post.title }}">
+                <p class="posts-detail_accent">
+                  <time class="posts-detail_accent-item posts-detail_accent-item_filled"
+                        datetime="{{ post.date.fullDate | htmlDateString }}">
+                    <svg xmlns="http://www.w3.org/2000/svg"
+                         class="posts-detail_svg"
+                         fill="none"
+                         viewBox="0 0 24 24"
+                         stroke="currentColor"
+                         stroke-width="2">
+                      <path stroke-linecap="round" stroke-linejoin="round" d="M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z" />
+                    </svg>
+                    {{ post.date.fullDate | postDate }}
+                  </time>
+                  <span class="posts-detail_accent-item">
+                    <svg xmlns="http://www.w3.org/2000/svg"
+                         fill="none"
+                         viewBox="0 0 24 24"
+                         stroke-width="1.5"
+                         stroke="currentColor"
+                         class="posts-detail_svg">
+                      <path stroke-linecap="round" stroke-linejoin="round" d="M15.75 6a3.75 3.75 0 11-7.5 0 3.75 3.75 0 017.5 0zM4.501 20.118a7.5 7.5 0 0114.998 0A17.933 17.933 0 0112 21.75c-2.676 0-5.216-.584-7.499-1.632z" />
+                    </svg>
+                    {{ post.author }}
+                  </span>
+                </p>
+                <p class="posts-detail_header">
+                  <a href="{{ post.url }}">
+                    <span aria-hidden="true">#</span>
+                    <span id="{{ post.slug }}">{{ post.title }}</span>
+                  </a>
+                </p>
+                <p>{{ post.desc | truncate(60) }}</p>
+              </li>
+            {% endfor %}
+          </ul>
+        </section>
+      {% endfor %}
+    </div>
+  </section>
+</main>
+<script>
+  let links = document.links
+  for (link of links) {
+    if (document.location.hostname == 'localhost') break
+    let regex = /\/articles\/blog/g
+    const currentHref = link.href
+    if (currentHref.includes("/articles/blog")) link.href = currentHref.replace(regex, "/blog")
+  }
+</script>
diff --git a/src/contact.njk b/src/contact.njk
index a7e6d6f..1bf2b3d 100644
--- a/src/contact.njk
+++ b/src/contact.njk
@@ -23,18 +23,18 @@ style: 'contact.css'
       </header>
       <div class="contact-container" data-animation="fade-in" data-delay="2">
         <p class="contact-summary">{{ contact.summary | renderMarkdownInline | safe }}</p>
-        <ul class="social-container">
-          {% for social in contact.mainSocials %}
-            <li data-animation="fade-in" data-delay="{{ loop.index }}">{% include "components/snippets/social-items.njk" %}</li>
-          {% endfor %}
-        </ul>
-        <ul class="social-container social-container__small">
-          {% for social in contact.socials %}
-            {% if social.hidden !== true %}
-              <li data-animation="fade-in" data-delay="{{ loop.index }}">{% include "components/snippets/social-items.njk" %}</li>
-            {% endif %}
-          {% endfor %}
-        </ul>
+        {% for socials, containerClass in [
+          [contact.mainSocials, "social-container"],
+          [contact.socials, "social-container social-container__small"]
+          ] %}
+          <ul class="{{ containerClass }}">
+            {% for social in socials %}
+              {% if containerClass == "social-container" or social.hidden !== true %}
+                <li data-animation="fade-in" data-delay="{{ loop.index }}">{% include "components/snippets/social-items.njk" %}</li>
+              {% endif %}
+            {% endfor %}
+          </ul>
+        {% endfor %}
       </div>
     </div>
   </section>
diff --git a/src/error.njk b/src/error.njk
index 67daf23..cfb432e 100644
--- a/src/error.njk
+++ b/src/error.njk
@@ -31,15 +31,10 @@ style: 'error.css'
             </div>
           </div>
           <h2 data-animation="fade-in" data-delay="1">
-            <mark class="big-text highlight">404</mark> — The page that you
-            are looking for
-            does not exist
+            <mark class="big-text highlight">404</mark> — The page that you are looking for does not exist
           </h2>
           <p data-animation="fade-in" data-delay="2">
-            Please <mark class="highlight">make sure that the URL</mark> you
-            typed are
-            correct, if you think that the
-            <mark class="highlight">URL is correct</mark> but you still cannot seems to access it please <a href="mailto:contact@emptywork.my.id">contact me via email</a>.
+            Please <mark class="highlight">make sure that the URL</mark> you typed is correct, if you think that the <mark class="highlight">URL is correct</mark> but you still cannot seems to access it please <a href="mailto:contact@emptywork.my.id">contact me via email</a>.
           </p>
         </div>
         <ul class="error-button">
diff --git a/src/feed.njk b/src/feed.njk
index a6e984c..2df4a29 100644
--- a/src/feed.njk
+++ b/src/feed.njk
@@ -14,28 +14,33 @@
 }
 ---
 <?xml version="1.0" encoding="utf-8"?>
+<?xml-stylesheet href="pretty-atom-feed.xsl" type="text/xsl"?>
 <feed xmlns="http://www.w3.org/2005/Atom" xml:base="{{ link.website }}">
-  <title>{{ metadata.title }}</title>
-  <subtitle>{{ metadata.subtitle }}</subtitle>
-  <link href="{{ permalink | absoluteUrl(link.website) }}" rel="self" type="application/atom+xml"/>
-  <link href="{{ link.website }}" rel="alternate" type="text/html"/>
-  <updated>{{ collections.post | getNewestCollectionItemDate | dateToRfc3339 }}</updated>
-  <id>{{ link.website }}</id>
-  <author>
-    <name>{{ metadata.author.name }}</name>
-    <email>{{ metadata.author.email }}</email>
-  </author>
-  {%- for post in collections.post | reverse %}
-  {%- set absolutePostUrl = post.url | absoluteUrl(link.website) %}
-  <entry>
+<title>{{ metadata.title }}</title>
+<subtitle>{{ metadata.subtitle }}</subtitle>
+<link href="{{ permalink | absoluteUrl(link.website) }}"
+      rel="self"
+      type="application/atom+xml" />
+<link href="{{ link.website }}" rel="alternate" type="text/html" />
+<updated>{{ collections.post | getNewestCollectionItemDate | dateToRfc3339 }}</updated>
+<id>{{ link.website }}</id>
+<author>
+<name>{{ metadata.author.name }}</name>
+<email>{{ metadata.author.email }}</email>
+</author>
+{%- for post in collections.post | reverse %}
+  {% if not post.data.draft %}
+    {%- set absolutePostUrl = post.url | absoluteUrl(link.website) %}
+    <entry>
     <title>{{ post.data.title }}</title>
-    <link href="{{ absolutePostUrl }}"/>
+    <link href="{{ absolutePostUrl }}" />
     <updated>{{ post.date | dateToRfc3339 }}</updated>
     <id>{{ absolutePostUrl }}</id>
     <content xml:lang="{{ metadata.language }}" type="html">
-        {%- set templateContent = post.templateContent | htmlToAbsoluteUrls(absolutePostUrl) %}
-        {{ templateContent | safe }}
+      {%- set templateContent = post.templateContent | htmlToAbsoluteUrls(absolutePostUrl) %}
+      {{ templateContent }}
     </content>
-  </entry>
-  {%- endfor %}
-</feed>
\ No newline at end of file
+    </entry>
+  {% endif %}
+{%- endfor %}
+</feed>
diff --git a/src/index.njk b/src/index.njk
index 946f8e5..ed6f7a4 100644
--- a/src/index.njk
+++ b/src/index.njk
@@ -2,11 +2,12 @@
 title: 'EmptyWork'
 layout: 'layouts/primary.njk'
 ---
+
 <main id="main" class="main">
-  {% include 'sections/featured.njk' %}
-  {% include 'sections/work.njk' %}
-  {% include 'sections/clients.njk' %}
-  {% include 'sections/partof.njk' %}
-  {% include 'sections/about.njk' %}
-  {% include 'sections/prototypes.njk' %}
-</main>
\ No newline at end of file
+  {% include "sections/featured.njk" %}
+  {% include "sections/work.njk" %}
+  {% include "sections/clients.njk" %}
+  {% include "sections/partof.njk" %}
+  {% include "sections/about.njk" %}
+  {% include "sections/prototypes.njk" %}
+</main>
diff --git a/src/pretty-atom-feed.xsl b/src/pretty-atom-feed.xsl
new file mode 100644
index 0000000..6331549
--- /dev/null
+++ b/src/pretty-atom-feed.xsl
@@ -0,0 +1,89 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+# Pretty Atom Feed
+
+Based on "Pretty RSS Feed": https://github.com/genmon/aboutfeeds/issues/26
+
+Styles an Atom feed, making it friendly for humans viewers, and adds a link
+to aboutfeeds.com for new user onboarding. See it in action:
+
+https://nicolas-hoizey.com/feeds/all.xml
+
+-->
+<xsl:stylesheet version="3.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
+                xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/"
+                xmlns:itunes="http://www.itunes.com/dtds/podcast-1.0.dtd">
+  <xsl:output method="html" version="1.0" encoding="UTF-8" indent="yes"/>
+  <xsl:template match="/">
+    <html xmlns="http://www.w3.org/1999/xhtml">
+      <head>
+        <title><xsl:value-of select="atom:feed/atom:title"/></title>
+        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
+        <meta name="viewport" content="width=device-width, initial-scale=1"/>
+        <style type="text/css">/*! normalize.css v4.1.1 | MIT License | github.com/necolas/normalize.css */html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,main,menu,nav,section{display:block}summary{display:list-item}audio,canvas,progress,video{display:inline-block}audio:not([controls]){display:none;height:0}progress{vertical-align:baseline}[hidden],template{display:none!important}a{background-color:transparent}a:active,a:hover{outline-width:0}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:inherit}b,strong{font-weight:bolder}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}svg:not(:root){overflow:hidden}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}figure{margin:1em 40px}hr{box-sizing:content-box;height:0;overflow:visible}button,input,select,textarea{font:inherit;margin:0}optgroup{font-weight:700}button,input{overflow:visible}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-input-placeholder{color:inherit;opacity:.54}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}*{box-sizing:border-box}button,input,select,textarea{font-family:inherit;font-size:inherit;line-height:inherit}body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:14px;line-height:1.5;color:#24292e;background-color:#fff}a{color:#0366d6;text-decoration:none}a:hover{text-decoration:underline}b,strong{font-weight:600}.rule,hr{height:0;margin:15px 0;overflow:hidden;background:0 0;border:0;border-bottom:1px solid #dfe2e5}.rule::before,hr::before{display:table;content:""}.rule::after,hr::after{display:table;clear:both;content:""}table{border-spacing:0;border-collapse:collapse}td,th{padding:0}button{cursor:pointer;border-radius:0}[hidden][hidden]{display:none!important}details summary{cursor:pointer}details:not([open])>* :not(summary){display:none!important}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:0}h1{font-size:32px;font-weight:600}h2{font-size:24px;font-weight:600}h3{font-size:20px;font-weight:600}h4{font-size:16px;font-weight:600}h5{font-size:14px;font-weight:600}h6{font-size:12px;font-weight:600}p{margin-top:0;margin-bottom:10px}small{font-size:90%}blockquote{margin:0}ol,ul{padding-left:0;margin-top:0;margin-bottom:0}ol ol,ul ol{list-style-type:lower-roman}ol ol ol,ol ul ol,ul ol ol,ul ul ol{list-style-type:lower-alpha}dd{margin-left:0}code,tt{font-family:SFMono-Regular,Consolas,"Liberation Mono",Menlo,Courier,monospace;font-size:12px}pre{margin-top:0;margin-bottom:0;font-family:SFMono-Regular,Consolas,"Liberation Mono",Menlo,Courier,monospace;font-size:12px}.octicon{vertical-align:text-bottom}.anim-fade-in{animation-name:fade-in;animation-duration:1s;animation-timing-function:ease-in-out}.anim-fade-in.fast{animation-duration:.3s}@keyframes fade-in{0%{opacity:0}100%{opacity:1}}.anim-fade-out{animation-name:fade-out;animation-duration:1s;animation-timing-function:ease-out}.anim-fade-out.fast{animation-duration:.3s}@keyframes fade-out{0%{opacity:1}100%{opacity:0}}.anim-fade-up{opacity:0;animation-name:fade-up;animation-duration:.3s;animation-fill-mode:forwards;animation-timing-function:ease-out;animation-delay:1s}@keyframes fade-up{0%{opacity:.8;transform:translateY(100%)}100%{opacity:1;transform:translateY(0)}}.anim-fade-down{animation-name:fade-down;animation-duration:.3s;animation-fill-mode:forwards;animation-timing-function:ease-in}@keyframes fade-down{0%{opacity:1;transform:translateY(0)}100%{opacity:.5;transform:translateY(100%)}}.anim-grow-x{width:0%;animation-name:grow-x;animation-duration:.3s;animation-fill-mode:forwards;animation-timing-function:ease;animation-delay:.5s}@keyframes grow-x{to{width:100%}}.anim-shrink-x{animation-name:shrink-x;animation-duration:.3s;animation-fill-mode:forwards;animation-timing-function:ease-in-out;animation-delay:.5s}@keyframes shrink-x{to{width:0%}}.anim-scale-in{animation-name:scale-in;animation-duration:.15s;animation-timing-function:cubic-bezier(.2,0,.13,1.5)}@keyframes scale-in{0%{opacity:0;transform:scale(.5)}100%{opacity:1;transform:scale(1)}}.anim-pulse{animation-name:pulse;animation-duration:2s;animation-timing-function:linear;animation-iteration-count:infinite}@keyframes pulse{0%{opacity:.3}10%{opacity:1}100%{opacity:.3}}.anim-pulse-in{animation-name:pulse-in;animation-duration:.5s}@keyframes pulse-in{0%{transform:scale3d(1,1,1)}50%{transform:scale3d(1.1,1.1,1.1)}100%{transform:scale3d(1,1,1)}}.hover-grow{transition:transform .3s;backface-visibility:hidden}.hover-grow:hover{transform:scale(1.025)}.border{border:1px #e1e4e8 solid!important}.border-y{border-top:1px #e1e4e8 solid!important;border-bottom:1px #e1e4e8 solid!important}.border-0{border:0!important}.border-dashed{border-style:dashed!important}.border-blue{border-color:#0366d6!important}.border-blue-light{border-color:#c8e1ff!important}.border-green{border-color:#34d058!important}.border-green-light{border-color:#a2cbac!important}.border-red{border-color:#d73a49!important}.border-red-light{border-color:#cea0a5!important}.border-purple{border-color:#6f42c1!important}.border-yellow{border-color:#d9d0a5!important}.border-gray-light{border-color:#eaecef!important}.border-gray-dark{border-color:#d1d5da!important}.border-black-fade{border-color:rgba(27,31,35,.15)!important}.border-top{border-top:1px #e1e4e8 solid!important}.border-right{border-right:1px #e1e4e8 solid!important}.border-bottom{border-bottom:1px #e1e4e8 solid!important}.border-left{border-left:1px #e1e4e8 solid!important}.border-top-0{border-top:0!important}.border-right-0{border-right:0!important}.border-bottom-0{border-bottom:0!important}.border-left-0{border-left:0!important}.rounded-0{border-radius:0!important}.rounded-1{border-radius:3px!important}.rounded-2{border-radius:6px!important}.rounded-top-0{border-top-left-radius:0!important;border-top-right-radius:0!important}.rounded-top-1{border-top-left-radius:3px!important;border-top-right-radius:3px!important}.rounded-top-2{border-top-left-radius:6px!important;border-top-right-radius:6px!important}.rounded-right-0{border-top-right-radius:0!important;border-bottom-right-radius:0!important}.rounded-right-1{border-top-right-radius:3px!important;border-bottom-right-radius:3px!important}.rounded-right-2{border-top-right-radius:6px!important;border-bottom-right-radius:6px!important}.rounded-bottom-0{border-bottom-right-radius:0!important;border-bottom-left-radius:0!important}.rounded-bottom-1{border-bottom-right-radius:3px!important;border-bottom-left-radius:3px!important}.rounded-bottom-2{border-bottom-right-radius:6px!important;border-bottom-left-radius:6px!important}.rounded-left-0{border-bottom-left-radius:0!important;border-top-left-radius:0!important}.rounded-left-1{border-bottom-left-radius:3px!important;border-top-left-radius:3px!important}.rounded-left-2{border-bottom-left-radius:6px!important;border-top-left-radius:6px!important}@media (min-width:544px){.border-sm-top{border-top:1px #e1e4e8 solid!important}.border-sm-right{border-right:1px #e1e4e8 solid!important}.border-sm-bottom{border-bottom:1px #e1e4e8 solid!important}.border-sm-left{border-left:1px #e1e4e8 solid!important}.border-sm-top-0{border-top:0!important}.border-sm-right-0{border-right:0!important}.border-sm-bottom-0{border-bottom:0!important}.border-sm-left-0{border-left:0!important}.rounded-sm-0{border-radius:0!important}.rounded-sm-1{border-radius:3px!important}.rounded-sm-2{border-radius:6px!important}.rounded-sm-top-0{border-top-left-radius:0!important;border-top-right-radius:0!important}.rounded-sm-top-1{border-top-left-radius:3px!important;border-top-right-radius:3px!important}.rounded-sm-top-2{border-top-left-radius:6px!important;border-top-right-radius:6px!important}.rounded-sm-right-0{border-top-right-radius:0!important;border-bottom-right-radius:0!important}.rounded-sm-right-1{border-top-right-radius:3px!important;border-bottom-right-radius:3px!important}.rounded-sm-right-2{border-top-right-radius:6px!important;border-bottom-right-radius:6px!important}.rounded-sm-bottom-0{border-bottom-right-radius:0!important;border-bottom-left-radius:0!important}.rounded-sm-bottom-1{border-bottom-right-radius:3px!important;border-bottom-left-radius:3px!important}.rounded-sm-bottom-2{border-bottom-right-radius:6px!important;border-bottom-left-radius:6px!important}.rounded-sm-left-0{border-bottom-left-radius:0!important;border-top-left-radius:0!important}.rounded-sm-left-1{border-bottom-left-radius:3px!important;border-top-left-radius:3px!important}.rounded-sm-left-2{border-bottom-left-radius:6px!important;border-top-left-radius:6px!important}}@media (min-width:768px){.border-md-top{border-top:1px #e1e4e8 solid!important}.border-md-right{border-right:1px #e1e4e8 solid!important}.border-md-bottom{border-bottom:1px #e1e4e8 solid!important}.border-md-left{border-left:1px #e1e4e8 solid!important}.border-md-top-0{border-top:0!important}.border-md-right-0{border-right:0!important}.border-md-bottom-0{border-bottom:0!important}.border-md-left-0{border-left:0!important}.rounded-md-0{border-radius:0!important}.rounded-md-1{border-radius:3px!important}.rounded-md-2{border-radius:6px!important}.rounded-md-top-0{border-top-left-radius:0!important;border-top-right-radius:0!important}.rounded-md-top-1{border-top-left-radius:3px!important;border-top-right-radius:3px!important}.rounded-md-top-2{border-top-left-radius:6px!important;border-top-right-radius:6px!important}.rounded-md-right-0{border-top-right-radius:0!important;border-bottom-right-radius:0!important}.rounded-md-right-1{border-top-right-radius:3px!important;border-bottom-right-radius:3px!important}.rounded-md-right-2{border-top-right-radius:6px!important;border-bottom-right-radius:6px!important}.rounded-md-bottom-0{border-bottom-right-radius:0!important;border-bottom-left-radius:0!important}.rounded-md-bottom-1{border-bottom-right-radius:3px!important;border-bottom-left-radius:3px!important}.rounded-md-bottom-2{border-bottom-right-radius:6px!important;border-bottom-left-radius:6px!important}.rounded-md-left-0{border-bottom-left-radius:0!important;border-top-left-radius:0!important}.rounded-md-left-1{border-bottom-left-radius:3px!important;border-top-left-radius:3px!important}.rounded-md-left-2{border-bottom-left-radius:6px!important;border-top-left-radius:6px!important}}@media (min-width:1012px){.border-lg-top{border-top:1px #e1e4e8 solid!important}.border-lg-right{border-right:1px #e1e4e8 solid!important}.border-lg-bottom{border-bottom:1px #e1e4e8 solid!important}.border-lg-left{border-left:1px #e1e4e8 solid!important}.border-lg-top-0{border-top:0!important}.border-lg-right-0{border-right:0!important}.border-lg-bottom-0{border-bottom:0!important}.border-lg-left-0{border-left:0!important}.rounded-lg-0{border-radius:0!important}.rounded-lg-1{border-radius:3px!important}.rounded-lg-2{border-radius:6px!important}.rounded-lg-top-0{border-top-left-radius:0!important;border-top-right-radius:0!important}.rounded-lg-top-1{border-top-left-radius:3px!important;border-top-right-radius:3px!important}.rounded-lg-top-2{border-top-left-radius:6px!important;border-top-right-radius:6px!important}.rounded-lg-right-0{border-top-right-radius:0!important;border-bottom-right-radius:0!important}.rounded-lg-right-1{border-top-right-radius:3px!important;border-bottom-right-radius:3px!important}.rounded-lg-right-2{border-top-right-radius:6px!important;border-bottom-right-radius:6px!important}.rounded-lg-bottom-0{border-bottom-right-radius:0!important;border-bottom-left-radius:0!important}.rounded-lg-bottom-1{border-bottom-right-radius:3px!important;border-bottom-left-radius:3px!important}.rounded-lg-bottom-2{border-bottom-right-radius:6px!important;border-bottom-left-radius:6px!important}.rounded-lg-left-0{border-bottom-left-radius:0!important;border-top-left-radius:0!important}.rounded-lg-left-1{border-bottom-left-radius:3px!important;border-top-left-radius:3px!important}.rounded-lg-left-2{border-bottom-left-radius:6px!important;border-top-left-radius:6px!important}}@media (min-width:1280px){.border-xl-top{border-top:1px #e1e4e8 solid!important}.border-xl-right{border-right:1px #e1e4e8 solid!important}.border-xl-bottom{border-bottom:1px #e1e4e8 solid!important}.border-xl-left{border-left:1px #e1e4e8 solid!important}.border-xl-top-0{border-top:0!important}.border-xl-right-0{border-right:0!important}.border-xl-bottom-0{border-bottom:0!important}.border-xl-left-0{border-left:0!important}.rounded-xl-0{border-radius:0!important}.rounded-xl-1{border-radius:3px!important}.rounded-xl-2{border-radius:6px!important}.rounded-xl-top-0{border-top-left-radius:0!important;border-top-right-radius:0!important}.rounded-xl-top-1{border-top-left-radius:3px!important;border-top-right-radius:3px!important}.rounded-xl-top-2{border-top-left-radius:6px!important;border-top-right-radius:6px!important}.rounded-xl-right-0{border-top-right-radius:0!important;border-bottom-right-radius:0!important}.rounded-xl-right-1{border-top-right-radius:3px!important;border-bottom-right-radius:3px!important}.rounded-xl-right-2{border-top-right-radius:6px!important;border-bottom-right-radius:6px!important}.rounded-xl-bottom-0{border-bottom-right-radius:0!important;border-bottom-left-radius:0!important}.rounded-xl-bottom-1{border-bottom-right-radius:3px!important;border-bottom-left-radius:3px!important}.rounded-xl-bottom-2{border-bottom-right-radius:6px!important;border-bottom-left-radius:6px!important}.rounded-xl-left-0{border-bottom-left-radius:0!important;border-top-left-radius:0!important}.rounded-xl-left-1{border-bottom-left-radius:3px!important;border-top-left-radius:3px!important}.rounded-xl-left-2{border-bottom-left-radius:6px!important;border-top-left-radius:6px!important}}.circle{border-radius:50%!important}.box-shadow{box-shadow:0 1px 1px rgba(27,31,35,.1)!important}.box-shadow-medium{box-shadow:0 1px 5px rgba(27,31,35,.15)!important}.box-shadow-large{box-shadow:0 1px 15px rgba(27,31,35,.15)!important}.box-shadow-extra-large{box-shadow:0 10px 50px rgba(27,31,35,.07)!important}.box-shadow-none{box-shadow:none!important}.bg-white{background-color:#fff!important}.bg-blue{background-color:#0366d6!important}.bg-blue-light{background-color:#f1f8ff!important}.bg-gray-dark{background-color:#24292e!important}.bg-gray{background-color:#f6f8fa!important}.bg-gray-light{background-color:#fafbfc!important}.bg-green{background-color:#28a745!important}.bg-green-light{background-color:#dcffe4!important}.bg-red{background-color:#d73a49!important}.bg-red-light{background-color:#ffdce0!important}.bg-yellow{background-color:#ffd33d!important}.bg-yellow-light{background-color:#fff5b1!important}.bg-purple{background-color:#6f42c1!important}.bg-purple-light{background-color:#f5f0ff!important}.bg-shade-gradient{background-image:linear-gradient(180deg,rgba(27,31,35,.065),rgba(27,31,35,0))!important;background-repeat:no-repeat!important;background-size:100% 200px!important}.text-blue{color:#0366d6!important}.text-red{color:#cb2431!important}.text-gray-light{color:#6a737d!important}.text-gray{color:#586069!important}.text-gray-dark{color:#24292e!important}.text-green{color:#28a745!important}.text-orange{color:#a04100!important}.text-orange-light{color:#e36209!important}.text-purple{color:#6f42c1!important}.text-white{color:#fff!important}.text-inherit{color:inherit!important}.text-pending{color:#b08800!important}.bg-pending{color:#dbab09!important}.link-gray{color:#586069!important}.link-gray:hover{color:#0366d6!important}.link-gray-dark{color:#24292e!important}.link-gray-dark:hover{color:#0366d6!important}.link-hover-blue:hover{color:#0366d6!important}.muted-link{color:#586069!important}.muted-link:hover{color:#0366d6!important;text-decoration:none}.details-overlay[open]>summary::before{position:fixed;top:0;right:0;bottom:0;left:0;z-index:80;display:block;cursor:default;content:" ";background:0 0}.details-overlay-dark[open]>summary::before{z-index:99;background:rgba(27,31,35,.5)}.flex-row{flex-direction:row!important}.flex-row-reverse{flex-direction:row-reverse!important}.flex-column{flex-direction:column!important}.flex-wrap{flex-wrap:wrap!important}.flex-nowrap{flex-wrap:nowrap!important}.flex-justify-start{justify-content:flex-start!important}.flex-justify-end{justify-content:flex-end!important}.flex-justify-center{justify-content:center!important}.flex-justify-between{justify-content:space-between!important}.flex-justify-around{justify-content:space-around!important}.flex-items-start{align-items:flex-start!important}.flex-items-end{align-items:flex-end!important}.flex-items-center{align-items:center!important}.flex-items-baseline{align-items:baseline!important}.flex-items-stretch{align-items:stretch!important}.flex-content-start{align-content:flex-start!important}.flex-content-end{align-content:flex-end!important}.flex-content-center{align-content:center!important}.flex-content-between{align-content:space-between!important}.flex-content-around{align-content:space-around!important}.flex-content-stretch{align-content:stretch!important}.flex-auto{flex:1 1 auto!important}.flex-shrink-0{flex-shrink:0!important}.flex-self-auto{align-self:auto!important}.flex-self-start{align-self:flex-start!important}.flex-self-end{align-self:flex-end!important}.flex-self-center{align-self:center!important}.flex-self-baseline{align-self:baseline!important}.flex-self-stretch{align-self:stretch!important}.flex-item-equal{flex-grow:1;flex-basis:0}@media (min-width:544px){.flex-sm-row{flex-direction:row!important}.flex-sm-row-reverse{flex-direction:row-reverse!important}.flex-sm-column{flex-direction:column!important}.flex-sm-wrap{flex-wrap:wrap!important}.flex-sm-nowrap{flex-wrap:nowrap!important}.flex-sm-justify-start{justify-content:flex-start!important}.flex-sm-justify-end{justify-content:flex-end!important}.flex-sm-justify-center{justify-content:center!important}.flex-sm-justify-between{justify-content:space-between!important}.flex-sm-justify-around{justify-content:space-around!important}.flex-sm-items-start{align-items:flex-start!important}.flex-sm-items-end{align-items:flex-end!important}.flex-sm-items-center{align-items:center!important}.flex-sm-items-baseline{align-items:baseline!important}.flex-sm-items-stretch{align-items:stretch!important}.flex-sm-content-start{align-content:flex-start!important}.flex-sm-content-end{align-content:flex-end!important}.flex-sm-content-center{align-content:center!important}.flex-sm-content-between{align-content:space-between!important}.flex-sm-content-around{align-content:space-around!important}.flex-sm-content-stretch{align-content:stretch!important}.flex-sm-auto{flex:1 1 auto!important}.flex-sm-shrink-0{flex-shrink:0!important}.flex-sm-self-auto{align-self:auto!important}.flex-sm-self-start{align-self:flex-start!important}.flex-sm-self-end{align-self:flex-end!important}.flex-sm-self-center{align-self:center!important}.flex-sm-self-baseline{align-self:baseline!important}.flex-sm-self-stretch{align-self:stretch!important}.flex-sm-item-equal{flex-grow:1;flex-basis:0}}@media (min-width:768px){.flex-md-row{flex-direction:row!important}.flex-md-row-reverse{flex-direction:row-reverse!important}.flex-md-column{flex-direction:column!important}.flex-md-wrap{flex-wrap:wrap!important}.flex-md-nowrap{flex-wrap:nowrap!important}.flex-md-justify-start{justify-content:flex-start!important}.flex-md-justify-end{justify-content:flex-end!important}.flex-md-justify-center{justify-content:center!important}.flex-md-justify-between{justify-content:space-between!important}.flex-md-justify-around{justify-content:space-around!important}.flex-md-items-start{align-items:flex-start!important}.flex-md-items-end{align-items:flex-end!important}.flex-md-items-center{align-items:center!important}.flex-md-items-baseline{align-items:baseline!important}.flex-md-items-stretch{align-items:stretch!important}.flex-md-content-start{align-content:flex-start!important}.flex-md-content-end{align-content:flex-end!important}.flex-md-content-center{align-content:center!important}.flex-md-content-between{align-content:space-between!important}.flex-md-content-around{align-content:space-around!important}.flex-md-content-stretch{align-content:stretch!important}.flex-md-auto{flex:1 1 auto!important}.flex-md-shrink-0{flex-shrink:0!important}.flex-md-self-auto{align-self:auto!important}.flex-md-self-start{align-self:flex-start!important}.flex-md-self-end{align-self:flex-end!important}.flex-md-self-center{align-self:center!important}.flex-md-self-baseline{align-self:baseline!important}.flex-md-self-stretch{align-self:stretch!important}.flex-md-item-equal{flex-grow:1;flex-basis:0}}@media (min-width:1012px){.flex-lg-row{flex-direction:row!important}.flex-lg-row-reverse{flex-direction:row-reverse!important}.flex-lg-column{flex-direction:column!important}.flex-lg-wrap{flex-wrap:wrap!important}.flex-lg-nowrap{flex-wrap:nowrap!important}.flex-lg-justify-start{justify-content:flex-start!important}.flex-lg-justify-end{justify-content:flex-end!important}.flex-lg-justify-center{justify-content:center!important}.flex-lg-justify-between{justify-content:space-between!important}.flex-lg-justify-around{justify-content:space-around!important}.flex-lg-items-start{align-items:flex-start!important}.flex-lg-items-end{align-items:flex-end!important}.flex-lg-items-center{align-items:center!important}.flex-lg-items-baseline{align-items:baseline!important}.flex-lg-items-stretch{align-items:stretch!important}.flex-lg-content-start{align-content:flex-start!important}.flex-lg-content-end{align-content:flex-end!important}.flex-lg-content-center{align-content:center!important}.flex-lg-content-between{align-content:space-between!important}.flex-lg-content-around{align-content:space-around!important}.flex-lg-content-stretch{align-content:stretch!important}.flex-lg-auto{flex:1 1 auto!important}.flex-lg-shrink-0{flex-shrink:0!important}.flex-lg-self-auto{align-self:auto!important}.flex-lg-self-start{align-self:flex-start!important}.flex-lg-self-end{align-self:flex-end!important}.flex-lg-self-center{align-self:center!important}.flex-lg-self-baseline{align-self:baseline!important}.flex-lg-self-stretch{align-self:stretch!important}.flex-lg-item-equal{flex-grow:1;flex-basis:0}}@media (min-width:1280px){.flex-xl-row{flex-direction:row!important}.flex-xl-row-reverse{flex-direction:row-reverse!important}.flex-xl-column{flex-direction:column!important}.flex-xl-wrap{flex-wrap:wrap!important}.flex-xl-nowrap{flex-wrap:nowrap!important}.flex-xl-justify-start{justify-content:flex-start!important}.flex-xl-justify-end{justify-content:flex-end!important}.flex-xl-justify-center{justify-content:center!important}.flex-xl-justify-between{justify-content:space-between!important}.flex-xl-justify-around{justify-content:space-around!important}.flex-xl-items-start{align-items:flex-start!important}.flex-xl-items-end{align-items:flex-end!important}.flex-xl-items-center{align-items:center!important}.flex-xl-items-baseline{align-items:baseline!important}.flex-xl-items-stretch{align-items:stretch!important}.flex-xl-content-start{align-content:flex-start!important}.flex-xl-content-end{align-content:flex-end!important}.flex-xl-content-center{align-content:center!important}.flex-xl-content-between{align-content:space-between!important}.flex-xl-content-around{align-content:space-around!important}.flex-xl-content-stretch{align-content:stretch!important}.flex-xl-auto{flex:1 1 auto!important}.flex-xl-shrink-0{flex-shrink:0!important}.flex-xl-self-auto{align-self:auto!important}.flex-xl-self-start{align-self:flex-start!important}.flex-xl-self-end{align-self:flex-end!important}.flex-xl-self-center{align-self:center!important}.flex-xl-self-baseline{align-self:baseline!important}.flex-xl-self-stretch{align-self:stretch!important}.flex-xl-item-equal{flex-grow:1;flex-basis:0}}.position-static{position:static!important}.position-relative{position:relative!important}.position-absolute{position:absolute!important}.position-fixed{position:fixed!important}.top-0{top:0!important}.right-0{right:0!important}.bottom-0{bottom:0!important}.left-0{left:0!important}.v-align-middle{vertical-align:middle!important}.v-align-top{vertical-align:top!important}.v-align-bottom{vertical-align:bottom!important}.v-align-text-top{vertical-align:text-top!important}.v-align-text-bottom{vertical-align:text-bottom!important}.v-align-baseline{vertical-align:baseline!important}.overflow-hidden{overflow:hidden!important}.overflow-scroll{overflow:scroll!important}.overflow-auto{overflow:auto!important}.clearfix::before{display:table;content:""}.clearfix::after{display:table;clear:both;content:""}.float-left{float:left!important}.float-right{float:right!important}.float-none{float:none!important}@media (min-width:544px){.float-sm-left{float:left!important}.float-sm-right{float:right!important}.float-sm-none{float:none!important}}@media (min-width:768px){.float-md-left{float:left!important}.float-md-right{float:right!important}.float-md-none{float:none!important}}@media (min-width:1012px){.float-lg-left{float:left!important}.float-lg-right{float:right!important}.float-lg-none{float:none!important}}@media (min-width:1280px){.float-xl-left{float:left!important}.float-xl-right{float:right!important}.float-xl-none{float:none!important}}.width-fit{max-width:100%!important}.width-full{width:100%!important}.height-fit{max-height:100%!important}.height-full{height:100%!important}.min-width-0{min-width:0!important}.direction-rtl{direction:rtl!important}.direction-ltr{direction:ltr!important}@media (min-width:544px){.direction-sm-rtl{direction:rtl!important}.direction-sm-ltr{direction:ltr!important}}@media (min-width:768px){.direction-md-rtl{direction:rtl!important}.direction-md-ltr{direction:ltr!important}}@media (min-width:1012px){.direction-lg-rtl{direction:rtl!important}.direction-lg-ltr{direction:ltr!important}}@media (min-width:1280px){.direction-xl-rtl{direction:rtl!important}.direction-xl-ltr{direction:ltr!important}}.m-0{margin:0!important}.mt-0{margin-top:0!important}.mr-0{margin-right:0!important}.mb-0{margin-bottom:0!important}.ml-0{margin-left:0!important}.mx-0{margin-right:0!important;margin-left:0!important}.my-0{margin-top:0!important;margin-bottom:0!important}.m-1{margin:4px!important}.mt-1{margin-top:4px!important}.mr-1{margin-right:4px!important}.mb-1{margin-bottom:4px!important}.ml-1{margin-left:4px!important}.mt-n1{margin-top:-4px!important}.mr-n1{margin-right:-4px!important}.mb-n1{margin-bottom:-4px!important}.ml-n1{margin-left:-4px!important}.mx-1{margin-right:4px!important;margin-left:4px!important}.my-1{margin-top:4px!important;margin-bottom:4px!important}.m-2{margin:8px!important}.mt-2{margin-top:8px!important}.mr-2{margin-right:8px!important}.mb-2{margin-bottom:8px!important}.ml-2{margin-left:8px!important}.mt-n2{margin-top:-8px!important}.mr-n2{margin-right:-8px!important}.mb-n2{margin-bottom:-8px!important}.ml-n2{margin-left:-8px!important}.mx-2{margin-right:8px!important;margin-left:8px!important}.my-2{margin-top:8px!important;margin-bottom:8px!important}.m-3{margin:16px!important}.mt-3{margin-top:16px!important}.mr-3{margin-right:16px!important}.mb-3{margin-bottom:16px!important}.ml-3{margin-left:16px!important}.mt-n3{margin-top:-16px!important}.mr-n3{margin-right:-16px!important}.mb-n3{margin-bottom:-16px!important}.ml-n3{margin-left:-16px!important}.mx-3{margin-right:16px!important;margin-left:16px!important}.my-3{margin-top:16px!important;margin-bottom:16px!important}.m-4{margin:24px!important}.mt-4{margin-top:24px!important}.mr-4{margin-right:24px!important}.mb-4{margin-bottom:24px!important}.ml-4{margin-left:24px!important}.mt-n4{margin-top:-24px!important}.mr-n4{margin-right:-24px!important}.mb-n4{margin-bottom:-24px!important}.ml-n4{margin-left:-24px!important}.mx-4{margin-right:24px!important;margin-left:24px!important}.my-4{margin-top:24px!important;margin-bottom:24px!important}.m-5{margin:32px!important}.mt-5{margin-top:32px!important}.mr-5{margin-right:32px!important}.mb-5{margin-bottom:32px!important}.ml-5{margin-left:32px!important}.mt-n5{margin-top:-32px!important}.mr-n5{margin-right:-32px!important}.mb-n5{margin-bottom:-32px!important}.ml-n5{margin-left:-32px!important}.mx-5{margin-right:32px!important;margin-left:32px!important}.my-5{margin-top:32px!important;margin-bottom:32px!important}.m-6{margin:40px!important}.mt-6{margin-top:40px!important}.mr-6{margin-right:40px!important}.mb-6{margin-bottom:40px!important}.ml-6{margin-left:40px!important}.mt-n6{margin-top:-40px!important}.mr-n6{margin-right:-40px!important}.mb-n6{margin-bottom:-40px!important}.ml-n6{margin-left:-40px!important}.mx-6{margin-right:40px!important;margin-left:40px!important}.my-6{margin-top:40px!important;margin-bottom:40px!important}.mx-auto{margin-right:auto!important;margin-left:auto!important}@media (min-width:544px){.m-sm-0{margin:0!important}.mt-sm-0{margin-top:0!important}.mr-sm-0{margin-right:0!important}.mb-sm-0{margin-bottom:0!important}.ml-sm-0{margin-left:0!important}.mx-sm-0{margin-right:0!important;margin-left:0!important}.my-sm-0{margin-top:0!important;margin-bottom:0!important}.m-sm-1{margin:4px!important}.mt-sm-1{margin-top:4px!important}.mr-sm-1{margin-right:4px!important}.mb-sm-1{margin-bottom:4px!important}.ml-sm-1{margin-left:4px!important}.mt-sm-n1{margin-top:-4px!important}.mr-sm-n1{margin-right:-4px!important}.mb-sm-n1{margin-bottom:-4px!important}.ml-sm-n1{margin-left:-4px!important}.mx-sm-1{margin-right:4px!important;margin-left:4px!important}.my-sm-1{margin-top:4px!important;margin-bottom:4px!important}.m-sm-2{margin:8px!important}.mt-sm-2{margin-top:8px!important}.mr-sm-2{margin-right:8px!important}.mb-sm-2{margin-bottom:8px!important}.ml-sm-2{margin-left:8px!important}.mt-sm-n2{margin-top:-8px!important}.mr-sm-n2{margin-right:-8px!important}.mb-sm-n2{margin-bottom:-8px!important}.ml-sm-n2{margin-left:-8px!important}.mx-sm-2{margin-right:8px!important;margin-left:8px!important}.my-sm-2{margin-top:8px!important;margin-bottom:8px!important}.m-sm-3{margin:16px!important}.mt-sm-3{margin-top:16px!important}.mr-sm-3{margin-right:16px!important}.mb-sm-3{margin-bottom:16px!important}.ml-sm-3{margin-left:16px!important}.mt-sm-n3{margin-top:-16px!important}.mr-sm-n3{margin-right:-16px!important}.mb-sm-n3{margin-bottom:-16px!important}.ml-sm-n3{margin-left:-16px!important}.mx-sm-3{margin-right:16px!important;margin-left:16px!important}.my-sm-3{margin-top:16px!important;margin-bottom:16px!important}.m-sm-4{margin:24px!important}.mt-sm-4{margin-top:24px!important}.mr-sm-4{margin-right:24px!important}.mb-sm-4{margin-bottom:24px!important}.ml-sm-4{margin-left:24px!important}.mt-sm-n4{margin-top:-24px!important}.mr-sm-n4{margin-right:-24px!important}.mb-sm-n4{margin-bottom:-24px!important}.ml-sm-n4{margin-left:-24px!important}.mx-sm-4{margin-right:24px!important;margin-left:24px!important}.my-sm-4{margin-top:24px!important;margin-bottom:24px!important}.m-sm-5{margin:32px!important}.mt-sm-5{margin-top:32px!important}.mr-sm-5{margin-right:32px!important}.mb-sm-5{margin-bottom:32px!important}.ml-sm-5{margin-left:32px!important}.mt-sm-n5{margin-top:-32px!important}.mr-sm-n5{margin-right:-32px!important}.mb-sm-n5{margin-bottom:-32px!important}.ml-sm-n5{margin-left:-32px!important}.mx-sm-5{margin-right:32px!important;margin-left:32px!important}.my-sm-5{margin-top:32px!important;margin-bottom:32px!important}.m-sm-6{margin:40px!important}.mt-sm-6{margin-top:40px!important}.mr-sm-6{margin-right:40px!important}.mb-sm-6{margin-bottom:40px!important}.ml-sm-6{margin-left:40px!important}.mt-sm-n6{margin-top:-40px!important}.mr-sm-n6{margin-right:-40px!important}.mb-sm-n6{margin-bottom:-40px!important}.ml-sm-n6{margin-left:-40px!important}.mx-sm-6{margin-right:40px!important;margin-left:40px!important}.my-sm-6{margin-top:40px!important;margin-bottom:40px!important}.mx-sm-auto{margin-right:auto!important;margin-left:auto!important}}@media (min-width:768px){.m-md-0{margin:0!important}.mt-md-0{margin-top:0!important}.mr-md-0{margin-right:0!important}.mb-md-0{margin-bottom:0!important}.ml-md-0{margin-left:0!important}.mx-md-0{margin-right:0!important;margin-left:0!important}.my-md-0{margin-top:0!important;margin-bottom:0!important}.m-md-1{margin:4px!important}.mt-md-1{margin-top:4px!important}.mr-md-1{margin-right:4px!important}.mb-md-1{margin-bottom:4px!important}.ml-md-1{margin-left:4px!important}.mt-md-n1{margin-top:-4px!important}.mr-md-n1{margin-right:-4px!important}.mb-md-n1{margin-bottom:-4px!important}.ml-md-n1{margin-left:-4px!important}.mx-md-1{margin-right:4px!important;margin-left:4px!important}.my-md-1{margin-top:4px!important;margin-bottom:4px!important}.m-md-2{margin:8px!important}.mt-md-2{margin-top:8px!important}.mr-md-2{margin-right:8px!important}.mb-md-2{margin-bottom:8px!important}.ml-md-2{margin-left:8px!important}.mt-md-n2{margin-top:-8px!important}.mr-md-n2{margin-right:-8px!important}.mb-md-n2{margin-bottom:-8px!important}.ml-md-n2{margin-left:-8px!important}.mx-md-2{margin-right:8px!important;margin-left:8px!important}.my-md-2{margin-top:8px!important;margin-bottom:8px!important}.m-md-3{margin:16px!important}.mt-md-3{margin-top:16px!important}.mr-md-3{margin-right:16px!important}.mb-md-3{margin-bottom:16px!important}.ml-md-3{margin-left:16px!important}.mt-md-n3{margin-top:-16px!important}.mr-md-n3{margin-right:-16px!important}.mb-md-n3{margin-bottom:-16px!important}.ml-md-n3{margin-left:-16px!important}.mx-md-3{margin-right:16px!important;margin-left:16px!important}.my-md-3{margin-top:16px!important;margin-bottom:16px!important}.m-md-4{margin:24px!important}.mt-md-4{margin-top:24px!important}.mr-md-4{margin-right:24px!important}.mb-md-4{margin-bottom:24px!important}.ml-md-4{margin-left:24px!important}.mt-md-n4{margin-top:-24px!important}.mr-md-n4{margin-right:-24px!important}.mb-md-n4{margin-bottom:-24px!important}.ml-md-n4{margin-left:-24px!important}.mx-md-4{margin-right:24px!important;margin-left:24px!important}.my-md-4{margin-top:24px!important;margin-bottom:24px!important}.m-md-5{margin:32px!important}.mt-md-5{margin-top:32px!important}.mr-md-5{margin-right:32px!important}.mb-md-5{margin-bottom:32px!important}.ml-md-5{margin-left:32px!important}.mt-md-n5{margin-top:-32px!important}.mr-md-n5{margin-right:-32px!important}.mb-md-n5{margin-bottom:-32px!important}.ml-md-n5{margin-left:-32px!important}.mx-md-5{margin-right:32px!important;margin-left:32px!important}.my-md-5{margin-top:32px!important;margin-bottom:32px!important}.m-md-6{margin:40px!important}.mt-md-6{margin-top:40px!important}.mr-md-6{margin-right:40px!important}.mb-md-6{margin-bottom:40px!important}.ml-md-6{margin-left:40px!important}.mt-md-n6{margin-top:-40px!important}.mr-md-n6{margin-right:-40px!important}.mb-md-n6{margin-bottom:-40px!important}.ml-md-n6{margin-left:-40px!important}.mx-md-6{margin-right:40px!important;margin-left:40px!important}.my-md-6{margin-top:40px!important;margin-bottom:40px!important}.mx-md-auto{margin-right:auto!important;margin-left:auto!important}}@media (min-width:1012px){.m-lg-0{margin:0!important}.mt-lg-0{margin-top:0!important}.mr-lg-0{margin-right:0!important}.mb-lg-0{margin-bottom:0!important}.ml-lg-0{margin-left:0!important}.mx-lg-0{margin-right:0!important;margin-left:0!important}.my-lg-0{margin-top:0!important;margin-bottom:0!important}.m-lg-1{margin:4px!important}.mt-lg-1{margin-top:4px!important}.mr-lg-1{margin-right:4px!important}.mb-lg-1{margin-bottom:4px!important}.ml-lg-1{margin-left:4px!important}.mt-lg-n1{margin-top:-4px!important}.mr-lg-n1{margin-right:-4px!important}.mb-lg-n1{margin-bottom:-4px!important}.ml-lg-n1{margin-left:-4px!important}.mx-lg-1{margin-right:4px!important;margin-left:4px!important}.my-lg-1{margin-top:4px!important;margin-bottom:4px!important}.m-lg-2{margin:8px!important}.mt-lg-2{margin-top:8px!important}.mr-lg-2{margin-right:8px!important}.mb-lg-2{margin-bottom:8px!important}.ml-lg-2{margin-left:8px!important}.mt-lg-n2{margin-top:-8px!important}.mr-lg-n2{margin-right:-8px!important}.mb-lg-n2{margin-bottom:-8px!important}.ml-lg-n2{margin-left:-8px!important}.mx-lg-2{margin-right:8px!important;margin-left:8px!important}.my-lg-2{margin-top:8px!important;margin-bottom:8px!important}.m-lg-3{margin:16px!important}.mt-lg-3{margin-top:16px!important}.mr-lg-3{margin-right:16px!important}.mb-lg-3{margin-bottom:16px!important}.ml-lg-3{margin-left:16px!important}.mt-lg-n3{margin-top:-16px!important}.mr-lg-n3{margin-right:-16px!important}.mb-lg-n3{margin-bottom:-16px!important}.ml-lg-n3{margin-left:-16px!important}.mx-lg-3{margin-right:16px!important;margin-left:16px!important}.my-lg-3{margin-top:16px!important;margin-bottom:16px!important}.m-lg-4{margin:24px!important}.mt-lg-4{margin-top:24px!important}.mr-lg-4{margin-right:24px!important}.mb-lg-4{margin-bottom:24px!important}.ml-lg-4{margin-left:24px!important}.mt-lg-n4{margin-top:-24px!important}.mr-lg-n4{margin-right:-24px!important}.mb-lg-n4{margin-bottom:-24px!important}.ml-lg-n4{margin-left:-24px!important}.mx-lg-4{margin-right:24px!important;margin-left:24px!important}.my-lg-4{margin-top:24px!important;margin-bottom:24px!important}.m-lg-5{margin:32px!important}.mt-lg-5{margin-top:32px!important}.mr-lg-5{margin-right:32px!important}.mb-lg-5{margin-bottom:32px!important}.ml-lg-5{margin-left:32px!important}.mt-lg-n5{margin-top:-32px!important}.mr-lg-n5{margin-right:-32px!important}.mb-lg-n5{margin-bottom:-32px!important}.ml-lg-n5{margin-left:-32px!important}.mx-lg-5{margin-right:32px!important;margin-left:32px!important}.my-lg-5{margin-top:32px!important;margin-bottom:32px!important}.m-lg-6{margin:40px!important}.mt-lg-6{margin-top:40px!important}.mr-lg-6{margin-right:40px!important}.mb-lg-6{margin-bottom:40px!important}.ml-lg-6{margin-left:40px!important}.mt-lg-n6{margin-top:-40px!important}.mr-lg-n6{margin-right:-40px!important}.mb-lg-n6{margin-bottom:-40px!important}.ml-lg-n6{margin-left:-40px!important}.mx-lg-6{margin-right:40px!important;margin-left:40px!important}.my-lg-6{margin-top:40px!important;margin-bottom:40px!important}.mx-lg-auto{margin-right:auto!important;margin-left:auto!important}}@media (min-width:1280px){.m-xl-0{margin:0!important}.mt-xl-0{margin-top:0!important}.mr-xl-0{margin-right:0!important}.mb-xl-0{margin-bottom:0!important}.ml-xl-0{margin-left:0!important}.mx-xl-0{margin-right:0!important;margin-left:0!important}.my-xl-0{margin-top:0!important;margin-bottom:0!important}.m-xl-1{margin:4px!important}.mt-xl-1{margin-top:4px!important}.mr-xl-1{margin-right:4px!important}.mb-xl-1{margin-bottom:4px!important}.ml-xl-1{margin-left:4px!important}.mt-xl-n1{margin-top:-4px!important}.mr-xl-n1{margin-right:-4px!important}.mb-xl-n1{margin-bottom:-4px!important}.ml-xl-n1{margin-left:-4px!important}.mx-xl-1{margin-right:4px!important;margin-left:4px!important}.my-xl-1{margin-top:4px!important;margin-bottom:4px!important}.m-xl-2{margin:8px!important}.mt-xl-2{margin-top:8px!important}.mr-xl-2{margin-right:8px!important}.mb-xl-2{margin-bottom:8px!important}.ml-xl-2{margin-left:8px!important}.mt-xl-n2{margin-top:-8px!important}.mr-xl-n2{margin-right:-8px!important}.mb-xl-n2{margin-bottom:-8px!important}.ml-xl-n2{margin-left:-8px!important}.mx-xl-2{margin-right:8px!important;margin-left:8px!important}.my-xl-2{margin-top:8px!important;margin-bottom:8px!important}.m-xl-3{margin:16px!important}.mt-xl-3{margin-top:16px!important}.mr-xl-3{margin-right:16px!important}.mb-xl-3{margin-bottom:16px!important}.ml-xl-3{margin-left:16px!important}.mt-xl-n3{margin-top:-16px!important}.mr-xl-n3{margin-right:-16px!important}.mb-xl-n3{margin-bottom:-16px!important}.ml-xl-n3{margin-left:-16px!important}.mx-xl-3{margin-right:16px!important;margin-left:16px!important}.my-xl-3{margin-top:16px!important;margin-bottom:16px!important}.m-xl-4{margin:24px!important}.mt-xl-4{margin-top:24px!important}.mr-xl-4{margin-right:24px!important}.mb-xl-4{margin-bottom:24px!important}.ml-xl-4{margin-left:24px!important}.mt-xl-n4{margin-top:-24px!important}.mr-xl-n4{margin-right:-24px!important}.mb-xl-n4{margin-bottom:-24px!important}.ml-xl-n4{margin-left:-24px!important}.mx-xl-4{margin-right:24px!important;margin-left:24px!important}.my-xl-4{margin-top:24px!important;margin-bottom:24px!important}.m-xl-5{margin:32px!important}.mt-xl-5{margin-top:32px!important}.mr-xl-5{margin-right:32px!important}.mb-xl-5{margin-bottom:32px!important}.ml-xl-5{margin-left:32px!important}.mt-xl-n5{margin-top:-32px!important}.mr-xl-n5{margin-right:-32px!important}.mb-xl-n5{margin-bottom:-32px!important}.ml-xl-n5{margin-left:-32px!important}.mx-xl-5{margin-right:32px!important;margin-left:32px!important}.my-xl-5{margin-top:32px!important;margin-bottom:32px!important}.m-xl-6{margin:40px!important}.mt-xl-6{margin-top:40px!important}.mr-xl-6{margin-right:40px!important}.mb-xl-6{margin-bottom:40px!important}.ml-xl-6{margin-left:40px!important}.mt-xl-n6{margin-top:-40px!important}.mr-xl-n6{margin-right:-40px!important}.mb-xl-n6{margin-bottom:-40px!important}.ml-xl-n6{margin-left:-40px!important}.mx-xl-6{margin-right:40px!important;margin-left:40px!important}.my-xl-6{margin-top:40px!important;margin-bottom:40px!important}.mx-xl-auto{margin-right:auto!important;margin-left:auto!important}}.p-0{padding:0!important}.pt-0{padding-top:0!important}.pr-0{padding-right:0!important}.pb-0{padding-bottom:0!important}.pl-0{padding-left:0!important}.px-0{padding-right:0!important;padding-left:0!important}.py-0{padding-top:0!important;padding-bottom:0!important}.p-1{padding:4px!important}.pt-1{padding-top:4px!important}.pr-1{padding-right:4px!important}.pb-1{padding-bottom:4px!important}.pl-1{padding-left:4px!important}.px-1{padding-right:4px!important;padding-left:4px!important}.py-1{padding-top:4px!important;padding-bottom:4px!important}.p-2{padding:8px!important}.pt-2{padding-top:8px!important}.pr-2{padding-right:8px!important}.pb-2{padding-bottom:8px!important}.pl-2{padding-left:8px!important}.px-2{padding-right:8px!important;padding-left:8px!important}.py-2{padding-top:8px!important;padding-bottom:8px!important}.p-3{padding:16px!important}.pt-3{padding-top:16px!important}.pr-3{padding-right:16px!important}.pb-3{padding-bottom:16px!important}.pl-3{padding-left:16px!important}.px-3{padding-right:16px!important;padding-left:16px!important}.py-3{padding-top:16px!important;padding-bottom:16px!important}.p-4{padding:24px!important}.pt-4{padding-top:24px!important}.pr-4{padding-right:24px!important}.pb-4{padding-bottom:24px!important}.pl-4{padding-left:24px!important}.px-4{padding-right:24px!important;padding-left:24px!important}.py-4{padding-top:24px!important;padding-bottom:24px!important}.p-5{padding:32px!important}.pt-5{padding-top:32px!important}.pr-5{padding-right:32px!important}.pb-5{padding-bottom:32px!important}.pl-5{padding-left:32px!important}.px-5{padding-right:32px!important;padding-left:32px!important}.py-5{padding-top:32px!important;padding-bottom:32px!important}.p-6{padding:40px!important}.pt-6{padding-top:40px!important}.pr-6{padding-right:40px!important}.pb-6{padding-bottom:40px!important}.pl-6{padding-left:40px!important}.px-6{padding-right:40px!important;padding-left:40px!important}.py-6{padding-top:40px!important;padding-bottom:40px!important}@media (min-width:544px){.p-sm-0{padding:0!important}.pt-sm-0{padding-top:0!important}.pr-sm-0{padding-right:0!important}.pb-sm-0{padding-bottom:0!important}.pl-sm-0{padding-left:0!important}.px-sm-0{padding-right:0!important;padding-left:0!important}.py-sm-0{padding-top:0!important;padding-bottom:0!important}.p-sm-1{padding:4px!important}.pt-sm-1{padding-top:4px!important}.pr-sm-1{padding-right:4px!important}.pb-sm-1{padding-bottom:4px!important}.pl-sm-1{padding-left:4px!important}.px-sm-1{padding-right:4px!important;padding-left:4px!important}.py-sm-1{padding-top:4px!important;padding-bottom:4px!important}.p-sm-2{padding:8px!important}.pt-sm-2{padding-top:8px!important}.pr-sm-2{padding-right:8px!important}.pb-sm-2{padding-bottom:8px!important}.pl-sm-2{padding-left:8px!important}.px-sm-2{padding-right:8px!important;padding-left:8px!important}.py-sm-2{padding-top:8px!important;padding-bottom:8px!important}.p-sm-3{padding:16px!important}.pt-sm-3{padding-top:16px!important}.pr-sm-3{padding-right:16px!important}.pb-sm-3{padding-bottom:16px!important}.pl-sm-3{padding-left:16px!important}.px-sm-3{padding-right:16px!important;padding-left:16px!important}.py-sm-3{padding-top:16px!important;padding-bottom:16px!important}.p-sm-4{padding:24px!important}.pt-sm-4{padding-top:24px!important}.pr-sm-4{padding-right:24px!important}.pb-sm-4{padding-bottom:24px!important}.pl-sm-4{padding-left:24px!important}.px-sm-4{padding-right:24px!important;padding-left:24px!important}.py-sm-4{padding-top:24px!important;padding-bottom:24px!important}.p-sm-5{padding:32px!important}.pt-sm-5{padding-top:32px!important}.pr-sm-5{padding-right:32px!important}.pb-sm-5{padding-bottom:32px!important}.pl-sm-5{padding-left:32px!important}.px-sm-5{padding-right:32px!important;padding-left:32px!important}.py-sm-5{padding-top:32px!important;padding-bottom:32px!important}.p-sm-6{padding:40px!important}.pt-sm-6{padding-top:40px!important}.pr-sm-6{padding-right:40px!important}.pb-sm-6{padding-bottom:40px!important}.pl-sm-6{padding-left:40px!important}.px-sm-6{padding-right:40px!important;padding-left:40px!important}.py-sm-6{padding-top:40px!important;padding-bottom:40px!important}}@media (min-width:768px){.p-md-0{padding:0!important}.pt-md-0{padding-top:0!important}.pr-md-0{padding-right:0!important}.pb-md-0{padding-bottom:0!important}.pl-md-0{padding-left:0!important}.px-md-0{padding-right:0!important;padding-left:0!important}.py-md-0{padding-top:0!important;padding-bottom:0!important}.p-md-1{padding:4px!important}.pt-md-1{padding-top:4px!important}.pr-md-1{padding-right:4px!important}.pb-md-1{padding-bottom:4px!important}.pl-md-1{padding-left:4px!important}.px-md-1{padding-right:4px!important;padding-left:4px!important}.py-md-1{padding-top:4px!important;padding-bottom:4px!important}.p-md-2{padding:8px!important}.pt-md-2{padding-top:8px!important}.pr-md-2{padding-right:8px!important}.pb-md-2{padding-bottom:8px!important}.pl-md-2{padding-left:8px!important}.px-md-2{padding-right:8px!important;padding-left:8px!important}.py-md-2{padding-top:8px!important;padding-bottom:8px!important}.p-md-3{padding:16px!important}.pt-md-3{padding-top:16px!important}.pr-md-3{padding-right:16px!important}.pb-md-3{padding-bottom:16px!important}.pl-md-3{padding-left:16px!important}.px-md-3{padding-right:16px!important;padding-left:16px!important}.py-md-3{padding-top:16px!important;padding-bottom:16px!important}.p-md-4{padding:24px!important}.pt-md-4{padding-top:24px!important}.pr-md-4{padding-right:24px!important}.pb-md-4{padding-bottom:24px!important}.pl-md-4{padding-left:24px!important}.px-md-4{padding-right:24px!important;padding-left:24px!important}.py-md-4{padding-top:24px!important;padding-bottom:24px!important}.p-md-5{padding:32px!important}.pt-md-5{padding-top:32px!important}.pr-md-5{padding-right:32px!important}.pb-md-5{padding-bottom:32px!important}.pl-md-5{padding-left:32px!important}.px-md-5{padding-right:32px!important;padding-left:32px!important}.py-md-5{padding-top:32px!important;padding-bottom:32px!important}.p-md-6{padding:40px!important}.pt-md-6{padding-top:40px!important}.pr-md-6{padding-right:40px!important}.pb-md-6{padding-bottom:40px!important}.pl-md-6{padding-left:40px!important}.px-md-6{padding-right:40px!important;padding-left:40px!important}.py-md-6{padding-top:40px!important;padding-bottom:40px!important}}@media (min-width:1012px){.p-lg-0{padding:0!important}.pt-lg-0{padding-top:0!important}.pr-lg-0{padding-right:0!important}.pb-lg-0{padding-bottom:0!important}.pl-lg-0{padding-left:0!important}.px-lg-0{padding-right:0!important;padding-left:0!important}.py-lg-0{padding-top:0!important;padding-bottom:0!important}.p-lg-1{padding:4px!important}.pt-lg-1{padding-top:4px!important}.pr-lg-1{padding-right:4px!important}.pb-lg-1{padding-bottom:4px!important}.pl-lg-1{padding-left:4px!important}.px-lg-1{padding-right:4px!important;padding-left:4px!important}.py-lg-1{padding-top:4px!important;padding-bottom:4px!important}.p-lg-2{padding:8px!important}.pt-lg-2{padding-top:8px!important}.pr-lg-2{padding-right:8px!important}.pb-lg-2{padding-bottom:8px!important}.pl-lg-2{padding-left:8px!important}.px-lg-2{padding-right:8px!important;padding-left:8px!important}.py-lg-2{padding-top:8px!important;padding-bottom:8px!important}.p-lg-3{padding:16px!important}.pt-lg-3{padding-top:16px!important}.pr-lg-3{padding-right:16px!important}.pb-lg-3{padding-bottom:16px!important}.pl-lg-3{padding-left:16px!important}.px-lg-3{padding-right:16px!important;padding-left:16px!important}.py-lg-3{padding-top:16px!important;padding-bottom:16px!important}.p-lg-4{padding:24px!important}.pt-lg-4{padding-top:24px!important}.pr-lg-4{padding-right:24px!important}.pb-lg-4{padding-bottom:24px!important}.pl-lg-4{padding-left:24px!important}.px-lg-4{padding-right:24px!important;padding-left:24px!important}.py-lg-4{padding-top:24px!important;padding-bottom:24px!important}.p-lg-5{padding:32px!important}.pt-lg-5{padding-top:32px!important}.pr-lg-5{padding-right:32px!important}.pb-lg-5{padding-bottom:32px!important}.pl-lg-5{padding-left:32px!important}.px-lg-5{padding-right:32px!important;padding-left:32px!important}.py-lg-5{padding-top:32px!important;padding-bottom:32px!important}.p-lg-6{padding:40px!important}.pt-lg-6{padding-top:40px!important}.pr-lg-6{padding-right:40px!important}.pb-lg-6{padding-bottom:40px!important}.pl-lg-6{padding-left:40px!important}.px-lg-6{padding-right:40px!important;padding-left:40px!important}.py-lg-6{padding-top:40px!important;padding-bottom:40px!important}}@media (min-width:1280px){.p-xl-0{padding:0!important}.pt-xl-0{padding-top:0!important}.pr-xl-0{padding-right:0!important}.pb-xl-0{padding-bottom:0!important}.pl-xl-0{padding-left:0!important}.px-xl-0{padding-right:0!important;padding-left:0!important}.py-xl-0{padding-top:0!important;padding-bottom:0!important}.p-xl-1{padding:4px!important}.pt-xl-1{padding-top:4px!important}.pr-xl-1{padding-right:4px!important}.pb-xl-1{padding-bottom:4px!important}.pl-xl-1{padding-left:4px!important}.px-xl-1{padding-right:4px!important;padding-left:4px!important}.py-xl-1{padding-top:4px!important;padding-bottom:4px!important}.p-xl-2{padding:8px!important}.pt-xl-2{padding-top:8px!important}.pr-xl-2{padding-right:8px!important}.pb-xl-2{padding-bottom:8px!important}.pl-xl-2{padding-left:8px!important}.px-xl-2{padding-right:8px!important;padding-left:8px!important}.py-xl-2{padding-top:8px!important;padding-bottom:8px!important}.p-xl-3{padding:16px!important}.pt-xl-3{padding-top:16px!important}.pr-xl-3{padding-right:16px!important}.pb-xl-3{padding-bottom:16px!important}.pl-xl-3{padding-left:16px!important}.px-xl-3{padding-right:16px!important;padding-left:16px!important}.py-xl-3{padding-top:16px!important;padding-bottom:16px!important}.p-xl-4{padding:24px!important}.pt-xl-4{padding-top:24px!important}.pr-xl-4{padding-right:24px!important}.pb-xl-4{padding-bottom:24px!important}.pl-xl-4{padding-left:24px!important}.px-xl-4{padding-right:24px!important;padding-left:24px!important}.py-xl-4{padding-top:24px!important;padding-bottom:24px!important}.p-xl-5{padding:32px!important}.pt-xl-5{padding-top:32px!important}.pr-xl-5{padding-right:32px!important}.pb-xl-5{padding-bottom:32px!important}.pl-xl-5{padding-left:32px!important}.px-xl-5{padding-right:32px!important;padding-left:32px!important}.py-xl-5{padding-top:32px!important;padding-bottom:32px!important}.p-xl-6{padding:40px!important}.pt-xl-6{padding-top:40px!important}.pr-xl-6{padding-right:40px!important}.pb-xl-6{padding-bottom:40px!important}.pl-xl-6{padding-left:40px!important}.px-xl-6{padding-right:40px!important;padding-left:40px!important}.py-xl-6{padding-top:40px!important;padding-bottom:40px!important}}.p-responsive{padding-right:16px!important;padding-left:16px!important}@media (min-width:544px){.p-responsive{padding-right:40px!important;padding-left:40px!important}}@media (min-width:1012px){.p-responsive{padding-right:16px!important;padding-left:16px!important}}.h1{font-size:26px!important}@media (min-width:768px){.h1{font-size:32px!important}}.h2{font-size:22px!important}@media (min-width:768px){.h2{font-size:24px!important}}.h3{font-size:18px!important}@media (min-width:768px){.h3{font-size:20px!important}}.h4{font-size:16px!important}.h5{font-size:14px!important}.h6{font-size:12px!important}.h1,.h2,.h3,.h4,.h5,.h6{font-weight:600!important}.f1{font-size:26px!important}@media (min-width:768px){.f1{font-size:32px!important}}.f2{font-size:22px!important}@media (min-width:768px){.f2{font-size:24px!important}}.f3{font-size:18px!important}@media (min-width:768px){.f3{font-size:20px!important}}.f4{font-size:16px!important}@media (min-width:768px){.f4{font-size:16px!important}}.f5{font-size:14px!important}.f6{font-size:12px!important}.f00-light{font-size:40px!important;font-weight:300!important}@media (min-width:768px){.f00-light{font-size:48px!important}}.f0-light{font-size:32px!important;font-weight:300!important}@media (min-width:768px){.f0-light{font-size:40px!important}}.f1-light{font-size:26px!important;font-weight:300!important}@media (min-width:768px){.f1-light{font-size:32px!important}}.f2-light{font-size:22px!important;font-weight:300!important}@media (min-width:768px){.f2-light{font-size:24px!important}}.f3-light{font-size:18px!important;font-weight:300!important}@media (min-width:768px){.f3-light{font-size:20px!important}}.text-small{font-size:12px!important}.lead{margin-bottom:30px;font-size:20px;font-weight:300;color:#586069}.lh-condensed-ultra{line-height:1!important}.lh-condensed{line-height:1.25!important}.lh-default{line-height:1.5!important}.lh-0{line-height:0!important}.text-right{text-align:right!important}.text-left{text-align:left!important}.text-center{text-align:center!important}@media (min-width:544px){.text-sm-right{text-align:right!important}.text-sm-left{text-align:left!important}.text-sm-center{text-align:center!important}}@media (min-width:768px){.text-md-right{text-align:right!important}.text-md-left{text-align:left!important}.text-md-center{text-align:center!important}}@media (min-width:1012px){.text-lg-right{text-align:right!important}.text-lg-left{text-align:left!important}.text-lg-center{text-align:center!important}}@media (min-width:1280px){.text-xl-right{text-align:right!important}.text-xl-left{text-align:left!important}.text-xl-center{text-align:center!important}}.text-normal{font-weight:400!important}.text-bold{font-weight:600!important}.text-italic{font-style:italic!important}.text-uppercase{text-transform:uppercase!important}.text-underline{text-decoration:underline!important}.no-underline{text-decoration:none!important}.no-wrap{white-space:nowrap!important}.ws-normal{white-space:normal!important}.wb-break-all{word-break:break-all!important}.text-emphasized{font-weight:600;color:#24292e}.list-style-none{list-style:none!important}.text-shadow-dark{text-shadow:0 1px 1px rgba(27,31,35,.25),0 1px 25px rgba(27,31,35,.75)}.text-shadow-light{text-shadow:0 1px 0 rgba(255,255,255,.5)}.text-mono{font-family:SFMono-Regular,Consolas,"Liberation Mono",Menlo,Courier,monospace}.user-select-none{user-select:none!important}.d-block{display:block!important}.d-flex{display:flex!important}.d-inline{display:inline!important}.d-inline-block{display:inline-block!important}.d-inline-flex{display:inline-flex!important}.d-none{display:none!important}.d-table{display:table!important}.d-table-cell{display:table-cell!important}@media (min-width:544px){.d-sm-block{display:block!important}.d-sm-flex{display:flex!important}.d-sm-inline{display:inline!important}.d-sm-inline-block{display:inline-block!important}.d-sm-inline-flex{display:inline-flex!important}.d-sm-none{display:none!important}.d-sm-table{display:table!important}.d-sm-table-cell{display:table-cell!important}}@media (min-width:768px){.d-md-block{display:block!important}.d-md-flex{display:flex!important}.d-md-inline{display:inline!important}.d-md-inline-block{display:inline-block!important}.d-md-inline-flex{display:inline-flex!important}.d-md-none{display:none!important}.d-md-table{display:table!important}.d-md-table-cell{display:table-cell!important}}@media (min-width:1012px){.d-lg-block{display:block!important}.d-lg-flex{display:flex!important}.d-lg-inline{display:inline!important}.d-lg-inline-block{display:inline-block!important}.d-lg-inline-flex{display:inline-flex!important}.d-lg-none{display:none!important}.d-lg-table{display:table!important}.d-lg-table-cell{display:table-cell!important}}@media (min-width:1280px){.d-xl-block{display:block!important}.d-xl-flex{display:flex!important}.d-xl-inline{display:inline!important}.d-xl-inline-block{display:inline-block!important}.d-xl-inline-flex{display:inline-flex!important}.d-xl-none{display:none!important}.d-xl-table{display:table!important}.d-xl-table-cell{display:table-cell!important}}.v-hidden{visibility:hidden!important}.v-visible{visibility:visible!important}@media (max-width:544px){.hide-sm{display:none!important}}@media (min-width:544px) and(max-width:768px){.hide-md{display:none!important}}@media (min-width:768px) and(max-width:1012px){.hide-lg{display:none!important}}@media (min-width:1012px){.hide-xl{display:none!important}}.table-fixed{table-layout:fixed!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);word-wrap:normal;border:0}.show-on-focus{position:absolute;width:1px;height:1px;margin:0;overflow:hidden;clip:rect(1px,1px,1px,1px)}.show-on-focus:focus{z-index:20;width:auto;height:auto;clip:auto}.container{width:980px;margin-right:auto;margin-left:auto}.container::before{display:table;content:""}.container::after{display:table;clear:both;content:""}.container-md{max-width:768px;margin-right:auto;margin-left:auto}.container-lg{max-width:1012px;margin-right:auto;margin-left:auto}.container-xl{max-width:1280px;margin-right:auto;margin-left:auto}.columns{margin-right:-10px;margin-left:-10px}.columns::before{display:table;content:""}.columns::after{display:table;clear:both;content:""}.column{float:left;padding-right:10px;padding-left:10px}.one-third{width:33.333333%}.two-thirds{width:66.666667%}.one-fourth{width:25%}.one-half{width:50%}.three-fourths{width:75%}.one-fifth{width:20%}.four-fifths{width:80%}.centered{display:block;float:none;margin-right:auto;margin-left:auto}.col-1{width:8.3333333333%}.col-2{width:16.6666666667%}.col-3{width:25%}.col-4{width:33.3333333333%}.col-5{width:41.6666666667%}.col-6{width:50%}.col-7{width:58.3333333333%}.col-8{width:66.6666666667%}.col-9{width:75%}.col-10{width:83.3333333333%}.col-11{width:91.6666666667%}.col-12{width:100%}@media (min-width:544px){.col-sm-1{width:8.3333333333%}.col-sm-2{width:16.6666666667%}.col-sm-3{width:25%}.col-sm-4{width:33.3333333333%}.col-sm-5{width:41.6666666667%}.col-sm-6{width:50%}.col-sm-7{width:58.3333333333%}.col-sm-8{width:66.6666666667%}.col-sm-9{width:75%}.col-sm-10{width:83.3333333333%}.col-sm-11{width:91.6666666667%}.col-sm-12{width:100%}}@media (min-width:768px){.col-md-1{width:8.3333333333%}.col-md-2{width:16.6666666667%}.col-md-3{width:25%}.col-md-4{width:33.3333333333%}.col-md-5{width:41.6666666667%}.col-md-6{width:50%}.col-md-7{width:58.3333333333%}.col-md-8{width:66.6666666667%}.col-md-9{width:75%}.col-md-10{width:83.3333333333%}.col-md-11{width:91.6666666667%}.col-md-12{width:100%}}@media (min-width:1012px){.col-lg-1{width:8.3333333333%}.col-lg-2{width:16.6666666667%}.col-lg-3{width:25%}.col-lg-4{width:33.3333333333%}.col-lg-5{width:41.6666666667%}.col-lg-6{width:50%}.col-lg-7{width:58.3333333333%}.col-lg-8{width:66.6666666667%}.col-lg-9{width:75%}.col-lg-10{width:83.3333333333%}.col-lg-11{width:91.6666666667%}.col-lg-12{width:100%}}@media (min-width:1280px){.col-xl-1{width:8.3333333333%}.col-xl-2{width:16.6666666667%}.col-xl-3{width:25%}.col-xl-4{width:33.3333333333%}.col-xl-5{width:41.6666666667%}.col-xl-6{width:50%}.col-xl-7{width:58.3333333333%}.col-xl-8{width:66.6666666667%}.col-xl-9{width:75%}.col-xl-10{width:83.3333333333%}.col-xl-11{width:91.6666666667%}.col-xl-12{width:100%}}.gutter{margin-right:-16px;margin-left:-16px}.gutter>[class*=col-]{padding-right:16px!important;padding-left:16px!important}.gutter-condensed{margin-right:-8px;margin-left:-8px}.gutter-condensed>[class*=col-]{padding-right:8px!important;padding-left:8px!important}.gutter-spacious{margin-right:-24px;margin-left:-24px}.gutter-spacious>[class*=col-]{padding-right:24px!important;padding-left:24px!important}@media (min-width:544px){.gutter-sm{margin-right:-16px;margin-left:-16px}.gutter-sm>[class*=col-]{padding-right:16px!important;padding-left:16px!important}.gutter-sm-condensed{margin-right:-8px;margin-left:-8px}.gutter-sm-condensed>[class*=col-]{padding-right:8px!important;padding-left:8px!important}.gutter-sm-spacious{margin-right:-24px;margin-left:-24px}.gutter-sm-spacious>[class*=col-]{padding-right:24px!important;padding-left:24px!important}}@media (min-width:768px){.gutter-md{margin-right:-16px;margin-left:-16px}.gutter-md>[class*=col-]{padding-right:16px!important;padding-left:16px!important}.gutter-md-condensed{margin-right:-8px;margin-left:-8px}.gutter-md-condensed>[class*=col-]{padding-right:8px!important;padding-left:8px!important}.gutter-md-spacious{margin-right:-24px;margin-left:-24px}.gutter-md-spacious>[class*=col-]{padding-right:24px!important;padding-left:24px!important}}@media (min-width:1012px){.gutter-lg{margin-right:-16px;margin-left:-16px}.gutter-lg>[class*=col-]{padding-right:16px!important;padding-left:16px!important}.gutter-lg-condensed{margin-right:-8px;margin-left:-8px}.gutter-lg-condensed>[class*=col-]{padding-right:8px!important;padding-left:8px!important}.gutter-lg-spacious{margin-right:-24px;margin-left:-24px}.gutter-lg-spacious>[class*=col-]{padding-right:24px!important;padding-left:24px!important}}@media (min-width:1280px){.gutter-xl{margin-right:-16px;margin-left:-16px}.gutter-xl>[class*=col-]{padding-right:16px!important;padding-left:16px!important}.gutter-xl-condensed{margin-right:-8px;margin-left:-8px}.gutter-xl-condensed>[class*=col-]{padding-right:8px!important;padding-left:8px!important}.gutter-xl-spacious{margin-right:-24px;margin-left:-24px}.gutter-xl-spacious>[class*=col-]{padding-right:24px!important;padding-left:24px!important}}.offset-1{margin-left:8.3333333333%!important}.offset-2{margin-left:16.6666666667%!important}.offset-3{margin-left:25%!important}.offset-4{margin-left:33.3333333333%!important}.offset-5{margin-left:41.6666666667%!important}.offset-6{margin-left:50%!important}.offset-7{margin-left:58.3333333333%!important}.offset-8{margin-left:66.6666666667%!important}.offset-9{margin-left:75%!important}.offset-10{margin-left:83.3333333333%!important}.offset-11{margin-left:91.6666666667%!important}@media (min-width:544px){.offset-sm-1{margin-left:8.3333333333%!important}.offset-sm-2{margin-left:16.6666666667%!important}.offset-sm-3{margin-left:25%!important}.offset-sm-4{margin-left:33.3333333333%!important}.offset-sm-5{margin-left:41.6666666667%!important}.offset-sm-6{margin-left:50%!important}.offset-sm-7{margin-left:58.3333333333%!important}.offset-sm-8{margin-left:66.6666666667%!important}.offset-sm-9{margin-left:75%!important}.offset-sm-10{margin-left:83.3333333333%!important}.offset-sm-11{margin-left:91.6666666667%!important}}@media (min-width:768px){.offset-md-1{margin-left:8.3333333333%!important}.offset-md-2{margin-left:16.6666666667%!important}.offset-md-3{margin-left:25%!important}.offset-md-4{margin-left:33.3333333333%!important}.offset-md-5{margin-left:41.6666666667%!important}.offset-md-6{margin-left:50%!important}.offset-md-7{margin-left:58.3333333333%!important}.offset-md-8{margin-left:66.6666666667%!important}.offset-md-9{margin-left:75%!important}.offset-md-10{margin-left:83.3333333333%!important}.offset-md-11{margin-left:91.6666666667%!important}}@media (min-width:1012px){.offset-lg-1{margin-left:8.3333333333%!important}.offset-lg-2{margin-left:16.6666666667%!important}.offset-lg-3{margin-left:25%!important}.offset-lg-4{margin-left:33.3333333333%!important}.offset-lg-5{margin-left:41.6666666667%!important}.offset-lg-6{margin-left:50%!important}.offset-lg-7{margin-left:58.3333333333%!important}.offset-lg-8{margin-left:66.6666666667%!important}.offset-lg-9{margin-left:75%!important}.offset-lg-10{margin-left:83.3333333333%!important}.offset-lg-11{margin-left:91.6666666667%!important}}@media (min-width:1280px){.offset-xl-1{margin-left:8.3333333333%!important}.offset-xl-2{margin-left:16.6666666667%!important}.offset-xl-3{margin-left:25%!important}.offset-xl-4{margin-left:33.3333333333%!important}.offset-xl-5{margin-left:41.6666666667%!important}.offset-xl-6{margin-left:50%!important}.offset-xl-7{margin-left:58.3333333333%!important}.offset-xl-8{margin-left:66.6666666667%!important}.offset-xl-9{margin-left:75%!important}.offset-xl-10{margin-left:83.3333333333%!important}.offset-xl-11{margin-left:91.6666666667%!important}}.markdown-body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:16px;line-height:1.5;word-wrap:break-word}.markdown-body::before{display:table;content:""}.markdown-body::after{display:table;clear:both;content:""}.markdown-body>* :first-child{margin-top:0!important}.markdown-body>* :last-child{margin-bottom:0!important}.markdown-body a:not([href]){color:inherit;text-decoration:none}.markdown-body .absent{color:#cb2431}.markdown-body .anchor{float:left;padding-right:4px;margin-left:-20px;line-height:1}.markdown-body .anchor:focus{outline:0}.markdown-body blockquote,.markdown-body dl,.markdown-body ol,.markdown-body p,.markdown-body pre,.markdown-body table,.markdown-body ul{margin-top:0;margin-bottom:16px}.markdown-body hr{height:.25em;padding:0;margin:24px 0;background-color:#e1e4e8;border:0}.markdown-body blockquote{padding:0 1em;color:#6a737d;border-left:.25em solid #dfe2e5}.markdown-body blockquote>:first-child{margin-top:0}.markdown-body blockquote>:last-child{margin-bottom:0}.markdown-body kbd{display:inline-block;padding:3px 5px;font-size:11px;line-height:10px;color:#444d56;vertical-align:middle;background-color:#fafbfc;border:solid 1px #c6cbd1;border-bottom-color:#959da5;border-radius:3px;box-shadow:inset 0 -1px 0 #959da5}.markdown-body h1,.markdown-body h2,.markdown-body h3,.markdown-body h4,.markdown-body h5,.markdown-body h6{margin-top:24px;margin-bottom:16px;font-weight:600;line-height:1.25}.markdown-body h1 .octicon-link,.markdown-body h2 .octicon-link,.markdown-body h3 .octicon-link,.markdown-body h4 .octicon-link,.markdown-body h5 .octicon-link,.markdown-body h6 .octicon-link{color:#1b1f23;vertical-align:middle;visibility:hidden}.markdown-body h1:hover .anchor,.markdown-body h2:hover .anchor,.markdown-body h3:hover .anchor,.markdown-body h4:hover .anchor,.markdown-body h5:hover .anchor,.markdown-body h6:hover .anchor{text-decoration:none}.markdown-body h1:hover .anchor .octicon-link,.markdown-body h2:hover .anchor .octicon-link,.markdown-body h3:hover .anchor .octicon-link,.markdown-body h4:hover .anchor .octicon-link,.markdown-body h5:hover .anchor .octicon-link,.markdown-body h6:hover .anchor .octicon-link{visibility:visible}.markdown-body h1 code,.markdown-body h1 tt,.markdown-body h2 code,.markdown-body h2 tt,.markdown-body h3 code,.markdown-body h3 tt,.markdown-body h4 code,.markdown-body h4 tt,.markdown-body h5 code,.markdown-body h5 tt,.markdown-body h6 code,.markdown-body h6 tt{font-size:inherit}.markdown-body h1{padding-bottom:.3em;font-size:2em;border-bottom:1px solid #eaecef}.markdown-body h2{padding-bottom:.3em;font-size:1.5em;border-bottom:1px solid #eaecef}.markdown-body h3{font-size:1.25em}.markdown-body h4{font-size:1em}.markdown-body h5{font-size:.875em}.markdown-body h6{font-size:.85em;color:#6a737d}.markdown-body ol,.markdown-body ul{padding-left:2em}.markdown-body ol.no-list,.markdown-body ul.no-list{padding:0;list-style-type:none}.markdown-body ol ol,.markdown-body ol ul,.markdown-body ul ol,.markdown-body ul ul{margin-top:0;margin-bottom:0}.markdown-body li{word-wrap:break-all}.markdown-body li>p{margin-top:16px}.markdown-body li+li{margin-top:.25em}.markdown-body dl{padding:0}.markdown-body dl dt{padding:0;margin-top:16px;font-size:1em;font-style:italic;font-weight:600}.markdown-body dl dd{padding:0 16px;margin-bottom:16px}.markdown-body table{display:block;width:100%;overflow:auto}.markdown-body table th{font-weight:600}.markdown-body table td,.markdown-body table th{padding:6px 13px;border:1px solid #dfe2e5}.markdown-body table tr{background-color:#fff;border-top:1px solid #c6cbd1}.markdown-body table tr:nth-child(2n){background-color:#f6f8fa}.markdown-body table img{background-color:transparent}.markdown-body img{max-width:100%;box-sizing:content-box;background-color:#fff}.markdown-body img[align=right]{padding-left:20px}.markdown-body img[align=left]{padding-right:20px}.markdown-body .emoji{max-width:none;vertical-align:text-top;background-color:transparent}.markdown-body span.frame{display:block;overflow:hidden}.markdown-body span.frame>span{display:block;float:left;width:auto;padding:7px;margin:13px 0 0;overflow:hidden;border:1px solid #dfe2e5}.markdown-body span.frame span img{display:block;float:left}.markdown-body span.frame span span{display:block;padding:5px 0 0;clear:both;color:#24292e}.markdown-body span.align-center{display:block;overflow:hidden;clear:both}.markdown-body span.align-center>span{display:block;margin:13px auto 0;overflow:hidden;text-align:center}.markdown-body span.align-center span img{margin:0 auto;text-align:center}.markdown-body span.align-right{display:block;overflow:hidden;clear:both}.markdown-body span.align-right>span{display:block;margin:13px 0 0;overflow:hidden;text-align:right}.markdown-body span.align-right span img{margin:0;text-align:right}.markdown-body span.float-left{display:block;float:left;margin-right:13px;overflow:hidden}.markdown-body span.float-left span{margin:13px 0 0}.markdown-body span.float-right{display:block;float:right;margin-left:13px;overflow:hidden}.markdown-body span.float-right>span{display:block;margin:13px auto 0;overflow:hidden;text-align:right}.markdown-body code,.markdown-body tt{padding:.2em .4em;margin:0;font-size:85%;background-color:rgba(27,31,35,.05);border-radius:3px}.markdown-body code br,.markdown-body tt br{display:none}.markdown-body del code{text-decoration:inherit}.markdown-body pre{word-wrap:normal}.markdown-body pre>code{padding:0;margin:0;font-size:100%;word-break:normal;white-space:pre;background:0 0;border:0}.markdown-body .highlight{margin-bottom:16px}.markdown-body .highlight pre{margin-bottom:0;word-break:normal}.markdown-body .highlight pre,.markdown-body pre{padding:16px;overflow:auto;font-size:85%;line-height:1.45;background-color:#f6f8fa;border-radius:3px}.markdown-body pre code,.markdown-body pre tt{display:inline;max-width:auto;padding:0;margin:0;overflow:visible;line-height:inherit;word-wrap:normal;background-color:transparent;border:0}.markdown-body .csv-data td,.markdown-body .csv-data th{padding:5px;overflow:hidden;font-size:12px;line-height:1;text-align:left;white-space:nowrap}.markdown-body .csv-data .blob-num{padding:10px 8px 9px;text-align:right;background:#fff;border:0}.markdown-body .csv-data tr{border-top:0}.markdown-body .csv-data th{font-weight:600;background:#f6f8fa;border-top:0}.highlight table td{padding:5px}.highlight table pre{margin:0}.highlight .cm{color:#998;font-style:italic}.highlight .cp{color:#999;font-weight:700}.highlight .c1{color:#998;font-style:italic}.highlight .cs{color:#999;font-weight:700;font-style:italic}.highlight .c,.highlight .cd{color:#998;font-style:italic}.highlight .err{color:#a61717;background-color:#e3d2d2}.highlight .gd{color:#000;background-color:#fdd}.highlight .ge{color:#000;font-style:italic}.highlight .gr{color:#a00}.highlight .gh{color:#999}.highlight .gi{color:#000;background-color:#dfd}.highlight .go{color:#888}.highlight .gp{color:#555}.highlight .gs{font-weight:700}.highlight .gu{color:#aaa}.highlight .gt{color:#a00}.highlight .kc{color:#000;font-weight:700}.highlight .kd{color:#000;font-weight:700}.highlight .kn{color:#000;font-weight:700}.highlight .kp{color:#000;font-weight:700}.highlight .kr{color:#000;font-weight:700}.highlight .kt{color:#458;font-weight:700}.highlight .k,.highlight .kv{color:#000;font-weight:700}.highlight .mf{color:#099}.highlight .mh{color:#099}.highlight .il{color:#099}.highlight .mi{color:#099}.highlight .mo{color:#099}.highlight .m,.highlight .mb,.highlight .mx{color:#099}.highlight .sb{color:#d14}.highlight .sc{color:#d14}.highlight .sd{color:#d14}.highlight .s2{color:#d14}.highlight .se{color:#d14}.highlight .sh{color:#d14}.highlight .si{color:#d14}.highlight .sx{color:#d14}.highlight .sr{color:#009926}.highlight .s1{color:#d14}.highlight .ss{color:#990073}.highlight .s{color:#d14}.highlight .na{color:teal}.highlight .bp{color:#999}.highlight .nb{color:#0086b3}.highlight .nc{color:#458;font-weight:700}.highlight .no{color:teal}.highlight .nd{color:#3c5d5d;font-weight:700}.highlight .ni{color:purple}.highlight .ne{color:#900;font-weight:700}.highlight .nf{color:#900;font-weight:700}.highlight .nl{color:#900;font-weight:700}.highlight .nn{color:#555}.highlight .nt{color:navy}.highlight .vc{color:teal}.highlight .vg{color:teal}.highlight .vi{color:teal}.highlight .nv{color:teal}.highlight .ow{color:#000;font-weight:700}.highlight .o{color:#000;font-weight:700}.highlight .w{color:#bbb}.highlight{background-color:#f8f8f8}</style>
+      </head>
+      <body class="bg-white">
+        <nav class="container-md px-3 py-2 mt-2 mt-md-5 mb-5 markdown-body">
+          <p class="bg-yellow-light ml-n1 px-1 py-1 mb-1">
+            <strong>This is a web feed,</strong> also known as an RSS or Atom feed. <strong>Subscribe</strong> by copying the URL from the address bar into your newsreader.
+          </p>
+          <p class="text-gray">
+            Visit <a href="https://aboutfeeds.com">About Feeds</a> to get started with newsreaders and subscribing. It’s free.
+          </p>
+        </nav>
+        <div class="container-md px-3 py-3 markdown-body">
+          <header class="py-5">
+            <h1 class="border-0">
+              <!-- https://commons.wikimedia.org/wiki/File:Feed-icon.svg -->
+              <svg xmlns="http://www.w3.org/2000/svg" version="1.1" style="vertical-align: text-bottom; width: 1.2em; height: 1.2em;" class="pr-1" id="RSSicon" viewBox="0 0 256 256">
+                <defs>
+                  <linearGradient x1="0.085" y1="0.085" x2="0.915" y2="0.915" id="RSSg">
+                    <stop  offset="0.0" stop-color="#E3702D"/><stop  offset="0.1071" stop-color="#EA7D31"/>
+                    <stop  offset="0.3503" stop-color="#F69537"/><stop  offset="0.5" stop-color="#FB9E3A"/>
+                    <stop  offset="0.7016" stop-color="#EA7C31"/><stop  offset="0.8866" stop-color="#DE642B"/>
+                    <stop  offset="1.0" stop-color="#D95B29"/>
+                  </linearGradient>
+                </defs>
+                <rect width="256" height="256" rx="55" ry="55" x="0"  y="0"  fill="#CC5D15"/>
+                <rect width="246" height="246" rx="50" ry="50" x="5"  y="5"  fill="#F49C52"/>
+                <rect width="236" height="236" rx="47" ry="47" x="10" y="10" fill="url(#RSSg)"/>
+                <circle cx="68" cy="189" r="24" fill="#FFF"/>
+                <path d="M160 213h-34a82 82 0 0 0 -82 -82v-34a116 116 0 0 1 116 116z" fill="#FFF"/>
+                <path d="M184 213A140 140 0 0 0 44 73 V 38a175 175 0 0 1 175 175z" fill="#FFF"/>
+              </svg>
+
+              Web Feed Preview
+            </h1>
+            <h2><xsl:value-of select="atom:feed/atom:title"/></h2>
+            <p><xsl:value-of select="atom:feed/atom:description"/></p>
+            <p>This preview only shows titles, but the actual feed contains the full content.</p>
+            <a class="head_link">
+              <xsl:attribute name="href">
+                <xsl:value-of select="/atom:feed/atom:link[not(@rel)]/@href"/>
+              </xsl:attribute>
+              Visit Website &#x2192;
+            </a>
+          </header>
+          <h2>Recent Items</h2>
+          <xsl:apply-templates select="atom:feed/atom:entry" />
+        </div>
+      </body>
+    </html>
+  </xsl:template>
+  <xsl:template match="atom:feed/atom:entry">
+    <div class="pb-5">
+      <h3 class="mb-0">
+        <a>
+          <xsl:attribute name="href">
+            <xsl:value-of select="atom:link/@href"/>
+          </xsl:attribute>
+          <xsl:value-of select="atom:title"/>
+        </a>
+      </h3>
+      <small class="text-gray">
+        Published: <xsl:value-of select="atom:updated" />
+      </small>
+    </div>
+  </xsl:template>
+</xsl:stylesheet>
\ No newline at end of file
diff --git a/src/sitemap.njk b/src/sitemap.njk
index 63e67a4..3d9ec5b 100644
--- a/src/sitemap.njk
+++ b/src/sitemap.njk
@@ -3,14 +3,15 @@ permalink: /sitemap.xml
 eleventyExcludeFromCollections: true
 ---
 <?xml version="1.0" encoding="utf-8"?>
+<?xml-stylesheet href="sitemap.xsl" type="text/xsl"?>
 <urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
-    {% for page in collections.all %}
+{% for page in collections.all %}
     {% if not page.data.draft %}
-    <url>
+        <url>
         <loc>{{ link.website }}{{ page.url | url }}</loc>
         <lastmod>{{ page.date.toISOString() }}</lastmod>
         <changefreq>{{ page.data.changeFreq if page.data.changeFreq else "monthly" }}</changefreq>
-    </url>
+        </url>
     {% endif %}
-    {% endfor %}
-</urlset>
\ No newline at end of file
+{% endfor %}
+</urlset>
diff --git a/src/sitemap.xsl b/src/sitemap.xsl
new file mode 100644
index 0000000..d221962
--- /dev/null
+++ b/src/sitemap.xsl
@@ -0,0 +1,42 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<xsl:stylesheet 
+    version="3.0" 
+    xmlns:xsl="http://www.w3.org/1999/XSL/Transform" 
+    xmlns:sitemap="http://www.sitemaps.org/schemas/sitemap/0.9"
+    >
+    <xsl:output method="html" indent="yes" encoding="UTF-8"/>
+    <xsl:template match="/">
+<xsl:message>Powered by <a href="https://www.sitemap.style/">Sitemap Style</a></xsl:message>
+    
+
+<!-- get the hostname from the first url/loc -->
+<xsl:variable name="hostname" select="substring-before(substring-after(/sitemap:urlset/sitemap:url[1]/sitemap:loc, '://'), '/')" />
+
+        <html>
+            <head>
+                <meta name="viewport" content="width=device-width, initial-scale=1" />
+                <meta name="referrer" content="unsafe-url" />
+                <title>Sitemap for <xsl:value-of select="$hostname"/></title>
+                <link rel="stylesheet" href="https://www.sitemap.style/css/pico.classless.min.css" />
+            </head>
+            <body>
+                <main class="container">
+                <h1>Pages on <xsl:value-of select="$hostname"/></h1>
+                <ul>
+                    <xsl:for-each select="sitemap:urlset/sitemap:url">
+                    <xsl:variable name="sitemap_loc"><xsl:value-of select="sitemap:loc"/></xsl:variable>
+                    <xsl:variable name="sitemap_lastmod"><xsl:value-of select="sitemap:lastmod"/></xsl:variable>
+                    <li>
+                        <a href="{$sitemap_loc}"><xsl:value-of select="sitemap:loc" /></a>
+                        <xsl:if test="$sitemap_lastmod!=''">
+                            (<xsl:value-of select="sitemap:lastmod" />)
+                        </xsl:if>
+                    </li>
+                    </xsl:for-each>
+                </ul>
+                <p><xsl:value-of select="count(sitemap:urlset/sitemap:url)"/> pages</p>
+                </main>
+            </body>
+        </html>
+    </xsl:template>
+</xsl:stylesheet>
\ No newline at end of file
diff --git a/tests/landing-page.spec.ts b/tests/landing-page.spec.ts
new file mode 100644
index 0000000..8b7cafa
--- /dev/null
+++ b/tests/landing-page.spec.ts
@@ -0,0 +1,20 @@
+import { test, expect } from '@playwright/test';
+
+test('has title', async ({ page }) => {
+  await page.goto('/');
+  await expect(page).toHaveTitle(/EmptyWork/);
+});
+
+test('find a curriculum vitae and download', async ({ page }) => {
+  test.setTimeout(0);
+
+  await page.goto('/');
+
+  const downloadPromise = page.waitForEvent('download');
+  await page.getByRole('link', { name: 'Download my Curriculum Vitae' }).click();
+  const download = await downloadPromise;
+  
+  const fileName = download.suggestedFilename();
+  expect(fileName).toMatch(/\.pdf$/);
+
+});