/* ==========================================================================
   ШАБЛОН abacus — банковский скелет сети (сайт 7k0049.lol, hue 13 + триада 133)
   --------------------------------------------------------------------------
   ПАРАДИГМА
   Счёты. Страница — рама счётов, поставленная вертикально:
     · РАМА       — .abpost--l и .abpost--r, две фиксированные боковые стойки во
                    всю высоту экрана, и перекладины .abcross сверху и снизу.
                    Контент живёт между стойками, поэтому у страницы всегда есть
                    физическая граница слева и справа;
     · СПИЦА      — .abrod, горизонтальная проволока. Идёт ЧЕРЕЗ ВСЮ ШИРИНУ
                    колонки от стойки до стойки, на ней сидят костяшки. Спица —
                    и разделитель секций, и носитель KPI, и шкала ступеней;
     · КОСТЯШКА   — .abbead, приплюснутая линза с бликом и отверстием под спицу.
                    Единственный маркер шаблона: заменяет буллеты списков
                    (ul.abcount), номера секций (.abidx__beads) и шаги шкал.
                    .abbead--x — костяшка второго акцента, .abbead--off — не
                    сдвинутая костяшка (неактивный шаг);
     · РЯД        — .abwire, секция страницы. Это ряд счётов: слева разрядная
                    колонка .abidx (подпись разряда + номер секции костяшками),
                    справа .abwire__body с контентом. Над рядом лежит спица;
     · РАЗРЯДНАЯ СЕТКА — .abgrid, фиксированный слой вертикальных линий шагом
                    88px под всем контентом, и засечки .abpost__mark на левой
                    стойке. Сетка читается как разряды, по которым идёт счёт;
     · БЛАНК      — .abnote, единственный СВЕТЛЫЙ блок шаблона (заметка автора),
                    со своей парой цветов.
   Дерево рамы, латунь спиц и стекло костяшек нарисованы только градиентами и
   тенями. Растровых картинок в шаблоне нет и добавлять их не нужно.

   NAMESPACE
   Все классы начинаются на .ab — .abgrid, .abpost, .abcross, .abcase, .abshell,
   .abhead, .ablogo, .abnav, .abtray, .abkick, .abh, .ablead, .abcta, .abbtn,
   .abkpi, .abrod, .abbead, .abwire, .abidx, .abcount, .abcards, .abcard,
   .abscroll, .abtab, .abtiers, .abtier, .abrevs, .abrev, .abfaq, .abq, .abnote,
   .abfoot, .abchip, .abmut, .abem, .abem2, .abnum, .abage.
   Вне .ab* объявляются только base-правила html/body/img/svg — пересечений с
   другими шаблонами банка нет.

   ПОРЯДОК БЛОКОВ (см. abacus.sample.html)
   .abgrid → .abpost--l → .abpost--r → .abcase[ .abcross--t > .abhead →
   .abtray (H1 + лид + 2 CTA + .abkpi на спицах) → main.abstack (.abwire × N,
   у каждого ряда своя спица сверху) → .abnote (E-E-A-T) → .abcross--b >
   .abfoot (18+) ].
   Ряды идут ПОДРЯД внутри .abstack: спица рисуется через .abwire::before, и
   посторонний блок между рядами рвёт линию счёт.

   АДАПТИВ
   ≤1080px — стойки сужаются до 14px, засечки разрядов снимаются; ≤900px —
   .abwire__in в одну колонку, разрядная колонка ложится горизонтальной строкой,
   сетки в 2 колонки; ≤620px — всё в колонку, кнопки на всю ширину.
   Горизонтального скролла у страницы нет: широкие таблицы лежат в
   .abscroll{overflow-x:auto}, у всех грид-колонок minmax(0,1fr), у ячеек
   min-width:0 — иначе min-width таблицы протекает в грид-трек и на 390px
   появляется горизонтальный скролл.

   ЛОВУШКИ ПЕРЕКРАСКИ
   1. Весь цвет собран из --ab-h и --ab-h2 через hsl(var(--ab-h) …) прямо в
      объявлениях, поэтому смена двух чисел в блоке @palette перекрашивает
      шаблон целиком. Светлота подобрана под ТЁМНУЮ раму: под светлую тему
      руками правятся --ab-ink, --ab-mut и inset-тени .abwire__body.
   2. Цвет надписи на кнопке задан селектором .abbtn.abbtn--p (0-2-0), а не
      одиночным классом. Правило вида .abshell a{color:…} имеет 0-1-1 и одиночный
      .abbtn--p перебивает — надпись CTA уезжает в цвет ссылки и пропадает на
      заливке. Новые правила для кнопок пишите тоже парой классов, не !important.
   3. Тач-цели. min-height:44px стоит и в базовом правиле, и внутри медиазапроса
      ≤620px — у .ablogo, .abnav__l, .abbtn, .abchip, .abfoot__l и summary.abq__s.
      Логотип шапки и ссылки подвала — систематические нарушители: без inline-flex
      они схлопываются до высоты строки (16-18px). Инлайновых ссылок в прозе
      шаблон не предполагает: любая новая ссылка обязана получить класс с 44px.
   4. Спицы (--ab-wire, --ab-wire-d) — МЕТАЛЛ. Насыщенность выше 12% превращает
      проволоку в акцентную полосу, и ряд читается как подчёркнутый заголовок,
      а не как счёты. Дерево рамы (--ab-wood, --ab-wood2) держится на --ab-h с
      насыщенностью 14-22%.
   5. .abnote — единственный светлый блок. Его текст, заголовок и подпись имеют
      явную пару --ab-slip / --ab-slip-ink. Наследование от body даёт светлый
      текст на светлой бумаге. То же у .abrev: карточка отзыва светлее фона.
   6. Костяшка .abbead — три слоя (блик, тело, отверстие) плюс тень. Тело берёт
      --ab-acc / --ab-acc-d, вариант --x берёт --ab-acc2 / --ab-acc2-d. Второй
      акцент обязан отличаться от первого по светлоте минимум на 8%, иначе на
      спице оба ряда костяшек сливаются в одну полосу.
   7. Заливка акцента светлая, текст на ней ТЁМНЫЙ (--ab-on-acc). Градиент
      .abbtn--p задан двумя явными hsl прямо в правиле, и обе точки держатся
      выше L=53%: по самому тёмному пикселю подложки и меряется контраст
      надписи. Уводите нижнюю точку к --ab-acc-d (L=36%) — и контраст кнопки
      падает с 4.7 до 2.5, хотя на глаз кнопка выглядит нормально. При тёмном
      акценте (L ниже 46%) возвращайте светлый текст.
   8. У КАЖДОГО font-family обязателен фолбэк-стек. Голое имя вебшрифта роняет
      страницу в Times New Roman и ломает вертикальную ритмику.
   9. Лёгкая антиква в теле требует 19-20px и веса 500-600: на 16-17px тонкие
      штрихи выцветают и контраст текста падает ниже нормы.

   ГАРНИТУРЫ САЙТА
   Noto Serif (заголовки) + Cormorant (текст) — обе с кириллицей, у обеих
   фолбэк-стек на Georgia. Палитра: --ab-h 13 (рама, костяшка первого ряда),
   --ab-h2 133 (триада +120, костяшка второго ряда и акценты).
   ========================================================================== */

