/* ============================================================================
   tokens.css — ЕДИНЫЙ ИСТОЧНИК дизайн-токенов МТК Платформы.
   Версия iOS: системная палитра и типографика Apple, каркас «список + карточка».
   Подключается ПЕРВЫМ (до components.css и app.css).

   ПРИНЦИП ПЕРЕНОСА: имена токенов сохранены 1:1 из прежних версий — все
   существующие var(--…) в app.css и в JS-разметке переодеваются сами, правок
   в разметке не требуется. Поменялись ЗНАЧЕНИЯ и добавились токены, которых
   раньше не было: полупрозрачные заливки (--fill), тональные подложки
   статусов, длительности и кривая движения.

   ШРИФТ. SF Pro нельзя раздавать с сайта — лицензия Apple разрешает её
   только в приложениях Apple-платформ. Поэтому стек: сначала системная SF
   (её получат Mac, iPhone, iPad), затем Inter — у него тот же гротескный
   скелет и полная кириллица. Segoe UI намеренно ПОСЛЕ Inter: иначе Windows
   берёт её и интерфейс перестаёт выглядеть по-iOS.
   ========================================================================== */

:root {
  color-scheme: light;

  /* ── ПОВЕРХНОСТИ ───────────────────────────────────────────────────────────
     В iOS их всего две: серое полотно и белые врезанные группы на нём. */
  --bg: #F2F2F7;              /* systemGroupedBackground — полотно */
  --surface: #FFFFFF;         /* secondarySystemGroupedBackground — группа */
  --surface-2: #F2F2F7;       /* вложенная подложка внутри белой группы */
  --sunken: #E5E5EA;          /* systemGray5 — разделительные плоскости */

  /* Материалы (полупрозрачные, работают только с backdrop-filter: var(--blur)) */
  --bar: rgba(249,249,249,.82);       /* панель заголовка */
  --sidebar: rgba(242,242,247,.78);   /* боковая панель разделов */
  --sheet: rgba(252,252,253,.90);     /* лист снизу, поповер, панель */
  --material: var(--bar);
  --blur: saturate(180%) blur(24px);
  --scrim: rgba(0,0,0,.34);           /* затемнение под листом */

  /* ── ТЕКСТ ─── четыре уровня label, как в iOS ─────────────────────────── */
  --ink: #000000;
  --ink-2: rgba(60,60,67,.90);   /* secondaryLabel — подписи, вторая строка.
                                    Плотнее эталона iOS: при .72 третий и четвёртый
                                    уровни уже не проходят порог читаемости. */
  --ink-3: rgba(60,60,67,.82);   /* tertiaryLabel — метаданные, значения (6.2:1) */
  --ink-4: rgba(60,60,67,.74);   /* quaternaryLabel — шевроны, мелкие подписи (5.0:1).
                                    В iOS тут .30, но там этим цветом красят крупное
                                    и декоративное. У нас — хинты настроек, дни недели
                                    и каретки списков: на .30 это 1.7:1, нечитаемо. */

  /* ── ЛИНИИ ── */
  --line: rgba(60,60,67,.13);    /* separator внутри группы */
  --line-2: rgba(60,60,67,.22);  /* opaqueSeparator, «ручка» листа */
  --hair: var(--line);

  /* ── ЗАЛИВКИ ─── fill: подложка сегментов, поиска, кнопок-пилюль ──────── */
  --fill: rgba(120,120,128,.12);
  --fill-2: rgba(120,120,128,.20);
  --fill-3: rgba(120,120,128,.28);
  --track: var(--fill);
  --control-track: var(--fill);
  --seg-thumb: #FFFFFF;

  /* ── АКЦЕНТ ─── systemBlue ────────────────────────────────────────────── */
  --accent: #007AFF; --accent-d: #0060DF; --accent-sf: rgba(0,122,255,.10);
  --accent-fg: #FFFFFF;

  /* ── СТАТУСЫ ───────────────────────────────────────────────────────────
     Тон для ТЕКСТА берём затемнённый (systemGreen #34C759 на белом даёт
     2.2:1 и нечитаем в подписи), тинт — от исходного системного цвета. */
  --ok: #248A3D;   --ok-sf: rgba(52,199,89,.14);
  --warn: #B25000; --warn-sf: rgba(255,149,0,.16);
  --bad: #D70015;  --bad-sf: rgba(255,59,48,.14);
  --violet: #8944AB; --violet-soft: rgba(175,82,222,.14);
  --muted-dot: rgba(60,60,67,.30);

  /* ── ЗАЛИВКИ ПОД БЕЛЫМ ТЕКСТОМ ─────────────────────────────────────────
     Отдельно от --ok/--warn/--bad: те в тёмной теме СВЕТЛЫЕ (это цвет
     текста на тёмном), и белая надпись по такой заливке нечитаема.
     Эти держат ≥4.5:1 с белым и одинаковы в обеих темах. */
  --accent-solid: #007AFF; --accent-solid-h: #0060DF;
  --ok-solid: #248A3D; --warn-solid: #B25000; --bad-solid: #D70015;

  /* Системные цвета целиком — для данных (цвета машин, зон, графиков).
     Это ДАННЫЕ, а не тема: они одинаковы в светлой и тёмной. */
  --sys-blue: #007AFF; --sys-green: #34C759; --sys-indigo: #5856D6;
  --sys-orange: #FF9500; --sys-pink: #FF2D55; --sys-purple: #AF52DE;
  --sys-red: #FF3B30; --sys-teal: #5AC8FA; --sys-yellow: #FFCC00;
  --sys-gray: #8E8E93;

  /* ── АЛИАСЫ под прежние имена — существующие правила переодеваются сами ── */
  --card: var(--surface); --card2: var(--surface-2);
  --tx: var(--ink); --tx2: var(--ink-2); --tx3: var(--ink-3);
  --line2: var(--line-2);
  --acc: var(--accent); --acc-d: var(--accent-d); --acc-soft: var(--accent-sf);
  --ok-soft: var(--ok-sf); --warn-soft: var(--warn-sf); --bad-soft: var(--bad-sf);
  --label: var(--ink); --label-2: var(--ink-2); --label-3: var(--ink-3); --label-4: var(--ink-4);
  --elev: var(--surface); --fill-legacy: var(--surface-2); --sep: var(--line);
  --blue: var(--accent); --blue-d: var(--accent-d); --blue-sf: var(--accent-sf);
  --green: var(--ok); --green-sf: var(--ok-sf);
  --orange: var(--warn); --orange-sf: var(--warn-sf);
  --red: var(--bad); --red-sf: var(--bad-sf);
  --purple: var(--violet); --purple-sf: var(--violet-soft);
  --danger: var(--bad); --danger-sf: var(--bad-sf);
  --grouped: var(--bg); --grouped-2: var(--surface);
  --tint: var(--accent); --tint-d: var(--accent-d); --tint-sf: var(--accent-sf);

  /* ── РАДИУСЫ ─── iOS крупнее macOS: строка 10, группа 16, лист 20 ─────── */
  --radius-sm: 8px; --radius-md: 10px; --radius-lg: 16px; --radius-xl: 20px;
  --radius-full: 999px;
  --r-chip: 999px; --r-field: 10px;
  /* --r-btn НЕ 999px, хотя кнопки в этом стиле — пилюли. Этим же токеном
     в app.css скруглён 51 элемент, к кнопкам отношения не имеющий: обёртка
     карты на «Главной» (становилась кругом), подсказки, легенды, пункты
     выпадающих списков, поиск в панели. Форму пилюли выдаём самим кнопкам —
     см. «Кнопки-пилюли» в конце app.css. */
  --r-btn: 10px;
  --r-card: 16px; --r-modal: 20px; --r-pill: 999px;
  --r: var(--r-card); --r-sm: var(--radius-md); --r-lg: var(--r-modal);

  /* ── ОТСТУПЫ ─── шкала 4px. Расстояния задаются ТОЛЬКО этими токенами
     через gap у контейнера — это лечит «то далеко, то слиплось». ───────── */
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 20px;
  --s-6: 24px; --s-8: 32px; --s-10: 40px;

  /* ── ВЫСОТЫ ─── касание в iOS не меньше 44px ──────────────────────────── */
  --h-bar: 52px;          /* панель заголовка */
  --h-row: 56px;          /* строка списка с двумя строками текста */
  --h-row-sm: 44px;       /* минимум касания, простая строка */
  --h-control: 30px;      /* пилюля в панели заголовка */
  --h-control-lg: 34px;   /* кнопка в карточке */
  --h-button: 50px;       /* большая кнопка формы («Войти») */
  --h-field: 44px;
  --w-sidebar: 236px;     /* панель разделов */
  --w-sidebar-collapsed: 64px;
  --w-list: 340px;        /* средняя колонка: список записей */
  --w-form: 680px;        /* колонка настроек и форм */

  /* ── ТЕНИ ─── в iOS их почти нет: группы держит цвет, а не тень ───────── */
  --shadow: 0 1px 3px rgba(0,0,0,.05);
  --shadow-md: 0 6px 18px rgba(0,0,0,.10);
  --shadow-lg: 0 24px 60px -12px rgba(0,0,0,.30);
  --shadow-border: var(--shadow);
  --shadow-border-hover: var(--shadow-md);
  --sh-1: var(--shadow); --sh-2: var(--shadow-md); --sh-3: var(--shadow-lg);
  --sh-card: var(--shadow); --sh-hover: var(--shadow-md);
  --sh-modal: var(--shadow-lg); --sh-pop: var(--shadow-lg);
  --sh-thumb: 0 3px 8px rgba(0,0,0,.15), 0 1px 1px rgba(0,0,0,.16);

  /* ── ШРИФТ ── */
  --font: -apple-system, BlinkMacSystemFont, 'SF Pro Text', 'SF Pro Display',
          'Inter', 'Segoe UI', system-ui, sans-serif;
  --display: var(--font);
  --mono: ui-monospace, 'SF Mono', Menlo, Consolas, monospace;

  /* ── ТИПОГРАФИКА ─── шкала iOS Text Styles ────────────────────────────── */
  --text-2xs: 11px;    /* caption2 */
  --text-xs:  12px;    /* caption1 */
  --text-sm:  13px;    /* footnote — подписи групп, метаданные */
  --text-md:  15px;    /* subheadline — вторая строка, кнопки */
  --text-base:16px;    /* callout — основной текст строки списка */
  --text-lg:  17px;    /* body / headline — заголовок панели, текст статьи */
  --text-xl:  19px;    /* title3 */
  --text-2xl: 24px;    /* title2 */
  --text-3xl: 32px;    /* largeTitle — крупный заголовок раздела */

  --lh-tight: 1.2; --lh: 1.47;
  /* Трекинг в iOS отрицательный и растёт с кеглем */
  --ls-large: -.032em; --ls-title: -.02em; --ls-body: -.01em; --ls-caps: .02em;
  --fw: 450; --fw-medium: 500; --fw-semibold: 600; --fw-bold: 700;

  /* ── ДВИЖЕНИЕ ─── одно замедление на весь интерфейс ───────────────────── */
  --ease: cubic-bezier(.32,.72,0,1);   /* быстрый разгон, мягкая остановка */
  --dur-fast: .14s;    /* нажатие */
  --dur: .22s;         /* подсветка, смена цвета */
  --dur-slow: .3s;     /* переключатель, сегмент, сворачивание панели */
  --dur-sheet: .42s;   /* лист снизу */
  --transition: var(--dur) var(--ease);

  /* ── z-index ── */
  --z-dropdown: 100; --z-sticky: 200; --z-header: 300; --z-modal: 1000; --z-toast: 2000;

  /* ── СЕМАНТИЧЕСКИЕ ПОВЕРХНОСТИ ── */
  --ink-solid: #1C1C1E;
  --toast-bg: rgba(28,28,30,.92); --toast-fg: #FFFFFF;
  --map-canvas: #F2EFE9;      /* цвет суши OSM: незагруженное место не серое, а как бумага карты */
  --tint-danger: var(--bad-sf);  --tint-danger-hover: rgba(255,59,48,.20);
  --tint-warn: var(--warn-sf);   --tint-warn-hover: rgba(255,149,0,.22);
  --tint-info: var(--accent-sf); --tint-once: var(--bad-sf);
  --text-warn-strong: var(--warn); --text-once: var(--bad);
  --text-info-strong: var(--accent);
}

