/* Hallmark · tokens: Autolevi fuel calculator · system: design.md */
/* Hallmark · pre-emit critique: P5 H5 E5 S5 R5 V4 */
.autolevi-fuel-calculator,
.autolevi-fuel-calculator-preview {
	--color-paper: oklch(97.8% 0.004 255);
	--color-surface: oklch(99.2% 0.003 255);
	--color-surface-soft: oklch(95.8% 0.008 255);
	--color-surface-strong: oklch(91.5% 0.012 255);
	--color-ink: oklch(22% 0.018 260);
	--color-ink-soft: oklch(34% 0.018 260);
	--color-muted: oklch(45% 0.016 260);
	--color-rule: oklch(84% 0.01 255);
	--color-control: oklch(63% 0.014 255);
	--color-accent: oklch(50% 0.17 250);
	--color-accent-soft: oklch(94% 0.032 250);
	--color-accent-ink: oklch(98.5% 0.004 255);
	--color-focus: oklch(52% 0.2 250);
	--color-success: oklch(42% 0.12 150);
	--color-success-soft: oklch(95% 0.03 150);
	--color-error: oklch(48% 0.18 25);
	--color-error-soft: oklch(95% 0.035 25);
	--color-shadow: oklch(18% 0.018 260 / 0.08);
	--color-transparent: oklch(0% 0 0 / 0);

	--font-display: "Poppins", "GlacialIndifference", ui-sans-serif, sans-serif;
	--font-body: "Roboto", "GlacialIndifference", ui-sans-serif, sans-serif;
	--font-data: "Roboto", "GlacialIndifference", ui-sans-serif, sans-serif;

	--space-3xs: 0.125rem;
	--space-2xs: 0.25rem;
	--space-xs: 0.5rem;
	--space-sm: 0.75rem;
	--space-md: 1rem;
	--space-lg: 1.5rem;
	--space-xl: 2.5rem;
	--space-2xl: 4rem;
	--space-3xl: 6rem;

	--text-xs: 0.75rem;
	--text-sm: 0.875rem;
	--text-base: 1rem;
	--text-md: 1.25rem;
	--text-lg: 1.5625rem;
	--text-xl: 1.953rem;
	--text-2xl: 2.441rem;
	--text-display: clamp(2.35rem, 7vw, 4.75rem);

	--ease-out: cubic-bezier(0.16, 1, 0.3, 1);
	--ease-in: cubic-bezier(0.7, 0, 0.84, 0);
	--ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
	--dur-micro: 120ms;
	--dur-short: 200ms;
	--dur-result: 420ms;

	--rule-thin: 1px;
	--radius-control: 0.625rem;
	--radius-panel: 1rem;
	--radius-pill: 999px;
	--shadow-raised: 0 0.125rem 1rem var(--color-shadow);
	--control-height: 3rem;
}