/* Hallmark · component: price-reference card · genre: modern-minimal · theme: Autolevi cobalt
 * states: static informational component · contrast: pass (40–41) · honest: pass (46) · tokens: pass (48)
 * pre-emit critique: P5 H5 E4 S5 R5 V4
 */
.autolevi-price-reference {
	--color-paper: oklch(100% 0 0);
	--color-ink: oklch(24% 0.025 255);
	--color-muted: oklch(52% 0.025 255);
	--color-rule: oklch(88% 0.018 255);
	--color-track: oklch(91% 0.014 255);
	--color-reference: oklch(79% 0.105 220);
	--color-accent-soft: oklch(96% 0.025 255);
	--font-display: inherit;
	--font-body: inherit;
	--space-1: 4px;
	--space-2: 8px;
	--space-3: 12px;
	--space-4: 16px;
	--space-5: 20px;
	--space-6: 24px;
	--marker-width: 132px;
	--marker-edge-safe: 76px;
	--marker-rail-offset: 76px;
	--radius-card: 14px;
	--radius-small: 9px;
	--rule-thin: 1px;

	background: var(--color-paper);
	border: var(--rule-thin) solid var(--color-rule);
	border-radius: var(--radius-card);
	color: var(--color-ink);
	font-family: var(--font-body);
	margin-bottom: var(--space-5);
	overflow: visible;
	padding: var(--space-6);
}

.autolevi-price-reference__header h2 {
	color: var(--color-ink);
	font-family: var(--font-display);
	font-size: clamp(22px, 2.2vw, 28px);
	font-style: normal;
	font-weight: 700;
	letter-spacing: -0.025em;
	line-height: 1.15;
	margin: 0;
	min-width: 0;
	overflow-wrap: anywhere;
}

.autolevi-price-reference__header p {
	color: var(--color-muted);
	font-size: 14px;
	line-height: 1.5;
	margin: var(--space-2) 0 0;
}

.autolevi-price-reference__chart {
	margin-top: var(--space-4);
	padding-top: var(--marker-rail-offset);
	position: relative;
}

.autolevi-price-reference__marker {
	background: var(--color-accent-soft);
	border: var(--rule-thin) solid var(--color-rule);
	border-radius: var(--radius-small);
	box-sizing: border-box;
	left: clamp(
		var(--marker-edge-safe),
		var(--autolevi-marker-position),
		calc(100% - var(--marker-edge-safe))
	);
	max-width: calc(100% - var(--space-4));
	min-width: var(--marker-width);
	padding: var(--space-2) var(--space-3);
	position: absolute;
	top: 0;
	transform: translateX(-50%);
	width: max-content;
	z-index: 1;
}

.autolevi-price-reference__marker::after {
	background: var(--color-accent-soft);
	border-bottom: var(--rule-thin) solid var(--color-rule);
	border-right: var(--rule-thin) solid var(--color-rule);
	bottom: -5px;
	content: '';
	height: 9px;
	left: calc(50% - 5px);
	position: absolute;
	transform: rotate(45deg);
	width: 9px;
}

.autolevi-price-reference__marker strong,
.autolevi-price-reference__marker span {
	display: block;
}

.autolevi-price-reference__marker strong {
	font-size: 17px;
	font-weight: 750;
	line-height: 1.2;
	white-space: nowrap;
}

.autolevi-price-reference__marker span {
	color: var(--color-muted);
	font-size: 11px;
	line-height: 1.35;
	margin-top: var(--space-1);
}

.autolevi-price-reference__track {
	background: var(--color-track);
	border-radius: 999px;
	height: 14px;
	overflow: hidden;
	position: relative;
}

.autolevi-price-reference__reference-band {
	background: var(--color-reference);
	bottom: 0;
	left: 37.5%;
	position: absolute;
	top: 0;
	width: 25%;
}

.autolevi-price-reference__chart.is-unavailable .autolevi-price-reference__reference-band {
	background: var(--color-track);
	left: 0;
	width: 100%;
}

.autolevi-price-reference__stats {
	display: grid;
	gap: var(--space-3);
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	margin-top: var(--space-6);
}

.autolevi-price-reference__stat {
	border: var(--rule-thin) solid var(--color-rule);
	border-radius: var(--radius-small);
	min-width: 0;
	padding: var(--space-4);
}

.autolevi-price-reference__stat strong,
.autolevi-price-reference__stat span {
	display: block;
}

.autolevi-price-reference__stat strong {
	color: var(--color-ink);
	font-size: clamp(16px, 1.8vw, 20px);
	font-weight: 750;
	line-height: 1.2;
	overflow-wrap: anywhere;
}

.autolevi-price-reference__stat span {
	color: var(--color-muted);
	font-size: 10px;
	font-weight: 600;
	letter-spacing: 0.055em;
	line-height: 1.35;
	margin-top: var(--space-2);
	text-transform: uppercase;
}

.autolevi-price-reference__stat.is-muted strong {
	color: var(--color-muted);
	font-size: 15px;
}

.autolevi-price-reference__source {
	color: var(--color-muted);
	font-size: 11px;
	line-height: 1.45;
	margin: var(--space-4) 0 0;
}

@media (max-width: 414px) {
	.autolevi-price-reference {
		border-left: 0;
		border-radius: 0;
		border-right: 0;
		padding: var(--space-5) var(--space-4);
	}


	.autolevi-price-reference__stats {
		grid-template-columns: minmax(0, 1fr);
	}
}

@media (prefers-reduced-motion: reduce) {
	.autolevi-price-reference *,
	.autolevi-price-reference *::before,
	.autolevi-price-reference *::after {
		scroll-behavior: auto !important;
	}
}