/* Design tokens (planning/08_Visual_Design.md). The only place colour values appear.
Light is the default; dark follows the OS unless the user picks a theme (data-theme on ). */
:root {
color-scheme: light;
/* Neutrals */
--surface-page: #fafafa;
--surface: #ffffff;
--surface-raised: #ffffff;
--surface-muted: #f5f5f5;
--border: #e5e5e5;
--border-strong: #8f8f8f;
--text: #0a0a0a;
--text-secondary: #525252;
--text-tertiary: #6b6b6b;
--text-disabled: #a3a3a3;
--accent: #0a0a0a;
--accent-hover: #262626;
--accent-contrast: #ffffff;
--shadow-raised: 0 1px 2px rgb(0 0 0 / .06), 0 4px 12px rgb(0 0 0 / .08);
--select-arrow: url("data:image/svg+xml,");
/* Status: text / tint */
--danger: #b42318; --danger-tint: #fef3f2;
--warning: #a15c07; --warning-tint: #fffaeb;
--success: #067647; --success-tint: #ecfdf3;
--info: #175cd3; --info-tint: #eff8ff;
/* Schedule activities: background / text (schedule views only) */
--activity-break-bg: #d7ece8; --activity-break-text: #1f5e55;
--activity-lunch-bg: #efe6d5; --activity-lunch-text: #6b4f1d;
--activity-training-bg: #e6e1f2; --activity-training-text: #4b3d7a;
--activity-coaching-bg: #e3ebf6; --activity-coaching-text: #274b7a;
--activity-meeting-bg: #e8e8e8; --activity-meeting-text: #404040;
--activity-nesting-bg: #e6efdd; --activity-nesting-text: #3e5a26;
--activity-sick-bg: #f7dede; --activity-sick-text: #8a1f1f;
--activity-late-bg: #f7e6d3; --activity-late-text: #7a4312;
--activity-overtime-bg: #d9eedf; --activity-overtime-text: #1e5b2d;
--activity-vto-bg: #f0f0f0; --activity-vto-text: #404040;
/* Type */
--font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
--text-xs: 0.75rem; --leading-xs: 1rem;
--text-sm: 0.8125rem; --leading-sm: 1.25rem;
--text-base: 0.875rem; --leading-base: 1.375rem;
--text-md: 1rem; --leading-md: 1.5rem;
--text-lg: 1.25rem; --leading-lg: 1.75rem;
--text-xl: 1.75rem; --leading-xl: 2.25rem;
--text-wallboard: clamp(2.5rem, 6vw, 6rem);
/* Space, shape */
--space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px;
--space-5: 24px; --space-6: 32px; --space-8: 48px;
--radius-sm: 4px; --radius: 6px; --radius-lg: 10px;
--row-compact: 32px;
--control-height: 36px;
--sidebar-width: 224px;
}
/* Dark tokens, shared by the OS preference and an explicit choice */
@media (prefers-color-scheme: dark) {
:root:not([data-theme="light"]) {
color-scheme: dark;
--surface-page: #0a0a0a;
--surface: #141414;
--surface-raised: #1c1c1c;
--surface-muted: #1a1a1a;
--border: #2a2a2a;
--border-strong: #6b6b6b;
--text: #f5f5f5;
--text-secondary: #a3a3a3;
--text-tertiary: #8a8a8a;
--text-disabled: #525252;
--accent: #f5f5f5;
--accent-hover: #d4d4d4;
--accent-contrast: #0a0a0a;
--shadow-raised: none;
--select-arrow: url("data:image/svg+xml,");
--danger: #f97066; --danger-tint: rgb(249 112 102 / .12);
--warning: #fdb022; --warning-tint: rgb(253 176 34 / .12);
--success: #47cd89; --success-tint: rgb(71 205 137 / .12);
--info: #53b1fd; --info-tint: rgb(83 177 253 / .12);
--activity-break-bg: #1d3531; --activity-break-text: #9fd6cc;
--activity-lunch-bg: #3a3122; --activity-lunch-text: #e3cfa6;
--activity-training-bg: #2e2843; --activity-training-text: #c6bbea;
--activity-coaching-bg: #1f2d42; --activity-coaching-text: #a9c4ea;
--activity-meeting-bg: #262626; --activity-meeting-text: #d4d4d4;
--activity-nesting-bg: #26321d; --activity-nesting-text: #bcd6a4;
--activity-sick-bg: #401c1c; --activity-sick-text: #f2a9a9;
--activity-late-bg: #3d2a17; --activity-late-text: #eec192;
--activity-overtime-bg: #1b3524; --activity-overtime-text: #9fdcb0;
--activity-vto-bg: #222222; --activity-vto-text: #c4c4c4;
}
}
:root[data-theme="dark"] {
color-scheme: dark;
--surface-page: #0a0a0a;
--surface: #141414;
--surface-raised: #1c1c1c;
--surface-muted: #1a1a1a;
--border: #2a2a2a;
--border-strong: #6b6b6b;
--text: #f5f5f5;
--text-secondary: #a3a3a3;
--text-tertiary: #8a8a8a;
--text-disabled: #525252;
--accent: #f5f5f5;
--accent-hover: #d4d4d4;
--accent-contrast: #0a0a0a;
--shadow-raised: none;
--select-arrow: url("data:image/svg+xml,");
--danger: #f97066; --danger-tint: rgb(249 112 102 / .12);
--warning: #fdb022; --warning-tint: rgb(253 176 34 / .12);
--success: #47cd89; --success-tint: rgb(71 205 137 / .12);
--info: #53b1fd; --info-tint: rgb(83 177 253 / .12);
--activity-break-bg: #1d3531; --activity-break-text: #9fd6cc;
--activity-lunch-bg: #3a3122; --activity-lunch-text: #e3cfa6;
--activity-training-bg: #2e2843; --activity-training-text: #c6bbea;
--activity-coaching-bg: #1f2d42; --activity-coaching-text: #a9c4ea;
--activity-meeting-bg: #262626; --activity-meeting-text: #d4d4d4;
--activity-nesting-bg: #26321d; --activity-nesting-text: #bcd6a4;
--activity-sick-bg: #401c1c; --activity-sick-text: #f2a9a9;
--activity-late-bg: #3d2a17; --activity-late-text: #eec192;
--activity-overtime-bg: #1b3524; --activity-overtime-text: #9fdcb0;
--activity-vto-bg: #222222; --activity-vto-text: #c4c4c4;
}