diff --git a/src/routes/admin/settings/+page.svelte b/src/routes/admin/settings/+page.svelte
index d2c6295..94ecfc0 100644
--- a/src/routes/admin/settings/+page.svelte
+++ b/src/routes/admin/settings/+page.svelte
@@ -63,8 +63,8 @@
 
 <div class="settings-container">
 	{#if activeTab === 'basic'}
-		<div class="basic-top-row">
-			<div class="settings-card">
+		<div class="settings-card full-width">
+			<div class="settings-section">
 				<h3>站点基础信息</h3>
 
 				<form
@@ -122,39 +122,43 @@
 						</div>
 					</div>
 
-					<div class="form-actions">
+					<div class="form-actions" style="justify-content: flex-start;">
 						<Button type="submit" variant="primary">保存</Button>
 					</div>
 				</form>
 			</div>
 
-			<div class="settings-card">
+			<hr class="section-divider" />
+
+			<div class="settings-section">
 				<h3>系统与安全环境</h3>
-				<div class="info-row">
-					<span class="label">驱动框架</span>
-					<span class="value">SvelteKit 5 + Cloudflare</span>
-				</div>
-				<div class="info-row">
-					<span class="label">当前管理员</span>
-					<span class="value">{data.user?.email || '未知用户'}</span>
-				</div>
-				<div class="info-row">
-					<span class="label">数据库绑定</span>
-					<span class="value"><span class="badge">{data.platformEnv}</span></span>
-				</div>
-				<div class="info-row">
-					<span class="label">R2存储绑定</span>
-					<span class="value"><span class="badge">{data.r2Env}</span></span>
-				</div>
-				<div class="info-row">
-					<span class="label">鉴权模式</span>
-					<span class="value">Cloudflare Access (Zero Trust)</span>
+				<div class="info-grid">
+					<div class="info-item">
+						<span class="label">驱动框架</span>
+						<span class="value">SvelteKit 5 + Cloudflare</span>
+					</div>
+					<div class="info-item">
+						<span class="label">当前管理员</span>
+						<span class="value">{data.user?.email || '未知用户'}</span>
+					</div>
+					<div class="info-item">
+						<span class="label">数据库绑定</span>
+						<span class="value"><span class="badge">{data.platformEnv}</span></span>
+					</div>
+					<div class="info-item">
+						<span class="label">R2存储绑定</span>
+						<span class="value"><span class="badge">{data.r2Env}</span></span>
+					</div>
+					<div class="info-item">
+						<span class="label">鉴权模式</span>
+						<span class="value">Cloudflare Access (Zero Trust)</span>
+					</div>
 				</div>
 			</div>
-		</div>
 
-		<div class="two-columns-row">
-			<div class="settings-card">
+			<hr class="section-divider" />
+
+			<div class="settings-section">
 				<h3>图片上传</h3>
 				<form
 					method="POST"
@@ -175,13 +179,15 @@
 						WebP，保持原尺寸及透明背景。GIF、动态 PNG 和已有 WebP 保持原格式。
 						仅影响新上传图片；直接调用上传 API 的客户端需自行转换。
 					</p>
-					<div class="form-actions" style="margin-top: auto;">
+					<div class="form-actions" style="justify-content: flex-start;">
 						<Button type="submit" variant="primary">保存上传设置</Button>
 					</div>
 				</form>
 			</div>
 
-			<div class="settings-card">
+			<hr class="section-divider" />
+
+			<div class="settings-section">
 				<h3>API 与 AI 集成</h3>
 				<p class="desc">
 					配置允许 AI 或第三方工具直接管理文章的 API 访问令牌 (Token)。请求 API 时请在 HTTP Header
@@ -197,9 +203,8 @@
 						};
 					}}
 					class="alias-form"
-					style="height: 100%; display: flex; flex-direction: column;"
 				>
-					<div class="form-group">
+					<div class="form-group" style="max-width: 500px;">
 						<label for="agent_api_token">API Token</label>
 						<div style="display: flex; gap: 10px; align-items: center; width: 100%;">
 							<TextInput
@@ -225,173 +230,179 @@
 							>
 						</div>
 					</div>
-					<div class="form-actions" style="margin-top: auto;">
+					<div class="form-actions" style="justify-content: flex-start;">
 						<Button type="submit" variant="primary">保存 Token</Button>
 					</div>
 				</form>
 			</div>
-		</div>
 
