Create index

2025-01-06 19:02:24 +09:00
parent a3335d1583
commit 1db48b4c9a
25 changed files with 2300 additions and 22 deletions
--- a/.vscode/svelte.code-snippets
+++ b/.vscode/svelte.code-snippets
@@ -0,0 +1,25 @@
+{
+	// Place your cannorin.net workspace snippets here. Each snippet is defined under a snippet name and has a scope, prefix, body and
+	// description. Add comma separated ids of the languages where the snippet is applicable in the scope field. If scope
+	// is left empty or omitted, the snippet gets applied to all languages. The prefix is what is
+	// used to trigger the snippet and the body will be expanded and inserted. Possible variables are:
+	// $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders.
+	// Placeholders with the same ids are connected.
+	// Example:
+	// "Print to console": {
+	// 	"scope": "javascript,typescript",
+	// 	"prefix": "log",
+	// 	"body": [
+	// 		"console.log('$1');",
+	// 		"$2"
+	// 	],
+	// 	"description": "Log output to console"
+	// }
+  "Import Simple Icon": {
+    "scope": "javascript,typescript,svelte",
+    "prefix": "importSi",
+    "body": [
+      "import Si${1:name} from \"@icons-pack/svelte-simple-icons/icons/Si${1:name}\";"
+    ]
+  }
+}
--- a/apps/web/.env.example
+++ b/apps/web/.env.example
@@ -0,0 +1,5 @@
+# run `yarn gen:env` at the project root to generate
+
+PUBLIC_WEB_DOMAIN="www.cannorin.net"
+PUBLIC_WEB_TURNSTILE_SITEKEY="1x00000000000000000000BB"
+WEB_TURNSTILE_SECRET_KEY="1x0000000000000000000000000000000AA"
--- a/apps/web/package.json
+++ b/apps/web/package.json
@@ -14,6 +14,7 @@
  },
  "devDependencies": {
    "@sveltejs/adapter-auto": "3.3.1",
+    "@sveltejs/enhanced-img": "0.4.4",
    "@sveltejs/kit": "2.15.1",
    "@sveltejs/vite-plugin-svelte": "4.0.4",
    "autoprefixer": "10.4.20",
@@ -24,6 +25,12 @@
    "vite": "5.4.11"
  },
  "dependencies": {
-    "@tailwindcss/typography": "0.5.15"
+    "@fontsource/poiret-one": "5.1.1",
+    "@fontsource/zen-kaku-gothic-new": "5.1.1",
+    "@icons-pack/svelte-simple-icons": "4.0.1",
+    "@tailwindcss/typography": "0.5.15",
+    "deepmerge": "4.3.1",
+    "svelte-seo": "1.6.1",
+    "tailwind-merge": "2.6.0"
  }
 }
--- a/apps/web/src/app.css
+++ b/apps/web/src/app.css
@@ -1,3 +1,48 @@
@import "tailwindcss/base";
@import "tailwindcss/components";
@import "tailwindcss/utilities";
+
+@layer base {
+  :root {
+    --foreground: 55 65 81 /* #374151 */;
+    --background: 250 250 250 /* #fafafa */;
+
+    --muted: 174 174 174 /* #aeaeae */;
+    --muted-foreground: 31 31 31 /* #1f1f1f */;
+
+    --popover: 245 248 255;
+    --popover-foreground: 12 0 0;
+
+    --card: 245 248 255;
+    --card-foreground: 12 0 0;
+
+    --border: 55 65 81 /* #374151 */;
+    --input: 55 65 81 /* #374151 */;
+    --ring: 55 65 81 /* #374151 */;
+
+    --primary: 219 96 114 /* DB6072 */;
+    --primary-foreground: 31 31 31 /* #1f1f1f */;
+
+    --secondary: 120 153 212 /* 7899D4 */;
+    --secondary-foreground: 31 31 31 /* #1f1f1f */;
+
+    --accent: 120 153 212 /* 7899D4 */;
+    --accent-foreground: 31 31 31 /* #1f1f1f */;
+
+    --destructive: 219 96 114 /* DB6072 */;
+    --destructive-foreground: 31 31 31 /* #1f1f1f */;
+
+    color-scheme: only light;
+    scrollbar-gutter: stable;
+    padding-left: calc(100vw - 100%);
+  }
+}
+
+@layer base {
+  * {
+    @apply border-border;
+  }
+  body {
+    @apply bg-background text-foreground min-h-screen flex flex-col justify-normal;
+  }
+}
--- a/apps/web/src/app.html
+++ b/apps/web/src/app.html
@@ -1,12 +1,15 @@
 <!doctype html>
-<html lang="en">
-	<head>
+<html lang="ja">
+
+<head>
  <meta charset="utf-8" />
  <link rel="icon" href="%sveltekit.assets%/favicon.png" />
  <meta name="viewport" content="width=device-width, initial-scale=1" />
  %sveltekit.head%
-	</head>
-	<body data-sveltekit-preload-data="hover">
+</head>
+
+<body data-sveltekit-preload-data="hover">
  <div style="display: contents">%sveltekit.body%</div>
-	</body>
+</body>
+
 </html>