/* @palette:start — перекраска сайта = правка двух чисел ниже (нейтральный банк) */
:root{
  --ab-h:13;          /* рама, фон, спицы: базовый hue сайта */
  --ab-h2:133;          /* костяшки второго ряда, акценты: схема из набора */
}
/* @palette:end */

:root{
  --ab-bg:hsl(var(--ab-h) 24% 7%);
  --ab-bg2:hsl(var(--ab-h) 22% 10%);
  --ab-panel:hsl(var(--ab-h) 20% 13%);
  --ab-panel2:hsl(var(--ab-h) 18% 17%);
  --ab-wood:hsl(var(--ab-h) 18% 19%);
  --ab-wood2:hsl(var(--ab-h) 16% 26%);
  --ab-line:hsl(var(--ab-h) 14% 28%);

  /* металл спиц: насыщенность держать ниже 12 процентов — ловушка 4 */
  --ab-wire:hsl(var(--ab-h) 10% 62%);
  --ab-wire-d:hsl(var(--ab-h) 10% 34%);

  --ab-ink:hsl(var(--ab-h2) 18% 94%);
  --ab-mut:hsl(var(--ab-h) 10% 72%);

  --ab-acc:hsl(var(--ab-h) 78% 58%);
  --ab-acc-d:hsl(var(--ab-h) 62% 36%);
  --ab-acc2:hsl(var(--ab-h2) 62% 50%);
  --ab-acc2-d:hsl(var(--ab-h2) 58% 30%);
  --ab-on-acc:hsl(var(--ab-h) 42% 9%);

  /* бумага: заметка автора и отзывы — своя пара цветов, ловушка 5 */
  --ab-slip:hsl(var(--ab-h2) 26% 91%);
  --ab-slip2:hsl(var(--ab-h2) 22% 84%);
  --ab-slip-ink:hsl(var(--ab-h) 32% 13%);
  --ab-slip-mut:hsl(var(--ab-h) 16% 34%);

  --ab-fd:"Noto Serif",Georgia,"Times New Roman",serif;
  --ab-fb:"Cormorant",Georgia,"Times New Roman",serif;

  --ab-post:26px;
  --ab-rad:3px;
  --ab-gut:clamp(14px,3vw,30px);
  --ab-max:1180px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--ab-bg);
  color:var(--ab-ink);
  font-family:var(--ab-fb);
  font-size:19px;
  font-weight:500;
  line-height:1.64;
  overflow-x:hidden;
}
img,svg{max-width:100%;height:auto}

