diff --git a/hugo.toml b/hugo.toml
index 4574fd6..20da55f 100644
--- a/hugo.toml
+++ b/hugo.toml
@@ -1,4 +1,4 @@
-baseURL = 'https://val-dreamscape.github.io'
+baseURL = 'https://gch3n.online/val-blog/'
 languageCode = 'zh-CN'
 title = "Val's Dreamscape Journal"
 theme = "dreamscape"
diff --git a/themes/dreamscape/assets/css/dreamscape.css b/themes/dreamscape/assets/css/dreamscape.css
new file mode 100644
index 0000000..7ef455f
--- /dev/null
+++ b/themes/dreamscape/assets/css/dreamscape.css
@@ -0,0 +1,499 @@
+/* ═══════════════════════════════════════════════════════════════
+   VAL'S DREAMSCAPE — 沉浸式梦境主题
+   ═══════════════════════════════════════════════════════════════ */
+
+@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@400;600&display=swap');
+
+:root {
+    --void: #030308;
+    --deep: #0a0a1a;
+    --night: #12122a;
+    --mist: #1a1a3e;
+    --crystal: #2a2a5e;
+    --glow-purple: #7b68ee;
+    --glow-blue: #4a90d9;
+    --glow-cyan: #22d3ee;
+    --text-light: #e8e8f8;
+    --text-dim: #8888aa;
+    --font-serif: 'Noto Serif SC', 'Songti SC', serif;
+    --font-sans: -apple-system, BlinkMacSystemFont, sans-serif;
+}
+
+* { margin: 0; padding: 0; box-sizing: border-box; }
+html { scroll-behavior: smooth; }
+
+body {
+    font-family: var(--font-serif);
+    background: var(--void);
+    color: var(--text-light);
+    line-height: 1.9;
+    overflow-x: hidden;
+}
+
+/* ═══ 星空画布 ═══ */
+#starfield {
+    position: fixed;
+    top: 0; left: 0;
+    width: 100%; height: 100%;
+    z-index: 0;
+    pointer-events: none;
+}
+
+#app {
+    position: relative;
+    z-index: 1;
+    min-height: 100vh;
+    display: flex;
+    flex-direction: column;
+}
+
+/* ═══ 导航 ═══ */
+.nav {
+    position: fixed;
+    top: 0; left: 0; right: 0;
+    z-index: 100;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    gap: 2rem;
+    padding: 1.2rem;
+    background: linear-gradient(180deg, rgba(3,3,8,0.95) 0%, transparent 100%);
+    backdrop-filter: blur(8px);
+}
+
+.nav-logo {
+    font-size: 1.5rem;
+    color: var(--glow-purple);
+    text-decoration: none;
+    animation: pulse 3s ease-in-out infinite;
+}
+
+.nav-link {
+    font-family: var(--font-sans);
+    font-size: 0.85rem;
+    color: var(--text-dim);
+    text-decoration: none;
+    letter-spacing: 0.5px;
+    transition: color 0.3s, text-shadow 0.3s;
+}
+
+.nav-link:hover {
+    color: var(--glow-cyan);
+    text-shadow: 0 0 20px var(--glow-cyan);
+}
+
+/* ═══ 主内容 ═══ */
+main {
+    flex: 1;
+    padding: 6rem 1.5rem 4rem;
+    max-width: 900px;
+    margin: 0 auto;
+    width: 100%;
+}
+
+/* ═══ 首页英雄区 ═══ */
+.dream-home { padding-top: 8vh; }
+
+.hero {
+    min-height: 85vh;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    text-align: center;
+    position: relative;
+}
+
+.hero-title {
+    font-size: clamp(2.5rem, 8vw, 4.5rem);
+    font-weight: 600;
+    letter-spacing: 0.1em;
+    margin-bottom: 1rem;
+    background: linear-gradient(135deg, var(--glow-purple), var(--glow-cyan), var(--glow-blue));
+    -webkit-background-clip: text;
+    -webkit-text-fill-color: transparent;
+    background-clip: text;
+    animation: shimmer 8s ease-in-out infinite;
+}
+
+.hero-glyph {
+    display: block;
+    font-size: 0.4em;
+    margin-bottom: 0.5rem;
+    opacity: 0.6;
+    animation: rotate 20s linear infinite;
+}
+
+.hero-subtitle {
+    font-size: clamp(0.95rem, 2.5vw, 1.2rem);
+    color: var(--text-dim);
+    max-width: 600px;
+    line-height: 1.8;
+}
+
+.hero-scroll {
+    position: absolute;
+    bottom: 3rem;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 0.5rem;
+    font-size: 0.75rem;
+    color: var(--text-dim);
+    opacity: 0.6;
+}
+
+.scroll-arrow {
+    width: 1px;
+    height: 40px;
+    background: linear-gradient(180deg, var(--glow-purple), transparent);
+    animation: scrollPulse 2s ease-in-out infinite;
+}
+
+/* ═══ 内容区块 ═══ */
+.dream-section {
+    padding: 5rem 0;
+    border-top: 1px solid rgba(123,104,238,0.1);
+}
+
+.section-heading {
+    font-size: 1.3rem;
+    font-weight: 600;
+    margin-bottom: 2.5rem;
+    display: flex;
+    align-items: center;
+    gap: 0.8rem;
+    color: var(--glow-cyan);
+}
+
+.section-glyph {
+    font-size: 1.5rem;
+    opacity: 0.7;
+    animation: pulse 3s ease-in-out infinite;
+}
+
+/* ═══ 卡片星座 ═══ */
+.card-constellation {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
+    gap: 1.5rem;
+}
+
+.dream-card {
+    position: relative;
+    display: block;
+    padding: 1.8rem;
+    border-radius: 12px;
+    background: linear-gradient(135deg, rgba(26,26,62,0.6), rgba(10,10,26,0.8));
+    border: 1px solid rgba(123,104,238,0.15);
+    text-decoration: none;
+    overflow: hidden;
+    transition: transform 0.4s cubic-bezier(0.2, 0, 0.2, 1), border-color 0.3s;
+}
+
+.dream-card::before {
+    content: '';
+    position: absolute;
+    top: -50%; left: -50%;
+    width: 200%; height: 200%;
+    background: radial-gradient(circle at 30% 30%, rgba(123,104,238,0.08), transparent 50%);
+    opacity: 0;
+    transition: opacity 0.4s;
+}
+
+.dream-card:hover {
+    transform: translateY(-8px) scale(1.02);
+    border-color: rgba(123,104,238,0.4);
+}
+
+.dream-card:hover::before { opacity: 1; }
+
+.card-glow {
+    position: absolute;
+    top: 0; left: 0; right: 0;
+    height: 2px;
+    background: linear-gradient(90deg, transparent, var(--glow-purple), transparent);
+    opacity: 0;
+    transition: opacity 0.3s;
+}
+
+.dream-card:hover .card-glow { opacity: 1; }
+
+.card-time {
+    font-size: 0.75rem;
+    color: var(--text-dim);
+    font-family: var(--font-sans);
+}
+
+.card-title {
+    font-size: 1.15rem;
+    margin: 0.5rem 0;
+    color: var(--text-light);
+}
+
+.card-excerpt {
+    font-size: 0.9rem;
+    color: var(--text-dim);
+    line-height: 1.7;
+}
+
+.card-tags {
+    margin-top: 1rem;
+    display: flex;
+    gap: 0.5rem;
+    flex-wrap: wrap;
+}
+
+.tag {
+    font-size: 0.7rem;
+    padding: 3px 10px;
+    border-radius: 20px;
+    background: rgba(123,104,238,0.15);
+    color: var(--glow-purple);
+    font-family: var(--font-sans);
+}
+
+/* ═══ 文章页 ═══ */
+.dream-article {
+    padding-top: 2rem;
+}
+
+.article-hero {
+    text-align: center;
+    padding: 4rem 0 3rem;
+    border-bottom: 1px solid rgba(123,104,238,0.1);
+    margin-bottom: 3rem;
+}
+
+.article-glyph {
+    font-size: 2rem;
+    color: var(--glow-purple);
+    opacity: 0.5;
+    margin-bottom: 1rem;
+    animation: pulse 4s ease-in-out infinite;
+}
+
+.article-title {
+    font-size: clamp(1.8rem, 5vw, 2.8rem);
+    font-weight: 600;
+    line-height: 1.4;
+    margin-bottom: 1rem;
+}
+
+.article-meta {
+    font-size: 0.9rem;
+    color: var(--text-dim);
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    gap: 1.5rem;
+    flex-wrap: wrap;
+}
+
+.article-tags { display: flex; gap: 0.5rem; }
+
+/* ═══ 文章正文 — 沉浸式排版 ═══ */
+.article-body {
+    font-size: 1.1rem;
+    line-height: 2;
+    max-width: 680px;
+    margin: 0 auto;
+}
+
+.article-body p {
+    margin-bottom: 1.8rem;
+    text-align: justify;
+    opacity: 0;
+    animation: fadeInUp 0.8s ease forwards;
+}
+
+.article-body p:nth-child(1) { animation-delay: 0.1s; }
+.article-body p:nth-child(2) { animation-delay: 0.2s; }
+.article-body p:nth-child(3) { animation-delay: 0.3s; }
+.article-body p:nth-child(4) { animation-delay: 0.4s; }
+.article-body p:nth-child(5) { animation-delay: 0.5s; }
+.article-body p:nth-child(n+6) { animation-delay: 0.6s; }
+
+.article-body h2 {
+    font-size: 1.5rem;
+    margin: 3rem 0 1.5rem;
+    color: var(--glow-cyan);
+    text-align: center;
+}
+
+.article-body h3 {
+    font-size: 1.2rem;
+    margin: 2rem 0 1rem;
+    color: var(--glow-purple);
+}
+
+.article-body a {
+    color: var(--glow-cyan);
+    text-decoration: none;
+    border-bottom: 1px solid rgba(34,211,238,0.3);
+    transition: border-color 0.3s;
+}
+
+.article-body a:hover { border-color: var(--glow-cyan); }
+
+.article-body blockquote {
+    margin: 2.5rem 0;
+    padding: 1.5rem 2rem;
+    border-left: 3px solid var(--glow-purple);
+    background: linear-gradient(135deg, rgba(123,104,238,0.08), transparent);
+    font-style: italic;
+    color: var(--text-light);
+    position: relative;
+}
+
+.article-body blockquote::before {
+    content: '"';
+    position: absolute;
+    top: -0.5rem;
+    left: 1rem;
+    font-size: 4rem;
+    color: var(--glow-purple);
+    opacity: 0.2;
+    font-family: Georgia, serif;
+}
+
+.article-body strong {
+    color: var(--glow-cyan);
+    font-weight: 600;
+}
+
+.article-body img {
+    max-width: 100%;
+    border-radius: 8px;
+    margin: 2rem 0;
+    box-shadow: 0 0 40px rgba(123,104,238,0.2);
+}
+
+.article-body pre {
+    background: var(--night);
+    border: 1px solid rgba(123,104,238,0.2);
+    border-radius: 8px;
+    padding: 1.2rem;
+    overflow-x: auto;
+    margin: 1.5rem 0;
+    font-size: 0.9rem;
+}
+
+.article-body code {
+    background: var(--night);
+    padding: 2px 8px;
+    border-radius: 4px;
+    font-size: 0.9em;
+}
+
+/* ═══ 文章导航 ═══ */
+.article-nav {
+    display: flex;
+    justify-content: space-between;
+    margin-top: 4rem;
+    padding-top: 2rem;
+    border-top: 1px solid rgba(123,104,238,0.1);
+    font-size: 0.9rem;
+}
+
+.article-nav a {
+    color: var(--text-dim);
+    text-decoration: none;
+    transition: color 0.3s;
+}
+
+.article-nav a:hover { color: var(--glow-cyan); }
+
+/* ═══ 列表页 ═══ */
+.dream-list { padding-top: 2rem; }
+
+.list-heading {
+    font-size: 1.8rem;
+    margin-bottom: 3rem;
+    display: flex;
+    align-items: center;
+    gap: 1rem;
+    color: var(--glow-cyan);
+}
+
+.list-entry {
+    display: block;
+    padding: 1.5rem 0;
+    border-bottom: 1px solid rgba(123,104,238,0.1);
+    text-decoration: none;
+    transition: padding-left 0.3s;
+}
+
+.list-entry:hover { padding-left: 1rem; }
+
+.list-entry time {
+    font-size: 0.8rem;
+    color: var(--text-dim);
+}
+
+.list-entry h3 {
+    font-size: 1.2rem;
+    margin: 0.3rem 0;
+    color: var(--text-light);
+}
+
+.list-entry p {
+    font-size: 0.9rem;
+    color: var(--text-dim);
+}
+
+/* ═══ 页脚 ═══ */
+.footer {
+    text-align: center;
+    padding: 2rem;
+    font-size: 0.8rem;
+    color: var(--text-dim);
+    border-top: 1px solid rgba(123,104,238,0.1);
+}
+
+/* ═══ 动画 ═══ */
+@keyframes pulse {
+    0%, 100% { opacity: 0.6; }
+    50% { opacity: 1; }
+}
+
+@keyframes shimmer {
+    0%, 100% { filter: brightness(1); }
+    50% { filter: brightness(1.2); }
+}
+
+@keyframes rotate {
+    from { transform: rotate(0deg); }
+    to { transform: rotate(360deg); }
+}
+
+@keyframes scrollPulse {
+    0%, 100% { opacity: 0.3; height: 40px; }
+    50% { opacity: 1; height: 50px; }
+}
+
+@keyframes fadeInUp {
+    from { opacity: 0; transform: translateY(20px); }
+    to { opacity: 1; transform: translateY(0); }
+}
+
+.reveal {
+    opacity: 0;
+    transform: translateY(30px);
+    transition: opacity 0.8s ease, transform 0.8s ease;
+}
+
+.reveal.visible {
+    opacity: 1;
+    transform: translateY(0);
+}
+
+/* ═══ 响应式 ═══ */
+@media (max-width: 640px) {
+    .nav { gap: 1rem; padding: 1rem; }
+    .nav-link { font-size: 0.75rem; }
+    main { padding: 5rem 1rem 3rem; }
+    .hero-title { font-size: 2rem; }
+    .article-body { font-size: 1rem; }
+    .card-constellation { grid-template-columns: 1fr; }
+}
diff --git a/themes/dreamscape/assets/js/dreamscape.js b/themes/dreamscape/assets/js/dreamscape.js
new file mode 100644
index 0000000..f5bcf3b
--- /dev/null
+++ b/themes/dreamscape/assets/js/dreamscape.js
@@ -0,0 +1,150 @@
+/* ═══════════════════════════════════════════════════════════════
+   VAL'S DREAMSCAPE — 星空粒子 + 滚动动画
+   ═══════════════════════════════════════════════════════════════ */
+
+(function() {
+    'use strict';
+
+    // ═══ 星空粒子系统 ═══
+    const canvas = document.getElementById('starfield');
+    const ctx = canvas.getContext('2d');
+    let width, height, stars, nebulas;
+    let animationId;
+
+    function init() {
+        resize();
+        createStars();
+        createNebulas();
+        animate();
+    }
+
+    function resize() {
+        width = canvas.width = window.innerWidth;
+        height = canvas.height = window.innerHeight;
+    }
+
+    function createStars() {
+        const count = Math.floor((width * height) / 8000);
+        stars = [];
+        for (let i = 0; i < count; i++) {
+            stars.push({
+                x: Math.random() * width,
+                y: Math.random() * height,
+                size: Math.random() * 1.5 + 0.5,
+                speed: Math.random() * 0.3 + 0.1,
+                opacity: Math.random() * 0.8 + 0.2,
+                twinkle: Math.random() * Math.PI * 2,
+                color: Math.random() > 0.7 ? 
+                    `hsl(${220 + Math.random() * 60}, 70%, 80%)` : 
+                    '#ffffff'
+            });
+        }
+    }
+
+    function createNebulas() {
+        nebulas = [
+            { x: width * 0.2, y: height * 0.3, r: 200, color: 'rgba(123,104,238,0.03)' },
+            { x: width * 0.8, y: height * 0.7, r: 250, color: 'rgba(34,211,238,0.02)' },
+            { x: width * 0.5, y: height * 0.5, r: 300, color: 'rgba(74,144,217,0.02)' }
+        ];
+    }
+
+    function animate() {
+        ctx.fillStyle = 'rgba(3,3,8,0.1)';
+        ctx.fillRect(0, 0, width, height);
+
+        // 绘制星云
+        nebulas.forEach(n => {
+            const gradient = ctx.createRadialGradient(n.x, n.y, 0, n.x, n.y, n.r);
+            gradient.addColorStop(0, n.color);
+            gradient.addColorStop(1, 'transparent');
+            ctx.fillStyle = gradient;
+            ctx.beginPath();
+            ctx.arc(n.x, n.y, n.r, 0, Math.PI * 2);
+            ctx.fill();
+        });
+
+        // 绘制星星
+        stars.forEach(star => {
+            star.twinkle += 0.02;
+            const twinkleFactor = 0.5 + Math.sin(star.twinkle) * 0.5;
+            const currentOpacity = star.opacity * twinkleFactor;
+
+            ctx.beginPath();
+            ctx.arc(star.x, star.y, star.size, 0, Math.PI * 2);
+            ctx.fillStyle = star.color;
+            ctx.globalAlpha = currentOpacity;
+            ctx.fill();
+            ctx.globalAlpha = 1;
+
+            // 缓慢漂移
+            star.y += star.speed;
+            if (star.y > height + 10) {
+                star.y = -10;
+                star.x = Math.random() * width;
+            }
+        });
+
+        animationId = requestAnimationFrame(animate);
+    }
+
+    // ═══ 滚动显示动画 ═══
+    function setupReveal() {
+        const reveals = document.querySelectorAll('.reveal');
+        
+        const observer = new IntersectionObserver((entries) => {
+            entries.forEach(entry => {
+                if (entry.isIntersecting) {
+                    entry.target.classList.add('visible');
+                }
+            });
+        }, {
+            threshold: 0.1,
+            rootMargin: '0px 0px -50px 0px'
+        });
+
+        reveals.forEach(el => observer.observe(el));
+    }
+
+    // ═══ 视差效果 ═══
+    function setupParallax() {
+        const hero = document.querySelector('.hero');
+        if (!hero) return;
+
+        window.addEventListener('scroll', () => {
+            const scrollY = window.scrollY;
+            const opacity = Math.max(0, 1 - scrollY / 600);
+            hero.style.opacity = opacity;
+            hero.style.transform = `translateY(${scrollY * 0.3}px)`;
+        }, { passive: true });
+    }
+
+    // ═══ 鼠标光效 ═══
+    function setupGlow() {
+        const cards = document.querySelectorAll('.dream-card');
+        cards.forEach(card => {
+            card.addEventListener('mousemove', (e) => {
+                const rect = card.getBoundingClientRect();
+                const x = e.clientX - rect.left;
+                const y = e.clientY - rect.top;
+                card.style.setProperty('--mouse-x', `${x}px`);
+                card.style.setProperty('--mouse-y', `${y}px`);
+            });
+        });
+    }
+
+    // ═══ 初始化 ═══
+    window.addEventListener('resize', () => {
+        resize();
+        createStars();
+        createNebulas();
+    });
+
+    document.addEventListener('DOMContentLoaded', () => {
+        init();
+        setupReveal();
+        setupParallax();
+        setupGlow();
+    });
+
+})();
diff --git a/themes/dreamscape/layouts/_default/baseof.html b/themes/dreamscape/layouts/_default/baseof.html
index 0964ee9..ec45d7f 100644
--- a/themes/dreamscape/layouts/_default/baseof.html
+++ b/themes/dreamscape/layouts/_default/baseof.html
@@ -5,13 +5,27 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>{{ if .Title }}{{ .Title }} | {{ end }}{{ .Site.Title }}</title>
     <meta name="description" content="{{ with .Description }}{{ . }}{{ else }}{{ .Site.Params.description }}{{ end }}">
