/*
 * Три оформления на выбор. Переключается в «Настройках → Оформление».
 *
 * ЗАЧЕМ ВЫБОР, А НЕ ОДНО РЕШЕНИЕ. Оформление — тот случай, где спор
 * решается не доводами, а неделей работы: как читаются числа к вечеру,
 * не режет ли акцент глаз на двадцатом экране. Поэтому три языка живут
 * рядом, и заказчик оставит тот, что приживётся.
 *
 * УСТРОЙСТВО. Базовые значения лежат в tokens.css — это Material, тема
 * по умолчанию. Здесь только ПЕРЕОПРЕДЕЛЕНИЯ: каждая тема меняет ровно
 * те переменные, что задают её узнаваемость, и ни одна не заводит новых
 * имён. Поэтому ни один экран про темы не знает и знать не должен —
 * меняется таблица значений, а не разметка.
 *
 * ДВА СЕЛЕКТОРА У КАЖДОЙ ТЕМЫ, И ЭТО НЕ ЛИШНЕЕ. `:root[data-theme]`
 * включает язык на всём документе; голый `[data-theme]` — на любом
 * элементе внутри. Второй нужен образцам в «Оформлении»: карточка
 * показывает настоящие цвета темы, а не заранее нарисованную картинку,
 * которая однажды разойдётся с правдой. Переменные наследуются вниз,
 * поэтому внутри образца всё красится само.
 *
 * ГРАНИЦА ТЕМЫ — ТОЛЬКО ОБОЛОЧКА ДЕСКТОПА. Экран кладовщика (warehouse)
 * тёмный, под цех и перчатки; переключать его вместе с оболочкой нельзя,
 * там другая задача, а не другой вкус.
 */

/* ==========================================================================
   MICROSOFT — Fluent 2, язык Dynamics 365 и Microsoft 365.
   Значения из опубликованной палитры Fluent: brand #0f6cbd, нейтральные
   серые, скругление 4 px. Смысл языка — тишина вокруг данных: интерфейс
   низкой насыщенности, вся яркость достаётся числам.
   ========================================================================== */
:root[data-theme='fluent'],
[data-theme='fluent'] {
  /* Segoe UI — системный шрифт Windows, у большинства он уже стоит. */
  /*
   * Настоящий Segoe UI первым: на Windows он уже стоит, и там тема
   * выглядит как родная. Раздавать его мы не можем — он лицензирован
   * Microsoft. Дальше Noto Sans, который мы возим с собой: гуманистический,
   * близкий по рисунку и с полной кириллицей.
   */
  --ui: "Segoe UI", "Segoe UI Variable", "Noto Sans", ui-sans-serif, system-ui,
        -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;

  --bg: #f5f5f5;           /* neutralBackground3 */
  --surface: #fff;         /* neutralBackground1 */
  --surface-2: #fafafa;    /* строка под курсором */
  --head: #f5f5f5;         /* шапка таблицы */
  --subrow: #fafafa;

  --ink: #242424;          /* neutralForeground1 */
  --ink-2: #616161;        /* neutralForeground2 */
  --ink-3: #707070;        /* neutralForeground3 */

  --line: #d1d1d1;         /* neutralStroke1 */
  --line-2: #e0e0e0;       /* разделитель строк */
  --line-3: #b3b3b3;       /* граница поля ввода */

  --accent: #0f6cbd;       /* brand primary */
  --accent-dark: #115ea3;  /* нажатие */
  --accent-soft: #ebf3fc;  /* brand background 2 */
  --accent-line: #b4d6fa;
  --accent-nav: #0f6cbd;
  --accent-nav-soft: #ebf3fc;

  --go: #0e700e;           /* success */
  --go-bright: #107c10;
  --go-soft: #dff6dd;
  --go-line: #9fd89f;
  --on-go: #0b5a0b;

  --amber: #9d5d00;        /* warning */
  --amber-bright: #f7630c;
  --amber-soft: #fff4ce;
  --amber-line: #fdcfb4;
  --on-amber: #7a4a00;

  --stop: #c50f1f;         /* danger */
  --stop-soft: #fdf3f4;
  --on-stop: #961320;

  --violet: #8764b8;
  --violet-soft: #f2eef8;

  /*
   * Fluent — язык прямых углов: скругление 4 px, кнопка не капсула.
   * Это и есть главное отличие на глаз от Material.
   */
  --r-ctl: 4px;
  --r-field: 4px;
  --r-pill: 4px;
  --r: 4px;
  --r-card: 8px;

  /* Тени Fluent: shadow2 — почти незаметная, слой задаётся не ею. */
  --shadow: 0 1px 2px rgba(0,0,0,.14), 0 0 2px rgba(0,0,0,.12);
  --shadow-card: 0 1px 2px rgba(0,0,0,.14), 0 0 2px rgba(0,0,0,.12);

  --state-hover: rgba(0,0,0,.06);
  --state-press: rgba(0,0,0,.1);
  --state-on-accent: rgba(255,255,255,.14);

  /* Графики Fluent: плотная линия и чёткая сетка, столбец без скругления. */
  --chart-line: 2px;
  --chart-grid: 1px;
  --chart-dot: 3.5px;
  --chart-bar-r: 0px;
  --chart-label: 9px;
  --chart-grid-color: var(--line-2);
}

