assets: Replicate static assets

4 files changed, 2260 insertions, 0 deletions

diff --git a/assets/css/default.css b/assets/css/default.css
new file mode 100644
index 0000000..81fea52
--- /dev/null
+++ b/assets/css/default.css
@@ -0,0 +1,1629 @@
+/* ###### Semantic Pact CSS ###### */
+
+/* ----- Selection ----- */
+
+::selection {
+  color: #fff;
+  background-color: #000;
+  text-shadow: 0 0 currentColor;
+}
+
+::-webkit-selection {
+  color: #fff;
+  background-color: #000;
+  text-shadow: 0 0 currentColor;
+}
+
+::-moz-selection {
+  color: #fff;
+  background-color: #000;
+  text-shadow: 0 0 currentColor;
+}
+
+/* ----- Colors ----- */
+
+:root {
+  color-scheme: light dark;
+  --active-alternate: #cce1ff;
+  --background-bolder: #fff;
+  --background-transparent: rgba(255, 255, 255, 0.9);
+  --background: #fefefe;
+  --border-darker: #ccc;
+  --border-lighter: #eee;
+  --button-background: #fff;
+  --danger-background: #fcd2cf;
+  --danger: #8f0000;
+  --disabled: #999;
+  --fade: #555;
+  --foreground: #111;
+  --hover-alternate: #ebf3ff;
+  --hover: #eee;
+  --input-background: #eff3f4;
+  --link: #0149bc;
+  --shadow: #999;
+  --spoiler: #333;
+  --success-background: #d5f3c4;
+  --success: #1d3c0c;
+  --target-background: #fffdeb;
+  --warning-background: #ffe699;
+  --warning: #332600;
+  --widget-background: #f9f9f9;
+  --table-row-odd-background: #f3f3f3;
+  --table-row-even-background: #f9f9f9;
+}
+
+@media (prefers-color-scheme: dark) {
+  :root {
+    --active-alternate: var(--hover-alternate);
+    --background-bolder: #111;
+    --background-transparent: rgba(28, 28, 28, 0.9);
+    --background: #1c1c1c;
+    --border-darker: #555;
+    --border-lighter: #262626;
+    --button-background: #333;
+    --danger-background: #220402;
+    --danger: #ff9494;
+    --disabled: #999;
+    --fade: #aaa;
+    --foreground: #ddd;
+    --hover-alternate: #1c263a;
+    --hover: #303030;
+    --input-background: #333;
+    --link: #8cb4ff;
+    --shadow: #000;
+    --spoiler: #333;
+    --success-background: #2d3e0f;
+    --success: #d5f3c4;
+    --target-background: #242200;
+    --warning-background: #3d3d00;
+    --warning: #ffe699;
+    --widget-background: #262626;
+    --table-row-odd-background: #2e3838;
+    --table-row-even-background: #273030;
+  }
+  img {
+    filter: brightness(75%);
+  }
+  code-block {
+    filter: invert(90%);
+    display: block;
+  }
+}
+
+/* ----- Psuedo ----- */
+
+*,
+::before,
+::after {
+  box-sizing: border-box;
+}
+
+::before,
+::after {
+  text-decoration: inherit;
+  vertical-align: inherit;
+}
+
+:target::before {
+  content: "";
+  display: block;
+  height: 4rem;
+  margin-top: -4rem;
+  visibility: hidden;
+}
+
+:not(#main):target micro-summary,
+:not(#main):target micro-summary:hover {
+  background-color: #fffdeb;
+  background-color: var(--target-background);
+  outline: 1px dashed #ccc;
+  outline: 1px dashed var(--border-darker);
+  outline-offset: -1px;
+}
+
+:focus:not(html):not(body):not(svg) {
+  outline: 0.15rem solid;
+  outline-offset: -0.15rem;
+  text-decoration: none;
+}
+
+:focus:not(html):not(body):not(pre):not(svg) {
+  background-color: #ffe699;
+  background-color: var(--warning-background);
+}
+
+/* ----- Skip link ----- */
+
+skip-link a {
+  position: absolute;
+  left: -9999em;
+}
+
+skip-link a:focus {
+  z-index: 200;
+  position: fixed;
+  left: 50%;
+  transform: translate(-50%, 0);
+  top: 0.5rem;
+  padding: 0.75rem;
+  border-radius: 0.25rem;
+}
+
+/* ----- Elements ----- */
+
+html {
+  font-size: 95%;
+  line-height: 1.5;
+  word-break: break-word;
+  text-rendering: optimizeSpeed;
+  margin-left: calc(100vw - 100%);
+  margin-right: 0;
+}
+
+html,
+samp {
+  font-family: "Noto Sans", -apple-system, BlinkMacSystemFont, "Segoe UI",
+    Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans",
+    "Helvetica Neue", sans-serif, "Apple Color Emoji", "Segoe UI Emoji",
+    "Segoe UI Symbol";
+}
+
+body,
+dl dl,
+dl ol,
+dl ul,
+ol dl,
+ul dl,
+ol ol,
+ol ul,
+ul ol,
+ul ul,
+button,
+input,
+select,
+textarea {
+  margin: 0;
+}
+
+ol {
+  counter-reset: ol;
+  padding-left: 2.5rem;
+}
+
+ol li {
+  overflow-wrap: break-word;
+  word-break: break-word;
+  list-style: none;
+}
+
+ol li:before {
+  border-radius: 100%;
+  border: 1px solid;
+  content: counter(ol);
+  counter-increment: ol;
+  margin-left: -2rem;
+  font-size: 85%;
+  padding: 0 0.35rem;
+  position: absolute;
+}
+
+ol li + li {
+  margin-top: 0.5rem;
+}
+
+main {
+  min-height: 100%;
+}
+
+main,
+details,
+code-block,
+diagram-container {
+  display: block;
+}
+
+summary {
+  display: list-item;
+}
+
+cite {
+  font-style: normal;
+}
+
+ul {
+  list-style: none;
+  padding-left: 1rem;
+}
+
+nav ol,
+nav ul {
+  list-style: none;
+  display: inline-block;
+  padding: 0;
+}
+
+footer {
+  text-align: center;
+  color: #444;
+  color: var(--fade);
+  margin: 1rem 0;
+  font-size: 85%;
+}
+
+figcaption a {
+  color: inherit;
+}
+
+q a {
+  color: inherit;
+}
+
+q:before {
+  content: "\201C";
+}
+
+q:after {
+  content: "\201D";
+}
+
+object {
+  width: 100%;
+  border: 1px solid #ccc;
+  border: 1px solid var(--border-lighter);
+  min-height: 16rem;
+  border-radius: 0.5rem;
+}
+
+details {
+  cursor: pointer;
+}
+
+details:hover summary span {
+  text-decoration: underline;
+}
+
+a {
+  color: #0149bc;
+  color: var(--link);
+  text-decoration: underline;
+  text-underline-offset: 0.05rem;
+}
+
+a:hover {
+  color: #000;
+  color: var(--foreground);
+  text-decoration-thickness: 0.15rem !important;
+}
+
+a:hover img {
+  box-shadow: 0 8px 32px #999;
+  box-shadow: 0 8px 32px var(--shadow);
+  filter: unset;
+}
+
+a:active,
+button:active {
+  position: relative;
+  top: 1px;
+}
+
+column-left nav {
+  position: sticky;
+  position: -webkit-sticky;
+  align-self: flex-start;
+  top: 0.5rem;
+  text-align: right;
+}
+
+column-left nav a {
+  align-items: center;
+  color: inherit;
+  color: var(--foreground);
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: flex-end;
+  padding: 0.5rem;
+  text-decoration: none;
+  border-radius: 0.5rem;
+}
+
+column-left nav li {
+  margin-bottom: 0.25rem;
+}
+
+column-left nav li:hover a {
+  background-color: #eee;
+  background-color: var(--hover);
+  border-radius: 0.5rem;
+}
+
+column-left nav li:hover svg {
+  fill: #ffe699;
+  fill: var(--warning-background);
+}
+
+column-left nav a span {
+  padding: 0 1rem;
+}
+
+pre,
+kbd,
+code,
+svg text,
+item-list a span:last-child,
+item-list a span:first-child {
+  font-family: "Fira Code", "Lucida Console", "Andale Mono", "Roboto Mono",
+    "Ubuntu Monospace", "Noto Mono", "Oxygen Mono", "Liberation Mono", monospace,
+    "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+}
+
+abbr[title] {
+  cursor: help;
+  border-bottom: 1px dashed;
+  text-decoration: none;
+}
+
+abbr[title]:hover {
+  border-bottom: 2px dashed;
+}
+
+samp {
+  font-variant: all-small-caps;
+  letter-spacing: 0.05rem;
+}
+
+b,
+strong {
+  font-weight: 700;
+}
+
+small {
+  font-size: 80%;
+  opacity: 0.85;
+}
+
+audio,
+canvas,
+iframe,
+img,
+svg,
+video {
+  vertical-align: middle;
+}
+
+video,
+audio {
+  width: 100%;
+}
+
+audio {
+  margin: 0.75rem 0;
+}
+
+figure {
+  text-align: center;
+}
+
+iframe {
+  width: 100%;
+  border: 1px solid #ccc;
+  border: 1px solid var(--border-darker);
+  background-color: #fefefe;
+  border-radius: 0.75rem !important;
+  min-height: 16rem;
+}
+
+self-embed iframe {
+  min-height: 16rem;
+  max-height: 16rem;
+}
+
+img {
+  height: auto;
+  max-width: 100%;
+  border: 1px solid #ccc;
+  border: 1px solid var(--border-darker);
+  border-radius: 0.75rem;
+  object-fit: cover;
+  display: block;
+}
+
+img,
+iframe {
+  user-select: none;
+}
+
+p {
+  line-height: 1.35;
+}
+
+svg {
+  stroke-width: 0.08rem;
+}
+
+svg:not([fill]) {
+  fill: currentColor;
+}
+
+svg:not(:root) {
+  overflow: hidden;
+}
+
+button,
+input {
+  overflow: visible;
+}
+
+button,
+select {
+  text-transform: none;
+}
+
+button,
+[type="reset"],
+[type="button"],
+[type="submit"],
+paginator-navigation a,
+micro-author micro-summary > a {
+  align-items: center;
+  appearance: button;
+  background-color: #fff;
+  background-color: var(--button-background);
+  border-radius: 0.5rem;
+  border: 1px solid #ccc;
+  border: 1px solid var(--border-lighter);
+  box-shadow: 0 1px 1px #999;
+  color: inherit;
+  cursor: pointer;
+  display: flex;
+  font-size: 100%;
+  height: 1.95rem;
+  padding: 0.25rem 0.5rem;
+  text-decoration: none;
+}
+
+button svg,
+micro-author micro-summary > a svg {
+  height: 1.25rem;
+  margin: 0 0.25rem;
+}
+
+hr {
+  border-top: 1px solid;
+}
+
+/* ----- Tables ----- */
+
+table {
+  border-radius: 0.5rem;
+  border-spacing: 0;
+  border: 1px solid #ccc;
+  border: 1px solid var(--border-darker);
+  padding: 0.5rem 0 0 0;
+  width: 100%;
+  background-color: #fefefe;
+  background-color: var(--background);
+}
+
+th {
+  border-bottom: 1px solid #ccc;
+  border-bottom: 1px solid var(--border-darker);
+  padding: 0 0.5rem 0.5rem 0.5rem;
+  text-align: left;
+}
+
+td {
+  padding: 0.5rem 0 0.5rem 0.5rem;
+  border-right: 1px solid #ccc;
+  border-right: 1px solid var(--border-darker);
+  border-bottom: 1px solid #ccc;
+  border-bottom: 1px solid var(--border-darker);
+}
+
+td:last-child {
+  padding-right: 0.5rem;
+  border-right: none;
+}
+
+tr:last-child td {
+  border-bottom: none;
+}
+
+tbody tr:nth-child(odd) td {
+  background-color: #f3f3f3;
+  background-color: var(--table-row-odd-background);
+}
+
+tbody tr:nth-child(even) td {
+  background-color: #f9f9f9;
+  background-color: var(--table-row-even-background);
+}
+
+tbody tr:hover td {
+  background-color: #eee;
+  background-color: var(--hover);
+}
+
+tr:last-child td:first-child {
+  border-bottom-left-radius: 0.5rem;
+}
+
+tr:last-child td:last-child {
+  border-bottom-right-radius: 0.5rem;
+}
+
+/* ----- Print ----- */
+
+@media print {
+  a[href^="http"]::after {
+    content: " (" attr(href) ")";
+  }
+
+  abbr[title]::after {
+    content: " (" attr(title) ")";
+  }
+}
+
+/* ----- Base ----- */
+
+body {
+  background-color: #fefefe;
+  background-color: var(--background);
+  color: #000;
+  color: var(--foreground);
+  display: flex;
+  margin: 0 auto;
+  max-width: 1250px;
+  min-height: 100%;
+  overflow-x: hidden;
+  -webkit-text-size-adjust: none;
+}
+
+column-left {
+  display: flex;
+  flex: 1;
+  justify-content: flex-end;
+}
+
+column-right {
+  flex: 2;
+  max-width: 400px;
+}
+
+column-left,
+column-right {
+  margin: 0.5rem 2rem;
+}
+
+column-middle {
+  flex: 6;
+  border-left: 1px solid;
+  border-right: 1px solid;
+  border-color: #eee;
+  border-color: var(--border-lighter);
+  max-width: 600px;
+  min-height: 100vh;
+  width: 100%;
+}
+
+micro-card,
+micro-tags,
+micro-expires,
+micro-article {
+  display: block;
+}
+
+message-archive h1 {
+  text-align: center;
+  font-weight: 400;
+  font-size: 150%;
+}
+
+micro-tags {
+  margin-bottom: -0.5rem;
+  margin-top: 0.5rem;
+}
+
+micro-tags a {
+  border-radius: 0.5rem;
+  padding-top: 0.125rem;
+  padding-bottom: 0.125rem;
+  display: inline-block;
+  padding-left: 0.5rem;
+  text-decoration: none;
+  padding-right: 0.5rem;
+  box-shadow: 0 1px 1px #999;
+  margin: 0 0.25rem 0.5rem 0;
+}
+
+micro-summary,
+micro-article {
+  border-bottom: 1px solid;
+  border-color: #eee;
+  border-color: var(--border-lighter);
+  display: flex;
+  padding: 1rem;
+  position: relative;
+}
+
+micro-summary:hover,
+micro-summary:focus-within {
+  background-color: #f5f9ff;
+  background-color: var(--hover-alternate);
+}
+
+micro-author micro-summary {
+  justify-content: start;
+  align-items: center;
+  border: none;
+}
+
+micro-author micro-thumbnail {
+  flex: none;
+}
+
+micro-author micro-header {
+  line-height: 1;
+  margin: 0 1.25rem 0 0.5rem;
+  flex: 1;
+  height: 3rem;
+  padding: 0 0.5rem;
+}
+
+micro-thumbnail a {
+  display: block;
+}
+
+micro-thumbnail figure {
+  margin: 0 0.75rem 0 0;
+}
+
+micro-thumbnail figure img {
+  border-radius: 100%;
+  min-width: 3.5rem;
+  min-height: 3.5rem;
+  max-width: 3.5rem;
+  max-height: 3.5rem;
+}
+
+micro-content {
+  flex: 8;
+  width: 0;
+}
+
+micro-metadata {
+  color: #444;
+  color: var(--fade);
+  line-height: 1.25;
+  display: flex;
+  align-items: center;
+}
+
+micro-metadata h2 {
+  margin-right: 0.5rem;
+}
+
+micro-metadata a {
+  color: inherit;
+}
+
+micro-metadata expiry-date,
+micro-metadata word-limit em,
+micro-metadata draft-label em {
+  color: #8f0000;
+  color: var(--danger);
+  font-style: normal;
+}
+
+micro-metadata draft-label em {
+  font-variant: all-small-caps;
+}
+
+micro-header footer svg,
+micro-metadata expiry-date svg,
+micro-metadata anchored-entry svg,
+micro-metadata unlisted-entry svg {
+  height: 1rem;
+  width: 1rem;
+  stroke-width: 0.1rem;
+}
+
+micro-metadata unlisted-entry {
+  font-variant: all-small-caps;
+}
+
+micro-metadata read-time,
+micro-metadata word-limit,
+micro-metadata expiry-date,
+micro-metadata unlisted-entry {
+  cursor: help;
+}
+
+anchored-entry {
+  display: flex;
+  align-items: center;
+  margin-bottom: 0.25rem;
+  margin-top: -0.5rem;
+}
+
+anchored-entry svg {
+  margin-right: 0.25rem;
+}
+
+anchored-entry span {
+  margin-right: 0.25rem;
+}
+
+anchored-entry span:not(:last-child):after {
+  content: "\00B7";
+  margin-left: 0.25rem;
+}
+
+anchored-pinned svg {
+  fill: #9ed1fa;
+}
+
+anchored-liked svg {
+  fill: #cd5c5c;
+}
+
+micro-header micro-header-image img {
+  height: 12rem;
+  width: 100%;
+  border-radius: 0;
+}
+
+micro-header micro-header-picture img {
+  height: 8rem;
+  width: 8rem;
+  border-radius: 100%;
+  margin: -4rem 2rem 0 2rem;
+  background-color: #fff;
+  padding: 0.35rem;
+  position: relative;
+}
+
+micro-header section {
+  margin: 1rem 2rem 0 2rem;
+  line-height: 1;
+  display: flex;
+  align-items: baseline;
+}
+
+micro-header-title {
+  margin-right: 1rem;
+  flex: 1;
+}
+
+micro-header-description {
+  flex: 6;
+}
+
+micro-header h1 {
+  margin-bottom: 0.25rem;
+}
+
+micro-header h2 {
+  font-weight: 400;
+  color: #444;
+  color: var(--fade);
+  margin: 0;
+}
+
+micro-header footer,
+micro-header footer code {
+  color: #444;
+  color: var(--fade);
+}
+
+micro-header footer {
+  margin: 1.25rem 2rem 0.25rem 2rem;
+  text-align: center;
+  font-size: 95%;
+}
+
+micro-header footer p {
+  margin: 0.75rem 0.5rem 0.25em 0;
+  display: inline;
+}
+
+micro-nsfw-content * {
+  visibility: hidden;
+  opacity: 0;
+  pointer-events: none;
+}
+
+micro-nsfw details svg {
+  stroke-width: 0.1rem;
+  margin-right: 0.15rem;
+}
+
+micro-nsfw details summary {
+  font-variant: all-small-caps;
+  letter-spacing: 0.025rem;
+  line-height: 1.25;
+  color: #8f0000;
+  color: var(--danger);
+  list-style: none;
+}
+
+micro-nsfw details > summary::-webkit-details-marker {
+  display: none;
+}
+
+micro-nsfw-content {
+  border-radius: 0.25rem;
+  display: block;
+  background: repeating-linear-gradient(
+    180deg,
+    #ff9999,
+    #ff9999 1rem,
+    #eee 1rem,
+    #eee 2rem
+  );
+}
+
+micro-nsfw details[open] + micro-nsfw-content * {
+  filter: none;
+  transition: 1s;
+  visibility: visible;
+  opacity: 1;
+  background: none;
+  outline: none;
+  pointer-events: auto;
+}
+
+micro-nsfw details[open] + micro-nsfw-content {
+  background: none;
+}
+
+@supports (filter: blur(2rem)) {
+  micro-nsfw-content * {
+    filter: blur(2rem);
+    visibility: unset;
+    opacity: unset;
+  }
+  micro-nsfw-content {
+    outline: none;
+    background: unset;
+  }
+}
+
+tab-list {
+  display: flex;
+  justify-content: center;
+  border-bottom: 1px solid;
+  border-color: #ddd;
+  border-color: var(--border-darker);
+}
+
+tab-list a:not(:last-child) {
+  margin-right: 0.5rem;
+}
+
+tab-list a {
+  border-left: 1px solid;
+  border-right: 1px solid;
+  border-top-left-radius: 0.5rem;
+  border-top-right-radius: 0.5rem;
+  border-top: 1px solid;
+  border-color: #ddd;
+  border-color: var(--border-darker);
+  color: #333;
+  color: var(--foreground);
+  margin-top: 0.5rem;
+  padding: 0.5rem 1rem;
+  position: relative;
+  text-decoration: none;
+  top: 1px;
+  border-bottom: 2px solid var(--background);
+}
+
+tab-list a:hover {
+  background-color: #eee;
+  background-color: var(--hover);
+  color: inherit;
+}
+
+column-middle nav {
+  align-items: center;
+  background-color: #fefefe;
+  background-color: var(--background);
+  border-bottom: 1px solid;
+  border-color: #eee;
+  border-color: var(--border-lighter);
+  display: flex;
+  height: 4rem;
+  position: sticky;
+  position: -webkit-sticky;
+  top: 0;
+  width: 100%;
+  z-index: 100;
+}
+
+column-middle nav section h1,
+column-middle nav section small {
+  margin: 0;
+}
+
+micro-author micro-header,
+column-middle nav section h1,
+column-middle nav section small {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+column-middle nav section {
+  line-height: 1.25;
+  padding: 0 0.5rem;
+}
+
+icon-button a {
+  color: inherit;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 4rem;
+  flex-wrap: wrap;
+  text-decoration: none;
+  height: 100%;
+  padding: 0.5rem 0;
+}
+
+icon-button a:hover {
+  background-color: #eee;
+  background-color: var(--hover);
+}
+
+icon-button svg {
+  width: 100%;
+}
+
+icon-button p {
+  margin: 0;
+}
+
+code-block pre code {
+  display: inline-block;
+  min-width: 100%;
+  border-top: 1px solid #bbb;
+  padding: 0.75rem;
+}
+
+code-block[data-lines] pre code {
+  padding: 0.1rem 0.75rem;
+}
+
+code-block header {
+  position: relative;
+  top: 1.85rem;
+  margin-top: -1rem;
+  height: 1rem;
+  padding: 0 0.5rem;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+code-block header language-label {
+  padding: 0.125rem 1rem;
+  font-variant: all-small-caps;
+}
+
+code-block pre {
+  border-radius: 0.5rem;
+  border: 1px solid #ccc;
+  border: 1px solid var(--border-darker);
+  display: block;
+  font-size: 95%;
+  margin: 0;
+  overflow-x: auto;
+  overflow-y: hidden;
+  padding: 2.65rem 0 0 0;
+  tab-size: 2;
+  word-break: break-word;
+  white-space: pre;
+}
+
+paginator-navigation {
+  padding: 1rem;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+paginator-navigation a,
+paginator-navigation button {
+  margin: 0 0.25rem;
+  font-size: 85%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+paginator-navigation svg {
+  height: 1.316rem;
+}
+
+web-ring,
+author-list,
+gallery-images {
+  padding-bottom: 2rem;
+  display: block;
+}
+
+web-ring > h1,
+author-list > h1,
+gallery-images > h1 {
+  text-align: center;
+  margin-bottom: 1rem;
+  font-variant: all-small-caps;
+  font-size: 110%;
+}
+
+gallery-images section {
+  display: flex;
+  flex-wrap: wrap;
+}
+
+gallery-images img {
+  width: 33.333%;
+  border-radius: 0;
+  height: 6rem;
+}
+
+gallery-images img:first-child {
+  border-top-left-radius: 0.5rem;
+}
+
+gallery-images img:nth-child(3) {
+  border-top-right-radius: 0.5rem;
+}
+
+gallery-images img:nth-child(4) {
+  border-bottom-left-radius: 0.5rem;
+}
+
+gallery-images img:last-child {
+  border-bottom-right-radius: 0.5rem;
+}
+
+web-ring {
+  border-radius: 1rem;
+  position: sticky;
+  position: -webkit-sticky;
+  top: 1rem;
+}
+
+web-ring a {
+  text-decoration: none;
+}
+
+web-ring a[href^="http"]:hover {
+  text-decoration: underline;
+}
+
+web-ring time {
+  font-variant: small-caps;
+  color: #444;
+  color: var(--fade);
+}
+
+web-ring header {
+  font-weight: 700;
+}
+
+web-ring p {
+  margin-bottom: 0 !important;
+}
+
+web-ring-item:not(:last-child) {
+  margin-bottom: 2rem;
+  display: block;
+}
+
+micro-tags a,
+web-ring section,
+author-list section {
+  background-color: #f9f9f9;
+  background-color: var(--widget-background);
+}
+
+web-ring section {
+  border-radius: 1rem;
+  padding: 1rem;
+}
+
+author-list section {
+  display: block;
+  border-radius: 1rem;
+}
+
+search-entry {
+  display: inherit;
+  width: 100%;
+}
+
+search-entry[data-focus],
+search-entry:focus-within {
+  position: absolute;
+}
+
+search-entry:focus-within form {
+  border-bottom-left-radius: 0;
+  border-bottom-right-radius: 0;
+}
+
+search-entry form {
+  background-color: #fefefe;
+  background-color: var(--background);
+  border-radius: 0.5rem;
+  border: 1px solid;
+  border-color: #ccc;
+  border-color: var(--border-darker);
+  display: inline-flex;
+  margin: 0 1rem;
+  width: 100%;
+  position: relative;
+}
+
+search-entry form button {
+  background-color: transparent;
+  border: none;
+  box-shadow: none;
+  cursor: pointer;
+  display: block;
+  padding: 0;
+  border-radius: 0;
+  border-top-right-radius: 0.5rem;
+  border-bottom-right-radius: 0.5rem;
+  min-width: 4rem;
+  max-width: 4rem;
+  height: 2.85rem;
+  line-height: 1;
+}
+
+search-entry form input {
+  -webkit-appearance: none;
+  background-color: #fefefe;
+  background-color: var(--background);
+  border-bottom-left-radius: 0.5rem;
+  border-top-left-radius: 0.5rem;
+  border: none;
+  font-size: 100%;
+  line-height: 1.5;
+  padding-left: 1rem;
+  padding-right: 1rem;
+  width: 100%;
+}
+
+search-entry form button svg {
+  stroke-width: 0.1rem;
+}
+
+search-entry form input:focus {
+  outline: none;
+  background-color: #fefefe !important;
+  background-color: var(--background) !important;
+}
+
+search-entry ul {
+  position: absolute;
+  background-color: inherit;
+  padding-top: 2.9rem;
+  border: 1px solid #ccc;
+  border: 1px solid var(--border-darker);
+  border-radius: 0.5rem;
+  z-index: -1;
+  margin-right: 1rem;
+  margin-left: -0.05rem;
+  width: 100.3%;
+}
+
+search-entry ul li a span {
+  font-weight: 400;
+}
+
+search-entry ul li a {
+  font-weight: 700;
+  color: inherit;
+  text-decoration: none;
+  display: block;
+  padding: 0.25rem 0.75rem;
+}
+
+search-entry ul li:first-child a {
+  background-color: #ebf3ff;
+  background-color: var(--hover-alternate);
+}
+
+search-entry ul li a:hover {
+  background-color: #eee;
+  background-color: var(--hover);
+}
+
+item-list {
+  font-size: 100%;
+}
+
+item-list h1 {
+  padding: 1rem;
+}
+
+item-list ul {
+  padding: 0 0.5rem 0 0.5rem;
+}
+
+item-list a span:first-child {
+  text-transform: uppercase;
+}
+
+item-list a span:first-child,
+item-list a span:last-child {
+  flex: 1;
+  color: #444;
+  color: var(--fade);
+}
+
+item-list a span:nth-child(2) {
+  flex: 3;
+  margin: 0 0.5rem;
+}
+
+item-list li a {
+  display: flex;
+  text-decoration: none;
+  align-items: baseline;
+  margin: 0.25rem 0;
+  padding: 0.5rem;
+}
+
+item-list li:hover {
+  background-color: #eee;
+  background-color: var(--hover);
+}
+
+item-list li:hover span:last-child {
+  text-decoration: underline;
+}
+
+source-array footer {
+  padding: 0 1rem;
+}
+
+source-array li a {
+  padding: 0.25rem 0.5rem;
+}
+
+context-menu {
+  background-color: #fff;
+  background-color: var(--background-bolder);
+  border: 1px solid;
+  border-color: #ddd;
+  border-color: var(--border-lighter);
+  border-radius: 4px;
+  box-shadow: 0 0.5em 1em -0.125em rgba(10, 10, 10, 0.1),
+    0 0 0 1px rgba(10, 10, 10, 0.02);
+  padding-bottom: 0.5rem;
+  padding-top: 0.5rem;
+  min-width: 6.25rem;
+  position: absolute;
+  z-index: 101;
+  max-width: 15rem;
+  visibility: hidden;
+  opacity: 0;
+}
+
+context-profile context-menu {
+  padding: 1rem;
+  display: block;
+  text-align: left;
+}
+
+context-profile a {
+  display: inline;
+}
+
+context-profile h2 {
+  color: #333;
+  color: var(--fade);
+  font-weight: 400;
+}
+
+context-profile section {
+  display: flex;
+  align-items: center;
+}
+
+context-profile aside:nth-child(2) {
+  line-height: 1.25;
+}
+
+micro-thumbnail figure:hover context-menu {
+  visibility: visible;
+  opacity: 1;
+}
+
+diagram-container svg {
+  border: 1px solid;
+  border-radius: 0.5rem;
+  border-color: #ccc;
+  border-color: var(--border-darker);
+  margin: 0.5rem 0;
+  background-color: #fefefe;
+  background-color: var(--background);
+}
+
+twitter-tweet {
+  min-height: 20rem;
+  max-height: 20rem;
+  display: block;
+  overflow-y: auto;
+}
+
+twitter-tweet iframe {
+  border: none;
+}
+
+/* ----- Typography ----- */
+
+h1,
+h2,
+h3 {
+  font-size: 100%;
+  margin: 0;
+}
+
+p,
+ul,
+dd,
+dl,
+ol,
+figure,
+blockquote {
+  margin: 0;
+}
+
+p,
+dl,
+table,
+figure {
+  margin-top: 0.25rem;
+}
+
+p:not(:last-child),
+ol:not(:last-child),
+ul:not(:last-child),
+dl:not(:last-child),
+table:not(:last-child),
+figure:not(:last-child),
+code-block:not(:last-child),
+blockquote:not(:last-child) {
+  margin-bottom: 0.75rem;
+}
+
+figcaption {
+  font-size: 85%;
+  margin-top: 0.5rem;
+  text-align: center;
+  color: #444;
+  color: var(--fade);
+}
+
+sup {
+  vertical-align: super;
+  font-size: 85%;
+}
+
+sub {
+  vertical-align: sub;
+  font-size: 85%;
+}
+
+s,
+del,
+mark,
+ins {
+  padding: 0 0.15rem;
+  line-height: 1.5;
+}
+
+mark {
+  background-color: #ffe699;
+  background-color: var(--warning-background);
+  color: #332600;
+  color: var(--warning);
+}
+
+ins {
+  background-color: #d5f3c4;
+  background-color: var(--success-background);
+  color: #1d3c0c;
+  color: var(--success);
+  text-decoration: none;
+}
+
+del {
+  background-color: #fcd2cf;
+  background-color: var(--danger-background);
+  color: #8f0000;
+  color: var(--danger);
+}
+
+s {
+  text-decoration: none;
+  background-color: #333;
+  background-color: var(--spoiler);
+  color: transparent;
+}
+
+s label {
+  cursor: help;
+}
+
+[type="checkbox"]:checked ~ s {
+  background-color: inherit;
+  color: inherit;
+}
+
+blockquote {
+  color: var(--fade);
+  padding-left: 2rem;
+}
+
+video {
+  border-radius: 0.75rem;
+}
+
+kbd {
+  background-color: #eee;
+  border-radius: 3px;
+  border: 1px solid #b4b4b4;
+  box-shadow: 0 1px 1px #737373, 0 2px 0 0 #f2f2f2 inset;
+  color: #333;
+  display: inline-block;
+  font-size: 0.85em;
+  font-weight: 700;
+  line-height: 1;
+  padding: 2px 4px;
+  white-space: nowrap;
+}
+
+/* ----- Attributes ----- */
+
+[tabindex="-1"]:focus {
+  outline: none;
+}
+
+[hidden] {
+  display: none;
+}
+
+[disabled] {
+  cursor: not-allowed;
+  border-color: #ddd;
+  border-color: var(--border-lighter);
+  color: #999;
+  color: var(--disabled);
+}
+
+[id^="imgur-embed-iframe-pub"] {
+  min-width: 100%;
+}
+
+[role="doc-endnotes"] {
+  margin-bottom: 0.75rem;
+}
+
+[role="doc-endnotes"] hr {
+  border-top: 1px solid #ccc;
+  margin-bottom: 0.75rem;
+}
+
+/* ----- Responsive ----- */
+
+@media screen and (max-width: 1220px) {
+  column-left {
+    flex: none;
+    margin: 0.5rem;
+  }
+  column-left nav a {
+    flex-direction: column-reverse;
+    justify-content: center;
+    white-space: nowrap;
+    overflow: hidden;
+  }
+  column-left nav a span {
+    padding-top: 0.5rem;
+  }
+}
+
+@media screen and (max-width: 1055px) {
+  column-left,
+  search-entry,
+  column-middle nav section {
+    display: none;
+  }
+  column-middle nav {
+    justify-content: space-between;
+    overflow-x: auto;
+    overflow-y: hidden;
+  }
+  icon-navigator {
+    display: inline !important;
+  }
+}
+
+@media screen and (max-width: 925px) {
+  column-right {
+    display: none;
+  }
+  micro-metadata {
+    line-height: inherit;
+  }
+  tab-list a {
+    font-size: 80%;
+  }
+  micro-header section {
+    display: block;
+  }
+  column-middle {
+    display: block;
+    max-width: 100%;
+  }
+  column-middle nav {
+    position: fixed;
+  }
+  navigation-separator hr[hidden] {
+    border-color: transparent;
+    display: flex;
+    height: 0;
+    margin: 0;
+    padding-top: 4rem;
+    border: none;
+  }
+  micro-card {
+    max-width: 600px;
+    margin: 0 auto;
+  }
+  html {
+    margin: 0;
+  }
+  body {
+    display: block;
+    overflow-y: scroll;
+  }
+  nav {
+    box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.2);
+  }
+  nav:active,
+  nav:hover,
+  nav:focus,
+  nav:focus-within,
+  nav:focus-visible {
+    box-shadow: 15px 0 15px -15px inset, -15px 0 15px -15px inset;
+  }
+}
+
+@media screen and (max-width: 460px) {
+  micro-card micro-summary > micro-thumbnail {
+    display: none;
+  }
+  micro-metadata micro-thumbnail[hidden] {
+    display: block;
+  }
+}
+
+/* ----- Self Frames ----- */
+
+@media (max-height: 16rem) {
+  micro-card {
+    width: 100vw;
+  }
+  footer,
+  column-middle nav,
+  navigation-separator hr[hidden] {
+    display: none;
+  }
+}
diff --git a/assets/css/noscript.css b/assets/css/noscript.css
new file mode 100644
index 0000000..9a18fb6
--- /dev/null
+++ b/assets/css/noscript.css
@@ -0,0 +1,3 @@
+code-block button {
+  display: none;
+}
diff --git a/assets/css/syntax-highlight-default.css b/assets/css/syntax-highlight-default.css
new file mode 100644
index 0000000..c81e291
--- /dev/null
+++ b/assets/css/syntax-highlight-default.css
@@ -0,0 +1,202 @@
+/* ----- Colors ----- */
+
+/* ----- Format ----- */
+
+.chroma .hl {
+  display: block;
+  padding: 0 0.5rem;
+  margin: 0 -0.5rem;
+}
+
+.chroma .ln a {
+  background-color: #edf2f7;
+  padding: 0.25rem 0.75rem;
+  margin: 0 1rem 0 -0.75rem;
+  user-select: none;
+}
+
+.chroma .ln a:hover {
+  outline: 0.15rem solid !important;
+  outline-offset: -0.3rem;
+}
+
+code-block button {
+  border: 1px solid #ccc;
+}
+
+.chroma .line:hover {
+  background-color: #f2f2f2;
+  display: block;
+  width: 100%;
+}
+
+/* ------ Tokens ------ */
+
+:root {
+  --code-chroma-background:       #ffffff;
+  --code-chroma-foreground:       #333333;
+  --code-chroma-error-background: #960050;
+  --code-chroma-error-foreground: #960050;
+  --code-chroma-label-background: #006894;
+  --code-chroma-label-foreground: #e6e6e6;
+  --code-chroma-line-highlight:   #d9ddf2;
+  --code-chroma-line-number:      #375462;
+  --code-chroma-line:             var(--code-chroma-foreground);
+}
+
+/* ChromaForeground      */  code-block, .chroma, .highlight { color:            #333333; color:            var(--code-chroma-foreground);                  }
+/* ChromaBackground      */  code-block button, .chroma      { background-color: #ffffff; background-color: var(--code-chroma-background);                  }
+/* ChromaErrorBackground */ .chroma .err                     { color:            #960050; color:            var(--code-chroma-error-background);            }
+/* ChromaErrorForeground */ .chroma .err                     { color:            #960050; color:            var(--code-chroma-error-foreground);            }
+/* ChromaLabelBackground */ .chroma code:before              { background-color: #006894; background-color: var(--code-chroma-label-background);            }
+/* ChromaLabelForeground */ .chroma code:before              { color:            #e6e6e6; color:            var(--code-chroma-label-foreground);            }
+/* ChromaLine            */ .chroma .line                    { color:            #333333; color:            var(--code-chroma-line);                        }
+/* ChromaLineHighlight   */ .chroma .hl                      { background-color: #d9ddf2; background-color: var(--code-chroma-line-highlight);              }
+/* ChromaLineNumber      */ .chroma .ln a                    { color: #375462 !important; color:            var(--code-chroma-line-number) !important;      }
+
+.chroma .hl {
+  background-color: #fff8c5;
+}
+
+:root {
+  --code-comment:              #4f4f4f;
+  --code-comment-hashbang:     var(--code-comment);
+  --code-comment-multiline:    var(--code-comment);
+  --code-comment-preproc:      #222222;
+  --code-comment-preproc-file: #005194;
+  --code-comment-single:       var(--code-comment);
+  --code-comment-special:      var(--code-comment);
+}
+
+/* Comment            */ .chroma .c   { color: #222222; color: var(--code-comment);              }
+/* CommentHashbang    */ .chroma .ch  { color: #222222; color: var(--code-comment-hashbang);     }
+/* CommentMultiline   */ .chroma .cm  { color: #222222; color: var(--code-comment-multiline);    }
+/* CommentPreproc     */ .chroma .cp  { color: #222222; color: var(--code-comment-preproc);      }
+/* CommentPreprocFile */ .chroma .cpf { color: #005194; color: var(--code-comment-preproc-file); }
+/* CommentSingle      */ .chroma .c1  { color: #4f4f4f; color: var(--code-comment-single);       }
+/* CommentSpecial     */ .chroma .cs  { color: #222222; color: var(--code-comment-special);      }
+
+:root {
+  --code-generic-deleted:    #8d1007;
+  --code-generic-inserted:   #224e24;
+  --code-generic-subheading: #2d4958;
+  --code-generic-tag:        var(--code-generic);
+  --code-generic:            #2d4958;
+}
+
+/* GenericDeleted    */ .chroma .gd { color:       #8d1007; color: var(--code-generic-deleted);    }
+/* GenericInserted   */ .chroma .gi { color:       #224e24; color: var(--code-generic-inserted);   }
+/* GenericSubheading */ .chroma .gu { color:       #2d4958; color: var(--code-generic-subheading); }
+/* GenericStrong     */ .chroma .gs { font-weight: 700;    }
+/* GenericEmph       */ .chroma .ge { font-style:  italic; }
+
+.chroma .gi { background-color: #e6ffed; padding: 0.25rem 0; }
+.chroma .gd { background-color: #ffebe9; padding: 0.25rem 0; }
+
+:root {
+  --code-keyword:             #4f4f59;
+  --code-keyword-constant:    #07518d;
+  --code-keyword-declaration: var(--code-keyword);
+  --code-keyword-namespace:   var(--code-keyword);
+  --code-keyword-pseudo:      var(--code-keyword);
+  --code-keyword-reserved:    var(--code-keyword);
+  --code-keyword-type:        #36590d;
+}
+
+/* Keyword            */ .chroma .k  { color: #4f4f59; color: var(--code-keyword);     }
+/* KeywordConstant    */ .chroma .kc { color: #07518d; color: var(--code-keyword-constant);    }
+/* KeywordDeclaration */ .chroma .kd { color: #4f4f59; color: var(--code-keyword-declaration); }
+/* KeywordNamespace   */ .chroma .kn { color: #4f4f59; color: var(--code-keyword-namespace);   }
+/* KeywordPseudo      */ .chroma .kp { color: #4f4f59; color: var(--code-keyword-pseudo);      }
+/* KeywordReserved    */ .chroma .kr { color: #4f4f59; color: var(--code-keyword-reserved);    }
+/* KeywordType        */ .chroma .kt { color: #36590d; color: var(--code-keyword-type);        }
+
+:root {
+  --code-literal:                     #744601;
+  --code-literal-date:                var(--code-literal);
+  --code-literal-number:              var(--code-literal);
+  --code-literal-number-bin:          var(--code-literal);
+  --code-literal-number-float:        var(--code-literal);
+  --code-literal-number-hex:          var(--code-literal);
+  --code-literal-number-integer:      var(--code-literal);
+  --code-literal-number-integer-long: var(--code-literal);
+  --code-literal-number-oct:          var(--code-literal);
+  --code-literal-string:              #664d00;
+  --code-literal-string-affix:        #664d00;
+  --code-literal-string-backtick:     #664d00;
+  --code-literal-string-char:         #664d00;
+  --code-literal-string-delimiter:    #664d00;
+  --code-literal-string-doc:          #4f4f59;
+  --code-literal-string-double:       #664d00;
+  --code-literal-string-escape:       #664d00;
+  --code-literal-string-heredoc:      #664d00;
+  --code-literal-string-interpol:     #664d00;
+  --code-literal-string-other:        #664d00;
+  --code-literal-string-regex:        #942e51;
+  --code-literal-string-single:       #664d00;
+  --code-literal-string-symbol:       #664d00;
+}
+
+/* Literal                  */ .chroma .l  { color: #744601; color: var(--code-literal);                     }
+/* LiteralDate              */ .chroma .ld { color: #744601; color: var(--code-literal-date);                }
+/* LiteralNumber            */ .chroma .m  { color: #744601; color: var(--code-literal-number);              }
+/* LiteralNumberBin         */ .chroma .mb { color: #744601; color: var(--code-literal-number-bin);          }
+/* LiteralNumberFloat       */ .chroma .mf { color: #744601; color: var(--code-literal-number-float);        }
+/* LiteralNumberHex         */ .chroma .mh { color: #744601; color: var(--code-literal-number-hex);          }
+/* LiteralNumberInteger     */ .chroma .mi { color: #744601; color: var(--code-literal-number-integer);      }
+/* LiteralNumberIntegerLong */ .chroma .il { color: #744601; color: var(--code-literal-number-integer-long); }
+/* LiteralNumberOct         */ .chroma .mo { color: #744601; color: var(--code-literal-number-oct);          }
+/* LiteralString            */ .chroma .s  { color: #664d00; color: var(--code-literal-string);              }
+/* LiteralStringAffix       */ .chroma .sa { color: #664d00; color: var(--code-literal-string-affix);        }
+/* LiteralStringBacktick    */ .chroma .sb { color: #664d00; color: var(--code-literal-string-backtick);     }
+/* LiteralStringChar        */ .chroma .sc { color: #664d00; color: var(--code-literal-string-char);         }
+/* LiteralStringDelimiter   */ .chroma .dl { color: #664d00; color: var(--code-literal-string-delimiter);    }
+/* LiteralStringDoc         */ .chroma .sd { color: #4f4f59; color: var(--code-literal-string-doc);          }
+/* LiteralStringDouble      */ .chroma .s2 { color: #664d00; color: var(--code-literal-string-double);       }
+/* LiteralStringEscape      */ .chroma .se { color: #664d00; color: var(--code-literal-string-escape);       }
+/* LiteralStringHeredoc     */ .chroma .sh { color: #664d00; color: var(--code-literal-string-heredoc);      }
+/* LiteralStringInterpol    */ .chroma .si { color: #664d00; color: var(--code-literal-string-interpol);     }
+/* LiteralStringOther       */ .chroma .sx { color: #664d00; color: var(--code-literal-string-other);        }
+/* LiteralStringRegex       */ .chroma .sr { color: #942e51; color: var(--code-literal-string-regex);        }
+/* LiteralStringSingle      */ .chroma .s1 { color: #664d00; color: var(--code-literal-string-single);       }
+/* LiteralStringSymbol      */ .chroma .ss { color: #664d00; color: var(--code-literal-string-symbol);       }
+
+:root {
+  --code-name:           #6d2caa;
+  --code-name-attribute: #6d2caa;
+  --code-name-builtin:   #222222;
+  --code-name-class:     var(--code-name);
+  --code-name-constant:  var(--code-name);
+  --code-name-decorator: var(--code-name);
+  --code-name-exception: var(--code-name);
+  --code-name-function:  var(--code-name);
+  --code-name-other:     var(--code-name);
+  --code-name-tag:       var(--code-name);
+  --code-name-variable:  #005194;
+}
+
+/* Name          */ .chroma .n  { color: #6d2caa; color: var(--code-name);           }
+/* NameAttribute */ .chroma .na { color: #6d2caa; color: var(--code-name-attribute); }
+/* NameBuiltin   */ .chroma .nb { color: #222222; color: var(--code-name-builtin);   }
+/* NameClass     */ .chroma .nc { color: #6d2caa; color: var(--code-name-class);     }
+/* NameConstant  */ .chroma .no { color: #6d2caa; color: var(--code-name-constant);  }
+/* NameDecorator */ .chroma .nd { color: #6d2caa; color: var(--code-name-decorator); }
+/* NameException */ .chroma .ne { color: #6d2caa; color: var(--code-name-exception); }
+/* NameFunction  */ .chroma .nf { color: #6d2caa; color: var(--code-name-function);  }
+/* NameOther     */ .chroma .nx { color: #6d2caa; color: var(--code-name-other);     }
+/* NameTag       */ .chroma .nt { color: #6d2caa; color: var(--code-name-tag);       }
+/* NameVariable  */ .chroma .nv { color: #005194; color: var(--code-name-variable);  }
+
+:root {
+  --code-operator:      #4f4f59;
+  --code-operator-word: var(--code-operator);
+}
+
+/* Operator     */ .chroma .o  { color: #4f4f59; color: var(--code-operator);      }
+/* OperatorWord */ .chroma .ow { color: #4f4f59; color: var(--code-operator-word); }
+
+:root {
+  --code-punctuation: #4f4f4f;
+}
+
+/* Punctuation */ .chroma .p { color: #4f4f4f; color: var(--code-punctuation); }
diff --git a/assets/js/index.js b/assets/js/index.js
new file mode 100644
index 0000000..62615e5
--- /dev/null
+++ b/assets/js/index.js
@@ -0,0 +1,426 @@
+// deno-fmt-ignore-file
+// deno-lint-ignore-file
+// This code was bundled using `deno bundle` and it's not recommended to edit it manually
+
+(function() {
+    const url = self.location.href.split("#")[0];
+    let settings = {
+        pager: {}
+    };
+    self.addEventListener("DOMContentLoaded", function() {
+        if (history.scrollRestoration) history.scrollRestoration = "manual";
+        if (localStorage["settings"]) {
+            settings = JSON.parse(localStorage["settings"]);
+        }
+        if (self.location.href.indexOf("#") >= 0) {
+            settings["pager"][url] = self.pageYOffset;
+            localStorage["settings"] = JSON.stringify(settings);
+            document.getElementById(location.hash.slice(1)).scrollIntoView();
+            return;
+        }
+        if (settings["pager"][url] > 0) {
+            self.scrollTo(0, settings["pager"][url]);
+            return;
+        }
+        settings["pager"][url] = self.pageYOffset;
+        localStorage["settings"] = JSON.stringify(settings);
+    });
+    self.addEventListener("scroll", function() {
+        const currentPosition = self.pageYOffset;
+        settings["pager"][url] = currentPosition;
+        localStorage["settings"] = JSON.stringify(settings);
+    });
+    self.addEventListener("DOMContentLoaded", function() {
+        const up = document.getElementById("top");
+        const back = document.getElementById("back");
+        self.addEventListener("click", function(event) {
+            if (document.body.contains(up) && up.contains(event.target)) {
+                event.preventDefault();
+                window.scrollTo(0, 0);
+            }
+            if (document.body.contains(back) && back.contains(event.target)) {
+                event.preventDefault();
+                history.go(-1);
+            }
+        });
+    });
+})();
+(function() {
+    const options = "targetWindow,width=700,height=500,toolbar=no,location=no,status=no,menubar=no,scrollbars=yes,resizable=yes";
+    self.addEventListener("keydown", function(event) {
+        if (event.repeat && event.key === "d") {
+            selection(dictionary);
+        }
+        if (event.repeat && event.key === "s") {
+            selection(search);
+        }
+        if (event.repeat && event.key === "m") {
+            selection(manual);
+        }
+    });
+    function selection(execute) {
+        let phrase = "" + window.getSelection();
+        phrase = phrase.replace(/[!.:?,;"]/g, "");
+        phrase = phrase.replace(/^\s*(\S*?)\s*$/g, "$1");
+        if (phrase && phrase > "" && phrase.length > 1) {
+            execute(phrase);
+        }
+    }
+    function dictionary(word) {
+        window.open("https://www.merriam-webster.com/dictionary/" + encodeURIComponent(word), "Definitions", options);
+    }
+    function search(phrase) {
+        window.open("https://lite.duckduckgo.com/lite/?q=" + encodeURIComponent(phrase), "Search", options);
+    }
+    function manual(program) {
+        window.open("https://man.archlinux.org/search?q=" + encodeURIComponent(program), "Manual", options);
+    }
+})();
+(function() {
+    self.addEventListener("DOMContentLoaded", function() {
+        let mouseoverTimer;
+        let lastTouchTimestamp;
+        const prefetches = new Set();
+        const prefetchElement = document.createElement("link");
+        const isSupported = prefetchElement.relList && prefetchElement.relList.supports && prefetchElement.relList.supports("prefetch") && window.IntersectionObserver && "isIntersecting" in IntersectionObserverEntry.prototype;
+        const allowQueryString = "instantAllowQueryString" in document.body.dataset;
+        const allowExternalLinks = "instantAllowExternalLinks" in document.body.dataset;
+        const useWhitelist = "instantWhitelist" in document.body.dataset;
+        const mousedownShortcut = "instantMousedownShortcut" in document.body.dataset;
+        let delayOnHover = 65;
+        let useMousedown = false;
+        let useMousedownOnly = false;
+        let useViewport = false;
+        if ("instantIntensity" in document.body.dataset) {
+            const intensity = document.body.dataset.instantIntensity;
+            if (intensity.substr(0, "mousedown".length) == "mousedown") {
+                useMousedown = true;
+                if (intensity == "mousedown-only") {
+                    useMousedownOnly = true;
+                }
+            } else if (intensity.substr(0, "viewport".length) == "viewport") {
+                if (!(navigator.connection && (navigator.connection.saveData || navigator.connection.effectiveType && navigator.connection.effectiveType.includes("2g")))) {
+                    if (intensity == "viewport") {
+                        if (document.documentElement.clientWidth * document.documentElement.clientHeight < 450000) {
+                            useViewport = true;
+                        }
+                    } else if (intensity == "viewport-all") {
+                        useViewport = true;
+                    }
+                }
+            } else {
+                const milliseconds = parseInt(intensity);
+                if (!isNaN(milliseconds)) {
+                    delayOnHover = milliseconds;
+                }
+            }
+        }
+        if (isSupported) {
+            const eventListenersOptions = {
+                capture: true,
+                passive: true
+            };
+            if (!useMousedownOnly) {
+                document.addEventListener("touchstart", touchstartListener, eventListenersOptions);
+            }
+            if (!useMousedown) {
+                document.addEventListener("mouseover", mouseoverListener, eventListenersOptions);
+            } else if (!mousedownShortcut) {
+                document.addEventListener("mousedown", mousedownListener, eventListenersOptions);
+            }
+            if (mousedownShortcut) {
+                document.addEventListener("mousedown", mousedownShortcutListener, eventListenersOptions);
+            }
+            if (useViewport) {
+                let triggeringFunction;
+                if (window.requestIdleCallback) {
+                    triggeringFunction = function(callback) {
+                        requestIdleCallback(callback, {
+                            timeout: 1500
+                        });
+                    };
+                } else {
+                    triggeringFunction = function(callback) {
+                        callback();
+                    };
+                }
+                triggeringFunction(function() {
+                    const intersectionObserver = new IntersectionObserver(function(entries) {
+                        entries.forEach(function(entry) {
+                            if (entry.isIntersecting) {
+                                const linkElement = entry.target;
+                                intersectionObserver.unobserve(linkElement);
+                                preload(linkElement.href);
+                            }
+                        });
+                    });
+                    document.querySelectorAll("a").forEach(function(linkElement) {
+                        if (isPreloadable(linkElement)) {
+                            intersectionObserver.observe(linkElement);
+                        }
+                    });
+                });
+            }
+        }
+        function touchstartListener(event) {
+            lastTouchTimestamp = performance.now();
+            const linkElement = event.target.closest("a");
+            if (!isPreloadable(linkElement)) {
+                return;
+            }
+            preload(linkElement.href);
+        }
+        function mouseoverListener(event) {
+            if (performance.now() - lastTouchTimestamp < 1111) {
+                return;
+            }
+            const linkElement = event.target.closest("a");
+            if (!isPreloadable(linkElement)) {
+                return;
+            }
+            linkElement.addEventListener("mouseout", mouseoutListener, {
+                passive: true
+            });
+            mouseoverTimer = setTimeout(function() {
+                preload(linkElement.href);
+                mouseoverTimer = undefined;
+            }, delayOnHover);
+        }
+        function mousedownListener(event) {
+            const linkElement = event.target.closest("a");
+            if (!isPreloadable(linkElement)) {
+                return;
+            }
+            preload(linkElement.href);
+        }
+        function mouseoutListener(event) {
+            if (event.relatedTarget && event.target.closest("a") == event.relatedTarget.closest("a")) {
+                return;
+            }
+            if (mouseoverTimer) {
+                clearTimeout(mouseoverTimer);
+                mouseoverTimer = undefined;
+            }
+        }
+        function mousedownShortcutListener(event1) {
+            if (performance.now() - lastTouchTimestamp < 1111) {
+                return;
+            }
+            const linkElement = event1.target.closest("a");
+            if (event1.which > 1 || event1.metaKey || event1.ctrlKey) {
+                return;
+            }
+            if (!linkElement) {
+                return;
+            }
+            linkElement.addEventListener("click", function(event) {
+                if (event.detail == 1337) {
+                    return;
+                }
+                event.preventDefault();
+            }, {
+                capture: true,
+                passive: false,
+                once: true
+            });
+            const customEvent = new MouseEvent("click", {
+                view: window,
+                bubbles: true,
+                cancelable: false,
+                detail: 1337
+            });
+            linkElement.dispatchEvent(customEvent);
+        }
+        function isPreloadable(linkElement) {
+            if (!linkElement || !linkElement.href) {
+                return;
+            }
+            if (useWhitelist && !("instant" in linkElement.dataset)) {
+                return;
+            }
+            if (!allowExternalLinks && linkElement.origin != location.origin && !("instant" in linkElement.dataset)) {
+                return;
+            }
+            if (![
+                "http:",
+                "https:"
+            ].includes(linkElement.protocol)) {
+                return;
+            }
+            if (linkElement.protocol == "http:" && location.protocol == "https:") {
+                return;
+            }
+            if (!allowQueryString && linkElement.search && !("instant" in linkElement.dataset)) {
+                return;
+            }
+            if (linkElement.hash && linkElement.pathname + linkElement.search == location.pathname + location.search) {
+                return;
+            }
+            if ("noInstant" in linkElement.dataset) {
+                return;
+            }
+            return true;
+        }
+        function preload(url) {
+            if (prefetches.has(url)) {
+                return;
+            }
+            const prefetcher = document.createElement("link");
+            prefetcher.rel = "prefetch";
+            prefetcher.href = url;
+            document.head.appendChild(prefetcher);
+            prefetches.add(url);
+        }
+    });
+})();
+(function() {
+    self.addEventListener("DOMContentLoaded", function() {
+        const form = document.getElementById("search-form");
+        const query = document.getElementById("search-input");
+        document.getElementById("search-submit");
+        const dropdown = document.getElementById("search-results");
+        const container = document.getElementById("search-frame");
+        form.addEventListener("focusin", function() {
+            initialize();
+        });
+        form.addEventListener("submit", function(event) {
+            event.preventDefault();
+            return false;
+        });
+        form.addEventListener("keydown", function(event) {
+            const head = dropdown.firstChild.nextElementSibling.firstChild.nextElementSibling;
+            const tail = dropdown.lastElementChild.firstChild.nextElementSibling;
+            if (query.contains(event.target)) {
+                if (event.keyCode == 27) {
+                    document.activeElement.blur();
+                    dropdown.setAttribute("hidden", "");
+                }
+            }
+            if (event.keyCode == 40) {
+                event.preventDefault();
+                if (document.activeElement == query) head.focus();
+                else if (document.activeElement == tail) query.focus();
+                else {
+                    document.activeElement.parentElement.nextElementSibling.firstChild.nextElementSibling.focus();
+                }
+            }
+            if (event.keyCode == 38) {
+                event.preventDefault();
+                if (document.activeElement == query) tail.focus();
+                else if (document.activeElement == head) query.focus();
+                else {
+                    document.activeElement.parentElement.previousElementSibling.firstChild.nextElementSibling.focus();
+                }
+            }
+            if (event.keyCode == 8) {
+                if (document.activeElement != query) {
+                    event.preventDefault();
+                    query.focus();
+                }
+            }
+            if (event.keyCode == 13) {
+                if (dropdown && document.activeElement == query) {
+                    event.preventDefault();
+                    head.focus();
+                    self.window.location = document.activeElement.href;
+                }
+            }
+        });
+        let scrolls = 0;
+        self.addEventListener("scroll", function() {
+            if (scrolls > 3) {
+                scrolls = 0;
+                document.activeElement.blur();
+                dropdown.setAttribute("hidden", "");
+                container.removeAttribute("data-focus");
+            }
+            scrolls++;
+        });
+        document.addEventListener("click", function(event) {
+            if (!form.contains(event.target)) {
+                dropdown.setAttribute("hidden", "");
+                container.removeAttribute("data-focus");
+            }
+        });
+        function fetch_JSON(path, callback) {
+            const httpRequest = new XMLHttpRequest();
+            httpRequest.onreadystatechange = function() {
+                if (httpRequest.readyState === 4) {
+                    if (httpRequest.status === 200) {
+                        const data = JSON.parse(httpRequest.responseText);
+                        if (callback) callback(data);
+                    }
+                }
+            };
+            httpRequest.open("GET", path);
+            httpRequest.send();
+        }
+        function load_script(url) {
+            return new Promise(function(resolve, reject) {
+                const script = document.createElement("script");
+                script.onerror = reject;
+                script.onload = resolve;
+                if (document.currentScript) {
+                    document.currentScript.parentNode.insertBefore(script, document.currentScript);
+                } else {
+                    document.head.appendChild(script);
+                }
+                script.src = url;
+            });
+        }
+        let first_run = true;
+        function initialize() {
+            if (first_run) {
+                load_script(window.location.origin + "/js/fuzzysort.js").then(()=>{
+                    first_run = false;
+                    fetch_JSON("/index.json", function(data) {
+                        const options = {
+                            key: [
+                                "title"
+                            ]
+                        };
+                        query.addEventListener("keyup", function() {
+                            search(query.value, data.items, options);
+                        });
+                        query.addEventListener("focusin", function() {
+                            search(query.value, data.items, options);
+                        });
+                        search(query.value, data.items, options);
+                    });
+                }).catch((error)=>{
+                    console.log("Error failed to load fuzzy sort: " + error);
+                });
+            }
+        }
+        function search(term, data, options) {
+            const results = fuzzysort.go(term, data, options);
+            let items = "";
+            if (results.length === 0 && term.length >= 0) {
+                let separator = "—";
+                if (term.length === 0) separator = "";
+                items = `
+            <li>
+              <a href="javascript: void(0)" tabindex="0">${term} ${separator} No Results Found</a>
+            </li>
+              `;
+                dropdown.removeAttribute("hidden");
+                container.setAttribute("data-focus", "");
+            } else {
+                dropdown.removeAttribute("hidden");
+                for(const string in results.slice(0, 10)){
+                    let highlight = fuzzysort.highlight(fuzzysort.single(term, results[string].obj.title), "<span>", "</span>");
+                    if (highlight === null) {
+                        highlight = results[string].obj.title;
+                    }
+                    items = items + `
+            <li>
+              <a href="${results[string].obj.url}" tabindex="0">${highlight}</a>
+            </li>
+              `;
+                }
+            }
+            dropdown.innerHTML = items;
+        }
+    });
+})();
+console.log("Surface Control: OK");