-    {{- partial "head.html" . -}}
+    <link rel="canonical" href="{{ .Permalink }}">
+    {{ $style := resources.Get "css/dreamscape.css" | minify }}
+    <link rel="stylesheet" href="{{ $style.RelPermalink }}">
+    <link rel="alternate" type="application/rss+xml" href='{{ "feed.xml" | relURL }}'>
 </head>
-<body class="{{ if .IsHome }}home{{ else }}page{{ end }}">
-    {{- partial "header.html" . -}}
-    <main>
-        {{- block "main" . }}{{- end }}
-    </main>
-    {{- partial "footer.html" . -}}
+<body>
+    <canvas id="starfield"></canvas>
+    <div id="app">
+        <nav class="nav">
+            <a href="/" class="nav-logo">✦</a>
+            {{ range .Site.Menus.main }}
+            <a href="{{ .URL | relURL }}" class="nav-link">{{ .Name }}</a>
+            {{ end }}
+        </nav>
+        <main>
+            {{- block "main" . }}{{- end }}
+        </main>
+        <footer class="footer">
+            <span>✦ Val's Dreamscape Journal ✦</span>
+        </footer>
+    </div>
+    <script src='{{ "js/dreamscape.js" | relURL }}'></script>
 </body>
 </html>
diff --git a/themes/dreamscape/layouts/_default/list.html b/themes/dreamscape/layouts/_default/list.html
index 137e87a..6581cb8 100644
--- a/themes/dreamscape/layouts/_default/list.html
+++ b/themes/dreamscape/layouts/_default/list.html
@@ -1,16 +1,15 @@
 {{ define "main" }}