/* ==========================================================================
   ODOO — язык Odoo 17: сливовый акцент, спокойный светлый фон,
   малые скругления. Узнаётся мгновенно по цвету действия.
   ========================================================================== */
:root[data-theme='odoo'],
[data-theme='odoo'] {
  /*
   * Шрифт — СИСТЕМНЫЙ, и это не упрощение, а то, что у Odoo на самом деле.
   * Снято с их живого демо 23.08.2026: `-apple-system, system-ui,
   * "Segoe UI", Roboto, "Helvetica Neue", Ubuntu, "Noto Sans", Arial`,
   * и собственный «Odoo Unicode Support Noto» лишь в хвосте, под редкие
   * символы. Сначала здесь стоял Inter — поставленный по памяти и
   * неверный; замер это и поймал.
   */
  --ui: -apple-system, system-ui, "Segoe UI", Roboto, "Helvetica Neue", Ubuntu,
        "Noto Sans", Arial, sans-serif;

  --bg: #f9f9f9;
  --surface: #fff;
  --surface-2: #f6f6f6;
  --head: #f7f7f7;
  --subrow: #fbfbfb;

  --ink: #212529;
  --ink-2: #5a5a5a;
  --ink-3: #8a8a8a;

  --line: #dee2e6;
  --line-2: #ececec;
  --line-3: #ced4da;

  --accent: #714b67;       /* сливовый Odoo — цвет действия */
  --accent-dark: #5c3d54;
  --accent-soft: #f3eef2;
  --accent-line: #d9c9d4;
  --accent-nav: #714b67;
  --accent-nav-soft: #f3eef2;

  /* Ссылка у Odoo бирюзовая, а не сливовая: действие и переход разведены. */
  --go: #017e84;
  --go-bright: #00a09d;
  --go-soft: #e6f4f4;
  --go-line: #a7d8d7;
  --on-go: #015f63;

  --amber: #a5730a;
  --amber-bright: #f0ad4e;
  --amber-soft: #fdf6e6;
  --amber-line: #f5dfae;
  --on-amber: #7d5707;

  --stop: #d9534f;
  --stop-soft: #fbeceb;
  --on-stop: #a33430;

  --violet: #714b67;
  --violet-soft: #f3eef2;

  --r-ctl: 4px;
  --r-field: 4px;
  --r-pill: 999px;         /* у Odoo фильтры-теги остаются капсулами */
  --r: 6px;
  --r-card: 6px;

  --shadow: 0 1px 2px rgba(0,0,0,.08);
  --shadow-card: 0 1px 3px rgba(0,0,0,.08);

  --state-hover: rgba(0,0,0,.05);
  --state-press: rgba(0,0,0,.09);
  --state-on-accent: rgba(255,255,255,.14);

  /* Графики Odoo: средняя линия, малое скругление столбца. */
  --chart-line: 2px;
  --chart-grid: 1px;
  --chart-dot: 3.5px;
  --chart-bar-r: 2px;
  --chart-label: 9px;
  --chart-grid-color: var(--line-2);
}

