/* ============================================================
 * ТОКЕНЫ ДИЗАЙН-СИСТЕМЫ
 * ============================================================
 * Единственное место, где живут значения цвета, шрифта, отступов,
 * скруглений и теней. Всё остальное (main.css, components.css,
 * sections.css, welcome.css, login.css) обязано ссылаться сюда через
 * var(), а не писать числа и #hex руками.
 *
 * ⚠️ Файл подключается ПЕРВЫМ (см. index.html). Светлая тема — значения
 * по умолчанию на :root, тёмная — переопределение на body.dark-theme.
 * Переключатель темы вешает/снимает этот класс, поэтому любой токен
 * достаточно переопределить один раз здесь, и его подхватят все экраны.
 *
 * ⚠️ Токены темы — только цвета. Размеры, отступы и скругления от темы
 * не зависят: если шкала начнёт расходиться между темами, вёрстка
 * поедет ровно на половине экранов, и заметит это только тот, кто
 * переключает тему.
 *
 * Описание токенов с примерами и замерами контраста — в дизайн-системе:
 * https://claude.ai/artifact/1SnqS3o67nTgHB2NqzTVPX
 * ============================================================ */

:root {
    --reports-filter-width: 280px;
    --reports-filter-height: 480px;
    --reports-filter-viewport: 50dvh;
    --reports-filter-layer: 30;
    --reports-filter-offset: 240px;
    --reports-filter-choice-size: 18px;

    /* Помощь: геометрия текущего прототипа и компактный статус аккаунта. */
    --help-page-padding: 24px;
    --help-page-width: 1280px;
    --help-title-inset: 0px;
    --help-title-row: 52px;
    --help-title-leading: 1.2;
    --help-copy-width: 430px;
    --help-content-width: 880px;
    --help-body-leading: 1.55;
    --help-tight-gap: 4px;
    --help-dot-size: 8px;
    --help-problem-width: 240px;
    --help-scroll-offset: 80px;
    --help-table-label: 150px;
    --help-table-cell: 120px;
    --help-copy-backdrop: rgba(0, 0, 0, 0.5);

    --reports-schedule-width: 880px;

    --task-filter-duration: 320ms;
    --task-filter-ease: cubic-bezier(.2, .7, .2, 1);
    --task-filter-start: .92;
    --task-filter-peak: 1.025;
    --task-overdue: #A42E67;
    --task-overdue-soft: #F6E6EE;
    /* Размеры локального предпросмотра стенда. */
    --stand-phone-small: 360px;
    --stand-phone: 390px;
    --stand-phone-large: 430px;
    --signal-demo-dialog-padding: 24px;
    --signal-demo-dialog: 462px;
    --signal-demo-heading: 20px;
    --signal-demo-small-gap: 4px;
    --signal-demo-close: 44px;
    --signal-demo-scrim: color-mix(in srgb, #1C1C1C 60%, transparent);
    --signal-demo-head: 64px;
    --signal-demo-phone-head: 56px;
    --signal-demo-width: 760px;
    --signal-demo-phone: 390px;
    --signal-demo-phone-small: 360px;
    --signal-demo-phone-large: 430px;
    --signal-demo-focus: 3px;
    --signal-demo-panel: color-mix(in srgb, #FFFFFF 94%, #808080);
    --signal-demo-canvas: color-mix(in srgb, #FFFFFF 97%, #808080);
    --signal-demo-field: color-mix(in srgb, #FFFFFF 90%, #808080);
    --signal-demo-border: color-mix(in srgb, #FFFFFF 80%, #808080);
    --signal-demo-line: 1.55;

    --task-review-text: #93600A;
    --task-review-filter: #B17A16;
    --task-review-soft: #F5EBD6;
    --app-dialog-width: 440px;
    --app-dialog-line-height: 1.55;
    --chat-dialog-width: 570px;
    --chat-menu-button-width: 24px;
    --chat-content-width: 760px;
    --chat-camera-ratio: 4 / 3;
    --signal-context-width: 430px;
    --signal-context-control: 44px;
    --signal-context-field-height: 96px;
    --composer-disabled-opacity: 0.4;
    --composer-max-width: 760px;
    --composer-desktop-gutter: 24px;
    --composer-control: 40px;
    --composer-inset: 4px;
    --composer-button-line: 1;
    --composer-menu-line: 1.55;
    --composer-link-height: 32px;
    --composer-phone-control: 36px;
    --composer-text-line: 1.5;
    --composer-phone-line: 1.25;
    --composer-text-cap: 240px;
    --composer-phone-cap: 160px;
    --composer-menu-offset: 72px;
    --composer-menu-inset: 12px;
    --composer-placeholder: #757575;
    --composer-send-ink: #ffffff;
    --composer-surface: color-mix(in srgb, #ffffff 90%, #808080);
    --composer-menu-surface: color-mix(in srgb, #ffffff 94%, #808080);
    --composer-menu-border: color-mix(in srgb, #ffffff 80%, #808080);
    --composer-icon-ink: color-mix(in srgb, #1c1c1c 68%, #82b7dc);
    --composer-text-ink: color-mix(in srgb, #1c1c1c 92%, #114185);
    --composer-menu-shadow: 0 20px 70px color-mix(in srgb, #114185 8%, transparent);

    --reports-list-width: 880px;
    /* Профиль: размеры актуального макета и общая линия заголовков. */
    --pf-page-width: 1280px;
    --pf-page-padding: 24px;
    --pf-notify-width: 430px;
    --pf-tight-gap: 4px;
    --pf-tab-height: 36px;
    --pf-title-inset: 0px;
    --pf-title-row: 52px;
    --pf-title-leading: 1.2;
    --pf-avatar-size: 64px;
    --pf-avatar-thumb-size: 40px;
    --pf-avatar-dialog-width: 430px;
    --pf-avatar-backdrop: rgba(0, 0, 0, 0.5);
    --pf-tab-duration: 320ms;
    --pf-tab-ease: cubic-bezier(.2, .7, .2, 1);
    --pf-tab-start: .92;
    --pf-tab-peak: 1.025;

    --avatar-pink: #AA3F77;
    --avatar-pink-soft: #F8E7F0;
    --section-reflow-duration: 320ms;
    --section-motion-ease: cubic-bezier(.2, .7, .2, 1);
    --app-start-cycle: 1600ms;
    --report-person-avatar: 22px;
    /* --------------------------------------------------------
     * ШРИФТ
     * -------------------------------------------------------- */

    /* Запасные шрифты — системные: пока Jost тянется с Google Fonts (а в
       мини-приложениях это может быть заметно долго), текст рисуется ими,
       а не безымянным sans-serif браузера. */
    --font-sans: 'Jost', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --reports-dialog-width: 760px;
    --reports-empty-width: 570px;
    --reports-title-size: 24px;
    --reports-line-height: 1.55;
    --reports-choice-size: 20px;
    --font-serif: 'Cormorant Garamond', Georgia, serif;

    /* Шкала размеров. Пары «размер + высота строки»: высота строки
       отдельным токеном не выносится — она не бывает нужна без размера. */
    --text-display: 56px;       /* заголовок экрана входа */
    --text-display-lh: 1.2;
    --text-section: 32px;       /* подзаголовок колонки */
    --text-section-lh: 1.25;
    --text-title: 26px;         /* заголовок карточки и модального окна */
    --text-title-lh: 1.3;
    --text-heading: 18px;       /* заголовок блока внутри карточки */
    --text-heading-lh: 1.4;
    --text-body: 15px;          /* основной текст интерфейса */
    --text-body-lh: 1.5;
    --text-small: 13px;         /* пояснения, подписи, строка состояния */
    --text-small-lh: 1.5;
    --text-overline: 11px;      /* название раздела капителью */
    --text-overline-lh: 1.4;
    --text-overline-ls: 0.3px;

    /* --------------------------------------------------------
     * ОТСТУПЫ
     * --------------------------------------------------------
     * Шкала собрана из значений, которые реально стояли в CSS. Единого
     * ряда раньше не было — рядом с 16px встречались 15px и 18px без
     * всякой причины. Новые отступы берутся отсюда; промежуточные
     * значения не добавляем, иначе шкала снова перестанет быть шкалой. */
    --pf-detail-width: 880px;
    --pf-invite-height: 44px;
    --space-1: 6px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 20px;
    --space-6: 26px;
    --space-7: 40px;

    /* --------------------------------------------------------
     * СКРУГЛЕНИЯ
     * -------------------------------------------------------- */
    --radius-sm: 8px;           /* кнопка, значок, небольшая плашка */
    --radius: 12px;             /* поле ввода, QR-плитка, строка списка */
    --radius-lg: 14px;          /* вложенная карточка внутри мастера */
    --radius-xl: 18px;          /* карточка во весь экран */
    --radius-pill: 999px;       /* тумблер и всё скруглённое целиком */

    /* --------------------------------------------------------
     * ГЕОМЕТРИЯ РЕДИЗАЙНА 17.10.2026 (прототип дизайнера)
     * --------------------------------------------------------
     * Единое скругление элементов управления, высоты кнопок и строк
     * меню, размер значков. Шрифт 16/14/10 — как в прототипе. */
    --ui-radius: 16px;
    --ui-radius-small: 8px;
    --entry-max: 1180px;
    --entry-form: 376px;
    --phone-head-h: 56px;       /* шапка мобильного раздела, макет 17.10.2026 */
    --control-height: 48px;
    --control-compact: 40px;
    --file-type-icon: url('/static/images/icons/file-document.svg');
    --chat-file-width: 360px;
    --chat-file-locked-opacity: 0.4;
    --row-compact: 34px;
    --icon-size: 22px;
    --rail-width: 248px;
    --task-form-width: 460px;
    --task-option-size: 20px;
    --settings-gear-size: 24px;
    --settings-company-width: 1280px;
    --task-placeholder: #757575;
    --task-form-line-height: 1.55;
    --task-form-title-line-height: 1.2;
    --task-form-phone-control: 44px;
    --rail-gap: 4px;
    --rail-bottom-inset: 24px;
    --rail-text-leading: 1.55;
    --rail-chat-leading: 1.3;
    --font-page: 36px;          /* заголовок раздела: «Профиль», «Помощь» */
    --font-metric: 30px;        /* главное число карточки «Компании» (макет: «Продажи», «Деньги») */
    --font-lead: 18px;          /* имя в профиле, название тарифа */
    --font-base: 16px;
    --font-label: 14px;
    --font-caption: 12px;       /* подпись под строкой, вкладки раздела */
    --font-badge: 10px;
    --hairline: 1px;
    --motion: 200ms;
    --task-menu-width: 380px;
    --task-copy-gap: 4px;
    --task-copy-line-height: 1.55;
    --co-loading-cycle: 1800ms;
    --co-loading-min-height: 100px;
    --desktop-title-inset: 0px;
    --desktop-title-row: 52px;
    --section-select-duration: 320ms;
    --section-select-start: .92;
    --section-select-peak: 1.025;
    --reports-welcome-title: 20px;
    --reports-demo-height: 384px;
    --reports-demo-cycle: 16s;
    --reports-choice-width: 420px;

    /* Высота баннера пробного периода — выставляет TrialBanner (app.js),
       на неё сдвигается каркас приложения. Нет баннера — 0. */
    --trial-banner-height: 0px;

    /* --------------------------------------------------------
     * ТЕНИ
     * -------------------------------------------------------- */
    /* Геометрия «Компании» — согласованный прототип 17.10.2026. */
    --co-metric: 24px;
    --co-metric-compact: 24px;
    --co-grid-row: 208px;
    --co-chart-height: 128px;
    --co-bars-height: 100px;
    --co-card-footer: 28px;
    --co-tab-input: 160px;
    --co-page-width: 1440px;
    --co-page-inset: 24px;
    --co-segment-height: 36px;
    --co-segment-phone-height: 32px;
    --co-segment-inset: 4px;
    --co-segment-phone-inset: 2px;
    --co-segment-phone-font: 11px;
    --co-segment-phone-padding: 7px;
    --co-segment-line: 20px;
    --co-button-height: 44px;
    --co-dialog-width: 570px;
    --co-catalog-width: 980px;
    --co-select-motion: 320ms;
    --co-select-start: .92;
    --co-select-peak: 1.025;
    --co-signal-dialog: 460px;
    --co-signal-manager: 720px;
    --co-signal-field-height: 38px;
    --co-signal-area: 96px;
    --co-disabled-opacity: .5;
    --co-signal-menu-width: 236px;
    --co-signal-width: 280px;
    --co-signal-rule: 3px;
    --co-surface-notice: color-mix(in srgb, var(--bg-sidebar) 82%, var(--primary));
    --co-brief-surface: color-mix(in srgb, var(--bg-sidebar) 90%, var(--text));
    --shadow-focus: 0 0 0 3px rgba(17, 65, 133, 0.15);
    --shadow-card: 0 10px 30px rgba(0, 0, 0, 0.08);
    --shadow-head: 0 2px 8px rgba(15, 20, 25, 0.08);   /* компактная шапка на телефоне (решение 17.10.2026) */

    /* --------------------------------------------------------
     * ЦВЕТ — СВЕТЛАЯ ТЕМА
     * --------------------------------------------------------
     * ⚠️ Редизайн 17.10.2026 (design/prototypes/login-variants,
     * prototype-tokens.css): все оттенки — смеси шести цветов брендбука
     * (Ultramarine #114185, Signal #3366A9, Pastel #82B7DC, Grey #808080,
     * White, Black Brown #1C1C1C). В прототипе они заданы color-mix(); здесь
     * — уже посчитанными цветами: color-mix не везде есть во встроенных
     * браузерах мессенджеров, а пустой цвет фона хуже любого неточного. */

    /* Брендовые */
    --primary: #114185;
    --primary-light: #3366A9;
    --primary-lighter: #82B7DC;
    --accent: #3366A9;
    /* Текст и значки ПОВЕРХ заливки primary. Отдельный токен, потому что
       primary в тёмной теме светлый (#82B7DC), и белый текст на нём даёт
       2.1:1 — кнопку не прочесть. Здесь он тёмный, там — белый. */
    --on-primary: #FFFFFF;

    /* Состояния.
       ⚠️ Одним цветом состояние не передаём никогда: рядом всегда стоит
       слово («Активна», «Ошибка») или значок — цвет лишь помогает его
       заметить.
       ⚠️ Текстовые цвета темнее «чистых» #059669 и #DC2626, которые тут
       стояли раньше: на карточке они давали 3.4:1 и 4.4:1 — ниже нормы
       4.5:1. Заливки и границы считаются от исходных оттенков, им
       контраст не нужен. */
    --success: #047857;
    --success-soft: rgba(5, 150, 105, 0.12);
    --success-line: rgba(5, 150, 105, 0.3);
    --warning: #F59E0B;
    /* Текст и заливка предупреждений (плашка «Подписка заканчивается»,
       пробный период): #F59E0B на белом даёт меньше 4.5:1 — текст темнее. */
    --warning-text: #B45309;
    --warning-soft: rgba(245, 158, 11, 0.14);
    /* Затемнение под модальным окном и выезжающим меню. */
    --scrim: rgba(15, 20, 25, 0.45);
    --error: #B91C1C;
    --on-error: #FFFFFF; /* текст на заливке --error (свайп «Удалить») */
    --error-soft: rgba(220, 38, 38, 0.1);
    --error-soft-hover: rgba(220, 38, 38, 0.18);
    --error-line: rgba(220, 38, 38, 0.3);
    --error-line-hover: rgba(220, 38, 38, 0.5);

    /* Нейтральные */
    --grey: #808080;
    --grey-light: #D1D5DB;
    --white: #FFFFFF;
    --black: #1C1C1C;

    /* Основное действие (кнопки «Далее», «Оплатить»): Signal — ярче
       Ultramarine, но в той же палитре. Текст поверх — on-action. */
    --action: #3366A9;
    --action-hover: #2A5DA0;
    --on-action: #FFFFFF;
    --action-soft: #E6F1F8;

    /* Фоны внутри приложения — НЕЙТРАЛЬНЫЕ серые (смеси White и Grey), как
       в итоговых стилях прототипа (chat.css, --chat-canvas/panel/field):
       голубоватый фон — только у входа и первой настройки (--bg-entry). */
    --bg-base: #FCFCFC;
    --bg-sidebar: #F7F7F7;
    --bg-main: #FCFCFC;
    --bg-surface: #FFFFFF;
    --bg-card: #F2F2F2;
    --bg-input: #FFFFFF;
    --bg-hover: #F2F2F2;
    --bg-primary-light: #ECF4FA;
    /* Вход и первая настройка: Pastel 7 % на белом, поверх — сетка. */
    --bg-entry: #F6FAFD;
    --entry-surface: #FFFFFF;
    --entry-line: #D4DDE9;
    --entry-soft: #ECF4FA;
    --entry-grid: rgba(17, 65, 133, 0.04);
    --entry-shadow: 0 20px 70px rgba(17, 65, 133, 0.08);
    --entry-glow: #82B7DC;
    --entry-glow-deep: #4F82BB;
    /* Кнопка входа — Pastel с тёмным текстом в ОБЕИХ темах (прототип). */
    --entry-cta: #82B7DC;
    --on-entry-cta: #1C1C1C;

    /* Границы */
    --border: #E6E6E6;
    --border-dark: #D2D2D2;
    --border-active: #114185;

    /* Текст.
       ⚠️ text-muted на светлом фоне — 2.3–2.5:1. Это годится для метки
       раздела капителью, но не для текста, который нужно прочесть: для
       него text-secondary. */
    --text: #1B1F24;
    --text-secondary: #3D4E59;
    --text-muted: #547186;
    --text-light: #D4DDE9;
    --text-white: #FFFFFF;

    /* Пузырьки сообщений */
    --user-bubble: linear-gradient(135deg, #114185 0%, #3366A9 100%);
    --ai-bubble: #F2F2F2;

    /* Вопрос человека в чате — светлая плашка (прототип 17.10.2026). */
    --user-message-bg: #E4EFF7;
    --user-message-text: #1B1F24;

    /* Метка «Beta» у разделов в бета-тестировании (меню). */
    --beta-bg: #ECF4FA;
    --beta-text: #114185;

    /* Проекты: геометрия макета 17.10.2026, пока только демо стенда. */
    --project-s1: 4px;
    --project-s2: 8px;
    --project-s3: 12px;
    --project-s4: 16px;
    --project-s5: 24px;
    --project-s6: 32px;
    --project-s7: 48px;
    --project-s9: 88px;
    --project-copy: 430px;
    --project-form: 376px;
    --project-hero: 570px;
    --project-control: 48px;
    --project-compact-control: 40px;
    --project-phone-control: 36px;
    --project-title-small: 36px;
    --project-lead: 18px;
    --project-base: 16px;
    --project-label: 14px;
    --project-caption: 12px;
    --project-icon: 22px;
    --project-hairline: 1px;
    --project-focus: 3px;
    --project-ui-radius: 16px;
    --project-speed: 180ms;
    --project-selection-duration: 320ms;
    --project-ease: cubic-bezier(.2,.7,.2,1);
    --project-body-leading: 1.55;
    --project-button-leading: 1.5;
    --project-hover-brightness: .95;
    --project-active-brightness: .9;
    --project-disabled-opacity: .5;
    --project-workspace-height:50svh;
    --project-workspace-min:320px;
    --project-row:208px;
    --project-touch:44px;
    --project-content-width:760px;
    --project-count-size:20px;
    --project-count-pad:5px;

    --project-mobile-header: 56px;
    --project-sheet-height: 92svh;
    --project-blue: var(--primary);
    --project-on-blue: var(--on-primary);
    --project-ink: var(--text);
    --project-muted: var(--text-muted);
    --project-canvas: var(--bg-main);
    --project-panel: var(--bg-card);
    --project-field: var(--bg-hover);
    --project-border: var(--border);
    --project-soft: var(--bg-primary-light);
    --project-white: var(--text-white);
    --project-backdrop: rgba(0,0,0,.6);
    --project-action-dialog-gutter:38px;
    --project-signal-form-width:460px;
    --project-signal-form-pad:20px;
    --project-control-small: 32px;
    --project-owner-ink: var(--success);
    --project-story-progress: 0;

    /* Размеры и состояния перенесённых форм прототипа. */
    --project-action-value-1: 84px;
    --project-action-value-2: 60px;
    --project-action-value-3: 380px;
    --project-action-value-4: 28px;
    --project-action-value-5: 460px;
    --project-action-value-6: 72px;
    --project-action-value-7: 64px;
    --project-action-value-8: 96px;
    --project-action-value-9: 720px;
    --project-action-value-10: 38px;
    --project-action-value-11: 260px;
    --project-action-value-12: #7650a6;
    --project-action-value-13: #eee7f7;
    --project-action-value-14: #c9a6f0;
    --project-action-value-15: #382b49;
    --project-action-value-16: #b17a16;
    --project-action-value-17: #f5ebd6;
    --project-action-value-18: #93600a;
    --project-action-value-19: #44371e;
    --project-action-value-20: #e9c578;
    --project-action-value-21: 180px;
    --project-action-value-22: 160ms;
    --project-app-header-shadow: 0 2px 3px -2px color-mix(in srgb,var(--project-black) 30%,transparent);
    --project-arrow-x: 0px;
    --project-arrow-y: var(--project-s1);
    --project-widget-chart-count: 7;
    --project-widget-bar: var(--project-widget-bars-large);
    --project-widget-bars-large: 100px;
    --project-widget-chart-height: 100px;
    --project-widget-chart-large: 128px;
    --project-widget-footer: 28px;
    --project-widget-metric: 24px;
    --project-widget-numeric-gap: 24px;
    --project-widget-plot: var(--project-widget-chart-large);
    --project-widget-scale: 36px;
    --filter-color: var(--project-blue);
    --project-black: #1c1c1c;
    --project-confirm-width: 360px;
    --project-control-touch: 44px;
    --project-demo-cycle: calc(var(--project-drift-time) * 2);
    --project-drift-time: 6s;
    --project-pastel: #82B7DC;
    --project-line: color-mix(in srgb, var(--project-pastel) 28%, var(--project-black));
    --project-radius-pill: 999px;
    --project-s8: 64px;
    --project-widget-share: 0%;

}

/* ============================================================
 * ЦВЕТ — ТЁМНАЯ ТЕМА
 * ============================================================
 * Только то, что отличается от светлой. success/warning/error, белый и
 * серый наследуются с :root намеренно: это одни и те же цвета в обеих
 * темах, и дублировать их значит однажды поправить лишь одно место.
 * ============================================================ */

body.dark-theme {
    --reports-filter-width: 280px;
    --reports-filter-height: 480px;
    --reports-filter-viewport: 50dvh;
    --reports-filter-layer: 30;
    --reports-filter-offset: 240px;
    --reports-filter-choice-size: 18px;

    /* Помощь: геометрия текущего прототипа и компактный статус аккаунта. */
    --help-page-padding: 24px;
    --help-page-width: 1280px;
    --help-title-inset: 0px;
    --help-title-row: 52px;
    --help-title-leading: 1.2;
    --help-copy-width: 430px;
    --help-content-width: 880px;
    --help-body-leading: 1.55;
    --help-tight-gap: 4px;
    --help-dot-size: 8px;
    --help-problem-width: 240px;
    --help-scroll-offset: 80px;
    --help-table-label: 150px;
    --help-table-cell: 120px;
    --help-copy-backdrop: rgba(0, 0, 0, 0.5);

    --reports-schedule-width: 880px;

    --task-filter-duration: 320ms;
    --task-filter-ease: cubic-bezier(.2, .7, .2, 1);
    --task-filter-start: .92;
    --task-filter-peak: 1.025;
    --task-overdue: #EAA0C6;
    --task-overdue-soft: #432B39;
    --phone-head-h: 56px;
    --signal-demo-dialog-padding: 24px;
    --signal-demo-dialog: 462px;
    --signal-demo-heading: 20px;
    --signal-demo-small-gap: 4px;
    --signal-demo-close: 44px;
    --signal-demo-scrim: color-mix(in srgb, #1C1C1C 60%, transparent);
    --signal-demo-head: 64px;
    --signal-demo-phone-head: 56px;
    --signal-demo-width: 760px;
    --signal-demo-phone: 390px;
    --signal-demo-phone-small: 360px;
    --signal-demo-phone-large: 430px;
    --signal-demo-focus: 3px;
    --signal-demo-panel: color-mix(in srgb, #1C1C1C 92%, #808080);
    --signal-demo-canvas: color-mix(in srgb, #1C1C1C 97%, #808080);
    --signal-demo-field: color-mix(in srgb, #1C1C1C 82%, #808080);
    --signal-demo-border: color-mix(in srgb, #1C1C1C 70%, #808080);
    --signal-demo-line: 1.55;

    --co-loading-cycle: 1800ms;
    --co-loading-min-height: 100px;
    --task-review-text: #E9C578;
    --task-review-filter: #E9C578;
    --task-review-soft: #44371E;
    --app-dialog-width: 440px;
    --app-dialog-line-height: 1.55;
    --chat-dialog-width: 570px;
    --chat-menu-button-width: 24px;
    --chat-content-width: 760px;
    --chat-camera-ratio: 4 / 3;
    --signal-context-width: 430px;
    --signal-context-control: 44px;
    --signal-context-field-height: 96px;
    --composer-disabled-opacity: 0.4;
    --composer-max-width: 760px;
    --composer-desktop-gutter: 24px;
    --composer-control: 40px;
    --composer-inset: 4px;
    --composer-button-line: 1;
    --composer-menu-line: 1.55;
    --composer-link-height: 32px;
    --composer-phone-control: 36px;
    --composer-text-line: 1.5;
    --composer-phone-line: 1.25;
    --composer-text-cap: 240px;
    --composer-phone-cap: 160px;
    --composer-menu-offset: 72px;
    --composer-menu-inset: 12px;
    --composer-placeholder: #757575;
    --composer-send-ink: #000000;
    --composer-surface: color-mix(in srgb, #1c1c1c 82%, #808080);
    --composer-menu-surface: color-mix(in srgb, #1c1c1c 92%, #808080);
    --composer-menu-border: color-mix(in srgb, #1c1c1c 70%, #808080);
    --composer-icon-ink: color-mix(in srgb, #ffffff 68%, #82b7dc);
    --composer-text-ink: color-mix(in srgb, #ffffff 94%, #82b7dc);
    --composer-menu-shadow: 0 20px 70px color-mix(in srgb, #1c1c1c 35%, transparent);

    --desktop-title-inset: 0px;
    --desktop-title-row: 52px;
    --section-select-duration: 320ms;
    --section-reflow-duration: 320ms;
    --section-motion-ease: cubic-bezier(.2, .7, .2, 1);
    --section-select-start: .92;
    --section-select-peak: 1.025;

    --reports-welcome-title: 20px;
    --reports-demo-height: 384px;
    --reports-demo-cycle: 16s;
    --reports-choice-width: 420px;

    --file-type-icon: url('/static/images/icons/file-document.svg');
    --chat-file-width: 360px;
    --chat-file-locked-opacity: 0.4;
    --reports-list-width: 880px;
    /* Профиль: размеры актуального макета и общая линия заголовков. */
    --pf-page-width: 1280px;
    --pf-page-padding: 24px;
    --pf-notify-width: 430px;
    --pf-tight-gap: 4px;
    --pf-tab-height: 36px;
    --pf-title-inset: 0px;
    --pf-title-row: 52px;
    --pf-title-leading: 1.2;
    --pf-avatar-size: 64px;
    --pf-avatar-thumb-size: 40px;
    --pf-avatar-dialog-width: 430px;
    --pf-avatar-backdrop: rgba(0, 0, 0, 0.5);
    --pf-tab-duration: 320ms;
    --pf-tab-ease: cubic-bezier(.2, .7, .2, 1);
    --pf-tab-start: .92;
    --pf-tab-peak: 1.025;

    --avatar-pink: #EDA4CC;
    --avatar-pink-soft: #3C2936;
    --app-start-cycle: 1600ms;
    --pf-detail-width: 880px;
    --pf-invite-height: 44px;
    --report-person-avatar: 22px;
    --rail-gap: 4px;
    --rail-bottom-inset: 24px;
    --rail-text-leading: 1.55;
    --rail-chat-leading: 1.3;
    --primary: #82B7DC;
    --primary-light: #A8D0FF;
    --primary-lighter: #3366A9;
    --accent: #A8D0FF;
    --reports-dialog-width: 760px;
    --reports-empty-width: 570px;
    --reports-title-size: 24px;
    --reports-line-height: 1.55;
    --reports-choice-size: 20px;
    --on-primary: #0F1419;

    --action: #9EC7E4;
    --action-hover: #B4D4EA;
    --on-action: #192536;
    --action-soft: #27333F;

    --bg-base: #1F1F1F;
    --bg-sidebar: #242424;
    --bg-main: #1F1F1F;
    --task-menu-width: 380px;
    --task-copy-gap: 4px;
    --task-copy-line-height: 1.55;
    --bg-surface: #242424;
    --bg-card: #2E2E2E;
    --bg-input: #2A2A2A;
    --bg-hover: #2E2E2E;
    --bg-primary-light: #172E4E;
    --bg-entry: #1B212A;
    --entry-surface: #192638;
    --entry-line: #394752;
    --entry-soft: #172E4E;
    --entry-grid: rgba(130, 183, 220, 0.05);
    --entry-shadow: 0 20px 70px rgba(28, 28, 28, 0.35);
    --entry-glow: #2B4C78;
    --entry-glow-deep: #578ABF;

    --border: #3A3A3A;
    --border-dark: #4A4A4A;
    --border-active: #82B7DC;

    --text: #F8FBFD;
    --text-secondary: #D7E8F4;
    --text-muted: #BAD7EC;
    --text-light: #3B4A56;
    --text-white: #FFFFFF;

    --user-bubble: linear-gradient(135deg, #3366A9 0%, #82B7DC 100%);
    --ai-bubble: #2E2E2E;

    --user-message-bg: #172E4E;
    --user-message-text: #E4EFF7;

    --beta-bg: #172E4E;
    --beta-text: #82B7DC;

    /* Зелёный и красный на тёмном фоне работают наоборот: тёмные оттенки
       светлой темы дают на карточке 4.0:1 и 3.1:1 — их приходится
       осветлять, иначе текст состояния читается хуже обычного. */
    --success: #34D399;
    --success-soft: rgba(5, 150, 105, 0.18);
    --error: #F87171;
    --on-error: #0F1419; /* светлый красный — тёмный текст, иначе не читается */
    --error-soft: rgba(220, 38, 38, 0.15);
    --warning-text: #FBBF24;
    --warning-soft: rgba(245, 158, 11, 0.16);
    --scrim: rgba(0, 0, 0, 0.6);
    --error-soft-hover: rgba(220, 38, 38, 0.22);

    /* Кольцо фокуса рисуется от primary, а он в тёмной теме светлее:
       синее кольцо светлой темы на тёмном фоне просто не видно. */
    /* Геометрия «Компании» — согласованный прототип 17.10.2026. */
    --co-metric: 24px;
    --co-metric-compact: 24px;
    --co-grid-row: 208px;
    --co-chart-height: 128px;
    --co-bars-height: 100px;
    --co-card-footer: 28px;
    --co-tab-input: 160px;
    --co-page-width: 1440px;
    --co-page-inset: 24px;
    --co-segment-height: 36px;
    --co-segment-phone-height: 32px;
    --co-segment-inset: 4px;
    --co-segment-phone-inset: 2px;
    --co-segment-phone-font: 11px;
    --co-segment-phone-padding: 7px;
    --co-segment-line: 20px;
    --co-button-height: 44px;
    --co-dialog-width: 570px;
    --co-catalog-width: 980px;
    --co-select-motion: 320ms;
    --co-select-start: .92;
    --co-select-peak: 1.025;
    --co-signal-dialog: 460px;
    --co-signal-manager: 720px;
    --co-signal-field-height: 38px;
    --co-signal-area: 96px;
    --co-disabled-opacity: .5;
    --co-signal-menu-width: 236px;
    --co-signal-width: 280px;
    --co-signal-rule: 3px;
    --co-surface-notice: color-mix(in srgb, var(--bg-sidebar) 82%, var(--primary));
    --co-brief-surface: color-mix(in srgb, var(--bg-sidebar) 90%, var(--text));
    --shadow-focus: 0 0 0 3px rgba(130, 183, 220, 0.15);
    --shadow-card: 0 10px 30px rgba(0, 0, 0, 0.35);
    --shadow-head: 0 2px 8px rgba(0, 0, 0, 0.45);
    --task-form-width: 460px;
    --task-option-size: 20px;
    --settings-gear-size: 24px;
    --settings-company-width: 1280px;
    --task-placeholder: #757575;
    --task-form-line-height: 1.55;
    --task-form-title-line-height: 1.2;
    --task-form-phone-control: 44px;

    /* Проекты: геометрия макета 17.10.2026, пока только демо стенда. */
    --project-s1: 4px;
    --project-s2: 8px;
    --project-s3: 12px;
    --project-s4: 16px;
    --project-s5: 24px;
    --project-s6: 32px;
    --project-s7: 48px;
    --project-s9: 88px;
    --project-copy: 430px;
    --project-form: 376px;
    --project-hero: 570px;
    --project-control: 48px;
    --project-compact-control: 40px;
    --project-phone-control: 36px;
    --project-title-small: 36px;
    --project-lead: 18px;
    --project-base: 16px;
    --project-label: 14px;
    --project-caption: 12px;
    --project-icon: 22px;
    --project-hairline: 1px;
    --project-focus: 3px;
    --project-ui-radius: 16px;
    --project-speed: 180ms;
    --project-selection-duration: 320ms;
    --project-ease: cubic-bezier(.2,.7,.2,1);
    --project-body-leading: 1.55;
    --project-button-leading: 1.5;
    --project-hover-brightness: .95;
    --project-active-brightness: .9;
    --project-disabled-opacity: .5;
    --project-workspace-height:50svh;
    --project-workspace-min:320px;
    --project-row:208px;
    --project-touch:44px;
    --project-content-width:760px;
    --project-count-size:20px;
    --project-count-pad:5px;

    --project-mobile-header: 56px;
    --project-sheet-height: 92svh;
    --project-blue: var(--primary);
    --project-on-blue: var(--on-primary);
    --project-ink: var(--text);
    --project-muted: var(--text-muted);
    --project-canvas: var(--bg-main);
    --project-panel: var(--bg-card);
    --project-field: var(--bg-hover);
    --project-border: var(--border);
    --project-soft: var(--bg-primary-light);
    --project-white: var(--text-white);
    --project-backdrop: rgba(0,0,0,.6);
    --project-action-dialog-gutter:38px;
    --project-signal-form-width:460px;
    --project-signal-form-pad:20px;
    --project-control-small: 32px;
    --project-owner-ink: color-mix(in srgb,var(--success) 60%,var(--text-white));
    --project-story-progress: 0;

    /* Размеры и состояния перенесённых форм прототипа. */
    --project-action-value-1: 84px;
    --project-action-value-2: 60px;
    --project-action-value-3: 380px;
    --project-action-value-4: 28px;
    --project-action-value-5: 460px;
    --project-action-value-6: 72px;
    --project-action-value-7: 64px;
    --project-action-value-8: 96px;
    --project-action-value-9: 720px;
    --project-action-value-10: 38px;
    --project-action-value-11: 260px;
    --project-action-value-12: #7650a6;
    --project-action-value-13: #eee7f7;
    --project-action-value-14: #c9a6f0;
    --project-action-value-15: #382b49;
    --project-action-value-16: #b17a16;
    --project-action-value-17: #f5ebd6;
    --project-action-value-18: #93600a;
    --project-action-value-19: #44371e;
    --project-action-value-20: #e9c578;
    --project-action-value-21: 180px;
    --project-action-value-22: 160ms;
    --project-app-header-shadow: 0 2px 3px -2px color-mix(in srgb,var(--project-black) 30%,transparent);
    --project-arrow-x: 0px;
    --project-arrow-y: var(--project-s1);
    --project-widget-chart-count: 7;
    --project-widget-bar: var(--project-widget-bars-large);
    --project-widget-bars-large: 100px;
    --project-widget-chart-height: 100px;
    --project-widget-chart-large: 128px;
    --project-widget-footer: 28px;
    --project-widget-metric: 24px;
    --project-widget-numeric-gap: 24px;
    --project-widget-plot: var(--project-widget-chart-large);
    --project-widget-scale: 36px;
    --filter-color: var(--project-blue);
    --project-black: #1c1c1c;
    --project-confirm-width: 360px;
    --project-control-touch: 44px;
    --project-demo-cycle: calc(var(--project-drift-time) * 2);
    --project-drift-time: 6s;
    --project-pastel: #82B7DC;
    --project-line: color-mix(in srgb, var(--project-pastel) 28%, var(--project-black));
    --project-radius-pill: 999px;
    --project-s8: 64px;
    --project-widget-share: 0%;

}

/* Компактный баннер пробной подписки — размеры из прототипа. */
:root, body.dark-theme {
    --trial-control: 32px;
    --trial-touch: 44px;
    --trial-padding: 4px;
    --trial-inline: 24px;
    --trial-motion: 320ms;
    --trial-weight: 600;
}
:root { --trial-background: color-mix(in srgb, #82b7dc 22%, white); }
body.dark-theme { --trial-background: color-mix(in srgb, #82b7dc 14%, var(--bg-base)); }

:root {
    --trial-action-bg: #3366a9;
    --trial-action-hover: color-mix(in srgb, #3366a9 75%, #114185);
    --trial-action-ink: #ffffff;
}
body.dark-theme {
    --trial-action-bg: color-mix(in srgb, #82b7dc 78%, #ffffff);
    --trial-action-hover: color-mix(in srgb, #82b7dc 60%, #ffffff);
    --trial-action-ink: color-mix(in srgb, #1c1c1c 75%, #114185);
}

:root, body.dark-theme { --pay-name-weight: 600; --pay-value-max: 48%; }