/* Process Desk — design tokens v1 (база 4px). Вставлять в globals.css */
:root {
  /* ---------- Шрифты ---------- */
  --pd-font-sans: "Inter", "Inter Variable", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --pd-font-mono: "JetBrains Mono", "Roboto Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

  /* Типографическая шкала: size / line-height */
  --pd-text-2xs: 11px;  --pd-lh-2xs: 16px;   /* бейджи, подписи осей, overline */
  --pd-text-xs: 12px;   --pd-lh-xs: 16px;    /* мета, подсказки, заголовки колонок */
  --pd-text-sm: 13px;   --pd-lh-sm: 20px;    /* основной текст UI, таблицы, меню */
  --pd-text-md: 14px;   --pd-lh-md: 20px;    /* textarea и длинный текст в панелях (однострочные поля 32px — 13/20, см. stage3-pr2-design-answers А4) */
  --pd-text-lg: 16px;   --pd-lh-lg: 24px;    /* заголовок секции/карточки */
  --pd-text-xl: 20px;   --pd-lh-xl: 28px;    /* заголовок страницы (H1 в приложении) */
  --pd-text-2xl: 24px;  --pd-lh-2xl: 32px;   /* KPI-цифры, пустые состояния */
  --pd-weight-regular: 400;
  --pd-weight-medium: 500;
  --pd-weight-semibold: 600;
  --pd-weight-bold: 700;                    /* НЕ ПРИМЕНЯТЬ в UI: в Figma только 400/500/600 (stage3-pr2-design-answers В2). Оставлен для совместимости */
  --pd-tracking-overline: 0.06em;            /* только для UPPERCASE-оверлайнов 11px */ /* нет в Figma v1 */

  /* ---------- Отступы (база 4px) ---------- */
  --pd-space-0: 0;
  --pd-space-0-5: 2px;
  --pd-space-1: 4px;
  --pd-space-1-5: 6px;
  --pd-space-2: 8px;
  --pd-space-3: 12px;
  --pd-space-4: 16px;
  --pd-space-5: 20px;
  --pd-space-6: 24px;
  --pd-space-8: 32px;
  --pd-space-10: 40px;
  --pd-space-12: 48px;
  --pd-space-16: 64px;

  /* ---------- Высоты контролов ---------- */
  --pd-control-xs: 24px;   /* бейджи-кнопки, чипы внутри таблиц, кнопки в узлах карты */
  --pd-control-sm: 28px;   /* кнопки тулбаров канваса, compact-таблица */
  --pd-control-md: 32px;   /* ПО УМОЛЧАНИЮ: кнопки, инпуты, селекты, Segmented (табы-сегменты) */
  --pd-control-lg: 40px;   /* вкладки (Tab), кнопки экрана входа и мастеров, переключатель компании */
  --pd-chip-h: 20px;       /* Chip и Status pill (не контрол: метка внутри строки 32–40) */ /* добавлено после сверки, внести в Figma */
  --pd-row-compact: 32px;  /* строки таблиц */
  --pd-row-default: 40px;
  --pd-row-comfort: 48px;
  --pd-row-header: 36px;   /* шапка таблицы (th) при строках 40/48; при строках 32 шапка = --pd-row-compact */ /* добавлено после сверки, внести в Figma */

  /* ---------- Иконки ---------- */
  --pd-icon-xs: 12px;
  --pd-icon-sm: 16px;      /* по умолчанию в кнопках 28–32px */
  --pd-icon-md: 20px;      /* в кнопках 40px, в пунктах меню */
  --pd-icon-lg: 24px;      /* пустые состояния, палитра */
  --pd-icon-stroke: 1.75px;

  /* ---------- Радиусы ---------- */
  --pd-radius-xs: 2px;     /* чекбоксы, бейджи */
  --pd-radius-sm: 0px;     /* поля, вторичные кнопки, узлы карты */
  --pd-radius-md: 0px;     /* карточки, поповеры, панели на канвасе */
  --pd-radius-lg: 0px;     /* модальные окна, крупные контейнеры */
  --pd-radius-full: 9999px; /* только главная кнопка-капсула */

  /* ---------- Нейтральные: тёплая бумага ---------- */
  --pd-gray-0: #FFFFFF;
  --pd-gray-25: #F7F7F4;
  --pd-gray-50: #F7F7F4;
  --pd-gray-100: #F2F1ED;
  --pd-gray-200: #E6E5E0;
  --pd-gray-300: #D4D3CC;
  --pd-gray-400: #A8A79F;
  --pd-gray-500: #8A8983;
  --pd-gray-600: #6F6E68;
  --pd-gray-700: #5C5B55;
  --pd-gray-800: #3F3E38;
  --pd-gray-900: #26251E;

  /* ---------- Primary: чернила. Янтарь — только ссылки, не заливка кнопок ---------- */
  --pd-primary-50: #F2F1ED;
  --pd-primary-100: #E6E5E0;
  --pd-primary-200: #D4D3CC;
  --pd-primary-300: #A8A79F;
  --pd-primary-400: #6F6E68;
  --pd-primary-500: #3B3A33;
  --pd-primary-600: #26251E;  /* главная кнопка, активный пункт */
  --pd-primary-700: #1F1E18;  /* hover */
  --pd-primary-800: #16150F;  /* pressed */
  --pd-primary-900: #0E0D0A;

  /* ---------- Семантика: bg / border / fg(text, AA на белом) / solid ---------- */
  --pd-success-bg: #ECFDF3; --pd-success-border: #ABEFC6; --pd-success-fg: #067647; --pd-success-solid: #17B26A;
  --pd-warning-bg: #FFFAEB; --pd-warning-border: #FEDF89; --pd-warning-fg: #B54708; --pd-warning-solid: #F79009;
  --pd-danger-bg:  #FEF3F2; --pd-danger-border:  #FECDCA; --pd-danger-fg:  #B42318; --pd-danger-solid:  #F04438;
  --pd-info-bg:    #EFF8FF; --pd-info-border:    #B2DDFF; --pd-info-fg:    #175CD3; --pd-info-solid:    #2E90FA;

  /* ---------- Перспективы стратегической карты (BSC) ---------- */
  --pd-lane-fin: #B54708;     --pd-lane-fin-bg: #FFF8EE;    /* Финансы */
  --pd-lane-cust: #0E9384;    --pd-lane-cust-bg: #F0FBF9;   /* Клиенты */
  /* Акцент «бирюза»: категория V, задачи на таймлайне, тип «Персона» в C4. Значения = перспектива «Клиенты». */
  --pd-accent-teal: #0E9384;  --pd-accent-teal-bg: #F0FBF9;  --pd-accent-teal-fg: #107569; /* добавлено после сверки, внести в Figma. fg — для мелкого текста, контраст 5.5:1 */
  --pd-lane-proc: #3F3E38;    --pd-lane-proc-bg: #F2F1ED;   /* Внутренние процессы */
  --pd-lane-learn: #7A5AF8;   --pd-lane-learn-bg: #F6F4FF;  /* Обучение и развитие */
  --pd-lane-learn-fg: #6941C6;  /* добавлено после сверки, внести в Figma. фиолетовый мелкий текст на --pd-lane-learn-bg, контраст 6.1:1 */

  /* ---------- Семантические алиасы (использовать в компонентах) ---------- */
  --pd-bg-app: #F7F7F4;                    /* фон рабочей области, бумага */
  --pd-bg-surface: var(--pd-gray-0);       /* карточки, панели, таблицы */
  --pd-bg-subtle: #F2F1ED;                 /* шапки таблиц, тихие полосы */
  --pd-bg-hover: rgba(38, 37, 30, 0.04);
  --pd-bg-selected: rgba(38, 37, 30, 0.06);
  --pd-bg-canvas: #F7F7F4;                 /* канвас карт/BPMN */
  --pd-canvas-dot: #E6E5E0;                /* точечная сетка канваса */
  --pd-border: var(--pd-gray-200);
  --pd-border-strong: var(--pd-gray-300);
  --pd-text: var(--pd-gray-900);
  --pd-text-secondary: var(--pd-gray-600);
  --pd-text-tertiary: var(--pd-gray-500);
  --pd-text-disabled: var(--pd-gray-400);
  --pd-text-on-primary: #F7F7F4;
  --pd-link: #F54E00;                      /* янтарь: ссылки и пометки «открыть», не кнопки */
  --pd-bg-overlay: rgba(26, 31, 42, 0.48); /* добавлено после сверки, внести в Figma. затемнение под modal/drawer (= gray-900 48%) */

  /* ---------- Фокус ---------- */
  --pd-focus-ring: 0 0 0 2px #F7F7F4, 0 0 0 4px rgba(38, 37, 30, 0.45);
  --pd-focus-ring-danger: 0 0 0 2px #FFFFFF, 0 0 0 4px rgba(240, 68, 56, 0.45); /* нет в Figma v1 */
  --pd-ring-selected: 0 0 0 2px var(--pd-primary-600);   /* добавлено после сверки, внести в Figma. выбранный элемент (не фокус) */
  --pd-ring-highlight: 0 0 0 2px var(--pd-primary-200);  /* добавлено после сверки, внести в Figma. временная подсветка */

  /* ---------- Тени ---------- */
  --pd-shadow-xs: 0 1px 2px rgba(38, 37, 30, 0.05);
  --pd-shadow-sm: 0 1px 3px rgba(38, 37, 30, 0.08), 0 1px 2px rgba(38, 37, 30, 0.04);
  --pd-shadow-md: 0 4px 8px -2px rgba(38, 37, 30, 0.08), 0 2px 4px -2px rgba(38, 37, 30, 0.04);
  --pd-shadow-lg: 0 12px 16px -4px rgba(38, 37, 30, 0.08), 0 4px 6px -2px rgba(38, 37, 30, 0.03);
  --pd-shadow-xl: 0 20px 24px -4px rgba(38, 37, 30, 0.10), 0 8px 8px -4px rgba(38, 37, 30, 0.04);

  /* ---------- Каркас ---------- */
  --pd-sidebar-w: 248px;
  --pd-sidebar-w-collapsed: 56px;
  --pd-sidebar-w-drawer: 280px; /* добавлено после сверки, внести в Figma. шторка меню до 768 */
  --pd-nav-item-h: 32px; /* добавлено после сверки, внести в Figma */
  --pd-nav-subitem-h: 30px; /* добавлено после сверки, внести в Figma */
  --pd-nav-flyout-w: 220px; /* добавлено после сверки, внести в Figma */
  --pd-nav-company-w: 280px; /* добавлено после сверки, внести в Figma */
  --pd-nav-profile-w: 232px; /* добавлено после сверки, внести в Figma */
  --pd-nav-search-w: 360px; /* добавлено после сверки, внести в Figma */
  --pd-nav-pop-max: 420px; /* добавлено после сверки, внести в Figma */
  --pd-menu-w: 180px; /* добавлено после сверки, внести в Figma. меню «⋯» */
  --pd-header-h: 48px;
  --pd-subheader-h: 44px;      /* строка табов/тулбара страницы; вкладка 40 прижата к низу строки */
  --pd-panel-w: 360px;         /* правая панель свойств (min 320, max 480) */
  --pd-panel-w-md: 320px; /* добавлено после сверки, внести в Figma. колонка на 1024–1279 */
  --pd-canvas-min: 480px; /* добавлено после сверки, внести в Figma. минимум ширины чертежа */
  --pd-sheet-max-h: 50dvh; /* добавлено после сверки, внести в Figma. нижний лист до 768 */
  --pd-content-max: 1280px;    /* max-width для страниц-документов (паспорт, кабинет) */
  --pd-form-max: 760px;        /* max-width для форм */

  /* ---------- Z-index ---------- */
  --pd-z-base: 0; /* нет в Figma v1 */
  --pd-z-canvas-ui: 10;        /* тулбары, мини-карта поверх канваса */ /* нет в Figma v1 */
  --pd-z-sticky: 20;           /* sticky-шапки таблиц, первая колонка */ /* нет в Figma v1 */
  --pd-z-header: 30; /* нет в Figma v1 */
  --pd-z-sidebar: 40; /* нет в Figma v1 */
  --pd-z-dropdown: 50; /* нет в Figma v1 */
  --pd-z-overlay: 60;          /* затемнение под drawer/modal */ /* нет в Figma v1 */
  --pd-z-modal: 70; /* нет в Figma v1 */
  --pd-z-toast: 80; /* нет в Figma v1 */
  --pd-z-tooltip: 90; /* нет в Figma v1 */

  /* ---------- Движение ---------- */
  --pd-duration-instant: 80ms;   /* hover, press */ /* нет в Figma v1 */
  --pd-duration-fast: 120ms;     /* tooltip, цвет, фокус */ /* нет в Figma v1 */
  --pd-duration-base: 200ms;     /* раскрытие панелей, sidebar */ /* нет в Figma v1 */
  --pd-duration-slow: 320ms;     /* fit-to-screen, zoom канваса */ /* нет в Figma v1 */
  --pd-ease-standard: cubic-bezier(0.2, 0, 0, 1); /* нет в Figma v1 */
  --pd-ease-exit: cubic-bezier(0.3, 0, 1, 1); /* нет в Figma v1 */
  --pd-ease-enter: cubic-bezier(0, 0, 0, 1); /* добавлено после сверки, внести в Figma */
  --pd-ease-in-out: cubic-bezier(0.65, 0, 0.35, 1); /* добавлено после сверки, внести в Figma */
  --pd-ease-spring: cubic-bezier(0.34, 1.4, 0.64, 1); /* добавлено после сверки, внести в Figma */
  --pd-duration-scene: 700ms; /* добавлено после сверки, внести в Figma */
  --pd-duration-loop: 1600ms; /* добавлено после сверки, внести в Figma */
  --pd-stagger: 30ms; /* добавлено после сверки, внести в Figma */
  --pd-ai-fab: 48px; /* добавлено после сверки, внести в Figma */
  --pd-ai-panel-w: 360px; /* добавлено после сверки, внести в Figma */
  --pd-ai-accent: var(--pd-link); /* добавлено после сверки, внести в Figma */
  --pd-ai-accent-soft: rgba(245, 78, 0, 0.12); /* добавлено после сверки, внести в Figma */
  --pd-port: 8px; /* добавлено после сверки, внести в Figma */
  --pd-port-hover: 12px; /* добавлено после сверки, внести в Figma */
  --pd-port-hit: 20px; /* добавлено после сверки, внести в Figma */
  --pd-tour-card-w: 320px; /* добавлено после сверки, внести в Figma */
  --pd-tour-scrim: rgba(38, 37, 30, 0.56); /* добавлено после сверки, внести в Figma */
  --pd-sky-core: #F5A060; /* добавлено после сверки, внести в Figma. полка «Основные» на ночном небе */
  --pd-sky-support: #5FD4C4; /* добавлено после сверки, внести в Figma. «Вспомогательные» */
  --pd-sky-manage: #B4A2FF; /* добавлено после сверки, внести в Figma. «Управленческие» */
  --pd-sky-system: #F2F1ED; /* добавлено после сверки, внести в Figma. заливка системы */
  --pd-sky-data: #8FB8FF; /* добавлено после сверки, внести в Figma. слой «данные», по умолчанию выключен */
  --pd-sky-edge: rgba(242, 241, 237, 0.22); /* добавлено после сверки, внести в Figma */
  --pd-sky-edge-hi: rgba(242, 241, 237, 0.85); /* добавлено после сверки, внести в Figma */
  --pd-sky-bg: #141A29; /* добавлено после сверки, внести в Figma. край неба созвездия */
  --pd-sky-bg-2: #1C2437; /* добавлено после сверки, внести в Figma. центр градиента и заливка процесса */
  --pd-sky-surface: #202A3E; /* добавлено после сверки, внести в Figma. карточка точки и чипы */
  --pd-sky-border: #3A4660; /* добавлено после сверки, внести в Figma. рамка панелей на небе */
  --pd-duration-pulse: 600ms; /* добавлено после сверки, внести в Figma. импульс по нити */
  --pd-hl-hover: var(--pd-gray-300); /* добавлено после сверки, внести в Figma. наведение: серый ореол */
  --pd-hl-selected: #F2C94C; /* добавлено после сверки, внести в Figma. выделение: жёлтый ореол */
  --pd-hl-selected-bg: #FFF8DB; /* добавлено после сверки, внести в Figma. подложка выделенной строки */
  --pd-status-remove-fg: var(--pd-danger-fg); /* добавлено после сверки, внести в Figma. «исключим» */
  --pd-status-remove-bg: var(--pd-danger-bg); /* добавлено после сверки, внести в Figma */
  --pd-status-remove-border: var(--pd-danger-border); /* добавлено после сверки, внести в Figma */
  --pd-status-add-fg: var(--pd-success-fg); /* добавлено после сверки, внести в Figma. «добавим» */
  --pd-status-add-bg: var(--pd-success-bg); /* добавлено после сверки, внести в Figma */
  --pd-status-add-border: var(--pd-success-border); /* добавлено после сверки, внести в Figma */
  --pd-orbit-period: 60s; /* добавлено после сверки, внести в Figma. оборот орбит мини-созвездия */
  --pd-field-label: 200px; /* добавлено после сверки, внести в Figma. подпись поля в кабинете */
  --pd-field-w: 400px; /* добавлено после сверки, внести в Figma. ширина поля в кабинете */

  /* v14 (19.10.2026, BUILD 96): подсказки полей, пустые значения, чипы паспорта, светофор канбана */
  --pd-hint-icon: var(--pd-gray-500); /* добавлено после сверки, внести в Figma */
  --pd-hint-icon-hover: var(--pd-gray-700); /* добавлено после сверки, внести в Figma */
  --pd-tooltip-bg: var(--pd-gray-0); /* добавлено после сверки, внести в Figma */
  --pd-tooltip-border: var(--pd-gray-200); /* добавлено после сверки, внести в Figma */
  --pd-tooltip-fg: var(--pd-gray-800); /* добавлено после сверки, внести в Figma */
  --pd-tooltip-shadow: var(--pd-shadow-lg); /* добавлено после сверки, внести в Figma */
  --pd-tooltip-max-w: 280px; /* добавлено после сверки, внести в Figma */
  --pd-field-empty-fg: var(--pd-gray-600); /* добавлено после сверки, внести в Figma */
  --pd-field-empty-border: var(--pd-gray-300); /* добавлено после сверки, внести в Figma */
  --pd-field-empty-action: var(--pd-gray-800); /* добавлено после сверки, внести в Figma */
  --pd-chip-h: 24px; /* добавлено после сверки, внести в Figma. высота чипа паспорта v14 */
  --pd-maturity-on: var(--pd-gray-700); /* добавлено после сверки, внести в Figma */
  --pd-maturity-off: var(--pd-gray-200); /* добавлено после сверки, внести в Figma */
  --pd-raci-a-bg: var(--pd-accent-teal-bg); --pd-raci-a-fg: var(--pd-accent-teal-fg); --pd-raci-a-border: #99E0D5; /* добавлено после сверки, внести в Figma */
  --pd-raci-r-bg: var(--pd-info-bg); --pd-raci-r-fg: var(--pd-info-fg); --pd-raci-r-border: var(--pd-info-border); /* добавлено после сверки, внести в Figma */
  --pd-raci-c-bg: var(--pd-gray-100); --pd-raci-c-fg: var(--pd-gray-800); --pd-raci-c-border: var(--pd-gray-300); /* добавлено после сверки, внести в Figma */
  --pd-raci-i-bg: var(--pd-gray-0); --pd-raci-i-fg: var(--pd-gray-700); --pd-raci-i-border: var(--pd-gray-300); /* добавлено после сверки, внести в Figma */
  --pd-kanban-todo-accent: var(--pd-gray-400); --pd-kanban-todo-bg: var(--pd-gray-50); --pd-kanban-todo-fg: var(--pd-gray-700); /* добавлено после сверки, внести в Figma. сборка 97: без тревожного красного */
  --pd-kanban-doing-accent: #FDB022; --pd-kanban-doing-bg: #FFFCF2; --pd-kanban-doing-fg: var(--pd-warning-fg); /* добавлено после сверки, внести в Figma */
  --pd-kanban-done-accent: #47CD89; --pd-kanban-done-bg: #F6FDF9; --pd-kanban-done-fg: var(--pd-success-fg); /* добавлено после сверки, внести в Figma */
  /* v15 (19.10.2026, BUILD 97): потоки, сетка, направляющие, кабинет ≥1600 */
  --pd-flow: var(--pd-gray-800); /* добавлено после сверки, внести в Figma */
  --pd-flow-w: 1.5px; /* добавлено после сверки, внести в Figma */
  --pd-flow-active: var(--pd-gray-900); /* добавлено после сверки, внести в Figma */
  --pd-flow-active-w: 2px; /* добавлено после сверки, внести в Figma */
  --pd-flow-dim: var(--pd-gray-300); /* добавлено после сверки, внести в Figma */
  --pd-flow-halo-w: 10px; /* добавлено после сверки, внести в Figma */
  --pd-flow-hit: 12px; /* добавлено после сверки, внести в Figma */
  --pd-flow-radius: 8px; /* добавлено после сверки, внести в Figma */
  --pd-flow-stub: 16px; /* добавлено после сверки, внести в Figma */
  --pd-flow-gap: 16px; /* добавлено после сверки, внести в Figma */
  --pd-flow-arrow: 8px; /* добавлено после сверки, внести в Figma */
  --pd-flow-handle-end: 10px; /* добавлено после сверки, внести в Figma */
  --pd-flow-handle-bend: 8px; /* добавлено после сверки, внести в Figma */
  --pd-flow-preview-dash: 4 3; /* добавлено после сверки, внести в Figma */
  --pd-grid-step: 8px; /* добавлено после сверки, внести в Figma */
  --pd-grid-major: 32px; /* добавлено после сверки, внести в Figma */
  --pd-grid-line: rgba(38, 37, 30, 0.035); /* добавлено после сверки, внести в Figma */
  --pd-grid-line-major: rgba(38, 37, 30, 0.075); /* добавлено после сверки, внести в Figma */
  --pd-guide: var(--pd-link); /* добавлено после сверки, внести в Figma */
  --pd-snap-threshold: 6px; /* добавлено после сверки, внести в Figma */
  --pd-account-aside-w: 296px; /* добавлено после сверки, внести в Figma */
}