/* --- разрядная сетка: вертикальные линии под всем контентом ---------------- */
.abgrid{
  position:fixed;inset:0;z-index:0;pointer-events:none;
  background:
    repeating-linear-gradient(90deg,
      hsl(var(--ab-h) 30% 60% / .07) 0 1px, transparent 1px 88px),
    radial-gradient(120% 60% at 50% 0%, hsl(var(--ab-h) 40% 22% / .55), transparent 70%),
    var(--ab-bg);
}

/* --- стойки рамы ---------------------------------------------------------- */
.abpost{
  position:fixed;top:0;bottom:0;width:var(--ab-post);z-index:3;pointer-events:none;
  background:
    linear-gradient(90deg, hsl(var(--ab-h) 20% 8%), var(--ab-wood) 38%, var(--ab-wood2) 62%, hsl(var(--ab-h) 20% 9%));
  box-shadow:inset 0 0 0 1px hsl(var(--ab-h) 20% 5% / .8);
}
.abpost--l{left:0}
.abpost--r{right:0}
.abpost__mark{
  position:absolute;left:0;right:0;
  font-family:var(--ab-fd);font-size:9px;letter-spacing:.06em;
  color:var(--ab-mut);opacity:.72;text-align:center;
}
.abpost__mark::before{
  content:"";position:absolute;left:2px;right:2px;top:-7px;height:1px;
  background:var(--ab-wire-d);
}

/* --- каркас страницы ------------------------------------------------------ */
.abcase{position:relative;z-index:1;padding:0 calc(var(--ab-post) + 6px)}
.abshell{width:100%;max-width:var(--ab-max);margin:0 auto;padding:0 var(--ab-gut);min-width:0}
.abcross{position:relative;background:linear-gradient(180deg,var(--ab-wood2),var(--ab-wood));border-block:1px solid var(--ab-line)}
.abcross--t{border-top:0}
.abcross--b{margin-top:44px}

