@import "./tokens.css"; /* GoodWink — стили кабинета. Источник правды: cabinet/web/static/styles.css — его отдаёт кабинет. Копия для Claude Design: design-system/src/styles.css (`npm run sync-css` в design-system/, расхождение ловит `npm test`). Оттуда её берёт /design-sync как cssEntry — поэтому макеты в Claude Design выглядят ровно как живой кабинет. Обновлено из Claude Design 24.07.2026 (рефреш: плотность, две темы, таблица данных — липкая шапка, закреплённый первый столбец, сортировка, фильтр по столбцу). Накат пришёл без импорта токенов — первая строка файла добавлена при применении, без неё все var() пустые. NB: не писать в комментариях строку импорта целиком (со скобками и путём): валидатор /design-sync ищет импорты регуляркой по всему файлу, комментарии не вырезает, и упоминание в тексте валит синк как [CSS_IMPORT_MISSING]. Освежено в Claude Design 20.10.2026 (пакет cabinet-refresh, причины правок — его why.md): одна высота у всех контролов (--ctl-h), действия экрана у правого края, каталог и корзина без лишних рамок и переносов, единый маркер сводок, подчёркнутые ссылки в тексте, отмеченная строка таблицы видна, цвет, тень и радиус — только из токенов, контраст текста не ниже 4.5:1 в обеих темах и трёх акцентах, на телефоне — контролы 40px и вкладки шапки крупнее. Разметка и имена классов не менялись. */ *{box-sizing:border-box} /* Нативные части контролов — в цвет темы. Без color-scheme в тёмной теме флажки строк были белыми квадратами, а раскрытый список select и полосы прокрутки — светлыми; без accent-color флажок «Текст сравнивать без учёта регистра» и выбор строк таблицы красились браузерным синим мимо акцента */ :root{color-scheme:dark;accent-color:var(--accent)} [data-theme="light"]{color-scheme:light} /* `hidden` должен побеждать любой display из класса: UA-правило [hidden] слабее селектора по классу, и кнопка `.iconbtn` (display:inline-flex) оставалась видимой, хотя скрипт её прятал — в карточке записи так висело «удалить событие» от прошлого открытого события. */ [hidden]{display:none!important} body{margin:0;background:var(--bg);color:var(--text);font:14px/1.5 var(--font);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility} ::selection{background:var(--accent-soft-2)} a{color:var(--accent);text-decoration:none} a:hover{color:var(--accent-2);text-decoration:underline;text-underline-offset:2px} /* Фокус с клавиатуры — то же кольцо, что у кнопок и полей: у ссылок и сводок
оставалась браузерная обводка мимо обеих тем */ a:focus-visible,summary:focus-visible{outline:none;box-shadow:var(--ring)} /* Ссылка внутри абзаца и плашки подчёркнута всегда: её отличал только цвет, а бирюза рядом с серым --text-2 почти той же яркости (WCAG 1.4.1). Кнопки, вкладки, ссылки «Помощи» и имена каталога — без черты: они и так отдельные элементы; ссылка-код (имя таблицы в .sub) — тоже, её выделяет плашка кода */ :is(p,.msg) a:not(.btn):not(:has(>code)){text-decoration:underline;text-decoration-color:color-mix(in srgb,currentColor 45%,transparent);text-underline-offset:3px} :is(p,.msg) a:not(.btn):hover{text-decoration-color:currentColor} /* ——— шапка ——— */ /* Три якорные зоны: лого | вкладки | тема+имя+выход. Высота — из --bar-h, а не из суммы паддингов: «почти одинаковые» высоты контролов в ряду читаются как элементы из разных мест. Ширину бара держит общее правило `.bar,main` в «каркасе страницы» ниже — иначе шапка и содержимое разъезжаются. Вкладки — `header nav`, а не голый `nav`: с Э7 у «Помощи» свои