:root {
	--yqm-ink: light-dark(#eef5f7, #07141b);
	--yqm-ink-soft: light-dark(#f7fbfc, #0d2029);
	--yqm-panel: light-dark(#ffffff, #102832);
	--yqm-line: light-dark(rgba(16, 91, 107, 0.18), rgba(163, 222, 233, 0.18));
	--yqm-muted: light-dark(#4c6670, #a6b9c1);
	--yqm-cyan: light-dark(#087d91, #20d1ea);
	--yqm-cyan-bright: light-dark(#076f82, #5ce8f8);
	--yqm-white: light-dark(#0b2029, #f5f8f9);
	--yqm-on-accent: light-dark(#ffffff, #05202a);
	--yqm-nav-bg: light-dark(rgba(248, 252, 253, 0.98), rgba(7, 20, 27, 0.98));
	--yqm-nav-text: light-dark(#29434d, #c7d4d9);
	--yqm-nav-strong: light-dark(#07141b, #ffffff);
	--yqm-copy: light-dark(#435f69, #b8c7cd);
	--yqm-subtle: light-dark(#5d7780, #839aa4);
	--yqm-section-bg: light-dark(#f4f8fa, #091920);
	--yqm-card-bg: light-dark(#ffffff, #0b1d25);
	--yqm-card-hover: light-dark(#eaf3f6, #102832);
	--yqm-card-copy: light-dark(#4d6872, #9db1b9);
	--yqm-chip-text: light-dark(#4c6974, #86a3ae);
	--yqm-footer-bg: light-dark(#e8f1f4, #061117);
	--yqm-footer-text: light-dark(#506a74, #8197a0);
	--yqm-footer-link: light-dark(#3a5964, #9bb0b8);
	--yqm-accent-05: color-mix(in srgb, var(--yqm-cyan) 5%, transparent);
	--yqm-accent-08: color-mix(in srgb, var(--yqm-cyan) 8%, transparent);
	--yqm-accent-13: color-mix(in srgb, var(--yqm-cyan) 13%, transparent);
	--yqm-accent-14: color-mix(in srgb, var(--yqm-cyan) 14%, transparent);
	--yqm-accent-16: color-mix(in srgb, var(--yqm-cyan) 16%, transparent);
	--yqm-accent-18: color-mix(in srgb, var(--yqm-cyan) 18%, transparent);
	--yqm-accent-26: color-mix(in srgb, var(--yqm-cyan) 26%, transparent);
	--yqm-accent-28: color-mix(in srgb, var(--yqm-cyan) 28%, transparent);
	--yqm-accent-36: color-mix(in srgb, var(--yqm-cyan) 36%, transparent);
	--yqm-accent-48: color-mix(in srgb, var(--yqm-cyan) 48%, transparent);
	--yqm-accent-72: color-mix(in srgb, var(--yqm-cyan) 72%, transparent);
}

html[data-theme$="-tritanopia"] {
	--yqm-cyan: light-dark(#b43a55, #ef6c86);
	--yqm-cyan-bright: light-dark(#9f2f49, #ff91a4);
	--yqm-on-accent: light-dark(#ffffff, #2b0710);
}

html[data-theme$="-protanopia-deuteranopia"] {
	--yqm-cyan: light-dark(#765600, #d6a925);
	--yqm-cyan-bright: light-dark(#674a00, #ffd166);
	--yqm-on-accent: light-dark(#ffffff, #241a00);
}

body {
	font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans CJK SC", "Microsoft YaHei", sans-serif;
}

body:has(.yqm-home) {
	background: var(--yqm-footer-bg);
}

.full.height:has(.yqm-home) {
	padding-bottom: 0;
	background: var(--yqm-ink);
}

#navbar {
	min-height: 58px;
	background: var(--yqm-nav-bg);
	border-bottom: 1px solid var(--yqm-accent-16);
	box-shadow: 0 12px 36px light-dark(rgba(14, 49, 59, 0.1), rgba(2, 9, 12, 0.16));
}

#navbar .item {
	color: var(--yqm-nav-text) !important;
}

#navbar .item:hover,
#navbar .item:focus-visible {
	color: var(--yqm-nav-strong) !important;
	background: var(--yqm-accent-08) !important;
}

#navbar .item.active {
	color: var(--yqm-nav-strong) !important;
	box-shadow: inset 0 -2px var(--yqm-cyan);
}

#navbar .ui.dropdown .menu .item {
	color: var(--color-text) !important;
}

#navbar .ui.dropdown .menu .item:hover,
#navbar .ui.dropdown .menu .item:focus-visible {
	color: var(--color-text) !important;
	background: var(--color-hover) !important;
}

#navbar-logo {
	padding-top: 8px;
	padding-bottom: 8px;
}

#navbar-logo img {
	content: url("../img/logo.svg?v=20260901-4");
	width: 36px;
	height: 36px;
	filter: drop-shadow(0 0 9px var(--yqm-accent-36));
}

#navbar .yqm-official-link {
	position: relative;
	margin-left: 4px;
}

#navbar .yqm-official-link::after {
	content: "↗";
	margin-left: 6px;
	color: var(--yqm-cyan-bright);
	font-size: 0.78em;
}

.page-content.yqm-home {
	max-width: none;
	margin: 0;
	padding: 0 !important;
	background: var(--yqm-ink);
	color: var(--yqm-white);
	overflow: hidden;
}

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

.yqm-shell {
	position: relative;
	z-index: 2;
	width: min(100% - 64px, 1240px);
	margin: 0 auto;
}

.yqm-hero {
	position: relative;
	min-height: 720px;
	padding: clamp(72px, 9vw, 118px) 0 76px;
	background:
		radial-gradient(circle at 77% 35%, var(--yqm-accent-18), transparent 27%),
		radial-gradient(circle at 8% 4%, light-dark(rgba(8, 125, 145, 0.09), rgba(92, 166, 186, 0.14)), transparent 30%),
		linear-gradient(135deg, light-dark(#f8fbfc, #07141b) 0%, light-dark(#e8f3f6, #0a1a22) 54%, light-dark(#f1f7f9, #071219) 100%);
}

.yqm-hero::after {
	content: "";
	position: absolute;
	inset: auto 0 0;
	height: 200px;
	background: linear-gradient(to bottom, transparent, light-dark(rgba(230, 241, 244, 0.62), rgba(3, 11, 15, 0.54)));
	pointer-events: none;
}

.yqm-hero-grid {
	position: absolute;
	inset: 0;
	opacity: 0.26;
	background-image:
		linear-gradient(light-dark(rgba(36, 111, 125, 0.1), rgba(103, 177, 191, 0.12)) 1px, transparent 1px),
		linear-gradient(90deg, light-dark(rgba(36, 111, 125, 0.1), rgba(103, 177, 191, 0.12)) 1px, transparent 1px);
	background-size: 72px 72px;
	-webkit-mask-image: linear-gradient(to right, rgba(0, 0, 0, 0.8), transparent 78%);
	mask-image: linear-gradient(to right, rgba(0, 0, 0, 0.8), transparent 78%);
	pointer-events: none;
}

.yqm-hero-layout {
	display: grid;
	grid-template-columns: minmax(0, 1.08fr) minmax(390px, 0.92fr);
	gap: clamp(48px, 7vw, 104px);
	align-items: center;
}

.yqm-kicker {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0 0 28px;
	color: var(--yqm-cyan-bright);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.23em;
	text-transform: uppercase;
}

.yqm-kicker::before {
	content: "";
	width: 34px;
	height: 1px;
	background: currentColor;
}

.yqm-kicker span {
	color: light-dark(rgba(61, 86, 96, 0.68), rgba(166, 185, 193, 0.64));
	font-variant-numeric: tabular-nums;
}

.yqm-hero h1 {
	max-width: 800px;
	margin: 0;
	color: var(--yqm-white);
	font-size: clamp(50px, 5.7vw, 78px);
	font-weight: 760;
	letter-spacing: -0.065em;
	line-height: 1.04;
	text-wrap: balance;
}

.yqm-hero h1 em {
	color: var(--yqm-cyan-bright);
	font-style: normal;
}

.yqm-hero-tagline {
	max-width: 700px;
	margin: 22px 0 0;
	color: var(--yqm-white);
	font-size: clamp(26px, 3vw, 40px);
	font-weight: 680;
	letter-spacing: -0.045em;
	line-height: 1.22;
	text-wrap: balance;
}

.yqm-hero-tagline em {
	color: var(--yqm-cyan-bright);
	font-style: normal;
}

.yqm-lead {
	max-width: 690px;
	margin: 24px 0 0;
	color: var(--yqm-copy);
	font-size: clamp(16px, 1.45vw, 19px);
	line-height: 1.85;
}

.yqm-hero-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	margin-top: 38px;
}

.yqm-button {
	display: inline-flex;
	min-width: 136px;
	min-height: 48px;
	align-items: center;
	justify-content: center;
	padding: 0 24px;
	border: 1px solid transparent;
	border-radius: 4px;
	font-weight: 700;
	line-height: 1;
	transition: transform 160ms ease, border-color 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

.yqm-button:hover {
	transform: translateY(-2px);
	text-decoration: none;
}

.yqm-button-primary {
	background: var(--yqm-cyan-bright);
	color: var(--yqm-on-accent) !important;
	box-shadow: 0 12px 30px var(--yqm-accent-18);
}

.yqm-button-primary:hover {
	background: var(--yqm-cyan-bright);
	box-shadow: 0 16px 36px var(--yqm-accent-28);
	filter: brightness(1.08);
}

.yqm-button-secondary {
	border-color: light-dark(rgba(17, 76, 90, 0.3), rgba(211, 234, 239, 0.32));
	background: light-dark(rgba(255, 255, 255, 0.64), rgba(255, 255, 255, 0.025));
	color: var(--yqm-white) !important;
}

.yqm-button-secondary:hover {
	border-color: var(--yqm-accent-72);
	background: var(--yqm-accent-08);
}

.yqm-home a:focus-visible {
	outline: 3px solid var(--yqm-accent-48);
	outline-offset: 3px;
}

.yqm-hero-facts {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 0;
	max-width: 720px;
	margin: 54px 0 0;
	padding: 23px 0 0;
	border-top: 1px solid var(--yqm-line);
}

.yqm-hero-facts div {
	padding-right: 18px;
}

.yqm-hero-facts dt {
	margin-bottom: 7px;
	color: var(--yqm-white);
	font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.12em;
}

.yqm-hero-facts dd {
	margin: 0;
	color: var(--yqm-subtle);
	font-size: 13px;
}

.yqm-hero-visual {
	position: relative;
	display: flex;
	min-height: 650px;
	flex-direction: column;
	align-items: flex-end;
	justify-content: flex-start;
	gap: 18px;
}

.yqm-mark-stage {
	position: relative;
	width: min(100%, 420px);
	flex: 0 0 auto;
	aspect-ratio: 1;
}

.yqm-mark-stage::before,
.yqm-mark-stage::after {
	content: "";
	position: absolute;
	border: 1px solid var(--yqm-accent-16);
	border-radius: 50%;
	inset: 5%;
	animation: yqm-orbit 18s linear infinite;
}

.yqm-mark-stage::after {
	inset: 15%;
	border-color: var(--yqm-accent-08);
	animation-direction: reverse;
	animation-duration: 24s;
}

.yqm-mark-halo {
	position: absolute;
	inset: 16%;
	border-radius: 42%;
	background: radial-gradient(circle, var(--yqm-accent-26), var(--yqm-accent-05) 52%, transparent 72%);
	filter: blur(22px);
}

.yqm-source-icon {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 68%;
	height: 68%;
	object-fit: cover;
	border: 1px solid rgba(255, 255, 255, 0.74);
	border-radius: 29%;
	background: #ffffff;
	box-shadow: 0 36px 90px light-dark(rgba(22, 62, 72, 0.2), rgba(0, 0, 0, 0.42)), 0 0 44px var(--yqm-accent-13);
	transform: translate(-50%, -50%) rotate(-2deg);
}

.yqm-code-card {
	position: relative;
	width: min(90%, 380px);
	margin-right: 4%;
	border: 1px solid light-dark(rgba(44, 101, 114, 0.24), rgba(151, 209, 220, 0.2));
	border-radius: 12px;
	background: light-dark(rgba(247, 251, 252, 0.95), rgba(6, 19, 25, 0.9));
	box-shadow: 0 24px 70px light-dark(rgba(38, 82, 93, 0.2), rgba(0, 0, 0, 0.42));
	backdrop-filter: blur(18px);
	overflow: hidden;
}

.yqm-code-card-head {
	display: flex;
	align-items: center;
	gap: 14px;
	height: 44px;
	padding: 0 17px;
	border-bottom: 1px solid light-dark(rgba(44, 101, 114, 0.18), rgba(151, 209, 220, 0.13));
	background: light-dark(rgba(224, 238, 242, 0.56), transparent);
	color: light-dark(#45636e, #91aab4);
	font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
	font-size: 12px;
	font-weight: 550;
}

.yqm-window-dots {
	display: inline-flex;
	gap: 5px;
}

.yqm-window-dots i {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--color-diff-removed-fg, #49616a);
}

.yqm-window-dots i:nth-child(2) {
	background: var(--yqm-cyan);
}

.yqm-window-dots i:nth-child(3) {
	background: var(--color-diff-added-fg, var(--yqm-cyan));
}

.yqm-code-lines {
	padding: 17px 20px 13px;
}

.yqm-code-lines p {
	display: flex;
	gap: 18px;
	margin: 0 0 10px;
	font-size: 13px;
	line-height: 1.45;
}

.yqm-code-lines p > span {
	color: light-dark(#718992, #435b64);
	font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}

.yqm-code-lines code {
	padding: 0;
	background: transparent;
	color: light-dark(#294650, #b7c8ce);
	font-size: inherit;
}

.yqm-code-lines code b {
	color: var(--yqm-cyan-bright);
	font-weight: 700;
}

.yqm-code-status {
	display: flex;
	align-items: center;
	gap: 9px;
	padding: 12px 20px;
	border-top: 1px solid light-dark(rgba(44, 101, 114, 0.18), rgba(151, 209, 220, 0.13));
	background: light-dark(var(--yqm-accent-08), var(--yqm-accent-05));
	color: light-dark(#365660, #b9d7dd);
	font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
	font-size: 12px;
	font-weight: 550;
}

.yqm-code-status i {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--color-diff-added-fg, var(--yqm-cyan-bright));
	box-shadow: 0 0 12px var(--yqm-accent-48);
}

.yqm-capabilities {
	padding: 96px 0 110px;
	border-top: 1px solid var(--yqm-line);
	background: var(--yqm-section-bg);
}

.yqm-section-heading {
	display: grid;
	grid-template-columns: minmax(280px, 0.92fr) minmax(320px, 0.72fr);
	column-gap: clamp(48px, 8vw, 120px);
	align-items: end;
}

.yqm-section-heading .yqm-kicker {
	grid-column: 1 / -1;
	margin-bottom: 24px;
}

.yqm-section-heading h2 {
	margin: 0;
	color: var(--yqm-white);
	font-size: clamp(34px, 4vw, 54px);
	font-weight: 720;
	letter-spacing: -0.045em;
	line-height: 1.16;
}

.yqm-section-heading > p:last-child {
	margin: 0 0 5px;
	color: var(--yqm-muted);
	font-size: 16px;
	line-height: 1.8;
}

.yqm-capability-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1px;
	margin-top: 58px;
	border: 1px solid var(--yqm-line);
	background: var(--yqm-line);
}

.yqm-capability-grid article {
	position: relative;
	min-height: 310px;
	padding: 34px 32px 30px;
	background: var(--yqm-card-bg);
	transition: background 180ms ease, transform 180ms ease;
}

.yqm-capability-grid article:hover {
	z-index: 1;
	background: var(--yqm-card-hover);
	transform: translateY(-4px);
}

.yqm-card-index {
	display: block;
	margin-bottom: 54px;
	color: var(--yqm-cyan-bright);
	font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
	font-size: 12px;
	letter-spacing: 0.12em;
}

.yqm-capability-grid h3 {
	margin: 0 0 16px;
	color: var(--yqm-white);
	font-size: 22px;
	font-weight: 680;
}

.yqm-capability-grid p {
	margin: 0;
	color: var(--yqm-card-copy);
	font-size: 14px;
	line-height: 1.8;
}

.yqm-capability-grid ul {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 24px 0 0;
	padding: 0;
	list-style: none;
}

.yqm-capability-grid li {
	padding: 5px 9px;
	border: 1px solid var(--yqm-accent-14);
	border-radius: 2px;
	color: var(--yqm-chip-text);
	font-size: 11px;
}

.page-footer {
	background: var(--yqm-footer-bg);
	border-top: 1px solid var(--yqm-accent-14);
	color: var(--yqm-footer-text);
}

.page-footer a,
.page-footer .right-links > * {
	color: var(--yqm-footer-link);
}

.page-footer a:hover,
.page-footer a:focus-visible {
	color: var(--yqm-cyan-bright);
}

.page-footer .yqm-icp-link {
	color: var(--yqm-footer-link);
}

@keyframes yqm-orbit {
	to {
		transform: rotate(360deg);
	}
}

@media (max-width: 980px) {
	.yqm-shell {
		width: min(100% - 48px, 760px);
	}

	.yqm-hero {
		padding-top: 74px;
	}

	.yqm-hero-layout {
		grid-template-columns: 1fr;
		gap: 50px;
	}

	.yqm-hero-copy {
		max-width: 760px;
	}

	.yqm-hero-visual {
		min-height: 0;
		align-items: center;
	}

	.yqm-mark-stage {
		width: min(100%, 420px);
	}

	.yqm-code-card {
		margin-right: 0;
	}

	.yqm-section-heading {
		grid-template-columns: 1fr;
		gap: 24px;
	}

	.yqm-capability-grid {
		grid-template-columns: 1fr;
	}

	.yqm-capability-grid article {
		min-height: 0;
	}

	.yqm-card-index {
		margin-bottom: 34px;
	}
}

@media (max-width: 700px) {
	#navbar {
		min-height: 52px;
	}

	#navbar-logo img {
		width: 32px;
		height: 32px;
	}

	.yqm-shell {
		width: min(100% - 32px, 620px);
	}

	.yqm-hero {
		min-height: auto;
		padding: 58px 0 56px;
	}

	.yqm-hero h1 {
		font-size: clamp(36px, 11.3vw, 46px);
		letter-spacing: -0.06em;
	}

	.yqm-lead {
		margin-top: 20px;
		line-height: 1.72;
	}

	.yqm-hero-tagline {
		margin-top: 18px;
		font-size: clamp(25px, 7.4vw, 31px);
		line-height: 1.28;
	}

	.yqm-hero-actions {
		margin-top: 30px;
	}

	.yqm-button {
		flex: 1 1 140px;
	}

	.yqm-hero-facts {
		grid-template-columns: 1fr;
		gap: 18px;
		margin-top: 42px;
	}

	.yqm-hero-facts div {
		display: flex;
		align-items: baseline;
		justify-content: space-between;
		gap: 18px;
		padding: 0 0 14px;
		border-bottom: 1px solid color-mix(in srgb, var(--yqm-line) 44%, transparent);
	}

	.yqm-hero-facts dt {
		margin: 0;
	}

	.yqm-hero-visual {
		min-height: 0;
		gap: 14px;
	}

	.yqm-mark-stage {
		width: min(100%, 390px);
	}

	.yqm-code-card {
		width: 100%;
	}

	.yqm-capabilities {
		padding: 72px 0 78px;
	}

	.yqm-section-heading h2 {
		font-size: clamp(32px, 10vw, 44px);
	}

	.yqm-capability-grid {
		margin-top: 40px;
	}

	.yqm-capability-grid article {
		padding: 28px 24px;
	}

	.yqm-card-index {
		margin-bottom: 24px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.yqm-mark-stage::before,
	.yqm-mark-stage::after {
		animation: none;
	}

	.yqm-button,
	.yqm-capability-grid article {
		transition: none;
	}
}