/* ===== Crown Slots Casino — design system (TYPO-03 / SPACE-07 / CONT-01 / GEO-01 / MOTION-05) ===== */
:root {
	/* colors */
	--c-main-color: #7c61ac;
	--c-secondary: #fee203;
	--c-accent-dark: #d6af00;
	--c-surface: #f2f2f6;
	--c-bg-elevated: #ffffff;
	--c-gradient-from: #e7def5;
	--c-grad-mid: #1a192e;
	--c-ink: #1f2936;
	--c-text-muted: #4a4a55;
	--c-color-ink-accent: #6b4f96;
	--c-color-header-bg: #1a192e;
	--c-color-on-dark: #ffffff;
	--c-color-on-dark-muted: rgba(255, 255, 255, 0.74);
	--c-color-hairline: rgba(31, 41, 54, 0.12);
	--c-color-hairline-soft: rgba(31, 41, 54, 0.08);
	--c-notice-bg: #dc2626;

	/* fonts */
	--c-heading-font: 'Montserrat', 'Segoe UI', system-ui, sans-serif;
	--c-font-text: 'Inter', system-ui, -apple-system, sans-serif;
	--c-fw-normal: 400;
	--c-weight-medium: 500;
	--c-fw-bold: 700;
	--c-fw-black: 800;

	/* type scale — TYPO-03 desktop */
	--c-type-h1: 80px;
	--c-fs-h2: 48px;
	--c-text-h3: 30px;
	--c-size-h4: 22px;
	--c-type-h5: 16px;
	--c-fs-h6: 13px;
	--c-size-body: 15px;
	--c-type-small: 13px;
	--c-size-xs: 11px;
	--c-line-tight: 0.95;
	--c-line-normal: 1.45;
	--c-line-loose: 1.65;
	--c-ls-tight: -0.02em;
	--c-letter-wide: 0.14em;

	/* spacing — SPACE-07 */
	--c-gap-2xs: 3px;
	--c-gutter-xs: 8px;
	--c-spacing-sm: 13px;
	--c-gutter-md: 21px;
	--c-gutter-lg: 34px;
	--c-spacing-xl: 55px;
	--c-space-2xl: 89px;
	--c-space-3xl: 144px;

	/* container — CONT-01 (site width from spec = 1240) */
	--c-container: 1240px;
	--c-prose-width: 720px;
	--c-inset-mobile: 16px;
	--c-container-padding-tablet: 32px;
	--c-gutter-desktop: 48px;
	--c-container-padding: var(--c-gutter-desktop);

	/* geometry — GEO-01 sharp industrial */
	--c-round-xs: 0;
	--c-rounded-sm: 0;
	--c-corner: 0;
	--c-round-lg: 0;
	--c-round-circle: 50%;
	--c-stroke-thin: 1px;
	--c-border-medium: 2px;
	--c-border-thick: 4px;
	--c-shadow-sm: 0 1px 0 rgba(0, 0, 0, 0.08);
	--c-elevation-2: 0 2px 0 rgba(0, 0, 0, 0.12);
	--c-elevation-3: 0 4px 0 rgba(0, 0, 0, 0.16);

	/* motion — MOTION-05 cinematic long */
	--c-speed-fast: 250ms;
	--c-duration-base: 400ms;
	--c-speed-slow: 700ms;
	--c-ease: cubic-bezier(0.25, 0.46, 0.45, 0.94);
	--c-ease-in-out: cubic-bezier(0.645, 0.045, 0.355, 1);

	--c-header-height-desktop: 96px;
	--c-topbar-mobile: 72px;
}

/* ===== reset / base ===== */
*, *::before, *::after { box-sizing: border-box; }
html, body { overflow-x: clip; }
html { -webkit-text-size-adjust: 100%; }
body {
	margin: 0;
	background: var(--c-surface);
	color: var(--c-ink);
	font-family: var(--c-font-text);
	font-size: var(--c-size-body);
	line-height: var(--c-line-normal);
	-webkit-font-smoothing: antialiased;
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--c-color-ink-accent); text-decoration: none; }
a:hover { text-decoration: underline; }
h1, h2, h3, h4 { font-family: var(--c-heading-font); line-height: var(--c-line-tight); letter-spacing: var(--c-ls-tight); margin: 0; }
p { margin: 0 0 var(--c-gutter-md); }
ul, ol { margin: 0; }
button { font-family: inherit; cursor: pointer; }

