:root,
:root[data-syncrew-theme='light'] {
	color-scheme: light;
	--color-page: #f6f8fb;
	--color-background: var(--color-page);
	--color-surface: #ffffff;
	--color-surface-soft: #f9fbfd;
	--color-text: #17202a;
	--color-text-secondary: #627284;
	--color-text-muted: #647486;
	--color-border: #d8dee6;
	--color-border-strong: #c5ced8;
	--color-border-soft: #e1e7ee;
	--color-control-hover: #eef3f7;
	--color-control-active: #e8eef5;
	--color-action: #17202a;
	--color-action-secondary: #536273;
	--color-on-action: #ffffff;
	--color-danger: #b42318;
	--color-danger-strong: #7a271a;
	--color-danger-bg: #fff1f1;
	--color-danger-border: #f2b8b5;
	--color-warning-bg: #fff8dc;
	--color-warning-surface: #fffaf0;
	--color-warning-border: #e1bf67;
	--color-warning-border-soft: #ead9aa;
	--color-warning-text: #6e5313;
	--color-status-pending-bg: #fff4cf;
	--color-status-pending-border: #e0bd72;
	--color-status-pending-text: #7a5a12;
	--color-status-confirmed-bg: #e7f3ed;
	--color-status-confirmed-border: #9bcab5;
	--color-status-confirmed-text: #315f4f;
	--color-status-cancelled-bg: #fde2e2;
	--color-status-cancelled-text: #8f1d1d;
	--color-payment-paid-bg: #e7f3ed;
	--color-payment-paid-text: #315f4f;
	--color-payment-unpaid-bg: #fde2e2;
	--color-payment-unpaid-text: #8f1d1d;
	--color-personal-schedule: #e4f5e9;
	--color-selection-ring: #24a148;
	--color-progress: #2f6f9f;
	--color-platform-control-border: #767676;
	--color-platform-control-bg: #f1f1f1;
	--color-platform-control-text: #111111;
	--color-pull-indicator: #8b8b8f;
	--color-mask: #050607;
	--color-backdrop: rgb(23 32 42 / 26%);
	--color-backdrop-strong: rgb(9 15 22 / 68%);
	--color-backdrop-dialog: rgb(18 25 33 / 38%);
	--color-backdrop-logout: rgb(23 32 42 / 48%);
	--color-danger-tint: rgb(126 33 26 / 8%);
	--color-focus-shadow: rgb(83 98 115 / 12%);
	--color-glass-highlight: rgb(255 255 255 / 68%);
	--color-calendar-month-even: #334155;
	--color-calendar-month-odd: #536273;
	--color-calendar-day-even: #f2f6fa;
	--color-calendar-day-odd: #e3ebf3;
	--color-calendar-selected-bg: #d9f0e3;
	--color-calendar-selected-text: #214f40;
	--color-calendar-selected-ring: #4f8f78;
	--color-calendar-project-bg: #fff4cf;
	--color-calendar-project-text: #7a4f00;
	--color-calendar-project-density-2: #f7e6a7;
	--color-calendar-project-density-3: #f3d87b;
	--color-calendar-busy-bg: #f7d6d2;
	--color-calendar-busy-text: #8f1d1d;
	--color-calendar-busy-density-2: #f2beba;
	--color-calendar-busy-density-3: #eaa39e;
	--color-calendar-public-busy-density-3: #d97974;
	--color-calendar-folder-bg: #dff4e5;
	--color-calendar-folder-ring: #54a96b;
	--color-calendar-month-boundary: #bdc9d6;
	--shadow-popover: 0 10px 28px rgb(23 32 42 / 12%);
	--shadow-card: 0 12px 32px rgb(23 32 42 / 8%);
	--shadow-sheet: 0 -14px 42px rgb(23 32 42 / 18%);
	--shadow-modal: 0 18px 48px rgb(31 41 51 / 20%);
	--shadow-drag: 0 8px 24px rgb(0 0 0 / 18%);
	--shadow-drag-soft: 0 8px 24px rgb(0 0 0 / 14%);
	--shadow-debug-modal: 0 24px 80px rgb(0 0 0 / 32%);
	--shadow-platform-control: 0 1px 2px rgb(0 0 0 / 18%);
	--mobile-glass-background: rgb(255 255 255 / 18%);
	--mobile-safe-area-glass-background: rgb(255 255 255 / 18%);
	--mobile-notification-glass-background: rgb(255 255 255 / 64%);
	--mobile-personal-schedule-glass-background: rgb(72 137 94 / 58%);
	--mobile-warning-glass-border: rgb(225 191 103 / 72%);
	--mobile-warning-glass-background: rgb(255 248 220 / 68%);
	--mobile-control-shadow: radial-gradient(
		ellipse at center,
		rgb(20 31 43 / 16%) 0%,
		rgb(20 31 43 / 9%) 42%,
		transparent 74%
	);
	--mobile-glass-filter: blur(8px);
	--mobile-glass-shadow: 0 4px 30px rgb(0 0 0 / 10%);
	--logo-ink: #101418;
	--logo-surface: #ffffff;
	--logo-image-filter: none;
}

