/*
 * dw-widget styles. Hand-written, no build step.
 *
 * Tokens (§1.1), font faces (§1.2) and components (§2.2) are taken from
 * docs/design/00-requirements.md: colors, Montserrat, radii, shadows and the
 * look of components follow avanchange-ui (src/index.css @theme and :root/.dark,
 * src/shared/ui/{button,input,input-field,dialog,chip,popover}.tsx,
 * src/features/exchange/ui/*), sizes follow the old widget layout
 * (docs/design/04-layout-metrics.md), with the contrast fixes K1–K8.
 * All sizes are CSS variables in the tokens block.
 *
 * Montserrat: variable woff2 (wght 400–800) subset from google/fonts
 * ofl/montserrat/Montserrat[wght].ttf, SIL OFL 1.1 (MONTSERRAT-OFL.txt).
 *
 * Owner decisions: no buy/sell switch, dark text on the green button; the
 * desktop card of §3.1 is on (class="has-card" on <html>, never in a frame
 * or Telegram: data-embed); the AvanChange logo in the footer (§3.3).
 */

@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 400 800; font-display: swap;
  src: url(montserrat-cyrillic.52f14d0ec2.woff2) format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 400 800; font-display: swap;
  src: url(montserrat-latin.0e09dbc86c.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
    U+2000-206F, U+20AC, U+20AE, U+20B8, U+20BA, U+20BD, U+2122, U+2190-2199, U+2212, U+2215, U+FEFF, U+FFFD; }
/* метрики подобрать утилитой (fontaine / @capsizecss/metrics) — значения ориентировочные */
@font-face { font-family: "Montserrat Fallback"; src: local("Arial");
  size-adjust: 113%; ascent-override: 86%; descent-override: 22%; line-gap-override: 0%; }

