/* ==========================================================================
   GDownload 官网设计系统 (Aurora)
   单文件站点样式：主题变量 + 极简 reset + 排版 + 布局原语 + 组件 + 响应式
   设计方向：Element Plus 气质（克制、卡片式、8px 圆角、轻阴影）；
   极光渐变 cyan(#22D3EE)→violet(#8B5CF6) 仅作点缀（hero 光晕/文字渐变/细弧线），
   绝不做大面积背景铺满。零外部依赖：系统字体栈，无 CDN / webfont。
   ========================================================================== */

/* --------------------------------------------------------------------------
   ① 变量
   -------------------------------------------------------------------------- */

/* 设计令牌 + 两主题共用的品牌/状态常量（不随主题变化） */
:root {
	/* 间距刻度（8px 基） */
	--s-1: 4px;
	--s-2: 8px;
	--s-3: 12px;
	--s-4: 16px;
	--s-5: 24px;
	--s-6: 32px;
	--s-7: 48px;
	--s-8: 64px;
	--s-9: 96px;

	/* 圆角 */
	--r-1: 6px;
	--r-2: 8px;
	--r-3: 12px;
	--r-pill: 999px;

	/* 字体栈：系统 UI 字体 + 技术数据用等宽 */
	--font: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
	--font-mono: ui-monospace, "SF Mono", "Cascadia Code", "JetBrains Mono", Consolas, "Courier New", monospace;

	/* 极光渐变（品牌点缀，青→紫；两主题共用） */
	--aurora-cyan: #22D3EE;
	--aurora-violet: #8B5CF6;
	--aurora: linear-gradient(120deg, var(--aurora-cyan), var(--aurora-violet));

	/* 状态色（两主题共用） */
	--success: #67C23A;
	--warning: #E6A23C;
	--danger: #F56C6C;

	/* 过渡与层级 */
	--t: .18s ease;
	--z-header: 100;

	/* 主按钮 hover 背景：始终加深以保证白字可读性（对比度 4.20:1）。
	   刻意不复用 --primary-hover——那是链接色阶，暗色下会变亮 (#79BBFF) 反而降低白字对比。 */
	--btn-primary-hover: #337ECC;

	/* 主题切换图标（内联 data-URI，配合 mask 用 currentColor 上色，无外部请求） */
	--icon-moon: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23000'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M21%2012.79A9%209%200%201%201%2011.21%203%207%207%200%200%200%2021%2012.79z'/%3E%3C/svg%3E");
	--icon-sun: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23000'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Ccircle%20cx='12'%20cy='12'%20r='4'/%3E%3Cpath%20d='M12%202v2M12%2020v2M4.93%204.93l1.41%201.41M17.66%2017.66l1.41%201.41M2%2012h2M20%2012h2M6.34%2017.66l-1.41%201.41M19.07%204.93l-1.41%201.41'/%3E%3C/svg%3E");
}

/* 浅色主题（默认；缺省 data-theme 时按浅色处理） */
:root[data-theme="light"],
:root:not([data-theme]) {
	/* 让浏览器原生控件（滚动条、表单控件等）跟随当前主题，而非操作系统偏好 */
	color-scheme: light;

	--bg: #F7FAFD;
	--surface: #FFFFFF;
	--surface-2: #F4F8FD;
	--text: #1F2937;
	--text-2: #414C5E;
	--text-3: #596579;
	--border: #DCE5F0;
	--border-2: #E7EDF5;
	--primary: #409EFF;
	--primary-hover: #337ECC;
	--shadow: 0 2px 12px rgba(31, 41, 55, .08);

	/* 派生令牌（浅色） */
	--primary-tint: rgba(64, 158, 255, .10);
	--header-bg: rgba(255, 255, 255, .82);
	--shadow-lg: 0 12px 32px rgba(31, 41, 55, .12);
	--glow: .55;
}