/* ==========================================================================
   STRIPE — язык их панели: индиго на действии, очень тёмный сине-чёрный
   текст, тонкие линии и много воздуха. Значения сняты с их живого сайта
   23.08.2026: акцент rgb(83,58,253), текст rgb(6,27,49), приглушённый
   rgb(80,97,122), обводка значков 1,75 px.

   Шрифт у Stripe свой — Söhne, он лицензионный и распространению не
   подлежит. Ставим тот же запасной, что стоит у них самих: SF Pro
   Display, дальше системный. Буквы поэтому будут не «как у Stripe»,
   а близкие по рисунку — и экран об этом честно говорит.
   ========================================================================== */
:root[data-theme='stripe'],
[data-theme='stripe'] {
  /*
   * Söhne у Stripe лицензионный. Inter — ближайший свободный гротеск того
   * же рода, и мы возим его с собой; дальше их собственный запасной.
   */
  --ui: "Inter", "SF Pro Display", -apple-system, BlinkMacSystemFont, ui-sans-serif,
        system-ui, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  --bg: #f6f9fc;           /* их светлый фон страницы */
  --surface: #fff;
  --surface-2: #f6f9fc;
  --head: #f6f9fc;
  --subrow: #fafcff;

  --ink: #061b31;          /* очень тёмный сине-чёрный */
  --ink-2: #50617a;
  --ink-3: #8792a2;

  --line: #e6ebf1;         /* линии тонкие и светлые */
  --line-2: #eef2f7;
  --line-3: #cfd7df;

  --accent: #533afd;       /* индиго Stripe */
  --accent-dark: #3f2ae0;
  --accent-soft: #efecff;
  --accent-line: #cdc4ff;
  --accent-nav: #533afd;
  --accent-nav-soft: #efecff;

  --go: #0e7c66;
  --go-bright: #10b981;
  --go-soft: #e6f6f2;
  --go-line: #a7ded1;
  --on-go: #0a5c4c;

  --amber: #a15c07;
  --amber-bright: #f5a623;
  --amber-soft: #fdf5e7;
  --amber-line: #f7dfb5;
  --on-amber: #7d4705;

  --stop: #cd3d64;
  --stop-soft: #fdeef2;
  --on-stop: #9c2d4c;

  --violet: #7389ff;
  --violet-soft: #eef1ff;

  --r-ctl: 6px;
  --r-field: 6px;
  --r-pill: 999px;
  --r: 8px;
  --r-card: 8px;

  /* Тень мягкая и широкая — их узнаваемый приём вместо рамок. */
  --shadow: 0 2px 5px -1px rgba(50,50,93,.25), 0 1px 3px -1px rgba(0,0,0,.3);
  --shadow-card: 0 1px 3px rgba(50,50,93,.08), 0 1px 2px rgba(0,0,0,.04);

  --state-hover: rgba(6,27,49,.05);
  --state-press: rgba(6,27,49,.09);
  --state-on-accent: rgba(255,255,255,.14);

  /* Тонкие линии — то, ради чего эту тему и смотрят. */
  --chart-line: 1.5px;
  --chart-grid: 1px;
  --chart-dot: 3px;
  --chart-bar-r: 3px;
  --chart-label: 9.5px;
  --chart-grid-color: var(--line-2);
}