-<div class="page-header">
-    <h1>{{ .Title | default .Section | title }}</h1>
-    {{ if .Content }}<div class="section-desc">{{ .Content }}</div>{{ end }}
-</div>
-
-<div class="list">
+<div class="dream-list reveal">
+    <h1 class="list-heading">
+        <span class="section-glyph">◈</span>
+        {{ .Title | default .Section | title }}
+    </h1>
     {{ range .Paginator.Pages }}
-    <article class="list-item">
-        <time>{{ .Date.Format "2006-01-02" }}</time>
-        <h3><a href="{{ .RelPermalink }}">{{ .Title }}</a></h3>
+    <a href="{{ .RelPermalink }}" class="list-entry reveal">
+        <time>{{ .Date.Format "2006.01.02" }}</time>
+        <h3>{{ .Title }}</h3>
         <p>{{ .Summary | truncate 100 }}</p>
-    </article>
+    </a>
     {{ end }}
 </div>
 {{ end }}
diff --git a/themes/dreamscape/layouts/_default/single.html b/themes/dreamscape/layouts/_default/single.html
index ac4beb6..405af13 100644
--- a/themes/dreamscape/layouts/_default/single.html
+++ b/themes/dreamscape/layouts/_default/single.html
@@ -1,19 +1,23 @@
 {{ define "main" }}