/* 深色主题 */
:root[data-theme="dark"] {
	/* 让浏览器原生控件（滚动条、表单控件等）跟随当前主题，而非操作系统偏好 */
	color-scheme: dark;

	--bg: #0E1420;
	--surface: #151D2E;
	--surface-2: #1B2438;
	--text: #E6EDF7;
	--text-2: #B7C2D4;
	--text-3: #8B99AF;
	--border: #26324A;
	--border-2: #1F2A40;
	--primary: #409EFF;
	--primary-hover: #79BBFF;
	--shadow: 0 2px 16px rgba(0, 0, 0, .35);

	/* 派生令牌（深色） */
	--primary-tint: rgba(64, 158, 255, .16);
	--header-bg: rgba(21, 29, 46, .72);
	--shadow-lg: 0 16px 40px rgba(0, 0, 0, .5);
	--glow: .85;
}

/* --------------------------------------------------------------------------
   ② 极简 reset
   -------------------------------------------------------------------------- */

*,
*::before,
*::after {
	box-sizing: border-box;
}

* {
	margin: 0;
}

html {
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
	scroll-behavior: smooth;
	/* 锚点滚动时为粘性头部预留空间 */
	scroll-padding-top: 80px;
}

body {
	min-height: 100vh;
}

img,
svg,
video {
	display: block;
	max-width: 100%;
}

img {
	height: auto;
}

button,
input,
select,
textarea {
	font: inherit;
	color: inherit;
}

button {
	cursor: pointer;
	background: none;
	border: none;
}

ul,
ol {
	list-style: none;
	padding: 0;
}

a {
	color: inherit;
	text-decoration: none;
}

[hidden] {
	display: none !important;
}

/* --------------------------------------------------------------------------
   ③ 排版
   -------------------------------------------------------------------------- */

body {
	font-family: var(--font);
	font-size: 16px;
	line-height: 1.65;
	color: var(--text);
	background: var(--bg);
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	transition: background-color var(--t), color var(--t);
}

h1,
h2,
h3,
h4 {
	color: var(--text);
	line-height: 1.25;
	font-weight: 700;
	letter-spacing: -.01em;
	text-wrap: balance;
}

p {
	color: var(--text-2);
}

a {
	/* 正文/内容链接默认用更高对比的品牌深蓝色阶（浅色 #337ECC 对白底 4.01:1；
	   深色 #79BBFF 对深底 9.10:1），优于原来的 --primary(#409EFF)。UI 组件链接各自覆写颜色。 */
	color: var(--primary-hover);
	transition: color var(--t);
}

a:hover {
	color: var(--primary);
}

/* 正文行内链接常驻下划线：链接身份不只靠颜色传达（WCAG 1.4.1） */
p a,
li a {
	text-decoration: underline;
	text-underline-offset: 2px;
}

/* 导航/页脚/目录等 UI 链接列表不加下划线（可保持品牌蓝） */
.nav-links a,
.footer-links a,
.toc a {
	text-decoration: none;
}

strong {
	font-weight: 600;
	color: var(--text);
}

code,
kbd,
samp {
	font-family: var(--font-mono);
	font-size: .9em;
}

/* 行内代码 */
:not(pre) > code {
	background: var(--surface-2);
	border: 1px solid var(--border-2);
	border-radius: var(--r-1);
	padding: .12em .4em;
	color: var(--text);
}

pre {
	background: var(--surface-2);
	border: 1px solid var(--border);
	border-radius: var(--r-2);
	padding: var(--s-4);
	overflow-x: auto;
}

pre code {
	background: none;
	border: 0;
	padding: 0;
}

hr {
	border: 0;
	border-top: 1px solid var(--border);
	margin: var(--s-6) 0;
}

::selection {
	background: var(--primary);
	color: #fff;
}

/* 键盘可达性：统一 focus 环 */
:focus-visible {
	outline: 2px solid var(--primary);
	outline-offset: 2px;
	border-radius: var(--r-1);
}

/* 尊重"减少动态效果"偏好 */
@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
	}
}

/* --------------------------------------------------------------------------
   ④ 布局原语
   -------------------------------------------------------------------------- */

/* 居中容器：最大宽度 1120px，两侧留白随视口收缩 */
.container {
	width: 100%;
	max-width: 1120px;
	margin-inline: auto;
	padding-inline: clamp(16px, 4vw, 24px);
}

/* 通用区块纵向节奏 */
.section {
	padding-block: clamp(var(--s-7), 8vw, var(--s-9));
}

.section-sm {
	padding-block: clamp(var(--s-6), 6vw, var(--s-8));
}

