commit fe526a5ad738e88b8590177c2b52ef94971c5879
Author: Deiru TwoKey <deiru2k@gmail.com>
Date:   Tue Apr 14 17:02:35 2026 +0300

    Fat ass

diff --git a/.DS_Store b/.DS_Store
new file mode 100644
index 0000000..6565048
Binary files /dev/null and b/.DS_Store differ
diff --git a/favicon.png b/favicon.png
new file mode 100644
index 0000000..f54d014
Binary files /dev/null and b/favicon.png differ
diff --git a/favicon.svg b/favicon.svg
new file mode 100644
index 0000000..8785267
--- /dev/null
+++ b/favicon.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg">
+  <text y="32" font-size="32">🌕</text>
+</svg>
diff --git a/fonts/noto-sans-cjk.otf b/fonts/noto-sans-cjk.otf
new file mode 100644
index 0000000..a48f2b8
Binary files /dev/null and b/fonts/noto-sans-cjk.otf differ
diff --git a/img/.DS_Store b/img/.DS_Store
new file mode 100644
index 0000000..9f4852d
Binary files /dev/null and b/img/.DS_Store differ
diff --git a/img/line.svg b/img/line.svg
new file mode 100644
index 0000000..4c62361
--- /dev/null
+++ b/img/line.svg
@@ -0,0 +1,83 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   version="1.1"
+   id="Capa_1"
+   viewBox="0 0 100% 40"
+   sodipodi:docname="line.svg"
+   inkscape:version="1.4.2 (ebf0e940, 2025-05-08)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:xlink="http://www.w3.org/1999/xlink"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs1">
+    <pattern
+       inkscape:collect="always"
+       xlink:href="#Strips1_1"
+       preserveAspectRatio="xMidYMid"
+       id="pattern2"
+       patternTransform="matrix(35.355339,35.355339,-35.355339,35.355339,0,0)"
+       x="0"
+       y="0" />
+    <pattern
+       inkscape:collect="always"
+       patternUnits="userSpaceOnUse"
+       width="2"
+       height="10"
+       patternTransform="translate(0,0) scale(2,2)"
+       preserveAspectRatio="xMidYMid"
+       id="Strips1_1"
+       style="fill:#000000"
+       inkscape:stockid="Stripes 01 (1:1)"
+       inkscape:isstock="true"
+       inkscape:label="Stripes 01 (1:1)">
+      <rect
+   style="stroke:none"
+   x="0"
+   y="-0.5"
+   width="1"
+   height="11"
+   id="rect134" />
+
+    </pattern>
+  </defs>
+  <sodipodi:namedview
+     id="namedview1"
+     pagecolor="#ffffff"
+     bordercolor="#000000"
+     borderopacity="0.25"
+     inkscape:showpageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#d1d1d1"
+     showgrid="false"
+     inkscape:zoom="2.8966667"
+     inkscape:cx="150"
+     inkscape:cy="75.086306"
+     inkscape:window-width="1352"
+     inkscape:window-height="820"
+     inkscape:window-x="0"
+     inkscape:window-y="30"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="Capa_1" />
+  <pattern
+     id="diagonalHatch"
+     patternUnits="userSpaceOnUse"
+     width="4"
+     height="4"
+     inkscape:label="diagonalHatch">
+    <path
+       d="M-1,1 l2,-2              M0,4 l4,-4              M3,5 l2,-2"
+       style="stroke:black; stroke-width:1"
+       id="path1" />
+  </pattern>
+  <rect
+     x="0"
+     y="0"
+     width="100%"
+     height="100%"
+     fill="url(#diagonalHatch)"
+     id="rect1"
+     style="fill:url(#pattern2);fill-opacity:1" />
+</svg>
diff --git a/img/marisas-peach-no-bubble.png b/img/marisas-peach-no-bubble.png
new file mode 100644
index 0000000..838e991
Binary files /dev/null and b/img/marisas-peach-no-bubble.png differ
diff --git a/img/marisas-peach-no-bubble.webp b/img/marisas-peach-no-bubble.webp
new file mode 100644
index 0000000..60e2b06
Binary files /dev/null and b/img/marisas-peach-no-bubble.webp differ
diff --git a/img/marisas-peach-thumb-round.png b/img/marisas-peach-thumb-round.png
new file mode 100644
index 0000000..864cdb1
Binary files /dev/null and b/img/marisas-peach-thumb-round.png differ
diff --git a/img/marisas-peach-thumb-round.webp b/img/marisas-peach-thumb-round.webp
new file mode 100644
index 0000000..73be4b6
Binary files /dev/null and b/img/marisas-peach-thumb-round.webp differ
diff --git a/img/marisas-peach-thumb.png b/img/marisas-peach-thumb.png
new file mode 100644
index 0000000..b9cb123
Binary files /dev/null and b/img/marisas-peach-thumb.png differ
diff --git a/img/marisas-peach-thumb.webp b/img/marisas-peach-thumb.webp
new file mode 100644
index 0000000..45d9b9d
Binary files /dev/null and b/img/marisas-peach-thumb.webp differ
diff --git a/img/marisas-peach.png b/img/marisas-peach.png
new file mode 100644
index 0000000..1b42f5e
Binary files /dev/null and b/img/marisas-peach.png differ
diff --git a/img/marisas-peach.webp b/img/marisas-peach.webp
new file mode 100644
index 0000000..c2ee8f8
Binary files /dev/null and b/img/marisas-peach.webp differ
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..e6b8d5a
--- /dev/null
+++ b/index.html
@@ -0,0 +1,46 @@
+<!DOCTYPE html>
+<html lang="en-US">
+  <head>
+    <title>COOL ZONE</title>
+    <link rel="canonical" href="https://deiru.online" />
+    <link rel="stylesheet" href="/styles/font.css" />
+    <link rel="preload" href="/img/marisas-peach.webp" as="image" type="image/avif" />
+    <meta name="robots" content="noindex" />
+    <link rel="stylesheet" href="/styles/style.css">
+    <link rel="icon" href="/favicon.svg" />
+    <link rel="icon" href="/favicon.png" />
+    <link rel="apple-touch-icon" sizes="60x60" href="/favicon.png" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta name="description" content="You have reached the cool zone" />
+    <meta name="author" content="&#x30C7;&#x30A4;&#x30EB;&#x30FB;&#x1F315;&#x30FB;&#x30C4;&#x30AD;" />
+    <meta charset="UTF-8" />
+    <meta property="og:title" content="&#x30C7;&#x30A4;&#x30EB;&#x30FB;&#x1F315;&#x30FB;&#x30C4;&#x30AD;" />
+    <meta property="og:description" content="You have reached the cool zone" />
+    <meta property="og:image" content="https://deiru.online/img/marisas-peach-thumb-round.webp" />
+    <meta property="og:author" content="&#x30C7;&#x30A4;&#x30EB;&#x30FB;&#x1F315;&#x30FB;&#x30C4;&#x30AD;" />
+    <meta name="twitter:card" content="summary_large_image" />
+    <meta name="twitter:site" content="https://deiru.online" />
+    <meta name="twitter:title" content="&#x30C7;&#x30A4;&#x30EB;&#x30FB;&#x1F315;&#x30FB;&#x30C4;&#x30AD;" />
+    <meta name="twitter:description" content="You have reached the cool zone" />
+    <meta name="twitter:image" content="https://deiru.online/img/marisas-peach-thumb-round.webp" />
+  </head>
+  <!--
+      You have discovered THE COOL ZONE. You were not supposed to.
+      For your efforts, you get jack shit and this lovely ass.
+    -->
+  <body>
+    <div class="page-container">
+      <div class="container">
+        <h1>&#x30C7;&#x30A4;&#x30EB; &#x1F315; &#x30C4;&#x30AD;</h1>
+        <label class="img-container" for="marisa">
+          <input type="checkbox" name="marisa" id="marisa">
+          <div class="img"></div>
+        </label>
+      </div>
+    </div>
+    <footer>
+      <div class="credits left">Image by <a href="https://x.com/notnoe_/status/1660885922064502784">@notnoe</a></div>
+      <div class="credits right">Website by <a href="https://gensokyo.social/@Deiru">@Deiru</a></div>
+    </footer>
+  </body>
+</html>
diff --git a/styles/font.css b/styles/font.css
new file mode 100644
index 0000000..0df7709
--- /dev/null
+++ b/styles/font.css
@@ -0,0 +1,4 @@
+@font-face {
+  font-family: "Noto Sans CJK";
+  src: url("/fonts/noto-sans-cjk.otf") format("opentype");
+}
diff --git a/styles/style.css b/styles/style.css
new file mode 100644
index 0000000..4518360
--- /dev/null
+++ b/styles/style.css
@@ -0,0 +1,142 @@
+html, body {
+    height: 100%;    
+    width: 100%;
+    margin: 0;
+}
+
+body {
+    overflow: clip;
+}
+
+body:after {
+    position: absolute;
+    z-index: -1;
+    left: 0;
+    top: 0;
+    display: block;
+    content: '';
+    height: 100%;
+    width: 100%;
+    background-image: url('/img/line.svg');
+    background-repeat: repeat;
+    background-size: 100%;
+}
+
+.page-container {
+    display: flex; 
+    width: 100%;
+    height: 100%;
+    align-items: center;
+    justify-content: center;
+}
+
+.container {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 15px;
+}
+
+.container h1 {
+    font-family: "Noto Sans CJK";
+    text-align: center;
+    padding: 5px;
+    flex-grow: 0;
+    width: fit-content;
+    background-color: white;
+    border: 4px dashed #ffea8d;
+    box-sizing: border-box;
+    border-radius: 8px;
+}
+
+.container .credits a {
+    text-decoration: none;
+}
+
+.container .img-container {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    height: calc(50vh + 16px);
+    width: calc(50vh + 16px);
+    background: white;
+    z-index: 1;
+    border-radius: 8px;
+    box-sizing: border-box;
+}
+
+.container .img-container input {
+    height: 0px;
+    margin: 0px;
+}
+
+.container .img-container .img {
+    height: 100%;
+    width: 100%;
+    position: relative;
+    content: '';
+    z-index: 2;
+    border: 8px dashed #ffea8d;
+    border-radius: 8px;
+    box-sizing: border-box;
+    background-image: url(/img/marisas-peach-no-bubble.webp);
+    background-size: cover;
+    background-repeat: no-repeat;
+    background-position: center;
+    cursor: pointer;
+}
+
+.container .img-container input:checked+.img {
+    background-image: url(/img/marisas-peach.webp);
+}
+
+footer {
+    position: fixed;
+    width: 100%;
+    display: flex;
+    justify-content: space-between;
+    box-sizing: border-box;
+    bottom: 0;
+    left: 0;
+}
+
+footer .credits {
+    padding: 4px;
+    width: fit-content;
+    background: white;
+    flex-grow: 0;
+    text-align: center;
+    box-sizing: border-box;
+}
+
+footer .credits.left {
+    border-top: 2px dashed #ffea8d;
+    border-right: 2px dashed #ffea8d;
+    border-top-right-radius: 8px;
+}
+
+footer .credits.right {
+    border-top: 2px dashed #ffea8d;
+    border-left: 2px dashed #ffea8d;
+    border-top-left-radius: 8px;
+}
+
+footer .credits a {
+    text-decoration: none;
+    
+}
+
+
+
+@media (max-width: 480px) {
+    .container h1 {
+        font-size: 24px;
+    }
+    .container .img-container {
+        width: calc(85vw + 16px);
+        height: calc(85vw + 16px);
+    }
+    footer .credits {
+        font-size: 10px;
+    }
+}