-<div class="page-header">
-    <h1>{{ .Title }}</h1>
-    {{ if .Params.subtitle }}<p class="subtitle">{{ .Params.subtitle }}</p>{{ end }}
-    <div class="meta">
-        <time datetime="{{ .Date.Format "2006-01-02" }}">{{ .Date.Format "2006年01月02日" }}</time>
-        {{ with .Params.tags }}<span class="tags">{{ range . }}<span class="tag">{{ . }}</span>{{ end }}</span>{{ end }}
+<article class="dream-article">
+    <div class="article-hero reveal">
+        <div class="article-glyph">◇</div>
+        <h1 class="article-title">{{ .Title }}</h1>
+        <div class="article-meta">
+            <time>{{ .Date.Format "2006年01月02日" }}</time>
+            <div class="article-tags">
+                {{ range .Params.tags }}<span class="tag">{{ . }}</span>{{ end }}
+            </div>
+        </div>
     </div>
-</div>
 
-<article class="article">
-    {{ .Content }}
+    <div class="article-body">
+        {{ .Content }}
+    </div>
+
+    <nav class="article-nav">
+        {{ with .PrevInSection }}<a href="{{ .RelPermalink }}" class="nav-prev">← {{ .Title }}</a>{{ end }}
+        {{ with .NextInSection }}<a href="{{ .RelPermalink }}" class="nav-next">{{ .Title }} →</a>{{ end }}
+    </nav>
 </article>