/* ===== a11y ===== */
.skip-link {
	position: absolute;
	left: var(--c-gutter-md);
	top: var(--c-gutter-md);
	z-index: 200;
	background: var(--c-ink);
	color: #fff;
	padding: var(--c-gutter-xs) var(--c-gutter-md);
	font-size: var(--c-type-small);
}
.skip-link:not(:focus) { top: -200px !important; }
.sr-only {
	position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
:focus-visible { outline: 2px solid var(--c-main-color); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) {
	* { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}

/* shared inner width (single section grid) */
.plateSliderInner, .axisZoneInner, .slatePanelInner, .labelSetInner, .pivotSpanInner,
.elementSetInner, .courtListInner, .spikeBunchInner, .districtTrackInner, .vectorSliderInner,
.hingeGridInner, .flagLaneInner, .fragmentListInner, .quarterRegionInner, .courtBodyInner,
.padSetInner {
	max-width: calc(var(--c-container) + 2 * var(--c-gutter-desktop));
	margin-inline: auto;
	padding-inline: var(--c-gutter-desktop);
	width: 100%;
}

/* generic section rhythm */
main > section, main > article, main > nav, main > div {
	padding-block: var(--c-spacing-xl);
}
main > .axisZone { padding-block: 0; }

.section-heading, main section > h2 {
	font-size: var(--c-fs-h2);
	font-weight: var(--c-fw-black);
	color: var(--c-ink);
	margin: 0 0 var(--c-gutter-lg);
}

/* ===== responsible-gaming banner (top, in-flow — STICKY-OFF) ===== */
.rgBanner {
	margin: 0;
	background: var(--c-notice-bg);
	color: #fff;
	font-size: var(--c-type-small);
	font-weight: var(--c-weight-medium);
	text-align: center;
	padding: 6px var(--c-gutter-desktop);
	letter-spacing: 0.01em;
}

/* ===== header — HEAD-08 bordered plate (dark) ===== */
.plateSlider {
	background: var(--c-color-header-bg);
	border-top: var(--c-border-medium) solid var(--c-secondary);
	border-bottom: var(--c-border-medium) solid rgba(255, 255, 255, 0.14);
}
.plateSliderInner {
	display: flex;
	align-items: center;
	gap: var(--c-gutter-lg);
	min-height: var(--c-header-height-desktop);
}
.plateSliderLogo { flex-shrink: 0; display: inline-flex; align-items: center; }
.plateSliderLogoImg { height: 88px; width: auto; flex-shrink: 0; }
.plateSliderNav { margin-left: auto; }
.plateSliderList {
	list-style: none; display: flex; flex-wrap: nowrap;
	align-items: center; gap: var(--c-gutter-md); padding: 0; margin: 0;
}
.plateSliderList li { display: flex; align-items: center; gap: var(--c-gutter-md); }
.plateSliderList li + li::before {
	content: ''; width: 4px; height: 4px; border-radius: var(--c-round-circle);
	background: var(--c-secondary); flex-shrink: 0;
}
.plateSliderLink {
	color: var(--c-color-on-dark);
	font-family: var(--c-heading-font);
	font-weight: var(--c-fw-bold);
	font-size: var(--c-type-small);
	text-transform: uppercase;
	letter-spacing: var(--c-letter-wide);
	transition: color var(--c-speed-fast) var(--c-ease);
}
.plateSliderLink:hover { color: var(--c-secondary); text-decoration: none; }
.plateSliderLink.is-active { color: var(--c-secondary); }
.plateSliderAuth { display: flex; align-items: center; gap: var(--c-spacing-sm); flex-shrink: 0; }
.plateSliderAuthLogin, .plateSliderAuthRegister {
	white-space: nowrap; flex-shrink: 0;
	font-family: var(--c-heading-font); font-weight: var(--c-fw-bold);
	font-size: var(--c-type-small); text-transform: uppercase; letter-spacing: 0.06em;
	padding: 10px var(--c-gutter-md); line-height: 1;
	transition: background var(--c-speed-fast) var(--c-ease), color var(--c-speed-fast) var(--c-ease);
}
.plateSliderAuthLogin {
	color: var(--c-color-on-dark);
	background: transparent;
	border: var(--c-stroke-thin) solid rgba(255, 255, 255, 0.5);
}
.plateSliderAuthLogin:hover { background: transparent; color: var(--c-secondary); border-color: var(--c-secondary); text-decoration: none; }
.plateSliderAuthRegister {
	color: var(--c-grad-mid);
	background: var(--c-secondary);
	border: var(--c-stroke-thin) solid var(--c-secondary);
}
.plateSliderAuthRegister:hover { background: var(--c-accent-dark); color: var(--c-grad-mid); text-decoration: none; }
.plateSliderToggle {
	display: none;
	margin-left: auto;
	background: transparent; border: 0; padding: var(--c-gutter-xs);
	flex-direction: column; gap: 5px; width: 44px; height: 44px;
	align-items: center; justify-content: center;
}
.plateSliderToggleBar { display: block; width: 26px; height: 2px; background: var(--c-color-on-dark); }
.plateSliderMobile { display: none; }
.plateSliderMobile.is-open {
	display: block;
	background: var(--c-color-header-bg);
	border-top: var(--c-stroke-thin) solid rgba(255, 255, 255, 0.14);
	padding: var(--c-gutter-md) 0 var(--c-gutter-lg);
}
.plateSliderMobileList { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; }
.plateSliderMobileLink {
	display: block; color: var(--c-color-on-dark);
	font-family: var(--c-heading-font); font-weight: var(--c-fw-bold);
	text-transform: uppercase; letter-spacing: var(--c-letter-wide); font-size: var(--c-type-h5);
	padding: var(--c-spacing-sm) 0; border-bottom: var(--c-stroke-thin) solid rgba(255, 255, 255, 0.1);
}
.plateSliderMobileLink:hover { color: var(--c-secondary); text-decoration: none; }
.plateSliderMobileAuth { display: flex; gap: var(--c-spacing-sm); margin-top: var(--c-gutter-md); }
.plateSliderMobileAuth .plateSliderAuthLogin,
.plateSliderMobileAuth .plateSliderAuthRegister { flex: 1; text-align: center; }

/* ===== breadcrumbs — BREAD-05 slashed display ===== */
.quarterRegion { background: var(--c-surface); border-bottom: var(--c-stroke-thin) solid var(--c-color-hairline-soft); }
.quarterRegionInner { padding-block: var(--c-gutter-md); }
.quarterRegionList { list-style: none; display: flex; flex-wrap: wrap; align-items: center; gap: var(--c-gutter-xs); padding: 0; margin: 0; }
.quarterRegionItem { display: flex; align-items: center; gap: var(--c-gutter-xs); }
.quarterRegionLink, .quarterRegionCurrent {
	font-family: var(--c-heading-font); font-weight: var(--c-fw-bold);
	font-size: var(--c-type-h5); text-transform: uppercase; letter-spacing: var(--c-ls-tight);
}
.quarterRegionLink { color: var(--c-text-muted); }
.quarterRegionLink:hover { color: var(--c-color-ink-accent); text-decoration: none; }
.quarterRegionCurrent { color: var(--c-ink); }
.quarterRegionSep {
	font-family: var(--c-heading-font); font-weight: var(--c-fw-bold);
	font-size: var(--c-type-h5); color: var(--c-color-ink-accent); margin-inline: var(--c-gap-2xs);
}

/* ===== hero — HERO-02 split photo right ===== */
.axisZone { background: linear-gradient(160deg, var(--c-gradient-from), var(--c-surface) 68%); }
.axisZoneInner { display: grid; grid-template-columns: 55% 45%; gap: var(--c-space-2xl); align-items: center; padding-block: var(--c-space-2xl); }
.axisZoneText { max-width: 640px; }
.axisZoneEyebrow {
	display: inline-block; font-family: var(--c-heading-font); font-weight: var(--c-fw-bold);
	font-size: var(--c-type-small); text-transform: uppercase; letter-spacing: var(--c-letter-wide);
	color: var(--c-color-ink-accent); margin-bottom: var(--c-gutter-md);
}
.axisZoneTitle { font-size: var(--c-type-h1); font-weight: var(--c-fw-black); color: var(--c-ink); }
.axisZoneSubtitle { font-size: var(--c-type-h5); line-height: var(--c-line-normal); color: var(--c-text-muted); max-width: 480px; margin-top: var(--c-gutter-md); }
.axisZoneActions { display: flex; flex-wrap: wrap; gap: var(--c-gutter-md); margin-top: var(--c-gutter-lg); }
.axisZoneCtaPrimary, .axisZoneCtaSecondary {
	display: inline-flex; align-items: center; justify-content: center;
	min-height: 52px; padding-inline: var(--c-gutter-lg);
	font-family: var(--c-heading-font); font-weight: var(--c-fw-bold);
	font-size: var(--c-type-h5); text-transform: uppercase; letter-spacing: 0.05em;
	transition: background var(--c-speed-fast) var(--c-ease), color var(--c-speed-fast) var(--c-ease);
}
.axisZoneCtaPrimary { background: var(--c-secondary); color: var(--c-grad-mid); border: var(--c-border-medium) solid var(--c-secondary); }
.axisZoneCtaPrimary:hover { background: var(--c-accent-dark); color: var(--c-grad-mid); text-decoration: none; }
.axisZoneCtaSecondary { background: transparent; color: var(--c-ink); border: var(--c-border-medium) solid var(--c-ink); }
.axisZoneCtaSecondary:hover { background: var(--c-ink); color: var(--c-surface); text-decoration: none; }
.axisZoneFigure { margin: 0; overflow: hidden; box-shadow: var(--c-elevation-3); }
.axisZoneImg { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; transition: transform var(--c-speed-slow) var(--c-ease); }
.axisZoneFigure:hover .axisZoneImg { transform: scale(1.04); }

/* ===== page-header — PHEAD-04 two column ===== */
.slatePanel { background: var(--c-surface); }
.slatePanelInner { display: grid; grid-template-columns: 1.2fr 1fr; gap: var(--c-space-2xl); align-items: end; padding-block: var(--c-spacing-xl); }
.slatePanelLeft { min-width: 0; }
.slatePanelRight { min-width: 0; }
.slatePanelEyebrow {
	display: inline-block; font-family: var(--c-font-text); font-weight: var(--c-weight-medium);
	font-size: var(--c-type-small); text-transform: uppercase; letter-spacing: var(--c-letter-wide);
	color: var(--c-color-ink-accent); margin-bottom: var(--c-spacing-sm);
}
.slatePanelTitle { font-size: var(--c-type-h1); font-weight: var(--c-fw-black); color: var(--c-ink); }
.slatePanelDescription { font-size: var(--c-type-h5); line-height: var(--c-line-normal); color: var(--c-text-muted); max-width: var(--c-prose-width); margin: 0; }
.slatePanelMeta { font-size: var(--c-type-small); color: var(--c-text-muted); margin-top: var(--c-spacing-sm); }

/* ===== prose — PROSE-06 quiet, readable column ===== */
.padSet { background: var(--c-surface); }
.padSetBody { max-width: var(--c-prose-width); margin-inline: auto; }
.padSetBody h2 { font-size: var(--c-text-h3); font-weight: var(--c-fw-bold); color: var(--c-ink); text-align: center; margin: var(--c-gutter-lg) 0 var(--c-gutter-md); }
.padSetBody h3 { font-size: var(--c-size-h4); font-weight: var(--c-fw-bold); color: var(--c-ink); margin: var(--c-gutter-md) 0 var(--c-gutter-xs); }
.padSetBody p { font-size: var(--c-size-body); line-height: var(--c-line-loose); color: var(--c-text-muted); }
.padSetBody ul, .padSetBody ol { color: var(--c-text-muted); line-height: var(--c-line-loose); padding-left: var(--c-gutter-md); margin: 0 0 var(--c-gutter-md); }
.padSetBody li { margin-bottom: var(--c-gutter-xs); }
.padSetBody a { color: var(--c-color-ink-accent); text-decoration: underline; text-underline-offset: 3px; }
.padSetBody strong { color: var(--c-ink); }
.padSetFigure { margin: var(--c-gutter-lg) 0; }
.padSetFigure img { width: 100%; box-shadow: var(--c-elevation-2); }

/* ===== items-grid — GRID-11 mixed block sizes ===== */
.labelSet { background: var(--c-surface); }
.labelSetGrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--c-gutter-md); }
.labelSetItem {
	background: var(--c-bg-elevated); border: var(--c-stroke-thin) solid var(--c-color-hairline);
	padding: var(--c-gutter-lg); box-shadow: var(--c-shadow-sm);
	transition: transform var(--c-speed-fast) var(--c-ease), box-shadow var(--c-speed-fast) var(--c-ease);
}
.labelSetItem:hover { transform: translateY(-3px); box-shadow: var(--c-elevation-2); }
.labelSetItemLarge { grid-column: span 2; grid-row: span 2; border-top: var(--c-border-thick) solid var(--c-main-color); }
.labelSetItemWide { grid-column: span 2; }
.labelSetItemTitle { font-size: var(--c-size-h4); font-weight: var(--c-fw-bold); color: var(--c-ink); margin: 0 0 var(--c-spacing-sm); }
.labelSetItemLarge .labelSetItemTitle { font-size: var(--c-text-h3); }
.labelSetItemText { font-size: var(--c-size-body); line-height: var(--c-line-normal); color: var(--c-text-muted); margin: 0; }