/* ==========================================================================
   MONDAY.COM — яркий и «продуктовый»: индиго на действии, капсульные
   кнопки, насыщенные статусные цвета. Значения сняты с их сайта
   23.08.2026: кнопка rgb(97,97,255), нажатие rgb(69,42,234), текст
   rgb(51,51,51), второстепенный rgb(83,87,104), скругление кнопки 40 px.

   Гарнитура у них Poppins — БЕЗ КИРИЛЛИЦЫ, и для русского интерфейса она
   не годится: буквы падали бы на запасной шрифт прямо внутри слова.
   Взят Montserrat — тот же геометрический строй и полная кириллица.
   ========================================================================== */
:root[data-theme='monday'],
[data-theme='monday'] {
  --ui: "Montserrat", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto,
        "Helvetica Neue", Arial, sans-serif;

  --bg: #f5f6f8;
  --surface: #fff;
  --surface-2: #f7f8fb;
  --head: #f5f6f8;
  --subrow: #fafbfd;

  --ink: #333333;
  --ink-2: #535768;
  --ink-3: #9699a6;

  --line: #d0d4e4;
  --line-2: #e6e9f0;
  --line-3: #c3c6d4;

  --accent: #6161ff;
  --accent-dark: #452aea;
  --accent-soft: #eeeeff;
  --accent-line: #c2b3ff;
  --accent-nav: #6161ff;
  --accent-nav-soft: #eeeeff;

  /* Статусные цвета monday — их узнают по доске с первого взгляда. */
  --go: #009e63;
  --go-bright: #00c875;
  --go-soft: #e3f8ee;
  --go-line: #9ee5c4;
  --on-go: #00734a;

  --amber: #b06f00;
  --amber-bright: #fdab3d;
  --amber-soft: #fff4e0;
  --amber-line: #ffd9a0;
  --on-amber: #8a5600;

  --stop: #e2445c;
  --stop-soft: #fdecef;
  --on-stop: #a82b3f;

  --violet: #a25ddc;
  --violet-soft: #f5edfc;

  --r-ctl: 999px;          /* кнопка-капсула — их узнаваемая форма */
  --r-field: 6px;
  --r-pill: 999px;
  --r: 8px;
  --r-card: 8px;

  --shadow: 0 4px 12px rgba(0,0,0,.1);
  --shadow-card: 0 2px 6px rgba(0,0,0,.06);

  --state-hover: rgba(51,51,51,.06);
  --state-press: rgba(51,51,51,.1);
  --state-on-accent: rgba(255,255,255,.16);

  /* Графики у monday плотные и цветные: линия толще, столбец скруглён. */
  --chart-line: 2.5px;
  --chart-grid: 1px;
  --chart-dot: 4px;
  --chart-bar-r: 4px;
  --chart-label: 9.5px;
  --chart-grid-color: var(--line-2);
}

/* ==========================================================================
   HUBSPOT — тёплый кремовый фон и фирменный оранжевый. Снято с их сайта
   23.08.2026: фон rgb(248,245,238), оранжевый rgb(255,72,0), текст
   rgb(31,31,31), глубокий бирюзовый rgb(18,69,72), скругление 8 px.

   Гарнитура HubSpot Sans лицензионная; их прежняя Lexend Deca тоже без
   кириллицы. Взят Manrope — близкий по духу и с полной кириллицей.
   ========================================================================== */
