/* tokens.css — единственная точка смены дизайна.
 *
 * Слои стилей: tokens → base → components → pages/<имя>. Ниже по слою можно
 * пользоваться тем, что объявлено выше; наоборот — нельзя. Значения перенесены
 * из docs/design/plantopr-proto.html дословно.
 *
 * Два семейства поверхностей живут рядом намеренно:
 *   --w-* «мастерская» — оболочка, доска, списки: плотно, сканируют глазом;
 *   --d-* «документ»   — лист тикета, форма, отчёт: читают и пишут.
 * Разделение держится на разнице светлот внутри темы, поэтому переживает и
 * светлую, и тёмную.
 *
 * Контраст пар измерен, все проходят WCAG AA; самые тесные — 4.66 и 4.73.
 * При правке значений опускать ниже 4.5 нельзя.
 */

:root{
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:20px; --s6:24px; --s7:32px; --s8:40px; --s9:56px; --s10:72px;

  /* скругление разведено по роли: чип 6, карточка 10, панель 14 */
  --r-chip:6px; --r-card:10px; --r-panel:14px; --r-pill:999px;

  --w-ground:#EEEEF0; --w-panel:#FFFFFF; --w-raised:#FAFAFB; --w-hair:#E4E4E7; --w-hair-soft:#EFEFF1;
  --w-ink:#17181B; --w-ink-soft:#4A4C52; --w-ink-muted:#6E7076;
  --d-sheet:#FFFFFF; --d-ground:#F4F4F6; --d-hair:#E4E4E7; --d-hair-soft:#EFEFF1; --d-sunken:#F8F8F9;
  --d-ink:#17181B; --d-ink-soft:#45474D; --d-ink-muted:#6E7076;

  /* золото достаётся только работе агента, красный — только критическому приоритету */
  --accent:#8A5D0C; --accent-text:#7D5409; --accent-fill:#9A6A0D; --accent-hover:#7D5409;
  --accent-dim:rgba(160,112,15,.10); --accent-line:rgba(160,112,15,.32); --accent-ring:rgba(160,112,15,.09);
  --on-accent:#FFFFFF;
  --danger:#C0292E; --danger-dim:rgba(192,41,46,.10);
    /* Успех — приглушённая зелень, а не сигнальная: она стоит рядом с золотом
       и не должна спорить с ним за внимание. */
    --ok:#2E7D52; --ok-dim:rgba(46,125,82,.10);
  /* затемнение под выдвижной навигацией */
  --scrim:rgba(23,24,27,.38);

  --st-done-bg:#EDEDEF; --st-done-text:#4A4C52;
  --st-now-bg:#E9E9EC; --st-now-text:#17181B;

  /* тень бывает только у перетаскиваемой карточки и у листа документа */
  --shadow-drag:0 22px 44px -14px rgba(23,24,27,.30), 0 3px 8px rgba(23,24,27,.14);
  --shadow-sheet:0 1px 2px rgba(23,24,27,.04), 0 8px 28px -14px rgba(23,24,27,.16);

  --f-sans:'IBM Plex Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --f-mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  --t-11:11px; --t-12:12px; --t-13:13px; --t-14:14px; --t-16:16px; --t-20:20px; --t-26:26px; --t-34:34px;

  --tap:44px;
  /* высота шапки: от неё отсчитываются выдвижная рельса и её затемнение */
  --topbar-h:52px;
  color-scheme:light;
}

@media (min-width:640px){
  :root{--topbar-h:56px}
}

/* Тёмная тема объявляется сразу и тем же набором имён. Системная настройка
 * действует, пока пользователь не выбрал тему руками: явный data-theme="light"
 * перебивает медиазапрос, явный data-theme="dark" — включает тьму без него. */
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --w-ground:#0D0E10; --w-panel:#17181B; --w-raised:#202226; --w-hair:#2D3036; --w-hair-soft:#232529;
    --w-ink:#EDEDEF; --w-ink-soft:#B2B4BA; --w-ink-muted:#8A8D94;
    --d-sheet:#17181B; --d-ground:#0D0E10; --d-hair:#2D3036; --d-hair-soft:#232529; --d-sunken:#202226;
    --d-ink:#EDEDEF; --d-ink-soft:#B8BAC0; --d-ink-muted:#8A8D94;
    --accent:#EFB84A; --accent-text:#F0BE5B; --accent-fill:#E0A835; --accent-hover:#F5C766;
    --accent-dim:rgba(239,184,74,.13); --accent-line:rgba(239,184,74,.36); --accent-ring:rgba(239,184,74,.10);
    --on-accent:#1A1409;
    --danger:#F0686C; --danger-dim:rgba(240,104,108,.14);
    --ok:#6FC08F; --ok-dim:rgba(111,192,143,.14);
    --scrim:rgba(0,0,0,.58);
    --st-done-bg:#26282D; --st-done-text:#B2B4BA;
    --st-now-bg:#2E3036; --st-now-text:#EDEDEF;
    --shadow-drag:0 22px 44px -14px rgba(0,0,0,.72), 0 3px 8px rgba(0,0,0,.45);
    --shadow-sheet:0 1px 2px rgba(0,0,0,.24), 0 8px 28px -14px rgba(0,0,0,.55);
    color-scheme:dark;
  }
}

:root[data-theme="dark"]{
  --w-ground:#0D0E10; --w-panel:#17181B; --w-raised:#202226; --w-hair:#2D3036; --w-hair-soft:#232529;
  --w-ink:#EDEDEF; --w-ink-soft:#B2B4BA; --w-ink-muted:#8A8D94;
  --d-sheet:#17181B; --d-ground:#0D0E10; --d-hair:#2D3036; --d-hair-soft:#232529; --d-sunken:#202226;
  --d-ink:#EDEDEF; --d-ink-soft:#B8BAC0; --d-ink-muted:#8A8D94;
  --accent:#EFB84A; --accent-text:#F0BE5B; --accent-fill:#E0A835; --accent-hover:#F5C766;
  --accent-dim:rgba(239,184,74,.13); --accent-line:rgba(239,184,74,.36); --accent-ring:rgba(239,184,74,.10);
  --on-accent:#1A1409;
  --danger:#F0686C; --danger-dim:rgba(240,104,108,.14);
    --ok:#6FC08F; --ok-dim:rgba(111,192,143,.14);
  --scrim:rgba(0,0,0,.58);
  --st-done-bg:#26282D; --st-done-text:#B2B4BA;
  --st-now-bg:#2E3036; --st-now-text:#EDEDEF;
  --shadow-drag:0 22px 44px -14px rgba(0,0,0,.72), 0 3px 8px rgba(0,0,0,.45);
  --shadow-sheet:0 1px 2px rgba(0,0,0,.24), 0 8px 28px -14px rgba(0,0,0,.55);
  color-scheme:dark;
}