/* Spatial studio: a calm, legible stage for the supplied geographic register. */
.home-page .atlas {
	padding-block: clamp(48px, 6vw, 96px);
	padding-inline: max(var(--gutter), calc((100% - 1480px) / 2));
}
/* Prevent the server-rendered studio controls from flashing before homepage.js
   applies the filter-first atlas layout. Keep the nodes mounted for atlas.js. */
.home-page .atlas-console > :is(
		.atlas-projects-instruction,
		.atlas-workspace-bar,
		.atlas-action-status,
		.atlas-spatial-meta,
		.impact-rail,
		.atlas-boundary-details,
		.atlas-settings-status
	) {
	display: none !important;
}
/* The map still uses its national root internally; only suppress the redundant
   breadcrumb label between Project filters and the map. */
.home-page .atlas-console .bread {
	display: none !important;
}
.home-page .atlas-head-compact {
	align-items: end;
	margin-bottom: 30px;
	gap: 24px;
}
.home-page .atlas-head-compact h2 {
	font-family: Georgia, serif;
	font-size: clamp(34px, 4vw, 58px);
	letter-spacing: -0.04em;
	line-height: 1.15;
}
.home-page .atlas-console {
	display: flex;
	flex-direction: column;
	background: radial-gradient(ellipse at 40% 30%, #102d5533, transparent 60%), #0b2445;
	border: 1px solid #23466c;
	border-radius: 22px;
	padding: 28px;
	box-shadow: 0 24px 65px #102d5515;
}
/* Match the final JavaScript-enhanced order during the very first paint. */
.home-page .atlas-console > .atlas-filter-panel {
	order: 1;
	margin-bottom: 0;
}
.home-page .atlas-console > .sector-legend {
	order: 2;
	margin-top: 0;
	padding-top: 8px;
	border-top: 0;
}
.home-page .atlas-console > .atlas-layout {
	order: 3;
}
.home-page .atlas-console > .division-switcher {
	order: 4;
}
.home-page .atlas-projects-instruction {
	background: #102d55;
	border: 1px solid #bdd8ff2b;
	border-radius: 12px;
	padding: 18px 22px;
	gap: 25px;
	margin-bottom: 24px;
}
.home-page .atlas-projects-instruction strong {
	font-family: Georgia, serif;
	font-size: 25px;
	font-weight: 400;
	letter-spacing: -0.02em;
	color: #f0f5ff;
	line-height: 1.3;
}
.home-page .atlas-projects-instruction span {
	font-size: 12px;
	line-height: 1.7;
	color: #bdd8ff;
	margin-top: 7px;
	display: block;
}
.home-page .division-project-form {
	max-width: 400px;
	min-width: 290px;
	flex-shrink: 0;
}
.home-page .division-project-form select {
	background: #102d55;
	border-color: #6d89ad66;
}
.home-page .division-project-form button {
	border-radius: 7px;
	background: #d3e3fc;
	box-shadow: 0 3px 12px #0b244533;
}
.atlas-workspace-bar {
	padding: 0 0 18px;
	margin: 0;
	border-color: #bdd8ff29;
}
.atlas-workspace-bar strong {
	font-size: 16px;
	font-weight: 600;
	letter-spacing: -0.01em;
	color: #f0f5ff;
}
.atlas-workspace-caption {
	color: #bdd8ff;
	font-size: 12px;
}
.atlas-workspace-dot {
	background: #bdd8ff;
	box-shadow: 0 0 0 5px #bdd8ff12;
}
.atlas-actions button,
.atlas-export-menu summary {
	border-color: #9bb9dd47;
	background: #bdd8ff07;
	color: #e6efff;
	border-radius: 8px;
	font-size: 12px;
}
.atlas-actions #atlas-pdf {
	background: #d3e3fc;
	border-color: #d3e3fc;
	color: #102d55;
}
.atlas-export-menu > div {
	background: #102d55;
	border-color: #6d89ad;
	z-index: 25;
}
.atlas-action-status {
	color: #bdd8ff;
	font-size: 12px;
	padding: 13px 0 4px;
	min-height: 35px;
}
.atlas-spatial-meta {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 20px;
	padding: 4px 0 18px;
	color: #9bb9dd;
	font-size: 11px;
}
.atlas-spatial-meta > span {
	display: flex;
	align-items: center;
	gap: 8px;
}
.atlas-spatial-meta > span > i {
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: #9bb9dd;
}
.atlas-spatial-meta details {
	position: relative;
	flex-shrink: 0;
}
.atlas-spatial-meta summary {
	cursor: pointer;
	min-height: 44px;
	display: flex;
	align-items: center;
	gap: 12px;
	color: #d3e3fc;
	list-style: none;
}
.atlas-spatial-meta summary::-webkit-details-marker {
	display: none;
}
.atlas-spatial-meta p {
	position: absolute;
	right: 0;
	top: 100%;
	z-index: 26;
	width: min(390px, calc(100vw - 60px));
	padding: 19px 22px;
	margin: 0;
	background: #f0f5ff;
	border: 1px solid #d3e3fc;
	border-radius: 10px;
	font-size: 13px;
	line-height: 1.85;
	color: #23466c;
	box-shadow: 0 12px 30px #0b244544;
}
.atlas-boundary-details {
	border: 1px solid #9bb9dd35;
	border-radius: 10px;
	background: #ffffff03;
	margin-bottom: 12px;
	overflow: hidden;
}
.atlas-boundary-details > summary {
	display: flex;
	align-items: center;
	gap: 16px;
	cursor: pointer;
	list-style: none;
	min-height: 52px;
	padding: 12px 16px;
	color: #d3e3fc;
	font-size: 12px;
}
.atlas-boundary-details > summary::-webkit-details-marker {
	display: none;
}
.atlas-boundary-details > summary > span {
	font-weight: 600;
}
.atlas-boundary-details small {
	font-size: 11px;
	color: #9bb9dd;
	flex: 1;
}
.atlas-boundary-details > summary i {
	font-style: normal;
	font-size: 20px;
	line-height: 1;
}
.atlas-boundary-details[open] > summary {
	border-bottom: 1px solid #9bb9dd2b;
}
.atlas-boundary-details[open] > summary i {
	transform: rotate(45deg);
}
.home-page .atlas-boundary-details .atlas-settings {
	padding: 17px;
	gap: 16px;
}
.home-page .atlas-console .atlas-settings select {
	background: #102d55;
	border-color: #6d89ad;
	color: #e6efff;
}
.home-page .atlas-console .atlas-settings label {
	color: #bdd8ff;
	font-size: 12px;
}
.home-page .atlas-console .map-shell {
	background: radial-gradient(ellipse at 45% 30%, #23466c28, transparent 70%), #0b2445;
	border-color: #9bb9dd4a;
	border-radius: 15px;
	height: 710px;
	isolation: isolate;
}
.map-view-switch {
	display: flex;
	gap: 4px;
	position: absolute;
	top: 18px;
	right: 18px;
	z-index: 8;
	padding: 5px;
	background: #0b2445e8;
	backdrop-filter: blur(12px);
	border: 1px solid #bdd8ff50;
	border-radius: 12px;
	box-shadow: 0 4px 18px #0b244530;
}
.map-view-switch > button {
	display: flex;
	align-items: center;
	gap: 7px;
	justify-content: center;
	min-height: 44px;
	min-width: 65px;
	padding: 9px 13px;
	border: 0;
	border-radius: 7px;
	background: transparent;
	color: #bdd8ff;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.2;
}
.map-view-switch > button > span {
	font-size: 11px;
	font-weight: 400;
	color: inherit;
}
.map-view-switch > button[aria-pressed="true"] {
	background: #d3e3fc;
	color: #102d55;
	box-shadow: 0 2px 7px #0b244518;
}
.map-view-switch > button:disabled {
	opacity: 0.38;
	cursor: default;
}
.map-view-switch #scene-capture {
	min-width: 44px;
	padding: 9px;
	background: #102d55;
	font-size: 18px;
	border-left: 1px solid #9bb9dd30;
	color: #d3e3fc;
}
.home-page .atlas-console .map-controls {
	display: grid;
	grid-template-columns: repeat(4, 44px);
	gap: 6px;
	right: 18px;
	bottom: 70px;
	padding: 8px;
	background: #0b2445e8;
	border-color: #9bb9dd6b;
	border-radius: 12px;
	box-shadow: 0 8px 25px #0b244530;
	z-index: 8;
}
.home-page .atlas-console .map-control-label {
	grid-column: 1/-1;
	padding: 4px 3px 5px;
	font-size: 8px;
	letter-spacing: 0.1em;
	color: #bdd8ff;
}
.home-page .atlas-console .map-controls button {
	height: 44px;
	min-width: 44px;
	width: 44px;
	background: #bdd8ff07;
	border: 1px solid #9bb9dd29;
	color: #d3e3fc;
	font-size: 12px;
	border-radius: 7px;
	line-height: 1.2;
	padding: 0;
}
.home-page .atlas-console .map-controls button:hover:not(:disabled) {
	background: #d3e3fc1c;
	border-color: #bdd8ff;
}
.home-page .atlas-console .map-controls button > span {
	display: none;
}
.home-page .atlas-console .map-controls #ambient-toggle {
	font-size: 20px;
}
.home-page .atlas-console .map-controls button[aria-pressed="true"] {
	background: #d3e3fc;
	color: #102d55;
}
.home-page .atlas-console .map-hint {
	top: 22px;
	left: 20px;
	font-size: 11px;
	color: #bdd8ff;
	gap: 10px;
	max-width: 210px;
}
.home-page .atlas-console .map-hint b {
	font-size: 10px;
	color: #9bb9dd;
	font-weight: 400;
}
.home-page .atlas-console .map-compass {
	color: #d3e3fc;
	font-size: 12px;
}
.home-page .atlas-console .map-context {
	right: 20px;
	top: 84px;
	bottom: auto;
	color: #9bb9dd;
	font-size: 9px;
	letter-spacing: 0.08em;
}
.home-page .atlas-console .bay {
	bottom: 136px;
	font-size: 8px;
	color: #6d89ad;
	letter-spacing: 0.2em;
	pointer-events: none;
}
.home-page .atlas-console .map-legend {
	left: 20px;
	bottom: 22px;
	font-size: 10px;
	color: #bdd8ff;
	gap: 12px;
	max-width: calc(100% - 40px);
	flex-wrap: wrap;
}
.home-page .atlas-console .overlay-key {
	left: 20px;
	bottom: 66px;
	width: 135px;
	color: #bdd8ff;
}
.home-page .atlas-console .division-label {
	padding: 6px 8px;
	font-size: 11px;
	background: #0b2445e8;
	border: 1px solid #9bb9dd55;
	border-radius: 6px;
	color: #f0f5ff;
	box-shadow: 0 4px 12px #0b244540;
}
.home-page .atlas-console .division-label .pill {
	background: #d3e3fc22;
	color: #d3e3fc;
	font-size: 9px;
	border-left: 1px solid #bdd8ff40;
	padding-left: 6px;
	margin-left: 6px;
}
.home-page .atlas-console .division-label.hovered {
	background: #d3e3fc;
	color: #102d55;
	border-color: #e6efff;
}
.home-page .atlas-console .division-label.hovered .pill {
	color: #23466c;
	background: transparent;
	border-color: #52667f44;
}
.home-page .atlas-console .map-tooltip {
	left: 20px;
	top: 100px;
	width: 200px;
	max-width: calc(100% - 40px);
	background: #f0f5fff5;
	color: #23466c;
	border-color: #bdd8ff;
	box-shadow: 0 8px 25px #0b244530;
	font-size: 12px;
}
.home-page .atlas-console .map-tooltip strong {
	color: #102d55;
	font-size: 23px;
}
.home-page .atlas-console .inspector {
	background: #102d55;
	border-color: #9bb9dd50;
	max-height: 710px;
	scrollbar-color: #6d89ad #102d55;
}
.home-page .atlas-console .inspector-hero {
	background: #0b2445;
}
.home-page .atlas-console .inspector-body {
	padding: 22px;
	color: #bdd8ff;
}
.home-page .atlas-console .inspector-projects-link {
	background: #d3e3fc;
	border-color: #d3e3fc;
	color: #102d55;
	font-size: 13px;
}
.home-page .atlas-console .metric-card {
	background: #102d5544;
	border-color: #6d89ad38;
}
.home-page .atlas-console .metric-card strong {
	color: #d3e3fc;
	font-size: 28px;
}
.home-page .atlas-console .metric-card span {
	color: #bdd8ff;
	line-height: 1.5;
}
.home-page .atlas-console .panel-note {
	color: #9bb9dd;
	font-size: 11px;
	line-height: 1.8;
}
.home-page .atlas-console .featured-row {
	border-color: #6d89ad26;
	color: #d3e3fc;
	min-height: 60px;
}
.home-page .atlas-console .featured-row small {
	color: #9bb9dd;
}
.home-page .atlas-console .panel-label {
	color: #bdd8ff;
}
.home-page .atlas-console .comparison-row {
	color: #bdd8ff;
}
.home-page .atlas-console .comparison-row b {
	color: #d3e3fc;
}
.home-page .atlas-console .comparison-row i {
	background: linear-gradient(90deg, #52667f, #bdd8ff);
}
.home-page .atlas-console .division-project-link {
	background: #102d5544;
	border-color: #6d89ad3d;
	color: #d3e3fc;
	padding: 15px;
}
.home-page .atlas-console .division-project-link small {
	color: #9bb9dd;
	font-size: 11px;
}
.home-page .atlas-console .division-project-link:hover {
	background: #52667f2b;
	border-color: #bdd8ff;
}
.home-page .atlas-console .division-project-link > svg {
	color: #9bb9dd;
}
.home-page .atlas-console .sector-legend {
	flex-wrap: wrap;
	gap: 7px;
}
.home-page .atlas-console .atlas-filter-panel > .sector-legend {
	margin: 0;
	padding: 12px 15px;
	border-top: 1px solid #bdd8ff1c;
}
.home-page .atlas-console .sector-legend button {
	background: #102d55;
	border-color: #6d89ad33;
	color: #bdd8ff;
	font-size: 12px;
	padding: 9px 12px;
}
.home-page .atlas-console .sector-legend button[aria-pressed="true"] {
	background: #d3e3fc;
	color: #102d55;
	border-color: #d3e3fc;
}
@media (max-width: 1100px) {
	.home-page .atlas-console {
		padding: 22px;
	}
	.home-page .atlas-projects-instruction {
		align-items: flex-start;
		flex-direction: column;
		gap: 16px;
	}
	.home-page .division-project-form {
		width: 100%;
		max-width: 100%;
		min-width: 0;
		margin: 0;
	}
	.home-page .atlas-console .map-shell {
		height: 670px;
	}
	.home-page .atlas-console .inspector {
		max-height: 670px;
	}
}
@media (max-width: 900px) {
	.home-page .atlas-console .inspector {
		max-height: none;
	}
	.home-page .atlas-console .inspector-hero {
		min-height: 175px;
	}
	.home-page .atlas-console .metric-grid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
	.home-page .atlas-console .inspector h3 {
		font-size: 34px;
	}
}
@media (max-width: 600px) {
	.home-page .atlas-console {
		padding: 18px 12px;
		border-radius: 16px;
	}
	.home-page .atlas-projects-instruction {
		padding: 17px 15px;
	}
	.home-page .atlas-projects-instruction strong {
		font-size: 23px;
	}
	.atlas-spatial-meta {
		font-size: 10px;
		gap: 10px;
		align-items: flex-start;
	}
	.atlas-spatial-meta > span {
		padding-block: 12px;
		max-width: 165px;
		line-height: 1.6;
	}
	.atlas-spatial-meta summary {
		font-size: 11px;
		gap: 7px;
	}
	.atlas-spatial-meta p {
		width: min(300px, calc(100vw - 70px));
		font-size: 13px;
		padding: 16px;
	}
	.atlas-boundary-details small {
		display: none;
	}
	.atlas-boundary-details > summary {
		justify-content: space-between;
	}
	.home-page .atlas-boundary-details .atlas-settings {
		padding: 12px;
		gap: 14px;
	}
	.home-page .atlas-console .map-shell {
		height: 590px;
		border-radius: 12px;
	}
	.map-view-switch {
		top: 12px;
		right: 12px;
		padding: 4px;
		gap: 3px;
	}
	.map-view-switch > button {
		padding: 9px 10px;
		min-width: 54px;
		min-height: 44px;
	}
	.map-view-switch > button > span {
		display: none;
	}
	.home-page .atlas-console .map-hint {
		top: 18px;
		left: 15px;
	}
	.home-page .atlas-console .map-hint > span:last-child {
		display: none;
	}
	.home-page .atlas-console .map-context {
		top: 75px;
		right: 15px;
		font-size: 8px;
	}
	.home-page .atlas-console .map-controls {
		right: 12px;
		bottom: 70px;
		gap: 5px;
		padding: 7px;
		grid-template-columns: repeat(4, 44px);
	}
	.home-page .atlas-console .division-label {
		font-size: 10px;
		padding: 5px 6px;
	}
	.home-page .atlas-console .division-label .pill {
		display: none;
	}
	.home-page .atlas-console .map-tooltip {
		left: 12px;
		top: 85px;
		width: 180px;
		font-size: 11px;
	}
	.home-page .atlas-console .map-tooltip strong {
		font-size: 21px;
	}
	.home-page .atlas-console .overlay-key {
		left: 12px;
		bottom: 207px;
		width: 105px;
	}
	.home-page .atlas-console .map-legend {
		left: 12px;
		bottom: 20px;
		font-size: 9px;
		gap: 10px;
	}
	.home-page .atlas-console .bay {
		bottom: 225px;
		left: 28%;
		font-size: 7px;
	}
	.home-page .atlas-console .metric-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
	.home-page .atlas-console .division-project-link {
		padding: 13px;
		gap: 9px;
	}
	.home-page .atlas-console .division-project-link strong {
		font-size: 12px;
	}
	.home-page .atlas-console .division-project-link small {
		font-size: 10px;
	}
	.home-page .atlas-console .inspector-body {
		padding: 20px;
	}
}
@media (max-width: 360px) {
	.home-page .atlas-console .map-shell {
		height: 560px;
	}
	.home-page .atlas-console .map-controls {
		right: 8px;
	}
	.map-view-switch {
		right: 8px;
	}
	.home-page .atlas-console .map-context {
		font-size: 7px;
	}
	.atlas-workspace-bar strong {
		font-size: 15px;
	}
	.atlas-actions button {
		font-size: 11px;
	}
	.home-page .atlas-console .sector-legend button {
		font-size: 11px;
	}
}
@media (prefers-reduced-motion: reduce) {
	.map-view-switch,
	.home-page .atlas-console .division-label {
		transition: none;
	}
}

.home-page .atlas-console .map-stage {
	touch-action: pan-y;
}
.home-page .atlas-console .map-stage.gestures-enabled,
.home-page .atlas-console .map-fullscreen .map-stage {
	touch-action: none;
}
.home-page .atlas-console .map-controls #map-touch-control {
	display: none;
}
@media (any-pointer: coarse) {
	.home-page .atlas-console .map-controls #map-touch-control {
		display: block;
		font-size: 10px;
	}
}

/* Keep all divisions keyboard reachable when visible labels would collide. */
.home-page .atlas-console .division-label.label-alternative {
	opacity: 0 !important;
	pointer-events: none;
}
.home-page .atlas-console .division-label.label-alternative:focus-visible {
	opacity: 1 !important;
	pointer-events: auto;
	left: 18px !important;
	top: 150px !important;
	transform: none;
	background: #d3e3fc;
	color: #102d55;
	z-index: 10;
	outline: 3px solid #e6efff;
}

/* The swatch uses the same exact endpoints as the data color scale. */
.home-page .atlas-console .overlay-key small {
	display: block;
	font-size: 9px;
	color: #bdd8ff;
	margin-top: 6px;
}
.home-page .atlas-console .division-label.label-alternative:focus-visible {
	max-width: calc(100% - 36px);
}