/* Prodigy Lightfield: the app's plum ground and violet light (Lightfield/LightfieldStyle.swift); a lavender page in light.
   Self-hosted faces (SIL Open Font License, files in fonts/ beside their OFL text), then token overrides:
   light on bare :root, then the system-dark block, then the chosen-dark block. Only tokens from engine/css/tokens.css. */

@font-face {
	font-family: "Outfit";
	font-style: normal;
	font-weight: 300 600;
	font-display: swap;
	src: url("fonts/outfit.woff2") format("woff2");
}

@font-face {
	font-family: "DM Sans";
	font-style: normal;
	font-weight: 400 700;
	font-display: swap;
	src: url("fonts/dm-sans.woff2") format("woff2");
}

:root {
	--bg: #F8F5FC;
	--bg-2: #EFE8F8;
	--surface: #FFFFFF;
	--surface-2: #F3EEFA;
	--glass: rgba(255, 255, 255, 0.72);
	--header-bg: rgba(248, 245, 252, 0.86);
	--fg: #241A33;
	--fg-2: #574A6B;
	--heading: #1B1030;
	--line: #E2D8EE;
	--line-2: #CDBDE3;
	--accent: #6B3DB8;
	--accent-ink: #FFFFFF;
	--accent-2: #B875FF;
	--label: #5E2FA8;
	--link: #5E2FA8;
	--link-hover: #3F1D7A;
	--focus: #5E2FA8;
	--shadow: rgba(33, 20, 54, 0.16);
	--shadow-soft: rgba(33, 20, 54, 0.07);
	--halo: rgba(184, 117, 255, 0.24);
	--spark-1: #B875FF;
	--spark-2: #4FA3E0;
	--spark-3: #E0A030;
	--aurora-1: #EBD9FF;
	--aurora-2: #D6E9FB;
	--aurora-3: #FCE6C8;
	--aurora-4: #E5F5E9;
	--sky-1: #F3ECFC;
	--sky-2: #F8F5FC;
	--sky-3: #FBF4EE;
	--sig-glow: #B875FF;
	--sig-line: #6B3DB8;
	--sig-core: #FFFFFF;
	--f-display: Outfit, "Avenir Next", Futura, system-ui, sans-serif;
	--f-body: "DM Sans", "Avenir Next", "Segoe UI", system-ui, sans-serif;
	--w-hero: 400;
	--w-head: 500;
	--w-body-strong: 600;
	--fs-hero: clamp(2.6rem, 4vw + 1.3rem, 4.6rem);
	--lh-head: 1.1;
	--track-label: 0.14em;
	--radius: 18px;
	--radius-lg: 18px;
	--max: 1120px;
}

@media (prefers-color-scheme: dark) {
	:root:not([data-theme="light"]) {
		--bg: #211436;
		--bg-2: #1A0F2C;
		--surface: #2B1C45;
		--surface-2: #35244F;
		--glass: rgba(255, 255, 255, 0.08);
		--header-bg: rgba(33, 20, 54, 0.84);
		--fg: #FFFFFF;
		--fg-2: #C7C7C7;
		--heading: #FFFFFF;
		--line: #3D2C5C;
		--line-2: rgba(255, 255, 255, 0.22);
		--accent: #B875FF;
		--accent-ink: #1A0F2C;
		--accent-2: #B875FF;
		--label: #CDA6FF;
		--link: #CDA6FF;
		--link-hover: #E4CFFF;
		--focus: #CDA6FF;
		--shadow: rgba(0, 0, 0, 0.5);
		--shadow-soft: rgba(0, 0, 0, 0.3);
		--halo: rgba(184, 117, 255, 0.3);
		--spark-1: #B875FF;
		--spark-2: #7FD8FF;
		--spark-3: #FFD166;
		--aurora-1: #3F1D6E;
		--aurora-2: #163A6A;
		--aurora-3: #4A2A3A;
		--aurora-4: #16423A;
		--sky-1: #1A0F2C;
		--sky-2: #211436;
		--sky-3: #2A1840;
		--sig-glow: #B875FF;
		--sig-line: #E4CFFF;
		--sig-core: #FFFFFF;
		color-scheme: dark;
	}
}

:root[data-theme="dark"] {
	--bg: #211436;
	--bg-2: #1A0F2C;
	--surface: #2B1C45;
	--surface-2: #35244F;
	--glass: rgba(255, 255, 255, 0.08);
	--header-bg: rgba(33, 20, 54, 0.84);
	--fg: #FFFFFF;
	--fg-2: #C7C7C7;
	--heading: #FFFFFF;
	--line: #3D2C5C;
	--line-2: rgba(255, 255, 255, 0.22);
	--accent: #B875FF;
	--accent-ink: #1A0F2C;
	--accent-2: #B875FF;
	--label: #CDA6FF;
	--link: #CDA6FF;
	--link-hover: #E4CFFF;
	--focus: #CDA6FF;
	--shadow: rgba(0, 0, 0, 0.5);
	--shadow-soft: rgba(0, 0, 0, 0.3);
	--halo: rgba(184, 117, 255, 0.3);
	--spark-1: #B875FF;
	--spark-2: #7FD8FF;
	--spark-3: #FFD166;
	--aurora-1: #3F1D6E;
	--aurora-2: #163A6A;
	--aurora-3: #4A2A3A;
	--aurora-4: #16423A;
	--sky-1: #1A0F2C;
	--sky-2: #211436;
	--sky-3: #2A1840;
	--sig-glow: #B875FF;
	--sig-line: #E4CFFF;
	--sig-core: #FFFFFF;
	color-scheme: dark;
}
