/*
 * Стили, которые не выражаются через theme.json.
 * Всё, что можно задать токенами (цвета, шрифты, отступы, кнопки), живёт там —
 * сюда попадает только поведение и то, что блоки не описывают.
 */

/* Псевдонимы токенов макета: значения живут в theme.json, CSS макета
   вставляется дословно. Ни одного цвета в двух местах. Шапка/подвал
   (chrome.css) и будущие секции страниц опираются на эти имена. */
:root{
	--ink:var(--wp--preset--color--ink);
	--ink-2:var(--wp--preset--color--ink-2);
	--ink-3:var(--wp--preset--color--ink-3);
	--gold:var(--wp--preset--color--gold);
	--gold-lt:var(--wp--preset--color--gold-lt);
	--gold-pale:var(--wp--preset--color--gold-pale);
	--bone:var(--wp--preset--color--bone);
	--slate:var(--wp--preset--color--slate);
	--line:var(--wp--custom--line);
	--line-soft:var(--wp--custom--line-soft);
	--shell:var(--wp--custom--shell);
}
.shell{ width:var(--shell); margin-inline:auto; }

/* Плавная прокрутка нужна для якорей, но она же ломает замеры и раздражает
   при prefers-reduced-motion, поэтому включаем выборочно. */
@media (prefers-reduced-motion: no-preference) {
	html { scroll-behavior: smooth; }
}

/* scroll-padding-top под фиксированную шапку живёт в chrome.css —
   там же, где объявлены --ita-header-h и --ita-header-top. */

/* Широкие блоки (таблицы, код, диаграммы) прокручиваются внутри себя,
   страница по горизонтали не едет. */
.wp-block-table,
.wp-block-preformatted { overflow-x: auto; }

img, video { max-width: 100%; height: auto; }

:where(a, button, input, select, textarea):focus-visible {
	outline: 2px solid var(--wp--preset--color--gold);
	outline-offset: 3px;
}