/* 产品更新日志样式（参考 loomy.xunfei.cn/changelog 设计规范） */
:root {
	--surface: #ffffff;
	--ink: #35383b;
	--muted: #7b7f83;
	--accent: #66d9a0;
	--accent-strong: #2fbf71;
	--accent-deep: #3fae77;
	--mint: #e3f6ec;
	--hero-mint: #d5f1e2;
	--hero-yellow: #f7f3b0;
	--hero-green: #a5e8c0;
	--line: rgba(53, 56, 59, 0.1);
	--content-width: 80rem;
	--tag-add-bg: #e3f6ec;
	--tag-add-color: #2fbf71;
	--tag-opt-bg: #e8eeff;
	--tag-opt-color: #3a7afe;
	--tag-fix-bg: #fff3e2;
	--tag-fix-color: #e6902c;
}
@media (prefers-color-scheme: dark) {
	:root {
		--surface: #222a26;
		--ink: #e6ebe8;
		--muted: #a8b2ac;
		--accent: #4ecf8e;
		--accent-strong: #3fd584;
		--accent-deep: #52cf92;
		--mint: #2b3a32;
		--hero-mint: #2b3a32;
		--hero-yellow: #5c5a2e;
		--hero-green: #3c6f52;
		--line: rgba(230, 235, 232, 0.13);
		--tag-add-bg: #1f4a35;
		--tag-add-color: #4ecf8e;
		--tag-opt-bg: #22345c;
		--tag-opt-color: #7da4ff;
		--tag-fix-bg: #4a3a1f;
		--tag-fix-color: #f0b35c;
	}
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
	background: var(--surface); color: var(--ink);
	font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Noto Sans SC", "Microsoft YaHei", sans-serif;
	line-height: 1.7; -webkit-font-smoothing: antialiased;
	transition: background-color .22s ease, color .22s ease;
}

/* ===== Hero：柔和渐变光晕 + 大标题 ===== */
.hero {
	position: relative; isolation: isolate; overflow: hidden;
	padding-block: 3rem 5.5rem;
	background:
		radial-gradient(ellipse at 30% 52%, var(--hero-yellow) 0%, transparent 60%),
		radial-gradient(ellipse at 70% 48%, var(--hero-green) 0%, transparent 62%),
		linear-gradient(180deg, var(--surface) 0%, var(--hero-mint) 50%, var(--surface) 100%);
}
.hero-glow {
	position: absolute; z-index: 0; top: -22rem; left: 50%;
	width: min(72rem, 96vw); aspect-ratio: 1.9; border-radius: 50%;
	background: radial-gradient(circle, var(--accent-strong) 0%, var(--mint) 46%, transparent 72%);
	filter: blur(5.5rem); pointer-events: none; transform: translateX(-50%);
}
.hero-content {
	position: relative; z-index: 1;
	width: min(calc(100% - 10rem), var(--content-width));
	margin-inline: auto; animation: hero-rise .52s ease-out both;
}
@keyframes hero-rise { 0% { opacity: 0; transform: translateY(1rem); } 100% { opacity: 1; transform: translateY(0); } }
.eyebrow {
	display: inline-flex; align-items: center; gap: .625rem;
	color: var(--accent-deep); font-size: .8125rem; font-weight: 700; letter-spacing: .08em;
}
.eyebrow::before { content: ""; width: 1.75rem; height: .125rem; border-radius: 999px; background: var(--accent-strong); }
.hero h1 {
	margin-top: 1.5rem; font-size: clamp(3rem, 5vw, 5rem);
	font-weight: 700; line-height: 1.04; letter-spacing: -.04em;
}
.hero-desc { max-width: 48rem; margin-top: 1.5rem; color: var(--muted); font-size: clamp(1rem, 1.5vw, 1.2rem); line-height: 1.8; }

/* ===== 内容区：左侧导航 + 右侧时间轴 ===== */
.content {
	display: grid; width: min(calc(100% - 2rem), var(--content-width));
	grid-template-columns: 16rem minmax(0, 1fr);
	gap: clamp(2rem, 5vw, 5rem); padding-bottom: 8rem; margin-inline: auto;
}
.nav { position: sticky; top: 2rem; z-index: 2; align-self: start; }
.nav ul { display: grid; gap: .25rem; list-style: none; }
.nav a {
	display: flex; flex-direction: column; gap: .25rem; padding: .7rem 1rem;
	border-left: 2px solid var(--line); color: var(--muted);
	font-size: .9375rem; line-height: 1.35; text-decoration: none;
	transition: border-color .16s ease, color .16s ease;
}
.nav a:hover, .nav a.active { border-color: var(--accent-strong); color: var(--accent-strong); }

/* 时间轴条目 */
.entries { min-width: 0; }
.entry {
	position: relative; padding: 0 0 3.5rem 2rem;
	border-left: 1px solid var(--line); scroll-margin-top: 5rem;
}
.entry:last-child { padding-bottom: 0; }
.entry::before {
	content: ""; position: absolute; top: .45rem; left: -.35rem;
	width: .625rem; height: .625rem; border-radius: 50%;
	background: var(--accent-strong); border: 2px solid var(--surface);
	box-shadow: 0 0 0 1px var(--accent-strong);
}
.entry-head {
	display: flex; align-items: baseline; justify-content: space-between; gap: 1rem;
	padding-bottom: 1rem; border-bottom: 1px solid var(--line);
}
.entry-head h2 { font-size: clamp(1.75rem, 2.5vw, 2.5rem); line-height: 1.15; font-weight: 700; }
.entry-tag { display: inline-block; margin-top: 1.25rem; color: var(--accent-strong); font-size: .875rem; font-weight: 700; line-height: 1.5; }
.entry-items { display: grid; gap: .75rem; margin: 1.5rem 0 0; list-style: none; }
.entry-items li { display: flex; gap: .6rem; align-items: baseline; color: var(--ink); font-size: 1rem; line-height: 1.8; }
.item-tag {
	flex: 0 0 auto; font-size: .75rem; font-weight: 700; line-height: 1.5;
	padding: .06rem .55rem; border-radius: 999px; white-space: nowrap;
}
.tag-add { background: var(--tag-add-bg); color: var(--tag-add-color); }
.tag-opt { background: var(--tag-opt-bg); color: var(--tag-opt-color); }
.tag-fix { background: var(--tag-fix-bg); color: var(--tag-fix-color); }

/* ===== 响应式 ===== */
@media (max-width: 1023px) {
	.hero-content { width: min(calc(100% - 5rem), var(--content-width)); }
}
@media (max-width: 767px) {
	.hero { padding-block: 4rem 3rem; }
	.hero-content { width: min(calc(100% - 2rem), var(--content-width)); animation: none; }
	.hero h1 { font-size: clamp(2.5rem, 12vw, 3.5rem); }
	.hero-desc { margin-top: 1.25rem; font-size: 1rem; line-height: 1.75; }
	.content { display: block; }
	.nav { position: static; overflow-x: auto; margin-bottom: 3rem; padding-bottom: .25rem; }
	.nav ul { display: flex; width: max-content; gap: .5rem; }
	.nav a { min-width: 7rem; border-top: 2px solid var(--line); border-left: 0; padding: .65rem .75rem; }
	.nav a:hover, .nav a.active { border-top-color: var(--accent-strong); }
	.entry { padding-left: 1.25rem; }
	.entry-head { align-items: flex-start; flex-direction: column; gap: .35rem; }
}