feat(ui): 更新页面布局与样式提升用户体验

- 移除无用的空<style>标签
- 安装页面文本提示优化及布局调整
- 首页添加交互式安装按钮并完善页面内容- 全局字体引入并设置默认字体为MiSans- 添加窗口关闭权限以支持功能完整控制
- 头部组件模糊效果样式微调- 视频壁纸组件宽度适配全屏- package-lock.json依赖更新，移除多余peer标记
- 引入sass作为可选样式预处理器支持

src/app.css

@@ -3,3 +3,14 @@
     themes: all;
 }
 
+@font-face {
+    font-family: 'MiSans';
+    src: url('/fonts/MiSans.ttf') format('truetype');
+    font-weight: normal;
+    font-style: normal;
+    font-display: swap;
+}
+
+body {
+    font-family: 'MiSans', sans-serif;
+}

src/lib/components/layout/Header.svelte

@@ -10,7 +10,7 @@
 
 </script>
 
-<header class="h-8 z-50 w-full backdrop-blur absolute top-0 window-controls flex gap-10 px-3 items-center" data-tauri-drag-region>
+<header class="h-8 z-50 w-full backdrop-blur-xs absolute top-0 window-controls flex gap-10 px-3 items-center" data-tauri-drag-region>
 
 	<div class="flex-1" data-tauri-drag-region></div>
 

src/lib/components/layout/VideoWallpaper.svelte

@@ -3,7 +3,7 @@
 </script>
 
 <div class="app-wallpaper absolute top-0 -z-10" >
-	<video class=" h-screen object-cover select-none -z-10 " autoplay muted loop playsinline>
+	<video class=" h-screen w-screen object-cover select-none -z-10 " autoplay muted loop playsinline>
 		<source src="{video}" type="video/mp4">
 	</video>
 </div>

src/routes/+layout.svelte

@@ -23,6 +23,3 @@
 </div>
 
 
-<style>
-
-</style>

src/routes/+page.svelte

@@ -1,12 +1,54 @@
-<div class="relative pt-10 px-4 ">
-	<h1>123</h1>
-	haisdjiasjd
-	as
-	dasdasd
-	as
-	d
-	asd
-	asd
-	as
-	d
+<script lang="ts">
+	import { goto } from '$app/navigation';
+
+	let isHover = false;
+
+	// 提取函数：处理“激活”状态
+	function handleFocus() {
+		isHover = true;
+	}
+
+	// 提取函数：处理“失活”状态
+	function handleBlur() {
+		isHover = false;
+	}
+</script>
+
+
+<!--<div class={'relative pt-10 px-4  h-screen w-screen flex justify-center items-center transition-all ' }}-->
+<!--		 class:backdrop-blur-xs={isHover}-->
+<!--&gt;-->
+<!--	<button class="btn btn-wide" on:mouseenter={()=>{isHover = true}} on:mouseout={()=>{isHover = false}}>安装游戏</button>-->
+<!--</div>-->
+
+
+<div class="hero  min-h-screen transition-all {isHover ? 'bg-neutral-700/30' : ''} "
+		 class:backdrop-blur-xs={isHover}
+
+>
+	<div class="hero-content text-center select-none">
+		<div class="max-w-md" >
+			<h1 class="text-5xl font-bold"
+					on:mouseenter={()=>{isHover = true}}
+					on:mouseout={()=>{isHover = false}}
+					on:blur={handleBlur}
+					on:focus={handleFocus}
+			>逃离鸭科夫</h1>
+			<p class="py-6"
+				 on:mouseenter={()=>{isHover = true}}
+				 on:mouseout={()=>{isHover = false}}
+				 on:blur={handleBlur}
+				 on:focus={handleFocus}
+			>
+				<span class="font-bold">《逃离鸭科夫》</span>是一款鸭子题材PVE俯视角撤离射击游戏。你要在鸭科夫的世界里搜寻物资，建造藏身处，升级装备，从一无所有到做大做强；面对虎视眈眈的敌鸭，想方设法生存下去——或者逃离。
+			</p>
+			<button class="btn btn-primary btn-wide "
+							on:mouseenter={()=>{isHover = true}}
+							on:mouseout={()=>{isHover = false}}
+							on:blur={handleBlur}
+							on:focus={handleFocus}
+							on:click={()=>{goto('/install')}}
+			>安装游戏</button>
+		</div>
+	</div>
 </div>

src/routes/install/+page.svelte

@@ -25,7 +25,7 @@
 			installPath = selected;
 			log('已选择安装目录:'+selected+"，点击开始安装即可开始自动安装");
 		}else if (selected === null) {
-			log("取消选择安装目录");
+			log("未选择安装目录");
 		}else{
 			log("选择安装目录失败");
 		}
@@ -81,16 +81,18 @@
 
 </script>
 
-<main class="h-screen flex flex-col bg-base ">
+<main class="h-screen flex flex-col backdrop-blur bg-neutral-700/30">
 
-	<div class="flex-1 pt-10 px-4 overflow-hidden">
-		<h1 class="textarea-xl">选择安装目录</h1>
-		<pre
-			class="overflow-y-auto h-full whitespace-pre-wrap wrap-break-word text-start"
-			bind:this={logOutputElement}
-		>
+	<div class="flex-1 pt-10 px-5 overflow-hidden relative ">
+		<h1 class="textarea-xl  font-bold absolute">选择目标安装位置</h1>
+		<div class="h-full  pt-10">
+			<pre
+				class=" overflow-y-auto h-full whitespace-pre-wrap wrap-break-word   "
+				bind:this={logOutputElement}
+			>
 {logContent}
 		</pre>
+		</div>
 	</div>
 
 	<div class="h-32 shrink-0 p-4 border-base  ">