/* =============================================================================
   Премиальный скин шагов заявки — база, версия v2 «Signature».
   Спека: docs/specs/2026-09-10-premium-flow-skin-v2-signature.md
          (§2 токены, §3 атмосфера, §4 компоненты, §5.6 главная, §8 мобильный).
   Ограничения и список файлов — §2 и §9 спеки v1 (2026-09-10-premium-flow-skin-design.md),
   они продолжают действовать целиком.
   Эталон вида: tools/gw-premium-flow-demo/reference/mock-signature.html.

   ПРАВИЛА ЭТОГО ФАЙЛА:
   1. Ни одного правила без `body.gw-pf` в селекторе. Без класса скин не существует,
      поэтому даже случайно подключённый файл ничего не ломает (критерий приёмки v1 §11.1).
      Исключение — блок `:root` с объявлениями переменных: объявление само по себе
      ничего не красит, а стенду удобно читать токены из любого узла.
   2. Вендорную разметку только красим. Ничего не прячем и не двигаем из DOM —
      селекторы вендорного JS (§2 спеки v1) обязаны остаться на своих узлах.
   3. Геометрия в ПИКСЕЛЯХ, а не в rem. У темы `html{font-size:0.52vw}` — rem тут
      «резиновый»; макет размечен в CSS-пикселях, поэтому px даёт согласованный масштаб.
   4. `!important` — только там, где тема ставит его сама и перебить иначе нечем;
      каждый такой случай подписан.

   КОНТРАКТ КЛАССОВ (что рисует gw-premium-flow.js, что красит этот файл):

     .gwpf-glow2            второй слой свечения, первый ребёнок body (§3)
     h1.main-title          вендорный заголовок; акцентное слово — span.gwpf-h1-accent
     .gwpf-meta             две строки справа от заголовка («Создана …»)
     ol.gwpf-stepper > li.gwpf-step(.is-done/.is-active)
                              > span.gwpf-step-num + span.gwpf-step-label       (§4.3)
     .gwpf-hero             карточка-герой (класс вешается на ВЕНДОРНЫЙ контейнер) (§4.4)
     img.gwpf-wm            водяной знак внутри героя
     .gwpf-mini             второстепенная карточка (сайдбар, вложенные группы)
     .gwpf-rule > i         разделитель-«правило с ромбом»
     .gwpf-lbl              подпись над значением (§4.5); вендорная подпись внутри
                              .gwpf-amount (span первым ребёнком) красится так же
     .gwpf-status           строка статуса с ромбом (§4.5)
     .gwpf-amount           ВЕНДОРНЫЙ узел суммы + класс длины is-len-s/m/l (§4.6)
     .gwpf-copy             текстовая ссылка копирования (§4.7)
                              > span.gwpf-copy-ico + span.gwpf-copy-text/.gwpf-copy-done
     .gwpf-btn / --ghost / --quiet   кнопки (§4.8)
     .gwpf-net              пилюля сети/банка рядом с подписью реквизита (§4.9)
     .gwpf-addr             адрес/карта моноширинным (§4.9)
     .gwpf-qr               подложка QR (§4.9)
     ol.gwpf-how > li       инструкция в три колонки, номера — CSS-счётчик (§4.10)
     .gwpf-help / .gwpf-trust        карточки сайдбара (§6)
     .gwpf-aside-details             карточка «Детали заявки» в сайдбаре (dl.gwpf-ad-list)
     .gwpf-details(.is-open)         строка-аккордеон «Детали заявки» (§5.3)
     .gwpf-acc(.is-open)             аккордеон условий (§5.1)
     ol.gwpf-timeline > li.gwpf-tl-item(.is-done/.is-active)   лента статусов (§5.4)
     .gwpf-sticky           родной контейнер primary-кнопки, липнет на мобильном (§8)
   ========================================================================== */

/* -----------------------------------------------------------------------------
   §2. Токены v2. Заменяют набор v1 целиком: другой чёрный (тёплый, не #000),
   золото как материал вместо оранжево-бронзового градиента, три ступени золота.
   -------------------------------------------------------------------------- */