/* ===== data-table — TABLE-05 compact dense ===== */
.pivotSpan { background: var(--c-surface); }
.pivotSpanScroll { overflow-x: auto; }
.pivotSpanScroll table { width: 100%; min-width: 640px; border-collapse: collapse; }
.pivotSpanScroll th {
	background: var(--c-gradient-from); color: var(--c-ink);
	font-size: var(--c-size-xs); text-transform: uppercase; letter-spacing: var(--c-letter-wide);
	font-weight: var(--c-fw-bold); text-align: left; padding: var(--c-spacing-sm);
}
.pivotSpanScroll td { font-size: var(--c-type-small); color: var(--c-text-muted); padding: var(--c-gutter-xs) var(--c-spacing-sm); border-bottom: var(--c-stroke-thin) solid var(--c-color-hairline-soft); }
.pivotSpanScroll td:first-child { color: var(--c-ink); font-weight: var(--c-fw-bold); }

/* ===== reviews — REV-06 compact list, inline rating ===== */
.elementSet { background: var(--c-surface); }
.elementSetList { list-style: none; padding: 0; margin: 0; }
.elementSetItem { padding-block: var(--c-gutter-md); border-bottom: var(--c-stroke-thin) solid var(--c-color-hairline-soft); }
.elementSetHeader { display: flex; align-items: baseline; flex-wrap: wrap; gap: var(--c-spacing-sm); margin-bottom: var(--c-gutter-xs); }
.elementSetAuthor { font-size: var(--c-size-body); font-weight: var(--c-fw-bold); color: var(--c-ink); }
.elementSetRating { font-size: var(--c-type-small); font-weight: var(--c-fw-bold); color: var(--c-color-ink-accent); }
.elementSetDate { font-size: var(--c-type-small); color: var(--c-text-muted); margin-left: auto; }
.elementSetText { font-size: var(--c-size-body); line-height: var(--c-line-normal); color: var(--c-text-muted); max-width: var(--c-prose-width); margin: 0; }

