@font-face {
	font-family: "Titillium Web";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("/fonts/titillium-web-400-normal.ttf") format("truetype");
}
@font-face {
	font-family: "Titillium Web";
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url("/fonts/titillium-web-600-normal.ttf") format("truetype");
}
@font-face {
	font-family: "Titillium Web";
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url("/fonts/titillium-web-700-normal.ttf") format("truetype");
}
@font-face {
	font-family: "Titillium Web";
	font-style: normal;
	font-weight: 900;
	font-display: swap;
	src: url("/fonts/titillium-web-900-normal.ttf") format("truetype");
}
@font-face {
	font-family: "Titillium Web";
	font-style: italic;
	font-weight: 700;
	font-display: swap;
	src: url("/fonts/titillium-web-700-italic.ttf") format("truetype");
}

:root {
	--bg: #15151e;
	--bg-2: #1e1e28;
	--bg-3: #272733;
	--red: #e10600;
	--red-soft: #ff2d1f;
	--txt: #f2f2f7;
	--muted: #8d8d99;
	--muted-2: #6b6b78;
	--line: #2c2c38;
	--gold: #d4af37;
	--silver: #c0c0c8;
	--bronze: #cd7f32;
}

* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}
html {
	scroll-behavior: smooth;
}
body {
	font-family: "Titillium Web", "Segoe UI", system-ui, sans-serif;
	background: var(--bg);
	color: var(--txt);
	font-weight: 400;
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
}
a {
	color: inherit;
	text-decoration: none;
}
.wrap {
	max-width: 1240px;
	margin: 0 auto;
	padding: 0 20px;
}
.red {
	color: var(--red);
}
.art {
	display: block;
	width: 100%;
	height: 100%;
}
.svgSymbols {
	position: absolute;
}
.visually-hidden {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}
.skipLink {
	position: absolute;
	left: -9999px;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
	&:focus {
		position: fixed;
		left: 16px;
		top: 16px;
		width: auto;
		height: auto;
		overflow: visible;
		z-index: 10000;
		background: var(--bg-2);
		color: var(--txt);
		border: 1px solid var(--line);
		border-radius: 6px;
		padding: 10px 16px;
		font-weight: 700;
	}
}

fieldset {
	min-width: 0;
	margin: 0;
	padding: 0;
	border: 0;
}

address {
	font-style: normal;
}

dl,
dd {
	margin: 0;
}

/* Shared site chrome */
.topbar {
	background: #0c0c12;
	border-bottom: 1px solid var(--line);
	font-size: 11px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	font-weight: 600;
	color: var(--muted);
	.wrap {
		display: flex;
		align-items: center;
		justify-content: space-between;
		height: 32px;
	}
	.left,
	.right {
		display: flex;
		gap: 18px;
		align-items: center;
	}
	.right {
		gap: 16px;
	}
	.ped {
		color: var(--red);
	}
	a:hover {
		color: var(--txt);
	}
}

nav.primaryNav {
	position: sticky;
	top: 0;
	z-index: 80;
	background: rgba(21, 21, 30, 0.92);
	backdrop-filter: blur(12px);
	border-bottom: 2px solid var(--red);
	.wrap {
		display: flex;
		align-items: center;
		justify-content: space-between;
		height: 64px;
	}
	ul {
		display: flex;
		gap: 2px;
		list-style: none;
		a {
			display: block;
			padding: 8px 13px;
			font-size: 13px;
			font-weight: 700;
			letter-spacing: 0.06em;
			text-transform: uppercase;
			color: var(--muted);
			border-bottom: 3px solid transparent;
			transition: 0.15s;
		}
		a:hover,
		a.on {
			color: var(--txt);
			border-bottom-color: var(--red);
		}
	}
}
.brand {
	display: flex;
	align-items: center;
	gap: 12px;
	font-weight: 900;
	font-size: 23px;
	.logo {
		width: 58px;
		height: 34px;
		border-radius: 6px;
		display: block;
		overflow: hidden;
		flex-shrink: 0;
	}
	.logo-snail {
		width: 100%;
		height: 100%;
		display: block;
		object-fit: cover;
	}
	em {
		color: var(--red);
		font-style: normal;
	}
}
.lang {
	display: flex;
	border: 1px solid var(--line);
	border-radius: 4px;
	overflow: hidden;
	a,
	button {
		display: block;
		background: none;
		border: none;
		color: var(--muted);
		padding: 6px 12px;
		cursor: pointer;
		text-decoration: none;
		font-family: inherit;
		font-size: 11px;
		font-weight: 700;
		letter-spacing: 0.1em;
		transition: 0.15s;
	}
	a:hover,
	button:hover,
	a.active,
	button.active {
		background: var(--red);
		color: #fff;
	}
}
.navActions {
	display: flex;
	align-items: center;
	gap: 10px;
}
.navActions--top {
	display: none;
}
.navCta {
	background: var(--red);
	color: #fff;
	padding: 10px 18px;
	border-radius: 4px;
	font-weight: 700;
	font-size: 13px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	border: none;
	cursor: pointer;
	transition: 0.15s;
	&:hover {
		background: var(--red-soft);
		transform: translateY(-1px);
	}
}
.seasonCta {
	color: var(--txt);
	padding: 9px 17px;
	border: 1px solid var(--line);
	border-radius: 4px;
	font-weight: 700;
	font-size: 13px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	transition: 0.15s;
	&:hover {
		border-color: var(--txt);
		background: var(--bg-3);
	}
}

/* Shared controls and section furniture */
.btn {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	cursor: pointer;
	border: none;
	font-family: inherit;
	font-weight: 700;
	font-size: 14px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	padding: 15px 28px;
	border-radius: 4px;
	transition: 0.15s;
}
.btnRed {
	background: var(--red);
	color: #fff;
	&:hover {
		background: var(--red-soft);
		transform: translateY(-2px);
		box-shadow: 0 12px 26px -10px color-mix(in srgb, var(--red) 70%, transparent);
	}
}
.btnOutline {
	background: rgba(0, 0, 0, 0.35);
	color: var(--txt);
	border: 1px solid var(--line);
	&:hover {
		border-color: var(--txt);
	}
}
.btnDanger {
	background: transparent;
	color: #ff817a;
	border: 1px solid color-mix(in srgb, var(--red) 35%, transparent);
	&:hover {
		border-color: #ff817a;
		background: color-mix(in srgb, var(--red) 12%, transparent);
	}
}
.secHead {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 20px;
	margin-bottom: 42px;
	flex-wrap: wrap;
	.left .tag,
	.tag {
		font-size: 12px;
		font-weight: 700;
		letter-spacing: 0.18em;
		text-transform: uppercase;
		color: var(--red);
		margin-bottom: 8px;
	}
	.left h2,
	h2 {
		font-size: clamp(28px, 4vw, 44px);
		font-weight: 900;
		text-transform: uppercase;
		letter-spacing: -0.01em;
		line-height: 1;
	}
	.right a,
	a {
		color: var(--red);
		font-weight: 700;
		text-transform: uppercase;
		letter-spacing: 0.08em;
		font-size: 13px;
		&:hover {
			text-decoration: underline;
		}
	}
}
.crumb {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--muted);
	margin-bottom: 28px;
	a:hover {
		color: var(--red);
	}
	.sep {
		color: var(--muted-2);
	}
}

footer {
	background: #0c0c12;
	border-top: 1px solid var(--line);
	padding: 50px 0 30px;
	.colGrid {
		display: grid;
		grid-template-columns: 1.6fr repeat(2, 1fr);
		gap: 32px;
		margin-bottom: 36px;
	}
	.colBrand {
		.brand {
			margin-bottom: 14px;
		}
		p {
			color: var(--muted-2);
			font-size: 13px;
		}
	}
	h2 {
		font-size: 11px;
		font-weight: 700;
		letter-spacing: 0.16em;
		text-transform: uppercase;
		color: var(--red);
		margin-bottom: 14px;
	}
	ul {
		list-style: none;
		li {
			margin-bottom: 9px;
		}
	}
	.col a {
		color: var(--muted);
		font-size: 13px;
		&:hover {
			color: var(--txt);
		}
	}
	.bottom {
		display: flex;
		justify-content: space-between;
		align-items: center;
		flex-wrap: wrap;
		gap: 14px;
		border-top: 1px solid var(--line);
		padding-top: 24px;
		.copy {
			font-size: 12px;
			color: var(--muted-2);
			letter-spacing: 0.04em;
		}
	}
	.social {
		display: flex;
		gap: 8px;
		a {
			width: 36px;
			height: 36px;
			border-radius: 6px;
			border: 1px solid var(--line);
			display: grid;
			place-items: center;
			color: var(--muted);
			font-size: 12px;
			font-weight: 700;
			transition: 0.15s;
			&:hover {
				color: #fff;
				border-color: var(--red);
				background: color-mix(in srgb, var(--red) 12%, transparent);
			}
		}
	}
}
.footerTelegram {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--red);
	border-radius: 5px;
	background: color-mix(in srgb, var(--red) 10%, transparent);
	color: #fff;
	padding: 10px 16px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	transition: 0.15s;
	&:hover {
		background: var(--red);
		transform: translateY(-1px);
	}
}

/* Join dialog */
.joinDialog {
	position: fixed;
	inset: 0;
	width: min(620px, calc(100% - 32px));
	max-height: calc(100vh - 32px);
	margin: auto;
	padding: 0;
	border: 1px solid #2c2c38;
	border-radius: 12px;
	background: #1e1e28;
	color: #f2f2f7;
	box-shadow: 0 30px 90px rgba(0, 0, 0, 0.72);
	overflow: auto;
	&::backdrop {
		background: rgba(5, 5, 9, 0.82);
		backdrop-filter: blur(4px);
	}
	h2 {
		font-size: 32px;
		font-weight: 900;
		line-height: 1;
		text-transform: uppercase;
		margin-top: 8px;
	}
	form {
		padding: 26px 28px 28px;
	}
	label {
		font-size: 11px;
		font-weight: 700;
		letter-spacing: 0.11em;
		text-transform: uppercase;
		color: #8d8d99;
	}
	input,
	textarea {
		width: 100%;
		border: 1px solid #2c2c38;
		border-radius: 6px;
		background: #15151e;
		color: #f2f2f7;
		padding: 12px 13px;
		font: inherit;
		outline: none;
		&:focus {
			border-color: var(--red);
			box-shadow: 0 0 0 3px color-mix(in srgb, var(--red) 15%, transparent);
		}
	}
	textarea {
		min-height: 130px;
		resize: vertical;
	}
	&.isSubmitted {
		form {
			display: none;
		}
		.joinDialog__success {
			display: block;
		}
	}
}
.joinDialog__head {
	position: relative;
	padding: 28px 68px 23px 28px;
	border-bottom: 1px solid #2c2c38;
	background: linear-gradient(115deg, color-mix(in srgb, var(--red) 16%, transparent), transparent 60%);
}
.joinDialog__eyebrow {
	color: var(--red);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}
.joinDialog__intro {
	color: #8d8d99;
	font-size: 14px;
	line-height: 1.55;
	margin-top: 11px;
}
.joinDialog__close {
	position: absolute;
	right: 20px;
	top: 20px;
	width: 38px;
	height: 38px;
	border: 1px solid #2c2c38;
	border-radius: 50%;
	background: #15151e;
	color: #f2f2f7;
	font-size: 24px;
	line-height: 1;
	cursor: pointer;
	&:hover {
		border-color: var(--red);
		background: var(--red);
	}
}
.joinDialog__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 18px;
}
.joinDialog__field {
	display: flex;
	flex-direction: column;
	gap: 7px;
}
.joinDialog__field--wide {
	grid-column: 1/-1;
}
.joinDialog__hint {
	color: #6b6b78;
	font-size: 12px;
	line-height: 1.45;
}
.joinDialog__actions {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	margin-top: 23px;
	padding-top: 20px;
	border-top: 1px solid #2c2c38;
}
.joinDialog__privacy {
	max-width: 300px;
	color: #6b6b78;
	font-size: 11px;
	line-height: 1.4;
	a {
		color: var(--red);
		text-decoration: underline;
	}
}
.joinDialog__submit {
	border: 0;
	border-radius: 4px;
	background: var(--red);
	color: #fff;
	padding: 13px 21px;
	font: 700 13px inherit;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	cursor: pointer;
	white-space: nowrap;
	&:hover {
		background: var(--red-soft);
	}
}
.joinDialog__success {
	display: none;
	padding: 42px 28px;
	text-align: center;
	strong {
		display: block;
		font-size: 28px;
		font-weight: 900;
		text-transform: uppercase;
	}
	p {
		color: #8d8d99;
		margin-top: 9px;
	}
}
.joinDialog__error {
	display: none;
	padding: 18px 28px;
	border-top: 1px solid #2c2c38;
	color: #ff6b5e;
	strong {
		display: block;
		font-size: 13px;
		font-weight: 700;
		letter-spacing: 0.08em;
		text-transform: uppercase;
	}
	p {
		color: #8d8d99;
		margin-top: 5px;
		font-size: 13px;
	}
}
.joinDialog__error[hidden] {
	display: none;
}
button.go[data-open-join] {
	background: none;
	border: 0;
	font: inherit;
	cursor: pointer;
	text-align: left;
}

