/* Пульт v2 · токены системы «Бенто».
   Все цвета, тени, радиусы, шрифты и плотность живут здесь. В экранах — только переменные, без своих hex.
   Контраст текста проверен: --ink-3 не ниже 4,6:1 на любой поверхности и пастельной подложке,
   тёмные оттенки групп (--*-700) не ниже 5,3:1 на своих подложках (--*-50 и --*-100). */

:root {
  /* ---------- поверхности */
  --bg: #F5F4F1;          /* тёплый фон страницы */
  --surface: #FFFFFF;     /* карточка, плитка */
  --surface-2: #FAF9F6;   /* вложенная панель внутри карточки */
  --surface-3: #F2F0EC;   /* дорожка сегментов, подложка чипа, наведение */
  --surface-4: #E9E7E1;   /* пустая часть полос и колец, нажатие */

  /* ---------- текст и линии */
  --ink: #1D1C1A;         /* основной текст, 17:1 на белом */
  --ink-2: #47443E;       /* второстепенный текст, 9,7:1 */
  --ink-3: #6A665E;       /* подписи и метки, 5,7:1 на белом, 4,6:1 на --surface-4 */
  --ink-4: #9A968E;       /* только значки и разделители, не текст (2,9:1) */
  --line: rgba(29, 28, 26, .08);
  --line-2: rgba(29, 28, 26, .13);
  --line-3: rgba(29, 28, 26, .22);

  /* ---------- пастельные семейства: 50 — подложка подноса, 100 — чип, 200 — обводка, 300 — сегмент графика,
     500 — точка и линия графика, 700 — текст на 50 и 100 */
  --coral-50: #FDF1EC; --coral-100: #FCE3D9; --coral-200: #F7C9B8; --coral-300: #F1A68B; --coral-500: #E8643F; --coral-700: #A23B1E; --coral-800: #842E15;
  --lav-50: #F3F1FD;   --lav-100: #E9E5FC;   --lav-200: #D6CEF8;   --lav-300: #B6A9F1;   --lav-500: #7C68E6;   --lav-700: #4C3AA8;   --lav-800: #3B2D86;
  --sky-50: #EDF5FC;   --sky-100: #DDEDFA;   --sky-200: #C2DDF4;   --sky-300: #92C1EA;   --sky-500: #3B8FD6;   --sky-700: #175688;   --sky-800: #12446B;
  --mint-50: #ECF7F1;  --mint-100: #DCF1E5;  --mint-200: #BEE4CF;  --mint-300: #8CCFAA;  --mint-500: #2F9E6A;  --mint-700: #186640;  --mint-800: #12502F;
  --sand-50: #FBF6EC;  --sand-100: #F6ECD8;  --sand-200: #EDDAB2;  --sand-300: #E2C27F;  --sand-500: #C29022;  --sand-700: #78540E;  --sand-800: #5E420B;
  --rose-50: #FDF2F6;  --rose-100: #FAE4EC;  --rose-200: #F3C6D6;  --rose-300: #E79AB6;  --rose-500: #D24B86;  --rose-700: #932650;  --rose-800: #741D3F;
  --berry-50: #FCF1F6; --berry-100: #F9E6EE; --berry-200: #F1C7D9; --berry-300: #E094B5; --berry-500: #C23D7A; --berry-700: #A0245E; --berry-800: #87194D;

  /* ---------- контур: WCD — почти чёрный акцент. Fledge Events переопределяет ниже */
  --accent: #1D1C1A;
  --accent-hover: #3A3833;
  --on-accent: #FFFFFF;
  --accent-soft: #ECEAE5;
  --signature: #B0451F;   /* слово-акцент в заголовке, значок даты */
  --aura-1: rgba(252, 227, 217, .95);
  --aura-2: rgba(233, 229, 252, .85);
  --focus: var(--accent);
  --brand-dot: conic-gradient(#E8643F 0 25%, #7C68E6 0 50%, #3B8FD6 0 75%, #2F9E6A 0);

  /* тёмная поверхность: уведомление, панель пачки, нижняя навигация на телефоне */
  --dark: #1D1C1A;
  --on-dark: #F5F4F1;
  --on-dark-2: rgba(245, 244, 241, .72);
  --on-dark-3: #C9C5BD;

  /* ---------- графики и карта */
  --chart-ink: var(--ink);
  --chart-1: var(--ink);
  --chart-2: var(--lav-500);
  --chart-3: var(--sky-500);
  --chart-4: var(--mint-500);
  --chart-5: var(--coral-500);
  --chart-6: var(--sand-500);
  --chart-grid: rgba(29, 28, 26, .07);
  --chart-axis: var(--ink-3);
  --chart-area: rgba(182, 169, 241, .32);
  --chart-band: rgba(146, 193, 234, .26);
  --chart-muted: var(--surface-4);
  --map-sea: #EDF3F8;
  --map-land: #FFFFFF;
  --map-stroke: rgba(29, 28, 26, .2);
  --map-border: rgba(29, 28, 26, .1);
  --map-grat: rgba(59, 143, 214, .14);
  --map-night: #20242E;

  /* ---------- тени: мягкие, многослойные, тёплые */
  --sh-1: 0 1px 1px rgba(40, 32, 20, .03), 0 1px 3px rgba(40, 32, 20, .06);
  --sh-2: 0 1px 2px rgba(40, 32, 20, .04), 0 4px 10px -2px rgba(40, 32, 20, .05), 0 14px 30px -12px rgba(40, 32, 20, .09);
  --sh-3: 0 2px 4px rgba(40, 32, 20, .05), 0 10px 22px -6px rgba(40, 32, 20, .09), 0 26px 50px -18px rgba(40, 32, 20, .16);
  --sh-4: 0 4px 10px rgba(30, 24, 14, .08), 0 18px 40px -8px rgba(30, 24, 14, .18), 0 40px 80px -24px rgba(30, 24, 14, .24);

  /* ---------- радиусы */
  --r-xs: 8px;     /* клавиша, мелкая метка */
  --r-sm: 12px;    /* значок-плитка 34–38 px, всплывающая подсказка */
  --r-md: 16px;    /* вложенная панель, строка-вариант */
  --r-lg: 18px;    /* панель внутри карточки, таблица в карточке */
  --r-card: 22px;  /* карточка очереди, плитка показателя */
  --r-tile: 28px;  /* блок бенто: задачи, запуски, таблица экрана */
  --r-hero: 30px;  /* главный блок экрана, окно, боковая панель */
  --r-tray: 32px;  /* поднос группы */
  --r-pill: 999px;

  /* ---------- шрифты и размеры */
  --font: 'Onest', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --serif: 'Cormorant Garamond', 'Times New Roman', serif;
  --mono: ui-monospace, 'SF Mono', SFMono-Regular, Menlo, Consolas, monospace;
  --fs-hero: 56px;   /* приветствие «Сегодня» */
  --fs-display: 44px; /* заголовок экрана */
  --fs-h1: 30px;
  --fs-h2: 21px;     /* заголовок подноса */
  --fs-h3: 17px;     /* заголовок плитки */
  --fs-body: 15px;
  --fs-sm: 14px;
  --fs-xs: 13px;
  --fs-2xs: 12.5px;
  --fs-min: 11.5px;  /* мельче не бывает: подписи осей, бейджи */

  /* ---------- движение */
  --ease: cubic-bezier(.22, .8, .24, 1);
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --dur: .2s;

  /* ---------- каркас */
  --side-w: 248px;
  --side-inset: 16px;
  --gut: 24px;
  --page-max: 1560px;
  --drawer-w: 520px;

  /* ---------- плотность «Удобно» (по умолчанию) */
  --ctl-h: 40px;      /* кнопка, поле, пилюля */
  --ctl-h-sm: 32px;
  --ctl-h-xs: 28px;
  --tile-pad: 22px;   /* внутренний отступ плитки */
  --tile-pad-x: 22px;
  --gap: 20px;        /* между плитками бенто */
  --gap-sm: 12px;     /* между элементами внутри плитки */
  --stack: 28px;      /* между секциями экрана */
  --cell-y: 12px;     /* таблица: вертикальный отступ ячейки */
  --cell-x: 14px;
  --row-y: 12px;      /* список: вертикальный отступ строки */
  --row-fs: 14px;     /* размер текста строк таблиц и списков */
  --lane-h: 46px;     /* дорожка таймлайна */
  --kpi-v: 34px;      /* число в плитке показателя */
}

/* ---------- контур Fledge Events: ягодный акцент */
:root[data-contour="fe"] {
  --accent: #A0245E;
  --accent-hover: #87194D;
  --accent-soft: #F9E6EE;
  --signature: #A0245E;
  --aura-1: rgba(250, 228, 236, .95);
  --aura-2: rgba(233, 229, 252, .8);
  --brand-dot: #D24B86;
}

/* ---------- плотность «Плотно»: рабочие экраны заметно уплотняются */
:root[data-density="compact"] {
  --ctl-h: 34px;
  --ctl-h-sm: 28px;
  --ctl-h-xs: 24px;
  --tile-pad: 16px;
  --tile-pad-x: 18px;
  --gap: 12px;
  --gap-sm: 8px;
  --stack: 18px;
  --cell-y: 6px;
  --cell-x: 11px;
  --row-y: 7px;
  --row-fs: 13.5px;
  --lane-h: 36px;
  --kpi-v: 26px;
  --fs-display: 34px;
}

/* ---------- тона: любой блок получает пастельное семейство через --g-* */
[data-g="urgent"], .tone-coral { --g-50: var(--coral-50); --g-100: var(--coral-100); --g-200: var(--coral-200); --g-300: var(--coral-300); --g-500: var(--coral-500); --g-700: var(--coral-700); }
[data-g="decide"], .tone-lav { --g-50: var(--lav-50); --g-100: var(--lav-100); --g-200: var(--lav-200); --g-300: var(--lav-300); --g-500: var(--lav-500); --g-700: var(--lav-700); }
[data-g="reply"], .tone-sky { --g-50: var(--sky-50); --g-100: var(--sky-100); --g-200: var(--sky-200); --g-300: var(--sky-300); --g-500: var(--sky-500); --g-700: var(--sky-700); }
[data-g="info"], .tone-mint { --g-50: var(--mint-50); --g-100: var(--mint-100); --g-200: var(--mint-200); --g-300: var(--mint-300); --g-500: var(--mint-500); --g-700: var(--mint-700); }
.tone-sand { --g-50: var(--sand-50); --g-100: var(--sand-100); --g-200: var(--sand-200); --g-300: var(--sand-300); --g-500: var(--sand-500); --g-700: var(--sand-700); }
.tone-rose { --g-50: var(--rose-50); --g-100: var(--rose-100); --g-200: var(--rose-200); --g-300: var(--rose-300); --g-500: var(--rose-500); --g-700: var(--rose-700); }
.tone-berry { --g-50: var(--berry-50); --g-100: var(--berry-100); --g-200: var(--berry-200); --g-300: var(--berry-300); --g-500: var(--berry-500); --g-700: var(--berry-700); }
.tone-ink { --g-50: var(--surface-2); --g-100: var(--surface-3); --g-200: var(--surface-4); --g-300: var(--ink-4); --g-500: var(--ink-3); --g-700: var(--ink-2); }