/* ===== faq — FAQ-08 bordered box, indicator bar ===== */
.courtList { background: var(--c-surface); }
.courtListContainer { background: rgba(124, 97, 172, 0.05); border: var(--c-stroke-thin) solid var(--c-color-hairline); padding: var(--c-spacing-xl); }
.courtListItem { position: relative; padding-left: var(--c-gutter-md); border-bottom: var(--c-stroke-thin) solid var(--c-color-hairline-soft); }
.courtListItem:last-child { border-bottom: 0; }
.courtListItem::before { content: ''; position: absolute; left: 0; top: var(--c-gutter-md); bottom: var(--c-gutter-md); width: var(--c-border-thick); background: var(--c-secondary); }
.courtListQuestion {
	width: 100%; text-align: left; background: transparent; border: 0;
	display: flex; align-items: center; justify-content: space-between; gap: var(--c-gutter-md);
	padding: var(--c-gutter-md) 0; color: var(--c-ink);
	font-family: var(--c-heading-font); font-weight: var(--c-fw-bold); font-size: var(--c-type-h5);
}
.courtListQuestionText { flex: 1; }
.courtListIcon { flex-shrink: 0; font-size: var(--c-size-h4); color: var(--c-color-ink-accent); line-height: 1; transition: transform var(--c-speed-fast) var(--c-ease); }
.courtListQuestion[aria-expanded='true'] .courtListIcon { transform: rotate(45deg); }
.courtListAnswer { padding: 0 0 var(--c-gutter-md); }
.courtListAnswer p { font-size: var(--c-size-body); line-height: var(--c-line-loose); color: var(--c-text-muted); max-width: var(--c-prose-width); margin: 0; }