/* Calendar and event format components */
.calendarActions {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
}
.calendarMenu {
	position: relative;
	color: var(--txt);
	summary {
		list-style: none;
		display: inline-flex;
		align-items: center;
		gap: 8px;
		padding: 8px 12px;
		border: 1px solid var(--line);
		border-radius: 4px;
		background: rgba(0, 0, 0, 0.2);
		color: var(--txt);
		font-size: 12px;
		font-weight: 700;
		letter-spacing: 0.06em;
		text-transform: uppercase;
		white-space: nowrap;
		cursor: pointer;
		transition: 0.15s;
		&::-webkit-details-marker {
			display: none;
		}
		&::before {
			content: "+";
			color: var(--red);
			font-size: 17px;
			line-height: 1;
		}
		&:hover {
			border-color: var(--red);
			background: var(--bg-3);
		}
		&:focus-visible {
			outline: 2px solid var(--red);
			outline-offset: 3px;
		}
	}
	&[open] summary {
		border-color: var(--red);
		background: var(--bg-3);
	}
}
.calendarOptions {
	position: absolute;
	right: 0;
	top: calc(100% + 8px);
	z-index: 30;
	width: 190px;
	padding: 6px;
	background: var(--bg-2);
	border: 1px solid var(--line);
	border-radius: 6px;
	box-shadow: 0 18px 45px rgba(0, 0, 0, 0.45);
	a {
		display: flex;
		align-items: center;
		padding: 10px 11px;
		border-radius: 4px;
		color: var(--txt);
		font-size: 13px;
		font-weight: 600;
		letter-spacing: 0;
		text-transform: none;
		white-space: nowrap;
		&:hover {
			background: var(--bg-3);
			color: #fff;
		}
		&::before {
			width: 23px;
			color: var(--red);
			font-weight: 900;
		}
	}
	[data-calendar-google]::before {
		content: "G";
	}
	[data-calendar-ics]::before {
		content: "↓";
	}
}
.heroCalendar {
	margin-top: 10px;
	.calendarMenu,
	summary {
		width: 100%;
	}
	summary {
		justify-content: center;
		padding: 11px 14px;
	}
	.calendarOptions {
		left: 0;
		right: 0;
		top: auto;
		bottom: calc(100% + 8px);
		width: 100%;
	}
}
.raceCard__link {
	position: absolute;
	inset: 0;
	z-index: 0;
}
.raceCard:has(.calendarMenu[open]) {
	overflow: visible;
	position: relative;
	z-index: 20;
}
.eventFormat {
	margin-top: 20px;
	padding: 24px;
	border: 1px solid var(--line);
	border-left: 4px solid var(--red);
	border-radius: 8px;
	background: var(--bg-2);
}
.eventFormat__head {
	display: flex;
	align-items: end;
	justify-content: space-between;
	gap: 20px;
	margin-bottom: 20px;
	h3 {
		font-size: 20px;
		font-weight: 900;
		text-transform: uppercase;
	}
	p {
		color: var(--muted);
		font-size: 13px;
	}
}
.eventTimeline {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 10px;
}
.eventTimeline__step {
	padding: 16px;
	border-radius: 6px;
	background: var(--bg-3);
	border-top: 2px solid var(--line);
	strong {
		display: block;
		color: var(--red);
		font-size: 19px;
		font-weight: 900;
	}
	span {
		display: block;
		margin-top: 4px;
		font-size: 12px;
		font-weight: 700;
		text-transform: uppercase;
		letter-spacing: 0.08em;
	}
	small {
		display: block;
		margin-top: 5px;
		color: var(--muted);
		font-size: 11px;
	}
}

/* Shared championship cards and tables */
:is(body.page-home, body.page-season) {
	section {
		padding: 80px 0;
		border-top: 1px solid var(--line);
	}
	.raceList {
		display: flex;
		flex-direction: column;
		gap: 12px;
	}
	.raceCard {
		display: grid;
		grid-template-columns: 104px 84px minmax(0, 1fr) minmax(230px, auto);
		align-items: center;
		column-gap: 18px;
		background: var(--bg-2);
		border: 1px solid var(--line);
		border-radius: 8px;
		overflow: hidden;
		position: relative;
		transition: 0.18s;
		cursor: pointer;
		&:hover {
			border-color: var(--red);
			transform: translateX(6px);
		}
		&:focus-within {
			border-color: var(--red);
		}
		&.next {
			background: linear-gradient(95deg, color-mix(in srgb, var(--red) 10%, transparent), var(--bg-2) 40%);
			border-color: var(--red);
		}
		.thumb {
			height: 104px;
			width: 84px;
			background: var(--bg-3);
			overflow: hidden;
			img,
			svg {
				width: 100%;
				height: 100%;
				object-fit: cover;
				display: block;
			}
		}
		.dateBlock {
			background: var(--bg-3);
			align-self: stretch;
			display: flex;
			flex-direction: column;
			justify-content: center;
			padding: 18px 12px;
			text-align: center;
			.d {
				font-size: 32px;
				font-weight: 900;
				line-height: 1;
				letter-spacing: -0.02em;
			}
			.mo {
				font-size: 11px;
				font-weight: 700;
				letter-spacing: 0.14em;
				text-transform: uppercase;
				color: var(--red);
				margin-top: 6px;
			}
		}
		.info {
			min-width: 0;
			h3 {
				font-size: 18px;
				font-weight: 900;
				text-transform: uppercase;
				letter-spacing: 0.02em;
			}
			.meta {
				font-size: 13px;
				color: var(--muted);
				margin-top: 4px;
			}
		}
		.raceActions {
			align-self: stretch;
			display: flex;
			flex-direction: column;
			justify-content: center;
			gap: 11px;
			padding: 14px 18px 14px 0;
		}
		.raceActions__top {
			display: flex;
			align-items: center;
			justify-content: flex-end;
			gap: 14px;
		}
		.go {
			&:hover,
			&:focus-visible {
				color: var(--red-soft);
				text-decoration: underline;
				text-underline-offset: 3px;
			}
			&:focus-visible {
				outline: 2px solid var(--red);
				outline-offset: 4px;
			}
		}
		.go {
			font-size: 13px;
			color: var(--red);
			font-weight: 700;
			letter-spacing: 0.06em;
			text-transform: uppercase;
		}
		.calendarActions {
			justify-content: flex-end;
			.calendarMenu summary {
				padding: 6px 10px;
				border-color: transparent;
				background: transparent;
				color: var(--muted);
				font-size: 11px;
				&:hover {
					border-color: var(--line);
					color: var(--txt);
				}
			}
		}
	}
	.next .dateBlock {
		background: color-mix(in srgb, var(--red) 15%, transparent);
	}
	.status {
		font-size: 11px;
		font-weight: 700;
		letter-spacing: 0.12em;
		text-transform: uppercase;
		padding: 6px 12px;
		border-radius: 3px;
		white-space: nowrap;
		&.done {
			color: var(--gold);
			border: 1px solid rgba(212, 175, 55, 0.35);
			background: rgba(212, 175, 55, 0.08);
		}
		&.nextUp {
			color: #fff;
			background: var(--red);
			box-shadow: 0 0 16px color-mix(in srgb, var(--red) 40%, transparent);
		}
		&.up {
			color: var(--muted);
			border: 1px solid var(--line);
		}
	}
	.standScroll {
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		border: 1px solid var(--line);
		border-radius: 10px;
	}
	table.stand {
		width: 100%;
		border-collapse: collapse;
		font-size: 14px;
		min-width: 660px;
		thead th {
			text-align: left;
			color: var(--muted-2);
			font-size: 11px;
			letter-spacing: 0.14em;
			text-transform: uppercase;
			font-weight: 700;
			padding: 15px 14px;
			border-bottom: 2px solid var(--line);
			white-space: nowrap;
			&.rnd {
				text-align: center;
				padding: 13px 4px;
				.rd {
					display: block;
					font-size: 10px;
					letter-spacing: 0.04em;
					color: var(--muted-2);
					font-weight: 600;
					margin-top: 3px;
					text-transform: none;
				}
				&.next .rd {
					color: var(--red-soft);
				}
			}
			&.tot {
				text-align: right;
				padding-right: 18px;
			}
		}
		tbody tr {
			border-bottom: 1px solid var(--line);
			transition: 0.12s;
			&:last-child {
				border-bottom: none;
			}
			&:hover {
				background: var(--bg-3);
			}
		}
		td {
			padding: 12px 14px;
			vertical-align: middle;
			&.pos {
				font-weight: 900;
				font-size: 18px;
				width: 42px;
				text-align: center;
				&.p1 {
					color: var(--gold);
				}
				&.p2 {
					color: var(--silver);
				}
				&.p3 {
					color: var(--bronze);
				}
			}
			&.rnd {
				text-align: center;
				color: var(--muted);
				font-variant-numeric: tabular-nums;
				font-size: 14px;
				padding: 12px 4px;
				&.win {
					color: var(--gold);
					font-weight: 700;
				}
				&.na {
					color: var(--line);
					font-weight: 300;
				}
			}
			&.tot {
				text-align: right;
				font-weight: 900;
				font-size: 16px;
				color: var(--red);
				white-space: nowrap;
				padding-right: 18px;
			}
			&.drv .nm {
				font-weight: 700;
				font-size: 14px;
				letter-spacing: 0.02em;
				white-space: nowrap;
			}
		}
	}
	.drvCell {
		display: flex;
		align-items: center;
		gap: 12px;
		.avatar {
			width: 38px;
			height: 38px;
			border-radius: 50%;
			overflow: hidden;
			background: var(--bg-3);
			flex-shrink: 0;
			border: 2px solid var(--line);
			svg {
				width: 100%;
				height: 100%;
				display: block;
			}
		}
	}
	.strip {
		padding: 54px 0;
		border-top: 1px solid var(--line);
	}
	.stripHead {
		font-size: 12px;
		letter-spacing: 0.18em;
		text-transform: uppercase;
		color: var(--muted-2);
		text-align: center;
		margin-bottom: 28px;
		font-weight: 700;
	}
	.stripGrid {
		display: grid;
		grid-template-columns: repeat(6, 1fr);
		gap: 14px;
	}
	.stripCell {
		border: 1px solid var(--line);
		border-radius: 8px;
		padding: 26px 14px;
		text-align: center;
		transition: 0.15s;
		background: var(--bg-2);
		&:hover {
			border-color: var(--red);
			background: var(--bg-3);
		}
		svg {
			width: 42px;
			height: 42px;
			display: block;
			margin: 0 auto 12px;
		}
		.lbl {
			font-weight: 700;
			letter-spacing: 0.04em;
			font-size: 14px;
		}
		.desc {
			font-size: 11px;
			color: var(--muted-2);
			margin-top: 4px;
			text-transform: uppercase;
			letter-spacing: 0.1em;
		}
	}
	.joinBand {
		background: #0c0c12;
	}
	.joinArt {
		position: relative;
		border-radius: 12px;
		overflow: hidden;
		border: 1px solid var(--line);
		.art {
			position: absolute;
			inset: 0;
			z-index: 0;
			img,
			svg {
				width: 100%;
				height: 100%;
				object-fit: cover;
				display: block;
				object-position: center 40%;
			}
		}
		&::after {
			content: "";
			position: absolute;
			inset: 0;
			background: linear-gradient(
				110deg,
				rgba(12, 12, 18, 0.92) 30%,
				rgba(12, 12, 18, 0.4) 70%
			);
			z-index: 1;
		}
		.pad {
			position: relative;
			z-index: 2;
			padding: 64px 50px;
		}
		.tag {
			font-size: 12px;
			font-weight: 700;
			letter-spacing: 0.18em;
			text-transform: uppercase;
			color: var(--red);
		}
		h2 {
			font-size: clamp(32px, 4.6vw, 52px);
			font-weight: 900;
			text-transform: uppercase;
			line-height: 0.98;
			margin-top: 14px;
		}
		p {
			color: var(--muted);
			font-size: 17px;
			max-width: 540px;
			margin: 18px auto 0 0;
		}
		.ctaRow {
			display: flex;
			gap: 14px;
			margin-top: 32px;
			flex-wrap: wrap;
		}
	}
}

@keyframes rise {
	from {
		opacity: 0;
		transform: translateY(18px);
	}
	to {
		opacity: 1;
		transform: none;
	}
}

