:root { color-scheme: light; }

.index-page,
.events-page,
.participants-page {
	margin: 0;
	font-family: Arial, sans-serif;
	background: #f4f6f8;
	color: #1f2937;
}

.index-page header,
.events-page header,
.participants-page header {
	background: #0f172a;
	color: #fff;
	padding: 1rem 1.5rem;
}

.index-page nav ul,
.events-page nav ul,
.participants-page nav ul {
	list-style: none;
	margin: 0.5rem 0 0;
	padding: 0;
	display: flex;
	gap: 1rem;
	flex-wrap: wrap;
}

.index-page nav a,
.events-page nav a,
.participants-page nav a {
	color: #cbd5e1;
	text-decoration: none;
	font-weight: 600;
}

.index-page nav a:hover,
.events-page nav a:hover,
.participants-page nav a:hover,
.index-page nav a[aria-current="page"],
.events-page nav a[aria-current="page"],
.participants-page nav a[aria-current="page"] {
	color: #fff;
}

.index-page main,
.events-page main,
.participants-page main {
	max-width: 980px;
	margin: 1.5rem auto;
	padding: 0 1rem 2rem;
}

.events-page .notice,
.participants-page .notice {
	background: #fff7ed;
	border: 1px solid #fdba74;
	color: #7c2d12;
	padding: 0.75rem 1rem;
	border-radius: 8px;
	margin-bottom: 1rem;
}

.events-page .events-grid,
.participants-page .participants-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
	gap: 1rem;
}

.events-page .event-card,
.participants-page .participant-card {
	background: #fff;
	border: 1px solid #e5e7eb;
	border-radius: 12px;
	padding: 1rem;
	box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06);
}

.events-page .event-card h3,
.participants-page .participant-card h3 {
	margin: 0 0 0.75rem;
	font-size: 1.1rem;
}

.events-page .event-meta,
.participants-page .participant-meta {
	margin: 0.2rem 0;
	color: #4b5563;
	font-size: 0.95rem;
}

.events-page .badge,
.participants-page .badge {
	display: inline-block;
	margin-top: 0.75rem;
	background: #dbeafe;
	color: #1e3a8a;
	border-radius: 999px;
	padding: 0.25rem 0.6rem;
	font-size: 0.8rem;
	font-weight: 700;
}

.index-page .error-banner {
	margin-bottom: 1rem;
	padding: 0.75rem 1rem;
	border: 1px solid #d9534f;
	background: #fdf2f2;
	color: #7a1c1a;
	border-radius: 6px;
}

.index-page footer {
	max-width: 980px;
	margin: 0 auto 2rem;
	padding: 0 1rem;
	color: #6b7280;
}