/* ===================== dw-widget: токены ===================== */
:root {
  /* ---------- ПАЛИТРА (стиль, 02 §1.1, AC:src/index.css @theme) ---------- */
  --ac-green: #3dd94b;  --ac-green-l10: #50dd5d; --ac-green-l20: #64e16f;
  --ac-green-d10: #37c344; --ac-green-d30: #2b9835;
  --ac-blue: #3c67f6;   --ac-blue-l20: #6385f8;  --ac-blue-l30: #7795f9; --ac-blue-d10: #365ddd;
  --ac-red: #f56c6c;    --ac-red-bg: #f6e6e2;    --ac-yellow: #ffd741;
  --ac-gray-0: #ffffff; --ac-gray-10: #f8fafb; --ac-gray-12: #eef2f4; --ac-gray-15: #e8edf1;
  --ac-gray-20: #dae2e8; --ac-gray-30: #a5b7c3; --ac-gray-40: #718391; --ac-gray-50: #647581;
  --ac-gray-60: #566976; --ac-gray-70: #324552; --ac-gray-75: #263138; --ac-gray-80: #14191d;
  --ac-gray-85: #1d262d; --ac-gray-90: #111b22; --ac-gray-95: #0c1319;
  /* бейджи статусов (02 §1.1, method-parts.tsx); одинаковы в обеих темах */
  --badge-wait-bg: #f8d9ab;  --badge-wait-fg: #6d461e;   /* ждёт оплаты (orange) */
  --badge-work-bg: #c8d8fb;  --badge-work-fg: #253c8f;   /* в обработке (blue) */
  --badge-done-bg: #c7f5f0;  --badge-done-fg: #285b55;   /* выполнена (teal) */
  --badge-fail-bg: #f7d4d2;  --badge-fail-fg: #762a25;   /* отклонена (red) */
  --badge-ton-bg: #cfeefb;   --badge-ton-fg: #0b5b82;    /* сеть TON */

  /* ---------- РОЛИ, светлая тема (стиль, 02 §1.2; ★ — правка контраста, §1.3) ---------- */
  --page-bg: var(--ac-gray-10);        /* фон вокруг карточки на десктопе (02 §3.2) */
  --card: var(--ac-gray-0);            /* фон колонки (во фрейме = фон страницы) */
  --surface: var(--ac-gray-10);        /* сводка, инфобокс, плашки */
  --field: var(--ac-gray-12);          /* фон поля (input.tsx) */
  --field-focus: var(--ac-gray-15);    /* фон поля в фокусе (02 §2, примечание a11y) */
  --field-border: var(--ac-gray-40);   /* ★ в AC рамки нет; 3.9:1 к фону — WCAG 1.4.11 */
  --field-border-focus: var(--ac-blue-d10);
  --field-error-bg: var(--ac-red-bg);
  --text: var(--ac-gray-90);           /* заголовки, значения */
  --text-2: var(--ac-gray-70);         /* подписи строк */
  --text-muted: var(--ac-gray-60);     /* ★ AC gray-40 (3.9:1) → gray-60 (5.7:1); подзаголовки, подсказки, placeholder */
  --text-faint: var(--ac-gray-30);     /* только декор: разделители, неактивные иконки — не для текста */
  --line: var(--ac-gray-15);
  --line-dashed: var(--ac-gray-20);
  --upload-border: var(--ac-gray-30);  /* пунктир зоны фото (DashedDivider AC) */
  --opt-on: var(--ac-gray-15);         /* выбранная строка списка валют (aria-current AC) */
  --track: var(--ac-gray-15);
  --progress: var(--ac-blue);          /* ★ AC blue-l30 (2.8:1) → blue (4.7:1) */
  --link: var(--ac-blue-d10);          /* ★ AC blue-l20 (3.4:1) → blue-d10 (5.6:1) */
  --link-hover: var(--ac-blue);
  --primary: var(--ac-green);  --primary-hover: var(--ac-green-l20);  --primary-active: var(--ac-green-d10);
  --primary-fg: var(--ac-gray-90);     /* ★ в AC белый текст (1.9:1) → gray-90 (9.2:1) */
  --secondary: var(--ac-blue); --secondary-hover: var(--ac-blue-l20); --secondary-active: var(--ac-blue-d10);
  --secondary-fg: #fff;                /* 4.7:1 */
  --tertiary-bg: var(--ac-gray-12); --tertiary-hover: var(--ac-gray-20); --tertiary-fg: var(--ac-gray-80);
  --btn-off-bg: var(--ac-gray-20); --btn-off-border: var(--ac-gray-20); --btn-off-fg: var(--ac-gray-50);
  --chip-border: var(--ac-gray-40); --chip-fg: var(--ac-gray-70);  /* ★ рамка gray-20 (1.3:1) → gray-40 (3.9:1), 00 §7 */
  --chip-on-bg: var(--ac-gray-75); --chip-on-fg: #fff;  /* выбранная пилюля: заливка, как активная вкладка AC */
  --danger: var(--ac-red);             /* рамки, иконки, заливки */
  --danger-text: #b42828;              /* ★ текст ошибки: #f56c6c даёт 2.9:1 → 6.5:1 (5.3:1 на --field-error-bg) */
  --danger-surface: rgb(245 108 108 / .10);
  --warn-surface: rgb(255 215 65 / .25);  /* таймер < 5 мин, «курс обновился» */
  --focus: var(--ac-green-d30);        /* ★ кольцо AC primary/50 (≈1.5:1) → сплошное green-d30 (3.7:1) */
  --ring: rgb(61 217 75 / .5);         /* декоративный «ореол» AC вокруг кнопок, вместе с --focus */
  --overlay: rgb(17 27 34 / .4);       /* ::backdrop диалога */
  --veil: rgb(255 255 255 / .81);
  --tip-bg: var(--ac-gray-90); --tip-fg: var(--ac-gray-0);

  /* ---------- ШРИФТ, радиусы, тени, анимации (стиль, 02 §1.3–1.7, §4) ---------- */
  --font: "Montserrat", "Montserrat Fallback", ui-sans-serif, system-ui, -apple-system,
          "Segoe UI", Roboto, Arial, sans-serif;
  --r-xs: 6px;    /* чекбокс, копирование */
  --r-sm: 10px;   /* поля ввода, строки-плашки */
  --r-md: 12px;   /* кнопки, заполненный инфобокс, подсказка */
  --r-lg: 15px;   /* инфобокс с рамкой, сводка */
  --r-xl: 20px;   /* карточка, диалог */
  --r-full: 9999px; /* пилюли, бейджи, прогресс */
  --shadow-card: 0 10px 80px rgba(32,34,57,.15);
  --shadow-dialog: 0 20px 60px rgba(17,27,34,.2);
  --shadow-tip: 0 15px 40px rgba(14,12,12,.3);
  --ease-out: cubic-bezier(.22,1,.36,1); --ease-inout: cubic-bezier(.65,0,.35,1);
  --dur-fast: 150ms; --dur-base: 200ms; --dur-step: 300ms;

  /* ---------- РАЗМЕРЫ (04 §6; ◆ — отступление от замера ради доступности, §1.3) ---------- */
  /* каркас */
  --container-max: 480px;  /* 04: колонка 480, контент 440 */
  --gutter: 20px;          /* 04: поля колонки 20; в окнах тоже 20 (было 15) */
  --top-row-h: 44px;       /* 04: строка «Назад» 45 → сетка 4 */
  --modal-top: 44px;       /* 04: верх окна 45 → 44 */
  /* отступы */
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px;
  --space-5: 20px; --space-6: 24px; --space-7: 32px;
  --gap-label: 4px;        /* подпись → поле (было 3) */
  --gap-error: 4px;        /* поле → ошибка/подсказка (было 5) */
  --gap-field: 12px;       /* между полями (было 10); шаг поля 18+4+52+12 = 86 */
  --gap-action: 12px;      /* последнее поле/сводка → кнопка (было 10) */
  --gap-section: 20px;     /* после подзаголовка, после инфобокса, кнопка → футер */
  --gap-pill: 8px;         /* ◆ между пилюлями/чипами (было 4) */
  /* шрифты: кегль / межстрочный (04 §6) */
  --fs-xs: 12px;  --lh-xs: 18px;   /* пилюли валют, строки сводки, условия */
  --fs-sm: 13px;  --lh-sm: 18px;   /* «Ваша заявка», текст инфобокса, мелкие кнопки, футер */
  --fs-base: 14px; --lh-base: 18px; /* подписи полей, ошибки, строки проверки, текст окон */
  --fs-md: 15px;  --lh-md: 22px;   /* подзаголовок, заголовок инфобокса */
  --fs-input: 16px; --lh-input: 22px; /* ◆ ввод на шаге 2: было 15, < 16 даёт зум на iOS */
  --fs-lg: 16px;  --lh-lg: 24px;   /* кнопки, текст «Помощи» */
  --fs-xl: 18px;  --lh-xl: 28px;   /* подзаголовки в окнах */
  --fs-2xl: 22px; --lh-2xl: 32px;  /* сумма в поле, заголовок окна */
  --fs-3xl: 24px; --lh-3xl: 36px;  /* H1 шага */
  --fs-help-h: 28px; --lh-help-h: 36px; /* ◆ H3 «Помощи»: было 28/18 (дефект: строки налезали) */
  /* контролы */
  --control-h: 52px;       /* поля, основная и вторичная кнопки */
  --control-h-md: 44px;    /* ◆ средние кнопки (было 42); в «Временно недоступно» — 48 как было */
  --chip-h: 32px;          /* быстрые суммы (видимая высота) */
  --pill-h: 24px;          /* валюта внутри поля (видимая высота) */
  --nav-h: 32px;           /* «Назад», «Помощь» (видимая высота; «Помощь» было 29) */
  --hit-min: 44px;         /* ◆ минимальная зона касания важных кнопок */
  --field-pad-x: 16px;     /* было 15 */
  --btn-pad-x: 40px;       /* основная кнопка 0 40 */
  --pill-pad-x: 10px;
  --row-h: 28px;           /* строка проверки заявки (шаг 3), строка деталей (шаг 4) */
  --info-pad: 12px 18px;   /* инфобокс */
  --upload-h: 115px;       /* зона загрузки фото */
  --icon: 16px; --icon-coin: 22px; --spinner: 20px;
  --border: 1px; --border-strong: 2px; /* ошибка поля (2 как было; ◆ теперь и в светлой теме), пунктир загрузки */
  --focus-w: 2px; --focus-offset: 2px; /* WCAG 2.4.11/2.4.13 */

  color-scheme: light;
}

/* ===================== тёмная тема (02 §1.2 .dark; ★ — правка контраста) ===================== */
:root[data-theme="dark"] {
  --page-bg: var(--ac-gray-95);
  --card: var(--ac-gray-85);
  --surface: var(--ac-gray-80);
  --field: transparent;
  --field-focus: transparent;
  --field-border: var(--ac-gray-50);   /* ★ AC gray-60 (2.7:1) → gray-50 (3.2:1) */
  --field-border-focus: var(--ac-gray-30);
  --field-error-bg: transparent;
  --text: var(--ac-gray-0);
  --text-2: var(--ac-gray-30);
  --text-muted: var(--ac-gray-30);     /* ★ AC gray-40 (3.9:1) → gray-30 (7.4:1) */
  --text-faint: var(--ac-gray-50);
  --line: var(--ac-gray-70); --line-dashed: var(--ac-gray-70); --track: var(--ac-gray-70);
  --upload-border: var(--ac-gray-50); --opt-on: var(--ac-gray-70);
  --progress: var(--ac-blue-l30);      /* 5.4:1 к gray-85 */
  --link: var(--ac-blue-l30); --link-hover: var(--ac-blue-l20);
  --primary: var(--ac-green-l10); --primary-hover: var(--ac-green-l20); --primary-active: var(--ac-green-d10);
  --primary-fg: var(--ac-gray-95);     /* AC --primary-foreground (dark) */
  --tertiary-bg: var(--ac-gray-70); --tertiary-hover: var(--ac-gray-60); --tertiary-fg: var(--ac-gray-0);
  --btn-off-bg: var(--ac-gray-80); --btn-off-border: var(--ac-gray-75); --btn-off-fg: var(--ac-gray-50);
  --chip-border: var(--ac-gray-50); --chip-fg: var(--ac-gray-30);  /* ★ рамка AC gray-70 → gray-50 */
  --chip-on-bg: var(--ac-gray-0); --chip-on-fg: var(--ac-gray-90);
  --danger-text: var(--ac-red);        /* 5.3:1 к gray-85 */
  --danger-surface: rgb(245 108 108 / .15);
  --warn-surface: rgb(255 215 65 / .15);
  --focus: var(--ac-green-l10);        /* 10:1 */
  --ring: rgb(80 221 93 / .5);
  --veil: rgb(29 38 45 / .85);
  color-scheme: dark;
}