/* --- шапка ---------------------------------------------------------------- */
.abhead{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;padding:9px 0}
.ablogo{
  display:inline-flex;align-items:center;gap:10px;min-height:44px;
  text-decoration:none;color:var(--ab-ink);
  font-family:var(--ab-fd);font-size:20px;font-weight:700;letter-spacing:.01em;
}
.ablogo__t{display:flex;flex-direction:column;line-height:1.12}
.ablogo__s{font-family:var(--ab-fb);font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ab-mut)}
.abnav{display:flex;flex-wrap:wrap;gap:2px 16px}
.abnav__l{
  display:inline-flex;align-items:center;min-height:44px;
  color:var(--ab-mut);text-decoration:none;font-size:15px;letter-spacing:.02em;
}
.abnav__l:hover{color:var(--ab-ink)}

/* --- костяшка ------------------------------------------------------------- */
.abbead{
  --s:17px;
  position:relative;display:inline-block;flex:none;
  width:var(--s);height:calc(var(--s) * .66);
  border-radius:50%;
  background:
    radial-gradient(60% 46% at 42% 26%, hsl(var(--ab-h) 92% 84% / .6), transparent 70%),
    linear-gradient(180deg, var(--ab-acc), var(--ab-acc-d));
  box-shadow:0 1px 2px hsl(0 0% 0% / .5), inset 0 -1px 1px hsl(0 0% 0% / .35);
}
.abbead::after{
  content:"";position:absolute;left:50%;top:50%;
  width:calc(var(--s) * .18);height:calc(var(--s) * .18);
  transform:translate(-50%,-50%);border-radius:50%;
  background:hsl(var(--ab-h) 40% 6% / .78);
}
.abbead--x{
  background:
    radial-gradient(60% 46% at 42% 26%, hsl(var(--ab-h2) 92% 84% / .6), transparent 70%),
    linear-gradient(180deg, var(--ab-acc2), var(--ab-acc2-d));
}
.abbead--off{
  background:
    radial-gradient(60% 46% at 42% 26%, hsl(var(--ab-h) 20% 70% / .4), transparent 70%),
    linear-gradient(180deg, hsl(var(--ab-h) 10% 40%), hsl(var(--ab-h) 12% 24%));
}
.abbead--lg{--s:23px}
.abbead--sm{--s:13px}

/* --- спица ---------------------------------------------------------------- */
.abrod{position:relative;display:flex;align-items:center;gap:4px;min-height:26px}
.abrod::before{
  content:"";position:absolute;left:0;right:0;top:50%;height:2px;margin-top:-1px;
  background:linear-gradient(90deg,var(--ab-wire-d),var(--ab-wire) 10%,var(--ab-wire) 90%,var(--ab-wire-d));
  border-radius:2px;
}
.abrod > *{position:relative;z-index:1}
.abrod--r{justify-content:flex-end}
.abrod--c{justify-content:center}
.abrod--split{justify-content:space-between}

/* --- герой ---------------------------------------------------------------- */
.abtray{padding:34px 0 8px}
.abkick{
  margin:0 0 12px;font-family:var(--ab-fd);font-size:12px;font-weight:700;
  letter-spacing:.2em;text-transform:uppercase;color:var(--ab-acc2);
}
.abtray__grid{display:grid;grid-template-columns:minmax(0,1.42fr) minmax(0,1fr);gap:clamp(18px,3vw,40px);align-items:start}
.abh{font-family:var(--ab-fd);font-weight:700;line-height:1.16;letter-spacing:-.01em;margin:0 0 14px}
h1.abh{font-size:clamp(29px,4.3vw,50px)}
h2.abh{font-size:clamp(23px,2.8vw,33px);margin-bottom:10px}
h3.abh{font-size:clamp(18px,1.9vw,21px);margin-bottom:8px}
.ablead{font-size:clamp(17px,1.5vw,21px);color:var(--ab-mut);margin:0 0 20px;max-width:66ch}
.abmut{color:var(--ab-mut)}
.abem{color:var(--ab-acc);font-weight:700}
.abem2{color:var(--ab-acc2);font-weight:700}
.abnum{font-family:var(--ab-fd);font-weight:700;font-variant-numeric:tabular-nums}