/* ===== cta — CTA-02 centered contained box ===== */
.spikeBunch { background: var(--c-surface); }
.spikeBunchBox { max-width: var(--c-prose-width); margin-inline: auto; text-align: center; background: rgba(124, 97, 172, 0.06); border: var(--c-stroke-thin) solid var(--c-color-hairline); padding: var(--c-space-2xl) var(--c-spacing-xl); }
.spikeBunchTitle { font-size: var(--c-fs-h2); font-weight: var(--c-fw-black); color: var(--c-ink); margin: 0 0 var(--c-gutter-md); }
.spikeBunchDescription { font-size: var(--c-size-body); line-height: var(--c-line-loose); color: var(--c-text-muted); margin: 0 auto var(--c-gutter-lg); max-width: 560px; }
.spikeBunchButton {
	display: inline-flex; align-items: center; justify-content: center; min-height: 52px;
	padding-inline: var(--c-spacing-xl); background: var(--c-secondary); color: var(--c-grad-mid);
	border: var(--c-border-medium) solid var(--c-secondary);
	font-family: var(--c-heading-font); font-weight: var(--c-fw-bold); font-size: var(--c-type-h5);
	text-transform: uppercase; letter-spacing: 0.05em;
	transition: background var(--c-speed-fast) var(--c-ease), color var(--c-speed-fast) var(--c-ease);
}
.spikeBunchButton:hover { background: var(--c-accent-dark); color: var(--c-grad-mid); text-decoration: none; }