:root {
    --gwpf-bg: #070706;                 /* тёплый чёрный: на нём золото не зеленит */
    --gwpf-s1: #0f0e0d;                 /* второстепенная карточка */
    --gwpf-s2: #141312;                 /* выпадающие списки, вложенные подложки */
    --gwpf-card: linear-gradient(180deg, #131211 0%, #0d0c0b 100%);
    /* Плоский цвет середины карточки. Нужен там, где ОДНА поверхность собрана
       из двух вендорных боксов (карточный экран оплаты): у каждого бокса
       градиент начался бы заново, и на шве появилась бы ступенька. */
    --gwpf-card-flat: #100f0e;

    --gwpf-gold: #d6a55a;
    --gwpf-gold-2: #e9c98a;
    --gwpf-gold-3: #f4e2bd;
    --gwpf-gold-dim: rgba(214, 165, 90, .55);

    --gwpf-line: rgba(255, 255, 255, .07);
    /* .30, не .22 — правка 14.09.2026 (читаемость на солнце): рамки карточек
       на .22 на ярком экране исчезали, и карточка сливалась с фоном. */
    --gwpf-line-gold: rgba(214, 165, 90, .30);
    /* Рамка и фон ПОЛЕЙ вынесены в токены: волосок .07 на солнце не виден,
       а фон поля #0a0a09 сливался с серединой карточки #100f0e. */
    --gwpf-field-line: rgba(255, 255, 255, .14);
    --gwpf-field-bg: #050504;

    --gwpf-text: #f3efe7;
    --gwpf-text-2: #b8b2a7;
    /* #968f84, не #7d776d — правка 14.09.2026: служебные цифры (min/max,
       мета, даты) на солнце и при слабом зрении не читались. */
    --gwpf-text-3: #968f84;

    --gwpf-ok: #57b884;
    --gwpf-err: #c96b6b;
    --gwpf-neutral: #7d776d;

    /* Cormorant — заголовки, суммы, номера шагов и пунктов.
       Inter НЕ подключаем: тема уже грузит его как --font. */
    --gwpf-serif: 'Cormorant Garamond', Georgia, serif;
    --gwpf-sans: var(--font, 'Inter', system-ui, sans-serif);
    --gwpf-mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;

    --gwpf-r: 26px;
    --gwpf-r-s: 14px;

    --gwpf-btn: linear-gradient(180deg, #eacf93 0%, #d3aa62 100%);
    --gwpf-btn-shadow: 0 1px 0 rgba(255, 255, 255, .55) inset,
                       0 -1px 0 rgba(0, 0, 0, .25) inset,
                       0 18px 40px -18px rgba(214, 165, 90, .55);

    --gwpf-hero-shadow: 0 1px 0 rgba(255, 255, 255, .04) inset,
                        0 40px 80px -50px rgba(0, 0, 0, .9);

    --gwpf-ease: cubic-bezier(.2, .7, .2, 1);
    --gwpf-t: .22s;
}

/* Мост к именам v1. Файлы шагов (direction.css / bid.css) пишутся параллельно и
   могут ещё держать старые имена; без моста они получили бы пустое значение и
   потеряли цвет. Значения — уже v2, поэтому оранжево-бронзового градиента не
   остаётся даже у неперписанных правил (критерий приёмки v2 §9.2).
   Новые правила старые имена НЕ используют. */
:root {
    --gwpf-surface: var(--gwpf-s1);
    --gwpf-surface-2: var(--gwpf-s2);
    --gwpf-field: var(--gwpf-field-bg);
    --gwpf-grad: var(--gwpf-btn);
    --gwpf-bronze: #b98c46;
    --gwpf-line-2: rgba(255, 255, 255, .16);
    --gwpf-line-gold-2: rgba(214, 165, 90, .45);
    --gwpf-wait: var(--gwpf-gold);
    --gwpf-font: var(--gwpf-sans);
    --gwpf-display: var(--gwpf-serif);
    --gwpf-shadow: var(--gwpf-hero-shadow);
    --gwpf-glow: 0 18px 40px -18px rgba(214, 165, 90, .55);
}

/* -----------------------------------------------------------------------------
   Оранжевый темы гасим в одной точке — переопределением её же переменных внутри
   скина. Все они используются ТОЛЬКО кнопками и пилюлями (проверено по
   css/main.min.css: .main-menu-btn, .menu-close-btn, .link-register/.link-logout,
   общий блок кнопок, .xtl_submit/.xtp_submit/.hexch_submit, #topped), поэтому
   подмена не задевает текст и фоны. Иначе оранжевый пришлось бы ловить
   по одному селектору и он всё равно вылезал бы на редких экранах.
   -------------------------------------------------------------------------- */
body.gw-pf {
    --Header-0: var(--gwpf-bg);
    --Form-Button: var(--gwpf-btn);
    --Form-Button-Hover: var(--gwpf-btn);
    --Form-Button-Click: var(--gwpf-btn);
    --Primary-Button: var(--gwpf-btn);
    --Primary-Button-Hover: var(--gwpf-btn);
    --Primary-Button-Click: var(--gwpf-btn);
    --Header-Primary-Button: var(--gwpf-btn);
    --Header-Button-Hover: var(--gwpf-btn);
    --Header-Button-Click: var(--gwpf-btn);
    /* текст на шампанском — тёмный; иначе белый по светлому золоту нечитаем */
    --Colors-Texts-Form-Button-Text: #1c1408;

    /* Тот же приём для акцентных ССЫЛОК темы (#d79858 — оранжевое золото v1):
       «Регистрация», «Забыли пароль?», ссылки в текстах и в шапке. Их
       разбросано по вендорным виджетам столько, что ловить поимённо
       бессмысленно — правим в объявлении переменной. */
    --Colors-Texts-Link: var(--gwpf-gold-2);
    --Colors-Texts-Form-Link: var(--gwpf-gold-2);
    --Colors-Fills-Primary: var(--gwpf-gold);
    --Colors-Strokes-Form-Stroke: var(--gwpf-line-gold);
    --Colors-Header-Footer-Header-Link-Hover: var(--gwpf-gold-2);
    --Colors-Header-Footer-Header-Link-Click: var(--gwpf-gold-3);
}

/* -----------------------------------------------------------------------------
   §3. Атмосфера
   Два слоя свечения с РАЗНЫМИ периодами (9 с и 13 с): одинаковые дали бы
   метроном. Оба под контентом, `will-change` только на них.
   -------------------------------------------------------------------------- */
body.gw-pf {
    background: var(--gwpf-bg);
    position: relative;
    /* `clip`, а не `hidden`: hidden на body ломает position:sticky у липкой панели */
    overflow-x: clip;
}

body.gw-pf .inner-content,
body.gw-pf .aside {
    font-family: var(--gwpf-sans);
}

/* Главное свечение за героем. На главной его нет: там свой hero с китом (§5.6).
   `width/height: auto` ОБЯЗАТЕЛЬНЫ: у темы есть вложенное правило
   `body { &::before { width: 65.8rem; height: 70.8rem; top: 18.6rem; right: -32.9rem;
   background: url(bg-franklin.svg) } }` (css/main.min.css) — декоративное пятно.
   `inset` перебивает его top/right, но НЕ width/height: без явного auto слой
   свечения получался 658×708 px и рисовался квадрантом в левом верхнем углу с
   жёстким краем (правка владельца 14.09.2026, «баг с линией в анимации»). */
body.gw-pf:not(.gw-pf-home)::before {
    content: '';
    position: fixed;
    inset: -10%;
    width: auto;
    height: auto;
    z-index: 0;
    pointer-events: none;
    background: radial-gradient(900px 520px at 42% 26%, rgba(214, 165, 90, .14), transparent 62%);
    transform-origin: 42% 26%;
    animation: gwpf-breathe 9s ease-in-out infinite;
    will-change: transform, opacity;
}

body.gw-pf:not(.gw-pf-home) .gwpf-glow2 {
    position: fixed;
    inset: -10%;
    width: auto;
    height: auto;
    z-index: 0;
    pointer-events: none;
    background: radial-gradient(760px 540px at 86% 78%, rgba(214, 165, 90, .06), transparent 60%);
    transform-origin: 86% 78%;
    animation: gwpf-breathe 13s ease-in-out infinite reverse;
    will-change: transform, opacity;
}

/* Узел свечения на главной не рисуем вовсе, даже если скрипт его вставил. */
body.gw-pf.gw-pf-home .gwpf-glow2 {
    display: none;
}

/* Зерно: без него большие тёмные плоскости выглядят цифровыми. */
body.gw-pf::after {
    content: '';
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    opacity: .035;
    mix-blend-mode: overlay;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
}

/* Контент обязан лежать ВЫШЕ свечения и зерна. Перечисляем корневые узлы темы
   поимённо: `body.gw-pf > *` подняло бы и служебные скрытые div-ы, и попапы,
   у которых свой z-index. */
body.gw-pf > .wclosearea,
body.gw-pf > .nav-wrapper,
body.gw-pf > main,
body.gw-pf > .main,
body.gw-pf > footer {
    position: relative;
    z-index: 1;
}

/* Шапке — свой этаж выше контента. При равном z-index (1) более поздний в DOM
   `main` побеждает шапку: выпадашки «Личный кабинет» и «Контакты» остаются
   видимыми (фон у main прозрачный), но клики по «Войти»/«Регистрация»
   перехватывает main — вход не открывался ни на одной странице скина.
   На главной ещё жёстче: там поток намеренно без stacking-контекстов
   (см. home.css §2.1), и кит (z 1) с карточкой формы (z 2) лежат прямо в
   корневом контексте — поэтому 10, а не 2. Попапы темы (z 999999) выше. */
body.gw-pf > .nav-wrapper {
    z-index: 10;
}

@keyframes gwpf-breathe {
    0%, 100% { opacity: .72; transform: scale(1) translate(0, 0); }
    50%      { opacity: 1;   transform: scale(1.09) translate(1.2%, .8%); }
}

/* Золотая линия по верху героя «плывёт» — 7 с, не в такт свечению. */
@keyframes gwpf-sheen {
    0%, 100% { background-position: 0% 0; }
    50%      { background-position: 100% 0; }
}

/* Цифра-героиня дышит синхронно с фоном (те же 9 с). */
@keyframes gwpf-glow {
    0%, 100% { text-shadow: 0 0 28px rgba(214, 165, 90, .18); }
    50%      { text-shadow: 0 0 56px rgba(214, 165, 90, .38); }
}

/* «Печать» при копировании (класс .gwpf-flash ставит скрипт на 420 мс):
   золотой блик проходит по значению слева направо. Цвет текста на время
   блика берётся из градиента через background-clip — сам текст не меняется. */
body.gw-pf .gwpf-flash {
    background-image: linear-gradient(100deg, currentColor 0%, currentColor 35%,
                                      #fff7e6 50%, currentColor 65%, currentColor 100%);
    background-size: 240% 100%;
    background-repeat: no-repeat;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: gwpf-flash .32s var(--gwpf-ease) both;
}

@keyframes gwpf-flash {
    0%   { background-position: 120% 0; }
    100% { background-position: -120% 0; }
}

/* Пульс ромба статуса и точки автообновления. */
@keyframes gwpf-pulse {
    50% { opacity: .45; box-shadow: 0 0 4px rgba(214, 165, 90, .4); }
}

@keyframes gwpf-rise {
    from { opacity: 0; transform: translateY(6px); }
    to   { opacity: 1; transform: none; }
}

/* -----------------------------------------------------------------------------
   §4.1. Служебная строка и шапка. Действуют на ВСЕХ страницах со скином,
   включая главную, — иначе переход «главная → шаг 1» выглядит сменой сайта.
   -------------------------------------------------------------------------- */
/* Оранжевая плашка «Время работы…» → тонкая служебная строка. */
body.gw-pf .wclosearea {
    background: var(--gwpf-bg);
    border-bottom: 1px solid var(--gwpf-line);
}

/* Тема раскладывает плашку `row-reverse` + `space-between` (крестик справа).
   Текст нужно поставить по центру, поэтому крестик вынимаем из потока. */
body.gw-pf .wclosearea .wclosearea_ins {
    position: relative;
    justify-content: center;
    min-height: 0;
    padding-top: 10px;
    padding-bottom: 10px;
}

body.gw-pf .wclosearea .wclosearea_hide {
    position: absolute;
    right: var(--padding-content, 15px);
    top: 50%;
    margin-top: -10px;
    opacity: .32;
    filter: grayscale(1) brightness(2.4);
    transition: opacity var(--gwpf-t) var(--gwpf-ease);
}

body.gw-pf .wclosearea .wclosearea_hide:hover {
    opacity: .7;
}

body.gw-pf .wclosearea .wclosearea_text_ins,
body.gw-pf .wclosearea .wclosearea_text_ins p {
    margin: 0;
    font-family: var(--gwpf-sans);
    font-size: 11px;
    line-height: 16px;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--gwpf-gold-dim);
}

/* Время внутри строки — золото 500. Вендорный текст операторский и цельный,
   поэтому подсвечиваем только то, что оператор сам выделил (<b>/<strong>),
   и .gwpf-time, если скрипт когда-нибудь обернёт часы. */
body.gw-pf .wclosearea .wclosearea_text_ins :is(b, strong, .gwpf-time) {
    font-weight: 500;
    color: var(--gwpf-gold);
}

/* Шапка: фон снимаем — под ней тот же тёплый чёрный и свечение. */
body.gw-pf .navigation,
body.gw-pf .nav-wrapper .user-bar {
    background: transparent;
}

body.gw-pf .nav-wrapper.sticky.active .navigation,
body.gw-pf .nav-wrapper.sticky.active .user-bar {
    background: rgba(7, 7, 6, .92);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

body.gw-pf .navigation__wrapper {
    padding-top: 26px;
    padding-bottom: 22px;
}

/* 15 px — правка владельца 14.09.2026 («шрифт больше»). Потолок ровно тут:
   крупнее или капителью — и шапка забирает внимание у h1 и героини. */
body.gw-pf .main-menu__list a {
    padding: 8px 15px;
    font-family: var(--gwpf-sans);
    font-size: 15px;
    line-height: 22px;
    font-weight: 400;
    color: var(--gwpf-text-2);
}

body.gw-pf .main-menu__list a:hover {
    color: var(--gwpf-text);
}

/* «Обмен» был оранжевой пилюлей — становится обычным пунктом с золотой
   подчёркивающей линией. Селектор повторяет вендорный (`> li > a`), чтобы
   выиграть у него по специфичности без !important. */
body.gw-pf .main-menu__list-left > li > a {
    position: relative;
    padding: 8px 15px;
    background: none;
    border: none;
    border-radius: 0;
    font-weight: 400;
    color: var(--gwpf-text);
}

body.gw-pf .main-menu__list-left > li > a::after {
    content: '';
    position: absolute;
    left: 15px;
    right: 15px;
    bottom: 0;
    height: 1px;
    background: linear-gradient(90deg, var(--gwpf-gold), transparent);
}

body.gw-pf .main-menu__list-left > li > a:hover {
    opacity: 1;
    color: var(--gwpf-gold-2);
}

/* Бургер — ghost-золото вместо заливки. */
body.gw-pf .main-menu-btn,
body.gw-pf .menu-close-btn {
    background: transparent;
    border: 1px solid var(--gwpf-line-gold);
    border-radius: 12px;
}

body.gw-pf .main-menu-btn span {
    background: var(--gwpf-gold-2);
}

body.gw-pf .main-menu-btn:hover,
body.gw-pf .menu-close-btn:hover {
    filter: none;
    border-color: var(--gwpf-gold-dim);
}

/* Правая часть шапки: контакты, кабинет, язык. */
body.gw-pf .header__contacts-button,
body.gw-pf .header__auth .account-block,
body.gw-pf .lang_auth_wrapper .tolbar_lang {
    font-family: var(--gwpf-sans);
    font-size: 15px;
    color: var(--gwpf-text-2);
}

body.gw-pf .header__contacts-button:hover,
body.gw-pf .header__auth .account-block:hover {
    color: var(--gwpf-text);
}

body.gw-pf .header__contacts.header__contacts-wrapper,
body.gw-pf .header__auth .auth-wrapper {
    background: var(--gwpf-s1);
    border: 1px solid var(--gwpf-line);
    border-radius: var(--gwpf-r-s);
}

/* Выпадашка языка осталась от прежнего дизайна: тема красит её переменной
   --Colors-Fills-Dropmenu-Burgermenu (#b8884b) — бронзовая плашка посреди
   тёмной шапки, и на десктопе, и на мобильном. Приводим к тем же правилам,
   что и «Контакты»/«Личный кабинет» выше. */
body.gw-pf .langlist_div .langlist_ul {
    background: var(--gwpf-s1);
    border: 1px solid var(--gwpf-line);
    border-radius: var(--gwpf-r-s);
    box-shadow: 0 18px 40px rgba(0, 0, 0, .55);
}

body.gw-pf .langlist_div .langlist_ul a {
    color: var(--gwpf-text-2);
}

body.gw-pf .langlist_div .langlist_ul a:hover,
body.gw-pf .langlist_div .langlist_ul a.active {
    color: var(--gwpf-gold-2);
}

/* Та же бронзовая плашка — под пунктами бургер-меню (тема включает её только
   до 640 px: `.menu-items-wrapper` при min-width 641 сбрасывает фон в none).
   Серый текст скина на ней не читался. */
@media (max-width: 640px) {
    body.gw-pf .menu-items-wrapper {
        background: var(--gwpf-s1);
        border: 1px solid var(--gwpf-line);
        border-radius: var(--gwpf-r-s);
    }
}

body.gw-pf .header__contacts-link {
    color: var(--gwpf-text-2);
}

body.gw-pf .header__contacts-link:hover {
    color: var(--gwpf-gold-2);
}

body.gw-pf .header_timetable,
body.gw-pf .header_timetable p {
    font-size: 12px;
    color: var(--gwpf-text-3);
}

/* Кнопки входа/регистрации в шапке — шампанское с тёмным текстом. */
body.gw-pf .link-register,
body.gw-pf .link-logout {
    background: var(--gwpf-btn);
    color: #1c1408;
    border: none;
}

body.gw-pf .user-bar__link.link-login,
body.gw-pf .link-account {
    color: var(--gwpf-text-2);
}

/* -----------------------------------------------------------------------------
   §4.2. Заголовочная зона экрана
   -------------------------------------------------------------------------- */
/* Заголовочной зоны-обёртки и eyebrow в скине НЕТ. Их правила были написаны
   заранее, но производителя так и не получили: eyebrow собирать не из чего
   (§2 п.4 запрещает выдумывать текст), а заголовок и мета встают соседями и
   без обёртки. Мёртвые селекторы сняты, чтобы следующий сопровождающий не
   искал ветку скрипта, которой нет. */
/* 500, не 300/400 — правка владельца 14.09.2026 («шрифт тонковат»). Выше 500
   не идём: жирный Cormorant грубеет. `lining-nums` обязателен: по умолчанию у
   Cormorant цифры текстовые (минускульные), и «20» в «TRC20» проваливалось
   под строку — владелец видел это как «20 почему-то маленькое». */
body.gw-pf .main-wrapper > .main-title,
body.gw-pf .gwpf-h1 {
    margin: 0;
    font-family: var(--gwpf-serif);
    font-weight: 500;
    font-size: 46px;
    line-height: 1.05;
    letter-spacing: .005em;
    font-variant-numeric: lining-nums;
    color: var(--gwpf-text);
}

/* Последнее слово заголовка — светлое золото, на ступень легче основного. */
body.gw-pf .gwpf-h1-accent {
    font-weight: 400;
    color: var(--gwpf-gold-2);
}

body.gw-pf .gwpf-meta {
    flex: 0 0 auto;
    text-align: right;
    font-family: var(--gwpf-sans);
    font-size: 12.5px;
    line-height: 1.7;
    color: var(--gwpf-text-3);
}

body.gw-pf .main-wrapper > .gwpf-meta {
    margin: -34px 0 22px;
}

/* -----------------------------------------------------------------------------
   §4.8 (следствие). Плавающая кнопка чата (`chatwoot-custom.js` печатает свои
   стили инлайновым <style>, поэтому перекрасить её можно только отсюда).
   Это ЕДИНСТВЕННОЕ, что оставалось от оранжево-бронзового темы в вычисленных
   стилях внутри body.gw-pf: сама кнопка, иконка чата и рамка её меню. Кнопка
   висит поверх экрана оплаты и спорила с шампанской primary — то есть ровно с
   той кнопкой, на которую клиент должен нажать. Селекторы (0,2,0) перебивают
   вендорные (0,1,0) независимо от порядка подключения.
   -------------------------------------------------------------------------- */
body.gw-pf .gw-fab__btn,
body.gw-pf .gw-fab__icon--chat {
    background: var(--gwpf-btn);
}

body.gw-pf .gw-fab__btn {
    box-shadow: 0 18px 40px -18px rgba(214, 165, 90, .55), 0 2px 8px rgba(0, 0, 0, .3);
    /* Пульс на загрузке возвращал оранжевую тень своими кадрами. */
    animation: none;
}

body.gw-pf .gw-fab__btn:hover {
    box-shadow: 0 20px 44px -16px rgba(214, 165, 90, .7), 0 3px 12px rgba(0, 0, 0, .35);
}

body.gw-pf .gw-fab__menu {
    border-color: var(--gwpf-line-gold);
}

/* Кнопка «наверх» (#topped, тема красит её --Primary-Button) — ghost-контур.
   Решение 14.09.2026: чат — единственная заливная плавающая кнопка; две золотые
   заливки плюс золотая primary дали бы три primary на одном экране. */
body.gw-pf #topped {
    background: rgba(7, 7, 6, .72);
    border: 1px solid var(--gwpf-line-gold-2);
    box-shadow: 0 2px 8px rgba(0, 0, 0, .3);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
}

body.gw-pf #topped:hover:not(:disabled) {
    filter: none;
    border-color: var(--gwpf-gold);
}

/* Стрелка — золотом через маску: у темы белая стрелка фоном-картинкой. */
body.gw-pf #topped::after {
    background: var(--gwpf-gold-2);
    -webkit-mask: url(../images/icons/arrow_drop_up=Variant2.svg) no-repeat center / 2.4rem;
    mask: url(../images/icons/arrow_drop_up=Variant2.svg) no-repeat center / 2.4rem;
}