/* 区块标题簇（可选包裹：居中标题 + 副标） */
.section-head {
	max-width: 720px;
	margin: 0 auto var(--s-7);
	text-align: center;
}

.section-title {
	font-size: clamp(1.6rem, 3.2vw, 2.15rem);
	letter-spacing: -.02em;
	margin: 0;
}

.section-sub {
	margin-top: var(--s-3);
	color: var(--text-3);
	font-size: 1.05rem;
}

/* 交替底色区块（面板色，制造轻微分层，非渐变铺满） */
.section-alt {
	background: var(--surface-2);
	border-block: 1px solid var(--border-2);
}

/* --------------------------------------------------------------------------
   ⑤ 组件
   -------------------------------------------------------------------------- */

/* ---- 按钮 ---------------------------------------------------------------- */
.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--s-2);
	padding: .68em 1.35em;
	border: 1px solid transparent;
	border-radius: var(--r-2);
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.2;
	white-space: nowrap;
	cursor: pointer;
	transition: background-color var(--t), border-color var(--t), color var(--t), transform var(--t), box-shadow var(--t);
}

.btn:hover {
	transform: translateY(-1px);
}

.btn:active {
	transform: translateY(0);
}

.btn svg {
	width: 1.15em;
	height: 1.15em;
	fill: currentColor;
}

.btn-lg {
	padding: .85em 1.7em;
	font-size: 1.08rem;
}

/* 主按钮：Element Plus 实心蓝（渐变留给点缀，不用于大色块填充） */
.btn-primary {
	background: var(--primary);
	border-color: var(--primary);
	color: #fff;
}

.btn-primary:hover {
	background: var(--btn-primary-hover);
	border-color: var(--btn-primary-hover);
	color: #fff;
	box-shadow: 0 6px 18px rgba(64, 158, 255, .32);
}

/* 次按钮：描边幽灵 */
.btn-ghost {
	background: var(--surface);
	border-color: var(--border);
	color: var(--text);
}

.btn-ghost:hover {
	border-color: var(--primary);
	color: var(--primary);
	background: var(--primary-tint);
}

/* ---- 站点头部 / 导航 ----------------------------------------------------- */
.site-header {
	position: sticky;
	top: 0;
	z-index: var(--z-header);
	background: var(--header-bg);
	-webkit-backdrop-filter: saturate(150%) blur(10px);
	backdrop-filter: saturate(150%) blur(10px);
	border-bottom: 1px solid var(--border);
}

.nav {
	display: flex;
	align-items: center;
	gap: var(--s-4);
	min-height: 64px;
}

/* 品牌标识：logo + 文字 */
.brand {
	display: inline-flex;
	align-items: center;
	gap: var(--s-2);
	margin-right: auto;
	/* 把其余导航项推向右侧 */
	font-weight: 700;
	font-size: 1.15rem;
	letter-spacing: -.01em;
	color: var(--text);
}

.brand:hover {
	color: var(--text);
}

.brand-logo {
	width: 28px;
	height: 28px;
}

/* 页面导航链接 */
.nav-links {
	display: flex;
	align-items: center;
	gap: var(--s-1);
	margin: 0;
}

.nav-links a {
	display: block;
	padding: 8px 12px;
	border-radius: var(--r-2);
	color: var(--text-2);
	font-size: .95rem;
	font-weight: 500;
	transition: color var(--t), background-color var(--t);
}

.nav-links a:hover {
	color: var(--text);
	background: var(--surface-2);
}

.nav-links a.active {
	position: relative;
	color: var(--primary);
	font-weight: 600;
}

/* 当前页指示：Element Plus 风格 2px 底部指示条（不只靠颜色传达状态） */
.nav-links a.active::after {
	content: "";
	position: absolute;
	left: 12px;
	right: 12px;
	bottom: 3px;
	height: 2px;
	border-radius: 2px;
	background: var(--primary);
}

/* 右侧动作区：语言 / 主题 / GitHub */
.nav-actions {
	display: flex;
	align-items: center;
	gap: var(--s-2);
}

/* 语言切换（文字胶囊 EN / 中文） */
.lang-switch {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	height: 36px;
	padding: 0 10px;
	border: 1px solid var(--border);
	border-radius: var(--r-2);
	color: var(--text-2);
	font-size: .85rem;
	font-weight: 600;
	letter-spacing: .02em;
	transition: color var(--t), border-color var(--t), background-color var(--t);
}