body.page-home {
	.heroRegister {
		width: 100%;
		justify-content: center;
		margin-top: 24px;
	}
	.scheduleMore {
		text-align: center;
		margin-top: 22px;
	}
	.trackLink {
		margin-top: 26px;
	}
	.hero {
		position: relative;
		background: var(--bg);
		border-bottom: 1px solid var(--line);
		overflow: hidden;
		min-height: 680px;
		display: flex;
		align-items: flex-end;
		&::after {
			content: "";
			position: absolute;
			left: 0;
			right: 0;
			bottom: 0;
			height: 55%;
			background: linear-gradient(
				to top,
				var(--bg) 5%,
				rgba(21, 21, 30, 0.35) 45%,
				transparent 100%
			);
			z-index: 1;
		}
		.wrap {
			position: relative;
			z-index: 2;
			padding: 74px 20px 56px;
		}
		.kicker {
			display: inline-flex;
			align-items: center;
			gap: 10px;
			font-size: 12px;
			font-weight: 700;
			letter-spacing: 0.18em;
			text-transform: uppercase;
			color: var(--red);
			margin-bottom: 22px;
			background: rgba(0, 0, 0, 0.4);
			padding: 8px 14px;
			border-radius: 3px;
			border-left: 3px solid var(--red);
		}
		h1 {
			font-size: clamp(48px, 7.4vw, 98px);
			line-height: 0.92;
			font-weight: 900;
			letter-spacing: -0.01em;
			text-transform: uppercase;
			em {
				color: var(--red);
				font-style: normal;
			}
			.stroke {
				-webkit-text-stroke: 2px var(--txt);
				-webkit-text-fill-color: transparent;
			}
		}
		p.lead {
			font-size: 18px;
			color: var(--txt);
			max-width: 500px;
			margin-top: 22px;
			font-weight: 400;
			opacity: 0.85;
		}
	}
	.heroArt {
		position: absolute;
		inset: 0;
		z-index: 0;
		img {
			width: 100%;
			height: 100%;
			object-fit: cover;
			display: block;
			object-position: center 38%;
		}
		&::after {
			content: "";
			position: absolute;
			inset: 0;
			background: linear-gradient(
				95deg,
				rgba(10, 10, 16, 0.92) 0%,
				rgba(10, 10, 16, 0.55) 45%,
				rgba(10, 10, 16, 0.2) 100%
			);
		}
	}
	.heroGrid {
		display: grid;
		grid-template-columns: 1.25fr 0.75fr;
		gap: 40px;
		align-items: end;
	}
	.heroCta {
		display: flex;
		gap: 14px;
		margin-top: 32px;
		flex-wrap: wrap;
	}
	.heroCard {
		background: rgba(18, 18, 26, 0.88);
		backdrop-filter: blur(8px);
		border: 1px solid var(--line);
		border-radius: 10px;
		overflow: hidden;
		box-shadow: 0 30px 70px -30px rgba(0, 0, 0, 0.8);
		.head {
			padding: 14px 20px;
			background: var(--red);
			display: flex;
			justify-content: space-between;
			align-items: center;
			.label {
				font-size: 12px;
				font-weight: 700;
				letter-spacing: 0.12em;
				text-transform: uppercase;
				color: #fff;
			}
			.roundLight {
				font-size: 11px;
				color: rgba(255, 255, 255, 0.85);
			}
		}
		.body {
			padding: 24px;
		}
		h3 {
			font-size: 26px;
			font-weight: 900;
			letter-spacing: -0.01em;
			text-transform: uppercase;
			line-height: 1;
		}
		.sub {
			color: var(--muted);
			font-size: 13px;
			margin-top: 8px;
			display: flex;
			align-items: center;
			gap: 8px;
			flex-wrap: wrap;
		}
		.applyBar {
			display: flex;
			justify-content: space-between;
			align-items: center;
			margin-top: 20px;
			padding-top: 18px;
			border-top: 1px solid var(--line);
		}
		.slots {
			font-size: 13px;
			color: var(--muted);
			b {
				color: var(--red);
				font-size: 18px;
				font-weight: 900;
			}
		}
	}
	.timerGrid {
		display: grid;
		grid-template-columns: repeat(4, 1fr);
		gap: 8px;
		margin-top: 20px;
		font-variant-numeric: tabular-nums;
		.unit {
			background: var(--bg-3);
			border-radius: 6px;
			padding: 14px 6px;
			text-align: center;
			.num {
				font-size: 30px;
				font-weight: 900;
				letter-spacing: -0.02em;
				line-height: 1;
			}
			.lbl {
				font-size: 10px;
				color: var(--muted-2);
				text-transform: uppercase;
				letter-spacing: 0.14em;
				margin-top: 6px;
				font-weight: 600;
			}
		}
	}
	.newsGrid {
		display: grid;
		grid-template-columns: repeat(4, 1fr);
		grid-auto-rows: 220px;
		gap: 14px;
	}
	.newsCard {
		position: relative;
		border-radius: 8px;
		overflow: hidden;
		border: 1px solid var(--line);
		background: var(--bg-2);
		display: flex;
		transition: border-color 0.18s;
		&:hover {
			border-color: var(--red);
			img {
				transform: scale(1.06);
			}
		}
		img {
			position: absolute;
			inset: 0;
			width: 100%;
			height: 100%;
			object-fit: cover;
			display: block;
			transition: transform 0.5s;
		}
		&::after {
			content: "";
			position: absolute;
			inset: 0;
			background: linear-gradient(
				to top,
				rgba(6, 6, 10, 0.96) 5%,
				rgba(6, 6, 10, 0.55) 45%,
				transparent 100%
			);
			pointer-events: none;
			z-index: 1;
		}
		.overlay {
			position: relative;
			z-index: 2;
			margin: auto 0 0;
			padding: 18px 18px 16px;
		}
		.meta {
			display: inline-flex;
			align-items: center;
			gap: 10px;
			font-size: 10px;
			font-weight: 700;
			letter-spacing: 0.14em;
			text-transform: uppercase;
			color: var(--red);
			.sep {
				color: var(--muted-2);
			}
			.date {
				color: var(--muted);
			}
		}
		h3 {
			font-size: 19px;
			font-weight: 900;
			text-transform: uppercase;
			line-height: 1.05;
			letter-spacing: -0.01em;
			margin-top: 8px;
			text-shadow: 0 2px 8px rgba(0, 0, 0, 0.6);
		}
		.more {
			display: none;
			align-items: center;
			gap: 8px;
			font-size: 12px;
			font-weight: 700;
			letter-spacing: 0.1em;
			text-transform: uppercase;
			color: var(--red);
			margin-top: 10px;
		}
		&.big {
			grid-column: span 2;
			grid-row: span 2;
			h3 {
				font-size: 32px;
			}
			.more {
				display: flex;
			}
		}
		&.wide {
			grid-column: span 2;
		}
	}
	.trackSection {
		background: #0c0c12;
		.inner {
			display: grid;
			grid-template-columns: 1fr 1fr;
			gap: 50px;
			align-items: center;
		}
	}
	.trackVisual {
		border-radius: 12px;
		overflow: hidden;
		border: 1px solid var(--line);
		position: relative;
		aspect-ratio: 4/3;
		background: var(--bg-2);
		img,
		svg {
			width: 100%;
			height: 100%;
			object-fit: cover;
			display: block;
		}
	}
	.trackInfo {
		h2 {
			font-size: clamp(28px, 3.6vw, 40px);
			font-weight: 900;
			text-transform: uppercase;
			line-height: 1;
			letter-spacing: -0.01em;
		}
		.stats {
			display: grid;
			grid-template-columns: repeat(3, 1fr);
			gap: 18px;
			margin: 30px 0;
		}
		.stat {
			border-left: 3px solid var(--red);
			padding-left: 14px;
			.n {
				font-size: 30px;
				font-weight: 900;
				line-height: 1;
			}
			.l {
				font-size: 12px;
				color: var(--muted);
				text-transform: uppercase;
				letter-spacing: 0.08em;
				margin-top: 5px;
				font-weight: 600;
			}
		}
		.desc {
			color: var(--muted);
			font-size: 15px;
			line-height: 1.7;
		}
	}
	.hero .kicker,
	.hero h1,
	.hero p.lead,
	.heroCta,
	.heroCard {
		animation: rise 0.7s ease both;
	}
	.hero h1 {
		animation-delay: 0.06s;
	}
	.hero p.lead {
		animation-delay: 0.12s;
	}
	.heroCta {
		animation-delay: 0.18s;
	}
	.heroCard {
		animation-delay: 0.24s;
	}
}

body.page-season {
	.seasonHero {
		position: relative;
		background: var(--bg);
		border-bottom: 1px solid var(--line);
		overflow: hidden;
		min-height: 460px;
		display: flex;
		align-items: flex-end;
		.bg {
			position: absolute;
			inset: 0;
			z-index: 0;
			img {
				width: 100%;
				height: 100%;
				object-fit: cover;
				display: block;
				object-position: center 50%;
			}
			&::after {
				content: "";
				position: absolute;
				inset: 0;
				background: linear-gradient(
					100deg,
					rgba(10, 10, 16, 0.94) 0%,
					rgba(10, 10, 16, 0.6) 50%,
					rgba(10, 10, 16, 0.3) 100%
				);
			}
		}
		.wrap {
			position: relative;
			z-index: 2;
			padding: 40px 20px 52px;
		}
		.badge {
			display: inline-flex;
			align-items: center;
			gap: 8px;
			font-size: 12px;
			font-weight: 700;
			letter-spacing: 0.14em;
			text-transform: uppercase;
			color: var(--red);
			background: rgba(0, 0, 0, 0.4);
			padding: 8px 14px;
			border-radius: 3px;
			border-left: 3px solid var(--red);
			margin-bottom: 20px;
		}
		h1 {
			font-size: clamp(48px, 7vw, 88px);
			line-height: 0.9;
			font-weight: 900;
			letter-spacing: -0.01em;
			text-transform: uppercase;
			em {
				color: var(--red);
				font-style: normal;
			}
		}
		p.lead {
			font-size: 18px;
			color: var(--txt);
			max-width: 560px;
			margin-top: 20px;
			opacity: 0.85;
		}
	}
	.statsBar {
		display: grid;
		grid-template-columns: repeat(4, 1fr);
		max-width: 880px;
		margin-top: 40px;
		background: #101017;
		border: 1px solid #343440;
		border-radius: 8px;
		overflow: hidden;
		box-shadow: 0 14px 34px rgba(0, 0, 0, 0.28);
		.cell {
			display: flex;
			min-width: 0;
			min-height: 108px;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			padding: 22px 24px;
			text-align: center;
			& + .cell {
				border-left: 1px solid #343440;
			}
			.n {
				font-size: clamp(30px, 3.5vw, 40px);
				font-weight: 900;
				line-height: 1;
				letter-spacing: -0.02em;
				color: var(--txt);
				font-variant-numeric: tabular-nums;
			}
			.l {
				max-width: 150px;
				margin-top: 10px;
				color: #a7a7b2;
				font-size: 11px;
				font-weight: 700;
				line-height: 1.25;
				letter-spacing: 0.12em;
				text-transform: uppercase;
			}
		}
	}
	.pointsPanel {
		display: grid;
		grid-template-columns: 1fr auto;
		gap: 28px;
		align-items: center;
		background: var(--bg-2);
		border: 1px solid var(--line);
		border-left: 4px solid var(--red);
		border-radius: 10px;
		padding: 24px;
		margin-top: 24px;
		h3 {
			font-size: 18px;
			font-weight: 900;
			text-transform: uppercase;
			letter-spacing: 0.02em;
		}
		p {
			color: var(--muted);
			font-size: 13px;
			margin-top: 5px;
		}
	}
	.finishPoints {
		display: grid;
		grid-template-columns: repeat(8, 48px);
		gap: 7px;
		margin-top: 18px;
		list-style: none;
		.place {
			background: var(--bg-3);
			border-radius: 5px;
			padding: 8px 3px;
			text-align: center;
			.pos {
				display: block;
				color: var(--muted-2);
				font-size: 10px;
				font-weight: 700;
				text-transform: uppercase;
				letter-spacing: 0.08em;
			}
			.pts {
				display: block;
				font-size: 18px;
				font-weight: 900;
				line-height: 1.1;
				margin-top: 4px;
			}
		}
	}
	.bonusPoints {
		display: grid;
		grid-template-columns: repeat(2, 130px);
		gap: 8px;
		list-style: none;
	}
	.bonus {
		border: 1px solid var(--line);
		border-radius: 7px;
		padding: 14px;
		text-align: center;
		strong {
			display: block;
			color: var(--red);
			font-size: 22px;
			font-weight: 900;
			line-height: 1;
		}
		span {
			display: block;
			color: var(--muted);
			font-size: 10px;
			font-weight: 700;
			letter-spacing: 0.1em;
			text-transform: uppercase;
			margin-top: 7px;
		}
	}
	.seasonHero .crumb,
	.seasonHero .badge,
	.seasonHero h1,
	.seasonHero p.lead,
	.statsBar {
		animation: rise 0.7s ease both;
	}
	.seasonHero .badge {
		animation-delay: 0.06s;
	}
	.seasonHero h1 {
		animation-delay: 0.12s;
	}
	.seasonHero p.lead {
		animation-delay: 0.18s;
	}
	.statsBar {
		animation-delay: 0.24s;
	}
}