-
-<nav class="post-nav">
-    {{ with .PrevInSection }}<a href="{{ .RelPermalink }}" class="prev">← {{ .Title }}</a>{{ end }}
-    {{ with .NextInSection }}<a href="{{ .RelPermalink }}" class="next">{{ .Title }} →</a>{{ end }}
-</nav>
 {{ end }}
diff --git a/themes/dreamscape/layouts/index.html b/themes/dreamscape/layouts/index.html
index 21cac1b..a62de62 100644
--- a/themes/dreamscape/layouts/index.html
+++ b/themes/dreamscape/layouts/index.html
@@ -1,28 +1,48 @@
 {{ define "main" }}
-<div class="home">
+<div class="dream-home">
     <section class="hero">
-        <h1 class="hero-title">{{ .Site.Title }}</h1>
-        <p class="hero-subtitle">{{ .Site.Params.description }}</p>
+        <div class="hero-constellation"></div>
+        <h1 class="hero-title reveal">
+            <span class="hero-glyph">◇</span>
+            Val's Dreamscape
+        </h1>
+        <p class="hero-subtitle reveal">{{ .Site.Params.description }}</p>
+        <div class="hero-scroll reveal">
+            <span>向下探索</span>
+            <div class="scroll-arrow"></div>
+        </div>
     </section>
 
     {{ $sections := slice "journey" "sketch" "gallery" "essay" }}
     {{ range $sections }}
     {{ $pages := where $.Site.RegularPages "Section" . }}
     {{ if $pages }}
