feat: add global CSS for consistent styling and scrollbar customization

- Introduced a new global CSS file to define color variables for consistent theming across the application.
- Customized scrollbar styles to enhance user experience and visual appeal.

Author: hrdtbs

app/page.global.css

@@ -0,0 +1,18 @@
+:root {
+    --color-paper: #f7f5e8;
+	--color-pink: #f9d4e1;
+	--color-teal: #63bac7;
+}
+
+::-webkit-scrollbar {
+    width: 4px;
+}
+::-webkit-scrollbar-track {
+    background: var(--color-paper);
+}
+::-webkit-scrollbar-thumb {
+    background: var(--color-pink);
+    border-radius: 10px;
+    border: 3px solid var(--color-paper);
+}
+  

app/page.module.css

@@ -1,11 +1,3 @@
-.Root {
-	--color-paper: #f7f5e8;
-	--color-pink: #f9d4e1;
-	--color-teal: #63bac7;
-}
-
-/* ===== Fixed Background ===== */
-
 .fixedBackground {
 	position: fixed;
 	background-color: var(--color-pink);

app/page.tsx

@@ -6,6 +6,7 @@ import portraitImg from "./_assets/images/momomochi-portrait.jpg";
 import peachIconSvg from "./_assets/images/peach-icon.svg";
 import topImg from "./_assets/images/トップ画像.png";
 import { siteConfig } from "./_site.config";
+import "./page.global.css"
 import styles from "./page.module.css";
 
 const WAVE_W = 1000;
@@ -45,7 +46,7 @@ function buildScallopedArcPath() {
 	}
 
 	d += " Z";
-	return { d, height: Math.ceil(maxY) };
+	return { d, height: Math.ceil(maxY) - 2 };
 }
 
 const wavePath = buildScallopedArcPath();