body.page-event {
	section {
		padding: 80px 0;
		border-top: 1px solid var(--line);
	}
	.eventHero {
		position: relative;
		background: var(--bg);
		border-bottom: 1px solid var(--line);
		overflow: hidden;
		.bg {
			position: absolute;
			inset: 0;
			z-index: 0;
			img {
				width: 100%;
				height: 100%;
				object-fit: cover;
				display: block;
				object-position: center 35%;
			}
			&::after {
				content: "";
				position: absolute;
				inset: 0;
				background: linear-gradient(
					100deg,
					rgba(10, 10, 16, 0.94) 0%,
					rgba(10, 10, 16, 0.6) 50%,
					rgba(10, 10, 16, 0.25) 100%
				);
			}
		}
		.wrap {
			position: relative;
			z-index: 2;
			padding: 40px 20px 48px;
		}
		.badge {
			display: inline-flex;
			align-items: center;
			gap: 8px;
			font-size: 12px;
			font-weight: 700;
			letter-spacing: 0.14em;
			text-transform: uppercase;
			color: var(--gold);
			background: rgba(212, 175, 55, 0.1);
			border: 1px solid rgba(212, 175, 55, 0.3);
			padding: 7px 14px;
			border-radius: 4px;
			margin-bottom: 20px;
			.dot {
				width: 7px;
				height: 7px;
				border-radius: 50%;
				background: var(--gold);
			}
		}
		h1 {
			font-size: clamp(42px, 6.5vw, 82px);
			line-height: 0.9;
			font-weight: 900;
			letter-spacing: -0.01em;
			text-transform: uppercase;
			em {
				color: var(--red);
				font-style: normal;
			}
		}
		.meta {
			display: flex;
			gap: 24px;
			flex-wrap: wrap;
			margin-top: 20px;
			font-size: 15px;
			color: var(--muted);
			span {
				display: flex;
				align-items: center;
				gap: 7px;
			}
		}
	}
	.winnerSpot {
		display: grid;
		grid-template-columns: 1.4fr 0.6fr;
		gap: 40px;
		align-items: end;
		margin-top: 44px;
	}
	.winInfo {
		.label {
			font-size: 11px;
			font-weight: 700;
			letter-spacing: 0.16em;
			text-transform: uppercase;
			color: var(--muted-2);
			margin-bottom: 10px;
		}
		.name {
			font-size: clamp(28px, 3.5vw, 40px);
			font-weight: 900;
			text-transform: uppercase;
			letter-spacing: -0.01em;
			line-height: 1;
			display: flex;
			align-items: center;
			gap: 16px;
			.avatar {
				width: 52px;
				height: 52px;
				border-radius: 50%;
				overflow: hidden;
				border: 3px solid var(--gold);
				flex-shrink: 0;
				svg {
					width: 100%;
					height: 100%;
					display: block;
				}
			}
		}
		.quote {
			color: var(--muted);
			font-size: 16px;
			margin-top: 16px;
			max-width: 480px;
			font-style: italic;
			line-height: 1.6;
		}
	}
	.winStats {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 12px;
	}
	.winStat {
		background: rgba(18, 18, 26, 0.7);
		border: 1px solid var(--line);
		border-radius: 8px;
		padding: 16px 12px;
		text-align: center;
		.n {
			font-size: 24px;
			font-weight: 900;
			line-height: 1;
			color: var(--txt);
			&.gold {
				color: var(--gold);
			}
			&.red {
				color: var(--red);
			}
		}
		.l {
			font-size: 10px;
			color: var(--muted-2);
			text-transform: uppercase;
			letter-spacing: 0.1em;
			margin-top: 6px;
			font-weight: 600;
		}
	}
	.infoBar {
		padding: 0;
		background: var(--bg-2);
		border-bottom: 1px solid var(--line);
		.wrap {
			display: grid;
			grid-template-columns: repeat(4, 1fr);
			gap: 0;
		}
	}
	.infoCell {
		padding: 24px 20px;
		border-right: 1px solid var(--line);
		&:last-child {
			border-right: none;
		}
		.l {
			font-size: 11px;
			font-weight: 700;
			letter-spacing: 0.14em;
			text-transform: uppercase;
			color: var(--muted-2);
			margin-bottom: 6px;
		}
			.v,
			dd.v {
			font-size: 17px;
			font-weight: 700;
			color: var(--txt);
			&.red {
				color: var(--red);
			}
		}
	}
	.gallery {
		display: grid;
		grid-template-columns: repeat(4, 1fr);
		grid-auto-rows: 180px;
		gap: 12px;
	}
	.gItem {
		position: relative;
		border-radius: 8px;
		overflow: hidden;
		border: 1px solid var(--line);
		cursor: pointer;
		transition: 0.18s;
		&:focus-visible {
			outline: 2px solid var(--red);
			outline-offset: 3px;
		}
		&:hover {
			border-color: var(--red);
			transform: scale(1.01);
			img {
				transform: scale(1.06);
			}
			&::after,
			.cap {
				opacity: 1;
			}
		}
		img {
			width: 100%;
			height: 100%;
			object-fit: cover;
			display: block;
			transition: transform 0.5s;
		}
		&::after {
			content: "";
			position: absolute;
			inset: 0;
			background: linear-gradient(to top, rgba(6, 6, 10, 0.7) 0%, transparent 50%);
			pointer-events: none;
			opacity: 0;
			transition: 0.2s;
		}
		.cap {
			position: absolute;
			bottom: 12px;
			left: 14px;
			font-size: 11px;
			font-weight: 700;
			letter-spacing: 0.1em;
			text-transform: uppercase;
			color: #fff;
			z-index: 2;
			opacity: 0;
			transition: 0.2s;
		}
		&.tall {
			grid-row: span 2;
		}
		&.wide {
			grid-column: span 2;
		}
	}
	.lightbox {
		position: fixed;
		inset: 0;
		z-index: 200;
		display: none;
		grid-template-columns: 72px minmax(0, 1fr) 72px;
		align-items: center;
		background: rgba(5, 5, 9, 0.96);
		padding: 72px 20px 28px;
		&.open {
			display: grid;
		}
		figure {
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			min-width: 0;
			height: 100%;
		}
		img {
			display: block;
			max-width: 100%;
			max-height: calc(100vh - 150px);
			object-fit: contain;
			border-radius: 6px;
			box-shadow: 0 24px 70px rgba(0, 0, 0, 0.65);
		}
		figcaption {
			font-size: 15px;
			font-weight: 600;
			text-align: center;
			margin-top: 14px;
		}
		button {
			width: 48px;
			height: 48px;
			border: 1px solid var(--line);
			border-radius: 50%;
			background: rgba(21, 21, 30, 0.85);
			color: #fff;
			font-size: 30px;
			cursor: pointer;
			transition: 0.15s;
			&:hover {
				border-color: var(--red);
				background: var(--red);
			}
		}
		.close {
			position: absolute;
			right: 22px;
			top: 18px;
			font-size: 24px;
		}
		.next {
			justify-self: end;
		}
		.counter {
			position: absolute;
			left: 22px;
			top: 32px;
			color: var(--muted);
			font-size: 12px;
			font-weight: 700;
			letter-spacing: 0.12em;
			text-transform: uppercase;
		}
	}
	&.lightboxOpen {
		overflow: hidden;
	}
	.standScroll {
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		border: 1px solid var(--line);
		border-radius: 10px;
	}
	table.results {
		width: 100%;
		border-collapse: collapse;
		font-size: 14px;
		min-width: 680px;
		thead th {
			text-align: left;
			color: var(--muted-2);
			font-size: 11px;
			letter-spacing: 0.14em;
			text-transform: uppercase;
			font-weight: 700;
			padding: 15px 14px;
			border-bottom: 2px solid var(--line);
			white-space: nowrap;
			&.num {
				text-align: center;
			}
			&.pts {
				text-align: right;
				padding-right: 18px;
			}
		}
		tbody tr {
			border-bottom: 1px solid var(--line);
			transition: 0.12s;
			&:last-child {
				border-bottom: none;
			}
			&:hover {
				background: var(--bg-3);
			}
			&.podium {
				background: rgba(212, 175, 55, 0.04);
			}
		}
		td {
			padding: 12px 14px;
			vertical-align: middle;
			&.pos {
				font-weight: 900;
				font-size: 18px;
				width: 42px;
				text-align: center;
				&.p1 {
					color: var(--gold);
				}
				&.p2 {
					color: var(--silver);
				}
				&.p3 {
					color: var(--bronze);
				}
			}
			&.drv .nm {
				font-weight: 700;
				font-size: 14px;
				letter-spacing: 0.02em;
				white-space: nowrap;
			}
			&.num {
				text-align: center;
				color: var(--muted);
				font-variant-numeric: tabular-nums;
				font-size: 14px;
				&.fl {
					color: var(--red-soft);
					font-weight: 700;
				}
			}
			&.pts {
				text-align: right;
				font-weight: 900;
				font-size: 16px;
				color: var(--red);
				white-space: nowrap;
				padding-right: 18px;
			}
		}
	}
	.drvCell {
		display: flex;
		align-items: center;
		gap: 12px;
		.avatar {
			width: 38px;
			height: 38px;
			border-radius: 50%;
			overflow: hidden;
			background: var(--bg-3);
			flex-shrink: 0;
			border: 2px solid var(--line);
			svg {
				width: 100%;
				height: 100%;
				display: block;
			}
		}
	}
	.reportGrid {
		display: grid;
		grid-template-columns: 1fr 320px;
		gap: 50px;
		align-items: start;
	}
	.report {
		font-size: 17px;
		line-height: 1.8;
		color: var(--muted);
		p {
			margin-bottom: 20px;
			&:first-of-type {
				color: var(--txt);
				font-size: 19px;
				font-weight: 600;
			}
		}
		strong {
			color: var(--txt);
			font-weight: 700;
		}
		.hl {
			color: var(--red);
			font-weight: 700;
		}
		h3 {
			font-size: 20px;
			font-weight: 900;
			text-transform: uppercase;
			letter-spacing: -0.01em;
			color: var(--txt);
			margin: 30px 0 14px;
		}
	}
	.reportSide {
		background: var(--bg-2);
		border: 1px solid var(--line);
		border-radius: 10px;
		padding: 28px;
		position: sticky;
		top: 84px;
		h4 {
			font-size: 11px;
			font-weight: 700;
			letter-spacing: 0.16em;
			text-transform: uppercase;
			color: var(--red);
			margin-bottom: 18px;
		}
		.fact {
			display: flex;
			justify-content: space-between;
			align-items: center;
			padding: 10px 0;
			border-bottom: 1px solid var(--line);
			font-size: 14px;
			&:last-child {
				border-bottom: none;
			}
			dt.k {
				color: var(--muted);
			}
			dd.v {
				margin: 0;
				font-weight: 700;
				color: var(--txt);
				font-variant-numeric: tabular-nums;
				&.gold {
					color: var(--gold);
				}
				&.red {
					color: var(--red);
				}
			}
		}
	}
	.newsGrid {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		grid-auto-rows: 220px;
		gap: 14px;
	}
	.newsCard {
		position: relative;
		border-radius: 8px;
		overflow: hidden;
		border: 1px solid var(--line);
		background: var(--bg-2);
		display: flex;
		transition: border-color 0.18s;
		&:hover {
			border-color: var(--red);
			img {
				transform: scale(1.06);
			}
		}
		img {
			position: absolute;
			inset: 0;
			width: 100%;
			height: 100%;
			object-fit: cover;
			display: block;
			transition: transform 0.5s;
		}
		&::after {
			content: "";
			position: absolute;
			inset: 0;
			background: linear-gradient(
				to top,
				rgba(6, 6, 10, 0.96) 5%,
				rgba(6, 6, 10, 0.55) 45%,
				transparent 100%
			);
			pointer-events: none;
			z-index: 1;
		}
		.overlay {
			position: relative;
			z-index: 2;
			margin: auto 0 0;
			padding: 18px 18px 16px;
		}
		.meta {
			display: inline-flex;
			align-items: center;
			gap: 10px;
			font-size: 10px;
			font-weight: 700;
			letter-spacing: 0.14em;
			text-transform: uppercase;
			color: var(--red);
			.sep {
				color: var(--muted-2);
			}
			.date {
				color: var(--muted);
			}
		}
		h3 {
			font-size: 19px;
			font-weight: 900;
			text-transform: uppercase;
			line-height: 1.05;
			letter-spacing: -0.01em;
			margin-top: 8px;
			text-shadow: 0 2px 8px rgba(0, 0, 0, 0.6);
		}
	}
	.nextNav {
		background: #0c0c12;
		border-top: 1px solid var(--line);
		padding: 50px 0;
		.inner {
			display: flex;
			align-items: center;
			justify-content: space-between;
			gap: 24px;
			flex-wrap: wrap;
		}
		.info {
			.tag {
				font-size: 11px;
				font-weight: 700;
				letter-spacing: 0.16em;
				text-transform: uppercase;
				color: var(--muted-2);
			}
			h3 {
				font-size: clamp(22px, 3vw, 32px);
				font-weight: 900;
				text-transform: uppercase;
				margin-top: 6px;
				em {
					color: var(--red);
					font-style: normal;
				}
			}
			.meta {
				font-size: 14px;
				color: var(--muted);
				margin-top: 6px;
			}
		}
		.btnRow {
			display: flex;
			gap: 12px;
		}
	}
	.eventHero .crumb,
	.eventHero .badge,
	.eventHero h1,
	.eventHero .meta,
	.winnerSpot {
		animation: rise 0.7s ease both;
	}
	.eventHero .badge {
		animation-delay: 0.06s;
	}
	.eventHero h1 {
		animation-delay: 0.12s;
	}
	.eventHero .meta {
		animation-delay: 0.18s;
	}
	.winnerSpot {
		animation-delay: 0.24s;
	}
}