:root[data-theme='hubspot'],
[data-theme='hubspot'] {
  --ui: "Manrope", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto,
        "Helvetica Neue", Arial, sans-serif;

  /* Кремовый фон — то, по чему их узнают сразу. */
  --bg: #f8f5ee;
  --surface: #fff;
  --surface-2: #fcfbf7;
  --head: #f8f5ee;
  --subrow: #fdfcf9;

  --ink: #1f1f1f;
  --ink-2: #4f5f6e;
  --ink-3: #8a97a3;

  --line: #e3ded2;
  --line-2: #efeae0;
  --line-3: #cfc8b9;

  --accent: #ff4800;
  --accent-dark: #d63b00;
  --accent-soft: #fff0eb;
  --accent-line: #ffc7b3;
  --accent-nav: #ff4800;
  --accent-nav-soft: #fff0eb;

  /* Бирюзовый — их второй фирменный, им и красим успех. */
  --go: #124548;
  --go-bright: #00bda5;
  --go-soft: #e5f7f4;
  --go-line: #99e4da;
  --on-go: #0d3335;

  --amber: #9c6a00;
  --amber-bright: #f5c26b;
  --amber-soft: #fdf6e8;
  --amber-line: #f3dfb6;
  --on-amber: #7a5200;

  --stop: #c02b0a;
  --stop-soft: #fdeeea;
  --on-stop: #932008;

  --violet: #15295a;       /* глубокий синий вместо фиолетового */
  --violet-soft: #eaeef7;

  --r-ctl: 8px;
  --r-field: 8px;
  --r-pill: 999px;
  --r: 10px;
  --r-card: 10px;

  --shadow: 0 3px 10px rgba(31,31,31,.1);
  --shadow-card: 0 1px 3px rgba(31,31,31,.07);

  --state-hover: rgba(31,31,31,.05);
  --state-press: rgba(31,31,31,.09);
  --state-on-accent: rgba(255,255,255,.16);

  --chart-line: 2px;
  --chart-grid: 1px;
  --chart-dot: 3.5px;
  --chart-bar-r: 3px;
  --chart-label: 9.5px;
  --chart-grid-color: var(--line-2);
}

/* ==========================================================================
   WRIKE — тёмно-синий текст и ярко-зелёное действие. Снято с их сайта
   23.08.2026: кнопка rgb(0,224,92) с подписью rgb(22,33,54), скругление
   8 px, кегль основы 16.

   ЗЕЛЁНЫЙ ОСТАВЛЕН ТАМ, ГДЕ ОН ЧИТАЕМ. Их #00e05c прекрасен заливкой, но
   как текст на белом он не читается вовсе. Поэтому заливка кнопки — их
   настоящий зелёный с тёмной подписью, а ссылки и активные состояния
   красятся тем же зелёным, но приглушённым до читаемого. Это не отступ
   от их языка, а условие, без которого числа на складе не разобрать.

   Гарнитура у них TT Norms Pro, лицензионная. Взят Onest — тот же
   нейтральный строй, рисовался сразу с кириллицей.
   ========================================================================== */
:root[data-theme='wrike'],
[data-theme='wrike'] {
  --ui: "Onest", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto,
        "Helvetica Neue", Arial, sans-serif;

  --bg: #f4f6f9;
  --surface: #fff;
  --surface-2: #f7f9fc;
  --head: #f4f6f9;
  --subrow: #fafbfd;

  --ink: #162136;          /* их тёмно-синий */
  --ink-2: #4a5670;
  --ink-3: #8a94a8;

  --line: #dde3ec;
  --line-2: #eaeef4;
  --line-3: #c6cfdd;

  --accent: #00a34a;       /* зелёный, приглушённый до читаемого */
  --accent-dark: #008a3e;
  --accent-soft: #e6faee;
  --accent-line: #a8ecc6;
  --accent-nav: #00a34a;
  --accent-nav-soft: #e6faee;
  /* Кнопка — их настоящая: ярко-зелёная с тёмно-синей подписью. */
  --on-accent: #162136;

  --go: #00a34a;
  --go-bright: #00e05c;    /* их фирменный ярко-зелёный — на показателях */
  --go-soft: #e6faee;
  --go-line: #a8ecc6;
  --on-go: #007133;

  --amber: #a86a00;
  --amber-bright: #ffb020;
  --amber-soft: #fff6e5;
  --amber-line: #ffdfa6;
  --on-amber: #855400;

  --stop: #d63b3b;
  --stop-soft: #fdeeee;
  --on-stop: #a52c2c;

  --violet: #5b5bd6;
  --violet-soft: #eeeefb;

  --r-ctl: 8px;
  --r-field: 8px;
  --r-pill: 999px;
  --r: 10px;
  --r-card: 10px;

  --shadow: 0 4px 12px rgba(22,33,54,.1);
  --shadow-card: 0 1px 3px rgba(22,33,54,.08);

  --state-hover: rgba(22,33,54,.06);
  --state-press: rgba(22,33,54,.1);
  --state-on-accent: rgba(22,33,54,.1);

  --chart-line: 2px;
  --chart-grid: 1px;
  --chart-dot: 3.5px;
  --chart-bar-r: 3px;
  --chart-label: 9.5px;
  --chart-grid-color: var(--line-2);

  /* Отступы просторнее нашей основы — у них таблицы дышат. */
  --tbl-size: 13px;
  --tbl-th-pad: 9px 10px;
  --tbl-td-pad: 8px 10px;
}

