.langoya-monitoring [hidden] {
	display: none !important;
}

.page-content--wide {
	max-width: none;
}

.langoya-monitoring h2,
.langoya-monitoring h3 {
	margin-top: 0;
}

.monitoring-intro {
	max-width: 760px;
	margin-bottom: 2rem;
}

.monitoring-intro h2 {
	margin-bottom: .8rem;
	font-size: clamp(2.2rem, 4.6vw, 3.7rem);
}

.monitoring-intro > p:last-child {
	max-width: 650px;
	margin-bottom: 0;
	color: var(--color-muted);
	font-size: 1.05rem;
}

.monitoring-disclaimer {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: .3rem .55rem;
	margin: 0 0 1.5rem;
	padding: 1rem 1.2rem;
	border: 1px solid #b7c9bd;
	border-left: 4px solid var(--color-green);
	border-radius: 12px;
	background: var(--color-white);
	color: var(--color-forest);
}

.monitoring-disclaimer strong {
	font-weight: 800;
}

.monitoring-disclaimer span {
	color: var(--color-muted);
	font-size: .9rem;
}

.monitoring-dashboard {
	padding: clamp(1rem, 3vw, 2rem);
	border: 1px solid var(--color-line);
	border-radius: 24px;
	background: var(--color-white);
	box-shadow: var(--shadow-soft);
}

.monitoring-status {
	margin: 0 0 1.2rem;
	color: var(--color-muted);
	font-size: .9rem;
}

.monitoring-error {
	padding: 1.25rem;
	border: 1px solid #d9aaa0;
	border-radius: 14px;
	background: #fff8f6;
	color: #6e2d22;
}

.monitoring-error p {
	margin: 0 0 1rem;
}

.monitoring-category-wrap {
	margin-bottom: 2rem;
}

.monitoring-category-wrap h3,
.monitoring-subheading h3,
.monitoring-card h3 {
	margin-bottom: .45rem;
	font-size: 1.15rem;
}

.monitoring-categories {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: .65rem;
	margin-top: .8rem;
}

.monitoring-category-button {
	min-height: 56px;
	padding: .7rem .85rem;
	border: 1px solid var(--color-line);
	border-radius: 12px;
	background: var(--color-white);
	color: var(--color-forest);
	font-size: .86rem;
	font-weight: 700;
	line-height: 1.35;
	text-align: left;
	cursor: pointer;
	transition: border-color .2s ease, background-color .2s ease, color .2s ease;
}

.monitoring-category-button:hover {
	border-color: #9eb9aa;
	background: #f8faf8;
}

.monitoring-category-button[aria-pressed="true"] {
	border-color: var(--color-forest);
	background: var(--color-forest);
	color: var(--color-white);
}

.monitoring-subheading,
.monitoring-card__heading {
	display: flex;
	align-items: end;
	justify-content: space-between;
	gap: 1rem;
}

.monitoring-subheading {
	margin-bottom: .8rem;
}

.monitoring-subheading p,
.monitoring-card__heading p {
	margin: 0;
	color: var(--color-muted);
	font-size: .86rem;
}

.monitoring-subheading h3,
.monitoring-card__heading h3 {
	margin-bottom: 0;
}

.monitoring-indicators {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: .8rem;
}

.monitoring-indicator {
	min-height: 116px;
	padding: 1rem 1.15rem;
	border: 1px solid var(--color-line);
	border-radius: 14px;
	background: #f8faf8;
}

.monitoring-indicator__label,
.monitoring-indicator__note {
	display: block;
}

.monitoring-indicator__label {
	color: var(--color-muted);
	font-size: .8rem;
	font-weight: 650;
}

.monitoring-indicator__value {
	display: block;
	margin: .12rem 0 .18rem;
	color: var(--color-forest);
	font-family: var(--font-display);
	font-size: clamp(1.8rem, 3vw, 2.35rem);
	font-weight: 600;
	line-height: 1.2;
}

.monitoring-indicator__note {
	color: var(--color-muted);
	font-size: .73rem;
}

.monitoring-summary {
	margin-bottom: 2rem;
}

.monitoring-main-grid {
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
	align-items: start;
	gap: 1rem;
}

