/*
 * Soup Store design tokens. Shared by the replay site, landing page and client.
 * Brand colors: #5c8477 (green), #8eb9a4 (light green), white.
 *
 * Contrast (WCAG): white on --ss-green 4.2:1 (headings/buttons/bold text),
 * --ss-ink on --ss-green-light 6.9:1, --ss-green-dark on white 6.2:1 (links/small text),
 * --ss-green-light on the dark background 7.7:1.
 */
/* Montserrat (SIL Open Font License, fonts/OFL.txt), self-hosted: served next to this file */
@font-face {
	font-family: "Montserrat";
	font-weight: 600;
	font-display: swap;
	src: url("fonts/Montserrat-SemiBold.woff2") format("woff2");
}
@font-face {
	font-family: "Montserrat";
	font-weight: 800;
	font-display: swap;
	src: url("fonts/Montserrat-ExtraBold.woff2") format("woff2");
}

:root {
	--ss-green: #5c8477;
	--ss-green-light: #8eb9a4;
	--ss-green-dark: #46685d;
	--ss-white: #ffffff;

	--ss-bg: #f4f8f6;
	--ss-surface: #ffffff;
	--ss-surface-2: #e8f1ed;
	--ss-ink: #1b2a25;
	--ss-muted: #54665f;
	--ss-border: #d3e2dc;
	--ss-link: var(--ss-green-dark);
	--ss-accent: var(--ss-green);
	--ss-on-accent: var(--ss-white);

	--ss-radius: 12px;
	--ss-radius-sm: 8px;
	--ss-font: "Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif;
	--ss-font-body: system-ui, -apple-system, "Segoe UI", sans-serif;
	color-scheme: light dark;
}

@media (prefers-color-scheme: dark) {
	:root {
		--ss-bg: #15201c;
		--ss-surface: #1e2c27;
		--ss-surface-2: #263832;
		--ss-ink: #eef5f2;
		--ss-muted: #a3b8b0;
		--ss-border: #33483f;
		--ss-link: var(--ss-green-light);
	}
}