/* --- кнопки: цвет надписи только парой классов, ловушка 2 ------------------ */
.abcta{display:flex;flex-wrap:wrap;gap:12px;margin:0 0 22px}
.abbtn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  min-height:52px;padding:12px 26px;border-radius:var(--ab-rad);
  font-family:var(--ab-fd);font-size:17px;font-weight:700;letter-spacing:.01em;
  text-decoration:none;border:1px solid transparent;
}
.abbtn.abbtn--p{
  /* обе точки градиента держать выше L=50%: нижняя точка — самый тёмный пиксель
     подложки, по нему и меряется контраст надписи (ловушка 7) */
  background:linear-gradient(180deg, hsl(var(--ab-h) 82% 63%), hsl(var(--ab-h) 76% 53%));
  color:var(--ab-on-acc);
  border-color:hsl(var(--ab-h) 80% 74%);
  box-shadow:0 2px 0 hsl(var(--ab-h) 60% 24%), inset 0 1px 0 hsl(var(--ab-h) 90% 84% / .55);
}
.abbtn.abbtn--s{
  background:var(--ab-panel);
  color:var(--ab-ink);
  border-color:var(--ab-line);
}
.abbtn.abbtn--s:hover{border-color:var(--ab-wire)}

/* --- KPI на спицах -------------------------------------------------------- */
.abkpi{list-style:none;margin:22px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2px 18px}
.abkpi__i{min-width:0;padding:12px 0 10px;border-top:1px solid var(--ab-line)}
.abkpi__v{display:block;font-family:var(--ab-fd);font-size:clamp(21px,2.3vw,28px);font-weight:700;color:var(--ab-ink);line-height:1.1}
.abkpi__l{display:block;font-size:14px;color:var(--ab-mut);margin:2px 0 8px}

/* --- панель героя (сводка) ------------------------------------------------ */
.abfacts{background:var(--ab-panel);border:1px solid var(--ab-line);border-radius:var(--ab-rad);padding:18px 18px 14px;min-width:0}
.abfacts__t{margin:0 0 12px;font-family:var(--ab-fd);font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ab-mut)}
.abfacts dl{margin:0;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px 12px;font-size:15px}
.abfacts dt{color:var(--ab-mut);min-width:0}
.abfacts dd{margin:0;text-align:right;font-family:var(--ab-fd);font-weight:700}

/* --- ряд счёт = секция ---------------------------------------------------- */
.abstack{display:block}
.abwire{position:relative;padding:30px 0 8px}
/* спица ряда идёт от стойки до стойки: full-bleed через 100vw.
   Держится на body{overflow-x:hidden} — без него 100vw даст горизонтальный
   скролл на ширину полосы прокрутки. */
.abwire::before{
  content:"";position:absolute;top:0;height:2px;
  left:50%;margin-left:-50vw;width:100vw;
  background:linear-gradient(90deg,var(--ab-wire-d) 0,var(--ab-wire) 7%,var(--ab-wire) 93%,var(--ab-wire-d) 100%);
}
.abwire__in{display:grid;grid-template-columns:126px minmax(0,1fr);gap:clamp(14px,2.4vw,32px);align-items:start}
.abwire__body{min-width:0}
.abwire__body p{margin:0 0 14px;max-width:74ch}

.abidx{min-width:0;padding-top:2px}
.abidx__ord{display:block;font-family:var(--ab-fd);font-size:26px;font-weight:700;color:var(--ab-wire);line-height:1}
.abidx__cap{display:block;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ab-mut);margin:4px 0 10px}
.abidx__beads{display:flex;align-items:center;gap:3px;position:relative;min-height:22px}
.abidx__beads::before{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:var(--ab-wire-d)}
.abidx__beads > *{position:relative;z-index:1}

