/* Commit Sky — Gitea homepage.
 * One design for both themes: identical structure, shapes and motion; only the
 * palette follows the active Gitea theme (via color-scheme / light-dark()).
 * Light is a dawn sky, dark is night — same stars, same clusters, same layout.
 * Everything is namespaced under .commit-sky or --cs-*.
 */

:root {
	--cs-bg: #e9edf6;
	--cs-surface: #f5f7fc;
	--cs-surface-2: #dfe4f0;
	--cs-line: #c9d1e3;
	--cs-text: #161d33;
	--cs-muted: #4b5570;
	--cs-faint: #6c7691;
	--cs-accent: #3b4d8f;
	--cs-on-accent: #f7f8fc;
	--cs-focus: #2f4a9e;
	--cs-sky-top: #dbe3f4;
	--cs-sky-bottom: #eef1f9;
	--cs-ground: #d3dae9;
	--cs-bg-star: #5f6a8c;
	--cs-star-bright: #b9791a;
	--cs-star-glow: #3d4f95;
	--cs-star-dim: #8a93ad;
	--cs-glow-bright: #e2a93a;
	--cs-glow-glow: #6b7fc9;
	--cs-glow-dim: #9aa3bd;
	--cs-shadow: 0 18px 40px -24px rgb(22 29 51 / 0.45);
}