[data-theme="dark"] {
  color-scheme: dark;

  --bg: #000000; --surface: #1C1C1E; --surface-2: #2C2C2E; --sunken: #3A3A3C;
  --bar: rgba(28,28,30,.82); --sidebar: rgba(22,22,24,.80); --sheet: rgba(38,38,42,.92);
  --material: var(--bar); --scrim: rgba(0,0,0,.52);

  --ink: #FFFFFF;
  --ink-2: rgba(235,235,245,.88);
  --ink-3: rgba(235,235,245,.78);
  --ink-4: rgba(235,235,245,.68);

  --line: rgba(84,84,88,.60); --line-2: rgba(84,84,88,.80);
  --fill: rgba(120,120,128,.24); --fill-2: rgba(120,120,128,.36); --fill-3: rgba(120,120,128,.44);
  --seg-thumb: #636366;

  /* В тёмной теме --accent отдан ТЕКСТУ; заливки под белым текстом берут
     --accent-solid (см. блок выше — он одинаков в обеих темах). */
  --accent: #0A84FF; --accent-d: #4DA3FF; --accent-sf: rgba(10,132,255,.20);

  --ok: #30D158; --ok-sf: rgba(48,209,88,.20);
  --warn: #FF9F0A; --warn-sf: rgba(255,159,10,.22);
  --bad: #FF453A; --bad-sf: rgba(255,69,58,.22);
  --violet: #BF5AF2; --violet-soft: rgba(191,90,242,.22);
  --muted-dot: rgba(235,235,245,.26);

  --shadow: 0 1px 3px rgba(0,0,0,.40);
  --shadow-md: 0 6px 18px rgba(0,0,0,.50);
  --shadow-lg: 0 24px 60px -12px rgba(0,0,0,.70);
  --sh-thumb: 0 3px 8px rgba(0,0,0,.45), 0 1px 1px rgba(0,0,0,.30);

  --ink-solid: #F2F2F7;
  --toast-bg: rgba(58,58,60,.94);
  --map-canvas: #2C2C2E;
  --tint-danger: rgba(255,69,58,.22); --tint-danger-hover: rgba(255,69,58,.30);
  --tint-warn: rgba(255,159,10,.22);  --tint-warn-hover: rgba(255,159,10,.30);
  --tint-info: var(--accent-sf); --tint-once: rgba(255,69,58,.22);
  --text-warn-strong: #FF9F0A; --text-once: #FF453A; --text-info-strong: #4DA3FF;
}