/* -----------------------------------------------------------------------------
   §4.3. Степпер — линия через всю ширину с узлами на ней.
   Линию рисует КАЖДЫЙ пункт на своём отрезке: золото у пройденных, серое у
   активного и будущих. Так золото кончается ровно на активном узле при любом
   числе шагов — общий градиент пришлось бы пересчитывать в JS.
   -------------------------------------------------------------------------- */
body.gw-pf .gwpf-stepper {
    position: relative;
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: 1fr;
    margin: 0 0 34px;
    padding: 0;
    list-style: none;
    border: 0;
}

body.gw-pf .gwpf-step {
    position: relative;
    min-width: 0;
    padding: 30px 0 0;
    font-family: var(--gwpf-sans);
    font-size: 11px;
    line-height: 1.5;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--gwpf-text-3);
}

body.gw-pf .gwpf-step::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 11px;
    height: 1px;
    background: var(--gwpf-line);
}

body.gw-pf .gwpf-step.is-done::after {
    background: var(--gwpf-gold);
}

body.gw-pf .gwpf-step-num {
    position: absolute;
    top: 5px;
    left: 0;
    z-index: 1;
    width: 13px;
    height: 13px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, .2);
    background: var(--gwpf-bg);
    font-family: var(--gwpf-serif);
    font-size: 9px;
    line-height: 11px;
    font-weight: 500;
    text-align: center;
    color: var(--gwpf-text-3);
    font-variant-numeric: tabular-nums;
}

body.gw-pf .gwpf-step-label {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Пройденный — залит золотом с галкой. Цвет галки берём из токена через маску:
   с цветом внутри data-URI смена --gwpf-gold оставила бы её прежней. */
body.gw-pf .gwpf-step.is-done .gwpf-step-num {
    border-color: var(--gwpf-gold);
    background: var(--gwpf-gold);
    font-size: 0;
}

body.gw-pf .gwpf-step.is-done .gwpf-step-num::before {
    content: '';
    display: block;
    width: 9px;
    height: 9px;
    margin: 1px auto 0;
    background-color: #1a1207;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 8.6l3.4 3.4L13.5 4.4' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / contain;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 8.6l3.4 3.4L13.5 4.4' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / contain;
}

body.gw-pf .gwpf-step.is-done {
    color: var(--gwpf-text-2);
}

body.gw-pf .gwpf-step.is-active {
    color: var(--gwpf-text);
}

/* Активный — чистая заливка с кольцом. Цифру НЕ печатаем: 9 px внутри круга
   13 px превращаются в кляксу, а в эталоне цифра активного узла набрана цветом
   самого золота, то есть узел читается ровной точкой. Будущему цифра нужна —
   ей поднят контраст (--gwpf-text-2 вместо -3). */
body.gw-pf .gwpf-step.is-active .gwpf-step-num {
    border-color: var(--gwpf-gold);
    background: var(--gwpf-gold);
    font-size: 0;
    box-shadow: 0 0 0 4px rgba(214, 165, 90, .18);
}

body.gw-pf .gwpf-step:not(.is-done):not(.is-active) .gwpf-step-num {
    color: var(--gwpf-text-2);
}

/* Итог шага 4 красит весь степпер: скрипт пишет состояние в data-state списка. */
body.gw-pf .gwpf-stepper[data-state='ok'] .gwpf-step.is-active .gwpf-step-num {
    border-color: var(--gwpf-ok);
    background: var(--gwpf-ok);
    box-shadow: 0 0 0 4px rgba(87, 184, 132, .18);
}

body.gw-pf .gwpf-stepper[data-state='err'] .gwpf-step.is-active .gwpf-step-num {
    border-color: var(--gwpf-err);
    background: var(--gwpf-err);
    box-shadow: 0 0 0 4px rgba(201, 107, 107, .18);
}

body.gw-pf .gwpf-stepper[data-state='neutral'] .gwpf-step.is-active .gwpf-step-num {
    border-color: var(--gwpf-neutral);
    background: var(--gwpf-neutral);
    box-shadow: none;
}

/* -----------------------------------------------------------------------------
   §4.4. Карточка-герой (одна на экран) и второстепенная карточка
   -------------------------------------------------------------------------- */
body.gw-pf .gwpf-hero {
    position: relative;
    padding: 46px 52px 40px;
    border: 1px solid var(--gwpf-line-gold);
    border-radius: var(--gwpf-r);
    background: var(--gwpf-card);
    box-shadow: var(--gwpf-hero-shadow);
    overflow: hidden;
}

body.gw-pf .gwpf-hero::before {
    content: '';
    position: absolute;
    left: 12%;
    right: 12%;
    top: 0;
    height: 1px;
    opacity: .7;
    background: linear-gradient(90deg, transparent, var(--gwpf-gold-2), transparent);
    background-size: 200% 100%;
    animation: gwpf-sheen 7s ease-in-out infinite;
}

/* Водяной знак: вордмарк срезан clip-path, виден только кит. Только в герое. */
body.gw-pf .gwpf-wm {
    position: absolute;
    right: -120px;
    top: -120px;
    width: 720px;
    max-width: none;
    opacity: .028;
    filter: saturate(0) brightness(3);
    clip-path: inset(0 0 42% 0);
    pointer-events: none;
    user-select: none;
}

/* ВНУТРИ ГЕРОЯ — НИ ОДНОЙ ВЛОЖЕННОЙ РАМКИ. Вендорные контейнеры внутри него
   теряют фон, рамку и радиус: группы разделяет воздух и .gwpf-rule. */
body.gw-pf .gwpf-hero :is(.zone_center, .zone_center_ins, .zone_table, .zone_div,
                          .block_payinfo, .block_statusbids, .block_statusbids_ins,
                          .block_instruction, .block_instruction_ins,
                          .block_xchangedata, .notice_message, .warning_message,
                          .block_status, .block_paybutton, .block_paybutton_merch,
                          .block_warning_merch) {
    background: none;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    padding: 0;
}

body.gw-pf .gwpf-mini {
    padding: 24px;
    border: 1px solid var(--gwpf-line);
    border-radius: 20px;
    background: var(--gwpf-s1);
    box-shadow: none;
}

/* Пока экранные файлы не назначили героя, вендорные контейнеры держат
   спокойную поверхность .gwpf-mini — так страница не выглядит «без стилей».
   `:not(.gwpf-hero, .gwpf-details)` обязателен: у этих селекторов на класс
   БОЛЬШЕ, чем у `.gwpf-hero`, и без исключения герой получал бы 28 px отступа,
   радиус 20 и плоскую заливку вместо своих 52 px, 26 и градиента. */
body.gw-pf .inner-content > :is(.notice_message, .warning_message, .xchange_div,
                                .block_xchangedata, .block_payinfo,
                                .block_statusbids):not(.gwpf-hero, .gwpf-details),
body.gw-pf .exchange_status_html > * > :is(.block_statusbids,
                                .block_xchangedata):not(.gwpf-hero, .gwpf-details),
body.gw-pf .aside :is(.login_widget, .register_widget, .user_widget, .widget) {
    padding: 24px 28px;
    border: 1px solid var(--gwpf-line);
    border-radius: 20px;
    background: var(--gwpf-s1);
    box-shadow: none;
}

body.gw-pf .inner-content > :is(.notice_message, .warning_message, .xchange_div,
                                .block_xchangedata, .block_payinfo,
                                .block_statusbids):not(.gwpf-hero, .gwpf-details),
body.gw-pf .aside :is(.login_widget, .register_widget, .user_widget, .widget) {
    margin-bottom: 18px;
}

/* Разделитель-«правило с ромбом». Ромб — узел <i> внутри (псевдоэлементы заняты
   двумя половинами волоска). */
body.gw-pf .gwpf-rule {
    display: flex;
    align-items: center;
    gap: 16px;
    margin: 36px 0 30px;
    color: var(--gwpf-gold-dim);
}

body.gw-pf .gwpf-rule::before,
body.gw-pf .gwpf-rule::after {
    content: '';
    flex: 1 1 auto;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--gwpf-line-gold));
}

body.gw-pf .gwpf-rule::after {
    background: linear-gradient(90deg, var(--gwpf-line-gold), transparent);
}

body.gw-pf .gwpf-rule > :is(i, span) {
    flex: 0 0 auto;
    width: 6px;
    height: 6px;
    background: var(--gwpf-gold-dim);
    transform: rotate(45deg);
}

/* -----------------------------------------------------------------------------
   §4.5. Подписи и статус
   -------------------------------------------------------------------------- */
/* 12.5/600/text-2 — правка владельца 14.09.2026 («подписи жирнее и светлее,
   для тех, у кого плохое зрение или солнце светит»). Не белые намеренно:
   белый остаётся у значений, иначе подпись спорит со значением. */
body.gw-pf .gwpf-lbl,
body.gw-pf .gwpf-amount > span:first-child {
    display: block;
    margin: 38px 0 6px;
    font-family: var(--gwpf-sans);
    font-size: 12.5px;
    line-height: 18px;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--gwpf-text-2);
}

/* Первая подпись в карточке не должна отбивать сама от себя 38 px сверху. */
body.gw-pf .gwpf-hero > .gwpf-lbl:first-child,
body.gw-pf .gwpf-lbl.is-tight {
    margin-top: 0;
}

/* Статус: ромб с пульсом + строка капителью. Псевдоним v1 `.gwpf-badge` снят:
   разметки v1 в проекте не осталось, а парное имя заставляло писать каждое
   правило статуса дважды — новое состояние легко было забыть в одном из них. */
body.gw-pf .gwpf-status {
    display: flex;
    align-items: center;
    gap: 10px;
    height: auto;
    padding: 0;
    background: none;
    border-radius: 0;
    font-family: var(--gwpf-sans);
    font-size: 11.5px;
    line-height: 17px;
    font-weight: 400;
    letter-spacing: .2em;
    text-transform: uppercase;
    color: var(--gwpf-gold);
}

body.gw-pf .gwpf-status::before {
    content: '';
    flex: 0 0 auto;
    width: 7px;
    height: 7px;
    background: currentColor;
    transform: rotate(45deg);
    box-shadow: 0 0 12px rgba(214, 165, 90, .8);
    animation: gwpf-pulse 2.4s ease-in-out infinite;
}

body.gw-pf .gwpf-status.is-ok {
    color: var(--gwpf-ok);
}

body.gw-pf .gwpf-status.is-err {
    color: var(--gwpf-err);
}

body.gw-pf .gwpf-status.is-neutral {
    color: var(--gwpf-neutral);
}

/* Завершённые состояния не пульсируют: пульс означает «ждём». */
body.gw-pf .gwpf-status:is(.is-ok, .is-err, .is-neutral)::before {
    animation: none;
    box-shadow: none;
}

/* -----------------------------------------------------------------------------
   §4.6. Цифра-героиня
   ПРАВИЛО-АБСОЛЮТ: строка суммы остаётся ровно той, что отдал вендор — буква
   в букву. Внутрь узла ничего не вставляем, дробную часть не приглушаем, знаки
   не режем и не дописываем: у крипты значимы все восемь знаков, а сам узел
   читают вендорское копирование и автообновление.
   Класс длины вешает JS по длине ВСЕЙ строки вместе с названием валюты
   (§4.6, редакция владельца 10.09.2026): s ≤ 12 знаков, m 13–22, l 23+.
   Кегли 84 / 56 / 44 (моб. 52 / 36 / 30) сверены с эталоном: строка
   «250 Tether TRC20 USDT» — 21 знак, класс m, в mock-signature.html 56 px.
   ЭТО ЕДИНСТВЕННАЯ ШКАЛА героини. Переопределение допускается ровно там, где
   зона у́же героя (шаг 2 — две колонки по ~320 px), и подписано на месте.
   -------------------------------------------------------------------------- */
body.gw-pf .gwpf-amount {
    display: block;
    margin: 0;
    font-family: var(--gwpf-serif);
    font-weight: 300;
    /* Кегль отдан переменной НАМЕРЕННО. Вендорные узлы, на которые садится
       героиня (`.zone_text`, `.block_xchdata_line`), перекрыты правилами темы
       со специфичностью (0,4,0) — короткий селектор скина им проигрывает,
       и раньше каждое место держало свою копию шкалы. Теперь копий нет:
       шкала объявлена ЗДЕСЬ один раз, а длинные селекторы в bid.css просто
       печатают `font-size: var(--gwpf-amount-size)`. */
    --gwpf-amount-size: 56px;
    font-size: var(--gwpf-amount-size);
    line-height: 1.05;
    letter-spacing: -.01em;
    color: var(--gwpf-gold-3);
    /* `lining-nums` обязателен: по умолчанию у Cormorant цифры текстовые
       (минускульные), и восемь нулей суммы сидели бы на высоте строчных, а
       код валюты — прописными во всю высоту; число визуально уступало бы коду
       ровно там, где клиент обязан прочитать сумму перевода. */
    font-variant-numeric: lining-nums tabular-nums;
    text-shadow: 0 0 40px rgba(214, 165, 90, .25);
    animation: gwpf-glow 9s ease-in-out infinite;
    /* перенос допустим только между числом и кодом валюты, но не внутри числа */
    word-break: keep-all;
    overflow-wrap: anywhere;
    cursor: copy;
}