/* ===== author-byline — BYLINE-03 thin strip ===== */
.courtBody { background: var(--c-surface); border-top: var(--c-stroke-thin) solid var(--c-color-hairline-soft); }
.courtBodyInner { padding-block: var(--c-gutter-md); }
.courtBodyRow { display: flex; align-items: center; gap: var(--c-spacing-sm); }
.courtBodyPortrait { width: 40px; height: 40px; border-radius: var(--c-round-circle); object-fit: cover; flex-shrink: 0; }
.courtBodyMeta { font-size: var(--c-type-small); color: var(--c-text-muted); }
.courtBodyName { color: var(--c-color-ink-accent); font-weight: var(--c-fw-bold); }
.courtBodyName:hover { color: var(--c-color-ink-accent); }
.courtBodyRole { color: var(--c-text-muted); }
.courtBodyDate { color: var(--c-text-muted); }

/* ===== author-card — AUTH-05 compact inline ===== */
.districtTrack { background: var(--c-surface); }
.districtTrackCard { display: flex; gap: var(--c-gutter-lg); background: var(--c-bg-elevated); border: var(--c-stroke-thin) solid var(--c-color-hairline); padding: var(--c-gutter-lg); max-width: var(--c-prose-width); }
.districtTrackPortrait { width: 96px; height: 96px; border-radius: var(--c-round-circle); object-fit: cover; flex-shrink: 0; border: var(--c-border-medium) solid var(--c-main-color); }
.districtTrackBody { display: flex; flex-direction: column; gap: var(--c-gap-2xs); }
.districtTrackJobTitle { font-size: var(--c-type-small); text-transform: uppercase; letter-spacing: var(--c-letter-wide); color: var(--c-color-ink-accent); font-weight: var(--c-fw-bold); margin: 0; }
.districtTrackName { font-size: var(--c-text-h3); font-weight: var(--c-fw-black); color: var(--c-ink); margin: 0; }
.districtTrackBio { font-size: var(--c-size-body); line-height: var(--c-line-normal); color: var(--c-text-muted); margin: var(--c-gutter-xs) 0 0; }
.districtTrackExpertise { list-style: none; display: flex; flex-wrap: wrap; gap: var(--c-gutter-xs); padding: 0; margin: var(--c-gutter-md) 0 0; }
.districtTrackExpertiseItem { font-size: var(--c-type-small); color: var(--c-ink); background: var(--c-gradient-from); padding: var(--c-gap-2xs) var(--c-spacing-sm); }
.districtTrackArticles { max-width: var(--c-prose-width); margin: var(--c-spacing-xl) auto 0; }
.districtTrackArticlesHeading { font-size: var(--c-size-h4); font-weight: var(--c-fw-bold); color: var(--c-ink); margin: 0 0 var(--c-gutter-md); }
.districtTrackArticlesList { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: var(--c-gutter-xs); }
.districtTrackArticlesItem { font-size: var(--c-size-body); }
.districtTrackArticlesItem a { color: var(--c-color-ink-accent); text-decoration: underline; text-underline-offset: 3px; }
.districtTrackArticlesItem a:hover { color: var(--c-accent-dark); }

/* ===== contact-form — FORM-08 asymmetric wide submit ===== */
.vectorSlider { background: var(--c-surface); }
.vectorSliderIntro { max-width: var(--c-prose-width); margin: 0 auto var(--c-gutter-lg); font-size: var(--c-type-h5); line-height: var(--c-line-normal); color: var(--c-text-muted); }
.vectorSliderForm { max-width: var(--c-prose-width); margin-inline: auto; background: var(--c-bg-elevated); border: var(--c-stroke-thin) solid var(--c-color-hairline); padding: var(--c-spacing-xl); display: flex; flex-direction: column; gap: var(--c-gutter-md); }
.vectorSliderField { display: flex; flex-direction: column; gap: var(--c-gutter-xs); }
.vectorSliderLabel { font-size: var(--c-type-small); font-weight: var(--c-fw-bold); color: var(--c-ink); }
.vectorSliderInput, .vectorSliderTextarea {
	font-family: var(--c-font-text); font-size: var(--c-size-body); color: var(--c-ink);
	background: var(--c-surface); border: var(--c-stroke-thin) solid var(--c-color-hairline);
	padding: var(--c-spacing-sm); width: 100%;
}
.vectorSliderTextarea { min-height: 140px; resize: vertical; }
.vectorSliderInput:focus, .vectorSliderTextarea:focus { outline: 2px solid var(--c-main-color); outline-offset: 0; }
.vectorSliderSubmit {
	width: 100%; min-height: 72px; border: 0; background: var(--c-secondary); color: var(--c-grad-mid);
	font-family: var(--c-heading-font); font-weight: var(--c-fw-black); font-size: var(--c-size-h4);
	text-transform: uppercase; letter-spacing: 0.08em; margin-top: var(--c-gutter-xs);
	transition: background var(--c-speed-fast) var(--c-ease);
}
.vectorSliderSubmit:hover { background: var(--c-accent-dark); }
.vectorSliderSuccess { display: none; max-width: var(--c-prose-width); margin: 0 auto var(--c-gutter-md); padding: var(--c-gutter-md); background: rgba(124, 97, 172, 0.1); border: var(--c-stroke-thin) solid var(--c-main-color); color: var(--c-ink); font-size: var(--c-size-body); }
.vectorSliderSuccess.is-visible { display: block; }

