/* Design tokens — единый источник правды для всех ролей. */ :root { /* Тема по умолчанию — СВЕТЛАЯ (веб-интерфейс админа/бухгалтера/склада). Тёмная подключается только по явному выбору: . */ color-scheme: light; /* Палитра нейтральных (светлая) */ --color-bg: #f4f5f7; --color-bg-soft: #ffffff; --color-surface: #ffffff; --color-surface-2: #f4f5f7; --color-surface-3: #ebedf0; --color-line: rgba(0, 0, 0, 0.08); --color-line-strong: rgba(0, 0, 0, 0.16); --color-text: #14141a; --color-text-muted: #5a5a66; --color-text-soft: #8a8a96; /* Акценты: каждая роль переопределяет --accent в своём role-*.css */ --accent: #3390ec; --accent-hover: #2480e0; --accent-soft: rgba(51, 144, 236, 0.14); --accent-contrast: #ffffff; /* Семантика */ --color-success: #34c759; --color-success-soft: rgba(52, 199, 89, 0.14); --color-warning: #ffb020; --color-warning-soft: rgba(255, 176, 32, 0.14); --color-danger: #ff453a; --color-danger-soft: rgba(255, 69, 58, 0.14); --color-info: #5ac8fa; --color-info-soft: rgba(90, 200, 250, 0.14); /* Типографика */ --font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Inter", "Segoe UI", Roboto, system-ui, sans-serif; --font-mono: "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace; --fs-xs: 11px; --fs-sm: 13px; --fs-md: 15px; --fs-lg: 17px; --fs-xl: 21px; --fs-2xl: 28px; --fs-3xl: 36px; --fw-regular: 400; --fw-medium: 500; --fw-semibold: 600; --fw-bold: 700; --fw-black: 800; --lh-tight: 1.15; --lh-normal: 1.45; --lh-relaxed: 1.6; /* Геометрия */ --radius-xs: 6px; --radius-sm: 10px; --radius-md: 14px; --radius-lg: 18px; --radius-xl: 24px; --radius-pill: 999px; /* Отступы */ --space-0: 0; --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 20px; --space-6: 24px; --space-7: 32px; --space-8: 40px; --space-9: 56px; --space-10: 72px; /* Тени */ --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.06); --shadow-md: 0 6px 18px rgba(0, 0, 0, 0.08); --shadow-lg: 0 18px 48px rgba(0, 0, 0, 0.12); --shadow-focus: 0 0 0 3px var(--accent-soft); /* Структура шелла */ --sidebar-width: 260px; --sidebar-collapsed-width: 72px; --topbar-height: 64px; --bottom-tabs-height: 72px; --content-max-width: 1280px; --safe-bottom: env(safe-area-inset-bottom, 0px); --safe-top: env(safe-area-inset-top, 0px); /* Поведение */ --transition-fast: 120ms ease; --transition-md: 200ms ease; --transition-slow: 360ms ease; /* Z-index лестница */ --z-base: 1; --z-sticky: 50; --z-topbar: 60; --z-bottom-tabs: 100; --z-sidebar: 110; --z-overlay: 1000; --z-modal: 2000; --z-toast: 3000; } /* Тёмная тема — по явному выбору: . Браузер по умолчанию светлый и НЕ переключается за системной тёмной темой (раньше из-за @media prefers-color-scheme карточки уходили в тёмное «само собой»). */ :root[data-theme="dark"] { color-scheme: dark; --color-bg: #0c0c10; --color-bg-soft: #14141a; --color-surface: #1c1c24; --color-surface-2: #232330; --color-surface-3: #2c2c3a; --color-line: rgba(255, 255, 255, 0.08); --color-line-strong: rgba(255, 255, 255, 0.16); --color-text: #f5f5f7; --color-text-muted: #a4a4b0; --color-text-soft: #6c6c78; --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.16); --shadow-md: 0 6px 18px rgba(0, 0, 0, 0.24); --shadow-lg: 0 18px 48px rgba(0, 0, 0, 0.36); }