/* Тема дорисовывает к .zone_text иконку копирования псевдоэлементом. Рядом с
   72-пиксельной цифрой это мусор; копирование живёт в отдельной ссылке .gwpf-copy. */
body.gw-pf .gwpf-amount::after {
    content: none;
}

/* Кегль по длине всей строки героини (§4.6). */
body.gw-pf .gwpf-amount.is-len-s { --gwpf-amount-size: 84px; }
body.gw-pf .gwpf-amount.is-len-m { --gwpf-amount-size: 56px; }
body.gw-pf .gwpf-amount.is-len-l { --gwpf-amount-size: 44px; }

/* -----------------------------------------------------------------------------
   §4.7. Копирование — текстовая ссылка, а не иконка-кнопка
   -------------------------------------------------------------------------- */
body.gw-pf .gwpf-copy {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    width: auto;
    height: auto;
    margin-top: 14px;
    padding: 0;
    background: none;
    border: 0;
    border-radius: 0;
    font-family: var(--gwpf-sans);
    font-size: 12.5px;
    line-height: 18px;
    letter-spacing: .04em;
    color: var(--gwpf-text-2);
    cursor: pointer;
    text-decoration: none;
    transition: color var(--gwpf-t) var(--gwpf-ease);
}

body.gw-pf .gwpf-copy:hover {
    color: var(--gwpf-gold-2);
    background: none;
}

body.gw-pf .gwpf-copy-ico {
    flex: 0 0 auto;
    display: block;
    width: 14px;
    height: 14px;
    background-color: var(--gwpf-gold);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='9' y='9' width='12' height='12' rx='2' fill='none' stroke='%23000' stroke-width='1.6'/%3E%3Cpath d='M15 9V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v8a2 2 0 0 0 2 2h4' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / contain;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='9' y='9' width='12' height='12' rx='2' fill='none' stroke='%23000' stroke-width='1.6'/%3E%3Cpath d='M15 9V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v8a2 2 0 0 0 2 2h4' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / contain;
}

/* Подпись и её замена на 1.4 с после клика живут обе в разметке — меняется
   только то, какая из них видима. Позиционировать «Скопировано» абсолютом,
   как в v1, здесь нельзя: ссылка текстовая, всплывающая метка отъехала бы в поле. */
body.gw-pf .gwpf-copy-done {
    display: none;
    color: var(--gwpf-gold-2);
}

body.gw-pf .gwpf-copy.is-copied {
    color: var(--gwpf-gold-2);
}

body.gw-pf .gwpf-copy.is-copied .gwpf-copy-text {
    display: none;
}

body.gw-pf .gwpf-copy.is-copied .gwpf-copy-done {
    display: inline;
}

body.gw-pf .gwpf-copy.is-copied .gwpf-copy-ico {
    background-color: var(--gwpf-gold-2);
}

/* Вендорная .zone_copy остаётся рабочей — просто становится тихой подписью. */
body.gw-pf .inner-content .zone_copy {
    padding-left: 0;
    background: none;
    color: var(--gwpf-text-3);
    cursor: pointer;
}

/* -----------------------------------------------------------------------------
   §4.8. Кнопки. Оранжево-бронзового градиента темы в скине не остаётся нигде.
   -------------------------------------------------------------------------- */
body.gw-pf .inner-content .xchange_submit,
body.gw-pf .inner-content #check_rule_step_input,
body.gw-pf .inner-content .success_paybutton,
body.gw-pf .inner-content .iam_pay_bids,
body.gw-pf .inner-content .widget_checkstatus_submit,
body.gw-pf .inner-content .go_to_main,
body.gw-pf .aside .widget_log_submit,
body.gw-pf .aside .widget_reg_submit,
body.gw-pf .gwpf-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 62px;
    padding: 0 28px;
    border: none;
    border-radius: var(--gwpf-r-s);
    background: var(--gwpf-btn);
    color: #1c1408;
    font-family: var(--gwpf-sans);
    font-size: 14px;
    line-height: 18px;
    font-weight: 600;
    letter-spacing: .14em;
    text-transform: uppercase;
    text-decoration: none;
    cursor: pointer;
    box-shadow: var(--gwpf-btn-shadow);
    transition: filter var(--gwpf-t) var(--gwpf-ease), opacity var(--gwpf-t) var(--gwpf-ease);
}

body.gw-pf .inner-content .xchange_submit:hover:not(:disabled),
body.gw-pf .inner-content #check_rule_step_input:hover:not(:disabled),
body.gw-pf .inner-content .success_paybutton:hover:not(:disabled),
body.gw-pf .inner-content .iam_pay_bids:hover:not(:disabled),
body.gw-pf .aside .widget_log_submit:hover:not(:disabled),
body.gw-pf .gwpf-btn:hover:not(:disabled) {
    background: var(--gwpf-btn);
    filter: brightness(1.04);
}

/* Неактивная primary («Создать заявку» до отметки согласия) — прозрачная с
   тонкой золотой рамкой, а не приглушённый градиент: opacity .45 на шампани
   давал грязную латунь. Заливка проявляется за 240 мс после отметки. */
body.gw-pf .inner-content .xchange_submit:disabled,
body.gw-pf .inner-content #check_rule_step_input:disabled,
body.gw-pf .inner-content .success_paybutton:disabled,
body.gw-pf .inner-content .iam_pay_bids:disabled,
body.gw-pf .gwpf-btn:disabled {
    background: transparent;
    border: 1px solid rgba(214, 165, 90, .32);
    color: rgba(214, 165, 90, .75);   /* читаемо, но не зовёт: подпись не белая и не шампань */
    box-shadow: none;
    cursor: default;
    filter: none;
    transition: background-color .24s var(--gwpf-ease), color .24s var(--gwpf-ease), border-color .24s var(--gwpf-ease);
}

/* Ghost — ссылки-действия второго плана (мониторинги, «Создать новую заявку»). */
body.gw-pf .aside .widget_reviews_more,
body.gw-pf .aside .widget_news_more,
body.gw-pf .gwpf-btn--ghost,
body.gw-pf .gwpf-help .gwpf-ghost,
body.gw-pf .gwpf-ghost {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: auto;
    height: 40px;
    padding: 0 16px;
    background: transparent;
    border: 1px solid var(--gwpf-line-gold);
    border-radius: 10px;
    color: var(--gwpf-gold-2);
    font-family: var(--gwpf-sans);
    font-size: 12.5px;
    line-height: 16px;
    font-weight: 400;
    letter-spacing: .06em;
    text-transform: none;
    text-decoration: none;
    box-shadow: none;
    cursor: pointer;
    transition: border-color var(--gwpf-t) var(--gwpf-ease), color var(--gwpf-t) var(--gwpf-ease);
}

body.gw-pf .aside .widget_reviews_more:hover,
body.gw-pf .gwpf-btn--ghost:hover,
body.gw-pf .gwpf-ghost:hover {
    background: transparent;
    border-color: var(--gwpf-gold-dim);
    color: var(--gwpf-gold-3);
}

/* Тихая: «Отменить заявку», «Выключить обновление». */
body.gw-pf .inner-content .cancel_paybutton,
body.gw-pf .inner-content .refresh_button,
body.gw-pf .gwpf-btn--quiet,
body.gw-pf .gwpf-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    width: auto;
    height: auto;
    padding: 0;
    background: none;
    border: 0;
    border-bottom: 1px solid var(--gwpf-line);
    border-radius: 0;
    font-family: var(--gwpf-sans);
    font-size: 12.5px;
    line-height: 20px;
    font-weight: 400;
    letter-spacing: 0;
    text-transform: none;
    text-decoration: none;
    color: var(--gwpf-text-3);
    box-shadow: none;
    cursor: pointer;
    transition: color var(--gwpf-t) var(--gwpf-ease), border-color var(--gwpf-t) var(--gwpf-ease);
}

body.gw-pf .inner-content .cancel_paybutton:hover,
body.gw-pf .inner-content .refresh_button:hover,
body.gw-pf .gwpf-btn--quiet:hover,
body.gw-pf .gwpf-link:hover {
    background: none;
    color: var(--gwpf-text-2);
    border-color: var(--gwpf-gold-dim);
}

/* Ритм внутри героя: между последней группой (инструкция, реквизиты) и главной
   кнопкой — 38 px, как в эталоне. Отступ ставим на КОНТЕЙНЕР кнопки, а не на
   саму кнопку: вендор кладёт её внутрь .block_paybutton_ins, и margin у кнопки
   схлопнулся бы внутри него. */
body.gw-pf .gwpf-hero > :is(.block_paybutton, .gwpf-sticky, .xchange_submit_div,
                            .block_submitbutton, .gwpf-btn) {
    margin-top: 38px;
}

/* Строка под primary: слева «проверяем автоматически», справа тихая ссылка. */
body.gw-pf .gwpf-sub {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-top: 18px;
    font-family: var(--gwpf-sans);
    font-size: 12.5px;
    line-height: 20px;
    color: var(--gwpf-text-3);
}

body.gw-pf .gwpf-auto {
    display: inline-flex;
    align-items: center;
    gap: 9px;
}

body.gw-pf .gwpf-auto::before {
    content: '';
    flex: 0 0 auto;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--gwpf-gold);
    animation: gwpf-pulse 2.4s ease-in-out infinite;
}

/* -----------------------------------------------------------------------------
   §4.9. Реквизиты: адрес/карта, пилюля сети, QR
   -------------------------------------------------------------------------- */
body.gw-pf .gwpf-addr,
body.gw-pf .gwpf-mono {
    display: block;
    font-family: var(--gwpf-mono);
    font-size: 19px;
    line-height: 1.5;
    font-weight: 500;
    letter-spacing: .06em;
    color: var(--gwpf-text);
    word-break: break-all;
}

/* Пилюля сети/банка. Текст берётся из вендорной подписи (то, что в скобках),
   ничего не выдумывается — если скобок нет, скрипт пилюлю не создаёт. */
body.gw-pf .gwpf-net {
    display: inline-block;
    margin-left: 10px;
    padding: 3px 9px;
    border: 1px solid var(--gwpf-line-gold);
    border-radius: 999px;
    font-family: var(--gwpf-mono);
    font-size: 10.5px;
    line-height: 14px;
    font-weight: 500;
    letter-spacing: .14em;
    text-transform: none;
    color: var(--gwpf-gold);
    vertical-align: middle;
}

body.gw-pf .gwpf-req {
    display: grid;
    grid-template-columns: 1fr 132px;
    gap: 36px;
    align-items: center;
}

body.gw-pf .gwpf-qr {
    width: 132px;
    height: 132px;
    padding: 10px;
    border-radius: 14px;
    background: #fff;
}

body.gw-pf .gwpf-qr :is(img, canvas) {
    display: block;
    width: 112px;
    height: 112px;
}

/* -----------------------------------------------------------------------------
   §4.10. Инструкция — вендорный <ol> в три колонки.
   Номера рисует CSS-счётчик: вставлять <b> внутрь операторского текста нельзя.
   -------------------------------------------------------------------------- */
body.gw-pf .gwpf-how {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    align-items: start;   /* пункт с длинным текстом не растягивает соседей до своей высоты */
    gap: 26px;
    margin: 34px 0 0;
    padding: 0;
    list-style: none;
    counter-reset: gwpf-how;
}

body.gw-pf .gwpf-how > li {
    margin: 0;
    padding-top: 14px;
    border-top: 1px solid var(--gwpf-line);
    list-style: none;
    counter-increment: gwpf-how;
    font-family: var(--gwpf-sans);
    font-size: 14.5px;   /* 13.5 → 14.5 (ревью 14.09.2026, читаемость на солнце) */
    line-height: 1.55;
    color: var(--gwpf-text-2);
}

/* `lining-nums`: у Cormorant единица в минускульном начертании рисуется как «I»
   и рядом с «2» и «3» читалась римской. Это выбор начертания цифры, а не правка
   текста — операторский текст пункта не трогаем. */
body.gw-pf .gwpf-how > li::before {
    content: counter(gwpf-how);
    display: block;
    margin-bottom: 10px;
    font-family: var(--gwpf-serif);
    font-size: 26px;
    line-height: 1;
    font-weight: 400;
    font-variant-numeric: lining-nums;
    color: var(--gwpf-gold-2);
}

body.gw-pf .gwpf-how > li :is(b, strong) {
    font-weight: 500;
    color: var(--gwpf-text);
}

body.gw-pf .gwpf-how > li a {
    color: var(--gwpf-gold-2);
}

/* -----------------------------------------------------------------------------
   §4.11. Поля
   -------------------------------------------------------------------------- */
body.gw-pf .inner-content input:not(:where([type='submit'],[type='checkbox'],[type='radio'],[type='hidden'])),
body.gw-pf .inner-content textarea,
body.gw-pf .inner-content select,
body.gw-pf .inner-content .select_js_title,
body.gw-pf .aside input:not(:where([type='submit'],[type='checkbox'],[type='radio'],[type='hidden'])),
body.gw-pf .aside select,
body.gw-pf .aside .select_js_title {
    background: var(--gwpf-field-bg);
    border: 1px solid var(--gwpf-field-line);
    border-radius: 12px;
    color: var(--gwpf-text);
    font-family: var(--gwpf-sans);
    font-size: 15px;
    line-height: 20px;
    padding: 0 16px;
    transition: border-color var(--gwpf-t) var(--gwpf-ease),
                box-shadow var(--gwpf-t) var(--gwpf-ease);
}