:root[data-syncrew-theme='dark'] {
	color-scheme: dark;
	--color-page: #0f151b;
	--color-surface: #171e26;
	--color-surface-soft: #1d2731;
	--color-text: #edf2f6;
	--color-text-secondary: #b1bfcc;
	--color-text-muted: #8798a8;
	--color-border: #657789;
	--color-border-strong: #7b8c9b;
	--color-border-soft: #2d3945;
	--color-control-hover: #222e39;
	--color-control-active: #2a3744;
	--color-action: #edf2f6;
	--color-action-secondary: #c0ccd7;
	--color-on-action: #10161c;
	--color-danger: #ff9b92;
	--color-danger-strong: #ffc0ba;
	--color-danger-bg: #3a2023;
	--color-danger-border: #864a4b;
	--color-warning-bg: #352e1b;
	--color-warning-surface: #30291a;
	--color-warning-border: #7e6c35;
	--color-warning-border-soft: #5f522f;
	--color-warning-text: #f3d77f;
	--color-status-pending-bg: #352e1b;
	--color-status-pending-border: #8b7436;
	--color-status-pending-text: #f3d77f;
	--color-status-confirmed-bg: #19352a;
	--color-status-confirmed-border: #427c63;
	--color-status-confirmed-text: #a6ddc0;
	--color-status-cancelled-bg: #3a2023;
	--color-status-cancelled-text: #ffaaa2;
	--color-payment-paid-bg: #19352a;
	--color-payment-paid-text: #a6ddc0;
	--color-payment-unpaid-bg: #3a2023;
	--color-payment-unpaid-text: #ffaaa2;
	--color-personal-schedule: #183526;
	--color-selection-ring: #63c58a;
	--color-progress: #78b7e5;
	--color-platform-control-border: #667482;
	--color-platform-control-bg: #252d35;
	--color-platform-control-text: #edf2f6;
	--color-pull-indicator: #aeb9c4;
	--color-mask: #edf2f6;
	--color-backdrop: rgb(2 7 12 / 54%);
	--color-backdrop-strong: rgb(2 7 12 / 78%);
	--color-backdrop-dialog: rgb(2 7 12 / 66%);
	--color-backdrop-logout: rgb(2 7 12 / 74%);
	--color-danger-tint: rgb(255 155 146 / 12%);
	--color-focus-shadow: rgb(192 204 215 / 22%);
	--color-glass-highlight: rgb(255 255 255 / 12%);
	--color-calendar-month-even: #d7e0e8;
	--color-calendar-month-odd: #aebdca;
	--color-calendar-day-even: #1a232c;
	--color-calendar-day-odd: #202c37;
	--color-calendar-selected-bg: #1c4434;
	--color-calendar-selected-text: #c3efd8;
	--color-calendar-selected-ring: #66b18d;
	--color-calendar-project-bg: #443b20;
	--color-calendar-project-text: #f6dc8a;
	--color-calendar-project-density-2: #5a4b20;
	--color-calendar-project-density-3: #715b1f;
	--color-calendar-busy-bg: #4b292b;
	--color-calendar-busy-text: #ffc0ba;
	--color-calendar-busy-density-2: #653334;
	--color-calendar-busy-density-3: #7d3b3b;
	--color-calendar-public-busy-density-3: #914644;
	--color-calendar-folder-bg: #1c3d2f;
	--color-calendar-folder-ring: #4f9f72;
	--color-calendar-month-boundary: #526272;
	--shadow-popover: 0 12px 34px rgb(0 0 0 / 42%);
	--shadow-card: 0 12px 32px rgb(0 0 0 / 28%);
	--shadow-sheet: 0 -14px 42px rgb(0 0 0 / 44%);
	--shadow-modal: 0 18px 48px rgb(0 0 0 / 46%);
	--shadow-drag: 0 8px 24px rgb(0 0 0 / 48%);
	--shadow-drag-soft: 0 8px 24px rgb(0 0 0 / 38%);
	--shadow-debug-modal: 0 24px 80px rgb(0 0 0 / 58%);
	--shadow-platform-control: 0 1px 2px rgb(0 0 0 / 44%);
	--mobile-glass-background: rgb(24 32 41 / 62%);
	--mobile-safe-area-glass-background: rgb(24 32 41 / 72%);
	--mobile-notification-glass-background: rgb(24 32 41 / 82%);
	--mobile-personal-schedule-glass-background: rgb(42 112 66 / 58%);
	--mobile-warning-glass-border: rgb(139 116 54 / 76%);
	--mobile-warning-glass-background: rgb(53 46 27 / 82%);
	--mobile-control-shadow: radial-gradient(
		ellipse at center,
		rgb(0 0 0 / 38%) 0%,
		rgb(0 0 0 / 22%) 42%,
		transparent 74%
	);
	--mobile-glass-filter: blur(12px) saturate(125%);
	--mobile-glass-shadow: 0 6px 32px rgb(0 0 0 / 34%);
	--logo-ink: #edf2f6;
	--logo-surface: #171e26;
	--logo-image-filter: invert(1) brightness(1.65);
}

:root[data-syncrew-theme='system'] {
	color-scheme: light dark;
}