.lang-switch:hover {
	color: var(--primary);
	border-color: var(--primary);
	background: var(--primary-tint);
}

/* 图标按钮通用外观（主题切换 / GitHub） */
.theme-toggle,
.gh-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border: 1px solid var(--border);
	border-radius: var(--r-2);
	color: var(--text-2);
	transition: color var(--t), border-color var(--t), background-color var(--t);
}

.theme-toggle:hover,
.gh-link:hover {
	color: var(--primary);
	border-color: var(--primary);
	background: var(--primary-tint);
}

/* 主题切换图标：浅色显示"月亮"（点击去深色），深色显示"太阳" */
.theme-toggle::before {
	content: "";
	width: 18px;
	height: 18px;
	background: currentColor;
	-webkit-mask: var(--icon-moon) center / contain no-repeat;
	mask: var(--icon-moon) center / contain no-repeat;
}

:root[data-theme="dark"] .theme-toggle::before {
	-webkit-mask: var(--icon-sun) center / contain no-repeat;
	mask: var(--icon-sun) center / contain no-repeat;
}

.gh-link svg {
	width: 20px;
	height: 20px;
	fill: currentColor;
}

/* 汉堡按钮（<768px 显示） */
.nav-toggle {
	display: none;
	flex-direction: column;
	justify-content: center;
	gap: 5px;
	width: 40px;
	height: 36px;
	padding: 9px 8px;
	border: 1px solid var(--border);
	border-radius: var(--r-2);
	order: 5;
	/* 保持在最右 */
}

.nav-toggle span {
	display: block;
	width: 100%;
	height: 2px;
	border-radius: 2px;
	background: var(--text-2);
	transition: transform var(--t), opacity var(--t);
}

/* 展开态：汉堡变叉 */
.site-header.nav-open .nav-toggle span:nth-child(1) {
	transform: translateY(7px) rotate(45deg);
}

.site-header.nav-open .nav-toggle span:nth-child(2) {
	opacity: 0;
}

.site-header.nav-open .nav-toggle span:nth-child(3) {
	transform: translateY(-7px) rotate(-45deg);
}

/* ---- Hero ---------------------------------------------------------------- */
.hero {
	position: relative;
	overflow: hidden;
	text-align: center;
	padding-block: clamp(var(--s-8), 11vw, 132px) var(--s-8);
}

/* 极光光晕：hero 顶部柔和放射色团，作为点缀而非背景铺满 */
.hero::before {
	content: "";
	position: absolute;
	top: -14%;
	left: 50%;
	width: min(680px, 92%);
	height: 440px;
	transform: translateX(-50%);
	background: radial-gradient(closest-side, rgba(34, 211, 238, .30), rgba(139, 92, 246, .20) 55%, transparent 78%);
	filter: blur(34px);
	opacity: var(--glow);
	pointer-events: none;
	z-index: 0;
}

.hero .container {
	position: relative;
	z-index: 1;
	max-width: 880px;
}

/* Hero 眉标：带一段极光细弧线的小标签 */
.hero-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: var(--s-2);
	margin: 0 auto var(--s-5);
	font-size: .8rem;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--text-3);
}

.hero-eyebrow::before {
	content: "";
	width: 22px;
	height: 2px;
	border-radius: 2px;
	background: var(--aurora);
}

.hero h1 {
	font-size: clamp(2.1rem, 5.2vw, 3.4rem);
	line-height: 1.1;
	letter-spacing: -.025em;
	font-weight: 800;
	margin: 0 auto var(--s-4);
}

.hero-sub {
	max-width: 640px;
	margin: 0 auto;
	color: var(--text-2);
	font-size: clamp(1.02rem, 2vw, 1.2rem);
	line-height: 1.6;
}

.hero-actions {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--s-3);
	margin-top: var(--s-7);
}