/* ===== error — ERR-06 bordered card ===== */
.hingeGrid { background: var(--c-surface); }
.hingeGridInner { padding-block: var(--c-space-2xl); }
.hingeGridCard { max-width: var(--c-prose-width); margin-inline: auto; text-align: center; background: var(--c-bg-elevated); border: var(--c-border-medium) solid var(--c-secondary); padding: var(--c-space-2xl); box-shadow: var(--c-elevation-2); display: flex; flex-direction: column; align-items: center; gap: var(--c-gutter-md); }
.hingeGridTitle { font-size: var(--c-fs-h2); font-weight: var(--c-fw-black); color: var(--c-ink); }
.hingeGridText { font-size: var(--c-size-body); line-height: var(--c-line-loose); color: var(--c-text-muted); margin: 0; }
.hingeGridButton {
	display: inline-flex; align-items: center; justify-content: center; min-height: 52px;
	padding-inline: var(--c-spacing-xl); background: var(--c-secondary); color: var(--c-grad-mid);
	font-family: var(--c-heading-font); font-weight: var(--c-fw-bold); font-size: var(--c-type-h5);
	text-transform: uppercase; letter-spacing: 0.05em;
	transition: background var(--c-speed-fast) var(--c-ease);
}
.hingeGridButton:hover { background: var(--c-accent-dark); color: var(--c-grad-mid); text-decoration: none; }

/* ===== legal — LEGAL-02 numbered sections ===== */
.vectorHeader { background: var(--c-surface); }
.vectorHeaderShell { max-width: var(--c-prose-width); margin-inline: auto; padding-inline: var(--c-gutter-desktop); }
.vectorHeaderIntro { font-size: var(--c-type-h5); line-height: var(--c-line-normal); color: var(--c-text-muted); margin-bottom: var(--c-gutter-lg); }
.vectorHeaderUpdated { font-size: var(--c-type-small); color: var(--c-text-muted); margin-bottom: var(--c-gutter-lg); }
.vectorHeaderBody { counter-reset: legal-section; }
.vectorHeaderSection { counter-increment: legal-section; margin-bottom: var(--c-gutter-lg); }
.vectorHeaderSection h2 { font-size: var(--c-size-h4); font-weight: var(--c-fw-bold); color: var(--c-ink); margin: 0 0 var(--c-spacing-sm); }
.vectorHeaderSection h2::before { content: counter(legal-section) '. '; color: var(--c-color-ink-accent); font-family: var(--c-heading-font); font-weight: var(--c-fw-black); margin-right: var(--c-gap-2xs); }
.vectorHeaderSection p { font-size: var(--c-size-body); line-height: var(--c-line-loose); color: var(--c-text-muted); padding-left: var(--c-gutter-md); }
.vectorHeaderContacts { margin: var(--c-gutter-lg) 0; padding-left: var(--c-gutter-md); }
.vectorHeaderContacts li { font-size: var(--c-size-body); color: var(--c-text-muted); margin-bottom: var(--c-gutter-xs); }
.vectorHeaderDisclaimer { font-size: var(--c-type-small); font-style: italic; color: var(--c-text-muted); border-top: var(--c-stroke-thin) solid var(--c-color-hairline-soft); padding-top: var(--c-gutter-md); }