/* Тёмная область (ночное небо «Созвездия», .desk-sky). Экран входа светлый, этот класс на него не вешается. Новых цветов нет. */
.pd-dark {
  --pd-bg-app: var(--pd-gray-900);
  --pd-bg-canvas: var(--pd-gray-900);
  --pd-bg-surface: var(--pd-gray-800);
  --pd-bg-subtle: var(--pd-gray-800);
  --pd-bg-hover: var(--pd-gray-700);
  --pd-border: var(--pd-gray-700);
  --pd-border-strong: var(--pd-gray-600);
  --pd-text: var(--pd-gray-100);
  --pd-text-secondary: var(--pd-gray-400);
  --pd-text-tertiary: var(--pd-gray-500);
  --pd-text-disabled: var(--pd-gray-600);
  --pd-link: #F54E00;
  color: var(--pd-text);
  background: var(--pd-bg-app);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --pd-duration-instant: .01ms;
    --pd-duration-fast: .01ms;
    --pd-duration-base: .01ms;
    --pd-duration-slow: .01ms;
    --pd-duration-scene: .01ms;
    --pd-duration-loop: .01ms;
    --pd-duration-pulse: .01ms;
    --pd-orbit-period: .01ms;
    --pd-stagger: 0ms;
  }
  *, *::before, *::after {
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
  }
}