/* 极光文字渐变（用于 hero 关键词等少量点睛，不做整段） */
.aurora-text {
	background: var(--aurora);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

/* ---- 应用窗口展示图 ------------------------------------------------------ */
.app-shot {
	max-width: 1120px;
	margin: var(--s-8) auto 0;
	padding-inline: clamp(16px, 4vw, 24px);
}

.app-shot img {
	width: 100%;
	height: auto;
	border-radius: var(--r-3);
	border: 1px solid var(--border);
	box-shadow: var(--shadow-lg);
}

/* ---- 通用卡片 ------------------------------------------------------------ */
.card {
	background: var(--surface);
	border: 1px solid var(--border);
	border-radius: var(--r-3);
	box-shadow: var(--shadow);
	padding: var(--s-5);
}

/* ---- 功能亮点网格 -------------------------------------------------------- */
.feature-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: var(--s-4);
}

.feature-card {
	background: var(--surface);
	border: 1px solid var(--border);
	border-radius: var(--r-3);
	padding: var(--s-5);
	transition: transform var(--t), box-shadow var(--t), border-color var(--t);
}

.feature-card:hover {
	transform: translateY(-2px);
	box-shadow: var(--shadow-lg);
	border-color: var(--primary);
}

/* 功能图标：圆角浅底方块托线性图标 */
.feature-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin-bottom: var(--s-4);
	border-radius: var(--r-2);
	background: var(--primary-tint);
	color: var(--primary);
}

.feature-icon svg {
	width: 24px;
	height: 24px;
	stroke: currentColor;
	fill: none;
}

.feature-card h3 {
	margin: 0 0 var(--s-2);
	font-size: 1.1rem;
}

.feature-card p {
	margin: 0;
	color: var(--text-2);
	font-size: .94rem;
	line-height: 1.6;
}

/* ---- 下载区 -------------------------------------------------------------- */
.download-strip {
	padding-block: clamp(var(--s-7), 8vw, var(--s-9));
	text-align: center;
}

.download-strip h2 {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: var(--s-3);
	font-size: clamp(1.5rem, 3vw, 2rem);
	letter-spacing: -.02em;
}

/* 版本徽标：等宽小胶囊；无内容时隐藏 */
.dl-version-badge {
	display: inline-flex;
	align-items: center;
	padding: .18em .6em;
	border: 1px solid var(--primary);
	border-radius: var(--r-pill);
	background: var(--primary-tint);
	/* 文字用更深/更亮的品牌色阶提升可读性（浅色 #337ECC，深色 #79BBFF），保留 600 字重 */
	color: var(--primary-hover);
	font-family: var(--font-mono);
	font-size: .72em;
	font-weight: 600;
	letter-spacing: 0;
}

.dl-version-badge:empty {
	display: none;
}

.dl-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--s-4);
	margin-top: var(--s-7);
	text-align: left;
}

/* 下载卡（整卡可点） */
.dl-card {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: var(--s-2);
	padding: var(--s-5);
	background: var(--surface);
	border: 1px solid var(--border);
	border-radius: var(--r-3);
	box-shadow: var(--shadow);
	color: var(--text);
	overflow: hidden;
	transition: transform var(--t), box-shadow var(--t), border-color var(--t);
}

.dl-card:hover {
	transform: translateY(-2px);
	box-shadow: var(--shadow-lg);
	border-color: var(--primary);
	color: var(--text);
}

.dl-card > svg {
	width: 40px;
	height: 40px;
	margin-bottom: var(--s-2);
	color: var(--text-2);
	fill: currentColor;
}

.dl-os {
	font-size: 1.15rem;
	font-weight: 700;
}

.dl-meta {
	color: var(--text-3);
	font-size: .9rem;
}

.dl-size {
	margin-top: auto;
	color: var(--text-3);
	font-family: var(--font-mono);
	font-size: .82rem;
}

.dl-size:empty::before {
	/* 数据未就绪时占位，避免布局跳动 */
	content: "\00a0";
}

/* JS 检测到的当前平台卡：主色描边 + 极光顶条（品牌"进度弧"点缀） */
.dl-card.recommended {
	border-color: var(--primary);
	box-shadow: var(--shadow-lg);
}

.dl-card.recommended::before {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 3px;
	background: var(--aurora);
}

.dl-card.recommended > svg {
	color: var(--primary);
}

.dl-note {
	margin-top: var(--s-5);
	color: var(--text-3);
	font-size: .92rem;
}