/* ---------- база ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { margin: 0; font: 400 var(--fs-base)/var(--lh-base) var(--font); color: var(--text); background: var(--card);
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-tap-highlight-color: transparent; }
input, button, select, textarea { font: inherit; color: inherit; }
:focus { outline: none; }
:focus-visible { outline: var(--focus-w) solid var(--focus); outline-offset: var(--focus-offset); }
.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.tnum { font-variant-numeric: tabular-nums; }
/* расширение зоны касания до 44 без изменения вида (Д1–Д7) */
.hit { position: relative; }
.hit::after { content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: max(100%, var(--hit-min)); height: max(100%, var(--hit-min)); }

/* ---------- каркас (§3) ---------- */
.w { width: min(100%, var(--container-max)); margin: 0 auto;
  padding: 0 max(var(--gutter), env(safe-area-inset-right)) calc(var(--gutter) + env(safe-area-inset-bottom)) max(var(--gutter), env(safe-area-inset-left));
  padding-top: env(safe-area-inset-top); }
.w-top { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); height: var(--top-row-h); }
.w-top .ac-progress { flex: 1; max-width: 160px; }
.w h1 { margin: 0; font: 700 var(--fs-3xl)/var(--lh-3xl) var(--font); color: var(--text); }
.w h1:focus { outline: none; }
.w-sub { margin: 0 0 var(--gap-section); font: 400 var(--fs-md)/var(--lh-md) var(--font); color: var(--text-muted); }
.w h1 + .ac-state { margin-top: var(--gap-section); }                /* «Временно недоступно» без подзаголовка */
/* футер: ссылки цветом текста, синие только при наведении (как AgreeField AC) */
.w-foot { padding: var(--gap-section) 0 0; font: 400 var(--fs-sm)/var(--lh-sm) var(--font); color: var(--text-muted); text-align: center; }
.w-foot p { margin: 0; }
.w-foot p + p { margin-top: var(--space-2); }
.w-foot a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
@media (hover: hover) { .w-foot a:hover { color: var(--link-hover); } }
.w-logo { font-weight: 800; color: var(--text); }                    /* «AvanChange» в строке «Обмен проводит» */
.w-logos { margin: 0 0 var(--space-2); line-height: 0; }
.w-logos a { display: inline-block; color: var(--text); }
.w-logo-svg { width: auto; height: 24px; }                          /* 00 §3.3: логотипы высотой 24 */
:root[data-step="review"] .w-terms { display: none; }                /* шаг 3: Правила и AML уже под кнопкой */
/* карточка на десктопе (00 §3.1), решение владельца: включена (has-card у <html>), во фрейме и Telegram — нет */
@media (min-width: 560px) {
  :root.has-card:not([data-embed]) body { background: var(--page-bg); }
  :root.has-card:not([data-embed]) .w { margin-block: 40px; padding-top: var(--space-5); border-radius: var(--r-xl);
    background: var(--card); box-shadow: var(--shadow-card); }
}

/* ---------- кнопки ---------- */
.ac-btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2);
  height: var(--control-h); padding: 0 var(--btn-pad-x); border: var(--border) solid transparent; border-radius: var(--r-md);
  font: 700 var(--fs-lg)/var(--lh-lg) var(--font); white-space: nowrap; text-decoration: none; cursor: pointer;
  transition: color var(--dur-fast), background-color var(--dur-fast), border-color var(--dur-fast), box-shadow var(--dur-fast); }
.ac-btn svg { width: var(--icon); height: var(--icon); flex-shrink: 0; }
.ac-btn--block { width: 100%; }
.ac-btn--md { height: var(--control-h-md); padding: 0 var(--space-5); font-size: var(--fs-sm); }
.ac-btn--48 { height: 48px; min-width: 220px; padding: 0 15px; }   /* «Временно недоступно», как было */
.ac-btn:focus-visible { box-shadow: 0 0 0 3px var(--ring); }
.ac-btn--primary { background: var(--primary); border-color: var(--primary); color: var(--primary-fg); }
@media (hover: hover) { .ac-btn--primary:hover { background: var(--primary-hover); border-color: var(--primary-hover); } }
.ac-btn--primary:active { background: var(--primary-active); border-color: var(--primary-active); }
.ac-btn--secondary { background: var(--secondary); border-color: var(--secondary); color: var(--secondary-fg); }
@media (hover: hover) { .ac-btn--secondary:hover { background: var(--secondary-hover); border-color: var(--secondary-hover); } }
.ac-btn--secondary:active { background: var(--secondary-active); border-color: var(--secondary-active); }
.ac-btn--ghost { background: transparent; border-color: var(--ac-gray-20); color: var(--ac-gray-80); }
@media (hover: hover) { .ac-btn--ghost:hover { border-color: var(--ac-gray-40); } }
.ac-btn--ghost:active { background: var(--ac-gray-20); }
[data-theme="dark"] .ac-btn--ghost { border-color: var(--ac-gray-60); color: var(--ac-gray-0); }
@media (hover: hover) { [data-theme="dark"] .ac-btn--ghost:hover { border-color: var(--ac-gray-0); } }
.ac-btn--tertiary { background: var(--tertiary-bg); border-color: var(--tertiary-bg); color: var(--tertiary-fg); }
@media (hover: hover) { .ac-btn--tertiary:hover { background: var(--tertiary-hover); border-color: var(--tertiary-hover); } }
.ac-btn:disabled:not([aria-busy="true"]), .ac-btn[aria-disabled="true"] {
  background: var(--btn-off-bg); border-color: var(--btn-off-border); color: var(--btn-off-fg); cursor: not-allowed; }
.ac-btn[aria-busy="true"] { pointer-events: none; }                /* повторный тап игнорируется */
.ac-btn[aria-busy="true"] > :not(.ac-spinner) { visibility: hidden; width: 0; overflow: hidden; }
.ac-btn-row { display: flex; gap: var(--space-3); }                /* 2 кнопки по 50 % (04: промежуток 12) */
.ac-btn-row > .ac-btn { flex: 1; padding: 0 var(--space-2); }
.ac-btn-note { margin: var(--space-2) 0 0; font: 400 var(--fs-xs)/20px var(--font); color: var(--text-muted); text-align: center; }
.ac-btn-note a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }

/* «Назад» / «Помощь» */
.ac-nav { display: inline-flex; align-items: center; gap: var(--space-1); height: var(--nav-h); padding: 0 var(--space-3) 0 var(--space-2);
  border: 0; border-radius: var(--r-full); background: var(--tertiary-bg); color: var(--tertiary-fg);
  font: 500 var(--fs-sm)/var(--lh-sm) var(--font); text-decoration: none; cursor: pointer; transition: background-color var(--dur-fast); }
@media (hover: hover) { .ac-nav:hover { background: var(--tertiary-hover); } }
.ac-nav.is-placeholder { visibility: hidden; }  /* шаг 1: место занято, как в 04 */
.ac-nav svg, .ac-tipbtn svg { width: var(--icon); height: var(--icon); flex-shrink: 0; }

/* ссылка-кнопка */
.ac-link { padding: 0; border: 0; background: none; color: var(--link); font: inherit; text-decoration: underline;
  text-underline-offset: 2px; cursor: pointer; }
@media (hover: hover) { .ac-link:hover { color: var(--link-hover); } }

/* ---------- поля ---------- */
.ac-field + .ac-field { margin-top: var(--gap-field); }
.ac-label { display: block; margin-bottom: var(--gap-label); font: 500 var(--fs-base)/var(--lh-base) var(--font); color: var(--text); }
.ac-label small { font-weight: 400; color: var(--text-muted); }         /* «(необязательно)» */
.ac-control { position: relative; }
.ac-input { display: block; width: 100%; min-width: 0; height: var(--control-h); padding: 0 var(--field-pad-x);
  background: var(--field); border: var(--border) solid var(--field-border); border-radius: var(--r-sm);
  font: 400 var(--fs-input)/var(--lh-input) var(--font); color: var(--text); -webkit-appearance: none; appearance: none;
  transition: background-color var(--dur-fast), border-color var(--dur-fast); }
.ac-input::placeholder { color: var(--text-muted); opacity: 1; }
.ac-input:focus { background: var(--field-focus); border-color: var(--field-border-focus); font-weight: 600; }
.ac-input:focus-visible { outline: var(--focus-w) solid var(--focus); outline-offset: var(--focus-offset); }
.ac-input[aria-invalid="true"] { border: var(--border-strong) solid var(--danger); background: var(--field-error-bg);
  padding: 0 calc(var(--field-pad-x) - 1px); }
.ac-input[aria-invalid="true"]:focus-visible { outline-color: var(--danger); }   /* не зелёное «успех» рядом с ошибкой */
.ac-input:disabled { opacity: .5; cursor: not-allowed; }
.ac-input--card { letter-spacing: .02em; padding-right: 64px; }        /* место под логотип Мир/Visa/MC */
.ac-input-suffix { position: absolute; right: var(--field-pad-x); top: 50%; transform: translateY(-50%);
  font: 700 var(--fs-xs)/1 var(--font); text-transform: uppercase; color: var(--ac-gray-40); pointer-events: none; }
.ac-prefix-at { position: absolute; left: var(--field-pad-x); top: 50%; transform: translateY(-50%); color: var(--text-muted);
  font: 500 var(--fs-input)/1 var(--font); pointer-events: none; }
.ac-input--at { padding-left: calc(var(--field-pad-x) + 1.3em); }          /* «@» шире 14px в Montserrat: отступ в em */
.ac-input--at[aria-invalid="true"] { padding-left: calc(var(--field-pad-x) - 1px + 1.3em); } /* рамка ошибки 2px не должна сбрасывать отступ под «@» */
.ac-readonly { min-height: var(--control-h); display: flex; align-items: center; font: 500 var(--fs-base)/var(--lh-base) var(--font);
  overflow-wrap: anywhere; }                                           /* кошелёк из ссылки — текстом, не полем */
.ac-hint, .ac-error { display: flex; gap: var(--space-1); margin: var(--gap-error) 0 0; min-height: var(--lh-sm); }
.ac-hint { font: 400 var(--fs-sm)/var(--lh-sm) var(--font); color: var(--text-muted); }
.ac-hint:empty { display: none; }                                      /* без подсказки строка не резервируется: поле 86 (§4.3) */
.ac-hint svg { width: var(--icon); height: var(--icon); flex-shrink: 0; margin-top: 1px; }
.ac-error { font: 600 var(--fs-base)/var(--lh-base) var(--font); color: var(--danger-text); }
.ac-error svg { width: var(--icon); height: var(--icon); flex-shrink: 0; margin-top: 1px; }
.ac-error > span { min-width: 0; }
.ac-error__hint { display: block; margin-top: 2px; font: 400 var(--fs-sm)/var(--lh-sm) var(--font); color: var(--text-muted); } /* пример остаётся под ошибкой */
.ac-add { margin-top: var(--gap-field); }                              /* «+ Добавить Telegram» — ссылка-кнопка */

/* ---------- поле суммы с валютами ---------- */
.ac-amount { position: relative; display: flex; align-items: center; height: var(--control-h);
  background: var(--field); border: var(--border) solid var(--field-border); border-radius: var(--r-sm);
  transition: background-color var(--dur-fast), border-color var(--dur-fast); }
.ac-amount:focus-within { background: var(--field-focus); border-color: var(--field-border-focus); }
.ac-amount[data-invalid] { border: var(--border-strong) solid var(--danger); background: var(--field-error-bg); }
.ac-amount input { flex: 1; min-width: 0; height: 100%; padding: 0 var(--space-2) 0 var(--field-pad-x); border: 0; background: transparent;
  font: 700 var(--fs-2xl)/var(--lh-2xl) var(--font); font-variant-numeric: tabular-nums; color: var(--text); outline: none; }
.ac-amount:has(input:focus-visible) { outline: var(--focus-w) solid var(--focus); outline-offset: var(--focus-offset); } /* + JS-класс .is-focus как запасной путь */
.ac-amount.is-focus { outline: var(--focus-w) solid var(--focus); outline-offset: var(--focus-offset); }
.ac-amount[data-invalid]:has(input:focus-visible), .ac-amount[data-invalid].is-focus { outline-color: var(--danger); }
.ac-amount input[aria-busy="true"] { animation: ac-pulse 2s cubic-bezier(.4,0,.6,1) infinite; }
.ac-amount__approx { padding-left: var(--field-pad-x); margin-right: -12px; font: 700 var(--fs-2xl)/1 var(--font); color: var(--text-muted); }
.ac-pills { display: flex; align-items: center; gap: var(--gap-pill); padding-right: var(--field-pad-x); flex-shrink: 0; }