/* Автоматическая тёмная тема, если пользователь не выбрал вручную
   (на <html> нет data-theme). */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    color-scheme: dark;
    --bg: #000000; --surface: #1C1C1E; --surface-2: #2C2C2E; --sunken: #3A3A3C;
    --bar: rgba(28,28,30,.82); --sidebar: rgba(22,22,24,.80); --sheet: rgba(38,38,42,.92);
    --ink: #FFFFFF; --ink-2: rgba(235,235,245,.88);
    --ink-3: rgba(235,235,245,.78); --ink-4: rgba(235,235,245,.68);
    --line: rgba(84,84,88,.60); --line-2: rgba(84,84,88,.80);
    --fill: rgba(120,120,128,.24); --fill-2: rgba(120,120,128,.36);
    --accent: #0A84FF; --accent-d: #4DA3FF; --accent-sf: rgba(10,132,255,.20);
    --ok: #30D158; --ok-sf: rgba(48,209,88,.20);
    --warn: #FF9F0A; --warn-sf: rgba(255,159,10,.22);
    --bad: #FF453A; --bad-sf: rgba(255,69,58,.22);
    --seg-thumb: #636366; --map-canvas: #2C2C2E;
  }
}

/* «Уменьшить движение» — системная настройка, уважаем её. */
@media (prefers-reduced-motion: reduce) {
  :root { --dur-fast: .01ms; --dur: .01ms; --dur-slow: .01ms; --dur-sheet: .01ms; }
}