/* Event detail page */
body.page-event {
	.eventHero {
		min-height: 470px;
		display: flex;
		align-items: flex-end;
		.bg { display: block; }
		.wrap { width: 100%; padding-bottom: 58px; }
		.crumb {
			display: inline-block;
			margin-bottom: 30px;
			color: var(--muted);
			font-size: 13px;
			font-weight: 700;
			letter-spacing: .08em;
			text-transform: uppercase;
			&:hover { color: var(--txt); }
		}
		.badge { margin-bottom: 16px; }
		.heroLead { max-width: 560px; margin-top: 18px; color: #d0d0d8; font-size: 18px; line-height: 1.45; }
	}
	.eventContent { padding: 72px 0 96px; border-top: 1px solid var(--line); }
	.eventGrid { display: grid; grid-template-columns: minmax(0, 1fr) 310px; gap: 52px; align-items: start; }
	.eventMain { min-width: 0; }
	.panelHead { margin-bottom: 22px; }
	.panelHead h2, .emptyResults h2 { margin-top: 5px; font-size: clamp(28px, 4vw, 42px); font-weight: 900; line-height: 1; text-transform: uppercase; }
	.eyebrow { color: var(--red); font-size: 11px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
	.resultCount { color: var(--muted); font-size: 13px; }
	.results { min-width: 650px; }
	.results tbody tr { border-bottom: 1px solid var(--line); transition: background .15s; }
	.results tbody tr:hover { background: var(--bg-3); }
	.results tbody tr:last-child { border-bottom: 0; }
	.results td { padding: 16px 14px; }
	.results td.pos { font-size: 20px; }
	.results td.drv small { display: block; margin-top: 3px; color: var(--red-soft); font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
	.sideCard { padding: 24px; border: 1px solid var(--line); border-radius: 8px; background: var(--bg-2); }
	.sideCard + .sideCard { margin-top: 14px; }
	.sideCard h3 { margin-top: 8px; font-size: 24px; font-weight: 900; line-height: 1.05; text-transform: uppercase; }
	.sideCard dl { margin-top: 22px; }
	.sideCard dl div { display: flex; justify-content: space-between; gap: 14px; padding: 11px 0; border-bottom: 1px solid var(--line); font-size: 14px; }
	.sideCard dl div:last-child { border-bottom: 0; }
	.sideCard dt { color: var(--muted); }
	.sideCard dd { font-weight: 700; text-align: right; }
	.scheduleCard ol { list-style: none; margin-top: 20px; }
	.scheduleCard li { display: flex; gap: 14px; align-items: center; padding: 12px 0; border-top: 1px solid var(--line); }
	.scheduleCard li > span { color: var(--red); font-size: 11px; font-weight: 900; }
	.scheduleCard strong, .scheduleCard small { display: block; }
	.scheduleCard strong { font-size: 14px; }
	.scheduleCard small { color: var(--muted); font-size: 13px; }
	.sideButton { display: block; width: 100%; margin-top: 14px; text-align: center; }
	.emptyResults { padding: 36px; border: 1px solid var(--line); border-radius: 8px; background: var(--bg-2); }
	.emptyResults p { margin-top: 14px; color: var(--muted); font-size: 17px; }
}

body.page-news {
	.topbar {
		color: var(--red);
	}
	.navCta:hover {
		transform: none;
	}
	.pageHero {
		position: relative;
		overflow: hidden;
		background: #0c0c12;
		border-bottom: 1px solid var(--line);
		.bg {
			position: absolute;
			inset: 0;
			img {
				width: 100%;
				height: 100%;
				object-fit: cover;
				object-position: center 52%;
				opacity: 0.35;
			}
			&::after {
				content: "";
				position: absolute;
				inset: 0;
				background: linear-gradient(
					90deg,
					rgba(12, 12, 18, 0.98),
					rgba(12, 12, 18, 0.68) 58%,
					rgba(12, 12, 18, 0.35)
				);
			}
		}
		.wrap {
			position: relative;
			padding-top: 72px;
			padding-bottom: 66px;
		}
		h1 {
			font-size: clamp(52px, 8vw, 96px);
			font-weight: 900;
			line-height: 0.88;
			text-transform: uppercase;
			margin-top: 15px;
			em {
				color: var(--red);
				font-style: normal;
			}
		}
		p {
			color: var(--muted);
			font-size: 18px;
			max-width: 560px;
			margin-top: 22px;
		}
	}
	.eyebrow {
		color: var(--red);
		font-size: 12px;
		font-weight: 700;
		letter-spacing: 0.18em;
		text-transform: uppercase;
	}
	main {
		padding: 74px 0 90px;
	}
	.archiveHead {
		display: flex;
		align-items: flex-end;
		justify-content: space-between;
		gap: 20px;
		margin-bottom: 34px;
		h2 {
			font-size: clamp(28px, 4vw, 42px);
			font-weight: 900;
			text-transform: uppercase;
		}
		span {
			color: var(--muted-2);
			font-size: 12px;
			font-weight: 700;
			letter-spacing: 0.14em;
			text-transform: uppercase;
		}
	}
	.meta {
		display: flex;
		align-items: center;
		gap: 9px;
		flex-wrap: wrap;
		color: var(--muted);
		font-size: 10px;
		font-weight: 700;
		letter-spacing: 0.13em;
		text-transform: uppercase;
		.cat {
			color: var(--red);
		}
	}
	.leadStory {
		position: relative;
		display: grid;
		grid-template-columns: 1.15fr 0.85fr;
		min-height: 410px;
		background: var(--bg-2);
		border: 1px solid var(--line);
		border-radius: 12px;
		overflow: hidden;
		margin-bottom: 18px;
		transition: 0.18s;
		&:hover {
			border-color: var(--red);
			transform: translateY(-2px);
		}
		.image {
			min-height: 410px;
		}
		img {
			width: 100%;
			height: 100%;
			object-fit: cover;
			display: block;
		}
		.copy {
			padding: 48px;
			display: flex;
			flex-direction: column;
			justify-content: center;
		}
		h2 {
			font-size: clamp(30px, 4vw, 48px);
			font-weight: 900;
			line-height: 0.95;
			text-transform: uppercase;
			margin-top: 17px;
		}
		p {
			color: var(--muted);
			font-size: 16px;
			margin-top: 18px;
		}
		.read {
			color: var(--red);
			font-size: 12px;
			font-weight: 700;
			letter-spacing: 0.1em;
			text-transform: uppercase;
			margin-top: 25px;
		}
	}
	.newsGrid {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 18px;
	}
	.card {
		background: var(--bg-2);
		border: 1px solid var(--line);
		border-radius: 9px;
		overflow: hidden;
		transition: 0.18s;
		&:hover {
			border-color: var(--red);
			transform: translateY(-3px);
			img {
				transform: scale(1.05);
			}
		}
		.image {
			height: 190px;
			overflow: hidden;
			background: var(--bg-3);
		}
		img {
			width: 100%;
			height: 100%;
			object-fit: cover;
			display: block;
			transition: transform 0.45s;
		}
		.copy {
			padding: 19px 20px 21px;
		}
		h3 {
			font-size: 21px;
			font-weight: 900;
			line-height: 1.08;
			text-transform: uppercase;
			margin-top: 10px;
		}
		p {
			color: var(--muted);
			font-size: 13px;
			line-height: 1.55;
			margin-top: 11px;
		}
	}
}

body.page-news-post {
	.topbar .left {
		color: var(--red);
	}
	.btn {
		gap: 0;
		padding: 13px 22px;
		font-size: 13px;
	}
	.articleHero {
		position: relative;
		min-height: 570px;
		display: flex;
		align-items: flex-end;
		overflow: hidden;
		border-bottom: 1px solid var(--line);
		.bg {
			position: absolute;
			inset: 0;
			img {
				width: 100%;
				height: 100%;
				object-fit: cover;
				object-position: center 42%;
				display: block;
			}
			&::after {
				content: "";
				position: absolute;
				inset: 0;
				background: linear-gradient(
					90deg,
					rgba(8, 8, 13, 0.94) 0%,
					rgba(8, 8, 13, 0.62) 55%,
					rgba(8, 8, 13, 0.2) 100%
				);
			}
		}
		&::after {
			content: "";
			position: absolute;
			inset: auto 0 0;
			height: 55%;
			background: linear-gradient(transparent, var(--bg));
		}
		.wrap {
			position: relative;
			z-index: 2;
			width: 100%;
			padding-top: 70px;
			padding-bottom: 58px;
		}
		h1 {
			font-size: clamp(46px, 7vw, 88px);
			font-weight: 900;
			line-height: 0.9;
			letter-spacing: -0.02em;
			text-transform: uppercase;
			max-width: 850px;
			margin-top: 20px;
			em {
				color: var(--red);
				font-style: normal;
			}
		}
		.dek {
			font-size: 19px;
			line-height: 1.55;
			max-width: 680px;
			color: rgba(242, 242, 247, 0.82);
			margin-top: 24px;
		}
	}
	.articleMeta {
		display: flex;
		align-items: center;
		gap: 12px;
		flex-wrap: wrap;
		color: var(--muted);
		font-size: 12px;
		font-weight: 700;
		letter-spacing: 0.12em;
		text-transform: uppercase;
		.tag {
			color: #fff;
			background: var(--red);
			padding: 6px 11px;
			border-radius: 3px;
		}
	}
	section {
		padding: 80px 0;
		border-top: 1px solid var(--line);
	}
	.storyGrid {
		display: grid;
		grid-template-columns: minmax(0, 1fr) 320px;
		gap: 64px;
		align-items: start;
	}
	.story {
		font-size: 18px;
		line-height: 1.8;
		color: var(--muted);
		.lead {
			color: var(--txt);
			font-size: 21px;
			font-weight: 600;
			line-height: 1.65;
		}
		p {
			margin-bottom: 24px;
		}
		h2 {
			color: var(--txt);
			font-size: 24px;
			font-weight: 900;
			text-transform: uppercase;
			margin: 38px 0 14px;
		}
		strong {
			color: var(--txt);
		}
		.highlight {
			color: var(--red-soft);
			font-weight: 700;
		}
		a {
			color: var(--txt);
			text-decoration: underline;
			text-decoration-color: var(--red-soft);
			text-underline-offset: 3px;
			&:hover {
				color: var(--red-soft);
			}
		}
		h3 {
			color: var(--txt);
			font-size: 18px;
			font-weight: 800;
			text-transform: uppercase;
			margin: 28px 0 10px;
		}
		ul,
		ol {
			margin: 0 0 24px;
			padding-left: 22px;
		}
		li {
			margin-bottom: 8px;
		}
		blockquote {
			margin: 0 0 24px;
			padding: 4px 0 4px 18px;
			border-left: 3px solid var(--red);
			color: var(--muted);
			font-style: italic;
			p {
				margin: 0;
			}
		}
		hr {
			border: 0;
			border-top: 1px solid var(--line);
			margin: 28px 0;
		}
		img {
			max-width: 100%;
			height: auto;
			border-radius: 8px;
			border: 1px solid var(--line);
			margin: 4px 0 24px;
		}
		code {
			background: var(--bg-3);
			border: 1px solid var(--line);
			border-radius: 4px;
			padding: 2px 6px;
			font-size: 0.88em;
		}
	}
	.facts {
		position: sticky;
		top: 88px;
		background: var(--bg-2);
		border: 1px solid var(--line);
		border-radius: 10px;
		padding: 26px;
		h3 {
			font-size: 12px;
			color: var(--red);
			font-weight: 700;
			letter-spacing: 0.16em;
			text-transform: uppercase;
			margin-bottom: 15px;
		}
	}
	.fact {
		display: flex;
		justify-content: space-between;
		gap: 20px;
		padding: 11px 0;
		border-bottom: 1px solid var(--line);
		font-size: 14px;
		&:last-child {
			border-bottom: none;
		}
		dt {
			color: var(--muted);
		}
		dd {
			text-align: right;
		}
	}
	.facts dl {
		margin: 0;
	}
	.facts h3:not(:first-child) {
		margin-top: 26px;
	}
	.factLink {
		display: block;
		width: 100%;
		margin-top: 14px;
		padding: 11px 14px;
		border: 1px solid var(--line);
		border-radius: 7px;
		font-size: 13px;
		font-weight: 700;
		letter-spacing: 0.04em;
		text-transform: uppercase;
		text-align: center;
		text-decoration: none;
		color: var(--txt);
		background: transparent;
		cursor: pointer;
		font-family: inherit;
		&:hover {
			border-color: var(--red);
			color: var(--red-soft);
		}
	}
	.factNews {
		list-style: none;
		margin: 0;
		padding: 0;
		li {
			border-top: 1px solid var(--line);
			&:first-child {
				border-top: 0;
			}
		}
		a {
			display: flex;
			gap: 12px;
			align-items: center;
			padding: 11px 0;
			text-decoration: none;
			color: var(--txt);
			&:hover span {
				color: var(--red-soft);
			}
		}
		img {
			width: 44px;
			height: 44px;
			border-radius: 6px;
			object-fit: cover;
			border: 1px solid var(--line);
			flex-shrink: 0;
		}
		span {
			font-size: 14px;
			font-weight: 700;
			line-height: 1.25;
		}
	}
	.gallerySection {
		background: #0c0c12;
	}
	.gallery {
		display: grid;
		grid-template-columns: repeat(4, 1fr);
		grid-auto-rows: 190px;
		gap: 12px;
	}
	.photo {
		position: relative;
		overflow: hidden;
		border: 1px solid var(--line);
		border-radius: 8px;
		background: var(--bg-2);
		cursor: zoom-in;
		&:focus-visible {
			outline: 2px solid var(--red);
			outline-offset: 3px;
		}
		&.wide {
			grid-column: span 2;
		}
		&.tall {
			grid-row: span 2;
		}
		img {
			width: 100%;
			height: 100%;
			object-fit: cover;
			display: block;
			transition: transform 0.45s;
		}
		&:hover img {
			transform: scale(1.05);
		}
		&::after {
			content: "";
			position: absolute;
			inset: 0;
			background: linear-gradient(transparent 52%, rgba(0, 0, 0, 0.8));
			pointer-events: none;
		}
		figcaption {
			position: absolute;
			z-index: 1;
			left: 15px;
			bottom: 12px;
			font-size: 11px;
			font-weight: 700;
			letter-spacing: 0.1em;
			text-transform: uppercase;
		}
	}
	.resultsScroll {
		overflow-x: auto;
		border: 1px solid var(--line);
		border-radius: 10px;
	}
	table.results {
		width: 100%;
		border-collapse: collapse;
		min-width: 680px;
		font-size: 14px;
		th {
			text-align: left;
			color: var(--muted-2);
			font-size: 11px;
			letter-spacing: 0.14em;
			text-transform: uppercase;
			padding: 15px 14px;
			border-bottom: 2px solid var(--line);
		}
		th.num,
		td.num {
			text-align: center;
		}
		th.pts,
		td.pts {
			text-align: right;
			padding-right: 20px;
		}
		tbody tr {
			border-bottom: 1px solid var(--line);
			&:last-child {
				border-bottom: none;
			}
			&:hover {
				background: var(--bg-3);
			}
		}
		td {
			padding: 13px 14px;
			vertical-align: middle;
			&.pos {
				width: 44px;
				text-align: center;
				font-size: 18px;
				font-weight: 900;
				&.p1 {
					color: var(--gold);
				}
				&.p2 {
					color: var(--silver);
				}
				&.p3 {
					color: var(--bronze);
				}
			}
			&.num {
				color: var(--muted);
				font-variant-numeric: tabular-nums;
			}
			&.fast {
				color: var(--red-soft);
				font-weight: 700;
			}
			&.pts {
				font-size: 17px;
				font-weight: 900;
				color: var(--red);
			}
		}
	}
	.driver {
		display: flex;
		align-items: center;
		gap: 12px;
		font-weight: 700;
	}
	.avatar {
		width: 38px;
		height: 38px;
		border-radius: 50%;
		overflow: hidden;
		background: var(--bg-3);
		border: 2px solid var(--line);
		flex-shrink: 0;
		svg {
			width: 100%;
			height: 100%;
			display: block;
		}
	}
	.resultsNote {
		color: var(--muted-2);
		font-size: 12px;
		margin-top: 14px;
	}
	.lightbox {
		position: fixed;
		inset: 0;
		z-index: 200;
		display: none;
		grid-template-columns: 72px minmax(0, 1fr) 72px;
		align-items: center;
		background: rgba(5, 5, 9, 0.96);
		padding: 72px 20px 28px;
		&.open {
			display: grid;
		}
		figure {
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			min-width: 0;
			height: 100%;
			margin: 0;
		}
		img {
			display: block;
			max-width: 100%;
			max-height: calc(100vh - 150px);
			object-fit: contain;
			border-radius: 6px;
			box-shadow: 0 24px 70px rgba(0, 0, 0, 0.65);
		}
		figcaption {
			font-size: 15px;
			font-weight: 600;
			text-align: center;
			margin-top: 14px;
		}
		button {
			display: grid;
			place-items: center;
			width: 48px;
			height: 48px;
			padding: 0;
			border: 1px solid var(--line);
			border-radius: 50%;
			background: rgba(21, 21, 30, 0.9);
			color: #fff;
			font-family: inherit;
			font-size: 30px;
			line-height: 1;
			cursor: pointer;
			transition: 0.15s;
			&:hover,
			&:focus-visible {
				border-color: var(--red);
				background: var(--red);
				outline: none;
			}
		}
		.close {
			position: absolute;
			right: 22px;
			top: 18px;
			font-size: 24px;
		}
		.prev {
			justify-self: start;
		}
		.next {
			justify-self: end;
		}
		.counter {
			position: absolute;
			left: 22px;
			top: 32px;
			color: var(--muted);
			font-size: 12px;
			font-weight: 700;
			letter-spacing: 0.12em;
			text-transform: uppercase;
		}
	}
	&.lightboxOpen {
		overflow: hidden;
	}
	.backBand {
		background: #0c0c12;
		padding: 48px 0;
		border-top: 1px solid var(--line);
		.wrap {
			display: flex;
			justify-content: space-between;
			align-items: center;
			gap: 20px;
			flex-wrap: wrap;
		}
		h2 {
			font-size: 26px;
			font-weight: 900;
			text-transform: uppercase;
		}
	}
}

body.page-rules {
	line-height: 1.55;
	.topbar {
		color: var(--red);
	}
	.navCta:hover {
		transform: none;
	}
	.hero {
		position: relative;
		overflow: hidden;
		background: #0c0c12;
		border-bottom: 1px solid var(--line);
		.bg {
			position: absolute;
			inset: 0;
			img {
				width: 100%;
				height: 100%;
				object-fit: cover;
				object-position: center 42%;
				opacity: 0.3;
			}
			&::after {
				content: "";
				position: absolute;
				inset: 0;
				background: linear-gradient(
					90deg,
					rgba(12, 12, 18, 0.98),
					rgba(12, 12, 18, 0.72) 60%,
					rgba(12, 12, 18, 0.4)
				);
			}
		}
		.wrap {
			position: relative;
			padding-top: 72px;
			padding-bottom: 66px;
		}
		h1 {
			font-size: clamp(52px, 8vw, 96px);
			font-weight: 900;
			line-height: 0.88;
			text-transform: uppercase;
			margin-top: 15px;
			em {
				color: var(--red);
				font-style: normal;
			}
		}
		p {
			color: var(--muted);
			font-size: 18px;
			max-width: 650px;
			margin-top: 22px;
		}
	}
	.eyebrow {
		color: var(--red);
		font-size: 12px;
		font-weight: 700;
		letter-spacing: 0.18em;
		text-transform: uppercase;
	}
	.updated {
		display: inline-block;
		color: var(--muted-2);
		border: 1px solid var(--line);
		border-radius: 4px;
		padding: 6px 10px;
		font-size: 10px;
		font-weight: 700;
		letter-spacing: 0.12em;
		text-transform: uppercase;
		margin-top: 24px;
	}
	main {
		padding: 72px 0 90px;
	}
	.rulesLayout {
		display: grid;
		grid-template-columns: 250px minmax(0, 760px);
		gap: 70px;
		justify-content: center;
		align-items: start;
	}
	.toc {
		position: sticky;
		top: 92px;
		background: var(--bg-2);
		border: 1px solid var(--line);
		border-radius: 9px;
		padding: 22px;
		h2 {
			color: var(--red);
			font-size: 11px;
			font-weight: 700;
			letter-spacing: 0.16em;
			text-transform: uppercase;
			margin-bottom: 12px;
		}
		ol {
			list-style: none;
			counter-reset: toc;
		}
		li {
			counter-increment: toc;
			border-bottom: 1px solid var(--line);
			&:last-child {
				border-bottom: 0;
			}
		}
		a {
			display: flex;
			gap: 9px;
			color: var(--muted);
			font-size: 13px;
			padding: 9px 0;
			&::before {
				content: counter(toc, decimal-leading-zero);
				color: var(--muted-2);
				font-size: 10px;
				font-weight: 700;
				padding-top: 2px;
			}
			&:hover {
				color: var(--txt);
			}
		}
	}
	.intro {
		border-left: 4px solid var(--red);
		background: var(--bg-2);
		border-radius: 0 9px 9px 0;
		padding: 24px 26px;
		margin-bottom: 42px;
		strong {
			font-size: 21px;
		}
		p {
			color: var(--muted);
			margin-top: 7px;
		}
	}
	.ruleSection {
		scroll-margin-top: 90px;
		padding: 0 0 42px;
		margin-bottom: 42px;
		border-bottom: 1px solid var(--line);
		&:last-child {
			border-bottom: 0;
			margin-bottom: 0;
		}
		& > p {
			color: var(--muted);
			font-size: 16px;
			line-height: 1.75;
			margin-bottom: 16px;
		}
		strong {
			color: var(--txt);
		}
	}
	.ruleHead {
		display: grid;
		grid-template-columns: 46px 1fr;
		gap: 16px;
		align-items: start;
		margin-bottom: 20px;
		h2 {
			font-size: 29px;
			font-weight: 900;
			line-height: 1;
			text-transform: uppercase;
		}
		p {
			color: var(--muted-2);
			font-size: 12px;
			font-weight: 700;
			letter-spacing: 0.1em;
			text-transform: uppercase;
			margin-top: 6px;
		}
	}
	.ruleNo {
		width: 46px;
		height: 46px;
		display: grid;
		place-items: center;
		background: var(--red);
		border-radius: 6px;
		font-size: 17px;
		font-weight: 900;
	}
	.rules {
		list-style: none;
		display: grid;
		gap: 10px;
		li {
			position: relative;
			color: var(--muted);
			background: var(--bg-2);
			border: 1px solid var(--line);
			border-radius: 7px;
			padding: 14px 16px 14px 42px;
			&::before {
				content: "";
				position: absolute;
				left: 17px;
				top: 22px;
				width: 8px;
				height: 8px;
				border: 2px solid var(--red);
				border-radius: 50%;
			}
		}
	}
	.points {
		width: 100%;
		border-collapse: collapse;
		margin-top: 18px;
		background: var(--bg-2);
		border: 1px solid var(--line);
		border-radius: 8px;
		overflow: hidden;
		th,
		td {
			padding: 11px 14px;
			border-bottom: 1px solid var(--line);
			text-align: left;
		}
		th {
			color: var(--muted-2);
			font-size: 10px;
			letter-spacing: 0.12em;
			text-transform: uppercase;
			&:last-child {
				text-align: right;
			}
		}
		td:last-child {
			color: var(--red);
			font-size: 17px;
			font-weight: 900;
			text-align: right;
		}
		tr:last-child td {
			border-bottom: 0;
		}
	}
	.pointsRules {
		margin-top: 12px;
	}
	.note {
		color: var(--muted) !important;
		background: color-mix(in srgb, var(--red) 8%, transparent);
		border: 1px solid color-mix(in srgb, var(--red) 28%, transparent);
		border-radius: 7px;
		padding: 14px 16px;
		margin-top: 16px;
		margin-bottom: 16px;
	}
	.penalties {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 10px;
		margin-top: 18px;
	}
	.penalty {
		background: var(--bg-2);
		border: 1px solid var(--line);
		border-radius: 7px;
		padding: 16px;
		strong {
			display: block;
			font-size: 16px;
			text-transform: uppercase;
		}
		span {
			display: block;
			color: var(--muted);
			font-size: 13px;
			margin-top: 5px;
		}
	}
	.closing {
		background: #0c0c12;
		border-top: 1px solid var(--line);
		padding: 50px 0;
		.wrap {
			display: flex;
			align-items: center;
			justify-content: space-between;
			gap: 24px;
			flex-wrap: wrap;
		}
		h2 {
			font-size: 28px;
			font-weight: 900;
			text-transform: uppercase;
		}
		p {
			color: var(--muted);
			margin-top: 5px;
		}
	}
	.btn {
		padding: 13px 22px;
		font-size: 13px;
	}
}

body.page-admin {
	.raceNotes {
		resize: vertical;
		min-height: 100px;
		width: 100%;
		border: 1px solid var(--line);
		border-radius: 5px;
		background: #101017;
		color: var(--txt);
		font: inherit;
		padding: 10px 12px;
		outline: none;
	}
	.adminBar {
		background: #0c0c12;
		border-bottom: 1px solid var(--line);
		padding: 18px 0;
		.wrap {
			display: flex;
			align-items: center;
			justify-content: space-between;
			gap: 20px;
		}
		h1 {
			font-size: 28px;
			font-weight: 900;
			line-height: 1;
			text-transform: uppercase;
			margin-top: 4px;
		}
	}
	.eyebrow {
		color: var(--red);
		font-size: 11px;
		font-weight: 700;
		letter-spacing: 0.18em;
		text-transform: uppercase;
	}
	.adminMark {
		color: var(--muted-2);
		font-size: 11px;
		font-weight: 700;
		letter-spacing: 0.12em;
		text-transform: uppercase;
	}
	.adminNav {
		display: flex;
		gap: 0;
		margin-top: 14px;
		a,
		.isActive {
			font-size: 12px;
			font-weight: 700;
			letter-spacing: 0.09em;
			text-transform: uppercase;
			padding: 6px 14px;
			border-radius: 4px;
		}
		a {
			color: var(--muted);
			text-decoration: none;
			&:hover {
				color: var(--txt);
				background: rgba(255, 255, 255, 0.06);
			}
		}
		.isActive {
			color: var(--red);
			background: color-mix(in srgb, var(--red) 12%, transparent);
		}
	}
	.memberStatus {
		font-size: 11px;
		font-weight: 700;
		letter-spacing: 0.07em;
		text-transform: uppercase;
		padding: 3px 8px;
		border-radius: 3px;
		white-space: nowrap;
		&.memberStatus--pending {
			color: #f0b429;
			background: rgba(240, 180, 41, 0.12);
		}
		&.memberStatus--approved {
			color: #3ddc84;
			background: rgba(61, 220, 132, 0.12);
		}
		&.memberStatus--banned {
			color: #ff6b5e;
			background: rgba(255, 107, 94, 0.12);
		}
		&.memberStatus--published {
			color: #3ddc84;
			background: rgba(61, 220, 132, 0.12);
		}
		&.memberStatus--draft {
			color: #f0b429;
			background: rgba(240, 180, 41, 0.12);
		}
		&.memberStatus--provisional {
			color: #60a5fa;
			background: rgba(96, 165, 250, 0.12);
		}
		&.memberStatus--completed {
			color: #3ddc84;
			background: rgba(61, 220, 132, 0.12);
		}
		&.memberStatus--cancelled {
			color: #ff6b5e;
			background: rgba(255, 107, 94, 0.12);
		}
	}
	.statusCounts {
		display: flex;
		gap: 10px;
		flex-wrap: wrap;
	}
	.statusCount {
		font-size: 11px;
		font-weight: 700;
		letter-spacing: 0.07em;
		text-transform: uppercase;
		padding: 3px 8px;
		border-radius: 3px;
		color: var(--muted-2);
		border: 1px solid var(--line);
	}
	.memberExperience {
		max-width: 260px;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
	.memberDate {
		font-variant-numeric: tabular-nums;
		white-space: nowrap;
	}
	main {
		padding: 44px 0 70px;
	}
	.panel {
		background: var(--bg-2);
		border: 1px solid var(--line);
		border-radius: 10px;
		padding: 28px;
		margin-bottom: 20px;
		h2 {
			font-size: 22px;
			font-weight: 900;
			line-height: 1;
			text-transform: uppercase;
		}
	}
	.panelHead {
		display: flex;
		align-items: flex-end;
		justify-content: space-between;
		gap: 20px;
		margin-bottom: 22px;
	}
	.panelIntro {
		color: var(--muted);
		font-size: 14px;
		margin-top: 7px;
	}
	.panel--digest .panelHead {
		align-items: center;
	}
	.digestMeta {
		display: grid;
		grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
		gap: 12px 24px;
		margin-top: 18px;
		padding-top: 18px;
		border-top: 1px solid var(--line);
		div {
			min-width: 0;
		}
		dt {
			font-size: 10px;
			font-weight: 700;
			letter-spacing: 0.14em;
			text-transform: uppercase;
			color: var(--muted-2);
			margin-bottom: 4px;
		}
		dd {
			font-size: 14px;
			font-weight: 700;
			color: var(--txt);
		}
		.digestMetaNote {
			grid-column: 1 / -1;
			dd {
				color: var(--muted);
				font-weight: 400;
			}
		}
	}
	.galleryBlock {
		border: 1px solid var(--line);
		border-radius: 8px;
		padding: 14px;
	}
	.galleryLabel {
		display: block;
		margin-bottom: 10px;
		font-size: 11px;
		font-weight: 700;
		letter-spacing: 0.12em;
		text-transform: uppercase;
		color: var(--muted-2);
	}
	.galleryGrid {
		display: flex;
		flex-wrap: wrap;
		gap: 12px;
		margin-bottom: 12px;
	}
	.galleryItem {
		border: 1px solid var(--line);
		border-radius: 6px;
		overflow: hidden;
		background: #101017;
		img {
			display: block;
			width: 140px;
			height: 105px;
			object-fit: cover;
		}
	}
	.galleryRemove {
		display: flex;
		align-items: center;
		gap: 6px;
		padding: 5px 8px;
		font-size: 11px;
		font-weight: 700;
		text-transform: uppercase;
		letter-spacing: 0.08em;
		color: var(--red);
		input {
			width: 14px;
			height: 14px;
			accent-color: var(--red);
		}
	}
	.formGrid {
		display: grid;
		grid-template-columns: repeat(5, 1fr);
		gap: 16px;
	}
	label {
		display: flex;
		flex-direction: column;
		gap: 7px;
		color: var(--muted-2);
		font-size: 11px;
		font-weight: 700;
		letter-spacing: 0.12em;
		text-transform: uppercase;
	}
	input,
	select,
	textarea {
		width: 100%;
		border: 1px solid var(--line);
		border-radius: 5px;
		background: #101017;
		color: var(--txt);
		font: inherit;
		font-size: 15px;
		padding: 10px 12px;
		outline: none;
		&:focus {
			border-color: var(--red);
			box-shadow: 0 0 0 2px color-mix(in srgb, var(--red) 15%, transparent);
		}
	}
	.resultScroll {
		overflow-x: auto;
		border: 1px solid var(--line);
		border-radius: 8px;
	}
	table {
		width: 100%;
		border-collapse: collapse;
		min-width: 780px;
	}
	th {
		text-align: left;
		color: var(--muted-2);
		font-size: 10px;
		letter-spacing: 0.14em;
		text-transform: uppercase;
		padding: 13px 12px;
		border-bottom: 2px solid var(--line);
		white-space: nowrap;
	}
	td {
		padding: 10px 12px;
		border-bottom: 1px solid var(--line);
		vertical-align: middle;
		&:first-child {
			color: var(--muted-2);
			font-weight: 900;
			width: 42px;
			text-align: center;
		}
		&.driverName {
			font-weight: 700;
			min-width: 180px;
		}
		input {
			min-width: 90px;
			padding: 8px 9px;
		}
	}
	tr:last-child td {
		border-bottom: 0;
	}
	.checkCell {
		text-align: center;
		input {
			width: 18px;
			height: 18px;
			accent-color: var(--red);
		}
	}
	.uploadBox {
		display: grid;
		grid-template-columns: 1fr auto;
		align-items: center;
		gap: 24px;
		border: 1px dashed #484856;
		border-radius: 8px;
		background: #15151e;
		padding: 24px;
		h3 {
			font-size: 18px;
			font-weight: 900;
			text-transform: uppercase;
		}
		p {
			max-width: 650px;
			color: var(--muted);
			font-size: 14px;
			margin-top: 5px;
		}
	}
	.fileInput {
		max-width: 360px;
		background: #101017;
	}
	.aiNote {
		display: flex;
		align-items: center;
		gap: 8px;
		color: var(--red-soft);
		font-size: 11px;
		font-weight: 700;
		letter-spacing: 0.1em;
		text-transform: uppercase;
		margin-top: 12px;
		&::before {
			content: "AI";
			display: grid;
			place-items: center;
			width: 28px;
			height: 22px;
			border: 1px solid color-mix(in srgb, var(--red) 45%, transparent);
			border-radius: 3px;
			background: color-mix(in srgb, var(--red) 10%, transparent);
			font-size: 9px;
		}
	}
	.newsEditSplit {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 20px;
		align-items: start;
	}
	.langTag {
		display: inline-grid;
		place-items: center;
		min-width: 36px;
		height: 24px;
		padding: 0 8px;
		border-radius: 3px;
		font-size: 11px;
		font-weight: 900;
		letter-spacing: 0.1em;
		&.langTag--en {
			color: #fff;
			background: var(--red);
		}
		&.langTag--de {
			color: var(--muted);
			border: 1px solid var(--line);
		}
	}
	.panel--auto {
		border-style: dashed;
		background: #111119;
		.panelHead {
			margin-bottom: 16px;
		}
		.panelHead h2 {
			color: var(--muted);
		}
	}
	.fieldStack {
		display: flex;
		flex-direction: column;
		gap: 16px;
	}
	.langGrid {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 16px;
	}
	.spanAll {
		grid-column: 1 / -1;
	}
	.contentLabel {
		margin-top: 16px;
	}
	.readOnlyRow {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 12px;
	}
	.readOnlyField {
		display: flex;
		flex-direction: column;
		gap: 7px;
		border: 1px solid var(--line);
		border-radius: 5px;
		background: #0d0d13;
		padding: 10px 12px;
		min-width: 0;
		> span {
			color: var(--muted-2);
			font-size: 11px;
			font-weight: 700;
			letter-spacing: 0.12em;
			text-transform: uppercase;
		}
		> p {
			margin: 0;
			color: var(--txt);
			font-size: 15px;
			line-height: 1.5;
			overflow-wrap: anywhere;
		}
	}
	.preWrap {
		white-space: pre-wrap;
	}
	.markdownPreview {
		max-height: 540px;
		overflow-y: auto;
		font-family: monospace;
		font-size: 13px;
		line-height: 1.6;
		color: var(--muted);
	}
	.newsBody {
		display: block;
		width: 100%;
		font-family: monospace;
		font-size: 14px;
		line-height: 1.6;
		resize: vertical;
	}
	.actions {
		display: flex;
		justify-content: space-between;
		align-items: center;
		gap: 16px;
		flex-wrap: wrap;
	}
	.actionsNote {
		color: var(--muted-2);
		font-size: 12px;
	}
	.buttonRow {
		display: flex;
		gap: 10px;
		flex-wrap: wrap;
	}
	button,
	.button {
		border: 0;
		border-radius: 4px;
		padding: 12px 20px;
		font: 700 13px inherit;
		letter-spacing: 0.08em;
		text-transform: uppercase;
		cursor: pointer;
		text-decoration: none;
	}
	.primary {
		background: var(--red);
		color: #fff;
		&:hover {
			background: var(--red-soft);
		}
	}
	.secondary {
		background: transparent;
		color: var(--txt);
		border: 1px solid var(--line);
		&:hover {
			border-color: var(--txt);
		}
	}
	.danger {
		color: #ff817a;
		background: transparent;
		border: 1px solid color-mix(in srgb, var(--red) 35%, transparent);
	}
	.status {
		display: inline-flex;
		align-items: center;
		gap: 8px;
		color: var(--gold);
		font-size: 11px;
		font-weight: 700;
		letter-spacing: 0.1em;
		text-transform: uppercase;
		&::before {
			content: "";
			width: 7px;
			height: 7px;
			background: var(--gold);
			border-radius: 50%;
		}
	}
}

.languageNotice {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 16px;
	padding: 12px 20px;
	background: #f0c541;
	color: #15151e;
	font-weight: 700;

	&[hidden] {
		display: none;
	}

	a {
		color: #15151e;
		text-decoration: underline;
	}

	button {
		border: 0;
		background: transparent;
		color: #15151e;
		font-size: 22px;
		cursor: pointer;
	}
}

.languageChoice {
	display: grid;
	place-items: center;
	min-height: 100vh;
	background: var(--bg);
	color: var(--txt);
	text-align: center;

	main {
		padding: 30px;
	}

	img {
		width: 90px;
	}

	h1 {
		margin: 12px 0 28px;
		font-size: clamp(32px, 6vw, 64px);
		text-transform: uppercase;
	}

	.btn + .btn {
		margin-left: 10px;
	}
}

.page-error {
	background: radial-gradient(circle at 50% 30%, #292936 0, var(--bg) 48%);
}

.errorPage {
	display: grid;
	place-items: center;
	align-content: center;
	min-height: 100vh;
	padding: 32px 20px;
	text-align: center;

	.errorCar {
		font-size: 70px;
		filter: grayscale(1);
		transform: scaleX(-1);
		margin-bottom: 12px;
	}

	.eyebrow {
		color: var(--red);
		font-size: 12px;
		font-weight: 700;
		letter-spacing: 0.18em;
		text-transform: uppercase;
	}

	h1 {
		color: var(--red);
		font-size: clamp(100px, 22vw, 240px);
		font-weight: 900;
		line-height: 0.8;
		letter-spacing: -0.06em;
		margin: 18px 0 26px;
	}

	h2 {
		font-size: clamp(28px, 5vw, 48px);
		font-weight: 900;
		text-transform: uppercase;
	}

	p {
		max-width: 560px;
		margin: 14px auto 0;
		color: var(--muted);
		font-size: 18px;
		line-height: 1.5;
	}

	.errorActions {
		display: flex;
		justify-content: center;
		gap: 12px;
		flex-wrap: wrap;
		margin-top: 30px;
	}
}

.authPanel {
	max-width: 560px;
	margin: 0 auto;

	form {
		display: grid;
		gap: 18px;
	}

	.checkboxLabel {
		flex-direction: row;
		align-items: center;

		input {
			width: auto;
		}
	}
}

.formError,
.errorSummary {
	color: #ff817a;
}

.errorSummary,
.successMessage {
	margin-bottom: 20px;
	border: 1px solid currentColor;
	border-radius: 6px;
	padding: 14px 18px;
}

.successMessage {
	color: #62d394;
}

.legalPage {
	max-width: 800px;
	padding-top: 80px;
	padding-bottom: 80px;

	h1 {
		font-size: clamp(42px, 7vw, 76px);
		text-transform: uppercase;
	}

	.legalNote {
		margin-top: 24px;
		padding: 18px 22px;
		background: var(--bg-2);
		border: 1px solid var(--line);
		border-left: 4px solid var(--red);
		border-radius: 8px;

		p {
			margin-top: 0;
			color: var(--txt);
			font-style: italic;
			font-size: 16px;
			line-height: 1.6;
		}
	}

	h2 {
		margin-top: 35px;
	}

	h3 {
		margin-top: 30px;
	}

	p {
		margin-top: 12px;
		color: var(--muted);
		font-size: 18px;
		line-height: 1.7;
	}
}

/* Responsive rules */
@media (max-width: 960px) {
	body.page-home {
		.heroGrid,
		.trackSection .inner {
			grid-template-columns: 1fr;
		}
	}
	:is(body.page-home, body.page-season) {
		.raceCard {
			grid-template-columns: 90px 1fr;
			column-gap: 16px;
			.thumb {
				display: none;
			}
			.dateBlock {
				grid-row: 1 / span 2;
				padding: 14px 8px;
				.d {
					font-size: 26px;
				}
			}
			.info,
			.raceActions {
				grid-column: 2;
			}
			.info {
				padding: 14px 16px 0 0;
			}
			.raceActions {
				align-self: auto;
				align-items: flex-start;
				gap: 9px;
				padding: 10px 16px 14px 0;
			}
			.raceActions__top {
				justify-content: flex-start;
				flex-wrap: wrap;
			}
			.calendarActions {
				justify-content: flex-start;
			}
			.calendarOptions {
				left: 0;
				right: auto;
			}
		}
	}
	body.page-home {
		.newsGrid {
			grid-template-columns: repeat(2, 1fr);
			grid-auto-rows: 200px;
		}
		.newsCard.wide {
			grid-column: span 2;
		}
		.newsCard.big {
			grid-column: span 2;
			grid-row: span 2;
		}
	}
	body.page-event {
		.winnerSpot {
			grid-template-columns: 1fr;
		}
		.gallery,
		.newsGrid {
			grid-template-columns: repeat(2, 1fr);
			grid-auto-rows: 160px;
		}
		.newsGrid {
			grid-auto-rows: 200px;
		}
	}
	body.page-rules {
		.rulesLayout {
			grid-template-columns: 1fr;
			gap: 38px;
		}
		.toc {
			position: static;
			ol {
				columns: 2;
			}
		}
	}
	body.page-news-post {
		.storyGrid {
			grid-template-columns: 1fr;
			gap: 36px;
		}
		.facts {
			position: static;
		}
	}
	body.page-news {
		.newsGrid {
			grid-template-columns: repeat(2, 1fr);
		}
		.leadStory {
			grid-template-columns: 1fr;
			.image {
				min-height: 300px;
				height: 300px;
			}
			.copy {
				padding: 32px;
			}
		}
	}
	body.page-news-post {
		.reportGrid {
			grid-template-columns: 1fr;
		}
	}
	body.page-admin {
		.formGrid {
			grid-template-columns: repeat(2, 1fr);
		}
		.langGrid,
		.readOnlyRow {
			grid-template-columns: 1fr;
		}
		.newsEditSplit {
			grid-template-columns: 1fr;
		}
		.uploadBox {
			grid-template-columns: 1fr;
		}
	}
	body.page-season {
		.pointsPanel {
			grid-template-columns: 1fr;
		}
		.bonusPoints {
			grid-template-columns: repeat(2, 1fr);
		}
	}
}

@media (max-width: 700px) {
	.topbar .right > *:not(.lang) {
		display: none;
	}
	.topbar .left .ped {
		display: none;
	}
	.topbar .wrap {
		height: auto;
		padding: 8px 20px;
	}
	.topbar .left {
		gap: 7px;
	}
	.navActions--top {
		display: flex;
	}
	.navActions--main {
		display: none;
	}
	.navActions {
		gap: 7px;
	}
	.seasonCta,
	.navCta {
		padding: 9px 11px;
		font-size: 11px;
	}
	.eventFormat__head {
		align-items: flex-start;
		flex-direction: column;
	}
	.eventTimeline {
		grid-template-columns: repeat(2, 1fr);
	}
	body.page-event {
		.eventGrid { grid-template-columns: 1fr; gap: 38px; }
		.eventSide { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
		.sideCard + .sideCard { margin-top: 0; }
		.sideButton { margin-top: 0; }
	}
	footer .colGrid {
		grid-template-columns: 1fr;
	}
	.joinDialog {
		h2 {
			font-size: 27px;
		}
		form {
			padding: 22px 20px 24px;
		}
	}
	.joinDialog__head {
		padding: 24px 62px 20px 20px;
	}
	.joinDialog__grid {
		grid-template-columns: 1fr;
	}
	.joinDialog__field--wide {
		grid-column: auto;
	}
	.joinDialog__actions {
		align-items: stretch;
		flex-direction: column;
	}
	.joinDialog__submit {
		width: 100%;
	}
	:is(body.page-home, body.page-season) {
		.stripGrid {
			grid-template-columns: repeat(2, 1fr);
		}
	}
	body.page-season {
		.statsBar {
			grid-template-columns: repeat(2, 1fr);
			max-width: 520px;
			.cell {
				min-height: 98px;
				padding: 18px 20px;
				& + .cell {
					border-left: none;
				}
				&:nth-child(even) {
					border-left: 1px solid #343440;
				}
				&:nth-child(n + 3) {
					border-top: 1px solid #343440;
				}
			}
		}
	}
	body.page-event {
		.infoBar .wrap {
			grid-template-columns: repeat(2, 1fr);
		}
		.infoCell:nth-child(2) {
			border-right: none;
		}
		.infoCell:nth-child(1),
		.infoCell:nth-child(2) {
			border-bottom: 1px solid var(--line);
		}
	}
	body.page-news-post {
		.gallery {
			grid-template-columns: repeat(2, 1fr);
			grid-auto-rows: 170px;
		}
		.articleHero {
			min-height: 520px;
		}
	}
	body.page-admin {
		.panel {
			padding: 20px;
		}
	}
	:is(body.page-home, body.page-season) {
		.drvCell .avatar {
			width: 34px;
			height: 34px;
		}
		table.stand td.pos {
			font-size: 16px;
		}
		table.stand td.tot {
			font-size: 15px;
		}
	}
	body.page-event {
		.drvCell .avatar {
			width: 34px;
			height: 34px;
		}
		table.results td.pos {
			font-size: 16px;
		}
		table.results td.pts {
			font-size: 15px;
		}
	}
	body.page-event,
	body.page-news-post {
		.lightbox {
			grid-template-columns: 52px minmax(0, 1fr) 52px;
			padding: 68px 8px 20px;
			button {
				width: 42px;
				height: 42px;
			}
			img {
				max-height: calc(100vh - 170px);
			}
		}
	}
	body.page-event {
		.eventHero { min-height: 430px; }
		.eventHero .wrap { padding-bottom: 42px; }
		.eventHero .meta { gap: 10px 18px; }
		.eventContent { padding: 52px 0 70px; }
		.eventSide { grid-template-columns: 1fr; }
		.eventHero h1 { font-size: 54px; }
		.eventHero .heroLead { font-size: 16px; }
		.infoCell .v { font-size: 15px; }
	}
	body.page-home {
		.newsGrid {
			grid-template-columns: 1fr;
			grid-auto-rows: 220px;
		}
		.newsCard.wide,
		.newsCard.big {
			grid-column: auto;
			grid-row: auto;
		}
	}
	body.page-event {
		.gallery,
		.newsGrid {
			grid-template-columns: 1fr;
			grid-auto-rows: 200px;
		}
		.newsGrid {
			grid-auto-rows: 240px;
		}
		.gItem.tall {
			grid-row: span 1;
		}
		.gItem.wide {
			grid-column: span 1;
		}
	}
	body.page-news {
		.newsGrid {
			grid-template-columns: 1fr;
		}
		.card .image {
			height: 220px;
		}
		.archiveHead {
			align-items: flex-start;
			flex-direction: column;
		}
	}
	body.page-season {
		.finishPoints {
			grid-template-columns: repeat(4, 1fr);
		}
		.pointsPanel {
			padding: 18px;
		}
		.bonusPoints {
			grid-template-columns: 1fr 1fr;
		}
	}
	body.page-rules {
		.toc ol {
			columns: 1;
		}
		.penalties {
			grid-template-columns: 1fr;
		}
		.ruleHead h2 {
			font-size: 24px;
		}
	}
	body.page-news-post {
		.gallery {
			grid-template-columns: 1fr;
			grid-auto-rows: 220px;
		}
		.photo.wide,
		.photo.tall {
			grid-column: auto;
			grid-row: auto;
		}
	}
	body.page-admin {
		.formGrid {
			grid-template-columns: 1fr;
		}
		.adminBar .wrap {
			align-items: flex-start;
			flex-direction: column;
		}
	}
	body.page-event .eventNewsGrid {
		grid-template-columns: 1fr;
	}
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
}

.photoSection {
	padding: 0 0 70px;
}
.newsGallery {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
	gap: 18px;
}
.photoItem {
	display: block;
	overflow: hidden;
	border-radius: 10px;
	border: 1px solid var(--line);
	img {
		display: block;
		width: 100%;
		height: 240px;
		object-fit: cover;
		transition: transform 0.3s ease;
	}
	&:hover img {
		transform: scale(1.03);
	}
}

body.page-event {
	.eventNews {
		margin-bottom: 34px;
	}
	.eventNewsGrid {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 18px;
	}
	.eventNewsItem {
		background: var(--bg-2);
		border: 1px solid var(--line);
		border-radius: 9px;
		overflow: hidden;
		color: inherit;
		text-decoration: none;
		transition: 0.18s;
		&:hover {
			border-color: var(--red);
			transform: translateY(-3px);
			img {
				transform: scale(1.05);
			}
		}
		.image {
			height: 170px;
			overflow: hidden;
			background: var(--bg-3);
		}
		img {
			width: 100%;
			height: 100%;
			object-fit: cover;
			display: block;
			transition: transform 0.45s;
		}
		.copy {
			padding: 16px 18px 18px;
		}
		.meta {
			color: var(--muted-2);
			font-size: 11px;
			font-weight: 700;
			letter-spacing: 0.08em;
			text-transform: uppercase;
		}
		h3 {
			font-size: 18px;
			font-weight: 900;
			line-height: 1.1;
			text-transform: uppercase;
			margin-top: 8px;
		}
		p {
			color: var(--muted);
			font-size: 13px;
			line-height: 1.55;
			margin-top: 8px;
		}
	}
}