@media (prefers-color-scheme: dark) {
	:root[data-syncrew-theme='system'] {
		color-scheme: dark;
		--color-page: #0f151b;
		--color-surface: #171e26;
		--color-surface-soft: #1d2731;
		--color-text: #edf2f6;
		--color-text-secondary: #b1bfcc;
		--color-text-muted: #8798a8;
		--color-border: #657789;
		--color-border-strong: #7b8c9b;
		--color-border-soft: #2d3945;
		--color-control-hover: #222e39;
		--color-control-active: #2a3744;
		--color-action: #edf2f6;
		--color-action-secondary: #c0ccd7;
		--color-on-action: #10161c;
		--color-danger: #ff9b92;
		--color-danger-strong: #ffc0ba;
		--color-danger-bg: #3a2023;
		--color-danger-border: #864a4b;
		--color-warning-bg: #352e1b;
		--color-warning-surface: #30291a;
		--color-warning-border: #7e6c35;
		--color-warning-border-soft: #5f522f;
		--color-warning-text: #f3d77f;
		--color-status-pending-bg: #352e1b;
		--color-status-pending-border: #8b7436;
		--color-status-pending-text: #f3d77f;
		--color-status-confirmed-bg: #19352a;
		--color-status-confirmed-border: #427c63;
		--color-status-confirmed-text: #a6ddc0;
		--color-status-cancelled-bg: #3a2023;
		--color-status-cancelled-text: #ffaaa2;
		--color-payment-paid-bg: #19352a;
		--color-payment-paid-text: #a6ddc0;
		--color-payment-unpaid-bg: #3a2023;
		--color-payment-unpaid-text: #ffaaa2;
		--color-personal-schedule: #183526;
		--color-selection-ring: #63c58a;
		--color-progress: #78b7e5;
		--color-platform-control-border: #667482;
		--color-platform-control-bg: #252d35;
		--color-platform-control-text: #edf2f6;
		--color-pull-indicator: #aeb9c4;
		--color-mask: #edf2f6;
		--color-backdrop: rgb(2 7 12 / 54%);
		--color-backdrop-strong: rgb(2 7 12 / 78%);
		--color-backdrop-dialog: rgb(2 7 12 / 66%);
		--color-backdrop-logout: rgb(2 7 12 / 74%);
		--color-danger-tint: rgb(255 155 146 / 12%);
		--color-focus-shadow: rgb(192 204 215 / 22%);
		--color-glass-highlight: rgb(255 255 255 / 12%);
		--color-calendar-month-even: #d7e0e8;
		--color-calendar-month-odd: #aebdca;
		--color-calendar-day-even: #1a232c;
		--color-calendar-day-odd: #202c37;
		--color-calendar-selected-bg: #1c4434;
		--color-calendar-selected-text: #c3efd8;
		--color-calendar-selected-ring: #66b18d;
		--color-calendar-project-bg: #443b20;
		--color-calendar-project-text: #f6dc8a;
		--color-calendar-project-density-2: #5a4b20;
		--color-calendar-project-density-3: #715b1f;
		--color-calendar-busy-bg: #4b292b;
		--color-calendar-busy-text: #ffc0ba;
		--color-calendar-busy-density-2: #653334;
		--color-calendar-busy-density-3: #7d3b3b;
		--color-calendar-public-busy-density-3: #914644;
		--color-calendar-folder-bg: #1c3d2f;
		--color-calendar-folder-ring: #4f9f72;
		--color-calendar-month-boundary: #526272;
		--shadow-popover: 0 12px 34px rgb(0 0 0 / 42%);
		--shadow-card: 0 12px 32px rgb(0 0 0 / 28%);
		--shadow-sheet: 0 -14px 42px rgb(0 0 0 / 44%);
		--shadow-modal: 0 18px 48px rgb(0 0 0 / 46%);
		--shadow-drag: 0 8px 24px rgb(0 0 0 / 48%);
		--shadow-drag-soft: 0 8px 24px rgb(0 0 0 / 38%);
		--shadow-debug-modal: 0 24px 80px rgb(0 0 0 / 58%);
		--shadow-platform-control: 0 1px 2px rgb(0 0 0 / 44%);
		--mobile-glass-background: rgb(24 32 41 / 62%);
		--mobile-safe-area-glass-background: rgb(24 32 41 / 72%);
		--mobile-notification-glass-background: rgb(24 32 41 / 82%);
		--mobile-personal-schedule-glass-background: rgb(42 112 66 / 58%);
		--mobile-warning-glass-border: rgb(139 116 54 / 76%);
		--mobile-warning-glass-background: rgb(53 46 27 / 82%);
		--mobile-control-shadow: radial-gradient(
			ellipse at center,
			rgb(0 0 0 / 38%) 0%,
			rgb(0 0 0 / 22%) 42%,
			transparent 74%
		);
		--mobile-glass-filter: blur(12px) saturate(125%);
		--mobile-glass-shadow: 0 6px 32px rgb(0 0 0 / 34%);
		--logo-ink: #edf2f6;
		--logo-surface: #171e26;
		--logo-image-filter: invert(1) brightness(1.65);
	}
}