style: improve layout with fixed header and footer

- Add flexbox layout to keep footer at bottom of page
- Make header and footer fixed, only content area scrolls
- Add Gemfile for Jekyll dependencies
- Set proper min-height and overflow for scrollable content

Author: loveTsong

Gemfile

@@ -0,0 +1,6 @@
+source "https://rubygems.org"
+
+gem "jekyll", "~> 4.3"
+gem "webrick", "~> 1.8"
+gem "jekyll-relative-links"
+gem "jekyll-toc"

assets/css/style.css

@@ -2,19 +2,28 @@
   box-sizing: border-box;
 }
 
+html, body {
+  height: 100%;
+  margin: 0;
+  padding: 0;
+}
+
 body {
   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
   line-height: 1.6;
   color: #24292e;
-  margin: 0;
-  padding: 0;
   background-color: #f6f8fa;
+  display: flex;
+  flex-direction: column;
 }
 
 .wrapper {
   max-width: 1200px;
   margin: 0 auto;
   padding: 0 16px;
+  flex: 1;
+  display: flex;
+  flex-direction: column;
 }
 
 .site-header {
@@ -49,16 +58,23 @@ body {
 
 .page-content {
   padding: 32px 0;
+  flex: 1;
+  display: flex;
+  flex-direction: column;
 }
 
 .page-content .wrapper {
   display: flex;
   gap: 32px;
+  flex: 1;
+  min-height: 0;
 }
 
 .sidebar {
   width: 260px;
   flex-shrink: 0;
+  overflow-y: auto;
+  max-height: calc(100vh - 200px);
 }
 
 .content {
@@ -68,6 +84,8 @@ body {
   padding: 24px;
   border-radius: 6px;
   box-shadow: 0 1px 3px rgba(0,0,0,0.12);
+  overflow-y: auto;
+  max-height: calc(100vh - 200px);
 }
 
 .content h1 {