body.gw-pf .inner-content input:not(:where([type='submit'],[type='checkbox'],[type='radio'],[type='hidden'])),
body.gw-pf .inner-content select,
body.gw-pf .inner-content .select_js_title,
body.gw-pf .aside input:not(:where([type='submit'],[type='checkbox'],[type='radio'],[type='hidden'])),
body.gw-pf .aside select,
body.gw-pf .aside .select_js_title {
    /* min-height, а не height: тема ставит `.select_js{height:5.2rem!important}` —
       min-height выигрывает у height без гонки !important */
    height: 54px;
    min-height: 54px;
}

body.gw-pf .inner-content textarea {
    min-height: 104px;
    padding: 14px 16px;
}

body.gw-pf .inner-content input::placeholder,
body.gw-pf .aside input::placeholder {
    color: var(--gwpf-text-3);
}

body.gw-pf .inner-content input:not([type='submit']):focus,
body.gw-pf .inner-content textarea:focus,
body.gw-pf .inner-content select:focus,
body.gw-pf .aside input:not([type='submit']):focus,
body.gw-pf .aside select:focus,
body.gw-pf .inner-content .select_js.open .select_js_title {
    border-color: var(--gwpf-line-gold);
    box-shadow: 0 0 0 3px rgba(214, 165, 90, .16);
    outline: none;
}

/* Поля сумм — крупный сериф светлым золотом: это тоже цифра сделки. */
body.gw-pf .inner-content input.js_sum1,
body.gw-pf .inner-content input.js_sum2 {
    font-family: var(--gwpf-serif);
    font-size: 34px;
    font-weight: 400;
    color: var(--gwpf-gold-3);
    /* lining-nums обязателен ИМЕННО В ПОЛЕ: у Cormorant по умолчанию цифры
       строчные, и набранная клиентом «1» выглядит как «I». В цифре-героине
       (§4.6) начертание остаётся умолчательным — так утверждён эталон. */
    font-variant-numeric: lining-nums tabular-nums;
}

/* Подписи над полями — та же шкала, что у .gwpf-lbl (правка 14.09.2026). */
body.gw-pf .inner-content .xchange_sum_label,
body.gw-pf .inner-content .xchange_pers_label,
body.gw-pf .inner-content .xchange_curs_label,
body.gw-pf .aside .form_field_label {
    margin-bottom: 6px;
    font-size: 12.5px;
    line-height: 18px;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--gwpf-text-2);
}

/* Звёздочка обязательности — золото, не красное: это требование, не ошибка. */
body.gw-pf .inner-content .req,
body.gw-pf .aside .req {
    color: var(--gwpf-gold);
}

/* min/max и «с комиссией» — одна типографика на все служебные цифры. */
body.gw-pf .inner-content .xchange_info_line,
body.gw-pf .inner-content .xchange_sumandcom,
body.gw-pf .inner-content .xchange_data_discount {
    font-size: 12.5px;
    line-height: 17px;
    color: var(--gwpf-text-3);
    font-variant-numeric: tabular-nums;
}

/* Кегль и цвет вендор держит на ВНУТРЕННЕМ узле (`p.span_give_max`,
   `span.js_amount`), поэтому одной строкой-родителем min/max не перекрасить —
   числа остались бы оранжевыми и крупными. */
body.gw-pf .inner-content :is(.xchange_info_line, .xchange_sumandcom,
                              .xchange_data_discount) :is(p, span, b) {
    font-size: inherit;
    line-height: inherit;
    font-weight: inherit;
    color: inherit;
}

body.gw-pf .inner-content .js_error,
body.gw-pf .aside .form_field_errors {
    font-size: 12px;
    line-height: 16px;
    color: var(--gwpf-err);
}

body.gw-pf .inner-content .js_wrap_error.error input,
body.gw-pf .inner-content .js_wrap_error.error textarea,
body.gw-pf .inner-content .js_wrap_error.error .select_js_title {
    border-color: var(--gwpf-err);
}

/* Кастомный селект вендора. Показ/скрытие списка вендор делает инлайновым
   display — трогать display нельзя. */
body.gw-pf .inner-content .select_js,
body.gw-pf .aside .select_js {
    min-height: 54px;
}

body.gw-pf .inner-content .select_js_title,
body.gw-pf .aside .select_js_title {
    display: flex;
    align-items: center;
    gap: 12px;
    cursor: pointer;
}

body.gw-pf .inner-content .select_js_title .select_txt,
body.gw-pf .aside .select_js_title .select_txt {
    font-size: 15px;
    line-height: 20px;
    font-weight: 400;
    color: var(--gwpf-text);
}

/* Логотип валюты — 28 px в круге с волоском: монеты приходят разными PNG,
   общий круг делает ряд ровным. */
body.gw-pf .inner-content .select_js .select_ico {
    width: 28px;
    height: 28px;
    flex: 0 0 auto;
    border-radius: 50%;
    border: 1px solid var(--gwpf-line);
    background-size: 22px;
    background-position: center;
    background-repeat: no-repeat;
}

body.gw-pf .inner-content .select_js_ul,
body.gw-pf .inner-content .select_js_ul .select_js_ul_ins,
body.gw-pf .aside .select_js_ul,
body.gw-pf .aside .select_js_ul .select_js_ul_ins {
    background: var(--gwpf-s2);
    border-radius: 12px;
}

body.gw-pf .inner-content .select_js_ul {
    border: 1px solid var(--gwpf-line);
    box-shadow: 0 30px 60px -40px rgba(0, 0, 0, .9);
}

body.gw-pf .inner-content .select_js_ulli,
body.gw-pf .aside .select_js_ulli {
    color: var(--gwpf-text-2);
    transition: background-color var(--gwpf-t) var(--gwpf-ease), color var(--gwpf-t) var(--gwpf-ease);
}

body.gw-pf .inner-content .select_js_ulli:hover,
body.gw-pf .aside .select_js_ulli:hover {
    background: rgba(255, 255, 255, .05);
    color: var(--gwpf-text);
}

body.gw-pf .inner-content .select_js_ulli.active,
body.gw-pf .aside .select_js_ulli.active {
    background: rgba(214, 165, 90, .12);
    color: var(--gwpf-text);
}

body.gw-pf .inner-content .select_js_search input,
body.gw-pf .aside .select_js_search input {
    background: var(--gwpf-field-bg);
    border: 1px solid var(--gwpf-line-gold);
    border-radius: 12px;
    color: var(--gwpf-text);
}

/* Чекбокс согласия. Строка НЕ флексовая намеренно: внутри подписи живут ссылки
   («условиями обмена», «AML проверки») — во флекс-контейнере каждая стала бы
   отдельным элементом и текст рассыпался бы на столбцы. */
body.gw-pf .inner-content .xchange_checkdata_div label,
body.gw-pf .inner-content .exchange_checkpersdata label {
    position: relative;
    display: block;
    padding-left: 30px;
    font-size: 13.5px;
    line-height: 20px;
    color: var(--gwpf-text-2);
    cursor: pointer;
}

body.gw-pf .inner-content .xchange_checkdata_div label > input[type='checkbox'],
body.gw-pf .inner-content .exchange_checkpersdata label > input[type='checkbox'] {
    position: absolute;
    left: 0;
    top: 0;
}

body.gw-pf .inner-content input[type='checkbox'],
body.gw-pf .aside input[type='checkbox'] {
    appearance: none;
    -webkit-appearance: none;
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    margin: 0;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 6px;
    background: var(--gwpf-field-bg);
    cursor: pointer;
    transition: border-color var(--gwpf-t) var(--gwpf-ease), background-color var(--gwpf-t) var(--gwpf-ease);
}

/* Отметка — золотой ромб, тот же знак, что у статуса и у «правила». */
body.gw-pf .inner-content input[type='checkbox']:checked,
body.gw-pf .aside input[type='checkbox']:checked {
    border-color: var(--gwpf-gold);
    background-color: rgba(214, 165, 90, .12);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 3.4l4.6 4.6L8 12.6 3.4 8z' fill='%23d6a55a'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 12px;
}

body.gw-pf .inner-content .xchange_checkdata_div label a {
    color: var(--gwpf-gold-2);
    text-decoration: none;
}

body.gw-pf .inner-content .xchange_checkdata_div label a:hover {
    text-decoration: underline;
}

body.gw-pf .inner-content .captcha_body,
body.gw-pf .aside .captcha_body {
    display: flex;
    align-items: center;
    gap: 8px;
}

body.gw-pf .inner-content input.captcha_divpole,
body.gw-pf .aside input.captcha_divpole {
    width: 54px;
    min-width: 54px;
    padding: 0;
    text-align: center;
}

/* Иконка обновления капчи — картинка темы с зашитым внутри #D79858
   (`refresh=Variant1.svg`). Цвет живёт в РАСТРЕ, поэтому обходом вычисленных
   стилей он не ловится (находка ревью №4 — та же дыра в проверке). Картинку
   гасим, ту же форму рисуем маской: цвет тогда приходит из токена. Класс
   `.act` темы подменяет картинку на крутящийся лоадер — там не мешаем. */
body.gw-pf .inner-content .captcha_reload:not(.act),
body.gw-pf .aside .captcha_reload:not(.act) {
    background-image: none;
    background-color: var(--gwpf-gold);
    -webkit-mask: url(../images/icons/refresh=Variant1.svg) no-repeat center / contain;
    mask: url(../images/icons/refresh=Variant1.svg) no-repeat center / contain;
}

body.gw-pf .inner-content .captcha_reload,
body.gw-pf .aside .captcha_reload {
    opacity: .55;
    transition: opacity var(--gwpf-t) var(--gwpf-ease);
}

body.gw-pf .inner-content .captcha_reload:hover,
body.gw-pf .aside .captcha_reload:hover {
    opacity: 1;
}

/* -----------------------------------------------------------------------------
   §6. Карточки сайдбара: помощь и доверие
   -------------------------------------------------------------------------- */
body.gw-pf .gwpf-help,
body.gw-pf .gwpf-trust {
    padding: 24px;
    border: 1px solid var(--gwpf-line);
    border-radius: 20px;
    background: var(--gwpf-s1);
    font-family: var(--gwpf-sans);
}

body.gw-pf .gwpf-help :is(h3, h4, .gwpf-help-title) {
    margin: 0 0 6px;
    font-family: var(--gwpf-serif);
    font-size: 22px;
    line-height: 1.2;
    font-weight: 400;
    color: var(--gwpf-text);
}

body.gw-pf .gwpf-help p {
    margin: 0 0 16px;
    font-size: 13px;
    line-height: 1.5;
    color: var(--gwpf-text-2);
}

body.gw-pf .gwpf-trust {
    display: grid;
    gap: 12px;
    font-size: 12.5px;
    line-height: 1.45;
    color: var(--gwpf-text-2);
}

body.gw-pf .gwpf-trust > :is(div, li) {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    list-style: none;
    margin: 0;
}

body.gw-pf .gwpf-trust > :is(div, li) > i {
    flex: 0 0 auto;
    width: 5px;
    height: 5px;
    margin-top: 8px;
    background: var(--gwpf-gold);
    transform: rotate(45deg);
}

/* Ромб для случая, когда строка пришла без <i> внутри. */
body.gw-pf .gwpf-trust > :is(div, li):not(:has(> i))::before {
    content: '';
    flex: 0 0 auto;
    width: 5px;
    height: 5px;
    margin-top: 8px;
    background: var(--gwpf-gold);
    transform: rotate(45deg);
}

/*
 * Карточка доверия приходит списком (<ul>), и снимать с него надо ровно ОДНО —
 * вертикальные поля `margin-block: 1em` браузерного стиля. `padding: 0` здесь
 * стоять НЕ МОЖЕТ: селектор с тегом (0,2,2) тяжелее и десктопного правила
 * карточки (0,2,1), и мобильного, поэтому он гасил не отступ списка, а поля
 * САМОЙ КАРТОЧКИ — строки липли к рамке, а ромбы вылезали за неё наружу.
 * Браузерный `padding-inline-start: 40px` перебивать нечем и не нужно: любое
 * авторское правило сильнее пользовательского агента, и `padding` карточки
 * (24 px, на мобильном 20/18) выигрывает у него сам.
 */
body.gw-pf ul.gwpf-trust {
    margin: 0;
    list-style: none;
}

/* «Детали заявки» в сайдбаре (20.09.2026): копия строк «Отдаёте/Получаете»
   и реквизитов, всегда раскрыта — владелец держит их для сверки перед
   переводом. Узлы ставит gw-premium-flow.js (applyAsideDetails). */
body.gw-pf .gwpf-aside-details {
    font-family: var(--gwpf-sans);
}

body.gw-pf .gwpf-aside-details .gwpf-help-title {
    margin: 0 0 14px;
    font-family: var(--gwpf-serif);
    font-size: 22px;
    line-height: 1.2;
    font-weight: 400;
    color: var(--gwpf-text);
}

body.gw-pf dl.gwpf-ad-list {
    display: grid;
    gap: 0;
    margin: 0;
}

/* Группы «отдаёте» / «получаете» — по вендорным .block_payinfo_give/_get;
   между ними тонкая линия, внутри группы строки столбиком без линий:
   подпись капителью над значением. Две колонки (подпись слева, значение
   справа) в сайдбаре 290 px не живут — «3862.79 Банковская карта THB»
   наезжала на подпись (скрин владельца 20.09.2026). */