/* ---------- пилюли валют и чипы быстрых сумм ---------- */
.ac-pill { position: relative; display: inline-flex; align-items: center; gap: var(--space-1); height: var(--pill-h); padding: 0 var(--pill-pad-x);
  border: var(--border) solid var(--chip-border); border-radius: var(--r-full); background: transparent; color: var(--chip-fg);
  font: 500 var(--fs-xs)/var(--lh-xs) var(--font); cursor: pointer; transition: border-color var(--dur-fast), background-color var(--dur-fast), color var(--dur-fast); }
.ac-pill::after { content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);
  width: max(100% + var(--gap-pill), var(--hit-min)); height: var(--hit-min); }   /* Д1 */
@media (hover: hover) { .ac-pill:hover { border-color: var(--text-2); } }
.ac-pill[aria-pressed="true"], .ac-pill--menu { background: var(--chip-on-bg); border-color: var(--chip-on-bg); color: var(--chip-on-fg); font-weight: 700; }
.ac-pill[aria-disabled="true"] { opacity: .6; cursor: not-allowed; }
.ac-pill--static { cursor: default; border-color: transparent; padding: 0 var(--space-1); color: var(--text); font-weight: 700; } /* покупка: «RUB» — подпись, не кнопка */
.ac-pill svg { width: 12px; height: 12px; }                           /* шеврон у --menu */
.ac-chips { display: flex; justify-content: center; gap: var(--gap-pill); margin: 0 0 15px; }  /* 04: снизу 15 */
.ac-chip { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: var(--space-1); min-width: 72px; height: var(--chip-h);
  padding: 0 var(--space-3) 0 var(--space-2); border: var(--border) solid var(--chip-border); border-radius: var(--r-full);
  background: transparent; color: var(--chip-fg); font: 700 var(--fs-base)/var(--lh-base) var(--font); cursor: pointer;
  transition: border-color var(--dur-fast), background-color var(--dur-fast), color var(--dur-fast); }
.ac-chip::after { content: ""; position: absolute; inset: 50% auto auto 50%; transform: translate(-50%,-50%); width: 100%; height: var(--hit-min); } /* Д2 */
.ac-chip img, .ac-chip svg { width: var(--icon); height: var(--icon); }
@media (hover: hover) { .ac-chip:hover { border-color: var(--text-2); } }
.ac-chip[aria-pressed="true"] { background: var(--chip-on-bg); border-color: var(--chip-on-bg); color: var(--chip-on-fg); }

/* ---------- сводка (шаг 1) и мини-сводка (шаги 2–4) ---------- */
.ac-summary { margin: var(--gap-field) 0 0; padding: var(--space-3) var(--space-4); border-radius: var(--r-lg); background: var(--surface); }
.ac-summary__row { display: flex; justify-content: space-between; gap: var(--space-3); font: 400 var(--fs-xs)/var(--lh-xs) var(--font); color: var(--text-2); }
.ac-summary__row dd { margin: 0; text-align: right; font-weight: 500; color: var(--text); overflow-wrap: anywhere; }
.ac-summary__row + .ac-summary__row { margin-top: var(--space-1); }
.ac-summary__stamp { flex-basis: 100%; text-align: right; color: var(--text-muted); font-weight: 400; } /* «обновлён 12:40» второй строкой */
.ac-summary.is-changed { animation: ac-flash 2s var(--ease-out); }
@keyframes ac-flash { from { background: var(--warn-surface); } }
.ac-mini { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-3); margin: 0 0 var(--gap-section);
  padding: var(--space-3) var(--space-4); border-radius: var(--r-lg); background: var(--surface); }
.ac-mini__main { font: 700 var(--fs-base)/var(--lh-base) var(--font); font-variant-numeric: tabular-nums; }
.ac-mini__sub { font: 400 var(--fs-sm)/var(--lh-sm) var(--font); color: var(--text-muted); }
.ac-mini .ac-link { position: relative; font-size: var(--fs-sm); white-space: nowrap; }
.ac-mini .ac-link::after { content: ""; position: absolute; inset: 50% auto auto 50%; transform: translate(-50%,-50%); width: max(100%, 44px); height: 44px; }

/* ---------- строки проверки / деталей (шаги 3–4) ---------- */
.ac-rows { margin: 0; }
.ac-row { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); min-height: var(--row-h); padding: 5px 0;
  font: 400 var(--fs-base)/var(--lh-base) var(--font); }
.ac-row dt { flex-shrink: 0; color: var(--text-2); }
.ac-row dd { margin: 0; display: flex; align-items: center; gap: var(--space-2); min-width: 0; text-align: right;
  font-weight: 500; color: var(--text); overflow-wrap: anywhere; }
.ac-row--big dd { font-weight: 700; font-size: var(--fs-lg); line-height: var(--lh-lg); }   /* «Отдаёте/Получаете» */
.ac-rows + .ac-rows, .ac-divider { margin-top: var(--space-3); }
.ac-divider { height: 1px; border: 0; background: repeating-linear-gradient(90deg, var(--line-dashed) 0 4px, transparent 4px 6px); }
.ac-copy { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; padding: 0;
  border: 0; border-radius: var(--r-xs); background: none; color: var(--ac-gray-40); cursor: pointer; }
.ac-copy::after { content: ""; position: absolute; inset: 50% auto auto 50%; transform: translate(-50%,-50%); width: var(--hit-min); height: var(--hit-min); } /* Д7 */
.ac-copy.is-done { color: var(--focus); }
/* «Скопировано» текстом, не только цветом (1.4.1): у кнопки-иконки — плашкой над ней */
.ac-copy[data-msg]::before { content: attr(data-msg); position: absolute; z-index: 5; bottom: calc(100% + 6px); right: -4px;
  padding: 2px var(--space-2); border-radius: var(--r-xs); background: var(--tip-bg); color: var(--tip-fg);
  font: 500 var(--fs-xs)/var(--lh-xs) var(--font); white-space: nowrap; pointer-events: none; }
.ac-copy--text { width: auto; height: 32px; gap: var(--space-1); padding: 0 var(--space-3); border-radius: var(--r-sm);
  background: var(--tertiary-bg); color: var(--tertiary-fg); font: 600 var(--fs-sm)/var(--lh-sm) var(--font); white-space: nowrap; }
@media (hover: hover) { .ac-copy--text:hover { background: var(--tertiary-hover); } }
.ac-copy--text.is-done { color: var(--tertiary-fg); }
.ac-copy svg { width: var(--icon); height: var(--icon); }

/* ---------- сообщения ---------- */
.ac-info { display: flex; gap: var(--space-2); margin: 0 0 var(--gap-section); padding: var(--info-pad);
  border: var(--border) solid var(--line); border-radius: var(--r-lg); font: 400 var(--fs-sm)/var(--lh-sm) var(--font); color: var(--text-2); }
.ac-info b, .ac-info__title { display: block; font: 600 var(--fs-md)/var(--lh-md) var(--font); color: var(--text); }
.ac-info--filled { border: 0; border-radius: var(--r-md); background: var(--surface); }
.ac-alert { display: flex; gap: var(--space-2); margin: 0 0 var(--gap-action); padding: var(--space-3) var(--space-4);
  border-radius: var(--r-md); background: var(--danger-surface); color: var(--danger-text); font: 500 var(--fs-base)/var(--lh-base) var(--font); }