/* ---- 文档布局 + 目录 ----------------------------------------------------- */
.docs-layout {
	display: grid;
	grid-template-columns: 240px minmax(0, 1fr);
	gap: var(--s-7);
	align-items: start;
	padding-block: clamp(var(--s-6), 6vw, var(--s-8));
}

.toc {
	position: sticky;
	top: 84px;
	align-self: start;
	background: var(--surface);
	border: 1px solid var(--border);
	border-radius: var(--r-3);
	padding: var(--s-4);
	font-size: .9rem;
}

.toc ul {
	display: flex;
	flex-direction: column;
	gap: 2px;
	margin: 0;
}

.toc a {
	display: block;
	padding: 6px 10px;
	border-left: 2px solid transparent;
	border-radius: 0 var(--r-1) var(--r-1) 0;
	color: var(--text-2);
	transition: color var(--t), background-color var(--t), border-color var(--t);
}

.toc a:hover {
	color: var(--primary);
	background: var(--surface-2);
}

.toc a.active {
	color: var(--primary);
	border-left-color: var(--primary);
	background: var(--primary-tint);
	font-weight: 600;
}

/* ---- FAQ ----------------------------------------------------------------- */
.faq-item {
	padding: var(--s-5) 0;
	border-bottom: 1px solid var(--border);
}

.faq-item h3 {
	margin: 0 0 var(--s-2);
	font-size: 1.1rem;
}

.faq-item p {
	margin: 0;
	color: var(--text-2);
}

/* ---- 更新日志条目 -------------------------------------------------------- */
.release {
	padding: var(--s-6) 0;
	border-bottom: 1px solid var(--border);
	/* GitHub Release 正文来自外部输入，可能包含无断点的长 URL（如 compare 链接），
	   overflow-wrap 会被子元素继承，避免窄视口下撑出水平滚动 */
	overflow-wrap: anywhere;
}

.release:first-child {
	padding-top: 0;
}

.release h2 {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: var(--s-3);
	font-size: 1.4rem;
	letter-spacing: -.01em;
	margin: 0 0 var(--s-3);
}

.release h2 time {
	font-family: var(--font-mono);
	font-size: .85rem;
	font-weight: 500;
	color: var(--text-3);
}

.release h3 {
	font-size: 1.05rem;
	margin: var(--s-4) 0 var(--s-2);
}

.release p {
	margin: var(--s-2) 0;
}

.release ul {
	list-style: disc;
	margin: var(--s-2) 0;
	padding-left: 1.35em;
}

.release li {
	margin: .3em 0;
	color: var(--text-2);
}

/* 更新日志降级提示条 */
.changelog-fallback {
	padding: var(--s-4) var(--s-5);
	margin-bottom: var(--s-5);
	background: var(--surface-2);
	border: 1px solid var(--border);
	border-left: 3px solid var(--warning);
	border-radius: var(--r-2);
	color: var(--text-2);
	font-size: .95rem;
}

/* ---- 页脚 ---------------------------------------------------------------- */
.site-footer {
	margin-top: var(--s-9);
	padding-block: var(--s-8) var(--s-6);
	background: var(--surface);
	border-top: 1px solid var(--border);
}

.footer-grid {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: var(--s-6) var(--s-8);
	align-items: start;
}

.footer-brand span {
	font-weight: 700;
	font-size: 1.15rem;
	color: var(--text);
}

.footer-brand p {
	margin-top: var(--s-2);
	color: var(--text-3);
	font-size: .92rem;
}

.footer-links {
	display: grid;
	gap: var(--s-2);
	margin: 0;
}

.footer-links a {
	color: var(--text-2);
	font-size: .92rem;
	transition: color var(--t);
}

.footer-links a:hover {
	color: var(--primary);
}

.footer-meta {
	margin-top: var(--s-6);
	padding-top: var(--s-5);
	border-top: 1px solid var(--border-2);
	color: var(--text-3);
	font-size: .85rem;
	text-align: center;
}

/* --------------------------------------------------------------------------
   ⑥ 响应式（断点 1024 / 768 / 480）
   -------------------------------------------------------------------------- */

/* 平板及以下：文档目录移到正文上方，取消粘性 */
@media (max-width: 1024px) {
	.docs-layout {
		grid-template-columns: 1fr;
		gap: var(--s-5);
	}

	.toc {
		position: static;
		top: auto;
	}
}