--- a/apps/web/src/assets/images/static/icon/jakeko.webp
+++ b/apps/web/src/assets/images/static/icon/jakeko.webp
--- a/apps/web/src/assets/images/static/icon/logic-chang.webp
+++ b/apps/web/src/assets/images/static/icon/logic-chang.webp
--- a/apps/web/src/assets/images/static/icon/tapl.webp
+++ b/apps/web/src/assets/images/static/icon/tapl.webp
--- a/apps/web/src/assets/images/static/logic-chang.svg
+++ b/apps/web/src/assets/images/static/logic-chang.svg
--- a/apps/web/src/lib/common/seo.ts
+++ b/apps/web/src/lib/common/seo.ts
@@ -0,0 +1,38 @@
+import type { ComponentProps } from "svelte";
+import type SvelteSeo from "svelte-seo";
+
+import deepmerge from "deepmerge";
+
+export type Seo = ComponentProps<SvelteSeo>;
+
+export const defaultSeo: Seo = {
+  title: "cannorin.net",
+  description: "cannorin's website",
+  themeColor: "#fafafa",
+
+  openGraph: {
+    title: "cannorin.net",
+    type: "website",
+    description: "cannorin's website",
+    locale: "ja_JP",
+  },
+
+  twitter: {
+    title: "cannorin.net",
+    description: "cannorin's website",
+    card: "summary",
+    creator: "cannorin3",
+  },
+};
+
+export const mergeSeo = (
+  target: Seo,
+  ...sources: (Seo | undefined | false)[]
+) =>
+  sources.reduce<Seo>(
+    (acc, current) =>
+      deepmerge(acc, current || {}, {
+        arrayMerge: (_target, source) => source,
+      }),
+    target,
+  );
--- a/apps/web/src/lib/constants.ts
+++ b/apps/web/src/lib/constants.ts
@@ -0,0 +1,2 @@
+export const limitWidth =
+  "mx-auto w-full lg:max-w-[904px] xl:max-w-[1264px] px-6 lg:px-8";
--- a/apps/web/src/lib/global.d.ts
+++ b/apps/web/src/lib/global.d.ts
@@ -0,0 +1,45 @@
+interface String {
+  concat<S extends string>(string: S): `${this}${S}`;
+  concat<S1 extends string, S2 extends string>(
+    s1: S1,
+    s2: S2,
+  ): `${this}${S1}${S2}`;
+  startsWith<S extends string>(searchString: S): this is `${S}${string}`;
+  endsWith<S extends string>(searchString: S): this is `${string}${S}`;
+  includes<S extends string>(
+    searchString: S,
+    position?: number,
+  ): this is `${string}${S}${string}`;
+}
+
+type LiteralUnionLike<T> = T extends string
+  ? T extends ""
+    ? T
+    : T extends `${T}${T}`
+      ? never
+      : T
+  : T extends number
+    ? `${T}0` extends `${number}`
+      ? T
+      : never
+    : T extends null | undefined
+      ? T
+      : never;
+
+interface Array<T> {
+  includes(
+    searchElement: T extends LiteralUnionLike<T> ? unknown : never,
+    fromIndex?: number,
+  ): searchElement is T extends LiteralUnionLike<T> ? T : never;
+}
+
+interface ReadonlyArray<T> {
+  includes(
+    searchElement: T extends LiteralUnionLike<T> ? unknown : never,
+    fromIndex?: number,
+  ): searchElement is T extends LiteralUnionLike<T> ? T : never;
+}
+
+interface Map<K> {
+  has(key: Weaken<K>): key is K;
+}
--- a/apps/web/src/lib/index.ts
+++ b/apps/web/src/lib/index.ts
@@ -1 +1,7 @@
-// place files you want to import through the `$lib` alias in this folder.
+export function tryOneOf<const T>(
+  value: T extends LiteralUnionLike<T> ? unknown : never,
+  consts: readonly T[],
+) {
+  if (consts.includes(value)) return value;
+  return undefined;
+}
--- a/apps/web/src/lib/utils.ts
+++ b/apps/web/src/lib/utils.ts
@@ -0,0 +1,6 @@
+import { type ClassValue, clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+
+export function cn(...inputs: ClassValue[]) {
+  return twMerge(clsx(inputs));
+}
--- a/apps/web/src/routes/+error.svelte
+++ b/apps/web/src/routes/+error.svelte
@@ -0,0 +1,59 @@
+<script lang="ts">
+import { page } from "$app/state";
+import { limitWidth } from "$lib/constants";
+import { cn } from "$lib/utils";
+
+const codeNames: Record<number, string> = {
+  400: "Bad Request",
+  401: "Unauthorized",
+  402: "Payment Required",
+  403: "Forbidden",
+  404: "Not Found",
+  405: "Method Not Allowed",
+  406: "Not Acceptable",
+  407: "Proxy Authentication Required",
+  408: "Request Timeout",
+  409: "Conflict",
+  410: "Gone",
+  411: "Length Required",
+  412: "Precondition Required",
+  413: "Payload Too Large",
+  414: "URI Too Long",
+  415: "Unsupported Media Type",
+  416: "Range Not Satisfiable",
+  417: "Expectation Failed",
+  429: "Too Many Requests",
+  451: "Unavailable For Legal Reasons",
+  500: "Internal Server Error",
+  501: "Not Implemented",
+  502: "Bad Gateway",
+  503: "Service Unavailable",
+  504: "Gateway Timeout",
+  505: "HTTP Version Not Supported",
+};
+</script>
+
+<main class={cn("flex grow flex-col items-center justify-center gap-10 py-10 relative overflow-hidden", limitWidth)}>
+  <section class="flex min-w-full flex-col items-center gap-6 ">
+    <h1 class="text-center text-5xl font-display leading-[1.125]">
+      <span>{page.status}</span>
+      <span class="whitespace-nowrap">
+        {codeNames[page.status] ?? "Unknown Error"}
+      </span>
+    </h1>
+
+    <div class="text-sm">
+      {#if page.status === 400}
+        <p>リクエストの結果エラーが発生しました。</p>
+      {:else if page.status === 401}
+        <p>このページを表示するにはログインする必要があります。</p>
+      {:else if page.status === 403}
+        <p>このページを閲覧する権限がありません。</p>
+      {:else if page.status === 404}
+        <p>お探しのページは見つかりませんでした。</p>
+      {:else}
+        <p>{page.error?.message}</p>
+      {/if}
+    </div>
+  </section>
+</main>
--- a/apps/web/src/routes/+layout.svelte
+++ b/apps/web/src/routes/+layout.svelte
@@ -1,6 +1,23 @@
 <script lang="ts">
 import "../app.css";
+import "./webfont.css";
+
+import { page } from "$app/state";
+import { PUBLIC_WEB_DOMAIN } from "$env/static/public";
+import { defaultSeo, mergeSeo } from "$lib/common/seo";
+import SvelteSeo from "svelte-seo";
+
 let { children } = $props();
+let seo = $derived.by(() =>
+  mergeSeo(defaultSeo, page.data.seo, {
+    canonical: `https://${PUBLIC_WEB_DOMAIN}${page.url.pathname}`,
+    openGraph: {
+      url: `https://${PUBLIC_WEB_DOMAIN}${page.url.pathname}`,
+    },
+  }),
+);
 </script>

+<SvelteSeo {...seo} />
+
 {@render children()}
--- a/apps/web/src/routes/+page.svelte
+++ b/apps/web/src/routes/+page.svelte
@@ -1,2 +1,255 @@
-<h1>Welcome to SvelteKit</h1>
-<p>Visit <a href="https://svelte.dev/docs/kit">svelte.dev/docs/kit</a> to read the documentation</p>
+<script lang="ts">
+import { limitWidth } from "$lib/constants";
+import { cn } from "$lib/utils";
+
+import SiBandcamp from "@icons-pack/svelte-simple-icons/icons/SiBandcamp";
+import SiDiscord from "@icons-pack/svelte-simple-icons/icons/SiDiscord";
+import SiGithub from "@icons-pack/svelte-simple-icons/icons/SiGithub";
+import SiKeybase from "@icons-pack/svelte-simple-icons/icons/SiKeybase";
+import SiMisskey from "@icons-pack/svelte-simple-icons/icons/SiMisskey";
+import SiMixcloud from "@icons-pack/svelte-simple-icons/icons/SiMixcloud";
+import SiOrcid from "@icons-pack/svelte-simple-icons/icons/SiOrcid";
+import SiQiita from "@icons-pack/svelte-simple-icons/icons/SiQiita";
+import SiResearchgate from "@icons-pack/svelte-simple-icons/icons/SiResearchgate";
+import SiSoundcloud from "@icons-pack/svelte-simple-icons/icons/SiSoundcloud";
+import SiSteam from "@icons-pack/svelte-simple-icons/icons/SiSteam";
+import SiTwitch from "@icons-pack/svelte-simple-icons/icons/SiTwitch";
+import SiX from "@icons-pack/svelte-simple-icons/icons/SiX";
+import SiZenn from "@icons-pack/svelte-simple-icons/icons/SiZenn";
+</script>
+
+<!-- Sections -->
+<main class={cn(limitWidth, "flex grow flex-col items-center gap-12 lg:gap-16 py-8")}>
+  <h1 class="font-display text-4xl md:text-5xl lg:text-6xl animate-fade-in">cannorin.net</h1>
+
+  <section class="grid grid-cols-1 md:grid-cols-3 gap-4 lg:gap-8">
+    <h2 class="sr-only">自己紹介</h2>
+
+    <section class="card">
+      <enhanced:img src="../assets/images/static/icon/jakeko.webp?w=1080,800,600,400,300" sizes="min(100vw, 400px)" alt="" />
+      <div class="body">
+        <h3>DJ / Composer</h3>
+        <p>ワイヤードでは VRChat を拠点に、リアルワールドでは大阪を拠点にして、DJ や作曲などの音楽活動を行っています。</p>
+        <nav>
+          <ul class="links">
+            <li>
+              <a href="https://cannorin.bandcamp.com/" target="_blank">
+                <SiBandcamp title="Bandcamp" />
+              </a>
+            </li>
+            <li>
+              <a href="https://soundcloud.com/cannorin" target="_blank">
+                <SiSoundcloud title="Soundcloud" />
+              </a>
+            </li>
+            <li>
+              <a href="https://mixcloud.com/cannorin" target="_blank">
+                <SiMixcloud title="Mixcloud" />
+              </a>
+            </li>
+            <li class="more">
+              <button disabled class="tooltip cursor-not-allowed">
+                <span class="tooltip-text">coming soon™</span>
+                More
+              </button>
+            </li>
+          </ul>
+        </nav>
+      </div>
+    </section>
+
+    <section class="card">
+      <enhanced:img src="../assets/images/static/icon/tapl.webp?w=1080,800,640,400,320" sizes="min(100vw, 400px)" alt="" />
+      <div class="body">
+        <h3>Developer</h3>
+        <p>フルスタックエンジニアとして働いており、いくつかの OSS に関わっています。また、趣味で Web サービスを運用しています。</p>
+        <nav>
+          <ul class="links w-full">
+            <li>
+              <a href="https://github.com/cannorin" target="_blank">
+                <SiGithub title="GitHub" />
+              </a>
+            </li>
+            <li>
+              <a href="https://qiita.com/cannorin" target="_blank">
+                <SiQiita title="Qiita" />
+              </a>
+            </li>
+            <li>
+              <a href="https://zenn.dev/cannorin" target="_blank">
+                <SiZenn title="Zenn" />
+              </a>
+            </li>
+            <li class="more">
+              <button disabled class="tooltip cursor-not-allowed">
+                <span class="tooltip-text">coming soon™</span>
+                More
+              </button>
+            </li>
+          </ul>
+        </nav>
+      </div>
+    </section>
+
+    <section class="card">
+      <enhanced:img src="../assets/images/static/icon/logic-chang.webp?w=1080,800,600,400,300" sizes="min(100vw, 400px)" alt="" />
+      <div class="body">
+        <h3>Graduate Student</h3>
+        <p>大学院において数理論理学を研究しており、非古典論理、特に様相論理を専門としています。2025年度より博士課程に進学します。</p>
+        <nav>
+          <ul class="links">
+            <li>
+              <a href="https://orcid.org/0009-0009-3946-4260" target="_blank">
+                <SiOrcid title="ORCiD" />
+              </a>
+            </li>
+            <li>
+              <a href="https://www.researchgate.net/profile/Yuta-Sato-22" target="_blank">
+                <SiResearchgate title="ResearchGate" />
+              </a>
+            </li>
+            <li class="more">
+              <button disabled class="tooltip cursor-not-allowed">
+                <span class="tooltip-text">coming soon™</span>
+                More
+              </button>
+            </li>
+          </ul>
+        </nav>
+      </div>
+    </section>
+  </section>
+
+  <section class="followme">
+    <h2 class="font-display text-2xl">Follow me on:</h2>
+    <nav>
+      <ul class="flex flex-row flex-nowrap items-center gap-4 text-sm">
+        <li>
+          <a href="https://keybase.io/cannorin" target="_blank">
+            <SiKeybase title="Keybase" />
+          </a>
+        </li>
+        <li>
+          <a href="https://x.com/cannorin3" target="_blank">
+            <SiX title="X (Twitter)" />
+          </a>
+        </li>
+        <li>
+          <a href="https://misskey.cannorin.net/@cannorin" target="_blank">
+            <SiMisskey title="Misskey" />
+          </a>
+        </li>
+        <li>
+          <a href="https://www.twitch.tv/cannorin" target="_blank">
+            <SiTwitch title="Twitch" />
+          </a>
+        </li>
+        <li>
+          <a href="https://discord.com/users/497190979216867329" target="_blank">
+            <SiDiscord title="Discord" />
+          </a>
+        </li>
+        <li>
+          <a href="https://steamcommunity.com/id/cannorin/" target="_blank">
+            <SiSteam title="Steam" />
+          </a>
+        </li>
+      </ul>
+    </nav>
+  </section>
+</main>
+
+<style lang="postcss">
+  .card {
+    @apply relative max-w-[400px] rounded-2xl flex flex-col items-center shadow animate-fade-in overflow-clip;
+
+    &::before {
+      @apply absolute top-0 left-0 right-0 bottom-0 rounded-2xl border border-transparent;
+      z-index: -1;
+      content: "";
+      background: linear-gradient(transparent, rgb(var(--foreground) / 10%), rgb(var(--foreground) / 20%), rgb(var(--foreground) / 100%)) border-box border-box;
+      mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0) border-box;
+      mask-composite: exclude;
+    }
+
+    picture {
+      @apply w-full;
+      mask: linear-gradient(rgb(0 0 0 / 100%), rgb(0 0 0 / 90%), rgb(0 0 0 / 80%), transparent);
+
+      img {
+        @apply aspect-video md:aspect-square object-cover;
+      }
+    }
+
+    .body {
+      @apply h-full p-5 flex flex-col gap-4;
+
+      h3 {
+        @apply text-2xl font-display;
+      }
+
+      > :last-child {
+        margin-top: auto;
+      }
+
+      .links {
+        @apply flex flex-wrap items-center gap-4 text-sm;
+        .more {
+          @apply flex items-center ml-auto rounded-full;
+          background: linear-gradient(45deg, rgb(var(--primary) / 50%), rgb(var(--secondary) / 50%));
+          > * {
+            @apply px-3 py-1;
+          }
+        }
+      }
+    }
+  }
+
+  .followme {
+    @apply flex flex-row flex-wrap items-center justify-center gap-4 px-10 py-4 animate-fade-in rounded-full;
+    background: linear-gradient(45deg, rgb(var(--primary) / 50%), rgb(var(--secondary) / 50%));
+  }
+
+  /* カーソルを重ねる要素 */
+  .tooltip {
+    position: relative; /* ツールチップの位置の基準に */
+  }
+
+  /* ツールチップのテキスト */
+  .tooltip-text {
+    opacity: 0; /* はじめは隠しておく */
+    visibility: hidden; /* はじめは隠しておく */
+    position: absolute; /* 絶対配置 */
+    left: 50%; /* 親に対して中央配置 */
+    transform: translateX(-50%); /* 親に対して中央配置 */
+    bottom: 34px; /* 親要素下からの位置 */
+    display: inline-block;
+    padding: 5px; /* 余白 */
+    white-space: nowrap; /* テキストを折り返さない */
+    font-size: 0.8rem; /* フォントサイズ */
+    line-height: 1.3; /* 行間 */
+    background: rgb(var(--foreground) / 1); /* 背景色 */
+    color: rgb(var(--background) / 1); /* 文字色 */
+    border-radius: 8px; /* 角丸 */
+    transition: 0.3s ease-in; /* アニメーション */
+    display: flex;
+    align-items: center;
+    justify-content: center;
+
+    &:before {
+      content: '';
+      position: absolute;
+      top: 25px;
+      left: 50%;
+      margin-left: -7px;
+      border: 7px solid transparent;
+      border-top: 7px solid rgb(var(--foreground) / 1);
+    }
+  }
+
+  /* ホバー時にツールチップの非表示を解除 */
+  .tooltip:hover .tooltip-text {
+    opacity: 1;
+    visibility: visible;
+  }
+</style>
--- a/apps/web/src/routes/webfont.css
+++ b/apps/web/src/routes/webfont.css
--- a/apps/web/tailwind.config.ts
+++ b/apps/web/tailwind.config.ts
@@ -1,11 +1,78 @@
 import typography from "@tailwindcss/typography";
 import type { Config } from "tailwindcss";
+import { fontFamily } from "tailwindcss/defaultTheme";

 export default {
  content: ["./src/**/*.{html,js,svelte,ts}"],

  theme: {
-    extend: {},
+    container: {
+      center: true,
+      padding: "2rem",
+    },
+    extend: {
+      colors: {
+        border: "rgb(var(--border) / <alpha-value>)",
+        input: "rgb(var(--input) / <alpha-value>)",
+        ring: "rgb(var(--ring) / <alpha-value>)",
+        background: "rgb(var(--background) / <alpha-value>)",
+        foreground: "rgb(var(--foreground) / <alpha-value>)",
+        primary: {
+          DEFAULT: "rgb(var(--primary) / <alpha-value>)",
+          foreground: "rgb(var(--primary-foreground) / <alpha-value>)",
+        },
+        secondary: {
+          DEFAULT: "rgb(var(--secondary) / <alpha-value>)",
+          foreground: "rgb(var(--secondary-foreground) / <alpha-value>)",
+        },
+        destructive: {
+          DEFAULT: "rgb(var(--destructive) / <alpha-value>)",
+          foreground: "rgb(var(--destructive-foreground) / <alpha-value>)",
+        },
+        muted: {
+          DEFAULT: "rgb(var(--muted) / <alpha-value>)",
+          foreground: "rgb(var(--muted-foreground) / <alpha-value>)",
+        },
+        accent: {
+          DEFAULT: "rgb(var(--accent) / <alpha-value>)",
+          foreground: "rgb(var(--accent-foreground) / <alpha-value>)",
+        },
+        popover: {
+          DEFAULT: "rgb(var(--popover) / <alpha-value>)",
+          foreground: "rgb(var(--popover-foreground) / <alpha-value>)",
+        },
+        card: {
+          DEFAULT: "rgb(var(--card) / <alpha-value>)",
+          foreground: "rgb(var(--card-foreground) / <alpha-value>)",
+        },
+      },
+      fontFamily: {
+        sans: ["Zen Kaku Gothic New", ...fontFamily.sans],
+        display: ["Poiret One"],
+      },
+      animation: {
+        blink: "blink 0.6s ease both",
+        "fade-in": "fade-in 0.3s cubic-bezier(0.390, 0.575, 0.565, 1.000) both",
+      },
+      keyframes: {
+        blink: {
+          "0%,50%,to": {
+            opacity: "1",
+          },
+          "25%,75%": {
+            opacity: "0",
+          },
+        },
+        "fade-in": {
+          "0%": {
+            opacity: "0",
+          },
+          to: {
+            opacity: "1",
+          },
+        },
+      },
+    },
  },

  plugins: [typography],
--- a/apps/web/vite.config.ts
+++ b/apps/web/vite.config.ts
@@ -1,6 +1,7 @@
+import { enhancedImages } from "@sveltejs/enhanced-img";
 import { sveltekit } from "@sveltejs/kit/vite";
 import { defineConfig } from "vite";

 export default defineConfig({
-  plugins: [sveltekit()],
+  plugins: [enhancedImages(), sveltekit()],
 });
--- a/biome.json
+++ b/biome.json
@@ -7,7 +7,7 @@
  },
  "files": {
    "ignoreUnknown": false,
-    "ignore": [".env", ".env.*", ".yarn/**/*"]
+    "ignore": [".env", ".env.*", ".yarn/**/*", "*.*css"]
  },
  "formatter": {
    "enabled": true,
--- a/package.json
+++ b/package.json
@@ -6,7 +6,8 @@
    "dev": "turbo run dev",
    "check": "turbo run check",
    "lint": "turbo run lint",
-    "fix": "turbo run fix"
+    "fix": "turbo run fix",
+    "gen:env": "bash scripts/generate_env_for_apps.sh"
  },
  "devDependencies": {
    "@biomejs/biome": "1.9.4",
--- a/scripts/generate_env_for_apps.sh
+++ b/scripts/generate_env_for_apps.sh
@@ -0,0 +1,16 @@
+#!/bin/bash
+
+SCRIPT_DIR=$(dirname "$0")
+
+# Ensure that the working directory is the project root
+cd $SCRIPT_DIR/../
+
+# Read Terraform outputs and format it as .env
+ENV_FILE_CONTENT=$(cd terraform && terraform output -json | jq -r "to_entries |map(\"\(.key)=\\\"\(.value.value)\\\"\")|.[]")
+
+# Put .env files to each app directory
+for d in apps/*/ ; do
+  [ -L "${d%/}" ] && continue # Skip symlinks
+  printf "$ENV_FILE_CONTENT" > $d/.env
+  printf "$ENV_FILE_CONTENT" > $d/.dev.vars
+done
--- a/terraform/output.tf
+++ b/terraform/output.tf
@@ -0,0 +1,12 @@
+output "PUBLIC_WEB_TURNSTILE_SITEKEY" {
+  value = cloudflare_turnstile_widget.web.id
+}
+
+output "PUBLIC_WEB_DOMAIN" {
+  value = local.web_domain
+}
+
+output "WEB_TURNSTILE_SECRET_KEY" {
+  value     = cloudflare_turnstile_widget.web.secret
+  sensitive = true
+}
--- a/yarn.lock
+++ b/yarn.lock
@@ -113,6 +113,15 @@ __metadata:
  languageName: node
  linkType: hard

+"@emnapi/runtime@npm:^1.2.0":
+  version: 1.3.1
+  resolution: "@emnapi/runtime@npm:1.3.1"
+  dependencies:
+    tslib: "npm:^2.4.0"
+  checksum: 10c0/060ffede50f1b619c15083312b80a9e62a5b0c87aa8c1b54854c49766c9d69f8d1d3d87bd963a647071263a320db41b25eaa50b74d6a80dcc763c23dbeaafd6c
+  languageName: node
+  linkType: hard
+
 "@esbuild/aix-ppc64@npm:0.21.5":
  version: 0.21.5
  resolution: "@esbuild/aix-ppc64@npm:0.21.5"
@@ -274,6 +283,205 @@ __metadata:
  languageName: node
  linkType: hard

+"@fontsource/poiret-one@npm:5.1.1":
+  version: 5.1.1
+  resolution: "@fontsource/poiret-one@npm:5.1.1"
+  checksum: 10c0/109b0d7de84430b4c94aa7c043e402ba4a0b67e0a90215c239c15ead354877e4e6cd8aed0f5c400dace474b30a0193b1dba17e2621e7bb39734b3a07067a8752
+  languageName: node
+  linkType: hard
+
+"@fontsource/zen-kaku-gothic-new@npm:5.1.1":
+  version: 5.1.1
+  resolution: "@fontsource/zen-kaku-gothic-new@npm:5.1.1"
+  checksum: 10c0/4c9f47849c41247c05655eab9363de5a112fd7a827614d7560bcf36f0b352f2f338359c8caaefaa74c6e109b506cb91554499acdbc31937de5cc33f98d3583fa
+  languageName: node
+  linkType: hard
+
+"@icons-pack/svelte-simple-icons@npm:4.0.1":
+  version: 4.0.1
+  resolution: "@icons-pack/svelte-simple-icons@npm:4.0.1"
+  peerDependencies:
+    "@sveltejs/kit": 2.5.0
+    svelte: 4.2.0
+  checksum: 10c0/d20b7cd2502bfc0c38a5b4fff49f4e3c2e6587067bc8dd98a839511df6127f8fbc88b819f2d8cce036240f44e7c0e20ced0ec8d6f7992cc9ee3b7efa9eca87ed
+  languageName: node
+  linkType: hard
+
+"@img/sharp-darwin-arm64@npm:0.33.5":
+  version: 0.33.5
+  resolution: "@img/sharp-darwin-arm64@npm:0.33.5"
+  dependencies:
+    "@img/sharp-libvips-darwin-arm64": "npm:1.0.4"
+  dependenciesMeta:
+    "@img/sharp-libvips-darwin-arm64":
+      optional: true
+  conditions: os=darwin & cpu=arm64
+  languageName: node
+  linkType: hard
+
+"@img/sharp-darwin-x64@npm:0.33.5":
+  version: 0.33.5
+  resolution: "@img/sharp-darwin-x64@npm:0.33.5"
+  dependencies:
+    "@img/sharp-libvips-darwin-x64": "npm:1.0.4"
+  dependenciesMeta:
+    "@img/sharp-libvips-darwin-x64":
+      optional: true
+  conditions: os=darwin & cpu=x64
+  languageName: node
+  linkType: hard
+
+"@img/sharp-libvips-darwin-arm64@npm:1.0.4":
+  version: 1.0.4
+  resolution: "@img/sharp-libvips-darwin-arm64@npm:1.0.4"
+  conditions: os=darwin & cpu=arm64
+  languageName: node
+  linkType: hard
+
+"@img/sharp-libvips-darwin-x64@npm:1.0.4":
+  version: 1.0.4
+  resolution: "@img/sharp-libvips-darwin-x64@npm:1.0.4"
+  conditions: os=darwin & cpu=x64
+  languageName: node
+  linkType: hard
+
+"@img/sharp-libvips-linux-arm64@npm:1.0.4":
+  version: 1.0.4
+  resolution: "@img/sharp-libvips-linux-arm64@npm:1.0.4"
+  conditions: os=linux & cpu=arm64 & libc=glibc
+  languageName: node
+  linkType: hard
+
+"@img/sharp-libvips-linux-arm@npm:1.0.5":
+  version: 1.0.5
+  resolution: "@img/sharp-libvips-linux-arm@npm:1.0.5"
+  conditions: os=linux & cpu=arm & libc=glibc
+  languageName: node
+  linkType: hard
+
+"@img/sharp-libvips-linux-s390x@npm:1.0.4":
+  version: 1.0.4
+  resolution: "@img/sharp-libvips-linux-s390x@npm:1.0.4"
+  conditions: os=linux & cpu=s390x & libc=glibc
+  languageName: node
+  linkType: hard
+
+"@img/sharp-libvips-linux-x64@npm:1.0.4":
+  version: 1.0.4
+  resolution: "@img/sharp-libvips-linux-x64@npm:1.0.4"
+  conditions: os=linux & cpu=x64 & libc=glibc
+  languageName: node
+  linkType: hard
+
+"@img/sharp-libvips-linuxmusl-arm64@npm:1.0.4":
+  version: 1.0.4
+  resolution: "@img/sharp-libvips-linuxmusl-arm64@npm:1.0.4"
+  conditions: os=linux & cpu=arm64 & libc=musl
+  languageName: node
+  linkType: hard
+
+"@img/sharp-libvips-linuxmusl-x64@npm:1.0.4":
+  version: 1.0.4
+  resolution: "@img/sharp-libvips-linuxmusl-x64@npm:1.0.4"
+  conditions: os=linux & cpu=x64 & libc=musl
+  languageName: node
+  linkType: hard
+
+"@img/sharp-linux-arm64@npm:0.33.5":
+  version: 0.33.5
+  resolution: "@img/sharp-linux-arm64@npm:0.33.5"
+  dependencies:
+    "@img/sharp-libvips-linux-arm64": "npm:1.0.4"
+  dependenciesMeta:
+    "@img/sharp-libvips-linux-arm64":
+      optional: true
+  conditions: os=linux & cpu=arm64 & libc=glibc
+  languageName: node
+  linkType: hard
+
+"@img/sharp-linux-arm@npm:0.33.5":
+  version: 0.33.5
+  resolution: "@img/sharp-linux-arm@npm:0.33.5"
+  dependencies:
+    "@img/sharp-libvips-linux-arm": "npm:1.0.5"
+  dependenciesMeta:
+    "@img/sharp-libvips-linux-arm":
+      optional: true
+  conditions: os=linux & cpu=arm & libc=glibc
+  languageName: node
+  linkType: hard
+
+"@img/sharp-linux-s390x@npm:0.33.5":
+  version: 0.33.5
+  resolution: "@img/sharp-linux-s390x@npm:0.33.5"
+  dependencies:
+    "@img/sharp-libvips-linux-s390x": "npm:1.0.4"
+  dependenciesMeta:
+    "@img/sharp-libvips-linux-s390x":
+      optional: true
+  conditions: os=linux & cpu=s390x & libc=glibc
+  languageName: node
+  linkType: hard
+
+"@img/sharp-linux-x64@npm:0.33.5":
+  version: 0.33.5
+  resolution: "@img/sharp-linux-x64@npm:0.33.5"
+  dependencies:
+    "@img/sharp-libvips-linux-x64": "npm:1.0.4"
+  dependenciesMeta:
+    "@img/sharp-libvips-linux-x64":
+      optional: true
+  conditions: os=linux & cpu=x64 & libc=glibc
+  languageName: node
+  linkType: hard
+
+"@img/sharp-linuxmusl-arm64@npm:0.33.5":
+  version: 0.33.5
+  resolution: "@img/sharp-linuxmusl-arm64@npm:0.33.5"
+  dependencies:
+    "@img/sharp-libvips-linuxmusl-arm64": "npm:1.0.4"
+  dependenciesMeta:
+    "@img/sharp-libvips-linuxmusl-arm64":
+      optional: true
+  conditions: os=linux & cpu=arm64 & libc=musl
+  languageName: node
+  linkType: hard
+
+"@img/sharp-linuxmusl-x64@npm:0.33.5":
+  version: 0.33.5
+  resolution: "@img/sharp-linuxmusl-x64@npm:0.33.5"
+  dependencies:
+    "@img/sharp-libvips-linuxmusl-x64": "npm:1.0.4"
+  dependenciesMeta:
+    "@img/sharp-libvips-linuxmusl-x64":
+      optional: true
+  conditions: os=linux & cpu=x64 & libc=musl
+  languageName: node
+  linkType: hard
+
+"@img/sharp-wasm32@npm:0.33.5":
+  version: 0.33.5
+  resolution: "@img/sharp-wasm32@npm:0.33.5"
+  dependencies:
+    "@emnapi/runtime": "npm:^1.2.0"
+  conditions: cpu=wasm32
+  languageName: node
+  linkType: hard
+
+"@img/sharp-win32-ia32@npm:0.33.5":
+  version: 0.33.5
+  resolution: "@img/sharp-win32-ia32@npm:0.33.5"
+  conditions: os=win32 & cpu=ia32
+  languageName: node
+  linkType: hard
+
+"@img/sharp-win32-x64@npm:0.33.5":
+  version: 0.33.5
+  resolution: "@img/sharp-win32-x64@npm:0.33.5"
+  conditions: os=win32 & cpu=x64
+  languageName: node
+  linkType: hard
+
 "@isaacs/cliui@npm:^8.0.2":
  version: 8.0.2
  resolution: "@isaacs/cliui@npm:8.0.2"
@@ -402,6 +610,22 @@ __metadata:
  languageName: node
  linkType: hard

+"@rollup/pluginutils@npm:^5.0.5":
+  version: 5.1.4
+  resolution: "@rollup/pluginutils@npm:5.1.4"
+  dependencies:
+    "@types/estree": "npm:^1.0.0"
+    estree-walker: "npm:^2.0.2"
+    picomatch: "npm:^4.0.2"
+  peerDependencies:
+    rollup: ^1.20.0||^2.0.0||^3.0.0||^4.0.0
+  peerDependenciesMeta:
+    rollup:
+      optional: true
+  checksum: 10c0/6d58fbc6f1024eb4b087bc9bf59a1d655a8056a60c0b4021d3beaeec3f0743503f52467fd89d2cf0e7eccf2831feb40a05ad541a17637ea21ba10b21c2004deb
+  languageName: node
+  linkType: hard
+
 "@rollup/rollup-android-arm-eabi@npm:4.29.1":
  version: 4.29.1
  resolution: "@rollup/rollup-android-arm-eabi@npm:4.29.1"
@@ -546,6 +770,22 @@ __metadata:
  languageName: node
  linkType: hard

+"@sveltejs/enhanced-img@npm:0.4.4":
+  version: 0.4.4
+  resolution: "@sveltejs/enhanced-img@npm:0.4.4"
+  dependencies:
+    magic-string: "npm:^0.30.5"
+    sharp: "npm:^0.33.5"
+    svelte-parse-markup: "npm:^0.1.5"
+    vite-imagetools: "npm:^7.0.1"
+    zimmerframe: "npm:^1.1.2"
+  peerDependencies:
+    svelte: ^5.0.0
+    vite: ">= 5.0.0"
+  checksum: 10c0/ff41a1cfdc93460985667fbb3fae9c00c4dee45c20fdf252b7d3cff670adc454150175a529fcf46c3c9f1794b07d8a8069916def8fb24e7899f4ba061a96e041
+  languageName: node
+  linkType: hard
+
 "@sveltejs/kit@npm:2.15.1":
  version: 2.15.1
  resolution: "@sveltejs/kit@npm:2.15.1"
@@ -623,7 +863,7 @@ __metadata:
  languageName: node
  linkType: hard

-"@types/estree@npm:1.0.6, @types/estree@npm:^1.0.5, @types/estree@npm:^1.0.6":
+"@types/estree@npm:1.0.6, @types/estree@npm:^1.0.0, @types/estree@npm:^1.0.5, @types/estree@npm:^1.0.6":
  version: 1.0.6
  resolution: "@types/estree@npm:1.0.6"
  checksum: 10c0/cdfd751f6f9065442cd40957c07fd80361c962869aa853c1c2fd03e101af8b9389d8ff4955a43a6fcfa223dd387a089937f95be0f3eec21ca527039fd2d9859a
@@ -879,13 +1119,33 @@ __metadata:
  languageName: node
  linkType: hard

-"color-name@npm:~1.1.4":
+"color-name@npm:^1.0.0, color-name@npm:~1.1.4":
  version: 1.1.4
  resolution: "color-name@npm:1.1.4"
  checksum: 10c0/a1a3f914156960902f46f7f56bc62effc6c94e84b2cae157a526b1c1f74b677a47ec602bf68a61abfa2b42d15b7c5651c6dbe72a43af720bc588dff885b10f95
  languageName: node
  linkType: hard

+"color-string@npm:^1.9.0":
+  version: 1.9.1
+  resolution: "color-string@npm:1.9.1"
+  dependencies:
+    color-name: "npm:^1.0.0"
+    simple-swizzle: "npm:^0.2.2"
+  checksum: 10c0/b0bfd74c03b1f837f543898b512f5ea353f71630ccdd0d66f83028d1f0924a7d4272deb278b9aef376cacf1289b522ac3fb175e99895283645a2dc3a33af2404
+  languageName: node
+  linkType: hard
+
+"color@npm:^4.2.3":
+  version: 4.2.3
+  resolution: "color@npm:4.2.3"
+  dependencies:
+    color-convert: "npm:^2.0.1"
+    color-string: "npm:^1.9.0"
+  checksum: 10c0/7fbe7cfb811054c808349de19fb380252e5e34e61d7d168ec3353e9e9aacb1802674bddc657682e4e9730c2786592a4de6f8283e7e0d3870b829bb0b7b2f6118
+  languageName: node
+  linkType: hard
+
 "commander@npm:^4.0.0":
  version: 4.1.1
  resolution: "commander@npm:4.1.1"
@@ -932,13 +1192,20 @@ __metadata:
  languageName: node
  linkType: hard

-"deepmerge@npm:^4.3.1":
+"deepmerge@npm:4.3.1, deepmerge@npm:^4.3.1":
  version: 4.3.1
  resolution: "deepmerge@npm:4.3.1"
  checksum: 10c0/e53481aaf1aa2c4082b5342be6b6d8ad9dfe387bc92ce197a66dea08bd4265904a087e75e464f14d1347cf2ac8afe1e4c16b266e0561cc5df29382d3c5f80044
  languageName: node
  linkType: hard

+"detect-libc@npm:^2.0.3":
+  version: 2.0.3
+  resolution: "detect-libc@npm:2.0.3"
+  checksum: 10c0/88095bda8f90220c95f162bf92cad70bd0e424913e655c20578600e35b91edc261af27531cf160a331e185c0ced93944bc7e09939143225f56312d7fd800fdb7
+  languageName: node
+  linkType: hard
+
 "devalue@npm:^5.1.0":
  version: 5.1.1
  resolution: "devalue@npm:5.1.1"
@@ -1114,6 +1381,13 @@ __metadata:
  languageName: node
  linkType: hard

+"estree-walker@npm:^2.0.2":
+  version: 2.0.2
+  resolution: "estree-walker@npm:2.0.2"
+  checksum: 10c0/53a6c54e2019b8c914dc395890153ffdc2322781acf4bd7d1a32d7aedc1710807bdcd866ac133903d5629ec601fbb50abe8c2e5553c7f5a0afdd9b6af6c945af
+  languageName: node
+  linkType: hard
+
 "exponential-backoff@npm:^3.1.1":
  version: 3.1.1
  resolution: "exponential-backoff@npm:3.1.1"
@@ -1316,6 +1590,13 @@ __metadata:
  languageName: node
  linkType: hard

+"imagetools-core@npm:^7.0.2":
+  version: 7.0.2
+  resolution: "imagetools-core@npm:7.0.2"
+  checksum: 10c0/e0115391b5f7d35449f11909d5e9db7b13db334baac3004c9aa20cf5c97f55f80e0afe806f4e3fc11ee2a5f7425a71df4101f6a491b03fd06812c6f1c19b3439
+  languageName: node
+  linkType: hard
+
 "import-meta-resolve@npm:^4.1.0":
  version: 4.1.0
  resolution: "import-meta-resolve@npm:4.1.0"
@@ -1340,6 +1621,13 @@ __metadata:
  languageName: node
  linkType: hard

+"is-arrayish@npm:^0.3.1":
+  version: 0.3.2
+  resolution: "is-arrayish@npm:0.3.2"
+  checksum: 10c0/f59b43dc1d129edb6f0e282595e56477f98c40278a2acdc8b0a5c57097c9eff8fe55470493df5775478cf32a4dc8eaf6d3a749f07ceee5bc263a78b2434f6a54
+  languageName: node
+  linkType: hard
+
 "is-binary-path@npm:~2.1.0":
  version: 2.1.0
  resolution: "is-binary-path@npm:2.1.0"
@@ -1811,6 +2099,13 @@ __metadata:
  languageName: node
  linkType: hard

+"picomatch@npm:^4.0.2":
+  version: 4.0.2
+  resolution: "picomatch@npm:4.0.2"
+  checksum: 10c0/7c51f3ad2bb42c776f49ebf964c644958158be30d0a510efd5a395e8d49cb5acfed5b82c0c5b365523ce18e6ab85013c9ebe574f60305892ec3fa8eee8304ccc
+  languageName: node
+  linkType: hard
+
 "pify@npm:^2.3.0":
  version: 2.3.0
  resolution: "pify@npm:2.3.0"
@@ -2113,7 +2408,16 @@ __metadata:
  languageName: node
  linkType: hard

-"semver@npm:^7.3.5":
+"schema-dts@npm:^1.1.2":
+  version: 1.1.2
+  resolution: "schema-dts@npm:1.1.2"
+  peerDependencies:
+    typescript: ">=4.1.0"
+  checksum: 10c0/bcca8719b1bb1cd71ba2b01a5126b3579e917a2f193e10fcffe020fa42fef911776ed9d2197c9f376780e703994b3ab854db3f962c47064f7282f41eff0f1d24
+  languageName: node
+  linkType: hard
+
+"semver@npm:^7.3.5, semver@npm:^7.6.3":
  version: 7.6.3
  resolution: "semver@npm:7.6.3"
  bin:
@@ -2129,6 +2433,75 @@ __metadata:
  languageName: node
  linkType: hard

+"sharp@npm:^0.33.4, sharp@npm:^0.33.5":
+  version: 0.33.5
+  resolution: "sharp@npm:0.33.5"
+  dependencies:
+    "@img/sharp-darwin-arm64": "npm:0.33.5"
+    "@img/sharp-darwin-x64": "npm:0.33.5"
+    "@img/sharp-libvips-darwin-arm64": "npm:1.0.4"
+    "@img/sharp-libvips-darwin-x64": "npm:1.0.4"
+    "@img/sharp-libvips-linux-arm": "npm:1.0.5"
+    "@img/sharp-libvips-linux-arm64": "npm:1.0.4"
+    "@img/sharp-libvips-linux-s390x": "npm:1.0.4"
+    "@img/sharp-libvips-linux-x64": "npm:1.0.4"
+    "@img/sharp-libvips-linuxmusl-arm64": "npm:1.0.4"
+    "@img/sharp-libvips-linuxmusl-x64": "npm:1.0.4"
+    "@img/sharp-linux-arm": "npm:0.33.5"
+    "@img/sharp-linux-arm64": "npm:0.33.5"
+    "@img/sharp-linux-s390x": "npm:0.33.5"
+    "@img/sharp-linux-x64": "npm:0.33.5"
+    "@img/sharp-linuxmusl-arm64": "npm:0.33.5"
+    "@img/sharp-linuxmusl-x64": "npm:0.33.5"
+    "@img/sharp-wasm32": "npm:0.33.5"
+    "@img/sharp-win32-ia32": "npm:0.33.5"
+    "@img/sharp-win32-x64": "npm:0.33.5"
+    color: "npm:^4.2.3"
+    detect-libc: "npm:^2.0.3"
+    semver: "npm:^7.6.3"
+  dependenciesMeta:
+    "@img/sharp-darwin-arm64":
+      optional: true
+    "@img/sharp-darwin-x64":
+      optional: true
+    "@img/sharp-libvips-darwin-arm64":
+      optional: true
+    "@img/sharp-libvips-darwin-x64":
+      optional: true
+    "@img/sharp-libvips-linux-arm":
+      optional: true
+    "@img/sharp-libvips-linux-arm64":
+      optional: true
+    "@img/sharp-libvips-linux-s390x":
+      optional: true
+    "@img/sharp-libvips-linux-x64":
+      optional: true
+    "@img/sharp-libvips-linuxmusl-arm64":
+      optional: true
+    "@img/sharp-libvips-linuxmusl-x64":
+      optional: true
+    "@img/sharp-linux-arm":
+      optional: true
+    "@img/sharp-linux-arm64":
+      optional: true
+    "@img/sharp-linux-s390x":
+      optional: true
+    "@img/sharp-linux-x64":
+      optional: true
+    "@img/sharp-linuxmusl-arm64":
+      optional: true
+    "@img/sharp-linuxmusl-x64":
+      optional: true
+    "@img/sharp-wasm32":
+      optional: true
+    "@img/sharp-win32-ia32":
+      optional: true
+    "@img/sharp-win32-x64":
+      optional: true
+  checksum: 10c0/6b81421ddfe6ee524d8d77e325c5e147fef22884e1c7b1656dfd89a88d7025894115da02d5f984261bf2e6daa16f98cadd1721c4ba408b4212b1d2a60f233484
+  languageName: node
+  linkType: hard
+
 "shebang-command@npm:^2.0.0":
  version: 2.0.0
  resolution: "shebang-command@npm:2.0.0"
@@ -2152,6 +2525,15 @@ __metadata:
  languageName: node
  linkType: hard

+"simple-swizzle@npm:^0.2.2":
+  version: 0.2.2
+  resolution: "simple-swizzle@npm:0.2.2"
+  dependencies:
+    is-arrayish: "npm:^0.3.1"
+  checksum: 10c0/df5e4662a8c750bdba69af4e8263c5d96fe4cd0f9fe4bdfa3cbdeb45d2e869dff640beaaeb1ef0e99db4d8d2ec92f85508c269f50c972174851bc1ae5bd64308
+  languageName: node
+  linkType: hard
+
 "sirv@npm:^3.0.0":
  version: 3.0.0
  resolution: "sirv@npm:3.0.0"
@@ -2297,6 +2679,24 @@ __metadata:
  languageName: node
  linkType: hard

+"svelte-parse-markup@npm:^0.1.5":
+  version: 0.1.5
+  resolution: "svelte-parse-markup@npm:0.1.5"
+  peerDependencies:
+    svelte: ^3.0.0 || ^4.0.0 || ^5.0.0-next.1
+  checksum: 10c0/7f4a614df3f7dff0ee82e1a5766a7f1bc5a12b846c800d893edb7d73cd9d4ba2ff5ddd58f248fbd01c0c98355d63a45ce9c503df8ae0a1110dc1422a128af251
+  languageName: node
+  linkType: hard
+
+"svelte-seo@npm:1.6.1":
+  version: 1.6.1
+  resolution: "svelte-seo@npm:1.6.1"
+  dependencies:
+    schema-dts: "npm:^1.1.2"
+  checksum: 10c0/508e761289bed359fbd363a1a2bf032c432ae01350cb0817d4cc38765dcbdb92c37b177ca56e0fbef4c61922fecba8f5815b4afffa05302f92dc12beadcb6745
+  languageName: node
+  linkType: hard
+
 "svelte@npm:5.16.1":
  version: 5.16.1
  resolution: "svelte@npm:5.16.1"
@@ -2319,6 +2719,13 @@ __metadata:
  languageName: node
  linkType: hard

+"tailwind-merge@npm:2.6.0":
+  version: 2.6.0
+  resolution: "tailwind-merge@npm:2.6.0"
+  checksum: 10c0/fc8a5535524de9f4dacf1c16ab298581c7bb757d68a95faaf28942b1c555a619bba9d4c6726fe83986e44973b315410c1a5226e5354c30ba82353bd6d2288fa5
+  languageName: node
+  linkType: hard
+
 "tailwindcss@npm:3.4.17":
  version: 3.4.17
  resolution: "tailwindcss@npm:3.4.17"
@@ -2417,6 +2824,13 @@ __metadata:
  languageName: node
  linkType: hard

+"tslib@npm:^2.4.0":
+  version: 2.8.1
+  resolution: "tslib@npm:2.8.1"
+  checksum: 10c0/9c4759110a19c53f992d9aae23aac5ced636e99887b51b9e61def52611732872ff7668757d4e4c61f19691e36f4da981cd9485e869b4a7408d689f6bf1f14e62
+  languageName: node
+  linkType: hard
+
 "turbo-darwin-64@npm:2.3.3":
  version: 2.3.3
  resolution: "turbo-darwin-64@npm:2.3.3"
@@ -2547,6 +2961,17 @@ __metadata:
  languageName: node
  linkType: hard

+"vite-imagetools@npm:^7.0.1":
+  version: 7.0.5
+  resolution: "vite-imagetools@npm:7.0.5"
+  dependencies:
+    "@rollup/pluginutils": "npm:^5.0.5"
+    imagetools-core: "npm:^7.0.2"
+    sharp: "npm:^0.33.4"
+  checksum: 10c0/223ba4a6a8df344fa12d0a4104fd783d7da21d256e92311bca8488cdd5de2690406bcf63fd7c15bb504ef89149f68306eb0a101888e2ab336d65e58c91b8bb7e
+  languageName: node
+  linkType: hard
+
 "vite@npm:5.4.11":
  version: 5.4.11
  resolution: "vite@npm:5.4.11"
@@ -2606,13 +3031,20 @@ __metadata:
  version: 0.0.0-use.local
  resolution: "web@workspace:apps/web"
  dependencies:
+    "@fontsource/poiret-one": "npm:5.1.1"
+    "@fontsource/zen-kaku-gothic-new": "npm:5.1.1"
+    "@icons-pack/svelte-simple-icons": "npm:4.0.1"
    "@sveltejs/adapter-auto": "npm:3.3.1"
+    "@sveltejs/enhanced-img": "npm:0.4.4"
    "@sveltejs/kit": "npm:2.15.1"
    "@sveltejs/vite-plugin-svelte": "npm:4.0.4"
    "@tailwindcss/typography": "npm:0.5.15"
    autoprefixer: "npm:10.4.20"
+    deepmerge: "npm:4.3.1"
    svelte: "npm:5.16.1"
    svelte-check: "npm:4.1.1"
+    svelte-seo: "npm:1.6.1"
+    tailwind-merge: "npm:2.6.0"
    tailwindcss: "npm:3.4.17"
    typescript: "npm:5.7.2"
    vite: "npm:5.4.11"