/*
 * GENERATED by scripts/design-tokens.py from docs/design/tokens.json and docs/design/tokens.resolver.json.
 * Do not edit: change the tokens and run `python3 scripts/design-tokens.py --write`.
 * The modes' colours (ADR-0045): the system's (prefers-color-scheme) unless the member chose one, which the
 * root's data-theme ("light" or "dark") carries and which wins. Load it after design-tokens.css. Every other
 * token is the same in both modes.
 */

:root {
	color-scheme: light dark;
}

@media (prefers-color-scheme: dark) {
	:root:not([data-theme="light"]) {
		color-scheme: dark;
		--lcr-color-background: #121212;
		--lcr-color-ink: #EDEDED;
		--lcr-color-body: #CCCCCC;
		--lcr-color-muted: #9E9E9E;
		--lcr-color-fill: #262626;
		--lcr-color-panel: #1C1C1C;
		--lcr-color-divider: #303030;
		--lcr-color-outline: #404040;
		--lcr-color-chip-outline: #3A3A3A;
		--lcr-color-dashed-outline: #666666;
		--lcr-color-on-ink: #121212;
		--lcr-color-on-ink-muted: #5C5C5C;
		--lcr-color-ink-raised: #D1D1D1;
		--lcr-color-overlay: #11111166;
		--lcr-color-scrim: #00000099;
		--lcr-color-stage: #000000;
		--lcr-color-on-stage: #EDEDED;
		--lcr-color-on-stage-muted: #A0A0A0;
		--lcr-color-stage-raised: #2A2A2A;
		--lcr-color-focus: #EDEDED;
		--lcr-color-focus-on-stage: #EDEDED;
		--lcr-color-logo: #FFFFFF;
		--lcr-color-provider-surface: #FFFFFF;
		--lcr-color-provider-outline: #FFFFFF;
		--lcr-color-provider-ink: #1F1F1F;
		--lcr-color-provider-black: #000000;
		--lcr-web-signal-required: #EE9A9A;
	}
}

:root[data-theme="dark"] {
	color-scheme: dark;
	--lcr-color-background: #121212;
	--lcr-color-ink: #EDEDED;
	--lcr-color-body: #CCCCCC;
	--lcr-color-muted: #9E9E9E;
	--lcr-color-fill: #262626;
	--lcr-color-panel: #1C1C1C;
	--lcr-color-divider: #303030;
	--lcr-color-outline: #404040;
	--lcr-color-chip-outline: #3A3A3A;
	--lcr-color-dashed-outline: #666666;
	--lcr-color-on-ink: #121212;
	--lcr-color-on-ink-muted: #5C5C5C;
	--lcr-color-ink-raised: #D1D1D1;
	--lcr-color-overlay: #11111166;
	--lcr-color-scrim: #00000099;
	--lcr-color-stage: #000000;
	--lcr-color-on-stage: #EDEDED;
	--lcr-color-on-stage-muted: #A0A0A0;
	--lcr-color-stage-raised: #2A2A2A;
	--lcr-color-focus: #EDEDED;
	--lcr-color-focus-on-stage: #EDEDED;
	--lcr-color-logo: #FFFFFF;
	--lcr-color-provider-surface: #FFFFFF;
	--lcr-color-provider-outline: #FFFFFF;
	--lcr-color-provider-ink: #1F1F1F;
	--lcr-color-provider-black: #000000;
	--lcr-web-signal-required: #EE9A9A;
}

:root[data-theme="light"] {
	color-scheme: light;
	--lcr-color-background: #FFFFFF;
	--lcr-color-ink: #111111;
	--lcr-color-body: #333333;
	--lcr-color-muted: #6B6B6B;
	--lcr-color-fill: #F3F3F3;
	--lcr-color-panel: #F7F7F7;
	--lcr-color-divider: #EBEBEB;
	--lcr-color-outline: #DDDDDD;
	--lcr-color-chip-outline: #E3E3E3;
	--lcr-color-dashed-outline: #BDBDBD;
	--lcr-color-on-ink: #FFFFFF;
	--lcr-color-on-ink-muted: #A0A0A0;
	--lcr-color-ink-raised: #333333;
	--lcr-color-overlay: #11111166;
	--lcr-color-scrim: #11111166;
	--lcr-color-stage: #111111;
	--lcr-color-on-stage: #FFFFFF;
	--lcr-color-on-stage-muted: #A0A0A0;
	--lcr-color-stage-raised: #333333;
	--lcr-color-focus: #111111;
	--lcr-color-focus-on-stage: #FFFFFF;
	--lcr-color-logo: #212121;
	--lcr-color-provider-surface: #FFFFFF;
	--lcr-color-provider-outline: #111111;
	--lcr-color-provider-ink: #1F1F1F;
	--lcr-color-provider-black: #000000;
	--lcr-web-signal-required: #EE9A9A;
}