/* ==========================================================================
   CLICKUP — фиолетовое действие и крупные скругления. Снято с их сайта
   23.08.2026: фиолетовый rgb(118,18,250), текст rgb(41,45,52), светлая
   линия rgb(233,235,240), скругление кнопки 12 px.

   Гарнитура Plus Jakarta Sans — БЕЗ КИРИЛЛИЦЫ (проверено запросом к их
   наборам). Взят Rubik: тот же дружелюбный геометрический строй и полная
   кириллица.
   ========================================================================== */
:root[data-theme='clickup'],
[data-theme='clickup'] {
  --ui: "Rubik", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto,
        "Helvetica Neue", Arial, sans-serif;

  --bg: #f7f8fb;
  --surface: #fff;
  --surface-2: #f9fafc;
  --head: #f7f8fb;
  --subrow: #fbfcfe;

  --ink: #292d34;
  --ink-2: #646464;
  --ink-3: #9599a3;

  --line: #e9ebf0;
  --line-2: #f1f3f7;
  --line-3: #d5d9e2;

  --accent: #7612fa;
  --accent-dark: #5c0dc4;
  --accent-soft: #f3ebff;
  --accent-line: #d9c2ff;
  --accent-nav: #7612fa;
  --accent-nav-soft: #f3ebff;
  --on-accent: #fff;

  --go: #04a56d;
  --go-bright: #06d6a0;
  --go-soft: #e6f9f2;
  --go-line: #9fe8cf;
  --on-go: #037a51;

  --amber: #b06a00;
  --amber-bright: #ffab00;
  --amber-soft: #fff6e3;
  --amber-line: #ffdfa1;
  --on-amber: #8a5300;

  --stop: #e5484d;
  --stop-soft: #fdedee;
  --on-stop: #b2373b;

  --violet: #7612fa;
  --violet-soft: #f3ebff;

  --r-ctl: 12px;           /* крупные скругления — их узнаваемая черта */
  --r-field: 10px;
  --r-pill: 999px;
  --r: 14px;
  --r-card: 14px;

  --shadow: 0 6px 16px rgba(41,45,52,.1);
  --shadow-card: 0 2px 6px rgba(41,45,52,.07);

  --state-hover: rgba(41,45,52,.05);
  --state-press: rgba(41,45,52,.09);
  --state-on-accent: rgba(255,255,255,.16);

  --chart-line: 2.5px;
  --chart-grid: 1px;
  --chart-dot: 4px;
  --chart-bar-r: 5px;      /* столбцы заметно круглее прочих */
  --chart-label: 9.5px;
  --chart-grid-color: var(--line-2);

  --tbl-size: 13px;
  --tbl-th-pad: 9px 10px;
  --tbl-td-pad: 8px 10px;
}

