:root {
	--accent: #00ff88;
	--accent-fg: #000000;
	--bg: #0a0a0f;
	--surface: #12121a;
	--border: #1e1e2e;
	--text: #e2e8f0;
	--muted: #64748b;
}

html {
	scroll-behavior: smooth;
}

body {
	font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, "Cascadia Code", "Source Code Pro", monospace;
}

@keyframes fadeUp {
	from { opacity: 0; transform: translateY(16px); }
	to { opacity: 1; transform: translateY(0); }
}

.fade-up {
	animation: fadeUp 0.7s ease both;
}

.grid-bg {
	background-image:
		linear-gradient(var(--border) 1px, transparent 1px),
		linear-gradient(90deg, var(--border) 1px, transparent 1px);
	background-size: 48px 48px;
	-webkit-mask-image: radial-gradient(ellipse 80% 60% at 50% 0%, #000 30%, transparent 75%);
	mask-image: radial-gradient(ellipse 80% 60% at 50% 0%, #000 30%, transparent 75%);
}