/* «Уменьшить прозрачность» — материалы становятся плотными. */
@media (prefers-reduced-transparency: reduce) {
  :root { --blur: none; --bar: #F9F9F9; --sidebar: #F2F2F7; --sheet: #FCFCFD; }
  [data-theme="dark"] { --bar: #1C1C1E; --sidebar: #161618; --sheet: #26262A; }
}

/* ============================================================================
   СЛОЙ TAHOE — стекло (Liquid Glass).
   Добавлен поверх блоков выше: они задают цвет и размер, этот — МАТЕРИАЛ.
   Ни одно прежнее имя токена не переопределяется, поэтому всё, что уже
   написано на var(--…), продолжает работать как работало.

   ЧТО ТАКОЕ СТЕКЛО В ТАХО. Три слоя, и без любого из них эффекта нет:
   1) полупрозрачная заливка (--glass);
   2) размытие того, что под ней (--glass-blur через backdrop-filter);
   3) БЛИК ПО КРОМКЕ (--glass-spec) — светлая линия сверху, слабее снизу.
   Третий слой важнее первых двух: без него стекло читается как обычный
   полупрозрачный прямоугольник, и вся стилистика рассыпается.

   ГДЕ СТЕКЛО, А ГДЕ НЕТ. Стеклом делаем ОБВЯЗКУ — панель разделов, шапку,
   окна, поповеры, таб-бар, кнопки-пилюли. Полотно с данными (карточки,
   таблицы, списки) остаётся НЕПРОЗРАЧНЫМ: интерфейс осознанно укрупнён под
   менеджеров 40+ (README, «Исправления после первого теста»), и текст на
   просвечивающем фоне этот выигрыш съедает. У Apple ровно так же: контент
   непрозрачный, стеклом сделано то, что над ним.
   ========================================================================== */

:root {
  /* ── Заливки стекла ── */
  --glass:        rgba(255,255,255,.62);
  --glass-strong: rgba(255,255,255,.80);
  --glass-thin:   rgba(255,255,255,.44);
  --glass-blur:    saturate(180%) blur(28px);
  --glass-blur-lg: saturate(190%) blur(44px);

  /* ── Блик по кромке: свет падает сверху ── */
  --glass-spec: inset 0 1px 0 rgba(255,255,255,.90),
                inset 0 -1px 0 rgba(255,255,255,.34);
  /* Контур: изнутри светлый (кромка стекла), снаружи еле заметный тёмный */
  --glass-ring: inset 0 0 0 1px rgba(255,255,255,.50),
                0 0 0 1px rgba(60,60,67,.09);
  /* Тень: стекло висит НАД полотном, а не лежит в нём */
  --glass-cast:    0 1px 2px rgba(0,0,0,.05), 0 10px 30px -8px rgba(0,0,0,.14);
  --glass-cast-lg: 0 2px 8px rgba(0,0,0,.08), 0 32px 72px -18px rgba(0,0,0,.32);

  /* ── Тонированное стекло: выделение (активный пункт меню, выбранный день) ── */
  --glass-tint:   rgba(0,122,255,.14);
  --glass-tint-2: rgba(0,122,255,.22);

  /* ── Подложка под стеклом ────────────────────────────────────────────────
     Стекло видно только тогда, когда под ним есть ЧТО размывать. В браузере
     за панелью нет обоев рабочего стола, поэтому кладём очень слабую цветную
     размывку на само полотно — она играет ту же роль, что обои в macOS.
     Насыщенность намеренно на грани заметности: это подложка, а не фон. */
  --wallpaper:
    radial-gradient(1180px 760px at 8% -14%, rgba(0,122,255,.20), transparent 60%),
    radial-gradient(980px 640px at 104% -6%, rgba(88,86,214,.15), transparent 56%),
    radial-gradient(900px 720px at 62% 114%, rgba(90,200,250,.14), transparent 58%);
  /* Панель разделов прозрачнее эталонной: сквозь неё должна читаться подложка,
     иначе стекло вырождается в белую плашку. */
  --sidebar: rgba(255,255,255,.55);
  --bar: rgba(255,255,255,.62);

  /* ── Радиусы Тахо: крупнее прежних, кромка мягче ── */
  --r-window: 26px;      /* окно, лист */
  --r-glass:  18px;      /* панель, поповер */
  --r-control: 999px;    /* контрол — всегда пилюля */
  /* Прежние имена переопределяем здесь, а не в блоке выше: так видно, что
     изменилось именно в Тахо, и одной строкой возвращается как было. */
  /* ── Заливки под белым текстом: тон на ступень глубже ────────────────────
     #007AFF — системный синий Apple, и белым по нему пишет сама Apple. Но это
     4,02 при пороге 4,5, а под ним у нас каждая главная кнопка, выбранный
     день, номер остановки и активный фильтр — 30 мест в интерфейсе на один
     промах. Берём следующий тон той же шкалы (он уже был в палитре как цвет
     наведения): 5,9 с белым, а на глаз отличается едва.
     Зелёный так же: #248A3D давал 4,4. */
  --accent-solid: #0060DF; --accent-solid-h: #004FBC;
  --ok-solid: #1B6B2E;

  /* Тон ДЛЯ НАДПИСИ НА СВОЁЙ ЖЕ ПОДЛОЖКЕ. Статусные цвета рассчитаны на белую
     карточку; на собственной полупрозрачной заливке («готово» на зелёном,
     «срыв» на красном) они теряют 0,5–0,7 и проваливаются под порог. */
  --ok-on-fill: #175C27;
  --warn-on-fill: #7A3A00;
  --accent-on-fill: #0053C4;

  /* Красный ДЛЯ НАДПИСИ НА ЗАЛИВКЕ. --bad (#D70015) рассчитан на белую
     карточку — там 4.85:1. На сером полотне и на любой полупрозрачной заливке
     он проваливается до 4.2. Этот тон держит ≥5.7 и там, и там. */
  --bad-on-fill: #B00010;
  --r-card: 18px;        /* было 16 */
  --r-modal: 26px;       /* было 20 */
  --radius-lg: 18px; --radius-xl: 26px;
  /* Концентричность: вложенный угол = внешний минус отступ. Иначе внутренняя
     карточка в скруглённой панели выглядит «вдавленным квадратом». */
  --r-inner: calc(var(--r-glass) - var(--s-2));
}

[data-theme="dark"] {
  --glass:        rgba(44,44,48,.62);
  --glass-strong: rgba(48,48,52,.80);
  --glass-thin:   rgba(40,40,44,.44);

  --glass-spec: inset 0 1px 0 rgba(255,255,255,.16),
                inset 0 -1px 0 rgba(255,255,255,.05);
  --glass-ring: inset 0 0 0 1px rgba(255,255,255,.10),
                0 0 0 1px rgba(0,0,0,.55);
  --glass-cast:    0 1px 2px rgba(0,0,0,.50), 0 12px 34px -8px rgba(0,0,0,.58);
  --glass-cast-lg: 0 2px 10px rgba(0,0,0,.55), 0 36px 80px -18px rgba(0,0,0,.72);

  --glass-tint:   rgba(10,132,255,.26);
  --glass-tint-2: rgba(10,132,255,.36);
  /* В тёмной теме текст светлый на тёмной подложке — тона осветляем. */
  --bad-on-fill: #FF8A84;
  --ok-on-fill: #5CE682;
  --warn-on-fill: #FFC259;
  --accent-on-fill: #8AC6FF;

  --wallpaper:
    radial-gradient(1180px 760px at 8% -14%, rgba(10,132,255,.34), transparent 60%),
    radial-gradient(980px 640px at 104% -6%, rgba(94,92,230,.26), transparent 56%),
    radial-gradient(900px 720px at 62% 114%, rgba(90,200,250,.16), transparent 58%);
  --sidebar: rgba(22,22,24,.55);
  --bar: rgba(28,28,30,.60);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    --glass:        rgba(44,44,48,.62);
    --glass-strong: rgba(48,48,52,.80);
    --glass-thin:   rgba(40,40,44,.44);
    --glass-spec: inset 0 1px 0 rgba(255,255,255,.16),
                  inset 0 -1px 0 rgba(255,255,255,.05);
    --glass-ring: inset 0 0 0 1px rgba(255,255,255,.10),
                  0 0 0 1px rgba(0,0,0,.55);
    --glass-cast:    0 1px 2px rgba(0,0,0,.50), 0 12px 34px -8px rgba(0,0,0,.58);
    --glass-cast-lg: 0 2px 10px rgba(0,0,0,.55), 0 36px 80px -18px rgba(0,0,0,.72);
    --glass-tint:   rgba(10,132,255,.26);
    --glass-tint-2: rgba(10,132,255,.36);
    --bad-on-fill: #FF8A84;
    --ok-on-fill: #5CE682;
    --warn-on-fill: #FFC259;
    --accent-on-fill: #8AC6FF;
    --wallpaper:
      radial-gradient(1180px 760px at 8% -14%, rgba(10,132,255,.34), transparent 60%),
      radial-gradient(980px 640px at 104% -6%, rgba(94,92,230,.26), transparent 56%),
      radial-gradient(900px 720px at 62% 114%, rgba(90,200,250,.16), transparent 58%);
    --sidebar: rgba(22,22,24,.55);
    --bar: rgba(28,28,30,.60);
  }
}

/* «Уменьшить прозрачность»: стекло становится плотным, блик гаснет, подложка
   убирается. Форма и расположение не меняются — меняется только материал. */
@media (prefers-reduced-transparency: reduce) {
  :root {
    --glass: #FFFFFF; --glass-strong: #FFFFFF; --glass-thin: #F7F7FA;
    --glass-blur: none; --glass-blur-lg: none;
    --glass-spec: none;
    --glass-ring: 0 0 0 1px rgba(60,60,67,.16);
    --wallpaper: none;
    --sidebar: #F2F2F7; --bar: #F9F9F9;
  }
  [data-theme="dark"] {
    --glass: #1C1C1E; --glass-strong: #26262A; --glass-thin: #1C1C1E;
    --glass-spec: none;
    --glass-ring: 0 0 0 1px rgba(255,255,255,.14);
    --wallpaper: none;
    --sidebar: #161618; --bar: #1C1C1E;
  }
}