/* ==========================================================================
   ASANA — по снимку их доски, присланному заказчиком.

   ОСТОРОЖНО: сайт Asana и приложение Asana оформлены ПО-РАЗНОМУ. На
   asana.com сейчас чёрные кнопки и гарнитура TWK Lausanne — это их
   маркетинговый ребренд. В самом продукте, который и был на снимке,
   палитра другая: коралловый акцент, синие и зелёные статусы, светлые
   подложки колонок. Взято второе — просили именно его.

   ГЛАВНОЕ ЗДЕСЬ НЕ ЦВЕТ, А СПОСОБ ВЫДЕЛЯТЬ. У Asana выбранная вкладка не
   заливается цветом: она поднимается БЕЛОЙ таблеткой с мягкой тенью над
   серым полем группы. Это ощущается иначе — выбранное выглядит ближе,
   а не ярче. Ради этого и заведены токены выделения.

   Гарнитура их продукта лицензионная; берём Inter — близкий по рисунку
   нейтральный гротеск, он у нас уже есть.
   ========================================================================== */
:root[data-theme='asana'],
[data-theme='asana'] {
  --ui: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto,
        "Helvetica Neue", Arial, sans-serif;

  --bg: #f9f8f8;
  --surface: #fff;
  --surface-2: #f6f8f9;
  --head: #f9f8f8;
  --subrow: #fbfbfb;

  --ink: #1e1f21;          /* почти чёрный текст продукта */
  --ink-2: #6d6e6f;
  --ink-3: #9ca6af;

  --line: #e8ecee;
  --line-2: #f1f4f5;
  --line-3: #cfd6dc;

  --accent: #f06a6a;       /* коралловый — их знак */
  --accent-dark: #d95a5a;
  --accent-soft: #fdeeee;
  --accent-line: #f8c9c9;
  --accent-nav: #f06a6a;
  --accent-nav-soft: #fdeeee;
  --on-accent: #fff;

  /* Статусы с доски: синий «в работе», зелёный «готово», красный «просрочено». */
  --go: #14803c;
  --go-bright: #14aa5f;    /* зелёная кнопка «плюс» со снимка */
  --go-soft: #e9f5ef;      /* подложка колонки «Completed» */
  --go-line: #a8ddc0;
  --on-go: #0f6330;

  --amber: #b06f00;
  --amber-bright: #f1bd6c;
  --amber-soft: #fdf5e6;
  --amber-line: #f5e0b4;
  --on-amber: #8a5600;

  --stop: #e8384f;         /* просроченная дата на карточках */
  --stop-soft: #fff0f1;    /* подложка колонки «Overdue» */
  --on-stop: #b52a3c;

  --violet: #4573d2;       /* синий «в работе» */
  --violet-soft: #eaf1fb;  /* подложка колонки «In Progress» */

  --r-ctl: 8px;
  --r-field: 8px;
  --r-pill: 999px;
  --r: 12px;
  --r-card: 12px;

  --shadow: 0 4px 12px rgba(30,31,33,.12);
  --shadow-card: 0 1px 3px rgba(30,31,33,.1);

  --state-hover: rgba(30,31,33,.05);
  --state-press: rgba(30,31,33,.09);
  --state-on-accent: rgba(255,255,255,.16);

  /*
   * Выбранное — приподнятой белой таблеткой на сером поле, как у них.
   * Тени ровно столько, чтобы читалось «выше», а не «нарисована рамка».
   */
  --pick-bg: #fff;
  --pick-ink: var(--ink);
  --pick-line: transparent;
  --pick-shadow: 0 1px 3px rgba(30,31,33,.16);
  --pick-group: #eef0f1;

  --chart-line: 2px;
  --chart-grid: 1px;
  --chart-dot: 4px;
  --chart-bar-r: 4px;
  --chart-label: 9.5px;
  --chart-grid-color: var(--line-2);

  --tbl-size: 13px;
  --tbl-th-pad: 9px 10px;
  --tbl-td-pad: 8px 10px;
}

