/* Element Guru — maintenance overlay (MAINT-01). Grid shell, natural document scroll. */

body.eg-maintenance #eg-page-wrap.eg-page-stack {
	min-height: 100dvh;
	display: grid;
	grid-template-rows: auto minmax(20rem, 1fr) auto;
}

body.eg-maintenance .eg-nav {
	position: relative;
	top: auto;
	z-index: 60;
}

body.eg-maintenance .eg-lang-suggest-bar,
body.eg-maintenance .eg-translation-ticker {
	display: none;
}

body.eg-maintenance #eg-page-wrap.eg-page-stack > *:not(#eg-header):not(.eg-maint-stage):not(#eg-footer) {
	display: none;
}

body.eg-maintenance #eg-header,
body.eg-maintenance .eg-maint-stage,
body.eg-maintenance .eg-maint-overlay,
body.eg-maintenance .eg-maint-card,
body.eg-maintenance #eg-footer {
	opacity: 1;
	visibility: visible;
}

body.eg-maintenance .eg-footer {
	margin-top: 0;
	padding-block: 1.15rem 0.9rem;
	z-index: 60;
}

body.eg-maintenance .eg-footer-grid {
	gap: 1rem;
	margin-bottom: 1rem;
}

body.eg-maintenance #eg-footer .eg-wrap > hr {
	margin: 10px 0 14px !important;
}

body.eg-maintenance .eg-main {
	padding-top: 1.25rem;
}

.eg-maint-stage {
	position: relative;
	min-height: 20rem;
	overflow: hidden;
}

.eg-maint-content {
	position: absolute;
	inset: 0;
	overflow: hidden;
}

.eg-maint-content[inert] {
	pointer-events: none;
	user-select: none;
}

.eg-maint-overlay {
	position: absolute;
	inset: 0;
	z-index: 40;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1.25rem;
	background: color-mix(in srgb, var(--bg, #000) 50%, transparent);
	backdrop-filter: blur(10px) saturate(0.85);
	-webkit-backdrop-filter: blur(10px) saturate(0.85);
}

.eg-maint-card {
	position: relative;
	max-width: min(28rem, 100%);
	text-align: center;
	padding: 1.6rem 1.4rem 1.45rem;
	border-radius: var(--rl, 18px);
	border: 1px solid color-mix(in srgb, var(--mint, #98FFD9) 38%, var(--border, rgba(255, 255, 255, 0.07)));
	background: color-mix(in srgb, var(--bg2, #0d0d10) 76%, transparent);
	color: var(--text, #DFCFBA);
	font-family: var(--serif, Georgia, "Times New Roman", serif);
	box-shadow:
		0 0 0 1px color-mix(in srgb, var(--blue, #B2C9DA) 16%, transparent),
		0 0 28px color-mix(in srgb, var(--mint, #98FFD9) 18%, transparent);
}

.eg-maint-card__title {
	margin: 0;
	font-size: 1.55rem;
	font-weight: 600;
	color: var(--mint, #98FFD9);
}

.eg-maint-card__divider {
	width: min(16rem, 78%);
	height: 1px;
	margin: 0.9rem auto 1rem;
	background: linear-gradient(
		90deg,
		transparent,
		var(--mint, #98FFD9),
		transparent
	);
}

.eg-maint-card__body {
	margin: 0;
	line-height: 1.55;
	white-space: pre-line;
	color: var(--blue, #B2C9DA);
}

@media (max-width: 1024px) {
	body.eg-maintenance .eg-footer-grid {
		grid-template-columns: 1fr 1fr;
		gap: 0.75rem 1rem;
		margin-bottom: 0.75rem;
	}
}

@media (max-width: 640px) {
	.eg-maint-overlay {
		padding: 0.75rem;
	}

	.eg-maint-card {
		padding: 1.15rem 1rem 1.05rem;
		border-radius: var(--r, 10px);
	}

	.eg-maint-card__title {
		font-size: 1.28rem;
	}

	.eg-maint-card__divider {
		width: min(12rem, 82%);
		margin: 0.75rem auto 0.85rem;
	}

	body.eg-maintenance .eg-footer {
		padding-block: 0.85rem 0.7rem;
	}
}