/* Общий стиль splify2.github.io: главная, документация и выпуски.
   Цвета, шрифты, радиусы, отступы и тени — токены Andromeda (--an-*), дизайн-системы пульта
   splify2: /assets/andromeda/styles.css, его кладёт build.py из splify2/ui/andromeda. Своей палитры
   здесь нет — только роли текста сайта, выведенные из токенов там, где токен как цвет текста не
   проходит контраст 4,5:1 (акцент на белом — 4,2:1, подпись на странице — 4,2:1).
   Тёмная тема — [data-theme="dark"] и класс dark на <html>, как у Andromeda (assets/theme.js). */
:root {
  color-scheme: light;
  /* Страница — на подложке стекла (.an-backdrop): она темнее страницы пульта и с пятнами акцента,
     и стекло над пятнами светлеет не везде. Поэтому роли текста — на шаг контрастнее токенов:
     ссылки — --an-accent-press, притемнённый к тексту; подпись — --an-text-secondary, притемнённый
     так же (замер cc.py — не ниже 4,5:1 над любым пятном). */
  --link: color-mix(in srgb, var(--an-accent-press) 78%, var(--an-text));
  --muted: color-mix(in srgb, var(--an-text-secondary) 68%, var(--an-text));
  /* Стекло для чтения (текст документации): плотнее --an-glass-surface — 72 % карточки. */
  --glass-read: color-mix(in srgb, var(--an-surface-card) 72%, transparent);
  /* Кнопка с акцентом: белый на --an-accent — 4,2:1, на --an-accent-press — 6,6:1. */
  --btn-accent: var(--an-accent-press);
  --btn-accent-hover: color-mix(in srgb, var(--an-accent-press) 88%, #000);
  --code-bg: var(--an-surface-field);
  /* Метки (версия, тег проекта) на стекле — на сплошной карточке: оттенок -soft поверх пятен
     подложки иначе плывёт по контрасту. */
  --chip-accent: linear-gradient(var(--an-accent-soft), var(--an-accent-soft)) var(--an-surface-card);
  --chip-warn: linear-gradient(var(--an-warn-soft), var(--an-warn-soft)) var(--an-surface-card);
  --top-h: 60px;
}
[data-theme="dark"], .dark {
  color-scheme: dark;
  /* Акцент на тёмном стекле — ниже 4,5:1; осветлённый наполовину — выше 6:1. */
  --link: color-mix(in srgb, var(--an-accent) 55%, #fff);
  --muted: var(--an-text-secondary);
  --btn-accent-hover: color-mix(in srgb, var(--an-accent-press) 88%, #fff);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--an-surface-page); color: var(--an-text);
  font: var(--an-weight-regular) 16px/1.65 var(--an-font-sans); -webkit-font-smoothing: antialiased;
  transition: var(--an-transition-theme); }
b, strong, th { font-weight: var(--an-weight-semibold); }
h1, h2, h3, h4, h5, h6 { font-weight: var(--an-weight-semibold); }
a { color: var(--link); text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: 3px; }
:focus-visible { outline: 2px solid var(--an-focus-ring); outline-offset: 2px; }
img { max-width: 100%; }
code { font: .88em/1.5 var(--an-font-mono); background: var(--code-bg); padding: .1em .4em; border-radius: var(--an-radius-badge); }
pre { background: var(--code-bg); border: 1px solid var(--an-border); border-radius: var(--an-radius-block);
  padding: var(--an-space-7) var(--an-space-8); overflow-x: auto; font: 13.5px/1.65 var(--an-font-mono); white-space: pre; }
pre code { background: none; padding: 0; font-size: inherit; line-height: inherit; }
/* JetBrains Mono сливает «-<», «>-», «->» в стрелки (calt): в командах вида steer-core-<версия> это
   искажает текст, который копируют в терминал. Шорткат font эту настройку не сбрасывает. */
code, pre, kbd, samp, .ver, a.file, .copy { font-feature-settings: "calt" 0, "liga" 0; }
/* ---- подложка: .an-backdrop Andromeda на <body> по всей длине страницы ----
   Пятна .an-backdrop растянуты на элемент: на длинной странице это три пятна на весь документ, и
   под карточками ниже первого экрана размывать нечего. Здесь те же пятна (--an-glass-spot-*) на
   базе --an-glass-base — плиткой 2400 px по вертикали, по две группы на плитку; каждое пятно гаснет
   внутри плитки, швов нет. Цвет базы — из самой .an-backdrop; prefers-reduced-transparency стекло
   не выключает (как и в Andromeda, ui/andromeda/tokens/glass.css). */
body.an-backdrop {
  background-image:
    radial-gradient(ellipse 70% 15% at 90% 12%, var(--an-glass-spot-1), transparent 72%),
    radial-gradient(ellipse 55% 14% at 48% 27%, var(--an-glass-spot-3), transparent 72%),
    radial-gradient(ellipse 60% 15% at 5% 40%, var(--an-glass-spot-2), transparent 72%),
    radial-gradient(ellipse 70% 15% at 10% 62%, var(--an-glass-spot-1), transparent 72%),
    radial-gradient(ellipse 55% 14% at 55% 76%, var(--an-glass-spot-3), transparent 72%),
    radial-gradient(ellipse 60% 15% at 94% 88%, var(--an-glass-spot-2), transparent 72%);
  background-size: 100% 2400px; background-repeat: repeat-y;
}
.wrap { max-width: 1160px; margin: 0 auto; padding: 0 var(--an-space-8); }

/* ---- шапка: стекло хрома Andromeda (класс an-glass-chrome в разметке) ---- */
.top { position: sticky; top: 0; z-index: 20; border-style: solid; border-width: 0 0 1px; }
.top .wrap { display: flex; align-items: center; gap: var(--an-space-8); height: var(--top-h); }
.brand { display: flex; align-items: center; gap: var(--an-space-5); color: var(--an-text); font-weight: var(--an-weight-semibold);
  font-size: 18px; letter-spacing: var(--an-tracking-title); }
.brand:hover { text-decoration: none; }
.brand img { width: 30px; height: 30px; }
.top nav { margin-left: auto; display: flex; align-items: center; gap: var(--an-space-2); }
.top nav a { color: var(--muted); padding: var(--an-space-4) var(--an-space-6); border-radius: var(--an-radius-control); font-size: 15px;
  font-weight: var(--an-weight-medium); transition: var(--an-transition-hover); }
.top nav a:hover, .top nav a.on { color: var(--an-text); background: var(--an-accent-soft); text-decoration: none; }
.gh { display: inline-flex; align-items: center; gap: var(--an-space-3); }
.gh svg { width: 18px; height: 18px; fill: currentColor; }
.theme { flex: none; width: var(--an-size-icon-button); height: var(--an-size-icon-button); display: grid; place-items: center; padding: 0;
  border: 1px solid var(--an-border); border-radius: var(--an-radius-control); background: transparent; color: var(--muted); cursor: pointer;
  transition: var(--an-transition-hover); }
.theme:hover { color: var(--an-text); background: var(--an-accent-soft); }
.theme svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.theme .sun, .dark .theme .moon { display: none; }
.dark .theme .sun { display: block; }
@media (max-width: 680px) { .top nav a.opt { display: none; } .top nav a { padding: var(--an-space-4) var(--an-space-5); } }
/* Узкий телефон: GitHub — в подвале, в шапке остаются разделы и тема. */
@media (max-width: 420px) { .top .wrap { gap: var(--an-space-4); } .top nav { gap: 0; } .top nav a { padding: var(--an-space-4) var(--an-space-4); } .top nav a.gh { display: none; } }

/* ---- кнопки ---- */
.btn { display: inline-flex; align-items: center; gap: var(--an-gap-inline); min-height: var(--an-size-touch); padding: var(--an-space-5) var(--an-space-9);
  border-radius: var(--an-radius-control); font-weight: var(--an-weight-semibold); border: 1px solid var(--an-border); color: var(--an-text);
  background: var(--an-surface-card); transition: var(--an-transition-hover), box-shadow var(--an-dur-hover) var(--an-ease); }
.btn:hover { text-decoration: none; transform: translateY(-1px); border-color: var(--an-accent-line); }
.btn.primary { background: var(--btn-accent); color: var(--an-text-on-accent); border-color: transparent; }
.btn.primary:hover { background: var(--btn-accent-hover); box-shadow: var(--an-shadow-hover); }

/* ---- подвал ---- */
footer.foot { border-style: solid; border-width: 1px 0 0; padding: var(--an-space-12) 0 44px; color: var(--muted); font-size: 15px; }
footer.foot .wrap { display: flex; flex-wrap: wrap; gap: var(--an-space-8) var(--an-space-12); justify-content: space-between; align-items: center; }
footer.foot nav { display: flex; flex-wrap: wrap; gap: 18px; }
footer.foot a { color: var(--muted); }
footer.foot a:hover { color: var(--an-text); }

/* ---- подсветка кода (pygments, класс hl): цвета состояний Andromeda, контраст ≥ 4,5:1 на --code-bg ---- */
.hl .c, .hl .c1, .hl .cm, .hl .ch { color: var(--muted); font-style: italic; }
.hl .k, .hl .kd, .hl .kn, .hl .nt { color: var(--link); }
.hl .s, .hl .s1, .hl .s2, .hl .sh { color: var(--hl-str, var(--an-success-ink)); }
.hl .m, .hl .mi, .hl .mf, .hl .kc { color: var(--an-warn-ink); }
.hl .nb, .hl .nf, .hl .na { color: var(--an-text); font-weight: var(--an-weight-medium); }
/* --an-success-ink на поле кода в светлой теме — 3,7:1: строки темнее на треть. */
:root:not(.dark) { --hl-str: color-mix(in srgb, var(--an-success-ink) 62%, var(--an-text)); }
@media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }