:root {
	color-scheme: light;

	/* Color roles shared by the landing page and authenticated product. */
	--color-canvas: #f6f5f2;
	--color-surface: #ffffff;
	--color-surface-subtle: #f1f0ec;
	--color-surface-pressed: #e8e7e2;
	--color-ink: #131b2e;
	--color-ink-secondary: #3f4b63;
	--color-ink-muted: #59647a;
	--color-blue-deep: #003594;
	--color-blue-deep-rgb: 0 53 148;
	--color-blue-standard: #004ac6;
	--color-blue-bright: #2878e5;
	--color-blue-soft: #e7f1ff;
	--color-violet: #6553aa;
	--color-violet-soft: #eeebff;
	--color-success: #087c61;
	--color-success-soft: #eaf8f3;
	--color-warning: #9a6700;
	--color-warning-soft: #fff7df;
	--color-danger: #b42318;
	--color-danger-soft: #fff1f0;
	--color-line: #e3e1dc;
	--color-line-strong: #d2d0ca;
	--color-focus: #004ac6;

	/* Marketing keeps its original cool identity without changing product roles. */
	--marketing-canvas: #faf8ff;
	--marketing-surface: #ffffff;
	--marketing-surface-subtle: #f1f2fc;
	--marketing-primary: #174ea6;
	--marketing-primary-rgb: 23 78 166;
	--marketing-primary-hover: #0d3f91;
	--marketing-ink: #182033;
	--marketing-muted: #687086;
	--marketing-line: #e3e5ef;
	--marketing-stage-background: linear-gradient(
		145deg,
		#ffffff 0%,
		#f1f2fc 64%,
		#e8eefb 100%
	);
	--marketing-stage-border: #d7ddea;
	--marketing-stage-window-border: #dfe3f0;
	--marketing-stage-shadow: 0 28px 70px rgba(29, 51, 96, 0.14);
	--marketing-stage-window-shadow: 0 16px 40px rgba(29, 51, 96, 0.12);
	--marketing-featured-kpi-background: var(--marketing-primary);
	--marketing-featured-kpi-text: #ffffff;
	--marketing-featured-kpi-text-secondary: rgba(255, 255, 255, 0.76);
	--marketing-stage-caption: var(--marketing-muted);

	/* The single dark product anchor uses ink rather than pure black. */
	--anchor-background: var(--color-ink);
	--anchor-background-raised: #1b2942;
	--anchor-text: #f8fbff;
	--anchor-text-secondary: #c5cede;
	--anchor-accent: #9ec1ff;
	--anchor-border: rgba(158, 193, 255, 0.24);

	/* Typography roles. Inter remains the interface face; Sora is display-only. */
	--font-body: "Inter", sans-serif;
	--font-display: "Sora", sans-serif;
	--font-mono: "Inter", sans-serif;
	--text-xs: 0.72rem;
	--text-sm: 0.85rem;
	--text-md: 0.95rem;

	/* Geometry roles: controls, ordinary cards, then featured surfaces/dialogs. */
	--radius-control: 12px;
	--radius-card: 16px;
	--radius-featured: 20px;
	--radius-pill: 999px;

	--space-1: 4px;
	--space-2: 8px;
	--space-3: 12px;
	--space-4: 16px;
	--space-5: 24px;

	--shadow-card: 0 3px 14px rgba(30, 38, 52, 0.05);
	--shadow-panel: 0 8px 30px rgba(30, 38, 52, 0.06);
	--shadow-sm: 0 1px 5px rgba(30, 38, 52, 0.05);
	--shadow-md: var(--shadow-card);
	--shadow-lg: var(--shadow-panel);
	--shadow-xl:
		0 20px 56px rgba(30, 52, 100, 0.14), 0 2px 8px rgba(30, 52, 100, 0.06);
	--shadow-glow: 0 0 0 4px rgba(0, 74, 198, 0.13);
	--ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
	--ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);

	/* Compatibility aliases keep existing product CSS on the shared contract. */
	--canvas: var(--color-canvas);
	--surface: var(--color-surface);
	--surface-raised: var(--color-surface);
	--surface-subtle: var(--color-surface-subtle);
	--surface-pressed: var(--color-surface-pressed);
	--ink: var(--color-ink);
	--ink-secondary: var(--color-ink-secondary);
	--ink-muted: var(--color-ink-muted);
	--primary: var(--color-blue-deep);
	--primary-container: var(--color-blue-standard);
	--accent: var(--color-blue-deep);
	--accent-hover: var(--color-blue-standard);
	--accent-soft: rgba(0, 53, 148, 0.06);
	--accent-line: rgba(0, 53, 148, 0.18);
	--danger: var(--color-danger);
	--danger-soft: var(--color-danger-soft);
	--success: var(--color-success);
	--success-soft: var(--color-success-soft);
	--warning: var(--color-warning);
	--warning-soft: var(--color-warning-soft);
	--line: var(--color-line);
	--line-strong: var(--color-line-strong);
	--focus: var(--color-focus);
	--radius-panel: var(--radius-featured);
	--radius-lg: var(--radius-featured);
	--radius-md: var(--radius-card);
	--radius-sm: var(--radius-control);
}