-    <section class="section">
-        <h2 class="section-title">
-            <a href="/{{ . }}/">{{ . | title }} · {{ len $pages }}</a>
+    <section class="dream-section reveal">
+        <h2 class="section-heading">
+            <span class="section-glyph">
+                {{ if eq . "journey" }}◈{{ end }}
+                {{ if eq . "sketch" }}✎{{ end }}
+                {{ if eq . "gallery" }}❖{{ end }}
+                {{ if eq . "essay" }}✦{{ end }}
+            </span>
+            {{ if eq . "journey" }}旅程{{ end }}
+            {{ if eq . "sketch" }}速记{{ end }}
+            {{ if eq . "gallery" }}图志{{ end }}
+            {{ if eq . "essay" }}随笔{{ end }}
         </h2>
-        <div class="card-grid">
-            {{ range first 3 $pages }}
-            <article class="card">
-                <div class="card-meta">
-                    <time>{{ .Date.Format "2006-01-02" }}</time>
-                    {{ with .Params.tags }}<span class="tags">{{ range . }}<span class="tag">{{ . }}</span>{{ end }}</span>{{ end }}
+        <div class="card-constellation">
+            {{ range $pages }}
+            <a href="{{ .RelPermalink }}" class="dream-card reveal">
+                <div class="card-glow"></div>
+                <div class="card-content">
+                    <time class="card-time">{{ .Date.Format "2006.01.02" }}</time>
+                    <h3 class="card-title">{{ .Title }}</h3>
+                    <p class="card-excerpt">{{ .Summary | truncate 80 }}</p>
+                    <div class="card-tags">
+                        {{ range .Params.tags }}<span class="tag">{{ . }}</span>{{ end }}
+                    </div>
                 </div>
-                <h3 class="card-title"><a href="{{ .RelPermalink }}">{{ .Title }}</a></h3>
-                <p class="card-summary">{{ .Summary | truncate 120 }}</p>
-            </article>
+            </a>
             {{ end }}
         </div>
     </section>