.monitoring-card {
	min-width: 0;
	padding: clamp(1rem, 2vw, 1.4rem);
	border: 1px solid var(--color-line);
	border-radius: 18px;
	background: var(--color-white);
}

.monitoring-card__heading {
	align-items: center;
	margin-bottom: .8rem;
}

.monitoring-range-label {
	display: grid;
	gap: .25rem;
	color: var(--color-forest);
	font-size: .75rem;
	font-weight: 700;
}

.monitoring-range-label select {
	min-height: 40px;
	max-width: 185px;
	padding: .45rem 2rem .45rem .6rem;
	border: 1px solid var(--color-line);
	border-radius: 8px;
	background: var(--color-white);
	color: var(--color-ink);
	font-size: .8rem;
}

.monitoring-chart-wrap {
	width: 100%;
	overflow-x: auto;
}

.monitoring-chart {
	display: block;
	width: 100%;
	min-width: 430px;
	height: auto;
	overflow: visible;
}

.monitoring-chart__grid {
	stroke: var(--color-line);
	stroke-width: 1;
}

.monitoring-chart__axis-label {
	fill: var(--color-muted);
	font-family: var(--font-body);
	font-size: 12px;
}

.monitoring-chart__line {
	fill: none;
	stroke: var(--color-forest);
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 4;
}

.monitoring-chart__point {
	fill: var(--color-white);
	stroke: var(--color-green);
	stroke-width: 4;
	cursor: pointer;
}

.monitoring-chart__point:focus {
	stroke: #ad7445;
	stroke-width: 5;
	outline: none;
}

.monitoring-chart-readout {
	min-height: 1.5em;
	margin: .3rem 0 .7rem;
	color: var(--color-muted);
	font-size: .78rem;
}

.monitoring-table-details {
	border-top: 1px solid var(--color-line);
	font-size: .83rem;
}

.monitoring-table-details summary {
	width: fit-content;
	padding: .8rem .15rem .25rem;
	color: var(--color-forest);
	font-weight: 700;
	cursor: pointer;
}

.monitoring-table-scroll {
	max-width: 100%;
	overflow-x: auto;
}

.monitoring-table-details table {
	width: 100%;
	border-collapse: collapse;
	text-align: left;
}

.monitoring-table-details th,
.monitoring-table-details td {
	padding: .5rem .4rem;
	border-bottom: 1px solid var(--color-line);
}

.monitoring-table-details th {
	color: var(--color-forest);
}

.monitoring-map {
	position: relative;
	min-height: 270px;
	aspect-ratio: 600 / 360;
	overflow: hidden;
	border: 1px solid var(--color-line);
	border-radius: 14px;
	background: #e8f0eb;
}

