commit 74a5b5bbb7b472ef0501a0a1052d5e631af31562
Author: Stefan Mühlinghaus <jazzman@alphabreed.com>
Date:   Thu Feb 19 18:37:05 2026 +0100

    Erstes Commit

diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..3f4d981
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,2 @@
+backup
+hugo/public
diff --git a/Dockerfile b/Dockerfile
new file mode 100644
index 0000000..8e4f328
--- /dev/null
+++ b/Dockerfile
@@ -0,0 +1,9 @@
+FROM floryn90/hugo:0.155.1-alpine AS builder
+WORKDIR /src
+USER root
+COPY hugo /src
+RUN hugo --minify
+
+FROM nginx:1.28.0-alpine-slim
+COPY --from=builder /src/public /usr/share/nginx/html
+HEALTHCHECK --interval=1m --timeout=10s --start-period=10s CMD wget -q -O /dev/null http://localhost/ || exit 1
\ No newline at end of file
diff --git a/README.md b/README.md
new file mode 100644
index 0000000..f2bc5c0
--- /dev/null
+++ b/README.md
@@ -0,0 +1 @@
+# alphabreed website
diff --git a/dev-files/favicons.xcf b/dev-files/favicons.xcf
new file mode 100644
index 0000000..20c9ae0
Binary files /dev/null and b/dev-files/favicons.xcf differ
diff --git a/docker-compose.yml b/docker-compose.yml
new file mode 100644
index 0000000..925be6b
--- /dev/null
+++ b/docker-compose.yml
@@ -0,0 +1,50 @@
+services:
+
+  website:
+    build: .
+    image: alphabreed:v1.0.2
+    restart: unless-stopped
+    networks:
+      - frontend
+
+  pocketbase:
+    image: adrianmusante/pocketbase:0.35
+    restart: unless-stopped
+    environment:
+      - POCKETBASE_DEBUG=false
+      - POCKETBASE_ADMIN_EMAIL=${EMAIL}
+      - POCKETBASE_ADMIN_PASSWORD=${PASSWORD}
+    volumes:
+      - pocketbase_data:/pocketbase
+    networks:
+      - frontend
+
+  gokapi:
+    image: f0rc3/gokapi:v2.1.0
+    restart: unless-stopped
+    environment:
+      - TZ=Europe/Berlin
+    volumes:
+      - gokapi_data:/app/data
+      - gokapi_config:/app/config
+    networks:
+      - frontend
+
+  ddns_updater:
+    image: cloubit/ddns-updater:v1.1
+    environment:
+      - APIURL_BASE=https://ydns.io/api/v1/update/?host=
+      - DDOMAIN1=alphabreed.ydns.eu
+      - ENABLE_IPV4=true
+      - UPDATE_DELAY=1800
+    restart: unless-stopped
+
+volumes:
+  pocketbase_data:
+  gokapi_data:
+  gokapi_config:
+
+networks:
+  frontend:
+    name: frontend
+    external: true
diff --git a/hugo/.hugo_build.lock b/hugo/.hugo_build.lock
new file mode 100644
index 0000000..e69de29
diff --git a/hugo/archetypes/default.md b/hugo/archetypes/default.md
new file mode 100644
index 0000000..00e77bd
--- /dev/null
+++ b/hugo/archetypes/default.md
@@ -0,0 +1,6 @@
+---
+title: "{{ replace .Name "-" " " | title }}"
+date: {{ .Date }}
+draft: true
+---
+
diff --git a/hugo/config.toml b/hugo/config.toml
new file mode 100644
index 0000000..bbdae7b
--- /dev/null
+++ b/hugo/config.toml
@@ -0,0 +1,40 @@
+baseURL = "https://www.alphabreed.com/"
+languageCode = "de-de"
+title = "alphabreed"
+disableKinds = ["taxonomy"]
+[params]
+	apibaseurl = "http://192.168.1.2/api"
+[outputs]
+	page = ["HTML"]
+	home = ["HTML"]
+	section = ["HTML"]
+[markup]
+	[markup.goldmark]
+		[markup.goldmark.renderer]
+			unsafe = true
+[menus]
+	[[menus.main]]
+		name = "Raspberry Pi"
+		pageRef = "/pi/"
+		weight = 10
+	[[menus.main]]
+		name = "Gameplays"
+		pageRef = "/gameplays/"
+		weight = 20
+	[[menus.main]]
+		name = "Interactive Fiction"
+		pageRef = "/if/"
+		weight = 30
+	[[menus.main]]
+		name = "Comics"
+		pageRef = "/comics/"
+		weight = 40
+	[[menus.main]]
+		name = "Bilder"
+		pageRef = "/bilder/"
+		weight = 50
+	[[menus.main]]
+		name = "Impressum"
+		pageRef = "/impressum/"
+		weight = 60
+
diff --git a/hugo/content/_index.md b/hugo/content/_index.md
new file mode 100644
index 0000000..0d85c50
--- /dev/null
+++ b/hugo/content/_index.md
@@ -0,0 +1,11 @@
+---
+title: "Über alphabreed"
+description: "Eine private Seite über Interactive Fiction, Comics, Bilder und Kurzgeschichten."
+---
+# über alphabreed
+
+_alphabreed_ ist meine kleine Website zu verschiedenen Themen, die mich gerade interessieren. Die Inhalte ändern sich nicht sehr häufig, können sich dafür aber auch ser radikal ändern. Die aktuellen Themenbereiche finden sich im Menü.
+
+Die Seite wird nun lokal auf meinem [Raspberry Pi](/pi/) gehostet. Dadurch kann beim Hosting nicht nur Energie gespart werden, sondern ich habe auch viel besseren Zugriff auf Server und Software.
+
+Da der Übertragungsweg nun meine eigene Internetverbindung nutzt kann es zu gelegentlichen Ausfällen kommen, die aber auch relativ schnell wieder behoben sein sollten.
diff --git a/hugo/content/bilder/eragon-and-arya.jpg b/hugo/content/bilder/eragon-and-arya.jpg
new file mode 100644
index 0000000..1daa865
Binary files /dev/null and b/hugo/content/bilder/eragon-and-arya.jpg differ
diff --git a/hugo/content/bilder/happy-easter.jpg b/hugo/content/bilder/happy-easter.jpg
new file mode 100644
index 0000000..7bc2f9a
Binary files /dev/null and b/hugo/content/bilder/happy-easter.jpg differ
diff --git a/hugo/content/bilder/index.html b/hugo/content/bilder/index.html
new file mode 100644
index 0000000..a37cbef
--- /dev/null
+++ b/hugo/content/bilder/index.html
@@ -0,0 +1,12 @@
+---
+title: "Bilder"
+description: "Meine Bilder, jetzt auf DeviantArt"
+---
+<h1 id="bilder">Bilder</h1>
+<p>Ich habe mich dazu entschlossen, meine Bilder in Zukunft nur noch auf <em>DeviantArt</em> einzustellen, damit ich sie nicht doppelt pflegen muss. Ihr könnt sie in meiner <a href="https://masterjazzman.deviantart.com/" target="_blank">DeviantArt Galerie</a> betrachten.</p>
+<p style="margin-top:100px"><a href="https://masterjazzman.deviantart.com/" target="_blank" style="font-size:0">
+	<img src="eragon-and-arya.jpg" style="width:30%; height:auto; transform:rotate(-10deg);" />
+	<img src="oh-please-do-stay-for-dinner.jpg" style="width:30%; height:auto; transform:rotate(10deg); margin-left:-5%;" />
+	<img src="shall-i-compare-thee.jpg" style="width:25%; height:auto; transform:rotate(-7deg); margin-left:-5%;" />
+	<img src="happy-easter.jpg" style="width:30%; height:auto; transform:rotate(10deg); margin-left:-5%;" />
+</a></p>
\ No newline at end of file
diff --git a/hugo/content/bilder/oh-please-do-stay-for-dinner.jpg b/hugo/content/bilder/oh-please-do-stay-for-dinner.jpg
new file mode 100644
index 0000000..5169236
Binary files /dev/null and b/hugo/content/bilder/oh-please-do-stay-for-dinner.jpg differ
diff --git a/hugo/content/bilder/shall-i-compare-thee.jpg b/hugo/content/bilder/shall-i-compare-thee.jpg
new file mode 100644
index 0000000..75d0e32
Binary files /dev/null and b/hugo/content/bilder/shall-i-compare-thee.jpg differ
diff --git a/hugo/content/bookmarks/_index.html b/hugo/content/bookmarks/_index.html
new file mode 100644
index 0000000..8475d47
--- /dev/null
+++ b/hugo/content/bookmarks/_index.html
@@ -0,0 +1,176 @@
+---
+title: "Bookmarks"
+---
+<main x-data="{
+	store: null,
+	categories: [],
+	openCategoryId: '',
+	slideInOpen: false,
+	showFavletCode: false,
+	editCategory: null,
+	editBookmark: null,
+	host: '',
+	async updateBookmarks() {
+		const result = await this.store.getBookmarks();
+		const grouped = Object.groupBy(result, (bookmark) => bookmark.expand.category.id);
+		this.categories = Object.values(grouped).map((group) => {
+		  const category = group[0].expand.category;
+		  return {
+		    id: category.id,
+		    name: category.name,
+		    bookmarks: group.map((bookmark) => ({
+		      category: category.id,
+		      id: bookmark.id,
+		      name: bookmark.name,
+		      url: bookmark.url
+		    }))
+		  };
+		});
+		this.categories.sort((a, b) => a.name.localeCompare(b.name));
+	},
+	openCategory(id, element) {
+		if (this.openCategoryId == id) {
+			this.openCategoryId = '';
+			return;
+		}
+		this.openCategoryId = id;
+		element.scrollIntoView(true);
+	},
+	async saveCategory() {
+		if (!this.editCategory || !this.editCategory.name)
+			return;
+		await this.store.updateBookmarkCategory(
+			this.editCategory.id, this.editCategory.name
+		);
+		this.slideInOpen = false;
+		await this.updateBookmarks();
+	},
+	async deleteCategory() {
+		if (!this.editCategory)
+			return;
+		await this.store.deleteBookmarkCategory(this.editCategory.id);
+		this.slideInOpen = false;
+		await this.updateBookmarks();
+	},
+	async saveBookmark() {
+		let categoryId = this.editBookmark.category || this.categories[0].id;
+		if (!this.editBookmark || !this.editBookmark.name || !this.editBookmark.url || (!categoryId && !this.editBookmark.newcategory))
+			return;
+		if (this.editBookmark.newcategory)
+			categoryId = await this.store.createBookmarkCategory(this.editBookmark.newcategory);
+		if (this.editBookmark.id) {
+			await this.store.updateBookmark(
+				this.editBookmark.id,
+				categoryId,
+				this.editBookmark.name,
+				this.editBookmark.url
+			);
+		}
+		else {
+			await this.store.createBookmark(
+				categoryId,
+				this.editBookmark.name,
+				this.editBookmark.url
+			);
+		}
+		this.slideInOpen = false;
+		this.openCategoryId = categoryId;
+		await this.updateBookmarks();
+	},
+	async deleteBookmark() {
+		if (!this.editBookmark)
+			return;
+		await this.store.deleteBookmark(this.editBookmark.id);
+		this.slideInOpen = false;
+		await this.updateBookmarks();
+	},
+	async init() {
+		this.store = Alpine.store('alphabreed');
+		this.store.backUrl = '/bookmarks/';
+		this.host = window.location.protocol + '//' + window.location.host;
+		const tokenOK = await this.store.checkToken();
+		if (tokenOK)
+			this.updateBookmarks();
+	}
+}">
+	<p><button @click="editBookmark = {}; editCategory = null; showFavletCode = false; slideInOpen = true;">+ Bookmark</button></p>
+	<span id="favlet" @click="showFavletCode = true; editCategory = null; editBookmark = null; slideInOpen = true;">Generate Favlet code</span>
+	<div class="categories">
+		<template x-for="category in categories" :key="category.id">
+			<div class="category" :class="{'open': category.id == openCategoryId}">
+				<h1>
+					<span class="title" x-text="category.name" @click="openCategory(category.id, $el)"></span>
+					<span class="badge" x-text="category.bookmarks.length"></span>
+					<span class="edit" @click="editCategory = Object.assign({}, category); editBookmark = null; showFavletCode = false; slideInOpen = true;">✎</span>
+				</h1>
+				<ul class="bookmarks">
+					<template x-for="bookmark in category.bookmarks" :key="bookmark.id">
+						<li class="bookmark">
+							<div class="editicon" @click="editBookmark = Object.assign({}, bookmark); editCategory = null; showFavletCode = false; slideInOpen = true;">
+								<img :src="'https://www.google.com/s2/favicons?domain=' + encodeURIComponent(bookmark.url)">
+							</div>
+							<a class="link" :href="bookmark.url" target="_blank">
+								<span x-text="bookmark.name"></span>
+							</a>
+						</li>
+					</template>
+				</ul>
+			</div>
+		</template>
+	</div>
+	<div id="slidein" :class="{'open': slideInOpen}">
+		<span class="closer" @click="slideInOpen = false;"></span>
+		<div class="inner">
+			<template x-if="showFavletCode">
+				<div>
+					<p>Favlet code:</p>
+					<p class="favletcode" x-text='"javascript:(function(w,e){w.open(\""+host+"/bookmarks/add/?name=\"+e(document.title)+\"&url=\"+e(w.location.href),\"_blank\",\"height=500,width=500,location=0,menubar=0,scrollbars=0,status=0,titlebar=0,toolbar=0\")})(window,encodeURIComponent)"'></p>
+				</div>
+			</template>
+			<template x-if="editCategory">
+				<div>
+					<div class="field textfield">
+						<label for="categoryname">Category name</label>
+						<input id="categoryname" type="text" x-model="editCategory.name">
+					</div>
+					<div class="field buttons">
+						<button @click="saveCategory()">Save</button>
+					</div>
+					<div class="field buttons">
+						<button @click="deleteCategory()">Delete</button>
+					</div>
+				</div>
+			</template>
+			<template x-if="editBookmark">
+				<div>
+					<div class="field textfield">
+						<label for="bookmarkname">Bookmark name</label>
+						<input id="bookmarkname" type="text" x-model="editBookmark.name">
+					</div>
+					<div class="field textfield">
+						<label for="bookmarkurl">URL</label>
+						<input id="bookmarkurl" type="text" x-model="editBookmark.url">
+					</div>
+					<div class="field selectfield">
+						<label for="bookmarkcategory">Category</label>
+						<select id="bookmarkcategory" x-model="editBookmark.category">
+							<template x-for="category in categories" :key="category.id">
+								<option :value="category.id" x-text="category.name" :selected="category.id == editBookmark.category">
+							</template>
+						</select>
+					</div>
+					<div class="field textfield">
+						<label for="bookmarknewcategory">New category</label>
+						<input id="bookmarknewcategory" type="text" x-model="editBookmark.newcategory">
+					</div>
+					<div class="field buttons">
+						<button @click="saveBookmark()">Save</button>
+					</div>
+					<div class="field buttons">
+						<button @click="deleteBookmark()">Delete</button>
+					</div>
+				</div>
+			</template>
+		</div>
+	</div>
+</main>
\ No newline at end of file
diff --git a/hugo/content/bookmarks/add.html b/hugo/content/bookmarks/add.html
new file mode 100644
index 0000000..2ec1690
--- /dev/null
+++ b/hugo/content/bookmarks/add.html
@@ -0,0 +1,61 @@
+---
+title: "Add Bookmark"
+---
+<main x-data="{
+	store: null,
+	categories: [],
+	name: '',
+	url: '',
+	categoryId: '',
+	newcategory: '',
+	async saveBookmark() {
+		if (!this.categoryId)
+			this.categoryId = this.categories[0].id;
+		if (!this.name || !this.url || (!this.categoryId && !this.newcategory))
+			return;
+		if (this.newcategory)
+			this.categoryId = await this.store.createBookmarkCategory(this.newcategory);
+		const result = await this.store.createBookmark(
+			this.categoryId, this.name, this.url
+		);
+		if (result)
+			window.close();
+	},
+	async init() {
+		this.store = Alpine.store('alphabreed');
+		this.store.backUrl = '/bookmarks/add/';
+		const params = new URLSearchParams(window.location.search);
+		this.name = params.get('name') || '';
+		this.url = params.get('url') || '';
+
+		const tokenOK = await this.store.checkToken();
+		if (tokenOK)
+			this.categories = await this.store.getBookmarkCategories();
+	}
+}">
+	<div id="addcontent">
+		<div class="field textfield">
+			<label for="bookmarkname">Bookmark name</label>
+			<input id="bookmarkname" type="text" x-model="name">
+		</div>
+		<div class="field textfield">
+			<label for="bookmarkurl">URL</label>
+			<input id="bookmarkurl" type="text" x-model="url">
+		</div>
+		<div class="field selectfield">
+			<label for="bookmarkcategory">Category</label>
+			<select id="bookmarkcategory" x-model="categoryId">
+				<template x-for="category in categories" :key="category.id">
+					<option :value="category.id" x-text="category.name" :selected="category.id == categoryId">
+				</template>
+			</select>
+		</div>
+		<div class="field textfield">
+			<label for="bookmarknewcategory">New category</label>
+			<input id="bookmarknewcategory" type="text" x-model="newcategory">
+		</div>
+		<div class="field buttons">
+			<button @click="saveBookmark()">Save</button>
+		</div>
+	</div>
+</main>
diff --git a/hugo/content/comics/_content.gotmpl b/hugo/content/comics/_content.gotmpl
new file mode 100644
index 0000000..9305014
--- /dev/null
+++ b/hugo/content/comics/_content.gotmpl
@@ -0,0 +1,44 @@
+{{ $basePath := "content/comics" }}
+{{ range (os.ReadDir $basePath) }}
+	{{ if .IsDir }}
+		{{ $comicDir := .Name }}
+		{{ $fullPath := printf "%s/%s" $basePath $comicDir }}
+		{{ $indexContent := readFile (printf "%s/_index.md" $fullPath) }}
+		{{ $comicData := transform.Unmarshal $indexContent }}
+		{{ $images := slice }}
+		{{ range (os.ReadDir $fullPath) }}
+			{{ if findRE "\\.(jpg|jpeg|png|webp|gif)$" .Name }}
+				{{ $images = $images | append .Name }}
+			{{ end }}
+		{{ end }}
+		{{ $images = sort $images }}
+		{{ $imageCount := len $images }}
+		{{ range $index, $image := $images }}
+			{{ if gt $index 0 }}
+				{{ $pageNum := math.Add $index 1 }}
+				{{ $nextPage := "" }}
+				{{ $lastPage := "" }}
+				{{ if lt $pageNum $imageCount }}
+					{{ $nextPage = printf "../%d/" (math.Add $pageNum 1) }}
+					{{ $lastPage = printf "../%d/" $imageCount }}
+				{{ end }}
+				{{ $prevPage := "../" }}
+				{{ if gt $pageNum 2 }}
+					{{ $prevPage = printf "../%d/" $index }}
+				{{ end }}
+				{{ $page := dict
+					"path" (printf "%s/%d" $comicDir $pageNum)
+					"title" (printf "%s, Seite %d" $comicData.title $pageNum)
+					"description" $comicData.description
+					"params" (dict
+						"image" $image
+						"next" $nextPage
+						"prev" $prevPage
+						"last" $lastPage
+					)
+				}}
+				{{ $.AddPage $page }}
+			{{ end }}
+		{{ end }}
+	{{ end }}
+{{ end }}
\ No newline at end of file
diff --git a/hugo/content/comics/_index.md b/hugo/content/comics/_index.md
new file mode 100644
index 0000000..7a23707
--- /dev/null
+++ b/hugo/content/comics/_index.md
@@ -0,0 +1,7 @@
+---
+title: "Comics"
+layout: "comiclist"
+---
+# Comics
+
+Hier gibt es meine verschiedenen Comics zu sehen. Einige Seiten haben Bildfehler, die auf einen früheren Festplattencrash zurückzuführen sind. Ich bitte diese kleinen Makel zu verzeihen. Für alle Comics wird Kenntnis der englischen Sprache vorausgesetzt.
\ No newline at end of file
diff --git a/hugo/content/comics/alt/001.gif b/hugo/content/comics/alt/001.gif
new file mode 100644
index 0000000..d394a6f
Binary files /dev/null and b/hugo/content/comics/alt/001.gif differ
diff --git a/hugo/content/comics/alt/002.gif b/hugo/content/comics/alt/002.gif
new file mode 100644
index 0000000..ef9b149
Binary files /dev/null and b/hugo/content/comics/alt/002.gif differ
diff --git a/hugo/content/comics/alt/003.jpg b/hugo/content/comics/alt/003.jpg
new file mode 100644
index 0000000..70b3fcd
Binary files /dev/null and b/hugo/content/comics/alt/003.jpg differ
diff --git a/hugo/content/comics/alt/004.jpg b/hugo/content/comics/alt/004.jpg
new file mode 100644
index 0000000..d8b9d4c
Binary files /dev/null and b/hugo/content/comics/alt/004.jpg differ
diff --git a/hugo/content/comics/alt/005.jpg b/hugo/content/comics/alt/005.jpg
new file mode 100644
index 0000000..6b5a5af
Binary files /dev/null and b/hugo/content/comics/alt/005.jpg differ
diff --git a/hugo/content/comics/alt/006.gif b/hugo/content/comics/alt/006.gif
new file mode 100644
index 0000000..dbc5bee
Binary files /dev/null and b/hugo/content/comics/alt/006.gif differ
diff --git a/hugo/content/comics/alt/009.jpg b/hugo/content/comics/alt/009.jpg
new file mode 100644
index 0000000..c09ffee
Binary files /dev/null and b/hugo/content/comics/alt/009.jpg differ
diff --git a/hugo/content/comics/alt/010.jpg b/hugo/content/comics/alt/010.jpg
new file mode 100644
index 0000000..99e0fc7
Binary files /dev/null and b/hugo/content/comics/alt/010.jpg differ
diff --git a/hugo/content/comics/alt/012.jpg b/hugo/content/comics/alt/012.jpg
new file mode 100644
index 0000000..b9297b6
Binary files /dev/null and b/hugo/content/comics/alt/012.jpg differ
diff --git a/hugo/content/comics/alt/015.gif b/hugo/content/comics/alt/015.gif
new file mode 100644
index 0000000..384a551
Binary files /dev/null and b/hugo/content/comics/alt/015.gif differ
diff --git a/hugo/content/comics/alt/016.jpg b/hugo/content/comics/alt/016.jpg
new file mode 100644
index 0000000..e7a6902
Binary files /dev/null and b/hugo/content/comics/alt/016.jpg differ
diff --git a/hugo/content/comics/alt/017.jpg b/hugo/content/comics/alt/017.jpg
new file mode 100644
index 0000000..3a53c51
Binary files /dev/null and b/hugo/content/comics/alt/017.jpg differ
diff --git a/hugo/content/comics/alt/018.jpg b/hugo/content/comics/alt/018.jpg
new file mode 100644
index 0000000..d87e1ee
Binary files /dev/null and b/hugo/content/comics/alt/018.jpg differ
diff --git a/hugo/content/comics/alt/021.jpg b/hugo/content/comics/alt/021.jpg
new file mode 100644
index 0000000..0f15099
Binary files /dev/null and b/hugo/content/comics/alt/021.jpg differ
diff --git a/hugo/content/comics/alt/022.jpg b/hugo/content/comics/alt/022.jpg
new file mode 100644
index 0000000..dcc10b3
Binary files /dev/null and b/hugo/content/comics/alt/022.jpg differ
diff --git a/hugo/content/comics/alt/023.jpg b/hugo/content/comics/alt/023.jpg
new file mode 100644
index 0000000..ba6cb5d
Binary files /dev/null and b/hugo/content/comics/alt/023.jpg differ
diff --git a/hugo/content/comics/alt/024.jpg b/hugo/content/comics/alt/024.jpg
new file mode 100644
index 0000000..8d1cb13
Binary files /dev/null and b/hugo/content/comics/alt/024.jpg differ
diff --git a/hugo/content/comics/alt/026.jpg b/hugo/content/comics/alt/026.jpg
new file mode 100644
index 0000000..69cf605
Binary files /dev/null and b/hugo/content/comics/alt/026.jpg differ
diff --git a/hugo/content/comics/alt/027.jpg b/hugo/content/comics/alt/027.jpg
new file mode 100644
index 0000000..761ee05
Binary files /dev/null and b/hugo/content/comics/alt/027.jpg differ
diff --git a/hugo/content/comics/alt/028.jpg b/hugo/content/comics/alt/028.jpg
new file mode 100644
index 0000000..8542079
Binary files /dev/null and b/hugo/content/comics/alt/028.jpg differ
diff --git a/hugo/content/comics/alt/029.jpg b/hugo/content/comics/alt/029.jpg
new file mode 100644
index 0000000..3b0e466
Binary files /dev/null and b/hugo/content/comics/alt/029.jpg differ
diff --git a/hugo/content/comics/alt/030.jpg b/hugo/content/comics/alt/030.jpg
new file mode 100644
index 0000000..49acfc1
Binary files /dev/null and b/hugo/content/comics/alt/030.jpg differ
diff --git a/hugo/content/comics/alt/_index.md b/hugo/content/comics/alt/_index.md
new file mode 100644
index 0000000..4dd60db
--- /dev/null
+++ b/hugo/content/comics/alt/_index.md
@@ -0,0 +1,4 @@
+---
+title: "Alte Comics"
+description: "Meine ersten Veruche, Comics zu zeichnen. Zu schade, um sie einfach verschwinden zu lassen."
+---
diff --git a/hugo/content/comics/jupiter/001.jpg b/hugo/content/comics/jupiter/001.jpg
new file mode 100644
index 0000000..258c220
Binary files /dev/null and b/hugo/content/comics/jupiter/001.jpg differ
diff --git a/hugo/content/comics/jupiter/002.jpg b/hugo/content/comics/jupiter/002.jpg
new file mode 100644
index 0000000..35b66fc
Binary files /dev/null and b/hugo/content/comics/jupiter/002.jpg differ
diff --git a/hugo/content/comics/jupiter/003.jpg b/hugo/content/comics/jupiter/003.jpg
new file mode 100644
index 0000000..8696cf1
Binary files /dev/null and b/hugo/content/comics/jupiter/003.jpg differ
diff --git a/hugo/content/comics/jupiter/004.jpg b/hugo/content/comics/jupiter/004.jpg
new file mode 100644
index 0000000..111f851
Binary files /dev/null and b/hugo/content/comics/jupiter/004.jpg differ
diff --git a/hugo/content/comics/jupiter/005.jpg b/hugo/content/comics/jupiter/005.jpg
new file mode 100644
index 0000000..362e3df
Binary files /dev/null and b/hugo/content/comics/jupiter/005.jpg differ
diff --git a/hugo/content/comics/jupiter/006.jpg b/hugo/content/comics/jupiter/006.jpg
new file mode 100644
index 0000000..6df5900
Binary files /dev/null and b/hugo/content/comics/jupiter/006.jpg differ
diff --git a/hugo/content/comics/jupiter/007.jpg b/hugo/content/comics/jupiter/007.jpg
new file mode 100644
index 0000000..1c3a6b4
Binary files /dev/null and b/hugo/content/comics/jupiter/007.jpg differ
diff --git a/hugo/content/comics/jupiter/008.jpg b/hugo/content/comics/jupiter/008.jpg
new file mode 100644
index 0000000..91ece66
Binary files /dev/null and b/hugo/content/comics/jupiter/008.jpg differ
diff --git a/hugo/content/comics/jupiter/009.jpg b/hugo/content/comics/jupiter/009.jpg
new file mode 100644
index 0000000..d9f4c6d
Binary files /dev/null and b/hugo/content/comics/jupiter/009.jpg differ
diff --git a/hugo/content/comics/jupiter/010.jpg b/hugo/content/comics/jupiter/010.jpg
new file mode 100644
index 0000000..92a140f
Binary files /dev/null and b/hugo/content/comics/jupiter/010.jpg differ
diff --git a/hugo/content/comics/jupiter/011.jpg b/hugo/content/comics/jupiter/011.jpg
new file mode 100644
index 0000000..ea7be94
Binary files /dev/null and b/hugo/content/comics/jupiter/011.jpg differ
diff --git a/hugo/content/comics/jupiter/_index.md b/hugo/content/comics/jupiter/_index.md
new file mode 100644
index 0000000..1a082d6
--- /dev/null
+++ b/hugo/content/comics/jupiter/_index.md
@@ -0,0 +1,4 @@
+---
+title: "Shadow of Jupiter"
+description: "Eine kleine postapokalyptische Kurzgeschichte über Liebe, Vertrauen, Verlust und die Hoffung auf eine bessere Zukunft."
+---
diff --git a/hugo/content/gameplays/_content.gotmpl b/hugo/content/gameplays/_content.gotmpl
new file mode 100644
index 0000000..4cda783
--- /dev/null
+++ b/hugo/content/gameplays/_content.gotmpl
@@ -0,0 +1,40 @@
+{{ $basePath := "content/gameplays" }}
+{{ $site := .Site }}
+{{ range (os.ReadDir $basePath) }}
+	{{ if .IsDir }}
+		{{ $gameplayDir := .Name }}
+		{{ $fullPath := printf "%s/%s" $basePath $gameplayDir }}
+		{{ $indexContent := readFile (printf "%s/_index.md" $fullPath) }}
+		{{ $indexParts := split $indexContent "---" }}
+		{{ $gameplayData := index $indexParts 1 | transform.Unmarshal }}
+		{{ $gameplayBody := index $indexParts 2 }}
+		{{ $episodeCount := len $gameplayData.episodes }}
+		{{ range $index, $episode := $gameplayData.episodes }}
+			{{ if gt $index 0 }}
+				{{ $pageNum := math.Add $index 1 }}
+				{{ $content := dict
+					"mediaType" "text/markdown"
+					"value" $gameplayBody
+				}}
+				{{ $episodeName := "" }}
+				{{ if $episode.title }}
+					{{ $episodeName = $episode.title }}
+				{{ end }}
+				{{ $page := dict
+					"path" (printf "%s/%d" $gameplayDir $pageNum)
+					"title" (printf "%s, Folge %d" $gameplayData.title $pageNum)
+					"description" $episode.description
+					"content" $content
+					"params" (dict
+						"video" $episode.video
+						"gameplay" $gameplayData.fullname
+						"name" $episodeName
+						"index" $index
+						"episodes" $gameplayData.episodes
+					)
+				}}
+				{{ $.AddPage $page }}
+			{{ end }}
+		{{ end }}
+	{{ end }}
+{{ end }}
\ No newline at end of file
diff --git a/hugo/content/gameplays/_index.md b/hugo/content/gameplays/_index.md
new file mode 100644
index 0000000..c061ae7
--- /dev/null
+++ b/hugo/content/gameplays/_index.md
@@ -0,0 +1,7 @@
+---
+title: "Gameplays"
+layout: "gameplaylist"
+---
+# Gameplays
+
+Hier gibt es eine Liste meiner jüngsten Gameplay-Videos. Die Liste wird immer sehr kurz sein, denn auf meinem armen [Raspberry Pi](/pi/) steht nicht genug Platz für größere Mengen an Videos zur verfügung. Also einfach ab und zu mal vorbei schauen, ob es was neues gibt.
\ No newline at end of file
diff --git a/hugo/content/gameplays/journey/_index.md b/hugo/content/gameplays/journey/_index.md
new file mode 100644
index 0000000..b87bfe9
--- /dev/null
+++ b/hugo/content/gameplays/journey/_index.md
@@ -0,0 +1,13 @@
+---
+title: "Journey"
+fullname: "Journey"
+episodes:
+  - description: "Journey ist ein sehr schönes, aber auch sehr kurzes Spiel. Daher gibt es nur eine Episode."
+    video: "https://files.alphabreed.com/dh/rAYEddHw5RdsFvW/journey.mp4"
+---
+Entwickler: [thatgamecompany](https://thatgamecompany.com/)\
+Herausgeber: [Annapurna Interactive](https://www.annapurnainteractive.com/)
+
+> In Journey erkundest du eine alte, mysteriöse Welt, schwebst über Ruinen und gleitest über die Sandlandschaft, um ihre Geheimnisse zu entdecken. Du kannst allein spielen oder mit einem Mitreisenden, um die riesige Welt gemeinsam zu erkunden. Mit atemberaubender Grafik und für den Grammy nominierter Musik liefert Journey ein fantastisches Erlebnis wie kein anderes Spiel.
+
+Quelle: [Steam](https://store.steampowered.com/app/638230/Journey/)
\ No newline at end of file
diff --git a/hugo/content/gameplays/zanzarah/_index.md b/hugo/content/gameplays/zanzarah/_index.md
new file mode 100644
index 0000000..10c28f2
--- /dev/null
+++ b/hugo/content/gameplays/zanzarah/_index.md
@@ -0,0 +1,55 @@
+---
+title: "ZanZarah"
+fullname: "ZanZarah: The Hidden Portal"
+episodes:
+  - title: "Die Prophezeiung"
+    description: "Amy wird aus ihrem langweiligen Leben in London in eine Welt voller Phantasie und Fabelwesen geworfen."
+    video: "https://files.alphabreed.com/dh/L93A2fpRBzhO1y5/zanzarah1.mp4"
+  - title: "Pixie-Plage"
+    description: "ZanZarah wird von grausigen Pixies heimgesucht. Wenn doch bloss jemand etwas dagegen unternehmen könnte..."
+    video: "https://files.alphabreed.com/dh/SRy81csM6ZfeMsQ/zanzarah2.mp4"
+  - title: "Tiralin"
+    description: "Am Rande des Waldes erhebt sich die majestätische Stadt der Elfen. Es gibt viel zu erkunden."
+    video: "https://files.alphabreed.com/dh/v9s7yG3i0dNIPAW/zanzarah3.mp4"
+  - title: "Die Belagerung von Dunmore"
+    description: "Die Stadt im Sumpf ist ohnehin kein einladender Ort, und dann wird sie auch noch von Schattenelfen angegriffen."
+    video: "https://files.alphabreed.com/dh/QYOqID6qr3lDeiy/zanzarah4.mp4"
+  - title: "Unkraut-Ex!"
+    description: "Mit der Feenkarte der Natur können wir uns endlich um die lästigen Dornenbüsche kümmern."
+    video: "https://files.alphabreed.com/dh/gzp98mkBrb9F2vb/zanzarah5.mp4"
+  - title: "Zu viel Eis ist ungesund"
+    description: "Die Eis-Feen der Schattenelfen setzen unserer Gruppe stark zu, aber zu guterletzt bleiben wir siegreich."
+    video: "https://files.alphabreed.com/dh/JXpJLa7txAKEiMv/zanzarah6.mp4"
+  - title: "Prüfung im Turm der Zwerge"
+    description: "Die Zwerge bewachen den Elementarschlüssel der Erde und geben ihn nur heraus, wenn wir uns als würdig erweisen."
+    video: "https://files.alphabreed.com/dh/HEscBlbiXcGGfbe/zanzarah8.mp4"
+  - title: "Unterwegs zur Bergspitze"
+    description: "Wir durchstreifen die Bergwelt, helfen einigen Zwergen und kommen auf den schneebedeckten Gipfeln an."
+    video: "https://files.alphabreed.com/dh/DGJYIFvOtvV81S4/zanzarah9.mp4"
+  - title: "Die ohne Ton aber mit Lasse"
+    description: "Auf der Bergspitze gibt es endlich auch einige Eis-Feen zu fangen und in einer abgelegenen Höhle befreien wir den Zwerg Lasse, der nach seinem Vater dem Zwergenmeister sucht und uns für seine Rettung den Elementarschlüssel der Luft schenkt."
+    video: "https://files.alphabreed.com/dh/R0AAo6HwGpjDosv/zanzarah10.mp4"
+  - title: "In die Wolken geschraubt"
+    description: "Nach einem Kurzen Abstecher zur Berghütte nutzen wir den ersten der Zwergenaufzüge um das Wolkenreich zu betreten."
+    video: "https://files.alphabreed.com/dh/FzMdaJtm0miYQwc/zanzarah11.mp4"
+  - title: "Der Weiße Druide"
+    description: "Der Weiße Druide, der Beschützer von ZanZarah, wird von fiesen Schattenelfen angegriffen. Amy eilt zur Rettung."
+    video: "https://files.alphabreed.com/dh/H9AxbUkVGeK1MZp/zanzarah12.mp4"
+  - title: "Herrin der Arena"
+    description: "Wir beweisen uns in der Alten Arena des Wolkenreichs gegen einen Schattenelfen mit mächtigen Dunkelfeen. Offenbar stehen auch die Zwerge mit den Schattenelfen im Bunde. Verquerer und verquerer."
+    video: "https://files.alphabreed.com/dh/f8fph7hzuyG15JR/zanzarah13.mp4"
+  - title: "Dunkle Höhlen"
+    description: "Nach dem Höhenflug im Wolkenreich geht es nun zurück nach Tiralin und dann in die Tiefen der Erde, zur Zwergenstadt Monagham."
+    video: "https://files.alphabreed.com/dh/N1xVVKEDOfdv9i4/zanzarah14.mp4"
+  - title: "Das Turnier im Großen Baum"
+    description: "Jemand muss ins Schattenreich vordringen und die Dunklen Mächte besiegen. Ein Turnier im Großen Baum des Sumpfes soll entscheiden, wer dieses zweifelhafte Privileg haben darf."
+    video: "https://files.alphabreed.com/dh/zi82zNfK9aH1xa2/zanzarah15.mp4"
+---
+Entwickler: [Funatics](https://www.funatics.de/)\
+Herausgeber: [Daedalic Entertainment](https://www.daedalic.com/)
+
+> Eine begeisternde Geschichte von zwei Welten… die eine ist eine Welt der Phantasie, die andere ist jene Welt, wie wir sie kennen. Es gibt nur einen Menschen, der in der Lage ist, die beiden Welten wieder zu vereinen: Ein 18 Jahre altes Mädchen, das noch nichts von ihrer Macht und ihre Bedeutung für beide Reiche ahnt…
+>
+> Führe Amy in die Welt von Zanzarah; der Magie und des Kampfes. Erforsche das Reich mystischer Fabelwesen und nutze die stetig wachsende Macht deiner Heldin, um die hier lebenden Feen und Dämonen zu fangen und zu erobern. Steige mit ihnen in die Arena, wenn sich dir Kobolde oder andere magische Wesen in den Weg stellen.
+
+Quelle: [Steam](https://store.steampowered.com/app/384570/Zanzarah_The_Hidden_Portal/)
\ No newline at end of file
diff --git a/hugo/content/if/_index.md b/hugo/content/if/_index.md
new file mode 100644
index 0000000..2d8007d
--- /dev/null
+++ b/hugo/content/if/_index.md
@@ -0,0 +1,10 @@
+---
+title: "Interactive Fiction"
+---
+# Interactive Fiction
+
+Bei «Interactive Fiction» handelt es sich um die Form der digitalen Unterhaltung, die allgemein auch unter dem Begriff «Textadventures» bekannt ist. Der Spieler schlüpft dabei zumeist in die Rolle des Protagonisten in einer interaktiven Geschichte und kann mittels Tastaturkommandos in seiner virtuellen Umwelt agieren. Zwar ist die Blütezeit der kommerziellen Textadventures schon ein paar Jahre vergangen, doch erfreuen sie sich in Fankreisen immer noch großer Beliebtheit.
+
+Diese Seite spiegelt meine Ansichten zu den Themen Spieldesign und Erstellung von Interactive Fiction wieder, aber diese Prinzipien sind natürlich in keinster Weise in Stein gemeißelt. Es steht jedem Autor frei, sie nach Bedarf anzupassen oder komplett zu ignorieren.
+
+In Zukunft soll dieser Bereich auch noch um die Rubrik «Implementation» erweitert werden. Dort werde ich dann auf eher technische Aspekte und die eigentliche Programmierung eingehen. Für die Beispiele werde ich Inform 6 verwenden, da dies auch die Sprache meiner Wahl zum erstellen von Textadventures ist.
\ No newline at end of file
diff --git a/hugo/content/if/design.md b/hugo/content/if/design.md
new file mode 100644
index 0000000..5717fff
--- /dev/null
+++ b/hugo/content/if/design.md
@@ -0,0 +1,68 @@
+---
+title: "Designrichtlinien"
+description: "Richtlinien für das Design von Interactive Fiction."
+menu: "if"
+---
+# Designrichtlinien
+
+Mit den Möglichkeiten eines aktuellen Textadventure-Entwicklungssystems ein kurzes Spiel auf die Beine zu stellen ist relativ einfach, insbesondere da dazu keine weiteren Fähigkeiten außer der reinen Programmierung nötig sind. Ein Spiel erstellen zu können muss allerdings noch lange nicht heissen, dass es dabei auch tatsächlich gut wird. Wie auch bei jeder anderen Art von Computerspielen muss das Design eines Textadventures gut durchdacht werden und alle seine Elemente müssen fliessend zusammenarbeiten, um dem Spieler ein fesselndes Spieleerlebnis bieten zu können.
+
+Eine gute Ausdrucksfähigkeit kommt dem Spiel natürlich zugute, ist aber meisstens eher nebensächlich. Erfahrungsgemäss sind Spieler viel eher bereit, einen schlechten Umgang mit Prosa zu verzeihen als konzeptionelle Fehler zu ignorieren. Es ist naheliegend: Was die Grafik für ein Grafikadventure ist, ist der Text für ein Textadventure. Auch die schönste Grafik allein macht kein gutes Spiel, wenn die Bedienung zu umständlich ist oder man permanent dazu angehalten wird Dinge zu tun, auf die man beim ersten mal schon keine Lust hatte. Andererseits kann eine gute Grafik - und analog dazu gute Prosa - durchaus dazu gereichen, ein Spiel mit einem stimmigen und gut funktionierenden Konzept aus der Masse der übrigen Spiele herauszuheben. Im folgenden werde ich einige Punkte ansprechen, auf die man meiner Meinung nach insbesondere beim Design von Textadventures achten sollte.
+
+## Zwischensequenzen
+
+Der Einsatz von Zwischensequenzen erscheint naheliegend, vor allem wenn man versucht, eine dichte Story zu übermitteln. Diese Mentalität entspringt vermutlich zum Teil aus Erfahrungen mit aktuellen 3D-Spielen, in denen die Storyelemente häufig in filmartigen Sequenzen ohne Interaktionsmöglichkeiten erzählt werden. Dabei wird aber leider ausser Acht gelassen, dass es sich im Rest dieser Spiele zumeinst um völlig andere, viel straffere Spielkonzepte handelt, als sie im durchschnittlichen Textadventure reproduziert werden könnten.
+
+In einem modernen Egoshooter sind die Zwischensequenzen eine Gelegenheit sich kurz von dem ganzen Gerenne und Geschiesse zuvor zu erholen und gleichzeitig mit einem weiteren Teil der Story belohnt zu werden. Bei einem Textadventure geht dieses Prinzip nicht auf. Dort entfaltet sich die Sequenz nicht fließend wie ein Film sondern brachial wie ein gewaltiger Block Text, der plötzlich auf dem Bildschirm erscheint und den Spieler ersteinmal einschüchtert: «Ohje, DAS muss ich mir jetzt alles durchlesen?».
+
+Es besteht natürlich die Möglichkeit, diesen Effekt bedeutend abzuschwächen, indem man die Sequenz beispielsweise in mehrere kleine Häppchen unterteilt, die der Spieler immer erst durch das Drücken einer Taste bestätigen muss, um den nächsten Abschnitt angezeigt zu bekommen. Das funktioniert natürlich und wird auch häufig in Textadventures eingesetzt.
+
+Ich wage jedoch zu behaupten, dass das stupide drücken einer Taste kein besonders gutes Designelement für ein Spiel darstellt. Das Genre heisst nicht umsonst «Interactive Fiction» und nicht «Push-A-Button Fiction». Derartige Sequenzen sind in einer eher statischen Form der Prosa wie beispielsweise einem Buch gut aufgehoben, haben in einem Textadventure nichts zu suchen.
+
+Eine wesentlich bessere Lösung ist es, den Spieler die Sequenz ausspielen zu lassen. Anstatt einen automatisch ablaufenden Dialog ablaufen zu lassen könnte man den Spieler die Informationen von seinem virtuellen Gegenüber interaktiv erfragen lassen. Anstatt den Spieler in letzter Sekunde einer gefährlichen Situation automatisch entkommen zu lassen könnte man sich die Sequenz rundenweise entfalten lassen, wärhend der Spieler auf jedes neu aufkommende Problem passend reagieren muss, um zu überleben. Dies bedeutet für den Autor natürlich einen wesentlich größeren Programmieraufwand, der es allerdings absolut wert ist. Seine Spieler werden es ihm danken. Vor der möglichen Konsequenz des Spielertodes sollte man als Autor an dieser Stelle auch nicht unbedingt zurückschrecken, was uns zum nächsten Punkt bringt:
+
+## Tod und Auferstehung
+
+In der frühen Zeit der Textadventures war der Spielertod ein Element, das man an jeder Ecke der Spielwelt angetroffen hat. Oft war die Konsequenz des Ablebens anhand der auslösenden Handlung noch nicht einmal nachvollziehbar. Wenn man beispielsweise auf einem Waldweg die linke anstatt der rechten Abzweigung nahm, so war es durchaus möglich, auf der Stelle zu sterben weil dort ein menschenfressendes Monster gelauert hat, welches man vorher nicht bemerkt hat. Eine solche Spielwelt zu erkunden konnte also mitunter recht frustrierend werden.
+
+Dies führte in späteren Text- und Grafikadventures dann dazu, dass es überhaupt nicht mehr möglich war zu sterben. Aufgrund der eingeschränkten Interaktionsmöglichkeiten in Grafikadventures ist dies ein durchaus vertretbares Konzept, greift in Textadventures aber nur bedingt. Es gibt dort einfach keinen wirklich unbestreitbaren Grund, dem Spieler Aktionen zu verweigern, die seie Spielfigur eigentlich auszuführen in der Lage sein müsste. Der Befehl, jetzt bitteschön in den Abrund zu springen, sollte also auch zu eben dieser Aktion und dem Spielertod als logischer Konsequenz führen, anstatt eine sinnfreie Ablehnung wie «Ich will nicht.» anzuzeigen. Es besteht absolut keine Notwendigkeit, den Spieler krampfhaft am Leben zu halten, wenn er sich bewusst in eine offensichtlich lebensbedrohliche Situation begibt.
+
+Auf unvorhersehbare Tode sollte man allerdings tatsächlich verzichten, da diese wirklich nur Frustration schüren und so gut wie nie positiv von Spielern aufgenommen werden. Bei Toden, die zwar bei näherem betrachten logisch, auf den ersten Blick aber nicht unbedingt offensichtlich sind, gibt es mehrere Möglichkeiten: Man sollte dem Spieler entweder eine oder mehrere Runden Zeit geben, sich der Situation wieder zu entziehen oder man sollte vorher zumindest einmal und offensichtlich darauf hinweisen, dass gewisse Handlungen an dieser Stelle der Gesundheit abträglich sein könnten. Bei einer Luftschleuse, die ins Vakuum des Alls führt, könnte man in der Beschreibung etwa erwähnen, dass sich dahinter Luftleerer Raum befindet in dem Atmen schwierig wird. Alternativ könnte man den Spieler die Schleuse öffnen lassen, worauf die Luft aus dem Raum entweicht, aber erst nach 3 Runden vollkommen leer ist und zum Tod führt. Zeit genug, die Schleuse wieder zu schliessen, so man keinen Selbstmord begehen will.
+
+Sollte auf diese Weise doch einmal der Tod eingetreten sein, so ist dies im Normalfall auch kein Beinbruch. Die meissten Textadventure-Systeme stellen standartmässig die Möglichkeit zur Verfügung, die letzte Runde ungeschehen zu machen. Dies rettet den Spieler zwar nicht aus schon längere Zeit ausweglosen Situationen, aber man kann eine einzelne Fehlentscheidung auf diese Weise rückgängig machen und stattdessen etwas anderes probieren. Dies ist eine elegante Interaktionsmöglichkeit, die es dem Spieler auch erlaubt etwas herumzuexperimentieren, ohne gleich fürchten zu müssen das Spiel zu verlieren. Diese Option sollte man als Autor definitiv in seinem Spielekonzept berücksichtigen und damit arbeiten, es sei denn sie behindert das restliche Konzept. In dem Fall sollte man es besser komplett deaktivieren und am Anfang des Spieles oder in den Hilfe-Ausgaben darauf hinweisen, um den Spieler gar nicht erst in falscher Sicherheit zu wiegen.
+
+Im Rahmen der Story und des Spielkonzepts gibt es natürlich noch viele weitere Möglichkeiten, den Spieler sterben oder auferstehen zu lassen. Diese müssen dann aber von den jeweiligen Autore explizit einprogrammiert werden und deren Regeln müssen entsprechend individuell von Spiel zu Spiel betrachtet werden. Ein hervorragendes Beispiel hierfür ist das Spiel «Shrapnel» von Adam Cadre, in dem die Fähigkeit des Spielers zu sterben und wieder aufzuerstehen integral notwendig zum erreichen des Spielziels ist.
+
+## Beschreibungen
+
+Beschreibungen von Gegenständen und Räumen sind ein sehr zentraler Aspekt von Textadventures. Entsprechend wichtig ist es demnach, sie ordentlich darzustellen. Schlechte Beschreibungen gibt es leider wie Sand am Meer, gute muss man aber oft mit der Lupe suchen. Im allgemeinen sollte man auf Formulierungen wie «Du stehst in …» oder «Dies ist der Raum XY» besser verzichten. Beides ist über alle Maßen offensichtlich und trägt nichts zur Aussage des Textes bei. Die allgemeine Beschreibung eines Raumes sollte vielmehr versuchen, die Atmosphäre einzufangen. Eine simple Auflistung aller Einrichtungsgegenstände erfüllt diesen Zweck meisstens nicht sehr gut, weshalb Autoren sich ruhig auch etwas poetisch angehauchtere Formulierungen ausdenken können. Man hat zum Beispiel eine ziemlich gute Vorstellung davon, wie das Büro eines heruntergekommenen Privatdetektivs der 60er Jahre beschrieben werden sollte. Dies muss man nur noch auf andere Räume übertragen und schon hat man ein «Feeling» für die Beschreibung von Räumen.
+
+Gegenstände, mit denen der Spieler interagieren soll oder die auf andere Weise wichtig für die Spielwelt oder die Story sind, sollten gesondert von der Hauptbeschreibung des Raumes erwähnt werden. Die «initial»-Routine von Objekten in Inform 6 wäre dazu beispielsweise der richtige Ort. Bei alltäglichen Gegenständen, deren Aussehen oder Zweck im Raum offensichtlich ist, kann man sich diese Beschreibungen ganz sparen und sie nur zusammengefasst in einem einzigen Satz erwähnen lassen. Die meissten Entwicklungssysteme tun dies automatisch, wenn man keine spezielle Beschreibung hinterlegt hat.
+
+Allgemein sollte man als Autor bei der Raumbeschreibung Zurückhaltung üben. Eine solche Beschreibung überfliegt den Raum schliesslich nur auf den ersten Blick. Details zu jedem Gegenstand kann sich der Spieler auf Wunsch durch näheres Untersuchen beschaffen. Dies trägt sehr zur Spieltiefe bei, da der Spieler das Gefühl bekommt, die Welt wirklich zu entdecken anstatt sie nur vorgesetzt zu bekommen. Ein netter Nebeneffekt ist natürlich auch, dass Raumbeschreibungen auf diese Art kurz und Übersichtlich gehalten werden. Auch hier gilt: In der Kürze liegt die Würze!
+
+## Rätsel
+
+Rätsel sollten sich immer in die Szene einpassen um nicht künstlich zu wirken. Nichts ist schlimmer für einen Spieler als in einer spannenden Atmosphäre plötzlich dazu genötigt zu werden, irgendein zusammenhangloses Logikpuzzle zu lösen, um mit der Geschichte fortfahren zu dürfen. Der Spieler wird zu etwas gezwungen, woran er nicht interessiert ist und was er möglicherweise noch nicht einmal so ohne weiteres bewältigen kann. Diese Form von Rätsel sollte man auf jeden Fall vermeiden.
+
+Darüber hinaus können die Rätsel so einfach oder komplex werden wie man möchte. Soll das Spiel schwierig oder Rätsellastig werden dann baut man lange und komplexe Rätsel ein, andernfalls eben einfache und kurze.
+
+Man sollte nur auf zwei Punkte achten: selbst wenn sie nur sehr einfach sind müssen auf jeden Fall Rätsel eingebaut werden, damit das Spiel nicht langweilig wird. Desweiteren sollte man Konzepte für komplexe Rätsel nicht überstrapazieren. So mach es z.B. keinen Sinn, ein Rätsel einzubauen, bei dem man mit 20 Handgriffen eine Kaffeemaschine reparieren muss. Da sollte man sich schon etwas besseres einfallen lassen.
+
+## Dialoge
+
+Grundlegend gibt es zwei Möglichkeiten, ein Dialogsystem zu implementieren: Fragen- oder Menübasiert. Dazu kommen natürlich noch die verschiedensten Mischformen der zwei. Bei der Fragen-basierten Variante wird jede Dialog-Sequenz durch eine explizite Frage oder Aussage des Spielers der Form «Frag den Lehrer nach dem Buch» oder «Erzähl dem Lehrer von dem Buch» ausgelöst. Dies hat den Vorteil dass es sich gut in den Spielfluss integrieren lässt, aber den Nachteil, dass der Spieler oft nicht weiss, was er nun alles fragen oder sagen kann. Das kann zu frustrierendem Herumprobieren führen.
+
+Bei der zweiten Alternative wird häufig das Dialogsystem über eine Aufforderung der Art «Sprich mit dem Lehrer» aufgerufen und die eigentliche Frage oder Aussage dann aus einem Menü ausgewählt. Vortelhaft ist dabei vor allem, dass der Spieler immer weiß was er sagen kann und keine Möglichkeit übersieht. Nachteilig ist vor allem dass es unter Umständen sehr künstlich anmutet und der Spieler nicht das Gefühl hat, den Dialog wirklich durch eigenen Willen zu lenken.
+
+Letztendlich ist die Wahl wieder eine Frage des eigenen Geschmacks. Ich persönlich bevorzuge die Fragen-Variante, allerdings solle man dann stets deutlich darauf hinweisen, was mögliche Gesprächsthemen sind.
+
+## Quips und Beats
+
+Die Konzepte sind eigentlich offensichtlich, aber jedes Kind braucht eben einen Namen. Bei Quips handelt es sich dabei lediglich um die einzelnen Dialogpassagen, die durch einen Aufruf des Systems (Frage oder Menüpunkt, s.o.) Sie sind das gängige Mittel um längere Dialoge thematisch in kleine Häppchen zu unterteilen, die von dem Spieler leichter überblickt werden können.
+
+Beats hingegen repräsentieren sozusagen den Herzschlag, in dem sich die Welt ein Stück weiter bewegt. Für gewöhnlich löst jede Spieleraktion einen Beat aus um zu simulieren, dass während der Spieler etwas tut der Rest der Welt auch nicht untätig bleibt.
+
+In besonderen Situationen kann es allerdings wünschenswert sein, dass eine Aktion keinen Beat auslöst oder vielleicht sogar mehrere. Beispielsweise wären Situationen denkbar die sehr zeitkritisch sind und in denen look und examine keinen Beat auslösen sollen, schon allein um zu verhindern dass der Spieler nach jeder dieser Aktionen freiwillig ein undo eingibt um keine wertvolle Zeit zu verlieren.
+
+Besonders lange Aktionen könnten über ihren Verlauf hinweg mehrere Beats auslösen oder in einer Konversation können mehrere ausgelöst werden um den Gesprächsteilnehmer die Möglichkeit zu geben, über ein automatisiertes Script-System eigene Kommentare abzugeben. Dies würde dann in begrenztem Rahmen sogar eine Konversation mit mehreren Personen gleichzeitig erlauben.
\ No newline at end of file
diff --git a/hugo/content/if/empfehlungen.md b/hugo/content/if/empfehlungen.md
new file mode 100644
index 0000000..1737e74
--- /dev/null
+++ b/hugo/content/if/empfehlungen.md
@@ -0,0 +1,24 @@
+---
+title: "Spieleempfehlungen"
+description: "Spieleempfehlungen aus dem Genre der Interactive Fiction."
+menu: "if"
+---
+# Spieleempfehlungen
+
+Im folgenden werde ich einige Textadventures anderer Autoren vorstellen. Für die Links zu den Spielen selber verlinke ich sofern möglich auf die Homepage des jeweiligen Autors und andernfalls auf das _Interactive Fiction Archive_. Zum Starten der Spiele ist in der Regel ein Interpreter für das entsprechende Story-Format notwendig. Gute Optionen stelle ich im Abschnitt [Tipps für Einsteiger](/if/tipps/) vor.
+
+## [Photopia](http://www.adamcadre.ac/if.html#Photopia) von Adam Cadre
+
+In Photopia begleitet man ein junges Mädchen durch gewisse Schlüsselmomente in ihrem Leben, die immer wieder durchsetzt sind mit fantastischen Geschichten aus ihrer Vorstellung. Die Geschichte ist sehr linear aufgebaut und selbst wenn dem Spieler Entscheidungsmöglichkeiten vorgegaukelt werden kann er keinerlei Einfluss auf den Verlauf der Geschehnisse nehmen. Das Spiel besitzt ein menügesteuertes Dialogsystem und verzichtet beinahe komplett auf jegliche Form von Rätsel. Was in jeder Situation zu tun ist wird entweder spätestens nach kurzem überlegen aus der Situation heraus offensichtlich oder wird nach ein paar Runden automatisch gelöst. Großartig an Photopia ist aber vor allem die Erzählung. Adam Cadre spielt gekonnt mit verschiedensten Stilelementen um Situationen zu schaffen, die den Spieler emotional stark an die Hauptfigur fesseln.
+
+## [Shrapnel](http://www.adamcadre.ac/if.html#Shrapnel) von Adam Cadre
+
+Eine verstörende Geschichte über die Bewohner eines einsamen Hauses auf dem Land und eines neu angekommenen Gastes, in dessen Rolle der Spieler schlüpft. Im Laufe der Geschichte wird schnell klar, dass dort einiges im Argen liegt und sogar die Realität selber sich über alle Maßen seltsam verhält. Shrapnel ist das beste Beispiel für einen unkonventionellen Umgang mit dem Tod der Spielerfigur, das ich kenne. Wie auch Photopia ist es sehr linear und bietet so gut wie keine wirklichen Rätsel. Die Story selber ist sehr verwirrend und häufig vermutet man einen Fehler gemacht zu haben, wenn dies jedoch in Wahrheit nur der vollkommen normale Spielverlauf ist. Hat man sich aber erstmal mit diesen unwägbarkeiten abgefunden bietet Shrapnel ein wirklich interessantes Spielerlebnis.
+
+## [Spider and Web](https://www.eblong.com/zarf/if.html#tangle) von Andrew Plotkin
+
+In dieser Geschichte stellt der Spieler scheinbar einen Touristen in einer fremden Stadt dar, der sich unglücklicherweise verlaufen hat. Oder steckt vielleicht doch mehr dahinter? Andrew Plotkin spielt gekonnt mit der Unwissenheit, die der Spieler am Anfang der Geschichte von seiner Spielfigur hat. Es wird viel mit Flashbacks gearbeitet, so dass der Spieler häufig zwischen zwei verschiedenen Zeitabschnitten hin und her springt und immer ein wenig mehr über seine eigene Spielfigur erfährt. Das Spiel verwendet vorwiegend recht simple Kombinationsrätsel und ein Dialogsystem, das zumeist die anderen Figuren reden lässt und dem Spieler nur “Ja” und “Nein” als Antwortmöglichkeiten erlaubt. Dies funktioniert in dem Setting jedoch erstaunlich gut und kann elegant darüber hinwegtäuschen, dass das Spiel dennoch vollkommen Linear ist.
+
+## [Starrider](http://ifarchive.org/indexes/if-archiveXgamesXzcodeXgerman.html) von Max Kalus
+
+Eines der leider nur sehr wenigen guten deutschen Textadventures. Man spielt einen blinden Passagier an bord eines Raumschiffs, der, als er endlich sein Versteck verlässt, die Crew des Schiffs tot vorfindet. Es handelt sich um ein klassisches Textdaventure mit einer soliden Story, das stark von dem gut durchdachten Universum von Kalus’ Pen&Paper Rollenspiel _Chalybes_ profitiert. Die Rätsel funktionieren weitesgehend sehr gut, fallen in einzelnen Fällen aber auch mal übermäßig knifflig und weit hergeholt aus. Nichtsdestotrotz ein gutes Spiel, um das man im deutschsprachigen IF-Raum eigentlich gar nicht herum kommt.
\ No newline at end of file
diff --git a/hugo/content/if/links.md b/hugo/content/if/links.md
new file mode 100644
index 0000000..7009538
--- /dev/null
+++ b/hugo/content/if/links.md
@@ -0,0 +1,24 @@
+---
+title: "Weitere Links"
+description: "Interessante Links zum Thema Interactive Fiction."
+menu: "if"
+---
+# Weitere Links
+
+Die folgenden Links stellen eine kleine Auswahl an Seiten dar, die im Zusammenhang mit Interactive Fiction für Spieler und Autoren von Interesse sein könnten.
+
+## [The Interactive Fiction Archive](http://www.ifarchive.org/)
+
+Eine zentrale Anlaufstelle für alles, was mit Interactive Fiction zu tun hat. Von Spielen über Autorensysteme bis hin zu einem weitreichenden Sortiment an themenbezogenen Artikeln kann man hier alles finden, was das Herz begehrt. Die Präsentation ist zwar sehr rudimentär, jedoch eignet es sich hervorragend zum Herumstöbern.
+
+## [Brass Lantern](http://www.brasslantern.org/)
+
+Diese Seite stellt eine große Vielfalt an Artikeln über IF und angelehnte Themen zur Verfügung. Behandelt werden beispielsweise Inhalt und Stil von Computerspielen mit dem Fokus auf Textadventures, aber auch aktuelle Entwicklungen in der Szene sowie Ankündigungen und Resultate von Wettbewerben. Informativ und übersichtlich ist sie immer einen Blick wert, wurde allerdings offenbar auch schon eine Weile nicht mehr aktualisiert.
+
+## [Emily Short’s Interactive Storytelling](http://emshort.wordpress.com/)
+
+Der offizielle Blog von Emily Short, einer der bekanntesten IF Autorinnen und Mitentwicklerin der Programmiersprache _Inform 7_. Sie schreibt dort hauptsächlich über stilistische Aspekte des Designs von Computerspielen im allgemeinen und Textadventures im besonderen. Auch informiert sie regelmässig über Neuerungen in der Entwicklung von Inform 7.
+
+## [textfire.de](http://www.textfire.de/)
+
+Eine gute deutsche Seite, die die technischen Aspekte von IF beleuchtet. Es werden Tipps für Autoren gegeben die vom Inhalt über den Stil bis zur Implementation reichen. Leider wird die Seite nicht mehr aktiv weiter geführt, so dass einige der Informationen bereits veraltet sind.
\ No newline at end of file
diff --git a/hugo/content/if/systeme.md b/hugo/content/if/systeme.md
new file mode 100644
index 0000000..d73be06
--- /dev/null
+++ b/hugo/content/if/systeme.md
@@ -0,0 +1,24 @@
+---
+title: "Autorensysteme"
+description: "Eine Liste populärer Autorensysteme für Interactive Fiction."
+menu: "if"
+---
+# Autorensysteme
+
+Es gibt heutzutage die verschiedensten Hilfsmittel um Textadventures zu erstellen. Sie reichen von einfachen Compilern bis hin zu aufwändigen integrierten Entwicklungsumgebungen. Nachfolgend möchte ich eine kleine Auswahl davon vorstellen. Von den reinen Fähigkeiten her haben die meisten dieser Autorensysteme selten klare Vorteile gegenüber anderen, was die Wahl eines Systems im Allgemeinen zu einer Frage der persönlichen Vorlieben macht.
+
+## [Inform 7](http://www.inform7.com/)
+
+Inform 7 besitzt eine integrierte Entwicklungsumgebung (IDE), die die Erstellung des Programmcodes stark vereinfacht. Der Code selber besitzt eine Sprachsyntax, die an die englische Umgangssprache angelehnt und so unter Umständen etwas eingänglicher für Nicht-Programmierer ist. Diese Syntax ist auf dem älteren Inform 6 Code aufgesetzt und produziert als Ausgabe wahlweise die verschiedenen Z-code-Formate oder das neuere Glulx-Format. Inform 7 ist ein sehr gutes Autorensystem und vereint in sich alles was man benötigt um ein Textadventure zu programmieren. Das System lässt sich sehr einfach mit Plugins für spezielle Anwendungen erweitern. Für Programmierer ist die ungewöhnliche umgangssprachliche Syntax stark gewöhnungsbedürftig, aber nach einer gewissen Eingewöhnungszeit kann sie dennoch gut funktionieren.
+
+## [Inform 6](http://www.inform-fiction.org/)
+
+Im Gegensatz zu Inform 7 ist Inform 6 keine komplette Entwicklungsumgebung sondern nur ein Compiler. Der Programmcode muss in einem Texteditor erstellt werden und kann dann auf Kommandozeilen-Ebene in Z-code übersetzt werden. Der Code wird in einer klassischen formalisierten Programmiersprache erstellt, die mit der umgangssprachlichen Syntax von Intorm 7 nichts gemeinsam hat. Versierte Programmierer werden sich hier daher wesentlich mehr zu Hause fühlen als bei der Nachfolgerversion. Auch für Inform 6 gibt es eine Reihe von Erweiterungen, die jedoch weit weniger komfortabel eingebunden werden können. Hat man das Ganze allerdings erstmal nach seinen Wünschen eingerichtet funktioniert es sehr gut als Autorensystem.
+
+## [TADS](http://www.tads.org/)
+
+Das Text Adventure Developement System (kurz TADS) bietet eine direkte Alternative zu Inform 6 und ungefähr den gleichen Funktionsumfang. Die Syntax ist ebenso formalisiert, sieht jedoch komplett anders aus. Ebenso gibt es Erweiterungen die es um bestimmte Funktionen erweitern können. Als Ausgabe produziert es keinen Z-code sondern eben das TADS-eigene Story-Format, für das man einen anderen Interpreter benötigt. Viele gute Textadventures wurden mit TADS geschrieben und es schwören ebenso viele Autoren auf darauf wie auf Inform 6.
+
+## [Adrift](http://www.adrift.co/)
+
+Bei Adrift handelt es sich wieder um eine komplette Entwicklungsumgebung, die darauf ausgerichtet ist möglichst einfach bedient werden zu können. Der Programmcode wird beinahe komplett von den verschieden Editoren verborgen. Neue Räume und Aktionen können einfach mit einer Eingabemaske erstellt werden. Auf diese Weise geht es sehr schnell und einfach, ein simples Textadventure zu erstellen. Darin liegt aber auch gleichzeitig das Problem: alles was von Standardfunktionen abweicht ist schwierig umzusetzen und neue Kommandos können nur sehr unzureichend definiert werden. Das Erstellen von Spielen ist somit zwar vereifacht worden, die Ergebnisse lassen von technischer Seite jedoch häufig zu wünschen übrig. Nichtsdestotrotz eignet es sich gut für Anfänger im Erstellen von Textadventures. Die Adrift Entwicklungsumgebung ist mittlerweile ebenfalls kostenlos. Um Spenden wird gebeten.
\ No newline at end of file
diff --git a/hugo/content/if/tipps.md b/hugo/content/if/tipps.md
new file mode 100644
index 0000000..0a0d09c
--- /dev/null
+++ b/hugo/content/if/tipps.md
@@ -0,0 +1,247 @@
+---
+title: "Tipps für Einsteiger"
+description: "Tipps für Einsteiger ins Genre der Interactive Fiction."
+menu: "if"
+---
+# Tipps für Einsteiger
+
+Zum Spielen von Interactive Fiction sind einige Grundlagen erforderlich. Diese will ich hier ein wenig beleuchten.
+
+## Spiele downloaden
+
+Wenn man sich entschlossen hat, sich mit Interactive Fiction auseinander zu setzen, benötigt man sinnvollerweise zuallererst ein Spiel. Das [Interactive Fiction Archive](http://www.ifarchive.org/indexes/if-archiveXgames.html) stellt eine große Auswahl von Spielen zum freien Download zur Verfügung, allerdings ist es dort etwas unübersichtlich und genauere Informationen zu den Spielen erhält man dort auch nicht. Als Entscheidungshilfe kann an dieser Stelle [Baf’s Guide to the IF Archive](http://www.wurb.com/if/) dienen. Dort kann man die Spiele nicht nur komfortabel nach verschiedenen Kriterien durchsuchen sondern sich auch kurze Reviews zu jedem Spiel durchlesen. Der Guide verlinkt direkt auf das IF-Archive für die Downloads der Spiele und zeigt auf, in welchem Format sie vorliegen.
+
+## Starten der Spiele
+
+Hat man nun das Spiel der Wahl heruntergeladen dann steht man in den meissten Fällen vor dem Problem, dass es nicht in einer direkt ausführbaren Form (z.B. .exe-Datei) sondern als Story-Datei vorliegt. Für solche Spiele benötigt man einen passenden Interpreter, ein Programm welches in der Lage ist, das Spiel abzuspielen. Welchen Interpreter man für ein bestimmtes Spiel benötigt kann man entweder den beigefügten Informationen (z.B. README-Datei oder Baf’s Guide) entnehmen oder man muss sie recherchieren. Als Anhaltspunkt kann folgende Liste der gängisgsten Dateinamens-Suffixen von Story-Dateien dienen:
+
+<table>
+	<thead>
+		<tr>
+			<th>Suffix</th>
+			<th>Story-Format</th>
+		</tr>
+	</thead>
+	<tbody>
+		<tr>
+			<td>.a3c, .acd</td>
+			<td>Alan</td>
+		</tr>
+		<tr>
+			<td>.agx</td>
+			<td>AGT</td>
+		</tr>
+		<tr>
+			<td>.cbm</td>
+			<td>Quill</td>
+		</tr>
+		<tr>
+			<td>.d$$, .da1, .da2, .da3, .da4, .da5, .ttl</td>
+			<td>AGT</td>
+		</tr>
+		<tr>
+			<td>.gam, .t3</td>
+			<td>TADS</td>
+		</tr>
+		<tr>
+			<td>.hex</td>
+			<td>Hugo</td>
+		</tr>
+		<tr>
+			<td>.mag, .gfx</td>
+			<td>Magnetic Scrolls</td>
+		</tr>
+		<tr>
+			<td>.taf</td>
+			<td>Adrift</td>
+		</tr>
+		<tr>
+			<td>.tag</td>
+			<td>T.A.G.</td>
+		</tr>
+		<tr>
+			<td>.ulx, .gblorb, .glb</td>
+			<td>Glulx</td>
+		</tr>
+		<tr>
+			<td>.z3, .z4, .z5, .z6, .z8, .zblorb, .zlb</td>
+			<td>Z-code</td>
+		</tr>
+	</tbody>
+</table>
+
+Weiss man aber erstmal in welchem Format das Spiel vorliegt dann kann man sich einfach einen passenden Interpreter aussuchen. Hier zwei Multitalente, die beide ein großes Spektrum der gängigen Story-Formate abdecken:
+
+**[Gargoyle](http://ccxvii.net/gargoyle/) (Windows, Linux)**\
+Unterstützte Story-Formate:\
+_Adrift, AGT, Alan, Glulx, Hugo, Level 9, Magnetic Scrolls, TADS, Z-code_
+
+**[Spatterlight](http://ccxvii.net/spatterlight/) (Mac OS X)**\
+Unsterstützte Story-Formate:\
+_Adrift, AdvSys, AGT, Alan, Glulx, Hugo, Level 9, Magnetic Scrolls, Quill, TADS, Z-code_
+
+Natürlich gibt es noch wesentlich mehr Interpreter mit den verschiedensten Eigenschaften und und darüber hinaus noch viel mehr Autorensysteme mit den unterschiedlichsten Datei-Formaten.
+
+In der Regel ist es allerdings eine gute Idee, sich einen der multifunktionalen Interpreter wie diese beiden zu besorgen. Wenn man kein allzu exotisches Spiel spielen will können sie es mit recht hoher Wahrschenlichkeit ausführen.
+
+Der größte Nachteil dieser Interpreter ist allerdings, dass sie Spezialfähigkeitden der einzelnen Systeme wie z.B. Grafiken häufig nicht unterstützen. In solchen Fällen benötigt man dann doch einen spezialisierten Interpreter und sollte sich einfach mal im IF-Archive umsehen.
+
+## Erste Schritte
+
+Die erste Herausforderung eines neuen Spielers in einem Textadventure ist die Bewegung. Standardmäßig wird dies der Einfachheit halber über die Himmelsrichtungen sowie ein Paar weitere Spezialfälle geregelt. Da die Bewegung ein integraler Bestandteil so gut wie jedes Textadventures ist, gibt es für alle Bewegungsrichtungen auch Abkürzungen. Richtungen und Abkürzungen können der folgenden Tabelle entnommen werden:
+
+<table>
+	<thead>
+		<tr>
+			<th>Richtung</th>
+			<th>Kommando</th>
+		</tr>
+	</thead>
+	<tbody>
+		<tr>
+			<td>Norden</td>
+			<td>north/n</td>
+		</tr>
+		<tr>
+			<td>Süden</td>
+			<td>south/s</td>
+		</tr>
+		<tr>
+			<td>Westen</td>
+			<td>west/w</td>
+		</tr>
+		<tr>
+			<td>Osten</td>
+			<td>east/e</td>
+		</tr>
+		<tr>
+			<td>Nordwesten</td>
+			<td>northwest/nw</td>
+		</tr>
+		<tr>
+			<td>Nordosten</td>
+			<td>northeast/ne</td>
+		</tr>
+		<tr>
+			<td>Südwesten</td>
+			<td>southwest/sw</td>
+		</tr>
+		<tr>
+			<td>Südosten</td>
+			<td>southeast/se</td>
+		</tr>
+		<tr>
+			<td>Aufwärts</td>
+			<td>up/u</td>
+		</tr>
+		<tr>
+			<td>Abwärts</td>
+			<td>down/d</td>
+		</tr>
+		<tr>
+			<td>Hinein</td>
+			<td>in</td>
+		</tr>
+		<tr>
+			<td>Heraus</td>
+			<td>out</td>
+		</tr>
+	</tbody>
+</table>
+
+Die Orienterung anhand von Himmelsrichtungen mag auf den ersten Blick etwas seltsam anmuten, denn wer läuft schon permanent mit einem Kompass durch die Gegend? Bei näherer Betrachtung macht es aber durchaus Sinn, wenn man bedenkt, dass es sich dabei nur um ein Hilfsmittel handelt um eine allgemeingültige Form der Orientierung zu implementieren. Es ist also nicht wichtig dass man bei «north» auch wirklich nach Norden geht, sondern dass man in die gleiche Richtung geht, egal ob man den Raum von Links oder Rechts betreten hat. Die Kommandos “links” und “rechts” wären dafür nicht geeignet, da es sich dabei um eine Richtung handelt, die abängig von der derzeitigen Blickrichtung des Spielers ist.
+
+Natürlich kann man in Textadventures nicht nur durch die Gegend laufen sondern kann auch mit ihr interagieren, z.B. Dinge aufheben oder Knöpfe drücken. Dazu gibt es eine recht lange Liste von Kommandos die bei Kenntnis der englischen Sprache eigentlich weitesgehend selbsterklärend sind. Hier ein kleiner Auszug der gängisgsten:
+
+<table>
+	<thead>
+		<tr>
+			<th>Kommando</th>
+			<th>Tätigkeit</th>
+		</tr>
+	</thead>
+	<tbody>
+		<tr>
+			<td>inventory/i</td>
+			<td>Gegenstände im Inventar auflisten</td>
+		</tr>
+		<tr>
+			<td>look/l</td>
+			<td>Im Raum umschauen / Raumbeschreibung anzeigen lassen</td>
+		</tr>
+		<tr>
+			<td>examine/x <em>Gegenstand</em></td>
+			<td>Einen Gegenstand genauer untersuchen</td>
+		</tr>
+		<tr>
+			<td>wait/z</td>
+			<td>Eine Runde warten / Keine Aktion ausführen</td>
+		</tr>
+		<tr>
+			<td>take/get <em>Gegenstand</em></td>
+			<td>Einen Gegenstand in Reichweite mitnehmen</td>
+		</tr>
+		<tr>
+			<td>put <em>Gegenstand</em> in/on <em>Ort</em></td>
+			<td>Einen Gegenstand aus dem Inventar an einen anderen Ort legen</td>
+		</tr>
+		<tr>
+			<td>drop <em>Gegenstand</em></td>
+			<td>Einen Gegenstand aus dem Inventar fallen lassen</td>
+		</tr>
+		<tr>
+			<td>push <em>Gegenstand</em></td>
+			<td>Einen Gegenstand drücken oder schieben</td>
+		</tr>
+		<tr>
+			<td>pull <em>Gegenstand</em></td>
+			<td>An einem Gegenstand ziehen</td>
+		</tr>
+		<tr>
+			<td>open <em>Gegenstand</em></td>
+			<td>Einen Gegenstand öffnen, falls möglich</td>
+		</tr>
+		<tr>
+			<td>close <em>Gegenstand</em></td>
+			<td>Einen Gegenstand schließen, falls möglich</td>
+		</tr>
+		<tr>
+			<td>hit/attack <em>Gegenstand</em></td>
+			<td>Einen Gegenstand oder eine Person angreifen</td>
+		</tr>
+		<tr>
+			<td>talk to <em>Person</em></td>
+			<td>Eine Person ansprechen</td>
+		</tr>
+		<tr>
+			<td>ask <em>Person</em> about <em>Thema</em></td>
+			<td>Eine Person nach einem bestimmten Thema fragen</td>
+		</tr>
+		<tr>
+			<td>tell <em>Person</em> of/about <em>Thema</em></td>
+			<td>Einer Person etwas über ein bestimmtes Thema erzählen</td>
+		</tr>
+	</tbody>
+</table>
+
+Dies sind natürlich bei weitem nicht alle Befehle eines Standard-Textadventures, vor allem da jeder Autor sein Spiel beliebig um neue Kommandos erweitern kann, aber sie geben vielleicht einen ungefähren Eindruck davon, was alles möglich ist. Bei den ersten vier Einträgen der Tabelle handelt es sich um sehr häufig gebrauchte Kommados, weshalb die wie auch schon die Bewegungsrichtungen über Abkürzungen verfügen.
+
+## Die Welt verstehen
+
+Kann man sich erstmal bewegen hat man die schwierigste Hürde eigentlich schon überwunden. Vermutlich hat man die grundlegenden Konzepte der Anzeige auch bereits begriffen, aber hier nocheinmal in aller Kürze:
+
+Die Spielwelt ist in Bereiche aufgeteilt, die «Räume» genannt werden. Dabei muss es sich nicht zwingend um tatsächliche Räume in einem Gebäude handeln, sondern es sind auch andere Orte wie z.B. ein Seeufer als virtueller «Raum» denkbar.
+
+Wenn man einen Raum betritt wird die Beschreibung des Raumes ausgegeben. Diese beinhaltet das allgemeine Aussehen des Raumes, seine prominenten Einrichtungsgegenstände (Tische, Schränke, usw.) sowie die Türen oder anderweitige Passagen, die aus ihm hinaus in andere Räume führen. Letzteres wird manchmal auch vergessen, jedoch handelt es sich dann in den meissten Fällen um einen Designfehler des Autors. Man kann sich die Beschreibung des Raumes, in dem man sich befindet, mittels des look-Kommandos jederzeit erneut anzeigen lassen.
+
+Mit den meisten Dingen, die in der Raumbeschreibung erwähnt werden, kann man daraufhin interagieren. Das wichtigste Hilfsmittel ist dabei das examine-Kommando. Mit seiner Hilfe kann man sich genauere Informationen zu den Gegenständen beschaffen und unter Umständen auf diese Weise sogar noch mehr Gegenstände entdecken. Ein wichtiges Buch wird so vielleicht nur erwähnt (und so für den Spieler existent) nachdem er ein Bücherregal genauer untersucht hat.
+
+Nachdem man sich durch Umsehen und Untersuchen ein gutes Bild von seiner Umgebung gemacht hat, kann man anfangen sie zu verändern, Dinge mitzunehmen, Schränke zu öffnen und Knöpfe zu drücken. Hier ist der Einfallsreichtum des Spielers gefragt, um die Rätsel zu lösen, die der Autor für ihn ausgestreut hat.
+
+Von allzu todesmutigen Taten sollte man vielleicht besser absehen, denn im Gegensatz zu den meissten neueren Point & Klick Adventures kann man in vielen Textadventures durchaus sterben. Normalerweise ist das kein großes Problem und kann sofort korrigiert werden, indem man den letzten Zug ungeschehen macht. Dennoch sollte man vorsichtig sein.
+
+## Fazit
+
+m allgemeinen lassen sich alle Tipps eines Grafikadventures auch auf ein Textadventure übertragen: Untersuche alles, sprich mit jedem, nimm alles mit was du finden kannst und kombiniere es wenn angebracht mit allen neuen Gegenständen.
+
+Das sollte an Tipps ausreichen um euch auf den Weg zu bringen. Nun gehet hin und spielt ein paar Textadventures!
\ No newline at end of file
diff --git a/hugo/content/impressum.md b/hugo/content/impressum.md
new file mode 100644
index 0000000..1c37d13
--- /dev/null
+++ b/hugo/content/impressum.md
@@ -0,0 +1,16 @@
+---
+title: "Impressum"
+description: "Impressum, Datenschutz und Kontakt"
+---
+# Impressum
+
+Stefan Mühlinghaus\
+Waldenburger Weg 43\
+58511 Lüdenscheid\
+<a href="&#x6d;&#x61;il&#x74;&#x6f;&#58;j&#x61;zz&#x6d;&#97;&#110;&#x40;&#97;lp&#x68;&#x61;b&#114;&#101;&#101;&#100;.c&#x6f;m">j&#x61;zz&#x6d;&#97;&#110;&#x40;&#97;lp&#x68;&#x61;b&#114;&#101;&#101;&#100;.c&#x6f;m</a>
+
+## Datenschutz
+
+Auf dieser Website werden keine personenbezogenen Daten gesammelt oder verarbeitet. Zur Sicherstellung der Funktionsweise werden Zugriffe protokolliert, aber die zugehörigen IP-Adressen werden anonymisiert gespeichert. Eine eventuelle Kontaktaufnahme per E-Mail wird nicht über die Website abgewickelt.
+
+**Wer mir eine E-Mail schreibt und nicht möchte, dass ich seine personenbezogenen Daten in meinem E-Mail Programm speichere, soll dies bitte in der E-Mail kenntlich machen. Eine nachträgliche Löschung ist selbstverständlich auch möglich.**
diff --git a/hugo/content/login.html b/hugo/content/login.html
new file mode 100644
index 0000000..4127f26
--- /dev/null
+++ b/hugo/content/login.html
@@ -0,0 +1,45 @@
+---
+title: "Login"
+type: "login"
+---
+<article x-data="{
+	email: '',
+	password: '',
+	error: '',
+	pending: false,
+	async submitLogin(event) {
+		event.preventDefault();
+		if (!this.email || !this.password) {
+			this.error = 'Bitte E-Mail und Passwort angeben.';
+			return;
+		}
+		const data = new FormData();
+		data.append('identity', this.email);
+		data.append('password', this.password);
+		this.pending = true;
+		const response = await fetch(
+			'/api/collections/users/auth-with-password',
+			{ method: 'POST', body: data }
+		);
+		const result = await response.json();
+		this.pending = false;
+		if (!result.token) {
+			this.error = 'Login fehlgeschlagen';
+			return;
+		}
+		this.error = '';
+		localStorage.setItem('alphabreedtoken', result.token);
+		localStorage.setItem('alphabreedid', result.record.id);
+		const params = new URLSearchParams(window.location.search);
+		window.location = params.has('back') ? params.get('back') : '/';
+	}
+}">
+	<p style="color:red; text-align:center;" x-show="error" x-text="error"></p>
+	<form @submit="submitLogin">
+		<label for="email">E-Mail</label>
+		<input type="email" id="email" autocomplete="email" x-model="email">
+		<label for="password">Passwort</label>
+		<input type="password" id="password" x-model="password">
+		<button type="submit" :aria-busy="pending ? 'true' : 'false'">Login</button>
+	</form>
+</article>
\ No newline at end of file
diff --git a/hugo/content/notes.html b/hugo/content/notes.html
new file mode 100644
index 0000000..e931acd
--- /dev/null
+++ b/hugo/content/notes.html
@@ -0,0 +1,42 @@
+---
+title: "Notes"
+type: "notes"
+---
+<main x-data="{
+	store: null,
+	notes: '',
+	needCreate: false,
+	loaded: false,
+	async getNotes() {
+		const notes = await this.store.getNotes();
+		this.loaded = true;
+		if (notes === false) {
+			this.needCreate = true;
+			return;
+		}
+		this.notes = notes;
+	},
+	async saveNotes() {
+		if (!this.loaded)
+			return;
+		if (this.needCreate) {
+			const result = await this.store.createNotes(this.notes);
+			if (result)
+				this.needCreate = false;
+		}
+		else {
+			await this.store.updateNotes(this.notes);
+		}
+	},
+	async init() {
+		this.store = Alpine.store('alphabreed');
+		this.store.backUrl = '/notes/';
+		const tokenOK = await this.store.checkToken();
+		if (!tokenOK)
+			return;
+		await this.getNotes();
+	}
+}" @keydown.window.prevent.stop.ctrl.s="saveNotes">
+	<textarea autocomplete="off" spellcheck="false" autofocus placeholder="Write notes here..." x-model="notes" @input="$store.alphabreed.pending = true" @input.debounce.500ms="saveNotes"></textarea>
+	<div id="pending" :class="{'show': $store.alphabreed.pending}"></div>
+</main>
\ No newline at end of file
diff --git a/hugo/content/pi/index.md b/hugo/content/pi/index.md
new file mode 100644
index 0000000..6062415
--- /dev/null
+++ b/hugo/content/pi/index.md
@@ -0,0 +1,23 @@
+---
+title: "Raspberry Pi"
+description: "Mein lokaler Download- und Webserver"
+---
+# Raspberry Pi Unboxing
+
+Der Raspberry Pi aka. “Mein Neuer Lokaler Download- und Webserver” ist da!
+
+![Schachtel](schachtel.webp)
+
+Die Schachtel ist sooo winzig. Etwa die Größe einer großen Zigarettenschachtel. Ist auch nicht von der Raspberry Pi Foundation selber sondern “Supplied under licence by RS Components Ltd and Allied Electronics Inc.”. Weisse bescheid.
+
+![Offene Schachtel](offene-schachtel.webp)
+
+In der Schachtel gibs auch gar kein großes Trara. Da liegt einfach nur die Platine drin und dann noch ein Zettel mit dem üblichen “Nicht in die Badewanne werfen oder aufessen” Blabla in 10 Sprachen.
+
+![Platine](platine.webp)
+
+Der Pi selber ist ein niedliches kleines Ding. Passt mit etwas Spielraum in die Zigarettenschachtel und riecht wie frisch zusammengelötet. Kann man sogar auf Entfernung riechen.
+
+![Zubehör](zubehoer.webp)
+
+Ein bisschen Zubehör, damit man das ganze auch benutzen kann. Offizielles Raspberry Pi Stromkabel mit 2,5 Ampere und eine 32 GB MicroSD Karte von SanDisk. Als Betriebssystem dient zur Zeit Raspbian Minmal. Nicht zu sehen (weil vergessen) ist der SD Card Reader von Transcend zum beschreiben der Karte. Alles in allem ein Kostenpunkt von ca. 60€. Nicht schlecht.
\ No newline at end of file
diff --git a/hugo/content/pi/offene-schachtel.webp b/hugo/content/pi/offene-schachtel.webp
new file mode 100644
index 0000000..115e30d
Binary files /dev/null and b/hugo/content/pi/offene-schachtel.webp differ
diff --git a/hugo/content/pi/platine.webp b/hugo/content/pi/platine.webp
new file mode 100644
index 0000000..d3bca19
Binary files /dev/null and b/hugo/content/pi/platine.webp differ
diff --git a/hugo/content/pi/schachtel.webp b/hugo/content/pi/schachtel.webp
new file mode 100644
index 0000000..275283b
Binary files /dev/null and b/hugo/content/pi/schachtel.webp differ
diff --git a/hugo/content/pi/zubehoer.webp b/hugo/content/pi/zubehoer.webp
new file mode 100644
index 0000000..e673c46
Binary files /dev/null and b/hugo/content/pi/zubehoer.webp differ
diff --git a/hugo/layouts/_partials/comicpageslide.html b/hugo/layouts/_partials/comicpageslide.html
new file mode 100644
index 0000000..e8aa184
--- /dev/null
+++ b/hugo/layouts/_partials/comicpageslide.html
@@ -0,0 +1,25 @@
+<script>
+(function() {
+	const comicRegex = /\/comics\/([a-zA-Z0-9]+)\//;
+	let referrerMatches = document.referrer.match(comicRegex);
+	let locationMatches = document.location.href.match(comicRegex);
+	if (!referrerMatches || !referrerMatches[1]
+		|| !locationMatches || !locationMatches[1]
+		|| referrerMatches[1] != locationMatches[1]
+	)
+		return;
+	const numberRegex = /\/comics\/[A-Za-z0-9]+\/(\d+)\//;
+	referrerMatches = document.referrer.match(numberRegex);
+	locationMatches = document.location.href.match(numberRegex);
+	let referrerNum = 0;
+	if (referrerMatches && referrerMatches[1])
+		referrerNum = parseInt(referrerMatches[1], 10);
+	let locationNum = 0;
+	if (locationMatches && locationMatches[1])
+		locationNum = parseInt(locationMatches[1], 10);
+	if (locationNum > referrerNum)
+		document.documentElement.classList.add('forward');
+	else
+		document.documentElement.classList.add('back');
+})();
+</script>
\ No newline at end of file
diff --git a/hugo/layouts/baseof.html b/hugo/layouts/baseof.html
new file mode 100644
index 0000000..6e73078
--- /dev/null
+++ b/hugo/layouts/baseof.html
@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<html class="no-js" lang="de">
+	<head>
+		<meta charset="utf-8">
+		<meta http-equiv="x-ua-compatible" content="ie=edge">
+		<title>{{ block "title" . }}{{ .Site.Title }}{{ end }}</title>
+		{{ with .Params.description -}}
+			<meta name="description" content="{{ . }}">
+		{{- end }}
+		<meta name="author" content="Stefan Mühlinghaus">
+		<meta name="viewport" content="initial-scale=1, user-scalable=no">
+		<link rel="icon" type="image/vnd.microsoft.icon" href="/img/favicon.ico">
+		{{ block "htmlheadbefore" . }}{{ end }}
+		<link rel="preload" href="/css/main.css" as="style">
+		<link rel="stylesheet" href="/css/main.css">
+		<script>(function(H){H.className=H.className.replace(/\bno-js\b/,'js')})(document.documentElement)</script>
+		<script defer src="/js/menu.js"></script>
+		{{ block "htmlheadafter" . }}{{ end }}
+	</head>
+	<body>
+		<!--[if lt IE 8]><p class="browsehappy">Sie benutzen einen <strong>veralteten</strong> Browser. Bitte <a href="http://browsehappy.com/">aktualisieren Sie Ihren Browser</a> um Ihre Erfahrung auf alphabreed zu verbessern. <![endif]-->
+		<header>
+			<a href="/" title="alphabreed Startseite"> <img src="/img/alphabreed.png" alt="alphabreed"></a>
+			<nav>
+				<ul>
+					{{- $page := . }}
+					{{- range site.Menus.main }}
+						{{- if $page.IsMenuCurrent .Menu . }}
+							<li class="active"><a href="{{.URL}}">{{.Name}}</a></li>
+						{{- else if $page.HasMenuCurrent .Menu . }}
+							<li class="active"><a href="{{.URL}}">{{.Name}}</a></li>
+						{{- else }}
+							<li><a href="{{.URL}}">{{.Name}}</a></li>
+						{{- end }}
+					{{- end }}
+				</ul>
+			</nav>
+		</header>
+		<div id="main">
+			{{ block "main" . }}{{ .Content }}{{ end }}
+		</div>
+	</body>
+</html>
\ No newline at end of file
diff --git a/hugo/layouts/bookmarks/all.html b/hugo/layouts/bookmarks/all.html
new file mode 100644
index 0000000..9814055
--- /dev/null
+++ b/hugo/layouts/bookmarks/all.html
@@ -0,0 +1,3 @@
+{{ define "title" }}
+	{{- .Title }} :: {{ .Site.Title -}}
+{{ end }}
\ No newline at end of file
diff --git a/hugo/layouts/bookmarks/baseof.html b/hugo/layouts/bookmarks/baseof.html
new file mode 100644
index 0000000..5b3b4c5
--- /dev/null
+++ b/hugo/layouts/bookmarks/baseof.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html class="no-js" lang="de">
+	<head>
+		<meta charset="utf-8">
+		<meta http-equiv="x-ua-compatible" content="ie=edge">
+		<title>{{ block "title" . }}{{ .Site.Title }}{{ end }}</title>
+		<meta name="author" content="Stefan Mühlinghaus">
+		<meta name="viewport" content="initial-scale=1, user-scalable=no">
+		<link rel="icon" type="image/vnd.microsoft.icon" href="/img/favicon-bookmarks.ico">
+		<link rel="preload" href="/css/bookmarks.css" as="style">
+		<link rel="stylesheet" href="/css/bookmarks.css">
+		<script>(function(H){H.className=H.className.replace(/\bno-js\b/,'js')})(document.documentElement)</script>
+		<script defer src="/js/alpine-alphabreed.js"></script>
+		<script defer src="/js/alpine-3.15.3.min.js"></script>
+	</head>
+	<body>
+		{{ block "main" . }}{{ .Content }}{{ end }}
+	</body>
+</html>
diff --git a/hugo/layouts/comics/comiclist.html b/hugo/layouts/comics/comiclist.html
new file mode 100644
index 0000000..34aead6
--- /dev/null
+++ b/hugo/layouts/comics/comiclist.html
@@ -0,0 +1,9 @@
+{{ define "main" }}
+	{{ .Content }}
+	{{ range .Pages }}
+		<div class="box">
+			<h2><a href="{{ .RelPermalink }}">{{ .Title }}</a></h2>
+			<p>{{ .Description }}</p>
+		</div>
+	{{ end }}
+{{ end }}
\ No newline at end of file
diff --git a/hugo/layouts/comics/list.html b/hugo/layouts/comics/list.html
new file mode 100644
index 0000000..6a3985d
--- /dev/null
+++ b/hugo/layouts/comics/list.html
@@ -0,0 +1,44 @@
+{{ define "title" }}{{ .Title }}, Seite 1 :: {{ .Site.Title }}{{ end }}
+
+{{ define "htmlheadbefore" }}
+	{{ $images := .Resources.ByType "image" }}
+	{{ $imageCount := len $images }}
+	{{ $firstImage := index $images 0 }}
+	<link rel="preload" href="{{ $firstImage.RelPermalink }}" as="image">
+	{{ if gt $imageCount 1 }}
+		<link rel="next" href="2/">
+	{{ end }}
+	{{ partial "comicpageslide.html" . }}
+{{ end }}
+
+{{ define "main" }}
+	{{ $images := .Resources.ByType "image" }}
+	{{ $imageCount := len $images }}
+	{{ $firstImage := index $images 0 }}
+	<h1>{{ .Title }}, Seite 1</h1>
+	<nav class="comicnav">
+		<span></span>
+		<span></span>
+		{{ if gt $imageCount 1 }}
+			<a class="next" href="2/">Weiter</a>
+			<a class="last" href="{{ $imageCount }}/">Ende</a>
+		{{ else }}
+			<span></span>
+			<span></span>
+		{{ end }}
+	</nav>	
+	<div id="comicpage">
+		<img src="{{ $firstImage.RelPermalink }}">
+	</div>
+	<nav class="comicnav">
+		<span></span>
+		<span></span>
+		{{ if gt $imageCount 1 }}
+			<a class="next" href="2/">Weiter</a>
+			<a class="last" href="{{ $imageCount }}/">Ende</a>
+		{{ else }}
+			<span></span>
+			<span></span>
+		{{ end }}
+	</nav>
+{{ end }}
\ No newline at end of file
diff --git a/hugo/layouts/comics/single.html b/hugo/layouts/comics/single.html
new file mode 100644
index 0000000..ed0147c
--- /dev/null
+++ b/hugo/layouts/comics/single.html
@@ -0,0 +1,36 @@
+{{ define "_partials/comicnav.html" }}
+<nav class="comicnav">
+	<a class="first" href="../">Anfang</a>
+	<a class="prev" href="{{ .Params.prev }}">Zurück</a>
+	{{ if .Params.next }}
+		<a class="next" href="{{ .Params.next }}">Weiter</a>
+	{{ else }}
+		<span></span>
+	{{ end }}
+	{{ if .Params.last }}
+		<a class="last" href="{{ .Params.last }}">Ende</a>
+	{{ else }}
+		<span></span>
+	{{ end }}
+</nav>
+{{ end }}
+
+{{ define "title" }}{{ .Title }} :: {{ .Site.Title }}{{ end }}
+
+{{ define "htmlheadbefore" }}
+	<link rel="preload" href="../{{ .Params.image }}" as="image">
+	<link rel="prev" href="{{ .Params.prev }}">
+	{{ if .Params.next }}
+		<link rel="next" href="{{ .Params.next }}">
+	{{ end }}
+	{{ partial "comicpageslide.html" . }}
+{{ end }}
+
+{{ define "main" }}
+	<h1>{{ .Title }}</h1>
+	{{ partial "comicnav.html" . }}
+	<div id="comicpage">
+		<img src="../{{ .Params.image }}">
+	</div>
+	{{ partial "comicnav.html" . }}
+{{ end }}
\ No newline at end of file
diff --git a/hugo/layouts/gameplays/gameplaylist.html b/hugo/layouts/gameplays/gameplaylist.html
new file mode 100644
index 0000000..3ddf97c
--- /dev/null
+++ b/hugo/layouts/gameplays/gameplaylist.html
@@ -0,0 +1,11 @@
+{{ define "main" }}
+	<nav class="submenu box">
+		<h2>Bereiche:</h2>
+		<ul>
+			{{ range .Pages }}
+				<li><a href="{{ .RelPermalink }}">{{ .Title }}</a></li>
+			{{ end }}
+		</ul>
+	</nav>
+	{{ .Content }}
+{{ end }}
\ No newline at end of file
diff --git a/hugo/layouts/gameplays/list.html b/hugo/layouts/gameplays/list.html
new file mode 100644
index 0000000..26b3cab
--- /dev/null
+++ b/hugo/layouts/gameplays/list.html
@@ -0,0 +1,47 @@
+{{ define "title" }}{{ .Params.fullname }}, Folge 1 :: {{ .Site.Title }}{{ end }}
+
+{{ define "main" }}
+	{{ $episodes := .Params.episodes }}
+	{{ $episodeCount := len $episodes }}
+	{{ $firstEpisode := index $episodes 0 }}
+	{{ $gameplayPage := . }}
+	<nav class="submenu box">
+		<h2>Bereiche:</h2>
+		<ul>
+			{{ range .Parent.Pages }}
+				{{ if .Eq $gameplayPage }}
+					<li class="active">
+				{{ else }}
+					<li>
+				{{ end }}
+					<a href="{{ .RelPermalink }}">{{ .Title }}</a>
+				</li>
+			{{ end }}
+		</ul>
+	</nav>
+	<h1>{{ .Params.fullname }}</h1>
+	{{ if $firstEpisode.title }}
+		<h2>{{ $firstEpisode.title }}</h2>
+	{{ end }}
+	{{ if $firstEpisode.description }}
+		<p>{{ $firstEpisode.description }}</p>
+	{{ end }}
+	<p><video src="{{ $firstEpisode.video }}" type="video/mp4" playsinline controls style="width:100%; aspect-ratio:16 / 9; display:block;"></video></p>
+	{{ if gt $episodeCount 1 }}
+		<div class="box videos">
+			{{ range $index, $episode := $episodes }}
+				{{ $episodeNum := math.Add $index 1 }}
+				{{ if eq $index 0 }}
+					<div class="active">
+						<a href="./">Folge 01 – {{ $episode.title }}</a>
+					</div>
+				{{ else }}
+					<div>
+						<a href="{{ $episodeNum }}/">Folge {{ printf "%02d" $episodeNum }} – {{ $episode.title }}</a>
+					</div>
+				{{ end }}
+			{{ end }}
+		</div>
+	{{ end }}
+	{{ .Content }}
+{{ end }}
\ No newline at end of file
diff --git a/hugo/layouts/gameplays/single.html b/hugo/layouts/gameplays/single.html
new file mode 100644
index 0000000..68f249c
--- /dev/null
+++ b/hugo/layouts/gameplays/single.html
@@ -0,0 +1,54 @@
+{{ define "title" }}{{ .Title }} :: {{ .Site.Title }}{{ end }}
+
+{{ define "main" }}
+	{{ $episodes := .Params.episodes }}
+	{{ $episodeCount := len $episodes }}
+	{{ $episodeIndex := .Params.index }}
+	{{ $gameplayPage := .Parent }}
+	<nav class="submenu box">
+		<h2>Bereiche:</h2>
+		<ul>
+			{{ range .Parent.Parent.Pages }}
+				{{ if .Eq $gameplayPage }}
+					<li class="active">
+				{{ else }}
+					<li>
+				{{ end }}
+					<a href="{{ .RelPermalink }}">{{ .Title }}</a>
+				</li>
+			{{ end }}
+		</ul>
+	</nav>
+	<h1>{{ .Params.gameplay }}</h1>
+	{{ if .Params.name }}
+		<h2>{{ .Params.name }}</h2>
+	{{ end }}
+	<p>{{ .Description }}</p>
+	<p><video src="{{ .Params.video }}" type="video/mp4" playsinline controls style="width:100%; aspect-ratio:16 / 9; display:block;"></video></p>
+	{{ if gt $episodeCount 1 }}
+		<div class="box videos">
+			{{ range $index, $episode := $episodes }}
+				{{ $episodeNum := math.Add $index 1 }}
+				{{ $isCurrent := eq $index $episodeIndex }}
+				{{ if eq $index 0 }}
+					{{ if $isCurrent }}
+						<div class="active">
+					{{ else }}
+						<div>
+					{{ end }}
+						<a href="../">Folge 01 – {{ $episode.title }}</a>
+					</div>
+				{{ else }}
+					{{ if $isCurrent }}
+						<div class="active">
+					{{ else }}
+						<div>
+					{{ end }}
+						<a href="../{{ $episodeNum }}/">Folge {{ printf "%02d" $episodeNum }} – {{ $episode.title }}</a>
+					</div>
+				{{ end }}
+			{{ end }}
+		</div>
+	{{ end }}
+	{{ .Content }}
+{{ end }}
\ No newline at end of file
diff --git a/hugo/layouts/home.html b/hugo/layouts/home.html
new file mode 100644
index 0000000..cff89c9
--- /dev/null
+++ b/hugo/layouts/home.html
@@ -0,0 +1,3 @@
+{{ define "main" }}
+	{{ .Content }}
+{{ end }}
\ No newline at end of file
diff --git a/hugo/layouts/if/all.html b/hugo/layouts/if/all.html
new file mode 100644
index 0000000..00642ec
--- /dev/null
+++ b/hugo/layouts/if/all.html
@@ -0,0 +1,19 @@
+{{ define "title" }}
+	{{- .Title }} :: {{ .Site.Title -}}
+{{ end }}
+{{ define "main" }}
+	<nav class="submenu box">
+		<h2>Bereiche:</h2>
+		<ul>
+			{{- $page := . }}
+			{{- range site.Menus.if }}
+				{{- if $page.IsMenuCurrent .Menu . }}
+					<li class="active"><a href="{{.URL}}">{{.Name}}</a></li>
+				{{- else }}
+					<li><a href="{{.URL}}">{{.Name}}</a></li>
+				{{- end }}
+			{{- end }}
+		</ul>
+	</nav>
+	{{ .Content }}
+{{ end }}
\ No newline at end of file
diff --git a/hugo/layouts/login/baseof.html b/hugo/layouts/login/baseof.html
new file mode 100644
index 0000000..6e13059
--- /dev/null
+++ b/hugo/layouts/login/baseof.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html class="no-js" lang="de">
+	<head>
+		<meta charset="utf-8">
+		<meta http-equiv="x-ua-compatible" content="ie=edge">
+		<title>{{ block "title" . }}{{ .Site.Title }}{{ end }}</title>
+		{{ with .Params.description -}}
+			<meta name="description" content="{{ . }}">
+		{{- end }}
+		<meta name="author" content="Stefan Mühlinghaus">
+		<meta name="viewport" content="initial-scale=1, user-scalable=no">
+		<link rel="icon" type="image/vnd.microsoft.icon" href="/img/favicon.ico">
+		<link rel="preload" href="/css/pico-2.1.1.min.css" as="style">
+		<link rel="stylesheet" href="/css/pico-2.1.1.min.css">
+		<script>(function(H){H.className=H.className.replace(/\bno-js\b/,'js')})(document.documentElement)</script>
+		<script defer src="/js/alpine-3.15.3.min.js"></script>
+	</head>
+	<body>
+		<main class="container">
+			{{ .Content }}
+		</main>
+	</body>
+</html>
\ No newline at end of file
diff --git a/hugo/layouts/notes/baseof.html b/hugo/layouts/notes/baseof.html
new file mode 100644
index 0000000..02b938f
--- /dev/null
+++ b/hugo/layouts/notes/baseof.html
@@ -0,0 +1,57 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<meta charset="utf-8">
+		<meta http-equiv="x-ua-compatible" content="ie=edge">
+		<title>{{ block "title" . }}{{ .Site.Title }}{{ end }}</title>
+		<meta name="author" content="Stefan Mühlinghaus">
+		<meta name="viewport" content="initial-scale=1, user-scalable=no">
+		<meta name="apple-mobile-web-app-status-bar-style" content="black">
+		<meta name="theme-color" content="#222">
+		<meta name="robots" content="noindex, nofollow">
+		<link rel="icon" type="image/vnd.microsoft.icon" href="/img/favicon-notes.ico">
+		<script defer src="/js/alpine-alphabreed.js"></script>
+		<script defer src="/js/alpine-3.15.3.min.js"></script>
+		<style>
+			:root {
+				--color-hl: #a19bff;
+				--color-bg: #ccc;
+				--color-fg: #333;
+				--color-cs: black;
+			}
+			@media (prefers-color-scheme: dark) {
+				:root {
+					--color-fg: #ccc;
+					--color-bg: #333;
+					--color-cs: white;
+				}
+			}
+			::selection {
+				background-color:var(--color-hl); color:#333;
+			}
+			html, body, form, textarea { padding:0; margin:0;
+				height:100%; }
+			html { background-color:var(--color-bg); color:var(--color-fg);
+				caret-color:var(--color-cs); font-family:monospace;
+				font-size:15px; }
+			main { height:100%; }
+			textarea { border:none; padding:20px; width:100%;
+				font-family:inherit; box-sizing:border-box; resize:none;
+				background-color:inherit; color:inherit;
+				font-size:inherit; outline:none; }
+			#pending { position:fixed; top:10px; right:10px; width:20px;
+				height:20px; border:3px solid transparent; border-radius:20px; 
+				border-color:var(--color-hl) var(--color-hl) transparent transparent;
+				opacity:0; transition:opacity 0.5s; transition-delay:0.5s;
+				animation:0.7s linear infinite rotate; }
+			#pending.show { opacity:1; }
+			@keyframes rotate {
+				from { transform:rotate(0deg); }
+				to { transform:rotate(359deg); }
+			}
+		</style>
+	</head>
+	<body>
+		{{ .Content }}
+	</body>
+</html>
diff --git a/hugo/layouts/single.html b/hugo/layouts/single.html
new file mode 100644
index 0000000..9a301f6
--- /dev/null
+++ b/hugo/layouts/single.html
@@ -0,0 +1,6 @@
+{{ define "title" }}
+	{{- .Title }} :: {{ .Site.Title -}}
+{{ end }}
+{{ define "main" }}
+	{{ .Content }}
+{{ end }}
\ No newline at end of file
diff --git a/hugo/static/css/bookmarks.css b/hugo/static/css/bookmarks.css
new file mode 100644
index 0000000..40b1211
--- /dev/null
+++ b/hugo/static/css/bookmarks.css
@@ -0,0 +1,114 @@
+:root {
+  --color-hl: #a19bff;
+  --color-fg: #333;
+  --color-fg2: #666;
+  --color-bg: #ccc;
+  --color-bg2: #999;
+}
+
+@media (prefers-color-scheme: dark) {
+  :root {
+    --color-fg: #ccc;
+    --color-fg2: #999;
+    --color-bg: #333;
+    --color-bg2: #666;
+  }
+}
+
+::selection {
+  background-color:var(--color-hl); color:#333;
+}
+
+html { overflow-y:scroll; background-color:var(--color-bg); }
+body { padding:4vw; margin:0; font-family:sans-serif;
+  color:var(--color-fg); accent-clor:var(--color-hl); position:relative; }
+a { color:inherit; text-decoration:none; -webkit-user-select:none;
+  -moz-user-select:none; -ms-user-select:none; user-select:none; }
+.edit { display:block; color:var(--color-hl); text-align:center; text-decoration:none;
+  width:30px; line-height:30px; display:block; transition:all 0.2s;
+  cursor:pointer; margin:0; padding:0; position:absolute; top:0; right:0;
+  border-radius:100px; }
+.edit:hover { color:var(--color-bg); background:var(--color-hl);
+  text-decoration:none; }
+.category { overflow:hidden; }
+.category h1 { font-size:15px; margin:0; line-height:30px; outline:none;
+  position:relative; padding:0 35px 0 0;
+  border-bottom:1px solid var(--color-fg); }
+.category h1 a:hover { text-decoration:none; }
+.category .title { cursor:pointer; transition:color 0.2s; }
+.category .title:hover { color:var(--color-hl); }
+.category .badge { display:inline-block; font-weight:normal;
+  font-size:8px; padding:0 5px; border:1px solid var(--color-bg2);
+  border-radius:100px; line-height:14px; text-align:center;
+  min-width:11px; margin-left:10px; vertical-align:middle;
+  color:var(--color-fg2); font-family:monospace; }
+.bookmarks { display:none; list-style:none; margin:0; padding:30px 0; }
+.category.open .bookmarks { display:block; }
+.bookmark { display:block; padding:0; position:relative;
+  border-bottom:1px dotted var(--color-bg2); }
+.bookmark .link { color:inherit; display:block; min-height:20px;
+  line-height:20px; padding:2px 0; }
+.bookmark .link:hover { background-color:#ffffff0f; }
+.bookmark .editicon { width:20px; height:20px; float:left;
+  margin-right:5px; border-radius:2px; position:relative;
+  cursor:pointer; margin-top:2px; transition:all 0.2s; }
+.bookmark .editicon img { width:16px; height:16px; position:absolute;
+  top:2px; left:2px; }
+.bookmark .editicon:hover { background-color:var(--color-hl); }
+button,
+.button { display:inline-block; padding:5px 20px; text-decoration:none;
+  color:var(--color-fg); background:transparent; font-size:inherit;
+  border:1px solid var(--color-fg); cursor:pointer; transition:all 0.2s;
+  -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none;
+  user-selct:none; }
+button:hover,
+.button:hover { color:var(--color-hl); border-color:var(--color-hl); }
+.buttons { margin-top:20px; }
+
+#slidein { position:fixed; top:0; right:0; width:300px; height:100%;
+  transform:translateX(100%); transition:transform 0.3s;
+  background:rgba(0,0,0,0.2); backdrop-filter:blur(10px); }
+#slidein.open { transform:translateX(0); }
+#slidein .closer { position:absolute; top:10px; right:10px; width:30px;
+  height:30px; cursor:pointer; }
+#slidein .closer:before,
+#slidein .closer:after { display:block; content:""; width:30px;
+  height:1px; background:var(--color-fg); position:absolute; top:50%;
+  left:0; }
+#slidein .closer:before { transform:rotate(45deg); }
+#slidein .closer:after { transform:rotate(-45deg); }
+#slidein .inner { padding:50px 20px 20px 20px; color:var(--color-fg); }
+
+.field label { display:block; margin:10px 0 3px 0; }
+.field label:after { display:inline; content:":"; }
+.field input[type="text"],
+.field select { display:block; width:100%; box-sizing:border-box;
+  padding:3px 5px; border:1px solid var(--color-fg);
+  color:var(--color-fg); background:var(--color-bg); font-size:inherit; }
+
+#favlet { position:absolute; top:10px; right:10px; color:var(--color-bg2);
+  text-decoration:none; font-size:10px; cursor:pointer;
+  transition:color 0.2s; }
+#favlet:hover { color:var(--color-hl); }
+.favletcode { word-break:break-all; }
+
+#addcontent { padding:5vw; }
+
+/*
+@media screen and (min-width:500px) {
+  .categories { margin:-10px; }
+  .categories:after { display:table; content:""; clear:left; }
+  .category { float:left; width:50%; box-sizing:border-box; padding:0 10px; }
+  .category:nth-of-type(2n+1) { clear:left; }
+}
+@media screen and (min-width:750px) {
+  .category { width:33.33%; }
+  .category:nth-of-type(2n+1) { clear:none; }
+  .category:nth-of-type(3n+1) { clear:left; }
+}
+@media screen and (min-width:1000px) {
+  .category { width:25%; }
+  .category:nth-of-type(3n+1) { clear:none; }
+  .category:nth-of-type(4n+1) { clear:left; }
+}
+*/
\ No newline at end of file
diff --git a/hugo/static/css/main.css b/hugo/static/css/main.css
new file mode 100644
index 0000000..7aa3dd2
--- /dev/null
+++ b/hugo/static/css/main.css
@@ -0,0 +1,35 @@
+/*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace, monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type="button"],[type="reset"],[type="submit"],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{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}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-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}/*! Copyright 2018 Stefan Mühlinghaus */a,a:active,a:visited{color:#aaa;transition:color 0.3s, text-shadow 0.3s}a{text-decoration:underline}a:hover{color:#7df9ff;text-shadow:0px 0px 3px #7df9ff}img{max-width:100%;height:auto}h1,h2,h3{font-weight:normal}h1{font-variant:small-caps;font-size:200%;margin:1em 0 1ex 0;color:#318ce7;border-bottom:1px dotted #318ce7}h2{font-variant:small-caps;font-size:130%;margin:2em 0 0.5ex 0;color:#fff}h3{text-transform:uppercase;margin:2em 0 0.5ex 0;color:#fff}h1:first-child,h2:first-child,h3:first-child{margin-top:0}p{margin-bottom:1ex}table{margin:2em 0;border-top:1px solid #ccc;border-collapse:collapse}table tr{border-top:1px solid #777}table tr td,table tr th{padding:5px 10px}table tr th{background-color:rgba(49,140,231,0.2);font-weight:bold;text-align:left}hr{border:none;border-top:1px solid #318ce7;margin:40px 0}blockquote{margin:20px 0;padding:0 20px;border-left:2px solid #318ce7}html{height:100%;background-color:#222}body{font-family:Arial,Helvetica,sans-serif;color:#ccc;overflow-y:scroll;height:100%;background:#222;background:-moz-linear-gradient(top, #333 0, #222 500px);background:-webkit-gradient(linear, left top, left bottom, color-stop(0, #333), color-stop(500px, #222));background:-webkit-linear-gradient(top, #333 0, #222 500px);background:-o-linear-gradient(top, #333 0, #222 500px);background:-ms-linear-gradient(top, #333 0, #222 500px);background:linear-gradient(to bottom, #333 0, #222 500px);filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#333', endColorstr='#222',GradientType=0 )}header{box-sizing:border-box;padding:15px 30px;background-color:rgba(60,60,60,0.95);-webkit-box-shadow:0px -10px 31px 9px rgba(0,0,0,0.75);-moz-box-shadow:0px -10px 31px 9px rgba(0,0,0,0.75);box-shadow:0px -10px 31px 9px rgba(0,0,0,0.75);background:#222222;background:-moz-linear-gradient(top, #222 0%, #333 100%);background:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #222), color-stop(100%, #333));background:-webkit-linear-gradient(top, #222 0%, #333 100%);background:-o-linear-gradient(top, #222 0%, #333 100%);background:-ms-linear-gradient(top, #222 0%, #333 100%);background:linear-gradient(to bottom, #222 0%, #333 100%);filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#222222', endColorstr='#333333',GradientType=0 )}header img{height:30px;width:auto}header>a{display:block;text-align:center;font-size:0}html.js header nav{display:none;margin-top:15px}html.js header nav.open{display:block}header nav ul{margin:0;padding:0;list-style-type:none}header nav ul li{text-transform:uppercase;line-height:30px}header nav ul li a,header nav ul li a:visited{display:block;text-align:center;text-transform:uppercase;line-height:30px;text-decoration:none;color:#aaa;transition:color 0.3s, text-shadow 0.3s;white-space:nowrap}header nav ul li span,header nav ul li a:hover{text-shadow:0px 0px 5px #7df9ff;color:#7df9ff}header nav ul li span{cursor:default}header nav ul li.active a{text-shadow:0px 0px 5px #7df9ff;color:#7df9ff}@media (min-width: 800px){header{height:60px}header>a{margin-bottom:0}header img{float:left}header nav{float:right}html.js header nav{display:block;margin-top:0}header nav ul li{display:inline;margin-left:0.5em}header nav ul li a,header nav ul li a:visited{display:inline}}#hamburger{position:absolute;top:15px;right:20px;width:30px;height:30px}#hamburger div{position:absolute;top:50%;left:0;width:30px;height:2px;background-color:#318ce7;transform-origin:50% 50%;transition:all 0.2s}#hamburger .top{transform:translateY(-10px)}#hamburger .bottom{transform:translateY(10px)}#hamburger.open .top{transform:rotate(45deg)}#hamburger.open .bottom{transform:rotate(-45deg)}#hamburger.open .middle{transform:scaleX(0)}@media (min-width: 800px){#hamburger{display:none}}#main{max-width:800px;margin:0 auto;padding:30px 20px}.box{margin:1.5em 0;background-color:rgba(49,140,231,0.2);padding:1ex 3ex;border-radius:5px}.box h2{margin-top:0;color:#fff}.box h2 a{color:#fff}.submenu ul{margin:0;padding:0}.submenu ul li{display:inline-block;margin-right:1em;margin-bottom:0.3em;white-space:nowrap}.submenu ul li a{text-transform:uppercase;color:#aaa;font-size:90%;text-decoration:none}.submenu ul li a:hover,.submenu ul li.active a{text-shadow:0px 0px 5px #7df9ff;color:#7df9ff}#story{transition:all 0.5s;margin-top:20px}#story .headline{text-align:center;font-size:250%;margin-bottom:0;font-variant:small-caps;color:white}#story .subline{text-align:center;font-size:80%;color:#888;text-transform:uppercase;margin-bottom:0.5ex}#story h1{font-size:180%;margin:2em 0 1ex 0;font-variant:small-caps;color:#777;border-bottom:1px dotted #777}#story p{margin:0;line-height:140%;text-indent:1em;font-family:monospace;font-size:120%}@media (min-width: 800px){#story p{text-align:justify}}#story hr{border:none;background:url(../img/storyseparator.png) 50% top no-repeat;height:19px;margin:30px 0}#story .image{width:400px;margin:30px auto}#story .image img{width:100%;height:auto}#story .page{padding:20px;margin:0 20px 30px 20px;float:left;cursor:pointer;transition:opacity 0.5s}#story .page h2{margin-top:200px}#story .page h4{margin-top:20px}.comicnav{text-align:center;margin:20px 0}.comicnav a{display:inline-block;width:50px;height:30px;margin:0 10px;background-image:url(../img/comicnav.svg);background-repeat:no-repeat;transition:all 0.2s;overflow:hidden;color:transparent;text-shadow:none !important;font-size:0}.comicnav span{display:inline-block;width:50px;height:30px;margin:0 10px;font-size:0}.comicnav .first{background-position:0 0}.comicnav .prev{background-position:-50px 0}.comicnav .next{background-position:-100px 0}.comicnav .last{background-position:-150px 0}#comicpage{text-align:center;view-transition-name:comicpage}#comicpage img{transition:all 0.4s}#comicpage .outleft{opacity:0;transform:translateX(-200px)}#comicpage .outright{opacity:0;transform:translateX(200px)}
+
+.videos > div { padding:2px 0; } .videos a { text-decoration:none; } .videos .active a { text-decoration:none; text-shadow:0 0 5px #7df9ff; color:#7df9ff; }
+
+@keyframes fade-out-down {
+	from { transform: scale3d(1, 1, 1); opacity:1; }
+	to { transform: scale3d(0.7, 0.7, 0.7); opacity:0; }
+}
+@keyframes fade-in-left {
+	from { transform: translateX(-50%); opacity:0; }
+	to { transform: translateX(0%); opacity:1; }
+}
+@keyframes fade-in-right {
+	from { transform: translateX(50%); opacity:0; }
+	to { transform: translateX(0%); opacity:1; }
+}
+@view-transition {
+	navigation: auto;
+}
+::view-transition-old(comicpage),
+::view-transition-new(comicpage) {
+  animation-duration: 0.4s;
+  animation-fill-mode: both;
+  animation-timing-function: ease;
+}
+:root.forward::view-transition-old(comicpage),
+:root.back::view-transition-old(comicpage) {
+	animation-name: fade-out-down;
+}
+:root.forward::view-transition-new(comicpage) {
+	animation-name: fade-in-right;
+}
+:root.back::view-transition-new(comicpage) {
+	animation-name: fade-in-left;
+}
diff --git a/hugo/static/css/pico-2.1.1.min.css b/hugo/static/css/pico-2.1.1.min.css
new file mode 100644
index 0000000..e10ec26
--- /dev/null
+++ b/hugo/static/css/pico-2.1.1.min.css
@@ -0,0 +1,4 @@
+@charset "UTF-8";/*!
+ * Pico CSS ✨ v2.1.1 (https://picocss.com)
+ * Copyright 2019-2025 - Licensed under MIT
+ */:host,:root{--pico-font-family-emoji:"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--pico-font-family-sans-serif:system-ui,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,Helvetica,Arial,"Helvetica Neue",sans-serif,var(--pico-font-family-emoji);--pico-font-family-monospace:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace,var(--pico-font-family-emoji);--pico-font-family:var(--pico-font-family-sans-serif);--pico-line-height:1.5;--pico-font-weight:400;--pico-font-size:100%;--pico-text-underline-offset:0.1rem;--pico-border-radius:0.25rem;--pico-border-width:0.0625rem;--pico-outline-width:0.125rem;--pico-transition:0.2s ease-in-out;--pico-spacing:1rem;--pico-typography-spacing-vertical:1rem;--pico-block-spacing-vertical:var(--pico-spacing);--pico-block-spacing-horizontal:var(--pico-spacing);--pico-grid-column-gap:var(--pico-spacing);--pico-grid-row-gap:var(--pico-spacing);--pico-form-element-spacing-vertical:0.75rem;--pico-form-element-spacing-horizontal:1rem;--pico-group-box-shadow:0 0 0 rgba(0, 0, 0, 0);--pico-group-box-shadow-focus-with-button:0 0 0 var(--pico-outline-width) var(--pico-primary-focus);--pico-group-box-shadow-focus-with-input:0 0 0 0.0625rem var(--pico-form-element-border-color);--pico-modal-overlay-backdrop-filter:blur(0.375rem);--pico-nav-element-spacing-vertical:1rem;--pico-nav-element-spacing-horizontal:0.5rem;--pico-nav-link-spacing-vertical:0.5rem;--pico-nav-link-spacing-horizontal:0.5rem;--pico-nav-breadcrumb-divider:">";--pico-icon-checkbox:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(255, 255, 255)' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");--pico-icon-minus:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(255, 255, 255)' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");--pico-icon-chevron:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(136, 145, 164)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");--pico-icon-date:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(136, 145, 164)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");--pico-icon-time:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(136, 145, 164)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");--pico-icon-search:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(136, 145, 164)' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");--pico-icon-close:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(136, 145, 164)' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E");--pico-icon-loading:url("data:image/svg+xml,%3Csvg fill='none' height='24' width='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E g %7B animation: rotate 2s linear infinite; transform-origin: center center; %7D circle %7B stroke-dasharray: 75,100; stroke-dashoffset: -5; animation: dash 1.5s ease-in-out infinite; stroke-linecap: round; %7D @keyframes rotate %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D @keyframes dash %7B 0%25 %7B stroke-dasharray: 1,100; stroke-dashoffset: 0; %7D 50%25 %7B stroke-dasharray: 44.5,100; stroke-dashoffset: -17.5; %7D 100%25 %7B stroke-dasharray: 44.5,100; stroke-dashoffset: -62; %7D %7D %3C/style%3E%3Cg%3E%3Ccircle cx='12' cy='12' r='10' fill='none' stroke='rgb(136, 145, 164)' stroke-width='4' /%3E%3C/g%3E%3C/svg%3E")}@media (min-width:576px){:host,:root{--pico-font-size:106.25%}}@media (min-width:768px){:host,:root{--pico-font-size:112.5%}}@media (min-width:1024px){:host,:root{--pico-font-size:118.75%}}@media (min-width:1280px){:host,:root{--pico-font-size:125%}}@media (min-width:1536px){:host,:root{--pico-font-size:131.25%}}a{--pico-text-decoration:underline}a.contrast,a.secondary{--pico-text-decoration:underline}small{--pico-font-size:0.875em}h1,h2,h3,h4,h5,h6{--pico-font-weight:700}h1{--pico-font-size:2rem;--pico-line-height:1.125;--pico-typography-spacing-top:3rem}h2{--pico-font-size:1.75rem;--pico-line-height:1.15;--pico-typography-spacing-top:2.625rem}h3{--pico-font-size:1.5rem;--pico-line-height:1.175;--pico-typography-spacing-top:2.25rem}h4{--pico-font-size:1.25rem;--pico-line-height:1.2;--pico-typography-spacing-top:1.874rem}h5{--pico-font-size:1.125rem;--pico-line-height:1.225;--pico-typography-spacing-top:1.6875rem}h6{--pico-font-size:1rem;--pico-line-height:1.25;--pico-typography-spacing-top:1.5rem}tfoot td,tfoot th,thead td,thead th{--pico-font-weight:600;--pico-border-width:0.1875rem}code,kbd,pre,samp{--pico-font-family:var(--pico-font-family-monospace)}kbd{--pico-font-weight:bolder}:where(select,textarea),input:not([type=submit],[type=button],[type=reset],[type=checkbox],[type=radio],[type=file]){--pico-outline-width:0.0625rem}[type=search]{--pico-border-radius:5rem}[type=checkbox],[type=radio]{--pico-border-width:0.125rem}[type=checkbox][role=switch]{--pico-border-width:0.1875rem}details.dropdown summary:not([role=button]){--pico-outline-width:0.0625rem}nav details.dropdown summary:focus-visible{--pico-outline-width:0.125rem}[role=search]{--pico-border-radius:5rem}[role=group]:has(button.secondary:focus,[type=submit].secondary:focus,[type=button].secondary:focus,[role=button].secondary:focus),[role=search]:has(button.secondary:focus,[type=submit].secondary:focus,[type=button].secondary:focus,[role=button].secondary:focus){--pico-group-box-shadow-focus-with-button:0 0 0 var(--pico-outline-width) var(--pico-secondary-focus)}[role=group]:has(button.contrast:focus,[type=submit].contrast:focus,[type=button].contrast:focus,[role=button].contrast:focus),[role=search]:has(button.contrast:focus,[type=submit].contrast:focus,[type=button].contrast:focus,[role=button].contrast:focus){--pico-group-box-shadow-focus-with-button:0 0 0 var(--pico-outline-width) var(--pico-contrast-focus)}[role=group] [role=button],[role=group] [type=button],[role=group] [type=submit],[role=group] button,[role=search] [role=button],[role=search] [type=button],[role=search] [type=submit],[role=search] button{--pico-form-element-spacing-horizontal:2rem}details summary[role=button]:not(.outline)::after{filter:brightness(0) invert(1)}[aria-busy=true]:not(input,select,textarea):is(button,[type=submit],[type=button],[type=reset],[role=button]):not(.outline)::before{filter:brightness(0) invert(1)}:host(:not([data-theme=dark])),:root:not([data-theme=dark]),[data-theme=light]{color-scheme:light;--pico-background-color:#fff;--pico-color:#373c44;--pico-text-selection-color:rgba(2, 154, 232, 0.25);--pico-muted-color:#646b79;--pico-muted-border-color:rgb(231, 234, 239.5);--pico-primary:#0172ad;--pico-primary-background:#0172ad;--pico-primary-border:var(--pico-primary-background);--pico-primary-underline:rgba(1, 114, 173, 0.5);--pico-primary-hover:#015887;--pico-primary-hover-background:#02659a;--pico-primary-hover-border:var(--pico-primary-hover-background);--pico-primary-hover-underline:var(--pico-primary-hover);--pico-primary-focus:rgba(2, 154, 232, 0.5);--pico-primary-inverse:#fff;--pico-secondary:#5d6b89;--pico-secondary-background:#525f7a;--pico-secondary-border:var(--pico-secondary-background);--pico-secondary-underline:rgba(93, 107, 137, 0.5);--pico-secondary-hover:#48536b;--pico-secondary-hover-background:#48536b;--pico-secondary-hover-border:var(--pico-secondary-hover-background);--pico-secondary-hover-underline:var(--pico-secondary-hover);--pico-secondary-focus:rgba(93, 107, 137, 0.25);--pico-secondary-inverse:#fff;--pico-contrast:#181c25;--pico-contrast-background:#181c25;--pico-contrast-border:var(--pico-contrast-background);--pico-contrast-underline:rgba(24, 28, 37, 0.5);--pico-contrast-hover:#000;--pico-contrast-hover-background:#000;--pico-contrast-hover-border:var(--pico-contrast-hover-background);--pico-contrast-hover-underline:var(--pico-secondary-hover);--pico-contrast-focus:rgba(93, 107, 137, 0.25);--pico-contrast-inverse:#fff;--pico-box-shadow:0.0145rem 0.029rem 0.174rem rgba(129, 145, 181, 0.01698),0.0335rem 0.067rem 0.402rem rgba(129, 145, 181, 0.024),0.0625rem 0.125rem 0.75rem rgba(129, 145, 181, 0.03),0.1125rem 0.225rem 1.35rem rgba(129, 145, 181, 0.036),0.2085rem 0.417rem 2.502rem rgba(129, 145, 181, 0.04302),0.5rem 1rem 6rem rgba(129, 145, 181, 0.06),0 0 0 0.0625rem rgba(129, 145, 181, 0.015);--pico-h1-color:#2d3138;--pico-h2-color:#373c44;--pico-h3-color:#424751;--pico-h4-color:#4d535e;--pico-h5-color:#5c6370;--pico-h6-color:#646b79;--pico-mark-background-color:rgb(252.5, 230.5, 191.5);--pico-mark-color:#0f1114;--pico-ins-color:rgb(28.5, 105.5, 84);--pico-del-color:rgb(136, 56.5, 53);--pico-blockquote-border-color:var(--pico-muted-border-color);--pico-blockquote-footer-color:var(--pico-muted-color);--pico-button-box-shadow:0 0 0 rgba(0, 0, 0, 0);--pico-button-hover-box-shadow:0 0 0 rgba(0, 0, 0, 0);--pico-table-border-color:var(--pico-muted-border-color);--pico-table-row-stripped-background-color:rgba(111, 120, 135, 0.0375);--pico-code-background-color:rgb(243, 244.5, 246.75);--pico-code-color:#646b79;--pico-code-kbd-background-color:var(--pico-color);--pico-code-kbd-color:var(--pico-background-color);--pico-form-element-background-color:rgb(251, 251.5, 252.25);--pico-form-element-selected-background-color:#dfe3eb;--pico-form-element-border-color:#cfd5e2;--pico-form-element-color:#23262c;--pico-form-element-placeholder-color:var(--pico-muted-color);--pico-form-element-active-background-color:#fff;--pico-form-element-active-border-color:var(--pico-primary-border);--pico-form-element-focus-color:var(--pico-primary-border);--pico-form-element-disabled-opacity:0.5;--pico-form-element-invalid-border-color:rgb(183.5, 105.5, 106.5);--pico-form-element-invalid-active-border-color:rgb(200.25, 79.25, 72.25);--pico-form-element-invalid-focus-color:var(--pico-form-element-invalid-active-border-color);--pico-form-element-valid-border-color:rgb(76, 154.5, 137.5);--pico-form-element-valid-active-border-color:rgb(39, 152.75, 118.75);--pico-form-element-valid-focus-color:var(--pico-form-element-valid-active-border-color);--pico-switch-background-color:#bfc7d9;--pico-switch-checked-background-color:var(--pico-primary-background);--pico-switch-color:#fff;--pico-switch-thumb-box-shadow:0 0 0 rgba(0, 0, 0, 0);--pico-range-border-color:#dfe3eb;--pico-range-active-border-color:#bfc7d9;--pico-range-thumb-border-color:var(--pico-background-color);--pico-range-thumb-color:var(--pico-secondary-background);--pico-range-thumb-active-color:var(--pico-primary-background);--pico-accordion-border-color:var(--pico-muted-border-color);--pico-accordion-active-summary-color:var(--pico-primary-hover);--pico-accordion-close-summary-color:var(--pico-color);--pico-accordion-open-summary-color:var(--pico-muted-color);--pico-card-background-color:var(--pico-background-color);--pico-card-border-color:var(--pico-muted-border-color);--pico-card-box-shadow:var(--pico-box-shadow);--pico-card-sectioning-background-color:rgb(251, 251.5, 252.25);--pico-dropdown-background-color:#fff;--pico-dropdown-border-color:#eff1f4;--pico-dropdown-box-shadow:var(--pico-box-shadow);--pico-dropdown-color:var(--pico-color);--pico-dropdown-hover-background-color:#eff1f4;--pico-loading-spinner-opacity:0.5;--pico-modal-overlay-background-color:rgba(232, 234, 237, 0.75);--pico-progress-background-color:#dfe3eb;--pico-progress-color:var(--pico-primary-background);--pico-tooltip-background-color:var(--pico-contrast-background);--pico-tooltip-color:var(--pico-contrast-inverse);--pico-icon-valid:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(76, 154.5, 137.5)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");--pico-icon-invalid:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(200.25, 79.25, 72.25)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E")}:host(:not([data-theme=dark])) input:is([type=submit],[type=button],[type=reset],[type=checkbox],[type=radio],[type=file]),:root:not([data-theme=dark]) input:is([type=submit],[type=button],[type=reset],[type=checkbox],[type=radio],[type=file]),[data-theme=light] input:is([type=submit],[type=button],[type=reset],[type=checkbox],[type=radio],[type=file]){--pico-form-element-focus-color:var(--pico-primary-focus)}@media only screen and (prefers-color-scheme:dark){:host(:not([data-theme])),:root:not([data-theme]){color-scheme:dark;--pico-background-color:rgb(19, 22.5, 30.5);--pico-color:#c2c7d0;--pico-text-selection-color:rgba(1, 170, 255, 0.1875);--pico-muted-color:#7b8495;--pico-muted-border-color:#202632;--pico-primary:#01aaff;--pico-primary-background:#0172ad;--pico-primary-border:var(--pico-primary-background);--pico-primary-underline:rgba(1, 170, 255, 0.5);--pico-primary-hover:#79c0ff;--pico-primary-hover-background:#017fc0;--pico-primary-hover-border:var(--pico-primary-hover-background);--pico-primary-hover-underline:var(--pico-primary-hover);--pico-primary-focus:rgba(1, 170, 255, 0.375);--pico-primary-inverse:#fff;--pico-secondary:#969eaf;--pico-secondary-background:#525f7a;--pico-secondary-border:var(--pico-secondary-background);--pico-secondary-underline:rgba(150, 158, 175, 0.5);--pico-secondary-hover:#b3b9c5;--pico-secondary-hover-background:#5d6b89;--pico-secondary-hover-border:var(--pico-secondary-hover-background);--pico-secondary-hover-underline:var(--pico-secondary-hover);--pico-secondary-focus:rgba(144, 158, 190, 0.25);--pico-secondary-inverse:#fff;--pico-contrast:#dfe3eb;--pico-contrast-background:#eff1f4;--pico-contrast-border:var(--pico-contrast-background);--pico-contrast-underline:rgba(223, 227, 235, 0.5);--pico-contrast-hover:#fff;--pico-contrast-hover-background:#fff;--pico-contrast-hover-border:var(--pico-contrast-hover-background);--pico-contrast-hover-underline:var(--pico-contrast-hover);--pico-contrast-focus:rgba(207, 213, 226, 0.25);--pico-contrast-inverse:#000;--pico-box-shadow:0.0145rem 0.029rem 0.174rem rgba(7, 8.5, 12, 0.01698),0.0335rem 0.067rem 0.402rem rgba(7, 8.5, 12, 0.024),0.0625rem 0.125rem 0.75rem rgba(7, 8.5, 12, 0.03),0.1125rem 0.225rem 1.35rem rgba(7, 8.5, 12, 0.036),0.2085rem 0.417rem 2.502rem rgba(7, 8.5, 12, 0.04302),0.5rem 1rem 6rem rgba(7, 8.5, 12, 0.06),0 0 0 0.0625rem rgba(7, 8.5, 12, 0.015);--pico-h1-color:#f0f1f3;--pico-h2-color:#e0e3e7;--pico-h3-color:#c2c7d0;--pico-h4-color:#b3b9c5;--pico-h5-color:#a4acba;--pico-h6-color:#8891a4;--pico-mark-background-color:#014063;--pico-mark-color:#fff;--pico-ins-color:#62af9a;--pico-del-color:rgb(205.5, 126, 123);--pico-blockquote-border-color:var(--pico-muted-border-color);--pico-blockquote-footer-color:var(--pico-muted-color);--pico-button-box-shadow:0 0 0 rgba(0, 0, 0, 0);--pico-button-hover-box-shadow:0 0 0 rgba(0, 0, 0, 0);--pico-table-border-color:var(--pico-muted-border-color);--pico-table-row-stripped-background-color:rgba(111, 120, 135, 0.0375);--pico-code-background-color:rgb(26, 30.5, 40.25);--pico-code-color:#8891a4;--pico-code-kbd-background-color:var(--pico-color);--pico-code-kbd-color:var(--pico-background-color);--pico-form-element-background-color:rgb(28, 33, 43.5);--pico-form-element-selected-background-color:#2a3140;--pico-form-element-border-color:#2a3140;--pico-form-element-color:#e0e3e7;--pico-form-element-placeholder-color:#8891a4;--pico-form-element-active-background-color:rgb(26, 30.5, 40.25);--pico-form-element-active-border-color:var(--pico-primary-border);--pico-form-element-focus-color:var(--pico-primary-border);--pico-form-element-disabled-opacity:0.5;--pico-form-element-invalid-border-color:rgb(149.5, 74, 80);--pico-form-element-invalid-active-border-color:rgb(183.25, 63.5, 59);--pico-form-element-invalid-focus-color:var(--pico-form-element-invalid-active-border-color);--pico-form-element-valid-border-color:#2a7b6f;--pico-form-element-valid-active-border-color:rgb(22, 137, 105.5);--pico-form-element-valid-focus-color:var(--pico-form-element-valid-active-border-color);--pico-switch-background-color:#333c4e;--pico-switch-checked-background-color:var(--pico-primary-background);--pico-switch-color:#fff;--pico-switch-thumb-box-shadow:0 0 0 rgba(0, 0, 0, 0);--pico-range-border-color:#202632;--pico-range-active-border-color:#2a3140;--pico-range-thumb-border-color:var(--pico-background-color);--pico-range-thumb-color:var(--pico-secondary-background);--pico-range-thumb-active-color:var(--pico-primary-background);--pico-accordion-border-color:var(--pico-muted-border-color);--pico-accordion-active-summary-color:var(--pico-primary-hover);--pico-accordion-close-summary-color:var(--pico-color);--pico-accordion-open-summary-color:var(--pico-muted-color);--pico-card-background-color:#181c25;--pico-card-border-color:var(--pico-card-background-color);--pico-card-box-shadow:var(--pico-box-shadow);--pico-card-sectioning-background-color:rgb(26, 30.5, 40.25);--pico-dropdown-background-color:#181c25;--pico-dropdown-border-color:#202632;--pico-dropdown-box-shadow:var(--pico-box-shadow);--pico-dropdown-color:var(--pico-color);--pico-dropdown-hover-background-color:#202632;--pico-loading-spinner-opacity:0.5;--pico-modal-overlay-background-color:rgba(7.5, 8.5, 10, 0.75);--pico-progress-background-color:#202632;--pico-progress-color:var(--pico-primary-background);--pico-tooltip-background-color:var(--pico-contrast-background);--pico-tooltip-color:var(--pico-contrast-inverse);--pico-icon-valid:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(42, 123, 111)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");--pico-icon-invalid:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(149.5, 74, 80)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E")}:host(:not([data-theme])) input:is([type=submit],[type=button],[type=reset],[type=checkbox],[type=radio],[type=file]),:root:not([data-theme]) input:is([type=submit],[type=button],[type=reset],[type=checkbox],[type=radio],[type=file]){--pico-form-element-focus-color:var(--pico-primary-focus)}:host(:not([data-theme])) details summary[role=button].contrast:not(.outline)::after,:root:not([data-theme]) details summary[role=button].contrast:not(.outline)::after{filter:brightness(0)}:host(:not([data-theme])) [aria-busy=true]:not(input,select,textarea).contrast:is(button,[type=submit],[type=button],[type=reset],[role=button]):not(.outline)::before,:root:not([data-theme]) [aria-busy=true]:not(input,select,textarea).contrast:is(button,[type=submit],[type=button],[type=reset],[role=button]):not(.outline)::before{filter:brightness(0)}}[data-theme=dark]{color-scheme:dark;--pico-background-color:rgb(19, 22.5, 30.5);--pico-color:#c2c7d0;--pico-text-selection-color:rgba(1, 170, 255, 0.1875);--pico-muted-color:#7b8495;--pico-muted-border-color:#202632;--pico-primary:#01aaff;--pico-primary-background:#0172ad;--pico-primary-border:var(--pico-primary-background);--pico-primary-underline:rgba(1, 170, 255, 0.5);--pico-primary-hover:#79c0ff;--pico-primary-hover-background:#017fc0;--pico-primary-hover-border:var(--pico-primary-hover-background);--pico-primary-hover-underline:var(--pico-primary-hover);--pico-primary-focus:rgba(1, 170, 255, 0.375);--pico-primary-inverse:#fff;--pico-secondary:#969eaf;--pico-secondary-background:#525f7a;--pico-secondary-border:var(--pico-secondary-background);--pico-secondary-underline:rgba(150, 158, 175, 0.5);--pico-secondary-hover:#b3b9c5;--pico-secondary-hover-background:#5d6b89;--pico-secondary-hover-border:var(--pico-secondary-hover-background);--pico-secondary-hover-underline:var(--pico-secondary-hover);--pico-secondary-focus:rgba(144, 158, 190, 0.25);--pico-secondary-inverse:#fff;--pico-contrast:#dfe3eb;--pico-contrast-background:#eff1f4;--pico-contrast-border:var(--pico-contrast-background);--pico-contrast-underline:rgba(223, 227, 235, 0.5);--pico-contrast-hover:#fff;--pico-contrast-hover-background:#fff;--pico-contrast-hover-border:var(--pico-contrast-hover-background);--pico-contrast-hover-underline:var(--pico-contrast-hover);--pico-contrast-focus:rgba(207, 213, 226, 0.25);--pico-contrast-inverse:#000;--pico-box-shadow:0.0145rem 0.029rem 0.174rem rgba(7, 8.5, 12, 0.01698),0.0335rem 0.067rem 0.402rem rgba(7, 8.5, 12, 0.024),0.0625rem 0.125rem 0.75rem rgba(7, 8.5, 12, 0.03),0.1125rem 0.225rem 1.35rem rgba(7, 8.5, 12, 0.036),0.2085rem 0.417rem 2.502rem rgba(7, 8.5, 12, 0.04302),0.5rem 1rem 6rem rgba(7, 8.5, 12, 0.06),0 0 0 0.0625rem rgba(7, 8.5, 12, 0.015);--pico-h1-color:#f0f1f3;--pico-h2-color:#e0e3e7;--pico-h3-color:#c2c7d0;--pico-h4-color:#b3b9c5;--pico-h5-color:#a4acba;--pico-h6-color:#8891a4;--pico-mark-background-color:#014063;--pico-mark-color:#fff;--pico-ins-color:#62af9a;--pico-del-color:rgb(205.5, 126, 123);--pico-blockquote-border-color:var(--pico-muted-border-color);--pico-blockquote-footer-color:var(--pico-muted-color);--pico-button-box-shadow:0 0 0 rgba(0, 0, 0, 0);--pico-button-hover-box-shadow:0 0 0 rgba(0, 0, 0, 0);--pico-table-border-color:var(--pico-muted-border-color);--pico-table-row-stripped-background-color:rgba(111, 120, 135, 0.0375);--pico-code-background-color:rgb(26, 30.5, 40.25);--pico-code-color:#8891a4;--pico-code-kbd-background-color:var(--pico-color);--pico-code-kbd-color:var(--pico-background-color);--pico-form-element-background-color:rgb(28, 33, 43.5);--pico-form-element-selected-background-color:#2a3140;--pico-form-element-border-color:#2a3140;--pico-form-element-color:#e0e3e7;--pico-form-element-placeholder-color:#8891a4;--pico-form-element-active-background-color:rgb(26, 30.5, 40.25);--pico-form-element-active-border-color:var(--pico-primary-border);--pico-form-element-focus-color:var(--pico-primary-border);--pico-form-element-disabled-opacity:0.5;--pico-form-element-invalid-border-color:rgb(149.5, 74, 80);--pico-form-element-invalid-active-border-color:rgb(183.25, 63.5, 59);--pico-form-element-invalid-focus-color:var(--pico-form-element-invalid-active-border-color);--pico-form-element-valid-border-color:#2a7b6f;--pico-form-element-valid-active-border-color:rgb(22, 137, 105.5);--pico-form-element-valid-focus-color:var(--pico-form-element-valid-active-border-color);--pico-switch-background-color:#333c4e;--pico-switch-checked-background-color:var(--pico-primary-background);--pico-switch-color:#fff;--pico-switch-thumb-box-shadow:0 0 0 rgba(0, 0, 0, 0);--pico-range-border-color:#202632;--pico-range-active-border-color:#2a3140;--pico-range-thumb-border-color:var(--pico-background-color);--pico-range-thumb-color:var(--pico-secondary-background);--pico-range-thumb-active-color:var(--pico-primary-background);--pico-accordion-border-color:var(--pico-muted-border-color);--pico-accordion-active-summary-color:var(--pico-primary-hover);--pico-accordion-close-summary-color:var(--pico-color);--pico-accordion-open-summary-color:var(--pico-muted-color);--pico-card-background-color:#181c25;--pico-card-border-color:var(--pico-card-background-color);--pico-card-box-shadow:var(--pico-box-shadow);--pico-card-sectioning-background-color:rgb(26, 30.5, 40.25);--pico-dropdown-background-color:#181c25;--pico-dropdown-border-color:#202632;--pico-dropdown-box-shadow:var(--pico-box-shadow);--pico-dropdown-color:var(--pico-color);--pico-dropdown-hover-background-color:#202632;--pico-loading-spinner-opacity:0.5;--pico-modal-overlay-background-color:rgba(7.5, 8.5, 10, 0.75);--pico-progress-background-color:#202632;--pico-progress-color:var(--pico-primary-background);--pico-tooltip-background-color:var(--pico-contrast-background);--pico-tooltip-color:var(--pico-contrast-inverse);--pico-icon-valid:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(42, 123, 111)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");--pico-icon-invalid:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(149.5, 74, 80)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E")}[data-theme=dark] input:is([type=submit],[type=button],[type=reset],[type=checkbox],[type=radio],[type=file]){--pico-form-element-focus-color:var(--pico-primary-focus)}[data-theme=dark] details summary[role=button].contrast:not(.outline)::after{filter:brightness(0)}[data-theme=dark] [aria-busy=true]:not(input,select,textarea).contrast:is(button,[type=submit],[type=button],[type=reset],[role=button]):not(.outline)::before{filter:brightness(0)}[type=checkbox],[type=radio],[type=range],progress{accent-color:var(--pico-primary)}*,::after,::before{box-sizing:border-box;background-repeat:no-repeat}::after,::before{text-decoration:inherit;vertical-align:inherit}:where(:host),:where(:root){-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%;background-color:var(--pico-background-color);color:var(--pico-color);font-weight:var(--pico-font-weight);font-size:var(--pico-font-size);line-height:var(--pico-line-height);font-family:var(--pico-font-family);text-underline-offset:var(--pico-text-underline-offset);text-rendering:optimizeLegibility;overflow-wrap:break-word;-moz-tab-size:4;-o-tab-size:4;tab-size:4}body{width:100%;margin:0}main{display:block}body>footer,body>header,body>main{padding-block:var(--pico-block-spacing-vertical)}section{margin-bottom:var(--pico-block-spacing-vertical)}.container,.container-fluid{width:100%;margin-right:auto;margin-left:auto;padding-right:var(--pico-spacing);padding-left:var(--pico-spacing)}@media (min-width:576px){.container{max-width:510px;padding-right:0;padding-left:0}}@media (min-width:768px){.container{max-width:700px}}@media (min-width:1024px){.container{max-width:950px}}@media (min-width:1280px){.container{max-width:1200px}}@media (min-width:1536px){.container{max-width:1450px}}.grid{grid-column-gap:var(--pico-grid-column-gap);grid-row-gap:var(--pico-grid-row-gap);display:grid;grid-template-columns:1fr}@media (min-width:768px){.grid{grid-template-columns:repeat(auto-fit,minmax(0%,1fr))}}.grid>*{min-width:0}.overflow-auto{overflow:auto}b,strong{font-weight:bolder}sub,sup{position:relative;font-size:.75em;line-height:0;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}address,blockquote,dl,ol,p,pre,table,ul{margin-top:0;margin-bottom:var(--pico-typography-spacing-vertical);color:var(--pico-color);font-style:normal;font-weight:var(--pico-font-weight)}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:var(--pico-typography-spacing-vertical);color:var(--pico-color);font-weight:var(--pico-font-weight);font-size:var(--pico-font-size);line-height:var(--pico-line-height);font-family:var(--pico-font-family)}h1{--pico-color:var(--pico-h1-color)}h2{--pico-color:var(--pico-h2-color)}h3{--pico-color:var(--pico-h3-color)}h4{--pico-color:var(--pico-h4-color)}h5{--pico-color:var(--pico-h5-color)}h6{--pico-color:var(--pico-h6-color)}:where(article,address,blockquote,dl,figure,form,ol,p,pre,table,ul)~:is(h1,h2,h3,h4,h5,h6){margin-top:var(--pico-typography-spacing-top)}p{margin-bottom:var(--pico-typography-spacing-vertical)}hgroup{margin-bottom:var(--pico-typography-spacing-vertical)}hgroup>*{margin-top:0;margin-bottom:0}hgroup>:not(:first-child):last-child{--pico-color:var(--pico-muted-color);--pico-font-weight:unset;font-size:1rem}:where(ol,ul) li{margin-bottom:calc(var(--pico-typography-spacing-vertical) * .25)}:where(dl,ol,ul) :where(dl,ol,ul){margin:0;margin-top:calc(var(--pico-typography-spacing-vertical) * .25)}ul li{list-style:square}mark{padding:.125rem .25rem;background-color:var(--pico-mark-background-color);color:var(--pico-mark-color);vertical-align:baseline}blockquote{display:block;margin:var(--pico-typography-spacing-vertical) 0;padding:var(--pico-spacing);border-right:none;border-left:.25rem solid var(--pico-blockquote-border-color);border-inline-start:0.25rem solid var(--pico-blockquote-border-color);border-inline-end:none}blockquote footer{margin-top:calc(var(--pico-typography-spacing-vertical) * .5);color:var(--pico-blockquote-footer-color)}abbr[title]{border-bottom:1px dotted;text-decoration:none;cursor:help}ins{color:var(--pico-ins-color);text-decoration:none}del{color:var(--pico-del-color)}::-moz-selection{background-color:var(--pico-text-selection-color)}::selection{background-color:var(--pico-text-selection-color)}:where(a:not([role=button])),[role=link]{--pico-color:var(--pico-primary);--pico-background-color:transparent;--pico-underline:var(--pico-primary-underline);outline:0;background-color:var(--pico-background-color);color:var(--pico-color);-webkit-text-decoration:var(--pico-text-decoration);text-decoration:var(--pico-text-decoration);text-decoration-color:var(--pico-underline);text-underline-offset:0.125em;transition:background-color var(--pico-transition),color var(--pico-transition),box-shadow var(--pico-transition),-webkit-text-decoration var(--pico-transition);transition:background-color var(--pico-transition),color var(--pico-transition),text-decoration var(--pico-transition),box-shadow var(--pico-transition);transition:background-color var(--pico-transition),color var(--pico-transition),text-decoration var(--pico-transition),box-shadow var(--pico-transition),-webkit-text-decoration var(--pico-transition)}:where(a:not([role=button])):is([aria-current]:not([aria-current=false]),:hover,:active,:focus),[role=link]:is([aria-current]:not([aria-current=false]),:hover,:active,:focus){--pico-color:var(--pico-primary-hover);--pico-underline:var(--pico-primary-hover-underline);--pico-text-decoration:underline}:where(a:not([role=button])):focus-visible,[role=link]:focus-visible{box-shadow:0 0 0 var(--pico-outline-width) var(--pico-primary-focus)}:where(a:not([role=button])).secondary,[role=link].secondary{--pico-color:var(--pico-secondary);--pico-underline:var(--pico-secondary-underline)}:where(a:not([role=button])).secondary:is([aria-current]:not([aria-current=false]),:hover,:active,:focus),[role=link].secondary:is([aria-current]:not([aria-current=false]),:hover,:active,:focus){--pico-color:var(--pico-secondary-hover);--pico-underline:var(--pico-secondary-hover-underline)}:where(a:not([role=button])).contrast,[role=link].contrast{--pico-color:var(--pico-contrast);--pico-underline:var(--pico-contrast-underline)}:where(a:not([role=button])).contrast:is([aria-current]:not([aria-current=false]),:hover,:active,:focus),[role=link].contrast:is([aria-current]:not([aria-current=false]),:hover,:active,:focus){--pico-color:var(--pico-contrast-hover);--pico-underline:var(--pico-contrast-hover-underline)}a[role=button]{display:inline-block}button{margin:0;overflow:visible;font-family:inherit;text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[role=button],[type=button],[type=file]::file-selector-button,[type=reset],[type=submit],button{--pico-background-color:var(--pico-primary-background);--pico-border-color:var(--pico-primary-border);--pico-color:var(--pico-primary-inverse);--pico-box-shadow:var(--pico-button-box-shadow, 0 0 0 rgba(0, 0, 0, 0));padding:var(--pico-form-element-spacing-vertical) var(--pico-form-element-spacing-horizontal);border:var(--pico-border-width) solid var(--pico-border-color);border-radius:var(--pico-border-radius);outline:0;background-color:var(--pico-background-color);box-shadow:var(--pico-box-shadow);color:var(--pico-color);font-weight:var(--pico-font-weight);font-size:1rem;line-height:var(--pico-line-height);text-align:center;text-decoration:none;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;transition:background-color var(--pico-transition),border-color var(--pico-transition),color var(--pico-transition),box-shadow var(--pico-transition)}[role=button]:is(:hover,:active,:focus),[role=button]:is([aria-current]:not([aria-current=false])),[type=button]:is(:hover,:active,:focus),[type=button]:is([aria-current]:not([aria-current=false])),[type=file]::file-selector-button:is(:hover,:active,:focus),[type=file]::file-selector-button:is([aria-current]:not([aria-current=false])),[type=reset]:is(:hover,:active,:focus),[type=reset]:is([aria-current]:not([aria-current=false])),[type=submit]:is(:hover,:active,:focus),[type=submit]:is([aria-current]:not([aria-current=false])),button:is(:hover,:active,:focus),button:is([aria-current]:not([aria-current=false])){--pico-background-color:var(--pico-primary-hover-background);--pico-border-color:var(--pico-primary-hover-border);--pico-box-shadow:var(--pico-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0));--pico-color:var(--pico-primary-inverse)}[role=button]:focus,[role=button]:is([aria-current]:not([aria-current=false])):focus,[type=button]:focus,[type=button]:is([aria-current]:not([aria-current=false])):focus,[type=file]::file-selector-button:focus,[type=file]::file-selector-button:is([aria-current]:not([aria-current=false])):focus,[type=reset]:focus,[type=reset]:is([aria-current]:not([aria-current=false])):focus,[type=submit]:focus,[type=submit]:is([aria-current]:not([aria-current=false])):focus,button:focus,button:is([aria-current]:not([aria-current=false])):focus{--pico-box-shadow:var(--pico-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0)),0 0 0 var(--pico-outline-width) var(--pico-primary-focus)}[type=button],[type=reset],[type=submit]{margin-bottom:var(--pico-spacing)}:is(button,[type=submit],[type=button],[role=button]).secondary,[type=file]::file-selector-button,[type=reset]{--pico-background-color:var(--pico-secondary-background);--pico-border-color:var(--pico-secondary-border);--pico-color:var(--pico-secondary-inverse);cursor:pointer}:is(button,[type=submit],[type=button],[role=button]).secondary:is([aria-current]:not([aria-current=false]),:hover,:active,:focus),[type=file]::file-selector-button:is([aria-current]:not([aria-current=false]),:hover,:active,:focus),[type=reset]:is([aria-current]:not([aria-current=false]),:hover,:active,:focus){--pico-background-color:var(--pico-secondary-hover-background);--pico-border-color:var(--pico-secondary-hover-border);--pico-color:var(--pico-secondary-inverse)}:is(button,[type=submit],[type=button],[role=button]).secondary:focus,:is(button,[type=submit],[type=button],[role=button]).secondary:is([aria-current]:not([aria-current=false])):focus,[type=file]::file-selector-button:focus,[type=file]::file-selector-button:is([aria-current]:not([aria-current=false])):focus,[type=reset]:focus,[type=reset]:is([aria-current]:not([aria-current=false])):focus{--pico-box-shadow:var(--pico-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0)),0 0 0 var(--pico-outline-width) var(--pico-secondary-focus)}:is(button,[type=submit],[type=button],[role=button]).contrast{--pico-background-color:var(--pico-contrast-background);--pico-border-color:var(--pico-contrast-border);--pico-color:var(--pico-contrast-inverse)}:is(button,[type=submit],[type=button],[role=button]).contrast:is([aria-current]:not([aria-current=false]),:hover,:active,:focus){--pico-background-color:var(--pico-contrast-hover-background);--pico-border-color:var(--pico-contrast-hover-border);--pico-color:var(--pico-contrast-inverse)}:is(button,[type=submit],[type=button],[role=button]).contrast:focus,:is(button,[type=submit],[type=button],[role=button]).contrast:is([aria-current]:not([aria-current=false])):focus{--pico-box-shadow:var(--pico-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0)),0 0 0 var(--pico-outline-width) var(--pico-contrast-focus)}:is(button,[type=submit],[type=button],[role=button]).outline,[type=reset].outline{--pico-background-color:transparent;--pico-color:var(--pico-primary);--pico-border-color:var(--pico-primary)}:is(button,[type=submit],[type=button],[role=button]).outline:is([aria-current]:not([aria-current=false]),:hover,:active,:focus),[type=reset].outline:is([aria-current]:not([aria-current=false]),:hover,:active,:focus){--pico-background-color:transparent;--pico-color:var(--pico-primary-hover);--pico-border-color:var(--pico-primary-hover)}:is(button,[type=submit],[type=button],[role=button]).outline.secondary,[type=reset].outline{--pico-color:var(--pico-secondary);--pico-border-color:var(--pico-secondary)}:is(button,[type=submit],[type=button],[role=button]).outline.secondary:is([aria-current]:not([aria-current=false]),:hover,:active,:focus),[type=reset].outline:is([aria-current]:not([aria-current=false]),:hover,:active,:focus){--pico-color:var(--pico-secondary-hover);--pico-border-color:var(--pico-secondary-hover)}:is(button,[type=submit],[type=button],[role=button]).outline.contrast{--pico-color:var(--pico-contrast);--pico-border-color:var(--pico-contrast)}:is(button,[type=submit],[type=button],[role=button]).outline.contrast:is([aria-current]:not([aria-current=false]),:hover,:active,:focus){--pico-color:var(--pico-contrast-hover);--pico-border-color:var(--pico-contrast-hover)}:where(button,[type=submit],[type=reset],[type=button],[role=button])[disabled],:where(fieldset[disabled]) :is(button,[type=submit],[type=button],[type=reset],[role=button]){opacity:.5;pointer-events:none}:where(table){width:100%;border-collapse:collapse;border-spacing:0;text-indent:0}td,th{padding:calc(var(--pico-spacing)/ 2) var(--pico-spacing);border-bottom:var(--pico-border-width) solid var(--pico-table-border-color);background-color:var(--pico-background-color);color:var(--pico-color);font-weight:var(--pico-font-weight);text-align:left;text-align:start}tfoot td,tfoot th{border-top:var(--pico-border-width) solid var(--pico-table-border-color);border-bottom:0}table.striped tbody tr:nth-child(odd) td,table.striped tbody tr:nth-child(odd) th{background-color:var(--pico-table-row-stripped-background-color)}:where(audio,canvas,iframe,img,svg,video){vertical-align:middle}audio,video{display:inline-block}audio:not([controls]){display:none;height:0}:where(iframe){border-style:none}img{max-width:100%;height:auto;border-style:none}:where(svg:not([fill])){fill:currentColor}svg:not(:host),svg:not(:root){overflow:hidden}code,kbd,pre,samp{font-size:.875em;font-family:var(--pico-font-family)}pre code,pre samp{font-size:inherit;font-family:inherit}pre{-ms-overflow-style:scrollbar;overflow:auto}code,kbd,pre,samp{border-radius:var(--pico-border-radius);background:var(--pico-code-background-color);color:var(--pico-code-color);font-weight:var(--pico-font-weight);line-height:initial}code,kbd,samp{display:inline-block;padding:.375rem}pre{display:block;margin-bottom:var(--pico-spacing);overflow-x:auto}pre>code,pre>samp{display:block;padding:var(--pico-spacing);background:0 0;line-height:var(--pico-line-height)}kbd{background-color:var(--pico-code-kbd-background-color);color:var(--pico-code-kbd-color);vertical-align:baseline}figure{display:block;margin:0;padding:0}figure figcaption{padding:calc(var(--pico-spacing) * .5) 0;color:var(--pico-muted-color)}hr{height:0;margin:var(--pico-typography-spacing-vertical) 0;border:0;border-top:1px solid var(--pico-muted-border-color);color:inherit}[hidden],template{display:none!important}canvas{display:inline-block}input,optgroup,select,textarea{margin:0;font-size:1rem;line-height:var(--pico-line-height);font-family:inherit;letter-spacing:inherit}input{overflow:visible}select{text-transform:none}legend{max-width:100%;padding:0;color:inherit;white-space:normal}textarea{overflow:auto}[type=checkbox],[type=radio]{padding:0}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}::-moz-focus-inner{padding:0;border-style:none}:-moz-focusring{outline:0}:-moz-ui-invalid{box-shadow:none}::-ms-expand{display:none}[type=file],[type=range]{padding:0;border-width:0}input:not([type=checkbox],[type=radio],[type=range]){height:calc(1rem * var(--pico-line-height) + var(--pico-form-element-spacing-vertical) * 2 + var(--pico-border-width) * 2)}fieldset{width:100%;margin:0;margin-bottom:var(--pico-spacing);padding:0;border:0}fieldset legend,label{display:block;margin-bottom:calc(var(--pico-spacing) * .375);color:var(--pico-color);font-weight:var(--pico-form-label-font-weight,var(--pico-font-weight))}fieldset legend{margin-bottom:calc(var(--pico-spacing) * .5)}button[type=submit],input:not([type=checkbox],[type=radio]),select,textarea{width:100%}input:not([type=checkbox],[type=radio],[type=range],[type=file]),select,textarea{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:var(--pico-form-element-spacing-vertical) var(--pico-form-element-spacing-horizontal)}input,select,textarea{--pico-background-color:var(--pico-form-element-background-color);--pico-border-color:var(--pico-form-element-border-color);--pico-color:var(--pico-form-element-color);--pico-box-shadow:none;border:var(--pico-border-width) solid var(--pico-border-color);border-radius:var(--pico-border-radius);outline:0;background-color:var(--pico-background-color);box-shadow:var(--pico-box-shadow);color:var(--pico-color);font-weight:var(--pico-font-weight);transition:background-color var(--pico-transition),border-color var(--pico-transition),color var(--pico-transition),box-shadow var(--pico-transition)}:where(select,textarea):not([readonly]):is(:active,:focus),input:not([type=submit],[type=button],[type=reset],[type=checkbox],[type=radio],[readonly]):is(:active,:focus){--pico-background-color:var(--pico-form-element-active-background-color)}:where(select,textarea):not([readonly]):is(:active,:focus),input:not([type=submit],[type=button],[type=reset],[role=switch],[readonly]):is(:active,:focus){--pico-border-color:var(--pico-form-element-active-border-color)}:where(select,textarea):not([readonly]):focus,input:not([type=submit],[type=button],[type=reset],[type=range],[type=file],[readonly]):focus{--pico-box-shadow:0 0 0 var(--pico-outline-width) var(--pico-form-element-focus-color)}:where(fieldset[disabled]) :is(input:not([type=submit],[type=button],[type=reset]),select,textarea),input:not([type=submit],[type=button],[type=reset])[disabled],label[aria-disabled=true],select[disabled],textarea[disabled]{opacity:var(--pico-form-element-disabled-opacity);pointer-events:none}label[aria-disabled=true] input[disabled]{opacity:1}:where(input,select,textarea):not([type=checkbox],[type=radio],[type=date],[type=datetime-local],[type=month],[type=time],[type=week],[type=range])[aria-invalid]{padding-right:calc(var(--pico-form-element-spacing-horizontal) + 1.5rem)!important;padding-left:var(--pico-form-element-spacing-horizontal);padding-inline-start:var(--pico-form-element-spacing-horizontal)!important;padding-inline-end:calc(var(--pico-form-element-spacing-horizontal) + 1.5rem)!important;background-position:center right .75rem;background-size:1rem auto;background-repeat:no-repeat}:where(input,select,textarea):not([type=checkbox],[type=radio],[type=date],[type=datetime-local],[type=month],[type=time],[type=week],[type=range])[aria-invalid=false]:not(select){background-image:var(--pico-icon-valid)}:where(input,select,textarea):not([type=checkbox],[type=radio],[type=date],[type=datetime-local],[type=month],[type=time],[type=week],[type=range])[aria-invalid=true]:not(select){background-image:var(--pico-icon-invalid)}:where(input,select,textarea)[aria-invalid=false]{--pico-border-color:var(--pico-form-element-valid-border-color)}:where(input,select,textarea)[aria-invalid=false]:is(:active,:focus){--pico-border-color:var(--pico-form-element-valid-active-border-color)!important}:where(input,select,textarea)[aria-invalid=false]:is(:active,:focus):not([type=checkbox],[type=radio]){--pico-box-shadow:0 0 0 var(--pico-outline-width) var(--pico-form-element-valid-focus-color)!important}:where(input,select,textarea)[aria-invalid=true]{--pico-border-color:var(--pico-form-element-invalid-border-color)}:where(input,select,textarea)[aria-invalid=true]:is(:active,:focus){--pico-border-color:var(--pico-form-element-invalid-active-border-color)!important}:where(input,select,textarea)[aria-invalid=true]:is(:active,:focus):not([type=checkbox],[type=radio]){--pico-box-shadow:0 0 0 var(--pico-outline-width) var(--pico-form-element-invalid-focus-color)!important}[dir=rtl] :where(input,select,textarea):not([type=checkbox],[type=radio]):is([aria-invalid],[aria-invalid=true],[aria-invalid=false]){background-position:center left .75rem}input::-webkit-input-placeholder,input::placeholder,select:invalid,textarea::-webkit-input-placeholder,textarea::placeholder{color:var(--pico-form-element-placeholder-color);opacity:1}input:not([type=checkbox],[type=radio]),select,textarea{margin-bottom:var(--pico-spacing)}select::-ms-expand{border:0;background-color:transparent}select:not([multiple],[size]){padding-right:calc(var(--pico-form-element-spacing-horizontal) + 1.5rem);padding-left:var(--pico-form-element-spacing-horizontal);padding-inline-start:var(--pico-form-element-spacing-horizontal);padding-inline-end:calc(var(--pico-form-element-spacing-horizontal) + 1.5rem);background-image:var(--pico-icon-chevron);background-position:center right .75rem;background-size:1rem auto;background-repeat:no-repeat}select[multiple] option:checked{background:var(--pico-form-element-selected-background-color);color:var(--pico-form-element-color)}[dir=rtl] select:not([multiple],[size]){background-position:center left .75rem}textarea{display:block;resize:vertical}textarea[aria-invalid]{--pico-icon-height:calc(1rem * var(--pico-line-height) + var(--pico-form-element-spacing-vertical) * 2 + var(--pico-border-width) * 2);background-position:top right .75rem!important;background-size:1rem var(--pico-icon-height)!important}:where(input,select,textarea,fieldset,.grid)+small{display:block;width:100%;margin-top:calc(var(--pico-spacing) * -.75);margin-bottom:var(--pico-spacing);color:var(--pico-muted-color)}:where(input,select,textarea,fieldset,.grid)[aria-invalid=false]+small{color:var(--pico-ins-color)}:where(input,select,textarea,fieldset,.grid)[aria-invalid=true]+small{color:var(--pico-del-color)}label>:where(input,select,textarea){margin-top:calc(var(--pico-spacing) * .25)}label:has([type=checkbox],[type=radio]){width:-moz-fit-content;width:fit-content;cursor:pointer}[type=checkbox],[type=radio]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:1.25em;height:1.25em;margin-top:-.125em;margin-inline-end:.5em;border-width:var(--pico-border-width);vertical-align:middle;cursor:pointer}[type=checkbox]::-ms-check,[type=radio]::-ms-check{display:none}[type=checkbox]:checked,[type=checkbox]:checked:active,[type=checkbox]:checked:focus,[type=radio]:checked,[type=radio]:checked:active,[type=radio]:checked:focus{--pico-background-color:var(--pico-primary-background);--pico-border-color:var(--pico-primary-border);background-image:var(--pico-icon-checkbox);background-position:center;background-size:.75em auto;background-repeat:no-repeat}[type=checkbox]~label,[type=radio]~label{display:inline-block;margin-bottom:0;cursor:pointer}[type=checkbox]~label:not(:last-of-type),[type=radio]~label:not(:last-of-type){margin-inline-end:1em}[type=checkbox]:indeterminate{--pico-background-color:var(--pico-primary-background);--pico-border-color:var(--pico-primary-border);background-image:var(--pico-icon-minus);background-position:center;background-size:.75em auto;background-repeat:no-repeat}[type=radio]{border-radius:50%}[type=radio]:checked,[type=radio]:checked:active,[type=radio]:checked:focus{--pico-background-color:var(--pico-primary-inverse);border-width:.35em;background-image:none}[type=checkbox][role=switch]{--pico-background-color:var(--pico-switch-background-color);--pico-color:var(--pico-switch-color);width:2.25em;height:1.25em;border:var(--pico-border-width) solid var(--pico-border-color);border-radius:1.25em;background-color:var(--pico-background-color);line-height:1.25em}[type=checkbox][role=switch]:not([aria-invalid]){--pico-border-color:var(--pico-switch-background-color)}[type=checkbox][role=switch]:before{display:block;aspect-ratio:1;height:100%;border-radius:50%;background-color:var(--pico-color);box-shadow:var(--pico-switch-thumb-box-shadow);content:"";transition:margin .1s ease-in-out}[type=checkbox][role=switch]:focus{--pico-background-color:var(--pico-switch-background-color);--pico-border-color:var(--pico-switch-background-color)}[type=checkbox][role=switch]:checked{--pico-background-color:var(--pico-switch-checked-background-color);--pico-border-color:var(--pico-switch-checked-background-color);background-image:none}[type=checkbox][role=switch]:checked::before{margin-inline-start:calc(2.25em - 1.25em)}[type=checkbox][role=switch][disabled]{--pico-background-color:var(--pico-border-color)}[type=checkbox][aria-invalid=false]:checked,[type=checkbox][aria-invalid=false]:checked:active,[type=checkbox][aria-invalid=false]:checked:focus,[type=checkbox][role=switch][aria-invalid=false]:checked,[type=checkbox][role=switch][aria-invalid=false]:checked:active,[type=checkbox][role=switch][aria-invalid=false]:checked:focus{--pico-background-color:var(--pico-form-element-valid-border-color)}[type=checkbox]:checked:active[aria-invalid=true],[type=checkbox]:checked:focus[aria-invalid=true],[type=checkbox]:checked[aria-invalid=true],[type=checkbox][role=switch]:checked:active[aria-invalid=true],[type=checkbox][role=switch]:checked:focus[aria-invalid=true],[type=checkbox][role=switch]:checked[aria-invalid=true]{--pico-background-color:var(--pico-form-element-invalid-border-color)}[type=checkbox][aria-invalid=false]:checked,[type=checkbox][aria-invalid=false]:checked:active,[type=checkbox][aria-invalid=false]:checked:focus,[type=checkbox][role=switch][aria-invalid=false]:checked,[type=checkbox][role=switch][aria-invalid=false]:checked:active,[type=checkbox][role=switch][aria-invalid=false]:checked:focus,[type=radio][aria-invalid=false]:checked,[type=radio][aria-invalid=false]:checked:active,[type=radio][aria-invalid=false]:checked:focus{--pico-border-color:var(--pico-form-element-valid-border-color)}[type=checkbox]:checked:active[aria-invalid=true],[type=checkbox]:checked:focus[aria-invalid=true],[type=checkbox]:checked[aria-invalid=true],[type=checkbox][role=switch]:checked:active[aria-invalid=true],[type=checkbox][role=switch]:checked:focus[aria-invalid=true],[type=checkbox][role=switch]:checked[aria-invalid=true],[type=radio]:checked:active[aria-invalid=true],[type=radio]:checked:focus[aria-invalid=true],[type=radio]:checked[aria-invalid=true]{--pico-border-color:var(--pico-form-element-invalid-border-color)}[type=color]::-webkit-color-swatch-wrapper{padding:0}[type=color]::-moz-focus-inner{padding:0}[type=color]::-webkit-color-swatch{border:0;border-radius:calc(var(--pico-border-radius) * .5)}[type=color]::-moz-color-swatch{border:0;border-radius:calc(var(--pico-border-radius) * .5)}input:not([type=checkbox],[type=radio],[type=range],[type=file]):is([type=date],[type=datetime-local],[type=month],[type=time],[type=week]){--pico-icon-position:0.75rem;--pico-icon-width:1rem;padding-right:calc(var(--pico-icon-width) + var(--pico-icon-position));background-image:var(--pico-icon-date);background-position:center right var(--pico-icon-position);background-size:var(--pico-icon-width) auto;background-repeat:no-repeat}input:not([type=checkbox],[type=radio],[type=range],[type=file])[type=time]{background-image:var(--pico-icon-time)}[type=date]::-webkit-calendar-picker-indicator,[type=datetime-local]::-webkit-calendar-picker-indicator,[type=month]::-webkit-calendar-picker-indicator,[type=time]::-webkit-calendar-picker-indicator,[type=week]::-webkit-calendar-picker-indicator{width:var(--pico-icon-width);margin-right:calc(var(--pico-icon-width) * -1);margin-left:var(--pico-icon-position);opacity:0}@-moz-document url-prefix(){[type=date],[type=datetime-local],[type=month],[type=time],[type=week]{padding-right:var(--pico-form-element-spacing-horizontal)!important;background-image:none!important}}[dir=rtl] :is([type=date],[type=datetime-local],[type=month],[type=time],[type=week]){text-align:right}[type=file]{--pico-color:var(--pico-muted-color);margin-left:calc(var(--pico-outline-width) * -1);padding:calc(var(--pico-form-element-spacing-vertical) * .5) 0;padding-left:var(--pico-outline-width);border:0;border-radius:0;background:0 0}[type=file]::file-selector-button{margin-right:calc(var(--pico-spacing)/ 2);padding:calc(var(--pico-form-element-spacing-vertical) * .5) var(--pico-form-element-spacing-horizontal)}[type=file]:is(:hover,:active,:focus)::file-selector-button{--pico-background-color:var(--pico-secondary-hover-background);--pico-border-color:var(--pico-secondary-hover-border)}[type=file]:focus::file-selector-button{--pico-box-shadow:var(--pico-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0)),0 0 0 var(--pico-outline-width) var(--pico-secondary-focus)}[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:1.25rem;background:0 0}[type=range]::-webkit-slider-runnable-track{width:100%;height:.375rem;border-radius:var(--pico-border-radius);background-color:var(--pico-range-border-color);-webkit-transition:background-color var(--pico-transition),box-shadow var(--pico-transition);transition:background-color var(--pico-transition),box-shadow var(--pico-transition)}[type=range]::-moz-range-track{width:100%;height:.375rem;border-radius:var(--pico-border-radius);background-color:var(--pico-range-border-color);-moz-transition:background-color var(--pico-transition),box-shadow var(--pico-transition);transition:background-color var(--pico-transition),box-shadow var(--pico-transition)}[type=range]::-ms-track{width:100%;height:.375rem;border-radius:var(--pico-border-radius);background-color:var(--pico-range-border-color);-ms-transition:background-color var(--pico-transition),box-shadow var(--pico-transition);transition:background-color var(--pico-transition),box-shadow var(--pico-transition)}[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:1.25rem;height:1.25rem;margin-top:-.4375rem;border:2px solid var(--pico-range-thumb-border-color);border-radius:50%;background-color:var(--pico-range-thumb-color);cursor:pointer;-webkit-transition:background-color var(--pico-transition),transform var(--pico-transition);transition:background-color var(--pico-transition),transform var(--pico-transition)}[type=range]::-moz-range-thumb{-webkit-appearance:none;width:1.25rem;height:1.25rem;margin-top:-.4375rem;border:2px solid var(--pico-range-thumb-border-color);border-radius:50%;background-color:var(--pico-range-thumb-color);cursor:pointer;-moz-transition:background-color var(--pico-transition),transform var(--pico-transition);transition:background-color var(--pico-transition),transform var(--pico-transition)}[type=range]::-ms-thumb{-webkit-appearance:none;width:1.25rem;height:1.25rem;margin-top:-.4375rem;border:2px solid var(--pico-range-thumb-border-color);border-radius:50%;background-color:var(--pico-range-thumb-color);cursor:pointer;-ms-transition:background-color var(--pico-transition),transform var(--pico-transition);transition:background-color var(--pico-transition),transform var(--pico-transition)}[type=range]:active,[type=range]:focus-within{--pico-range-border-color:var(--pico-range-active-border-color);--pico-range-thumb-color:var(--pico-range-thumb-active-color)}[type=range]:active::-webkit-slider-thumb{transform:scale(1.25)}[type=range]:active::-moz-range-thumb{transform:scale(1.25)}[type=range]:active::-ms-thumb{transform:scale(1.25)}input:not([type=checkbox],[type=radio],[type=range],[type=file])[type=search]{padding-inline-start:calc(var(--pico-form-element-spacing-horizontal) + 1.75rem);background-image:var(--pico-icon-search);background-position:center left calc(var(--pico-form-element-spacing-horizontal) + .125rem);background-size:1rem auto;background-repeat:no-repeat}input:not([type=checkbox],[type=radio],[type=range],[type=file])[type=search][aria-invalid]{padding-inline-start:calc(var(--pico-form-element-spacing-horizontal) + 1.75rem)!important;background-position:center left 1.125rem,center right .75rem}input:not([type=checkbox],[type=radio],[type=range],[type=file])[type=search][aria-invalid=false]{background-image:var(--pico-icon-search),var(--pico-icon-valid)}input:not([type=checkbox],[type=radio],[type=range],[type=file])[type=search][aria-invalid=true]{background-image:var(--pico-icon-search),var(--pico-icon-invalid)}[dir=rtl] :where(input):not([type=checkbox],[type=radio],[type=range],[type=file])[type=search]{background-position:center right 1.125rem}[dir=rtl] :where(input):not([type=checkbox],[type=radio],[type=range],[type=file])[type=search][aria-invalid]{background-position:center right 1.125rem,center left .75rem}details{display:block;margin-bottom:var(--pico-spacing)}details summary{line-height:1rem;list-style-type:none;cursor:pointer;transition:color var(--pico-transition)}details summary:not([role]){color:var(--pico-accordion-close-summary-color)}details summary::-webkit-details-marker{display:none}details summary::marker{display:none}details summary::-moz-list-bullet{list-style-type:none}details summary::after{display:block;width:1rem;height:1rem;margin-inline-start:calc(var(--pico-spacing,1rem) * .5);float:right;transform:rotate(-90deg);background-image:var(--pico-icon-chevron);background-position:right center;background-size:1rem auto;background-repeat:no-repeat;content:"";transition:transform var(--pico-transition)}details summary:focus{outline:0}details summary:focus:not([role]){color:var(--pico-accordion-active-summary-color)}details summary:focus-visible:not([role]){outline:var(--pico-outline-width) solid var(--pico-primary-focus);outline-offset:calc(var(--pico-spacing,1rem) * 0.5);color:var(--pico-primary)}details summary[role=button]{width:100%;text-align:left}details summary[role=button]::after{height:calc(1rem * var(--pico-line-height,1.5))}details[open]>summary{margin-bottom:var(--pico-spacing)}details[open]>summary:not([role]):not(:focus){color:var(--pico-accordion-open-summary-color)}details[open]>summary::after{transform:rotate(0)}[dir=rtl] details summary{text-align:right}[dir=rtl] details summary::after{float:left;background-position:left center}article{margin-bottom:var(--pico-block-spacing-vertical);padding:var(--pico-block-spacing-vertical) var(--pico-block-spacing-horizontal);border-radius:var(--pico-border-radius);background:var(--pico-card-background-color);box-shadow:var(--pico-card-box-shadow)}article>footer,article>header{margin-right:calc(var(--pico-block-spacing-horizontal) * -1);margin-left:calc(var(--pico-block-spacing-horizontal) * -1);padding:calc(var(--pico-block-spacing-vertical) * .66) var(--pico-block-spacing-horizontal);background-color:var(--pico-card-sectioning-background-color)}article>header{margin-top:calc(var(--pico-block-spacing-vertical) * -1);margin-bottom:var(--pico-block-spacing-vertical);border-bottom:var(--pico-border-width) solid var(--pico-card-border-color);border-top-right-radius:var(--pico-border-radius);border-top-left-radius:var(--pico-border-radius)}article>footer{margin-top:var(--pico-block-spacing-vertical);margin-bottom:calc(var(--pico-block-spacing-vertical) * -1);border-top:var(--pico-border-width) solid var(--pico-card-border-color);border-bottom-right-radius:var(--pico-border-radius);border-bottom-left-radius:var(--pico-border-radius)}details.dropdown{position:relative;border-bottom:none}details.dropdown>a::after,details.dropdown>button::after,details.dropdown>summary::after{display:block;width:1rem;height:calc(1rem * var(--pico-line-height,1.5));margin-inline-start:.25rem;float:right;transform:rotate(0) translateX(.2rem);background-image:var(--pico-icon-chevron);background-position:right center;background-size:1rem auto;background-repeat:no-repeat;content:""}nav details.dropdown{margin-bottom:0}details.dropdown>summary:not([role]){height:calc(1rem * var(--pico-line-height) + var(--pico-form-element-spacing-vertical) * 2 + var(--pico-border-width) * 2);padding:var(--pico-form-element-spacing-vertical) var(--pico-form-element-spacing-horizontal);border:var(--pico-border-width) solid var(--pico-form-element-border-color);border-radius:var(--pico-border-radius);background-color:var(--pico-form-element-background-color);color:var(--pico-form-element-placeholder-color);line-height:inherit;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;transition:background-color var(--pico-transition),border-color var(--pico-transition),color var(--pico-transition),box-shadow var(--pico-transition)}details.dropdown>summary:not([role]):active,details.dropdown>summary:not([role]):focus{border-color:var(--pico-form-element-active-border-color);background-color:var(--pico-form-element-active-background-color)}details.dropdown>summary:not([role]):focus{box-shadow:0 0 0 var(--pico-outline-width) var(--pico-form-element-focus-color)}details.dropdown>summary:not([role]):focus-visible{outline:0}details.dropdown>summary:not([role])[aria-invalid=false]{--pico-form-element-border-color:var(--pico-form-element-valid-border-color);--pico-form-element-active-border-color:var(--pico-form-element-valid-focus-color);--pico-form-element-focus-color:var(--pico-form-element-valid-focus-color)}details.dropdown>summary:not([role])[aria-invalid=true]{--pico-form-element-border-color:var(--pico-form-element-invalid-border-color);--pico-form-element-active-border-color:var(--pico-form-element-invalid-focus-color);--pico-form-element-focus-color:var(--pico-form-element-invalid-focus-color)}nav details.dropdown{display:inline;margin:calc(var(--pico-nav-element-spacing-vertical) * -1) 0}nav details.dropdown>summary::after{transform:rotate(0) translateX(0)}nav details.dropdown>summary:not([role]){height:calc(1rem * var(--pico-line-height) + var(--pico-nav-link-spacing-vertical) * 2);padding:calc(var(--pico-nav-link-spacing-vertical) - var(--pico-border-width) * 2) var(--pico-nav-link-spacing-horizontal)}nav details.dropdown>summary:not([role]):focus-visible{box-shadow:0 0 0 var(--pico-outline-width) var(--pico-primary-focus)}details.dropdown>summary+ul{display:flex;z-index:99;position:absolute;left:0;flex-direction:column;width:100%;min-width:-moz-fit-content;min-width:fit-content;margin:0;margin-top:var(--pico-outline-width);padding:0;border:var(--pico-border-width) solid var(--pico-dropdown-border-color);border-radius:var(--pico-border-radius);background-color:var(--pico-dropdown-background-color);box-shadow:var(--pico-dropdown-box-shadow);color:var(--pico-dropdown-color);white-space:nowrap;opacity:0;transition:opacity var(--pico-transition),transform 0s ease-in-out 1s}details.dropdown>summary+ul[dir=rtl]{right:0;left:auto}details.dropdown>summary+ul li{width:100%;margin-bottom:0;padding:calc(var(--pico-form-element-spacing-vertical) * .5) var(--pico-form-element-spacing-horizontal);list-style:none}details.dropdown>summary+ul li:first-of-type{margin-top:calc(var(--pico-form-element-spacing-vertical) * .5)}details.dropdown>summary+ul li:last-of-type{margin-bottom:calc(var(--pico-form-element-spacing-vertical) * .5)}details.dropdown>summary+ul li a{display:block;margin:calc(var(--pico-form-element-spacing-vertical) * -.5) calc(var(--pico-form-element-spacing-horizontal) * -1);padding:calc(var(--pico-form-element-spacing-vertical) * .5) var(--pico-form-element-spacing-horizontal);overflow:hidden;border-radius:0;color:var(--pico-dropdown-color);text-decoration:none;text-overflow:ellipsis}details.dropdown>summary+ul li a:active,details.dropdown>summary+ul li a:focus,details.dropdown>summary+ul li a:focus-visible,details.dropdown>summary+ul li a:hover,details.dropdown>summary+ul li a[aria-current]:not([aria-current=false]){background-color:var(--pico-dropdown-hover-background-color)}details.dropdown>summary+ul li label{width:100%}details.dropdown>summary+ul li:has(label):hover{background-color:var(--pico-dropdown-hover-background-color)}details.dropdown[open]>summary{margin-bottom:0}details.dropdown[open]>summary+ul{transform:scaleY(1);opacity:1;transition:opacity var(--pico-transition),transform 0s ease-in-out 0s}details.dropdown[open]>summary::before{display:block;z-index:1;position:fixed;width:100vw;height:100vh;inset:0;background:0 0;content:"";cursor:default}label>details.dropdown{margin-top:calc(var(--pico-spacing) * .25)}[role=group],[role=search]{display:inline-flex;position:relative;width:100%;margin-bottom:var(--pico-spacing);border-radius:var(--pico-border-radius);box-shadow:var(--pico-group-box-shadow,0 0 0 transparent);vertical-align:middle;transition:box-shadow var(--pico-transition)}[role=group] input:not([type=checkbox],[type=radio]),[role=group] select,[role=group]>*,[role=search] input:not([type=checkbox],[type=radio]),[role=search] select,[role=search]>*{position:relative;flex:1 1 auto;margin-bottom:0}[role=group] input:not([type=checkbox],[type=radio]):not(:first-child),[role=group] select:not(:first-child),[role=group]>:not(:first-child),[role=search] input:not([type=checkbox],[type=radio]):not(:first-child),[role=search] select:not(:first-child),[role=search]>:not(:first-child){margin-left:0;border-top-left-radius:0;border-bottom-left-radius:0}[role=group] input:not([type=checkbox],[type=radio]):not(:last-child),[role=group] select:not(:last-child),[role=group]>:not(:last-child),[role=search] input:not([type=checkbox],[type=radio]):not(:last-child),[role=search] select:not(:last-child),[role=search]>:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}[role=group] input:not([type=checkbox],[type=radio]):focus,[role=group] select:focus,[role=group]>:focus,[role=search] input:not([type=checkbox],[type=radio]):focus,[role=search] select:focus,[role=search]>:focus{z-index:2}[role=group] [role=button]:not(:first-child),[role=group] [type=button]:not(:first-child),[role=group] [type=reset]:not(:first-child),[role=group] [type=submit]:not(:first-child),[role=group] button:not(:first-child),[role=group] input:not([type=checkbox],[type=radio]):not(:first-child),[role=group] select:not(:first-child),[role=search] [role=button]:not(:first-child),[role=search] [type=button]:not(:first-child),[role=search] [type=reset]:not(:first-child),[role=search] [type=submit]:not(:first-child),[role=search] button:not(:first-child),[role=search] input:not([type=checkbox],[type=radio]):not(:first-child),[role=search] select:not(:first-child){margin-left:calc(var(--pico-border-width) * -1)}[role=group] [role=button],[role=group] [type=button],[role=group] [type=reset],[role=group] [type=submit],[role=group] button,[role=search] [role=button],[role=search] [type=button],[role=search] [type=reset],[role=search] [type=submit],[role=search] button{width:auto}@supports selector(:has(*)){[role=group]:has(button:focus,[type=submit]:focus,[type=button]:focus,[role=button]:focus),[role=search]:has(button:focus,[type=submit]:focus,[type=button]:focus,[role=button]:focus){--pico-group-box-shadow:var(--pico-group-box-shadow-focus-with-button)}[role=group]:has(button:focus,[type=submit]:focus,[type=button]:focus,[role=button]:focus) input:not([type=checkbox],[type=radio]),[role=group]:has(button:focus,[type=submit]:focus,[type=button]:focus,[role=button]:focus) select,[role=search]:has(button:focus,[type=submit]:focus,[type=button]:focus,[role=button]:focus) input:not([type=checkbox],[type=radio]),[role=search]:has(button:focus,[type=submit]:focus,[type=button]:focus,[role=button]:focus) select{border-color:transparent}[role=group]:has(input:not([type=submit],[type=button]):focus,select:focus),[role=search]:has(input:not([type=submit],[type=button]):focus,select:focus){--pico-group-box-shadow:var(--pico-group-box-shadow-focus-with-input)}[role=group]:has(input:not([type=submit],[type=button]):focus,select:focus) [role=button],[role=group]:has(input:not([type=submit],[type=button]):focus,select:focus) [type=button],[role=group]:has(input:not([type=submit],[type=button]):focus,select:focus) [type=submit],[role=group]:has(input:not([type=submit],[type=button]):focus,select:focus) button,[role=search]:has(input:not([type=submit],[type=button]):focus,select:focus) [role=button],[role=search]:has(input:not([type=submit],[type=button]):focus,select:focus) [type=button],[role=search]:has(input:not([type=submit],[type=button]):focus,select:focus) [type=submit],[role=search]:has(input:not([type=submit],[type=button]):focus,select:focus) button{--pico-button-box-shadow:0 0 0 var(--pico-border-width) var(--pico-primary-border);--pico-button-hover-box-shadow:0 0 0 var(--pico-border-width) var(--pico-primary-hover-border)}[role=group] [role=button]:focus,[role=group] [type=button]:focus,[role=group] [type=reset]:focus,[role=group] [type=submit]:focus,[role=group] button:focus,[role=search] [role=button]:focus,[role=search] [type=button]:focus,[role=search] [type=reset]:focus,[role=search] [type=submit]:focus,[role=search] button:focus{box-shadow:none}}[role=search]>:first-child{border-top-left-radius:5rem;border-bottom-left-radius:5rem}[role=search]>:last-child{border-top-right-radius:5rem;border-bottom-right-radius:5rem}[aria-busy=true]:not(input,select,textarea,html,form){white-space:nowrap}[aria-busy=true]:not(input,select,textarea,html,form)::before{display:inline-block;width:1em;height:1em;background-image:var(--pico-icon-loading);background-size:1em auto;background-repeat:no-repeat;content:"";vertical-align:-.125em}[aria-busy=true]:not(input,select,textarea,html,form):not(:empty)::before{margin-inline-end:calc(var(--pico-spacing) * .5)}[aria-busy=true]:not(input,select,textarea,html,form):empty{text-align:center}[role=button][aria-busy=true],[type=button][aria-busy=true],[type=reset][aria-busy=true],[type=submit][aria-busy=true],a[aria-busy=true],button[aria-busy=true]{pointer-events:none}:host,:root{--pico-scrollbar-width:0px}dialog{display:flex;z-index:999;position:fixed;top:0;right:0;bottom:0;left:0;align-items:center;justify-content:center;width:inherit;min-width:100%;height:inherit;min-height:100%;padding:0;border:0;-webkit-backdrop-filter:var(--pico-modal-overlay-backdrop-filter);backdrop-filter:var(--pico-modal-overlay-backdrop-filter);background-color:var(--pico-modal-overlay-background-color);color:var(--pico-color)}dialog>article{width:100%;max-height:calc(100vh - var(--pico-spacing) * 2);margin:var(--pico-spacing);overflow:auto}@media (min-width:576px){dialog>article{max-width:510px}}@media (min-width:768px){dialog>article{max-width:700px}}dialog>article>header>*{margin-bottom:0}dialog>article>header .close,dialog>article>header :is(a,button)[rel=prev]{margin:0;margin-left:var(--pico-spacing);padding:0;float:right}dialog>article>footer{text-align:right}dialog>article>footer [role=button],dialog>article>footer button{margin-bottom:0}dialog>article>footer [role=button]:not(:first-of-type),dialog>article>footer button:not(:first-of-type){margin-left:calc(var(--pico-spacing) * .5)}dialog>article .close,dialog>article :is(a,button)[rel=prev]{display:block;width:1rem;height:1rem;margin-top:calc(var(--pico-spacing) * -1);margin-bottom:var(--pico-spacing);margin-left:auto;border:none;background-image:var(--pico-icon-close);background-position:center;background-size:auto 1rem;background-repeat:no-repeat;background-color:transparent;opacity:.5;transition:opacity var(--pico-transition)}dialog>article .close:is([aria-current]:not([aria-current=false]),:hover,:active,:focus),dialog>article :is(a,button)[rel=prev]:is([aria-current]:not([aria-current=false]),:hover,:active,:focus){opacity:1}dialog:not([open]),dialog[open=false]{display:none}.modal-is-open{padding-right:var(--pico-scrollbar-width,0);overflow:hidden;pointer-events:none;touch-action:none}.modal-is-open dialog{pointer-events:auto;touch-action:auto}:where(.modal-is-opening,.modal-is-closing) dialog,:where(.modal-is-opening,.modal-is-closing) dialog>article{animation-duration:.2s;animation-timing-function:ease-in-out;animation-fill-mode:both}:where(.modal-is-opening,.modal-is-closing) dialog{animation-duration:.8s;animation-name:modal-overlay}:where(.modal-is-opening,.modal-is-closing) dialog>article{animation-delay:.2s;animation-name:modal}.modal-is-closing dialog,.modal-is-closing dialog>article{animation-delay:0s;animation-direction:reverse}@keyframes modal-overlay{from{-webkit-backdrop-filter:none;backdrop-filter:none;background-color:transparent}}@keyframes modal{from{transform:translateY(-100%);opacity:0}}:where(nav li)::before{float:left;content:"​"}nav,nav ul{display:flex}nav{justify-content:space-between;overflow:visible}nav ol,nav ul{align-items:center;margin-bottom:0;padding:0;list-style:none}nav ol:first-of-type,nav ul:first-of-type{margin-left:calc(var(--pico-nav-element-spacing-horizontal) * -1)}nav ol:last-of-type,nav ul:last-of-type{margin-right:calc(var(--pico-nav-element-spacing-horizontal) * -1)}nav li{display:inline-block;margin:0;padding:var(--pico-nav-element-spacing-vertical) var(--pico-nav-element-spacing-horizontal)}nav li :where(a,[role=link]){display:inline-block;margin:calc(var(--pico-nav-link-spacing-vertical) * -1) calc(var(--pico-nav-link-spacing-horizontal) * -1);padding:var(--pico-nav-link-spacing-vertical) var(--pico-nav-link-spacing-horizontal);border-radius:var(--pico-border-radius)}nav li :where(a,[role=link]):not(:hover){text-decoration:none}nav li [role=button],nav li [type=button],nav li button,nav li input:not([type=checkbox],[type=radio],[type=range],[type=file]),nav li select{height:auto;margin-right:inherit;margin-bottom:0;margin-left:inherit;padding:calc(var(--pico-nav-link-spacing-vertical) - var(--pico-border-width) * 2) var(--pico-nav-link-spacing-horizontal)}nav[aria-label=breadcrumb]{align-items:center;justify-content:start}nav[aria-label=breadcrumb] ul li:not(:first-child){margin-inline-start:var(--pico-nav-link-spacing-horizontal)}nav[aria-label=breadcrumb] ul li a{margin:calc(var(--pico-nav-link-spacing-vertical) * -1) 0;margin-inline-start:calc(var(--pico-nav-link-spacing-horizontal) * -1)}nav[aria-label=breadcrumb] ul li:not(:last-child)::after{display:inline-block;position:absolute;width:calc(var(--pico-nav-link-spacing-horizontal) * 4);margin:0 calc(var(--pico-nav-link-spacing-horizontal) * -1);content:var(--pico-nav-breadcrumb-divider);color:var(--pico-muted-color);text-align:center;text-decoration:none;white-space:nowrap}nav[aria-label=breadcrumb] a[aria-current]:not([aria-current=false]){background-color:transparent;color:inherit;text-decoration:none;pointer-events:none}aside li,aside nav,aside ol,aside ul{display:block}aside li{padding:calc(var(--pico-nav-element-spacing-vertical) * .5) var(--pico-nav-element-spacing-horizontal)}aside li a{display:block}aside li [role=button]{margin:inherit}[dir=rtl] nav[aria-label=breadcrumb] ul li:not(:last-child) ::after{content:"\\"}progress{display:inline-block;vertical-align:baseline}progress{-webkit-appearance:none;-moz-appearance:none;display:inline-block;appearance:none;width:100%;height:.5rem;margin-bottom:calc(var(--pico-spacing) * .5);overflow:hidden;border:0;border-radius:var(--pico-border-radius);background-color:var(--pico-progress-background-color);color:var(--pico-progress-color)}progress::-webkit-progress-bar{border-radius:var(--pico-border-radius);background:0 0}progress[value]::-webkit-progress-value{background-color:var(--pico-progress-color);-webkit-transition:inline-size var(--pico-transition);transition:inline-size var(--pico-transition)}progress::-moz-progress-bar{background-color:var(--pico-progress-color)}@media (prefers-reduced-motion:no-preference){progress:indeterminate{background:var(--pico-progress-background-color) linear-gradient(to right,var(--pico-progress-color) 30%,var(--pico-progress-background-color) 30%) top left/150% 150% no-repeat;animation:progress-indeterminate 1s linear infinite}progress:indeterminate[value]::-webkit-progress-value{background-color:transparent}progress:indeterminate::-moz-progress-bar{background-color:transparent}}@media (prefers-reduced-motion:no-preference){[dir=rtl] progress:indeterminate{animation-direction:reverse}}@keyframes progress-indeterminate{0%{background-position:200% 0}100%{background-position:-200% 0}}[data-tooltip]{position:relative}[data-tooltip]:not(a,button,input,[role=button]){border-bottom:1px dotted;text-decoration:none;cursor:help}[data-tooltip]::after,[data-tooltip]::before,[data-tooltip][data-placement=top]::after,[data-tooltip][data-placement=top]::before{display:block;z-index:99;position:absolute;bottom:100%;left:50%;padding:.25rem .5rem;overflow:hidden;transform:translate(-50%,-.25rem);border-radius:var(--pico-border-radius);background:var(--pico-tooltip-background-color);content:attr(data-tooltip);color:var(--pico-tooltip-color);font-style:normal;font-weight:var(--pico-font-weight);font-size:.875rem;text-decoration:none;text-overflow:ellipsis;white-space:nowrap;opacity:0;pointer-events:none}[data-tooltip]::after,[data-tooltip][data-placement=top]::after{padding:0;transform:translate(-50%,0);border-top:.3rem solid;border-right:.3rem solid transparent;border-left:.3rem solid transparent;border-radius:0;background-color:transparent;content:"";color:var(--pico-tooltip-background-color)}[data-tooltip][data-placement=bottom]::after,[data-tooltip][data-placement=bottom]::before{top:100%;bottom:auto;transform:translate(-50%,.25rem)}[data-tooltip][data-placement=bottom]:after{transform:translate(-50%,-.3rem);border:.3rem solid transparent;border-bottom:.3rem solid}[data-tooltip][data-placement=left]::after,[data-tooltip][data-placement=left]::before{top:50%;right:100%;bottom:auto;left:auto;transform:translate(-.25rem,-50%)}[data-tooltip][data-placement=left]:after{transform:translate(.3rem,-50%);border:.3rem solid transparent;border-left:.3rem solid}[data-tooltip][data-placement=right]::after,[data-tooltip][data-placement=right]::before{top:50%;right:auto;bottom:auto;left:100%;transform:translate(.25rem,-50%)}[data-tooltip][data-placement=right]:after{transform:translate(-.3rem,-50%);border:.3rem solid transparent;border-right:.3rem solid}[data-tooltip]:focus::after,[data-tooltip]:focus::before,[data-tooltip]:hover::after,[data-tooltip]:hover::before{opacity:1}@media (hover:hover) and (pointer:fine){[data-tooltip]:focus::after,[data-tooltip]:focus::before,[data-tooltip]:hover::after,[data-tooltip]:hover::before{--pico-tooltip-slide-to:translate(-50%, -0.25rem);transform:translate(-50%,.75rem);animation-duration:.2s;animation-fill-mode:forwards;animation-name:tooltip-slide;opacity:0}[data-tooltip]:focus::after,[data-tooltip]:hover::after{--pico-tooltip-caret-slide-to:translate(-50%, 0rem);transform:translate(-50%,-.25rem);animation-name:tooltip-caret-slide}[data-tooltip][data-placement=bottom]:focus::after,[data-tooltip][data-placement=bottom]:focus::before,[data-tooltip][data-placement=bottom]:hover::after,[data-tooltip][data-placement=bottom]:hover::before{--pico-tooltip-slide-to:translate(-50%, 0.25rem);transform:translate(-50%,-.75rem);animation-name:tooltip-slide}[data-tooltip][data-placement=bottom]:focus::after,[data-tooltip][data-placement=bottom]:hover::after{--pico-tooltip-caret-slide-to:translate(-50%, -0.3rem);transform:translate(-50%,-.5rem);animation-name:tooltip-caret-slide}[data-tooltip][data-placement=left]:focus::after,[data-tooltip][data-placement=left]:focus::before,[data-tooltip][data-placement=left]:hover::after,[data-tooltip][data-placement=left]:hover::before{--pico-tooltip-slide-to:translate(-0.25rem, -50%);transform:translate(.75rem,-50%);animation-name:tooltip-slide}[data-tooltip][data-placement=left]:focus::after,[data-tooltip][data-placement=left]:hover::after{--pico-tooltip-caret-slide-to:translate(0.3rem, -50%);transform:translate(.05rem,-50%);animation-name:tooltip-caret-slide}[data-tooltip][data-placement=right]:focus::after,[data-tooltip][data-placement=right]:focus::before,[data-tooltip][data-placement=right]:hover::after,[data-tooltip][data-placement=right]:hover::before{--pico-tooltip-slide-to:translate(0.25rem, -50%);transform:translate(-.75rem,-50%);animation-name:tooltip-slide}[data-tooltip][data-placement=right]:focus::after,[data-tooltip][data-placement=right]:hover::after{--pico-tooltip-caret-slide-to:translate(-0.3rem, -50%);transform:translate(-.05rem,-50%);animation-name:tooltip-caret-slide}}@keyframes tooltip-slide{to{transform:var(--pico-tooltip-slide-to);opacity:1}}@keyframes tooltip-caret-slide{50%{opacity:0}to{transform:var(--pico-tooltip-caret-slide-to);opacity:1}}[aria-controls]{cursor:pointer}[aria-disabled=true],[disabled]{cursor:not-allowed}[aria-hidden=false][hidden]{display:initial}[aria-hidden=false][hidden]:not(:focus){clip:rect(0,0,0,0);position:absolute}[tabindex],a,area,button,input,label,select,summary,textarea{-ms-touch-action:manipulation}[dir=rtl]{direction:rtl}@media (prefers-reduced-motion:reduce){:not([aria-busy=true]),:not([aria-busy=true])::after,:not([aria-busy=true])::before{background-attachment:initial!important;animation-duration:1ms!important;animation-delay:-1ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-delay:0s!important;transition-duration:0s!important}}
\ No newline at end of file
diff --git a/hugo/static/img/alphabreed.png b/hugo/static/img/alphabreed.png
new file mode 100644
index 0000000..f07ba46
Binary files /dev/null and b/hugo/static/img/alphabreed.png differ
diff --git a/hugo/static/img/comicnav.svg b/hugo/static/img/comicnav.svg
new file mode 100644
index 0000000..89c6cf0
--- /dev/null
+++ b/hugo/static/img/comicnav.svg
@@ -0,0 +1,21 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" id="svg8" version="1.1" viewBox="0 0 200 30" height="30" width="200">
+  <defs id="defs2"/>
+  <metadata id="metadata5">
+    <rdf:RDF>
+      <cc:Work rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage"/>
+        <dc:title/>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g transform="translate(0,-303.77081)" id="layer1">
+    <path id="path817" d="m 50,303.77081 -40,14.70001 40,15.29999 z" style="fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.69282031px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"/>
+    <rect y="303.77081" x="0" height="29.999996" width="10" id="rect819" style="fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:2.62703514;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"/>
+    <path id="path817-3" d="M 100.00001,303.77081 60,318.47082 l 40.00001,15.29999 z" style="fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.69282031px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"/>
+    <path id="path817-3-6" d="M 100,303.77081 140.00001,318.47082 100,333.77081 Z" style="fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.69282031px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"/>
+    <path id="path817-3-6-7" d="M 150,303.77081 190.00001,318.47082 150,333.77081 Z" style="fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.69282031px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"/>
+    <rect y="303.77081" x="190" height="29.999996" width="10" id="rect819-5" style="fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:2.62703514;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"/>
+  </g>
+</svg>
\ No newline at end of file
diff --git a/hugo/static/img/favicon-bookmarks.ico b/hugo/static/img/favicon-bookmarks.ico
new file mode 100644
index 0000000..1c5c257
Binary files /dev/null and b/hugo/static/img/favicon-bookmarks.ico differ
diff --git a/hugo/static/img/favicon-notes.ico b/hugo/static/img/favicon-notes.ico
new file mode 100644
index 0000000..f0eb22c
Binary files /dev/null and b/hugo/static/img/favicon-notes.ico differ
diff --git a/hugo/static/img/favicon.ico b/hugo/static/img/favicon.ico
new file mode 100644
index 0000000..953d2ed
Binary files /dev/null and b/hugo/static/img/favicon.ico differ
diff --git a/hugo/static/js/alpine-3.15.3.min.js b/hugo/static/js/alpine-3.15.3.min.js
new file mode 100644
index 0000000..2a6849c
--- /dev/null
+++ b/hugo/static/js/alpine-3.15.3.min.js
@@ -0,0 +1,5 @@
+(()=>{var nt=!1,it=!1,G=[],ot=-1;function Ut(e){In(e)}function In(e){G.includes(e)||G.push(e),$n()}function Wt(e){let t=G.indexOf(e);t!==-1&&t>ot&&G.splice(t,1)}function $n(){!it&&!nt&&(nt=!0,queueMicrotask(Ln))}function Ln(){nt=!1,it=!0;for(let e=0;e<G.length;e++)G[e](),ot=e;G.length=0,ot=-1,it=!1}var R,N,F,at,st=!0;function Gt(e){st=!1,e(),st=!0}function Jt(e){R=e.reactive,F=e.release,N=t=>e.effect(t,{scheduler:r=>{st?Ut(r):r()}}),at=e.raw}function ct(e){N=e}function Yt(e){let t=()=>{};return[n=>{let i=N(n);return e._x_effects||(e._x_effects=new Set,e._x_runEffects=()=>{e._x_effects.forEach(o=>o())}),e._x_effects.add(i),t=()=>{i!==void 0&&(e._x_effects.delete(i),F(i))},i},()=>{t()}]}function Oe(e,t){let r=!0,n,i=N(()=>{let o=e();JSON.stringify(o),r?n=o:queueMicrotask(()=>{t(o,n),n=o}),r=!1});return()=>F(i)}var Xt=[],Zt=[],Qt=[];function er(e){Qt.push(e)}function re(e,t){typeof t=="function"?(e._x_cleanups||(e._x_cleanups=[]),e._x_cleanups.push(t)):(t=e,Zt.push(t))}function Re(e){Xt.push(e)}function Te(e,t,r){e._x_attributeCleanups||(e._x_attributeCleanups={}),e._x_attributeCleanups[t]||(e._x_attributeCleanups[t]=[]),e._x_attributeCleanups[t].push(r)}function lt(e,t){e._x_attributeCleanups&&Object.entries(e._x_attributeCleanups).forEach(([r,n])=>{(t===void 0||t.includes(r))&&(n.forEach(i=>i()),delete e._x_attributeCleanups[r])})}function tr(e){for(e._x_effects?.forEach(Wt);e._x_cleanups?.length;)e._x_cleanups.pop()()}var ut=new MutationObserver(mt),ft=!1;function pe(){ut.observe(document,{subtree:!0,childList:!0,attributes:!0,attributeOldValue:!0}),ft=!0}function dt(){jn(),ut.disconnect(),ft=!1}var de=[];function jn(){let e=ut.takeRecords();de.push(()=>e.length>0&&mt(e));let t=de.length;queueMicrotask(()=>{if(de.length===t)for(;de.length>0;)de.shift()()})}function m(e){if(!ft)return e();dt();let t=e();return pe(),t}var pt=!1,Ce=[];function rr(){pt=!0}function nr(){pt=!1,mt(Ce),Ce=[]}function mt(e){if(pt){Ce=Ce.concat(e);return}let t=[],r=new Set,n=new Map,i=new Map;for(let o=0;o<e.length;o++)if(!e[o].target._x_ignoreMutationObserver&&(e[o].type==="childList"&&(e[o].removedNodes.forEach(s=>{s.nodeType===1&&s._x_marker&&r.add(s)}),e[o].addedNodes.forEach(s=>{if(s.nodeType===1){if(r.has(s)){r.delete(s);return}s._x_marker||t.push(s)}})),e[o].type==="attributes")){let s=e[o].target,a=e[o].attributeName,c=e[o].oldValue,l=()=>{n.has(s)||n.set(s,[]),n.get(s).push({name:a,value:s.getAttribute(a)})},u=()=>{i.has(s)||i.set(s,[]),i.get(s).push(a)};s.hasAttribute(a)&&c===null?l():s.hasAttribute(a)?(u(),l()):u()}i.forEach((o,s)=>{lt(s,o)}),n.forEach((o,s)=>{Xt.forEach(a=>a(s,o))});for(let o of r)t.some(s=>s.contains(o))||Zt.forEach(s=>s(o));for(let o of t)o.isConnected&&Qt.forEach(s=>s(o));t=null,r=null,n=null,i=null}function Me(e){return k(B(e))}function D(e,t,r){return e._x_dataStack=[t,...B(r||e)],()=>{e._x_dataStack=e._x_dataStack.filter(n=>n!==t)}}function B(e){return e._x_dataStack?e._x_dataStack:typeof ShadowRoot=="function"&&e instanceof ShadowRoot?B(e.host):e.parentNode?B(e.parentNode):[]}function k(e){return new Proxy({objects:e},Fn)}var Fn={ownKeys({objects:e}){return Array.from(new Set(e.flatMap(t=>Object.keys(t))))},has({objects:e},t){return t==Symbol.unscopables?!1:e.some(r=>Object.prototype.hasOwnProperty.call(r,t)||Reflect.has(r,t))},get({objects:e},t,r){return t=="toJSON"?Bn:Reflect.get(e.find(n=>Reflect.has(n,t))||{},t,r)},set({objects:e},t,r,n){let i=e.find(s=>Object.prototype.hasOwnProperty.call(s,t))||e[e.length-1],o=Object.getOwnPropertyDescriptor(i,t);return o?.set&&o?.get?o.set.call(n,r)||!0:Reflect.set(i,t,r)}};function Bn(){return Reflect.ownKeys(this).reduce((t,r)=>(t[r]=Reflect.get(this,r),t),{})}function ne(e){let t=n=>typeof n=="object"&&!Array.isArray(n)&&n!==null,r=(n,i="")=>{Object.entries(Object.getOwnPropertyDescriptors(n)).forEach(([o,{value:s,enumerable:a}])=>{if(a===!1||s===void 0||typeof s=="object"&&s!==null&&s.__v_skip)return;let c=i===""?o:`${i}.${o}`;typeof s=="object"&&s!==null&&s._x_interceptor?n[o]=s.initialize(e,c,o):t(s)&&s!==n&&!(s instanceof Element)&&r(s,c)})};return r(e)}function Ne(e,t=()=>{}){let r={initialValue:void 0,_x_interceptor:!0,initialize(n,i,o){return e(this.initialValue,()=>zn(n,i),s=>ht(n,i,s),i,o)}};return t(r),n=>{if(typeof n=="object"&&n!==null&&n._x_interceptor){let i=r.initialize.bind(r);r.initialize=(o,s,a)=>{let c=n.initialize(o,s,a);return r.initialValue=c,i(o,s,a)}}else r.initialValue=n;return r}}function zn(e,t){return t.split(".").reduce((r,n)=>r[n],e)}function ht(e,t,r){if(typeof t=="string"&&(t=t.split(".")),t.length===1)e[t[0]]=r;else{if(t.length===0)throw error;return e[t[0]]||(e[t[0]]={}),ht(e[t[0]],t.slice(1),r)}}var ir={};function y(e,t){ir[e]=t}function K(e,t){let r=Hn(t);return Object.entries(ir).forEach(([n,i])=>{Object.defineProperty(e,`$${n}`,{get(){return i(t,r)},enumerable:!1})}),e}function Hn(e){let[t,r]=_t(e),n={interceptor:Ne,...t};return re(e,r),n}function or(e,t,r,...n){try{return r(...n)}catch(i){ie(i,e,t)}}function ie(...e){return sr(...e)}var sr=Kn;function ar(e){sr=e}function Kn(e,t,r=void 0){e=Object.assign(e??{message:"No error message given."},{el:t,expression:r}),console.warn(`Alpine Expression Error: ${e.message}
+
+${r?'Expression: "'+r+`"
+
+`:""}`,t),setTimeout(()=>{throw e},0)}var oe=!0;function De(e){let t=oe;oe=!1;let r=e();return oe=t,r}function T(e,t,r={}){let n;return x(e,t)(i=>n=i,r),n}function x(...e){return cr(...e)}var cr=xt;function lr(e){cr=e}var ur;function fr(e){ur=e}function xt(e,t){let r={};K(r,e);let n=[r,...B(e)],i=typeof t=="function"?Vn(n,t):Un(n,t,e);return or.bind(null,e,t,i)}function Vn(e,t){return(r=()=>{},{scope:n={},params:i=[],context:o}={})=>{if(!oe){me(r,t,k([n,...e]),i);return}let s=t.apply(k([n,...e]),i);me(r,s)}}var gt={};function qn(e,t){if(gt[e])return gt[e];let r=Object.getPrototypeOf(async function(){}).constructor,n=/^[\n\s]*if.*\(.*\)/.test(e.trim())||/^(let|const)\s/.test(e.trim())?`(async()=>{ ${e} })()`:e,o=(()=>{try{let s=new r(["__self","scope"],`with (scope) { __self.result = ${n} }; __self.finished = true; return __self.result;`);return Object.defineProperty(s,"name",{value:`[Alpine] ${e}`}),s}catch(s){return ie(s,t,e),Promise.resolve()}})();return gt[e]=o,o}function Un(e,t,r){let n=qn(t,r);return(i=()=>{},{scope:o={},params:s=[],context:a}={})=>{n.result=void 0,n.finished=!1;let c=k([o,...e]);if(typeof n=="function"){let l=n.call(a,n,c).catch(u=>ie(u,r,t));n.finished?(me(i,n.result,c,s,r),n.result=void 0):l.then(u=>{me(i,u,c,s,r)}).catch(u=>ie(u,r,t)).finally(()=>n.result=void 0)}}}function me(e,t,r,n,i){if(oe&&typeof t=="function"){let o=t.apply(r,n);o instanceof Promise?o.then(s=>me(e,s,r,n)).catch(s=>ie(s,i,t)):e(o)}else typeof t=="object"&&t instanceof Promise?t.then(o=>e(o)):e(t)}function dr(...e){return ur(...e)}function pr(e,t,r={}){let n={};K(n,e);let i=[n,...B(e)],o=k([r.scope??{},...i]),s=r.params??[];if(t.includes("await")){let a=Object.getPrototypeOf(async function(){}).constructor,c=/^[\n\s]*if.*\(.*\)/.test(t.trim())||/^(let|const)\s/.test(t.trim())?`(async()=>{ ${t} })()`:t;return new a(["scope"],`with (scope) { let __result = ${c}; return __result }`).call(r.context,o)}else{let a=/^[\n\s]*if.*\(.*\)/.test(t.trim())||/^(let|const)\s/.test(t.trim())?`(()=>{ ${t} })()`:t,l=new Function(["scope"],`with (scope) { let __result = ${a}; return __result }`).call(r.context,o);return typeof l=="function"&&oe?l.apply(o,s):l}}var wt="x-";function C(e=""){return wt+e}function mr(e){wt=e}var ke={};function d(e,t){return ke[e]=t,{before(r){if(!ke[r]){console.warn(String.raw`Cannot find directive \`${r}\`. \`${e}\` will use the default order of execution`);return}let n=J.indexOf(r);J.splice(n>=0?n:J.indexOf("DEFAULT"),0,e)}}}function hr(e){return Object.keys(ke).includes(e)}function _e(e,t,r){if(t=Array.from(t),e._x_virtualDirectives){let o=Object.entries(e._x_virtualDirectives).map(([a,c])=>({name:a,value:c})),s=Et(o);o=o.map(a=>s.find(c=>c.name===a.name)?{name:`x-bind:${a.name}`,value:`"${a.value}"`}:a),t=t.concat(o)}let n={};return t.map(xr((o,s)=>n[o]=s)).filter(br).map(Gn(n,r)).sort(Jn).map(o=>Wn(e,o))}function Et(e){return Array.from(e).map(xr()).filter(t=>!br(t))}var yt=!1,he=new Map,_r=Symbol();function gr(e){yt=!0;let t=Symbol();_r=t,he.set(t,[]);let r=()=>{for(;he.get(t).length;)he.get(t).shift()();he.delete(t)},n=()=>{yt=!1,r()};e(r),n()}function _t(e){let t=[],r=a=>t.push(a),[n,i]=Yt(e);return t.push(i),[{Alpine:z,effect:n,cleanup:r,evaluateLater:x.bind(x,e),evaluate:T.bind(T,e)},()=>t.forEach(a=>a())]}function Wn(e,t){let r=()=>{},n=ke[t.type]||r,[i,o]=_t(e);Te(e,t.original,o);let s=()=>{e._x_ignore||e._x_ignoreSelf||(n.inline&&n.inline(e,t,i),n=n.bind(n,e,t,i),yt?he.get(_r).push(n):n())};return s.runCleanups=o,s}var Pe=(e,t)=>({name:r,value:n})=>(r.startsWith(e)&&(r=r.replace(e,t)),{name:r,value:n}),Ie=e=>e;function xr(e=()=>{}){return({name:t,value:r})=>{let{name:n,value:i}=yr.reduce((o,s)=>s(o),{name:t,value:r});return n!==t&&e(n,t),{name:n,value:i}}}var yr=[];function se(e){yr.push(e)}function br({name:e}){return wr().test(e)}var wr=()=>new RegExp(`^${wt}([^:^.]+)\\b`);function Gn(e,t){return({name:r,value:n})=>{let i=r.match(wr()),o=r.match(/:([a-zA-Z0-9\-_:]+)/),s=r.match(/\.[^.\]]+(?=[^\]]*$)/g)||[],a=t||e[r]||r;return{type:i?i[1]:null,value:o?o[1]:null,modifiers:s.map(c=>c.replace(".","")),expression:n,original:a}}}var bt="DEFAULT",J=["ignore","ref","data","id","anchor","bind","init","for","model","modelable","transition","show","if",bt,"teleport"];function Jn(e,t){let r=J.indexOf(e.type)===-1?bt:e.type,n=J.indexOf(t.type)===-1?bt:t.type;return J.indexOf(r)-J.indexOf(n)}function Y(e,t,r={}){e.dispatchEvent(new CustomEvent(t,{detail:r,bubbles:!0,composed:!0,cancelable:!0}))}function P(e,t){if(typeof ShadowRoot=="function"&&e instanceof ShadowRoot){Array.from(e.children).forEach(i=>P(i,t));return}let r=!1;if(t(e,()=>r=!0),r)return;let n=e.firstElementChild;for(;n;)P(n,t,!1),n=n.nextElementSibling}function E(e,...t){console.warn(`Alpine Warning: ${e}`,...t)}var Er=!1;function vr(){Er&&E("Alpine has already been initialized on this page. Calling Alpine.start() more than once can cause problems."),Er=!0,document.body||E("Unable to initialize. Trying to load Alpine before `<body>` is available. Did you forget to add `defer` in Alpine's `<script>` tag?"),Y(document,"alpine:init"),Y(document,"alpine:initializing"),pe(),er(t=>S(t,P)),re(t=>$(t)),Re((t,r)=>{_e(t,r).forEach(n=>n())});let e=t=>!X(t.parentElement,!0);Array.from(document.querySelectorAll(Or().join(","))).filter(e).forEach(t=>{S(t)}),Y(document,"alpine:initialized"),setTimeout(()=>{Xn()})}var vt=[],Sr=[];function Ar(){return vt.map(e=>e())}function Or(){return vt.concat(Sr).map(e=>e())}function $e(e){vt.push(e)}function Le(e){Sr.push(e)}function X(e,t=!1){return I(e,r=>{if((t?Or():Ar()).some(i=>r.matches(i)))return!0})}function I(e,t){if(e){if(t(e))return e;if(e._x_teleportBack&&(e=e._x_teleportBack),e.parentNode instanceof ShadowRoot)return I(e.parentNode.host,t);if(e.parentElement)return I(e.parentElement,t)}}function Cr(e){return Ar().some(t=>e.matches(t))}var Rr=[];function Tr(e){Rr.push(e)}var Yn=1;function S(e,t=P,r=()=>{}){I(e,n=>n._x_ignore)||gr(()=>{t(e,(n,i)=>{n._x_marker||(r(n,i),Rr.forEach(o=>o(n,i)),_e(n,n.attributes).forEach(o=>o()),n._x_ignore||(n._x_marker=Yn++),n._x_ignore&&i())})})}function $(e,t=P){t(e,r=>{tr(r),lt(r),delete r._x_marker})}function Xn(){[["ui","dialog",["[x-dialog], [x-popover]"]],["anchor","anchor",["[x-anchor]"]],["sort","sort",["[x-sort]"]]].forEach(([t,r,n])=>{hr(r)||n.some(i=>{if(document.querySelector(i))return E(`found "${i}", but missing ${t} plugin`),!0})})}var St=[],At=!1;function ae(e=()=>{}){return queueMicrotask(()=>{At||setTimeout(()=>{je()})}),new Promise(t=>{St.push(()=>{e(),t()})})}function je(){for(At=!1;St.length;)St.shift()()}function Mr(){At=!0}function ge(e,t){return Array.isArray(t)?Nr(e,t.join(" ")):typeof t=="object"&&t!==null?Zn(e,t):typeof t=="function"?ge(e,t()):Nr(e,t)}function Nr(e,t){let r=o=>o.split(" ").filter(Boolean),n=o=>o.split(" ").filter(s=>!e.classList.contains(s)).filter(Boolean),i=o=>(e.classList.add(...o),()=>{e.classList.remove(...o)});return t=t===!0?t="":t||"",i(n(t))}function Zn(e,t){let r=a=>a.split(" ").filter(Boolean),n=Object.entries(t).flatMap(([a,c])=>c?r(a):!1).filter(Boolean),i=Object.entries(t).flatMap(([a,c])=>c?!1:r(a)).filter(Boolean),o=[],s=[];return i.forEach(a=>{e.classList.contains(a)&&(e.classList.remove(a),s.push(a))}),n.forEach(a=>{e.classList.contains(a)||(e.classList.add(a),o.push(a))}),()=>{s.forEach(a=>e.classList.add(a)),o.forEach(a=>e.classList.remove(a))}}function Z(e,t){return typeof t=="object"&&t!==null?Qn(e,t):ei(e,t)}function Qn(e,t){let r={};return Object.entries(t).forEach(([n,i])=>{r[n]=e.style[n],n.startsWith("--")||(n=ti(n)),e.style.setProperty(n,i)}),setTimeout(()=>{e.style.length===0&&e.removeAttribute("style")}),()=>{Z(e,r)}}function ei(e,t){let r=e.getAttribute("style",t);return e.setAttribute("style",t),()=>{e.setAttribute("style",r||"")}}function ti(e){return e.replace(/([a-z])([A-Z])/g,"$1-$2").toLowerCase()}function xe(e,t=()=>{}){let r=!1;return function(){r?t.apply(this,arguments):(r=!0,e.apply(this,arguments))}}d("transition",(e,{value:t,modifiers:r,expression:n},{evaluate:i})=>{typeof n=="function"&&(n=i(n)),n!==!1&&(!n||typeof n=="boolean"?ni(e,r,t):ri(e,n,t))});function ri(e,t,r){Dr(e,ge,""),{enter:i=>{e._x_transition.enter.during=i},"enter-start":i=>{e._x_transition.enter.start=i},"enter-end":i=>{e._x_transition.enter.end=i},leave:i=>{e._x_transition.leave.during=i},"leave-start":i=>{e._x_transition.leave.start=i},"leave-end":i=>{e._x_transition.leave.end=i}}[r](t)}function ni(e,t,r){Dr(e,Z);let n=!t.includes("in")&&!t.includes("out")&&!r,i=n||t.includes("in")||["enter"].includes(r),o=n||t.includes("out")||["leave"].includes(r);t.includes("in")&&!n&&(t=t.filter((g,b)=>b<t.indexOf("out"))),t.includes("out")&&!n&&(t=t.filter((g,b)=>b>t.indexOf("out")));let s=!t.includes("opacity")&&!t.includes("scale"),a=s||t.includes("opacity"),c=s||t.includes("scale"),l=a?0:1,u=c?ye(t,"scale",95)/100:1,p=ye(t,"delay",0)/1e3,h=ye(t,"origin","center"),w="opacity, transform",H=ye(t,"duration",150)/1e3,Ae=ye(t,"duration",75)/1e3,f="cubic-bezier(0.4, 0.0, 0.2, 1)";i&&(e._x_transition.enter.during={transformOrigin:h,transitionDelay:`${p}s`,transitionProperty:w,transitionDuration:`${H}s`,transitionTimingFunction:f},e._x_transition.enter.start={opacity:l,transform:`scale(${u})`},e._x_transition.enter.end={opacity:1,transform:"scale(1)"}),o&&(e._x_transition.leave.during={transformOrigin:h,transitionDelay:`${p}s`,transitionProperty:w,transitionDuration:`${Ae}s`,transitionTimingFunction:f},e._x_transition.leave.start={opacity:1,transform:"scale(1)"},e._x_transition.leave.end={opacity:l,transform:`scale(${u})`})}function Dr(e,t,r={}){e._x_transition||(e._x_transition={enter:{during:r,start:r,end:r},leave:{during:r,start:r,end:r},in(n=()=>{},i=()=>{}){Fe(e,t,{during:this.enter.during,start:this.enter.start,end:this.enter.end},n,i)},out(n=()=>{},i=()=>{}){Fe(e,t,{during:this.leave.during,start:this.leave.start,end:this.leave.end},n,i)}})}window.Element.prototype._x_toggleAndCascadeWithTransitions=function(e,t,r,n){let i=document.visibilityState==="visible"?requestAnimationFrame:setTimeout,o=()=>i(r);if(t){e._x_transition&&(e._x_transition.enter||e._x_transition.leave)?e._x_transition.enter&&(Object.entries(e._x_transition.enter.during).length||Object.entries(e._x_transition.enter.start).length||Object.entries(e._x_transition.enter.end).length)?e._x_transition.in(r):o():e._x_transition?e._x_transition.in(r):o();return}e._x_hidePromise=e._x_transition?new Promise((s,a)=>{e._x_transition.out(()=>{},()=>s(n)),e._x_transitioning&&e._x_transitioning.beforeCancel(()=>a({isFromCancelledTransition:!0}))}):Promise.resolve(n),queueMicrotask(()=>{let s=kr(e);s?(s._x_hideChildren||(s._x_hideChildren=[]),s._x_hideChildren.push(e)):i(()=>{let a=c=>{let l=Promise.all([c._x_hidePromise,...(c._x_hideChildren||[]).map(a)]).then(([u])=>u?.());return delete c._x_hidePromise,delete c._x_hideChildren,l};a(e).catch(c=>{if(!c.isFromCancelledTransition)throw c})})})};function kr(e){let t=e.parentNode;if(t)return t._x_hidePromise?t:kr(t)}function Fe(e,t,{during:r,start:n,end:i}={},o=()=>{},s=()=>{}){if(e._x_transitioning&&e._x_transitioning.cancel(),Object.keys(r).length===0&&Object.keys(n).length===0&&Object.keys(i).length===0){o(),s();return}let a,c,l;ii(e,{start(){a=t(e,n)},during(){c=t(e,r)},before:o,end(){a(),l=t(e,i)},after:s,cleanup(){c(),l()}})}function ii(e,t){let r,n,i,o=xe(()=>{m(()=>{r=!0,n||t.before(),i||(t.end(),je()),t.after(),e.isConnected&&t.cleanup(),delete e._x_transitioning})});e._x_transitioning={beforeCancels:[],beforeCancel(s){this.beforeCancels.push(s)},cancel:xe(function(){for(;this.beforeCancels.length;)this.beforeCancels.shift()();o()}),finish:o},m(()=>{t.start(),t.during()}),Mr(),requestAnimationFrame(()=>{if(r)return;let s=Number(getComputedStyle(e).transitionDuration.replace(/,.*/,"").replace("s",""))*1e3,a=Number(getComputedStyle(e).transitionDelay.replace(/,.*/,"").replace("s",""))*1e3;s===0&&(s=Number(getComputedStyle(e).animationDuration.replace("s",""))*1e3),m(()=>{t.before()}),n=!0,requestAnimationFrame(()=>{r||(m(()=>{t.end()}),je(),setTimeout(e._x_transitioning.finish,s+a),i=!0)})})}function ye(e,t,r){if(e.indexOf(t)===-1)return r;let n=e[e.indexOf(t)+1];if(!n||t==="scale"&&isNaN(n))return r;if(t==="duration"||t==="delay"){let i=n.match(/([0-9]+)ms/);if(i)return i[1]}return t==="origin"&&["top","right","left","center","bottom"].includes(e[e.indexOf(t)+2])?[n,e[e.indexOf(t)+2]].join(" "):n}var L=!1;function A(e,t=()=>{}){return(...r)=>L?t(...r):e(...r)}function Pr(e){return(...t)=>L&&e(...t)}var Ir=[];function V(e){Ir.push(e)}function $r(e,t){Ir.forEach(r=>r(e,t)),L=!0,jr(()=>{S(t,(r,n)=>{n(r,()=>{})})}),L=!1}var Be=!1;function Lr(e,t){t._x_dataStack||(t._x_dataStack=e._x_dataStack),L=!0,Be=!0,jr(()=>{oi(t)}),L=!1,Be=!1}function oi(e){let t=!1;S(e,(n,i)=>{P(n,(o,s)=>{if(t&&Cr(o))return s();t=!0,i(o,s)})})}function jr(e){let t=N;ct((r,n)=>{let i=t(r);return F(i),()=>{}}),e(),ct(t)}function be(e,t,r,n=[]){switch(e._x_bindings||(e._x_bindings=R({})),e._x_bindings[t]=r,t=n.includes("camel")?pi(t):t,t){case"value":si(e,r);break;case"style":ci(e,r);break;case"class":ai(e,r);break;case"selected":case"checked":li(e,t,r);break;default:Br(e,t,r);break}}function si(e,t){if(Ot(e))e.attributes.value===void 0&&(e.value=t),window.fromModel&&(typeof t=="boolean"?e.checked=we(e.value)===t:e.checked=Fr(e.value,t));else if(ze(e))Number.isInteger(t)?e.value=t:!Array.isArray(t)&&typeof t!="boolean"&&![null,void 0].includes(t)?e.value=String(t):Array.isArray(t)?e.checked=t.some(r=>Fr(r,e.value)):e.checked=!!t;else if(e.tagName==="SELECT")di(e,t);else{if(e.value===t)return;e.value=t===void 0?"":t}}function ai(e,t){e._x_undoAddedClasses&&e._x_undoAddedClasses(),e._x_undoAddedClasses=ge(e,t)}function ci(e,t){e._x_undoAddedStyles&&e._x_undoAddedStyles(),e._x_undoAddedStyles=Z(e,t)}function li(e,t,r){Br(e,t,r),fi(e,t,r)}function Br(e,t,r){[null,void 0,!1].includes(r)&&hi(t)?e.removeAttribute(t):(zr(t)&&(r=t),ui(e,t,r))}function ui(e,t,r){e.getAttribute(t)!=r&&e.setAttribute(t,r)}function fi(e,t,r){e[t]!==r&&(e[t]=r)}function di(e,t){let r=[].concat(t).map(n=>n+"");Array.from(e.options).forEach(n=>{n.selected=r.includes(n.value)})}function pi(e){return e.toLowerCase().replace(/-(\w)/g,(t,r)=>r.toUpperCase())}function Fr(e,t){return e==t}function we(e){return[1,"1","true","on","yes",!0].includes(e)?!0:[0,"0","false","off","no",!1].includes(e)?!1:e?Boolean(e):null}var mi=new Set(["allowfullscreen","async","autofocus","autoplay","checked","controls","default","defer","disabled","formnovalidate","inert","ismap","itemscope","loop","multiple","muted","nomodule","novalidate","open","playsinline","readonly","required","reversed","selected","shadowrootclonable","shadowrootdelegatesfocus","shadowrootserializable"]);function zr(e){return mi.has(e)}function hi(e){return!["aria-pressed","aria-checked","aria-expanded","aria-selected"].includes(e)}function Hr(e,t,r){return e._x_bindings&&e._x_bindings[t]!==void 0?e._x_bindings[t]:Vr(e,t,r)}function Kr(e,t,r,n=!0){if(e._x_bindings&&e._x_bindings[t]!==void 0)return e._x_bindings[t];if(e._x_inlineBindings&&e._x_inlineBindings[t]!==void 0){let i=e._x_inlineBindings[t];return i.extract=n,De(()=>T(e,i.expression))}return Vr(e,t,r)}function Vr(e,t,r){let n=e.getAttribute(t);return n===null?typeof r=="function"?r():r:n===""?!0:zr(t)?!![t,"true"].includes(n):n}function ze(e){return e.type==="checkbox"||e.localName==="ui-checkbox"||e.localName==="ui-switch"}function Ot(e){return e.type==="radio"||e.localName==="ui-radio"}function He(e,t){let r;return function(){let n=this,i=arguments,o=function(){r=null,e.apply(n,i)};clearTimeout(r),r=setTimeout(o,t)}}function Ke(e,t){let r;return function(){let n=this,i=arguments;r||(e.apply(n,i),r=!0,setTimeout(()=>r=!1,t))}}function Ve({get:e,set:t},{get:r,set:n}){let i=!0,o,s,a=N(()=>{let c=e(),l=r();if(i)n(Ct(c)),i=!1;else{let u=JSON.stringify(c),p=JSON.stringify(l);u!==o?n(Ct(c)):u!==p&&t(Ct(l))}o=JSON.stringify(e()),s=JSON.stringify(r())});return()=>{F(a)}}function Ct(e){return typeof e=="object"?JSON.parse(JSON.stringify(e)):e}function qr(e){(Array.isArray(e)?e:[e]).forEach(r=>r(z))}var Q={},Ur=!1;function Wr(e,t){if(Ur||(Q=R(Q),Ur=!0),t===void 0)return Q[e];Q[e]=t,ne(Q[e]),typeof t=="object"&&t!==null&&t.hasOwnProperty("init")&&typeof t.init=="function"&&Q[e].init()}function Gr(){return Q}var Jr={};function Yr(e,t){let r=typeof t!="function"?()=>t:t;return e instanceof Element?Rt(e,r()):(Jr[e]=r,()=>{})}function Xr(e){return Object.entries(Jr).forEach(([t,r])=>{Object.defineProperty(e,t,{get(){return(...n)=>r(...n)}})}),e}function Rt(e,t,r){let n=[];for(;n.length;)n.pop()();let i=Object.entries(t).map(([s,a])=>({name:s,value:a})),o=Et(i);return i=i.map(s=>o.find(a=>a.name===s.name)?{name:`x-bind:${s.name}`,value:`"${s.value}"`}:s),_e(e,i,r).map(s=>{n.push(s.runCleanups),s()}),()=>{for(;n.length;)n.pop()()}}var Zr={};function Qr(e,t){Zr[e]=t}function en(e,t){return Object.entries(Zr).forEach(([r,n])=>{Object.defineProperty(e,r,{get(){return(...i)=>n.bind(t)(...i)},enumerable:!1})}),e}var _i={get reactive(){return R},get release(){return F},get effect(){return N},get raw(){return at},version:"3.15.3",flushAndStopDeferringMutations:nr,dontAutoEvaluateFunctions:De,disableEffectScheduling:Gt,startObservingMutations:pe,stopObservingMutations:dt,setReactivityEngine:Jt,onAttributeRemoved:Te,onAttributesAdded:Re,closestDataStack:B,skipDuringClone:A,onlyDuringClone:Pr,addRootSelector:$e,addInitSelector:Le,setErrorHandler:ar,interceptClone:V,addScopeToNode:D,deferMutations:rr,mapAttributes:se,evaluateLater:x,interceptInit:Tr,initInterceptors:ne,injectMagics:K,setEvaluator:lr,setRawEvaluator:fr,mergeProxies:k,extractProp:Kr,findClosest:I,onElRemoved:re,closestRoot:X,destroyTree:$,interceptor:Ne,transition:Fe,setStyles:Z,mutateDom:m,directive:d,entangle:Ve,throttle:Ke,debounce:He,evaluate:T,evaluateRaw:dr,initTree:S,nextTick:ae,prefixed:C,prefix:mr,plugin:qr,magic:y,store:Wr,start:vr,clone:Lr,cloneNode:$r,bound:Hr,$data:Me,watch:Oe,walk:P,data:Qr,bind:Yr},z=_i;function Tt(e,t){let r=Object.create(null),n=e.split(",");for(let i=0;i<n.length;i++)r[n[i]]=!0;return t?i=>!!r[i.toLowerCase()]:i=>!!r[i]}var gi="itemscope,allowfullscreen,formnovalidate,ismap,nomodule,novalidate,readonly";var Vs=Tt(gi+",async,autofocus,autoplay,controls,default,defer,disabled,hidden,loop,open,required,reversed,scoped,seamless,checked,muted,multiple,selected");var tn=Object.freeze({}),qs=Object.freeze([]);var xi=Object.prototype.hasOwnProperty,Ee=(e,t)=>xi.call(e,t),q=Array.isArray,ce=e=>rn(e)==="[object Map]";var yi=e=>typeof e=="string",qe=e=>typeof e=="symbol",ve=e=>e!==null&&typeof e=="object";var bi=Object.prototype.toString,rn=e=>bi.call(e),Mt=e=>rn(e).slice(8,-1);var Ue=e=>yi(e)&&e!=="NaN"&&e[0]!=="-"&&""+parseInt(e,10)===e;var We=e=>{let t=Object.create(null);return r=>t[r]||(t[r]=e(r))},wi=/-(\w)/g,Us=We(e=>e.replace(wi,(t,r)=>r?r.toUpperCase():"")),Ei=/\B([A-Z])/g,Ws=We(e=>e.replace(Ei,"-$1").toLowerCase()),Nt=We(e=>e.charAt(0).toUpperCase()+e.slice(1)),Gs=We(e=>e?`on${Nt(e)}`:""),Dt=(e,t)=>e!==t&&(e===e||t===t);var kt=new WeakMap,Se=[],j,ee=Symbol("iterate"),Pt=Symbol("Map key iterate");function vi(e){return e&&e._isEffect===!0}function ln(e,t=tn){vi(e)&&(e=e.raw);let r=Ai(e,t);return t.lazy||r(),r}function un(e){e.active&&(fn(e),e.options.onStop&&e.options.onStop(),e.active=!1)}var Si=0;function Ai(e,t){let r=function(){if(!r.active)return e();if(!Se.includes(r)){fn(r);try{return Ci(),Se.push(r),j=r,e()}finally{Se.pop(),dn(),j=Se[Se.length-1]}}};return r.id=Si++,r.allowRecurse=!!t.allowRecurse,r._isEffect=!0,r.active=!0,r.raw=e,r.deps=[],r.options=t,r}function fn(e){let{deps:t}=e;if(t.length){for(let r=0;r<t.length;r++)t[r].delete(e);t.length=0}}var le=!0,$t=[];function Oi(){$t.push(le),le=!1}function Ci(){$t.push(le),le=!0}function dn(){let e=$t.pop();le=e===void 0?!0:e}function M(e,t,r){if(!le||j===void 0)return;let n=kt.get(e);n||kt.set(e,n=new Map);let i=n.get(r);i||n.set(r,i=new Set),i.has(j)||(i.add(j),j.deps.push(i),j.options.onTrack&&j.options.onTrack({effect:j,target:e,type:t,key:r}))}function W(e,t,r,n,i,o){let s=kt.get(e);if(!s)return;let a=new Set,c=u=>{u&&u.forEach(p=>{(p!==j||p.allowRecurse)&&a.add(p)})};if(t==="clear")s.forEach(c);else if(r==="length"&&q(e))s.forEach((u,p)=>{(p==="length"||p>=n)&&c(u)});else switch(r!==void 0&&c(s.get(r)),t){case"add":q(e)?Ue(r)&&c(s.get("length")):(c(s.get(ee)),ce(e)&&c(s.get(Pt)));break;case"delete":q(e)||(c(s.get(ee)),ce(e)&&c(s.get(Pt)));break;case"set":ce(e)&&c(s.get(ee));break}let l=u=>{u.options.onTrigger&&u.options.onTrigger({effect:u,target:e,key:r,type:t,newValue:n,oldValue:i,oldTarget:o}),u.options.scheduler?u.options.scheduler(u):u()};a.forEach(l)}var Ri=Tt("__proto__,__v_isRef,__isVue"),pn=new Set(Object.getOwnPropertyNames(Symbol).map(e=>Symbol[e]).filter(qe)),Ti=mn();var Mi=mn(!0);var nn=Ni();function Ni(){let e={};return["includes","indexOf","lastIndexOf"].forEach(t=>{e[t]=function(...r){let n=_(this);for(let o=0,s=this.length;o<s;o++)M(n,"get",o+"");let i=n[t](...r);return i===-1||i===!1?n[t](...r.map(_)):i}}),["push","pop","shift","unshift","splice"].forEach(t=>{e[t]=function(...r){Oi();let n=_(this)[t].apply(this,r);return dn(),n}}),e}function mn(e=!1,t=!1){return function(n,i,o){if(i==="__v_isReactive")return!e;if(i==="__v_isReadonly")return e;if(i==="__v_raw"&&o===(e?t?Wi:xn:t?Ui:gn).get(n))return n;let s=q(n);if(!e&&s&&Ee(nn,i))return Reflect.get(nn,i,o);let a=Reflect.get(n,i,o);return(qe(i)?pn.has(i):Ri(i))||(e||M(n,"get",i),t)?a:It(a)?!s||!Ue(i)?a.value:a:ve(a)?e?yn(a):et(a):a}}var Di=ki();function ki(e=!1){return function(r,n,i,o){let s=r[n];if(!e&&(i=_(i),s=_(s),!q(r)&&It(s)&&!It(i)))return s.value=i,!0;let a=q(r)&&Ue(n)?Number(n)<r.length:Ee(r,n),c=Reflect.set(r,n,i,o);return r===_(o)&&(a?Dt(i,s)&&W(r,"set",n,i,s):W(r,"add",n,i)),c}}function Pi(e,t){let r=Ee(e,t),n=e[t],i=Reflect.deleteProperty(e,t);return i&&r&&W(e,"delete",t,void 0,n),i}function Ii(e,t){let r=Reflect.has(e,t);return(!qe(t)||!pn.has(t))&&M(e,"has",t),r}function $i(e){return M(e,"iterate",q(e)?"length":ee),Reflect.ownKeys(e)}var Li={get:Ti,set:Di,deleteProperty:Pi,has:Ii,ownKeys:$i},ji={get:Mi,set(e,t){return console.warn(`Set operation on key "${String(t)}" failed: target is readonly.`,e),!0},deleteProperty(e,t){return console.warn(`Delete operation on key "${String(t)}" failed: target is readonly.`,e),!0}};var Lt=e=>ve(e)?et(e):e,jt=e=>ve(e)?yn(e):e,Ft=e=>e,Qe=e=>Reflect.getPrototypeOf(e);function Ge(e,t,r=!1,n=!1){e=e.__v_raw;let i=_(e),o=_(t);t!==o&&!r&&M(i,"get",t),!r&&M(i,"get",o);let{has:s}=Qe(i),a=n?Ft:r?jt:Lt;if(s.call(i,t))return a(e.get(t));if(s.call(i,o))return a(e.get(o));e!==i&&e.get(t)}function Je(e,t=!1){let r=this.__v_raw,n=_(r),i=_(e);return e!==i&&!t&&M(n,"has",e),!t&&M(n,"has",i),e===i?r.has(e):r.has(e)||r.has(i)}function Ye(e,t=!1){return e=e.__v_raw,!t&&M(_(e),"iterate",ee),Reflect.get(e,"size",e)}function on(e){e=_(e);let t=_(this);return Qe(t).has.call(t,e)||(t.add(e),W(t,"add",e,e)),this}function sn(e,t){t=_(t);let r=_(this),{has:n,get:i}=Qe(r),o=n.call(r,e);o?_n(r,n,e):(e=_(e),o=n.call(r,e));let s=i.call(r,e);return r.set(e,t),o?Dt(t,s)&&W(r,"set",e,t,s):W(r,"add",e,t),this}function an(e){let t=_(this),{has:r,get:n}=Qe(t),i=r.call(t,e);i?_n(t,r,e):(e=_(e),i=r.call(t,e));let o=n?n.call(t,e):void 0,s=t.delete(e);return i&&W(t,"delete",e,void 0,o),s}function cn(){let e=_(this),t=e.size!==0,r=ce(e)?new Map(e):new Set(e),n=e.clear();return t&&W(e,"clear",void 0,void 0,r),n}function Xe(e,t){return function(n,i){let o=this,s=o.__v_raw,a=_(s),c=t?Ft:e?jt:Lt;return!e&&M(a,"iterate",ee),s.forEach((l,u)=>n.call(i,c(l),c(u),o))}}function Ze(e,t,r){return function(...n){let i=this.__v_raw,o=_(i),s=ce(o),a=e==="entries"||e===Symbol.iterator&&s,c=e==="keys"&&s,l=i[e](...n),u=r?Ft:t?jt:Lt;return!t&&M(o,"iterate",c?Pt:ee),{next(){let{value:p,done:h}=l.next();return h?{value:p,done:h}:{value:a?[u(p[0]),u(p[1])]:u(p),done:h}},[Symbol.iterator](){return this}}}}function U(e){return function(...t){{let r=t[0]?`on key "${t[0]}" `:"";console.warn(`${Nt(e)} operation ${r}failed: target is readonly.`,_(this))}return e==="delete"?!1:this}}function Fi(){let e={get(o){return Ge(this,o)},get size(){return Ye(this)},has:Je,add:on,set:sn,delete:an,clear:cn,forEach:Xe(!1,!1)},t={get(o){return Ge(this,o,!1,!0)},get size(){return Ye(this)},has:Je,add:on,set:sn,delete:an,clear:cn,forEach:Xe(!1,!0)},r={get(o){return Ge(this,o,!0)},get size(){return Ye(this,!0)},has(o){return Je.call(this,o,!0)},add:U("add"),set:U("set"),delete:U("delete"),clear:U("clear"),forEach:Xe(!0,!1)},n={get(o){return Ge(this,o,!0,!0)},get size(){return Ye(this,!0)},has(o){return Je.call(this,o,!0)},add:U("add"),set:U("set"),delete:U("delete"),clear:U("clear"),forEach:Xe(!0,!0)};return["keys","values","entries",Symbol.iterator].forEach(o=>{e[o]=Ze(o,!1,!1),r[o]=Ze(o,!0,!1),t[o]=Ze(o,!1,!0),n[o]=Ze(o,!0,!0)}),[e,r,t,n]}var[Bi,zi,Hi,Ki]=Fi();function hn(e,t){let r=t?e?Ki:Hi:e?zi:Bi;return(n,i,o)=>i==="__v_isReactive"?!e:i==="__v_isReadonly"?e:i==="__v_raw"?n:Reflect.get(Ee(r,i)&&i in n?r:n,i,o)}var Vi={get:hn(!1,!1)};var qi={get:hn(!0,!1)};function _n(e,t,r){let n=_(r);if(n!==r&&t.call(e,n)){let i=Mt(e);console.warn(`Reactive ${i} contains both the raw and reactive versions of the same object${i==="Map"?" as keys":""}, which can lead to inconsistencies. Avoid differentiating between the raw and reactive versions of an object and only use the reactive version if possible.`)}}var gn=new WeakMap,Ui=new WeakMap,xn=new WeakMap,Wi=new WeakMap;function Gi(e){switch(e){case"Object":case"Array":return 1;case"Map":case"Set":case"WeakMap":case"WeakSet":return 2;default:return 0}}function Ji(e){return e.__v_skip||!Object.isExtensible(e)?0:Gi(Mt(e))}function et(e){return e&&e.__v_isReadonly?e:bn(e,!1,Li,Vi,gn)}function yn(e){return bn(e,!0,ji,qi,xn)}function bn(e,t,r,n,i){if(!ve(e))return console.warn(`value cannot be made reactive: ${String(e)}`),e;if(e.__v_raw&&!(t&&e.__v_isReactive))return e;let o=i.get(e);if(o)return o;let s=Ji(e);if(s===0)return e;let a=new Proxy(e,s===2?n:r);return i.set(e,a),a}function _(e){return e&&_(e.__v_raw)||e}function It(e){return Boolean(e&&e.__v_isRef===!0)}y("nextTick",()=>ae);y("dispatch",e=>Y.bind(Y,e));y("watch",(e,{evaluateLater:t,cleanup:r})=>(n,i)=>{let o=t(n),a=Oe(()=>{let c;return o(l=>c=l),c},i);r(a)});y("store",Gr);y("data",e=>Me(e));y("root",e=>X(e));y("refs",e=>(e._x_refs_proxy||(e._x_refs_proxy=k(Yi(e))),e._x_refs_proxy));function Yi(e){let t=[];return I(e,r=>{r._x_refs&&t.push(r._x_refs)}),t}var Bt={};function zt(e){return Bt[e]||(Bt[e]=0),++Bt[e]}function wn(e,t){return I(e,r=>{if(r._x_ids&&r._x_ids[t])return!0})}function En(e,t){e._x_ids||(e._x_ids={}),e._x_ids[t]||(e._x_ids[t]=zt(t))}y("id",(e,{cleanup:t})=>(r,n=null)=>{let i=`${r}${n?`-${n}`:""}`;return Xi(e,i,t,()=>{let o=wn(e,r),s=o?o._x_ids[r]:zt(r);return n?`${r}-${s}-${n}`:`${r}-${s}`})});V((e,t)=>{e._x_id&&(t._x_id=e._x_id)});function Xi(e,t,r,n){if(e._x_id||(e._x_id={}),e._x_id[t])return e._x_id[t];let i=n();return e._x_id[t]=i,r(()=>{delete e._x_id[t]}),i}y("el",e=>e);vn("Focus","focus","focus");vn("Persist","persist","persist");function vn(e,t,r){y(t,n=>E(`You can't use [$${t}] without first installing the "${e}" plugin here: https://alpinejs.dev/plugins/${r}`,n))}d("modelable",(e,{expression:t},{effect:r,evaluateLater:n,cleanup:i})=>{let o=n(t),s=()=>{let u;return o(p=>u=p),u},a=n(`${t} = __placeholder`),c=u=>a(()=>{},{scope:{__placeholder:u}}),l=s();c(l),queueMicrotask(()=>{if(!e._x_model)return;e._x_removeModelListeners.default();let u=e._x_model.get,p=e._x_model.set,h=Ve({get(){return u()},set(w){p(w)}},{get(){return s()},set(w){c(w)}});i(h)})});d("teleport",(e,{modifiers:t,expression:r},{cleanup:n})=>{e.tagName.toLowerCase()!=="template"&&E("x-teleport can only be used on a <template> tag",e);let i=Sn(r),o=e.content.cloneNode(!0).firstElementChild;e._x_teleport=o,o._x_teleportBack=e,e.setAttribute("data-teleport-template",!0),o.setAttribute("data-teleport-target",!0),e._x_forwardEvents&&e._x_forwardEvents.forEach(a=>{o.addEventListener(a,c=>{c.stopPropagation(),e.dispatchEvent(new c.constructor(c.type,c))})}),D(o,{},e);let s=(a,c,l)=>{l.includes("prepend")?c.parentNode.insertBefore(a,c):l.includes("append")?c.parentNode.insertBefore(a,c.nextSibling):c.appendChild(a)};m(()=>{s(o,i,t),A(()=>{S(o)})()}),e._x_teleportPutBack=()=>{let a=Sn(r);m(()=>{s(e._x_teleport,a,t)})},n(()=>m(()=>{o.remove(),$(o)}))});var Zi=document.createElement("div");function Sn(e){let t=A(()=>document.querySelector(e),()=>Zi)();return t||E(`Cannot find x-teleport element for selector: "${e}"`),t}var An=()=>{};An.inline=(e,{modifiers:t},{cleanup:r})=>{t.includes("self")?e._x_ignoreSelf=!0:e._x_ignore=!0,r(()=>{t.includes("self")?delete e._x_ignoreSelf:delete e._x_ignore})};d("ignore",An);d("effect",A((e,{expression:t},{effect:r})=>{r(x(e,t))}));function ue(e,t,r,n){let i=e,o=c=>n(c),s={},a=(c,l)=>u=>l(c,u);if(r.includes("dot")&&(t=Qi(t)),r.includes("camel")&&(t=eo(t)),r.includes("passive")&&(s.passive=!0),r.includes("capture")&&(s.capture=!0),r.includes("window")&&(i=window),r.includes("document")&&(i=document),r.includes("debounce")){let c=r[r.indexOf("debounce")+1]||"invalid-wait",l=tt(c.split("ms")[0])?Number(c.split("ms")[0]):250;o=He(o,l)}if(r.includes("throttle")){let c=r[r.indexOf("throttle")+1]||"invalid-wait",l=tt(c.split("ms")[0])?Number(c.split("ms")[0]):250;o=Ke(o,l)}return r.includes("prevent")&&(o=a(o,(c,l)=>{l.preventDefault(),c(l)})),r.includes("stop")&&(o=a(o,(c,l)=>{l.stopPropagation(),c(l)})),r.includes("once")&&(o=a(o,(c,l)=>{c(l),i.removeEventListener(t,o,s)})),(r.includes("away")||r.includes("outside"))&&(i=document,o=a(o,(c,l)=>{e.contains(l.target)||l.target.isConnected!==!1&&(e.offsetWidth<1&&e.offsetHeight<1||e._x_isShown!==!1&&c(l))})),r.includes("self")&&(o=a(o,(c,l)=>{l.target===e&&c(l)})),(ro(t)||Cn(t))&&(o=a(o,(c,l)=>{no(l,r)||c(l)})),i.addEventListener(t,o,s),()=>{i.removeEventListener(t,o,s)}}function Qi(e){return e.replace(/-/g,".")}function eo(e){return e.toLowerCase().replace(/-(\w)/g,(t,r)=>r.toUpperCase())}function tt(e){return!Array.isArray(e)&&!isNaN(e)}function to(e){return[" ","_"].includes(e)?e:e.replace(/([a-z])([A-Z])/g,"$1-$2").replace(/[_\s]/,"-").toLowerCase()}function ro(e){return["keydown","keyup"].includes(e)}function Cn(e){return["contextmenu","click","mouse"].some(t=>e.includes(t))}function no(e,t){let r=t.filter(o=>!["window","document","prevent","stop","once","capture","self","away","outside","passive","preserve-scroll"].includes(o));if(r.includes("debounce")){let o=r.indexOf("debounce");r.splice(o,tt((r[o+1]||"invalid-wait").split("ms")[0])?2:1)}if(r.includes("throttle")){let o=r.indexOf("throttle");r.splice(o,tt((r[o+1]||"invalid-wait").split("ms")[0])?2:1)}if(r.length===0||r.length===1&&On(e.key).includes(r[0]))return!1;let i=["ctrl","shift","alt","meta","cmd","super"].filter(o=>r.includes(o));return r=r.filter(o=>!i.includes(o)),!(i.length>0&&i.filter(s=>((s==="cmd"||s==="super")&&(s="meta"),e[`${s}Key`])).length===i.length&&(Cn(e.type)||On(e.key).includes(r[0])))}function On(e){if(!e)return[];e=to(e);let t={ctrl:"control",slash:"/",space:" ",spacebar:" ",cmd:"meta",esc:"escape",up:"arrow-up",down:"arrow-down",left:"arrow-left",right:"arrow-right",period:".",comma:",",equal:"=",minus:"-",underscore:"_"};return t[e]=e,Object.keys(t).map(r=>{if(t[r]===e)return r}).filter(r=>r)}d("model",(e,{modifiers:t,expression:r},{effect:n,cleanup:i})=>{let o=e;t.includes("parent")&&(o=e.parentNode);let s=x(o,r),a;typeof r=="string"?a=x(o,`${r} = __placeholder`):typeof r=="function"&&typeof r()=="string"?a=x(o,`${r()} = __placeholder`):a=()=>{};let c=()=>{let h;return s(w=>h=w),Rn(h)?h.get():h},l=h=>{let w;s(H=>w=H),Rn(w)?w.set(h):a(()=>{},{scope:{__placeholder:h}})};typeof r=="string"&&e.type==="radio"&&m(()=>{e.hasAttribute("name")||e.setAttribute("name",r)});let u=e.tagName.toLowerCase()==="select"||["checkbox","radio"].includes(e.type)||t.includes("lazy")?"change":"input",p=L?()=>{}:ue(e,u,t,h=>{l(Ht(e,t,h,c()))});if(t.includes("fill")&&([void 0,null,""].includes(c())||ze(e)&&Array.isArray(c())||e.tagName.toLowerCase()==="select"&&e.multiple)&&l(Ht(e,t,{target:e},c())),e._x_removeModelListeners||(e._x_removeModelListeners={}),e._x_removeModelListeners.default=p,i(()=>e._x_removeModelListeners.default()),e.form){let h=ue(e.form,"reset",[],w=>{ae(()=>e._x_model&&e._x_model.set(Ht(e,t,{target:e},c())))});i(()=>h())}e._x_model={get(){return c()},set(h){l(h)}},e._x_forceModelUpdate=h=>{h===void 0&&typeof r=="string"&&r.match(/\./)&&(h=""),window.fromModel=!0,m(()=>be(e,"value",h)),delete window.fromModel},n(()=>{let h=c();t.includes("unintrusive")&&document.activeElement.isSameNode(e)||e._x_forceModelUpdate(h)})});function Ht(e,t,r,n){return m(()=>{if(r instanceof CustomEvent&&r.detail!==void 0)return r.detail!==null&&r.detail!==void 0?r.detail:r.target.value;if(ze(e))if(Array.isArray(n)){let i=null;return t.includes("number")?i=Kt(r.target.value):t.includes("boolean")?i=we(r.target.value):i=r.target.value,r.target.checked?n.includes(i)?n:n.concat([i]):n.filter(o=>!io(o,i))}else return r.target.checked;else{if(e.tagName.toLowerCase()==="select"&&e.multiple)return t.includes("number")?Array.from(r.target.selectedOptions).map(i=>{let o=i.value||i.text;return Kt(o)}):t.includes("boolean")?Array.from(r.target.selectedOptions).map(i=>{let o=i.value||i.text;return we(o)}):Array.from(r.target.selectedOptions).map(i=>i.value||i.text);{let i;return Ot(e)?r.target.checked?i=r.target.value:i=n:i=r.target.value,t.includes("number")?Kt(i):t.includes("boolean")?we(i):t.includes("trim")?i.trim():i}}})}function Kt(e){let t=e?parseFloat(e):null;return oo(t)?t:e}function io(e,t){return e==t}function oo(e){return!Array.isArray(e)&&!isNaN(e)}function Rn(e){return e!==null&&typeof e=="object"&&typeof e.get=="function"&&typeof e.set=="function"}d("cloak",e=>queueMicrotask(()=>m(()=>e.removeAttribute(C("cloak")))));Le(()=>`[${C("init")}]`);d("init",A((e,{expression:t},{evaluate:r})=>typeof t=="string"?!!t.trim()&&r(t,{},!1):r(t,{},!1)));d("text",(e,{expression:t},{effect:r,evaluateLater:n})=>{let i=n(t);r(()=>{i(o=>{m(()=>{e.textContent=o})})})});d("html",(e,{expression:t},{effect:r,evaluateLater:n})=>{let i=n(t);r(()=>{i(o=>{m(()=>{e.innerHTML=o,e._x_ignoreSelf=!0,S(e),delete e._x_ignoreSelf})})})});se(Pe(":",Ie(C("bind:"))));var Tn=(e,{value:t,modifiers:r,expression:n,original:i},{effect:o,cleanup:s})=>{if(!t){let c={};Xr(c),x(e,n)(u=>{Rt(e,u,i)},{scope:c});return}if(t==="key")return so(e,n);if(e._x_inlineBindings&&e._x_inlineBindings[t]&&e._x_inlineBindings[t].extract)return;let a=x(e,n);o(()=>a(c=>{c===void 0&&typeof n=="string"&&n.match(/\./)&&(c=""),m(()=>be(e,t,c,r))})),s(()=>{e._x_undoAddedClasses&&e._x_undoAddedClasses(),e._x_undoAddedStyles&&e._x_undoAddedStyles()})};Tn.inline=(e,{value:t,modifiers:r,expression:n})=>{t&&(e._x_inlineBindings||(e._x_inlineBindings={}),e._x_inlineBindings[t]={expression:n,extract:!1})};d("bind",Tn);function so(e,t){e._x_keyExpression=t}$e(()=>`[${C("data")}]`);d("data",(e,{expression:t},{cleanup:r})=>{if(ao(e))return;t=t===""?"{}":t;let n={};K(n,e);let i={};en(i,n);let o=T(e,t,{scope:i});(o===void 0||o===!0)&&(o={}),K(o,e);let s=R(o);ne(s);let a=D(e,s);s.init&&T(e,s.init),r(()=>{s.destroy&&T(e,s.destroy),a()})});V((e,t)=>{e._x_dataStack&&(t._x_dataStack=e._x_dataStack,t.setAttribute("data-has-alpine-state",!0))});function ao(e){return L?Be?!0:e.hasAttribute("data-has-alpine-state"):!1}d("show",(e,{modifiers:t,expression:r},{effect:n})=>{let i=x(e,r);e._x_doHide||(e._x_doHide=()=>{m(()=>{e.style.setProperty("display","none",t.includes("important")?"important":void 0)})}),e._x_doShow||(e._x_doShow=()=>{m(()=>{e.style.length===1&&e.style.display==="none"?e.removeAttribute("style"):e.style.removeProperty("display")})});let o=()=>{e._x_doHide(),e._x_isShown=!1},s=()=>{e._x_doShow(),e._x_isShown=!0},a=()=>setTimeout(s),c=xe(p=>p?s():o(),p=>{typeof e._x_toggleAndCascadeWithTransitions=="function"?e._x_toggleAndCascadeWithTransitions(e,p,s,o):p?a():o()}),l,u=!0;n(()=>i(p=>{!u&&p===l||(t.includes("immediate")&&(p?a():o()),c(p),l=p,u=!1)}))});d("for",(e,{expression:t},{effect:r,cleanup:n})=>{let i=lo(t),o=x(e,i.items),s=x(e,e._x_keyExpression||"index");e._x_prevKeys=[],e._x_lookup={},r(()=>co(e,i,o,s)),n(()=>{Object.values(e._x_lookup).forEach(a=>m(()=>{$(a),a.remove()})),delete e._x_prevKeys,delete e._x_lookup})});function co(e,t,r,n){let i=s=>typeof s=="object"&&!Array.isArray(s),o=e;r(s=>{uo(s)&&s>=0&&(s=Array.from(Array(s).keys(),f=>f+1)),s===void 0&&(s=[]);let a=e._x_lookup,c=e._x_prevKeys,l=[],u=[];if(i(s))s=Object.entries(s).map(([f,g])=>{let b=Mn(t,g,f,s);n(v=>{u.includes(v)&&E("Duplicate key on x-for",e),u.push(v)},{scope:{index:f,...b}}),l.push(b)});else for(let f=0;f<s.length;f++){let g=Mn(t,s[f],f,s);n(b=>{u.includes(b)&&E("Duplicate key on x-for",e),u.push(b)},{scope:{index:f,...g}}),l.push(g)}let p=[],h=[],w=[],H=[];for(let f=0;f<c.length;f++){let g=c[f];u.indexOf(g)===-1&&w.push(g)}c=c.filter(f=>!w.includes(f));let Ae="template";for(let f=0;f<u.length;f++){let g=u[f],b=c.indexOf(g);if(b===-1)c.splice(f,0,g),p.push([Ae,f]);else if(b!==f){let v=c.splice(f,1)[0],O=c.splice(b-1,1)[0];c.splice(f,0,O),c.splice(b,0,v),h.push([v,O])}else H.push(g);Ae=g}for(let f=0;f<w.length;f++){let g=w[f];g in a&&(m(()=>{$(a[g]),a[g].remove()}),delete a[g])}for(let f=0;f<h.length;f++){let[g,b]=h[f],v=a[g],O=a[b],te=document.createElement("div");m(()=>{O||E('x-for ":key" is undefined or invalid',o,b,a),O.after(te),v.after(O),O._x_currentIfEl&&O.after(O._x_currentIfEl),te.before(v),v._x_currentIfEl&&v.after(v._x_currentIfEl),te.remove()}),O._x_refreshXForScope(l[u.indexOf(b)])}for(let f=0;f<p.length;f++){let[g,b]=p[f],v=g==="template"?o:a[g];v._x_currentIfEl&&(v=v._x_currentIfEl);let O=l[b],te=u[b],fe=document.importNode(o.content,!0).firstElementChild,qt=R(O);D(fe,qt,o),fe._x_refreshXForScope=Dn=>{Object.entries(Dn).forEach(([kn,Pn])=>{qt[kn]=Pn})},m(()=>{v.after(fe),A(()=>S(fe))()}),typeof te=="object"&&E("x-for key cannot be an object, it must be a string or an integer",o),a[te]=fe}for(let f=0;f<H.length;f++)a[H[f]]._x_refreshXForScope(l[u.indexOf(H[f])]);o._x_prevKeys=u})}function lo(e){let t=/,([^,\}\]]*)(?:,([^,\}\]]*))?$/,r=/^\s*\(|\)\s*$/g,n=/([\s\S]*?)\s+(?:in|of)\s+([\s\S]*)/,i=e.match(n);if(!i)return;let o={};o.items=i[2].trim();let s=i[1].replace(r,"").trim(),a=s.match(t);return a?(o.item=s.replace(t,"").trim(),o.index=a[1].trim(),a[2]&&(o.collection=a[2].trim())):o.item=s,o}function Mn(e,t,r,n){let i={};return/^\[.*\]$/.test(e.item)&&Array.isArray(t)?e.item.replace("[","").replace("]","").split(",").map(s=>s.trim()).forEach((s,a)=>{i[s]=t[a]}):/^\{.*\}$/.test(e.item)&&!Array.isArray(t)&&typeof t=="object"?e.item.replace("{","").replace("}","").split(",").map(s=>s.trim()).forEach(s=>{i[s]=t[s]}):i[e.item]=t,e.index&&(i[e.index]=r),e.collection&&(i[e.collection]=n),i}function uo(e){return!Array.isArray(e)&&!isNaN(e)}function Nn(){}Nn.inline=(e,{expression:t},{cleanup:r})=>{let n=X(e);n._x_refs||(n._x_refs={}),n._x_refs[t]=e,r(()=>delete n._x_refs[t])};d("ref",Nn);d("if",(e,{expression:t},{effect:r,cleanup:n})=>{e.tagName.toLowerCase()!=="template"&&E("x-if can only be used on a <template> tag",e);let i=x(e,t),o=()=>{if(e._x_currentIfEl)return e._x_currentIfEl;let a=e.content.cloneNode(!0).firstElementChild;return D(a,{},e),m(()=>{e.after(a),A(()=>S(a))()}),e._x_currentIfEl=a,e._x_undoIf=()=>{m(()=>{$(a),a.remove()}),delete e._x_currentIfEl},a},s=()=>{e._x_undoIf&&(e._x_undoIf(),delete e._x_undoIf)};r(()=>i(a=>{a?o():s()})),n(()=>e._x_undoIf&&e._x_undoIf())});d("id",(e,{expression:t},{evaluate:r})=>{r(t).forEach(i=>En(e,i))});V((e,t)=>{e._x_ids&&(t._x_ids=e._x_ids)});se(Pe("@",Ie(C("on:"))));d("on",A((e,{value:t,modifiers:r,expression:n},{cleanup:i})=>{let o=n?x(e,n):()=>{};e.tagName.toLowerCase()==="template"&&(e._x_forwardEvents||(e._x_forwardEvents=[]),e._x_forwardEvents.includes(t)||e._x_forwardEvents.push(t));let s=ue(e,t,r,a=>{o(()=>{},{scope:{$event:a},params:[a]})});i(()=>s())}));rt("Collapse","collapse","collapse");rt("Intersect","intersect","intersect");rt("Focus","trap","focus");rt("Mask","mask","mask");function rt(e,t,r){d(t,n=>E(`You can't use [x-${t}] without first installing the "${e}" plugin here: https://alpinejs.dev/plugins/${r}`,n))}z.setEvaluator(xt);z.setRawEvaluator(pr);z.setReactivityEngine({reactive:et,effect:ln,release:un,raw:_});var Vt=z;window.Alpine=Vt;queueMicrotask(()=>{Vt.start()});})();
diff --git a/hugo/static/js/alpine-alphabreed.js b/hugo/static/js/alpine-alphabreed.js
new file mode 100644
index 0000000..bdffb7e
--- /dev/null
+++ b/hugo/static/js/alpine-alphabreed.js
@@ -0,0 +1,134 @@
+document.addEventListener('alpine:init', () => {
+	Alpine.store('alphabreed', {
+		backUrl: '/',
+		pending: false,
+
+		async apiCall(method, url, data) {
+			this.pending = true;
+			const options = {
+				method: method,
+				headers: { 'Authorization': localStorage.getItem('alphabreedtoken') }
+			};
+			if (data) {
+				options.body = new FormData();
+				for (let key in data)
+					if (data.hasOwnProperty(key))
+						options.body.append(key, data[key]);
+			}
+			const response = await fetch(url, options);
+			this.pending = false;
+			if (!response.ok)
+				return false;
+			if (response.status == 204)
+				return true;
+			return await response.json();
+		},
+
+		async checkToken() {
+			const token = localStorage.getItem('alphabreedtoken');
+			if (!token) {
+				window.location = '/login/?back='+encodeURIComponent(this.backUrl);
+				return false;
+			}
+			const result = await this.apiCall('POST', '/api/collections/users/auth-refresh');
+			if (!result.token) {
+				window.location = '/login/?back='+encodeURIComponent(this.backUrl);
+				return false;
+			}
+			localStorage.setItem('alphabreedtoken', result.token);
+			localStorage.setItem('alphabreedid', result.record.id);
+			return true;
+		},
+
+		async createBookmarkCategory(name) {
+			const result = await this.apiCall('POST',
+				'/api/collections/bookmarkcategories/records',
+				{ owner: localStorage.getItem('alphabreedid'), name: name }
+			);
+			return result.id;
+		},
+
+		async updateBookmarkCategory(id, name) {
+			await this.apiCall('PATCH',
+				'/api/collections/bookmarkcategories/records/'+encodeURIComponent(id),
+				{ owner: localStorage.getItem('alphabreedid'), name: name }
+			);
+		},
+
+		async deleteBookmarkCategory(id) {
+			await this.apiCall('DELETE',
+				'/api/collections/bookmarkcategories/records/'+encodeURIComponent(id)
+			);
+		},
+
+		async createBookmark(categoryId, name, url) {
+			const result = await this.apiCall('POST',
+				'/api/collections/bookmarks/records',
+				{
+					owner: localStorage.getItem('alphabreedid'),
+					category: categoryId,
+					name: name,
+					url: url
+				}
+			);
+			return result.id;
+		},
+
+		async updateBookmark(id, categoryId, name, url) {
+			await this.apiCall('PATCH',
+				'/api/collections/bookmarks/records/'+encodeURIComponent(id),
+				{
+					owner: localStorage.getItem('alphabreedid'),
+					category: categoryId,
+					name: name,
+					url: url
+				}
+			);
+		},
+
+		async deleteBookmark(id) {
+			await this.apiCall('DELETE',
+				'/api/collections/bookmarks/records/'+encodeURIComponent(id)
+			);
+		},
+
+		async getBookmarkCategories() {
+			const result = await this.apiCall('GET',
+				'/api/collections/bookmarkcategories/records?perPage=9999&fields=id,name&sort=name'
+			);
+			return result.items;
+		},
+
+		async getBookmarks() {
+			const result = await this.apiCall('GET',
+				'/api/collections/bookmarks/records?perPage=1000&expand=category&fields=id,name,url,expand.category.id,expand.category.name&sort=name'
+			);
+			return result.items;
+		},
+
+		async getNotes() {
+			const owner = localStorage.getItem('alphabreedid');
+			const result = await this.apiCall('GET',
+				'/api/collections/notes/records/'+encodeURIComponent(owner)+'?fields=notes'
+			);
+			if (result === false)
+				return false;
+			return result.notes;
+		},
+
+		async createNotes(notes) {
+			return await this.apiCall('POST',
+				'/api/collections/notes/records',
+				{ id: localStorage.getItem('alphabreedid'), notes: notes }
+			);
+		},
+
+		async updateNotes(notes) {
+			const owner = localStorage.getItem('alphabreedid');
+			return await this.apiCall('PATCH',
+				'/api/collections/notes/records/'+encodeURIComponent(owner),
+				{ notes: notes }
+			);
+		},
+	});
+});
\ No newline at end of file
diff --git a/hugo/static/js/menu.js b/hugo/static/js/menu.js
new file mode 100644
index 0000000..571e620
--- /dev/null
+++ b/hugo/static/js/menu.js
@@ -0,0 +1,15 @@
+(function() {
+  var onHamburger = function(e) {
+    e.preventDefault();
+    var open = hamburger.className == 'open';
+    hamburger.className = open ? '' : 'open';
+    nav.className = open ? '' : 'open';
+  };
+
+  var nav = document.querySelector('header nav');
+  var hamburger = document.createElement('div');
+  hamburger.id = 'hamburger';
+  hamburger.innerHTML = '<div class="top"></div><div class="middle"></div><div class="bottom"></div>';
+  hamburger.onclick = onHamburger;
+  document.querySelector('header').appendChild(hamburger);
+})();
\ No newline at end of file