:root {
	color-scheme: light;
	--bg-1: #f9fafb;
	--bg-2: #f2f4f6;
	--panel: #ffffff;
	--panel-2: #f2f4f6;
	--text: #191f28;
	--muted: #6b7684;
	--border: #e5e8eb;
	--border-strong: #d1d6db;
	--primary: #3182f6;
	--primary-2: #2272eb;
	--shadow: 0 20px 60px rgba(0, 0, 0, 0.12);
	--header-bg: rgba(255, 255, 255, 0.92);
}

:root[data-theme='dark'] {
	color-scheme: dark;
	--bg-1: #070a12;
	--bg-2: #0b0f19;
	--panel: rgba(255, 255, 255, 0.06);
	--panel-2: rgba(255, 255, 255, 0.04);
	--text: rgba(255, 255, 255, 0.92);
	--muted: rgba(255, 255, 255, 0.66);
	--border: rgba(255, 255, 255, 0.12);
	--border-strong: rgba(255, 255, 255, 0.18);
	--primary: #a7c7ff;
	--primary-2: #d8e7ff;
	--shadow: 0 20px 60px rgba(0, 0, 0, 0.45);
	--header-bg: rgba(8, 12, 22, 0.75);
}

html,
body {
	margin: 0;
	padding: 0;
	min-height: 100%;
}

body {
	font-family: "Instrument Sans", ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica,
		Arial, sans-serif;
	color: var(--text);
	background: linear-gradient(180deg, var(--bg-1), var(--bg-2));
}

.cms-shell {
	padding: 0;
}

.cms-fab {
	position: fixed;
	right: 16px;
	bottom: 16px;
	z-index: 9999;
	display: flex;
	gap: 10px;
	align-items: center;
}

.theme-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 38px;
	padding: 0 12px;
	border-radius: 999px;
	border: 1px solid var(--border);
	background: var(--panel);
	color: var(--muted);
	box-shadow: 0 12px 30px rgba(0, 0, 0, 0.12);
	font: inherit;
	cursor: pointer;
}

.theme-toggle:hover {
	background: var(--panel-2);
	border-color: var(--border-strong);
	color: var(--text);
}

.cms-fab-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 38px;
	padding: 0 12px;
	border-radius: 999px;
	border: 1px solid var(--border);
	background: var(--panel);
	color: var(--text);
	text-decoration: none;
	box-shadow: 0 12px 30px rgba(0, 0, 0, 0.12);
}

.cms-fab-link:hover {
	background: var(--panel-2);
	border-color: var(--border-strong);
}

/* Decap CMS mounts into #nc-root */
#nc-root {
	min-height: 100vh;
	border-radius: 0;
	overflow: visible;
	box-shadow: none;
	background: var(--panel);
	border: 0;
}

@media (max-width: 520px) {
	.cms-fab {
		right: 12px;
		bottom: 12px;
	}
}