/* 768px 以下：导航折叠为汉堡展开面板 */
@media (max-width: 767.98px) {
	.nav-toggle {
		display: inline-flex;
	}

	/* 默认收起；展开态才显示为下拉面板 */
	.nav-links {
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		flex-direction: column;
		align-items: stretch;
		gap: 2px;
		padding: var(--s-3);
		background: var(--surface);
		border-bottom: 1px solid var(--border);
		box-shadow: var(--shadow-lg);
		display: none;
	}

	.site-header.nav-open .nav-links {
		display: flex;
	}

	.nav-links a {
		padding: 12px 14px;
	}

	.dl-grid {
		grid-template-columns: 1fr;
	}

	.footer-grid {
		grid-template-columns: 1fr;
	}
}

/* 480px 以下：收紧节奏，动作按钮撑满 */
@media (max-width: 480px) {
	.hero-actions {
		flex-direction: column;
		align-items: stretch;
	}

	.hero-actions .btn {
		width: 100%;
	}

	.brand span {
		font-size: 1.05rem;
	}
}

/* --------------------------------------------------------------------------
   ⑦ 主题显隐工具类（only-light / only-dark）
   缺省或浅色主题下隐藏 only-dark；深色主题下隐藏 only-light。
   -------------------------------------------------------------------------- */
:root:not([data-theme="dark"]) .only-dark {
	display: none !important;
}

:root[data-theme="dark"] .only-light {
	display: none !important;
}

/* --------------------------------------------------------------------------
   ⑧ Task 5 首页新增小工具类（仅新增，未改动上方任何既有规则）
   - 开源条：居中的收尾式 CTA 区块（Apache 徽标 + 标题 + 说明 + 双动作按钮）
   - 下载卡平台图标镂空点：用卡片背景色给填充图标挖空（如企鹅眼睛），随主题自适应
   -------------------------------------------------------------------------- */

/* 下载卡内联填充图标的"挖空"点：填成卡片背景色，浅色/深色下都呈镂空效果 */
.dl-card svg .cutout {
	fill: var(--surface);
}
.os-strip {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: var(--s-4);
}

/* 复用 .section-sub 的字号/色阶，仅在开源条内收窄宽度并去掉其默认上边距（由 gap 统一控制） */
.os-strip .section-sub {
	max-width: 560px;
	margin-top: 0;
}

/* Apache 许可徽标：描边小胶囊 + 内联对勾图标 */
.os-badge {
	display: inline-flex;
	align-items: center;
	gap: var(--s-2);
	padding: .35em .85em;
	border: 1px solid var(--border);
	border-radius: var(--r-pill);
	background: var(--surface);
	color: var(--text-2);
	font-size: .82rem;
	font-weight: 600;
	letter-spacing: .01em;
}

.os-badge svg {
	width: 15px;
	height: 15px;
	fill: currentColor;
}

/* 动作按钮行：居中，可换行 */
.os-actions {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--s-3);
	margin-top: var(--s-2);
}

/* --------------------------------------------------------------------------
   ⑨ Task 7 文档页新增（仅新增，未改动上方任何既有规则）
   - 文档正文排版：section 间分隔线、标题间距、列表标记恢复
     （全局 reset 把 ul/ol 的 list-style 和 padding 清零了，这里仅在
     .docs-content 作用域内恢复，不影响 .toc / .faq-item 等既有结构）
   -------------------------------------------------------------------------- */

.docs-content h1 {
	font-size: clamp(1.8rem, 3.6vw, 2.3rem);
	margin-bottom: var(--s-6);
}

.docs-content section {
	padding-top: var(--s-7);
	border-top: 1px solid var(--border-2);
}

.docs-content section:first-of-type {
	padding-top: 0;
	border-top: 0;
}

.docs-content h2 {
	font-size: clamp(1.3rem, 2.4vw, 1.6rem);
	margin-bottom: var(--s-4);
}

/* 注意：必须限定到 section 的直接子层，不能写成 ".docs-content h3/p"——
   那样的后代选择器会连 .faq-item 内部的 h3/p 一起选中，且与既有
   ".faq-item h3/p" 特异性相同、因本节在样式表里靠后而意外覆盖之
   （Fix Round 1 修复：曾把 FAQ 问题的间距从设计的 24px 顶成 48px）。 */