.ac-alert--warn { background: var(--warn-surface); color: var(--text); }
.ac-alert svg { width: var(--icon); height: var(--icon); flex-shrink: 0; margin-top: 1px; }
.ac-alert .ac-link { color: inherit; font-weight: 700; }
.ac-alert details { margin-top: var(--space-1); font-size: var(--fs-xs); color: var(--text-muted); }  /* «Подробнее»: код ошибки */
.ac-state { display: flex; flex-direction: column; align-items: center; gap: var(--space-3); padding: var(--space-6) var(--space-5);
  border-radius: var(--r-lg); background: var(--surface); text-align: center; }
.ac-state h2 { margin: 0; font: 700 var(--fs-2xl)/var(--lh-2xl) var(--font); }
.ac-state p { margin: 0; font: 400 var(--fs-base)/var(--lh-base) var(--font); color: var(--text-2); }
.ac-state__icon { display: flex; align-items: center; justify-content: center; width: 56px; height: 56px; border-radius: 50%;
  background: rgb(99 133 248 / .12); color: var(--link); }
.ac-notice { padding: var(--space-3) var(--space-4); background: var(--ac-yellow); color: var(--ac-gray-90); text-align: center;
  font: 500 var(--fs-base)/var(--lh-base) var(--font); }               /* тех. работы, над колонкой */

/* ---------- прогресс, бейджи, таймер, таймлайн ---------- */
.ac-progress { display: flex; gap: var(--space-1); height: 4px; margin: 0; padding: 0; list-style: none; }
.ac-progress > li { flex: 1; border-radius: var(--r-full); background: var(--track); transition: background-color .5s; }
.ac-progress > li.is-done, .ac-progress > li[aria-current="step"] { background: var(--progress); }
.ac-badge { display: inline-flex; align-items: center; height: 20px; padding: 0 var(--space-2); border-radius: var(--r-full);
  font: 500 var(--fs-xs)/var(--lh-xs) var(--font); white-space: nowrap; }
.ac-badge--wait { background: var(--badge-wait-bg); color: var(--badge-wait-fg); }
.ac-badge--work { background: var(--badge-work-bg); color: var(--badge-work-fg); }
.ac-badge--done { background: var(--badge-done-bg); color: var(--badge-done-fg); }
.ac-badge--fail { background: var(--badge-fail-bg); color: var(--badge-fail-fg); }
.ac-badge--muted { background: var(--ac-gray-12); color: var(--ac-gray-60); }
[data-theme="dark"] .ac-badge--muted { background: var(--ac-gray-70); color: var(--ac-gray-20); }
.ac-badge--ton { background: var(--badge-ton-bg); color: var(--badge-ton-fg); }
.ac-timer { display: inline-flex; align-items: baseline; gap: var(--space-2); border-radius: var(--r-sm);
  font: 600 var(--fs-lg)/var(--lh-lg) var(--font); font-variant-numeric: tabular-nums; color: var(--text-muted); }
.ac-timer:empty { display: none; }
.ac-timer.is-late { padding: 0 var(--space-2); background: var(--warn-surface); color: var(--text); }
.ac-timeline { margin: 0; padding: 0; list-style: none; }
.ac-timeline > li { position: relative; min-height: var(--row-h); padding: 5px 0 5px 24px; font: 400 var(--fs-base)/var(--lh-base) var(--font); color: var(--text-muted); }
.ac-timeline > li::before { content: ""; position: absolute; left: 0; top: 8px; width: 12px; height: 12px; border-radius: 50%;
  border: 2px solid var(--line); background: var(--card); }
.ac-timeline > li:not(:last-child)::after { content: ""; position: absolute; left: 5px; top: 22px; bottom: -6px; width: 2px; background: var(--line); }
.ac-timeline > li.is-done { color: var(--text); }
.ac-timeline > li.is-done::before { border-color: var(--progress); background: var(--progress); }
.ac-timeline > li[aria-current="step"] { color: var(--text); font-weight: 600; }
.ac-timeline > li[aria-current="step"]::before { border-color: var(--progress); animation: ac-pulse 2s cubic-bezier(.4,0,.6,1) infinite; }
.ac-timeline time { margin-left: var(--space-2); color: var(--text-muted); font-weight: 400; }

/* ---------- верификация: загрузка фото ---------- */
.ac-upload { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--space-2); min-height: var(--upload-h);
  padding: var(--space-5); border: var(--border-strong) dashed var(--upload-border); border-radius: var(--r-sm); text-align: center;
  font: 400 var(--fs-base)/var(--lh-base) var(--font); color: var(--text-2); }
.ac-upload[data-invalid] { border-color: var(--danger); }
.ac-upload img { max-width: 100%; max-height: 240px; border-radius: var(--r-xs); }
.ac-upload input[type=file] { position: absolute; width: 1px; height: 1px; opacity: 0; }  /* открывается через <label class="ac-btn"> */
.ac-upload label:has(input:focus-visible) { outline: var(--focus-w) solid var(--focus); outline-offset: var(--focus-offset); } /* 2.4.7 */
.ac-bar { width: 100%; height: 4px; border-radius: var(--r-full); background: var(--track); overflow: hidden; }
.ac-bar > span { display: block; height: 100%; width: var(--p, 0%); background: var(--primary); transition: width var(--dur-base); }
.ac-checklist { margin: 0; padding-left: 20px; font: 400 var(--fs-base)/var(--lh-base) var(--font); }
.ac-checklist li + li { margin-top: var(--space-1); }
.ac-checklist li.is-hit { color: var(--danger-text); font-weight: 600; }

/* ---------- диалог (<dialog> + showModal) ---------- */
.ac-dialog { width: calc(100% - 2 * var(--gutter)); max-width: calc(var(--container-max) - 2 * var(--gutter));
  max-height: calc(100vh - 40px); max-height: calc(100dvh - 40px); padding: 0; border: 0; border-radius: var(--r-xl);
  background: var(--card); color: var(--text); box-shadow: var(--shadow-dialog); }