/* ===== cookie-banner — COOK-02 full-width bottom strip ===== */
.flagLane { display: none; position: fixed; bottom: 0; left: 0; right: 0; z-index: 90; background: var(--c-main-color); border-top: var(--c-stroke-thin) solid rgba(255, 255, 255, 0.12); }
.flagLane.is-visible { display: block; }
.flagLaneInner { display: flex; align-items: center; gap: var(--c-gutter-md); padding-block: var(--c-gutter-md); }
.flagLaneMessage { color: #fff; font-size: var(--c-type-small); line-height: var(--c-line-normal); margin: 0; flex: 1; }
.flagLaneActions { display: flex; gap: var(--c-spacing-sm); flex-shrink: 0; }
.flagLaneAccept, .flagLaneDecline {
	font-family: var(--c-heading-font); font-weight: var(--c-fw-bold); font-size: var(--c-type-small);
	text-transform: uppercase; letter-spacing: 0.04em; padding: 10px var(--c-gutter-md); border: 0; white-space: nowrap;
}
.flagLaneAccept { background: var(--c-secondary); color: var(--c-grad-mid); }
.flagLaneAccept:hover { background: var(--c-accent-dark); }
.flagLaneDecline { background: transparent; color: #fff; border: var(--c-stroke-thin) solid rgba(255, 255, 255, 0.6); }
.flagLaneDecline:hover { background: transparent; color: var(--c-secondary); border-color: var(--c-secondary); }

/* ===== footer — FOOT-02 two-row brand + nav (dark) ===== */
.fragmentList { background: var(--c-grad-mid); color: var(--c-color-on-dark); border-top: var(--c-border-thick) solid var(--c-secondary); }
.fragmentListInner { padding-block: var(--c-spacing-xl); }
.fragmentListTop { display: flex; align-items: center; justify-content: space-between; gap: var(--c-gutter-lg); flex-wrap: wrap; }
.fragmentListLogo { display: inline-flex; }
.fragmentListLogoImg { height: 64px; width: auto; }
.fragmentListNav { display: flex; }
.fragmentListNavList { list-style: none; display: flex; flex-wrap: wrap; gap: var(--c-gutter-md); padding: 0; margin: 0; }
.fragmentListNavLink { color: var(--c-color-on-dark); font-size: var(--c-type-small); font-weight: var(--c-weight-medium); text-transform: uppercase; letter-spacing: 0.06em; }
.fragmentListNavLink:hover { color: var(--c-secondary); text-decoration: none; }
.fragmentListBottom { display: flex; align-items: center; justify-content: space-between; gap: var(--c-gutter-md); flex-wrap: wrap; margin-top: var(--c-gutter-lg); padding-top: var(--c-gutter-md); border-top: var(--c-stroke-thin) solid rgba(255, 255, 255, 0.12); }
.fragmentListCopyright { color: var(--c-color-on-dark-muted); font-size: var(--c-type-small); }
.fragmentListLegal { display: flex; }
.fragmentListLegalList { list-style: none; display: flex; flex-wrap: wrap; gap: var(--c-gutter-md); padding: 0; margin: 0; }
.fragmentListLegalLink { color: var(--c-color-on-dark-muted); font-size: var(--c-type-small); }
.fragmentListLegalLink:hover { color: var(--c-secondary); text-decoration: none; }

/* ===== responsive — desktop-first, mobile overrides ===== */
@media (max-width: 1200px) {
	.axisZoneTitle, .slatePanelTitle { font-size: 60px; }
}
@media (max-width: 1365px) {
	.plateSliderNav, .plateSliderAuth { display: none; }
	.plateSliderToggle { display: flex; }
	.axisZoneInner { grid-template-columns: 1fr; gap: var(--c-gutter-lg); padding-block: var(--c-spacing-xl); }
	.axisZoneImg { aspect-ratio: 16 / 9; }
	.slatePanelInner { grid-template-columns: 1fr; gap: var(--c-gutter-md); }
	.labelSetGrid { grid-template-columns: repeat(2, 1fr); }
	.labelSetItemLarge, .labelSetItemWide { grid-column: span 2; grid-row: auto; }
	.districtTrackCard { flex-direction: column; }
}
@media (max-width: 620px) {
	:root {
		--c-type-h1: 44px; --c-fs-h2: 32px; --c-text-h3: 24px; --c-size-h4: 18px; --c-type-h5: 14px; --c-fs-h6: 12px;
		--c-size-body: 14px; --c-type-small: 12px; --c-size-xs: 10px;
		--c-container-padding: var(--c-inset-mobile);
	}
	.plateSliderInner, .axisZoneInner, .slatePanelInner, .labelSetInner, .pivotSpanInner,
	.elementSetInner, .courtListInner, .spikeBunchInner, .districtTrackInner, .vectorSliderInner,
	.hingeGridInner, .flagLaneInner, .fragmentListInner, .quarterRegionInner, .courtBodyInner,
	.padSetInner, .vectorHeaderShell { padding-inline: var(--c-inset-mobile); }
	.plateSliderInner { min-height: var(--c-topbar-mobile); }
	.plateSliderLogoImg { height: 60px; }
	.axisZoneTitle, .slatePanelTitle { font-size: var(--c-type-h1); }
	.labelSetGrid { grid-template-columns: 1fr; }
	.labelSetItemLarge, .labelSetItemWide { grid-column: auto; }
	.courtListContainer, .vectorSliderForm { padding: var(--c-gutter-lg) var(--c-gutter-md); }
	.spikeBunchBox { padding: var(--c-spacing-xl) var(--c-gutter-md); }
	.flagLaneInner { flex-direction: column; align-items: stretch; }
	.flagLaneActions { justify-content: stretch; }
	.flagLaneAccept, .flagLaneDecline { flex: 1; }
	.fragmentListTop, .fragmentListBottom { flex-direction: column; align-items: flex-start; }
	.elementSetDate { margin-left: 0; }
}