.monitoring-map__art,
.monitoring-map__markers {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

.monitoring-map__shore {
	fill: #d1e1d7;
	stroke: #789d88;
	stroke-linejoin: round;
	stroke-width: 3;
}

.monitoring-map__ridge,
.monitoring-map__shoreline {
	fill: none;
	stroke: #a8c1b1;
	stroke-linecap: round;
	stroke-width: 2;
}

.monitoring-map__shoreline {
	stroke: #729b83;
	stroke-dasharray: 3 7;
}

.monitoring-map__markers {
	pointer-events: none;
}

.monitoring-map__marker {
	position: absolute;
	width: 42px;
	height: 42px;
	transform: translate(-50%, -50%);
	border: 3px solid var(--color-white);
	border-radius: 50%;
	background: var(--color-forest);
	color: var(--color-white);
	font-size: .75rem;
	font-weight: 800;
	box-shadow: 0 2px 10px rgb(24 62 53 / 28%);
	cursor: pointer;
	pointer-events: auto;
}

.monitoring-map__marker:hover,
.monitoring-map__marker[aria-pressed="true"] {
	background: #ad7445;
}

.monitoring-map-note {
	margin: .6rem 0 0;
	color: var(--color-muted);
	font-size: .74rem;
}

.monitoring-observation-detail {
	min-height: 4rem;
	margin: .7rem 0 0;
	padding: .75rem .85rem;
	border-left: 3px solid var(--color-green);
	background: #f8faf8;
	color: var(--color-muted);
	font-size: .82rem;
}

.monitoring-observation-detail strong {
	color: var(--color-forest);
}

.monitoring-recent {
	margin-top: 2rem;
}

.monitoring-observations {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: .75rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.monitoring-observation-button {
	display: grid;
	width: 100%;
	min-height: 150px;
	align-content: start;
	gap: .4rem;
	padding: 1rem;
	border: 1px solid var(--color-line);
	border-radius: 14px;
	background: var(--color-white);
	color: var(--color-ink);
	text-align: left;
	cursor: pointer;
	transition: border-color .2s ease, background-color .2s ease;
}

.monitoring-observation-button:hover,
.monitoring-observation-button[aria-pressed="true"] {
	border-color: #9eb9aa;
	background: #f8faf8;
}

.monitoring-observation-button__meta {
	color: var(--color-muted);
	font-size: .74rem;
}

.monitoring-observation-button__title {
	color: var(--color-forest);
	font-size: .95rem;
	font-weight: 750;
}

.monitoring-observation-button__summary {
	color: var(--color-muted);
	font-size: .82rem;
	line-height: 1.5;
}

.monitoring-empty {
	margin: 0;
	padding: 1rem;
	border: 1px dashed #a5b8ac;
	border-radius: 12px;
	background: #f8faf8;
	color: var(--color-muted);
}

@media (max-width: 980px) {
	.monitoring-categories {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.monitoring-main-grid {
		grid-template-columns: minmax(0, 1fr) minmax(0, .9fr);
	}

	.monitoring-observations {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 760px) {
	.monitoring-dashboard {
		padding: 1rem;
		border-radius: 18px;
	}

	.monitoring-main-grid {
		grid-template-columns: 1fr;
	}

	.monitoring-map {
		min-height: 250px;
	}
}

@media (max-width: 520px) {
	.monitoring-categories,
	.monitoring-indicators,
	.monitoring-observations {
		grid-template-columns: 1fr;
	}

	.monitoring-category-button {
		min-height: 48px;
	}

	.monitoring-subheading,
	.monitoring-card__heading {
		align-items: flex-start;
		flex-direction: column;
	}

	.monitoring-range-label select {
		max-width: none;
	}

	.monitoring-map {
		min-height: 210px;
	}

	.monitoring-map__marker {
		width: 38px;
		height: 38px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.monitoring-category-button,
	.monitoring-observation-button {
		transition: none;
	}
}

/* Published, source-attributed annual emissions. This section never shares a chart with demo values. */
.published-emissions [hidden] { display: none !important; }
.published-emissions__intro { max-width: 760px; margin: 0 0 1.6rem; }
.published-emissions__intro h2 { margin-top: 0; margin-bottom: .65rem; font-size: clamp(2.1rem, 4vw, 3.5rem); text-wrap: balance; }
.published-emissions__intro > p:last-child { max-width: 650px; margin-bottom: 0; color: var(--color-muted); font-size: 1.04rem; }
.emissions-classification {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .65rem 1rem;
	margin-bottom: 1rem;
	padding: 1rem 1.15rem;
	border: 1px solid #bfd7d7;
	border-left: 4px solid var(--color-sea);
	border-radius: 12px;
	background: #f2f8f7;
}
.emissions-classification p { margin: 0; color: #355d62; font-size: .88rem; }
.emissions-status { min-height: 1.4em; margin: .4rem 0 1rem; color: var(--color-muted); font-size: .82rem; }
.emissions-error { padding: 1rem 1.15rem; border: 1px solid #d8aaa0; border-radius: 14px; background: #fff8f6; color: #6e2d22; }
.emissions-error p { margin: 0 0 .8rem; }
.emissions-content { display: grid; gap: 1rem; }
.emissions-kpis { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .85rem; }
.emissions-kpi { display: grid; gap: .2rem; min-width: 0; padding: 1.1rem 1.3rem; border: 1px solid #cbdcd2; border-radius: 16px; background: var(--color-white); box-shadow: 0 8px 24px rgb(24 62 53 / 4%); }
.emissions-kpi__year { color: var(--color-muted); font-size: .78rem; font-weight: 750; letter-spacing: .06em; text-transform: uppercase; }
.emissions-kpi__value { color: var(--color-forest); font-family: var(--font-display); font-size: clamp(1.8rem, 3vw, 2.65rem); font-weight: 600; line-height: 1.14; }
.emissions-kpi__caption { color: var(--color-muted); font-size: .78rem; }
.emissions-layout { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(275px, .65fr); align-items: start; gap: 1rem; }
.emissions-aside { display: grid; gap: 1rem; min-width: 0; }
.emissions-card { min-width: 0; padding: clamp(1rem, 2vw, 1.45rem); border: 1px solid var(--color-line); border-radius: 18px; background: var(--color-white); box-shadow: 0 8px 24px rgb(24 62 53 / 4%); }
.emissions-card__heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: .6rem; }
.emissions-card__heading h3,
.emissions-context h3 { margin: 0; font-size: 1.08rem; }
.emissions-card__heading p { margin: .25rem 0 0; color: var(--color-muted); font-size: .78rem; }
.emissions-chart-wrap { width: 100%; overflow-x: auto; }
.emissions-chart { display: block; width: 100%; min-width: 390px; height: auto; overflow: visible; }
.emissions-chart__grid { stroke: var(--color-line); stroke-width: 1; }
.emissions-chart__axis { fill: var(--color-muted); font-family: var(--font-body); font-size: 12px; }
.emissions-chart__bar { fill: var(--color-sea); }
.emissions-chart__value { fill: var(--color-forest); font-family: var(--font-body); font-size: 12px; font-weight: 750; }
.emissions-chart-note { margin: .25rem 0 .9rem; color: var(--color-muted); font-size: .76rem; }
.emissions-table-wrap { max-width: 100%; overflow-x: auto; border-top: 1px solid var(--color-line); }
.emissions-table { width: 100%; margin-top: .6rem; border-collapse: collapse; text-align: left; font-size: .82rem; }
.emissions-table caption { padding: .3rem 0 .65rem; color: var(--color-muted); font-size: .75rem; text-align: left; }
.emissions-table th,
.emissions-table td { padding: .55rem .5rem; border-bottom: 1px solid var(--color-line); vertical-align: top; }
.emissions-table thead th { color: var(--color-forest); font-size: .72rem; letter-spacing: .025em; }
.emissions-table tbody th { min-width: 145px; color: var(--color-ink); font-weight: 650; }
.emissions-context dl { display: grid; gap: 0; margin: .9rem 0; }
.emissions-context dl > div { display: grid; grid-template-columns: minmax(90px, .7fr) minmax(0, 1fr); gap: .7rem; padding: .58rem 0; border-bottom: 1px solid var(--color-line); }
.emissions-context dt { color: var(--color-muted); font-size: .78rem; }
.emissions-context dd { margin: 0; color: var(--color-forest); font-size: .82rem; font-weight: 700; overflow-wrap: anywhere; }
.emissions-attribution { margin: .9rem 0 .5rem; color: var(--color-muted); font-size: .8rem; }
.emissions-attribution a { font-weight: 700; }
.emissions-downloads { margin: .35rem 0 .65rem; font-size: .78rem; font-weight: 700; }
.emissions-downloads a { color: var(--color-sea); text-decoration-thickness: 1px; text-underline-offset: .18em; }
.emissions-rights-note { margin: 0; color: var(--color-muted); font-size: .72rem; line-height: 1.5; }
.station-availability .eyebrow { margin-bottom: .35rem; font-size: .65rem; }
.station-availability__surface { display: grid; min-height: 128px; place-items: center; margin-top: .8rem; padding: 1.1rem; border: 1px dashed #aec5b7; border-radius: 13px; background: var(--color-sage); color: var(--color-forest); text-align: center; }
.station-availability__surface p { max-width: 240px; margin: 0; font-size: .88rem; font-weight: 700; }
.station-list { display: grid; gap: .4rem; margin: .75rem 0 0; padding-left: 1.25rem; color: var(--color-forest); font-size: .82rem; }

@media (max-width: 900px) {
	.emissions-layout { grid-template-columns: minmax(0, 1fr); }
	.emissions-aside { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 600px) {
	.emissions-kpis,
	.emissions-aside { grid-template-columns: 1fr; }
	.published-emissions__intro h2 { font-size: clamp(1.5rem, 5vw, 1.9rem); }
	.emissions-classification { align-items: flex-start; flex-direction: column; }
	.emissions-card { border-radius: 15px; }
	.emissions-table { min-width: 470px; }
}