.ac-dialog[open] { display: flex; flex-direction: column; animation: ac-zoom var(--dur-base) var(--ease-out); }
.ac-dialog::backdrop { background: var(--overlay); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.ac-dialog__head { position: relative; padding: var(--space-5) calc(var(--space-5) + 44px) 0 var(--space-5); }
.ac-dialog__title { margin: 0; font: 700 var(--fs-2xl)/var(--lh-2xl) var(--font); }
.ac-dialog__body { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: var(--space-4) var(--space-5) var(--space-5); }
.ac-close { position: absolute; top: var(--space-3); right: var(--space-3); width: 44px; height: 44px; display: flex; align-items: center; justify-content: center;
  border: 0; border-radius: 50%; background: none; color: var(--ac-gray-60); cursor: pointer; }      /* Д6 */
@media (hover: hover) { .ac-close:hover { background: var(--ac-gray-12); color: var(--ac-gray-90); } }
[data-theme="dark"] .ac-close { color: var(--ac-gray-30); }
/* «Помощь»: на мобильных — на весь экран (как 04), на десктопе — карточка 440 */
.ac-dialog--full { width: 100%; max-width: 100%; height: 100%; max-height: 100%; border-radius: 0; }
@media (min-width: 560px) { .ac-dialog--full { width: calc(var(--container-max) - 2 * var(--gutter)); height: auto; max-height: calc(100dvh - 80px); border-radius: var(--r-xl); } }
.ac-help h2 { margin: 0 0 var(--space-3); font: 700 var(--fs-help-h)/var(--lh-help-h) var(--font); }
.ac-help h3 { margin: var(--space-5) 0 var(--space-2); font: 700 20px/28px var(--font); }
.ac-help p { margin: 0 0 10px; font: 400 var(--fs-lg)/var(--lh-lg) var(--font); }
.ac-help .ac-btn { height: 56px; min-width: 182px; }                   /* «Написать в поддержку», 04: 182×56 */
.ac-help p a { color: var(--link); text-underline-offset: 2px; }
@media (max-width: 559.98px) { .ac-help .ac-dialog__head { padding-top: 40px; } }  /* 04: сверху 40 на мобильных */
/* список валют в диалоге */
.ac-opt { display: flex; align-items: center; gap: var(--space-3); width: 100%; min-height: var(--control-h); padding: 0 var(--space-5);
  border: 0; border-top: var(--border) solid var(--line); background: none; text-align: left; cursor: pointer; font: inherit; }
@media (hover: hover) { .ac-opt:hover { background: var(--surface); } }
.ac-opt[aria-checked="true"] { background: var(--opt-on); }
.ac-opt__text { display: flex; flex-direction: column; min-width: 0; }
.ac-opt__name { font: 700 var(--fs-lg)/var(--lh-lg) var(--font); }
.ac-opt__sub { font: 400 var(--fs-sm)/var(--lh-sm) var(--font); color: var(--text-muted); }
.ac-opt__tick { display: flex; align-items: center; justify-content: center; flex: none; margin-left: auto; width: 22px; height: 22px;
  border-radius: 50%; background: var(--progress); color: #fff; }
.ac-opt__tick svg { width: 14px; height: 14px; }
.ac-opt-group { margin: 0; padding: var(--space-3) var(--space-5) var(--space-1); font: 600 var(--fs-sm)/var(--lh-sm) var(--font); color: var(--text-muted); }

/* ---------- подсказка ⓘ ---------- */
.ac-tipbtn { position: relative; display: inline-flex; width: 18px; height: 18px; align-items: center; justify-content: center; padding: 0;
  border: 0; border-radius: 50%; background: none; color: var(--ac-gray-40); vertical-align: middle; cursor: pointer; }
.ac-tipbtn::after { content: ""; position: absolute; inset: 50% auto auto 50%; transform: translate(-50%,-50%); width: 44px; height: 44px; }
.ac-tipbtn[aria-expanded="true"] { color: var(--link); }
.ac-tip { position: absolute; z-index: 50; left: var(--gutter); right: var(--gutter); padding: var(--space-3) 18px; border-radius: var(--r-md);
  background: var(--tip-bg); color: var(--tip-fg); box-shadow: var(--shadow-tip); font: 400 var(--fs-base)/var(--lh-base) var(--font);
  animation: ac-zoom var(--dur-fast) var(--ease-out); }

/* ---------- загрузка, успех, анимации ---------- */
.ac-spinner { width: var(--spinner); height: var(--spinner); animation: ac-spin 1s linear infinite; }
.ac-skeleton { display: inline-block; height: 1em; width: 120px; border-radius: 4px; background: var(--surface); animation: ac-pulse 2s cubic-bezier(.4,0,.6,1) infinite; }
.ac-indeterminate { position: relative; height: 4px; overflow: hidden; border-radius: var(--r-full); background: var(--track); }
.ac-indeterminate::after { content: ""; position: absolute; inset: 0; background: var(--primary); animation: ac-indet 1.1s var(--ease-inout) infinite; }
.ac-success { position: relative; width: 56px; height: 56px; margin: 0 auto var(--space-4); display: flex; align-items: center; justify-content: center; }
.ac-success::before { content: ""; position: absolute; inset: 0; border-radius: 50%; background: rgb(61 217 75 / .15); }
.ac-success::after { content: ""; position: absolute; inset: 0; border-radius: 50%; background: rgb(61 217 75 / .25); animation: ac-ripple 1.1s var(--ease-out) .35s both; }
.ac-success svg { position: relative; width: 28px; height: 28px; color: var(--ac-green-d30); }
.ac-success path { stroke-dasharray: 1; stroke-dashoffset: 1; animation: ac-draw .6s var(--ease-inout) .25s forwards; }  /* pathLength="1" */
.ac-step-enter { animation: ac-step var(--dur-step) var(--ease-out); }
@keyframes ac-step { from { opacity: 0; transform: translateY(8px); } }
@keyframes ac-zoom { from { opacity: 0; transform: scale(.95); } }
@keyframes ac-spin { to { transform: rotate(360deg); } }
@keyframes ac-pulse { 50% { opacity: .5; } }
@keyframes ac-draw { to { stroke-dashoffset: 0; } }
@keyframes ac-ripple { from { opacity: .45; transform: scale(1); } to { opacity: 0; transform: scale(1.5); } }
@keyframes ac-indet { from { transform: translateX(-100%) scaleX(.4); } to { transform: translateX(100%) scaleX(.4); } }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .ac-success path { stroke-dashoffset: 0; }
  .ac-spinner { animation: none; }   /* вместо вращения — статичная иконка + текст «Загрузка…» в sr-only */
}

/* ===================== dw-widget: additions to §2.2 ===================== */
[hidden] { display: none !important; }
.step { margin: 0; }
.ac-action { margin-top: var(--gap-action); }
.ac-field + .ac-chips, .ac-chips + .ac-field { margin-top: 0; }
.ac-alert > span { min-width: 0; }

/* Toncoin → GRAM notice: step 1 only, can be dismissed */
.ac-info { position: relative; padding-right: 48px; }
.ac-info__close { top: 50%; right: 2px; transform: translateY(-50%); }
.ac-info__title { margin-bottom: var(--space-1); }

/* summary: heading, note, tip */
.ac-summary { position: relative; }
.ac-summary__title { margin: 0 0 var(--space-2); font: 600 var(--fs-sm)/var(--lh-sm) var(--font); color: var(--text); }
.ac-summary .ac-rows { margin: 0; }
.ac-summary__row dd { display: inline-flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 0 var(--space-1); }
.ac-summary__note { margin: var(--space-2) 0 0; font: 400 var(--fs-xs)/var(--lh-xs) var(--font); color: var(--text-muted); }
.ac-summary .ac-tip { top: calc(100% + var(--space-2)); left: 0; right: 0; }

/* step 3: group headings with "Edit" */
.ac-rows-head { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); margin: 0 0 var(--space-1); }
.ac-rows-head h2 { margin: 0; font: 600 var(--fs-md)/var(--lh-md) var(--font); }
.ac-rows-head .ac-link, .ac-mini .ac-link { position: relative; font-size: var(--fs-sm); }
.ac-rows-head .ac-link::after { content: ""; position: absolute; inset: 50% auto auto 50%; transform: translate(-50%, -50%); width: max(100%, 44px); height: 44px; }