/* --- списки с костяшками вместо буллетов ---------------------------------- */
.abcount{list-style:none;margin:0 0 16px;padding:0}
.abcount > li{position:relative;padding:0 0 0 30px;margin:0 0 9px;min-width:0}
.abcount > li::before{
  content:"";position:absolute;left:0;top:.62em;width:17px;height:11px;border-radius:50%;
  background:
    radial-gradient(60% 46% at 42% 26%, hsl(var(--ab-h) 92% 84% / .6), transparent 70%),
    linear-gradient(180deg, var(--ab-acc), var(--ab-acc-d));
  box-shadow:0 1px 2px hsl(0 0% 0% / .5);
}
.abcount > li::after{
  content:"";position:absolute;left:0;top:calc(.62em + 5px);width:30px;height:1px;background:var(--ab-wire-d);
}
.abcount--x > li::before{background:
    radial-gradient(60% 46% at 42% 26%, hsl(var(--ab-h2) 92% 84% / .6), transparent 70%),
    linear-gradient(180deg, var(--ab-acc2), var(--ab-acc2-d));}

/* --- карточки ------------------------------------------------------------- */
.abcards{list-style:none;margin:0 0 18px;padding:0;display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr))}
.abcard{min-width:0;background:var(--ab-panel);border:1px solid var(--ab-line);border-radius:var(--ab-rad);padding:15px 16px;position:relative}
.abcard__t{display:block;font-family:var(--ab-fd);font-size:17px;font-weight:700;margin:0 0 6px}
.abcard__m{display:block;font-size:14px;color:var(--ab-mut);margin:0 0 8px}
.abcard p{margin:0;font-size:16px}
.abcard .abrod{margin:10px 0 0}

/* --- таблицы -------------------------------------------------------------- */
.abscroll{overflow-x:auto;margin:0 0 18px;border:1px solid var(--ab-line);border-radius:var(--ab-rad);min-width:0}
.abtab{border-collapse:collapse;width:100%;min-width:520px;font-size:16px}
.abtab caption{caption-side:top;text-align:left;padding:10px 14px;font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--ab-mut)}
.abtab th,.abtab td{padding:11px 14px;text-align:left;border-bottom:1px solid var(--ab-line)}
.abtab thead th{background:var(--ab-panel2);font-family:var(--ab-fd);font-size:14px;letter-spacing:.04em;color:var(--ab-ink)}
.abtab tbody tr:nth-child(2n){background:hsl(var(--ab-h) 20% 12% / .6)}
.abtab tbody tr:last-child td{border-bottom:0}

/* --- ступени лояльности как ряды костяшек --------------------------------- */
.abtiers{list-style:none;margin:0 0 18px;padding:0;display:grid;gap:0}
.abtier{display:grid;grid-template-columns:minmax(0,150px) minmax(0,1fr) minmax(0,190px);gap:10px 16px;align-items:center;padding:12px 0;border-bottom:1px solid var(--ab-line)}
.abtier:last-child{border-bottom:0}
.abtier__n{font-family:var(--ab-fd);font-size:17px;font-weight:700;min-width:0}
.abtier__v{font-size:15px;color:var(--ab-mut);min-width:0}
.abtier .abrod{min-width:0}

/* --- отзывы --------------------------------------------------------------- */
.abrevs{list-style:none;margin:0 0 18px;padding:0;display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr))}
.abrev{min-width:0;background:var(--ab-slip2);color:var(--ab-slip-ink);border-radius:var(--ab-rad);padding:15px 16px;box-shadow:0 2px 0 hsl(var(--ab-h) 30% 6% / .5)}
.abrev p{margin:0 0 10px;font-size:16px}
.abrev__c{display:block;font-family:var(--ab-fd);font-size:14px;font-weight:700;color:var(--ab-slip-mut)}