.docs-content > section > h3 {
	font-size: 1.05rem;
	margin: var(--s-5) 0 var(--s-2);
}

.docs-content > section > p {
	margin: var(--s-3) 0;
}

.docs-content ul,
.docs-content ol {
	margin: var(--s-3) 0 var(--s-4);
	padding-left: 1.4em;
}

.docs-content ul {
	list-style: disc;
}

.docs-content ol {
	list-style: decimal;
}

.docs-content li {
	margin: .35em 0;
	color: var(--text-2);
}

.docs-content li strong {
	color: var(--text);
}

/* Fix Round 1 追加：可折叠移动端 TOC
   结构改为 <details class="toc"><summary>目录</summary><nav>…</nav></details>：
   - 默认（含无 JS 兜底）：details 带 open，桌面/移动都显示完整目录（渐进增强）；
   - 桌面 (>1024px)：仅隐藏 summary，恢复成一个纯展示的 sticky 卡片；
     content 是否可见交给 [open] 属性本身处理——实测 Chrome 对折叠 details
     的隐藏是内部机制（不是简单在子元素上加 display:none），无法靠
     ".toc nav { display:block }" 之类的选择器覆盖，所以不在这里假装能
     "强制常显"；真正保证桌面恒显的是 site.js 里的 matchMedia 监听：
     只要视口 ≥1024.02px 就把 open 属性设回去（含从移动折叠态把窗口拉宽
     的场景），这里 CSS 只负责让 summary 消失、外观复原。
   - 移动 (<=1024px)：summary 变成可点击的"目录"栏，原生 details 开合即可用；
     site.js 同一段逻辑负责首次加载时移除 open 完成初始收起。 */
.toc summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	cursor: pointer;
	color: var(--text);
	font-weight: 600;
	list-style: none;
}

/* 隐藏 Chromium/Safari 默认的三角形 marker，改用下面自绘的 ›/⌄ 指示符 */
.toc summary::-webkit-details-marker {
	display: none;
}

.toc summary::after {
	content: "\203A";
	color: var(--text-3);
	transition: transform var(--t);
}

.toc[open] summary::after {
	transform: rotate(90deg);
}

@media (max-width: 1024px) {
	.toc[open] summary {
		margin-bottom: var(--s-3);
		padding-bottom: var(--s-3);
		border-bottom: 1px solid var(--border-2);
	}
}

@media (min-width: 1024.02px) {
	.toc summary {
		display: none;
	}
}

/* --------------------------------------------------------------------------
   ⑩ Task 8 新增（仅新增，未改动上方任何既有规则）
   - .btn-row：正文（如 .docs-content 内）左对齐的多按钮行；不复用 .os-actions——
     那是 .os-strip 专属的居中变体，对齐方向语义不同，新增独立类避免误用。
   - .error-*：404 页专属的全屏垂直居中布局，选择器均为全新类名，
     不会命中站内任何既有页面结构。
   -------------------------------------------------------------------------- */

.btn-row {
	display: flex;
	flex-wrap: wrap;
	gap: var(--s-3);
	margin-top: var(--s-4);
}

/* 404 页：脱离常规 header/main/footer 节奏，整页垂直居中 */
.error-page {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 100vh;
	text-align: center;
	padding-block: var(--s-7);
}

.error-brand {
	margin: 0 auto var(--s-6);
}

/* 巨大号错误码：复用极光文字渐变点缀（同 .aurora-text 手法） */
.error-code {
	font-size: clamp(4rem, 16vw, 7.5rem);
	font-weight: 800;
	line-height: 1;
	letter-spacing: -.02em;
	background: var(--aurora);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

.error-message {
	margin-top: var(--s-4);
	color: var(--text-2);
	font-size: 1.15rem;
}

/* 同特异性下靠后声明覆盖 .btn-row 的 margin-top（s-4 -> s-7）：
   404 页整体垂直居中，错误页按钮行需要比正文场景更大的顶部留白，此处为有意覆盖，非疏漏 */
.error-actions {
	justify-content: center;
	margin-top: var(--s-7);
}