body.gw-pf .gwpf-ad-group {
    display: grid;
    gap: 12px;
    padding: 14px 0;
    border-top: 1px solid var(--gwpf-line);
}

body.gw-pf .gwpf-ad-group:first-child {
    padding-top: 0;
    border-top: 0;
}

body.gw-pf .gwpf-ad-group:last-child {
    padding-bottom: 0;
}

body.gw-pf .gwpf-ad-row {
    display: block;
    min-width: 0;
}

body.gw-pf .gwpf-ad-row > dt {
    margin: 0 0 4px;
    font-size: 10.5px;
    line-height: 1.4;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--gwpf-text-3);
}

body.gw-pf .gwpf-ad-row > dd {
    margin: 0;
    font-size: 14px;
    line-height: 1.45;
    color: var(--gwpf-text);
    overflow-wrap: anywhere;
}

/* Сумма: число серифом крупно, валюта/способ мельче и приглушённо; на
   одной строке, пока влезает, дальше валюта уходит под число. */
body.gw-pf .gwpf-ad-row--amount > dd {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 2px 8px;
}

body.gw-pf .gwpf-ad-num {
    font-family: var(--gwpf-serif);
    font-size: 24px;
    line-height: 1.1;
    font-weight: 500;
    letter-spacing: .01em;
    color: var(--gwpf-gold-3);
    font-variant-numeric: lining-nums tabular-nums;
}

body.gw-pf .gwpf-ad-cur {
    font-size: 13px;
    line-height: 1.4;
    color: var(--gwpf-text-2);
}

/* Реквизит из ASCII-знаков с цифрами (адрес, номер карты/счёта) — моноширинным. */
body.gw-pf .gwpf-ad-row--mono > dd {
    font-family: var(--gwpf-mono);
    font-size: 12px;
    letter-spacing: 0;
    color: var(--gwpf-gold-3);
}

/* §6: 18 px между карточками сайдбара. Отступ живёт на ПАРЕ, а не на карточке:
   в сайдбаре она может оказаться единственной, и тогда пустота сверху ни от чего. */
body.gw-pf .aside > .gwpf-mini + .gwpf-mini {
    margin-top: 18px;
}

/* -----------------------------------------------------------------------------
   Строка-аккордеон «Детали заявки» (§5.3) — под героем, отдельной поверхностью.
   -------------------------------------------------------------------------- */
body.gw-pf .gwpf-details {
    margin-top: 22px;
    padding: 22px 28px;
    border: 1px solid var(--gwpf-line);
    border-radius: 20px;
    background: none;
    box-shadow: none;
    font-family: var(--gwpf-sans);
    font-size: 13px;
    line-height: 1.5;
    color: var(--gwpf-text-2);
}

body.gw-pf .gwpf-details .gwpf-details-head,
body.gw-pf .gwpf-details > .gwpf-acc-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    width: 100%;
    padding: 0;
    background: none;
    border: 0;
    font-family: inherit;
    font-size: inherit;
    color: inherit;
    text-align: left;
    cursor: pointer;
}

body.gw-pf .gwpf-details .gwpf-details-title,
body.gw-pf .gwpf-details .gwpf-acc-title {
    font-size: 11px;
    line-height: 14px;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--gwpf-text-3);
}

/* Сводка идёт СРАЗУ за подписью, одной фразой, как в эталоне
   («ДЕТАЛИ ЗАЯВКИ · 250 USDT → 22 166 ₽ …»); вправо уходит только шеврон.
   Разделитель печатает CSS: в текст сводки его класть нельзя — она собирается
   из вендорных строк и уезжает в тот же узел при каждом пересчёте курса. */
body.gw-pf .gwpf-details .gwpf-details-sum {
    flex: 1 1 auto;
    min-width: 0;
    color: var(--gwpf-text-2);
    font-variant-numeric: lining-nums tabular-nums;
}

body.gw-pf .gwpf-details .gwpf-details-sum:not(:empty)::before {
    content: '·';
    margin-right: 10px;
    color: var(--gwpf-text-3);
}

body.gw-pf .gwpf-details .gwpf-acc-chevron {
    margin-left: auto;
}

/* -----------------------------------------------------------------------------
   Отзывы в сайдбаре (§5.1 и §5.5). Правила ПЕРЕЕХАЛИ СЮДА из direction.css:
   тот подключается только на шаге 1, поэтому на «выполненной» тот же вендорный
   виджет выглядел вендорным — имя и дата сверху, волосок, текст, без кавычки, —
   то есть один компонент на двух экранах одного потока читался как два разных.
   -------------------------------------------------------------------------- */
/* Вид `.gwpf-mini` объявлен выше по файлу один раз; здесь — только вендорный
   виджет входа, которому тот же вид нужен и без скрипта. */
body.gw-pf .aside .login_widget {
    padding: 22px 24px;
    background: var(--gwpf-s1);
    border: 1px solid var(--gwpf-line);
    border-radius: 20px;
    box-shadow: none;
}

/* Заголовок-переключатель. Это НЕ <button> намеренно: узел лежит внутри формы
   входа, и кнопка отправляла бы её по Enter. Роль и tabindex ставит скрипт. */
body.gw-pf .aside .login_widget .login_widget_title {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0;
    text-align: left;   /* тема центрует заголовок виджета авторизации */
    cursor: pointer;
}

body.gw-pf .aside .login_widget .login_widget_title_ins {
    flex: 0 0 auto;
    width: auto;
    text-align: left;
    font-family: var(--gwpf-serif);
    font-size: 22px;
    line-height: 1.2;
    font-weight: 400;
    color: var(--gwpf-text);
}

body.gw-pf .aside .login_widget .gwpf-login-hint {
    margin-left: auto;
    font-family: var(--gwpf-sans);
    font-size: 12.5px;
    font-weight: 400;
    letter-spacing: .02em;
    text-transform: none;
    color: var(--gwpf-text-3);
}

/* Пустой контейнер ошибок входа тема держит с отступом 20px — у свёрнутой
   карточки он превращался в полосу пустоты под заголовком. Появится текст
   ошибки — правило перестанет действовать само (`:empty`). */
body.gw-pf .aside .login_widget .resultgo:empty {
    display: none;
    margin: 0;
}

/* Свёрнутое состояние ставит скрипт скина; без класса виджет работает как раньше.
   Форма остаётся в DOM целиком — на ней висит вендорный ajaxForm. */
body.gw-pf .aside .login_widget.gwpf-collapsed .login_widget_body {
    display: none;
}

body.gw-pf .aside .login_widget.gwpf-collapsed.is-open .login_widget_body {
    display: block;
}

body.gw-pf .aside .login_widget.gwpf-collapsed.is-open .login_widget_title,
body.gw-pf .aside .login_widget:not(.gwpf-collapsed) .login_widget_title {
    margin-bottom: 18px;   /* форма раскрыта (или скрипт скина не отработал) — заголовку нужен воздух */
}

body.gw-pf .aside .form_field_line {
    margin-bottom: 14px;
}

body.gw-pf .aside .form_field_label .form_field_label_ins {
    font-family: var(--gwpf-sans);
    font-size: 12px;
    line-height: 15px;
    font-weight: 500;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--gwpf-text-3);
}

body.gw-pf .aside .widget_log_line_text {
    margin-top: 14px;
    font-size: 12.5px;
    line-height: 18px;
}

body.gw-pf .aside .widget_log_line_text a {
    color: var(--gwpf-text-2);
    text-decoration: none;
}

body.gw-pf .aside .widget_log_line_text a:hover {
    color: var(--gwpf-gold-2);
}

/* Отзывы: контейнер перестаёт быть карточкой — карточки здесь сами цитаты,
   иначе получилась бы коробка в коробке (§4.4).
   `border-radius: 0` тут обязателен: у темы контейнер с `overflow: hidden`, и
   оставшийся от карточки радиус скругляет ОБЛАСТЬ ОТСЕЧЕНИЯ — заголовок,
   прижатый к верхнему краю, терял первые буквы («Отзывы» → «зывы»). */
body.gw-pf .aside .widget_reviews_div {
    padding: 0;
    background: none;
    border: 0;
    border-radius: 0;
    overflow: visible;
    box-shadow: none;
}

body.gw-pf .aside .widget_reviews_div .widget_title {
    margin: 0 0 14px;
    text-align: left;
}

body.gw-pf .aside .widget_reviews_div .widget_title .widget_titlevn {
    font-family: var(--gwpf-sans);
    font-size: 11px;
    line-height: 15px;
    font-weight: 500;
    letter-spacing: .2em;
    text-transform: uppercase;
    color: var(--gwpf-gold-dim);
}

body.gw-pf .aside .widget_reviews_div .widget_items {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

body.gw-pf .aside .widget_reviews_line {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 4px 10px;
    margin: 0;
    padding: 22px 22px 20px;
    background: var(--gwpf-s1);
    border: 1px solid var(--gwpf-line);
    border-radius: 20px;
}

/* Цитата идёт первой: карточка отзыва — это текст, а не подпись автора.
   `border-top` темы обязателен к снятию: у неё цитата стоит ПОСЛЕ автора и линия
   их разделяла; после перестановки та же линия висела над первой строкой карточки
   ни к чему не относящейся чертой. */
body.gw-pf .aside .widget_reviews_content {
    position: relative;
    order: 1;
    flex: 0 0 100%;
    border-top: 0;
    padding-top: 0;
    margin: 0 0 14px;
    padding-left: 28px;
    font-family: var(--gwpf-sans);
    font-size: 13px;
    line-height: 19px;
    color: var(--gwpf-text-2);
}

/* Серифная кавычка — единственное украшение сайдбара (§5.1). */
body.gw-pf .aside .widget_reviews_content::before {
    content: '«';
    position: absolute;
    left: -2px;
    top: -6px;
    font-family: var(--gwpf-serif);
    font-size: 34px;
    line-height: 1;
    color: var(--gwpf-gold-dim);
}

body.gw-pf .aside .widget_reviews_author {
    order: 2;
    font-family: var(--gwpf-sans);
    font-size: 13px;
    line-height: 17px;
    font-weight: 500;
    color: var(--gwpf-text);
}

body.gw-pf .aside .widget_reviews_date {
    order: 3;
    margin-left: auto;
    font-size: 12px;
    line-height: 17px;
    color: var(--gwpf-text-3);
    font-variant-numeric: tabular-nums;
}

body.gw-pf .aside .widget_reviews_line .clear {
    display: none;
}

body.gw-pf .aside .widget_reviews_more_wrap {
    margin-top: 16px;
}

/* «Все отзывы» — ghost-кнопка (§4.8): у темы это широкая белая плашка, которая
   в сайдбаре спорит с primary формы. */
body.gw-pf .aside .widget_reviews_more {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    padding: 0 18px;
    background: none;
    border: 1px solid var(--gwpf-line-gold);
    border-radius: 10px;
    box-shadow: none;
    font-family: var(--gwpf-sans);
    font-size: 12.5px;
    font-weight: 400;
    letter-spacing: .06em;
    color: var(--gwpf-gold-2);
    text-decoration: none;
}

body.gw-pf .aside .widget_reviews_more:hover {
    border-color: var(--gwpf-gold-dim);
    color: var(--gwpf-gold-3);
    text-decoration: none;
}

body.gw-pf .aside .widget_reviews_more span {
    background: none;
    color: inherit;
    -webkit-text-fill-color: currentColor;
}

/* -----------------------------------------------------------------------------
   Блок дополнительных опций (`gw-extra-options`, отдельный слой темы). Живёт
   и на шаге 1, и в карточке заявки, поэтому правила общие.

   ПОЧЕМУ ЭТО ВООБЩЕ ЗДЕСЬ. Свой файл блока (`css/gw-extra-options.css`) набран
   в палитре v1: рамка и фон `rgba(215,152,88,…)` — это #d79858, оранжевое
   золото, плюс токен темы `--Colors-Fills-Primary` на заголовке, чекбоксе,
   цене и итоге. Приёмка §9 п.2 этого не видела и увидеть не могла: на
   направлениях БЕЗ допов узел стоит с инлайновым `display:none`, а обход
   вычисленных стилей не считает нарушением то, чего сейчас не видно. На
   боевом направлении с допами блок виден всегда — и это была коричневая
   коробка с рамкой прямо над primary-кнопкой, то есть ещё и вложенная рамка
   внутри героя (§4.4 её запрещает).

   Токен переопределяем ТОЧЕЧНО, на самом блоке: внутри него он красит четыре
   разные вещи, и перебивать их поимённо значило бы завести пятую копию
   палитры.
   -------------------------------------------------------------------------- */
body.gw-pf .gw-extra-options {
    --Colors-Fills-Primary: var(--gwpf-gold);
    margin: 30px 0 0;
    padding: 26px 0 0;
    border: 0;
    border-radius: 0;
    background: none;
    /* Вместо рамки — воздух и волосок с ромбом по центру (§4.4). */
    background-image: linear-gradient(90deg, transparent, var(--gwpf-line-gold) 50%, transparent);
    background-repeat: no-repeat;
    background-size: 100% 1px;
    background-position: top left;
}

body.gw-pf .gw-extra-options .gw-extra-options__title {
    font-family: var(--gwpf-sans);
    font-size: 12px;
    line-height: 18px;
    font-weight: 400;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--gwpf-text-3);
}