/*
 * «Мастерская» — по specform.pro (снято с живой страницы 23.08.2026).
 *
 * ЧТО ТАМ ГЛАВНОЕ И ЧТО ПЕРЕНЕСЕНО. Не белый лист, а тёплая бумага
 * #f4f2ef; белым светятся только карточки — от этого лист читается как
 * стол, а карточка как лежащий на нём документ. Текст почти чёрный
 * #0e0e0e, подписи тёпло-серые #5a5a56. Единственный цвет — приглушённый
 * зелёный #2a6649, и он живёт в основном подложкой в шесть процентов
 * непрозрачности, а не заливкой.
 *
 * Скругления крупнее наших обычных: 9px у мелочи, 14px у панелей, 16px у
 * карточек — посчитано по странице, 124 узла с 9px и 24 с 14px.
 *
 * Линии тонкие и тёплые: #d6d0c6 по краю бумаги, #e4e1dc внутри.
 *
 * Заголовки лёгкие (вес 300) и с отрицательным трекингом — там это
 * заметнее всего. Веса задаются в разметке, здесь — гарнитура, которая
 * такой вес умеет: Geologica возит начертания от 300.
 */
:root[data-theme='specform'],
[data-theme='specform'] {
  --ui: "Geologica", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto,
        "Helvetica Neue", Arial, sans-serif;

  --bg: #f4f2ef;           /* тёплая бумага, не белый лист */
  --surface: #fff;
  --surface-2: #eef3f0;    /* зелёная подложка в 6 % непрозрачности */
  --head: #f4f2ef;
  --subrow: #faf9f7;

  --ink: #0e0e0e;
  --ink-2: #5a5a56;        /* тёплый серый подписей */
  --ink-3: #8a8a84;

  --line: #d6d0c6;         /* край бумаги */
  --line-2: #e4e1dc;       /* линии внутри карточки */
  --line-3: #c8c2b6;

  --accent: #2a6649;       /* приглушённый зелёный — единственный цвет */
  --accent-dark: #1f4c37;
  --accent-soft: #eef3f0;
  --accent-line: #cfe0d7;
  --accent-nav: #2a6649;
  --accent-nav-soft: #eef3f0;
  --on-accent: #f4f2ef;    /* на тёмном у них не чистый белый, а бумага */

  --go: #2a6649;
  --go-bright: #35805c;
  --go-soft: #eef3f0;
  --go-line: #cfe0d7;
  --on-go: #1f4c37;

  --amber: #8a6a1f;
  --amber-bright: #c9a24a;
  --amber-soft: #f6f1e4;
  --amber-line: #e6dcc2;
  --on-amber: #6d5316;

  --stop: #a83c34;
  --stop-soft: #f8eeed;
  --on-stop: #8a2f28;

  --violet: #3f5b8a;
  --violet-soft: #eef1f6;

  --r-ctl: 9px;
  --r-field: 9px;
  --r-pill: 100px;
  --r: 14px;
  --r-card: 16px;

  --shadow: 0 6px 20px rgba(14,14,14,.08);
  --shadow-card: 0 1px 2px rgba(14,14,14,.06);

  --state-hover: rgba(42,102,73,.06);
  --state-press: rgba(42,102,73,.12);
  --state-on-accent: rgba(244,242,239,.18);

  /* Выбранное — белая карточка на бумаге, тенью, а не рамкой. */
  --pick-bg: #fff;
  --pick-ink: var(--ink);
  --pick-line: transparent;
  --pick-shadow: 0 1px 2px rgba(14,14,14,.14);
  --pick-group: #e9e6e1;

  --chart-line: 1.5px;
  --chart-grid: 1px;
  --chart-dot: 3px;
  --chart-bar-r: 6px;
  --chart-label: 9.5px;
  --chart-grid-color: var(--line-2);

  --tbl-size: 13px;
  --tbl-th-pad: 10px 12px;
  --tbl-td-pad: 9px 12px;
}