-		<div class="settings-card full-width" style="margin-top: 25px;">
-			<h3>Cloudflare Web Analytics</h3>
-			<p class="desc">
-				填写 Cloudflare Web Analytics 统计脚本中的 token，用于采集页面浏览量和访问次数。 请勿填写
-				Site Tag；它是查询标识，不能用于浏览器采集。后台查询还需配置 CF_ACCOUNT_ID， 并确保
-				CF_API_TOKEN 具有该账户的 Account Settings Read 和 Account Analytics Read 权限。
-			</p>
-			<form
-				method="POST"
-				action="?/updateWebAnalytics"
-				use:enhance={() => {
-					return async ({ update }) => {
-						update({ reset: false });
-					};
-				}}
-				class="alias-form"
-			>
-				<div class="form-group" style="max-width: 500px;">
-					<label for="web_analytics_token">Web Analytics Token</label>
-					<TextInput
-						type="text"
-						id="web_analytics_token"
-						name="web_analytics_token"
-						value={data.settings['site.web_analytics_token'] || ''}
-						placeholder="留空则禁用数据拉取和自动注入"
-					/>
-				</div>
-				<div class="form-actions" style="justify-content: flex-start;">
-					<Button type="submit" variant="primary">保存统计设置</Button>
-				</div>
-			</form>
+			<hr class="section-divider" />
+
+			<div class="settings-section">
+				<h3>Cloudflare Web Analytics</h3>
+				<p class="desc">
+					填写 Cloudflare Web Analytics 统计脚本中的 token，用于采集页面浏览量和访问次数。 请勿填写
+					Site Tag；它是查询标识，不能用于浏览器采集。后台查询还需配置 CF_ACCOUNT_ID， 并确保
+					CF_API_TOKEN 具有该账户的 Account Settings Read 和 Account Analytics Read 权限。
+				</p>
+				<form
+					method="POST"
+					action="?/updateWebAnalytics"
+					use:enhance={() => {
+						return async ({ update }) => {
+							update({ reset: false });
+						};
+					}}
+					class="alias-form"
+				>
+					<div class="form-group" style="max-width: 500px;">
+						<label for="web_analytics_token">Web Analytics Token</label>
+						<TextInput
+							type="text"
+							id="web_analytics_token"
+							name="web_analytics_token"
+							value={data.settings['site.web_analytics_token'] || ''}
+							placeholder="留空则禁用数据拉取和自动注入"
+						/>
+					</div>
+					<div class="form-actions" style="justify-content: flex-start;">
+						<Button type="submit" variant="primary">保存统计设置</Button>
+					</div>
+				</form>
+			</div>
 		</div>
 	{/if}
 
 	{#if activeTab === 'appearance'}
 		<div class="settings-card full-width">
-			<h3>首页顶部主图与外观偏好</h3>
+			<div class="settings-section">
+				<h3>首页顶部主图与外观偏好</h3>
 
-			<form
-				method="POST"
-				action="?/updateAppearance"
-				use:enhance={() => {
-					return async ({ update }) => {
-						update({ reset: false });
-					};
-				}}
-				class="alias-form"
-			>
-				<div class="form-group">
-					<label class="toggle-label">
-						<input type="checkbox" name="site_avatar_enabled_cb" bind:checked={avatarEnabled} />
-						<input
-							type="hidden"
-							name="site_avatar_enabled"
-							value={avatarEnabled ? 'true' : 'false'}
-						/>
-						<span class="toggle-text">在网站首页顶部标题栏显示主图 / 站点头像</span>
-					</label>
-				</div>
-
-				{#if avatarEnabled}
+				<form
+					method="POST"
+					action="?/updateAppearance"
+					use:enhance={() => {
+						return async ({ update }) => {
+							update({ reset: false });
+						};
+					}}
+					class="alias-form"
+				>
 					<div class="form-group">
-						<label for="picker">主页显示图片</label>
-						<div class="picker-container">
-							<ImagePicker
-								bind:cover={avatarUrl}
-								title=""
-								inputName="site_avatar_url"
-								aspectRatio="1/1"
+						<label class="toggle-label">
+							<input type="checkbox" name="site_avatar_enabled_cb" bind:checked={avatarEnabled} />
+							<input
+								type="hidden"
+								name="site_avatar_enabled"
+								value={avatarEnabled ? 'true' : 'false'}
 							/>
-						</div>
+							<span class="toggle-text">在网站首页顶部标题栏显示主图 / 站点头像</span>
+						</label>
 					</div>
-				{:else}
-					<input type="hidden" name="site_avatar_url" value={avatarUrl} />
-				{/if}
 
-				<div class="form-actions">
-					<Button type="submit" variant="primary">保存外观偏好</Button>
-				</div>
-			</form>
+					{#if avatarEnabled}
+						<div class="form-group">
+							<label for="picker">主页显示图片</label>
+							<div class="picker-container" style="max-width: 300px;">
+								<ImagePicker
+									bind:cover={avatarUrl}
+									title=""
+									inputName="site_avatar_url"
+									aspectRatio="1/1"
+								/>
+							</div>
+						</div>
+					{:else}
+						<input type="hidden" name="site_avatar_url" value={avatarUrl} />
+					{/if}
+
+					<div class="form-actions" style="justify-content: flex-start;">
+						<Button type="submit" variant="primary">保存外观偏好</Button>
+					</div>
+				</form>
+			</div>
 		</div>
 	{/if}
 
 	{#if activeTab === 'terms'}
 		<div class="settings-card full-width">
-			<h3>个性化术语设定</h3>
-			<p class="desc">
-				您可以根据部署场景（如教学系统、文档库）自定义后台各模块的显示名称，例如将“文章”改为“实验手册”。
-			</p>
+			<div class="settings-section">
+				<h3>个性化术语设定</h3>
+				<p class="desc">
+					您可以根据部署场景（如教学系统、文档库）自定义后台各模块的显示名称，例如将“文章”改为“实验手册”。
+				</p>
 
-			<form
-				method="POST"
-				action="?/updateAliases"
-				use:enhance={() => {
-					return async ({ update }) => {
-						update({ reset: false });
-					};
-				}}
-				class="alias-form"
-			>
-				<div class="form-row">
-					<div class="form-group">
-						<label for="alias_post">文章</label>
-						<TextInput
-							type="text"
-							id="alias_post"
-							name="alias_post"
-							value={data.settings['alias.post'] || '文章'}
-							required
-						/>
+				<form
+					method="POST"
+					action="?/updateAliases"
+					use:enhance={() => {
+						return async ({ update }) => {
+							update({ reset: false });
+						};
+					}}
+					class="alias-form"
+				>
+					<div class="form-row">
+						<div class="form-group">
+							<label for="alias_post">文章</label>
+							<TextInput
+								type="text"
+								id="alias_post"
+								name="alias_post"
+								value={data.settings['alias.post'] || '文章'}
+								required
+							/>
+						</div>
+						<div class="form-group">
+							<label for="alias_page">页面</label>
+							<TextInput
+								type="text"
+								id="alias_page"
+								name="alias_page"
+								value={data.settings['alias.page'] || '页面'}
+								required
+							/>
+						</div>
 					</div>
-					<div class="form-group">
-						<label for="alias_page">页面</label>
-						<TextInput
-							type="text"
-							id="alias_page"
-							name="alias_page"
-							value={data.settings['alias.page'] || '页面'}
-							required
-						/>
-					</div>
-				</div>
 
-				<div class="form-row">
-					<div class="form-group">
-						<label for="alias_category">分类</label>
-						<TextInput
-							type="text"
-							id="alias_category"
-							name="alias_category"
-							value={data.settings['alias.category'] || '分类'}
-							required
-						/>
+					<div class="form-row">
+						<div class="form-group">
+							<label for="alias_category">分类</label>
+							<TextInput
+								type="text"
+								id="alias_category"
+								name="alias_category"
+								value={data.settings['alias.category'] || '分类'}
+								required
+							/>
+						</div>
+						<div class="form-group">
+							<label for="alias_tag">标签</label>
+							<TextInput
+								type="text"
+								id="alias_tag"
+								name="alias_tag"
+								value={data.settings['alias.tag'] || '标签'}
+								required
+							/>
+						</div>
+						<div class="form-group">
+							<label for="alias_series">系列</label>
+							<TextInput
+								type="text"
+								id="alias_series"
+								name="alias_series"
+								value={data.settings['alias.series'] || '系列'}
+								required
+							/>
+						</div>
 					</div>
-					<div class="form-group">
-						<label for="alias_tag">标签</label>
-						<TextInput
-							type="text"
-							id="alias_tag"
-							name="alias_tag"
-							value={data.settings['alias.tag'] || '标签'}
-							required
-						/>
-					</div>
-					<div class="form-group">
-						<label for="alias_series">系列</label>
-						<TextInput
-							type="text"
-							id="alias_series"
-							name="alias_series"
-							value={data.settings['alias.series'] || '系列'}
-							required
-						/>
-					</div>
-				</div>
 
-				<div class="form-actions">
-					<Button type="submit" variant="primary">保存</Button>
-				</div>
-			</form>
+					<div class="form-actions" style="justify-content: flex-start;">
+						<Button type="submit" variant="primary">保存</Button>
+					</div>
+				</form>
+			</div>
 		</div>
 	{:else if activeTab === 'analytics'}
 		<AnalyticsPanel analyticsPromise={data.analytics} />
@@ -418,34 +429,6 @@
 		width: 100%;
 	}
 
-	.basic-top-row {
-		display: grid;
-		grid-template-columns: 2fr 1fr;
-		gap: 25px;
-		align-items: stretch;
-		width: 100%;
-	}
-
-	@media (max-width: 1024px) {
-		.basic-top-row {
-			grid-template-columns: 1fr;
-		}
-	}
-
-	.two-columns-row {
-		display: grid;
-		grid-template-columns: 1fr 1fr;
-		gap: 25px;
-		align-items: stretch;
-		width: 100%;
-	}
-
-	@media (max-width: 1024px) {
-		.two-columns-row {
-			grid-template-columns: 1fr;
-		}
-	}
-
 	.full-width {
 		grid-column: 1 / -1;
 	}
@@ -458,49 +441,68 @@
 		flex-direction: column;
 	}
 
-	.settings-card h3 {
-		margin: 0 0 12px 0;
-		font-size: 1.2rem;
-		border-bottom: 1px solid var(--border-color, rgba(0, 0, 0, 0.1));
-		padding-bottom: 10px;
-		color: var(--text-color);
+	.settings-section {
+		display: flex;
+		flex-direction: column;
+		padding: 10px 0;
 	}
 
-	.settings-card .desc {
+	.settings-section h3 {
+		margin: 0 0 16px 0;
+		font-size: 1.2rem;
+		color: var(--text-color);
+		font-weight: 600;
+	}
+
+	.section-divider {
+		border: 0;
+		border-top: 1px solid var(--border-color, rgba(0, 0, 0, 0.1));
+		margin: 25px 0;
+	}
+
+	.info-grid {
+		display: grid;
+		grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
+		gap: 24px 20px;
+		background: rgba(0, 0, 0, 0.02);
+		padding: 24px;
+		border-radius: 8px;
+		border: 1px solid var(--border-color, rgba(0, 0, 0, 0.05));
+	}
+
+	.info-item {
+		display: flex;
+		flex-direction: column;
+		gap: 8px;
+	}
+
+	.info-item .label {
+		color: var(--text-muted, rgba(0, 0, 0, 0.6));
+		font-size: 0.85rem;
+		font-weight: 500;
+	}
+
+	.info-item .value {
+		color: var(--text-color);
+		font-weight: 600;
+		font-size: 0.95rem;
+		word-break: break-word;
+	}
+
+	.settings-card h3 {
+		margin: 0 0 16px 0;
+		font-size: 1.2rem;
+		color: var(--text-color);
+		font-weight: 600;
+	}
+
+	.settings-section .desc {
 		font-size: 0.9rem;
 		color: var(--text-muted, rgba(0, 0, 0, 0.6));
 		margin-bottom: 24px;
 		line-height: 1.5;
 	}
 
-	.info-row {
-		display: flex;
-		justify-content: space-between;
-		align-items: center;
-		padding: 14px 0;
-		border-bottom: 1px dashed var(--border-color, rgba(0, 0, 0, 0.08));
-		font-size: 0.95rem;
-		gap: 15px;
-	}
-
-	.info-row:last-child {
-		border-bottom: none;
-	}
-
-	.info-row .label {
-		color: var(--text-muted, rgba(0, 0, 0, 0.6));
-		font-weight: 500;
-		white-space: nowrap;
-		flex-shrink: 0;
-	}
-
-	.info-row .value {
-		color: var(--text-color);
-		font-weight: 600;
-		text-align: right;
-		word-break: break-word;
-	}
-
 	.alias-form {
 		display: flex;
 		flex-direction: column;