/* card check view */
.ac-verify__text { margin: 0 0 var(--space-2); font: 400 var(--fs-base)/var(--lh-base) var(--font); }
.ac-verify__why { margin: var(--space-2) 0 0; }
.ac-verify__why summary { display: inline; list-style: none; }
.ac-verify__why summary::-webkit-details-marker { display: none; }
.ac-verify__why .ac-checklist { margin-top: var(--space-2); }
.ac-verify__h { margin: var(--gap-section) 0 var(--space-3); font: 600 var(--fs-xl)/var(--lh-xl) var(--font); }
.ac-verify__how { display: flex; gap: var(--space-4); align-items: flex-start; }
.ac-verify__img { flex: none; border-radius: var(--r-md); }
[data-theme="dark"] .ac-verify__img { opacity: .85; }
.ac-verify .ac-field { margin-top: var(--gap-field); }
.ac-verify .ac-upload { margin-top: var(--gap-field); position: relative; }
.ac-verify .ac-upload > div { display: flex; flex-direction: column; align-items: center; gap: var(--space-2); width: 100%; }
.ac-verify .ac-upload label { position: relative; }
.ac-verify .ac-upload .ac-btn-row { width: 100%; }
.ac-verify__actions { display: flex; flex-direction: column; align-items: center; gap: var(--space-3); width: 100%; }
.ac-state__icon--fail { background: var(--danger-surface); color: var(--danger-text); }
.ac-state .ac-indeterminate { width: 100%; }
.ac-state .ac-alert { margin: 0; }
.ac-verify__rules { align-self: stretch; text-align: left; }           /* отказ: требования к фото */
.ac-verify__rules .ac-verify__h { margin-top: 0; font-size: var(--fs-md); line-height: var(--lh-md); }

/* step 4 */
.ac-order-head { display: flex; align-items: center; gap: var(--space-2); margin: 0 0 var(--space-4); font: 600 var(--fs-base)/var(--lh-base) var(--font); }
.ac-pay { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-2); margin: 0 0 var(--space-4); }
.ac-pay__until { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 var(--space-2); margin: 0; font: 600 var(--fs-lg)/var(--lh-lg) var(--font); }
/* продажа: адрес, комментарий, сумма — каждое строкой во всю ширину, слева, с кнопкой «Скопировать» */
.ac-transfer { display: flex; flex-direction: column; gap: var(--space-2); margin: 0 0 var(--space-4); }
.ac-transfer__item { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: var(--space-1) var(--space-3);
  padding: var(--space-3) var(--space-4); border-radius: var(--r-sm); background: var(--surface); }
.ac-transfer__label { grid-column: 1 / -1; font: 400 var(--fs-sm)/var(--lh-sm) var(--font); color: var(--text-2); }
.ac-transfer__value { min-width: 0; font: 600 var(--fs-lg)/var(--lh-lg) var(--font); overflow-wrap: anywhere; }
.ac-mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; font-size: 15px; font-weight: 500;
  letter-spacing: .02em; word-break: break-all; }
.ac-transfer .ac-alert { margin: 0; }
.ac-new { margin: var(--space-4) 0 0; text-align: center; }            /* «Новый обмен» ссылкой, пока заявка ждёт оплаты */
.ac-pay .ac-btn-note { align-self: stretch; }
.ac-timeline { margin: var(--space-4) 0; }

/* currency list in a dialog */
.ac-dialog__list { overflow-y: auto; padding: var(--space-3) 0 var(--space-2); }
.ac-opt .ac-badge { margin-left: var(--space-2); }

.ac-mini__sub + .ac-mini__sub { margin-top: var(--space-1); overflow-wrap: anywhere; }

/* currency badges: our own letter in a circle (no brand logos), as PaymentMethodIcon in AC */
.ac-cur { display: inline-flex; align-items: center; justify-content: center; flex: none; width: var(--icon-coin); height: var(--icon-coin);
  border-radius: 50%; background: var(--ac-gray-12); color: var(--ac-gray-70); font: 700 12px/1 var(--font); }
[data-theme="dark"] .ac-cur { background: var(--ac-gray-70); color: var(--ac-gray-0); }
.ac-cur--gram, [data-theme="dark"] .ac-cur--gram { background: var(--ac-blue); color: #fff; }
.ac-cur--usdt, [data-theme="dark"] .ac-cur--usdt { background: var(--badge-done-bg); color: var(--badge-done-fg); }
.ac-cur--not { background: var(--ac-gray-90); color: #fff; }
[data-theme="dark"] .ac-cur--not { background: var(--ac-gray-0); color: var(--ac-gray-90); }
.w h1 .ac-cur { margin-right: 5px; vertical-align: 3px; }                /* 22 у H1 шага 1 (04) */
.ac-chip .ac-cur { width: var(--icon); height: var(--icon); font-size: 10px; }
.ac-opt .ac-cur { width: 32px; height: 32px; font-size: 15px; }

/* ---------- активная заявка и «Мои заявки» на шаге 1 (01-ux §2.9) ---------- */
.ac-active { align-items: baseline; justify-content: space-between; flex-wrap: wrap; padding-right: 18px; }
.ac-active .ac-link { white-space: nowrap; }
.ac-history { margin-top: var(--gap-section); }
.ac-orders { margin: var(--space-2) 0 0; padding: 0; list-style: none; }
.ac-orders a { display: grid; grid-template-columns: 1fr auto; gap: 2px var(--space-3); padding: var(--space-2) 0;
  border-top: var(--border) solid var(--line); color: inherit; text-decoration: none; font: 400 var(--fs-sm)/var(--lh-sm) var(--font); }
.ac-orders li:first-child a { border-top: 0; }
.ac-orders__main { font-weight: 600; color: var(--text); overflow-wrap: anywhere; }
.ac-orders__sub { color: var(--text-muted); }
.ac-orders .ac-badge { grid-row: span 2; align-self: center; grid-column: 2; grid-row-start: 1; }
@media (hover: hover) { .ac-orders a:hover .ac-orders__main { color: var(--link-hover); } }

/* ---------- шаг 4: финальные статусы ---------- */
.ac-final { margin: 0 0 var(--space-4); text-align: center; }
.ac-final p { margin: 0 0 var(--space-4); font: 400 var(--fs-md)/var(--lh-md) var(--font); }
.ac-final .ac-btn + .ac-btn { margin-top: var(--space-2); }