body.gw-pf .gw-extra-options .gw-extra-option {
    border-radius: var(--gwpf-r-s);
}

body.gw-pf .gw-extra-options .gw-extra-option__check {
    border-color: var(--gwpf-line-gold);
    border-radius: 4px;
}

body.gw-pf .gw-extra-options .gw-extra-option__label,
body.gw-pf .gw-extra-options .gw-extra-option__cost {
    font-family: var(--gwpf-sans);
    font-size: 13.5px;
    line-height: 20px;
    color: var(--gwpf-text-2);
}

body.gw-pf .gw-extra-options .gw-extra-option.is-active .gw-extra-option__label {
    color: var(--gwpf-text);
}

body.gw-pf .gw-extra-options .gw-extra-option.is-active .gw-extra-option__cost,
body.gw-pf .gw-extra-options .gw-extra-options__total {
    color: var(--gwpf-gold-2);
}

body.gw-pf .gw-extra-options .gw-extra-options__total {
    font-family: var(--gwpf-sans);
    font-size: 13.5px;
    line-height: 20px;
    border-top-color: var(--gwpf-line);
}

body.gw-pf .gw-extra-options .gw-extra-option__tip-wrap input {
    border-color: var(--gwpf-line);
    border-radius: 10px;
    background: var(--gwpf-field-bg);
    color: var(--gwpf-text);
}

body.gw-pf .gw-extra-options .gw-extra-option__hint {
    background: rgba(255, 255, 255, .06);
    color: var(--gwpf-text-3);
}

/* -----------------------------------------------------------------------------
   Аккордеон условий (§5.1). Класс скрипт вешает на сам вендорный .notice_message.
   Свёрнутость держим на grid-строке, а не на display: содержимое остаётся
   в потоке и доступно поиску по странице.
   -------------------------------------------------------------------------- */
body.gw-pf .gwpf-acc {
    overflow: hidden;
}

body.gw-pf .gwpf-acc-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    width: 100%;
    padding: 0;
    background: transparent;
    border: 0;
    color: var(--gwpf-text);
    font-family: var(--gwpf-sans);
    text-align: left;
    cursor: pointer;
}

body.gw-pf .gwpf-acc-title {
    font-size: 11px;
    line-height: 14px;
    font-weight: 400;
    letter-spacing: .2em;
    text-transform: uppercase;
    color: var(--gwpf-gold-dim);
}

body.gw-pf .gwpf-acc-chevron {
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    background-color: var(--gwpf-gold-dim);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / contain;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / contain;
    transition: transform var(--gwpf-t) var(--gwpf-ease);
}

body.gw-pf .gwpf-acc.is-open .gwpf-acc-chevron,
body.gw-pf .gwpf-details.is-open .gwpf-acc-chevron {
    transform: rotate(180deg);
}

body.gw-pf .gwpf-acc-body {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows var(--gwpf-t) var(--gwpf-ease);
}

body.gw-pf .gwpf-acc-body > * {
    overflow: hidden;
    min-height: 0;
}

body.gw-pf .gwpf-acc.is-open .gwpf-acc-body,
body.gw-pf .gwpf-details.is-open .gwpf-acc-body {
    grid-template-rows: 1fr;
    margin-top: 18px;
}

/* Маркер списка перед ссылкой мониторинга (§5.5): сама ссылка стала
   ghost-кнопкой, и точка повисла между рамками. Узел свой (скрипт обернул
   вендорный текстовый узел), текст страницы при этом не изменён. */
body.gw-pf .gwpf-sep {
    display: none;
}

/* Первый абзац уехал в заголовок кнопки — в теле он был бы вторым таким же. */
body.gw-pf .gwpf-acc .gwpf-acc-lead {
    display: none;
}

body.gw-pf .inner-content .gwpf-acc:not(.is-open) {
    padding-top: 20px;
    padding-bottom: 20px;
}

/* -----------------------------------------------------------------------------
   Лента статусов (§5.4) — узлы-ромбы на вертикальной линии.
   -------------------------------------------------------------------------- */
body.gw-pf .gwpf-timeline {
    display: flex;
    flex-direction: column;
    margin: 0;
    padding: 0;
    list-style: none;
}

body.gw-pf .gwpf-tl-item {
    position: relative;
    display: flex;
    align-items: baseline;
    gap: 14px;
    padding: 0 0 22px;
}

body.gw-pf .gwpf-tl-item:last-child {
    padding-bottom: 0;
}

/* Линия между узлами ленты. --gwpf-line (7 % белого) на карточке-герое, у
   которой фон и так почти чёрный, не читалась вовсе: лента распадалась на
   отдельные ромбы, и «путь заявки» переставал быть путём. Поднято до 14 %,
   у пройденного отрезка — золото. */
body.gw-pf .gwpf-tl-item:not(:last-child)::before {
    content: '';
    position: absolute;
    left: 3px;
    top: 14px;
    bottom: 0;
    width: 1px;
    background: rgba(255, 255, 255, .14);
}

body.gw-pf .gwpf-tl-item.is-done:not(:last-child)::before {
    background: var(--gwpf-gold-dim);
}

body.gw-pf .gwpf-tl-dot {
    position: relative;
    flex: 0 0 auto;
    align-self: center;
    width: 7px;
    height: 7px;
    border: 1px solid rgba(255, 255, 255, .2);
    background: transparent;
    transform: rotate(45deg);
}

body.gw-pf .gwpf-tl-item.is-done .gwpf-tl-dot {
    border-color: var(--gwpf-gold);
    background: var(--gwpf-gold);
}

body.gw-pf .gwpf-tl-item.is-active .gwpf-tl-dot {
    border-color: var(--gwpf-gold);
    background: var(--gwpf-gold);
    box-shadow: 0 0 12px rgba(214, 165, 90, .8);
    animation: gwpf-pulse 2.4s ease-in-out infinite;
}

body.gw-pf .gwpf-tl-text {
    flex: 1 1 auto;
    font-size: 14px;
    line-height: 20px;
    color: var(--gwpf-text-3);
}

body.gw-pf .gwpf-tl-item.is-done .gwpf-tl-text,
body.gw-pf .gwpf-tl-item.is-active .gwpf-tl-text {
    color: var(--gwpf-text);
}

body.gw-pf .gwpf-tl-date {
    flex: 0 0 auto;
    font-size: 12.5px;
    line-height: 18px;
    color: var(--gwpf-text-3);
    font-variant-numeric: tabular-nums;
}

/* Копия строки курса нужна только в липкой панели, то есть только на мобильном:
   на десктопе оригинал под заголовком виден всегда. */
body.gw-pf .gwpf-sticky > .gwpf-rate-line {
    display: none;
}

body.gw-pf .gwpf-rate-line {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 4px 10px;
    margin: 0 0 22px;
    font-size: 12.5px;
    line-height: 18px;
    color: var(--gwpf-text-2);
    font-variant-numeric: tabular-nums;
}

/* -----------------------------------------------------------------------------
   §5.6. Главная — только шапка (выше) и токены формы. Никаких перестановок,
   свечения здесь нет: у главной свой hero с китом.
   -------------------------------------------------------------------------- */
body.gw-pf .xchange_type_list {
    border: 1px solid var(--gwpf-line-gold);
    border-radius: var(--gwpf-r);
    background: var(--gwpf-card);
    box-shadow: var(--gwpf-hero-shadow);
}

body.gw-pf .xchange_type_list input:not([type='submit']),
body.gw-pf .xchange_type_list .select_js_title {
    background: var(--gwpf-field-bg);
    border: 1px solid var(--gwpf-field-line);
    border-radius: 12px;
    color: var(--gwpf-text);
}

body.gw-pf .xchange_type_list input:not([type='submit']):focus,
body.gw-pf .xchange_type_list .select_js.open .select_js_title {
    border-color: var(--gwpf-line-gold);
    box-shadow: 0 0 0 3px rgba(214, 165, 90, .16);
    outline: none;
}

body.gw-pf .xchange_type_list input.js_sum1,
body.gw-pf .xchange_type_list input.js_sum2 {
    font-family: var(--gwpf-serif);
    font-size: 28px;
    font-weight: 400;
    color: var(--gwpf-gold-3);
    font-variant-numeric: lining-nums tabular-nums;
}

body.gw-pf .xchange_type_list .xtl_table_title {
    font-size: 11px;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--gwpf-gold-dim);
}

body.gw-pf .xchange_type_list .xtl_submit {
    background: var(--gwpf-btn);
    color: #1c1408;
    font-family: var(--gwpf-sans);
    font-size: 14px;
    font-weight: 600;
    letter-spacing: .14em;
    text-transform: uppercase;
    /* тема пишет `border-radius:4rem!important` — иначе кнопка остаётся капсулой */
    border-radius: var(--gwpf-r-s) !important;
    box-shadow: var(--gwpf-btn-shadow);
    transition: filter var(--gwpf-t) var(--gwpf-ease);
}

body.gw-pf .xchange_type_list .xtl_submit:hover {
    background: var(--gwpf-btn);
    filter: brightness(1.04);
}

/* -----------------------------------------------------------------------------
   Движение блоков и доступность
   -------------------------------------------------------------------------- */
body.gw-pf .inner-content > :is(.notice_message, .warning_message, .xchange_div,
                                .gwpf-acc, .block_xchangedata, .block_payinfo,
                                .block_statusbids, .gwpf-hero) {
    animation: gwpf-rise .5s var(--gwpf-ease) both;
}

body.gw-pf .inner-content > :is(.notice_message, .warning_message, .xchange_div,
                                .gwpf-acc, .block_xchangedata, .block_payinfo,
                                .block_statusbids, .gwpf-hero):nth-child(2) { animation-delay: .04s; }
body.gw-pf .inner-content > :is(.notice_message, .warning_message, .xchange_div,
                                .gwpf-acc, .block_xchangedata, .block_payinfo,
                                .block_statusbids, .gwpf-hero):nth-child(3) { animation-delay: .08s; }
body.gw-pf .inner-content > :is(.notice_message, .warning_message, .xchange_div,
                                .gwpf-acc, .block_xchangedata, .block_payinfo,
                                .block_statusbids, .gwpf-hero):nth-child(n+4) { animation-delay: .12s; }

body.gw-pf :focus-visible {
    outline: 2px solid var(--gwpf-gold-2);
    outline-offset: 2px;
}

/* -----------------------------------------------------------------------------
   §4.12. Футер (добавлено 14.09.2026 по ревью). Тема печатает его белым Inter
   700 по 32 px на чёрном #000 — на каждом экране заявки это было самое громкое
   пятно после кнопки, и оно рвало язык скина. Заголовки → сериф 22 px,
   ссылки 14 px второго тона, тонкая золотая линия сверху, тот же логотип,
   что в шапке, но 96 px. Разметку и порядок колонок не трогаем.
   -------------------------------------------------------------------------- */
body.gw-pf > footer.footer {
    background: transparent;
    border-top: 1px solid var(--gwpf-line-gold);
    padding: 48px 0 36px;
}

body.gw-pf .footer__nav h2 {
    margin: 0 0 14px;
    font-family: var(--gwpf-serif);
    font-size: 22px;
    line-height: 1.2;
    font-weight: 400;
    letter-spacing: .01em;
    color: var(--gwpf-text);
}

body.gw-pf .footer__menu a,
body.gw-pf .footer__menu a span,
body.gw-pf .footer__link,
body.gw-pf .footer__link span,
body.gw-pf .footer__info p {
    font-family: var(--gwpf-sans);
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    color: var(--gwpf-text-2);
}

body.gw-pf .footer__menu a:hover,
body.gw-pf .footer__menu a:hover span,
body.gw-pf .footer__link:hover span {
    color: var(--gwpf-gold-2);
}

body.gw-pf .footer__menu li {
    margin-bottom: 6px;
}

body.gw-pf .footer__info p {
    color: var(--gwpf-text-3);
}

body.gw-pf .footer__bottom {
    padding-top: 28px;
    border-top: 1px solid var(--gwpf-line);
}

body.gw-pf .footer__logo img {
    width: 96px;
    height: auto;
}

body.gw-pf .cop p {
    font-family: var(--gwpf-sans);
    font-size: 12px;
    letter-spacing: .02em;
    color: var(--gwpf-text-3);
}

/* §3: при `prefers-reduced-motion` гаснет ВСЁ движение — дыхание фона, свечение
   цифры, «плывущая» линия героя и пульс статуса. */
@media (prefers-reduced-motion: reduce) {
    /* `body.gw-pf *` — это ПОТОМКИ body, и главный слой свечения
       (`body.gw-pf::before`) под него НЕ попадал: фон продолжал дышать при
       выключенной анимации. Поэтому сам body перечислен отдельно. */
    body.gw-pf,
    body.gw-pf::before,
    body.gw-pf::after,
    body.gw-pf *,
    body.gw-pf *::before,
    body.gw-pf *::after {
        animation: none !important;   /* перебиваем собственные keyframes — иначе не выключить */
        transition: none !important;
    }
}

/* -----------------------------------------------------------------------------
   §8. Мобильная база (<= 768)
   -------------------------------------------------------------------------- */
