hexo-theme-gnix 1.1.0

package/source/css/default.css

@@ -0,0 +1,1590 @@
+@charset "UTF-8";
+/* #region Color */
+:where([data-theme="latte"]) {
+  color-scheme: light;
+  --rosewater: #dc8a78;
+  --flamingo: #dd7878;
+  --pink: #ea76cb;
+  --mauve: #8839ef;
+  --red: #d20f39;
+  --maroon: #e64553;
+  --peach: #fe640b;
+  --yellow: #df8e1d;
+  --green: #40a02b;
+  --teal: #179299;
+  --sky: #04a5e5;
+  --sapphire: #209fb5;
+  --blue: #1e66f5;
+  --lavender: #7287fd;
+  --text: #4c4f69;
+  --subtext1: #5c5f77;
+  --subtext0: #6c6f85;
+  --overlay2: #7c7f93;
+  --overlay1: #8c8fa1;
+  --overlay0: #9ca0b0;
+  --surface2: #acb0be;
+  --surface1: #bcc0cc;
+  --surface0: #ccd0da;
+  --base: #eff1f5;
+  --mantle: #e6e9ef;
+  --crust: #dce0e8;
+}
+
+:where([data-theme="macchiato"]) {
+  color-scheme: dark;
+  --rosewater: #f4dbd6;
+  --flamingo: #f0c6c6;
+  --pink: #f5bde6;
+  --mauve: #c6a0f6;
+  --red: #ed8796;
+  --maroon: #ee99a0;
+  --peach: #f5a97f;
+  --yellow: #eed49f;
+  --green: #a6da95;
+  --teal: #8bd5ca;
+  --sky: #91d7e3;
+  --sapphire: #7dc4e4;
+  --blue: #8aadf4;
+  --lavender: #b7bdf8;
+  --text: #cad3f5;
+  --subtext1: #b8c0e0;
+  --subtext0: #a5adcb;
+  --overlay2: #939ab7;
+  --overlay1: #8087a2;
+  --overlay0: #6e738d;
+  --surface2: #5b6078;
+  --surface1: #494d64;
+  --surface0: #363a4f;
+  --base: #24273a;
+  --mantle: #1e2030;
+  --crust: #181926;
+}
+
+:where([data-theme="nord"]) {
+  color-scheme: light;
+  --rosewater: #bf616a;
+  --flamingo: #d08770;
+  --pink: #b48ead;
+  --mauve: #b48ead;
+  --red: #bf616a;
+  --maroon: #a3be8c;
+  --peach: #d08770;
+  --yellow: #ebcb8b;
+  --green: #a3be8c;
+  --teal: #8fbcbb;
+  --sky: #81a1c1;
+  --sapphire: #5e81ac;
+  --blue: #81a1c1;
+  --lavender: #5e81ac;
+  --text: #2e3440;
+  --subtext1: #3b4252;
+  --subtext0: #434c5e;
+  --overlay2: #4c566a;
+  --overlay1: #5a657a;
+  --overlay0: #686e7e;
+  --surface2: #76809f;
+  --surface1: #7d8fa3;
+  --surface0: #8fa3b0;
+  --base: #eceff4;
+  --mantle: #e5e9f0;
+  --crust: #d8dee9;
+}
+
+:where([data-theme="mocha"]) {
+  color-scheme: dark;
+  --rosewater: #f5e0dc;
+  --flamingo: #f2cdcd;
+  --pink: #f5c2e7;
+  --mauve: #cba6f7;
+  --red: #f38ba8;
+  --maroon: #eba0ac;
+  --peach: #fab387;
+  --yellow: #f9e2af;
+  --green: #a6e3a1;
+  --teal: #94e2d5;
+  --sky: #89dceb;
+  --sapphire: #74c7ec;
+  --blue: #89b4fa;
+  --lavender: #b4befe;
+  --text: #cdd6f4;
+  --subtext1: #bac2de;
+  --subtext0: #a6adc8;
+  --overlay2: #9399b2;
+  --overlay1: #7f849c;
+  --overlay0: #6c7086;
+  --surface2: #585b70;
+  --surface1: #45475a;
+  --surface0: #313244;
+  --base: #1e1e2e;
+  --mantle: #181825;
+  --crust: #11111b;
+}
+
+:where([data-theme="tokyo_night"]) {
+  color-scheme: dark;
+  --rosewater: #f7768e;
+  --flamingo: #ff9e64;
+  --pink: #bb9af7;
+  --mauve: #bb9af7;
+  --red: #f7768e;
+  --maroon: #db4b4b;
+  --peach: #ff9e64;
+  --yellow: #e0af68;
+  --green: #9ece6a;
+  --teal: #1abc9c;
+  --sky: #7dcfff;
+  --sapphire: #2ac3de;
+  --blue: #7aa2f7;
+  --lavender: #82aaff;
+  --text: #c0caf5;
+  --subtext1: #a9b1d6;
+  --subtext0: #9aa5ce;
+  --overlay2: #787c99;
+  --overlay1: #565f89;
+  --overlay0: #414868;
+  --surface2: #414868;
+  --surface1: #33467c;
+  --surface0: #24283b;
+  --base: #1a1b26;
+  --mantle: #16161e;
+  --crust: #101014;
+}
+
+:where([data-theme="nord_night"]) {
+  color-scheme: dark;
+  --rosewater: #b48ead;
+  --flamingo: #d08770;
+  --pink: #b48ead;
+  --mauve: #b48ead;
+  --red: #bf616a;
+  --maroon: #bf616a;
+  --peach: #d08770;
+  --yellow: #ebcb8b;
+  --green: #a3be8c;
+  --teal: #8fbcbb;
+  --sky: #88c0d0;
+  --sapphire: #81a1c1;
+  --blue: #5e81ac;
+  --lavender: #81a1c1;
+  --text: #eceff4;
+  --subtext1: #e5e9f0;
+  --subtext0: #d8dee9;
+  --overlay2: #4c566a;
+  --overlay1: #434c5e;
+  --overlay0: #3b4252;
+  --surface2: #434c5e;
+  --surface1: #3b4252;
+  --surface0: #3b4252;
+  --base: #2e3440;
+  --mantle: #292e39;
+  --crust: #242933;
+}
+
+a {
+  color: var(--lavender);
+}
+
+a:hover {
+  color: var(--blue);
+}
+
+.title {
+  color: var(--lavender);
+}
+
+.article .title a:hover {
+  background: linear-gradient(to right, var(--blue), var(--mauve), var(--pink));
+  background-clip: text;
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+}
+
+h2 {
+  color: var(--peach);
+}
+
+h3 {
+  color: var(--yellow);
+}
+
+h4 {
+  color: var(--green);
+}
+
+h5 {
+  color: var(--blue);
+}
+
+h6 {
+  color: var(--mauve);
+}
+
+mark {
+  background-color: var(--yellow);
+}
+
+.task-list-item-checkbox {
+  accent-color: var(--lavender);
+}
+
+.task-list-item-checkbox:checked {
+  accent-color: var(--mauve);
+}
+
+strong {
+  color: var(--red);
+}
+
+blockquote::before {
+  color: var(--red);
+}
+
+code {
+  background-color: var(--base);
+  color: var(--subtext1);
+  border: 1px solid var(--surface0);
+}
+
+.article-licensing {
+  color: var(--subtext1);
+  background-color: var(--base);
+}
+
+.navbar-main,
+.navbar-menu {
+  background: hsl(from var(--mantle) h s l / 0.95);
+}
+
+.navbar-item.is-active {
+  color: var(--flamingo);
+}
+
+.navbar-item:focus,
+.navbar-item:hover {
+  color: var(--lavender);
+}
+
+.tag {
+  color: var(--text);
+  border-color: var(--surface0);
+}
+
+.tag:first-child {
+  background: var(--base);
+}
+
+.tag:last-child {
+  background: var(--mantle);
+}
+
+body {
+  background: var(--mantle);
+  color: var(--text);
+}
+
+.card {
+  background: var(--mantle);
+  border: 0.1px dashed var(--surface0);
+}
+
+input.task-list-item-checkbox:checked {
+  background-color: var(--green);
+  border-color: var(--green);
+}
+
+.navbar-item {
+  color: var(--text);
+}
+
+hr {
+  background-color: var(--surface0);
+}
+
+input:-webkit-autofill {
+  -webkit-text-fill-color: var(--text);
+  box-shadow: 0 0 0 1000px var(--surface0) inset;
+}
+
+.breadcrumb {
+  color: var(--blue);
+}
+
+.breadcrumb li a {
+  color: var(--yellow);
+}
+
+.breadcrumb li.is-active a {
+  color: var(--mauve);
+}
+
+.pagination-link.is-current,
+.pagination-link:hover,
+.pagination-next:hover,
+.pagination-previous:hover {
+  background-color: var(--lavender);
+  color: var(--base);
+}
+
+.searchbox-container {
+  background-color: var(--mantle);
+  border: 2px solid var(--surface0);
+  color: var(--text);
+}
+
+.searchbox-input {
+  color: var(--text);
+  background-color: var(--mantle);
+  border: none;
+}
+
+.searchbox-result-item.active span {
+  color: var(--yellow);
+}
+
+.searchbox-result-item:hover span {
+  color: var(--mauve);
+}
+
+/* #endregion Color */
+
+/* #region Font */
+@font-face {
+  font-family: doto;
+  font-style: normal;
+  font-weight: 400;
+  font-display: swap;
+  src: url(/css/font/woff2/doto.woff2) format("woff2");
+}
+
+@font-face {
+  font-family: Paris2024;
+  font-style: normal;
+  font-weight: 400;
+  font-display: swap;
+  src:
+    local("paris2024"),
+    url(/css/font/woff2/Paris2024-Variable.woff2) format("woff2");
+}
+
+@font-face {
+  font-family: Futura;
+  font-weight: 400;
+  src:
+    local("Futura"),
+    url(/css/font/woff2/Futura-Book.woff2) format("woff2");
+}
+/* #endregion */
+
+blockquote,
+body,
+dd,
+dl,
+dt,
+figure,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+hr,
+html,
+iframe,
+legend,
+li,
+ol,
+p,
+pre,
+textarea,
+ul {
+  margin: 0;
+  padding: 0;
+}
+
+ul {
+  list-style: none;
+}
+
+button,
+input,
+select,
+textarea {
+  margin: 0;
+}
+
+html {
+  box-sizing: border-box;
+  height: 100%;
+  font-size: 16px;
+  scroll-behavior: smooth;
+  min-width: 300px;
+  overflow-x: hidden;
+  overflow-y: scroll;
+}
+
+body {
+  min-height: 100%;
+  font-weight: 400;
+  font-family:
+    -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-size: 1em;
+  line-height: 1.5;
+  display: flex;
+  flex-direction: column;
+}
+
+img,
+video {
+  height: auto;
+  max-width: 100%;
+}
+
+.breadcrumb,
+.pagination-ellipsis,
+.pagination-link,
+.pagination-next,
+.pagination-previous {
+  -webkit-touch-callout: none;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+}
+
+.content p:not(:last-child),
+.breadcrumb:not(:last-child),
+.content:not(:last-child),
+.level:not(:last-child),
+.pagination:not(:last-child) {
+  margin-bottom: 0.5rem;
+}
+
+.breadcrumb {
+  white-space: nowrap;
+  font-family: monospace;
+}
+
+.breadcrumb a {
+  align-items: center;
+  display: flex;
+  justify-content: center;
+  padding: 0 0.1em;
+}
+
+.breadcrumb li {
+  align-items: center;
+  display: flex;
+}
+
+.breadcrumb li:first-child a {
+  padding-left: 0;
+}
+
+.breadcrumb li.is-active a {
+  cursor: default;
+  pointer-events: none;
+}
+
+.breadcrumb li + li::before {
+  content: "\0002f";
+}
+
+.breadcrumb ol,
+.breadcrumb ul {
+  align-items: flex-start;
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: flex-start;
+}
+
+.footer,
+.widget {
+  font-family:
+    Futura, Paris2024, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
+}
+
+.card {
+  max-width: 100%;
+  position: relative;
+  border-radius: 24px;
+  overflow: visible;
+}
+
+.card + .card {
+  margin-top: 1.5rem;
+}
+
+.card-image {
+  display: block;
+  position: relative;
+  border-radius: 24px;
+  overflow: hidden;
+}
+
+.card-image .cover-lqip,
+.card-image .fill {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+}
+
+.card-image .cover-lqip {
+  z-index: 1;
+  transition: opacity 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
+}
+
+.card-image .fill.loaded + .cover-lqip {
+  display: none;
+}
+
+.card-content {
+  padding: 1.25rem;
+  border-radius: 0;
+}
+
+.level {
+  align-items: center;
+  justify-content: space-between;
+}
+
+.level img {
+  display: inline-block;
+  vertical-align: top;
+}
+
+.level.is-mobile {
+  display: flex;
+}
+
+.level.is-mobile .level-item:not(:last-child) {
+  margin-bottom: 0;
+  margin-right: 0.4rem;
+}
+
+.level.is-mobile .level-item:not(.is-narrow) {
+  flex-grow: 1;
+}
+
+.level-item {
+  align-items: center;
+  display: flex;
+  flex-basis: auto;
+  flex-grow: 0;
+  flex-shrink: 0;
+  justify-content: center;
+}
+
+/* #region Navbar */
+
+.navbar {
+  min-height: 4rem;
+  position: sticky;
+  top: 0;
+  left: 0;
+  right: 0;
+  transition: transform 0.3s ease-in-out;
+  z-index: 100;
+  font-family:
+    Futura, Paris2024, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
+}
+.navbar-container {
+  flex-grow: 1;
+  margin: 0 auto;
+  width: auto;
+  display: flex;
+  min-height: 4rem;
+}
+
+.navbar button {
+  background: 0 0;
+  border: none;
+  cursor: pointer;
+}
+
+.navbar-main.navbar--hidden {
+  transform: translateY(-100%);
+}
+
+.navbar-menu {
+  display: none;
+}
+
+.navbar-item {
+  align-items: center;
+  display: flex;
+  font-size: 1.1rem;
+  padding: 0 0.4rem;
+  position: relative;
+  flex-grow: 0;
+  flex-shrink: 0;
+}
+
+.navbar-item svg {
+  width: 15px;
+}
+
+.navbar-menu {
+  flex-grow: 1;
+  flex-shrink: 0;
+}
+
+.navbar-start {
+  justify-content: flex-start;
+  margin-right: auto;
+}
+
+.navbar-end {
+  justify-content: flex-end;
+  margin-left: auto;
+}
+
+/* #endregion Navbar */
+
+/* #region Theme Selector */
+
+.theme-selector-modal {
+  position: fixed;
+  inset: 0;
+  z-index: 9999;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  opacity: 0;
+  visibility: hidden;
+  pointer-events: none;
+  transition:
+    opacity 0.2s ease,
+    visibility 0.2s ease;
+}
+
+.theme-selector-content {
+  position: relative;
+  z-index: 1;
+  background-color: var(--crust);
+  border-radius: 16px;
+  border: 2px solid var(--surface0);
+  padding: 2rem;
+  width: 90%;
+  max-width: 480px;
+  transform: scale(0.9);
+  opacity: 0;
+  transition:
+    transform 0.2s ease,
+    opacity 0.2s ease;
+}
+
+.theme-selector-modal.is-active {
+  opacity: 1;
+  visibility: visible;
+  pointer-events: auto;
+  .theme-selector-content {
+    transform: scale(1);
+    opacity: 1;
+  }
+}
+
+.theme-selector-header {
+  margin-bottom: 1.5rem;
+  text-align: center;
+}
+
+.theme-selector-title {
+  font-size: 1.75rem;
+  font-weight: 700;
+  color: var(--text);
+  margin-bottom: 0.5rem;
+}
+
+.theme-selector-hint {
+  font-size: 0.875rem;
+  color: var(--subtext0);
+  font-family: "Maple Mono NF CN", monospace;
+}
+
+.theme-selector-list {
+  display: flex;
+  flex-direction: column;
+  gap: 0.5rem;
+  max-height: 60vh;
+  overflow-y: auto;
+  padding: 0.5rem;
+}
+
+.theme-option {
+  display: flex;
+  align-items: center;
+  gap: 1rem;
+  padding: 1rem 1.25rem;
+  background-color: var(--mantle);
+  border-radius: 12px;
+  cursor: pointer;
+  transition: all 0.2s ease;
+  position: relative;
+  &:hover {
+    background-color: var(--surface0);
+    border-color: var(--blue);
+    transform: translateX(4px);
+  }
+  &.is-focused {
+    background-color: var(--surface1);
+    transform: translateX(8px);
+  }
+  .theme-name {
+    flex: 1;
+    font-size: 1.125rem;
+    font-weight: 600;
+  }
+  .theme-check {
+    font-size: 1rem;
+    color: var(--green);
+    opacity: 0;
+    transition: opacity 0.2s ease;
+  }
+}
+
+.theme-option.is-active .theme-check {
+  opacity: 1;
+}
+
+.theme-selector-trigger {
+  cursor: pointer;
+  transition: all 0.2s ease;
+  &:hover {
+    color: var(--blue);
+    transform: scale(1.1);
+  }
+}
+
+/* #endregion Theme Selector */
+
+/* #region Pagination */
+
+.pagination {
+  margin: -0.25rem;
+}
+
+.pagination,
+.pagination-list {
+  align-items: center;
+  display: flex;
+  justify-content: center;
+  text-align: center;
+}
+
+.pagination-ellipsis,
+.pagination-link,
+.pagination-next,
+.pagination-previous {
+  height: 2.5em;
+  border-radius: 4px;
+  font-size: 1.1em;
+  margin: 0.25rem;
+  padding: 0 0.5em;
+  justify-content: center;
+  text-align: center;
+  align-items: center;
+  display: inline-flex;
+  line-height: 1.5;
+  position: relative;
+  vertical-align: top;
+}
+
+.pagination-link,
+.pagination-next,
+.pagination-previous {
+  min-width: 1.5em;
+}
+
+.pagination-next,
+.pagination-previous {
+  padding-left: 0.75em;
+  padding-right: 0.75em;
+  white-space: nowrap;
+}
+
+.pagination-ellipsis {
+  pointer-events: none;
+}
+
+.pagination-list {
+  flex-wrap: wrap;
+}
+
+/* #endregion Pagination */
+
+/* #region Tabs */
+
+.tabs-tabs-wrapper {
+  overflow: hidden;
+  margin: 10px auto;
+}
+
+.tabs-tabs-header {
+  display: flex;
+  padding: 0 10px;
+}
+
+.tabs-tab-button {
+  flex: 1;
+  padding: 16px 5px;
+  border: none;
+  background: 0 0;
+  font-size: 15px;
+  font-weight: 500;
+  cursor: pointer;
+  position: relative;
+  transition: color 0.3s ease;
+  outline: 0;
+  &:hover {
+    color: var(--lavender);
+  }
+}
+
+.tabs-tab-button.active,
+.tabs-tab-button[data-active] {
+  color: var(--lavender);
+  font-weight: bolder;
+}
+
+.tabs-tab-button.active::after {
+  content: "";
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  height: 2px;
+  background-color: var(--lavender);
+  border-radius: 2px 2px 0 0;
+  animation: slideIn 0.3s ease;
+}
+
+.tabs-tabs-container {
+  padding: 18px 0 10px 0;
+}
+
+.tabs-tab-content {
+  display: none;
+}
+
+.tabs-tab-content.active,
+.tabs-tab-content[data-active] {
+  display: block;
+}
+
+/* #endregion Tabs */
+
+.section {
+  padding: 3rem 1.5rem;
+  flex-grow: 1;
+}
+
+.main-content {
+  -webkit-justify-content: center;
+  justify-content: center;
+  flex-grow: 1;
+  margin: 0 auto;
+  position: relative;
+  max-width: 900px;
+}
+
+/* #region Footer */
+
+.footer {
+  padding: 3rem 1.5rem 6rem;
+  position: relative;
+  iconify-icon {
+    font-size: 1.2rem;
+  }
+}
+
+.footer-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
+  grid-gap: 1.5rem;
+  align-items: start;
+}
+
+.footer-column {
+  display: flex;
+  flex-direction: column;
+  gap: 0.5rem;
+}
+
+.footer-title {
+  font-weight: bolder;
+  font-size: 1.1rem;
+  margin-bottom: 0.25rem;
+}
+
+.footer-heading {
+  font-weight: bolder;
+  font-size: 1.1rem;
+  margin-bottom: 0.25rem;
+}
+
+.footer-meta {
+  font-size: 0.75rem;
+  color: var(--subtext0);
+  line-height: 1.6;
+}
+
+.footer-links {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.5rem 1rem;
+  align-items: center;
+}
+
+.footer-link {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.4rem;
+  color: var(--subtext0);
+  text-decoration: none;
+  &:hover {
+    text-decoration: underline;
+  }
+}
+
+/* #endregion Footer */
+
+::-webkit-scrollbar {
+  display: none;
+}
+
+/* #region Content */
+
+.content {
+  overflow: auto;
+  word-wrap: break-word;
+  font-size: 1.15rem;
+
+  h2 {
+    text-align: center;
+    font-size: 1.75em;
+    margin-bottom: 0.5714em;
+  }
+  h2:not(:first-child) {
+    margin-top: 1.1428em;
+  }
+  h3 {
+    font-size: 1.5em;
+    margin-bottom: 0.6666em;
+  }
+  h4 {
+    font-size: 1.25em;
+    margin-bottom: 0.8em;
+  }
+  h5 {
+    font-size: 1.125em;
+    margin-bottom: 0.8888em;
+  }
+  h6 {
+    font-size: 1em;
+    margin-bottom: 1em;
+  }
+  li + li {
+    margin-top: 0.25em;
+  }
+  img,
+  video {
+    display: block;
+    margin: 0 auto;
+    margin-bottom: 1.5rem;
+    border-radius: 2px;
+  }
+
+  img:hover,
+  video:hover {
+    cursor: pointer;
+  }
+
+  code {
+    font-family:
+      Maple Mono NF CN,
+      SF Pro,
+      monospace;
+    border-radius: 6px;
+    padding: 1px 6px;
+  }
+
+  ol {
+    list-style-position: outside;
+    margin-left: 2em;
+    margin-top: 1em;
+  }
+
+  ul {
+    list-style: disc outside;
+    margin-left: 2em;
+    margin-top: 1em;
+  }
+
+  ul ul {
+    list-style-type: circle;
+    margin-top: 0.5em;
+  }
+
+  ul ul ul {
+    list-style-type: square;
+  }
+
+  dd {
+    margin-left: 2em;
+  }
+
+  figure {
+    margin-left: 2em;
+    margin-right: 2em;
+    text-align: center;
+  }
+
+  figure:not(:first-child) {
+    margin-top: 2em;
+  }
+
+  figure:not(:last-child) {
+    margin-bottom: 2em;
+  }
+
+  figure img {
+    display: inline-block;
+  }
+
+  figure figcaption {
+    font-style: italic;
+  }
+
+  pre {
+    -webkit-overflow-scrolling: touch;
+    overflow-x: auto;
+    font-size: 0.85em;
+    padding: 1.25em 1.5em;
+    white-space: pre;
+    word-wrap: normal;
+  }
+
+  sub,
+  sup {
+    font-size: 75%;
+  }
+
+  abbr[title] {
+    text-decoration: underline dotted;
+    cursor: help;
+    position: relative;
+  }
+
+  a[href*="apple"]::before,
+  a[href*="github"]::before,
+  a[href*="wikipedia"]::before,
+  a[href*="youtube"]::before {
+    font-family: "Maple Mono NF CN", monospace;
+    font-size: 1em;
+    padding-left: 0.5em;
+    color: var(--lavender);
+  }
+
+  a[href*="github"]::before {
+    content: "󰊤 ";
+  }
+
+  a[href*="wikipedia"]::before {
+    content: "󰖬 ";
+  }
+
+  a[href*="youtube"]::before {
+    content: " ";
+  }
+
+  a[href*="apple"]::before {
+    content: " ";
+  }
+}
+
+.footnotes {
+  font-family: serif;
+  font-size: 0.9em;
+}
+
+table {
+  width: 100%;
+  border-collapse: separate;
+  border-spacing: 0;
+  border-radius: 8px;
+  overflow: hidden;
+  margin: 2em 0;
+  font-size: 0.875em;
+  border: 1px solid var(--surface0);
+}
+
+table td,
+table th {
+  vertical-align: middle;
+  padding: 0.75em 1em;
+}
+
+table thead th {
+  font-weight: 700;
+  border-bottom: 1px solid var(--surface0);
+  padding: 1em;
+}
+
+table td:not([align]),
+table th:not([align]) {
+  text-align: left;
+}
+
+table tbody tr td {
+  border-bottom: 1px solid var(--surface0);
+}
+
+table tbody tr:last-child td {
+  border-bottom: none;
+}
+
+blockquote {
+  position: relative;
+  padding: 1.5rem 2rem 1.5rem 3rem;
+  margin: 1.5rem 0;
+  border-left: 4px solid var(--red);
+  border-radius: 0 8px 8px 0;
+  font-weight: bolder;
+  font-family: serif;
+  font-style: italic;
+  font-size: 1.05rem;
+  line-height: 1.6;
+}
+
+blockquote:before {
+  content: '"';
+  position: absolute;
+  left: 0.5rem;
+  top: 0.2rem;
+  font-size: 3rem;
+  font-weight: 700;
+  opacity: 0.3;
+  line-height: 1;
+}
+
+ul.contains-task-list {
+  list-style-type: none;
+}
+
+li.task-list-item {
+  display: flex;
+  align-items: center;
+  gap: 0.75rem;
+  font-size: 1rem;
+}
+
+input.task-list-item-checkbox {
+  appearance: none;
+  -webkit-appearance: none;
+  width: 1.2rem;
+  height: 1.2rem;
+  border: 2px solid var(--surface1);
+  border-radius: 0.375rem;
+  position: relative;
+}
+
+input.task-list-item-checkbox:checked::before {
+  content: "";
+  font-family: "Maple Mono NF CN", monospace;
+  color: var(--base);
+  position: absolute;
+  top: 50%;
+  left: 40%;
+  transform: translate(-50%, -50%);
+  font-size: 0.9rem;
+  font-weight: 700;
+}
+
+.medium-zoom-overlay {
+  backdrop-filter: blur(8px);
+  -webkit-backdrop-filter: blur(8px);
+  z-index: 150 !important;
+}
+
+.medium-zoom-image--opened {
+  z-index: 151;
+  position: fixed;
+}
+
+.heimu {
+  color: var(--text);
+  background-color: var(--text);
+}
+
+.heimu:hover {
+  color: var(--base);
+}
+
+.title {
+  word-break: break-word;
+  margin-bottom: 0.4em;
+  position: relative;
+  display: inline-block;
+  transition: color 0.3s ease-out;
+  font-size: 2.3em;
+  font-weight: 800;
+  line-height: 1.2;
+}
+
+.title .tag {
+  vertical-align: middle;
+}
+
+code {
+  font-size: 0.875em;
+  font-weight: 400;
+  padding: 0.25em 0.5em 0.25em;
+}
+
+strong {
+  font-weight: 700;
+}
+
+hr {
+  border: none;
+  display: block;
+  height: 2px;
+  margin: 1.5rem 0;
+}
+
+a {
+  cursor: pointer;
+  text-decoration: none;
+}
+
+a strong {
+  color: currentColor;
+}
+
+img {
+  height: auto;
+  max-width: 100%;
+}
+
+input[type="checkbox"],
+input[type="radio"] {
+  vertical-align: baseline;
+}
+
+small {
+  font-size: 0.875em;
+}
+
+/* #endregion Content */
+
+.image {
+  display: block;
+  position: relative;
+}
+
+.image img {
+  display: block;
+  height: auto;
+  width: 100%;
+}
+
+.image.is-7by3 {
+  padding-top: 42.8%;
+}
+
+.image.is-7by3 img {
+  bottom: 0;
+  left: 0;
+  position: absolute;
+  right: 0;
+  top: 0;
+}
+
+.image .fill {
+  object-fit: cover;
+  width: 100%;
+  height: 100%;
+}
+
+/* #region Tags */
+
+.tags {
+  font-family: monospace;
+  flex-wrap: wrap;
+  justify-content: flex-start;
+  padding: 0.5rem 0.5rem;
+  display: inline-flex;
+  align-items: center;
+  transition: all 0.3s ease;
+  &:hover {
+    transform: translateY(-2px);
+  }
+}
+
+.tag {
+  padding: 0 0.75em;
+  transition: all 0.3s ease;
+  border-style: solid;
+  align-items: center;
+  border-radius: 5px;
+  display: inline-flex;
+  font-size: 0.75rem;
+  height: 2em;
+  white-space: nowrap;
+}
+
+.tag:first-child {
+  border-width: 1px 0 1px 1px;
+  border-radius: 5px 0 0 5px;
+}
+
+.tag:first-child::before {
+  content: "#";
+  opacity: 0.7;
+  margin-right: 0.25em;
+}
+
+.tag:last-child {
+  border-width: 1px 1px 1px 0;
+  border-radius: 0 5px 5px 0;
+}
+
+/* #endregion Tags */
+
+:target {
+  scroll-margin-top: 20vh;
+}
+
+article,
+aside,
+figure,
+footer,
+header,
+hgroup,
+section {
+  display: block;
+}
+
+.article:has(.article-licensing) {
+  padding-bottom: 0 !important;
+}
+
+.article-meta {
+  font-family: "Maple Mono NF CN", monospace;
+  font-size: 0.8rem;
+  overflow-x: auto;
+  margin-bottom: 0.1rem;
+}
+
+.article-meta a {
+  color: var(--text);
+  &:hover {
+    color: var(--peach);
+  }
+}
+
+.article-meta span {
+  padding-right: 0.5rem;
+}
+
+/* #region Licensing */
+
+.article-licensing {
+  display: block;
+  position: relative;
+  margin-left: -1.25rem;
+  margin-right: -1.25rem;
+  padding: 1.25rem;
+  z-index: 0;
+  border-radius: 0 0 24px 24px;
+  box-shadow: none;
+  overflow: hidden;
+}
+
+.article-licensing-bg-icon {
+  position: absolute;
+  z-index: -1;
+  right: -50px;
+  top: -88px;
+  font-size: 200px;
+  opacity: 0.1;
+  pointer-events: none;
+}
+
+.licensing-title {
+  margin-bottom: 0.75rem;
+  line-height: 1.2;
+}
+
+.licensing-title p:not(:last-child) {
+  margin-bottom: 0.25rem;
+}
+
+.licensing-title a {
+  font-size: 0.75rem;
+}
+
+.licensing-meta .level-item {
+  margin-right: 1.5rem;
+  font-size: 0.75rem;
+}
+
+.licensing-meta iconify-icon {
+  font-size: 1.5em;
+  vertical-align: bottom;
+}
+
+.licensing-meta a {
+  color: inherit;
+}
+
+/* #endregion Licensing */
+
+/* #region Search */
+
+.searchbox {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  z-index: 100;
+  font-family:
+    Maple Mono NF CN,
+    monospace;
+  line-height: 0;
+  opacity: 0;
+  visibility: hidden;
+  display: flex;
+}
+
+.searchbox.show {
+  opacity: 1;
+  visibility: visible;
+  backdrop-filter: blur(5px);
+  -webkit-backdrop-filter: blur(5px);
+}
+
+input.searchbox-input {
+  font-size: 1rem;
+  font-family: inherit;
+  border: none;
+  outline: 0;
+  box-shadow: none;
+  border-radius: 0;
+  flex-grow: 1;
+  box-sizing: border-box;
+  padding: 0.75em 0 0.75em 1.25em;
+}
+
+.searchbox,
+.searchbox-container {
+  align-items: center;
+  flex-direction: column;
+  line-height: 1.25em;
+}
+
+.searchbox-container {
+  position: fixed;
+  z-index: 101;
+  display: flex;
+  overflow: hidden;
+  border-radius: 24px;
+  width: 640px;
+  top: 100px;
+}
+
+.searchbox-body,
+.searchbox-footer {
+  width: 100%;
+}
+
+.searchbox-input-container {
+  width: 100%;
+  display: flex;
+  flex-direction: row;
+  line-height: 1.5em;
+  font-weight: 400;
+  min-height: 3rem;
+}
+
+.searchbox-body {
+  flex-grow: 1;
+  overflow-y: auto;
+  border-top: 1px solid var(--base);
+}
+
+.searchbox-result-item,
+.searchbox-result-section header {
+  padding: 0.75em 1em;
+}
+
+.searchbox-result-section {
+  border-bottom: 1px dotted var(--base);
+}
+
+.searchbox-result-item {
+  display: flex;
+  flex-direction: row;
+}
+
+.searchbox-result-icon {
+  margin-right: 1em;
+}
+
+.searchbox-result-content {
+  overflow: hidden;
+}
+
+.searchbox-result-preview {
+  color: var(--subtext0);
+}
+.searchbox-result-preview,
+.searchbox-result-title {
+  display: block;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+
+.searchbox-result-preview {
+  margin-top: 0.25em;
+}
+
+.searchbox-footer {
+  padding: 0.5em 1em;
+}
+
+.searchbox-pagination {
+  margin: 0;
+  padding: 0;
+  list-style: none;
+  text-align: center;
+}
+
+.searchbox-pagination .searchbox-pagination-item {
+  margin: 0 0.25rem;
+}
+
+.searchbox-pagination .searchbox-pagination-item,
+.searchbox-pagination .searchbox-pagination-link {
+  display: inline-block;
+}
+
+.searchbox-pagination .searchbox-pagination-link {
+  overflow: hidden;
+  padding: 0.5em 0.8em;
+  border-radius: 24px;
+}
+
+.searchbox
+  .searchbox-pagination
+  .searchbox-pagination-item.disabled
+  .searchbox-pagination-link {
+  cursor: not-allowed;
+}
+
+/* #endregion Search */