/* --- FAQ ------------------------------------------------------------------ */
.abfaq{margin:0 0 10px}
.abq{border-top:1px solid var(--ab-line)}
.abq:last-of-type{border-bottom:1px solid var(--ab-line)}
.abq__s{
  display:flex;align-items:center;gap:12px;min-height:52px;padding:10px 0;
  cursor:pointer;list-style:none;font-family:var(--ab-fd);font-size:17px;font-weight:700;
}
.abq__s::-webkit-details-marker{display:none}
.abq__s::before{
  content:"";flex:none;width:17px;height:11px;border-radius:50%;
  background:
    radial-gradient(60% 46% at 42% 26%, hsl(var(--ab-h) 92% 84% / .6), transparent 70%),
    linear-gradient(180deg, var(--ab-acc), var(--ab-acc-d));
}
.abq[open] .abq__s::before{background:
    radial-gradient(60% 46% at 42% 26%, hsl(var(--ab-h2) 92% 84% / .6), transparent 70%),
    linear-gradient(180deg, var(--ab-acc2), var(--ab-acc2-d));}
.abq__a{margin:0 0 14px;padding-left:29px;color:var(--ab-mut);font-size:17px;max-width:74ch}

/* --- чипы-якоря ----------------------------------------------------------- */
.abchips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px;padding:0;list-style:none}
.abchip{
  display:inline-flex;align-items:center;min-height:44px;padding:6px 15px;
  border:1px solid var(--ab-line);border-radius:999px;background:var(--ab-panel);
  color:var(--ab-ink);text-decoration:none;font-size:15px;
}
.abchip:hover{border-color:var(--ab-wire)}

/* --- заметка автора: единственный светлый блок, ловушка 5 ------------------ */
.abnote{
  position:relative;margin:34px 0 0;padding:22px clamp(16px,3vw,30px);
  background:linear-gradient(180deg,var(--ab-slip),var(--ab-slip2));
  color:var(--ab-slip-ink);border-radius:var(--ab-rad);
  box-shadow:0 3px 0 hsl(var(--ab-h) 30% 6% / .6);
}
.abnote .abh{color:var(--ab-slip-ink)}
.abnote p{margin:0 0 12px;max-width:78ch}
.abnote__sig{display:block;font-family:var(--ab-fd);font-size:15px;font-weight:700;color:var(--ab-slip-mut)}

/* --- подвал --------------------------------------------------------------- */
.abfoot{padding:16px 0 22px;font-size:15px;color:var(--ab-mut)}
.abfoot__nav{display:flex;flex-wrap:wrap;gap:4px 20px;margin:0 0 10px}
.abfoot__l{display:inline-flex;align-items:center;min-height:44px;color:var(--ab-mut);text-decoration:none}
.abfoot__l:hover{color:var(--ab-ink)}
.abfoot p{margin:0 0 8px;max-width:96ch}
.abage{
  display:inline-flex;align-items:center;justify-content:center;min-width:46px;min-height:30px;
  padding:2px 10px;margin-right:9px;border-radius:var(--ab-rad);
  background:var(--ab-acc2);color:var(--ab-on-acc);
  font-family:var(--ab-fd);font-weight:700;font-size:15px;
}

/* --- адаптив -------------------------------------------------------------- */
@media (max-width:1080px){
  :root{--ab-post:14px}
  .abpost__mark{display:none}
}
@media (max-width:900px){
  .abtray__grid{grid-template-columns:minmax(0,1fr)}
  .abwire__in{grid-template-columns:minmax(0,1fr)}
  .abidx{display:flex;align-items:center;gap:12px;padding:0 0 10px}
  .abidx__ord{font-size:20px}
  .abidx__cap{margin:0}
  .abidx__beads{min-width:96px}
  .abkpi{grid-template-columns:repeat(2,minmax(0,1fr))}
  .abtier{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .abtier .abrod{grid-column:1 / -1}
}
@media (max-width:620px){
  body{font-size:18px}
  .abtray{padding-top:22px}
  .abcta{gap:10px}
  .abbtn{width:100%;min-height:52px}
  .ablogo{min-height:44px}
  .abnav__l{min-height:44px}
  .abchip{min-height:44px}
  .abfoot__l{min-height:44px}
  .abq__s{min-height:48px}
  .abtier{grid-template-columns:minmax(0,1fr)}
  .abrevs,.abcards{grid-template-columns:minmax(0,1fr)}
  .abnote{padding:18px 16px}
}