@media (max-width: 768px) {
    /* Свечение уменьшаем до 60 %: на узком экране пятно в 900 px заливает всё. */
    body.gw-pf:not(.gw-pf-home)::before {
        background: radial-gradient(540px 310px at 42% 22%, rgba(214, 165, 90, .14), transparent 62%);
    }

    body.gw-pf:not(.gw-pf-home) .gwpf-glow2 {
        background: radial-gradient(456px 324px at 86% 80%, rgba(214, 165, 90, .06), transparent 60%);
    }

    body.gw-pf .navigation__wrapper {
        padding-top: 14px;
        padding-bottom: 14px;
    }

    body.gw-pf .gwpf-meta {
        margin-top: 10px;
        text-align: left;
    }

    body.gw-pf .main-wrapper > .main-title,
    body.gw-pf .gwpf-h1 {
        font-size: 30px;
    }

    /* На узком экране кнопка копирования номера переносится на вторую строку
       заголовка, и отрицательный отступ (он нужен только десктопной раскладке,
       где мета стоит справа) клал мету поверх неё. */
    body.gw-pf .main-wrapper > .gwpf-meta {
        margin: 6px 0 18px;
    }

    /* Степпер: только узлы, подпись остаётся у активного шага. */
    /* 44, не 22: под подписью активного узла печатается «Шаг N из 4»
       второй строкой (см. ниже), и при 22 она садилась на рамку героя. */
    body.gw-pf .gwpf-stepper {
        margin-bottom: 44px;
    }

    body.gw-pf .gwpf-step {
        font-size: 10px;
        letter-spacing: .16em;
    }

    /* §8: узлы + подпись активного. Подпись жила в СВОЕЙ ячейке — четверти
       ширины — и обрезалась многоточием («НАПРАВЛЕН…»); влезала она или нет,
       решала длина слова, то есть на одном шаге текст читался, на другом нет.
       Теперь она выходит из ячейки и печатается целиком; ряд узлов ей не
       мешает, потому что подпись лежит под линией. Позиции самих узлов НЕ
       трогаем: они те же, что в утверждённом эталоне (четыре колонки, узел у
       левого края своей). */
    body.gw-pf .gwpf-step .gwpf-step-label {
        position: absolute;
        left: 0;
        top: 30px;
        width: max-content;
        max-width: 100vw;
        overflow: visible;
        text-overflow: clip;
    }

    /* У последнего шага подпись ушла бы за правый край экрана. */
    body.gw-pf .gwpf-step:last-child .gwpf-step-label {
        left: auto;
        right: 0;
        text-align: right;
    }

    body.gw-pf .gwpf-step:not(.is-active) .gwpf-step-label {
        visibility: hidden;
    }

    body.gw-pf .gwpf-hero {
        padding: 28px 22px;
        border-radius: 20px;
    }

    body.gw-pf .gwpf-wm {
        right: -90px;
        top: -90px;
        width: 420px;
    }

    body.gw-pf .inner-content > :is(.notice_message, .warning_message, .xchange_div,
                                    .block_xchangedata, .block_payinfo, .block_statusbids),
    body.gw-pf .exchange_status_html > * > :is(.block_statusbids, .block_xchangedata),
    body.gw-pf .aside :is(.login_widget, .register_widget, .user_widget, .widget),
    body.gw-pf .aside .widget_reviews_line {
        padding: 18px 18px 16px;
        border-radius: 16px;
    }

    body.gw-pf .gwpf-mini,
    body.gw-pf .gwpf-help,
    body.gw-pf .gwpf-trust,
    body.gw-pf .gwpf-details {
        padding: 20px 18px;
        border-radius: 16px;
    }

    body.gw-pf .inner-content .gwpf-acc:not(.is-open) {
        padding-top: 18px;
        padding-bottom: 18px;
    }

    body.gw-pf .gwpf-acc.is-open .gwpf-acc-body {
        margin-top: 14px;
    }

    /* §8: цифра-героиня 52 / 30 / 24. m = 30, не 36 (ревью 14.09.2026):
       «250 Tether TRC20 USDT» — 21 знак, при 36 px в 314 px внутренней
       ширины давал вторую строку-сироту из одного «USDT». 21 знак Cormorant
       300 по 30 px ≈ 265 px — влезает в одну строку. */
    body.gw-pf .gwpf-amount           { --gwpf-amount-size: 30px; }
    body.gw-pf .gwpf-amount.is-len-s  { --gwpf-amount-size: 52px; }
    body.gw-pf .gwpf-amount.is-len-m  { --gwpf-amount-size: 30px; }
    body.gw-pf .gwpf-amount.is-len-l  { --gwpf-amount-size: 24px; }

    /* Строка статуса: .12em и 11 px — на .2em «ПРИНЯТА, ОЖИДАЕТ ОПЛАТЫ
       КЛИЕНТОМ» рвалась на две строки. */
    body.gw-pf .gwpf-status {
        font-size: 11px;
        letter-spacing: .12em;
    }

    /* Водяной кит на узком экране виден как обрезок у правого верха карточки. */
    body.gw-pf .gwpf-wm {
        display: none;
    }

    /* «ДЕТАЛИ / ЗАЯВКИ» рвалось в два слова в узкой голове — на телефоне
       остаётся только сводка «250 USDT → 22 166 ₽», она говорит больше. */
    body.gw-pf .gwpf-details .gwpf-details-title {
        display: none;
    }

    body.gw-pf .gwpf-details .gwpf-details-sum:not(:empty)::before {
        content: none;
    }

    /* Строка автообновления: «выключить» уезжало сиротой на вторую строку —
       текст слева, ссылка справа, одной строкой. */
    body.gw-pf .gwpf-auto {
        display: flex;
        width: 100%;
        justify-content: space-between;
    }

    body.gw-pf .gwpf-auto .gwpf-refresh-toggle {
        margin-left: auto;
        white-space: nowrap;
    }

    /* Ссылки копирования — зона нажатия 44 px. */
    body.gw-pf .gwpf-copy {
        min-height: 44px;
        padding: 10px 0;
    }

    /* Под подписью активного узла — «Шаг 3 из 4»: подписи соседей скрыты,
       и без счётчика непонятно, сколько шагов впереди. */
    body.gw-pf .gwpf-step.is-active .gwpf-step-label::after {
        content: attr(data-gwpf-of);
        display: block;
        margin-top: 3px;
        font-size: 10px;
        letter-spacing: .04em;
        text-transform: none;
        color: var(--gwpf-text-3);
    }

    body.gw-pf .gwpf-lbl,
    body.gw-pf .gwpf-amount > span:first-child {
        margin-top: 28px;
    }

    body.gw-pf .gwpf-rule {
        margin: 26px 0 22px;
    }

    /* Инструкция — в одну колонку; QR под адресом по центру. */
    body.gw-pf .gwpf-how {
        grid-template-columns: 1fr;
        gap: 18px;
        margin-top: 26px;
    }

    body.gw-pf .gwpf-req {
        grid-template-columns: 1fr;
        gap: 18px;
        justify-items: center;
    }

    body.gw-pf .gwpf-req > *:first-child {
        justify-self: stretch;
    }

    /* Адрес: 15 px/.02em — TRON (34 знака) влезает в одну строку без разрыва
       посреди слова; длинные (ETH/bech32) переносятся по границе колонок моно. */
    body.gw-pf .gwpf-addr,
    body.gw-pf .gwpf-mono {
        font-size: 15px;
        letter-spacing: .02em;
    }

    body.gw-pf .gwpf-sub {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }

    /* Липкая панель primary-кнопки. `width:auto` обязателен — вендор пинит
       контейнеру `width:100%`, и с ним отрицательные поля не расширяют панель
       до краёв карточки, а сжимают кнопку. */
    body.gw-pf .inner-content .gwpf-sticky {
        position: sticky;
        bottom: 0;
        z-index: 30;
        width: auto;
        margin: 0 -22px -28px;
        padding: 12px 22px calc(12px + env(safe-area-inset-bottom, 0px));
        background: rgba(7, 7, 6, .92);
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
        border-top: 1px solid var(--gwpf-line);
        border-radius: 0 0 20px 20px;
    }

    body.gw-pf .gwpf-sticky > .gwpf-rate-line {
        display: flex;
        margin: 0 0 8px;
        justify-content: center;
        font-size: 12px;
    }

    /* Пузырь чата (Chatwoot, position:fixed bottom 24, z 2147483646) лежал
       ровно на правом крае ПРИКЛЕЕННОЙ панели: тап в правые ~55 px кнопки
       «Продолжить» открывал чат вместо отправки формы (замер 21.09.2026,
       390×844: кнопка 17–373, пузырь 324–378, обе на 743–799).
       Поднимаем пузырь ровно на время прилипания — в остальных положениях
       панель выше пузыря и не мешает, а постоянный подъём оставлял бы чат
       висеть посреди экрана. Метку ставит скрипт скина (body.gwpf-pinned).
       130 px: панель со строкой курса занимает 109 px, без неё ~80. */
    body.gw-pf .gw-fab {
        transition: bottom .18s ease;
    }

    body.gw-pf.gwpf-pinned .gw-fab {
        bottom: calc(130px + env(safe-area-inset-bottom, 0px));
    }

    body.gw-pf .inner-content .xchange_submit,
    body.gw-pf .inner-content #check_rule_step_input,
    body.gw-pf .inner-content .success_paybutton,
    body.gw-pf .inner-content .iam_pay_bids,
    body.gw-pf .aside .widget_log_submit,
    body.gw-pf .gwpf-btn {
        height: 56px;
        font-size: 13px;
    }

    body.gw-pf .inner-content input.js_sum1,
    body.gw-pf .inner-content input.js_sum2 {
        font-size: 26px;
    }

    /* Футер на телефоне: колонки в одну, по левому краю, заголовки 18 px —
       три центрованные белые стопки по 32 px были громче кнопки. */
    body.gw-pf .footer__grid {
        flex-direction: column;
        align-items: flex-start;
        gap: 22px;
        text-align: left;
    }

    body.gw-pf .footer__nav h2 {
        font-size: 18px;
        text-align: left;
    }

    body.gw-pf .footer__menu,
    body.gw-pf .footer__nav,
    body.gw-pf .footer__col-3,
    body.gw-pf .footer-contacts-wrapper {
        text-align: left;
        align-self: stretch;
    }

    body.gw-pf .footer__menu {
        align-items: flex-start;
    }

    body.gw-pf .footer__col-1,
    body.gw-pf .footer__col-2,
    body.gw-pf .footer__col-3 {
        width: 100%;
    }

    body.gw-pf .footer__bottom {
        flex-direction: column;
        align-items: flex-start;
        gap: 14px;
    }
}

/* -----------------------------------------------------------------------------
   Табы Coin / Bank / Cash — фильтр списка валют (правка владельца 14.09.2026).
   Не третий уровень навигации: 11 px капителью, активный — золотая линия под
   словом, никаких заливных пилюль. Скрытые фильтром пункты вендорного списка
   получают .gwpf-cat-hide; поиск Jselect'а работает поверх, как раньше.
   -------------------------------------------------------------------------- */
body.gw-pf .gwpf-cats {
    display: flex;
    align-items: center;
    gap: 2px;
    margin-left: auto;
    padding: 2px;
    background: rgba(255, 255, 255, .03);
    border: 1px solid var(--gwpf-line);
    border-radius: 999px;
}

body.gw-pf .gwpf-cat {
    position: relative;
    padding: 4px 11px;
    background: none;
    border: 0;
    border-radius: 999px;
    font-family: var(--gwpf-sans);
    font-size: 11px;
    line-height: 14px;
    font-weight: 500;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--gwpf-text-3);
    cursor: pointer;
    transition: color var(--gwpf-t) var(--gwpf-ease), background-color var(--gwpf-t) var(--gwpf-ease);
}

body.gw-pf .gwpf-cat:hover {
    color: var(--gwpf-text);
}

body.gw-pf .gwpf-cat.is-active {
    color: var(--gwpf-gold-2);
    background: rgba(214, 165, 90, .12);
}

body.gw-pf .gwpf-cat.is-active::after {
    content: '';
    position: absolute;
    left: 11px;
    right: 11px;
    bottom: 2px;
    height: 1px;
    background: linear-gradient(90deg, var(--gwpf-gold), transparent);
}

/* Корзина, которой нет в текущем списке: таб не прячем (клиент читал это как
   «наличных нет вообще»), а приглушаем; под фильтром — подпись .gwpf-cat-empty. */
body.gw-pf .gwpf-cat.is-empty:not(.is-active) {
    color: var(--gwpf-text-3);
    opacity: .55;
}

body.gw-pf .select_js_ulli.gwpf-cat-hide {
    display: none !important;   /* Jselect показывает пункты инлайновым display — иначе не перебить */
}

body.gw-pf .gwpf-cat-empty {
    padding: 14px 16px;
    font-family: var(--gwpf-sans);
    font-size: 13px;
    line-height: 1.45;
    color: var(--gwpf-text-2);
}

@media (max-width: 768px) {
    body.gw-pf .gwpf-cats {
        width: 100%;
        margin-left: 0;
        justify-content: stretch;
    }

    body.gw-pf .gwpf-cat {
        flex: 1 1 auto;
        padding: 6px 8px;
        text-align: center;
    }
}