@supports (color: light-dark(#000, #fff)) {
	:root {
		--cs-bg: light-dark(#e9edf6, #0b1020);
		--cs-surface: light-dark(#f5f7fc, #121830);
		--cs-surface-2: light-dark(#dfe4f0, #171f3a);
		--cs-line: light-dark(#c9d1e3, #26304f);
		--cs-text: light-dark(#161d33, #e5e9f7);
		--cs-muted: light-dark(#4b5570, #a5adc6);
		--cs-faint: light-dark(#6c7691, #7f88a6);
		--cs-accent: light-dark(#3b4d8f, #a9b8ff);
		--cs-on-accent: light-dark(#f7f8fc, #0b1020);
		--cs-focus: light-dark(#2f4a9e, #c7d2ff);
		--cs-sky-top: light-dark(#dbe3f4, #070b18);
		--cs-sky-bottom: light-dark(#eef1f9, #121a3d);
		--cs-ground: light-dark(#d3dae9, #101733);
		--cs-bg-star: light-dark(#5f6a8c, #c9d2f2);
		--cs-star-bright: light-dark(#b9791a, #ffe2a1);
		--cs-star-glow: light-dark(#3d4f95, #dfe6ff);
		--cs-star-dim: light-dark(#8a93ad, #6f7a9c);
		--cs-glow-bright: light-dark(#e2a93a, #ffcf6e);
		--cs-glow-glow: light-dark(#6b7fc9, #8fa3ff);
		--cs-glow-dim: light-dark(#9aa3bd, #4d5a85);
		--cs-shadow: light-dark(0 18px 40px -24px rgb(22 29 51 / 0.45), 0 18px 40px -24px rgb(0 0 0 / 0.8));
	}
}

/* Browsers without light-dark(): follow the Gitea theme name instead. */
@supports not (color: light-dark(#000, #fff)) {
	html[data-theme^="gitea-dark"] {
		--cs-bg: #0b1020;
		--cs-surface: #121830;
		--cs-surface-2: #171f3a;
		--cs-line: #26304f;
		--cs-text: #e5e9f7;
		--cs-muted: #a5adc6;
		--cs-faint: #7f88a6;
		--cs-accent: #a9b8ff;
		--cs-on-accent: #0b1020;
		--cs-focus: #c7d2ff;
		--cs-sky-top: #070b18;
		--cs-sky-bottom: #121a3d;
		--cs-ground: #101733;
		--cs-bg-star: #c9d2f2;
		--cs-star-bright: #ffe2a1;
		--cs-star-glow: #dfe6ff;
		--cs-star-dim: #6f7a9c;
		--cs-glow-bright: #ffcf6e;
		--cs-glow-glow: #8fa3ff;
		--cs-glow-dim: #4d5a85;
		--cs-shadow: 0 18px 40px -24px rgb(0 0 0 / 0.8);
	}

	@media (prefers-color-scheme: dark) {
		html[data-theme^="gitea-auto"] {
			--cs-bg: #0b1020;
			--cs-surface: #121830;
			--cs-surface-2: #171f3a;
			--cs-line: #26304f;
			--cs-text: #e5e9f7;
			--cs-muted: #a5adc6;
			--cs-faint: #7f88a6;
			--cs-accent: #a9b8ff;
			--cs-on-accent: #0b1020;
			--cs-focus: #c7d2ff;
			--cs-sky-top: #070b18;
			--cs-sky-bottom: #121a3d;
			--cs-ground: #101733;
			--cs-bg-star: #c9d2f2;
			--cs-star-bright: #ffe2a1;
			--cs-star-glow: #dfe6ff;
			--cs-star-dim: #6f7a9c;
			--cs-glow-bright: #ffcf6e;
			--cs-glow-glow: #8fa3ff;
			--cs-glow-dim: #4d5a85;
			--cs-shadow: 0 18px 40px -24px rgb(0 0 0 / 0.8);
		}
	}
}

/* ------------------------------------------------------------------ page */

.full.height:has(> .commit-sky) {
	background: var(--cs-bg);
}

.commit-sky {
	--cs-radius: 16px;
	--cs-sans: ui-sans-serif, system-ui, -apple-system, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", "Source Han Sans SC", sans-serif;
	--cs-mono: ui-monospace, "SFMono-Regular", "Cascadia Mono", Menlo, Consolas, "Liberation Mono", monospace;
	margin: 0 0 calc(-1 * var(--page-space-bottom, 80px));
	padding: clamp(28px, 4vw, 56px) clamp(18px, 4vw, 56px) calc(56px + var(--page-space-bottom, 80px));
	background: var(--cs-bg);
	color: var(--cs-text);
	font-family: var(--cs-sans);
	font-size: 15px;
	line-height: 1.55;
	-webkit-font-smoothing: antialiased;
}

.commit-sky,
.commit-sky * {
	box-sizing: border-box;
}

.commit-sky a {
	color: inherit;
}

.commit-sky a:hover {
	text-decoration: none;
}

.commit-sky :is(a, button):focus-visible {
	outline: 3px solid var(--cs-focus);
	outline-offset: 3px;
	border-radius: 6px;
}

.cs-page {
	width: min(1240px, 100%);
	margin: 0 auto;
}

.cs-visually-hidden {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

.cs-section-label {
	margin: 0 0 8px;
	color: var(--cs-faint);
	font-family: var(--cs-mono);
	font-size: 12px;
	letter-spacing: 0.06em;
}

/* ------------------------------------------------------------------ hero */

.cs-hero {
	display: grid;
	grid-template-columns: minmax(0, 1.2fr) minmax(300px, 0.8fr);
	align-items: end;
	gap: clamp(28px, 4vw, 64px);
	margin-bottom: clamp(28px, 4vw, 44px);
}

.cs-copy {
	max-width: 620px;
	min-width: 0;
}

.cs-eyebrow {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 18px;
	color: var(--cs-accent);
	font-family: var(--cs-mono);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
}

.cs-eyebrow-mark {
	position: relative;
	width: 18px;
	height: 18px;
	flex: none;
}

.cs-eyebrow-mark::before {
	position: absolute;
	top: 4px;
	left: 4px;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: var(--cs-star-bright);
	box-shadow: 0 0 0 4px color-mix(in srgb, var(--cs-glow-bright) 26%, transparent);
	content: "";
}

.cs-eyebrow-mark::after {
	position: absolute;
	top: 0;
	right: 0;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: var(--cs-star-glow);
	box-shadow: -14px 13px 0 -1px var(--cs-star-dim);
	content: "";
}

.commit-sky .cs-copy h1 {
	margin: 0;
	color: var(--cs-text);
	font-family: var(--cs-sans);
	font-size: clamp(36px, 5vw, 62px);
	font-weight: 600;
	letter-spacing: 0.005em;
	line-height: 1.2;
	text-wrap: balance;
}

.cs-intro {
	max-width: 34em;
	margin: 20px 0 0;
	color: var(--cs-muted);
	font-size: clamp(15px, 1.35vw, 17px);
	line-height: 1.75;
}

.cs-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 30px;
}

.commit-sky .cs-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 46px;
	padding: 0 22px;
	border: 1px solid transparent;
	border-radius: 12px;
	font-size: 15px;
	font-weight: 600;
	line-height: 1;
	text-decoration: none;
	white-space: nowrap;
	transition: transform 180ms cubic-bezier(0.16, 1, 0.3, 1), background-color 180ms ease, border-color 180ms ease;
}

.commit-sky .cs-button:hover {
	transform: translateY(-1px);
}

.commit-sky .cs-button:active {
	transform: translateY(1px);
}

.commit-sky .cs-button-primary {
	background: var(--cs-accent);
	color: var(--cs-on-accent);
}

.commit-sky .cs-button-primary:hover {
	background: color-mix(in srgb, var(--cs-accent) 88%, var(--cs-text));
	color: var(--cs-on-accent);
}

.commit-sky .cs-button-secondary {
	border-color: var(--cs-line);
	background: var(--cs-surface);
	color: var(--cs-text);
}

.commit-sky .cs-button-secondary:hover {
	border-color: var(--cs-accent);
	color: var(--cs-text);
}

/* Overview card */

.cs-overview {
	position: relative;
	min-width: 0;
	padding: 22px 24px 20px;
	border: 1px solid var(--cs-line);
	border-radius: var(--cs-radius);
	background: var(--cs-surface);
	box-shadow: var(--cs-shadow);
}

.cs-overview-label {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 14px;
	color: var(--cs-faint);
	font-family: var(--cs-mono);
	font-size: 12px;
	letter-spacing: 0.06em;
}

.cs-overview-label::before {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--cs-star-bright);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--cs-glow-bright) 26%, transparent);
	content: "";
}

.cs-overview-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px 20px;
	margin: 0;
}

.cs-overview-item {
	min-width: 0;
}

.cs-overview-count {
	grid-column: 1 / -1;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--cs-line);
}

.cs-overview-item dt {
	margin: 0 0 3px;
	color: var(--cs-faint);
	font-family: var(--cs-mono);
	font-size: 11px;
	letter-spacing: 0.06em;
}

.cs-overview-item dd {
	margin: 0;
	overflow: hidden;
	color: var(--cs-text);
	font-size: 14px;
	font-weight: 500;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.cs-overview-count dd {
	display: flex;
	align-items: baseline;
	gap: 8px;
}

.cs-overview-count strong {
	font-family: var(--cs-mono);
	font-size: clamp(34px, 3.4vw, 46px);
	font-weight: 600;
	letter-spacing: -0.02em;
	line-height: 1;
}

.cs-overview-unit {
	color: var(--cs-muted);
	font-size: 14px;
}

.commit-sky .cs-overview-item a {
	color: var(--cs-accent);
	font-weight: 600;
	text-decoration: none;
}

.commit-sky .cs-overview-item a:hover,
.commit-sky .cs-overview-item a.is-active {
	text-decoration: underline;
}

.cs-overview-item time {
	color: var(--cs-muted);
	font-weight: 400;
}

/* ------------------------------------------------------------------ scene */

.cs-scene-section {
	margin-bottom: clamp(32px, 4vw, 52px);
}

.cs-scene-wrap {
	position: relative;
	height: clamp(320px, 34vw, 460px);
	border: 1px solid var(--cs-line);
	border-radius: var(--cs-radius);
	background:
		radial-gradient(120% 70% at 50% 100%, color-mix(in srgb, var(--cs-glow-bright) 12%, transparent), transparent 60%),
		linear-gradient(180deg, var(--cs-sky-top), var(--cs-sky-bottom));
}

.cs-scene {
	display: block;
	width: 100%;
	height: 100%;
	overflow: hidden;
	border-radius: var(--cs-radius);
	clip-path: inset(0 round var(--cs-radius));
}

.cs-grad-bright stop:nth-child(1) { stop-color: var(--cs-glow-bright); stop-opacity: 0.55; }
.cs-grad-bright stop:nth-child(2) { stop-color: var(--cs-glow-bright); stop-opacity: 0.16; }
.cs-grad-bright stop:nth-child(3) { stop-color: var(--cs-glow-bright); stop-opacity: 0; }
.cs-grad-glow stop:nth-child(1) { stop-color: var(--cs-glow-glow); stop-opacity: 0.45; }
.cs-grad-glow stop:nth-child(2) { stop-color: var(--cs-glow-glow); stop-opacity: 0.12; }
.cs-grad-glow stop:nth-child(3) { stop-color: var(--cs-glow-glow); stop-opacity: 0; }
.cs-grad-dim stop:nth-child(1) { stop-color: var(--cs-glow-dim); stop-opacity: 0.3; }
.cs-grad-dim stop:nth-child(2) { stop-color: var(--cs-glow-dim); stop-opacity: 0.08; }
.cs-grad-dim stop:nth-child(3) { stop-color: var(--cs-glow-dim); stop-opacity: 0; }

.cs-bg-star {
	fill: var(--cs-bg-star);
}

.cs-ground {
	fill: var(--cs-ground);
	stroke: var(--cs-line);
	stroke-width: 1;
}

.cs-waiting-star {
	fill: none;
	stroke: var(--cs-star-bright);
	stroke-dasharray: 3 4;
	stroke-width: 1.5;
	opacity: 0.8;
}

.cs-waiting-core {
	fill: var(--cs-star-bright);
}

/* One cluster = one repository. --b is its brightness in [0.15, 1]. */

.cs-cluster,
.commit-sky .cs-cluster:focus-visible {
	cursor: pointer;
	outline: none;
	transform-box: view-box;
	--cs-star: var(--cs-star-glow);
	--cs-glow: var(--cs-glow-glow);
}

.cs-cluster.is-bright {
	--cs-star: var(--cs-star-bright);
	--cs-glow: var(--cs-glow-bright);
}

.cs-cluster.is-dim {
	--cs-star: var(--cs-star-dim);
	--cs-glow: var(--cs-glow-dim);
}

.cs-hit {
	fill: transparent;
	pointer-events: all;
}

.cs-glow {
	opacity: calc(0.35 + 0.65 * var(--b, 0.5));
	transform-box: fill-box;
	transform-origin: center;
	transition: transform 260ms cubic-bezier(0.16, 1, 0.3, 1), opacity 220ms ease;
}

.cs-stars circle,
.cs-dust circle {
	fill: var(--cs-star);
	transition: fill 160ms ease;
}

.cs-dust {
	opacity: calc(0.3 + 0.5 * var(--b, 0.5));
}

.cs-stars {
	opacity: calc(0.45 + 0.55 * var(--b, 0.5));
}

.cs-core-halo {
	fill: var(--cs-glow);
	opacity: calc(0.12 + 0.3 * var(--b, 0.5));
	transform-box: fill-box;
	transform-origin: center;
	transition: transform 220ms cubic-bezier(0.16, 1, 0.3, 1), opacity 220ms ease;
}

.cs-core {
	fill: var(--cs-star);
	stroke: var(--cs-sky-bottom);
	stroke-width: 1.2;
	opacity: calc(0.6 + 0.4 * var(--b, 0.5));
	transition: fill 160ms ease;
}

.cs-label {
	fill: var(--cs-text);
	font-family: var(--cs-mono);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.02em;
	opacity: calc(0.55 + 0.45 * var(--b, 0.5));
	paint-order: stroke;
	stroke: var(--cs-sky-bottom);
	stroke-linejoin: round;
	stroke-width: 4px;
	pointer-events: none;
	transition: opacity 160ms ease, fill 160ms ease;
}

.cs-focus-ring {
	fill: none;
	stroke: var(--cs-focus);
	stroke-dasharray: 3 3;
	stroke-width: 1.5;
	opacity: 0;
	transition: opacity 120ms ease;
}

.cs-cluster.is-active .cs-glow {
	opacity: 1;
	transform: scale(1.18);
}

.cs-cluster.is-active .cs-core-halo {
	opacity: 0.55;
	transform: scale(1.5);
}

.cs-cluster.is-active .cs-stars,
.cs-cluster.is-active .cs-core,
.cs-cluster.is-active .cs-label {
	opacity: 1;
}

.cs-cluster.is-active .cs-label {
	fill: var(--cs-accent);
}

.cs-cluster:focus-visible .cs-focus-ring {
	opacity: 1;
}

.cs-tip {
	position: absolute;
	z-index: 3;
	display: grid;
	gap: 3px;
	max-width: min(320px, calc(100% - 16px));
	padding: 9px 12px 10px;
	border: 1px solid var(--cs-line);
	border-radius: 10px;
	background: var(--cs-surface);
	color: var(--cs-text);
	font-size: 12.5px;
	line-height: 1.4;
	transform: translate(-50%, -100%);
	pointer-events: none;
	box-shadow: 0 12px 30px -12px rgb(0 0 0 / 0.45);
}

.cs-tip[hidden] {
	display: none;
}

.cs-tip::after {
	position: absolute;
	top: 100%;
	left: calc(50% + var(--tip-arrow, 0px));
	border: 6px solid transparent;
	border-top-color: var(--cs-line);
	transform: translateX(-50%);
	content: "";
}

.cs-tip.is-below {
	transform: translate(-50%, 0);
}

.cs-tip.is-below::after {
	top: auto;
	bottom: 100%;
	border-top-color: transparent;
	border-bottom-color: var(--cs-line);
}

.cs-tip-name {
	font-family: var(--cs-mono);
	font-size: 12.5px;
	font-weight: 700;
	overflow-wrap: anywhere;
}

.cs-tip-desc {
	font-weight: 500;
	overflow-wrap: anywhere;
}

.cs-tip-desc[hidden] {
	display: none;
}

.cs-tip-meta {
	color: var(--cs-muted);
}

.cs-tip-level {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	justify-self: start;
	margin-top: 3px;
	color: var(--cs-muted);
	font-family: var(--cs-mono);
	font-size: 11px;
	letter-spacing: 0.06em;
}

.cs-tip-level::before {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--cs-star-glow);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--cs-glow-glow) 26%, transparent);
	content: "";
}

.cs-tip.is-bright .cs-tip-level::before {
	background: var(--cs-star-bright);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--cs-glow-bright) 30%, transparent);
}

.cs-tip.is-dim .cs-tip-level::before {
	background: var(--cs-star-dim);
	box-shadow: none;
}

.cs-scene-state {
	position: absolute;
	inset: 0 auto auto 50%;
	top: 42%;
	max-width: calc(100% - 40px);
	margin: 0;
	padding: 8px 14px;
	border: 1px solid var(--cs-line);
	border-radius: 999px;
	background: var(--cs-surface);
	color: var(--cs-muted);
	font-size: 13px;
	text-align: center;
	transform: translate(-50%, -50%);
}

.commit-sky[data-state="empty"] .cs-scene-state {
	top: 62%;
}

.cs-scene-state:empty {
	display: none;
}

.cs-scene-caption {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 8px 24px;
	margin-top: 12px;
	padding: 0 6px;
	color: var(--cs-faint);
	font-size: 12.5px;
}

.cs-scene-count {
	margin: 0;
	font-family: var(--cs-mono);
	letter-spacing: 0.02em;
}

.commit-sky .cs-scene-more {
	color: var(--cs-accent);
	font-size: 13px;
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
}

.commit-sky .cs-scene-more:hover {
	text-decoration: underline;
}

/* ------------------------------------------------------------------ index */

.cs-index {
	min-width: 0;
}

.cs-index-heading {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 16px;
	padding: 0 4px;
}

.cs-repo-list {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 360px), 1fr));
	gap: 12px;
	margin: 6px 0 0;
	padding: 0;
	list-style: none;
}

.cs-repo-item {
	min-width: 0;
}

.cs-repo-placeholder {
	grid-column: 1 / -1;
	padding: 18px 8px;
	color: var(--cs-faint);
	font-size: 14px;
}

.commit-sky .cs-repo-row {
	--cs-star: var(--cs-star-glow);
	--cs-glow: var(--cs-glow-glow);
	position: relative;
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: 14px;
	height: 100%;
	padding: 14px 16px 14px 14px;
	border: 1px solid var(--cs-line);
	border-radius: 12px;
	background: var(--cs-surface);
	color: var(--cs-text);
	text-decoration: none;
	transition: border-color 160ms ease, background-color 160ms ease, transform 180ms cubic-bezier(0.16, 1, 0.3, 1);
}

.commit-sky .cs-repo-row.is-bright {
	--cs-star: var(--cs-star-bright);
	--cs-glow: var(--cs-glow-bright);
}

.commit-sky .cs-repo-row.is-dim {
	--cs-star: var(--cs-star-dim);
	--cs-glow: var(--cs-glow-dim);
}

.commit-sky .cs-repo-row:hover,
.commit-sky .cs-repo-row.is-active {
	border-color: var(--cs-accent);
	background: color-mix(in srgb, var(--cs-accent) 7%, var(--cs-surface));
	transform: translateY(-1px);
}

.cs-repo-dot {
	position: relative;
	width: 14px;
	height: 14px;
	margin-top: 4px;
	border-radius: 50%;
	background: var(--cs-star);
	box-shadow: 0 0 0 4px color-mix(in srgb, var(--cs-glow) 26%, transparent);
	transition: transform 200ms cubic-bezier(0.16, 1, 0.3, 1);
}

.cs-repo-row.is-dim .cs-repo-dot {
	opacity: 0.7;
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--cs-glow) 14%, transparent);
}

.commit-sky .cs-repo-row:hover .cs-repo-dot,
.commit-sky .cs-repo-row.is-active .cs-repo-dot {
	transform: scale(1.15);
}

.cs-repo-body {
	display: grid;
	gap: 4px;
	min-width: 0;
}

.cs-repo-title {
	font-size: 15px;
	line-height: 1.35;
	overflow-wrap: anywhere;
}

.cs-repo-owner {
	color: var(--cs-faint);
	font-weight: 500;
}

.cs-repo-name {
	font-weight: 700;
}

.cs-repo-desc {
	display: -webkit-box;
	overflow: hidden;
	color: var(--cs-muted);
	font-size: 13.5px;
	line-height: 1.5;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow-wrap: anywhere;
}

.cs-repo-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 12px;
	margin-top: 2px;
	color: var(--cs-faint);
	font-size: 12px;
	line-height: 1.5;
}

.cs-repo-level {
	padding: 0 7px;
	border-radius: 999px;
	background: color-mix(in srgb, var(--cs-glow) 18%, transparent);
	color: var(--cs-text);
	font-family: var(--cs-mono);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.06em;
	line-height: 18px;
}

/* ------------------------------------------------------------------ footer */
/* Only on the homepage: the global Gitea footer takes the sky palette and
 * lines up with the page column. Content (theme / language / Licenses / API /
 * ICP) is untouched. */

body:has(> .full.height > .commit-sky) > .page-footer {
	--cs-sans: ui-sans-serif, system-ui, -apple-system, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", "Source Han Sans SC", sans-serif;
	align-items: center;
	gap: 10px 24px;
	padding: 18px max(clamp(18px, 4vw, 56px), calc((100% - 1240px) / 2)) 22px;
	border-top: 1px solid var(--cs-line);
	background: var(--cs-bg);
	color: var(--cs-faint);
	font-family: var(--cs-sans);
	font-size: 12.5px;
	line-height: 1.5;
}

/* "Powered by Gitea / version / page timing" is noise on a landing page. */
body:has(> .full.height > .commit-sky) > .page-footer .left-links {
	display: none;
}

body:has(> .full.height > .commit-sky) > .page-footer .right-links {
	min-width: 0;
	justify-content: flex-start;
	gap: 6px 18px;
}

body:has(> .full.height > .commit-sky) > .page-footer .right-links::before {
	width: 8px;
	height: 8px;
	margin-right: 6px;
	border-radius: 50%;
	background: var(--cs-star-bright);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--cs-glow-bright) 26%, transparent);
	content: "";
}

body:has(> .full.height > .commit-sky) > .page-footer .right-links > a {
	padding-left: 18px;
	border-left-color: var(--cs-line);
}

body:has(> .full.height > .commit-sky) > .page-footer a,
body:has(> .full.height > .commit-sky) > .page-footer .ui.dropdown > .default-text,
body:has(> .full.height > .commit-sky) > .page-footer .ui.dropdown > .flex-text-inline {
	color: var(--cs-muted);
	text-decoration: none;
	transition: color 140ms ease;
}

body:has(> .full.height > .commit-sky) > .page-footer a:hover,
body:has(> .full.height > .commit-sky) > .page-footer .ui.dropdown:hover > .default-text,
body:has(> .full.height > .commit-sky) > .page-footer .ui.dropdown:hover > .flex-text-inline {
	color: var(--cs-accent);
}

body:has(> .full.height > .commit-sky) > .page-footer .ui.dropdown > .default-text .svg,
body:has(> .full.height > .commit-sky) > .page-footer .ui.dropdown > .flex-text-inline .svg {
	color: var(--cs-faint);
}

body:has(> .full.height > .commit-sky) > .page-footer a:focus-visible {
	outline: 3px solid var(--cs-focus);
	outline-offset: 3px;
	border-radius: 4px;
}

@media (max-width: 880px) {
	body:has(> .full.height > .commit-sky) > .page-footer .right-links {
		justify-content: center;
	}
}

/* ------------------------------------------------------------------ motion */

@media (prefers-reduced-motion: no-preference) {
	.commit-sky[data-state="ready"]:not(.is-settled) .cs-cluster {
		animation: cs-appear 900ms cubic-bezier(0.2, 0.9, 0.3, 1) both;
		animation-delay: calc(var(--i, 0) * 90ms + 120ms);
	}

	.cs-cluster.is-bright .cs-core-halo {
		animation: cs-twinkle 3.8s ease-in-out infinite alternate;
		animation-delay: calc(var(--i, 0) * -700ms);
	}

	.cs-bg-star.is-twinkle {
		animation: cs-glimmer 4.6s ease-in-out infinite alternate;
	}

	.cs-cluster.is-active .cs-core-halo {
		animation: none;
	}
}

@keyframes cs-appear {
	from {
		opacity: 0;
		transform: scale(0.6);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@keyframes cs-twinkle {
	from {
		opacity: calc(0.12 + 0.3 * var(--b, 0.5));
		transform: scale(1);
	}

	to {
		opacity: calc(0.3 + 0.3 * var(--b, 0.5));
		transform: scale(1.35);
	}
}

@keyframes cs-glimmer {
	from { opacity: 0.25; }
	to { opacity: 0.85; }
}

@media (prefers-reduced-motion: reduce) {
	.commit-sky *,
	.commit-sky *::before,
	.commit-sky *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
}

/* ------------------------------------------------------------------ responsive */

@media (max-width: 900px) {
	.cs-hero {
		grid-template-columns: 1fr;
		align-items: start;
	}

	.cs-overview {
		max-width: 640px;
	}
}

@media (max-width: 560px) {
	.commit-sky {
		padding-top: 26px;
		padding-left: 16px;
		padding-right: 16px;
	}

	.cs-eyebrow {
		margin-bottom: 14px;
	}

	.commit-sky .cs-copy h1 {
		font-size: clamp(32px, 9.4vw, 40px);
	}

	.cs-intro {
		margin-top: 16px;
		font-size: 15px;
	}

	.cs-actions {
		margin-top: 22px;
	}

	.commit-sky .cs-button {
		flex: 1 1 auto;
	}

	.cs-overview {
		padding: 18px 18px 16px;
	}

	.cs-overview-grid {
		gap: 12px 16px;
	}

	.cs-scene-wrap {
		height: 340px;
	}

	.cs-label {
		font-size: 11px;
	}

	.cs-scene-caption {
		flex-direction: column;
		align-items: flex-start;
	}

	.cs-repo-list {
		grid-template-columns: 1fr;
	}
}